@medusajs/draft-order 2.10.4-preview-20250922150158 → 2.10.4-preview-20250922210211

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.
@@ -9594,6 +9594,196 @@ const CustomItemsForm = () => {
9594
9594
  const schema$5 = objectType({
9595
9595
  email: stringType().email()
9596
9596
  });
9597
+ const BillingAddress = () => {
9598
+ const { id } = reactRouterDom.useParams();
9599
+ const { order, isPending, isError, error } = useOrder(id, {
9600
+ fields: "+billing_address"
9601
+ });
9602
+ if (isError) {
9603
+ throw error;
9604
+ }
9605
+ const isReady = !isPending && !!order;
9606
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9607
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9608
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9609
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9610
+ ] }),
9611
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9612
+ ] });
9613
+ };
9614
+ const BillingAddressForm = ({ order }) => {
9615
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9616
+ const form = reactHookForm.useForm({
9617
+ defaultValues: {
9618
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9619
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9620
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9621
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9622
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9623
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9624
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9625
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9626
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9627
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9628
+ },
9629
+ resolver: zod.zodResolver(schema$4)
9630
+ });
9631
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9632
+ const { handleSuccess } = useRouteModal();
9633
+ const onSubmit = form.handleSubmit(async (data) => {
9634
+ await mutateAsync(
9635
+ { billing_address: data },
9636
+ {
9637
+ onSuccess: () => {
9638
+ handleSuccess();
9639
+ },
9640
+ onError: (error) => {
9641
+ ui.toast.error(error.message);
9642
+ }
9643
+ }
9644
+ );
9645
+ });
9646
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9647
+ KeyboundForm,
9648
+ {
9649
+ className: "flex flex-1 flex-col overflow-hidden",
9650
+ onSubmit,
9651
+ children: [
9652
+ /* @__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: [
9653
+ /* @__PURE__ */ jsxRuntime.jsx(
9654
+ Form$2.Field,
9655
+ {
9656
+ control: form.control,
9657
+ name: "country_code",
9658
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9659
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9660
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9661
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9662
+ ] })
9663
+ }
9664
+ ),
9665
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9666
+ /* @__PURE__ */ jsxRuntime.jsx(
9667
+ Form$2.Field,
9668
+ {
9669
+ control: form.control,
9670
+ name: "first_name",
9671
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9672
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9673
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9674
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9675
+ ] })
9676
+ }
9677
+ ),
9678
+ /* @__PURE__ */ jsxRuntime.jsx(
9679
+ Form$2.Field,
9680
+ {
9681
+ control: form.control,
9682
+ name: "last_name",
9683
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9684
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9685
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9686
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9687
+ ] })
9688
+ }
9689
+ )
9690
+ ] }),
9691
+ /* @__PURE__ */ jsxRuntime.jsx(
9692
+ Form$2.Field,
9693
+ {
9694
+ control: form.control,
9695
+ name: "company",
9696
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9697
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9698
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9699
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9700
+ ] })
9701
+ }
9702
+ ),
9703
+ /* @__PURE__ */ jsxRuntime.jsx(
9704
+ Form$2.Field,
9705
+ {
9706
+ control: form.control,
9707
+ name: "address_1",
9708
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9709
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9710
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9711
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9712
+ ] })
9713
+ }
9714
+ ),
9715
+ /* @__PURE__ */ jsxRuntime.jsx(
9716
+ Form$2.Field,
9717
+ {
9718
+ control: form.control,
9719
+ name: "address_2",
9720
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9721
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9722
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9723
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9724
+ ] })
9725
+ }
9726
+ ),
9727
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9728
+ /* @__PURE__ */ jsxRuntime.jsx(
9729
+ Form$2.Field,
9730
+ {
9731
+ control: form.control,
9732
+ name: "postal_code",
9733
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9734
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9735
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9736
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9737
+ ] })
9738
+ }
9739
+ ),
9740
+ /* @__PURE__ */ jsxRuntime.jsx(
9741
+ Form$2.Field,
9742
+ {
9743
+ control: form.control,
9744
+ name: "city",
9745
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9746
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9747
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9748
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9749
+ ] })
9750
+ }
9751
+ )
9752
+ ] }),
9753
+ /* @__PURE__ */ jsxRuntime.jsx(
9754
+ Form$2.Field,
9755
+ {
9756
+ control: form.control,
9757
+ name: "province",
9758
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9759
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9760
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9761
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9762
+ ] })
9763
+ }
9764
+ ),
9765
+ /* @__PURE__ */ jsxRuntime.jsx(
9766
+ Form$2.Field,
9767
+ {
9768
+ control: form.control,
9769
+ name: "phone",
9770
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9771
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9772
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9773
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9774
+ ] })
9775
+ }
9776
+ )
9777
+ ] }) }),
9778
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9779
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9780
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9781
+ ] }) })
9782
+ ]
9783
+ }
9784
+ ) });
9785
+ };
9786
+ const schema$4 = addressSchema;
9597
9787
  const Email = () => {
9598
9788
  const { id } = reactRouterDom.useParams();
9599
9789
  const { order, isPending, isError, error } = useOrder(id, {
@@ -9616,7 +9806,7 @@ const EmailForm = ({ order }) => {
9616
9806
  defaultValues: {
9617
9807
  email: order.email ?? ""
9618
9808
  },
9619
- resolver: zod.zodResolver(schema$4)
9809
+ resolver: zod.zodResolver(schema$3)
9620
9810
  });
9621
9811
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9622
9812
  const { handleSuccess } = useRouteModal();
@@ -9659,7 +9849,7 @@ const EmailForm = ({ order }) => {
9659
9849
  }
9660
9850
  ) });
