@medusajs/draft-order 2.20.0 → 2.20.2-preview-20260904091918

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/.medusa/server/src/admin/index.js +357 -357
  2. package/.medusa/server/src/admin/index.mjs +357 -357
  3. package/package.json +18 -18
package/.medusa/server/src/admin/index.js CHANGED
@@ -7657,356 +7657,6 @@ const SalesChannelField = ({ control, order }) => {
7657
7657
  const schema$2 = zod.z.object({
7658
7658
  sales_channel_id: zod.z.string().min(1)
7659
7659
  });
7660
- const InlineTip = React.forwardRef(
7661
- ({ variant = "tip", label, className, children, ...props }, ref) => {
7662
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
7663
- return /* @__PURE__ */ jsxRuntime.jsxs(
7664
- "div",
7665
- {
7666
- ref,
7667
- className: ui.clx(
7668
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
7669
- className
7670
- ),
7671
- ...props,
7672
- children: [
7673
- /* @__PURE__ */ jsxRuntime.jsx(
7674
- "div",
7675
- {
7676
- role: "presentation",
7677
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
7678
- "bg-ui-tag-orange-icon": variant === "warning"
7679
- })
7680
- }
7681
- ),
7682
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
7683
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
7684
- labelValue,
7685
- ":"
7686
- ] }),
7687
- " ",
7688
- children
7689
- ] })
7690
- ]
7691
- }
7692
- );
7693
- }
7694
- );
7695
- InlineTip.displayName = "InlineTip";
7696
- const MetadataFieldSchema = zod.z.object({
7697
- key: zod.z.string(),
7698
- disabled: zod.z.boolean().optional(),
7699
- value: zod.z.any()
7700
- });
7701
- const MetadataSchema = zod.z.object({
7702
- metadata: zod.z.array(MetadataFieldSchema)
7703
- });
7704
- const Metadata = () => {
7705
- const { id } = reactRouterDom.useParams();
7706
- const { order, isPending, isError, error } = useOrder(id, {
7707
- fields: "metadata"
7708
- });
7709
- if (isError) {
7710
- throw error;
7711
- }
7712
- const isReady = !isPending && !!order;
7713
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
7714
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
7715
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
7716
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
7717
- ] }),
7718
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order?.metadata })
7719
- ] });
7720
- };
7721
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
7722
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
7723
- const MetadataForm = ({ orderId, metadata }) => {
7724
- const { handleSuccess } = useRouteModal();
7725
- const hasUneditableRows = getHasUneditableRows(metadata);
7726
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
7727
- const form = reactHookForm.useForm({
7728
- defaultValues: {
7729
- metadata: getDefaultValues(metadata)
7730
- },
7731
- resolver: zod$1.zodResolver(MetadataSchema)
7732
- });
7733
- const handleSubmit = form.handleSubmit(async (data) => {
7734
- const parsedData = parseValues(data);
7735
- await mutateAsync(
7736
- {
7737
- metadata: parsedData
7738
- },
7739
- {
7740
- onSuccess: () => {
7741
- ui.toast.success("Metadata updated");
7742
- handleSuccess();
7743
- },
7744
- onError: (error) => {
7745
- ui.toast.error(error.message);
7746
- }
7747
- }
7748
- );
7749
- });
7750
- const { fields, insert, remove } = reactHookForm.useFieldArray({
7751
- control: form.control,
7752
- name: "metadata"
7753
- });
7754
- function deleteRow(index) {
7755
- remove(index);
7756
- if (fields.length === 1) {
7757
- insert(0, {
7758
- key: "",
7759
- value: "",
7760
- disabled: false
7761
- });
7762
- }
7763
- }
7764
- function insertRow(index, position) {
7765
- insert(index + (position === "above" ? 0 : 1), {
7766
- key: "",
7767
- value: "",
7768
- disabled: false
7769
- });
7770
- }
7771
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
7772
- KeyboundForm,
7773
- {
7774
- onSubmit: handleSubmit,
7775
- className: "flex flex-1 flex-col overflow-hidden",
7776
- children: [
7777
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
7778
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
7779
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
7780
- /* @__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" }) }),
7781
- /* @__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" }) })
7782
- ] }),
7783
- fields.map((field, index) => {
7784
- const isDisabled = field.disabled || false;
7785
- let placeholder = "-";
7786
- if (typeof field.value === "object") {
7787
- placeholder = "{ ... }";
7788
- }
7789
- if (Array.isArray(field.value)) {
7790
- placeholder = "[ ... ]";
7791
- }
7792
- return /* @__PURE__ */ jsxRuntime.jsx(
7793
- ConditionalTooltip,
7794
- {
7795
- showTooltip: isDisabled,
7796
- content: "This row is disabled because it contains non-primitive data.",
7797
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
7798
- /* @__PURE__ */ jsxRuntime.jsxs(
7799
- "div",
7800
- {
7801
- className: ui.clx("grid grid-cols-2 divide-x", {
7802
- "overflow-hidden rounded-b-lg": index === fields.length - 1
7803
- }),
7804
- children: [
7805
- /* @__PURE__ */ jsxRuntime.jsx(
7806
- Form$2.Field,
7807
- {
7808
- control: form.control,
7809
- name: `metadata.${index}.key`,
7810
- render: ({ field: field2 }) => {
7811
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
7812
- GridInput,
7813
- {
7814
- "aria-labelledby": METADATA_KEY_LABEL_ID,
7815
- ...field2,
7816
- disabled: isDisabled,
7817
- placeholder: "Key"
7818
- }
7819
- ) }) });
7820
- }
7821
- }
7822
- ),
7823
- /* @__PURE__ */ jsxRuntime.jsx(
7824
- Form$2.Field,
7825
- {
7826
- control: form.control,
7827
- name: `metadata.${index}.value`,
7828
- render: ({ field: { value, ...field2 } }) => {
7829
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
7830
- GridInput,
7831
- {
7832
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
7833
- ...field2,
7834
- value: isDisabled ? placeholder : value,
7835
- disabled: isDisabled,
7836
- placeholder: "Value"
7837
- }
7838
- ) }) });
7839
- }
7840
- }
7841
- )
7842
- ]
7843
- }
7844
- ),
7845
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
7846
- /* @__PURE__ */ jsxRuntime.jsx(
7847
- ui.DropdownMenu.Trigger,
7848
- {
7849
- className: ui.clx(
7850
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
7851
- {
7852
- hidden: isDisabled
7853
- }
7854
- ),
7855
- disabled: isDisabled,
7856
- asChild: true,
7857
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
7858
- }
7859
- ),
7860
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
7861
- /* @__PURE__ */ jsxRuntime.jsxs(
7862
- ui.DropdownMenu.Item,
7863
- {
7864
- className: "gap-x-2",
7865
- onClick: () => insertRow(index, "above"),
7866
- children: [
7867
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
7868
- "Insert row above"
7869
- ]
7870
- }
7871
- ),
7872
- /* @__PURE__ */ jsxRuntime.jsxs(
7873
- ui.DropdownMenu.Item,
7874
- {
7875
- className: "gap-x-2",
7876
- onClick: () => insertRow(index, "below"),
7877
- children: [
7878
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
7879
- "Insert row below"
7880
- ]
7881
- }
7882
- ),
7883
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
7884
- /* @__PURE__ */ jsxRuntime.jsxs(
7885
- ui.DropdownMenu.Item,
7886
- {
7887
- className: "gap-x-2",
7888
- onClick: () => deleteRow(index),
7889
- children: [
7890
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
7891
- "Delete row"
7892
- ]
7893
- }
7894
- )
7895
- ] })
7896
- ] })
7897
- ] })
7898
- },
7899
- field.id
7900
- );
7901
- })
7902
- ] }),
7903
- 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." })
7904
- ] }),
7905
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
7906
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
7907
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
7908
- ] }) })
7909
- ]
7910
- }
7911
- ) });
7912
- };
7913
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
7914
- return /* @__PURE__ */ jsxRuntime.jsx(
7915
- "input",
7916
- {
7917
- ref,
7918
- ...props,
7919
- autoComplete: "off",
7920
- className: ui.clx(
7921
- "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",
7922
- className
7923
- )
7924
- }
7925
- );
7926
- });
7927
- GridInput.displayName = "MetadataForm.GridInput";
7928
- const PlaceholderInner = () => {
7929
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
7930
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
7931
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
7932
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
7933
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
7934
- ] }) })
7935
- ] });
7936
- };
7937
- const EDITABLE_TYPES = ["string", "number", "boolean"];
7938
- function getDefaultValues(metadata) {
7939
- if (!metadata || !Object.keys(metadata).length) {
7940
- return [
7941
- {
7942
- key: "",
7943
- value: "",
7944
- disabled: false
7945
- }
7946
- ];
7947
- }
7948
- return Object.entries(metadata).map(([key, value]) => {
7949
- if (!EDITABLE_TYPES.includes(typeof value)) {
7950
- return {
7951
- key,
7952
- value,
7953
- disabled: true
7954
- };
7955
- }
7956
- let stringValue = value;
7957
- if (typeof value !== "string") {
7958
- stringValue = JSON.stringify(value);
7959
- }
7960
- return {
7961
- key,
7962
- value: stringValue,
7963
- original_key: key
7964
- };
7965
- });
7966
- }
7967
- function parseValues(values) {
7968
- const metadata = values.metadata;
7969
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
7970
- if (isEmpty) {
7971
- return null;
7972
- }
7973
- const update = {};
7974
- metadata.forEach((field) => {
7975
- let key = field.key;
7976
- let value = field.value;
7977
- const disabled = field.disabled;
7978
- if (!key || !value) {
7979
- return;
7980
- }
7981
- if (disabled) {
7982
- update[key] = value;
7983
- return;
7984
- }
7985
- key = key.trim();
7986
- value = value.trim();
7987
- if (value === "true") {
7988
- update[key] = true;
7989
- } else if (value === "false") {
7990
- update[key] = false;
7991
- } else {
7992
- const parsedNumber = parseFloat(value);
7993
- if (!isNaN(parsedNumber)) {
7994
- update[key] = parsedNumber;
7995
- } else {
7996
- update[key] = value;
7997
- }
7998
- }
7999
- });
8000
- return update;
8001
- }
8002
- function getHasUneditableRows(metadata) {
8003
- if (!metadata) {
8004
- return false;
8005
- }
8006
- return Object.values(metadata).some(
8007
- (value) => !EDITABLE_TYPES.includes(typeof value)
8008
- );
8009
- }
8010
7660
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
8011
7661
  const Shipping = () => {
8012
7662
  const { id } = reactRouterDom.useParams();
@@ -9473,11 +9123,361 @@ const Illustration = () => {
9473
9123
  ] })
