@mercurjs/vendor 2.2.0-canary.9 → 2.2.0-rc.1

package/dist/{offer-create-page-E4FLSDJQ.js → offer-create-page-LRKRHBRT.js}

@@ -3,166 +3,135 @@ import {
   CategoryHeader,
   ProductStatusCell,
   ProductStatusHeader
-} from "./chunk-U5G3AVED.js";
-import "./chunk-FQERBIVS.js";
+} from "./chunk-7HLAOLG7.js";
+import {
+  useProductTableQuery
+} from "./chunk-QGZH3D2P.js";
+import {
+  ProductCell,
+  ProductHeader
+} from "./chunk-FWPGOIFA.js";
+import {
+  useProductTableFilters
+} from "./chunk-OOK3BD5Z.js";
 import "./chunk-DB6ANJBO.js";
 import {
   PlaceholderCell
 } from "./chunk-PHOCVOZ5.js";
 import {
-  _DataTable,
-  useDataTable
-} from "./chunk-SSUUT5LK.js";
-import "./chunk-YN3FGNJM.js";
-import "./chunk-6OUPJNYO.js";
-import "./chunk-3EF54XFY.js";
+  defineTabMeta
+} from "./chunk-LEWA4BPH.js";
 import {
   DataGrid,
   createDataGridHelper,
   createDataGridLocationStockColumns,
   createDataGridPriceColumns
-} from "./chunk-4LVP635F.js";
-import {
-  defineTabMeta
-} from "./chunk-LEWA4BPH.js";
+} from "./chunk-5FBQOAXU.js";
 import "./chunk-IQPN4PZJ.js";
 import {
   TabbedForm
-} from "./chunk-LQD232FW.js";
+} from "./chunk-WJ5EU3KW.js";
 import "./chunk-TKGWSUEI.js";
-import "./chunk-U2ZFCAPX.js";
+import "./chunk-SITRHMZZ.js";
 import {
   RouteFocusModal,
   useRouteModal
 } from "./chunk-GDWBOQI5.js";
 import "./chunk-3QSRE5LS.js";
+import "./chunk-FQERBIVS.js";
 import {
-  useQueryParams
-} from "./chunk-THHRRYRS.js";
+  _DataTable,
+  useDataTable
+} from "./chunk-7TQNE3E2.js";
+import "./chunk-YN3FGNJM.js";
+import "./chunk-KCHYLLVG.js";
+import "./chunk-CVXKASWV.js";
+import "./chunk-THHRRYRS.js";
 import "./chunk-LRD242C7.js";
-import "./chunk-UCYSCKZV.js";
+import "./chunk-VYSB4CTB.js";
 import {
   Thumbnail
 } from "./chunk-WIYFXWRI.js";
 import "./chunk-INNFZYX2.js";
+import "./chunk-LAVHRER2.js";
+import "./chunk-QHQWEERJ.js";
+import "./chunk-Y7QKP6QU.js";
+import "./chunk-BQHVM46E.js";
+import "./chunk-QIF4QE7T.js";
+import "./chunk-VE6GRIIN.js";
+import "./chunk-7MARNXFG.js";
+import "./chunk-MNHP6YRC.js";
+import "./chunk-NTJ3BMOE.js";
+import "./chunk-CLS6PNZY.js";
+import "./chunk-JIXW4WHZ.js";
 import {
-  useVariants
-} from "./chunk-T6LHVNWO.js";
+  useShippingProfiles
+} from "./chunk-GZ4KTAWS.js";
 import {
   usePricePreferences
-} from "./chunk-4S6XGIC6.js";
+} from "./chunk-PUAWN7SS.js";
 import {
   useCurrentSeller
-} from "./chunk-S23FD6FA.js";
-import {
-  useShippingProfiles
-} from "./chunk-IQWK723D.js";
+} from "./chunk-4NADEZZQ.js";
+import "./chunk-XWHHBJGS.js";
+import "./chunk-5NVY7JZC.js";
+import "./chunk-KIURBTC4.js";
+import "./chunk-4EAC3GT7.js";
+import "./chunk-JR7AABT5.js";
 import {
   useStockLocations
-} from "./chunk-NBPMNUKZ.js";
+} from "./chunk-ZQCCVCHB.js";
+import "./chunk-MABIMRLS.js";
 import {
   useBulkCreateOffers
-} from "./chunk-UORPTGV2.js";
-import "./chunk-LAVHRER2.js";
-import "./chunk-QHQWEERJ.js";
-import "./chunk-Y7QKP6QU.js";
+} from "./chunk-ULEW54ED.js";
+import "./chunk-UEPUKWD7.js";
+import "./chunk-JJP6AKMV.js";
+import {
+  useProducts
+} from "./chunk-744GLNZW.js";
 import "./chunk-A5DJIOHN.js";
 import "./chunk-RHKRREUU.js";
 import "./chunk-ZA2KFUFR.js";
