@medusajs/draft-order 2.11.0 → 2.11.1-preview-20251021180206

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.
Files changed (3) hide show
  1. package/.medusa/server/src/admin/index.js +624 -624
  2. package/.medusa/server/src/admin/index.mjs +624 -624
  3. package/package.json +24 -22
package/.medusa/server/src/admin/index.js CHANGED
@@ -9571,31 +9571,10 @@ const ID = () => {
9571
9571
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9572
9572
  ] });
9573
9573
  };
9574
- const CustomItems = () => {
9575
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9576
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9577
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9578
- ] });
9579
- };
9580
- const CustomItemsForm = () => {
9581
- const form = reactHookForm.useForm({
9582
- resolver: zod.zodResolver(schema$5)
9583
- });
9584
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9585
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9586
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9587
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9588
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9589
- ] }) })
9590
- ] }) });
9591
- };
9592
- const schema$5 = objectType({
9593
- email: stringType().email()
9594
- });
9595
- const BillingAddress = () => {
9574
+ const Email = () => {
9596
9575
  const { id } = reactRouterDom.useParams();
9597
9576
  const { order, isPending, isError, error } = useOrder(id, {
9598
- fields: "+billing_address"
9577
+ fields: "+email"
9599
9578
  });
9600
9579
  if (isError) {
9601
9580
  throw error;
@@ -9603,34 +9582,24 @@ const BillingAddress = () => {
9603
9582
  const isReady = !isPending && !!order;
9604
9583
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9605
9584
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9606
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9607
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9585
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
9586
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9608
9587
  ] }),
9609
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9588
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
9610
9589
  ] });
9611
9590
  };
9612
- const BillingAddressForm = ({ order }) => {
9613
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9591
+ const EmailForm = ({ order }) => {
9614
9592
  const form = reactHookForm.useForm({
9615
9593
  defaultValues: {
9616
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9617
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9618
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9619
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9620
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9621
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9622
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9623
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9624
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9625
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9594
+ email: order.email ?? ""
9626
9595
  },
9627
- resolver: zod.zodResolver(schema$4)
9596
+ resolver: zod.zodResolver(schema$5)
9628
9597
  });
9629
9598
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9630
9599
  const { handleSuccess } = useRouteModal();
9631
9600
  const onSubmit = form.handleSubmit(async (data) => {
9632
9601
  await mutateAsync(
9633
- { billing_address: data },
9602
+ { email: data.email },
9634
9603
  {
9635
9604
  onSuccess: () => {
9636
9605
  handleSuccess();
@@ -9647,132 +9616,18 @@ const BillingAddressForm = ({ order }) => {
9647
9616
  className: "flex flex-1 flex-col overflow-hidden",
9648
9617
  onSubmit,
9649
9618
  children: [
9650
- /* @__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: [
9651
- /* @__PURE__ */ jsxRuntime.jsx(
9652
- Form$2.Field,
9653
- {
9654
- control: form.control,
9655
- name: "country_code",
9656
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9657
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9658
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9659
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9660
- ] })
9661
- }
9662
- ),
9663
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9664
- /* @__PURE__ */ jsxRuntime.jsx(
9665
- Form$2.Field,
9666
- {
9667
- control: form.control,
9668
- name: "first_name",
9669
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9670
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9671
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9672
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9673
- ] })
9674
- }
9675
- ),
9676
- /* @__PURE__ */ jsxRuntime.jsx(
9677
- Form$2.Field,
9678
- {
9679
- control: form.control,
9680
- name: "last_name",
9681
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9682
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9683
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9684
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9685
- ] })
9686
- }
9687
- )
9688
- ] }),
9689
- /* @__PURE__ */ jsxRuntime.jsx(
9690
- Form$2.Field,
9691
- {
9692
- control: form.control,
9693
- name: "company",
9694
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9695
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9696
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9697
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9698
- ] })
9699
- }
9700
- ),
9701
- /* @__PURE__ */ jsxRuntime.jsx(
9702
- Form$2.Field,
9703
- {
9704
- control: form.control,
9705
- name: "address_1",
9706
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9707
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9708
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9709
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9710
- ] })
9711
- }
9712
- ),
9713
- /* @__PURE__ */ jsxRuntime.jsx(
9714
- Form$2.Field,
9715
- {
9716
- control: form.control,
9717
- name: "address_2",
9718
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9719
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9720
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9721
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9722
- ] })
9723
- }
9724
- ),
9725
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9726
- /* @__PURE__ */ jsxRuntime.jsx(
9727
- Form$2.Field,
9728
- {
9729
- control: form.control,
9730
- name: "postal_code",
9731
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9732
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9733
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9734
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9735
- ] })
9736
- }
9737
- ),
9738
- /* @__PURE__ */ jsxRuntime.jsx(
9739
- Form$2.Field,
9740
- {
9741
- control: form.control,
9742
- name: "city",
9743
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9744
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9745
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9746
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9747
- ] })
9748
- }
9749
- )
9750
- ] }),
9751
- /* @__PURE__ */ jsxRuntime.jsx(
9752
- Form$2.Field,
9753
- {
9754
- control: form.control,
9755
- name: "province",
9756
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9757
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9758
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9759
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9760
- ] })
9761
- }
9762
- ),
9763
- /* @__PURE__ */ jsxRuntime.jsx(
9764
- Form$2.Field,
9765
- {
9766
- control: form.control,
9767
- name: "phone",
9768
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9769
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9770
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9771
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9772
- ] })
9773
- }
9774
- )
9775
- ] }) }),
9619
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
9620
+ Form$2.Field,
9621
+ {
9622
+ control: form.control,
9623
+ name: "email",
9624
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9625
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
9626
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9627
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9628
+ ] })
9629
+ }
9630
+ ) }),
9776
9631
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9777
9632
  /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9778
