@react-spectrum/list 3.7.11-nightly.4698 → 3.7.11-nightly.4701

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.
@@ -145,7 +145,22 @@ function $60684b441be8e84c$var$ListView(props, ref) {
145
145
  onAction: onAction
146
146
  }, state, domRef);
147
147
  let focusedKey = selectionManager.focusedKey;
148
- if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === 'item') focusedKey = dropState.target.key;
148
+ let dropTargetKey = null;
149
+ if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === 'item') {
150
+ dropTargetKey = dropState.target.key;
151
+ var _state_collection_getKeyAfter;
152
+ if (dropState.target.dropPosition === 'after') // Normalize to the "before" drop position since we only render those in the DOM.
153
+ dropTargetKey = (_state_collection_getKeyAfter = state.collection.getKeyAfter(dropTargetKey)) !== null && _state_collection_getKeyAfter !== void 0 ? _state_collection_getKeyAfter : dropTargetKey;
154
+ }
155
+ let persistedKeys = (0, $8lawJ$react.useMemo)(()=>{
156
+ return new Set([
157
+ focusedKey,
158
+ dropTargetKey
159
+ ].filter((k)=>k !== null));
160
+ }, [
161
+ focusedKey,
162
+ dropTargetKey
163
+ ]);
149
164
  // wait for layout to get accurate measurements
150
165
  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = (0, $8lawJ$react.useState)(false);
151
166
  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = (0, $8lawJ$react.useState)(false);