9661
9851
  };
9662
- const schema$4 = objectType({
9852
+ const schema$3 = objectType({
9663
9853
  email: stringType().email()
9664
9854
  });
9665
9855
  const NumberInput = React.forwardRef(
@@ -11263,72 +11453,381 @@ function getPromotionIds(items, shippingMethods) {
11263
11453
  }
11264
11454
  return Array.from(promotionIds);
11265
11455
  }
11266
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11267
- const Shipping = () => {
11268
- var _a;
11456
+ const SalesChannel = () => {
11269
11457
  const { id } = reactRouterDom.useParams();
11270
- const { order, isPending, isError, error } = useOrder(id, {
11271
- fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11272
- });
11273
- const {
11274
- order: preview,
11275
- isPending: isPreviewPending,
11276
- isError: isPreviewError,
11277
- error: previewError
11278
- } = useOrderPreview(id);
11279
- useInitiateOrderEdit({ preview });
11280
- const { onCancel } = useCancelOrderEdit({ preview });
11281
- if (isError) {
11282
- throw error;
11283
- }
11284
- if (isPreviewError) {
11285
- throw previewError;
11286
- }
11287
- const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11288
- const isReady = preview && !isPreviewPending && order && !isPending;
11289
- return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11290
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11291
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11292
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11293
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11294
- ] }) }) }),
11295
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11296
- ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11297
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11298
- /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11299
- ] }) });
11300
- };
11301
- const ShippingForm = ({ preview, order }) => {
11302
- var _a;
11303
- const { setIsOpen } = useStackedModal();
11304
- const [isSubmitting, setIsSubmitting] = React.useState(false);
11305
- const [data, setData] = React.useState(null);
11306
- const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11307
- const { shipping_options } = useShippingOptions(
11458
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11459
+ id,
11308
11460
  {
11309
- id: appliedShippingOptionIds,
11310
- fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11461
+ fields: "+sales_channel_id"
11311
11462
  },
11312
11463
  {
11313
- enabled: appliedShippingOptionIds.length > 0
11464
+ enabled: !!id
11314
11465
  }
11315
11466
  );
11316
- const uniqueShippingProfiles = React.useMemo(() => {
11317
- const profiles = /* @__PURE__ */ new Map();
11318
- getUniqueShippingProfiles(order.items).forEach((profile) => {
11319
- profiles.set(profile.id, profile);
11320
- });
11321
- shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11322
- profiles.set(option.shipping_profile_id, option.shipping_profile);
11323
- });
11324
- return Array.from(profiles.values());
11325
- }, [order.items, shipping_options]);
11326
- const { handleSuccess } = useRouteModal();
11327
- const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11328
- const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11329
- const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11330
- const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11331
- const onSubmit = async () => {
11467
+ if (isError) {
11468
+ throw error;
11469
+ }
11470
+ const ISrEADY = !!draft_order && !isPending;
11471
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11472
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11473
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11474
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11475
+ ] }),
11476
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11477
+ ] });
11478
+ };
11479
+ const SalesChannelForm = ({ order }) => {
11480
+ const form = reactHookForm.useForm({
11481
+ defaultValues: {
11482
+ sales_channel_id: order.sales_channel_id || ""
11483
+ },
11484
+ resolver: zod.zodResolver(schema$2)
11485
+ });
11486
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11487
+ const { handleSuccess } = useRouteModal();
11488
+ const onSubmit = form.handleSubmit(async (data) => {
11489
+ await mutateAsync(
11490
+ {
11491
+ sales_channel_id: data.sales_channel_id
11492
+ },
11493
+ {
11494
+ onSuccess: () => {
11495
+ ui.toast.success("Sales channel updated");
11496
+ handleSuccess();
11497
+ },
11498
+ onError: (error) => {
11499
+ ui.toast.error(error.message);
11500
+ }
11501
+ }
11502
+ );
11503
+ });
11504
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11505
+ KeyboundForm,
11506
+ {
11507
+ className: "flex flex-1 flex-col overflow-hidden",
11508
+ onSubmit,
11509
+ children: [
11510
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11511
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11512
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11513
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11514
+ ] }) })
11515
+ ]
11516
+ }
11517
+ ) });
11518
+ };
11519
+ const SalesChannelField = ({ control, order }) => {
11520
+ const salesChannels = useComboboxData({
11521
+ queryFn: async (params) => {
11522
+ return await sdk.admin.salesChannel.list(params);
11523
+ },
11524
+ queryKey: ["sales-channels"],
11525
+ getOptions: (data) => {
11526
+ return data.sales_channels.map((salesChannel) => ({
11527
+ label: salesChannel.name,
11528
+ value: salesChannel.id
11529
+ }));
11530
+ },
11531
+ defaultValue: order.sales_channel_id || void 0
11532
+ });
11533
+ return /* @__PURE__ */ jsxRuntime.jsx(
11534
+ Form$2.Field,
11535
+ {
11536
+ control,
11537
+ name: "sales_channel_id",
11538
+ render: ({ field }) => {
11539
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11540
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11541
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11542
+ Combobox,
11543
+ {
11544
+ options: salesChannels.options,
11545
+ fetchNextPage: salesChannels.fetchNextPage,
11546
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11547
+ searchValue: salesChannels.searchValue,
11548
+ onSearchValueChange: salesChannels.onSearchValueChange,
11549
+ placeholder: "Select sales channel",
11550
+ ...field
11551
+ }
11552
+ ) }),
11553
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11554
+ ] });
11555
+ }
11556
+ }
11557
+ );
11558
+ };
11559
+ const schema$2 = objectType({
11560
+ sales_channel_id: stringType().min(1)
11561
+ });
11562
+ const ShippingAddress = () => {
11563
+ const { id } = reactRouterDom.useParams();
11564
+ const { order, isPending, isError, error } = useOrder(id, {
11565
+ fields: "+shipping_address"
11566
+ });
11567
+ if (isError) {
11568
+ throw error;
11569
+ }
11570
+ const isReady = !isPending && !!order;
11571
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11572
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11573
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
11574
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11575
+ ] }),
11576
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
11577
+ ] });
11578
+ };
11579
+ const ShippingAddressForm = ({ order }) => {
11580
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11581
+ const form = reactHookForm.useForm({
11582
+ defaultValues: {
11583
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11584
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11585
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11586
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11587
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11588
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11589
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11590
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11591
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11592
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11593
+ },
11594
+ resolver: zod.zodResolver(schema$1)
11595
+ });
11596
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11597
+ const { handleSuccess } = useRouteModal();
11598
+ const onSubmit = form.handleSubmit(async (data) => {
11599
+ await mutateAsync(
11600
+ {
11601
+ shipping_address: {
11602
+ first_name: data.first_name,
11603
+ last_name: data.last_name,
11604
+ company: data.company,
11605
+ address_1: data.address_1,
11606
+ address_2: data.address_2,
11607
+ city: data.city,
11608
+ province: data.province,
11609
+ country_code: data.country_code,
11610
+ postal_code: data.postal_code,
11611
+ phone: data.phone
11612
+ }
11613
+ },
11614
+ {
11615
+ onSuccess: () => {
11616
+ handleSuccess();
11617
+ },
11618
+ onError: (error) => {
11619
+ ui.toast.error(error.message);
11620
+ }
11621
+ }
11622
+ );
11623
+ });
11624
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11625
+ KeyboundForm,
11626
+ {
11627
+ className: "flex flex-1 flex-col overflow-hidden",
11628
+ onSubmit,
11629
+ children: [
11630
+ /* @__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: [
11631
+ /* @__PURE__ */ jsxRuntime.jsx(
11632
+ Form$2.Field,
11633
+ {
11634
+ control: form.control,
11635
+ name: "country_code",
11636
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11637
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11638
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11639
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11640
+ ] })
11641
+ }
11642
+ ),
11643
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11644
+ /* @__PURE__ */ jsxRuntime.jsx(
11645
+ Form$2.Field,
11646
+ {
11647
+ control: form.control,
11648
+ name: "first_name",
11649
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11650
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11651
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11652
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11653
+ ] })
11654
+ }
11655
+ ),
11656
+ /* @__PURE__ */ jsxRuntime.jsx(
11657
+ Form$2.Field,
11658
+ {
11659
+ control: form.control,
11660
+ name: "last_name",
11661
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11662
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11663
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11664
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11665
+ ] })
11666
+ }
11667
+ )
11668
+ ] }),
11669
+ /* @__PURE__ */ jsxRuntime.jsx(
11670
+ Form$2.Field,
11671
+ {
11672
+ control: form.control,
11673
+ name: "company",
11674
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11675
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11676
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11677
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11678
+ ] })
11679
+ }
11680
+ ),
11681
+ /* @__PURE__ */ jsxRuntime.jsx(
11682
+ Form$2.Field,
11683
+ {
11684
+ control: form.control,
11685
+ name: "address_1",
11686
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11687
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11688
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11689
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11690
+ ] })
11691
+ }
11692
+ ),
11693
+ /* @__PURE__ */ jsxRuntime.jsx(
11694
+ Form$2.Field,
11695
+ {
11696
+ control: form.control,
11697
+ name: "address_2",
11698
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11699
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11700
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11701
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11702
+ ] })
11703
+ }
11704
+ ),
11705
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11706
+ /* @__PURE__ */ jsxRuntime.jsx(
11707
+ Form$2.Field,
11708
+ {
11709
+ control: form.control,
11710
+ name: "postal_code",
11711
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11712
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11713
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11714
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11715
+ ] })
11716
+ }
11717
+ ),
11718
+ /* @__PURE__ */ jsxRuntime.jsx(
11719
+ Form$2.Field,
11720
+ {
11721
+ control: form.control,
11722
+ name: "city",
11723
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11724
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11725
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11726
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11727
+ ] })
11728
+ }
11729
+ )
11730
+ ] }),
11731
+ /* @__PURE__ */ jsxRuntime.jsx(
11732
+ Form$2.Field,
11733
+ {
11734
+ control: form.control,
11735
+ name: "province",
11736
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11737
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11738
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11739
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11740
+ ] })
11741
+ }
11742
+ ),
11743
+ /* @__PURE__ */ jsxRuntime.jsx(
11744
+ Form$2.Field,
11745
+ {
11746
+ control: form.control,
11747
+ name: "phone",
11748
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11749
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11750
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11751
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11752
+ ] })
11753
+ }
11754
+ )
11755
+ ] }) }),
11756
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11757
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11758
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11759
+ ] }) })
11760
+ ]
11761
+ }
11762
+ ) });
11763
+ };
11764
+ const schema$1 = addressSchema;
11765
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11766
+ const Shipping = () => {
11767
+ var _a;
11768
+ const { id } = reactRouterDom.useParams();
11769
+ const { order, isPending, isError, error } = useOrder(id, {
11770
+ fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
11771
+ });
11772
+ const {
11773
+ order: preview,
11774
+ isPending: isPreviewPending,
11775
+ isError: isPreviewError,
11776
+ error: previewError
11777
+ } = useOrderPreview(id);
11778
+ useInitiateOrderEdit({ preview });
11779
+ const { onCancel } = useCancelOrderEdit({ preview });
11780
+ if (isError) {
11781
+ throw error;
11782
+ }
11783
+ if (isPreviewError) {
11784
+ throw previewError;
11785
+ }
11786
+ const orderHasItems = (((_a = order == null ? void 0 : order.items) == null ? void 0 : _a.length) || 0) > 0;
11787
+ const isReady = preview && !isPreviewPending && order && !isPending;
11788
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal, { onClose: onCancel, children: !orderHasItems ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-hidden ", children: [
11789
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Header, {}),
11790
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 py-16 px-6", children: [
11791
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Shipping" }) }),
11792
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "small", className: "text-ui-fg-subtle", children: "This draft order currently has no items. Add items to the order before adding shipping." }) })
11793
+ ] }) }) }),
11794
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Footer, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }) })
11795
+ ] }) : isReady ? /* @__PURE__ */ jsxRuntime.jsx(ShippingForm, { preview, order }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
11796
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit Shipping" }) }),
11797
+ /* @__PURE__ */ jsxRuntime.jsx(RouteFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Loading data for the draft order, please wait..." }) })
11798
+ ] }) });
11799
+ };
11800
+ const ShippingForm = ({ preview, order }) => {
11801
+ var _a;
11802
+ const { setIsOpen } = useStackedModal();
11803
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11804
+ const [data, setData] = React.useState(null);
11805
+ const appliedShippingOptionIds = (_a = preview.shipping_methods) == null ? void 0 : _a.map((method) => method.shipping_option_id).filter(Boolean);
11806
+ const { shipping_options } = useShippingOptions(
11807
+ {
11808
+ id: appliedShippingOptionIds,
11809
+ fields: "+service_zone.*,+service_zone.fulfillment_set.*,+service_zone.fulfillment_set.location.*"
11810
+ },
11811
+ {
11812
+ enabled: appliedShippingOptionIds.length > 0
11813
+ }
11814
+ );
11815
+ const uniqueShippingProfiles = React.useMemo(() => {
11816
+ const profiles = /* @__PURE__ */ new Map();
11817
+ getUniqueShippingProfiles(order.items).forEach((profile) => {
11818
+ profiles.set(profile.id, profile);
11819
+ });
11820
+ shipping_options == null ? void 0 : shipping_options.forEach((option) => {
11821
+ profiles.set(option.shipping_profile_id, option.shipping_profile);
11822
+ });
11823
+ return Array.from(profiles.values());
11824
+ }, [order.items, shipping_options]);
11825
+ const { handleSuccess } = useRouteModal();
11826
+ const { mutateAsync: confirmOrderEdit } = useDraftOrderConfirmEdit(preview.id);
11827
+ const { mutateAsync: requestOrderEdit } = useDraftOrderRequestEdit(preview.id);
11828
+ const { mutateAsync: removeShippingMethod } = useDraftOrderRemoveShippingMethod(preview.id);
11829
+ const { mutateAsync: removeActionShippingMethod } = useDraftOrderRemoveActionShippingMethod(preview.id);
11830
+ const onSubmit = async () => {
11332
11831
  setIsSubmitting(true);
11333
11832
  let requestSucceeded = false;
11334
11833
  await requestOrderEdit(void 0, {
@@ -12000,279 +12499,76 @@ const ShippingOptionField = ({
12000
12499
  value: option.id
12001
12500
  };
12002
12501
  }).filter(Boolean);
12003
- },
12004
- enabled: !!locationId && !!shippingProfileId,
12005
- defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12006
- });
12007
- const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12008
- return /* @__PURE__ */ jsxRuntime.jsx(
12009
- Form$2.Field,
12010
- {
12011
- control,
12012
- name: "shipping_option_id",
12013
- render: ({ field }) => {
12014
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12015
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12016
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Shipping option" }),
12017
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12018
- ] }),
12019
- /* @__PURE__ */ jsxRuntime.jsx(
12020
- ConditionalTooltip,
12021
- {
12022
- content: tooltipContent,
12023
- showTooltip: !locationId || !shippingProfileId,
12024
- children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12025
- Combobox,
12026
- {
12027
- options: shippingOptions.options,
12028
- fetchNextPage: shippingOptions.fetchNextPage,
12029
- isFetchingNextPage: shippingOptions.isFetchingNextPage,
12030
- searchValue: shippingOptions.searchValue,
12031
- onSearchValueChange: shippingOptions.onSearchValueChange,
12032
- placeholder: "Select shipping option",
12033
- ...field,
12034
- disabled: !locationId || !shippingProfileId
12035
- }
12036
- ) }) })
12037
- }
12038
- )
12039
- ] }) });
12040
- }
12041
- }
12042
- );
12043
- };
12044
- const CustomAmountField = ({
12045
- control,
12046
- currencyCode
12047
- }) => {
12048
- return /* @__PURE__ */ jsxRuntime.jsx(
12049
- Form$2.Field,
12050
- {
12051
- control,
12052
- name: "custom_amount",
12053
- render: ({ field: { onChange, ...field } }) => {
12054
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12055
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12056
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12057
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12058
- ] }),
12059
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12060
- ui.CurrencyInput,
12061
- {
12062
- ...field,
12063
- onValueChange: (value) => onChange(value),
12064
- symbol: getNativeSymbol(currencyCode),
12065
- code: currencyCode
12066
- }
12067
- ) })
12068
- ] });
12069
- }
12070
- }
12071
- );
12072
- };
12073
- const ShippingAddress = () => {
12074
- const { id } = reactRouterDom.useParams();
12075
- const { order, isPending, isError, error } = useOrder(id, {
12076
- fields: "+shipping_address"
12077
- });
12078
- if (isError) {
12079
- throw error;
12080
- }
12081
- const isReady = !isPending && !!order;
12082
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12083
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12084
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12085
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12086
- ] }),
12087
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12088
- ] });
12089
- };
12090
- const ShippingAddressForm = ({ order }) => {
12091
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12092
- const form = reactHookForm.useForm({
12093
- defaultValues: {
12094
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12095
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12096
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12097
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12098
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12099
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12100
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12101
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12102
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12103
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12104
- },
12105
- resolver: zod.zodResolver(schema$3)
12106
- });
12107
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12108
- const { handleSuccess } = useRouteModal();
12109
- const onSubmit = form.handleSubmit(async (data) => {
12110
- await mutateAsync(
12111
- {
12112
- shipping_address: {
12113
- first_name: data.first_name,
12114
- last_name: data.last_name,
12115
- company: data.company,
12116
- address_1: data.address_1,
12117
- address_2: data.address_2,
12118
- city: data.city,
12119
- province: data.province,
12120
- country_code: data.country_code,
12121
- postal_code: data.postal_code,
12122
- phone: data.phone
12123
- }
12124
- },
12125
- {
12126
- onSuccess: () => {
12127
- handleSuccess();
12128
- },
12129
- onError: (error) => {
12130
- ui.toast.error(error.message);
12131
- }
12132
- }
12133
- );
12134
- });
12135
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12136
- KeyboundForm,
12137
- {
12138
- className: "flex flex-1 flex-col overflow-hidden",
12139
- onSubmit,
12140
- children: [
12141
- /* @__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: [
12142
- /* @__PURE__ */ jsxRuntime.jsx(
12143
- Form$2.Field,
12144
- {
12145
- control: form.control,
12146
- name: "country_code",
12147
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12148
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12149
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12150
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12151
- ] })
12152
- }
12153
- ),
12154
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12155
- /* @__PURE__ */ jsxRuntime.jsx(
12156
- Form$2.Field,
12157
- {
12158
- control: form.control,
12159
- name: "first_name",
12160
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12161
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12162
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12163
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12164
- ] })
12165
- }
12166
- ),
12167
- /* @__PURE__ */ jsxRuntime.jsx(
12168
- Form$2.Field,
12169
- {
12170
- control: form.control,
12171
- name: "last_name",
12172
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12173
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12174
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12175
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12176
- ] })
12177
- }
12178
- )
12179
- ] }),
12180
- /* @__PURE__ */ jsxRuntime.jsx(
12181
- Form$2.Field,
12182
- {
12183
- control: form.control,
12184
- name: "company",
12185
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12186
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12187
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12188
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12189
- ] })
12190
- }
12191
- ),
12192
- /* @__PURE__ */ jsxRuntime.jsx(
12193
- Form$2.Field,
12194
- {
12195
- control: form.control,
12196
- name: "address_1",
12197
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12198
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12199
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12200
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12201
- ] })
12202
- }
12203
- ),
12204
- /* @__PURE__ */ jsxRuntime.jsx(
12205
- Form$2.Field,
12206
- {
12207
- control: form.control,
12208
- name: "address_2",
12209
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12210
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12211
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12212
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12213
- ] })
12214
- }
12215
- ),
12216
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12217
- /* @__PURE__ */ jsxRuntime.jsx(
12218
- Form$2.Field,
12219
- {
12220
- control: form.control,
12221
- name: "postal_code",
12222
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12223
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12224
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12225
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12226
- ] })
12227
- }
12228
- ),
12229
- /* @__PURE__ */ jsxRuntime.jsx(
12230
- Form$2.Field,
12231
- {
12232
- control: form.control,
12233
- name: "city",
12234
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12235
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12236
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12237
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12238
- ] })
12239
- }
12240
- )
12502
+ },
12503
+ enabled: !!locationId && !!shippingProfileId,
12504
+ defaultValue: ((_a = preview.shipping_methods[0]) == null ? void 0 : _a.shipping_option_id) || void 0
12505
+ });
12506
+ const tooltipContent = !locationId && !shippingProfileId ? "Choose a location and shipping profile first." : !locationId ? "Choose a location first." : "Choose a shipping profile first.";
12507
+ return /* @__PURE__ */ jsxRuntime.jsx(
12508
+ Form$2.Field,
12509
+ {
12510
+ control,
12511
+ name: "shipping_option_id",
12512
+ render: ({ field }) => {
12513
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12514
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12515
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Shipping option" }),
12516
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Choose the shipping option to use." })
12241
12517
  ] }),
