@medusajs/draft-order 2.11.0-snapshot-20251019075109 → 2.11.0

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.
@@ -7823,12 +7823,10 @@ const CustomerField$1 = ({ control, setValue }) => {
7823
7823
  (option) => option.value === value
7824
7824
  )) == null ? void 0 : _a.label;
7825
7825
  const customerEmail = ((_b = label == null ? void 0 : label.match(/\((.*@.*)\)$/)) == null ? void 0 : _b[1]) || label;
7826
- if (!email && customerEmail) {
7827
- setValue("email", customerEmail, {
7828
- shouldDirty: true,
7829
- shouldTouch: true
7830
- });
7831
- }
7826
+ setValue("email", customerEmail || "", {
7827
+ shouldDirty: true,
7828
+ shouldTouch: true
7829
+ });
7832
7830
  },
7833
7831
  [email, setValue, customers.options]
7834
7832
  );
@@ -9784,74 +9782,6 @@ const BillingAddressForm = ({ order }) => {
9784
9782
  ) });
9785
9783
  };
9786
9784
  const schema$4 = addressSchema;
9787
- const Email = () => {
9788
- const { id } = reactRouterDom.useParams();
9789
- const { order, isPending, isError, error } = useOrder(id, {
9790
- fields: "+email"
9791
- });
9792
- if (isError) {
9793
- throw error;
9794
- }
9795
- const isReady = !isPending && !!order;
9796
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9797
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9798
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
9799
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
9800
- ] }),
9801
- isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
9802
- ] });
9803
- };
9804
- const EmailForm = ({ order }) => {
9805
- const form = reactHookForm.useForm({
9806
- defaultValues: {
9807
- email: order.email ?? ""
9808
- },
9809
- resolver: zod.zodResolver(schema$3)
9810
- });
9811
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
9812
- const { handleSuccess } = useRouteModal();
9813
- const onSubmit = form.handleSubmit(async (data) => {
9814
- await mutateAsync(
9815
- { email: data.email },
9816
- {
9817
- onSuccess: () => {
9818
- handleSuccess();
9819
- },
9820
- onError: (error) => {
9821
- ui.toast.error(error.message);
9822
- }
9823
- }
9824
- );
9825
- });
9826
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9827
- KeyboundForm,
9828
- {
9829
- className: "flex flex-1 flex-col overflow-hidden",
9830
- onSubmit,
9831
- children: [
9832
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
9833
- Form$2.Field,
9834
- {
9835
- control: form.control,
9836
- name: "email",
9837
- render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
9838
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
9839
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
9840
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
9841
- ] })
9842
- }
9843
- ) }),
9844
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
9845
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
9846
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9847
- ] }) })
9848
- ]
9849
- }
9850
- ) });
9851
- };
9852
- const schema$3 = objectType({
9853
- email: stringType().email()
9854
- });
9855
9785
  const NumberInput = React.forwardRef(
9856
9786
  ({
9857
9787
  value,
@@ -10826,54 +10756,10 @@ const customItemSchema = objectType({
10826
10756
  quantity: numberType(),
10827
10757
  unit_price: unionType([numberType(), stringType()])
10828
10758
  });
10829
- const InlineTip = React.forwardRef(
10830
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10831
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10832
- return /* @__PURE__ */ jsxRuntime.jsxs(
10833
- "div",
10834
- {
10835
- ref,
10836
- className: ui.clx(
10837
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10838
- className
10839
- ),
10840
- ...props,
10841
- children: [
10842
- /* @__PURE__ */ jsxRuntime.jsx(
10843
- "div",
10844
- {
10845
- role: "presentation",
10846
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10847
- "bg-ui-tag-orange-icon": variant === "warning"
10848
- })
10849
- }
10850
- ),
10851
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10852
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10853
- labelValue,
10854
- ":"
10855
- ] }),
10856
- " ",
10857
- children
10858
- ] })
10859
- ]
10860
- }
10861
- );
10862
- }
10863
- );
10864
- InlineTip.displayName = "InlineTip";
10865
- const MetadataFieldSchema = objectType({
10866
- key: stringType(),
10867
- disabled: booleanType().optional(),
10868
- value: anyType()
10869
- });
10870
- const MetadataSchema = objectType({
10871
- metadata: arrayType(MetadataFieldSchema)
10872
- });
10873
- const Metadata = () => {
10759
+ const Email = () => {
10874
10760
  const { id } = reactRouterDom.useParams();
10875
10761
  const { order, isPending, isError, error } = useOrder(id, {
10876
- fields: "metadata"
10762
+ fields: "+email"
10877
10763
  });
10878
10764
  if (isError) {
10879
10765
  throw error;
@@ -10881,33 +10767,103 @@ const Metadata = () => {
10881
10767
  const isReady = !isPending && !!order;
10882
10768
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10883
10769
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10884
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10885
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10770
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Email" }) }),
10771
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Edit the email for the draft order" }) })
10886
10772
  ] }),
10887
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10773
+ isReady && /* @__PURE__ */ jsxRuntime.jsx(EmailForm, { order })
10888
10774
  ] });
