@medusajs/draft-order 2.11.4-preview-20251113032220 → 2.11.4-preview-20251113090133

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.
@@ -9783,74 +9783,6 @@ const CustomItemsForm = () => {
9783
9783
  const schema$4 = objectType({
9784
9784
  email: stringType().email()
9785
9785
  });
9786
- const Email = () => {
9787
- const { id } = reactRouterDom.useParams();
9788
- const { order, isPending, isError, error } = useOrder(id, {
9789
- fields: "+email"
9790
- });
9791
- if (isError) {
9792
- throw error;
9793
- }
9794
- const isReady = !isPending && !!order;
9795
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9796
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9797
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
9798
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9799
- ] }),
9800
- isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
9801
- ] });
9802
- };
9803
- const EmailForm = ({ order }) => {
9804
- const form = reactHookForm.useForm({
9805
- defaultValues: {
9806
- email: order.email ?? ""
9807
- },
9808
- resolver: zod.zodResolver(schema$3)
9809
- });
9810
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9811
- const { handleSuccess } = useRouteModal();
9812
- const onSubmit = form.handleSubmit(async (data) => {
9813
- await mutateAsync(
9814
- { email: data.email },
9815
- {
9816
- onSuccess: () => {
9817
- handleSuccess();
9818
- },
9819
- onError: (error) => {
9820
- ui.toast.error(error.message);
9821
- }
9822
- }
9823
- );
9824
- });
9825
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9826
- KeyboundForm,
9827
- {
9828
- className: "flex flex-1 flex-col overflow-hidden",
9829
- onSubmit,
9830
- children: [
9831
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
9832
- Form$2.Field,
9833
- {
9834
- control: form.control,
9835
- name: "email",
9836
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9837
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
9838
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9839
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9840
- ] })
9841
- }
9842
- ) }),
9843
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9844
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9845
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9846
- ] }) })
9847
- ]
9848
- }
9849
- ) });
9850
- };
9851
- const schema$3 = objectType({
9852
- email: stringType().email()
9853
- });
9854
9786
  const NumberInput = React.forwardRef(
9855
9787
  ({
9856
9788
  value,
@@ -10825,54 +10757,10 @@ const customItemSchema = objectType({
10825
10757
  quantity: numberType(),
10826
10758
  unit_price: unionType([numberType(), stringType()])
10827
10759
  });
10828
- const InlineTip = React.forwardRef(
10829
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10830
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10831
- return /* @__PURE__ */ jsxRuntime.jsxs(
10832
- "div",
10833
- {
10834
- ref,
10835
- className: ui.clx(
10836
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10837
- className
10838
- ),
10839
- ...props,
10840
- children: [
10841
- /* @__PURE__ */ jsxRuntime.jsx(
10842
- "div",
10843
- {
10844
- role: "presentation",
10845
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10846
- "bg-ui-tag-orange-icon": variant === "warning"
10847
- })
10848
- }
10849
- ),
10850
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10851
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10852
- labelValue,
10853
- ":"
10854
- ] }),
10855
- " ",
10856
- children
10857
- ] })
10858
- ]
10859
- }
10860
- );
10861
- }
10862
- );
10863
- InlineTip.displayName = "InlineTip";
10864
- const MetadataFieldSchema = objectType({
10865
- key: stringType(),
10866
- disabled: booleanType().optional(),
10867
- value: anyType()
10868
- });
10869
- const MetadataSchema = objectType({
10870
- metadata: arrayType(MetadataFieldSchema)
10871
- });
10872
- const Metadata = () => {
10760
+ const Email = () => {
10873
10761
  const { id } = reactRouterDom.useParams();
10874
10762
  const { order, isPending, isError, error } = useOrder(id, {
10875
- fields: "metadata"
10763
+ fields: "+email"
10876
10764
  });
10877
10765
  if (isError) {
10878
10766
  throw error;
@@ -10880,33 +10768,26 @@ const Metadata = () => {
10880
10768
  const isReady = !isPending && !!order;
10881
10769
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10882
10770
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10883
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10884
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10771
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
10772
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
10885
10773
  ] }),
10886
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10774
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
10887
10775
  ] });
10888
10776
  };
