npm - @react-spectrum/list - Versions diffs - 3.0.0-alpha.9 → 3.0.0-beta.0 - Mend

@react-spectrum/list 3.0.0-alpha.9 → 3.0.0-beta.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 (15) hide show

package/dist/main.css +1 -1
package/dist/main.js +572 -304
package/dist/main.js.map +1 -1
package/dist/module.js +574 -306
package/dist/module.js.map +1 -1
package/dist/types.d.ts +6 -16
package/dist/types.d.ts.map +1 -1
package/package.json +39 -35
package/src/DragPreview.tsx +60 -0
package/src/InsertionIndicator.tsx +46 -0
package/src/ListView.tsx +184 -150
package/src/ListViewItem.tsx +158 -62
package/src/RootDropIndicator.tsx +28 -0
package/src/styles.css +593 -0
package/src/listview.css +0 -236

package/dist/module.js CHANGED Viewed

@@ -1,26 +1,27 @@
 import "./main.css";
 import {Item as $75e4a7b01832b12d$re_export$Item} from "@react-stately/collections";
-import {Checkbox as $fWI2a$Checkbox} from "@react-spectrum/checkbox";
-import {useDOMRef as $fWI2a$useDOMRef, useStyleProps as $fWI2a$useStyleProps, classNames as $fWI2a$classNames, SlotProvider as $fWI2a$SlotProvider, ClearSlots as $fWI2a$ClearSlots} from "@react-spectrum/utils";
-import {Content as $fWI2a$Content} from "@react-spectrum/view";
-import {GridCollection as $fWI2a$GridCollection, useGridState as $fWI2a$useGridState} from "@react-stately/grid";
-import {GridKeyboardDelegate as $fWI2a$GridKeyboardDelegate, useGridSelectionCheckbox as $fWI2a$useGridSelectionCheckbox, useGrid as $fWI2a$useGrid, useGridRow as $fWI2a$useGridRow, useGridCell as $fWI2a$useGridCell} from "@react-aria/grid";
+import {useDOMRef as $fWI2a$useDOMRef, useStyleProps as $fWI2a$useStyleProps, classNames as $fWI2a$classNames, useHasChild as $fWI2a$useHasChild, SlotProvider as $fWI2a$SlotProvider, ClearSlots as $fWI2a$ClearSlots} from "@react-spectrum/utils";
+import {useLayoutEffect as $fWI2a$useLayoutEffect, mergeProps as $fWI2a$mergeProps, filterDOMProps as $fWI2a$filterDOMProps} from "@react-aria/utils";
 import {ListLayout as $fWI2a$ListLayout} from "@react-stately/layout";
 import {useListState as $fWI2a$useListState} from "@react-stately/list";
 import {ProgressCircle as $fWI2a$ProgressCircle} from "@react-spectrum/progress";
-import {useProvider as $fWI2a$useProvider, Provider as $fWI2a$Provider} from "@react-spectrum/provider";
-import $fWI2a$react, {useMemo as $fWI2a$useMemo, useRef as $fWI2a$useRef, useContext as $fWI2a$useContext} from "react";
+import $fWI2a$react, {useMemo as $fWI2a$useMemo, useRef as $fWI2a$useRef, useState as $fWI2a$useState, useContext as $fWI2a$useContext} from "react";
+import {Rect as $fWI2a$Rect} from "@react-stately/virtualizer";
 import {useCollator as $fWI2a$useCollator, useMessageFormatter as $fWI2a$useMessageFormatter, useLocale as $fWI2a$useLocale} from "@react-aria/i18n";
+import {useList as $fWI2a$useList, useListItem as $fWI2a$useListItem, useListSelectionCheckbox as $fWI2a$useListSelectionCheckbox} from "@react-aria/list";
+import {useProvider as $fWI2a$useProvider, Provider as $fWI2a$Provider} from "@react-spectrum/provider";
 import {Virtualizer as $fWI2a$Virtualizer} from "@react-aria/virtualizer";
-import $fWI2a$spectrumiconsuiListGripper from "@spectrum-icons/ui/ListGripper";
+import {useVisuallyHidden as $fWI2a$useVisuallyHidden} from "@react-aria/visually-hidden";
+import {Checkbox as $fWI2a$Checkbox} from "@react-spectrum/checkbox";
 import $fWI2a$spectrumiconsuiChevronLeftMedium from "@spectrum-icons/ui/ChevronLeftMedium";
 import $fWI2a$spectrumiconsuiChevronRightMedium from "@spectrum-icons/ui/ChevronRightMedium";
+import {CSSTransition as $fWI2a$CSSTransition} from "react-transition-group";
 import {useFocusRing as $fWI2a$useFocusRing, FocusRing as $fWI2a$FocusRing} from "@react-aria/focus";
 import {Grid as $fWI2a$Grid} from "@react-spectrum/layout";
-import {mergeProps as $fWI2a$mergeProps} from "@react-aria/utils";
+import {useHover as $fWI2a$useHover, isFocusVisible as $fWI2a$isFocusVisible} from "@react-aria/interactions";
+import $fWI2a$spectrumiconsuiListGripper from "@spectrum-icons/ui/ListGripper";
+import {Text as $fWI2a$Text} from "@react-spectrum/text";
 import {useButton as $fWI2a$useButton} from "@react-aria/button";
