@medusajs/draft-order 2.10.0-preview-20250828090201 → 2.10.0-preview-20250828120155

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.
@@ -9560,196 +9560,6 @@ const ID = () => {
9560
9560
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9561
9561
  ] });
9562
9562
  };
9563
- const BillingAddress = () => {
9564
- const { id } = reactRouterDom.useParams();
9565
- const { order, isPending, isError, error } = useOrder(id, {
9566
- fields: "+billing_address"
9567
- });
9568
- if (isError) {
9569
- throw error;
9570
- }
9571
- const isReady = !isPending && !!order;
9572
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9573
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9574
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9575
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9576
- ] }),
9577
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9578
- ] });
9579
- };
9580
- const BillingAddressForm = ({ order }) => {
9581
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9582
- const form = reactHookForm.useForm({
9583
- defaultValues: {
9584
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9585
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9586
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9587
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9588
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9589
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9590
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9591
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9592
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9593
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9594
- },
9595
- resolver: zod.zodResolver(schema$5)
9596
- });
9597
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9598
- const { handleSuccess } = useRouteModal();
9599
- const onSubmit = form.handleSubmit(async (data) => {
9600
- await mutateAsync(
9601
- { billing_address: data },
9602
- {
9603
- onSuccess: () => {
9604
- handleSuccess();
9605
- },
9606
- onError: (error) => {
9607
- ui.toast.error(error.message);
9608
- }
9609
- }
9610
- );
9611
- });
9612
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9613
- KeyboundForm,
9614
- {
9615
- className: "flex flex-1 flex-col overflow-hidden",
9616
- onSubmit,
9617
- children: [
9618
- /* @__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: [
9619
- /* @__PURE__ */ jsxRuntime.jsx(
9620
- Form$2.Field,
9621
- {
9622
- control: form.control,
9623
- name: "country_code",
9624
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9625
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9626
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9627
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9628
- ] })
9629
- }
9630
- ),
9631
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9632
- /* @__PURE__ */ jsxRuntime.jsx(
9633
- Form$2.Field,
9634
- {
9635
- control: form.control,
9636
- name: "first_name",
9637
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9638
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9639
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9640
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9641
- ] })
9642
- }
9643
- ),
9644
- /* @__PURE__ */ jsxRuntime.jsx(
9645
- Form$2.Field,
9646
- {
9647
- control: form.control,
9648
- name: "last_name",
9649
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9650
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9651
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9652
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9653
- ] })
9654
- }
9655
- )
9656
- ] }),
9657
- /* @__PURE__ */ jsxRuntime.jsx(
9658
- Form$2.Field,
9659
- {
9660
- control: form.control,
9661
- name: "company",
9662
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9663
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9664
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9665
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9666
- ] })
9667
- }
9668
- ),
9669
- /* @__PURE__ */ jsxRuntime.jsx(
9670
- Form$2.Field,
9671
- {
9672
- control: form.control,
9673
- name: "address_1",
9674
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9675
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9676
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9677
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9678
- ] })
9679
- }
9680
- ),
9681
- /* @__PURE__ */ jsxRuntime.jsx(
9682
- Form$2.Field,
9683
- {
9684
- control: form.control,
9685
- name: "address_2",
9686
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9687
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9688
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9689
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9690
- ] })
9691
- }
9692
- ),
9693
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9694
- /* @__PURE__ */ jsxRuntime.jsx(
9695
- Form$2.Field,
9696
- {
9697
- control: form.control,
9698
- name: "postal_code",
9699
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9700
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9701
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9702
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9703
- ] })
9704
- }
9705
- ),
9706
- /* @__PURE__ */ jsxRuntime.jsx(
9707
- Form$2.Field,
9708
- {
9709
- control: form.control,
9710
- name: "city",
9711
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9712
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9713
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9714
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9715
- ] })
9716
- }
9717
- )
9718
- ] }),
9719
- /* @__PURE__ */ jsxRuntime.jsx(
9720
- Form$2.Field,
9721
- {
9722
- control: form.control,
9723
- name: "province",
9724
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9725
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9726
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9727
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9728
- ] })
9729
- }
9730
- ),
9731
- /* @__PURE__ */ jsxRuntime.jsx(
9732
- Form$2.Field,
9733
- {
9734
- control: form.control,
9735
- name: "phone",
9736
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9737
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9738
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9739
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9740
- ] })
9741
- }
9742
- )
9743
- ] }) }),
9744
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9745
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9746
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9747
- ] }) })
9748
- ]
9749
- }
9750
- ) });
9751
- };
9752
- const schema$5 = addressSchema;
9753
9563
  const CustomItems = () => {
9754
9564
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9755
9565
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
@@ -9758,7 +9568,7 @@ const CustomItems = () => {
9758
9568
  };
9759
9569
  const CustomItemsForm = () => {
9760
9570
  const form = reactHookForm.useForm({
9761
- resolver: zod.zodResolver(schema$4)
9571
+ resolver: zod.zodResolver(schema$5)
9762
9572
  });
9763
9573
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9764
9574
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
@@ -9768,7 +9578,7 @@ const CustomItemsForm = () => {
9768
9578
  ] }) })
