@medusajs/draft-order 2.10.4-snapshot-20250927182917 → 2.10.4-snapshot-20250928135304

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9567,6 +9567,196 @@ const ID = () => {
9567
9567
  /* @__PURE__ */ jsx(Outlet, {})
9568
9568
  ] });
9569
9569
  };
9570
+ const BillingAddress = () => {
9571
+ const { id } = useParams();
9572
+ const { order, isPending, isError, error } = useOrder(id, {
9573
+ fields: "+billing_address"
9574
+ });
9575
+ if (isError) {
9576
+ throw error;
9577
+ }
9578
+ const isReady = !isPending && !!order;
9579
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9580
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
9581
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Billing Address" }) }),
9582
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9583
+ ] }),
9584
+ isReady && /* @__PURE__ */ jsx(BillingAddressForm, { order })
9585
+ ] });
9586
+ };
9587
+ const BillingAddressForm = ({ order }) => {
9588
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9589
+ const form = useForm({
9590
+ defaultValues: {
9591
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9592
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9593
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9594
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9595
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9596
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9597
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9598
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9599
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9600
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9601
+ },
9602
+ resolver: zodResolver(schema$5)
9603
+ });
9604
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9605
+ const { handleSuccess } = useRouteModal();
9606
+ const onSubmit = form.handleSubmit(async (data) => {
9607
+ await mutateAsync(
9608
+ { billing_address: data },
9609
+ {
9610
+ onSuccess: () => {
9611
+ handleSuccess();
9612
+ },
9613
+ onError: (error) => {
9614
+ toast.error(error.message);
9615
+ }
9616
+ }
9617
+ );
9618
+ });
9619
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
9620
+ KeyboundForm,
9621
+ {
9622
+ className: "flex flex-1 flex-col overflow-hidden",
9623
+ onSubmit,
9624
+ children: [
9625
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
9626
+ /* @__PURE__ */ jsx(
9627
+ Form$2.Field,
9628
+ {
9629
+ control: form.control,
9630
+ name: "country_code",
9631
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9632
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
9633
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
9634
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9635
+ ] })
9636
+ }
9637
+ ),
9638
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9639
+ /* @__PURE__ */ jsx(
9640
+ Form$2.Field,
9641
+ {
9642
+ control: form.control,
9643
+ name: "first_name",
9644
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9645
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
9646
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9647
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9648
+ ] })
9649
+ }
9650
+ ),
9651
+ /* @__PURE__ */ jsx(
9652
+ Form$2.Field,
9653
+ {
9654
+ control: form.control,
9655
+ name: "last_name",
9656
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9657
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
9658
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9659
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9660
+ ] })
9661
+ }
9662
+ )
9663
+ ] }),
9664
+ /* @__PURE__ */ jsx(
9665
+ Form$2.Field,
9666
+ {
9667
+ control: form.control,
9668
+ name: "company",
9669
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9670
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
9671
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9672
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9673
+ ] })
9674
+ }
9675
+ ),
9676
+ /* @__PURE__ */ jsx(
9677
+ Form$2.Field,
9678
+ {
9679
+ control: form.control,
9680
+ name: "address_1",
9681
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9682
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
9683
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9684
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9685
+ ] })
9686
+ }
9687
+ ),
9688
+ /* @__PURE__ */ jsx(
9689
+ Form$2.Field,
9690
+ {
9691
+ control: form.control,
9692
+ name: "address_2",
9693
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9694
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9695
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9696
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9697
+ ] })
9698
+ }
9699
+ ),
9700
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9701
+ /* @__PURE__ */ jsx(
9702
+ Form$2.Field,
9703
+ {
9704
+ control: form.control,
9705
+ name: "postal_code",
9706
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9707
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
9708
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9709
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9710
+ ] })
9711
+ }
9712
+ ),
9713
+ /* @__PURE__ */ jsx(
9714
+ Form$2.Field,
9715
+ {
9716
+ control: form.control,
9717
+ name: "city",
9718
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9719
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
9720
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9721
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9722
+ ] })
9723
+ }
9724
+ )
9725
+ ] }),
9726
+ /* @__PURE__ */ jsx(
9727
+ Form$2.Field,
9728
+ {
9729
+ control: form.control,
9730
+ name: "province",
9731
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9732
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9733
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9734
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9735
+ ] })
9736
+ }
9737
+ ),
9738
+ /* @__PURE__ */ jsx(
9739
+ Form$2.Field,
9740
+ {
9741
+ control: form.control,
9742
+ name: "phone",
9743
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9744
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
9745
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9746
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9747
+ ] })
9748
+ }
9749
+ )
9750
+ ] }) }),
9751
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9752
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9753
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9754
+ ] }) })
9755
+ ]
9756
+ }
9757
+ ) });
9758
+ };
9759
+ const schema$5 = addressSchema;
9570
9760
  const CustomItems = () => {
9571
9761
  return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9572
9762
  /* @__PURE__ */ jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Custom Items" }) }) }),
@@ -9575,7 +9765,7 @@ const CustomItems = () => {
9575
9765
  };
9576
9766
  const CustomItemsForm = () => {
9577
9767
  const form = useForm({
9578
- resolver: zodResolver(schema$5)
9768
+ resolver: zodResolver(schema$4)
9579
9769
  });
9580
9770
  return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9581
9771
  /* @__PURE__ */ jsx(RouteDrawer.Body, {}),
@@ -9585,46 +9775,114 @@ const CustomItemsForm = () => {
9585
9775
  ] }) })
9586
9776
  ] }) });
9587
9777
  };
