@box/metadata-editor 0.120.22 → 0.121.0
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.
- package/dist/esm/lib/components/metadata-instance-editor/subcomponents/metadata-instance-form-autofill-button/metadata-instance-form-autofill-button.js +86 -85
- package/dist/esm/lib/components/metadata-instance-list/subcomponents/metadata-instance-header/metadata-instance-header.js +24 -24
- package/dist/types/lib/components/metadata-instance-editor/subcomponents/metadata-instance-form-autofill-button/types.d.ts +1 -0
- package/package.json +4 -4
@@ -1,120 +1,121 @@
|
|
1
|
-
import { Tooltip as
|
2
|
-
import {
|
3
|
-
import {
|
4
|
-
import {
|
5
|
-
import {
|
6
|
-
import {
|
7
|
-
import {
|
8
|
-
import {
|
9
|
-
import {
|
10
|
-
import {
|
11
|
-
import { getTooltipContent as z } from "../../../../utils/utils.js";
|
1
|
+
import { Tooltip as N, Button as R, LoadingIndicator as k, IconButton as v, SplitButton as x, DropdownMenu as G, Text as D } from "@box/blueprint-web";
|
2
|
+
import { BoxAiAdvancedLogo24 as K, BoxAiLogo24 as O } from "@box/blueprint-web-assets/icons/Logo";
|
3
|
+
import { useLocalStorageAIAgents as j } from "@box/box-ai-agent-selector";
|
4
|
+
import { useFormikContext as w, getIn as p } from "formik";
|
5
|
+
import { useEffect as F, useMemo as P, forwardRef as Y, useState as V } from "react";
|
6
|
+
import { useIntl as E } from "react-intl";
|
7
|
+
import { EXTRACT_AI_AGENT_LOCAL_STORAGE_KEY as X, EXTRACT_AGENTS_MAP as S } from "../../../../constants.js";
|
8
|
+
import { autofillMessages as q } from "../../../../messages.js";
|
9
|
+
import { useAutofill as z } from "../../../../utils/autofill-context.js";
|
10
|
+
import { getTooltipContent as H } from "../../../../utils/utils.js";
|
12
11
|
import g from "./messages.js";
|
13
|
-
import { jsx as
|
14
|
-
import '../../../../../../styles/metadata-instance-form-autofill-button.css';const
|
15
|
-
loadingIndicator:
|
16
|
-
actionMenuItem:
|
17
|
-
splitButtonIcon:
|
18
|
-
},
|
12
|
+
import { jsx as t, jsxs as J } from "react/jsx-runtime";
|
13
|
+
import '../../../../../../styles/metadata-instance-form-autofill-button.css';const Q = "_loadingIndicator_i1hyy_1", U = "_actionMenuItem_i1hyy_11", W = "_splitButtonIcon_i1hyy_17", T = {
|
14
|
+
loadingIndicator: Q,
|
15
|
+
actionMenuItem: U,
|
16
|
+
splitButtonIcon: W
|
17
|
+
}, Z = /* @__PURE__ */ Y(({
|
19
18
|
isButtonDisabled: I,
|
20
19
|
onAutofill: A,
|
21
|
-
onAgentChange:
|
20
|
+
onAgentChange: m,
|
22
21
|
storedAgent: B,
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
22
|
+
icon: n,
|
23
|
+
..._
|
24
|
+
}, h) => {
|
25
|
+
const a = E(), [d, i] = V(B || "standard"), r = (o) => {
|
26
|
+
i(o), m(o), setTimeout(() => {
|
27
|
+
A(o);
|
28
28
|
}, 0);
|
29
29
|
};
|
30
|
-
return /* @__PURE__ */
|
31
|
-
...
|
32
|
-
ref:
|
30
|
+
return /* @__PURE__ */ t(x, {
|
31
|
+
..._,
|
32
|
+
ref: h,
|
33
33
|
disabled: I,
|
34
34
|
dropdownTriggerAriaLabel: "See agent options.",
|
35
|
-
icon:
|
36
|
-
label:
|
35
|
+
icon: n,
|
36
|
+
label: a.formatMessage(g.autofillButton),
|
37
37
|
onClick: () => A(),
|
38
38
|
variant: "secondary",
|
39
|
-
children: /* @__PURE__ */
|
40
|
-
onValueChange: (
|
41
|
-
value:
|
42
|
-
children: Object.entries(
|
43
|
-
const
|
44
|
-
return /* @__PURE__ */
|
45
|
-
value:
|
46
|
-
children: /* @__PURE__ */
|
47
|
-
className:
|
48
|
-
children: [/* @__PURE__ */
|
39
|
+
children: /* @__PURE__ */ t(G.RadioGroup, {
|
40
|
+
onValueChange: (o) => r(o),
|
41
|
+
value: d,
|
42
|
+
children: Object.entries(S).map(([o, e]) => {
|
43
|
+
const l = e.ICON;
|
44
|
+
return /* @__PURE__ */ t(G.RadioSelectItem, {
|
45
|
+
value: e.AGENT_TYPE,
|
46
|
+
children: /* @__PURE__ */ J("div", {
|
47
|
+
className: T.actionMenuItem,
|
48
|
+
children: [/* @__PURE__ */ t(l, {
|
49
49
|
"aria-hidden": !0,
|
50
|
-
className:
|
51
|
-
}), /* @__PURE__ */
|
50
|
+
className: T.splitButtonIcon
|
51
|
+
}), /* @__PURE__ */ t(D, {
|
52
52
|
as: "span",
|
53
|
-
children:
|
53
|
+
children: a.formatMessage(g[e.DISPLAY_MSG])
|
54
54
|
})]
|
55
55
|
})
|
56
|
-
},
|
56
|
+
}, o);
|
57
57
|
})
|
58
58
|
})
|
59
59
|
});
|
60
60
|
}), mt = ({
|
61
61
|
areAiSuggestionsAvailable: I,
|
62
62
|
isBetaLanguageEnabled: A,
|
63
|
-
isLoading:
|
63
|
+
isLoading: m,
|
64
64
|
variant: B = "secondary-button",
|
65
|
-
isAdvancedExtractAgentEnabled:
|
65
|
+
isAdvancedExtractAgentEnabled: n = !1,
|
66
66
|
onAutofill: _
|
67
67
|
}) => {
|
68
68
|
const {
|
69
|
-
isSubmitting:
|
70
|
-
values:
|
69
|
+
isSubmitting: h,
|
70
|
+
values: a,
|
71
71
|
setFieldValue: d
|
72
|
-
} =
|
73
|
-
suggestions:
|
74
|
-
} =
|
75
|
-
|
76
|
-
if (
|
77
|
-
const
|
78
|
-
d("metadata.fields",
|
79
|
-
var
|
80
|
-
const f = (
|
72
|
+
} = w(), i = E(), [r, o] = j(X), {
|
73
|
+
suggestions: e
|
74
|
+
} = z();
|
75
|
+
F(() => {
|
76
|
+
if (e) {
|
77
|
+
const s = p(a, "metadata.fields"), C = p(a, "metadata.templateKey");
|
78
|
+
d("metadata.fields", s == null ? void 0 : s.map((c) => {
|
79
|
+
var u;
|
80
|
+
const f = (u = e == null ? void 0 : e[C]) == null ? void 0 : u[c.key];
|
81
81
|
return f ? {
|
82
|
-
...
|
82
|
+
...c,
|
83
83
|
aiSuggestion: f
|
84
|
-
} :
|
84
|
+
} : c;
|
85
85
|
}));
|
86
86
|
}
|
87
|
-
}, [
|
88
|
-
const
|
89
|
-
var
|
90
|
-
const
|
91
|
-
_(
|
92
|
-
},
|
93
|
-
return B === "secondary-button" ? /* @__PURE__ */
|
94
|
-
content:
|
95
|
-
children:
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
87
|
+
}, [e, d]);
|
88
|
+
const l = (s) => {
|
89
|
+
var u, L;
|
90
|
+
const C = p(a, "metadata.templateKey"), c = p(a, "metadata.scope"), f = s ? (u = S[s]) == null ? void 0 : u.AGENT_ID : (L = S[r]) == null ? void 0 : L.AGENT_ID;
|
91
|
+
_(C, c, n ? f : void 0);
|
92
|
+
}, M = !I || h || m, y = r === "enhanced" && n ? K : O, b = P(() => H(n, r, i), [n, r, i]);
|
93
|
+
return B === "secondary-button" ? /* @__PURE__ */ t(N, {
|
94
|
+
content: b,
|
95
|
+
children: n ? /* @__PURE__ */ t(Z, {
|
96
|
+
icon: y,
|
97
|
+
isButtonDisabled: M,
|
98
|
+
onAgentChange: o,
|
99
|
+
onAutofill: l,
|
100
|
+
storedAgent: r
|
101
|
+
}) : /* @__PURE__ */ t(R, {
|
102
|
+
disabled: M,
|
103
|
+
icon: y,
|
104
|
+
onClick: () => l(),
|
104
105
|
variant: "secondary",
|
105
106
|
"data-target-id": "Button-autofillButton",
|
106
|
-
children:
|
107
|
+
children: i.formatMessage(g.autofillButton)
|
107
108
|
})
|
108
|
-
}) : /* @__PURE__ */
|
109
|
-
content:
|
110
|
-
children:
|
111
|
-
"aria-label":
|
112
|
-
className:
|
113
|
-
}) : /* @__PURE__ */
|
114
|
-
"aria-label":
|
115
|
-
disabled:
|
116
|
-
icon:
|
117
|
-
onClick: () =>
|
109
|
+
}) : /* @__PURE__ */ t(N, {
|
110
|
+
content: b,
|
111
|
+
children: m ? /* @__PURE__ */ t(k, {
|
112
|
+
"aria-label": i.formatMessage(g.loadingButtonAriaLabel),
|
113
|
+
className: T.loadingIndicator
|
114
|
+
}) : /* @__PURE__ */ t(v, {
|
115
|
+
"aria-label": i.formatMessage(q.autofillButtonAriaLabel),
|
116
|
+
disabled: M,
|
117
|
+
icon: y,
|
118
|
+
onClick: () => l(),
|
118
119
|
variant: "icon-logo",
|
119
120
|
"data-target-id": "IconButton-autofillButtonAriaLabel"
|
120
121
|
})
|
@@ -1,53 +1,53 @@
|
|
1
|
-
import { Tooltip as
|
1
|
+
import { Tooltip as c, IconButton as l } from "@box/blueprint-web";
|
2
2
|
import { Pencil as A } from "@box/blueprint-web-assets/icons/Line";
|
3
|
-
import {
|
3
|
+
import { BoxAiAdvancedLogo24 as C, BoxAiLogo24 as L } from "@box/blueprint-web-assets/icons/Logo";
|
4
4
|
import { useLocalStorageAIAgents as b } from "@box/box-ai-agent-selector";
|
5
|
-
import { useMemo as
|
5
|
+
import { useMemo as h } from "react";
|
6
6
|
import { useIntl as M } from "react-intl";
|
7
|
-
import { EXTRACT_AI_AGENT_LOCAL_STORAGE_KEY as
|
8
|
-
import { autofillMessages as
|
9
|
-
import { getTooltipContent as
|
10
|
-
import
|
7
|
+
import { EXTRACT_AI_AGENT_LOCAL_STORAGE_KEY as H, EXTRACT_AGENTS_MAP as N } from "../../../../constants.js";
|
8
|
+
import { autofillMessages as G } from "../../../../messages.js";
|
9
|
+
import { getTooltipContent as v } from "../../../../utils/utils.js";
|
10
|
+
import x from "../../../interactive-header-text/interactive-header-text.js";
|
11
11
|
import i from "./messages.js";
|
12
12
|
import { jsxs as m, jsx as o } from "react/jsx-runtime";
|
13
|
-
import '../../../../../../styles/metadata-instance-header.css';const
|
14
|
-
metadataInstanceHeader:
|
15
|
-
iconButtonsContainer:
|
16
|
-
title:
|
17
|
-
},
|
13
|
+
import '../../../../../../styles/metadata-instance-header.css';const R = "_metadataInstanceHeader_17bsu_1", S = "_iconButtonsContainer_17bsu_6", j = "_title_17bsu_14", s = {
|
14
|
+
metadataInstanceHeader: R,
|
15
|
+
iconButtonsContainer: S,
|
16
|
+
title: j
|
17
|
+
}, F = ({
|
18
18
|
areAiSuggestionsAvailable: u,
|
19
19
|
canEdit: d,
|
20
20
|
isAiSuggestionsFeatureEnabled: f,
|
21
|
-
isBetaLanguageEnabled:
|
21
|
+
isBetaLanguageEnabled: k,
|
22
22
|
onEdit: _,
|
23
23
|
onAutofill: p,
|
24
24
|
templateName: e,
|
25
25
|
isAdvancedExtractAgentEnabled: a = !1
|
26
26
|
}) => {
|
27
27
|
var r;
|
28
|
-
const t = M(), B = e || t.formatMessage(i.customInstanceTitle),
|
28
|
+
const t = M(), B = e || t.formatMessage(i.customInstanceTitle), g = f && e, [n] = b(H), I = a && ((r = N[n]) == null ? void 0 : r.AGENT_ID), T = h(() => v(a, n, t), [a, n, t]);
|
29
29
|
return /* @__PURE__ */ m("div", {
|
30
30
|
className: s.metadataInstanceHeader,
|
31
|
-
children: [/* @__PURE__ */ o(
|
31
|
+
children: [/* @__PURE__ */ o(x, {
|
32
32
|
className: s.title,
|
33
33
|
title: B
|
34
34
|
}), d && /* @__PURE__ */ m("div", {
|
35
35
|
className: s.iconButtonsContainer,
|
36
|
-
children: [
|
37
|
-
content:
|
38
|
-
children: /* @__PURE__ */ o(
|
39
|
-
"aria-label": t.formatMessage(
|
36
|
+
children: [g && /* @__PURE__ */ o(c, {
|
37
|
+
content: T,
|
38
|
+
children: /* @__PURE__ */ o(l, {
|
39
|
+
"aria-label": t.formatMessage(G.autofillButtonAriaLabelWithTemplateName, {
|
40
40
|
templateName: e
|
41
41
|
}),
|
42
42
|
disabled: !u,
|
43
|
-
icon: C,
|
44
|
-
onClick: () => p(
|
43
|
+
icon: n === "enhanced" && a ? C : L,
|
44
|
+
onClick: () => p(I || void 0),
|
45
45
|
variant: "icon-logo",
|
46
46
|
"data-target-id": "IconButton-autofillButtonAriaLabelWithTemplateName"
|
47
47
|
})
|
48
|
-
}), /* @__PURE__ */ o(
|
48
|
+
}), /* @__PURE__ */ o(c, {
|
49
49
|
content: t.formatMessage(i.editButtonTooltip),
|
50
|
-
children: /* @__PURE__ */ o(
|
50
|
+
children: /* @__PURE__ */ o(l, {
|
51
51
|
"aria-label": t.formatMessage(i.editButtonAriaLabel, {
|
52
52
|
templateName: e
|
53
53
|
}),
|
@@ -60,5 +60,5 @@ import '../../../../../../styles/metadata-instance-header.css';const v = "_metad
|
|
60
60
|
});
|
61
61
|
};
|
62
62
|
export {
|
63
|
-
|
63
|
+
F as MetadataInstanceHeader
|
64
64
|
};
|
package/package.json
CHANGED
@@ -1,11 +1,11 @@
|
|
1
1
|
{
|
2
2
|
"name": "@box/metadata-editor",
|
3
|
-
"version": "0.
|
3
|
+
"version": "0.121.0",
|
4
4
|
"peerDependencies": {
|
5
5
|
"@ariakit/react": "0.4.15",
|
6
6
|
"@box/box-ai-agent-selector": "^0.41.7",
|
7
7
|
"@box/blueprint-web": "^7.30.3",
|
8
|
-
"@box/blueprint-web-assets": "^4.
|
8
|
+
"@box/blueprint-web-assets": "^4.59.1",
|
9
9
|
"@box/combobox-with-api": "^0.26.0",
|
10
10
|
"formik": "^2.0.3",
|
11
11
|
"lodash": "^4.17.15",
|
@@ -15,9 +15,9 @@
|
|
15
15
|
},
|
16
16
|
"devDependencies": {
|
17
17
|
"@ariakit/react": "0.4.15",
|
18
|
-
"@box/box-ai-agent-selector": "^0.48.
|
18
|
+
"@box/box-ai-agent-selector": "^0.48.6",
|
19
19
|
"@box/babel-plugin-target-attributes": "1.3.0",
|
20
|
-
"@box/blueprint-web": "^12.
|
20
|
+
"@box/blueprint-web": "^12.38.0",
|
21
21
|
"@box/blueprint-web-assets": "^4.60.0",
|
22
22
|
"@box/storybook-utils": "^0.13.14",
|
23
23
|
"@testing-library/react": "^15.0.6",
|