@react-spectrum/list 3.7.10-nightly.4623 → 3.7.10

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 (17) hide show
  1. package/dist/DragPreview.main.js +13 -13
  2. package/dist/DragPreview.mjs +13 -13
  3. package/dist/DragPreview.module.js +13 -13
  4. package/dist/InsertionIndicator.main.js +4 -4
  5. package/dist/InsertionIndicator.mjs +4 -4
  6. package/dist/InsertionIndicator.module.js +4 -4
  7. package/dist/ListView.main.js +34 -34
  8. package/dist/ListView.main.js.map +1 -1
  9. package/dist/ListView.mjs +32 -32
  10. package/dist/ListView.module.js +32 -32
  11. package/dist/ListViewItem.main.js +52 -52
  12. package/dist/ListViewItem.mjs +52 -52
  13. package/dist/ListViewItem.module.js +52 -52
  14. package/dist/RootDropIndicator.main.js +4 -4
  15. package/dist/RootDropIndicator.mjs +4 -4
  16. package/dist/RootDropIndicator.module.js +4 -4
  17. package/package.json +26 -26
package/dist/DragPreview.main.js CHANGED
@@ -37,41 +37,41 @@ function $3d665b19f7865ff9$export$905ab40ac2179daa(props) {
37
37
  style: {
38
38
  height: itemHeight
39
39
  },
40
- className: (0, $U0AUi$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListViewItem", "react-spectrum-ListViewItem-dragPreview", {
41
- "react-spectrum-ListViewItem-dragPreview--multiple": isDraggingMultiple
40
+ className: (0, $U0AUi$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem', 'react-spectrum-ListViewItem-dragPreview', {
41
+ 'react-spectrum-ListViewItem-dragPreview--multiple': isDraggingMultiple
42
42
  }, `react-spectrum-ListViewItem-dragPreview--${density}`)
43
43
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($U0AUi$react))).createElement((0, $U0AUi$reactspectrumlayout.Grid), {
44
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-grid"]
44
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-grid']
45
45
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($U0AUi$react))).createElement((0, $U0AUi$reactspectrumutils.SlotProvider), {
46
46
  slots: {
47
47
  text: {
48
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-content"]
48
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-content']
49
49
  },
50
50
  description: {
51
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-description"]
51
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-description']
52
52
  },
53
53
  illustration: {
54
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-thumbnail"]
54
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-thumbnail']
55
55
  },
56
56
  image: {
57
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-thumbnail"]
57
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-thumbnail']
58
58
  },
59
59
  actionButton: {
60
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-actions"],
60
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-actions'],
61
61
  isQuiet: true
62
62
  },
63
63
  actionGroup: {
64
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-actions"],
64
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-actions'],
65
65
  isQuiet: true,
66
- density: "compact"
66
+ density: 'compact'
67
67
  },
68
68
  actionMenu: {
69
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-actionmenu"],
69
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-actionmenu'],
70
70
  isQuiet: true
71
71
  }
72
72
  }
73
- }, typeof item.rendered === "string" ? /*#__PURE__*/ (0, ($parcel$interopDefault($U0AUi$react))).createElement((0, $U0AUi$reactspectrumtext.Text), null, item.rendered) : item.rendered, isDraggingMultiple && /*#__PURE__*/ (0, ($parcel$interopDefault($U0AUi$react))).createElement("div", {
74
- className: (0, $U0AUi$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListViewItem-badge")
73
+ }, typeof item.rendered === 'string' ? /*#__PURE__*/ (0, ($parcel$interopDefault($U0AUi$react))).createElement((0, $U0AUi$reactspectrumtext.Text), null, item.rendered) : item.rendered, isDraggingMultiple && /*#__PURE__*/ (0, ($parcel$interopDefault($U0AUi$react))).createElement("div", {
74
+ className: (0, $U0AUi$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem-badge')
75
75
  }, itemCount))));
76
76
  }
77
77
 
package/dist/DragPreview.mjs CHANGED
@@ -31,41 +31,41 @@ function $cd61e55c47e3c0f5$export$905ab40ac2179daa(props) {
31
31
  style: {
32
32
  height: itemHeight
33
33
  },
34
- className: (0, $vFUHn$classNames)((0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs))), "react-spectrum-ListViewItem", "react-spectrum-ListViewItem-dragPreview", {
35
- "react-spectrum-ListViewItem-dragPreview--multiple": isDraggingMultiple
34
+ className: (0, $vFUHn$classNames)((0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs))), 'react-spectrum-ListViewItem', 'react-spectrum-ListViewItem-dragPreview', {
35
+ 'react-spectrum-ListViewItem-dragPreview--multiple': isDraggingMultiple
36
36
  }, `react-spectrum-ListViewItem-dragPreview--${density}`)