9588
- const schema$5 = objectType({
9778
+ const schema$4 = objectType({
9589
9779
  email: stringType().email()
9590
9780
  });
9591
- const NumberInput = forwardRef(
9592
- ({
9593
- value,
9594
- onChange,
9595
- size = "base",
9596
- min = 0,
9597
- max = 100,
9598
- step = 1,
9599
- className,
9600
- disabled,
9601
- ...props
9602
- }, ref) => {
9603
- const handleChange = (event) => {
9604
- const newValue = event.target.value === "" ? min : Number(event.target.value);
9605
- if (!isNaN(newValue) && (max === void 0 || newValue <= max) && (min === void 0 || newValue >= min)) {
9606
- onChange(newValue);
9607
- }
9608
- };
9609
- const handleIncrement = () => {
9610
- const newValue = value + step;
9611
- if (max === void 0 || newValue <= max) {
9612
- onChange(newValue);
9613
- }
9614
- };
9615
- const handleDecrement = () => {
9616
- const newValue = value - step;
9617
- if (min === void 0 || newValue >= min) {
9618
- onChange(newValue);
9619
- }
9620
- };
9621
- return /* @__PURE__ */ jsxs(
9622
- "div",
9781
+ const Email = () => {
9782
+ const { id } = useParams();
9783
+ const { order, isPending, isError, error } = useOrder(id, {
9784
+ fields: "+email"
9785
+ });
9786
+ if (isError) {
9787
+ throw error;
9788
+ }
9789
+ const isReady = !isPending && !!order;
9790
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
9791
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
9792
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Email" }) }),
9793
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9794
+ ] }),
9795
+ isReady && /* @__PURE__ */ jsx(EmailForm, { order })
9796
+ ] });
9797
+ };
9798
+ const EmailForm = ({ order }) => {
9799
+ const form = useForm({
9800
+ defaultValues: {
9801
+ email: order.email ?? ""
9802
+ },
9803
+ resolver: zodResolver(schema$3)
9804
+ });
9805
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9806
+ const { handleSuccess } = useRouteModal();
9807
+ const onSubmit = form.handleSubmit(async (data) => {
9808
+ await mutateAsync(
9809
+ { email: data.email },
9623
9810
  {
9624
- className: clx(
9625
- "inline-flex rounded-md bg-ui-bg-field shadow-borders-base overflow-hidden divide-x transition-fg",
9626
- "[&:has(input:focus)]:shadow-borders-interactive-with-active",
9627
- {
9811
+ onSuccess: () => {
9812
+ handleSuccess();
9813
+ },
9814
+ onError: (error) => {
9815
+ toast.error(error.message);
9816
+ }
9817
+ }
9818
+ );
9819
+ });
9820
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
9821
+ KeyboundForm,
9822
+ {
9823
+ className: "flex flex-1 flex-col overflow-hidden",
9824
+ onSubmit,
9825
+ children: [
9826
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(
9827
+ Form$2.Field,
9828
+ {
9829
+ control: form.control,
9830
+ name: "email",
9831
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
9832
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Email" }),
9833
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
9834
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
9835
+ ] })
9836
+ }
9837
+ ) }),
9838
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
9839
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9840
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9841
+ ] }) })
9842
+ ]
9843
+ }
9844
+ ) });
9845
+ };
9846
+ const schema$3 = objectType({
9847
+ email: stringType().email()
9848
+ });
9849
+ const NumberInput = forwardRef(
9850
+ ({
9851
+ value,
9852
+ onChange,
9853
+ size = "base",
9854
+ min = 0,
9855
+ max = 100,
9856
+ step = 1,
9857
+ className,
9858
+ disabled,
9859
+ ...props
9860
+ }, ref) => {
9861
+ const handleChange = (event) => {
9862
+ const newValue = event.target.value === "" ? min : Number(event.target.value);
9863
+ if (!isNaN(newValue) && (max === void 0 || newValue <= max) && (min === void 0 || newValue >= min)) {
9864
+ onChange(newValue);
9865
+ }
9866
+ };
9867
+ const handleIncrement = () => {
9868
+ const newValue = value + step;
9869
+ if (max === void 0 || newValue <= max) {
9870
+ onChange(newValue);
9871
+ }
9872
+ };
9873
+ const handleDecrement = () => {
9874
+ const newValue = value - step;
9875
+ if (min === void 0 || newValue >= min) {
9876
+ onChange(newValue);
9877
+ }
9878
+ };
9879
+ return /* @__PURE__ */ jsxs(
9880
+ "div",
9881
+ {
9882
+ className: clx(
9883
+ "inline-flex rounded-md bg-ui-bg-field shadow-borders-base overflow-hidden divide-x transition-fg",
9884
+ "[&:has(input:focus)]:shadow-borders-interactive-with-active",
9885
+ {
9628
9886
  "h-7": size === "small",
9629
9887
  "h-8": size === "base"
9630
9888
  },
@@ -10328,497 +10586,239 @@ const ExistingItemsForm = ({ orderId, items }) => {
10328
10586
  onSuccess: () => {
10329
10587
  setRowSelection({});
10330
10588
  setIsOpen(STACKED_MODAL_ID, false);
10331
- },
10332
- onError: (e) => {
10333
- toast.error(e.message);
10334
- }
10335
- }
10336
- );
10337
- };
10338
- if (isError) {
10339
- throw error;
10340
- }
10341
- return /* @__PURE__ */ jsxs(
10342
- StackedFocusModal.Content,
10343
- {
10344
- onOpenAutoFocus: (e) => {
10345
- e.preventDefault();
10346
- const searchInput = document.querySelector(
10347
- "[data-modal-id='modal-search-input']"
10348
- );
10349
- if (searchInput) {
10350
- searchInput.focus();
10351
- }
10352
- },
10353
- children: [
10354
- /* @__PURE__ */ jsxs(StackedFocusModal.Header, { children: [
10355
- /* @__PURE__ */ jsx(StackedFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Product Variants" }) }),
10356
- /* @__PURE__ */ jsx(StackedFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Choose product variants to add to the order." }) })
10357
- ] }),
10358
- /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsx(
10359
- DataTable,
10360
- {
10361
- data: variants,
10362
- columns,
10363
- isLoading: isPending,
10364
- getRowId: (row) => row.id,
10365
- rowCount: count,
10366
- prefix: VARIANT_PREFIX,
10367
- layout: "fill",
10368
- rowSelection: {
10369
- state: rowSelection,
10370
- onRowSelectionChange: setRowSelection,
10371
- enableRowSelection: (row) => {
10372
- return !items.find((i) => i.variant_id === row.original.id);
10373
- }
10374
- },
10375
- autoFocusSearch: true
10376
- }
10377
- ) }),
10378
- /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10379
- /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10380
- /* @__PURE__ */ jsx(Button, { size: "small", type: "button", onClick: onSubmit, children: "Update items" })
10381
- ] }) })
10382
- ]
10383
- }
10384
- );
10385
- };
10386
- const columnHelper = createDataTableColumnHelper();
10387
- const useColumns = () => {
10388
- return useMemo(() => {
10389
- return [
10390
- columnHelper.select(),
10391
- columnHelper.accessor("product.title", {
10392
- header: "Product",
10393
- cell: ({ row }) => {
10394
- var _a, _b, _c;
10395
- return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
10396
- /* @__PURE__ */ jsx(
10397
- Thumbnail,
10398
- {
10399
- thumbnail: (_a = row.original.product) == null ? void 0 : _a.thumbnail,
10400
- alt: (_b = row.original.product) == null ? void 0 : _b.title
10401
- }
10402
- ),
10403
- /* @__PURE__ */ jsx("span", { children: (_c = row.original.product) == null ? void 0 : _c.title })
10404
- ] });
10405
- },
10406
- enableSorting: true
10407
- }),
10408
- columnHelper.accessor("title", {
10409
- header: "Variant",
10410
- enableSorting: true
10411
- }),
10412
- columnHelper.accessor("sku", {
10413
- header: "SKU",
10414
- cell: ({ getValue }) => {
10415
- return getValue() ?? "-";
10416
- },
10417
- enableSorting: true
10418
- }),
10419
- columnHelper.accessor("updated_at", {
10420
- header: "Updated",
10421
- cell: ({ getValue }) => {
10422
- return /* @__PURE__ */ jsx(
10423
- Tooltip,
10424
- {
10425
- content: getFullDate({ date: getValue(), includeTime: true }),
10426
- children: /* @__PURE__ */ jsx("span", { children: getFullDate({ date: getValue() }) })
10427
- }
10428
- );
10429
- },
10430
- enableSorting: true,
10431
- sortAscLabel: "Oldest first",
10432
- sortDescLabel: "Newest first"
10433
- }),
10434
- columnHelper.accessor("created_at", {
10435
- header: "Created",
10436
- cell: ({ getValue }) => {
10437
- return /* @__PURE__ */ jsx(
10438
- Tooltip,
10439
- {
10440
- content: getFullDate({ date: getValue(), includeTime: true }),
10441
- children: /* @__PURE__ */ jsx("span", { children: getFullDate({ date: getValue() }) })
10442
- }
10443
- );
10444
- },
10445
- enableSorting: true,
10446
- sortAscLabel: "Oldest first",
10447
- sortDescLabel: "Newest first"
10448
- })
10449
- ];
10450
- }, []);
10451
- };
10452
- const CustomItemForm = ({ orderId, currencyCode }) => {
10453
- const { setIsOpen } = useStackedModal();
10454
- const { mutateAsync: addItems } = useDraftOrderAddItems(orderId);
10455
- const form = useForm({
10456
- defaultValues: {
10457
- title: "",
10458
- quantity: 1,
10459
- unit_price: ""
10460
- },
10461
- resolver: zodResolver(customItemSchema)
10462
- });
10463
- const onSubmit = form.handleSubmit(async (data) => {
10464
- await addItems(
10465
- {
10466
- items: [
10467
- {
10468
- title: data.title,
10469
- quantity: data.quantity,
10470
- unit_price: convertNumber(data.unit_price)
10471
- }
10472
- ]
10473
- },
10474
- {
10475
- onSuccess: () => {
10476
- setIsOpen(STACKED_MODAL_ID, false);
10477
- },
10478
- onError: (e) => {
10479
- toast.error(e.message);
10480
- }
10481
- }
10482
- );
10483
- });
10484
- return /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsx(KeyboundForm, { onSubmit, children: /* @__PURE__ */ jsxs(StackedFocusModal.Content, { children: [
10485
- /* @__PURE__ */ jsx(StackedFocusModal.Header, {}),
10486
- /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 px-2 py-16", children: [
10487
- /* @__PURE__ */ jsxs("div", { children: [
10488
- /* @__PURE__ */ jsx(StackedFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Add custom item" }) }),
10489
- /* @__PURE__ */ jsx(StackedFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a custom item to the order. This will add a new line item that is not associated with an existing product." }) })
10490
- ] }),
10491
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
10492
- /* @__PURE__ */ jsx(
10493
- Form$2.Field,
10494
- {
10495
- control: form.control,
10496
- name: "title",
10497
- render: ({ field }) => /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
10498
- /* @__PURE__ */ jsxs("div", { children: [
10499
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Title" }),
10500
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Enter the title of the item" })
10501
- ] }),
10502
- /* @__PURE__ */ jsxs("div", { children: [
10503
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10504
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10505
- ] })
10506
- ] }) })
10507
- }
10508
- ),
10509
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
10510
- /* @__PURE__ */ jsx(
10511
- Form$2.Field,
10512
- {
10513
- control: form.control,
10514
- name: "unit_price",
10515
- render: ({ field: { onChange, ...field } }) => /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
10516
- /* @__PURE__ */ jsxs("div", { children: [
10517
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Unit price" }),
10518
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Enter the unit price of the item" })
10519
- ] }),
10520
- /* @__PURE__ */ jsxs("div", { children: [
10521
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
10522
- CurrencyInput,
10523
- {
10524
- symbol: getNativeSymbol(currencyCode),
10525
- code: currencyCode,
10526
- onValueChange: (_value, _name, values) => onChange(values == null ? void 0 : values.value),
10527
- ...field
10528
- }
10529
- ) }),
10530
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10531
- ] })
10532
- ] }) })
10533
- }
10534
- ),
10535
- /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
10536
- /* @__PURE__ */ jsx(
10537
- Form$2.Field,
10538
- {
10539
- control: form.control,
10540
- name: "quantity",
10541
- render: ({ field }) => /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
10542
- /* @__PURE__ */ jsxs("div", { children: [
10543
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Quantity" }),
10544
- /* @__PURE__ */ jsx(Form$2.Hint, { children: "Enter the quantity of the item" })
10545
- ] }),
10546
- /* @__PURE__ */ jsxs("div", { className: "w-full flex-1", children: [
10547
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx("div", { className: "w-full flex-1", children: /* @__PURE__ */ jsx(NumberInput, { ...field, className: "w-full" }) }) }),
10548
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10549
- ] })
10550
- ] }) })
10551
- }
10552
- )
10553
- ] }) }) }),
10554
- /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10555
- /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10556
- /* @__PURE__ */ jsx(Button, { size: "small", type: "button", onClick: onSubmit, children: "Add item" })
10557
- ] }) })
10558
- ] }) }) });
10559
- };
10560
- const customItemSchema = objectType({
10561
- title: stringType().min(1),
10562
- quantity: numberType(),
10563
- unit_price: unionType([numberType(), stringType()])
10564
- });
10565
- const BillingAddress = () => {
10566
- const { id } = useParams();
10567
- const { order, isPending, isError, error } = useOrder(id, {
10568
- fields: "+billing_address"
10569
- });
10570
- if (isError) {
10571
- throw error;
10572
- }
10573
- const isReady = !isPending && !!order;
10574
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
10575
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
10576
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Billing Address" }) }),
10577
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
10578
- ] }),
10579
- isReady && /* @__PURE__ */ jsx(BillingAddressForm, { order })
10580
- ] });
10581
- };
10582
- const BillingAddressForm = ({ order }) => {
10583
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
10584
- const form = useForm({
10585
- defaultValues: {
10586
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
10587
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
10588
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
10589
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
10590
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
10591
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
10592
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
10593
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
10594
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
10595
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
10596
- },
10597
- resolver: zodResolver(schema$4)
10598
- });
10599
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10600
- const { handleSuccess } = useRouteModal();
10601
- const onSubmit = form.handleSubmit(async (data) => {
10602
- await mutateAsync(
10603
- { billing_address: data },
10604
- {
10605
- onSuccess: () => {
10606
- handleSuccess();
10607
- },
10608
- onError: (error) => {
10609
- toast.error(error.message);
10610
- }
10611
- }
10612
- );
10613
- });
10614
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
10615
- KeyboundForm,
10616
- {
10617
- className: "flex flex-1 flex-col overflow-hidden",
10618
- onSubmit,
10619
- children: [
10620
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
10621
- /* @__PURE__ */ jsx(
10622
- Form$2.Field,
10623
- {
10624
- control: form.control,
10625
- name: "country_code",
10626
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10627
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
10628
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
10629
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10630
- ] })
10631
- }
10632
- ),
10633
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10634
- /* @__PURE__ */ jsx(
10635
- Form$2.Field,
10636
- {
10637
- control: form.control,
10638
- name: "first_name",
10639
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10640
- /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
10641
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10642
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10643
- ] })
10644
- }
10645
- ),
10646
- /* @__PURE__ */ jsx(
10647
- Form$2.Field,
10648
- {
10649
- control: form.control,
10650
- name: "last_name",
10651
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10652
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
10653
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10654
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10655
- ] })
10656
- }
10657
- )
10658
- ] }),
10659
- /* @__PURE__ */ jsx(
10660
- Form$2.Field,
10661
- {
10662
- control: form.control,
10663
- name: "company",
10664
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10665
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
10666
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10667
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10668
- ] })
10669
- }
10670
- ),
10671
- /* @__PURE__ */ jsx(
10672
- Form$2.Field,
10673
- {
10674
- control: form.control,
10675
- name: "address_1",
10676
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10677
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
10678
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10679
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10680
- ] })
10681
- }
10682
- ),
10683
- /* @__PURE__ */ jsx(
10684
- Form$2.Field,
10685
- {
10686
- control: form.control,
10687
- name: "address_2",
10688
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10689
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
10690
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10691
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10692
- ] })
10693
- }
10694
- ),
10695
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
10696
- /* @__PURE__ */ jsx(
10697
- Form$2.Field,
10698
- {
10699
- control: form.control,
10700
- name: "postal_code",
10701
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10702
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
10703
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10704
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10705
- ] })
10589
+ },
10590
+ onError: (e) => {
10591
+ toast.error(e.message);
10592
+ }
10593
+ }
10594
+ );
10595
+ };
10596
+ if (isError) {
10597
+ throw error;
10598
+ }
10599
+ return /* @__PURE__ */ jsxs(
10600
+ StackedFocusModal.Content,
10601
+ {
10602
+ onOpenAutoFocus: (e) => {
10603
+ e.preventDefault();
10604
+ const searchInput = document.querySelector(
10605
+ "[data-modal-id='modal-search-input']"
10606
+ );
10607
+ if (searchInput) {
10608
+ searchInput.focus();
10609
+ }
10610
+ },
10611
+ children: [
10612
+ /* @__PURE__ */ jsxs(StackedFocusModal.Header, { children: [
10613
+ /* @__PURE__ */ jsx(StackedFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Product Variants" }) }),
10614
+ /* @__PURE__ */ jsx(StackedFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Choose product variants to add to the order." }) })
10615
+ ] }),
10616
+ /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsx(
10617
+ DataTable,
10618
+ {
10619
+ data: variants,
10620
+ columns,
10621
+ isLoading: isPending,
10622
+ getRowId: (row) => row.id,
10623
+ rowCount: count,
10624
+ prefix: VARIANT_PREFIX,
10625
+ layout: "fill",
10626
+ rowSelection: {
10627
+ state: rowSelection,
10628
+ onRowSelectionChange: setRowSelection,
10629
+ enableRowSelection: (row) => {
10630
+ return !items.find((i) => i.variant_id === row.original.id);
10706
10631
  }
10707
- ),
10632
+ },
10633
+ autoFocusSearch: true
10634
+ }
10635
+ ) }),
10636
+ /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10637
+ /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10638
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "button", onClick: onSubmit, children: "Update items" })
10639
+ ] }) })
10640
+ ]
10641
+ }
10642
+ );
10643
+ };
10644
+ const columnHelper = createDataTableColumnHelper();
10645
+ const useColumns = () => {
10646
+ return useMemo(() => {
10647
+ return [
10648
+ columnHelper.select(),
10649
+ columnHelper.accessor("product.title", {
10650
+ header: "Product",
10651
+ cell: ({ row }) => {
10652
+ var _a, _b, _c;
10653
+ return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-x-2", children: [
10708
10654
  /* @__PURE__ */ jsx(
10709
- Form$2.Field,
10655
+ Thumbnail,
10710
10656
  {
10711
- control: form.control,
10712
- name: "city",
10713
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10714
- /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
10715
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10716
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10717
- ] })
10657
+ thumbnail: (_a = row.original.product) == null ? void 0 : _a.thumbnail,
10658
+ alt: (_b = row.original.product) == null ? void 0 : _b.title
10718
10659
  }
10719
- )
10720
- ] }),
10721
- /* @__PURE__ */ jsx(
10722
- Form$2.Field,
10660
+ ),
10661
+ /* @__PURE__ */ jsx("span", { children: (_c = row.original.product) == null ? void 0 : _c.title })
10662
+ ] });
10663
+ },
10664
+ enableSorting: true
10665
+ }),
10666
+ columnHelper.accessor("title", {
10667
+ header: "Variant",
10668
+ enableSorting: true
10669
+ }),
10670
+ columnHelper.accessor("sku", {
10671
+ header: "SKU",
10672
+ cell: ({ getValue }) => {
10673
+ return getValue() ?? "-";
10674
+ },
10675
+ enableSorting: true
10676
+ }),
10677
+ columnHelper.accessor("updated_at", {
10678
+ header: "Updated",
10679
+ cell: ({ getValue }) => {
10680
+ return /* @__PURE__ */ jsx(
10681
+ Tooltip,
10723
10682
  {
10724
- control: form.control,
10725
- name: "province",
10726
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10727
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
10728
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10729
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10730
- ] })
10683
+ content: getFullDate({ date: getValue(), includeTime: true }),
10684
+ children: /* @__PURE__ */ jsx("span", { children: getFullDate({ date: getValue() }) })
10731
10685
  }
10732
- ),
10733
- /* @__PURE__ */ jsx(
10734
- Form$2.Field,
10686
+ );
10687
+ },
10688
+ enableSorting: true,
10689
+ sortAscLabel: "Oldest first",
10690
+ sortDescLabel: "Newest first"
10691
+ }),
10692
+ columnHelper.accessor("created_at", {
10693
+ header: "Created",
10694
+ cell: ({ getValue }) => {
10695
+ return /* @__PURE__ */ jsx(
10696
+ Tooltip,
10735
10697
  {
10736
- control: form.control,
10737
- name: "phone",
10738
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10739
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
10740
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10741
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10742
- ] })
10698
+ content: getFullDate({ date: getValue(), includeTime: true }),
10699
+ children: /* @__PURE__ */ jsx("span", { children: getFullDate({ date: getValue() }) })
10743
10700
  }
10744
- )
10745
- ] }) }),
10746
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
10747
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10748
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10749
- ] }) })
10750
- ]
10751
- }
10752
- ) });
10753
- };
10754
- const schema$4 = addressSchema;
10755
- const Email = () => {
10756
- const { id } = useParams();
10757
- const { order, isPending, isError, error } = useOrder(id, {
10758
- fields: "+email"
10759
- });
10760
- if (isError) {
10761
- throw error;
10762
- }
10763
- const isReady = !isPending && !!order;
10764
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
10765
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
10766
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Email" }) }),
10767
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
10768
- ] }),
10769
- isReady && /* @__PURE__ */ jsx(EmailForm, { order })
10770
- ] });
10701
+ );
10702
+ },
10703
+ enableSorting: true,
10704
+ sortAscLabel: "Oldest first",
10705
+ sortDescLabel: "Newest first"
10706
+ })
10707
+ ];
10708
+ }, []);
10771
10709
  };
