@medusajs/draft-order 2.11.4-preview-20251117060140 → 2.11.4-preview-20251117090222

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 +420 -420
  2. package/.medusa/server/src/admin/index.mjs +420 -420
  3. package/package.json +16 -16
package/.medusa/server/src/admin/index.js CHANGED
@@ -10825,356 +10825,6 @@ const customItemSchema = objectType({
10825
10825
  quantity: numberType(),
10826
10826
  unit_price: unionType([numberType(), stringType()])
10827
10827
  });
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 = () => {
10873
- const { id } = reactRouterDom.useParams();
10874
- const { order, isPending, isError, error } = useOrder(id, {
10875
- fields: "metadata"
10876
- });
10877
- if (isError) {
10878
- throw error;
10879
- }
10880
- const isReady = !isPending && !!order;
10881
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10882
- /* @__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." }) })
10885
- ] }),
10886
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10887
- ] });
10888
- };
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);
10895
- const form = reactHookForm.useForm({
10896
- defaultValues: {
10897
- metadata: getDefaultValues(metadata)
10898
- },
10899
- resolver: zod.zodResolver(MetadataSchema)
10900
- });
10901
- const handleSubmit = form.handleSubmit(async (data) => {
10902
- const parsedData = parseValues(data);
10903
- await mutateAsync(
10904
- {
10905
- metadata: parsedData
10906
- },
10907
- {
10908
- onSuccess: () => {
10909
- ui.toast.success("Metadata updated");
10910
- handleSuccess();
10911
- },
10912
- onError: (error) => {
10913
- ui.toast.error(error.message);
10914
- }
10915
- }
10916
- );
10917
- });
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
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10940
- KeyboundForm,
10941
- {
10942
- onSubmit: handleSubmit,
10943
- className: "flex flex-1 flex-col overflow-hidden",
10944
- 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" }) }),
11075
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11076
- ] }) })
11077
- ]
11078
- }
11079
- ) });
11080
- };
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
- );
11094
- });
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) => [
@@ -11452,46 +11102,88 @@ function getPromotionIds(items, shippingMethods) {
11452
11102
  }
11453
11103
  return Array.from(promotionIds);
11454
11104
  }
11455
- const SalesChannel = () => {
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 = () => {
11456
11150
  const { id } = reactRouterDom.useParams();
11457
- const { draft_order, isPending, isError, error } = useDraftOrder(
11458
- id,
11459
- {
11460
- fields: "+sales_channel_id"
11461
- },
11462
- {
11463
- enabled: !!id
11464
- }
11465
- );
11151
+ const { order, isPending, isError, error } = useOrder(id, {
11152
+ fields: "metadata"
11153
+ });
11466
11154
  if (isError) {
11467
11155
  throw error;
11468
11156
  }
11469
- const ISrEADY = !!draft_order && !isPending;
11157
+ const isReady = !isPending && !!order;
11470
11158
  return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
11471
11159
  /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
11472
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
11473
- /* @__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" }) })
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." }) })
11474
11162
  ] }),
11475
- ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
11163
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
11476
11164
  ] });
11477
11165
  };
11478
- const SalesChannelForm = ({ order }) => {
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);
11479
11172
  const form = reactHookForm.useForm({
11480
11173
  defaultValues: {
11481
- sales_channel_id: order.sales_channel_id || ""
11174
+ metadata: getDefaultValues(metadata)
11482
11175
  },
11483
- resolver: zod.zodResolver(schema$2)
11176
+ resolver: zod.zodResolver(MetadataSchema)
11484
11177
  });
11485
- const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
11486
- const { handleSuccess } = useRouteModal();
11487
- const onSubmit = form.handleSubmit(async (data) => {
11178
+ const handleSubmit = form.handleSubmit(async (data) => {
11179
+ const parsedData = parseValues(data);
11488
11180
  await mutateAsync(
11489
11181
  {
11490
- sales_channel_id: data.sales_channel_id
11182
+ metadata: parsedData
11491
11183
  },
11492
11184
  {
11493
11185
  onSuccess: () => {
11494
- ui.toast.success("Sales channel updated");
11186
+ ui.toast.success("Metadata updated");
11495
11187
  handleSuccess();
11496
11188
  },
11497
11189
  onError: (error) => {
@@ -11500,64 +11192,266 @@ const SalesChannelForm = ({ order }) => {
11500
11192
  }
11501
11193
  );
11502
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
+ }
11503
11216
  return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
11504
11217
  KeyboundForm,
11505
11218
  {
11219
+ onSubmit: handleSubmit,
11506
11220
  className: "flex flex-1 flex-col overflow-hidden",
11507
- onSubmit,
11508
11221
  children: [
11509
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
11510
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
11511
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
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" }) }),
11512
11352
  /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11513
11353
  ] }) })
11514
11354
  ]
11515
11355
  }
11516
11356
  ) });
11517
11357
  };
11518
- const SalesChannelField = ({ control, order }) => {
11519
- const salesChannels = useComboboxData({
11520
- queryFn: async (params) => {
11521
- return await sdk.admin.salesChannel.list(params);
11522
- },
11523
- queryKey: ["sales-channels"],
11524
- getOptions: (data) => {
11525
- return data.sales_channels.map((salesChannel) => ({
11526
- label: salesChannel.name,
11527
- value: salesChannel.id
11528
- }));
11529
- },
11530
- defaultValue: order.sales_channel_id || void 0
11531
- });
11358
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11532
11359
  return /* @__PURE__ */ jsxRuntime.jsx(
11533
- Form$2.Field,
11360
+ "input",
11534
11361
  {
11535
- control,
11536
- name: "sales_channel_id",
11537
- render: ({ field }) => {
11538
- return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
11539
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
11540
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
11541
- Combobox,
11542
- {
11543
- options: salesChannels.options,
11544
- fetchNextPage: salesChannels.fetchNextPage,
11545
- isFetchingNextPage: salesChannels.isFetchingNextPage,
11546
- searchValue: salesChannels.searchValue,
11547
- onSearchValueChange: salesChannels.onSearchValueChange,
11548
- placeholder: "Select sales channel",
11549
- ...field
11550
- }
11551
- ) }),
11552
- /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
11553
- ] });
11554
- }
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
+ )
11555
11369
  }