10889
10775
  };
10890
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10891
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10892
- const MetadataForm = ({ orderId, metadata }) => {
10776
+ const EmailForm = ({ order }) => {
10777
+ const form = reactHookForm.useForm({
10778
+ defaultValues: {
10779
+ email: order.email ?? ""
10780
+ },
10781
+ resolver: zod.zodResolver(schema$3)
10782
+ });
10783
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10893
10784
  const { handleSuccess } = useRouteModal();
10894
- const hasUneditableRows = getHasUneditableRows(metadata);
10895
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10785
+ const onSubmit = form.handleSubmit(async (data) => {
10786
+ await mutateAsync(
10787
+ { email: data.email },
10788
+ {
10789
+ onSuccess: () => {
10790
+ handleSuccess();
10791
+ },
10792
+ onError: (error) => {
10793
+ ui.toast.error(error.message);
10794
+ }
10795
+ }
10796
+ );
10797
+ });
10798
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10799
+ KeyboundForm,
10800
+ {
10801
+ className: "flex flex-1 flex-col overflow-hidden",
10802
+ onSubmit,
10803
+ children: [
10804
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
10805
+ Form$2.Field,
10806
+ {
10807
+ control: form.control,
10808
+ name: "email",
10809
+ render: ({ field }) => /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10810
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Email" }),
10811
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Input, { ...field }) }),
10812
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10813
+ ] })
10814
+ }
10815
+ ) }),
10816
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10817
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
10818
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
10819
+ ] }) })
10820
+ ]
10821
+ }
10822
+ ) });
10823
+ };
10824
+ const schema$3 = objectType({
10825
+ email: stringType().email()
10826
+ });
10827
+ const SalesChannel = () => {
10828
+ const { id } = reactRouterDom.useParams();
10829
+ const { draft_order, isPending, isError, error } = useDraftOrder(
10830
+ id,
10831
+ {
10832
+ fields: "+sales_channel_id"
10833
+ },
10834
+ {
10835
+ enabled: !!id
10836
+ }
10837
+ );
10838
+ if (isError) {
10839
+ throw error;
10840
+ }
10841
+ const ISrEADY = !!draft_order && !isPending;
10842
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10843
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10844
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
10845
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
10846
+ ] }),
10847
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
10848
+ ] });
10849
+ };
10850
+ const SalesChannelForm = ({ order }) => {
10896
10851
  const form = reactHookForm.useForm({
10897
10852
  defaultValues: {
10898
- metadata: getDefaultValues(metadata)
10853
+ sales_channel_id: order.sales_channel_id || ""
10899
10854
  },
10900
- resolver: zod.zodResolver(MetadataSchema)
10855
+ resolver: zod.zodResolver(schema$2)
10901
10856
  });
10902
- const handleSubmit = form.handleSubmit(async (data) => {
10903
- const parsedData = parseValues(data);
10857
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
10858
+ const { handleSuccess } = useRouteModal();
10859
+ const onSubmit = form.handleSubmit(async (data) => {
10904
10860
  await mutateAsync(
10905
10861
  {
10906
- metadata: parsedData
10862
+ sales_channel_id: data.sales_channel_id
10907
10863
  },
10908
10864
  {
10909
10865
  onSuccess: () => {
10910
- ui.toast.success("Metadata updated");
10866
+ ui.toast.success("Sales channel updated");
10911
10867
  handleSuccess();
10912
10868
  },
10913
10869
  onError: (error) => {
@@ -10916,266 +10872,64 @@ const MetadataForm = ({ orderId, metadata }) => {
10916
10872
  }
10917
10873
  );
10918
10874
  });
10919
- const { fields, insert, remove } = reactHookForm.useFieldArray({
10920
- control: form.control,
10921
- name: "metadata"
10922
- });
10923
- function deleteRow(index) {
10924
- remove(index);
10925
- if (fields.length === 1) {
10926
- insert(0, {
10927
- key: "",
10928
- value: "",
10929
- disabled: false
10930
- });
10931
- }
10932
- }
10933
- function insertRow(index, position) {
10934
- insert(index + (position === "above" ? 0 : 1), {
10935
- key: "",
10936
- value: "",
10937
- disabled: false
10938
- });
10939
- }
10940
10875
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10941
10876
  KeyboundForm,
10942
10877
  {
10943
- onSubmit: handleSubmit,
10944
10878
  className: "flex flex-1 flex-col overflow-hidden",
10879
+ onSubmit,
10945
10880
  children: [
10946
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10947
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10948
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
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_KEY_LABEL_ID, children: "Key" }) }),
10950
- /* @__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" }) })
10951
- ] }),
10952
- fields.map((field, index) => {
10953
- const isDisabled = field.disabled || false;
10954
- let placeholder = "-";
10955
- if (typeof field.value === "object") {
10956
- placeholder = "{ ... }";
10957
- }
10958
- if (Array.isArray(field.value)) {
10959
- placeholder = "[ ... ]";
10960
- }
10961
- return /* @__PURE__ */ jsxRuntime.jsx(
10962
- ConditionalTooltip,
10963
- {
10964
- showTooltip: isDisabled,
10965
- content: "This row is disabled because it contains non-primitive data.",
10966
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10967
- /* @__PURE__ */ jsxRuntime.jsxs(
10968
- "div",
10969
- {
10970
- className: ui.clx("grid grid-cols-2 divide-x", {
10971
- "overflow-hidden rounded-b-lg": index === fields.length - 1
10972
- }),
10973
- children: [
10974
- /* @__PURE__ */ jsxRuntime.jsx(
10975
- Form$2.Field,
10976
- {
10977
- control: form.control,
10978
- name: `metadata.${index}.key`,
10979
- render: ({ field: field2 }) => {
10980
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10981
- GridInput,
10982
- {
10983
- "aria-labelledby": METADATA_KEY_LABEL_ID,
10984
- ...field2,
10985
- disabled: isDisabled,
10986
- placeholder: "Key"
10987
- }
10988
- ) }) });
10989
- }
10990
- }
10991
- ),
10992
- /* @__PURE__ */ jsxRuntime.jsx(
10993
- Form$2.Field,
10994
- {
10995
- control: form.control,
10996
- name: `metadata.${index}.value`,
10997
- render: ({ field: { value, ...field2 } }) => {
10998
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10999
- GridInput,
11000
- {
11001
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
11002
- ...field2,
11003
- value: isDisabled ? placeholder : value,
11004
- disabled: isDisabled,
11005
- placeholder: "Value"
11006
- }
11007
- ) }) });
11008
- }
11009
- }
11010
- )
11011
- ]
11012
- }
11013
- ),
11014
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11015
- /* @__PURE__ */ jsxRuntime.jsx(
11016
- ui.DropdownMenu.Trigger,
11017
- {
11018
- className: ui.clx(
11019
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11020
- {
11021
- hidden: isDisabled
11022
- }
11023
- ),
11024
- disabled: isDisabled,
11025
- asChild: true,
11026
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11027
- }
11028
- ),
11029
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11030
- /* @__PURE__ */ jsxRuntime.jsxs(
11031
- ui.DropdownMenu.Item,
11032
- {
11033
- className: "gap-x-2",
11034
- onClick: () => insertRow(index, "above"),
11035
- children: [
11036
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11037
- "Insert row above"
11038
- ]
11039
- }
11040
- ),
11041
- /* @__PURE__ */ jsxRuntime.jsxs(
11042
- ui.DropdownMenu.Item,
11043
- {
11044
- className: "gap-x-2",
11045
- onClick: () => insertRow(index, "below"),
11046
- children: [
11047
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11048
- "Insert row below"
11049
- ]
11050
- }
11051
- ),
11052
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11053
- /* @__PURE__ */ jsxRuntime.jsxs(
11054
- ui.DropdownMenu.Item,
11055
- {
11056
- className: "gap-x-2",
11057
- onClick: () => deleteRow(index),
11058
- children: [
11059
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11060
- "Delete row"
11061
- ]
11062
- }
11063
- )
11064
- ] })
11065
- ] })
11066
- ] })
11067
- },
11068
- field.id
11069
- );
11070
- })
11071
- ] }),
11072
- 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." })
11073
- ] }),
11074
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11075
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
10881
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
10882
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
10883
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11076
10884
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11077
10885
  ] }) })
