@linzjs/lui 17.11.0 → 17.11.3
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/CHANGELOG.md +21 -0
- package/dist/components/LuiFormElements/LuiTextInput/LuiTextInput.d.ts +1 -0
- package/dist/components/LuiListBox/LuiListBox.d.ts +1 -1
- package/dist/components/LuiListBox/Renderers/CheckboxItemRenderer.d.ts +1 -1
- package/dist/components/LuiListBox/Renderers/DefaultItemRenderer.d.ts +1 -1
- package/dist/components/LuiListBox/Renderers/RadioItemRenderer.d.ts +1 -1
- package/dist/index.d.ts +3 -0
- package/dist/index.js +3463 -34
- package/dist/index.js.map +1 -1
- package/dist/lui.css +20 -3
- package/dist/lui.css.map +1 -1
- package/dist/lui.esm.js +3461 -35
- package/dist/lui.esm.js.map +1 -1
- package/dist/scss/Components/LuiFormElements/LuiTextInput/LuiTextInput.scss +16 -3
- package/dist/scss/Components/Messaging/messaging.scss +8 -0
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -786,8 +786,8 @@ function LuiFormikForm(props) {
|
|
|
786
786
|
" "))));
|
|
787
787
|
}
|
|
788
788
|
|
|
789
|
-
var css_248z$
|
|
790
|
-
styleInject(css_248z$
|
|
789
|
+
var css_248z$8 = "/**\n @deprecated\n */\n/**\n @deprecated\n */\n/**\n @deprecated\n */\n.LuiError {\n font-family: \"Open Sans\", system-ui, sans-serif;\n font-style: normal;\n font-weight: 600;\n margin-bottom: 0.5rem;\n font-size: 0.875rem;\n line-height: 1.5rem;\n color: #2a292c;\n}\n.LuiError-errorIcon {\n vertical-align: middle;\n display: inline-block;\n}\n.LuiError-errorText {\n margin-left: 0.5rem;\n}";
|
|
790
|
+
styleInject(css_248z$8);
|
|
791
791
|
|
|
792
792
|
const LuiError = ({ error, className }) => (React__default["default"].createElement("div", { className: `LuiError ${className}-error` },
|
|
793
793
|
React__default["default"].createElement(LuiIcon, { className: `LuiError-errorIcon ${className}-errorIcon`, alt: 'Error', name: "ic_error", size: "md", status: "error" }),
|
|
@@ -873,7 +873,7 @@ function useGenerateOrDefaultId(idFromProps) {
|
|
|
873
873
|
}
|
|
874
874
|
const LuiTextInput = (props) => {
|
|
875
875
|
const id = useGenerateOrDefaultId(props.inputProps?.id);
|
|
876
|
-
return (React__default["default"].createElement("div", { className: clsx('LuiTextInput', props.error && 'hasError', props.className) },
|
|
876
|
+
return (React__default["default"].createElement("div", { className: clsx('LuiTextInput', props.error && 'hasError', props.warning && 'hasWarning', props.className) },
|
|
877
877
|
React__default["default"].createElement("label", { className: 'LuiTextInput-label', htmlFor: id },
|
|
878
878
|
props.mandatory && React__default["default"].createElement("span", { className: "LuiTextInput-mandatory" }, "*"),
|
|
879
879
|
React__default["default"].createElement("span", { className: 'LuiTextInput-label-text ' +
|
|
@@ -884,7 +884,10 @@ const LuiTextInput = (props) => {
|
|
|
884
884
|
props.icon),
|
|
885
885
|
props.error && (React__default["default"].createElement("span", { className: "LuiTextInput-error" },
|
|
886
886
|
React__default["default"].createElement(LuiIcon, { alt: "error", name: "ic_error", className: "LuiTextInput-error-icon", size: "sm", status: "error" }),
|
|
887
|
-
props.error))
|
|
887
|
+
props.error)),
|
|
888
|
+
props.warning && (React__default["default"].createElement("span", { className: "LuiTextInput-warning" },
|
|
889
|
+
React__default["default"].createElement(LuiIcon, { alt: "warning", name: "ic_warning", className: "LuiTextInput-warning-icon", size: "sm", status: "warning" }),
|
|
890
|
+
props.warning)))));
|
|
888
891
|
};
|
|
889
892
|
|
|
890
893
|
const LuiCheckboxInput = (props) => {
|
|
@@ -24936,8 +24939,8 @@ function isChromatic() {
|
|
|
24936
24939
|
window?.location.href.match(/chromatic=true/));
|
|
24937
24940
|
}
|
|
24938
24941
|
|
|
24939
|
-
var css_248z$
|
|
24940
|
-
styleInject(css_248z$
|
|
24942
|
+
var css_248z$7 = ":export {\n charcoal: #2a292c;\n fuscous: #6b6966;\n gray: #989189;\n silver: #beb9b4;\n lily: #eaeaea;\n hint: #f9f9f9;\n snow: #ffffff;\n white: #ffffff;\n teal: #00425d;\n sea: #007198;\n electric: #0096cc;\n spray: #73c8e1;\n polar: #e2f3f7;\n sherpa: #004b50;\n surfie: #017a76;\n persian: #00a599;\n downy: #73cdc8;\n iceberg: #dcf5f0;\n sacramento: #004e32;\n salem: #08814d;\n pigment: #0aa245;\n granny: #9bd79b;\n panache: #e9fae7;\n brand-primary: #004b50;\n brand-secondary: #017a76;\n error: #cc0000;\n error-bg: #f5cccc;\n error-focus: #5a0000;\n warning: #ea6a2e;\n warning-bg: #fbdfd2;\n warning-focus: #b33a01;\n success: #0aa245;\n success-bg: #e9fae7;\n info: #3a7cdf;\n info-bg: #d8e5f9;\n visited: #00425d;\n green-hover: #107c3a;\n green-active: #094a22;\n green-btn: #0aa245;\n txt-link: #0096cc;\n primary-hover-btn: #005678;\n selection: #c7e9f3;\n heading-color: #017a76;\n heading-color--secondary: #2a292c;\n base-type-color: #2a292c;\n input-text: #2a292c;\n input-placeholder: #6b6966;\n input-placeholder-when-disabled: #989189;\n base-icon-color: #007198;\n disabled-color: #989189;\n disabled-color-dark: #6b6966;\n linz-color-primary: #023d48;\n linz-color-primary-hover: #01818a;\n linz-color-tertiary: #e1e44a;\n linz-color-tertiary-hover: #cdcf59;\n color-test-pink: #f09;\n linz-linear-gradient-blue: linear-gradient(70deg, #00425d 12%, #007198 100%);\n linz-linear-gradient-teal: linear-gradient(270deg, #00a599 1%, #73cdc8 100%);\n}";
|
|
24943
|
+
styleInject(css_248z$7);
|
|
24941
24944
|
|
|
24942
24945
|
var _excluded = ["allowCreateWhileLoading", "createOptionPosition", "formatCreateLabel", "isValidNewOption", "getNewOptionData", "onCreateOption", "options", "onChange"];
|
|
24943
24946
|
|
|
@@ -25067,22 +25070,22 @@ function LuiComboSelectActual(givenProps, ref) {
|
|
|
25067
25070
|
...theme,
|
|
25068
25071
|
colors: {
|
|
25069
25072
|
...theme.colors,
|
|
25070
|
-
primary: css_248z$
|
|
25071
|
-
primary75: css_248z$
|
|
25072
|
-
primary50: css_248z$
|
|
25073
|
-
primary25: css_248z$
|
|
25074
|
-
neutral90: css_248z$
|
|
25075
|
-
neutral80: css_248z$
|
|
25076
|
-
neutral70: css_248z$
|
|
25077
|
-
neutral60: css_248z$
|
|
25078
|
-
neutral50: css_248z$
|
|
25079
|
-
neutral40: css_248z$
|
|
25080
|
-
neutral30: css_248z$
|
|
25081
|
-
neutral20: css_248z$
|
|
25082
|
-
neutral10: css_248z$
|
|
25083
|
-
neutral5: css_248z$
|
|
25084
|
-
danger: css_248z$
|
|
25085
|
-
dangerLight: css_248z$
|
|
25073
|
+
primary: css_248z$7['sea'],
|
|
25074
|
+
primary75: css_248z$7['electric'],
|
|
25075
|
+
primary50: css_248z$7['spray'],
|
|
25076
|
+
primary25: css_248z$7['polar'],
|
|
25077
|
+
neutral90: css_248z$7['charcoal'],
|
|
25078
|
+
neutral80: css_248z$7['charcoal'],
|
|
25079
|
+
neutral70: css_248z$7['charcoal'],
|
|
25080
|
+
neutral60: css_248z$7['fuscous'],
|
|
25081
|
+
neutral50: css_248z$7['fuscous'],
|
|
25082
|
+
neutral40: css_248z$7['gray'],
|
|
25083
|
+
neutral30: css_248z$7['gray'],
|
|
25084
|
+
neutral20: css_248z$7['silver'],
|
|
25085
|
+
neutral10: css_248z$7['lily'],
|
|
25086
|
+
neutral5: css_248z$7['hint'],
|
|
25087
|
+
danger: css_248z$7['error'],
|
|
25088
|
+
dangerLight: css_248z$7['error-bg'],
|
|
25086
25089
|
},
|
|
25087
25090
|
}),
|
|
25088
25091
|
styles: {
|
|
@@ -25097,7 +25100,7 @@ function LuiComboSelectActual(givenProps, ref) {
|
|
|
25097
25100
|
}),
|
|
25098
25101
|
dropdownIndicator: (provided) => ({
|
|
25099
25102
|
...provided,
|
|
25100
|
-
color: css_248z$
|
|
25103
|
+
color: css_248z$7['fuscous'],
|
|
25101
25104
|
}),
|
|
25102
25105
|
indicatorSeparator: (provided) => ({
|
|
25103
25106
|
...provided,
|
|
@@ -25122,12 +25125,12 @@ function LuiComboSelectActual(givenProps, ref) {
|
|
|
25122
25125
|
/* please keep this in sync with FormVars.scss/mixin.formPlaceholder */
|
|
25123
25126
|
fontWeight: 'normal',
|
|
25124
25127
|
fontStyle: 'italic',
|
|
25125
|
-
color: css_248z$
|
|
25128
|
+
color: css_248z$7['input-placeholder'],
|
|
25126
25129
|
}),
|
|
25127
25130
|
option: (provided, { isSelected }) => ({
|
|
25128
25131
|
...provided,
|
|
25129
|
-
color: css_248z$
|
|
25130
|
-
backgroundColor: isSelected ? css_248z$
|
|
25132
|
+
color: css_248z$7['input-text'],
|
|
25133
|
+
backgroundColor: isSelected ? css_248z$7['selection'] : css_248z$7['white'],
|
|
25131
25134
|
}),
|
|
25132
25135
|
},
|
|
25133
25136
|
};
|
|
@@ -28079,8 +28082,8 @@ const LuiModalHeader = (props) => {
|
|
|
28079
28082
|
React__default["default"].createElement("i", { className: "material-icons-round lui-modal-header-btn-size" }, "close")))))));
|
|
28080
28083
|
};
|
|
28081
28084
|
|
|
28082
|
-
var css_248z$
|
|
28083
|
-
styleInject(css_248z$
|
|
28085
|
+
var css_248z$6 = "@keyframes react-loading-skeleton {\n 100% {\n transform: translateX(100%);\n }\n}\n\n.react-loading-skeleton {\n --base-color: #ebebeb;\n --highlight-color: #f5f5f5;\n --animation-duration: 1.5s;\n --animation-direction: normal;\n --pseudo-element-display: block; /* Enable animation */\n\n background-color: var(--base-color);\n\n width: 100%;\n border-radius: 0.25rem;\n display: inline-flex;\n line-height: 1;\n\n position: relative;\n overflow: hidden;\n z-index: 1; /* Necessary for overflow: hidden to work correctly in Safari */\n}\n\n.react-loading-skeleton::after {\n content: ' ';\n display: var(--pseudo-element-display);\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n background-repeat: no-repeat;\n background-image: linear-gradient(\n 90deg,\n var(--base-color),\n var(--highlight-color),\n var(--base-color)\n );\n transform: translateX(-100%);\n\n animation-name: react-loading-skeleton;\n animation-direction: var(--animation-direction);\n animation-duration: var(--animation-duration);\n animation-timing-function: ease-in-out;\n animation-iteration-count: infinite;\n}\n";
|
|
28086
|
+
styleInject(css_248z$6);
|
|
28084
28087
|
|
|
28085
28088
|
/**
|
|
28086
28089
|
* @internal
|
|
@@ -32572,11 +32575,11 @@ tippy.setDefaultProps({
|
|
|
32572
32575
|
render: render
|
|
32573
32576
|
});
|
|
32574
32577
|
|
|
32575
|
-
var css_248z$
|
|
32576
|
-
styleInject(css_248z$
|
|
32578
|
+
var css_248z$5 = ".tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:\"\";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}";
|
|
32579
|
+
styleInject(css_248z$5);
|
|
32577
32580
|
|
|
32578
|
-
var css_248z$
|
|
32579
|
-
styleInject(css_248z$
|
|
32581
|
+
var css_248z$4 = ".tippy-box{border:1px transparent}.tippy-box[data-placement^=top]>.tippy-arrow:after{border-top-color:inherit;border-width:8px 8px 0;bottom:-8px;left:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:after{border-bottom-color:inherit;border-width:0 8px 8px;top:-8px;left:0}.tippy-box[data-placement^=left]>.tippy-arrow:after{border-left-color:inherit;border-width:8px 0 8px 8px;right:-8px;top:0}.tippy-box[data-placement^=right]>.tippy-arrow:after{border-width:8px 8px 8px 0;left:-8px;top:0;border-right-color:inherit}.tippy-box[data-placement^=top]>.tippy-svg-arrow>svg:first-child:not(:last-child){top:17px}.tippy-box[data-placement^=bottom]>.tippy-svg-arrow>svg:first-child:not(:last-child){bottom:17px}.tippy-box[data-placement^=left]>.tippy-svg-arrow>svg:first-child:not(:last-child){left:12px}.tippy-box[data-placement^=right]>.tippy-svg-arrow>svg:first-child:not(:last-child){right:12px}.tippy-arrow{border-color:inherit}.tippy-arrow:after{content:\"\";z-index:-1;position:absolute;border-color:transparent;border-style:solid}";
|
|
32582
|
+
styleInject(css_248z$4);
|
|
32580
32583
|
|
|
32581
32584
|
let id = 0;
|
|
32582
32585
|
const getKey = () => id++;
|
|
@@ -32680,8 +32683,8 @@ const LuiSidePanelProvider = ({ children }) => {
|
|
|
32680
32683
|
React__default["default"].createElement(LuiSidePanelContainer, { ...props })));
|
|
32681
32684
|
};
|
|
32682
32685
|
|
|
32683
|
-
var css_248z = ".lui-switch-checkbox {\n height: 0;\n width: 0;\n visibility: hidden;\n}\n\n.lui-switch-label {\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n width: 40px;\n height: 20px;\n background: grey;\n border-radius: 40px;\n position: relative;\n transition: background-color 0.2s;\n}\n\n.lui-switch-label .lui-switch-button {\n content: \"\";\n position: absolute;\n top: 2px;\n left: 2px;\n width: 18px;\n height: 16px;\n border-radius: 18px;\n transition: 0.2s;\n background: #fff;\n box-shadow: 0 0 2px 0 rgba(10, 10, 10, 0.29);\n}\n\n.lui-switch-checkbox:checked + .lui-switch-label .lui-switch-button {\n left: calc(100% - 2px);\n transform: translateX(-100%);\n}\n\n.lui-switch-label:active .lui-switch-button {\n width: 20px;\n}";
|
|
32684
|
-
styleInject(css_248z);
|
|
32686
|
+
var css_248z$3 = ".lui-switch-checkbox {\n height: 0;\n width: 0;\n visibility: hidden;\n}\n\n.lui-switch-label {\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n width: 40px;\n height: 20px;\n background: grey;\n border-radius: 40px;\n position: relative;\n transition: background-color 0.2s;\n}\n\n.lui-switch-label .lui-switch-button {\n content: \"\";\n position: absolute;\n top: 2px;\n left: 2px;\n width: 18px;\n height: 16px;\n border-radius: 18px;\n transition: 0.2s;\n background: #fff;\n box-shadow: 0 0 2px 0 rgba(10, 10, 10, 0.29);\n}\n\n.lui-switch-checkbox:checked + .lui-switch-label .lui-switch-button {\n left: calc(100% - 2px);\n transform: translateX(-100%);\n}\n\n.lui-switch-label:active .lui-switch-button {\n width: 20px;\n}";
|
|
32687
|
+
styleInject(css_248z$3);
|
|
32685
32688
|
|
|
32686
32689
|
const LuiSwitchButton = (props) => {
|
|
32687
32690
|
const generatedId = useGenerateOrDefaultId();
|
|
@@ -40393,6 +40396,3430 @@ const LuiAccordicardStatic = (props) => {
|
|
|
40393
40396
|
React__default["default"].createElement(LuiIcon, { className: clsx('LuiAccordicardStatic-chevron', isOpen ? 'LuiAccordicardStatic-chevron--isOpen' : null), name: 'ic_expand_more', alt: "expand", title: "Expand and collapse panel", size: "md" }))));
|
|
40394
40397
|
};
|
|
40395
40398
|
|
|
40399
|
+
var css_248z$2 = "/**\n @deprecated\n */\n/**\n @deprecated\n */\n/**\n @deprecated\n */\n.LuiListBox {\n padding: 0;\n list-style: none;\n}\n.LuiListBox .LuiListBoxItem {\n font-family: \"Open Sans\", system-ui, sans-serif;\n font-style: normal;\n font-weight: normal;\n user-select: none;\n color: #2a292c;\n line-height: 24px;\n outline: none;\n padding: 0.5rem 0.75rem;\n border: 2px solid transparent;\n}\n.LuiListBox .LuiListBoxItem:focus-visible {\n border-color: #007198;\n}\n.LuiListBox .LuiListBoxItem.LuiListBoxItem-selected {\n background: #e2f3f7;\n}\n.LuiListBox .LuiListBoxItem:hover, .LuiListBox .LuiListBoxItem.LuiListBoxItem-selected:hover {\n background: #d6eef4;\n}\n.LuiListBox .LuiListBoxItem.LuiListBoxItem-disabled {\n background: #eaeaea;\n}\n.LuiListBox .LuiListBox-emptyIndicator, .LuiListBox .LuiListBox-loadingIndicator {\n padding: 0.5rem 0.75rem;\n}";
|
|
40400
|
+
styleInject(css_248z$2);
|
|
40401
|
+
|
|
40402
|
+
function $c1d7fb2ec91bae71$var$Item(props) {
|
|
40403
|
+
return null;
|
|
40404
|
+
}
|
|
40405
|
+
$c1d7fb2ec91bae71$var$Item.getCollectionNode = function* getCollectionNode(props, context) {
|
|
40406
|
+
let { childItems: childItems , title: title , children: children } = props;
|
|
40407
|
+
let rendered = props.title || props.children;
|
|
40408
|
+
let textValue = props.textValue || (typeof rendered === 'string' ? rendered : '') || props['aria-label'] || '';
|
|
40409
|
+
// suppressTextValueWarning is used in components like Tabs, which don't have type to select support.
|
|
40410
|
+
if (!textValue && !(context === null || context === void 0 ? void 0 : context.suppressTextValueWarning)) console.warn('<Item> with non-plain text contents is unsupported by type to select for accessibility. Please add a `textValue` prop.');
|
|
40411
|
+
yield {
|
|
40412
|
+
type: 'item',
|
|
40413
|
+
props: props,
|
|
40414
|
+
rendered: rendered,
|
|
40415
|
+
textValue: textValue,
|
|
40416
|
+
'aria-label': props['aria-label'],
|
|
40417
|
+
hasChildNodes: $c1d7fb2ec91bae71$var$hasChildItems(props),
|
|
40418
|
+
*childNodes () {
|
|
40419
|
+
if (childItems) for (let child1 of childItems)yield {
|
|
40420
|
+
type: 'item',
|
|
40421
|
+
value: child1
|
|
40422
|
+
};
|
|
40423
|
+
else if (title) {
|
|
40424
|
+
let items = [];
|
|
40425
|
+
React__default["default"].Children.forEach(children, (child)=>{
|
|
40426
|
+
items.push({
|
|
40427
|
+
type: 'item',
|
|
40428
|
+
element: child
|
|
40429
|
+
});
|
|
40430
|
+
});
|
|
40431
|
+
yield* items;
|
|
40432
|
+
}
|
|
40433
|
+
}
|
|
40434
|
+
};
|
|
40435
|
+
};
|
|
40436
|
+
function $c1d7fb2ec91bae71$var$hasChildItems(props) {
|
|
40437
|
+
if (props.hasChildItems != null) return props.hasChildItems;
|
|
40438
|
+
if (props.childItems) return true;
|
|
40439
|
+
if (props.title && React__default["default"].Children.count(props.children) > 0) return true;
|
|
40440
|
+
return false;
|
|
40441
|
+
}
|
|
40442
|
+
// We don't want getCollectionNode to show up in the type definition
|
|
40443
|
+
let $c1d7fb2ec91bae71$export$6d08773d2e66f8f2 = $c1d7fb2ec91bae71$var$Item;
|
|
40444
|
+
|
|
40445
|
+
|
|
40446
|
+
|
|
40447
|
+
class $eb2240fc39a57fa5$export$bf788dd355e3a401 {
|
|
40448
|
+
build(props, context) {
|
|
40449
|
+
this.context = context;
|
|
40450
|
+
return $eb2240fc39a57fa5$var$iterable(()=>this.iterateCollection(props)
|
|
40451
|
+
);
|
|
40452
|
+
}
|
|
40453
|
+
*iterateCollection(props) {
|
|
40454
|
+
let { children: children , items: items } = props;
|
|
40455
|
+
if (typeof children === 'function') {
|
|
40456
|
+
if (!items) throw new Error('props.children was a function but props.items is missing');
|
|
40457
|
+
for (let item of props.items)yield* this.getFullNode({
|
|
40458
|
+
value: item
|
|
40459
|
+
}, {
|
|
40460
|
+
renderer: children
|
|
40461
|
+
});
|
|
40462
|
+
} else {
|
|
40463
|
+
let items = [];
|
|
40464
|
+
React__default["default"].Children.forEach(children, (child)=>{
|
|
40465
|
+
items.push(child);
|
|
40466
|
+
});
|
|
40467
|
+
let index = 0;
|
|
40468
|
+
for (let item of items){
|
|
40469
|
+
let nodes = this.getFullNode({
|
|
40470
|
+
element: item,
|
|
40471
|
+
index: index
|
|
40472
|
+
}, {
|
|
40473
|
+
});
|
|
40474
|
+
for (let node of nodes){
|
|
40475
|
+
index++;
|
|
40476
|
+
yield node;
|
|
40477
|
+
}
|
|
40478
|
+
}
|
|
40479
|
+
}
|
|
40480
|
+
}
|
|
40481
|
+
getKey(item, partialNode, state, parentKey) {
|
|
40482
|
+
if (item.key != null) return item.key;
|
|
40483
|
+
if (partialNode.type === 'cell' && partialNode.key != null) return `${parentKey}${partialNode.key}`;
|
|
40484
|
+
let v = partialNode.value;
|
|
40485
|
+
if (v != null) {
|
|
40486
|
+
var _key;
|
|
40487
|
+
let key = (_key = v.key) !== null && _key !== void 0 ? _key : v.id;
|
|
40488
|
+
if (key == null) throw new Error('No key found for item');
|
|
40489
|
+
return key;
|
|
40490
|
+
}
|
|
40491
|
+
return parentKey ? `${parentKey}.${partialNode.index}` : `$.${partialNode.index}`;
|
|
40492
|
+
}
|
|
40493
|
+
getChildState(state, partialNode) {
|
|
40494
|
+
return {
|
|
40495
|
+
renderer: partialNode.renderer || state.renderer
|
|
40496
|
+
};
|
|
40497
|
+
}
|
|
40498
|
+
*getFullNode(partialNode, state, parentKey, parentNode) {
|
|
40499
|
+
// If there's a value instead of an element on the node, and a parent renderer function is available,
|
|
40500
|
+
// use it to render an element for the value.
|
|
40501
|
+
let element = partialNode.element;
|
|
40502
|
+
if (!element && partialNode.value && state && state.renderer) {
|
|
40503
|
+
let cached = this.cache.get(partialNode.value);
|
|
40504
|
+
if (cached && (!cached.shouldInvalidate || !cached.shouldInvalidate(this.context))) {
|
|
40505
|
+
cached.index = partialNode.index;
|
|
40506
|
+
cached.parentKey = parentNode ? parentNode.key : null;
|
|
40507
|
+
yield cached;
|
|
40508
|
+
return;
|
|
40509
|
+
}
|
|
40510
|
+
element = state.renderer(partialNode.value);
|
|
40511
|
+
}
|
|
40512
|
+
// If there's an element with a getCollectionNode function on its type, then it's a supported component.
|
|
40513
|
+
// Call this function to get a partial node, and recursively build a full node from there.
|
|
40514
|
+
if (React__default["default"].isValidElement(element)) {
|
|
40515
|
+
let type = element.type;
|
|
40516
|
+
if (typeof type !== 'function' && typeof type.getCollectionNode !== 'function') {
|
|
40517
|
+
let name = typeof element.type === 'function' ? element.type.name : element.type;
|
|
40518
|
+
throw new Error(`Unknown element <${name}> in collection.`);
|
|
40519
|
+
}
|
|
40520
|
+
let childNodes = type.getCollectionNode(element.props, this.context);
|
|
40521
|
+
let index = partialNode.index;
|
|
40522
|
+
let result = childNodes.next();
|
|
40523
|
+
while(!result.done && result.value){
|
|
40524
|
+
let childNode = result.value;
|
|
40525
|
+
partialNode.index = index;
|
|
40526
|
+
let nodeKey = childNode.key;
|
|
40527
|
+
if (!nodeKey) nodeKey = childNode.element ? null : this.getKey(element, partialNode, state, parentKey);
|
|
40528
|
+
let nodes = this.getFullNode({
|
|
40529
|
+
...childNode,
|
|
40530
|
+
key: nodeKey,
|
|
40531
|
+
index: index,
|
|
40532
|
+
wrapper: $eb2240fc39a57fa5$var$compose(partialNode.wrapper, childNode.wrapper)
|
|
40533
|
+
}, this.getChildState(state, childNode), parentKey ? `${parentKey}${element.key}` : element.key, parentNode);
|
|
40534
|
+
let children = [
|
|
40535
|
+
...nodes
|
|
40536
|
+
];
|
|
40537
|
+
for (let node of children){
|
|
40538
|
+
// Cache the node based on its value
|
|
40539
|
+
node.value = childNode.value || partialNode.value;
|
|
40540
|
+
if (node.value) this.cache.set(node.value, node);
|
|
40541
|
+
// The partial node may have specified a type for the child in order to specify a constraint.
|
|
40542
|
+
// Verify that the full node that was built recursively matches this type.
|
|
40543
|
+
if (partialNode.type && node.type !== partialNode.type) throw new Error(`Unsupported type <${$eb2240fc39a57fa5$var$capitalize(node.type)}> in <${$eb2240fc39a57fa5$var$capitalize(parentNode.type)}>. Only <${$eb2240fc39a57fa5$var$capitalize(partialNode.type)}> is supported.`);
|
|
40544
|
+
index++;
|
|
40545
|
+
yield node;
|
|
40546
|
+
}
|
|
40547
|
+
result = childNodes.next(children);
|
|
40548
|
+
}
|
|
40549
|
+
return;
|
|
40550
|
+
}
|
|
40551
|
+
// Ignore invalid elements
|
|
40552
|
+
if (partialNode.key == null) return;
|
|
40553
|
+
// Create full node
|
|
40554
|
+
let builder = this;
|
|
40555
|
+
let node = {
|
|
40556
|
+
type: partialNode.type,
|
|
40557
|
+
props: partialNode.props,
|
|
40558
|
+
key: partialNode.key,
|
|
40559
|
+
parentKey: parentNode ? parentNode.key : null,
|
|
40560
|
+
value: partialNode.value,
|
|
40561
|
+
level: parentNode ? parentNode.level + 1 : 0,
|
|
40562
|
+
index: partialNode.index,
|
|
40563
|
+
rendered: partialNode.rendered,
|
|
40564
|
+
textValue: partialNode.textValue,
|
|
40565
|
+
'aria-label': partialNode['aria-label'],
|
|
40566
|
+
wrapper: partialNode.wrapper,
|
|
40567
|
+
shouldInvalidate: partialNode.shouldInvalidate,
|
|
40568
|
+
hasChildNodes: partialNode.hasChildNodes,
|
|
40569
|
+
childNodes: $eb2240fc39a57fa5$var$iterable(function*() {
|
|
40570
|
+
if (!partialNode.hasChildNodes) return;
|
|
40571
|
+
let index = 0;
|
|
40572
|
+
for (let child of partialNode.childNodes()){
|
|
40573
|
+
// Ensure child keys are globally unique by prepending the parent node's key
|
|
40574
|
+
if (child.key != null) // TODO: Remove this line entirely and enforce that users always provide unique keys.
|
|
40575
|
+
// Currently this line will have issues when a parent has a key `a` and a child with key `bc`
|
|
40576
|
+
// but another parent has key `ab` and its child has a key `c`. The combined keys would result in both
|
|
40577
|
+
// children having a key of `abc`.
|
|
40578
|
+
child.key = `${node.key}${child.key}`;
|
|
40579
|
+
child.index = index;
|
|
40580
|
+
let nodes = builder.getFullNode(child, builder.getChildState(state, child), node.key, node);
|
|
40581
|
+
for (let node1 of nodes){
|
|
40582
|
+
index++;
|
|
40583
|
+
yield node1;
|
|
40584
|
+
}
|
|
40585
|
+
}
|
|
40586
|
+
})
|
|
40587
|
+
};
|
|
40588
|
+
yield node;
|
|
40589
|
+
}
|
|
40590
|
+
constructor(){
|
|
40591
|
+
this.cache = new WeakMap();
|
|
40592
|
+
}
|
|
40593
|
+
}
|
|
40594
|
+
// Wraps an iterator function as an iterable object, and caches the results.
|
|
40595
|
+
function $eb2240fc39a57fa5$var$iterable(iterator) {
|
|
40596
|
+
let cache = [];
|
|
40597
|
+
let iterable = null;
|
|
40598
|
+
return {
|
|
40599
|
+
*[Symbol.iterator] () {
|
|
40600
|
+
for (let item of cache)yield item;
|
|
40601
|
+
if (!iterable) iterable = iterator();
|
|
40602
|
+
for (let item1 of iterable){
|
|
40603
|
+
cache.push(item1);
|
|
40604
|
+
yield item1;
|
|
40605
|
+
}
|
|
40606
|
+
}
|
|
40607
|
+
};
|
|
40608
|
+
}
|
|
40609
|
+
function $eb2240fc39a57fa5$var$compose(outer, inner) {
|
|
40610
|
+
if (outer && inner) return (element)=>outer(inner(element))
|
|
40611
|
+
;
|
|
40612
|
+
if (outer) return outer;
|
|
40613
|
+
if (inner) return inner;
|
|
40614
|
+
}
|
|
40615
|
+
function $eb2240fc39a57fa5$var$capitalize(str) {
|
|
40616
|
+
return str[0].toUpperCase() + str.slice(1);
|
|
40617
|
+
}
|
|
40618
|
+
|
|
40619
|
+
|
|
40620
|
+
|
|
40621
|
+
function $7613b1592d41b092$export$6cd28814d92fa9c9(props, factory, context, invalidators = []) {
|
|
40622
|
+
let builder = React.useMemo(()=>new $eb2240fc39a57fa5$export$bf788dd355e3a401()
|
|
40623
|
+
, []);
|
|
40624
|
+
let prev = React.useRef(null);
|
|
40625
|
+
return React.useMemo(()=>{
|
|
40626
|
+
let nodes = builder.build(props, context);
|
|
40627
|
+
prev.current = factory(nodes, prev.current);
|
|
40628
|
+
return prev.current;
|
|
40629
|
+
// Don't invalidate when any prop changes, just the two we care about.
|
|
40630
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
40631
|
+
}, [
|
|
40632
|
+
builder,
|
|
40633
|
+
props.children,
|
|
40634
|
+
props.items,
|
|
40635
|
+
context,
|
|
40636
|
+
...invalidators
|
|
40637
|
+
]);
|
|
40638
|
+
}
|
|
40639
|
+
|
|
40640
|
+
|
|
40641
|
+
const $453cc9f0df89c0a5$var$cache = new WeakMap();
|
|
40642
|
+
function $453cc9f0df89c0a5$export$77d5aafae4e095b2(collection) {
|
|
40643
|
+
let count = $453cc9f0df89c0a5$var$cache.get(collection);
|
|
40644
|
+
if (count != null) return count;
|
|
40645
|
+
count = 0;
|
|
40646
|
+
for (let item of collection)if (item.type === 'section') count += $453cc9f0df89c0a5$export$77d5aafae4e095b2(item.childNodes);
|
|
40647
|
+
else count++;
|
|
40648
|
+
$453cc9f0df89c0a5$var$cache.set(collection, count);
|
|
40649
|
+
return count;
|
|
40650
|
+
}
|
|
40651
|
+
|
|
40652
|
+
function mapToAriaListBoxProps({ selectionMode, selectionBehavior, items = [], value, onChange, ariaProps, getKey = (item) => {
|
|
40653
|
+
if (!item.hasOwnProperty('key')) {
|
|
40654
|
+
throw Error('Could not find `key` property on item, please provide a custom `getKey` function');
|
|
40655
|
+
}
|
|
40656
|
+
return item.key;
|
|
40657
|
+
}, }) {
|
|
40658
|
+
return {
|
|
40659
|
+
...ariaProps,
|
|
40660
|
+
items: items?.map((item) => {
|
|
40661
|
+
if (item.hasOwnProperty('key')) {
|
|
40662
|
+
return item;
|
|
40663
|
+
}
|
|
40664
|
+
return { ...item, key: getKey(item) };
|
|
40665
|
+
}),
|
|
40666
|
+
selectionMode,
|
|
40667
|
+
selectionBehavior,
|
|
40668
|
+
selectedKeys: (Array.isArray(value) ? value : [value]).filter(Boolean),
|
|
40669
|
+
children: (item) => React__default["default"].createElement($c1d7fb2ec91bae71$export$6d08773d2e66f8f2, null, String(item.key)),
|
|
40670
|
+
...(onChange
|
|
40671
|
+
? {
|
|
40672
|
+
onSelectionChange: (keys) => {
|
|
40673
|
+
const selectedItems = keys === 'all'
|
|
40674
|
+
? items
|
|
40675
|
+
: items.filter((item) => keys.has(getKey(item)));
|
|
40676
|
+
const selectedKeys = keys === 'all'
|
|
40677
|
+
? items.map((item) => getKey(item))
|
|
40678
|
+
: Array.from(keys);
|
|
40679
|
+
onChange(selectedKeys, selectedItems);
|
|
40680
|
+
},
|
|
40681
|
+
}
|
|
40682
|
+
: {}),
|
|
40683
|
+
};
|
|
40684
|
+
}
|
|
40685
|
+
|
|
40686
|
+
function $458b0a5536c1a7cf$export$40bfa8c7b0832715(value1, defaultValue, onChange) {
|
|
40687
|
+
let [stateValue, setStateValue] = React.useState(value1 || defaultValue);
|
|
40688
|
+
let ref = React.useRef(value1 !== undefined);
|
|
40689
|
+
let wasControlled = ref.current;
|
|
40690
|
+
let isControlled = value1 !== undefined;
|
|
40691
|
+
// Internal state reference for useCallback
|
|
40692
|
+
let stateRef = React.useRef(stateValue);
|
|
40693
|
+
if (wasControlled !== isControlled) console.warn(`WARN: A component changed from ${wasControlled ? 'controlled' : 'uncontrolled'} to ${isControlled ? 'controlled' : 'uncontrolled'}.`);
|
|
40694
|
+
ref.current = isControlled;
|
|
40695
|
+
let setValue = React.useCallback((value2, ...args)=>{
|
|
40696
|
+
let onChangeCaller = (value, ...onChangeArgs)=>{
|
|
40697
|
+
if (onChange) {
|
|
40698
|
+
if (!Object.is(stateRef.current, value)) onChange(value, ...onChangeArgs);
|
|
40699
|
+
}
|
|
40700
|
+
if (!isControlled) stateRef.current = value;
|
|
40701
|
+
};
|
|
40702
|
+
if (typeof value2 === 'function') {
|
|
40703
|
+
console.warn('We can not support a function callback. See Github Issues for details https://github.com/adobe/react-spectrum/issues/2320');
|
|
40704
|
+
// this supports functional updates https://reactjs.org/docs/hooks-reference.html#functional-updates
|
|
40705
|
+
// when someone using useControlledState calls setControlledState(myFunc)
|
|
40706
|
+
// this will call our useState setState with a function as well which invokes myFunc and calls onChange with the value from myFunc
|
|
40707
|
+
// if we're in an uncontrolled state, then we also return the value of myFunc which to setState looks as though it was just called with myFunc from the beginning
|
|
40708
|
+
// otherwise we just return the controlled value, which won't cause a rerender because React knows to bail out when the value is the same
|
|
40709
|
+
let updateFunction = (oldValue, ...functionArgs)=>{
|
|
40710
|
+
let interceptedValue = value2(isControlled ? stateRef.current : oldValue, ...functionArgs);
|
|
40711
|
+
onChangeCaller(interceptedValue, ...args);
|
|
40712
|
+
if (!isControlled) return interceptedValue;
|
|
40713
|
+
return oldValue;
|
|
40714
|
+
};
|
|
40715
|
+
setStateValue(updateFunction);
|
|
40716
|
+
} else {
|
|
40717
|
+
if (!isControlled) setStateValue(value2);
|
|
40718
|
+
onChangeCaller(value2, ...args);
|
|
40719
|
+
}
|
|
40720
|
+
}, [
|
|
40721
|
+
isControlled,
|
|
40722
|
+
onChange
|
|
40723
|
+
]);
|
|
40724
|
+
// If a controlled component's value prop changes, we need to update stateRef
|
|
40725
|
+
if (isControlled) stateRef.current = value1;
|
|
40726
|
+
else value1 = stateValue;
|
|
40727
|
+
return [
|
|
40728
|
+
value1,
|
|
40729
|
+
setValue
|
|
40730
|
+
];
|
|
40731
|
+
}
|
|
40732
|
+
|
|
40733
|
+
// Default context value to use in case there is no SSRProvider. This is fine for
|
|
40734
|
+
// client-only apps. In order to support multiple copies of React Aria potentially
|
|
40735
|
+
// being on the page at once, the prefix is set to a random number. SSRProvider
|
|
40736
|
+
// will reset this to zero for consistency between server and client, so in the
|
|
40737
|
+
// SSR case multiple copies of React Aria is not supported.
|
|
40738
|
+
const $704cf1d3b684cc5c$var$defaultContext = {
|
|
40739
|
+
prefix: String(Math.round(Math.random() * 10000000000)),
|
|
40740
|
+
current: 0
|
|
40741
|
+
};
|
|
40742
|
+
const $704cf1d3b684cc5c$var$SSRContext = /*#__PURE__*/ React__default["default"].createContext($704cf1d3b684cc5c$var$defaultContext);
|
|
40743
|
+
let $704cf1d3b684cc5c$var$canUseDOM = Boolean(typeof window !== 'undefined' && window.document && window.document.createElement);
|
|
40744
|
+
function $704cf1d3b684cc5c$export$619500959fc48b26(defaultId) {
|
|
40745
|
+
let ctx = React.useContext($704cf1d3b684cc5c$var$SSRContext);
|
|
40746
|
+
// If we are rendering in a non-DOM environment, and there's no SSRProvider,
|
|
40747
|
+
// provide a warning to hint to the developer to add one.
|
|
40748
|
+
if (ctx === $704cf1d3b684cc5c$var$defaultContext && !$704cf1d3b684cc5c$var$canUseDOM) console.warn('When server rendering, you must wrap your application in an <SSRProvider> to ensure consistent ids are generated between the client and server.');
|
|
40749
|
+
return React.useMemo(()=>defaultId || `react-aria${ctx.prefix}-${++ctx.current}`
|
|
40750
|
+
, [
|
|
40751
|
+
defaultId
|
|
40752
|
+
]);
|
|
40753
|
+
}
|
|
40754
|
+
function $704cf1d3b684cc5c$export$535bd6ca7f90a273() {
|
|
40755
|
+
let cur = React.useContext($704cf1d3b684cc5c$var$SSRContext);
|
|
40756
|
+
let isInSSRContext = cur !== $704cf1d3b684cc5c$var$defaultContext;
|
|
40757
|
+
let [isSSR, setIsSSR] = React.useState(isInSSRContext);
|
|
40758
|
+
// If on the client, and the component was initially server rendered,
|
|
40759
|
+
// then schedule a layout effect to update the component after hydration.
|
|
40760
|
+
if (typeof window !== 'undefined' && isInSSRContext) // This if statement technically breaks the rules of hooks, but is safe
|
|
40761
|
+
// because the condition never changes after mounting.
|
|
40762
|
+
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
40763
|
+
React.useLayoutEffect(()=>{
|
|
40764
|
+
setIsSSR(false);
|
|
40765
|
+
}, []);
|
|
40766
|
+
return isSSR;
|
|
40767
|
+
}
|
|
40768
|
+
|
|
40769
|
+
const $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c = typeof window !== 'undefined' ? React__default["default"].useLayoutEffect : ()=>{
|
|
40770
|
+
};
|
|
40771
|
+
|
|
40772
|
+
|
|
40773
|
+
|
|
40774
|
+
|
|
40775
|
+
let $bdb11010cef70236$var$idsUpdaterMap = new Map();
|
|
40776
|
+
function $bdb11010cef70236$export$f680877a34711e37(defaultId) {
|
|
40777
|
+
let [value, setValue] = React.useState(defaultId);
|
|
40778
|
+
let nextId = React.useRef(null);
|
|
40779
|
+
let res = $704cf1d3b684cc5c$export$619500959fc48b26(value);
|
|
40780
|
+
let updateValue = React.useCallback((val)=>{
|
|
40781
|
+
nextId.current = val;
|
|
40782
|
+
}, []);
|
|
40783
|
+
$bdb11010cef70236$var$idsUpdaterMap.set(res, updateValue);
|
|
40784
|
+
$f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(()=>{
|
|
40785
|
+
let r = res;
|
|
40786
|
+
return ()=>{
|
|
40787
|
+
$bdb11010cef70236$var$idsUpdaterMap.delete(r);
|
|
40788
|
+
};
|
|
40789
|
+
}, [
|
|
40790
|
+
res
|
|
40791
|
+
]);
|
|
40792
|
+
// This cannot cause an infinite loop because the ref is updated first.
|
|
40793
|
+
// eslint-disable-next-line
|
|
40794
|
+
React.useEffect(()=>{
|
|
40795
|
+
let newId = nextId.current;
|
|
40796
|
+
if (newId) {
|
|
40797
|
+
nextId.current = null;
|
|
40798
|
+
setValue(newId);
|
|
40799
|
+
}
|
|
40800
|
+
});
|
|
40801
|
+
return res;
|
|
40802
|
+
}
|
|
40803
|
+
function $bdb11010cef70236$export$cd8c9cb68f842629(idA, idB) {
|
|
40804
|
+
if (idA === idB) return idA;
|
|
40805
|
+
let setIdA = $bdb11010cef70236$var$idsUpdaterMap.get(idA);
|
|
40806
|
+
if (setIdA) {
|
|
40807
|
+
setIdA(idB);
|
|
40808
|
+
return idB;
|
|
40809
|
+
}
|
|
40810
|
+
let setIdB = $bdb11010cef70236$var$idsUpdaterMap.get(idB);
|
|
40811
|
+
if (setIdB) {
|
|
40812
|
+
setIdB(idA);
|
|
40813
|
+
return idA;
|
|
40814
|
+
}
|
|
40815
|
+
return idB;
|
|
40816
|
+
}
|
|
40817
|
+
function $bdb11010cef70236$export$b4cc09c592e8fdb8(depArray = []) {
|
|
40818
|
+
let id = $bdb11010cef70236$export$f680877a34711e37();
|
|
40819
|
+
let [resolvedId, setResolvedId] = $1dbecbe27a04f9af$export$14d238f342723f25(id);
|
|
40820
|
+
let updateId = React.useCallback(()=>{
|
|
40821
|
+
setResolvedId(function*() {
|
|
40822
|
+
yield id;
|
|
40823
|
+
yield document.getElementById(id) ? id : null;
|
|
40824
|
+
});
|
|
40825
|
+
}, [
|
|
40826
|
+
id,
|
|
40827
|
+
setResolvedId
|
|
40828
|
+
]);
|
|
40829
|
+
$f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(updateId, [
|
|
40830
|
+
id,
|
|
40831
|
+
updateId,
|
|
40832
|
+
...depArray
|
|
40833
|
+
]);
|
|
40834
|
+
return resolvedId;
|
|
40835
|
+
}
|
|
40836
|
+
|
|
40837
|
+
|
|
40838
|
+
function $ff5963eb1fccf552$export$e08e3b67e392101e(...callbacks) {
|
|
40839
|
+
return (...args)=>{
|
|
40840
|
+
for (let callback of callbacks)if (typeof callback === 'function') callback(...args);
|
|
40841
|
+
};
|
|
40842
|
+
}
|
|
40843
|
+
|
|
40844
|
+
|
|
40845
|
+
|
|
40846
|
+
|
|
40847
|
+
|
|
40848
|
+
function $3ef42575df84b30b$export$9d1611c77c2fe928(...args) {
|
|
40849
|
+
// Start with a base clone of the first argument. This is a lot faster than starting
|
|
40850
|
+
// with an empty object and adding properties as we go.
|
|
40851
|
+
let result = {
|
|
40852
|
+
...args[0]
|
|
40853
|
+
};
|
|
40854
|
+
for(let i = 1; i < args.length; i++){
|
|
40855
|
+
let props = args[i];
|
|
40856
|
+
for(let key in props){
|
|
40857
|
+
let a = result[key];
|
|
40858
|
+
let b = props[key];
|
|
40859
|
+
// Chain events
|
|
40860
|
+
if (typeof a === 'function' && typeof b === 'function' && // This is a lot faster than a regex.
|
|
40861
|
+
key[0] === 'o' && key[1] === 'n' && key.charCodeAt(2) >= /* 'A' */ 65 && key.charCodeAt(2) <= /* 'Z' */ 90) result[key] = $ff5963eb1fccf552$export$e08e3b67e392101e(a, b);
|
|
40862
|
+
else if ((key === 'className' || key === 'UNSAFE_className') && typeof a === 'string' && typeof b === 'string') result[key] = clsx(a, b);
|
|
40863
|
+
else if (key === 'id' && a && b) result.id = $bdb11010cef70236$export$cd8c9cb68f842629(a, b);
|
|
40864
|
+
else result[key] = b !== undefined ? b : a;
|
|
40865
|
+
}
|
|
40866
|
+
}
|
|
40867
|
+
return result;
|
|
40868
|
+
}
|
|
40869
|
+
|
|
40870
|
+
|
|
40871
|
+
const $65484d02dcb7eb3e$var$DOMPropNames = new Set([
|
|
40872
|
+
'id'
|
|
40873
|
+
]);
|
|
40874
|
+
const $65484d02dcb7eb3e$var$labelablePropNames = new Set([
|
|
40875
|
+
'aria-label',
|
|
40876
|
+
'aria-labelledby',
|
|
40877
|
+
'aria-describedby',
|
|
40878
|
+
'aria-details'
|
|
40879
|
+
]);
|
|
40880
|
+
const $65484d02dcb7eb3e$var$propRe = /^(data-.*)$/;
|
|
40881
|
+
function $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, opts = {
|
|
40882
|
+
}) {
|
|
40883
|
+
let { labelable: labelable , propNames: propNames } = opts;
|
|
40884
|
+
let filteredProps = {
|
|
40885
|
+
};
|
|
40886
|
+
for(const prop in props)if (Object.prototype.hasOwnProperty.call(props, prop) && ($65484d02dcb7eb3e$var$DOMPropNames.has(prop) || labelable && $65484d02dcb7eb3e$var$labelablePropNames.has(prop) || (propNames === null || propNames === void 0 ? void 0 : propNames.has(prop)) || $65484d02dcb7eb3e$var$propRe.test(prop))) filteredProps[prop] = props[prop];
|
|
40887
|
+
return filteredProps;
|
|
40888
|
+
}
|
|
40889
|
+
|
|
40890
|
+
|
|
40891
|
+
function $7215afc6de606d6b$export$de79e2c695e052f3(element) {
|
|
40892
|
+
if ($7215afc6de606d6b$var$supportsPreventScroll()) element.focus({
|
|
40893
|
+
preventScroll: true
|
|
40894
|
+
});
|
|
40895
|
+
else {
|
|
40896
|
+
let scrollableElements = $7215afc6de606d6b$var$getScrollableElements(element);
|
|
40897
|
+
element.focus();
|
|
40898
|
+
$7215afc6de606d6b$var$restoreScrollPosition(scrollableElements);
|
|
40899
|
+
}
|
|
40900
|
+
}
|
|
40901
|
+
let $7215afc6de606d6b$var$supportsPreventScrollCached = null;
|
|
40902
|
+
function $7215afc6de606d6b$var$supportsPreventScroll() {
|
|
40903
|
+
if ($7215afc6de606d6b$var$supportsPreventScrollCached == null) {
|
|
40904
|
+
$7215afc6de606d6b$var$supportsPreventScrollCached = false;
|
|
40905
|
+
try {
|
|
40906
|
+
var focusElem = document.createElement('div');
|
|
40907
|
+
focusElem.focus({
|
|
40908
|
+
get preventScroll () {
|
|
40909
|
+
$7215afc6de606d6b$var$supportsPreventScrollCached = true;
|
|
40910
|
+
return true;
|
|
40911
|
+
}
|
|
40912
|
+
});
|
|
40913
|
+
} catch (e) {
|
|
40914
|
+
// Ignore
|
|
40915
|
+
}
|
|
40916
|
+
}
|
|
40917
|
+
return $7215afc6de606d6b$var$supportsPreventScrollCached;
|
|
40918
|
+
}
|
|
40919
|
+
function $7215afc6de606d6b$var$getScrollableElements(element) {
|
|
40920
|
+
var parent = element.parentNode;
|
|
40921
|
+
var scrollableElements = [];
|
|
40922
|
+
var rootScrollingElement = document.scrollingElement || document.documentElement;
|
|
40923
|
+
while(parent instanceof HTMLElement && parent !== rootScrollingElement){
|
|
40924
|
+
if (parent.offsetHeight < parent.scrollHeight || parent.offsetWidth < parent.scrollWidth) scrollableElements.push({
|
|
40925
|
+
element: parent,
|
|
40926
|
+
scrollTop: parent.scrollTop,
|
|
40927
|
+
scrollLeft: parent.scrollLeft
|
|
40928
|
+
});
|
|
40929
|
+
parent = parent.parentNode;
|
|
40930
|
+
}
|
|
40931
|
+
if (rootScrollingElement instanceof HTMLElement) scrollableElements.push({
|
|
40932
|
+
element: rootScrollingElement,
|
|
40933
|
+
scrollTop: rootScrollingElement.scrollTop,
|
|
40934
|
+
scrollLeft: rootScrollingElement.scrollLeft
|
|
40935
|
+
});
|
|
40936
|
+
return scrollableElements;
|
|
40937
|
+
}
|
|
40938
|
+
function $7215afc6de606d6b$var$restoreScrollPosition(scrollableElements) {
|
|
40939
|
+
for (let { element: element , scrollTop: scrollTop , scrollLeft: scrollLeft } of scrollableElements){
|
|
40940
|
+
element.scrollTop = scrollTop;
|
|
40941
|
+
element.scrollLeft = scrollLeft;
|
|
40942
|
+
}
|
|
40943
|
+
}
|
|
40944
|
+
|
|
40945
|
+
|
|
40946
|
+
/*
|
|
40947
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
40948
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
40949
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
40950
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
40951
|
+
*
|
|
40952
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
40953
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
40954
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
40955
|
+
* governing permissions and limitations under the License.
|
|
40956
|
+
*/ // We store a global list of elements that are currently transitioning,
|
|
40957
|
+
// mapped to a set of CSS properties that are transitioning for that element.
|
|
40958
|
+
// This is necessary rather than a simple count of transitions because of browser
|
|
40959
|
+
// bugs, e.g. Chrome sometimes fires both transitionend and transitioncancel rather
|
|
40960
|
+
// than one or the other. So we need to track what's actually transitioning so that
|
|
40961
|
+
// we can ignore these duplicate events.
|
|
40962
|
+
let $bbed8b41f857bcc0$var$transitionsByElement = new Map();
|
|
40963
|
+
// A list of callbacks to call once there are no transitioning elements.
|
|
40964
|
+
let $bbed8b41f857bcc0$var$transitionCallbacks = new Set();
|
|
40965
|
+
function $bbed8b41f857bcc0$var$setupGlobalEvents() {
|
|
40966
|
+
if (typeof window === 'undefined') return;
|
|
40967
|
+
let onTransitionStart = (e)=>{
|
|
40968
|
+
// Add the transitioning property to the list for this element.
|
|
40969
|
+
let transitions = $bbed8b41f857bcc0$var$transitionsByElement.get(e.target);
|
|
40970
|
+
if (!transitions) {
|
|
40971
|
+
transitions = new Set();
|
|
40972
|
+
$bbed8b41f857bcc0$var$transitionsByElement.set(e.target, transitions);
|
|
40973
|
+
// The transitioncancel event must be registered on the element itself, rather than as a global
|
|
40974
|
+
// event. This enables us to handle when the node is deleted from the document while it is transitioning.
|
|
40975
|
+
// In that case, the cancel event would have nowhere to bubble to so we need to handle it directly.
|
|
40976
|
+
e.target.addEventListener('transitioncancel', onTransitionEnd);
|
|
40977
|
+
}
|
|
40978
|
+
transitions.add(e.propertyName);
|
|
40979
|
+
};
|
|
40980
|
+
let onTransitionEnd = (e)=>{
|
|
40981
|
+
// Remove property from list of transitioning properties.
|
|
40982
|
+
let properties = $bbed8b41f857bcc0$var$transitionsByElement.get(e.target);
|
|
40983
|
+
if (!properties) return;
|
|
40984
|
+
properties.delete(e.propertyName);
|
|
40985
|
+
// If empty, remove transitioncancel event, and remove the element from the list of transitioning elements.
|
|
40986
|
+
if (properties.size === 0) {
|
|
40987
|
+
e.target.removeEventListener('transitioncancel', onTransitionEnd);
|
|
40988
|
+
$bbed8b41f857bcc0$var$transitionsByElement.delete(e.target);
|
|
40989
|
+
}
|
|
40990
|
+
// If no transitioning elements, call all of the queued callbacks.
|
|
40991
|
+
if ($bbed8b41f857bcc0$var$transitionsByElement.size === 0) {
|
|
40992
|
+
for (let cb of $bbed8b41f857bcc0$var$transitionCallbacks)cb();
|
|
40993
|
+
$bbed8b41f857bcc0$var$transitionCallbacks.clear();
|
|
40994
|
+
}
|
|
40995
|
+
};
|
|
40996
|
+
document.body.addEventListener('transitionrun', onTransitionStart);
|
|
40997
|
+
document.body.addEventListener('transitionend', onTransitionEnd);
|
|
40998
|
+
}
|
|
40999
|
+
if (typeof document !== 'undefined') {
|
|
41000
|
+
if (document.readyState !== 'loading') $bbed8b41f857bcc0$var$setupGlobalEvents();
|
|
41001
|
+
else document.addEventListener('DOMContentLoaded', $bbed8b41f857bcc0$var$setupGlobalEvents);
|
|
41002
|
+
}
|
|
41003
|
+
function $bbed8b41f857bcc0$export$24490316f764c430(fn) {
|
|
41004
|
+
// Wait one frame to see if an animation starts, e.g. a transition on mount.
|
|
41005
|
+
requestAnimationFrame(()=>{
|
|
41006
|
+
// If no transitions are running, call the function immediately.
|
|
41007
|
+
// Otherwise, add it to a list of callbacks to run at the end of the animation.
|
|
41008
|
+
if ($bbed8b41f857bcc0$var$transitionsByElement.size === 0) fn();
|
|
41009
|
+
else $bbed8b41f857bcc0$var$transitionCallbacks.add(fn);
|
|
41010
|
+
});
|
|
41011
|
+
}
|
|
41012
|
+
|
|
41013
|
+
|
|
41014
|
+
|
|
41015
|
+
function $03deb23ff14920c4$export$4eaf04e54aa8eed6() {
|
|
41016
|
+
let globalListeners = React.useRef(new Map());
|
|
41017
|
+
let addGlobalListener = React.useCallback((eventTarget, type, listener, options)=>{
|
|
41018
|
+
// Make sure we remove the listener after it is called with the `once` option.
|
|
41019
|
+
let fn = (options === null || options === void 0 ? void 0 : options.once) ? (...args)=>{
|
|
41020
|
+
globalListeners.current.delete(listener);
|
|
41021
|
+
listener(...args);
|
|
41022
|
+
} : listener;
|
|
41023
|
+
globalListeners.current.set(listener, {
|
|
41024
|
+
type: type,
|
|
41025
|
+
eventTarget: eventTarget,
|
|
41026
|
+
fn: fn,
|
|
41027
|
+
options: options
|
|
41028
|
+
});
|
|
41029
|
+
eventTarget.addEventListener(type, listener, options);
|
|
41030
|
+
}, []);
|
|
41031
|
+
let removeGlobalListener = React.useCallback((eventTarget, type, listener, options)=>{
|
|
41032
|
+
var ref;
|
|
41033
|
+
let fn = ((ref = globalListeners.current.get(listener)) === null || ref === void 0 ? void 0 : ref.fn) || listener;
|
|
41034
|
+
eventTarget.removeEventListener(type, fn, options);
|
|
41035
|
+
globalListeners.current.delete(listener);
|
|
41036
|
+
}, []);
|
|
41037
|
+
let removeAllGlobalListeners = React.useCallback(()=>{
|
|
41038
|
+
globalListeners.current.forEach((value, key)=>{
|
|
41039
|
+
removeGlobalListener(value.eventTarget, value.type, key, value.options);
|
|
41040
|
+
});
|
|
41041
|
+
}, [
|
|
41042
|
+
removeGlobalListener
|
|
41043
|
+
]);
|
|
41044
|
+
// eslint-disable-next-line arrow-body-style
|
|
41045
|
+
React.useEffect(()=>{
|
|
41046
|
+
return removeAllGlobalListeners;
|
|
41047
|
+
}, [
|
|
41048
|
+
removeAllGlobalListeners
|
|
41049
|
+
]);
|
|
41050
|
+
return {
|
|
41051
|
+
addGlobalListener: addGlobalListener,
|
|
41052
|
+
removeGlobalListener: removeGlobalListener,
|
|
41053
|
+
removeAllGlobalListeners: removeAllGlobalListeners
|
|
41054
|
+
};
|
|
41055
|
+
}
|
|
41056
|
+
|
|
41057
|
+
|
|
41058
|
+
|
|
41059
|
+
function $313b98861ee5dd6c$export$d6875122194c7b44(props, defaultLabel) {
|
|
41060
|
+
let { id: id , 'aria-label': label , 'aria-labelledby': labelledBy } = props;
|
|
41061
|
+
// If there is both an aria-label and aria-labelledby,
|
|
41062
|
+
// combine them by pointing to the element itself.
|
|
41063
|
+
id = $bdb11010cef70236$export$f680877a34711e37(id);
|
|
41064
|
+
if (labelledBy && label) {
|
|
41065
|
+
let ids = new Set([
|
|
41066
|
+
...labelledBy.trim().split(/\s+/),
|
|
41067
|
+
id
|
|
41068
|
+
]);
|
|
41069
|
+
labelledBy = [
|
|
41070
|
+
...ids
|
|
41071
|
+
].join(' ');
|
|
41072
|
+
} else if (labelledBy) labelledBy = labelledBy.trim().split(/\s+/).join(' ');
|
|
41073
|
+
// If no labels are provided, use the default
|
|
41074
|
+
if (!label && !labelledBy && defaultLabel) label = defaultLabel;
|
|
41075
|
+
return {
|
|
41076
|
+
id: id,
|
|
41077
|
+
'aria-label': label,
|
|
41078
|
+
'aria-labelledby': labelledBy
|
|
41079
|
+
};
|
|
41080
|
+
}
|
|
41081
|
+
|
|
41082
|
+
|
|
41083
|
+
|
|
41084
|
+
function $e7801be82b4b2a53$export$4debdb1a3f0fa79e(context, ref) {
|
|
41085
|
+
$f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(()=>{
|
|
41086
|
+
if (context && context.ref && ref) {
|
|
41087
|
+
context.ref.current = ref.current;
|
|
41088
|
+
return ()=>{
|
|
41089
|
+
context.ref.current = null;
|
|
41090
|
+
};
|
|
41091
|
+
}
|
|
41092
|
+
}, [
|
|
41093
|
+
context,
|
|
41094
|
+
ref
|
|
41095
|
+
]);
|
|
41096
|
+
}
|
|
41097
|
+
|
|
41098
|
+
|
|
41099
|
+
|
|
41100
|
+
|
|
41101
|
+
let $ef06256079686ba0$var$descriptionId = 0;
|
|
41102
|
+
const $ef06256079686ba0$var$descriptionNodes = new Map();
|
|
41103
|
+
function $ef06256079686ba0$export$f8aeda7b10753fa1(description) {
|
|
41104
|
+
let [id1, setId] = React.useState(null);
|
|
41105
|
+
$f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(()=>{
|
|
41106
|
+
if (!description) return;
|
|
41107
|
+
let desc = $ef06256079686ba0$var$descriptionNodes.get(description);
|
|
41108
|
+
if (!desc) {
|
|
41109
|
+
let id = `react-aria-description-${$ef06256079686ba0$var$descriptionId++}`;
|
|
41110
|
+
setId(id);
|
|
41111
|
+
let node = document.createElement('div');
|
|
41112
|
+
node.id = id;
|
|
41113
|
+
node.style.display = 'none';
|
|
41114
|
+
node.textContent = description;
|
|
41115
|
+
document.body.appendChild(node);
|
|
41116
|
+
desc = {
|
|
41117
|
+
refCount: 0,
|
|
41118
|
+
element: node
|
|
41119
|
+
};
|
|
41120
|
+
$ef06256079686ba0$var$descriptionNodes.set(description, desc);
|
|
41121
|
+
} else setId(desc.element.id);
|
|
41122
|
+
desc.refCount++;
|
|
41123
|
+
return ()=>{
|
|
41124
|
+
if (--desc.refCount === 0) {
|
|
41125
|
+
desc.element.remove();
|
|
41126
|
+
$ef06256079686ba0$var$descriptionNodes.delete(description);
|
|
41127
|
+
}
|
|
41128
|
+
};
|
|
41129
|
+
}, [
|
|
41130
|
+
description
|
|
41131
|
+
]);
|
|
41132
|
+
return {
|
|
41133
|
+
'aria-describedby': description ? id1 : undefined
|
|
41134
|
+
};
|
|
41135
|
+
}
|
|
41136
|
+
|
|
41137
|
+
|
|
41138
|
+
/*
|
|
41139
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
41140
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
41141
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
41142
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
41143
|
+
*
|
|
41144
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
41145
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
41146
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
41147
|
+
* governing permissions and limitations under the License.
|
|
41148
|
+
*/ function $c87311424ea30a05$var$testUserAgent(re) {
|
|
41149
|
+
var ref;
|
|
41150
|
+
if (typeof window === 'undefined' || window.navigator == null) return false;
|
|
41151
|
+
return ((ref = window.navigator['userAgentData']) === null || ref === void 0 ? void 0 : ref.brands.some((brand)=>re.test(brand.brand)
|
|
41152
|
+
)) || re.test(window.navigator.userAgent);
|
|
41153
|
+
}
|
|
41154
|
+
function $c87311424ea30a05$var$testPlatform(re) {
|
|
41155
|
+
var ref;
|
|
41156
|
+
return typeof window !== 'undefined' && window.navigator != null ? re.test(((ref = window.navigator['userAgentData']) === null || ref === void 0 ? void 0 : ref.platform) || window.navigator.platform) : false;
|
|
41157
|
+
}
|
|
41158
|
+
function $c87311424ea30a05$export$9ac100e40613ea10() {
|
|
41159
|
+
return $c87311424ea30a05$var$testPlatform(/^Mac/i);
|
|
41160
|
+
}
|
|
41161
|
+
function $c87311424ea30a05$export$186c6964ca17d99() {
|
|
41162
|
+
return $c87311424ea30a05$var$testPlatform(/^iPhone/i);
|
|
41163
|
+
}
|
|
41164
|
+
function $c87311424ea30a05$export$7bef049ce92e4224() {
|
|
41165
|
+
return $c87311424ea30a05$var$testPlatform(/^iPad/i) || $c87311424ea30a05$export$9ac100e40613ea10() && navigator.maxTouchPoints > 1;
|
|
41166
|
+
}
|
|
41167
|
+
function $c87311424ea30a05$export$fedb369cb70207f1() {
|
|
41168
|
+
return $c87311424ea30a05$export$186c6964ca17d99() || $c87311424ea30a05$export$7bef049ce92e4224();
|
|
41169
|
+
}
|
|
41170
|
+
function $c87311424ea30a05$export$e1865c3bedcd822b() {
|
|
41171
|
+
return $c87311424ea30a05$export$9ac100e40613ea10() || $c87311424ea30a05$export$fedb369cb70207f1();
|
|
41172
|
+
}
|
|
41173
|
+
function $c87311424ea30a05$export$78551043582a6a98() {
|
|
41174
|
+
return $c87311424ea30a05$var$testUserAgent(/AppleWebKit/i) && !$c87311424ea30a05$export$6446a186d09e379e();
|
|
41175
|
+
}
|
|
41176
|
+
function $c87311424ea30a05$export$6446a186d09e379e() {
|
|
41177
|
+
return $c87311424ea30a05$var$testUserAgent(/Chrome/i);
|
|
41178
|
+
}
|
|
41179
|
+
|
|
41180
|
+
|
|
41181
|
+
|
|
41182
|
+
function $e9faafb641e167db$export$90fc3a17d93f704c(ref, event, handler1, options) {
|
|
41183
|
+
let handlerRef = React.useRef(handler1);
|
|
41184
|
+
handlerRef.current = handler1;
|
|
41185
|
+
let isDisabled = handler1 == null;
|
|
41186
|
+
React.useEffect(()=>{
|
|
41187
|
+
if (isDisabled) return;
|
|
41188
|
+
let element = ref.current;
|
|
41189
|
+
let handler = (e)=>handlerRef.current.call(this, e)
|
|
41190
|
+
;
|
|
41191
|
+
element.addEventListener(event, handler, options);
|
|
41192
|
+
return ()=>{
|
|
41193
|
+
element.removeEventListener(event, handler, options);
|
|
41194
|
+
};
|
|
41195
|
+
}, [
|
|
41196
|
+
ref,
|
|
41197
|
+
event,
|
|
41198
|
+
options,
|
|
41199
|
+
isDisabled
|
|
41200
|
+
]);
|
|
41201
|
+
}
|
|
41202
|
+
|
|
41203
|
+
|
|
41204
|
+
|
|
41205
|
+
|
|
41206
|
+
function $1dbecbe27a04f9af$export$14d238f342723f25(defaultValue) {
|
|
41207
|
+
let [value, setValue] = React.useState(defaultValue);
|
|
41208
|
+
let valueRef = React.useRef(value);
|
|
41209
|
+
let effect = React.useRef(null);
|
|
41210
|
+
valueRef.current = value;
|
|
41211
|
+
// Store the function in a ref so we can always access the current version
|
|
41212
|
+
// which has the proper `value` in scope.
|
|
41213
|
+
let nextRef = React.useRef(null);
|
|
41214
|
+
nextRef.current = ()=>{
|
|
41215
|
+
// Run the generator to the next yield.
|
|
41216
|
+
let newValue = effect.current.next();
|
|
41217
|
+
// If the generator is done, reset the effect.
|
|
41218
|
+
if (newValue.done) {
|
|
41219
|
+
effect.current = null;
|
|
41220
|
+
return;
|
|
41221
|
+
}
|
|
41222
|
+
// If the value is the same as the current value,
|
|
41223
|
+
// then continue to the next yield. Otherwise,
|
|
41224
|
+
// set the value in state and wait for the next layout effect.
|
|
41225
|
+
if (value === newValue.value) nextRef.current();
|
|
41226
|
+
else setValue(newValue.value);
|
|
41227
|
+
};
|
|
41228
|
+
$f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(()=>{
|
|
41229
|
+
// If there is an effect currently running, continue to the next yield.
|
|
41230
|
+
if (effect.current) nextRef.current();
|
|
41231
|
+
});
|
|
41232
|
+
let queue = React.useCallback((fn)=>{
|
|
41233
|
+
effect.current = fn(valueRef.current);
|
|
41234
|
+
nextRef.current();
|
|
41235
|
+
}, [
|
|
41236
|
+
effect,
|
|
41237
|
+
nextRef
|
|
41238
|
+
]);
|
|
41239
|
+
return [
|
|
41240
|
+
value,
|
|
41241
|
+
queue
|
|
41242
|
+
];
|
|
41243
|
+
}
|
|
41244
|
+
|
|
41245
|
+
|
|
41246
|
+
function $2f04cbc44ee30ce0$export$53a0910f038337bd(scrollView, element) {
|
|
41247
|
+
let offsetX = $2f04cbc44ee30ce0$var$relativeOffset(scrollView, element, 'left');
|
|
41248
|
+
let offsetY = $2f04cbc44ee30ce0$var$relativeOffset(scrollView, element, 'top');
|
|
41249
|
+
let width = element.offsetWidth;
|
|
41250
|
+
let height = element.offsetHeight;
|
|
41251
|
+
let x = scrollView.scrollLeft;
|
|
41252
|
+
let y = scrollView.scrollTop;
|
|
41253
|
+
let maxX = x + scrollView.offsetWidth;
|
|
41254
|
+
let maxY = y + scrollView.offsetHeight;
|
|
41255
|
+
if (offsetX <= x) x = offsetX;
|
|
41256
|
+
else if (offsetX + width > maxX) x += offsetX + width - maxX;
|
|
41257
|
+
if (offsetY <= y) y = offsetY;
|
|
41258
|
+
else if (offsetY + height > maxY) y += offsetY + height - maxY;
|
|
41259
|
+
scrollView.scrollLeft = x;
|
|
41260
|
+
scrollView.scrollTop = y;
|
|
41261
|
+
}
|
|
41262
|
+
/**
|
|
41263
|
+
* Computes the offset left or top from child to ancestor by accumulating
|
|
41264
|
+
* offsetLeft or offsetTop through intervening offsetParents.
|
|
41265
|
+
*/ function $2f04cbc44ee30ce0$var$relativeOffset(ancestor, child, axis) {
|
|
41266
|
+
const prop = axis === 'left' ? 'offsetLeft' : 'offsetTop';
|
|
41267
|
+
let sum = 0;
|
|
41268
|
+
while(child.offsetParent){
|
|
41269
|
+
sum += child[prop];
|
|
41270
|
+
if (child.offsetParent === ancestor) break;
|
|
41271
|
+
else if (child.offsetParent.contains(ancestor)) {
|
|
41272
|
+
// If the ancestor is not `position:relative`, then we stop at
|
|
41273
|
+
// _its_ offset parent, and we subtract off _its_ offset, so that
|
|
41274
|
+
// we end up with the proper offset from child to ancestor.
|
|
41275
|
+
sum -= ancestor[prop];
|
|
41276
|
+
break;
|
|
41277
|
+
}
|
|
41278
|
+
child = child.offsetParent;
|
|
41279
|
+
}
|
|
41280
|
+
return sum;
|
|
41281
|
+
}
|
|
41282
|
+
|
|
41283
|
+
// Note that state only matters here for iOS. Non-iOS gets user-select: none applied to the target element
|
|
41284
|
+
// rather than at the document level so we just need to apply/remove user-select: none for each pressed element individually
|
|
41285
|
+
let $14c0b72509d70225$var$state = 'default';
|
|
41286
|
+
let $14c0b72509d70225$var$savedUserSelect = '';
|
|
41287
|
+
let $14c0b72509d70225$var$modifiedElementMap = new WeakMap();
|
|
41288
|
+
function $14c0b72509d70225$export$16a4697467175487(target) {
|
|
41289
|
+
if ($c87311424ea30a05$export$fedb369cb70207f1()) {
|
|
41290
|
+
if ($14c0b72509d70225$var$state === 'default') {
|
|
41291
|
+
$14c0b72509d70225$var$savedUserSelect = document.documentElement.style.webkitUserSelect;
|
|
41292
|
+
document.documentElement.style.webkitUserSelect = 'none';
|
|
41293
|
+
}
|
|
41294
|
+
$14c0b72509d70225$var$state = 'disabled';
|
|
41295
|
+
} else if (target instanceof HTMLElement || target instanceof SVGElement) {
|
|
41296
|
+
// If not iOS, store the target's original user-select and change to user-select: none
|
|
41297
|
+
// Ignore state since it doesn't apply for non iOS
|
|
41298
|
+
$14c0b72509d70225$var$modifiedElementMap.set(target, target.style.userSelect);
|
|
41299
|
+
target.style.userSelect = 'none';
|
|
41300
|
+
}
|
|
41301
|
+
}
|
|
41302
|
+
function $14c0b72509d70225$export$b0d6fa1ab32e3295(target) {
|
|
41303
|
+
if ($c87311424ea30a05$export$fedb369cb70207f1()) {
|
|
41304
|
+
// If the state is already default, there's nothing to do.
|
|
41305
|
+
// If it is restoring, then there's no need to queue a second restore.
|
|
41306
|
+
if ($14c0b72509d70225$var$state !== 'disabled') return;
|
|
41307
|
+
$14c0b72509d70225$var$state = 'restoring';
|
|
41308
|
+
// There appears to be a delay on iOS where selection still might occur
|
|
41309
|
+
// after pointer up, so wait a bit before removing user-select.
|
|
41310
|
+
setTimeout(()=>{
|
|
41311
|
+
// Wait for any CSS transitions to complete so we don't recompute style
|
|
41312
|
+
// for the whole page in the middle of the animation and cause jank.
|
|
41313
|
+
$bbed8b41f857bcc0$export$24490316f764c430(()=>{
|
|
41314
|
+
// Avoid race conditions
|
|
41315
|
+
if ($14c0b72509d70225$var$state === 'restoring') {
|
|
41316
|
+
if (document.documentElement.style.webkitUserSelect === 'none') document.documentElement.style.webkitUserSelect = $14c0b72509d70225$var$savedUserSelect || '';
|
|
41317
|
+
$14c0b72509d70225$var$savedUserSelect = '';
|
|
41318
|
+
$14c0b72509d70225$var$state = 'default';
|
|
41319
|
+
}
|
|
41320
|
+
});
|
|
41321
|
+
}, 300);
|
|
41322
|
+
} else if (target instanceof HTMLElement || target instanceof SVGElement) // If not iOS, restore the target's original user-select if any
|
|
41323
|
+
// Ignore state since it doesn't apply for non iOS
|
|
41324
|
+
{
|
|
41325
|
+
if (target && $14c0b72509d70225$var$modifiedElementMap.has(target)) {
|
|
41326
|
+
let targetOldUserSelect = $14c0b72509d70225$var$modifiedElementMap.get(target);
|
|
41327
|
+
if (target.style.userSelect === 'none') target.style.userSelect = targetOldUserSelect;
|
|
41328
|
+
if (target.getAttribute('style') === '') target.removeAttribute('style');
|
|
41329
|
+
$14c0b72509d70225$var$modifiedElementMap.delete(target);
|
|
41330
|
+
}
|
|
41331
|
+
}
|
|
41332
|
+
}
|
|
41333
|
+
|
|
41334
|
+
|
|
41335
|
+
|
|
41336
|
+
|
|
41337
|
+
|
|
41338
|
+
function $8a9cb279dc87e130$export$60278871457622de(event) {
|
|
41339
|
+
// JAWS/NVDA with Firefox.
|
|
41340
|
+
if (event.mozInputSource === 0 && event.isTrusted) return true;
|
|
41341
|
+
return event.detail === 0 && !event.pointerType;
|
|
41342
|
+
}
|
|
41343
|
+
class $8a9cb279dc87e130$export$905e7fc544a71f36 {
|
|
41344
|
+
isDefaultPrevented() {
|
|
41345
|
+
return this.nativeEvent.defaultPrevented;
|
|
41346
|
+
}
|
|
41347
|
+
preventDefault() {
|
|
41348
|
+
this.defaultPrevented = true;
|
|
41349
|
+
this.nativeEvent.preventDefault();
|
|
41350
|
+
}
|
|
41351
|
+
stopPropagation() {
|
|
41352
|
+
this.nativeEvent.stopPropagation();
|
|
41353
|
+
this.isPropagationStopped = ()=>true
|
|
41354
|
+
;
|
|
41355
|
+
}
|
|
41356
|
+
isPropagationStopped() {
|
|
41357
|
+
return false;
|
|
41358
|
+
}
|
|
41359
|
+
persist() {
|
|
41360
|
+
}
|
|
41361
|
+
constructor(type, nativeEvent){
|
|
41362
|
+
this.nativeEvent = nativeEvent;
|
|
41363
|
+
this.target = nativeEvent.target;
|
|
41364
|
+
this.currentTarget = nativeEvent.currentTarget;
|
|
41365
|
+
this.relatedTarget = nativeEvent.relatedTarget;
|
|
41366
|
+
this.bubbles = nativeEvent.bubbles;
|
|
41367
|
+
this.cancelable = nativeEvent.cancelable;
|
|
41368
|
+
this.defaultPrevented = nativeEvent.defaultPrevented;
|
|
41369
|
+
this.eventPhase = nativeEvent.eventPhase;
|
|
41370
|
+
this.isTrusted = nativeEvent.isTrusted;
|
|
41371
|
+
this.timeStamp = nativeEvent.timeStamp;
|
|
41372
|
+
this.type = type;
|
|
41373
|
+
}
|
|
41374
|
+
}
|
|
41375
|
+
function $8a9cb279dc87e130$export$715c682d09d639cc(onBlur) {
|
|
41376
|
+
let stateRef = React.useRef({
|
|
41377
|
+
isFocused: false,
|
|
41378
|
+
onBlur: onBlur,
|
|
41379
|
+
observer: null
|
|
41380
|
+
});
|
|
41381
|
+
stateRef.current.onBlur = onBlur;
|
|
41382
|
+
// Clean up MutationObserver on unmount. See below.
|
|
41383
|
+
// eslint-disable-next-line arrow-body-style
|
|
41384
|
+
$f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(()=>{
|
|
41385
|
+
const state = stateRef.current;
|
|
41386
|
+
return ()=>{
|
|
41387
|
+
if (state.observer) {
|
|
41388
|
+
state.observer.disconnect();
|
|
41389
|
+
state.observer = null;
|
|
41390
|
+
}
|
|
41391
|
+
};
|
|
41392
|
+
}, []);
|
|
41393
|
+
// This function is called during a React onFocus event.
|
|
41394
|
+
return React.useCallback((e1)=>{
|
|
41395
|
+
// React does not fire onBlur when an element is disabled. https://github.com/facebook/react/issues/9142
|
|
41396
|
+
// Most browsers fire a native focusout event in this case, except for Firefox. In that case, we use a
|
|
41397
|
+
// MutationObserver to watch for the disabled attribute, and dispatch these events ourselves.
|
|
41398
|
+
// For browsers that do, focusout fires before the MutationObserver, so onBlur should not fire twice.
|
|
41399
|
+
if (e1.target instanceof HTMLButtonElement || e1.target instanceof HTMLInputElement || e1.target instanceof HTMLTextAreaElement || e1.target instanceof HTMLSelectElement) {
|
|
41400
|
+
stateRef.current.isFocused = true;
|
|
41401
|
+
let target = e1.target;
|
|
41402
|
+
let onBlurHandler = (e)=>{
|
|
41403
|
+
var // For backward compatibility, dispatch a (fake) React synthetic event.
|
|
41404
|
+
_current, ref;
|
|
41405
|
+
stateRef.current.isFocused = false;
|
|
41406
|
+
if (target.disabled) (ref = (_current = stateRef.current).onBlur) === null || ref === void 0 ? void 0 : ref.call(_current, new $8a9cb279dc87e130$export$905e7fc544a71f36('blur', e));
|
|
41407
|
+
// We no longer need the MutationObserver once the target is blurred.
|
|
41408
|
+
if (stateRef.current.observer) {
|
|
41409
|
+
stateRef.current.observer.disconnect();
|
|
41410
|
+
stateRef.current.observer = null;
|
|
41411
|
+
}
|
|
41412
|
+
};
|
|
41413
|
+
target.addEventListener('focusout', onBlurHandler, {
|
|
41414
|
+
once: true
|
|
41415
|
+
});
|
|
41416
|
+
stateRef.current.observer = new MutationObserver(()=>{
|
|
41417
|
+
if (stateRef.current.isFocused && target.disabled) {
|
|
41418
|
+
stateRef.current.observer.disconnect();
|
|
41419
|
+
target.dispatchEvent(new FocusEvent('blur'));
|
|
41420
|
+
target.dispatchEvent(new FocusEvent('focusout', {
|
|
41421
|
+
bubbles: true
|
|
41422
|
+
}));
|
|
41423
|
+
}
|
|
41424
|
+
});
|
|
41425
|
+
stateRef.current.observer.observe(target, {
|
|
41426
|
+
attributes: true,
|
|
41427
|
+
attributeFilter: [
|
|
41428
|
+
'disabled'
|
|
41429
|
+
]
|
|
41430
|
+
});
|
|
41431
|
+
}
|
|
41432
|
+
}, []);
|
|
41433
|
+
}
|
|
41434
|
+
|
|
41435
|
+
|
|
41436
|
+
|
|
41437
|
+
const $ae1eeba8b9eafd08$export$5165eccb35aaadb5 = React__default["default"].createContext(null);
|
|
41438
|
+
$ae1eeba8b9eafd08$export$5165eccb35aaadb5.displayName = 'PressResponderContext';
|
|
41439
|
+
|
|
41440
|
+
|
|
41441
|
+
|
|
41442
|
+
function $f6c31cce2adf654f$var$usePressResponderContext(props) {
|
|
41443
|
+
// Consume context from <PressResponder> and merge with props.
|
|
41444
|
+
let context = React.useContext($ae1eeba8b9eafd08$export$5165eccb35aaadb5);
|
|
41445
|
+
if (context) {
|
|
41446
|
+
let { register: register , ...contextProps } = context;
|
|
41447
|
+
props = $3ef42575df84b30b$export$9d1611c77c2fe928(contextProps, props);
|
|
41448
|
+
register();
|
|
41449
|
+
}
|
|
41450
|
+
$e7801be82b4b2a53$export$4debdb1a3f0fa79e(context, props.ref);
|
|
41451
|
+
return props;
|
|
41452
|
+
}
|
|
41453
|
+
function $f6c31cce2adf654f$export$45712eceda6fad21(props) {
|
|
41454
|
+
let { onPress: onPress1 , onPressChange: onPressChange1 , onPressStart: onPressStart1 , onPressEnd: onPressEnd1 , onPressUp: onPressUp1 , isDisabled: isDisabled1 , isPressed: isPressedProp , preventFocusOnPress: preventFocusOnPress , shouldCancelOnPointerExit: shouldCancelOnPointerExit , allowTextSelectionOnPress: allowTextSelectionOnPress , // eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
41455
|
+
ref: _ , ...domProps } = $f6c31cce2adf654f$var$usePressResponderContext(props);
|
|
41456
|
+
let propsRef = React.useRef(null);
|
|
41457
|
+
propsRef.current = {
|
|
41458
|
+
onPress: onPress1,
|
|
41459
|
+
onPressChange: onPressChange1,
|
|
41460
|
+
onPressStart: onPressStart1,
|
|
41461
|
+
onPressEnd: onPressEnd1,
|
|
41462
|
+
onPressUp: onPressUp1,
|
|
41463
|
+
isDisabled: isDisabled1,
|
|
41464
|
+
shouldCancelOnPointerExit: shouldCancelOnPointerExit
|
|
41465
|
+
};
|
|
41466
|
+
let [isPressed, setPressed] = React.useState(false);
|
|
41467
|
+
let ref = React.useRef({
|
|
41468
|
+
isPressed: false,
|
|
41469
|
+
ignoreEmulatedMouseEvents: false,
|
|
41470
|
+
ignoreClickAfterPress: false,
|
|
41471
|
+
didFirePressStart: false,
|
|
41472
|
+
activePointerId: null,
|
|
41473
|
+
target: null,
|
|
41474
|
+
isOverTarget: false,
|
|
41475
|
+
pointerType: null
|
|
41476
|
+
});
|
|
41477
|
+
let { addGlobalListener: addGlobalListener , removeAllGlobalListeners: removeAllGlobalListeners } = $03deb23ff14920c4$export$4eaf04e54aa8eed6();
|
|
41478
|
+
let pressProps1 = React.useMemo(()=>{
|
|
41479
|
+
let state = ref.current;
|
|
41480
|
+
let triggerPressStart = (originalEvent, pointerType)=>{
|
|
41481
|
+
let { onPressStart: onPressStart , onPressChange: onPressChange , isDisabled: isDisabled } = propsRef.current;
|
|
41482
|
+
if (isDisabled || state.didFirePressStart) return;
|
|
41483
|
+
if (onPressStart) onPressStart({
|
|
41484
|
+
type: 'pressstart',
|
|
41485
|
+
pointerType: pointerType,
|
|
41486
|
+
target: originalEvent.currentTarget,
|
|
41487
|
+
shiftKey: originalEvent.shiftKey,
|
|
41488
|
+
metaKey: originalEvent.metaKey,
|
|
41489
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
41490
|
+
altKey: originalEvent.altKey
|
|
41491
|
+
});
|
|
41492
|
+
if (onPressChange) onPressChange(true);
|
|
41493
|
+
state.didFirePressStart = true;
|
|
41494
|
+
setPressed(true);
|
|
41495
|
+
};
|
|
41496
|
+
let triggerPressEnd = (originalEvent, pointerType, wasPressed = true)=>{
|
|
41497
|
+
let { onPressEnd: onPressEnd , onPressChange: onPressChange , onPress: onPress , isDisabled: isDisabled } = propsRef.current;
|
|
41498
|
+
if (!state.didFirePressStart) return;
|
|
41499
|
+
state.ignoreClickAfterPress = true;
|
|
41500
|
+
state.didFirePressStart = false;
|
|
41501
|
+
if (onPressEnd) onPressEnd({
|
|
41502
|
+
type: 'pressend',
|
|
41503
|
+
pointerType: pointerType,
|
|
41504
|
+
target: originalEvent.currentTarget,
|
|
41505
|
+
shiftKey: originalEvent.shiftKey,
|
|
41506
|
+
metaKey: originalEvent.metaKey,
|
|
41507
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
41508
|
+
altKey: originalEvent.altKey
|
|
41509
|
+
});
|
|
41510
|
+
if (onPressChange) onPressChange(false);
|
|
41511
|
+
setPressed(false);
|
|
41512
|
+
if (onPress && wasPressed && !isDisabled) onPress({
|
|
41513
|
+
type: 'press',
|
|
41514
|
+
pointerType: pointerType,
|
|
41515
|
+
target: originalEvent.currentTarget,
|
|
41516
|
+
shiftKey: originalEvent.shiftKey,
|
|
41517
|
+
metaKey: originalEvent.metaKey,
|
|
41518
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
41519
|
+
altKey: originalEvent.altKey
|
|
41520
|
+
});
|
|
41521
|
+
};
|
|
41522
|
+
let triggerPressUp = (originalEvent, pointerType)=>{
|
|
41523
|
+
let { onPressUp: onPressUp , isDisabled: isDisabled } = propsRef.current;
|
|
41524
|
+
if (isDisabled) return;
|
|
41525
|
+
if (onPressUp) onPressUp({
|
|
41526
|
+
type: 'pressup',
|
|
41527
|
+
pointerType: pointerType,
|
|
41528
|
+
target: originalEvent.currentTarget,
|
|
41529
|
+
shiftKey: originalEvent.shiftKey,
|
|
41530
|
+
metaKey: originalEvent.metaKey,
|
|
41531
|
+
ctrlKey: originalEvent.ctrlKey,
|
|
41532
|
+
altKey: originalEvent.altKey
|
|
41533
|
+
});
|
|
41534
|
+
};
|
|
41535
|
+
let cancel = (e)=>{
|
|
41536
|
+
if (state.isPressed) {
|
|
41537
|
+
if (state.isOverTarget) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType, false);
|
|
41538
|
+
state.isPressed = false;
|
|
41539
|
+
state.isOverTarget = false;
|
|
41540
|
+
state.activePointerId = null;
|
|
41541
|
+
state.pointerType = null;
|
|
41542
|
+
removeAllGlobalListeners();
|
|
41543
|
+
if (!allowTextSelectionOnPress) $14c0b72509d70225$export$b0d6fa1ab32e3295(state.target);
|
|
41544
|
+
}
|
|
41545
|
+
};
|
|
41546
|
+
let pressProps = {
|
|
41547
|
+
onKeyDown (e) {
|
|
41548
|
+
if ($f6c31cce2adf654f$var$isValidKeyboardEvent(e.nativeEvent) && e.currentTarget.contains(e.target)) {
|
|
41549
|
+
if ($f6c31cce2adf654f$var$shouldPreventDefaultKeyboard(e.target)) e.preventDefault();
|
|
41550
|
+
e.stopPropagation();
|
|
41551
|
+
// If the event is repeating, it may have started on a different element
|
|
41552
|
+
// after which focus moved to the current element. Ignore these events and
|
|
41553
|
+
// only handle the first key down event.
|
|
41554
|
+
if (!state.isPressed && !e.repeat) {
|
|
41555
|
+
state.target = e.currentTarget;
|
|
41556
|
+
state.isPressed = true;
|
|
41557
|
+
triggerPressStart(e, 'keyboard');
|
|
41558
|
+
// Focus may move before the key up event, so register the event on the document
|
|
41559
|
+
// instead of the same element where the key down event occurred.
|
|
41560
|
+
addGlobalListener(document, 'keyup', onKeyUp, false);
|
|
41561
|
+
}
|
|
41562
|
+
}
|
|
41563
|
+
},
|
|
41564
|
+
onKeyUp (e) {
|
|
41565
|
+
if ($f6c31cce2adf654f$var$isValidKeyboardEvent(e.nativeEvent) && !e.repeat && e.currentTarget.contains(e.target)) triggerPressUp($f6c31cce2adf654f$var$createEvent(state.target, e), 'keyboard');
|
|
41566
|
+
},
|
|
41567
|
+
onClick (e) {
|
|
41568
|
+
if (e && !e.currentTarget.contains(e.target)) return;
|
|
41569
|
+
if (e && e.button === 0) {
|
|
41570
|
+
e.stopPropagation();
|
|
41571
|
+
if (isDisabled1) e.preventDefault();
|
|
41572
|
+
// If triggered from a screen reader or by using element.click(),
|
|
41573
|
+
// trigger as if it were a keyboard click.
|
|
41574
|
+
if (!state.ignoreClickAfterPress && !state.ignoreEmulatedMouseEvents && (state.pointerType === 'virtual' || $8a9cb279dc87e130$export$60278871457622de(e.nativeEvent))) {
|
|
41575
|
+
// Ensure the element receives focus (VoiceOver on iOS does not do this)
|
|
41576
|
+
if (!isDisabled1 && !preventFocusOnPress) $7215afc6de606d6b$export$de79e2c695e052f3(e.currentTarget);
|
|
41577
|
+
triggerPressStart(e, 'virtual');
|
|
41578
|
+
triggerPressUp(e, 'virtual');
|
|
41579
|
+
triggerPressEnd(e, 'virtual');
|
|
41580
|
+
}
|
|
41581
|
+
state.ignoreEmulatedMouseEvents = false;
|
|
41582
|
+
state.ignoreClickAfterPress = false;
|
|
41583
|
+
}
|
|
41584
|
+
}
|
|
41585
|
+
};
|
|
41586
|
+
let onKeyUp = (e)=>{
|
|
41587
|
+
if (state.isPressed && $f6c31cce2adf654f$var$isValidKeyboardEvent(e)) {
|
|
41588
|
+
if ($f6c31cce2adf654f$var$shouldPreventDefaultKeyboard(e.target)) e.preventDefault();
|
|
41589
|
+
e.stopPropagation();
|
|
41590
|
+
state.isPressed = false;
|
|
41591
|
+
let target = e.target;
|
|
41592
|
+
triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), 'keyboard', state.target.contains(target));
|
|
41593
|
+
removeAllGlobalListeners();
|
|
41594
|
+
// If the target is a link, trigger the click method to open the URL,
|
|
41595
|
+
// but defer triggering pressEnd until onClick event handler.
|
|
41596
|
+
if (state.target instanceof HTMLElement && (state.target.contains(target) && $f6c31cce2adf654f$var$isHTMLAnchorLink(state.target) || state.target.getAttribute('role') === 'link')) state.target.click();
|
|
41597
|
+
}
|
|
41598
|
+
};
|
|
41599
|
+
if (typeof PointerEvent !== 'undefined') {
|
|
41600
|
+
pressProps.onPointerDown = (e)=>{
|
|
41601
|
+
// Only handle left clicks, and ignore events that bubbled through portals.
|
|
41602
|
+
if (e.button !== 0 || !e.currentTarget.contains(e.target)) return;
|
|
41603
|
+
// iOS safari fires pointer events from VoiceOver with incorrect coordinates/target.
|
|
41604
|
+
// Ignore and let the onClick handler take care of it instead.
|
|
41605
|
+
// https://bugs.webkit.org/show_bug.cgi?id=222627
|
|
41606
|
+
// https://bugs.webkit.org/show_bug.cgi?id=223202
|
|
41607
|
+
if ($f6c31cce2adf654f$var$isVirtualPointerEvent(e.nativeEvent)) {
|
|
41608
|
+
state.pointerType = 'virtual';
|
|
41609
|
+
return;
|
|
41610
|
+
}
|
|
41611
|
+
// Due to browser inconsistencies, especially on mobile browsers, we prevent
|
|
41612
|
+
// default on pointer down and handle focusing the pressable element ourselves.
|
|
41613
|
+
if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
|
|
41614
|
+
state.pointerType = e.pointerType;
|
|
41615
|
+
e.stopPropagation();
|
|
41616
|
+
if (!state.isPressed) {
|
|
41617
|
+
state.isPressed = true;
|
|
41618
|
+
state.isOverTarget = true;
|
|
41619
|
+
state.activePointerId = e.pointerId;
|
|
41620
|
+
state.target = e.currentTarget;
|
|
41621
|
+
if (!isDisabled1 && !preventFocusOnPress) $7215afc6de606d6b$export$de79e2c695e052f3(e.currentTarget);
|
|
41622
|
+
if (!allowTextSelectionOnPress) $14c0b72509d70225$export$16a4697467175487(state.target);
|
|
41623
|
+
triggerPressStart(e, state.pointerType);
|
|
41624
|
+
addGlobalListener(document, 'pointermove', onPointerMove, false);
|
|
41625
|
+
addGlobalListener(document, 'pointerup', onPointerUp, false);
|
|
41626
|
+
addGlobalListener(document, 'pointercancel', onPointerCancel, false);
|
|
41627
|
+
}
|
|
41628
|
+
};
|
|
41629
|
+
pressProps.onMouseDown = (e)=>{
|
|
41630
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41631
|
+
if (e.button === 0) {
|
|
41632
|
+
// Chrome and Firefox on touch Windows devices require mouse down events
|
|
41633
|
+
// to be canceled in addition to pointer events, or an extra asynchronous
|
|
41634
|
+
// focus event will be fired.
|
|
41635
|
+
if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
|
|
41636
|
+
e.stopPropagation();
|
|
41637
|
+
}
|
|
41638
|
+
};
|
|
41639
|
+
pressProps.onPointerUp = (e)=>{
|
|
41640
|
+
// iOS fires pointerup with zero width and height, so check the pointerType recorded during pointerdown.
|
|
41641
|
+
if (!e.currentTarget.contains(e.target) || state.pointerType === 'virtual') return;
|
|
41642
|
+
// Only handle left clicks
|
|
41643
|
+
// Safari on iOS sometimes fires pointerup events, even
|
|
41644
|
+
// when the touch isn't over the target, so double check.
|
|
41645
|
+
if (e.button === 0 && $f6c31cce2adf654f$var$isOverTarget(e, e.currentTarget)) triggerPressUp(e, state.pointerType || e.pointerType);
|
|
41646
|
+
};
|
|
41647
|
+
// Safari on iOS < 13.2 does not implement pointerenter/pointerleave events correctly.
|
|
41648
|
+
// Use pointer move events instead to implement our own hit testing.
|
|
41649
|
+
// See https://bugs.webkit.org/show_bug.cgi?id=199803
|
|
41650
|
+
let onPointerMove = (e)=>{
|
|
41651
|
+
if (e.pointerId !== state.activePointerId) return;
|
|
41652
|
+
if ($f6c31cce2adf654f$var$isOverTarget(e, state.target)) {
|
|
41653
|
+
if (!state.isOverTarget) {
|
|
41654
|
+
state.isOverTarget = true;
|
|
41655
|
+
triggerPressStart($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType);
|
|
41656
|
+
}
|
|
41657
|
+
} else if (state.isOverTarget) {
|
|
41658
|
+
state.isOverTarget = false;
|
|
41659
|
+
triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType, false);
|
|
41660
|
+
if (propsRef.current.shouldCancelOnPointerExit) cancel(e);
|
|
41661
|
+
}
|
|
41662
|
+
};
|
|
41663
|
+
let onPointerUp = (e)=>{
|
|
41664
|
+
if (e.pointerId === state.activePointerId && state.isPressed && e.button === 0) {
|
|
41665
|
+
if ($f6c31cce2adf654f$var$isOverTarget(e, state.target)) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType);
|
|
41666
|
+
else if (state.isOverTarget) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType, false);
|
|
41667
|
+
state.isPressed = false;
|
|
41668
|
+
state.isOverTarget = false;
|
|
41669
|
+
state.activePointerId = null;
|
|
41670
|
+
state.pointerType = null;
|
|
41671
|
+
removeAllGlobalListeners();
|
|
41672
|
+
if (!allowTextSelectionOnPress) $14c0b72509d70225$export$b0d6fa1ab32e3295(state.target);
|
|
41673
|
+
}
|
|
41674
|
+
};
|
|
41675
|
+
let onPointerCancel = (e)=>{
|
|
41676
|
+
cancel(e);
|
|
41677
|
+
};
|
|
41678
|
+
pressProps.onDragStart = (e)=>{
|
|
41679
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41680
|
+
// Safari does not call onPointerCancel when a drag starts, whereas Chrome and Firefox do.
|
|
41681
|
+
cancel(e);
|
|
41682
|
+
};
|
|
41683
|
+
} else {
|
|
41684
|
+
pressProps.onMouseDown = (e)=>{
|
|
41685
|
+
// Only handle left clicks
|
|
41686
|
+
if (e.button !== 0 || !e.currentTarget.contains(e.target)) return;
|
|
41687
|
+
// Due to browser inconsistencies, especially on mobile browsers, we prevent
|
|
41688
|
+
// default on mouse down and handle focusing the pressable element ourselves.
|
|
41689
|
+
if ($f6c31cce2adf654f$var$shouldPreventDefault(e.currentTarget)) e.preventDefault();
|
|
41690
|
+
e.stopPropagation();
|
|
41691
|
+
if (state.ignoreEmulatedMouseEvents) return;
|
|
41692
|
+
state.isPressed = true;
|
|
41693
|
+
state.isOverTarget = true;
|
|
41694
|
+
state.target = e.currentTarget;
|
|
41695
|
+
state.pointerType = $8a9cb279dc87e130$export$60278871457622de(e.nativeEvent) ? 'virtual' : 'mouse';
|
|
41696
|
+
if (!isDisabled1 && !preventFocusOnPress) $7215afc6de606d6b$export$de79e2c695e052f3(e.currentTarget);
|
|
41697
|
+
triggerPressStart(e, state.pointerType);
|
|
41698
|
+
addGlobalListener(document, 'mouseup', onMouseUp, false);
|
|
41699
|
+
};
|
|
41700
|
+
pressProps.onMouseEnter = (e)=>{
|
|
41701
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41702
|
+
e.stopPropagation();
|
|
41703
|
+
if (state.isPressed && !state.ignoreEmulatedMouseEvents) {
|
|
41704
|
+
state.isOverTarget = true;
|
|
41705
|
+
triggerPressStart(e, state.pointerType);
|
|
41706
|
+
}
|
|
41707
|
+
};
|
|
41708
|
+
pressProps.onMouseLeave = (e)=>{
|
|
41709
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41710
|
+
e.stopPropagation();
|
|
41711
|
+
if (state.isPressed && !state.ignoreEmulatedMouseEvents) {
|
|
41712
|
+
state.isOverTarget = false;
|
|
41713
|
+
triggerPressEnd(e, state.pointerType, false);
|
|
41714
|
+
if (propsRef.current.shouldCancelOnPointerExit) cancel(e);
|
|
41715
|
+
}
|
|
41716
|
+
};
|
|
41717
|
+
pressProps.onMouseUp = (e)=>{
|
|
41718
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41719
|
+
if (!state.ignoreEmulatedMouseEvents && e.button === 0) triggerPressUp(e, state.pointerType);
|
|
41720
|
+
};
|
|
41721
|
+
let onMouseUp = (e)=>{
|
|
41722
|
+
// Only handle left clicks
|
|
41723
|
+
if (e.button !== 0) return;
|
|
41724
|
+
state.isPressed = false;
|
|
41725
|
+
removeAllGlobalListeners();
|
|
41726
|
+
if (state.ignoreEmulatedMouseEvents) {
|
|
41727
|
+
state.ignoreEmulatedMouseEvents = false;
|
|
41728
|
+
return;
|
|
41729
|
+
}
|
|
41730
|
+
if ($f6c31cce2adf654f$var$isOverTarget(e, state.target)) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType);
|
|
41731
|
+
else if (state.isOverTarget) triggerPressEnd($f6c31cce2adf654f$var$createEvent(state.target, e), state.pointerType, false);
|
|
41732
|
+
state.isOverTarget = false;
|
|
41733
|
+
};
|
|
41734
|
+
pressProps.onTouchStart = (e)=>{
|
|
41735
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41736
|
+
e.stopPropagation();
|
|
41737
|
+
let touch = $f6c31cce2adf654f$var$getTouchFromEvent(e.nativeEvent);
|
|
41738
|
+
if (!touch) return;
|
|
41739
|
+
state.activePointerId = touch.identifier;
|
|
41740
|
+
state.ignoreEmulatedMouseEvents = true;
|
|
41741
|
+
state.isOverTarget = true;
|
|
41742
|
+
state.isPressed = true;
|
|
41743
|
+
state.target = e.currentTarget;
|
|
41744
|
+
state.pointerType = 'touch';
|
|
41745
|
+
// Due to browser inconsistencies, especially on mobile browsers, we prevent default
|
|
41746
|
+
// on the emulated mouse event and handle focusing the pressable element ourselves.
|
|
41747
|
+
if (!isDisabled1 && !preventFocusOnPress) $7215afc6de606d6b$export$de79e2c695e052f3(e.currentTarget);
|
|
41748
|
+
if (!allowTextSelectionOnPress) $14c0b72509d70225$export$16a4697467175487(state.target);
|
|
41749
|
+
triggerPressStart(e, state.pointerType);
|
|
41750
|
+
addGlobalListener(window, 'scroll', onScroll, true);
|
|
41751
|
+
};
|
|
41752
|
+
pressProps.onTouchMove = (e)=>{
|
|
41753
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41754
|
+
e.stopPropagation();
|
|
41755
|
+
if (!state.isPressed) return;
|
|
41756
|
+
let touch = $f6c31cce2adf654f$var$getTouchById(e.nativeEvent, state.activePointerId);
|
|
41757
|
+
if (touch && $f6c31cce2adf654f$var$isOverTarget(touch, e.currentTarget)) {
|
|
41758
|
+
if (!state.isOverTarget) {
|
|
41759
|
+
state.isOverTarget = true;
|
|
41760
|
+
triggerPressStart(e, state.pointerType);
|
|
41761
|
+
}
|
|
41762
|
+
} else if (state.isOverTarget) {
|
|
41763
|
+
state.isOverTarget = false;
|
|
41764
|
+
triggerPressEnd(e, state.pointerType, false);
|
|
41765
|
+
if (propsRef.current.shouldCancelOnPointerExit) cancel(e);
|
|
41766
|
+
}
|
|
41767
|
+
};
|
|
41768
|
+
pressProps.onTouchEnd = (e)=>{
|
|
41769
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41770
|
+
e.stopPropagation();
|
|
41771
|
+
if (!state.isPressed) return;
|
|
41772
|
+
let touch = $f6c31cce2adf654f$var$getTouchById(e.nativeEvent, state.activePointerId);
|
|
41773
|
+
if (touch && $f6c31cce2adf654f$var$isOverTarget(touch, e.currentTarget)) {
|
|
41774
|
+
triggerPressUp(e, state.pointerType);
|
|
41775
|
+
triggerPressEnd(e, state.pointerType);
|
|
41776
|
+
} else if (state.isOverTarget) triggerPressEnd(e, state.pointerType, false);
|
|
41777
|
+
state.isPressed = false;
|
|
41778
|
+
state.activePointerId = null;
|
|
41779
|
+
state.isOverTarget = false;
|
|
41780
|
+
state.ignoreEmulatedMouseEvents = true;
|
|
41781
|
+
if (!allowTextSelectionOnPress) $14c0b72509d70225$export$b0d6fa1ab32e3295(state.target);
|
|
41782
|
+
removeAllGlobalListeners();
|
|
41783
|
+
};
|
|
41784
|
+
pressProps.onTouchCancel = (e)=>{
|
|
41785
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41786
|
+
e.stopPropagation();
|
|
41787
|
+
if (state.isPressed) cancel(e);
|
|
41788
|
+
};
|
|
41789
|
+
let onScroll = (e)=>{
|
|
41790
|
+
if (state.isPressed && e.target.contains(state.target)) cancel({
|
|
41791
|
+
currentTarget: state.target,
|
|
41792
|
+
shiftKey: false,
|
|
41793
|
+
ctrlKey: false,
|
|
41794
|
+
metaKey: false,
|
|
41795
|
+
altKey: false
|
|
41796
|
+
});
|
|
41797
|
+
};
|
|
41798
|
+
pressProps.onDragStart = (e)=>{
|
|
41799
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
41800
|
+
cancel(e);
|
|
41801
|
+
};
|
|
41802
|
+
}
|
|
41803
|
+
return pressProps;
|
|
41804
|
+
}, [
|
|
41805
|
+
addGlobalListener,
|
|
41806
|
+
isDisabled1,
|
|
41807
|
+
preventFocusOnPress,
|
|
41808
|
+
removeAllGlobalListeners,
|
|
41809
|
+
allowTextSelectionOnPress
|
|
41810
|
+
]);
|
|
41811
|
+
// Remove user-select: none in case component unmounts immediately after pressStart
|
|
41812
|
+
// eslint-disable-next-line arrow-body-style
|
|
41813
|
+
React.useEffect(()=>{
|
|
41814
|
+
return ()=>{
|
|
41815
|
+
if (!allowTextSelectionOnPress) $14c0b72509d70225$export$b0d6fa1ab32e3295(ref.current.target);
|
|
41816
|
+
};
|
|
41817
|
+
}, [
|
|
41818
|
+
allowTextSelectionOnPress
|
|
41819
|
+
]);
|
|
41820
|
+
return {
|
|
41821
|
+
isPressed: isPressedProp || isPressed,
|
|
41822
|
+
pressProps: $3ef42575df84b30b$export$9d1611c77c2fe928(domProps, pressProps1)
|
|
41823
|
+
};
|
|
41824
|
+
}
|
|
41825
|
+
function $f6c31cce2adf654f$var$isHTMLAnchorLink(target) {
|
|
41826
|
+
return target.tagName === 'A' && target.hasAttribute('href');
|
|
41827
|
+
}
|
|
41828
|
+
function $f6c31cce2adf654f$var$isValidKeyboardEvent(event) {
|
|
41829
|
+
const { key: key , code: code , target: target } = event;
|
|
41830
|
+
const element = target;
|
|
41831
|
+
const { tagName: tagName , isContentEditable: isContentEditable } = element;
|
|
41832
|
+
const role = element.getAttribute('role');
|
|
41833
|
+
// Accessibility for keyboards. Space and Enter only.
|
|
41834
|
+
// "Spacebar" is for IE 11
|
|
41835
|
+
return (key === 'Enter' || key === ' ' || key === 'Spacebar' || code === 'Space') && tagName !== 'INPUT' && tagName !== 'TEXTAREA' && isContentEditable !== true && (!$f6c31cce2adf654f$var$isHTMLAnchorLink(element) || role === 'button' && key !== 'Enter') && // An element with role='link' should only trigger with Enter key
|
|
41836
|
+
!(role === 'link' && key !== 'Enter');
|
|
41837
|
+
}
|
|
41838
|
+
function $f6c31cce2adf654f$var$getTouchFromEvent(event) {
|
|
41839
|
+
const { targetTouches: targetTouches } = event;
|
|
41840
|
+
if (targetTouches.length > 0) return targetTouches[0];
|
|
41841
|
+
return null;
|
|
41842
|
+
}
|
|
41843
|
+
function $f6c31cce2adf654f$var$getTouchById(event, pointerId) {
|
|
41844
|
+
const changedTouches = event.changedTouches;
|
|
41845
|
+
for(let i = 0; i < changedTouches.length; i++){
|
|
41846
|
+
const touch = changedTouches[i];
|
|
41847
|
+
if (touch.identifier === pointerId) return touch;
|
|
41848
|
+
}
|
|
41849
|
+
return null;
|
|
41850
|
+
}
|
|
41851
|
+
function $f6c31cce2adf654f$var$createEvent(target, e) {
|
|
41852
|
+
return {
|
|
41853
|
+
currentTarget: target,
|
|
41854
|
+
shiftKey: e.shiftKey,
|
|
41855
|
+
ctrlKey: e.ctrlKey,
|
|
41856
|
+
metaKey: e.metaKey,
|
|
41857
|
+
altKey: e.altKey
|
|
41858
|
+
};
|
|
41859
|
+
}
|
|
41860
|
+
function $f6c31cce2adf654f$var$getPointClientRect(point) {
|
|
41861
|
+
let offsetX = point.width / 2 || point.radiusX || 0;
|
|
41862
|
+
let offsetY = point.height / 2 || point.radiusY || 0;
|
|
41863
|
+
return {
|
|
41864
|
+
top: point.clientY - offsetY,
|
|
41865
|
+
right: point.clientX + offsetX,
|
|
41866
|
+
bottom: point.clientY + offsetY,
|
|
41867
|
+
left: point.clientX - offsetX
|
|
41868
|
+
};
|
|
41869
|
+
}
|
|
41870
|
+
function $f6c31cce2adf654f$var$areRectanglesOverlapping(a, b) {
|
|
41871
|
+
// check if they cannot overlap on x axis
|
|
41872
|
+
if (a.left > b.right || b.left > a.right) return false;
|
|
41873
|
+
// check if they cannot overlap on y axis
|
|
41874
|
+
if (a.top > b.bottom || b.top > a.bottom) return false;
|
|
41875
|
+
return true;
|
|
41876
|
+
}
|
|
41877
|
+
function $f6c31cce2adf654f$var$isOverTarget(point, target) {
|
|
41878
|
+
let rect = target.getBoundingClientRect();
|
|
41879
|
+
let pointRect = $f6c31cce2adf654f$var$getPointClientRect(point);
|
|
41880
|
+
return $f6c31cce2adf654f$var$areRectanglesOverlapping(rect, pointRect);
|
|
41881
|
+
}
|
|
41882
|
+
function $f6c31cce2adf654f$var$shouldPreventDefault(target) {
|
|
41883
|
+
// We cannot prevent default if the target is a draggable element.
|
|
41884
|
+
return !(target instanceof HTMLElement) || !target.draggable;
|
|
41885
|
+
}
|
|
41886
|
+
function $f6c31cce2adf654f$var$shouldPreventDefaultKeyboard(target) {
|
|
41887
|
+
return !((target.tagName === 'INPUT' || target.tagName === 'BUTTON') && target.type === 'submit');
|
|
41888
|
+
}
|
|
41889
|
+
function $f6c31cce2adf654f$var$isVirtualPointerEvent(event) {
|
|
41890
|
+
// If the pointer size is zero, then we assume it's from a screen reader.
|
|
41891
|
+
// Android TalkBack double tap will sometimes return a event with width and height of 1
|
|
41892
|
+
// and pointerType === 'mouse' so we need to check for a specific combination of event attributes.
|
|
41893
|
+
// Cannot use "event.pressure === 0" as the sole check due to Safari pointer events always returning pressure === 0
|
|
41894
|
+
// instead of .5, see https://bugs.webkit.org/show_bug.cgi?id=206216. event.pointerType === 'mouse' is to distingush
|
|
41895
|
+
// Talkback double tap from Windows Firefox touch screen press
|
|
41896
|
+
return event.width === 0 && event.height === 0 || event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === 'mouse';
|
|
41897
|
+
}
|
|
41898
|
+
|
|
41899
|
+
|
|
41900
|
+
|
|
41901
|
+
|
|
41902
|
+
function $a1ea59d68270f0dd$export$f8168d8dd8fd66e6(props) {
|
|
41903
|
+
let { isDisabled: isDisabled , onFocus: onFocusProp , onBlur: onBlurProp , onFocusChange: onFocusChange } = props;
|
|
41904
|
+
const onBlur = React.useCallback((e)=>{
|
|
41905
|
+
if (e.target === e.currentTarget) {
|
|
41906
|
+
if (onBlurProp) onBlurProp(e);
|
|
41907
|
+
if (onFocusChange) onFocusChange(false);
|
|
41908
|
+
return true;
|
|
41909
|
+
}
|
|
41910
|
+
}, [
|
|
41911
|
+
onBlurProp,
|
|
41912
|
+
onFocusChange
|
|
41913
|
+
]);
|
|
41914
|
+
const onSyntheticFocus = $8a9cb279dc87e130$export$715c682d09d639cc(onBlur);
|
|
41915
|
+
const onFocus = React.useCallback((e)=>{
|
|
41916
|
+
if (e.target === e.currentTarget) {
|
|
41917
|
+
if (onFocusProp) onFocusProp(e);
|
|
41918
|
+
if (onFocusChange) onFocusChange(true);
|
|
41919
|
+
onSyntheticFocus(e);
|
|
41920
|
+
}
|
|
41921
|
+
}, [
|
|
41922
|
+
onFocusChange,
|
|
41923
|
+
onFocusProp,
|
|
41924
|
+
onSyntheticFocus
|
|
41925
|
+
]);
|
|
41926
|
+
return {
|
|
41927
|
+
focusProps: {
|
|
41928
|
+
onFocus: !isDisabled && (onFocusProp || onFocusChange || onBlurProp) ? onFocus : undefined,
|
|
41929
|
+
onBlur: !isDisabled && (onBlurProp || onFocusChange) ? onBlur : null
|
|
41930
|
+
}
|
|
41931
|
+
};
|
|
41932
|
+
}
|
|
41933
|
+
|
|
41934
|
+
|
|
41935
|
+
|
|
41936
|
+
|
|
41937
|
+
|
|
41938
|
+
let $507fabe10e71c6fb$var$currentModality = null;
|
|
41939
|
+
let $507fabe10e71c6fb$var$changeHandlers = new Set();
|
|
41940
|
+
let $507fabe10e71c6fb$var$hasSetupGlobalListeners = false;
|
|
41941
|
+
let $507fabe10e71c6fb$var$hasEventBeforeFocus = false;
|
|
41942
|
+
let $507fabe10e71c6fb$var$hasBlurredWindowRecently = false;
|
|
41943
|
+
// Only Tab or Esc keys will make focus visible on text input elements
|
|
41944
|
+
const $507fabe10e71c6fb$var$FOCUS_VISIBLE_INPUT_KEYS = {
|
|
41945
|
+
Tab: true,
|
|
41946
|
+
Escape: true
|
|
41947
|
+
};
|
|
41948
|
+
function $507fabe10e71c6fb$var$triggerChangeHandlers(modality, e) {
|
|
41949
|
+
for (let handler of $507fabe10e71c6fb$var$changeHandlers)handler(modality, e);
|
|
41950
|
+
}
|
|
41951
|
+
/**
|
|
41952
|
+
* Helper function to determine if a KeyboardEvent is unmodified and could make keyboard focus styles visible.
|
|
41953
|
+
*/ function $507fabe10e71c6fb$var$isValidKey(e) {
|
|
41954
|
+
// Control and Shift keys trigger when navigating back to the tab with keyboard.
|
|
41955
|
+
return !(e.metaKey || !$c87311424ea30a05$export$9ac100e40613ea10() && e.altKey || e.ctrlKey || e.key === 'Control' || e.key === 'Shift' || e.key === 'Meta');
|
|
41956
|
+
}
|
|
41957
|
+
function $507fabe10e71c6fb$var$handleKeyboardEvent(e) {
|
|
41958
|
+
$507fabe10e71c6fb$var$hasEventBeforeFocus = true;
|
|
41959
|
+
if ($507fabe10e71c6fb$var$isValidKey(e)) {
|
|
41960
|
+
$507fabe10e71c6fb$var$currentModality = 'keyboard';
|
|
41961
|
+
$507fabe10e71c6fb$var$triggerChangeHandlers('keyboard', e);
|
|
41962
|
+
}
|
|
41963
|
+
}
|
|
41964
|
+
function $507fabe10e71c6fb$var$handlePointerEvent(e) {
|
|
41965
|
+
$507fabe10e71c6fb$var$currentModality = 'pointer';
|
|
41966
|
+
if (e.type === 'mousedown' || e.type === 'pointerdown') {
|
|
41967
|
+
$507fabe10e71c6fb$var$hasEventBeforeFocus = true;
|
|
41968
|
+
$507fabe10e71c6fb$var$triggerChangeHandlers('pointer', e);
|
|
41969
|
+
}
|
|
41970
|
+
}
|
|
41971
|
+
function $507fabe10e71c6fb$var$handleClickEvent(e) {
|
|
41972
|
+
if ($8a9cb279dc87e130$export$60278871457622de(e)) {
|
|
41973
|
+
$507fabe10e71c6fb$var$hasEventBeforeFocus = true;
|
|
41974
|
+
$507fabe10e71c6fb$var$currentModality = 'virtual';
|
|
41975
|
+
}
|
|
41976
|
+
}
|
|
41977
|
+
function $507fabe10e71c6fb$var$handleFocusEvent(e) {
|
|
41978
|
+
// Firefox fires two extra focus events when the user first clicks into an iframe:
|
|
41979
|
+
// first on the window, then on the document. We ignore these events so they don't
|
|
41980
|
+
// cause keyboard focus rings to appear.
|
|
41981
|
+
if (e.target === window || e.target === document) return;
|
|
41982
|
+
// If a focus event occurs without a preceding keyboard or pointer event, switch to virtual modality.
|
|
41983
|
+
// This occurs, for example, when navigating a form with the next/previous buttons on iOS.
|
|
41984
|
+
if (!$507fabe10e71c6fb$var$hasEventBeforeFocus && !$507fabe10e71c6fb$var$hasBlurredWindowRecently) {
|
|
41985
|
+
$507fabe10e71c6fb$var$currentModality = 'virtual';
|
|
41986
|
+
$507fabe10e71c6fb$var$triggerChangeHandlers('virtual', e);
|
|
41987
|
+
}
|
|
41988
|
+
$507fabe10e71c6fb$var$hasEventBeforeFocus = false;
|
|
41989
|
+
$507fabe10e71c6fb$var$hasBlurredWindowRecently = false;
|
|
41990
|
+
}
|
|
41991
|
+
function $507fabe10e71c6fb$var$handleWindowBlur() {
|
|
41992
|
+
// When the window is blurred, reset state. This is necessary when tabbing out of the window,
|
|
41993
|
+
// for example, since a subsequent focus event won't be fired.
|
|
41994
|
+
$507fabe10e71c6fb$var$hasEventBeforeFocus = false;
|
|
41995
|
+
$507fabe10e71c6fb$var$hasBlurredWindowRecently = true;
|
|
41996
|
+
}
|
|
41997
|
+
/**
|
|
41998
|
+
* Setup global event listeners to control when keyboard focus style should be visible.
|
|
41999
|
+
*/ function $507fabe10e71c6fb$var$setupGlobalFocusEvents() {
|
|
42000
|
+
if (typeof window === 'undefined' || $507fabe10e71c6fb$var$hasSetupGlobalListeners) return;
|
|
42001
|
+
// Programmatic focus() calls shouldn't affect the current input modality.
|
|
42002
|
+
// However, we need to detect other cases when a focus event occurs without
|
|
42003
|
+
// a preceding user event (e.g. screen reader focus). Overriding the focus
|
|
42004
|
+
// method on HTMLElement.prototype is a bit hacky, but works.
|
|
42005
|
+
let focus = HTMLElement.prototype.focus;
|
|
42006
|
+
HTMLElement.prototype.focus = function() {
|
|
42007
|
+
$507fabe10e71c6fb$var$hasEventBeforeFocus = true;
|
|
42008
|
+
focus.apply(this, arguments);
|
|
42009
|
+
};
|
|
42010
|
+
document.addEventListener('keydown', $507fabe10e71c6fb$var$handleKeyboardEvent, true);
|
|
42011
|
+
document.addEventListener('keyup', $507fabe10e71c6fb$var$handleKeyboardEvent, true);
|
|
42012
|
+
document.addEventListener('click', $507fabe10e71c6fb$var$handleClickEvent, true);
|
|
42013
|
+
// Register focus events on the window so they are sure to happen
|
|
42014
|
+
// before React's event listeners (registered on the document).
|
|
42015
|
+
window.addEventListener('focus', $507fabe10e71c6fb$var$handleFocusEvent, true);
|
|
42016
|
+
window.addEventListener('blur', $507fabe10e71c6fb$var$handleWindowBlur, false);
|
|
42017
|
+
if (typeof PointerEvent !== 'undefined') {
|
|
42018
|
+
document.addEventListener('pointerdown', $507fabe10e71c6fb$var$handlePointerEvent, true);
|
|
42019
|
+
document.addEventListener('pointermove', $507fabe10e71c6fb$var$handlePointerEvent, true);
|
|
42020
|
+
document.addEventListener('pointerup', $507fabe10e71c6fb$var$handlePointerEvent, true);
|
|
42021
|
+
} else {
|
|
42022
|
+
document.addEventListener('mousedown', $507fabe10e71c6fb$var$handlePointerEvent, true);
|
|
42023
|
+
document.addEventListener('mousemove', $507fabe10e71c6fb$var$handlePointerEvent, true);
|
|
42024
|
+
document.addEventListener('mouseup', $507fabe10e71c6fb$var$handlePointerEvent, true);
|
|
42025
|
+
}
|
|
42026
|
+
$507fabe10e71c6fb$var$hasSetupGlobalListeners = true;
|
|
42027
|
+
}
|
|
42028
|
+
if (typeof document !== 'undefined') {
|
|
42029
|
+
if (document.readyState !== 'loading') $507fabe10e71c6fb$var$setupGlobalFocusEvents();
|
|
42030
|
+
else document.addEventListener('DOMContentLoaded', $507fabe10e71c6fb$var$setupGlobalFocusEvents);
|
|
42031
|
+
}
|
|
42032
|
+
function $507fabe10e71c6fb$export$b9b3dfddab17db27() {
|
|
42033
|
+
return $507fabe10e71c6fb$var$currentModality !== 'pointer';
|
|
42034
|
+
}
|
|
42035
|
+
function $507fabe10e71c6fb$export$630ff653c5ada6a9() {
|
|
42036
|
+
return $507fabe10e71c6fb$var$currentModality;
|
|
42037
|
+
}
|
|
42038
|
+
/**
|
|
42039
|
+
* If this is attached to text input component, return if the event is a focus event (Tab/Escape keys pressed) so that
|
|
42040
|
+
* focus visible style can be properly set.
|
|
42041
|
+
*/ function $507fabe10e71c6fb$var$isKeyboardFocusEvent(isTextInput, modality, e) {
|
|
42042
|
+
return !(isTextInput && modality === 'keyboard' && e instanceof KeyboardEvent && !$507fabe10e71c6fb$var$FOCUS_VISIBLE_INPUT_KEYS[e.key]);
|
|
42043
|
+
}
|
|
42044
|
+
function $507fabe10e71c6fb$export$ec71b4b83ac08ec3(fn, deps, opts) {
|
|
42045
|
+
$507fabe10e71c6fb$var$setupGlobalFocusEvents();
|
|
42046
|
+
React.useEffect(()=>{
|
|
42047
|
+
let handler = (modality, e)=>{
|
|
42048
|
+
if (!$507fabe10e71c6fb$var$isKeyboardFocusEvent(opts === null || opts === void 0 ? void 0 : opts.isTextInput, modality, e)) return;
|
|
42049
|
+
fn($507fabe10e71c6fb$export$b9b3dfddab17db27());
|
|
42050
|
+
};
|
|
42051
|
+
$507fabe10e71c6fb$var$changeHandlers.add(handler);
|
|
42052
|
+
return ()=>{
|
|
42053
|
+
$507fabe10e71c6fb$var$changeHandlers.delete(handler);
|
|
42054
|
+
};
|
|
42055
|
+
}, deps);
|
|
42056
|
+
}
|
|
42057
|
+
|
|
42058
|
+
|
|
42059
|
+
|
|
42060
|
+
|
|
42061
|
+
function $9ab94262bd0047c7$export$420e68273165f4ec(props) {
|
|
42062
|
+
let { isDisabled: isDisabled , onBlurWithin: onBlurWithin , onFocusWithin: onFocusWithin , onFocusWithinChange: onFocusWithinChange } = props;
|
|
42063
|
+
let state = React.useRef({
|
|
42064
|
+
isFocusWithin: false
|
|
42065
|
+
});
|
|
42066
|
+
let onBlur = React.useCallback((e)=>{
|
|
42067
|
+
// We don't want to trigger onBlurWithin and then immediately onFocusWithin again
|
|
42068
|
+
// when moving focus inside the element. Only trigger if the currentTarget doesn't
|
|
42069
|
+
// include the relatedTarget (where focus is moving).
|
|
42070
|
+
if (state.current.isFocusWithin && !e.currentTarget.contains(e.relatedTarget)) {
|
|
42071
|
+
state.current.isFocusWithin = false;
|
|
42072
|
+
if (onBlurWithin) onBlurWithin(e);
|
|
42073
|
+
if (onFocusWithinChange) onFocusWithinChange(false);
|
|
42074
|
+
}
|
|
42075
|
+
}, [
|
|
42076
|
+
onBlurWithin,
|
|
42077
|
+
onFocusWithinChange,
|
|
42078
|
+
state
|
|
42079
|
+
]);
|
|
42080
|
+
let onSyntheticFocus = $8a9cb279dc87e130$export$715c682d09d639cc(onBlur);
|
|
42081
|
+
let onFocus = React.useCallback((e)=>{
|
|
42082
|
+
if (!state.current.isFocusWithin) {
|
|
42083
|
+
if (onFocusWithin) onFocusWithin(e);
|
|
42084
|
+
if (onFocusWithinChange) onFocusWithinChange(true);
|
|
42085
|
+
state.current.isFocusWithin = true;
|
|
42086
|
+
onSyntheticFocus(e);
|
|
42087
|
+
}
|
|
42088
|
+
}, [
|
|
42089
|
+
onFocusWithin,
|
|
42090
|
+
onFocusWithinChange,
|
|
42091
|
+
onSyntheticFocus
|
|
42092
|
+
]);
|
|
42093
|
+
if (isDisabled) return {
|
|
42094
|
+
focusWithinProps: {
|
|
42095
|
+
onFocus: null,
|
|
42096
|
+
onBlur: null
|
|
42097
|
+
}
|
|
42098
|
+
};
|
|
42099
|
+
return {
|
|
42100
|
+
focusWithinProps: {
|
|
42101
|
+
onFocus: onFocus,
|
|
42102
|
+
onBlur: onBlur
|
|
42103
|
+
}
|
|
42104
|
+
};
|
|
42105
|
+
}
|
|
42106
|
+
|
|
42107
|
+
|
|
42108
|
+
|
|
42109
|
+
// iOS fires onPointerEnter twice: once with pointerType="touch" and again with pointerType="mouse".
|
|
42110
|
+
// We want to ignore these emulated events so they do not trigger hover behavior.
|
|
42111
|
+
// See https://bugs.webkit.org/show_bug.cgi?id=214609.
|
|
42112
|
+
let $6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents = false;
|
|
42113
|
+
let $6179b936705e76d3$var$hoverCount = 0;
|
|
42114
|
+
function $6179b936705e76d3$var$setGlobalIgnoreEmulatedMouseEvents() {
|
|
42115
|
+
$6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents = true;
|
|
42116
|
+
// Clear globalIgnoreEmulatedMouseEvents after a short timeout. iOS fires onPointerEnter
|
|
42117
|
+
// with pointerType="mouse" immediately after onPointerUp and before onFocus. On other
|
|
42118
|
+
// devices that don't have this quirk, we don't want to ignore a mouse hover sometime in
|
|
42119
|
+
// the distant future because a user previously touched the element.
|
|
42120
|
+
setTimeout(()=>{
|
|
42121
|
+
$6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents = false;
|
|
42122
|
+
}, 50);
|
|
42123
|
+
}
|
|
42124
|
+
function $6179b936705e76d3$var$handleGlobalPointerEvent(e) {
|
|
42125
|
+
if (e.pointerType === 'touch') $6179b936705e76d3$var$setGlobalIgnoreEmulatedMouseEvents();
|
|
42126
|
+
}
|
|
42127
|
+
function $6179b936705e76d3$var$setupGlobalTouchEvents() {
|
|
42128
|
+
if (typeof document === 'undefined') return;
|
|
42129
|
+
if (typeof PointerEvent !== 'undefined') document.addEventListener('pointerup', $6179b936705e76d3$var$handleGlobalPointerEvent);
|
|
42130
|
+
else document.addEventListener('touchend', $6179b936705e76d3$var$setGlobalIgnoreEmulatedMouseEvents);
|
|
42131
|
+
$6179b936705e76d3$var$hoverCount++;
|
|
42132
|
+
return ()=>{
|
|
42133
|
+
$6179b936705e76d3$var$hoverCount--;
|
|
42134
|
+
if ($6179b936705e76d3$var$hoverCount > 0) return;
|
|
42135
|
+
if (typeof PointerEvent !== 'undefined') document.removeEventListener('pointerup', $6179b936705e76d3$var$handleGlobalPointerEvent);
|
|
42136
|
+
else document.removeEventListener('touchend', $6179b936705e76d3$var$setGlobalIgnoreEmulatedMouseEvents);
|
|
42137
|
+
};
|
|
42138
|
+
}
|
|
42139
|
+
function $6179b936705e76d3$export$ae780daf29e6d456(props) {
|
|
42140
|
+
let { onHoverStart: onHoverStart , onHoverChange: onHoverChange , onHoverEnd: onHoverEnd , isDisabled: isDisabled } = props;
|
|
42141
|
+
let [isHovered, setHovered] = React.useState(false);
|
|
42142
|
+
let state = React.useRef({
|
|
42143
|
+
isHovered: false,
|
|
42144
|
+
ignoreEmulatedMouseEvents: false,
|
|
42145
|
+
pointerType: '',
|
|
42146
|
+
target: null
|
|
42147
|
+
}).current;
|
|
42148
|
+
React.useEffect($6179b936705e76d3$var$setupGlobalTouchEvents, []);
|
|
42149
|
+
let { hoverProps: hoverProps1 , triggerHoverEnd: triggerHoverEnd1 } = React.useMemo(()=>{
|
|
42150
|
+
let triggerHoverStart = (event, pointerType)=>{
|
|
42151
|
+
state.pointerType = pointerType;
|
|
42152
|
+
if (isDisabled || pointerType === 'touch' || state.isHovered || !event.currentTarget.contains(event.target)) return;
|
|
42153
|
+
state.isHovered = true;
|
|
42154
|
+
let target = event.currentTarget;
|
|
42155
|
+
state.target = target;
|
|
42156
|
+
if (onHoverStart) onHoverStart({
|
|
42157
|
+
type: 'hoverstart',
|
|
42158
|
+
target: target,
|
|
42159
|
+
pointerType: pointerType
|
|
42160
|
+
});
|
|
42161
|
+
if (onHoverChange) onHoverChange(true);
|
|
42162
|
+
setHovered(true);
|
|
42163
|
+
};
|
|
42164
|
+
let triggerHoverEnd = (event, pointerType)=>{
|
|
42165
|
+
state.pointerType = '';
|
|
42166
|
+
state.target = null;
|
|
42167
|
+
if (pointerType === 'touch' || !state.isHovered) return;
|
|
42168
|
+
state.isHovered = false;
|
|
42169
|
+
let target = event.currentTarget;
|
|
42170
|
+
if (onHoverEnd) onHoverEnd({
|
|
42171
|
+
type: 'hoverend',
|
|
42172
|
+
target: target,
|
|
42173
|
+
pointerType: pointerType
|
|
42174
|
+
});
|
|
42175
|
+
if (onHoverChange) onHoverChange(false);
|
|
42176
|
+
setHovered(false);
|
|
42177
|
+
};
|
|
42178
|
+
let hoverProps = {
|
|
42179
|
+
};
|
|
42180
|
+
if (typeof PointerEvent !== 'undefined') {
|
|
42181
|
+
hoverProps.onPointerEnter = (e)=>{
|
|
42182
|
+
if ($6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents && e.pointerType === 'mouse') return;
|
|
42183
|
+
triggerHoverStart(e, e.pointerType);
|
|
42184
|
+
};
|
|
42185
|
+
hoverProps.onPointerLeave = (e)=>{
|
|
42186
|
+
if (!isDisabled && e.currentTarget.contains(e.target)) triggerHoverEnd(e, e.pointerType);
|
|
42187
|
+
};
|
|
42188
|
+
} else {
|
|
42189
|
+
hoverProps.onTouchStart = ()=>{
|
|
42190
|
+
state.ignoreEmulatedMouseEvents = true;
|
|
42191
|
+
};
|
|
42192
|
+
hoverProps.onMouseEnter = (e)=>{
|
|
42193
|
+
if (!state.ignoreEmulatedMouseEvents && !$6179b936705e76d3$var$globalIgnoreEmulatedMouseEvents) triggerHoverStart(e, 'mouse');
|
|
42194
|
+
state.ignoreEmulatedMouseEvents = false;
|
|
42195
|
+
};
|
|
42196
|
+
hoverProps.onMouseLeave = (e)=>{
|
|
42197
|
+
if (!isDisabled && e.currentTarget.contains(e.target)) triggerHoverEnd(e, 'mouse');
|
|
42198
|
+
};
|
|
42199
|
+
}
|
|
42200
|
+
return {
|
|
42201
|
+
hoverProps: hoverProps,
|
|
42202
|
+
triggerHoverEnd: triggerHoverEnd
|
|
42203
|
+
};
|
|
42204
|
+
}, [
|
|
42205
|
+
onHoverStart,
|
|
42206
|
+
onHoverChange,
|
|
42207
|
+
onHoverEnd,
|
|
42208
|
+
isDisabled,
|
|
42209
|
+
state
|
|
42210
|
+
]);
|
|
42211
|
+
React.useEffect(()=>{
|
|
42212
|
+
// Call the triggerHoverEnd as soon as isDisabled changes to true
|
|
42213
|
+
// Safe to call triggerHoverEnd, it will early return if we aren't currently hovering
|
|
42214
|
+
if (isDisabled) triggerHoverEnd1({
|
|
42215
|
+
currentTarget: state.target
|
|
42216
|
+
}, state.pointerType);
|
|
42217
|
+
}, [
|
|
42218
|
+
isDisabled
|
|
42219
|
+
]);
|
|
42220
|
+
return {
|
|
42221
|
+
hoverProps: hoverProps1,
|
|
42222
|
+
isHovered: isHovered
|
|
42223
|
+
};
|
|
42224
|
+
}
|
|
42225
|
+
|
|
42226
|
+
|
|
42227
|
+
|
|
42228
|
+
|
|
42229
|
+
|
|
42230
|
+
const $8a26561d2877236e$var$DEFAULT_THRESHOLD = 500;
|
|
42231
|
+
function $8a26561d2877236e$export$c24ed0104d07eab9(props) {
|
|
42232
|
+
let { isDisabled: isDisabled , onLongPressStart: onLongPressStart , onLongPressEnd: onLongPressEnd , onLongPress: onLongPress , threshold: threshold = $8a26561d2877236e$var$DEFAULT_THRESHOLD , accessibilityDescription: accessibilityDescription } = props;
|
|
42233
|
+
const timeRef = React.useRef(null);
|
|
42234
|
+
let { addGlobalListener: addGlobalListener , removeGlobalListener: removeGlobalListener } = $03deb23ff14920c4$export$4eaf04e54aa8eed6();
|
|
42235
|
+
let { pressProps: pressProps } = $f6c31cce2adf654f$export$45712eceda6fad21({
|
|
42236
|
+
isDisabled: isDisabled,
|
|
42237
|
+
onPressStart (e1) {
|
|
42238
|
+
if (e1.pointerType === 'mouse' || e1.pointerType === 'touch') {
|
|
42239
|
+
if (onLongPressStart) onLongPressStart({
|
|
42240
|
+
...e1,
|
|
42241
|
+
type: 'longpressstart'
|
|
42242
|
+
});
|
|
42243
|
+
timeRef.current = setTimeout(()=>{
|
|
42244
|
+
// Prevent other usePress handlers from also handling this event.
|
|
42245
|
+
e1.target.dispatchEvent(new PointerEvent('pointercancel', {
|
|
42246
|
+
bubbles: true
|
|
42247
|
+
}));
|
|
42248
|
+
if (onLongPress) onLongPress({
|
|
42249
|
+
...e1,
|
|
42250
|
+
type: 'longpress'
|
|
42251
|
+
});
|
|
42252
|
+
timeRef.current = null;
|
|
42253
|
+
}, threshold);
|
|
42254
|
+
// Prevent context menu, which may be opened on long press on touch devices
|
|
42255
|
+
if (e1.pointerType === 'touch') {
|
|
42256
|
+
let onContextMenu = (e)=>{
|
|
42257
|
+
e.preventDefault();
|
|
42258
|
+
};
|
|
42259
|
+
addGlobalListener(e1.target, 'contextmenu', onContextMenu, {
|
|
42260
|
+
once: true
|
|
42261
|
+
});
|
|
42262
|
+
addGlobalListener(window, 'pointerup', ()=>{
|
|
42263
|
+
// If no contextmenu event is fired quickly after pointerup, remove the handler
|
|
42264
|
+
// so future context menu events outside a long press are not prevented.
|
|
42265
|
+
setTimeout(()=>{
|
|
42266
|
+
removeGlobalListener(e1.target, 'contextmenu', onContextMenu);
|
|
42267
|
+
}, 30);
|
|
42268
|
+
}, {
|
|
42269
|
+
once: true
|
|
42270
|
+
});
|
|
42271
|
+
}
|
|
42272
|
+
}
|
|
42273
|
+
},
|
|
42274
|
+
onPressEnd (e) {
|
|
42275
|
+
if (timeRef.current) clearTimeout(timeRef.current);
|
|
42276
|
+
if (onLongPressEnd && (e.pointerType === 'mouse' || e.pointerType === 'touch')) onLongPressEnd({
|
|
42277
|
+
...e,
|
|
42278
|
+
type: 'longpressend'
|
|
42279
|
+
});
|
|
42280
|
+
}
|
|
42281
|
+
});
|
|
42282
|
+
let descriptionProps = $ef06256079686ba0$export$f8aeda7b10753fa1(onLongPress && !isDisabled ? accessibilityDescription : null);
|
|
42283
|
+
return {
|
|
42284
|
+
longPressProps: $3ef42575df84b30b$export$9d1611c77c2fe928(pressProps, descriptionProps)
|
|
42285
|
+
};
|
|
42286
|
+
}
|
|
42287
|
+
|
|
42288
|
+
function $d191a55c9702f145$export$8467354a121f1b9f(props) {
|
|
42289
|
+
let { id: id , label: label , 'aria-labelledby': ariaLabelledby , 'aria-label': ariaLabel , labelElementType: labelElementType = 'label' } = props;
|
|
42290
|
+
id = $bdb11010cef70236$export$f680877a34711e37(id);
|
|
42291
|
+
let labelId = $bdb11010cef70236$export$f680877a34711e37();
|
|
42292
|
+
let labelProps = {
|
|
42293
|
+
};
|
|
42294
|
+
if (label) {
|
|
42295
|
+
ariaLabelledby = ariaLabelledby ? `${ariaLabelledby} ${labelId}` : labelId;
|
|
42296
|
+
labelProps = {
|
|
42297
|
+
id: labelId,
|
|
42298
|
+
htmlFor: labelElementType === 'label' ? id : undefined
|
|
42299
|
+
};
|
|
42300
|
+
} else if (!ariaLabelledby && !ariaLabel) console.warn('If you do not provide a visible label, you must specify an aria-label or aria-labelledby attribute for accessibility');
|
|
42301
|
+
let fieldProps = $313b98861ee5dd6c$export$d6875122194c7b44({
|
|
42302
|
+
id: id,
|
|
42303
|
+
'aria-label': ariaLabel,
|
|
42304
|
+
'aria-labelledby': ariaLabelledby
|
|
42305
|
+
});
|
|
42306
|
+
return {
|
|
42307
|
+
labelProps: labelProps,
|
|
42308
|
+
fieldProps: fieldProps
|
|
42309
|
+
};
|
|
42310
|
+
}
|
|
42311
|
+
|
|
42312
|
+
function $6a99195332edec8b$export$80f3e147d781571c(element) {
|
|
42313
|
+
// If the user is interacting with a virtual cursor, e.g. screen reader, then
|
|
42314
|
+
// wait until after any animated transitions that are currently occurring on
|
|
42315
|
+
// the page before shifting focus. This avoids issues with VoiceOver on iOS
|
|
42316
|
+
// causing the page to scroll when moving focus if the element is transitioning
|
|
42317
|
+
// from off the screen.
|
|
42318
|
+
if ($507fabe10e71c6fb$export$630ff653c5ada6a9() === 'virtual') {
|
|
42319
|
+
let lastFocusedElement = document.activeElement;
|
|
42320
|
+
$bbed8b41f857bcc0$export$24490316f764c430(()=>{
|
|
42321
|
+
// If focus did not move and the element is still in the document, focus it.
|
|
42322
|
+
if (document.activeElement === lastFocusedElement && document.contains(element)) $7215afc6de606d6b$export$de79e2c695e052f3(element);
|
|
42323
|
+
});
|
|
42324
|
+
} else $7215afc6de606d6b$export$de79e2c695e052f3(element);
|
|
42325
|
+
}
|
|
42326
|
+
|
|
42327
|
+
|
|
42328
|
+
/*
|
|
42329
|
+
* Copyright 2021 Adobe. All rights reserved.
|
|
42330
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
42331
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
42332
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
42333
|
+
*
|
|
42334
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
42335
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
42336
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
42337
|
+
* governing permissions and limitations under the License.
|
|
42338
|
+
*/ function $645f2e67b85a24c9$var$isStyleVisible(element) {
|
|
42339
|
+
if (!(element instanceof HTMLElement) && !(element instanceof SVGElement)) return false;
|
|
42340
|
+
let { display: display , visibility: visibility } = element.style;
|
|
42341
|
+
let isVisible = display !== 'none' && visibility !== 'hidden' && visibility !== 'collapse';
|
|
42342
|
+
if (isVisible) {
|
|
42343
|
+
const { getComputedStyle: getComputedStyle } = element.ownerDocument.defaultView;
|
|
42344
|
+
let { display: computedDisplay , visibility: computedVisibility } = getComputedStyle(element);
|
|
42345
|
+
isVisible = computedDisplay !== 'none' && computedVisibility !== 'hidden' && computedVisibility !== 'collapse';
|
|
42346
|
+
}
|
|
42347
|
+
return isVisible;
|
|
42348
|
+
}
|
|
42349
|
+
function $645f2e67b85a24c9$var$isAttributeVisible(element, childElement) {
|
|
42350
|
+
return !element.hasAttribute('hidden') && (element.nodeName === 'DETAILS' && childElement && childElement.nodeName !== 'SUMMARY' ? element.hasAttribute('open') : true);
|
|
42351
|
+
}
|
|
42352
|
+
function $645f2e67b85a24c9$export$e989c0fffaa6b27a(element, childElement) {
|
|
42353
|
+
return element.nodeName !== '#comment' && $645f2e67b85a24c9$var$isStyleVisible(element) && $645f2e67b85a24c9$var$isAttributeVisible(element, childElement) && (!element.parentElement || $645f2e67b85a24c9$export$e989c0fffaa6b27a(element.parentElement, element));
|
|
42354
|
+
}
|
|
42355
|
+
const $9bf71ea28793e738$var$focusableElements = [
|
|
42356
|
+
'input:not([disabled]):not([type=hidden])',
|
|
42357
|
+
'select:not([disabled])',
|
|
42358
|
+
'textarea:not([disabled])',
|
|
42359
|
+
'button:not([disabled])',
|
|
42360
|
+
'a[href]',
|
|
42361
|
+
'area[href]',
|
|
42362
|
+
'summary',
|
|
42363
|
+
'iframe',
|
|
42364
|
+
'object',
|
|
42365
|
+
'embed',
|
|
42366
|
+
'audio[controls]',
|
|
42367
|
+
'video[controls]',
|
|
42368
|
+
'[contenteditable]'
|
|
42369
|
+
];
|
|
42370
|
+
const $9bf71ea28793e738$var$FOCUSABLE_ELEMENT_SELECTOR = $9bf71ea28793e738$var$focusableElements.join(':not([hidden]),') + ',[tabindex]:not([disabled]):not([hidden])';
|
|
42371
|
+
$9bf71ea28793e738$var$focusableElements.push('[tabindex]:not([tabindex="-1"]):not([disabled])');
|
|
42372
|
+
const $9bf71ea28793e738$var$TABBABLE_ELEMENT_SELECTOR = $9bf71ea28793e738$var$focusableElements.join(':not([hidden]):not([tabindex="-1"]),');
|
|
42373
|
+
function $9bf71ea28793e738$var$isElementInScope(element, scope) {
|
|
42374
|
+
return scope.some((node)=>node.contains(element)
|
|
42375
|
+
);
|
|
42376
|
+
}
|
|
42377
|
+
function $9bf71ea28793e738$export$2d6ec8fc375ceafa(root, opts, scope) {
|
|
42378
|
+
let selector = (opts === null || opts === void 0 ? void 0 : opts.tabbable) ? $9bf71ea28793e738$var$TABBABLE_ELEMENT_SELECTOR : $9bf71ea28793e738$var$FOCUSABLE_ELEMENT_SELECTOR;
|
|
42379
|
+
let walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
|
|
42380
|
+
acceptNode (node) {
|
|
42381
|
+
var ref;
|
|
42382
|
+
// Skip nodes inside the starting node.
|
|
42383
|
+
if (opts === null || opts === void 0 ? void 0 : (ref = opts.from) === null || ref === void 0 ? void 0 : ref.contains(node)) return NodeFilter.FILTER_REJECT;
|
|
42384
|
+
if (node.matches(selector) && $645f2e67b85a24c9$export$e989c0fffaa6b27a(node) && (!scope || $9bf71ea28793e738$var$isElementInScope(node, scope)) && (!(opts === null || opts === void 0 ? void 0 : opts.accept) || opts.accept(node))) return NodeFilter.FILTER_ACCEPT;
|
|
42385
|
+
return NodeFilter.FILTER_SKIP;
|
|
42386
|
+
}
|
|
42387
|
+
});
|
|
42388
|
+
if (opts === null || opts === void 0 ? void 0 : opts.from) walker.currentNode = opts.from;
|
|
42389
|
+
return walker;
|
|
42390
|
+
}
|
|
42391
|
+
|
|
42392
|
+
|
|
42393
|
+
|
|
42394
|
+
|
|
42395
|
+
|
|
42396
|
+
|
|
42397
|
+
|
|
42398
|
+
|
|
42399
|
+
function $f7dceffc5ad7768b$export$4e328f61c538687f(props = {
|
|
42400
|
+
}) {
|
|
42401
|
+
let { autoFocus: autoFocus = false , isTextInput: isTextInput , within: within } = props;
|
|
42402
|
+
let state = React.useRef({
|
|
42403
|
+
isFocused: false,
|
|
42404
|
+
isFocusVisible: autoFocus || $507fabe10e71c6fb$export$b9b3dfddab17db27()
|
|
42405
|
+
});
|
|
42406
|
+
let [isFocused1, setFocused] = React.useState(false);
|
|
42407
|
+
let [isFocusVisibleState, setFocusVisible] = React.useState(()=>state.current.isFocused && state.current.isFocusVisible
|
|
42408
|
+
);
|
|
42409
|
+
let updateState = React.useCallback(()=>setFocusVisible(state.current.isFocused && state.current.isFocusVisible)
|
|
42410
|
+
, []);
|
|
42411
|
+
let onFocusChange = React.useCallback((isFocused)=>{
|
|
42412
|
+
state.current.isFocused = isFocused;
|
|
42413
|
+
setFocused(isFocused);
|
|
42414
|
+
updateState();
|
|
42415
|
+
}, [
|
|
42416
|
+
updateState
|
|
42417
|
+
]);
|
|
42418
|
+
$507fabe10e71c6fb$export$ec71b4b83ac08ec3((isFocusVisible)=>{
|
|
42419
|
+
state.current.isFocusVisible = isFocusVisible;
|
|
42420
|
+
updateState();
|
|
42421
|
+
}, [], {
|
|
42422
|
+
isTextInput: isTextInput
|
|
42423
|
+
});
|
|
42424
|
+
let { focusProps: focusProps } = $a1ea59d68270f0dd$export$f8168d8dd8fd66e6({
|
|
42425
|
+
isDisabled: within,
|
|
42426
|
+
onFocusChange: onFocusChange
|
|
42427
|
+
});
|
|
42428
|
+
let { focusWithinProps: focusWithinProps } = $9ab94262bd0047c7$export$420e68273165f4ec({
|
|
42429
|
+
isDisabled: !within,
|
|
42430
|
+
onFocusWithinChange: onFocusChange
|
|
42431
|
+
});
|
|
42432
|
+
return {
|
|
42433
|
+
isFocused: isFocused1,
|
|
42434
|
+
isFocusVisible: state.current.isFocused && isFocusVisibleState,
|
|
42435
|
+
focusProps: within ? focusWithinProps : focusProps
|
|
42436
|
+
};
|
|
42437
|
+
}
|
|
42438
|
+
|
|
42439
|
+
/*
|
|
42440
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
42441
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
42442
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
42443
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
42444
|
+
*
|
|
42445
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
42446
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
42447
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
42448
|
+
* governing permissions and limitations under the License.
|
|
42449
|
+
*/ // https://en.wikipedia.org/wiki/Right-to-left
|
|
42450
|
+
const $148a7a147e38ea7f$var$RTL_SCRIPTS = new Set([
|
|
42451
|
+
'Arab',
|
|
42452
|
+
'Syrc',
|
|
42453
|
+
'Samr',
|
|
42454
|
+
'Mand',
|
|
42455
|
+
'Thaa',
|
|
42456
|
+
'Mend',
|
|
42457
|
+
'Nkoo',
|
|
42458
|
+
'Adlm',
|
|
42459
|
+
'Rohg',
|
|
42460
|
+
'Hebr'
|
|
42461
|
+
]);
|
|
42462
|
+
const $148a7a147e38ea7f$var$RTL_LANGS = new Set([
|
|
42463
|
+
'ae',
|
|
42464
|
+
'ar',
|
|
42465
|
+
'arc',
|
|
42466
|
+
'bcc',
|
|
42467
|
+
'bqi',
|
|
42468
|
+
'ckb',
|
|
42469
|
+
'dv',
|
|
42470
|
+
'fa',
|
|
42471
|
+
'glk',
|
|
42472
|
+
'he',
|
|
42473
|
+
'ku',
|
|
42474
|
+
'mzn',
|
|
42475
|
+
'nqo',
|
|
42476
|
+
'pnb',
|
|
42477
|
+
'ps',
|
|
42478
|
+
'sd',
|
|
42479
|
+
'ug',
|
|
42480
|
+
'ur',
|
|
42481
|
+
'yi'
|
|
42482
|
+
]);
|
|
42483
|
+
function $148a7a147e38ea7f$export$702d680b21cbd764(locale) {
|
|
42484
|
+
// If the Intl.Locale API is available, use it to get the script for the locale.
|
|
42485
|
+
// This is more accurate than guessing by language, since languages can be written in multiple scripts.
|
|
42486
|
+
// @ts-ignore
|
|
42487
|
+
if (Intl.Locale) {
|
|
42488
|
+
// @ts-ignore
|
|
42489
|
+
let script = new Intl.Locale(locale).maximize().script;
|
|
42490
|
+
return $148a7a147e38ea7f$var$RTL_SCRIPTS.has(script);
|
|
42491
|
+
}
|
|
42492
|
+
// If not, just guess by the language (first part of the locale)
|
|
42493
|
+
let lang = locale.split('-')[0];
|
|
42494
|
+
return $148a7a147e38ea7f$var$RTL_LANGS.has(lang);
|
|
42495
|
+
}
|
|
42496
|
+
|
|
42497
|
+
|
|
42498
|
+
|
|
42499
|
+
|
|
42500
|
+
|
|
42501
|
+
function $1e5a04cdaf7d1af8$export$f09106e7c6677ec5() {
|
|
42502
|
+
// @ts-ignore
|
|
42503
|
+
let locale = typeof navigator !== 'undefined' && (navigator.language || navigator.userLanguage) || 'en-US';
|
|
42504
|
+
try {
|
|
42505
|
+
// @ts-ignore
|
|
42506
|
+
Intl.DateTimeFormat.supportedLocalesOf([
|
|
42507
|
+
locale
|
|
42508
|
+
]);
|
|
42509
|
+
} catch (_err) {
|
|
42510
|
+
locale = 'en-US';
|
|
42511
|
+
}
|
|
42512
|
+
return {
|
|
42513
|
+
locale: locale,
|
|
42514
|
+
direction: $148a7a147e38ea7f$export$702d680b21cbd764(locale) ? 'rtl' : 'ltr'
|
|
42515
|
+
};
|
|
42516
|
+
}
|
|
42517
|
+
let $1e5a04cdaf7d1af8$var$currentLocale = $1e5a04cdaf7d1af8$export$f09106e7c6677ec5();
|
|
42518
|
+
let $1e5a04cdaf7d1af8$var$listeners = new Set();
|
|
42519
|
+
function $1e5a04cdaf7d1af8$var$updateLocale() {
|
|
42520
|
+
$1e5a04cdaf7d1af8$var$currentLocale = $1e5a04cdaf7d1af8$export$f09106e7c6677ec5();
|
|
42521
|
+
for (let listener of $1e5a04cdaf7d1af8$var$listeners)listener($1e5a04cdaf7d1af8$var$currentLocale);
|
|
42522
|
+
}
|
|
42523
|
+
function $1e5a04cdaf7d1af8$export$188ec29ebc2bdc3a() {
|
|
42524
|
+
let isSSR = $704cf1d3b684cc5c$export$535bd6ca7f90a273();
|
|
42525
|
+
let [defaultLocale, setDefaultLocale] = React.useState($1e5a04cdaf7d1af8$var$currentLocale);
|
|
42526
|
+
React.useEffect(()=>{
|
|
42527
|
+
if ($1e5a04cdaf7d1af8$var$listeners.size === 0) window.addEventListener('languagechange', $1e5a04cdaf7d1af8$var$updateLocale);
|
|
42528
|
+
$1e5a04cdaf7d1af8$var$listeners.add(setDefaultLocale);
|
|
42529
|
+
return ()=>{
|
|
42530
|
+
$1e5a04cdaf7d1af8$var$listeners.delete(setDefaultLocale);
|
|
42531
|
+
if ($1e5a04cdaf7d1af8$var$listeners.size === 0) window.removeEventListener('languagechange', $1e5a04cdaf7d1af8$var$updateLocale);
|
|
42532
|
+
};
|
|
42533
|
+
}, []);
|
|
42534
|
+
// We cannot determine the browser's language on the server, so default to
|
|
42535
|
+
// en-US. This will be updated after hydration on the client to the correct value.
|
|
42536
|
+
if (isSSR) return {
|
|
42537
|
+
locale: 'en-US',
|
|
42538
|
+
direction: 'ltr'
|
|
42539
|
+
};
|
|
42540
|
+
return defaultLocale;
|
|
42541
|
+
}
|
|
42542
|
+
|
|
42543
|
+
|
|
42544
|
+
|
|
42545
|
+
const $18f2051aff69b9bf$var$I18nContext = /*#__PURE__*/ React__default["default"].createContext(null);
|
|
42546
|
+
function $18f2051aff69b9bf$export$43bb16f9c6d9e3f7() {
|
|
42547
|
+
let defaultLocale = $1e5a04cdaf7d1af8$export$188ec29ebc2bdc3a();
|
|
42548
|
+
let context = React.useContext($18f2051aff69b9bf$var$I18nContext);
|
|
42549
|
+
return context || defaultLocale;
|
|
42550
|
+
}
|
|
42551
|
+
|
|
42552
|
+
|
|
42553
|
+
|
|
42554
|
+
let $325a3faab7a68acd$var$cache = new Map();
|
|
42555
|
+
function $325a3faab7a68acd$export$a16aca283550c30d(options) {
|
|
42556
|
+
let { locale: locale } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7();
|
|
42557
|
+
let cacheKey = locale + (options ? Object.entries(options).sort((a, b)=>a[0] < b[0] ? -1 : 1
|
|
42558
|
+
).join() : '');
|
|
42559
|
+
if ($325a3faab7a68acd$var$cache.has(cacheKey)) return $325a3faab7a68acd$var$cache.get(cacheKey);
|
|
42560
|
+
let formatter = new Intl.Collator(locale, options);
|
|
42561
|
+
$325a3faab7a68acd$var$cache.set(cacheKey, formatter);
|
|
42562
|
+
return formatter;
|
|
42563
|
+
}
|
|
42564
|
+
|
|
42565
|
+
function $feb5ffebff200149$export$d3e3bd3e26688c04(e) {
|
|
42566
|
+
// Ctrl + Arrow Up/Arrow Down has a system wide meaning on macOS, so use Alt instead.
|
|
42567
|
+
// On Windows and Ubuntu, Alt + Space has a system wide meaning.
|
|
42568
|
+
return $c87311424ea30a05$export$e1865c3bedcd822b() ? e.altKey : e.ctrlKey;
|
|
42569
|
+
}
|
|
42570
|
+
function $feb5ffebff200149$export$16792effe837dba3(e) {
|
|
42571
|
+
if ($c87311424ea30a05$export$9ac100e40613ea10()) return e.metaKey;
|
|
42572
|
+
return e.ctrlKey;
|
|
42573
|
+
}
|
|
42574
|
+
|
|
42575
|
+
|
|
42576
|
+
|
|
42577
|
+
|
|
42578
|
+
function $fb3050f43d946246$export$e32c88dfddc6e1d8(options) {
|
|
42579
|
+
let { keyboardDelegate: keyboardDelegate , selectionManager: selectionManager , onTypeSelect: onTypeSelect } = options;
|
|
42580
|
+
let state = React.useRef({
|
|
42581
|
+
search: '',
|
|
42582
|
+
timeout: null
|
|
42583
|
+
}).current;
|
|
42584
|
+
let onKeyDown = (e)=>{
|
|
42585
|
+
let character = $fb3050f43d946246$var$getStringForKey(e.key);
|
|
42586
|
+
if (!character || e.ctrlKey || e.metaKey) return;
|
|
42587
|
+
// Do not propagate the Spacebar event if it's meant to be part of the search.
|
|
42588
|
+
// When we time out, the search term becomes empty, hence the check on length.
|
|
42589
|
+
// Trimming is to account for the case of pressing the Spacebar more than once,
|
|
42590
|
+
// which should cycle through the selection/deselection of the focused item.
|
|
42591
|
+
if (character === ' ' && state.search.trim().length > 0) {
|
|
42592
|
+
e.preventDefault();
|
|
42593
|
+
if (!('continuePropagation' in e)) e.stopPropagation();
|
|
42594
|
+
}
|
|
42595
|
+
state.search += character;
|
|
42596
|
+
// Use the delegate to find a key to focus.
|
|
42597
|
+
// Prioritize items after the currently focused item, falling back to searching the whole list.
|
|
42598
|
+
let key = keyboardDelegate.getKeyForSearch(state.search, selectionManager.focusedKey);
|
|
42599
|
+
// If no key found, search from the top.
|
|
42600
|
+
if (key == null) key = keyboardDelegate.getKeyForSearch(state.search);
|
|
42601
|
+
if (key != null) {
|
|
42602
|
+
selectionManager.setFocusedKey(key);
|
|
42603
|
+
if (onTypeSelect) onTypeSelect(key);
|
|
42604
|
+
}
|
|
42605
|
+
clearTimeout(state.timeout);
|
|
42606
|
+
state.timeout = setTimeout(()=>{
|
|
42607
|
+
state.search = '';
|
|
42608
|
+
}, 500);
|
|
42609
|
+
};
|
|
42610
|
+
return {
|
|
42611
|
+
typeSelectProps: {
|
|
42612
|
+
// Using a capturing listener to catch the keydown event before
|
|
42613
|
+
// other hooks in order to handle the Spacebar event.
|
|
42614
|
+
onKeyDownCapture: keyboardDelegate.getKeyForSearch ? onKeyDown : null
|
|
42615
|
+
}
|
|
42616
|
+
};
|
|
42617
|
+
}
|
|
42618
|
+
function $fb3050f43d946246$var$getStringForKey(key) {
|
|
42619
|
+
// If the key is of length 1, it is an ASCII value.
|
|
42620
|
+
// Otherwise, if there are no ASCII characters in the key name,
|
|
42621
|
+
// it is a Unicode character.
|
|
42622
|
+
// See https://www.w3.org/TR/uievents-key/
|
|
42623
|
+
if (key.length === 1 || !/^[A-Z]/i.test(key)) return key;
|
|
42624
|
+
return '';
|
|
42625
|
+
}
|
|
42626
|
+
|
|
42627
|
+
|
|
42628
|
+
function $ae20dd8cbca75726$export$d6daf82dcd84e87c(options) {
|
|
42629
|
+
let { selectionManager: manager , keyboardDelegate: delegate , ref: ref , autoFocus: autoFocus = false , shouldFocusWrap: shouldFocusWrap = false , disallowEmptySelection: disallowEmptySelection = false , disallowSelectAll: disallowSelectAll = false , selectOnFocus: selectOnFocus = manager.selectionBehavior === 'replace' , disallowTypeAhead: disallowTypeAhead = false , shouldUseVirtualFocus: shouldUseVirtualFocus , allowsTabNavigation: allowsTabNavigation = false , isVirtualized: isVirtualized , scrollRef: // If no scrollRef is provided, assume the collection ref is the scrollable region
|
|
42630
|
+
scrollRef = ref } = options;
|
|
42631
|
+
let { direction: direction } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7();
|
|
42632
|
+
let onKeyDown = (e)=>{
|
|
42633
|
+
// Prevent option + tab from doing anything since it doesn't move focus to the cells, only buttons/checkboxes
|
|
42634
|
+
if (e.altKey && e.key === 'Tab') e.preventDefault();
|
|
42635
|
+
// Keyboard events bubble through portals. Don't handle keyboard events
|
|
42636
|
+
// for elements outside the collection (e.g. menus).
|
|
42637
|
+
if (!ref.current.contains(e.target)) return;
|
|
42638
|
+
const navigateToKey = (key, childFocus)=>{
|
|
42639
|
+
if (key != null) {
|
|
42640
|
+
manager.setFocusedKey(key, childFocus);
|
|
42641
|
+
if (e.shiftKey && manager.selectionMode === 'multiple') manager.extendSelection(key);
|
|
42642
|
+
else if (selectOnFocus && !$feb5ffebff200149$export$d3e3bd3e26688c04(e)) manager.replaceSelection(key);
|
|
42643
|
+
}
|
|
42644
|
+
};
|
|
42645
|
+
switch(e.key){
|
|
42646
|
+
case 'ArrowDown':
|
|
42647
|
+
if (delegate.getKeyBelow) {
|
|
42648
|
+
var ref4, ref1;
|
|
42649
|
+
e.preventDefault();
|
|
42650
|
+
let nextKey = manager.focusedKey != null ? delegate.getKeyBelow(manager.focusedKey) : (ref4 = delegate.getFirstKey) === null || ref4 === void 0 ? void 0 : ref4.call(delegate);
|
|
42651
|
+
if (nextKey == null && shouldFocusWrap) nextKey = (ref1 = delegate.getFirstKey) === null || ref1 === void 0 ? void 0 : ref1.call(delegate, manager.focusedKey);
|
|
42652
|
+
navigateToKey(nextKey);
|
|
42653
|
+
}
|
|
42654
|
+
break;
|
|
42655
|
+
case 'ArrowUp':
|
|
42656
|
+
if (delegate.getKeyAbove) {
|
|
42657
|
+
var ref2, ref3;
|
|
42658
|
+
e.preventDefault();
|
|
42659
|
+
let nextKey = manager.focusedKey != null ? delegate.getKeyAbove(manager.focusedKey) : (ref2 = delegate.getLastKey) === null || ref2 === void 0 ? void 0 : ref2.call(delegate);
|
|
42660
|
+
if (nextKey == null && shouldFocusWrap) nextKey = (ref3 = delegate.getLastKey) === null || ref3 === void 0 ? void 0 : ref3.call(delegate, manager.focusedKey);
|
|
42661
|
+
navigateToKey(nextKey);
|
|
42662
|
+
}
|
|
42663
|
+
break;
|
|
42664
|
+
case 'ArrowLeft':
|
|
42665
|
+
if (delegate.getKeyLeftOf) {
|
|
42666
|
+
e.preventDefault();
|
|
42667
|
+
let nextKey = delegate.getKeyLeftOf(manager.focusedKey);
|
|
42668
|
+
navigateToKey(nextKey, direction === 'rtl' ? 'first' : 'last');
|
|
42669
|
+
}
|
|
42670
|
+
break;
|
|
42671
|
+
case 'ArrowRight':
|
|
42672
|
+
if (delegate.getKeyRightOf) {
|
|
42673
|
+
e.preventDefault();
|
|
42674
|
+
let nextKey = delegate.getKeyRightOf(manager.focusedKey);
|
|
42675
|
+
navigateToKey(nextKey, direction === 'rtl' ? 'last' : 'first');
|
|
42676
|
+
}
|
|
42677
|
+
break;
|
|
42678
|
+
case 'Home':
|
|
42679
|
+
if (delegate.getFirstKey) {
|
|
42680
|
+
e.preventDefault();
|
|
42681
|
+
let firstKey = delegate.getFirstKey(manager.focusedKey, $feb5ffebff200149$export$16792effe837dba3(e));
|
|
42682
|
+
manager.setFocusedKey(firstKey);
|
|
42683
|
+
if ($feb5ffebff200149$export$16792effe837dba3(e) && e.shiftKey && manager.selectionMode === 'multiple') manager.extendSelection(firstKey);
|
|
42684
|
+
else if (selectOnFocus) manager.replaceSelection(firstKey);
|
|
42685
|
+
}
|
|
42686
|
+
break;
|
|
42687
|
+
case 'End':
|
|
42688
|
+
if (delegate.getLastKey) {
|
|
42689
|
+
e.preventDefault();
|
|
42690
|
+
let lastKey = delegate.getLastKey(manager.focusedKey, $feb5ffebff200149$export$16792effe837dba3(e));
|
|
42691
|
+
manager.setFocusedKey(lastKey);
|
|
42692
|
+
if ($feb5ffebff200149$export$16792effe837dba3(e) && e.shiftKey && manager.selectionMode === 'multiple') manager.extendSelection(lastKey);
|
|
42693
|
+
else if (selectOnFocus) manager.replaceSelection(lastKey);
|
|
42694
|
+
}
|
|
42695
|
+
break;
|
|
42696
|
+
case 'PageDown':
|
|
42697
|
+
if (delegate.getKeyPageBelow) {
|
|
42698
|
+
e.preventDefault();
|
|
42699
|
+
let nextKey = delegate.getKeyPageBelow(manager.focusedKey);
|
|
42700
|
+
navigateToKey(nextKey);
|
|
42701
|
+
}
|
|
42702
|
+
break;
|
|
42703
|
+
case 'PageUp':
|
|
42704
|
+
if (delegate.getKeyPageAbove) {
|
|
42705
|
+
e.preventDefault();
|
|
42706
|
+
let nextKey = delegate.getKeyPageAbove(manager.focusedKey);
|
|
42707
|
+
navigateToKey(nextKey);
|
|
42708
|
+
}
|
|
42709
|
+
break;
|
|
42710
|
+
case 'a':
|
|
42711
|
+
if ($feb5ffebff200149$export$16792effe837dba3(e) && manager.selectionMode === 'multiple' && disallowSelectAll !== true) {
|
|
42712
|
+
e.preventDefault();
|
|
42713
|
+
manager.selectAll();
|
|
42714
|
+
}
|
|
42715
|
+
break;
|
|
42716
|
+
case 'Escape':
|
|
42717
|
+
e.preventDefault();
|
|
42718
|
+
if (!disallowEmptySelection) manager.clearSelection();
|
|
42719
|
+
break;
|
|
42720
|
+
case 'Tab':
|
|
42721
|
+
if (!allowsTabNavigation) {
|
|
42722
|
+
// There may be elements that are "tabbable" inside a collection (e.g. in a grid cell).
|
|
42723
|
+
// However, collections should be treated as a single tab stop, with arrow key navigation internally.
|
|
42724
|
+
// We don't control the rendering of these, so we can't override the tabIndex to prevent tabbing.
|
|
42725
|
+
// Instead, we handle the Tab key, and move focus manually to the first/last tabbable element
|
|
42726
|
+
// in the collection, so that the browser default behavior will apply starting from that element
|
|
42727
|
+
// rather than the currently focused one.
|
|
42728
|
+
if (e.shiftKey) ref.current.focus();
|
|
42729
|
+
else {
|
|
42730
|
+
let walker = $9bf71ea28793e738$export$2d6ec8fc375ceafa(ref.current, {
|
|
42731
|
+
tabbable: true
|
|
42732
|
+
});
|
|
42733
|
+
let next;
|
|
42734
|
+
let last;
|
|
42735
|
+
do {
|
|
42736
|
+
last = walker.lastChild();
|
|
42737
|
+
if (last) next = last;
|
|
42738
|
+
}while (last)
|
|
42739
|
+
if (next && !next.contains(document.activeElement)) $7215afc6de606d6b$export$de79e2c695e052f3(next);
|
|
42740
|
+
}
|
|
42741
|
+
break;
|
|
42742
|
+
}
|
|
42743
|
+
}
|
|
42744
|
+
};
|
|
42745
|
+
// Store the scroll position so we can restore it later.
|
|
42746
|
+
let scrollPos = React.useRef({
|
|
42747
|
+
top: 0,
|
|
42748
|
+
left: 0
|
|
42749
|
+
});
|
|
42750
|
+
$e9faafb641e167db$export$90fc3a17d93f704c(scrollRef, 'scroll', isVirtualized ? null : ()=>{
|
|
42751
|
+
scrollPos.current = {
|
|
42752
|
+
top: scrollRef.current.scrollTop,
|
|
42753
|
+
left: scrollRef.current.scrollLeft
|
|
42754
|
+
};
|
|
42755
|
+
});
|
|
42756
|
+
let onFocus = (e)=>{
|
|
42757
|
+
if (manager.isFocused) {
|
|
42758
|
+
// If a focus event bubbled through a portal, reset focus state.
|
|
42759
|
+
if (!e.currentTarget.contains(e.target)) manager.setFocused(false);
|
|
42760
|
+
return;
|
|
42761
|
+
}
|
|
42762
|
+
// Focus events can bubble through portals. Ignore these events.
|
|
42763
|
+
if (!e.currentTarget.contains(e.target)) return;
|
|
42764
|
+
manager.setFocused(true);
|
|
42765
|
+
if (manager.focusedKey == null) {
|
|
42766
|
+
let navigateToFirstKey = (key)=>{
|
|
42767
|
+
if (key != null) {
|
|
42768
|
+
manager.setFocusedKey(key);
|
|
42769
|
+
if (selectOnFocus) manager.replaceSelection(key);
|
|
42770
|
+
}
|
|
42771
|
+
};
|
|
42772
|
+
// If the user hasn't yet interacted with the collection, there will be no focusedKey set.
|
|
42773
|
+
// Attempt to detect whether the user is tabbing forward or backward into the collection
|
|
42774
|
+
// and either focus the first or last item accordingly.
|
|
42775
|
+
let relatedTarget = e.relatedTarget;
|
|
42776
|
+
var _lastSelectedKey, _firstSelectedKey;
|
|
42777
|
+
if (relatedTarget && e.currentTarget.compareDocumentPosition(relatedTarget) & Node.DOCUMENT_POSITION_FOLLOWING) navigateToFirstKey((_lastSelectedKey = manager.lastSelectedKey) !== null && _lastSelectedKey !== void 0 ? _lastSelectedKey : delegate.getLastKey());
|
|
42778
|
+
else navigateToFirstKey((_firstSelectedKey = manager.firstSelectedKey) !== null && _firstSelectedKey !== void 0 ? _firstSelectedKey : delegate.getFirstKey());
|
|
42779
|
+
} else if (!isVirtualized) {
|
|
42780
|
+
// Restore the scroll position to what it was before.
|
|
42781
|
+
scrollRef.current.scrollTop = scrollPos.current.top;
|
|
42782
|
+
scrollRef.current.scrollLeft = scrollPos.current.left;
|
|
42783
|
+
// Refocus and scroll the focused item into view if it exists within the scrollable region.
|
|
42784
|
+
let element = scrollRef.current.querySelector(`[data-key="${manager.focusedKey}"]`);
|
|
42785
|
+
if (element) {
|
|
42786
|
+
// This prevents a flash of focus on the first/last element in the collection
|
|
42787
|
+
$7215afc6de606d6b$export$de79e2c695e052f3(element);
|
|
42788
|
+
$2f04cbc44ee30ce0$export$53a0910f038337bd(scrollRef.current, element);
|
|
42789
|
+
}
|
|
42790
|
+
}
|
|
42791
|
+
};
|
|
42792
|
+
let onBlur = (e)=>{
|
|
42793
|
+
// Don't set blurred and then focused again if moving focus within the collection.
|
|
42794
|
+
if (!e.currentTarget.contains(e.relatedTarget)) manager.setFocused(false);
|
|
42795
|
+
};
|
|
42796
|
+
const autoFocusRef = React.useRef(autoFocus);
|
|
42797
|
+
React.useEffect(()=>{
|
|
42798
|
+
if (autoFocusRef.current) {
|
|
42799
|
+
let focusedKey = null;
|
|
42800
|
+
// Check focus strategy to determine which item to focus
|
|
42801
|
+
if (autoFocus === 'first') focusedKey = delegate.getFirstKey();
|
|
42802
|
+
if (autoFocus === 'last') focusedKey = delegate.getLastKey();
|
|
42803
|
+
// If there are any selected keys, make the first one the new focus target
|
|
42804
|
+
let selectedKeys = manager.selectedKeys;
|
|
42805
|
+
if (selectedKeys.size) focusedKey = selectedKeys.values().next().value;
|
|
42806
|
+
manager.setFocused(true);
|
|
42807
|
+
manager.setFocusedKey(focusedKey);
|
|
42808
|
+
// If no default focus key is selected, focus the collection itself.
|
|
42809
|
+
if (focusedKey == null && !shouldUseVirtualFocus) $6a99195332edec8b$export$80f3e147d781571c(ref.current);
|
|
42810
|
+
}
|
|
42811
|
+
autoFocusRef.current = false;
|
|
42812
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
42813
|
+
}, []);
|
|
42814
|
+
// If not virtualized, scroll the focused element into view when the focusedKey changes.
|
|
42815
|
+
// When virtualized, Virtualizer handles this internally.
|
|
42816
|
+
React.useEffect(()=>{
|
|
42817
|
+
if (!isVirtualized && manager.focusedKey && (scrollRef === null || scrollRef === void 0 ? void 0 : scrollRef.current)) {
|
|
42818
|
+
let element = scrollRef.current.querySelector(`[data-key="${manager.focusedKey}"]`);
|
|
42819
|
+
if (element) $2f04cbc44ee30ce0$export$53a0910f038337bd(scrollRef.current, element);
|
|
42820
|
+
}
|
|
42821
|
+
}, [
|
|
42822
|
+
isVirtualized,
|
|
42823
|
+
scrollRef,
|
|
42824
|
+
manager.focusedKey
|
|
42825
|
+
]);
|
|
42826
|
+
let handlers = {
|
|
42827
|
+
onKeyDown: onKeyDown,
|
|
42828
|
+
onFocus: onFocus,
|
|
42829
|
+
onBlur: onBlur,
|
|
42830
|
+
onMouseDown (e) {
|
|
42831
|
+
// Ignore events that bubbled through portals.
|
|
42832
|
+
if (e.currentTarget.contains(e.target)) // Prevent focus going to the collection when clicking on the scrollbar.
|
|
42833
|
+
e.preventDefault();
|
|
42834
|
+
}
|
|
42835
|
+
};
|
|
42836
|
+
let { typeSelectProps: typeSelectProps } = $fb3050f43d946246$export$e32c88dfddc6e1d8({
|
|
42837
|
+
keyboardDelegate: delegate,
|
|
42838
|
+
selectionManager: manager
|
|
42839
|
+
});
|
|
42840
|
+
if (!disallowTypeAhead) handlers = $3ef42575df84b30b$export$9d1611c77c2fe928(typeSelectProps, handlers);
|
|
42841
|
+
// If nothing is focused within the collection, make the collection itself tabbable.
|
|
42842
|
+
// This will be marshalled to either the first or last item depending on where focus came from.
|
|
42843
|
+
// If using virtual focus, don't set a tabIndex at all so that VoiceOver on iOS 14 doesn't try
|
|
42844
|
+
// to move real DOM focus to the element anyway.
|
|
42845
|
+
let tabIndex;
|
|
42846
|
+
if (!shouldUseVirtualFocus) tabIndex = manager.focusedKey == null ? 0 : -1;
|
|
42847
|
+
return {
|
|
42848
|
+
collectionProps: {
|
|
42849
|
+
...handlers,
|
|
42850
|
+
tabIndex: tabIndex
|
|
42851
|
+
}
|
|
42852
|
+
};
|
|
42853
|
+
}
|
|
42854
|
+
|
|
42855
|
+
|
|
42856
|
+
|
|
42857
|
+
|
|
42858
|
+
|
|
42859
|
+
|
|
42860
|
+
|
|
42861
|
+
function $880e95eb8b93ba9a$export$ecf600387e221c37(options) {
|
|
42862
|
+
let { selectionManager: manager , key: key , ref: ref , shouldSelectOnPressUp: shouldSelectOnPressUp , isVirtualized: isVirtualized , shouldUseVirtualFocus: shouldUseVirtualFocus , focus: focus , isDisabled: isDisabled , onAction: onAction , allowsDifferentPressOrigin: allowsDifferentPressOrigin } = options;
|
|
42863
|
+
let onSelect = (e)=>{
|
|
42864
|
+
if (e.pointerType === 'keyboard' && $feb5ffebff200149$export$d3e3bd3e26688c04(e)) manager.toggleSelection(key);
|
|
42865
|
+
else {
|
|
42866
|
+
if (manager.selectionMode === 'none') return;
|
|
42867
|
+
if (manager.selectionMode === 'single') {
|
|
42868
|
+
if (manager.isSelected(key) && !manager.disallowEmptySelection) manager.toggleSelection(key);
|
|
42869
|
+
else manager.replaceSelection(key);
|
|
42870
|
+
} else if (e && e.shiftKey) manager.extendSelection(key);
|
|
42871
|
+
else if (manager.selectionBehavior === 'toggle' || e && ($feb5ffebff200149$export$16792effe837dba3(e) || e.pointerType === 'touch' || e.pointerType === 'virtual')) // if touch or virtual (VO) then we just want to toggle, otherwise it's impossible to multi select because they don't have modifier keys
|
|
42872
|
+
manager.toggleSelection(key);
|
|
42873
|
+
else manager.replaceSelection(key);
|
|
42874
|
+
}
|
|
42875
|
+
};
|
|
42876
|
+
// Focus the associated DOM node when this item becomes the focusedKey
|
|
42877
|
+
React.useEffect(()=>{
|
|
42878
|
+
let isFocused = key === manager.focusedKey;
|
|
42879
|
+
if (isFocused && manager.isFocused && !shouldUseVirtualFocus && document.activeElement !== ref.current) {
|
|
42880
|
+
if (focus) focus();
|
|
42881
|
+
else $6a99195332edec8b$export$80f3e147d781571c(ref.current);
|
|
42882
|
+
}
|
|
42883
|
+
}, [
|
|
42884
|
+
ref,
|
|
42885
|
+
key,
|
|
42886
|
+
manager.focusedKey,
|
|
42887
|
+
manager.childFocusStrategy,
|
|
42888
|
+
manager.isFocused,
|
|
42889
|
+
shouldUseVirtualFocus
|
|
42890
|
+
]);
|
|
42891
|
+
// Set tabIndex to 0 if the element is focused, or -1 otherwise so that only the last focused
|
|
42892
|
+
// item is tabbable. If using virtual focus, don't set a tabIndex at all so that VoiceOver
|
|
42893
|
+
// on iOS 14 doesn't try to move real DOM focus to the item anyway.
|
|
42894
|
+
let itemProps = {
|
|
42895
|
+
};
|
|
42896
|
+
if (!shouldUseVirtualFocus) itemProps = {
|
|
42897
|
+
tabIndex: key === manager.focusedKey ? 0 : -1,
|
|
42898
|
+
onFocus (e) {
|
|
42899
|
+
if (e.target === ref.current) manager.setFocusedKey(key);
|
|
42900
|
+
}
|
|
42901
|
+
};
|
|
42902
|
+
// With checkbox selection, onAction (i.e. navigation) becomes primary, and occurs on a single click of the row.
|
|
42903
|
+
// Clicking the checkbox enters selection mode, after which clicking anywhere on any row toggles selection for that row.
|
|
42904
|
+
// With highlight selection, onAction is secondary, and occurs on double click. Single click selects the row.
|
|
42905
|
+
// With touch, onAction occurs on single tap, and long press enters selection mode.
|
|
42906
|
+
isDisabled = isDisabled || manager.isDisabled(key);
|
|
42907
|
+
let allowsSelection = !isDisabled && manager.canSelectItem(key);
|
|
42908
|
+
let allowsActions = onAction && !isDisabled;
|
|
42909
|
+
let hasPrimaryAction = allowsActions && (manager.selectionBehavior === 'replace' ? !allowsSelection : manager.isEmpty);
|
|
42910
|
+
let hasSecondaryAction = allowsActions && allowsSelection && manager.selectionBehavior === 'replace';
|
|
42911
|
+
let hasAction = hasPrimaryAction || hasSecondaryAction;
|
|
42912
|
+
let modality = React.useRef(null);
|
|
42913
|
+
let longPressEnabled = hasAction && allowsSelection;
|
|
42914
|
+
let longPressEnabledOnPressStart = React.useRef(false);
|
|
42915
|
+
let hadPrimaryActionOnPressStart = React.useRef(false);
|
|
42916
|
+
// By default, selection occurs on pointer down. This can be strange if selecting an
|
|
42917
|
+
// item causes the UI to disappear immediately (e.g. menus).
|
|
42918
|
+
// If shouldSelectOnPressUp is true, we use onPressUp instead of onPressStart.
|
|
42919
|
+
// onPress requires a pointer down event on the same element as pointer up. For menus,
|
|
42920
|
+
// we want to be able to have the pointer down on the trigger that opens the menu and
|
|
42921
|
+
// the pointer up on the menu item rather than requiring a separate press.
|
|
42922
|
+
// For keyboard events, selection still occurs on key down.
|
|
42923
|
+
let itemPressProps = {
|
|
42924
|
+
};
|
|
42925
|
+
if (shouldSelectOnPressUp) {
|
|
42926
|
+
itemPressProps.onPressStart = (e)=>{
|
|
42927
|
+
modality.current = e.pointerType;
|
|
42928
|
+
longPressEnabledOnPressStart.current = longPressEnabled;
|
|
42929
|
+
if (e.pointerType === 'keyboard' && (!hasAction || $880e95eb8b93ba9a$var$isSelectionKey())) onSelect(e);
|
|
42930
|
+
};
|
|
42931
|
+
// If allowsDifferentPressOrigin, make selection happen on pressUp (e.g. open menu on press down, selection on menu item happens on press up.)
|
|
42932
|
+
// Otherwise, have selection happen onPress (prevents listview row selection when clicking on interactable elements in the row)
|
|
42933
|
+
if (!allowsDifferentPressOrigin) itemPressProps.onPress = (e)=>{
|
|
42934
|
+
if (hasPrimaryAction || hasSecondaryAction && e.pointerType !== 'mouse') {
|
|
42935
|
+
if (e.pointerType === 'keyboard' && !$880e95eb8b93ba9a$var$isActionKey()) return;
|
|
42936
|
+
onAction();
|
|
42937
|
+
} else if (e.pointerType !== 'keyboard') onSelect(e);
|
|
42938
|
+
};
|
|
42939
|
+
else {
|
|
42940
|
+
itemPressProps.onPressUp = (e)=>{
|
|
42941
|
+
if (e.pointerType !== 'keyboard') onSelect(e);
|
|
42942
|
+
};
|
|
42943
|
+
itemPressProps.onPress = hasPrimaryAction ? ()=>onAction()
|
|
42944
|
+
: null;
|
|
42945
|
+
}
|
|
42946
|
+
} else {
|
|
42947
|
+
itemPressProps.onPressStart = (e)=>{
|
|
42948
|
+
modality.current = e.pointerType;
|
|
42949
|
+
longPressEnabledOnPressStart.current = longPressEnabled;
|
|
42950
|
+
hadPrimaryActionOnPressStart.current = hasPrimaryAction;
|
|
42951
|
+
// Select on mouse down unless there is a primary action which will occur on mouse up.
|
|
42952
|
+
// For keyboard, select on key down. If there is an action, the Space key selects on key down,
|
|
42953
|
+
// and the Enter key performs onAction on key up.
|
|
42954
|
+
if (e.pointerType === 'mouse' && !hasPrimaryAction || e.pointerType === 'keyboard' && (!onAction || $880e95eb8b93ba9a$var$isSelectionKey())) onSelect(e);
|
|
42955
|
+
};
|
|
42956
|
+
itemPressProps.onPress = (e)=>{
|
|
42957
|
+
// Selection occurs on touch up. Primary actions always occur on pointer up.
|
|
42958
|
+
// Both primary and secondary actions occur on Enter key up. The only exception
|
|
42959
|
+
// is secondary actions, which occur on double click with a mouse.
|
|
42960
|
+
if (e.pointerType === 'touch' || e.pointerType === 'pen' || e.pointerType === 'virtual' || e.pointerType === 'keyboard' && hasAction && $880e95eb8b93ba9a$var$isActionKey() || e.pointerType === 'mouse' && hadPrimaryActionOnPressStart.current) {
|
|
42961
|
+
if (hasAction) onAction();
|
|
42962
|
+
else onSelect(e);
|
|
42963
|
+
}
|
|
42964
|
+
};
|
|
42965
|
+
}
|
|
42966
|
+
if (!isVirtualized) itemProps['data-key'] = key;
|
|
42967
|
+
itemPressProps.preventFocusOnPress = shouldUseVirtualFocus;
|
|
42968
|
+
let { pressProps: pressProps , isPressed: isPressed } = $f6c31cce2adf654f$export$45712eceda6fad21(itemPressProps);
|
|
42969
|
+
// Double clicking with a mouse with selectionBehavior = 'replace' performs an action.
|
|
42970
|
+
let onDoubleClick = hasSecondaryAction ? (e)=>{
|
|
42971
|
+
if (modality.current === 'mouse') {
|
|
42972
|
+
e.stopPropagation();
|
|
42973
|
+
e.preventDefault();
|
|
42974
|
+
onAction();
|
|
42975
|
+
}
|
|
42976
|
+
} : undefined;
|
|
42977
|
+
// Long pressing an item with touch when selectionBehavior = 'replace' switches the selection behavior
|
|
42978
|
+
// to 'toggle'. This changes the single tap behavior from performing an action (i.e. navigating) to
|
|
42979
|
+
// selecting, and may toggle the appearance of a UI affordance like checkboxes on each item.
|
|
42980
|
+
let { longPressProps: longPressProps } = $8a26561d2877236e$export$c24ed0104d07eab9({
|
|
42981
|
+
isDisabled: !longPressEnabled,
|
|
42982
|
+
onLongPress (e) {
|
|
42983
|
+
if (e.pointerType === 'touch') {
|
|
42984
|
+
onSelect(e);
|
|
42985
|
+
manager.setSelectionBehavior('toggle');
|
|
42986
|
+
}
|
|
42987
|
+
}
|
|
42988
|
+
});
|
|
42989
|
+
// Prevent native drag and drop on long press if we also select on long press.
|
|
42990
|
+
// Once the user is in selection mode, they can long press again to drag.
|
|
42991
|
+
let onDragStart = (e)=>{
|
|
42992
|
+
if (modality.current === 'touch' && longPressEnabledOnPressStart.current) e.preventDefault();
|
|
42993
|
+
};
|
|
42994
|
+
return {
|
|
42995
|
+
itemProps: $3ef42575df84b30b$export$9d1611c77c2fe928(itemProps, allowsSelection || hasPrimaryAction ? pressProps : {
|
|
42996
|
+
}, longPressEnabled ? longPressProps : {
|
|
42997
|
+
}, {
|
|
42998
|
+
onDoubleClick: onDoubleClick,
|
|
42999
|
+
onDragStart: onDragStart
|
|
43000
|
+
}),
|
|
43001
|
+
isPressed: isPressed,
|
|
43002
|
+
isSelected: manager.isSelected(key),
|
|
43003
|
+
isDisabled: isDisabled,
|
|
43004
|
+
allowsSelection: allowsSelection,
|
|
43005
|
+
hasAction: hasAction
|
|
43006
|
+
};
|
|
43007
|
+
}
|
|
43008
|
+
function $880e95eb8b93ba9a$var$isActionKey() {
|
|
43009
|
+
let event = window.event;
|
|
43010
|
+
return (event === null || event === void 0 ? void 0 : event.key) === 'Enter';
|
|
43011
|
+
}
|
|
43012
|
+
function $880e95eb8b93ba9a$var$isSelectionKey() {
|
|
43013
|
+
let event = window.event;
|
|
43014
|
+
return (event === null || event === void 0 ? void 0 : event.key) === ' ' || (event === null || event === void 0 ? void 0 : event.code) === 'Space';
|
|
43015
|
+
}
|
|
43016
|
+
|
|
43017
|
+
|
|
43018
|
+
|
|
43019
|
+
class $2a25aae57d74318e$export$a05409b8bb224a5a {
|
|
43020
|
+
getKeyBelow(key) {
|
|
43021
|
+
key = this.collection.getKeyAfter(key);
|
|
43022
|
+
while(key != null){
|
|
43023
|
+
let item = this.collection.getItem(key);
|
|
43024
|
+
if (item.type === 'item' && !this.disabledKeys.has(key)) return key;
|
|
43025
|
+
key = this.collection.getKeyAfter(key);
|
|
43026
|
+
}
|
|
43027
|
+
}
|
|
43028
|
+
getKeyAbove(key) {
|
|
43029
|
+
key = this.collection.getKeyBefore(key);
|
|
43030
|
+
while(key != null){
|
|
43031
|
+
let item = this.collection.getItem(key);
|
|
43032
|
+
if (item.type === 'item' && !this.disabledKeys.has(key)) return key;
|
|
43033
|
+
key = this.collection.getKeyBefore(key);
|
|
43034
|
+
}
|
|
43035
|
+
}
|
|
43036
|
+
getFirstKey() {
|
|
43037
|
+
let key = this.collection.getFirstKey();
|
|
43038
|
+
while(key != null){
|
|
43039
|
+
let item = this.collection.getItem(key);
|
|
43040
|
+
if (item.type === 'item' && !this.disabledKeys.has(key)) return key;
|
|
43041
|
+
key = this.collection.getKeyAfter(key);
|
|
43042
|
+
}
|
|
43043
|
+
}
|
|
43044
|
+
getLastKey() {
|
|
43045
|
+
let key = this.collection.getLastKey();
|
|
43046
|
+
while(key != null){
|
|
43047
|
+
let item = this.collection.getItem(key);
|
|
43048
|
+
if (item.type === 'item' && !this.disabledKeys.has(key)) return key;
|
|
43049
|
+
key = this.collection.getKeyBefore(key);
|
|
43050
|
+
}
|
|
43051
|
+
}
|
|
43052
|
+
getItem(key) {
|
|
43053
|
+
return this.ref.current.querySelector(`[data-key="${key}"]`);
|
|
43054
|
+
}
|
|
43055
|
+
getKeyPageAbove(key) {
|
|
43056
|
+
let menu = this.ref.current;
|
|
43057
|
+
let item = this.getItem(key);
|
|
43058
|
+
if (!item) return null;
|
|
43059
|
+
let pageY = Math.max(0, item.offsetTop + item.offsetHeight - menu.offsetHeight);
|
|
43060
|
+
while(item && item.offsetTop > pageY){
|
|
43061
|
+
key = this.getKeyAbove(key);
|
|
43062
|
+
item = this.getItem(key);
|
|
43063
|
+
}
|
|
43064
|
+
return key;
|
|
43065
|
+
}
|
|
43066
|
+
getKeyPageBelow(key) {
|
|
43067
|
+
let menu = this.ref.current;
|
|
43068
|
+
let item = this.getItem(key);
|
|
43069
|
+
if (!item) return null;
|
|
43070
|
+
let pageY = Math.min(menu.scrollHeight, item.offsetTop - item.offsetHeight + menu.offsetHeight);
|
|
43071
|
+
while(item && item.offsetTop < pageY){
|
|
43072
|
+
key = this.getKeyBelow(key);
|
|
43073
|
+
item = this.getItem(key);
|
|
43074
|
+
}
|
|
43075
|
+
return key;
|
|
43076
|
+
}
|
|
43077
|
+
getKeyForSearch(search, fromKey) {
|
|
43078
|
+
if (!this.collator) return null;
|
|
43079
|
+
let collection = this.collection;
|
|
43080
|
+
let key = fromKey || this.getFirstKey();
|
|
43081
|
+
while(key != null){
|
|
43082
|
+
let item = collection.getItem(key);
|
|
43083
|
+
let substring = item.textValue.slice(0, search.length);
|
|
43084
|
+
if (item.textValue && this.collator.compare(substring, search) === 0) return key;
|
|
43085
|
+
key = this.getKeyBelow(key);
|
|
43086
|
+
}
|
|
43087
|
+
return null;
|
|
43088
|
+
}
|
|
43089
|
+
constructor(collection, disabledKeys, ref, collator){
|
|
43090
|
+
this.collection = collection;
|
|
43091
|
+
this.disabledKeys = disabledKeys;
|
|
43092
|
+
this.ref = ref;
|
|
43093
|
+
this.collator = collator;
|
|
43094
|
+
}
|
|
43095
|
+
}
|
|
43096
|
+
|
|
43097
|
+
|
|
43098
|
+
|
|
43099
|
+
|
|
43100
|
+
function $982254629710d113$export$b95089534ab7c1fd(props) {
|
|
43101
|
+
let { selectionManager: selectionManager , collection: collection , disabledKeys: disabledKeys , ref: ref , keyboardDelegate: keyboardDelegate , autoFocus: autoFocus , shouldFocusWrap: shouldFocusWrap , isVirtualized: isVirtualized , disallowEmptySelection: disallowEmptySelection , selectOnFocus: selectOnFocus = selectionManager.selectionBehavior === 'replace' , disallowTypeAhead: disallowTypeAhead , shouldUseVirtualFocus: shouldUseVirtualFocus , allowsTabNavigation: allowsTabNavigation } = props;
|
|
43102
|
+
// By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).
|
|
43103
|
+
// When virtualized, the layout object will be passed in as a prop and override this.
|
|
43104
|
+
let collator = $325a3faab7a68acd$export$a16aca283550c30d({
|
|
43105
|
+
usage: 'search',
|
|
43106
|
+
sensitivity: 'base'
|
|
43107
|
+
});
|
|
43108
|
+
let delegate = React.useMemo(()=>keyboardDelegate || new $2a25aae57d74318e$export$a05409b8bb224a5a(collection, disabledKeys, ref, collator)
|
|
43109
|
+
, [
|
|
43110
|
+
keyboardDelegate,
|
|
43111
|
+
collection,
|
|
43112
|
+
disabledKeys,
|
|
43113
|
+
ref,
|
|
43114
|
+
collator
|
|
43115
|
+
]);
|
|
43116
|
+
let { collectionProps: collectionProps } = $ae20dd8cbca75726$export$d6daf82dcd84e87c({
|
|
43117
|
+
ref: ref,
|
|
43118
|
+
selectionManager: selectionManager,
|
|
43119
|
+
keyboardDelegate: delegate,
|
|
43120
|
+
autoFocus: autoFocus,
|
|
43121
|
+
shouldFocusWrap: shouldFocusWrap,
|
|
43122
|
+
disallowEmptySelection: disallowEmptySelection,
|
|
43123
|
+
selectOnFocus: selectOnFocus,
|
|
43124
|
+
disallowTypeAhead: disallowTypeAhead,
|
|
43125
|
+
shouldUseVirtualFocus: shouldUseVirtualFocus,
|
|
43126
|
+
allowsTabNavigation: allowsTabNavigation,
|
|
43127
|
+
isVirtualized: isVirtualized,
|
|
43128
|
+
scrollRef: ref
|
|
43129
|
+
});
|
|
43130
|
+
return {
|
|
43131
|
+
listProps: collectionProps
|
|
43132
|
+
};
|
|
43133
|
+
}
|
|
43134
|
+
|
|
43135
|
+
const $b1f0cad8af73213b$export$3585ede4d035bf14 = new WeakMap();
|
|
43136
|
+
function $b1f0cad8af73213b$var$normalizeKey(key) {
|
|
43137
|
+
if (typeof key === 'string') return key.replace(/\s*/g, '');
|
|
43138
|
+
return '' + key;
|
|
43139
|
+
}
|
|
43140
|
+
function $b1f0cad8af73213b$export$9145995848b05025(state, itemKey) {
|
|
43141
|
+
let data = $b1f0cad8af73213b$export$3585ede4d035bf14.get(state);
|
|
43142
|
+
if (!data) throw new Error('Unknown list');
|
|
43143
|
+
return `${data.id}-option-${$b1f0cad8af73213b$var$normalizeKey(itemKey)}`;
|
|
43144
|
+
}
|
|
43145
|
+
|
|
43146
|
+
|
|
43147
|
+
|
|
43148
|
+
|
|
43149
|
+
|
|
43150
|
+
|
|
43151
|
+
function $c132121280ec012d$export$50eacbbf140a3141(props, state, ref) {
|
|
43152
|
+
let domProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
|
|
43153
|
+
labelable: true
|
|
43154
|
+
});
|
|
43155
|
+
let { listProps: listProps } = $982254629710d113$export$b95089534ab7c1fd({
|
|
43156
|
+
...props,
|
|
43157
|
+
ref: ref,
|
|
43158
|
+
selectionManager: state.selectionManager,
|
|
43159
|
+
collection: state.collection,
|
|
43160
|
+
disabledKeys: state.disabledKeys
|
|
43161
|
+
});
|
|
43162
|
+
let { focusWithinProps: focusWithinProps } = $9ab94262bd0047c7$export$420e68273165f4ec({
|
|
43163
|
+
onFocusWithin: props.onFocus,
|
|
43164
|
+
onBlurWithin: props.onBlur,
|
|
43165
|
+
onFocusWithinChange: props.onFocusChange
|
|
43166
|
+
});
|
|
43167
|
+
// Share list id and some props with child options.
|
|
43168
|
+
let id = $bdb11010cef70236$export$f680877a34711e37(props.id);
|
|
43169
|
+
$b1f0cad8af73213b$export$3585ede4d035bf14.set(state, {
|
|
43170
|
+
id: id,
|
|
43171
|
+
shouldUseVirtualFocus: props.shouldUseVirtualFocus,
|
|
43172
|
+
shouldSelectOnPressUp: props.shouldSelectOnPressUp,
|
|
43173
|
+
shouldFocusOnHover: props.shouldFocusOnHover,
|
|
43174
|
+
isVirtualized: props.isVirtualized
|
|
43175
|
+
});
|
|
43176
|
+
let { labelProps: labelProps , fieldProps: fieldProps } = $d191a55c9702f145$export$8467354a121f1b9f({
|
|
43177
|
+
...props,
|
|
43178
|
+
id: id,
|
|
43179
|
+
// listbox is not an HTML input element so it
|
|
43180
|
+
// shouldn't be labeled by a <label> element.
|
|
43181
|
+
labelElementType: 'span'
|
|
43182
|
+
});
|
|
43183
|
+
return {
|
|
43184
|
+
labelProps: labelProps,
|
|
43185
|
+
listBoxProps: $3ef42575df84b30b$export$9d1611c77c2fe928(domProps, focusWithinProps, state.selectionManager.selectionMode === 'multiple' ? {
|
|
43186
|
+
'aria-multiselectable': 'true'
|
|
43187
|
+
} : {
|
|
43188
|
+
}, {
|
|
43189
|
+
role: 'listbox',
|
|
43190
|
+
...$3ef42575df84b30b$export$9d1611c77c2fe928(fieldProps, listProps)
|
|
43191
|
+
})
|
|
43192
|
+
};
|
|
43193
|
+
}
|
|
43194
|
+
|
|
43195
|
+
|
|
43196
|
+
|
|
43197
|
+
|
|
43198
|
+
|
|
43199
|
+
|
|
43200
|
+
|
|
43201
|
+
function $293f70390ea03370$export$497855f14858aa34(props, state, ref) {
|
|
43202
|
+
let { key: key } = props;
|
|
43203
|
+
let data = $b1f0cad8af73213b$export$3585ede4d035bf14.get(state);
|
|
43204
|
+
var _isDisabled;
|
|
43205
|
+
let isDisabled = (_isDisabled = props.isDisabled) !== null && _isDisabled !== void 0 ? _isDisabled : state.disabledKeys.has(key);
|
|
43206
|
+
var _isSelected;
|
|
43207
|
+
let isSelected = (_isSelected = props.isSelected) !== null && _isSelected !== void 0 ? _isSelected : state.selectionManager.isSelected(key);
|
|
43208
|
+
let isFocused = state.selectionManager.focusedKey === key;
|
|
43209
|
+
var _shouldSelectOnPressUp;
|
|
43210
|
+
let shouldSelectOnPressUp = (_shouldSelectOnPressUp = props.shouldSelectOnPressUp) !== null && _shouldSelectOnPressUp !== void 0 ? _shouldSelectOnPressUp : data.shouldSelectOnPressUp;
|
|
43211
|
+
var _shouldFocusOnHover;
|
|
43212
|
+
let shouldFocusOnHover = (_shouldFocusOnHover = props.shouldFocusOnHover) !== null && _shouldFocusOnHover !== void 0 ? _shouldFocusOnHover : data.shouldFocusOnHover;
|
|
43213
|
+
var _shouldUseVirtualFocus;
|
|
43214
|
+
let shouldUseVirtualFocus = (_shouldUseVirtualFocus = props.shouldUseVirtualFocus) !== null && _shouldUseVirtualFocus !== void 0 ? _shouldUseVirtualFocus : data.shouldUseVirtualFocus;
|
|
43215
|
+
var _isVirtualized;
|
|
43216
|
+
let isVirtualized = (_isVirtualized = props.isVirtualized) !== null && _isVirtualized !== void 0 ? _isVirtualized : data.isVirtualized;
|
|
43217
|
+
let labelId = $bdb11010cef70236$export$b4cc09c592e8fdb8();
|
|
43218
|
+
let descriptionId = $bdb11010cef70236$export$b4cc09c592e8fdb8();
|
|
43219
|
+
let optionProps = {
|
|
43220
|
+
role: 'option',
|
|
43221
|
+
'aria-disabled': isDisabled,
|
|
43222
|
+
'aria-selected': state.selectionManager.selectionMode !== 'none' ? isSelected : undefined
|
|
43223
|
+
};
|
|
43224
|
+
// Safari with VoiceOver on macOS misreads options with aria-labelledby or aria-label as simply "text".
|
|
43225
|
+
// We should not map slots to the label and description on Safari and instead just have VoiceOver read the textContent.
|
|
43226
|
+
// https://bugs.webkit.org/show_bug.cgi?id=209279
|
|
43227
|
+
if (!($c87311424ea30a05$export$9ac100e40613ea10() && $c87311424ea30a05$export$78551043582a6a98())) {
|
|
43228
|
+
optionProps['aria-label'] = props['aria-label'];
|
|
43229
|
+
optionProps['aria-labelledby'] = labelId;
|
|
43230
|
+
optionProps['aria-describedby'] = descriptionId;
|
|
43231
|
+
}
|
|
43232
|
+
if (isVirtualized) {
|
|
43233
|
+
optionProps['aria-posinset'] = state.collection.getItem(key).index + 1;
|
|
43234
|
+
optionProps['aria-setsize'] = $453cc9f0df89c0a5$export$77d5aafae4e095b2(state.collection);
|
|
43235
|
+
}
|
|
43236
|
+
let { itemProps: itemProps , isPressed: isPressed } = $880e95eb8b93ba9a$export$ecf600387e221c37({
|
|
43237
|
+
selectionManager: state.selectionManager,
|
|
43238
|
+
key: key,
|
|
43239
|
+
ref: ref,
|
|
43240
|
+
shouldSelectOnPressUp: shouldSelectOnPressUp,
|
|
43241
|
+
allowsDifferentPressOrigin: shouldSelectOnPressUp,
|
|
43242
|
+
isVirtualized: isVirtualized,
|
|
43243
|
+
shouldUseVirtualFocus: shouldUseVirtualFocus,
|
|
43244
|
+
isDisabled: isDisabled
|
|
43245
|
+
});
|
|
43246
|
+
let { hoverProps: hoverProps } = $6179b936705e76d3$export$ae780daf29e6d456({
|
|
43247
|
+
isDisabled: isDisabled || !shouldFocusOnHover,
|
|
43248
|
+
onHoverStart () {
|
|
43249
|
+
if (!$507fabe10e71c6fb$export$b9b3dfddab17db27()) {
|
|
43250
|
+
state.selectionManager.setFocused(true);
|
|
43251
|
+
state.selectionManager.setFocusedKey(key);
|
|
43252
|
+
}
|
|
43253
|
+
}
|
|
43254
|
+
});
|
|
43255
|
+
return {
|
|
43256
|
+
optionProps: {
|
|
43257
|
+
...optionProps,
|
|
43258
|
+
...$3ef42575df84b30b$export$9d1611c77c2fe928(itemProps, hoverProps),
|
|
43259
|
+
id: $b1f0cad8af73213b$export$9145995848b05025(state, key)
|
|
43260
|
+
},
|
|
43261
|
+
labelProps: {
|
|
43262
|
+
id: labelId
|
|
43263
|
+
},
|
|
43264
|
+
descriptionProps: {
|
|
43265
|
+
id: descriptionId
|
|
43266
|
+
},
|
|
43267
|
+
isFocused: isFocused,
|
|
43268
|
+
isSelected: isSelected,
|
|
43269
|
+
isDisabled: isDisabled,
|
|
43270
|
+
isPressed: isPressed
|
|
43271
|
+
};
|
|
43272
|
+
}
|
|
43273
|
+
|
|
43274
|
+
function LuiListBoxItem({ node, state, renderer, }) {
|
|
43275
|
+
const ref = React.useRef(null);
|
|
43276
|
+
const { optionProps, isSelected, isDisabled } = $293f70390ea03370$export$497855f14858aa34({ key: node.key }, state, ref);
|
|
43277
|
+
const { isFocusVisible, focusProps } = $f7dceffc5ad7768b$export$4e328f61c538687f();
|
|
43278
|
+
return (React__default["default"].createElement("li", { ref: ref, ...$3ef42575df84b30b$export$9d1611c77c2fe928(optionProps, focusProps), className: clsx('LuiListBoxItem', isSelected && 'LuiListBoxItem-selected', isDisabled && 'LuiListBoxItem-disabled') }, renderer
|
|
43279
|
+
? renderer({ item: node.value, isDisabled, isSelected, isFocusVisible })
|
|
43280
|
+
: node.rendered));
|
|
43281
|
+
}
|
|
43282
|
+
|
|
43283
|
+
function DefaultItemRenderer({ item, }) {
|
|
43284
|
+
if (!item.hasOwnProperty('label')) {
|
|
43285
|
+
throw Error('Could not find `label` property on item, please provide a custom `itemRenderer`');
|
|
43286
|
+
}
|
|
43287
|
+
return React__default["default"].createElement(React__default["default"].Fragment, null, item.label);
|
|
43288
|
+
}
|
|
43289
|
+
|
|
43290
|
+
class $e40ea825a81a3709$export$52baac22726c72bf extends Set {
|
|
43291
|
+
constructor(keys, anchorKey, currentKey){
|
|
43292
|
+
super(keys);
|
|
43293
|
+
if (keys instanceof $e40ea825a81a3709$export$52baac22726c72bf) {
|
|
43294
|
+
this.anchorKey = anchorKey || keys.anchorKey;
|
|
43295
|
+
this.currentKey = currentKey || keys.currentKey;
|
|
43296
|
+
} else {
|
|
43297
|
+
this.anchorKey = anchorKey;
|
|
43298
|
+
this.currentKey = currentKey;
|
|
43299
|
+
}
|
|
43300
|
+
}
|
|
43301
|
+
}
|
|
43302
|
+
|
|
43303
|
+
|
|
43304
|
+
|
|
43305
|
+
function $7af3f5b51489e0b5$var$equalSets(setA, setB) {
|
|
43306
|
+
if (setA.size !== setB.size) return false;
|
|
43307
|
+
for (let item of setA){
|
|
43308
|
+
if (!setB.has(item)) return false;
|
|
43309
|
+
}
|
|
43310
|
+
return true;
|
|
43311
|
+
}
|
|
43312
|
+
function $7af3f5b51489e0b5$export$253fe78d46329472(props) {
|
|
43313
|
+
let { selectionMode: selectionMode = 'none' , disallowEmptySelection: disallowEmptySelection , allowDuplicateSelectionEvents: allowDuplicateSelectionEvents , selectionBehavior: selectionBehaviorProp = 'toggle' , disabledBehavior: disabledBehavior = 'all' } = props;
|
|
43314
|
+
// We want synchronous updates to `isFocused` and `focusedKey` after their setters are called.
|
|
43315
|
+
// But we also need to trigger a react re-render. So, we have both a ref (sync) and state (async).
|
|
43316
|
+
let isFocusedRef = React.useRef(false);
|
|
43317
|
+
let [, setFocused] = React.useState(false);
|
|
43318
|
+
let focusedKeyRef = React.useRef(null);
|
|
43319
|
+
let childFocusStrategyRef = React.useRef(null);
|
|
43320
|
+
let [, setFocusedKey] = React.useState(null);
|
|
43321
|
+
let selectedKeysProp = React.useMemo(()=>$7af3f5b51489e0b5$var$convertSelection(props.selectedKeys)
|
|
43322
|
+
, [
|
|
43323
|
+
props.selectedKeys
|
|
43324
|
+
]);
|
|
43325
|
+
let defaultSelectedKeys = React.useMemo(()=>$7af3f5b51489e0b5$var$convertSelection(props.defaultSelectedKeys, new $e40ea825a81a3709$export$52baac22726c72bf())
|
|
43326
|
+
, [
|
|
43327
|
+
props.defaultSelectedKeys
|
|
43328
|
+
]);
|
|
43329
|
+
let [selectedKeys, setSelectedKeys] = $458b0a5536c1a7cf$export$40bfa8c7b0832715(selectedKeysProp, defaultSelectedKeys, props.onSelectionChange);
|
|
43330
|
+
let disabledKeysProp = React.useMemo(()=>props.disabledKeys ? new Set(props.disabledKeys) : new Set()
|
|
43331
|
+
, [
|
|
43332
|
+
props.disabledKeys
|
|
43333
|
+
]);
|
|
43334
|
+
let [selectionBehavior, setSelectionBehavior] = React.useState(selectionBehaviorProp);
|
|
43335
|
+
// If the selectionBehavior prop is set to replace, but the current state is toggle (e.g. due to long press
|
|
43336
|
+
// to enter selection mode on touch), and the selection becomes empty, reset the selection behavior.
|
|
43337
|
+
if (selectionBehaviorProp === 'replace' && selectionBehavior === 'toggle' && typeof selectedKeys === 'object' && selectedKeys.size === 0) setSelectionBehavior('replace');
|
|
43338
|
+
// If the selectionBehavior prop changes, update the state as well.
|
|
43339
|
+
let lastSelectionBehavior = React.useRef(selectionBehaviorProp);
|
|
43340
|
+
React.useEffect(()=>{
|
|
43341
|
+
if (selectionBehaviorProp !== lastSelectionBehavior.current) {
|
|
43342
|
+
setSelectionBehavior(selectionBehaviorProp);
|
|
43343
|
+
lastSelectionBehavior.current = selectionBehaviorProp;
|
|
43344
|
+
}
|
|
43345
|
+
}, [
|
|
43346
|
+
selectionBehaviorProp
|
|
43347
|
+
]);
|
|
43348
|
+
return {
|
|
43349
|
+
selectionMode: selectionMode,
|
|
43350
|
+
disallowEmptySelection: disallowEmptySelection,
|
|
43351
|
+
selectionBehavior: selectionBehavior,
|
|
43352
|
+
setSelectionBehavior: setSelectionBehavior,
|
|
43353
|
+
get isFocused () {
|
|
43354
|
+
return isFocusedRef.current;
|
|
43355
|
+
},
|
|
43356
|
+
setFocused (f) {
|
|
43357
|
+
isFocusedRef.current = f;
|
|
43358
|
+
setFocused(f);
|
|
43359
|
+
},
|
|
43360
|
+
get focusedKey () {
|
|
43361
|
+
return focusedKeyRef.current;
|
|
43362
|
+
},
|
|
43363
|
+
get childFocusStrategy () {
|
|
43364
|
+
return childFocusStrategyRef.current;
|
|
43365
|
+
},
|
|
43366
|
+
setFocusedKey (k, childFocusStrategy = 'first') {
|
|
43367
|
+
focusedKeyRef.current = k;
|
|
43368
|
+
childFocusStrategyRef.current = childFocusStrategy;
|
|
43369
|
+
setFocusedKey(k);
|
|
43370
|
+
},
|
|
43371
|
+
selectedKeys: selectedKeys,
|
|
43372
|
+
setSelectedKeys (keys) {
|
|
43373
|
+
if (allowDuplicateSelectionEvents || !$7af3f5b51489e0b5$var$equalSets(keys, selectedKeys)) setSelectedKeys(keys);
|
|
43374
|
+
},
|
|
43375
|
+
disabledKeys: disabledKeysProp,
|
|
43376
|
+
disabledBehavior: disabledBehavior
|
|
43377
|
+
};
|
|
43378
|
+
}
|
|
43379
|
+
function $7af3f5b51489e0b5$var$convertSelection(selection, defaultValue) {
|
|
43380
|
+
if (!selection) return defaultValue;
|
|
43381
|
+
return selection === 'all' ? 'all' : new $e40ea825a81a3709$export$52baac22726c72bf(selection);
|
|
43382
|
+
}
|
|
43383
|
+
|
|
43384
|
+
|
|
43385
|
+
|
|
43386
|
+
class $d496c0a20b6e58ec$export$6c8a5aaad13c9852 {
|
|
43387
|
+
/**
|
|
43388
|
+
* The type of selection that is allowed in the collection.
|
|
43389
|
+
*/ get selectionMode() {
|
|
43390
|
+
return this.state.selectionMode;
|
|
43391
|
+
}
|
|
43392
|
+
/**
|
|
43393
|
+
* Whether the collection allows empty selection.
|
|
43394
|
+
*/ get disallowEmptySelection() {
|
|
43395
|
+
return this.state.disallowEmptySelection;
|
|
43396
|
+
}
|
|
43397
|
+
/**
|
|
43398
|
+
* The selection behavior for the collection.
|
|
43399
|
+
*/ get selectionBehavior() {
|
|
43400
|
+
return this.state.selectionBehavior;
|
|
43401
|
+
}
|
|
43402
|
+
/**
|
|
43403
|
+
* Sets the selection behavior for the collection.
|
|
43404
|
+
*/ setSelectionBehavior(selectionBehavior) {
|
|
43405
|
+
this.state.setSelectionBehavior(selectionBehavior);
|
|
43406
|
+
}
|
|
43407
|
+
/**
|
|
43408
|
+
* Whether the collection is currently focused.
|
|
43409
|
+
*/ get isFocused() {
|
|
43410
|
+
return this.state.isFocused;
|
|
43411
|
+
}
|
|
43412
|
+
/**
|
|
43413
|
+
* Sets whether the collection is focused.
|
|
43414
|
+
*/ setFocused(isFocused) {
|
|
43415
|
+
this.state.setFocused(isFocused);
|
|
43416
|
+
}
|
|
43417
|
+
/**
|
|
43418
|
+
* The current focused key in the collection.
|
|
43419
|
+
*/ get focusedKey() {
|
|
43420
|
+
return this.state.focusedKey;
|
|
43421
|
+
}
|
|
43422
|
+
/** Whether the first or last child of the focused key should receive focus. */ get childFocusStrategy() {
|
|
43423
|
+
return this.state.childFocusStrategy;
|
|
43424
|
+
}
|
|
43425
|
+
/**
|
|
43426
|
+
* Sets the focused key.
|
|
43427
|
+
*/ setFocusedKey(key, childFocusStrategy) {
|
|
43428
|
+
this.state.setFocusedKey(key, childFocusStrategy);
|
|
43429
|
+
}
|
|
43430
|
+
/**
|
|
43431
|
+
* The currently selected keys in the collection.
|
|
43432
|
+
*/ get selectedKeys() {
|
|
43433
|
+
return this.state.selectedKeys === 'all' ? new Set(this.getSelectAllKeys()) : this.state.selectedKeys;
|
|
43434
|
+
}
|
|
43435
|
+
/**
|
|
43436
|
+
* The raw selection value for the collection.
|
|
43437
|
+
* Either 'all' for select all, or a set of keys.
|
|
43438
|
+
*/ get rawSelection() {
|
|
43439
|
+
return this.state.selectedKeys;
|
|
43440
|
+
}
|
|
43441
|
+
/**
|
|
43442
|
+
* Returns whether a key is selected.
|
|
43443
|
+
*/ isSelected(key) {
|
|
43444
|
+
if (this.state.selectionMode === 'none') return false;
|
|
43445
|
+
key = this.getKey(key);
|
|
43446
|
+
return this.state.selectedKeys === 'all' ? this.canSelectItem(key) : this.state.selectedKeys.has(key);
|
|
43447
|
+
}
|
|
43448
|
+
/**
|
|
43449
|
+
* Whether the selection is empty.
|
|
43450
|
+
*/ get isEmpty() {
|
|
43451
|
+
return this.state.selectedKeys !== 'all' && this.state.selectedKeys.size === 0;
|
|
43452
|
+
}
|
|
43453
|
+
/**
|
|
43454
|
+
* Whether all items in the collection are selected.
|
|
43455
|
+
*/ get isSelectAll() {
|
|
43456
|
+
if (this.isEmpty) return false;
|
|
43457
|
+
if (this.state.selectedKeys === 'all') return true;
|
|
43458
|
+
if (this._isSelectAll != null) return this._isSelectAll;
|
|
43459
|
+
let allKeys = this.getSelectAllKeys();
|
|
43460
|
+
let selectedKeys = this.state.selectedKeys;
|
|
43461
|
+
this._isSelectAll = allKeys.every((k)=>selectedKeys.has(k)
|
|
43462
|
+
);
|
|
43463
|
+
return this._isSelectAll;
|
|
43464
|
+
}
|
|
43465
|
+
get firstSelectedKey() {
|
|
43466
|
+
let first = null;
|
|
43467
|
+
for (let key of this.state.selectedKeys){
|
|
43468
|
+
let item = this.collection.getItem(key);
|
|
43469
|
+
if (!first || (item === null || item === void 0 ? void 0 : item.index) < first.index) first = item;
|
|
43470
|
+
}
|
|
43471
|
+
return first === null || first === void 0 ? void 0 : first.key;
|
|
43472
|
+
}
|
|
43473
|
+
get lastSelectedKey() {
|
|
43474
|
+
let last = null;
|
|
43475
|
+
for (let key of this.state.selectedKeys){
|
|
43476
|
+
let item = this.collection.getItem(key);
|
|
43477
|
+
if (!last || (item === null || item === void 0 ? void 0 : item.index) > last.index) last = item;
|
|
43478
|
+
}
|
|
43479
|
+
return last === null || last === void 0 ? void 0 : last.key;
|
|
43480
|
+
}
|
|
43481
|
+
get disabledKeys() {
|
|
43482
|
+
return this.state.disabledKeys;
|
|
43483
|
+
}
|
|
43484
|
+
get disabledBehavior() {
|
|
43485
|
+
return this.state.disabledBehavior;
|
|
43486
|
+
}
|
|
43487
|
+
/**
|
|
43488
|
+
* Extends the selection to the given key.
|
|
43489
|
+
*/ extendSelection(toKey) {
|
|
43490
|
+
if (this.selectionMode === 'none') return;
|
|
43491
|
+
if (this.selectionMode === 'single') {
|
|
43492
|
+
this.replaceSelection(toKey);
|
|
43493
|
+
return;
|
|
43494
|
+
}
|
|
43495
|
+
toKey = this.getKey(toKey);
|
|
43496
|
+
let selection;
|
|
43497
|
+
// Only select the one key if coming from a select all.
|
|
43498
|
+
if (this.state.selectedKeys === 'all') selection = new $e40ea825a81a3709$export$52baac22726c72bf([
|
|
43499
|
+
toKey
|
|
43500
|
+
], toKey, toKey);
|
|
43501
|
+
else {
|
|
43502
|
+
let selectedKeys = this.state.selectedKeys;
|
|
43503
|
+
let anchorKey = selectedKeys.anchorKey || toKey;
|
|
43504
|
+
selection = new $e40ea825a81a3709$export$52baac22726c72bf(selectedKeys, anchorKey, toKey);
|
|
43505
|
+
for (let key of this.getKeyRange(anchorKey, selectedKeys.currentKey || toKey))selection.delete(key);
|
|
43506
|
+
for (let key1 of this.getKeyRange(toKey, anchorKey))if (this.canSelectItem(key1)) selection.add(key1);
|
|
43507
|
+
}
|
|
43508
|
+
this.state.setSelectedKeys(selection);
|
|
43509
|
+
}
|
|
43510
|
+
getKeyRange(from, to) {
|
|
43511
|
+
let fromItem = this.collection.getItem(from);
|
|
43512
|
+
let toItem = this.collection.getItem(to);
|
|
43513
|
+
if (fromItem && toItem) {
|
|
43514
|
+
if (fromItem.index <= toItem.index) return this.getKeyRangeInternal(from, to);
|
|
43515
|
+
return this.getKeyRangeInternal(to, from);
|
|
43516
|
+
}
|
|
43517
|
+
return [];
|
|
43518
|
+
}
|
|
43519
|
+
getKeyRangeInternal(from, to) {
|
|
43520
|
+
let keys = [];
|
|
43521
|
+
let key = from;
|
|
43522
|
+
while(key){
|
|
43523
|
+
let item = this.collection.getItem(key);
|
|
43524
|
+
if (item && item.type === 'item' || item.type === 'cell' && this.allowsCellSelection) keys.push(key);
|
|
43525
|
+
if (key === to) return keys;
|
|
43526
|
+
key = this.collection.getKeyAfter(key);
|
|
43527
|
+
}
|
|
43528
|
+
return [];
|
|
43529
|
+
}
|
|
43530
|
+
getKey(key) {
|
|
43531
|
+
let item = this.collection.getItem(key);
|
|
43532
|
+
if (!item) // ¯\_(ツ)_/¯
|
|
43533
|
+
return key;
|
|
43534
|
+
// If cell selection is allowed, just return the key.
|
|
43535
|
+
if (item.type === 'cell' && this.allowsCellSelection) return key;
|
|
43536
|
+
// Find a parent item to select
|
|
43537
|
+
while(item.type !== 'item' && item.parentKey != null)item = this.collection.getItem(item.parentKey);
|
|
43538
|
+
if (!item || item.type !== 'item') return null;
|
|
43539
|
+
return item.key;
|
|
43540
|
+
}
|
|
43541
|
+
/**
|
|
43542
|
+
* Toggles whether the given key is selected.
|
|
43543
|
+
*/ toggleSelection(key) {
|
|
43544
|
+
if (this.selectionMode === 'none') return;
|
|
43545
|
+
if (this.selectionMode === 'single' && !this.isSelected(key)) {
|
|
43546
|
+
this.replaceSelection(key);
|
|
43547
|
+
return;
|
|
43548
|
+
}
|
|
43549
|
+
key = this.getKey(key);
|
|
43550
|
+
if (key == null) return;
|
|
43551
|
+
let keys = new $e40ea825a81a3709$export$52baac22726c72bf(this.state.selectedKeys === 'all' ? this.getSelectAllKeys() : this.state.selectedKeys);
|
|
43552
|
+
if (keys.has(key)) keys.delete(key);
|
|
43553
|
+
else if (this.canSelectItem(key)) {
|
|
43554
|
+
keys.add(key);
|
|
43555
|
+
keys.anchorKey = key;
|
|
43556
|
+
keys.currentKey = key;
|
|
43557
|
+
}
|
|
43558
|
+
if (this.disallowEmptySelection && keys.size === 0) return;
|
|
43559
|
+
this.state.setSelectedKeys(keys);
|
|
43560
|
+
}
|
|
43561
|
+
/**
|
|
43562
|
+
* Replaces the selection with only the given key.
|
|
43563
|
+
*/ replaceSelection(key) {
|
|
43564
|
+
if (this.selectionMode === 'none') return;
|
|
43565
|
+
key = this.getKey(key);
|
|
43566
|
+
if (key == null) return;
|
|
43567
|
+
let selection = this.canSelectItem(key) ? new $e40ea825a81a3709$export$52baac22726c72bf([
|
|
43568
|
+
key
|
|
43569
|
+
], key, key) : new $e40ea825a81a3709$export$52baac22726c72bf();
|
|
43570
|
+
this.state.setSelectedKeys(selection);
|
|
43571
|
+
}
|
|
43572
|
+
/**
|
|
43573
|
+
* Replaces the selection with the given keys.
|
|
43574
|
+
*/ setSelectedKeys(keys) {
|
|
43575
|
+
if (this.selectionMode === 'none') return;
|
|
43576
|
+
let selection = new $e40ea825a81a3709$export$52baac22726c72bf();
|
|
43577
|
+
for (let key of keys){
|
|
43578
|
+
key = this.getKey(key);
|
|
43579
|
+
if (key != null) {
|
|
43580
|
+
selection.add(key);
|
|
43581
|
+
if (this.selectionMode === 'single') break;
|
|
43582
|
+
}
|
|
43583
|
+
}
|
|
43584
|
+
this.state.setSelectedKeys(selection);
|
|
43585
|
+
}
|
|
43586
|
+
getSelectAllKeys() {
|
|
43587
|
+
let keys = [];
|
|
43588
|
+
let addKeys = (key)=>{
|
|
43589
|
+
while(key){
|
|
43590
|
+
if (this.canSelectItem(key)) {
|
|
43591
|
+
let item = this.collection.getItem(key);
|
|
43592
|
+
if (item.type === 'item') keys.push(key);
|
|
43593
|
+
// Add child keys. If cell selection is allowed, then include item children too.
|
|
43594
|
+
if (item.hasChildNodes && (this.allowsCellSelection || item.type !== 'item')) addKeys([
|
|
43595
|
+
...item.childNodes
|
|
43596
|
+
][0].key);
|
|
43597
|
+
}
|
|
43598
|
+
key = this.collection.getKeyAfter(key);
|
|
43599
|
+
}
|
|
43600
|
+
};
|
|
43601
|
+
addKeys(this.collection.getFirstKey());
|
|
43602
|
+
return keys;
|
|
43603
|
+
}
|
|
43604
|
+
/**
|
|
43605
|
+
* Selects all items in the collection.
|
|
43606
|
+
*/ selectAll() {
|
|
43607
|
+
if (this.selectionMode === 'multiple') this.state.setSelectedKeys('all');
|
|
43608
|
+
}
|
|
43609
|
+
/**
|
|
43610
|
+
* Removes all keys from the selection.
|
|
43611
|
+
*/ clearSelection() {
|
|
43612
|
+
if (!this.disallowEmptySelection && (this.state.selectedKeys === 'all' || this.state.selectedKeys.size > 0)) this.state.setSelectedKeys(new $e40ea825a81a3709$export$52baac22726c72bf());
|
|
43613
|
+
}
|
|
43614
|
+
/**
|
|
43615
|
+
* Toggles between select all and an empty selection.
|
|
43616
|
+
*/ toggleSelectAll() {
|
|
43617
|
+
if (this.isSelectAll) this.clearSelection();
|
|
43618
|
+
else this.selectAll();
|
|
43619
|
+
}
|
|
43620
|
+
select(key, e) {
|
|
43621
|
+
if (this.selectionMode === 'none') return;
|
|
43622
|
+
if (this.selectionMode === 'single') {
|
|
43623
|
+
if (this.isSelected(key) && !this.disallowEmptySelection) this.toggleSelection(key);
|
|
43624
|
+
else this.replaceSelection(key);
|
|
43625
|
+
} else if (this.selectionBehavior === 'toggle' || e && (e.pointerType === 'touch' || e.pointerType === 'virtual')) // if touch or virtual (VO) then we just want to toggle, otherwise it's impossible to multi select because they don't have modifier keys
|
|
43626
|
+
this.toggleSelection(key);
|
|
43627
|
+
else this.replaceSelection(key);
|
|
43628
|
+
}
|
|
43629
|
+
/**
|
|
43630
|
+
* Returns whether the current selection is equal to the given selection.
|
|
43631
|
+
*/ isSelectionEqual(selection) {
|
|
43632
|
+
if (selection === this.state.selectedKeys) return true;
|
|
43633
|
+
// Check if the set of keys match.
|
|
43634
|
+
let selectedKeys = this.selectedKeys;
|
|
43635
|
+
if (selection.size !== selectedKeys.size) return false;
|
|
43636
|
+
for (let key of selection){
|
|
43637
|
+
if (!selectedKeys.has(key)) return false;
|
|
43638
|
+
}
|
|
43639
|
+
for (let key2 of selectedKeys){
|
|
43640
|
+
if (!selection.has(key2)) return false;
|
|
43641
|
+
}
|
|
43642
|
+
return true;
|
|
43643
|
+
}
|
|
43644
|
+
canSelectItem(key) {
|
|
43645
|
+
if (this.state.selectionMode === 'none' || this.state.disabledKeys.has(key)) return false;
|
|
43646
|
+
let item = this.collection.getItem(key);
|
|
43647
|
+
if (!item || item.type === 'cell' && !this.allowsCellSelection) return false;
|
|
43648
|
+
return true;
|
|
43649
|
+
}
|
|
43650
|
+
isDisabled(key) {
|
|
43651
|
+
return this.state.disabledKeys.has(key) && this.state.disabledBehavior === 'all';
|
|
43652
|
+
}
|
|
43653
|
+
constructor(collection, state, options){
|
|
43654
|
+
this.collection = collection;
|
|
43655
|
+
this.state = state;
|
|
43656
|
+
var ref;
|
|
43657
|
+
this.allowsCellSelection = (ref = options === null || options === void 0 ? void 0 : options.allowsCellSelection) !== null && ref !== void 0 ? ref : false;
|
|
43658
|
+
this._isSelectAll = null;
|
|
43659
|
+
}
|
|
43660
|
+
}
|
|
43661
|
+
|
|
43662
|
+
var tmp = Symbol.iterator;
|
|
43663
|
+
class $a02d57049d202695$export$d085fb9e920b5ca7 {
|
|
43664
|
+
*[tmp]() {
|
|
43665
|
+
yield* this.iterable;
|
|
43666
|
+
}
|
|
43667
|
+
get size() {
|
|
43668
|
+
return this.keyMap.size;
|
|
43669
|
+
}
|
|
43670
|
+
getKeys() {
|
|
43671
|
+
return this.keyMap.keys();
|
|
43672
|
+
}
|
|
43673
|
+
getKeyBefore(key) {
|
|
43674
|
+
let node = this.keyMap.get(key);
|
|
43675
|
+
return node ? node.prevKey : null;
|
|
43676
|
+
}
|
|
43677
|
+
getKeyAfter(key) {
|
|
43678
|
+
let node = this.keyMap.get(key);
|
|
43679
|
+
return node ? node.nextKey : null;
|
|
43680
|
+
}
|
|
43681
|
+
getFirstKey() {
|
|
43682
|
+
return this.firstKey;
|
|
43683
|
+
}
|
|
43684
|
+
getLastKey() {
|
|
43685
|
+
return this.lastKey;
|
|
43686
|
+
}
|
|
43687
|
+
getItem(key) {
|
|
43688
|
+
return this.keyMap.get(key);
|
|
43689
|
+
}
|
|
43690
|
+
at(idx) {
|
|
43691
|
+
const keys = [
|
|
43692
|
+
...this.getKeys()
|
|
43693
|
+
];
|
|
43694
|
+
return this.getItem(keys[idx]);
|
|
43695
|
+
}
|
|
43696
|
+
constructor(nodes){
|
|
43697
|
+
this.keyMap = new Map();
|
|
43698
|
+
this.iterable = nodes;
|
|
43699
|
+
let visit = (node)=>{
|
|
43700
|
+
this.keyMap.set(node.key, node);
|
|
43701
|
+
if (node.childNodes && node.type === 'section') for (let child of node.childNodes)visit(child);
|
|
43702
|
+
};
|
|
43703
|
+
for (let node2 of nodes)visit(node2);
|
|
43704
|
+
let last;
|
|
43705
|
+
let index = 0;
|
|
43706
|
+
for (let [key, node1] of this.keyMap){
|
|
43707
|
+
if (last) {
|
|
43708
|
+
last.nextKey = key;
|
|
43709
|
+
node1.prevKey = last.key;
|
|
43710
|
+
} else {
|
|
43711
|
+
this.firstKey = key;
|
|
43712
|
+
node1.prevKey = undefined;
|
|
43713
|
+
}
|
|
43714
|
+
if (node1.type === 'item') node1.index = index++;
|
|
43715
|
+
last = node1;
|
|
43716
|
+
// Set nextKey as undefined since this might be the last node
|
|
43717
|
+
// If it isn't the last node, last.nextKey will properly set at start of new loop
|
|
43718
|
+
last.nextKey = undefined;
|
|
43719
|
+
}
|
|
43720
|
+
this.lastKey = last === null || last === void 0 ? void 0 : last.key;
|
|
43721
|
+
}
|
|
43722
|
+
}
|
|
43723
|
+
|
|
43724
|
+
|
|
43725
|
+
|
|
43726
|
+
|
|
43727
|
+
function $e72dd72e1c76a225$export$2f645645f7bca764(props) {
|
|
43728
|
+
let { filter: filter } = props;
|
|
43729
|
+
let selectionState = $7af3f5b51489e0b5$export$253fe78d46329472(props);
|
|
43730
|
+
let disabledKeys = React.useMemo(()=>props.disabledKeys ? new Set(props.disabledKeys) : new Set()
|
|
43731
|
+
, [
|
|
43732
|
+
props.disabledKeys
|
|
43733
|
+
]);
|
|
43734
|
+
let factory = (nodes)=>filter ? new $a02d57049d202695$export$d085fb9e920b5ca7(filter(nodes)) : new $a02d57049d202695$export$d085fb9e920b5ca7(nodes)
|
|
43735
|
+
;
|
|
43736
|
+
let context = React.useMemo(()=>({
|
|
43737
|
+
suppressTextValueWarning: props.suppressTextValueWarning
|
|
43738
|
+
})
|
|
43739
|
+
, [
|
|
43740
|
+
props.suppressTextValueWarning
|
|
43741
|
+
]);
|
|
43742
|
+
let collection = $7613b1592d41b092$export$6cd28814d92fa9c9(props, factory, context, [
|
|
43743
|
+
filter
|
|
43744
|
+
]);
|
|
43745
|
+
// Reset focused key if that item is deleted from the collection.
|
|
43746
|
+
React.useEffect(()=>{
|
|
43747
|
+
if (selectionState.focusedKey != null && !collection.getItem(selectionState.focusedKey)) selectionState.setFocusedKey(null);
|
|
43748
|
+
}, [
|
|
43749
|
+
collection,
|
|
43750
|
+
selectionState.focusedKey
|
|
43751
|
+
]);
|
|
43752
|
+
return {
|
|
43753
|
+
collection: collection,
|
|
43754
|
+
disabledKeys: disabledKeys,
|
|
43755
|
+
selectionManager: new $d496c0a20b6e58ec$export$6c8a5aaad13c9852(collection, selectionState)
|
|
43756
|
+
};
|
|
43757
|
+
}
|
|
43758
|
+
|
|
43759
|
+
function LuiListBox({ ariaLabel, ariaLabelledBy, itemRenderer = DefaultItemRenderer, loadingIndicator = DefaultLoadingIndicator, emptyIndicator = DefaultEmptyIndicator, selectionMode = 'single', selectionBehavior = 'toggle', disabled = false, items, value, onChange = () => {
|
|
43760
|
+
/* noop */
|
|
43761
|
+
}, getKey, ariaProps, className, ...ulProps }) {
|
|
43762
|
+
const listProps = React.useMemo(() => mapToAriaListBoxProps({
|
|
43763
|
+
selectionMode,
|
|
43764
|
+
selectionBehavior,
|
|
43765
|
+
items,
|
|
43766
|
+
value,
|
|
43767
|
+
onChange,
|
|
43768
|
+
getKey,
|
|
43769
|
+
ariaProps,
|
|
43770
|
+
disabled,
|
|
43771
|
+
}), [
|
|
43772
|
+
selectionMode,
|
|
43773
|
+
selectionBehavior,
|
|
43774
|
+
items,
|
|
43775
|
+
value,
|
|
43776
|
+
onChange,
|
|
43777
|
+
getKey,
|
|
43778
|
+
ariaProps,
|
|
43779
|
+
]);
|
|
43780
|
+
const ariaListBoxProps = React.useMemo(() => ({
|
|
43781
|
+
'aria-label': ariaLabel,
|
|
43782
|
+
'aria-labelledby': ariaLabelledBy,
|
|
43783
|
+
...listProps,
|
|
43784
|
+
}), [listProps, ariaLabel, ariaLabelledBy]);
|
|
43785
|
+
const ref = React.useRef(null);
|
|
43786
|
+
const state = $e72dd72e1c76a225$export$2f645645f7bca764(listProps);
|
|
43787
|
+
const { listBoxProps } = $c132121280ec012d$export$50eacbbf140a3141(ariaListBoxProps, state, ref);
|
|
43788
|
+
return (React__default["default"].createElement("ul", { ...ulProps, ...listBoxProps, ref: ref, className: clsx('LuiListBox', className) },
|
|
43789
|
+
!items && loadingIndicator(),
|
|
43790
|
+
items?.length === 0 && emptyIndicator(),
|
|
43791
|
+
[...state.collection].map((node) => (React__default["default"].createElement(LuiListBoxItem, { key: node.key, node: node, state: state, renderer: itemRenderer })))));
|
|
43792
|
+
}
|
|
43793
|
+
function DefaultLoadingIndicator() {
|
|
43794
|
+
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
43795
|
+
React__default["default"].createElement("li", { className: "LuiListBox-loadingIndicator" },
|
|
43796
|
+
React__default["default"].createElement(Skeleton, null)),
|
|
43797
|
+
React__default["default"].createElement("li", { className: "LuiListBox-loadingIndicator" },
|
|
43798
|
+
React__default["default"].createElement(Skeleton, null)),
|
|
43799
|
+
React__default["default"].createElement("li", { className: "LuiListBox-loadingIndicator" },
|
|
43800
|
+
React__default["default"].createElement(Skeleton, null))));
|
|
43801
|
+
}
|
|
43802
|
+
function DefaultEmptyIndicator() {
|
|
43803
|
+
return React__default["default"].createElement("li", { className: "LuiListBox-emptyIndicator" }, "Nothing to Display");
|
|
43804
|
+
}
|
|
43805
|
+
|
|
43806
|
+
var css_248z$1 = "/**\n @deprecated\n */\n/**\n @deprecated\n */\n/**\n @deprecated\n */\n.RadioItemRenderer {\n display: flex;\n align-items: center;\n position: relative;\n padding: 0 0 0 2rem;\n}\n.RadioItemRenderer::before {\n content: \"\";\n height: 1.5rem;\n min-width: 1.5rem;\n width: 1.5rem;\n border: 2px solid #007198;\n border-radius: 50%;\n background-color: transparent;\n position: absolute;\n left: 0;\n top: 0;\n margin-right: 0.75rem;\n}\n.RadioItemRenderer:after {\n content: \"\";\n position: absolute;\n left: 5px;\n top: 5px;\n background-color: #007198;\n height: 14px;\n min-width: 14px;\n width: 14px;\n border-radius: 50%;\n opacity: 0;\n transition: opacity 0.3s ease-in-out;\n}\n.RadioItemRenderer-isSelected:after {\n opacity: 1;\n}";
|
|
43807
|
+
styleInject(css_248z$1);
|
|
43808
|
+
|
|
43809
|
+
function RadioItemRenderer({ item, isSelected, }) {
|
|
43810
|
+
return (React__default["default"].createElement("div", { className: `RadioItemRenderer ${isSelected ? 'RadioItemRenderer-isSelected' : ''}` }, item.label));
|
|
43811
|
+
}
|
|
43812
|
+
|
|
43813
|
+
var css_248z = ".CheckboxRenderer {\n display: flex;\n align-items: center;\n}";
|
|
43814
|
+
styleInject(css_248z);
|
|
43815
|
+
|
|
43816
|
+
function CheckboxItemRenderer({ item, isSelected, }) {
|
|
43817
|
+
return (React__default["default"].createElement("div", { className: `CheckboxRenderer ${isSelected ? 'LuiCheckboxInput--isChecked' : ''}`, style: {} },
|
|
43818
|
+
React__default["default"].createElement(LuiIcon, { size: "md", name: isSelected ? 'ic_check' : 'ic_zoom_out', alt: isSelected ? 'Checked' : 'Indeterminate Check', className: `LuiCheckboxInput-labelCheck ${isSelected ? 'LuiCheckboxInput--isChecked' : ''}` }),
|
|
43819
|
+
item.label));
|
|
43820
|
+
}
|
|
43821
|
+
|
|
43822
|
+
exports.CheckboxItemRenderer = CheckboxItemRenderer;
|
|
40396
43823
|
exports.FIRM_KEY = FIRM_KEY;
|
|
40397
43824
|
exports.FIRM_NAME_KEY = FIRM_NAME_KEY;
|
|
40398
43825
|
exports.GLOBAL_CLIENT_REFERENCE_KEY = GLOBAL_CLIENT_REFERENCE_KEY;
|
|
@@ -40449,6 +43876,7 @@ exports.LuiFormikTextInput = LuiFormikTextInput;
|
|
|
40449
43876
|
exports.LuiHeader = LuiHeader;
|
|
40450
43877
|
exports.LuiHeaderMenuItem = LuiHeaderMenuItem;
|
|
40451
43878
|
exports.LuiIcon = LuiIcon;
|
|
43879
|
+
exports.LuiListBox = LuiListBox;
|
|
40452
43880
|
exports.LuiLoadingSpinner = LuiLoadingSpinner;
|
|
40453
43881
|
exports.LuiLoadingSpinnerChristmas = LuiLoadingSpinnerChristmas;
|
|
40454
43882
|
exports.LuiLoadingSpinnerEaster = LuiLoadingSpinnerEaster;
|
|
@@ -40482,6 +43910,7 @@ exports.LuiTextInput = LuiTextInput;
|
|
|
40482
43910
|
exports.LuiToastMessage = LuiToastMessage;
|
|
40483
43911
|
exports.LuiTooltip = LuiTooltip;
|
|
40484
43912
|
exports.LuiUpdatesSplashModal = LuiUpdatesSplashModal;
|
|
43913
|
+
exports.RadioItemRenderer = RadioItemRenderer;
|
|
40485
43914
|
exports.getDefaultSearchMenuOptions = getDefaultSearchMenuOptions;
|
|
40486
43915
|
exports.isChromatic = isChromatic;
|
|
40487
43916
|
exports.useClickedOutsideElement = useClickedOutsideElement;
|