@medusajs/dashboard 3.0.0-snapshot-20251216135612 → 3.0.0-snapshot-20260102125810

package/dist/product-option-list-YHGRI7OJ.mjs

@@ -0,0 +1,268 @@
+import {
+  TextCell
+} from "./chunk-MSDRGCRR.mjs";
+import "./chunk-P3UUX2T6.mjs";
+import {
+  useProductOptionTableFilters
+} from "./chunk-IWNNQ6HA.mjs";
+import "./chunk-CBSCX7RE.mjs";
+import "./chunk-LT4MVCA7.mjs";
+import "./chunk-LEAMWI5H.mjs";
+import "./chunk-W7625H47.mjs";
+import "./chunk-DLZWPHHO.mjs";
+import "./chunk-6OU4CHZI.mjs";
+import "./chunk-LSEYENCI.mjs";
+import "./chunk-QHRAWZGA.mjs";
+import {
+  SingleColumnPage
+} from "./chunk-GIZFNLKK.mjs";
+import {
+  DataTable
+} from "./chunk-KCWP7RF5.mjs";
+import "./chunk-R4ZOO4ON.mjs";
+import {
+  useQueryParams
+} from "./chunk-C76H5USB.mjs";
+import "./chunk-DFFLVEZ5.mjs";
+import "./chunk-G4BWCU5P.mjs";
+import {
+  useExtension
+} from "./chunk-C5P5PL3E.mjs";
+import "./chunk-OZPB6JBL.mjs";
+import "./chunk-OC7BQLYI.mjs";
+import "./chunk-S4DMV3ZT.mjs";
+import "./chunk-535OVBXR.mjs";
+import "./chunk-74WPAWMW.mjs";
+import "./chunk-I4OBEAOJ.mjs";
+import "./chunk-HI6URQ7H.mjs";
+import "./chunk-6CLQKVAU.mjs";
+import "./chunk-ML7BA2NY.mjs";
+import "./chunk-KI7TOXBR.mjs";
+import "./chunk-QBIQEVTU.mjs";
+import "./chunk-WAXMT4IY.mjs";
+import "./chunk-DYDGGABK.mjs";
+import "./chunk-CN7JXSGW.mjs";
+import "./chunk-LGNTHZ5Y.mjs";
+import "./chunk-5BQQRHQS.mjs";
+import "./chunk-G35UUG2P.mjs";
+import "./chunk-5AFMB7XQ.mjs";
+import "./chunk-VQ73B7ZZ.mjs";
+import "./chunk-A63RZVX6.mjs";
+import "./chunk-HBXV7ENS.mjs";
+import "./chunk-CDORR33H.mjs";
+import "./chunk-333HK6Y6.mjs";
+import "./chunk-GJN5SXGZ.mjs";
+import "./chunk-Q34TRFIW.mjs";
+import "./chunk-3BF5SC66.mjs";
+import "./chunk-DWH2OQFK.mjs";
+import "./chunk-VCSSQVPD.mjs";
+import "./chunk-HP2JH45P.mjs";
+import "./chunk-SQDIZZDW.mjs";
+import {
+  useDeleteProductOptionLazy,
+  useProductOptions
+} from "./chunk-UCYUWNJL.mjs";
+import "./chunk-7AXHHXCX.mjs";
+import "./chunk-FXYH54JP.mjs";
+import "./chunk-774WSTCC.mjs";
+import "./chunk-NFEK63OE.mjs";
+import "./chunk-QZ7TP4HQ.mjs";
+
+// src/routes/product-options/product-option-list/components/product-option-list-table/product-option-list-table.tsx
+import {
+  Container,
+  createDataTableColumnHelper,
+  toast,
+  usePrompt
+} from "@medusajs/ui";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { keepPreviousData } from "@tanstack/react-query";
+import { useCallback, useMemo as useMemo2 } from "react";
+import { useNavigate } from "react-router-dom";
+import { PencilSquare, Trash } from "@medusajs/icons";
+
+// src/hooks/table/columns/use-product-option-table-columns.tsx
+import { createColumnHelper } from "@tanstack/react-table";
+import { useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { Badge } from "@medusajs/ui";
+import { jsx } from "react/jsx-runtime";
+var columnHelper = createColumnHelper();
+var useProductOptionTableColumns = () => {
+  const { t } = useTranslation();
+  return useMemo(
+    () => [
+      columnHelper.accessor("title", {
+        header: t("fields.title"),
+        cell: ({ getValue }) => /* @__PURE__ */ jsx(TextCell, { text: getValue() })
+      }),
+      columnHelper.accessor("values", {
+        header: t("fields.values"),
+        cell: ({ getValue }) => {
+          const values = getValue();
+          const count = values?.length || 0;
+          const displayText = count > 0 ? `${count} ${count === 1 ? "value" : "values"}` : "-";
+          return /* @__PURE__ */ jsx(TextCell, { text: displayText });
+        }
+      }),
+      columnHelper.accessor("is_exclusive", {
+        header: t("fields.status"),
+        cell: ({ getValue }) => {
+          const isExclusive = getValue();
+          return /* @__PURE__ */ jsx(Badge, { size: "xsmall", color: isExclusive ? "grey" : "blue", children: t(`general.${isExclusive ? "exclusive" : "global"}`) });
+        }
+      })
+    ],
+    [t]
+  );
+};
+
+// src/hooks/table/query/use-product-option-table-query.tsx
+var useProductOptionTableQuery = ({
+  prefix,
+  pageSize = 20
+}) => {
+  const queryObject = useQueryParams(
+    ["offset", "q", "order", "created_at", "updated_at", "is_exclusive"],
+    prefix
+  );
+  const { offset, created_at, updated_at, q, order, is_exclusive } = queryObject;
+  const searchParams = {
+    limit: pageSize,
+    offset: offset ? Number(offset) : 0,
+    order,
+    created_at: created_at ? JSON.parse(created_at) : void 0,
+    updated_at: updated_at ? JSON.parse(updated_at) : void 0,
+    is_exclusive: is_exclusive ? JSON.parse(is_exclusive) : void 0,
+    q
+  };
+  return {
+    searchParams,
+    raw: queryObject
+  };
+};
+
+// src/routes/product-options/product-option-list/components/product-option-list-table/product-option-list-table.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var PAGE_SIZE = 20;
+var ProductOptionListTable = () => {
+  const { t } = useTranslation2();
+  const { searchParams } = useProductOptionTableQuery({
+    pageSize: PAGE_SIZE
+  });
+  const { product_options, count, isError, error, isLoading } = useProductOptions(searchParams, {
+    placeholderData: keepPreviousData
+  });
+  const filters = useProductOptionTableFilters();
+  const columns = useColumns();
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx2(Container, { className: "divide-y p-0", children: /* @__PURE__ */ jsx2(
+    DataTable,
+    {
+      data: product_options,
+      columns,
+      filters,
+      rowCount: count,
+      pageSize: PAGE_SIZE,
+      getRowId: (row) => row.id,
+      heading: t("productOptions.domain"),
+      subHeading: t("productOptions.subtitle"),
+      emptyState: {
+        empty: {
+          heading: t("general.noRecordsMessage")
+        },
+        filtered: {
+          heading: t("general.noRecordsMessage"),
+          description: t("general.noRecordsMessageFiltered")
+        }
+      },
+      actions: [
+        {
+          label: t("actions.create"),
+          to: "create"
+        }
+      ],
+      isLoading,
+      enableSearch: true,
+      rowHref: (row) => `/product-options/${row.id}`
+    }
+  ) });
+};
+var columnHelper2 = createDataTableColumnHelper();
+var useColumns = () => {
+  const { t } = useTranslation2();
+  const prompt = usePrompt();
+  const navigate = useNavigate();
+  const base = useProductOptionTableColumns();
+  const { mutateAsync } = useDeleteProductOptionLazy();
+  const handleDelete = useCallback(
+    async (productOption) => {
+      const confirm = await prompt({
+        title: t("general.areYouSure"),
+        description: t("productOptions.delete.confirmation", {
+          title: productOption.title
+        }),
+        confirmText: t("actions.delete"),
+        cancelText: t("actions.cancel")
+      });
+      if (!confirm) {
+        return;
+      }
+      await mutateAsync(productOption.id, {
+        onSuccess: () => {
+          toast.success(t("productOptions.delete.successToast"));
+        },
+        onError: (e) => {
+          toast.error(e.message);
+        }
+      });
+    },
+    [t, prompt, mutateAsync]
+  );
+  return useMemo2(
+    () => [
+      ...base,
+      columnHelper2.action({
+        actions: (ctx) => [
+          [
+            {
+              icon: /* @__PURE__ */ jsx2(PencilSquare, {}),
+              label: t("actions.edit"),
+              onClick: () => navigate(`/product-options/${ctx.row.original.id}/edit`)
+            }
+          ],
+          [
+            {
+              icon: /* @__PURE__ */ jsx2(Trash, {}),
+              label: t("actions.delete"),
+              onClick: () => handleDelete(ctx.row.original)
+            }
+          ]
+        ]
+      })
+    ],
+    [base, handleDelete, navigate, t]
+  );
+};
+
+// src/routes/product-options/product-option-list/product-option-list.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var ProductOptionList = () => {
+  const { getWidgets } = useExtension();
+  return /* @__PURE__ */ jsx3(
+    SingleColumnPage,
+    {
+      widgets: {
+        after: getWidgets("product_option.list.after"),
+        before: getWidgets("product_option.list.before")
+      },
+      hasOutlet: true,
+      children: /* @__PURE__ */ jsx3(ProductOptionListTable, {})
+    }
+  );
+};
+export {
+  ProductOptionList as Component
+};

