@medusajs/draft-order 2.11.2-snapshot-20251026124930 → 2.11.2-snapshot-20251028102245

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9571,6 +9571,196 @@ const ID = () => {
9571
9571
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9572
9572
  ] });
9573
9573
  };
9574
+ const BillingAddress = () => {
9575
+ const { id } = reactRouterDom.useParams();
9576
+ const { order, isPending, isError, error } = useOrder(id, {
9577
+ fields: "+billing_address"
9578
+ });
9579
+ if (isError) {
9580
+ throw error;
9581
+ }
9582
+ const isReady = !isPending && !!order;
9583
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9584
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9585
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9586
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9587
+ ] }),
9588
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9589
+ ] });
9590
+ };
9591
+ const BillingAddressForm = ({ order }) => {
9592
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9593
+ const form = reactHookForm.useForm({
9594
+ defaultValues: {
9595
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9596
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9597
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9598
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9599
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9600
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9601
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9602
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9603
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9604
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9605
+ },
9606
+ resolver: zod.zodResolver(schema$5)
9607
+ });
9608
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9609
+ const { handleSuccess } = useRouteModal();
9610
+ const onSubmit = form.handleSubmit(async (data) => {
9611
+ await mutateAsync(
9612
+ { billing_address: data },
9613
+ {
9614
+ onSuccess: () => {
9615
+ handleSuccess();
9616
+ },
9617
+ onError: (error) => {
9618
+ ui.toast.error(error.message);
9619
+ }
9620
+ }
9621
+ );
9622
+ });
9623
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9624
+ KeyboundForm,
9625
+ {
9626
+ className: "flex flex-1 flex-col overflow-hidden",
9627
+ onSubmit,
9628
+ children: [
9629
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
9630
+ /* @__PURE__ */ jsxRuntime.jsx(
9631
+ Form$2.Field,
9632
+ {
9633
+ control: form.control,
9634
+ name: "country_code",
9635
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9636
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9637
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9638
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9639
+ ] })
9640
+ }
9641
+ ),
9642
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9643
+ /* @__PURE__ */ jsxRuntime.jsx(
9644
+ Form$2.Field,
9645
+ {
9646
+ control: form.control,
9647
+ name: "first_name",
9648
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9649
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9650
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9651
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9652
+ ] })
9653
+ }
9654
+ ),
9655
+ /* @__PURE__ */ jsxRuntime.jsx(
9656
+ Form$2.Field,
9657
+ {
9658
+ control: form.control,
9659
+ name: "last_name",
9660
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9661
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9662
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9663
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9664
+ ] })
9665
+ }
9666
+ )
9667
+ ] }),
9668
+ /* @__PURE__ */ jsxRuntime.jsx(
9669
+ Form$2.Field,
9670
+ {
9671
+ control: form.control,
9672
+ name: "company",
9673
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9674
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9675
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9677
+ ] })
9678
+ }
9679
+ ),
9680
+ /* @__PURE__ */ jsxRuntime.jsx(
9681
+ Form$2.Field,
9682
+ {
9683
+ control: form.control,
9684
+ name: "address_1",
9685
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9686
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9687
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9689
+ ] })
9690
+ }
9691
+ ),
9692
+ /* @__PURE__ */ jsxRuntime.jsx(
9693
+ Form$2.Field,
9694
+ {
9695
+ control: form.control,
9696
+ name: "address_2",
9697
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9698
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9699
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9700
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9701
+ ] })
9702
+ }
9703
+ ),
9704
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9705
+ /* @__PURE__ */ jsxRuntime.jsx(
9706
+ Form$2.Field,
9707
+ {
9708
+ control: form.control,
9709
+ name: "postal_code",
9710
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9711
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9712
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9713
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9714
+ ] })
9715
+ }
9716
+ ),
9717
+ /* @__PURE__ */ jsxRuntime.jsx(
9718
+ Form$2.Field,
9719
+ {
9720
+ control: form.control,
9721
+ name: "city",
9722
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9723
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9724
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9725
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9726
+ ] })
9727
+ }
9728
+ )
9729
+ ] }),
9730
+ /* @__PURE__ */ jsxRuntime.jsx(
9731
+ Form$2.Field,
9732
+ {
9733
+ control: form.control,
9734
+ name: "province",
9735
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9736
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9737
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9738
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9739
+ ] })
9740
+ }
9741
+ ),
9742
+ /* @__PURE__ */ jsxRuntime.jsx(
9743
+ Form$2.Field,
9744
+ {
9745
+ control: form.control,
9746
+ name: "phone",
9747
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9748
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9749
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9750
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9751
+ ] })
9752
+ }
9753
+ )
9754
+ ] }) }),
9755
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9756
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9757
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9758
+ ] }) })
9759
+ ]
9760
+ }
9761
+ ) });
9762
+ };
9763
+ const schema$5 = addressSchema;
9574
9764
  const Email = () => {
9575
9765
  const { id } = reactRouterDom.useParams();
9576
9766
  const { order, isPending, isError, error } = useOrder(id, {
@@ -9593,7 +9783,7 @@ const EmailForm = ({ order }) => {
9593
9783
  defaultValues: {
9594
9784
  email: order.email ?? ""
9595
9785
  },
9596
- resolver: zod.zodResolver(schema$5)
9786
+ resolver: zod.zodResolver(schema$4)
9597
9787
  });
9598
9788
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9599
9789
  const { handleSuccess } = useRouteModal();
@@ -9636,7 +9826,7 @@ const EmailForm = ({ order }) => {
9636
9826
  }
9637
9827
  ) });
