@medusajs/draft-order 2.10.4-preview-20250922031739 → 2.10.4-preview-20250922060202

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 +582 -582
  2. package/.medusa/server/src/admin/index.mjs +582 -582
  3. package/package.json +16 -16
package/.medusa/server/src/admin/index.js CHANGED
@@ -9573,196 +9573,6 @@ const ID = () => {
9573
9573
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Outlet, {})
9574
9574
  ] });
9575
9575
  };
9576
- const BillingAddress = () => {
9577
- const { id } = reactRouterDom.useParams();
9578
- const { order, isPending, isError, error } = useOrder(id, {
9579
- fields: "+billing_address"
9580
- });
9581
- if (isError) {
9582
- throw error;
9583
- }
9584
- const isReady = !isPending && !!order;
9585
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9586
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9587
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
9588
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
9589
- ] }),
9590
- isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
9591
- ] });
9592
- };
9593
- const BillingAddressForm = ({ order }) => {
9594
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
9595
- const form = reactHookForm.useForm({
9596
- defaultValues: {
9597
- first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
9598
- last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
9599
- company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
9600
- address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
9601
- address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
9602
- city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
9603
- province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
9604
- country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
9605
- postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
9606
- phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
9607
- },
9608
- resolver: zod.zodResolver(schema$5)
9609
- });
9610
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9611
- const { handleSuccess } = useRouteModal();
9612
- const onSubmit = form.handleSubmit(async (data) => {
9613
- await mutateAsync(
9614
- { billing_address: data },
9615
- {
9616
- onSuccess: () => {
9617
- handleSuccess();
9618
- },
9619
- onError: (error) => {
9620
- ui.toast.error(error.message);
9621
- }
9622
- }
9623
- );
9624
- });
9625
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9626
- KeyboundForm,
9627
- {
9628
- className: "flex flex-1 flex-col overflow-hidden",
9629
- onSubmit,
9630
- children: [
9631
- /* @__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: [
9632
- /* @__PURE__ */ jsxRuntime.jsx(
9633
- Form$2.Field,
9634
- {
9635
- control: form.control,
9636
- name: "country_code",
9637
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9638
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
9639
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
9640
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9641
- ] })
9642
- }
9643
- ),
9644
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9645
- /* @__PURE__ */ jsxRuntime.jsx(
9646
- Form$2.Field,
9647
- {
9648
- control: form.control,
9649
- name: "first_name",
9650
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9651
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
9652
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9653
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9654
- ] })
9655
- }
9656
- ),
9657
- /* @__PURE__ */ jsxRuntime.jsx(
9658
- Form$2.Field,
9659
- {
9660
- control: form.control,
9661
- name: "last_name",
9662
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9663
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
9664
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9665
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9666
- ] })
9667
- }
9668
- )
9669
- ] }),
9670
- /* @__PURE__ */ jsxRuntime.jsx(
9671
- Form$2.Field,
9672
- {
9673
- control: form.control,
9674
- name: "company",
9675
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9676
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
9677
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9678
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9679
- ] })
9680
- }
9681
- ),
9682
- /* @__PURE__ */ jsxRuntime.jsx(
9683
- Form$2.Field,
9684
- {
9685
- control: form.control,
9686
- name: "address_1",
9687
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9688
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
9689
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9690
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9691
- ] })
9692
- }
9693
- ),
9694
- /* @__PURE__ */ jsxRuntime.jsx(
9695
- Form$2.Field,
9696
- {
9697
- control: form.control,
9698
- name: "address_2",
9699
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9700
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
9701
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9702
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9703
- ] })
9704
- }
9705
- ),
9706
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
9707
- /* @__PURE__ */ jsxRuntime.jsx(
9708
- Form$2.Field,
9709
- {
9710
- control: form.control,
9711
- name: "postal_code",
9712
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9713
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
9714
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9715
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9716
- ] })
9717
- }
9718
- ),
9719
- /* @__PURE__ */ jsxRuntime.jsx(
9720
- Form$2.Field,
9721
- {
9722
- control: form.control,
9723
- name: "city",
9724
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9725
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
9726
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9727
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9728
- ] })
9729
- }
9730
- )
9731
- ] }),
9732
- /* @__PURE__ */ jsxRuntime.jsx(
9733
- Form$2.Field,
9734
- {
9735
- control: form.control,
9736
- name: "province",
9737
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9738
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
9739
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9740
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9741
- ] })
9742
- }
9743
- ),
9744
- /* @__PURE__ */ jsxRuntime.jsx(
9745
- Form$2.Field,
9746
- {
9747
- control: form.control,
9748
- name: "phone",
9749
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9750
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
9751
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9752
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9753
- ] })
9754
- }
9755
- )
9756
- ] }) }),
9757
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9758
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9759
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9760
- ] }) })
9761
- ]
9762
- }
9763
- ) });
9764
- };
9765
- const schema$5 = addressSchema;
9766
9576
  const Email = () => {
9767
9577
  const { id } = reactRouterDom.useParams();
9768
9578
  const { order, isPending, isError, error } = useOrder(id, {
@@ -9785,7 +9595,7 @@ const EmailForm = ({ order }) => {
9785
9595
  defaultValues: {
9786
9596
  email: order.email ?? ""
9787
9597
  },
9788
- resolver: zod.zodResolver(schema$4)
9598
+ resolver: zod.zodResolver(schema$5)
9789
9599
  });
9790
9600
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9791
9601
  const { handleSuccess } = useRouteModal();
@@ -9828,28 +9638,7 @@ const EmailForm = ({ order }) => {
9828
9638
  }
9829
9639
  ) });
