@splunk/react-ui 5.7.1 → 5.8.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 +6 -6
- package/Box.js +83 -34
- package/CHANGELOG.md +29 -0
- package/CollapsiblePanel.js +11 -11
- package/ComboBox.js +31 -27
- package/ControlGroup.js +92 -91
- package/DefinitionList.js +9 -9
- package/Drawer.d.ts +2 -0
- package/Drawer.js +679 -0
- package/DualListbox.js +1 -1
- package/JSONTree.js +73 -72
- package/Link.js +2 -2
- package/MIGRATION.md +10 -0
- package/Menu.js +338 -240
- package/Modal.js +127 -109
- package/Multiselect.js +437 -351
- package/Paginator.js +14 -12
- package/Popover.js +4 -1
- package/README.md +11 -0
- package/RadioBar.js +1 -1
- package/Search.js +103 -88
- package/Select.js +42 -40
- package/SelectBase.js +374 -328
- package/SidePanel.js +346 -167
- package/SlidingPanels.js +11 -11
- package/StepBar.js +7 -7
- package/Switch.js +5 -5
- package/Text.js +24 -24
- package/TextArea.js +7 -7
- package/TransitionOpen.js +188 -169
- package/docs-llm/Accordion.md +267 -0
- package/docs-llm/Anchor Menu.md +115 -0
- package/docs-llm/Anchor.md +54 -0
- package/docs-llm/AnimationToggle.md +254 -0
- package/docs-llm/Avatar.md +298 -0
- package/docs-llm/Badge.md +212 -0
- package/docs-llm/Breadcrumbs.md +306 -0
- package/docs-llm/Button Group.md +53 -0
- package/docs-llm/Button.md +361 -0
- package/docs-llm/Card Layout.md +286 -0
- package/docs-llm/Card.md +619 -0
- package/docs-llm/Checkbox.md +218 -0
- package/docs-llm/Chip.md +291 -0
- package/docs-llm/Clickable.md +160 -0
- package/docs-llm/Code.md +292 -0
- package/docs-llm/Collapsible Panel.md +744 -0
- package/docs-llm/Color.md +253 -0
- package/docs-llm/Column Layout.md +391 -0
- package/docs-llm/Combo Box.md +540 -0
- package/docs-llm/Control Group.md +594 -0
- package/docs-llm/Date.md +270 -0
- package/docs-llm/Definition List.md +278 -0
- package/docs-llm/Divider.md +216 -0
- package/docs-llm/Drawer.md +414 -0
- package/docs-llm/Dropdown.md +472 -0
- package/docs-llm/Dual Listbox.md +325 -0
- package/docs-llm/File.md +653 -0
- package/docs-llm/Form Rows.md +374 -0
- package/docs-llm/Heading.md +179 -0
- package/docs-llm/Image.md +109 -0
- package/docs-llm/JSON Tree.md +260 -0
- package/docs-llm/Layer.md +74 -0
- package/docs-llm/Layout.md +50 -0
- package/docs-llm/Link.md +318 -0
- package/docs-llm/List.md +189 -0
- package/docs-llm/Markdown.md +179 -0
- package/docs-llm/Menu.md +735 -0
- package/docs-llm/Message Bar.md +236 -0
- package/docs-llm/Message.md +248 -0
- package/docs-llm/Modal.md +443 -0
- package/docs-llm/Monogram.md +159 -0
- package/docs-llm/Multiselect.md +937 -0
- package/docs-llm/Number.md +298 -0
- package/docs-llm/Paginator.md +395 -0
- package/docs-llm/Paragraph.md +148 -0
- package/docs-llm/Phone Number.md +254 -0
- package/docs-llm/Popover.md +166 -0
- package/docs-llm/Progress.md +141 -0
- package/docs-llm/Radio Bar.md +303 -0
- package/docs-llm/Radio List.md +350 -0
- package/docs-llm/Resize.md +362 -0
- package/docs-llm/Screen Reader Content.md +73 -0
- package/docs-llm/Scroll Container Context.md +155 -0
- package/docs-llm/Scroll.md +152 -0
- package/docs-llm/Search.md +381 -0
- package/docs-llm/Select.md +985 -0
- package/docs-llm/Side Panel.md +777 -0
- package/docs-llm/Slider.md +339 -0
- package/docs-llm/Sliding Panels.md +340 -0
- package/docs-llm/Split Button.md +295 -0
- package/docs-llm/Static Content.md +90 -0
- package/docs-llm/Step Bar.md +292 -0
- package/docs-llm/Switch.md +268 -0
- package/docs-llm/Tab Bar.md +439 -0
- package/docs-llm/Tab Layout.md +398 -0
- package/docs-llm/Table.md +2642 -0
- package/docs-llm/Text Area.md +253 -0
- package/docs-llm/Text.md +339 -0
- package/docs-llm/Tooltip.md +325 -0
- package/docs-llm/Transition Open.md +406 -0
- package/docs-llm/Tree.md +586 -0
- package/docs-llm/Typography.md +125 -0
- package/docs-llm/Wait Spinner.md +121 -0
- package/docs-llm/llms.txt +97 -0
- package/package.json +6 -5
- package/types/src/Box/Box.d.ts +2 -10
- package/types/src/Drawer/Body.d.ts +17 -0
- package/types/src/Drawer/Drawer.d.ts +114 -0
- package/types/src/Drawer/DrawerContext.d.ts +11 -0
- package/types/src/Drawer/Footer.d.ts +25 -0
- package/types/src/Drawer/Header.d.ts +41 -0
- package/types/src/Drawer/docs/examples/Basic.d.ts +6 -0
- package/types/src/Drawer/docs/examples/ContainerPosition.d.ts +7 -0
- package/types/src/Drawer/docs/examples/InitialFocus.d.ts +9 -0
- package/types/src/Drawer/docs/examples/InlinePosition.d.ts +7 -0
- package/types/src/Drawer/docs/examples/PagePosition.d.ts +7 -0
- package/types/src/Drawer/index.d.ts +2 -0
- package/types/src/JSONTree/JSONTree.d.ts +12 -5
- package/types/src/JSONTree/renderTreeItems.d.ts +2 -1
- package/types/src/Menu/Item.d.ts +2 -1
- package/types/src/Menu/docs/examples/SelectableCheckbox.d.ts +7 -0
- package/types/src/Modal/Modal.d.ts +1 -2
- package/types/src/Select/Option.d.ts +6 -3
- package/types/src/Select/Select.d.ts +8 -5
- package/types/src/Select/docs/examples/Dimmed.d.ts +7 -0
- package/types/src/SelectBase/OptionBase.d.ts +6 -3
- package/types/src/SelectBase/SelectBase.d.ts +8 -3
- package/types/src/SidePanel/SidePanel.d.ts +43 -2
- package/types/src/SidePanel/docs/examples/DockLayout.d.ts +17 -0
- package/types/src/SidePanel/docs/examples/InitialFocus.d.ts +9 -0
- package/types/src/TransitionOpen/TransitionOpen.d.ts +29 -4
- package/types/src/useKeyPress/index.d.ts +9 -2
- package/types/src/useOnClickOutside/index.d.ts +2 -0
- package/types/src/useOnClickOutside/useOnClickOutside.d.ts +4 -0
- package/useKeyPress.js +23 -18
- package/useOnClickOutside.d.ts +2 -0
- package/useOnClickOutside.js +79 -0
- package/types/src/RadioList/docs/examples/Row.d.ts +0 -6
package/Paginator.js
CHANGED
|
@@ -500,8 +500,8 @@
|
|
|
500
500
|
}), [ d ]);
|
|
501
501
|
// Can't show more links than total number of pages.
|
|
502
502
|
var h = Math.min(g, v);
|
|
503
|
-
var P =
|
|
504
|
-
var O =
|
|
503
|
+
var P = h;
|
|
504
|
+
var O = v - h + 1;
|
|
505
505
|
var C = [];
|
|
506
506
|
if (v <= 1) {
|
|
507
507
|
return null;
|
|
@@ -512,20 +512,22 @@
|
|
|
512
512
|
* firstPageNearbyCurrent and lastPageNearbyCurrent refer to the page number of the first and last of these buttons.
|
|
513
513
|
*/ var w;
|
|
514
514
|
var k;
|
|
515
|
-
if (u
|
|
516
|
-
// + 1 to avoid ellipsis between 1 and 2
|
|
515
|
+
if (u < P) {
|
|
517
516
|
w = 1;
|
|
518
|
-
k =
|
|
519
|
-
} else if (u
|
|
520
|
-
|
|
521
|
-
|
|
517
|
+
k = h;
|
|
518
|
+
} else if (u >= P && u <= O) {
|
|
519
|
+
w = u - Math.floor((h - 2) / 2);
|
|
520
|
+
k = u + 1 === v ? v : u + Math.ceil((h - 2) / 2);
|
|
522
521
|
} else {
|
|
523
|
-
|
|
524
|
-
w = v - h === 1 ? 1 : v - h + 1;
|
|
522
|
+
w = O;
|
|
525
523
|
k = v;
|
|
526
524
|
}
|
|
527
525
|
// bump up the last page to avoid ellipsis
|
|
528
526
|
k = t && k + 1 === v ? v : k;
|
|
527
|
+
// check to avoid ellipsis between 1 and 2
|
|
528
|
+
if (w === 2) {
|
|
529
|
+
w = 1;
|
|
530
|
+
}
|
|
529
531
|
var E = u - 1;
|
|
530
532
|
C.push( r().createElement(S, ne({}, l === null || l === void 0 ? void 0 : l({
|
|
531
533
|
page: E
|
|
@@ -537,7 +539,7 @@
|
|
|
537
539
|
onClick: y,
|
|
538
540
|
page: E
|
|
539
541
|
}), r().createElement(i(), null), (0, p._)("Prev")));
|
|
540
|
-
if (u
|
|
542
|
+
if (u >= P && v > h && w !== 1) {
|
|
541
543
|
var _ = 1;
|
|
542
544
|
C.push( r().createElement(S, ne({}, l === null || l === void 0 ? void 0 : l({
|
|
543
545
|
page: _
|
|
@@ -567,7 +569,7 @@
|
|
|
567
569
|
page: x
|
|
568
570
|
}), String(x)));
|
|
569
571
|
}
|
|
570
|
-
if (
|
|
572
|
+
if (v > h && k !== v) {
|
|
571
573
|
C.push( r().createElement(ee, {
|
|
572
574
|
"data-test": "page",
|
|
573
575
|
key: "nextEllipsis"
|
package/Popover.js
CHANGED
|
@@ -422,6 +422,8 @@
|
|
|
422
422
|
w = f - r.left;
|
|
423
423
|
}
|
|
424
424
|
}
|
|
425
|
+
// SUI-8136: Set container width as min-width if it fits within viewport, otherwise allow it to shrink to fit
|
|
426
|
+
var R = (S === "above" || S === "below") && i.offsetWidth <= w ? i.offsetWidth : 0;
|
|
425
427
|
return {
|
|
426
428
|
placement: S,
|
|
427
429
|
maxHeight: P,
|
|
@@ -429,7 +431,8 @@
|
|
|
429
431
|
outerContainerStyle: {
|
|
430
432
|
top: b,
|
|
431
433
|
left: g,
|
|
432
|
-
bottom: y
|
|
434
|
+
bottom: y,
|
|
435
|
+
minWidth: R
|
|
433
436
|
}
|
|
434
437
|
};
|
|
435
438
|
}
|
package/README.md
CHANGED
|
@@ -128,3 +128,14 @@ Further reading:
|
|
|
128
128
|
* [styled-components and SC_ATTR](https://styled-components.com/docs/advanced#avoiding-conflicts-with-thirdparty-styles-and-scripts)
|
|
129
129
|
* [styled-components "several instances" warning](https://styled-components.com/docs/faqs#why-am-i-getting-a-warning-about-several-instances-of-module-on-the-page)
|
|
130
130
|
* [Duplicate React](https://reactjs.org/warnings/invalid-hook-call-warning.html#duplicate-react)
|
|
131
|
+
|
|
132
|
+
|
|
133
|
+
## LLM Documentation
|
|
134
|
+
|
|
135
|
+
This package includes AI-optimized documentation in the `docs-llm/` directory for use with AI assistants and tools like MCP servers. These markdown files provide comprehensive component documentation suitable for LLM consumption.
|
|
136
|
+
|
|
137
|
+
- **Location:** `node_modules/@splunk/react-ui/docs-llm/`
|
|
138
|
+
- **Contents:** Component documentation, usage examples, API reference, accessibility guidelines
|
|
139
|
+
- **Format:** Markdown files optimized for AI/LLM processing
|
|
140
|
+
|
|
141
|
+
The LLM documentation mirrors the standard documentation but is formatted specifically for machine consumption, enabling AI assistants to provide accurate guidance on component usage, props, and best practices.
|
package/RadioBar.js
CHANGED
package/Search.js
CHANGED
|
@@ -101,9 +101,9 @@
|
|
|
101
101
|
// CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
|
|
102
102
|
const C = require("@splunk/ui-utils/i18n");
|
|
103
103
|
// CONCATENATED MODULE: external "@splunk/ui-utils/id"
|
|
104
|
-
const
|
|
104
|
+
const k = require("@splunk/ui-utils/id");
|
|
105
105
|
// CONCATENATED MODULE: external "@splunk/ui-utils/keyboard"
|
|
106
|
-
const
|
|
106
|
+
const j = require("@splunk/ui-utils/keyboard");
|
|
107
107
|
// CONCATENATED MODULE: external "@splunk/ui-utils/scroll"
|
|
108
108
|
const P = require("@splunk/ui-utils/scroll");
|
|
109
109
|
// CONCATENATED MODULE: ./src/utils/updateReactRef.ts
|
|
@@ -113,7 +113,7 @@
|
|
|
113
113
|
* @param ref - The React callback or object ref. Can be `null` or `undefined`.
|
|
114
114
|
* @param current - The new value of the ref.
|
|
115
115
|
*/
|
|
116
|
-
function
|
|
116
|
+
function R(e, n) {
|
|
117
117
|
if (e) {
|
|
118
118
|
if (typeof e === "function") {
|
|
119
119
|
e(n);
|
|
@@ -126,8 +126,8 @@
|
|
|
126
126
|
}
|
|
127
127
|
}
|
|
128
128
|
// CONCATENATED MODULE: ./src/Search/Option.tsx
|
|
129
|
-
function
|
|
130
|
-
return
|
|
129
|
+
function I() {
|
|
130
|
+
return I = Object.assign ? Object.assign.bind() : function(e) {
|
|
131
131
|
for (var n = 1; n < arguments.length; n++) {
|
|
132
132
|
var r = arguments[n];
|
|
133
133
|
for (var t in r) {
|
|
@@ -135,7 +135,7 @@
|
|
|
135
135
|
}
|
|
136
136
|
}
|
|
137
137
|
return e;
|
|
138
|
-
},
|
|
138
|
+
}, I.apply(null, arguments);
|
|
139
139
|
}
|
|
140
140
|
function M(e, n) {
|
|
141
141
|
if (null == e) return {};
|
|
@@ -193,11 +193,11 @@
|
|
|
193
193
|
}
|
|
194
194
|
}), [ l, f, m, g ]);
|
|
195
195
|
var S = (0, r.useCallback)((function(e) {
|
|
196
|
-
|
|
196
|
+
R(u, e);
|
|
197
197
|
}), [ u ]);
|
|
198
198
|
var w = s === undefined ? g : s;
|
|
199
199
|
|
|
200
|
-
return t().createElement(p.Item,
|
|
200
|
+
return t().createElement(p.Item, I({
|
|
201
201
|
active: n,
|
|
202
202
|
"data-test": "search-option",
|
|
203
203
|
"data-test-value": g,
|
|
@@ -413,7 +413,7 @@
|
|
|
413
413
|
}));
|
|
414
414
|
var oe = (0, C._)("Search");
|
|
415
415
|
function ae(e) {
|
|
416
|
-
var n = e.animateLoading, o = n === void 0 ? false : n, a = e.append, i = e.children, l = e.defaultPlacement, u = e.defaultValue, s = e.describedBy, f = e.disabled, v = f === void 0 ? false : f, p = e.elementRef, b = e.error, y = b === void 0 ? false : b, h = e.footerMessage, S = e.inline,
|
|
416
|
+
var n = e.animateLoading, o = n === void 0 ? false : n, a = e.append, i = e.children, l = e.defaultPlacement, u = e.defaultValue, s = e.describedBy, f = e.disabled, v = f === void 0 ? false : f, p = e.elementRef, b = e.error, y = b === void 0 ? false : b, h = e.footerMessage, S = e.inline, I = S === void 0 ? false : S, M = e.inputRef, A = e.isLoadingOptions, q = A === void 0 ? false : A, x = e.labelledBy, D = e.loadingMessage, E = e.menuStyle, B = E === void 0 ? {} : E, T = e.name, H = e.noOptionsMessage, L = e.onChange, N = e.onClose, K = e.onFocus, W = e.onKeyDown, U = e.onOpen, $ = e.placeholder, X = $ === void 0 ? (0,
|
|
417
417
|
C._)("Search...") : $, Y = e.prepend, G = e.value, J = Z(e, [ "animateLoading", "append", "children", "defaultPlacement", "defaultValue", "describedBy", "disabled", "elementRef", "error", "footerMessage", "inline", "inputRef", "isLoadingOptions", "labelledBy", "loadingMessage", "menuStyle", "name", "noOptionsMessage", "onChange", "onClose", "onFocus", "onKeyDown", "onOpen", "placeholder", "prepend", "value" ]);
|
|
418
418
|
// @docs-props-type SearchPropsBase
|
|
419
419
|
var Q = !!i || q;
|
|
@@ -424,33 +424,34 @@
|
|
|
424
424
|
var be = (0, r.useState)(u || ""), me = z(be, 2), ye = me[0], ge = me[1];
|
|
425
425
|
var he = (0, r.useState)((function() {
|
|
426
426
|
return {
|
|
427
|
-
popoverId: (0,
|
|
428
|
-
menuId: (0,
|
|
429
|
-
activeItemId: (0,
|
|
427
|
+
popoverId: (0, k.createDOMID)("popover"),
|
|
428
|
+
menuId: (0, k.createDOMID)("menu"),
|
|
429
|
+
activeItemId: (0, k.createDOMID)("active-item")
|
|
430
430
|
};
|
|
431
|
-
})), Oe = z(he, 1), Se = Oe[0], we = Se.popoverId, Ce = Se.menuId,
|
|
431
|
+
})), Oe = z(he, 1), Se = Oe[0], we = Se.popoverId, Ce = Se.menuId, ke = Se.activeItemId;
|
|
432
432
|
// previous state
|
|
433
|
-
var
|
|
433
|
+
var je = w()(ae);
|
|
434
434
|
// refs
|
|
435
435
|
var Pe = (0, r.useRef)(null);
|
|
436
|
-
var
|
|
437
|
-
var
|
|
436
|
+
var Re = (0, r.useRef)(null);
|
|
437
|
+
var Ie = (0, r.useRef)(G !== undefined && G !== null);
|
|
438
438
|
var Me = (0, r.useRef)([]);
|
|
439
|
-
var Ae = (0, r.useRef)(
|
|
440
|
-
var qe = (0, r.useRef)(
|
|
441
|
-
var xe =
|
|
442
|
-
I(Pe, n);
|
|
443
|
-
I(p, n);
|
|
444
|
-
};
|
|
439
|
+
var Ae = (0, r.useRef)(je);
|
|
440
|
+
var qe = (0, r.useRef)(0);
|
|
441
|
+
var xe = (0, r.useRef)(undefined);
|
|
445
442
|
var De = function e(n) {
|
|
446
|
-
|
|
447
|
-
|
|
443
|
+
R(Pe, n);
|
|
444
|
+
R(p, n);
|
|
448
445
|
};
|
|
449
|
-
var Ee = function e() {
|
|
450
|
-
|
|
446
|
+
var Ee = function e(n) {
|
|
447
|
+
R(Re, n);
|
|
448
|
+
R(M, n);
|
|
451
449
|
};
|
|
452
450
|
var Be = function e() {
|
|
453
|
-
|
|
451
|
+
return Ie.current ? G : ye;
|
|
452
|
+
};
|
|
453
|
+
var Te = function e() {
|
|
454
|
+
var n = Be();
|
|
454
455
|
var t = r.Children.toArray(i).filter(r.isValidElement);
|
|
455
456
|
var o = !ve && t.find((function(e) {
|
|
456
457
|
return e.props.label !== undefined && e.props.value === n;
|
|
@@ -460,27 +461,27 @@
|
|
|
460
461
|
}
|
|
461
462
|
return n;
|
|
462
463
|
};
|
|
463
|
-
var
|
|
464
|
+
var He = function e() {
|
|
464
465
|
se(true);
|
|
465
466
|
ie(-1);
|
|
466
467
|
U === null || U === void 0 ? void 0 : U();
|
|
467
468
|
};
|
|
468
|
-
var
|
|
469
|
+
var Le = function e() {
|
|
469
470
|
se(false);
|
|
470
471
|
Ae.current = null;
|
|
471
472
|
N === null || N === void 0 ? void 0 : N();
|
|
472
473
|
};
|
|
473
|
-
var
|
|
474
|
+
var _e = function e() {
|
|
474
475
|
var n;
|
|
475
|
-
(n =
|
|
476
|
+
(n = Re.current) === null || n === void 0 ? void 0 : n.focus();
|
|
476
477
|
};
|
|
477
|
-
var
|
|
478
|
-
|
|
478
|
+
var Ne = function e(n, r) {
|
|
479
|
+
He();
|
|
479
480
|
K === null || K === void 0 ? void 0 : K(n, r);
|
|
480
481
|
};
|
|
481
|
-
var
|
|
482
|
+
var Ve = function e(n, r) {
|
|
482
483
|
var t = r.value;
|
|
483
|
-
if (!
|
|
484
|
+
if (!Ie.current) {
|
|
484
485
|
ge(t);
|
|
485
486
|
}
|
|
486
487
|
ie(-1);
|
|
@@ -490,13 +491,13 @@
|
|
|
490
491
|
name: T
|
|
491
492
|
});
|
|
492
493
|
};
|
|
493
|
-
var
|
|
494
|
-
|
|
494
|
+
var Ke = function e(n, r) {
|
|
495
|
+
Ve(n, F({}, r));
|
|
496
|
+
_e();
|
|
495
497
|
Le();
|
|
496
|
-
He();
|
|
497
498
|
};
|
|
498
|
-
var
|
|
499
|
-
var r =
|
|
499
|
+
var Fe = function e(n) {
|
|
500
|
+
var r = qe.current;
|
|
500
501
|
var t = n.key;
|
|
501
502
|
if (ce) {
|
|
502
503
|
switch (t) {
|
|
@@ -506,86 +507,100 @@
|
|
|
506
507
|
// triggering onClick so that links can be activated with the keyboard
|
|
507
508
|
// since the menu items themselves never receive focus
|
|
508
509
|
// this will implicitly call handleSelectOption()
|
|
509
|
-
(o = document.getElementById(
|
|
510
|
+
(o = document.getElementById(ke)) === null || o === void 0 ? void 0 : o.click();
|
|
510
511
|
break;
|
|
511
512
|
}
|
|
512
513
|
|
|
513
514
|
case "Tab":
|
|
514
|
-
|
|
515
|
+
Le();
|
|
515
516
|
break;
|
|
516
517
|
|
|
517
518
|
case "ArrowDown":
|
|
518
|
-
|
|
519
|
+
if (r <= 0) {
|
|
520
|
+
break;
|
|
521
|
+
}
|
|
522
|
+
ie((function(e) {
|
|
523
|
+
return Math.min(e + 1, r - 1);
|
|
524
|
+
}));
|
|
519
525
|
break;
|
|
520
526
|
|
|
521
527
|
case "ArrowUp":
|
|
522
|
-
|
|
528
|
+
if (r <= 0) {
|
|
529
|
+
break;
|
|
530
|
+
}
|
|
531
|
+
ie((function(e) {
|
|
532
|
+
return Math.max(e - 1, 0);
|
|
533
|
+
}));
|
|
523
534
|
break;
|
|
524
535
|
|
|
525
536
|
default:
|
|
526
537
|
// do nothing
|
|
527
538
|
}
|
|
528
|
-
} else if ((0,
|
|
539
|
+
} else if ((0, j.addsCharacter)(n.nativeEvent) !== false ||
|
|
529
540
|
// Safari 9.0 returns undefined
|
|
530
541
|
t === "Enter" || t === "Backspace" || t === "ArrowDown" || t === "ArrowUp") {
|
|
531
|
-
|
|
542
|
+
He();
|
|
532
543
|
}
|
|
533
544
|
W === null || W === void 0 ? void 0 : W(n);
|
|
534
545
|
};
|
|
535
|
-
var
|
|
546
|
+
var We = function e() {
|
|
536
547
|
if (!ce && !v) {
|
|
537
|
-
|
|
548
|
+
He();
|
|
538
549
|
}
|
|
539
550
|
};
|
|
540
|
-
var
|
|
551
|
+
var Ue = function e(n) {
|
|
541
552
|
var r = n.event, t = n.reason;
|
|
542
553
|
var o = t === "offScreen" || t === "escapeKey" || t === "clickAway" && Pe.current && !re(Pe.current, r);
|
|
543
554
|
if (o) {
|
|
544
|
-
|
|
555
|
+
Le();
|
|
545
556
|
}
|
|
546
557
|
};
|
|
547
|
-
var
|
|
558
|
+
var $e = function e(n) {
|
|
548
559
|
if (Ae.current !== ae) {
|
|
549
560
|
if (n) {
|
|
550
561
|
(0, P.scrollIntoViewIfNeeded)(n);
|
|
551
562
|
}
|
|
552
563
|
}
|
|
553
564
|
};
|
|
554
|
-
var
|
|
565
|
+
var ze = function e(n) {
|
|
555
566
|
var a = n.anchorWidth, l = n.maxHeight;
|
|
556
567
|
var u = r.Children.toArray(i).filter(r.isValidElement);
|
|
557
568
|
// Highlight Active
|
|
558
|
-
|
|
569
|
+
xe.current = undefined;
|
|
570
|
+
qe.current = 0;
|
|
559
571
|
// Only update the menu options if they are valid and the dropdown is open.
|
|
560
572
|
// This is necessary to handle the outro animation of the dropdown.
|
|
561
573
|
if (Q && ce) {
|
|
562
|
-
Me.current = u.map((function(e
|
|
574
|
+
Me.current = u.map((function(e) {
|
|
563
575
|
if (e.type.as !== "Item") {
|
|
564
576
|
// ignore non-Option items such as Headings and Dividers
|
|
565
577
|
return e;
|
|
566
578
|
}
|
|
567
|
-
var
|
|
579
|
+
var n = function n(r, t) {
|
|
568
580
|
var o, a;
|
|
569
581
|
var i = (o = (a = e.props).onClick) === null || o === void 0 ? void 0 : o.call(a, r, t);
|
|
570
582
|
if (i !== false) {
|
|
571
|
-
|
|
583
|
+
Ke(r, t);
|
|
572
584
|
}
|
|
573
585
|
};
|
|
574
|
-
if (
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
586
|
+
if (e.props.disabled) {
|
|
587
|
+
return e;
|
|
588
|
+
}
|
|
589
|
+
var t = qe.current === ae;
|
|
590
|
+
qe.current += 1;
|
|
591
|
+
if (t) {
|
|
592
|
+
xe.current = e.props.value;
|
|
578
593
|
|
|
579
594
|
return (0, r.cloneElement)(e, {
|
|
580
|
-
elementRef:
|
|
581
|
-
id:
|
|
582
|
-
onClick:
|
|
595
|
+
elementRef: $e,
|
|
596
|
+
id: ke,
|
|
597
|
+
onClick: n,
|
|
583
598
|
active: true
|
|
584
599
|
});
|
|
585
600
|
}
|
|
586
601
|
|
|
587
602
|
return (0, r.cloneElement)(e, {
|
|
588
|
-
onClick:
|
|
603
|
+
onClick: n
|
|
589
604
|
});
|
|
590
605
|
}));
|
|
591
606
|
}
|
|
@@ -607,16 +622,16 @@
|
|
|
607
622
|
menuId: Ce
|
|
608
623
|
}), Me.current);
|
|
609
624
|
};
|
|
610
|
-
var ze = Ee();
|
|
611
625
|
var Xe = Be();
|
|
612
|
-
var Ye =
|
|
613
|
-
var Ge =
|
|
614
|
-
var Je =
|
|
615
|
-
|
|
626
|
+
var Ye = Te();
|
|
627
|
+
var Ge = ce && !!Pe.current && Q;
|
|
628
|
+
var Je = Q ? "combobox" : "searchbox";
|
|
629
|
+
var Qe = {
|
|
630
|
+
"aria-activedescendant": Ge && ae > -1 ? ke : undefined,
|
|
616
631
|
"aria-expanded": Q ? ce && !!Pe.current : undefined,
|
|
617
|
-
"aria-controls":
|
|
632
|
+
"aria-controls": Ge ? Ce : undefined
|
|
618
633
|
};
|
|
619
|
-
var
|
|
634
|
+
var Ze = t().createElement(_, {
|
|
620
635
|
$disabled: v,
|
|
621
636
|
"aria-label": oe,
|
|
622
637
|
"data-test": "search-icon"
|
|
@@ -631,28 +646,28 @@
|
|
|
631
646
|
autoCorrect: "off",
|
|
632
647
|
canClear: true,
|
|
633
648
|
"data-test-popover-id": we,
|
|
634
|
-
"data-test-label":
|
|
635
|
-
"data-test-value":
|
|
636
|
-
"data-test-open":
|
|
649
|
+
"data-test-label": Ye,
|
|
650
|
+
"data-test-value": Xe,
|
|
651
|
+
"data-test-open": Ge,
|
|
637
652
|
describedBy: s,
|
|
638
653
|
disabled: v,
|
|
639
|
-
elementRef:
|
|
654
|
+
elementRef: De,
|
|
640
655
|
error: y,
|
|
641
|
-
inline:
|
|
642
|
-
inputRef:
|
|
656
|
+
inline: I,
|
|
657
|
+
inputRef: Ee,
|
|
643
658
|
labelledBy: x,
|
|
644
659
|
name: T,
|
|
645
|
-
onFocus:
|
|
646
|
-
onClick:
|
|
647
|
-
onChange:
|
|
648
|
-
onKeyDown:
|
|
660
|
+
onFocus: Ne,
|
|
661
|
+
onClick: We,
|
|
662
|
+
onChange: Ve,
|
|
663
|
+
onKeyDown: Fe,
|
|
649
664
|
placeholder: X,
|
|
650
665
|
prepend: Y,
|
|
651
666
|
spellCheck: false,
|
|
652
|
-
startAdornment:
|
|
653
|
-
value:
|
|
654
|
-
role:
|
|
655
|
-
},
|
|
667
|
+
startAdornment: Ze,
|
|
668
|
+
value: Ye,
|
|
669
|
+
role: Je
|
|
670
|
+
}, Qe), t().createElement(m(), {
|
|
656
671
|
anchor: function() {
|
|
657
672
|
return Pe.current;
|
|
658
673
|
}(),
|
|
@@ -660,10 +675,10 @@
|
|
|
660
675
|
canCoverAnchor: false,
|
|
661
676
|
defaultPlacement: l,
|
|
662
677
|
id: we,
|
|
663
|
-
onRequestClose:
|
|
664
|
-
open:
|
|
678
|
+
onRequestClose: Ue,
|
|
679
|
+
open: Ge,
|
|
665
680
|
repositionMode: "flip"
|
|
666
|
-
},
|
|
681
|
+
}, ze));
|
|
667
682
|
}
|
|
668
683
|
ae.propTypes = ne;
|
|
669
684
|
ae.Option = D;
|
package/Select.js
CHANGED
|
@@ -77,12 +77,12 @@
|
|
|
77
77
|
var l = e.n(i);
|
|
78
78
|
// CONCATENATED MODULE: external "@splunk/react-ui/useControlled"
|
|
79
79
|
const u = require("@splunk/react-ui/useControlled");
|
|
80
|
-
var
|
|
80
|
+
var d = e.n(u);
|
|
81
81
|
// CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
|
|
82
82
|
const s = require("@splunk/ui-utils/i18n");
|
|
83
83
|
// CONCATENATED MODULE: ./src/Select/Option.tsx
|
|
84
|
-
function
|
|
85
|
-
return
|
|
84
|
+
function c() {
|
|
85
|
+
return c = Object.assign ? Object.assign.bind() : function(e) {
|
|
86
86
|
for (var n = 1; n < arguments.length; n++) {
|
|
87
87
|
var o = arguments[n];
|
|
88
88
|
for (var t in o) {
|
|
@@ -90,7 +90,7 @@
|
|
|
90
90
|
}
|
|
91
91
|
}
|
|
92
92
|
return e;
|
|
93
|
-
},
|
|
93
|
+
}, c.apply(null, arguments);
|
|
94
94
|
}
|
|
95
95
|
function f(e, n) {
|
|
96
96
|
if (null == e) return {};
|
|
@@ -114,13 +114,13 @@
|
|
|
114
114
|
}
|
|
115
115
|
return o;
|
|
116
116
|
}
|
|
117
|
-
var
|
|
117
|
+
var b = {
|
|
118
118
|
/** @private */
|
|
119
119
|
active: a().bool,
|
|
120
120
|
children: a().node,
|
|
121
121
|
description: a().string,
|
|
122
122
|
descriptionPosition: a().oneOf([ "right", "bottom" ]),
|
|
123
|
-
disabled: a().bool,
|
|
123
|
+
disabled: a().oneOfType([ a().bool, a().oneOf([ "dimmed", "disabled" ]) ]),
|
|
124
124
|
elementRef: a().oneOfType([ a().func, a().object ]),
|
|
125
125
|
/** @private */
|
|
126
126
|
endAdornment: a().node,
|
|
@@ -142,21 +142,22 @@
|
|
|
142
142
|
};
|
|
143
143
|
/**
|
|
144
144
|
* An option within a `Select`. Any elements passed to it should be memoized.
|
|
145
|
-
*/ function
|
|
146
|
-
var n = e.children, o = e.descriptionPosition, r = o === void 0 ? "bottom" : o, a = e.
|
|
145
|
+
*/ function v(e) {
|
|
146
|
+
var n = e.children, o = e.descriptionPosition, r = o === void 0 ? "bottom" : o, a = e.disabled, l = e.elementRef, u = e.label, d = f(e, [ "children", "descriptionPosition", "disabled", "elementRef", "label" ]);
|
|
147
147
|
// @docs-props-type OptionPropsBase
|
|
148
148
|
|
|
149
|
-
return t().createElement(i.Option,
|
|
149
|
+
return t().createElement(i.Option, c({
|
|
150
150
|
descriptionPosition: r,
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
151
|
+
disabled: a,
|
|
152
|
+
label: u
|
|
153
|
+
}, d, {
|
|
154
|
+
elementRef: l,
|
|
154
155
|
multiple: false
|
|
155
|
-
}), n ||
|
|
156
|
+
}), n || u);
|
|
156
157
|
}
|
|
157
|
-
var g = (0, o.memo)(
|
|
158
|
+
var g = (0, o.memo)(v);
|
|
158
159
|
// @ts-expect-error Need to set propTypes on OptionMemoized so that javascript propType validation will work
|
|
159
|
-
g.propTypes =
|
|
160
|
+
g.propTypes = b;
|
|
160
161
|
/* harmony default export */ const m = g;
|
|
161
162
|
// CONCATENATED MODULE: ./src/utils/useDeprecate.tsx
|
|
162
163
|
var O = "is deprecated and will be removed in the next major version.";
|
|
@@ -223,7 +224,7 @@
|
|
|
223
224
|
defaultPlacement: a().oneOf([ "above", "below", "vertical" ]),
|
|
224
225
|
defaultValue: a().oneOfType([ a().string, a().number, a().bool ]),
|
|
225
226
|
describedBy: a().string,
|
|
226
|
-
disabled: a().bool,
|
|
227
|
+
disabled: a().oneOfType([ a().bool, a().oneOf([ "dimmed", "disabled" ]) ]),
|
|
227
228
|
elementRef: a().oneOfType([ a().func, a().object ]),
|
|
228
229
|
error: a().bool,
|
|
229
230
|
filter: a().oneOf([ false, true, "controlled" ]),
|
|
@@ -257,9 +258,9 @@
|
|
|
257
258
|
virtualization: a().number
|
|
258
259
|
};
|
|
259
260
|
var C = (0, s._)("No matches");
|
|
260
|
-
var
|
|
261
|
-
function
|
|
262
|
-
var n = e.allowKeyMatching, r = n === void 0 ? true : n, a = e.appearance, i = a === void 0 ? "default" : a, u = e.defaultPlacement, s = u === void 0 ? "vertical" : u,
|
|
261
|
+
var T = (0, s._)("Select...");
|
|
262
|
+
function R(e) {
|
|
263
|
+
var n = e.allowKeyMatching, r = n === void 0 ? true : n, a = e.appearance, i = a === void 0 ? "default" : a, u = e.defaultPlacement, s = u === void 0 ? "vertical" : u, c = e.defaultValue, f = e.disabled, p = e.inline, b = p === void 0 ? true : p, v = e.noOptionsMessage, g = v === void 0 ? C : v, m = e.onChange, O = e.placeholder, y = O === void 0 ? T : O, h = e.toggleContent, S = h === void 0 ? "optionChildren" : h, w = e.value, R = j(e, [ "allowKeyMatching", "appearance", "defaultPlacement", "defaultValue", "disabled", "inline", "noOptionsMessage", "onChange", "placeholder", "toggleContent", "value" ]);
|
|
263
264
|
// @docs-props-type SelectPropsBase
|
|
264
265
|
P({
|
|
265
266
|
componentName: "Select",
|
|
@@ -267,24 +268,24 @@
|
|
|
267
268
|
propName: "appearance",
|
|
268
269
|
propValue: i
|
|
269
270
|
});
|
|
270
|
-
var
|
|
271
|
+
var x = d()({
|
|
271
272
|
componentName: "Select",
|
|
272
273
|
/* eslint-disable-next-line prefer-rest-params */
|
|
273
274
|
componentProps: arguments[0]
|
|
274
275
|
});
|
|
275
|
-
var
|
|
276
|
+
var q = (0, o.useMemo)((function() {
|
|
276
277
|
// wrap defaultValue in an array once to avoid failing <SelectBase>'s defaultValues comparison check
|
|
277
|
-
if (
|
|
278
|
-
return [
|
|
278
|
+
if (c != null) {
|
|
279
|
+
return [ c ];
|
|
279
280
|
}
|
|
280
281
|
return [];
|
|
281
|
-
}), [
|
|
282
|
+
}), [ c ]);
|
|
282
283
|
// Converts the provided props into a structure suitable for SelectBase.
|
|
283
|
-
var
|
|
284
|
-
var e =
|
|
284
|
+
var N = (0, o.useMemo)((function() {
|
|
285
|
+
var e = x ? undefined : q;
|
|
285
286
|
var n = function e(n, o) {
|
|
286
287
|
var t = o.name, r = o.values;
|
|
287
|
-
|
|
288
|
+
m === null || m === void 0 ? void 0 : m(n, {
|
|
288
289
|
name: t,
|
|
289
290
|
value: r[0]
|
|
290
291
|
});
|
|
@@ -292,31 +293,32 @@
|
|
|
292
293
|
var o = {
|
|
293
294
|
onChange: n
|
|
294
295
|
};
|
|
295
|
-
if (
|
|
296
|
-
o.values =
|
|
296
|
+
if (x) {
|
|
297
|
+
o.values = w != null ? [ w ] : [];
|
|
297
298
|
} else if (e != null) {
|
|
298
299
|
o.defaultValues = e;
|
|
299
300
|
}
|
|
300
301
|
return o;
|
|
301
|
-
}), [
|
|
302
|
+
}), [ q, m, x, w ]);
|
|
302
303
|
|
|
303
304
|
return t().createElement(l(), M({
|
|
304
305
|
allowKeyMatching: r,
|
|
305
306
|
appearance: i,
|
|
306
307
|
defaultPlacement: s,
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
308
|
+
disabled: f,
|
|
309
|
+
inline: b,
|
|
310
|
+
noOptionsMessage: g,
|
|
311
|
+
placeholder: y,
|
|
312
|
+
toggleContent: S
|
|
313
|
+
}, R, N, {
|
|
312
314
|
multiple: false
|
|
313
315
|
}));
|
|
314
316
|
}
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
/* harmony default export */ const x =
|
|
317
|
+
R.propTypes = w;
|
|
318
|
+
R.Option = m;
|
|
319
|
+
R.Heading = i.Heading;
|
|
320
|
+
R.Divider = i.Divider;
|
|
321
|
+
/* harmony default export */ const x = R;
|
|
320
322
|
// CONCATENATED MODULE: ./src/Select/index.ts
|
|
321
323
|
module.exports = n;
|
|
322
324
|
/******/})();
|