10889
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10890
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10891
- const MetadataForm = ({ orderId, metadata }) => {
10892
- const { handleSuccess } = useRouteModal();
10893
- const hasUneditableRows = getHasUneditableRows(metadata);
10894
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10777
+ const EmailForm = ({ order }) => {
10895
10778
  const form = reactHookForm.useForm({
10896
10779
  defaultValues: {
10897
- metadata: getDefaultValues(metadata)
10780
+ email: order.email ?? ""
10898
10781
  },
10899
- resolver: zod.zodResolver(MetadataSchema)
10782
+ resolver: zod.zodResolver(schema$3)
10900
10783
  });
10901
- const handleSubmit = form.handleSubmit(async (data) => {
10902
- const parsedData = parseValues(data);
10784
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10785
+ const { handleSuccess } = useRouteModal();
10786
+ const onSubmit = form.handleSubmit(async (data) => {
10903
10787
  await mutateAsync(
10904
- {
10905
- metadata: parsedData
10906
- },
10788
+ { email: data.email },
10907
10789
  {
10908
10790
  onSuccess: () => {
10909
- ui.toast.success("Metadata updated");
10910
10791
  handleSuccess();
10911
10792
  },
10912
10793
  onError: (error) => {
@@ -10915,266 +10796,35 @@ const MetadataForm = ({ orderId, metadata }) => {
10915
10796
  }
10916
10797
  );
10917
10798
  });
10918
- const { fields, insert, remove } = reactHookForm.useFieldArray({
10919
- control: form.control,
10920
- name: "metadata"
10921
- });
10922
- function deleteRow(index) {
10923
- remove(index);
10924
- if (fields.length === 1) {
10925
- insert(0, {
10926
- key: "",
10927
- value: "",
10928
- disabled: false
10929
- });
10930
- }
10931
- }
10932
- function insertRow(index, position) {
10933
- insert(index + (position === "above" ? 0 : 1), {
10934
- key: "",
10935
- value: "",
10936
- disabled: false
10937
- });
10938
- }
10939
10799
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10940
10800
  KeyboundForm,
10941
10801
  {
10942
- onSubmit: handleSubmit,
10943
10802
  className: "flex flex-1 flex-col overflow-hidden",
10803
+ onSubmit,
10944
10804
  children: [
10945
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10946
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10947
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10948
- /* @__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" }) }),
10949
- /* @__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" }) })
10950
- ] }),
10951
- fields.map((field, index) => {
10952
- const isDisabled = field.disabled || false;
10953
- let placeholder = "-";
10954
- if (typeof field.value === "object") {
10955
- placeholder = "{ ... }";
10956
- }
10957
- if (Array.isArray(field.value)) {
10958
- placeholder = "[ ... ]";
10959
- }
10960
- return /* @__PURE__ */ jsxRuntime.jsx(
10961
- ConditionalTooltip,
10962
- {
10963
- showTooltip: isDisabled,
10964
- content: "This row is disabled because it contains non-primitive data.",
10965
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10966
- /* @__PURE__ */ jsxRuntime.jsxs(
10967
- "div",
10968
- {
10969
- className: ui.clx("grid grid-cols-2 divide-x", {
10970
- "overflow-hidden rounded-b-lg": index === fields.length - 1
10971
- }),
10972
- children: [
10973
- /* @__PURE__ */ jsxRuntime.jsx(
10974
- Form$2.Field,
10975
- {
10976
- control: form.control,
10977
- name: `metadata.${index}.key`,
10978
- render: ({ field: field2 }) => {
10979
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10980
- GridInput,
10981
- {
10982
- "aria-labelledby": METADATA_KEY_LABEL_ID,
10983
- ...field2,
10984
- disabled: isDisabled,
10985
- placeholder: "Key"
10986
- }
10987
- ) }) });
10988
- }
10989
- }
10990
- ),
10991
- /* @__PURE__ */ jsxRuntime.jsx(
10992
- Form$2.Field,
10993
- {
10994
- control: form.control,
10995
- name: `metadata.${index}.value`,
10996
- render: ({ field: { value, ...field2 } }) => {
10997
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10998
- GridInput,
10999
- {
11000
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
11001
- ...field2,
11002
- value: isDisabled ? placeholder : value,
11003
- disabled: isDisabled,
11004
- placeholder: "Value"
11005
- }
11006
- ) }) });
11007
- }
11008
- }
11009
- )
11010
- ]
11011
- }
11012
- ),
11013
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11014
- /* @__PURE__ */ jsxRuntime.jsx(
11015
- ui.DropdownMenu.Trigger,
11016
- {
11017
- className: ui.clx(
11018
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11019
- {
11020
- hidden: isDisabled
11021
- }
11022
- ),
11023
- disabled: isDisabled,
11024
- asChild: true,
11025
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11026
- }
11027
- ),
11028
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11029
- /* @__PURE__ */ jsxRuntime.jsxs(
11030
- ui.DropdownMenu.Item,
11031
- {
11032
- className: "gap-x-2",
11033
- onClick: () => insertRow(index, "above"),
11034
- children: [
11035
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11036
- "Insert row above"
11037
- ]
11038
- }
11039
- ),
11040
- /* @__PURE__ */ jsxRuntime.jsxs(
11041
- ui.DropdownMenu.Item,
11042
- {
11043
- className: "gap-x-2",
11044
- onClick: () => insertRow(index, "below"),
11045
- children: [
11046
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11047
- "Insert row below"
11048
- ]
11049
- }
11050
- ),
11051
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11052
- /* @__PURE__ */ jsxRuntime.jsxs(
11053
- ui.DropdownMenu.Item,
11054
- {
11055
- className: "gap-x-2",
11056
- onClick: () => deleteRow(index),
11057
- children: [
11058
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11059
- "Delete row"
11060
- ]
11061
- }
11062
- )
11063
- ] })
11064
- ] })
11065
- ] })
11066
- },
11067
- field.id
11068
- );
11069
- })
11070
- ] }),
11071
- 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." })
11072
- ] }),
11073
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11074
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10805
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
10806
+ Form$2.Field,
10807
+ {
10808
+ control: form.control,
10809
+ name: "email",
10810
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10811
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
10812
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10813
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10814
+ ] })
10815
+ }
10816
+ ) }),
10817
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10818
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11075
10819
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11076
10820
  ] }) })