@@ -185,7 +200,7 @@ function $60684b441be8e84c$var$ListView(props, ref) {
185
200
  isLoading: isLoading,
186
201
  onLoadMore: onLoadMore,
187
202
  ref: domRef,
188
- focusedKey: focusedKey,
203
+ persistedKeys: persistedKeys,
189
204
  scrollDirection: "vertical",
190
205
  className: (0, $8lawJ$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListView', `react-spectrum-ListView--${density}`, 'react-spectrum-ListView--emphasized', {
191
206
  'react-spectrum-ListView--quiet': isQuiet,
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/list/src/ListView.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 {AriaGridListProps, useGridList} from '@react-aria/gridlist';\nimport {AsyncLoadable, DOMRef, Key, LoadingState, Node, SpectrumSelectionProps, StyleProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport type {DragAndDropHooks} from '@react-spectrum/dnd';\nimport type {DraggableCollectionState, DroppableCollectionState} from '@react-stately/dnd';\nimport type {DroppableCollectionResult} from '@react-aria/dnd';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {FocusRing, FocusScope} from '@react-aria/focus';\nimport InsertionIndicator from './InsertionIndicator';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate} from '@react-aria/selection';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\nimport {ListViewLayout} from './ListViewLayout';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport RootDropIndicator from './RootDropIndicator';\nimport {DragPreview as SpectrumDragPreview} from './DragPreview';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer} from '@react-aria/virtualizer';\n\nexport interface SpectrumListViewProps<T> extends Omit<AriaGridListProps<T>, 'keyboardNavigationBehavior'>, StyleProps, SpectrumSelectionProps, Omit<AsyncLoadable, 'isLoading'> {\n /**\n * Sets the amount of vertical padding within each cell.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the ListView should be displayed with a quiet style. */\n isQuiet?: boolean,\n /** The current loading state of the ListView. Determines whether or not the progress circle should be shown. */\n loadingState?: LoadingState,\n /**\n * Sets the text behavior for the row contents.\n * @default 'truncate'\n */\n overflowMode?: 'truncate' | 'wrap',\n /** Sets what the ListView should render when there is no content to display. */\n renderEmptyState?: () => JSX.Element,\n /**\n * Handler that is called when a user performs an action on an item. The exact user event depends on\n * the collection's `selectionStyle` prop and the interaction modality.\n */\n onAction?: (key: Key) => void,\n /**\n * The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListView.\n */\n dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks']\n}\n\ninterface ListViewContextValue<T> {\n state: ListState<T>,\n dragState: DraggableCollectionState,\n dropState: DroppableCollectionState,\n dragAndDropHooks: DragAndDropHooks['dragAndDropHooks'],\n onAction:(key: Key) => void,\n isListDraggable: boolean,\n isListDroppable: boolean,\n layout: ListViewLayout<T>,\n loadingState: LoadingState,\n renderEmptyState?: () => JSX.Element\n}\n\nexport const ListViewContext = React.createContext<ListViewContextValue<unknown>>(null);\n\nconst ROW_HEIGHTS = {\n compact: {\n medium: 32,\n large: 40\n },\n regular: {\n medium: 40,\n large: 50\n },\n spacious: {\n medium: 48,\n large: 60\n }\n};\n\nfunction useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {\n let {scale} = useProvider();\n let layout = useMemo(() =>\n new ListViewLayout<T>({\n estimatedRowHeight: ROW_HEIGHTS[density][scale]\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n , [scale, density, overflowMode]);\n\n return layout;\n}\n\nfunction ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n let {\n density = 'regular',\n loadingState,\n onLoadMore,\n isQuiet,\n overflowMode = 'truncate',\n onAction,\n dragAndDropHooks,\n renderEmptyState,\n ...otherProps\n } = props;\n let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n let dragHooksProvided = useRef(isListDraggable);\n let dropHooksProvided = useRef(isListDroppable);\n useEffect(() => {\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 domRef = useDOMRef(ref);\n let state = useListState({\n ...props,\n selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'\n });\n let {collection, selectionManager} = state;\n let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n\n let {styleProps} = useStyleProps(props);\n let dragState: DraggableCollectionState;\n let preview = useRef(null);\n if (isListDraggable) {\n dragState = dragAndDropHooks.useDraggableCollectionState({\n collection,\n selectionManager,\n preview\n });\n dragAndDropHooks.useDraggableCollection({}, dragState, domRef);\n }\n let layout = useListLayout(\n state,\n props.density || 'regular',\n overflowMode\n );\n\n let DragPreview = dragAndDropHooks?.DragPreview;\n let dropState: DroppableCollectionState;\n let droppableCollection: DroppableCollectionResult;\n let isRootDropTarget: boolean;\n if (isListDroppable) {\n dropState = dragAndDropHooks.useDroppableCollectionState({\n collection,\n selectionManager\n });\n droppableCollection = dragAndDropHooks.useDroppableCollection({\n keyboardDelegate: new ListKeyboardDelegate({\n collection,\n disabledKeys: dragState?.draggingKeys.size ? null : selectionManager.disabledKeys,\n ref: domRef,\n layoutDelegate: layout\n }),\n dropTargetDelegate: layout\n }, dropState, domRef);\n\n isRootDropTarget = dropState.isDropTarget({type: 'root'});\n }\n\n let {gridProps} = useGridList({\n ...props,\n isVirtualized: true,\n layoutDelegate: layout,\n onAction\n }, state, domRef);\n\n let focusedKey = selectionManager.focusedKey;\n if (dropState?.target?.type === 'item') {\n focusedKey = dropState.target.key;\n }\n\n // wait for layout to get accurate measurements\n let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);\n let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(() => {\n if (domRef.current) {\n // 2 is the width of the border which is not part of the box size\n setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);\n setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);\n }\n });\n\n let hasAnyChildren = useMemo(() => [...collection].some(item => item.hasChildNodes), [collection]);\n\n return (\n <ListViewContext.Provider value={{state, dragState, dropState, dragAndDropHooks, onAction, isListDraggable, isListDroppable, layout, loadingState, renderEmptyState}}>\n <FocusScope>\n <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n <Virtualizer\n {...mergeProps(isListDroppable && droppableCollection?.collectionProps, gridProps)}\n {...filterDOMProps(otherProps)}\n {...gridProps}\n {...styleProps}\n isLoading={isLoading}\n onLoadMore={onLoadMore}\n ref={domRef}\n focusedKey={focusedKey}\n scrollDirection=\"vertical\"\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView',\n `react-spectrum-ListView--${density}`,\n 'react-spectrum-ListView--emphasized',\n {\n 'react-spectrum-ListView--quiet': isQuiet,\n 'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',\n 'react-spectrum-ListView--draggable': !!isListDraggable,\n 'react-spectrum-ListView--dropTarget': !!isRootDropTarget,\n 'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,\n 'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,\n 'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,\n 'react-spectrum-ListView--wrap': overflowMode === 'wrap'\n },\n styleProps.className\n )\n }\n layout={layout}\n layoutOptions={useMemo(() => ({isLoading}), [isLoading])}\n collection={collection}>\n {useCallback((type, item) => {\n if (type === 'item') {\n return <Item item={item} />;\n } else if (type === 'loader') {\n return <LoadingView />;\n } else if (type === 'placeholder') {\n return <EmptyState />;\n }\n }, [])}\n </Virtualizer>\n </FocusRing>\n </FocusScope>\n {DragPreview && isListDraggable &&\n <DragPreview ref={preview}>\n {() => {\n if (dragAndDropHooks.renderPreview) {\n return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);\n }\n let item = state.collection.getItem(dragState.draggedKey);\n let itemCount = dragState.draggingKeys.size;\n let itemHeight = layout.getLayoutInfo(dragState.draggedKey).rect.height;\n return <SpectrumDragPreview item={item} itemCount={itemCount} itemHeight={itemHeight} density={density} />;\n }}\n </DragPreview>\n }\n </ListViewContext.Provider>\n );\n}\n\nfunction Item({item}: {item: Node<unknown>}) {\n let {isListDroppable, state, onAction} = useContext(ListViewContext);\n return (\n <>\n {isListDroppable && state.collection.getKeyBefore(item.key) == null &&\n <RootDropIndicator key=\"root\" />\n }\n {isListDroppable &&\n <InsertionIndicator\n key={`${item.key}-before`}\n target={{key: item.key, type: 'item', dropPosition: 'before'}} />\n }\n <ListViewItem item={item} isEmphasized hasActions={!!onAction} />\n {isListDroppable &&\n <InsertionIndicator\n key={`${item.key}-after`}\n target={{key: item.key, type: 'item', dropPosition: 'after'}}\n isPresentationOnly={state.collection.getKeyAfter(item.key) != null} />\n }\n </>\n );\n}\n\nfunction LoadingView() {\n let {state} = useContext(ListViewContext);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n}\n\nfunction EmptyState() {\n let {renderEmptyState} = useContext(ListViewContext);\n let emptyState = renderEmptyState ? renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n}\n\nfunction CenteredWrapper({children}) {\n let {state} = useContext(ListViewContext);\n return (\n <div\n role=\"row\"\n aria-rowindex={state.collection.size + 1}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView-centeredWrapper',\n {\n 'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0\n }\n )}>\n <div role=\"gridcell\">\n {children}\n </div>\n </div>\n );\n}\n\n/**\n * A ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.\n */\nconst _ListView = React.forwardRef(ListView) as <T>(props: SpectrumListViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_ListView as ListView};\n"],"names":[],"version":3,"file":"ListView.main.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/list/src/ListView.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 {AriaGridListProps, useGridList} from '@react-aria/gridlist';\nimport {AsyncLoadable, DOMRef, Key, LoadingState, Node, SpectrumSelectionProps, StyleProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport type {DragAndDropHooks} from '@react-spectrum/dnd';\nimport type {DraggableCollectionState, DroppableCollectionState} from '@react-stately/dnd';\nimport type {DroppableCollectionResult} from '@react-aria/dnd';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {FocusRing, FocusScope} from '@react-aria/focus';\nimport InsertionIndicator from './InsertionIndicator';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate} from '@react-aria/selection';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\nimport {ListViewLayout} from './ListViewLayout';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport RootDropIndicator from './RootDropIndicator';\nimport {DragPreview as SpectrumDragPreview} from './DragPreview';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer} from '@react-aria/virtualizer';\n\nexport interface SpectrumListViewProps<T> extends Omit<AriaGridListProps<T>, 'keyboardNavigationBehavior'>, StyleProps, SpectrumSelectionProps, Omit<AsyncLoadable, 'isLoading'> {\n /**\n * Sets the amount of vertical padding within each cell.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the ListView should be displayed with a quiet style. */\n isQuiet?: boolean,\n /** The current loading state of the ListView. Determines whether or not the progress circle should be shown. */\n loadingState?: LoadingState,\n /**\n * Sets the text behavior for the row contents.\n * @default 'truncate'\n */\n overflowMode?: 'truncate' | 'wrap',\n /** Sets what the ListView should render when there is no content to display. */\n renderEmptyState?: () => JSX.Element,\n /**\n * Handler that is called when a user performs an action on an item. The exact user event depends on\n * the collection's `selectionStyle` prop and the interaction modality.\n */\n onAction?: (key: Key) => void,\n /**\n * The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListView.\n */\n dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks']\n}\n\ninterface ListViewContextValue<T> {\n state: ListState<T>,\n dragState: DraggableCollectionState,\n dropState: DroppableCollectionState,\n dragAndDropHooks: DragAndDropHooks['dragAndDropHooks'],\n onAction:(key: Key) => void,\n isListDraggable: boolean,\n isListDroppable: boolean,\n layout: ListViewLayout<T>,\n loadingState: LoadingState,\n renderEmptyState?: () => JSX.Element\n}\n\nexport const ListViewContext = React.createContext<ListViewContextValue<unknown>>(null);\n\nconst ROW_HEIGHTS = {\n compact: {\n medium: 32,\n large: 40\n },\n regular: {\n medium: 40,\n large: 50\n },\n spacious: {\n medium: 48,\n large: 60\n }\n};\n\nfunction useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {\n let {scale} = useProvider();\n let layout = useMemo(() =>\n new ListViewLayout<T>({\n estimatedRowHeight: ROW_HEIGHTS[density][scale]\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n , [scale, density, overflowMode]);\n\n return layout;\n}\n\nfunction ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n let {\n density = 'regular',\n loadingState,\n onLoadMore,\n isQuiet,\n overflowMode = 'truncate',\n onAction,\n dragAndDropHooks,\n renderEmptyState,\n ...otherProps\n } = props;\n let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n let dragHooksProvided = useRef(isListDraggable);\n let dropHooksProvided = useRef(isListDroppable);\n useEffect(() => {\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 domRef = useDOMRef(ref);\n let state = useListState({\n ...props,\n selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'\n });\n let {collection, selectionManager} = state;\n let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n\n let {styleProps} = useStyleProps(props);\n let dragState: DraggableCollectionState;\n let preview = useRef(null);\n if (isListDraggable) {\n dragState = dragAndDropHooks.useDraggableCollectionState({\n collection,\n selectionManager,\n preview\n });\n dragAndDropHooks.useDraggableCollection({}, dragState, domRef);\n }\n let layout = useListLayout(\n state,\n props.density || 'regular',\n overflowMode\n );\n\n let DragPreview = dragAndDropHooks?.DragPreview;\n let dropState: DroppableCollectionState;\n let droppableCollection: DroppableCollectionResult;\n let isRootDropTarget: boolean;\n if (isListDroppable) {\n dropState = dragAndDropHooks.useDroppableCollectionState({\n collection,\n selectionManager\n });\n droppableCollection = dragAndDropHooks.useDroppableCollection({\n keyboardDelegate: new ListKeyboardDelegate({\n collection,\n disabledKeys: dragState?.draggingKeys.size ? null : selectionManager.disabledKeys,\n ref: domRef,\n layoutDelegate: layout\n }),\n dropTargetDelegate: layout\n }, dropState, domRef);\n\n isRootDropTarget = dropState.isDropTarget({type: 'root'});\n }\n\n let {gridProps} = useGridList({\n ...props,\n isVirtualized: true,\n layoutDelegate: layout,\n onAction\n }, state, domRef);\n\n let focusedKey = selectionManager.focusedKey;\n let dropTargetKey: Key | null = null;\n if (dropState?.target?.type === 'item') {\n dropTargetKey = dropState.target.key;\n if (dropState.target.dropPosition === 'after') {\n // Normalize to the \"before\" drop position since we only render those in the DOM.\n dropTargetKey = state.collection.getKeyAfter(dropTargetKey) ?? dropTargetKey;\n }\n }\n\n let persistedKeys = useMemo(() => {\n return new Set([focusedKey, dropTargetKey].filter(k => k !== null));\n }, [focusedKey, dropTargetKey]);\n\n // wait for layout to get accurate measurements\n let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);\n let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(() => {\n if (domRef.current) {\n // 2 is the width of the border which is not part of the box size\n setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);\n setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);\n }\n });\n\n let hasAnyChildren = useMemo(() => [...collection].some(item => item.hasChildNodes), [collection]);\n\n return (\n <ListViewContext.Provider value={{state, dragState, dropState, dragAndDropHooks, onAction, isListDraggable, isListDroppable, layout, loadingState, renderEmptyState}}>\n <FocusScope>\n <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n <Virtualizer\n {...mergeProps(isListDroppable && droppableCollection?.collectionProps, gridProps)}\n {...filterDOMProps(otherProps)}\n {...gridProps}\n {...styleProps}\n isLoading={isLoading}\n onLoadMore={onLoadMore}\n ref={domRef}\n persistedKeys={persistedKeys}\n scrollDirection=\"vertical\"\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView',\n `react-spectrum-ListView--${density}`,\n 'react-spectrum-ListView--emphasized',\n {\n 'react-spectrum-ListView--quiet': isQuiet,\n 'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',\n 'react-spectrum-ListView--draggable': !!isListDraggable,\n 'react-spectrum-ListView--dropTarget': !!isRootDropTarget,\n 'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,\n 'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,\n 'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,\n 'react-spectrum-ListView--wrap': overflowMode === 'wrap'\n },\n styleProps.className\n )\n }\n layout={layout}\n layoutOptions={useMemo(() => ({isLoading}), [isLoading])}\n collection={collection}>\n {useCallback((type, item) => {\n if (type === 'item') {\n return <Item item={item} />;\n } else if (type === 'loader') {\n return <LoadingView />;\n } else if (type === 'placeholder') {\n return <EmptyState />;\n }\n }, [])}\n </Virtualizer>\n </FocusRing>\n </FocusScope>\n {DragPreview && isListDraggable &&\n <DragPreview ref={preview}>\n {() => {\n if (dragAndDropHooks.renderPreview) {\n return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);\n }\n let item = state.collection.getItem(dragState.draggedKey);\n let itemCount = dragState.draggingKeys.size;\n let itemHeight = layout.getLayoutInfo(dragState.draggedKey).rect.height;\n return <SpectrumDragPreview item={item} itemCount={itemCount} itemHeight={itemHeight} density={density} />;\n }}\n </DragPreview>\n }\n </ListViewContext.Provider>\n );\n}\n\nfunction Item({item}: {item: Node<unknown>}) {\n let {isListDroppable, state, onAction} = useContext(ListViewContext);\n return (\n <>\n {isListDroppable && state.collection.getKeyBefore(item.key) == null &&\n <RootDropIndicator key=\"root\" />\n }\n {isListDroppable &&\n <InsertionIndicator\n key={`${item.key}-before`}\n target={{key: item.key, type: 'item', dropPosition: 'before'}} />\n }\n <ListViewItem item={item} isEmphasized hasActions={!!onAction} />\n {isListDroppable &&\n <InsertionIndicator\n key={`${item.key}-after`}\n target={{key: item.key, type: 'item', dropPosition: 'after'}}\n isPresentationOnly={state.collection.getKeyAfter(item.key) != null} />\n }\n </>\n );\n}\n\nfunction LoadingView() {\n let {state} = useContext(ListViewContext);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n}\n\nfunction EmptyState() {\n let {renderEmptyState} = useContext(ListViewContext);\n let emptyState = renderEmptyState ? renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n}\n\nfunction CenteredWrapper({children}) {\n let {state} = useContext(ListViewContext);\n return (\n <div\n role=\"row\"\n aria-rowindex={state.collection.size + 1}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView-centeredWrapper',\n {\n 'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0\n }\n )}>\n <div role=\"gridcell\">\n {children}\n </div>\n </div>\n );\n}\n\n/**\n * A ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.\n */\nconst _ListView = React.forwardRef(ListView) as <T>(props: SpectrumListViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_ListView as ListView};\n"],"names":[],"version":3,"file":"ListView.main.js.map"}
package/dist/ListView.mjs CHANGED
@@ -138,7 +138,22 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
138
138
  onAction: onAction
139
139
  }, state, domRef);
140
140
  let focusedKey = selectionManager.focusedKey;
141
- if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === 'item') focusedKey = dropState.target.key;
141
+ let dropTargetKey = null;
142
+ if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === 'item') {
143
+ dropTargetKey = dropState.target.key;
144
+ var _state_collection_getKeyAfter;
145
+ if (dropState.target.dropPosition === 'after') // Normalize to the "before" drop position since we only render those in the DOM.
146
+ dropTargetKey = (_state_collection_getKeyAfter = state.collection.getKeyAfter(dropTargetKey)) !== null && _state_collection_getKeyAfter !== void 0 ? _state_collection_getKeyAfter : dropTargetKey;
147
+ }
148
+ let persistedKeys = (0, $6w3ZV$useMemo)(()=>{
149
+ return new Set([
150
+ focusedKey,
151
+ dropTargetKey
152
+ ].filter((k)=>k !== null));
153
+ }, [
154
+ focusedKey,
155
+ dropTargetKey
156
+ ]);
142
157
  // wait for layout to get accurate measurements