9638
9828
  };
9639
- const schema$5 = objectType({
9829
+ const schema$4 = objectType({
9640
9830
  email: stringType().email()
9641
9831
  });
9642
9832
  const NumberInput = React.forwardRef(
@@ -11240,27 +11430,6 @@ function getPromotionIds(items, shippingMethods) {
11240
11430
  }
11241
11431
  return Array.from(promotionIds);
11242
11432
  }
11243
- const CustomItems = () => {
11244
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11245
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
11246
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
11247
- ] });
11248
- };
11249
- const CustomItemsForm = () => {
11250
- const form = reactHookForm.useForm({
11251
- resolver: zod.zodResolver(schema$4)
11252
- });
11253
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
11254
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
11255
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11256
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11257
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
11258
- ] }) })
11259
- ] }) });
11260
- };
11261
- const schema$4 = objectType({
11262
- email: stringType().email()
11263
- });
11264
11433
  const SalesChannel = () => {
11265
11434
  const { id } = reactRouterDom.useParams();
11266
11435
  const { draft_order, isPending, isError, error } = useDraftOrder(
@@ -11367,46 +11536,249 @@ const SalesChannelField = ({ control, order }) => {
11367
11536
  const schema$3 = objectType({
11368
11537
  sales_channel_id: stringType().min(1)
11369
11538
  });
11370
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11371
- const Shipping = () => {
11372
- var _a;
11539
+ const ShippingAddress = () => {
11373
11540
  const { id } = reactRouterDom.useParams();
11374
11541
  const { order, isPending, isError, error } = useOrder(id, {
11375
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11542
+ fields: "+shipping_address"
11376
11543
  });
11377
- const {
11378
- order: preview,
11379
- isPending: isPreviewPending,
11380
- isError: isPreviewError,
11381
- error: previewError
11382
- } = useOrderPreview(id);
11383
- useInitiateOrderEdit({ preview });
11384
- const { onCancel } = useCancelOrderEdit({ preview });
11385
11544
  if (isError) {
11386
11545
  throw error;
11387
11546
  }
11388
- if (isPreviewError) {
11389
- throw previewError;
11390
- }
11391
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11392
- const isReady = preview && !isPreviewPending && order && !isPending;
11393
- return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11394
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11395
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11396
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11397
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11398
- ] }) }) }),
11399
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11400
- ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11401
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11402
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11403
- ] }) });
11547
+ const isReady = !isPending && !!order;
11548
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11549
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11550
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
11551
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11552
+ ] }),
11553
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11554
+ ] });
11404
11555
  };