9633
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
@@ -9781,7 +9636,30 @@ const BillingAddressForm = ({ order }) => {
9781
9636
  }
9782
9637
  ) });
9783
9638
  };
9784
- const schema$4 = addressSchema;
9639
+ const schema$5 = objectType({
9640
+ email: stringType().email()
9641
+ });
9642
+ const CustomItems = () => {
9643
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9644
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9645
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9646
+ ] });
9647
+ };
9648
+ const CustomItemsForm = () => {
9649
+ const form = reactHookForm.useForm({
9650
+ resolver: zod.zodResolver(schema$4)
9651
+ });
9652
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9653
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9654
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9655
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9656
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9657
+ ] }) })
9658
+ ] }) });
9659
+ };
9660
+ const schema$4 = objectType({
9661
+ email: stringType().email()
9662
+ });
9785
9663
  const NumberInput = React.forwardRef(
9786
9664
  ({
9787
9665
  value,
@@ -10756,10 +10634,54 @@ const customItemSchema = objectType({
10756
10634
  quantity: numberType(),
10757
10635
  unit_price: unionType([numberType(), stringType()])
10758
10636
  });
10759
- const Email = () => {
10637
+ const InlineTip = React.forwardRef(
10638
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10639
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10640
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10641
+ "div",
10642
+ {
10643
+ ref,
10644
+ className: ui.clx(
10645
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10646
+ className
10647
+ ),
10648
+ ...props,
10649
+ children: [
10650
+ /* @__PURE__ */ jsxRuntime.jsx(
10651
+ "div",
10652
+ {
10653
+ role: "presentation",
10654
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10655
+ "bg-ui-tag-orange-icon": variant === "warning"
10656
+ })
10657
+ }
10658
+ ),
10659
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10660
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10661
+ labelValue,
10662
+ ":"
10663
+ ] }),
10664
+ " ",
10665
+ children
10666
+ ] })
10667
+ ]
10668
+ }
10669
+ );
10670
+ }
10671
+ );
10672
+ InlineTip.displayName = "InlineTip";
10673
+ const MetadataFieldSchema = objectType({
10674
+ key: stringType(),
10675
+ disabled: booleanType().optional(),
10676
+ value: anyType()
10677
+ });
10678
+ const MetadataSchema = objectType({
10679
+ metadata: arrayType(MetadataFieldSchema)
10680
+ });
10681
+ const Metadata = () => {
10760
10682
  const { id } = reactRouterDom.useParams();
10761
10683
  const { order, isPending, isError, error } = useOrder(id, {
10762
- fields: "+email"
10684
+ fields: "metadata"
10763
10685
  });
10764
10686
  if (isError) {
10765
10687
  throw error;
@@ -10767,26 +10689,33 @@ const Email = () => {
10767
10689
  const isReady = !isPending && !!order;
10768
10690
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10769
10691
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10770
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
10771
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
10692
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10693
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10772
10694
  ] }),
10773
- isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
10695
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10774
10696
  ] });
10775
10697
  };