-import {useHover as $fWI2a$useHover, usePress as $fWI2a$usePress} from "@react-aria/interactions";
-import {useVisuallyHidden as $fWI2a$useVisuallyHidden} from "@react-aria/visually-hidden";
 function $parcel$interopDefault(a) {
   return a && a.__esModule ? a.default : a;
@@ -31,6 +32,196 @@ function $parcel$export(e, n, v, s) {
+var $c8bc378300208597$exports = {};
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView", () => $c8bc378300208597$export$4ad4709e9aee8e02, (v) => $c8bc378300208597$export$4ad4709e9aee8e02 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView-row", () => $c8bc378300208597$export$f80410436c6352c8, (v) => $c8bc378300208597$export$f80410436c6352c8 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--emphasized", () => $c8bc378300208597$export$eb0d5352b2a55473, (v) => $c8bc378300208597$export$eb0d5352b2a55473 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--dropTarget", () => $c8bc378300208597$export$d9ba3f873d0eaec6, (v) => $c8bc378300208597$export$d9ba3f873d0eaec6 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem", () => $c8bc378300208597$export$ce8c93b50eec2d4f, (v) => $c8bc378300208597$export$ce8c93b50eec2d4f = v);
+$parcel$export($c8bc378300208597$exports, "is-selected", () => $c8bc378300208597$export$1e0fb04f31d3c22a, (v) => $c8bc378300208597$export$1e0fb04f31d3c22a = v);
+$parcel$export($c8bc378300208597$exports, "is-hovered", () => $c8bc378300208597$export$b8813cd5d7824ce7, (v) => $c8bc378300208597$export$b8813cd5d7824ce7 = v);
+$parcel$export($c8bc378300208597$exports, "is-active", () => $c8bc378300208597$export$20fd0f7cd4e6112f, (v) => $c8bc378300208597$export$20fd0f7cd4e6112f = v);
+$parcel$export($c8bc378300208597$exports, "focus-ring", () => $c8bc378300208597$export$f39a09f249340e2a, (v) => $c8bc378300208597$export$f39a09f249340e2a = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem--firstRow", () => $c8bc378300208597$export$60162f05499b7560, (v) => $c8bc378300208597$export$60162f05499b7560 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--quiet", () => $c8bc378300208597$export$b01cb9680b0b8d22, (v) => $c8bc378300208597$export$b01cb9680b0b8d22 = v);
+$parcel$export($c8bc378300208597$exports, "is-next-selected", () => $c8bc378300208597$export$53aa811f86efbfad, (v) => $c8bc378300208597$export$53aa811f86efbfad = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem--isFlushBottom", () => $c8bc378300208597$export$f9ed481cac4d935a, (v) => $c8bc378300208597$export$f9ed481cac4d935a = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--loadingMore", () => $c8bc378300208597$export$5aa06adeaa92dbca, (v) => $c8bc378300208597$export$5aa06adeaa92dbca = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem--lastRow", () => $c8bc378300208597$export$659c081622dc13b0, (v) => $c8bc378300208597$export$659c081622dc13b0 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--isVerticalScrollbarVisible", () => $c8bc378300208597$export$1bf50375883926, (v) => $c8bc378300208597$export$1bf50375883926 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--isHorizontalScrollbarVisible", () => $c8bc378300208597$export$d9b13621bc5dd4d1, (v) => $c8bc378300208597$export$d9b13621bc5dd4d1 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--wrap", () => $c8bc378300208597$export$68b45d42c77fe1cf, (v) => $c8bc378300208597$export$68b45d42c77fe1cf = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-content", () => $c8bc378300208597$export$dc2b0b08d47555, (v) => $c8bc378300208597$export$dc2b0b08d47555 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-description", () => $c8bc378300208597$export$5d2adfeb248e654a, (v) => $c8bc378300208597$export$5d2adfeb248e654a = v);
+$parcel$export($c8bc378300208597$exports, "round-tops", () => $c8bc378300208597$export$3b4577d06eb82ec0, (v) => $c8bc378300208597$export$3b4577d06eb82ec0 = v);
+$parcel$export($c8bc378300208597$exports, "round-bottoms", () => $c8bc378300208597$export$8a26470723c97997, (v) => $c8bc378300208597$export$8a26470723c97997 = v);
+$parcel$export($c8bc378300208597$exports, "is-focused", () => $c8bc378300208597$export$e7dc768d35940237, (v) => $c8bc378300208597$export$e7dc768d35940237 = v);
+$parcel$export($c8bc378300208597$exports, "is-disabled", () => $c8bc378300208597$export$d35bc1e505d1ebbf, (v) => $c8bc378300208597$export$d35bc1e505d1ebbf = v);
+$parcel$export($c8bc378300208597$exports, "has-checkbox", () => $c8bc378300208597$export$27f4d14f7fc5b94, (v) => $c8bc378300208597$export$27f4d14f7fc5b94 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-grid", () => $c8bc378300208597$export$aaaf83100348d389, (v) => $c8bc378300208597$export$aaaf83100348d389 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-draghandle-container", () => $c8bc378300208597$export$f385e7456ddfee84, (v) => $c8bc378300208597$export$f385e7456ddfee84 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-draghandle-button", () => $c8bc378300208597$export$4784f0c2ec8bbf7b, (v) => $c8bc378300208597$export$4784f0c2ec8bbf7b = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-checkboxWrapper", () => $c8bc378300208597$export$41a33ae9818c51be, (v) => $c8bc378300208597$export$41a33ae9818c51be = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-checkbox", () => $c8bc378300208597$export$f979f76ca45242f2, (v) => $c8bc378300208597$export$f979f76ca45242f2 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-icon", () => $c8bc378300208597$export$2b56ca744bd31ebd, (v) => $c8bc378300208597$export$2b56ca744bd31ebd = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-image", () => $c8bc378300208597$export$1260770e51d5a8c4, (v) => $c8bc378300208597$export$1260770e51d5a8c4 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--hasDescription", () => $c8bc378300208597$export$7c9efe74c4b77579, (v) => $c8bc378300208597$export$7c9efe74c4b77579 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-actions", () => $c8bc378300208597$export$26480389595d4515, (v) => $c8bc378300208597$export$26480389595d4515 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-actionmenu", () => $c8bc378300208597$export$58dfda3903289699, (v) => $c8bc378300208597$export$58dfda3903289699 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-parentIndicator", () => $c8bc378300208597$export$39b42a8a24290c17, (v) => $c8bc378300208597$export$39b42a8a24290c17 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-dragPreview", () => $c8bc378300208597$export$84286d36e5c00c55, (v) => $c8bc378300208597$export$84286d36e5c00c55 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-badge", () => $c8bc378300208597$export$6498e436231eea33, (v) => $c8bc378300208597$export$6498e436231eea33 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-dragPreview--multiple", () => $c8bc378300208597$export$2fb3c7c2d5c0d720, (v) => $c8bc378300208597$export$2fb3c7c2d5c0d720 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--hasAnyChildren", () => $c8bc378300208597$export$7150e72e440612bf, (v) => $c8bc378300208597$export$7150e72e440612bf = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-parentIndicator--hasChildItems", () => $c8bc378300208597$export$c29dcfa80dab8c88, (v) => $c8bc378300208597$export$c29dcfa80dab8c88 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--compact", () => $c8bc378300208597$export$1f55b27adf96a61e, (v) => $c8bc378300208597$export$1f55b27adf96a61e = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--spacious", () => $c8bc378300208597$export$cbd30c7809acdd81, (v) => $c8bc378300208597$export$cbd30c7809acdd81 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView--draggable", () => $c8bc378300208597$export$a2d35348c0cc9bca, (v) => $c8bc378300208597$export$a2d35348c0cc9bca = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem--dropTarget", () => $c8bc378300208597$export$8afa006321ee3a8f, (v) => $c8bc378300208597$export$8afa006321ee3a8f = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView-centeredWrapper", () => $c8bc378300208597$export$1b66ee5cd8394caf, (v) => $c8bc378300208597$export$1b66ee5cd8394caf = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListView-centeredWrapper--loadingMore", () => $c8bc378300208597$export$6b3b7792abd9e5f4, (v) => $c8bc378300208597$export$6b3b7792abd9e5f4 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewInsertionIndicator", () => $c8bc378300208597$export$2a6a235e0baff403, (v) => $c8bc378300208597$export$2a6a235e0baff403 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewInsertionIndicator--dropTarget", () => $c8bc378300208597$export$927a243805a411ca, (v) => $c8bc378300208597$export$927a243805a411ca = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-checkbox--enter", () => $c8bc378300208597$export$9dc11c0e0825a249, (v) => $c8bc378300208597$export$9dc11c0e0825a249 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-checkbox--enterActive", () => $c8bc378300208597$export$f89865e352230a35, (v) => $c8bc378300208597$export$f89865e352230a35 = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-checkbox--exit", () => $c8bc378300208597$export$867c05a16e5d2a7c, (v) => $c8bc378300208597$export$867c05a16e5d2a7c = v);
+$parcel$export($c8bc378300208597$exports, "react-spectrum-ListViewItem-checkbox--exitActive", () => $c8bc378300208597$export$61b66671605f1b1a, (v) => $c8bc378300208597$export$61b66671605f1b1a = v);
+var $c8bc378300208597$export$4ad4709e9aee8e02;
+var $c8bc378300208597$export$f80410436c6352c8;
+var $c8bc378300208597$export$eb0d5352b2a55473;
+var $c8bc378300208597$export$d9ba3f873d0eaec6;
+var $c8bc378300208597$export$ce8c93b50eec2d4f;
+var $c8bc378300208597$export$1e0fb04f31d3c22a;
+var $c8bc378300208597$export$b8813cd5d7824ce7;
+var $c8bc378300208597$export$20fd0f7cd4e6112f;
+var $c8bc378300208597$export$f39a09f249340e2a;
+var $c8bc378300208597$export$60162f05499b7560;
+var $c8bc378300208597$export$b01cb9680b0b8d22;
+var $c8bc378300208597$export$53aa811f86efbfad;
+var $c8bc378300208597$export$f9ed481cac4d935a;
+var $c8bc378300208597$export$5aa06adeaa92dbca;
+var $c8bc378300208597$export$659c081622dc13b0;
+var $c8bc378300208597$export$1bf50375883926;
+var $c8bc378300208597$export$d9b13621bc5dd4d1;
+var $c8bc378300208597$export$68b45d42c77fe1cf;
+var $c8bc378300208597$export$dc2b0b08d47555;
+var $c8bc378300208597$export$5d2adfeb248e654a;
+var $c8bc378300208597$export$3b4577d06eb82ec0;
+var $c8bc378300208597$export$8a26470723c97997;
+var $c8bc378300208597$export$e7dc768d35940237;
+var $c8bc378300208597$export$d35bc1e505d1ebbf;
+var $c8bc378300208597$export$27f4d14f7fc5b94;
+var $c8bc378300208597$export$aaaf83100348d389;
+var $c8bc378300208597$export$f385e7456ddfee84;
+var $c8bc378300208597$export$4784f0c2ec8bbf7b;
+var $c8bc378300208597$export$41a33ae9818c51be;
+var $c8bc378300208597$export$f979f76ca45242f2;
+var $c8bc378300208597$export$2b56ca744bd31ebd;
+var $c8bc378300208597$export$1260770e51d5a8c4;
+var $c8bc378300208597$export$7c9efe74c4b77579;
+var $c8bc378300208597$export$26480389595d4515;
+var $c8bc378300208597$export$58dfda3903289699;
+var $c8bc378300208597$export$39b42a8a24290c17;
+var $c8bc378300208597$export$84286d36e5c00c55;
+var $c8bc378300208597$export$6498e436231eea33;
+var $c8bc378300208597$export$2fb3c7c2d5c0d720;
+var $c8bc378300208597$export$7150e72e440612bf;
+var $c8bc378300208597$export$c29dcfa80dab8c88;
+var $c8bc378300208597$export$1f55b27adf96a61e;
+var $c8bc378300208597$export$cbd30c7809acdd81;
+var $c8bc378300208597$export$a2d35348c0cc9bca;
+var $c8bc378300208597$export$8afa006321ee3a8f;
+var $c8bc378300208597$export$1b66ee5cd8394caf;
+var $c8bc378300208597$export$6b3b7792abd9e5f4;
+var $c8bc378300208597$export$2a6a235e0baff403;
+var $c8bc378300208597$export$927a243805a411ca;
+var $c8bc378300208597$export$9dc11c0e0825a249;
+var $c8bc378300208597$export$f89865e352230a35;
+var $c8bc378300208597$export$867c05a16e5d2a7c;
+var $c8bc378300208597$export$61b66671605f1b1a;
+$c8bc378300208597$export$4ad4709e9aee8e02 = "react-spectrum-ListView_dd5487";
+$c8bc378300208597$export$f80410436c6352c8 = "react-spectrum-ListView-row_dd5487";
+$c8bc378300208597$export$eb0d5352b2a55473 = "react-spectrum-ListView--emphasized_dd5487";
+$c8bc378300208597$export$d9ba3f873d0eaec6 = "react-spectrum-ListView--dropTarget_dd5487";
+$c8bc378300208597$export$ce8c93b50eec2d4f = "react-spectrum-ListViewItem_dd5487";
+$c8bc378300208597$export$1e0fb04f31d3c22a = "is-selected_dd5487";
+$c8bc378300208597$export$b8813cd5d7824ce7 = "is-hovered_dd5487";
+$c8bc378300208597$export$20fd0f7cd4e6112f = "is-active_dd5487";
+$c8bc378300208597$export$f39a09f249340e2a = "focus-ring_dd5487";
+$c8bc378300208597$export$60162f05499b7560 = "react-spectrum-ListViewItem--firstRow_dd5487";
+$c8bc378300208597$export$b01cb9680b0b8d22 = "react-spectrum-ListView--quiet_dd5487";
+$c8bc378300208597$export$53aa811f86efbfad = "is-next-selected_dd5487";
+$c8bc378300208597$export$f9ed481cac4d935a = "react-spectrum-ListViewItem--isFlushBottom_dd5487";
+$c8bc378300208597$export$5aa06adeaa92dbca = "react-spectrum-ListView--loadingMore_dd5487";
+$c8bc378300208597$export$659c081622dc13b0 = "react-spectrum-ListViewItem--lastRow_dd5487";
+$c8bc378300208597$export$1bf50375883926 = "react-spectrum-ListView--isVerticalScrollbarVisible_dd5487";
+$c8bc378300208597$export$d9b13621bc5dd4d1 = "react-spectrum-ListView--isHorizontalScrollbarVisible_dd5487";
+$c8bc378300208597$export$68b45d42c77fe1cf = "react-spectrum-ListView--wrap_dd5487";
+$c8bc378300208597$export$dc2b0b08d47555 = "react-spectrum-ListViewItem-content_dd5487";
+$c8bc378300208597$export$5d2adfeb248e654a = "react-spectrum-ListViewItem-description_dd5487";
+$c8bc378300208597$export$3b4577d06eb82ec0 = "round-tops_dd5487";
+$c8bc378300208597$export$8a26470723c97997 = "round-bottoms_dd5487";
+$c8bc378300208597$export$e7dc768d35940237 = "is-focused_dd5487";
+$c8bc378300208597$export$d35bc1e505d1ebbf = "is-disabled_dd5487";
+$c8bc378300208597$export$27f4d14f7fc5b94 = "has-checkbox_dd5487";
+$c8bc378300208597$export$aaaf83100348d389 = "react-spectrum-ListViewItem-grid_dd5487";
+$c8bc378300208597$export$f385e7456ddfee84 = "react-spectrum-ListViewItem-draghandle-container_dd5487";
+$c8bc378300208597$export$4784f0c2ec8bbf7b = "react-spectrum-ListViewItem-draghandle-button_dd5487";
+$c8bc378300208597$export$41a33ae9818c51be = "react-spectrum-ListViewItem-checkboxWrapper_dd5487";
+$c8bc378300208597$export$f979f76ca45242f2 = "react-spectrum-ListViewItem-checkbox_dd5487";
+$c8bc378300208597$export$2b56ca744bd31ebd = "react-spectrum-ListViewItem-icon_dd5487";
+$c8bc378300208597$export$1260770e51d5a8c4 = "react-spectrum-ListViewItem-image_dd5487";
+$c8bc378300208597$export$7c9efe74c4b77579 = "react-spectrum-ListView--hasDescription_dd5487";
+$c8bc378300208597$export$26480389595d4515 = "react-spectrum-ListViewItem-actions_dd5487";
+$c8bc378300208597$export$58dfda3903289699 = "react-spectrum-ListViewItem-actionmenu_dd5487";
+$c8bc378300208597$export$39b42a8a24290c17 = "react-spectrum-ListViewItem-parentIndicator_dd5487";
+$c8bc378300208597$export$84286d36e5c00c55 = "react-spectrum-ListViewItem-dragPreview_dd5487";
+$c8bc378300208597$export$6498e436231eea33 = "react-spectrum-ListViewItem-badge_dd5487";
+$c8bc378300208597$export$2fb3c7c2d5c0d720 = "react-spectrum-ListViewItem-dragPreview--multiple_dd5487";
+$c8bc378300208597$export$7150e72e440612bf = "react-spectrum-ListView--hasAnyChildren_dd5487";
+$c8bc378300208597$export$c29dcfa80dab8c88 = "react-spectrum-ListViewItem-parentIndicator--hasChildItems_dd5487";
+$c8bc378300208597$export$1f55b27adf96a61e = "react-spectrum-ListView--compact_dd5487";
+$c8bc378300208597$export$cbd30c7809acdd81 = "react-spectrum-ListView--spacious_dd5487";
+$c8bc378300208597$export$a2d35348c0cc9bca = "react-spectrum-ListView--draggable_dd5487";
+$c8bc378300208597$export$8afa006321ee3a8f = "react-spectrum-ListViewItem--dropTarget_dd5487";
+$c8bc378300208597$export$1b66ee5cd8394caf = "react-spectrum-ListView-centeredWrapper_dd5487";
+$c8bc378300208597$export$6b3b7792abd9e5f4 = "react-spectrum-ListView-centeredWrapper--loadingMore_dd5487";
+$c8bc378300208597$export$2a6a235e0baff403 = "react-spectrum-ListViewInsertionIndicator_dd5487";
+$c8bc378300208597$export$927a243805a411ca = "react-spectrum-ListViewInsertionIndicator--dropTarget_dd5487";
+$c8bc378300208597$export$9dc11c0e0825a249 = "react-spectrum-ListViewItem-checkbox--enter_dd5487";
+$c8bc378300208597$export$f89865e352230a35 = "react-spectrum-ListViewItem-checkbox--enterActive_dd5487";
+$c8bc378300208597$export$867c05a16e5d2a7c = "react-spectrum-ListViewItem-checkbox--exit_dd5487";
+$c8bc378300208597$export$61b66671605f1b1a = "react-spectrum-ListViewItem-checkbox--exitActive_dd5487";
+function $0a834ddbc989a3e3$export$2e2bcd8739ae039(props) {
+    let { dropState: dropState , dropHooks: dropHooks  } = $fWI2a$useContext($f85fb77f9d4cbc6c$export$870039b0abfe3de0);
+    const { target: target , isPresentationOnly: isPresentationOnly  } = props;
+    let ref = $fWI2a$useRef();
+    let { dropIndicatorProps: dropIndicatorProps  } = dropHooks.useDropIndicator(props, dropState, ref);
+    let { visuallyHiddenProps: visuallyHiddenProps  } = $fWI2a$useVisuallyHidden();
+    let isDropTarget = dropState.isDropTarget(target);
+    if (!isDropTarget && dropIndicatorProps['aria-hidden']) return null;
+    return(/*#__PURE__*/ $fWI2a$react.createElement("div", {
+        role: "row",
+        "aria-hidden": dropIndicatorProps['aria-hidden']
+    }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
+        role: "gridcell",
+        "aria-selected": "false",
+        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListViewInsertionIndicator', {
+            'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget
+        })
+    }, !isPresentationOnly && /*#__PURE__*/ $fWI2a$react.createElement("div", {
+        ...visuallyHiddenProps,
+        role: "button",
+        ...dropIndicatorProps,
+        ref: ref
+    }))));
+}
 var $8d8b0a0ae222979e$exports = {};