37
37
  }, /*#__PURE__*/ (0, $vFUHn$react).createElement((0, $vFUHn$Grid), {
38
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-grid"]
38
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-grid']
39
39
  }, /*#__PURE__*/ (0, $vFUHn$react).createElement((0, $vFUHn$SlotProvider), {
40
40
  slots: {
41
41
  text: {
42
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-content"]
42
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-content']
43
43
  },
44
44
  description: {
45
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-description"]
45
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-description']
46
46
  },
47
47
  illustration: {
48
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-thumbnail"]
48
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-thumbnail']
49
49
  },
50
50
  image: {
51
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-thumbnail"]
51
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-thumbnail']
52
52
  },
53
53
  actionButton: {
54
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-actions"],
54
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-actions'],
55
55
  isQuiet: true
56
56
  },
57
57
  actionGroup: {
58
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-actions"],
58
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-actions'],
59
59
  isQuiet: true,
60
- density: "compact"
60
+ density: 'compact'
61
61
  },
62
62
  actionMenu: {
63
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-actionmenu"],
63
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-actionmenu'],
64
64
  isQuiet: true
65
65
  }
66
66
  }
67
- }, typeof item.rendered === "string" ? /*#__PURE__*/ (0, $vFUHn$react).createElement((0, $vFUHn$Text), null, item.rendered) : item.rendered, isDraggingMultiple && /*#__PURE__*/ (0, $vFUHn$react).createElement("div", {
68
- className: (0, $vFUHn$classNames)((0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs))), "react-spectrum-ListViewItem-badge")
67
+ }, typeof item.rendered === 'string' ? /*#__PURE__*/ (0, $vFUHn$react).createElement((0, $vFUHn$Text), null, item.rendered) : item.rendered, isDraggingMultiple && /*#__PURE__*/ (0, $vFUHn$react).createElement("div", {
68
+ className: (0, $vFUHn$classNames)((0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs))), 'react-spectrum-ListViewItem-badge')
69
69
  }, itemCount))));
70
70
  }
71
71
 
package/dist/DragPreview.module.js CHANGED
@@ -31,41 +31,41 @@ function $cd61e55c47e3c0f5$export$905ab40ac2179daa(props) {
31
31
  style: {
32
32
  height: itemHeight
33
33
  },
34
- className: (0, $vFUHn$classNames)((0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs))), "react-spectrum-ListViewItem", "react-spectrum-ListViewItem-dragPreview", {
35
- "react-spectrum-ListViewItem-dragPreview--multiple": isDraggingMultiple
34
+ className: (0, $vFUHn$classNames)((0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs))), 'react-spectrum-ListViewItem', 'react-spectrum-ListViewItem-dragPreview', {
35
+ 'react-spectrum-ListViewItem-dragPreview--multiple': isDraggingMultiple
36
36
  }, `react-spectrum-ListViewItem-dragPreview--${density}`)
37
37
  }, /*#__PURE__*/ (0, $vFUHn$react).createElement((0, $vFUHn$Grid), {
38
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-grid"]
38
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-grid']
39
39
  }, /*#__PURE__*/ (0, $vFUHn$react).createElement((0, $vFUHn$SlotProvider), {
40
40
  slots: {
41
41
  text: {
42
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-content"]
42
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-content']
43
43
  },
44
44
  description: {
45
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-description"]
45
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-description']
46
46
  },
47
47
  illustration: {
48
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-thumbnail"]
48
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-thumbnail']
49
49
  },
50
50
  image: {
51
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-thumbnail"]
51
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-thumbnail']
52
52
  },
53
53
  actionButton: {
54
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-actions"],
54
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-actions'],
55
55
  isQuiet: true
56
56
  },
57
57
  actionGroup: {
58
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-actions"],
58
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-actions'],
59
59
  isQuiet: true,
60
- density: "compact"
60
+ density: 'compact'
61
61
  },
62
62
  actionMenu: {
63
- UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))["react-spectrum-ListViewItem-actionmenu"],
63
+ UNSAFE_className: (0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs)))['react-spectrum-ListViewItem-actionmenu'],
64
64
  isQuiet: true
65
65
  }