10776
- const EmailForm = ({ order }) => {
10698
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10699
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10700
+ const MetadataForm = ({ orderId, metadata }) => {
10701
+ const { handleSuccess } = useRouteModal();
10702
+ const hasUneditableRows = getHasUneditableRows(metadata);
10703
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10777
10704
  const form = reactHookForm.useForm({
10778
10705
  defaultValues: {
10779
- email: order.email ?? ""
10706
+ metadata: getDefaultValues(metadata)
10780
10707
  },
10781
- resolver: zod.zodResolver(schema$3)
10708
+ resolver: zod.zodResolver(MetadataSchema)
10782
10709
  });
10783
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10784
- const { handleSuccess } = useRouteModal();
10785
- const onSubmit = form.handleSubmit(async (data) => {
10710
+ const handleSubmit = form.handleSubmit(async (data) => {
10711
+ const parsedData = parseValues(data);
10786
10712
  await mutateAsync(
10787
- { email: data.email },
10713
+ {
10714
+ metadata: parsedData
10715
+ },
10788
10716
  {
10789
10717
  onSuccess: () => {
10718
+ ui.toast.success("Metadata updated");
10790
10719
  handleSuccess();
10791
10720
  },
10792
10721
  onError: (error) => {
@@ -10795,141 +10724,266 @@ const EmailForm = ({ order }) => {
10795
10724
  }
10796
10725
  );
10797
10726
  });
10727
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
10728
+ control: form.control,
10729
+ name: "metadata"
10730
+ });
10731
+ function deleteRow(index) {
10732
+ remove(index);
10733
+ if (fields.length === 1) {
10734
+ insert(0, {
10735
+ key: "",
10736
+ value: "",
10737
+ disabled: false
10738
+ });
10739
+ }
10740
+ }
10741
+ function insertRow(index, position) {
10742
+ insert(index + (position === "above" ? 0 : 1), {
10743
+ key: "",
10744
+ value: "",
10745
+ disabled: false
10746
+ });
10747
+ }
10798
10748
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10799
10749
  KeyboundForm,
10800
10750
  {
10751
+ onSubmit: handleSubmit,
10801
10752
  className: "flex flex-1 flex-col overflow-hidden",
10802
- onSubmit,
10803
10753
  children: [
10804
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
10805
- Form$2.Field,
10806
- {
10807
- control: form.control,
10808
- name: "email",
10809
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10810
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
10811
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10812
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10813
- ] })
10814
- }
10815
- ) }),
10816
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10817
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10754
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10755
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10756
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10757
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
10758
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
10759
+ ] }),
10760
+ fields.map((field, index) => {
10761
+ const isDisabled = field.disabled || false;
10762
+ let placeholder = "-";
10763
+ if (typeof field.value === "object") {
10764
+ placeholder = "{ ... }";
10765
+ }
10766
+ if (Array.isArray(field.value)) {
10767
+ placeholder = "[ ... ]";
10768
+ }
10769
+ return /* @__PURE__ */ jsxRuntime.jsx(
10770
+ ConditionalTooltip,
10771
+ {
10772
+ showTooltip: isDisabled,
10773
+ content: "This row is disabled because it contains non-primitive data.",
10774
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10775
+ /* @__PURE__ */ jsxRuntime.jsxs(
10776
+ "div",
10777
+ {
10778
+ className: ui.clx("grid grid-cols-2 divide-x", {
10779
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
10780
+ }),
10781
+ children: [
10782
+ /* @__PURE__ */ jsxRuntime.jsx(
10783
+ Form$2.Field,
10784
+ {
10785
+ control: form.control,
10786
+ name: `metadata.${index}.key`,
10787
+ render: ({ field: field2 }) => {
10788
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10789
+ GridInput,
10790
+ {
10791
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
10792
+ ...field2,
10793
+ disabled: isDisabled,
10794
+ placeholder: "Key"
10795
+ }
10796
+ ) }) });
10797
+ }
10798
+ }
10799
+ ),
10800
+ /* @__PURE__ */ jsxRuntime.jsx(
10801
+ Form$2.Field,
10802
+ {
10803
+ control: form.control,
10804
+ name: `metadata.${index}.value`,
10805
+ render: ({ field: { value, ...field2 } }) => {
10806
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10807
+ GridInput,
10808
+ {
10809
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
10810
+ ...field2,
10811
+ value: isDisabled ? placeholder : value,
10812
+ disabled: isDisabled,
10813
+ placeholder: "Value"
10814
+ }
10815
+ ) }) });
10816
+ }
10817
+ }
10818
+ )
10819
+ ]
10820
+ }
10821
+ ),
10822
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
10823
+ /* @__PURE__ */ jsxRuntime.jsx(
10824
+ ui.DropdownMenu.Trigger,
10825
+ {
10826
+ className: ui.clx(
10827
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
10828
+ {
10829
+ hidden: isDisabled
10830
+ }
10831
+ ),
10832
+ disabled: isDisabled,
10833
+ asChild: true,
10834
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
10835
+ }
10836
+ ),
10837
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
10838
+ /* @__PURE__ */ jsxRuntime.jsxs(
10839
+ ui.DropdownMenu.Item,
10840
+ {
10841
+ className: "gap-x-2",
10842
+ onClick: () => insertRow(index, "above"),
10843
+ children: [
10844
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
10845
+ "Insert row above"
10846
+ ]
10847
+ }
10848
+ ),
10849
+ /* @__PURE__ */ jsxRuntime.jsxs(
10850
+ ui.DropdownMenu.Item,
10851
+ {
10852
+ className: "gap-x-2",
10853
+ onClick: () => insertRow(index, "below"),
10854
+ children: [
10855
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
10856
+ "Insert row below"
10857
+ ]
10858
+ }
10859
+ ),
10860
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
10861
+ /* @__PURE__ */ jsxRuntime.jsxs(
10862
+ ui.DropdownMenu.Item,
10863
+ {
10864
+ className: "gap-x-2",
10865
+ onClick: () => deleteRow(index),
10866
+ children: [
10867
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
10868
+ "Delete row"
10869
+ ]
10870
+ }
10871
+ )
10872
+ ] })
10873
+ ] })
10874
+ ] })
10875
+ },
10876
+ field.id
10877
+ );
10878
+ })
10879
+ ] }),
10880
+ hasUneditableRows && /* @__PURE__ */ jsxRuntime.jsx(InlineTip, { variant: "warning", label: "Some rows are disabled", children: "This object contains non-primitive metadata, such as arrays or objects, that can't be edited here. To edit the disabled rows, use the API directly." })
10881
+ ] }),
10882
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10883
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10818
10884
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10819
10885
  ] }) })
10820
10886
  ]
10821
10887
  }
10822
10888
  ) });
10823
10889
  };