10772
- const EmailForm = ({ order }) => {
10710
+ const CustomItemForm = ({ orderId, currencyCode }) => {
10711
+ const { setIsOpen } = useStackedModal();
10712
+ const { mutateAsync: addItems } = useDraftOrderAddItems(orderId);
10773
10713
  const form = useForm({
10774
10714
  defaultValues: {
10775
- email: order.email ?? ""
10715
+ title: "",
10716
+ quantity: 1,
10717
+ unit_price: ""
10776
10718
  },
10777
- resolver: zodResolver(schema$3)
10719
+ resolver: zodResolver(customItemSchema)
10778
10720
  });
10779
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10780
- const { handleSuccess } = useRouteModal();
10781
10721
  const onSubmit = form.handleSubmit(async (data) => {
10782
- await mutateAsync(
10783
- { email: data.email },
10722
+ await addItems(
10723
+ {
10724
+ items: [
10725
+ {
10726
+ title: data.title,
10727
+ quantity: data.quantity,
10728
+ unit_price: convertNumber(data.unit_price)
10729
+ }
10730
+ ]
10731
+ },
10784
10732
  {
10785
10733
  onSuccess: () => {
10786
- handleSuccess();
10734
+ setIsOpen(STACKED_MODAL_ID, false);
10787
10735
  },
10788
- onError: (error) => {
10789
- toast.error(error.message);
10736
+ onError: (e) => {
10737
+ toast.error(e.message);
10790
10738
  }
10791
10739
  }
10792
10740
  );
10793
10741
  });
10794
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
10795
- KeyboundForm,
10796
- {
10797
- className: "flex flex-1 flex-col overflow-hidden",
10798
- onSubmit,
10799
- children: [
10800
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsx(
10801
- Form$2.Field,
10802
- {
10803
- control: form.control,
10804
- name: "email",
10805
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
10806
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Email" }),
10742
+ return /* @__PURE__ */ jsx(Form$2, { ...form, children: /* @__PURE__ */ jsx(KeyboundForm, { onSubmit, children: /* @__PURE__ */ jsxs(StackedFocusModal.Content, { children: [
10743
+ /* @__PURE__ */ jsx(StackedFocusModal.Header, {}),
10744
+ /* @__PURE__ */ jsx(StackedFocusModal.Body, { className: "flex flex-1 flex-col overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "flex flex-1 flex-col items-center overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex w-full max-w-[720px] flex-col gap-y-6 px-2 py-16", children: [
10745
+ /* @__PURE__ */ jsxs("div", { children: [
10746
+ /* @__PURE__ */ jsx(StackedFocusModal.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Add custom item" }) }),
10747
+ /* @__PURE__ */ jsx(StackedFocusModal.Description, { asChild: true, children: /* @__PURE__ */ jsx(Text, { size: "small", className: "text-ui-fg-subtle", children: "Add a custom item to the order. This will add a new line item that is not associated with an existing product." }) })
10748
+ ] }),
10749
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
10750
+ /* @__PURE__ */ jsx(
10751
+ Form$2.Field,
10752
+ {
10753
+ control: form.control,
10754
+ name: "title",
10755
+ render: ({ field }) => /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
10756
+ /* @__PURE__ */ jsxs("div", { children: [
10757
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Title" }),
10758
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Enter the title of the item" })
10759
+ ] }),
10760
+ /* @__PURE__ */ jsxs("div", { children: [
10807
10761
  /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
10808
10762
  /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10809
10763
  ] })
10810
- }
10811
- ) }),
10812
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
10813
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10814
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10815
- ] }) })
10816
- ]
10817
- }
10818
- ) });
10764
+ ] }) })
10765
+ }
10766
+ ),
10767
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
10768
+ /* @__PURE__ */ jsx(
10769
+ Form$2.Field,
10770
+ {
10771
+ control: form.control,
10772
+ name: "unit_price",
10773
+ render: ({ field: { onChange, ...field } }) => /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
10774
+ /* @__PURE__ */ jsxs("div", { children: [
10775
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Unit price" }),
10776
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Enter the unit price of the item" })
10777
+ ] }),
10778
+ /* @__PURE__ */ jsxs("div", { children: [
10779
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
10780
+ CurrencyInput,
10781
+ {
10782
+ symbol: getNativeSymbol(currencyCode),
10783
+ code: currencyCode,
10784
+ onValueChange: (_value, _name, values) => onChange(values == null ? void 0 : values.value),
10785
+ ...field
10786
+ }
10787
+ ) }),
10788
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10789
+ ] })
10790
+ ] }) })
10791
+ }
10792
+ ),
10793
+ /* @__PURE__ */ jsx(Divider, { variant: "dashed" }),
10794
+ /* @__PURE__ */ jsx(
10795
+ Form$2.Field,
10796
+ {
10797
+ control: form.control,
10798
+ name: "quantity",
10799
+ render: ({ field }) => /* @__PURE__ */ jsx(Form$2.Item, { children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
10800
+ /* @__PURE__ */ jsxs("div", { children: [
10801
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Quantity" }),
10802
+ /* @__PURE__ */ jsx(Form$2.Hint, { children: "Enter the quantity of the item" })
10803
+ ] }),
10804
+ /* @__PURE__ */ jsxs("div", { className: "w-full flex-1", children: [
10805
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx("div", { className: "w-full flex-1", children: /* @__PURE__ */ jsx(NumberInput, { ...field, className: "w-full" }) }) }),
10806
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
10807
+ ] })
10808
+ ] }) })
10809
+ }
10810
+ )
10811
+ ] }) }) }),
10812
+ /* @__PURE__ */ jsx(StackedFocusModal.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10813
+ /* @__PURE__ */ jsx(StackedFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10814
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "button", onClick: onSubmit, children: "Add item" })
10815
+ ] }) })
10816
+ ] }) }) });
10819
10817
  };
