@medusajs/draft-order 2.11.1-preview-20251023000334 → 2.11.1-preview-20251023031637

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 CustomItems = () => {
9575
9765
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9576
9766
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
@@ -9579,7 +9769,7 @@ const CustomItems = () => {
9579
9769
  };
9580
9770
  const CustomItemsForm = () => {
9581
9771
  const form = reactHookForm.useForm({
9582
- resolver: zod.zodResolver(schema$5)
9772
+ resolver: zod.zodResolver(schema$4)
9583
9773
  });
9584
9774
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9585
9775
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
@@ -9589,7 +9779,7 @@ const CustomItemsForm = () => {
9589
9779
  ] }) })
9590
9780
  ] }) });
9591
9781
  };
9592
- const schema$5 = objectType({
9782
+ const schema$4 = objectType({
9593
9783
  email: stringType().email()
9594
9784
  });
9595
9785
  const Email = () => {
@@ -9614,7 +9804,7 @@ const EmailForm = ({ order }) => {
9614
9804
  defaultValues: {
9615
9805
  email: order.email ?? ""
9616
9806
  },
9617
- resolver: zod.zodResolver(schema$4)
9807
+ resolver: zod.zodResolver(schema$3)
9618
9808
  });
9619
9809
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9620
9810
  const { handleSuccess } = useRouteModal();
@@ -9657,7 +9847,7 @@ const EmailForm = ({ order }) => {
9657
9847
  }
9658
9848
  ) });
9659
9849
  };
9660
- const schema$4 = objectType({
9850
+ const schema$3 = objectType({
9661
9851
  email: stringType().email()
9662
9852
  });
9663
9853
  const NumberInput = React.forwardRef(
@@ -10634,10 +10824,54 @@ const customItemSchema = objectType({
10634
10824
  quantity: numberType(),
10635
10825
  unit_price: unionType([numberType(), stringType()])
10636
10826
  });
10637
- const BillingAddress = () => {
10827
+ const InlineTip = React.forwardRef(
10828
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10829
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10830
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10831
+ "div",
10832
+ {
10833
+ ref,
10834
+ className: ui.clx(
10835
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10836
+ className
10837
+ ),
10838
+ ...props,
10839
+ children: [
10840
+ /* @__PURE__ */ jsxRuntime.jsx(
10841
+ "div",
10842
+ {
10843
+ role: "presentation",
10844
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10845
+ "bg-ui-tag-orange-icon": variant === "warning"
10846
+ })
10847
+ }
10848
+ ),
10849
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10850
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10851
+ labelValue,
10852
+ ":"
10853
+ ] }),
10854
+ " ",
10855
+ children
10856
+ ] })
10857
+ ]
10858
+ }
10859
+ );
10860
+ }
10861
+ );
10862
+ InlineTip.displayName = "InlineTip";
10863
+ const MetadataFieldSchema = objectType({
10864
+ key: stringType(),
10865
+ disabled: booleanType().optional(),
10866
+ value: anyType()
10867
+ });
10868
+ const MetadataSchema = objectType({
10869
+ metadata: arrayType(MetadataFieldSchema)
10870
+ });
10871
+ const Metadata = () => {
10638
10872
  const { id } = reactRouterDom.useParams();
10639
10873
  const { order, isPending, isError, error } = useOrder(id, {
10640
- fields: "+billing_address"
10874
+ fields: "metadata"
10641
10875
  });
10642
10876
  if (isError) {
10643
10877
  throw error;
@@ -10645,244 +10879,10 @@ const BillingAddress = () => {
10645
10879
  const isReady = !isPending && !!order;
10646
10880
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10647
10881
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10648
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
10649
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
10882
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10883
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10650
10884
  ] }),