143
158
  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = (0, $6w3ZV$useState)(false);
144
159
  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = (0, $6w3ZV$useState)(false);
@@ -178,7 +193,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
178
193
  isLoading: isLoading,
179
194
  onLoadMore: onLoadMore,
180
195
  ref: domRef,
181
- focusedKey: focusedKey,
196
+ persistedKeys: persistedKeys,
182
197
  scrollDirection: "vertical",
183
198
  className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'react-spectrum-ListView', `react-spectrum-ListView--${density}`, 'react-spectrum-ListView--emphasized', {
184
199
  'react-spectrum-ListView--quiet': isQuiet,
@@ -138,7 +138,22 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
138
138
  onAction: onAction
139
139
  }, state, domRef);
140
140
  let focusedKey = selectionManager.focusedKey;
141
- if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === 'item') focusedKey = dropState.target.key;
141
+ let dropTargetKey = null;
142
+ if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === 'item') {
143
+ dropTargetKey = dropState.target.key;
144
+ var _state_collection_getKeyAfter;
145
+ if (dropState.target.dropPosition === 'after') // Normalize to the "before" drop position since we only render those in the DOM.
146
+ dropTargetKey = (_state_collection_getKeyAfter = state.collection.getKeyAfter(dropTargetKey)) !== null && _state_collection_getKeyAfter !== void 0 ? _state_collection_getKeyAfter : dropTargetKey;
147
+ }
148
+ let persistedKeys = (0, $6w3ZV$useMemo)(()=>{
149
+ return new Set([
150
+ focusedKey,
151
+ dropTargetKey
152
+ ].filter((k)=>k !== null));
153
+ }, [
154
+ focusedKey,
155
+ dropTargetKey
156
+ ]);
142
157
  // wait for layout to get accurate measurements
143
158
  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = (0, $6w3ZV$useState)(false);
144
159
  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = (0, $6w3ZV$useState)(false);
@@ -178,7 +193,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
178
193
  isLoading: isLoading,
179
194
  onLoadMore: onLoadMore,
180
195
  ref: domRef,
181
- focusedKey: focusedKey,
196
+ persistedKeys: persistedKeys,
182
197
  scrollDirection: "vertical",