11556
11370
  );
11557
- };
11558
- const schema$2 = objectType({
11559
- sales_channel_id: stringType().min(1)
11560
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;
11442
+ }
11443
+ }
11444
+ });
11445
+ return update;
11446
+ }
11447
+ function getHasUneditableRows(metadata) {
11448
+ if (!metadata) {
11449
+ return false;
11450
+ }
11451
+ return Object.values(metadata).some(
11452
+ (value) => !EDITABLE_TYPES.includes(typeof value)
11453
+ );
11454
+ }
11561
11455
  const STACKED_FOCUS_MODAL_ID = "shipping-form";
11562
11456
  const Shipping = () => {
11563
11457
  var _a;
@@ -12365,6 +12259,112 @@ const CustomAmountField = ({
12365
12259
  }
12366
12260
  );
12367
12261
  };
12262
+ const SalesChannel = () => {
12263
+ const { id } = reactRouterDom.useParams();
12264
+ const { draft_order, isPending, isError, error } = useDraftOrder(
12265
+ id,
12266
+ {
12267
+ fields: "+sales_channel_id"
12268
+ },
12269
+ {
12270
+ enabled: !!id
12271
+ }
12272
+ );
12273
+ if (isError) {
12274
+ throw error;
12275
+ }
12276
+ const ISrEADY = !!draft_order && !isPending;
12277
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12278
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12279
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Edit Sales Channel" }) }),
12280
+ /* @__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" }) })
12281
+ ] }),
12282
+ ISrEADY && /* @__PURE__ */ jsxRuntime.jsx(SalesChannelForm, { order: draft_order })
12283
+ ] });
12284
+ };
12285
+ const SalesChannelForm = ({ order }) => {
12286
+ const form = reactHookForm.useForm({
12287
+ defaultValues: {
12288
+ sales_channel_id: order.sales_channel_id || ""
12289
+ },
12290
+ resolver: zod.zodResolver(schema$2)
12291
+ });
12292
+ const { mutateAsync, isPending } = useUpdateDraftOrder(order.id);
12293
+ const { handleSuccess } = useRouteModal();
12294
+ const onSubmit = form.handleSubmit(async (data) => {
12295
+ await mutateAsync(
12296
+ {
12297
+ sales_channel_id: data.sales_channel_id
12298
+ },
12299
+ {
12300
+ onSuccess: () => {
12301
+ ui.toast.success("Sales channel updated");
12302
+ handleSuccess();
12303
+ },
12304
+ onError: (error) => {
12305
+ ui.toast.error(error.message);
12306
+ }
12307
+ }
12308
+ );
12309
+ });
12310
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12311
+ KeyboundForm,
12312
+ {
12313
+ className: "flex flex-1 flex-col overflow-hidden",
12314
+ onSubmit,
12315
+ children: [
12316
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { className: "flex flex-col gap-y-6 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(SalesChannelField, { control: form.control, order }) }),
12317
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-end gap-2", children: [
12318
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", children: "Cancel" }) }),
12319
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12320
+ ] }) })
12321
+ ]
12322
+ }
12323
+ ) });
12324
+ };
12325
+ const SalesChannelField = ({ control, order }) => {
12326
+ const salesChannels = useComboboxData({
12327
+ queryFn: async (params) => {
12328
+ return await sdk.admin.salesChannel.list(params);
12329
+ },
12330
+ queryKey: ["sales-channels"],
12331
+ getOptions: (data) => {
12332
+ return data.sales_channels.map((salesChannel) => ({
12333
+ label: salesChannel.name,
12334
+ value: salesChannel.id
12335
+ }));
12336
+ },
12337
+ defaultValue: order.sales_channel_id || void 0
12338
+ });
12339
+ return /* @__PURE__ */ jsxRuntime.jsx(
12340
+ Form$2.Field,
12341
+ {
12342
+ control,
12343
+ name: "sales_channel_id",
12344
+ render: ({ field }) => {
12345
+ return /* @__PURE__ */ jsxRuntime.jsxs(Form$2.Item, { children: [
12346
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Label, { children: "Sales Channel" }),
12347
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12348
+ Combobox,
12349
+ {
12350
+ options: salesChannels.options,
12351
+ fetchNextPage: salesChannels.fetchNextPage,
12352
+ isFetchingNextPage: salesChannels.isFetchingNextPage,
12353
+ searchValue: salesChannels.searchValue,
12354
+ onSearchValueChange: salesChannels.onSearchValueChange,
12355
+ placeholder: "Select sales channel",
12356
+ ...field
12357
+ }
12358
+ ) }),
12359
+ /* @__PURE__ */ jsxRuntime.jsx(Form$2.ErrorMessage, {})
12360
+ ] });
12361
+ }
12362
+ }
12363
+ );
12364
+ };
12365
+ const schema$2 = objectType({
12366
+ sales_channel_id: stringType().min(1)
12367
+ });
12368
12368
  const ShippingAddress = () => {
12369
12369
  const { id } = reactRouterDom.useParams();
12370
12370
  const { order, isPending, isError, error } = useOrder(id, {
@@ -13080,22 +13080,22 @@ const routeModule = {
13080
13080
  Component: Items,
13081
13081
  path: "/draft-orders/:id/items"
13082
13082
  },
13083
- {
13084
- Component: Metadata,
13085
- path: "/draft-orders/:id/metadata"
13086
- },
13087
13083
  {
13088
13084
  Component: Promotions,
13089
13085
  path: "/draft-orders/:id/promotions"
13090
13086
  },
13091
13087
  {
13092
- Component: SalesChannel,
13093
- path: "/draft-orders/:id/sales-channel"
13088
+ Component: Metadata,
13089
+ path: "/draft-orders/:id/metadata"
13094
13090
  },
13095
13091
  {
13096
13092
  Component: Shipping,
13097
13093
  path: "/draft-orders/:id/shipping"
13098
13094
  },
13095
+ {
13096
+ Component: SalesChannel,
13097
+ path: "/draft-orders/:id/sales-channel"
13098
+ },
13099
13099
  {
13100
13100
  Component: ShippingAddress,
13101
13101
  path: "/draft-orders/:id/shipping-address"