11405
- const ShippingForm = ({ preview, order }) => {
11406
- var _a;
11407
- const { setIsOpen } = useStackedModal();
11408
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11409
- const [data, setData] = React.useState(null);
11556
+ const ShippingAddressForm = ({ order }) => {
11557
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11558
+ const form = reactHookForm.useForm({
11559
+ defaultValues: {
11560
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11561
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11562
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11563
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11564
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11565
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11566
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11567
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11568
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11569
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11570
+ },
11571
+ resolver: zod.zodResolver(schema$2)
11572
+ });
11573
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11574
+ const { handleSuccess } = useRouteModal();
11575
+ const onSubmit = form.handleSubmit(async (data) => {
11576
+ await mutateAsync(
11577
+ {
11578
+ shipping_address: {
11579
+ first_name: data.first_name,
11580
+ last_name: data.last_name,
11581
+ company: data.company,
11582
+ address_1: data.address_1,
11583
+ address_2: data.address_2,
11584
+ city: data.city,
11585
+ province: data.province,
11586
+ country_code: data.country_code,
11587
+ postal_code: data.postal_code,
11588
+ phone: data.phone
11589
+ }
11590
+ },
11591
+ {
11592
+ onSuccess: () => {
11593
+ handleSuccess();
11594
+ },
11595
+ onError: (error) => {
11596
+ ui.toast.error(error.message);
11597
+ }
11598
+ }
11599
+ );
11600
+ });
11601
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11602
+ KeyboundForm,
11603
+ {
11604
+ className: "flex flex-1 flex-col overflow-hidden",
11605
+ onSubmit,
11606
+ children: [
11607
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
11608
+ /* @__PURE__ */ jsxRuntime.jsx(
11609
+ Form$2.Field,
11610
+ {
11611
+ control: form.control,
11612
+ name: "country_code",
11613
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11614
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11615
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11616
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11617
+ ] })
11618
+ }
11619
+ ),
11620
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11621
+ /* @__PURE__ */ jsxRuntime.jsx(
11622
+ Form$2.Field,
11623
+ {
11624
+ control: form.control,
11625
+ name: "first_name",
11626
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11627
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11628
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11629
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11630
+ ] })
11631
+ }
11632
+ ),
11633
+ /* @__PURE__ */ jsxRuntime.jsx(
11634
+ Form$2.Field,
11635
+ {
11636
+ control: form.control,
11637
+ name: "last_name",
11638
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11639
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11640
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11641
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11642
+ ] })
11643
+ }
11644
+ )
11645
+ ] }),
11646
+ /* @__PURE__ */ jsxRuntime.jsx(
11647
+ Form$2.Field,
11648
+ {
11649
+ control: form.control,
11650
+ name: "company",
11651
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11652
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11653
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11654
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11655
+ ] })
11656
+ }
11657
+ ),
11658
+ /* @__PURE__ */ jsxRuntime.jsx(
11659
+ Form$2.Field,
11660
+ {
11661
+ control: form.control,
11662
+ name: "address_1",
11663
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11664
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11665
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11666
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11667
+ ] })
11668
+ }
11669
+ ),
11670
+ /* @__PURE__ */ jsxRuntime.jsx(
11671
+ Form$2.Field,
11672
+ {
11673
+ control: form.control,
11674
+ name: "address_2",
11675
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11677
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11678
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11679
+ ] })
11680
+ }
11681
+ ),
11682
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11683
+ /* @__PURE__ */ jsxRuntime.jsx(
11684
+ Form$2.Field,
11685
+ {
11686
+ control: form.control,
11687
+ name: "postal_code",
11688
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11689
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11690
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11691
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11692
+ ] })
11693
+ }
11694
+ ),
11695
+ /* @__PURE__ */ jsxRuntime.jsx(
11696
+ Form$2.Field,
11697
+ {
11698
+ control: form.control,
11699
+ name: "city",
11700
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11701
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11702
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11703
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11704
+ ] })
11705
+ }
11706
+ )
11707
+ ] }),
11708
+ /* @__PURE__ */ jsxRuntime.jsx(
11709
+ Form$2.Field,
11710
+ {
11711
+ control: form.control,
11712
+ name: "province",
11713
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11714
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11715
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11716
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11717
+ ] })
11718
+ }
11719
+ ),
11720
+ /* @__PURE__ */ jsxRuntime.jsx(
11721
+ Form$2.Field,
11722
+ {
11723
+ control: form.control,
11724
+ name: "phone",
11725
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11726
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11727
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11728
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11729
+ ] })
11730
+ }
11731
+ )
11732
+ ] }) }),
11733
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11734
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11735
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11736
+ ] }) })
11737
+ ]
11738
+ }
11739
+ ) });
11740
+ };
11741
+ const schema$2 = addressSchema;
11742
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11743
+ const Shipping = () => {
11744
+ var _a;
11745
+ const { id } = reactRouterDom.useParams();
11746
+ const { order, isPending, isError, error } = useOrder(id, {
11747
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11748
+ });
11749
+ const {
11750
+ order: preview,
11751
+ isPending: isPreviewPending,
11752
+ isError: isPreviewError,
11753
+ error: previewError
11754
+ } = useOrderPreview(id);
11755
+ useInitiateOrderEdit({ preview });
11756
+ const { onCancel } = useCancelOrderEdit({ preview });
11757
+ if (isError) {
11758
+ throw error;
11759
+ }
11760
+ if (isPreviewError) {
11761
+ throw previewError;
11762
+ }
11763
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11764
+ const isReady = preview && !isPreviewPending && order && !isPending;
11765
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11766
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11767
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11768
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11769
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11770
+ ] }) }) }),
11771
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11772
+ ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11773
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11774
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11775
+ ] }) });
11776
+ };
11777
+ const ShippingForm = ({ preview, order }) => {
11778
+ var _a;
11779
+ const { setIsOpen } = useStackedModal();
11780
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11781
+ const [data, setData] = React.useState(null);
11410
11782
  const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11411
11783
  const { shipping_options } = useShippingOptions(
11412
11784
  {
@@ -12197,7 +12569,7 @@ const TransferOwnershipForm = ({ order }) => {
12197
12569
  defaultValues: {
12198
12570
  customer_id: order.customer_id || ""
12199
12571
  },
12200
- resolver: zod.zodResolver(schema$2)
12572
+ resolver: zod.zodResolver(schema$1)
12201
12573
  });
12202
12574
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12203
12575
  const { handleSuccess } = useRouteModal();
@@ -12647,402 +13019,30 @@ const Illustration = () => {
12647
13019
  }
12648
13020
  );
12649
13021
  };
