@react-spectrum/list 3.10.11 → 3.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (229) hide show
  1. package/dist/import.mjs +3 -3
  2. package/dist/main.js +4 -4
  3. package/dist/main.js.map +1 -1
  4. package/dist/module.js +3 -3
  5. package/dist/module.js.map +1 -1
  6. package/dist/types/src/index.d.ts +3 -0
  7. package/package.json +13 -50
  8. package/src/index.ts +4 -3
  9. package/dist/DragPreview.main.js +0 -79
  10. package/dist/DragPreview.main.js.map +0 -1
  11. package/dist/DragPreview.mjs +0 -74
  12. package/dist/DragPreview.module.js +0 -74
  13. package/dist/DragPreview.module.js.map +0 -1
  14. package/dist/InsertionIndicator.main.js +0 -49
  15. package/dist/InsertionIndicator.main.js.map +0 -1
  16. package/dist/InsertionIndicator.mjs +0 -44
  17. package/dist/InsertionIndicator.module.js +0 -44
  18. package/dist/InsertionIndicator.module.js.map +0 -1
  19. package/dist/ListView.main.js +0 -300
  20. package/dist/ListView.main.js.map +0 -1
  21. package/dist/ListView.mjs +0 -294
  22. package/dist/ListView.module.js +0 -294
  23. package/dist/ListView.module.js.map +0 -1
  24. package/dist/ListViewItem.main.js +0 -245
  25. package/dist/ListViewItem.main.js.map +0 -1
  26. package/dist/ListViewItem.mjs +0 -240
  27. package/dist/ListViewItem.module.js +0 -240
  28. package/dist/ListViewItem.module.js.map +0 -1
  29. package/dist/ListViewLayout.main.js +0 -69
  30. package/dist/ListViewLayout.main.js.map +0 -1
  31. package/dist/ListViewLayout.mjs +0 -64
  32. package/dist/ListViewLayout.module.js +0 -64
  33. package/dist/ListViewLayout.module.js.map +0 -1
  34. package/dist/RootDropIndicator.main.js +0 -46
  35. package/dist/RootDropIndicator.main.js.map +0 -1
  36. package/dist/RootDropIndicator.mjs +0 -37
  37. package/dist/RootDropIndicator.module.js +0 -37
  38. package/dist/RootDropIndicator.module.js.map +0 -1
  39. package/dist/ar-AE.main.js +0 -7
  40. package/dist/ar-AE.main.js.map +0 -1
  41. package/dist/ar-AE.mjs +0 -9
  42. package/dist/ar-AE.module.js +0 -9
  43. package/dist/ar-AE.module.js.map +0 -1
  44. package/dist/bg-BG.main.js +0 -7
  45. package/dist/bg-BG.main.js.map +0 -1
  46. package/dist/bg-BG.mjs +0 -9
  47. package/dist/bg-BG.module.js +0 -9
  48. package/dist/bg-BG.module.js.map +0 -1
  49. package/dist/cs-CZ.main.js +0 -7
  50. package/dist/cs-CZ.main.js.map +0 -1
  51. package/dist/cs-CZ.mjs +0 -9
  52. package/dist/cs-CZ.module.js +0 -9
  53. package/dist/cs-CZ.module.js.map +0 -1
  54. package/dist/da-DK.main.js +0 -7
  55. package/dist/da-DK.main.js.map +0 -1
  56. package/dist/da-DK.mjs +0 -9
  57. package/dist/da-DK.module.js +0 -9
  58. package/dist/da-DK.module.js.map +0 -1
  59. package/dist/de-DE.main.js +0 -7
  60. package/dist/de-DE.main.js.map +0 -1
  61. package/dist/de-DE.mjs +0 -9
  62. package/dist/de-DE.module.js +0 -9
  63. package/dist/de-DE.module.js.map +0 -1
  64. package/dist/el-GR.main.js +0 -7
  65. package/dist/el-GR.main.js.map +0 -1
  66. package/dist/el-GR.mjs +0 -9
  67. package/dist/el-GR.module.js +0 -9
  68. package/dist/el-GR.module.js.map +0 -1
  69. package/dist/en-US.main.js +0 -7
  70. package/dist/en-US.main.js.map +0 -1
  71. package/dist/en-US.mjs +0 -9
  72. package/dist/en-US.module.js +0 -9
  73. package/dist/en-US.module.js.map +0 -1
  74. package/dist/es-ES.main.js +0 -7
  75. package/dist/es-ES.main.js.map +0 -1
  76. package/dist/es-ES.mjs +0 -9
  77. package/dist/es-ES.module.js +0 -9
  78. package/dist/es-ES.module.js.map +0 -1
  79. package/dist/et-EE.main.js +0 -7
  80. package/dist/et-EE.main.js.map +0 -1
  81. package/dist/et-EE.mjs +0 -9
  82. package/dist/et-EE.module.js +0 -9
  83. package/dist/et-EE.module.js.map +0 -1
  84. package/dist/fi-FI.main.js +0 -7
  85. package/dist/fi-FI.main.js.map +0 -1
  86. package/dist/fi-FI.mjs +0 -9
  87. package/dist/fi-FI.module.js +0 -9
  88. package/dist/fi-FI.module.js.map +0 -1
  89. package/dist/fr-FR.main.js +0 -7
  90. package/dist/fr-FR.main.js.map +0 -1
  91. package/dist/fr-FR.mjs +0 -9
  92. package/dist/fr-FR.module.js +0 -9
  93. package/dist/fr-FR.module.js.map +0 -1
  94. package/dist/he-IL.main.js +0 -7
  95. package/dist/he-IL.main.js.map +0 -1
  96. package/dist/he-IL.mjs +0 -9
  97. package/dist/he-IL.module.js +0 -9
  98. package/dist/he-IL.module.js.map +0 -1
  99. package/dist/hr-HR.main.js +0 -7
  100. package/dist/hr-HR.main.js.map +0 -1
  101. package/dist/hr-HR.mjs +0 -9
  102. package/dist/hr-HR.module.js +0 -9
  103. package/dist/hr-HR.module.js.map +0 -1
  104. package/dist/hu-HU.main.js +0 -7
  105. package/dist/hu-HU.main.js.map +0 -1
  106. package/dist/hu-HU.mjs +0 -9
  107. package/dist/hu-HU.module.js +0 -9
  108. package/dist/hu-HU.module.js.map +0 -1
  109. package/dist/intlStrings.main.js +0 -108
  110. package/dist/intlStrings.main.js.map +0 -1
  111. package/dist/intlStrings.mjs +0 -110
  112. package/dist/intlStrings.module.js +0 -110
  113. package/dist/intlStrings.module.js.map +0 -1
  114. package/dist/it-IT.main.js +0 -7
  115. package/dist/it-IT.main.js.map +0 -1
  116. package/dist/it-IT.mjs +0 -9
  117. package/dist/it-IT.module.js +0 -9
  118. package/dist/it-IT.module.js.map +0 -1
  119. package/dist/ja-JP.main.js +0 -7
  120. package/dist/ja-JP.main.js.map +0 -1
  121. package/dist/ja-JP.mjs +0 -9
  122. package/dist/ja-JP.module.js +0 -9
  123. package/dist/ja-JP.module.js.map +0 -1
  124. package/dist/ko-KR.main.js +0 -7
  125. package/dist/ko-KR.main.js.map +0 -1
  126. package/dist/ko-KR.mjs +0 -9
  127. package/dist/ko-KR.module.js +0 -9
  128. package/dist/ko-KR.module.js.map +0 -1
  129. package/dist/list.5918e378.css +0 -839
  130. package/dist/list.5918e378.css.map +0 -1
  131. package/dist/lt-LT.main.js +0 -7
  132. package/dist/lt-LT.main.js.map +0 -1
  133. package/dist/lt-LT.mjs +0 -9
  134. package/dist/lt-LT.module.js +0 -9
  135. package/dist/lt-LT.module.js.map +0 -1
  136. package/dist/lv-LV.main.js +0 -7
  137. package/dist/lv-LV.main.js.map +0 -1
  138. package/dist/lv-LV.mjs +0 -9
  139. package/dist/lv-LV.module.js +0 -9
  140. package/dist/lv-LV.module.js.map +0 -1
  141. package/dist/nb-NO.main.js +0 -7
  142. package/dist/nb-NO.main.js.map +0 -1
  143. package/dist/nb-NO.mjs +0 -9
  144. package/dist/nb-NO.module.js +0 -9
  145. package/dist/nb-NO.module.js.map +0 -1
  146. package/dist/nl-NL.main.js +0 -7
  147. package/dist/nl-NL.main.js.map +0 -1
  148. package/dist/nl-NL.mjs +0 -9
  149. package/dist/nl-NL.module.js +0 -9
  150. package/dist/nl-NL.module.js.map +0 -1
  151. package/dist/pl-PL.main.js +0 -7
  152. package/dist/pl-PL.main.js.map +0 -1
  153. package/dist/pl-PL.mjs +0 -9
  154. package/dist/pl-PL.module.js +0 -9
  155. package/dist/pl-PL.module.js.map +0 -1
  156. package/dist/pt-BR.main.js +0 -7
  157. package/dist/pt-BR.main.js.map +0 -1
  158. package/dist/pt-BR.mjs +0 -9
  159. package/dist/pt-BR.module.js +0 -9
  160. package/dist/pt-BR.module.js.map +0 -1
  161. package/dist/pt-PT.main.js +0 -7
  162. package/dist/pt-PT.main.js.map +0 -1
  163. package/dist/pt-PT.mjs +0 -9
  164. package/dist/pt-PT.module.js +0 -9
  165. package/dist/pt-PT.module.js.map +0 -1
  166. package/dist/ro-RO.main.js +0 -7
  167. package/dist/ro-RO.main.js.map +0 -1
  168. package/dist/ro-RO.mjs +0 -9
  169. package/dist/ro-RO.module.js +0 -9
  170. package/dist/ro-RO.module.js.map +0 -1
  171. package/dist/ru-RU.main.js +0 -7
  172. package/dist/ru-RU.main.js.map +0 -1
  173. package/dist/ru-RU.mjs +0 -9
  174. package/dist/ru-RU.module.js +0 -9
  175. package/dist/ru-RU.module.js.map +0 -1
  176. package/dist/sk-SK.main.js +0 -7
  177. package/dist/sk-SK.main.js.map +0 -1
  178. package/dist/sk-SK.mjs +0 -9
  179. package/dist/sk-SK.module.js +0 -9
  180. package/dist/sk-SK.module.js.map +0 -1
  181. package/dist/sl-SI.main.js +0 -7
  182. package/dist/sl-SI.main.js.map +0 -1
  183. package/dist/sl-SI.mjs +0 -9
  184. package/dist/sl-SI.module.js +0 -9
  185. package/dist/sl-SI.module.js.map +0 -1
  186. package/dist/sr-SP.main.js +0 -7
  187. package/dist/sr-SP.main.js.map +0 -1
  188. package/dist/sr-SP.mjs +0 -9
  189. package/dist/sr-SP.module.js +0 -9
  190. package/dist/sr-SP.module.js.map +0 -1
  191. package/dist/styles_css.main.js +0 -197
  192. package/dist/styles_css.main.js.map +0 -1
  193. package/dist/styles_css.mjs +0 -199
  194. package/dist/styles_css.module.js +0 -199
  195. package/dist/styles_css.module.js.map +0 -1
  196. package/dist/sv-SE.main.js +0 -7
  197. package/dist/sv-SE.main.js.map +0 -1
  198. package/dist/sv-SE.mjs +0 -9
  199. package/dist/sv-SE.module.js +0 -9
  200. package/dist/sv-SE.module.js.map +0 -1
  201. package/dist/tr-TR.main.js +0 -7
  202. package/dist/tr-TR.main.js.map +0 -1
  203. package/dist/tr-TR.mjs +0 -9
  204. package/dist/tr-TR.module.js +0 -9
  205. package/dist/tr-TR.module.js.map +0 -1
  206. package/dist/types.d.ts +0 -40
  207. package/dist/types.d.ts.map +0 -1
  208. package/dist/uk-UA.main.js +0 -7
  209. package/dist/uk-UA.main.js.map +0 -1
  210. package/dist/uk-UA.mjs +0 -9
  211. package/dist/uk-UA.module.js +0 -9
  212. package/dist/uk-UA.module.js.map +0 -1
  213. package/dist/zh-CN.main.js +0 -7
  214. package/dist/zh-CN.main.js.map +0 -1
  215. package/dist/zh-CN.mjs +0 -9
  216. package/dist/zh-CN.module.js +0 -9
  217. package/dist/zh-CN.module.js.map +0 -1
  218. package/dist/zh-TW.main.js +0 -7
  219. package/dist/zh-TW.main.js.map +0 -1
  220. package/dist/zh-TW.mjs +0 -9
  221. package/dist/zh-TW.module.js +0 -9
  222. package/dist/zh-TW.module.js.map +0 -1
  223. package/src/DragPreview.tsx +0 -72
  224. package/src/InsertionIndicator.tsx +0 -46
  225. package/src/ListView.tsx +0 -356
  226. package/src/ListViewItem.tsx +0 -284
  227. package/src/ListViewLayout.ts +0 -66
  228. package/src/RootDropIndicator.tsx +0 -27
  229. package/src/styles.css +0 -720