9474
9124
  ]
9475
9125
  }
9476
- );
9126
+ );
9127
+ };
9128
+ const schema = zod.z.object({
9129
+ customer_id: zod.z.string().min(1)
9130
+ });
9131
+ const InlineTip = React.forwardRef(
9132
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
9133
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
9134
+ return /* @__PURE__ */ jsxRuntime.jsxs(
9135
+ "div",
9136
+ {
9137
+ ref,
9138
+ className: ui.clx(
9139
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
9140
+ className
9141
+ ),
9142
+ ...props,
9143
+ children: [
9144
+ /* @__PURE__ */ jsxRuntime.jsx(
9145
+ "div",
9146
+ {
9147
+ role: "presentation",
9148
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
9149
+ "bg-ui-tag-orange-icon": variant === "warning"
9150
+ })
9151
+ }
9152
+ ),
9153
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
9154
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
9155
+ labelValue,
9156
+ ":"
9157
+ ] }),
9158
+ " ",
9159
+ children
9160
+ ] })
9161
+ ]
9162
+ }
9163
+ );
9164
+ }
9165
+ );
9166
+ InlineTip.displayName = "InlineTip";
9167
+ const MetadataFieldSchema = zod.z.object({
9168
+ key: zod.z.string(),
9169
+ disabled: zod.z.boolean().optional(),
9170
+ value: zod.z.any()
9171
+ });
9172
+ const MetadataSchema = zod.z.object({
9173
+ metadata: zod.z.array(MetadataFieldSchema)
9174
+ });
9175
+ const Metadata = () => {
9176
+ const { id } = reactRouterDom.useParams();
9177
+ const { order, isPending, isError, error } = useOrder(id, {
9178
+ fields: "metadata"
9179
+ });
9180
+ if (isError) {
9181
+ throw error;
9182
+ }
9183
+ const isReady = !isPending && !!order;
9184
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
9185
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
9186
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
9187
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
9188
+ ] }),
9189
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order?.metadata })
9190
+ ] });
9191
+ };
9192
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
9193
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
9194
+ const MetadataForm = ({ orderId, metadata }) => {
9195
+ const { handleSuccess } = useRouteModal();
9196
+ const hasUneditableRows = getHasUneditableRows(metadata);
9197
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
9198
+ const form = reactHookForm.useForm({
9199
+ defaultValues: {
9200
+ metadata: getDefaultValues(metadata)
9201
+ },
9202
+ resolver: zod$1.zodResolver(MetadataSchema)
9203
+ });
9204
+ const handleSubmit = form.handleSubmit(async (data) => {
9205
+ const parsedData = parseValues(data);
9206
+ await mutateAsync(
9207
+ {
9208
+ metadata: parsedData
9209
+ },
9210
+ {
9211
+ onSuccess: () => {
9212
+ ui.toast.success("Metadata updated");
9213
+ handleSuccess();
9214
+ },
9215
+ onError: (error) => {
9216
+ ui.toast.error(error.message);
9217
+ }
9218
+ }
9219
+ );
9220
+ });
9221
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
9222
+ control: form.control,
9223
+ name: "metadata"
9224
+ });
9225
+ function deleteRow(index) {
9226
+ remove(index);
9227
+ if (fields.length === 1) {
9228
+ insert(0, {
9229
+ key: "",
9230
+ value: "",
9231
+ disabled: false
9232
+ });
9233
+ }
9234
+ }
9235
+ function insertRow(index, position) {
9236
+ insert(index + (position === "above" ? 0 : 1), {
9237
+ key: "",
9238
+ value: "",
9239
+ disabled: false
9240
+ });
9241
+ }
9242
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
9243
+ KeyboundForm,
9244
+ {
9245
+ onSubmit: handleSubmit,
9246
+ className: "flex flex-1 flex-col overflow-hidden",
9247
+ children: [
9248
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
9249
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
9250
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
9251
+ /* @__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" }) }),
9252
+ /* @__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" }) })
9253
+ ] }),
9254
+ fields.map((field, index) => {
9255
+ const isDisabled = field.disabled || false;
9256
+ let placeholder = "-";
9257
+ if (typeof field.value === "object") {
9258
+ placeholder = "{ ... }";
9259
+ }
9260
+ if (Array.isArray(field.value)) {
9261
+ placeholder = "[ ... ]";
9262
+ }
9263
+ return /* @__PURE__ */ jsxRuntime.jsx(
9264
+ ConditionalTooltip,
9265
+ {
9266
+ showTooltip: isDisabled,
9267
+ content: "This row is disabled because it contains non-primitive data.",
9268
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
9269
+ /* @__PURE__ */ jsxRuntime.jsxs(
9270
+ "div",
9271
+ {
9272
+ className: ui.clx("grid grid-cols-2 divide-x", {
9273
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
9274
+ }),
9275
+ children: [
9276
+ /* @__PURE__ */ jsxRuntime.jsx(
9277
+ Form$2.Field,
9278
+ {
9279
+ control: form.control,
9280
+ name: `metadata.${index}.key`,
9281
+ render: ({ field: field2 }) => {
9282
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
9283
+ GridInput,
9284
+ {
9285
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
9286
+ ...field2,
9287
+ disabled: isDisabled,
9288
+ placeholder: "Key"
9289
+ }
9290
+ ) }) });
9291
+ }
9292
+ }
9293
+ ),
9294
+ /* @__PURE__ */ jsxRuntime.jsx(
9295
+ Form$2.Field,
9296
+ {
9297
+ control: form.control,
9298
+ name: `metadata.${index}.value`,
9299
+ render: ({ field: { value, ...field2 } }) => {
9300
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
9301
+ GridInput,
9302
+ {
9303
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
9304
+ ...field2,
9305
+ value: isDisabled ? placeholder : value,
9306
+ disabled: isDisabled,
9307
+ placeholder: "Value"
9308
+ }
9309
+ ) }) });
9310
+ }
9311
+ }
9312
+ )
9313
+ ]
9314
+ }
9315
+ ),
9316
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
9317
+ /* @__PURE__ */ jsxRuntime.jsx(
9318
+ ui.DropdownMenu.Trigger,
9319
+ {
9320
+ className: ui.clx(
9321
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
9322
+ {
9323
+ hidden: isDisabled
9324
+ }
9325
+ ),
9326
+ disabled: isDisabled,
9327
+ asChild: true,
9328
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
9329
+ }
9330
+ ),
9331
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
9332
+ /* @__PURE__ */ jsxRuntime.jsxs(
9333
+ ui.DropdownMenu.Item,
9334
+ {
9335
+ className: "gap-x-2",
9336
+ onClick: () => insertRow(index, "above"),
9337
+ children: [
9338
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
9339
+ "Insert row above"
9340
+ ]
9341
+ }
9342
+ ),
9343
+ /* @__PURE__ */ jsxRuntime.jsxs(
9344
+ ui.DropdownMenu.Item,
9345
+ {
9346
+ className: "gap-x-2",
9347
+ onClick: () => insertRow(index, "below"),
9348
+ children: [
9349
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
9350
+ "Insert row below"
9351
+ ]
9352
+ }
9353
+ ),
9354
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
9355
+ /* @__PURE__ */ jsxRuntime.jsxs(
9356
+ ui.DropdownMenu.Item,
9357
+ {
9358
+ className: "gap-x-2",
9359
+ onClick: () => deleteRow(index),
9360
+ children: [
9361
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
9362
+ "Delete row"
9363
+ ]
9364
+ }
9365
+ )
9366
+ ] })
9367
+ ] })
9368
+ ] })
9369
+ },
9370
+ field.id
9371
+ );
9372
+ })
9373
+ ] }),
9374
+ 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." })
9375
+ ] }),
9376
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
9377
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
9378
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
9379
+ ] }) })
9380
+ ]
9381
+ }
9382
+ ) });
9477
9383
  };
