@mercurjs/admin 2.2.0-canary.2 → 2.2.0-canary.20

package/dist/commission-rate-create-DCMGZS3D.js

@@ -1,783 +0,0 @@
-import {
-  TargetForm,
-  TargetItem,
-  TaxRateRuleReferenceSchema
-} from "./chunk-BECQJZQ4.js";
-import "./chunk-5A4JNOK3.js";
-import "./chunk-O5VKW5FL.js";
-import "./chunk-LTBX54CI.js";
-import "./chunk-LQAAVRET.js";
-import "./chunk-AFQS6E4N.js";
-import "./chunk-QG6PLWNH.js";
-import "./chunk-DBYUB2YI.js";
-import "./chunk-54EPH67T.js";
-import "./chunk-4F5GP7J7.js";
-import "./chunk-JQV7CXEC.js";
-import "./chunk-KOURHC2N.js";
-import "./chunk-2ZFELO2L.js";
-import "./chunk-26OOAKQ6.js";
-import "./chunk-ZQZHFMD7.js";
-import "./chunk-I5THQVYP.js";
-import "./chunk-JQBSPUH2.js";
-import "./chunk-CMHI2RPL.js";
-import "./chunk-S2WEYEQR.js";
-import {
-  PercentageInput
-} from "./chunk-MAEP2UCK.js";
-import "./chunk-HINXQTCW.js";
-import "./chunk-HC25LNX7.js";
-import "./chunk-BVZAGCTV.js";
-import "./chunk-MG4GKUJW.js";
-import "./chunk-AYVH6Q5O.js";
-import "./chunk-VOHEQ7B5.js";
-import "./chunk-N5IUYCUZ.js";
-import "./chunk-7SVLKK6Q.js";
-import "./chunk-GR6JUIRU.js";
-import "./chunk-PVZBDWLK.js";
-import "./chunk-3B6MTW5G.js";
-import "./chunk-VKOE5J66.js";
-import "./chunk-DY3XQPHC.js";
-import "./chunk-NOWUEJ74.js";
-import "./chunk-VW56KWO2.js";
-import "./chunk-TZSOL34K.js";
-import "./chunk-25LYVP3C.js";
-import "./chunk-2Y3WMGN6.js";
-import "./chunk-JHIMVLB2.js";
-import "./chunk-PXYDR7WQ.js";
-import "./chunk-JRTZWK77.js";
-import "./chunk-Q2QFNTNX.js";
-import "./chunk-H5EOOXPA.js";
-import "./chunk-5POK3PM3.js";
-import "./chunk-LYZDVZWA.js";
-import "./chunk-FWPGOIFA.js";
-import "./chunk-DB6ANJBO.js";
-import "./chunk-PHOCVOZ5.js";
-import "./chunk-FQERBIVS.js";
-import "./chunk-NQEXDLYH.js";
-import "./chunk-YN3FGNJM.js";
-import "./chunk-KAZ5BYTQ.js";
-import "./chunk-634XVU3D.js";
-import "./chunk-RT6L7JXU.js";
-import "./chunk-4YWKKCTT.js";
-import {
-  currencies,
-  getCurrencySymbol
-} from "./chunk-IQPN4PZJ.js";
-import "./chunk-TKGWSUEI.js";
-import {
-  KeyboundForm
-} from "./chunk-U2ZFCAPX.js";
-import {
-  RouteFocusModal,
-  StackedFocusModal,
-  useRouteModal,
-  useStackedModal
-} from "./chunk-FWJLS7XD.js";
-import {
-  Form
-} from "./chunk-3QSRE5LS.js";
-import "./chunk-WIYFXWRI.js";
-import "./chunk-UZWFZMOX.js";
-import "./chunk-XQNVC4Q7.js";
-import "./chunk-DZIXC7OE.js";
-import "./chunk-THHRRYRS.js";
-import "./chunk-AXTQMIIK.js";
-import "./chunk-OH4AABUT.js";
-import "./chunk-AEMDNTW5.js";
-import "./chunk-LYD3C73Z.js";
-import "./chunk-FTAR3BDS.js";
-import "./chunk-46M463BR.js";
-import "./chunk-ZZ3XFIEM.js";
-import "./chunk-533GMKEG.js";
-import "./chunk-YFRC6GEN.js";
-import "./chunk-DAXXLQKB.js";
-import {
-  useCreateCommissionRate
-} from "./chunk-OHOWEMHO.js";
-import "./chunk-JPNPTILP.js";
-import "./chunk-GKGLVDDV.js";
-import "./chunk-N6SI4IIT.js";
-import "./chunk-WJJXUXSO.js";
-import "./chunk-LAPEZATU.js";
-import "./chunk-OSEIN4Y2.js";
-import "./chunk-XZZTC7E5.js";
-import "./chunk-ZN7LWXVC.js";
-import "./chunk-VYMODH6P.js";
-import "./chunk-LEG67A2R.js";
-import "./chunk-PRBE5CM3.js";
-import "./chunk-5TRY5IMZ.js";
-import "./chunk-EPHVGD5Z.js";
-import "./chunk-B3EEDC47.js";
-import "./chunk-A772RAKB.js";
-import "./chunk-ESPLVOFC.js";
-import {
-  useStore
-} from "./chunk-FXWKGNRV.js";
-import "./chunk-VDKOJ5WD.js";
-import "./chunk-S5BJ5CMF.js";
-import "./chunk-H5PYBIOZ.js";
-import "./chunk-LAVHRER2.js";
-import {
-  useDocumentDirection
-} from "./chunk-Y7QKP6QU.js";
-import "./chunk-INNFZYX2.js";
-import "./chunk-2YYXP6XI.js";
-import "./chunk-RHKRREUU.js";
-import "./chunk-ZA2KFUFR.js";
-import "./chunk-ZBWL72TB.js";
-import "./chunk-NBMM2TZK.js";
-
-// src/pages/commission-rates/commission-rate-create/components/create-commission-rate-form/create-commission-rate-form.tsx
-import { zodResolver } from "@hookform/resolvers/zod";
-import {
-  Button,
-  CurrencyInput,
-  Divider,
-  Heading,
-  Hint,
-  Input,
-  Label,
-  Select,
-  Text,
-  clx,
-  toast,
-  Switch
-} from "@medusajs/ui";
-import { MagnifyingGlass } from "@medusajs/icons";
-import { useEffect } from "react";
-import { useFieldArray, useForm, useWatch } from "react-hook-form";
-import { useTranslation } from "react-i18next";
-import * as zod from "zod";
-import { jsx, jsxs } from "react/jsx-runtime";
-var STACKED_MODAL_ID = "cr";
-var getStackedModalId = (type) => `${STACKED_MODAL_ID}-${type}`;
-var CreateCommissionRateSchema = zod.object({
-  name: zod.string().min(1),
-  code: zod.string().min(1),
-  type: zod.enum(["fixed", "percentage"]),
-  target: zod.enum(["item", "shipping"]),
-  value: zod.coerce.number().min(0),
-  currency_code: zod.string().optional(),
-  min_amount: zod.coerce.number().optional(),
-  include_tax: zod.boolean(),
-  is_enabled: zod.boolean(),
-  priority: zod.coerce.number().int().min(0),
-  enabled_rules: zod.object({
-    product: zod.boolean(),
-    product_type: zod.boolean(),
-    shipping_option: zod.boolean()
-  }),
-  product: zod.array(TaxRateRuleReferenceSchema).optional(),
-  product_type: zod.array(TaxRateRuleReferenceSchema).optional(),
-  shipping_option: zod.array(TaxRateRuleReferenceSchema).optional()
-});
-var CreateCommissionRateForm = ({
-  store
-}) => {
-  const { t } = useTranslation();
-  const { handleSuccess } = useRouteModal();
-  const { setIsOpen } = useStackedModal();
-  const direction = useDocumentDirection();
-  const form = useForm({
-    defaultValues: {
-      name: "",
-      code: "",
-      type: "percentage",
-      target: "item",
-      value: 0,
-      currency_code: "",
-      min_amount: void 0,
-      include_tax: false,
-      is_enabled: true,
-      priority: 0,
-      enabled_rules: {
-        product: false,
-        product_type: false,
-        shipping_option: false
-      },
-      product: [],
-      product_type: [],
-      shipping_option: []
-    },
-    resolver: zodResolver(CreateCommissionRateSchema)
-  });
-  const storeCurrencies = (store?.supported_currencies ?? []).map(
-    (c) => currencies[c.currency_code.toUpperCase()]
-  );
-  const defaultCurrencyCode = store?.supported_currencies?.[0]?.currency_code ?? "";
-  useEffect(() => {
-    if (defaultCurrencyCode && !form.getValues("currency_code")) {
-      form.setValue("currency_code", defaultCurrencyCode);
-    }
-  }, [defaultCurrencyCode, form]);
-  const { mutateAsync: createCommissionRate, isPending } = useCreateCommissionRate();
-  const handleSubmit = form.handleSubmit(async (values) => {
-    const rules = [
-      ...(values.product || []).map((ref) => ({
-        reference: "product" /* PRODUCT */,
-        reference_id: ref.value
-      })),
-      ...(values.product_type || []).map((ref) => ({
-        reference: "product_type" /* PRODUCT_TYPE */,
-        reference_id: ref.value
-      })),
-      ...(values.shipping_option || []).map((ref) => ({
-        reference: "shipping_option" /* SHIPPING_OPTION */,
-        reference_id: ref.value
-      }))
-    ];
-    await createCommissionRate(
-      {
-        name: values.name,
-        code: values.code,
-        type: values.type,
-        target: values.target,
-        value: values.value,
-        currency_code: values.currency_code || null,
-        min_amount: values.min_amount ?? null,
-        include_tax: values.include_tax,
-        is_enabled: values.is_enabled,
-        priority: values.priority,
-        ...rules.length > 0 ? { rules } : {}
-      },
-      {
-        onSuccess: ({ commission_rate }) => {
-          toast.success(t("commissionRates.create.successToast"));
-          handleSuccess(`../${commission_rate.id}`);
-        },
-        onError: (e) => {
-          toast.error(e.message);
-        }
-      }
-    );
-  });
-  const watchType = form.watch("type");
-  const watchCurrency = form.watch("currency_code");
-  const products = useFieldArray({
-    control: form.control,
-    name: "product" /* PRODUCT */
-  });
-  const productTypes = useFieldArray({
-    control: form.control,
-    name: "product_type" /* PRODUCT_TYPE */
-  });
-  const shippingOptions = useFieldArray({
-    control: form.control,
-    name: "shipping_option" /* SHIPPING_OPTION */
-  });
-  const getControls = (type) => {
-    switch (type) {
-      case "product" /* PRODUCT */:
-        return products;
-      case "product_type" /* PRODUCT_TYPE */:
-        return productTypes;
-      case "shipping_option" /* SHIPPING_OPTION */:
-        return shippingOptions;
-    }
-  };
-  const referenceTypeOptions = [
-    {
-      value: "product" /* PRODUCT */,
-      label: t("taxRegions.fields.targets.options.product")
-    },
-    {
-      value: "product_type" /* PRODUCT_TYPE */,
-      label: t("taxRegions.fields.targets.options.productType")
-    },
-    {
-      value: "shipping_option" /* SHIPPING_OPTION */,
-      label: t("taxRegions.fields.targets.options.shippingOption")
-    }
-  ];
-  const searchPlaceholders = {
-    ["product" /* PRODUCT */]: t(
-      "taxRegions.fields.targets.placeholders.product"
-    ),
-    ["product_type" /* PRODUCT_TYPE */]: t(
-      "taxRegions.fields.targets.placeholders.productType"
-    ),
-    ["shipping_option" /* SHIPPING_OPTION */]: t(
-      "taxRegions.fields.targets.placeholders.shippingOption"
-    )
-  };
-  const getFieldHandler = (type) => {
-    const { fields, remove, append } = getControls(type);
-    const modalId = getStackedModalId(type);
-    return (references) => {
-      if (!references.length) {
-        form.setValue(type, [], { shouldDirty: true });
-        setIsOpen(modalId, false);
-        return;
-      }
-      const newIds = references.map((reference) => reference.value);
-      const fieldsToAdd = references.filter(
-        (reference) => !fields.some((field) => field.value === reference.value)
-      );
-      for (const field of fields) {
-        if (!newIds.includes(field.value)) {
-          remove(fields.indexOf(field));
-        }
-      }
-      append(fieldsToAdd);
-      setIsOpen(modalId, false);
-    };
-  };
-  const displayOrder = /* @__PURE__ */ new Set();
-  const disableRule = (type) => {
-    form.setValue(type, [], { shouldDirty: true });
-    form.setValue(`enabled_rules.${type}`, false, { shouldDirty: true });
-    displayOrder.delete(type);
-  };
-  const enableRule = (type) => {
-    form.setValue(`enabled_rules.${type}`, true, { shouldDirty: true });
-    form.setValue(type, [], { shouldDirty: true });
-    displayOrder.add(type);
-  };
-  const watchedEnabledRules = useWatch({
-    control: form.control,
-    name: "enabled_rules"
-  });
-  const addRule = () => {
-    const firstDisabledRule = Object.keys(watchedEnabledRules).find(
-      (key) => !watchedEnabledRules[key]
-    );
-    if (firstDisabledRule) {
-      enableRule(firstDisabledRule);
-    }
-  };
-  const visibleRuleTypes = referenceTypeOptions.filter((option) => watchedEnabledRules[option.value]).sort((a, b) => {
-    const orderArray = Array.from(displayOrder);
-    return orderArray.indexOf(b.value) - orderArray.indexOf(a.value);
-  });
-  const getAvailableRuleTypes = (type) => {
-    return referenceTypeOptions.filter((option) => {
-      return !visibleRuleTypes.some(
-        (visibleOption) => visibleOption.value === option.value
-      ) || option.value === type;
-    });
-  };
-  const showAddButton = Object.values(watchedEnabledRules).some(
-    (value) => !value
-  );
-  return /* @__PURE__ */ jsx(RouteFocusModal.Form, { form, children: /* @__PURE__ */ jsxs(
-    KeyboundForm,
-    {
-      className: "flex h-full flex-col overflow-hidden",
-      onSubmit: handleSubmit,
-      children: [
-        /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
-        /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex overflow-hidden", children: /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: clx(
-              "flex h-full w-full flex-col items-center overflow-y-auto p-16"
-            ),
-            children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8", children: [
-              /* @__PURE__ */ jsxs("div", { children: [
-                /* @__PURE__ */ jsx(Heading, { children: t("commissionRates.create.header") }),
-                /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: t("commissionRates.create.description") })
-              ] }),
-              /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
-                /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [
-                  /* @__PURE__ */ jsx(
-                    Form.Field,
-                    {
-                      control: form.control,
-                      name: "name",
-                      render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                        /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.name") }),
-                        /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
-                        /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                      ] })
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    Form.Field,
-                    {
-                      control: form.control,
-                      name: "code",
-                      render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                        /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.code") }),
-                        /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
-                        /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                      ] })
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [
-                  /* @__PURE__ */ jsx(
-                    Form.Field,
-                    {
-                      control: form.control,
-                      name: "type",
-                      render: ({ field: { onChange, ref, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                        /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.type.label") }),
-                        /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsxs(Select, { ...field, onValueChange: onChange, children: [
-                          /* @__PURE__ */ jsx(Select.Trigger, { ref, children: /* @__PURE__ */ jsx(Select.Value, {}) }),
-                          /* @__PURE__ */ jsxs(Select.Content, { children: [
-                            /* @__PURE__ */ jsx(Select.Item, { value: "percentage", children: t("commissionRates.fields.type.percentage") }),
-                            /* @__PURE__ */ jsx(Select.Item, { value: "fixed", children: t("commissionRates.fields.type.fixed") })
-                          ] })
-                        ] }) }),
-                        /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                      ] })
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    Form.Field,
-                    {
-                      control: form.control,
-                      name: "target",
-                      render: ({ field: { onChange, ref, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                        /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.target.label") }),
-                        /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsxs(Select, { ...field, onValueChange: onChange, children: [
-                          /* @__PURE__ */ jsx(Select.Trigger, { ref, children: /* @__PURE__ */ jsx(Select.Value, {}) }),
-                          /* @__PURE__ */ jsxs(Select.Content, { children: [
-                            /* @__PURE__ */ jsx(Select.Item, { value: "item", children: t("commissionRates.fields.target.item") }),
-                            /* @__PURE__ */ jsx(Select.Item, { value: "shipping", children: t("commissionRates.fields.target.shipping") })
-                          ] })
-                        ] }) }),
-                        /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                      ] })
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [
-                  /* @__PURE__ */ jsx(
-                    Form.Field,
-                    {
-                      control: form.control,
-                      name: "currency_code",
-                      render: ({ field: { onChange, ref, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                        /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.currencyCode") }),
-                        /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsxs(Select, { ...field, onValueChange: onChange, children: [
-                          /* @__PURE__ */ jsx(Select.Trigger, { ref, children: /* @__PURE__ */ jsx(Select.Value, { placeholder: t("commissionRates.fields.currencyPlaceholder") }) }),
-                          /* @__PURE__ */ jsx(Select.Content, { children: storeCurrencies.map((currency) => /* @__PURE__ */ jsx(
-                            Select.Item,
-                            {
-                              value: currency.code.toLowerCase(),
-                              children: currency.name
-                            },
-                            currency.code
-                          )) })
-                        ] }) }),
-                        /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                      ] })
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    Form.Field,
-                    {
-                      control: form.control,
-                      name: "value",
-                      render: ({ field: { value, onChange, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                        /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.rate") }),
-                        /* @__PURE__ */ jsx(Form.Control, { children: watchType === "percentage" ? /* @__PURE__ */ jsx(
-                          PercentageInput,
-                          {
-                            ...field,
-                            value,
-                            decimalsLimit: 4,
-                            onValueChange: (_value, _name, values) => onChange(values?.float ?? 0)
-                          }
-                        ) : /* @__PURE__ */ jsx(
-                          CurrencyInput,
-                          {
-                            min: 0,
-                            onValueChange: (value2) => onChange(value2 ? parseInt(value2) : ""),
-                            code: watchCurrency,
-                            symbol: watchCurrency ? getCurrencySymbol(watchCurrency) : "",
-                            ...field,
-                            value
-                          }
-                        ) }),
-                        /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                      ] })
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-4 md:grid-cols-2", children: [
-                  /* @__PURE__ */ jsx(
-                    Form.Field,
-                    {
-                      control: form.control,
-                      name: "min_amount",
-                      render: ({ field: { value, onChange, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                        /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.minAmount") }),
-                        /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
-                          CurrencyInput,
-                          {
-                            min: 0,
-                            onValueChange: (value2) => onChange(value2 ? parseInt(value2) : ""),
-                            code: watchCurrency,
-                            symbol: watchCurrency ? getCurrencySymbol(watchCurrency) : "",
-                            ...field,
-                            value
-                          }
-                        ) }),
-                        /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                      ] })
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    Form.Field,
-                    {
-                      control: form.control,
-                      name: "priority",
-                      render: ({ field }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                        /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.priority") }),
-                        /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(Input, { type: "number", ...field }) }),
-                        /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                      ] })
-                    }
-                  )
-                ] })
-              ] }),
-              /* @__PURE__ */ jsx(
-                Form.Field,
-                {
-                  control: form.control,
-                  name: "is_enabled",
-                  render: ({ field: { value, onChange, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                    /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between", children: [
-                      /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.enabled") }),
-                      /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
-                        Switch,
-                        {
-                          ...field,
-                          checked: value,
-                          onCheckedChange: onChange
-                        }
-                      ) })
-                    ] }),
-                    /* @__PURE__ */ jsx(Form.Hint, { children: t("commissionRates.fields.enabledHint") }),
-                    /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                  ] })
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Form.Field,
-                {
-                  control: form.control,
-                  name: "include_tax",
-                  render: ({ field: { value, onChange, ...field } }) => /* @__PURE__ */ jsxs(Form.Item, { children: [
-                    /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between", children: [
-                      /* @__PURE__ */ jsx(Form.Label, { children: t("commissionRates.fields.includeTax") }),
-                      /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
-                        Switch,
-                        {
-                          ...field,
-                          checked: value,
-                          onCheckedChange: onChange
-                        }
-                      ) })
-                    ] }),
-                    /* @__PURE__ */ jsx(Form.Hint, { children: t("commissionRates.fields.includeTaxHint") }),
-                    /* @__PURE__ */ jsx(Form.ErrorMessage, {})
-                  ] })
-                }
-              ),
-              /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-3", children: [
-                /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-x-4", children: [
-                  /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
-                    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
-                      /* @__PURE__ */ jsx(
-                        Label,
-                        {
-                          id: "commission_rules_label",
-                          htmlFor: "commission_rules",
-                          children: t("taxRegions.fields.targets.label")
-                        }
-                      ),
-                      /* @__PURE__ */ jsxs(
-                        Text,
-                        {
-                          size: "small",
-                          leading: "compact",
-                          className: "text-ui-fg-muted",
-                          children: [
-                            "(",
-                            t("fields.optional"),
-                            ")"
-                          ]
-                        }
-                      )
-                    ] }),
-                    /* @__PURE__ */ jsx(
-                      Hint,
-                      {
-                        id: "commission_rules_description",
-                        className: "text-pretty",
-                        children: t("taxRegions.fields.targets.hint")
-                      }
-                    )
-                  ] }),
-                  showAddButton && /* @__PURE__ */ jsx(
-                    Button,
-                    {
-                      onClick: addRule,
-                      type: "button",
-                      size: "small",
-                      variant: "transparent",
-                      className: "text-ui-fg-interactive hover:text-ui-fg-interactive-hover flex-shrink-0",
-                      children: t("taxRegions.fields.targets.action")
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    id: "commission_rules",
-                    "aria-labelledby": "commission_rules_label",
-                    "aria-describedby": "commission_rules_description",
-                    role: "application",
-                    className: "flex flex-col gap-y-3",
-                    children: visibleRuleTypes.map((ruleType, index) => {
-                      const type = ruleType.value;
-                      const label = ruleType.label;
-                      const isLast = index === visibleRuleTypes.length - 1;
-                      const searchPlaceholder = searchPlaceholders[type];
-                      const options = getAvailableRuleTypes(type);
-                      const { fields, remove } = getControls(type);
-                      const handler = getFieldHandler(type);
-                      const modalId = getStackedModalId(type);
-                      const handleChangeType = (value) => {
-                        disableRule(type);
-                        enableRule(value);
-                      };
-                      return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
-                        Form.Field,
-                        {
-                          control: form.control,
-                          name: ruleType.value,
-                          render: ({ field }) => {
-                            return /* @__PURE__ */ jsxs(Form.Item, { className: "space-y-0", children: [
-                              /* @__PURE__ */ jsx(Form.Label, { className: "sr-only", children: label }),
-                              /* @__PURE__ */ jsxs(
-                                "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",
-                                  ...field,
-                                  children: [
-                                    /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle grid gap-1.5 px-1.5 md:grid-cols-2", children: [
-                                      isLast ? /* @__PURE__ */ jsxs(
-                                        Select,
-                                        {
-                                          dir: direction,
-                                          value: type,
-                                          onValueChange: handleChangeType,
-                                          children: [
-                                            /* @__PURE__ */ jsx(Select.Trigger, { className: "bg-ui-bg-field-component hover:bg-ui-bg-field-component-hover", children: /* @__PURE__ */ jsx(Select.Value, {}) }),
-                                            /* @__PURE__ */ jsx(Select.Content, { children: options.map((option) => {
-                                              return /* @__PURE__ */ jsx(
-                                                Select.Item,
-                                                {
-                                                  value: option.value,
-                                                  children: option.label
-                                                },
-                                                option.value
-                                              );
-                                            }) })
-                                          ]
-                                        }
-                                      ) : /* @__PURE__ */ jsx("div", { className: "bg-ui-bg-field shadow-borders-base txt-compact-small rounded-md px-2 py-1.5", children: label }),
-                                      /* @__PURE__ */ jsx("div", { className: "bg-ui-bg-field shadow-borders-base txt-compact-small rounded-md px-2 py-1.5", children: t(
-                                        "taxRegions.fields.targets.operators.in"
-                                      ) })
-                                    ] }),
-                                    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 px-1.5", children: [
-                                      /* @__PURE__ */ jsxs(StackedFocusModal, { id: modalId, children: [
-                                        /* @__PURE__ */ jsx(StackedFocusModal.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs(
-                                          "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",
-                                            children: [
-                                              /* @__PURE__ */ jsx(MagnifyingGlass, {}),
-                                              searchPlaceholder
-                                            ]
-                                          }
-                                        ) }),
-                                        /* @__PURE__ */ jsx(StackedFocusModal.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "secondary", children: t("actions.browse") }) }),
-                                        /* @__PURE__ */ jsxs(StackedFocusModal.Content, { children: [
-                                          /* @__PURE__ */ jsxs(StackedFocusModal.Header, { children: [
-                                            /* @__PURE__ */ jsx(StackedFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { className: "sr-only", children: t(
-                                              "taxRegions.fields.targets.modal.header"
-                                            ) }) }),
-                                            /* @__PURE__ */ jsx(StackedFocusModal.Description, { className: "sr-only", children: t(
-                                              "taxRegions.fields.targets.hint"
-                                            ) })
-                                          ] }),
-                                          /* @__PURE__ */ jsx(
-                                            TargetForm,
-                                            {
-                                              type: "focus",
-                                              referenceType: type,
-                                              state: fields,
-                                              setState: handler
-                                            }
-                                          )
-                                        ] })
-                                      ] }),
-                                      /* @__PURE__ */ jsx(
-                                        Button,
-                                        {
-                                          variant: "secondary",
-                                          onClick: () => disableRule(type),
-                                          type: "button",
-                                          children: t("actions.delete")
-                                        }
-                                      )
-                                    ] }),
-                                    fields.length > 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-1.5", children: [
-                                      /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
-                                      /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-y-1.5 px-1.5", children: fields.map((field2, index2) => {
-                                        return /* @__PURE__ */ jsx(
-                                          TargetItem,
-                                          {
-                                            index: index2,
-                                            label: field2.label,
-                                            onRemove: remove,
-                                            value: field2.value
-                                          },
-                                          field2.id
-                                        );
-                                      }) })
-                                    ] }) : null
-                                  ]
-                                }
-                              ),
-                              /* @__PURE__ */ jsx(Form.ErrorMessage, { className: "mt-2" })
-                            ] });
-                          }
-                        }
-                      ) }, type);
-                    })
-                  }
-                )
-              ] })
-            ] })
-          }
-        ) }),
-        /* @__PURE__ */ jsxs(RouteFocusModal.Footer, { children: [
-          /* @__PURE__ */ jsx(RouteFocusModal.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/pages/commission-rates/commission-rate-create/commission-rate-create.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var CommissionRateCreate = () => {
-  const { isLoading, store } = useStore();
-  return /* @__PURE__ */ jsx2(RouteFocusModal, { children: !isLoading && store && /* @__PURE__ */ jsx2(CreateCommissionRateForm, { store }) });
-};
-export {
-  CommissionRateCreate as Component
-};