183
198
  className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'react-spectrum-ListView', `react-spectrum-ListView--${density}`, 'react-spectrum-ListView--emphasized', {
184
199
  'react-spectrum-ListView--quiet': isQuiet,
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;;AAmEM,MAAM,0DAAkB,CAAA,GAAA,YAAI,EAAE,aAAa,CAAgC;AAElF,MAAM,oCAAc;IAClB,SAAS;QACP,QAAQ;QACR,OAAO;IACT;IACA,SAAS;QACP,QAAQ;QACR,OAAO;IACT;IACA,UAAU;QACR,QAAQ;QACR,OAAO;IACT;AACF;AAEA,SAAS,oCAAiB,KAAmB,EAAE,OAA4C,EAAE,YAAsD;IACjJ,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,kBAAU;IACxB,IAAI,SAAS,CAAA,GAAA,cAAM,EAAE,IACnB,IAAI,CAAA,GAAA,yCAAa,EAAK;YACpB,oBAAoB,iCAAW,CAAC,QAAQ,CAAC,MAAM;QACjD,IAEE;QAAC;QAAO;QAAS;KAAa;IAElC,OAAO;AACT;AAEA,SAAS,+BAA2B,KAA+B,EAAE,GAA2B;QAgF1F;IA/EJ,IAAI,WACF,UAAU,yBACV,YAAY,cACZ,UAAU,WACV,OAAO,gBACP,eAAe,sBACf,QAAQ,oBACR,gBAAgB,oBAChB,gBAAgB,EAChB,GAAG,YACJ,GAAG;IACJ,IAAI,kBAAkB,CAAC,EAAC,6BAAA,uCAAA,iBAAkB,2BAA2B;IACrE,IAAI,kBAAkB,CAAC,EAAC,6BAAA,uCAAA,iBAAkB,2BAA2B;IACrE,IAAI,oBAAoB,CAAA,GAAA,aAAK,EAAE;IAC/B,IAAI,oBAAoB,CAAA,GAAA,aAAK,EAAE;IAC/B,CAAA,GAAA,gBAAQ,EAAE;QACR,IAAI,kBAAkB,OAAO,KAAK,iBAChC,QAAQ,IAAI,CAAC;QAEf,IAAI,kBAAkB,OAAO,KAAK,iBAChC,QAAQ,IAAI,CAAC;IAEjB,GAAG;QAAC;QAAiB;KAAgB;IAErC,IAAI,SAAS,CAAA,GAAA,gBAAQ,EAAE;IACvB,IAAI,QAAQ,CAAA,GAAA,mBAAW,EAAE;QACvB,GAAG,KAAK;QACR,mBAAmB,MAAM,cAAc,KAAK,cAAc,YAAY;IACxE;IACA,IAAI,cAAC,UAAU,oBAAE,gBAAgB,EAAC,GAAG;IACrC,IAAI,YAAY,iBAAiB,aAAa,iBAAiB;IAE/D,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,oBAAY,EAAE;IACjC,IAAI;IACJ,IAAI,UAAU,CAAA,GAAA,aAAK,EAAE;IACrB,IAAI,iBAAiB;QACnB,YAAY,iBAAiB,2BAA2B,CAAC;wBACvD;8BACA;qBACA;QACF;QACA,iBAAiB,sBAAsB,CAAC,CAAC,GAAG,WAAW;IACzD;IACA,IAAI,SAAS,oCACX,OACA,MAAM,OAAO,IAAI,WACjB;IAGF,IAAI,cAAc,6BAAA,uCAAA,iBAAkB,WAAW;IAC/C,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI,iBAAiB;QACnB,YAAY,iBAAiB,2BAA2B,CAAC;wBACvD;8BACA;QACF;QACA,sBAAsB,iBAAiB,sBAAsB,CAAC;YAC5D,kBAAkB,IAAI,CAAA,GAAA,2BAAmB,EAAE;4BACzC;gBACA,cAAc,CAAA,sBAAA,gCAAA,UAAW,YAAY,CAAC,IAAI,IAAG,OAAO,iBAAiB,YAAY;gBACjF,KAAK;gBACL,gBAAgB;YAClB;YACA,oBAAoB;QACtB,GAAG,WAAW;QAEd,mBAAmB,UAAU,YAAY,CAAC;YAAC,MAAM;QAAM;IACzD;IAEA,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,kBAAU,EAAE;QAC5B,GAAG,KAAK;QACR,eAAe;QACf,gBAAgB;kBAChB;IACF,GAAG,OAAO;IAEV,IAAI,aAAa,iBAAiB,UAAU;IAC5C,IAAI,CAAA,sBAAA,iCAAA,oBAAA,UAAW,MAAM,cAAjB,wCAAA,kBAAmB,IAAI,MAAK,QAC9B,aAAa,UAAU,MAAM,CAAC,GAAG;IAGnC,+CAA+C;IAC/C,IAAI,CAAC,4BAA4B,2BAA2B,GAAG,CAAA,GAAA,eAAO,EAAE;IACxE,IAAI,CAAC,8BAA8B,6BAA6B,GAAG,CAAA,GAAA,eAAO,EAAE;IAC5E,uDAAuD;IACvD,CAAA,GAAA,sBAAc,EAAE;QACd,IAAI,OAAO,OAAO,EAAE;YAClB,iEAAiE;YACjE,2BAA2B,OAAO,OAAO,CAAC,WAAW,GAAG,IAAI,OAAO,OAAO,CAAC,WAAW;YACtF,6BAA6B,OAAO,OAAO,CAAC,YAAY,GAAG,IAAI,OAAO,OAAO,CAAC,YAAY;QAC5F;IACF;IAEA,IAAI,iBAAiB,CAAA,GAAA,cAAM,EAAE,IAAM;eAAI;SAAW,CAAC,IAAI,CAAC,CAAA,OAAQ,KAAK,aAAa,GAAG;QAAC;KAAW;IAEjG,qBACE,gCAAC,0CAAgB,QAAQ;QAAC,OAAO;mBAAC;uBAAO;uBAAW;8BAAW;sBAAkB;6BAAU;6BAAiB;oBAAiB;0BAAQ;8BAAc;QAAgB;qBACjK,gCAAC,CAAA,GAAA,iBAAS,uBACR,gCAAC,CAAA,GAAA,gBAAQ;QAAE,gBAAgB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,mDAAS,GAAG;qBAChD,gCAAC,CAAA,GAAA,kBAAU;QACR,GAAG,CAAA,GAAA,iBAAS,EAAE,oBAAmB,gCAAA,0CAAA,oBAAqB,eAAe,GAAE,UAAU;QACjF,GAAG,CAAA,GAAA,qBAAa,EAAE,WAAW;QAC7B,GAAG,SAAS;QACZ,GAAG,UAAU;QACd,WAAW;QACX,YAAY;QACZ,KAAK;QACL,YAAY;QACZ,iBAAgB;QAChB,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,2BACA,CAAC,yBAAyB,EAAE,QAAQ,CAAC,EACrC,uCACA;YACE,kCAAkC;YAClC,wCAAwC,iBAAiB;YACzD,sCAAsC,CAAC,CAAC;YACxC,uCAAuC,CAAC,CAAC;YACzC,uDAAuD;YACvD,yDAAyD;YACzD,2CAA2C;YAC3C,iCAAiC,iBAAiB;QACpD,GACA,WAAW,SAAS;QAGxB,QAAQ;QACR,eAAe,CAAA,GAAA,cAAM,EAAE,IAAO,CAAA;2BAAC;YAAS,CAAA,GAAI;YAAC;SAAU;QACvD,YAAY;OACX,CAAA,GAAA,kBAAU,EAAE,CAAC,MAAM;QAClB,IAAI,SAAS,QACX,qBAAO,gCAAC;YAAK,MAAM;;aACd,IAAI,SAAS,UAClB,qBAAO,gCAAC;aACH,IAAI,SAAS,eAClB,qBAAO,gCAAC;IAEZ,GAAG,EAAE,MAIV,eAAe,iCACd,gCAAC;QAAY,KAAK;OACf;QACC,IAAI,iBAAiB,aAAa,EAChC,OAAO,iBAAiB,aAAa,CAAC,UAAU,YAAY,EAAE,UAAU,UAAU;QAEpF,IAAI,OAAO,MAAM,UAAU,CAAC,OAAO,CAAC,UAAU,UAAU;QACxD,IAAI,YAAY,UAAU,YAAY,CAAC,IAAI;QAC3C,IAAI,aAAa,OAAO,aAAa,CAAC,UAAU,UAAU,EAAE,IAAI,CAAC,MAAM;QACvE,qBAAO,gCAAC,CAAA,GAAA,yCAAkB;YAAE,MAAM;YAAM,WAAW;YAAW,YAAY;YAAY,SAAS;;IACjG;AAKV;AAEA,SAAS,2BAAK,QAAC,IAAI,EAAwB;IACzC,IAAI,mBAAC,eAAe,SAAE,KAAK,YAAE,QAAQ,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;IACpD,qBACE,kEACG,mBAAmB,MAAM,UAAU,CAAC,YAAY,CAAC,KAAK,GAAG,KAAK,sBAC7D,gCAAC,CAAA,GAAA,wCAAgB;QAAE,KAAI;QAExB,iCACC,gCAAC,CAAA,GAAA,wCAAiB;QAChB,KAAK,CAAC,EAAE,KAAK,GAAG,CAAC,OAAO,CAAC;QACzB,QAAQ;YAAC,KAAK,KAAK,GAAG;YAAE,MAAM;YAAQ,cAAc;QAAQ;sBAEhE,gCAAC,CAAA,GAAA,yCAAW;QAAE,MAAM;QAAM,cAAA;QAAa,YAAY,CAAC,CAAC;QACpD,iCACC,gCAAC,CAAA,GAAA,wCAAiB;QAChB,KAAK,CAAC,EAAE,KAAK,GAAG,CAAC,MAAM,CAAC;QACxB,QAAQ;YAAC,KAAK,KAAK,GAAG;YAAE,MAAM;YAAQ,cAAc;QAAO;QAC3D,oBAAoB,MAAM,UAAU,CAAC,WAAW,CAAC,KAAK,GAAG,KAAK;;AAIxE;AAEA,SAAS;IACP,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;IACzB,IAAI,kBAAkB,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,oDAAW,GAAG;IAChE,qBACE,gCAAC,2DACC,gCAAC,CAAA,GAAA,qBAAa;QACZ,iBAAA;QACA,cAAY,MAAM,UAAU,CAAC,IAAI,GAAG,IAAI,gBAAgB,MAAM,CAAC,iBAAiB,gBAAgB,MAAM,CAAC;;AAG/G;AAEA,SAAS;IACP,IAAI,oBAAC,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;IACpC,IAAI,aAAa,mBAAmB,qBAAqB;IACzD,IAAI,cAAc,MAChB,OAAO;IAGT,qBACE,gCAAC,6CACE;AAGP;AAEA,SAAS,sCAAgB,YAAC,QAAQ,EAAC;IACjC,IAAI,SAAC,KAAK,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE;IACzB,qBACE,gCAAC;QACC,MAAK;QACL,iBAAe,MAAM,UAAU,CAAC,IAAI,GAAG;QACvC,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,2CACA;YACE,wDAAwD,MAAM,UAAU,CAAC,IAAI,GAAG;QAClF;qBAEJ,gCAAC;QAAI,MAAK;OACP;AAIT;AAEA;;CAEC,GACD,MAAM,0DAAY,CAAA,GAAA,YAAI,EAAE,UAAU,CAAC","sources":["packages/@react-spectrum/list/src/ListView.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 {AriaGridListProps, useGridList} from '@react-aria/gridlist';\nimport {AsyncLoadable, DOMRef, Key, LoadingState, Node, SpectrumSelectionProps, StyleProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport type {DragAndDropHooks} from '@react-spectrum/dnd';\nimport type {DraggableCollectionState, DroppableCollectionState} from '@react-stately/dnd';\nimport type {DroppableCollectionResult} from '@react-aria/dnd';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {FocusRing, FocusScope} from '@react-aria/focus';\nimport InsertionIndicator from './InsertionIndicator';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate} from '@react-aria/selection';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\nimport {ListViewLayout} from './ListViewLayout';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport RootDropIndicator from './RootDropIndicator';\nimport {DragPreview as SpectrumDragPreview} from './DragPreview';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer} from '@react-aria/virtualizer';\n\nexport interface SpectrumListViewProps<T> extends Omit<AriaGridListProps<T>, 'keyboardNavigationBehavior'>, StyleProps, SpectrumSelectionProps, Omit<AsyncLoadable, 'isLoading'> {\n /**\n * Sets the amount of vertical padding within each cell.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the ListView should be displayed with a quiet style. */\n isQuiet?: boolean,\n /** The current loading state of the ListView. Determines whether or not the progress circle should be shown. */\n loadingState?: LoadingState,\n /**\n * Sets the text behavior for the row contents.\n * @default 'truncate'\n */\n overflowMode?: 'truncate' | 'wrap',\n /** Sets what the ListView should render when there is no content to display. */\n renderEmptyState?: () => JSX.Element,\n /**\n * Handler that is called when a user performs an action on an item. The exact user event depends on\n * the collection's `selectionStyle` prop and the interaction modality.\n */\n onAction?: (key: Key) => void,\n /**\n * The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListView.\n */\n dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks']\n}\n\ninterface ListViewContextValue<T> {\n state: ListState<T>,\n dragState: DraggableCollectionState,\n dropState: DroppableCollectionState,\n dragAndDropHooks: DragAndDropHooks['dragAndDropHooks'],\n onAction:(key: Key) => void,\n isListDraggable: boolean,\n isListDroppable: boolean,\n layout: ListViewLayout<T>,\n loadingState: LoadingState,\n renderEmptyState?: () => JSX.Element\n}\n\nexport const ListViewContext = React.createContext<ListViewContextValue<unknown>>(null);\n\nconst ROW_HEIGHTS = {\n compact: {\n medium: 32,\n large: 40\n },\n regular: {\n medium: 40,\n large: 50\n },\n spacious: {\n medium: 48,\n large: 60\n }\n};\n\nfunction useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {\n let {scale} = useProvider();\n let layout = useMemo(() =>\n new ListViewLayout<T>({\n estimatedRowHeight: ROW_HEIGHTS[density][scale]\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n , [scale, density, overflowMode]);\n\n return layout;\n}\n\nfunction ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n let {\n density = 'regular',\n loadingState,\n onLoadMore,\n isQuiet,\n overflowMode = 'truncate',\n onAction,\n dragAndDropHooks,\n renderEmptyState,\n ...otherProps\n } = props;\n let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n let dragHooksProvided = useRef(isListDraggable);\n let dropHooksProvided = useRef(isListDroppable);\n useEffect(() => {\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 domRef = useDOMRef(ref);\n let state = useListState({\n ...props,\n selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'\n });\n let {collection, selectionManager} = state;\n let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n\n let {styleProps} = useStyleProps(props);\n let dragState: DraggableCollectionState;\n let preview = useRef(null);\n if (isListDraggable) {\n dragState = dragAndDropHooks.useDraggableCollectionState({\n collection,\n selectionManager,\n preview\n });\n dragAndDropHooks.useDraggableCollection({}, dragState, domRef);\n }\n let layout = useListLayout(\n state,\n props.density || 'regular',\n overflowMode\n );\n\n let DragPreview = dragAndDropHooks?.DragPreview;\n let dropState: DroppableCollectionState;\n let droppableCollection: DroppableCollectionResult;\n let isRootDropTarget: boolean;\n if (isListDroppable) {\n dropState = dragAndDropHooks.useDroppableCollectionState({\n collection,\n selectionManager\n });\n droppableCollection = dragAndDropHooks.useDroppableCollection({\n keyboardDelegate: new ListKeyboardDelegate({\n collection,\n disabledKeys: dragState?.draggingKeys.size ? null : selectionManager.disabledKeys,\n ref: domRef,\n layoutDelegate: layout\n }),\n dropTargetDelegate: layout\n }, dropState, domRef);\n\n isRootDropTarget = dropState.isDropTarget({type: 'root'});\n }\n\n let {gridProps} = useGridList({\n ...props,\n isVirtualized: true,\n layoutDelegate: layout,\n onAction\n }, state, domRef);\n\n let focusedKey = selectionManager.focusedKey;\n if (dropState?.target?.type === 'item') {\n focusedKey = dropState.target.key;\n }\n\n // wait for layout to get accurate measurements\n let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);\n let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(() => {\n if (domRef.current) {\n // 2 is the width of the border which is not part of the box size\n setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);\n setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);\n }\n });\n\n let hasAnyChildren = useMemo(() => [...collection].some(item => item.hasChildNodes), [collection]);\n\n return (\n <ListViewContext.Provider value={{state, dragState, dropState, dragAndDropHooks, onAction, isListDraggable, isListDroppable, layout, loadingState, renderEmptyState}}>\n <FocusScope>\n <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n <Virtualizer\n {...mergeProps(isListDroppable && droppableCollection?.collectionProps, gridProps)}\n {...filterDOMProps(otherProps)}\n {...gridProps}\n {...styleProps}\n isLoading={isLoading}\n onLoadMore={onLoadMore}\n ref={domRef}\n focusedKey={focusedKey}\n scrollDirection=\"vertical\"\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView',\n `react-spectrum-ListView--${density}`,\n 'react-spectrum-ListView--emphasized',\n {\n 'react-spectrum-ListView--quiet': isQuiet,\n 'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',\n 'react-spectrum-ListView--draggable': !!isListDraggable,\n 'react-spectrum-ListView--dropTarget': !!isRootDropTarget,\n 'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,\n 'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,\n 'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,\n 'react-spectrum-ListView--wrap': overflowMode === 'wrap'\n },\n styleProps.className\n )\n }\n layout={layout}\n layoutOptions={useMemo(() => ({isLoading}), [isLoading])}\n collection={collection}>\n {useCallback((type, item) => {\n if (type === 'item') {\n return <Item item={item} />;\n } else if (type === 'loader') {\n return <LoadingView />;\n } else if (type === 'placeholder') {\n return <EmptyState />;\n }\n }, [])}\n </Virtualizer>\n </FocusRing>\n </FocusScope>\n {DragPreview && isListDraggable &&\n <DragPreview ref={preview}>\n {() => {\n if (dragAndDropHooks.renderPreview) {\n return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);\n }\n let item = state.collection.getItem(dragState.draggedKey);\n let itemCount = dragState.draggingKeys.size;\n let itemHeight = layout.getLayoutInfo(dragState.draggedKey).rect.height;\n return <SpectrumDragPreview item={item} itemCount={itemCount} itemHeight={itemHeight} density={density} />;\n }}\n </DragPreview>\n }\n </ListViewContext.Provider>\n );\n}\n\nfunction Item({item}: {item: Node<unknown>}) {\n let {isListDroppable, state, onAction} = useContext(ListViewContext);\n return (\n <>\n {isListDroppable && state.collection.getKeyBefore(item.key) == null &&\n <RootDropIndicator key=\"root\" />\n }\n {isListDroppable &&\n <InsertionIndicator\n key={`${item.key}-before`}\n target={{key: item.key, type: 'item', dropPosition: 'before'}} />\n }\n <ListViewItem item={item} isEmphasized hasActions={!!onAction} />\n {isListDroppable &&\n <InsertionIndicator\n key={`${item.key}-after`}\n target={{key: item.key, type: 'item', dropPosition: 'after'}}\n isPresentationOnly={state.collection.getKeyAfter(item.key) != null} />\n }\n </>\n );\n}\n\nfunction LoadingView() {\n let {state} = useContext(ListViewContext);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n}\n\nfunction EmptyState() {\n let {renderEmptyState} = useContext(ListViewContext);\n let emptyState = renderEmptyState ? renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n}\n\nfunction CenteredWrapper({children}) {\n let {state} = useContext(ListViewContext);\n return (\n <div\n role=\"row\"\n aria-rowindex={state.collection.size + 1}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView-centeredWrapper',\n {\n 'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0\n }\n )}>\n <div role=\"gridcell\">\n {children}\n </div>\n </div>\n );\n}\n\n/**\n * A ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.\n */\nconst _ListView = React.forwardRef(ListView) as <T>(props: SpectrumListViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_ListView as ListView};\n"],"names":[],"version":3,"file":"ListView.module.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/list/src/ListView.tsx"],"sourcesContent":["/*\n * Copyright 2021 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 {AriaGridListProps, useGridList} from '@react-aria/gridlist';\nimport {AsyncLoadable, DOMRef, Key, LoadingState, Node, SpectrumSelectionProps, StyleProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport type {DragAndDropHooks} from '@react-spectrum/dnd';\nimport type {DraggableCollectionState, DroppableCollectionState} from '@react-stately/dnd';\nimport type {DroppableCollectionResult} from '@react-aria/dnd';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {FocusRing, FocusScope} from '@react-aria/focus';\nimport InsertionIndicator from './InsertionIndicator';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate} from '@react-aria/selection';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\nimport {ListViewLayout} from './ListViewLayout';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport RootDropIndicator from './RootDropIndicator';\nimport {DragPreview as SpectrumDragPreview} from './DragPreview';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer} from '@react-aria/virtualizer';\n\nexport interface SpectrumListViewProps<T> extends Omit<AriaGridListProps<T>, 'keyboardNavigationBehavior'>, StyleProps, SpectrumSelectionProps, Omit<AsyncLoadable, 'isLoading'> {\n /**\n * Sets the amount of vertical padding within each cell.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the ListView should be displayed with a quiet style. */\n isQuiet?: boolean,\n /** The current loading state of the ListView. Determines whether or not the progress circle should be shown. */\n loadingState?: LoadingState,\n /**\n * Sets the text behavior for the row contents.\n * @default 'truncate'\n */\n overflowMode?: 'truncate' | 'wrap',\n /** Sets what the ListView should render when there is no content to display. */\n renderEmptyState?: () => JSX.Element,\n /**\n * Handler that is called when a user performs an action on an item. The exact user event depends on\n * the collection's `selectionStyle` prop and the interaction modality.\n */\n onAction?: (key: Key) => void,\n /**\n * The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListView.\n */\n dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks']\n}\n\ninterface ListViewContextValue<T> {\n state: ListState<T>,\n dragState: DraggableCollectionState,\n dropState: DroppableCollectionState,\n dragAndDropHooks: DragAndDropHooks['dragAndDropHooks'],\n onAction:(key: Key) => void,\n isListDraggable: boolean,\n isListDroppable: boolean,\n layout: ListViewLayout<T>,\n loadingState: LoadingState,\n renderEmptyState?: () => JSX.Element\n}\n\nexport const ListViewContext = React.createContext<ListViewContextValue<unknown>>(null);\n\nconst ROW_HEIGHTS = {\n compact: {\n medium: 32,\n large: 40\n },\n regular: {\n medium: 40,\n large: 50\n },\n spacious: {\n medium: 48,\n large: 60\n }\n};\n\nfunction useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {\n let {scale} = useProvider();\n let layout = useMemo(() =>\n new ListViewLayout<T>({\n estimatedRowHeight: ROW_HEIGHTS[density][scale]\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n , [scale, density, overflowMode]);\n\n return layout;\n}\n\nfunction ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n let {\n density = 'regular',\n loadingState,\n onLoadMore,\n isQuiet,\n overflowMode = 'truncate',\n onAction,\n dragAndDropHooks,\n renderEmptyState,\n ...otherProps\n } = props;\n let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n let dragHooksProvided = useRef(isListDraggable);\n let dropHooksProvided = useRef(isListDroppable);\n useEffect(() => {\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 domRef = useDOMRef(ref);\n let state = useListState({\n ...props,\n selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'\n });\n let {collection, selectionManager} = state;\n let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n\n let {styleProps} = useStyleProps(props);\n let dragState: DraggableCollectionState;\n let preview = useRef(null);\n if (isListDraggable) {\n dragState = dragAndDropHooks.useDraggableCollectionState({\n collection,\n selectionManager,\n preview\n });\n dragAndDropHooks.useDraggableCollection({}, dragState, domRef);\n }\n let layout = useListLayout(\n state,\n props.density || 'regular',\n overflowMode\n );\n\n let DragPreview = dragAndDropHooks?.DragPreview;\n let dropState: DroppableCollectionState;\n let droppableCollection: DroppableCollectionResult;\n let isRootDropTarget: boolean;\n if (isListDroppable) {\n dropState = dragAndDropHooks.useDroppableCollectionState({\n collection,\n selectionManager\n });\n droppableCollection = dragAndDropHooks.useDroppableCollection({\n keyboardDelegate: new ListKeyboardDelegate({\n collection,\n disabledKeys: dragState?.draggingKeys.size ? null : selectionManager.disabledKeys,\n ref: domRef,\n layoutDelegate: layout\n }),\n dropTargetDelegate: layout\n }, dropState, domRef);\n\n isRootDropTarget = dropState.isDropTarget({type: 'root'});\n }\n\n let {gridProps} = useGridList({\n ...props,\n isVirtualized: true,\n layoutDelegate: layout,\n onAction\n }, state, domRef);\n\n let focusedKey = selectionManager.focusedKey;\n let dropTargetKey: Key | null = null;\n if (dropState?.target?.type === 'item') {\n dropTargetKey = dropState.target.key;\n if (dropState.target.dropPosition === 'after') {\n // Normalize to the \"before\" drop position since we only render those in the DOM.\n dropTargetKey = state.collection.getKeyAfter(dropTargetKey) ?? dropTargetKey;\n }\n }\n\n let persistedKeys = useMemo(() => {\n return new Set([focusedKey, dropTargetKey].filter(k => k !== null));\n }, [focusedKey, dropTargetKey]);\n\n // wait for layout to get accurate measurements\n let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);\n let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(() => {\n if (domRef.current) {\n // 2 is the width of the border which is not part of the box size\n setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);\n setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);\n }\n });\n\n let hasAnyChildren = useMemo(() => [...collection].some(item => item.hasChildNodes), [collection]);\n\n return (\n <ListViewContext.Provider value={{state, dragState, dropState, dragAndDropHooks, onAction, isListDraggable, isListDroppable, layout, loadingState, renderEmptyState}}>\n <FocusScope>\n <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n <Virtualizer\n {...mergeProps(isListDroppable && droppableCollection?.collectionProps, gridProps)}\n {...filterDOMProps(otherProps)}\n {...gridProps}\n {...styleProps}\n isLoading={isLoading}\n onLoadMore={onLoadMore}\n ref={domRef}\n persistedKeys={persistedKeys}\n scrollDirection=\"vertical\"\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView',\n `react-spectrum-ListView--${density}`,\n 'react-spectrum-ListView--emphasized',\n {\n 'react-spectrum-ListView--quiet': isQuiet,\n 'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',\n 'react-spectrum-ListView--draggable': !!isListDraggable,\n 'react-spectrum-ListView--dropTarget': !!isRootDropTarget,\n 'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,\n 'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,\n 'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,\n 'react-spectrum-ListView--wrap': overflowMode === 'wrap'\n },\n styleProps.className\n )\n }\n layout={layout}\n layoutOptions={useMemo(() => ({isLoading}), [isLoading])}\n collection={collection}>\n {useCallback((type, item) => {\n if (type === 'item') {\n return <Item item={item} />;\n } else if (type === 'loader') {\n return <LoadingView />;\n } else if (type === 'placeholder') {\n return <EmptyState />;\n }\n }, [])}\n </Virtualizer>\n </FocusRing>\n </FocusScope>\n {DragPreview && isListDraggable &&\n <DragPreview ref={preview}>\n {() => {\n if (dragAndDropHooks.renderPreview) {\n return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);\n }\n let item = state.collection.getItem(dragState.draggedKey);\n let itemCount = dragState.draggingKeys.size;\n let itemHeight = layout.getLayoutInfo(dragState.draggedKey).rect.height;\n return <SpectrumDragPreview item={item} itemCount={itemCount} itemHeight={itemHeight} density={density} />;\n }}\n </DragPreview>\n }\n </ListViewContext.Provider>\n );\n}\n\nfunction Item({item}: {item: Node<unknown>}) {\n let {isListDroppable, state, onAction} = useContext(ListViewContext);\n return (\n <>\n {isListDroppable && state.collection.getKeyBefore(item.key) == null &&\n <RootDropIndicator key=\"root\" />\n }\n {isListDroppable &&\n <InsertionIndicator\n key={`${item.key}-before`}\n target={{key: item.key, type: 'item', dropPosition: 'before'}} />\n }\n <ListViewItem item={item} isEmphasized hasActions={!!onAction} />\n {isListDroppable &&\n <InsertionIndicator\n key={`${item.key}-after`}\n target={{key: item.key, type: 'item', dropPosition: 'after'}}\n isPresentationOnly={state.collection.getKeyAfter(item.key) != null} />\n }\n </>\n );\n}\n\nfunction LoadingView() {\n let {state} = useContext(ListViewContext);\n let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n}\n\nfunction EmptyState() {\n let {renderEmptyState} = useContext(ListViewContext);\n let emptyState = renderEmptyState ? renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n}\n\nfunction CenteredWrapper({children}) {\n let {state} = useContext(ListViewContext);\n return (\n <div\n role=\"row\"\n aria-rowindex={state.collection.size + 1}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView-centeredWrapper',\n {\n 'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0\n }\n )}>\n <div role=\"gridcell\">\n {children}\n </div>\n </div>\n );\n}\n\n/**\n * A ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.\n */\nconst _ListView = React.forwardRef(ListView) as <T>(props: SpectrumListViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\nexport {_ListView as ListView};\n"],"names":[],"version":3,"file":"ListView.module.js.map"}
@@ -20,10 +20,10 @@ $parcel$export(module.exports, "ListViewLayout", () => $a0cb8c9f009bf274$export$
20
20
  */
21
21
 
22
22
  class $a0cb8c9f009bf274$export$dab781655dfbb7d3 extends (0, $gyQtY$reactstatelylayout.ListLayout) {
23
- validate(invalidationContext) {
23
+ update(invalidationContext) {
24
24
  var _invalidationContext_layoutOptions;
25
25
  this.isLoading = ((_invalidationContext_layoutOptions = invalidationContext.layoutOptions) === null || _invalidationContext_layoutOptions === void 0 ? void 0 : _invalidationContext_layoutOptions.isLoading) || false;
26
- super.validate(invalidationContext);
26
+ super.update(invalidationContext);
27
27
  }
28
28
  buildCollection() {
29
29
  let nodes = super.buildCollection();
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;AASM,MAAM,kDAA0B,CAAA,GAAA,oCAAS;IAG9C,SAAS,mBAA6D,EAAQ;YAC3D;QAAjB,IAAI,CAAC,SAAS,GAAG,EAAA,qCAAA,oBAAoB,aAAa,cAAjC,yDAAA,mCAAmC,SAAS,KAAI;QACjE,KAAK,CAAC,SAAS;IACjB;IAEU,kBAAgC;QACxC,IAAI,QAAQ,KAAK,CAAC;QAClB,IAAI,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM;QAE/B,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,OAAO,IAAI,CAAA,GAAA,mCAAG,EAAE,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,KAAK,EAAE,MAAM,MAAM,KAAK,IAAI,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB;YAChJ,IAAI,SAAS,IAAI,CAAA,GAAA,yCAAS,EAAE,UAAU,UAAU;YAChD,IAAI,OAAO;gBACT,YAAY;gBACZ,WAAW,OAAO,IAAI;YACxB;YACA,MAAM,IAAI,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,GAAG,EAAE;YACjC,IAAI,OAAO,IAAI,CAAC,IAAI;QACtB;QAEA,IAAI,MAAM,MAAM,KAAK,GAAG;YACtB,IAAI,OAAO,IAAI,CAAA,GAAA,mCAAG,EAAE,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM;YACjG,IAAI,cAAc,IAAI,CAAA,GAAA,yCAAS,EAAE,eAAe,eAAe;YAC/D,IAAI,OAAO;gBACT,YAAY;gBACZ,WAAW,YAAY,IAAI;YAC7B;YACA,MAAM,IAAI,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,YAAY,GAAG,EAAE;YACtC,IAAI,YAAY,IAAI,CAAC,IAAI;QAC3B;QAEA,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG;QAC1B,OAAO;IACT;IAEU,UAAU,IAAa,EAAE,CAAS,EAAE,CAAS,EAAc;QACnE,IAAI,MAAM,KAAK,CAAC,UAAU,MAAM,GAAG;QACnC,gHAAgH;QAChH,IAAI,UAAU,CAAC,aAAa,GAAG;QAC/B,OAAO;IACT;;;aA5CQ,YAAqB;;AA6C/B","sources":["packages/@react-spectrum/list/src/ListViewLayout.ts"],"sourcesContent":["/*\n * Copyright 2024 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 */\nimport {InvalidationContext, LayoutInfo, Rect} from '@react-stately/virtualizer';\nimport {LayoutNode, ListLayout} from '@react-stately/layout';\nimport {Node} from '@react-types/shared';\n\ninterface ListViewLayoutProps {\n isLoading?: boolean\n}\n\nexport class ListViewLayout<T> extends ListLayout<T, ListViewLayoutProps> {\n private isLoading: boolean = false;\n\n validate(invalidationContext: InvalidationContext<ListViewLayoutProps>): void {\n this.isLoading = invalidationContext.layoutOptions?.isLoading || false;\n super.validate(invalidationContext);\n }\n\n protected buildCollection(): LayoutNode[] {\n let nodes = super.buildCollection();\n let y = this.contentSize.height;\n\n if (this.isLoading) {\n let rect = new Rect(0, y, this.virtualizer.visibleRect.width, nodes.length === 0 ? this.virtualizer.visibleRect.height : this.estimatedRowHeight);\n let loader = new LayoutInfo('loader', 'loader', rect);\n let node = {\n layoutInfo: loader,\n validRect: loader.rect\n };\n nodes.push(node);\n this.layoutNodes.set(loader.key, node);\n y = loader.rect.maxY;\n }\n\n if (nodes.length === 0) {\n let rect = new Rect(0, y, this.virtualizer.visibleRect.width, this.virtualizer.visibleRect.height);\n let placeholder = new LayoutInfo('placeholder', 'placeholder', rect);\n let node = {\n layoutInfo: placeholder,\n validRect: placeholder.rect\n };\n nodes.push(node);\n this.layoutNodes.set(placeholder.key, node);\n y = placeholder.rect.maxY;\n }\n\n this.contentSize.height = y;\n return nodes;\n }\n\n protected buildItem(node: Node<T>, x: number, y: number): LayoutNode {\n let res = super.buildItem(node, x, y);\n // allow overflow so the focus ring/selection ring can extend outside to overlap with the adjacent items borders\n res.layoutInfo.allowOverflow = true;\n return res;\n }\n}\n"],"names":[],"version":3,"file":"ListViewLayout.main.js.map"}
1
+ {"mappings":";;;;;;;;;AAAA;;;;;;;;;;CAUC;;AASM,MAAM,kDAA0B,CAAA,GAAA,oCAAS;IAG9C,OAAO,mBAA6D,EAAQ;YACzD;QAAjB,IAAI,CAAC,SAAS,GAAG,EAAA,qCAAA,oBAAoB,aAAa,cAAjC,yDAAA,mCAAmC,SAAS,KAAI;QACjE,KAAK,CAAC,OAAO;IACf;IAEU,kBAAgC;QACxC,IAAI,QAAQ,KAAK,CAAC;QAClB,IAAI,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM;QAE/B,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,OAAO,IAAI,CAAA,GAAA,mCAAG,EAAE,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,KAAK,EAAE,MAAM,MAAM,KAAK,IAAI,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB;YAChJ,IAAI,SAAS,IAAI,CAAA,GAAA,yCAAS,EAAE,UAAU,UAAU;YAChD,IAAI,OAAO;gBACT,YAAY;gBACZ,WAAW,OAAO,IAAI;YACxB;YACA,MAAM,IAAI,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,GAAG,EAAE;YACjC,IAAI,OAAO,IAAI,CAAC,IAAI;QACtB;QAEA,IAAI,MAAM,MAAM,KAAK,GAAG;YACtB,IAAI,OAAO,IAAI,CAAA,GAAA,mCAAG,EAAE,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM;YACjG,IAAI,cAAc,IAAI,CAAA,GAAA,yCAAS,EAAE,eAAe,eAAe;YAC/D,IAAI,OAAO;gBACT,YAAY;gBACZ,WAAW,YAAY,IAAI;YAC7B;YACA,MAAM,IAAI,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,YAAY,GAAG,EAAE;YACtC,IAAI,YAAY,IAAI,CAAC,IAAI;QAC3B;QAEA,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG;QAC1B,OAAO;IACT;IAEU,UAAU,IAAa,EAAE,CAAS,EAAE,CAAS,EAAc;QACnE,IAAI,MAAM,KAAK,CAAC,UAAU,MAAM,GAAG;QACnC,gHAAgH;QAChH,IAAI,UAAU,CAAC,aAAa,GAAG;QAC/B,OAAO;IACT;;;aA5CQ,YAAqB;;AA6C/B","sources":["packages/@react-spectrum/list/src/ListViewLayout.ts"],"sourcesContent":["/*\n * Copyright 2024 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 */\nimport {InvalidationContext, LayoutInfo, Rect} from '@react-stately/virtualizer';\nimport {LayoutNode, ListLayout} from '@react-stately/layout';\nimport {Node} from '@react-types/shared';\n\ninterface ListViewLayoutProps {\n isLoading?: boolean\n}\n\nexport class ListViewLayout<T> extends ListLayout<T, ListViewLayoutProps> {\n private isLoading: boolean = false;\n\n update(invalidationContext: InvalidationContext<ListViewLayoutProps>): void {\n this.isLoading = invalidationContext.layoutOptions?.isLoading || false;\n super.update(invalidationContext);\n }\n\n protected buildCollection(): LayoutNode[] {\n let nodes = super.buildCollection();\n let y = this.contentSize.height;\n\n if (this.isLoading) {\n let rect = new Rect(0, y, this.virtualizer.visibleRect.width, nodes.length === 0 ? this.virtualizer.visibleRect.height : this.estimatedRowHeight);\n let loader = new LayoutInfo('loader', 'loader', rect);\n let node = {\n layoutInfo: loader,\n validRect: loader.rect\n };\n nodes.push(node);\n this.layoutNodes.set(loader.key, node);\n y = loader.rect.maxY;\n }\n\n if (nodes.length === 0) {\n let rect = new Rect(0, y, this.virtualizer.visibleRect.width, this.virtualizer.visibleRect.height);\n let placeholder = new LayoutInfo('placeholder', 'placeholder', rect);\n let node = {\n layoutInfo: placeholder,\n validRect: placeholder.rect\n };\n nodes.push(node);\n this.layoutNodes.set(placeholder.key, node);\n y = placeholder.rect.maxY;\n }\n\n this.contentSize.height = y;\n return nodes;\n }\n\n protected buildItem(node: Node<T>, x: number, y: number): LayoutNode {\n let res = super.buildItem(node, x, y);\n // allow overflow so the focus ring/selection ring can extend outside to overlap with the adjacent items borders\n res.layoutInfo.allowOverflow = true;\n return res;\n }\n}\n"],"names":[],"version":3,"file":"ListViewLayout.main.js.map"}
@@ -14,10 +14,10 @@ import {ListLayout as $9jo3j$ListLayout} from "@react-stately/layout";
14
14
  */
15
15
 
16
16
  class $bc6cc67dd6240ebd$export$dab781655dfbb7d3 extends (0, $9jo3j$ListLayout) {
17
- validate(invalidationContext) {
17
+ update(invalidationContext) {
18
18
  var _invalidationContext_layoutOptions;
19
19
  this.isLoading = ((_invalidationContext_layoutOptions = invalidationContext.layoutOptions) === null || _invalidationContext_layoutOptions === void 0 ? void 0 : _invalidationContext_layoutOptions.isLoading) || false;
20
- super.validate(invalidationContext);
20
+ super.update(invalidationContext);
21
21
  }
22
22
  buildCollection() {
23
23
  let nodes = super.buildCollection();
@@ -14,10 +14,10 @@ import {ListLayout as $9jo3j$ListLayout} from "@react-stately/layout";
14
14
  */
15
15
 
16
16
  class $bc6cc67dd6240ebd$export$dab781655dfbb7d3 extends (0, $9jo3j$ListLayout) {
17
- validate(invalidationContext) {
17
+ update(invalidationContext) {
18
18
  var _invalidationContext_layoutOptions;
19
19
  this.isLoading = ((_invalidationContext_layoutOptions = invalidationContext.layoutOptions) === null || _invalidationContext_layoutOptions === void 0 ? void 0 : _invalidationContext_layoutOptions.isLoading) || false;
20
- super.validate(invalidationContext);
20
+ super.update(invalidationContext);
21
21
  }
22
22
  buildCollection() {
23
23
  let nodes = super.buildCollection();
@@ -1 +1 @@
1
- {"mappings":";;;AAAA;;;;;;;;;;CAUC;;AASM,MAAM,kDAA0B,CAAA,GAAA,iBAAS;IAG9C,SAAS,mBAA6D,EAAQ;YAC3D;QAAjB,IAAI,CAAC,SAAS,GAAG,EAAA,qCAAA,oBAAoB,aAAa,cAAjC,yDAAA,mCAAmC,SAAS,KAAI;QACjE,KAAK,CAAC,SAAS;IACjB;IAEU,kBAAgC;QACxC,IAAI,QAAQ,KAAK,CAAC;QAClB,IAAI,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM;QAE/B,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,OAAO,IAAI,CAAA,GAAA,WAAG,EAAE,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,KAAK,EAAE,MAAM,MAAM,KAAK,IAAI,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB;YAChJ,IAAI,SAAS,IAAI,CAAA,GAAA,iBAAS,EAAE,UAAU,UAAU;YAChD,IAAI,OAAO;gBACT,YAAY;gBACZ,WAAW,OAAO,IAAI;YACxB;YACA,MAAM,IAAI,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,GAAG,EAAE;YACjC,IAAI,OAAO,IAAI,CAAC,IAAI;QACtB;QAEA,IAAI,MAAM,MAAM,KAAK,GAAG;YACtB,IAAI,OAAO,IAAI,CAAA,GAAA,WAAG,EAAE,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM;YACjG,IAAI,cAAc,IAAI,CAAA,GAAA,iBAAS,EAAE,eAAe,eAAe;YAC/D,IAAI,OAAO;gBACT,YAAY;gBACZ,WAAW,YAAY,IAAI;YAC7B;YACA,MAAM,IAAI,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,YAAY,GAAG,EAAE;YACtC,IAAI,YAAY,IAAI,CAAC,IAAI;QAC3B;QAEA,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG;QAC1B,OAAO;IACT;IAEU,UAAU,IAAa,EAAE,CAAS,EAAE,CAAS,EAAc;QACnE,IAAI,MAAM,KAAK,CAAC,UAAU,MAAM,GAAG;QACnC,gHAAgH;QAChH,IAAI,UAAU,CAAC,aAAa,GAAG;QAC/B,OAAO;IACT;;;aA5CQ,YAAqB;;AA6C/B","sources":["packages/@react-spectrum/list/src/ListViewLayout.ts"],"sourcesContent":["/*\n * Copyright 2024 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 */\nimport {InvalidationContext, LayoutInfo, Rect} from '@react-stately/virtualizer';\nimport {LayoutNode, ListLayout} from '@react-stately/layout';\nimport {Node} from '@react-types/shared';\n\ninterface ListViewLayoutProps {\n isLoading?: boolean\n}\n\nexport class ListViewLayout<T> extends ListLayout<T, ListViewLayoutProps> {\n private isLoading: boolean = false;\n\n validate(invalidationContext: InvalidationContext<ListViewLayoutProps>): void {\n this.isLoading = invalidationContext.layoutOptions?.isLoading || false;\n super.validate(invalidationContext);\n }\n\n protected buildCollection(): LayoutNode[] {\n let nodes = super.buildCollection();\n let y = this.contentSize.height;\n\n if (this.isLoading) {\n let rect = new Rect(0, y, this.virtualizer.visibleRect.width, nodes.length === 0 ? this.virtualizer.visibleRect.height : this.estimatedRowHeight);\n let loader = new LayoutInfo('loader', 'loader', rect);\n let node = {\n layoutInfo: loader,\n validRect: loader.rect\n };\n nodes.push(node);\n this.layoutNodes.set(loader.key, node);\n y = loader.rect.maxY;\n }\n\n if (nodes.length === 0) {\n let rect = new Rect(0, y, this.virtualizer.visibleRect.width, this.virtualizer.visibleRect.height);\n let placeholder = new LayoutInfo('placeholder', 'placeholder', rect);\n let node = {\n layoutInfo: placeholder,\n validRect: placeholder.rect\n };\n nodes.push(node);\n this.layoutNodes.set(placeholder.key, node);\n y = placeholder.rect.maxY;\n }\n\n this.contentSize.height = y;\n return nodes;\n }\n\n protected buildItem(node: Node<T>, x: number, y: number): LayoutNode {\n let res = super.buildItem(node, x, y);\n // allow overflow so the focus ring/selection ring can extend outside to overlap with the adjacent items borders\n res.layoutInfo.allowOverflow = true;\n return res;\n }\n}\n"],"names":[],"version":3,"file":"ListViewLayout.module.js.map"}
1
+ {"mappings":";;;AAAA;;;;;;;;;;CAUC;;AASM,MAAM,kDAA0B,CAAA,GAAA,iBAAS;IAG9C,OAAO,mBAA6D,EAAQ;YACzD;QAAjB,IAAI,CAAC,SAAS,GAAG,EAAA,qCAAA,oBAAoB,aAAa,cAAjC,yDAAA,mCAAmC,SAAS,KAAI;QACjE,KAAK,CAAC,OAAO;IACf;IAEU,kBAAgC;QACxC,IAAI,QAAQ,KAAK,CAAC;QAClB,IAAI,IAAI,IAAI,CAAC,WAAW,CAAC,MAAM;QAE/B,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,OAAO,IAAI,CAAA,GAAA,WAAG,EAAE,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,KAAK,EAAE,MAAM,MAAM,KAAK,IAAI,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM,GAAG,IAAI,CAAC,kBAAkB;YAChJ,IAAI,SAAS,IAAI,CAAA,GAAA,iBAAS,EAAE,UAAU,UAAU;YAChD,IAAI,OAAO;gBACT,YAAY;gBACZ,WAAW,OAAO,IAAI;YACxB;YACA,MAAM,IAAI,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,OAAO,GAAG,EAAE;YACjC,IAAI,OAAO,IAAI,CAAC,IAAI;QACtB;QAEA,IAAI,MAAM,MAAM,KAAK,GAAG;YACtB,IAAI,OAAO,IAAI,CAAA,GAAA,WAAG,EAAE,GAAG,GAAG,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC,WAAW,CAAC,MAAM;YACjG,IAAI,cAAc,IAAI,CAAA,GAAA,iBAAS,EAAE,eAAe,eAAe;YAC/D,IAAI,OAAO;gBACT,YAAY;gBACZ,WAAW,YAAY,IAAI;YAC7B;YACA,MAAM,IAAI,CAAC;YACX,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,YAAY,GAAG,EAAE;YACtC,IAAI,YAAY,IAAI,CAAC,IAAI;QAC3B;QAEA,IAAI,CAAC,WAAW,CAAC,MAAM,GAAG;QAC1B,OAAO;IACT;IAEU,UAAU,IAAa,EAAE,CAAS,EAAE,CAAS,EAAc;QACnE,IAAI,MAAM,KAAK,CAAC,UAAU,MAAM,GAAG;QACnC,gHAAgH;QAChH,IAAI,UAAU,CAAC,aAAa,GAAG;QAC/B,OAAO;IACT;;;aA5CQ,YAAqB;;AA6C/B","sources":["packages/@react-spectrum/list/src/ListViewLayout.ts"],"sourcesContent":["/*\n * Copyright 2024 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 */\nimport {InvalidationContext, LayoutInfo, Rect} from '@react-stately/virtualizer';\nimport {LayoutNode, ListLayout} from '@react-stately/layout';\nimport {Node} from '@react-types/shared';\n\ninterface ListViewLayoutProps {\n isLoading?: boolean\n}\n\nexport class ListViewLayout<T> extends ListLayout<T, ListViewLayoutProps> {\n private isLoading: boolean = false;\n\n update(invalidationContext: InvalidationContext<ListViewLayoutProps>): void {\n this.isLoading = invalidationContext.layoutOptions?.isLoading || false;\n super.update(invalidationContext);\n }\n\n protected buildCollection(): LayoutNode[] {\n let nodes = super.buildCollection();\n let y = this.contentSize.height;\n\n if (this.isLoading) {\n let rect = new Rect(0, y, this.virtualizer.visibleRect.width, nodes.length === 0 ? this.virtualizer.visibleRect.height : this.estimatedRowHeight);\n let loader = new LayoutInfo('loader', 'loader', rect);\n let node = {\n layoutInfo: loader,\n validRect: loader.rect\n };\n nodes.push(node);\n this.layoutNodes.set(loader.key, node);\n y = loader.rect.maxY;\n }\n\n if (nodes.length === 0) {\n let rect = new Rect(0, y, this.virtualizer.visibleRect.width, this.virtualizer.visibleRect.height);\n let placeholder = new LayoutInfo('placeholder', 'placeholder', rect);\n let node = {\n layoutInfo: placeholder,\n validRect: placeholder.rect\n };\n nodes.push(node);\n this.layoutNodes.set(placeholder.key, node);\n y = placeholder.rect.maxY;\n }\n\n this.contentSize.height = y;\n return nodes;\n }\n\n protected buildItem(node: Node<T>, x: number, y: number): LayoutNode {\n let res = super.buildItem(node, x, y);\n // allow overflow so the focus ring/selection ring can extend outside to overlap with the adjacent items borders\n res.layoutInfo.allowOverflow = true;\n return res;\n }\n}\n"],"names":[],"version":3,"file":"ListViewLayout.module.js.map"}
@@ -1 +1 @@
1
- {"mappings":";;;;AKoCA,uCAAuC,CAAC,CAAE,SAAQ,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,4BAA4B,CAAC,EAAE,UAAU,EAAE,sBAAsB,EAAE,IAAI,CAAC,aAAa,EAAE,WAAW,CAAC;IAC9K;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;IAC7C,mEAAmE;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gHAAgH;IAChH,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;IACnC,gFAAgF;IAChF,gBAAgB,CAAC,EAAE,MAAM,IAAI,OAAO,CAAC;IACrC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;CACxD;AAqRD;;GAEG;AACH,OAAA,MAAM,UAA0C,CAAC,CAAC,EAAE,KAAK,EAAE,sBAAsB,CAAC,CAAC,GAAG;IAAC,GAAG,CAAC,EAAE,OAAO,cAAc,CAAC,CAAA;CAAC,KAAK,YAAY,CAAC;ACzUtI,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC","sources":["packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/InsertionIndicator.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/ListViewItem.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/ListViewLayout.ts","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/RootDropIndicator.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/DragPreview.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/ListView.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/index.ts","packages/@react-spectrum/list/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,"/*\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\nexport {ListView} from './ListView';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumListViewProps} from './ListView';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
1
+ {"mappings":";;;;AKoCA,uCAAuC,CAAC,CAAE,SAAQ,IAAI,CAAC,kBAAkB,CAAC,CAAC,EAAE,4BAA4B,CAAC,EAAE,UAAU,EAAE,sBAAsB,EAAE,IAAI,CAAC,aAAa,EAAE,WAAW,CAAC;IAC9K;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;IAC7C,mEAAmE;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,gHAAgH;IAChH,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B;;;OAGG;IACH,YAAY,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;IACnC,gFAAgF;IAChF,gBAAgB,CAAC,EAAE,MAAM,IAAI,OAAO,CAAC;IACrC;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC9B;;OAEG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAA;CACxD;AA8RD;;GAEG;AACH,OAAA,MAAM,UAA0C,CAAC,CAAC,EAAE,KAAK,EAAE,sBAAsB,CAAC,CAAC,GAAG;IAAC,GAAG,CAAC,EAAE,OAAO,cAAc,CAAC,CAAA;CAAC,KAAK,YAAY,CAAC;AClVtI,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC","sources":["packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/InsertionIndicator.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/ListViewItem.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/ListViewLayout.ts","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/RootDropIndicator.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/DragPreview.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/ListView.tsx","packages/@react-spectrum/list/src/packages/@react-spectrum/list/src/index.ts","packages/@react-spectrum/list/src/index.ts"],"sourcesContent":[null,null,null,null,null,null,null,"/*\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\nexport {ListView} from './ListView';\nexport {Item} from '@react-stately/collections';\nexport type {SpectrumListViewProps} from './ListView';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@react-spectrum/list",
3
- "version": "3.7.11-nightly.4698+b940126e4",
3
+ "version": "3.7.11-nightly.4701+76365df43",
4
4
  "description": "Spectrum UI components in React",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/main.js",
@@ -36,36 +36,36 @@
36
36
  "url": "https://github.com/adobe/react-spectrum"
37
37
  },
38
38
  "dependencies": {
39
- "@react-aria/button": "3.0.0-nightly.2986+b940126e4",
40
- "@react-aria/focus": "3.0.0-nightly.2986+b940126e4",
41
- "@react-aria/gridlist": "3.8.2-nightly.4698+b940126e4",
42
- "@react-aria/i18n": "3.0.0-nightly.2986+b940126e4",
43
- "@react-aria/interactions": "3.0.0-nightly.2986+b940126e4",
44
- "@react-aria/selection": "3.0.0-nightly.2986+b940126e4",
45
- "@react-aria/utils": "3.0.0-nightly.2986+b940126e4",
46
- "@react-aria/virtualizer": "3.10.2-nightly.4698+b940126e4",
47
- "@react-aria/visually-hidden": "3.0.0-nightly.2986+b940126e4",
48
- "@react-spectrum/checkbox": "3.0.0-nightly.2986+b940126e4",
49
- "@react-spectrum/dnd": "3.3.11-nightly.4698+b940126e4",
50
- "@react-spectrum/layout": "3.6.6-nightly.4698+b940126e4",
51
- "@react-spectrum/progress": "3.0.0-nightly.2986+b940126e4",
52
- "@react-spectrum/text": "3.5.6-nightly.4698+b940126e4",
53
- "@react-spectrum/utils": "3.0.0-nightly.2986+b940126e4",
54
- "@react-stately/collections": "3.0.0-nightly.2986+b940126e4",
55
- "@react-stately/layout": "3.13.10-nightly.4698+b940126e4",
56
- "@react-stately/list": "3.10.6-nightly.4698+b940126e4",
57
- "@react-stately/virtualizer": "3.7.2-nightly.4698+b940126e4",
58
- "@react-types/grid": "3.2.7-nightly.4698+b940126e4",
59
- "@react-types/shared": "3.0.0-nightly.2986+b940126e4",
60
- "@spectrum-icons/ui": "3.0.0-nightly.2986+b940126e4",
39
+ "@react-aria/button": "3.0.0-nightly.2989+76365df43",
40
+ "@react-aria/focus": "3.0.0-nightly.2989+76365df43",
41
+ "@react-aria/gridlist": "3.8.2-nightly.4701+76365df43",
42
+ "@react-aria/i18n": "3.0.0-nightly.2989+76365df43",
43
+ "@react-aria/interactions": "3.0.0-nightly.2989+76365df43",
44
+ "@react-aria/selection": "3.0.0-nightly.2989+76365df43",
45
+ "@react-aria/utils": "3.0.0-nightly.2989+76365df43",
46
+ "@react-aria/virtualizer": "3.10.2-nightly.4701+76365df43",
47
+ "@react-aria/visually-hidden": "3.0.0-nightly.2989+76365df43",
48
+ "@react-spectrum/checkbox": "3.0.0-nightly.2989+76365df43",
49
+ "@react-spectrum/dnd": "3.3.11-nightly.4701+76365df43",
50
+ "@react-spectrum/layout": "3.6.6-nightly.4701+76365df43",
51
+ "@react-spectrum/progress": "3.0.0-nightly.2989+76365df43",
52
+ "@react-spectrum/text": "3.5.6-nightly.4701+76365df43",
53
+ "@react-spectrum/utils": "3.0.0-nightly.2989+76365df43",
54
+ "@react-stately/collections": "3.0.0-nightly.2989+76365df43",
55
+ "@react-stately/layout": "3.13.10-nightly.4701+76365df43",
56
+ "@react-stately/list": "3.10.6-nightly.4701+76365df43",
57
+ "@react-stately/virtualizer": "3.7.2-nightly.4701+76365df43",
58
+ "@react-types/grid": "3.2.7-nightly.4701+76365df43",
59
+ "@react-types/shared": "3.0.0-nightly.2989+76365df43",
60
+ "@spectrum-icons/ui": "3.0.0-nightly.2989+76365df43",
61
61
  "@swc/helpers": "^0.5.0",
62
62
  "react-transition-group": "^4.4.5"
63
63
  },
64
64
  "devDependencies": {
65
- "@adobe/spectrum-css-temp": "3.0.0-nightly.2986+b940126e4",
66
- "@react-aria/dnd": "3.6.2-nightly.4698+b940126e4",
67
- "@react-spectrum/button": "3.0.0-nightly.2986+b940126e4",
68
- "@react-stately/dnd": "3.3.2-nightly.4698+b940126e4"
65
+ "@adobe/spectrum-css-temp": "3.0.0-nightly.2989+76365df43",
66
+ "@react-aria/dnd": "3.6.2-nightly.4701+76365df43",
67
+ "@react-spectrum/button": "3.0.0-nightly.2989+76365df43",
68
+ "@react-stately/dnd": "3.3.2-nightly.4701+76365df43"
69
69
  },
70
70
  "peerDependencies": {
71
71
  "@react-spectrum/provider": "^3.2.0",
@@ -75,5 +75,5 @@
75
75
  "publishConfig": {
76
76
  "access": "public"
77
77
  },
78
- "gitHead": "b940126e4d67a11d28b7c0b098eab23205598b6c"
78
+ "gitHead": "76365df434b6f65b137113557ba14a32ea466c8f"
79
79
  }
package/src/ListView.tsx CHANGED
@@ -184,10 +184,19 @@ function ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef
184
184
  }, state, domRef);
185
185
 
186
186
  let focusedKey = selectionManager.focusedKey;
187
+ let dropTargetKey: Key | null = null;
187
188
  if (dropState?.target?.type === 'item') {
188
- focusedKey = dropState.target.key;
189
+ dropTargetKey = dropState.target.key;
190
+ if (dropState.target.dropPosition === 'after') {
191
+ // Normalize to the "before" drop position since we only render those in the DOM.
192
+ dropTargetKey = state.collection.getKeyAfter(dropTargetKey) ?? dropTargetKey;
193
+ }
189
194
  }
190
195
 
196
+ let persistedKeys = useMemo(() => {
197
+ return new Set([focusedKey, dropTargetKey].filter(k => k !== null));
198
+ }, [focusedKey, dropTargetKey]);
199
+
191
200
  // wait for layout to get accurate measurements
192
201
  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);
193
202
  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);
@@ -214,7 +223,7 @@ function ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef
214
223
  isLoading={isLoading}
215
224
  onLoadMore={onLoadMore}
216
225
  ref={domRef}
217
- focusedKey={focusedKey}
226
+ persistedKeys={persistedKeys}
218
227
  scrollDirection="vertical"
219
228
  className={
220
229
  classNames(
@@ -20,9 +20,9 @@ interface ListViewLayoutProps {
20
20
  export class ListViewLayout<T> extends ListLayout<T, ListViewLayoutProps> {
21
21
  private isLoading: boolean = false;
22
22
 
23
- validate(invalidationContext: InvalidationContext<ListViewLayoutProps>): void {
23
+ update(invalidationContext: InvalidationContext<ListViewLayoutProps>): void {
24
24
  this.isLoading = invalidationContext.layoutOptions?.isLoading || false;
25
- super.validate(invalidationContext);
25
+ super.update(invalidationContext);
26
26
  }
27
27
 
28
28
  protected buildCollection(): LayoutNode[] {