10824
- const schema$3 = objectType({
10825
- email: stringType().email()
10826
- });
10827
- const SalesChannel = () => {
10828
- const { id } = reactRouterDom.useParams();
10829
- const { draft_order, isPending, isError, error } = useDraftOrder(
10830
- id,
10831
- {
10832
- fields: "+sales_channel_id"
10833
- },
10890
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
10891
+ return /* @__PURE__ */ jsxRuntime.jsx(
10892
+ "input",
10834
10893
  {
10835
- enabled: !!id
10894
+ ref,
10895
+ ...props,
10896
+ autoComplete: "off",
10897
+ className: ui.clx(
10898
+ "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
10899
+ className
10900
+ )
10836
10901
  }
10837
10902
  );
10838
- if (isError) {
10839
- throw error;
10840
- }
10841
- const ISrEADY = !!draft_order && !isPending;
10842
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10843
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10844
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
10845
- /* @__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" }) })
10846
- ] }),
10847
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
10903
+ });
10904
+ GridInput.displayName = "MetadataForm.GridInput";
10905
+ const PlaceholderInner = () => {
10906
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
10907
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
10908
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10909
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
10910
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
10911
+ ] }) })
10848
10912
  ] });
10849
10913
  };
10850
- const SalesChannelForm = ({ order }) => {
10851
- const form = reactHookForm.useForm({
10852
- defaultValues: {
10853
- sales_channel_id: order.sales_channel_id || ""
10854
- },
10855
- resolver: zod.zodResolver(schema$2)
10856
- });
10857
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10858
- const { handleSuccess } = useRouteModal();
10859
- const onSubmit = form.handleSubmit(async (data) => {
10860
- await mutateAsync(
10861
- {
10862
- sales_channel_id: data.sales_channel_id
10863
- },
10914
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
10915
+ function getDefaultValues(metadata) {
10916
+ if (!metadata || !Object.keys(metadata).length) {
10917
+ return [
10864
10918
  {
10865
- onSuccess: () => {
10866
- ui.toast.success("Sales channel updated");
10867
- handleSuccess();
10868
- },
10869
- onError: (error) => {
10870
- ui.toast.error(error.message);
10871
- }
10919
+ key: "",
10920
+ value: "",
10921
+ disabled: false
10872
10922
  }
10873
- );
10874
- });
10875
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10876
- KeyboundForm,
10877
- {
10878
- className: "flex flex-1 flex-col overflow-hidden",
10879
- onSubmit,
10880
- children: [
10881
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
10882
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10883
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10884
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10885
- ] }) })
10886
- ]
10923
+ ];
10924
+ }
10925
+ return Object.entries(metadata).map(([key, value]) => {
10926
+ if (!EDITABLE_TYPES.includes(typeof value)) {
10927
+ return {
10928
+ key,
10929
+ value,
10930
+ disabled: true
10931
+ };
10887
10932
  }
10888
- ) });
10889
- };
10890
- const SalesChannelField = ({ control, order }) => {
10891
- const salesChannels = useComboboxData({
10892
- queryFn: async (params) => {
10893
- return await sdk.admin.salesChannel.list(params);
10894
- },
10895
- queryKey: ["sales-channels"],
10896
- getOptions: (data) => {
10897
- return data.sales_channels.map((salesChannel) => ({
10898
- label: salesChannel.name,
10899
- value: salesChannel.id
10900
- }));
10901
- },
10902
- defaultValue: order.sales_channel_id || void 0
10933
+ let stringValue = value;
10934
+ if (typeof value !== "string") {
10935
+ stringValue = JSON.stringify(value);
10936
+ }
10937
+ return {
10938
+ key,
10939
+ value: stringValue,
10940
+ original_key: key
10941
+ };
10903
10942
  });
10904
- return /* @__PURE__ */ jsxRuntime.jsx(
10905
- Form$2.Field,
10906
- {
10907
- control,
10908
- name: "sales_channel_id",
10909
- render: ({ field }) => {
10910
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10911
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
10912
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10913
- Combobox,
10914
- {
10915
- options: salesChannels.options,
10916
- fetchNextPage: salesChannels.fetchNextPage,
10917
- isFetchingNextPage: salesChannels.isFetchingNextPage,
10918
- searchValue: salesChannels.searchValue,
10919
- onSearchValueChange: salesChannels.onSearchValueChange,
10920
- placeholder: "Select sales channel",
10921
- ...field
10922
- }
10923
- ) }),
10924
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10925
- ] });
10943
+ }
10944
+ function parseValues(values) {
10945
+ const metadata = values.metadata;
10946
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
10947
+ if (isEmpty) {
10948
+ return null;
10949
+ }
10950
+ const update = {};
10951
+ metadata.forEach((field) => {
10952
+ let key = field.key;
10953
+ let value = field.value;
10954
+ const disabled = field.disabled;
10955
+ if (!key || !value) {
10956
+ return;
10957
+ }
10958
+ if (disabled) {
10959
+ update[key] = value;
10960
+ return;
10961
+ }
10962
+ key = key.trim();
10963
+ value = value.trim();
10964
+ if (value === "true") {
10965
+ update[key] = true;
10966
+ } else if (value === "false") {
10967
+ update[key] = false;
10968
+ } else {
10969
+ const parsedNumber = parseFloat(value);
10970
+ if (!isNaN(parsedNumber)) {
10971
+ update[key] = parsedNumber;
10972
+ } else {
10973
+ update[key] = value;
10926
10974
  }
10927
10975
  }
10976
+ });
10977
+ return update;
10978
+ }
10979
+ function getHasUneditableRows(metadata) {
10980
+ if (!metadata) {
10981
+ return false;
10982
+ }
10983
+ return Object.values(metadata).some(
10984
+ (value) => !EDITABLE_TYPES.includes(typeof value)
10928
10985
  );
10929
- };
10930
- const schema$2 = objectType({
10931
- sales_channel_id: stringType().min(1)
10932
- });
10986
+ }
10933
10987
  const PROMOTION_QUERY_KEY = "promotions";
