@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/ListView.mjs CHANGED
@@ -66,8 +66,8 @@ const $f85fb77f9d4cbc6c$var$ROW_HEIGHTS = {
66
66
  function $f85fb77f9d4cbc6c$var$useListLayout(state, density, overflowMode) {
67
67
  let { scale: scale } = (0, $6w3ZV$useProvider)();
68
68
  let collator = (0, $6w3ZV$useCollator)({
69
- usage: "search",
70
- sensitivity: "base"
69
+ usage: 'search',
70
+ sensitivity: 'base'
71
71
  });
72
72
  let isEmpty = state.collection.size === 0;
73
73
  let layout = (0, $6w3ZV$useMemo)(()=>new (0, $6w3ZV$ListLayout)({
@@ -88,14 +88,14 @@ function $f85fb77f9d4cbc6c$var$useListLayout(state, density, overflowMode) {
88
88
  }
89
89
  function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
90
90
  var _dropState_target;
91
- let { density: density = "regular", loadingState: loadingState, onLoadMore: onLoadMore, isQuiet: isQuiet, overflowMode: overflowMode = "truncate", onAction: onAction, dragAndDropHooks: dragAndDropHooks, ...otherProps } = props;
91
+ let { density: density = 'regular', loadingState: loadingState, onLoadMore: onLoadMore, isQuiet: isQuiet, overflowMode: overflowMode = 'truncate', onAction: onAction, dragAndDropHooks: dragAndDropHooks, ...otherProps } = props;
92
92
  let isListDraggable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDraggableCollectionState);
93
93
  let isListDroppable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDroppableCollectionState);
94
94
  let dragHooksProvided = (0, $6w3ZV$useRef)(isListDraggable);
95
95
  let dropHooksProvided = (0, $6w3ZV$useRef)(isListDroppable);
96
96
  (0, $6w3ZV$useEffect)(()=>{
97
- 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.");
98
- 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.");
97
+ 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.');
98
+ 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.');
99
99
  }, [
100
100
  isListDraggable,
101
101
  isListDroppable
@@ -103,11 +103,11 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
103
103
  let domRef = (0, $6w3ZV$useDOMRef)(ref);
104
104
  let state = (0, $6w3ZV$useListState)({
105
105
  ...props,
106
- selectionBehavior: props.selectionStyle === "highlight" ? "replace" : "toggle"
106
+ selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'
107
107
  });
108
108
  let { collection: collection, selectionManager: selectionManager } = state;
109
- let stringFormatter = (0, $6w3ZV$useLocalizedStringFormatter)((0, ($parcel$interopDefault($6w3ZV$intlStringsmodulejs))), "@react-spectrum/list");
110
- let isLoading = loadingState === "loading" || loadingState === "loadingMore";
109
+ let stringFormatter = (0, $6w3ZV$useLocalizedStringFormatter)((0, ($parcel$interopDefault($6w3ZV$intlStringsmodulejs))), '@react-spectrum/list');
110
+ let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';
111
111
  let { styleProps: styleProps } = (0, $6w3ZV$useStyleProps)(props);
112
112
  let dragState;
113
113
  let preview = (0, $6w3ZV$useRef)(null);
@@ -119,9 +119,9 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
119
119
  });
120
120
  dragAndDropHooks.useDraggableCollection({}, dragState, domRef);
121
121
  }
122
- let layout = $f85fb77f9d4cbc6c$var$useListLayout(state, props.density || "regular", overflowMode);
122
+ let layout = $f85fb77f9d4cbc6c$var$useListLayout(state, props.density || 'regular', overflowMode);
123
123
  // !!0 is false, so we can cast size or undefined and they'll be falsy
124
- layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === "selection" || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
124
+ layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
125
125
  let DragPreview = dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.DragPreview;
126
126
  let dropState;
127
127
  let droppableCollection;
@@ -136,7 +136,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
136
136
  dropTargetDelegate: layout
137
137
  }, dropState, domRef);
138
138
  isRootDropTarget = dropState.isDropTarget({
139
- type: "root"
139
+ type: 'root'
140
140
  });
141
141
  }