11077
10821
  ]
11078
10822
  }
11079
10823
  ) });
11080
10824
  };
11081
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11082
- return /* @__PURE__ */ jsxRuntime.jsx(
11083
- "input",
11084
- {
11085
- ref,
11086
- ...props,
11087
- autoComplete: "off",
11088
- className: ui.clx(
11089
- "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",
11090
- className
11091
- )
11092
- }
11093
- );
10825
+ const schema$3 = objectType({
10826
+ email: stringType().email()
11094
10827
  });
11095
- GridInput.displayName = "MetadataForm.GridInput";
11096
- const PlaceholderInner = () => {
11097
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11098
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11099
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11100
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11101
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11102
- ] }) })
11103
- ] });
11104
- };
11105
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11106
- function getDefaultValues(metadata) {
11107
- if (!metadata || !Object.keys(metadata).length) {
11108
- return [
11109
- {
11110
- key: "",
11111
- value: "",
11112
- disabled: false
11113
- }
11114
- ];
11115
- }
11116
- return Object.entries(metadata).map(([key, value]) => {
11117
- if (!EDITABLE_TYPES.includes(typeof value)) {
11118
- return {
11119
- key,
11120
- value,
11121
- disabled: true
11122
- };
11123
- }
11124
- let stringValue = value;
11125
- if (typeof value !== "string") {
11126
- stringValue = JSON.stringify(value);
11127
- }
11128
- return {
11129
- key,
11130
- value: stringValue,
11131
- original_key: key
11132
- };
11133
- });
11134
- }
11135
- function parseValues(values) {
11136
- const metadata = values.metadata;
11137
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11138
- if (isEmpty) {
11139
- return null;
11140
- }
11141
- const update = {};
11142
- metadata.forEach((field) => {
11143
- let key = field.key;
11144
- let value = field.value;
11145
- const disabled = field.disabled;
11146
- if (!key || !value) {
11147
- return;
11148
- }
11149
- if (disabled) {
11150
- update[key] = value;
11151
- return;
11152
- }
11153
- key = key.trim();
11154
- value = value.trim();
11155
- if (value === "true") {
11156
- update[key] = true;
11157
- } else if (value === "false") {
11158
- update[key] = false;
11159
- } else {
11160
- const parsedNumber = parseFloat(value);
11161
- if (!isNaN(parsedNumber)) {
11162
- update[key] = parsedNumber;
11163
- } else {
11164
- update[key] = value;
11165
- }
11166
- }
11167
- });
11168
- return update;
11169
- }
11170
- function getHasUneditableRows(metadata) {
11171
- if (!metadata) {
11172
- return false;
11173
- }
11174
- return Object.values(metadata).some(
11175
- (value) => !EDITABLE_TYPES.includes(typeof value)
11176
- );
11177
- }
11178
10828
  const PROMOTION_QUERY_KEY = "promotions";
11179
10829
  const promotionsQueryKeys = {
11180
10830
  list: (query2) => [
@@ -11441,16 +11091,366 @@ function getPromotionIds(items, shippingMethods) {
11441
11091
  }
11442
11092
  }
11443
11093
  }
