@mercurjs/admin 2.2.0-canary.3 → 2.2.0-canary.31

package/dist/{chunk-2S6VXFBZ.js → chunk-XBMSMHRJ.js}

@@ -8,16 +8,13 @@ import {
 import {
   _DataTable,
   useDataTable
-} from "./chunk-NQEXDLYH.js";
+} from "./chunk-JGCGVEFZ.js";
 import {
   SingleColumnPage
 } from "./chunk-H6MYB7GB.js";
 import {
   useCurrencies
 } from "./chunk-DAXXLQKB.js";
-import {
-  useStockLocation
-} from "./chunk-EPHVGD5Z.js";
 import {
   useRegion
 } from "./chunk-ESPLVOFC.js";
@@ -28,12 +25,15 @@ import {
 import {
   usePricePreferences
 } from "./chunk-VDKOJ5WD.js";
+import {
+  useStockLocation
+} from "./chunk-EPHVGD5Z.js";
 import {
   ActionMenu
 } from "./chunk-BDGZ4EQO.js";
 import {
   useSalesChannel
-} from "./chunk-S5BJ5CMF.js";
+} from "./chunk-XKRR5ALR.js";
 import {
   SingleColumnPageSkeleton
 } from "./chunk-INNFZYX2.js";

package/dist/chunk-XGWYGDQN.js