@@ -211,95 +402,6 @@ $8d8b0a0ae222979e$exports = {
-var $7a33fe9cdec6aaae$exports = {};
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListView", () => $7a33fe9cdec6aaae$export$4ad4709e9aee8e02, (v) => $7a33fe9cdec6aaae$export$4ad4709e9aee8e02 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListView--quiet", () => $7a33fe9cdec6aaae$export$b01cb9680b0b8d22, (v) => $7a33fe9cdec6aaae$export$b01cb9680b0b8d22 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem", () => $7a33fe9cdec6aaae$export$ce8c93b50eec2d4f, (v) => $7a33fe9cdec6aaae$export$ce8c93b50eec2d4f = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListView--emphasized", () => $7a33fe9cdec6aaae$export$eb0d5352b2a55473, (v) => $7a33fe9cdec6aaae$export$eb0d5352b2a55473 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "is-selected", () => $7a33fe9cdec6aaae$export$1e0fb04f31d3c22a, (v) => $7a33fe9cdec6aaae$export$1e0fb04f31d3c22a = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "is-hovered", () => $7a33fe9cdec6aaae$export$b8813cd5d7824ce7, (v) => $7a33fe9cdec6aaae$export$b8813cd5d7824ce7 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "is-active", () => $7a33fe9cdec6aaae$export$20fd0f7cd4e6112f, (v) => $7a33fe9cdec6aaae$export$20fd0f7cd4e6112f = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "is-previous-selected", () => $7a33fe9cdec6aaae$export$714358c802c073a3, (v) => $7a33fe9cdec6aaae$export$714358c802c073a3 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "is-focused", () => $7a33fe9cdec6aaae$export$e7dc768d35940237, (v) => $7a33fe9cdec6aaae$export$e7dc768d35940237 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "focus-ring", () => $7a33fe9cdec6aaae$export$f39a09f249340e2a, (v) => $7a33fe9cdec6aaae$export$f39a09f249340e2a = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "has-checkbox", () => $7a33fe9cdec6aaae$export$27f4d14f7fc5b94, (v) => $7a33fe9cdec6aaae$export$27f4d14f7fc5b94 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "is-dragging", () => $7a33fe9cdec6aaae$export$642fdeb0d9a9740d, (v) => $7a33fe9cdec6aaae$export$642fdeb0d9a9740d = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-grid", () => $7a33fe9cdec6aaae$export$aaaf83100348d389, (v) => $7a33fe9cdec6aaae$export$aaaf83100348d389 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-draghandle-container", () => $7a33fe9cdec6aaae$export$f385e7456ddfee84, (v) => $7a33fe9cdec6aaae$export$f385e7456ddfee84 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-draghandle-button", () => $7a33fe9cdec6aaae$export$4784f0c2ec8bbf7b, (v) => $7a33fe9cdec6aaae$export$4784f0c2ec8bbf7b = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-checkbox", () => $7a33fe9cdec6aaae$export$f979f76ca45242f2, (v) => $7a33fe9cdec6aaae$export$f979f76ca45242f2 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-icon", () => $7a33fe9cdec6aaae$export$2b56ca744bd31ebd, (v) => $7a33fe9cdec6aaae$export$2b56ca744bd31ebd = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-image", () => $7a33fe9cdec6aaae$export$1260770e51d5a8c4, (v) => $7a33fe9cdec6aaae$export$1260770e51d5a8c4 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-content", () => $7a33fe9cdec6aaae$export$dc2b0b08d47555, (v) => $7a33fe9cdec6aaae$export$dc2b0b08d47555 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-description", () => $7a33fe9cdec6aaae$export$5d2adfeb248e654a, (v) => $7a33fe9cdec6aaae$export$5d2adfeb248e654a = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-actions", () => $7a33fe9cdec6aaae$export$26480389595d4515, (v) => $7a33fe9cdec6aaae$export$26480389595d4515 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-actionmenu", () => $7a33fe9cdec6aaae$export$58dfda3903289699, (v) => $7a33fe9cdec6aaae$export$58dfda3903289699 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem-parentIndicator", () => $7a33fe9cdec6aaae$export$39b42a8a24290c17, (v) => $7a33fe9cdec6aaae$export$39b42a8a24290c17 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListView--compact", () => $7a33fe9cdec6aaae$export$1f55b27adf96a61e, (v) => $7a33fe9cdec6aaae$export$1f55b27adf96a61e = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListView--spacious", () => $7a33fe9cdec6aaae$export$cbd30c7809acdd81, (v) => $7a33fe9cdec6aaae$export$cbd30c7809acdd81 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListView--draggable", () => $7a33fe9cdec6aaae$export$a2d35348c0cc9bca, (v) => $7a33fe9cdec6aaae$export$a2d35348c0cc9bca = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListViewItem--draggable", () => $7a33fe9cdec6aaae$export$f290f4d471385527, (v) => $7a33fe9cdec6aaae$export$f290f4d471385527 = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListView-centeredWrapper", () => $7a33fe9cdec6aaae$export$1b66ee5cd8394caf, (v) => $7a33fe9cdec6aaae$export$1b66ee5cd8394caf = v);
-$parcel$export($7a33fe9cdec6aaae$exports, "react-spectrum-ListView-centeredWrapper--loadingMore", () => $7a33fe9cdec6aaae$export$6b3b7792abd9e5f4, (v) => $7a33fe9cdec6aaae$export$6b3b7792abd9e5f4 = v);
-var $7a33fe9cdec6aaae$export$4ad4709e9aee8e02;
-var $7a33fe9cdec6aaae$export$b01cb9680b0b8d22;
-var $7a33fe9cdec6aaae$export$ce8c93b50eec2d4f;
-var $7a33fe9cdec6aaae$export$eb0d5352b2a55473;
-var $7a33fe9cdec6aaae$export$1e0fb04f31d3c22a;
-var $7a33fe9cdec6aaae$export$b8813cd5d7824ce7;
-var $7a33fe9cdec6aaae$export$20fd0f7cd4e6112f;
-var $7a33fe9cdec6aaae$export$714358c802c073a3;
-var $7a33fe9cdec6aaae$export$e7dc768d35940237;
-var $7a33fe9cdec6aaae$export$f39a09f249340e2a;
-var $7a33fe9cdec6aaae$export$27f4d14f7fc5b94;
-var $7a33fe9cdec6aaae$export$642fdeb0d9a9740d;
-var $7a33fe9cdec6aaae$export$aaaf83100348d389;
-var $7a33fe9cdec6aaae$export$f385e7456ddfee84;
-var $7a33fe9cdec6aaae$export$4784f0c2ec8bbf7b;
-var $7a33fe9cdec6aaae$export$f979f76ca45242f2;
-var $7a33fe9cdec6aaae$export$2b56ca744bd31ebd;
-var $7a33fe9cdec6aaae$export$1260770e51d5a8c4;
-var $7a33fe9cdec6aaae$export$dc2b0b08d47555;
-var $7a33fe9cdec6aaae$export$5d2adfeb248e654a;
-var $7a33fe9cdec6aaae$export$26480389595d4515;
-var $7a33fe9cdec6aaae$export$58dfda3903289699;
-var $7a33fe9cdec6aaae$export$39b42a8a24290c17;
-var $7a33fe9cdec6aaae$export$1f55b27adf96a61e;
-var $7a33fe9cdec6aaae$export$cbd30c7809acdd81;
-var $7a33fe9cdec6aaae$export$a2d35348c0cc9bca;
-var $7a33fe9cdec6aaae$export$f290f4d471385527;
-var $7a33fe9cdec6aaae$export$1b66ee5cd8394caf;
-var $7a33fe9cdec6aaae$export$6b3b7792abd9e5f4;
-$7a33fe9cdec6aaae$export$4ad4709e9aee8e02 = "react-spectrum-ListView_d68562";
-$7a33fe9cdec6aaae$export$b01cb9680b0b8d22 = "react-spectrum-ListView--quiet_d68562";
-$7a33fe9cdec6aaae$export$ce8c93b50eec2d4f = "react-spectrum-ListViewItem_d68562";
-$7a33fe9cdec6aaae$export$eb0d5352b2a55473 = "react-spectrum-ListView--emphasized_d68562";
-$7a33fe9cdec6aaae$export$1e0fb04f31d3c22a = "is-selected_d68562";
-$7a33fe9cdec6aaae$export$b8813cd5d7824ce7 = "is-hovered_d68562";
-$7a33fe9cdec6aaae$export$20fd0f7cd4e6112f = "is-active_d68562";
-$7a33fe9cdec6aaae$export$714358c802c073a3 = "is-previous-selected_d68562";
-$7a33fe9cdec6aaae$export$e7dc768d35940237 = "is-focused_d68562";
-$7a33fe9cdec6aaae$export$f39a09f249340e2a = "focus-ring_d68562";
-$7a33fe9cdec6aaae$export$27f4d14f7fc5b94 = "has-checkbox_d68562";
-$7a33fe9cdec6aaae$export$642fdeb0d9a9740d = "is-dragging_d68562";
-$7a33fe9cdec6aaae$export$aaaf83100348d389 = "react-spectrum-ListViewItem-grid_d68562";
-$7a33fe9cdec6aaae$export$f385e7456ddfee84 = "react-spectrum-ListViewItem-draghandle-container_d68562";
-$7a33fe9cdec6aaae$export$4784f0c2ec8bbf7b = "react-spectrum-ListViewItem-draghandle-button_d68562";
-$7a33fe9cdec6aaae$export$f979f76ca45242f2 = "react-spectrum-ListViewItem-checkbox_d68562";
-$7a33fe9cdec6aaae$export$2b56ca744bd31ebd = "react-spectrum-ListViewItem-icon_d68562";
-$7a33fe9cdec6aaae$export$1260770e51d5a8c4 = "react-spectrum-ListViewItem-image_d68562";
-$7a33fe9cdec6aaae$export$dc2b0b08d47555 = "react-spectrum-ListViewItem-content_d68562";
-$7a33fe9cdec6aaae$export$5d2adfeb248e654a = "react-spectrum-ListViewItem-description_d68562";
-$7a33fe9cdec6aaae$export$26480389595d4515 = "react-spectrum-ListViewItem-actions_d68562";
-$7a33fe9cdec6aaae$export$58dfda3903289699 = "react-spectrum-ListViewItem-actionmenu_d68562";
-$7a33fe9cdec6aaae$export$39b42a8a24290c17 = "react-spectrum-ListViewItem-parentIndicator_d68562";
-$7a33fe9cdec6aaae$export$1f55b27adf96a61e = "react-spectrum-ListView--compact_d68562";
-$7a33fe9cdec6aaae$export$cbd30c7809acdd81 = "react-spectrum-ListView--spacious_d68562";
-$7a33fe9cdec6aaae$export$a2d35348c0cc9bca = "react-spectrum-ListView--draggable_d68562";
-$7a33fe9cdec6aaae$export$f290f4d471385527 = "react-spectrum-ListViewItem--draggable_d68562";
-$7a33fe9cdec6aaae$export$1b66ee5cd8394caf = "react-spectrum-ListView-centeredWrapper_d68562";
-$7a33fe9cdec6aaae$export$6b3b7792abd9e5f4 = "react-spectrum-ListView-centeredWrapper--loadingMore_d68562";
@@ -320,137 +422,280 @@ $7a33fe9cdec6aaae$export$6b3b7792abd9e5f4 = "react-spectrum-ListView-centeredWra
 function $d7c07ca2efc5ba02$export$c6bde0c04b033c0e(props) {
-    let { item: item , isEmphasized: isEmphasized , dragHooks: dragHooks  } = props;
-    let cellNode = [
-        ...item.childNodes
-    ][0];
-    let { state: state , dragState: dragState , onAction: onAction , isListDraggable: isListDraggable  } = $fWI2a$useContext($f85fb77f9d4cbc6c$export$870039b0abfe3de0);
+    var ref, ref1;
+    let { item: item , isEmphasized: isEmphasized  } = props;
+    let { state: state , dragState: dragState , dropState: dropState , isListDraggable: isListDraggable , isListDroppable: isListDroppable , layout: layout , dragHooks: dragHooks , dropHooks: dropHooks , loadingState: loadingState  } = $fWI2a$useContext($f85fb77f9d4cbc6c$export$870039b0abfe3de0);
     let { direction: direction  } = $fWI2a$useLocale();
     let rowRef = $fWI2a$useRef();
-    let cellRef = $fWI2a$useRef();
     let { isFocusVisible: isFocusVisibleWithin , focusProps: focusWithinProps  } = $fWI2a$useFocusRing({
         within: true
     });
     let { isFocusVisible: isFocusVisible , focusProps: focusProps  } = $fWI2a$useFocusRing();
-    let allowsInteraction = state.selectionManager.selectionMode !== 'none' || onAction;
-    let isDisabled = !allowsInteraction || state.disabledKeys.has(item.key);
-    let isDraggable = (dragState === null || dragState === void 0 ? void 0 : dragState.isDraggable(item.key)) && !isDisabled;
-    let { hoverProps: hoverProps , isHovered: isHovered  } = $fWI2a$useHover({
-        isDisabled: isDisabled
-    });
-    let { pressProps: pressProps , isPressed: isPressed  } = $fWI2a$usePress({
-        isDisabled: isDisabled
-    });
-    let { rowProps: rowProps  } = $fWI2a$useGridRow({
+    let { rowProps: rowProps , gridCellProps: gridCellProps , isPressed: isPressed , descriptionProps: descriptionProps , isSelected: isSelected , isDisabled: isDisabled , allowsSelection: allowsSelection , hasAction: hasAction  } = $fWI2a$useListItem({
         node: item,
         isVirtualized: true,
-        onAction: onAction ? ()=>onAction(item.key)
-         : undefined,
         shouldSelectOnPressUp: isListDraggable
     }, state, rowRef);
-    let { gridCellProps: gridCellProps  } = $fWI2a$useGridCell({
-        node: cellNode,
-        focusMode: 'cell'
-    }, state, cellRef);
-    let draggableItem;
-    if (isListDraggable) // eslint-disable-next-line react-hooks/rules-of-hooks
-    draggableItem = dragHooks.useDraggableItem({
-        key: item.key
-    }, dragState);
-    const mergedProps = $fWI2a$mergeProps(gridCellProps, hoverProps, focusWithinProps, focusProps);
-    let { checkboxProps: checkboxProps  } = $fWI2a$useGridSelectionCheckbox({
-        ...props,
+    let isDroppable = isListDroppable && !isDisabled;
+    let { hoverProps: hoverProps , isHovered: isHovered  } = $fWI2a$useHover({
+        isDisabled: !allowsSelection && !hasAction
+    });
+    let { checkboxProps: checkboxProps  } = $fWI2a$useListSelectionCheckbox({
         key: item.key
     }, state);
+    let hasDescription = $fWI2a$useHasChild(`.${(/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-description']}`, rowRef);
+    let draggableItem;
+    if (isListDraggable) {
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        draggableItem = dragHooks.useDraggableItem({
+            key: item.key
+        }, dragState);
+        if (isDisabled) draggableItem = null;
+    }
+    let droppableItem;
+    let isDropTarget;
+    let dropIndicator;
+    let dropIndicatorRef = $fWI2a$useRef();
+    if (isListDroppable) {
+        let target = {
+            type: 'item',
+            key: item.key,
+            dropPosition: 'on'
+        };
+        isDropTarget = dropState.isDropTarget(target);
+        // eslint-disable-next-line react-hooks/rules-of-hooks
+        droppableItem = dropHooks.useDroppableItem({
+            target: target
+        }, dropState, rowRef);
+        dropIndicator = dropHooks.useDropIndicator({
+            target: target
+        }, dropState, dropIndicatorRef);
+    }
     let dragButtonRef = $fWI2a$react.useRef();
     let { buttonProps: buttonProps  } = $fWI2a$useButton({
         ...draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragButtonProps,
         elementType: 'div'
     }, dragButtonRef);
-    let chevron = null;
-    if (item.props.hasChildItems) chevron = direction === 'ltr' ? /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$spectrumiconsuiChevronRightMedium, {
+    let chevron = direction === 'ltr' ? /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$spectrumiconsuiChevronRightMedium, {
         "aria-hidden": "true",
-        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-parentIndicator']
+        UNSAFE_className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListViewItem-parentIndicator', {
+            'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,
+            'is-disabled': !hasAction
+        })
     }) : /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$spectrumiconsuiChevronLeftMedium, {
         "aria-hidden": "true",
-        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-parentIndicator']
+        UNSAFE_className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListViewItem-parentIndicator', {
+            'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,
+            'is-disabled': !hasAction
+        })
     });
     let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';
