@medusajs/draft-order 2.10.0-snapshot-20250828141006 → 2.10.0-snapshot-20250828141936

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.
@@ -10813,356 +10813,6 @@ const customItemSchema = objectType({
10813
10813
  quantity: numberType(),
10814
10814
  unit_price: unionType([numberType(), stringType()])
10815
10815
  });
10816
- const InlineTip = React.forwardRef(
10817
- ({ variant = "tip", label, className, children, ...props }, ref) => {
10818
- const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
10819
- return /* @__PURE__ */ jsxRuntime.jsxs(
10820
- "div",
10821
- {
10822
- ref,
10823
- className: ui.clx(
10824
- "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
10825
- className
10826
- ),
10827
- ...props,
10828
- children: [
10829
- /* @__PURE__ */ jsxRuntime.jsx(
10830
- "div",
10831
- {
10832
- role: "presentation",
10833
- className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
10834
- "bg-ui-tag-orange-icon": variant === "warning"
10835
- })
10836
- }
10837
- ),
10838
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
10839
- /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
10840
- labelValue,
10841
- ":"
10842
- ] }),
10843
- " ",
10844
- children
10845
- ] })
10846
- ]
10847
- }
10848
- );
10849
- }
10850
- );
10851
- InlineTip.displayName = "InlineTip";
10852
- const MetadataFieldSchema = objectType({
10853
- key: stringType(),
10854
- disabled: booleanType().optional(),
10855
- value: anyType()
10856
- });
10857
- const MetadataSchema = objectType({
10858
- metadata: arrayType(MetadataFieldSchema)
10859
- });
10860
- const Metadata = () => {
10861
- const { id } = reactRouterDom.useParams();
10862
- const { order, isPending, isError, error } = useOrder(id, {
10863
- fields: "metadata"
10864
- });
10865
- if (isError) {
10866
- throw error;
10867
- }
10868
- const isReady = !isPending && !!order;
10869
- return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
10870
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
10871
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
10872
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
10873
- ] }),
10874
- !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
10875
- ] });
10876
- };
10877
- const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
10878
- const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
10879
- const MetadataForm = ({ orderId, metadata }) => {
10880
- const { handleSuccess } = useRouteModal();
10881
- const hasUneditableRows = getHasUneditableRows(metadata);
10882
- const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
10883
- const form = reactHookForm.useForm({
10884
- defaultValues: {
10885
- metadata: getDefaultValues(metadata)
10886
- },
10887
- resolver: zod.zodResolver(MetadataSchema)
10888
- });
10889
- const handleSubmit = form.handleSubmit(async (data) => {
10890
- const parsedData = parseValues(data);
10891
- await mutateAsync(
10892
- {
10893
- metadata: parsedData
10894
- },
10895
- {
10896
- onSuccess: () => {
10897
- ui.toast.success("Metadata updated");
10898
- handleSuccess();
10899
- },
10900
- onError: (error) => {
10901
- ui.toast.error(error.message);
10902
- }
10903
- }
10904
- );
10905
- });
10906
- const { fields, insert, remove } = reactHookForm.useFieldArray({
10907
- control: form.control,
10908
- name: "metadata"
10909
- });
10910
- function deleteRow(index) {
10911
- remove(index);
10912
- if (fields.length === 1) {
10913
- insert(0, {
10914
- key: "",
10915
- value: "",
10916
- disabled: false
10917
- });
10918
- }
10919
- }
10920
- function insertRow(index, position) {
10921
- insert(index + (position === "above" ? 0 : 1), {
10922
- key: "",
10923
- value: "",
10924
- disabled: false
10925
- });
10926
- }
10927
- return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
10928
- KeyboundForm,
10929
- {
10930
- onSubmit: handleSubmit,
10931
- className: "flex flex-1 flex-col overflow-hidden",
10932
- children: [
10933
- /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
10934
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
10935
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
10936
- /* @__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" }) }),
10937
- /* @__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" }) })
10938
- ] }),
10939
- fields.map((field, index) => {
10940
- const isDisabled = field.disabled || false;
10941
- let placeholder = "-";
10942
- if (typeof field.value === "object") {
10943
- placeholder = "{ ... }";
10944
- }
10945
- if (Array.isArray(field.value)) {
10946
- placeholder = "[ ... ]";
10947
- }
10948
- return /* @__PURE__ */ jsxRuntime.jsx(
10949
- ConditionalTooltip,
10950
- {
10951
- showTooltip: isDisabled,
10952
- content: "This row is disabled because it contains non-primitive data.",
10953
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
10954
- /* @__PURE__ */ jsxRuntime.jsxs(
10955
- "div",
10956
- {
10957
- className: ui.clx("grid grid-cols-2 divide-x", {
10958
- "overflow-hidden rounded-b-lg": index === fields.length - 1
10959
- }),
10960
- children: [
10961
- /* @__PURE__ */ jsxRuntime.jsx(
10962
- Form$2.Field,
10963
- {
10964
- control: form.control,
10965
- name: `metadata.${index}.key`,
10966
- render: ({ field: field2 }) => {
10967
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10968
- GridInput,
10969
- {
10970
- "aria-labelledby": METADATA_KEY_LABEL_ID,
10971
- ...field2,
10972
- disabled: isDisabled,
10973
- placeholder: "Key"
10974
- }
10975
- ) }) });
10976
- }
10977
- }
10978
- ),
10979
- /* @__PURE__ */ jsxRuntime.jsx(
10980
- Form$2.Field,
10981
- {
10982
- control: form.control,
10983
- name: `metadata.${index}.value`,
10984
- render: ({ field: { value, ...field2 } }) => {
10985
- return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
10986
- GridInput,
10987
- {
10988
- "aria-labelledby": METADATA_VALUE_LABEL_ID,
10989
- ...field2,
10990
- value: isDisabled ? placeholder : value,
10991
- disabled: isDisabled,
10992
- placeholder: "Value"
10993
- }
10994
- ) }) });
10995
- }
10996
- }
10997
- )
10998
- ]
10999
- }
11000
- ),
11001
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
11002
- /* @__PURE__ */ jsxRuntime.jsx(
11003
- ui.DropdownMenu.Trigger,
11004
- {
11005
- className: ui.clx(
11006
- "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
11007
- {
11008
- hidden: isDisabled
11009
- }
11010
- ),
11011
- disabled: isDisabled,
11012
- asChild: true,
11013
- children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
11014
- }
11015
- ),
11016
- /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
11017
- /* @__PURE__ */ jsxRuntime.jsxs(
11018
- ui.DropdownMenu.Item,
11019
- {
11020
- className: "gap-x-2",
11021
- onClick: () => insertRow(index, "above"),
11022
- children: [
11023
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
11024
- "Insert row above"
11025
- ]
11026
- }
11027
- ),
11028
- /* @__PURE__ */ jsxRuntime.jsxs(
11029
- ui.DropdownMenu.Item,
11030
- {
11031
- className: "gap-x-2",
11032
- onClick: () => insertRow(index, "below"),
11033
- children: [
11034
- /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
11035
- "Insert row below"
11036
- ]
11037
- }
11038
- ),
11039
- /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
11040
- /* @__PURE__ */ jsxRuntime.jsxs(
11041
- ui.DropdownMenu.Item,
11042
- {
11043
- className: "gap-x-2",
11044
- onClick: () => deleteRow(index),
11045
- children: [
11046
- /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
11047
- "Delete row"
11048
- ]
11049
- }
11050
- )
11051
- ] })
11052
- ] })
11053
- ] })
11054
- },
11055
- field.id
11056
- );
11057
- })
11058
- ] }),
11059
- 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." })
11060
- ] }),
11061
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11062
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
11063
- /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
11064
- ] }) })
11065
- ]
11066
- }
11067
- ) });
11068
- };
11069
- const GridInput = React.forwardRef(({ className, ...props }, ref) => {
11070
- return /* @__PURE__ */ jsxRuntime.jsx(
11071
- "input",
11072
- {
11073
- ref,
11074
- ...props,
11075
- autoComplete: "off",
11076
- className: ui.clx(
11077
- "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",
11078
- className
11079
- )
11080
- }
11081
- );
11082
- });
11083
- GridInput.displayName = "MetadataForm.GridInput";
11084
- const PlaceholderInner = () => {
11085
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
11086
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
11087
- /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
11088
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
11089
- /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
11090
- ] }) })
11091
- ] });
11092
- };
11093
- const EDITABLE_TYPES = ["string", "number", "boolean"];
11094
- function getDefaultValues(metadata) {
11095
- if (!metadata || !Object.keys(metadata).length) {
11096
- return [
11097
- {
11098
- key: "",
11099
- value: "",
11100
- disabled: false
11101
- }
11102
- ];
11103
- }
11104
- return Object.entries(metadata).map(([key, value]) => {
11105
- if (!EDITABLE_TYPES.includes(typeof value)) {
11106
- return {
11107
- key,
11108
- value,
11109
- disabled: true
11110
- };
11111
- }
11112
- let stringValue = value;
11113
- if (typeof value !== "string") {
11114
- stringValue = JSON.stringify(value);
11115
- }
11116
- return {
11117
- key,
11118
- value: stringValue,
11119
- original_key: key
11120
- };
11121
- });
11122
- }
11123
- function parseValues(values) {
11124
- const metadata = values.metadata;
11125
- const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
11126
- if (isEmpty) {
11127
- return null;
11128
- }
11129
- const update = {};
11130
- metadata.forEach((field) => {
11131
- let key = field.key;
11132
- let value = field.value;
11133
- const disabled = field.disabled;
11134
- if (!key || !value) {
11135
- return;
11136
- }
11137
- if (disabled) {
11138
- update[key] = value;
11139
- return;
11140
- }
11141
- key = key.trim();
11142
- value = value.trim();
11143
- if (value === "true") {
11144
- update[key] = true;
11145
- } else if (value === "false") {
11146
- update[key] = false;
11147
- } else {
11148
- const parsedNumber = parseFloat(value);
11149
- if (!isNaN(parsedNumber)) {
11150
- update[key] = parsedNumber;
11151
- } else {
11152
- update[key] = value;
11153
- }
11154
- }
11155
- });
11156
- return update;
11157
- }
11158
- function getHasUneditableRows(metadata) {
11159
- if (!metadata) {
11160
- return false;
11161
- }
11162
- return Object.values(metadata).some(
11163
- (value) => !EDITABLE_TYPES.includes(typeof value)
11164
- );
11165
- }
11166
10816
  const PROMOTION_QUERY_KEY = "promotions";