9478
- const schema = zod.z.object({
9479
- customer_id: zod.z.string().min(1)
9384
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
9385
+ return /* @__PURE__ */ jsxRuntime.jsx(
9386
+ "input",
9387
+ {
9388
+ ref,
9389
+ ...props,
9390
+ autoComplete: "off",
9391
+ className: ui.clx(
9392
+ "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",
9393
+ className
9394
+ )
9395
+ }
9396
+ );
9480
9397
  });
9398
+ GridInput.displayName = "MetadataForm.GridInput";
9399
+ const PlaceholderInner = () => {
9400
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
9401
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
9402
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
9403
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
9404
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
9405
+ ] }) })
9406
+ ] });
9407
+ };
9408
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
9409
+ function getDefaultValues(metadata) {
9410
+ if (!metadata || !Object.keys(metadata).length) {
9411
+ return [
9412
+ {
9413
+ key: "",
9414
+ value: "",
9415
+ disabled: false
9416
+ }
9417
+ ];
9418
+ }
9419
+ return Object.entries(metadata).map(([key, value]) => {
9420
+ if (!EDITABLE_TYPES.includes(typeof value)) {
9421
+ return {
9422
+ key,
9423
+ value,
9424
+ disabled: true
9425
+ };
9426
+ }
9427
+ let stringValue = value;
9428
+ if (typeof value !== "string") {
9429
+ stringValue = JSON.stringify(value);
9430
+ }
9431
+ return {
9432
+ key,
9433
+ value: stringValue,
9434
+ original_key: key
9435
+ };
9436
+ });
9437
+ }
9438
+ function parseValues(values) {
9439
+ const metadata = values.metadata;
9440
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
9441
+ if (isEmpty) {
9442
+ return null;
9443
+ }
9444
+ const update = {};
9445
+ metadata.forEach((field) => {
9446
+ let key = field.key;
9447
+ let value = field.value;
9448
+ const disabled = field.disabled;
9449
+ if (!key || !value) {
9450
+ return;
9451
+ }
9452
+ if (disabled) {
9453
+ update[key] = value;
9454
+ return;
9455
+ }
9456
+ key = key.trim();
9457
+ value = value.trim();
9458
+ if (value === "true") {
9459
+ update[key] = true;
9460
+ } else if (value === "false") {
9461
+ update[key] = false;
9462
+ } else {
9463
+ const parsedNumber = parseFloat(value);
9464
+ if (!isNaN(parsedNumber)) {
9465
+ update[key] = parsedNumber;
9466
+ } else {
9467
+ update[key] = value;
9468
+ }
9469
+ }
9470
+ });
9471
+ return update;
9472
+ }
9473
+ function getHasUneditableRows(metadata) {
9474
+ if (!metadata) {
9475
+ return false;
9476
+ }
9477
+ return Object.values(metadata).some(
9478
+ (value) => !EDITABLE_TYPES.includes(typeof value)
9479
+ );
9480
+ }
9481
9481
  const widgetModule = { widgets: [] };
9482
9482
  const routeModule = {
9483
9483
  routes: [
@@ -9522,10 +9522,6 @@ const routeModule = {
9522
9522
  Component: SalesChannel,
9523
9523
  path: "/draft-orders/:id/sales-channel"
9524
9524
  },
9525
- {
9526
- Component: Metadata,
9527
- path: "/draft-orders/:id/metadata"
9528
- },
9529
9525
  {
9530
9526
  Component: Shipping,
9531
9527
  path: "/draft-orders/:id/shipping"
@@ -9537,6 +9533,10 @@ const routeModule = {
9537
9533
  {
9538
9534
  Component: TransferOwnership,
9539
9535
  path: "/draft-orders/:id/transfer-ownership"
9536
+ },
9537
+ {
9538
+ Component: Metadata,
9539
+ path: "/draft-orders/:id/metadata"
9540
9540
  }
9541
9541
  ]
9542
9542
  }