10651
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
10652
- ] });
10653
- };
10654
- const BillingAddressForm = ({ order }) => {
10655
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
10656
- const form = reactHookForm.useForm({
10657
- defaultValues: {
10658
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
10659
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
10660
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
10661
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
10662
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
10663
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
10664
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
10665
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
10666
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
10667
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
10668
- },
10669
- resolver: zod.zodResolver(schema$3)
10670
- });
10671
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10672
- const { handleSuccess } = useRouteModal();
10673
- const onSubmit = form.handleSubmit(async (data) => {
10674
- await mutateAsync(
10675
- { billing_address: data },
10676
- {
10677
- onSuccess: () => {
10678
- handleSuccess();
10679
- },
10680
- onError: (error) => {
10681
- ui.toast.error(error.message);
10682
- }
10683
- }
10684
- );
10685
- });
10686
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10687
- KeyboundForm,
10688
- {
10689
- className: "flex flex-1 flex-col overflow-hidden",
10690
- onSubmit,
10691
- children: [
10692
- /* @__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: [
10693
- /* @__PURE__ */ jsxRuntime.jsx(
10694
- Form$2.Field,
10695
- {
10696
- control: form.control,
10697
- name: "country_code",
10698
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10699
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
10700
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
10701
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10702
- ] })
10703
- }
10704
- ),
10705
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10706
- /* @__PURE__ */ jsxRuntime.jsx(
10707
- Form$2.Field,
10708
- {
10709
- control: form.control,
10710
- name: "first_name",
10711
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10712
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
10713
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10714
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10715
- ] })
10716
- }
10717
- ),
10718
- /* @__PURE__ */ jsxRuntime.jsx(
10719
- Form$2.Field,
10720
- {
10721
- control: form.control,
10722
- name: "last_name",
10723
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10724
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
10725
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10726
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10727
- ] })
10728
- }
10729
- )
10730
- ] }),
10731
- /* @__PURE__ */ jsxRuntime.jsx(
10732
- Form$2.Field,
10733
- {
10734
- control: form.control,
10735
- name: "company",
10736
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10737
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
10738
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10739
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10740
- ] })
10741
- }
10742
- ),
10743
- /* @__PURE__ */ jsxRuntime.jsx(
10744
- Form$2.Field,
10745
- {
10746
- control: form.control,
10747
- name: "address_1",
10748
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10749
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
10750
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10751
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10752
- ] })
10753
- }
10754
- ),
10755
- /* @__PURE__ */ jsxRuntime.jsx(
10756
- Form$2.Field,
10757
- {
10758
- control: form.control,
10759
- name: "address_2",
10760
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10761
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
10762
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10763
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10764
- ] })
10765
- }
10766
- ),
10767
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10768
- /* @__PURE__ */ jsxRuntime.jsx(
10769
- Form$2.Field,
10770
- {
10771
- control: form.control,
10772
- name: "postal_code",
10773
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10774
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
10775
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10776
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10777
- ] })
10778
- }
10779
- ),
10780
- /* @__PURE__ */ jsxRuntime.jsx(
10781
- Form$2.Field,
10782
- {
10783
- control: form.control,
10784
- name: "city",
10785
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10786
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
10787
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10788
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10789
- ] })
10790
- }
10791
- )
10792
- ] }),
10793
- /* @__PURE__ */ jsxRuntime.jsx(
10794
- Form$2.Field,
10795
- {
10796
- control: form.control,
10797
- name: "province",
10798
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10799
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
10800
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10801
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10802
- ] })
10803
- }
10804
- ),
10805
- /* @__PURE__ */ jsxRuntime.jsx(
10806
- Form$2.Field,
10807
- {
10808
- control: form.control,
10809
- name: "phone",
10810
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10811
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
10812
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10813
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10814
- ] })
10815
- }
10816
- )
10817
- ] }) }),
10818
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10819
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10820
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10821
- ] }) })
10822
- ]
10823
- }
10824
- ) });
10825
- };
10826
- const schema$3 = addressSchema;
10827
- const InlineTip = React.forwardRef(
10828
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10829
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10830
- return /* @__PURE__ */ jsxRuntime.jsxs(
10831
- "div",
10832
- {
10833
- ref,
10834
- className: ui.clx(
10835
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10836
- className
10837
- ),
10838
- ...props,
10839
- children: [
10840
- /* @__PURE__ */ jsxRuntime.jsx(
10841
- "div",
10842
- {
10843
- role: "presentation",
10844
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10845
- "bg-ui-tag-orange-icon": variant === "warning"
10846
- })
10847
- }
10848
- ),
10849
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10850
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10851
- labelValue,
10852
- ":"
10853
- ] }),
10854
- " ",
10855
- children
10856
- ] })
10857
- ]
10858
- }
10859
- );
10860
- }
10861
- );
10862
- InlineTip.displayName = "InlineTip";
10863
- const MetadataFieldSchema = objectType({
10864
- key: stringType(),
10865
- disabled: booleanType().optional(),
10866
- value: anyType()
10867
- });
10868
- const MetadataSchema = objectType({
10869
- metadata: arrayType(MetadataFieldSchema)
10870
- });
10871
- const Metadata = () => {
10872
- const { id } = reactRouterDom.useParams();
10873
- const { order, isPending, isError, error } = useOrder(id, {
10874
- fields: "metadata"
10875
- });
10876
- if (isError) {
10877
- throw error;
10878
- }
10879
- const isReady = !isPending && !!order;
10880
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10881
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10882
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10883
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10884
- ] }),
10885
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10885
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10886
10886
  ] });
