@mercurjs/admin 2.0.0-canary.100

package/dist/chunk-ZNA2XOGX.js

@@ -0,0 +1,675 @@
+import {
+  PRODUCT_DETAIL_QUERY
+} from "./chunk-35NDMIYZ.js";
+import {
+  DataGrid,
+  createDataGridHelper,
+  createDataGridPriceColumns
+} from "./chunk-U3OWJE7V.js";
+import {
+  useComboboxData
+} from "./chunk-AEFDAU3Y.js";
+import {
+  Combobox
+} from "./chunk-AW77UWCZ.js";
+import {
+  optionalInt
+} from "./chunk-UXD3VNBO.js";
+import {
+  castNumber
+} from "./chunk-SMQT3ZNO.js";
+import {
+  TabbedForm,
+  defineTabMeta,
+  useTabbedForm
+} from "./chunk-XSEF6KRY.js";
+import {
+  RouteFocusModal,
+  useRouteModal
+} from "./chunk-V6LO4BXB.js";
+import {
+  Form
+} from "./chunk-3QSRE5LS.js";
+import {
+  useRegions
+} from "./chunk-VHCDSNXF.js";
+import {
+  useStore
+} from "./chunk-EJY35WBK.js";
+import {
+  usePricePreferences
+} from "./chunk-GYRTURN7.js";
+import {
+  useCreateProductVariant,
+  useProduct
+} from "./chunk-WBNGBRBK.js";
+import {
+  sdk
+} from "./chunk-LXZXXOJ3.js";
+
+// src/pages/products/product-create-variant/components/create-product-variant-form/constants.ts
+import { z } from "zod";
+import * as zod from "zod";
+var CreateProductVariantSchema = z.object({
+  title: z.string().min(1),
+  sku: z.string().optional(),
+  manage_inventory: z.boolean().optional(),
+  allow_backorder: z.boolean().optional(),
+  inventory_kit: z.boolean().optional(),
+  options: z.record(z.string()),
+  prices: zod.record(zod.string(), zod.string().or(zod.number()).optional()).optional(),
+  inventory: z.array(
+    z.object({
+      inventory_item_id: z.string(),
+      required_quantity: optionalInt
+    })
+  ).optional()
+});
+var CreateVariantDetailsSchema = CreateProductVariantSchema.pick({
+  title: true,
+  sku: true,
+  manage_inventory: true,
+  allow_backorder: true,
+  inventory_kit: true,
+  options: true
+});
+var CreateVariantDetailsFields = Object.keys(
+  CreateVariantDetailsSchema.shape
+);
+var CreateVariantPriceSchema = CreateProductVariantSchema.pick({
+  prices: true
+});
+var CreateVariantPriceFields = Object.keys(
+  CreateVariantPriceSchema.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, useCallback, useEffect, useMemo as useMemo2 } from "react";
+import { useFieldArray as useFieldArray2, useForm, useWatch as useWatch3 } from "react-hook-form";
+
+// src/pages/products/product-create-variant/components/create-product-variant-form/details-tab.tsx
+import { Heading, Input, Switch } from "@medusajs/ui";
+import { useWatch } from "react-hook-form";
+import { useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
+function DetailsTab({ product }) {
+  const { t } = useTranslation();
+  const form = useTabbedForm();
+  const manageInventoryEnabled = useWatch({
+    control: form.control,
+    name: "manage_inventory"
+  });
+  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" })
+            ] });
+          }
+        }
+      ),
+      product.options?.map((option) => /* @__PURE__ */ jsx(
+        Form.Field,
+        {
+          control: form.control,
+          name: `options.${option.title}`,
+          render: ({ field: { value, onChange, ...field } }) => {
+            return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": `product-variant-create-form-option-${option.title}-item`, children: [
+              /* @__PURE__ */ jsx(Form.Label, { "data-testid": `product-variant-create-form-option-${option.title}-label`, children: option.title }),
+              /* @__PURE__ */ jsx(Form.Control, { "data-testid": `product-variant-create-form-option-${option.title}-control`, children: /* @__PURE__ */ jsx(
+                Combobox,
+                {
+                  value,
+                  onChange: (v) => {
+                    onChange(v);
+                  },
+                  ...field,
+                  options: option.values.map((v) => ({
+                    label: v.value,
+                    value: v.value
+                  })),
+                  "data-testid": `product-variant-create-form-option-${option.title}-combobox`
+                }
+              ) }),
+              /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": `product-variant-create-form-option-${option.title}-error` })
+            ] });
+          }
+        },
+        option.id
+      ))
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsx(
+        Form.Field,
+        {
+          control: form.control,
+          name: "manage_inventory",
+          render: ({ field: { value, onChange, ...field } }) => {
+            return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "product-variant-create-form-manage-inventory-item", children: [
+              /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-component shadow-elevation-card-rest flex gap-x-3 rounded-lg p-4", "data-testid": "product-variant-create-form-manage-inventory-container", children: [
+                /* @__PURE__ */ jsx(Form.Control, { "data-testid": "product-variant-create-form-manage-inventory-control", children: /* @__PURE__ */ jsx(
+                  Switch,
+                  {
+                    dir: "ltr",
+                    className: "mt-[2px] rtl:rotate-180",
+                    checked: value,
+                    onCheckedChange: (checked) => onChange(!!checked),
+                    ...field,
+                    "data-testid": "product-variant-create-form-manage-inventory-switch"
+                  }
+                ) }),
+                /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                  /* @__PURE__ */ jsx(Form.Label, { "data-testid": "product-variant-create-form-manage-inventory-label", children: t("products.variant.inventory.manageInventoryLabel") }),
+                  /* @__PURE__ */ jsx(Form.Hint, { "data-testid": "product-variant-create-form-manage-inventory-hint", children: t("products.variant.inventory.manageInventoryHint") })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "product-variant-create-form-manage-inventory-error" })
+            ] });
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Form.Field,
+        {
+          control: form.control,
+          name: "allow_backorder",
+          disabled: !manageInventoryEnabled,
+          render: ({ field: { value, onChange, ...field } }) => {
+            return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "product-variant-create-form-allow-backorder-item", children: [
+              /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-component shadow-elevation-card-rest flex gap-x-3 rounded-lg p-4", "data-testid": "product-variant-create-form-allow-backorder-container", children: [
+                /* @__PURE__ */ jsx(Form.Control, { "data-testid": "product-variant-create-form-allow-backorder-control", children: /* @__PURE__ */ jsx(
+                  Switch,
+                  {
+                    dir: "ltr",
+                    className: "rtl:rotate-180",
+                    checked: value,
+                    onCheckedChange: (checked) => onChange(!!checked),
+                    ...field,
+                    disabled: !manageInventoryEnabled,
+                    "data-testid": "product-variant-create-form-allow-backorder-switch"
+                  }
+                ) }),
+                /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                  /* @__PURE__ */ jsx(Form.Label, { "data-testid": "product-variant-create-form-allow-backorder-label", children: t("products.variant.inventory.allowBackordersLabel") }),
+                  /* @__PURE__ */ jsx(Form.Hint, { "data-testid": "product-variant-create-form-allow-backorder-hint", children: t("products.variant.inventory.allowBackordersHint") })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "product-variant-create-form-allow-backorder-error" })
+            ] });
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Form.Field,
+        {
+          control: form.control,
+          name: "inventory_kit",
+          render: ({ field: { value, onChange, ...field } }) => {
+            return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "product-variant-create-form-inventory-kit-item", children: [
+              /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-component shadow-elevation-card-rest flex gap-x-3 rounded-lg p-4", "data-testid": "product-variant-create-form-inventory-kit-container", children: [
+                /* @__PURE__ */ jsx(Form.Control, { "data-testid": "product-variant-create-form-inventory-kit-control", children: /* @__PURE__ */ jsx(
+                  Switch,
+                  {
+                    dir: "ltr",
+                    className: "rtl:rotate-180",
+                    checked: value,
+                    onCheckedChange: (checked) => onChange(!!checked),
+                    ...field,
+                    disabled: !manageInventoryEnabled,
+                    "data-testid": "product-variant-create-form-inventory-kit-switch"
+                  }
+                ) }),
+                /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                  /* @__PURE__ */ jsx(Form.Label, { "data-testid": "product-variant-create-form-inventory-kit-label", children: t("products.variant.inventory.inventoryKit") }),
+                  /* @__PURE__ */ jsx(Form.Hint, { "data-testid": "product-variant-create-form-inventory-kit-hint", children: t("products.variant.inventory.inventoryKitHint") })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "product-variant-create-form-inventory-kit-error" })
+            ] });
+          }
+        }
+      )
+    ] })
+  ] }) });
+}
+DetailsTab._tabMeta = defineTabMeta({
+  id: "detail",
+  labelKey: "priceLists.create.tabs.details",
+  validationFields: ["title", "sku", "manage_inventory", "allow_backorder", "inventory_kit", "options"]
+});
+var details_tab_default = DetailsTab;
+
+// src/pages/products/product-create-variant/components/create-product-variant-form/inventory-kit-tab.tsx
+import { useFieldArray } from "react-hook-form";
+import { Button, Heading as Heading2, IconButton, Input as Input2, Label } from "@medusajs/ui";
+import { XMarkMini } from "@medusajs/icons";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function InventoryKitTab() {
+  const form = useTabbedForm();
+  const { t } = useTranslation2();
+  const inventory = useFieldArray({
+    control: form.control,
+    name: `inventory`
+  });
+  const inventoryFormData = inventory.fields;
+  const items = useComboboxData({
+    queryKey: ["inventory_items"],
+    queryFn: (params) => sdk.admin.inventoryItems.query(params),
+    getOptions: (data) => {
+      const items2 = data.inventory_items;
+      return items2.map((item) => ({
+        label: item.title,
+        value: item.id
+      }));
+    }
+  });
+  const isItemOptionDisabled = (option, inventoryIndex) => {
+    return inventoryFormData?.some(
+      (i, index) => index != inventoryIndex && i.inventory_item_id === option.value
+    );
+  };
+  return /* @__PURE__ */ jsx2("div", { className: "flex flex-col items-center p-16", "data-testid": "product-variant-create-form-inventory-kit-tab", children: /* @__PURE__ */ jsx2("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8", children: /* @__PURE__ */ jsxs2("div", { id: "organize", className: "flex flex-col gap-y-8", children: [
+    /* @__PURE__ */ jsx2(Heading2, { "data-testid": "product-variant-create-form-inventory-kit-heading", children: t("products.create.inventory.heading") }),
+    /* @__PURE__ */ jsxs2("div", { className: "grid gap-y-4", children: [
+      /* @__PURE__ */ jsxs2("div", { className: "flex items-start justify-between gap-x-4", children: [
+        /* @__PURE__ */ jsxs2("div", { className: "flex flex-col", children: [
+          /* @__PURE__ */ jsx2(Form.Label, { "data-testid": "product-variant-create-form-inventory-kit-variant-label", children: form.getValues("title") }),
+          /* @__PURE__ */ jsx2(Form.Hint, { "data-testid": "product-variant-create-form-inventory-kit-hint", children: t("products.create.inventory.label") })
+        ] }),
+        /* @__PURE__ */ jsx2(
+          Button,
+          {
+            size: "small",
+            variant: "secondary",
+            type: "button",
+            onClick: () => {
+              inventory.append({
+                inventory_item_id: "",
+                required_quantity: ""
+              });
+            },
+            "data-testid": "product-variant-create-form-inventory-kit-add-button",
+            children: t("actions.add")
+          }
+        )
+      ] }),
+      inventory.fields.map((inventoryItem, inventoryIndex) => /* @__PURE__ */ jsxs2(
+        "li",
+        {
+          className: "bg-ui-bg-component shadow-elevation-card-rest grid grid-cols-[1fr_28px] items-center gap-1.5 rounded-xl p-1.5",
+          "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}`,
+          children: [
+            /* @__PURE__ */ jsxs2("div", { className: "grid grid-cols-[min-content,1fr] items-center gap-1.5", children: [
+              /* @__PURE__ */ jsx2("div", { className: "flex items-center px-2 py-1.5", children: /* @__PURE__ */ jsx2(
+                Label,
+                {
+                  size: "xsmall",
+                  weight: "plus",
+                  className: "text-ui-fg-subtle",
+                  htmlFor: `inventory.${inventoryIndex}.inventory_item_id`,
+                  "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-item-label`,
+                  children: t("fields.item")
+                }
+              ) }),
+              /* @__PURE__ */ jsx2(
+                Form.Field,
+                {
+                  control: form.control,
+                  name: `inventory.${inventoryIndex}.inventory_item_id`,
+                  render: ({ field }) => {
+                    return /* @__PURE__ */ jsxs2(Form.Item, { "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-item-field`, children: [
+                      /* @__PURE__ */ jsx2(Form.Control, { "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-item-control`, children: /* @__PURE__ */ jsx2(
+                        Combobox,
+                        {
+                          ...field,
+                          options: items.options.map((o) => ({
+                            ...o,
+                            disabled: isItemOptionDisabled(
+                              o,
+                              inventoryIndex
+                            )
+                          })),
+                          searchValue: items.searchValue,
+                          onSearchValueChange: items.onSearchValueChange,
+                          fetchNextPage: items.fetchNextPage,
+                          className: "bg-ui-bg-field-component hover:bg-ui-bg-field-component-hover",
+                          placeholder: t(
+                            "products.create.inventory.itemPlaceholder"
+                          ),
+                          "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-item-combobox`
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsx2(Form.ErrorMessage, { "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-item-error` })
+                    ] });
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx2("div", { className: "flex items-center px-2 py-1.5", children: /* @__PURE__ */ jsx2(
+                Label,
+                {
+                  size: "xsmall",
+                  weight: "plus",
+                  className: "text-ui-fg-subtle",
+                  htmlFor: `inventory.${inventoryIndex}.required_quantity`,
+                  "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-quantity-label`,
+                  children: t("fields.quantity")
+                }
+              ) }),
+              /* @__PURE__ */ jsx2(
+                Form.Field,
+                {
+                  control: form.control,
+                  name: `inventory.${inventoryIndex}.required_quantity`,
+                  render: ({ field: { onChange, value, ...field } }) => {
+                    return /* @__PURE__ */ jsxs2(Form.Item, { "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-quantity-field`, children: [
+                      /* @__PURE__ */ jsx2(Form.Control, { "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-quantity-control`, children: /* @__PURE__ */ jsx2(
+                        Input2,
+                        {
+                          type: "number",
+                          className: "bg-ui-bg-field-component",
+                          min: 0,
+                          value,
+                          onChange: (e) => {
+                            const value2 = e.target.value;
+                            if (value2 === "") {
+                              onChange(null);
+                            } else {
+                              onChange(Number(value2));
+                            }
+                          },
+                          ...field,
+                          placeholder: t(
+                            "products.create.inventory.quantityPlaceholder"
+                          ),
+                          "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-quantity-input`
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsx2(Form.ErrorMessage, { "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-quantity-error` })
+                    ] });
+                  }
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx2(
+              IconButton,
+              {
+                type: "button",
+                size: "small",
+                variant: "transparent",
+                className: "text-ui-fg-muted",
+                onClick: () => inventory.remove(inventoryIndex),
+                "data-testid": `product-variant-create-form-inventory-kit-item-${inventoryIndex}-remove-button`,
+                children: /* @__PURE__ */ jsx2(XMarkMini, {})
+              }
+            )
+          ]
+        },
+        inventoryItem.id
+      ))
+    ] })
+  ] }) }) });
+}
+InventoryKitTab._tabMeta = defineTabMeta({
+  id: "inventory",
+  labelKey: "products.create.tabs.inventory",
+  validationFields: ["inventory"]
+});
+var inventory_kit_tab_default = InventoryKitTab;
+
+// src/pages/products/product-create-variant/components/create-product-variant-form/pricing-tab.tsx
+import { useMemo } from "react";
+import { useWatch as useWatch2 } from "react-hook-form";
+import { useTranslation as useTranslation3 } from "react-i18next";
+import { jsx as jsx3 } from "react/jsx-runtime";
+function PricingTab() {
+  const form = useTabbedForm();
+  const { store } = useStore();
+  const { regions } = useRegions({ limit: 9999 });
+  const { price_preferences: pricePreferences } = usePricePreferences({});
+  const { setCloseOnEscape } = useRouteModal();
+  const columns = useVariantPriceGridColumns({
+    currencies: store?.supported_currencies,
+    regions,
+    pricePreferences
+  });
+  const variant = useWatch2({
+    control: form.control
+  });
+  return /* @__PURE__ */ jsx3("div", { "data-testid": "product-variant-create-form-pricing-tab", children: /* @__PURE__ */ jsx3(
+    DataGrid,
+    {
+      columns,
+      data: [variant],
+      state: form,
+      onEditingChange: (editing) => setCloseOnEscape(!editing)
+    }
+  ) });
+}
+var columnHelper = createDataGridHelper();
+var useVariantPriceGridColumns = ({
+  currencies = [],
+  regions = [],
+  pricePreferences = []
+}) => {
+  const { t } = useTranslation3();
+  return useMemo(() => {
+    return [
+      columnHelper.column({
+        id: t("fields.title"),
+        header: t("fields.title"),
+        cell: (context) => {
+          const entity = context.row.original;
+          return /* @__PURE__ */ jsx3(DataGrid.ReadonlyCell, { context, children: /* @__PURE__ */ jsx3("div", { className: "flex h-full w-full items-center gap-x-2 overflow-hidden", children: /* @__PURE__ */ jsx3("span", { className: "truncate", children: entity.title }) }) });
+        },
+        disableHiding: true
+      }),
+      ...createDataGridPriceColumns({
+        currencies: currencies.map((c) => c.currency_code),
+        regions,
+        pricePreferences,
+        getFieldName: (context, value) => {
+          if (context.column.id?.startsWith("currency_prices")) {
+            return `prices.${value}`;
+          }
+          return `prices.${value}`;
+        },
+        t
+      })
+    ];
+  }, [t, currencies, regions, pricePreferences]);
+};
+PricingTab._tabMeta = defineTabMeta({
+  id: "price",
+  labelKey: "priceLists.create.tabs.prices",
+  validationFields: ["prices"]
+});
+var pricing_tab_default = PricingTab;
+
+// src/pages/products/product-create-variant/components/create-product-variant-form/create-product-variant-form.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var CREATE_VARIANT_DEFAULTS = {
+  sku: "",
+  title: "",
+  manage_inventory: false,
+  allow_backorder: false,
+  inventory_kit: false,
+  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 { regions } = useRegions({ limit: 9999 });
+  const regionsCurrencyMap = useMemo2(() => {
+    if (!regions?.length) {
+      return {};
+    }
+    return regions.reduce(
+      (acc, reg) => {
+        acc[reg.id] = reg.currency_code;
+        return acc;
+      },
+      {}
+    );
+  }, [regions]);
+  const isManageInventoryEnabled = useWatch3({
+    control: form.control,
+    name: "manage_inventory"
+  });
+  const isInventoryKitEnabled = useWatch3({
+    control: form.control,
+    name: "inventory_kit"
+  });
+  const inventoryField = useFieldArray2({
+    control: form.control,
+    name: `inventory`
+  });
+  useEffect(() => {
+    if (isInventoryKitEnabled && inventoryField.fields.length === 0) {
+      inventoryField.append({
+        inventory_item_id: "",
+        required_quantity: void 0
+      });
+    }
+  }, [isInventoryKitEnabled]);
+  const inventoryTabEnabled = isManageInventoryEnabled && isInventoryKitEnabled;
+  const transformTabs = useCallback(
+    (tabs) => {
+      return tabs.map((tab) => {
+        if (tab.id === "inventory") {
+          return { ...tab, isVisible: () => !!inventoryTabEnabled };
+        }
+        return tab;
+      });
+    },
+    [inventoryTabEnabled]
+  );
+  const handleSubmit = form.handleSubmit(async (data) => {
+    const { allow_backorder, manage_inventory, sku, title } = data;
+    await mutateAsync(
+      {
+        title,
+        sku: sku || void 0,
+        allow_backorder,
+        manage_inventory,
+        options: data.options,
+        prices: Object.entries(data.prices ?? {}).map(([currencyOrRegion, value]) => {
+          if (value === "" || value === void 0) {
+            return void 0;
+          }
+          const ret = {};
+          const amount = castNumber(value);
+          if (currencyOrRegion.startsWith("reg_")) {
+            ret.rules = { region_id: currencyOrRegion };
+            ret.currency_code = regionsCurrencyMap[currencyOrRegion];
+          } else {
+            ret.currency_code = currencyOrRegion;
+          }
+          ret.amount = amount;
+          return ret;
+        }).filter((x) => Boolean(x)),
+        inventory_items: (data.inventory || []).map((i) => {
+          if (!i.required_quantity || !i.inventory_item_id) {
+            return false;
+          }
+          return {
+            ...i,
+            required_quantity: castNumber(i.required_quantity)
+          };
+        }).filter((x) => Boolean(x))
+      },
+      {
+        onSuccess: () => {
+          handleSuccess();
+        },
+        onError: (error) => {
+          toast.error(error.message);
+        }
+      }
+    );
+  });
+  const defaultTabs = useMemo2(
+    () => [
+      /* @__PURE__ */ jsx4(details_tab_default, { product }, "details"),
+      /* @__PURE__ */ jsx4(pricing_tab_default, {}, "pricing"),
+      /* @__PURE__ */ jsx4(inventory_kit_tab_default, {}, "inventory")
+    ],
+    [product]
+  );
+  const hasCustomChildren = Children.count(children) > 0;
+  return /* @__PURE__ */ jsx4(
+    TabbedForm,
+    {
+      form,
+      onSubmit: handleSubmit,
+      isLoading: isPending,
+      transformTabs,
+      children: hasCustomChildren ? children : defaultTabs
+    }
+  );
+};
+
+// src/pages/products/product-create-variant/product-create-variant.tsx
+import { jsx as jsx5 } 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__ */ jsx5(RouteFocusModal, { prev: "../..", children: !isLoading && product && (Children2.count(children) > 0 ? children : /* @__PURE__ */ jsx5(CreateProductVariantForm, { product })) });
+};
+var ProductCreateVariantPage = Object.assign(Root, {
+  Form: CreateProductVariantForm,
+  DetailsTab: details_tab_default,
+  PricingTab: pricing_tab_default,
+  InventoryKitTab: inventory_kit_tab_default,
+  Tab: TabbedForm.Tab
+});
+var ProductCreateVariant = Root;
+
+export {
+  CreateProductVariantSchema,
+  ProductCreateVariantPage,
+  ProductCreateVariant
+};

package/dist/chunk-ZQZHFMD7.js

@@ -0,0 +1,19 @@
+// src/hooks/table/filters/use-region-table-filters.tsx
+import { useTranslation } from "react-i18next";
+var useRegionTableFilters = () => {
+  const { t } = useTranslation();
+  const dateFilters = [
+    { label: t("fields.createdAt"), key: "created_at" },
+    { label: t("fields.updatedAt"), key: "updated_at" }
+  ].map((f) => ({
+    key: f.key,
+    label: f.label,
+    type: "date"
+  }));
+  const filters = [...dateFilters];
+  return filters;
+};
+
+export {
+  useRegionTableFilters
+};