66
66
  }
67
- }, typeof item.rendered === "string" ? /*#__PURE__*/ (0, $vFUHn$react).createElement((0, $vFUHn$Text), null, item.rendered) : item.rendered, isDraggingMultiple && /*#__PURE__*/ (0, $vFUHn$react).createElement("div", {
68
- className: (0, $vFUHn$classNames)((0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs))), "react-spectrum-ListViewItem-badge")
67
+ }, typeof item.rendered === 'string' ? /*#__PURE__*/ (0, $vFUHn$react).createElement((0, $vFUHn$Text), null, item.rendered) : item.rendered, isDraggingMultiple && /*#__PURE__*/ (0, $vFUHn$react).createElement("div", {
68
+ className: (0, $vFUHn$classNames)((0, ($parcel$interopDefault($vFUHn$styles_cssmodulejs))), 'react-spectrum-ListViewItem-badge')
69
69
  }, itemCount))));
70
70
  }
71
71
 
package/dist/InsertionIndicator.main.js CHANGED
@@ -27,15 +27,15 @@ function $fc02fd49ab58c72e$export$2e2bcd8739ae039(props) {
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);
30
- if (!isDropTarget && dropIndicatorProps["aria-hidden"]) return null;
30
+ if (!isDropTarget && dropIndicatorProps['aria-hidden']) return null;
31
31
  return /*#__PURE__*/ (0, ($parcel$interopDefault($9hpsb$react))).createElement("div", {
32
32
  role: "row",
33
- "aria-hidden": dropIndicatorProps["aria-hidden"]
33
+ "aria-hidden": dropIndicatorProps['aria-hidden']
34
34
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($9hpsb$react))).createElement("div", {
35
35
  role: "gridcell",
36
36
  "aria-selected": "false",
37
- className: (0, $9hpsb$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListViewInsertionIndicator", {
38
- "react-spectrum-ListViewInsertionIndicator--dropTarget": isDropTarget
37
+ className: (0, $9hpsb$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewInsertionIndicator', {
38
+ 'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget
39
39
  })
40
40
  }, !isPresentationOnly && /*#__PURE__*/ (0, ($parcel$interopDefault($9hpsb$react))).createElement("div", {
41
41
  ...visuallyHiddenProps,
package/dist/InsertionIndicator.mjs CHANGED
@@ -21,15 +21,15 @@ function $0a834ddbc989a3e3$export$2e2bcd8739ae039(props) {
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);
24
- if (!isDropTarget && dropIndicatorProps["aria-hidden"]) return null;
24
+ if (!isDropTarget && dropIndicatorProps['aria-hidden']) return null;
25
25
  return /*#__PURE__*/ (0, $8djIL$react).createElement("div", {
26
26
  role: "row",
27
- "aria-hidden": dropIndicatorProps["aria-hidden"]
27
+ "aria-hidden": dropIndicatorProps['aria-hidden']
28
28
  }, /*#__PURE__*/ (0, $8djIL$react).createElement("div", {
29
29
  role: "gridcell",
30
30
  "aria-selected": "false",
31
- className: (0, $8djIL$classNames)((0, ($parcel$interopDefault($8djIL$styles_cssmodulejs))), "react-spectrum-ListViewInsertionIndicator", {
32
- "react-spectrum-ListViewInsertionIndicator--dropTarget": isDropTarget
31
+ className: (0, $8djIL$classNames)((0, ($parcel$interopDefault($8djIL$styles_cssmodulejs))), 'react-spectrum-ListViewInsertionIndicator', {
32
+ 'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget
33
33
  })
34
34
  }, !isPresentationOnly && /*#__PURE__*/ (0, $8djIL$react).createElement("div", {
35
35
  ...visuallyHiddenProps,
package/dist/InsertionIndicator.module.js CHANGED
@@ -21,15 +21,15 @@ function $0a834ddbc989a3e3$export$2e2bcd8739ae039(props) {
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);
24
- if (!isDropTarget && dropIndicatorProps["aria-hidden"]) return null;
24
+ if (!isDropTarget && dropIndicatorProps['aria-hidden']) return null;
25
25
  return /*#__PURE__*/ (0, $8djIL$react).createElement("div", {
26
26
  role: "row",
27
- "aria-hidden": dropIndicatorProps["aria-hidden"]
27
+ "aria-hidden": dropIndicatorProps['aria-hidden']
28
28
  }, /*#__PURE__*/ (0, $8djIL$react).createElement("div", {
29
29
  role: "gridcell",
30
30
  "aria-selected": "false",
31
- className: (0, $8djIL$classNames)((0, ($parcel$interopDefault($8djIL$styles_cssmodulejs))), "react-spectrum-ListViewInsertionIndicator", {
32
- "react-spectrum-ListViewInsertionIndicator--dropTarget": isDropTarget
31
+ className: (0, $8djIL$classNames)((0, ($parcel$interopDefault($8djIL$styles_cssmodulejs))), 'react-spectrum-ListViewInsertionIndicator', {
32
+ 'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget
33
33
  })
34
34
  }, !isPresentationOnly && /*#__PURE__*/ (0, $8djIL$react).createElement("div", {
35
35
  ...visuallyHiddenProps,
package/dist/ListView.main.js CHANGED
@@ -73,8 +73,8 @@ const $60684b441be8e84c$var$ROW_HEIGHTS = {
73
73
  function $60684b441be8e84c$var$useListLayout(state, density, overflowMode) {
74
74
  let { scale: scale } = (0, $8lawJ$reactspectrumprovider.useProvider)();
75
75
  let collator = (0, $8lawJ$reactariai18n.useCollator)({
76
- usage: "search",
77
- sensitivity: "base"
76
+ usage: 'search',
77
+ sensitivity: 'base'
78
78
  });
79
79
  let isEmpty = state.collection.size === 0;
80
80
  let layout = (0, $8lawJ$react.useMemo)(()=>new (0, $8lawJ$reactstatelylayout.ListLayout)({
@@ -95,14 +95,14 @@ function $60684b441be8e84c$var$useListLayout(state, density, overflowMode) {
95
95
  }
96
96
  function $60684b441be8e84c$var$ListView(props, ref) {
97
97
  var _dropState_target;
98
- let { density: density = "regular", loadingState: loadingState, onLoadMore: onLoadMore, isQuiet: isQuiet, overflowMode: overflowMode = "truncate", onAction: onAction, dragAndDropHooks: dragAndDropHooks, ...otherProps } = props;
98
+ let { density: density = 'regular', loadingState: loadingState, onLoadMore: onLoadMore, isQuiet: isQuiet, overflowMode: overflowMode = 'truncate', onAction: onAction, dragAndDropHooks: dragAndDropHooks, ...otherProps } = props;
99
99
  let isListDraggable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDraggableCollectionState);
100
100
  let isListDroppable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDroppableCollectionState);
101
101
  let dragHooksProvided = (0, $8lawJ$react.useRef)(isListDraggable);
102
102
  let dropHooksProvided = (0, $8lawJ$react.useRef)(isListDroppable);
103
103
  (0, $8lawJ$react.useEffect)(()=>{
104
- if (dragHooksProvided.current !== isListDraggable) console.warn("Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.");
105
- if (dropHooksProvided.current !== isListDroppable) console.warn("Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.");
104
+ if (dragHooksProvided.current !== isListDraggable) console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
105
+ if (dropHooksProvided.current !== isListDroppable) console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
106
106
  }, [
107
107
  isListDraggable,
108
108
  isListDroppable
@@ -110,11 +110,11 @@ function $60684b441be8e84c$var$ListView(props, ref) {
110
110
  let domRef = (0, $8lawJ$reactspectrumutils.useDOMRef)(ref);
111
111
  let state = (0, $8lawJ$reactstatelylist.useListState)({
112
112
  ...props,
113
- selectionBehavior: props.selectionStyle === "highlight" ? "replace" : "toggle"
113
+ selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'
114
114
  });
115
115
  let { collection: collection, selectionManager: selectionManager } = state;
116
- let stringFormatter = (0, $8lawJ$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($2ebea2d8da6d3b78$exports))), "@react-spectrum/list");
117
- let isLoading = loadingState === "loading" || loadingState === "loadingMore";
116
+ let stringFormatter = (0, $8lawJ$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($2ebea2d8da6d3b78$exports))), '@react-spectrum/list');
117
+ let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';
118
118
  let { styleProps: styleProps } = (0, $8lawJ$reactspectrumutils.useStyleProps)(props);
119
119
  let dragState;
120
120
  let preview = (0, $8lawJ$react.useRef)(null);
@@ -126,9 +126,9 @@ function $60684b441be8e84c$var$ListView(props, ref) {
126
126
  });
127
127
  dragAndDropHooks.useDraggableCollection({}, dragState, domRef);
128
128
  }
129
- let layout = $60684b441be8e84c$var$useListLayout(state, props.density || "regular", overflowMode);
129
+ let layout = $60684b441be8e84c$var$useListLayout(state, props.density || 'regular', overflowMode);
130
130
  // !!0 is false, so we can cast size or undefined and they'll be falsy
131
- layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === "selection" || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
131
+ layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
132
132
  let DragPreview = dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.DragPreview;
133
133
  let dropState;
134
134
  let droppableCollection;
@@ -143,7 +143,7 @@ function $60684b441be8e84c$var$ListView(props, ref) {
143
143
  dropTargetDelegate: layout
144
144
  }, dropState, domRef);
145
145
  isRootDropTarget = dropState.isDropTarget({
146
- type: "root"
146
+ type: 'root'
147
147
  });
148
148
  }
149
149
  let { gridProps: gridProps } = (0, $8lawJ$reactariagridlist.useGridList)({
@@ -155,7 +155,7 @@ function $60684b441be8e84c$var$ListView(props, ref) {
155
155
  // Sync loading state into the layout.
156
156
  layout.isLoading = isLoading;
157
157
  let focusedKey = selectionManager.focusedKey;
158
- if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === "item") focusedKey = dropState.target.key;
158
+ if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === 'item') focusedKey = dropState.target.key;
159
159
  // wait for layout to get accurate measurements
160
160
  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = (0, $8lawJ$react.useState)(false);
161
161
  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = (0, $8lawJ$react.useState)(false);
@@ -185,7 +185,7 @@ function $60684b441be8e84c$var$ListView(props, ref) {
185
185
  loadingState: loadingState
186
186
  }
187
187
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, $8lawJ$reactariafocus.FocusScope), null, /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, $8lawJ$reactariafocus.FocusRing), {
188
- focusRingClass: (0, $8lawJ$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "focus-ring")
188
+ focusRingClass: (0, $8lawJ$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'focus-ring')
189
189
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, $8lawJ$reactariavirtualizer.Virtualizer), {
190
190
  ...(0, $8lawJ$reactariautils.mergeProps)(isListDroppable && (droppableCollection === null || droppableCollection === void 0 ? void 0 : droppableCollection.collectionProps), gridProps),
191
191
  ...(0, $8lawJ$reactariautils.filterDOMProps)(otherProps),
@@ -196,47 +196,47 @@ function $60684b441be8e84c$var$ListView(props, ref) {
196
196
  ref: domRef,
197
197
  focusedKey: focusedKey,
198
198
  scrollDirection: "vertical",
199
- className: (0, $8lawJ$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListView", `react-spectrum-ListView--${density}`, "react-spectrum-ListView--emphasized", {
200
- "react-spectrum-ListView--quiet": isQuiet,
201
- "react-spectrum-ListView--loadingMore": loadingState === "loadingMore",
202
- "react-spectrum-ListView--draggable": !!isListDraggable,
203
- "react-spectrum-ListView--dropTarget": !!isRootDropTarget,
204
- "react-spectrum-ListView--isVerticalScrollbarVisible": isVerticalScrollbarVisible,
205
- "react-spectrum-ListView--isHorizontalScrollbarVisible": isHorizontalScrollbarVisible,
206
- "react-spectrum-ListView--hasAnyChildren": hasAnyChildren,
207
- "react-spectrum-ListView--wrap": overflowMode === "wrap"
199
+ className: (0, $8lawJ$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListView', `react-spectrum-ListView--${density}`, 'react-spectrum-ListView--emphasized', {
200
+ 'react-spectrum-ListView--quiet': isQuiet,
201
+ 'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',
202
+ 'react-spectrum-ListView--draggable': !!isListDraggable,
203
+ 'react-spectrum-ListView--dropTarget': !!isRootDropTarget,
204
+ 'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,
205
+ 'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,
206
+ 'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,
207
+ 'react-spectrum-ListView--wrap': overflowMode === 'wrap'
208
208
  }, styleProps.className),
209
209
  layout: layout,
210
210
  collection: collection,
211
211
  transitionDuration: isLoading ? 160 : 220
212
212
  }, (type, item)=>{
213
- if (type === "item") return /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, ($parcel$interopDefault($8lawJ$react))).Fragment, null, isListDroppable && collection.getKeyBefore(item.key) == null && /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, ($parcel$interopDefault($c59d3898f402f50b$exports))), {
213
+ if (type === 'item') return /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, ($parcel$interopDefault($8lawJ$react))).Fragment, null, isListDroppable && collection.getKeyBefore(item.key) == null && /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, $c59d3898f402f50b$exports.default), {
214
214
  key: "root"
215
- }), isListDroppable && /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, ($parcel$interopDefault($fc02fd49ab58c72e$exports))), {
215
+ }), isListDroppable && /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, $fc02fd49ab58c72e$exports.default), {
216
216
  key: `${item.key}-before`,
217
217
  target: {
218
218
  key: item.key,
219
- type: "item",
220
- dropPosition: "before"
219
+ type: 'item',
220
+ dropPosition: 'before'
221
221
  }
222
222
  }), /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, $9eae7a1cb1535a6b$exports.ListViewItem), {
223
223
  item: item,
224
224
  isEmphasized: true,
225
225
  hasActions: !!onAction
226
- }), isListDroppable && /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, ($parcel$interopDefault($fc02fd49ab58c72e$exports))), {
226
+ }), isListDroppable && /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, $fc02fd49ab58c72e$exports.default), {
227
227
  key: `${item.key}-after`,
228
228
  target: {
229
229
  key: item.key,
230
- type: "item",
231
- dropPosition: "after"
230
+ type: 'item',
231
+ dropPosition: 'after'
232
232
  },
233
233
  isPresentationOnly: collection.getKeyAfter(item.key) != null
234
234
  }));