@@ -0,0 +1,213 @@
+import {
+  AttributeValueInput
+} from "./chunk-5K5VNKSE.js";
+import {
+  TabbedForm,
+  defineTabMeta,
+  useTabbedForm
+} from "./chunk-FREUYHMS.js";
+import {
+  RouteFocusModal,
+  useRouteModal
+} from "./chunk-FWJLS7XD.js";
+import {
+  Form
+} from "./chunk-3QSRE5LS.js";
+import {
+  PRODUCT_DETAIL_QUERY
+} from "./chunk-46MOMKPW.js";
+import {
+  require_dist
+} from "./chunk-YZBEJ3CY.js";
+import {
+  useCreateProductVariant,
+  useProduct
+} from "./chunk-AM5XDEIN.js";
+import {
+  __toESM
+} from "./chunk-NBMM2TZK.js";
+
+// src/pages/products/product-create-variant/components/create-product-variant-form/constants.ts
+import { z } from "zod";
+var CreateProductVariantSchema = z.object({
+  title: z.string().min(1),
+  sku: z.string().optional(),
+  options: z.record(z.string()).optional()
+});
+var CreateVariantDetailsSchema = CreateProductVariantSchema.pick({
+  title: true,
+  sku: true,
+  options: true
+});
+var CreateVariantDetailsFields = Object.keys(
+  CreateVariantDetailsSchema.shape
+);
+
+// src/pages/products/product-create-variant/product-create-variant.tsx
+import { Children as Children2 } from "react";
+import { useParams } from "react-router-dom";
+
+// src/pages/products/product-create-variant/components/create-product-variant-form/create-product-variant-form.tsx
+import { zodResolver } from "@hookform/resolvers/zod";
+import { toast } from "@medusajs/ui";
+import { Children, useMemo } from "react";
+import { useForm } from "react-hook-form";
+
+// src/pages/products/product-create-variant/components/create-product-variant-form/details-tab.tsx
+var import_types = __toESM(require_dist(), 1);
+import { Heading, Input } from "@medusajs/ui";
+import { useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
+function DetailsTab({ product }) {
+  const { t } = useTranslation();
+  const form = useTabbedForm();
+  const variantAttributes = product.attributes?.filter((a) => a.is_variant_axis) ?? [];
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", "data-testid": "product-variant-create-form-details-tab", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8 px-8 py-16", children: [
+    /* @__PURE__ */ jsx(Heading, { level: "h1", "data-testid": "product-variant-create-form-details-heading", children: t("products.variant.create.header") }),
+    /* @__PURE__ */ jsxs("div", { className: "my-8 grid grid-cols-1 gap-4 md:grid-cols-2", children: [
+      /* @__PURE__ */ jsx(
+        Form.Field,
+        {
+          control: form.control,
+          name: "title",
+          render: ({ field }) => {
+            return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "product-variant-create-form-title-item", children: [
+              /* @__PURE__ */ jsx(Form.Label, { "data-testid": "product-variant-create-form-title-label", children: t("fields.title") }),
+              /* @__PURE__ */ jsx(Form.Control, { "data-testid": "product-variant-create-form-title-control", children: /* @__PURE__ */ jsx(Input, { ...field, "data-testid": "product-variant-create-form-title-input" }) }),
+              /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "product-variant-create-form-title-error" })
+            ] });
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Form.Field,
+        {
+          control: form.control,
+          name: "sku",
+          render: ({ field }) => {
+            return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "product-variant-create-form-sku-item", children: [
+              /* @__PURE__ */ jsx(Form.Label, { optional: true, "data-testid": "product-variant-create-form-sku-label", children: t("fields.sku") }),
+              /* @__PURE__ */ jsx(Form.Control, { "data-testid": "product-variant-create-form-sku-control", children: /* @__PURE__ */ jsx(Input, { ...field, "data-testid": "product-variant-create-form-sku-input" }) }),
+              /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "product-variant-create-form-sku-error" })
+            ] });
+          }
+        }
+      ),
+      variantAttributes.map((attribute) => {
+        const fieldKey = attribute.handle ?? attribute.id;
+        return /* @__PURE__ */ jsx(
+          Form.Field,
+          {
+            control: form.control,
+            name: `options.${fieldKey}`,
+            render: ({ field: { value, onChange } }) => {
+              return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": `product-variant-create-form-attribute-${attribute.id}-item`, children: [
+                /* @__PURE__ */ jsx(Form.Label, { "data-testid": `product-variant-create-form-attribute-${attribute.id}-label`, children: attribute.name }),
+                /* @__PURE__ */ jsx(Form.Control, { "data-testid": `product-variant-create-form-attribute-${attribute.id}-control`, children: /* @__PURE__ */ jsx(
+                  AttributeValueInput,
+                  {
+                    type: import_types.AttributeType.SINGLE_SELECT,
+                    value: typeof value === "string" ? value : "",
+                    onChange,
+                    availableValues: (attribute.values ?? []).map((v) => ({
+                      id: v.id,
+                      name: v.name
+                    }))
+                  }
+                ) }),
+                /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": `product-variant-create-form-attribute-${attribute.id}-error` })
+              ] });
+            }
+          },
+          attribute.id
+        );
+      })
+    ] })
+  ] }) });
+}
+DetailsTab._tabMeta = defineTabMeta({
+  id: "detail",
+  labelKey: "priceLists.create.tabs.details",
+  validationFields: ["title", "sku", "options"]
+});
+var details_tab_default = DetailsTab;
+
+// src/pages/products/product-create-variant/components/create-product-variant-form/create-product-variant-form.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var CREATE_VARIANT_DEFAULTS = {
+  sku: "",
+  title: "",
+  options: {}
+};
+var CreateProductVariantForm = ({
+  product,
+  children,
+  schema,
+  defaultValues: extraDefaults
+}) => {
+  const { handleSuccess } = useRouteModal();
+  const form = useForm({
+    defaultValues: {
+      ...CREATE_VARIANT_DEFAULTS,
+      ...extraDefaults
+    },
+    resolver: zodResolver(schema ?? CreateProductVariantSchema)
+  });
+  const { mutateAsync, isPending } = useCreateProductVariant(product.id);
+  const variantAttributes = product.attributes?.filter((a) => a.is_variant_axis) ?? [];
+  const handleSubmit = form.handleSubmit(async (data) => {
+    const { title, options } = data;
+    const cleanedOptions = variantAttributes.reduce(
+      (acc, attr) => {
+        const fieldKey = attr.handle ?? attr.id;
+        const v = options?.[fieldKey];
+        if (v && attr.name) acc[attr.name] = v;
+        return acc;
+      },
+      {}
+    );
+    await mutateAsync(
+      {
+        title,
+        options: Object.keys(cleanedOptions).length ? cleanedOptions : void 0
+      },
+      {
+        onSuccess: () => {
+          handleSuccess();
+        },
+        onError: (error) => {
+          toast.error(error.message);
+        }
+      }
+    );
+  });
+  const defaultTabs = useMemo(
+    () => [/* @__PURE__ */ jsx2(details_tab_default, { product }, "details")],
+    [product]
+  );
+  const hasCustomChildren = Children.count(children) > 0;
+  return /* @__PURE__ */ jsx2(TabbedForm, { form, onSubmit: handleSubmit, isLoading: isPending, children: hasCustomChildren ? children : defaultTabs });
+};
+
+// src/pages/products/product-create-variant/product-create-variant.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Root = ({ children }) => {
+  const { id } = useParams();
+  const { product, isLoading, isError, error } = useProduct(id, PRODUCT_DETAIL_QUERY);
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx3(RouteFocusModal, { prev: "../..", children: !isLoading && product && (Children2.count(children) > 0 ? children : /* @__PURE__ */ jsx3(CreateProductVariantForm, { product })) });
+};
+var ProductCreateVariantPage = Object.assign(Root, {
+  Form: CreateProductVariantForm,
+  DetailsTab: details_tab_default,
+  Tab: TabbedForm.Tab
+});
+var ProductCreateVariant = Root;
+
+export {
+  CreateProductVariantSchema,
+  ProductCreateVariantPage,
+  ProductCreateVariant
+};

