@box/metadata-editor 0.78.3 → 0.78.5
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,88 +1,95 @@
|
|
|
1
1
|
import "../../../../styles/filter-instances-dropdown.css";
|
|
2
|
-
import { TriggerButton as v, Text as
|
|
3
|
-
import { useIntl as
|
|
4
|
-
import { SelectProvider as
|
|
2
|
+
import { TriggerButton as v, Text as C, ScrollableContainer as N, Divider as w } from "@box/blueprint-web";
|
|
3
|
+
import { useIntl as x } from "react-intl";
|
|
4
|
+
import { SelectProvider as B, Select as b, SelectPopover as I, SelectItem as d, SelectItemCheck as k } from "@ariakit/react";
|
|
5
5
|
import { Space1 as M } from "@box/blueprint-web-assets/tokens/px-tokens";
|
|
6
6
|
import { useEffect as S } from "react";
|
|
7
|
-
import
|
|
8
|
-
import { Checkmark as
|
|
9
|
-
import { getVisibleTemplates as
|
|
10
|
-
import
|
|
11
|
-
import { jsxs as
|
|
12
|
-
const
|
|
13
|
-
details:
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
7
|
+
import y from "clsx";
|
|
8
|
+
import { Checkmark as p } from "@box/blueprint-web-assets/icons/Fill";
|
|
9
|
+
import { getVisibleTemplates as D, getTemplateDisplayName as _ } from "../../utils/utils.js";
|
|
10
|
+
import s from "./messages.js";
|
|
11
|
+
import { jsxs as o, jsx as e } from "react/jsx-runtime";
|
|
12
|
+
const j = "_details_w5gf4_1", F = "_triggerContainer_w5gf4_5", O = "_triggerButton_w5gf4_10", P = "_popover_w5gf4_15", L = "_divider_w5gf4_32", V = "_scrollableContainer_w5gf4_35", z = "_item_w5gf4_39", E = "_indicator_w5gf4_66", G = "_indicatorIcon_w5gf4_75", R = "_testContainer_w5gf4_79", t = {
|
|
13
|
+
details: j,
|
|
14
|
+
triggerContainer: F,
|
|
15
|
+
triggerButton: O,
|
|
16
|
+
popover: P,
|
|
17
|
+
divider: L,
|
|
18
|
+
scrollableContainer: V,
|
|
19
|
+
item: z,
|
|
20
|
+
indicator: E,
|
|
21
|
+
indicatorIcon: G,
|
|
22
|
+
testContainer: R
|
|
23
|
+
}, q = parseInt(M, 10);
|
|
24
|
+
function tt({
|
|
25
|
+
appliedTemplates: f,
|
|
26
|
+
selectedTemplates: c,
|
|
27
|
+
setSelectedTemplates: l
|
|
25
28
|
}) {
|
|
26
|
-
const
|
|
27
|
-
selectedTemplatesNumber:
|
|
29
|
+
const a = x(), g = a.formatMessage(s.customMetadataName), n = D(f), i = c.length, m = n.length, u = i === 0 ? a.formatMessage(s.allTemplatesTriggerButtonText) : a.formatMessage(s.selectedTemplatesTriggerButtonText, {
|
|
30
|
+
selectedTemplatesNumber: i,
|
|
28
31
|
visibleTemplatesNumber: m
|
|
29
|
-
}),
|
|
30
|
-
|
|
32
|
+
}), h = () => {
|
|
33
|
+
l([]);
|
|
31
34
|
};
|
|
32
35
|
return S(() => {
|
|
33
|
-
|
|
34
|
-
}, [
|
|
35
|
-
setValue:
|
|
36
|
-
value:
|
|
37
|
-
children: [/* @__PURE__ */
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
36
|
+
i === m && l([]);
|
|
37
|
+
}, [i, m]), /* @__PURE__ */ o(B, {
|
|
38
|
+
setValue: l,
|
|
39
|
+
value: c,
|
|
40
|
+
children: [/* @__PURE__ */ o("div", {
|
|
41
|
+
className: t.triggerContainer,
|
|
42
|
+
children: [/* @__PURE__ */ e(b, {
|
|
43
|
+
render: /* @__PURE__ */ e(v, {
|
|
44
|
+
caretDirection: "down",
|
|
45
|
+
className: t.triggerButton,
|
|
46
|
+
label: u,
|
|
47
|
+
size: "small",
|
|
48
|
+
variant: "tertiary",
|
|
49
|
+
"data-target-id": "TriggerButton-allTemplatesTriggerButtonText|selectedTemplatesTriggerButtonText"
|
|
50
|
+
})
|
|
51
|
+
}), n.length > 0 && /* @__PURE__ */ e(C, {
|
|
52
|
+
as: "p",
|
|
53
|
+
className: t.details,
|
|
54
|
+
color: "textOnLightSecondary",
|
|
55
|
+
"data-testid": "detailsList",
|
|
56
|
+
variant: "caption",
|
|
57
|
+
children: n.filter((r) => c.some((T) => T === r.id)).map((r) => _(r, g)).join(", ")
|
|
58
|
+
})]
|
|
59
|
+
}), /* @__PURE__ */ e(I, {
|
|
60
|
+
className: t.popover,
|
|
61
|
+
gutter: q,
|
|
62
|
+
children: /* @__PURE__ */ o(N, {
|
|
63
|
+
className: t.scrollableContainer,
|
|
64
|
+
children: [/* @__PURE__ */ o(d, {
|
|
65
|
+
autoFocus: i === 0,
|
|
66
|
+
className: t.item,
|
|
60
67
|
hideOnClick: !0,
|
|
61
|
-
onClick:
|
|
62
|
-
children: [
|
|
63
|
-
className:
|
|
64
|
-
}),
|
|
65
|
-
}), /* @__PURE__ */
|
|
66
|
-
className:
|
|
67
|
-
}),
|
|
68
|
-
className:
|
|
68
|
+
onClick: h,
|
|
69
|
+
children: [i === 0 && /* @__PURE__ */ e(p, {
|
|
70
|
+
className: y(t.indicator, t.indicatorIcon)
|
|
71
|
+
}), a.formatMessage(s.allTemplatesTriggerButtonText)]
|
|
72
|
+
}), /* @__PURE__ */ e(w, {
|
|
73
|
+
className: t.divider
|
|
74
|
+
}), n.map((r) => /* @__PURE__ */ o(d, {
|
|
75
|
+
className: t.item,
|
|
69
76
|
hideOnClick: !0,
|
|
70
|
-
value:
|
|
71
|
-
children: [/* @__PURE__ */
|
|
72
|
-
className:
|
|
77
|
+
value: r.id,
|
|
78
|
+
children: [/* @__PURE__ */ e(k, {
|
|
79
|
+
className: t.indicator,
|
|
73
80
|
style: {
|
|
74
81
|
width: "none",
|
|
75
82
|
height: "none"
|
|
76
83
|
},
|
|
77
|
-
children: /* @__PURE__ */
|
|
78
|
-
className:
|
|
84
|
+
children: /* @__PURE__ */ e(p, {
|
|
85
|
+
className: t.indicatorIcon
|
|
79
86
|
})
|
|
80
|
-
}),
|
|
81
|
-
},
|
|
87
|
+
}), _(r, g)]
|
|
88
|
+
}, r.id))]
|
|
82
89
|
})
|
|
83
90
|
})]
|
|
84
91
|
});
|
|
85
92
|
}
|
|
86
93
|
export {
|
|
87
|
-
|
|
94
|
+
tt as FilterInstancesDropdown
|
|
88
95
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@box/metadata-editor",
|
|
3
|
-
"version": "0.78.
|
|
3
|
+
"version": "0.78.5",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@ariakit/react": "0.4.14",
|
|
6
6
|
"@box/blueprint-web": "^7.30.3",
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"devDependencies": {
|
|
15
15
|
"@ariakit/react": "0.4.14",
|
|
16
16
|
"@box/babel-plugin-target-attributes": "1.3.0",
|
|
17
|
-
"@box/blueprint-web": "^9.1.
|
|
17
|
+
"@box/blueprint-web": "^9.1.2",
|
|
18
18
|
"@box/blueprint-web-assets": "^4.30.0",
|
|
19
19
|
"@box/storybook-utils": "^0.7.0",
|
|
20
20
|
"@testing-library/react": "^15.0.6",
|
|
@@ -53,5 +53,5 @@
|
|
|
53
53
|
"**/*.css"
|
|
54
54
|
],
|
|
55
55
|
"license": "SEE LICENSE IN LICENSE",
|
|
56
|
-
"gitHead": "
|
|
56
|
+
"gitHead": "422c5a76116e547d351ab83cdab9d97b4d7ce621"
|
|
57
57
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._details_w5gf4_1{padding-inline:var(--size-1)}._triggerContainer_w5gf4_5{display:flex;flex-direction:column}._triggerButton_w5gf4_10{min-height:var(--size-6)!important;padding:0 var(--space-1)!important}._popover_w5gf4_15{font-weight:400;font-size:.875rem;font-family:Lato,-apple-system,BlinkMacSystemFont,San Francisco,Segoe UI,Roboto,Helvetica Neue,sans-serif;line-height:1.25rem;letter-spacing:.01875rem;text-transform:none;text-decoration:none;z-index:var(--z-index-popover);box-sizing:border-box;max-width:17.75rem;padding:0;background-color:var(--surface-menu-surface);border:var(--border-1) solid var(--border-card-border);border-radius:var(--radius-3);box-shadow:var(--dropshadow-3)}._popover_w5gf4_15 ._divider_w5gf4_32{margin-block:var(--space-2)}._popover_w5gf4_15 ._scrollableContainer_w5gf4_35{padding:var(--space-3);max-height:22.5rem}._popover_w5gf4_15 ._item_w5gf4_39{position:relative;align-items:center;padding:var(--border-8) var(--space-2) var(--border-8) var(--space-10);border:var(--border-2) solid transparent;border-radius:var(--radius-3);outline:none;-webkit-user-select:none;user-select:none;cursor:pointer;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}._popover_w5gf4_15 ._item_w5gf4_39[aria-disabled]{color:var(--gray-65);pointer-events:none}._popover_w5gf4_15 ._item_w5gf4_39[data-active-item]:not(:hover),._popover_w5gf4_15 ._item_w5gf4_39[data-highlighted]:not(:hover){background-color:var(--surface-menu-surface-hover);border:var(--border-2) solid var(--border-input-border-focus)}._popover_w5gf4_15 ._item_w5gf4_39[data-state=open],._popover_w5gf4_15 ._item_w5gf4_39:hover{background-color:var(--surface-menu-surface-hover)}._popover_w5gf4_15 ._indicator_w5gf4_66{position:absolute;top:0;left:var(--space-2);display:flex;align-items:center;justify-content:center;height:var(--size-9)}._popover_w5gf4_15 ._indicatorIcon_w5gf4_75 path{fill:var(--icon-icon-on-light)}._testContainer_w5gf4_79{border:2px #9f3fed dashed;height:56px;width:340px;display:flex;align-items:center}
|