9769
9579
  ] }) });
9770
9580
  };
9771
- const schema$4 = objectType({
9581
+ const schema$5 = objectType({
9772
9582
  email: stringType().email()
9773
9583
  });
9774
9584
  const NumberInput = React.forwardRef(
@@ -10767,7 +10577,7 @@ const EmailForm = ({ order }) => {
10767
10577
  defaultValues: {
10768
10578
  email: order.email ?? ""
10769
10579
  },
10770
- resolver: zod.zodResolver(schema$3)
10580
+ resolver: zod.zodResolver(schema$4)
10771
10581
  });
10772
10582
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10773
10583
  const { handleSuccess } = useRouteModal();
@@ -10810,57 +10620,13 @@ const EmailForm = ({ order }) => {
10810
10620
  }
10811
10621
  ) });
10812
10622
  };
10813
- const schema$3 = objectType({
10623
+ const schema$4 = objectType({
10814
10624
  email: stringType().email()
10815
10625
  });
10816
- const InlineTip = React.forwardRef(
10817
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10818
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10819
- return /* @__PURE__ */ jsxRuntime.jsxs(
10820
- "div",
10821
- {
10822
- ref,
10823
- className: ui.clx(
10824
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10825
- className
10826
- ),
10827
- ...props,
10828
- children: [
10829
- /* @__PURE__ */ jsxRuntime.jsx(
10830
- "div",
10831
- {
10832
- role: "presentation",
10833
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10834
- "bg-ui-tag-orange-icon": variant === "warning"
10835
- })
10836
- }
10837
- ),
10838
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10839
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10840
- labelValue,
10841
- ":"
10842
- ] }),
10843
- " ",
10844
- children
10845
- ] })
10846
- ]
10847
- }
10848
- );
10849
- }
10850
- );
10851
- InlineTip.displayName = "InlineTip";
10852
- const MetadataFieldSchema = objectType({
10853
- key: stringType(),
10854
- disabled: booleanType().optional(),
10855
- value: anyType()
10856
- });
10857
- const MetadataSchema = objectType({
10858
- metadata: arrayType(MetadataFieldSchema)
10859
- });
10860
- const Metadata = () => {
10626
+ const BillingAddress = () => {
10861
10627
  const { id } = reactRouterDom.useParams();
10862
10628
  const { order, isPending, isError, error } = useOrder(id, {
10863
- fields: "metadata"
10629
+ fields: "+billing_address"
10864
10630
  });
10865
10631
  if (isError) {
10866
10632
  throw error;
@@ -10868,19 +10634,253 @@ const Metadata = () => {
10868
10634
  const isReady = !isPending && !!order;
10869
10635
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10870
10636
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10871
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10872
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10637
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
10638
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
10873
10639
  ] }),
10874
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10640
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
10875
10641
  ] });
