refactor shopify storefront

2026-05-05 13:42:40 -04:00
parent ba8826030c
commit 62fbdead87
156 changed files with 1688 additions and 8293 deletions
--- a/components/navigation/navigation.editor.tsx
+++ b/components/navigation/navigation.editor.tsx
@@ -0,0 +1,86 @@
+import { ComponentConfig } from "@reacteditor/core";
+import { Menu as MenuIcon } from "lucide-react";
+import { Navigation, type NavigationProps } from "@/components/navigation/navigation";
+
+export const navigationEditor: ComponentConfig<NavigationProps> = {
+  label: "Navigation",
+  icon: <MenuIcon size={16} />,
+  category: "navigation",
+  global: true,
+  defaultProps: {
+    brand: "Maison",
+    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",
+    bannerText: "",
+    bannerTone: "accent",
+  },
+  fields: {
+    brand: { label: "Brand", type: "text", contentEditable: true },
+    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" },
+      },
+    },
+    bannerText: {
+      label: "Banner text",
+      type: "text",
+      contentEditable: true,
+    },
+    bannerTone: {
+      label: "Banner tone",
+      type: "select",
+      options: [
+        { label: "Default", value: "default" },
+        { label: "Accent", value: "accent" },
+        { label: "Inverse (dark)", value: "inverse" },
+      ],
+    },
+    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} />,
+};