-    let isSelected = state.selectionManager.isSelected(item.key);
-    let showDragHandle = isDraggable && (isFocusVisibleWithin || isHovered || isPressed);
     let { visuallyHiddenProps: visuallyHiddenProps  } = $fWI2a$useVisuallyHidden();
+    let dropProps = isDroppable ? droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps : {
+        'aria-hidden': droppableItem === null || droppableItem === void 0 ? void 0 : droppableItem.dropProps['aria-hidden']
+    };
+    const mergedProps = $fWI2a$mergeProps(rowProps, draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps, dropProps, hoverProps, focusWithinProps, focusProps);
+    let isFirstRow = item.prevKey == null;
+    let isLastRow = item.nextKey == null;
+    // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom
+    // 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
+    // with bottom border
+    let isFlushWithContainerBottom = false;
+    if (isLastRow && loadingState !== 'loadingMore') {
+        if (((ref = layout.getContentSize()) === null || ref === void 0 ? void 0 : ref.height) >= ((ref1 = layout.virtualizer) === null || ref1 === void 0 ? void 0 : ref1.getVisibleRect().height)) isFlushWithContainerBottom = true;
+    }
+    // previous item isn't selected
+    // 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
+    let roundTops = !state.selectionManager.isSelected(item.prevKey) && (state.selectionManager.focusedKey !== item.prevKey || !($fWI2a$isFocusVisible() && state.selectionManager.isFocused));
+    let roundBottoms = !state.selectionManager.isSelected(item.nextKey) && (state.selectionManager.focusedKey !== item.nextKey || !($fWI2a$isFocusVisible() && state.selectionManager.isFocused));
+    let content = typeof item.rendered === 'string' ? /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Text, null, item.rendered) : item.rendered;
+    if (isDisabled) content = /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Provider, {
+        isDisabled: true
+    }, content);
     return(/*#__PURE__*/ $fWI2a$react.createElement("div", {
-        ...$fWI2a$mergeProps(rowProps, pressProps, isDraggable && (draggableItem === null || draggableItem === void 0 ? void 0 : draggableItem.dragProps)),
+        ...mergedProps,
+        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListView-row', {
+            'focus-ring': isFocusVisible,
+            'round-tops': roundTops || isHovered && !isSelected && state.selectionManager.focusedKey !== item.key,
+            'round-bottoms': roundBottoms || isHovered && !isSelected && state.selectionManager.focusedKey !== item.key
+        }),
         ref: rowRef
     }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