11444
- for (const shippingMethod of shippingMethods) {
11445
- if (shippingMethod.adjustments) {
11446
- for (const adjustment of shippingMethod.adjustments) {
11447
- if (adjustment.promotion_id) {
11448
- promotionIds.add(adjustment.promotion_id);
11449
- }
11094
+ for (const shippingMethod of shippingMethods) {
11095
+ if (shippingMethod.adjustments) {
11096
+ for (const adjustment of shippingMethod.adjustments) {
11097
+ if (adjustment.promotion_id) {
11098
+ promotionIds.add(adjustment.promotion_id);
11099
+ }
11100
+ }
11101
+ }
11102
+ }
11103
+ return Array.from(promotionIds);
11104
+ }
11105
+ const InlineTip = React.forwardRef(
11106
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
11107
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
11108
+ return /* @__PURE__ */ jsxRuntime.jsxs(
11109
+ "div",
11110
+ {
11111
+ ref,
11112
+ className: ui.clx(
11113
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
11114
+ className
11115
+ ),
11116
+ ...props,
11117
+ children: [
11118
+ /* @__PURE__ */ jsxRuntime.jsx(
11119
+ "div",
11120
+ {
11121
+ role: "presentation",
11122
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
11123
+ "bg-ui-tag-orange-icon": variant === "warning"
11124
+ })
11125
+ }
11126
+ ),
11127
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
11128
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
11129
+ labelValue,
11130
+ ":"
11131
+ ] }),
11132
+ " ",
11133
+ children
11134
+ ] })
11135
+ ]
11136
+ }
11137
+ );
11138
+ }
11139
+ );
11140
+ InlineTip.displayName = "InlineTip";
11141
+ const MetadataFieldSchema = objectType({
11142
+ key: stringType(),
11143
+ disabled: booleanType().optional(),
11144
+ value: anyType()
11145
+ });
11146
+ const MetadataSchema = objectType({
11147
+ metadata: arrayType(MetadataFieldSchema)
11148
+ });
11149
+ const Metadata = () => {
11150
+ const { id } = reactRouterDom.useParams();
11151
+ const { order, isPending, isError, error } = useOrder(id, {
11152
+ fields: "metadata"
11153
+ });
11154
+ if (isError) {
11155
+ throw error;
11156
+ }
11157
+ const isReady = !isPending && !!order;
11158
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11159
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11160
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
11161
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
11162
+ ] }),
11163
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11164
+ ] });
11165
+ };
11166
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
11167
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
11168
+ const MetadataForm = ({ orderId, metadata }) => {
11169
+ const { handleSuccess } = useRouteModal();
11170
+ const hasUneditableRows = getHasUneditableRows(metadata);
11171
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
11172
+ const form = reactHookForm.useForm({
11173
+ defaultValues: {
11174
+ metadata: getDefaultValues(metadata)
11175
+ },
11176
+ resolver: zod.zodResolver(MetadataSchema)
11177
+ });
11178
+ const handleSubmit = form.handleSubmit(async (data) => {
11179
+ const parsedData = parseValues(data);
11180
+ await mutateAsync(
11181
+ {
11182
+ metadata: parsedData
11183
+ },
11184
+ {
11185
+ onSuccess: () => {
11186
+ ui.toast.success("Metadata updated");
11187
+ handleSuccess();
11188
+ },
11189
+ onError: (error) => {
11190
+ ui.toast.error(error.message);
11191
+ }
11192
+ }
11193
+ );
11194
+ });
11195
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
11196
+ control: form.control,
11197
+ name: "metadata"
11198
+ });
11199
+ function deleteRow(index) {
11200
+ remove(index);
11201
+ if (fields.length === 1) {
11202
+ insert(0, {
11203
+ key: "",
11204
+ value: "",
11205
+ disabled: false
11206
+ });
11207
+ }
11208
+ }
11209
+ function insertRow(index, position) {
11210
+ insert(index + (position === "above" ? 0 : 1), {
11211
+ key: "",
11212
+ value: "",
11213
+ disabled: false
11214
+ });
11215
+ }
11216
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11217
+ KeyboundForm,
11218
+ {
11219
+ onSubmit: handleSubmit,
11220
+ className: "flex flex-1 flex-col overflow-hidden",
11221
+ children: [
11222
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
11223
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
11224
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
11225
+ /* @__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" }) }),
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_VALUE_LABEL_ID, children: "Value" }) })
11227
+ ] }),
11228
+ fields.map((field, index) => {
11229
+ const isDisabled = field.disabled || false;
11230
+ let placeholder = "-";
11231
+ if (typeof field.value === "object") {
11232
+ placeholder = "{ ... }";
11233
+ }
11234
+ if (Array.isArray(field.value)) {
11235
+ placeholder = "[ ... ]";
11236
+ }
11237
+ return /* @__PURE__ */ jsxRuntime.jsx(
11238
+ ConditionalTooltip,
11239
+ {
11240
+ showTooltip: isDisabled,
11241
+ content: "This row is disabled because it contains non-primitive data.",
11242
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
11243
+ /* @__PURE__ */ jsxRuntime.jsxs(
11244
+ "div",
11245
+ {
11246
+ className: ui.clx("grid grid-cols-2 divide-x", {
11247
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
11248
+ }),
11249
+ children: [
11250
+ /* @__PURE__ */ jsxRuntime.jsx(
11251
+ Form$2.Field,
11252
+ {
11253
+ control: form.control,
11254
+ name: `metadata.${index}.key`,
11255
+ render: ({ field: field2 }) => {
11256
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11257
+ GridInput,
11258
+ {
11259
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
11260
+ ...field2,
11261
+ disabled: isDisabled,
11262
+ placeholder: "Key"
11263
+ }
11264
+ ) }) });
11265
+ }
11266
+ }
11267
+ ),
11268
+ /* @__PURE__ */ jsxRuntime.jsx(
11269
+ Form$2.Field,
11270
+ {
11271
+ control: form.control,
11272
+ name: `metadata.${index}.value`,
11273
+ render: ({ field: { value, ...field2 } }) => {
11274
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11275
+ GridInput,
11276
+ {
11277
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
11278
+ ...field2,
11279
+ value: isDisabled ? placeholder : value,
11280
+ disabled: isDisabled,
11281
+ placeholder: "Value"
11282
+ }
11283
+ ) }) });
11284
+ }
11285
+ }
11286
+ )
11287
+ ]
11288
+ }
11289
+ ),
11290
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11291
+ /* @__PURE__ */ jsxRuntime.jsx(
11292
+ ui.DropdownMenu.Trigger,
11293
+ {
11294
+ className: ui.clx(
11295
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11296
+ {
11297
+ hidden: isDisabled
11298
+ }
11299
+ ),
11300
+ disabled: isDisabled,
11301
+ asChild: true,
11302
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11303
+ }
11304
+ ),
11305
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11306
+ /* @__PURE__ */ jsxRuntime.jsxs(
11307
+ ui.DropdownMenu.Item,
11308
+ {
11309
+ className: "gap-x-2",
11310
+ onClick: () => insertRow(index, "above"),
11311
+ children: [
11312
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11313
+ "Insert row above"
11314
+ ]
11315
+ }
11316
+ ),
11317
+ /* @__PURE__ */ jsxRuntime.jsxs(
11318
+ ui.DropdownMenu.Item,
11319
+ {
11320
+ className: "gap-x-2",
11321
+ onClick: () => insertRow(index, "below"),
11322
+ children: [
11323
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11324
+ "Insert row below"
11325
+ ]
11326
+ }
11327
+ ),
11328
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11329
+ /* @__PURE__ */ jsxRuntime.jsxs(
11330
+ ui.DropdownMenu.Item,
11331
+ {
11332
+ className: "gap-x-2",
11333
+ onClick: () => deleteRow(index),
11334
+ children: [
11335
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11336
+ "Delete row"
11337
+ ]
11338
+ }
11339
+ )
11340
+ ] })
11341
+ ] })
11342
+ ] })
11343
+ },
11344
+ field.id
11345
+ );
11346
+ })
11347
+ ] }),
11348
+ 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." })
11349
+ ] }),
11350
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11351
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11352
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11353
+ ] }) })
11354
+ ]
11355
+ }
11356
+ ) });
11357
+ };
11358
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11359
+ return /* @__PURE__ */ jsxRuntime.jsx(
11360
+ "input",
11361
+ {
11362
+ ref,
11363
+ ...props,
11364
+ autoComplete: "off",
11365
+ className: ui.clx(
11366
+ "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",
11367
+ className
11368
+ )
11369
+ }
11370
+ );
11371
+ });
11372
+ GridInput.displayName = "MetadataForm.GridInput";
11373
+ const PlaceholderInner = () => {
11374
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11375
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11376
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11377
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11378
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11379
+ ] }) })
11380
+ ] });
11381
+ };
11382
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
11383
+ function getDefaultValues(metadata) {
11384
+ if (!metadata || !Object.keys(metadata).length) {
11385
+ return [
11386
+ {
11387
+ key: "",
11388
+ value: "",
11389
+ disabled: false
11390
+ }
11391
+ ];
11392
+ }
11393
+ return Object.entries(metadata).map(([key, value]) => {
11394
+ if (!EDITABLE_TYPES.includes(typeof value)) {
11395
+ return {
11396
+ key,
11397
+ value,
11398
+ disabled: true
11399
+ };
11400
+ }
11401
+ let stringValue = value;
11402
+ if (typeof value !== "string") {
11403
+ stringValue = JSON.stringify(value);
11404
+ }
11405
+ return {
11406
+ key,
11407
+ value: stringValue,
11408
+ original_key: key
11409
+ };
11410
+ });
11411
+ }
11412
+ function parseValues(values) {
11413
+ const metadata = values.metadata;
11414
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11415
+ if (isEmpty) {
11416
+ return null;
11417
+ }
11418
+ const update = {};
11419
+ metadata.forEach((field) => {
11420
+ let key = field.key;
11421
+ let value = field.value;
11422
+ const disabled = field.disabled;
11423
+ if (!key || !value) {
11424
+ return;
11425
+ }
11426
+ if (disabled) {
11427
+ update[key] = value;
11428
+ return;
11429
+ }
11430
+ key = key.trim();
11431
+ value = value.trim();
11432
+ if (value === "true") {
11433
+ update[key] = true;
11434
+ } else if (value === "false") {
11435
+ update[key] = false;
11436
+ } else {
11437
+ const parsedNumber = parseFloat(value);
11438
+ if (!isNaN(parsedNumber)) {
11439
+ update[key] = parsedNumber;
11440
+ } else {
11441
+ update[key] = value;
11450
11442
  }
11451
11443
  }
11444
+ });
11445
+ return update;
11446
+ }
11447
+ function getHasUneditableRows(metadata) {
11448
+ if (!metadata) {
11449
+ return false;
11452
11450
  }
11453
- return Array.from(promotionIds);
11451
+ return Object.values(metadata).some(
11452
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11453
+ );
11454
11454
  }