10934
10988
  const promotionsQueryKeys = {
10935
10989
  list: (query2) => [
@@ -11204,9 +11258,115 @@ function getPromotionIds(items, shippingMethods) {
11204
11258
  }
11205
11259
  }
11206
11260
  }
11207
- }
11208
- return Array.from(promotionIds);
11209
- }
11261
+ }
11262
+ return Array.from(promotionIds);
11263
+ }
11264
+ const SalesChannel = () => {
11265
+ const { id } = reactRouterDom.useParams();
11266
+ const { draft_order, isPending, isError, error } = useDraftOrder(
11267
+ id,
11268
+ {
11269
+ fields: "+sales_channel_id"
11270
+ },
11271
+ {
11272
+ enabled: !!id
11273
+ }
11274
+ );
11275
+ if (isError) {
11276
+ throw error;
11277
+ }
11278
+ const ISrEADY = !!draft_order && !isPending;
11279
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11280
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11281
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11282
+ /* @__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" }) })
11283
+ ] }),
11284
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11285
+ ] });
11286
+ };
11287
+ const SalesChannelForm = ({ order }) => {
11288
+ const form = reactHookForm.useForm({
11289
+ defaultValues: {
11290
+ sales_channel_id: order.sales_channel_id || ""
11291
+ },
11292
+ resolver: zod.zodResolver(schema$3)
11293
+ });
11294
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11295
+ const { handleSuccess } = useRouteModal();
11296
+ const onSubmit = form.handleSubmit(async (data) => {
11297
+ await mutateAsync(
11298
+ {
11299
+ sales_channel_id: data.sales_channel_id
11300
+ },
11301
+ {
11302
+ onSuccess: () => {
11303
+ ui.toast.success("Sales channel updated");
11304
+ handleSuccess();
11305
+ },
11306
+ onError: (error) => {
11307
+ ui.toast.error(error.message);
11308
+ }
11309
+ }
11310
+ );
11311
+ });
11312
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11313
+ KeyboundForm,
11314
+ {
11315
+ className: "flex flex-1 flex-col overflow-hidden",
11316
+ onSubmit,
11317
+ children: [
11318
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11319
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11320
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11321
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11322
+ ] }) })
11323
+ ]
11324
+ }
11325
+ ) });
11326
+ };
11327
+ const SalesChannelField = ({ control, order }) => {
11328
+ const salesChannels = useComboboxData({
11329
+ queryFn: async (params) => {
11330
+ return await sdk.admin.salesChannel.list(params);
11331
+ },
11332
+ queryKey: ["sales-channels"],
11333
+ getOptions: (data) => {
11334
+ return data.sales_channels.map((salesChannel) => ({
11335
+ label: salesChannel.name,
11336
+ value: salesChannel.id
11337
+ }));
11338
+ },
11339
+ defaultValue: order.sales_channel_id || void 0
11340
+ });
11341
+ return /* @__PURE__ */ jsxRuntime.jsx(
11342
+ Form$2.Field,
11343
+ {
11344
+ control,
11345
+ name: "sales_channel_id",
11346
+ render: ({ field }) => {
11347
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11348
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11349
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11350
+ Combobox,
11351
+ {
11352
+ options: salesChannels.options,
11353
+ fetchNextPage: salesChannels.fetchNextPage,
11354
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
11355
+ searchValue: salesChannels.searchValue,
11356
+ onSearchValueChange: salesChannels.onSearchValueChange,
11357
+ placeholder: "Select sales channel",
11358
+ ...field
11359
+ }
11360
+ ) }),
11361
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11362
+ ] });
11363
+ }
11364
+ }
11365
+ );
11366
+ };
11367
+ const schema$3 = objectType({
11368
+ sales_channel_id: stringType().min(1)
11369
+ });
11210
11370
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11211
11371
  const Shipping = () => {
11212
11372
  var _a;
@@ -12046,7 +12206,7 @@ const ShippingAddressForm = ({ order }) => {
12046
12206
  postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12047
12207
  phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12048
12208
  },
12049
- resolver: zod.zodResolver(schema$1)
12209
+ resolver: zod.zodResolver(schema$2)
12050
12210
  });
12051
12211
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12052
12212
  const { handleSuccess } = useRouteModal();
@@ -12216,7 +12376,7 @@ const ShippingAddressForm = ({ order }) => {
12216
12376
  }
12217
12377
  ) });
12218
12378
  };
12219
- const schema$1 = addressSchema;
12379
+ const schema$2 = addressSchema;
12220
12380
  const TransferOwnership = () => {
12221
12381
  const { id } = reactRouterDom.useParams();
12222
12382
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12240,7 +12400,7 @@ const TransferOwnershipForm = ({ order }) => {
12240
12400
  defaultValues: {
12241
12401
  customer_id: order.customer_id || ""
12242
12402
  },
12243
- resolver: zod.zodResolver(schema)
12403
+ resolver: zod.zodResolver(schema$1)
12244
12404
  });
12245
12405
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12246
12406
  const { handleSuccess } = useRouteModal();
@@ -12690,57 +12850,13 @@ const Illustration = () => {
12690
12850
  }
12691
12851
  );
12692
12852
  };
