@mercurjs/admin 2.2.1 → 2.3.0-canary.1

package/dist/chunk-AK7NUCTI.js

@@ -0,0 +1,859 @@
+import {
+  PriceListCreateOffersSchema,
+  PriceListRulesSchema,
+  buildOfferGridData,
+  usePriceListCurrencyData,
+  usePriceListGridColumns
+} from "./chunk-ELLSTZ5X.js";
+import {
+  useCustomerGroupTableColumns
+} from "./chunk-54EPH67T.js";
+import {
+  useOfferTableColumns,
+  useOfferTableFilters,
+  useOfferTableQuery
+} from "./chunk-EPUODBUW.js";
+import {
+  extractPricesFromOffers
+} from "./chunk-KVAD5JGS.js";
+import {
+  useCustomerGroupTableFilters
+} from "./chunk-CFQX7HAW.js";
+import {
+  useOffers
+} from "./chunk-GNNOFJAK.js";
+import {
+  useCustomerGroupTableQuery
+} from "./chunk-3XOE4NV5.js";
+import {
+  TabbedForm,
+  defineTabMeta,
+  useTabbedForm
+} from "./chunk-FREUYHMS.js";
+import {
+  DataGrid
+} from "./chunk-JXSXBSV6.js";
+import {
+  RouteFocusModal,
+  StackedDrawer,
+  StackedFocusModal,
+  useRouteModal,
+  useStackedModal
+} from "./chunk-FWJLS7XD.js";
+import {
+  Form
+} from "./chunk-3QSRE5LS.js";
+import {
+  _DataTable,
+  useDataTable
+} from "./chunk-BSXBRI23.js";
+import {
+  useCreatePriceList
+} from "./chunk-56XMCNDS.js";
+import {
+  useCustomerGroups
+} from "./chunk-XWOFQSGH.js";
+import {
+  useDocumentDirection
+} from "./chunk-Y7QKP6QU.js";
+import {
+  useProducts
+} from "./chunk-Z476HUMI.js";
+
+// src/pages/price-lists/price-list-create/components/price-list-create-form/schema.ts
+import i18n from "i18next";
+import { z } from "zod";
+var PricingCustomerGroupsArray = z.array(
+  z.object({
+    id: z.string(),
+    name: z.string()
+  })
+);
+var PricingCreateSchema = z.object({
+  type: z.enum(["sale", "override"]),
+  status: z.enum(["draft", "active"]),
+  title: z.string().min(1, i18n.t("priceLists.create.validation.title")),
+  description: z.string().min(1, i18n.t("priceLists.create.validation.description")),
+  starts_at: z.date().nullish(),
+  ends_at: z.date().nullish(),
+  product_ids: z.array(z.object({ id: z.string() })).min(1),
+  // Offer ids selected in the picker (every variant of the chosen store+product
+  // groups). The Prices tab hydrates `offers` from these.
+  offer_ids: z.array(z.string()).default([]),
+  // Offer-keyed prices (offer_id -> { variant_id, prices }), so the same variant
+  // from two sellers stays separate.
+  offers: PriceListCreateOffersSchema.default({}),
+  rules: PriceListRulesSchema.nullish()
+});
+var PricingDetailsSchema = PricingCreateSchema.pick({
+  type: true,
+  title: true,
+  description: true,
+  starts_at: true,
+  ends_at: true
+});
+var PricingDetailsFields = Object.keys(
+  PricingDetailsSchema.shape
+);
+var PricingProductsSchema = PricingCreateSchema.pick({
+  product_ids: true
+});
+var PricingProductsFields = Object.keys(
+  PricingProductsSchema.shape
+);
+var PricingPricesSchema = PricingCreateSchema.pick({
+  offers: true
+});
+var PricingPricesFields = Object.keys(
+  PricingPricesSchema.shape
+);
+
+// src/pages/price-lists/price-list-create/price-list-create.tsx
+import { Children as Children2 } from "react";
+
+// src/pages/price-lists/price-list-create/components/price-list-create-form/price-list-create-form.tsx
+import { zodResolver } from "@hookform/resolvers/zod";
+import { toast } from "@medusajs/ui";
+import { Children, useMemo as useMemo4 } from "react";
+import { useForm } from "react-hook-form";
+import { useTranslation as useTranslation4 } from "react-i18next";
+
+// src/pages/price-lists/price-list-create/components/price-list-create-form/price-list-details-form.tsx
+import { MagnifyingGlass, XMarkMini } from "@medusajs/icons";
+import {
+  Button as Button2,
+  DatePicker,
+  Divider,
+  Heading,
+  IconButton,
+  Input,
+  RadioGroup,
+  Text,
+  Textarea,
+  clx
+} from "@medusajs/ui";
+import { useFieldArray } from "react-hook-form";
+import { useTranslation as useTranslation2 } from "react-i18next";
+
+// src/pages/price-lists/common/components/price-list-customer-group-rule-form/price-list-customer-group-rule-form.tsx
+import { Button, Checkbox } from "@medusajs/ui";
+import { keepPreviousData } from "@tanstack/react-query";
+import {
+  createColumnHelper
+} from "@tanstack/react-table";
+import { useEffect, useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
+var PAGE_SIZE = 50;
+var PREFIX = "cg";
+var initRowSelection = (state) => {
+  return state.reduce((acc, group) => {
+    acc[group.id] = true;
+    return acc;
+  }, {});
+};
+var PriceListCustomerGroupRuleForm = ({
+  state,
+  setState,
+  type
+}) => {
+  const { t } = useTranslation();
+  const [rowSelection, setRowSelection] = useState(
+    initRowSelection(state)
+  );
+  const [intermediate, setIntermediate] = useState(state);
+  useEffect(() => {
+    setRowSelection(initRowSelection(state));
+    setIntermediate(state);
+  }, [state]);
+  const { searchParams, raw } = useCustomerGroupTableQuery({
+    pageSize: PAGE_SIZE,
+    prefix: PREFIX
+  });
+  const { customer_groups, count, isLoading, isError, error } = useCustomerGroups(
+    { ...searchParams, fields: "id,name,customers.id" },
+    {
+      placeholderData: keepPreviousData
+    }
+  );
+  const updater = (value) => {
+    const state2 = typeof value === "function" ? value(rowSelection) : value;
+    const currentIds = Object.keys(rowSelection);
+    const ids = Object.keys(state2);
+    const newIds = ids.filter((id) => !currentIds.includes(id));
+    const removedIds = currentIds.filter((id) => !ids.includes(id));
+    const newCustomerGroups = customer_groups?.filter((cg) => newIds.includes(cg.id)).map((cg) => ({ id: cg.id, name: cg.name })) || [];
+    const filteredIntermediate = intermediate.filter(
+      (cg) => !removedIds.includes(cg.id)
+    );
+    setIntermediate([...filteredIntermediate, ...newCustomerGroups]);
+    setRowSelection(state2);
+  };
+  const handleSave = () => {
+    setState(intermediate);
+  };
+  const filters = useCustomerGroupTableFilters();
+  const columns = useColumns();
+  const { table } = useDataTable({
+    data: customer_groups || [],
+    columns,
+    count,
+    enablePagination: true,
+    enableRowSelection: true,
+    getRowId: (row) => row.id,
+    rowSelection: {
+      state: rowSelection,
+      updater
+    },
+    pageSize: PAGE_SIZE,
+    prefix: PREFIX
+  });
+  const Component = type === "focus" ? StackedFocusModal : StackedDrawer;
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex size-full flex-col overflow-hidden", children: [
+    /* @__PURE__ */ jsx(Component.Body, { className: "min-h-0 p-0", children: /* @__PURE__ */ jsx(
+      _DataTable,
+      {
+        table,
+        columns,
+        pageSize: PAGE_SIZE,
+        count,
+        isLoading,
+        filters,
+        orderBy: [
+          { key: "name", label: t("fields.name") },
+          { key: "created_at", label: t("fields.createdAt") },
+          { key: "updated_at", label: t("fields.updatedAt") }
+        ],
+        layout: "fill",
+        pagination: true,
+        search: true,
+        prefix: PREFIX,
+        queryObject: raw
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(Component.Footer, { children: [
+      /* @__PURE__ */ jsx(Component.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "secondary", size: "small", type: "button", children: t("actions.cancel") }) }),
+      /* @__PURE__ */ jsx(Button, { type: "button", size: "small", onClick: handleSave, children: t("actions.save") })
+    ] })
+  ] });
+};
+var columnHelper = createColumnHelper();
+var useColumns = () => {
+  const base = useCustomerGroupTableColumns();
+  return useMemo(
+    () => [
+      columnHelper.display({
+        id: "select",
+        header: ({ table }) => {
+          return /* @__PURE__ */ jsx(
+            Checkbox,
+            {
+              checked: table.getIsSomePageRowsSelected() ? "indeterminate" : table.getIsAllPageRowsSelected(),
+              onCheckedChange: (value) => table.toggleAllPageRowsSelected(!!value)
+            }
+          );
+        },
+        cell: ({ row }) => {
+          return /* @__PURE__ */ jsx(
+            Checkbox,
+            {
+              checked: row.getIsSelected(),
+              onCheckedChange: (value) => row.toggleSelected(!!value),
+              onClick: (e) => {
+                e.stopPropagation();
+              }
+            }
+          );
+        }
+      }),
+      ...base
+    ],
+    [base]
+  );
+};
+
+// src/pages/price-lists/price-list-create/components/price-list-create-form/price-list-details-form.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var Root = () => {
+  const { t } = useTranslation2();
+  const form = useTabbedForm();
+  const direction = useDocumentDirection();
+  const { fields, remove, append } = useFieldArray({
+    control: form.control,
+    name: "rules.customer_group_id",
+    keyName: "cg_id"
+  });
+  const { setIsOpen } = useStackedModal();
+  const handleAddCustomerGroup = (groups) => {
+    const newIds = groups.map((group) => group.id);
+    const fieldsToAdd = groups.filter(
+      (group) => !fields.some((field) => field.id === group.id)
+    );
+    for (const field of fields) {
+      if (!newIds.includes(field.id)) {
+        remove(fields.indexOf(field));
+      }
+    }
+    append(fieldsToAdd);
+    setIsOpen("cg", false);
+  };
+  return /* @__PURE__ */ jsx2("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", "data-testid": "price-list-details-form", children: /* @__PURE__ */ jsxs2("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8 px-8 py-16", children: [
+    /* @__PURE__ */ jsxs2("div", { "data-testid": "price-list-details-form-header", children: [
+      /* @__PURE__ */ jsx2(Heading, { "data-testid": "price-list-details-form-heading", children: t("priceLists.create.header") }),
+      /* @__PURE__ */ jsx2(Text, { size: "small", className: "text-ui-fg-subtle", "data-testid": "price-list-details-form-subheader", children: t("priceLists.create.subheader") })
+    ] }),
+    /* @__PURE__ */ jsx2(
+      Form.Field,
+      {
+        control: form.control,
+        name: "type",
+        render: ({ field: { onChange, ...rest } }) => {
+          return /* @__PURE__ */ jsxs2(Form.Item, { "data-testid": "price-list-details-form-type-item", children: [
+            /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-y-4", children: [
+              /* @__PURE__ */ jsxs2("div", { children: [
+                /* @__PURE__ */ jsx2(Form.Label, { "data-testid": "price-list-details-form-type-label", children: t("priceLists.fields.type.label") }),
+                /* @__PURE__ */ jsx2(Form.Hint, { "data-testid": "price-list-details-form-type-hint", children: t("priceLists.fields.type.hint") })
+              ] }),
+              /* @__PURE__ */ jsx2(Form.Control, { "data-testid": "price-list-details-form-type-control", children: /* @__PURE__ */ jsxs2(
+                RadioGroup,
+                {
+                  dir: direction,
+                  onValueChange: onChange,
+                  ...rest,
+                  className: "grid grid-cols-1 gap-4 md:grid-cols-2",
+                  "data-testid": "price-list-details-form-type-radio-group",
+                  children: [
+                    /* @__PURE__ */ jsx2(
+                      RadioGroup.ChoiceBox,
+                      {
+                        value: "sale",
+                        label: t("priceLists.fields.type.options.sale.label"),
+                        description: t("priceLists.fields.type.options.sale.description"),
+                        "data-testid": "price-list-details-form-type-option-sale"
+                      }
+                    ),
+                    /* @__PURE__ */ jsx2(
+                      RadioGroup.ChoiceBox,
+                      {
+                        value: "override",
+                        label: t("priceLists.fields.type.options.override.label"),
+                        description: t("priceLists.fields.type.options.override.description"),
+                        "data-testid": "price-list-details-form-type-option-override"
+                      }
+                    )
+                  ]
+                }
+              ) })
+            ] }),
+            /* @__PURE__ */ jsx2(Form.ErrorMessage, { "data-testid": "price-list-details-form-type-error" })
+          ] });
+        }
+      }
+    ),
+    /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsx2(
+        Form.Field,
+        {
+          control: form.control,
+          name: "status",
+          render: ({ field: { onChange, ...rest } }) => /* @__PURE__ */ jsxs2(Form.Item, { "data-testid": "price-list-details-form-status-item", children: [
+            /* @__PURE__ */ jsx2(Form.Label, { "data-testid": "price-list-details-form-status-label", children: t("priceLists.fields.status.label") }),
+            /* @__PURE__ */ jsx2(Form.Control, { "data-testid": "price-list-details-form-status-control", children: /* @__PURE__ */ jsxs2(
+              RadioGroup,
+              {
+                dir: direction,
+                onValueChange: onChange,
+                ...rest,
+                className: "grid grid-cols-1 gap-4 md:grid-cols-2",
+                "data-testid": "price-list-details-form-status-radio-group",
+                children: [
+                  /* @__PURE__ */ jsx2(
+                    RadioGroup.ChoiceBox,
+                    {
+                      value: "draft",
+                      label: t("priceLists.fields.status.options.draft"),
+                      description: t("priceLists.fields.status.descriptions.draft"),
+                      "data-testid": "price-list-details-form-status-option-draft"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx2(
+                    RadioGroup.ChoiceBox,
+                    {
+                      value: "active",
+                      label: t("priceLists.fields.status.options.active"),
+                      description: t("priceLists.fields.status.descriptions.active"),
+                      "data-testid": "price-list-details-form-status-option-active"
+                    }
+                  )
+                ]
+              }
+            ) }),
+            /* @__PURE__ */ jsx2(Form.ErrorMessage, { "data-testid": "price-list-details-form-status-error" })
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsx2(
+        Form.Field,
+        {
+          control: form.control,
+          name: "title",
+          render: ({ field }) => /* @__PURE__ */ jsxs2(Form.Item, { "data-testid": "price-list-details-form-title-item", children: [
+            /* @__PURE__ */ jsx2(Form.Label, { "data-testid": "price-list-details-form-title-label", children: t("fields.title") }),
+            /* @__PURE__ */ jsx2(Form.Control, { "data-testid": "price-list-details-form-title-control", children: /* @__PURE__ */ jsx2(Input, { ...field, "data-testid": "price-list-details-form-title-input" }) }),
+            /* @__PURE__ */ jsx2(Form.ErrorMessage, { "data-testid": "price-list-details-form-title-error" })
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsx2(
+        Form.Field,
+        {
+          control: form.control,
+          name: "description",
+          render: ({ field }) => /* @__PURE__ */ jsxs2(Form.Item, { "data-testid": "price-list-details-form-description-item", children: [
+            /* @__PURE__ */ jsx2(Form.Label, { "data-testid": "price-list-details-form-description-label", children: t("fields.description") }),
+            /* @__PURE__ */ jsx2(Form.Control, { "data-testid": "price-list-details-form-description-control", children: /* @__PURE__ */ jsx2(Textarea, { ...field, "data-testid": "price-list-details-form-description-input" }) }),
+            /* @__PURE__ */ jsx2(Form.ErrorMessage, { "data-testid": "price-list-details-form-description-error" })
+          ] })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx2(Divider, {}),
+    /* @__PURE__ */ jsxs2("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [
+      /* @__PURE__ */ jsx2(
+        Form.Field,
+        {
+          control: form.control,
+          name: "starts_at",
+          render: ({ field }) => /* @__PURE__ */ jsxs2(Form.Item, { "data-testid": "price-list-details-form-starts-at-item", children: [
+            /* @__PURE__ */ jsx2(Form.Label, { optional: true, "data-testid": "price-list-details-form-starts-at-label", children: t("priceLists.fields.startsAt.label") }),
+            /* @__PURE__ */ jsx2(Form.Control, { "data-testid": "price-list-details-form-starts-at-control", children: /* @__PURE__ */ jsx2(
+              DatePicker,
+              {
+                granularity: "minute",
+                shouldCloseOnSelect: false,
+                ...field,
+                "data-testid": "price-list-details-form-starts-at-input"
+              }
+            ) }),
+            /* @__PURE__ */ jsx2(Form.ErrorMessage, { "data-testid": "price-list-details-form-starts-at-error" })
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsx2(
+        Form.Field,
+        {
+          control: form.control,
+          name: "ends_at",
+          render: ({ field }) => /* @__PURE__ */ jsxs2(Form.Item, { "data-testid": "price-list-details-form-ends-at-item", children: [
+            /* @__PURE__ */ jsx2(Form.Label, { optional: true, "data-testid": "price-list-details-form-ends-at-label", children: t("priceLists.fields.endsAt.label") }),
+            /* @__PURE__ */ jsx2(Form.Control, { "data-testid": "price-list-details-form-ends-at-control", children: /* @__PURE__ */ jsx2(
+              DatePicker,
+              {
+                granularity: "minute",
+                shouldCloseOnSelect: false,
+                ...field,
+                "data-testid": "price-list-details-form-ends-at-input"
+              }
+            ) }),
+            /* @__PURE__ */ jsx2(Form.ErrorMessage, { "data-testid": "price-list-details-form-ends-at-error" })
+          ] })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx2(Divider, {}),
+    /* @__PURE__ */ jsx2(
+      Form.Field,
+      {
+        control: form.control,
+        name: "rules.customer_group_id",
+        render: ({ field }) => {
+          return /* @__PURE__ */ jsxs2(Form.Item, { "data-testid": "price-list-details-form-customer-group-item", children: [
+            /* @__PURE__ */ jsxs2("div", { children: [
+              /* @__PURE__ */ jsx2(Form.Label, { optional: true, "data-testid": "price-list-details-form-customer-group-label", children: t("priceLists.fields.customerAvailability.label") }),
+              /* @__PURE__ */ jsx2(Form.Hint, { "data-testid": "price-list-details-form-customer-group-hint", children: t("priceLists.fields.customerAvailability.hint") })
+            ] }),
+            /* @__PURE__ */ jsx2(Form.Control, { "data-testid": "price-list-details-form-customer-group-control", children: /* @__PURE__ */ jsxs2(
+              "div",
+              {
+                className: clx(
+                  "bg-ui-bg-component shadow-elevation-card-rest transition-fg grid gap-1.5 rounded-xl py-1.5",
+                  "aria-[invalid='true']:shadow-borders-error"
+                ),
+                role: "application",
+                ref: field.ref,
+                "data-testid": "price-list-details-form-customer-group-selector",
+                children: [
+                  /* @__PURE__ */ jsxs2("div", { className: "text-ui-fg-subtle grid gap-1.5 px-1.5 md:grid-cols-2", children: [
+                    /* @__PURE__ */ jsx2("div", { className: "bg-ui-bg-field shadow-borders-base txt-compact-small rounded-md px-2 py-1.5", children: t("priceLists.fields.customerAvailability.attribute") }),
+                    /* @__PURE__ */ jsx2("div", { className: "bg-ui-bg-field shadow-borders-base txt-compact-small rounded-md px-2 py-1.5", children: t("operators.in") })
+                  ] }),
+                  /* @__PURE__ */ jsx2("div", { className: "flex items-center gap-1.5 px-1.5", children: /* @__PURE__ */ jsxs2(StackedFocusModal, { id: "cg", children: [
+                    /* @__PURE__ */ jsx2(StackedFocusModal.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs2(
+                      "button",
+                      {
+                        type: "button",
+                        className: "bg-ui-bg-field-component hover:bg-ui-bg-field-component-hover shadow-borders-base txt-compact-small text-ui-fg-muted transition-fg focus-visible:shadow-borders-interactive-with-active flex flex-1 items-center gap-x-2 rounded-md px-2 py-1.5 outline-none",
+                        "data-testid": "price-list-details-form-customer-group-search-button",
+                        children: [
+                          /* @__PURE__ */ jsx2(MagnifyingGlass, {}),
+                          t("priceLists.fields.customerAvailability.placeholder")
+                        ]
+                      }
+                    ) }),
+                    /* @__PURE__ */ jsx2(StackedFocusModal.Trigger, { asChild: true, children: /* @__PURE__ */ jsx2(Button2, { variant: "secondary", "data-testid": "price-list-details-form-customer-group-browse-button", children: t("actions.browse") }) }),
+                    /* @__PURE__ */ jsxs2(StackedFocusModal.Content, { children: [
+                      /* @__PURE__ */ jsx2(StackedFocusModal.Header, {}),
+                      /* @__PURE__ */ jsx2(
+                        PriceListCustomerGroupRuleForm,
+                        {
+                          state: fields,
+                          setState: handleAddCustomerGroup,
+                          type: "focus"
+                        }
+                      )
+                    ] })
+                  ] }) }),
+                  fields.length > 0 ? /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-y-1.5", "data-testid": "price-list-details-form-customer-group-selected", children: [
+                    /* @__PURE__ */ jsx2(Divider, { variant: "dashed" }),
+                    /* @__PURE__ */ jsx2("div", { className: "flex flex-col gap-y-1.5 px-1.5", children: fields.map((field2, index) => {
+                      return /* @__PURE__ */ jsxs2(
+                        "div",
+                        {
+                          className: "bg-ui-bg-field-component shadow-borders-base flex items-center justify-between gap-2 rounded-md px-2 py-0.5",
+                          "data-testid": `price-list-details-form-customer-group-selected-${field2.id}`,
+                          children: [
+                            /* @__PURE__ */ jsx2(Text, { size: "small", leading: "compact", "data-testid": `price-list-details-form-customer-group-selected-${field2.id}-name`, children: field2.name }),
+                            /* @__PURE__ */ jsx2(
+                              IconButton,
+                              {
+                                size: "small",
+                                variant: "transparent",
+                                type: "button",
+                                onClick: () => remove(index),
+                                "data-testid": `price-list-details-form-customer-group-selected-${field2.id}-remove-button`,
+                                children: /* @__PURE__ */ jsx2(XMarkMini, {})
+                              }
+                            )
+                          ]
+                        },
+                        field2.cg_id
+                      );
+                    }) })
+                  ] }) : null
+                ]
+              }
+            ) }),
+            /* @__PURE__ */ jsx2(Form.ErrorMessage, { "data-testid": "price-list-details-form-customer-group-error" })
+          ] });
+        }
+      }
+    )
+  ] }) });
+};
+Root._tabMeta = defineTabMeta({
+  id: "detail",
+  labelKey: "priceLists.create.tabs.details",
+  validationFields: ["type", "title", "description", "starts_at", "ends_at"]
+});
+var PriceListDetailsForm = Root;
+
+// src/pages/price-lists/price-list-create/components/price-list-create-form/price-list-prices-form.tsx
+import { useEffect as useEffect2, useMemo as useMemo2 } from "react";
+import { useWatch } from "react-hook-form";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Root2 = ({
+  currencies,
+  regions,
+  pricePreferences
+}) => {
+  const form = useTabbedForm();
+  const { setValue } = form;
+  const { setCloseOnEscape } = useRouteModal();
+  const offerIds = useWatch({ control: form.control, name: "offer_ids" });
+  const existingOffers = useWatch({ control: form.control, name: "offers" });
+  const { offers: selectedOffers } = useOffers(
+    {
+      id: offerIds,
+      limit: offerIds?.length || 1,
+      fields: "id,variant_id,product_id,seller_id,sku,seller.name,product.title,product.thumbnail"
+    },
+    { enabled: (offerIds?.length ?? 0) > 0 }
+  );
+  const productIds = useMemo2(
+    () => Array.from(
+      new Set((selectedOffers ?? []).map((o) => o.product_id))
+    ),
+    [selectedOffers]
+  );
+  const { products, isLoading } = useProducts(
+    { id: productIds, limit: productIds.length || 1, fields: "id,*variants" },
+    { enabled: productIds.length > 0 }
+  );
+  const { gridData, variantIdByOffer } = useMemo2(
+    () => buildOfferGridData(
+      selectedOffers ?? [],
+      products ?? []
+    ),
+    [selectedOffers, products]
+  );
+  useEffect2(() => {
+    for (const [offerId, variantId] of Object.entries(variantIdByOffer)) {
+      if (!existingOffers?.[offerId]) {
+        setValue(`offers.${offerId}`, {
+          variant_id: variantId,
+          currency_prices: {},
+          region_prices: {}
+        });
+      }
+    }
+  }, [variantIdByOffer, existingOffers, setValue]);
+  const columns = usePriceListGridColumns({
+    currencies,
+    regions,
+    pricePreferences
+  });
+  return /* @__PURE__ */ jsx3("div", { className: "flex size-full flex-col divide-y overflow-hidden", children: /* @__PURE__ */ jsx3(
+    DataGrid,
+    {
+      isLoading,
+      columns,
+      data: gridData,
+      state: form,
+      onEditingChange: (editing) => setCloseOnEscape(!editing)
+    }
+  ) });
+};
+Root2._tabMeta = defineTabMeta({
+  id: "price",
+  labelKey: "priceLists.create.tabs.prices",
+  validationFields: ["offers"]
+});
+var PriceListPricesForm = Root2;
+
+// src/pages/price-lists/price-list-create/components/price-list-create-form/price-list-products-form.tsx
+import { keepPreviousData as keepPreviousData2 } from "@tanstack/react-query";
+import { useMemo as useMemo3, useRef, useState as useState2 } from "react";
+import { useTranslation as useTranslation3 } from "react-i18next";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var PAGE_SIZE2 = 50;
+var PREFIX2 = "p";
+var Root3 = () => {
+  const { t } = useTranslation3();
+  const form = useTabbedForm();
+  const { setValue } = form;
+  const [rowSelection, setRowSelection] = useState2({});
+  const { searchParams, raw } = useOfferTableQuery({
+    pageSize: PAGE_SIZE2,
+    prefix: PREFIX2
+  });
+  const { offers, count, isLoading, isError, error } = useOffers(searchParams, {
+    placeholderData: keepPreviousData2
+  });
+  const offerMeta = useRef({});
+  for (const offer of offers ?? []) {
+    offerMeta.current[offer.id] = {
+      product_id: offer.product_id,
+      offer_ids: offer.offer_ids ?? [offer.id]
+    };
+  }
+  const updater = (fn) => {
+    const state = typeof fn === "function" ? fn(rowSelection) : fn;
+    const selectedRowIds = Object.keys(state).filter(
+      (rowId) => offerMeta.current[rowId]
+    );
+    const productIds = Array.from(
+      new Set(selectedRowIds.map((id) => offerMeta.current[id].product_id))
+    );
+    const offerIds = Array.from(
+      new Set(selectedRowIds.flatMap((id) => offerMeta.current[id].offer_ids))
+    );
+    setValue(
+      "product_ids",
+      productIds.map((id) => ({ id })),
+      { shouldDirty: true, shouldTouch: true }
+    );
+    setValue("offer_ids", offerIds, {
+      shouldDirty: true,
+      shouldTouch: true
+    });
+    setRowSelection(state);
+  };
+  const columns = useColumns2();
+  const filters = useOfferTableFilters();
+  const { table } = useDataTable({
+    data: offers ?? [],
+    columns,
+    count,
+    enablePagination: true,
+    enableRowSelection: true,
+    getRowId: (row) => row.id,
+    rowSelection: {
+      state: rowSelection,
+      updater
+    },
+    pageSize: PAGE_SIZE2,
+    prefix: PREFIX2
+  });
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx4("div", { className: "flex size-full flex-col", children: /* @__PURE__ */ jsx4(
+    _DataTable,
+    {
+      table,
+      columns,
+      filters,
+      pageSize: PAGE_SIZE2,
+      prefix: PREFIX2,
+      count,
+      isLoading,
+      layout: "fill",
+      orderBy: [
+        { key: "created_at", label: t("fields.createdAt") },
+        { key: "updated_at", label: t("fields.updatedAt") }
+      ],
+      defaultOrder: "-created_at",
+      pagination: true,
+      search: true,
+      queryObject: raw,
+      noRecords: {
+        message: t("priceLists.create.products.list.noRecordsMessage")
+      }
+    }
+  ) });
+};
+var useColumns2 = () => {
+  const base = useOfferTableColumns();
+  return useMemo3(
+    () => base.slice(0, -1),
+    [base]
+  );
+};
+Root3._tabMeta = defineTabMeta({
+  id: "product",
+  labelKey: "priceLists.create.tabs.products",
+  validationFields: ["product_ids"]
+});
+var PriceListProductsForm = Root3;
+
+// src/pages/price-lists/price-list-create/components/price-list-create-form/price-list-create-form.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var PriceListCreateForm = ({
+  regions,
+  currencies,
+  pricePreferences,
+  children,
+  schema,
+  defaultValues: extraDefaults
+}) => {
+  const { t } = useTranslation4();
+  const { handleSuccess } = useRouteModal();
+  const form = useForm({
+    defaultValues: {
+      type: "sale",
+      status: "draft",
+      title: "",
+      description: "",
+      starts_at: null,
+      ends_at: null,
+      product_ids: [],
+      offer_ids: [],
+      offers: {},
+      rules: {
+        customer_group_id: []
+      },
+      ...extraDefaults
+    },
+    resolver: zodResolver(schema ?? PricingCreateSchema)
+  });
+  const { mutateAsync, isPending } = useCreatePriceList();
+  const handleSubmit = form.handleSubmit(async (data) => {
+    const { rules, offers } = data;
+    const rulesPayload = rules?.customer_group_id?.length ? { "customer.groups.id": rules.customer_group_id.map((cg) => cg.id) } : void 0;
+    const prices = extractPricesFromOffers(offers, regions);
+    await mutateAsync(
+      {
+        title: data.title,
+        type: data.type,
+        status: data.status,
+        description: data.description,
+        starts_at: data.starts_at ? data.starts_at.toISOString() : null,
+        ends_at: data.ends_at ? data.ends_at.toISOString() : null,
+        rules: rulesPayload,
+        prices
+      },
+      {
+        onSuccess: ({ price_list }) => {
+          toast.success(
+            t("priceLists.create.successToast", {
+              title: price_list.title
+            })
+          );
+          handleSuccess(`../${price_list.id}`);
+        },
+        onError: (error) => {
+          toast.error(error.message);
+        }
+      }
+    );
+  });
+  const defaultTabs = useMemo4(
+    () => [
+      /* @__PURE__ */ jsx5(PriceListDetailsForm, {}, "detail"),
+      /* @__PURE__ */ jsx5(PriceListProductsForm, {}, "product"),
+      /* @__PURE__ */ jsx5(
+        PriceListPricesForm,
+        {
+          currencies,
+          regions,
+          pricePreferences
+        },
+        "price"
+      )
+    ],
+    [currencies, regions, pricePreferences]
+  );
+  const hasCustomChildren = Children.count(children) > 0;
+  return /* @__PURE__ */ jsx5(
+    TabbedForm,
+    {
+      model: "price_list",
+      zone: "create",
+      form,
+      onSubmit: handleSubmit,
+      isLoading: isPending,
+      children: hasCustomChildren ? children : defaultTabs
+    }
+  );
+};
+
+// src/pages/price-lists/price-list-create/price-list-create.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var Root4 = ({ children }) => {
+  const { isReady, regions, currencies, pricePreferences } = usePriceListCurrencyData();
+  return /* @__PURE__ */ jsx6(RouteFocusModal, { children: isReady && (Children2.count(children) > 0 ? children : /* @__PURE__ */ jsx6(
+    PriceListCreateForm,
+    {
+      regions,
+      currencies,
+      pricePreferences
+    }
+  )) });
+};
+var PriceListCreatePage = Object.assign(Root4, {
+  Form: PriceListCreateForm,
+  DetailsTab: PriceListDetailsForm,
+  ProductsTab: PriceListProductsForm,
+  PricesTab: PriceListPricesForm,
+  Tab: TabbedForm.Tab
+});
+var PriceListCreate = Root4;
+
+export {
+  PricingCreateSchema,
+  PriceListCreatePage,
+  PriceListCreate
+};