9830
9640
  };
9831
- const schema$4 = objectType({
9832
- email: stringType().email()
9833
- });
9834
- const CustomItems = () => {
9835
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9836
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
9837
- /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
9838
- ] });
9839
- };
9840
- const CustomItemsForm = () => {
9841
- const form = reactHookForm.useForm({
9842
- resolver: zod.zodResolver(schema$3)
9843
- });
9844
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
9845
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
9846
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9847
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9848
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
9849
- ] }) })
9850
- ] }) });
9851
- };
9852
- const schema$3 = objectType({
9641
+ const schema$5 = objectType({
9853
9642
  email: stringType().email()
9854
9643
  });
9855
9644
  const NumberInput = React.forwardRef(
@@ -10826,50 +10615,400 @@ const customItemSchema = objectType({
10826
10615
  quantity: numberType(),
10827
10616
  unit_price: unionType([numberType(), stringType()])
10828
10617
  });
10829
- const PROMOTION_QUERY_KEY = "promotions";
10830
- const promotionsQueryKeys = {
10831
- list: (query2) => [
10832
- PROMOTION_QUERY_KEY,
10833
- query2 ? query2 : void 0
10834
- ],
10835
- detail: (id, query2) => [
10836
- PROMOTION_QUERY_KEY,
10837
- id,
10838
- query2 ? query2 : void 0
10839
- ]
10840
- };
10841
- const usePromotions = (query2, options) => {
10842
- const { data, ...rest } = reactQuery.useQuery({
10843
- queryKey: promotionsQueryKeys.list(query2),
10844
- queryFn: async () => sdk.admin.promotion.list(query2),
10845
- ...options
10846
- });
10847
- return { ...data, ...rest };
10848
- };
10849
- const Promotions = () => {
10850
- const { id } = reactRouterDom.useParams();
10851
- const {
10852
- order: preview,
10853
- isError: isPreviewError,
10854
- error: previewError
10855
- } = useOrderPreview(id, void 0);
10856
- useInitiateOrderEdit({ preview });
10857
- const { onCancel } = useCancelOrderEdit({ preview });
10858
- if (isPreviewError) {
10859
- throw previewError;
10860
- }
10861
- const isReady = !!preview;
10862
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
10863
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
10864
- isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
10865
- ] });
10866
- };
10867
- const PromotionForm = ({ preview }) => {
10868
- const { items, shipping_methods } = preview;
10869
- const [isSubmitting, setIsSubmitting] = React.useState(false);
10870
- const [comboboxValue, setComboboxValue] = React.useState("");
10871
- const { handleSuccess } = useRouteModal();
10872
- const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
10618
+ const InlineTip = React.forwardRef(
10619
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
10620
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10621
+ return /* @__PURE__ */ jsxRuntime.jsxs(
10622
+ "div",
10623
+ {
10624
+ ref,
10625
+ className: ui.clx(
10626
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10627
+ className
10628
+ ),
10629
+ ...props,
10630
+ children: [
10631
+ /* @__PURE__ */ jsxRuntime.jsx(
10632
+ "div",
10633
+ {
10634
+ role: "presentation",
10635
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10636
+ "bg-ui-tag-orange-icon": variant === "warning"
10637
+ })
10638
+ }
10639
+ ),
10640
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10641
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10642
+ labelValue,
10643
+ ":"
10644
+ ] }),
10645
+ " ",
10646
+ children
10647
+ ] })
10648
+ ]
10649
+ }
10650
+ );
10651
+ }
10652
+ );
10653
+ InlineTip.displayName = "InlineTip";
10654
+ const MetadataFieldSchema = objectType({
10655
+ key: stringType(),
10656
+ disabled: booleanType().optional(),
10657
+ value: anyType()
10658
+ });
10659
+ const MetadataSchema = objectType({
10660
+ metadata: arrayType(MetadataFieldSchema)
10661
+ });
10662
+ const Metadata = () => {
10663
+ const { id } = reactRouterDom.useParams();
10664
+ const { order, isPending, isError, error } = useOrder(id, {
10665
+ fields: "metadata"
10666
+ });
10667
+ if (isError) {
10668
+ throw error;
10669
+ }
10670
+ const isReady = !isPending && !!order;
10671
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10672
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10673
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10674
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10675
+ ] }),
10676
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10677
+ ] });
10678
+ };
10679
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10680
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10681
+ const MetadataForm = ({ orderId, metadata }) => {
10682
+ const { handleSuccess } = useRouteModal();
10683
+ const hasUneditableRows = getHasUneditableRows(metadata);
10684
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10685
+ const form = reactHookForm.useForm({
10686
+ defaultValues: {
10687
+ metadata: getDefaultValues(metadata)
10688
+ },
10689
+ resolver: zod.zodResolver(MetadataSchema)
10690
+ });
10691
+ const handleSubmit = form.handleSubmit(async (data) => {
10692
+ const parsedData = parseValues(data);
10693
+ await mutateAsync(
10694
+ {
10695
+ metadata: parsedData
10696
+ },
10697
+ {
10698
+ onSuccess: () => {
10699
+ ui.toast.success("Metadata updated");
10700
+ handleSuccess();
10701
+ },
10702
+ onError: (error) => {
10703
+ ui.toast.error(error.message);
10704
+ }
10705
+ }
10706
+ );
10707
+ });
10708
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
10709
+ control: form.control,
10710
+ name: "metadata"
10711
+ });
10712
+ function deleteRow(index) {
10713
+ remove(index);
10714
+ if (fields.length === 1) {
10715
+ insert(0, {
10716
+ key: "",
10717
+ value: "",
10718
+ disabled: false
10719
+ });
10720
+ }
10721
+ }
10722
+ function insertRow(index, position) {
10723
+ insert(index + (position === "above" ? 0 : 1), {
10724
+ key: "",
10725
+ value: "",
10726
+ disabled: false
10727
+ });
10728
+ }
10729
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10730
+ KeyboundForm,
10731
+ {
10732
+ onSubmit: handleSubmit,
10733
+ className: "flex flex-1 flex-col overflow-hidden",
10734
+ children: [
10735
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10736
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10737
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10738
+ /* @__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" }) }),
10739
+ /* @__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" }) })
10740
+ ] }),
10741
+ fields.map((field, index) => {
10742
+ const isDisabled = field.disabled || false;
10743
+ let placeholder = "-";
10744
+ if (typeof field.value === "object") {
10745
+ placeholder = "{ ... }";
10746
+ }
10747
+ if (Array.isArray(field.value)) {
10748
+ placeholder = "[ ... ]";
10749
+ }
10750
+ return /* @__PURE__ */ jsxRuntime.jsx(
10751
+ ConditionalTooltip,
10752
+ {
10753
+ showTooltip: isDisabled,
10754
+ content: "This row is disabled because it contains non-primitive data.",
10755
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10756
+ /* @__PURE__ */ jsxRuntime.jsxs(
10757
+ "div",
10758
+ {
10759
+ className: ui.clx("grid grid-cols-2 divide-x", {
10760
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
10761
+ }),
10762
+ children: [
10763
+ /* @__PURE__ */ jsxRuntime.jsx(
10764
+ Form$2.Field,
10765
+ {
10766
+ control: form.control,
10767
+ name: `metadata.${index}.key`,
10768
+ render: ({ field: field2 }) => {
10769
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10770
+ GridInput,
10771
+ {
10772
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
10773
+ ...field2,
10774
+ disabled: isDisabled,
10775
+ placeholder: "Key"
10776
+ }
10777
+ ) }) });
10778
+ }
10779
+ }
10780
+ ),
10781
+ /* @__PURE__ */ jsxRuntime.jsx(
10782
+ Form$2.Field,
10783
+ {
10784
+ control: form.control,
10785
+ name: `metadata.${index}.value`,
10786
+ render: ({ field: { value, ...field2 } }) => {
10787
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10788
+ GridInput,
10789
+ {
10790
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
10791
+ ...field2,
10792
+ value: isDisabled ? placeholder : value,
10793
+ disabled: isDisabled,
10794
+ placeholder: "Value"
10795
+ }
10796
+ ) }) });
10797
+ }
10798
+ }
10799
+ )
10800
+ ]
10801
+ }
10802
+ ),
10803
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
10804
+ /* @__PURE__ */ jsxRuntime.jsx(
10805
+ ui.DropdownMenu.Trigger,
10806
+ {
10807
+ className: ui.clx(
10808
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
10809
+ {
10810
+ hidden: isDisabled
10811
+ }
10812
+ ),
10813
+ disabled: isDisabled,
10814
+ asChild: true,
10815
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
10816
+ }
10817
+ ),
10818
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
10819
+ /* @__PURE__ */ jsxRuntime.jsxs(
10820
+ ui.DropdownMenu.Item,
10821
+ {
10822
+ className: "gap-x-2",
10823
+ onClick: () => insertRow(index, "above"),
10824
+ children: [
10825
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
10826
+ "Insert row above"
10827
+ ]
10828
+ }
10829
+ ),
10830
+ /* @__PURE__ */ jsxRuntime.jsxs(
10831
+ ui.DropdownMenu.Item,
10832
+ {
10833
+ className: "gap-x-2",
10834
+ onClick: () => insertRow(index, "below"),
10835
+ children: [
10836
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
10837
+ "Insert row below"
10838
+ ]
10839
+ }
10840
+ ),
10841
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
10842
+ /* @__PURE__ */ jsxRuntime.jsxs(
10843
+ ui.DropdownMenu.Item,
10844
+ {
10845
+ className: "gap-x-2",
10846
+ onClick: () => deleteRow(index),
10847
+ children: [
10848
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
10849
+ "Delete row"
10850
+ ]
10851
+ }
10852
+ )
10853
+ ] })
10854
+ ] })
10855
+ ] })
10856
+ },
10857
+ field.id
10858
+ );
10859
+ })
10860
+ ] }),
10861
+ 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." })
10862
+ ] }),
10863
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10864
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10865
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10866
+ ] }) })
10867
+ ]
10868
+ }
10869
+ ) });
10870
+ };
10871
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
10872
+ return /* @__PURE__ */ jsxRuntime.jsx(
10873
+ "input",
10874
+ {
10875
+ ref,
10876
+ ...props,
10877
+ autoComplete: "off",
10878
+ className: ui.clx(
10879
+ "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",
10880
+ className
10881
+ )
10882
+ }
10883
+ );
10884
+ });
10885
+ GridInput.displayName = "MetadataForm.GridInput";
10886
+ const PlaceholderInner = () => {
10887
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
10888
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
10889
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
10890
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
10891
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
10892
+ ] }) })
10893
+ ] });
10894
+ };
10895
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
10896
+ function getDefaultValues(metadata) {
10897
+ if (!metadata || !Object.keys(metadata).length) {
10898
+ return [
10899
+ {
10900
+ key: "",
10901
+ value: "",
10902
+ disabled: false
10903
+ }
10904
+ ];
10905
+ }
10906
+ return Object.entries(metadata).map(([key, value]) => {
10907
+ if (!EDITABLE_TYPES.includes(typeof value)) {
10908
+ return {
10909
+ key,
10910
+ value,
10911
+ disabled: true
10912
+ };
10913
+ }
10914
+ let stringValue = value;
10915
+ if (typeof value !== "string") {
10916
+ stringValue = JSON.stringify(value);
10917
+ }
10918
+ return {
10919
+ key,
10920
+ value: stringValue,
10921
+ original_key: key
10922
+ };
10923
+ });
10924
+ }
10925
+ function parseValues(values) {
10926
+ const metadata = values.metadata;
10927
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
10928
+ if (isEmpty) {
10929
+ return null;
10930
+ }
10931
+ const update = {};
10932
+ metadata.forEach((field) => {
10933
+ let key = field.key;
10934
+ let value = field.value;
10935
+ const disabled = field.disabled;
10936
+ if (!key || !value) {
10937
+ return;
10938
+ }
10939
+ if (disabled) {
10940
+ update[key] = value;
10941
+ return;
10942
+ }
10943
+ key = key.trim();
10944
+ value = value.trim();
10945
+ if (value === "true") {
10946
+ update[key] = true;
10947
+ } else if (value === "false") {
10948
+ update[key] = false;
10949
+ } else {
10950
+ const parsedNumber = parseFloat(value);
10951
+ if (!isNaN(parsedNumber)) {
10952
+ update[key] = parsedNumber;
10953
+ } else {
10954
+ update[key] = value;
10955
+ }
10956
+ }
10957
+ });
10958
+ return update;
10959
+ }
10960
+ function getHasUneditableRows(metadata) {
10961
+ if (!metadata) {
10962
+ return false;
10963
+ }
10964
+ return Object.values(metadata).some(
10965
+ (value) => !EDITABLE_TYPES.includes(typeof value)
10966
+ );
10967
+ }
10968
+ const PROMOTION_QUERY_KEY = "promotions";
10969
+ const promotionsQueryKeys = {
10970
+ list: (query2) => [
10971
+ PROMOTION_QUERY_KEY,
10972
+ query2 ? query2 : void 0
10973
+ ],
10974
+ detail: (id, query2) => [
10975
+ PROMOTION_QUERY_KEY,
10976
+ id,
10977
+ query2 ? query2 : void 0
10978
+ ]
10979
+ };
10980
+ const usePromotions = (query2, options) => {
10981
+ const { data, ...rest } = reactQuery.useQuery({
10982
+ queryKey: promotionsQueryKeys.list(query2),
10983
+ queryFn: async () => sdk.admin.promotion.list(query2),
10984
+ ...options
10985
+ });
10986
+ return { ...data, ...rest };
10987
+ };
10988
+ const Promotions = () => {
10989
+ const { id } = reactRouterDom.useParams();
10990
+ const {
10991
+ order: preview,
10992
+ isError: isPreviewError,
10993
+ error: previewError
10994
+ } = useOrderPreview(id, void 0);
10995
+ useInitiateOrderEdit({ preview });
10996
+ const { onCancel } = useCancelOrderEdit({ preview });
10997
+ if (isPreviewError) {
10998
+ throw previewError;
10999
+ }
11000
+ const isReady = !!preview;
11001
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { onClose: onCancel, children: [
11002
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Promotions" }) }) }),
11003
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(PromotionForm, { preview })
11004
+ ] });
11005
+ };
11006
+ const PromotionForm = ({ preview }) => {
11007
+ const { items, shipping_methods } = preview;
11008
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
11009
+ const [comboboxValue, setComboboxValue] = React.useState("");
11010
+ const { handleSuccess } = useRouteModal();
11011
+ const { mutateAsync: addPromotions, isPending: isAddingPromotions } = useDraftOrderAddPromotions(preview.id);
10873
11012
  const promoIds = getPromotionIds(items, shipping_methods);
10874
11013
  const { promotions, isPending, isError, error } = usePromotions(
10875
11014
  {
@@ -11103,54 +11242,10 @@ function getPromotionIds(items, shippingMethods) {
11103
11242
  }
11104
11243
  return Array.from(promotionIds);
11105
11244
  }
11106
- const InlineTip = React.forwardRef(
11107
- ({ variant = "tip", label, className, children, ...props }, ref) => {
11108
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11109
- return /* @__PURE__ */ jsxRuntime.jsxs(
11110
- "div",
11111
- {
11112
- ref,
11113
- className: ui.clx(
11114
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11115
- className
11116
- ),
11117
- ...props,
11118
- children: [
11119
- /* @__PURE__ */ jsxRuntime.jsx(
11120
- "div",
11121
- {
11122
- role: "presentation",
11123
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11124
- "bg-ui-tag-orange-icon": variant === "warning"
11125
- })
11126
- }
11127
- ),
11128
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11129
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11130
- labelValue,
11131
- ":"
11132
- ] }),
11133
- " ",
11134
- children
11135
- ] })
11136
- ]
11137
- }
11138
- );
11139
- }
11140
- );
11141
- InlineTip.displayName = "InlineTip";
11142
- const MetadataFieldSchema = objectType({
11143
- key: stringType(),
11144
- disabled: booleanType().optional(),
11145
- value: anyType()
11146
- });
11147
- const MetadataSchema = objectType({
11148
- metadata: arrayType(MetadataFieldSchema)
11149
- });
11150
- const Metadata = () => {
11245
+ const BillingAddress = () => {
11151
11246
  const { id } = reactRouterDom.useParams();
11152
11247
  const { order, isPending, isError, error } = useOrder(id, {
11153
- fields: "metadata"
11248
+ fields: "+billing_address"
11154
11249
  });
11155
11250
  if (isError) {
11156
11251
  throw error;
@@ -11158,33 +11253,36 @@ const Metadata = () => {
11158
11253
  const isReady = !isPending && !!order;
11159
11254
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11160
11255
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11161
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11162
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11256
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Billing Address" }) }),
11257
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the billing address for the draft order" }) })
11163
11258
  ] }),
11164
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11259
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(BillingAddressForm, { order })
11165
11260
  ] });
