@box/metadata-template-editor 1.20.9 → 1.20.10

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 (95) hide show
  1. package/dist/chunks/chip.js +21 -0
  2. package/dist/chunks/dropdown-field-configuration.js +62 -0
  3. package/dist/chunks/field-context-menu.js +90 -0
  4. package/dist/chunks/field-selector.js +23 -0
  5. package/dist/chunks/field-type-dropdown.js +31 -0
  6. package/dist/chunks/levels-chain.js +125 -0
  7. package/dist/chunks/metadata-field-configurator.module.js +17 -16
  8. package/dist/chunks/metadata-field-list.js +229 -0
  9. package/dist/chunks/metadata-template-editor-form.js +107 -0
  10. package/dist/chunks/metadata-template-editor-modal.js +77 -0
  11. package/dist/chunks/metadata-template-editor.js +157 -0
  12. package/dist/chunks/sortable-option-list.js +231 -0
  13. package/dist/chunks/taxonomy-field-configuration.js +126 -0
  14. package/dist/chunks/taxonomy-field-configurator-initial-state.js +48 -0
  15. package/dist/chunks/taxonomy-selector.js +90 -0
  16. package/dist/chunks/types.js +22 -33
  17. package/dist/esm/index.js +13 -34
  18. package/dist/esm/lib/components/field-selector/field-selector.js +2 -39
  19. package/dist/esm/lib/components/field-selector/index.js +2 -4
  20. package/dist/esm/lib/components/field-selector/messages.js +10 -12
  21. package/dist/esm/lib/components/field-type-dropdown/field-type-dropdown.js +2 -47
  22. package/dist/esm/lib/components/field-type-dropdown/index.js +2 -4
  23. package/dist/esm/lib/components/field-type-dropdown/messages.js +10 -12
  24. package/dist/esm/lib/components/field-type-tiles/field-type-tiles.js +32 -39
  25. package/dist/esm/lib/components/field-type-tiles/index.js +2 -4
  26. package/dist/esm/lib/components/field-type-tiles/messages.js +10 -12
  27. package/dist/esm/lib/components/metadata-field-configurator/components/confirmation-modal/confirmation-modal.js +32 -45
  28. package/dist/esm/lib/components/metadata-field-configurator/components/confirmation-modal/messages.js +14 -16
  29. package/dist/esm/lib/components/metadata-field-configurator/components/field-action-slot/field-action-slot.js +62 -79
  30. package/dist/esm/lib/components/metadata-field-configurator/components/field-context-menu/field-context-menu.js +2 -115
  31. package/dist/esm/lib/components/metadata-field-configurator/components/field-edit-content/field-edit-content.js +83 -100
  32. package/dist/esm/lib/components/metadata-field-configurator/components/levels-chain/chip.js +2 -33
  33. package/dist/esm/lib/components/metadata-field-configurator/components/levels-chain/index.js +2 -4
  34. package/dist/esm/lib/components/metadata-field-configurator/components/levels-chain/levels-chain.js +2 -118
  35. package/dist/esm/lib/components/metadata-field-configurator/components/levels-chain/utils.js +16 -33
  36. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/dropdown/__mocks__/getInitialValues.js +34 -32
  37. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/dropdown/dropdown-default-values.js +10 -14
  38. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/dropdown/dropdown-field-configuration.js +2 -66
  39. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/dropdown/sortable-option-list.js +2 -294
  40. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/index.js +3 -6
  41. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/taxonomy/taxonomy-default-values.js +11 -15
  42. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/taxonomy/taxonomy-field-configuration.js +2 -149
  43. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/taxonomy/taxonomy-field-configurator-initial-state.js +2 -54
  44. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/taxonomy/taxonomy-selector-messages.js +34 -36
  45. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/taxonomy/taxonomy-selector.js +2 -103
  46. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/taxonomy/useTaxonomySelect.js +15 -19
  47. package/dist/esm/lib/components/metadata-field-configurator/components/type-specific-configuration/taxonomy/utils.js +2 -4
  48. package/dist/esm/lib/components/metadata-field-configurator/context/field-configurator-context.js +60 -66
  49. package/dist/esm/lib/components/metadata-field-configurator/context/field-extensions-context.js +5 -8
  50. package/dist/esm/lib/components/metadata-field-configurator/context/taxonomy-options-context.js +14 -20
  51. package/dist/esm/lib/components/metadata-field-configurator/hooks/useFieldConfiguratorBehavior.js +99 -118
  52. package/dist/esm/lib/components/metadata-field-configurator/hooks/useFieldValidation.js +52 -66
  53. package/dist/esm/lib/components/metadata-field-configurator/hooks/useTaxonomyFetch.js +23 -26
  54. package/dist/esm/lib/components/metadata-field-configurator/hooks/useTemplateFieldSchema.js +34 -43
  55. package/dist/esm/lib/components/metadata-field-configurator/index.js +5 -11
  56. package/dist/esm/lib/components/metadata-field-configurator/messages/configurator-messages.js +131 -134
  57. package/dist/esm/lib/components/metadata-field-configurator/messages/dropdown-messages.js +34 -36
  58. package/dist/esm/lib/components/metadata-field-configurator/messages/levels-chain-messages.js +14 -16
  59. package/dist/esm/lib/components/metadata-field-configurator/messages/taxonomy-messages.js +34 -36
  60. package/dist/esm/lib/components/metadata-field-configurator/metadata-field-configurator.js +94 -153
  61. package/dist/esm/lib/components/metadata-field-configurator/utils.js +42 -49
  62. package/dist/esm/lib/components/metadata-field-list/index.js +2 -5
  63. package/dist/esm/lib/components/metadata-field-list/metadata-field-list.js +2 -279
  64. package/dist/esm/lib/components/metadata-template-editor-form/metadata-template-editor-form.js +2 -137
  65. package/dist/esm/lib/components/metadata-template-editor-modal/index.js +2 -4
  66. package/dist/esm/lib/components/metadata-template-editor-modal/metadata-template-editor-modal.js +2 -103
  67. package/dist/esm/lib/hooks/useMetadataTemplateFormSchema.js +13 -15
  68. package/dist/esm/lib/hooks/useTemplateNameSchema.js +8 -10
  69. package/dist/esm/lib/index.js +7 -14
  70. package/dist/esm/lib/messages.js +114 -116
  71. package/dist/esm/lib/metadata-template-editor.js +2 -182
  72. package/dist/esm/lib/utils/constants.js +2 -8
  73. package/dist/esm/lib/utils/field-options/field-type-icon.js +14 -33
  74. package/dist/esm/lib/utils/field-options/index.js +4 -9
  75. package/dist/esm/lib/utils/field-options/messages.js +43 -46
  76. package/dist/esm/lib/utils/field-options/useFieldOptions.js +14 -18
  77. package/dist/esm/lib/utils/key-generation.js +16 -27
  78. package/dist/esm/lib/utils/template-type-conversion/convertLocalConfiguratorToTemplateField.js +63 -77
  79. package/dist/esm/lib/utils/template-type-conversion/convertTemplateFieldToLocalConfigurator.js +69 -89
  80. package/dist/esm/lib/utils/template-type-conversion/generateJSONPatchTemplateOperations.js +150 -169
  81. package/dist/esm/lib/utils/template-type-conversion/mapFieldsWithUniqueKeys.js +8 -13
  82. package/dist/styles/chip.css +1 -1
  83. package/dist/styles/dropdown-field-configuration.css +1 -1
  84. package/dist/styles/field-context-menu.css +1 -1
  85. package/dist/styles/levels-chain.css +1 -1
  86. package/dist/styles/metadata-field-configurator.css +1 -1
  87. package/dist/styles/metadata-field-list.css +1 -1
  88. package/dist/styles/metadata-template-editor-form.css +1 -1
  89. package/dist/styles/metadata-template-editor-modal.css +1 -1
  90. package/dist/styles/metadata-template-editor.css +1 -1
  91. package/dist/styles/sortable-option-list.css +1 -1
  92. package/dist/styles/taxonomy-field-configuration.css +1 -1
  93. package/dist/styles/taxonomy-field-configurator-initial-state.css +1 -1
  94. package/dist/styles/taxonomy-selector.css +1 -1
  95. package/package.json +6 -6