142
142
  let { gridProps: gridProps } = (0, $6w3ZV$useGridList)({
@@ -148,7 +148,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
148
148
  // Sync loading state into the layout.
149
149
  layout.isLoading = isLoading;
150
150
  let focusedKey = selectionManager.focusedKey;
151
- 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;
151
+ 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;
152
152
  // wait for layout to get accurate measurements
153
153
  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = (0, $6w3ZV$useState)(false);
154
154
  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = (0, $6w3ZV$useState)(false);
@@ -178,7 +178,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
178
178
  loadingState: loadingState
179
179
  }
180
180
  }, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$FocusScope), null, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$FocusRing), {
181
- focusRingClass: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), "focus-ring")
181
+ focusRingClass: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'focus-ring')
182
182
  }, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$Virtualizer), {
183
183
  ...(0, $6w3ZV$mergeProps)(isListDroppable && (droppableCollection === null || droppableCollection === void 0 ? void 0 : droppableCollection.collectionProps), gridProps),
184
184
  ...(0, $6w3ZV$filterDOMProps)(otherProps),
@@ -189,28 +189,28 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
189
189
  ref: domRef,
190
190
  focusedKey: focusedKey,
191
191
  scrollDirection: "vertical",
192
- className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), "react-spectrum-ListView", `react-spectrum-ListView--${density}`, "react-spectrum-ListView--emphasized", {
193
- "react-spectrum-ListView--quiet": isQuiet,
194
- "react-spectrum-ListView--loadingMore": loadingState === "loadingMore",
195
- "react-spectrum-ListView--draggable": !!isListDraggable,
196
- "react-spectrum-ListView--dropTarget": !!isRootDropTarget,
197
- "react-spectrum-ListView--isVerticalScrollbarVisible": isVerticalScrollbarVisible,
198
- "react-spectrum-ListView--isHorizontalScrollbarVisible": isHorizontalScrollbarVisible,
199
- "react-spectrum-ListView--hasAnyChildren": hasAnyChildren,
200
- "react-spectrum-ListView--wrap": overflowMode === "wrap"
192
+ className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'react-spectrum-ListView', `react-spectrum-ListView--${density}`, 'react-spectrum-ListView--emphasized', {
193
+ 'react-spectrum-ListView--quiet': isQuiet,
194
+ 'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',
195
+ 'react-spectrum-ListView--draggable': !!isListDraggable,
196
+ 'react-spectrum-ListView--dropTarget': !!isRootDropTarget,
197
+ 'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,
198
+ 'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,
199
+ 'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,
200
+ 'react-spectrum-ListView--wrap': overflowMode === 'wrap'
201
201
  }, styleProps.className),
202
202
  layout: layout,
203
203
  collection: collection,
204
204
  transitionDuration: isLoading ? 160 : 220
205
205
  }, (type, item)=>{
206
- if (type === "item") return /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$react).Fragment, null, isListDroppable && collection.getKeyBefore(item.key) == null && /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $41a60729487a82d7$export$2e2bcd8739ae039), {
206
+ if (type === 'item') return /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$react).Fragment, null, isListDroppable && collection.getKeyBefore(item.key) == null && /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $41a60729487a82d7$export$2e2bcd8739ae039), {
207
207
  key: "root"
208
208
  }), isListDroppable && /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $0a834ddbc989a3e3$export$2e2bcd8739ae039), {
209
209
  key: `${item.key}-before`,
210
210
  target: {
211
211
  key: item.key,
212
- type: "item",
213
- dropPosition: "before"
212
+ type: 'item',
213
+ dropPosition: 'before'
214
214
  }
215
215
  }), /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $d7c07ca2efc5ba02$export$c6bde0c04b033c0e), {
216
216
  item: item,
@@ -220,16 +220,16 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
220
220
  key: `${item.key}-after`,
221
221
  target: {
222
222
  key: item.key,
223
- type: "item",
224
- dropPosition: "after"
223
+ type: 'item',
224
+ dropPosition: 'after'
225
225
  },
226
226
  isPresentationOnly: collection.getKeyAfter(item.key) != null
227
227
  }));
228
- else if (type === "loader") return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$ProgressCircle), {
228
+ else if (type === 'loader') return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$ProgressCircle), {
229
229
  isIndeterminate: true,
230
- "aria-label": collection.size > 0 ? stringFormatter.format("loadingMore") : stringFormatter.format("loading")
230
+ "aria-label": collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')
231
231
  }));