10876
10642
  };
10877
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10878
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10879
- const MetadataForm = ({ orderId, metadata }) => {
10880
- const { handleSuccess } = useRouteModal();
10881
- const hasUneditableRows = getHasUneditableRows(metadata);
10882
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10883
- const form = reactHookForm.useForm({
10643
+ const BillingAddressForm = ({ order }) => {
10644
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
10645
+ const form = reactHookForm.useForm({
10646
+ defaultValues: {
10647
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
10648
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
10649
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
10650
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
10651
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
10652
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
10653
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
10654
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
10655
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
10656
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
10657
+ },
10658
+ resolver: zod.zodResolver(schema$3)
10659
+ });
10660
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10661
+ const { handleSuccess } = useRouteModal();
10662
+ const onSubmit = form.handleSubmit(async (data) => {
10663
+ await mutateAsync(
10664
+ { billing_address: data },
10665
+ {
10666
+ onSuccess: () => {
10667
+ handleSuccess();
10668
+ },
10669
+ onError: (error) => {
10670
+ ui.toast.error(error.message);
10671
+ }
10672
+ }
10673
+ );
10674
+ });
10675
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10676
+ KeyboundForm,
10677
+ {
10678
+ className: "flex flex-1 flex-col overflow-hidden",
10679
+ onSubmit,
10680
+ children: [
10681
+ /* @__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: [
10682
+ /* @__PURE__ */ jsxRuntime.jsx(
10683
+ Form$2.Field,
10684
+ {
10685
+ control: form.control,
10686
+ name: "country_code",
10687
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
10689
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
10690
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10691
+ ] })
10692
+ }
10693
+ ),
10694
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10695
+ /* @__PURE__ */ jsxRuntime.jsx(
10696
+ Form$2.Field,
10697
+ {
10698
+ control: form.control,
10699
+ name: "first_name",
10700
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10701
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
10702
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10703
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10704
+ ] })
10705
+ }
10706
+ ),
10707
+ /* @__PURE__ */ jsxRuntime.jsx(
10708
+ Form$2.Field,
10709
+ {
10710
+ control: form.control,
10711
+ name: "last_name",
10712
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10713
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
10714
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10715
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10716
+ ] })
10717
+ }
10718
+ )
10719
+ ] }),
10720
+ /* @__PURE__ */ jsxRuntime.jsx(
10721
+ Form$2.Field,
10722
+ {
10723
+ control: form.control,
10724
+ name: "company",
10725
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10726
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
10727
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10728
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10729
+ ] })
10730
+ }
10731
+ ),
10732
+ /* @__PURE__ */ jsxRuntime.jsx(
10733
+ Form$2.Field,
10734
+ {
10735
+ control: form.control,
10736
+ name: "address_1",
10737
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10738
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
10739
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10740
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10741
+ ] })
10742
+ }
10743
+ ),
10744
+ /* @__PURE__ */ jsxRuntime.jsx(
10745
+ Form$2.Field,
10746
+ {
10747
+ control: form.control,
10748
+ name: "address_2",
10749
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10750
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
10751
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10752
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10753
+ ] })
10754
+ }
10755
+ ),
10756
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10757
+ /* @__PURE__ */ jsxRuntime.jsx(
10758
+ Form$2.Field,
10759
+ {
10760
+ control: form.control,
10761
+ name: "postal_code",
10762
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10763
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
10764
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10765
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10766
+ ] })
10767
+ }
10768
+ ),
10769
+ /* @__PURE__ */ jsxRuntime.jsx(
10770
+ Form$2.Field,
10771
+ {
10772
+ control: form.control,
10773
+ name: "city",
10774
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10775
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
10776
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10777
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10778
+ ] })
10779
+ }
10780
+ )
10781
+ ] }),
10782
+ /* @__PURE__ */ jsxRuntime.jsx(
10783
+ Form$2.Field,
10784
+ {
10785
+ control: form.control,
10786
+ name: "province",
10787
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10788
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
10789
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10790
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10791
+ ] })
10792
+ }
10793
+ ),
10794
+ /* @__PURE__ */ jsxRuntime.jsx(
10795
+ Form$2.Field,
10796
+ {
10797
+ control: form.control,
10798
+ name: "phone",
10799
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10800
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
10801
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10802
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10803
+ ] })
10804
+ }
10805
+ )
10806
+ ] }) }),
10807
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10808
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10809
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10810
+ ] }) })
10811
+ ]
10812
+ }
10813
+ ) });
10814
+ };
10815
+ const schema$3 = addressSchema;
10816
+ const InlineTip = React.forwardRef(
10817
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10818
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10819
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10820
+ "div",
10821
+ {
10822
+ ref,
10823
+ className: ui.clx(
10824
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10825
+ className
10826
+ ),
10827
+ ...props,
10828
+ children: [
10829
+ /* @__PURE__ */ jsxRuntime.jsx(
10830
+ "div",
10831
+ {
10832
+ role: "presentation",
10833
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10834
+ "bg-ui-tag-orange-icon": variant === "warning"
10835
+ })
10836
+ }
10837
+ ),
10838
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10839
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10840
+ labelValue,
10841
+ ":"
10842
+ ] }),
10843
+ " ",
10844
+ children
10845
+ ] })
10846
+ ]
10847
+ }
10848
+ );
10849
+ }
10850
+ );
10851
+ InlineTip.displayName = "InlineTip";
10852
+ const MetadataFieldSchema = objectType({
10853
+ key: stringType(),
10854
+ disabled: booleanType().optional(),
10855
+ value: anyType()
10856
+ });
10857
+ const MetadataSchema = objectType({
10858
+ metadata: arrayType(MetadataFieldSchema)
10859
+ });
10860
+ const Metadata = () => {
10861
+ const { id } = reactRouterDom.useParams();
10862
+ const { order, isPending, isError, error } = useOrder(id, {
10863
+ fields: "metadata"
10864
+ });
10865
+ if (isError) {
10866
+ throw error;
10867
+ }
10868
+ const isReady = !isPending && !!order;
10869
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10870
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10871
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10872
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10873
+ ] }),
10874
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10875
+ ] });
10876
+ };
10877
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10878
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10879
+ const MetadataForm = ({ orderId, metadata }) => {
10880
+ const { handleSuccess } = useRouteModal();
10881
+ const hasUneditableRows = getHasUneditableRows(metadata);
10882
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10883
+ const form = reactHookForm.useForm({
10884
10884
  defaultValues: {
10885
10885
  metadata: getDefaultValues(metadata)
10886
10886
  },
@@ -12353,224 +12353,21 @@ const CustomAmountField = ({
12353
12353
  }
12354
12354
  );
12355
12355
  };
12356
- const ShippingAddress = () => {
12356
+ const TransferOwnership = () => {
12357
12357
  const { id } = reactRouterDom.useParams();
12358
- const { order, isPending, isError, error } = useOrder(id, {
12359
- fields: "+shipping_address"
12358
+ const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12359
+ fields: "id,customer_id,customer.*"
12360
12360
  });
12361
12361
  if (isError) {
12362
12362
  throw error;
12363
12363
  }
12364
- const isReady = !isPending && !!order;
12364
+ const isReady = !isPending && !!draft_order;
12365
12365
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12366
12366
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12367
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12368
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12367
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
12368
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
12369
12369
  ] }),
12370
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12371
- ] });
12372
- };
12373
- const ShippingAddressForm = ({ order }) => {
12374
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12375
- const form = reactHookForm.useForm({
12376
- defaultValues: {
12377
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12378
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12379
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12380
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12381
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12382
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12383
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12384
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12385
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12386
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12387
- },
12388
- resolver: zod.zodResolver(schema$1)
12389
- });
12390
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12391
- const { handleSuccess } = useRouteModal();
12392
- const onSubmit = form.handleSubmit(async (data) => {
12393
- await mutateAsync(
12394
- {
12395
- shipping_address: {
12396
- first_name: data.first_name,
12397
- last_name: data.last_name,
12398
- company: data.company,
12399
- address_1: data.address_1,
12400
- address_2: data.address_2,
12401
- city: data.city,
12402
- province: data.province,
12403
- country_code: data.country_code,
12404
- postal_code: data.postal_code,
12405
- phone: data.phone
12406
- }
12407
- },
12408
- {
12409
- onSuccess: () => {
12410
- handleSuccess();
12411
- },
12412
- onError: (error) => {
12413
- ui.toast.error(error.message);
12414
- }
12415
- }
12416
- );
12417
- });
12418
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12419
- KeyboundForm,
12420
- {
12421
- className: "flex flex-1 flex-col overflow-hidden",
12422
- onSubmit,
12423
- children: [
12424
- /* @__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: [
12425
- /* @__PURE__ */ jsxRuntime.jsx(
12426
- Form$2.Field,
12427
- {
12428
- control: form.control,
12429
- name: "country_code",
12430
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12431
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12432
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12433
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12434
- ] })
12435
- }
12436
- ),
12437
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12438
- /* @__PURE__ */ jsxRuntime.jsx(
12439
- Form$2.Field,
12440
- {
12441
- control: form.control,
12442
- name: "first_name",
12443
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12444
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12445
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12446
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12447
- ] })
12448
- }
12449
- ),
12450
- /* @__PURE__ */ jsxRuntime.jsx(
12451
- Form$2.Field,
12452
- {
12453
- control: form.control,
12454
- name: "last_name",
12455
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12456
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12457
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12458
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12459
- ] })
12460
- }
12461
- )
12462
- ] }),
12463
- /* @__PURE__ */ jsxRuntime.jsx(
12464
- Form$2.Field,
12465
- {
12466
- control: form.control,
12467
- name: "company",
12468
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12469
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12470
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12471
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12472
- ] })
12473
- }
12474
- ),
12475
- /* @__PURE__ */ jsxRuntime.jsx(
12476
- Form$2.Field,
12477
- {
12478
- control: form.control,
12479
- name: "address_1",
12480
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12481
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12482
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12483
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12484
- ] })
12485
- }
12486
- ),
12487
- /* @__PURE__ */ jsxRuntime.jsx(
12488
- Form$2.Field,
12489
- {
12490
- control: form.control,
12491
- name: "address_2",
12492
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12493
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12494
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12495
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12496
- ] })
12497
- }
12498
- ),
12499
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12500
- /* @__PURE__ */ jsxRuntime.jsx(
12501
- Form$2.Field,
12502
- {
12503
- control: form.control,
12504
- name: "postal_code",
12505
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12506
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12507
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12508
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12509
- ] })
12510
- }
12511
- ),
12512
- /* @__PURE__ */ jsxRuntime.jsx(
12513
- Form$2.Field,
12514
- {
12515
- control: form.control,
12516
- name: "city",
12517
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12518
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12519
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12520
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12521
- ] })
12522
- }
12523
- )
12524
- ] }),
12525
- /* @__PURE__ */ jsxRuntime.jsx(
12526
- Form$2.Field,
12527
- {
12528
- control: form.control,
12529
- name: "province",
12530
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12531
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12532
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12533
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12534
- ] })
12535
- }
12536
- ),
12537
- /* @__PURE__ */ jsxRuntime.jsx(
12538
- Form$2.Field,
12539
- {
12540
- control: form.control,
12541
- name: "phone",
12542
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12543
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12544
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12545
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12546
- ] })
12547
- }
12548
- )
12549
- ] }) }),
12550
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12551
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12552
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12553
- ] }) })
12554
- ]
12555
- }
12556
- ) });
12557
- };
12558
- const schema$1 = addressSchema;
12559
- const TransferOwnership = () => {
12560
- const { id } = reactRouterDom.useParams();
12561
- const { draft_order, isPending, isError, error } = useDraftOrder(id, {
12562
- fields: "id,customer_id,customer.*"
12563
- });
12564
- if (isError) {
12565
- throw error;
12566
- }
12567
- const isReady = !isPending && !!draft_order;
12568
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12569
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12570
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Transfer Ownership" }) }),
12571
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Transfer the ownership of this draft order to a new customer" }) })
12572
- ] }),
12573
- isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
12370
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(TransferOwnershipForm, { order: draft_order })
12574
12371
  ] });