11455
11455
  const SalesChannel = () => {
11456
11456
  const { id } = reactRouterDom.useParams();
@@ -12344,230 +12344,27 @@ const CustomAmountField = ({
12344
12344
  Form$2.Field,
12345
12345
  {
12346
12346
  control,
12347
- name: "custom_amount",
12348
- render: ({ field: { onChange, ...field } }) => {
12349
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12350
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12351
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12352
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12353
- ] }),
12354
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12355
- ui.CurrencyInput,
12356
- {
12357
- ...field,
12358
- onValueChange: (value) => onChange(value),
12359
- symbol: getNativeSymbol(currencyCode),
12360
- code: currencyCode
12361
- }
12362
- ) })
12363
- ] });
12364
- }
12365
- }
12366
- );
12367
- };
12368
- const ShippingAddress = () => {
12369
- const { id } = reactRouterDom.useParams();
12370
- const { order, isPending, isError, error } = useOrder(id, {
12371
- fields: "+shipping_address"
12372
- });
12373
- if (isError) {
12374
- throw error;
12375
- }
12376
- const isReady = !isPending && !!order;
12377
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12378
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12379
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12380
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12381
- ] }),
12382
- isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12383
- ] });
12384
- };
12385
- const ShippingAddressForm = ({ order }) => {
12386
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12387
- const form = reactHookForm.useForm({
12388
- defaultValues: {
12389
- first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12390
- last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12391
- company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12392
- address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12393
- address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12394
- city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12395
- province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12396
- country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12397
- postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12398
- phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12399
- },
12400
- resolver: zod.zodResolver(schema$1)
12401
- });
12402
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12403
- const { handleSuccess } = useRouteModal();
12404
- const onSubmit = form.handleSubmit(async (data) => {
12405
- await mutateAsync(
12406
- {
12407
- shipping_address: {
12408
- first_name: data.first_name,
12409
- last_name: data.last_name,
12410
- company: data.company,
12411
- address_1: data.address_1,
12412
- address_2: data.address_2,
12413
- city: data.city,
12414
- province: data.province,
12415
- country_code: data.country_code,
12416
- postal_code: data.postal_code,
12417
- phone: data.phone
12418
- }
12419
- },
12420
- {
12421
- onSuccess: () => {
12422
- handleSuccess();
12423
- },
12424
- onError: (error) => {
12425
- ui.toast.error(error.message);
12426
- }
12427
- }
12428
- );
12429
- });
12430
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12431
- KeyboundForm,
12432
- {
12433
- className: "flex flex-1 flex-col overflow-hidden",
12434
- onSubmit,
12435
- children: [
12436
- /* @__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: [
12437
- /* @__PURE__ */ jsxRuntime.jsx(
12438
- Form$2.Field,
12439
- {
12440
- control: form.control,
12441
- name: "country_code",
12442
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12443
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12444
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12445
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12446
- ] })
12447
- }
12448
- ),
12449
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12450
- /* @__PURE__ */ jsxRuntime.jsx(
12451
- Form$2.Field,
12452
- {
12453
- control: form.control,
12454
- name: "first_name",
12455
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12456
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12457
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12458
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12459
- ] })
12460
- }
12461
- ),
12462
- /* @__PURE__ */ jsxRuntime.jsx(
12463
- Form$2.Field,
12464
- {
12465
- control: form.control,
12466
- name: "last_name",
12467
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12468
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12469
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12470
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12471
- ] })
12472
- }
12473
- )
12474
- ] }),
12475
- /* @__PURE__ */ jsxRuntime.jsx(
12476
- Form$2.Field,
12477
- {
12478
- control: form.control,
12479
- name: "company",
12480
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12481
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12482
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12483
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12484
- ] })
12485
- }
12486
- ),
12487
- /* @__PURE__ */ jsxRuntime.jsx(
12488
- Form$2.Field,
12489
- {
12490
- control: form.control,
12491
- name: "address_1",
12492
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12493
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12494
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12495
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12496
- ] })
12497
- }
12498
- ),
12499
- /* @__PURE__ */ jsxRuntime.jsx(
12500
- Form$2.Field,
12501
- {
12502
- control: form.control,
12503
- name: "address_2",
12504
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12505
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12506
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12507
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12508
- ] })
12509
- }
12510
- ),
12511
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12512
- /* @__PURE__ */ jsxRuntime.jsx(
12513
- Form$2.Field,
12514
- {
12515
- control: form.control,
12516
- name: "postal_code",
12517
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12518
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12519
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12520
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12521
- ] })
12522
- }
12523
- ),
12524
- /* @__PURE__ */ jsxRuntime.jsx(
12525
- Form$2.Field,
12526
- {
12527
- control: form.control,
12528
- name: "city",
12529
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12530
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
12531
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12532
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12533
- ] })
12534
- }
12535
- )
12536
- ] }),
12537
- /* @__PURE__ */ jsxRuntime.jsx(
12538
- Form$2.Field,
12539
- {
12540
- control: form.control,
12541
- name: "province",
12542
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12543
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
12544
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12545
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12546
- ] })
12547
- }
12548
- ),
12549
- /* @__PURE__ */ jsxRuntime.jsx(
12550
- Form$2.Field,
12347
+ name: "custom_amount",
12348
+ render: ({ field: { onChange, ...field } }) => {
12349
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-x-3", children: [
12350
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
12351
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Custom amount" }),
12352
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Hint, { children: "Set a custom amount for the shipping option." })
12353
+ ] }),
12354
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12355
+ ui.CurrencyInput,
12551
12356
  {
12552
- control: form.control,
12553
- name: "phone",
12554
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12555
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
12556
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12557
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12558
- ] })
12357
+ ...field,
12358
+ onValueChange: (value) => onChange(value),
12359
+ symbol: getNativeSymbol(currencyCode),
12360
+ code: currencyCode
12559
12361
  }