232
- else if (type === "placeholder") {
232
+ else if (type === 'placeholder') {
233
233
  let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
234
234
  if (emptyState == null) return null;
235
235
  return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, emptyState);
@@ -254,8 +254,8 @@ function $f85fb77f9d4cbc6c$var$CenteredWrapper({ children: children }) {
254
254
  return /*#__PURE__*/ (0, $6w3ZV$react).createElement("div", {
255
255
  role: "row",
256
256
  "aria-rowindex": state.collection.size + 1,
257
- className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), "react-spectrum-ListView-centeredWrapper", {
258
- "react-spectrum-ListView-centeredWrapper--loadingMore": state.collection.size > 0
257
+ className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'react-spectrum-ListView-centeredWrapper', {
258
+ 'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0
259
259
  })
260
260
  }, /*#__PURE__*/ (0, $6w3ZV$react).createElement("div", {
261
261
  role: "gridcell"
package/dist/ListView.module.js CHANGED
@@ -66,8 +66,8 @@ const $f85fb77f9d4cbc6c$var$ROW_HEIGHTS = {
66
66
  function $f85fb77f9d4cbc6c$var$useListLayout(state, density, overflowMode) {
67
67
  let { scale: scale } = (0, $6w3ZV$useProvider)();
68
68
  let collator = (0, $6w3ZV$useCollator)({
69
- usage: "search",
70
- sensitivity: "base"
69
+ usage: 'search',
70
+ sensitivity: 'base'
71
71
  });
72
72
  let isEmpty = state.collection.size === 0;
73
73
  let layout = (0, $6w3ZV$useMemo)(()=>new (0, $6w3ZV$ListLayout)({
@@ -88,14 +88,14 @@ function $f85fb77f9d4cbc6c$var$useListLayout(state, density, overflowMode) {
88
88
  }
89
89
  function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
90
90
  var _dropState_target;
91
- let { density: density = "regular", loadingState: loadingState, onLoadMore: onLoadMore, isQuiet: isQuiet, overflowMode: overflowMode = "truncate", onAction: onAction, dragAndDropHooks: dragAndDropHooks, ...otherProps } = props;
91
+ let { density: density = 'regular', loadingState: loadingState, onLoadMore: onLoadMore, isQuiet: isQuiet, overflowMode: overflowMode = 'truncate', onAction: onAction, dragAndDropHooks: dragAndDropHooks, ...otherProps } = props;
92
92
  let isListDraggable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDraggableCollectionState);
93
93
  let isListDroppable = !!(dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.useDroppableCollectionState);
94
94
  let dragHooksProvided = (0, $6w3ZV$useRef)(isListDraggable);
95
95
  let dropHooksProvided = (0, $6w3ZV$useRef)(isListDroppable);
96
96
  (0, $6w3ZV$useEffect)(()=>{
97
- 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.");
98
- 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.");
97
+ 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.');
98
+ 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.');
99
99
  }, [
100
100
  isListDraggable,
101
101
  isListDroppable
@@ -103,11 +103,11 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
103
103
  let domRef = (0, $6w3ZV$useDOMRef)(ref);
104
104
  let state = (0, $6w3ZV$useListState)({
105
105
  ...props,
106
- selectionBehavior: props.selectionStyle === "highlight" ? "replace" : "toggle"
106
+ selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'
107
107
  });
108
108
  let { collection: collection, selectionManager: selectionManager } = state;
109
- let stringFormatter = (0, $6w3ZV$useLocalizedStringFormatter)((0, ($parcel$interopDefault($6w3ZV$intlStringsmodulejs))), "@react-spectrum/list");
110
- let isLoading = loadingState === "loading" || loadingState === "loadingMore";
109
+ let stringFormatter = (0, $6w3ZV$useLocalizedStringFormatter)((0, ($parcel$interopDefault($6w3ZV$intlStringsmodulejs))), '@react-spectrum/list');
110
+ let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';
111
111
  let { styleProps: styleProps } = (0, $6w3ZV$useStyleProps)(props);
112
112
  let dragState;
113
113
  let preview = (0, $6w3ZV$useRef)(null);
@@ -119,9 +119,9 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
119
119
  });
120
120
  dragAndDropHooks.useDraggableCollection({}, dragState, domRef);
121
121
  }
122
- let layout = $f85fb77f9d4cbc6c$var$useListLayout(state, props.density || "regular", overflowMode);
122
+ let layout = $f85fb77f9d4cbc6c$var$useListLayout(state, props.density || 'regular', overflowMode);
123
123
  // !!0 is false, so we can cast size or undefined and they'll be falsy
124
- layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === "selection" || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
124
+ layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
125
125
  let DragPreview = dragAndDropHooks === null || dragAndDropHooks === void 0 ? void 0 : dragAndDropHooks.DragPreview;
126
126
  let dropState;
127
127
  let droppableCollection;
@@ -136,7 +136,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
136
136
  dropTargetDelegate: layout
137
137
  }, dropState, domRef);
138
138
  isRootDropTarget = dropState.isDropTarget({
139
- type: "root"
139
+ type: 'root'
140
140
  });
141
141
  }
142
142
  let { gridProps: gridProps } = (0, $6w3ZV$useGridList)({
@@ -148,7 +148,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
148
148
  // Sync loading state into the layout.
149
149
  layout.isLoading = isLoading;
150
150
  let focusedKey = selectionManager.focusedKey;
151
- 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;
151
+ 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;
152
152
  // wait for layout to get accurate measurements
153
153
  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = (0, $6w3ZV$useState)(false);
154
154
  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = (0, $6w3ZV$useState)(false);
@@ -178,7 +178,7 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
178
178
  loadingState: loadingState
179
179
  }
180
180
  }, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$FocusScope), null, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$FocusRing), {
181
- focusRingClass: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), "focus-ring")
181
+ focusRingClass: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'focus-ring')
182
182
  }, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$Virtualizer), {
183
183
  ...(0, $6w3ZV$mergeProps)(isListDroppable && (droppableCollection === null || droppableCollection === void 0 ? void 0 : droppableCollection.collectionProps), gridProps),
184
184
  ...(0, $6w3ZV$filterDOMProps)(otherProps),
@@ -189,28 +189,28 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
189
189
  ref: domRef,
190
190
  focusedKey: focusedKey,
191
191
  scrollDirection: "vertical",
192
- className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), "react-spectrum-ListView", `react-spectrum-ListView--${density}`, "react-spectrum-ListView--emphasized", {
193
- "react-spectrum-ListView--quiet": isQuiet,
194
- "react-spectrum-ListView--loadingMore": loadingState === "loadingMore",
195
- "react-spectrum-ListView--draggable": !!isListDraggable,
196
- "react-spectrum-ListView--dropTarget": !!isRootDropTarget,
197
- "react-spectrum-ListView--isVerticalScrollbarVisible": isVerticalScrollbarVisible,
198
- "react-spectrum-ListView--isHorizontalScrollbarVisible": isHorizontalScrollbarVisible,
199
- "react-spectrum-ListView--hasAnyChildren": hasAnyChildren,
200
- "react-spectrum-ListView--wrap": overflowMode === "wrap"
192
+ className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'react-spectrum-ListView', `react-spectrum-ListView--${density}`, 'react-spectrum-ListView--emphasized', {
193
+ 'react-spectrum-ListView--quiet': isQuiet,
194
+ 'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',
195
+ 'react-spectrum-ListView--draggable': !!isListDraggable,
196
+ 'react-spectrum-ListView--dropTarget': !!isRootDropTarget,
197
+ 'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,
198
+ 'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,
199
+ 'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,
200
+ 'react-spectrum-ListView--wrap': overflowMode === 'wrap'
201
201
  }, styleProps.className),
