@mercurjs/admin 2.0.0-canary.100

package/dist/tax-region-tax-override-create-PRZ3DEZE.js

@@ -0,0 +1,688 @@
+import {
+  createTaxRulePayload
+} from "./chunk-SWL7ZCP3.js";
+import {
+  TargetForm,
+  TargetItem,
+  TaxRateRuleReferenceSchema
+} from "./chunk-7NNA33IY.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-4F5GP7J7.js";
+import "./chunk-54EPH67T.js";
+import "./chunk-JQV7CXEC.js";
+import {
+  PercentageInput
+} from "./chunk-MAEP2UCK.js";
+import "./chunk-HINXQTCW.js";
+import "./chunk-NOWUEJ74.js";
+import "./chunk-VW56KWO2.js";
+import "./chunk-TZSOL34K.js";
+import "./chunk-25LYVP3C.js";
+import "./chunk-HC25LNX7.js";
+import "./chunk-2Y3WMGN6.js";
+import "./chunk-JHIMVLB2.js";
+import "./chunk-PXYDR7WQ.js";
+import "./chunk-JRTZWK77.js";
+import "./chunk-3CKTAFTR.js";
+import "./chunk-G5OVX555.js";
+import "./chunk-FWPGOIFA.js";
+import "./chunk-DB6ANJBO.js";
+import "./chunk-PHOCVOZ5.js";
+import "./chunk-WIYFXWRI.js";
+import "./chunk-FQERBIVS.js";
+import "./chunk-ULJ3OMWU.js";
+import "./chunk-YBZWO4ZV.js";
+import "./chunk-KAZ5BYTQ.js";
+import "./chunk-3EF54XFY.js";
+import "./chunk-IQPN4PZJ.js";
+import {
+  SwitchBox
+} from "./chunk-YVCBMOJG.js";
+import "./chunk-TKGWSUEI.js";
+import {
+  KeyboundForm
+} from "./chunk-U2ZFCAPX.js";
+import "./chunk-INNFZYX2.js";
+import "./chunk-LAVHRER2.js";
+import {
+  useDocumentDirection
+} from "./chunk-Y7QKP6QU.js";
+import "./chunk-YMKZS2HK.js";
+import "./chunk-2ZFELO2L.js";
+import "./chunk-26OOAKQ6.js";
+import "./chunk-ZQZHFMD7.js";
+import "./chunk-ZGEMSYN7.js";
+import "./chunk-7OSCNHHQ.js";
+import "./chunk-CMHI2RPL.js";
+import "./chunk-S2WEYEQR.js";
+import "./chunk-TKEAOWBZ.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-6S72GJRI.js";
+import "./chunk-VVWB3GIK.js";
+import "./chunk-KBYZLKI4.js";
+import "./chunk-YWWUOGJA.js";
+import "./chunk-THHRRYRS.js";
+import "./chunk-UZWFZMOX.js";
+import "./chunk-XQNVC4Q7.js";
+import {
+  RouteFocusModal,
+  StackedFocusModal,
+  useRouteModal,
+  useStackedModal
+} from "./chunk-V6LO4BXB.js";
+import {
+  Form
+} from "./chunk-3QSRE5LS.js";
+import "./chunk-YAMNPEPW.js";
+import "./chunk-R325CPYC.js";
+import {
+  useCreateTaxRate
+} from "./chunk-J54BZXZX.js";
+import {
+  useTaxRegion
+} from "./chunk-JI7HMGMO.js";
+import "./chunk-EWFOFSF7.js";
+import "./chunk-YQYGAFCS.js";
+import "./chunk-HLL6GLZO.js";
+import "./chunk-CARSKIPW.js";
+import "./chunk-25DQRKFS.js";
+import "./chunk-R4O667NT.js";
+import "./chunk-MO7TNIVQ.js";
+import "./chunk-A2F5MDPU.js";
+import "./chunk-L7DIEO5B.js";
+import "./chunk-EEOEIXDA.js";
+import "./chunk-OEDISQ2O.js";
+import "./chunk-GCEOEV6P.js";
+import "./chunk-PYF5EER5.js";
+import "./chunk-HPQG3PEA.js";
+import "./chunk-FIVW6L2I.js";
+import "./chunk-Q6GUA5VE.js";
+import "./chunk-QVLL4MKH.js";
+import "./chunk-I5LLMPI2.js";
+import "./chunk-VXW3BCN2.js";
+import "./chunk-VHCDSNXF.js";
+import "./chunk-EJY35WBK.js";
+import "./chunk-GYRTURN7.js";
+import "./chunk-QUTZUW55.js";
+import "./chunk-XFKRBJLK.js";
+import "./chunk-WBNGBRBK.js";
+import "./chunk-RHKRREUU.js";
+import "./chunk-ZA2KFUFR.js";
+import "./chunk-LXZXXOJ3.js";
+import "./chunk-NBMM2TZK.js";
+
+// src/pages/tax-regions/tax-region-tax-override-create/tax-region-tax-override-create.tsx
+import { useParams } from "react-router-dom";
+
+// src/pages/tax-regions/tax-region-tax-override-create/components/tax-region-override-create-form/tax-region-tax-override-create.tsx
+import { zodResolver } from "@hookform/resolvers/zod";
+import {
+  Button,
+  clx,
+  Divider,
+  Heading,
+  Hint,
+  Input,
+  Label,
+  Select,
+  Text,
+  toast
+} from "@medusajs/ui";
+import { useFieldArray, useForm, useWatch } from "react-hook-form";
+import { z } from "zod";
+import { MagnifyingGlass } from "@medusajs/icons";
+import { useTranslation } from "react-i18next";
+import { jsx, jsxs } from "react/jsx-runtime";
+var TaxRegionCreateTaxOverrideSchema = z.object({
+  name: z.string().min(1),
+  code: z.string().min(1),
+  rate: z.object({
+    float: z.number().optional(),
+    value: z.string().optional()
+  }).optional(),
+  is_combinable: z.boolean().optional(),
+  enabled_rules: z.object({
+    product: z.boolean(),
+    product_type: z.boolean(),
+    shipping_option: z.boolean()
+    // product_collection: z.boolean(),
+    // product_tag: z.boolean(),
+    // customer_group: z.boolean(),
+  }),
+  product: z.array(TaxRateRuleReferenceSchema).optional(),
+  product_type: z.array(TaxRateRuleReferenceSchema).optional(),
+  shipping_option: z.array(TaxRateRuleReferenceSchema).optional()
+  // product_collection: z.array(TaxRateRuleReferenceSchema).optional(),
+  // product_tag: z.array(TaxRateRuleReferenceSchema).optional(),
+  // customer_group: z.array(TaxRateRuleReferenceSchema).optional(),
+});
+var STACKED_MODAL_ID = "tr";
+var getStackedModalId = (type) => `${STACKED_MODAL_ID}-${type}`;
+var TaxRegionCreateTaxOverrideForm = ({
+  taxRegion
+}) => {
+  const { t } = useTranslation();
+  const { handleSuccess } = useRouteModal();
+  const { setIsOpen } = useStackedModal();
+  const direction = useDocumentDirection();
+  const form = useForm({
+    defaultValues: {
+      name: "",
+      code: "",
+      is_combinable: false,
+      rate: {
+        value: ""
+      },
+      enabled_rules: {
+        product: true,
+        product_type: false,
+        shipping_option: false
+        // product_collection: false,
+        // product_tag: false,
+        // customer_group: false,
+      },
+      product: [],
+      product_type: [],
+      shipping_option: []
+      // product_collection: [],
+      // product_tag: [],
+      // customer_group: [],
+    },
+    resolver: zodResolver(TaxRegionCreateTaxOverrideSchema)
+  });
+  const { mutateAsync, isPending } = useCreateTaxRate();
+  const handleSubmit = form.handleSubmit(async (values) => {
+    const {
+      product,
+      product_type,
+      // customer_group,
+      // product_collection,
+      // product_tag,
+      shipping_option
+    } = values;
+    const productRules = createTaxRulePayload({
+      reference_type: "product" /* PRODUCT */,
+      references: product || []
+    });
+    const productTypeRules = createTaxRulePayload({
+      reference_type: "product_type" /* PRODUCT_TYPE */,
+      references: product_type || []
+    });
+    const shippingOptionRules = createTaxRulePayload({
+      reference_type: "shipping_option" /* SHIPPING_OPTION */,
+      references: shipping_option || []
+    });
+    const rules = [
+      productRules,
+      productTypeRules,
+      shippingOptionRules
+      // customerGroupRules,
+      // productCollectionRules,
+      // productTagRules,
+    ].filter((rule) => Boolean(rule)).flatMap((r) => r);
+    mutateAsync(
+      {
+        name: values.name,
+        tax_region_id: taxRegion.id,
+        rate: values.rate?.float,
+        code: values.code,
+        is_combinable: values.is_combinable,
+        rules,
+        is_default: false
+      },
+      {
+        onSuccess: () => {
+          handleSuccess();
+        },
+        onError: (error) => {
+          toast.error(error.message);
+        }
+      }
+    );
+  });
+  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")
+    }
+    // {
+    //   value: TaxRateRuleReferenceType.PRODUCT_COLLECTION,
+    //   label: t("taxRegions.fields.targets.options.productCollection"),
+    // },
+    // {
+    //   value: TaxRateRuleReferenceType.PRODUCT_TAG,
+    //   label: t("taxRegions.fields.targets.options.productTag"),
+    // },
+    // {
+    //   value: TaxRateRuleReferenceType.CUSTOMER_GROUP,
+    //   label: t("taxRegions.fields.targets.options.customerGroup"),
+    // },
+  ];
+  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"
+    )
+    // [TaxRateRuleReferenceType.PRODUCT_COLLECTION]: t(
+    //   "taxRegions.fields.targets.placeholders.productCollection"
+    // ),
+    // [TaxRateRuleReferenceType.PRODUCT_TAG]: t(
+    //   "taxRegions.fields.targets.placeholders.productTag"
+    // ),
+    // [TaxRateRuleReferenceType.CUSTOMER_GROUP]: t(
+    //   "taxRegions.fields.targets.placeholders.customerGroup"
+    // ),
+  };
+  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([
+    "product" /* PRODUCT */
+  ]);
+  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, "data-testid": "tax-region-override-create-form", children: /* @__PURE__ */ jsxs(
+    KeyboundForm,
+    {
+      onSubmit: handleSubmit,
+      className: "flex h-full flex-col overflow-hidden",
+      children: [
+        /* @__PURE__ */ jsx(RouteFocusModal.Header, { "data-testid": "tax-region-override-create-form-header" }),
+        /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", "data-testid": "tax-region-override-create-form-body", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8 px-2 py-16", children: [
+          /* @__PURE__ */ jsxs("div", { "data-testid": "tax-region-override-create-form-header-section", children: [
+            /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { "data-testid": "tax-region-override-create-form-heading", children: t("taxRegions.taxOverrides.create.header") }) }),
+            /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", "data-testid": "tax-region-override-create-form-hint", children: t("taxRegions.taxOverrides.create.hint") }) })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4", children: /* @__PURE__ */ jsx("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 }) => {
+                  return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "tax-region-override-create-form-name-item", children: [
+                    /* @__PURE__ */ jsx(Form.Label, { "data-testid": "tax-region-override-create-form-name-label", children: t("fields.name") }),
+                    /* @__PURE__ */ jsx(Form.Control, { "data-testid": "tax-region-override-create-form-name-control", children: /* @__PURE__ */ jsx(Input, { ...field, "data-testid": "tax-region-override-create-form-name-input" }) }),
+                    /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "tax-region-override-create-form-name-error" })
+                  ] });
+                }
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Form.Field,
+              {
+                control: form.control,
+                name: "rate",
+                render: ({ field: { value, onChange, ...field } }) => {
+                  return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "tax-region-override-create-form-rate-item", children: [
+                    /* @__PURE__ */ jsx(Form.Label, { "data-testid": "tax-region-override-create-form-rate-label", children: t("taxRegions.fields.taxRate") }),
+                    /* @__PURE__ */ jsx(Form.Control, { "data-testid": "tax-region-override-create-form-rate-control", children: /* @__PURE__ */ jsx(
+                      PercentageInput,
+                      {
+                        ...field,
+                        placeholder: "0.00",
+                        decimalsLimit: 4,
+                        value: value?.value,
+                        onValueChange: (value2, _name, values) => onChange({
+                          value: value2,
+                          float: values?.float
+                        }),
+                        "data-testid": "tax-region-override-create-form-rate-input"
+                      }
+                    ) }),
+                    /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "tax-region-override-create-form-rate-error" })
+                  ] });
+                }
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              Form.Field,
+              {
+                control: form.control,
+                name: "code",
+                render: ({ field }) => {
+                  return /* @__PURE__ */ jsxs(Form.Item, { "data-testid": "tax-region-override-create-form-code-item", children: [
+                    /* @__PURE__ */ jsx(Form.Label, { "data-testid": "tax-region-override-create-form-code-label", children: t("taxRegions.fields.taxCode") }),
+                    /* @__PURE__ */ jsx(Form.Control, { "data-testid": "tax-region-override-create-form-code-control", children: /* @__PURE__ */ jsx(Input, { ...field, "data-testid": "tax-region-override-create-form-code-input" }) }),
+                    /* @__PURE__ */ jsx(Form.ErrorMessage, { "data-testid": "tax-region-override-create-form-code-error" })
+                  ] });
+                }
+              }
+            )
+          ] }) }) }),
+          /* @__PURE__ */ jsx(
+            SwitchBox,
+            {
+              control: form.control,
+              name: "is_combinable",
+              label: t("taxRegions.fields.isCombinable.label"),
+              description: t("taxRegions.fields.isCombinable.hint"),
+              "data-testid": "tax-region-override-create-form-is-combinable"
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-3", "data-testid": "tax-region-override-create-form-targets-section", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-x-4", "data-testid": "tax-region-override-create-form-targets-header", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-1", children: [
+                  /* @__PURE__ */ jsx(
+                    Label,
+                    {
+                      id: "tax_region_rules_label",
+                      htmlFor: "tax_region_rules",
+                      "data-testid": "tax-region-override-create-form-targets-label",
+                      children: t("taxRegions.fields.targets.label")
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs(
+                    Text,
+                    {
+                      size: "small",
+                      leading: "compact",
+                      className: "text-ui-fg-muted",
+                      "data-testid": "tax-region-override-create-form-targets-optional",
+                      children: [
+                        "(",
+                        t("fields.optional"),
+                        ")"
+                      ]
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Hint,
+                  {
+                    id: "tax_region_rules_description",
+                    className: "text-pretty",
+                    "data-testid": "tax-region-override-create-form-targets-hint",
+                    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",
+                  "data-testid": "tax-region-override-create-form-targets-add-button",
+                  children: t("taxRegions.fields.targets.action")
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                id: "tax_region_rules",
+                "aria-labelledby": "tax_region_rules_label",
+                "aria-describedby": "tax_region_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__ */ jsx(RouteFocusModal.Footer, { "data-testid": "tax-region-override-create-form-footer", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
+          /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", "data-testid": "tax-region-override-create-form-cancel-button", children: t("actions.cancel") }) }),
+          /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, "data-testid": "tax-region-override-create-form-save-button", children: t("actions.save") })
+        ] }) })
+      ]
+    }
+  ) });
+};
+
+// src/pages/tax-regions/tax-region-tax-override-create/tax-region-tax-override-create.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var TaxRegionCreateTaxOverride = () => {
+  const { id, province_id } = useParams();
+  const { tax_region, isPending, isError, error } = useTaxRegion(
+    province_id || id
+  );
+  const ready = !isPending && !!tax_region;
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx2(RouteFocusModal, { "data-testid": "tax-region-override-create-modal", children: ready && /* @__PURE__ */ jsx2(TaxRegionCreateTaxOverrideForm, { taxRegion: tax_region }) });
+};
+export {
+  TaxRegionCreateTaxOverride as Component
+};