11167
10817
  const promotionsQueryKeys = {
11168
10818
  list: (query2) => [
@@ -13027,11 +12677,361 @@ const Illustration = () => {
13027
12677
  ] })
13028
12678
  ]
13029
12679
  }
13030
- );
12680
+ );
12681
+ };
12682
+ const schema = objectType({
12683
+ customer_id: stringType().min(1)
12684
+ });
12685
+ const InlineTip = React.forwardRef(
12686
+ ({ variant = "tip", label, className, children, ...props }, ref) => {
12687
+ const labelValue = label || (variant === "warning" ? "Warning" : "Tip");
12688
+ return /* @__PURE__ */ jsxRuntime.jsxs(
12689
+ "div",
12690
+ {
12691
+ ref,
12692
+ className: ui.clx(
12693
+ "bg-ui-bg-component txt-small text-ui-fg-subtle grid grid-cols-[4px_1fr] items-start gap-3 rounded-lg border p-3",
12694
+ className
12695
+ ),
12696
+ ...props,
12697
+ children: [
12698
+ /* @__PURE__ */ jsxRuntime.jsx(
12699
+ "div",
12700
+ {
12701
+ role: "presentation",
12702
+ className: ui.clx("w-4px bg-ui-tag-neutral-icon h-full rounded-full", {
12703
+ "bg-ui-tag-orange-icon": variant === "warning"
12704
+ })
12705
+ }
12706
+ ),
12707
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-pretty", children: [
12708
+ /* @__PURE__ */ jsxRuntime.jsxs("strong", { className: "txt-small-plus text-ui-fg-base", children: [
12709
+ labelValue,
12710
+ ":"
12711
+ ] }),
12712
+ " ",
12713
+ children
12714
+ ] })
12715
+ ]
12716
+ }
12717
+ );
12718
+ }
12719
+ );
12720
+ InlineTip.displayName = "InlineTip";
12721
+ const MetadataFieldSchema = objectType({
12722
+ key: stringType(),
12723
+ disabled: booleanType().optional(),
12724
+ value: anyType()
12725
+ });
12726
+ const MetadataSchema = objectType({
12727
+ metadata: arrayType(MetadataFieldSchema)
12728
+ });
12729
+ const Metadata = () => {
12730
+ const { id } = reactRouterDom.useParams();
12731
+ const { order, isPending, isError, error } = useOrder(id, {
12732
+ fields: "metadata"
12733
+ });
12734
+ if (isError) {
12735
+ throw error;
12736
+ }
12737
+ const isReady = !isPending && !!order;
12738
+ return /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer, { children: [
12739
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Header, { children: [
12740
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Title, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Heading, { children: "Metadata" }) }),
12741
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Description, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Add metadata to the draft order." }) })
12742
+ ] }),
12743
+ !isReady ? /* @__PURE__ */ jsxRuntime.jsx(PlaceholderInner, {}) : /* @__PURE__ */ jsxRuntime.jsx(MetadataForm, { orderId: id, metadata: order == null ? void 0 : order.metadata })
12744
+ ] });
12745
+ };
12746
+ const METADATA_KEY_LABEL_ID = "metadata-form-key-label";
12747
+ const METADATA_VALUE_LABEL_ID = "metadata-form-value-label";
12748
+ const MetadataForm = ({ orderId, metadata }) => {
12749
+ const { handleSuccess } = useRouteModal();
12750
+ const hasUneditableRows = getHasUneditableRows(metadata);
12751
+ const { mutateAsync, isPending } = useUpdateDraftOrder(orderId);
12752
+ const form = reactHookForm.useForm({
12753
+ defaultValues: {
12754
+ metadata: getDefaultValues(metadata)
12755
+ },
12756
+ resolver: zod.zodResolver(MetadataSchema)
12757
+ });
12758
+ const handleSubmit = form.handleSubmit(async (data) => {
12759
+ const parsedData = parseValues(data);
12760
+ await mutateAsync(
12761
+ {
12762
+ metadata: parsedData
12763
+ },
12764
+ {
12765
+ onSuccess: () => {
12766
+ ui.toast.success("Metadata updated");
12767
+ handleSuccess();
12768
+ },
12769
+ onError: (error) => {
12770
+ ui.toast.error(error.message);
12771
+ }
12772
+ }
12773
+ );
12774
+ });
12775
+ const { fields, insert, remove } = reactHookForm.useFieldArray({
12776
+ control: form.control,
12777
+ name: "metadata"
12778
+ });
12779
+ function deleteRow(index) {
12780
+ remove(index);
12781
+ if (fields.length === 1) {
12782
+ insert(0, {
12783
+ key: "",
12784
+ value: "",
12785
+ disabled: false
12786
+ });
12787
+ }
12788
+ }
12789
+ function insertRow(index, position) {
12790
+ insert(index + (position === "above" ? 0 : 1), {
12791
+ key: "",
12792
+ value: "",
12793
+ disabled: false
12794
+ });
12795
+ }
12796
+ return /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Form, { form, children: /* @__PURE__ */ jsxRuntime.jsxs(
12797
+ KeyboundForm,
12798
+ {
12799
+ onSubmit: handleSubmit,
12800
+ className: "flex flex-1 flex-col overflow-hidden",
12801
+ children: [
12802
+ /* @__PURE__ */ jsxRuntime.jsxs(RouteDrawer.Body, { className: "flex flex-1 flex-col gap-y-8 overflow-y-auto", children: [
12803
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-base shadow-elevation-card-rest grid grid-cols-1 divide-y rounded-lg", children: [
12804
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-ui-bg-subtle grid grid-cols-2 divide-x rounded-t-lg", children: [
12805
+ /* @__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" }) }),
12806
+ /* @__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" }) })
12807
+ ] }),
12808
+ fields.map((field, index) => {
12809
+ const isDisabled = field.disabled || false;
12810
+ let placeholder = "-";
12811
+ if (typeof field.value === "object") {
12812
+ placeholder = "{ ... }";
12813
+ }
12814
+ if (Array.isArray(field.value)) {
12815
+ placeholder = "[ ... ]";
12816
+ }
12817
+ return /* @__PURE__ */ jsxRuntime.jsx(
12818
+ ConditionalTooltip,
12819
+ {
12820
+ showTooltip: isDisabled,
12821
+ content: "This row is disabled because it contains non-primitive data.",
12822
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "group/table relative", children: [
12823
+ /* @__PURE__ */ jsxRuntime.jsxs(
12824
+ "div",
12825
+ {
12826
+ className: ui.clx("grid grid-cols-2 divide-x", {
12827
+ "overflow-hidden rounded-b-lg": index === fields.length - 1
12828
+ }),
12829
+ children: [
12830
+ /* @__PURE__ */ jsxRuntime.jsx(
12831
+ Form$2.Field,
12832
+ {
12833
+ control: form.control,
12834
+ name: `metadata.${index}.key`,
12835
+ render: ({ field: field2 }) => {
12836
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12837
+ GridInput,
12838
+ {
12839
+ "aria-labelledby": METADATA_KEY_LABEL_ID,
12840
+ ...field2,
12841
+ disabled: isDisabled,
12842
+ placeholder: "Key"
12843
+ }
12844
+ ) }) });
12845
+ }
12846
+ }
12847
+ ),
12848
+ /* @__PURE__ */ jsxRuntime.jsx(
12849
+ Form$2.Field,
12850
+ {
12851
+ control: form.control,
12852
+ name: `metadata.${index}.value`,
12853
+ render: ({ field: { value, ...field2 } }) => {
12854
+ return /* @__PURE__ */ jsxRuntime.jsx(Form$2.Item, { children: /* @__PURE__ */ jsxRuntime.jsx(Form$2.Control, { children: /* @__PURE__ */ jsxRuntime.jsx(
12855
+ GridInput,
12856
+ {
12857
+ "aria-labelledby": METADATA_VALUE_LABEL_ID,
12858
+ ...field2,
12859
+ value: isDisabled ? placeholder : value,
12860
+ disabled: isDisabled,
12861
+ placeholder: "Value"
12862
+ }
12863
+ ) }) });
12864
+ }
12865
+ }
12866
+ )
12867
+ ]
12868
+ }
12869
+ ),
12870
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu, { children: [
12871
+ /* @__PURE__ */ jsxRuntime.jsx(
12872
+ ui.DropdownMenu.Trigger,
12873
+ {
12874
+ className: ui.clx(
12875
+ "invisible absolute inset-y-0 -right-2.5 my-auto group-hover/table:visible data-[state='open']:visible",
12876
+ {
12877
+ hidden: isDisabled
12878
+ }
12879
+ ),
12880
+ disabled: isDisabled,
12881
+ asChild: true,
12882
+ children: /* @__PURE__ */ jsxRuntime.jsx(ui.IconButton, { size: "2xsmall", children: /* @__PURE__ */ jsxRuntime.jsx(icons.EllipsisVertical, {}) })
12883
+ }
12884
+ ),
12885
+ /* @__PURE__ */ jsxRuntime.jsxs(ui.DropdownMenu.Content, { children: [
12886
+ /* @__PURE__ */ jsxRuntime.jsxs(
12887
+ ui.DropdownMenu.Item,
12888
+ {
12889
+ className: "gap-x-2",
12890
+ onClick: () => insertRow(index, "above"),
12891
+ children: [
12892
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowUpMini, { className: "text-ui-fg-subtle" }),
12893
+ "Insert row above"
12894
+ ]
12895
+ }
12896
+ ),
12897
+ /* @__PURE__ */ jsxRuntime.jsxs(
12898
+ ui.DropdownMenu.Item,
12899
+ {
12900
+ className: "gap-x-2",
12901
+ onClick: () => insertRow(index, "below"),
12902
+ children: [
12903
+ /* @__PURE__ */ jsxRuntime.jsx(icons.ArrowDownMini, { className: "text-ui-fg-subtle" }),
12904
+ "Insert row below"
12905
+ ]
12906
+ }
12907
+ ),
12908
+ /* @__PURE__ */ jsxRuntime.jsx(ui.DropdownMenu.Separator, {}),
12909
+ /* @__PURE__ */ jsxRuntime.jsxs(
12910
+ ui.DropdownMenu.Item,
12911
+ {
12912
+ className: "gap-x-2",
12913
+ onClick: () => deleteRow(index),
12914
+ children: [
12915
+ /* @__PURE__ */ jsxRuntime.jsx(icons.Trash, { className: "text-ui-fg-subtle" }),
12916
+ "Delete row"
12917
+ ]
12918
+ }
12919
+ )
12920
+ ] })
12921
+ ] })
12922
+ ] })
12923
+ },
12924
+ field.id
12925
+ );
12926
+ })
12927
+ ] }),
12928
+ 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." })
12929
+ ] }),
12930
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12931
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", variant: "secondary", type: "button", children: "Cancel" }) }),
12932
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { size: "small", type: "submit", isLoading: isPending, children: "Save" })
12933
+ ] }) })
12934
+ ]
12935
+ }
12936
+ ) });
13031
12937
  };
