@medusajs/draft-order 2.10.4-snapshot-20250922165717 → 2.10.4-snapshot-20250922195925

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.
@@ -9567,95 +9567,6 @@ const ID = () => {
9567
9567
  /* @__PURE__ */ jsx(Outlet, {})
9568
9568
  ] });
9569
9569
  };
9570
- const CustomItems = () => {
9571
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9572
- /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
9573
- /* @__PURE__ */ jsx(CustomItemsForm, {})
9574
- ] });
9575
- };
9576
- const CustomItemsForm = () => {
9577
- const form = useForm({
9578
- resolver: zodResolver(schema$5)
9579
- });
9580
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9581
- /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
9582
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9583
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9584
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", children: "Save" })
9585
- ] }) })
9586
- ] }) });
9587
- };
9588
- const schema$5 = objectType({
9589
- email: stringType().email()
9590
- });
9591
- const Email = () => {
9592
- const { id } = useParams();
9593
- const { order, isPending, isError, error } = useOrder(id, {
9594
- fields: "+email"
9595
- });
9596
- if (isError) {
9597
- throw error;
9598
- }
9599
- const isReady = !isPending && !!order;
9600
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9601
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
9602
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Email" }) }),
9603
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9604
- ] }),
9605
- isReady && /* @__PURE__ */ jsx(EmailForm, { order })
9606
- ] });
9607
- };
9608
- const EmailForm = ({ order }) => {
9609
- const form = useForm({
9610
- defaultValues: {
9611
- email: order.email ?? ""
9612
- },
9613
- resolver: zodResolver(schema$4)
9614
- });
9615
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9616
- const { handleSuccess } = useRouteModal();
9617
- const onSubmit = form.handleSubmit(async (data) => {
9618
- await mutateAsync(
9619
- { email: data.email },
9620
- {
9621
- onSuccess: () => {
9622
- handleSuccess();
9623
- },
9624
- onError: (error) => {
9625
- toast.error(error.message);
9626
- }
9627
- }
9628
- );
9629
- });
9630
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
9631
- KeyboundForm,
9632
- {
9633
- className: "flex flex-1 flex-col overflow-hidden",
9634
- onSubmit,
9635
- children: [
9636
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(
9637
- Form$2.Field,
9638
- {
9639
- control: form.control,
9640
- name: "email",
9641
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9642
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Email" }),
9643
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9644
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9645
- ] })
9646
- }
9647
- ) }),
9648
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9649
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9650
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9651
- ] }) })
9652
- ]
9653
- }
9654
- ) });
9655
- };
9656
- const schema$4 = objectType({
9657
- email: stringType().email()
9658
- });
9659
9570
  const BillingAddress = () => {
9660
9571
  const { id } = useParams();
9661
9572
  const { order, isPending, isError, error } = useOrder(id, {
@@ -9688,7 +9599,7 @@ const BillingAddressForm = ({ order }) => {
9688
9599
  postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9689
9600
  phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9690
9601
  },
9691
- resolver: zodResolver(schema$3)
9602
+ resolver: zodResolver(schema$5)
9692
9603
  });
9693
9604
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9694
9605
  const { handleSuccess } = useRouteModal();
@@ -9845,7 +9756,96 @@ const BillingAddressForm = ({ order }) => {
9845
9756
  }
9846
9757
  ) });
9847
9758
  };