10820
- const schema$3 = objectType({
10821
- email: stringType().email()
10818
+ const customItemSchema = objectType({
10819
+ title: stringType().min(1),
10820
+ quantity: numberType(),
10821
+ unit_price: unionType([numberType(), stringType()])
10822
10822
  });
10823
10823
  const InlineTip = forwardRef(
10824
10824
  ({ variant = "tip", label, className, children, ...props }, ref) => {
@@ -11530,232 +11530,29 @@ const SalesChannelField = ({ control, order }) => {
11530
11530
  control,
11531
11531
  name: "sales_channel_id",
11532
11532
  render: ({ field }) => {
11533
- return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11534
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11535
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11536
- Combobox,
11537
- {
11538
- options: salesChannels.options,
11539
- fetchNextPage: salesChannels.fetchNextPage,
11540
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11541
- searchValue: salesChannels.searchValue,
11542
- onSearchValueChange: salesChannels.onSearchValueChange,
11543
- placeholder: "Select sales channel",
11544
- ...field
11545
- }
11546
- ) }),
11547
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11548
- ] });
11549
- }
11550
- }
11551
- );
11552
- };
11553
- const schema$2 = objectType({
11554
- sales_channel_id: stringType().min(1)
11555
- });
11556
- const ShippingAddress = () => {
11557
- const { id } = useParams();
11558
- const { order, isPending, isError, error } = useOrder(id, {
11559
- fields: "+shipping_address"
11560
- });
11561
- if (isError) {
11562
- throw error;
11563
- }
11564
- const isReady = !isPending && !!order;
11565
- return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
11566
- /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
11567
- /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
11568
- /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
11569
- ] }),
11570
- isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
11571
- ] });
11572
- };
11573
- const ShippingAddressForm = ({ order }) => {
11574
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11575
- const form = useForm({
11576
- defaultValues: {
11577
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
11578
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
11579
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
11580
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
11581
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
11582
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
11583
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
11584
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
11585
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
11586
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
11587
- },
11588
- resolver: zodResolver(schema$1)
11589
- });
11590
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11591
- const { handleSuccess } = useRouteModal();
11592
- const onSubmit = form.handleSubmit(async (data) => {
11593
- await mutateAsync(
11594
- {
11595
- shipping_address: {
11596
- first_name: data.first_name,
11597
- last_name: data.last_name,
11598
- company: data.company,
11599
- address_1: data.address_1,
11600
- address_2: data.address_2,
11601
- city: data.city,
11602
- province: data.province,
11603
- country_code: data.country_code,
11604
- postal_code: data.postal_code,
11605
- phone: data.phone
11606
- }
11607
- },
11608
- {
11609
- onSuccess: () => {
11610
- handleSuccess();
11611
- },
11612
- onError: (error) => {
11613
- toast.error(error.message);
11614
- }
11615
- }
11616
- );
11617
- });
11618
- return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
11619
- KeyboundForm,
11620
- {
11621
- className: "flex flex-1 flex-col overflow-hidden",
11622
- onSubmit,
11623
- children: [
11624
- /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
11625
- /* @__PURE__ */ jsx(
11626
- Form$2.Field,
11627
- {
11628
- control: form.control,
11629
- name: "country_code",
11630
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11631
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
11632
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
11633
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11634
- ] })
11635
- }
11636
- ),
11637
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11638
- /* @__PURE__ */ jsx(
11639
- Form$2.Field,
11640
- {
11641
- control: form.control,
11642
- name: "first_name",
11643
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11644
- /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
11645
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11646
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11647
- ] })
11648
- }
11649
- ),
11650
- /* @__PURE__ */ jsx(
11651
- Form$2.Field,
11652
- {
11653
- control: form.control,
11654
- name: "last_name",
11655
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11656
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
11657
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11658
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11659
- ] })
11660
- }
11661
- )
11662
- ] }),
11663
- /* @__PURE__ */ jsx(
11664
- Form$2.Field,
11665
- {
11666
- control: form.control,
11667
- name: "company",
11668
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11669
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
11670
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11671
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11672
- ] })
11673
- }
11674
- ),
11675
- /* @__PURE__ */ jsx(
11676
- Form$2.Field,
11677
- {
11678
- control: form.control,
11679
- name: "address_1",
11680
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11681
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
11682
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11683
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11684
- ] })
11685
- }
11686
- ),
11687
- /* @__PURE__ */ jsx(
11688
- Form$2.Field,
11689
- {
11690
- control: form.control,
11691
- name: "address_2",
11692
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11693
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11694
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11695
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11696
- ] })
11697
- }
11698
- ),
11699
- /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11700
- /* @__PURE__ */ jsx(
11701
- Form$2.Field,
11702
- {
11703
- control: form.control,
11704
- name: "postal_code",
11705
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11706
- /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
11707
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11708
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11709
- ] })
11710
- }
11711
- ),
11712
- /* @__PURE__ */ jsx(
11713
- Form$2.Field,
11714
- {
11715
- control: form.control,
11716
- name: "city",
11717
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11718
- /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
11719
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11720
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11721
- ] })
11722
- }
11723
- )
11724
- ] }),
11725
- /* @__PURE__ */ jsx(
11726
- Form$2.Field,
11727
- {
11728
- control: form.control,
11729
- name: "province",
11730
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11731
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11732
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11733
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11734
- ] })
11735
- }
11736
- ),
11737
- /* @__PURE__ */ jsx(
11738
- Form$2.Field,
11739
- {
11740
- control: form.control,
11741
- name: "phone",
11742
- render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11743
- /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
11744
- /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
11745
- /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11746
- ] })
11533
+ return /* @__PURE__ */ jsxs(Form$2.Item, { children: [
11534
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Sales Channel" }),
11535
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(
11536
+ Combobox,
11537
+ {
11538
+ options: salesChannels.options,
11539
+ fetchNextPage: salesChannels.fetchNextPage,
11540
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11541
+ searchValue: salesChannels.searchValue,
11542
+ onSearchValueChange: salesChannels.onSearchValueChange,
11543
+ placeholder: "Select sales channel",
11544
+ ...field
11747
11545
  }
11748
- )
11749
- ] }) }),
11750
- /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
11751
- /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11752
- /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11753
- ] }) })
11754
- ]
11546
+ ) }),
11547
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
11548
+ ] });
11549
+ }
11755
11550
  }