11166
11261
  };
11167
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11168
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11169
- const MetadataForm = ({ orderId, metadata }) => {
11170
- const { handleSuccess } = useRouteModal();
11171
- const hasUneditableRows = getHasUneditableRows(metadata);
11172
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11262
+ const BillingAddressForm = ({ order }) => {
11263
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
11173
11264
  const form = reactHookForm.useForm({
11174
11265
  defaultValues: {
11175
- metadata: getDefaultValues(metadata)
11266
+ first_name: ((_a = order.billing_address) == null ? void 0 : _a.first_name) ?? "",
11267
+ last_name: ((_b = order.billing_address) == null ? void 0 : _b.last_name) ?? "",
11268
+ company: ((_c = order.billing_address) == null ? void 0 : _c.company) ?? "",
11269
+ address_1: ((_d = order.billing_address) == null ? void 0 : _d.address_1) ?? "",
11270
+ address_2: ((_e = order.billing_address) == null ? void 0 : _e.address_2) ?? "",
11271
+ city: ((_f = order.billing_address) == null ? void 0 : _f.city) ?? "",
11272
+ province: ((_g = order.billing_address) == null ? void 0 : _g.province) ?? "",
11273
+ country_code: ((_h = order.billing_address) == null ? void 0 : _h.country_code) ?? "",
11274
+ postal_code: ((_i = order.billing_address) == null ? void 0 : _i.postal_code) ?? "",
11275
+ phone: ((_j = order.billing_address) == null ? void 0 : _j.phone) ?? ""
11176
11276
  },
11177
- resolver: zod.zodResolver(MetadataSchema)
11277
+ resolver: zod.zodResolver(schema$4)
11178
11278
  });
11179
- const handleSubmit = form.handleSubmit(async (data) => {
11180
- const parsedData = parseValues(data);
11279
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11280
+ const { handleSuccess } = useRouteModal();
11281
+ const onSubmit = form.handleSubmit(async (data) => {
11181
11282
  await mutateAsync(
11182
- {
11183
- metadata: parsedData
11184
- },
11283
+ { billing_address: data },
11185
11284
  {
11186
11285
  onSuccess: () => {
11187
- ui.toast.success("Metadata updated");
11188
11286
  handleSuccess();
11189
11287
  },
11190
11288
  onError: (error) => {
@@ -11193,266 +11291,147 @@ const MetadataForm = ({ orderId, metadata }) => {
11193
11291
  }
11194
11292
  );
11195
11293
  });
11196
- const { fields, insert, remove } = reactHookForm.useFieldArray({
11197
- control: form.control,
11198
- name: "metadata"
11199
- });
11200
- function deleteRow(index) {
11201
- remove(index);
11202
- if (fields.length === 1) {
11203
- insert(0, {
11204
- key: "",
11205
- value: "",
11206
- disabled: false
11207
- });
11208
- }
11209
- }
11210
- function insertRow(index, position) {
11211
- insert(index + (position === "above" ? 0 : 1), {
11212
- key: "",
11213
- value: "",
11214
- disabled: false
11215
- });
11216
- }
11217
11294
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11218
11295
  KeyboundForm,
11219
11296
  {
11220
- onSubmit: handleSubmit,
11221
11297
  className: "flex flex-1 flex-col overflow-hidden",
11298
+ onSubmit,
11222
11299
  children: [
11223
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11224
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11225
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11226
- /* @__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" }) }),
11227
- /* @__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" }) })
11228
- ] }),
11229
- fields.map((field, index) => {
11230
- const isDisabled = field.disabled || false;
11231
- let placeholder = "-";
11232
- if (typeof field.value === "object") {
11233
- placeholder = "{ ... }";
11234
- }
11235
- if (Array.isArray(field.value)) {
11236
- placeholder = "[ ... ]";
11237
- }
11238
- return /* @__PURE__ */ jsxRuntime.jsx(
11239
- ConditionalTooltip,
11240
- {
11241
- showTooltip: isDisabled,
11242
- content: "This row is disabled because it contains non-primitive data.",
11243
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
11244
- /* @__PURE__ */ jsxRuntime.jsxs(
11245
- "div",
11246
- {
11247
- className: ui.clx("grid grid-cols-2 divide-x", {
11248
- "overflow-hidden rounded-b-lg": index === fields.length - 1
11249
- }),
11250
- children: [
11251
- /* @__PURE__ */ jsxRuntime.jsx(
11252
- Form$2.Field,
11253
- {
11254
- control: form.control,
11255
- name: `metadata.${index}.key`,
11256
- render: ({ field: field2 }) => {
11257
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11258
- GridInput,
11259
- {
11260
- "aria-labelledby": METADATA_KEY_LABEL_ID,
11261
- ...field2,
11262
- disabled: isDisabled,
11263
- placeholder: "Key"
11264
- }
11265
- ) }) });
11266
- }
11267
- }
11268
- ),
11269
- /* @__PURE__ */ jsxRuntime.jsx(
11270
- Form$2.Field,
11271
- {
11272
- control: form.control,
11273
- name: `metadata.${index}.value`,
11274
- render: ({ field: { value, ...field2 } }) => {
11275
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11276
- GridInput,
11277
- {
11278
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
11279
- ...field2,
11280
- value: isDisabled ? placeholder : value,
11281
- disabled: isDisabled,
11282
- placeholder: "Value"
11283
- }
11284
- ) }) });
11285
- }
11286
- }
11287
- )
11288
- ]
11289
- }
11290
- ),
11291
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11292
- /* @__PURE__ */ jsxRuntime.jsx(
11293
- ui.DropdownMenu.Trigger,
11294
- {
11295
- className: ui.clx(
11296
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11297
- {
11298
- hidden: isDisabled
11299
- }
11300
- ),
11301
- disabled: isDisabled,
11302
- asChild: true,
11303
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11304
- }
11305
- ),
11306
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11307
- /* @__PURE__ */ jsxRuntime.jsxs(
11308
- ui.DropdownMenu.Item,
11309
- {
11310
- className: "gap-x-2",
11311
- onClick: () => insertRow(index, "above"),
11312
- children: [
11313
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11314
- "Insert row above"
11315
- ]
11316
- }
11317
- ),
11318
- /* @__PURE__ */ jsxRuntime.jsxs(
11319
- ui.DropdownMenu.Item,
11320
- {
11321
- className: "gap-x-2",
11322
- onClick: () => insertRow(index, "below"),
11323
- children: [
11324
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11325
- "Insert row below"
11326
- ]
11327
- }
11328
- ),
11329
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11330
- /* @__PURE__ */ jsxRuntime.jsxs(
11331
- ui.DropdownMenu.Item,
11332
- {
11333
- className: "gap-x-2",
11334
- onClick: () => deleteRow(index),
11335
- children: [
11336
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11337
- "Delete row"
11338
- ]
11339
- }
11340
- )
11341
- ] })
11342
- ] })
11343
- ] })
11344
- },
11345
- field.id
11346
- );
11347
- })
11300
+ /* @__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: [
11301
+ /* @__PURE__ */ jsxRuntime.jsx(
11302
+ Form$2.Field,
11303
+ {
11304
+ control: form.control,
11305
+ name: "country_code",
11306
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11307
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
11308
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
11309
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11310
+ ] })
11311
+ }
11312
+ ),
11313
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11314
+ /* @__PURE__ */ jsxRuntime.jsx(
11315
+ Form$2.Field,
11316
+ {
11317
+ control: form.control,
11318
+ name: "first_name",
11319
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11320
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
11321
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11322
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11323
+ ] })
11324
+ }
11325
+ ),
11326
+ /* @__PURE__ */ jsxRuntime.jsx(
11327
+ Form$2.Field,
11328
+ {
11329
+ control: form.control,
11330
+ name: "last_name",
11331
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11332
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
11333
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11334
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11335
+ ] })
11336
+ }
11337
+ )
11348
11338
  ] }),