202
202
  layout: layout,
203
203
  collection: collection,
204
204
  transitionDuration: isLoading ? 160 : 220
205
205
  }, (type, item)=>{
206
- if (type === "item") return /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$react).Fragment, null, isListDroppable && collection.getKeyBefore(item.key) == null && /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $41a60729487a82d7$export$2e2bcd8739ae039), {
206
+ if (type === 'item') return /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$react).Fragment, null, isListDroppable && collection.getKeyBefore(item.key) == null && /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $41a60729487a82d7$export$2e2bcd8739ae039), {
207
207
  key: "root"
208
208
  }), isListDroppable && /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $0a834ddbc989a3e3$export$2e2bcd8739ae039), {
209
209
  key: `${item.key}-before`,
210
210
  target: {
211
211
  key: item.key,
212
- type: "item",
213
- dropPosition: "before"
212
+ type: 'item',
213
+ dropPosition: 'before'
214
214
  }
215
215
  }), /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $d7c07ca2efc5ba02$export$c6bde0c04b033c0e), {
216
216
  item: item,
@@ -220,16 +220,16 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
220
220
  key: `${item.key}-after`,
221
221
  target: {
222
222
  key: item.key,
223
- type: "item",
224
- dropPosition: "after"
223
+ type: 'item',
224
+ dropPosition: 'after'
225
225
  },
226
226
  isPresentationOnly: collection.getKeyAfter(item.key) != null
227
227
  }));
