@mercurjs/vendor 2.2.0-canary.9 → 2.2.0-rc.1

package/dist/fulfillment-5LEDKCH7.js

@@ -0,0 +1,650 @@
+import {
+  isReturnOption,
+  isSameLocation
+} from "./chunk-E3MNEQID.js";
+import {
+  getFulfillableQuantity
+} from "./chunk-RXM4B6HR.js";
+import "./chunk-TKGWSUEI.js";
+import {
+  KeyboundForm
+} from "./chunk-SITRHMZZ.js";
+import {
+  RouteFocusModal,
+  useRouteModal
+} from "./chunk-GDWBOQI5.js";
+import {
+  Form
+} from "./chunk-3QSRE5LS.js";
+import {
+  Thumbnail
+} from "./chunk-WIYFXWRI.js";
+import "./chunk-BQHVM46E.js";
+import "./chunk-QIF4QE7T.js";
+import "./chunk-VE6GRIIN.js";
+import "./chunk-7MARNXFG.js";
+import "./chunk-MNHP6YRC.js";
+import "./chunk-NTJ3BMOE.js";
+import "./chunk-CLS6PNZY.js";
+import "./chunk-JIXW4WHZ.js";
+import "./chunk-GZ4KTAWS.js";
+import "./chunk-PUAWN7SS.js";
+import "./chunk-4NADEZZQ.js";
+import "./chunk-XWHHBJGS.js";
+import "./chunk-5NVY7JZC.js";
+import "./chunk-KIURBTC4.js";
+import "./chunk-4EAC3GT7.js";
+import {
+  useShippingOptions
+} from "./chunk-JR7AABT5.js";
+import {
+  useStockLocations
+} from "./chunk-ZQCCVCHB.js";
+import "./chunk-MABIMRLS.js";
+import "./chunk-ULEW54ED.js";
+import {
+  useCreateOrderFulfillment,
+  useOrder
+} from "./chunk-UEPUKWD7.js";
+import "./chunk-JJP6AKMV.js";
+import "./chunk-744GLNZW.js";
+import "./chunk-A5DJIOHN.js";
+import "./chunk-RHKRREUU.js";
+import "./chunk-ZA2KFUFR.js";
+import "./chunk-LXZXXOJ3.js";
+import "./chunk-NBMM2TZK.js";
+
+// src/pages/orders/[id]/fulfillment/index.tsx
+import { useParams, useSearchParams } from "react-router-dom";
+
+// src/pages/orders/[id]/fulfillment/order-create-fulfillment-form/order-create-fulfillment-form.tsx
+import { zodResolver } from "@hookform/resolvers/zod";
+import { useCallback, useEffect as useEffect2, useState } from "react";
+import { useTranslation as useTranslation2 } from "react-i18next";
+import { Alert, Button, Heading, Select, Switch, toast } from "@medusajs/ui";
+import { useForm, useWatch as useWatch2 } from "react-hook-form";
+
+// src/pages/orders/[id]/fulfillment/order-create-fulfillment-form/constants.ts
+import { z } from "zod";
+var CreateFulfillmentSchema = z.object({
+  quantity: z.record(z.string(), z.number()),
+  // Per-item inclusion. Items default to selected; deselecting one
+  // excludes it from the fulfillment payload.
+  selection: z.record(z.string(), z.boolean()).optional(),
+  location_id: z.string(),
+  shipping_option_id: z.string().optional(),
+  send_notification: z.boolean().optional()
+});
+
+// src/pages/orders/[id]/fulfillment/order-create-fulfillment-form/order-create-fulfillment-item.tsx
+import { useEffect, useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { Checkbox, clx, Input, Text, Tooltip } from "@medusajs/ui";
+import { useWatch } from "react-hook-form";
+import { InformationCircleSolid } from "@medusajs/icons";
+import { jsx, jsxs } from "react/jsx-runtime";
+function OrderCreateFulfillmentItem({
+  item,
+  form,
+  locationId,
+  disabled,
+  onToggleSelected,
+  onInventoryStatusChange
+}) {
+  const { t } = useTranslation();
+  const firstLink = item.offer?.inventory_item_link?.[0];
+  const isSelected = useWatch({
+    control: form.control,
+    name: `selection.${item.id}`
+  }) !== false;
+  const { availableQuantity, inStockQuantity, missingLevel } = useMemo(() => {
+    if (!firstLink || !locationId) {
+      return { missingLevel: false };
+    }
+    const locationInventory = firstLink.inventory_item?.location_levels?.find(
+      (inv) => inv.location_id === locationId
+    );
+    if (!locationInventory) {
+      return { missingLevel: true };
+    }
+    return {
+      availableQuantity: locationInventory.available_quantity,
+      inStockQuantity: locationInventory.stocked_quantity,
+      missingLevel: false
+    };
+  }, [firstLink, locationId]);
+  useEffect(() => {
+    onInventoryStatusChange(item.id, missingLevel);
+  }, [item.id, missingLevel, onInventoryStatusChange]);
+  const minValue = 0;
+  const maxValue = Math.min(
+    getFulfillableQuantity(item),
+    availableQuantity || Number.MAX_SAFE_INTEGER
+  );
+  const inputDisabled = disabled || !isSelected;
+  return /* @__PURE__ */ jsx(
+    Form.Field,
+    {
+      control: form.control,
+      name: `quantity.${item.id}`,
+      rules: {
+        required: true,
+        min: minValue,
+        max: maxValue
+      },
+      render: ({ field }) => {
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: clx(
+              "bg-ui-bg-subtle shadow-elevation-card-rest rounded-xl",
+              !isSelected && "opacity-60"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center", children: [
+                /* @__PURE__ */ jsxs("div", { className: "ml-4 flex items-center gap-x-2", children: [
+                  /* @__PURE__ */ jsx(
+                    Checkbox,
+                    {
+                      checked: isSelected,
+                      disabled,
+                      onCheckedChange: (value) => onToggleSelected(item.id, value === true),
+                      "data-testid": `fulfillment-item-${item.id}-checkbox`
+                    }
+                  ),
+                  disabled && /* @__PURE__ */ jsx(
+                    Tooltip,
+                    {
+                      content: t("orders.fulfillment.disabledItemTooltip"),
+                      side: "top",
+                      children: /* @__PURE__ */ jsx(InformationCircleSolid, { className: "text-ui-tag-orange-icon" })
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: clx(
+                      "flex flex-col flex-1 gap-x-2 gap-y-2 p-3 text-sm sm:flex-row",
+                      disabled && "opacity-50 pointer-events-none"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-center gap-x-3", children: [
+                        /* @__PURE__ */ jsx(Thumbnail, { src: item.thumbnail }),
+                        /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                          /* @__PURE__ */ jsxs("div", { children: [
+                            /* @__PURE__ */ jsx(Text, { className: "txt-small", as: "span", weight: "plus", children: item.title }),
+                            item.variant_sku && /* @__PURE__ */ jsxs("span", { children: [
+                              "(",
+                              item.variant_sku,
+                              ")"
+                            ] })
+                          ] }),
+                          /* @__PURE__ */ jsx(Text, { as: "div", className: "text-ui-fg-subtle txt-small", children: item.variant_title })
+                        ] })
+                      ] }),
+                      /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-center gap-x-1", children: [
+                        /* @__PURE__ */ jsx("div", { className: "mr-2 block h-[16px] w-[2px] bg-gray-200" }),
+                        /* @__PURE__ */ jsxs("div", { className: "text-small flex flex-1 flex-col", children: [
+                          /* @__PURE__ */ jsx("span", { className: "text-ui-fg-subtle font-medium", children: t("orders.fulfillment.available") }),
+                          /* @__PURE__ */ jsx("span", { className: "text-ui-fg-subtle", children: availableQuantity ?? "N/A" })
+                        ] }),
+                        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-center gap-x-1", children: [
+                          /* @__PURE__ */ jsx("div", { className: "mr-2 block h-[16px] w-[2px] bg-gray-200" }),
+                          /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+                            /* @__PURE__ */ jsx("span", { className: "text-ui-fg-subtle font-medium", children: t("orders.fulfillment.inStock") }),
+                            /* @__PURE__ */ jsxs("span", { className: "text-ui-fg-subtle", children: [
+                              inStockQuantity ?? "N/A",
+                              " ",
+                              !!inStockQuantity && /* @__PURE__ */ jsxs("span", { className: "font-medium text-red-500", children: [
+                                "-",
+                                form.getValues(`quantity.${item.id}`)
+                              ] })
+                            ] })
+                          ] })
+                        ] }),
+                        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-center gap-1", children: [
+                          /* @__PURE__ */ jsx(Form.Item, { children: /* @__PURE__ */ jsx(Form.Control, { children: /* @__PURE__ */ jsx(
+                            Input,
+                            {
+                              className: "bg-ui-bg-base txt-small w-[50px] rounded-lg text-right [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
+                              type: "number",
+                              ...field,
+                              disabled: inputDisabled,
+                              onChange: (e) => {
+                                const val = e.target.value === "" ? null : Number(e.target.value);
+                                field.onChange(val);
+                                if (val !== null && !isNaN(val ?? 0)) {
+                                  if (val < minValue || val > maxValue) {
+                                    form.setError(`quantity.${item.id}`, {
+                                      type: "manual",
+                                      message: t(
+                                        "orders.fulfillment.error.wrongQuantity",
+                                        {
+                                          count: maxValue,
+                                          number: maxValue
+                                        }
+                                      )
+                                    });
+                                  } else {
+                                    form.clearErrors(`quantity.${item.id}`);
+                                  }
+                                }
+                              }
+                            }
+                          ) }) }),
+                          /* @__PURE__ */ jsxs("span", { className: "text-ui-fg-subtle", children: [
+                            "/ ",
+                            item.quantity,
+                            " ",
+                            t("fields.qty")
+                          ] })
+                        ] })
+                      ] })
+                    ]
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx(Form.ErrorMessage, { className: "flex justify-end pr-3 pb-2" })
+            ]
+          }
+        );
+      }
+    }
+  );
+}
+
+// src/pages/orders/[id]/fulfillment/order-create-fulfillment-form/order-create-fulfillment-form.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function OrderCreateFulfillmentForm({
+  order,
+  requiresShipping
+}) {
+  const { t } = useTranslation2();
+  const { handleSuccess } = useRouteModal();
+  const { mutateAsync: createOrderFulfillment, isPending: isMutating } = useCreateOrderFulfillment(order.id);
+  const [fulfillableItems, setFulfillableItems] = useState(
+    () => (order.items || []).filter(
+      (item) => item.requires_shipping === requiresShipping && getFulfillableQuantity(item) > 0
+    )
+  );
+  const form = useForm({
+    defaultValues: {
+      quantity: fulfillableItems.reduce(
+        (acc, item) => {
+          acc[item.id] = getFulfillableQuantity(item);
+          return acc;
+        },
+        {}
+      ),
+      send_notification: true
+    },
+    resolver: zodResolver(CreateFulfillmentSchema)
+  });
+  const selectedLocationId = useWatch2({
+    name: "location_id",
+    control: form.control
+  });
+  const { stock_locations = [] } = useStockLocations();
+  const [missingLevelMap, setMissingLevelMap] = useState({});
+  const handleInventoryStatusChange = useCallback(
+    (itemId, missingLevel) => {
+      setMissingLevelMap((prev) => {
+        if (prev[itemId] === missingLevel) {
+          return prev;
+        }
+        return { ...prev, [itemId]: missingLevel };
+      });
+    },
+    []
+  );
+  const handleToggleSelected = useCallback(
+    (itemId, checked) => {
+      form.setValue(
+        `selection.${itemId}`,
+        checked
+      );
+    },
+    [form]
+  );
+  const selection = useWatch2({ name: "selection", control: form.control });
+  const { shipping_options = [], isLoading: isShippingOptionsLoading } = useShippingOptions({
+    fields: "+service_zone.fulfillment_set.location.id,*rules"
+  });
+  const filteredShippingOptions = shipping_options.filter(
+    (o) => o !== null && !isReturnOption(o) && isSameLocation(o, selectedLocationId)
+  );
+  const shippingOptionId = useWatch2({
+    name: "shipping_option_id",
+    control: form.control
+  });
+  const handleSubmit = form.handleSubmit(async (data) => {
+    const selectedShippingOption = shipping_options.find(
+      (o) => o?.id === shippingOptionId
+    );
+    if (!selectedShippingOption) {
+      form.setError("shipping_option_id", {
+        type: "manual",
+        message: t("orders.fulfillment.error.noShippingOption")
+      });
+      return;
+    }
+    if (!selectedLocationId) {
+      form.setError("location_id", {
+        type: "manual",
+        message: t("orders.fulfillment.error.noLocation")
+      });
+      return;
+    }
+    const selectedShippingProfileId = selectedShippingOption?.shipping_profile_id;
+    const itemShippingProfileMap = order.items.reduce(
+      (acc, item) => {
+        const offerProfileId = item.offer?.shipping_profile_id ?? null;
+        acc[item.id] = offerProfileId ?? item.variant?.product?.shipping_profile?.id ?? null;
+        return acc;
+      },
+      {}
+    );
+    const payload = {
+      location_id: selectedLocationId,
+      requires_shipping: true,
+      // shipping_option_id: shippingOptionId,
+      // no_notification: !data.send_notification,
+      items: Object.entries(data.quantity).filter(
+        ([id, value]) => !!value && data.selection?.[id] !== false && itemShippingProfileMap[id] === selectedShippingProfileId
+      ).map(([id, quantity]) => ({
+        id,
+        quantity
+      }))
+    };
+    if (!payload.items.length) {
+      toast.error(t("orders.fulfillment.error.noItems"));
+      return;
+    }
+    try {
+      await createOrderFulfillment(payload);
+      toast.success(t("orders.fulfillment.toast.created"));
+      handleSuccess(`/orders/${order.id}`);
+    } catch (e) {
+      const message = e?.message ?? "";
+      if (message.includes("exceeds the reserved quantity")) {
+        toast.error(t("orders.fulfillment.error.exceedsReservedQuantity"));
+        return;
+      }
+      toast.error(message);
+    }
+  });
+  useEffect2(() => {
+    if (stock_locations?.length && shipping_options?.length) {
+      const initialShippingOptionId = order.shipping_methods?.[0]?.shipping_option_id;
+      if (initialShippingOptionId) {
+        const shippingOption = shipping_options.find(
+          (o) => o?.id === initialShippingOptionId
+        );
+        if (shippingOption) {
+          const locationId = shippingOption.service_zone.fulfillment_set.location.id;
+          form.setValue("location_id", locationId);
+          form.setValue(
+            "shipping_option_id",
+            initialShippingOptionId || void 0
+          );
+        }
+      }
+    }
+  }, [
+    stock_locations?.length,
+    shipping_options?.length,
+    order.shipping_methods,
+    form,
+    shipping_options
+  ]);
+  const fulfilledQuantityArray = (order.items || []).map(
+    (item) => item.requires_shipping === requiresShipping && item.detail.fulfilled_quantity
+  );
+  useEffect2(() => {
+    const itemsToFulfill = order?.items?.filter(
+      (item) => item.requires_shipping === requiresShipping && getFulfillableQuantity(item) > 0
+    ) || [];
+    setFulfillableItems(itemsToFulfill);
+    if (itemsToFulfill.length) {
+      form.clearErrors("root");
+    } else {
+      form.setError("root", {
+        type: "manual",
+        message: t("orders.fulfillment.error.noItems")
+      });
+    }
+    const quantityMap = itemsToFulfill.reduce(
+      (acc, item) => {
+        acc[item.id] = getFulfillableQuantity(item);
+        return acc;
+      },
+      {}
+    );
+    form.setValue("quantity", quantityMap);
+  }, [
+    ...fulfilledQuantityArray,
+    requiresShipping,
+    t,
+    form,
+    order.items
+  ]);
+  const differentOptionSelected = shippingOptionId && order.shipping_methods?.[0]?.shipping_option_id !== shippingOptionId;
+  const showNoInventoryWarning = !!selectedLocationId && fulfillableItems.some(
+    (item) => selection?.[item.id] !== false && missingLevelMap[item.id] === true
+  );
+  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__ */ jsxs2("div", { className: "flex w-full max-w-[736px] flex-col justify-center px-2 pb-2", children: [
+          /* @__PURE__ */ jsx2(Heading, { className: "mb-8", children: t("orders.fulfillment.create") }),
+          /* @__PURE__ */ jsxs2("div", { className: "flex flex-col divide-y divide-dashed", children: [
+            /* @__PURE__ */ jsxs2("div", { className: "pb-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 flex-col gap-2 xl:flex-row xl:items-center", children: [
+                        /* @__PURE__ */ jsxs2("div", { className: "flex-1", children: [
+                          /* @__PURE__ */ jsx2(Form.Label, { children: t("fields.location") }),
+                          /* @__PURE__ */ jsx2(Form.Hint, { children: t("orders.fulfillment.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, {})
+                    ] });
+                  }
+                }
+              ),
+              showNoInventoryWarning && /* @__PURE__ */ jsxs2(
+                Alert,
+                {
+                  variant: "warning",
+                  className: "mt-4 p-4",
+                  "data-testid": "fulfillment-no-inventory-warning",
+                  children: [
+                    /* @__PURE__ */ jsx2("span", { className: "-mt-[3px] block font-medium", children: t("orders.fulfillment.noInventoryLevel.title") }),
+                    /* @__PURE__ */ jsx2("span", { className: "text-ui-fg-muted", children: t("orders.fulfillment.noInventoryLevel.description") })
+                  ]
+                },
+                selectedLocationId
+              )
+            ] }),
+            /* @__PURE__ */ jsxs2("div", { className: "py-8", children: [
+              /* @__PURE__ */ jsx2(
+                Form.Field,
+                {
+                  control: form.control,
+                  name: "shipping_option_id",
+                  render: ({ field: { onChange, ref, ...field } }) => {
+                    return /* @__PURE__ */ jsxs2(Form.Item, { children: [
+                      /* @__PURE__ */ jsxs2("div", { className: "flex flex-col gap-2 xl:flex-row xl:items-center", children: [
+                        /* @__PURE__ */ jsxs2("div", { className: "flex-1", children: [
+                          /* @__PURE__ */ jsx2(Form.Label, { children: t("fields.shippingMethod") }),
+                          /* @__PURE__ */ jsx2(Form.Hint, { children: t("orders.fulfillment.methodDescription") })
+                        ] }),
+                        /* @__PURE__ */ jsx2("div", { className: "flex-1", children: /* @__PURE__ */ jsx2(Form.Control, { children: /* @__PURE__ */ jsxs2(
+                          Select,
+                          {
+                            onValueChange: onChange,
+                            ...field,
+                            disabled: !selectedLocationId,
+                            children: [
+                              /* @__PURE__ */ jsx2(
+                                Select.Trigger,
+                                {
+                                  className: "bg-ui-bg-base",
+                                  ref,
+                                  children: isShippingOptionsLoading ? /* @__PURE__ */ jsxs2("span", { className: "text-right", children: [
+                                    t("labels.loading"),
+                                    "..."
+                                  ] }) : /* @__PURE__ */ jsx2(Select.Value, {})
+                                }
+                              ),
+                              /* @__PURE__ */ jsx2(Select.Content, { children: filteredShippingOptions.map((o) => /* @__PURE__ */ jsx2(Select.Item, { value: o?.id, children: o?.name }, o?.id)) })
+                            ]
+                          }
+                        ) }) })
+                      ] }),
+                      /* @__PURE__ */ jsx2(Form.ErrorMessage, {})
+                    ] });
+                  }
+                }
+              ),
+              differentOptionSelected && /* @__PURE__ */ jsxs2(Alert, { className: "mt-4 p-4", variant: "warning", children: [
+                /* @__PURE__ */ jsx2("span", { className: "-mt-[3px] block font-medium", children: t("labels.beaware") }),
+                /* @__PURE__ */ jsx2("span", { className: "text-ui-fg-muted", children: t("orders.fulfillment.differentOptionSelected") })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs2("div", { className: "py-8", children: [
+              /* @__PURE__ */ jsxs2(Form.Item, { children: [
+                /* @__PURE__ */ jsx2(Form.Label, { children: t("orders.fulfillment.itemsToFulfill") }),
+                /* @__PURE__ */ jsx2(Form.Hint, { children: t("orders.fulfillment.itemsToFulfillDesc") }),
+                /* @__PURE__ */ jsx2("div", { className: "flex flex-col gap-y-2 pt-4", children: fulfillableItems.map((item) => {
+                  const offerProfileId = item.offer?.shipping_profile_id;
+                  const itemShippingProfileId = offerProfileId ?? item.variant?.product?.shipping_profile?.id;
+                  const selectedShippingOption = shipping_options.find(
+                    (o) => o?.id === shippingOptionId
+                  );
+                  const disabled = !!selectedShippingOption && selectedShippingOption.shipping_profile_id !== itemShippingProfileId;
+                  return /* @__PURE__ */ jsx2(
+                    OrderCreateFulfillmentItem,
+                    {
+                      form,
+                      item,
+                      locationId: selectedLocationId,
+                      currencyCode: order.currency_code,
+                      onItemRemove: () => {
+                      },
+                      disabled,
+                      onToggleSelected: handleToggleSelected,
+                      onInventoryStatusChange: handleInventoryStatusChange
+                    },
+                    item.id
+                  );
+                }) })
+              ] }),
+              form.formState.errors.root && /* @__PURE__ */ jsx2(
+                Alert,
+                {
+                  variant: "error",
+                  dismissible: false,
+                  className: "flex items-center",
+                  children: form.formState.errors.root.message
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx2("div", { className: "pt-8", children: /* @__PURE__ */ jsx2("div", { className: "bg-ui-bg-field rounded-lg border py-2 pl-2 pr-4", children: /* @__PURE__ */ jsx2(
+              Form.Field,
+              {
+                control: form.control,
+                name: "send_notification",
+                render: ({ field: { onChange, value, ...field } }) => {
+                  return /* @__PURE__ */ jsxs2(Form.Item, { children: [
+                    /* @__PURE__ */ jsxs2("div", { className: "flex items-center", children: [
+                      /* @__PURE__ */ jsx2(Form.Control, { className: "mr-4 self-start", children: /* @__PURE__ */ jsx2(
+                        Switch,
+                        {
+                          className: "mt-[2px]",
+                          checked: !!value,
+                          onCheckedChange: onChange,
+                          ...field,
+                          "data-testid": "fulfillment-send-notification"
+                        }
+                      ) }),
+                      /* @__PURE__ */ jsxs2("div", { className: "block", children: [
+                        /* @__PURE__ */ jsx2(Form.Label, { children: t("orders.returns.sendNotification") }),
+                        /* @__PURE__ */ jsx2(Form.Hint, { className: "!mt-1", children: t(
+                          "orders.fulfillment.sendNotificationHint"
+                        ) })
+                      ] })
+                    ] }),
+                    /* @__PURE__ */ jsx2(Form.ErrorMessage, {})
+                  ] });
+                }
+              }
+            ) }) })
+          ] })
+        ] }) }) }),
+        /* @__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: !shippingOptionId,
+              children: t("actions.confirm")
+            }
+          )
+        ] }) })
+      ]
+    }
+  ) });
+}
+
+// src/pages/orders/[id]/fulfillment/index.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Component = () => {
+  const { id } = useParams();
+  const [searchParams] = useSearchParams();
+  const requiresShipping = searchParams.get("requires_shipping") === "true";
+  const { order, isLoading, isError, error } = useOrder(id, {
+    // `*foo,*foo.bar` or `+foo.bar.baz` makes Medusa's query parser try
+    // to look up a literal property `*items` / `+items` on Order and
+    // 500. Use `<rel>.*` plus bare scalar names.
+    fields: "currency_code,items.*,items.variant.*,items.variant.product.shipping_profile.id,items.offer.shipping_profile_id,items.offer.inventory_item_link.*,items.offer.inventory_item_link.inventory_item.location_levels.*,shipping_address.*,shipping_methods.shipping_option_id,no_notification"
+  });
+  if (isError) {
+    throw error;
+  }
+  const ready = !isLoading && order;
+  return /* @__PURE__ */ jsx3(RouteFocusModal, { children: ready && /* @__PURE__ */ jsx3(
+    OrderCreateFulfillmentForm,
+    {
+      order,
+      requiresShipping
+    }
+  ) });
+};
+export {
+  Component
+};