package/dist/product-option-metadata-P2DHDGYR.mjs

@@ -0,0 +1,73 @@
+import "./chunk-XRTVFYCW.mjs";
+import {
+  MetadataForm
+} from "./chunk-N3SAXQVR.mjs";
+import "./chunk-IUCDCPJU.mjs";
+import "./chunk-6HTZNHPT.mjs";
+import {
+  RouteDrawer
+} from "./chunk-WVA4O7QS.mjs";
+import "./chunk-D6UW7URG.mjs";
+import "./chunk-LPEUYMRK.mjs";
+import "./chunk-OC7BQLYI.mjs";
+import "./chunk-S4DMV3ZT.mjs";
+import "./chunk-OBQI23QM.mjs";
+import "./chunk-74WPAWMW.mjs";
+import "./chunk-I4OBEAOJ.mjs";
+import "./chunk-HI6URQ7H.mjs";
+import "./chunk-6CLQKVAU.mjs";
+import "./chunk-ML7BA2NY.mjs";
+import "./chunk-KI7TOXBR.mjs";
+import "./chunk-QBIQEVTU.mjs";
+import "./chunk-WAXMT4IY.mjs";
+import "./chunk-DYDGGABK.mjs";
+import "./chunk-CN7JXSGW.mjs";
+import "./chunk-LGNTHZ5Y.mjs";
+import "./chunk-5BQQRHQS.mjs";
+import "./chunk-G35UUG2P.mjs";
+import "./chunk-5AFMB7XQ.mjs";
+import "./chunk-VQ73B7ZZ.mjs";
+import "./chunk-A63RZVX6.mjs";
+import "./chunk-HBXV7ENS.mjs";
+import "./chunk-CDORR33H.mjs";
+import "./chunk-333HK6Y6.mjs";
+import "./chunk-GJN5SXGZ.mjs";
+import "./chunk-Q34TRFIW.mjs";
+import "./chunk-3BF5SC66.mjs";
+import "./chunk-DWH2OQFK.mjs";
+import "./chunk-VCSSQVPD.mjs";
+import "./chunk-HP2JH45P.mjs";
+import "./chunk-SQDIZZDW.mjs";
+import {
+  useProductOption,
+  useUpdateProductOption
+} from "./chunk-UCYUWNJL.mjs";
+import "./chunk-7AXHHXCX.mjs";
+import "./chunk-FXYH54JP.mjs";
+import "./chunk-774WSTCC.mjs";
+import "./chunk-NFEK63OE.mjs";
+import "./chunk-QZ7TP4HQ.mjs";
+
+// src/routes/product-options/product-option-metadata/product-option-metadata.tsx
+import { useParams } from "react-router-dom";
+import { jsx } from "react/jsx-runtime";
+var ProductOptionMetadata = () => {
+  const { id } = useParams();
+  const { product_option, isPending, isError, error } = useProductOption(id);
+  const { mutateAsync, isPending: isMutating } = useUpdateProductOption(id);
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx(RouteDrawer, { children: /* @__PURE__ */ jsx(
+    MetadataForm,
+    {
+      isPending,
+      isMutating,
+      hook: mutateAsync,
+      metadata: product_option?.metadata
+    }
+  ) });
+};
+export {
+  ProductOptionMetadata as Component
+};