-import "./chunk-RIN4CBRB.js";
+import "./chunk-LXZXXOJ3.js";
 import "./chunk-NBMM2TZK.js";
 
+// src/pages/offers/create/offer-create-page.tsx
+import { useTranslation as useTranslation4 } from "react-i18next";
+
 // src/pages/offers/create/create-offer-form/create-offer-form.tsx
 import { zodResolver } from "@hookform/resolvers/zod";
 import { Button, toast } from "@medusajs/ui";
-import { useEffect as useEffect2, useState as useState2 } from "react";
+import { useEffect, useMemo as useMemo3, useState as useState2 } from "react";
 import { useForm } from "react-hook-form";
 import { useTranslation as useTranslation3 } from "react-i18next";
 
 // src/pages/offers/create/create-offer-form/create-offer-catalogue.tsx
-import { Checkbox } from "@medusajs/ui";
+import { Checkbox, Text } from "@medusajs/ui";
 import { keepPreviousData } from "@tanstack/react-query";
 import {
   createColumnHelper
 } from "@tanstack/react-table";
-import { useEffect, useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import { useFormContext } from "react-hook-form";
 import { useTranslation } from "react-i18next";
-
-// src/hooks/table/query/use-product-variants-table-query.tsx
-var DEFAULT_FIELDS = "*options,*inventory_items,*inventory_items.inventory,*inventory_items.inventory.location_levels";
-var useProductVariantsTableQuery = ({
-  prefix,
-  pageSize = 10
-}) => {
-  const queryObject = useQueryParams(
-    [
-      "offset",
-      "order",
-      "q",
-      "id",
-      "sku",
-      "title",
-      "manage_inventory",
-      "allow_backorder",
-      "created_at",
-      "updated_at"
-    ],
-    prefix
-  );
-  const {
-    offset,
-    order,
-    q,
-    id,
-    sku,
-    title,
-    manage_inventory,
-    allow_backorder,
-    created_at,
-    updated_at
-  } = queryObject;
-  const searchParams = {
-    limit: pageSize,
-    offset: offset ? Number(offset) : 0,
-    fields: DEFAULT_FIELDS,
-    order,
-    q,
-    id: id ? id.split(",") : void 0,
-    sku: sku ? sku.split(",") : void 0,
-    title: title ? title.split(",") : void 0,
-    manage_inventory: manage_inventory ? manage_inventory === "true" : void 0,
-    allow_backorder: allow_backorder ? allow_backorder === "true" : void 0,
-    created_at: created_at ? JSON.parse(created_at) : void 0,
-    updated_at: updated_at ? JSON.parse(updated_at) : void 0
-  };
-  return {
-    searchParams,
-    raw: queryObject
-  };
-};
-
-// src/pages/offers/create/create-offer-form/create-offer-catalogue.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
 var PAGE_SIZE = 10;
 var FIELDS = [
   "id",
   "title",
-  "sku",
-  "ean",
-  "upc",
-  "product_id",
-  "product.id",
-  "product.title",
-  "product.thumbnail",
-  "product.status",
-  "product.categories.id",
-  "product.categories.name"
+  "handle",
+  "status",
+  "thumbnail",
+  "*collection",
+  "categories.id",
+  "categories.name",
+  "variants.id"
 ].join(",");
 var Root = () => {
   const { t } = useTranslation();
   const form = useFormContext();
-  const initialSelection = (form.getValues("selected_variant_ids") ?? []).reduce(
+  const initialSelection = (form.getValues("selected_product_ids") ?? []).reduce(
     (acc, id) => {
       acc[id] = true;
       return acc;
@@ -171,31 +140,29 @@ var Root = () => {
   );
   const [rowSelection, setRowSelection] = useState(initialSelection);
   const updater = (fn) => {
-    const state = typeof fn === "function" ? fn(rowSelection) : fn;
-    setRowSelection(state);
-    const ids = Object.keys(state);
-    form.setValue("selected_variant_ids", ids, {
+    const next = typeof fn === "function" ? fn(rowSelection) : fn;
+    const nextIds = Object.keys(next);
+    const currentIds = Object.keys(rowSelection);
+    const unchanged = nextIds.length === currentIds.length && nextIds.every((id) => rowSelection[id]);
+    if (unchanged) {
+      return;
+    }
+    setRowSelection(next);
+    form.setValue("selected_product_ids", nextIds, {
       shouldDirty: true,
       shouldTouch: true,
       shouldValidate: true
     });
   };
-  const { searchParams, raw } = useProductVariantsTableQuery({
-    pageSize: PAGE_SIZE
-  });
-  const {
-    variants,
-    count,
-    isPending: isLoading,
-    isError,
-    error
-  } = useVariants(
+  const { searchParams, raw } = useProductTableQuery({ pageSize: PAGE_SIZE });
+  const { products, count, isLoading, isError, error } = useProducts(
     { ...searchParams, fields: FIELDS },
     { placeholderData: keepPreviousData }
   );
+  const filters = useProductTableFilters();
   const columns = useColumns();
   const { table } = useDataTable({
-    data: variants ?? [],
+    data: products ?? [],
     columns,
     enablePagination: true,
     enableRowSelection: true,
@@ -207,9 +174,6 @@ var Root = () => {
       updater
     }
   });
-  useEffect(() => {
-    void form.trigger("selected_variant_ids");
-  }, [rowSelection, form]);
   if (isError) {
     throw error;
   }
@@ -227,18 +191,24 @@ var Root = () => {
             columns,
             pageSize: PAGE_SIZE,
             isLoading,
+            filters,
             orderBy: [
               { key: "title", label: t("fields.title") },
               { key: "created_at", label: t("fields.createdAt") },
               { key: "updated_at", label: t("fields.updatedAt") }
             ],
+            defaultOrderBy: "title",
             queryObject: raw,
             layout: "fill",
             pagination: true,
             search: "autofocus"
           }
         ),
-        /* @__PURE__ */ jsx("div", { className: "bg-ui-bg-subtle text-ui-fg-subtle border-t px-6 py-4", children: /* @__PURE__ */ jsx("span", { className: "txt-small", children: t("offers.create.tip") }) })
+        /* @__PURE__ */ jsx("div", { className: "bg-ui-bg-subtle border-t px-6 py-4", children: /* @__PURE__ */ jsxs("p", { className: "border-ui-border-strong txt-small text-ui-fg-subtle border-l-2 pl-3", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-ui-fg-base font-medium", children: t("offers.create.tipLabel") }),
+          " ",
+          t("offers.create.tip")
+        ] }) })
       ]
     }
   );
@@ -269,52 +239,44 @@ var useColumns = () => {
         )
       }),
       columnHelper.display({
-        id: "title",
-        header: t("fields.title"),
-        cell: ({ row }) => {
-          const variant = row.original;
-          const title = variant.title ?? "";
-          if (!title) return /* @__PURE__ */ jsx(PlaceholderCell, {});
-          return /* @__PURE__ */ jsxs("div", { className: "flex h-full w-full max-w-[320px] items-center gap-x-3 overflow-hidden", children: [
-            /* @__PURE__ */ jsx("div", { className: "w-fit flex-shrink-0", children: /* @__PURE__ */ jsx(Thumbnail, { src: variant.product?.thumbnail ?? null }) }),
-            /* @__PURE__ */ jsx("span", { className: "truncate", title, children: title })
-          ] });
-        }
+        id: "product",
+        header: () => /* @__PURE__ */ jsx(ProductHeader, {}),
+        cell: ({ row }) => /* @__PURE__ */ jsx(
+          ProductCell,
+          {
+            product: {
+              title: row.original.title ?? "",
+              thumbnail: row.original.thumbnail ?? null
+            }
+          }
+        )
       }),
       columnHelper.display({
         id: "categories",
         header: () => /* @__PURE__ */ jsx(CategoryHeader, {}),
-        cell: ({ row }) => /* @__PURE__ */ jsx(CategoryCell, { categories: row.original.product?.categories })
-      }),
-      columnHelper.accessor("sku", {
-        header: t("fields.sku"),
-        cell: ({ getValue }) => {
-          const sku = getValue();
-          if (!sku) return /* @__PURE__ */ jsx(PlaceholderCell, {});
-          return /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "truncate", children: sku }) });
-        }
+        cell: ({ row }) => /* @__PURE__ */ jsx(CategoryCell, { categories: row.original.categories })
       }),