@@ -1,154 +1,95 @@
1
- import "./hooks/useTemplateFieldSchema.js";
2
- import { useIntl as oe } from "react-intl";
3
- import { Tabs as l, Accordion as g } from "@box/blueprint-web";
4
- import { FieldConfiguratorContext as te } from "./context/field-configurator-context.js";
5
- import { TaxonomyOptionsContext as ie } from "./context/taxonomy-options-context.js";
6
- import { FieldExtensionsContext as ne } from "./context/field-extensions-context.js";
7
- import { useFieldConfiguratorBehavior as re } from "./hooks/useFieldConfiguratorBehavior.js";
8
- import { FieldEditContent as le } from "./components/field-edit-content/field-edit-content.js";
9
- import { FieldActionSlot as ae } from "./components/field-action-slot/field-action-slot.js";
10
- import de from "./components/confirmation-modal/confirmation-modal.js";
11
- import { s as a } from "../../../../chunks/metadata-field-configurator.module.js";
12
- import { general as I } from "./messages/configurator-messages.js";
13
- import { jsxs as v, Fragment as ce, jsx as e } from "react/jsx-runtime";
14
- import "./utils.js";
15
- const Fe = ({
16
- index: b,
17
- maxIndex: T,
18
- values: o,
19
- onValuesChange: x,
20
- onDelete: y,
21
- onDuplicate: F,
22
- onReorderFields: A,
23
- onTouchStart: M,
24
- onDragStart: V,
25
- onDragEnd: D,
26
- externalErrors: N,
27
- externalTouched: q,
28
- dndDragHandleProps: E,
29
- isExpanded: n,
30
- onExpandedChange: P,
31
- taxonomyOptions: d,
32
- fetchTaxonomies: c,
33
- submitAttemptCount: S,
34
- fieldExtensions: r,
35
- onValidationChange: j
36
- }) => {
37
- const m = oe(), {
38
- contextValue: B,
39
- taxonomyContextValue: R,
40
- extensions: t,
41
- isActive: w,
42
- handleAccordionValueChange: z,
43
- isDeleteConfirmationModalOpen: H,
44
- openConfirmationModal: K,
45
- closeConfirmationModal: O,
46
- handleDeleteField: W,
47
- activeTabId: $,
48
- setActiveTabId: k,
49
- isTypeEditable: G,
50
- uniqueKey: s,
51
- nameInputId: J,
52
- descriptionInputId: L,
53
- accordionTitle: Q,
54
- TitleIcon: U,
55
- hasErrors: X,
56
- handleTypeChange: Y,
57
- handleChangeVisibility: Z
58
- } = re({
59
- values: o,
60
- onValuesChange: x,
61
- onDelete: y,
62
- isExpanded: n,
63
- onExpandedChange: P,
64
- submitAttemptCount: S,
65
- taxonomyOptions: d,
66
- fetchTaxonomies: c,
67
- fieldExtensionsProp: r,
68
- onValidationChange: j
69
- }), p = /* @__PURE__ */ e(le, {
70
- nameInputId: J,
71
- descriptionInputId: L,
72
- isTypeEditable: G,
73
- externalErrors: N,
74
- externalTouched: q,
75
- handleTypeChange: Y
76
- }), _ = t.length > 0 ? /* @__PURE__ */ v(ce, {
77
- children: [/* @__PURE__ */ e(l.TabPanel, {
78
- tabId: "edit",
79
- children: p
80
- }), t.map((i, ee) => /* @__PURE__ */ e(l.TabPanel, {
81
- tabId: `ext-${ee}`,
82
- className: a.extensionContent,
83
- children: i.renderContent(o)
84
- }, i.label))]
85
- }) : p, f = (
86
- // eslint-disable-next-line @typescript-eslint/ban-ts-comment
87
- // @ts-expect-error iconVariant type is too narrow
88
- /* @__PURE__ */ e(g.Item, {
89
- startElement: /* @__PURE__ */ e(U, {
90
- fontSize: "20px",
91
- role: "presentation"
92
- }),
93
- value: s,
94
- title: Q,
95
- action: /* @__PURE__ */ e(ae, {
96
- isExpanded: n,
97
- isHidden: o.hidden,
98
- index: b,
99
- maxIndex: T,
100
- dndDragHandleProps: E,
101
- onDragStart: V,
102
- onDragEnd: D,
103
- onTouchStart: M,
104
- onReorderFields: A,
105
- onToggleVisibility: Z,
106
- onRequestDelete: K,
107
- onRequestDuplicate: F,
108
- extensions: t
109
- }),
110
- className: a.fieldAccordionItem,
111
- iconVariant: X ? "alert-error" : void 0,
112
- children: _
113
- })
114
- ), h = t.length > 0 ? /* @__PURE__ */ e(l, {
115
- selectedId: $,
116
- setSelectedId: (i) => k(i ?? "edit"),
117
- children: f
118
- }) : f, C = /* @__PURE__ */ v(te.Provider, {
119
- value: B,
120
- children: [/* @__PURE__ */ e("div", {
121
- className: a.fieldAccordionWrapper,
122
- children: n !== void 0 ? (
123
- // List mode: parent MetadataFieldList provides the shared Accordion root.
124
- h
125
- ) : (
126
- // Standalone mode: own Accordion root with self-managed open/close state.
127
- /* @__PURE__ */ e(g, {
128
- type: "single",
129
- collapsible: !0,
130
- value: w ? s : "",
131
- onValueChange: z,
132
- children: h
133
- })
134
- )
135
- }), H && /* @__PURE__ */ e(de, {
136
- onClose: O,
137
- onConfirm: W,
138
- title: m.formatMessage(I.deleteFieldTitle, {
139
- fieldName: o.name
140
- }),
141
- body: m.formatMessage(I.deleteFieldDescription)
142
- })]
143
- }), u = d !== void 0 || c !== void 0 ? /* @__PURE__ */ e(ie.Provider, {
144
- value: R,
145
- children: C
146
- }) : C;
147
- return r !== void 0 ? /* @__PURE__ */ e(ne.Provider, {
148
- value: r,
149
- children: u
150
- }) : u;
151
- };
152
- export {
153
- Fe as MetadataFieldConfigurator
1
+ import { general as e } from "./messages/configurator-messages.js";
2
+ import { FieldConfiguratorContext as t } from "./context/field-configurator-context.js";
3
+ import { TaxonomyOptionsContext as n } from "./context/taxonomy-options-context.js";
4
+ import { FieldExtensionsContext as r } from "./context/field-extensions-context.js";
5
+ import i from "./components/confirmation-modal/confirmation-modal.js";
6
+ import { useFieldConfiguratorBehavior as a } from "./hooks/useFieldConfiguratorBehavior.js";
7
+ import { t as o } from "../../../../chunks/metadata-field-configurator.module.js";
8
+ import { FieldEditContent as s } from "./components/field-edit-content/field-edit-content.js";
9
+ import { FieldActionSlot as c } from "./components/field-action-slot/field-action-slot.js";
10
+ import { Accordion as l, Tabs as u } from "@box/blueprint-web";
11
+ import { useIntl as d } from "react-intl";
12
+ import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
13
+ import "react";
14
+ var h = ({ index: h, maxIndex: g, values: _, onValuesChange: ee, onDelete: te, onDuplicate: ne, onReorderFields: re, onTouchStart: ie, onDragStart: v, onDragEnd: y, externalErrors: b, externalTouched: x, dndDragHandleProps: S, isExpanded: C, onExpandedChange: w, taxonomyOptions: T, fetchTaxonomies: E, submitAttemptCount: D, fieldExtensions: O, onValidationChange: k }) => {
15
+ let A = d(), { contextValue: j, taxonomyContextValue: M, extensions: N, isActive: P, handleAccordionValueChange: F, isDeleteConfirmationModalOpen: I, openConfirmationModal: ae, closeConfirmationModal: L, handleDeleteField: R, activeTabId: z, setActiveTabId: B, isTypeEditable: V, uniqueKey: H, nameInputId: U, descriptionInputId: W, accordionTitle: G, TitleIcon: K, hasErrors: q, handleTypeChange: J, handleChangeVisibility: oe } = a({
16
+ values: _,
17
+ onValuesChange: ee,
18
+ onDelete: te,
19
+ isExpanded: C,
20
+ onExpandedChange: w,
21
+ submitAttemptCount: D,
22
+ taxonomyOptions: T,
23
+ fetchTaxonomies: E,
24
+ fieldExtensionsProp: O,
25
+ onValidationChange: k
26
+ }), Y = /* @__PURE__ */ p(s, {
27
+ nameInputId: U,
28
+ descriptionInputId: W,
29
+ isTypeEditable: V,
30
+ externalErrors: b,
31
+ externalTouched: x,
32
+ handleTypeChange: J
33
+ }), se = N.length > 0 ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(u.TabPanel, {
34
+ tabId: "edit",
35
+ children: Y
36
+ }), N.map((e, t) => /* @__PURE__ */ p(u.TabPanel, {
37
+ tabId: `ext-${t}`,
38
+ className: o.extensionContent,
39
+ children: e.renderContent(_)
40
+ }, e.label))] }) : Y, X = /* @__PURE__ */ p(l.Item, {
41
+ startElement: /* @__PURE__ */ p(K, {
42
+ fontSize: "20px",
43
+ role: "presentation"
44
+ }),
45
+ value: H,
46
+ title: G,
47
+ action: /* @__PURE__ */ p(c, {
48
+ isExpanded: C,
49
+ isHidden: _.hidden,
50
+ index: h,
51
+ maxIndex: g,
52
+ dndDragHandleProps: S,
53
+ onDragStart: v,
54
+ onDragEnd: y,
55
+ onTouchStart: ie,
56
+ onReorderFields: re,
57
+ onToggleVisibility: oe,
58
+ onRequestDelete: ae,
59
+ onRequestDuplicate: ne,
60
+ extensions: N
61
+ }),
62
+ className: o.fieldAccordionItem,
63
+ iconVariant: q ? "alert-error" : void 0,
64
+ children: se
65
+ }), Z = N.length > 0 ? /* @__PURE__ */ p(u, {
66
+ selectedId: z,
67
+ setSelectedId: (e) => B(e ?? "edit"),
68
+ children: X
69
+ }) : X, Q = /* @__PURE__ */ m(t.Provider, {
70
+ value: j,
71
+ children: [/* @__PURE__ */ p("div", {
72
+ className: o.fieldAccordionWrapper,
73
+ children: C === void 0 ? /* @__PURE__ */ p(l, {
74
+ type: "single",
75
+ collapsible: !0,
76
+ value: P ? H : "",
77
+ onValueChange: F,
78
+ children: Z
79
+ }) : Z
80
+ }), I && /* @__PURE__ */ p(i, {
81
+ onClose: L,
82
+ onConfirm: R,
83
+ title: A.formatMessage(e.deleteFieldTitle, { fieldName: _.name }),
84
+ body: A.formatMessage(e.deleteFieldDescription)
85
+ })]
86
+ }), $ = T !== void 0 || E !== void 0 ? /* @__PURE__ */ p(n.Provider, {
87
+ value: M,
88
+ children: Q
89
+ }) : Q;
90
+ return O === void 0 ? $ : /* @__PURE__ */ p(r.Provider, {
91
+ value: O,
92
+ children: $
93
+ });
154
94
  };