package/dist/product-options-manage-4SZDF5H5.mjs

@@ -0,0 +1,325 @@
+import {
+  Combobox
+} from "./chunk-OYHFHBNL.mjs";
+import {
+  PRODUCT_DETAIL_FIELDS
+} from "./chunk-T6DDBLGY.mjs";
+import "./chunk-IUCDCPJU.mjs";
+import {
+  KeyboundForm
+} from "./chunk-6HTZNHPT.mjs";
+import {
+  RouteDrawer
+} from "./chunk-WVA4O7QS.mjs";
+import {
+  useRouteModal
+} from "./chunk-D6UW7URG.mjs";
+import {
+  useExtendableForm
+} from "./chunk-BJ44US4R.mjs";
+import "./chunk-2SSUH2HJ.mjs";
+import "./chunk-ONB3JEHR.mjs";
+import "./chunk-YCDDT44O.mjs";
+import "./chunk-4GQOUCX6.mjs";
+import "./chunk-RYJ2UVJE.mjs";
+import "./chunk-D3YQN7HV.mjs";
+import "./chunk-PMA2D6IL.mjs";
+import "./chunk-MNXC6Q4F.mjs";
+import "./chunk-DG7J63J2.mjs";
+import "./chunk-G4BWCU5P.mjs";
+import {
+  useExtension
+} from "./chunk-C5P5PL3E.mjs";
+import "./chunk-LPEUYMRK.mjs";
+import "./chunk-ZCARHA6C.mjs";
+import "./chunk-OZPB6JBL.mjs";
+import "./chunk-OC7BQLYI.mjs";
+import "./chunk-S4DMV3ZT.mjs";
+import "./chunk-535OVBXR.mjs";
+import {
+  Form
+} from "./chunk-OBQI23QM.mjs";
+import "./chunk-74WPAWMW.mjs";
+import "./chunk-I4OBEAOJ.mjs";
+import "./chunk-HI6URQ7H.mjs";
+import "./chunk-6CLQKVAU.mjs";
+import "./chunk-ML7BA2NY.mjs";
+import "./chunk-KI7TOXBR.mjs";
+import "./chunk-QBIQEVTU.mjs";
+import "./chunk-WAXMT4IY.mjs";
+import "./chunk-DYDGGABK.mjs";
+import "./chunk-CN7JXSGW.mjs";
+import "./chunk-LGNTHZ5Y.mjs";
+import "./chunk-5BQQRHQS.mjs";
+import "./chunk-G35UUG2P.mjs";
+import "./chunk-5AFMB7XQ.mjs";
+import "./chunk-VQ73B7ZZ.mjs";
+import "./chunk-A63RZVX6.mjs";
+import "./chunk-HBXV7ENS.mjs";
+import "./chunk-CDORR33H.mjs";
+import "./chunk-333HK6Y6.mjs";
+import "./chunk-GJN5SXGZ.mjs";
+import "./chunk-Q34TRFIW.mjs";
+import "./chunk-3BF5SC66.mjs";
+import "./chunk-DWH2OQFK.mjs";
+import "./chunk-VCSSQVPD.mjs";
+import "./chunk-HP2JH45P.mjs";
+import "./chunk-SQDIZZDW.mjs";
+import {
+  useLinkProductOptions,
+  useProduct,
+  useProductOptions
+} from "./chunk-UCYUWNJL.mjs";
+import "./chunk-7AXHHXCX.mjs";
+import "./chunk-FXYH54JP.mjs";
+import "./chunk-774WSTCC.mjs";
+import "./chunk-NFEK63OE.mjs";
+import "./chunk-QZ7TP4HQ.mjs";
+
+// src/routes/products/product-options-manage/product-options-manage.tsx
+import { Heading } from "@medusajs/ui";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { useParams } from "react-router-dom";
+
+// src/routes/products/product-options-manage/components/product-options-manage-form/product-options-manage-form.tsx
+import { Button, Hint, Label, toast, Tooltip } from "@medusajs/ui";
+import { useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import * as zod from "zod";
+import { InformationCircle } from "@medusajs/icons";
+import { jsx, jsxs } from "react/jsx-runtime";
+var ProductOptionsManageSchema = zod.object({
+  option_ids: zod.array(zod.string()),
+  option_values: zod.record(zod.array(zod.string())).optional()
+});
+var ProductOptionsManageForm = ({
+  product
+}) => {
+  const { t } = useTranslation();
+  const { handleSuccess } = useRouteModal();
+  const { getFormConfigs } = useExtension();
+  const configs = getFormConfigs("product", "edit");
+  const { product_options = [], isLoading } = useProductOptions();
+  const productOptionChoices = useMemo(() => {
+    return product_options.map((option) => ({
+      value: option.id,
+      label: option.title
+    }));
+  }, [product_options]);
+  const [selectedOptionIds, setSelectedOptionIds] = useState(
+    product.options?.map((opt) => opt.id) || []
+  );
+  const [selectedOptionValues, setSelectedOptionValues] = useState(() => {
+    const initialValues = {};
+    product.options?.forEach((opt) => {
+      initialValues[opt.id] = opt.values?.map((v) => v.id) || [];
+    });
+    return initialValues;
+  });
+  const form = useExtendableForm({
+    defaultValues: {
+      option_ids: product.options?.map((opt) => opt.id) || [],
+      option_values: (() => {
+        const initialValues = {};
+        product.options?.forEach((opt) => {
+          initialValues[opt.id] = opt.values?.map((v) => v.id) || [];
+        });
+        return initialValues;
+      })()
+    },
+    schema: ProductOptionsManageSchema,
+    configs,
+    data: product
+  });
+  const { mutateAsync, isPending } = useLinkProductOptions(product.id);
+  const handleProductOptionSelect = (optionIds) => {
+    setSelectedOptionIds(optionIds);
+    form.setValue("option_ids", optionIds);
+    const newSelectedValues = {};
+    const selectedProductOptions = product_options.filter(
+      (option) => optionIds.includes(option.id)
+    );
+    selectedProductOptions.forEach((option) => {
+      if (selectedOptionValues[option.id]) {
+        newSelectedValues[option.id] = selectedOptionValues[option.id];
+      } else {
+        newSelectedValues[option.id] = option.values?.map((v) => v.id) || [];
+      }
+    });
+    setSelectedOptionValues(newSelectedValues);
+    form.setValue("option_values", newSelectedValues);
+  };
+  const handleValueChange = (optionId, valueIds) => {
+    if (valueIds.length === 0) {
+      return;
+    }
+    const updatedSelectedValues = {
+      ...selectedOptionValues,
+      [optionId]: valueIds
+    };
+    setSelectedOptionValues(updatedSelectedValues);
+    form.setValue("option_values", updatedSelectedValues);
+  };
+  const handleSubmit = form.handleSubmit(async (data) => {
+    const currentOptionIds = product.options?.map((opt) => opt.id) || [];
+    const newOptionIds = data.option_ids;
+    const optionsToAdd = [];
+    const optionsToRemove = [];
+    for (const currentId of currentOptionIds) {
+      if (!newOptionIds.includes(currentId)) {
+        optionsToRemove.push(currentId);
+      }
+    }
+    for (const newId of newOptionIds) {
+      const isNewOption = !currentOptionIds.includes(newId);
+      if (isNewOption) {
+        optionsToAdd.push(
+          data.option_values ? {
+            id: newId,
+            value_ids: data.option_values[newId]
+          } : newId
+        );
+      } else {
+        const currentOption = product.options?.find((opt) => opt.id === newId);
+        const currentValueIds = currentOption?.values?.map((v) => v.id).sort() || [];
+        const newValueIds = [...data.option_values?.[newId] || []].sort();
+        const valuesChanged = currentValueIds.length !== newValueIds.length || currentValueIds.some((id, index) => id !== newValueIds[index]);
+        if (valuesChanged) {
+          optionsToRemove.push(newId);
+          optionsToAdd.push(
+            data.option_values ? {
+              id: newId,
+              value_ids: data.option_values[newId]
+            } : newId
+          );
+        }
+      }
+    }
+    await mutateAsync(
+      {
+        add: optionsToAdd,
+        remove: optionsToRemove
+      },
+      {
+        onSuccess: ({ product: product2 }) => {
+          toast.success(
+            t("products.organization.edit.toasts.success", {
+              title: product2.title
+            })
+          );
+          handleSuccess();
+        },
+        onError: (error) => {
+          toast.error(error.message);
+        }
+      }
+    );
+  });
+  return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { onSubmit: handleSubmit, className: "flex h-full flex-col", children: [
+    /* @__PURE__ */ jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col gap-y-4", children: [
+      /* @__PURE__ */ jsx(
+        Form.Field,
+        {
+          control: form.control,
+          name: "option_ids",
+          render: ({ field }) => {
+            return /* @__PURE__ */ jsxs(Form.Item, { children: [
+              /* @__PURE__ */ jsx(Form.Label, { children: t("products.options.manage.label") }),
+              /* @__PURE__ */ jsx(Form.Hint, { children: t("products.options.manage.hint") }),
+              /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
+                Combobox,
+                {
+                  ...field,
+                  value: selectedOptionIds,
+                  onChange: (value) => handleProductOptionSelect(value),
+                  options: productOptionChoices,
+                  placeholder: t("products.options.manage.placeholder"),
+                  disabled: isLoading,
+                  displayMode: "chips"
+                }
+              ) }),
+              /* @__PURE__ */ jsx(Form.ErrorMessage, {})
+            ] });
+          }
+        }
+      ),
+      selectedOptionIds.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+          /* @__PURE__ */ jsx(Label, { weight: "plus", children: t("fields.values") }),
+          /* @__PURE__ */ jsx(Hint, { children: t("products.create.variants.selectValuesHint") })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-3", children: product_options.filter((option) => selectedOptionIds.includes(option.id)).map((option) => {
+          const valueOptions = option.values?.sort((a, b) => {
+            const rankA = a.rank ?? Number.MAX_VALUE;
+            const rankB = b.rank ?? Number.MAX_VALUE;
+            return rankA - rankB;
+          }).map((v) => ({
+            value: v.id,
+            label: v.value
+          })) || [];
+          return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-2", children: [
+            /* @__PURE__ */ jsxs(
+              Label,
+              {
+                className: "flex items-center gap-x-1",
+                size: "small",
+                weight: "plus",
+                children: [
+                  option.title,
+                  option.is_exclusive && /* @__PURE__ */ jsx(
+                    Tooltip,
+                    {
+                      content: t(
+                        "productOptions.manage.exclusiveOption"
+                      ),
+                      children: /* @__PURE__ */ jsx(InformationCircle, { className: "text-ui-fg-subtle pt-[1px]" })
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Combobox,
+              {
+                value: selectedOptionValues[option.id] || [],
+                onChange: (value) => handleValueChange(option.id, value),
+                options: valueOptions,
+                placeholder: t(
+                  "products.fields.options.variantionsPlaceholder"
+                ),
+                displayMode: "chips"
+              }
+            )
+          ] }, option.id);
+        }) })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+      /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: t("actions.cancel") }) }),
+      /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: t("actions.save") })
+    ] }) })
+  ] }) });
+};
+
+// src/routes/products/product-options-manage/product-options-manage.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var ProductOptionsManage = () => {
+  const { id } = useParams();
+  const { t } = useTranslation2();
+  const { product, isLoading, isError, error } = useProduct(id, {
+    fields: PRODUCT_DETAIL_FIELDS
+  });
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsxs2(RouteDrawer, { children: [
+    /* @__PURE__ */ jsxs2(RouteDrawer.Header, { children: [
+      /* @__PURE__ */ jsx2(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx2(Heading, { children: t("products.options.manage.header") }) }),
+      /* @__PURE__ */ jsx2(RouteDrawer.Description, { className: "sr-only", children: t("products.options.manage.description") })
+    ] }),
+    !isLoading && product && /* @__PURE__ */ jsx2(ProductOptionsManageForm, { product })
+  ] });
+};
+export {
+  ProductOptionsManage as Component
+};