refactor shopify storefront

components/commerce/collection-grid.editor.tsx

@@ -0,0 +1,31 @@
+import { ComponentConfig } from "@reacteditor/core";
+import { FolderOpen } from "lucide-react";
+import { CollectionGrid, type CollectionGridProps } from "@/components/commerce/collection-grid";
+
+export const collectionGridEditor: ComponentConfig<CollectionGridProps> = {
+  label: "Collections",
+  icon: <FolderOpen size={16} />,
+  category: "commerce",
+  defaultProps: {
+    tagline: "Shop by collection",
+    heading: "Curated edits",
+    subheading: "Bundles built around the way you actually live.",
+    layout: "tiles",
+    limit: 6,
+  },
+  fields: {
+    tagline: { label: "Tagline", type: "text", contentEditable: true },
+    heading: { label: "Heading", type: "text", contentEditable: true },
+    subheading: { label: "Subheading", type: "textarea", contentEditable: true },
+    layout: {
+      label: "Layout",
+      type: "radio",
+      options: [
+        { label: "Tiles", value: "tiles" },
+        { label: "Editorial", value: "editorial" },
+      ],
+    },
+    limit: { label: "Limit", type: "number", min: 2, max: 12 },
+  },
+  render: (props) => <CollectionGrid {...props} />,
+};