@mercurjs/vendor 2.0.0-canary.0

package/dist/allocate-items-QAS5PZLR.js

@@ -0,0 +1,529 @@
+import {
+  getFulfillableQuantity
+} from "./chunk-RXM4B6HR.js";
+import "./chunk-TKGWSUEI.js";
+import {
+  KeyboundForm
+} from "./chunk-U2ZFCAPX.js";
+import {
+  RouteFocusModal,
+  useRouteModal
+} from "./chunk-3CK6OINO.js";
+import {
+  Form
+} from "./chunk-3QSRE5LS.js";
+import {
+  Thumbnail
+} from "./chunk-WIYFXWRI.js";
+import {
+  useStockLocations
+} from "./chunk-SI4ALL7W.js";
+import {
+  ordersQueryKeys,
+  useCreateReservationItem,
+  useOrder
+} from "./chunk-ZFFA36DB.js";
+import "./chunk-WPFTRRWV.js";
+import "./chunk-A5DJIOHN.js";
+import {
+  queryClient
+} from "./chunk-RHKRREUU.js";
+import "./chunk-ZA2KFUFR.js";
+import "./chunk-Y224F4UU.js";
+import "./chunk-PKBMQBKP.js";
+
+// src/pages/orders/[id]/allocate-items/index.tsx
+import { useParams } from "react-router-dom";
+
+// src/pages/orders/[id]/allocate-items/order-create-fulfillment-form/order-allocate-items-form.tsx
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useEffect, useMemo as useMemo2, useState as useState2 } from "react";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { Alert, Button, Heading, Input as Input2, Select, toast } from "@medusajs/ui";
+import { useForm, useWatch as useWatch2 } from "react-hook-form";
+
+// src/pages/orders/[id]/allocate-items/order-create-fulfillment-form/constants.ts
+import { z } from "zod";
+var AllocateItemsSchema = z.object({
+  location_id: z.string(),
+  quantity: z.record(z.string(), z.number().or(z.string()))
+});
+
+// src/pages/orders/[id]/allocate-items/order-create-fulfillment-form/order-allocate-items-item.tsx
+import { useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  Component,
+  ExclamationCircleSolid,
+  TriangleDownMini
+} from "@medusajs/icons";
+import { useWatch } from "react-hook-form";
+import { Input, Text, clx } from "@medusajs/ui";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function OrderAllocateItemsItem({
+  item,
+  form,
+  locationId,
+  onQuantityChange
+}) {
+  const { t } = useTranslation();
+  const variant = item.variant;
+  const inventory = item.variant?.inventory || [];
+  const [isOpen, setIsOpen] = useState(false);
+  const quantityField = useWatch({
+    control: form.control,
+    name: "quantity"
+  });
+  const hasInventoryKit = !!variant?.inventory_items && variant.inventory_items.length > 1;
+  const { availableQuantity, inStockQuantity } = useMemo(() => {
+    if (!variant || !locationId) {
+      return {};
+    }
+    const locationInventory = inventory[0]?.location_levels?.find(
+      (inv) => inv.location_id === locationId
+    );
+    if (!locationInventory) {
+      return {};
+    }
+    return {
+      availableQuantity: locationInventory.available_quantity,
+      inStockQuantity: locationInventory.stocked_quantity
+    };
+  }, [variant, locationId]);
+  const hasQuantityError = !hasInventoryKit && availableQuantity && item.variant?.inventory?.[0]?.id && quantityField[`${item.id}-${item.variant.inventory[0].id}`] && Number(quantityField[`${item.id}-${item.variant.inventory[0].id}`]) > availableQuantity;
+  const minValue = 0;
+  const maxValue = Math.min(
+    getFulfillableQuantity(item) ?? 0,
+    availableQuantity || Number.MAX_SAFE_INTEGER
+  );
+  return /* @__PURE__ */ jsxs("div", { className: "bg-ui-bg-subtle shadow-elevation-card-rest my-2 min-w-[720px] divide-y divide-dashed rounded-xl", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3 p-3 text-sm", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-3", children: [
+        hasQuantityError && /* @__PURE__ */ jsx(ExclamationCircleSolid, { className: "text-ui-fg-error" }),
+        /* @__PURE__ */ jsx(Thumbnail, { src: item.thumbnail }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-row", children: [
+            /* @__PURE__ */ jsx(Text, { className: "txt-small flex", as: "span", weight: "plus", children: item.product_title }),
+            item.variant_sku && /* @__PURE__ */ jsxs("span", { className: "text-ui-fg-subtle", children: [
+              " ",
+              "(",
+              item.variant_sku,
+              ")"
+            ] }),
+            hasInventoryKit && /* @__PURE__ */ jsx(Component, { className: "text-ui-fg-muted ml-2 overflow-visible pt-[2px]" })
+          ] }),
+          /* @__PURE__ */ jsx(Text, { as: "div", className: "text-ui-fg-subtle txt-small", children: item.title })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: clx(
+            "flex flex-1 items-center gap-x-3",
+            hasInventoryKit ? "justify-end" : "justify-between"
+          ),
+          children: [
+            !hasInventoryKit && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ jsx("div", { className: "bg-ui-border-strong block h-[12px] w-[1px]" }),
+                /* @__PURE__ */ jsxs("div", { className: "txt-small flex flex-col", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-ui-fg-subtle font-medium", children: t("labels.available") }),
+                  /* @__PURE__ */ jsxs("span", { className: "text-ui-fg-muted", children: [
+                    availableQuantity || "-",
+                    availableQuantity && !hasInventoryKit && item.variant?.inventory?.[0]?.id && quantityField[`${item.id}-${item.variant.inventory[0].id}`] && /* @__PURE__ */ jsxs("span", { className: "text-ui-fg-error txt-small ml-1", children: [
+                      "-",
+                      quantityField[`${item.id}-${item.variant.inventory[0].id}`]
+                    ] })
+                  ] })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ jsx("div", { className: "bg-ui-border-strong block h-[12px] w-[1px]" }),
+                /* @__PURE__ */ jsxs("div", { className: "txt-small flex flex-col", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-ui-fg-subtle font-medium", children: t("labels.inStock") }),
+                  /* @__PURE__ */ jsx("span", { className: "text-ui-fg-muted", children: inStockQuantity || "-" })
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+              /* @__PURE__ */ jsx("div", { className: "bg-ui-border-strong block h-[12px] w-[1px]" }),
+              /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle txt-small mr-2 flex flex-row items-center gap-2", children: [
+                /* @__PURE__ */ jsx(
+                  Form.Field,
+                  {
+                    control: form.control,
+                    name: hasInventoryKit && item.variant?.inventory?.[0]?.id ? `quantity.${item.id}-` : `quantity.${item.id}-${item.variant?.inventory?.[0].id}`,
+                    rules: {
+                      required: !hasInventoryKit,
+                      min: !hasInventoryKit ? minValue : void 0,
+                      max: maxValue > 0 ? maxValue : void 0
+                    },
+                    render: ({ field }) => {
+                      return /* @__PURE__ */ jsx(Form.Item, { children: /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
+                        Input,
+                        {
+                          className: "bg-ui-bg-base txt-small w-[46px] rounded-lg text-right [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
+                          type: "number",
+                          ...field,
+                          disabled: !locationId,
+                          onChange: (e) => {
+                            const val = e.target.value === "" ? null : Number(e.target.value);
+                            const firstInventory = item.variant?.inventory?.[0];
+                            if (firstInventory) {
+                              onQuantityChange(
+                                firstInventory,
+                                item,
+                                hasInventoryKit,
+                                val,
+                                true
+                              );
+                            }
+                          }
+                        }
+                      ) }) });
+                    }
+                  }
+                ),
+                " ",
+                "/ ",
+                item.quantity,
+                " ",
+                t("fields.qty")
+              ] })
+            ] })
+          ]
+        }
+      )
+    ] }),
+    hasInventoryKit && /* @__PURE__ */ jsx("div", { className: "px-4 py-2", children: /* @__PURE__ */ jsxs(
+      "div",
+      {
+        onClick: () => setIsOpen((o) => !o),
+        className: "flex items-center gap-x-2",
+        children: [
+          /* @__PURE__ */ jsx(
+            TriangleDownMini,
+            {
+              style: { transform: `rotate(${isOpen ? -90 : 0}deg)` },
+              className: "text-ui-fg-muted -mt-[1px]"
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "txt-small text-ui-fg-muted cursor-pointer", children: t("orders.allocateItems.consistsOf", {
+            num: inventory.length
+          }) })
+        ]
+      }
+    ) }),
+    isOpen && variant?.inventory?.map((i, ind) => {
+      const location = i.location_levels?.find(
+        (l) => l.location_id === locationId
+      );
+      const hasQuantityError2 = !!quantityField[`${item.id}-${i.id}`] && location && Number(quantityField[`${item.id}-${i.id}`]) > location.available_quantity;
+      return /* @__PURE__ */ jsxs("div", { className: "txt-small flex items-center gap-x-3 p-4", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-row items-center gap-3", children: [
+          hasQuantityError2 && /* @__PURE__ */ jsx(ExclamationCircleSolid, { className: "text-ui-fg-error" }),
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-ui-fg-subtle", children: i?.title ?? i.sku ?? `Inventory Item ${ind + 1}` }),
+            /* @__PURE__ */ jsx("span", { className: "text-ui-fg-muted", children: t("orders.allocateItems.requires", {
+              num: variant?.inventory_items?.[ind]?.required_quantity || 0
+            }) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-row justify-between", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsx("div", { className: "bg-ui-border-strong block h-[12px] w-[1px]" }),
+            /* @__PURE__ */ jsxs("div", { className: "txt-small flex flex-col", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-ui-fg-subtle font-medium", children: t("labels.available") }),
+              /* @__PURE__ */ jsxs("span", { className: "text-ui-fg-muted", children: [
+                location?.available_quantity || "-",
+                location?.available_quantity && quantityField[`${item.id}-${i.id}`] && /* @__PURE__ */ jsxs("span", { className: "text-ui-fg-error txt-small ml-1", children: [
+                  "-",
+                  quantityField[`${item.id}-${i.id}`]
+                ] })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsx("div", { className: "bg-ui-border-strong block h-[12px] w-[1px]" }),
+            /* @__PURE__ */ jsxs("div", { className: "txt-small flex flex-col", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-ui-fg-subtle font-medium", children: t("labels.inStock") }),
+              /* @__PURE__ */ jsx("span", { className: "text-ui-fg-muted", children: location?.stocked_quantity || "-" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ jsx("div", { className: "bg-ui-border-strong block h-[12px] w-[1px]" }),
+            /* @__PURE__ */ jsxs("div", { className: "text-ui-fg-subtle txt-small mr-1 flex flex-row items-center gap-2", children: [
+              /* @__PURE__ */ jsx(
+                Form.Field,
+                {
+                  control: form.control,
+                  name: `quantity.${item.id}-${i.id}`,
+                  rules: {
+                    required: true,
+                    min: 0,
+                    max: location?.available_quantity
+                  },
+                  render: ({ field }) => {
+                    return /* @__PURE__ */ jsx(Form.Item, { children: /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
+                      Input,
+                      {
+                        className: "bg-ui-bg-base txt-small w-[46px] rounded-lg text-right [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
+                        type: "number",
+                        ...field,
+                        disabled: !locationId,
+                        onChange: (e) => {
+                          const val = e.target.value === "" ? null : Number(e.target.value);
+                          onQuantityChange(
+                            i,
+                            item,
+                            hasInventoryKit,
+                            val
+                          );
+                        }
+                      }
+                    ) }) });
+                  }
+                }
+              ),
+              "/",
+              " ",
+              item.quantity * (variant.inventory_items?.[ind]?.required_quantity ?? 0),
+              " ",
+              t("fields.qty")
+            ] })
+          ] })
+        ] })
+      ] }, i.id);
+    })
+  ] });
+}
+
+// src/pages/orders/[id]/allocate-items/order-create-fulfillment-form/order-allocate-items-form.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function OrderAllocateItemsForm({ order }) {
+  const { t } = useTranslation2();
+  const { handleSuccess } = useRouteModal();
+  const [disableSubmit, setDisableSubmit] = useState2(false);
+  const [filterTerm, setFilterTerm] = useState2("");
+  const { mutateAsync: allocateItems, isPending: isMutating } = useCreateReservationItem();
+  const itemsToAllocate = useMemo2(
+    () => order.items.filter(
+      (item) => item.variant?.manage_inventory && !!item.variant.inventory?.length && item?.quantity - item.detail?.fulfilled_quantity > 0
+    ),
+    [order.items]
+  );
+  const filteredItems = useMemo2(() => {
+    return itemsToAllocate.filter(
+      (i) => i.variant_title?.toLowerCase().includes(filterTerm) || i.product_title?.toLowerCase().includes(filterTerm)
+    );
+  }, [itemsToAllocate, filterTerm]);
+  const form = useForm({
+    defaultValues: {
+      location_id: "",
+      quantity: defaultAllocations(itemsToAllocate)
+    },
+    resolver: zodResolver(AllocateItemsSchema)
+  });
+  const { stock_locations = [] } = useStockLocations();
+  const handleSubmit = form.handleSubmit(async (data) => {
+    try {
+      const payload = Object.entries(data.quantity).filter(([key]) => !key.endsWith("-")).map(([key, quantity]) => [...key.split("-"), quantity]);
+      if (payload.some((d) => d[2] === "")) {
+        form.setError("root.quantityNotAllocated", {
+          type: "manual",
+          message: t("orders.allocateItems.error.quantityNotAllocated")
+        });
+        return;
+      }
+      const promises = payload.map(
+        ([itemId, inventoryId, quantity]) => allocateItems({
+          location_id: data.location_id,
+          inventory_item_id: String(inventoryId),
+          line_item_id: String(itemId),
+          quantity: typeof quantity === "string" ? Number(quantity) : quantity
+        })
+      );
+      await Promise.all(promises);
+      await queryClient.invalidateQueries({
+        queryKey: ordersQueryKeys.details()
+      });
+      handleSuccess(`/orders/${order.id}`);
+      toast.success(t("general.success"), {
+        description: t("orders.allocateItems.toast.created")
+      });
+    } catch (e) {
+      toast.error(t("general.error"), {
+        description: e instanceof FetchError ? e.message : "An unknown error occurred"
+      });
+    }
+  });
+  const onQuantityChange = (inventoryItem, lineItem, hasInventoryKit, value, isRoot) => {
+    let shouldDisableSubmit = false;
+    const key = isRoot && hasInventoryKit ? `quantity.${lineItem.id}-` : `quantity.${lineItem.id}-${inventoryItem.id}`;
+    form.setValue(key, value ?? "");
+    if (value && inventoryItem.location_levels) {
+      const location = inventoryItem.location_levels.find(
+        (l) => l.location_id === selectedLocationId
+      );
+      if (location) {
+        if (location.available_quantity < value) {
+          shouldDisableSubmit = true;
+        }
+      }
+    }
+    if (hasInventoryKit && !isRoot) {
+      form.resetField(`quantity.${lineItem.id}-`, { defaultValue: "" });
+    }
+    if (hasInventoryKit && isRoot) {
+      const item = itemsToAllocate.find((i) => i.id === lineItem.id);
+      if (!item || !item.variant) return;
+      item.variant.inventory_items?.forEach((ii, ind) => {
+        const num = value || 0;
+        const inventory = item.variant?.inventory?.[ind];
+        if (!inventory) return;
+        form.setValue(
+          `quantity.${lineItem.id}-${inventory.id}`,
+          num * ii.required_quantity
+        );
+        if (value && inventory.location_levels) {
+          const location = inventory.location_levels.find(
+            (l) => l.location_id === selectedLocationId
+          );
+          if (location) {
+            if (location.available_quantity < value) {
+              shouldDisableSubmit = true;
+            }
+          }
+        }
+      });
+    }
+    form.clearErrors("root.quantityNotAllocated");
+    setDisableSubmit(shouldDisableSubmit);
+  };
+  const selectedLocationId = useWatch2({
+    name: "location_id",
+    control: form.control
+  });
+  useEffect(() => {
+    if (selectedLocationId) {
+      form.setValue("quantity", defaultAllocations(itemsToAllocate));
+    }
+  }, [selectedLocationId]);
+  const allocationError = form.formState.errors?.root?.quantityNotAllocated?.message;
+  return /* @__PURE__ */ jsx2(RouteFocusModal.Form, { form, children: /* @__PURE__ */ jsxs2(
+    KeyboundForm,
+    {
+      onSubmit: handleSubmit,
+      className: "flex h-full flex-col overflow-hidden",
+      children: [
+        /* @__PURE__ */ jsx2(RouteFocusModal.Header, {}),
+        /* @__PURE__ */ jsx2(RouteFocusModal.Body, { className: "flex h-full w-full flex-col items-center divide-y overflow-y-auto", children: /* @__PURE__ */ jsx2("div", { className: "flex size-full flex-col items-center overflow-auto p-16", children: /* @__PURE__ */ jsx2("div", { className: "flex w-full max-w-[736px] flex-col justify-center px-2 pb-2", children: /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-8 divide-y divide-dashed", children: [
+          /* @__PURE__ */ jsx2(Heading, { children: t("orders.allocateItems.title") }),
+          /* @__PURE__ */ jsxs2("div", { className: "flex-1 divide-y divide-dashed pt-8", children: [
+            /* @__PURE__ */ jsx2(
+              Form.Field,
+              {
+                control: form.control,
+                name: "location_id",
+                render: ({ field: { onChange, ref, ...field } }) => {
+                  return /* @__PURE__ */ jsxs2(Form.Item, { children: [
+                    /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-3", children: [
+                      /* @__PURE__ */ jsxs2("div", { className: "flex-1", children: [
+                        /* @__PURE__ */ jsx2(Form.Label, { children: t("fields.location") }),
+                        /* @__PURE__ */ jsx2(Form.Hint, { children: t("orders.allocateItems.locationDescription") })
+                      ] }),
+                      /* @__PURE__ */ jsx2("div", { className: "flex-1", children: /* @__PURE__ */ jsx2(Form.Control, { children: /* @__PURE__ */ jsxs2(Select, { onValueChange: onChange, ...field, children: [
+                        /* @__PURE__ */ jsx2(
+                          Select.Trigger,
+                          {
+                            className: "bg-ui-bg-base",
+                            ref,
+                            children: /* @__PURE__ */ jsx2(Select.Value, {})
+                          }
+                        ),
+                        /* @__PURE__ */ jsx2(Select.Content, { children: stock_locations.map((l) => /* @__PURE__ */ jsx2(Select.Item, { value: l.id, children: l.name }, l.id)) })
+                      ] }) }) })
+                    ] }),
+                    /* @__PURE__ */ jsx2(Form.ErrorMessage, {})
+                  ] });
+                }
+              }
+            ),
+            /* @__PURE__ */ jsxs2(Form.Item, { className: "mt-8 pt-8", children: [
+              /* @__PURE__ */ jsxs2("div", { className: "flex flex-row items-center", children: [
+                /* @__PURE__ */ jsxs2("div", { className: "flex-1", children: [
+                  /* @__PURE__ */ jsx2(Form.Label, { children: t("orders.allocateItems.itemsToAllocate") }),
+                  /* @__PURE__ */ jsx2(Form.Hint, { children: t("orders.allocateItems.itemsToAllocateDesc") })
+                ] }),
+                /* @__PURE__ */ jsx2("div", { className: "flex-1", children: /* @__PURE__ */ jsx2(
+                  Input2,
+                  {
+                    value: filterTerm,
+                    onChange: (e) => setFilterTerm(e.target.value),
+                    placeholder: t("orders.allocateItems.search"),
+                    autoComplete: "off",
+                    type: "search"
+                  }
+                ) })
+              ] }),
+              allocationError && /* @__PURE__ */ jsx2(Alert, { className: "mb-4", dismissible: true, variant: "error", children: allocationError }),
+              /* @__PURE__ */ jsx2("div", { className: "flex flex-col gap-y-1", children: filteredItems.map((item) => /* @__PURE__ */ jsx2(
+                OrderAllocateItemsItem,
+                {
+                  form,
+                  item,
+                  locationId: selectedLocationId,
+                  onQuantityChange
+                },
+                item.id
+              )) })
+            ] })
+          ] })
+        ] }) }) }) }),
+        /* @__PURE__ */ jsx2(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-end gap-x-2", children: [
+          /* @__PURE__ */ jsx2(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx2(Button, { size: "small", variant: "secondary", children: t("actions.cancel") }) }),
+          /* @__PURE__ */ jsx2(
+            Button,
+            {
+              size: "small",
+              type: "submit",
+              isLoading: isMutating,
+              disabled: !selectedLocationId || disableSubmit,
+              children: t("orders.allocateItems.action")
+            }
+          )
+        ] }) })
+      ]
+    }
+  ) });
+}
+function defaultAllocations(items) {
+  const ret = {};
+  items.forEach((item) => {
+    const hasInventoryKit = (item.variant?.inventory_items?.length || 0) > 1;
+    ret[hasInventoryKit ? `${item.id}-` : `${item.id}-${item.variant?.inventory?.[0]?.id || ""}`] = "";
+    if (hasInventoryKit && item.variant?.inventory) {
+      item.variant.inventory.forEach((i) => {
+        ret[`${item.id}-${i.id}`] = "";
+      });
+    }
+  });
+  return ret;
+}
+
+// src/pages/orders/[id]/allocate-items/index.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Component2 = () => {
+  const { id } = useParams();
+  const { order, isLoading, isError, error } = useOrder(id, {
+    fields: "currency_code,*items,*items.variant,+items.variant.product.title,*items.variant.inventory,*items.variant.inventory.location_levels,*items.variant.inventory_items,*shipping_address"
+  });
+  if (isError) {
+    throw error;
+  }
+  const ready = !isLoading && order;
+  return /* @__PURE__ */ jsx3(RouteFocusModal, { children: ready && /* @__PURE__ */ jsx3(OrderAllocateItemsForm, { order }) });
+};
+export {
+  Component2 as Component
+};