12575
12372
  };
12576
12373
  const TransferOwnershipForm = ({ order }) => {
@@ -12579,7 +12376,7 @@ const TransferOwnershipForm = ({ order }) => {
12579
12376
  defaultValues: {
12580
12377
  customer_id: order.customer_id || ""
12581
12378
  },
12582
- resolver: zod.zodResolver(schema)
12379
+ resolver: zod.zodResolver(schema$1)
12583
12380
  });
12584
12381
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12585
12382
  const { handleSuccess } = useRouteModal();
@@ -13029,9 +12826,212 @@ const Illustration = () => {
13029
12826
  }
13030
12827
  );
13031
12828
  };
13032
- const schema = objectType({
12829
+ const schema$1 = objectType({
13033
12830
  customer_id: stringType().min(1)
13034
12831
  });
12832
+ const ShippingAddress = () => {
12833
+ const { id } = reactRouterDom.useParams();
12834
+ const { order, isPending, isError, error } = useOrder(id, {
12835
+ fields: "+shipping_address"
12836
+ });
12837
+ if (isError) {
12838
+ throw error;
12839
+ }
12840
+ const isReady = !isPending && !!order;
12841
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12842
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12843
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12844
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12845
+ ] }),
12846
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12847
+ ] });
12848
+ };
12849
+ const ShippingAddressForm = ({ order }) => {
12850
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12851
+ const form = reactHookForm.useForm({
12852
+ defaultValues: {
12853
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12854
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12855
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12856
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12857
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12858
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12859
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12860
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12861
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12862
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12863
+ },
12864
+ resolver: zod.zodResolver(schema)
12865
+ });
12866
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12867
+ const { handleSuccess } = useRouteModal();
12868
+ const onSubmit = form.handleSubmit(async (data) => {
12869
+ await mutateAsync(
12870
+ {
12871
+ shipping_address: {
12872
+ first_name: data.first_name,
12873
+ last_name: data.last_name,
12874
+ company: data.company,
12875
+ address_1: data.address_1,
12876
+ address_2: data.address_2,
12877
+ city: data.city,
12878
+ province: data.province,
12879
+ country_code: data.country_code,
12880
+ postal_code: data.postal_code,
12881
+ phone: data.phone
12882
+ }
12883
+ },
12884
+ {
12885
+ onSuccess: () => {
12886
+ handleSuccess();
12887
+ },
12888
+ onError: (error) => {
12889
+ ui.toast.error(error.message);
12890
+ }
12891
+ }
12892
+ );
12893
+ });
12894
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12895
+ KeyboundForm,
12896
+ {
12897
+ className: "flex flex-1 flex-col overflow-hidden",
12898
+ onSubmit,
12899
+ children: [
12900
+ /* @__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: [
12901
+ /* @__PURE__ */ jsxRuntime.jsx(
12902
+ Form$2.Field,
12903
+ {
12904
+ control: form.control,
12905
+ name: "country_code",
12906
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12907
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12908
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12909
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12910
+ ] })
12911
+ }
12912
+ ),
12913
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12914
+ /* @__PURE__ */ jsxRuntime.jsx(
12915
+ Form$2.Field,
12916
+ {
12917
+ control: form.control,
12918
+ name: "first_name",
12919
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12920
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12921
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12922
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12923
+ ] })
12924
+ }
12925
+ ),
12926
+ /* @__PURE__ */ jsxRuntime.jsx(
12927
+ Form$2.Field,
12928
+ {
12929
+ control: form.control,
12930
+ name: "last_name",
12931
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12932
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12933
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12934
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12935
+ ] })
12936
+ }
12937
+ )
12938
+ ] }),
12939
+ /* @__PURE__ */ jsxRuntime.jsx(
12940
+ Form$2.Field,
12941
+ {
12942
+ control: form.control,
12943
+ name: "company",
12944
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12945
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12946
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12947
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12948
+ ] })
12949
+ }
12950
+ ),
12951
+ /* @__PURE__ */ jsxRuntime.jsx(
12952
+ Form$2.Field,
12953
+ {
12954
+ control: form.control,
12955
+ name: "address_1",
12956
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12957
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12958
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12959
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12960
+ ] })
12961
+ }
12962
+ ),
12963
+ /* @__PURE__ */ jsxRuntime.jsx(
12964
+ Form$2.Field,
12965
+ {
12966
+ control: form.control,
12967
+ name: "address_2",
12968
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12969
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12970
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12971
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12972
+ ] })
12973
+ }
12974
+ ),
12975
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12976
+ /* @__PURE__ */ jsxRuntime.jsx(
12977
+ Form$2.Field,
12978
+ {
12979
+ control: form.control,
12980
+ name: "postal_code",
12981
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12982
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12983
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12984
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12985
+ ] })
12986
+ }
12987
+ ),
12988
+ /* @__PURE__ */ jsxRuntime.jsx(
12989
+ Form$2.Field,
12990
+ {
12991
+ control: form.control,
12992
+ name: "city",
12993
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12994
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12995
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12996
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12997
+ ] })
12998
+ }
12999
+ )
13000
+ ] }),
13001
+ /* @__PURE__ */ jsxRuntime.jsx(
13002
+ Form$2.Field,
13003
+ {
13004
+ control: form.control,
13005
+ name: "province",
13006
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13007
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13008
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13009
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13010
+ ] })
13011
+ }
13012
+ ),
13013
+ /* @__PURE__ */ jsxRuntime.jsx(
13014
+ Form$2.Field,
13015
+ {
13016
+ control: form.control,
13017
+ name: "phone",
13018
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13019
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13020
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13021
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13022
+ ] })
13023
+ }
13024
+ )
13025
+ ] }) }),
13026
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13027
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13028
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13029
+ ] }) })
13030
+ ]
13031
+ }
13032
+ ) });
13033
+ };
13034
+ const schema = addressSchema;
13035
13035
  const widgetModule = { widgets: [] };