@@ -1,294 +0,0 @@
1
- import $0a834ddbc989a3e3$export$2e2bcd8739ae039 from "./InsertionIndicator.module.js";
2
- import $6w3ZV$intlStringsmodulejs from "./intlStrings.module.js";
3
- import "./list.5918e378.css";
4
- import $6w3ZV$styles_cssmodulejs from "./styles_css.module.js";
5
- import {ListViewItem as $d7c07ca2efc5ba02$export$c6bde0c04b033c0e} from "./ListViewItem.module.js";
6
- import {ListViewLayout as $bc6cc67dd6240ebd$export$dab781655dfbb7d3} from "./ListViewLayout.module.js";
7
- import $41a60729487a82d7$export$2e2bcd8739ae039 from "./RootDropIndicator.module.js";
8
- import {DragPreview as $cd61e55c47e3c0f5$export$905ab40ac2179daa} from "./DragPreview.module.js";
9
- import {useGridList as $6w3ZV$useGridList} from "@react-aria/gridlist";
10
- import {useDOMRef as $6w3ZV$useDOMRef, useStyleProps as $6w3ZV$useStyleProps, classNames as $6w3ZV$classNames} from "@react-spectrum/utils";
11
- import {useLayoutEffect as $6w3ZV$useLayoutEffect, mergeProps as $6w3ZV$mergeProps, filterDOMProps as $6w3ZV$filterDOMProps} from "@react-aria/utils";
12
- import {FocusScope as $6w3ZV$FocusScope, FocusRing as $6w3ZV$FocusRing} from "@react-aria/focus";
13
- import {ListKeyboardDelegate as $6w3ZV$ListKeyboardDelegate} from "@react-aria/selection";
14
- import {useListState as $6w3ZV$useListState} from "@react-stately/list";
15
- import {ProgressCircle as $6w3ZV$ProgressCircle} from "@react-spectrum/progress";
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";
17
- import {useLocalizedStringFormatter as $6w3ZV$useLocalizedStringFormatter} from "@react-aria/i18n";
18
- import {useProvider as $6w3ZV$useProvider} from "@react-spectrum/provider";
19
- import {Virtualizer as $6w3ZV$Virtualizer} from "@react-aria/virtualizer";
20
-
21
-
22
- function $parcel$interopDefault(a) {
23
- return a && a.__esModule ? a.default : a;
24
- }
25
- /*
26
- * Copyright 2021 Adobe. All rights reserved.
27
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
28
- * you may not use this file except in compliance with the License. You may obtain a copy
29
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
30
- *
31
- * Unless required by applicable law or agreed to in writing, software distributed under
32
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
33
- * OF ANY KIND, either express or implied. See the License for the specific language
34
- * governing permissions and limitations under the License.
35
- */
36
-
37
-
38
-
39
-
40
-
41
-
42
-
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
-
52
-
53
- const $f85fb77f9d4cbc6c$export$870039b0abfe3de0 = /*#__PURE__*/ (0, $6w3ZV$react).createContext(null);
54
- const $f85fb77f9d4cbc6c$var$ROW_HEIGHTS = {
55
- compact: {
56
- medium: 32,
57
- large: 40
58
- },
59
- regular: {
60
- medium: 40,
61
- large: 50
62
- },
63
- spacious: {
64
- medium: 48,
65
- large: 60
66
- }
67
- };
68
- function $f85fb77f9d4cbc6c$var$useListLayout(state, density, overflowMode) {
69
- let { scale: scale } = (0, $6w3ZV$useProvider)();
70
- let layout = (0, $6w3ZV$useMemo)(()=>new (0, $bc6cc67dd6240ebd$export$dab781655dfbb7d3)({
71
- estimatedRowHeight: $f85fb77f9d4cbc6c$var$ROW_HEIGHTS[density || 'regular'][scale]
72
- }), [
73
- scale,
74
- density,
75
- overflowMode
76
- ]);
77
- return layout;
78
- }
79
- const $f85fb77f9d4cbc6c$export$84d0dd190d551cd1 = /*#__PURE__*/ (0, $6w3ZV$react).forwardRef(function ListView(props, ref) {
80
- var _dropState_target;
81
- let { density: density = 'regular', loadingState: loadingState, onLoadMore: onLoadMore, isQuiet: isQuiet, overflowMode: overflowMode = 'truncate', onAction: onAction, dragAndDropHooks: dragAndDropHooks, renderEmptyState: renderEmptyState, ...otherProps } = props;
82
- let isListDraggable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDraggableCollectionState);
83
- let isListDroppable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDroppableCollectionState);
84
- let dragHooksProvided = (0, $6w3ZV$useRef)(isListDraggable);
85
- let dropHooksProvided = (0, $6w3ZV$useRef)(isListDroppable);
86
- (0, $6w3ZV$useEffect)(()=>{
87
- if (dragHooksProvided.current !== isListDraggable && process.env.NODE_ENV !== 'production') console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
88
- if (dropHooksProvided.current !== isListDroppable && process.env.NODE_ENV !== 'production') console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
89
- }, [
90
- isListDraggable,
91
- isListDroppable
92
- ]);
93
- let domRef = (0, $6w3ZV$useDOMRef)(ref);
94
- let state = (0, $6w3ZV$useListState)({
95
- ...props,
96
- selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'
97
- });
98
- let { collection: collection, selectionManager: selectionManager } = state;
99
- let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';
100
- let { styleProps: styleProps } = (0, $6w3ZV$useStyleProps)(props);
101
- let dragState = null;
102
- let preview = (0, $6w3ZV$useRef)(null);
103
- if (isListDraggable && dragAndDropHooks) {
104
- dragState = dragAndDropHooks.useDraggableCollectionState({
105
- collection: collection,
106
- selectionManager: selectionManager,
107
- preview: preview
108
- });
109
- dragAndDropHooks.useDraggableCollection({}, dragState, domRef);
110
- }
111
- let layout = $f85fb77f9d4cbc6c$var$useListLayout(state, props.density || 'regular', overflowMode);
112
- let DragPreview = dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.DragPreview;
113
- let dropState = null;
114
- let droppableCollection = null;
115
- let isRootDropTarget = false;
116
- if (isListDroppable && dragAndDropHooks) {
117
- dropState = dragAndDropHooks.useDroppableCollectionState({
118
- collection: collection,
119
- selectionManager: selectionManager
120
- });
121
- droppableCollection = dragAndDropHooks.useDroppableCollection({
122
- keyboardDelegate: new (0, $6w3ZV$ListKeyboardDelegate)({
123
- collection: collection,
124
- disabledKeys: (dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size) ? undefined : selectionManager.disabledKeys,
125
- ref: domRef,
126
- layoutDelegate: layout
127
- }),
128
- dropTargetDelegate: layout
129
- }, dropState, domRef);
130
- isRootDropTarget = dropState.isDropTarget({
131
- type: 'root'
132
- });
133
- }
134
- let { gridProps: gridProps } = (0, $6w3ZV$useGridList)({
135
- ...props,
136
- isVirtualized: true,
137
- layoutDelegate: layout,
138
- onAction: onAction
139
- }, state, domRef);
140
- let focusedKey = selectionManager.focusedKey;
141
- let dropTargetKey = null;
142
- if ((dropState === null || dropState === void 0 ? void 0 : (_dropState_target = dropState.target) === null || _dropState_target === void 0 ? void 0 : _dropState_target.type) === 'item') {
143
- dropTargetKey = dropState.target.key;
144
- var _state_collection_getKeyAfter;
145
- if (dropState.target.dropPosition === 'after') // Normalize to the "before" drop position since we only render those in the DOM.
146
- dropTargetKey = (_state_collection_getKeyAfter = state.collection.getKeyAfter(dropTargetKey)) !== null && _state_collection_getKeyAfter !== void 0 ? _state_collection_getKeyAfter : dropTargetKey;
147
- }
148
- let persistedKeys = (0, $6w3ZV$useMemo)(()=>{
149
- return new Set([
150
- focusedKey,
151
- dropTargetKey
152
- ].filter((k)=>k !== null));
153
- }, [
154
- focusedKey,
155
- dropTargetKey
156
- ]);
157
- // wait for layout to get accurate measurements
158
- let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = (0, $6w3ZV$useState)(false);
159
- let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = (0, $6w3ZV$useState)(false);
160
- // eslint-disable-next-line react-hooks/exhaustive-deps
161
- (0, $6w3ZV$useLayoutEffect)(()=>{
162
- if (domRef.current) {
163
- // 2 is the width of the border which is not part of the box size
164
- setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);
165
- setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);
166
- }
167
- });
168
- let hasAnyChildren = (0, $6w3ZV$useMemo)(()=>[
169
- ...collection
170
- ].some((item)=>item.hasChildNodes), [
171
- collection
172
- ]);
173
- return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$export$870039b0abfe3de0.Provider, {
174
- value: {
175
- state: state,
176
- dragState: dragState,
177
- dropState: dropState,
178
- dragAndDropHooks: dragAndDropHooks,
179
- onAction: onAction,
180
- isListDraggable: isListDraggable,
181
- isListDroppable: isListDroppable,
182
- layout: layout,
183
- loadingState: loadingState,
184
- renderEmptyState: renderEmptyState
185
- }
186
- }, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$FocusScope), null, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$FocusRing), {
187
- focusRingClass: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'focus-ring')
188
- }, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$Virtualizer), {
189
- ...(0, $6w3ZV$mergeProps)(isListDroppable ? droppableCollection === null || droppableCollection === void 0 ? void 0 : droppableCollection.collectionProps : null, gridProps),
190
- ...(0, $6w3ZV$filterDOMProps)(otherProps),
191
- ...gridProps,
192
- ...styleProps,
193
- isLoading: isLoading,
194
- onLoadMore: onLoadMore,
195
- ref: domRef,
196
- persistedKeys: persistedKeys,
197
- scrollDirection: "vertical",
198
- className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'react-spectrum-ListView', `react-spectrum-ListView--${density}`, 'react-spectrum-ListView--emphasized', {
199
- 'react-spectrum-ListView--quiet': isQuiet,
200
- 'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',
201
- 'react-spectrum-ListView--draggable': !!isListDraggable,
202
- 'react-spectrum-ListView--dropTarget': !!isRootDropTarget,
203
- 'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,
204
- 'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,
205
- 'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,
206
- 'react-spectrum-ListView--wrap': overflowMode === 'wrap'
207
- }, styleProps.className),
208
- layout: layout,
209
- layoutOptions: (0, $6w3ZV$useMemo)(()=>({
210
- isLoading: isLoading
211
- }), [
212
- isLoading
213
- ]),
214
- collection: collection
215
- }, (0, $6w3ZV$useCallback)((type, item)=>{
216
- if (type === 'item') return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$Item, {
217
- item: item
218
- });
219
- else if (type === 'loader') return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$LoadingView, null);
220
- else if (type === 'placeholder') return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$EmptyState, null);
221
- }, [])))), DragPreview && isListDraggable && dragAndDropHooks && dragState && /*#__PURE__*/ (0, $6w3ZV$react).createElement(DragPreview, {
222
- ref: preview
223
- }, ()=>{
224
- var _layout_getLayoutInfo;
225
- if (dragState.draggedKey == null) return null;
226
- if (dragAndDropHooks.renderPreview) return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);
227
- let item = state.collection.getItem(dragState.draggedKey);
228
- if (!item) return null;
229
- let itemCount = dragState.draggingKeys.size;
230
- var _layout_getLayoutInfo_rect_height;
231
- let itemHeight = (_layout_getLayoutInfo_rect_height = (_layout_getLayoutInfo = layout.getLayoutInfo(dragState.draggedKey)) === null || _layout_getLayoutInfo === void 0 ? void 0 : _layout_getLayoutInfo.rect.height) !== null && _layout_getLayoutInfo_rect_height !== void 0 ? _layout_getLayoutInfo_rect_height : 0;
232
- return /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $cd61e55c47e3c0f5$export$905ab40ac2179daa), {
233
- item: item,
234
- itemCount: itemCount,
235
- itemHeight: itemHeight,
236
- density: density
237
- });
238
- }));
239
- });
240
- function $f85fb77f9d4cbc6c$var$Item({ item: item }) {
241
- let { isListDroppable: isListDroppable, state: state, onAction: onAction } = (0, $6w3ZV$useContext)($f85fb77f9d4cbc6c$export$870039b0abfe3de0);
242
- return /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$react).Fragment, null, isListDroppable && state.collection.getKeyBefore(item.key) == null && /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $41a60729487a82d7$export$2e2bcd8739ae039), {
243
- key: "root"
244
- }), isListDroppable && /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $0a834ddbc989a3e3$export$2e2bcd8739ae039), {
245
- key: `${item.key}-before`,
246
- target: {
247
- key: item.key,
248
- type: 'item',
249
- dropPosition: 'before'
250
- }
251
- }), /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $d7c07ca2efc5ba02$export$c6bde0c04b033c0e), {
252
- item: item,
253
- isEmphasized: true,
254
- hasActions: !!onAction
255
- }), isListDroppable && /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $0a834ddbc989a3e3$export$2e2bcd8739ae039), {
256
- key: `${item.key}-after`,
257
- target: {
258
- key: item.key,
259
- type: 'item',
260
- dropPosition: 'after'
261
- },
262
- isPresentationOnly: state.collection.getKeyAfter(item.key) != null
263
- }));
264
- }
265
- function $f85fb77f9d4cbc6c$var$LoadingView() {
266
- let { state: state } = (0, $6w3ZV$useContext)($f85fb77f9d4cbc6c$export$870039b0abfe3de0);
267
- let stringFormatter = (0, $6w3ZV$useLocalizedStringFormatter)((0, ($parcel$interopDefault($6w3ZV$intlStringsmodulejs))), '@react-spectrum/list');
268
- return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$ProgressCircle), {
269
- isIndeterminate: true,
270
- "aria-label": state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')
271
- }));
272
- }
273
- function $f85fb77f9d4cbc6c$var$EmptyState() {
274
- let { renderEmptyState: renderEmptyState } = (0, $6w3ZV$useContext)($f85fb77f9d4cbc6c$export$870039b0abfe3de0);
275
- let emptyState = renderEmptyState ? renderEmptyState() : null;
276
- if (emptyState == null) return null;
277
- return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, emptyState);
278
- }
279
- function $f85fb77f9d4cbc6c$var$CenteredWrapper({ children: children }) {
280
- let { state: state } = (0, $6w3ZV$useContext)($f85fb77f9d4cbc6c$export$870039b0abfe3de0);
281
- return /*#__PURE__*/ (0, $6w3ZV$react).createElement("div", {
282
- role: "row",
283
- "aria-rowindex": state.collection.size + 1,
284
- className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'react-spectrum-ListView-centeredWrapper', {
285
- 'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0
286
- })
287
- }, /*#__PURE__*/ (0, $6w3ZV$react).createElement("div", {
288
- role: "gridcell"
289
- }, children));
290
- }
291
-
292
-
293
- export {$f85fb77f9d4cbc6c$export$870039b0abfe3de0 as ListViewContext, $f85fb77f9d4cbc6c$export$84d0dd190d551cd1 as ListView};
294
- //# sourceMappingURL=ListView.module.js.map
@@ -1 +0,0 @@
1
- {"mappings":"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","sources":["packages/@react-spectrum/list/src/ListView.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaGridListProps, useGridList} from '@react-aria/gridlist';\nimport {AsyncLoadable, DOMRef, Key, LoadingState, Node, SpectrumSelectionProps, StyleProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport type {DragAndDropHooks} from '@react-spectrum/dnd';\nimport type {DraggableCollectionState, DroppableCollectionState} from '@react-stately/dnd';\nimport type {DroppableCollectionResult} from '@react-aria/dnd';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {FocusRing, FocusScope} from '@react-aria/focus';\nimport InsertionIndicator from './InsertionIndicator';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate} from '@react-aria/selection';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\nimport {ListViewLayout} from './ListViewLayout';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport RootDropIndicator from './RootDropIndicator';\nimport {DragPreview as SpectrumDragPreview} from './DragPreview';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer} from '@react-aria/virtualizer';\n\nexport interface SpectrumListViewProps<T> extends Omit<AriaGridListProps<T>, 'keyboardNavigationBehavior'>, StyleProps, SpectrumSelectionProps, Omit<AsyncLoadable, 'isLoading'> {\n /**\n * Sets the amount of vertical padding within each cell.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the ListView should be displayed with a quiet style. */\n isQuiet?: boolean,\n /** The current loading state of the ListView. Determines whether or not the progress circle should be shown. */\n loadingState?: LoadingState,\n /**\n * Sets the text behavior for the row contents.\n * @default 'truncate'\n */\n overflowMode?: 'truncate' | 'wrap',\n /** Sets what the ListView should render when there is no content to display. */\n renderEmptyState?: () => JSX.Element,\n /**\n * Handler that is called when a user performs an action on an item. The exact user event depends on\n * the collection's `selectionStyle` prop and the interaction modality.\n */\n onAction?: (key: Key) => void,\n /**\n * The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListView.\n */\n dragAndDropHooks?: DragAndDropHooks<NoInfer<T>>['dragAndDropHooks']\n}\n\ninterface ListViewContextValue<T> {\n state: ListState<T>,\n dragState: DraggableCollectionState | null,\n dropState: DroppableCollectionState | null,\n dragAndDropHooks?: DragAndDropHooks<T>['dragAndDropHooks'],\n onAction?: (key: Key) => void,\n isListDraggable: boolean,\n isListDroppable: boolean,\n layout: ListViewLayout<T>,\n loadingState?: LoadingState,\n renderEmptyState?: () => JSX.Element\n}\n\nexport const ListViewContext = React.createContext<ListViewContextValue<unknown> | null>(null);\n\nconst ROW_HEIGHTS = {\n compact: {\n medium: 32,\n large: 40\n },\n regular: {\n medium: 40,\n large: 50\n },\n spacious: {\n medium: 48,\n large: 60\n }\n};\n\nfunction useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {\n let {scale} = useProvider();\n let layout = useMemo(() =>\n new ListViewLayout<T>({\n estimatedRowHeight: ROW_HEIGHTS[density || 'regular'][scale]\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n , [scale, density, overflowMode]);\n\n return layout;\n}\n\n/**\n * A ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.\n */\nexport const ListView = React.forwardRef(function 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 && process.env.NODE_ENV !== 'production') {\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 && process.env.NODE_ENV !== 'production') {\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 | null = null;\n let preview = useRef(null);\n if (isListDraggable && dragAndDropHooks) {\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 | null = null;\n let droppableCollection: DroppableCollectionResult | null = null;\n let isRootDropTarget = false;\n if (isListDroppable && dragAndDropHooks) {\n dropState = dragAndDropHooks.useDroppableCollectionState!({\n collection,\n selectionManager\n });\n droppableCollection = dragAndDropHooks.useDroppableCollection!({\n keyboardDelegate: new ListKeyboardDelegate({\n collection,\n disabledKeys: dragState?.draggingKeys.size ? undefined : selectionManager.disabledKeys,\n ref: domRef,\n layoutDelegate: layout\n }),\n dropTargetDelegate: layout\n }, dropState, domRef);\n\n isRootDropTarget = dropState.isDropTarget({type: 'root'});\n }\n\n let {gridProps} = useGridList({\n ...props,\n isVirtualized: true,\n layoutDelegate: layout,\n onAction\n }, state, domRef);\n\n let focusedKey = selectionManager.focusedKey;\n let dropTargetKey: Key | null = null;\n if (dropState?.target?.type === 'item') {\n dropTargetKey = dropState.target.key;\n if (dropState.target.dropPosition === 'after') {\n // Normalize to the \"before\" drop position since we only render those in the DOM.\n dropTargetKey = state.collection.getKeyAfter(dropTargetKey) ?? dropTargetKey;\n }\n }\n\n let persistedKeys = useMemo(() => {\n return new Set([focusedKey, dropTargetKey].filter(k => k !== null));\n }, [focusedKey, dropTargetKey]);\n\n // wait for layout to get accurate measurements\n let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);\n let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n useLayoutEffect(() => {\n if (domRef.current) {\n // 2 is the width of the border which is not part of the box size\n setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);\n setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);\n }\n });\n\n let hasAnyChildren = useMemo(() => [...collection].some(item => item.hasChildNodes), [collection]);\n\n return (\n <ListViewContext.Provider value={{state, dragState, dropState, dragAndDropHooks, onAction, isListDraggable, isListDroppable, layout, loadingState, renderEmptyState}}>\n <FocusScope>\n <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n <Virtualizer\n {...mergeProps(isListDroppable ? droppableCollection?.collectionProps : null, gridProps)}\n {...filterDOMProps(otherProps)}\n {...gridProps}\n {...styleProps}\n isLoading={isLoading}\n onLoadMore={onLoadMore}\n ref={domRef}\n persistedKeys={persistedKeys}\n scrollDirection=\"vertical\"\n className={\n classNames(\n listStyles,\n 'react-spectrum-ListView',\n `react-spectrum-ListView--${density}`,\n 'react-spectrum-ListView--emphasized',\n {\n 'react-spectrum-ListView--quiet': isQuiet,\n 'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',\n 'react-spectrum-ListView--draggable': !!isListDraggable,\n 'react-spectrum-ListView--dropTarget': !!isRootDropTarget,\n 'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,\n 'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,\n 'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,\n 'react-spectrum-ListView--wrap': overflowMode === 'wrap'\n },\n styleProps.className\n )\n }\n layout={layout}\n layoutOptions={useMemo(() => ({isLoading}), [isLoading])}\n collection={collection}>\n {useCallback((type, item: Node<T>) => {\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 && dragAndDropHooks && dragState &&\n <DragPreview ref={preview}>\n {() => {\n if (dragState.draggedKey == null) {\n return null;\n }\n if (dragAndDropHooks.renderPreview) {\n return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);\n }\n let item = state.collection.getItem(dragState.draggedKey);\n if (!item) {\n return null;\n }\n let itemCount = dragState.draggingKeys.size;\n let itemHeight = layout.getLayoutInfo(dragState.draggedKey)?.rect.height ?? 0;\n return <SpectrumDragPreview item={item} itemCount={itemCount} itemHeight={itemHeight} density={density} />;\n }}\n </DragPreview>\n }\n </ListViewContext.Provider>\n );\n}) as <T>(props: SpectrumListViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\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"],"names":[],"version":3,"file":"ListView.module.js.map"}
@@ -1,245 +0,0 @@
1
- require("./list.5918e378.css");
2
- var $279507a6f189e509$exports = require("./styles_css.main.js");
3
- var $60684b441be8e84c$exports = require("./ListView.main.js");
4
- var $5Mbbg$reactspectrumcheckbox = require("@react-spectrum/checkbox");
5
- var $5Mbbg$spectrumiconsuiChevronLeftMedium = require("@spectrum-icons/ui/ChevronLeftMedium");
6
- var $5Mbbg$spectrumiconsuiChevronRightMedium = require("@spectrum-icons/ui/ChevronRightMedium");
7
- var $5Mbbg$reactspectrumutils = require("@react-spectrum/utils");
8
- var $5Mbbg$reacttransitiongroup = require("react-transition-group");
9
- var $5Mbbg$reactariafocus = require("@react-aria/focus");
10
- var $5Mbbg$reactspectrumlayout = require("@react-spectrum/layout");
11
- var $5Mbbg$reactariainteractions = require("@react-aria/interactions");
12
- var $5Mbbg$spectrumiconsuiListGripper = require("@spectrum-icons/ui/ListGripper");
13
- var $5Mbbg$reactariautils = require("@react-aria/utils");
14
- var $5Mbbg$reactspectrumprovider = require("@react-spectrum/provider");
15
- var $5Mbbg$react = require("react");
16
- var $5Mbbg$reactspectrumtext = require("@react-spectrum/text");
17
- var $5Mbbg$reactariabutton = require("@react-aria/button");
18
- var $5Mbbg$reactariagridlist = require("@react-aria/gridlist");
19
- var $5Mbbg$reactariai18n = require("@react-aria/i18n");
20
- var $5Mbbg$reactariavisuallyhidden = require("@react-aria/visually-hidden");
21
-
22
-
23
- function $parcel$interopDefault(a) {
24
- return a && a.__esModule ? a.default : a;
25
- }
26
-
27
- function $parcel$export(e, n, v, s) {
28
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
29
- }
30
-
31
- $parcel$export(module.exports, "ListViewItem", () => $9eae7a1cb1535a6b$export$c6bde0c04b033c0e);
32
- /*
33
- * Copyright 2021 Adobe. All rights reserved.
34
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
35
- * you may not use this file except in compliance with the License. You may obtain a copy
36
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
37
- *
38
- * Unless required by applicable law or agreed to in writing, software distributed under
39
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
40
- * OF ANY KIND, either express or implied. See the License for the specific language
41
- * governing permissions and limitations under the License.
42
- */
43
-
44
-
45
-
46
-
47
-
48
-
49
-
50
-
51
-
52
-
53
-
54
-
55
-
56
-
57
-
58
-
59
-
60
-
61
- function $9eae7a1cb1535a6b$export$c6bde0c04b033c0e(props) {
62
- var _dragAndDropHooks_isVirtualDragging, _layout_getContentSize, _layout_virtualizer;
63
- let { item: item, isEmphasized: isEmphasized } = props;
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
- let { direction: direction } = (0, $5Mbbg$reactariai18n.useLocale)();
66
- let rowRef = (0, $5Mbbg$react.useRef)(null);
67
- let checkboxWrapperRef = (0, $5Mbbg$react.useRef)(null);
68
- let { isFocusVisible: isFocusVisibleWithin, focusProps: focusWithinProps } = (0, $5Mbbg$reactariafocus.useFocusRing)({
69
- within: true
70
- });
71
- let { isFocusVisible: isFocusVisible, focusProps: focusProps } = (0, $5Mbbg$reactariafocus.useFocusRing)();
72
- let { rowProps: rowProps, gridCellProps: gridCellProps, isPressed: isPressed, descriptionProps: descriptionProps, isSelected: isSelected, isDisabled: isDisabled, allowsSelection: allowsSelection, hasAction: hasAction } = (0, $5Mbbg$reactariagridlist.useGridListItem)({
73
- node: item,
74
- isVirtualized: true,
75
- shouldSelectOnPressUp: isListDraggable
76
- }, state, rowRef);
77
- let { hoverProps: hoverProps, isHovered: isHovered } = (0, $5Mbbg$reactariainteractions.useHover)({
78
- isDisabled: !allowsSelection && !hasAction
79
- });
80
- let { checkboxProps: checkboxProps } = (0, $5Mbbg$reactariagridlist.useGridListSelectionCheckbox)({
81
- key: item.key
82
- }, state);
83
- let hasDescription = (0, $5Mbbg$reactspectrumutils.useHasChild)(`.${(0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-description']}`, rowRef);
84
- let draggableItem = null;
85
- if (isListDraggable && dragAndDropHooks && dragState) {
86
- draggableItem = dragAndDropHooks.useDraggableItem({
87
- key: item.key,
88
- hasDragButton: true
89
- }, dragState);
90
- if (isDisabled) draggableItem = null;
91
- }
92
- let isDropTarget = false;
93
- let dropIndicator = null;
94
- let dropIndicatorRef = (0, $5Mbbg$react.useRef)(null);
95
- if (isListDroppable && dragAndDropHooks && dropState) {
96
- let target = {
97
- type: 'item',
98
- key: item.key,
99
- dropPosition: 'on'
100
- };
101
- isDropTarget = dropState.isDropTarget(target);
102
- dropIndicator = dragAndDropHooks.useDropIndicator({
103
- target: target
104
- }, dropState, dropIndicatorRef);
105
- }
106
- let dragButtonRef = (0, ($parcel$interopDefault($5Mbbg$react))).useRef(null);
107
- let { buttonProps: buttonProps } = (0, $5Mbbg$reactariabutton.useButton)({
108
- ...draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragButtonProps,
109
- elementType: 'div'
110
- }, dragButtonRef);
111
- let chevron = direction === 'ltr' ? /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, ($parcel$interopDefault($5Mbbg$spectrumiconsuiChevronRightMedium))), {
112
- "aria-hidden": "true",
113
- UNSAFE_className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem-parentIndicator', {
114
- 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,
115
- 'is-disabled': !hasAction
116
- })
117
- }) : /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, ($parcel$interopDefault($5Mbbg$spectrumiconsuiChevronLeftMedium))), {
118
- "aria-hidden": "true",
119
- UNSAFE_className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem-parentIndicator', {
120
- 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,
121
- 'is-disabled': !hasAction
122
- })
123
- });
124
- let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';
125
- let { visuallyHiddenProps: visuallyHiddenProps } = (0, $5Mbbg$reactariavisuallyhidden.useVisuallyHidden)();
126
- const mergedProps = (0, $5Mbbg$reactariautils.mergeProps)(rowProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, hoverProps, focusWithinProps, focusProps);
127
- // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,
128
- // allowing for single swipe navigation between row drop indicator
129
- if (dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : (_dragAndDropHooks_isVirtualDragging = dragAndDropHooks.isVirtualDragging) === null || _dragAndDropHooks_isVirtualDragging === void 0 ? void 0 : _dragAndDropHooks_isVirtualDragging.call(dragAndDropHooks)) mergedProps.tabIndex = undefined;
130
- let isFirstRow = item.prevKey == null;
131
- let isLastRow = item.nextKey == null;
132
- // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom
133
- // 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
134
- // with bottom border
135
- let isFlushWithContainerBottom = false;
136
- var _layout_virtualizer_visibleRect_height;
137
- if (isLastRow && loadingState !== 'loadingMore') {
138
- if (((_layout_getContentSize = layout.getContentSize()) === null || _layout_getContentSize === void 0 ? void 0 : _layout_getContentSize.height) >= ((_layout_virtualizer_visibleRect_height = (_layout_virtualizer = layout.virtualizer) === null || _layout_virtualizer === void 0 ? void 0 : _layout_virtualizer.visibleRect.height) !== null && _layout_virtualizer_visibleRect_height !== void 0 ? _layout_virtualizer_visibleRect_height : 0)) isFlushWithContainerBottom = true;
139
- }
140
- // previous item isn't selected
141
- // 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
142
- let roundTops = !(item.prevKey != null && state.selectionManager.isSelected(item.prevKey)) && (state.selectionManager.focusedKey !== item.prevKey || !((0, $5Mbbg$reactariainteractions.isFocusVisible)() && state.selectionManager.isFocused));
143
- let roundBottoms = !(item.nextKey != null && state.selectionManager.isSelected(item.nextKey)) && (state.selectionManager.focusedKey !== item.nextKey || !((0, $5Mbbg$reactariainteractions.isFocusVisible)() && state.selectionManager.isFocused));
144
- let content = typeof item.rendered === 'string' ? /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumtext.Text), null, item.rendered) : item.rendered;
145
- if (isDisabled) content = /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumprovider.Provider), {
146
- isDisabled: true
147
- }, content);
148
- return /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
149
- ...mergedProps,
150
- className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListView-row', {
151
- 'focus-ring': isFocusVisible,
152
- 'round-tops': roundTops || isHovered && !isSelected && state.selectionManager.focusedKey !== item.key,
153
- 'round-bottoms': roundBottoms || isHovered && !isSelected && state.selectionManager.focusedKey !== item.key
154
- }),
155
- ref: rowRef
156
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
157
- // TODO: refactor the css here now that we are focusing the row?
158
- className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem', {
159
- 'is-active': isPressed,
160
- 'is-focused': isFocusVisibleWithin,
161
- 'focus-ring': isFocusVisible,
162
- 'is-hovered': isHovered,
163
- 'is-selected': isSelected,
164
- 'is-disabled': isDisabled,
165
- 'is-prev-selected': item.prevKey != null && state.selectionManager.isSelected(item.prevKey),
166
- 'is-next-selected': item.nextKey != null && state.selectionManager.isSelected(item.nextKey),
167
- 'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || item.nextKey != null && state.selectionManager.isSelected(item.nextKey)),
168
- 'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,
169
- 'react-spectrum-ListViewItem--firstRow': isFirstRow,
170
- 'react-spectrum-ListViewItem--lastRow': isLastRow,
171
- 'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,
172
- 'react-spectrum-ListViewItem--hasDescription': hasDescription
173
- }),
174
- ...gridCellProps
175
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumlayout.Grid), {
176
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-grid']
177
- }, isListDraggable && /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
178
- className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-draghandle-container']
179
- }, !isDisabled && /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactariafocus.FocusRing), {
180
- focusRingClass: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'focus-ring')
181
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
182
- ...buttonProps,
183
- className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem-draghandle-button'),
184
- style: !isFocusVisibleWithin ? {
185
- ...visuallyHiddenProps.style
186
- } : {},
187
- ref: dragButtonRef,
188
- draggable: "true"
189
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, ($parcel$interopDefault($5Mbbg$spectrumiconsuiListGripper))), null)))), isListDroppable && !(dropIndicator === null || dropIndicator === void 0 ? void 0 : dropIndicator.isHidden) && /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
190
- role: "button",
191
- ...visuallyHiddenProps,
192
- ...dropIndicator === null || dropIndicator === void 0 ? void 0 : dropIndicator.dropIndicatorProps,
193
- ref: dropIndicatorRef
194
- }), /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reacttransitiongroup.CSSTransition), {
195
- in: showCheckbox,
196
- unmountOnExit: true,
197
- classNames: {
198
- enter: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox--enter'],
199
- enterActive: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox--enterActive'],
200
- exit: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox--exit'],
201
- exitActive: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox--exitActive']
202
- },
203
- timeout: 160,
204
- nodeRef: checkboxWrapperRef
205
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
206
- ref: checkboxWrapperRef,
207
- className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkboxWrapper']
208
- }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumcheckbox.Checkbox), {
209
- ...checkboxProps,
210
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox'],
211
- isEmphasized: isEmphasized
212
- }))), /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumutils.SlotProvider), {
213
- slots: {
214
- text: {
215
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-content']
216
- },
217
- description: {
218
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-description'],
219
- ...descriptionProps
220
- },
221
- illustration: {
222
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-thumbnail']
223
- },
224
- image: {
225
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-thumbnail']
226
- },
227
- actionButton: {
228
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-actions'],
229
- isQuiet: true
230
- },
231
- actionGroup: {
232
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-actions'],
233
- isQuiet: true,
234
- density: 'compact'
235
- },
236
- actionMenu: {
237
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-actionmenu'],
238
- isQuiet: true
239
- }
240
- }
241
- }, content, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumutils.ClearSlots), null, chevron)))));
242
- }
243
-
244
-
245
- //# sourceMappingURL=ListViewItem.main.js.map
@@ -1 +0,0 @@
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} 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, {JSX, 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>): JSX.Element {\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 | null>(null);\n let checkboxWrapperRef = useRef<HTMLDivElement | null>(null);\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 {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 | null = null;\n if (isListDraggable && dragAndDropHooks && dragState) {\n\n draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasDragButton: true}, dragState);\n if (isDisabled) {\n draggableItem = null;\n }\n }\n let isDropTarget = false;\n let dropIndicator: DropIndicatorAria | null = null;\n let dropIndicatorRef = useRef<HTMLDivElement | null>(null);\n if (isListDroppable && dragAndDropHooks && dropState) {\n let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;\n isDropTarget = dropState.isDropTarget(target);\n\n dropIndicator = dragAndDropHooks.useDropIndicator!({target}, dropState, dropIndicatorRef);\n }\n\n let dragButtonRef = React.useRef<HTMLDivElement | null>(null);\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 const mergedProps = mergeProps(\n rowProps,\n draggableItem?.dragProps,\n hoverProps,\n focusWithinProps,\n focusProps\n );\n\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 if (dragAndDropHooks?.isVirtualDragging?.()) {\n mergedProps.tabIndex = undefined;\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 ?? 0)) {\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 = (!(item.prevKey != null && state.selectionManager.isSelected(item.prevKey))\n && (state.selectionManager.focusedKey !== item.prevKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n let roundBottoms = (!(item.nextKey != null && 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': item.prevKey != null && state.selectionManager.isSelected(item.prevKey),\n 'is-next-selected': item.nextKey != null && state.selectionManager.isSelected(item.nextKey),\n 'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || (item.nextKey != null && 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"}