12242
12518
  /* @__PURE__ */ jsxRuntime.jsx(
12243
- Form$2.Field,
12519
+ ConditionalTooltip,
12244
12520
  {
12245
- control: form.control,
12246
- name: "province",
12247
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12248
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12249
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12250
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12251
- ] })
12521
+ content: tooltipContent,
12522
+ showTooltip: !locationId || !shippingProfileId,
12523
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12524
+ Combobox,
12525
+ {
12526
+ options: shippingOptions.options,
12527
+ fetchNextPage: shippingOptions.fetchNextPage,
12528
+ isFetchingNextPage: shippingOptions.isFetchingNextPage,
12529
+ searchValue: shippingOptions.searchValue,
12530
+ onSearchValueChange: shippingOptions.onSearchValueChange,
12531
+ placeholder: "Select shipping option",
12532
+ ...field,
12533
+ disabled: !locationId || !shippingProfileId
12534
+ }
12535
+ ) }) })
12252
12536
  }
12253
- ),
12254
- /* @__PURE__ */ jsxRuntime.jsx(
12255
- Form$2.Field,
12537
+ )
12538
+ ] }) });
12539
+ }
12540
+ }
12541
+ );
12542
+ };
12543
+ const CustomAmountField = ({
12544
+ control,
12545
+ currencyCode
12546
+ }) => {
12547
+ return /* @__PURE__ */ jsxRuntime.jsx(
12548
+ Form$2.Field,
12549
+ {
12550
+ control,
12551
+ name: "custom_amount",
12552
+ render: ({ field: { onChange, ...field } }) => {
12553
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12554
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12555
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12556
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12557
+ ] }),
12558
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12559
+ ui.CurrencyInput,
12256
12560
  {
12257
- control: form.control,
12258
- name: "phone",
12259
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12260
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12261
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12262
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12263
- ] })
12561
+ ...field,
12562
+ onValueChange: (value) => onChange(value),
12563
+ symbol: getNativeSymbol(currencyCode),
12564
+ code: currencyCode
12264
12565
  }