13036
13036
  const routeModule = {
13037
13037
  routes: [
@@ -13052,10 +13052,6 @@ const routeModule = {
13052
13052
  handle,
13053
13053
  loader,
13054
13054
  children: [
13055
- {
13056
- Component: BillingAddress,
13057
- path: "/draft-orders/:id/billing-address"
13058
- },
13059
13055
  {
13060
13056
  Component: CustomItems,
13061
13057
  path: "/draft-orders/:id/custom-items"
@@ -13068,6 +13064,10 @@ const routeModule = {
13068
13064
  Component: Email,
13069
13065
  path: "/draft-orders/:id/email"
13070
13066
  },
13067
+ {
13068
+ Component: BillingAddress,
13069
+ path: "/draft-orders/:id/billing-address"
13070
+ },
13071
13071
  {
13072
13072
  Component: Metadata,
13073
13073
  path: "/draft-orders/:id/metadata"
@@ -13084,13 +13084,13 @@ const routeModule = {
13084
13084
  Component: Shipping,
13085
13085
  path: "/draft-orders/:id/shipping"
13086
13086
  },
13087
- {
13088
- Component: ShippingAddress,
13089
- path: "/draft-orders/:id/shipping-address"
13090
- },
13091
13087
  {
13092
13088
  Component: TransferOwnership,
13093
13089
  path: "/draft-orders/:id/transfer-ownership"
13090
+ },
13091
+ {
13092
+ Component: ShippingAddress,
13093
+ path: "/draft-orders/:id/shipping-address"
13094
13094
  }
13095
13095
  ]
13096
13096
  }