13032
- const schema = objectType({
13033
- customer_id: stringType().min(1)
12938
+ const GridInput = React.forwardRef(({ className, ...props }, ref) => {
12939
+ return /* @__PURE__ */ jsxRuntime.jsx(
12940
+ "input",
12941
+ {
12942
+ ref,
12943
+ ...props,
12944
+ autoComplete: "off",
12945
+ className: ui.clx(
12946
+ "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",
12947
+ className
12948
+ )
12949
+ }
12950
+ );
13034
12951
  });
12952
+ GridInput.displayName = "MetadataForm.GridInput";
12953
+ const PlaceholderInner = () => {
12954
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
12955
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Body, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-[148ox] w-full rounded-lg" }) }),
12956
+ /* @__PURE__ */ jsxRuntime.jsx(RouteDrawer.Footer, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-x-2", children: [
12957
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" }),
12958
+ /* @__PURE__ */ jsxRuntime.jsx(ui.Skeleton, { className: "h-7 w-12 rounded-md" })
12959
+ ] }) })
12960
+ ] });
12961
+ };
12962
+ const EDITABLE_TYPES = ["string", "number", "boolean"];
12963
+ function getDefaultValues(metadata) {
12964
+ if (!metadata || !Object.keys(metadata).length) {
12965
+ return [
12966
+ {
12967
+ key: "",
12968
+ value: "",
12969
+ disabled: false
12970
+ }
12971
+ ];
12972
+ }
12973
+ return Object.entries(metadata).map(([key, value]) => {
12974
+ if (!EDITABLE_TYPES.includes(typeof value)) {
12975
+ return {
12976
+ key,
12977
+ value,
12978
+ disabled: true
12979
+ };
12980
+ }
12981
+ let stringValue = value;
12982
+ if (typeof value !== "string") {
12983
+ stringValue = JSON.stringify(value);
12984
+ }
12985
+ return {
12986
+ key,
12987
+ value: stringValue,
12988
+ original_key: key
12989
+ };
12990
+ });
12991
+ }
12992
+ function parseValues(values) {
12993
+ const metadata = values.metadata;
12994
+ const isEmpty = !metadata.length || metadata.length === 1 && !metadata[0].key && !metadata[0].value;
12995
+ if (isEmpty) {
12996
+ return null;
12997
+ }
12998
+ const update = {};
12999
+ metadata.forEach((field) => {
13000
+ let key = field.key;
13001
+ let value = field.value;
13002
+ const disabled = field.disabled;
13003
+ if (!key || !value) {
13004
+ return;
13005
+ }
13006
+ if (disabled) {
13007
+ update[key] = value;
13008
+ return;
13009
+ }
13010
+ key = key.trim();
13011
+ value = value.trim();
13012
+ if (value === "true") {
13013
+ update[key] = true;
13014
+ } else if (value === "false") {
13015
+ update[key] = false;
13016
+ } else {
13017
+ const parsedNumber = parseFloat(value);
13018
+ if (!isNaN(parsedNumber)) {
13019
+ update[key] = parsedNumber;
13020
+ } else {
13021
+ update[key] = value;
13022
+ }
13023
+ }
13024
+ });
13025
+ return update;
13026
+ }
13027
+ function getHasUneditableRows(metadata) {
13028
+ if (!metadata) {
13029
+ return false;
13030
+ }
13031
+ return Object.values(metadata).some(
13032
+ (value) => !EDITABLE_TYPES.includes(typeof value)
13033
+ );
13034
+ }
13035
13035
  const widgetModule = { widgets: [] };
13036
13036
  const routeModule = {
13037
13037
  routes: [
@@ -13068,10 +13068,6 @@ const routeModule = {
13068
13068
  Component: Items,
13069
13069
  path: "/draft-orders/:id/items"
13070
13070
  },
13071
- {
13072
- Component: Metadata,
13073
- path: "/draft-orders/:id/metadata"
13074
- },
13075
13071
  {
13076
13072
  Component: Promotions,
13077
13073
  path: "/draft-orders/:id/promotions"
@@ -13091,6 +13087,10 @@ const routeModule = {
13091
13087
  {
13092
13088
  Component: TransferOwnership,
13093
13089
  path: "/draft-orders/:id/transfer-ownership"
13090
+ },
13091
+ {
13092
+ Component: Metadata,
13093
+ path: "/draft-orders/:id/metadata"
13094
13094
  }
13095
13095
  ]
13096
13096
  }