@box/metadata-template-editor 2.2.20 → 2.2.21
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.
|
@@ -1,131 +1,137 @@
|
|
|
1
1
|
import { t as e } from "./field-selector.js";
|
|
2
2
|
import { t } from "./field-type-dropdown.js";
|
|
3
|
-
import { FieldTypeTiles as
|
|
4
|
-
import { createDefaultFieldValues as
|
|
5
|
-
import { FieldExtensionsContext as
|
|
6
|
-
import { t as
|
|
7
|
-
import
|
|
8
|
-
import { Button as
|
|
9
|
-
import { FormattedMessage as
|
|
10
|
-
import { Fragment as
|
|
11
|
-
import { useEffect as
|
|
12
|
-
import
|
|
13
|
-
import { Form as
|
|
14
|
-
import { NoTemplates as
|
|
15
|
-
import '../styles/metadata-template-editor-form.css';var
|
|
3
|
+
import { FieldTypeTiles as n } from "../esm/lib/components/field-type-tiles/field-type-tiles.js";
|
|
4
|
+
import { createDefaultFieldValues as r } from "../esm/lib/components/metadata-field-configurator/utils.js";
|
|
5
|
+
import { FieldExtensionsContext as i } from "../esm/lib/components/metadata-field-configurator/context/field-extensions-context.js";
|
|
6
|
+
import { t as a } from "./metadata-field-list.js";
|
|
7
|
+
import o from "../esm/lib/messages.js";
|
|
8
|
+
import { Button as s, EmptyState as c, Link as l, Text as u, TextInput as d } from "@box/blueprint-web";
|
|
9
|
+
import { FormattedMessage as f, useIntl as p } from "react-intl";
|
|
10
|
+
import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
|
|
11
|
+
import { useEffect as _, useMemo as v, useRef as y } from "react";
|
|
12
|
+
import b from "clsx";
|
|
13
|
+
import { Form as x, useFormikContext as ee } from "formik";
|
|
14
|
+
import { NoTemplates as S } from "@box/blueprint-web-assets/illustrations/Medium";
|
|
15
|
+
import '../styles/metadata-template-editor-form.css';var C = {
|
|
16
16
|
form: "_form_1f0e7_1",
|
|
17
17
|
loading: "_loading_1f0e7_10",
|
|
18
18
|
fields: "_fields_1f0e7_17",
|
|
19
19
|
emptyFields: "_emptyFields_1f0e7_23",
|
|
20
20
|
actions: "_actions_1f0e7_28",
|
|
21
21
|
fieldsHeader: "_fieldsHeader_1f0e7_35"
|
|
22
|
-
},
|
|
23
|
-
let
|
|
24
|
-
|
|
25
|
-
|
|
22
|
+
}, w = "bodyDefaultBold", T = "h2", E = "https://developer.box.com/guides/metadata/fields/", D = ({ formId: D, onCancel: O, taxonomyOptions: k, fetchTaxonomies: A, hideActions: te, isEditMode: ne, readOnly: j = !1, onDirtyStateChange: M, onValidationChange: N, fieldExtensions: P }) => {
|
|
23
|
+
let F = p(), { errors: I, values: L, setFieldValue: R, setFieldTouched: z, isSubmitting: B, isValid: V, handleChange: H, submitCount: U, dirty: W, touched: G } = ee(), K = y(null), q = y(!1), J = () => {
|
|
24
|
+
q.current = !0;
|
|
25
|
+
}, Y = () => {
|
|
26
|
+
q.current && z("displayName", !0);
|
|
27
|
+
}, X = v(() => {
|
|
28
|
+
if (!Array.isArray(I.fields)) return null;
|
|
29
|
+
let e = I.fields.findIndex(Boolean);
|
|
26
30
|
return e >= 0 ? e : null;
|
|
27
|
-
}, [
|
|
28
|
-
let t =
|
|
29
|
-
|
|
30
|
-
},
|
|
31
|
-
|
|
31
|
+
}, [I.fields]), Z = (e) => {
|
|
32
|
+
let t = r(e.type);
|
|
33
|
+
R("fields", [...L.fields, t]);
|
|
34
|
+
}, re = (e) => {
|
|
35
|
+
R("fields", e);
|
|
32
36
|
};
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
}, [
|
|
36
|
-
|
|
37
|
-
}, [V,
|
|
38
|
-
let
|
|
39
|
-
Q =
|
|
37
|
+
_(() => {
|
|
38
|
+
M?.(W);
|
|
39
|
+
}, [W, M]), _(() => {
|
|
40
|
+
N?.(V);
|
|
41
|
+
}, [V, N]);
|
|
42
|
+
let ie = B || ne && !W, Q;
|
|
43
|
+
Q = j && L.fields.length === 0 ? /* @__PURE__ */ h(c, {
|
|
40
44
|
size: "large",
|
|
41
|
-
illustration:
|
|
42
|
-
body: /* @__PURE__ */
|
|
45
|
+
illustration: S,
|
|
46
|
+
body: /* @__PURE__ */ h(u, {
|
|
43
47
|
as: "p",
|
|
44
|
-
children:
|
|
48
|
+
children: F.formatMessage(o.noFields)
|
|
45
49
|
})
|
|
46
|
-
}) :
|
|
47
|
-
ref:
|
|
48
|
-
fields:
|
|
49
|
-
taxonomyOptions:
|
|
50
|
-
fetchTaxonomies:
|
|
50
|
+
}) : j ? /* @__PURE__ */ h(a, {
|
|
51
|
+
ref: K,
|
|
52
|
+
fields: L.fields,
|
|
53
|
+
taxonomyOptions: k,
|
|
54
|
+
fetchTaxonomies: A,
|
|
51
55
|
readOnly: !0
|
|
52
|
-
}) :
|
|
56
|
+
}) : L.fields.length === 0 ? /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(n, { onFieldAdd: Z }), /* @__PURE__ */ h(l, {
|
|
53
57
|
isExternal: !0,
|
|
54
|
-
className:
|
|
55
|
-
href:
|
|
58
|
+
className: C.fieldsLearnMoreLink,
|
|
59
|
+
href: E,
|
|
56
60
|
target: "_blank",
|
|
57
|
-
children: /* @__PURE__ */
|
|
58
|
-
})] }) : /* @__PURE__ */
|
|
59
|
-
ref:
|
|
60
|
-
fields:
|
|
61
|
-
taxonomyOptions:
|
|
62
|
-
fetchTaxonomies:
|
|
63
|
-
onChangeFields:
|
|
64
|
-
firstInvalidFieldIndex:
|
|
65
|
-
submitAttemptCount:
|
|
66
|
-
}), /* @__PURE__ */
|
|
67
|
-
let $ = /* @__PURE__ */
|
|
61
|
+
children: /* @__PURE__ */ h(f, { ...o.fieldsLearnMore })
|
|
62
|
+
})] }) : /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(a, {
|
|
63
|
+
ref: K,
|
|
64
|
+
fields: L.fields,
|
|
65
|
+
taxonomyOptions: k,
|
|
66
|
+
fetchTaxonomies: A,
|
|
67
|
+
onChangeFields: re,
|
|
68
|
+
firstInvalidFieldIndex: X,
|
|
69
|
+
submitAttemptCount: U
|
|
70
|
+
}), /* @__PURE__ */ h(t, { onFieldAdd: Z })] });
|
|
71
|
+
let $ = /* @__PURE__ */ g(x, {
|
|
68
72
|
noValidate: !0,
|
|
69
|
-
id:
|
|
70
|
-
className:
|
|
73
|
+
id: D,
|
|
74
|
+
className: C.form,
|
|
71
75
|
children: [
|
|
72
|
-
/* @__PURE__ */
|
|
73
|
-
className:
|
|
74
|
-
children: /* @__PURE__ */
|
|
76
|
+
/* @__PURE__ */ h("div", {
|
|
77
|
+
className: C.templateInfo,
|
|
78
|
+
children: /* @__PURE__ */ h(d, {
|
|
75
79
|
name: "displayName",
|
|
76
|
-
label:
|
|
77
|
-
placeholder:
|
|
78
|
-
value:
|
|
79
|
-
error: !
|
|
80
|
+
label: F.formatMessage(o.templateName),
|
|
81
|
+
placeholder: F.formatMessage(o.templateNameDescription),
|
|
82
|
+
value: L.displayName,
|
|
83
|
+
error: !j && G.displayName && I.displayName ? I.displayName : void 0,
|
|
80
84
|
onChange: (e) => {
|
|
81
|
-
|
|
85
|
+
H(e);
|
|
82
86
|
},
|
|
83
|
-
|
|
84
|
-
|
|
87
|
+
onPointerDown: J,
|
|
88
|
+
onKeyDown: J,
|
|
89
|
+
onBlur: Y,
|
|
90
|
+
readOnly: j
|
|
85
91
|
})
|
|
86
92
|
}),
|
|
87
|
-
/* @__PURE__ */
|
|
88
|
-
className:
|
|
89
|
-
children: [/* @__PURE__ */
|
|
90
|
-
as:
|
|
91
|
-
variant:
|
|
92
|
-
children: /* @__PURE__ */
|
|
93
|
-
}),
|
|
94
|
-
fields:
|
|
95
|
-
onSelect: (e) =>
|
|
93
|
+
/* @__PURE__ */ g("div", {
|
|
94
|
+
className: C.fieldsHeader,
|
|
95
|
+
children: [/* @__PURE__ */ h(u, {
|
|
96
|
+
as: T,
|
|
97
|
+
variant: w,
|
|
98
|
+
children: /* @__PURE__ */ h(f, { ...!j && L.fields.length === 0 ? o.fieldsAddFirst : o.fields })
|
|
99
|
+
}), L.fields.length > 0 && /* @__PURE__ */ h(e, {
|
|
100
|
+
fields: L.fields,
|
|
101
|
+
onSelect: (e) => K.current?.scrollToAndExpand(e)
|
|
96
102
|
})]
|
|
97
103
|
}),
|
|
98
|
-
/* @__PURE__ */
|
|
99
|
-
className:
|
|
104
|
+
/* @__PURE__ */ h("div", {
|
|
105
|
+
className: b(C.fields, { [C.emptyFields]: L.fields.length === 0 && j }),
|
|
100
106
|
children: Q
|
|
101
107
|
}),
|
|
102
|
-
!
|
|
103
|
-
className:
|
|
104
|
-
children:
|
|
108
|
+
!te && /* @__PURE__ */ h("div", {
|
|
109
|
+
className: C.actions,
|
|
110
|
+
children: j ? O && /* @__PURE__ */ h(s, {
|
|
105
111
|
variant: "primary",
|
|
106
112
|
type: "button",
|
|
107
|
-
onClick:
|
|
108
|
-
children:
|
|
109
|
-
}) : /* @__PURE__ */
|
|
113
|
+
onClick: O,
|
|
114
|
+
children: F.formatMessage(o.close)
|
|
115
|
+
}) : /* @__PURE__ */ g(m, { children: [O && /* @__PURE__ */ h(s, {
|
|
110
116
|
variant: "secondary",
|
|
111
117
|
type: "button",
|
|
112
|
-
onClick:
|
|
118
|
+
onClick: O,
|
|
113
119
|
loading: B,
|
|
114
120
|
disabled: B,
|
|
115
|
-
loadingAriaLabel:
|
|
116
|
-
children:
|
|
117
|
-
}), /* @__PURE__ */
|
|
121
|
+
loadingAriaLabel: F.formatMessage(o.submitting),
|
|
122
|
+
children: F.formatMessage(o.cancel)
|
|
123
|
+
}), /* @__PURE__ */ h(s, {
|
|
118
124
|
variant: "primary",
|
|
119
125
|
type: "submit",
|
|
120
|
-
disabled:
|
|
121
|
-
children:
|
|
126
|
+
disabled: ie,
|
|
127
|
+
children: F.formatMessage(o.save)
|
|
122
128
|
})] })
|
|
123
129
|
})
|
|
124
130
|
]
|
|
125
131
|
});
|
|
126
|
-
return
|
|
127
|
-
value:
|
|
132
|
+
return P === void 0 ? $ : /* @__PURE__ */ h(i.Provider, {
|
|
133
|
+
value: P,
|
|
128
134
|
children: $
|
|
129
135
|
});
|
|
130
136
|
};
|
|
131
|
-
export {
|
|
137
|
+
export { D as t };
|