@zendeskgarden/react-dropdowns 8.62.1 → 8.63.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs.js
CHANGED
|
@@ -7,8 +7,6 @@
|
|
|
7
7
|
|
|
8
8
|
'use strict';
|
|
9
9
|
|
|
10
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
11
|
-
|
|
12
10
|
var React = require('react');
|
|
13
11
|
var PropTypes = require('prop-types');
|
|
14
12
|
var styled = require('styled-components');
|
|
@@ -22,7 +20,7 @@ var mergeRefs = require('react-merge-refs');
|
|
|
22
20
|
var containerSelection = require('@zendeskgarden/container-selection');
|
|
23
21
|
var reactDom = require('react-dom');
|
|
24
22
|
|
|
25
|
-
function
|
|
23
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
26
24
|
|
|
27
25
|
function _interopNamespace(e) {
|
|
28
26
|
if (e && e.__esModule) return e;
|
|
@@ -38,16 +36,15 @@ function _interopNamespace(e) {
|
|
|
38
36
|
}
|
|
39
37
|
});
|
|
40
38
|
}
|
|
41
|
-
n
|
|
39
|
+
n.default = e;
|
|
42
40
|
return Object.freeze(n);
|
|
43
41
|
}
|
|
44
42
|
|
|
45
|
-
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
46
43
|
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
47
|
-
var PropTypes__default = /*#__PURE__*/
|
|
48
|
-
var styled__default = /*#__PURE__*/
|
|
49
|
-
var Downshift__default = /*#__PURE__*/
|
|
50
|
-
var mergeRefs__default = /*#__PURE__*/
|
|
44
|
+
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
|
|
45
|
+
var styled__default = /*#__PURE__*/_interopDefault(styled);
|
|
46
|
+
var Downshift__default = /*#__PURE__*/_interopDefault(Downshift);
|
|
47
|
+
var mergeRefs__default = /*#__PURE__*/_interopDefault(mergeRefs);
|
|
51
48
|
|
|
52
49
|
function _extends$5() {
|
|
53
50
|
_extends$5 = Object.assign ? Object.assign.bind() : function (target) {
|
|
@@ -64,7 +61,7 @@ function _extends$5() {
|
|
|
64
61
|
return _extends$5.apply(this, arguments);
|
|
65
62
|
}
|
|
66
63
|
|
|
67
|
-
const DropdownContext =
|
|
64
|
+
const DropdownContext = React__namespace.default.createContext(undefined);
|
|
68
65
|
const useDropdownContext = () => {
|
|
69
66
|
const dropdownContext = React.useContext(DropdownContext);
|
|
70
67
|
if (!dropdownContext) {
|
|
@@ -94,10 +91,12 @@ const Dropdown = props => {
|
|
|
94
91
|
const containsMultiselectRef = React.useRef(false);
|
|
95
92
|
const itemSearchRegistry = React.useRef([]);
|
|
96
93
|
const [dropdownType, setDropdownType] = React.useState('');
|
|
97
|
-
const
|
|
94
|
+
const {
|
|
95
|
+
rtl
|
|
96
|
+
} = React.useContext(styled.ThemeContext);
|
|
98
97
|
const hasMenuRef = React.useRef(false);
|
|
99
98
|
const popperReferenceElementRef = React.useRef(null);
|
|
100
|
-
const customGetInputProps = (_ref, downshift
|
|
99
|
+
const customGetInputProps = (_ref, downshift) => {
|
|
101
100
|
let {
|
|
102
101
|
onKeyDown,
|
|
103
102
|
...other
|
|
@@ -136,7 +135,7 @@ const Dropdown = props => {
|
|
|
136
135
|
...downshift
|
|
137
136
|
} = _ref2;
|
|
138
137
|
return {
|
|
139
|
-
getInputProps: p => getInputProps(customGetInputProps(p, downshift
|
|
138
|
+
getInputProps: p => getInputProps(customGetInputProps(p, downshift)),
|
|
140
139
|
getToggleButtonProps: p => getToggleButtonProps({
|
|
141
140
|
'aria-label': undefined,
|
|
142
141
|
...p
|
|
@@ -144,7 +143,7 @@ const Dropdown = props => {
|
|
|
144
143
|
...downshift
|
|
145
144
|
};
|
|
146
145
|
};
|
|
147
|
-
return
|
|
146
|
+
return React__namespace.default.createElement(reactPopper.Manager, null, React__namespace.default.createElement(Downshift__default.default, _extends$5({
|
|
148
147
|
suppressRefError: true
|
|
149
148
|
,
|
|
150
149
|
isOpen: isOpen,
|
|
@@ -195,7 +194,7 @@ const Dropdown = props => {
|
|
|
195
194
|
},
|
|
196
195
|
stateReducer: (_state, changes) => {
|
|
197
196
|
switch (changes.type) {
|
|
198
|
-
case Downshift__default
|
|
197
|
+
case Downshift__default.default.stateChangeTypes.changeInput:
|
|
199
198
|
if (changes.inputValue === '' && dropdownType === 'combobox') {
|
|
200
199
|
return {
|
|
201
200
|
...changes,
|
|
@@ -207,7 +206,7 @@ const Dropdown = props => {
|
|
|
207
206
|
return changes;
|
|
208
207
|
}
|
|
209
208
|
}
|
|
210
|
-
}, downshiftProps), downshift =>
|
|
209
|
+
}, downshiftProps), downshift => React__namespace.default.createElement(DropdownContext.Provider, {
|
|
211
210
|
value: {
|
|
212
211
|
hasMenuRef,
|
|
213
212
|
itemIndexRef,
|
|
@@ -224,14 +223,14 @@ const Dropdown = props => {
|
|
|
224
223
|
}, children)));
|
|
225
224
|
};
|
|
226
225
|
Dropdown.propTypes = {
|
|
227
|
-
isOpen: PropTypes__default
|
|
228
|
-
selectedItem: PropTypes__default
|
|
229
|
-
selectedItems: PropTypes__default
|
|
230
|
-
highlightedIndex: PropTypes__default
|
|
231
|
-
inputValue: PropTypes__default
|
|
232
|
-
onSelect: PropTypes__default
|
|
233
|
-
onStateChange: PropTypes__default
|
|
234
|
-
downshiftProps: PropTypes__default
|
|
226
|
+
isOpen: PropTypes__default.default.bool,
|
|
227
|
+
selectedItem: PropTypes__default.default.any,
|
|
228
|
+
selectedItems: PropTypes__default.default.arrayOf(PropTypes__default.default.any),
|
|
229
|
+
highlightedIndex: PropTypes__default.default.number,
|
|
230
|
+
inputValue: PropTypes__default.default.string,
|
|
231
|
+
onSelect: PropTypes__default.default.func,
|
|
232
|
+
onStateChange: PropTypes__default.default.func,
|
|
233
|
+
downshiftProps: PropTypes__default.default.object
|
|
235
234
|
};
|
|
236
235
|
|
|
237
236
|
function getPopperPlacement(gardenPlacement) {
|
|
@@ -305,9 +304,9 @@ function getMenuPosition(popperPlacement) {
|
|
|
305
304
|
}
|
|
306
305
|
|
|
307
306
|
const COMPONENT_ID$m = 'dropdowns.menu';
|
|
308
|
-
const StyledMenu = styled__default
|
|
307
|
+
const StyledMenu = styled__default.default.ul.attrs(props => ({
|
|
309
308
|
'data-garden-id': COMPONENT_ID$m,
|
|
310
|
-
'data-garden-version': '8.
|
|
309
|
+
'data-garden-version': '8.63.0',
|
|
311
310
|
className: props.isAnimated && 'is-animated'
|
|
312
311
|
})).withConfig({
|
|
313
312
|
displayName: "StyledMenu",
|
|
@@ -322,9 +321,9 @@ StyledMenu.defaultProps = {
|
|
|
322
321
|
};
|
|
323
322
|
|
|
324
323
|
const COMPONENT_ID$l = 'dropdowns.menu_wrapper';
|
|
325
|
-
const StyledMenuWrapper = styled__default
|
|
324
|
+
const StyledMenuWrapper = styled__default.default.div.attrs(props => ({
|
|
326
325
|
'data-garden-id': COMPONENT_ID$l,
|
|
327
|
-
'data-garden-version': '8.
|
|
326
|
+
'data-garden-version': '8.63.0',
|
|
328
327
|
className: props.isAnimated && 'is-animated'
|
|
329
328
|
})).withConfig({
|
|
330
329
|
displayName: "StyledMenuWrapper",
|
|
@@ -341,9 +340,9 @@ StyledMenuWrapper.defaultProps = {
|
|
|
341
340
|
};
|
|
342
341
|
|
|
343
342
|
const COMPONENT_ID$k = 'dropdowns.separator';
|
|
344
|
-
const StyledSeparator = styled__default
|
|
343
|
+
const StyledSeparator = styled__default.default.li.attrs({
|
|
345
344
|
'data-garden-id': COMPONENT_ID$k,
|
|
346
|
-
'data-garden-version': '8.
|
|
345
|
+
'data-garden-version': '8.63.0',
|
|
347
346
|
role: 'separator'
|
|
348
347
|
}).withConfig({
|
|
349
348
|
displayName: "StyledSeparator",
|
|
@@ -374,9 +373,9 @@ const getColorStyles = props => {
|
|
|
374
373
|
}
|
|
375
374
|
return styled.css(["background-color:", ";color:", ";& a,& a:hover,& a:focus,& a:active{color:inherit;}"], backgroundColor, foregroundColor);
|
|
376
375
|
};
|
|
377
|
-
const StyledItem = styled__default
|
|
376
|
+
const StyledItem = styled__default.default.li.attrs(props => ({
|
|
378
377
|
'data-garden-id': COMPONENT_ID$j,
|
|
379
|
-
'data-garden-version': '8.
|
|
378
|
+
'data-garden-version': '8.63.0',
|
|
380
379
|
'aria-disabled': props.disabled
|
|
381
380
|
})).withConfig({
|
|
382
381
|
displayName: "StyledItem",
|
|
@@ -387,9 +386,9 @@ StyledItem.defaultProps = {
|
|
|
387
386
|
};
|
|
388
387
|
|
|
389
388
|
const COMPONENT_ID$i = 'dropdowns.add_item';
|
|
390
|
-
const StyledAddItem = styled__default
|
|
389
|
+
const StyledAddItem = styled__default.default(StyledItem).attrs({
|
|
391
390
|
'data-garden-id': COMPONENT_ID$i,
|
|
392
|
-
'data-garden-version': '8.
|
|
391
|
+
'data-garden-version': '8.63.0'
|
|
393
392
|
}).withConfig({
|
|
394
393
|
displayName: "StyledAddItem",
|
|
395
394
|
componentId: "sc-ekqk50-0"
|
|
@@ -399,9 +398,9 @@ StyledAddItem.defaultProps = {
|
|
|
399
398
|
};
|
|
400
399
|
|
|
401
400
|
const COMPONENT_ID$h = 'dropdowns.item_meta';
|
|
402
|
-
const StyledItemMeta = styled__default
|
|
401
|
+
const StyledItemMeta = styled__default.default.span.attrs({
|
|
403
402
|
'data-garden-id': COMPONENT_ID$h,
|
|
404
|
-
'data-garden-version': '8.
|
|
403
|
+
'data-garden-version': '8.63.0'
|
|
405
404
|
}).withConfig({
|
|
406
405
|
displayName: "StyledItemMeta",
|
|
407
406
|
componentId: "sc-k6xy28-0"
|
|
@@ -414,9 +413,9 @@ const COMPONENT_ID$g = 'dropdowns.item_icon';
|
|
|
414
413
|
const getSizeStyles = props => {
|
|
415
414
|
return styled.css(["width:", ";height:calc(", "px + ", ");"], props.theme.iconSizes.md, props.theme.space.base * 5, polished.math(`${getItemPaddingVertical(props)} * 2`));
|
|
416
415
|
};
|
|
417
|
-
const StyledItemIcon = styled__default
|
|
416
|
+
const StyledItemIcon = styled__default.default.div.attrs({
|
|
418
417
|
'data-garden-id': COMPONENT_ID$g,
|
|
419
|
-
'data-garden-version': '8.
|
|
418
|
+
'data-garden-version': '8.63.0'
|
|
420
419
|
}).withConfig({
|
|
421
420
|
displayName: "StyledItemIcon",
|
|
422
421
|
componentId: "sc-1v0ty11-0"
|
|
@@ -426,9 +425,9 @@ StyledItemIcon.defaultProps = {
|
|
|
426
425
|
};
|
|
427
426
|
|
|
428
427
|
const COMPONENT_ID$f = 'dropdowns.next_item';
|
|
429
|
-
const StyledNextItem = styled__default
|
|
428
|
+
const StyledNextItem = styled__default.default(StyledItem).attrs({
|
|
430
429
|
'data-garden-id': COMPONENT_ID$f,
|
|
431
|
-
'data-garden-version': '8.
|
|
430
|
+
'data-garden-version': '8.63.0'
|
|
432
431
|
}).withConfig({
|
|
433
432
|
displayName: "StyledNextItem",
|
|
434
433
|
componentId: "sc-1bcygn5-0"
|
|
@@ -438,9 +437,7 @@ StyledNextItem.defaultProps = {
|
|
|
438
437
|
};
|
|
439
438
|
|
|
440
439
|
var _path$4;
|
|
441
|
-
|
|
442
440
|
function _extends$4() { _extends$4 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
|
|
443
|
-
|
|
444
441
|
var SvgChevronRightStroke = function SvgChevronRightStroke(props) {
|
|
445
442
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$4({
|
|
446
443
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -448,8 +445,7 @@ var SvgChevronRightStroke = function SvgChevronRightStroke(props) {
|
|
|
448
445
|
height: 16,
|
|
449
446
|
focusable: "false",
|
|
450
447
|
viewBox: "0 0 16 16",
|
|
451
|
-
"aria-hidden": "true"
|
|
452
|
-
role: "img"
|
|
448
|
+
"aria-hidden": "true"
|
|
453
449
|
}, props), _path$4 || (_path$4 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
454
450
|
fill: "currentColor",
|
|
455
451
|
d: "M5.61 3.312a.5.5 0 01.718-.69l.062.066 4 5a.5.5 0 01.054.542l-.054.082-4 5a.5.5 0 01-.83-.55l.05-.074L9.359 8l-3.75-4.688z"
|
|
@@ -461,13 +457,13 @@ const NextIconComponent = _ref => {
|
|
|
461
457
|
let {
|
|
462
458
|
className
|
|
463
459
|
} = _ref;
|
|
464
|
-
return
|
|
460
|
+
return React__namespace.default.createElement(SvgChevronRightStroke, {
|
|
465
461
|
"data-garden-id": COMPONENT_ID$e,
|
|
466
|
-
"data-garden-version": '8.
|
|
462
|
+
"data-garden-version": '8.63.0',
|
|
467
463
|
className: className
|
|
468
464
|
});
|
|
469
465
|
};
|
|
470
|
-
const StyledNextIcon = styled__default
|
|
466
|
+
const StyledNextIcon = styled__default.default(NextIconComponent).withConfig({
|
|
471
467
|
displayName: "StyledNextIcon",
|
|
472
468
|
componentId: "sc-1rinki2-0"
|
|
473
469
|
})(["transform:", ";color:", ";", ";"], props => props.theme.rtl && 'rotate(180deg)', props => props.isDisabled ? 'inherit' : reactTheming.getColor('neutralHue', 600, props.theme), props => reactTheming.retrieveComponentStyles(COMPONENT_ID$e, props));
|
|
@@ -476,9 +472,9 @@ StyledNextIcon.defaultProps = {
|
|
|
476
472
|
};
|
|
477
473
|
|
|
478
474
|
const COMPONENT_ID$d = 'dropdowns.previous_item';
|
|
479
|
-
const StyledPreviousItem = styled__default
|
|
475
|
+
const StyledPreviousItem = styled__default.default(StyledItem).attrs({
|
|
480
476
|
'data-garden-id': COMPONENT_ID$d,
|
|
481
|
-
'data-garden-version': '8.
|
|
477
|
+
'data-garden-version': '8.63.0'
|
|
482
478
|
}).withConfig({
|
|
483
479
|
displayName: "StyledPreviousItem",
|
|
484
480
|
componentId: "sc-1nmdds9-0"
|
|
@@ -488,9 +484,7 @@ StyledPreviousItem.defaultProps = {
|
|
|
488
484
|
};
|
|
489
485
|
|
|
490
486
|
var _path$3;
|
|
491
|
-
|
|
492
487
|
function _extends$3() { _extends$3 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3.apply(this, arguments); }
|
|
493
|
-
|
|
494
488
|
var SvgChevronLeftStroke = function SvgChevronLeftStroke(props) {
|
|
495
489
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$3({
|
|
496
490
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -498,8 +492,7 @@ var SvgChevronLeftStroke = function SvgChevronLeftStroke(props) {
|
|
|
498
492
|
height: 16,
|
|
499
493
|
focusable: "false",
|
|
500
494
|
viewBox: "0 0 16 16",
|
|
501
|
-
"aria-hidden": "true"
|
|
502
|
-
role: "img"
|
|
495
|
+
"aria-hidden": "true"
|
|
503
496
|
}, props), _path$3 || (_path$3 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
504
497
|
fill: "currentColor",
|
|
505
498
|
d: "M10.39 12.688a.5.5 0 01-.718.69l-.062-.066-4-5a.5.5 0 01-.054-.542l.054-.082 4-5a.5.5 0 01.83.55l-.05.074L6.641 8l3.75 4.688z"
|
|
@@ -511,13 +504,13 @@ const PreviousIconComponent = _ref => {
|
|
|
511
504
|
let {
|
|
512
505
|
className
|
|
513
506
|
} = _ref;
|
|
514
|
-
return
|
|
507
|
+
return React__namespace.default.createElement(SvgChevronLeftStroke, {
|
|
515
508
|
"data-garden-id": COMPONENT_ID$c,
|
|
516
|
-
"data-garden-version": '8.
|
|
509
|
+
"data-garden-version": '8.63.0',
|
|
517
510
|
className: className
|
|
518
511
|
});
|
|
519
512
|
};
|
|
520
|
-
const StyledPreviousIcon = styled__default
|
|
513
|
+
const StyledPreviousIcon = styled__default.default(PreviousIconComponent).withConfig({
|
|
521
514
|
displayName: "StyledPreviousIcon",
|
|
522
515
|
componentId: "sc-czfwj7-0"
|
|
523
516
|
})(["transform:", ";color:", ";", ";"], props => props.theme.rtl && 'rotate(180deg)', props => props.isDisabled ? 'inherit' : reactTheming.getColor('neutralHue', 600, props.theme), props => reactTheming.retrieveComponentStyles(COMPONENT_ID$c, props));
|
|
@@ -526,9 +519,9 @@ StyledPreviousIcon.defaultProps = {
|
|
|
526
519
|
};
|
|
527
520
|
|
|
528
521
|
const COMPONENT_ID$b = 'dropdowns.header_icon';
|
|
529
|
-
const StyledHeaderIcon = styled__default
|
|
522
|
+
const StyledHeaderIcon = styled__default.default.div.attrs({
|
|
530
523
|
'data-garden-id': COMPONENT_ID$b,
|
|
531
|
-
'data-garden-version': '8.
|
|
524
|
+
'data-garden-version': '8.63.0'
|
|
532
525
|
}).withConfig({
|
|
533
526
|
displayName: "StyledHeaderIcon",
|
|
534
527
|
componentId: "sc-1fl6nsz-0"
|
|
@@ -544,9 +537,9 @@ const getHorizontalPadding = props => {
|
|
|
544
537
|
}
|
|
545
538
|
return `${props.theme.space.base * 3}px`;
|
|
546
539
|
};
|
|
547
|
-
const StyledHeaderItem = styled__default
|
|
540
|
+
const StyledHeaderItem = styled__default.default(StyledItem).attrs({
|
|
548
541
|
'data-garden-id': COMPONENT_ID$a,
|
|
549
|
-
'data-garden-version': '8.
|
|
542
|
+
'data-garden-version': '8.63.0'
|
|
550
543
|
}).withConfig({
|
|
551
544
|
displayName: "StyledHeaderItem",
|
|
552
545
|
componentId: "sc-137filx-0"
|
|
@@ -556,9 +549,9 @@ StyledHeaderItem.defaultProps = {
|
|
|
556
549
|
};
|
|
557
550
|
|
|
558
551
|
const COMPONENT_ID$9 = 'dropdowns.media_body';
|
|
559
|
-
const StyledMediaBody = styled__default
|
|
552
|
+
const StyledMediaBody = styled__default.default.div.attrs({
|
|
560
553
|
'data-garden-id': COMPONENT_ID$9,
|
|
561
|
-
'data-garden-version': '8.
|
|
554
|
+
'data-garden-version': '8.63.0'
|
|
562
555
|
}).withConfig({
|
|
563
556
|
displayName: "StyledMediaBody",
|
|
564
557
|
componentId: "sc-36j7ef-0"
|
|
@@ -568,7 +561,7 @@ StyledMediaBody.defaultProps = {
|
|
|
568
561
|
};
|
|
569
562
|
|
|
570
563
|
const COMPONENT_ID$8 = 'dropdowns.media_figure';
|
|
571
|
-
const StyledMediaFigure = styled__default
|
|
564
|
+
const StyledMediaFigure = styled__default.default(
|
|
572
565
|
_ref => {
|
|
573
566
|
let {
|
|
574
567
|
children,
|
|
@@ -577,11 +570,11 @@ _ref => {
|
|
|
577
570
|
...props
|
|
578
571
|
} = _ref;
|
|
579
572
|
return (
|
|
580
|
-
|
|
573
|
+
React__namespace.default.cloneElement(React.Children.only(children), props)
|
|
581
574
|
);
|
|
582
575
|
}).attrs({
|
|
583
576
|
'data-garden-id': COMPONENT_ID$8,
|
|
584
|
-
'data-garden-version': '8.
|
|
577
|
+
'data-garden-version': '8.63.0'
|
|
585
578
|
}).withConfig({
|
|
586
579
|
displayName: "StyledMediaFigure",
|
|
587
580
|
componentId: "sc-2f2x8x-0"
|
|
@@ -591,9 +584,9 @@ StyledMediaFigure.defaultProps = {
|
|
|
591
584
|
};
|
|
592
585
|
|
|
593
586
|
const COMPONENT_ID$7 = 'dropdowns.media_item';
|
|
594
|
-
const StyledMediaItem = styled__default
|
|
587
|
+
const StyledMediaItem = styled__default.default(StyledItem).attrs({
|
|
595
588
|
'data-garden-id': COMPONENT_ID$7,
|
|
596
|
-
'data-garden-version': '8.
|
|
589
|
+
'data-garden-version': '8.63.0'
|
|
597
590
|
}).withConfig({
|
|
598
591
|
displayName: "StyledMediaItem",
|
|
599
592
|
componentId: "sc-ikwshz-0"
|
|
@@ -603,9 +596,9 @@ StyledMediaItem.defaultProps = {
|
|
|
603
596
|
};
|
|
604
597
|
|
|
605
598
|
const COMPONENT_ID$6 = 'dropdowns.faux_input';
|
|
606
|
-
const StyledFauxInput = styled__default
|
|
599
|
+
const StyledFauxInput = styled__default.default(reactForms.FauxInput).attrs(props => ({
|
|
607
600
|
'data-garden-id': COMPONENT_ID$6,
|
|
608
|
-
'data-garden-version': '8.
|
|
601
|
+
'data-garden-version': '8.63.0',
|
|
609
602
|
mediaLayout: true,
|
|
610
603
|
theme: props.theme
|
|
611
604
|
})).withConfig({
|
|
@@ -618,9 +611,9 @@ StyledFauxInput.defaultProps = {
|
|
|
618
611
|
|
|
619
612
|
const COMPONENT_ID$5 = 'dropdowns.input';
|
|
620
613
|
const hiddenStyling = styled.css(["position:fixed;border:0;clip:rect(1px,1px,1px,1px);padding:0;width:1px;height:1px;overflow:hidden;white-space:nowrap;"]);
|
|
621
|
-
const StyledInput = styled__default
|
|
614
|
+
const StyledInput = styled__default.default(reactForms.Input).attrs({
|
|
622
615
|
'data-garden-id': COMPONENT_ID$5,
|
|
623
|
-
'data-garden-version': '8.
|
|
616
|
+
'data-garden-version': '8.63.0',
|
|
624
617
|
isBare: true
|
|
625
618
|
}).withConfig({
|
|
626
619
|
displayName: "StyledInput",
|
|
@@ -631,9 +624,9 @@ StyledInput.defaultProps = {
|
|
|
631
624
|
};
|
|
632
625
|
|
|
633
626
|
const COMPONENT_ID$4 = 'dropdowns.select';
|
|
634
|
-
const StyledSelect = styled__default
|
|
627
|
+
const StyledSelect = styled__default.default.div.attrs({
|
|
635
628
|
'data-garden-id': COMPONENT_ID$4,
|
|
636
|
-
'data-garden-version': '8.
|
|
629
|
+
'data-garden-version': '8.63.0'
|
|
637
630
|
}).withConfig({
|
|
638
631
|
displayName: "StyledSelect",
|
|
639
632
|
componentId: "sc-xifmwj-0"
|
|
@@ -652,9 +645,9 @@ const visibleStyling = props => {
|
|
|
652
645
|
}
|
|
653
646
|
return styled.css(["opacity:", ";margin:", ";width:", ";min-width:", ";height:", ";"], !props.isVisible && 0, margin, !props.isVisible && 0, minWidth, height);
|
|
654
647
|
};
|
|
655
|
-
const StyledMultiselectInput = styled__default
|
|
648
|
+
const StyledMultiselectInput = styled__default.default(StyledInput).attrs({
|
|
656
649
|
'data-garden-id': COMPONENT_ID$3,
|
|
657
|
-
'data-garden-version': '8.
|
|
650
|
+
'data-garden-version': '8.63.0'
|
|
658
651
|
}).withConfig({
|
|
659
652
|
displayName: "StyledMultiselectInput",
|
|
660
653
|
componentId: "sc-1avnf6f-0"
|
|
@@ -676,9 +669,9 @@ const sizeStyles = props => {
|
|
|
676
669
|
}
|
|
677
670
|
return styled.css(["margin:", ";padding:", ";"], margin, padding);
|
|
678
671
|
};
|
|
679
|
-
const StyledMultiselectItemsContainer = styled__default
|
|
672
|
+
const StyledMultiselectItemsContainer = styled__default.default.div.attrs({
|
|
680
673
|
'data-garden-id': COMPONENT_ID$2,
|
|
681
|
-
'data-garden-version': '8.
|
|
674
|
+
'data-garden-version': '8.63.0'
|
|
682
675
|
}).withConfig({
|
|
683
676
|
displayName: "StyledMultiselectItemsContainer",
|
|
684
677
|
componentId: "sc-1jzhet8-0"
|
|
@@ -688,9 +681,9 @@ StyledMultiselectItemsContainer.defaultProps = {
|
|
|
688
681
|
};
|
|
689
682
|
|
|
690
683
|
const COMPONENT_ID$1 = 'dropdowns.multiselect_item_wrapper';
|
|
691
|
-
const StyledMultiselectItemWrapper = styled__default
|
|
684
|
+
const StyledMultiselectItemWrapper = styled__default.default.div.attrs({
|
|
692
685
|
'data-garden-id': COMPONENT_ID$1,
|
|
693
|
-
'data-garden-version': '8.
|
|
686
|
+
'data-garden-version': '8.63.0'
|
|
694
687
|
}).withConfig({
|
|
695
688
|
displayName: "StyledMultiselectItemWrapper",
|
|
696
689
|
componentId: "sc-1rb2bye-0"
|
|
@@ -700,9 +693,9 @@ StyledMultiselectItemWrapper.defaultProps = {
|
|
|
700
693
|
};
|
|
701
694
|
|
|
702
695
|
const COMPONENT_ID = 'dropdowns.multiselect_more_anchor';
|
|
703
|
-
const StyledMultiselectMoreAnchor = styled__default
|
|
696
|
+
const StyledMultiselectMoreAnchor = styled__default.default.div.attrs({
|
|
704
697
|
'data-garden-id': COMPONENT_ID,
|
|
705
|
-
'data-garden-version': '8.
|
|
698
|
+
'data-garden-version': '8.63.0'
|
|
706
699
|
}).withConfig({
|
|
707
700
|
displayName: "StyledMultiselectMoreAnchor",
|
|
708
701
|
componentId: "sc-1m9v46e-0"
|
|
@@ -824,7 +817,7 @@ const Trigger = _ref => {
|
|
|
824
817
|
'aria-owns': null
|
|
825
818
|
};
|
|
826
819
|
const toggleButtonProps = hasMenuRef.current ? menuToggleProps : listboxToggleProps;
|
|
827
|
-
return
|
|
820
|
+
return React__namespace.default.cloneElement(React__namespace.default.Children.only(children), {
|
|
828
821
|
...toggleButtonProps,
|
|
829
822
|
[refKey]: childRef => {
|
|
830
823
|
popperRef(childRef);
|
|
@@ -833,11 +826,11 @@ const Trigger = _ref => {
|
|
|
833
826
|
}
|
|
834
827
|
});
|
|
835
828
|
};
|
|
836
|
-
return
|
|
829
|
+
return React__namespace.default.createElement(reactPopper.Reference, null, _ref2 => {
|
|
837
830
|
let {
|
|
838
831
|
ref: popperReference
|
|
839
832
|
} = _ref2;
|
|
840
|
-
return
|
|
833
|
+
return React__namespace.default.createElement(React__namespace.default.Fragment, null, renderChildren(popperReference), React__namespace.default.createElement(StyledInput, getInputProps({
|
|
841
834
|
readOnly: true,
|
|
842
835
|
isHidden: true,
|
|
843
836
|
tabIndex: -1,
|
|
@@ -853,17 +846,15 @@ const Trigger = _ref => {
|
|
|
853
846
|
});
|
|
854
847
|
};
|
|
855
848
|
Trigger.propTypes = {
|
|
856
|
-
children: PropTypes__default
|
|
857
|
-
refKey: PropTypes__default
|
|
849
|
+
children: PropTypes__default.default.any,
|
|
850
|
+
refKey: PropTypes__default.default.string
|
|
858
851
|
};
|
|
859
852
|
Trigger.defaultProps = {
|
|
860
853
|
refKey: 'ref'
|
|
861
854
|
};
|
|
862
855
|
|
|
863
856
|
var _path$2;
|
|
864
|
-
|
|
865
857
|
function _extends$2() { _extends$2 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2.apply(this, arguments); }
|
|
866
|
-
|
|
867
858
|
var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
|
|
868
859
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$2({
|
|
869
860
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -871,15 +862,14 @@ var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
|
|
|
871
862
|
height: 16,
|
|
872
863
|
focusable: "false",
|
|
873
864
|
viewBox: "0 0 16 16",
|
|
874
|
-
"aria-hidden": "true"
|
|
875
|
-
role: "img"
|
|
865
|
+
"aria-hidden": "true"
|
|
876
866
|
}, props), _path$2 || (_path$2 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
877
867
|
fill: "currentColor",
|
|
878
868
|
d: "M12.688 5.61a.5.5 0 01.69.718l-.066.062-5 4a.5.5 0 01-.542.054l-.082-.054-5-4a.5.5 0 01.55-.83l.074.05L8 9.359l4.688-3.75z"
|
|
879
869
|
})));
|
|
880
870
|
};
|
|
881
871
|
|
|
882
|
-
const FieldContext =
|
|
872
|
+
const FieldContext = React__namespace.default.createContext(undefined);
|
|
883
873
|
const useFieldContext = () => {
|
|
884
874
|
const fieldContext = React.useContext(FieldContext);
|
|
885
875
|
if (!fieldContext) {
|
|
@@ -940,11 +930,11 @@ const Autocomplete = React.forwardRef((_ref, ref) => {
|
|
|
940
930
|
React.useEffect(() => {
|
|
941
931
|
setDropdownType('autocomplete');
|
|
942
932
|
}, [setDropdownType]);
|
|
943
|
-
return
|
|
933
|
+
return React__namespace.default.createElement(reactPopper.Reference, null, _ref2 => {
|
|
944
934
|
let {
|
|
945
935
|
ref: popperReference
|
|
946
936
|
} = _ref2;
|
|
947
|
-
return
|
|
937
|
+
return React__namespace.default.createElement(StyledFauxInput, _extends$5({
|
|
948
938
|
isHovered: isContainerHovered,
|
|
949
939
|
isFocused: isContainerFocused,
|
|
950
940
|
tabIndex: null,
|
|
@@ -952,14 +942,14 @@ const Autocomplete = React.forwardRef((_ref, ref) => {
|
|
|
952
942
|
}, selectProps, {
|
|
953
943
|
ref: selectRef => {
|
|
954
944
|
popperReference(selectRef);
|
|
955
|
-
mergeRefs__default
|
|
945
|
+
mergeRefs__default.default([triggerRef, ref])(selectRef);
|
|
956
946
|
popperReferenceElementRef.current = selectRef;
|
|
957
947
|
}
|
|
958
|
-
}), start &&
|
|
948
|
+
}), start && React__namespace.default.createElement(StyledFauxInput.StartIcon, {
|
|
959
949
|
isHovered: isHovered || isLabelHovered && !isOpen,
|
|
960
950
|
isFocused: isContainerFocused,
|
|
961
951
|
isDisabled: props.disabled
|
|
962
|
-
}, start), !isOpen &&
|
|
952
|
+
}, start), !isOpen && React__namespace.default.createElement(StyledSelect, null, children), React__namespace.default.createElement(StyledInput, getInputProps({
|
|
963
953
|
isHidden: !isOpen,
|
|
964
954
|
disabled: props.disabled,
|
|
965
955
|
onFocus: () => {
|
|
@@ -974,22 +964,22 @@ const Autocomplete = React.forwardRef((_ref, ref) => {
|
|
|
974
964
|
}
|
|
975
965
|
},
|
|
976
966
|
role: 'combobox',
|
|
977
|
-
ref: mergeRefs__default
|
|
978
|
-
})), !props.isBare &&
|
|
967
|
+
ref: mergeRefs__default.default([inputRef, controlledInputRef || null])
|
|
968
|
+
})), !props.isBare && React__namespace.default.createElement(StyledFauxInput.EndIcon, {
|
|
979
969
|
isHovered: isHovered || isLabelHovered && !isOpen,
|
|
980
970
|
isFocused: isContainerFocused,
|
|
981
971
|
isDisabled: props.disabled,
|
|
982
972
|
isRotated: isOpen
|
|
983
|
-
},
|
|
973
|
+
}, React__namespace.default.createElement(SvgChevronDownStroke, null)));
|
|
984
974
|
});
|
|
985
975
|
});
|
|
986
976
|
Autocomplete.displayName = 'Autocomplete';
|
|
987
977
|
Autocomplete.propTypes = {
|
|
988
|
-
isCompact: PropTypes__default
|
|
989
|
-
isBare: PropTypes__default
|
|
990
|
-
disabled: PropTypes__default
|
|
991
|
-
focusInset: PropTypes__default
|
|
992
|
-
validation: PropTypes__default
|
|
978
|
+
isCompact: PropTypes__default.default.bool,
|
|
979
|
+
isBare: PropTypes__default.default.bool,
|
|
980
|
+
disabled: PropTypes__default.default.bool,
|
|
981
|
+
focusInset: PropTypes__default.default.bool,
|
|
982
|
+
validation: PropTypes__default.default.oneOf(reactForms.VALIDATION)
|
|
993
983
|
};
|
|
994
984
|
|
|
995
985
|
const Combobox = React.forwardRef((_ref, ref) => {
|
|
@@ -1057,33 +1047,33 @@ const Combobox = React.forwardRef((_ref, ref) => {
|
|
|
1057
1047
|
React.useEffect(() => {
|
|
1058
1048
|
setDropdownType('combobox');
|
|
1059
1049
|
}, [setDropdownType]);
|
|
1060
|
-
return
|
|
1050
|
+
return React__namespace.default.createElement(reactPopper.Reference, null, _ref2 => {
|
|
1061
1051
|
let {
|
|
1062
1052
|
ref: popperReference
|
|
1063
1053
|
} = _ref2;
|
|
1064
1054
|
const wrapperRefProp = element => {
|
|
1065
1055
|
popperReference(element);
|
|
1066
|
-
mergeRefs__default
|
|
1056
|
+
mergeRefs__default.default([wrapperRef, ref])(element);
|
|
1067
1057
|
popperReferenceElementRef.current = element;
|
|
1068
1058
|
};
|
|
1069
|
-
return
|
|
1059
|
+
return React__namespace.default.createElement(reactForms.MediaInput, _extends$5({}, inputProps, {
|
|
1070
1060
|
wrapperProps: wrapperProps,
|
|
1071
1061
|
wrapperRef: wrapperRefProp,
|
|
1072
|
-
ref: mergeRefs__default
|
|
1062
|
+
ref: mergeRefs__default.default([inputRef, inputRefProp])
|
|
1073
1063
|
}));
|
|
1074
1064
|
});
|
|
1075
1065
|
});
|
|
1076
1066
|
Combobox.displayName = 'Combobox';
|
|
1077
1067
|
Combobox.propTypes = {
|
|
1078
|
-
isCompact: PropTypes__default
|
|
1079
|
-
isBare: PropTypes__default
|
|
1080
|
-
disabled: PropTypes__default
|
|
1081
|
-
focusInset: PropTypes__default
|
|
1082
|
-
placeholder: PropTypes__default
|
|
1083
|
-
validation: PropTypes__default
|
|
1068
|
+
isCompact: PropTypes__default.default.bool,
|
|
1069
|
+
isBare: PropTypes__default.default.bool,
|
|
1070
|
+
disabled: PropTypes__default.default.bool,
|
|
1071
|
+
focusInset: PropTypes__default.default.bool,
|
|
1072
|
+
placeholder: PropTypes__default.default.string,
|
|
1073
|
+
validation: PropTypes__default.default.oneOf(reactForms.VALIDATION)
|
|
1084
1074
|
};
|
|
1085
1075
|
|
|
1086
|
-
const Multiselect =
|
|
1076
|
+
const Multiselect = React__namespace.default.forwardRef((_ref, ref) => {
|
|
1087
1077
|
let {
|
|
1088
1078
|
renderItem,
|
|
1089
1079
|
placeholder,
|
|
@@ -1199,8 +1189,8 @@ const Multiselect = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1199
1189
|
value: item,
|
|
1200
1190
|
removeValue
|
|
1201
1191
|
});
|
|
1202
|
-
const focusRef =
|
|
1203
|
-
const clonedChild =
|
|
1192
|
+
const focusRef = React__namespace.default.createRef();
|
|
1193
|
+
const clonedChild = React__namespace.default.cloneElement(renderedItem, {
|
|
1204
1194
|
...getItemProps({
|
|
1205
1195
|
item,
|
|
1206
1196
|
focusRef,
|
|
@@ -1239,7 +1229,7 @@ const Multiselect = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1239
1229
|
size: props.isCompact ? 'medium' : 'large'
|
|
1240
1230
|
});
|
|
1241
1231
|
const key = `${itemToString(item)}-${index}`;
|
|
1242
|
-
return
|
|
1232
|
+
return React__namespace.default.createElement(StyledMultiselectItemWrapper, {
|
|
1243
1233
|
key: key
|
|
1244
1234
|
}, clonedChild);
|
|
1245
1235
|
}, [getItemProps, inputValue, renderItem, setDownshiftState, itemToString, selectedItems, props, inputRef, themeContext.rtl]);
|
|
@@ -1250,7 +1240,7 @@ const Multiselect = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1250
1240
|
const item = itemValues[x];
|
|
1251
1241
|
if (x < maxItems) {
|
|
1252
1242
|
if (props.disabled) {
|
|
1253
|
-
const renderedItem =
|
|
1243
|
+
const renderedItem = React__namespace.default.cloneElement(renderItem({
|
|
1254
1244
|
value: item,
|
|
1255
1245
|
removeValue: () => {
|
|
1256
1246
|
return undefined;
|
|
@@ -1258,16 +1248,16 @@ const Multiselect = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1258
1248
|
}), {
|
|
1259
1249
|
size: props.isCompact ? 'medium' : 'large'
|
|
1260
1250
|
});
|
|
1261
|
-
output.push(
|
|
1251
|
+
output.push( React__namespace.default.createElement(StyledMultiselectItemWrapper, {
|
|
1262
1252
|
key: x
|
|
1263
1253
|
}, renderedItem));
|
|
1264
1254
|
} else {
|
|
1265
1255
|
output.push(renderSelectableItem(item, x));
|
|
1266
1256
|
}
|
|
1267
1257
|
} else if (!isFocused && !inputValue || props.disabled) {
|
|
1268
|
-
output.push(
|
|
1258
|
+
output.push( React__namespace.default.createElement(StyledMultiselectItemWrapper, {
|
|
1269
1259
|
key: "more-anchor"
|
|
1270
|
-
},
|
|
1260
|
+
}, React__namespace.default.createElement(StyledMultiselectMoreAnchor, {
|
|
1271
1261
|
isCompact: props.isCompact,
|
|
1272
1262
|
isDisabled: props.disabled
|
|
1273
1263
|
}, renderShowMore ? renderShowMore(itemValues.length - x) : `+ ${itemValues.length - x} more`)));
|
|
@@ -1283,26 +1273,26 @@ const Multiselect = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1283
1273
|
React.useEffect(() => {
|
|
1284
1274
|
setDropdownType('multiselect');
|
|
1285
1275
|
}, [setDropdownType]);
|
|
1286
|
-
return
|
|
1276
|
+
return React__namespace.default.createElement(reactPopper.Reference, null, _ref2 => {
|
|
1287
1277
|
let {
|
|
1288
1278
|
ref: popperReference
|
|
1289
1279
|
} = _ref2;
|
|
1290
|
-
return
|
|
1280
|
+
return React__namespace.default.createElement(StyledFauxInput, getContainerProps({
|
|
1291
1281
|
...selectProps,
|
|
1292
1282
|
isHovered: isContainerHovered,
|
|
1293
1283
|
isFocused: isContainerFocused,
|
|
1294
1284
|
ref: selectRef => {
|
|
1295
1285
|
popperReference(selectRef);
|
|
1296
|
-
mergeRefs__default
|
|
1286
|
+
mergeRefs__default.default([triggerRef, popperReferenceElementRef, ref])(selectRef);
|
|
1297
1287
|
}
|
|
1298
|
-
}), start &&
|
|
1288
|
+
}), start && React__namespace.default.createElement(StyledFauxInput.StartIcon, {
|
|
1299
1289
|
isHovered: isHovered || isLabelHovered && !isOpen,
|
|
1300
1290
|
isFocused: isContainerFocused,
|
|
1301
1291
|
isDisabled: props.disabled
|
|
1302
|
-
}, start),
|
|
1292
|
+
}, start), React__namespace.default.createElement(StyledMultiselectItemsContainer, {
|
|
1303
1293
|
isBare: props.isBare,
|
|
1304
1294
|
isCompact: props.isCompact
|
|
1305
|
-
}, items,
|
|
1295
|
+
}, items, React__namespace.default.createElement(StyledMultiselectInput, getInputProps({
|
|
1306
1296
|
disabled: props.disabled,
|
|
1307
1297
|
onFocus: () => {
|
|
1308
1298
|
setFocusedItem(undefined);
|
|
@@ -1332,31 +1322,31 @@ const Multiselect = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1332
1322
|
isVisible: isFocused || inputValue || selectedItems.length === 0,
|
|
1333
1323
|
isCompact: props.isCompact,
|
|
1334
1324
|
role: 'combobox',
|
|
1335
|
-
ref: mergeRefs__default
|
|
1325
|
+
ref: mergeRefs__default.default([inputRef, externalInputRef]),
|
|
1336
1326
|
placeholder: selectedItems.length === 0 ? placeholder : undefined
|
|
1337
|
-
}))), !props.isBare &&
|
|
1327
|
+
}))), !props.isBare && React__namespace.default.createElement(StyledFauxInput.EndIcon, {
|
|
1338
1328
|
isHovered: isHovered || isLabelHovered && !isOpen,
|
|
1339
1329
|
isFocused: isContainerFocused,
|
|
1340
1330
|
isDisabled: props.disabled,
|
|
1341
1331
|
isRotated: isOpen
|
|
1342
|
-
},
|
|
1332
|
+
}, React__namespace.default.createElement(SvgChevronDownStroke, null)));
|
|
1343
1333
|
});
|
|
1344
1334
|
});
|
|
1345
1335
|
Multiselect.propTypes = {
|
|
1346
|
-
isCompact: PropTypes__default
|
|
1347
|
-
isBare: PropTypes__default
|
|
1348
|
-
disabled: PropTypes__default
|
|
1349
|
-
focusInset: PropTypes__default
|
|
1350
|
-
renderItem: PropTypes__default
|
|
1351
|
-
maxItems: PropTypes__default
|
|
1352
|
-
validation: PropTypes__default
|
|
1336
|
+
isCompact: PropTypes__default.default.bool,
|
|
1337
|
+
isBare: PropTypes__default.default.bool,
|
|
1338
|
+
disabled: PropTypes__default.default.bool,
|
|
1339
|
+
focusInset: PropTypes__default.default.bool,
|
|
1340
|
+
renderItem: PropTypes__default.default.func.isRequired,
|
|
1341
|
+
maxItems: PropTypes__default.default.number,
|
|
1342
|
+
validation: PropTypes__default.default.oneOf(['success', 'warning', 'error'])
|
|
1353
1343
|
};
|
|
1354
1344
|
Multiselect.defaultProps = {
|
|
1355
1345
|
maxItems: 4
|
|
1356
1346
|
};
|
|
1357
1347
|
Multiselect.displayName = 'Multiselect';
|
|
1358
1348
|
|
|
1359
|
-
const Select =
|
|
1349
|
+
const Select = React__namespace.default.forwardRef((_ref, ref) => {
|
|
1360
1350
|
let {
|
|
1361
1351
|
children,
|
|
1362
1352
|
start,
|
|
@@ -1464,24 +1454,24 @@ const Select = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1464
1454
|
});
|
|
1465
1455
|
const isContainerHovered = isLabelHovered && !isOpen;
|
|
1466
1456
|
const isContainerFocused = isFocused || isOpen;
|
|
1467
|
-
return
|
|
1457
|
+
return React__namespace.default.createElement(reactPopper.Reference, null, _ref2 => {
|
|
1468
1458
|
let {
|
|
1469
1459
|
ref: popperReference
|
|
1470
1460
|
} = _ref2;
|
|
1471
|
-
return
|
|
1461
|
+
return React__namespace.default.createElement(StyledFauxInput, _extends$5({
|
|
1472
1462
|
isHovered: isContainerHovered,
|
|
1473
1463
|
isFocused: isContainerFocused
|
|
1474
1464
|
}, selectProps, {
|
|
1475
1465
|
role: "none",
|
|
1476
1466
|
ref: selectRef => {
|
|
1477
1467
|
popperReference(selectRef);
|
|
1478
|
-
mergeRefs__default
|
|
1468
|
+
mergeRefs__default.default([triggerRef, ref, popperReferenceElementRef])(selectRef);
|
|
1479
1469
|
}
|
|
1480
|
-
}), start &&
|
|
1470
|
+
}), start && React__namespace.default.createElement(StyledFauxInput.StartIcon, {
|
|
1481
1471
|
isHovered: isHovered || isLabelHovered && !isOpen,
|
|
1482
1472
|
isFocused: isContainerFocused,
|
|
1483
1473
|
isDisabled: props.disabled
|
|
1484
|
-
}, start),
|
|
1474
|
+
}, start), React__namespace.default.createElement(StyledSelect, null, children), React__namespace.default.createElement(StyledInput, getInputProps({
|
|
1485
1475
|
readOnly: true,
|
|
1486
1476
|
isHidden: true,
|
|
1487
1477
|
tabIndex: -1,
|
|
@@ -1493,22 +1483,22 @@ const Select = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1493
1483
|
}
|
|
1494
1484
|
},
|
|
1495
1485
|
onKeyDown: onInputKeyDown
|
|
1496
|
-
})), !props.isBare &&
|
|
1486
|
+
})), !props.isBare && React__namespace.default.createElement(StyledFauxInput.EndIcon, {
|
|
1497
1487
|
isHovered: isHovered || isLabelHovered && !isOpen,
|
|
1498
1488
|
isFocused: isContainerFocused,
|
|
1499
1489
|
isDisabled: props.disabled,
|
|
1500
1490
|
isRotated: isOpen
|
|
1501
|
-
},
|
|
1491
|
+
}, React__namespace.default.createElement(SvgChevronDownStroke, null)));
|
|
1502
1492
|
});
|
|
1503
1493
|
});
|
|
1504
1494
|
Select.displayName = 'Select';
|
|
1505
1495
|
Select.propTypes = {
|
|
1506
|
-
isCompact: PropTypes__default
|
|
1507
|
-
isBare: PropTypes__default
|
|
1508
|
-
disabled: PropTypes__default
|
|
1509
|
-
focusInset: PropTypes__default
|
|
1510
|
-
validation: PropTypes__default
|
|
1511
|
-
start: PropTypes__default
|
|
1496
|
+
isCompact: PropTypes__default.default.bool,
|
|
1497
|
+
isBare: PropTypes__default.default.bool,
|
|
1498
|
+
disabled: PropTypes__default.default.bool,
|
|
1499
|
+
focusInset: PropTypes__default.default.bool,
|
|
1500
|
+
validation: PropTypes__default.default.oneOf(reactForms.VALIDATION),
|
|
1501
|
+
start: PropTypes__default.default.any
|
|
1512
1502
|
};
|
|
1513
1503
|
|
|
1514
1504
|
const Field = React.forwardRef((props, fieldRef) => {
|
|
@@ -1525,20 +1515,20 @@ const Field = React.forwardRef((props, fieldRef) => {
|
|
|
1525
1515
|
isLabelHovered,
|
|
1526
1516
|
setIsLabelHovered
|
|
1527
1517
|
}), [isLabelHovered, setIsLabelHovered]);
|
|
1528
|
-
return
|
|
1518
|
+
return React__namespace.default.createElement(FieldContext.Provider, {
|
|
1529
1519
|
value: value
|
|
1530
|
-
},
|
|
1531
|
-
ref: mergeRefs__default
|
|
1520
|
+
}, React__namespace.default.createElement(reactForms.Field, _extends$5({
|
|
1521
|
+
ref: mergeRefs__default.default([ref, fieldRef])
|
|
1532
1522
|
}, props)));
|
|
1533
1523
|
});
|
|
1534
1524
|
Field.displayName = 'Field';
|
|
1535
1525
|
|
|
1536
|
-
const Hint =
|
|
1526
|
+
const Hint = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(reactForms.Hint, _extends$5({
|
|
1537
1527
|
ref: ref
|
|
1538
1528
|
}, props)));
|
|
1539
1529
|
Hint.displayName = 'Hint';
|
|
1540
1530
|
|
|
1541
|
-
const Label =
|
|
1531
|
+
const Label = React__namespace.default.forwardRef((_ref, ref) => {
|
|
1542
1532
|
let {
|
|
1543
1533
|
onMouseEnter,
|
|
1544
1534
|
onMouseLeave,
|
|
@@ -1561,27 +1551,27 @@ const Label = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1561
1551
|
}),
|
|
1562
1552
|
...other
|
|
1563
1553
|
});
|
|
1564
|
-
return
|
|
1554
|
+
return React__namespace.default.createElement(reactForms.Label, _extends$5({
|
|
1565
1555
|
ref: ref
|
|
1566
1556
|
}, labelProps));
|
|
1567
1557
|
});
|
|
1568
1558
|
Label.displayName = 'Label';
|
|
1569
1559
|
Label.propTypes = {
|
|
1570
|
-
isRegular: PropTypes__default
|
|
1560
|
+
isRegular: PropTypes__default.default.bool
|
|
1571
1561
|
};
|
|
1572
1562
|
|
|
1573
|
-
const Message =
|
|
1563
|
+
const Message = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(reactForms.Message, _extends$5({
|
|
1574
1564
|
ref: ref
|
|
1575
1565
|
}, props)));
|
|
1576
1566
|
Message.displayName = 'Message';
|
|
1577
1567
|
Message.propTypes = {
|
|
1578
|
-
validation: PropTypes__default
|
|
1568
|
+
validation: PropTypes__default.default.oneOf(reactForms.VALIDATION)
|
|
1579
1569
|
};
|
|
1580
1570
|
|
|
1581
1571
|
const SHARED_PLACEMENT = ['auto', 'top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end'];
|
|
1582
1572
|
const PLACEMENT = [...SHARED_PLACEMENT, 'end', 'end-top', 'end-bottom', 'start', 'start-top', 'start-bottom'];
|
|
1583
1573
|
|
|
1584
|
-
const MenuContext =
|
|
1574
|
+
const MenuContext = React__namespace.default.createContext(undefined);
|
|
1585
1575
|
const useMenuContext = () => {
|
|
1586
1576
|
const menuContext = React.useContext(MenuContext);
|
|
1587
1577
|
if (!menuContext) {
|
|
@@ -1641,12 +1631,12 @@ const Menu = React.forwardRef((props, menuRef) => {
|
|
|
1641
1631
|
itemSearchRegistry.current = [];
|
|
1642
1632
|
const popperPlacement = themeContext.rtl ? getRtlPopperPlacement(placement) : getPopperPlacement(placement);
|
|
1643
1633
|
return (
|
|
1644
|
-
|
|
1634
|
+
React__namespace.default.createElement(MenuContext.Provider, {
|
|
1645
1635
|
value: {
|
|
1646
1636
|
itemIndexRef,
|
|
1647
1637
|
isCompact
|
|
1648
1638
|
}
|
|
1649
|
-
},
|
|
1639
|
+
}, React__namespace.default.createElement(reactPopper.Popper, {
|
|
1650
1640
|
placement: popperPlacement,
|
|
1651
1641
|
modifiers: popperModifiers
|
|
1652
1642
|
,
|
|
@@ -1672,7 +1662,7 @@ const Menu = React.forwardRef((props, menuRef) => {
|
|
|
1672
1662
|
isAnimated: isAnimated && (isOpen || isVisible),
|
|
1673
1663
|
...otherProps
|
|
1674
1664
|
});
|
|
1675
|
-
const menu =
|
|
1665
|
+
const menu = React__namespace.default.createElement(StyledMenuWrapper, {
|
|
1676
1666
|
ref: isOpen ? ref : undefined,
|
|
1677
1667
|
hasArrow: menuProps.hasArrow,
|
|
1678
1668
|
placement: menuProps.placement,
|
|
@@ -1680,7 +1670,7 @@ const Menu = React.forwardRef((props, menuRef) => {
|
|
|
1680
1670
|
isHidden: !isOpen,
|
|
1681
1671
|
isAnimated: menuProps.isAnimated,
|
|
1682
1672
|
zIndex: zIndex
|
|
1683
|
-
},
|
|
1673
|
+
}, React__namespace.default.createElement(StyledMenu, _extends$5({
|
|
1684
1674
|
ref: menuRef,
|
|
1685
1675
|
isCompact: isCompact,
|
|
1686
1676
|
maxHeight: maxHeight,
|
|
@@ -1692,15 +1682,15 @@ const Menu = React.forwardRef((props, menuRef) => {
|
|
|
1692
1682
|
});
|
|
1693
1683
|
Menu.displayName = 'Menu';
|
|
1694
1684
|
Menu.propTypes = {
|
|
1695
|
-
popperModifiers: PropTypes__default
|
|
1696
|
-
eventsEnabled: PropTypes__default
|
|
1697
|
-
zIndex: PropTypes__default
|
|
1698
|
-
style: PropTypes__default
|
|
1699
|
-
placement: PropTypes__default
|
|
1700
|
-
isAnimated: PropTypes__default
|
|
1701
|
-
isCompact: PropTypes__default
|
|
1702
|
-
hasArrow: PropTypes__default
|
|
1703
|
-
maxHeight: PropTypes__default
|
|
1685
|
+
popperModifiers: PropTypes__default.default.any,
|
|
1686
|
+
eventsEnabled: PropTypes__default.default.bool,
|
|
1687
|
+
zIndex: PropTypes__default.default.number,
|
|
1688
|
+
style: PropTypes__default.default.object,
|
|
1689
|
+
placement: PropTypes__default.default.oneOf(PLACEMENT),
|
|
1690
|
+
isAnimated: PropTypes__default.default.bool,
|
|
1691
|
+
isCompact: PropTypes__default.default.bool,
|
|
1692
|
+
hasArrow: PropTypes__default.default.bool,
|
|
1693
|
+
maxHeight: PropTypes__default.default.string
|
|
1704
1694
|
};
|
|
1705
1695
|
Menu.defaultProps = {
|
|
1706
1696
|
placement: 'bottom-start',
|
|
@@ -1710,15 +1700,13 @@ Menu.defaultProps = {
|
|
|
1710
1700
|
zIndex: 1000
|
|
1711
1701
|
};
|
|
1712
1702
|
|
|
1713
|
-
const Separator =
|
|
1703
|
+
const Separator = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(StyledSeparator, _extends$5({
|
|
1714
1704
|
ref: ref
|
|
1715
1705
|
}, props)));
|
|
1716
1706
|
Separator.displayName = 'Separator';
|
|
1717
1707
|
|
|
1718
1708
|
var _path$1;
|
|
1719
|
-
|
|
1720
1709
|
function _extends$1() { _extends$1 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$1.apply(this, arguments); }
|
|
1721
|
-
|
|
1722
1710
|
var SvgPlusStroke = function SvgPlusStroke(props) {
|
|
1723
1711
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
|
|
1724
1712
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1726,8 +1714,7 @@ var SvgPlusStroke = function SvgPlusStroke(props) {
|
|
|
1726
1714
|
height: 16,
|
|
1727
1715
|
focusable: "false",
|
|
1728
1716
|
viewBox: "0 0 16 16",
|
|
1729
|
-
"aria-hidden": "true"
|
|
1730
|
-
role: "img"
|
|
1717
|
+
"aria-hidden": "true"
|
|
1731
1718
|
}, props), _path$1 || (_path$1 = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1732
1719
|
stroke: "currentColor",
|
|
1733
1720
|
strokeLinecap: "round",
|
|
@@ -1736,9 +1723,7 @@ var SvgPlusStroke = function SvgPlusStroke(props) {
|
|
|
1736
1723
|
};
|
|
1737
1724
|
|
|
1738
1725
|
var _path;
|
|
1739
|
-
|
|
1740
1726
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
1741
|
-
|
|
1742
1727
|
var SvgCheckLgStroke = function SvgCheckLgStroke(props) {
|
|
1743
1728
|
return /*#__PURE__*/React__namespace.createElement("svg", _extends({
|
|
1744
1729
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1746,8 +1731,7 @@ var SvgCheckLgStroke = function SvgCheckLgStroke(props) {
|
|
|
1746
1731
|
height: 16,
|
|
1747
1732
|
focusable: "false",
|
|
1748
1733
|
viewBox: "0 0 16 16",
|
|
1749
|
-
"aria-hidden": "true"
|
|
1750
|
-
role: "img"
|
|
1734
|
+
"aria-hidden": "true"
|
|
1751
1735
|
}, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
|
|
1752
1736
|
fill: "none",
|
|
1753
1737
|
stroke: "currentColor",
|
|
@@ -1757,7 +1741,7 @@ var SvgCheckLgStroke = function SvgCheckLgStroke(props) {
|
|
|
1757
1741
|
})));
|
|
1758
1742
|
};
|
|
1759
1743
|
|
|
1760
|
-
const ItemContext =
|
|
1744
|
+
const ItemContext = React__namespace.default.createContext(undefined);
|
|
1761
1745
|
const useItemContext = () => {
|
|
1762
1746
|
const context = React.useContext(ItemContext);
|
|
1763
1747
|
if (!context) {
|
|
@@ -1766,7 +1750,7 @@ const useItemContext = () => {
|
|
|
1766
1750
|
return context;
|
|
1767
1751
|
};
|
|
1768
1752
|
|
|
1769
|
-
const Item =
|
|
1753
|
+
const Item = React__namespace.default.forwardRef((_ref, forwardRef) => {
|
|
1770
1754
|
let {
|
|
1771
1755
|
value,
|
|
1772
1756
|
disabled,
|
|
@@ -1828,25 +1812,25 @@ const Item = React__default["default"].forwardRef((_ref, forwardRef) => {
|
|
|
1828
1812
|
const contextValue = React.useMemo(() => ({
|
|
1829
1813
|
isDisabled: disabled
|
|
1830
1814
|
}), [disabled]);
|
|
1831
|
-
const ref = mergeRefs__default
|
|
1815
|
+
const ref = mergeRefs__default.default([itemRef, forwardRef]);
|
|
1832
1816
|
if (disabled) {
|
|
1833
|
-
return
|
|
1817
|
+
return React__namespace.default.createElement(ItemContext.Provider, {
|
|
1834
1818
|
value: contextValue
|
|
1835
|
-
},
|
|
1819
|
+
}, React__namespace.default.createElement(Component, _extends$5({
|
|
1836
1820
|
ref: ref,
|
|
1837
1821
|
disabled: disabled,
|
|
1838
1822
|
isDanger: isDanger,
|
|
1839
1823
|
isCompact: isCompact
|
|
1840
|
-
}, props), isSelected && !hasIcon &&
|
|
1824
|
+
}, props), isSelected && !hasIcon && React__namespace.default.createElement(StyledItemIcon, {
|
|
1841
1825
|
isCompact: isCompact,
|
|
1842
1826
|
isVisible: isSelected,
|
|
1843
1827
|
isDisabled: disabled
|
|
1844
|
-
},
|
|
1828
|
+
}, React__namespace.default.createElement(SvgCheckLgStroke, null)), children));
|
|
1845
1829
|
}
|
|
1846
1830
|
itemIndexRef.current++;
|
|
1847
|
-
return
|
|
1831
|
+
return React__namespace.default.createElement(ItemContext.Provider, {
|
|
1848
1832
|
value: contextValue
|
|
1849
|
-
},
|
|
1833
|
+
}, React__namespace.default.createElement(Component, getItemProps({
|
|
1850
1834
|
item: value,
|
|
1851
1835
|
isFocused,
|
|
1852
1836
|
ref,
|
|
@@ -1857,18 +1841,18 @@ const Item = React__default["default"].forwardRef((_ref, forwardRef) => {
|
|
|
1857
1841
|
'aria-selected': null
|
|
1858
1842
|
}),
|
|
1859
1843
|
...props
|
|
1860
|
-
}), isSelected &&
|
|
1844
|
+
}), isSelected && !hasIcon && React__namespace.default.createElement(StyledItemIcon, {
|
|
1861
1845
|
isCompact: isCompact,
|
|
1862
1846
|
isVisible: isSelected
|
|
1863
|
-
},
|
|
1847
|
+
}, React__namespace.default.createElement(SvgCheckLgStroke, null)), children));
|
|
1864
1848
|
});
|
|
1865
1849
|
Item.displayName = 'Item';
|
|
1866
1850
|
Item.propTypes = {
|
|
1867
|
-
value: PropTypes__default
|
|
1868
|
-
disabled: PropTypes__default
|
|
1851
|
+
value: PropTypes__default.default.any,
|
|
1852
|
+
disabled: PropTypes__default.default.bool
|
|
1869
1853
|
};
|
|
1870
1854
|
|
|
1871
|
-
const AddItemComponent =
|
|
1855
|
+
const AddItemComponent = React__namespace.default.forwardRef((_ref, ref) => {
|
|
1872
1856
|
let {
|
|
1873
1857
|
children,
|
|
1874
1858
|
disabled,
|
|
@@ -1877,16 +1861,16 @@ const AddItemComponent = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1877
1861
|
const {
|
|
1878
1862
|
isCompact
|
|
1879
1863
|
} = useMenuContext();
|
|
1880
|
-
return
|
|
1864
|
+
return React__namespace.default.createElement(StyledAddItem, _extends$5({
|
|
1881
1865
|
ref: ref,
|
|
1882
1866
|
disabled: disabled
|
|
1883
|
-
}, props),
|
|
1867
|
+
}, props), React__namespace.default.createElement(StyledItemIcon, {
|
|
1884
1868
|
isCompact: isCompact,
|
|
1885
1869
|
isVisible: true,
|
|
1886
1870
|
isDisabled: disabled
|
|
1887
|
-
},
|
|
1871
|
+
}, React__namespace.default.createElement(SvgPlusStroke, null)), children);
|
|
1888
1872
|
});
|
|
1889
|
-
const AddItem =
|
|
1873
|
+
const AddItem = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(Item, _extends$5({
|
|
1890
1874
|
component: AddItemComponent,
|
|
1891
1875
|
ref: ref
|
|
1892
1876
|
}, props, {
|
|
@@ -1894,40 +1878,40 @@ const AddItem = React__default["default"].forwardRef((props, ref) => React__defa
|
|
|
1894
1878
|
})));
|
|
1895
1879
|
AddItem.displayName = 'AddItem';
|
|
1896
1880
|
AddItem.propTypes = {
|
|
1897
|
-
value: PropTypes__default
|
|
1898
|
-
disabled: PropTypes__default
|
|
1881
|
+
value: PropTypes__default.default.any,
|
|
1882
|
+
disabled: PropTypes__default.default.bool
|
|
1899
1883
|
};
|
|
1900
1884
|
|
|
1901
|
-
const HeaderIcon =
|
|
1885
|
+
const HeaderIcon = React__namespace.default.forwardRef((props, ref) => {
|
|
1902
1886
|
const {
|
|
1903
1887
|
isCompact
|
|
1904
1888
|
} = useMenuContext();
|
|
1905
|
-
return
|
|
1889
|
+
return React__namespace.default.createElement(StyledHeaderIcon, _extends$5({
|
|
1906
1890
|
ref: ref,
|
|
1907
1891
|
isCompact: isCompact
|
|
1908
1892
|
}, props));
|
|
1909
1893
|
});
|
|
1910
1894
|
HeaderIcon.displayName = 'HeaderIcon';
|
|
1911
1895
|
|
|
1912
|
-
const HeaderItem =
|
|
1896
|
+
const HeaderItem = React__namespace.default.forwardRef((props, ref) => {
|
|
1913
1897
|
const {
|
|
1914
1898
|
isCompact
|
|
1915
1899
|
} = useMenuContext();
|
|
1916
|
-
return
|
|
1900
|
+
return React__namespace.default.createElement(StyledHeaderItem, _extends$5({
|
|
1917
1901
|
ref: ref,
|
|
1918
1902
|
isCompact: isCompact
|
|
1919
1903
|
}, props));
|
|
1920
1904
|
});
|
|
1921
1905
|
HeaderItem.displayName = 'HeaderItem';
|
|
1922
1906
|
|
|
1923
|
-
const ItemMeta =
|
|
1907
|
+
const ItemMeta = React__namespace.default.forwardRef((props, ref) => {
|
|
1924
1908
|
const {
|
|
1925
1909
|
isCompact
|
|
1926
1910
|
} = useMenuContext();
|
|
1927
1911
|
const {
|
|
1928
1912
|
isDisabled
|
|
1929
1913
|
} = useItemContext();
|
|
1930
|
-
return
|
|
1914
|
+
return React__namespace.default.createElement(StyledItemMeta, _extends$5({
|
|
1931
1915
|
ref: ref,
|
|
1932
1916
|
isCompact: isCompact,
|
|
1933
1917
|
isDisabled: isDisabled
|
|
@@ -1935,11 +1919,11 @@ const ItemMeta = React__default["default"].forwardRef((props, ref) => {
|
|
|
1935
1919
|
});
|
|
1936
1920
|
ItemMeta.displayName = 'ItemMeta';
|
|
1937
1921
|
|
|
1938
|
-
const MediaBody =
|
|
1922
|
+
const MediaBody = React__namespace.default.forwardRef((props, ref) => {
|
|
1939
1923
|
const {
|
|
1940
1924
|
isCompact
|
|
1941
1925
|
} = useMenuContext();
|
|
1942
|
-
return
|
|
1926
|
+
return React__namespace.default.createElement(StyledMediaBody, _extends$5({
|
|
1943
1927
|
ref: ref,
|
|
1944
1928
|
isCompact: isCompact
|
|
1945
1929
|
}, props));
|
|
@@ -1950,22 +1934,22 @@ const MediaFigure = props => {
|
|
|
1950
1934
|
const {
|
|
1951
1935
|
isCompact
|
|
1952
1936
|
} = useMenuContext();
|
|
1953
|
-
return
|
|
1937
|
+
return React__namespace.default.createElement(StyledMediaFigure, _extends$5({
|
|
1954
1938
|
isCompact: isCompact
|
|
1955
1939
|
}, props));
|
|
1956
1940
|
};
|
|
1957
1941
|
|
|
1958
|
-
const MediaItem =
|
|
1942
|
+
const MediaItem = React__namespace.default.forwardRef((props, ref) => React__namespace.default.createElement(Item, _extends$5({
|
|
1959
1943
|
component: StyledMediaItem,
|
|
1960
1944
|
ref: ref
|
|
1961
1945
|
}, props)));
|
|
1962
1946
|
MediaItem.displayName = 'MediaItem';
|
|
1963
1947
|
MediaItem.propTypes = {
|
|
1964
|
-
value: PropTypes__default
|
|
1965
|
-
disabled: PropTypes__default
|
|
1948
|
+
value: PropTypes__default.default.any,
|
|
1949
|
+
disabled: PropTypes__default.default.bool
|
|
1966
1950
|
};
|
|
1967
1951
|
|
|
1968
|
-
const NextItemComponent =
|
|
1952
|
+
const NextItemComponent = React__namespace.default.forwardRef((_ref, ref) => {
|
|
1969
1953
|
let {
|
|
1970
1954
|
children,
|
|
1971
1955
|
disabled,
|
|
@@ -1974,18 +1958,18 @@ const NextItemComponent = React__default["default"].forwardRef((_ref, ref) => {
|
|
|
1974
1958
|
const {
|
|
1975
1959
|
isCompact
|
|
1976
1960
|
} = useMenuContext();
|
|
1977
|
-
return
|
|
1961
|
+
return React__namespace.default.createElement(StyledNextItem, _extends$5({
|
|
1978
1962
|
ref: ref,
|
|
1979
1963
|
disabled: disabled
|
|
1980
|
-
}, props),
|
|
1964
|
+
}, props), React__namespace.default.createElement(StyledItemIcon, {
|
|
1981
1965
|
isCompact: isCompact,
|
|
1982
1966
|
isDisabled: disabled,
|
|
1983
1967
|
isVisible: true
|
|
1984
|
-
},
|
|
1968
|
+
}, React__namespace.default.createElement(StyledNextIcon, {
|
|
1985
1969
|
isDisabled: disabled
|
|
1986
1970
|
})), children);
|
|
1987
1971
|
});
|
|
1988
|
-
const NextItem =
|
|
1972
|
+
const NextItem = React__namespace.default.forwardRef((_ref2, ref) => {
|
|
1989
1973
|
let {
|
|
1990
1974
|
value,
|
|
1991
1975
|
disabled,
|
|
@@ -2003,7 +1987,7 @@ const NextItem = React__default["default"].forwardRef((_ref2, ref) => {
|
|
|
2003
1987
|
if (!disabled) {
|
|
2004
1988
|
nextItemsHashRef.current[itemToString(value)] = itemIndexRef.current;
|
|
2005
1989
|
}
|
|
2006
|
-
return
|
|
1990
|
+
return React__namespace.default.createElement(Item, _extends$5({
|
|
2007
1991
|
component: NextItemComponent,
|
|
2008
1992
|
"aria-expanded": true,
|
|
2009
1993
|
disabled: disabled,
|
|
@@ -2015,11 +1999,11 @@ const NextItem = React__default["default"].forwardRef((_ref2, ref) => {
|
|
|
2015
1999
|
});
|
|
2016
2000
|
NextItem.displayName = 'NextItem';
|
|
2017
2001
|
NextItem.propTypes = {
|
|
2018
|
-
value: PropTypes__default
|
|
2019
|
-
disabled: PropTypes__default
|
|
2002
|
+
value: PropTypes__default.default.any,
|
|
2003
|
+
disabled: PropTypes__default.default.bool
|
|
2020
2004
|
};
|
|
2021
2005
|
|
|
2022
|
-
const PreviousItemComponent =
|
|
2006
|
+
const PreviousItemComponent = React__namespace.default.forwardRef((_ref, ref) => {
|
|
2023
2007
|
let {
|
|
2024
2008
|
children,
|
|
2025
2009
|
disabled,
|
|
@@ -2028,18 +2012,18 @@ const PreviousItemComponent = React__default["default"].forwardRef((_ref, ref) =
|
|
|
2028
2012
|
const {
|
|
2029
2013
|
isCompact
|
|
2030
2014
|
} = useMenuContext();
|
|
2031
|
-
return
|
|
2015
|
+
return React__namespace.default.createElement(StyledPreviousItem, _extends$5({
|
|
2032
2016
|
ref: ref,
|
|
2033
2017
|
disabled: disabled
|
|
2034
|
-
}, props),
|
|
2018
|
+
}, props), React__namespace.default.createElement(StyledItemIcon, {
|
|
2035
2019
|
isCompact: isCompact,
|
|
2036
2020
|
isDisabled: disabled,
|
|
2037
2021
|
isVisible: true
|
|
2038
|
-
},
|
|
2022
|
+
}, React__namespace.default.createElement(StyledPreviousIcon, {
|
|
2039
2023
|
isDisabled: disabled
|
|
2040
2024
|
})), children);
|
|
2041
2025
|
});
|
|
2042
|
-
const PreviousItem =
|
|
2026
|
+
const PreviousItem = React__namespace.default.forwardRef((_ref2, ref) => {
|
|
2043
2027
|
let {
|
|
2044
2028
|
value,
|
|
2045
2029
|
disabled,
|
|
@@ -2054,7 +2038,7 @@ const PreviousItem = React__default["default"].forwardRef((_ref2, ref) => {
|
|
|
2054
2038
|
if (!disabled) {
|
|
2055
2039
|
previousIndexRef.current = itemIndexRef.current;
|
|
2056
2040
|
}
|
|
2057
|
-
return
|
|
2041
|
+
return React__namespace.default.createElement(Item, _extends$5({
|
|
2058
2042
|
component: PreviousItemComponent,
|
|
2059
2043
|
"aria-expanded": true,
|
|
2060
2044
|
value: value,
|
|
@@ -2066,8 +2050,8 @@ const PreviousItem = React__default["default"].forwardRef((_ref2, ref) => {
|
|
|
2066
2050
|
});
|
|
2067
2051
|
PreviousItem.displayName = 'PreviousItem';
|
|
2068
2052
|
PreviousItem.propTypes = {
|
|
2069
|
-
value: PropTypes__default
|
|
2070
|
-
disabled: PropTypes__default
|
|
2053
|
+
value: PropTypes__default.default.any,
|
|
2054
|
+
disabled: PropTypes__default.default.bool
|
|
2071
2055
|
};
|
|
2072
2056
|
|
|
2073
2057
|
Object.defineProperty(exports, 'resetIdCounter', {
|