228
- else if (type === "loader") return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$ProgressCircle), {
228
+ else if (type === 'loader') return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, /*#__PURE__*/ (0, $6w3ZV$react).createElement((0, $6w3ZV$ProgressCircle), {
229
229
  isIndeterminate: true,
230
- "aria-label": collection.size > 0 ? stringFormatter.format("loadingMore") : stringFormatter.format("loading")
230
+ "aria-label": collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')
231
231
  }));
232
- else if (type === "placeholder") {
232
+ else if (type === 'placeholder') {
233
233
  let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
234
234
  if (emptyState == null) return null;
235
235
  return /*#__PURE__*/ (0, $6w3ZV$react).createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, emptyState);
@@ -254,8 +254,8 @@ function $f85fb77f9d4cbc6c$var$CenteredWrapper({ children: children }) {
254
254
  return /*#__PURE__*/ (0, $6w3ZV$react).createElement("div", {
255
255
  role: "row",
256
256
  "aria-rowindex": state.collection.size + 1,
257
- className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), "react-spectrum-ListView-centeredWrapper", {
258
- "react-spectrum-ListView-centeredWrapper--loadingMore": state.collection.size > 0
257
+ className: (0, $6w3ZV$classNames)((0, ($parcel$interopDefault($6w3ZV$styles_cssmodulejs))), 'react-spectrum-ListView-centeredWrapper', {
258
+ 'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0
259
259
  })
260
260
  }, /*#__PURE__*/ (0, $6w3ZV$react).createElement("div", {
261
261
  role: "gridcell"
package/dist/ListViewItem.main.js CHANGED
@@ -81,7 +81,7 @@ function $9eae7a1cb1535a6b$export$c6bde0c04b033c0e(props) {
81
81
  let { checkboxProps: checkboxProps } = (0, $5Mbbg$reactariagridlist.useGridListSelectionCheckbox)({
82
82
  key: item.key
83
83
  }, state);
84
- let hasDescription = (0, $5Mbbg$reactspectrumutils.useHasChild)(`.${(0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-description"]}`, rowRef);
84
+ let hasDescription = (0, $5Mbbg$reactspectrumutils.useHasChild)(`.${(0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-description']}`, rowRef);
85
85
  let draggableItem;
86
86
  if (isListDraggable) {
87
87
  // eslint-disable-next-line react-hooks/rules-of-hooks
@@ -97,9 +97,9 @@ function $9eae7a1cb1535a6b$export$c6bde0c04b033c0e(props) {
97
97
  let dropIndicatorRef = (0, $5Mbbg$react.useRef)();
98
98
  if (isListDroppable) {
99
99
  let target = {
100
- type: "item",
100
+ type: 'item',
101
101
  key: item.key,
102
- dropPosition: "on"
102
+ dropPosition: 'on'
103
103
  };
104
104
  isDropTarget = dropState.isDropTarget(target);
105
105
  // eslint-disable-next-line react-hooks/rules-of-hooks
@@ -110,25 +110,25 @@ function $9eae7a1cb1535a6b$export$c6bde0c04b033c0e(props) {
110
110
  let dragButtonRef = (0, ($parcel$interopDefault($5Mbbg$react))).useRef();
111
111
  let { buttonProps: buttonProps } = (0, $5Mbbg$reactariabutton.useButton)({
112
112
  ...draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragButtonProps,
113
- elementType: "div"
113
+ elementType: 'div'
114
114
  }, dragButtonRef);
115
- let chevron = direction === "ltr" ? /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, ($parcel$interopDefault($5Mbbg$spectrumiconsuiChevronRightMedium))), {
115
+ let chevron = direction === 'ltr' ? /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, ($parcel$interopDefault($5Mbbg$spectrumiconsuiChevronRightMedium))), {
116
116
  "aria-hidden": "true",
117
- UNSAFE_className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListViewItem-parentIndicator", {
118
- "react-spectrum-ListViewItem-parentIndicator--hasChildItems": item.props.hasChildItems,
119
- "is-disabled": !hasAction
117
+ UNSAFE_className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem-parentIndicator', {
118
+ 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,
119
+ 'is-disabled': !hasAction
120
120
  })
121
121
  }) : /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, ($parcel$interopDefault($5Mbbg$spectrumiconsuiChevronLeftMedium))), {
122
122
  "aria-hidden": "true",
123
- UNSAFE_className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListViewItem-parentIndicator", {
124
- "react-spectrum-ListViewItem-parentIndicator--hasChildItems": item.props.hasChildItems,
125
- "is-disabled": !hasAction
123
+ UNSAFE_className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem-parentIndicator', {
124
+ 'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,
125
+ 'is-disabled': !hasAction
126
126
  })
127
127
  });
128
- let showCheckbox = state.selectionManager.selectionMode !== "none" && state.selectionManager.selectionBehavior === "toggle";
128
+ let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';
129
129
  let { visuallyHiddenProps: visuallyHiddenProps } = (0, $5Mbbg$reactariavisuallyhidden.useVisuallyHidden)();
130
130
  let dropProps = isDroppable ? droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps : {
131
- "aria-hidden": droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps["aria-hidden"]
131
+ 'aria-hidden': droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps['aria-hidden']
132
132
  };
133
133
  const mergedProps = (0, $5Mbbg$reactariautils.mergeProps)(rowProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, dropProps, hoverProps, focusWithinProps, focusProps, // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,
134
134
  // allowing for single swipe navigation between row drop indicator
@@ -141,53 +141,53 @@ function $9eae7a1cb1535a6b$export$c6bde0c04b033c0e(props) {
141
141
  // 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
142
142
  // with bottom border
143
143
  let isFlushWithContainerBottom = false;
144
- if (isLastRow && loadingState !== "loadingMore") {
144
+ if (isLastRow && loadingState !== 'loadingMore') {
145
145
  if (((_layout_getContentSize = layout.getContentSize()) === null || _layout_getContentSize === void 0 ? void 0 : _layout_getContentSize.height) >= ((_layout_virtualizer = layout.virtualizer) === null || _layout_virtualizer === void 0 ? void 0 : _layout_virtualizer.getVisibleRect().height)) isFlushWithContainerBottom = true;
146
146
  }
147
147
  // previous item isn't selected
148
148
  // 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
149
149
  let roundTops = !state.selectionManager.isSelected(item.prevKey) && (state.selectionManager.focusedKey !== item.prevKey || !((0, $5Mbbg$reactariainteractions.isFocusVisible)() && state.selectionManager.isFocused));
150
150
  let roundBottoms = !state.selectionManager.isSelected(item.nextKey) && (state.selectionManager.focusedKey !== item.nextKey || !((0, $5Mbbg$reactariainteractions.isFocusVisible)() && state.selectionManager.isFocused));
151
- let content = typeof item.rendered === "string" ? /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumtext.Text), null, item.rendered) : item.rendered;
151
+ let content = typeof item.rendered === 'string' ? /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumtext.Text), null, item.rendered) : item.rendered;
152
152
  if (isDisabled) content = /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumprovider.Provider), {
153
153
  isDisabled: true
154
154
  }, content);