12265
- )
12266
- ] }) }),
12267
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12268
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12269
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12270
- ] }) })
12271
- ]
12566
+ ) })
12567
+ ] });
12568
+ }
12272
12569
  }
12273
- ) });
12570
+ );
12274
12571
  };
12275
- const schema$3 = addressSchema;
12276
12572
  const TransferOwnership = () => {
12277
12573
  const { id } = reactRouterDom.useParams();
12278
12574
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12296,7 +12592,7 @@ const TransferOwnershipForm = ({ order }) => {
12296
12592
  defaultValues: {
12297
12593
  customer_id: order.customer_id || ""
12298
12594
  },
12299
- resolver: zod.zodResolver(schema$2)
12595
+ resolver: zod.zodResolver(schema)
12300
12596
  });
12301
12597
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12302
12598
  const { handleSuccess } = useRouteModal();
@@ -12679,371 +12975,75 @@ const Illustration = () => {
12679
12975
  /* @__PURE__ */ jsxRuntime.jsx("g", { clipPath: "url(#clip5_20915_38670)", children: /* @__PURE__ */ jsxRuntime.jsx(
12680
12976
  "path",
12681
12977
  {
12682
- d: "M146.894 101.198L139.51 101.155L139.486 105.365",
12683
- stroke: "#A1A1AA",
12684
- strokeWidth: "1.5",
12685
- strokeLinecap: "round",
12686
- strokeLinejoin: "round"
12687
- }
12688
- ) }),
12689
- /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
12690
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip0_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12691
- "rect",
12692
- {
12693
- width: "12",
12694
- height: "12",
12695
- fill: "white",
12696
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
12697
- }
12698
- ) }),
12699
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12700
- "rect",
12701
- {
12702
- width: "12",
12703
- height: "12",
12704
- fill: "white",
12705
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
12706
- }
12707
- ) }),
12708
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12709
- "rect",
12710
- {
12711
- width: "12",
12712
- height: "12",
12713
- fill: "white",
12714
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12715
- }
12716
- ) }),
12717
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12718
- "rect",
12719
- {
12720
- width: "12",
12721
- height: "12",
12722
- fill: "white",
12723
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12724
- }
12725
- ) }),
12726
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12727
- "rect",
12728
- {
12729
- width: "12",
12730
- height: "12",
12731
- fill: "white",
12732
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12733
- }
12734
- ) }),
12735
- /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12736
- "rect",
12737
- {
12738
- width: "12",
12739
- height: "12",
12740
- fill: "white",
12741
- transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
12742
- }
12743
- ) })
12744
- ] })
12745
- ]
12746
- }
12747
- );
12748
- };
12749
- const schema$2 = objectType({
12750
- customer_id: stringType().min(1)
12751
- });
12752
- const BillingAddress = () => {
12753
- const { id } = reactRouterDom.useParams();
12754
- const { order, isPending, isError, error } = useOrder(id, {
12755
- fields: "+billing_address"
12756
- });
12757
- if (isError) {
12758
- throw error;
12759
- }
12760
- const isReady = !isPending && !!order;
12761
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12762
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12763
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12764
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12765
- ] }),
12766
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12767
- ] });
12768
- };
12769
- const BillingAddressForm = ({ order }) => {
12770
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12771
- const form = reactHookForm.useForm({
12772
- defaultValues: {
12773
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12774
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12775
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12776
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12777
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12778
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12779
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12780
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12781
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12782
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12783
- },
12784
- resolver: zod.zodResolver(schema$1)
12785
- });
12786
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12787
- const { handleSuccess } = useRouteModal();
12788
- const onSubmit = form.handleSubmit(async (data) => {
12789
- await mutateAsync(
12790
- { billing_address: data },
12791
- {
12792
- onSuccess: () => {
12793
- handleSuccess();
12794
- },
12795
- onError: (error) => {
12796
- ui.toast.error(error.message);
12797
- }
12798
- }
12799
- );
12800
- });
12801
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12802
- KeyboundForm,
12803
- {
12804
- className: "flex flex-1 flex-col overflow-hidden",
12805
- onSubmit,
12806
- children: [
12807
- /* @__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: [
12808
- /* @__PURE__ */ jsxRuntime.jsx(
12809
- Form$2.Field,
12810
- {
12811
- control: form.control,
12812
- name: "country_code",
12813
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12814
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12815
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12816
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12817
- ] })
12818
- }
12819
- ),
12820
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12821
- /* @__PURE__ */ jsxRuntime.jsx(
12822
- Form$2.Field,
12823
- {
12824
- control: form.control,
12825
- name: "first_name",
12826
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12827
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12828
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12829
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12830
- ] })
12831
- }
12832
- ),
12833
- /* @__PURE__ */ jsxRuntime.jsx(
12834
- Form$2.Field,
12835
- {
12836
- control: form.control,
12837
- name: "last_name",
12838
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12839
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12840
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12841
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12842
- ] })
12843
- }
12844
- )
12845
- ] }),
12846
- /* @__PURE__ */ jsxRuntime.jsx(
12847
- Form$2.Field,
12978
+ d: "M146.894 101.198L139.51 101.155L139.486 105.365",
12979
+ stroke: "#A1A1AA",
12980
+ strokeWidth: "1.5",
12981
+ strokeLinecap: "round",
12982
+ strokeLinejoin: "round"
12983
+ }
12984
+ ) }),
12985
+ /* @__PURE__ */ jsxRuntime.jsxs("defs", { children: [
12986
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip0_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12987
+ "rect",
12848
12988
  {
12849
- control: form.control,
12850
- name: "company",
12851
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12852
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12853
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12854
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12855
- ] })
12989
+ width: "12",
12990
+ height: "12",
12991
+ fill: "white",
12992
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 138.36 74.6508)"
12856
12993
  }