-        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports)), 'react-spectrum-ListViewItem', {
+        // TODO: refactor the css here now that we are focusing the row?
+        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListViewItem', {
             'is-active': isPressed,
             'is-focused': isFocusVisibleWithin,
             'focus-ring': isFocusVisible,
             'is-hovered': isHovered,
             'is-selected': isSelected,
-            'is-previous-selected': state.selectionManager.isSelected(item.prevKey),
+            'is-disabled': isDisabled,
+            'is-prev-selected': state.selectionManager.isSelected(item.prevKey),
+            'is-next-selected': state.selectionManager.isSelected(item.nextKey),
             'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || state.selectionManager.isSelected(item.nextKey)),
-            'react-spectrum-ListViewItem--draggable': isDraggable
+            'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,
+            'react-spectrum-ListViewItem--firstRow': isFirstRow,
+            'react-spectrum-ListViewItem--lastRow': isLastRow,
+            'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,
+            'react-spectrum-ListViewItem--hasDescription': hasDescription
         }),
-        ref: cellRef,
-        ...mergedProps
+        ...gridCellProps
     }, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Grid, {
-        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-grid']
+        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-grid']
     }, isListDraggable && /*#__PURE__*/ $fWI2a$react.createElement("div", {
-        className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-draghandle-container']
-    }, isDraggable && /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$FocusRing, {
-        focusRingClass: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports)), 'focus-ring')
+        className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-draghandle-container']
+    }, !isDisabled && /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$FocusRing, {
+        focusRingClass: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'focus-ring')
     }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
         ...buttonProps,
