react-aria-components 1.15.1 → 1.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Button.main.js +3 -2
- package/dist/Button.main.js.map +1 -1
- package/dist/Button.mjs +3 -2
- package/dist/Button.module.js +3 -2
- package/dist/Button.module.js.map +1 -1
- package/dist/Collection.main.js +3 -0
- package/dist/Collection.main.js.map +1 -1
- package/dist/Collection.mjs +3 -0
- package/dist/Collection.module.js +3 -0
- package/dist/Collection.module.js.map +1 -1
- package/dist/ComboBox.main.js +59 -8
- package/dist/ComboBox.main.js.map +1 -1
- package/dist/ComboBox.mjs +61 -12
- package/dist/ComboBox.module.js +61 -12
- package/dist/ComboBox.module.js.map +1 -1
- package/dist/DateField.main.js +8 -4
- package/dist/DateField.main.js.map +1 -1
- package/dist/DateField.mjs +8 -4
- package/dist/DateField.module.js +8 -4
- package/dist/DateField.module.js.map +1 -1
- package/dist/DatePicker.main.js +6 -2
- package/dist/DatePicker.main.js.map +1 -1
- package/dist/DatePicker.mjs +6 -2
- package/dist/DatePicker.module.js +6 -2
- package/dist/DatePicker.module.js.map +1 -1
- package/dist/DropZone.main.js +1 -1
- package/dist/DropZone.main.js.map +1 -1
- package/dist/DropZone.mjs +2 -2
- package/dist/DropZone.module.js +2 -2
- package/dist/DropZone.module.js.map +1 -1
- package/dist/FileTrigger.main.js +1 -1
- package/dist/FileTrigger.main.js.map +1 -1
- package/dist/FileTrigger.mjs +2 -2
- package/dist/FileTrigger.module.js +2 -2
- package/dist/FileTrigger.module.js.map +1 -1
- package/dist/GridList.main.js +7 -4
- package/dist/GridList.main.js.map +1 -1
- package/dist/GridList.mjs +7 -5
- package/dist/GridList.module.js +7 -5
- package/dist/GridList.module.js.map +1 -1
- package/dist/HiddenDateInput.main.js +3 -1
- package/dist/HiddenDateInput.main.js.map +1 -1
- package/dist/HiddenDateInput.mjs +3 -1
- package/dist/HiddenDateInput.module.js +3 -1
- package/dist/HiddenDateInput.module.js.map +1 -1
- package/dist/Keyboard.main.js.map +1 -1
- package/dist/Keyboard.module.js.map +1 -1
- package/dist/ListBox.main.js +2 -1
- package/dist/ListBox.main.js.map +1 -1
- package/dist/ListBox.mjs +3 -2
- package/dist/ListBox.module.js +3 -2
- package/dist/ListBox.module.js.map +1 -1
- package/dist/Menu.main.js +3 -1
- package/dist/Menu.main.js.map +1 -1
- package/dist/Menu.mjs +3 -1
- package/dist/Menu.module.js +3 -1
- package/dist/Menu.module.js.map +1 -1
- package/dist/Popover.main.js +1 -1
- package/dist/Popover.main.js.map +1 -1
- package/dist/Popover.mjs +3 -3
- package/dist/Popover.module.js +3 -3
- package/dist/Popover.module.js.map +1 -1
- package/dist/Tree.main.js +151 -102
- package/dist/Tree.main.js.map +1 -1
- package/dist/Tree.mjs +153 -106
- package/dist/Tree.module.js +153 -106
- package/dist/Tree.module.js.map +1 -1
- package/dist/import.mjs +3 -3
- package/dist/main.js +4 -0
- package/dist/main.js.map +1 -1
- package/dist/module.js +3 -3
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +76 -22
- package/dist/types.d.ts.map +1 -1
- package/dist/utils.main.js.map +1 -1
- package/dist/utils.module.js.map +1 -1
- package/package.json +23 -23
- package/src/Button.tsx +4 -2
- package/src/Collection.tsx +6 -0
- package/src/ComboBox.tsx +89 -12
- package/src/DateField.tsx +14 -5
- package/src/DatePicker.tsx +11 -2
- package/src/DropZone.tsx +2 -2
- package/src/FileTrigger.tsx +2 -2
- package/src/GridList.tsx +12 -3
- package/src/HiddenDateInput.tsx +2 -1
- package/src/Keyboard.tsx +2 -2
- package/src/ListBox.tsx +5 -4
- package/src/Menu.tsx +3 -2
- package/src/Popover.tsx +3 -3
- package/src/Tree.tsx +209 -146
- package/src/index.ts +4 -3
- package/src/utils.tsx +6 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"
|
|
1
|
+
{"mappings":";;;;;AAAA;;;;;;;;;;CAUC;;;;AAkCD,MAAM,qCAAe;IAAC;IAAO;IAAS;CAAO;AAC7C,MAAM,uCAAiB;IAAC,QAAQ;IAAG,UAAU;IAAG,UAAU;AAAC;AAEpD,SAAS,0CAAmB,KAA2B,EAAE,KAAuC;IACrG,IAAI,gBACF,YAAY,cACZ,UAAU,QACV,IAAI,EACL,GAAG;IACJ,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB,EAAE;QAC5C,OAAO;YACL,0BAA0B;YAC1B,UAAU;YACV,KAAK;YACL,MAAM;QACR;IACF;IAEA,IAAI,YAAY;IAChB,IAAI,MAAM,WAAW,KAAK,UACxB,YAAY;SACP,IAAI,MAAM,WAAW,KAAK,QAC/B,YAAY;IAGd,IAAI,YAAY;IAChB,IAAI,MAAM,KAAK;QACb,IAAI,MAAM,WAAW,KAAK,OACxB,YAAY,CAAA,GAAA,qBAAa,EAAE,MAAM,KAAK,EAAE,QAAQ;aAEhD,YAAY,CAAA,GAAA,yBAAiB,EAAE,cAAc,MAAM,KAAK,GAAG,CAAA,GAAA,sBAAc,EAAE,MAAM,KAAK,IAAI,MAAM,KAAK,EAAE,QAAQ;;IAInH,IAAI,YAAY,MAAM,WAAW,KAAK,QAAQ,SAAS;IAEvD,IAAI,eAAe;QAAC;QAAQ;QAAU;KAAS;IAC/C,+EAA+E;IAC/E,IAAI,MAAM;IACV,IAAI,aAAa,QAAQ,CAAC,MAAM,WAAW,GAAG;QAC5C,MAAM,oCAAc,CAAC,MAAM,WAAW,CAAC;QACvC,eAAe,aAAa,KAAK,CAAC,GAAG;IACvC;IAEA,OAAO;QACL,gBAAgB;YACd,GAAG,mBAAmB;YACtB,eAAe;YACf,aAAa;YACb,CAAC,gCAAgC,EAAE;YACnC,aAAa;YACb,CAAC,mBAAmB,EAAE;QACxB;QACA,YAAY;YACV,UAAU;0BACV;YACA,UAAU;YACV,MAAM;YACN,wGAAwG;YACxG,MAAM;kBACN;YACA,MAAM;YACN,OAAO;YACP,UAAU,CAAC;gBACT,IAAI,eAAe,CAAA,GAAA,qBAAa,EAAE,GAAG,KAAK,CAAC,QAAQ;gBACnD,IAAI,cACF,IAAI;oBACF,IAAI,cAA+C,CAAA,GAAA,oBAAY,EAAE;oBACjE,IAAI,MAAM,WAAW,KAAK,OACxB,cAAc,CAAA,GAAA,gBAAQ,EAAE;oBAE1B,uHAAuH;oBACvH,iHAAiH;oBACjH,oHAAoH;oBACpH,2GAA2G;oBAC3G,wHAAwH;oBACxH,kDAAkD;oBAClD,IAAI,gBAAgB,OAClB,IAAK,IAAI,QAAQ,YAAa;wBAC5B,qCAAqC;wBACrC,IAAI,mCAAa,QAAQ,CAAC,OACxB,MAAM,UAAU,CAAC,MAAyB,WAAW,CAAC,KAAK;wBAE7D,qCAAqC;wBACrC,IAAI,aAAa,QAAQ,CAAC,OACxB,MAAM,UAAU,CAAC,MAAyB,WAAW,CAAC,KAAK;oBAE/D;oBAEF,MAAM,QAAQ,CAAC;gBACjB,EAAE,OAAM;gBACN,SAAS;gBACX;YAEJ;QACF;IACF;AACF;AAEO,SAAS,0CAAgB,KAA2B;IACzD,IAAI,SAAC,KAAK,EAAC,GAAG;IACd,IAAI,kBAAC,cAAc,cAAE,UAAU,EAAC,GAAG,0CAAmB;QAAC,GAAG,KAAK;IAAA,GAAG;IAClE,qBACE,gCAAC;QAAK,GAAG,cAAc;QAAE,eAAY;qBACnC,gCAAC,SAAU;AAGjB","sources":["packages/react-aria-components/src/HiddenDateInput.tsx"],"sourcesContent":["/*\n * Copyright 2025 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n\nimport {CalendarDate, CalendarDateTime, parseDate, parseDateTime, toCalendarDate, toCalendarDateTime, toLocalTimeZone} from '@internationalized/date';\nimport {DateFieldState, DatePickerState, DateSegmentType} from 'react-stately';\nimport {getEventTarget} from '@react-aria/utils';\nimport React, {ReactNode} from 'react';\nimport {useVisuallyHidden} from 'react-aria';\n\ninterface AriaHiddenDateInputProps {\n /**\n * Describes the type of autocomplete functionality the input should provide if any. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefautocomplete).\n */\n autoComplete?: string,\n /** HTML form input name. */\n name?: string,\n /** Sets the disabled state of the input. */\n isDisabled?: boolean\n}\n\ninterface HiddenDateInputProps extends AriaHiddenDateInputProps {\n /**\n * State for the input.\n */\n state: DateFieldState | DatePickerState\n}\n\nexport interface HiddenDateAria {\n /** Props for the container element. */\n containerProps: React.HTMLAttributes<HTMLDivElement>,\n /** Props for the hidden input element. */\n inputProps: React.InputHTMLAttributes<HTMLInputElement>\n}\n\nconst dateSegments = ['day', 'month', 'year'];\nconst granularityMap = {'hour': 1, 'minute': 2, 'second': 3};\n\nexport function useHiddenDateInput(props: HiddenDateInputProps, state: DateFieldState | DatePickerState) : HiddenDateAria {\n let {\n autoComplete,\n isDisabled,\n name\n } = props;\n let {visuallyHiddenProps} = useVisuallyHidden({\n style: {\n // Prevent page scrolling.\n position: 'fixed',\n top: 0,\n left: 0\n }\n });\n\n let inputStep = 60;\n if (state.granularity === 'second') {\n inputStep = 1;\n } else if (state.granularity === 'hour') {\n inputStep = 3600;\n }\n \n let dateValue = '';\n if (state.value) {\n if (state.granularity === 'day') {\n dateValue = toCalendarDate(state.value).toString();\n } else {\n dateValue = toCalendarDateTime('timeZone' in state.value ? toLocalTimeZone(state.value) : state.value).toString();\n }\n }\n\n let inputType = state.granularity === 'day' ? 'date' : 'datetime-local';\n\n let timeSegments = ['hour', 'minute', 'second'];\n // Depending on the granularity, we only want to validate certain time segments\n let end = 0;\n if (timeSegments.includes(state.granularity)) {\n end = granularityMap[state.granularity];\n timeSegments = timeSegments.slice(0, end);\n }\n\n return {\n containerProps: {\n ...visuallyHiddenProps,\n 'aria-hidden': true,\n // @ts-ignore\n ['data-react-aria-prevent-focus']: true,\n // @ts-ignore\n ['data-a11y-ignore']: 'aria-hidden-focus'\n },\n inputProps: {\n tabIndex: -1,\n autoComplete,\n disabled: isDisabled,\n type: inputType,\n // We set the form prop to an empty string to prevent the hidden date input's value from being submitted\n form: '',\n name,\n step: inputStep,\n value: dateValue,\n onChange: (e) => {\n let targetString = getEventTarget(e).value.toString();\n if (targetString) {\n try {\n let targetValue: CalendarDateTime | CalendarDate = parseDateTime(targetString);\n if (state.granularity === 'day') {\n targetValue = parseDate(targetString);\n }\n // We check to to see if setSegment exists in the state since it only exists in DateFieldState and not DatePickerState.\n // The setValue method has different behavior depending on if it's coming from DateFieldState or DatePickerState.\n // In DateFieldState, setValue firsts checks to make sure that each segment is filled before committing the newValue\n // which is why in the code below we first set each segment to validate it before committing the new value.\n // However, in DatePickerState, since we have to be able to commit values from the Calendar popover, we are also able to\n // set a new value when the field itself is empty.\n if ('setSegment' in state) {\n for (let type in targetValue) {\n // eslint-disable-next-line max-depth\n if (dateSegments.includes(type)) {\n state.setSegment(type as DateSegmentType, targetValue[type]);\n }\n // eslint-disable-next-line max-depth\n if (timeSegments.includes(type)) {\n state.setSegment(type as DateSegmentType, targetValue[type]);\n }\n }\n }\n state.setValue(targetValue);\n } catch {\n // ignore\n }\n }\n }\n }\n };\n}\n\nexport function HiddenDateInput(props: HiddenDateInputProps): ReactNode | null {\n let {state} = props;\n let {containerProps, inputProps} = useHiddenDateInput({...props}, state);\n return (\n <div {...containerProps} data-testid=\"hidden-dateinput-container\">\n <input {...inputProps} />\n </div>\n );\n}\n"],"names":[],"version":3,"file":"HiddenDateInput.module.js.map"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;AAOM,MAAM,0DAAkB,CAAA,GAAA,0BAAY,
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;AAOM,MAAM,0DAAkB,CAAA,GAAA,0BAAY,EAA4C,CAAC;AAEjF,MAAM,0DAAW,CAAA,GAAA,uBAAS,EAAE,SAAS,SAAS,KAAoB,EAAE,GAA8B;IACvG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,qBAAO,0DAAC,CAAA,GAAA,6BAAE,EAAE,GAAG;QAAC,KAAI;QAAO,GAAG,KAAK;QAAE,KAAK;;AAC5C","sources":["packages/react-aria-components/src/Keyboard.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, dom, DOMRenderProps, useContextProps} from './utils';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes} from 'react';\n\nexport interface KeyboardProps extends HTMLAttributes<HTMLElement>, DOMRenderProps<'kbd', undefined> {}\n\nexport const KeyboardContext = createContext<ContextValue<KeyboardProps, HTMLElement>>({});\n\nexport const Keyboard = forwardRef(function Keyboard(props: KeyboardProps, ref: ForwardedRef<HTMLElement>) {\n [props, ref] = useContextProps(props, ref, KeyboardContext);\n return <dom.kbd dir=\"ltr\" {...props} ref={ref} />;\n});\n"],"names":[],"version":3,"file":"Keyboard.main.js.map"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAOM,MAAM,0DAAkB,CAAA,GAAA,oBAAY,
|
|
1
|
+
{"mappings":";;;AAAA;;;;;;;;;;CAUC;;AAOM,MAAM,0DAAkB,CAAA,GAAA,oBAAY,EAA4C,CAAC;AAEjF,MAAM,0DAAW,CAAA,GAAA,iBAAS,EAAE,SAAS,SAAS,KAAoB,EAAE,GAA8B;IACvG,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,qBAAO,gCAAC,CAAA,GAAA,yCAAE,EAAE,GAAG;QAAC,KAAI;QAAO,GAAG,KAAK;QAAE,KAAK;;AAC5C","sources":["packages/react-aria-components/src/Keyboard.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, dom, DOMRenderProps, useContextProps} from './utils';\nimport React, {createContext, ForwardedRef, forwardRef, HTMLAttributes} from 'react';\n\nexport interface KeyboardProps extends HTMLAttributes<HTMLElement>, DOMRenderProps<'kbd', undefined> {}\n\nexport const KeyboardContext = createContext<ContextValue<KeyboardProps, HTMLElement>>({});\n\nexport const Keyboard = forwardRef(function Keyboard(props: KeyboardProps, ref: ForwardedRef<HTMLElement>) {\n [props, ref] = useContextProps(props, ref, KeyboardContext);\n return <dom.kbd dir=\"ltr\" {...props} ref={ref} />;\n});\n"],"names":[],"version":3,"file":"Keyboard.module.js.map"}
|
package/dist/ListBox.main.js
CHANGED
|
@@ -314,6 +314,7 @@ const $a03b42240404b420$export$a11e76429ed99b4 = /*#__PURE__*/ (0, $59TRP$reacta
|
|
|
314
314
|
onHoverChange: item.props.onHoverChange,
|
|
315
315
|
onHoverEnd: item.props.onHoverEnd
|
|
316
316
|
});
|
|
317
|
+
let { keyboardProps: keyboardProps } = (0, $59TRP$reactaria.useKeyboard)(props);
|
|
317
318
|
let { focusProps: focusProps } = (0, $59TRP$reactaria.useFocus)(props);
|
|
318
319
|
let draggableItem = null;
|
|
319
320
|
if (dragState && dragAndDropHooks) draggableItem = dragAndDropHooks.useDraggableItem({
|
|
@@ -357,7 +358,7 @@ const $a03b42240404b420$export$a11e76429ed99b4 = /*#__PURE__*/ (0, $59TRP$reacta
|
|
|
357
358
|
delete DOMProps.onClick;
|
|
358
359
|
if (props.href && optionProps.tabIndex == null) optionProps.tabIndex = -1;
|
|
359
360
|
return /*#__PURE__*/ (0, ($parcel$interopDefault($59TRP$react))).createElement(ElementType, {
|
|
360
|
-
...(0, $59TRP$reactaria.mergeProps)(DOMProps, renderProps, optionProps, hoverProps, focusProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps),
|
|
361
|
+
...(0, $59TRP$reactaria.mergeProps)(DOMProps, renderProps, optionProps, hoverProps, keyboardProps, focusProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps),
|
|
361
362
|
ref: ref,
|
|
362
363
|
"data-allows-dragging": !!dragState || undefined,
|
|
363
364
|
"data-selected": states.isSelected || undefined,
|
package/dist/ListBox.main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/react-aria-components/src/ListBox.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaListBoxOptions, AriaListBoxProps, DraggableItemResult, DragPreviewRenderer, DroppableCollectionResult, DroppableItemResult, FocusScope, ListKeyboardDelegate, mergeProps, useCollator, useFocus, useFocusRing, useHover, useListBox, useListBoxSection, useLocale, useOption} from 'react-aria';\nimport {\n ClassNameOrFunction,\n ContextValue,\n DEFAULT_SLOT,\n dom,\n DOMRenderProps,\n PossibleLinkDOMRenderProps,\n Provider,\n RenderProps,\n SlotProps,\n StyleProps,\n StyleRenderProps,\n useContextProps,\n useRenderProps,\n useSlot\n} from './utils';\nimport {Collection, CollectionBuilder, createBranchComponent, createLeafComponent, ItemNode, LoaderNode, SectionNode} from '@react-aria/collections';\nimport {CollectionProps, CollectionRendererContext, ItemRenderProps, SectionContext, SectionProps} from './Collection';\nimport {DragAndDropContext, DropIndicatorContext, DropIndicatorProps, useDndPersistedKeys, useRenderDropIndicator} from './DragAndDrop';\nimport {DragAndDropHooks} from './useDragAndDrop';\nimport {DraggableCollectionState, DroppableCollectionState, ListState, Node, Orientation, SelectionBehavior, UNSTABLE_useFilteredListState, useListState} from 'react-stately';\nimport {filterDOMProps, inertValue, LoadMoreSentinelProps, useLoadMoreSentinel, useObjectRef} from '@react-aria/utils';\nimport {FocusEvents, forwardRefType, GlobalDOMAttributes, HoverEvents, Key, LinkDOMProps, PressEvents, RefObject} from '@react-types/shared';\nimport {HeaderContext} from './Header';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useMemo, useRef} from 'react';\nimport {SelectableCollectionContext, SelectableCollectionContextValue} from './RSPContexts';\nimport {SelectionIndicatorContext} from './SelectionIndicator';\nimport {SeparatorContext} from './Separator';\nimport {SharedElementTransition} from './SharedElementTransition';\nimport {TextContext} from './Text';\n\nexport interface ListBoxRenderProps {\n /**\n * Whether the listbox has no items and should display its empty state.\n * @selector [data-empty]\n */\n isEmpty: boolean,\n /**\n * Whether the listbox is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the listbox is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the listbox is currently the active drop target.\n * @selector [data-drop-target]\n */\n isDropTarget: boolean,\n /**\n * Whether the items are arranged in a stack or grid.\n * @selector [data-layout=\"stack | grid\"]\n */\n layout: 'stack' | 'grid',\n /**\n * State of the listbox.\n */\n state: ListState<unknown>\n}\n\nexport interface ListBoxProps<T> extends Omit<AriaListBoxProps<T>, 'children' | 'label'>, CollectionProps<T>, StyleRenderProps<ListBoxRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-ListBox'\n */\n className?: ClassNameOrFunction<ListBoxRenderProps>,\n /**\n * How multiple selection should behave in the collection.\n * @default \"toggle\"\n */\n selectionBehavior?: SelectionBehavior,\n /** The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListBox. */\n dragAndDropHooks?: DragAndDropHooks<NoInfer<T>>,\n /** Provides content to display when there are no items in the list. */\n renderEmptyState?: (props: ListBoxRenderProps) => ReactNode,\n /**\n * Whether the items are arranged in a stack or grid.\n * @default 'stack'\n */\n layout?: 'stack' | 'grid',\n /**\n * The primary orientation of the items. Usually this is the\n * direction that the collection scrolls.\n * @default 'vertical'\n */\n orientation?: Orientation\n}\n\nexport const ListBoxContext = createContext<ContextValue<ListBoxProps<any>, HTMLDivElement>>(null);\nexport const ListStateContext = createContext<ListState<any> | null>(null);\n\n/**\n * A listbox displays a list of options and allows a user to select one or more of them.\n */\nexport const ListBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ListBox<T extends object>(props: ListBoxProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ListBoxContext);\n let state = useContext(ListStateContext);\n\n // The structure of ListBox is a bit strange because it needs to work inside other components like ComboBox and Select.\n // Those components render two copies of their children so that the collection can be built even when the popover is closed.\n // The first copy sends a collection document via context which we render the collection portal into.\n // The second copy sends a ListState object via context which we use to render the ListBox without rebuilding the state.\n // Otherwise, we have a standalone ListBox, so we need to create a collection and state ourselves.\n if (state) {\n return <ListBoxInner state={state} props={props} listBoxRef={ref} />;\n }\n\n return (\n <CollectionBuilder content={<Collection {...props} />}>\n {collection => <StandaloneListBox props={props} listBoxRef={ref} collection={collection} />}\n </CollectionBuilder>\n );\n});\n\nfunction StandaloneListBox({props, listBoxRef, collection}) {\n props = {...props, collection, children: null, items: null};\n let {layoutDelegate} = useContext(CollectionRendererContext);\n let state = useListState({...props, layoutDelegate});\n return <ListBoxInner state={state} props={props} listBoxRef={listBoxRef} />;\n}\n\ninterface ListBoxInnerProps<T> {\n state: ListState<T>,\n props: ListBoxProps<T> & AriaListBoxOptions<T> & {filter?: SelectableCollectionContextValue<T>['filter']},\n listBoxRef: RefObject<HTMLElement | null>\n}\n\nfunction ListBoxInner<T extends object>({state: inputState, props, listBoxRef}: ListBoxInnerProps<T>) {\n [props, listBoxRef] = useContextProps(props, listBoxRef, SelectableCollectionContext);\n let {dragAndDropHooks, layout = 'stack', orientation = 'vertical', filter} = props;\n let state = UNSTABLE_useFilteredListState(inputState, filter);\n let {collection, selectionManager} = state;\n let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n let {direction} = useLocale();\n let {disabledBehavior, disabledKeys} = selectionManager;\n let collator = useCollator({usage: 'search', sensitivity: 'base'});\n let {isVirtualized, layoutDelegate, dropTargetDelegate: ctxDropTargetDelegate, CollectionRoot} = useContext(CollectionRendererContext);\n let keyboardDelegate = useMemo(() => (\n props.keyboardDelegate || new ListKeyboardDelegate({\n collection,\n collator,\n ref: listBoxRef,\n disabledKeys,\n disabledBehavior,\n layout,\n orientation,\n direction,\n layoutDelegate\n })\n ), [collection, collator, listBoxRef, disabledBehavior, disabledKeys, orientation, direction, props.keyboardDelegate, layout, layoutDelegate]);\n\n let {listBoxProps} = useListBox({\n ...props,\n shouldSelectOnPressUp: isListDraggable || props.shouldSelectOnPressUp,\n keyboardDelegate,\n isVirtualized\n }, state, listBoxRef);\n\n let dragHooksProvided = useRef(isListDraggable);\n let dropHooksProvided = useRef(isListDroppable);\n useEffect(() => {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n if (dragHooksProvided.current !== isListDraggable) {\n console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n }\n if (dropHooksProvided.current !== isListDroppable) {\n console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n }\n }, [isListDraggable, isListDroppable]);\n\n let dragState: DraggableCollectionState | undefined = undefined;\n let dropState: DroppableCollectionState | undefined = undefined;\n let droppableCollection: DroppableCollectionResult | undefined = undefined;\n let isRootDropTarget = false;\n let dragPreview: JSX.Element | null = null;\n let preview = useRef<DragPreviewRenderer>(null);\n\n if (isListDraggable && dragAndDropHooks) {\n dragState = dragAndDropHooks.useDraggableCollectionState!({\n collection,\n selectionManager,\n preview: dragAndDropHooks.renderDragPreview ? preview : undefined\n });\n dragAndDropHooks.useDraggableCollection!({}, dragState, listBoxRef);\n\n let DragPreview = dragAndDropHooks.DragPreview!;\n dragPreview = dragAndDropHooks.renderDragPreview\n ? <DragPreview ref={preview}>{dragAndDropHooks.renderDragPreview}</DragPreview>\n : null;\n }\n\n if (isListDroppable && dragAndDropHooks) {\n dropState = dragAndDropHooks.useDroppableCollectionState!({\n collection,\n selectionManager\n });\n\n let dropTargetDelegate = dragAndDropHooks.dropTargetDelegate || ctxDropTargetDelegate || new dragAndDropHooks.ListDropTargetDelegate(collection, listBoxRef, {orientation, layout, direction});\n droppableCollection = dragAndDropHooks.useDroppableCollection!({\n keyboardDelegate,\n dropTargetDelegate\n }, dropState, listBoxRef);\n\n isRootDropTarget = dropState.isDropTarget({type: 'root'});\n }\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let isEmpty = state.collection.size === 0;\n let renderValues = {\n isDropTarget: isRootDropTarget,\n isEmpty,\n isFocused,\n isFocusVisible,\n layout: props.layout || 'stack',\n state\n };\n let renderProps = useRenderProps({\n ...props,\n children: undefined,\n defaultClassName: 'react-aria-ListBox',\n values: renderValues\n });\n\n let emptyState: JSX.Element | null = null;\n if (isEmpty && props.renderEmptyState) {\n emptyState = (\n <div\n // eslint-disable-next-line\n role=\"option\"\n style={{display: 'contents'}}>\n {props.renderEmptyState(renderValues)}\n </div>\n );\n }\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <FocusScope>\n <dom.div\n {...mergeProps(DOMProps, renderProps, listBoxProps, focusProps, droppableCollection?.collectionProps)}\n ref={listBoxRef as RefObject<HTMLDivElement>}\n slot={props.slot || undefined}\n onScroll={props.onScroll}\n data-drop-target={isRootDropTarget || undefined}\n data-empty={isEmpty || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-layout={props.layout || 'stack'}\n data-orientation={props.orientation || 'vertical'}>\n <Provider\n values={[\n [ListBoxContext, props],\n [ListStateContext, state],\n [DragAndDropContext, {dragAndDropHooks, dragState, dropState}],\n [SeparatorContext, {elementType: 'div'}],\n [DropIndicatorContext, {render: ListBoxDropIndicatorWrapper}],\n [SectionContext, {name: 'ListBoxSection', render: ListBoxSectionInner}]\n ]}>\n <SharedElementTransition>\n <CollectionRoot\n collection={collection}\n scrollRef={listBoxRef}\n persistedKeys={useDndPersistedKeys(selectionManager, dragAndDropHooks, dropState)}\n renderDropIndicator={useRenderDropIndicator(dragAndDropHooks, dropState)} />\n </SharedElementTransition>\n </Provider>\n {emptyState}\n {dragPreview}\n </dom.div>\n </FocusScope>\n );\n}\n\nexport interface ListBoxSectionProps<T> extends SectionProps<T>, DOMRenderProps<'section', undefined> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.\n * @default 'react-aria-ListBoxSection'\n */\n className?: string\n}\n\nfunction ListBoxSectionInner<T extends object>(props: ListBoxSectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>, className = 'react-aria-ListBoxSection') {\n let state = useContext(ListStateContext)!;\n let {dragAndDropHooks, dropState} = useContext(DragAndDropContext)!;\n let {CollectionBranch} = useContext(CollectionRendererContext);\n let [headingRef, heading] = useSlot();\n let {headingProps, groupProps} = useListBoxSection({\n heading,\n 'aria-label': props['aria-label'] ?? undefined\n });\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: undefined,\n defaultClassName: className,\n values: undefined\n });\n\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n\n return (\n <dom.section\n {...mergeProps(DOMProps, renderProps, groupProps)}\n ref={ref}>\n <HeaderContext.Provider value={{...headingProps, ref: headingRef}}>\n <CollectionBranch\n collection={state.collection}\n parent={section}\n renderDropIndicator={useRenderDropIndicator(dragAndDropHooks, dropState)} />\n </HeaderContext.Provider>\n </dom.section>\n );\n}\n\n/**\n * A ListBoxSection represents a section within a ListBox.\n */\nexport const ListBoxSection = /*#__PURE__*/ createBranchComponent(SectionNode, ListBoxSectionInner);\n\nexport interface ListBoxItemRenderProps extends ItemRenderProps {}\n\nexport interface ListBoxItemProps<T = object> extends Omit<RenderProps<ListBoxItemRenderProps>, 'render'>, PossibleLinkDOMRenderProps<'div', ListBoxItemRenderProps>, LinkDOMProps, HoverEvents, PressEvents, FocusEvents<HTMLDivElement>, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-ListBoxItem'\n */\n className?: ClassNameOrFunction<ListBoxItemRenderProps>,\n /** The unique id of the item. */\n id?: Key,\n /** The object value that this item represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** A string representation of the item's contents, used for features like typeahead. */\n textValue?: string,\n /** An accessibility label for this item. */\n 'aria-label'?: string,\n /** Whether the item is disabled. */\n isDisabled?: boolean,\n /**\n * Handler that is called when a user performs an action on the item. The exact user event depends on\n * the collection's `selectionBehavior` prop and the interaction modality.\n */\n onAction?: () => void\n}\n\n/**\n * A ListBoxItem represents an individual option in a ListBox.\n */\nexport const ListBoxItem = /*#__PURE__*/ createLeafComponent(ItemNode, function ListBoxItem<T extends object>(props: ListBoxItemProps<T>, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<T>) {\n let ref = useObjectRef<any>(forwardedRef);\n let state = useContext(ListStateContext)!;\n let {dragAndDropHooks, dragState, dropState} = useContext(DragAndDropContext)!;\n let {optionProps, labelProps, descriptionProps, ...states} = useOption(\n {key: item.key, 'aria-label': props?.['aria-label']},\n state,\n ref\n );\n\n let {hoverProps, isHovered} = useHover({\n isDisabled: !states.allowsSelection && !states.hasAction,\n onHoverStart: item.props.onHoverStart,\n onHoverChange: item.props.onHoverChange,\n onHoverEnd: item.props.onHoverEnd\n });\n\n let {focusProps} = useFocus(props);\n\n let draggableItem: DraggableItemResult | null = null;\n if (dragState && dragAndDropHooks) {\n draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasAction: states.hasAction}, dragState);\n }\n\n let droppableItem: DroppableItemResult | null = null;\n if (dropState && dragAndDropHooks) {\n droppableItem = dragAndDropHooks.useDroppableItem!({\n target: {type: 'item', key: item.key, dropPosition: 'on'}\n }, dropState, ref);\n }\n\n let isDragging = dragState && dragState.isDragging(item.key);\n let renderProps = useRenderProps<ListBoxItemRenderProps, any>({\n ...props,\n id: undefined,\n children: props.children,\n defaultClassName: 'react-aria-ListBoxItem',\n values: {\n ...states,\n isHovered,\n selectionMode: state.selectionManager.selectionMode,\n selectionBehavior: state.selectionManager.selectionBehavior,\n allowsDragging: !!dragState,\n isDragging,\n isDropTarget: droppableItem?.isDropTarget\n }\n });\n\n useEffect(() => {\n if (!item.textValue && process.env.NODE_ENV !== 'production') {\n console.warn('A `textValue` prop is required for <ListBoxItem> elements with non-plain text children in order to support accessibility features such as type to select.');\n }\n }, [item.textValue]);\n\n let ElementType = props.href ? dom.a : dom.div;\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n if (props.href && optionProps.tabIndex == null) {\n optionProps.tabIndex = -1;\n }\n\n return (\n <ElementType\n {...mergeProps(DOMProps, renderProps, optionProps, hoverProps, focusProps, draggableItem?.dragProps, droppableItem?.dropProps)}\n ref={ref}\n data-allows-dragging={!!dragState || undefined}\n data-selected={states.isSelected || undefined}\n data-disabled={states.isDisabled || undefined}\n data-hovered={isHovered || undefined}\n data-focused={states.isFocused || undefined}\n data-focus-visible={states.isFocusVisible || undefined}\n data-pressed={states.isPressed || undefined}\n data-dragging={isDragging || undefined}\n data-drop-target={droppableItem?.isDropTarget || undefined}\n data-selection-mode={state.selectionManager.selectionMode === 'none' ? undefined : state.selectionManager.selectionMode}>\n <Provider\n values={[\n [TextContext, {\n slots: {\n [DEFAULT_SLOT]: labelProps,\n label: labelProps,\n description: descriptionProps\n }\n }],\n [SelectionIndicatorContext, {isSelected: states.isSelected}]\n ]}>\n {renderProps.children}\n </Provider>\n </ElementType>\n );\n});\n\nfunction ListBoxDropIndicatorWrapper(props: DropIndicatorProps, ref: ForwardedRef<HTMLElement>) {\n ref = useObjectRef(ref);\n let {dragAndDropHooks, dropState} = useContext(DragAndDropContext)!;\n let {dropIndicatorProps, isHidden, isDropTarget} = dragAndDropHooks!.useDropIndicator!(\n props,\n dropState!,\n ref\n );\n\n if (isHidden) {\n return null;\n }\n\n return (\n <ListBoxDropIndicatorForwardRef {...props} dropIndicatorProps={dropIndicatorProps} isDropTarget={isDropTarget} ref={ref} />\n );\n}\n\ninterface ListBoxDropIndicatorProps extends DropIndicatorProps {\n dropIndicatorProps: React.HTMLAttributes<HTMLElement>,\n isDropTarget: boolean\n}\n\nfunction ListBoxDropIndicator(props: ListBoxDropIndicatorProps, ref: ForwardedRef<HTMLElement>) {\n let {\n dropIndicatorProps,\n isDropTarget,\n ...otherProps\n } = props;\n\n let renderProps = useRenderProps({\n ...otherProps,\n defaultClassName: 'react-aria-DropIndicator',\n values: {\n isDropTarget\n }\n });\n\n return (\n <dom.div\n {...dropIndicatorProps}\n {...renderProps}\n role=\"option\"\n ref={ref as RefObject<HTMLDivElement | null>}\n data-drop-target={isDropTarget || undefined} />\n );\n}\n\nconst ListBoxDropIndicatorForwardRef = forwardRef(ListBoxDropIndicator);\n\nexport interface ListBoxLoadMoreItemProps extends Omit<LoadMoreSentinelProps, 'collection'>, StyleProps, DOMRenderProps<'div', undefined>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.\n * @default 'react-aria-ListBoxLoadMoreItem'\n */\n className?: string,\n /**\n * The load more spinner to render when loading additional items.\n */\n children?: ReactNode,\n /**\n * Whether or not the loading spinner should be rendered or not.\n */\n isLoading?: boolean\n}\n\nexport const ListBoxLoadMoreItem = createLeafComponent(LoaderNode, function ListBoxLoadingIndicator(props: ListBoxLoadMoreItemProps, ref: ForwardedRef<HTMLDivElement>, item: Node<object>) {\n let state = useContext(ListStateContext)!;\n let {isLoading, onLoadMore, scrollOffset, ...otherProps} = props;\n\n let sentinelRef = useRef<HTMLDivElement>(null);\n let memoedLoadMoreProps = useMemo(() => ({\n onLoadMore,\n collection: state?.collection,\n sentinelRef,\n scrollOffset\n }), [onLoadMore, scrollOffset, state?.collection]);\n useLoadMoreSentinel(memoedLoadMoreProps, sentinelRef);\n let renderProps = useRenderProps({\n ...otherProps,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-ListBoxLoadingIndicator',\n values: undefined\n });\n\n let optionProps = {\n // For Android talkback\n tabIndex: -1\n // For now don't include aria-posinset and aria-setsize on loader since they aren't keyboard focusable\n // Arguably shouldn't include them ever since it might be confusing to the user to include the loaders as part of the\n // item count\n };\n\n return (\n <>\n {/* Alway render the sentinel. For now onus is on the user for styling when using flex + gap (this would introduce a gap even though it doesn't take room) */}\n {/* @ts-ignore - compatibility with React < 19 */}\n <div style={{position: 'relative', width: 0, height: 0}} inert={inertValue(true)} >\n <div data-testid=\"loadMoreSentinel\" ref={sentinelRef} style={{position: 'absolute', height: 1, width: 1}} />\n </div>\n {isLoading && renderProps.children && (\n <dom.div\n {...mergeProps(filterDOMProps(props, {global: true}), optionProps)}\n {...renderProps}\n // aria-selected isn't needed here since this option is not selectable.\n role=\"option\"\n ref={ref as ForwardedRef<HTMLDivElement>}>\n {renderProps.children}\n </dom.div>\n )}\n </>\n );\n});\n"],"names":[],"version":3,"file":"ListBox.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/react-aria-components/src/ListBox.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaListBoxOptions, AriaListBoxProps, DraggableItemResult, DragPreviewRenderer, DroppableCollectionResult, DroppableItemResult, FocusScope, ListKeyboardDelegate, mergeProps, useCollator, useFocus, useFocusRing, useHover, useKeyboard, useListBox, useListBoxSection, useLocale, useOption} from 'react-aria';\nimport {\n ClassNameOrFunction,\n ContextValue,\n DEFAULT_SLOT,\n dom,\n DOMRenderProps,\n PossibleLinkDOMRenderProps,\n Provider,\n RenderProps,\n SlotProps,\n StyleProps,\n StyleRenderProps,\n useContextProps,\n useRenderProps,\n useSlot\n} from './utils';\nimport {Collection, CollectionBuilder, createBranchComponent, createLeafComponent, ItemNode, LoaderNode, SectionNode} from '@react-aria/collections';\nimport {CollectionProps, CollectionRendererContext, ItemRenderProps, SectionContext, SectionProps} from './Collection';\nimport {DragAndDropContext, DropIndicatorContext, DropIndicatorProps, useDndPersistedKeys, useRenderDropIndicator} from './DragAndDrop';\nimport {DragAndDropHooks} from './useDragAndDrop';\nimport {DraggableCollectionState, DroppableCollectionState, ListState, Node, Orientation, SelectionBehavior, UNSTABLE_useFilteredListState, useListState} from 'react-stately';\nimport {filterDOMProps, inertValue, LoadMoreSentinelProps, useLoadMoreSentinel, useObjectRef} from '@react-aria/utils';\nimport {FocusEvents, forwardRefType, GlobalDOMAttributes, HoverEvents, Key, KeyboardEvents, LinkDOMProps, PressEvents, RefObject} from '@react-types/shared';\nimport {HeaderContext} from './Header';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useMemo, useRef} from 'react';\nimport {SelectableCollectionContext, SelectableCollectionContextValue} from './RSPContexts';\nimport {SelectionIndicatorContext} from './SelectionIndicator';\nimport {SeparatorContext} from './Separator';\nimport {SharedElementTransition} from './SharedElementTransition';\nimport {TextContext} from './Text';\n\nexport interface ListBoxRenderProps {\n /**\n * Whether the listbox has no items and should display its empty state.\n * @selector [data-empty]\n */\n isEmpty: boolean,\n /**\n * Whether the listbox is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the listbox is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the listbox is currently the active drop target.\n * @selector [data-drop-target]\n */\n isDropTarget: boolean,\n /**\n * Whether the items are arranged in a stack or grid.\n * @selector [data-layout=\"stack | grid\"]\n */\n layout: 'stack' | 'grid',\n /**\n * State of the listbox.\n */\n state: ListState<unknown>\n}\n\nexport interface ListBoxProps<T> extends Omit<AriaListBoxProps<T>, 'children' | 'label'>, CollectionProps<T>, StyleRenderProps<ListBoxRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-ListBox'\n */\n className?: ClassNameOrFunction<ListBoxRenderProps>,\n /**\n * How multiple selection should behave in the collection.\n * @default \"toggle\"\n */\n selectionBehavior?: SelectionBehavior,\n /** The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListBox. */\n dragAndDropHooks?: DragAndDropHooks<NoInfer<T>>,\n /** Provides content to display when there are no items in the list. */\n renderEmptyState?: (props: ListBoxRenderProps) => ReactNode,\n /**\n * Whether the items are arranged in a stack or grid.\n * @default 'stack'\n */\n layout?: 'stack' | 'grid',\n /**\n * The primary orientation of the items. Usually this is the\n * direction that the collection scrolls.\n * @default 'vertical'\n */\n orientation?: Orientation\n}\n\nexport const ListBoxContext = createContext<ContextValue<ListBoxProps<any>, HTMLDivElement>>(null);\nexport const ListStateContext = createContext<ListState<any> | null>(null);\n\n/**\n * A listbox displays a list of options and allows a user to select one or more of them.\n */\nexport const ListBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ListBox<T extends object>(props: ListBoxProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ListBoxContext);\n let state = useContext(ListStateContext);\n\n // The structure of ListBox is a bit strange because it needs to work inside other components like ComboBox and Select.\n // Those components render two copies of their children so that the collection can be built even when the popover is closed.\n // The first copy sends a collection document via context which we render the collection portal into.\n // The second copy sends a ListState object via context which we use to render the ListBox without rebuilding the state.\n // Otherwise, we have a standalone ListBox, so we need to create a collection and state ourselves.\n if (state) {\n return <ListBoxInner state={state} props={props} listBoxRef={ref} />;\n }\n\n return (\n <CollectionBuilder content={<Collection {...props} />}>\n {collection => <StandaloneListBox props={props} listBoxRef={ref} collection={collection} />}\n </CollectionBuilder>\n );\n});\n\nfunction StandaloneListBox({props, listBoxRef, collection}) {\n props = {...props, collection, children: null, items: null};\n let {layoutDelegate} = useContext(CollectionRendererContext);\n let state = useListState({...props, layoutDelegate});\n return <ListBoxInner state={state} props={props} listBoxRef={listBoxRef} />;\n}\n\ninterface ListBoxInnerProps<T> {\n state: ListState<T>,\n props: ListBoxProps<T> & AriaListBoxOptions<T> & {filter?: SelectableCollectionContextValue<T>['filter']},\n listBoxRef: RefObject<HTMLElement | null>\n}\n\nfunction ListBoxInner<T extends object>({state: inputState, props, listBoxRef}: ListBoxInnerProps<T>) {\n [props, listBoxRef] = useContextProps(props, listBoxRef, SelectableCollectionContext);\n let {dragAndDropHooks, layout = 'stack', orientation = 'vertical', filter} = props;\n let state = UNSTABLE_useFilteredListState(inputState, filter);\n let {collection, selectionManager} = state;\n let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n let {direction} = useLocale();\n let {disabledBehavior, disabledKeys} = selectionManager;\n let collator = useCollator({usage: 'search', sensitivity: 'base'});\n let {isVirtualized, layoutDelegate, dropTargetDelegate: ctxDropTargetDelegate, CollectionRoot} = useContext(CollectionRendererContext);\n let keyboardDelegate = useMemo(() => (\n props.keyboardDelegate || new ListKeyboardDelegate({\n collection,\n collator,\n ref: listBoxRef,\n disabledKeys,\n disabledBehavior,\n layout,\n orientation,\n direction,\n layoutDelegate\n })\n ), [collection, collator, listBoxRef, disabledBehavior, disabledKeys, orientation, direction, props.keyboardDelegate, layout, layoutDelegate]);\n\n let {listBoxProps} = useListBox({\n ...props,\n shouldSelectOnPressUp: isListDraggable || props.shouldSelectOnPressUp,\n keyboardDelegate,\n isVirtualized\n }, state, listBoxRef);\n\n let dragHooksProvided = useRef(isListDraggable);\n let dropHooksProvided = useRef(isListDroppable);\n useEffect(() => {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n if (dragHooksProvided.current !== isListDraggable) {\n console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n }\n if (dropHooksProvided.current !== isListDroppable) {\n console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n }\n }, [isListDraggable, isListDroppable]);\n\n let dragState: DraggableCollectionState | undefined = undefined;\n let dropState: DroppableCollectionState | undefined = undefined;\n let droppableCollection: DroppableCollectionResult | undefined = undefined;\n let isRootDropTarget = false;\n let dragPreview: JSX.Element | null = null;\n let preview = useRef<DragPreviewRenderer>(null);\n\n if (isListDraggable && dragAndDropHooks) {\n dragState = dragAndDropHooks.useDraggableCollectionState!({\n collection,\n selectionManager,\n preview: dragAndDropHooks.renderDragPreview ? preview : undefined\n });\n dragAndDropHooks.useDraggableCollection!({}, dragState, listBoxRef);\n\n let DragPreview = dragAndDropHooks.DragPreview!;\n dragPreview = dragAndDropHooks.renderDragPreview\n ? <DragPreview ref={preview}>{dragAndDropHooks.renderDragPreview}</DragPreview>\n : null;\n }\n\n if (isListDroppable && dragAndDropHooks) {\n dropState = dragAndDropHooks.useDroppableCollectionState!({\n collection,\n selectionManager\n });\n\n let dropTargetDelegate = dragAndDropHooks.dropTargetDelegate || ctxDropTargetDelegate || new dragAndDropHooks.ListDropTargetDelegate(collection, listBoxRef, {orientation, layout, direction});\n droppableCollection = dragAndDropHooks.useDroppableCollection!({\n keyboardDelegate,\n dropTargetDelegate\n }, dropState, listBoxRef);\n\n isRootDropTarget = dropState.isDropTarget({type: 'root'});\n }\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let isEmpty = state.collection.size === 0;\n let renderValues = {\n isDropTarget: isRootDropTarget,\n isEmpty,\n isFocused,\n isFocusVisible,\n layout: props.layout || 'stack',\n state\n };\n let renderProps = useRenderProps({\n ...props,\n children: undefined,\n defaultClassName: 'react-aria-ListBox',\n values: renderValues\n });\n\n let emptyState: JSX.Element | null = null;\n if (isEmpty && props.renderEmptyState) {\n emptyState = (\n <div\n // eslint-disable-next-line\n role=\"option\"\n style={{display: 'contents'}}>\n {props.renderEmptyState(renderValues)}\n </div>\n );\n }\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <FocusScope>\n <dom.div\n {...mergeProps(DOMProps, renderProps, listBoxProps, focusProps, droppableCollection?.collectionProps)}\n ref={listBoxRef as RefObject<HTMLDivElement>}\n slot={props.slot || undefined}\n onScroll={props.onScroll}\n data-drop-target={isRootDropTarget || undefined}\n data-empty={isEmpty || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-layout={props.layout || 'stack'}\n data-orientation={props.orientation || 'vertical'}>\n <Provider\n values={[\n [ListBoxContext, props],\n [ListStateContext, state],\n [DragAndDropContext, {dragAndDropHooks, dragState, dropState}],\n [SeparatorContext, {elementType: 'div'}],\n [DropIndicatorContext, {render: ListBoxDropIndicatorWrapper}],\n [SectionContext, {name: 'ListBoxSection', render: ListBoxSectionInner}]\n ]}>\n <SharedElementTransition>\n <CollectionRoot\n collection={collection}\n scrollRef={listBoxRef}\n persistedKeys={useDndPersistedKeys(selectionManager, dragAndDropHooks, dropState)}\n renderDropIndicator={useRenderDropIndicator(dragAndDropHooks, dropState)} />\n </SharedElementTransition>\n </Provider>\n {emptyState}\n {dragPreview}\n </dom.div>\n </FocusScope>\n );\n}\n\nexport interface ListBoxSectionProps<T> extends SectionProps<T>, DOMRenderProps<'section', undefined> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.\n * @default 'react-aria-ListBoxSection'\n */\n className?: string\n}\n\nfunction ListBoxSectionInner<T extends object>(props: ListBoxSectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>, className = 'react-aria-ListBoxSection') {\n let state = useContext(ListStateContext)!;\n let {dragAndDropHooks, dropState} = useContext(DragAndDropContext)!;\n let {CollectionBranch} = useContext(CollectionRendererContext);\n let [headingRef, heading] = useSlot();\n let {headingProps, groupProps} = useListBoxSection({\n heading,\n 'aria-label': props['aria-label'] ?? undefined\n });\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: undefined,\n defaultClassName: className,\n values: undefined\n });\n\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n\n return (\n <dom.section\n {...mergeProps(DOMProps, renderProps, groupProps)}\n ref={ref}>\n <HeaderContext.Provider value={{...headingProps, ref: headingRef}}>\n <CollectionBranch\n collection={state.collection}\n parent={section}\n renderDropIndicator={useRenderDropIndicator(dragAndDropHooks, dropState)} />\n </HeaderContext.Provider>\n </dom.section>\n );\n}\n\n/**\n * A ListBoxSection represents a section within a ListBox.\n */\nexport const ListBoxSection = /*#__PURE__*/ createBranchComponent(SectionNode, ListBoxSectionInner);\n\nexport interface ListBoxItemRenderProps extends ItemRenderProps {}\n\nexport interface ListBoxItemProps<T = object> extends Omit<RenderProps<ListBoxItemRenderProps>, 'render'>, PossibleLinkDOMRenderProps<'div', ListBoxItemRenderProps>, LinkDOMProps, HoverEvents, PressEvents, KeyboardEvents, FocusEvents<HTMLDivElement>, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-ListBoxItem'\n */\n className?: ClassNameOrFunction<ListBoxItemRenderProps>,\n /** The unique id of the item. */\n id?: Key,\n /** The object value that this item represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** A string representation of the item's contents, used for features like typeahead. */\n textValue?: string,\n /** An accessibility label for this item. */\n 'aria-label'?: string,\n /** Whether the item is disabled. */\n isDisabled?: boolean,\n /**\n * Handler that is called when a user performs an action on the item. The exact user event depends on\n * the collection's `selectionBehavior` prop and the interaction modality.\n */\n onAction?: () => void\n}\n\n/**\n * A ListBoxItem represents an individual option in a ListBox.\n */\nexport const ListBoxItem = /*#__PURE__*/ createLeafComponent(ItemNode, function ListBoxItem<T extends object>(props: ListBoxItemProps<T>, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<T>) {\n let ref = useObjectRef<any>(forwardedRef);\n let state = useContext(ListStateContext)!;\n let {dragAndDropHooks, dragState, dropState} = useContext(DragAndDropContext)!;\n let {optionProps, labelProps, descriptionProps, ...states} = useOption(\n {key: item.key, 'aria-label': props?.['aria-label']},\n state,\n ref\n );\n\n let {hoverProps, isHovered} = useHover({\n isDisabled: !states.allowsSelection && !states.hasAction,\n onHoverStart: item.props.onHoverStart,\n onHoverChange: item.props.onHoverChange,\n onHoverEnd: item.props.onHoverEnd\n });\n\n let {keyboardProps} = useKeyboard(props);\n let {focusProps} = useFocus(props);\n\n let draggableItem: DraggableItemResult | null = null;\n if (dragState && dragAndDropHooks) {\n draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasAction: states.hasAction}, dragState);\n }\n\n let droppableItem: DroppableItemResult | null = null;\n if (dropState && dragAndDropHooks) {\n droppableItem = dragAndDropHooks.useDroppableItem!({\n target: {type: 'item', key: item.key, dropPosition: 'on'}\n }, dropState, ref);\n }\n\n let isDragging = dragState && dragState.isDragging(item.key);\n let renderProps = useRenderProps<ListBoxItemRenderProps, any>({\n ...props,\n id: undefined,\n children: props.children,\n defaultClassName: 'react-aria-ListBoxItem',\n values: {\n ...states,\n isHovered,\n selectionMode: state.selectionManager.selectionMode,\n selectionBehavior: state.selectionManager.selectionBehavior,\n allowsDragging: !!dragState,\n isDragging,\n isDropTarget: droppableItem?.isDropTarget\n }\n });\n\n useEffect(() => {\n if (!item.textValue && process.env.NODE_ENV !== 'production') {\n console.warn('A `textValue` prop is required for <ListBoxItem> elements with non-plain text children in order to support accessibility features such as type to select.');\n }\n }, [item.textValue]);\n\n let ElementType = props.href ? dom.a : dom.div;\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n if (props.href && optionProps.tabIndex == null) {\n optionProps.tabIndex = -1;\n }\n\n return (\n <ElementType\n {...mergeProps(DOMProps, renderProps, optionProps, hoverProps, keyboardProps, focusProps, draggableItem?.dragProps, droppableItem?.dropProps)}\n ref={ref}\n data-allows-dragging={!!dragState || undefined}\n data-selected={states.isSelected || undefined}\n data-disabled={states.isDisabled || undefined}\n data-hovered={isHovered || undefined}\n data-focused={states.isFocused || undefined}\n data-focus-visible={states.isFocusVisible || undefined}\n data-pressed={states.isPressed || undefined}\n data-dragging={isDragging || undefined}\n data-drop-target={droppableItem?.isDropTarget || undefined}\n data-selection-mode={state.selectionManager.selectionMode === 'none' ? undefined : state.selectionManager.selectionMode}>\n <Provider\n values={[\n [TextContext, {\n slots: {\n [DEFAULT_SLOT]: labelProps,\n label: labelProps,\n description: descriptionProps\n }\n }],\n [SelectionIndicatorContext, {isSelected: states.isSelected}]\n ]}>\n {renderProps.children}\n </Provider>\n </ElementType>\n );\n});\n\nfunction ListBoxDropIndicatorWrapper(props: DropIndicatorProps, ref: ForwardedRef<HTMLElement>) {\n ref = useObjectRef(ref);\n let {dragAndDropHooks, dropState} = useContext(DragAndDropContext)!;\n let {dropIndicatorProps, isHidden, isDropTarget} = dragAndDropHooks!.useDropIndicator!(\n props,\n dropState!,\n ref\n );\n\n if (isHidden) {\n return null;\n }\n\n return (\n <ListBoxDropIndicatorForwardRef {...props} dropIndicatorProps={dropIndicatorProps} isDropTarget={isDropTarget} ref={ref} />\n );\n}\n\ninterface ListBoxDropIndicatorProps extends DropIndicatorProps {\n dropIndicatorProps: React.HTMLAttributes<HTMLElement>,\n isDropTarget: boolean\n}\n\nfunction ListBoxDropIndicator(props: ListBoxDropIndicatorProps, ref: ForwardedRef<HTMLElement>) {\n let {\n dropIndicatorProps,\n isDropTarget,\n ...otherProps\n } = props;\n\n let renderProps = useRenderProps({\n ...otherProps,\n defaultClassName: 'react-aria-DropIndicator',\n values: {\n isDropTarget\n }\n });\n\n return (\n <dom.div\n {...dropIndicatorProps}\n {...renderProps}\n role=\"option\"\n ref={ref as RefObject<HTMLDivElement | null>}\n data-drop-target={isDropTarget || undefined} />\n );\n}\n\nconst ListBoxDropIndicatorForwardRef = forwardRef(ListBoxDropIndicator);\n\nexport interface ListBoxLoadMoreItemProps extends Omit<LoadMoreSentinelProps, 'collection'>, StyleProps, DOMRenderProps<'div', undefined>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.\n * @default 'react-aria-ListBoxLoadMoreItem'\n */\n className?: string,\n /**\n * The load more spinner to render when loading additional items.\n */\n children?: ReactNode,\n /**\n * Whether or not the loading spinner should be rendered or not.\n */\n isLoading?: boolean\n}\n\nexport const ListBoxLoadMoreItem = createLeafComponent(LoaderNode, function ListBoxLoadingIndicator(props: ListBoxLoadMoreItemProps, ref: ForwardedRef<HTMLDivElement>, item: Node<object>) {\n let state = useContext(ListStateContext)!;\n let {isLoading, onLoadMore, scrollOffset, ...otherProps} = props;\n\n let sentinelRef = useRef<HTMLDivElement>(null);\n let memoedLoadMoreProps = useMemo(() => ({\n onLoadMore,\n collection: state?.collection,\n sentinelRef,\n scrollOffset\n }), [onLoadMore, scrollOffset, state?.collection]);\n useLoadMoreSentinel(memoedLoadMoreProps, sentinelRef);\n let renderProps = useRenderProps({\n ...otherProps,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-ListBoxLoadingIndicator',\n values: undefined\n });\n\n let optionProps = {\n // For Android talkback\n tabIndex: -1\n // For now don't include aria-posinset and aria-setsize on loader since they aren't keyboard focusable\n // Arguably shouldn't include them ever since it might be confusing to the user to include the loaders as part of the\n // item count\n };\n\n return (\n <>\n {/* Alway render the sentinel. For now onus is on the user for styling when using flex + gap (this would introduce a gap even though it doesn't take room) */}\n {/* @ts-ignore - compatibility with React < 19 */}\n <div style={{position: 'relative', width: 0, height: 0}} inert={inertValue(true)} >\n <div data-testid=\"loadMoreSentinel\" ref={sentinelRef} style={{position: 'absolute', height: 1, width: 1}} />\n </div>\n {isLoading && renderProps.children && (\n <dom.div\n {...mergeProps(filterDOMProps(props, {global: true}), optionProps)}\n {...renderProps}\n // aria-selected isn't needed here since this option is not selectable.\n role=\"option\"\n ref={ref as ForwardedRef<HTMLDivElement>}>\n {renderProps.children}\n </dom.div>\n )}\n </>\n );\n});\n"],"names":[],"version":3,"file":"ListBox.main.js.map"}
|
package/dist/ListBox.mjs
CHANGED
|
@@ -7,7 +7,7 @@ import {SelectionIndicatorContext as $1d5b8b8664671ef2$export$c9549807523555e0}
|
|
|
7
7
|
import {SeparatorContext as $431f98aba6844401$export$6615d83f6de245ce} from "./Separator.mjs";
|
|
8
8
|
import {SharedElementTransition as $c8a5a149f625efcf$export$758399f318e6385a} from "./SharedElementTransition.mjs";
|
|
9
9
|
import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.mjs";
|
|
10
|
-
import {useLocale as $e8Bmu$useLocale, useCollator as $e8Bmu$useCollator, ListKeyboardDelegate as $e8Bmu$ListKeyboardDelegate, useListBox as $e8Bmu$useListBox, useFocusRing as $e8Bmu$useFocusRing, FocusScope as $e8Bmu$FocusScope, mergeProps as $e8Bmu$mergeProps, useListBoxSection as $e8Bmu$useListBoxSection, useOption as $e8Bmu$useOption, useHover as $e8Bmu$useHover, useFocus as $e8Bmu$useFocus} from "react-aria";
|
|
10
|
+
import {useLocale as $e8Bmu$useLocale, useCollator as $e8Bmu$useCollator, ListKeyboardDelegate as $e8Bmu$ListKeyboardDelegate, useListBox as $e8Bmu$useListBox, useFocusRing as $e8Bmu$useFocusRing, FocusScope as $e8Bmu$FocusScope, mergeProps as $e8Bmu$mergeProps, useListBoxSection as $e8Bmu$useListBoxSection, useOption as $e8Bmu$useOption, useHover as $e8Bmu$useHover, useKeyboard as $e8Bmu$useKeyboard, useFocus as $e8Bmu$useFocus} from "react-aria";
|
|
11
11
|
import {CollectionBuilder as $e8Bmu$CollectionBuilder, Collection as $e8Bmu$Collection, createBranchComponent as $e8Bmu$createBranchComponent, SectionNode as $e8Bmu$SectionNode, createLeafComponent as $e8Bmu$createLeafComponent, ItemNode as $e8Bmu$ItemNode, LoaderNode as $e8Bmu$LoaderNode} from "@react-aria/collections";
|
|
12
12
|
import {useListState as $e8Bmu$useListState, UNSTABLE_useFilteredListState as $e8Bmu$UNSTABLE_useFilteredListState} from "react-stately";
|
|
13
13
|
import {filterDOMProps as $e8Bmu$filterDOMProps, useObjectRef as $e8Bmu$useObjectRef, useLoadMoreSentinel as $e8Bmu$useLoadMoreSentinel, inertValue as $e8Bmu$inertValue} from "@react-aria/utils";
|
|
@@ -299,6 +299,7 @@ const $eed445e0843c11d0$export$a11e76429ed99b4 = /*#__PURE__*/ (0, $e8Bmu$create
|
|
|
299
299
|
onHoverChange: item.props.onHoverChange,
|
|
300
300
|
onHoverEnd: item.props.onHoverEnd
|
|
301
301
|
});
|
|
302
|
+
let { keyboardProps: keyboardProps } = (0, $e8Bmu$useKeyboard)(props);
|
|
302
303
|
let { focusProps: focusProps } = (0, $e8Bmu$useFocus)(props);
|
|
303
304
|
let draggableItem = null;
|
|
304
305
|
if (dragState && dragAndDropHooks) draggableItem = dragAndDropHooks.useDraggableItem({
|
|
@@ -342,7 +343,7 @@ const $eed445e0843c11d0$export$a11e76429ed99b4 = /*#__PURE__*/ (0, $e8Bmu$create
|
|
|
342
343
|
delete DOMProps.onClick;
|
|
343
344
|
if (props.href && optionProps.tabIndex == null) optionProps.tabIndex = -1;
|
|
344
345
|
return /*#__PURE__*/ (0, $e8Bmu$react).createElement(ElementType, {
|
|
345
|
-
...(0, $e8Bmu$mergeProps)(DOMProps, renderProps, optionProps, hoverProps, focusProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps),
|
|
346
|
+
...(0, $e8Bmu$mergeProps)(DOMProps, renderProps, optionProps, hoverProps, keyboardProps, focusProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps),
|
|
346
347
|
ref: ref,
|
|
347
348
|
"data-allows-dragging": !!dragState || undefined,
|
|
348
349
|
"data-selected": states.isSelected || undefined,
|
package/dist/ListBox.module.js
CHANGED
|
@@ -7,7 +7,7 @@ import {SelectionIndicatorContext as $1d5b8b8664671ef2$export$c9549807523555e0}
|
|
|
7
7
|
import {SeparatorContext as $431f98aba6844401$export$6615d83f6de245ce} from "./Separator.module.js";
|
|
8
8
|
import {SharedElementTransition as $c8a5a149f625efcf$export$758399f318e6385a} from "./SharedElementTransition.module.js";
|
|
9
9
|
import {TextContext as $514c0188e459b4c0$export$9afb8bc826b033ea} from "./Text.module.js";
|
|
10
|
-
import {useLocale as $e8Bmu$useLocale, useCollator as $e8Bmu$useCollator, ListKeyboardDelegate as $e8Bmu$ListKeyboardDelegate, useListBox as $e8Bmu$useListBox, useFocusRing as $e8Bmu$useFocusRing, FocusScope as $e8Bmu$FocusScope, mergeProps as $e8Bmu$mergeProps, useListBoxSection as $e8Bmu$useListBoxSection, useOption as $e8Bmu$useOption, useHover as $e8Bmu$useHover, useFocus as $e8Bmu$useFocus} from "react-aria";
|
|
10
|
+
import {useLocale as $e8Bmu$useLocale, useCollator as $e8Bmu$useCollator, ListKeyboardDelegate as $e8Bmu$ListKeyboardDelegate, useListBox as $e8Bmu$useListBox, useFocusRing as $e8Bmu$useFocusRing, FocusScope as $e8Bmu$FocusScope, mergeProps as $e8Bmu$mergeProps, useListBoxSection as $e8Bmu$useListBoxSection, useOption as $e8Bmu$useOption, useHover as $e8Bmu$useHover, useKeyboard as $e8Bmu$useKeyboard, useFocus as $e8Bmu$useFocus} from "react-aria";
|
|
11
11
|
import {CollectionBuilder as $e8Bmu$CollectionBuilder, Collection as $e8Bmu$Collection, createBranchComponent as $e8Bmu$createBranchComponent, SectionNode as $e8Bmu$SectionNode, createLeafComponent as $e8Bmu$createLeafComponent, ItemNode as $e8Bmu$ItemNode, LoaderNode as $e8Bmu$LoaderNode} from "@react-aria/collections";
|
|
12
12
|
import {useListState as $e8Bmu$useListState, UNSTABLE_useFilteredListState as $e8Bmu$UNSTABLE_useFilteredListState} from "react-stately";
|
|
13
13
|
import {filterDOMProps as $e8Bmu$filterDOMProps, useObjectRef as $e8Bmu$useObjectRef, useLoadMoreSentinel as $e8Bmu$useLoadMoreSentinel, inertValue as $e8Bmu$inertValue} from "@react-aria/utils";
|
|
@@ -299,6 +299,7 @@ const $eed445e0843c11d0$export$a11e76429ed99b4 = /*#__PURE__*/ (0, $e8Bmu$create
|
|
|
299
299
|
onHoverChange: item.props.onHoverChange,
|
|
300
300
|
onHoverEnd: item.props.onHoverEnd
|
|
301
301
|
});
|
|
302
|
+
let { keyboardProps: keyboardProps } = (0, $e8Bmu$useKeyboard)(props);
|
|
302
303
|
let { focusProps: focusProps } = (0, $e8Bmu$useFocus)(props);
|
|
303
304
|
let draggableItem = null;
|
|
304
305
|
if (dragState && dragAndDropHooks) draggableItem = dragAndDropHooks.useDraggableItem({
|
|
@@ -342,7 +343,7 @@ const $eed445e0843c11d0$export$a11e76429ed99b4 = /*#__PURE__*/ (0, $e8Bmu$create
|
|
|
342
343
|
delete DOMProps.onClick;
|
|
343
344
|
if (props.href && optionProps.tabIndex == null) optionProps.tabIndex = -1;
|
|
344
345
|
return /*#__PURE__*/ (0, $e8Bmu$react).createElement(ElementType, {
|
|
345
|
-
...(0, $e8Bmu$mergeProps)(DOMProps, renderProps, optionProps, hoverProps, focusProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps),
|
|
346
|
+
...(0, $e8Bmu$mergeProps)(DOMProps, renderProps, optionProps, hoverProps, keyboardProps, focusProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps),
|
|
346
347
|
ref: ref,
|
|
347
348
|
"data-allows-dragging": !!dragState || undefined,
|
|
348
349
|
"data-selected": states.isSelected || undefined,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/react-aria-components/src/ListBox.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaListBoxOptions, AriaListBoxProps, DraggableItemResult, DragPreviewRenderer, DroppableCollectionResult, DroppableItemResult, FocusScope, ListKeyboardDelegate, mergeProps, useCollator, useFocus, useFocusRing, useHover, useListBox, useListBoxSection, useLocale, useOption} from 'react-aria';\nimport {\n ClassNameOrFunction,\n ContextValue,\n DEFAULT_SLOT,\n dom,\n DOMRenderProps,\n PossibleLinkDOMRenderProps,\n Provider,\n RenderProps,\n SlotProps,\n StyleProps,\n StyleRenderProps,\n useContextProps,\n useRenderProps,\n useSlot\n} from './utils';\nimport {Collection, CollectionBuilder, createBranchComponent, createLeafComponent, ItemNode, LoaderNode, SectionNode} from '@react-aria/collections';\nimport {CollectionProps, CollectionRendererContext, ItemRenderProps, SectionContext, SectionProps} from './Collection';\nimport {DragAndDropContext, DropIndicatorContext, DropIndicatorProps, useDndPersistedKeys, useRenderDropIndicator} from './DragAndDrop';\nimport {DragAndDropHooks} from './useDragAndDrop';\nimport {DraggableCollectionState, DroppableCollectionState, ListState, Node, Orientation, SelectionBehavior, UNSTABLE_useFilteredListState, useListState} from 'react-stately';\nimport {filterDOMProps, inertValue, LoadMoreSentinelProps, useLoadMoreSentinel, useObjectRef} from '@react-aria/utils';\nimport {FocusEvents, forwardRefType, GlobalDOMAttributes, HoverEvents, Key, LinkDOMProps, PressEvents, RefObject} from '@react-types/shared';\nimport {HeaderContext} from './Header';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useMemo, useRef} from 'react';\nimport {SelectableCollectionContext, SelectableCollectionContextValue} from './RSPContexts';\nimport {SelectionIndicatorContext} from './SelectionIndicator';\nimport {SeparatorContext} from './Separator';\nimport {SharedElementTransition} from './SharedElementTransition';\nimport {TextContext} from './Text';\n\nexport interface ListBoxRenderProps {\n /**\n * Whether the listbox has no items and should display its empty state.\n * @selector [data-empty]\n */\n isEmpty: boolean,\n /**\n * Whether the listbox is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the listbox is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the listbox is currently the active drop target.\n * @selector [data-drop-target]\n */\n isDropTarget: boolean,\n /**\n * Whether the items are arranged in a stack or grid.\n * @selector [data-layout=\"stack | grid\"]\n */\n layout: 'stack' | 'grid',\n /**\n * State of the listbox.\n */\n state: ListState<unknown>\n}\n\nexport interface ListBoxProps<T> extends Omit<AriaListBoxProps<T>, 'children' | 'label'>, CollectionProps<T>, StyleRenderProps<ListBoxRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-ListBox'\n */\n className?: ClassNameOrFunction<ListBoxRenderProps>,\n /**\n * How multiple selection should behave in the collection.\n * @default \"toggle\"\n */\n selectionBehavior?: SelectionBehavior,\n /** The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListBox. */\n dragAndDropHooks?: DragAndDropHooks<NoInfer<T>>,\n /** Provides content to display when there are no items in the list. */\n renderEmptyState?: (props: ListBoxRenderProps) => ReactNode,\n /**\n * Whether the items are arranged in a stack or grid.\n * @default 'stack'\n */\n layout?: 'stack' | 'grid',\n /**\n * The primary orientation of the items. Usually this is the\n * direction that the collection scrolls.\n * @default 'vertical'\n */\n orientation?: Orientation\n}\n\nexport const ListBoxContext = createContext<ContextValue<ListBoxProps<any>, HTMLDivElement>>(null);\nexport const ListStateContext = createContext<ListState<any> | null>(null);\n\n/**\n * A listbox displays a list of options and allows a user to select one or more of them.\n */\nexport const ListBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ListBox<T extends object>(props: ListBoxProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ListBoxContext);\n let state = useContext(ListStateContext);\n\n // The structure of ListBox is a bit strange because it needs to work inside other components like ComboBox and Select.\n // Those components render two copies of their children so that the collection can be built even when the popover is closed.\n // The first copy sends a collection document via context which we render the collection portal into.\n // The second copy sends a ListState object via context which we use to render the ListBox without rebuilding the state.\n // Otherwise, we have a standalone ListBox, so we need to create a collection and state ourselves.\n if (state) {\n return <ListBoxInner state={state} props={props} listBoxRef={ref} />;\n }\n\n return (\n <CollectionBuilder content={<Collection {...props} />}>\n {collection => <StandaloneListBox props={props} listBoxRef={ref} collection={collection} />}\n </CollectionBuilder>\n );\n});\n\nfunction StandaloneListBox({props, listBoxRef, collection}) {\n props = {...props, collection, children: null, items: null};\n let {layoutDelegate} = useContext(CollectionRendererContext);\n let state = useListState({...props, layoutDelegate});\n return <ListBoxInner state={state} props={props} listBoxRef={listBoxRef} />;\n}\n\ninterface ListBoxInnerProps<T> {\n state: ListState<T>,\n props: ListBoxProps<T> & AriaListBoxOptions<T> & {filter?: SelectableCollectionContextValue<T>['filter']},\n listBoxRef: RefObject<HTMLElement | null>\n}\n\nfunction ListBoxInner<T extends object>({state: inputState, props, listBoxRef}: ListBoxInnerProps<T>) {\n [props, listBoxRef] = useContextProps(props, listBoxRef, SelectableCollectionContext);\n let {dragAndDropHooks, layout = 'stack', orientation = 'vertical', filter} = props;\n let state = UNSTABLE_useFilteredListState(inputState, filter);\n let {collection, selectionManager} = state;\n let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n let {direction} = useLocale();\n let {disabledBehavior, disabledKeys} = selectionManager;\n let collator = useCollator({usage: 'search', sensitivity: 'base'});\n let {isVirtualized, layoutDelegate, dropTargetDelegate: ctxDropTargetDelegate, CollectionRoot} = useContext(CollectionRendererContext);\n let keyboardDelegate = useMemo(() => (\n props.keyboardDelegate || new ListKeyboardDelegate({\n collection,\n collator,\n ref: listBoxRef,\n disabledKeys,\n disabledBehavior,\n layout,\n orientation,\n direction,\n layoutDelegate\n })\n ), [collection, collator, listBoxRef, disabledBehavior, disabledKeys, orientation, direction, props.keyboardDelegate, layout, layoutDelegate]);\n\n let {listBoxProps} = useListBox({\n ...props,\n shouldSelectOnPressUp: isListDraggable || props.shouldSelectOnPressUp,\n keyboardDelegate,\n isVirtualized\n }, state, listBoxRef);\n\n let dragHooksProvided = useRef(isListDraggable);\n let dropHooksProvided = useRef(isListDroppable);\n useEffect(() => {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n if (dragHooksProvided.current !== isListDraggable) {\n console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n }\n if (dropHooksProvided.current !== isListDroppable) {\n console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n }\n }, [isListDraggable, isListDroppable]);\n\n let dragState: DraggableCollectionState | undefined = undefined;\n let dropState: DroppableCollectionState | undefined = undefined;\n let droppableCollection: DroppableCollectionResult | undefined = undefined;\n let isRootDropTarget = false;\n let dragPreview: JSX.Element | null = null;\n let preview = useRef<DragPreviewRenderer>(null);\n\n if (isListDraggable && dragAndDropHooks) {\n dragState = dragAndDropHooks.useDraggableCollectionState!({\n collection,\n selectionManager,\n preview: dragAndDropHooks.renderDragPreview ? preview : undefined\n });\n dragAndDropHooks.useDraggableCollection!({}, dragState, listBoxRef);\n\n let DragPreview = dragAndDropHooks.DragPreview!;\n dragPreview = dragAndDropHooks.renderDragPreview\n ? <DragPreview ref={preview}>{dragAndDropHooks.renderDragPreview}</DragPreview>\n : null;\n }\n\n if (isListDroppable && dragAndDropHooks) {\n dropState = dragAndDropHooks.useDroppableCollectionState!({\n collection,\n selectionManager\n });\n\n let dropTargetDelegate = dragAndDropHooks.dropTargetDelegate || ctxDropTargetDelegate || new dragAndDropHooks.ListDropTargetDelegate(collection, listBoxRef, {orientation, layout, direction});\n droppableCollection = dragAndDropHooks.useDroppableCollection!({\n keyboardDelegate,\n dropTargetDelegate\n }, dropState, listBoxRef);\n\n isRootDropTarget = dropState.isDropTarget({type: 'root'});\n }\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let isEmpty = state.collection.size === 0;\n let renderValues = {\n isDropTarget: isRootDropTarget,\n isEmpty,\n isFocused,\n isFocusVisible,\n layout: props.layout || 'stack',\n state\n };\n let renderProps = useRenderProps({\n ...props,\n children: undefined,\n defaultClassName: 'react-aria-ListBox',\n values: renderValues\n });\n\n let emptyState: JSX.Element | null = null;\n if (isEmpty && props.renderEmptyState) {\n emptyState = (\n <div\n // eslint-disable-next-line\n role=\"option\"\n style={{display: 'contents'}}>\n {props.renderEmptyState(renderValues)}\n </div>\n );\n }\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <FocusScope>\n <dom.div\n {...mergeProps(DOMProps, renderProps, listBoxProps, focusProps, droppableCollection?.collectionProps)}\n ref={listBoxRef as RefObject<HTMLDivElement>}\n slot={props.slot || undefined}\n onScroll={props.onScroll}\n data-drop-target={isRootDropTarget || undefined}\n data-empty={isEmpty || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-layout={props.layout || 'stack'}\n data-orientation={props.orientation || 'vertical'}>\n <Provider\n values={[\n [ListBoxContext, props],\n [ListStateContext, state],\n [DragAndDropContext, {dragAndDropHooks, dragState, dropState}],\n [SeparatorContext, {elementType: 'div'}],\n [DropIndicatorContext, {render: ListBoxDropIndicatorWrapper}],\n [SectionContext, {name: 'ListBoxSection', render: ListBoxSectionInner}]\n ]}>\n <SharedElementTransition>\n <CollectionRoot\n collection={collection}\n scrollRef={listBoxRef}\n persistedKeys={useDndPersistedKeys(selectionManager, dragAndDropHooks, dropState)}\n renderDropIndicator={useRenderDropIndicator(dragAndDropHooks, dropState)} />\n </SharedElementTransition>\n </Provider>\n {emptyState}\n {dragPreview}\n </dom.div>\n </FocusScope>\n );\n}\n\nexport interface ListBoxSectionProps<T> extends SectionProps<T>, DOMRenderProps<'section', undefined> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.\n * @default 'react-aria-ListBoxSection'\n */\n className?: string\n}\n\nfunction ListBoxSectionInner<T extends object>(props: ListBoxSectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>, className = 'react-aria-ListBoxSection') {\n let state = useContext(ListStateContext)!;\n let {dragAndDropHooks, dropState} = useContext(DragAndDropContext)!;\n let {CollectionBranch} = useContext(CollectionRendererContext);\n let [headingRef, heading] = useSlot();\n let {headingProps, groupProps} = useListBoxSection({\n heading,\n 'aria-label': props['aria-label'] ?? undefined\n });\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: undefined,\n defaultClassName: className,\n values: undefined\n });\n\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n\n return (\n <dom.section\n {...mergeProps(DOMProps, renderProps, groupProps)}\n ref={ref}>\n <HeaderContext.Provider value={{...headingProps, ref: headingRef}}>\n <CollectionBranch\n collection={state.collection}\n parent={section}\n renderDropIndicator={useRenderDropIndicator(dragAndDropHooks, dropState)} />\n </HeaderContext.Provider>\n </dom.section>\n );\n}\n\n/**\n * A ListBoxSection represents a section within a ListBox.\n */\nexport const ListBoxSection = /*#__PURE__*/ createBranchComponent(SectionNode, ListBoxSectionInner);\n\nexport interface ListBoxItemRenderProps extends ItemRenderProps {}\n\nexport interface ListBoxItemProps<T = object> extends Omit<RenderProps<ListBoxItemRenderProps>, 'render'>, PossibleLinkDOMRenderProps<'div', ListBoxItemRenderProps>, LinkDOMProps, HoverEvents, PressEvents, FocusEvents<HTMLDivElement>, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-ListBoxItem'\n */\n className?: ClassNameOrFunction<ListBoxItemRenderProps>,\n /** The unique id of the item. */\n id?: Key,\n /** The object value that this item represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** A string representation of the item's contents, used for features like typeahead. */\n textValue?: string,\n /** An accessibility label for this item. */\n 'aria-label'?: string,\n /** Whether the item is disabled. */\n isDisabled?: boolean,\n /**\n * Handler that is called when a user performs an action on the item. The exact user event depends on\n * the collection's `selectionBehavior` prop and the interaction modality.\n */\n onAction?: () => void\n}\n\n/**\n * A ListBoxItem represents an individual option in a ListBox.\n */\nexport const ListBoxItem = /*#__PURE__*/ createLeafComponent(ItemNode, function ListBoxItem<T extends object>(props: ListBoxItemProps<T>, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<T>) {\n let ref = useObjectRef<any>(forwardedRef);\n let state = useContext(ListStateContext)!;\n let {dragAndDropHooks, dragState, dropState} = useContext(DragAndDropContext)!;\n let {optionProps, labelProps, descriptionProps, ...states} = useOption(\n {key: item.key, 'aria-label': props?.['aria-label']},\n state,\n ref\n );\n\n let {hoverProps, isHovered} = useHover({\n isDisabled: !states.allowsSelection && !states.hasAction,\n onHoverStart: item.props.onHoverStart,\n onHoverChange: item.props.onHoverChange,\n onHoverEnd: item.props.onHoverEnd\n });\n\n let {focusProps} = useFocus(props);\n\n let draggableItem: DraggableItemResult | null = null;\n if (dragState && dragAndDropHooks) {\n draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasAction: states.hasAction}, dragState);\n }\n\n let droppableItem: DroppableItemResult | null = null;\n if (dropState && dragAndDropHooks) {\n droppableItem = dragAndDropHooks.useDroppableItem!({\n target: {type: 'item', key: item.key, dropPosition: 'on'}\n }, dropState, ref);\n }\n\n let isDragging = dragState && dragState.isDragging(item.key);\n let renderProps = useRenderProps<ListBoxItemRenderProps, any>({\n ...props,\n id: undefined,\n children: props.children,\n defaultClassName: 'react-aria-ListBoxItem',\n values: {\n ...states,\n isHovered,\n selectionMode: state.selectionManager.selectionMode,\n selectionBehavior: state.selectionManager.selectionBehavior,\n allowsDragging: !!dragState,\n isDragging,\n isDropTarget: droppableItem?.isDropTarget\n }\n });\n\n useEffect(() => {\n if (!item.textValue && process.env.NODE_ENV !== 'production') {\n console.warn('A `textValue` prop is required for <ListBoxItem> elements with non-plain text children in order to support accessibility features such as type to select.');\n }\n }, [item.textValue]);\n\n let ElementType = props.href ? dom.a : dom.div;\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n if (props.href && optionProps.tabIndex == null) {\n optionProps.tabIndex = -1;\n }\n\n return (\n <ElementType\n {...mergeProps(DOMProps, renderProps, optionProps, hoverProps, focusProps, draggableItem?.dragProps, droppableItem?.dropProps)}\n ref={ref}\n data-allows-dragging={!!dragState || undefined}\n data-selected={states.isSelected || undefined}\n data-disabled={states.isDisabled || undefined}\n data-hovered={isHovered || undefined}\n data-focused={states.isFocused || undefined}\n data-focus-visible={states.isFocusVisible || undefined}\n data-pressed={states.isPressed || undefined}\n data-dragging={isDragging || undefined}\n data-drop-target={droppableItem?.isDropTarget || undefined}\n data-selection-mode={state.selectionManager.selectionMode === 'none' ? undefined : state.selectionManager.selectionMode}>\n <Provider\n values={[\n [TextContext, {\n slots: {\n [DEFAULT_SLOT]: labelProps,\n label: labelProps,\n description: descriptionProps\n }\n }],\n [SelectionIndicatorContext, {isSelected: states.isSelected}]\n ]}>\n {renderProps.children}\n </Provider>\n </ElementType>\n );\n});\n\nfunction ListBoxDropIndicatorWrapper(props: DropIndicatorProps, ref: ForwardedRef<HTMLElement>) {\n ref = useObjectRef(ref);\n let {dragAndDropHooks, dropState} = useContext(DragAndDropContext)!;\n let {dropIndicatorProps, isHidden, isDropTarget} = dragAndDropHooks!.useDropIndicator!(\n props,\n dropState!,\n ref\n );\n\n if (isHidden) {\n return null;\n }\n\n return (\n <ListBoxDropIndicatorForwardRef {...props} dropIndicatorProps={dropIndicatorProps} isDropTarget={isDropTarget} ref={ref} />\n );\n}\n\ninterface ListBoxDropIndicatorProps extends DropIndicatorProps {\n dropIndicatorProps: React.HTMLAttributes<HTMLElement>,\n isDropTarget: boolean\n}\n\nfunction ListBoxDropIndicator(props: ListBoxDropIndicatorProps, ref: ForwardedRef<HTMLElement>) {\n let {\n dropIndicatorProps,\n isDropTarget,\n ...otherProps\n } = props;\n\n let renderProps = useRenderProps({\n ...otherProps,\n defaultClassName: 'react-aria-DropIndicator',\n values: {\n isDropTarget\n }\n });\n\n return (\n <dom.div\n {...dropIndicatorProps}\n {...renderProps}\n role=\"option\"\n ref={ref as RefObject<HTMLDivElement | null>}\n data-drop-target={isDropTarget || undefined} />\n );\n}\n\nconst ListBoxDropIndicatorForwardRef = forwardRef(ListBoxDropIndicator);\n\nexport interface ListBoxLoadMoreItemProps extends Omit<LoadMoreSentinelProps, 'collection'>, StyleProps, DOMRenderProps<'div', undefined>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.\n * @default 'react-aria-ListBoxLoadMoreItem'\n */\n className?: string,\n /**\n * The load more spinner to render when loading additional items.\n */\n children?: ReactNode,\n /**\n * Whether or not the loading spinner should be rendered or not.\n */\n isLoading?: boolean\n}\n\nexport const ListBoxLoadMoreItem = createLeafComponent(LoaderNode, function ListBoxLoadingIndicator(props: ListBoxLoadMoreItemProps, ref: ForwardedRef<HTMLDivElement>, item: Node<object>) {\n let state = useContext(ListStateContext)!;\n let {isLoading, onLoadMore, scrollOffset, ...otherProps} = props;\n\n let sentinelRef = useRef<HTMLDivElement>(null);\n let memoedLoadMoreProps = useMemo(() => ({\n onLoadMore,\n collection: state?.collection,\n sentinelRef,\n scrollOffset\n }), [onLoadMore, scrollOffset, state?.collection]);\n useLoadMoreSentinel(memoedLoadMoreProps, sentinelRef);\n let renderProps = useRenderProps({\n ...otherProps,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-ListBoxLoadingIndicator',\n values: undefined\n });\n\n let optionProps = {\n // For Android talkback\n tabIndex: -1\n // For now don't include aria-posinset and aria-setsize on loader since they aren't keyboard focusable\n // Arguably shouldn't include them ever since it might be confusing to the user to include the loaders as part of the\n // item count\n };\n\n return (\n <>\n {/* Alway render the sentinel. For now onus is on the user for styling when using flex + gap (this would introduce a gap even though it doesn't take room) */}\n {/* @ts-ignore - compatibility with React < 19 */}\n <div style={{position: 'relative', width: 0, height: 0}} inert={inertValue(true)} >\n <div data-testid=\"loadMoreSentinel\" ref={sentinelRef} style={{position: 'absolute', height: 1, width: 1}} />\n </div>\n {isLoading && renderProps.children && (\n <dom.div\n {...mergeProps(filterDOMProps(props, {global: true}), optionProps)}\n {...renderProps}\n // aria-selected isn't needed here since this option is not selectable.\n role=\"option\"\n ref={ref as ForwardedRef<HTMLDivElement>}>\n {renderProps.children}\n </dom.div>\n )}\n </>\n );\n});\n"],"names":[],"version":3,"file":"ListBox.module.js.map"}
|
|
1
|
+
{"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;AA8FM,MAAM,0DAAiB,CAAA,GAAA,oBAAY,EAAmD;AACtF,MAAM,0DAAmB,CAAA,GAAA,oBAAY,EAAyB;AAK9D,MAAM,4CAAwB,AAAd,WAAW,GAAI,CAAA,GAAA,iBAAS,EAAqB,SAAS,QAA0B,KAAsB,EAAE,GAAiC;IAC9J,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,KAAK;IAC3C,IAAI,QAAQ,CAAA,GAAA,iBAAS,EAAE;IAEvB,uHAAuH;IACvH,4HAA4H;IAC5H,qGAAqG;IACrG,wHAAwH;IACxH,kGAAkG;IAClG,IAAI,OACF,qBAAO,gCAAC;QAAa,OAAO;QAAO,OAAO;QAAO,YAAY;;IAG/D,qBACE,gCAAC,CAAA,GAAA,wBAAgB;QAAE,uBAAS,gCAAC,CAAA,GAAA,iBAAS,GAAM;OACzC,CAAA,2BAAc,gCAAC;YAAkB,OAAO;YAAO,YAAY;YAAK,YAAY;;AAGnF;AAEA,SAAS,wCAAkB,SAAC,KAAK,cAAE,UAAU,cAAE,UAAU,EAAC;IACxD,QAAQ;QAAC,GAAG,KAAK;oBAAE;QAAY,UAAU;QAAM,OAAO;IAAI;IAC1D,IAAI,kBAAC,cAAc,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAwB;IAC1D,IAAI,QAAQ,CAAA,GAAA,mBAAW,EAAE;QAAC,GAAG,KAAK;wBAAE;IAAc;IAClD,qBAAO,gCAAC;QAAa,OAAO;QAAO,OAAO;QAAO,YAAY;;AAC/D;AAQA,SAAS,mCAA+B,EAAC,OAAO,UAAU,SAAE,KAAK,cAAE,UAAU,EAAuB;IAClG,CAAC,OAAO,WAAW,GAAG,CAAA,GAAA,yCAAc,EAAE,OAAO,YAAY,CAAA,GAAA,yCAA0B;IACnF,IAAI,oBAAC,gBAAgB,UAAE,SAAS,sBAAS,cAAc,oBAAY,MAAM,EAAC,GAAG;IAC7E,IAAI,QAAQ,CAAA,GAAA,oCAA4B,EAAE,YAAY;IACtD,IAAI,cAAC,UAAU,oBAAE,gBAAgB,EAAC,GAAG;IACrC,IAAI,kBAAkB,CAAC,EAAC,6BAAA,uCAAA,iBAAkB,2BAA2B;IACrE,IAAI,kBAAkB,CAAC,EAAC,6BAAA,uCAAA,iBAAkB,2BAA2B;IACrE,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAC1B,IAAI,oBAAC,gBAAgB,gBAAE,YAAY,EAAC,GAAG;IACvC,IAAI,WAAW,CAAA,GAAA,kBAAU,EAAE;QAAC,OAAO;QAAU,aAAa;IAAM;IAChE,IAAI,iBAAC,aAAa,kBAAE,cAAc,EAAE,oBAAoB,qBAAqB,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAwB;IACpI,IAAI,mBAAmB,CAAA,GAAA,cAAM,EAAE,IAC7B,MAAM,gBAAgB,IAAI,IAAI,CAAA,GAAA,2BAAmB,EAAE;wBACjD;sBACA;YACA,KAAK;0BACL;8BACA;oBACA;yBACA;uBACA;4BACA;QACF,IACC;QAAC;QAAY;QAAU;QAAY;QAAkB;QAAc;QAAa;QAAW,MAAM,gBAAgB;QAAE;QAAQ;KAAe;IAE7I,IAAI,gBAAC,YAAY,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;QAC9B,GAAG,KAAK;QACR,uBAAuB,mBAAmB,MAAM,qBAAqB;0BACrE;uBACA;IACF,GAAG,OAAO;IAEV,IAAI,oBAAoB,CAAA,GAAA,aAAK,EAAE;IAC/B,IAAI,oBAAoB,CAAA,GAAA,aAAK,EAAE;IAC/B,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAC3B;QAEF,IAAI,kBAAkB,OAAO,KAAK,iBAChC,QAAQ,IAAI,CAAC;QAEf,IAAI,kBAAkB,OAAO,KAAK,iBAChC,QAAQ,IAAI,CAAC;IAEjB,GAAG;QAAC;QAAiB;KAAgB;IAErC,IAAI,YAAkD;IACtD,IAAI,YAAkD;IACtD,IAAI,sBAA6D;IACjE,IAAI,mBAAmB;IACvB,IAAI,cAAkC;IACtC,IAAI,UAAU,CAAA,GAAA,aAAK,EAAuB;IAE1C,IAAI,mBAAmB,kBAAkB;QACvC,YAAY,iBAAiB,2BAA2B,CAAE;wBACxD;8BACA;YACA,SAAS,iBAAiB,iBAAiB,GAAG,UAAU;QAC1D;QACA,iBAAiB,sBAAsB,CAAE,CAAC,GAAG,WAAW;QAExD,IAAI,cAAc,iBAAiB,WAAW;QAC9C,cAAc,iBAAiB,iBAAiB,iBAC5C,gCAAC;YAAY,KAAK;WAAU,iBAAiB,iBAAiB,IAC9D;IACN;IAEA,IAAI,mBAAmB,kBAAkB;QACvC,YAAY,iBAAiB,2BAA2B,CAAE;wBACxD;8BACA;QACF;QAEA,IAAI,qBAAqB,iBAAiB,kBAAkB,IAAI,yBAAyB,IAAI,iBAAiB,sBAAsB,CAAC,YAAY,YAAY;yBAAC;oBAAa;uBAAQ;QAAS;QAC5L,sBAAsB,iBAAiB,sBAAsB,CAAE;8BAC7D;gCACA;QACF,GAAG,WAAW;QAEd,mBAAmB,UAAU,YAAY,CAAC;YAAC,MAAM;QAAM;IACzD;IAEA,IAAI,cAAC,UAAU,aAAE,SAAS,kBAAE,cAAc,EAAC,GAAG,CAAA,GAAA,mBAAW;IACzD,IAAI,UAAU,MAAM,UAAU,CAAC,IAAI,KAAK;IACxC,IAAI,eAAe;QACjB,cAAc;iBACd;mBACA;wBACA;QACA,QAAQ,MAAM,MAAM,IAAI;eACxB;IACF;IACA,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,UAAU;QACV,kBAAkB;QAClB,QAAQ;IACV;IAEA,IAAI,aAAiC;IACrC,IAAI,WAAW,MAAM,gBAAgB,EACnC,2BACE,gCAAC;QACC,2BAA2B;QAC3B,MAAK;QACL,OAAO;YAAC,SAAS;QAAU;OAC1B,MAAM,gBAAgB,CAAC;IAK9B,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAO;QAAC,QAAQ;IAAI;IAElD,qBACE,gCAAC,CAAA,GAAA,iBAAS,uBACR,gCAAC,CAAA,GAAA,yCAAE,EAAE,GAAG;QACL,GAAG,CAAA,GAAA,iBAAS,EAAE,UAAU,aAAa,cAAc,YAAY,gCAAA,0CAAA,oBAAqB,eAAe,CAAC;QACrG,KAAK;QACL,MAAM,MAAM,IAAI,IAAI;QACpB,UAAU,MAAM,QAAQ;QACxB,oBAAkB,oBAAoB;QACtC,cAAY,WAAW;QACvB,gBAAc,aAAa;QAC3B,sBAAoB,kBAAkB;QACtC,eAAa,MAAM,MAAM,IAAI;QAC7B,oBAAkB,MAAM,WAAW,IAAI;qBACvC,gCAAC,CAAA,GAAA,yCAAO;QACN,QAAQ;YACN;gBAAC;gBAAgB;aAAM;YACvB;gBAAC;gBAAkB;aAAM;YACzB;gBAAC,CAAA,GAAA,yCAAiB;gBAAG;sCAAC;+BAAkB;+BAAW;gBAAS;aAAE;YAC9D;gBAAC,CAAA,GAAA,yCAAe;gBAAG;oBAAC,aAAa;gBAAK;aAAE;YACxC;gBAAC,CAAA,GAAA,yCAAmB;gBAAG;oBAAC,QAAQ;gBAA2B;aAAE;YAC7D;gBAAC,CAAA,GAAA,yCAAa;gBAAG;oBAAC,MAAM;oBAAkB,QAAQ;gBAAmB;aAAE;SACxE;qBACD,gCAAC,CAAA,GAAA,yCAAsB,uBACrB,gCAAC;QACC,YAAY;QACZ,WAAW;QACX,eAAe,CAAA,GAAA,wCAAkB,EAAE,kBAAkB,kBAAkB;QACvE,qBAAqB,CAAA,GAAA,yCAAqB,EAAE,kBAAkB;UAGnE,YACA;AAIT;AAUA,SAAS,0CAAsC,KAA6B,EAAE,GAA8B,EAAE,OAAgB,EAAE,YAAY,2BAA2B;IACrK,IAAI,QAAQ,CAAA,GAAA,iBAAS,EAAE;IACvB,IAAI,oBAAC,gBAAgB,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAiB;IAChE,IAAI,oBAAC,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAwB;IAC5D,IAAI,CAAC,YAAY,QAAQ,GAAG,CAAA,GAAA,yCAAM;QAGlB;IAFhB,IAAI,gBAAC,YAAY,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,wBAAgB,EAAE;iBACjD;QACA,cAAc,CAAA,mBAAA,KAAK,CAAC,aAAa,cAAnB,8BAAA,mBAAuB;IACvC;IACA,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,KAAK;QACR,IAAI;QACJ,UAAU;QACV,kBAAkB;QAClB,QAAQ;IACV;IAEA,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAc;QAAC,QAAQ;IAAI;IACzD,OAAO,SAAS,EAAE;IAElB,qBACE,gCAAC,CAAA,GAAA,yCAAE,EAAE,OAAO;QACT,GAAG,CAAA,GAAA,iBAAS,EAAE,UAAU,aAAa,WAAW;QACjD,KAAK;qBACL,gCAAC,CAAA,GAAA,yCAAY,EAAE,QAAQ;QAAC,OAAO;YAAC,GAAG,YAAY;YAAE,KAAK;QAAU;qBAC9D,gCAAC;QACC,YAAY,MAAM,UAAU;QAC5B,QAAQ;QACR,qBAAqB,CAAA,GAAA,yCAAqB,EAAE,kBAAkB;;AAIxE;AAKO,MAAM,2CAAiB,WAAW,GAAG,CAAA,GAAA,4BAAoB,EAAE,CAAA,GAAA,kBAAU,GAAG;AA8BxE,MAAM,2CAAc,WAAW,GAAG,CAAA,GAAA,0BAAkB,EAAE,CAAA,GAAA,eAAO,GAAG,SAAS,YAA8B,KAA0B,EAAE,YAA0C,EAAE,IAAa;IACjM,IAAI,MAAM,CAAA,GAAA,mBAAW,EAAO;IAC5B,IAAI,QAAQ,CAAA,GAAA,iBAAS,EAAE;IACvB,IAAI,oBAAC,gBAAgB,aAAE,SAAS,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAiB;IAC3E,IAAI,eAAC,WAAW,cAAE,UAAU,oBAAE,gBAAgB,EAAE,GAAG,QAAO,GAAG,CAAA,GAAA,gBAAQ,EACnE;QAAC,KAAK,KAAK,GAAG;QAAE,YAAY,EAAE,kBAAA,4BAAA,KAAO,CAAC,aAAa;IAAA,GACnD,OACA;IAGF,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QACrC,YAAY,CAAC,OAAO,eAAe,IAAI,CAAC,OAAO,SAAS;QACxD,cAAc,KAAK,KAAK,CAAC,YAAY;QACrC,eAAe,KAAK,KAAK,CAAC,aAAa;QACvC,YAAY,KAAK,KAAK,CAAC,UAAU;IACnC;IAEA,IAAI,iBAAC,aAAa,EAAC,GAAG,CAAA,GAAA,kBAAU,EAAE;IAClC,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;IAE5B,IAAI,gBAA4C;IAChD,IAAI,aAAa,kBACf,gBAAgB,iBAAiB,gBAAgB,CAAE;QAAC,KAAK,KAAK,GAAG;QAAE,WAAW,OAAO,SAAS;IAAA,GAAG;IAGnG,IAAI,gBAA4C;IAChD,IAAI,aAAa,kBACf,gBAAgB,iBAAiB,gBAAgB,CAAE;QACjD,QAAQ;YAAC,MAAM;YAAQ,KAAK,KAAK,GAAG;YAAE,cAAc;QAAI;IAC1D,GAAG,WAAW;IAGhB,IAAI,aAAa,aAAa,UAAU,UAAU,CAAC,KAAK,GAAG;IAC3D,IAAI,cAAc,CAAA,GAAA,uCAAa,EAA+B;QAC5D,GAAG,KAAK;QACR,IAAI;QACJ,UAAU,MAAM,QAAQ;QACxB,kBAAkB;QAClB,QAAQ;YACN,GAAG,MAAM;uBACT;YACA,eAAe,MAAM,gBAAgB,CAAC,aAAa;YACnD,mBAAmB,MAAM,gBAAgB,CAAC,iBAAiB;YAC3D,gBAAgB,CAAC,CAAC;wBAClB;YACA,YAAY,EAAE,0BAAA,oCAAA,cAAe,YAAY;QAC3C;IACF;IAEA,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,CAAC,KAAK,SAAS,IAAI,QAAQ,GAAG,CAAC,QAAQ,KAAK,cAC9C,QAAQ,IAAI,CAAC;IAEjB,GAAG;QAAC,KAAK,SAAS;KAAC;IAEnB,IAAI,cAAc,MAAM,IAAI,GAAG,CAAA,GAAA,yCAAE,EAAE,CAAC,GAAG,CAAA,GAAA,yCAAE,EAAE,GAAG;IAC9C,IAAI,WAAW,CAAA,GAAA,qBAAa,EAAE,OAAc;QAAC,QAAQ;IAAI;IACzD,OAAO,SAAS,EAAE;IAClB,OAAO,SAAS,OAAO;IAEvB,IAAI,MAAM,IAAI,IAAI,YAAY,QAAQ,IAAI,MACxC,YAAY,QAAQ,GAAG;IAGzB,qBACE,gCAAC;QACE,GAAG,CAAA,GAAA,iBAAS,EAAE,UAAU,aAAa,aAAa,YAAY,eAAe,YAAY,0BAAA,oCAAA,cAAe,SAAS,EAAE,0BAAA,oCAAA,cAAe,SAAS,CAAC;QAC7I,KAAK;QACL,wBAAsB,CAAC,CAAC,aAAa;QACrC,iBAAe,OAAO,UAAU,IAAI;QACpC,iBAAe,OAAO,UAAU,IAAI;QACpC,gBAAc,aAAa;QAC3B,gBAAc,OAAO,SAAS,IAAI;QAClC,sBAAoB,OAAO,cAAc,IAAI;QAC7C,gBAAc,OAAO,SAAS,IAAI;QAClC,iBAAe,cAAc;QAC7B,oBAAkB,CAAA,0BAAA,oCAAA,cAAe,YAAY,KAAI;QACjD,uBAAqB,MAAM,gBAAgB,CAAC,aAAa,KAAK,SAAS,YAAY,MAAM,gBAAgB,CAAC,aAAa;qBACvH,gCAAC,CAAA,GAAA,yCAAO;QACN,QAAQ;YACN;gBAAC,CAAA,GAAA,yCAAU;gBAAG;oBACZ,OAAO;wBACL,CAAC,CAAA,GAAA,yCAAW,EAAE,EAAE;wBAChB,OAAO;wBACP,aAAa;oBACf;gBACF;aAAE;YACF;gBAAC,CAAA,GAAA,yCAAwB;gBAAG;oBAAC,YAAY,OAAO,UAAU;gBAAA;aAAE;SAC7D;OACA,YAAY,QAAQ;AAI7B;AAEA,SAAS,kDAA4B,KAAyB,EAAE,GAA8B;IAC5F,MAAM,CAAA,GAAA,mBAAW,EAAE;IACnB,IAAI,oBAAC,gBAAgB,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAiB;IAChE,IAAI,sBAAC,kBAAkB,YAAE,QAAQ,gBAAE,YAAY,EAAC,GAAG,iBAAkB,gBAAgB,CACnF,OACA,WACA;IAGF,IAAI,UACF,OAAO;IAGT,qBACE,gCAAC;QAAgC,GAAG,KAAK;QAAE,oBAAoB;QAAoB,cAAc;QAAc,KAAK;;AAExH;AAOA,SAAS,2CAAqB,KAAgC,EAAE,GAA8B;IAC5F,IAAI,sBACF,kBAAkB,gBAClB,YAAY,EACZ,GAAG,YACJ,GAAG;IAEJ,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,UAAU;QACb,kBAAkB;QAClB,QAAQ;0BACN;QACF;IACF;IAEA,qBACE,gCAAC,CAAA,GAAA,yCAAE,EAAE,GAAG;QACL,GAAG,kBAAkB;QACrB,GAAG,WAAW;QACf,MAAK;QACL,KAAK;QACL,oBAAkB,gBAAgB;;AAExC;AAEA,MAAM,qEAAiC,CAAA,GAAA,iBAAS,EAAE;AAkB3C,MAAM,4CAAsB,CAAA,GAAA,0BAAkB,EAAE,CAAA,GAAA,iBAAS,GAAG,SAAS,wBAAwB,KAA+B,EAAE,GAAiC,EAAE,IAAkB;IACxL,IAAI,QAAQ,CAAA,GAAA,iBAAS,EAAE;IACvB,IAAI,aAAC,SAAS,cAAE,UAAU,gBAAE,YAAY,EAAE,GAAG,YAAW,GAAG;IAE3D,IAAI,cAAc,CAAA,GAAA,aAAK,EAAkB;IACzC,IAAI,sBAAsB,CAAA,GAAA,cAAM,EAAE,IAAO,CAAA;wBACvC;YACA,UAAU,EAAE,kBAAA,4BAAA,MAAO,UAAU;yBAC7B;0BACA;QACF,CAAA,GAAI;QAAC;QAAY;QAAc,kBAAA,4BAAA,MAAO,UAAU;KAAC;IACjD,CAAA,GAAA,0BAAkB,EAAE,qBAAqB;IACzC,IAAI,cAAc,CAAA,GAAA,uCAAa,EAAE;QAC/B,GAAG,UAAU;QACb,IAAI;QACJ,UAAU,KAAK,QAAQ;QACvB,kBAAkB;QAClB,QAAQ;IACV;IAEA,IAAI,cAAc;QAChB,uBAAuB;QACvB,UAAU;IAIZ;IAEA,qBACE,gFAGE,gCAAC;QAAI,OAAO;YAAC,UAAU;YAAY,OAAO;YAAG,QAAQ;QAAC;QAAG,OAAO,CAAA,GAAA,iBAAS,EAAE;qBACzE,gCAAC;QAAI,eAAY;QAAmB,KAAK;QAAa,OAAO;YAAC,UAAU;YAAY,QAAQ;YAAG,OAAO;QAAC;SAExG,aAAa,YAAY,QAAQ,kBAChC,gCAAC,CAAA,GAAA,yCAAE,EAAE,GAAG;QACL,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,qBAAa,EAAE,OAAO;YAAC,QAAQ;QAAI,IAAI,YAAY;QACjE,GAAG,WAAW;QACf,uEAAuE;QACvE,MAAK;QACL,KAAK;OACJ,YAAY,QAAQ;AAK/B","sources":["packages/react-aria-components/src/ListBox.tsx"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaListBoxOptions, AriaListBoxProps, DraggableItemResult, DragPreviewRenderer, DroppableCollectionResult, DroppableItemResult, FocusScope, ListKeyboardDelegate, mergeProps, useCollator, useFocus, useFocusRing, useHover, useKeyboard, useListBox, useListBoxSection, useLocale, useOption} from 'react-aria';\nimport {\n ClassNameOrFunction,\n ContextValue,\n DEFAULT_SLOT,\n dom,\n DOMRenderProps,\n PossibleLinkDOMRenderProps,\n Provider,\n RenderProps,\n SlotProps,\n StyleProps,\n StyleRenderProps,\n useContextProps,\n useRenderProps,\n useSlot\n} from './utils';\nimport {Collection, CollectionBuilder, createBranchComponent, createLeafComponent, ItemNode, LoaderNode, SectionNode} from '@react-aria/collections';\nimport {CollectionProps, CollectionRendererContext, ItemRenderProps, SectionContext, SectionProps} from './Collection';\nimport {DragAndDropContext, DropIndicatorContext, DropIndicatorProps, useDndPersistedKeys, useRenderDropIndicator} from './DragAndDrop';\nimport {DragAndDropHooks} from './useDragAndDrop';\nimport {DraggableCollectionState, DroppableCollectionState, ListState, Node, Orientation, SelectionBehavior, UNSTABLE_useFilteredListState, useListState} from 'react-stately';\nimport {filterDOMProps, inertValue, LoadMoreSentinelProps, useLoadMoreSentinel, useObjectRef} from '@react-aria/utils';\nimport {FocusEvents, forwardRefType, GlobalDOMAttributes, HoverEvents, Key, KeyboardEvents, LinkDOMProps, PressEvents, RefObject} from '@react-types/shared';\nimport {HeaderContext} from './Header';\nimport React, {createContext, ForwardedRef, forwardRef, JSX, ReactNode, useContext, useEffect, useMemo, useRef} from 'react';\nimport {SelectableCollectionContext, SelectableCollectionContextValue} from './RSPContexts';\nimport {SelectionIndicatorContext} from './SelectionIndicator';\nimport {SeparatorContext} from './Separator';\nimport {SharedElementTransition} from './SharedElementTransition';\nimport {TextContext} from './Text';\n\nexport interface ListBoxRenderProps {\n /**\n * Whether the listbox has no items and should display its empty state.\n * @selector [data-empty]\n */\n isEmpty: boolean,\n /**\n * Whether the listbox is currently focused.\n * @selector [data-focused]\n */\n isFocused: boolean,\n /**\n * Whether the listbox is currently keyboard focused.\n * @selector [data-focus-visible]\n */\n isFocusVisible: boolean,\n /**\n * Whether the listbox is currently the active drop target.\n * @selector [data-drop-target]\n */\n isDropTarget: boolean,\n /**\n * Whether the items are arranged in a stack or grid.\n * @selector [data-layout=\"stack | grid\"]\n */\n layout: 'stack' | 'grid',\n /**\n * State of the listbox.\n */\n state: ListState<unknown>\n}\n\nexport interface ListBoxProps<T> extends Omit<AriaListBoxProps<T>, 'children' | 'label'>, CollectionProps<T>, StyleRenderProps<ListBoxRenderProps>, SlotProps, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-ListBox'\n */\n className?: ClassNameOrFunction<ListBoxRenderProps>,\n /**\n * How multiple selection should behave in the collection.\n * @default \"toggle\"\n */\n selectionBehavior?: SelectionBehavior,\n /** The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListBox. */\n dragAndDropHooks?: DragAndDropHooks<NoInfer<T>>,\n /** Provides content to display when there are no items in the list. */\n renderEmptyState?: (props: ListBoxRenderProps) => ReactNode,\n /**\n * Whether the items are arranged in a stack or grid.\n * @default 'stack'\n */\n layout?: 'stack' | 'grid',\n /**\n * The primary orientation of the items. Usually this is the\n * direction that the collection scrolls.\n * @default 'vertical'\n */\n orientation?: Orientation\n}\n\nexport const ListBoxContext = createContext<ContextValue<ListBoxProps<any>, HTMLDivElement>>(null);\nexport const ListStateContext = createContext<ListState<any> | null>(null);\n\n/**\n * A listbox displays a list of options and allows a user to select one or more of them.\n */\nexport const ListBox = /*#__PURE__*/ (forwardRef as forwardRefType)(function ListBox<T extends object>(props: ListBoxProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n [props, ref] = useContextProps(props, ref, ListBoxContext);\n let state = useContext(ListStateContext);\n\n // The structure of ListBox is a bit strange because it needs to work inside other components like ComboBox and Select.\n // Those components render two copies of their children so that the collection can be built even when the popover is closed.\n // The first copy sends a collection document via context which we render the collection portal into.\n // The second copy sends a ListState object via context which we use to render the ListBox without rebuilding the state.\n // Otherwise, we have a standalone ListBox, so we need to create a collection and state ourselves.\n if (state) {\n return <ListBoxInner state={state} props={props} listBoxRef={ref} />;\n }\n\n return (\n <CollectionBuilder content={<Collection {...props} />}>\n {collection => <StandaloneListBox props={props} listBoxRef={ref} collection={collection} />}\n </CollectionBuilder>\n );\n});\n\nfunction StandaloneListBox({props, listBoxRef, collection}) {\n props = {...props, collection, children: null, items: null};\n let {layoutDelegate} = useContext(CollectionRendererContext);\n let state = useListState({...props, layoutDelegate});\n return <ListBoxInner state={state} props={props} listBoxRef={listBoxRef} />;\n}\n\ninterface ListBoxInnerProps<T> {\n state: ListState<T>,\n props: ListBoxProps<T> & AriaListBoxOptions<T> & {filter?: SelectableCollectionContextValue<T>['filter']},\n listBoxRef: RefObject<HTMLElement | null>\n}\n\nfunction ListBoxInner<T extends object>({state: inputState, props, listBoxRef}: ListBoxInnerProps<T>) {\n [props, listBoxRef] = useContextProps(props, listBoxRef, SelectableCollectionContext);\n let {dragAndDropHooks, layout = 'stack', orientation = 'vertical', filter} = props;\n let state = UNSTABLE_useFilteredListState(inputState, filter);\n let {collection, selectionManager} = state;\n let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n let {direction} = useLocale();\n let {disabledBehavior, disabledKeys} = selectionManager;\n let collator = useCollator({usage: 'search', sensitivity: 'base'});\n let {isVirtualized, layoutDelegate, dropTargetDelegate: ctxDropTargetDelegate, CollectionRoot} = useContext(CollectionRendererContext);\n let keyboardDelegate = useMemo(() => (\n props.keyboardDelegate || new ListKeyboardDelegate({\n collection,\n collator,\n ref: listBoxRef,\n disabledKeys,\n disabledBehavior,\n layout,\n orientation,\n direction,\n layoutDelegate\n })\n ), [collection, collator, listBoxRef, disabledBehavior, disabledKeys, orientation, direction, props.keyboardDelegate, layout, layoutDelegate]);\n\n let {listBoxProps} = useListBox({\n ...props,\n shouldSelectOnPressUp: isListDraggable || props.shouldSelectOnPressUp,\n keyboardDelegate,\n isVirtualized\n }, state, listBoxRef);\n\n let dragHooksProvided = useRef(isListDraggable);\n let dropHooksProvided = useRef(isListDroppable);\n useEffect(() => {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n if (dragHooksProvided.current !== isListDraggable) {\n console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n }\n if (dropHooksProvided.current !== isListDroppable) {\n console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n }\n }, [isListDraggable, isListDroppable]);\n\n let dragState: DraggableCollectionState | undefined = undefined;\n let dropState: DroppableCollectionState | undefined = undefined;\n let droppableCollection: DroppableCollectionResult | undefined = undefined;\n let isRootDropTarget = false;\n let dragPreview: JSX.Element | null = null;\n let preview = useRef<DragPreviewRenderer>(null);\n\n if (isListDraggable && dragAndDropHooks) {\n dragState = dragAndDropHooks.useDraggableCollectionState!({\n collection,\n selectionManager,\n preview: dragAndDropHooks.renderDragPreview ? preview : undefined\n });\n dragAndDropHooks.useDraggableCollection!({}, dragState, listBoxRef);\n\n let DragPreview = dragAndDropHooks.DragPreview!;\n dragPreview = dragAndDropHooks.renderDragPreview\n ? <DragPreview ref={preview}>{dragAndDropHooks.renderDragPreview}</DragPreview>\n : null;\n }\n\n if (isListDroppable && dragAndDropHooks) {\n dropState = dragAndDropHooks.useDroppableCollectionState!({\n collection,\n selectionManager\n });\n\n let dropTargetDelegate = dragAndDropHooks.dropTargetDelegate || ctxDropTargetDelegate || new dragAndDropHooks.ListDropTargetDelegate(collection, listBoxRef, {orientation, layout, direction});\n droppableCollection = dragAndDropHooks.useDroppableCollection!({\n keyboardDelegate,\n dropTargetDelegate\n }, dropState, listBoxRef);\n\n isRootDropTarget = dropState.isDropTarget({type: 'root'});\n }\n\n let {focusProps, isFocused, isFocusVisible} = useFocusRing();\n let isEmpty = state.collection.size === 0;\n let renderValues = {\n isDropTarget: isRootDropTarget,\n isEmpty,\n isFocused,\n isFocusVisible,\n layout: props.layout || 'stack',\n state\n };\n let renderProps = useRenderProps({\n ...props,\n children: undefined,\n defaultClassName: 'react-aria-ListBox',\n values: renderValues\n });\n\n let emptyState: JSX.Element | null = null;\n if (isEmpty && props.renderEmptyState) {\n emptyState = (\n <div\n // eslint-disable-next-line\n role=\"option\"\n style={{display: 'contents'}}>\n {props.renderEmptyState(renderValues)}\n </div>\n );\n }\n\n let DOMProps = filterDOMProps(props, {global: true});\n\n return (\n <FocusScope>\n <dom.div\n {...mergeProps(DOMProps, renderProps, listBoxProps, focusProps, droppableCollection?.collectionProps)}\n ref={listBoxRef as RefObject<HTMLDivElement>}\n slot={props.slot || undefined}\n onScroll={props.onScroll}\n data-drop-target={isRootDropTarget || undefined}\n data-empty={isEmpty || undefined}\n data-focused={isFocused || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-layout={props.layout || 'stack'}\n data-orientation={props.orientation || 'vertical'}>\n <Provider\n values={[\n [ListBoxContext, props],\n [ListStateContext, state],\n [DragAndDropContext, {dragAndDropHooks, dragState, dropState}],\n [SeparatorContext, {elementType: 'div'}],\n [DropIndicatorContext, {render: ListBoxDropIndicatorWrapper}],\n [SectionContext, {name: 'ListBoxSection', render: ListBoxSectionInner}]\n ]}>\n <SharedElementTransition>\n <CollectionRoot\n collection={collection}\n scrollRef={listBoxRef}\n persistedKeys={useDndPersistedKeys(selectionManager, dragAndDropHooks, dropState)}\n renderDropIndicator={useRenderDropIndicator(dragAndDropHooks, dropState)} />\n </SharedElementTransition>\n </Provider>\n {emptyState}\n {dragPreview}\n </dom.div>\n </FocusScope>\n );\n}\n\nexport interface ListBoxSectionProps<T> extends SectionProps<T>, DOMRenderProps<'section', undefined> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.\n * @default 'react-aria-ListBoxSection'\n */\n className?: string\n}\n\nfunction ListBoxSectionInner<T extends object>(props: ListBoxSectionProps<T>, ref: ForwardedRef<HTMLElement>, section: Node<T>, className = 'react-aria-ListBoxSection') {\n let state = useContext(ListStateContext)!;\n let {dragAndDropHooks, dropState} = useContext(DragAndDropContext)!;\n let {CollectionBranch} = useContext(CollectionRendererContext);\n let [headingRef, heading] = useSlot();\n let {headingProps, groupProps} = useListBoxSection({\n heading,\n 'aria-label': props['aria-label'] ?? undefined\n });\n let renderProps = useRenderProps({\n ...props,\n id: undefined,\n children: undefined,\n defaultClassName: className,\n values: undefined\n });\n\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n\n return (\n <dom.section\n {...mergeProps(DOMProps, renderProps, groupProps)}\n ref={ref}>\n <HeaderContext.Provider value={{...headingProps, ref: headingRef}}>\n <CollectionBranch\n collection={state.collection}\n parent={section}\n renderDropIndicator={useRenderDropIndicator(dragAndDropHooks, dropState)} />\n </HeaderContext.Provider>\n </dom.section>\n );\n}\n\n/**\n * A ListBoxSection represents a section within a ListBox.\n */\nexport const ListBoxSection = /*#__PURE__*/ createBranchComponent(SectionNode, ListBoxSectionInner);\n\nexport interface ListBoxItemRenderProps extends ItemRenderProps {}\n\nexport interface ListBoxItemProps<T = object> extends Omit<RenderProps<ListBoxItemRenderProps>, 'render'>, PossibleLinkDOMRenderProps<'div', ListBoxItemRenderProps>, LinkDOMProps, HoverEvents, PressEvents, KeyboardEvents, FocusEvents<HTMLDivElement>, Omit<GlobalDOMAttributes<HTMLDivElement>, 'onClick'> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. A function may be provided to compute the class based on component state.\n * @default 'react-aria-ListBoxItem'\n */\n className?: ClassNameOrFunction<ListBoxItemRenderProps>,\n /** The unique id of the item. */\n id?: Key,\n /** The object value that this item represents. When using dynamic collections, this is set automatically. */\n value?: T,\n /** A string representation of the item's contents, used for features like typeahead. */\n textValue?: string,\n /** An accessibility label for this item. */\n 'aria-label'?: string,\n /** Whether the item is disabled. */\n isDisabled?: boolean,\n /**\n * Handler that is called when a user performs an action on the item. The exact user event depends on\n * the collection's `selectionBehavior` prop and the interaction modality.\n */\n onAction?: () => void\n}\n\n/**\n * A ListBoxItem represents an individual option in a ListBox.\n */\nexport const ListBoxItem = /*#__PURE__*/ createLeafComponent(ItemNode, function ListBoxItem<T extends object>(props: ListBoxItemProps<T>, forwardedRef: ForwardedRef<HTMLDivElement>, item: Node<T>) {\n let ref = useObjectRef<any>(forwardedRef);\n let state = useContext(ListStateContext)!;\n let {dragAndDropHooks, dragState, dropState} = useContext(DragAndDropContext)!;\n let {optionProps, labelProps, descriptionProps, ...states} = useOption(\n {key: item.key, 'aria-label': props?.['aria-label']},\n state,\n ref\n );\n\n let {hoverProps, isHovered} = useHover({\n isDisabled: !states.allowsSelection && !states.hasAction,\n onHoverStart: item.props.onHoverStart,\n onHoverChange: item.props.onHoverChange,\n onHoverEnd: item.props.onHoverEnd\n });\n\n let {keyboardProps} = useKeyboard(props);\n let {focusProps} = useFocus(props);\n\n let draggableItem: DraggableItemResult | null = null;\n if (dragState && dragAndDropHooks) {\n draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasAction: states.hasAction}, dragState);\n }\n\n let droppableItem: DroppableItemResult | null = null;\n if (dropState && dragAndDropHooks) {\n droppableItem = dragAndDropHooks.useDroppableItem!({\n target: {type: 'item', key: item.key, dropPosition: 'on'}\n }, dropState, ref);\n }\n\n let isDragging = dragState && dragState.isDragging(item.key);\n let renderProps = useRenderProps<ListBoxItemRenderProps, any>({\n ...props,\n id: undefined,\n children: props.children,\n defaultClassName: 'react-aria-ListBoxItem',\n values: {\n ...states,\n isHovered,\n selectionMode: state.selectionManager.selectionMode,\n selectionBehavior: state.selectionManager.selectionBehavior,\n allowsDragging: !!dragState,\n isDragging,\n isDropTarget: droppableItem?.isDropTarget\n }\n });\n\n useEffect(() => {\n if (!item.textValue && process.env.NODE_ENV !== 'production') {\n console.warn('A `textValue` prop is required for <ListBoxItem> elements with non-plain text children in order to support accessibility features such as type to select.');\n }\n }, [item.textValue]);\n\n let ElementType = props.href ? dom.a : dom.div;\n let DOMProps = filterDOMProps(props as any, {global: true});\n delete DOMProps.id;\n delete DOMProps.onClick;\n\n if (props.href && optionProps.tabIndex == null) {\n optionProps.tabIndex = -1;\n }\n\n return (\n <ElementType\n {...mergeProps(DOMProps, renderProps, optionProps, hoverProps, keyboardProps, focusProps, draggableItem?.dragProps, droppableItem?.dropProps)}\n ref={ref}\n data-allows-dragging={!!dragState || undefined}\n data-selected={states.isSelected || undefined}\n data-disabled={states.isDisabled || undefined}\n data-hovered={isHovered || undefined}\n data-focused={states.isFocused || undefined}\n data-focus-visible={states.isFocusVisible || undefined}\n data-pressed={states.isPressed || undefined}\n data-dragging={isDragging || undefined}\n data-drop-target={droppableItem?.isDropTarget || undefined}\n data-selection-mode={state.selectionManager.selectionMode === 'none' ? undefined : state.selectionManager.selectionMode}>\n <Provider\n values={[\n [TextContext, {\n slots: {\n [DEFAULT_SLOT]: labelProps,\n label: labelProps,\n description: descriptionProps\n }\n }],\n [SelectionIndicatorContext, {isSelected: states.isSelected}]\n ]}>\n {renderProps.children}\n </Provider>\n </ElementType>\n );\n});\n\nfunction ListBoxDropIndicatorWrapper(props: DropIndicatorProps, ref: ForwardedRef<HTMLElement>) {\n ref = useObjectRef(ref);\n let {dragAndDropHooks, dropState} = useContext(DragAndDropContext)!;\n let {dropIndicatorProps, isHidden, isDropTarget} = dragAndDropHooks!.useDropIndicator!(\n props,\n dropState!,\n ref\n );\n\n if (isHidden) {\n return null;\n }\n\n return (\n <ListBoxDropIndicatorForwardRef {...props} dropIndicatorProps={dropIndicatorProps} isDropTarget={isDropTarget} ref={ref} />\n );\n}\n\ninterface ListBoxDropIndicatorProps extends DropIndicatorProps {\n dropIndicatorProps: React.HTMLAttributes<HTMLElement>,\n isDropTarget: boolean\n}\n\nfunction ListBoxDropIndicator(props: ListBoxDropIndicatorProps, ref: ForwardedRef<HTMLElement>) {\n let {\n dropIndicatorProps,\n isDropTarget,\n ...otherProps\n } = props;\n\n let renderProps = useRenderProps({\n ...otherProps,\n defaultClassName: 'react-aria-DropIndicator',\n values: {\n isDropTarget\n }\n });\n\n return (\n <dom.div\n {...dropIndicatorProps}\n {...renderProps}\n role=\"option\"\n ref={ref as RefObject<HTMLDivElement | null>}\n data-drop-target={isDropTarget || undefined} />\n );\n}\n\nconst ListBoxDropIndicatorForwardRef = forwardRef(ListBoxDropIndicator);\n\nexport interface ListBoxLoadMoreItemProps extends Omit<LoadMoreSentinelProps, 'collection'>, StyleProps, DOMRenderProps<'div', undefined>, GlobalDOMAttributes<HTMLDivElement> {\n /**\n * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element.\n * @default 'react-aria-ListBoxLoadMoreItem'\n */\n className?: string,\n /**\n * The load more spinner to render when loading additional items.\n */\n children?: ReactNode,\n /**\n * Whether or not the loading spinner should be rendered or not.\n */\n isLoading?: boolean\n}\n\nexport const ListBoxLoadMoreItem = createLeafComponent(LoaderNode, function ListBoxLoadingIndicator(props: ListBoxLoadMoreItemProps, ref: ForwardedRef<HTMLDivElement>, item: Node<object>) {\n let state = useContext(ListStateContext)!;\n let {isLoading, onLoadMore, scrollOffset, ...otherProps} = props;\n\n let sentinelRef = useRef<HTMLDivElement>(null);\n let memoedLoadMoreProps = useMemo(() => ({\n onLoadMore,\n collection: state?.collection,\n sentinelRef,\n scrollOffset\n }), [onLoadMore, scrollOffset, state?.collection]);\n useLoadMoreSentinel(memoedLoadMoreProps, sentinelRef);\n let renderProps = useRenderProps({\n ...otherProps,\n id: undefined,\n children: item.rendered,\n defaultClassName: 'react-aria-ListBoxLoadingIndicator',\n values: undefined\n });\n\n let optionProps = {\n // For Android talkback\n tabIndex: -1\n // For now don't include aria-posinset and aria-setsize on loader since they aren't keyboard focusable\n // Arguably shouldn't include them ever since it might be confusing to the user to include the loaders as part of the\n // item count\n };\n\n return (\n <>\n {/* Alway render the sentinel. For now onus is on the user for styling when using flex + gap (this would introduce a gap even though it doesn't take room) */}\n {/* @ts-ignore - compatibility with React < 19 */}\n <div style={{position: 'relative', width: 0, height: 0}} inert={inertValue(true)} >\n <div data-testid=\"loadMoreSentinel\" ref={sentinelRef} style={{position: 'absolute', height: 1, width: 1}} />\n </div>\n {isLoading && renderProps.children && (\n <dom.div\n {...mergeProps(filterDOMProps(props, {global: true}), optionProps)}\n {...renderProps}\n // aria-selected isn't needed here since this option is not selectable.\n role=\"option\"\n ref={ref as ForwardedRef<HTMLDivElement>}>\n {renderProps.children}\n </dom.div>\n )}\n </>\n );\n});\n"],"names":[],"version":3,"file":"ListBox.module.js.map"}
|
package/dist/Menu.main.js
CHANGED
|
@@ -385,11 +385,13 @@ const $a8f6e7d095d1cc86$export$2ce376c2cc3355c8 = /*#__PURE__*/ (0, $2JTht$react
|
|
|
385
385
|
let state = (0, $2JTht$react.useContext)($a8f6e7d095d1cc86$export$24aad8519b95b41b);
|
|
386
386
|
let ref = (0, $2JTht$reactariautils.useObjectRef)(forwardedRef);
|
|
387
387
|
let selectionManager = (0, $2JTht$react.useContext)($a8f6e7d095d1cc86$var$SelectionManagerContext);
|
|
388
|
+
let { isVirtualized: isVirtualized } = (0, $2JTht$react.useContext)((0, $3114c2382242bdc0$exports.CollectionRendererContext));
|
|
388
389
|
let { menuItemProps: menuItemProps, labelProps: labelProps, descriptionProps: descriptionProps, keyboardShortcutProps: keyboardShortcutProps, ...states } = (0, $2JTht$reactaria.useMenuItem)({
|
|
389
390
|
...props,
|
|
390
391
|
id: id,
|
|
391
392
|
key: item.key,
|
|
392
|
-
selectionManager: selectionManager
|
|
393
|
+
selectionManager: selectionManager,
|
|
394
|
+
isVirtualized: isVirtualized
|
|
393
395
|
}, state, ref);
|
|
394
396
|
let { hoverProps: hoverProps, isHovered: isHovered } = (0, $2JTht$reactaria.useHover)({
|
|
395
397
|
isDisabled: states.isDisabled
|