12857
- ),
12858
- /* @__PURE__ */ jsxRuntime.jsx(
12859
- Form$2.Field,
12994
+ ) }),
12995
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip1_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
12996
+ "rect",
12860
12997
  {
12861
- control: form.control,
12862
- name: "address_1",
12863
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12864
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12865
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12866
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12867
- ] })
12998
+ width: "12",
12999
+ height: "12",
13000
+ fill: "white",
13001
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 148.75 80.6541)"
12868
13002
  }
12869
- ),
12870
- /* @__PURE__ */ jsxRuntime.jsx(
12871
- Form$2.Field,
13003
+ ) }),
13004
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip2_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13005
+ "rect",
12872
13006
  {
12873
- control: form.control,
12874
- name: "address_2",
12875
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12876
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12877
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12878
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12879
- ] })
13007
+ width: "12",
13008
+ height: "12",
13009
+ fill: "white",
13010
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 159.141 86.6575)"
12880
13011
  }
12881
- ),
12882
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12883
- /* @__PURE__ */ jsxRuntime.jsx(
12884
- Form$2.Field,
12885
- {
12886
- control: form.control,
12887
- name: "postal_code",
12888
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12889
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12890
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12891
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12892
- ] })
12893
- }
12894
- ),
12895
- /* @__PURE__ */ jsxRuntime.jsx(
12896
- Form$2.Field,
12897
- {
12898
- control: form.control,
12899
- name: "city",
12900
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12901
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12902
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12903
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12904
- ] })
12905
- }
12906
- )
12907
- ] }),
12908
- /* @__PURE__ */ jsxRuntime.jsx(
12909
- Form$2.Field,
13012
+ ) }),
13013
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip3_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13014
+ "rect",
12910
13015
  {
12911
- control: form.control,
12912
- name: "province",
12913
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12914
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12915
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12916
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12917
- ] })
13016
+ width: "12",
13017
+ height: "12",
13018
+ fill: "white",
13019
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 120.928 84.4561)"
12918
13020
  }
