@react-spectrum/list 3.7.11-nightly.4674 → 3.7.11-nightly.4683

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.
Files changed (26) hide show
  1. package/dist/InsertionIndicator.main.js +1 -1
  2. package/dist/InsertionIndicator.main.js.map +1 -1
  3. package/dist/InsertionIndicator.mjs +1 -1
  4. package/dist/InsertionIndicator.module.js +1 -1
  5. package/dist/InsertionIndicator.module.js.map +1 -1
  6. package/dist/ListView.main.js +11 -13
  7. package/dist/ListView.main.js.map +1 -1
  8. package/dist/ListView.mjs +12 -14
  9. package/dist/ListView.module.js +12 -14
  10. package/dist/ListView.module.js.map +1 -1
  11. package/dist/ListViewItem.main.js +4 -4
  12. package/dist/ListViewItem.main.js.map +1 -1
  13. package/dist/ListViewItem.mjs +4 -4
  14. package/dist/ListViewItem.module.js +4 -4
  15. package/dist/ListViewItem.module.js.map +1 -1
  16. package/dist/RootDropIndicator.main.js +1 -1
  17. package/dist/RootDropIndicator.main.js.map +1 -1
  18. package/dist/RootDropIndicator.mjs +1 -1
  19. package/dist/RootDropIndicator.module.js +1 -1
  20. package/dist/RootDropIndicator.module.js.map +1 -1
  21. package/dist/types.d.ts.map +1 -1
  22. package/package.json +29 -28
  23. package/src/InsertionIndicator.tsx +1 -1
  24. package/src/ListView.tsx +12 -12
  25. package/src/ListViewItem.tsx +4 -4
  26. package/src/RootDropIndicator.tsx +1 -1