11349
- 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." })
11350
- ] }),
11351
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11352
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11339
+ /* @__PURE__ */ jsxRuntime.jsx(
11340
+ Form$2.Field,
11341
+ {
11342
+ control: form.control,
11343
+ name: "company",
11344
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11345
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
11346
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11347
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11348
+ ] })
11349
+ }
11350
+ ),
11351
+ /* @__PURE__ */ jsxRuntime.jsx(
11352
+ Form$2.Field,
11353
+ {
11354
+ control: form.control,
11355
+ name: "address_1",
11356
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11357
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
11358
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11359
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11360
+ ] })
11361
+ }
11362
+ ),
11363
+ /* @__PURE__ */ jsxRuntime.jsx(
11364
+ Form$2.Field,
11365
+ {
11366
+ control: form.control,
11367
+ name: "address_2",
11368
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11369
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
11370
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11371
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11372
+ ] })
11373
+ }
11374
+ ),
11375
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
11376
+ /* @__PURE__ */ jsxRuntime.jsx(
11377
+ Form$2.Field,
11378
+ {
11379
+ control: form.control,
11380
+ name: "postal_code",
11381
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11382
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
11383
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11384
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11385
+ ] })
11386
+ }
11387
+ ),
11388
+ /* @__PURE__ */ jsxRuntime.jsx(
11389
+ Form$2.Field,
11390
+ {
11391
+ control: form.control,
11392
+ name: "city",
11393
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11394
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
11395
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11396
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11397
+ ] })
11398
+ }
11399
+ )
11400
+ ] }),
11401
+ /* @__PURE__ */ jsxRuntime.jsx(
11402
+ Form$2.Field,
11403
+ {
11404
+ control: form.control,
11405
+ name: "province",
11406
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11407
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
11408
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11409
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11410
+ ] })
11411
+ }
11412
+ ),
11413
+ /* @__PURE__ */ jsxRuntime.jsx(
11414
+ Form$2.Field,
11415
+ {
11416
+ control: form.control,
11417
+ name: "phone",
11418
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11419
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
11420
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
11421
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11422
+ ] })
11423
+ }
11424
+ )
11425
+ ] }) }),
11426
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11427
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11353
11428
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11354
11429
  ] }) })