12919
- ),
12920
- /* @__PURE__ */ jsxRuntime.jsx(
12921
- Form$2.Field,
13021
+ ) }),
13022
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip4_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13023
+ "rect",
12922
13024
  {
12923
- control: form.control,
12924
- name: "phone",
12925
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12926
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12927
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12928
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12929
- ] })
13025
+ width: "12",
13026
+ height: "12",
13027
+ fill: "white",
13028
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 131.318 90.4594)"
12930
13029
  }
12931
- )
12932
- ] }) }),
12933
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12934
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12935
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12936
- ] }) })
12937
- ]
12938
- }
12939
- ) });
12940
- };
12941
- const schema$1 = addressSchema;
12942
- const SalesChannel = () => {
12943
- const { id } = reactRouterDom.useParams();
12944
- const { draft_order, isPending, isError, error } = useDraftOrder(
12945
- id,
12946
- {
12947
- fields: "+sales_channel_id"
12948
- },
12949
- {
12950
- enabled: !!id
12951
- }
12952
- );
12953
- if (isError) {
12954
- throw error;
12955
- }
12956
- const ISrEADY = !!draft_order && !isPending;
12957
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12958
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12959
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
12960
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
12961
- ] }),
12962
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
12963
- ] });
12964
- };
12965
- const SalesChannelForm = ({ order }) => {
12966
- const form = reactHookForm.useForm({
12967
- defaultValues: {
12968
- sales_channel_id: order.sales_channel_id || ""
12969
- },
12970
- resolver: zod.zodResolver(schema)
12971
- });
12972
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12973
- const { handleSuccess } = useRouteModal();
12974
- const onSubmit = form.handleSubmit(async (data) => {
12975
- await mutateAsync(
12976
- {
12977
- sales_channel_id: data.sales_channel_id
12978
- },
12979
- {
12980
- onSuccess: () => {
12981
- ui.toast.success("Sales channel updated");
12982
- handleSuccess();
12983
- },
12984
- onError: (error) => {
12985
- ui.toast.error(error.message);
12986
- }
12987
- }
12988
- );
12989
- });
12990
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12991
- KeyboundForm,
12992
- {
12993
- className: "flex flex-1 flex-col overflow-hidden",
12994
- onSubmit,
12995
- children: [
12996
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
12997
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12998
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12999
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13000
- ] }) })
13001
- ]
13002
- }
13003
- ) });
13004
- };
13005
- const SalesChannelField = ({ control, order }) => {
13006
- const salesChannels = useComboboxData({
13007
- queryFn: async (params) => {
13008
- return await sdk.admin.salesChannel.list(params);
13009
- },
13010
- queryKey: ["sales-channels"],
13011
- getOptions: (data) => {
13012
- return data.sales_channels.map((salesChannel) => ({
13013
- label: salesChannel.name,
13014
- value: salesChannel.id
13015
- }));
13016
- },
13017
- defaultValue: order.sales_channel_id || void 0
13018
- });
13019
- return /* @__PURE__ */ jsxRuntime.jsx(
13020
- Form$2.Field,
13021
- {
13022
- control,
13023
- name: "sales_channel_id",
13024
- render: ({ field }) => {
13025
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13026
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
13027
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
13028
- Combobox,
13030
+ ) }),
13031
+ /* @__PURE__ */ jsxRuntime.jsx("clipPath", { id: "clip5_20915_38670", children: /* @__PURE__ */ jsxRuntime.jsx(
13032
+ "rect",
13029
13033
  {
13030
- options: salesChannels.options,
13031
- fetchNextPage: salesChannels.fetchNextPage,
13032
- isFetchingNextPage: salesChannels.isFetchingNextPage,
13033
- searchValue: salesChannels.searchValue,
13034
- onSearchValueChange: salesChannels.onSearchValueChange,
13035
- placeholder: "Select sales channel",
13036
- ...field
13034
+ width: "12",
13035
+ height: "12",
13036
+ fill: "white",
13037
+ transform: "matrix(0.865865 0.500278 -0.871576 0.490261 141.709 96.4627)"
13037
13038
  }
13038
- ) }),
13039
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13040
- ] });
13041
- }
13039
+ ) })
13040
+ ] })
13041
+ ]
13042
13042
  }
