Files
react-editor-shopify/components/navigation/navigation.editor.tsx
Rami Bitar 564c98c805 Consolidate theme radius/shadow props and make rounded utilities responsive
- Remove duplicate roundedness/shadowLevel props (keep radius/shadow)
- Switch globals.css radius scale to proportional (square→pill works)
- Replace rounded-full with rounded-md on theme-driven elements
- Remove banner props from Navigation, drop publishing overlay

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-08 10:01:55 -04:00

75 lines
2.1 KiB
TypeScript

import { ComponentConfig } from "@reacteditor/core";
import { Menu as MenuIcon } from "lucide-react";
import { imageField } from "@reacteditor/plugin-media/field";
import { Navigation, type NavigationProps } from "@/components/navigation/navigation";
import { frontendAiMediaAdapter } from "@/services/media-adapter";
export const navigationEditor: ComponentConfig<NavigationProps> = {
label: "Navigation",
icon: <MenuIcon size={16} />,
category: "navigation",
global: true,
defaultProps: {
brand: "Maison",
logo: "",
links: [
{ label: "Shop", href: "/collections" },
{ label: "Lookbook", href: "/lookbook" },
{ label: "Journal", href: "/journal" },
{ label: "About", href: "/about" },
],
showSearch: "yes",
showCart: "yes",
sticky: "yes",
tone: "default",
},
fields: {
brand: { label: "Brand", type: "text", contentEditable: true },
logo: { label: "Logo", ...imageField({ adapter: frontendAiMediaAdapter }) },
links: {
label: "Links",
type: "array",
defaultItemProps: { label: "Link", href: "/" },
getItemSummary: (it) => it?.label || "Link",
arrayFields: {
label: { label: "Label", type: "text", contentEditable: true },
href: { label: "Link", type: "text" },
},
},
showSearch: {
label: "Search icon",
type: "radio",
options: [
{ label: "Show", value: "yes" },
{ label: "Hide", value: "no" },
],
},
showCart: {
label: "Cart icon",
type: "radio",
options: [
{ label: "Show", value: "yes" },
{ label: "Hide", value: "no" },
],
},
sticky: {
label: "Position",
type: "radio",
options: [
{ label: "Sticky", value: "yes" },
{ label: "Static", value: "no" },
],
},
tone: {
label: "Tone",
type: "select",
options: [
{ label: "Default", value: "default" },
{ label: "Muted", value: "muted" },
{ label: "Inverse (dark)", value: "inverse" },
],
},
},
render: (props) => <Navigation {...props} />,
};