12693
- const schema = objectType({
12853
+ const schema$1 = objectType({
12694
12854
  customer_id: stringType().min(1)
12695
12855
  });
12696
- const InlineTip = React.forwardRef(
12697
- ({ variant = "tip", label, className, children, ...props }, ref) => {
12698
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
12699
- return /* @__PURE__ */ jsxRuntime.jsxs(
12700
- "div",
12701
- {
12702
- ref,
12703
- className: ui.clx(
12704
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
12705
- className
12706
- ),
12707
- ...props,
12708
- children: [
12709
- /* @__PURE__ */ jsxRuntime.jsx(
12710
- "div",
12711
- {
12712
- role: "presentation",
12713
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
12714
- "bg-ui-tag-orange-icon": variant === "warning"
12715
- })
12716
- }
12717
- ),
12718
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
12719
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
12720
- labelValue,
12721
- ":"
12722
- ] }),
12723
- " ",
12724
- children
12725
- ] })
12726
- ]
12727
- }
12728
- );
12729
- }
12730
- );
12731
- InlineTip.displayName = "InlineTip";
12732
- const MetadataFieldSchema = objectType({
12733
- key: stringType(),
12734
- disabled: booleanType().optional(),
12735
- value: anyType()
12736
- });
12737
- const MetadataSchema = objectType({
12738
- metadata: arrayType(MetadataFieldSchema)
12739
- });
12740
- const Metadata = () => {
12856
+ const BillingAddress = () => {
12741
12857
  const { id } = reactRouterDom.useParams();
12742
12858
  const { order, isPending, isError, error } = useOrder(id, {
12743
- fields: "metadata"
12859
+ fields: "+billing_address"
12744
12860
  });
12745
12861
  if (isError) {
12746
12862
  throw error;
@@ -12748,33 +12864,36 @@ const Metadata = () => {
12748
12864
  const isReady = !isPending && !!order;
12749
12865
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12750
12866
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12751
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
12752
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
12867
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
12868
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
12753
12869
  ] }),
12754
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
12870
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
12755
12871
  ] });
12756
12872
  };
12757
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
12758
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
12759
- const MetadataForm = ({ orderId, metadata }) => {
12760
- const { handleSuccess } = useRouteModal();
12761
- const hasUneditableRows = getHasUneditableRows(metadata);
12762
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
12873
+ const BillingAddressForm = ({ order }) => {
12874
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12763
12875
  const form = reactHookForm.useForm({
12764
12876
  defaultValues: {
12765
- metadata: getDefaultValues(metadata)
12877
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
12878
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
12879
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
12880
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
12881
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
12882
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
12883
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
12884
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
12885
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
12886
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
12766
12887
  },
12767
- resolver: zod.zodResolver(MetadataSchema)
12888
+ resolver: zod.zodResolver(schema)
12768
12889
  });
12769
- const handleSubmit = form.handleSubmit(async (data) => {
12770
- const parsedData = parseValues(data);
12890
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12891
+ const { handleSuccess } = useRouteModal();
12892
+ const onSubmit = form.handleSubmit(async (data) => {
12771
12893
  await mutateAsync(
12772
- {
12773
- metadata: parsedData
12774
- },
12894
+ { billing_address: data },
12775
12895
  {
12776
12896
  onSuccess: () => {
12777
- ui.toast.success("Metadata updated");
12778
12897
  handleSuccess();
12779
12898
  },
12780
12899
  onError: (error) => {
@@ -12783,266 +12902,147 @@ const MetadataForm = ({ orderId, metadata }) => {
12783
12902
  }
12784
12903
  );
12785
12904
  });
12786
- const { fields, insert, remove } = reactHookForm.useFieldArray({
12787
- control: form.control,
12788
- name: "metadata"
12789
- });
12790
- function deleteRow(index) {
12791
- remove(index);
12792
- if (fields.length === 1) {
12793
- insert(0, {
12794
- key: "",
12795
- value: "",
12796
- disabled: false
12797
- });
12798
- }
12799
- }
12800
- function insertRow(index, position) {
12801
- insert(index + (position === "above" ? 0 : 1), {
12802
- key: "",
12803
- value: "",
12804
- disabled: false
12805
- });
12806
- }
12807
12905
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12808
12906
  KeyboundForm,
12809
- {
12810
- onSubmit: handleSubmit,
12811
- className: "flex flex-1 flex-col overflow-hidden",
12812
- children: [
12813
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
12814
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
12815
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
12816
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
12817
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
12818
- ] }),
12819
- fields.map((field, index) => {
12820
- const isDisabled = field.disabled || false;
12821
- let placeholder = "-";
12822
- if (typeof field.value === "object") {
12823
- placeholder = "{ ... }";
12824
- }
12825
- if (Array.isArray(field.value)) {
12826
- placeholder = "[ ... ]";
12827
- }
12828
- return /* @__PURE__ */ jsxRuntime.jsx(
12829
- ConditionalTooltip,
12830
- {
12831
- showTooltip: isDisabled,
12832
- content: "This row is disabled because it contains non-primitive data.",
12833
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
12834
- /* @__PURE__ */ jsxRuntime.jsxs(
12835
- "div",
12836
- {
12837
- className: ui.clx("grid grid-cols-2 divide-x", {
12838
- "overflow-hidden rounded-b-lg": index === fields.length - 1
12839
- }),
12840
- children: [
12841
- /* @__PURE__ */ jsxRuntime.jsx(
12842
- Form$2.Field,
12843
- {
12844
- control: form.control,
12845
- name: `metadata.${index}.key`,
12846
- render: ({ field: field2 }) => {
12847
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12848
- GridInput,
12849
- {
12850
- "aria-labelledby": METADATA_KEY_LABEL_ID,
12851
- ...field2,
12852
- disabled: isDisabled,
12853
- placeholder: "Key"
12854
- }
12855
- ) }) });
12856
- }
12857
- }
12858
- ),
12859
- /* @__PURE__ */ jsxRuntime.jsx(
12860
- Form$2.Field,
12861
- {
12862
- control: form.control,
12863
- name: `metadata.${index}.value`,
12864
- render: ({ field: { value, ...field2 } }) => {
12865
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12866
- GridInput,
12867
- {
12868
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
12869
- ...field2,
12870
- value: isDisabled ? placeholder : value,
12871
- disabled: isDisabled,
12872
- placeholder: "Value"
12873
- }
12874
- ) }) });
12875
- }
12876
- }
12877
- )
12878
- ]
12879
- }
12880
- ),
12881
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
12882
- /* @__PURE__ */ jsxRuntime.jsx(
12883
- ui.DropdownMenu.Trigger,
12884
- {
12885
- className: ui.clx(
12886
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
12887
- {
12888
- hidden: isDisabled
12889
- }
12890
- ),
12891
- disabled: isDisabled,
12892
- asChild: true,
12893
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
12894
- }
12895
- ),
12896
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
12897
- /* @__PURE__ */ jsxRuntime.jsxs(
12898
- ui.DropdownMenu.Item,
12899
- {
12900
- className: "gap-x-2",
12901
- onClick: () => insertRow(index, "above"),
12902
- children: [
12903
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
12904
- "Insert row above"
12905
- ]
12906
- }
12907
- ),
12908
- /* @__PURE__ */ jsxRuntime.jsxs(
12909
- ui.DropdownMenu.Item,
12910
- {
12911
- className: "gap-x-2",
12912
- onClick: () => insertRow(index, "below"),
12913
- children: [
12914
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
12915
- "Insert row below"
12916
- ]
12917
- }
12918
- ),
12919
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
12920
- /* @__PURE__ */ jsxRuntime.jsxs(
12921
- ui.DropdownMenu.Item,
12922
- {
12923
- className: "gap-x-2",
12924
- onClick: () => deleteRow(index),
12925
- children: [
12926
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
12927
- "Delete row"
12928
- ]
12929
- }
12930
- )
12931
- ] })
12932
- ] })
12933
- ] })
12934
- },
12935
- field.id
12936
- );
12937
- })
12907
+ {
12908
+ className: "flex flex-1 flex-col overflow-hidden",
12909
+ onSubmit,
12910
+ children: [
12911
+ /* @__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: [
12912
+ /* @__PURE__ */ jsxRuntime.jsx(
12913
+ Form$2.Field,
12914
+ {
12915
+ control: form.control,
12916
+ name: "country_code",
12917
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12918
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12919
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12920
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12921
+ ] })
12922
+ }
12923
+ ),
12924
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12925
+ /* @__PURE__ */ jsxRuntime.jsx(
12926
+ Form$2.Field,
12927
+ {
12928
+ control: form.control,
12929
+ name: "first_name",
12930
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12931
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12932
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12933
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12934
+ ] })
12935
+ }
12936
+ ),
12937
+ /* @__PURE__ */ jsxRuntime.jsx(
12938
+ Form$2.Field,
12939
+ {
12940
+ control: form.control,
12941
+ name: "last_name",
12942
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12943
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12944
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12945
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12946
+ ] })
12947
+ }
12948
+ )
12938
12949
  ] }),