package/dist/{chunk-LYZDVZWA.js → chunk-XH5GIQOS.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-THHRRYRS.js";
 
 // src/hooks/table/query/use-product-table-query.tsx
-var DEFAULT_FIELDS = "id,title,handle,status,*collection,*categories,variants.id,thumbnail,*sellers";
+var DEFAULT_FIELDS = "id,title,handle,status,*collection,*categories,variants.id,thumbnail";
 var useProductTableQuery = ({
   prefix,
   pageSize = 20

package/dist/{chunk-I5THQVYP.js → chunk-XIFE4VUR.js}

@@ -1,6 +1,6 @@
 import {
   useCustomerGroups
-} from "./chunk-PRBE5CM3.js";
+} from "./chunk-QYDWMBEX.js";
 
 // src/hooks/table/filters/use-customer-table-filters.tsx
 import { useTranslation } from "react-i18next";

package/dist/{chunk-S5BJ5CMF.js → chunk-XKRR5ALR.js}

@@ -1,6 +1,6 @@
 import {
   productsQueryKeys
-} from "./chunk-2YYXP6XI.js";
+} from "./chunk-AM5XDEIN.js";
 import {
   queryClient
 } from "./chunk-RHKRREUU.js";

package/dist/{chunk-AMOSVDPE.js → chunk-XNGAFAQ7.js}

@@ -1,16 +1,20 @@
+import {
+  getCollectionGallery,
+  getCollectionIcon
+} from "./chunk-BN6OOLJA.js";
 import {
   useProductTableColumns
-} from "./chunk-DQGGJSOO.js";
+} from "./chunk-SU444Q24.js";
 import {
   useProductTableFilters
-} from "./chunk-R2MI5GL4.js";
+} from "./chunk-GK6V5XL3.js";
 import {
   useProductTableQuery
-} from "./chunk-LYZDVZWA.js";
+} from "./chunk-XH5GIQOS.js";
 import {
   _DataTable,
   useDataTable
-} from "./chunk-NQEXDLYH.js";
+} from "./chunk-JGCGVEFZ.js";
 import {
   SingleColumnPage
 } from "./chunk-H6MYB7GB.js";
@@ -18,7 +22,7 @@ import {
   useCollection,
   useDeleteCollection,
   useUpdateCollectionProducts
-} from "./chunk-XZZTC7E5.js";
+} from "./chunk-Q5HXKDZG.js";
 import {
   ActionMenu
 } from "./chunk-BDGZ4EQO.js";
@@ -27,7 +31,7 @@ import {
 } from "./chunk-INNFZYX2.js";
 import {
   useProducts
-} from "./chunk-2YYXP6XI.js";
+} from "./chunk-AM5XDEIN.js";
 
 // src/pages/collections/collection-detail/collection-detail.tsx
 import { Children } from "react";
@@ -101,19 +105,142 @@ var CollectionGeneralSection = ({
   ] });
 };
 