10887
10887
  };
10888
10888
  const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
@@ -11532,234 +11532,31 @@ const SalesChannelField = ({ control, order }) => {
11532
11532
  Form$2.Field,
11533
11533
  {
11534
11534
  control,
11535
- name: "sales_channel_id",
11536
- render: ({ field }) => {
11537
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11538
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11539
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11540
- Combobox,
11541
- {
11542
- options: salesChannels.options,
11543
- fetchNextPage: salesChannels.fetchNextPage,
11544
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11545
- searchValue: salesChannels.searchValue,
11546
- onSearchValueChange: salesChannels.onSearchValueChange,
11547
- placeholder: "Select sales channel",
11548
- ...field
11549
- }
11550
- ) }),
11551
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11552
- ] });
11553
- }
11554
- }
11555
- );
11556
- };
11557
- const schema$2 = objectType({
11558
- sales_channel_id: stringType().min(1)
11559
- });
11560
- const ShippingAddress = () => {
11561
- const { id } = reactRouterDom.useParams();
11562
- const { order, isPending, isError, error } = useOrder(id, {
11563
- fields: "+shipping_address"
11564
- });
11565
- if (isError) {
11566
- throw error;
11567
- }
11568
- const isReady = !isPending && !!order;
11569
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11570
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11571
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
11572
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11573
- ] }),
11574
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11575
- ] });
11576
- };
11577
- const ShippingAddressForm = ({ order }) => {
11578
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11579
- const form = reactHookForm.useForm({
11580
- defaultValues: {
11581
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11582
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11583
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11584
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11585
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11586
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11587
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11588
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11589
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11590
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11591
- },
11592
- resolver: zod.zodResolver(schema$1)
11593
- });
11594
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11595
- const { handleSuccess } = useRouteModal();
11596
- const onSubmit = form.handleSubmit(async (data) => {
11597
- await mutateAsync(
11598
- {
11599
- shipping_address: {
11600
- first_name: data.first_name,
11601
- last_name: data.last_name,
11602
- company: data.company,
11603
- address_1: data.address_1,
11604
- address_2: data.address_2,
11605
- city: data.city,
11606
- province: data.province,
11607
- country_code: data.country_code,
11608
- postal_code: data.postal_code,
11609
- phone: data.phone
11610
- }
11611
- },
11612
- {
11613
- onSuccess: () => {
11614
- handleSuccess();
11615
- },
11616
- onError: (error) => {
11617
- ui.toast.error(error.message);
11618
- }
11619
- }
11620
- );
11621
- });
11622
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11623
- KeyboundForm,
11624
- {
11625
- className: "flex flex-1 flex-col overflow-hidden",
11626
- onSubmit,
11627
- children: [
11628
- /* @__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: [
11629
- /* @__PURE__ */ jsxRuntime.jsx(
11630
- Form$2.Field,
11631
- {
11632
- control: form.control,
11633
- name: "country_code",
11634
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11635
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11636
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11637
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11638
- ] })
11639
- }
11640
- ),
11641
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11642
- /* @__PURE__ */ jsxRuntime.jsx(
11643
- Form$2.Field,
11644
- {
11645
- control: form.control,
11646
- name: "first_name",
11647
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11648
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11649
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11650
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11651
- ] })
11652
- }
11653
- ),
11654
- /* @__PURE__ */ jsxRuntime.jsx(
11655
- Form$2.Field,
11656
- {
11657
- control: form.control,
11658
- name: "last_name",
11659
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11660
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11661
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11662
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11663
- ] })
11664
- }
11665
- )
11666
- ] }),
11667
- /* @__PURE__ */ jsxRuntime.jsx(
11668
- Form$2.Field,
11669
- {
11670
- control: form.control,
11671
- name: "company",
11672
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11673
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11674
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11675
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11676
- ] })
11677
- }
11678
- ),
11679
- /* @__PURE__ */ jsxRuntime.jsx(
11680
- Form$2.Field,
11681
- {
11682
- control: form.control,
11683
- name: "address_1",
11684
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11685
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11686
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11687
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11688
- ] })
11689
- }
11690
- ),
11691
- /* @__PURE__ */ jsxRuntime.jsx(
11692
- Form$2.Field,
11693
- {
11694
- control: form.control,
11695
- name: "address_2",
11696
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11697
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11698
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11699
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11700
- ] })
11701
- }
11702
- ),
11703
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11704
- /* @__PURE__ */ jsxRuntime.jsx(
11705
- Form$2.Field,
11706
- {
11707
- control: form.control,
11708
- name: "postal_code",
11709
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11710
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11711
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11712
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11713
- ] })
11714
- }
11715
- ),
11716
- /* @__PURE__ */ jsxRuntime.jsx(
11717
- Form$2.Field,
11718
- {
11719
- control: form.control,
11720
- name: "city",
11721
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11722
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11723
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11724
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11725
- ] })
11726
- }
11727
- )
11728
- ] }),
11729
- /* @__PURE__ */ jsxRuntime.jsx(
11730
- Form$2.Field,
11731
- {
11732
- control: form.control,
11733
- name: "province",
11734
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11735
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11736
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11737
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11738
- ] })
11739
- }
11740
- ),
11741
- /* @__PURE__ */ jsxRuntime.jsx(
11742
- Form$2.Field,
11535
+ name: "sales_channel_id",
11536
+ render: ({ field }) => {
11537
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11538
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11539
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11540
+ Combobox,
11743
11541
  {
11744
- control: form.control,
11745
- name: "phone",
11746
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11747
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11748
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11749
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11750
- ] })
11542
+ options: salesChannels.options,
11543
+ fetchNextPage: salesChannels.fetchNextPage,
11544
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11545
+ searchValue: salesChannels.searchValue,
11546
+ onSearchValueChange: salesChannels.onSearchValueChange,
11547
+ placeholder: "Select sales channel",
11548
+ ...field
11751
11549
  }