package/dist/InsertionIndicator.main.js CHANGED
@@ -23,7 +23,7 @@ $parcel$export(module.exports, "default", () => $fc02fd49ab58c72e$export$2e2bcd8
23
23
  function $fc02fd49ab58c72e$export$2e2bcd8739ae039(props) {
24
24
  let { dropState: dropState, dragAndDropHooks: dragAndDropHooks } = (0, $9hpsb$react.useContext)((0, $60684b441be8e84c$exports.ListViewContext));
25
25
  const { target: target, isPresentationOnly: isPresentationOnly } = props;
26
- let ref = (0, $9hpsb$react.useRef)();
26
+ let ref = (0, $9hpsb$react.useRef)(undefined);
27
27
  let { dropIndicatorProps: dropIndicatorProps } = dragAndDropHooks.useDropIndicator(props, dropState, ref);
28
28
  let { visuallyHiddenProps: visuallyHiddenProps } = (0, $9hpsb$reactariavisuallyhidden.useVisuallyHidden)();
29
29
  let isDropTarget = dropState.isDropTarget(target);
package/dist/InsertionIndicator.main.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;;;;;;AAYe,kDAA4B,KAA8B;IACvE,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,MAAM,UAAC,MAAM,sBAAE,kBAAkB,EAAC,GAAG;IAErC,IAAI,MAAM,CAAA,GAAA,mBAAK;IACf,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAiB,gBAAgB,CAAC,OAAO,WAAW;IAC/E,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,gDAAgB;IAE5C,IAAI,eAAe,UAAU,YAAY,CAAC;IAE1C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,0DAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,0DAAC;QACC,MAAK;QACL,iBAAc;QACd,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAS,GACT,6CACA;YACE,yDAAyD;QAC3D;OAEH,CAAC,oCACA,0DAAC;QAAK,GAAG,mBAAmB;QAAE,MAAK;QAAU,GAAG,kBAAkB;QAAE,KAAK;;AAKnF","sources":["packages/@react-spectrum/list/src/InsertionIndicator.tsx"],"sourcesContent":["import {classNames} from '@react-spectrum/utils';\nimport {ItemDropTarget} from '@react-types/shared';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface InsertionIndicatorProps {\n target: ItemDropTarget,\n isPresentationOnly?: boolean\n}\n\nexport default function InsertionIndicator(props: InsertionIndicatorProps) {\n let {dropState, dragAndDropHooks} = useContext(ListViewContext);\n const {target, isPresentationOnly} = props;\n\n let ref = useRef();\n let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator(props, dropState, ref);\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n let isDropTarget = dropState.isDropTarget(target);\n\n if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n return null;\n }\n\n return (\n <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n <div\n role=\"gridcell\"\n aria-selected=\"false\"\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewInsertionIndicator',\n {\n 'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget\n }\n )}>\n {!isPresentationOnly &&\n <div {...visuallyHiddenProps} role=\"button\" {...dropIndicatorProps} ref={ref} />\n }\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"InsertionIndicator.main.js.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;;;;AAYe,kDAA4B,KAA8B;IACvE,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,MAAM,UAAC,MAAM,sBAAE,kBAAkB,EAAC,GAAG;IAErC,IAAI,MAAM,CAAA,GAAA,mBAAK,EAAE;IACjB,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAiB,gBAAgB,CAAC,OAAO,WAAW;IAC/E,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,gDAAgB;IAE5C,IAAI,eAAe,UAAU,YAAY,CAAC;IAE1C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,0DAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,0DAAC;QACC,MAAK;QACL,iBAAc;QACd,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAS,GACT,6CACA;YACE,yDAAyD;QAC3D;OAEH,CAAC,oCACA,0DAAC;QAAK,GAAG,mBAAmB;QAAE,MAAK;QAAU,GAAG,kBAAkB;QAAE,KAAK;;AAKnF","sources":["packages/@react-spectrum/list/src/InsertionIndicator.tsx"],"sourcesContent":["import {classNames} from '@react-spectrum/utils';\nimport {ItemDropTarget} from '@react-types/shared';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface InsertionIndicatorProps {\n target: ItemDropTarget,\n isPresentationOnly?: boolean\n}\n\nexport default function InsertionIndicator(props: InsertionIndicatorProps) {\n let {dropState, dragAndDropHooks} = useContext(ListViewContext);\n const {target, isPresentationOnly} = props;\n\n let ref = useRef(undefined);\n let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator(props, dropState, ref);\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n let isDropTarget = dropState.isDropTarget(target);\n\n if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n return null;\n }\n\n return (\n <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n <div\n role=\"gridcell\"\n aria-selected=\"false\"\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewInsertionIndicator',\n {\n 'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget\n }\n )}>\n {!isPresentationOnly &&\n <div {...visuallyHiddenProps} role=\"button\" {...dropIndicatorProps} ref={ref} />\n }\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"InsertionIndicator.main.js.map"}
package/dist/InsertionIndicator.mjs CHANGED
@@ -17,7 +17,7 @@ function $parcel$interopDefault(a) {
17
17
  function $0a834ddbc989a3e3$export$2e2bcd8739ae039(props) {
18
18
  let { dropState: dropState, dragAndDropHooks: dragAndDropHooks } = (0, $8djIL$useContext)((0, $f85fb77f9d4cbc6c$export$870039b0abfe3de0));
19
19
  const { target: target, isPresentationOnly: isPresentationOnly } = props;
20
- let ref = (0, $8djIL$useRef)();
20
+ let ref = (0, $8djIL$useRef)(undefined);
21
21
  let { dropIndicatorProps: dropIndicatorProps } = dragAndDropHooks.useDropIndicator(props, dropState, ref);
22
22
  let { visuallyHiddenProps: visuallyHiddenProps } = (0, $8djIL$useVisuallyHidden)();
23
23
  let isDropTarget = dropState.isDropTarget(target);
package/dist/InsertionIndicator.module.js CHANGED
@@ -17,7 +17,7 @@ function $parcel$interopDefault(a) {
17
17
  function $0a834ddbc989a3e3$export$2e2bcd8739ae039(props) {
18
18
  let { dropState: dropState, dragAndDropHooks: dragAndDropHooks } = (0, $8djIL$useContext)((0, $f85fb77f9d4cbc6c$export$870039b0abfe3de0));
19
19
  const { target: target, isPresentationOnly: isPresentationOnly } = props;
20
- let ref = (0, $8djIL$useRef)();
20
+ let ref = (0, $8djIL$useRef)(undefined);
21
21
  let { dropIndicatorProps: dropIndicatorProps } = dragAndDropHooks.useDropIndicator(props, dropState, ref);
22
22
  let { visuallyHiddenProps: visuallyHiddenProps } = (0, $8djIL$useVisuallyHidden)();
23
23
  let isDropTarget = dropState.isDropTarget(target);
package/dist/InsertionIndicator.module.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;AAYe,kDAA4B,KAA8B;IACvE,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,MAAM,UAAC,MAAM,sBAAE,kBAAkB,EAAC,GAAG;IAErC,IAAI,MAAM,CAAA,GAAA,aAAK;IACf,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAiB,gBAAgB,CAAC,OAAO,WAAW;IAC/E,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,IAAI,eAAe,UAAU,YAAY,CAAC;IAE1C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,gCAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,gCAAC;QACC,MAAK;QACL,iBAAc;QACd,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,6CACA;YACE,yDAAyD;QAC3D;OAEH,CAAC,oCACA,gCAAC;QAAK,GAAG,mBAAmB;QAAE,MAAK;QAAU,GAAG,kBAAkB;QAAE,KAAK;;AAKnF","sources":["packages/@react-spectrum/list/src/InsertionIndicator.tsx"],"sourcesContent":["import {classNames} from '@react-spectrum/utils';\nimport {ItemDropTarget} from '@react-types/shared';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface InsertionIndicatorProps {\n target: ItemDropTarget,\n isPresentationOnly?: boolean\n}\n\nexport default function InsertionIndicator(props: InsertionIndicatorProps) {\n let {dropState, dragAndDropHooks} = useContext(ListViewContext);\n const {target, isPresentationOnly} = props;\n\n let ref = useRef();\n let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator(props, dropState, ref);\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n let isDropTarget = dropState.isDropTarget(target);\n\n if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n return null;\n }\n\n return (\n <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n <div\n role=\"gridcell\"\n aria-selected=\"false\"\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewInsertionIndicator',\n {\n 'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget\n }\n )}>\n {!isPresentationOnly &&\n <div {...visuallyHiddenProps} role=\"button\" {...dropIndicatorProps} ref={ref} />\n }\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"InsertionIndicator.module.js.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;AAYe,kDAA4B,KAA8B;IACvE,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,MAAM,UAAC,MAAM,sBAAE,kBAAkB,EAAC,GAAG;IAErC,IAAI,MAAM,CAAA,GAAA,aAAK,EAAE;IACjB,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAiB,gBAAgB,CAAC,OAAO,WAAW;IAC/E,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,IAAI,eAAe,UAAU,YAAY,CAAC;IAE1C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,gCAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,gCAAC;QACC,MAAK;QACL,iBAAc;QACd,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,6CACA;YACE,yDAAyD;QAC3D;OAEH,CAAC,oCACA,gCAAC;QAAK,GAAG,mBAAmB;QAAE,MAAK;QAAU,GAAG,kBAAkB;QAAE,KAAK;;AAKnF","sources":["packages/@react-spectrum/list/src/InsertionIndicator.tsx"],"sourcesContent":["import {classNames} from '@react-spectrum/utils';\nimport {ItemDropTarget} from '@react-types/shared';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface InsertionIndicatorProps {\n target: ItemDropTarget,\n isPresentationOnly?: boolean\n}\n\nexport default function InsertionIndicator(props: InsertionIndicatorProps) {\n let {dropState, dragAndDropHooks} = useContext(ListViewContext);\n const {target, isPresentationOnly} = props;\n\n let ref = useRef(undefined);\n let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator(props, dropState, ref);\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n let isDropTarget = dropState.isDropTarget(target);\n\n if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n return null;\n }\n\n return (\n <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n <div\n role=\"gridcell\"\n aria-selected=\"false\"\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewInsertionIndicator',\n {\n 'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget\n }\n )}>\n {!isPresentationOnly &&\n <div {...visuallyHiddenProps} role=\"button\" {...dropIndicatorProps} ref={ref} />\n }\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"InsertionIndicator.module.js.map"}
package/dist/ListView.main.js CHANGED
@@ -9,6 +9,7 @@ var $8lawJ$reactariagridlist = require("@react-aria/gridlist");
9
9
  var $8lawJ$reactspectrumutils = require("@react-spectrum/utils");
10
10
  var $8lawJ$reactariautils = require("@react-aria/utils");
11
11
  var $8lawJ$reactariafocus = require("@react-aria/focus");
12
+ var $8lawJ$reactariaselection = require("@react-aria/selection");
12
13
  var $8lawJ$reactstatelylayout = require("@react-stately/layout");
13
14
  var $8lawJ$reactstatelylist = require("@react-stately/list");
14
15
  var $8lawJ$reactspectrumprogress = require("@react-spectrum/progress");
@@ -55,6 +56,7 @@ $parcel$export(module.exports, "ListView", () => $60684b441be8e84c$export$84d0dd
55
56
 
56
57
 
57
58
 
59
+
58
60
  const $60684b441be8e84c$export$870039b0abfe3de0 = /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createContext(null);
59
61
  const $60684b441be8e84c$var$ROW_HEIGHTS = {
60
62
  compact: {
@@ -72,25 +74,18 @@ const $60684b441be8e84c$var$ROW_HEIGHTS = {
72
74
  };
73
75
  function $60684b441be8e84c$var$useListLayout(state, density, overflowMode) {
74
76
  let { scale: scale } = (0, $8lawJ$reactspectrumprovider.useProvider)();
75
- let collator = (0, $8lawJ$reactariai18n.useCollator)({
76
- usage: 'search',
77
- sensitivity: 'base'
78
- });
79
77
  let isEmpty = state.collection.size === 0;
80
78
  let layout = (0, $8lawJ$react.useMemo)(()=>new (0, $8lawJ$reactstatelylayout.ListLayout)({
81
79
  estimatedRowHeight: $60684b441be8e84c$var$ROW_HEIGHTS[density][scale],
82
80
  padding: 0,
83
- collator: collator,
84
- loaderHeight: isEmpty ? null : $60684b441be8e84c$var$ROW_HEIGHTS[density][scale]
81
+ loaderHeight: isEmpty ? null : $60684b441be8e84c$var$ROW_HEIGHTS[density][scale],
82
+ enableEmptyState: true
85
83
  }), [
86
- collator,
87
84
  scale,
88
85
  density,
89
86
  isEmpty,
90
87
  overflowMode
91
88
  ]);
92
- layout.collection = state.collection;
93
- layout.disabledKeys = state.disabledKeys;
94
89
  return layout;
95
90
  }
96
91
  function $60684b441be8e84c$var$ListView(props, ref) {
@@ -126,8 +121,6 @@ function $60684b441be8e84c$var$ListView(props, ref) {
126
121
  dragAndDropHooks.useDraggableCollection({}, dragState, domRef);
127
122
  }
128
123
  let layout = $60684b441be8e84c$var$useListLayout(state, props.density || 'regular', overflowMode);
129
- // !!0 is false, so we can cast size or undefined and they'll be falsy
130
- layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
131
124
  let DragPreview = dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.DragPreview;
132
125
  let dropState;
133
126
  let droppableCollection;
@@ -138,7 +131,12 @@ function $60684b441be8e84c$var$ListView(props, ref) {
138
131
  selectionManager: selectionManager
139
132
  });
140
133
  droppableCollection = dragAndDropHooks.useDroppableCollection({
141
- keyboardDelegate: layout,
134
+ keyboardDelegate: new (0, $8lawJ$reactariaselection.ListKeyboardDelegate)({
135
+ collection: collection,
136
+ disabledKeys: (dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size) ? null : selectionManager.disabledKeys,
137
+ ref: domRef,
138
+ layoutDelegate: layout
139
+ }),
142
140
  dropTargetDelegate: layout
143
141
  }, dropState, domRef);
144
142
  isRootDropTarget = dropState.isDropTarget({
@@ -148,7 +146,7 @@ function $60684b441be8e84c$var$ListView(props, ref) {
148
146
  let { gridProps: gridProps } = (0, $8lawJ$reactariagridlist.useGridList)({
149
147
  ...props,
150
148
  isVirtualized: true,
151
- keyboardDelegate: layout,
149
+ layoutDelegate: layout,
152
150
  onAction: onAction
153
151
  }, state, domRef);
154
152
  let focusedKey = selectionManager.focusedKey;
package/dist/ListView.main.js.map CHANGED
@@ -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 {ListLayout} from '@react-stately/layout';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\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 {useCollator, 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: ListLayout<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 collator = useCollator({usage: 'search', sensitivity: 'base'});\n let isEmpty = state.collection.size === 0;\n let layout = useMemo(() =>\n new ListLayout<T>({\n estimatedRowHeight: ROW_HEIGHTS[density][scale],\n padding: 0,\n collator,\n loaderHeight: isEmpty ? null : ROW_HEIGHTS[density][scale]\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n , [collator, scale, density, isEmpty, overflowMode]);\n\n layout.collection = state.collection;\n layout.disabledKeys = state.disabledKeys;\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 // !!0 is false, so we can cast size or undefined and they'll be falsy\n layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!dragState?.draggingKeys.size;\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: layout,\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 keyboardDelegate: 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 {ListLayout} from '@react-stately/layout';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\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: ListLayout<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 isEmpty = state.collection.size === 0;\n let layout = useMemo(() =>\n new ListLayout<T>({\n estimatedRowHeight: ROW_HEIGHTS[density][scale],\n padding: 0,\n loaderHeight: isEmpty ? null : ROW_HEIGHTS[density][scale],\n enableEmptyState: true\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n , [scale, density, isEmpty, 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"}
package/dist/ListView.mjs CHANGED
@@ -9,11 +9,12 @@ import {useGridList as $6w3ZV$useGridList} from "@react-aria/gridlist";
9
9
  import {useDOMRef as $6w3ZV$useDOMRef, useStyleProps as $6w3ZV$useStyleProps, classNames as $6w3ZV$classNames} from "@react-spectrum/utils";
10
10
  import {useLayoutEffect as $6w3ZV$useLayoutEffect, mergeProps as $6w3ZV$mergeProps, filterDOMProps as $6w3ZV$filterDOMProps} from "@react-aria/utils";
11
11
  import {FocusScope as $6w3ZV$FocusScope, FocusRing as $6w3ZV$FocusRing} from "@react-aria/focus";
12
+ import {ListKeyboardDelegate as $6w3ZV$ListKeyboardDelegate} from "@react-aria/selection";
12
13
  import {ListLayout as $6w3ZV$ListLayout} from "@react-stately/layout";
13
14
  import {useListState as $6w3ZV$useListState} from "@react-stately/list";
14
15
  import {ProgressCircle as $6w3ZV$ProgressCircle} from "@react-spectrum/progress";
15
16
  import $6w3ZV$react, {useMemo as $6w3ZV$useMemo, useRef as $6w3ZV$useRef, useEffect as $6w3ZV$useEffect, useState as $6w3ZV$useState, useCallback as $6w3ZV$useCallback, useContext as $6w3ZV$useContext} from "react";
16
- import {useCollator as $6w3ZV$useCollator, useLocalizedStringFormatter as $6w3ZV$useLocalizedStringFormatter} from "@react-aria/i18n";
17
+ import {useLocalizedStringFormatter as $6w3ZV$useLocalizedStringFormatter} from "@react-aria/i18n";
17
18
  import {useProvider as $6w3ZV$useProvider} from "@react-spectrum/provider";
18
19
  import {Virtualizer as $6w3ZV$Virtualizer} from "@react-aria/virtualizer";
19
20
 
@@ -48,6 +49,7 @@ function $parcel$interopDefault(a) {
48
49
 
49
50
 
50
51
 
52
+
51
53
  const $f85fb77f9d4cbc6c$export$870039b0abfe3de0 = /*#__PURE__*/ (0, $6w3ZV$react).createContext(null);
52
54
  const $f85fb77f9d4cbc6c$var$ROW_HEIGHTS = {
53
55
  compact: {
@@ -65,25 +67,18 @@ const $f85fb77f9d4cbc6c$var$ROW_HEIGHTS = {
65
67
  };
66
68
  function $f85fb77f9d4cbc6c$var$useListLayout(state, density, overflowMode) {
67
69
  let { scale: scale } = (0, $6w3ZV$useProvider)();
68
- let collator = (0, $6w3ZV$useCollator)({
69
- usage: 'search',
70
- sensitivity: 'base'
71
- });
72
70
  let isEmpty = state.collection.size === 0;
73
71
  let layout = (0, $6w3ZV$useMemo)(()=>new (0, $6w3ZV$ListLayout)({
74
72
  estimatedRowHeight: $f85fb77f9d4cbc6c$var$ROW_HEIGHTS[density][scale],
75
73
  padding: 0,
76
- collator: collator,
77
- loaderHeight: isEmpty ? null : $f85fb77f9d4cbc6c$var$ROW_HEIGHTS[density][scale]
74
+ loaderHeight: isEmpty ? null : $f85fb77f9d4cbc6c$var$ROW_HEIGHTS[density][scale],
75
+ enableEmptyState: true
78
76
  }), [
79
- collator,
80
77
  scale,
81
78
  density,
82
79
  isEmpty,
83
80
  overflowMode
84
81
  ]);
85
- layout.collection = state.collection;
86
- layout.disabledKeys = state.disabledKeys;
87
82
  return layout;
88
83
  }
89
84
  function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
@@ -119,8 +114,6 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
119
114
  dragAndDropHooks.useDraggableCollection({}, dragState, domRef);
120
115
  }
121
116
  let layout = $f85fb77f9d4cbc6c$var$useListLayout(state, props.density || 'regular', overflowMode);
122
- // !!0 is false, so we can cast size or undefined and they'll be falsy
123
- layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
124
117
  let DragPreview = dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.DragPreview;
125
118
  let dropState;
126
119
  let droppableCollection;
@@ -131,7 +124,12 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
131
124
  selectionManager: selectionManager
132
125
  });
133
126
  droppableCollection = dragAndDropHooks.useDroppableCollection({
134
- keyboardDelegate: layout,
127
+ keyboardDelegate: new (0, $6w3ZV$ListKeyboardDelegate)({
128
+ collection: collection,
129
+ disabledKeys: (dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size) ? null : selectionManager.disabledKeys,
130
+ ref: domRef,
131
+ layoutDelegate: layout
132
+ }),
135
133
  dropTargetDelegate: layout
136
134
  }, dropState, domRef);
137
135
  isRootDropTarget = dropState.isDropTarget({
@@ -141,7 +139,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
141
139
  let { gridProps: gridProps } = (0, $6w3ZV$useGridList)({
142
140
  ...props,
143
141
  isVirtualized: true,
144
- keyboardDelegate: layout,
142
+ layoutDelegate: layout,
145
143
  onAction: onAction
146
144
  }, state, domRef);
147
145
  let focusedKey = selectionManager.focusedKey;
package/dist/ListView.module.js CHANGED
@@ -9,11 +9,12 @@ import {useGridList as $6w3ZV$useGridList} from "@react-aria/gridlist";
9
9
  import {useDOMRef as $6w3ZV$useDOMRef, useStyleProps as $6w3ZV$useStyleProps, classNames as $6w3ZV$classNames} from "@react-spectrum/utils";
10
10
  import {useLayoutEffect as $6w3ZV$useLayoutEffect, mergeProps as $6w3ZV$mergeProps, filterDOMProps as $6w3ZV$filterDOMProps} from "@react-aria/utils";
11
11
  import {FocusScope as $6w3ZV$FocusScope, FocusRing as $6w3ZV$FocusRing} from "@react-aria/focus";
12
+ import {ListKeyboardDelegate as $6w3ZV$ListKeyboardDelegate} from "@react-aria/selection";
12
13
  import {ListLayout as $6w3ZV$ListLayout} from "@react-stately/layout";
13
14
  import {useListState as $6w3ZV$useListState} from "@react-stately/list";
14
15
  import {ProgressCircle as $6w3ZV$ProgressCircle} from "@react-spectrum/progress";
15
16
  import $6w3ZV$react, {useMemo as $6w3ZV$useMemo, useRef as $6w3ZV$useRef, useEffect as $6w3ZV$useEffect, useState as $6w3ZV$useState, useCallback as $6w3ZV$useCallback, useContext as $6w3ZV$useContext} from "react";
16
- import {useCollator as $6w3ZV$useCollator, useLocalizedStringFormatter as $6w3ZV$useLocalizedStringFormatter} from "@react-aria/i18n";
17
+ import {useLocalizedStringFormatter as $6w3ZV$useLocalizedStringFormatter} from "@react-aria/i18n";
17
18
  import {useProvider as $6w3ZV$useProvider} from "@react-spectrum/provider";
18
19
  import {Virtualizer as $6w3ZV$Virtualizer} from "@react-aria/virtualizer";
19
20
 
@@ -48,6 +49,7 @@ function $parcel$interopDefault(a) {
48
49
 
49
50
 
50
51
 
52
+
51
53
  const $f85fb77f9d4cbc6c$export$870039b0abfe3de0 = /*#__PURE__*/ (0, $6w3ZV$react).createContext(null);
52
54
  const $f85fb77f9d4cbc6c$var$ROW_HEIGHTS = {
53
55
  compact: {
@@ -65,25 +67,18 @@ const $f85fb77f9d4cbc6c$var$ROW_HEIGHTS = {
65
67
  };
66
68
  function $f85fb77f9d4cbc6c$var$useListLayout(state, density, overflowMode) {
67
69
  let { scale: scale } = (0, $6w3ZV$useProvider)();
68
- let collator = (0, $6w3ZV$useCollator)({
69
- usage: 'search',
70
- sensitivity: 'base'
71
- });
72
70
  let isEmpty = state.collection.size === 0;
73
71
  let layout = (0, $6w3ZV$useMemo)(()=>new (0, $6w3ZV$ListLayout)({
74
72
  estimatedRowHeight: $f85fb77f9d4cbc6c$var$ROW_HEIGHTS[density][scale],
75
73
  padding: 0,
76
- collator: collator,
77
- loaderHeight: isEmpty ? null : $f85fb77f9d4cbc6c$var$ROW_HEIGHTS[density][scale]
74
+ loaderHeight: isEmpty ? null : $f85fb77f9d4cbc6c$var$ROW_HEIGHTS[density][scale],
75
+ enableEmptyState: true
78
76
  }), [
79
- collator,
80
77
  scale,
81
78
  density,
82
79
  isEmpty,
83
80
  overflowMode
84
81
  ]);
85
- layout.collection = state.collection;
86
- layout.disabledKeys = state.disabledKeys;
87
82
  return layout;
88
83
  }
89
84
  function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
@@ -119,8 +114,6 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
119
114
  dragAndDropHooks.useDraggableCollection({}, dragState, domRef);
120
115
  }
121
116
  let layout = $f85fb77f9d4cbc6c$var$useListLayout(state, props.density || 'regular', overflowMode);
122
- // !!0 is false, so we can cast size or undefined and they'll be falsy
123
- layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
124
117
  let DragPreview = dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.DragPreview;
125
118
  let dropState;
126
119
  let droppableCollection;
@@ -131,7 +124,12 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
131
124
  selectionManager: selectionManager
132
125
  });
133
126
  droppableCollection = dragAndDropHooks.useDroppableCollection({
134
- keyboardDelegate: layout,
127
+ keyboardDelegate: new (0, $6w3ZV$ListKeyboardDelegate)({
128
+ collection: collection,
129
+ disabledKeys: (dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size) ? null : selectionManager.disabledKeys,
130
+ ref: domRef,
131
+ layoutDelegate: layout
132
+ }),
135
133
  dropTargetDelegate: layout
136
134
  }, dropState, domRef);
137
135
  isRootDropTarget = dropState.isDropTarget({
@@ -141,7 +139,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
141
139
  let { gridProps: gridProps } = (0, $6w3ZV$useGridList)({
142
140
  ...props,
143
141
  isVirtualized: true,
144
- keyboardDelegate: layout,
142
+ layoutDelegate: layout,
145
143
  onAction: onAction
146
144
  }, state, domRef);
147
145
  let focusedKey = selectionManager.focusedKey;
package/dist/ListView.module.js.map CHANGED
@@ -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 {ListLayout} from '@react-stately/layout';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\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 {useCollator, 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: ListLayout<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 collator = useCollator({usage: 'search', sensitivity: 'base'});\n let isEmpty = state.collection.size === 0;\n let layout = useMemo(() =>\n new ListLayout<T>({\n estimatedRowHeight: ROW_HEIGHTS[density][scale],\n padding: 0,\n collator,\n loaderHeight: isEmpty ? null : ROW_HEIGHTS[density][scale]\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n , [collator, scale, density, isEmpty, overflowMode]);\n\n layout.collection = state.collection;\n layout.disabledKeys = state.disabledKeys;\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 // !!0 is false, so we can cast size or undefined and they'll be falsy\n layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!dragState?.draggingKeys.size;\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: layout,\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 keyboardDelegate: 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 {ListLayout} from '@react-stately/layout';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\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: ListLayout<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 isEmpty = state.collection.size === 0;\n let layout = useMemo(() =>\n new ListLayout<T>({\n estimatedRowHeight: ROW_HEIGHTS[density][scale],\n padding: 0,\n loaderHeight: isEmpty ? null : ROW_HEIGHTS[density][scale],\n enableEmptyState: true\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n , [scale, density, isEmpty, 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"}
package/dist/ListViewItem.main.js CHANGED
@@ -63,8 +63,8 @@ function $9eae7a1cb1535a6b$export$c6bde0c04b033c0e(props) {
63
63
  let { item: item, isEmphasized: isEmphasized } = props;
64
64
  let { state: state, dragState: dragState, dropState: dropState, isListDraggable: isListDraggable, isListDroppable: isListDroppable, layout: layout, dragAndDropHooks: dragAndDropHooks, loadingState: loadingState } = (0, $5Mbbg$react.useContext)((0, $60684b441be8e84c$exports.ListViewContext));
65
65
  let { direction: direction } = (0, $5Mbbg$reactariai18n.useLocale)();
66
- let rowRef = (0, $5Mbbg$react.useRef)();
67
- let checkboxWrapperRef = (0, $5Mbbg$react.useRef)();
66
+ let rowRef = (0, $5Mbbg$react.useRef)(undefined);
67
+ let checkboxWrapperRef = (0, $5Mbbg$react.useRef)(undefined);
68
68
  let { isFocusVisible: isFocusVisibleWithin, focusProps: focusWithinProps } = (0, $5Mbbg$reactariafocus.useFocusRing)({
69
69
  within: true
70
70
  });
@@ -94,7 +94,7 @@ function $9eae7a1cb1535a6b$export$c6bde0c04b033c0e(props) {
94
94
  let droppableItem;
95
95
  let isDropTarget;
96
96
  let dropIndicator;
97
- let dropIndicatorRef = (0, $5Mbbg$react.useRef)();
97
+ let dropIndicatorRef = (0, $5Mbbg$react.useRef)(undefined);
98
98
  if (isListDroppable) {
99
99
  let target = {
100
100
  type: 'item',
@@ -107,7 +107,7 @@ function $9eae7a1cb1535a6b$export$c6bde0c04b033c0e(props) {
107
107
  target: target
108
108
  }, dropState, dropIndicatorRef);
109
109
  }
110
- let dragButtonRef = (0, ($parcel$interopDefault($5Mbbg$react))).useRef();
110
+ let dragButtonRef = (0, ($parcel$interopDefault($5Mbbg$react))).useRef(undefined);
111
111
  let { buttonProps: buttonProps } = (0, $5Mbbg$reactariabutton.useButton)({
112
112
  ...draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragButtonProps,
113
113
  elementType: 'div'
package/dist/ListViewItem.main.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/list/src/ListViewItem.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 */\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport ChevronLeftMedium from '@spectrum-icons/ui/ChevronLeftMedium';\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames, ClearSlots, SlotProvider, useHasChild} from '@react-spectrum/utils';\nimport {CSSTransition} from 'react-transition-group';\nimport type {DraggableItemResult, DropIndicatorAria, DroppableItemResult} from '@react-aria/dnd';\nimport {DropTarget, Node} from '@react-types/shared';\nimport {FocusRing, useFocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible as isGlobalFocusVisible, useHover} from '@react-aria/interactions';\nimport ListGripper from '@spectrum-icons/ui/ListGripper';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport {mergeProps} from '@react-aria/utils';\nimport {Provider} from '@react-spectrum/provider';\nimport React, {useContext, useRef} from 'react';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useGridListItem, useGridListSelectionCheckbox} from '@react-aria/gridlist';\nimport {useLocale} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface ListViewItemProps<T> {\n item: Node<T>,\n isEmphasized: boolean,\n hasActions: boolean\n}\n\nexport function ListViewItem<T>(props: ListViewItemProps<T>) {\n let {\n item,\n isEmphasized\n } = props;\n let {\n state,\n dragState,\n dropState,\n isListDraggable,\n isListDroppable,\n layout,\n dragAndDropHooks,\n loadingState\n } = useContext(ListViewContext);\n let {direction} = useLocale();\n let rowRef = useRef<HTMLDivElement>();\n let checkboxWrapperRef = useRef<HTMLDivElement>();\n let {\n isFocusVisible: isFocusVisibleWithin,\n focusProps: focusWithinProps\n } = useFocusRing({within: true});\n let {isFocusVisible, focusProps} = useFocusRing();\n let {\n rowProps,\n gridCellProps,\n isPressed,\n descriptionProps,\n isSelected,\n isDisabled,\n allowsSelection,\n hasAction\n } = useGridListItem({\n node: item,\n isVirtualized: true,\n shouldSelectOnPressUp: isListDraggable\n }, state, rowRef);\n let isDroppable = isListDroppable && !isDisabled;\n let {hoverProps, isHovered} = useHover({isDisabled: !allowsSelection && !hasAction});\n\n let {checkboxProps} = useGridListSelectionCheckbox({key: item.key}, state);\n let hasDescription = useHasChild(`.${listStyles['react-spectrum-ListViewItem-description']}`, rowRef);\n\n let draggableItem: DraggableItemResult;\n if (isListDraggable) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n draggableItem = dragAndDropHooks.useDraggableItem({key: item.key, hasDragButton: true}, dragState);\n if (isDisabled) {\n draggableItem = null;\n }\n }\n let droppableItem: DroppableItemResult;\n let isDropTarget: boolean;\n let dropIndicator: DropIndicatorAria;\n let dropIndicatorRef = useRef();\n if (isListDroppable) {\n let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;\n isDropTarget = dropState.isDropTarget(target);\n // eslint-disable-next-line react-hooks/rules-of-hooks\n dropIndicator = dragAndDropHooks.useDropIndicator({target}, dropState, dropIndicatorRef);\n }\n\n let dragButtonRef = React.useRef();\n let {buttonProps} = useButton({\n ...draggableItem?.dragButtonProps,\n elementType: 'div'\n }, dragButtonRef);\n\n let chevron = direction === 'ltr'\n ? (\n <ChevronRightMedium\n aria-hidden=\"true\"\n UNSAFE_className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-parentIndicator',\n {\n 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n 'is-disabled': !hasAction\n }\n )\n } />\n )\n : (\n <ChevronLeftMedium\n aria-hidden=\"true\"\n UNSAFE_className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-parentIndicator',\n {\n 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n 'is-disabled': !hasAction\n }\n )\n } />\n );\n\n let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n let dropProps = isDroppable ? droppableItem?.dropProps : {'aria-hidden': droppableItem?.dropProps['aria-hidden']};\n const mergedProps = mergeProps(\n rowProps,\n draggableItem?.dragProps,\n dropProps,\n hoverProps,\n focusWithinProps,\n focusProps,\n // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,\n // allowing for single swipe navigation between row drop indicator\n dragAndDropHooks?.isVirtualDragging() && {tabIndex: null}\n );\n\n let isFirstRow = item.prevKey == null;\n let isLastRow = item.nextKey == null;\n // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom\n // border corners of the last row when selected and we can get rid of the bottom border if it isn't selected to avoid border overlap\n // with bottom border\n let isFlushWithContainerBottom = false;\n if (isLastRow && loadingState !== 'loadingMore') {\n if (layout.getContentSize()?.height >= layout.virtualizer?.visibleRect.height) {\n isFlushWithContainerBottom = true;\n }\n }\n // previous item isn't selected\n // and the previous item isn't focused or, if it is focused, then if focus globally isn't visible or just focus isn't in the listview\n let roundTops = (!state.selectionManager.isSelected(item.prevKey)\n && (state.selectionManager.focusedKey !== item.prevKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n let roundBottoms = (!state.selectionManager.isSelected(item.nextKey)\n && (state.selectionManager.focusedKey !== item.nextKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n\n let content = typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered;\n if (isDisabled) {\n content = <Provider isDisabled>{content}</Provider>;\n }\n\n return (\n <div\n {...mergedProps}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView-row',\n {\n 'focus-ring': isFocusVisible,\n 'round-tops':\n roundTops || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key),\n 'round-bottoms':\n roundBottoms || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key)\n }\n )\n }\n ref={rowRef}>\n <div\n // TODO: refactor the css here now that we are focusing the row?\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem',\n {\n 'is-active': isPressed,\n 'is-focused': isFocusVisibleWithin,\n 'focus-ring': isFocusVisible,\n 'is-hovered': isHovered,\n 'is-selected': isSelected,\n 'is-disabled': isDisabled,\n 'is-prev-selected': state.selectionManager.isSelected(item.prevKey),\n 'is-next-selected': state.selectionManager.isSelected(item.nextKey),\n 'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || state.selectionManager.isSelected(item.nextKey)),\n 'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,\n 'react-spectrum-ListViewItem--firstRow': isFirstRow,\n 'react-spectrum-ListViewItem--lastRow': isLastRow,\n 'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,\n 'react-spectrum-ListViewItem--hasDescription': hasDescription\n }\n )\n }\n {...gridCellProps}>\n <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n {isListDraggable &&\n <div className={listStyles['react-spectrum-ListViewItem-draghandle-container']}>\n {!isDisabled &&\n <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n <div\n {...buttonProps as React.HTMLAttributes<HTMLElement>}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-draghandle-button'\n )\n }\n style={!isFocusVisibleWithin ? {...visuallyHiddenProps.style} : {}}\n ref={dragButtonRef}\n draggable=\"true\">\n <ListGripper />\n </div>\n </FocusRing>\n }\n </div>\n }\n {isListDroppable && !dropIndicator?.isHidden &&\n <div role=\"button\" {...visuallyHiddenProps} {...dropIndicator?.dropIndicatorProps} ref={dropIndicatorRef} />\n }\n <CSSTransition\n in={showCheckbox}\n unmountOnExit\n classNames={{\n enter: listStyles['react-spectrum-ListViewItem-checkbox--enter'],\n enterActive: listStyles['react-spectrum-ListViewItem-checkbox--enterActive'],\n exit: listStyles['react-spectrum-ListViewItem-checkbox--exit'],\n exitActive: listStyles['react-spectrum-ListViewItem-checkbox--exitActive']\n }}\n timeout={160}\n nodeRef={checkboxWrapperRef} >\n <div ref={checkboxWrapperRef} className={listStyles['react-spectrum-ListViewItem-checkboxWrapper']}>\n <Checkbox\n {...checkboxProps}\n UNSAFE_className={listStyles['react-spectrum-ListViewItem-checkbox']}\n isEmphasized={isEmphasized} />\n </div>\n </CSSTransition>\n <SlotProvider\n slots={{\n text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description'], ...descriptionProps},\n illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n actionGroup: {\n UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n isQuiet: true,\n density: 'compact'\n },\n actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n }}>\n {content}\n <ClearSlots>\n {chevron}\n </ClearSlots>\n </SlotProvider>\n </Grid>\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"ListViewItem.main.js.map"}
1
+ {"mappings":"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","sources":["packages/@react-spectrum/list/src/ListViewItem.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 */\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport ChevronLeftMedium from '@spectrum-icons/ui/ChevronLeftMedium';\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames, ClearSlots, SlotProvider, useHasChild} from '@react-spectrum/utils';\nimport {CSSTransition} from 'react-transition-group';\nimport type {DraggableItemResult, DropIndicatorAria, DroppableItemResult} from '@react-aria/dnd';\nimport {DropTarget, Node} from '@react-types/shared';\nimport {FocusRing, useFocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible as isGlobalFocusVisible, useHover} from '@react-aria/interactions';\nimport ListGripper from '@spectrum-icons/ui/ListGripper';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport {mergeProps} from '@react-aria/utils';\nimport {Provider} from '@react-spectrum/provider';\nimport React, {useContext, useRef} from 'react';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useGridListItem, useGridListSelectionCheckbox} from '@react-aria/gridlist';\nimport {useLocale} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface ListViewItemProps<T> {\n item: Node<T>,\n isEmphasized: boolean,\n hasActions: boolean\n}\n\nexport function ListViewItem<T>(props: ListViewItemProps<T>) {\n let {\n item,\n isEmphasized\n } = props;\n let {\n state,\n dragState,\n dropState,\n isListDraggable,\n isListDroppable,\n layout,\n dragAndDropHooks,\n loadingState\n } = useContext(ListViewContext);\n let {direction} = useLocale();\n let rowRef = useRef<HTMLDivElement>(undefined);\n let checkboxWrapperRef = useRef<HTMLDivElement>(undefined);\n let {\n isFocusVisible: isFocusVisibleWithin,\n focusProps: focusWithinProps\n } = useFocusRing({within: true});\n let {isFocusVisible, focusProps} = useFocusRing();\n let {\n rowProps,\n gridCellProps,\n isPressed,\n descriptionProps,\n isSelected,\n isDisabled,\n allowsSelection,\n hasAction\n } = useGridListItem({\n node: item,\n isVirtualized: true,\n shouldSelectOnPressUp: isListDraggable\n }, state, rowRef);\n let isDroppable = isListDroppable && !isDisabled;\n let {hoverProps, isHovered} = useHover({isDisabled: !allowsSelection && !hasAction});\n\n let {checkboxProps} = useGridListSelectionCheckbox({key: item.key}, state);\n let hasDescription = useHasChild(`.${listStyles['react-spectrum-ListViewItem-description']}`, rowRef);\n\n let draggableItem: DraggableItemResult;\n if (isListDraggable) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n draggableItem = dragAndDropHooks.useDraggableItem({key: item.key, hasDragButton: true}, dragState);\n if (isDisabled) {\n draggableItem = null;\n }\n }\n let droppableItem: DroppableItemResult;\n let isDropTarget: boolean;\n let dropIndicator: DropIndicatorAria;\n let dropIndicatorRef = useRef(undefined);\n if (isListDroppable) {\n let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;\n isDropTarget = dropState.isDropTarget(target);\n // eslint-disable-next-line react-hooks/rules-of-hooks\n dropIndicator = dragAndDropHooks.useDropIndicator({target}, dropState, dropIndicatorRef);\n }\n\n let dragButtonRef = React.useRef(undefined);\n let {buttonProps} = useButton({\n ...draggableItem?.dragButtonProps,\n elementType: 'div'\n }, dragButtonRef);\n\n let chevron = direction === 'ltr'\n ? (\n <ChevronRightMedium\n aria-hidden=\"true\"\n UNSAFE_className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-parentIndicator',\n {\n 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n 'is-disabled': !hasAction\n }\n )\n } />\n )\n : (\n <ChevronLeftMedium\n aria-hidden=\"true\"\n UNSAFE_className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-parentIndicator',\n {\n 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n 'is-disabled': !hasAction\n }\n )\n } />\n );\n\n let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n let dropProps = isDroppable ? droppableItem?.dropProps : {'aria-hidden': droppableItem?.dropProps['aria-hidden']};\n const mergedProps = mergeProps(\n rowProps,\n draggableItem?.dragProps,\n dropProps,\n hoverProps,\n focusWithinProps,\n focusProps,\n // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,\n // allowing for single swipe navigation between row drop indicator\n dragAndDropHooks?.isVirtualDragging() && {tabIndex: null}\n );\n\n let isFirstRow = item.prevKey == null;\n let isLastRow = item.nextKey == null;\n // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom\n // border corners of the last row when selected and we can get rid of the bottom border if it isn't selected to avoid border overlap\n // with bottom border\n let isFlushWithContainerBottom = false;\n if (isLastRow && loadingState !== 'loadingMore') {\n if (layout.getContentSize()?.height >= layout.virtualizer?.visibleRect.height) {\n isFlushWithContainerBottom = true;\n }\n }\n // previous item isn't selected\n // and the previous item isn't focused or, if it is focused, then if focus globally isn't visible or just focus isn't in the listview\n let roundTops = (!state.selectionManager.isSelected(item.prevKey)\n && (state.selectionManager.focusedKey !== item.prevKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n let roundBottoms = (!state.selectionManager.isSelected(item.nextKey)\n && (state.selectionManager.focusedKey !== item.nextKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n\n let content = typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered;\n if (isDisabled) {\n content = <Provider isDisabled>{content}</Provider>;\n }\n\n return (\n <div\n {...mergedProps}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView-row',\n {\n 'focus-ring': isFocusVisible,\n 'round-tops':\n roundTops || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key),\n 'round-bottoms':\n roundBottoms || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key)\n }\n )\n }\n ref={rowRef}>\n <div\n // TODO: refactor the css here now that we are focusing the row?\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem',\n {\n 'is-active': isPressed,\n 'is-focused': isFocusVisibleWithin,\n 'focus-ring': isFocusVisible,\n 'is-hovered': isHovered,\n 'is-selected': isSelected,\n 'is-disabled': isDisabled,\n 'is-prev-selected': state.selectionManager.isSelected(item.prevKey),\n 'is-next-selected': state.selectionManager.isSelected(item.nextKey),\n 'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || state.selectionManager.isSelected(item.nextKey)),\n 'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,\n 'react-spectrum-ListViewItem--firstRow': isFirstRow,\n 'react-spectrum-ListViewItem--lastRow': isLastRow,\n 'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,\n 'react-spectrum-ListViewItem--hasDescription': hasDescription\n }\n )\n }\n {...gridCellProps}>\n <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n {isListDraggable &&\n <div className={listStyles['react-spectrum-ListViewItem-draghandle-container']}>\n {!isDisabled &&\n <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n <div\n {...buttonProps as React.HTMLAttributes<HTMLElement>}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-draghandle-button'\n )\n }\n style={!isFocusVisibleWithin ? {...visuallyHiddenProps.style} : {}}\n ref={dragButtonRef}\n draggable=\"true\">\n <ListGripper />\n </div>\n </FocusRing>\n }\n </div>\n }\n {isListDroppable && !dropIndicator?.isHidden &&\n <div role=\"button\" {...visuallyHiddenProps} {...dropIndicator?.dropIndicatorProps} ref={dropIndicatorRef} />\n }\n <CSSTransition\n in={showCheckbox}\n unmountOnExit\n classNames={{\n enter: listStyles['react-spectrum-ListViewItem-checkbox--enter'],\n enterActive: listStyles['react-spectrum-ListViewItem-checkbox--enterActive'],\n exit: listStyles['react-spectrum-ListViewItem-checkbox--exit'],\n exitActive: listStyles['react-spectrum-ListViewItem-checkbox--exitActive']\n }}\n timeout={160}\n nodeRef={checkboxWrapperRef} >\n <div ref={checkboxWrapperRef} className={listStyles['react-spectrum-ListViewItem-checkboxWrapper']}>\n <Checkbox\n {...checkboxProps}\n UNSAFE_className={listStyles['react-spectrum-ListViewItem-checkbox']}\n isEmphasized={isEmphasized} />\n </div>\n </CSSTransition>\n <SlotProvider\n slots={{\n text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description'], ...descriptionProps},\n illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n actionGroup: {\n UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n isQuiet: true,\n density: 'compact'\n },\n actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n }}>\n {content}\n <ClearSlots>\n {chevron}\n </ClearSlots>\n </SlotProvider>\n </Grid>\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"ListViewItem.main.js.map"}
package/dist/ListViewItem.mjs CHANGED
@@ -57,8 +57,8 @@ function $d7c07ca2efc5ba02$export$c6bde0c04b033c0e(props) {
57
57
  let { item: item, isEmphasized: isEmphasized } = props;
58
58
  let { state: state, dragState: dragState, dropState: dropState, isListDraggable: isListDraggable, isListDroppable: isListDroppable, layout: layout, dragAndDropHooks: dragAndDropHooks, loadingState: loadingState } = (0, $asbps$useContext)((0, $f85fb77f9d4cbc6c$export$870039b0abfe3de0));
59
59
  let { direction: direction } = (0, $asbps$useLocale)();
60
- let rowRef = (0, $asbps$useRef)();
61
- let checkboxWrapperRef = (0, $asbps$useRef)();
60
+ let rowRef = (0, $asbps$useRef)(undefined);
61
+ let checkboxWrapperRef = (0, $asbps$useRef)(undefined);
62
62
  let { isFocusVisible: isFocusVisibleWithin, focusProps: focusWithinProps } = (0, $asbps$useFocusRing)({
63
63
  within: true
64
64
  });
@@ -88,7 +88,7 @@ function $d7c07ca2efc5ba02$export$c6bde0c04b033c0e(props) {
88
88
  let droppableItem;
89
89
  let isDropTarget;
90
90
  let dropIndicator;
91
- let dropIndicatorRef = (0, $asbps$useRef)();
91
+ let dropIndicatorRef = (0, $asbps$useRef)(undefined);
92
92
  if (isListDroppable) {
93
93
  let target = {
94
94
  type: 'item',
@@ -101,7 +101,7 @@ function $d7c07ca2efc5ba02$export$c6bde0c04b033c0e(props) {
101
101
  target: target
102
102
  }, dropState, dropIndicatorRef);
103
103
  }
104
- let dragButtonRef = (0, $asbps$react).useRef();
104
+ let dragButtonRef = (0, $asbps$react).useRef(undefined);
105
105
  let { buttonProps: buttonProps } = (0, $asbps$useButton)({
106
106
  ...draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragButtonProps,
107
107
  elementType: 'div'
package/dist/ListViewItem.module.js CHANGED
@@ -57,8 +57,8 @@ function $d7c07ca2efc5ba02$export$c6bde0c04b033c0e(props) {
57
57
  let { item: item, isEmphasized: isEmphasized } = props;
58
58
  let { state: state, dragState: dragState, dropState: dropState, isListDraggable: isListDraggable, isListDroppable: isListDroppable, layout: layout, dragAndDropHooks: dragAndDropHooks, loadingState: loadingState } = (0, $asbps$useContext)((0, $f85fb77f9d4cbc6c$export$870039b0abfe3de0));
59
59
  let { direction: direction } = (0, $asbps$useLocale)();
60
- let rowRef = (0, $asbps$useRef)();
61
- let checkboxWrapperRef = (0, $asbps$useRef)();
60
+ let rowRef = (0, $asbps$useRef)(undefined);
61
+ let checkboxWrapperRef = (0, $asbps$useRef)(undefined);
62
62
  let { isFocusVisible: isFocusVisibleWithin, focusProps: focusWithinProps } = (0, $asbps$useFocusRing)({
63
63
  within: true
64
64
  });
@@ -88,7 +88,7 @@ function $d7c07ca2efc5ba02$export$c6bde0c04b033c0e(props) {
88
88
  let droppableItem;
89
89
  let isDropTarget;
90
90
  let dropIndicator;
91
- let dropIndicatorRef = (0, $asbps$useRef)();
91
+ let dropIndicatorRef = (0, $asbps$useRef)(undefined);
92
92
  if (isListDroppable) {
93
93
  let target = {
94
94
  type: 'item',
@@ -101,7 +101,7 @@ function $d7c07ca2efc5ba02$export$c6bde0c04b033c0e(props) {
101
101
  target: target
102
102
  }, dropState, dropIndicatorRef);
103
103
  }
104
- let dragButtonRef = (0, $asbps$react).useRef();
104
+ let dragButtonRef = (0, $asbps$react).useRef(undefined);
105
105
  let { buttonProps: buttonProps } = (0, $asbps$useButton)({
106
106
  ...draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragButtonProps,
107
107
  elementType: 'div'
package/dist/ListViewItem.module.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/list/src/ListViewItem.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 */\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport ChevronLeftMedium from '@spectrum-icons/ui/ChevronLeftMedium';\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames, ClearSlots, SlotProvider, useHasChild} from '@react-spectrum/utils';\nimport {CSSTransition} from 'react-transition-group';\nimport type {DraggableItemResult, DropIndicatorAria, DroppableItemResult} from '@react-aria/dnd';\nimport {DropTarget, Node} from '@react-types/shared';\nimport {FocusRing, useFocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible as isGlobalFocusVisible, useHover} from '@react-aria/interactions';\nimport ListGripper from '@spectrum-icons/ui/ListGripper';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport {mergeProps} from '@react-aria/utils';\nimport {Provider} from '@react-spectrum/provider';\nimport React, {useContext, useRef} from 'react';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useGridListItem, useGridListSelectionCheckbox} from '@react-aria/gridlist';\nimport {useLocale} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface ListViewItemProps<T> {\n item: Node<T>,\n isEmphasized: boolean,\n hasActions: boolean\n}\n\nexport function ListViewItem<T>(props: ListViewItemProps<T>) {\n let {\n item,\n isEmphasized\n } = props;\n let {\n state,\n dragState,\n dropState,\n isListDraggable,\n isListDroppable,\n layout,\n dragAndDropHooks,\n loadingState\n } = useContext(ListViewContext);\n let {direction} = useLocale();\n let rowRef = useRef<HTMLDivElement>();\n let checkboxWrapperRef = useRef<HTMLDivElement>();\n let {\n isFocusVisible: isFocusVisibleWithin,\n focusProps: focusWithinProps\n } = useFocusRing({within: true});\n let {isFocusVisible, focusProps} = useFocusRing();\n let {\n rowProps,\n gridCellProps,\n isPressed,\n descriptionProps,\n isSelected,\n isDisabled,\n allowsSelection,\n hasAction\n } = useGridListItem({\n node: item,\n isVirtualized: true,\n shouldSelectOnPressUp: isListDraggable\n }, state, rowRef);\n let isDroppable = isListDroppable && !isDisabled;\n let {hoverProps, isHovered} = useHover({isDisabled: !allowsSelection && !hasAction});\n\n let {checkboxProps} = useGridListSelectionCheckbox({key: item.key}, state);\n let hasDescription = useHasChild(`.${listStyles['react-spectrum-ListViewItem-description']}`, rowRef);\n\n let draggableItem: DraggableItemResult;\n if (isListDraggable) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n draggableItem = dragAndDropHooks.useDraggableItem({key: item.key, hasDragButton: true}, dragState);\n if (isDisabled) {\n draggableItem = null;\n }\n }\n let droppableItem: DroppableItemResult;\n let isDropTarget: boolean;\n let dropIndicator: DropIndicatorAria;\n let dropIndicatorRef = useRef();\n if (isListDroppable) {\n let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;\n isDropTarget = dropState.isDropTarget(target);\n // eslint-disable-next-line react-hooks/rules-of-hooks\n dropIndicator = dragAndDropHooks.useDropIndicator({target}, dropState, dropIndicatorRef);\n }\n\n let dragButtonRef = React.useRef();\n let {buttonProps} = useButton({\n ...draggableItem?.dragButtonProps,\n elementType: 'div'\n }, dragButtonRef);\n\n let chevron = direction === 'ltr'\n ? (\n <ChevronRightMedium\n aria-hidden=\"true\"\n UNSAFE_className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-parentIndicator',\n {\n 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n 'is-disabled': !hasAction\n }\n )\n } />\n )\n : (\n <ChevronLeftMedium\n aria-hidden=\"true\"\n UNSAFE_className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-parentIndicator',\n {\n 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n 'is-disabled': !hasAction\n }\n )\n } />\n );\n\n let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n let dropProps = isDroppable ? droppableItem?.dropProps : {'aria-hidden': droppableItem?.dropProps['aria-hidden']};\n const mergedProps = mergeProps(\n rowProps,\n draggableItem?.dragProps,\n dropProps,\n hoverProps,\n focusWithinProps,\n focusProps,\n // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,\n // allowing for single swipe navigation between row drop indicator\n dragAndDropHooks?.isVirtualDragging() && {tabIndex: null}\n );\n\n let isFirstRow = item.prevKey == null;\n let isLastRow = item.nextKey == null;\n // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom\n // border corners of the last row when selected and we can get rid of the bottom border if it isn't selected to avoid border overlap\n // with bottom border\n let isFlushWithContainerBottom = false;\n if (isLastRow && loadingState !== 'loadingMore') {\n if (layout.getContentSize()?.height >= layout.virtualizer?.visibleRect.height) {\n isFlushWithContainerBottom = true;\n }\n }\n // previous item isn't selected\n // and the previous item isn't focused or, if it is focused, then if focus globally isn't visible or just focus isn't in the listview\n let roundTops = (!state.selectionManager.isSelected(item.prevKey)\n && (state.selectionManager.focusedKey !== item.prevKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n let roundBottoms = (!state.selectionManager.isSelected(item.nextKey)\n && (state.selectionManager.focusedKey !== item.nextKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n\n let content = typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered;\n if (isDisabled) {\n content = <Provider isDisabled>{content}</Provider>;\n }\n\n return (\n <div\n {...mergedProps}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView-row',\n {\n 'focus-ring': isFocusVisible,\n 'round-tops':\n roundTops || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key),\n 'round-bottoms':\n roundBottoms || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key)\n }\n )\n }\n ref={rowRef}>\n <div\n // TODO: refactor the css here now that we are focusing the row?\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem',\n {\n 'is-active': isPressed,\n 'is-focused': isFocusVisibleWithin,\n 'focus-ring': isFocusVisible,\n 'is-hovered': isHovered,\n 'is-selected': isSelected,\n 'is-disabled': isDisabled,\n 'is-prev-selected': state.selectionManager.isSelected(item.prevKey),\n 'is-next-selected': state.selectionManager.isSelected(item.nextKey),\n 'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || state.selectionManager.isSelected(item.nextKey)),\n 'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,\n 'react-spectrum-ListViewItem--firstRow': isFirstRow,\n 'react-spectrum-ListViewItem--lastRow': isLastRow,\n 'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,\n 'react-spectrum-ListViewItem--hasDescription': hasDescription\n }\n )\n }\n {...gridCellProps}>\n <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n {isListDraggable &&\n <div className={listStyles['react-spectrum-ListViewItem-draghandle-container']}>\n {!isDisabled &&\n <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n <div\n {...buttonProps as React.HTMLAttributes<HTMLElement>}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-draghandle-button'\n )\n }\n style={!isFocusVisibleWithin ? {...visuallyHiddenProps.style} : {}}\n ref={dragButtonRef}\n draggable=\"true\">\n <ListGripper />\n </div>\n </FocusRing>\n }\n </div>\n }\n {isListDroppable && !dropIndicator?.isHidden &&\n <div role=\"button\" {...visuallyHiddenProps} {...dropIndicator?.dropIndicatorProps} ref={dropIndicatorRef} />\n }\n <CSSTransition\n in={showCheckbox}\n unmountOnExit\n classNames={{\n enter: listStyles['react-spectrum-ListViewItem-checkbox--enter'],\n enterActive: listStyles['react-spectrum-ListViewItem-checkbox--enterActive'],\n exit: listStyles['react-spectrum-ListViewItem-checkbox--exit'],\n exitActive: listStyles['react-spectrum-ListViewItem-checkbox--exitActive']\n }}\n timeout={160}\n nodeRef={checkboxWrapperRef} >\n <div ref={checkboxWrapperRef} className={listStyles['react-spectrum-ListViewItem-checkboxWrapper']}>\n <Checkbox\n {...checkboxProps}\n UNSAFE_className={listStyles['react-spectrum-ListViewItem-checkbox']}\n isEmphasized={isEmphasized} />\n </div>\n </CSSTransition>\n <SlotProvider\n slots={{\n text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description'], ...descriptionProps},\n illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n actionGroup: {\n UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n isQuiet: true,\n density: 'compact'\n },\n actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n }}>\n {content}\n <ClearSlots>\n {chevron}\n </ClearSlots>\n </SlotProvider>\n </Grid>\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"ListViewItem.module.js.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;;;AA6BM,SAAS,0CAAgB,KAA2B;QAyHnD,wBAAmC;IAxHzC,IAAI,QACF,IAAI,gBACJ,YAAY,EACb,GAAG;IACJ,IAAI,SACF,KAAK,aACL,SAAS,aACT,SAAS,mBACT,eAAe,mBACf,eAAe,UACf,MAAM,oBACN,gBAAgB,gBAChB,YAAY,EACb,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7B,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAC1B,IAAI,SAAS,CAAA,GAAA,aAAK,EAAkB;IACpC,IAAI,qBAAqB,CAAA,GAAA,aAAK,EAAkB;IAChD,IAAI,EACF,gBAAgB,oBAAoB,EACpC,YAAY,gBAAgB,EAC7B,GAAG,CAAA,GAAA,mBAAW,EAAE;QAAC,QAAQ;IAAI;IAC9B,IAAI,kBAAC,cAAc,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,mBAAW;IAC9C,IAAI,YACF,QAAQ,iBACR,aAAa,aACb,SAAS,oBACT,gBAAgB,cAChB,UAAU,cACV,UAAU,mBACV,eAAe,aACf,SAAS,EACV,GAAG,CAAA,GAAA,sBAAc,EAAE;QAClB,MAAM;QACN,eAAe;QACf,uBAAuB;IACzB,GAAG,OAAO;IACV,IAAI,cAAc,mBAAmB,CAAC;IACtC,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QAAC,YAAY,CAAC,mBAAmB,CAAC;IAAS;IAElF,IAAI,iBAAC,aAAa,EAAC,GAAG,CAAA,GAAA,mCAA2B,EAAE;QAAC,KAAK,KAAK,GAAG;IAAA,GAAG;IACpE,IAAI,iBAAiB,CAAA,GAAA,kBAAU,EAAE,CAAC,CAAC,EAAE,CAAA,GAAA,mDAAS,CAAC,CAAC,0CAA0C,CAAC,CAAC,EAAE;IAE9F,IAAI;IACJ,IAAI,iBAAiB;QACnB,sDAAsD;QACtD,gBAAgB,iBAAiB,gBAAgB,CAAC;YAAC,KAAK,KAAK,GAAG;YAAE,eAAe;QAAI,GAAG;QACxF,IAAI,YACF,gBAAgB;IAEpB;IACA,IAAI;IACJ,IAAI;IACJ,IAAI;IACJ,IAAI,mBAAmB,CAAA,GAAA,aAAK,EAAE;IAC9B,IAAI,iBAAiB;QACnB,IAAI,SAAS;YAAC,MAAM;YAAQ,KAAK,KAAK,GAAG;YAAE,cAAc;QAAI;QAC7D,eAAe,UAAU,YAAY,CAAC;QACtC,sDAAsD;QACtD,gBAAgB,iBAAiB,gBAAgB,CAAC;oBAAC;QAAM,GAAG,WAAW;IACzE;IAEA,IAAI,gBAAgB,CAAA,GAAA,YAAI,EAAE,MAAM,CAAC;IACjC,IAAI,eAAC,WAAW,EAAC,GAAG,CAAA,GAAA,gBAAQ,EAAE;WACzB,0BAAA,oCAAA,cAAe,eAAe,AAAjC;QACA,aAAa;IACf,GAAG;IAEH,IAAI,UAAU,cAAc,sBAExB,gCAAC,CAAA,GAAA,wCAAiB;QAChB,eAAY;QACZ,kBACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+CACA;YACE,8DAA8D,KAAK,KAAK,CAAC,aAAa;YACtF,eAAe,CAAC;QAClB;uBAKN,gCAAC,CAAA,GAAA,uCAAgB;QACf,eAAY;QACZ,kBACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+CACA;YACE,8DAA8D,KAAK,KAAK,CAAC,aAAa;YACtF,eAAe,CAAC;QAClB;;IAKV,IAAI,eAAe,MAAM,gBAAgB,CAAC,aAAa,KAAK,UAAU,MAAM,gBAAgB,CAAC,iBAAiB,KAAK;IACnH,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,IAAI,YAAY,cAAc,0BAAA,oCAAA,cAAe,SAAS,GAAG;QAAC,aAAa,EAAE,0BAAA,oCAAA,cAAe,SAAS,CAAC,cAAc;IAAA;IAChH,MAAM,cAAc,CAAA,GAAA,iBAAS,EAC3B,UACA,0BAAA,oCAAA,cAAe,SAAS,EACxB,WACA,YACA,kBACA,YACA,kHAAkH;IAClH,kEAAkE;IAClE,CAAA,6BAAA,uCAAA,iBAAkB,iBAAiB,OAAM;QAAC,UAAU;IAAI;IAG1D,IAAI,aAAa,KAAK,OAAO,IAAI;IACjC,IAAI,YAAY,KAAK,OAAO,IAAI;IAChC,2HAA2H;IAC3H,oIAAoI;IACpI,qBAAqB;IACrB,IAAI,6BAA6B;IACjC,IAAI,aAAa,iBAAiB,eAChC;QAAA,IAAI,EAAA,yBAAA,OAAO,cAAc,gBAArB,6CAAA,uBAAyB,MAAM,OAAI,sBAAA,OAAO,WAAW,cAAlB,0CAAA,oBAAoB,WAAW,CAAC,MAAM,GAC3E,6BAA6B;IAC/B;IAEF,+BAA+B;IAC/B,qIAAqI;IACrI,IAAI,YAAa,CAAC,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO,KAC1D,CAAA,MAAM,gBAAgB,CAAC,UAAU,KAAK,KAAK,OAAO,IAAI,CAAE,CAAA,CAAA,GAAA,qBAAmB,OAAO,MAAM,gBAAgB,CAAC,SAAS,AAAD,CAAC;IACxH,IAAI,eAAgB,CAAC,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO,KAC7D,CAAA,MAAM,gBAAgB,CAAC,UAAU,KAAK,KAAK,OAAO,IAAI,CAAE,CAAA,CAAA,GAAA,qBAAmB,OAAO,MAAM,gBAAgB,CAAC,SAAS,AAAD,CAAC;IAExH,IAAI,UAAU,OAAO,KAAK,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,WAAG,SAAG,KAAK,QAAQ,IAAW,KAAK,QAAQ;IAC9F,IAAI,YACF,wBAAU,gCAAC,CAAA,GAAA,eAAO;QAAE,YAAA;OAAY;IAGlC,qBACE,gCAAC;QACE,GAAG,WAAW;QACf,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+BACA;YACE,cAAc;YACd,cACE,aAAc,aAAa,CAAC,cAAc,MAAM,gBAAgB,CAAC,UAAU,KAAK,KAAK,GAAG;YAC1F,iBACE,gBAAiB,aAAa,CAAC,cAAc,MAAM,gBAAgB,CAAC,UAAU,KAAK,KAAK,GAAG;QAC/F;QAGJ,KAAK;qBACL,gCAAC;QACC,gEAAgE;QAChE,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+BACA;YACE,aAAa;YACb,cAAc;YACd,cAAc;YACd,cAAc;YACd,eAAe;YACf,eAAe;YACf,oBAAoB,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO;YAClE,oBAAoB,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO;YAClE,mDAAmD,MAAM,gBAAgB,CAAC,iBAAiB,KAAK,aAAc,CAAA,cAAc,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO,CAAA;YAC1K,2CAA2C,CAAC,CAAC;YAC7C,yCAAyC;YACzC,wCAAwC;YACxC,8CAA8C;YAC9C,+CAA+C;QACjD;QAGH,GAAG,aAAa;qBACjB,gCAAC,CAAA,GAAA,WAAG;QAAE,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,mCAAmC;OACnE,iCACC,gCAAC;QAAI,WAAW,CAAA,GAAA,mDAAS,CAAC,CAAC,mDAAmD;OAC3E,CAAC,4BACA,gCAAC,CAAA,GAAA,gBAAQ;QAAE,gBAAgB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,mDAAS,GAAG;qBAChD,gCAAC;QACE,GAAG,WAAW;QACf,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT;QAGJ,OAAO,CAAC,uBAAuB;YAAC,GAAG,oBAAoB,KAAK;QAAA,IAAI,CAAC;QACjE,KAAK;QACL,WAAU;qBACV,gCAAC,CAAA,GAAA,iCAAU,aAMpB,mBAAmB,EAAC,0BAAA,oCAAA,cAAe,QAAQ,mBAC1C,gCAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;WAAM,0BAAA,oCAAA,cAAe,kBAAkB,AAApC;QAAsC,KAAK;sBAE1F,gCAAC,CAAA,GAAA,oBAAY;QACX,IAAI;QACJ,eAAA;QACA,YAAY;YACV,OAAO,CAAA,GAAA,mDAAS,CAAC,CAAC,8CAA8C;YAChE,aAAa,CAAA,GAAA,mDAAS,CAAC,CAAC,oDAAoD;YAC5E,MAAM,CAAA,GAAA,mDAAS,CAAC,CAAC,6CAA6C;YAC9D,YAAY,CAAA,GAAA,mDAAS,CAAC,CAAC,mDAAmD;QAC5E;QACA,SAAS;QACT,SAAS;qBACT,gCAAC;QAAI,KAAK;QAAoB,WAAW,CAAA,GAAA,mDAAS,CAAC,CAAC,8CAA8C;qBAChG,gCAAC,CAAA,GAAA,eAAO;QACL,GAAG,aAAa;QACjB,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,uCAAuC;QACpE,cAAc;wBAGpB,gCAAC,CAAA,GAAA,mBAAW;QACV,OAAO;YACL,MAAM;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;YAAA;YAC1E,aAAa;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,0CAA0C;gBAAE,GAAG,gBAAgB;YAAA;YAC1G,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YACpF,OAAO;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YAC7E,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBAAE,SAAS;YAAI;YACjG,aAAa;gBACX,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBACnE,SAAS;gBACT,SAAS;YACX;YACA,YAAY;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,yCAAyC;gBAAE,SAAS;YAAI;QACpG;OACC,uBACD,gCAAC,CAAA,GAAA,iBAAS,SACP;AAOf","sources":["packages/@react-spectrum/list/src/ListViewItem.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 */\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport ChevronLeftMedium from '@spectrum-icons/ui/ChevronLeftMedium';\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames, ClearSlots, SlotProvider, useHasChild} from '@react-spectrum/utils';\nimport {CSSTransition} from 'react-transition-group';\nimport type {DraggableItemResult, DropIndicatorAria, DroppableItemResult} from '@react-aria/dnd';\nimport {DropTarget, Node} from '@react-types/shared';\nimport {FocusRing, useFocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible as isGlobalFocusVisible, useHover} from '@react-aria/interactions';\nimport ListGripper from '@spectrum-icons/ui/ListGripper';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport {mergeProps} from '@react-aria/utils';\nimport {Provider} from '@react-spectrum/provider';\nimport React, {useContext, useRef} from 'react';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useGridListItem, useGridListSelectionCheckbox} from '@react-aria/gridlist';\nimport {useLocale} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface ListViewItemProps<T> {\n item: Node<T>,\n isEmphasized: boolean,\n hasActions: boolean\n}\n\nexport function ListViewItem<T>(props: ListViewItemProps<T>) {\n let {\n item,\n isEmphasized\n } = props;\n let {\n state,\n dragState,\n dropState,\n isListDraggable,\n isListDroppable,\n layout,\n dragAndDropHooks,\n loadingState\n } = useContext(ListViewContext);\n let {direction} = useLocale();\n let rowRef = useRef<HTMLDivElement>(undefined);\n let checkboxWrapperRef = useRef<HTMLDivElement>(undefined);\n let {\n isFocusVisible: isFocusVisibleWithin,\n focusProps: focusWithinProps\n } = useFocusRing({within: true});\n let {isFocusVisible, focusProps} = useFocusRing();\n let {\n rowProps,\n gridCellProps,\n isPressed,\n descriptionProps,\n isSelected,\n isDisabled,\n allowsSelection,\n hasAction\n } = useGridListItem({\n node: item,\n isVirtualized: true,\n shouldSelectOnPressUp: isListDraggable\n }, state, rowRef);\n let isDroppable = isListDroppable && !isDisabled;\n let {hoverProps, isHovered} = useHover({isDisabled: !allowsSelection && !hasAction});\n\n let {checkboxProps} = useGridListSelectionCheckbox({key: item.key}, state);\n let hasDescription = useHasChild(`.${listStyles['react-spectrum-ListViewItem-description']}`, rowRef);\n\n let draggableItem: DraggableItemResult;\n if (isListDraggable) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n draggableItem = dragAndDropHooks.useDraggableItem({key: item.key, hasDragButton: true}, dragState);\n if (isDisabled) {\n draggableItem = null;\n }\n }\n let droppableItem: DroppableItemResult;\n let isDropTarget: boolean;\n let dropIndicator: DropIndicatorAria;\n let dropIndicatorRef = useRef(undefined);\n if (isListDroppable) {\n let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;\n isDropTarget = dropState.isDropTarget(target);\n // eslint-disable-next-line react-hooks/rules-of-hooks\n dropIndicator = dragAndDropHooks.useDropIndicator({target}, dropState, dropIndicatorRef);\n }\n\n let dragButtonRef = React.useRef(undefined);\n let {buttonProps} = useButton({\n ...draggableItem?.dragButtonProps,\n elementType: 'div'\n }, dragButtonRef);\n\n let chevron = direction === 'ltr'\n ? (\n <ChevronRightMedium\n aria-hidden=\"true\"\n UNSAFE_className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-parentIndicator',\n {\n 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n 'is-disabled': !hasAction\n }\n )\n } />\n )\n : (\n <ChevronLeftMedium\n aria-hidden=\"true\"\n UNSAFE_className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-parentIndicator',\n {\n 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n 'is-disabled': !hasAction\n }\n )\n } />\n );\n\n let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n let dropProps = isDroppable ? droppableItem?.dropProps : {'aria-hidden': droppableItem?.dropProps['aria-hidden']};\n const mergedProps = mergeProps(\n rowProps,\n draggableItem?.dragProps,\n dropProps,\n hoverProps,\n focusWithinProps,\n focusProps,\n // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,\n // allowing for single swipe navigation between row drop indicator\n dragAndDropHooks?.isVirtualDragging() && {tabIndex: null}\n );\n\n let isFirstRow = item.prevKey == null;\n let isLastRow = item.nextKey == null;\n // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom\n // border corners of the last row when selected and we can get rid of the bottom border if it isn't selected to avoid border overlap\n // with bottom border\n let isFlushWithContainerBottom = false;\n if (isLastRow && loadingState !== 'loadingMore') {\n if (layout.getContentSize()?.height >= layout.virtualizer?.visibleRect.height) {\n isFlushWithContainerBottom = true;\n }\n }\n // previous item isn't selected\n // and the previous item isn't focused or, if it is focused, then if focus globally isn't visible or just focus isn't in the listview\n let roundTops = (!state.selectionManager.isSelected(item.prevKey)\n && (state.selectionManager.focusedKey !== item.prevKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n let roundBottoms = (!state.selectionManager.isSelected(item.nextKey)\n && (state.selectionManager.focusedKey !== item.nextKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n\n let content = typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered;\n if (isDisabled) {\n content = <Provider isDisabled>{content}</Provider>;\n }\n\n return (\n <div\n {...mergedProps}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView-row',\n {\n 'focus-ring': isFocusVisible,\n 'round-tops':\n roundTops || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key),\n 'round-bottoms':\n roundBottoms || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key)\n }\n )\n }\n ref={rowRef}>\n <div\n // TODO: refactor the css here now that we are focusing the row?\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem',\n {\n 'is-active': isPressed,\n 'is-focused': isFocusVisibleWithin,\n 'focus-ring': isFocusVisible,\n 'is-hovered': isHovered,\n 'is-selected': isSelected,\n 'is-disabled': isDisabled,\n 'is-prev-selected': state.selectionManager.isSelected(item.prevKey),\n 'is-next-selected': state.selectionManager.isSelected(item.nextKey),\n 'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || state.selectionManager.isSelected(item.nextKey)),\n 'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,\n 'react-spectrum-ListViewItem--firstRow': isFirstRow,\n 'react-spectrum-ListViewItem--lastRow': isLastRow,\n 'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,\n 'react-spectrum-ListViewItem--hasDescription': hasDescription\n }\n )\n }\n {...gridCellProps}>\n <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n {isListDraggable &&\n <div className={listStyles['react-spectrum-ListViewItem-draghandle-container']}>\n {!isDisabled &&\n <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n <div\n {...buttonProps as React.HTMLAttributes<HTMLElement>}\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListViewItem-draghandle-button'\n )\n }\n style={!isFocusVisibleWithin ? {...visuallyHiddenProps.style} : {}}\n ref={dragButtonRef}\n draggable=\"true\">\n <ListGripper />\n </div>\n </FocusRing>\n }\n </div>\n }\n {isListDroppable && !dropIndicator?.isHidden &&\n <div role=\"button\" {...visuallyHiddenProps} {...dropIndicator?.dropIndicatorProps} ref={dropIndicatorRef} />\n }\n <CSSTransition\n in={showCheckbox}\n unmountOnExit\n classNames={{\n enter: listStyles['react-spectrum-ListViewItem-checkbox--enter'],\n enterActive: listStyles['react-spectrum-ListViewItem-checkbox--enterActive'],\n exit: listStyles['react-spectrum-ListViewItem-checkbox--exit'],\n exitActive: listStyles['react-spectrum-ListViewItem-checkbox--exitActive']\n }}\n timeout={160}\n nodeRef={checkboxWrapperRef} >\n <div ref={checkboxWrapperRef} className={listStyles['react-spectrum-ListViewItem-checkboxWrapper']}>\n <Checkbox\n {...checkboxProps}\n UNSAFE_className={listStyles['react-spectrum-ListViewItem-checkbox']}\n isEmphasized={isEmphasized} />\n </div>\n </CSSTransition>\n <SlotProvider\n slots={{\n text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description'], ...descriptionProps},\n illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n actionGroup: {\n UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n isQuiet: true,\n density: 'compact'\n },\n actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n }}>\n {content}\n <ClearSlots>\n {chevron}\n </ClearSlots>\n </SlotProvider>\n </Grid>\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"ListViewItem.module.js.map"}
package/dist/RootDropIndicator.main.js CHANGED
@@ -17,7 +17,7 @@ $parcel$export(module.exports, "default", () => $c59d3898f402f50b$export$2e2bcd8
17
17
 
18
18
  function $c59d3898f402f50b$export$2e2bcd8739ae039() {
19
19
  let { dropState: dropState, dragAndDropHooks: dragAndDropHooks } = (0, $63sFO$react.useContext)((0, $60684b441be8e84c$exports.ListViewContext));
20
- let ref = (0, $63sFO$react.useRef)();
20
+ let ref = (0, $63sFO$react.useRef)(undefined);
21
21
  let { dropIndicatorProps: dropIndicatorProps } = dragAndDropHooks.useDropIndicator({
22
22
  target: {
23
23
  type: 'root'
package/dist/RootDropIndicator.main.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;;;;;;;;;;;;;;;AAIe;IACb,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,IAAI,MAAM,CAAA,GAAA,mBAAK;IACf,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAiB,gBAAgB,CAAC;QAC3D,QAAQ;YAAC,MAAM;QAAM;IACvB,GAAG,WAAW;IACd,IAAI,eAAe,UAAU,YAAY,CAAC;QAAC,MAAM;IAAM;IACvD,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,gDAAgB;IAE5C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,0DAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,0DAAC;QACC,MAAK;QACL,iBAAc;qBACd,0DAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;QAAG,GAAG,kBAAkB;QAAE,KAAK;;AAIjF","sources":["packages/@react-spectrum/list/src/RootDropIndicator.tsx"],"sourcesContent":["import {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport default function RootDropIndicator() {\n let {dropState, dragAndDropHooks} = useContext(ListViewContext);\n let ref = useRef();\n let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator({\n target: {type: 'root'}\n }, dropState, ref);\n let isDropTarget = dropState.isDropTarget({type: 'root'});\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n return null;\n }\n\n return (\n <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n <div\n role=\"gridcell\"\n aria-selected=\"false\">\n <div role=\"button\" {...visuallyHiddenProps} {...dropIndicatorProps} ref={ref} />\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"RootDropIndicator.main.js.map"}
1
+ {"mappings":";;;;;;;;;;;;;;;;;AAIe;IACb,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,IAAI,MAAM,CAAA,GAAA,mBAAK,EAAE;IACjB,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAiB,gBAAgB,CAAC;QAC3D,QAAQ;YAAC,MAAM;QAAM;IACvB,GAAG,WAAW;IACd,IAAI,eAAe,UAAU,YAAY,CAAC;QAAC,MAAM;IAAM;IACvD,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,gDAAgB;IAE5C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,0DAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,0DAAC;QACC,MAAK;QACL,iBAAc;qBACd,0DAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;QAAG,GAAG,kBAAkB;QAAE,KAAK;;AAIjF","sources":["packages/@react-spectrum/list/src/RootDropIndicator.tsx"],"sourcesContent":["import {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport default function RootDropIndicator() {\n let {dropState, dragAndDropHooks} = useContext(ListViewContext);\n let ref = useRef(undefined);\n let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator({\n target: {type: 'root'}\n }, dropState, ref);\n let isDropTarget = dropState.isDropTarget({type: 'root'});\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n return null;\n }\n\n return (\n <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n <div\n role=\"gridcell\"\n aria-selected=\"false\">\n <div role=\"button\" {...visuallyHiddenProps} {...dropIndicatorProps} ref={ref} />\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"RootDropIndicator.main.js.map"}
package/dist/RootDropIndicator.mjs CHANGED
@@ -7,7 +7,7 @@ import {useVisuallyHidden as $jzbuT$useVisuallyHidden} from "@react-aria/visuall
7
7
 
8
8
  function $41a60729487a82d7$export$2e2bcd8739ae039() {
9
9
  let { dropState: dropState, dragAndDropHooks: dragAndDropHooks } = (0, $jzbuT$useContext)((0, $f85fb77f9d4cbc6c$export$870039b0abfe3de0));
10
- let ref = (0, $jzbuT$useRef)();
10
+ let ref = (0, $jzbuT$useRef)(undefined);
11
11
  let { dropIndicatorProps: dropIndicatorProps } = dragAndDropHooks.useDropIndicator({
12
12
  target: {
13
13
  type: 'root'
package/dist/RootDropIndicator.module.js CHANGED
@@ -7,7 +7,7 @@ import {useVisuallyHidden as $jzbuT$useVisuallyHidden} from "@react-aria/visuall
7
7
 
8
8
  function $41a60729487a82d7$export$2e2bcd8739ae039() {
9
9
  let { dropState: dropState, dragAndDropHooks: dragAndDropHooks } = (0, $jzbuT$useContext)((0, $f85fb77f9d4cbc6c$export$870039b0abfe3de0));
10
- let ref = (0, $jzbuT$useRef)();
10
+ let ref = (0, $jzbuT$useRef)(undefined);
11
11
  let { dropIndicatorProps: dropIndicatorProps } = dragAndDropHooks.useDropIndicator({
12
12
  target: {
13
13
  type: 'root'
package/dist/RootDropIndicator.module.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;;;;;AAIe;IACb,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,IAAI,MAAM,CAAA,GAAA,aAAK;IACf,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAiB,gBAAgB,CAAC;QAC3D,QAAQ;YAAC,MAAM;QAAM;IACvB,GAAG,WAAW;IACd,IAAI,eAAe,UAAU,YAAY,CAAC;QAAC,MAAM;IAAM;IACvD,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,gCAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,gCAAC;QACC,MAAK;QACL,iBAAc;qBACd,gCAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;QAAG,GAAG,kBAAkB;QAAE,KAAK;;AAIjF","sources":["packages/@react-spectrum/list/src/RootDropIndicator.tsx"],"sourcesContent":["import {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport default function RootDropIndicator() {\n let {dropState, dragAndDropHooks} = useContext(ListViewContext);\n let ref = useRef();\n let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator({\n target: {type: 'root'}\n }, dropState, ref);\n let isDropTarget = dropState.isDropTarget({type: 'root'});\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n return null;\n }\n\n return (\n <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n <div\n role=\"gridcell\"\n aria-selected=\"false\">\n <div role=\"button\" {...visuallyHiddenProps} {...dropIndicatorProps} ref={ref} />\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"RootDropIndicator.module.js.map"}
1
+ {"mappings":";;;;;;;AAIe;IACb,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,IAAI,MAAM,CAAA,GAAA,aAAK,EAAE;IACjB,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAiB,gBAAgB,CAAC;QAC3D,QAAQ;YAAC,MAAM;QAAM;IACvB,GAAG,WAAW;IACd,IAAI,eAAe,UAAU,YAAY,CAAC;QAAC,MAAM;IAAM;IACvD,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,gCAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,gCAAC;QACC,MAAK;QACL,iBAAc;qBACd,gCAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;QAAG,GAAG,kBAAkB;QAAE,KAAK;;AAIjF","sources":["packages/@react-spectrum/list/src/RootDropIndicator.tsx"],"sourcesContent":["import {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport default function RootDropIndicator() {\n let {dropState, dragAndDropHooks} = useContext(ListViewContext);\n let ref = useRef(undefined);\n let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator({\n target: {type: 'root'}\n }, dropState, ref);\n let isDropTarget = dropState.isDropTarget({type: 'root'});\n let {visuallyHiddenProps} = useVisuallyHidden();\n\n if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n return null;\n }\n\n return (\n <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n <div\n role=\"gridcell\"\n aria-selected=\"false\">\n <div role=\"button\" {...visuallyHiddenProps} {...dropIndicatorProps} ref={ref} />\n </div>\n </div>\n );\n}\n"],"names":[],"version":3,"file":"RootDropIndicator.module.js.map"}
package/dist/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"mappings":";;;;AImCA,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;AA0RD;;GAEG;AACH,OAAA,MAAM;UAAuF,OAAO,cAAc,CAAC;MAAM,YAAY,CAAC;AC7UtI,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/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,"/*\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":";;;;AIoCA,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;AAyRD;;GAEG;AACH,OAAA,MAAM;UAAuF,OAAO,cAAc,CAAC;MAAM,YAAY,CAAC;AC7UtI,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/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,"/*\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.4674+59136f78e",
3
+ "version": "3.7.11-nightly.4683+4e3af379e",
4
4
  "description": "Spectrum UI components in React",
5
5
  "license": "Apache-2.0",
6
6
  "main": "dist/main.js",
@@ -36,42 +36,43 @@
36
36
  "url": "https://github.com/adobe/react-spectrum"
37
37
  },
38
38
  "dependencies": {
39
- "@react-aria/button": "3.0.0-nightly.2962+59136f78e",
40
- "@react-aria/focus": "3.0.0-nightly.2962+59136f78e",
41
- "@react-aria/gridlist": "3.8.2-nightly.4674+59136f78e",
42
- "@react-aria/i18n": "3.0.0-nightly.2962+59136f78e",
43
- "@react-aria/interactions": "3.0.0-nightly.2962+59136f78e",
44
- "@react-aria/utils": "3.0.0-nightly.2962+59136f78e",
45
- "@react-aria/virtualizer": "3.10.2-nightly.4674+59136f78e",
46
- "@react-aria/visually-hidden": "3.0.0-nightly.2962+59136f78e",
47
- "@react-spectrum/checkbox": "3.0.0-nightly.2962+59136f78e",
48
- "@react-spectrum/dnd": "3.3.11-nightly.4674+59136f78e",
49
- "@react-spectrum/layout": "3.6.6-nightly.4674+59136f78e",
50
- "@react-spectrum/progress": "3.0.0-nightly.2962+59136f78e",
51
- "@react-spectrum/text": "3.5.6-nightly.4674+59136f78e",
52
- "@react-spectrum/utils": "3.0.0-nightly.2962+59136f78e",
53
- "@react-stately/collections": "3.0.0-nightly.2962+59136f78e",
54
- "@react-stately/layout": "3.13.10-nightly.4674+59136f78e",
55
- "@react-stately/list": "3.10.6-nightly.4674+59136f78e",
56
- "@react-types/grid": "3.2.7-nightly.4674+59136f78e",
57
- "@react-types/shared": "3.0.0-nightly.2962+59136f78e",
58
- "@spectrum-icons/ui": "3.0.0-nightly.2962+59136f78e",
39
+ "@react-aria/button": "3.0.0-nightly.2971+4e3af379e",
40
+ "@react-aria/focus": "3.0.0-nightly.2971+4e3af379e",
41
+ "@react-aria/gridlist": "3.8.2-nightly.4683+4e3af379e",
42
+ "@react-aria/i18n": "3.0.0-nightly.2971+4e3af379e",
43
+ "@react-aria/interactions": "3.0.0-nightly.2971+4e3af379e",
44
+ "@react-aria/selection": "3.0.0-nightly.2971+4e3af379e",
45
+ "@react-aria/utils": "3.0.0-nightly.2971+4e3af379e",
46
+ "@react-aria/virtualizer": "3.10.2-nightly.4683+4e3af379e",
47
+ "@react-aria/visually-hidden": "3.0.0-nightly.2971+4e3af379e",
48
+ "@react-spectrum/checkbox": "3.0.0-nightly.2971+4e3af379e",
49
+ "@react-spectrum/dnd": "3.3.11-nightly.4683+4e3af379e",
50
+ "@react-spectrum/layout": "3.6.6-nightly.4683+4e3af379e",
51
+ "@react-spectrum/progress": "3.0.0-nightly.2971+4e3af379e",
52
+ "@react-spectrum/text": "3.5.6-nightly.4683+4e3af379e",
53
+ "@react-spectrum/utils": "3.0.0-nightly.2971+4e3af379e",
54
+ "@react-stately/collections": "3.0.0-nightly.2971+4e3af379e",
55
+ "@react-stately/layout": "3.13.10-nightly.4683+4e3af379e",
56
+ "@react-stately/list": "3.10.6-nightly.4683+4e3af379e",
57
+ "@react-types/grid": "3.2.7-nightly.4683+4e3af379e",
58
+ "@react-types/shared": "3.0.0-nightly.2971+4e3af379e",
59
+ "@spectrum-icons/ui": "3.0.0-nightly.2971+4e3af379e",
59
60
  "@swc/helpers": "^0.5.0",
60
61
  "react-transition-group": "^4.4.5"
61
62
  },
62
63
  "devDependencies": {
63
- "@adobe/spectrum-css-temp": "3.0.0-nightly.2962+59136f78e",
64
- "@react-aria/dnd": "3.6.2-nightly.4674+59136f78e",
65
- "@react-spectrum/button": "3.0.0-nightly.2962+59136f78e",
66
- "@react-stately/dnd": "3.3.2-nightly.4674+59136f78e"
64
+ "@adobe/spectrum-css-temp": "3.0.0-nightly.2971+4e3af379e",
65
+ "@react-aria/dnd": "3.6.2-nightly.4683+4e3af379e",
66
+ "@react-spectrum/button": "3.0.0-nightly.2971+4e3af379e",
67
+ "@react-stately/dnd": "3.3.2-nightly.4683+4e3af379e"
67
68
  },
68
69
  "peerDependencies": {
69
70
  "@react-spectrum/provider": "^3.2.0",
70
- "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0",
71
- "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0"
71
+ "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0",
72
+ "react-dom": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0"
72
73
  },
73
74
  "publishConfig": {
74
75
  "access": "public"
75
76
  },
76
- "gitHead": "59136f78e853e97bb4067a1268750c9f85900bf6"
77
+ "gitHead": "4e3af379e569faac3b374e0ed5a98b2a19cd92c3"
77
78
  }
package/src/InsertionIndicator.tsx CHANGED
@@ -14,7 +14,7 @@ export default function InsertionIndicator(props: InsertionIndicatorProps) {
14
14
  let {dropState, dragAndDropHooks} = useContext(ListViewContext);
15
15
  const {target, isPresentationOnly} = props;
16
16
 
17
- let ref = useRef();
17
+ let ref = useRef(undefined);
18
18
  let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator(props, dropState, ref);
19
19
  let {visuallyHiddenProps} = useVisuallyHidden();
20
20
 
package/src/ListView.tsx CHANGED
@@ -21,6 +21,7 @@ import {FocusRing, FocusScope} from '@react-aria/focus';
21
21
  import InsertionIndicator from './InsertionIndicator';
22
22
  // @ts-ignore
23
23
  import intlMessages from '../intl/*.json';
24
+ import {ListKeyboardDelegate} from '@react-aria/selection';
24
25
  import {ListLayout} from '@react-stately/layout';
25
26
  import {ListState, useListState} from '@react-stately/list';
26
27
  import listStyles from './styles.css';
@@ -29,7 +30,7 @@ import {ProgressCircle} from '@react-spectrum/progress';
29
30
  import React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';
30
31
  import RootDropIndicator from './RootDropIndicator';
31
32
  import {DragPreview as SpectrumDragPreview} from './DragPreview';
32
- import {useCollator, useLocalizedStringFormatter} from '@react-aria/i18n';
33
+ import {useLocalizedStringFormatter} from '@react-aria/i18n';
33
34
  import {useProvider} from '@react-spectrum/provider';
34
35
  import {Virtualizer} from '@react-aria/virtualizer';
35
36
 
@@ -93,20 +94,17 @@ const ROW_HEIGHTS = {
93
94
 
94
95
  function useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {
95
96
  let {scale} = useProvider();
96
- let collator = useCollator({usage: 'search', sensitivity: 'base'});
97
97
  let isEmpty = state.collection.size === 0;
98
98
  let layout = useMemo(() =>
99
99
  new ListLayout<T>({
100
100
  estimatedRowHeight: ROW_HEIGHTS[density][scale],
101
101
  padding: 0,
102
- collator,
103
- loaderHeight: isEmpty ? null : ROW_HEIGHTS[density][scale]
102
+ loaderHeight: isEmpty ? null : ROW_HEIGHTS[density][scale],
103
+ enableEmptyState: true
104
104
  })
105
105
  // eslint-disable-next-line react-hooks/exhaustive-deps
106
- , [collator, scale, density, isEmpty, overflowMode]);
106
+ , [scale, density, isEmpty, overflowMode]);
107
107
 
108
- layout.collection = state.collection;
109
- layout.disabledKeys = state.disabledKeys;
110
108
  return layout;
111
109
  }
112
110
 
@@ -159,9 +157,6 @@ function ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef
159
157
  props.density || 'regular',
160
158
  overflowMode
161
159
  );
162
- // !!0 is false, so we can cast size or undefined and they'll be falsy
163
- layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!dragState?.draggingKeys.size;
164
-
165
160
 
166
161
  let DragPreview = dragAndDropHooks?.DragPreview;
167
162
  let dropState: DroppableCollectionState;
@@ -173,7 +168,12 @@ function ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef
173
168
  selectionManager
174
169
  });
175
170
  droppableCollection = dragAndDropHooks.useDroppableCollection({
176
- keyboardDelegate: layout,
171
+ keyboardDelegate: new ListKeyboardDelegate({
172
+ collection,
173
+ disabledKeys: dragState?.draggingKeys.size ? null : selectionManager.disabledKeys,
174
+ ref: domRef,
175
+ layoutDelegate: layout
176
+ }),
177
177
  dropTargetDelegate: layout
178
178
  }, dropState, domRef);
179
179
 
@@ -183,7 +183,7 @@ function ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef
183
183
  let {gridProps} = useGridList({
184
184
  ...props,
185
185
  isVirtualized: true,
186
- keyboardDelegate: layout,
186
+ layoutDelegate: layout,
187
187
  onAction
188
188
  }, state, domRef);
189
189
 
package/src/ListViewItem.tsx CHANGED
@@ -53,8 +53,8 @@ export function ListViewItem<T>(props: ListViewItemProps<T>) {
53
53
  loadingState
54
54
  } = useContext(ListViewContext);
55
55
  let {direction} = useLocale();
56
- let rowRef = useRef<HTMLDivElement>();
57
- let checkboxWrapperRef = useRef<HTMLDivElement>();
56
+ let rowRef = useRef<HTMLDivElement>(undefined);
57
+ let checkboxWrapperRef = useRef<HTMLDivElement>(undefined);
58
58
  let {
59
59
  isFocusVisible: isFocusVisibleWithin,
60
60
  focusProps: focusWithinProps
@@ -91,7 +91,7 @@ export function ListViewItem<T>(props: ListViewItemProps<T>) {
91
91
  let droppableItem: DroppableItemResult;
92
92
  let isDropTarget: boolean;
93
93
  let dropIndicator: DropIndicatorAria;
94
- let dropIndicatorRef = useRef();
94
+ let dropIndicatorRef = useRef(undefined);
95
95
  if (isListDroppable) {
96
96
  let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;
97
97
  isDropTarget = dropState.isDropTarget(target);
@@ -99,7 +99,7 @@ export function ListViewItem<T>(props: ListViewItemProps<T>) {
99
99
  dropIndicator = dragAndDropHooks.useDropIndicator({target}, dropState, dropIndicatorRef);
100
100
  }
101
101
 
102
- let dragButtonRef = React.useRef();
102
+ let dragButtonRef = React.useRef(undefined);
103
103
  let {buttonProps} = useButton({
104
104
  ...draggableItem?.dragButtonProps,
105
105
  elementType: 'div'
package/src/RootDropIndicator.tsx CHANGED
@@ -4,7 +4,7 @@ import {useVisuallyHidden} from '@react-aria/visually-hidden';
4
4
 
5
5
  export default function RootDropIndicator() {
6
6
  let {dropState, dragAndDropHooks} = useContext(ListViewContext);
7
- let ref = useRef();
7
+ let ref = useRef(undefined);
8
8
  let {dropIndicatorProps} = dragAndDropHooks.useDropIndicator({
9
9
  target: {type: 'root'}
10
10
  }, dropState, ref);