11355
11430
  ]
11356
11431
  }
11357
11432
  ) });
11358
11433
  };
11359
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11360
- return /* @__PURE__ */ jsxRuntime.jsx(
11361
- "input",
11362
- {
11363
- ref,
11364
- ...props,
11365
- autoComplete: "off",
11366
- className: ui.clx(
11367
- "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",
11368
- className
11369
- )
11370
- }
11371
- );
11372
- });
11373
- GridInput.displayName = "MetadataForm.GridInput";
11374
- const PlaceholderInner = () => {
11375
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11376
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11377
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11378
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11379
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11380
- ] }) })
11381
- ] });
11382
- };
11383
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11384
- function getDefaultValues(metadata) {
11385
- if (!metadata || !Object.keys(metadata).length) {
11386
- return [
11387
- {
11388
- key: "",
11389
- value: "",
11390
- disabled: false
11391
- }
11392
- ];
11393
- }
11394
- return Object.entries(metadata).map(([key, value]) => {
11395
- if (!EDITABLE_TYPES.includes(typeof value)) {
11396
- return {
11397
- key,
11398
- value,
11399
- disabled: true
11400
- };
11401
- }
11402
- let stringValue = value;
11403
- if (typeof value !== "string") {
11404
- stringValue = JSON.stringify(value);
11405
- }
11406
- return {
11407
- key,
11408
- value: stringValue,
11409
- original_key: key
11410
- };
11411
- });
11412
- }
11413
- function parseValues(values) {
11414
- const metadata = values.metadata;
11415
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11416
- if (isEmpty) {
11417
- return null;
11418
- }
11419
- const update = {};
11420
- metadata.forEach((field) => {
11421
- let key = field.key;
11422
- let value = field.value;
11423
- const disabled = field.disabled;
11424
- if (!key || !value) {
11425
- return;
11426
- }
11427
- if (disabled) {
11428
- update[key] = value;
11429
- return;
11430
- }
11431
- key = key.trim();
11432
- value = value.trim();
11433
- if (value === "true") {
11434
- update[key] = true;
11435
- } else if (value === "false") {
11436
- update[key] = false;
11437
- } else {
11438
- const parsedNumber = parseFloat(value);
11439
- if (!isNaN(parsedNumber)) {
11440
- update[key] = parsedNumber;
11441
- } else {
11442
- update[key] = value;
11443
- }
11444
- }
11445
- });
11446
- return update;
11447
- }
11448
- function getHasUneditableRows(metadata) {
11449
- if (!metadata) {
11450
- return false;
11451
- }
11452
- return Object.values(metadata).some(
11453
- (value) => !EDITABLE_TYPES.includes(typeof value)
11454
- );
11455
- }
11434
+ const schema$4 = addressSchema;
11456
11435
  const SalesChannel = () => {
11457
11436
  const { id } = reactRouterDom.useParams();
11458
11437
  const { draft_order, isPending, isError, error } = useDraftOrder(
@@ -11481,7 +11460,7 @@ const SalesChannelForm = ({ order }) => {
11481
11460
  defaultValues: {
11482
11461
  sales_channel_id: order.sales_channel_id || ""
11483
11462
  },
11484
- resolver: zod.zodResolver(schema$2)
11463
+ resolver: zod.zodResolver(schema$3)
11485
11464
  });
11486
11465
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11487
11466
  const { handleSuccess } = useRouteModal();
@@ -11556,7 +11535,7 @@ const SalesChannelField = ({ control, order }) => {
11556
11535
  }
11557
11536
  );