9848
- const schema$3 = addressSchema;
9759
+ const schema$5 = addressSchema;
9760
+ const CustomItems = () => {
9761
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9762
+ /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
9763
+ /* @__PURE__ */ jsx(CustomItemsForm, {})
9764
+ ] });
9765
+ };
9766
+ const CustomItemsForm = () => {
9767
+ const form = useForm({
9768
+ resolver: zodResolver(schema$4)
9769
+ });
9770
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9771
+ /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
9772
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9773
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9774
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", children: "Save" })
9775
+ ] }) })
9776
+ ] }) });
9777
+ };
9778
+ const schema$4 = objectType({
9779
+ email: stringType().email()
9780
+ });
9781
+ const Email = () => {
9782
+ const { id } = useParams();
9783
+ const { order, isPending, isError, error } = useOrder(id, {
9784
+ fields: "+email"
9785
+ });
9786
+ if (isError) {
9787
+ throw error;
9788
+ }
9789
+ const isReady = !isPending && !!order;
9790
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9791
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
9792
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Email" }) }),
9793
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9794
+ ] }),
9795
+ isReady && /* @__PURE__ */ jsx(EmailForm, { order })
9796
+ ] });
9797
+ };
9798
+ const EmailForm = ({ order }) => {
9799
+ const form = useForm({
9800
+ defaultValues: {
9801
+ email: order.email ?? ""
9802
+ },
9803
+ resolver: zodResolver(schema$3)
9804
+ });
9805
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9806
+ const { handleSuccess } = useRouteModal();
9807
+ const onSubmit = form.handleSubmit(async (data) => {
9808
+ await mutateAsync(
9809
+ { email: data.email },
9810
+ {
9811
+ onSuccess: () => {
9812
+ handleSuccess();
9813
+ },
9814
+ onError: (error) => {
9815
+ toast.error(error.message);
9816
+ }
9817
+ }
9818
+ );
9819
+ });
9820
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
9821
+ KeyboundForm,
9822
+ {
9823
+ className: "flex flex-1 flex-col overflow-hidden",
9824
+ onSubmit,
9825
+ children: [
9826
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(
9827
+ Form$2.Field,
9828
+ {
9829
+ control: form.control,
9830
+ name: "email",
9831
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9832
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Email" }),
9833
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9834
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9835
+ ] })
9836
+ }
9837
+ ) }),
9838
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9839
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9840
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9841
+ ] }) })
9842
+ ]
9843
+ }
9844
+ ) });
9845
+ };
9846
+ const schema$3 = objectType({
9847
+ email: stringType().email()
9848
+ });
9849
9849
  const NumberInput = forwardRef(
9850
9850
  ({
9851
9851
  value,
@@ -11553,254 +11553,51 @@ const SalesChannelField = ({ control, order }) => {
11553
11553
  const schema$2 = objectType({
11554
11554
  sales_channel_id: stringType().min(1)
11555
11555
  });
11556
- const ShippingAddress = () => {
11556
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11557
+ const Shipping = () => {
11558
+ var _a;
11557
11559
  const { id } = useParams();
11558
11560
  const { order, isPending, isError, error } = useOrder(id, {
11559
- fields: "+shipping_address"
11561
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11560
11562
  });
11563
+ const {
11564
+ order: preview,
11565
+ isPending: isPreviewPending,
11566
+ isError: isPreviewError,
11567
+ error: previewError
11568
+ } = useOrderPreview(id);
11569
+ useInitiateOrderEdit({ preview });
11570
+ const { onCancel } = useCancelOrderEdit({ preview });
11561
11571
  if (isError) {
11562
11572
  throw error;
11563
11573
  }
11564
- const isReady = !isPending && !!order;
11565
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11566
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11567
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
11568
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11569
- ] }),
11570
- isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
11571
- ] });
11574
+ if (isPreviewError) {
11575
+ throw previewError;
11576
+ }
11577
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11578
+ const isReady = preview && !isPreviewPending && order && !isPending;
11579
+ return /* @__PURE__ */ jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11580
+ /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
11581
+ /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11582
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11583
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11584
+ ] }) }) }),
11585
+ /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11586
+ ] }) : isReady ? /* @__PURE__ */ jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxs("div", { children: [
11587
+ /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11588
+ /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11589
+ ] }) });
11572
11590
  };
