@mercurjs/vendor 2.2.0-canary.11 → 2.2.0-canary.13

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

@@ -4,7 +4,17 @@ import {
   ProductStatusCell,
   ProductStatusHeader
 } from "./chunk-U5G3AVED.js";
+import {
+  useProductTableQuery
+} from "./chunk-MJCL3WID.js";
+import {
+  ProductCell,
+  ProductHeader
+} from "./chunk-FWPGOIFA.js";
 import "./chunk-FQERBIVS.js";
+import {
+  useProductTableFilters
+} from "./chunk-DEJIBIQZ.js";
 import "./chunk-DB6ANJBO.js";
 import {
   PlaceholderCell
@@ -21,7 +31,7 @@ import {
   createDataGridHelper,
   createDataGridLocationStockColumns,
   createDataGridPriceColumns
-} from "./chunk-4LVP635F.js";
+} from "./chunk-DNEPOMOX.js";
 import {
   defineTabMeta
 } from "./chunk-LEWA4BPH.js";
@@ -36,36 +46,50 @@ import {
   useRouteModal
 } from "./chunk-GDWBOQI5.js";
 import "./chunk-3QSRE5LS.js";
-import {
-  useQueryParams
-} from "./chunk-THHRRYRS.js";
+import "./chunk-THHRRYRS.js";
 import "./chunk-LRD242C7.js";
 import "./chunk-UCYSCKZV.js";
 import {
   Thumbnail
 } from "./chunk-WIYFXWRI.js";
 import "./chunk-INNFZYX2.js";
+import "./chunk-R5QZO3QY.js";
+import "./chunk-F4OJN2F2.js";
+import "./chunk-LRARA622.js";
+import "./chunk-M6N4ISXL.js";
+import "./chunk-S7EKBD2C.js";
+import "./chunk-VV6IKGCN.js";
+import "./chunk-BXRNZS5K.js";
+import "./chunk-BOZJOOGW.js";
 import {
-  useVariants
-} from "./chunk-T6LHVNWO.js";
+  useShippingProfiles
+} from "./chunk-IQWK723D.js";
 import {
   usePricePreferences
 } from "./chunk-4S6XGIC6.js";
 import {
   useCurrentSeller
 } from "./chunk-S23FD6FA.js";
-import {
-  useShippingProfiles
-} from "./chunk-IQWK723D.js";
+import "./chunk-DDJQRV6E.js";
+import "./chunk-LWJF63JW.js";
+import "./chunk-VXWN37PT.js";
+import "./chunk-5QI3NDJG.js";
+import "./chunk-VZUA5SRD.js";
+import "./chunk-VXMOPVRH.js";
 import {
   useStockLocations
 } from "./chunk-NBPMNUKZ.js";
 import {
   useBulkCreateOffers
-} from "./chunk-UORPTGV2.js";
+} from "./chunk-SIEEMXNZ.js";
+import "./chunk-Y2MQ5EMD.js";
+import "./chunk-3B34B2M2.js";
 import "./chunk-LAVHRER2.js";
 import "./chunk-QHQWEERJ.js";
 import "./chunk-Y7QKP6QU.js";
+import {
+  useProducts
+} from "./chunk-JAUZ73XE.js";
 import "./chunk-A5DJIOHN.js";
 import "./chunk-RHKRREUU.js";
 import "./chunk-ZA2KFUFR.js";
@@ -80,7 +104,7 @@ 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
@@ -88,81 +112,23 @@ import {
 import { useEffect, 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;
@@ -174,28 +140,21 @@ var Root = () => {
     const state = typeof fn === "function" ? fn(rowSelection) : fn;
     setRowSelection(state);
     const ids = Object.keys(state);
-    form.setValue("selected_variant_ids", ids, {
+    form.setValue("selected_product_ids", ids, {
       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,
@@ -208,7 +167,7 @@ var Root = () => {
     }
   });
   useEffect(() => {
-    void form.trigger("selected_variant_ids");
+    void form.trigger("selected_product_ids");
   }, [rowSelection, form]);
   if (isError) {
     throw error;
@@ -227,6 +186,7 @@ var Root = () => {
             columns,
             pageSize: PAGE_SIZE,
             isLoading,
+            filters,
             orderBy: [
               { key: "title", label: t("fields.title") },
               { key: "created_at", label: t("fields.createdAt") },
@@ -238,7 +198,11 @@ var Root = () => {
             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 +233,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 })
+        cell: ({ row }) => /* @__PURE__ */ jsx(CategoryCell, { categories: row.original.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 }) });
-        }
-      }),
-      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 +282,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 +291,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 +303,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 +334,7 @@ var Root2 = () => {
         DataGrid,
         {
           columns,
-          data: variants ?? [],
+          data: gridData,
           state: form,
           onEditingChange: (editing) => setCloseOnEscape(!editing)
         }
@@ -388,10 +361,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 +384,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,7 +466,9 @@ 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) => {
@@ -502,7 +499,7 @@ var variantRowRequiresSku = (row) => {
 // 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) => {
@@ -540,19 +537,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(",") : [];
     const locIds = locationsKey ? locationsKey.split(",") : [];
     const emptyPrices = currency_code ? { [currency_code]: "" } : {};
     const emptyInventory = locIds.reduce((acc, locId) => {
@@ -564,35 +560,35 @@ 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 });
   }, [
-    selectedVariantIdsKey,
-    fetchedVariants,
+    selectedProductIdsKey,
+    fetchedProducts,
     currency_code,
     locationsKey,
     form
@@ -715,7 +711,7 @@ 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"