11558
11537
  };
11559
- const schema$2 = objectType({
11538
+ const schema$3 = objectType({
11560
11539
  sales_channel_id: stringType().min(1)
11561
11540
  });
11562
11541
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
@@ -12398,7 +12377,7 @@ const ShippingAddressForm = ({ order }) => {
12398
12377
  postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12399
12378
  phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12400
12379
  },
12401
- resolver: zod.zodResolver(schema$1)
12380
+ resolver: zod.zodResolver(schema$2)
12402
12381
  });
12403
12382
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12404
12383
  const { handleSuccess } = useRouteModal();
@@ -12568,7 +12547,28 @@ const ShippingAddressForm = ({ order }) => {
12568
12547
  }
12569
12548
  ) });
12570
12549
  };
12571
- const schema$1 = addressSchema;
12550
+ const schema$2 = addressSchema;
12551
+ const CustomItems = () => {
12552
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12553
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Header, { children: /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Custom Items" }) }) }),
12554
+ /* @__PURE__ */ jsxRuntime.jsx(CustomItemsForm, {})
12555
+ ] });
12556
+ };
12557
+ const CustomItemsForm = () => {
12558
+ const form = reactHookForm.useForm({
12559
+ resolver: zod.zodResolver(schema$1)
12560
+ });
12561
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(KeyboundForm, { className: "flex flex-1 flex-col", children: [
12562
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, {}),
12563
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12564
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12565
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", children: "Save" })
12566
+ ] }) })
12567
+ ] }) });
12568
+ };
12569
+ const schema$1 = objectType({
12570
+ email: stringType().email()
12571
+ });
12572
12572
  const TransferOwnership = () => {
12573
12573
  const { id } = reactRouterDom.useParams();
12574
12574
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -13065,29 +13065,25 @@ const routeModule = {
13065
13065
  handle,
13066
13066
  loader,
13067
13067
  children: [
13068
- {
13069
- Component: BillingAddress,
13070
- path: "/draft-orders/:id/billing-address"
13071
- },
13072
13068
  {
13073
13069
  Component: Email,
13074
13070
  path: "/draft-orders/:id/email"
13075
13071
  },
13076
- {
13077
- Component: CustomItems,
13078
- path: "/draft-orders/:id/custom-items"
13079
- },
13080
13072
  {
13081
13073
  Component: Items,
13082
13074
  path: "/draft-orders/:id/items"
13083
13075
  },
13076
+ {
13077
+ Component: Metadata,
13078
+ path: "/draft-orders/:id/metadata"
13079
+ },
13084
13080
  {
13085
13081
  Component: Promotions,
13086
13082
  path: "/draft-orders/:id/promotions"
13087
13083
  },
13088
13084
  {
13089
- Component: Metadata,
13090
- path: "/draft-orders/:id/metadata"
13085
+ Component: BillingAddress,
13086
+ path: "/draft-orders/:id/billing-address"
13091
13087
  },
13092
13088
  {
13093
13089
  Component: SalesChannel,
@@ -13101,6 +13097,10 @@ const routeModule = {
13101
13097
  Component: ShippingAddress,
13102
13098
  path: "/draft-orders/:id/shipping-address"
13103
13099
  },
13100
+ {
13101
+ Component: CustomItems,
13102
+ path: "/draft-orders/:id/custom-items"
13103
+ },
13104
13104
  {
13105
13105
  Component: TransferOwnership,
13106
13106
  path: "/draft-orders/:id/transfer-ownership"