11078
10886
  ]
11079
10887
  }
11080
10888
  ) });
11081
10889
  };
11082
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
10890
+ const SalesChannelField = ({ control, order }) => {
10891
+ const salesChannels = useComboboxData({
10892
+ queryFn: async (params) => {
10893
+ return await sdk.admin.salesChannel.list(params);
10894
+ },
10895
+ queryKey: ["sales-channels"],
10896
+ getOptions: (data) => {
10897
+ return data.sales_channels.map((salesChannel) => ({
10898
+ label: salesChannel.name,
10899
+ value: salesChannel.id
10900
+ }));
10901
+ },
10902
+ defaultValue: order.sales_channel_id || void 0
10903
+ });
11083
10904
  return /* @__PURE__ */ jsxRuntime.jsx(
11084
- "input",
10905
+ Form$2.Field,
11085
10906
  {
11086
- ref,
11087
- ...props,
11088
- autoComplete: "off",
11089
- className: ui.clx(
11090
- "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",
11091
- className
11092
- )
11093
- }
11094
- );
11095
- });
11096
- GridInput.displayName = "MetadataForm.GridInput";
11097
- const PlaceholderInner = () => {
11098
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11099
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11100
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11101
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11102
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11103
- ] }) })
11104
- ] });
11105
- };
11106
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11107
- function getDefaultValues(metadata) {
11108
- if (!metadata || !Object.keys(metadata).length) {
11109
- return [
11110
- {
11111
- key: "",
11112
- value: "",
11113
- disabled: false
11114
- }
11115
- ];
11116
- }
11117
- return Object.entries(metadata).map(([key, value]) => {
11118
- if (!EDITABLE_TYPES.includes(typeof value)) {
11119
- return {
11120
- key,
11121
- value,
11122
- disabled: true
11123
- };
11124
- }
11125
- let stringValue = value;
11126
- if (typeof value !== "string") {
11127
- stringValue = JSON.stringify(value);
11128
- }
11129
- return {
11130
- key,
11131
- value: stringValue,
11132
- original_key: key
11133
- };
11134
- });
11135
- }
11136
- function parseValues(values) {
11137
- const metadata = values.metadata;
11138
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11139
- if (isEmpty) {
11140
- return null;
11141
- }
11142
- const update = {};
11143
- metadata.forEach((field) => {
11144
- let key = field.key;
11145
- let value = field.value;
11146
- const disabled = field.disabled;
11147
- if (!key || !value) {
11148
- return;
11149
- }
11150
- if (disabled) {
11151
- update[key] = value;
11152
- return;
11153
- }
11154
- key = key.trim();
11155
- value = value.trim();
11156
- if (value === "true") {
11157
- update[key] = true;
11158
- } else if (value === "false") {
11159
- update[key] = false;
11160
- } else {
11161
- const parsedNumber = parseFloat(value);
11162
- if (!isNaN(parsedNumber)) {
11163
- update[key] = parsedNumber;
11164
- } else {
11165
- update[key] = value;
10907
+ control,
10908
+ name: "sales_channel_id",
10909
+ render: ({ field }) => {
10910
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
10911
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
10912
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10913
+ Combobox,
10914
+ {
10915
+ options: salesChannels.options,
10916
+ fetchNextPage: salesChannels.fetchNextPage,
10917
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
10918
+ searchValue: salesChannels.searchValue,
10919
+ onSearchValueChange: salesChannels.onSearchValueChange,
10920
+ placeholder: "Select sales channel",
10921
+ ...field
10922
+ }
10923
+ ) }),
10924
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
10925
+ ] });
11166
10926
  }