12560
- )
12561
- ] }) }),
12562
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12563
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12564
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12565
- ] }) })
12566
- ]
12362
+ ) })
12363
+ ] });
12364
+ }
12567
12365
  }
12568
- ) });
12366
+ );
12569
12367
  };
12570
- const schema$1 = addressSchema;
12571
12368
  const TransferOwnership = () => {
12572
12369
  const { id } = reactRouterDom.useParams();
12573
12370
  const { draft_order, isPending, isError, error } = useDraftOrder(id, {
@@ -12591,7 +12388,7 @@ const TransferOwnershipForm = ({ order }) => {
12591
12388
  defaultValues: {
12592
12389
  customer_id: order.customer_id || ""
12593
12390
  },
12594
- resolver: zod.zodResolver(schema)
12391
+ resolver: zod.zodResolver(schema$1)
12595
12392
  });
12596
12393
  const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12597
12394
  const { handleSuccess } = useRouteModal();
@@ -13041,9 +12838,212 @@ const Illustration = () => {
13041
12838
  }
13042
12839
  );
13043
12840
  };
13044
- const schema = objectType({
12841
+ const schema$1 = objectType({
13045
12842
  customer_id: stringType().min(1)
13046
12843
  });
12844
+ const ShippingAddress = () => {
12845
+ const { id } = reactRouterDom.useParams();
12846
+ const { order, isPending, isError, error } = useOrder(id, {
12847
+ fields: "+shipping_address"
12848
+ });
12849
+ if (isError) {
12850
+ throw error;
12851
+ }
12852
+ const isReady = !isPending && !!order;
12853
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12854
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12855
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Shipping Address" }) }),
12856
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the shipping address for the draft order" }) })
12857
+ ] }),
12858
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(ShippingAddressForm, { order })
12859
+ ] });
12860
+ };
12861
+ const ShippingAddressForm = ({ order }) => {
12862
+ var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
12863
+ const form = reactHookForm.useForm({
12864
+ defaultValues: {
12865
+ first_name: ((_a = order.shipping_address) == null ? void 0 : _a.first_name) ?? "",
12866
+ last_name: ((_b = order.shipping_address) == null ? void 0 : _b.last_name) ?? "",
12867
+ company: ((_c = order.shipping_address) == null ? void 0 : _c.company) ?? "",
12868
+ address_1: ((_d = order.shipping_address) == null ? void 0 : _d.address_1) ?? "",
12869
+ address_2: ((_e = order.shipping_address) == null ? void 0 : _e.address_2) ?? "",
12870
+ city: ((_f = order.shipping_address) == null ? void 0 : _f.city) ?? "",
12871
+ province: ((_g = order.shipping_address) == null ? void 0 : _g.province) ?? "",
12872
+ country_code: ((_h = order.shipping_address) == null ? void 0 : _h.country_code) ?? "",
12873
+ postal_code: ((_i = order.shipping_address) == null ? void 0 : _i.postal_code) ?? "",
12874
+ phone: ((_j = order.shipping_address) == null ? void 0 : _j.phone) ?? ""
12875
+ },
12876
+ resolver: zod.zodResolver(schema)
12877
+ });
12878
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12879
+ const { handleSuccess } = useRouteModal();
12880
+ const onSubmit = form.handleSubmit(async (data) => {
12881
+ await mutateAsync(
12882
+ {
12883
+ shipping_address: {
12884
+ first_name: data.first_name,
12885
+ last_name: data.last_name,
12886
+ company: data.company,
12887
+ address_1: data.address_1,
12888
+ address_2: data.address_2,
12889
+ city: data.city,
12890
+ province: data.province,
12891
+ country_code: data.country_code,
12892
+ postal_code: data.postal_code,
12893
+ phone: data.phone
12894
+ }
12895
+ },
12896
+ {
12897
+ onSuccess: () => {
12898
+ handleSuccess();
12899
+ },
12900
+ onError: (error) => {
12901
+ ui.toast.error(error.message);
12902
+ }
12903
+ }
12904
+ );
12905
+ });
12906
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12907
+ KeyboundForm,
12908
+ {
12909
+ className: "flex flex-1 flex-col overflow-hidden",
12910
+ onSubmit,
12911
+ children: [
12912
+ /* @__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: [
12913
+ /* @__PURE__ */ jsxRuntime.jsx(
12914
+ Form$2.Field,
12915
+ {
12916
+ control: form.control,
12917
+ name: "country_code",
12918
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12919
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Country" }),
12920
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(CountrySelect, { ...field }) }),
12921
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12922
+ ] })
12923
+ }
12924
+ ),
12925
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12926
+ /* @__PURE__ */ jsxRuntime.jsx(
12927
+ Form$2.Field,
12928
+ {
12929
+ control: form.control,
12930
+ name: "first_name",
12931
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12932
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "First name" }),
12933
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12934
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12935
+ ] })
12936
+ }
12937
+ ),
12938
+ /* @__PURE__ */ jsxRuntime.jsx(
12939
+ Form$2.Field,
12940
+ {
12941
+ control: form.control,
12942
+ name: "last_name",
12943
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12944
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Last name" }),
12945
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12946
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12947
+ ] })
12948
+ }
12949
+ )
12950
+ ] }),
12951
+ /* @__PURE__ */ jsxRuntime.jsx(
12952
+ Form$2.Field,
12953
+ {
12954
+ control: form.control,
12955
+ name: "company",
12956
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12957
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Company" }),
12958
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12959
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12960
+ ] })
12961
+ }
12962
+ ),
12963
+ /* @__PURE__ */ jsxRuntime.jsx(
12964
+ Form$2.Field,
12965
+ {
12966
+ control: form.control,
12967
+ name: "address_1",
12968
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12969
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Address" }),
12970
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12971
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12972
+ ] })
12973
+ }
12974
+ ),
12975
+ /* @__PURE__ */ jsxRuntime.jsx(
12976
+ Form$2.Field,
12977
+ {
12978
+ control: form.control,
12979
+ name: "address_2",
12980
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12981
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Apartment, suite, etc." }),
12982
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12983
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12984
+ ] })
12985
+ }
12986
+ ),
12987
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
12988
+ /* @__PURE__ */ jsxRuntime.jsx(
12989
+ Form$2.Field,
12990
+ {
12991
+ control: form.control,
12992
+ name: "postal_code",
12993
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12994
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Postal code" }),
12995
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
12996
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12997
+ ] })
12998
+ }
12999
+ ),
13000
+ /* @__PURE__ */ jsxRuntime.jsx(
13001
+ Form$2.Field,
13002
+ {
13003
+ control: form.control,
13004
+ name: "city",
13005
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13006
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "City" }),
13007
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13008
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13009
+ ] })
13010
+ }
13011
+ )
13012
+ ] }),
13013
+ /* @__PURE__ */ jsxRuntime.jsx(
13014
+ Form$2.Field,
13015
+ {
13016
+ control: form.control,
13017
+ name: "province",
13018
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13019
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Province / State" }),
13020
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13021
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13022
+ ] })
13023
+ }
13024
+ ),
13025
+ /* @__PURE__ */ jsxRuntime.jsx(
13026
+ Form$2.Field,
13027
+ {
13028
+ control: form.control,
13029
+ name: "phone",
13030
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
13031
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { optional: true, children: "Phone" }),
13032
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
13033
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
13034
+ ] })
13035
+ }
13036
+ )
13037
+ ] }) }),
13038
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
13039
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
13040
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
13041
+ ] }) })
13042
+ ]
13043
+ }
13044
+ ) });
13045
+ };
13046
+ const schema = addressSchema;
13047
13047
  const widgetModule = { widgets: [] };