12939
- hasUneditableRows && /* @__PURE__ */ jsxRuntime.jsx(InlineTip, { variant: "warning", label: "Some rows are disabled", children: "This object contains non-primitive metadata, such as arrays or objects, that can't be edited here. To edit the disabled rows, use the API directly." })
12940
- ] }),
12941
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12942
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12950
+ /* @__PURE__ */ jsxRuntime.jsx(
12951
+ Form$2.Field,
12952
+ {
12953
+ control: form.control,
12954
+ name: "company",
12955
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12956
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12957
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12958
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12959
+ ] })
12960
+ }
12961
+ ),
12962
+ /* @__PURE__ */ jsxRuntime.jsx(
12963
+ Form$2.Field,
12964
+ {
12965
+ control: form.control,
12966
+ name: "address_1",
12967
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12968
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12969
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12970
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12971
+ ] })
12972
+ }
12973
+ ),
12974
+ /* @__PURE__ */ jsxRuntime.jsx(
12975
+ Form$2.Field,
12976
+ {
12977
+ control: form.control,
12978
+ name: "address_2",
12979
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12980
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12981
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12982
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12983
+ ] })
12984
+ }
12985
+ ),
12986
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12987
+ /* @__PURE__ */ jsxRuntime.jsx(
12988
+ Form$2.Field,
12989
+ {
12990
+ control: form.control,
12991
+ name: "postal_code",
12992
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12993
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12994
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12995
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12996
+ ] })
12997
+ }
12998
+ ),
12999
+ /* @__PURE__ */ jsxRuntime.jsx(
13000
+ Form$2.Field,
13001
+ {
13002
+ control: form.control,
13003
+ name: "city",
13004
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13005
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
13006
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13007
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13008
+ ] })
13009
+ }
13010
+ )
13011
+ ] }),
13012
+ /* @__PURE__ */ jsxRuntime.jsx(
13013
+ Form$2.Field,
13014
+ {
13015
+ control: form.control,
13016
+ name: "province",
13017
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13018
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13019
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13020
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13021
+ ] })
13022
+ }
13023
+ ),
13024
+ /* @__PURE__ */ jsxRuntime.jsx(
13025
+ Form$2.Field,
13026
+ {
13027
+ control: form.control,
13028
+ name: "phone",
13029
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13030
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13031
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13032
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13033
+ ] })
13034
+ }
13035
+ )
13036
+ ] }) }),
13037
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13038
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12943
13039
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12944
13040
  ] }) })