13043
13043
  );
13044
13044
  };
13045
13045
  const schema = objectType({
13046
- sales_channel_id: stringType().min(1)
13046
+ customer_id: stringType().min(1)
13047
13047
  });
13048
13048
  const widgetModule = { widgets: [] };
13049
13049
  const routeModule = {
@@ -13069,6 +13069,10 @@ const routeModule = {
13069
13069
  Component: CustomItems,
13070
13070
  path: "/draft-orders/:id/custom-items"
13071
13071
  },
13072
+ {
13073
+ Component: BillingAddress,
13074
+ path: "/draft-orders/:id/billing-address"
13075
+ },
13072
13076
  {
13073
13077
  Component: Email,
13074
13078
  path: "/draft-orders/:id/email"
@@ -13086,24 +13090,20 @@ const routeModule = {
13086
13090
  path: "/draft-orders/:id/promotions"
13087
13091
  },
13088
13092
  {
13089
- Component: Shipping,
13090
- path: "/draft-orders/:id/shipping"
13093
+ Component: SalesChannel,
13094
+ path: "/draft-orders/:id/sales-channel"
13091
13095
  },
13092
13096
  {
13093
13097
  Component: ShippingAddress,
13094
13098
  path: "/draft-orders/:id/shipping-address"
13095
13099
  },
13096
13100
  {
13097
- Component: TransferOwnership,
13098
- path: "/draft-orders/:id/transfer-ownership"
13099
- },
13100
- {
13101
- Component: BillingAddress,
13102
- path: "/draft-orders/:id/billing-address"
13101
+ Component: Shipping,
13102
+ path: "/draft-orders/:id/shipping"
13103
13103
  },
13104
13104
  {
13105
- Component: SalesChannel,
13106
- path: "/draft-orders/:id/sales-channel"
13105
+ Component: TransferOwnership,
13106
+ path: "/draft-orders/:id/transfer-ownership"
13107
13107
  }
13108
13108
  ]
13109
13109
  }