235
- else if (type === "loader") return /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement($60684b441be8e84c$var$CenteredWrapper, null, /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, $8lawJ$reactspectrumprogress.ProgressCircle), {
235
+ else if (type === 'loader') return /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement($60684b441be8e84c$var$CenteredWrapper, null, /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement((0, $8lawJ$reactspectrumprogress.ProgressCircle), {
236
236
  isIndeterminate: true,
237
- "aria-label": collection.size > 0 ? stringFormatter.format("loadingMore") : stringFormatter.format("loading")
237
+ "aria-label": collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')
238
238
  }));
239
- else if (type === "placeholder") {
239
+ else if (type === 'placeholder') {
240
240
  let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
241
241
  if (emptyState == null) return null;
242
242
  return /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement($60684b441be8e84c$var$CenteredWrapper, null, emptyState);
@@ -261,8 +261,8 @@ function $60684b441be8e84c$var$CenteredWrapper({ children: children }) {
261
261
  return /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement("div", {
262
262
  role: "row",
263
263
  "aria-rowindex": state.collection.size + 1,
264
- className: (0, $8lawJ$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListView-centeredWrapper", {
265
- "react-spectrum-ListView-centeredWrapper--loadingMore": state.collection.size > 0
264
+ className: (0, $8lawJ$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListView-centeredWrapper', {
265
+ 'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0
266
266
  })
267
267
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($8lawJ$react))).createElement("div", {
268
268
  role: "gridcell"
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, 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, 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 AriaGridListProps<T>, 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}\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 ...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 stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\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 // Sync loading state into the layout.\n layout.isLoading = isLoading;\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}}>\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 collection={collection}\n transitionDuration={isLoading ? 160 : 220}>\n {(type, item) => {\n if (type === 'item') {\n return (\n <>\n {isListDroppable && 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={collection.getKeyAfter(item.key) != null} />\n }\n </>\n );\n } else if (type === 'loader') {\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n } else if (type === 'placeholder') {\n let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n }\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 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, 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, 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 AriaGridListProps<T>, 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}\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 ...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 stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\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 // Sync loading state into the layout.\n layout.isLoading = isLoading;\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}}>\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 collection={collection}\n transitionDuration={isLoading ? 160 : 220}>\n {(type, item) => {\n if (type === 'item') {\n return (\n <>\n {isListDroppable && 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={collection.getKeyAfter(item.key) != null} />\n }\n </>\n );\n } else if (type === 'loader') {\n return (\n <CenteredWrapper>\n <ProgressCircle\n isIndeterminate\n aria-label={collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n </CenteredWrapper>\n );\n } else if (type === 'placeholder') {\n let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;\n if (emptyState == null) {\n return null;\n }\n\n return (\n <CenteredWrapper>\n {emptyState}\n </CenteredWrapper>\n );\n }\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 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"}