package/dist/areas-Y7VDWH7G.js

@@ -0,0 +1,151 @@
+import {
+  GeoZoneForm
+} from "./chunk-4TBDDMFP.js";
+import {
+  GEO_ZONE_STACKED_MODAL_ID
+} from "./chunk-BCU3FKP2.js";
+import "./chunk-FQERBIVS.js";
+import "./chunk-WHTS4G5K.js";
+import "./chunk-LYUCDASZ.js";
+import "./chunk-KAZ5BYTQ.js";
+import "./chunk-3EF54XFY.js";
+import "./chunk-TKGWSUEI.js";
+import {
+  KeyboundForm
+} from "./chunk-U2ZFCAPX.js";
+import {
+  RouteFocusModal,
+  StackedFocusModal,
+  useRouteModal
+} from "./chunk-3CK6OINO.js";
+import "./chunk-3QSRE5LS.js";
+import "./chunk-THHRRYRS.js";
+import "./chunk-CFETU5BI.js";
+import {
+  countries
+} from "./chunk-JRTZWK77.js";
+import "./chunk-Y7QKP6QU.js";
+import "./chunk-INNFZYX2.js";
+import {
+  useUpdateFulfillmentSetServiceZone
+} from "./chunk-Y4VBOHAP.js";
+import "./chunk-JKXAL7WR.js";
+import {
+  useStockLocation
+} from "./chunk-SI4ALL7W.js";
+import "./chunk-RHKRREUU.js";
+import "./chunk-ZA2KFUFR.js";
+import "./chunk-Y224F4UU.js";
+import "./chunk-PKBMQBKP.js";
+
+// src/pages/settings/locations/[location_id]/fulfillment-set/[fset_id]/service-zone/[zone_id]/areas/index.tsx
+import { json, useParams } from "react-router-dom";
+
+// src/pages/settings/locations/[location_id]/fulfillment-set/[fset_id]/service-zone/[zone_id]/areas/_components/edit-service-zone-areas-form.tsx
+import { zodResolver } from "@hookform/resolvers/zod";
+import { Button, Heading, toast } from "@medusajs/ui";
+import { useForm } from "react-hook-form";
+import { useTranslation } from "react-i18next";
+import { z } from "zod";
+import { jsx, jsxs } from "react/jsx-runtime";
+var EditeServiceZoneSchema = z.object({
+  countries: z.array(z.object({ iso_2: z.string().min(2), display_name: z.string() })).min(1)
+});
+function EditServiceZoneAreasForm({
+  fulfillmentSetId,
+  locationId,
+  zone
+}) {
+  const { t } = useTranslation();
+  const { handleSuccess } = useRouteModal();
+  const form = useForm({
+    defaultValues: {
+      countries: zone.geo_zones.map((z2) => {
+        const country = countries.find((c) => c.iso_2 === z2.country_code);
+        return {
+          iso_2: z2.country_code,
+          display_name: country?.display_name || z2.country_code.toUpperCase()
+        };
+      })
+    },
+    resolver: zodResolver(EditeServiceZoneSchema)
+  });
+  const { mutateAsync: editServiceZone, isPending: isLoading } = useUpdateFulfillmentSetServiceZone(fulfillmentSetId, zone.id);
+  const handleSubmit = form.handleSubmit(async (data) => {
+    await editServiceZone(
+      {
+        geo_zones: data.countries.map(({ iso_2 }) => ({
+          country_code: iso_2,
+          type: "country"
+        }))
+      },
+      {
+        onSuccess: () => {
+          toast.success(
+            t("stockLocations.serviceZones.manageAreas.successToast", {
+              name: zone.name
+            })
+          );
+          handleSuccess(`/settings/locations/${locationId}`);
+        },
+        onError: (e) => {
+          toast.error(e.message);
+        }
+      }
+    );
+  });
+  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 flex-1 flex-col overflow-auto", children: /* @__PURE__ */ jsxs(StackedFocusModal, { id: GEO_ZONE_STACKED_MODAL_ID, children: [
+          /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center p-16", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-8", children: [
+            /* @__PURE__ */ jsx(Heading, { children: t("stockLocations.serviceZones.manageAreas.header", {
+              name: zone.name
+            }) }),
+            /* @__PURE__ */ jsx(GeoZoneForm, { form })
+          ] }) }),
+          /* @__PURE__ */ jsx(GeoZoneForm.AreaDrawer, { form })
+        ] }) }),
+        /* @__PURE__ */ jsx(RouteFocusModal.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, { variant: "secondary", size: "small", children: t("actions.cancel") }) }),
+          /* @__PURE__ */ jsx(Button, { type: "submit", size: "small", isLoading, children: t("actions.save") })
+        ] }) })
+      ]
+    }
+  ) });
+}
+
+// src/pages/settings/locations/[location_id]/fulfillment-set/[fset_id]/service-zone/[zone_id]/areas/index.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var LocationServiceZoneManageAreas = () => {
+  const { location_id, fset_id, zone_id } = useParams();
+  const { stock_location, isPending, isFetching, isError, error } = useStockLocation(location_id, {
+    fields: "*fulfillment_sets.service_zones.geo_zones,fulfillment_sets.service_zones.name"
+  });
+  const zone = stock_location?.fulfillment_sets?.find((f) => f.id === fset_id)?.service_zones.find((z2) => z2.id === zone_id);
+  if (!isPending && !isFetching && !zone) {
+    throw json(
+      { message: `Service zone with ID ${zone_id} was not found` },
+      404
+    );
+  }
+  if (isError) {
+    throw error;
+  }
+  return /* @__PURE__ */ jsx2(RouteFocusModal, { prev: `/settings/locations/${location_id}`, children: zone && /* @__PURE__ */ jsx2(
+    EditServiceZoneAreasForm,
+    {
+      zone,
+      fulfillmentSetId: fset_id,
+      locationId: location_id
+    }
+  ) });
+};
+var Component = LocationServiceZoneManageAreas;
+export {
+  Component
+};