155
155
  return /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
156
156
  ...mergedProps,
157
- className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListView-row", {
158
- "focus-ring": isFocusVisible,
159
- "round-tops": roundTops || isHovered && !isSelected && state.selectionManager.focusedKey !== item.key,
160
- "round-bottoms": roundBottoms || isHovered && !isSelected && state.selectionManager.focusedKey !== item.key
157
+ className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListView-row', {
158
+ 'focus-ring': isFocusVisible,
159
+ 'round-tops': roundTops || isHovered && !isSelected && state.selectionManager.focusedKey !== item.key,
160
+ 'round-bottoms': roundBottoms || isHovered && !isSelected && state.selectionManager.focusedKey !== item.key
161
161
  }),
162
162
  ref: rowRef
163
163
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
164
164
  // TODO: refactor the css here now that we are focusing the row?
165
- className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListViewItem", {
166
- "is-active": isPressed,
167
- "is-focused": isFocusVisibleWithin,
168
- "focus-ring": isFocusVisible,
169
- "is-hovered": isHovered,
170
- "is-selected": isSelected,
171
- "is-disabled": isDisabled,
172
- "is-prev-selected": state.selectionManager.isSelected(item.prevKey),
173
- "is-next-selected": state.selectionManager.isSelected(item.nextKey),
174
- "react-spectrum-ListViewItem--highlightSelection": state.selectionManager.selectionBehavior === "replace" && (isSelected || state.selectionManager.isSelected(item.nextKey)),
175
- "react-spectrum-ListViewItem--dropTarget": !!isDropTarget,
176
- "react-spectrum-ListViewItem--firstRow": isFirstRow,
177
- "react-spectrum-ListViewItem--lastRow": isLastRow,
178
- "react-spectrum-ListViewItem--isFlushBottom": isFlushWithContainerBottom,
179
- "react-spectrum-ListViewItem--hasDescription": hasDescription
165
+ className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem', {
166
+ 'is-active': isPressed,
167
+ 'is-focused': isFocusVisibleWithin,
168
+ 'focus-ring': isFocusVisible,
169
+ 'is-hovered': isHovered,
170
+ 'is-selected': isSelected,
171
+ 'is-disabled': isDisabled,
172
+ 'is-prev-selected': state.selectionManager.isSelected(item.prevKey),
173
+ 'is-next-selected': state.selectionManager.isSelected(item.nextKey),
174
+ 'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || state.selectionManager.isSelected(item.nextKey)),
175
+ 'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,
176
+ 'react-spectrum-ListViewItem--firstRow': isFirstRow,
177
+ 'react-spectrum-ListViewItem--lastRow': isLastRow,
178
+ 'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,
179
+ 'react-spectrum-ListViewItem--hasDescription': hasDescription
180
180
  }),
