@splunk/react-ui 5.2.0 → 5.4.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/Accordion.js +31 -31
- package/Avatar.js +64 -59
- package/Box.js +2 -1
- package/Breadcrumbs.js +66 -63
- package/ButtonSimple.js +52 -52
- package/CHANGELOG.md +47 -0
- package/Calendar.js +8 -4
- package/CardLayout.js +39 -36
- package/Checkbox.d.ts +2 -0
- package/Checkbox.js +350 -0
- package/Clickable.js +5 -6
- package/Code.js +451 -536
- package/CollapsiblePanel.js +184 -210
- package/Color.js +903 -1023
- package/ControlGroup.js +2 -1
- package/Date.js +123 -119
- package/DefinitionList.js +100 -77
- package/Dropdown.js +2 -2
- package/DualListbox.js +409 -353
- package/File.js +102 -99
- package/FormRows.js +13 -11
- package/JSONTree.js +679 -1391
- package/Link.js +7 -7
- package/MIGRATION.md +27 -0
- package/Markdown.js +171 -156
- package/Menu.js +107 -100
- package/Modal.js +3 -3
- package/Multiselect.js +2698 -2767
- package/Paginator.js +2 -1
- package/Popover.js +201 -196
- package/Resize.js +11 -8
- package/ResultsMenu.js +913 -1029
- package/ScreenReaderContent.js +86 -130
- package/Scroll.js +366 -424
- package/Search.js +131 -127
- package/Select.js +1741 -1831
- package/Slider.js +1 -1
- package/SlidingPanels.js +129 -127
- package/StepBar.js +123 -97
- package/Switch.js +214 -242
- package/TabBar.js +10 -10
- package/Table.js +1255 -1248
- package/Text.js +180 -206
- package/TextArea.js +596 -675
- package/Tooltip.js +144 -139
- package/Tree.js +638 -682
- package/package.json +15 -16
- package/tsconfig.check-docs.json +8 -0
- package/types/src/Avatar/docs/examples/Basic.d.ts +1 -1
- package/types/src/Breadcrumbs/Breadcrumbs.d.ts +1 -5
- package/types/src/Breadcrumbs/BreadcrumbsContext.d.ts +7 -0
- package/types/src/Breadcrumbs/Item.d.ts +1 -1
- package/types/src/ButtonSimple/mixin.d.ts +1 -1
- package/types/src/Checkbox/Checkbox.d.ts +90 -0
- package/types/src/Checkbox/docs/examples/Basic.d.ts +7 -0
- package/types/src/Checkbox/docs/examples/Disabled.d.ts +6 -0
- package/types/src/Checkbox/docs/examples/Error.d.ts +6 -0
- package/types/src/Checkbox/docs/examples/Uncontrolled.d.ts +7 -0
- package/types/src/Checkbox/index.d.ts +2 -0
- package/types/src/Code/Code.d.ts +4 -1
- package/types/src/Code/LineHighlights.d.ts +1 -0
- package/types/src/Code/LineNumbers.d.ts +2 -1
- package/types/src/Code/docs/examples/CustomizeContainer.d.ts +7 -0
- package/types/src/ControlGroup/docs/examples/CustomizedLabelTarget.d.ts +3 -3
- package/types/src/Date/Date.d.ts +7 -1
- package/types/src/DefinitionList/DefinitionList.d.ts +7 -2
- package/types/src/DefinitionList/DefinitionListContext.d.ts +1 -1
- package/types/src/DefinitionList/docs/examples/StackedLayout.d.ts +6 -0
- package/types/src/DualListbox/DualListbox.d.ts +1 -1
- package/types/src/DualListbox/Label.d.ts +7 -7
- package/types/src/DualListbox/Listbox.d.ts +2 -2
- package/types/src/DualListbox/ListboxContext.d.ts +1 -1
- package/types/src/File/File.d.ts +7 -1
- package/types/src/JSONTree/JSONTreeItem.d.ts +5 -3
- package/types/src/JSONTree/renderTreeItems.d.ts +3 -2
- package/types/src/Markdown/renderers/MarkdownCodeBlock.d.ts +2 -1
- package/types/src/Menu/docs/examples/Dimmed.d.ts +1 -1
- package/types/src/Menu/docs/examples/Disabled.d.ts +1 -0
- package/types/src/Modal/ModalContext.d.ts +1 -1
- package/types/src/Multiselect/Compact.d.ts +9 -3
- package/types/src/Multiselect/Multiselect.d.ts +7 -1
- package/types/src/Multiselect/Normal.d.ts +9 -3
- package/types/src/Number/utils.d.ts +1 -1
- package/types/src/Popover/getPlacement.d.ts +1 -1
- package/types/src/RadioList/Option.d.ts +1 -1
- package/types/src/RadioList/RadioListContext.d.ts +1 -1
- package/types/src/Search/Search.d.ts +5 -1
- package/types/src/StepBar/StepBar.d.ts +4 -1
- package/types/src/StepBar/StepBarContext.d.ts +1 -0
- package/types/src/StepBar/docs/examples/Vertical.d.ts +6 -0
- package/types/src/Switch/Switch.d.ts +13 -1
- package/types/src/Switch/docs/examples/Basic.d.ts +2 -10
- package/types/src/Switch/docs/examples/Disabled.d.ts +2 -9
- package/types/src/TabBar/Tab.d.ts +3 -1
- package/types/src/TabBar/docs/examples/Icons.d.ts +4 -0
- package/types/src/TabBar/docs/examples/Tooltips.d.ts +3 -0
- package/types/src/TabLayout/Panel.d.ts +2 -0
- package/types/src/Table/ExpandButton.d.ts +1 -1
- package/types/src/Table/Head.d.ts +1 -1
- package/types/src/Table/Row.d.ts +1 -1
- package/types/src/Table/Table.d.ts +1 -0
- package/types/src/Tooltip/Tooltip.d.ts +14 -1
- package/types/src/Tree/TreeContext.d.ts +1 -1
- package/useControlled.js +61 -97
- package/usePrevious.js +30 -62
- package/useResizeObserver.js +95 -127
- package/NonInteractiveCheckbox.js +0 -101
- package/types/src/CollapsiblePanel/icons/ExpandPanel.d.ts +0 -12
- package/types/src/NonInteractiveCheckbox/NonInteractiveCheckbox.d.ts +0 -22
- package/types/src/NonInteractiveCheckbox/index.d.ts +0 -1
- package/types/src/Switch/docs/examples/Error.d.ts +0 -6
- package/types/src/Text/IconOutlinedHide.d.ts +0 -3
- package/types/src/Text/IconOutlinedView.d.ts +0 -3
- /package/cypress/{tsconfig.cypress.json → tsconfig.check-cypress.json} +0 -0
package/DualListbox.js
CHANGED
|
@@ -61,8 +61,8 @@
|
|
|
61
61
|
e.r(r);
|
|
62
62
|
// EXPORTS
|
|
63
63
|
e.d(r, {
|
|
64
|
-
Option: () => /* reexport */
|
|
65
|
-
default: () => /* reexport */
|
|
64
|
+
Option: () => /* reexport */ ne,
|
|
65
|
+
default: () => /* reexport */ He
|
|
66
66
|
});
|
|
67
67
|
// CONCATENATED MODULE: external "react"
|
|
68
68
|
const t = require("react");
|
|
@@ -72,10 +72,10 @@
|
|
|
72
72
|
var l = e.n(a);
|
|
73
73
|
// CONCATENATED MODULE: external "@splunk/react-icons/ChevronLeft"
|
|
74
74
|
const i = require("@splunk/react-icons/ChevronLeft");
|
|
75
|
-
var
|
|
75
|
+
var o = e.n(i);
|
|
76
76
|
// CONCATENATED MODULE: external "@splunk/react-icons/ChevronRight"
|
|
77
|
-
const
|
|
78
|
-
var c = e.n(
|
|
77
|
+
const u = require("@splunk/react-icons/ChevronRight");
|
|
78
|
+
var c = e.n(u);
|
|
79
79
|
// CONCATENATED MODULE: external "@splunk/react-ui/useForceUpdate"
|
|
80
80
|
const s = require("@splunk/react-ui/useForceUpdate");
|
|
81
81
|
var v = e.n(s);
|
|
@@ -103,7 +103,7 @@
|
|
|
103
103
|
// CONCATENATED MODULE: external "@splunk/themes"
|
|
104
104
|
const C = require("@splunk/themes");
|
|
105
105
|
// CONCATENATED MODULE: ./src/DualListbox/DualListboxStyles.ts
|
|
106
|
-
var
|
|
106
|
+
var O = g()(k()).withConfig({
|
|
107
107
|
displayName: "DualListboxStyles__StyledBox",
|
|
108
108
|
componentId: "sc-1te6bz0-0"
|
|
109
109
|
})([ "display:grid;grid-template-columns:[list0] 180px [actions] min-content [list1] 180px;grid-template-rows:[headers] min-content [lists] 160px;gap:", " ", ";", " ", "" ], C.variables.spacingXSmall, C.variables.spacingSmall, (function(e) {
|
|
@@ -113,28 +113,28 @@
|
|
|
113
113
|
var r = e.$fill;
|
|
114
114
|
return r && (0, h.css)([ "height:100%;grid-template-columns:[list0] 1fr [actions] min-content [list1] 1fr;grid-template-rows:[headers] min-content [lists] 1fr;position:relative;width:100%;" ]);
|
|
115
115
|
}));
|
|
116
|
-
var
|
|
116
|
+
var S = g().div.withConfig({
|
|
117
117
|
displayName: "DualListboxStyles__StyledFlexColumn",
|
|
118
118
|
componentId: "sc-1te6bz0-1"
|
|
119
119
|
})([ "&::before{content:'';grid-column:headers;grid-row:lists;}align-items:center;display:flex;flex-direction:column;gap:", ";grid-column:actions;grid-row:lists;justify-content:center;" ], C.variables.spacingSmall);
|
|
120
120
|
// CONCATENATED MODULE: external "@splunk/ui-utils/id"
|
|
121
|
-
const
|
|
121
|
+
const x = require("@splunk/ui-utils/id");
|
|
122
|
+
// CONCATENATED MODULE: external "@splunk/react-ui/Checkbox"
|
|
123
|
+
const w = require("@splunk/react-ui/Checkbox");
|
|
124
|
+
var R = e.n(w);
|
|
122
125
|
// CONCATENATED MODULE: external "@splunk/react-ui/ScreenReaderContent"
|
|
123
|
-
const
|
|
124
|
-
var
|
|
125
|
-
// CONCATENATED MODULE: external "@splunk/react-ui/Switch"
|
|
126
|
-
const E = require("@splunk/react-ui/Switch");
|
|
127
|
-
var I = e.n(E);
|
|
126
|
+
const E = require("@splunk/react-ui/ScreenReaderContent");
|
|
127
|
+
var j = e.n(E);
|
|
128
128
|
// CONCATENATED MODULE: ./src/DualListbox/LabelStyles.ts
|
|
129
|
-
var
|
|
129
|
+
var P = g().label.withConfig({
|
|
130
130
|
displayName: "LabelStyles__StyledLabel",
|
|
131
131
|
componentId: "unwplx-0"
|
|
132
132
|
})([ "color:", ";flex:0 0 auto;" ], C.variables.contentColorActive);
|
|
133
|
-
var
|
|
133
|
+
var I = g().div.withConfig({
|
|
134
134
|
displayName: "LabelStyles__StyledLabelContainer",
|
|
135
135
|
componentId: "unwplx-1"
|
|
136
136
|
})([ "display:flex;flex-direction:column;" ]);
|
|
137
|
-
var
|
|
137
|
+
var L = g().div.withConfig({
|
|
138
138
|
displayName: "LabelStyles__StyledSwitchContainer",
|
|
139
139
|
componentId: "unwplx-2"
|
|
140
140
|
})([ "align-items:center;border:", " solid transparent;display:flex;gap:", ";grid-row:headers;padding:0 ", ";", "" ], C.variables.inputBorderWidth, C.variables.spacingSmall, C.variables.spacingSmall, (function(e) {
|
|
@@ -148,22 +148,23 @@
|
|
|
148
148
|
* Defaults to `'{}'`.
|
|
149
149
|
* @public
|
|
150
150
|
*/
|
|
151
|
-
var
|
|
152
|
-
/* harmony default export */ const
|
|
151
|
+
var q = n().createContext({});
|
|
152
|
+
/* harmony default export */ const N = q;
|
|
153
153
|
// CONCATENATED MODULE: ./src/DualListbox/Label.tsx
|
|
154
|
-
var
|
|
154
|
+
var _ = {
|
|
155
155
|
id: l().string.isRequired,
|
|
156
156
|
index: l().number.isRequired,
|
|
157
157
|
listId: l().string.isRequired,
|
|
158
158
|
name: l().string.isRequired,
|
|
159
|
-
|
|
159
|
+
onCheckboxChange: l().func,
|
|
160
160
|
value: l().string.isRequired
|
|
161
161
|
};
|
|
162
162
|
function V(e) {
|
|
163
|
-
var r = e.id, a = e.index, l = e.listId, i = e.name,
|
|
164
|
-
|
|
163
|
+
var r = e.id, a = e.index, l = e.listId, i = e.name, o = e.onCheckboxChange, u = e.value;
|
|
164
|
+
// @docs-props-type ListboxLabelPropsBase
|
|
165
|
+
var c = (0, t.useContext)(N);
|
|
165
166
|
var s = v()();
|
|
166
|
-
var p = (0, t.useRef)((0,
|
|
167
|
+
var p = (0, t.useRef)((0, x.createDOMID)("checkbox"));
|
|
167
168
|
var b = c.updateLabelRefreshHookByName, m = c.getLabelState;
|
|
168
169
|
(0, t.useEffect)((function() {
|
|
169
170
|
b === null || b === void 0 ? void 0 : b(i, s);
|
|
@@ -176,32 +177,31 @@
|
|
|
176
177
|
}
|
|
177
178
|
var h = m(), g = h.disabled, y = h.selected, k = h.selectedValueCount, C = h.valueCount;
|
|
178
179
|
|
|
179
|
-
return n().createElement(
|
|
180
|
+
return n().createElement(L, {
|
|
180
181
|
$columnNumber: a
|
|
181
|
-
}, n().createElement(
|
|
182
|
+
}, n().createElement(j(), {
|
|
182
183
|
"aria-hidden": true,
|
|
183
184
|
id: p.current
|
|
184
185
|
}, (0, f.sprintf)((0, d._)("Select all %(listName)s Options"), {
|
|
185
|
-
listName:
|
|
186
|
-
})), n().createElement(
|
|
187
|
-
appearance: "checkbox",
|
|
186
|
+
listName: u
|
|
187
|
+
})), n().createElement(R(), {
|
|
188
188
|
"data-test": "select-all",
|
|
189
189
|
disabled: g,
|
|
190
190
|
labelledBy: p.current,
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
value:
|
|
194
|
-
}), n().createElement(
|
|
191
|
+
onChange: o,
|
|
192
|
+
checked: y,
|
|
193
|
+
value: u
|
|
194
|
+
}), n().createElement(I, null, n().createElement(P, {
|
|
195
195
|
id: r,
|
|
196
196
|
htmlFor: l
|
|
197
|
-
},
|
|
197
|
+
}, u), n().createElement("span", {
|
|
198
198
|
"aria-hidden": true
|
|
199
199
|
}, "".concat(k, "/").concat(C, " selected"))));
|
|
200
200
|
}
|
|
201
|
-
V.propTypes =
|
|
202
|
-
/* harmony default export */ const
|
|
201
|
+
V.propTypes = _;
|
|
202
|
+
/* harmony default export */ const D = V;
|
|
203
203
|
// CONCATENATED MODULE: ./src/DualListbox/ListboxStyles.ts
|
|
204
|
-
var
|
|
204
|
+
var B = g().ul.withConfig({
|
|
205
205
|
displayName: "ListboxStyles__StyledListbox",
|
|
206
206
|
componentId: "sc-11oqtd-0"
|
|
207
207
|
})([ "background-color:", ";border:", " solid ", ";border-radius:", ";grid-row:lists;list-style:none;margin:0;min-height:0;min-width:0;overflow:auto;padding:0;position:relative;&:focus{box-shadow:", ";outline:none;}", "" ], C.variables.transparent, C.variables.inputBorderWidth, C.variables.interactiveColorBorder, C.variables.borderRadius, C.variables.focusShadow, (function(e) {
|
|
@@ -253,29 +253,30 @@
|
|
|
253
253
|
onSelectAllClick: l().func
|
|
254
254
|
};
|
|
255
255
|
function K(e) {
|
|
256
|
-
var r = e.children, a = e.elementRef, l = e.index, i = e.label,
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
var
|
|
260
|
-
var
|
|
256
|
+
var r = e.children, a = e.elementRef, l = e.index, i = e.label, o = e.name, u = e.onClick, c = e.onKeyDown, s = e.onSelectAllClick, v = A(e, [ "children", "elementRef", "index", "label", "name", "onClick", "onKeyDown", "onSelectAllClick" ]);
|
|
257
|
+
// @docs-props-type ListboxPropsBase
|
|
258
|
+
var f = (0, t.useRef)((0, x.createDOMID)("label"));
|
|
259
|
+
var d = (0, t.useRef)((0, x.createDOMID)("listbox"));
|
|
260
|
+
var p = (0, t.useContext)(m), b = p.controlled, h = p.getSelectedStateForValue, g = p.getActiveValue, y = p.getSelectedValueCount, k = p.getValueCount, C = p.updateLabelRefreshHookByName, O = p.updateOptionRefreshHookByValue;
|
|
261
|
+
var S = (0, t.useCallback)((function(e, r) {
|
|
261
262
|
var t = r.value;
|
|
262
|
-
|
|
263
|
-
name:
|
|
263
|
+
u === null || u === void 0 ? void 0 : u(e, {
|
|
264
|
+
name: o,
|
|
264
265
|
value: t
|
|
265
266
|
});
|
|
266
|
-
}), [
|
|
267
|
-
var
|
|
267
|
+
}), [ o, u ]);
|
|
268
|
+
var w = (0, t.useCallback)((function(e) {
|
|
268
269
|
return {
|
|
269
|
-
active: (g === null || g === void 0 ? void 0 : g(
|
|
270
|
+
active: (g === null || g === void 0 ? void 0 : g(o)) === e,
|
|
270
271
|
selected: !!(h === null || h === void 0 ? void 0 : h(e))
|
|
271
272
|
};
|
|
272
|
-
}), [
|
|
273
|
+
}), [ o, g, h ]);
|
|
273
274
|
var R = (0, t.useCallback)((function() {
|
|
274
|
-
var e = (k === null || k === void 0 ? void 0 : k(
|
|
275
|
-
var r = (y === null || y === void 0 ? void 0 : y(
|
|
275
|
+
var e = (k === null || k === void 0 ? void 0 : k(o)) || 0;
|
|
276
|
+
var r = (y === null || y === void 0 ? void 0 : y(o)) || 0;
|
|
276
277
|
var t = false;
|
|
277
278
|
if (r > 0) {
|
|
278
|
-
t = r === e ? true : "
|
|
279
|
+
t = r === e ? true : "indeterminate";
|
|
279
280
|
}
|
|
280
281
|
return {
|
|
281
282
|
disabled: e < 1,
|
|
@@ -283,53 +284,53 @@
|
|
|
283
284
|
selectedValueCount: r,
|
|
284
285
|
valueCount: e
|
|
285
286
|
};
|
|
286
|
-
}), [
|
|
287
|
+
}), [ o, y, k ]);
|
|
287
288
|
var E = function e(r) {
|
|
288
289
|
c === null || c === void 0 ? void 0 : c(r, {
|
|
289
|
-
name:
|
|
290
|
+
name: o
|
|
290
291
|
});
|
|
291
292
|
};
|
|
292
|
-
var
|
|
293
|
-
var n = t.
|
|
293
|
+
var j = function e(r, t) {
|
|
294
|
+
var n = t.checked;
|
|
294
295
|
s === null || s === void 0 ? void 0 : s(r, {
|
|
295
|
-
name:
|
|
296
|
+
name: o,
|
|
296
297
|
selected: n
|
|
297
298
|
});
|
|
298
299
|
};
|
|
299
|
-
var
|
|
300
|
+
var P = function e(r) {
|
|
300
301
|
// this prevents default text selection when using shift + click
|
|
301
302
|
if (r.shiftKey && r.target !== r.currentTarget) {
|
|
302
303
|
r.preventDefault();
|
|
303
304
|
}
|
|
304
305
|
};
|
|
305
|
-
var
|
|
306
|
+
var I = (0, t.useMemo)((function() {
|
|
306
307
|
return {
|
|
307
|
-
onOptionClick:
|
|
308
|
+
onOptionClick: S,
|
|
308
309
|
updateLabelRefreshHookByName: C,
|
|
309
|
-
updateOptionRefreshHookByValue:
|
|
310
|
-
getOptionStateForValue:
|
|
310
|
+
updateOptionRefreshHookByValue: O,
|
|
311
|
+
getOptionStateForValue: w,
|
|
311
312
|
getLabelState: R,
|
|
312
313
|
controlled: b
|
|
313
314
|
};
|
|
314
|
-
}), [
|
|
315
|
+
}), [ S, C, O, w, R, b ]);
|
|
315
316
|
|
|
316
|
-
return n().createElement(
|
|
317
|
-
value:
|
|
318
|
-
}, n().createElement(
|
|
317
|
+
return n().createElement(N.Provider, {
|
|
318
|
+
value: I
|
|
319
|
+
}, n().createElement(D, {
|
|
319
320
|
id: f.current,
|
|
320
321
|
index: l,
|
|
321
322
|
listId: d.current,
|
|
322
|
-
name:
|
|
323
|
-
|
|
323
|
+
name: o,
|
|
324
|
+
onCheckboxChange: j,
|
|
324
325
|
value: i
|
|
325
|
-
}), n().createElement(
|
|
326
|
+
}), n().createElement(B, M({
|
|
326
327
|
"aria-activedescendant": "",
|
|
327
328
|
"aria-labelledby": f.current,
|
|
328
329
|
"aria-multiselectable": true,
|
|
329
330
|
"data-test": "listbox",
|
|
330
331
|
id: d.current,
|
|
331
332
|
onKeyDown: E,
|
|
332
|
-
onMouseDown:
|
|
333
|
+
onMouseDown: P,
|
|
333
334
|
ref: a,
|
|
334
335
|
role: "listbox",
|
|
335
336
|
tabIndex: 0,
|
|
@@ -364,50 +365,47 @@
|
|
|
364
365
|
return a;
|
|
365
366
|
}
|
|
366
367
|
for (var i = r + 1; i < t.length; i += 1) {
|
|
367
|
-
var
|
|
368
|
-
if (!l.has(
|
|
369
|
-
return
|
|
368
|
+
var o = t[i];
|
|
369
|
+
if (!l.has(o)) {
|
|
370
|
+
return o;
|
|
370
371
|
}
|
|
371
372
|
}
|
|
372
|
-
for (var
|
|
373
|
-
var c = t[
|
|
373
|
+
for (var u = r - 1; u > 0; u -= 1) {
|
|
374
|
+
var c = t[u];
|
|
374
375
|
if (!l.has(c)) {
|
|
375
376
|
return c;
|
|
376
377
|
}
|
|
377
378
|
}
|
|
378
379
|
return undefined;
|
|
379
380
|
};
|
|
380
|
-
// CONCATENATED MODULE: external "@splunk/react-ui/NonInteractiveCheckbox"
|
|
381
|
-
const W = require("@splunk/react-ui/NonInteractiveCheckbox");
|
|
382
|
-
var X = e.n(W);
|
|
383
381
|
// CONCATENATED MODULE: external "@splunk/themes/mixins"
|
|
384
|
-
const
|
|
382
|
+
const W = require("@splunk/themes/mixins");
|
|
385
383
|
// CONCATENATED MODULE: ./src/DualListbox/OptionStyles.ts
|
|
386
|
-
var
|
|
387
|
-
var
|
|
384
|
+
var X = (0, h.css)([ "background:", ";font-weight:", ";" ], C.mixins.overlayColors(C.variables.interactiveColorOverlaySelected, C.variables.interactiveColorOverlayActive), C.variables.fontWeightBold);
|
|
385
|
+
var G = g().li.withConfig({
|
|
388
386
|
displayName: "OptionStyles__StyledListItem",
|
|
389
387
|
componentId: "q275d9-0"
|
|
390
388
|
})([ "", " align-items:center;color:", ";cursor:pointer;display:flex;min-height:", ";overflow:hidden;padding:0 ", ";word-wrap:break-word;", " &:active{", "}", "" ], (0,
|
|
391
|
-
|
|
389
|
+
W.typography)({
|
|
392
390
|
lineHeight: "spacious"
|
|
393
391
|
}), C.variables.contentColorActive, C.variables.inputHeight, C.variables.spacingSmall, (function(e) {
|
|
394
392
|
var r = e.$active;
|
|
395
|
-
return r &&
|
|
396
|
-
}),
|
|
393
|
+
return r && X;
|
|
394
|
+
}), X, (0, C.pickVariant)("$selected", {
|
|
397
395
|
true: (0, h.css)([ "background:", ";&:hover{background:", ";}" ], C.variables.interactiveColorOverlaySelected, C.mixins.overlayColors(C.variables.interactiveColorOverlaySelected, C.variables.interactiveColorOverlayHover)),
|
|
398
396
|
false: (0, h.css)([ "&:hover{background:", ";}" ], C.variables.interactiveColorOverlayHover)
|
|
399
397
|
}));
|
|
400
|
-
var
|
|
401
|
-
displayName: "
|
|
398
|
+
var J = g()(R()).withConfig({
|
|
399
|
+
displayName: "OptionStyles__StyledCheckbox",
|
|
402
400
|
componentId: "q275d9-1"
|
|
403
401
|
})([ "padding-inline-end:", ";" ], C.variables.spacingSmall);
|
|
404
|
-
var
|
|
402
|
+
var Q = g().div.withConfig({
|
|
405
403
|
displayName: "OptionStyles__StyledLabel",
|
|
406
404
|
componentId: "q275d9-2"
|
|
407
405
|
})([ "word-break:break-word;word-wrap:break-word;" ]);
|
|
408
406
|
// CONCATENATED MODULE: ./src/DualListbox/Option.tsx
|
|
409
|
-
function
|
|
410
|
-
return
|
|
407
|
+
function Y() {
|
|
408
|
+
return Y = Object.assign ? Object.assign.bind() : function(e) {
|
|
411
409
|
for (var r = 1; r < arguments.length; r++) {
|
|
412
410
|
var t = arguments[r];
|
|
413
411
|
for (var n in t) {
|
|
@@ -415,11 +413,11 @@
|
|
|
415
413
|
}
|
|
416
414
|
}
|
|
417
415
|
return e;
|
|
418
|
-
},
|
|
416
|
+
}, Y.apply(null, arguments);
|
|
419
417
|
}
|
|
420
|
-
function
|
|
418
|
+
function Z(e, r) {
|
|
421
419
|
if (null == e) return {};
|
|
422
|
-
var t, n, a =
|
|
420
|
+
var t, n, a = ee(e, r);
|
|
423
421
|
if (Object.getOwnPropertySymbols) {
|
|
424
422
|
var l = Object.getOwnPropertySymbols(e);
|
|
425
423
|
for (n = 0; n < l.length; n++) {
|
|
@@ -428,7 +426,7 @@
|
|
|
428
426
|
}
|
|
429
427
|
return a;
|
|
430
428
|
}
|
|
431
|
-
function
|
|
429
|
+
function ee(e, r) {
|
|
432
430
|
if (null == e) return {};
|
|
433
431
|
var t = {};
|
|
434
432
|
for (var n in e) {
|
|
@@ -439,18 +437,19 @@
|
|
|
439
437
|
}
|
|
440
438
|
return t;
|
|
441
439
|
}
|
|
442
|
-
var
|
|
440
|
+
var re = {
|
|
443
441
|
id: l().string.isRequired,
|
|
444
442
|
label: l().string.isRequired,
|
|
445
443
|
listName: l().string,
|
|
446
444
|
selected: l().bool,
|
|
447
445
|
value: l().string.isRequired
|
|
448
446
|
};
|
|
449
|
-
function
|
|
450
|
-
var r = e.id, a = e.label, l = e.selected, i = e.value,
|
|
451
|
-
|
|
447
|
+
function te(e) {
|
|
448
|
+
var r = e.id, a = e.label, l = e.selected, i = e.value, o = Z(e, [ "id", "label", "selected", "value" ]);
|
|
449
|
+
// @docs-props-type OptionPropsBase
|
|
450
|
+
var u = (0, t.useContext)(N);
|
|
452
451
|
var c = v()();
|
|
453
|
-
var s =
|
|
452
|
+
var s = u.onOptionClick, f = u.getOptionStateForValue, d = u.updateOptionRefreshHookByValue, p = u.controlled;
|
|
454
453
|
(0, t.useEffect)((function() {
|
|
455
454
|
d === null || d === void 0 ? void 0 : d(i, c);
|
|
456
455
|
return function() {
|
|
@@ -468,7 +467,7 @@
|
|
|
468
467
|
var m = f(i), h = m.active, g = m.selected;
|
|
469
468
|
var y = !!(p ? l : g);
|
|
470
469
|
|
|
471
|
-
return n().createElement(
|
|
470
|
+
return n().createElement(G, Y({
|
|
472
471
|
"aria-selected": y,
|
|
473
472
|
"data-test": "option",
|
|
474
473
|
"data-test-value": i,
|
|
@@ -478,15 +477,16 @@
|
|
|
478
477
|
role: "option",
|
|
479
478
|
$active: h,
|
|
480
479
|
$selected: y
|
|
481
|
-
},
|
|
482
|
-
|
|
483
|
-
|
|
480
|
+
}, o), n().createElement(J, {
|
|
481
|
+
checked: y,
|
|
482
|
+
inert: true
|
|
483
|
+
}), n().createElement(Q, null, a));
|
|
484
484
|
}
|
|
485
|
-
|
|
486
|
-
/* harmony default export */ const
|
|
485
|
+
te.propTypes = re;
|
|
486
|
+
/* harmony default export */ const ne = te;
|
|
487
487
|
// CONCATENATED MODULE: ./src/DualListbox/ScreenReaderWrapper.tsx
|
|
488
|
-
function
|
|
489
|
-
return
|
|
488
|
+
function ae() {
|
|
489
|
+
return ae = Object.assign ? Object.assign.bind() : function(e) {
|
|
490
490
|
for (var r = 1; r < arguments.length; r++) {
|
|
491
491
|
var t = arguments[r];
|
|
492
492
|
for (var n in t) {
|
|
@@ -494,40 +494,40 @@
|
|
|
494
494
|
}
|
|
495
495
|
}
|
|
496
496
|
return e;
|
|
497
|
-
},
|
|
497
|
+
}, ae.apply(null, arguments);
|
|
498
498
|
}
|
|
499
|
-
function
|
|
500
|
-
var r =
|
|
499
|
+
function le(e) {
|
|
500
|
+
var r = ae({}, e);
|
|
501
501
|
var a = v()();
|
|
502
502
|
var l = (0, t.useContext)(m);
|
|
503
|
-
var i = l.getScreenReaderMessage,
|
|
503
|
+
var i = l.getScreenReaderMessage, o = l.updateScreenReaderRefreshHook;
|
|
504
504
|
(0, t.useEffect)((function() {
|
|
505
|
-
|
|
505
|
+
o === null || o === void 0 ? void 0 : o(a);
|
|
506
506
|
return function() {
|
|
507
|
-
return
|
|
507
|
+
return o === null || o === void 0 ? void 0 : o();
|
|
508
508
|
};
|
|
509
|
-
}), [
|
|
509
|
+
}), [ o, a ]);
|
|
510
510
|
if (!i) {
|
|
511
511
|
return null;
|
|
512
512
|
}
|
|
513
513
|
|
|
514
|
-
return n().createElement(
|
|
514
|
+
return n().createElement(j(), ae({
|
|
515
515
|
"aria-live": "assertive"
|
|
516
516
|
}, r), i() || "");
|
|
517
517
|
}
|
|
518
|
-
/* harmony default export */ const
|
|
518
|
+
/* harmony default export */ const ie = le;
|
|
519
519
|
// CONCATENATED MODULE: external "@splunk/react-ui/Tooltip"
|
|
520
|
-
const
|
|
521
|
-
var
|
|
520
|
+
const oe = require("@splunk/react-ui/Tooltip");
|
|
521
|
+
var ue = e.n(oe);
|
|
522
522
|
// CONCATENATED MODULE: external "@splunk/react-ui/ButtonSimple"
|
|
523
|
-
const
|
|
524
|
-
var
|
|
523
|
+
const ce = require("@splunk/react-ui/ButtonSimple");
|
|
524
|
+
var se = e.n(ce);
|
|
525
525
|
// CONCATENATED MODULE: ./src/DualListbox/ToolbarButtonStyles.ts
|
|
526
|
-
var
|
|
526
|
+
var ve = g()(se()).withConfig({
|
|
527
527
|
displayName: "ToolbarButtonStyles__StyledButtonSimple",
|
|
528
528
|
componentId: "k7zksz-0"
|
|
529
529
|
})([ "height:", ";width:", ";" ], C.variables.inputHeight, C.variables.inputHeight);
|
|
530
|
-
var
|
|
530
|
+
var fe = g().span.withConfig({
|
|
531
531
|
displayName: "ToolbarButtonStyles__StyledIcon",
|
|
532
532
|
componentId: "k7zksz-1"
|
|
533
533
|
})([ "align-items:center;display:flex;flex-direction:row;flex-shrink:0;justify-content:center;max-width:100%;" ]);
|
|
@@ -538,11 +538,11 @@
|
|
|
538
538
|
* Defaults to `'{}'`.
|
|
539
539
|
* @public
|
|
540
540
|
*/
|
|
541
|
-
var
|
|
542
|
-
/* harmony default export */ const
|
|
541
|
+
var de = n().createContext({});
|
|
542
|
+
/* harmony default export */ const pe = de;
|
|
543
543
|
// CONCATENATED MODULE: ./src/DualListbox/ToolbarButton.tsx
|
|
544
|
-
function
|
|
545
|
-
return
|
|
544
|
+
function be() {
|
|
545
|
+
return be = Object.assign ? Object.assign.bind() : function(e) {
|
|
546
546
|
for (var r = 1; r < arguments.length; r++) {
|
|
547
547
|
var t = arguments[r];
|
|
548
548
|
for (var n in t) {
|
|
@@ -550,11 +550,11 @@
|
|
|
550
550
|
}
|
|
551
551
|
}
|
|
552
552
|
return e;
|
|
553
|
-
},
|
|
553
|
+
}, be.apply(null, arguments);
|
|
554
554
|
}
|
|
555
|
-
function
|
|
555
|
+
function me(e, r) {
|
|
556
556
|
if (null == e) return {};
|
|
557
|
-
var t, n, a =
|
|
557
|
+
var t, n, a = he(e, r);
|
|
558
558
|
if (Object.getOwnPropertySymbols) {
|
|
559
559
|
var l = Object.getOwnPropertySymbols(e);
|
|
560
560
|
for (n = 0; n < l.length; n++) {
|
|
@@ -563,7 +563,7 @@
|
|
|
563
563
|
}
|
|
564
564
|
return a;
|
|
565
565
|
}
|
|
566
|
-
function
|
|
566
|
+
function he(e, r) {
|
|
567
567
|
if (null == e) return {};
|
|
568
568
|
var t = {};
|
|
569
569
|
for (var n in e) {
|
|
@@ -574,15 +574,16 @@
|
|
|
574
574
|
}
|
|
575
575
|
return t;
|
|
576
576
|
}
|
|
577
|
-
var
|
|
577
|
+
var ge = {
|
|
578
578
|
icon: l().node.isRequired,
|
|
579
579
|
name: l().string.isRequired,
|
|
580
580
|
tooltipLabel: l().string.isRequired,
|
|
581
581
|
tooltipPlacement: l().oneOf([ "above", "below", "left", "right" ])
|
|
582
582
|
};
|
|
583
|
-
function
|
|
584
|
-
var r = e.ariaLabel, a = e.ariaKeyShortcuts, l = e.icon, i = e.name,
|
|
585
|
-
|
|
583
|
+
function ye(e) {
|
|
584
|
+
var r = e.ariaLabel, a = e.ariaKeyShortcuts, l = e.icon, i = e.name, o = e.tooltipLabel, u = e.tooltipPlacement, c = me(e, [ "ariaLabel", "ariaKeyShortcuts", "icon", "name", "tooltipLabel", "tooltipPlacement" ]);
|
|
585
|
+
// @docs-props-type ToolbarButtonPropsBase
|
|
586
|
+
var s = (0, t.useContext)(pe);
|
|
586
587
|
var f = v()();
|
|
587
588
|
var d = s.getButtonState, p = s.onButtonClick, b = s.updateButtonRefreshHookByName;
|
|
588
589
|
(0, t.useEffect)((function() {
|
|
@@ -601,12 +602,12 @@
|
|
|
601
602
|
}
|
|
602
603
|
var h = d(i), g = h.disabled;
|
|
603
604
|
|
|
604
|
-
return n().createElement(
|
|
605
|
-
defaultPlacement:
|
|
605
|
+
return n().createElement(ue(), {
|
|
606
|
+
defaultPlacement: u,
|
|
606
607
|
content: n().createElement("span", {
|
|
607
608
|
"aria-hidden": true
|
|
608
|
-
},
|
|
609
|
-
}, n().createElement(
|
|
609
|
+
}, o)
|
|
610
|
+
}, n().createElement(ve, be({
|
|
610
611
|
appearance: "subtle",
|
|
611
612
|
"aria-label": r,
|
|
612
613
|
"aria-keyshortcuts": a,
|
|
@@ -614,23 +615,23 @@
|
|
|
614
615
|
"data-test": "toolbar-button",
|
|
615
616
|
disabled: g,
|
|
616
617
|
onClick: m
|
|
617
|
-
}, c), n().createElement(
|
|
618
|
+
}, c), n().createElement(fe, null, l)));
|
|
618
619
|
}
|
|
619
|
-
|
|
620
|
-
/* harmony default export */ const
|
|
620
|
+
ye.propsTypes = ge;
|
|
621
|
+
/* harmony default export */ const ke = ye;
|
|
621
622
|
// CONCATENATED MODULE: ./src/utils/fuzzyMatch.ts
|
|
622
623
|
// A utility for matching keyboard characters to list values
|
|
623
|
-
var
|
|
624
|
+
var Ce = function e(r, t) {
|
|
624
625
|
return r ? r.label.charAt(t).toLowerCase() : "";
|
|
625
626
|
};
|
|
626
|
-
var
|
|
627
|
+
var Oe = function e(r, t) {
|
|
627
628
|
if (!r.length) {
|
|
628
629
|
return r;
|
|
629
630
|
}
|
|
630
631
|
var n = null;
|
|
631
632
|
var a = false;
|
|
632
633
|
var l = r.filter((function(e) {
|
|
633
|
-
var r =
|
|
634
|
+
var r = Ce(e, t.index);
|
|
634
635
|
if (r === t.value) {
|
|
635
636
|
a = true;
|
|
636
637
|
return true;
|
|
@@ -638,7 +639,7 @@
|
|
|
638
639
|
// If we haven't found a match yet, keep track of the next closest match.
|
|
639
640
|
// Secondary matching looks for the closest character of a higher value, and failing that, closest of a lower value.
|
|
640
641
|
if (!a) {
|
|
641
|
-
var l =
|
|
642
|
+
var l = Ce(n, t.index);
|
|
642
643
|
if (!l) {
|
|
643
644
|
n = e;
|
|
644
645
|
} else if (r > t.value) {
|
|
@@ -656,8 +657,16 @@
|
|
|
656
657
|
return l.length === 0 && n ? [ n ] : l;
|
|
657
658
|
};
|
|
658
659
|
// CONCATENATED MODULE: ./src/DualListbox/DualListbox.tsx
|
|
659
|
-
function
|
|
660
|
-
|
|
660
|
+
function Se(e) {
|
|
661
|
+
"@babel/helpers - typeof";
|
|
662
|
+
return Se = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(e) {
|
|
663
|
+
return typeof e;
|
|
664
|
+
} : function(e) {
|
|
665
|
+
return e && "function" == typeof Symbol && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
|
|
666
|
+
}, Se(e);
|
|
667
|
+
}
|
|
668
|
+
function xe() {
|
|
669
|
+
return xe = Object.assign ? Object.assign.bind() : function(e) {
|
|
661
670
|
for (var r = 1; r < arguments.length; r++) {
|
|
662
671
|
var t = arguments[r];
|
|
663
672
|
for (var n in t) {
|
|
@@ -665,56 +674,99 @@
|
|
|
665
674
|
}
|
|
666
675
|
}
|
|
667
676
|
return e;
|
|
668
|
-
},
|
|
677
|
+
}, xe.apply(null, arguments);
|
|
669
678
|
}
|
|
670
|
-
function
|
|
671
|
-
return
|
|
679
|
+
function we(e, r) {
|
|
680
|
+
return Ie(e) || Pe(e, r) || Ee(e, r) || Re();
|
|
672
681
|
}
|
|
673
|
-
function
|
|
682
|
+
function Re() {
|
|
674
683
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
675
684
|
}
|
|
676
|
-
function
|
|
685
|
+
function Ee(e, r) {
|
|
677
686
|
if (e) {
|
|
678
|
-
if ("string" == typeof e) return
|
|
687
|
+
if ("string" == typeof e) return je(e, r);
|
|
679
688
|
var t = {}.toString.call(e).slice(8, -1);
|
|
680
|
-
return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ?
|
|
689
|
+
return "Object" === t && e.constructor && (t = e.constructor.name), "Map" === t || "Set" === t ? Array.from(e) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? je(e, r) : void 0;
|
|
681
690
|
}
|
|
682
691
|
}
|
|
683
|
-
function
|
|
692
|
+
function je(e, r) {
|
|
684
693
|
(null == r || r > e.length) && (r = e.length);
|
|
685
694
|
for (var t = 0, n = Array(r); t < r; t++) {
|
|
686
695
|
n[t] = e[t];
|
|
687
696
|
}
|
|
688
697
|
return n;
|
|
689
698
|
}
|
|
690
|
-
function
|
|
699
|
+
function Pe(e, r) {
|
|
691
700
|
var t = null == e ? null : "undefined" != typeof Symbol && e[Symbol.iterator] || e["@@iterator"];
|
|
692
701
|
if (null != t) {
|
|
693
|
-
var n, a, l, i,
|
|
702
|
+
var n, a, l, i, o = [], u = !0, c = !1;
|
|
694
703
|
try {
|
|
695
704
|
if (l = (t = t.call(e)).next, 0 === r) {
|
|
696
705
|
if (Object(t) !== t) return;
|
|
697
|
-
|
|
698
|
-
} else for (;!(
|
|
706
|
+
u = !1;
|
|
707
|
+
} else for (;!(u = (n = l.call(t)).done) && (o.push(n.value), o.length !== r); u = !0) {
|
|
699
708
|
}
|
|
700
709
|
} catch (e) {
|
|
701
710
|
c = !0, a = e;
|
|
702
711
|
} finally {
|
|
703
712
|
try {
|
|
704
|
-
if (!
|
|
713
|
+
if (!u && null != t["return"] && (i = t["return"](), Object(i) !== i)) return;
|
|
705
714
|
} finally {
|
|
706
715
|
if (c) throw a;
|
|
707
716
|
}
|
|
708
717
|
}
|
|
709
|
-
return
|
|
718
|
+
return o;
|
|
710
719
|
}
|
|
711
720
|
}
|
|
712
|
-
function
|
|
721
|
+
function Ie(e) {
|
|
713
722
|
if (Array.isArray(e)) return e;
|
|
714
723
|
}
|
|
715
|
-
function
|
|
724
|
+
function Le(e, r) {
|
|
725
|
+
var t = Object.keys(e);
|
|
726
|
+
if (Object.getOwnPropertySymbols) {
|
|
727
|
+
var n = Object.getOwnPropertySymbols(e);
|
|
728
|
+
r && (n = n.filter((function(r) {
|
|
729
|
+
return Object.getOwnPropertyDescriptor(e, r).enumerable;
|
|
730
|
+
}))), t.push.apply(t, n);
|
|
731
|
+
}
|
|
732
|
+
return t;
|
|
733
|
+
}
|
|
734
|
+
function qe(e) {
|
|
735
|
+
for (var r = 1; r < arguments.length; r++) {
|
|
736
|
+
var t = null != arguments[r] ? arguments[r] : {};
|
|
737
|
+
r % 2 ? Le(Object(t), !0).forEach((function(r) {
|
|
738
|
+
Ne(e, r, t[r]);
|
|
739
|
+
})) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : Le(Object(t)).forEach((function(r) {
|
|
740
|
+
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
|
|
741
|
+
}));
|
|
742
|
+
}
|
|
743
|
+
return e;
|
|
744
|
+
}
|
|
745
|
+
function Ne(e, r, t) {
|
|
746
|
+
return (r = _e(r)) in e ? Object.defineProperty(e, r, {
|
|
747
|
+
value: t,
|
|
748
|
+
enumerable: !0,
|
|
749
|
+
configurable: !0,
|
|
750
|
+
writable: !0
|
|
751
|
+
}) : e[r] = t, e;
|
|
752
|
+
}
|
|
753
|
+
function _e(e) {
|
|
754
|
+
var r = Ve(e, "string");
|
|
755
|
+
return "symbol" == Se(r) ? r : r + "";
|
|
756
|
+
}
|
|
757
|
+
function Ve(e, r) {
|
|
758
|
+
if ("object" != Se(e) || !e) return e;
|
|
759
|
+
var t = e[Symbol.toPrimitive];
|
|
760
|
+
if (void 0 !== t) {
|
|
761
|
+
var n = t.call(e, r || "default");
|
|
762
|
+
if ("object" != Se(n)) return n;
|
|
763
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
764
|
+
}
|
|
765
|
+
return ("string" === r ? String : Number)(e);
|
|
766
|
+
}
|
|
767
|
+
function De(e, r) {
|
|
716
768
|
if (null == e) return {};
|
|
717
|
-
var t, n, a =
|
|
769
|
+
var t, n, a = Be(e, r);
|
|
718
770
|
if (Object.getOwnPropertySymbols) {
|
|
719
771
|
var l = Object.getOwnPropertySymbols(e);
|
|
720
772
|
for (n = 0; n < l.length; n++) {
|
|
@@ -723,7 +775,7 @@
|
|
|
723
775
|
}
|
|
724
776
|
return a;
|
|
725
777
|
}
|
|
726
|
-
function
|
|
778
|
+
function Be(e, r) {
|
|
727
779
|
if (null == e) return {};
|
|
728
780
|
var t = {};
|
|
729
781
|
for (var n in e) {
|
|
@@ -735,7 +787,7 @@
|
|
|
735
787
|
return t;
|
|
736
788
|
}
|
|
737
789
|
/** @public */
|
|
738
|
-
/** @public */ var
|
|
790
|
+
/** @public */ var Me = {
|
|
739
791
|
children: l().node,
|
|
740
792
|
controlled: l().bool,
|
|
741
793
|
elementRef: l().oneOfType([ l().func, l().object ]),
|
|
@@ -748,26 +800,26 @@
|
|
|
748
800
|
label: l().string.isRequired
|
|
749
801
|
})).isRequired
|
|
750
802
|
};
|
|
751
|
-
function
|
|
803
|
+
function Ae(e) {
|
|
752
804
|
var r, a, l, i;
|
|
753
|
-
var
|
|
805
|
+
var u = e.children, s = e.controlled, b = s === void 0 ? false : s, h = e.elementRef, g = e.fill, y = g === void 0 ? false : g, k = e.inline, C = k === void 0 ? false : k, x = e.onChange, w = e.onSelect, R = e.lists, E = De(e, [ "children", "controlled", "elementRef", "fill", "inline", "onChange", "onSelect", "lists" ]);
|
|
754
806
|
// @docs-props-type DualListboxPropsBase
|
|
755
|
-
var
|
|
756
|
-
var
|
|
807
|
+
var j = v()();
|
|
808
|
+
var P = (0, t.useRef)(false);
|
|
757
809
|
(0, t.useEffect)((function() {
|
|
758
|
-
|
|
810
|
+
P.current = true;
|
|
759
811
|
}), []);
|
|
760
812
|
// TODO: Implement shared isControlled hook (SUI-5283).
|
|
761
|
-
var
|
|
813
|
+
var I = (0, t.useRef)(b);
|
|
762
814
|
// List One "Available" Refs
|
|
763
|
-
var
|
|
764
|
-
var
|
|
765
|
-
var
|
|
766
|
-
var
|
|
815
|
+
var L = (0, t.useRef)([]);
|
|
816
|
+
var q = (0, t.useRef)([]);
|
|
817
|
+
var N = (0, t.useRef)();
|
|
818
|
+
var _ = (0, t.useRef)(null);
|
|
767
819
|
var V = (0, t.useRef)([]);
|
|
768
820
|
// List Two "Selected" Refs
|
|
769
|
-
var
|
|
770
|
-
var
|
|
821
|
+
var D = (0, t.useRef)([]);
|
|
822
|
+
var B = (0, t.useRef)([]);
|
|
771
823
|
var M = (0, t.useRef)();
|
|
772
824
|
var A = (0, t.useRef)(null);
|
|
773
825
|
var H = (0, t.useRef)([]);
|
|
@@ -793,18 +845,18 @@
|
|
|
793
845
|
var ne = (r = R[0]) === null || r === void 0 ? void 0 : r.name;
|
|
794
846
|
var ae = (a = R[1]) === null || a === void 0 ? void 0 : a.name;
|
|
795
847
|
var le = (l = R[0]) === null || l === void 0 ? void 0 : l.label;
|
|
796
|
-
var
|
|
848
|
+
var oe = (i = R[1]) === null || i === void 0 ? void 0 : i.label;
|
|
797
849
|
// Copy previous state for uncontrolled render so it's not voided by following value reset
|
|
798
|
-
var ue = new Set(
|
|
850
|
+
var ue = new Set(D.current);
|
|
799
851
|
// This ensures we recapture the indexes after batch moves, but will be refactored when sorting is implemented (SUI-5270).
|
|
800
|
-
|
|
801
|
-
|
|
852
|
+
L.current = [];
|
|
853
|
+
D.current = [];
|
|
802
854
|
V.current = [];
|
|
803
855
|
H.current = [];
|
|
804
856
|
// Clean the data stores before we copy the references into listData
|
|
805
|
-
if (!
|
|
806
|
-
|
|
807
|
-
|
|
857
|
+
if (!P.current || I.current) {
|
|
858
|
+
q.current = [];
|
|
859
|
+
B.current = [];
|
|
808
860
|
J.current = {};
|
|
809
861
|
Y.current = {};
|
|
810
862
|
Q.current = {};
|
|
@@ -812,20 +864,20 @@
|
|
|
812
864
|
var ce = [ {
|
|
813
865
|
options: [],
|
|
814
866
|
matchOptions: V.current,
|
|
815
|
-
values:
|
|
816
|
-
selectedValues:
|
|
817
|
-
activeValue:
|
|
818
|
-
activeFound: !
|
|
867
|
+
values: L.current,
|
|
868
|
+
selectedValues: q.current,
|
|
869
|
+
activeValue: N.current,
|
|
870
|
+
activeFound: !N.current
|
|
819
871
|
}, {
|
|
820
872
|
options: [],
|
|
821
873
|
matchOptions: H.current,
|
|
822
|
-
values:
|
|
823
|
-
selectedValues:
|
|
874
|
+
values: D.current,
|
|
875
|
+
selectedValues: B.current,
|
|
824
876
|
activeValue: M.current,
|
|
825
877
|
activeFound: !M.current
|
|
826
878
|
} ];
|
|
827
|
-
if (!
|
|
828
|
-
t.Children.toArray(
|
|
879
|
+
if (!P.current || I.current) {
|
|
880
|
+
t.Children.toArray(u).filter(t.isValidElement).forEach((function(e) {
|
|
829
881
|
var r = e.props, t = r.value, n = r.label;
|
|
830
882
|
var a = e.props.listName === ae;
|
|
831
883
|
var l = ce[a ? 1 : 0];
|
|
@@ -848,7 +900,7 @@
|
|
|
848
900
|
Q.current[t] = e.props.id;
|
|
849
901
|
}));
|
|
850
902
|
} else {
|
|
851
|
-
t.Children.toArray(
|
|
903
|
+
t.Children.toArray(u).filter(t.isValidElement).forEach((function(e) {
|
|
852
904
|
var r = e.props, t = r.value, n = r.label;
|
|
853
905
|
var a = ue.has(t);
|
|
854
906
|
var l = ce[a ? 1 : 0];
|
|
@@ -863,28 +915,28 @@
|
|
|
863
915
|
}
|
|
864
916
|
var se = (0, t.useCallback)((function(e, r) {
|
|
865
917
|
if (e === ne) {
|
|
866
|
-
|
|
918
|
+
N.current = r;
|
|
867
919
|
} else {
|
|
868
920
|
M.current = r;
|
|
869
921
|
}
|
|
870
922
|
}), [ ne ]);
|
|
871
923
|
var ve = (0, t.useCallback)((function(e) {
|
|
872
|
-
return e === ne ?
|
|
924
|
+
return e === ne ? N.current : M.current;
|
|
873
925
|
}), [ ne ]);
|
|
874
926
|
var fe = (0, t.useCallback)((function(e, r) {
|
|
875
927
|
if (e === ne) {
|
|
876
|
-
|
|
928
|
+
q.current = r;
|
|
877
929
|
} else {
|
|
878
|
-
|
|
930
|
+
B.current = r;
|
|
879
931
|
}
|
|
880
932
|
}), [ ne ]);
|
|
881
933
|
var de = (0, t.useCallback)((function(e) {
|
|
882
|
-
return e === ne ?
|
|
934
|
+
return e === ne ? q.current : B.current;
|
|
883
935
|
}), [ ne ]);
|
|
884
|
-
var
|
|
936
|
+
var be = (0, t.useCallback)((function(e) {
|
|
885
937
|
return de(e).length;
|
|
886
938
|
}), [ de ]);
|
|
887
|
-
var
|
|
939
|
+
var me = (0, t.useCallback)((function() {
|
|
888
940
|
return G.current;
|
|
889
941
|
}), []);
|
|
890
942
|
var he = (0, t.useCallback)((function(e) {
|
|
@@ -892,63 +944,63 @@
|
|
|
892
944
|
}), []);
|
|
893
945
|
var ge = (0, t.useCallback)((function(e, r) {
|
|
894
946
|
if (e === ne) {
|
|
895
|
-
|
|
947
|
+
L.current = r;
|
|
896
948
|
} else {
|
|
897
|
-
|
|
949
|
+
D.current = r;
|
|
898
950
|
}
|
|
899
951
|
}), [ ne ]);
|
|
900
952
|
var ye = (0, t.useCallback)((function(e) {
|
|
901
|
-
return e === ne ?
|
|
953
|
+
return e === ne ? L.current : D.current;
|
|
902
954
|
}), [ ne ]);
|
|
903
|
-
var
|
|
955
|
+
var Ce = (0, t.useCallback)((function(e) {
|
|
904
956
|
return ye(e).length;
|
|
905
957
|
}), [ ye ]);
|
|
906
|
-
var
|
|
907
|
-
var r =
|
|
908
|
-
return r > 0 && r ===
|
|
909
|
-
}), [
|
|
910
|
-
var
|
|
958
|
+
var Se = (0, t.useCallback)((function(e) {
|
|
959
|
+
var r = Ce(e);
|
|
960
|
+
return r > 0 && r === be(e);
|
|
961
|
+
}), [ Ce, be ]);
|
|
962
|
+
var Re = (0, t.useCallback)((function(e) {
|
|
911
963
|
return e === ne ? V.current : H.current;
|
|
912
964
|
}), [ ne ]);
|
|
913
965
|
var Ee = (0, t.useCallback)((function(e) {
|
|
914
|
-
var r =
|
|
915
|
-
var t =
|
|
966
|
+
var r = Ce(e);
|
|
967
|
+
var t = be(e);
|
|
916
968
|
return {
|
|
917
969
|
disabled: r < 1 || t < 1
|
|
918
970
|
};
|
|
919
|
-
}), [
|
|
920
|
-
var
|
|
971
|
+
}), [ Ce, be ]);
|
|
972
|
+
var je = (0, t.useCallback)((function() {
|
|
921
973
|
if (G.current && G.current.length > 0) {
|
|
922
974
|
var e;
|
|
923
975
|
G.current = "";
|
|
924
976
|
(e = X.current) === null || e === void 0 ? void 0 : e.call(X);
|
|
925
977
|
}
|
|
926
978
|
}), []);
|
|
927
|
-
var
|
|
979
|
+
var Pe = (0, t.useCallback)((function() {
|
|
928
980
|
ee.current = undefined;
|
|
929
981
|
te.current = [];
|
|
930
982
|
if (re.current) {
|
|
931
983
|
clearTimeout(re.current);
|
|
932
984
|
}
|
|
933
985
|
}), []);
|
|
934
|
-
var
|
|
986
|
+
var Ie = (0, t.useCallback)((function(e) {
|
|
935
987
|
X.current = e;
|
|
936
988
|
}), []);
|
|
937
|
-
var
|
|
989
|
+
var Le = (0, t.useCallback)((function(e, r) {
|
|
938
990
|
if (r) {
|
|
939
991
|
W.current[e] = r;
|
|
940
992
|
} else {
|
|
941
993
|
delete W.current[e];
|
|
942
994
|
}
|
|
943
995
|
}), []);
|
|
944
|
-
var
|
|
996
|
+
var Ne = (0, t.useCallback)((function(e, r) {
|
|
945
997
|
if (r) {
|
|
946
998
|
K.current[e] = r;
|
|
947
999
|
} else {
|
|
948
1000
|
delete K.current[e];
|
|
949
1001
|
}
|
|
950
1002
|
}), []);
|
|
951
|
-
var
|
|
1003
|
+
var _e = (0, t.useCallback)((function(e, r) {
|
|
952
1004
|
if (r) {
|
|
953
1005
|
T.current[e] = r;
|
|
954
1006
|
} else {
|
|
@@ -967,21 +1019,21 @@
|
|
|
967
1019
|
(r = (t = K.current)[e]) === null || r === void 0 ? void 0 : r.call(t);
|
|
968
1020
|
}
|
|
969
1021
|
}), []);
|
|
970
|
-
var
|
|
1022
|
+
var Me = (0, t.useCallback)((function(e) {
|
|
971
1023
|
if (e) {
|
|
972
1024
|
var r, t;
|
|
973
1025
|
(r = (t = T.current)[e]) === null || r === void 0 ? void 0 : r.call(t);
|
|
974
1026
|
}
|
|
975
1027
|
}), []);
|
|
976
|
-
var
|
|
977
|
-
|
|
1028
|
+
var Ae = (0, t.useCallback)((function(e) {
|
|
1029
|
+
je();
|
|
978
1030
|
Be(e);
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
}), [
|
|
982
|
-
var
|
|
1031
|
+
Me(ne);
|
|
1032
|
+
Me(ae);
|
|
1033
|
+
}), [ je, Me, Be, ne, ae ]);
|
|
1034
|
+
var He = (0, t.useCallback)((function(e, r) {
|
|
983
1035
|
var t = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
984
|
-
var n = e === ne ?
|
|
1036
|
+
var n = e === ne ? _.current : A.current;
|
|
985
1037
|
if (!n) {
|
|
986
1038
|
return;
|
|
987
1039
|
}
|
|
@@ -1005,36 +1057,35 @@
|
|
|
1005
1057
|
}
|
|
1006
1058
|
}
|
|
1007
1059
|
}), [ ve, se, Ve, ne ]);
|
|
1008
|
-
var
|
|
1060
|
+
var Te = (0, t.useCallback)((function(e, r) {
|
|
1009
1061
|
var t = r.value, n = r.name;
|
|
1010
|
-
var a =
|
|
1062
|
+
var a = Se(n) ? ye(n) : de(n);
|
|
1011
1063
|
var l = $(a, t);
|
|
1012
|
-
if (!
|
|
1064
|
+
if (!I.current) {
|
|
1013
1065
|
J.current[t] = !J.current[t];
|
|
1014
1066
|
fe(n, l);
|
|
1015
|
-
|
|
1067
|
+
Ae(n);
|
|
1016
1068
|
}
|
|
1017
|
-
|
|
1018
|
-
e
|
|
1019
|
-
O === null || O === void 0 ? void 0 : O(e, {
|
|
1069
|
+
He(n, t);
|
|
1070
|
+
w === null || w === void 0 ? void 0 : w(e, {
|
|
1020
1071
|
values: l,
|
|
1021
1072
|
listName: n
|
|
1022
1073
|
});
|
|
1023
|
-
}), [
|
|
1024
|
-
var
|
|
1074
|
+
}), [ Se, de, ye, fe, He, Ae, w ]);
|
|
1075
|
+
var Ke = (0, t.useCallback)((function(e, r) {
|
|
1025
1076
|
var t = r.initialIndex, n = r.name, a = r.targetIndex;
|
|
1026
1077
|
var l = ye(n);
|
|
1027
1078
|
var i = Math.min(t, a);
|
|
1028
|
-
var
|
|
1029
|
-
var
|
|
1030
|
-
if (
|
|
1031
|
-
|
|
1079
|
+
var o = Math.max(t, a);
|
|
1080
|
+
var u = [];
|
|
1081
|
+
if (I.current) {
|
|
1082
|
+
u = l.slice(i, o + 1);
|
|
1032
1083
|
} else {
|
|
1033
1084
|
l.forEach((function(e, r) {
|
|
1034
1085
|
var t = false;
|
|
1035
|
-
if (r >= i && r <=
|
|
1086
|
+
if (r >= i && r <= o) {
|
|
1036
1087
|
t = true;
|
|
1037
|
-
|
|
1088
|
+
u.push(e);
|
|
1038
1089
|
} else {
|
|
1039
1090
|
t = false;
|
|
1040
1091
|
}
|
|
@@ -1043,23 +1094,23 @@
|
|
|
1043
1094
|
Ve(e);
|
|
1044
1095
|
}
|
|
1045
1096
|
}));
|
|
1046
|
-
fe(n,
|
|
1047
|
-
|
|
1097
|
+
fe(n, u);
|
|
1098
|
+
Ae(n);
|
|
1048
1099
|
}
|
|
1049
|
-
|
|
1100
|
+
He(n, l[a]);
|
|
1050
1101
|
e.preventDefault();
|
|
1051
1102
|
e.stopPropagation();
|
|
1052
|
-
|
|
1053
|
-
values:
|
|
1103
|
+
w === null || w === void 0 ? void 0 : w(e, {
|
|
1104
|
+
values: u,
|
|
1054
1105
|
listName: n
|
|
1055
1106
|
});
|
|
1056
|
-
}), [ ye,
|
|
1057
|
-
var
|
|
1107
|
+
}), [ ye, w, fe, He, Ae, Ve ]);
|
|
1108
|
+
var Fe = (0, t.useCallback)((function(e, r) {
|
|
1058
1109
|
var t = r.name, n = r.selected;
|
|
1059
1110
|
var a = ye(t);
|
|
1060
1111
|
var l = n === true ? [] : a;
|
|
1061
1112
|
var i = n !== true;
|
|
1062
|
-
if (!
|
|
1113
|
+
if (!I.current) {
|
|
1063
1114
|
a === null || a === void 0 ? void 0 : a.forEach((function(e) {
|
|
1064
1115
|
if (J.current[e] !== i) {
|
|
1065
1116
|
J.current[e] = i;
|
|
@@ -1067,46 +1118,45 @@
|
|
|
1067
1118
|
}
|
|
1068
1119
|
}));
|
|
1069
1120
|
fe(t, l);
|
|
1070
|
-
|
|
1121
|
+
Ae(t);
|
|
1071
1122
|
}
|
|
1072
|
-
e
|
|
1073
|
-
O === null || O === void 0 ? void 0 : O(e, {
|
|
1123
|
+
w === null || w === void 0 ? void 0 : w(e, {
|
|
1074
1124
|
values: l,
|
|
1075
1125
|
listName: t
|
|
1076
1126
|
});
|
|
1077
|
-
}), [ ye,
|
|
1127
|
+
}), [ ye, w, fe, Ae, Ve ]);
|
|
1078
1128
|
// handleMoveValues does not update the active value of the source, keyboard and mouse differ, only the target active value is updated
|
|
1079
|
-
var
|
|
1129
|
+
var $e = (0, t.useCallback)((function(e, r, t) {
|
|
1080
1130
|
var n = ye(r);
|
|
1081
1131
|
var a = de(r);
|
|
1082
|
-
var l =
|
|
1132
|
+
var l = Se(r);
|
|
1083
1133
|
var i = ye(t);
|
|
1084
|
-
var
|
|
1134
|
+
var o = ve(t);
|
|
1085
1135
|
if (n.length === 0 || !l && a.length === 0) {
|
|
1086
1136
|
return;
|
|
1087
1137
|
}
|
|
1088
|
-
if (!
|
|
1138
|
+
if (!o && a.length > 0) {
|
|
1089
1139
|
// target lacks an active value, default to the first
|
|
1090
1140
|
// skip the render it will be catch in batch
|
|
1091
|
-
|
|
1141
|
+
He(t, a[0], true);
|
|
1092
1142
|
}
|
|
1093
|
-
var
|
|
1143
|
+
var u = (0, f.sprintf)((0, d._)("Moved %(count)d items to %(listLabel)s list"), {
|
|
1094
1144
|
count: a.length,
|
|
1095
|
-
listLabel: t === ne ? le :
|
|
1145
|
+
listLabel: t === ne ? le : oe
|
|
1096
1146
|
});
|
|
1097
1147
|
// These new values do not perserve sort position, may need to be refactored with sort logic (SUI-5270).
|
|
1098
1148
|
var c = l ? [] : z(n, a);
|
|
1099
1149
|
var s = i.concat(a);
|
|
1100
|
-
if (!
|
|
1150
|
+
if (!I.current) {
|
|
1101
1151
|
a.forEach((function(e) {
|
|
1102
1152
|
J.current[e] = false;
|
|
1103
1153
|
}));
|
|
1104
1154
|
ge(t, s);
|
|
1105
1155
|
ge(r, c);
|
|
1106
1156
|
fe(r, []);
|
|
1107
|
-
G.current =
|
|
1157
|
+
G.current = u;
|
|
1108
1158
|
// move is a batch update, force a full render, no internal update needed
|
|
1109
|
-
|
|
1159
|
+
j();
|
|
1110
1160
|
}
|
|
1111
1161
|
var v = {
|
|
1112
1162
|
affectedValues: a,
|
|
@@ -1114,44 +1164,48 @@
|
|
|
1114
1164
|
sourceValues: c,
|
|
1115
1165
|
targetListName: t || "",
|
|
1116
1166
|
targetValues: s,
|
|
1117
|
-
screenReaderMessage:
|
|
1167
|
+
screenReaderMessage: u || "",
|
|
1118
1168
|
values: a.slice()
|
|
1119
1169
|
};
|
|
1120
1170
|
e.preventDefault();
|
|
1121
|
-
|
|
1122
|
-
}), [
|
|
1123
|
-
var
|
|
1171
|
+
x === null || x === void 0 ? void 0 : x(e, v);
|
|
1172
|
+
}), [ j, ve, Se, de, ye, x, fe, ge, He, ne, le, oe ]);
|
|
1173
|
+
var ze = (0, t.useCallback)((function(e, r) {
|
|
1124
1174
|
var t = r.name;
|
|
1125
|
-
var n =
|
|
1175
|
+
var n = Se(t);
|
|
1126
1176
|
var a = ve(t);
|
|
1127
1177
|
var l = t === ne ? ae : ne;
|
|
1128
1178
|
if (a && (n || !!J.current[a])) {
|
|
1129
1179
|
// active option was present in items to be removed, clear the active option
|
|
1130
|
-
|
|
1180
|
+
He(t);
|
|
1131
1181
|
}
|
|
1132
|
-
|
|
1133
|
-
}), [ ve,
|
|
1134
|
-
var
|
|
1182
|
+
$e(e, t, l);
|
|
1183
|
+
}), [ ve, Se, $e, He, ne, ae ]);
|
|
1184
|
+
var Ue = (0, t.useCallback)((function(e, r) {
|
|
1135
1185
|
var t = r.name, n = r.value;
|
|
1136
1186
|
if (e.nativeEvent.shiftKey) {
|
|
1137
|
-
|
|
1187
|
+
Ke(e, {
|
|
1138
1188
|
targetIndex: Y.current[n],
|
|
1139
1189
|
initialIndex: Z.current,
|
|
1140
1190
|
name: t
|
|
1141
1191
|
});
|
|
1142
1192
|
} else {
|
|
1143
|
-
|
|
1193
|
+
Te(e, {
|
|
1144
1194
|
name: t,
|
|
1145
1195
|
value: n
|
|
1146
1196
|
});
|
|
1147
1197
|
}
|
|
1148
|
-
}), [
|
|
1149
|
-
var Ue = (0, t.useCallback)((function(e, r) {
|
|
1150
|
-
Ke(e, r);
|
|
1151
|
-
}), [ Ke ]);
|
|
1198
|
+
}), [ Ke, Te ]);
|
|
1152
1199
|
var We = (0, t.useCallback)((function(e, r) {
|
|
1200
|
+
var t = r.selected, n = De(r, [ "selected" ]);
|
|
1201
|
+
// flip selected here because handleSelectAll expects "selected" to be the current state but Checkbox reports the new state
|
|
1202
|
+
Fe(e, qe({
|
|
1203
|
+
selected: !t
|
|
1204
|
+
}, n));
|
|
1205
|
+
}), [ Fe ]);
|
|
1206
|
+
var Xe = (0, t.useCallback)((function(e, r) {
|
|
1153
1207
|
var t = e.nativeEvent.key;
|
|
1154
|
-
var n =
|
|
1208
|
+
var n = Re(r);
|
|
1155
1209
|
// Checking for a single character to avoid complications from double-byte languages and emojis.
|
|
1156
1210
|
if (t.length === 1) {
|
|
1157
1211
|
var a = [];
|
|
@@ -1161,51 +1215,51 @@
|
|
|
1161
1215
|
};
|
|
1162
1216
|
if (!ee.current) {
|
|
1163
1217
|
if (t === " ") {
|
|
1164
|
-
|
|
1218
|
+
Pe();
|
|
1165
1219
|
return;
|
|
1166
1220
|
}
|
|
1167
|
-
a =
|
|
1221
|
+
a = Oe(n, l);
|
|
1168
1222
|
} else if (te.current.length > 1) {
|
|
1169
1223
|
l.index = ee.current.index + 1;
|
|
1170
|
-
a =
|
|
1224
|
+
a = Oe(te.current, l);
|
|
1171
1225
|
}
|
|
1172
1226
|
if (a.length) {
|
|
1173
1227
|
var i = 0;
|
|
1174
1228
|
// If the active option is a first character match, cycle to the next matching option.
|
|
1175
1229
|
if (l.index === 0 && a.length > 1) {
|
|
1176
|
-
var
|
|
1177
|
-
if (
|
|
1178
|
-
var
|
|
1179
|
-
return e.value ===
|
|
1230
|
+
var o = ve(r);
|
|
1231
|
+
if (o) {
|
|
1232
|
+
var u = a.findIndex((function(e) {
|
|
1233
|
+
return e.value === o;
|
|
1180
1234
|
}));
|
|
1181
|
-
if (
|
|
1182
|
-
i =
|
|
1235
|
+
if (u >= 0) {
|
|
1236
|
+
i = u === a.length - 1 ? 0 : u + 1;
|
|
1183
1237
|
}
|
|
1184
1238
|
}
|
|
1185
1239
|
}
|
|
1186
|
-
|
|
1240
|
+
He(r, a[i].value);
|
|
1187
1241
|
}
|
|
1188
1242
|
te.current = a;
|
|
1189
1243
|
ee.current = l;
|
|
1190
1244
|
if (re.current) {
|
|
1191
1245
|
clearTimeout(re.current);
|
|
1192
1246
|
}
|
|
1193
|
-
re.current = setTimeout(
|
|
1247
|
+
re.current = setTimeout(Pe, 500);
|
|
1194
1248
|
e.preventDefault();
|
|
1195
1249
|
e.stopPropagation();
|
|
1196
1250
|
}
|
|
1197
|
-
}), [ ve,
|
|
1198
|
-
var
|
|
1251
|
+
}), [ ve, Re, Pe, He ]);
|
|
1252
|
+
var Ge = (0, t.useCallback)((function(e, r) {
|
|
1199
1253
|
var t = r.name;
|
|
1200
1254
|
var n = e.ctrlKey, a = e.key, l = e.metaKey, i = e.shiftKey;
|
|
1201
|
-
var
|
|
1202
|
-
var
|
|
1203
|
-
var c =
|
|
1255
|
+
var o = ye(t);
|
|
1256
|
+
var u = de(t);
|
|
1257
|
+
var c = Se(t);
|
|
1204
1258
|
var s = ve(t);
|
|
1205
1259
|
var v = s ? Y.current[s] : -1;
|
|
1206
1260
|
var f = Z.current >= 0 ? Z.current : 0;
|
|
1207
1261
|
if (G.current && G.current.length > 0) {
|
|
1208
|
-
|
|
1262
|
+
je();
|
|
1209
1263
|
}
|
|
1210
1264
|
var d = s;
|
|
1211
1265
|
switch (a) {
|
|
@@ -1216,13 +1270,13 @@
|
|
|
1216
1270
|
case "Home":
|
|
1217
1271
|
if (n && i) {
|
|
1218
1272
|
// handle select until start
|
|
1219
|
-
|
|
1273
|
+
Ke(e, {
|
|
1220
1274
|
targetIndex: 0,
|
|
1221
1275
|
initialIndex: f,
|
|
1222
1276
|
name: t
|
|
1223
1277
|
});
|
|
1224
1278
|
} else {
|
|
1225
|
-
var p =
|
|
1279
|
+
var p = we(o, 1);
|
|
1226
1280
|
d = p[0];
|
|
1227
1281
|
}
|
|
1228
1282
|
break;
|
|
@@ -1230,45 +1284,45 @@
|
|
|
1230
1284
|
case "End":
|
|
1231
1285
|
if (n && i) {
|
|
1232
1286
|
// handle select until end
|
|
1233
|
-
|
|
1234
|
-
targetIndex:
|
|
1287
|
+
Ke(e, {
|
|
1288
|
+
targetIndex: o.length - 1,
|
|
1235
1289
|
initialIndex: f,
|
|
1236
1290
|
name: t
|
|
1237
1291
|
});
|
|
1238
1292
|
} else {
|
|
1239
|
-
d =
|
|
1293
|
+
d = o[o.length - 1];
|
|
1240
1294
|
}
|
|
1241
1295
|
break;
|
|
1242
1296
|
|
|
1243
1297
|
case "ArrowUp":
|
|
1244
1298
|
if (i) {
|
|
1245
1299
|
// handle select until previous
|
|
1246
|
-
|
|
1300
|
+
Ke(e, {
|
|
1247
1301
|
targetIndex: Math.max(v - 1, 0),
|
|
1248
1302
|
initialIndex: f,
|
|
1249
1303
|
name: t
|
|
1250
1304
|
});
|
|
1251
1305
|
} else {
|
|
1252
|
-
d =
|
|
1306
|
+
d = o[Math.max(v - 1, 0)];
|
|
1253
1307
|
}
|
|
1254
1308
|
break;
|
|
1255
1309
|
|
|
1256
1310
|
case "ArrowDown":
|
|
1257
1311
|
if (i) {
|
|
1258
1312
|
// handle select until next
|
|
1259
|
-
|
|
1260
|
-
targetIndex: Math.min(v + 1,
|
|
1313
|
+
Ke(e, {
|
|
1314
|
+
targetIndex: Math.min(v + 1, o.length - 1),
|
|
1261
1315
|
initialIndex: f,
|
|
1262
1316
|
name: t
|
|
1263
1317
|
});
|
|
1264
1318
|
} else {
|
|
1265
|
-
d =
|
|
1319
|
+
d = o[Math.min(v + 1, o.length - 1)];
|
|
1266
1320
|
}
|
|
1267
1321
|
break;
|
|
1268
1322
|
|
|
1269
1323
|
case " ":
|
|
1270
1324
|
if (s != null) {
|
|
1271
|
-
|
|
1325
|
+
Te(e, {
|
|
1272
1326
|
name: t,
|
|
1273
1327
|
value: s
|
|
1274
1328
|
});
|
|
@@ -1280,11 +1334,11 @@
|
|
|
1280
1334
|
if (c) {
|
|
1281
1335
|
// all values moved, no longer an active value
|
|
1282
1336
|
d = undefined;
|
|
1283
|
-
} else if (
|
|
1337
|
+
} else if (u.length > 0) {
|
|
1284
1338
|
// somes values moved, determine next active value
|
|
1285
|
-
d = U(v,
|
|
1339
|
+
d = U(v, o, u);
|
|
1286
1340
|
}
|
|
1287
|
-
|
|
1341
|
+
$e(e, ne, ae);
|
|
1288
1342
|
}
|
|
1289
1343
|
break;
|
|
1290
1344
|
|
|
@@ -1293,99 +1347,101 @@
|
|
|
1293
1347
|
if (c) {
|
|
1294
1348
|
// all values moved, no longer an active value
|
|
1295
1349
|
d = undefined;
|
|
1296
|
-
} else if (
|
|
1350
|
+
} else if (u.length > 0) {
|
|
1297
1351
|
// somes values moved, determine next active value
|
|
1298
|
-
d = U(v,
|
|
1352
|
+
d = U(v, o, u);
|
|
1299
1353
|
}
|
|
1300
|
-
|
|
1354
|
+
$e(e, ae, ne);
|
|
1301
1355
|
}
|
|
1302
1356
|
break;
|
|
1303
1357
|
|
|
1304
1358
|
default:
|
|
1305
1359
|
if (a === "a" && (n || l)) {
|
|
1360
|
+
// prevent text selection when using control/meta + A
|
|
1361
|
+
e.preventDefault();
|
|
1306
1362
|
// handle control + A, otherwise let 'a' passthrough
|
|
1307
|
-
|
|
1363
|
+
Fe(e, {
|
|
1308
1364
|
name: t,
|
|
1309
1365
|
selected: c
|
|
1310
1366
|
});
|
|
1311
1367
|
} else {
|
|
1312
1368
|
// do fuzzy match
|
|
1313
|
-
|
|
1369
|
+
Xe(e, t);
|
|
1314
1370
|
}
|
|
1315
1371
|
break;
|
|
1316
1372
|
}
|
|
1317
1373
|
if (d !== s) {
|
|
1318
1374
|
e.preventDefault();
|
|
1319
|
-
|
|
1375
|
+
He(t, d);
|
|
1320
1376
|
}
|
|
1321
|
-
}), [
|
|
1322
|
-
var
|
|
1377
|
+
}), [ je, ve, Se, de, ye, Xe, $e, Ke, Te, Fe, He, ne, ae ]);
|
|
1378
|
+
var Je = (0, t.useMemo)((function() {
|
|
1323
1379
|
return {
|
|
1324
|
-
onButtonClick:
|
|
1325
|
-
updateButtonRefreshHookByName:
|
|
1380
|
+
onButtonClick: ze,
|
|
1381
|
+
updateButtonRefreshHookByName: _e,
|
|
1326
1382
|
getButtonState: Ee
|
|
1327
1383
|
};
|
|
1328
|
-
}), [
|
|
1329
|
-
var
|
|
1384
|
+
}), [ ze, _e, Ee ]);
|
|
1385
|
+
var Qe = (0, t.useMemo)((function() {
|
|
1330
1386
|
return {
|
|
1331
|
-
controlled:
|
|
1387
|
+
controlled: I.current,
|
|
1332
1388
|
getActiveValue: ve,
|
|
1333
|
-
getScreenReaderMessage:
|
|
1389
|
+
getScreenReaderMessage: me,
|
|
1334
1390
|
getSelectedStateForValue: he,
|
|
1335
|
-
getSelectedValueCount:
|
|
1336
|
-
getValueCount:
|
|
1337
|
-
updateLabelRefreshHookByName:
|
|
1338
|
-
updateOptionRefreshHookByValue:
|
|
1339
|
-
updateScreenReaderRefreshHook:
|
|
1391
|
+
getSelectedValueCount: be,
|
|
1392
|
+
getValueCount: Ce,
|
|
1393
|
+
updateLabelRefreshHookByName: Ne,
|
|
1394
|
+
updateOptionRefreshHookByValue: Le,
|
|
1395
|
+
updateScreenReaderRefreshHook: Ie
|
|
1340
1396
|
};
|
|
1341
|
-
}), [ ve,
|
|
1342
|
-
if (
|
|
1397
|
+
}), [ ve, me, he, be, Ce, Ne, Le, Ie ]);
|
|
1398
|
+
if (I.current && !ce[0].activeFound) {
|
|
1343
1399
|
// listOne active value wasn't found, likely the result of a controlled state reset
|
|
1344
1400
|
// update interal values, skip the render it will be caught in batch
|
|
1345
|
-
|
|
1401
|
+
He(ne, undefined, true);
|
|
1346
1402
|
}
|
|
1347
|
-
if (
|
|
1403
|
+
if (I.current && !ce[1].activeFound) {
|
|
1348
1404
|
// listTwo active value wasn't found, likely the result of a controlled state reset
|
|
1349
1405
|
// update interal values, skip the render it will be caught in batch
|
|
1350
|
-
|
|
1406
|
+
He(ae, undefined, true);
|
|
1351
1407
|
}
|
|
1352
1408
|
|
|
1353
|
-
return n().createElement(
|
|
1409
|
+
return n().createElement(O, xe({
|
|
1354
1410
|
"data-test": "dual-listbox",
|
|
1355
1411
|
elementRef: h,
|
|
1356
1412
|
$inline: y ? false : C,
|
|
1357
1413
|
$fill: y
|
|
1358
1414
|
}, E), n().createElement(m.Provider, {
|
|
1359
|
-
value:
|
|
1415
|
+
value: Qe
|
|
1360
1416
|
}, n().createElement(F, {
|
|
1361
1417
|
index: 0,
|
|
1362
|
-
elementRef:
|
|
1418
|
+
elementRef: _,
|
|
1363
1419
|
label: le,
|
|
1364
1420
|
name: ne,
|
|
1365
|
-
onClick:
|
|
1366
|
-
onKeyDown:
|
|
1367
|
-
onSelectAllClick:
|
|
1368
|
-
}, ce[0].options), n().createElement(
|
|
1369
|
-
value:
|
|
1370
|
-
}, n().createElement(
|
|
1421
|
+
onClick: Ue,
|
|
1422
|
+
onKeyDown: Ge,
|
|
1423
|
+
onSelectAllClick: We
|
|
1424
|
+
}, ce[0].options), n().createElement(S, null, n().createElement(pe.Provider, {
|
|
1425
|
+
value: Je
|
|
1426
|
+
}, n().createElement(ke, {
|
|
1371
1427
|
ariaLabel: (0, f.sprintf)((0, d._)("Move selected options to %(listLabel)s list"), {
|
|
1372
|
-
listLabel:
|
|
1428
|
+
listLabel: oe
|
|
1373
1429
|
}),
|
|
1374
1430
|
ariaKeyShortcuts: "Enter",
|
|
1375
1431
|
"data-test": "move-to-secondary",
|
|
1376
1432
|
icon: n().createElement(c(), null),
|
|
1377
1433
|
name: ne,
|
|
1378
1434
|
tooltipLabel: (0, f.sprintf)((0, d._)("Move to %(listLabel)s"), {
|
|
1379
|
-
listLabel:
|
|
1435
|
+
listLabel: oe
|
|
1380
1436
|
}),
|
|
1381
1437
|
tooltipPlacement: "left"
|
|
1382
|
-
}), n().createElement(
|
|
1438
|
+
}), n().createElement(ke, {
|
|
1383
1439
|
ariaLabel: (0, f.sprintf)((0, d._)("Move selected options to %(listLabel)s list"), {
|
|
1384
1440
|
listLabel: le
|
|
1385
1441
|
}),
|
|
1386
1442
|
ariaKeyShortcuts: "Delete",
|
|
1387
1443
|
"data-test": "move-to-primary",
|
|
1388
|
-
icon: n().createElement(
|
|
1444
|
+
icon: n().createElement(o(), null),
|
|
1389
1445
|
name: ae,
|
|
1390
1446
|
tooltipLabel: (0, f.sprintf)((0, d._)("Move to %(listLabel)s"), {
|
|
1391
1447
|
listLabel: le
|
|
@@ -1394,16 +1450,16 @@
|
|
|
1394
1450
|
}))), n().createElement(F, {
|
|
1395
1451
|
index: 1,
|
|
1396
1452
|
elementRef: A,
|
|
1397
|
-
label:
|
|
1453
|
+
label: oe,
|
|
1398
1454
|
name: ae,
|
|
1399
|
-
onClick:
|
|
1400
|
-
onKeyDown:
|
|
1401
|
-
onSelectAllClick:
|
|
1402
|
-
}, ce[1].options), n().createElement(
|
|
1455
|
+
onClick: Ue,
|
|
1456
|
+
onKeyDown: Ge,
|
|
1457
|
+
onSelectAllClick: We
|
|
1458
|
+
}, ce[1].options), n().createElement(ie, null)));
|
|
1403
1459
|
}
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
/* harmony default export */ const
|
|
1460
|
+
Ae.propTypes = Me;
|
|
1461
|
+
Ae.Option = ne;
|
|
1462
|
+
/* harmony default export */ const He = Ae;
|
|
1407
1463
|
// CONCATENATED MODULE: ./src/DualListbox/index.ts
|
|
1408
1464
|
module.exports = r;
|
|
1409
1465
|
/******/})();
|