11752
- )
11753
- ] }) }),
11754
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11755
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11756
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11757
- ] }) })
11758
- ]
11550
+ ) }),
11551
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11552
+ ] });
11553
+ }
11759
11554
  }
11760
- ) });
11555
+ );
11761
11556
  };
11762
- const schema$1 = addressSchema;
11557
+ const schema$2 = objectType({
11558
+ sales_channel_id: stringType().min(1)
11559
+ });
11763
11560
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11764
11561
  const Shipping = () => {
11765
11562
  var _a;
@@ -12567,6 +12364,209 @@ const CustomAmountField = ({
12567
12364
  }
12568
12365
  );
12569
12366
  };
12367
+ const ShippingAddress = () => {
12368
+ const { id } = reactRouterDom.useParams();
12369
+ const { order, isPending, isError, error } = useOrder(id, {
12370
+ fields: "+shipping_address"
12371
+ });
12372
+ if (isError) {
12373
+ throw error;
12374
+ }
12375
+ const isReady = !isPending && !!order;
12376
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12377
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12378
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12379
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12380
+ ] }),
12381
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12382
+ ] });
12383
+ };
12384
+ const ShippingAddressForm = ({ order }) => {
12385
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12386
+ const form = reactHookForm.useForm({
12387
+ defaultValues: {
12388
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12389
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12390
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12391
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12392
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12393
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12394
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12395
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12396
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12397
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12398
+ },
12399
+ resolver: zod.zodResolver(schema$1)
12400
+ });
12401
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12402
+ const { handleSuccess } = useRouteModal();
12403
+ const onSubmit = form.handleSubmit(async (data) => {
12404
+ await mutateAsync(
12405
+ {
12406
+ shipping_address: {
12407
+ first_name: data.first_name,
12408
+ last_name: data.last_name,
12409
+ company: data.company,
12410
+ address_1: data.address_1,
12411
+ address_2: data.address_2,
12412
+ city: data.city,
12413
+ province: data.province,
12414
+ country_code: data.country_code,
12415
+ postal_code: data.postal_code,
12416
+ phone: data.phone
12417
+ }
12418
+ },
12419
+ {
12420
+ onSuccess: () => {
12421
+ handleSuccess();
12422
+ },
12423
+ onError: (error) => {
12424
+ ui.toast.error(error.message);
12425
+ }
12426
+ }
12427
+ );
12428
+ });
12429
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12430
+ KeyboundForm,
12431
+ {
12432
+ className: "flex flex-1 flex-col overflow-hidden",
12433
+ onSubmit,
12434
+ children: [
12435
+ /* @__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: [
12436
+ /* @__PURE__ */ jsxRuntime.jsx(
12437
+ Form$2.Field,
12438
+ {
12439
+ control: form.control,
12440
+ name: "country_code",
12441
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12442
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12443
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12444
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12445
+ ] })
12446
+ }
12447
+ ),
12448
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12449
+ /* @__PURE__ */ jsxRuntime.jsx(
12450
+ Form$2.Field,
12451
+ {
12452
+ control: form.control,
12453
+ name: "first_name",
12454
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12455
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12456
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12457
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12458
+ ] })
12459
+ }
12460
+ ),
12461
+ /* @__PURE__ */ jsxRuntime.jsx(
12462
+ Form$2.Field,
12463
+ {
12464
+ control: form.control,
12465
+ name: "last_name",
12466
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12467
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12468
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12469
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12470
+ ] })
12471
+ }
12472
+ )
12473
+ ] }),
12474
+ /* @__PURE__ */ jsxRuntime.jsx(
12475
+ Form$2.Field,
12476
+ {
12477
+ control: form.control,
12478
+ name: "company",
12479
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12480
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12481
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12482
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12483
+ ] })
12484
+ }
12485
+ ),
12486
+ /* @__PURE__ */ jsxRuntime.jsx(
12487
+ Form$2.Field,
12488
+ {
12489
+ control: form.control,
12490
+ name: "address_1",
12491
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12492
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12493
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12494
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12495
+ ] })
12496
+ }
12497
+ ),
12498
+ /* @__PURE__ */ jsxRuntime.jsx(
12499
+ Form$2.Field,
12500
+ {
12501
+ control: form.control,
12502
+ name: "address_2",
12503
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12504
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12505
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12506
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12507
+ ] })
12508
+ }
12509
+ ),
12510
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12511
+ /* @__PURE__ */ jsxRuntime.jsx(
12512
+ Form$2.Field,
12513
+ {
12514
+ control: form.control,
12515
+ name: "postal_code",
12516
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12517
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12518
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12519
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12520
+ ] })
12521
+ }
12522
+ ),
12523
+ /* @__PURE__ */ jsxRuntime.jsx(
12524
+ Form$2.Field,
12525
+ {
12526
+ control: form.control,
12527
+ name: "city",
12528
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12529
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12530
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12531
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12532
+ ] })
12533
+ }
12534
+ )
12535
+ ] }),
12536
+ /* @__PURE__ */ jsxRuntime.jsx(
12537
+ Form$2.Field,
12538
+ {
12539
+ control: form.control,
12540
+ name: "province",
12541
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12542
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12543
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12544
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12545
+ ] })
12546
+ }
12547
+ ),
12548
+ /* @__PURE__ */ jsxRuntime.jsx(
12549
+ Form$2.Field,
12550
+ {
12551
+ control: form.control,
12552
+ name: "phone",
12553
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12554
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12555
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12556
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12557
+ ] })
12558
+ }
12559
+ )
12560
+ ] }) }),
12561
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12562
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12563
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12564
+ ] }) })
12565
+ ]
12566
+ }
12567
+ ) });
12568
+ };
12569
+ const schema$1 = addressSchema;
12570
12570
  const TransferOwnership = () => {
12571
12571
  const { id } = reactRouterDom.useParams();
12572
12572
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -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: CustomItems,
13068
13072
  path: "/draft-orders/:id/custom-items"
@@ -13075,10 +13079,6 @@ const routeModule = {
13075
13079
  Component: Items,
13076
13080
  path: "/draft-orders/:id/items"
13077
13081
  },
13078
- {
13079
- Component: BillingAddress,
13080
- path: "/draft-orders/:id/billing-address"
13081
- },
13082
13082
  {
13083
13083
  Component: Metadata,
13084
13084
  path: "/draft-orders/:id/metadata"
@@ -13091,14 +13091,14 @@ const routeModule = {
13091
13091
  Component: SalesChannel,
13092
13092
  path: "/draft-orders/:id/sales-channel"
13093
13093
  },
13094
- {
13095
- Component: ShippingAddress,
13096
- path: "/draft-orders/:id/shipping-address"
13097
- },
13098
13094
  {
13099
13095
  Component: Shipping,
13100
13096
  path: "/draft-orders/:id/shipping"
13101
13097
  },
13098
+ {
13099
+ Component: ShippingAddress,
13100
+ path: "/draft-orders/:id/shipping-address"
13101
+ },
13102
13102
  {
13103
13103
  Component: TransferOwnership,
13104
13104
  path: "/draft-orders/:id/transfer-ownership"