+// src/pages/collections/collection-detail/components/collection-icon-section/collection-icon-section.tsx
+import { PencilSquare as PencilSquare2 } from "@medusajs/icons";
+import { Container as Container2, Heading as Heading2, Text as Text2 } from "@medusajs/ui";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var CollectionIconSection = ({
+  collection
+}) => {
+  const { t } = useTranslation2();
+  const icon = getCollectionIcon(collection.media_images);
+  return /* @__PURE__ */ jsxs2(Container2, { className: "divide-y p-0", "data-testid": "collection-icon-section", children: [
+    /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsx2(Heading2, { level: "h2", children: t("collections.icon.label") }),
+      /* @__PURE__ */ jsx2(
+        ActionMenu,
+        {
+          groups: [
+            {
+              actions: [
+                {
+                  label: t("actions.edit"),
+                  icon: /* @__PURE__ */ jsx2(PencilSquare2, {}),
+                  to: "icon/edit"
+                }
+              ]
+            }
+          ],
+          "data-testid": "collection-icon-section-menu"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx2("div", { className: "px-6 py-4", children: icon ? /* @__PURE__ */ jsx2("div", { className: "bg-ui-bg-base shadow-elevation-card-rest relative aspect-square w-24 overflow-hidden rounded-[8px]", children: /* @__PURE__ */ jsx2(
+      "img",
+      {
+        src: icon.url,
+        alt: "",
+        className: "size-full object-contain object-center p-2",
+        "data-testid": "collection-icon-section-image"
+      }
+    ) }) : /* @__PURE__ */ jsxs2("div", { className: "flex flex-col items-center justify-center gap-y-1 py-8", children: [
+      /* @__PURE__ */ jsx2(
+        Text2,
+        {
+          size: "small",
+          leading: "compact",
+          weight: "plus",
+          className: "text-ui-fg-subtle",
+          children: t("collections.icon.empty.header")
+        }
+      ),
+      /* @__PURE__ */ jsx2(Text2, { size: "small", className: "text-ui-fg-muted", children: t("collections.icon.empty.description") })
+    ] }) })
+  ] });
+};
+
+// src/pages/collections/collection-detail/components/collection-media-section/collection-media-section.tsx
+import { FeaturedBadge, PencilSquare as PencilSquare3, ThumbnailBadge } from "@medusajs/icons";
+import { Container as Container3, Heading as Heading3, Text as Text3, Tooltip } from "@medusajs/ui";
+import { useTranslation as useTranslation3 } from "react-i18next";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var CollectionMediaSection = ({
+  collection
+}) => {
+  const { t } = useTranslation3();
+  const gallery = getCollectionGallery(collection.media_images);
+  return /* @__PURE__ */ jsxs3(Container3, { className: "divide-y p-0", "data-testid": "collection-media-section", children: [
+    /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsx3(Heading3, { level: "h2", children: t("collections.media.label") }),
+      /* @__PURE__ */ jsx3(
+        ActionMenu,
+        {
+          groups: [
+            {
+              actions: [
+                {
+                  label: t("actions.edit"),
+                  icon: /* @__PURE__ */ jsx3(PencilSquare3, {}),
+                  to: "media?view=edit"
+                }
+              ]
+            }
+          ],
+          "data-testid": "collection-media-section-menu"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx3("div", { className: "px-6 py-4", children: gallery.length > 0 ? /* @__PURE__ */ jsx3("div", { className: "grid grid-cols-[repeat(auto-fill,minmax(96px,1fr))] gap-4", children: gallery.map((image) => /* @__PURE__ */ jsxs3(
+      "div",
+      {
+        className: "shadow-elevation-card-rest relative aspect-square size-full overflow-hidden rounded-[8px]",
+        "data-testid": `collection-media-section-item-${image.id}`,
+        children: [
+          /* @__PURE__ */ jsx3(
+            "img",
+            {
+              src: image.url,
+              alt: "",
+              className: "size-full object-cover object-center"
+            }
+          ),
+          (image.is_thumbnail || image.is_banner) && /* @__PURE__ */ jsxs3("div", { className: "absolute left-2 top-2 flex items-center gap-x-1", children: [
+            image.is_thumbnail && /* @__PURE__ */ jsx3(Tooltip, { content: t("collections.media.thumbnail"), children: /* @__PURE__ */ jsx3(ThumbnailBadge, {}) }),
+            image.is_banner && /* @__PURE__ */ jsx3(Tooltip, { content: t("collections.media.banner"), children: /* @__PURE__ */ jsx3(FeaturedBadge, { className: "text-ui-fg-interactive" }) })
+          ] })
+        ]
+      },
+      image.id
+    )) }) : /* @__PURE__ */ jsxs3("div", { className: "flex flex-col items-center justify-center gap-y-1 py-8", children: [
+      /* @__PURE__ */ jsx3(
+        Text3,
+        {
+          size: "small",
+          leading: "compact",
+          weight: "plus",
+          className: "text-ui-fg-subtle",
+          children: t("collections.media.empty.header")
+        }
+      ),
+      /* @__PURE__ */ jsx3(Text3, { size: "small", className: "text-ui-fg-muted", children: t("collections.media.empty.description") })
+    ] }) })
+  ] });
+};
+
 // src/pages/collections/collection-detail/components/collection-product-section/collection-product-section.tsx
-import { PencilSquare as PencilSquare2, Plus, Trash as Trash2 } from "@medusajs/icons";
-import { Checkbox, Container as Container2, Heading as Heading2, toast, usePrompt as usePrompt2 } from "@medusajs/ui";
+import { PencilSquare as PencilSquare4, Plus, Trash as Trash2 } from "@medusajs/icons";
+import { Checkbox, Container as Container4, Heading as Heading4, toast, usePrompt as usePrompt2 } from "@medusajs/ui";
 import { keepPreviousData } from "@tanstack/react-query";
 import { createColumnHelper } from "@tanstack/react-table";
 import { useMemo } from "react";
-import { useTranslation as useTranslation2 } from "react-i18next";
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { useTranslation as useTranslation4 } from "react-i18next";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var PAGE_SIZE = 10;
 var CollectionProductSection = ({
   collection
 }) => {
-  const { t } = useTranslation2();
+  const { t } = useTranslation4();
   const { searchParams, raw } = useProductTableQuery({ pageSize: PAGE_SIZE });
   const { products, count, isLoading, isError, error } = useProducts(
     {
@@ -175,17 +302,17 @@ var CollectionProductSection = ({
   if (isError) {
     throw error;
   }
-  return /* @__PURE__ */ jsxs2(Container2, { className: "divide-y p-0", children: [
-    /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between px-6 py-4", children: [
-      /* @__PURE__ */ jsx2(Heading2, { level: "h2", children: t("products.domain") }),
-      /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsxs4(Container4, { className: "divide-y p-0", children: [
+    /* @__PURE__ */ jsxs4("div", { className: "flex items-center justify-between px-6 py-4", children: [
+      /* @__PURE__ */ jsx4(Heading4, { level: "h2", children: t("products.domain") }),
+      /* @__PURE__ */ jsx4(
         ActionMenu,
         {
           groups: [
             {
               actions: [
                 {
-                  icon: /* @__PURE__ */ jsx2(Plus, {}),
+                  icon: /* @__PURE__ */ jsx4(Plus, {}),
                   label: t("actions.add"),
                   to: "products"
                 }
@@ -195,7 +322,7 @@ var CollectionProductSection = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx2(
+    /* @__PURE__ */ jsx4(
       _DataTable,
       {
         table,
@@ -231,7 +358,7 @@ var ProductActions = ({
   product,
   collectionId
 }) => {
-  const { t } = useTranslation2();
+  const { t } = useTranslation4();
   const prompt = usePrompt2();
   const { mutateAsync } = useUpdateCollectionProducts(collectionId);
   const handleRemove = async () => {
@@ -264,14 +391,14 @@ var ProductActions = ({
       }
     );
   };
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx4(
     ActionMenu,
     {
       groups: [
         {
           actions: [
             {
-              icon: /* @__PURE__ */ jsx2(PencilSquare2, {}),
+              icon: /* @__PURE__ */ jsx4(PencilSquare4, {}),
               label: t("actions.edit"),
               to: `/products/${product.id}/edit`
             }
@@ -280,7 +407,7 @@ var ProductActions = ({
         {
           actions: [
             {
-              icon: /* @__PURE__ */ jsx2(Trash2, {}),
+              icon: /* @__PURE__ */ jsx4(Trash2, {}),
               label: t("actions.remove"),
               onClick: handleRemove
             }
@@ -298,7 +425,7 @@ var useColumns = () => {
       columnHelper.display({
         id: "select",
         header: ({ table }) => {
-          return /* @__PURE__ */ jsx2(
+          return /* @__PURE__ */ jsx4(
             Checkbox,
             {
               checked: table.getIsSomePageRowsSelected() ? "indeterminate" : table.getIsAllPageRowsSelected(),
@@ -307,7 +434,7 @@ var useColumns = () => {
           );
         },
         cell: ({ row }) => {
-          return /* @__PURE__ */ jsx2(
+          return /* @__PURE__ */ jsx4(
             Checkbox,
             {
               checked: row.getIsSelected(),
@@ -324,7 +451,7 @@ var useColumns = () => {
         id: "actions",
         cell: ({ row, table }) => {
           const { collectionId } = table.options.meta;
-          return /* @__PURE__ */ jsx2(
+          return /* @__PURE__ */ jsx4(
             ProductActions,
             {
               product: row.original,
@@ -339,7 +466,7 @@ var useColumns = () => {
 };
 
 // src/pages/collections/collection-detail/collection-detail.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 var Root = ({ children }) => {
   const initialData = useLoaderData();
   const { id } = useParams();
@@ -351,18 +478,22 @@ var Root = ({ children }) => {
     }
   );
   if (isLoading || !collection) {
-    return /* @__PURE__ */ jsx3(SingleColumnPageSkeleton, { sections: 2, showJSON: true, showMetadata: true });
+    return /* @__PURE__ */ jsx5(SingleColumnPageSkeleton, { sections: 4, showJSON: true, showMetadata: true });
   }
   if (isError) {
     throw error;
   }
-  return Children.count(children) > 0 ? /* @__PURE__ */ jsx3(SingleColumnPage, { showJSON: true, showMetadata: true, data: collection, children }) : /* @__PURE__ */ jsxs3(SingleColumnPage, { showJSON: true, showMetadata: true, data: collection, children: [
-    /* @__PURE__ */ jsx3(CollectionGeneralSection, { collection }),
-    /* @__PURE__ */ jsx3(CollectionProductSection, { collection })
+  return Children.count(children) > 0 ? /* @__PURE__ */ jsx5(SingleColumnPage, { showJSON: true, showMetadata: true, data: collection, children }) : /* @__PURE__ */ jsxs5(SingleColumnPage, { showJSON: true, showMetadata: true, data: collection, children: [
+    /* @__PURE__ */ jsx5(CollectionGeneralSection, { collection }),
+    /* @__PURE__ */ jsx5(CollectionMediaSection, { collection }),
+    /* @__PURE__ */ jsx5(CollectionIconSection, { collection }),
+    /* @__PURE__ */ jsx5(CollectionProductSection, { collection })
   ] });
 };
 var CollectionDetailPage = Object.assign(Root, {
   GeneralSection: CollectionGeneralSection,
+  MediaSection: CollectionMediaSection,
+  IconSection: CollectionIconSection,
   ProductSection: CollectionProductSection
 });
 

package/dist/chunk-Y3RABQC4.js

@@ -0,0 +1,33 @@
+// src/pages/categories/category-create/components/create-category-form/schema.ts
+import { z } from "zod";
+var CategoryMediaSchema = z.object({
+  url: z.string(),
+  file: z.any().nullable(),
+  // File
+  is_thumbnail: z.boolean(),
+  is_banner: z.boolean(),
+  field_id: z.string().optional()
+});
+var CategoryIconSchema = z.object({
+  url: z.string(),
+  file: z.any().nullable()
+  // File
+});
+var CreateCategoryDetailsSchema = z.object({
+  name: z.string().min(1),
+  description: z.string().optional(),
+  handle: z.string().optional(),
+  status: z.enum(["active", "inactive"]),
+  visibility: z.enum(["public", "internal"]),
+  media: z.array(CategoryMediaSchema).optional(),
+  icon: CategoryIconSchema.nullable().optional()
+});
+var CreateCategorySchema = z.object({
+  rank: z.number().nullable(),
+  parent_category_id: z.string().nullable()
+}).merge(CreateCategoryDetailsSchema);
+
+export {
+  CategoryIconSchema,
+  CreateCategorySchema
+};

package/dist/{chunk-P25PIADJ.js → chunk-Y7KAW3E7.js}

@@ -1,6 +1,6 @@
 import {
   getPromotionStatus
-} from "./chunk-AB2LHP3M.js";
+} from "./chunk-3KL4OL3I.js";
 import {
   TextCell,
   TextHeader