181
181
  ...gridCellProps
182
182
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumlayout.Grid), {
183
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-grid"]
183
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-grid']
184
184
  }, isListDraggable && /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
185
- className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-draghandle-container"]
185
+ className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-draghandle-container']
186
186
  }, !isDisabled && /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactariafocus.FocusRing), {
187
- focusRingClass: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "focus-ring")
187
+ focusRingClass: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'focus-ring')
188
188
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
189
189
  ...buttonProps,
190
- className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), "react-spectrum-ListViewItem-draghandle-button"),
190
+ className: (0, $5Mbbg$reactspectrumutils.classNames)((0, ($parcel$interopDefault($279507a6f189e509$exports))), 'react-spectrum-ListViewItem-draghandle-button'),
191
191
  style: !isFocusVisibleWithin ? {
192
192
  ...visuallyHiddenProps.style
193
193
  } : {},
@@ -202,46 +202,46 @@ function $9eae7a1cb1535a6b$export$c6bde0c04b033c0e(props) {
202
202
  in: showCheckbox,
203
203
  unmountOnExit: true,
204
204
  classNames: {
205
- enter: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-checkbox--enter"],
206
- enterActive: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-checkbox--enterActive"],
207
- exit: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-checkbox--exit"],
208
- exitActive: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-checkbox--exitActive"]
205
+ enter: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox--enter'],
206
+ enterActive: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox--enterActive'],
207
+ exit: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox--exit'],
208
+ exitActive: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox--exitActive']
209
209
  },
210
210
  timeout: 160,
211
211
  nodeRef: checkboxWrapperRef
212
212
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement("div", {
213
213
  ref: checkboxWrapperRef,
214
- className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-checkboxWrapper"]
214
+ className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkboxWrapper']
215
215
  }, /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumcheckbox.Checkbox), {
216
216
  ...checkboxProps,
217
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-checkbox"],
217
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-checkbox'],
218
218
  isEmphasized: isEmphasized
219
219
  }))), /*#__PURE__*/ (0, ($parcel$interopDefault($5Mbbg$react))).createElement((0, $5Mbbg$reactspectrumutils.SlotProvider), {
220
220
  slots: {
221
221
  text: {
222
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-content"]
222
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-content']
223
223
  },
224
224
  description: {
225
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-description"],
225
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-description'],
226
226
  ...descriptionProps
227
227
  },
228
228
  illustration: {
229
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-thumbnail"]
229
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-thumbnail']
230
230
  },
231
231
  image: {
232
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-thumbnail"]
232
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-thumbnail']
233
233
  },
234
234
  actionButton: {
235
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-actions"],
235
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-actions'],
236
236
  isQuiet: true
237
237
  },
238
238
  actionGroup: {
239
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-actions"],
239
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-actions'],
240
240
  isQuiet: true,
241
- density: "compact"
241
+ density: 'compact'
242
242
  },
243
243
  actionMenu: {
244
- UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))["react-spectrum-ListViewItem-actionmenu"],
244
+ UNSAFE_className: (0, ($parcel$interopDefault($279507a6f189e509$exports)))['react-spectrum-ListViewItem-actionmenu'],
245
245
  isQuiet: true
246
246
  }
247
247
  }