-        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports)), 'react-spectrum-ListViewItem-draghandle-button'),
-        style: !showDragHandle ? {
+        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListViewItem-draghandle-button'),
+        style: !isFocusVisibleWithin ? {
             ...visuallyHiddenProps.style
         } : {
         },
         ref: dragButtonRef,
         draggable: "true"
-    }, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$spectrumiconsuiListGripper, null)))), showCheckbox && /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Checkbox, {
-        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-checkbox'],
+    }, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$spectrumiconsuiListGripper, null)))), isDropTarget && !(dropIndicator === null || dropIndicator === void 0 ? void 0 : dropIndicator.dropIndicatorProps['aria-hidden']) && /*#__PURE__*/ $fWI2a$react.createElement("div", {
+        role: "button",
+        ...visuallyHiddenProps,
+        ...dropIndicator === null || dropIndicator === void 0 ? void 0 : dropIndicator.dropIndicatorProps,
+        ref: dropIndicatorRef
+    }), /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$CSSTransition, {
+        in: showCheckbox,
+        unmountOnExit: true,
+        classNames: {
+            enter: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-checkbox--enter'],
+            enterActive: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-checkbox--enterActive'],
+            exit: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-checkbox--exit'],
+            exitActive: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-checkbox--exitActive']
+        },
+        timeout: 160
+    }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
+        className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-checkboxWrapper']
+    }, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Checkbox, {
         ...checkboxProps,
+        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-checkbox'],
         isEmphasized: isEmphasized
-    }), /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$SlotProvider, {
+    }))), /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$SlotProvider, {
         slots: {
-            content: {
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-content']
-            },
             text: {
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-content']
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-content']
             },
             description: {
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-description']
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-description'],
+                ...descriptionProps
             },
             icon: {
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-icon'],
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-icon'],
                 size: 'M'
             },
             image: {
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-image']
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-image']
+            },
+            actionButton: {
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-actions'],
+                isQuiet: true
+            },
+            actionGroup: {
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-actions'],
+                isQuiet: true,
+                density: 'compact'
             },
-            link: {
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-content'],
+            actionMenu: {
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-actionmenu'],
                 isQuiet: true
+            }
+        }
+    }, content, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$ClearSlots, null, chevron))))));
+}
+function $41a60729487a82d7$export$2e2bcd8739ae039() {
+    let { dropState: dropState , dropHooks: dropHooks  } = $fWI2a$useContext($f85fb77f9d4cbc6c$export$870039b0abfe3de0);
+    let ref = $fWI2a$useRef();
+    let { dropIndicatorProps: dropIndicatorProps  } = dropHooks.useDropIndicator({
+        target: {
+            type: 'root'
+        }
+    }, dropState, ref);
+    let isDropTarget = dropState.isDropTarget({
+        type: 'root'
+    });
+    let { visuallyHiddenProps: visuallyHiddenProps  } = $fWI2a$useVisuallyHidden();
+    if (!isDropTarget && dropIndicatorProps['aria-hidden']) return null;
+    return(/*#__PURE__*/ $fWI2a$react.createElement("div", {
+        role: "row",
+        "aria-hidden": dropIndicatorProps['aria-hidden']
+    }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
+        role: "gridcell",
+        "aria-selected": "false",
+        ...visuallyHiddenProps
+    }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
+        role: "button",
+        ...dropIndicatorProps,
+        ref: ref
+    }))));
+}
+function $cd61e55c47e3c0f5$export$905ab40ac2179daa(props) {
+    let { item: item , itemCount: itemCount , itemHeight: itemHeight  } = props;
+    let isDraggingMultiple = itemCount > 1;
+    return(/*#__PURE__*/ $fWI2a$react.createElement("div", {
+        style: {
+            height: itemHeight
+        },
+        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListViewItem', 'react-spectrum-ListViewItem-dragPreview', {
+            'react-spectrum-ListViewItem-dragPreview--multiple': isDraggingMultiple
+        })
+    }, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Grid, {
+        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-grid']
+    }, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$SlotProvider, {
+        slots: {
+            content: {
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-content']
+            },
+            text: {
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-content']
+            },
+            description: {
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-description']
+            },
+            icon: {
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-icon'],
+                size: 'M'
+            },
+            image: {
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-image']
             },
             actionButton: {
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-actions'],
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-actions'],
                 isQuiet: true
             },
             actionGroup: {
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-actions'],
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-actions'],
                 isQuiet: true,
                 density: 'compact'
             },
             actionMenu: {
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-actionmenu'],
+                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports))['react-spectrum-ListViewItem-actionmenu'],
                 isQuiet: true
             }
         }