11756
- ) });
11551
+ );
11757
11552
  };
11758
- const schema$1 = addressSchema;
11553
+ const schema$2 = objectType({
11554
+ sales_channel_id: stringType().min(1)
11555
+ });
11759
11556
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11760
11557
  const Shipping = () => {
11761
11558
  var _a;
@@ -12563,6 +12360,209 @@ const CustomAmountField = ({
12563
12360
  }
12564
12361
  );
12565
12362
  };
12363
+ const ShippingAddress = () => {
12364
+ const { id } = useParams();
12365
+ const { order, isPending, isError, error } = useOrder(id, {
12366
+ fields: "+shipping_address"
12367
+ });
12368
+ if (isError) {
12369
+ throw error;
12370
+ }
12371
+ const isReady = !isPending && !!order;
12372
+ return /* @__PURE__ */ jsxs(RouteDrawer, { children: [
12373
+ /* @__PURE__ */ jsxs(RouteDrawer.Header, { children: [
12374
+ /* @__PURE__ */ jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsx(Heading, { children: "Edit Shipping Address" }) }),
12375
+ /* @__PURE__ */ jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12376
+ ] }),
12377
+ isReady && /* @__PURE__ */ jsx(ShippingAddressForm, { order })
12378
+ ] });
12379
+ };
12380
+ const ShippingAddressForm = ({ order }) => {
12381
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12382
+ const form = useForm({
12383
+ defaultValues: {
12384
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12385
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12386
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12387
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12388
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12389
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12390
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12391
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12392
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12393
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12394
+ },
12395
+ resolver: zodResolver(schema$1)
12396
+ });
12397
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12398
+ const { handleSuccess } = useRouteModal();
12399
+ const onSubmit = form.handleSubmit(async (data) => {
12400
+ await mutateAsync(
12401
+ {
12402
+ shipping_address: {
12403
+ first_name: data.first_name,
12404
+ last_name: data.last_name,
12405
+ company: data.company,
12406
+ address_1: data.address_1,
12407
+ address_2: data.address_2,
12408
+ city: data.city,
12409
+ province: data.province,
12410
+ country_code: data.country_code,
12411
+ postal_code: data.postal_code,
12412
+ phone: data.phone
12413
+ }
12414
+ },
12415
+ {
12416
+ onSuccess: () => {
12417
+ handleSuccess();
12418
+ },
12419
+ onError: (error) => {
12420
+ toast.error(error.message);
12421
+ }
12422
+ }
12423
+ );
12424
+ });
12425
+ return /* @__PURE__ */ jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxs(
12426
+ KeyboundForm,
12427
+ {
12428
+ className: "flex flex-1 flex-col overflow-hidden",
12429
+ onSubmit,
12430
+ children: [
12431
+ /* @__PURE__ */ jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-4", children: [
12432
+ /* @__PURE__ */ jsx(
12433
+ Form$2.Field,
12434
+ {
12435
+ control: form.control,
12436
+ name: "country_code",
12437
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12438
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Country" }),
12439
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(CountrySelect, { ...field }) }),
12440
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12441
+ ] })
12442
+ }
12443
+ ),
12444
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12445
+ /* @__PURE__ */ jsx(
12446
+ Form$2.Field,
12447
+ {
12448
+ control: form.control,
12449
+ name: "first_name",
12450
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12451
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "First name" }),
12452
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12453
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12454
+ ] })
12455
+ }
12456
+ ),
12457
+ /* @__PURE__ */ jsx(
12458
+ Form$2.Field,
12459
+ {
12460
+ control: form.control,
12461
+ name: "last_name",
12462
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12463
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Last name" }),
12464
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12465
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12466
+ ] })
12467
+ }
12468
+ )
12469
+ ] }),
12470
+ /* @__PURE__ */ jsx(
12471
+ Form$2.Field,
12472
+ {
12473
+ control: form.control,
12474
+ name: "company",
12475
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12476
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Company" }),
12477
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12478
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12479
+ ] })
12480
+ }
12481
+ ),
12482
+ /* @__PURE__ */ jsx(
12483
+ Form$2.Field,
12484
+ {
12485
+ control: form.control,
12486
+ name: "address_1",
12487
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12488
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Address" }),
12489
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12490
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12491
+ ] })
12492
+ }
12493
+ ),
12494
+ /* @__PURE__ */ jsx(
12495
+ Form$2.Field,
12496
+ {
12497
+ control: form.control,
12498
+ name: "address_2",
12499
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12500
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12501
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12502
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12503
+ ] })
12504
+ }
12505
+ ),
12506
+ /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12507
+ /* @__PURE__ */ jsx(
12508
+ Form$2.Field,
12509
+ {
12510
+ control: form.control,
12511
+ name: "postal_code",
12512
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12513
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "Postal code" }),
12514
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12515
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12516
+ ] })
12517
+ }
12518
+ ),
12519
+ /* @__PURE__ */ jsx(
12520
+ Form$2.Field,
12521
+ {
12522
+ control: form.control,
12523
+ name: "city",
12524
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12525
+ /* @__PURE__ */ jsx(Form$2.Label, { children: "City" }),
12526
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12527
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12528
+ ] })
12529
+ }
12530
+ )
12531
+ ] }),
12532
+ /* @__PURE__ */ jsx(
12533
+ Form$2.Field,
12534
+ {
12535
+ control: form.control,
12536
+ name: "province",
12537
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12538
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12539
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12540
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12541
+ ] })
12542
+ }
12543
+ ),
12544
+ /* @__PURE__ */ jsx(
12545
+ Form$2.Field,
12546
+ {
12547
+ control: form.control,
12548
+ name: "phone",
12549
+ render: ({ field }) => /* @__PURE__ */ jsxs(Form$2.Item, { children: [
12550
+ /* @__PURE__ */ jsx(Form$2.Label, { optional: true, children: "Phone" }),
12551
+ /* @__PURE__ */ jsx(Form$2.Control, { children: /* @__PURE__ */ jsx(Input, { ...field }) }),
12552
+ /* @__PURE__ */ jsx(Form$2.ErrorMessage, {})
12553
+ ] })
12554
+ }
12555
+ )
12556
+ ] }) }),
12557
+ /* @__PURE__ */ jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2", children: [
12558
+ /* @__PURE__ */ jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12559
+ /* @__PURE__ */ jsx(Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12560
+ ] }) })
12561
+ ]
12562
+ }
12563
+ ) });
12564
+ };
12565
+ const schema$1 = addressSchema;
12566
12566
  const TransferOwnership = () => {
12567
12567
  const { id } = useParams();
12568
12568
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -13059,22 +13059,22 @@ const routeModule = {
13059
13059
  handle,
13060
13060
  loader,
13061
13061
  children: [
13062
- {
13063
- Component: CustomItems,
13064
- path: "/draft-orders/:id/custom-items"
13065
- },
13066
- {
13067
- Component: Items,
13068
- path: "/draft-orders/:id/items"
13069
- },
13070
13062
  {
13071
13063
  Component: BillingAddress,
13072
13064
  path: "/draft-orders/:id/billing-address"
13073
13065
  },
13066
+ {
13067
+ Component: CustomItems,
13068
+ path: "/draft-orders/:id/custom-items"
13069
+ },
13074
13070
  {
13075
13071
  Component: Email,
13076
13072
  path: "/draft-orders/:id/email"
13077
13073
  },
13074
+ {
13075
+ Component: Items,
13076
+ path: "/draft-orders/:id/items"
13077
+ },
13078
13078
  {
13079
13079
  Component: Metadata,
13080
13080
  path: "/draft-orders/:id/metadata"
@@ -13087,14 +13087,14 @@ const routeModule = {
13087
13087
  Component: SalesChannel,
13088
13088
  path: "/draft-orders/:id/sales-channel"
13089
13089
  },
13090
- {
13091
- Component: ShippingAddress,
13092
- path: "/draft-orders/:id/shipping-address"
13093
- },
13094
13090
  {
13095
13091
  Component: Shipping,
13096
13092
  path: "/draft-orders/:id/shipping"
13097
13093
  },
13094
+ {
13095
+ Component: ShippingAddress,
13096
+ path: "/draft-orders/:id/shipping-address"
13097
+ },
13098
13098
  {
13099
13099
  Component: TransferOwnership,
13100
13100
  path: "/draft-orders/:id/transfer-ownership"