use default exports and not named exports

components/commerce/featured-product.editor.tsx

@@ -2,10 +2,7 @@ import { ComponentConfig } from "@reacteditor/core";
 import { Star } from "lucide-react";
 import { FeaturedProductView, type FeaturedProductProps } from "@/components/commerce/featured-product";
 
-export function createFeaturedProductEditor(opts: {
-  productField: any;
-}): ComponentConfig<FeaturedProductProps> {
-  return {
+const featuredProductEditor: ComponentConfig<FeaturedProductProps> = {
     label: "Featured product",
     icon: <Star size={16} />,
     category: "commerce",
@@ -17,7 +14,7 @@ export function createFeaturedProductEditor(opts: {
       tone: "default",
     },
     fields: {
-      product: { label: "Product", ...opts.productField },
+      product: { label: "Product", type: "shopifyProduct" } as any,
       tagline: { label: "Tagline", type: "text", contentEditable: true },
       ctaLabel: { label: "CTA label", type: "text", contentEditable: true },
       align: {
@@ -38,5 +35,6 @@ export function createFeaturedProductEditor(opts: {
       },
     },
     render: (props) => <FeaturedProductView {...props} />,
-  };
-}
+};
+
+export default featuredProductEditor;