-    }, typeof item.rendered === 'string' ? /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Content, null, item.rendered) : item.rendered, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$ClearSlots, null, chevron))))));
+    }, typeof item.rendered === 'string' ? /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Text, null, item.rendered) : item.rendered, isDraggingMultiple && /*#__PURE__*/ $fWI2a$react.createElement("div", {
+        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListViewItem-badge')
+    }, itemCount)))));
 }
@@ -458,7 +703,6 @@ function $d7c07ca2efc5ba02$export$c6bde0c04b033c0e(props) {
 const $f85fb77f9d4cbc6c$export$870039b0abfe3de0 = /*#__PURE__*/ $fWI2a$react.createContext(null);
 const $f85fb77f9d4cbc6c$var$ROW_HEIGHTS = {
     compact: {
@@ -474,7 +718,7 @@ const $f85fb77f9d4cbc6c$var$ROW_HEIGHTS = {
         large: 60
     }
 };
-function $f85fb77f9d4cbc6c$export$bea90da51ec70dea(state, density) {
+function $f85fb77f9d4cbc6c$var$useListLayout(state, density, overflowMode) {
     let { scale: scale  } = $fWI2a$useProvider();
     let collator = $fWI2a$useCollator({
         usage: 'search',
@@ -491,165 +735,153 @@ function $f85fb77f9d4cbc6c$export$bea90da51ec70dea(state, density) {
         collator,
         scale,
         density,
-        isEmpty
+        isEmpty,
+        overflowMode
     ]);
     layout.collection = state.collection;
     layout.disabledKeys = state.disabledKeys;
     return layout;
 }
 function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
-    let { density: density = 'regular' , onLoadMore: onLoadMore , loadingState: loadingState , isQuiet: isQuiet , transitionDuration: transitionDuration = 0 , onAction: onAction , dragHooks: dragHooks  } = props;
+    var ref1;
+    let { density: density = 'regular' , onLoadMore: onLoadMore , loadingState: loadingState , isQuiet: isQuiet , overflowMode: overflowMode = 'truncate' , onAction: onAction , dragHooks: dragHooks , dropHooks: dropHooks , ...otherProps } = props;
     let isListDraggable = !!dragHooks;
+    let isListDroppable = !!dropHooks;
     let dragHooksProvided = $fWI2a$useRef(isListDraggable);
+    let dropHooksProvided = $fWI2a$useRef(isListDroppable);
     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.');
+    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.');
     let domRef = $fWI2a$useDOMRef(ref);
-    let { collection: collection  } = $fWI2a$useListState(props);
-    let formatMessage = $fWI2a$useMessageFormatter((/*@__PURE__*/$parcel$interopDefault($8d8b0a0ae222979e$exports)));
-    let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';
-    let { styleProps: styleProps  } = $fWI2a$useStyleProps(props);
-    let { direction: direction  } = $fWI2a$useLocale();
-    let collator = $fWI2a$useCollator({
-        usage: 'search',
-        sensitivity: 'base'
-    });
-    let gridCollection = $fWI2a$useMemo(()=>new $fWI2a$GridCollection({
-            columnCount: 1,
-            items: [
-                ...collection
-            ].map((item)=>({
-                    ...item,
-                    hasChildNodes: true,
-                    childNodes: [
-                        {
-                            key: `cell-${item.key}`,
-                            type: 'cell',
-                            index: 0,
-                            value: null,
-                            level: 0,
-                            rendered: null,
-                            textValue: item.textValue,
-                            hasChildNodes: false,
-                            childNodes: []
-                        }
-                    ]
-                })
-            )
-        })
-    , [
-        collection
-    ]);
-    let state = $fWI2a$useGridState({
+    let state = $fWI2a$useListState({
         ...props,
-        collection: gridCollection,
-        focusMode: 'cell',
         selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'
     });
-    let layout = $f85fb77f9d4cbc6c$export$bea90da51ec70dea(state, props.density || 'regular');
-    let keyboardDelegate = $fWI2a$useMemo(()=>new $fWI2a$GridKeyboardDelegate({
-            collection: state.collection,
-            disabledKeys: state.disabledKeys,
-            ref: domRef,
-            direction: direction,
-            collator: collator,
-            // Focus the ListView cell instead of the row so that focus doesn't change with left/right arrow keys when there aren't any
-            // focusable children in the cell.
-            focusMode: 'cell'
-        })
-    , [
-        state,
-        domRef,
-        direction,
-        collator
-    ]);
-    let provider = $fWI2a$useProvider();
-    let { checkboxProps: checkboxProps  } = $fWI2a$useGridSelectionCheckbox({
-        key: null
-    }, state);
+    let { collection: collection , selectionManager: selectionManager  } = state;
+    let formatMessage = $fWI2a$useMessageFormatter((/*@__PURE__*/$parcel$interopDefault($8d8b0a0ae222979e$exports)));
+    let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';
+    let { styleProps: styleProps  } = $fWI2a$useStyleProps(props);
     let dragState;
+    let preview = $fWI2a$useRef(null);
     if (isListDraggable) dragState = dragHooks.useDraggableCollectionState({
-        collection: state.collection,
-        selectionManager: state.selectionManager,
-        renderPreview (selectedKeys, draggedKey) {
-            let item = state.collection.getItem(draggedKey);
-            let itemWidth = domRef.current.offsetWidth;
-            let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';
-            let isSelected = state.selectionManager.isSelected(item.key);
-            return(/*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Provider, {
-                ...provider,
-                UNSAFE_className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports)), 'react-spectrum-ListViewItem', 'is-dragging'),
-                UNSAFE_style: {
-                    width: itemWidth,
-                    paddingInlineStart: 0
-                }
-            }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
-                className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-grid']
-            }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
-                className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-draghandle-container']
-            }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
-                className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-draghandle-button']
-            }, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$spectrumiconsuiListGripper, null))), showCheckbox && /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Checkbox, {
-                isSelected: isSelected,
-                UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-checkbox'],
-                isEmphasized: true,
-                "aria-label": checkboxProps['aria-label']
-            }), /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$SlotProvider, {
-                slots: {
-                    content: {
-                        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-content']
-                    },
-                    text: {
-                        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-content']
-                    },
-                    description: {
-                        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-description']
-                    },
-                    icon: {
-                        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-icon'],
-                        size: 'M'
-                    },
-                    image: {
-                        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-image']
-                    },
-                    link: {
-                        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-content'],
-                        isQuiet: true
-                    },
-                    actionButton: {
-                        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-actions'],
-                        isQuiet: true
-                    },
-                    actionGroup: {
-                        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-actions'],
-                        isQuiet: true,
-                        density: 'compact'
-                    },
-                    actionMenu: {
-                        UNSAFE_className: (/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports))['react-spectrum-ListViewItem-actionmenu'],
-                        isQuiet: true
+        collection: collection,
+        selectionManager: selectionManager,
+        preview: preview
+    });
+    let layout = $f85fb77f9d4cbc6c$var$useListLayout(state, props.density || 'regular', overflowMode);
+    // !!0 is false, so we can cast size or undefined and they'll be falsy
+    layout.allowDisabledKeyFocus = state.selectionManager.disabledBehavior === 'selection' || !!(dragState === null || dragState === void 0 ? void 0 : dragState.draggingKeys.size);
+    let DragPreview = dragHooks === null || dragHooks === void 0 ? void 0 : dragHooks.DragPreview;
+    let dropState;
+    let droppableCollection;
+    let isRootDropTarget;
+    if (isListDroppable) {
+        dropState = dropHooks.useDroppableCollectionState({
+            collection: collection,
+            selectionManager: selectionManager
+        });
+        droppableCollection = dropHooks.useDroppableCollection({
+            keyboardDelegate: layout,
+            getDropTargetFromPoint (x, y) {
+                let closest = null;
+                let closestDistance = Infinity;
+                let closestDir = null;
+                x += domRef.current.scrollLeft;
+                y += domRef.current.scrollTop;
+                let visible = layout.getVisibleLayoutInfos(new $fWI2a$Rect(x - 50, y - 50, x + 50, y + 50));
+                for (let layoutInfo of visible){
+                    let r = layoutInfo.rect;
+                    let points = [
+                        [
+                            r.x,
+                            r.y + 4,
+                            'before'
+                        ],
+                        [
+                            r.maxX,
+                            r.y + 4,
+                            'before'
+                        ],
+                        [
+                            r.x,
+                            r.maxY - 8,
+                            'after'
+                        ],
+                        [
+                            r.maxX,
+                            r.maxY - 8,
+                            'after'
+                        ]
+                    ];
+                    for (let [px, py, dir] of points){
+                        let dx = px - x;
+                        let dy = py - y;
+                        let d = dx * dx + dy * dy;
+                        if (d < closestDistance) {
+                            closestDistance = d;
+                            closest = layoutInfo;
+                            closestDir = dir;
+                        }
                     }
+                    // TODO: Best way to implement only for when closest can be dropped on
+                    // TODO: Figure out the typescript for this
+                    // @ts-ignore
+                    if (y >= r.y + 10 && y <= r.maxY - 10 && collection.getItem(closest.key).value.type === 'folder') closestDir = 'on';
                 }
-            }, typeof item.rendered === 'string' ? /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Content, null, item.rendered) : item.rendered))));
-        }
-    });
-    let { gridProps: gridProps  } = $fWI2a$useGrid({
+                let key = closest === null || closest === void 0 ? void 0 : closest.key;
+                if (key) return {
+                    type: 'item',
+                    key: key,
+                    dropPosition: closestDir
+                };
+            }
+        }, dropState, domRef);
+        isRootDropTarget = dropState.isDropTarget({
+            type: 'root'
+        });
+    }
+    let { gridProps: gridProps  } = $fWI2a$useList({
         ...props,
         isVirtualized: true,
-        keyboardDelegate: keyboardDelegate
+        keyboardDelegate: layout,
+        onAction: onAction
     }, state, domRef);
     // Sync loading state into the layout.
     layout.isLoading = isLoading;
-    let focusedKey = state.selectionManager.focusedKey;
-    let focusedItem = gridCollection.getItem(state.selectionManager.focusedKey);
-    if ((focusedItem === null || focusedItem === void 0 ? void 0 : focusedItem.parentKey) != null) focusedKey = focusedItem.parentKey;
+    let focusedKey = selectionManager.focusedKey;
+    if ((dropState === null || dropState === void 0 ? void 0 : (ref1 = dropState.target) === null || ref1 === void 0 ? void 0 : ref1.type) === 'item') focusedKey = dropState.target.key;
+    // wait for layout to get accurate measurements
+    let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = $fWI2a$useState(false);
+    let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = $fWI2a$useState(false);
+    $fWI2a$useLayoutEffect(()=>{
+        if (domRef.current) {
+            // 2 is the width of the border which is not part of the box size
+            setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);
+            setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);
+        }
+    });
+    let hasAnyChildren = $fWI2a$useMemo(()=>[
+            ...collection
+        ].some((item)=>item.hasChildNodes
+        )
+    , [
+        collection
+    ]);
     return(/*#__PURE__*/ $fWI2a$react.createElement($f85fb77f9d4cbc6c$export$870039b0abfe3de0.Provider, {
         value: {
             state: state,
-            keyboardDelegate: keyboardDelegate,
             dragState: dragState,
+            dropState: dropState,
+            dragHooks: dragHooks,
+            dropHooks: dropHooks,
             onAction: onAction,
-            isListDraggable: isListDraggable
+            isListDraggable: isListDraggable,
+            isListDroppable: isListDroppable,
+            layout: layout,
+            loadingState: loadingState
         }
     }, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$Virtualizer, {
+        ...$fWI2a$mergeProps(isListDroppable && (droppableCollection === null || droppableCollection === void 0 ? void 0 : droppableCollection.collectionProps), gridProps),
+        ...$fWI2a$filterDOMProps(otherProps),
         ...gridProps,
         ...styleProps,
         isLoading: isLoading,
@@ -657,28 +889,62 @@ function $f85fb77f9d4cbc6c$var$ListView(props, ref) {
         ref: domRef,
         focusedKey: focusedKey,
         scrollDirection: "vertical",
-        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports)), 'react-spectrum-ListView', `react-spectrum-ListView--${density}`, 'react-spectrum-ListView--emphasized', {
+        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListView', `react-spectrum-ListView--${density}`, 'react-spectrum-ListView--emphasized', {
             'react-spectrum-ListView--quiet': isQuiet,
-            'react-spectrum-ListView--draggable': isListDraggable
+            'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',
+            'react-spectrum-ListView--draggable': !!isListDraggable,
+            'react-spectrum-ListView--dropTarget': !!isRootDropTarget,
+            'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,
+            'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,
+            'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,
+            'react-spectrum-ListView--wrap': overflowMode === 'wrap'
         }, styleProps.className),
         layout: layout,
-        collection: gridCollection,
-        transitionDuration: transitionDuration
+        collection: collection,
+        transitionDuration: isLoading ? 160 : 220
     }, (type, item)=>{
-        if (type === 'item') return(/*#__PURE__*/ $fWI2a$react.createElement($d7c07ca2efc5ba02$export$c6bde0c04b033c0e, {
+        if (type === 'item') return(/*#__PURE__*/ $fWI2a$react.createElement($fWI2a$react.Fragment, null, isListDroppable && collection.getKeyBefore(item.key) == null && /*#__PURE__*/ $fWI2a$react.createElement($41a60729487a82d7$export$2e2bcd8739ae039, {
+            key: "root"
+        }), isListDroppable && /*#__PURE__*/ $fWI2a$react.createElement($0a834ddbc989a3e3$export$2e2bcd8739ae039, {
+            key: `${item.key}-before`,
+            target: {
+                key: item.key,
+                type: 'item',
+                dropPosition: 'before'
+            }
+        }), /*#__PURE__*/ $fWI2a$react.createElement($d7c07ca2efc5ba02$export$c6bde0c04b033c0e, {
             item: item,
             isEmphasized: true,
-            dragHooks: dragHooks
-        }));
+            hasActions: !!onAction
+        }), isListDroppable && /*#__PURE__*/ $fWI2a$react.createElement($0a834ddbc989a3e3$export$2e2bcd8739ae039, {
+            key: `${item.key}-after`,
+            target: {
+                key: item.key,
+                type: 'item',
+                dropPosition: 'after'
+            },
+            isPresentationOnly: collection.getKeyAfter(item.key) != null
+        })));
         else if (type === 'loader') return(/*#__PURE__*/ $fWI2a$react.createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, /*#__PURE__*/ $fWI2a$react.createElement($fWI2a$ProgressCircle, {
             isIndeterminate: true,
-            "aria-label": state.collection.size > 0 ? formatMessage('loadingMore') : formatMessage('loading')
+            "aria-label": collection.size > 0 ? formatMessage('loadingMore') : formatMessage('loading')
         })));
         else if (type === 'placeholder') {
             let emptyState = props.renderEmptyState ? props.renderEmptyState() : null;
             if (emptyState == null) return null;
             return(/*#__PURE__*/ $fWI2a$react.createElement($f85fb77f9d4cbc6c$var$CenteredWrapper, null, emptyState));
         }
+    }), DragPreview && isListDraggable && /*#__PURE__*/ $fWI2a$react.createElement(DragPreview, {
+        ref: preview
+    }, ()=>{
+        let item = state.collection.getItem(dragState.draggedKey);
+        let itemCount = dragState.draggingKeys.size;
+        let itemHeight = layout.getLayoutInfo(dragState.draggedKey).rect.height;
+        return(/*#__PURE__*/ $fWI2a$react.createElement($cd61e55c47e3c0f5$export$905ab40ac2179daa, {
+            item: item,
+            itemCount: itemCount,
+            itemHeight: itemHeight
+        }));
     })));
 }
 function $f85fb77f9d4cbc6c$var$CenteredWrapper({ children: children  }) {
@@ -686,14 +952,16 @@ function $f85fb77f9d4cbc6c$var$CenteredWrapper({ children: children  }) {
     return(/*#__PURE__*/ $fWI2a$react.createElement("div", {
         role: "row",
         "aria-rowindex": state.collection.size + 1,
-        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($7a33fe9cdec6aaae$exports)), 'react-spectrum-ListView-centeredWrapper', {
+        className: $fWI2a$classNames((/*@__PURE__*/$parcel$interopDefault($c8bc378300208597$exports)), 'react-spectrum-ListView-centeredWrapper', {
             'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0
         })
     }, /*#__PURE__*/ $fWI2a$react.createElement("div", {
         role: "gridcell"
     }, children)));
 }
-const $f85fb77f9d4cbc6c$export$84d0dd190d551cd1 = /*#__PURE__*/ $fWI2a$react.forwardRef($f85fb77f9d4cbc6c$var$ListView);
+/**
+ * Lists display a linear collection of data. They allow users to quickly scan, sort, compare, and take action on large amounts of data.
+ */ const $f85fb77f9d4cbc6c$export$84d0dd190d551cd1 = /*#__PURE__*/ $fWI2a$react.forwardRef($f85fb77f9d4cbc6c$var$ListView);