95
+ export { h as MetadataFieldConfigurator };
@@ -1,53 +1,46 @@
1
- import l from "lodash/uniqueId";
2
- import { F as n } from "../../../../chunks/types.js";
3
- import { taxonomyDefaultValues as s } from "./components/type-specific-configuration/taxonomy/taxonomy-default-values.js";
4
- import { jsx as u } from "react/jsx-runtime";
5
- import { TaxonomyFieldConfiguration as a } from "./components/type-specific-configuration/taxonomy/taxonomy-field-configuration.js";
6
- import { DropdownFieldConfiguration as p } from "./components/type-specific-configuration/dropdown/dropdown-field-configuration.js";
7
- function j(e) {
8
- return {
9
- id: l("field-"),
10
- key: "",
11
- hidden: !1,
12
- name: "",
13
- type: e ?? void 0,
14
- description: "",
15
- isFieldNew: !0,
16
- isFieldReadOnly: !1,
17
- ...s,
18
- dropdown: {
19
- options: e === n.Dropdown ? [{
20
- id: l(),
21
- key: "",
22
- isNew: !0
23
- }] : [],
24
- allowMultipleSelections: !1,
25
- isAllowMultipleSelectionsEnabled: !0
26
- }
27
- };
1
+ import { a as e } from "../../../../chunks/types.js";
2
+ import { t } from "../../../../chunks/dropdown-field-configuration.js";
3
+ import { t as n } from "../../../../chunks/taxonomy-field-configuration.js";
4
+ import { taxonomyDefaultValues as r } from "./components/type-specific-configuration/taxonomy/taxonomy-default-values.js";
5
+ import { jsx as i } from "react/jsx-runtime";
6
+ import "react";
7
+ import a from "lodash/uniqueId";
8
+ function o(t) {
9
+ return {
10
+ id: a("field-"),
11
+ key: "",
12
+ hidden: !1,
13
+ name: "",
14
+ type: t ?? void 0,
15
+ description: "",
16
+ isFieldNew: !0,
17
+ isFieldReadOnly: !1,
18
+ ...r,
19
+ dropdown: {
20
+ options: t === e.Dropdown ? [{
21
+ id: a(),
22
+ key: "",
23
+ isNew: !0
24
+ }] : [],
25
+ allowMultipleSelections: !1,
26
+ isAllowMultipleSelectionsEnabled: !0
27
+ }
28
+ };
28
29
  }
29
- const x = (e) => {
30
- switch (e) {
31
- case n.Dropdown:
32
- return /* @__PURE__ */ u(p, {});
33
- case n.Taxonomy:
34
- return /* @__PURE__ */ u(a, {});
35
- default:
36
- return null;
37
- }
30
+ var s = (r) => {
31
+ switch (r) {
32
+ case e.Dropdown: return /* @__PURE__ */ i(t, {});
33
+ case e.Taxonomy: return /* @__PURE__ */ i(n, {});
34
+ default: return null;
35
+ }
38
36
  };
39
- function d(e, o) {
40
- return e ? o === !0 ? !0 : typeof e != "object" || typeof o != "object" || !o ? !1 : Object.keys(e).some((t) => d(e[t], o[t])) : !1;
37
+ function c(e, t) {
38
+ return e ? t === !0 ? !0 : typeof e != "object" || typeof t != "object" || !t ? !1 : Object.keys(e).some((n) => c(e[n], t[n])) : !1;
41
39
  }
42
- function f(e) {
43
- return Object.keys(e).reduce((o, t) => {
44
- const r = e[t];
45
- return Array.isArray(r) ? o[t] = r.map((i) => typeof i == "object" && i !== null ? f(i) : !0) : typeof r == "object" && r !== null ? o[t] = f(r) : o[t] = !0, o;
46
- }, {});
40
+ function l(e) {
41
+ return Object.keys(e).reduce((t, n) => {
42
+ let r = e[n];
43
+ return Array.isArray(r) ? t[n] = r.map((e) => typeof e == "object" && e ? l(e) : !0) : typeof r == "object" && r ? t[n] = l(r) : t[n] = !0, t;
44
+ }, {});
47
45
  }
48
- export {
49
- j as createDefaultFieldValues,
50
- x as getConfigurationByType,
51
- d as hasVisibleErrors,
52
- f as markAllTouched
53
- };
46
+ export { o as createDefaultFieldValues, s as getConfigurationByType, c as hasVisibleErrors, l as markAllTouched };
@@ -1,5 +1,2 @@
1
- import { MetadataFieldList as e, MetadataFieldList as d } from "./metadata-field-list.js";
2
- export {
3
- e as MetadataFieldList,
4
- d as MetadataFieldListDefault
5
- };
1
+ import { t as e } from "../../../../chunks/metadata-field-list.js";
2
+ export { e as MetadataFieldList, e as MetadataFieldListDefault };
@@ -1,279 +1,2 @@
1
- import { useSensors as re, useSensor as M, PointerSensor as oe, TouchSensor as ne, KeyboardSensor as le, DndContext as ie, closestCenter as ae, DragOverlay as ce } from "@dnd-kit/core";
2
- import { sortableKeyboardCoordinates as se, arrayMove as K, SortableContext as de, verticalListSortingStrategy as ue, useSortable as me } from "@dnd-kit/sortable";
3
- import { CSS as pe } from "@dnd-kit/utilities";
4
- import fe from "lodash/cloneDeep";
5
- import P from "lodash/uniqueId";
6
- import ge from "clsx";
7
- import * as he from "yup";
8
- import { forwardRef as ye, useRef as w, useEffect as v, useState as G, useImperativeHandle as Ie, useCallback as s } from "react";
9
- import { useIntl as ve } from "react-intl";
10
- import { Accordion as q } from "@box/blueprint-web";
11
- import { general as Se } from "../metadata-field-configurator/messages/configurator-messages.js";
12
- import { TaxonomyOptionsContext as De } from "../metadata-field-configurator/context/taxonomy-options-context.js";
13
- import { FieldExtensionsContext as xe } from "../metadata-field-configurator/context/field-extensions-context.js";
14
- import { useTaxonomyFetch as Te } from "../metadata-field-configurator/hooks/useTaxonomyFetch.js";
15
- import { F as j } from "../../../../chunks/types.js";
16
- import { jsx as l, jsxs as _e } from "react/jsx-runtime";
17
- import { useTemplateFieldSchema as Fe } from "../metadata-field-configurator/hooks/useTemplateFieldSchema.js";
18
- import { FieldTypeIcon as we } from "../../utils/field-options/field-type-icon.js";
19
- import { MetadataFieldConfigurator as Ee } from "../metadata-field-configurator/metadata-field-configurator.js";
20
- import '../../../../styles/metadata-field-list.css';const be = "_fieldList_18x5c_1", Re = "_fieldItem_18x5c_11", Ae = "_dragging_18x5c_11", Ce = "_accordionRootContainer_18x5c_15", E = {
21
- fieldList: be,
22
- fieldItem: Re,
23
- dragging: Ae,
24
- accordionRootContainer: Ce
25
- }, Ne = 150;
26
- function a(h) {
27
- return h.id;
28
- }
29
- const H = 150;
30
- function Le({
31
- field: h,
32
- index: r,
33
- maxIndex: i,
34
- isExpanded: S,
35
- onChangeField: D,
36
- onDeleteAtIndex: b,
37
- onDuplicateAtIndex: R,
38
- onReorderFields: x,
39
- onRequestExpand: y,
40
- submitAttemptCount: T
41
- }) {
42
- const c = a(h), {
43
- attributes: A,
44
- listeners: C,
45
- setNodeRef: N,
46
- transform: d,
47
- transition: u,
48
- isDragging: _
49
- } = me({
50
- id: c
51
- }), F = {
52
- transform: pe.Translate.toString(d),
53
- transition: u
54
- };
55
- return /* @__PURE__ */ l("li", {
56
- ref: N,
57
- style: F,
58
- "data-field-id": c,
59
- className: ge(E.fieldItem, {
60
- [E.dragging]: _
61
- }),
62
- children: /* @__PURE__ */ l(Ee, {
63
- values: h,
64
- onValuesChange: D,
65
- index: r,
66
- maxIndex: i,
67
- onDelete: () => b(r),
68
- onDuplicate: () => R(r),
69
- onReorderFields: x,
70
- dndDragHandleProps: {
71
- listeners: C,
72
- attributes: A
73
- },
74
- isExpanded: S,
75
- onExpandedChange: (m) => {
76
- m && y();
77
- },
78
- submitAttemptCount: T
79
- })
80
- });
81
- }
82
- const Ze = /* @__PURE__ */ ye(function({
83
- fields: r,
84
- onChangeFields: i,
85
- onDeleteFieldAtIndex: S,
86
- onDuplicateField: D,
87
- taxonomyOptions: b,
88
- fetchTaxonomies: R,
89
- firstInvalidFieldIndex: x,
90
- submitAttemptCount: y,
91
- fieldExtensions: T,
92
- onValidationChange: c
93
- }, A) {
94
- const {
95
- formatMessage: C
96
- } = ve(), N = Te(R, b), d = w(null), u = w(null), _ = w(new Set(r.map((e) => a(e)))), F = Fe(), m = w(null);
97
- v(() => {
98
- m.current = null;
99
- }, [c]), v(() => {
100
- if (!c)
101
- return;
102
- let e = !1;
103
- const t = setTimeout(() => {
104
- he.array().of(F).validate(r, {
105
- abortEarly: !0
106
- }).then(() => {
107
- e || m.current === !0 || (m.current = !0, c(!0));
108
- }).catch(() => {
109
- e || m.current === !1 || (m.current = !1, c(!1));
110
- });
111
- }, Ne);
112
- return () => {
113
- e = !0, clearTimeout(t);
114
- };
115
- }, [r, F, c]);
116
- const [p, f] = G(() => {
117
- const e = r.find((t) => t.isFieldNew);
118
- return e ? a(e) : null;
119
- });
120
- Ie(A, () => ({
121
- scrollToAndExpand(e) {
122
- u.current = e, p === e ? (u.current = null, setTimeout(() => {
123
- d.current?.querySelector(`[data-field-id="${e}"]`)?.scrollIntoView({
124
- behavior: "smooth",
125
- block: "nearest"
126
- });
127
- }, 0)) : f(e);
128
- }
129
- }), [p]), v(() => {
130
- r.forEach((e) => {
131
- const t = a(e);
132
- _.current.has(t) || (_.current.add(t), u.current = t, f(t));
133
- });
134
- }, [r]), v(() => {
135
- if (x == null || !y)
136
- return;
137
- const e = r[x];
138
- if (!e)
139
- return;
140
- const t = a(e);
141
- f(t), requestAnimationFrame(() => {
142
- d.current?.querySelector(`[data-field-id="${t}"]`)?.scrollIntoView({
143
- behavior: "smooth",
144
- block: "nearest"
145
- });
146
- });
147
- }, [y]), v(() => {
148
- const e = u.current;
149
- if (!e || e !== p)
150
- return;
151
- u.current = null;
152
- const t = setTimeout(() => {
153
- d.current?.querySelector(`[data-field-id="${e}"]`)?.scrollIntoView({
154
- behavior: "smooth",
155
- block: "nearest"
156
- });
157
- }, H);
158
- return () => clearTimeout(t);
159
- }, [p]);
160
- const [k, L] = G(null), z = re(M(oe, {
161
- activationConstraint: {
162
- distance: 8
163
- }
164
- }), M(ne, {
165
- activationConstraint: {
166
- delay: 250,
167
- tolerance: 5
168
- }
169
- }), M(le, {
170
- coordinateGetter: se
171
- })), B = s((e) => {
172
- L(String(e.active.id));
173
- }, []), U = s((e) => {
174
- L(null);
175
- const {
176
- active: t,
177
- over: o
178
- } = e;
179
- if (o && t.id !== o.id) {
180
- const n = r.findIndex((O) => a(O) === t.id), g = r.findIndex((O) => a(O) === o.id);
181
- n !== -1 && g !== -1 && i?.(K(r, n, g));
182
- }
183
- }, [r, i]), Y = s(() => {
184
- L(null);
185
- }, []), J = s((e, t) => {
186
- i?.(r.map((o, n) => n === e ? t : o));
187
- }, [r, i]), Q = s((e) => {
188
- const t = r[e], o = a(t);
189
- f((n) => n === o ? null : n), i?.(r.filter((n, g) => g !== e)), S?.(e, t);
190
- }, [r, i, S]), W = s((e) => {
191
- const t = r[e], o = fe(t);
192
- o.id = P("field-"), o.key = "", o.isFieldNew = !0, o.type === j.Dropdown && (o.dropdown.options = o.dropdown.options.map((g) => ({
193
- ...g,
194
- id: P()
195
- })));
196
- const n = [...r];
197
- n.splice(e + 1, 0, o), i?.(n), D?.(o);
198
- }, [r, i, D]), X = s((e, t) => {
199
- t < 0 || t >= r.length || i?.(K(r, e, t));
200
- }, [r, i]), Z = s((e) => {
201
- const t = e || null;
202
- f(t), t && setTimeout(() => {
203
- d.current?.querySelector(`[data-field-id="${t}"]`)?.scrollIntoView({
204
- behavior: "smooth",
205
- block: "nearest"
206
- });
207
- }, H);
208
- }, []), ee = r.map((e) => a(e)), I = k ? r.find((e) => a(e) === k) : null, V = I ? we(I.type) : null, te = I ? ((e) => {
209
- const t = e.name || C(Se.fieldNameInputPlaceholder);
210
- if (e.type === j.Dropdown) {
211
- const o = e.dropdown?.options?.length ?? 0;
212
- return `${t} (${o})`;
213
- }
214
- return t;
215
- })(I) : "", $ = /* @__PURE__ */ l(De.Provider, {
216
- value: N,
217
- children: /* @__PURE__ */ _e(ie, {
218
- sensors: z,
219
- collisionDetection: ae,
220
- onDragStart: B,
221
- onDragEnd: U,
222
- onDragCancel: Y,
223
- children: [/* @__PURE__ */ l("div", {
224
- className: E.accordionRootContainer,
225
- children: /* @__PURE__ */ l(q, {
226
- type: "single",
227
- collapsible: !0,
228
- value: p ?? "",
229
- onValueChange: Z,
230
- children: /* @__PURE__ */ l(de, {
231
- items: ee,
232
- strategy: ue,
233
- children: /* @__PURE__ */ l("ul", {
234
- ref: d,
235
- className: E.fieldList,
236
- children: r.map((e, t) => {
237
- const o = a(e);
238
- return /* @__PURE__ */ l(Le, {
239
- field: e,
240
- index: t,
241
- maxIndex: r.length - 1,
242
- isExpanded: p === o,
243
- onChangeField: (n) => J(t, n),
244
- onDeleteAtIndex: Q,
245
- onDuplicateAtIndex: W,
246
- onReorderFields: X,
247
- onRequestExpand: () => f(o),
248
- submitAttemptCount: y
249
- }, o);
250
- })
251
- })
252
- })
253
- })
254
- }), /* @__PURE__ */ l(ce, {
255
- dropAnimation: null,
256
- children: I && V ? /* @__PURE__ */ l(q, {
257
- type: "single",
258
- children: /* @__PURE__ */ l(q.Item, {
259
- value: "ghost",
260
- title: te,
261
- startElement: /* @__PURE__ */ l(V, {
262
- fontSize: "20px",
263
- role: "presentation"
264
- }),
265
- children: null
266
- })
267
- }) : null
268
- })]
269
- })
270
- });
271
- return T !== void 0 ? /* @__PURE__ */ l(xe.Provider, {
272
- value: T,
273
- children: $
274
- }) : $;
275
- });
276
- export {
277
- Ze as MetadataFieldList,
278
- Ze as default
279
- };
1
+ import { t as e } from "../../../../chunks/metadata-field-list.js";
2
+ export { e as MetadataFieldList, e as default };