12650
- const schema$2 = objectType({
13022
+ const schema$1 = objectType({
12651
13023
  customer_id: stringType().min(1)
12652
13024
  });
12653
- const ShippingAddress = () => {
12654
- const { id } = reactRouterDom.useParams();
12655
- const { order, isPending, isError, error } = useOrder(id, {
12656
- fields: "+shipping_address"
12657
- });
12658
- if (isError) {
12659
- throw error;
12660
- }
12661
- const isReady = !isPending && !!order;
13025
+ const CustomItems = () => {
12662
13026
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12663
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12664
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12665
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12666
- ] }),
12667
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
13027
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
13028
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
12668
13029
  ] });
12669
13030
  };
12670
- const ShippingAddressForm = ({ order }) => {
12671
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
13031
+ const CustomItemsForm = () => {
12672
13032
  const form = reactHookForm.useForm({
12673
- defaultValues: {
12674
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12675
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12676
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12677
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12678
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12679
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12680
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12681
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12682
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12683
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12684
- },
12685
- resolver: zod.zodResolver(schema$1)
12686
- });
12687
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12688
- const { handleSuccess } = useRouteModal();
12689
- const onSubmit = form.handleSubmit(async (data) => {
12690
- await mutateAsync(
12691
- {
12692
- shipping_address: {
12693
- first_name: data.first_name,
12694
- last_name: data.last_name,
12695
- company: data.company,
12696
- address_1: data.address_1,
12697
- address_2: data.address_2,
12698
- city: data.city,
12699
- province: data.province,
12700
- country_code: data.country_code,
12701
- postal_code: data.postal_code,
12702
- phone: data.phone
12703
- }
12704
- },
12705
- {
12706
- onSuccess: () => {
12707
- handleSuccess();
12708
- },
12709
- onError: (error) => {
12710
- ui.toast.error(error.message);
12711
- }
12712
- }
12713
- );
12714
- });
12715
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12716
- KeyboundForm,
12717
- {
12718
- className: "flex flex-1 flex-col overflow-hidden",
12719
- onSubmit,
12720
- children: [
12721
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
12722
- /* @__PURE__ */ jsxRuntime.jsx(
12723
- Form$2.Field,
12724
- {
12725
- control: form.control,
12726
- name: "country_code",
12727
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12728
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12729
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12730
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12731
- ] })
12732
- }
12733
- ),
12734
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12735
- /* @__PURE__ */ jsxRuntime.jsx(
12736
- Form$2.Field,
12737
- {
12738
- control: form.control,
12739
- name: "first_name",
12740
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12741
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12742
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12743
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12744
- ] })
12745
- }
12746
- ),
12747
- /* @__PURE__ */ jsxRuntime.jsx(
12748
- Form$2.Field,
12749
- {
12750
- control: form.control,
12751
- name: "last_name",
12752
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12753
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12754
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12755
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12756
- ] })
12757
- }
12758
- )
12759
- ] }),
12760
- /* @__PURE__ */ jsxRuntime.jsx(
12761
- Form$2.Field,
12762
- {
12763
- control: form.control,
12764
- name: "company",
12765
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12766
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12767
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12768
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12769
- ] })
12770
- }
12771
- ),
12772
- /* @__PURE__ */ jsxRuntime.jsx(
12773
- Form$2.Field,
12774
- {
12775
- control: form.control,
12776
- name: "address_1",
12777
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12778
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12779
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12780
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12781
- ] })
12782
- }
12783
- ),
12784
- /* @__PURE__ */ jsxRuntime.jsx(
12785
- Form$2.Field,
12786
- {
12787
- control: form.control,
12788
- name: "address_2",
12789
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12790
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12791
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12792
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12793
- ] })
12794
- }
12795
- ),
12796
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12797
- /* @__PURE__ */ jsxRuntime.jsx(
12798
- Form$2.Field,
12799
- {
12800
- control: form.control,
12801
- name: "postal_code",
12802
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12803
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12804
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12805
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12806
- ] })
12807
- }
12808
- ),
12809
- /* @__PURE__ */ jsxRuntime.jsx(
12810
- Form$2.Field,
12811
- {
12812
- control: form.control,
12813
- name: "city",
12814
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12815
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12816
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12817
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12818
- ] })
12819
- }
12820
- )
12821
- ] }),
12822
- /* @__PURE__ */ jsxRuntime.jsx(
12823
- Form$2.Field,
12824
- {
12825
- control: form.control,
12826
- name: "province",
12827
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12828
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12829
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12830
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12831
- ] })
12832
- }
12833
- ),
12834
- /* @__PURE__ */ jsxRuntime.jsx(
12835
- Form$2.Field,
12836
- {
12837
- control: form.control,
12838
- name: "phone",
12839
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12840
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12841
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12842
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12843
- ] })
12844
- }
12845
- )
12846
- ] }) }),
12847
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12848
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12849
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12850
- ] }) })
12851
- ]
12852
- }
12853
- ) });
12854
- };
12855
- const schema$1 = addressSchema;
12856
- const BillingAddress = () => {
12857
- const { id } = reactRouterDom.useParams();
12858
- const { order, isPending, isError, error } = useOrder(id, {
12859
- fields: "+billing_address"
12860
- });
12861
- if (isError) {
12862
- throw error;
12863
- }
12864
- const isReady = !isPending && !!order;
12865
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12866
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12867
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12868
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12869
- ] }),
12870
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12871
- ] });
12872
- };
12873
- const BillingAddressForm = ({ order }) => {
12874
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12875
- const form = reactHookForm.useForm({
12876
- defaultValues: {
12877
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12878
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12879
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12880
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12881
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12882
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12883
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12884
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12885
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12886
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12887
- },
12888
13033
  resolver: zod.zodResolver(schema)
12889
13034
  });
12890
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12891
- const { handleSuccess } = useRouteModal();
12892
- const onSubmit = form.handleSubmit(async (data) => {
12893
- await mutateAsync(
12894
- { billing_address: data },
12895
- {
12896
- onSuccess: () => {
12897
- handleSuccess();
12898
- },
12899
- onError: (error) => {
12900
- ui.toast.error(error.message);
12901
- }
12902
- }
12903
- );
12904
- });
12905
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12906
- KeyboundForm,
12907
- {
12908
- className: "flex flex-1 flex-col overflow-hidden",
12909
- onSubmit,
12910
- children: [
12911
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-y-4", children: [
12912
- /* @__PURE__ */ jsxRuntime.jsx(
12913
- Form$2.Field,
12914
- {
12915
- control: form.control,
12916
- name: "country_code",
12917
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12918
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12919
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12920
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12921
- ] })
12922
- }
12923
- ),
12924
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12925
- /* @__PURE__ */ jsxRuntime.jsx(
12926
- Form$2.Field,
12927
- {
12928
- control: form.control,
12929
- name: "first_name",
12930
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12931
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12932
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12933
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12934
- ] })
12935
- }
12936
- ),
12937
- /* @__PURE__ */ jsxRuntime.jsx(
12938
- Form$2.Field,
12939
- {
12940
- control: form.control,
12941
- name: "last_name",
12942
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12943
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12944
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12945
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12946
- ] })
12947
- }
12948
- )
12949
- ] }),
12950
- /* @__PURE__ */ jsxRuntime.jsx(
12951
- Form$2.Field,
12952
- {
12953
- control: form.control,
12954
- name: "company",
12955
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12956
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12957
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12958
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12959
- ] })
12960
- }
12961
- ),
12962
- /* @__PURE__ */ jsxRuntime.jsx(
12963
- Form$2.Field,
12964
- {
12965
- control: form.control,
12966
- name: "address_1",
12967
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12968
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12969
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12970
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12971
- ] })
12972
- }
12973
- ),
12974
- /* @__PURE__ */ jsxRuntime.jsx(
12975
- Form$2.Field,
12976
- {
12977
- control: form.control,
12978
- name: "address_2",
12979
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12980
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12981
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12982
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12983
- ] })
12984
- }
12985
- ),
12986
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12987
- /* @__PURE__ */ jsxRuntime.jsx(
12988
- Form$2.Field,
12989
- {
12990
- control: form.control,
12991
- name: "postal_code",
12992
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12993
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12994
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12995
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12996
- ] })
12997
- }
12998
- ),
12999
- /* @__PURE__ */ jsxRuntime.jsx(
13000
- Form$2.Field,
13001
- {
13002
- control: form.control,
13003
- name: "city",
13004
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13005
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
13006
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13007
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13008
- ] })
13009
- }
13010
- )
13011
- ] }),
13012
- /* @__PURE__ */ jsxRuntime.jsx(
13013
- Form$2.Field,
13014
- {
13015
- control: form.control,
13016
- name: "province",
13017
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13018
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13019
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13020
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13021
- ] })
13022
- }
13023
- ),
13024
- /* @__PURE__ */ jsxRuntime.jsx(
13025
- Form$2.Field,
13026
- {
13027
- control: form.control,
13028
- name: "phone",
13029
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13030
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13031
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13032
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13033
- ] })
13034
- }
13035
- )
13036
- ] }) }),
13037
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13038
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13039
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13040
- ] }) })
13041
- ]
13042
- }
13043
- ) });
13035
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
13036
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
13037
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13038
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13039
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
13040
+ ] }) })
13041
+ ] }) });
13044
13042
  };