11167
10927
  }
11168
- });
11169
- return update;
11170
- }
11171
- function getHasUneditableRows(metadata) {
11172
- if (!metadata) {
11173
- return false;
11174
- }
11175
- return Object.values(metadata).some(
11176
- (value) => !EDITABLE_TYPES.includes(typeof value)
11177
10928
  );
11178
- }
10929
+ };
10930
+ const schema$2 = objectType({
10931
+ sales_channel_id: stringType().min(1)
10932
+ });
11179
10933
  const PROMOTION_QUERY_KEY = "promotions";
11180
10934
  const promotionsQueryKeys = {
11181
10935
  list: (query2) => [
@@ -11453,115 +11207,9 @@ function getPromotionIds(items, shippingMethods) {
11453
11207
  }
11454
11208
  return Array.from(promotionIds);
11455
11209
  }
11456
- const SalesChannel = () => {
11457
- const { id } = reactRouterDom.useParams();
11458
- const { draft_order, isPending, isError, error } = useDraftOrder(
11459
- id,
11460
- {
11461
- fields: "+sales_channel_id"
11462
- },
11463
- {
11464
- enabled: !!id
11465
- }
11466
- );
11467
- if (isError) {
11468
- throw error;
11469
- }
11470
- const ISrEADY = !!draft_order && !isPending;
11471
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11472
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11473
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11474
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Update which sales channel the draft order is associated with" }) })
11475
- ] }),
11476
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11477
- ] });
11478
- };
11479
- const SalesChannelForm = ({ order }) => {
11480
- const form = reactHookForm.useForm({
11481
- defaultValues: {
11482
- sales_channel_id: order.sales_channel_id || ""
11483
- },
11484
- resolver: zod.zodResolver(schema$2)
11485
- });
11486
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11487
- const { handleSuccess } = useRouteModal();
11488
- const onSubmit = form.handleSubmit(async (data) => {
11489
- await mutateAsync(
11490
- {
11491
- sales_channel_id: data.sales_channel_id
11492
- },
11493
- {
11494
- onSuccess: () => {
11495
- ui.toast.success("Sales channel updated");
11496
- handleSuccess();
11497
- },
11498
- onError: (error) => {
11499
- ui.toast.error(error.message);
11500
- }
11501
- }
11502
- );
11503
- });
11504
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11505
- KeyboundForm,
11506
- {
11507
- className: "flex flex-1 flex-col overflow-hidden",
11508
- onSubmit,
11509
- children: [
11510
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11511
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11512
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
11513
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11514
- ] }) })
11515
- ]
11516
- }
11517
- ) });
11518
- };
11519
- const SalesChannelField = ({ control, order }) => {
11520
- const salesChannels = useComboboxData({
11521
- queryFn: async (params) => {
11522
- return await sdk.admin.salesChannel.list(params);
11523
- },
11524
- queryKey: ["sales-channels"],
11525
- getOptions: (data) => {
11526
- return data.sales_channels.map((salesChannel) => ({
11527
- label: salesChannel.name,
11528
- value: salesChannel.id
11529
- }));
11530
- },
11531
- defaultValue: order.sales_channel_id || void 0
11532
- });
11533
- return /* @__PURE__ */ jsxRuntime.jsx(
11534
- Form$2.Field,
11535
- {
11536
- control,
11537
- name: "sales_channel_id",
11538
- render: ({ field }) => {
11539
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11540
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11541
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11542
- Combobox,
11543
- {
11544
- options: salesChannels.options,
11545
- fetchNextPage: salesChannels.fetchNextPage,
11546
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11547
- searchValue: salesChannels.searchValue,
11548
- onSearchValueChange: salesChannels.onSearchValueChange,
11549
- placeholder: "Select sales channel",
11550
- ...field
11551
- }
11552
- ) }),
11553
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11554
- ] });
11555
- }
11556
- }
11557
- );
11558
- };
11559
- const schema$2 = objectType({
11560
- sales_channel_id: stringType().min(1)
11561
- });
11562
- const STACKED_FOCUS_MODAL_ID = "shipping-form";
11563
- const Shipping = () => {
11564
- var _a;
11210
+ const STACKED_FOCUS_MODAL_ID = "shipping-form";
11211
+ const Shipping = () => {
11212
+ var _a;
11565
11213
  const { id } = reactRouterDom.useParams();
11566
11214
  const { order, isPending, isError, error } = useOrder(id, {
11567
11215
  fields: "+items.*,+items.variant.*,+items.variant.product.*,+items.variant.product.shipping_profile.*,+currency_code"
@@ -13045,6 +12693,356 @@ const Illustration = () => {
13045
12693
  const schema = objectType({
13046
12694
  customer_id: stringType().min(1)
13047
12695
  });
12696
+ const InlineTip = React.forwardRef(
12697
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
12698
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
12699
+ return /* @__PURE__ */ jsxRuntime.jsxs(
12700
+ "div",
12701
+ {
12702
+ ref,
12703
+ className: ui.clx(
12704
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
12705
+ className
12706
+ ),
12707
+ ...props,
12708
+ children: [
12709
+ /* @__PURE__ */ jsxRuntime.jsx(
12710
+ "div",
12711
+ {
12712
+ role: "presentation",
12713
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
12714
+ "bg-ui-tag-orange-icon": variant === "warning"
12715
+ })
12716
+ }
12717
+ ),
12718
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
12719
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
12720
+ labelValue,
12721
+ ":"
12722
+ ] }),
12723
+ " ",
12724
+ children
12725
+ ] })
12726
+ ]
12727
+ }
12728
+ );
12729
+ }
12730
+ );
12731
+ InlineTip.displayName = "InlineTip";
12732
+ const MetadataFieldSchema = objectType({
12733
+ key: stringType(),
12734
+ disabled: booleanType().optional(),
12735
+ value: anyType()
12736
+ });
12737
+ const MetadataSchema = objectType({
12738
+ metadata: arrayType(MetadataFieldSchema)
12739
+ });
12740
+ const Metadata = () => {
12741
+ const { id } = reactRouterDom.useParams();
12742
+ const { order, isPending, isError, error } = useOrder(id, {
12743
+ fields: "metadata"
12744
+ });
12745
+ if (isError) {
12746
+ throw error;
12747
+ }
12748
+ const isReady = !isPending && !!order;
12749
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12750
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12751
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
12752
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
12753
+ ] }),
12754
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
12755
+ ] });
12756
+ };
12757
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
12758
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
12759
+ const MetadataForm = ({ orderId, metadata }) => {
12760
+ const { handleSuccess } = useRouteModal();
12761
+ const hasUneditableRows = getHasUneditableRows(metadata);
12762
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
12763
+ const form = reactHookForm.useForm({
12764
+ defaultValues: {
12765
+ metadata: getDefaultValues(metadata)
12766
+ },
12767
+ resolver: zod.zodResolver(MetadataSchema)
12768
+ });
12769
+ const handleSubmit = form.handleSubmit(async (data) => {
12770
+ const parsedData = parseValues(data);
12771
+ await mutateAsync(
12772
+ {
12773
+ metadata: parsedData
12774
+ },
12775
+ {
12776
+ onSuccess: () => {
12777
+ ui.toast.success("Metadata updated");
12778
+ handleSuccess();
12779
+ },
12780
+ onError: (error) => {
12781
+ ui.toast.error(error.message);
12782
+ }
12783
+ }
12784
+ );
12785
+ });
12786
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
12787
+ control: form.control,
12788
+ name: "metadata"
12789
+ });
12790
+ function deleteRow(index) {
12791
+ remove(index);
12792
+ if (fields.length === 1) {
12793
+ insert(0, {
12794
+ key: "",
12795
+ value: "",
12796
+ disabled: false
12797
+ });
12798
+ }
12799
+ }
12800
+ function insertRow(index, position) {
12801
+ insert(index + (position === "above" ? 0 : 1), {
12802
+ key: "",
12803
+ value: "",
12804
+ disabled: false
12805
+ });
12806
+ }
12807
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12808
+ KeyboundForm,
12809
+ {
12810
+ onSubmit: handleSubmit,
12811
+ className: "flex flex-1 flex-col overflow-hidden",
12812
+ children: [
12813
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
12814
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
12815
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
12816
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_KEY_LABEL_ID, children: "Key" }) }),
12817
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "txt-compact-small-plus text-ui-fg-subtle px-2 py-1.5", children: /* @__PURE__ */ jsxRuntime.jsx("label", { id: METADATA_VALUE_LABEL_ID, children: "Value" }) })
12818
+ ] }),
12819
+ fields.map((field, index) => {
12820
+ const isDisabled = field.disabled || false;
12821
+ let placeholder = "-";
12822
+ if (typeof field.value === "object") {
12823
+ placeholder = "{ ... }";
12824
+ }
12825
+ if (Array.isArray(field.value)) {
12826
+ placeholder = "[ ... ]";
12827
+ }
12828
+ return /* @__PURE__ */ jsxRuntime.jsx(
12829
+ ConditionalTooltip,
12830
+ {
12831
+ showTooltip: isDisabled,
12832
+ content: "This row is disabled because it contains non-primitive data.",
12833
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
12834
+ /* @__PURE__ */ jsxRuntime.jsxs(
12835
+ "div",
12836
+ {
12837
+ className: ui.clx("grid grid-cols-2 divide-x", {
12838
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
12839
+ }),
12840
+ children: [
12841
+ /* @__PURE__ */ jsxRuntime.jsx(
12842
+ Form$2.Field,
12843
+ {
12844
+ control: form.control,
12845
+ name: `metadata.${index}.key`,
12846
+ render: ({ field: field2 }) => {
12847
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12848
+ GridInput,
12849
+ {
12850
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
12851
+ ...field2,
12852
+ disabled: isDisabled,
12853
+ placeholder: "Key"
12854
+ }
12855
+ ) }) });
12856
+ }
12857
+ }
12858
+ ),
12859
+ /* @__PURE__ */ jsxRuntime.jsx(
12860
+ Form$2.Field,
12861
+ {
12862
+ control: form.control,
12863
+ name: `metadata.${index}.value`,
12864
+ render: ({ field: { value, ...field2 } }) => {
12865
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12866
+ GridInput,
12867
+ {
12868
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
12869
+ ...field2,
12870
+ value: isDisabled ? placeholder : value,
12871
+ disabled: isDisabled,
12872
+ placeholder: "Value"
12873
+ }
12874
+ ) }) });
12875
+ }
12876
+ }
12877
+ )
12878
+ ]
12879
+ }
12880
+ ),
12881
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
12882
+ /* @__PURE__ */ jsxRuntime.jsx(
12883
+ ui.DropdownMenu.Trigger,
12884
+ {
12885
+ className: ui.clx(
12886
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
12887
+ {
12888
+ hidden: isDisabled
12889
+ }
12890
+ ),
12891
+ disabled: isDisabled,
12892
+ asChild: true,
12893
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
12894
+ }
12895
+ ),
12896
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
12897
+ /* @__PURE__ */ jsxRuntime.jsxs(
12898
+ ui.DropdownMenu.Item,
12899
+ {
12900
+ className: "gap-x-2",
12901
+ onClick: () => insertRow(index, "above"),
12902
+ children: [
12903
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
12904
+ "Insert row above"
12905
+ ]
12906
+ }
12907
+ ),
12908
+ /* @__PURE__ */ jsxRuntime.jsxs(
12909
+ ui.DropdownMenu.Item,
12910
+ {
12911
+ className: "gap-x-2",
12912
+ onClick: () => insertRow(index, "below"),
12913
+ children: [
12914
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
12915
+ "Insert row below"
12916
+ ]
12917
+ }
12918
+ ),
12919
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
12920
+ /* @__PURE__ */ jsxRuntime.jsxs(
12921
+ ui.DropdownMenu.Item,
12922
+ {
12923
+ className: "gap-x-2",
12924
+ onClick: () => deleteRow(index),
12925
+ children: [
12926
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
12927
+ "Delete row"
12928
+ ]
12929
+ }
12930
+ )
12931
+ ] })
12932
+ ] })
12933
+ ] })
12934
+ },
12935
+ field.id
12936
+ );
12937
+ })
12938
+ ] }),
12939
+ hasUneditableRows && /* @__PURE__ */ jsxRuntime.jsx(InlineTip, { variant: "warning", label: "Some rows are disabled", children: "This object contains non-primitive metadata, such as arrays or objects, that can't be edited here. To edit the disabled rows, use the API directly." })
12940
+ ] }),
12941
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12942
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12943
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12944
+ ] }) })
12945
+ ]
12946
+ }
12947
+ ) });
12948
+ };
12949
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
12950
+ return /* @__PURE__ */ jsxRuntime.jsx(
12951
+ "input",
12952
+ {
12953
+ ref,
12954
+ ...props,
12955
+ autoComplete: "off",
12956
+ className: ui.clx(
12957
+ "txt-compact-small text-ui-fg-base placeholder:text-ui-fg-muted disabled:text-ui-fg-disabled disabled:bg-ui-bg-base bg-transparent px-2 py-1.5 outline-none",
12958
+ className
12959
+ )
12960
+ }
12961
+ );
12962
+ });
12963
+ GridInput.displayName = "MetadataForm.GridInput";
12964
+ const PlaceholderInner = () => {
12965
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
12966
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
12967
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12968
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
12969
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
12970
+ ] }) })
12971
+ ] });
12972
+ };
12973
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
12974
+ function getDefaultValues(metadata) {
12975
+ if (!metadata || !Object.keys(metadata).length) {
12976
+ return [
12977
+ {
12978
+ key: "",
12979
+ value: "",
12980
+ disabled: false
12981
+ }
12982
+ ];
12983
+ }
12984
+ return Object.entries(metadata).map(([key, value]) => {
12985
+ if (!EDITABLE_TYPES.includes(typeof value)) {
12986
+ return {
12987
+ key,
12988
+ value,
12989
+ disabled: true
12990
+ };
12991
+ }
12992
+ let stringValue = value;
12993
+ if (typeof value !== "string") {
12994
+ stringValue = JSON.stringify(value);
12995
+ }
12996
+ return {
12997
+ key,
12998
+ value: stringValue,
12999
+ original_key: key
13000
+ };
13001
+ });
13002
+ }
13003
+ function parseValues(values) {
13004
+ const metadata = values.metadata;
13005
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
13006
+ if (isEmpty) {
13007
+ return null;
13008
+ }
13009
+ const update = {};
13010
+ metadata.forEach((field) => {
13011
+ let key = field.key;
13012
+ let value = field.value;
13013
+ const disabled = field.disabled;
13014
+ if (!key || !value) {
13015
+ return;
13016
+ }
13017
+ if (disabled) {
13018
+ update[key] = value;
13019
+ return;
13020
+ }
13021
+ key = key.trim();
13022
+ value = value.trim();
13023
+ if (value === "true") {
13024
+ update[key] = true;
13025
+ } else if (value === "false") {
13026
+ update[key] = false;
13027
+ } else {
13028
+ const parsedNumber = parseFloat(value);
13029
+ if (!isNaN(parsedNumber)) {
13030
+ update[key] = parsedNumber;
13031
+ } else {
13032
+ update[key] = value;
13033
+ }
13034
+ }
13035
+ });
13036
+ return update;
13037
+ }
13038
+ function getHasUneditableRows(metadata) {
13039
+ if (!metadata) {
13040
+ return false;
13041
+ }
13042
+ return Object.values(metadata).some(
13043
+ (value) => !EDITABLE_TYPES.includes(typeof value)
13044
+ );
13045
+ }
13048
13046
  const widgetModule = { widgets: [] };