11573
- const ShippingAddressForm = ({ order }) => {
11574
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11575
- const form = useForm({
11576
- defaultValues: {
11577
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11578
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11579
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11580
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11581
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11582
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11583
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11584
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11585
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11586
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11587
- },
11588
- resolver: zodResolver(schema$1)
11589
- });
11590
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11591
- const { handleSuccess } = useRouteModal();
11592
- const onSubmit = form.handleSubmit(async (data) => {
11593
- await mutateAsync(
11594
- {
11595
- shipping_address: {
11596
- first_name: data.first_name,
11597
- last_name: data.last_name,
11598
- company: data.company,
11599
- address_1: data.address_1,
11600
- address_2: data.address_2,
11601
- city: data.city,
11602
- province: data.province,
11603
- country_code: data.country_code,
11604
- postal_code: data.postal_code,
11605
- phone: data.phone
11606
- }
11607
- },
11608
- {
11609
- onSuccess: () => {
11610
- handleSuccess();
11611
- },
11612
- onError: (error) => {
11613
- toast.error(error.message);
11614
- }
11615
- }
11616
- );
11617
- });
11618
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11619
- KeyboundForm,
11620
- {
11621
- className: "flex flex-1 flex-col overflow-hidden",
11622
- onSubmit,
11623
- children: [
11624
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
11625
- /* @__PURE__ */ jsx(
11626
- Form$2.Field,
11627
- {
11628
- control: form.control,
11629
- name: "country_code",
11630
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11631
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
11632
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
11633
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11634
- ] })
11635
- }
11636
- ),
11637
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11638
- /* @__PURE__ */ jsx(
11639
- Form$2.Field,
11640
- {
11641
- control: form.control,
11642
- name: "first_name",
11643
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11644
- /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
11645
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11646
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11647
- ] })
11648
- }
11649
- ),
11650
- /* @__PURE__ */ jsx(
11651
- Form$2.Field,
11652
- {
11653
- control: form.control,
11654
- name: "last_name",
11655
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11656
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
11657
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11658
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11659
- ] })
11660
- }
11661
- )
11662
- ] }),
11663
- /* @__PURE__ */ jsx(
11664
- Form$2.Field,
11665
- {
11666
- control: form.control,
11667
- name: "company",
11668
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11669
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
11670
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11671
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11672
- ] })
11673
- }
11674
- ),
11675
- /* @__PURE__ */ jsx(
11676
- Form$2.Field,
11677
- {
11678
- control: form.control,
11679
- name: "address_1",
11680
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11681
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
11682
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11683
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11684
- ] })
11685
- }
11686
- ),
11687
- /* @__PURE__ */ jsx(
11688
- Form$2.Field,
11689
- {
11690
- control: form.control,
11691
- name: "address_2",
11692
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11693
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11694
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11695
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11696
- ] })
11697
- }
11698
- ),
11699
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11700
- /* @__PURE__ */ jsx(
11701
- Form$2.Field,
11702
- {
11703
- control: form.control,
11704
- name: "postal_code",
11705
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11706
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
11707
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11708
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11709
- ] })
11710
- }
11711
- ),
11712
- /* @__PURE__ */ jsx(
11713
- Form$2.Field,
11714
- {
11715
- control: form.control,
11716
- name: "city",
11717
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11718
- /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
11719
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11720
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11721
- ] })
11722
- }
11723
- )
11724
- ] }),
11725
- /* @__PURE__ */ jsx(
11726
- Form$2.Field,
11727
- {
11728
- control: form.control,
11729
- name: "province",
11730
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11731
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11732
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11733
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11734
- ] })
11735
- }
11736
- ),
11737
- /* @__PURE__ */ jsx(
11738
- Form$2.Field,
11739
- {
11740
- control: form.control,
11741
- name: "phone",
11742
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11743
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
11744
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11745
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11746
- ] })
11747
- }
11748
- )
11749
- ] }) }),
11750
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11751
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11752
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11753
- ] }) })
11754
- ]
11755
- }
11756
- ) });
11757
- };
11758
- const schema$1 = addressSchema;
11759
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11760
- const Shipping = () => {
11761
- var _a;
11762
- const { id } = useParams();
11763
- const { order, isPending, isError, error } = useOrder(id, {
11764
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11765
- });
11766
- const {
11767
- order: preview,
11768
- isPending: isPreviewPending,
11769
- isError: isPreviewError,
11770
- error: previewError
11771
- } = useOrderPreview(id);
11772
- useInitiateOrderEdit({ preview });
11773
- const { onCancel } = useCancelOrderEdit({ preview });
11774
- if (isError) {
11775
- throw error;
11776
- }
11777
- if (isPreviewError) {
11778
- throw previewError;
11779
- }
11780
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11781
- const isReady = preview && !isPreviewPending && order && !isPending;
11782
- return /* @__PURE__ */ jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11783
- /* @__PURE__ */ jsx(RouteFocusModal.Header, {}),
11784
- /* @__PURE__ */ jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11785
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Shipping" }) }),
11786
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11787
- ] }) }) }),
11788
- /* @__PURE__ */ jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11789
- ] }) : isReady ? /* @__PURE__ */ jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxs("div", { children: [
11790
- /* @__PURE__ */ jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11791
- /* @__PURE__ */ jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11792
- ] }) });
11793
- };
11794
- const ShippingForm = ({ preview, order }) => {
11795
- var _a;
11796
- const { setIsOpen } = useStackedModal();
11797
- const [isSubmitting, setIsSubmitting] = useState(false);
11798
- const [data, setData] = useState(null);
11799
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11800
- const { shipping_options } = useShippingOptions(
11801
- {
11802
- id: appliedShippingOptionIds,
11803
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11591
+ const ShippingForm = ({ preview, order }) => {
11592
+ var _a;
11593
+ const { setIsOpen } = useStackedModal();
11594
+ const [isSubmitting, setIsSubmitting] = useState(false);
11595
+ const [data, setData] = useState(null);
11596
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11597
+ const { shipping_options } = useShippingOptions(
11598
+ {
11599
+ id: appliedShippingOptionIds,
11600
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11804
11601
  },
11805
11602
  {
11806
11603
  enabled: appliedShippingOptionIds.length > 0
@@ -12563,6 +12360,209 @@ const CustomAmountField = ({
12563
12360
  }
12564
12361
  );
12565
12362
  };
12363
+ const ShippingAddress = () => {
12364
+ const { id } = useParams();
12365
+ const { order, isPending, isError, error } = useOrder(id, {
12366
+ fields: "+shipping_address"
12367
+ });
12368
+ if (isError) {
12369
+ throw error;
12370
+ }
12371
+ const isReady = !isPending && !!order;
12372
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12373
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12374
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
12375
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12376
+ ] }),
12377
+ isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
12378
+ ] });
12379
+ };
12380
+ const ShippingAddressForm = ({ order }) => {
12381
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12382
+ const form = useForm({
12383
+ defaultValues: {
12384
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12385
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12386
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12387
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12388
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12389
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12390
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12391
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12392
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12393
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12394
+ },
12395
+ resolver: zodResolver(schema$1)
12396
+ });
12397
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12398
+ const { handleSuccess } = useRouteModal();
12399
+ const onSubmit = form.handleSubmit(async (data) => {
12400
+ await mutateAsync(
12401
+ {
12402
+ shipping_address: {
12403
+ first_name: data.first_name,
12404
+ last_name: data.last_name,
12405
+ company: data.company,
12406
+ address_1: data.address_1,
12407
+ address_2: data.address_2,
12408
+ city: data.city,
12409
+ province: data.province,
12410
+ country_code: data.country_code,
12411
+ postal_code: data.postal_code,
12412
+ phone: data.phone
12413
+ }
12414
+ },
12415
+ {
12416
+ onSuccess: () => {
12417
+ handleSuccess();
12418
+ },
12419
+ onError: (error) => {
12420
+ toast.error(error.message);
12421
+ }
12422
+ }
12423
+ );
12424
+ });
12425
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12426
+ KeyboundForm,
12427
+ {
12428
+ className: "flex flex-1 flex-col overflow-hidden",
12429
+ onSubmit,
12430
+ children: [
12431
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
12432
+ /* @__PURE__ */ jsx(
12433
+ Form$2.Field,
12434
+ {
12435
+ control: form.control,
12436
+ name: "country_code",
12437
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12438
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
12439
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
12440
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12441
+ ] })
12442
+ }
12443
+ ),
12444
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12445
+ /* @__PURE__ */ jsx(
12446
+ Form$2.Field,
12447
+ {
12448
+ control: form.control,
12449
+ name: "first_name",
12450
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12451
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
12452
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12453
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12454
+ ] })
12455
+ }
12456
+ ),
12457
+ /* @__PURE__ */ jsx(
12458
+ Form$2.Field,
12459
+ {
12460
+ control: form.control,
12461
+ name: "last_name",
12462
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12463
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
12464
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12465
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12466
+ ] })
12467
+ }
12468
+ )
12469
+ ] }),
12470
+ /* @__PURE__ */ jsx(
12471
+ Form$2.Field,
12472
+ {
12473
+ control: form.control,
12474
+ name: "company",
12475
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12476
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
12477
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12478
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12479
+ ] })
12480
+ }
12481
+ ),
12482
+ /* @__PURE__ */ jsx(
12483
+ Form$2.Field,
12484
+ {
12485
+ control: form.control,
12486
+ name: "address_1",
12487
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12488
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
12489
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12490
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12491
+ ] })
12492
+ }
12493
+ ),
12494
+ /* @__PURE__ */ jsx(
12495
+ Form$2.Field,
12496
+ {
12497
+ control: form.control,
12498
+ name: "address_2",
12499
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12500
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12501
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12502
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12503
+ ] })
12504
+ }
12505
+ ),
12506
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12507
+ /* @__PURE__ */ jsx(
12508
+ Form$2.Field,
12509
+ {
12510
+ control: form.control,
12511
+ name: "postal_code",
12512
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12513
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
12514
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12515
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12516
+ ] })
12517
+ }
12518
+ ),
12519
+ /* @__PURE__ */ jsx(
12520
+ Form$2.Field,
12521
+ {
12522
+ control: form.control,
12523
+ name: "city",
12524
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12525
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
12526
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12527
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12528
+ ] })
12529
+ }
12530
+ )
12531
+ ] }),
12532
+ /* @__PURE__ */ jsx(
12533
+ Form$2.Field,
12534
+ {
12535
+ control: form.control,
12536
+ name: "province",
12537
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12538
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12539
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12540
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12541
+ ] })
12542
+ }
12543
+ ),
12544
+ /* @__PURE__ */ jsx(
12545
+ Form$2.Field,
12546
+ {
12547
+ control: form.control,
12548
+ name: "phone",
12549
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12550
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
12551
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12552
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12553
+ ] })
12554
+ }
12555
+ )
12556
+ ] }) }),
12557
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
12558
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12559
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12560
+ ] }) })
12561
+ ]
12562
+ }
12563
+ ) });
12564
+ };
12565
+ const schema$1 = addressSchema;
12566
12566
  const TransferOwnership = () => {
12567
12567
  const { id } = useParams();
12568
12568
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -13059,6 +13059,10 @@ const routeModule = {
13059
13059
  handle,
13060
13060
  loader,
13061
13061
  children: [
13062
+ {
13063
+ Component: BillingAddress,
13064
+ path: "/draft-orders/:id/billing-address"
13065
+ },
13062
13066
  {
13063
13067
  Component: CustomItems,
13064
13068
  path: "/draft-orders/:id/custom-items"
@@ -13067,10 +13071,6 @@ const routeModule = {
13067
13071
  Component: Email,
13068
13072
  path: "/draft-orders/:id/email"
13069
13073
  },
13070
- {
13071
- Component: BillingAddress,
13072
- path: "/draft-orders/:id/billing-address"
13073
- },
13074
13074
  {
13075
13075
  Component: Items,
13076
13076
  path: "/draft-orders/:id/items"
@@ -13087,14 +13087,14 @@ const routeModule = {
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
- },
13094
13090
  {
13095
13091
  Component: Shipping,
13096
13092
  path: "/draft-orders/:id/shipping"
13097
13093
  },
13094
+ {
13095
+ Component: ShippingAddress,
13096
+ path: "/draft-orders/:id/shipping-address"
13097
+ },
13098
13098
  {
13099
13099
  Component: TransferOwnership,
13100
13100
  path: "/draft-orders/:id/transfer-ownership"