-      columnHelper.accessor("ean", {
-        header: t("offers.fields.ean"),
-        cell: ({ getValue }) => {
-          const value = getValue();
-          if (!value) return /* @__PURE__ */ jsx(PlaceholderCell, {});
-          return /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "truncate", children: value }) });
+      columnHelper.display({
+        id: "collection",
+        header: t("fields.collection"),
+        cell: ({ row }) => {
+          const title = row.original.collection?.title;
+          if (!title) return /* @__PURE__ */ jsx(PlaceholderCell, {});
+          return /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", className: "truncate", children: title });
         }
       }),
-      columnHelper.accessor("upc", {
-        header: t("offers.fields.upc"),
-        cell: ({ getValue }) => {
-          const value = getValue();
-          if (!value) return /* @__PURE__ */ jsx(PlaceholderCell, {});
-          return /* @__PURE__ */ jsx("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx("span", { className: "truncate", children: value }) });
-        }
+      columnHelper.display({
+        id: "variants",
+        header: t("offers.fields.variants"),
+        cell: ({ row }) => /* @__PURE__ */ jsx(Text, { size: "small", leading: "compact", className: "truncate", children: t("offers.fields.variantsCount", {
+          count: row.original.variants?.length ?? 0
+        }) })
       }),
       columnHelper.display({
         id: "status",
         header: () => /* @__PURE__ */ jsx(ProductStatusHeader, {}),
         cell: ({ row }) => {
-          const status = row.original.product?.status;
+          const status = row.original.status;
           if (!status) return /* @__PURE__ */ jsx(PlaceholderCell, {});
           return /* @__PURE__ */ jsx(ProductStatusCell, { status });
         }
@@ -326,7 +288,7 @@ var useColumns = () => {
 Root._tabMeta = defineTabMeta({
   id: "catalogue",
   labelKey: "offers.create.tabs.catalogue",
-  validationFields: ["selected_variant_ids"]
+  validationFields: ["selected_product_ids"]
 });
 var CreateOfferCatalogueTab = Root;
 
@@ -335,6 +297,7 @@ import { useMemo as useMemo2 } from "react";
 import { useFormContext as useFormContext2, useWatch } from "react-hook-form";
 import { useTranslation as useTranslation2 } from "react-i18next";
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var isGroup = (row) => row.__group === true;
 var Root2 = () => {
   const form = useFormContext2();
   const { setCloseOnEscape } = useRouteModal();
@@ -346,6 +309,22 @@ var Root2 = () => {
     control: form.control,
     name: "variants"
   });
+  const gridData = useMemo2(() => {
+    const rows = [];
+    let lastProductId;
+    (variants ?? []).forEach((variant, index) => {
+      if (variant.product_id !== lastProductId) {
+        rows.push({
+          __group: true,
+          id: `group-${variant.product_id}`,
+          product_title: variant.product_title
+        });
+        lastProductId = variant.product_id;
+      }
+      rows.push({ ...variant, __group: false, __formIndex: index });
+    });
+    return rows;
+  }, [variants]);
   const columns = useColumns2({
     currencyCode: currency_code,
     stockLocations: stock_locations,
@@ -361,7 +340,7 @@ var Root2 = () => {
         DataGrid,
         {
           columns,
-          data: variants ?? [],
+          data: gridData,
           state: form,
           onEditingChange: (editing) => setCloseOnEscape(!editing)
         }
@@ -388,10 +367,20 @@ var useColumns2 = ({
         id: "title",
         header: t("fields.title"),
         cell: (context) => {
-          const entity = context.row.original;
-          const title = entity.variant_title || "";
+          const row = context.row.original;
+          if (isGroup(row)) {
+            return /* @__PURE__ */ jsx2(DataGrid.ReadonlyCell, { context, children: /* @__PURE__ */ jsx2(
+              "span",
+              {
+                className: "text-ui-fg-subtle truncate font-medium",
+                title: row.product_title,
+                children: row.product_title
+              }
+            ) });
+          }
+          const title = row.variant_title || "";
           return /* @__PURE__ */ jsx2(DataGrid.ReadonlyCell, { context, children: /* @__PURE__ */ jsxs2("div", { className: "flex h-full w-full items-center gap-x-2 overflow-hidden", children: [
-            /* @__PURE__ */ jsx2(Thumbnail, { src: entity.product_thumbnail ?? null }),
+            /* @__PURE__ */ jsx2(Thumbnail, { src: row.product_thumbnail ?? null }),
             /* @__PURE__ */ jsx2("span", { className: "truncate", title, children: title })
           ] }) });
         },
@@ -401,40 +390,52 @@ var useColumns2 = ({
         id: "sku",
         name: t("fields.sku"),
         header: t("fields.sku"),
-        field: (context) => `variants.${context.row.index}.sku`,
+        field: (context) => {
+          const row = context.row.original;
+          return isGroup(row) ? null : `variants.${row.__formIndex}.sku`;
+        },
         type: "text",
-        cell: (context) => /* @__PURE__ */ jsx2(DataGrid.TextCell, { context })
+        cell: (context) => isGroup(context.row.original) ? /* @__PURE__ */ jsx2(DataGrid.ReadonlyCell, { context }) : /* @__PURE__ */ jsx2(DataGrid.TextCell, { context })
       }),
       columnHelper2.column({
         id: "shipping_profile",
-        name: t("shippingProfile.domain"),
-        header: t("shippingProfile.domain"),
-        field: (context) => `variants.${context.row.index}.shipping_profile_id`,
+        name: t("offers.fields.shippingProfile"),
+        header: t("offers.fields.shippingProfile"),
+        field: (context) => {
+          const row = context.row.original;
+          return isGroup(row) ? null : `variants.${row.__formIndex}.shipping_profile_id`;
+        },
         type: "select",
-        cell: (context) => /* @__PURE__ */ jsx2(
+        cell: (context) => isGroup(context.row.original) ? /* @__PURE__ */ jsx2(DataGrid.ReadonlyCell, { context }) : /* @__PURE__ */ jsx2(
           DataGrid.SelectCell,
           {
             context,
             options: shippingProfileOptions,
-            placeholder: t("shippingProfile.domain")
+            placeholder: ""
           }
         )
       }),
       ...createDataGridLocationStockColumns({
         stockLocations,
+        isReadyOnly: (context) => isGroup(context.row.original),
         getFieldName: (context, index) => {
+          const row = context.row.original;
+          if (isGroup(row)) return null;
           const location = stockLocations[index];
           if (!location) return null;
-          return `variants.${context.row.index}.inventory.${location.id}`;
+          return `variants.${row.__formIndex}.inventory.${location.id}`;
         },
         t
       }),
       ...createDataGridPriceColumns({
         currencies,
         pricePreferences,
+        isReadyOnly: (context) => isGroup(context.row.original),
         getFieldName: (context, value) => {
+          const row = context.row.original;
+          if (isGroup(row)) return null;
           if (context.column.id?.startsWith("currency_prices")) {
-            return `variants.${context.row.index}.prices.${value}`;
+            return `variants.${row.__formIndex}.prices.${value}`;
           }
           return null;
         },
@@ -471,41 +472,19 @@ var VariantRowSchema = z.object({
   ).default({})
 });
 var CreateOfferSchema = z.object({
-  selected_variant_ids: z.array(z.string().min(1)).min(1),
+  // The catalogue tab selects whole products (SPEC-009); the stock &
+  // prices tab fans them out to their variants.
+  selected_product_ids: z.array(z.string().min(1)).min(1),
   variants: z.array(VariantRowSchema).min(1)
 });
-var numericOrZero = (v) => {
-  if (v === "" || v === null || v === void 0) return 0;
-  return Number(v) || 0;
-};
-var isVariantRowPublishable = (row) => {
-  const hasSku = !!row.sku && row.sku.trim().length > 0;
-  const hasShipping = !!row.shipping_profile_id && row.shipping_profile_id.length > 0;
-  const hasEnabledLocation = Object.values(row.inventory ?? {}).some(
-    (v) => v.checked
-  );
-  const hasNonZeroPrice = Object.values(row.prices ?? {}).some(
-    (v) => numericOrZero(v) > 0
-  );
-  return hasSku || hasShipping || hasEnabledLocation || hasNonZeroPrice;
-};
-var variantRowRequiresSku = (row) => {
-  const hasEnabledLocation = Object.values(row.inventory ?? {}).some(
-    (v) => v.checked
-  );
-  const hasNonZeroPrice = Object.values(row.prices ?? {}).some(
-    (v) => numericOrZero(v) > 0
-  );
-  return hasEnabledLocation || hasNonZeroPrice;
-};
 
 // src/pages/offers/create/create-offer-form/create-offer-form.tsx
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var DEFAULTS = {
-  selected_variant_ids: [],
+  selected_product_ids: [],
   variants: []
 };
-var numericOrZero2 = (v) => {
+var numericOrZero = (v) => {
   if (v === "" || v === null || v === void 0) return 0;
   return Number(v) || 0;
 };
@@ -540,19 +519,18 @@ var CreateOfferForm = () => {
   const { currency_code } = useCurrentSeller();
   const { stock_locations } = useStockLocations({ limit: 100 });
   const locationIds = (stock_locations ?? []).map((l) => l.id);
-  const selectedVariantIds = form.watch("selected_variant_ids") ?? [];
-  const selectedVariantIdsKey = selectedVariantIds.join(",");
+  const selectedProductIds = form.watch("selected_product_ids") ?? [];
+  const selectedProductIdsKey = selectedProductIds.join(",");
   const locationsKey = locationIds.join(",");
-  const { variants: fetchedVariants } = useVariants(
+  const { products: fetchedProducts } = useProducts(
     {
-      id: selectedVariantIds,
-      limit: selectedVariantIds.length || 1,
-      fields: "id,title,sku,product_id,product.id,product.title,product.thumbnail"
+      id: selectedProductIds,
+      limit: selectedProductIds.length || 1,
+      fields: "id,title,thumbnail,variants.id,variants.title,variants.sku"
     },
-    { enabled: selectedVariantIds.length > 0 }
+    { enabled: selectedProductIds.length > 0 }
   );
-  useEffect2(() => {
-    const ids = selectedVariantIdsKey ? selectedVariantIdsKey.split(",") : [];
+  useEffect(() => {
     const locIds = locationsKey ? locationsKey.split(",") : [];
     const emptyPrices = currency_code ? { [currency_code]: "" } : {};
     const emptyInventory = locIds.reduce((acc, locId) => {
@@ -564,93 +542,87 @@ var CreateOfferForm = () => {
       existing.map((row) => [row.variant_id, row])
     );
     const next = [];
-    for (const variantId of ids) {
-      const previous = existingByVariantId.get(variantId);
-      if (previous) {
+    for (const product of fetchedProducts ?? []) {
+      for (const variant of product.variants ?? []) {
+        const previous = existingByVariantId.get(variant.id);
+        if (previous) {
+          next.push({
+            ...previous,
+            prices: { ...emptyPrices, ...previous.prices ?? {} },
+            inventory: { ...emptyInventory, ...previous.inventory ?? {} }
+          });
+          continue;
+        }
         next.push({
-          ...previous,
-          prices: { ...emptyPrices, ...previous.prices ?? {} },
-          inventory: { ...emptyInventory, ...previous.inventory ?? {} }
+          variant_id: variant.id,
+          product_id: product.id ?? "",
+          product_title: product.title ?? "",
+          variant_title: variant.title ?? variant.id,
+          product_thumbnail: product.thumbnail ?? null,
+          variant_sku: variant.sku ?? null,
+          sku: variant.sku ?? "",
+          shipping_profile_id: "",
+          prices: { ...emptyPrices },
+          inventory: { ...emptyInventory }
         });
-        continue;
       }
-      const fetched = (fetchedVariants ?? []).find((v) => v.id === variantId);
-      if (!fetched) continue;
-      next.push({
-        variant_id: variantId,
-        product_id: fetched.product_id ?? fetched.product?.id ?? "",
-        product_title: fetched.product?.title ?? "",
-        variant_title: fetched.title ?? variantId,
-        product_thumbnail: fetched.product?.thumbnail ?? null,
-        variant_sku: fetched.sku ?? null,
-        sku: fetched.sku ?? "",
-        shipping_profile_id: "",
-        prices: { ...emptyPrices },
-        inventory: { ...emptyInventory }
-      });
     }
-    form.setValue("variants", next, { shouldDirty: false });
+    const prev = form.getValues("variants") ?? [];
+    if (JSON.stringify(prev) !== JSON.stringify(next)) {
+      form.setValue("variants", next, { shouldDirty: false });
+    }
   }, [
-    selectedVariantIdsKey,
-    fetchedVariants,
+    selectedProductIdsKey,
+    fetchedProducts,
     currency_code,
     locationsKey,
     form
   ]);
   const handleSubmit = form.handleSubmit(async (values) => {
     const variants = values.variants ?? [];
-    const publishable = variants.filter((v) => isVariantRowPublishable(v));
-    if (publishable.length === 0) {
-      toast.error(t("offers.validation.noPublishableRows"));
+    if (variants.length === 0) {
       return;
     }
     let hasValidationError = false;
     const skuSeen = /* @__PURE__ */ new Map();
     for (let i = 0; i < variants.length; i++) {
       const row = variants[i];
-      if (!isVariantRowPublishable(row)) continue;
       const sku = (row.sku ?? "").trim();
-      if (variantRowRequiresSku(row) && !sku) {
+      if (!sku) {
         form.setError(`variants.${i}.sku`, {
           type: "manual",
           message: t("offers.validation.skuRequired")
         });
         hasValidationError = true;
-        continue;
-      }
-      if (sku) {
-        if (skuSeen.has(sku)) {
-          form.setError(`variants.${i}.sku`, {
-            type: "manual",
-            message: t("offers.validation.duplicateSku")
-          });
-          hasValidationError = true;
-          continue;
-        }
+      } else if (skuSeen.has(sku)) {
+        form.setError(`variants.${i}.sku`, {
+          type: "manual",
+          message: t("offers.validation.duplicateSku")
+        });
+        hasValidationError = true;
+      } else {
         skuSeen.set(sku, i);
       }
       if (!row.shipping_profile_id) {
         form.setError(`variants.${i}.shipping_profile_id`, {
           type: "manual",
-          message: t("offers.validation.skuRequired")
+          message: t("offers.validation.shippingProfileRequired")
         });
         hasValidationError = true;
       }
     }
     if (hasValidationError) return;
     setIsSubmitting(true);
-    const publishableRows = [];
-    for (let i = 0; i < variants.length; i++) {
-      const row = variants[i];
-      if (!isVariantRowPublishable(row)) continue;
-      const sku = (row.sku ?? "").trim() || row.variant_sku || row.variant_id;
-      publishableRows.push({ row, index: i, sku });
-    }
-    const payloadOffers = publishableRows.map(({ row, sku }) => {
+    const rows = variants.map((row, index) => ({
+      row,
+      index,
+      sku: (row.sku ?? "").trim()
+    }));
+    const payloadOffers = rows.map(({ row, sku }) => {
       const prices = [];
       if (currency_code) {
         prices.push({
-          amount: numericOrZero2(row.prices?.[currency_code]),
+          amount: numericOrZero(row.prices?.[currency_code]),
           currency_code
         });
       }
@@ -659,7 +631,7 @@ var CreateOfferForm = () => {
         if (!level?.checked) continue;
         stock_levels.push({
           location_id: locationId,
-          stocked_quantity: numericOrZero2(level.quantity)
+          stocked_quantity: numericOrZero(level.quantity)
         });
       }
       return {
@@ -681,7 +653,7 @@ var CreateOfferForm = () => {
       handleSuccess("/offers");
     } catch (err) {
       const message = err instanceof Error ? err.message : "Unknown error";
-      const attributed = attachErrorToRow(message, publishableRows, form);
+      const attributed = attachErrorToRow(message, rows, form);
       if (!attributed) {
         toast.error(message);
       }
@@ -689,9 +661,18 @@ var CreateOfferForm = () => {
       setIsSubmitting(false);
     }
   });
-  return /* @__PURE__ */ jsxs3(
+  const tabs = useMemo3(
+    () => [
+      /* @__PURE__ */ jsx3(CreateOfferCatalogueTab, {}, "catalogue"),
+      /* @__PURE__ */ jsx3(CreateOfferStockLevelsAndPricesTab, {}, "stockLevelsAndPrices")
+    ],
+    []
+  );
+  return /* @__PURE__ */ jsx3(
     TabbedForm,
     {
+      model: "offer",
+      zone: "create",
       form,
       onSubmit: handleSubmit,
       isLoading: isSubmitting,
@@ -715,27 +696,27 @@ var CreateOfferForm = () => {
             variant: "primary",
             size: "small",
             onClick: () => onNext(),
-            disabled: (form.watch("selected_variant_ids")?.length ?? 0) === 0,
+            disabled: (form.watch("selected_product_ids")?.length ?? 0) === 0,
             children: t("actions.continue")
           },
           "next-button"
         )
       ] }),
-      children: [
-        /* @__PURE__ */ jsx3(CreateOfferCatalogueTab, {}),
-        /* @__PURE__ */ jsx3(CreateOfferStockLevelsAndPricesTab, {})
-      ]
+      children: tabs
     }
   );
 };
 
 // src/pages/offers/create/offer-create-page.tsx
 import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-var OfferCreatePage = () => /* @__PURE__ */ jsxs4(RouteFocusModal, { children: [
-  /* @__PURE__ */ jsx4(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Create offer" }) }),
-  /* @__PURE__ */ jsx4(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Select variants and configure stock levels and prices to create offers." }) }),
-  /* @__PURE__ */ jsx4(CreateOfferForm, {})
-] });
+var OfferCreatePage = () => {
+  const { t } = useTranslation4();
+  return /* @__PURE__ */ jsxs4(RouteFocusModal, { children: [
+    /* @__PURE__ */ jsx4(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx4("span", { className: "sr-only", children: t("offers.create.header") }) }),
+    /* @__PURE__ */ jsx4(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx4("span", { className: "sr-only", children: t("offers.create.description") }) }),
+    /* @__PURE__ */ jsx4(CreateOfferForm, {})
+  ] });
+};
 var Component = OfferCreatePage;
 export {
   Component,