13049
13047
  const routeModule = {
13050
13048
  routes: [
@@ -13073,26 +13071,22 @@ const routeModule = {
13073
13071
  Component: BillingAddress,
13074
13072
  path: "/draft-orders/:id/billing-address"
13075
13073
  },
13076
- {
13077
- Component: Email,
13078
- path: "/draft-orders/:id/email"
13079
- },
13080
13074
  {
13081
13075
  Component: Items,
13082
13076
  path: "/draft-orders/:id/items"
13083
13077
  },
13084
13078
  {
13085
- Component: Metadata,
13086
- path: "/draft-orders/:id/metadata"
13087
- },
13088
- {
13089
- Component: Promotions,
13090
- path: "/draft-orders/:id/promotions"
13079
+ Component: Email,
13080
+ path: "/draft-orders/:id/email"
13091
13081
  },
13092
13082
  {
13093
13083
  Component: SalesChannel,
13094
13084
  path: "/draft-orders/:id/sales-channel"
13095
13085
  },
13086
+ {
13087
+ Component: Promotions,
13088
+ path: "/draft-orders/:id/promotions"
13089
+ },
13096
13090
  {
13097
13091
  Component: Shipping,
13098
13092
  path: "/draft-orders/:id/shipping"
@@ -13104,6 +13098,10 @@ const routeModule = {
13104
13098
  {
13105
13099
  Component: TransferOwnership,
13106
13100
  path: "/draft-orders/:id/transfer-ownership"
13101
+ },
13102
+ {
13103
+ Component: Metadata,
13104
+ path: "/draft-orders/:id/metadata"
13107
13105
  }
13108
13106
  ]
13109
13107
  }