13045
- const schema = addressSchema;
13043
+ const schema = objectType({
13044
+ email: stringType().email()
13045
+ });
13046
13046
  const widgetModule = { widgets: [] };
13047
13047
  const routeModule = {
13048
13048
  routes: [
@@ -13063,6 +13063,10 @@ const routeModule = {
13063
13063
  handle,
13064
13064
  loader,
13065
13065
  children: [
13066
+ {
13067
+ Component: BillingAddress,
13068
+ path: "/draft-orders/:id/billing-address"
13069
+ },
13066
13070
  {
13067
13071
  Component: Email,
13068
13072
  path: "/draft-orders/:id/email"
@@ -13079,14 +13083,14 @@ const routeModule = {
13079
13083
  Component: Promotions,
13080
13084
  path: "/draft-orders/:id/promotions"
13081
13085
  },
13082
- {
13083
- Component: CustomItems,
13084
- path: "/draft-orders/:id/custom-items"
13085
- },
13086
13086
  {
13087
13087
  Component: SalesChannel,
13088
13088
  path: "/draft-orders/:id/sales-channel"
13089
13089
  },
13090
+ {
13091
+ Component: ShippingAddress,
13092
+ path: "/draft-orders/:id/shipping-address"
13093
+ },
13090
13094
  {
13091
13095
  Component: Shipping,
13092
13096
  path: "/draft-orders/:id/shipping"
@@ -13096,12 +13100,8 @@ const routeModule = {
13096
13100
  path: "/draft-orders/:id/transfer-ownership"
13097
13101
  },
13098
13102
  {
13099
- Component: ShippingAddress,
13100
- path: "/draft-orders/:id/shipping-address"
13101
- },
13102
- {
13103
- Component: BillingAddress,
13104
- path: "/draft-orders/:id/billing-address"
13103
+ Component: CustomItems,
13104
+ path: "/draft-orders/:id/custom-items"
13105
13105
  }
13106
13106
  ]
13107
13107
  }