13048
13048
  const routeModule = {
13049
13049
  routes: [
@@ -13072,22 +13072,22 @@ const routeModule = {
13072
13072
  Component: CustomItems,
13073
13073
  path: "/draft-orders/:id/custom-items"
13074
13074
  },
13075
- {
13076
- Component: Email,
13077
- path: "/draft-orders/:id/email"
13078
- },
13079
13075
  {
13080
13076
  Component: Items,
13081
13077
  path: "/draft-orders/:id/items"
13082
13078
  },
13083
13079
  {
13084
- Component: Metadata,
13085
- path: "/draft-orders/:id/metadata"
13080
+ Component: Email,
13081
+ path: "/draft-orders/:id/email"
13086
13082
  },
13087
13083
  {
13088
13084
  Component: Promotions,
13089
13085
  path: "/draft-orders/:id/promotions"
13090
13086
  },
13087
+ {
13088
+ Component: Metadata,
13089
+ path: "/draft-orders/:id/metadata"
13090
+ },
13091
13091
  {
13092
13092
  Component: SalesChannel,
13093
13093
  path: "/draft-orders/:id/sales-channel"
@@ -13096,13 +13096,13 @@ const routeModule = {
13096
13096
  Component: Shipping,
13097
13097
  path: "/draft-orders/:id/shipping"
13098
13098
  },
13099
- {
13100
- Component: ShippingAddress,
13101
- path: "/draft-orders/:id/shipping-address"
13102
- },
13103
13099
  {
13104
13100
  Component: TransferOwnership,
13105
13101
  path: "/draft-orders/:id/transfer-ownership"
13102
+ },
13103
+ {
13104
+ Component: ShippingAddress,
13105
+ path: "/draft-orders/:id/shipping-address"
13106
13106
  }
13107
13107
  ]
13108
13108
  }