12945
13041
  ]
12946
13042
  }
12947
13043
  ) });
12948
13044
  };
12949
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
12950
- return /* @__PURE__ */ jsxRuntime.jsx(
12951
- "input",
12952
- {
12953
- ref,
12954
- ...props,
12955
- autoComplete: "off",
12956
- className: ui.clx(
12957
- "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
12958
- className
12959
- )
12960
- }
12961
- );
12962
- });
12963
- GridInput.displayName = "MetadataForm.GridInput";
12964
- const PlaceholderInner = () => {
12965
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
12966
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
12967
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12968
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
12969
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
12970
- ] }) })
12971
- ] });
12972
- };
12973
- const EDITABLE_TYPES = ["string", "number", "boolean"];
12974
- function getDefaultValues(metadata) {
12975
- if (!metadata || !Object.keys(metadata).length) {
12976
- return [
12977
- {
12978
- key: "",
12979
- value: "",
12980
- disabled: false
12981
- }
12982
- ];
12983
- }
12984
- return Object.entries(metadata).map(([key, value]) => {
12985
- if (!EDITABLE_TYPES.includes(typeof value)) {
12986
- return {
12987
- key,
12988
- value,
12989
- disabled: true
12990
- };
12991
- }
12992
- let stringValue = value;
12993
- if (typeof value !== "string") {
12994
- stringValue = JSON.stringify(value);
12995
- }
12996
- return {
12997
- key,
12998
- value: stringValue,
12999
- original_key: key
13000
- };
13001
- });
13002
- }
13003
- function parseValues(values) {
13004
- const metadata = values.metadata;
13005
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
13006
- if (isEmpty) {
13007
- return null;
13008
- }
13009
- const update = {};
13010
- metadata.forEach((field) => {
13011
- let key = field.key;
13012
- let value = field.value;
13013
- const disabled = field.disabled;
13014
- if (!key || !value) {
13015
- return;
13016
- }
13017
- if (disabled) {
13018
- update[key] = value;
13019
- return;
13020
- }
13021
- key = key.trim();
13022
- value = value.trim();
13023
- if (value === "true") {
13024
- update[key] = true;
13025
- } else if (value === "false") {
13026
- update[key] = false;
13027
- } else {
13028
- const parsedNumber = parseFloat(value);
13029
- if (!isNaN(parsedNumber)) {
13030
- update[key] = parsedNumber;
13031
- } else {
13032
- update[key] = value;
13033
- }
13034
- }
13035
- });
13036
- return update;
13037
- }
13038
- function getHasUneditableRows(metadata) {
13039
- if (!metadata) {
13040
- return false;
13041
- }
13042
- return Object.values(metadata).some(
13043
- (value) => !EDITABLE_TYPES.includes(typeof value)
13044
- );
13045
- }
13045
+ const schema = addressSchema;
13046
13046
  const widgetModule = { widgets: [] };
13047
13047
  const routeModule = {
13048
13048
  routes: [
@@ -13064,29 +13064,29 @@ const routeModule = {
13064
13064
  loader,
13065
13065
  children: [
13066
13066
  {
13067
- Component: CustomItems,
13068
- path: "/draft-orders/:id/custom-items"
13067
+ Component: Email,
13068
+ path: "/draft-orders/:id/email"
13069
13069
  },
13070
13070
  {
13071
- Component: BillingAddress,
13072
- path: "/draft-orders/:id/billing-address"
13071
+ Component: CustomItems,
13072
+ path: "/draft-orders/:id/custom-items"
13073
13073
  },
13074
13074
  {
13075
13075
  Component: Items,
13076
13076
  path: "/draft-orders/:id/items"
13077
13077
  },
13078
13078
  {
13079
- Component: Email,
13080
- path: "/draft-orders/:id/email"
13081
- },
13082
- {
13083
- Component: SalesChannel,
13084
- path: "/draft-orders/:id/sales-channel"
13079
+ Component: Metadata,
13080
+ path: "/draft-orders/:id/metadata"
13085
13081
  },
13086
13082
  {
13087
13083
  Component: Promotions,
13088
13084
  path: "/draft-orders/:id/promotions"
13089
13085
  },
13086
+ {
13087
+ Component: SalesChannel,
13088
+ path: "/draft-orders/:id/sales-channel"
13089
+ },
13090
13090
  {
13091
13091
  Component: Shipping,
13092
13092
  path: "/draft-orders/:id/shipping"
@@ -13100,8 +13100,8 @@ const routeModule = {
13100
13100
  path: "/draft-orders/:id/transfer-ownership"
13101
13101
  },
13102
13102
  {
13103
- Component: Metadata,
13104
- path: "/draft-orders/:id/metadata"
13103
+ Component: BillingAddress,
13104
+ path: "/draft-orders/:id/billing-address"
13105
13105
  }
13106
13106
  ]
13107
13107
  }