@react-spectrum/list 3.9.2 → 3.10.0

package/dist/DragPreview.main.js

@@ -1,4 +1,4 @@
-require("./styles.ad343ab0.css");
+require("./list.5918e378.css");
 var $279507a6f189e509$exports = require("./styles_css.main.js");
 var $U0AUi$reactspectrumutils = require("@react-spectrum/utils");
 var $U0AUi$reactspectrumlayout = require("@react-spectrum/layout");

package/dist/DragPreview.main.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgBM,SAAS,0CAAY,KAAgC;IAC1D,IAAI,QACF,IAAI,aACJ,SAAS,cACT,UAAU,WACV,OAAO,EACR,GAAG;IAEJ,IAAI,qBAAqB,YAAY;IAErC,qBACE,0DAAC;QACC,OAAO;YAAC,QAAQ;QAAU;QAC1B,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAS,GACT,+BACA,2CACA;YAAC,qDAAqD;QAAkB,GACxE,CAAC,yCAAyC,EAAE,SAAS;qBAGzD,0DAAC,CAAA,GAAA,+BAAG;QAAE,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,mCAAmC;qBACpE,0DAAC,CAAA,GAAA,sCAAW;QACV,OAAO;YACL,MAAM;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;YAAA;YAC1E,aAAa;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,0CAA0C;YAAA;YACrF,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YACpF,OAAO;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YAC7E,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBAAE,SAAS;YAAI;YACjG,aAAa;gBACX,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBACnE,SAAS;gBACT,SAAS;YACX;YACA,YAAY;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,yCAAyC;gBAAE,SAAS;YAAI;QACpG;OACC,OAAO,KAAK,QAAQ,KAAK,yBAAW,0DAAC,CAAA,GAAA,6BAAG,SAAG,KAAK,QAAQ,IAAW,KAAK,QAAQ,EAChF,oCACC,0DAAC;QAAI,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAS,GAAG;OAAuC;AAM1F","sources":["packages/@react-spectrum/list/src/DragPreview.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {classNames, SlotProvider} from '@react-spectrum/utils';\nimport {Grid} from '@react-spectrum/layout';\nimport {GridNode} from '@react-types/grid';\nimport listStyles from './styles.css';\nimport React from 'react';\nimport type {SpectrumListViewProps} from './ListView';\nimport {Text} from '@react-spectrum/text';\n\ninterface DragPreviewProps<T> {\n  item: GridNode<any>,\n  itemCount: number,\n  itemHeight: number,\n  density: SpectrumListViewProps<T>['density']\n}\n\nexport function DragPreview(props: DragPreviewProps<unknown>) {\n  let {\n    item,\n    itemCount,\n    itemHeight,\n    density\n  } = props;\n\n  let isDraggingMultiple = itemCount > 1;\n\n  return (\n    <div\n      style={{height: itemHeight}}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListViewItem',\n          'react-spectrum-ListViewItem-dragPreview',\n          {'react-spectrum-ListViewItem-dragPreview--multiple': isDraggingMultiple},\n          `react-spectrum-ListViewItem-dragPreview--${density}`\n          )\n      }>\n      <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n        <SlotProvider\n          slots={{\n            text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n            description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description']},\n            illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n            image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n            actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n            actionGroup: {\n              UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n              isQuiet: true,\n              density: 'compact'\n            },\n            actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n          }}>\n          {typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered}\n          {isDraggingMultiple &&\n            <div className={classNames(listStyles, 'react-spectrum-ListViewItem-badge')}>{itemCount}</div>\n          }\n        </SlotProvider>\n      </Grid>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"DragPreview.main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgBM,SAAS,0CAAY,KAAgC;IAC1D,IAAI,QACF,IAAI,aACJ,SAAS,cACT,UAAU,WACV,OAAO,EACR,GAAG;IAEJ,IAAI,qBAAqB,YAAY;IAErC,qBACE,0DAAC;QACC,OAAO;YAAC,QAAQ;QAAU;QAC1B,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAS,GACT,+BACA,2CACA;YAAC,qDAAqD;QAAkB,GACxE,CAAC,yCAAyC,EAAE,SAAS;qBAGzD,0DAAC,CAAA,GAAA,+BAAG;QAAE,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,mCAAmC;qBACpE,0DAAC,CAAA,GAAA,sCAAW;QACV,OAAO;YACL,MAAM;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;YAAA;YAC1E,aAAa;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,0CAA0C;YAAA;YACrF,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YACpF,OAAO;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YAC7E,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBAAE,SAAS;YAAI;YACjG,aAAa;gBACX,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBACnE,SAAS;gBACT,SAAS;YACX;YACA,YAAY;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,yCAAyC;gBAAE,SAAS;YAAI;QACpG;OACC,OAAO,KAAK,QAAQ,KAAK,yBAAW,0DAAC,CAAA,GAAA,6BAAG,SAAG,KAAK,QAAQ,IAAW,KAAK,QAAQ,EAChF,oCACC,0DAAC;QAAI,WAAW,CAAA,GAAA,oCAAS,EAAE,CAAA,GAAA,mDAAS,GAAG;OAAuC;AAM1F","sources":["packages/@react-spectrum/list/src/DragPreview.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {classNames, SlotProvider} from '@react-spectrum/utils';\nimport {Grid} from '@react-spectrum/layout';\nimport {GridNode} from '@react-types/grid';\nimport listStyles from './styles.css';\nimport React, {ReactNode} from 'react';\nimport type {SpectrumListViewProps} from './ListView';\nimport {Text} from '@react-spectrum/text';\n\ninterface DragPreviewProps<T> {\n  item: GridNode<any>,\n  itemCount: number,\n  itemHeight: number,\n  density: SpectrumListViewProps<T>['density']\n}\n\nexport function DragPreview(props: DragPreviewProps<unknown>): ReactNode {\n  let {\n    item,\n    itemCount,\n    itemHeight,\n    density\n  } = props;\n\n  let isDraggingMultiple = itemCount > 1;\n\n  return (\n    <div\n      style={{height: itemHeight}}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListViewItem',\n          'react-spectrum-ListViewItem-dragPreview',\n          {'react-spectrum-ListViewItem-dragPreview--multiple': isDraggingMultiple},\n          `react-spectrum-ListViewItem-dragPreview--${density}`\n          )\n      }>\n      <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n        <SlotProvider\n          slots={{\n            text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n            description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description']},\n            illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n            image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n            actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n            actionGroup: {\n              UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n              isQuiet: true,\n              density: 'compact'\n            },\n            actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n          }}>\n          {typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered}\n          {isDraggingMultiple &&\n            <div className={classNames(listStyles, 'react-spectrum-ListViewItem-badge')}>{itemCount}</div>\n          }\n        </SlotProvider>\n      </Grid>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"DragPreview.main.js.map"}

package/dist/DragPreview.mjs

@@ -1,4 +1,4 @@
-import "./styles.ad343ab0.css";
+import "./list.5918e378.css";
 import $vFUHn$styles_cssmodulejs from "./styles_css.mjs";
 import {classNames as $vFUHn$classNames, SlotProvider as $vFUHn$SlotProvider} from "@react-spectrum/utils";
 import {Grid as $vFUHn$Grid} from "@react-spectrum/layout";

package/dist/DragPreview.module.js

@@ -1,4 +1,4 @@
-import "./styles.ad343ab0.css";
+import "./list.5918e378.css";
 import $vFUHn$styles_cssmodulejs from "./styles_css.module.js";
 import {classNames as $vFUHn$classNames, SlotProvider as $vFUHn$SlotProvider} from "@react-spectrum/utils";
 import {Grid as $vFUHn$Grid} from "@react-spectrum/layout";

package/dist/DragPreview.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgBM,SAAS,0CAAY,KAAgC;IAC1D,IAAI,QACF,IAAI,aACJ,SAAS,cACT,UAAU,WACV,OAAO,EACR,GAAG;IAEJ,IAAI,qBAAqB,YAAY;IAErC,qBACE,gCAAC;QACC,OAAO;YAAC,QAAQ;QAAU;QAC1B,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+BACA,2CACA;YAAC,qDAAqD;QAAkB,GACxE,CAAC,yCAAyC,EAAE,SAAS;qBAGzD,gCAAC,CAAA,GAAA,WAAG;QAAE,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,mCAAmC;qBACpE,gCAAC,CAAA,GAAA,mBAAW;QACV,OAAO;YACL,MAAM;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;YAAA;YAC1E,aAAa;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,0CAA0C;YAAA;YACrF,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YACpF,OAAO;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YAC7E,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBAAE,SAAS;YAAI;YACjG,aAAa;gBACX,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBACnE,SAAS;gBACT,SAAS;YACX;YACA,YAAY;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,yCAAyC;gBAAE,SAAS;YAAI;QACpG;OACC,OAAO,KAAK,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,WAAG,SAAG,KAAK,QAAQ,IAAW,KAAK,QAAQ,EAChF,oCACC,gCAAC;QAAI,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,mDAAS,GAAG;OAAuC;AAM1F","sources":["packages/@react-spectrum/list/src/DragPreview.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {classNames, SlotProvider} from '@react-spectrum/utils';\nimport {Grid} from '@react-spectrum/layout';\nimport {GridNode} from '@react-types/grid';\nimport listStyles from './styles.css';\nimport React from 'react';\nimport type {SpectrumListViewProps} from './ListView';\nimport {Text} from '@react-spectrum/text';\n\ninterface DragPreviewProps<T> {\n  item: GridNode<any>,\n  itemCount: number,\n  itemHeight: number,\n  density: SpectrumListViewProps<T>['density']\n}\n\nexport function DragPreview(props: DragPreviewProps<unknown>) {\n  let {\n    item,\n    itemCount,\n    itemHeight,\n    density\n  } = props;\n\n  let isDraggingMultiple = itemCount > 1;\n\n  return (\n    <div\n      style={{height: itemHeight}}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListViewItem',\n          'react-spectrum-ListViewItem-dragPreview',\n          {'react-spectrum-ListViewItem-dragPreview--multiple': isDraggingMultiple},\n          `react-spectrum-ListViewItem-dragPreview--${density}`\n          )\n      }>\n      <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n        <SlotProvider\n          slots={{\n            text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n            description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description']},\n            illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n            image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n            actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n            actionGroup: {\n              UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n              isQuiet: true,\n              density: 'compact'\n            },\n            actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n          }}>\n          {typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered}\n          {isDraggingMultiple &&\n            <div className={classNames(listStyles, 'react-spectrum-ListViewItem-badge')}>{itemCount}</div>\n          }\n        </SlotProvider>\n      </Grid>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"DragPreview.module.js.map"}
+{"mappings":";;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;AAgBM,SAAS,0CAAY,KAAgC;IAC1D,IAAI,QACF,IAAI,aACJ,SAAS,cACT,UAAU,WACV,OAAO,EACR,GAAG;IAEJ,IAAI,qBAAqB,YAAY;IAErC,qBACE,gCAAC;QACC,OAAO;YAAC,QAAQ;QAAU;QAC1B,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+BACA,2CACA;YAAC,qDAAqD;QAAkB,GACxE,CAAC,yCAAyC,EAAE,SAAS;qBAGzD,gCAAC,CAAA,GAAA,WAAG;QAAE,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,mCAAmC;qBACpE,gCAAC,CAAA,GAAA,mBAAW;QACV,OAAO;YACL,MAAM;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;YAAA;YAC1E,aAAa;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,0CAA0C;YAAA;YACrF,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YACpF,OAAO;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YAC7E,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBAAE,SAAS;YAAI;YACjG,aAAa;gBACX,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBACnE,SAAS;gBACT,SAAS;YACX;YACA,YAAY;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,yCAAyC;gBAAE,SAAS;YAAI;QACpG;OACC,OAAO,KAAK,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,WAAG,SAAG,KAAK,QAAQ,IAAW,KAAK,QAAQ,EAChF,oCACC,gCAAC;QAAI,WAAW,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,mDAAS,GAAG;OAAuC;AAM1F","sources":["packages/@react-spectrum/list/src/DragPreview.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {classNames, SlotProvider} from '@react-spectrum/utils';\nimport {Grid} from '@react-spectrum/layout';\nimport {GridNode} from '@react-types/grid';\nimport listStyles from './styles.css';\nimport React, {ReactNode} from 'react';\nimport type {SpectrumListViewProps} from './ListView';\nimport {Text} from '@react-spectrum/text';\n\ninterface DragPreviewProps<T> {\n  item: GridNode<any>,\n  itemCount: number,\n  itemHeight: number,\n  density: SpectrumListViewProps<T>['density']\n}\n\nexport function DragPreview(props: DragPreviewProps<unknown>): ReactNode {\n  let {\n    item,\n    itemCount,\n    itemHeight,\n    density\n  } = props;\n\n  let isDraggingMultiple = itemCount > 1;\n\n  return (\n    <div\n      style={{height: itemHeight}}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListViewItem',\n          'react-spectrum-ListViewItem-dragPreview',\n          {'react-spectrum-ListViewItem-dragPreview--multiple': isDraggingMultiple},\n          `react-spectrum-ListViewItem-dragPreview--${density}`\n          )\n      }>\n      <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n        <SlotProvider\n          slots={{\n            text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n            description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description']},\n            illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n            image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n            actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n            actionGroup: {\n              UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n              isQuiet: true,\n              density: 'compact'\n            },\n            actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n          }}>\n          {typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered}\n          {isDraggingMultiple &&\n            <div className={classNames(listStyles, 'react-spectrum-ListViewItem-badge')}>{itemCount}</div>\n          }\n        </SlotProvider>\n      </Grid>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"DragPreview.module.js.map"}

package/dist/InsertionIndicator.main.js

@@ -1,4 +1,4 @@
-require("./styles.ad343ab0.css");
+require("./list.5918e378.css");
 var $279507a6f189e509$exports = require("./styles_css.main.js");
 var $60684b441be8e84c$exports = require("./ListView.main.js");
 var $9hpsb$reactspectrumutils = require("@react-spectrum/utils");

package/dist/InsertionIndicator.main.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;AAYe,kDAA4B,KAA8B;IACvE,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,MAAM,UAAC,MAAM,sBAAE,kBAAkB,EAAC,GAAG;IAErC,IAAI,MAAM,CAAA,GAAA,mBAAK,EAAyB;IACxC,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAkB,gBAAgB,CAAE,OAAO,WAAY;IAClF,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,gDAAgB;IAE5C,IAAI,eAAe,UAAW,YAAY,CAAC;IAE3C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,0DAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,0DAAC;QACC,MAAK;QACL,iBAAc;QACd,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAS,GACT,6CACA;YACE,yDAAyD;QAC3D;OAEH,CAAC,oCACA,0DAAC;QAAK,GAAG,mBAAmB;QAAE,MAAK;QAAU,GAAG,kBAAkB;QAAE,KAAK;;AAKnF","sources":["packages/@react-spectrum/list/src/InsertionIndicator.tsx"],"sourcesContent":["import {classNames} from '@react-spectrum/utils';\nimport {ItemDropTarget} from '@react-types/shared';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface InsertionIndicatorProps {\n  target: ItemDropTarget,\n  isPresentationOnly?: boolean\n}\n\nexport default function InsertionIndicator(props: InsertionIndicatorProps) {\n  let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;\n  const {target, isPresentationOnly} = props;\n\n  let ref = useRef<HTMLDivElement | null>(null);\n  let {dropIndicatorProps} = dragAndDropHooks!.useDropIndicator!(props, dropState!, ref);\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  let isDropTarget = dropState!.isDropTarget(target);\n\n  if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n    return null;\n  }\n\n  return (\n    <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n      <div\n        role=\"gridcell\"\n        aria-selected=\"false\"\n        className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewInsertionIndicator',\n            {\n              'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget\n            }\n          )}>\n        {!isPresentationOnly &&\n          <div {...visuallyHiddenProps} role=\"button\" {...dropIndicatorProps} ref={ref} />\n        }\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"InsertionIndicator.main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;;;;;;AAYe,kDAA4B,KAA8B;IACvE,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,MAAM,UAAC,MAAM,sBAAE,kBAAkB,EAAC,GAAG;IAErC,IAAI,MAAM,CAAA,GAAA,mBAAK,EAAyB;IACxC,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAkB,gBAAgB,CAAE,OAAO,WAAY;IAClF,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,gDAAgB;IAE5C,IAAI,eAAe,UAAW,YAAY,CAAC;IAE3C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,0DAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,0DAAC;QACC,MAAK;QACL,iBAAc;QACd,WACE,CAAA,GAAA,oCAAS,EACP,CAAA,GAAA,mDAAS,GACT,6CACA;YACE,yDAAyD;QAC3D;OAEH,CAAC,oCACA,0DAAC;QAAK,GAAG,mBAAmB;QAAE,MAAK;QAAU,GAAG,kBAAkB;QAAE,KAAK;;AAKnF","sources":["packages/@react-spectrum/list/src/InsertionIndicator.tsx"],"sourcesContent":["import {classNames} from '@react-spectrum/utils';\nimport {ItemDropTarget} from '@react-types/shared';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport React, {ReactNode, useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface InsertionIndicatorProps {\n  target: ItemDropTarget,\n  isPresentationOnly?: boolean\n}\n\nexport default function InsertionIndicator(props: InsertionIndicatorProps): ReactNode | null {\n  let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;\n  const {target, isPresentationOnly} = props;\n\n  let ref = useRef<HTMLDivElement | null>(null);\n  let {dropIndicatorProps} = dragAndDropHooks!.useDropIndicator!(props, dropState!, ref);\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  let isDropTarget = dropState!.isDropTarget(target);\n\n  if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n    return null;\n  }\n\n  return (\n    <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n      <div\n        role=\"gridcell\"\n        aria-selected=\"false\"\n        className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewInsertionIndicator',\n            {\n              'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget\n            }\n          )}>\n        {!isPresentationOnly &&\n          <div {...visuallyHiddenProps} role=\"button\" {...dropIndicatorProps} ref={ref} />\n        }\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"InsertionIndicator.main.js.map"}

package/dist/InsertionIndicator.mjs

@@ -1,4 +1,4 @@
-import "./styles.ad343ab0.css";
+import "./list.5918e378.css";
 import $8djIL$styles_cssmodulejs from "./styles_css.mjs";
 import {ListViewContext as $f85fb77f9d4cbc6c$export$870039b0abfe3de0} from "./ListView.mjs";
 import {classNames as $8djIL$classNames} from "@react-spectrum/utils";

package/dist/InsertionIndicator.module.js

@@ -1,4 +1,4 @@
-import "./styles.ad343ab0.css";
+import "./list.5918e378.css";
 import $8djIL$styles_cssmodulejs from "./styles_css.module.js";
 import {ListViewContext as $f85fb77f9d4cbc6c$export$870039b0abfe3de0} from "./ListView.module.js";
 import {classNames as $8djIL$classNames} from "@react-spectrum/utils";

package/dist/InsertionIndicator.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;AAYe,kDAA4B,KAA8B;IACvE,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,MAAM,UAAC,MAAM,sBAAE,kBAAkB,EAAC,GAAG;IAErC,IAAI,MAAM,CAAA,GAAA,aAAK,EAAyB;IACxC,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAkB,gBAAgB,CAAE,OAAO,WAAY;IAClF,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,IAAI,eAAe,UAAW,YAAY,CAAC;IAE3C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,gCAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,gCAAC;QACC,MAAK;QACL,iBAAc;QACd,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,6CACA;YACE,yDAAyD;QAC3D;OAEH,CAAC,oCACA,gCAAC;QAAK,GAAG,mBAAmB;QAAE,MAAK;QAAU,GAAG,kBAAkB;QAAE,KAAK;;AAKnF","sources":["packages/@react-spectrum/list/src/InsertionIndicator.tsx"],"sourcesContent":["import {classNames} from '@react-spectrum/utils';\nimport {ItemDropTarget} from '@react-types/shared';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface InsertionIndicatorProps {\n  target: ItemDropTarget,\n  isPresentationOnly?: boolean\n}\n\nexport default function InsertionIndicator(props: InsertionIndicatorProps) {\n  let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;\n  const {target, isPresentationOnly} = props;\n\n  let ref = useRef<HTMLDivElement | null>(null);\n  let {dropIndicatorProps} = dragAndDropHooks!.useDropIndicator!(props, dropState!, ref);\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  let isDropTarget = dropState!.isDropTarget(target);\n\n  if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n    return null;\n  }\n\n  return (\n    <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n      <div\n        role=\"gridcell\"\n        aria-selected=\"false\"\n        className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewInsertionIndicator',\n            {\n              'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget\n            }\n          )}>\n        {!isPresentationOnly &&\n          <div {...visuallyHiddenProps} role=\"button\" {...dropIndicatorProps} ref={ref} />\n        }\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"InsertionIndicator.module.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;AAYe,kDAA4B,KAA8B;IACvE,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,MAAM,UAAC,MAAM,sBAAE,kBAAkB,EAAC,GAAG;IAErC,IAAI,MAAM,CAAA,GAAA,aAAK,EAAyB;IACxC,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAkB,gBAAgB,CAAE,OAAO,WAAY;IAClF,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,IAAI,eAAe,UAAW,YAAY,CAAC;IAE3C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,gCAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,gCAAC;QACC,MAAK;QACL,iBAAc;QACd,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,6CACA;YACE,yDAAyD;QAC3D;OAEH,CAAC,oCACA,gCAAC;QAAK,GAAG,mBAAmB;QAAE,MAAK;QAAU,GAAG,kBAAkB;QAAE,KAAK;;AAKnF","sources":["packages/@react-spectrum/list/src/InsertionIndicator.tsx"],"sourcesContent":["import {classNames} from '@react-spectrum/utils';\nimport {ItemDropTarget} from '@react-types/shared';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport React, {ReactNode, useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface InsertionIndicatorProps {\n  target: ItemDropTarget,\n  isPresentationOnly?: boolean\n}\n\nexport default function InsertionIndicator(props: InsertionIndicatorProps): ReactNode | null {\n  let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;\n  const {target, isPresentationOnly} = props;\n\n  let ref = useRef<HTMLDivElement | null>(null);\n  let {dropIndicatorProps} = dragAndDropHooks!.useDropIndicator!(props, dropState!, ref);\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  let isDropTarget = dropState!.isDropTarget(target);\n\n  if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n    return null;\n  }\n\n  return (\n    <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n      <div\n        role=\"gridcell\"\n        aria-selected=\"false\"\n        className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewInsertionIndicator',\n            {\n              'react-spectrum-ListViewInsertionIndicator--dropTarget': isDropTarget\n            }\n          )}>\n        {!isPresentationOnly &&\n          <div {...visuallyHiddenProps} role=\"button\" {...dropIndicatorProps} ref={ref} />\n        }\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"InsertionIndicator.module.js.map"}

package/dist/ListView.main.js

@@ -1,6 +1,6 @@
 var $fc02fd49ab58c72e$exports = require("./InsertionIndicator.main.js");
 var $2ebea2d8da6d3b78$exports = require("./intlStrings.main.js");
-require("./styles.ad343ab0.css");
+require("./list.5918e378.css");
 var $279507a6f189e509$exports = require("./styles_css.main.js");
 var $9eae7a1cb1535a6b$exports = require("./ListViewItem.main.js");
 var $a0cb8c9f009bf274$exports = require("./ListViewLayout.main.js");
@@ -91,8 +91,8 @@ const $60684b441be8e84c$export$84d0dd190d551cd1 = /*#__PURE__*/ (0, ($parcel$int
     let dragHooksProvided = (0, $8lawJ$react.useRef)(isListDraggable);
     let dropHooksProvided = (0, $8lawJ$react.useRef)(isListDroppable);
     (0, $8lawJ$react.useEffect)(()=>{
-        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.');
+        if (dragHooksProvided.current !== isListDraggable && process.env.NODE_ENV !== 'production') console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
+        if (dropHooksProvided.current !== isListDroppable && process.env.NODE_ENV !== 'production') console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
     }, [
         isListDraggable,
         isListDroppable

package/dist/ListView.main.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/list/src/ListView.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaGridListProps, useGridList} from '@react-aria/gridlist';\nimport {AsyncLoadable, DOMRef, Key, LoadingState, Node, SpectrumSelectionProps, StyleProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport type {DragAndDropHooks} from '@react-spectrum/dnd';\nimport type {DraggableCollectionState, DroppableCollectionState} from '@react-stately/dnd';\nimport type {DroppableCollectionResult} from '@react-aria/dnd';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {FocusRing, FocusScope} from '@react-aria/focus';\nimport InsertionIndicator from './InsertionIndicator';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate} from '@react-aria/selection';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\nimport {ListViewLayout} from './ListViewLayout';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport RootDropIndicator from './RootDropIndicator';\nimport {DragPreview as SpectrumDragPreview} from './DragPreview';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer} from '@react-aria/virtualizer';\n\nexport interface SpectrumListViewProps<T> extends Omit<AriaGridListProps<T>, 'keyboardNavigationBehavior'>, StyleProps, SpectrumSelectionProps, Omit<AsyncLoadable, 'isLoading'> {\n  /**\n   * Sets the amount of vertical padding within each cell.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /** Whether the ListView should be displayed with a quiet style. */\n  isQuiet?: boolean,\n  /** The current loading state of the ListView. Determines whether or not the progress circle should be shown. */\n  loadingState?: LoadingState,\n  /**\n   * Sets the text behavior for the row contents.\n   * @default 'truncate'\n   */\n  overflowMode?: 'truncate' | 'wrap',\n  /** Sets what the ListView should render when there is no content to display. */\n  renderEmptyState?: () => JSX.Element,\n  /**\n   * Handler that is called when a user performs an action on an item. The exact user event depends on\n   * the collection's `selectionStyle` prop and the interaction modality.\n   */\n  onAction?: (key: Key) => void,\n  /**\n   * The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListView.\n   */\n  dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks']\n}\n\ninterface ListViewContextValue<T> {\n  state: ListState<T>,\n  dragState: DraggableCollectionState | null,\n  dropState: DroppableCollectionState | null,\n  dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks'],\n  onAction?: (key: Key) => void,\n  isListDraggable: boolean,\n  isListDroppable: boolean,\n  layout: ListViewLayout<T>,\n  loadingState?: LoadingState,\n  renderEmptyState?: () => JSX.Element\n}\n\nexport const ListViewContext = React.createContext<ListViewContextValue<unknown> | null>(null);\n\nconst ROW_HEIGHTS = {\n  compact: {\n    medium: 32,\n    large: 40\n  },\n  regular: {\n    medium: 40,\n    large: 50\n  },\n  spacious: {\n    medium: 48,\n    large: 60\n  }\n};\n\nfunction useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {\n  let {scale} = useProvider();\n  let layout = useMemo(() =>\n    new ListViewLayout<T>({\n      estimatedRowHeight: ROW_HEIGHTS[density || 'regular'][scale]\n    })\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    , [scale, density, overflowMode]);\n\n  return layout;\n}\n\n/**\n * A ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.\n */\nexport const ListView = React.forwardRef(function ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  let {\n    density = 'regular',\n    loadingState,\n    onLoadMore,\n    isQuiet,\n    overflowMode = 'truncate',\n    onAction,\n    dragAndDropHooks,\n    renderEmptyState,\n    ...otherProps\n  } = props;\n  let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n  let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n  let dragHooksProvided = useRef(isListDraggable);\n  let dropHooksProvided = useRef(isListDroppable);\n  useEffect(() => {\n    if (dragHooksProvided.current !== isListDraggable) {\n      console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n    }\n    if (dropHooksProvided.current !== isListDroppable) {\n      console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n    }\n  }, [isListDraggable, isListDroppable]);\n\n  let domRef = useDOMRef(ref);\n  let state = useListState({\n    ...props,\n    selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'\n  });\n  let {collection, selectionManager} = state;\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n\n  let {styleProps} = useStyleProps(props);\n  let dragState: DraggableCollectionState | null = null;\n  let preview = useRef(null);\n  if (isListDraggable && dragAndDropHooks) {\n    dragState = dragAndDropHooks.useDraggableCollectionState!({\n      collection,\n      selectionManager,\n      preview\n    });\n    dragAndDropHooks.useDraggableCollection!({}, dragState, domRef);\n  }\n  let layout = useListLayout(\n    state,\n    props.density || 'regular',\n    overflowMode\n  );\n\n  let DragPreview = dragAndDropHooks?.DragPreview;\n  let dropState: DroppableCollectionState | null = null;\n  let droppableCollection: DroppableCollectionResult | null = null;\n  let isRootDropTarget = false;\n  if (isListDroppable && dragAndDropHooks) {\n    dropState = dragAndDropHooks.useDroppableCollectionState!({\n      collection,\n      selectionManager\n    });\n    droppableCollection = dragAndDropHooks.useDroppableCollection!({\n      keyboardDelegate: new ListKeyboardDelegate({\n        collection,\n        disabledKeys: dragState?.draggingKeys.size ? undefined : selectionManager.disabledKeys,\n        ref: domRef,\n        layoutDelegate: layout\n      }),\n      dropTargetDelegate: layout\n    }, dropState, domRef);\n\n    isRootDropTarget = dropState.isDropTarget({type: 'root'});\n  }\n\n  let {gridProps} = useGridList({\n    ...props,\n    isVirtualized: true,\n    layoutDelegate: layout,\n    onAction\n  }, state, domRef);\n\n  let focusedKey = selectionManager.focusedKey;\n  let dropTargetKey: Key | null = null;\n  if (dropState?.target?.type === 'item') {\n    dropTargetKey = dropState.target.key;\n    if (dropState.target.dropPosition === 'after') {\n      // Normalize to the \"before\" drop position since we only render those in the DOM.\n      dropTargetKey = state.collection.getKeyAfter(dropTargetKey) ?? dropTargetKey;\n    }\n  }\n\n  let persistedKeys = useMemo(() => {\n    return new Set([focusedKey, dropTargetKey].filter(k => k !== null));\n  }, [focusedKey, dropTargetKey]);\n\n  // wait for layout to get accurate measurements\n  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);\n  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useLayoutEffect(() => {\n    if (domRef.current) {\n      // 2 is the width of the border which is not part of the box size\n      setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);\n      setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);\n    }\n  });\n\n  let hasAnyChildren = useMemo(() => [...collection].some(item => item.hasChildNodes), [collection]);\n\n  return (\n    <ListViewContext.Provider value={{state, dragState, dropState, dragAndDropHooks, onAction, isListDraggable, isListDroppable, layout, loadingState, renderEmptyState}}>\n      <FocusScope>\n        <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n          <Virtualizer\n            {...mergeProps(isListDroppable ? droppableCollection?.collectionProps : null, gridProps)}\n            {...filterDOMProps(otherProps)}\n            {...gridProps}\n            {...styleProps}\n            isLoading={isLoading}\n            onLoadMore={onLoadMore}\n            ref={domRef}\n            persistedKeys={persistedKeys}\n            scrollDirection=\"vertical\"\n            className={\n              classNames(\n                listStyles,\n                'react-spectrum-ListView',\n                `react-spectrum-ListView--${density}`,\n                'react-spectrum-ListView--emphasized',\n                {\n                  'react-spectrum-ListView--quiet': isQuiet,\n                  'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',\n                  'react-spectrum-ListView--draggable': !!isListDraggable,\n                  'react-spectrum-ListView--dropTarget': !!isRootDropTarget,\n                  'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,\n                  'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,\n                  'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,\n                  'react-spectrum-ListView--wrap': overflowMode === 'wrap'\n                },\n                styleProps.className\n              )\n            }\n            layout={layout}\n            layoutOptions={useMemo(() => ({isLoading}), [isLoading])}\n            collection={collection}>\n            {useCallback((type, item: Node<T>) => {\n              if (type === 'item') {\n                return <Item item={item} />;\n              } else if (type === 'loader') {\n                return <LoadingView />;\n              } else if (type === 'placeholder') {\n                return <EmptyState />;\n              }\n            }, [])}\n          </Virtualizer>\n        </FocusRing>\n      </FocusScope>\n      {DragPreview && isListDraggable && dragAndDropHooks && dragState &&\n        <DragPreview ref={preview}>\n          {() => {\n            if (dragState.draggedKey == null) {\n              return null;\n            }\n            if (dragAndDropHooks.renderPreview) {\n              return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);\n            }\n            let item = state.collection.getItem(dragState.draggedKey);\n            if (!item) {\n              return null;\n            }\n            let itemCount = dragState.draggingKeys.size;\n            let itemHeight = layout.getLayoutInfo(dragState.draggedKey)?.rect.height ?? 0;\n            return <SpectrumDragPreview item={item} itemCount={itemCount} itemHeight={itemHeight} density={density}  />;\n          }}\n        </DragPreview>\n      }\n    </ListViewContext.Provider>\n  );\n}) as <T>(props: SpectrumListViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction Item({item}: {item: Node<unknown>}) {\n  let {isListDroppable, state, onAction} = useContext(ListViewContext)!;\n  return (\n    <>\n      {isListDroppable && state.collection.getKeyBefore(item.key) == null &&\n        <RootDropIndicator key=\"root\" />\n      }\n      {isListDroppable &&\n        <InsertionIndicator\n          key={`${item.key}-before`}\n          target={{key: item.key, type: 'item', dropPosition: 'before'}} />\n      }\n      <ListViewItem item={item} isEmphasized hasActions={!!onAction} />\n      {isListDroppable &&\n        <InsertionIndicator\n          key={`${item.key}-after`}\n          target={{key: item.key, type: 'item', dropPosition: 'after'}}\n          isPresentationOnly={state.collection.getKeyAfter(item.key) != null} />\n      }\n    </>\n  );\n}\n\nfunction LoadingView() {\n  let {state} = useContext(ListViewContext)!;\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useContext(ListViewContext)!;\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return (\n    <CenteredWrapper>\n      {emptyState}\n    </CenteredWrapper>\n  );\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useContext(ListViewContext)!;\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListView-centeredWrapper',\n          {\n            'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0\n          }\n        )}>\n      <div role=\"gridcell\">\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"ListView.main.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/list/src/ListView.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaGridListProps, useGridList} from '@react-aria/gridlist';\nimport {AsyncLoadable, DOMRef, Key, LoadingState, Node, SpectrumSelectionProps, StyleProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport type {DragAndDropHooks} from '@react-spectrum/dnd';\nimport type {DraggableCollectionState, DroppableCollectionState} from '@react-stately/dnd';\nimport type {DroppableCollectionResult} from '@react-aria/dnd';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {FocusRing, FocusScope} from '@react-aria/focus';\nimport InsertionIndicator from './InsertionIndicator';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate} from '@react-aria/selection';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\nimport {ListViewLayout} from './ListViewLayout';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport RootDropIndicator from './RootDropIndicator';\nimport {DragPreview as SpectrumDragPreview} from './DragPreview';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer} from '@react-aria/virtualizer';\n\nexport interface SpectrumListViewProps<T> extends Omit<AriaGridListProps<T>, 'keyboardNavigationBehavior'>, StyleProps, SpectrumSelectionProps, Omit<AsyncLoadable, 'isLoading'> {\n  /**\n   * Sets the amount of vertical padding within each cell.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /** Whether the ListView should be displayed with a quiet style. */\n  isQuiet?: boolean,\n  /** The current loading state of the ListView. Determines whether or not the progress circle should be shown. */\n  loadingState?: LoadingState,\n  /**\n   * Sets the text behavior for the row contents.\n   * @default 'truncate'\n   */\n  overflowMode?: 'truncate' | 'wrap',\n  /** Sets what the ListView should render when there is no content to display. */\n  renderEmptyState?: () => JSX.Element,\n  /**\n   * Handler that is called when a user performs an action on an item. The exact user event depends on\n   * the collection's `selectionStyle` prop and the interaction modality.\n   */\n  onAction?: (key: Key) => void,\n  /**\n   * The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListView.\n   */\n  dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks']\n}\n\ninterface ListViewContextValue<T> {\n  state: ListState<T>,\n  dragState: DraggableCollectionState | null,\n  dropState: DroppableCollectionState | null,\n  dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks'],\n  onAction?: (key: Key) => void,\n  isListDraggable: boolean,\n  isListDroppable: boolean,\n  layout: ListViewLayout<T>,\n  loadingState?: LoadingState,\n  renderEmptyState?: () => JSX.Element\n}\n\nexport const ListViewContext = React.createContext<ListViewContextValue<unknown> | null>(null);\n\nconst ROW_HEIGHTS = {\n  compact: {\n    medium: 32,\n    large: 40\n  },\n  regular: {\n    medium: 40,\n    large: 50\n  },\n  spacious: {\n    medium: 48,\n    large: 60\n  }\n};\n\nfunction useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {\n  let {scale} = useProvider();\n  let layout = useMemo(() =>\n    new ListViewLayout<T>({\n      estimatedRowHeight: ROW_HEIGHTS[density || 'regular'][scale]\n    })\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    , [scale, density, overflowMode]);\n\n  return layout;\n}\n\n/**\n * A ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.\n */\nexport const ListView = React.forwardRef(function ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  let {\n    density = 'regular',\n    loadingState,\n    onLoadMore,\n    isQuiet,\n    overflowMode = 'truncate',\n    onAction,\n    dragAndDropHooks,\n    renderEmptyState,\n    ...otherProps\n  } = props;\n  let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n  let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n  let dragHooksProvided = useRef(isListDraggable);\n  let dropHooksProvided = useRef(isListDroppable);\n  useEffect(() => {\n    if (dragHooksProvided.current !== isListDraggable && process.env.NODE_ENV !== 'production') {\n      console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n    }\n    if (dropHooksProvided.current !== isListDroppable && process.env.NODE_ENV !== 'production') {\n      console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n    }\n  }, [isListDraggable, isListDroppable]);\n\n  let domRef = useDOMRef(ref);\n  let state = useListState({\n    ...props,\n    selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'\n  });\n  let {collection, selectionManager} = state;\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n\n  let {styleProps} = useStyleProps(props);\n  let dragState: DraggableCollectionState | null = null;\n  let preview = useRef(null);\n  if (isListDraggable && dragAndDropHooks) {\n    dragState = dragAndDropHooks.useDraggableCollectionState!({\n      collection,\n      selectionManager,\n      preview\n    });\n    dragAndDropHooks.useDraggableCollection!({}, dragState, domRef);\n  }\n  let layout = useListLayout(\n    state,\n    props.density || 'regular',\n    overflowMode\n  );\n\n  let DragPreview = dragAndDropHooks?.DragPreview;\n  let dropState: DroppableCollectionState | null = null;\n  let droppableCollection: DroppableCollectionResult | null = null;\n  let isRootDropTarget = false;\n  if (isListDroppable && dragAndDropHooks) {\n    dropState = dragAndDropHooks.useDroppableCollectionState!({\n      collection,\n      selectionManager\n    });\n    droppableCollection = dragAndDropHooks.useDroppableCollection!({\n      keyboardDelegate: new ListKeyboardDelegate({\n        collection,\n        disabledKeys: dragState?.draggingKeys.size ? undefined : selectionManager.disabledKeys,\n        ref: domRef,\n        layoutDelegate: layout\n      }),\n      dropTargetDelegate: layout\n    }, dropState, domRef);\n\n    isRootDropTarget = dropState.isDropTarget({type: 'root'});\n  }\n\n  let {gridProps} = useGridList({\n    ...props,\n    isVirtualized: true,\n    layoutDelegate: layout,\n    onAction\n  }, state, domRef);\n\n  let focusedKey = selectionManager.focusedKey;\n  let dropTargetKey: Key | null = null;\n  if (dropState?.target?.type === 'item') {\n    dropTargetKey = dropState.target.key;\n    if (dropState.target.dropPosition === 'after') {\n      // Normalize to the \"before\" drop position since we only render those in the DOM.\n      dropTargetKey = state.collection.getKeyAfter(dropTargetKey) ?? dropTargetKey;\n    }\n  }\n\n  let persistedKeys = useMemo(() => {\n    return new Set([focusedKey, dropTargetKey].filter(k => k !== null));\n  }, [focusedKey, dropTargetKey]);\n\n  // wait for layout to get accurate measurements\n  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);\n  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useLayoutEffect(() => {\n    if (domRef.current) {\n      // 2 is the width of the border which is not part of the box size\n      setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);\n      setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);\n    }\n  });\n\n  let hasAnyChildren = useMemo(() => [...collection].some(item => item.hasChildNodes), [collection]);\n\n  return (\n    <ListViewContext.Provider value={{state, dragState, dropState, dragAndDropHooks, onAction, isListDraggable, isListDroppable, layout, loadingState, renderEmptyState}}>\n      <FocusScope>\n        <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n          <Virtualizer\n            {...mergeProps(isListDroppable ? droppableCollection?.collectionProps : null, gridProps)}\n            {...filterDOMProps(otherProps)}\n            {...gridProps}\n            {...styleProps}\n            isLoading={isLoading}\n            onLoadMore={onLoadMore}\n            ref={domRef}\n            persistedKeys={persistedKeys}\n            scrollDirection=\"vertical\"\n            className={\n              classNames(\n                listStyles,\n                'react-spectrum-ListView',\n                `react-spectrum-ListView--${density}`,\n                'react-spectrum-ListView--emphasized',\n                {\n                  'react-spectrum-ListView--quiet': isQuiet,\n                  'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',\n                  'react-spectrum-ListView--draggable': !!isListDraggable,\n                  'react-spectrum-ListView--dropTarget': !!isRootDropTarget,\n                  'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,\n                  'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,\n                  'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,\n                  'react-spectrum-ListView--wrap': overflowMode === 'wrap'\n                },\n                styleProps.className\n              )\n            }\n            layout={layout}\n            layoutOptions={useMemo(() => ({isLoading}), [isLoading])}\n            collection={collection}>\n            {useCallback((type, item: Node<T>) => {\n              if (type === 'item') {\n                return <Item item={item} />;\n              } else if (type === 'loader') {\n                return <LoadingView />;\n              } else if (type === 'placeholder') {\n                return <EmptyState />;\n              }\n            }, [])}\n          </Virtualizer>\n        </FocusRing>\n      </FocusScope>\n      {DragPreview && isListDraggable && dragAndDropHooks && dragState &&\n        <DragPreview ref={preview}>\n          {() => {\n            if (dragState.draggedKey == null) {\n              return null;\n            }\n            if (dragAndDropHooks.renderPreview) {\n              return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);\n            }\n            let item = state.collection.getItem(dragState.draggedKey);\n            if (!item) {\n              return null;\n            }\n            let itemCount = dragState.draggingKeys.size;\n            let itemHeight = layout.getLayoutInfo(dragState.draggedKey)?.rect.height ?? 0;\n            return <SpectrumDragPreview item={item} itemCount={itemCount} itemHeight={itemHeight} density={density}  />;\n          }}\n        </DragPreview>\n      }\n    </ListViewContext.Provider>\n  );\n}) as <T>(props: SpectrumListViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction Item({item}: {item: Node<unknown>}) {\n  let {isListDroppable, state, onAction} = useContext(ListViewContext)!;\n  return (\n    <>\n      {isListDroppable && state.collection.getKeyBefore(item.key) == null &&\n        <RootDropIndicator key=\"root\" />\n      }\n      {isListDroppable &&\n        <InsertionIndicator\n          key={`${item.key}-before`}\n          target={{key: item.key, type: 'item', dropPosition: 'before'}} />\n      }\n      <ListViewItem item={item} isEmphasized hasActions={!!onAction} />\n      {isListDroppable &&\n        <InsertionIndicator\n          key={`${item.key}-after`}\n          target={{key: item.key, type: 'item', dropPosition: 'after'}}\n          isPresentationOnly={state.collection.getKeyAfter(item.key) != null} />\n      }\n    </>\n  );\n}\n\nfunction LoadingView() {\n  let {state} = useContext(ListViewContext)!;\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useContext(ListViewContext)!;\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return (\n    <CenteredWrapper>\n      {emptyState}\n    </CenteredWrapper>\n  );\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useContext(ListViewContext)!;\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListView-centeredWrapper',\n          {\n            'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0\n          }\n        )}>\n      <div role=\"gridcell\">\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"ListView.main.js.map"}

package/dist/ListView.mjs

@@ -1,6 +1,6 @@
 import $0a834ddbc989a3e3$export$2e2bcd8739ae039 from "./InsertionIndicator.mjs";
 import $6w3ZV$intlStringsmodulejs from "./intlStrings.mjs";
-import "./styles.ad343ab0.css";
+import "./list.5918e378.css";
 import $6w3ZV$styles_cssmodulejs from "./styles_css.mjs";
 import {ListViewItem as $d7c07ca2efc5ba02$export$c6bde0c04b033c0e} from "./ListViewItem.mjs";
 import {ListViewLayout as $bc6cc67dd6240ebd$export$dab781655dfbb7d3} from "./ListViewLayout.mjs";
@@ -84,8 +84,8 @@ const $f85fb77f9d4cbc6c$export$84d0dd190d551cd1 = /*#__PURE__*/ (0, $6w3ZV$react
     let dragHooksProvided = (0, $6w3ZV$useRef)(isListDraggable);
     let dropHooksProvided = (0, $6w3ZV$useRef)(isListDroppable);
     (0, $6w3ZV$useEffect)(()=>{
-        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.');
+        if (dragHooksProvided.current !== isListDraggable && process.env.NODE_ENV !== 'production') console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
+        if (dropHooksProvided.current !== isListDroppable && process.env.NODE_ENV !== 'production') console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
     }, [
         isListDraggable,
         isListDroppable

package/dist/ListView.module.js

@@ -1,6 +1,6 @@
 import $0a834ddbc989a3e3$export$2e2bcd8739ae039 from "./InsertionIndicator.module.js";
 import $6w3ZV$intlStringsmodulejs from "./intlStrings.module.js";
-import "./styles.ad343ab0.css";
+import "./list.5918e378.css";
 import $6w3ZV$styles_cssmodulejs from "./styles_css.module.js";
 import {ListViewItem as $d7c07ca2efc5ba02$export$c6bde0c04b033c0e} from "./ListViewItem.module.js";
 import {ListViewLayout as $bc6cc67dd6240ebd$export$dab781655dfbb7d3} from "./ListViewLayout.module.js";
@@ -84,8 +84,8 @@ const $f85fb77f9d4cbc6c$export$84d0dd190d551cd1 = /*#__PURE__*/ (0, $6w3ZV$react
     let dragHooksProvided = (0, $6w3ZV$useRef)(isListDraggable);
     let dropHooksProvided = (0, $6w3ZV$useRef)(isListDroppable);
     (0, $6w3ZV$useEffect)(()=>{
-        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.');
+        if (dragHooksProvided.current !== isListDraggable && process.env.NODE_ENV !== 'production') console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
+        if (dropHooksProvided.current !== isListDroppable && process.env.NODE_ENV !== 'production') console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
     }, [
         isListDraggable,
         isListDroppable

package/dist/ListView.module.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/list/src/ListView.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaGridListProps, useGridList} from '@react-aria/gridlist';\nimport {AsyncLoadable, DOMRef, Key, LoadingState, Node, SpectrumSelectionProps, StyleProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport type {DragAndDropHooks} from '@react-spectrum/dnd';\nimport type {DraggableCollectionState, DroppableCollectionState} from '@react-stately/dnd';\nimport type {DroppableCollectionResult} from '@react-aria/dnd';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {FocusRing, FocusScope} from '@react-aria/focus';\nimport InsertionIndicator from './InsertionIndicator';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate} from '@react-aria/selection';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\nimport {ListViewLayout} from './ListViewLayout';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport RootDropIndicator from './RootDropIndicator';\nimport {DragPreview as SpectrumDragPreview} from './DragPreview';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer} from '@react-aria/virtualizer';\n\nexport interface SpectrumListViewProps<T> extends Omit<AriaGridListProps<T>, 'keyboardNavigationBehavior'>, StyleProps, SpectrumSelectionProps, Omit<AsyncLoadable, 'isLoading'> {\n  /**\n   * Sets the amount of vertical padding within each cell.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /** Whether the ListView should be displayed with a quiet style. */\n  isQuiet?: boolean,\n  /** The current loading state of the ListView. Determines whether or not the progress circle should be shown. */\n  loadingState?: LoadingState,\n  /**\n   * Sets the text behavior for the row contents.\n   * @default 'truncate'\n   */\n  overflowMode?: 'truncate' | 'wrap',\n  /** Sets what the ListView should render when there is no content to display. */\n  renderEmptyState?: () => JSX.Element,\n  /**\n   * Handler that is called when a user performs an action on an item. The exact user event depends on\n   * the collection's `selectionStyle` prop and the interaction modality.\n   */\n  onAction?: (key: Key) => void,\n  /**\n   * The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListView.\n   */\n  dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks']\n}\n\ninterface ListViewContextValue<T> {\n  state: ListState<T>,\n  dragState: DraggableCollectionState | null,\n  dropState: DroppableCollectionState | null,\n  dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks'],\n  onAction?: (key: Key) => void,\n  isListDraggable: boolean,\n  isListDroppable: boolean,\n  layout: ListViewLayout<T>,\n  loadingState?: LoadingState,\n  renderEmptyState?: () => JSX.Element\n}\n\nexport const ListViewContext = React.createContext<ListViewContextValue<unknown> | null>(null);\n\nconst ROW_HEIGHTS = {\n  compact: {\n    medium: 32,\n    large: 40\n  },\n  regular: {\n    medium: 40,\n    large: 50\n  },\n  spacious: {\n    medium: 48,\n    large: 60\n  }\n};\n\nfunction useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {\n  let {scale} = useProvider();\n  let layout = useMemo(() =>\n    new ListViewLayout<T>({\n      estimatedRowHeight: ROW_HEIGHTS[density || 'regular'][scale]\n    })\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    , [scale, density, overflowMode]);\n\n  return layout;\n}\n\n/**\n * A ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.\n */\nexport const ListView = React.forwardRef(function ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  let {\n    density = 'regular',\n    loadingState,\n    onLoadMore,\n    isQuiet,\n    overflowMode = 'truncate',\n    onAction,\n    dragAndDropHooks,\n    renderEmptyState,\n    ...otherProps\n  } = props;\n  let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n  let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n  let dragHooksProvided = useRef(isListDraggable);\n  let dropHooksProvided = useRef(isListDroppable);\n  useEffect(() => {\n    if (dragHooksProvided.current !== isListDraggable) {\n      console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n    }\n    if (dropHooksProvided.current !== isListDroppable) {\n      console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n    }\n  }, [isListDraggable, isListDroppable]);\n\n  let domRef = useDOMRef(ref);\n  let state = useListState({\n    ...props,\n    selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'\n  });\n  let {collection, selectionManager} = state;\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n\n  let {styleProps} = useStyleProps(props);\n  let dragState: DraggableCollectionState | null = null;\n  let preview = useRef(null);\n  if (isListDraggable && dragAndDropHooks) {\n    dragState = dragAndDropHooks.useDraggableCollectionState!({\n      collection,\n      selectionManager,\n      preview\n    });\n    dragAndDropHooks.useDraggableCollection!({}, dragState, domRef);\n  }\n  let layout = useListLayout(\n    state,\n    props.density || 'regular',\n    overflowMode\n  );\n\n  let DragPreview = dragAndDropHooks?.DragPreview;\n  let dropState: DroppableCollectionState | null = null;\n  let droppableCollection: DroppableCollectionResult | null = null;\n  let isRootDropTarget = false;\n  if (isListDroppable && dragAndDropHooks) {\n    dropState = dragAndDropHooks.useDroppableCollectionState!({\n      collection,\n      selectionManager\n    });\n    droppableCollection = dragAndDropHooks.useDroppableCollection!({\n      keyboardDelegate: new ListKeyboardDelegate({\n        collection,\n        disabledKeys: dragState?.draggingKeys.size ? undefined : selectionManager.disabledKeys,\n        ref: domRef,\n        layoutDelegate: layout\n      }),\n      dropTargetDelegate: layout\n    }, dropState, domRef);\n\n    isRootDropTarget = dropState.isDropTarget({type: 'root'});\n  }\n\n  let {gridProps} = useGridList({\n    ...props,\n    isVirtualized: true,\n    layoutDelegate: layout,\n    onAction\n  }, state, domRef);\n\n  let focusedKey = selectionManager.focusedKey;\n  let dropTargetKey: Key | null = null;\n  if (dropState?.target?.type === 'item') {\n    dropTargetKey = dropState.target.key;\n    if (dropState.target.dropPosition === 'after') {\n      // Normalize to the \"before\" drop position since we only render those in the DOM.\n      dropTargetKey = state.collection.getKeyAfter(dropTargetKey) ?? dropTargetKey;\n    }\n  }\n\n  let persistedKeys = useMemo(() => {\n    return new Set([focusedKey, dropTargetKey].filter(k => k !== null));\n  }, [focusedKey, dropTargetKey]);\n\n  // wait for layout to get accurate measurements\n  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);\n  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useLayoutEffect(() => {\n    if (domRef.current) {\n      // 2 is the width of the border which is not part of the box size\n      setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);\n      setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);\n    }\n  });\n\n  let hasAnyChildren = useMemo(() => [...collection].some(item => item.hasChildNodes), [collection]);\n\n  return (\n    <ListViewContext.Provider value={{state, dragState, dropState, dragAndDropHooks, onAction, isListDraggable, isListDroppable, layout, loadingState, renderEmptyState}}>\n      <FocusScope>\n        <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n          <Virtualizer\n            {...mergeProps(isListDroppable ? droppableCollection?.collectionProps : null, gridProps)}\n            {...filterDOMProps(otherProps)}\n            {...gridProps}\n            {...styleProps}\n            isLoading={isLoading}\n            onLoadMore={onLoadMore}\n            ref={domRef}\n            persistedKeys={persistedKeys}\n            scrollDirection=\"vertical\"\n            className={\n              classNames(\n                listStyles,\n                'react-spectrum-ListView',\n                `react-spectrum-ListView--${density}`,\n                'react-spectrum-ListView--emphasized',\n                {\n                  'react-spectrum-ListView--quiet': isQuiet,\n                  'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',\n                  'react-spectrum-ListView--draggable': !!isListDraggable,\n                  'react-spectrum-ListView--dropTarget': !!isRootDropTarget,\n                  'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,\n                  'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,\n                  'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,\n                  'react-spectrum-ListView--wrap': overflowMode === 'wrap'\n                },\n                styleProps.className\n              )\n            }\n            layout={layout}\n            layoutOptions={useMemo(() => ({isLoading}), [isLoading])}\n            collection={collection}>\n            {useCallback((type, item: Node<T>) => {\n              if (type === 'item') {\n                return <Item item={item} />;\n              } else if (type === 'loader') {\n                return <LoadingView />;\n              } else if (type === 'placeholder') {\n                return <EmptyState />;\n              }\n            }, [])}\n          </Virtualizer>\n        </FocusRing>\n      </FocusScope>\n      {DragPreview && isListDraggable && dragAndDropHooks && dragState &&\n        <DragPreview ref={preview}>\n          {() => {\n            if (dragState.draggedKey == null) {\n              return null;\n            }\n            if (dragAndDropHooks.renderPreview) {\n              return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);\n            }\n            let item = state.collection.getItem(dragState.draggedKey);\n            if (!item) {\n              return null;\n            }\n            let itemCount = dragState.draggingKeys.size;\n            let itemHeight = layout.getLayoutInfo(dragState.draggedKey)?.rect.height ?? 0;\n            return <SpectrumDragPreview item={item} itemCount={itemCount} itemHeight={itemHeight} density={density}  />;\n          }}\n        </DragPreview>\n      }\n    </ListViewContext.Provider>\n  );\n}) as <T>(props: SpectrumListViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction Item({item}: {item: Node<unknown>}) {\n  let {isListDroppable, state, onAction} = useContext(ListViewContext)!;\n  return (\n    <>\n      {isListDroppable && state.collection.getKeyBefore(item.key) == null &&\n        <RootDropIndicator key=\"root\" />\n      }\n      {isListDroppable &&\n        <InsertionIndicator\n          key={`${item.key}-before`}\n          target={{key: item.key, type: 'item', dropPosition: 'before'}} />\n      }\n      <ListViewItem item={item} isEmphasized hasActions={!!onAction} />\n      {isListDroppable &&\n        <InsertionIndicator\n          key={`${item.key}-after`}\n          target={{key: item.key, type: 'item', dropPosition: 'after'}}\n          isPresentationOnly={state.collection.getKeyAfter(item.key) != null} />\n      }\n    </>\n  );\n}\n\nfunction LoadingView() {\n  let {state} = useContext(ListViewContext)!;\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useContext(ListViewContext)!;\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return (\n    <CenteredWrapper>\n      {emptyState}\n    </CenteredWrapper>\n  );\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useContext(ListViewContext)!;\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListView-centeredWrapper',\n          {\n            'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0\n          }\n        )}>\n      <div role=\"gridcell\">\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"ListView.module.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/list/src/ListView.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaGridListProps, useGridList} from '@react-aria/gridlist';\nimport {AsyncLoadable, DOMRef, Key, LoadingState, Node, SpectrumSelectionProps, StyleProps} from '@react-types/shared';\nimport {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';\nimport type {DragAndDropHooks} from '@react-spectrum/dnd';\nimport type {DraggableCollectionState, DroppableCollectionState} from '@react-stately/dnd';\nimport type {DroppableCollectionResult} from '@react-aria/dnd';\nimport {filterDOMProps, mergeProps, useLayoutEffect} from '@react-aria/utils';\nimport {FocusRing, FocusScope} from '@react-aria/focus';\nimport InsertionIndicator from './InsertionIndicator';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {ListKeyboardDelegate} from '@react-aria/selection';\nimport {ListState, useListState} from '@react-stately/list';\nimport listStyles from './styles.css';\nimport {ListViewItem} from './ListViewItem';\nimport {ListViewLayout} from './ListViewLayout';\nimport {ProgressCircle} from '@react-spectrum/progress';\nimport React, {JSX, ReactElement, useCallback, useContext, useEffect, useMemo, useRef, useState} from 'react';\nimport RootDropIndicator from './RootDropIndicator';\nimport {DragPreview as SpectrumDragPreview} from './DragPreview';\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useProvider} from '@react-spectrum/provider';\nimport {Virtualizer} from '@react-aria/virtualizer';\n\nexport interface SpectrumListViewProps<T> extends Omit<AriaGridListProps<T>, 'keyboardNavigationBehavior'>, StyleProps, SpectrumSelectionProps, Omit<AsyncLoadable, 'isLoading'> {\n  /**\n   * Sets the amount of vertical padding within each cell.\n   * @default 'regular'\n   */\n  density?: 'compact' | 'regular' | 'spacious',\n  /** Whether the ListView should be displayed with a quiet style. */\n  isQuiet?: boolean,\n  /** The current loading state of the ListView. Determines whether or not the progress circle should be shown. */\n  loadingState?: LoadingState,\n  /**\n   * Sets the text behavior for the row contents.\n   * @default 'truncate'\n   */\n  overflowMode?: 'truncate' | 'wrap',\n  /** Sets what the ListView should render when there is no content to display. */\n  renderEmptyState?: () => JSX.Element,\n  /**\n   * Handler that is called when a user performs an action on an item. The exact user event depends on\n   * the collection's `selectionStyle` prop and the interaction modality.\n   */\n  onAction?: (key: Key) => void,\n  /**\n   * The drag and drop hooks returned by `useDragAndDrop` used to enable drag and drop behavior for the ListView.\n   */\n  dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks']\n}\n\ninterface ListViewContextValue<T> {\n  state: ListState<T>,\n  dragState: DraggableCollectionState | null,\n  dropState: DroppableCollectionState | null,\n  dragAndDropHooks?: DragAndDropHooks['dragAndDropHooks'],\n  onAction?: (key: Key) => void,\n  isListDraggable: boolean,\n  isListDroppable: boolean,\n  layout: ListViewLayout<T>,\n  loadingState?: LoadingState,\n  renderEmptyState?: () => JSX.Element\n}\n\nexport const ListViewContext = React.createContext<ListViewContextValue<unknown> | null>(null);\n\nconst ROW_HEIGHTS = {\n  compact: {\n    medium: 32,\n    large: 40\n  },\n  regular: {\n    medium: 40,\n    large: 50\n  },\n  spacious: {\n    medium: 48,\n    large: 60\n  }\n};\n\nfunction useListLayout<T>(state: ListState<T>, density: SpectrumListViewProps<T>['density'], overflowMode: SpectrumListViewProps<T>['overflowMode']) {\n  let {scale} = useProvider();\n  let layout = useMemo(() =>\n    new ListViewLayout<T>({\n      estimatedRowHeight: ROW_HEIGHTS[density || 'regular'][scale]\n    })\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    , [scale, density, overflowMode]);\n\n  return layout;\n}\n\n/**\n * A ListView displays a list of interactive items, and allows a user to navigate, select, or perform an action.\n */\nexport const ListView = React.forwardRef(function ListView<T extends object>(props: SpectrumListViewProps<T>, ref: DOMRef<HTMLDivElement>) {\n  let {\n    density = 'regular',\n    loadingState,\n    onLoadMore,\n    isQuiet,\n    overflowMode = 'truncate',\n    onAction,\n    dragAndDropHooks,\n    renderEmptyState,\n    ...otherProps\n  } = props;\n  let isListDraggable = !!dragAndDropHooks?.useDraggableCollectionState;\n  let isListDroppable = !!dragAndDropHooks?.useDroppableCollectionState;\n  let dragHooksProvided = useRef(isListDraggable);\n  let dropHooksProvided = useRef(isListDroppable);\n  useEffect(() => {\n    if (dragHooksProvided.current !== isListDraggable && process.env.NODE_ENV !== 'production') {\n      console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n    }\n    if (dropHooksProvided.current !== isListDroppable && process.env.NODE_ENV !== 'production') {\n      console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');\n    }\n  }, [isListDraggable, isListDroppable]);\n\n  let domRef = useDOMRef(ref);\n  let state = useListState({\n    ...props,\n    selectionBehavior: props.selectionStyle === 'highlight' ? 'replace' : 'toggle'\n  });\n  let {collection, selectionManager} = state;\n  let isLoading = loadingState === 'loading' || loadingState === 'loadingMore';\n\n  let {styleProps} = useStyleProps(props);\n  let dragState: DraggableCollectionState | null = null;\n  let preview = useRef(null);\n  if (isListDraggable && dragAndDropHooks) {\n    dragState = dragAndDropHooks.useDraggableCollectionState!({\n      collection,\n      selectionManager,\n      preview\n    });\n    dragAndDropHooks.useDraggableCollection!({}, dragState, domRef);\n  }\n  let layout = useListLayout(\n    state,\n    props.density || 'regular',\n    overflowMode\n  );\n\n  let DragPreview = dragAndDropHooks?.DragPreview;\n  let dropState: DroppableCollectionState | null = null;\n  let droppableCollection: DroppableCollectionResult | null = null;\n  let isRootDropTarget = false;\n  if (isListDroppable && dragAndDropHooks) {\n    dropState = dragAndDropHooks.useDroppableCollectionState!({\n      collection,\n      selectionManager\n    });\n    droppableCollection = dragAndDropHooks.useDroppableCollection!({\n      keyboardDelegate: new ListKeyboardDelegate({\n        collection,\n        disabledKeys: dragState?.draggingKeys.size ? undefined : selectionManager.disabledKeys,\n        ref: domRef,\n        layoutDelegate: layout\n      }),\n      dropTargetDelegate: layout\n    }, dropState, domRef);\n\n    isRootDropTarget = dropState.isDropTarget({type: 'root'});\n  }\n\n  let {gridProps} = useGridList({\n    ...props,\n    isVirtualized: true,\n    layoutDelegate: layout,\n    onAction\n  }, state, domRef);\n\n  let focusedKey = selectionManager.focusedKey;\n  let dropTargetKey: Key | null = null;\n  if (dropState?.target?.type === 'item') {\n    dropTargetKey = dropState.target.key;\n    if (dropState.target.dropPosition === 'after') {\n      // Normalize to the \"before\" drop position since we only render those in the DOM.\n      dropTargetKey = state.collection.getKeyAfter(dropTargetKey) ?? dropTargetKey;\n    }\n  }\n\n  let persistedKeys = useMemo(() => {\n    return new Set([focusedKey, dropTargetKey].filter(k => k !== null));\n  }, [focusedKey, dropTargetKey]);\n\n  // wait for layout to get accurate measurements\n  let [isVerticalScrollbarVisible, setVerticalScollbarVisible] = useState(false);\n  let [isHorizontalScrollbarVisible, setHorizontalScollbarVisible] = useState(false);\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useLayoutEffect(() => {\n    if (domRef.current) {\n      // 2 is the width of the border which is not part of the box size\n      setVerticalScollbarVisible(domRef.current.clientWidth + 2 < domRef.current.offsetWidth);\n      setHorizontalScollbarVisible(domRef.current.clientHeight + 2 < domRef.current.offsetHeight);\n    }\n  });\n\n  let hasAnyChildren = useMemo(() => [...collection].some(item => item.hasChildNodes), [collection]);\n\n  return (\n    <ListViewContext.Provider value={{state, dragState, dropState, dragAndDropHooks, onAction, isListDraggable, isListDroppable, layout, loadingState, renderEmptyState}}>\n      <FocusScope>\n        <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n          <Virtualizer\n            {...mergeProps(isListDroppable ? droppableCollection?.collectionProps : null, gridProps)}\n            {...filterDOMProps(otherProps)}\n            {...gridProps}\n            {...styleProps}\n            isLoading={isLoading}\n            onLoadMore={onLoadMore}\n            ref={domRef}\n            persistedKeys={persistedKeys}\n            scrollDirection=\"vertical\"\n            className={\n              classNames(\n                listStyles,\n                'react-spectrum-ListView',\n                `react-spectrum-ListView--${density}`,\n                'react-spectrum-ListView--emphasized',\n                {\n                  'react-spectrum-ListView--quiet': isQuiet,\n                  'react-spectrum-ListView--loadingMore': loadingState === 'loadingMore',\n                  'react-spectrum-ListView--draggable': !!isListDraggable,\n                  'react-spectrum-ListView--dropTarget': !!isRootDropTarget,\n                  'react-spectrum-ListView--isVerticalScrollbarVisible': isVerticalScrollbarVisible,\n                  'react-spectrum-ListView--isHorizontalScrollbarVisible': isHorizontalScrollbarVisible,\n                  'react-spectrum-ListView--hasAnyChildren': hasAnyChildren,\n                  'react-spectrum-ListView--wrap': overflowMode === 'wrap'\n                },\n                styleProps.className\n              )\n            }\n            layout={layout}\n            layoutOptions={useMemo(() => ({isLoading}), [isLoading])}\n            collection={collection}>\n            {useCallback((type, item: Node<T>) => {\n              if (type === 'item') {\n                return <Item item={item} />;\n              } else if (type === 'loader') {\n                return <LoadingView />;\n              } else if (type === 'placeholder') {\n                return <EmptyState />;\n              }\n            }, [])}\n          </Virtualizer>\n        </FocusRing>\n      </FocusScope>\n      {DragPreview && isListDraggable && dragAndDropHooks && dragState &&\n        <DragPreview ref={preview}>\n          {() => {\n            if (dragState.draggedKey == null) {\n              return null;\n            }\n            if (dragAndDropHooks.renderPreview) {\n              return dragAndDropHooks.renderPreview(dragState.draggingKeys, dragState.draggedKey);\n            }\n            let item = state.collection.getItem(dragState.draggedKey);\n            if (!item) {\n              return null;\n            }\n            let itemCount = dragState.draggingKeys.size;\n            let itemHeight = layout.getLayoutInfo(dragState.draggedKey)?.rect.height ?? 0;\n            return <SpectrumDragPreview item={item} itemCount={itemCount} itemHeight={itemHeight} density={density}  />;\n          }}\n        </DragPreview>\n      }\n    </ListViewContext.Provider>\n  );\n}) as <T>(props: SpectrumListViewProps<T> & {ref?: DOMRef<HTMLDivElement>}) => ReactElement;\n\nfunction Item({item}: {item: Node<unknown>}) {\n  let {isListDroppable, state, onAction} = useContext(ListViewContext)!;\n  return (\n    <>\n      {isListDroppable && state.collection.getKeyBefore(item.key) == null &&\n        <RootDropIndicator key=\"root\" />\n      }\n      {isListDroppable &&\n        <InsertionIndicator\n          key={`${item.key}-before`}\n          target={{key: item.key, type: 'item', dropPosition: 'before'}} />\n      }\n      <ListViewItem item={item} isEmphasized hasActions={!!onAction} />\n      {isListDroppable &&\n        <InsertionIndicator\n          key={`${item.key}-after`}\n          target={{key: item.key, type: 'item', dropPosition: 'after'}}\n          isPresentationOnly={state.collection.getKeyAfter(item.key) != null} />\n      }\n    </>\n  );\n}\n\nfunction LoadingView() {\n  let {state} = useContext(ListViewContext)!;\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/list');\n  return (\n    <CenteredWrapper>\n      <ProgressCircle\n        isIndeterminate\n        aria-label={state.collection.size > 0 ? stringFormatter.format('loadingMore') : stringFormatter.format('loading')} />\n    </CenteredWrapper>\n  );\n}\n\nfunction EmptyState() {\n  let {renderEmptyState} = useContext(ListViewContext)!;\n  let emptyState = renderEmptyState ? renderEmptyState() : null;\n  if (emptyState == null) {\n    return null;\n  }\n\n  return (\n    <CenteredWrapper>\n      {emptyState}\n    </CenteredWrapper>\n  );\n}\n\nfunction CenteredWrapper({children}) {\n  let {state} = useContext(ListViewContext)!;\n  return (\n    <div\n      role=\"row\"\n      aria-rowindex={state.collection.size + 1}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListView-centeredWrapper',\n          {\n            'react-spectrum-ListView-centeredWrapper--loadingMore': state.collection.size > 0\n          }\n        )}>\n      <div role=\"gridcell\">\n        {children}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"ListView.module.js.map"}

package/dist/ListViewItem.main.js

@@ -1,4 +1,4 @@
-require("./styles.ad343ab0.css");
+require("./list.5918e378.css");
 var $279507a6f189e509$exports = require("./styles_css.main.js");
 var $60684b441be8e84c$exports = require("./ListView.main.js");
 var $5Mbbg$reactspectrumcheckbox = require("@react-spectrum/checkbox");

package/dist/ListViewItem.main.js.map

@@ -1 +1 @@
-{"mappings":"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","sources":["packages/@react-spectrum/list/src/ListViewItem.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport ChevronLeftMedium from '@spectrum-icons/ui/ChevronLeftMedium';\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames, ClearSlots, SlotProvider, useHasChild} from '@react-spectrum/utils';\nimport {CSSTransition} from 'react-transition-group';\nimport type {DraggableItemResult, DropIndicatorAria} from '@react-aria/dnd';\nimport {DropTarget, Node} from '@react-types/shared';\nimport {FocusRing, useFocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible as isGlobalFocusVisible, useHover} from '@react-aria/interactions';\nimport ListGripper from '@spectrum-icons/ui/ListGripper';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport {mergeProps} from '@react-aria/utils';\nimport {Provider} from '@react-spectrum/provider';\nimport React, {useContext, useRef} from 'react';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useGridListItem, useGridListSelectionCheckbox} from '@react-aria/gridlist';\nimport {useLocale} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface ListViewItemProps<T> {\n  item: Node<T>,\n  isEmphasized: boolean,\n  hasActions: boolean\n}\n\nexport function ListViewItem<T>(props: ListViewItemProps<T>) {\n  let {\n    item,\n    isEmphasized\n  } = props;\n  let {\n    state,\n    dragState,\n    dropState,\n    isListDraggable,\n    isListDroppable,\n    layout,\n    dragAndDropHooks,\n    loadingState\n  } = useContext(ListViewContext)!;\n  let {direction} = useLocale();\n  let rowRef = useRef<HTMLDivElement | null>(null);\n  let checkboxWrapperRef = useRef<HTMLDivElement | null>(null);\n  let {\n    isFocusVisible: isFocusVisibleWithin,\n    focusProps: focusWithinProps\n  } = useFocusRing({within: true});\n  let {isFocusVisible, focusProps} = useFocusRing();\n  let {\n    rowProps,\n    gridCellProps,\n    isPressed,\n    descriptionProps,\n    isSelected,\n    isDisabled,\n    allowsSelection,\n    hasAction\n  } = useGridListItem({\n    node: item,\n    isVirtualized: true,\n    shouldSelectOnPressUp: isListDraggable\n  }, state, rowRef);\n  let {hoverProps, isHovered} = useHover({isDisabled: !allowsSelection && !hasAction});\n\n  let {checkboxProps} = useGridListSelectionCheckbox({key: item.key}, state);\n  let hasDescription = useHasChild(`.${listStyles['react-spectrum-ListViewItem-description']}`, rowRef);\n\n  let draggableItem: DraggableItemResult | null = null;\n  if (isListDraggable && dragAndDropHooks && dragState) {\n     \n    draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasDragButton: true}, dragState);\n    if (isDisabled) {\n      draggableItem = null;\n    }\n  }\n  let isDropTarget = false;\n  let dropIndicator: DropIndicatorAria | null = null;\n  let dropIndicatorRef = useRef<HTMLDivElement | null>(null);\n  if (isListDroppable && dragAndDropHooks && dropState) {\n    let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;\n    isDropTarget = dropState.isDropTarget(target);\n     \n    dropIndicator = dragAndDropHooks.useDropIndicator!({target}, dropState, dropIndicatorRef);\n  }\n\n  let dragButtonRef = React.useRef<HTMLDivElement | null>(null);\n  let {buttonProps} = useButton({\n    ...draggableItem?.dragButtonProps,\n    elementType: 'div'\n  }, dragButtonRef);\n\n  let chevron = direction === 'ltr'\n    ? (\n      <ChevronRightMedium\n        aria-hidden=\"true\"\n        UNSAFE_className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem-parentIndicator',\n            {\n              'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n              'is-disabled': !hasAction\n            }\n          )\n        } />\n    )\n    : (\n      <ChevronLeftMedium\n        aria-hidden=\"true\"\n        UNSAFE_className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem-parentIndicator',\n            {\n              'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n              'is-disabled': !hasAction\n            }\n          )\n        } />\n    );\n\n  let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  const mergedProps = mergeProps(\n    rowProps,\n    draggableItem?.dragProps,\n    hoverProps,\n    focusWithinProps,\n    focusProps\n  );\n  \n  // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,\n  // allowing for single swipe navigation between row drop indicator\n  if (dragAndDropHooks?.isVirtualDragging?.()) {\n    mergedProps.tabIndex = undefined;\n  }\n\n  let isFirstRow = item.prevKey == null;\n  let isLastRow = item.nextKey == null;\n  // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom\n  // border corners of the last row when selected and we can get rid of the bottom border if it isn't selected to avoid border overlap\n  // with bottom border\n  let isFlushWithContainerBottom = false;\n  if (isLastRow && loadingState !== 'loadingMore') {\n    if (layout.getContentSize()?.height >= (layout.virtualizer?.visibleRect.height ?? 0)) {\n      isFlushWithContainerBottom = true;\n    }\n  }\n  // previous item isn't selected\n  // and the previous item isn't focused or, if it is focused, then if focus globally isn't visible or just focus isn't in the listview\n  let roundTops = (!(item.prevKey != null && state.selectionManager.isSelected(item.prevKey))\n    && (state.selectionManager.focusedKey !== item.prevKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n  let roundBottoms = (!(item.nextKey != null && state.selectionManager.isSelected(item.nextKey))\n    && (state.selectionManager.focusedKey !== item.nextKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n\n  let content = typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered;\n  if (isDisabled) {\n    content = <Provider isDisabled>{content}</Provider>;\n  }\n\n  return (\n    <div\n      {...mergedProps}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListView-row',\n          {\n            'focus-ring': isFocusVisible,\n            'round-tops':\n              roundTops || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key),\n            'round-bottoms':\n              roundBottoms || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key)\n          }\n        )\n      }\n      ref={rowRef}>\n      <div\n        // TODO: refactor the css here now that we are focusing the row?\n        className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem',\n            {\n              'is-active': isPressed,\n              'is-focused': isFocusVisibleWithin,\n              'focus-ring': isFocusVisible,\n              'is-hovered': isHovered,\n              'is-selected': isSelected,\n              'is-disabled': isDisabled,\n              'is-prev-selected': item.prevKey != null && state.selectionManager.isSelected(item.prevKey),\n              'is-next-selected': item.nextKey != null && state.selectionManager.isSelected(item.nextKey),\n              'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || (item.nextKey != null && state.selectionManager.isSelected(item.nextKey))),\n              'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,\n              'react-spectrum-ListViewItem--firstRow': isFirstRow,\n              'react-spectrum-ListViewItem--lastRow': isLastRow,\n              'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,\n              'react-spectrum-ListViewItem--hasDescription': hasDescription\n            }\n          )\n        }\n        {...gridCellProps}>\n        <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n          {isListDraggable &&\n            <div className={listStyles['react-spectrum-ListViewItem-draghandle-container']}>\n              {!isDisabled &&\n                <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n                  <div\n                    {...buttonProps as React.HTMLAttributes<HTMLElement>}\n                    className={\n                      classNames(\n                        listStyles,\n                        'react-spectrum-ListViewItem-draghandle-button'\n                      )\n                    }\n                    style={!isFocusVisibleWithin ? {...visuallyHiddenProps.style} : {}}\n                    ref={dragButtonRef}\n                    draggable=\"true\">\n                    <ListGripper />\n                  </div>\n                </FocusRing>\n              }\n            </div>\n          }\n          {isListDroppable && !dropIndicator?.isHidden &&\n            <div role=\"button\" {...visuallyHiddenProps} {...dropIndicator?.dropIndicatorProps} ref={dropIndicatorRef} />\n          }\n          <CSSTransition\n            in={showCheckbox}\n            unmountOnExit\n            classNames={{\n              enter: listStyles['react-spectrum-ListViewItem-checkbox--enter'],\n              enterActive: listStyles['react-spectrum-ListViewItem-checkbox--enterActive'],\n              exit: listStyles['react-spectrum-ListViewItem-checkbox--exit'],\n              exitActive: listStyles['react-spectrum-ListViewItem-checkbox--exitActive']\n            }}\n            timeout={160}\n            nodeRef={checkboxWrapperRef} >\n            <div ref={checkboxWrapperRef} className={listStyles['react-spectrum-ListViewItem-checkboxWrapper']}>\n              <Checkbox\n                {...checkboxProps}\n                UNSAFE_className={listStyles['react-spectrum-ListViewItem-checkbox']}\n                isEmphasized={isEmphasized} />\n            </div>\n          </CSSTransition>\n          <SlotProvider\n            slots={{\n              text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n              description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description'], ...descriptionProps},\n              illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n              image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n              actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n              actionGroup: {\n                UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n                isQuiet: true,\n                density: 'compact'\n              },\n              actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n            }}>\n            {content}\n            <ClearSlots>\n              {chevron}\n            </ClearSlots>\n          </SlotProvider>\n        </Grid>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"ListViewItem.main.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/list/src/ListViewItem.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport ChevronLeftMedium from '@spectrum-icons/ui/ChevronLeftMedium';\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames, ClearSlots, SlotProvider, useHasChild} from '@react-spectrum/utils';\nimport {CSSTransition} from 'react-transition-group';\nimport type {DraggableItemResult, DropIndicatorAria} from '@react-aria/dnd';\nimport {DropTarget, Node} from '@react-types/shared';\nimport {FocusRing, useFocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible as isGlobalFocusVisible, useHover} from '@react-aria/interactions';\nimport ListGripper from '@spectrum-icons/ui/ListGripper';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport {mergeProps} from '@react-aria/utils';\nimport {Provider} from '@react-spectrum/provider';\nimport React, {ReactNode, useContext, useRef} from 'react';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useGridListItem, useGridListSelectionCheckbox} from '@react-aria/gridlist';\nimport {useLocale} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface ListViewItemProps<T> {\n  item: Node<T>,\n  isEmphasized: boolean,\n  hasActions: boolean\n}\n\nexport function ListViewItem<T>(props: ListViewItemProps<T>): ReactNode {\n  let {\n    item,\n    isEmphasized\n  } = props;\n  let {\n    state,\n    dragState,\n    dropState,\n    isListDraggable,\n    isListDroppable,\n    layout,\n    dragAndDropHooks,\n    loadingState\n  } = useContext(ListViewContext)!;\n  let {direction} = useLocale();\n  let rowRef = useRef<HTMLDivElement | null>(null);\n  let checkboxWrapperRef = useRef<HTMLDivElement | null>(null);\n  let {\n    isFocusVisible: isFocusVisibleWithin,\n    focusProps: focusWithinProps\n  } = useFocusRing({within: true});\n  let {isFocusVisible, focusProps} = useFocusRing();\n  let {\n    rowProps,\n    gridCellProps,\n    isPressed,\n    descriptionProps,\n    isSelected,\n    isDisabled,\n    allowsSelection,\n    hasAction\n  } = useGridListItem({\n    node: item,\n    isVirtualized: true,\n    shouldSelectOnPressUp: isListDraggable\n  }, state, rowRef);\n  let {hoverProps, isHovered} = useHover({isDisabled: !allowsSelection && !hasAction});\n\n  let {checkboxProps} = useGridListSelectionCheckbox({key: item.key}, state);\n  let hasDescription = useHasChild(`.${listStyles['react-spectrum-ListViewItem-description']}`, rowRef);\n\n  let draggableItem: DraggableItemResult | null = null;\n  if (isListDraggable && dragAndDropHooks && dragState) {\n\n    draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasDragButton: true}, dragState);\n    if (isDisabled) {\n      draggableItem = null;\n    }\n  }\n  let isDropTarget = false;\n  let dropIndicator: DropIndicatorAria | null = null;\n  let dropIndicatorRef = useRef<HTMLDivElement | null>(null);\n  if (isListDroppable && dragAndDropHooks && dropState) {\n    let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;\n    isDropTarget = dropState.isDropTarget(target);\n\n    dropIndicator = dragAndDropHooks.useDropIndicator!({target}, dropState, dropIndicatorRef);\n  }\n\n  let dragButtonRef = React.useRef<HTMLDivElement | null>(null);\n  let {buttonProps} = useButton({\n    ...draggableItem?.dragButtonProps,\n    elementType: 'div'\n  }, dragButtonRef);\n\n  let chevron = direction === 'ltr'\n    ? (\n      <ChevronRightMedium\n        aria-hidden=\"true\"\n        UNSAFE_className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem-parentIndicator',\n            {\n              'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n              'is-disabled': !hasAction\n            }\n          )\n        } />\n    )\n    : (\n      <ChevronLeftMedium\n        aria-hidden=\"true\"\n        UNSAFE_className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem-parentIndicator',\n            {\n              'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n              'is-disabled': !hasAction\n            }\n          )\n        } />\n    );\n\n  let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  const mergedProps = mergeProps(\n    rowProps,\n    draggableItem?.dragProps,\n    hoverProps,\n    focusWithinProps,\n    focusProps\n  );\n\n  // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,\n  // allowing for single swipe navigation between row drop indicator\n  if (dragAndDropHooks?.isVirtualDragging?.()) {\n    mergedProps.tabIndex = undefined;\n  }\n\n  let isFirstRow = item.prevKey == null;\n  let isLastRow = item.nextKey == null;\n  // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom\n  // border corners of the last row when selected and we can get rid of the bottom border if it isn't selected to avoid border overlap\n  // with bottom border\n  let isFlushWithContainerBottom = false;\n  if (isLastRow && loadingState !== 'loadingMore') {\n    if (layout.getContentSize()?.height >= (layout.virtualizer?.visibleRect.height ?? 0)) {\n      isFlushWithContainerBottom = true;\n    }\n  }\n  // previous item isn't selected\n  // and the previous item isn't focused or, if it is focused, then if focus globally isn't visible or just focus isn't in the listview\n  let roundTops = (!(item.prevKey != null && state.selectionManager.isSelected(item.prevKey))\n    && (state.selectionManager.focusedKey !== item.prevKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n  let roundBottoms = (!(item.nextKey != null && state.selectionManager.isSelected(item.nextKey))\n    && (state.selectionManager.focusedKey !== item.nextKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n\n  let content = typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered;\n  if (isDisabled) {\n    content = <Provider isDisabled>{content}</Provider>;\n  }\n\n  return (\n    <div\n      {...mergedProps}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListView-row',\n          {\n            'focus-ring': isFocusVisible,\n            'round-tops':\n              roundTops || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key),\n            'round-bottoms':\n              roundBottoms || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key)\n          }\n        )\n      }\n      ref={rowRef}>\n      <div\n        // TODO: refactor the css here now that we are focusing the row?\n        className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem',\n            {\n              'is-active': isPressed,\n              'is-focused': isFocusVisibleWithin,\n              'focus-ring': isFocusVisible,\n              'is-hovered': isHovered,\n              'is-selected': isSelected,\n              'is-disabled': isDisabled,\n              'is-prev-selected': item.prevKey != null && state.selectionManager.isSelected(item.prevKey),\n              'is-next-selected': item.nextKey != null && state.selectionManager.isSelected(item.nextKey),\n              'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || (item.nextKey != null && state.selectionManager.isSelected(item.nextKey))),\n              'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,\n              'react-spectrum-ListViewItem--firstRow': isFirstRow,\n              'react-spectrum-ListViewItem--lastRow': isLastRow,\n              'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,\n              'react-spectrum-ListViewItem--hasDescription': hasDescription\n            }\n          )\n        }\n        {...gridCellProps}>\n        <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n          {isListDraggable &&\n            <div className={listStyles['react-spectrum-ListViewItem-draghandle-container']}>\n              {!isDisabled &&\n                <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n                  <div\n                    {...buttonProps as React.HTMLAttributes<HTMLElement>}\n                    className={\n                      classNames(\n                        listStyles,\n                        'react-spectrum-ListViewItem-draghandle-button'\n                      )\n                    }\n                    style={!isFocusVisibleWithin ? {...visuallyHiddenProps.style} : {}}\n                    ref={dragButtonRef}\n                    draggable=\"true\">\n                    <ListGripper />\n                  </div>\n                </FocusRing>\n              }\n            </div>\n          }\n          {isListDroppable && !dropIndicator?.isHidden &&\n            <div role=\"button\" {...visuallyHiddenProps} {...dropIndicator?.dropIndicatorProps} ref={dropIndicatorRef} />\n          }\n          <CSSTransition\n            in={showCheckbox}\n            unmountOnExit\n            classNames={{\n              enter: listStyles['react-spectrum-ListViewItem-checkbox--enter'],\n              enterActive: listStyles['react-spectrum-ListViewItem-checkbox--enterActive'],\n              exit: listStyles['react-spectrum-ListViewItem-checkbox--exit'],\n              exitActive: listStyles['react-spectrum-ListViewItem-checkbox--exitActive']\n            }}\n            timeout={160}\n            nodeRef={checkboxWrapperRef} >\n            <div ref={checkboxWrapperRef} className={listStyles['react-spectrum-ListViewItem-checkboxWrapper']}>\n              <Checkbox\n                {...checkboxProps}\n                UNSAFE_className={listStyles['react-spectrum-ListViewItem-checkbox']}\n                isEmphasized={isEmphasized} />\n            </div>\n          </CSSTransition>\n          <SlotProvider\n            slots={{\n              text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n              description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description'], ...descriptionProps},\n              illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n              image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n              actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n              actionGroup: {\n                UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n                isQuiet: true,\n                density: 'compact'\n              },\n              actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n            }}>\n            {content}\n            <ClearSlots>\n              {chevron}\n            </ClearSlots>\n          </SlotProvider>\n        </Grid>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"ListViewItem.main.js.map"}

package/dist/ListViewItem.mjs

@@ -1,4 +1,4 @@
-import "./styles.ad343ab0.css";
+import "./list.5918e378.css";
 import $asbps$styles_cssmodulejs from "./styles_css.mjs";
 import {ListViewContext as $f85fb77f9d4cbc6c$export$870039b0abfe3de0} from "./ListView.mjs";
 import {Checkbox as $asbps$Checkbox} from "@react-spectrum/checkbox";

package/dist/ListViewItem.module.js

@@ -1,4 +1,4 @@
-import "./styles.ad343ab0.css";
+import "./list.5918e378.css";
 import $asbps$styles_cssmodulejs from "./styles_css.module.js";
 import {ListViewContext as $f85fb77f9d4cbc6c$export$870039b0abfe3de0} from "./ListView.module.js";
 import {Checkbox as $asbps$Checkbox} from "@react-spectrum/checkbox";

package/dist/ListViewItem.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;;;;;;;;;AA6BM,SAAS,0CAAgB,KAA2B;QA6GrD,qCAWE,wBAAoC;IAvH1C,IAAI,QACF,IAAI,gBACJ,YAAY,EACb,GAAG;IACJ,IAAI,SACF,KAAK,aACL,SAAS,aACT,SAAS,mBACT,eAAe,mBACf,eAAe,UACf,MAAM,oBACN,gBAAgB,gBAChB,YAAY,EACb,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7B,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAC1B,IAAI,SAAS,CAAA,GAAA,aAAK,EAAyB;IAC3C,IAAI,qBAAqB,CAAA,GAAA,aAAK,EAAyB;IACvD,IAAI,EACF,gBAAgB,oBAAoB,EACpC,YAAY,gBAAgB,EAC7B,GAAG,CAAA,GAAA,mBAAW,EAAE;QAAC,QAAQ;IAAI;IAC9B,IAAI,kBAAC,cAAc,cAAE,UAAU,EAAC,GAAG,CAAA,GAAA,mBAAW;IAC9C,IAAI,YACF,QAAQ,iBACR,aAAa,aACb,SAAS,oBACT,gBAAgB,cAChB,UAAU,cACV,UAAU,mBACV,eAAe,aACf,SAAS,EACV,GAAG,CAAA,GAAA,sBAAc,EAAE;QAClB,MAAM;QACN,eAAe;QACf,uBAAuB;IACzB,GAAG,OAAO;IACV,IAAI,cAAC,UAAU,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,eAAO,EAAE;QAAC,YAAY,CAAC,mBAAmB,CAAC;IAAS;IAElF,IAAI,iBAAC,aAAa,EAAC,GAAG,CAAA,GAAA,mCAA2B,EAAE;QAAC,KAAK,KAAK,GAAG;IAAA,GAAG;IACpE,IAAI,iBAAiB,CAAA,GAAA,kBAAU,EAAE,CAAC,CAAC,EAAE,CAAA,GAAA,mDAAS,CAAC,CAAC,0CAA0C,EAAE,EAAE;IAE9F,IAAI,gBAA4C;IAChD,IAAI,mBAAmB,oBAAoB,WAAW;QAEpD,gBAAgB,iBAAiB,gBAAgB,CAAE;YAAC,KAAK,KAAK,GAAG;YAAE,eAAe;QAAI,GAAG;QACzF,IAAI,YACF,gBAAgB;IAEpB;IACA,IAAI,eAAe;IACnB,IAAI,gBAA0C;IAC9C,IAAI,mBAAmB,CAAA,GAAA,aAAK,EAAyB;IACrD,IAAI,mBAAmB,oBAAoB,WAAW;QACpD,IAAI,SAAS;YAAC,MAAM;YAAQ,KAAK,KAAK,GAAG;YAAE,cAAc;QAAI;QAC7D,eAAe,UAAU,YAAY,CAAC;QAEtC,gBAAgB,iBAAiB,gBAAgB,CAAE;oBAAC;QAAM,GAAG,WAAW;IAC1E;IAEA,IAAI,gBAAgB,CAAA,GAAA,YAAI,EAAE,MAAM,CAAwB;IACxD,IAAI,eAAC,WAAW,EAAC,GAAG,CAAA,GAAA,gBAAQ,EAAE;WACzB,0BAAA,oCAAA,cAAe,eAAe,AAAjC;QACA,aAAa;IACf,GAAG;IAEH,IAAI,UAAU,cAAc,sBAExB,gCAAC,CAAA,GAAA,wCAAiB;QAChB,eAAY;QACZ,kBACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+CACA;YACE,8DAA8D,KAAK,KAAK,CAAC,aAAa;YACtF,eAAe,CAAC;QAClB;uBAKN,gCAAC,CAAA,GAAA,uCAAgB;QACf,eAAY;QACZ,kBACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+CACA;YACE,8DAA8D,KAAK,KAAK,CAAC,aAAa;YACtF,eAAe,CAAC;QAClB;;IAKV,IAAI,eAAe,MAAM,gBAAgB,CAAC,aAAa,KAAK,UAAU,MAAM,gBAAgB,CAAC,iBAAiB,KAAK;IACnH,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,MAAM,cAAc,CAAA,GAAA,iBAAS,EAC3B,UACA,0BAAA,oCAAA,cAAe,SAAS,EACxB,YACA,kBACA;IAGF,kHAAkH;IAClH,kEAAkE;IAClE,IAAI,6BAAA,wCAAA,sCAAA,iBAAkB,iBAAiB,cAAnC,0DAAA,yCAAA,mBACF,YAAY,QAAQ,GAAG;IAGzB,IAAI,aAAa,KAAK,OAAO,IAAI;IACjC,IAAI,YAAY,KAAK,OAAO,IAAI;IAChC,2HAA2H;IAC3H,oIAAoI;IACpI,qBAAqB;IACrB,IAAI,6BAA6B;QAES;IAD1C,IAAI,aAAa,iBAAiB,eAChC;QAAA,IAAI,EAAA,yBAAA,OAAO,cAAc,gBAArB,6CAAA,uBAAyB,MAAM,KAAK,CAAA,CAAA,0CAAA,sBAAA,OAAO,WAAW,cAAlB,0CAAA,oBAAoB,WAAW,CAAC,MAAM,cAAtC,oDAAA,yCAA0C,CAAA,GAChF,6BAA6B;IAC/B;IAEF,+BAA+B;IAC/B,qIAAqI;IACrI,IAAI,YAAa,CAAE,CAAA,KAAK,OAAO,IAAI,QAAQ,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO,CAAA,KACnF,CAAA,MAAM,gBAAgB,CAAC,UAAU,KAAK,KAAK,OAAO,IAAI,CAAE,CAAA,CAAA,GAAA,qBAAmB,OAAO,MAAM,gBAAgB,CAAC,SAAS,AAAD,CAAC;IACxH,IAAI,eAAgB,CAAE,CAAA,KAAK,OAAO,IAAI,QAAQ,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO,CAAA,KACtF,CAAA,MAAM,gBAAgB,CAAC,UAAU,KAAK,KAAK,OAAO,IAAI,CAAE,CAAA,CAAA,GAAA,qBAAmB,OAAO,MAAM,gBAAgB,CAAC,SAAS,AAAD,CAAC;IAExH,IAAI,UAAU,OAAO,KAAK,QAAQ,KAAK,yBAAW,gCAAC,CAAA,GAAA,WAAG,SAAG,KAAK,QAAQ,IAAW,KAAK,QAAQ;IAC9F,IAAI,YACF,wBAAU,gCAAC,CAAA,GAAA,eAAO;QAAE,YAAA;OAAY;IAGlC,qBACE,gCAAC;QACE,GAAG,WAAW;QACf,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+BACA;YACE,cAAc;YACd,cACE,aAAc,aAAa,CAAC,cAAc,MAAM,gBAAgB,CAAC,UAAU,KAAK,KAAK,GAAG;YAC1F,iBACE,gBAAiB,aAAa,CAAC,cAAc,MAAM,gBAAgB,CAAC,UAAU,KAAK,KAAK,GAAG;QAC/F;QAGJ,KAAK;qBACL,gCAAC;QACC,gEAAgE;QAChE,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT,+BACA;YACE,aAAa;YACb,cAAc;YACd,cAAc;YACd,cAAc;YACd,eAAe;YACf,eAAe;YACf,oBAAoB,KAAK,OAAO,IAAI,QAAQ,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO;YAC1F,oBAAoB,KAAK,OAAO,IAAI,QAAQ,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO;YAC1F,mDAAmD,MAAM,gBAAgB,CAAC,iBAAiB,KAAK,aAAc,CAAA,cAAe,KAAK,OAAO,IAAI,QAAQ,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,OAAO,CAAC;YACpM,2CAA2C,CAAC,CAAC;YAC7C,yCAAyC;YACzC,wCAAwC;YACxC,8CAA8C;YAC9C,+CAA+C;QACjD;QAGH,GAAG,aAAa;qBACjB,gCAAC,CAAA,GAAA,WAAG;QAAE,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,mCAAmC;OACnE,iCACC,gCAAC;QAAI,WAAW,CAAA,GAAA,mDAAS,CAAC,CAAC,mDAAmD;OAC3E,CAAC,4BACA,gCAAC,CAAA,GAAA,gBAAQ;QAAE,gBAAgB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,mDAAS,GAAG;qBAChD,gCAAC;QACE,GAAG,WAAW;QACf,WACE,CAAA,GAAA,iBAAS,EACP,CAAA,GAAA,mDAAS,GACT;QAGJ,OAAO,CAAC,uBAAuB;YAAC,GAAG,oBAAoB,KAAK;QAAA,IAAI,CAAC;QACjE,KAAK;QACL,WAAU;qBACV,gCAAC,CAAA,GAAA,iCAAU,aAMpB,mBAAmB,EAAC,0BAAA,oCAAA,cAAe,QAAQ,mBAC1C,gCAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;WAAM,0BAAA,oCAAA,cAAe,kBAAkB,AAApC;QAAsC,KAAK;sBAE1F,gCAAC,CAAA,GAAA,oBAAY;QACX,IAAI;QACJ,eAAA;QACA,YAAY;YACV,OAAO,CAAA,GAAA,mDAAS,CAAC,CAAC,8CAA8C;YAChE,aAAa,CAAA,GAAA,mDAAS,CAAC,CAAC,oDAAoD;YAC5E,MAAM,CAAA,GAAA,mDAAS,CAAC,CAAC,6CAA6C;YAC9D,YAAY,CAAA,GAAA,mDAAS,CAAC,CAAC,mDAAmD;QAC5E;QACA,SAAS;QACT,SAAS;qBACT,gCAAC;QAAI,KAAK;QAAoB,WAAW,CAAA,GAAA,mDAAS,CAAC,CAAC,8CAA8C;qBAChG,gCAAC,CAAA,GAAA,eAAO;QACL,GAAG,aAAa;QACjB,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,uCAAuC;QACpE,cAAc;wBAGpB,gCAAC,CAAA,GAAA,mBAAW;QACV,OAAO;YACL,MAAM;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;YAAA;YAC1E,aAAa;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,0CAA0C;gBAAE,GAAG,gBAAgB;YAAA;YAC1G,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YACpF,OAAO;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,wCAAwC;YAAA;YAC7E,cAAc;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBAAE,SAAS;YAAI;YACjG,aAAa;gBACX,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,sCAAsC;gBACnE,SAAS;gBACT,SAAS;YACX;YACA,YAAY;gBAAC,kBAAkB,CAAA,GAAA,mDAAS,CAAC,CAAC,yCAAyC;gBAAE,SAAS;YAAI;QACpG;OACC,uBACD,gCAAC,CAAA,GAAA,iBAAS,SACP;AAOf","sources":["packages/@react-spectrum/list/src/ListViewItem.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport ChevronLeftMedium from '@spectrum-icons/ui/ChevronLeftMedium';\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames, ClearSlots, SlotProvider, useHasChild} from '@react-spectrum/utils';\nimport {CSSTransition} from 'react-transition-group';\nimport type {DraggableItemResult, DropIndicatorAria} from '@react-aria/dnd';\nimport {DropTarget, Node} from '@react-types/shared';\nimport {FocusRing, useFocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible as isGlobalFocusVisible, useHover} from '@react-aria/interactions';\nimport ListGripper from '@spectrum-icons/ui/ListGripper';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport {mergeProps} from '@react-aria/utils';\nimport {Provider} from '@react-spectrum/provider';\nimport React, {useContext, useRef} from 'react';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useGridListItem, useGridListSelectionCheckbox} from '@react-aria/gridlist';\nimport {useLocale} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface ListViewItemProps<T> {\n  item: Node<T>,\n  isEmphasized: boolean,\n  hasActions: boolean\n}\n\nexport function ListViewItem<T>(props: ListViewItemProps<T>) {\n  let {\n    item,\n    isEmphasized\n  } = props;\n  let {\n    state,\n    dragState,\n    dropState,\n    isListDraggable,\n    isListDroppable,\n    layout,\n    dragAndDropHooks,\n    loadingState\n  } = useContext(ListViewContext)!;\n  let {direction} = useLocale();\n  let rowRef = useRef<HTMLDivElement | null>(null);\n  let checkboxWrapperRef = useRef<HTMLDivElement | null>(null);\n  let {\n    isFocusVisible: isFocusVisibleWithin,\n    focusProps: focusWithinProps\n  } = useFocusRing({within: true});\n  let {isFocusVisible, focusProps} = useFocusRing();\n  let {\n    rowProps,\n    gridCellProps,\n    isPressed,\n    descriptionProps,\n    isSelected,\n    isDisabled,\n    allowsSelection,\n    hasAction\n  } = useGridListItem({\n    node: item,\n    isVirtualized: true,\n    shouldSelectOnPressUp: isListDraggable\n  }, state, rowRef);\n  let {hoverProps, isHovered} = useHover({isDisabled: !allowsSelection && !hasAction});\n\n  let {checkboxProps} = useGridListSelectionCheckbox({key: item.key}, state);\n  let hasDescription = useHasChild(`.${listStyles['react-spectrum-ListViewItem-description']}`, rowRef);\n\n  let draggableItem: DraggableItemResult | null = null;\n  if (isListDraggable && dragAndDropHooks && dragState) {\n     \n    draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasDragButton: true}, dragState);\n    if (isDisabled) {\n      draggableItem = null;\n    }\n  }\n  let isDropTarget = false;\n  let dropIndicator: DropIndicatorAria | null = null;\n  let dropIndicatorRef = useRef<HTMLDivElement | null>(null);\n  if (isListDroppable && dragAndDropHooks && dropState) {\n    let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;\n    isDropTarget = dropState.isDropTarget(target);\n     \n    dropIndicator = dragAndDropHooks.useDropIndicator!({target}, dropState, dropIndicatorRef);\n  }\n\n  let dragButtonRef = React.useRef<HTMLDivElement | null>(null);\n  let {buttonProps} = useButton({\n    ...draggableItem?.dragButtonProps,\n    elementType: 'div'\n  }, dragButtonRef);\n\n  let chevron = direction === 'ltr'\n    ? (\n      <ChevronRightMedium\n        aria-hidden=\"true\"\n        UNSAFE_className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem-parentIndicator',\n            {\n              'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n              'is-disabled': !hasAction\n            }\n          )\n        } />\n    )\n    : (\n      <ChevronLeftMedium\n        aria-hidden=\"true\"\n        UNSAFE_className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem-parentIndicator',\n            {\n              'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n              'is-disabled': !hasAction\n            }\n          )\n        } />\n    );\n\n  let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  const mergedProps = mergeProps(\n    rowProps,\n    draggableItem?.dragProps,\n    hoverProps,\n    focusWithinProps,\n    focusProps\n  );\n  \n  // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,\n  // allowing for single swipe navigation between row drop indicator\n  if (dragAndDropHooks?.isVirtualDragging?.()) {\n    mergedProps.tabIndex = undefined;\n  }\n\n  let isFirstRow = item.prevKey == null;\n  let isLastRow = item.nextKey == null;\n  // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom\n  // border corners of the last row when selected and we can get rid of the bottom border if it isn't selected to avoid border overlap\n  // with bottom border\n  let isFlushWithContainerBottom = false;\n  if (isLastRow && loadingState !== 'loadingMore') {\n    if (layout.getContentSize()?.height >= (layout.virtualizer?.visibleRect.height ?? 0)) {\n      isFlushWithContainerBottom = true;\n    }\n  }\n  // previous item isn't selected\n  // and the previous item isn't focused or, if it is focused, then if focus globally isn't visible or just focus isn't in the listview\n  let roundTops = (!(item.prevKey != null && state.selectionManager.isSelected(item.prevKey))\n    && (state.selectionManager.focusedKey !== item.prevKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n  let roundBottoms = (!(item.nextKey != null && state.selectionManager.isSelected(item.nextKey))\n    && (state.selectionManager.focusedKey !== item.nextKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n\n  let content = typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered;\n  if (isDisabled) {\n    content = <Provider isDisabled>{content}</Provider>;\n  }\n\n  return (\n    <div\n      {...mergedProps}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListView-row',\n          {\n            'focus-ring': isFocusVisible,\n            'round-tops':\n              roundTops || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key),\n            'round-bottoms':\n              roundBottoms || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key)\n          }\n        )\n      }\n      ref={rowRef}>\n      <div\n        // TODO: refactor the css here now that we are focusing the row?\n        className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem',\n            {\n              'is-active': isPressed,\n              'is-focused': isFocusVisibleWithin,\n              'focus-ring': isFocusVisible,\n              'is-hovered': isHovered,\n              'is-selected': isSelected,\n              'is-disabled': isDisabled,\n              'is-prev-selected': item.prevKey != null && state.selectionManager.isSelected(item.prevKey),\n              'is-next-selected': item.nextKey != null && state.selectionManager.isSelected(item.nextKey),\n              'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || (item.nextKey != null && state.selectionManager.isSelected(item.nextKey))),\n              'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,\n              'react-spectrum-ListViewItem--firstRow': isFirstRow,\n              'react-spectrum-ListViewItem--lastRow': isLastRow,\n              'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,\n              'react-spectrum-ListViewItem--hasDescription': hasDescription\n            }\n          )\n        }\n        {...gridCellProps}>\n        <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n          {isListDraggable &&\n            <div className={listStyles['react-spectrum-ListViewItem-draghandle-container']}>\n              {!isDisabled &&\n                <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n                  <div\n                    {...buttonProps as React.HTMLAttributes<HTMLElement>}\n                    className={\n                      classNames(\n                        listStyles,\n                        'react-spectrum-ListViewItem-draghandle-button'\n                      )\n                    }\n                    style={!isFocusVisibleWithin ? {...visuallyHiddenProps.style} : {}}\n                    ref={dragButtonRef}\n                    draggable=\"true\">\n                    <ListGripper />\n                  </div>\n                </FocusRing>\n              }\n            </div>\n          }\n          {isListDroppable && !dropIndicator?.isHidden &&\n            <div role=\"button\" {...visuallyHiddenProps} {...dropIndicator?.dropIndicatorProps} ref={dropIndicatorRef} />\n          }\n          <CSSTransition\n            in={showCheckbox}\n            unmountOnExit\n            classNames={{\n              enter: listStyles['react-spectrum-ListViewItem-checkbox--enter'],\n              enterActive: listStyles['react-spectrum-ListViewItem-checkbox--enterActive'],\n              exit: listStyles['react-spectrum-ListViewItem-checkbox--exit'],\n              exitActive: listStyles['react-spectrum-ListViewItem-checkbox--exitActive']\n            }}\n            timeout={160}\n            nodeRef={checkboxWrapperRef} >\n            <div ref={checkboxWrapperRef} className={listStyles['react-spectrum-ListViewItem-checkboxWrapper']}>\n              <Checkbox\n                {...checkboxProps}\n                UNSAFE_className={listStyles['react-spectrum-ListViewItem-checkbox']}\n                isEmphasized={isEmphasized} />\n            </div>\n          </CSSTransition>\n          <SlotProvider\n            slots={{\n              text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n              description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description'], ...descriptionProps},\n              illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n              image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n              actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n              actionGroup: {\n                UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n                isQuiet: true,\n                density: 'compact'\n              },\n              actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n            }}>\n            {content}\n            <ClearSlots>\n              {chevron}\n            </ClearSlots>\n          </SlotProvider>\n        </Grid>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"ListViewItem.module.js.map"}
+{"mappings":"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","sources":["packages/@react-spectrum/list/src/ListViewItem.tsx"],"sourcesContent":["/*\n * Copyright 2021 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nimport {Checkbox} from '@react-spectrum/checkbox';\nimport ChevronLeftMedium from '@spectrum-icons/ui/ChevronLeftMedium';\nimport ChevronRightMedium from '@spectrum-icons/ui/ChevronRightMedium';\nimport {classNames, ClearSlots, SlotProvider, useHasChild} from '@react-spectrum/utils';\nimport {CSSTransition} from 'react-transition-group';\nimport type {DraggableItemResult, DropIndicatorAria} from '@react-aria/dnd';\nimport {DropTarget, Node} from '@react-types/shared';\nimport {FocusRing, useFocusRing} from '@react-aria/focus';\nimport {Grid} from '@react-spectrum/layout';\nimport {isFocusVisible as isGlobalFocusVisible, useHover} from '@react-aria/interactions';\nimport ListGripper from '@spectrum-icons/ui/ListGripper';\nimport listStyles from './styles.css';\nimport {ListViewContext} from './ListView';\nimport {mergeProps} from '@react-aria/utils';\nimport {Provider} from '@react-spectrum/provider';\nimport React, {ReactNode, useContext, useRef} from 'react';\nimport {Text} from '@react-spectrum/text';\nimport {useButton} from '@react-aria/button';\nimport {useGridListItem, useGridListSelectionCheckbox} from '@react-aria/gridlist';\nimport {useLocale} from '@react-aria/i18n';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\ninterface ListViewItemProps<T> {\n  item: Node<T>,\n  isEmphasized: boolean,\n  hasActions: boolean\n}\n\nexport function ListViewItem<T>(props: ListViewItemProps<T>): ReactNode {\n  let {\n    item,\n    isEmphasized\n  } = props;\n  let {\n    state,\n    dragState,\n    dropState,\n    isListDraggable,\n    isListDroppable,\n    layout,\n    dragAndDropHooks,\n    loadingState\n  } = useContext(ListViewContext)!;\n  let {direction} = useLocale();\n  let rowRef = useRef<HTMLDivElement | null>(null);\n  let checkboxWrapperRef = useRef<HTMLDivElement | null>(null);\n  let {\n    isFocusVisible: isFocusVisibleWithin,\n    focusProps: focusWithinProps\n  } = useFocusRing({within: true});\n  let {isFocusVisible, focusProps} = useFocusRing();\n  let {\n    rowProps,\n    gridCellProps,\n    isPressed,\n    descriptionProps,\n    isSelected,\n    isDisabled,\n    allowsSelection,\n    hasAction\n  } = useGridListItem({\n    node: item,\n    isVirtualized: true,\n    shouldSelectOnPressUp: isListDraggable\n  }, state, rowRef);\n  let {hoverProps, isHovered} = useHover({isDisabled: !allowsSelection && !hasAction});\n\n  let {checkboxProps} = useGridListSelectionCheckbox({key: item.key}, state);\n  let hasDescription = useHasChild(`.${listStyles['react-spectrum-ListViewItem-description']}`, rowRef);\n\n  let draggableItem: DraggableItemResult | null = null;\n  if (isListDraggable && dragAndDropHooks && dragState) {\n\n    draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasDragButton: true}, dragState);\n    if (isDisabled) {\n      draggableItem = null;\n    }\n  }\n  let isDropTarget = false;\n  let dropIndicator: DropIndicatorAria | null = null;\n  let dropIndicatorRef = useRef<HTMLDivElement | null>(null);\n  if (isListDroppable && dragAndDropHooks && dropState) {\n    let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;\n    isDropTarget = dropState.isDropTarget(target);\n\n    dropIndicator = dragAndDropHooks.useDropIndicator!({target}, dropState, dropIndicatorRef);\n  }\n\n  let dragButtonRef = React.useRef<HTMLDivElement | null>(null);\n  let {buttonProps} = useButton({\n    ...draggableItem?.dragButtonProps,\n    elementType: 'div'\n  }, dragButtonRef);\n\n  let chevron = direction === 'ltr'\n    ? (\n      <ChevronRightMedium\n        aria-hidden=\"true\"\n        UNSAFE_className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem-parentIndicator',\n            {\n              'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n              'is-disabled': !hasAction\n            }\n          )\n        } />\n    )\n    : (\n      <ChevronLeftMedium\n        aria-hidden=\"true\"\n        UNSAFE_className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem-parentIndicator',\n            {\n              'react-spectrum-ListViewItem-parentIndicator--hasChildItems': item.props.hasChildItems,\n              'is-disabled': !hasAction\n            }\n          )\n        } />\n    );\n\n  let showCheckbox = state.selectionManager.selectionMode !== 'none' && state.selectionManager.selectionBehavior === 'toggle';\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  const mergedProps = mergeProps(\n    rowProps,\n    draggableItem?.dragProps,\n    hoverProps,\n    focusWithinProps,\n    focusProps\n  );\n\n  // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,\n  // allowing for single swipe navigation between row drop indicator\n  if (dragAndDropHooks?.isVirtualDragging?.()) {\n    mergedProps.tabIndex = undefined;\n  }\n\n  let isFirstRow = item.prevKey == null;\n  let isLastRow = item.nextKey == null;\n  // Figure out if the ListView content is equal or greater in height to the container. If so, we'll need to round the bottom\n  // border corners of the last row when selected and we can get rid of the bottom border if it isn't selected to avoid border overlap\n  // with bottom border\n  let isFlushWithContainerBottom = false;\n  if (isLastRow && loadingState !== 'loadingMore') {\n    if (layout.getContentSize()?.height >= (layout.virtualizer?.visibleRect.height ?? 0)) {\n      isFlushWithContainerBottom = true;\n    }\n  }\n  // previous item isn't selected\n  // and the previous item isn't focused or, if it is focused, then if focus globally isn't visible or just focus isn't in the listview\n  let roundTops = (!(item.prevKey != null && state.selectionManager.isSelected(item.prevKey))\n    && (state.selectionManager.focusedKey !== item.prevKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n  let roundBottoms = (!(item.nextKey != null && state.selectionManager.isSelected(item.nextKey))\n    && (state.selectionManager.focusedKey !== item.nextKey || !(isGlobalFocusVisible() && state.selectionManager.isFocused)));\n\n  let content = typeof item.rendered === 'string' ? <Text>{item.rendered}</Text> : item.rendered;\n  if (isDisabled) {\n    content = <Provider isDisabled>{content}</Provider>;\n  }\n\n  return (\n    <div\n      {...mergedProps}\n      className={\n        classNames(\n          listStyles,\n          'react-spectrum-ListView-row',\n          {\n            'focus-ring': isFocusVisible,\n            'round-tops':\n              roundTops || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key),\n            'round-bottoms':\n              roundBottoms || (isHovered && !isSelected && state.selectionManager.focusedKey !== item.key)\n          }\n        )\n      }\n      ref={rowRef}>\n      <div\n        // TODO: refactor the css here now that we are focusing the row?\n        className={\n          classNames(\n            listStyles,\n            'react-spectrum-ListViewItem',\n            {\n              'is-active': isPressed,\n              'is-focused': isFocusVisibleWithin,\n              'focus-ring': isFocusVisible,\n              'is-hovered': isHovered,\n              'is-selected': isSelected,\n              'is-disabled': isDisabled,\n              'is-prev-selected': item.prevKey != null && state.selectionManager.isSelected(item.prevKey),\n              'is-next-selected': item.nextKey != null && state.selectionManager.isSelected(item.nextKey),\n              'react-spectrum-ListViewItem--highlightSelection': state.selectionManager.selectionBehavior === 'replace' && (isSelected || (item.nextKey != null && state.selectionManager.isSelected(item.nextKey))),\n              'react-spectrum-ListViewItem--dropTarget': !!isDropTarget,\n              'react-spectrum-ListViewItem--firstRow': isFirstRow,\n              'react-spectrum-ListViewItem--lastRow': isLastRow,\n              'react-spectrum-ListViewItem--isFlushBottom': isFlushWithContainerBottom,\n              'react-spectrum-ListViewItem--hasDescription': hasDescription\n            }\n          )\n        }\n        {...gridCellProps}>\n        <Grid UNSAFE_className={listStyles['react-spectrum-ListViewItem-grid']}>\n          {isListDraggable &&\n            <div className={listStyles['react-spectrum-ListViewItem-draghandle-container']}>\n              {!isDisabled &&\n                <FocusRing focusRingClass={classNames(listStyles, 'focus-ring')}>\n                  <div\n                    {...buttonProps as React.HTMLAttributes<HTMLElement>}\n                    className={\n                      classNames(\n                        listStyles,\n                        'react-spectrum-ListViewItem-draghandle-button'\n                      )\n                    }\n                    style={!isFocusVisibleWithin ? {...visuallyHiddenProps.style} : {}}\n                    ref={dragButtonRef}\n                    draggable=\"true\">\n                    <ListGripper />\n                  </div>\n                </FocusRing>\n              }\n            </div>\n          }\n          {isListDroppable && !dropIndicator?.isHidden &&\n            <div role=\"button\" {...visuallyHiddenProps} {...dropIndicator?.dropIndicatorProps} ref={dropIndicatorRef} />\n          }\n          <CSSTransition\n            in={showCheckbox}\n            unmountOnExit\n            classNames={{\n              enter: listStyles['react-spectrum-ListViewItem-checkbox--enter'],\n              enterActive: listStyles['react-spectrum-ListViewItem-checkbox--enterActive'],\n              exit: listStyles['react-spectrum-ListViewItem-checkbox--exit'],\n              exitActive: listStyles['react-spectrum-ListViewItem-checkbox--exitActive']\n            }}\n            timeout={160}\n            nodeRef={checkboxWrapperRef} >\n            <div ref={checkboxWrapperRef} className={listStyles['react-spectrum-ListViewItem-checkboxWrapper']}>\n              <Checkbox\n                {...checkboxProps}\n                UNSAFE_className={listStyles['react-spectrum-ListViewItem-checkbox']}\n                isEmphasized={isEmphasized} />\n            </div>\n          </CSSTransition>\n          <SlotProvider\n            slots={{\n              text: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-content']},\n              description: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-description'], ...descriptionProps},\n              illustration: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n              image: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-thumbnail']},\n              actionButton: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'], isQuiet: true},\n              actionGroup: {\n                UNSAFE_className: listStyles['react-spectrum-ListViewItem-actions'],\n                isQuiet: true,\n                density: 'compact'\n              },\n              actionMenu: {UNSAFE_className: listStyles['react-spectrum-ListViewItem-actionmenu'], isQuiet: true}\n            }}>\n            {content}\n            <ClearSlots>\n              {chevron}\n            </ClearSlots>\n          </SlotProvider>\n        </Grid>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"ListViewItem.module.js.map"}

package/dist/RootDropIndicator.main.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;;;;;;;;;;;AAIe;IACb,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,IAAI,MAAM,CAAA,GAAA,mBAAK,EAAyB;IACxC,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAkB,gBAAgB,CAAE;QAC7D,QAAQ;YAAC,MAAM;QAAM;IACvB,GAAG,WAAY;IACf,IAAI,eAAe,UAAW,YAAY,CAAC;QAAC,MAAM;IAAM;IACxD,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,gDAAgB;IAE5C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,0DAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,0DAAC;QACC,MAAK;QACL,iBAAc;qBACd,0DAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;QAAG,GAAG,kBAAkB;QAAE,KAAK;;AAIjF","sources":["packages/@react-spectrum/list/src/RootDropIndicator.tsx"],"sourcesContent":["import {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport default function RootDropIndicator() {\n  let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;\n  let ref = useRef<HTMLDivElement | null>(null);\n  let {dropIndicatorProps} = dragAndDropHooks!.useDropIndicator!({\n    target: {type: 'root'}\n  }, dropState!, ref);\n  let isDropTarget = dropState!.isDropTarget({type: 'root'});\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n    return null;\n  }\n\n  return (\n    <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n      <div\n        role=\"gridcell\"\n        aria-selected=\"false\">\n        <div role=\"button\" {...visuallyHiddenProps} {...dropIndicatorProps} ref={ref} />\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"RootDropIndicator.main.js.map"}
+{"mappings":";;;;;;;;;;;;;;;;;AAIe;IACb,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,uBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,IAAI,MAAM,CAAA,GAAA,mBAAK,EAAyB;IACxC,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAkB,gBAAgB,CAAE;QAC7D,QAAQ;YAAC,MAAM;QAAM;IACvB,GAAG,WAAY;IACf,IAAI,eAAe,UAAW,YAAY,CAAC;QAAC,MAAM;IAAM;IACxD,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,gDAAgB;IAE5C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,0DAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,0DAAC;QACC,MAAK;QACL,iBAAc;qBACd,0DAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;QAAG,GAAG,kBAAkB;QAAE,KAAK;;AAIjF","sources":["packages/@react-spectrum/list/src/RootDropIndicator.tsx"],"sourcesContent":["import {ListViewContext} from './ListView';\nimport React, {ReactNode, useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport default function RootDropIndicator(): ReactNode | null {\n  let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;\n  let ref = useRef<HTMLDivElement | null>(null);\n  let {dropIndicatorProps} = dragAndDropHooks!.useDropIndicator!({\n    target: {type: 'root'}\n  }, dropState!, ref);\n  let isDropTarget = dropState!.isDropTarget({type: 'root'});\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n    return null;\n  }\n\n  return (\n    <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n      <div\n        role=\"gridcell\"\n        aria-selected=\"false\">\n        <div role=\"button\" {...visuallyHiddenProps} {...dropIndicatorProps} ref={ref} />\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"RootDropIndicator.main.js.map"}

package/dist/RootDropIndicator.module.js.map

@@ -1 +1 @@
-{"mappings":";;;;;;;AAIe;IACb,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,IAAI,MAAM,CAAA,GAAA,aAAK,EAAyB;IACxC,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAkB,gBAAgB,CAAE;QAC7D,QAAQ;YAAC,MAAM;QAAM;IACvB,GAAG,WAAY;IACf,IAAI,eAAe,UAAW,YAAY,CAAC;QAAC,MAAM;IAAM;IACxD,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,gCAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,gCAAC;QACC,MAAK;QACL,iBAAc;qBACd,gCAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;QAAG,GAAG,kBAAkB;QAAE,KAAK;;AAIjF","sources":["packages/@react-spectrum/list/src/RootDropIndicator.tsx"],"sourcesContent":["import {ListViewContext} from './ListView';\nimport React, {useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport default function RootDropIndicator() {\n  let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;\n  let ref = useRef<HTMLDivElement | null>(null);\n  let {dropIndicatorProps} = dragAndDropHooks!.useDropIndicator!({\n    target: {type: 'root'}\n  }, dropState!, ref);\n  let isDropTarget = dropState!.isDropTarget({type: 'root'});\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n    return null;\n  }\n\n  return (\n    <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n      <div\n        role=\"gridcell\"\n        aria-selected=\"false\">\n        <div role=\"button\" {...visuallyHiddenProps} {...dropIndicatorProps} ref={ref} />\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"RootDropIndicator.module.js.map"}
+{"mappings":";;;;;;;AAIe;IACb,IAAI,aAAC,SAAS,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,yCAAc;IAC7D,IAAI,MAAM,CAAA,GAAA,aAAK,EAAyB;IACxC,IAAI,sBAAC,kBAAkB,EAAC,GAAG,iBAAkB,gBAAgB,CAAE;QAC7D,QAAQ;YAAC,MAAM;QAAM;IACvB,GAAG,WAAY;IACf,IAAI,eAAe,UAAW,YAAY,CAAC;QAAC,MAAM;IAAM;IACxD,IAAI,uBAAC,mBAAmB,EAAC,GAAG,CAAA,GAAA,wBAAgB;IAE5C,IAAI,CAAC,gBAAgB,kBAAkB,CAAC,cAAc,EACpD,OAAO;IAGT,qBACE,gCAAC;QAAI,MAAK;QAAM,eAAa,kBAAkB,CAAC,cAAc;qBAC5D,gCAAC;QACC,MAAK;QACL,iBAAc;qBACd,gCAAC;QAAI,MAAK;QAAU,GAAG,mBAAmB;QAAG,GAAG,kBAAkB;QAAE,KAAK;;AAIjF","sources":["packages/@react-spectrum/list/src/RootDropIndicator.tsx"],"sourcesContent":["import {ListViewContext} from './ListView';\nimport React, {ReactNode, useContext, useRef} from 'react';\nimport {useVisuallyHidden} from '@react-aria/visually-hidden';\n\nexport default function RootDropIndicator(): ReactNode | null {\n  let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;\n  let ref = useRef<HTMLDivElement | null>(null);\n  let {dropIndicatorProps} = dragAndDropHooks!.useDropIndicator!({\n    target: {type: 'root'}\n  }, dropState!, ref);\n  let isDropTarget = dropState!.isDropTarget({type: 'root'});\n  let {visuallyHiddenProps} = useVisuallyHidden();\n\n  if (!isDropTarget && dropIndicatorProps['aria-hidden']) {\n    return null;\n  }\n\n  return (\n    <div role=\"row\" aria-hidden={dropIndicatorProps['aria-hidden']}>\n      <div\n        role=\"gridcell\"\n        aria-selected=\"false\">\n        <div role=\"button\" {...visuallyHiddenProps} {...dropIndicatorProps} ref={ref} />\n      </div>\n    </div>\n  );\n}\n"],"names":[],"version":3,"file":"RootDropIndicator.module.js.map"}

package/dist/{styles.ad343ab0.css → list.5918e378.css}

@@ -836,4 +836,4 @@
     --spectrum-listview-item-draghandle-border-color-key-focus: CanvasText;
   }
 }
-/*# sourceMappingURL=styles.ad343ab0.css.map */
+/*# sourceMappingURL=list.5918e378.css.map */

package/dist/{styles.ad343ab0.css.map → list.5918e378.css.map}

@@ -1 +1 @@
-{"mappings":"AAYA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA;;;;;;;;;;;;;;;;;;;AAiBE;;;;AAQM;;;;;AAQF;;;;;;;;;;AAeA;;;;AAEE;;;;AAKA;;;;AAKA;;;;;AAaE;;;;AAYA;;;;AAMA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAUE;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAQA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAUA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAUR;;;;;AAQJ;;;;AAII;;;;;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAgBJ;;;;;;AAQQ;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAIF;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAIE;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAIF;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAIE;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASR;;;;AAIA;;;;;;;;;;;;;AAaE;;;;AASA;;;;AAIA;;;;AAQE;;;;AAMA;;;;AAKF;;;;;AAMA;;;;;;;;AAUA;;;;;;;;;;AAWE;;;;;;;;AAOE;;;;;;AAUJ;;;;;;;AAQA;;;;;AAIE;;;;AAKF;;;;;;;;;;;;AAYE;;;;;AAMF;;;;;;;;AAWA;;;;;;AAOE;;;;AAKF;;;;;;AAMA;;;;;;AAMA;;;;AAIA;;;;;;;AAME;;;;AAKF;;;;;;;;AASE;;;;;AAKA;;;;;AAKA;;;;;;AAOA;;;;;;;;AAQA;;;;AAGE;;;;;;;;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAkBF;;;;AAUF;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAKA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAME;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAIA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAMA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAUA;;;;;AAIA;;;;AAMJ;;;;;;AAMA;;;;;;AAMA;;;;AAII;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAMJ;;;;;;AAYA;;;;;;;AASE;;;;AAKF;;;;;;;;AAME;;;;AAKF;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAME;;;;;;AAQE;;;;AAIA;;;;AAIA;;;;;;;;;;;;;;;AAoBJ;;;;;AAKA;;;;;AAUA;;;;;AAME;;;;;AAMF;EACE;;;;;;;;;;;;;;;;;;;EA0BM;;;;;;;EAUN;;;;EAGE","sources":["packages/@react-spectrum/list/src/styles.css"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n*/\n\n.react-spectrum-ListView,\n.react-spectrum-ListViewItem {\n  --spectrum-listview-item-compact-padding-y: var(--spectrum-global-dimension-size-50);\n  --spectrum-listview-item-regular-padding-y: var(--spectrum-global-dimension-size-85);\n  --spectrum-listview-item-spacious-padding-y: var(--spectrum-global-dimension-size-100);\n  --spectrum-listview-border-width: var(--spectrum-table-border-size, var(--spectrum-alias-border-size-thin));\n  --spectrum-listview-border-radius: var(--spectrum-table-border-radius, var(--spectrum-alias-border-radius-regular));\n  --spectrum-listview-item-border-radius: calc(var(--spectrum-listview-border-radius) - var(--spectrum-listview-border-width));\n  --spectrum-listview-row-sticky-focus-indicator-width: 3px;\n  --spectrum-listview-item-line-height: calc(var(--spectrum-table-cell-text-size, var(--spectrum-alias-font-size-default)) * var(--spectrum-table-cell-text-line-height, var(--spectrum-alias-body-text-line-height)) - 1px);\n  --spectrum-listview-item-title-text-color: var(--spectrum-global-color-gray-800);\n  --spectrum-listview-item-title-text-size: var(--spectrum-global-dimension-font-size-100);\n  --spectrum-listview-item-description-text-color: var(--spectrum-global-color-gray-700);\n  --spectrum-listview-item-description-text-size: var(--spectrum-global-dimension-font-size-75);\n\n  --spectrum-listview-border-color: var(--spectrum-table-border-color, var(--spectrum-alias-border-color-mid));\n  --spectrum-listview-border-color-key-focus: var(--spectrum-table-cell-border-color-key-focus, var(--spectrum-alias-focus-color));\n  --spectrum-listview-background-color: var(--spectrum-table-background-color, var(--spectrum-global-color-gray-50));\n  --spectrum-listview-item-background-color-hover: var(--spectrum-table-row-background-color-hover);\n  --spectrum-listview-item-background-color-down: var(--spectrum-table-row-background-color-down);\n  --spectrum-listview-item-background-color-selected: var(--spectrum-table-row-background-color-selected);\n  --spectrum-listview-item-background-color-selected-hover: var(--spectrum-table-row-background-color-selected);\n  --spectrum-listview-item-background-color-selected-key-focus: var(--spectrum-table-row-background-color-selected-key-focus);\n  --spectrum-listview-item-border-color: var(--spectrum-table-cell-border-color, var(--spectrum-alias-border-color-mid));\n  --spectrum-listview-item-border-color-selected: var(--spectrum-global-color-blue-500);\n  --spectrum-listview-item-border-color-key-focus: var(--spectrum-table-cell-border-color-key-focus, var(--spectrum-alias-focus-color));\n  --spectrum-listview-row-sticky-focus-indicator-color: var(--spectrum-selectlist-option-focus-indicator-color);\n  --spectrum-listview-quiet-background-color: var(--spectrum-alias-background-color-transparent);\n  --spectrum-listview-item-text-color: var(--spectrum-table-cell-text-color, var(--spectrum-alias-text-color));\n  --spectrum-listview-item-text-color-disabled: var(--spectrum-alias-text-color-disabled);\n  --spectrum-listview-droptarget-background-color: var(--spectrum-alias-highlight-selected);\n  --spectrum-listview-dropindicator-border-color: var(--spectrum-dropindicator-border-color);\n  --spectrum-listview-dropindicator-circle-border-color: var(--spectrum-dropindicator-circle-border-color);\n\n  --spectrum-listview-dropindicator-circle-size: var(--spectrum-dropindicator-circle-size);\n  --spectrum-listview-dropindicator-border-size: var(--spectrum-dropindicator-border-size);\n\n  --spectrum-listview-dropzone-border-color-selected-hover: var(--spectrum-dropzone-border-color-selected-hover);\n  --spectrum-listview-item-badge-text-color: var(--spectrum-global-color-static-white);\n  --spectrum-listview-item-badge-background-color: var(--spectrum-global-color-blue-400);\n\n  --spectrum-listview-item-draghandle-border-color-key-focus: var(--spectrum-listview-item-border-color-key-focus);\n}\n\n.react-spectrum-ListView {\n  box-sizing: border-box;\n  border-color: var(--spectrum-listview-border-color);\n  border-style: solid;\n  position: relative;\n  border-width: var(--spectrum-listview-border-width);\n  border-radius: var(--spectrum-listview-border-radius);\n  overflow: auto;\n  vertical-align: var(--spectrum-table-cell-vertical-alignment);\n  border-collapse: separate;\n  border-spacing: 0;\n  transform: translate3d(0, 0, 0);\n  padding: 0;\n  background-color: var(--spectrum-listview-background-color);\n  outline: 0;\n  user-select: none;\n\n  .react-spectrum-ListView-row {\n    outline: none;\n  }\n\n  &.react-spectrum-ListView--emphasized {\n    &.react-spectrum-ListView--dropTarget {\n      .react-spectrum-ListViewItem:not(.is-selected) {\n        /* shift bottom border inwards so it doesn't overlap the root drop target */\n        &:after {\n          inset-inline-start: 1px;\n          inset-inline-end: 1px;\n        }\n      }\n    }\n    .react-spectrum-ListViewItem {\n      /* common pseudoelement for box shadows */\n      &:after {\n        content: '';\n        display: block;\n        position: absolute;\n        inset-inline-start: 0;\n        inset-inline-end: 0;\n        inset-block-end: 0;\n        inset-block-start: 0;\n        z-index: 3;\n        pointer-events: none;\n\n        /* forced-color-adjust: none, so that box-shadow style will render */\n        forced-color-adjust: none;\n      }\n\n      &.is-selected {\n        background-color: var(--spectrum-listview-item-background-color-selected);\n        &.is-hovered,\n        &.is-active {\n          background-color: var(--spectrum-listview-item-background-color-selected-hover);\n        }\n\n        &:focus-visible {\n          background-color: var(--spectrum-listview-item-background-color-selected-key-focus);\n        }\n\n        /* Negative block start causes borders to actually be shared between items. Only works if we allow item overflow to be visible, like card focus rings. */\n        &:after {\n          inset-block-start: -1px;\n          box-shadow:\n            inset 1px 0 0 0 var(--spectrum-listview-item-border-color-selected),\n            inset -1px 0 0 0 var(--spectrum-listview-item-border-color-selected),\n            inset 0 -1px 0 0 var(--spectrum-listview-item-border-color-selected),\n            inset 0 1px 0 0 var(--spectrum-listview-item-border-color-selected);\n        }\n      }\n\n      /* First item in the ListView should not have a border that extends outside of itself to the top, it doesn't need to share a border space. */\n      &.react-spectrum-ListViewItem--firstRow {\n        &.is-selected {\n          &:after {\n            inset-block-start: 0px;\n          }\n        }\n      }\n    }\n\n    &:not(.react-spectrum-ListView--quiet) {\n      .react-spectrum-ListViewItem {\n        /* Box shadow for bottom border for non-selected rows that aren't immediately above a selected row (grey border bottom). */\n        /* Also omit bottom border for last row if the total content height of the ListView is equal or greater than the height of the container. This avoids overlapping bottom borders. */\n        &:not(.is-selected):not(.is-next-selected):not(.react-spectrum-ListViewItem--isFlushBottom) {\n          &:after {\n            box-shadow: inset 0 -1px 0 0 var(--spectrum-listview-item-border-color);\n          }\n        }\n\n        &.react-spectrum-ListViewItem--firstRow.is-selected {\n          &:after {\n            border-start-start-radius: var(--spectrum-listview-item-border-radius);\n            border-start-end-radius: var(--spectrum-listview-item-border-radius);\n          }\n        }\n      }\n\n      &:not(.react-spectrum-ListView--loadingMore) {\n        .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem--isFlushBottom.is-selected {\n          &:after {\n            border-end-start-radius: var(--spectrum-listview-item-border-radius);\n            border-end-end-radius: var(--spectrum-listview-item-border-radius);\n          }\n        }\n      }\n\n      &.react-spectrum-ListView--isVerticalScrollbarVisible {\n        .react-spectrum-ListViewItem {\n          &.react-spectrum-ListViewItem--firstRow.is-selected {\n            &:after {\n              border-start-end-radius: 0;\n            }\n          }\n        }\n\n        &:not(.react-spectrum-ListView--loadingMore) {\n          .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem--isFlushBottom.is-selected {\n            &:after {\n              border-end-end-radius: 0;\n            }\n          }\n        }\n      }\n\n      &.react-spectrum-ListView--isHorizontalScrollbarVisible {\n        &:not(.react-spectrum-ListView--loadingMore) {\n          .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem--isFlushBottom.is-selected {\n            &:after {\n              border-end-start-radius: 0;\n              border-end-end-radius: 0;\n            }\n          }\n        }\n      }\n    }\n  }\n  &.react-spectrum-ListView--wrap .react-spectrum-ListViewItem {\n    & .react-spectrum-ListViewItem-content,\n    & .react-spectrum-ListViewItem-description {\n      white-space: normal;\n      height: auto;\n    }\n  }\n}\n\n.react-spectrum-ListView-row {\n  cursor: default;\n  /* Not sticky because listview is a single column. If we want to make sticky, will need a cell wrapper like TableView for display: inline-block */\n  &:focus-visible {\n    &:before {\n      content: '';\n      position: absolute;\n      inset-block-start: 0;\n      inset-block-end: 0;\n      inset-inline-start: 0;\n      width: var(--spectrum-listview-row-sticky-focus-indicator-width);\n      z-index: 4;\n      background: var(--spectrum-listview-row-sticky-focus-indicator-color);\n\n      /* forced-color-adjust: none, so that background color will render for the sticky focus indicator. */\n      forced-color-adjust: none;\n    }\n  }\n}\n\n.react-spectrum-ListView.react-spectrum-ListView--quiet {\n  background-color: var(--spectrum-listview-quiet-background-color);\n  border-width: 0;\n  border-radius: 0;\n\n  .react-spectrum-ListView-row {\n    &.round-tops {\n      &:focus-visible {\n        &:before {\n          border-start-start-radius: var(--spectrum-listview-item-border-radius);\n        }\n      }\n      & > .react-spectrum-ListViewItem {\n        border-start-start-radius: var(--spectrum-listview-item-border-radius);\n        border-start-end-radius: var(--spectrum-listview-item-border-radius);\n\n        &:after {\n          border-start-start-radius: var(--spectrum-listview-item-border-radius);\n          border-start-end-radius: var(--spectrum-listview-item-border-radius);\n        }\n      }\n    }\n\n    &.round-bottoms {\n      &:focus-visible {\n        &:before {\n          border-end-start-radius: var(--spectrum-listview-item-border-radius);\n        }\n      }\n      & > .react-spectrum-ListViewItem {\n        border-end-start-radius: var(--spectrum-listview-item-border-radius);\n        border-end-end-radius: var(--spectrum-listview-item-border-radius);\n\n        &:after {\n          border-end-start-radius: var(--spectrum-listview-item-border-radius);\n          border-end-end-radius: var(--spectrum-listview-item-border-radius);\n        }\n      }\n    }\n  }\n}\n\n.react-spectrum-ListView-row[data-href] {\n  cursor: pointer;\n}\n\n.react-spectrum-ListViewItem {\n  display: grid; /* TODO: define grid areas */\n  box-sizing: border-box;\n  font-size: var(--spectrum-table-cell-text-size, var(--spectrum-alias-font-size-default));\n  font-weight: var(--spectrum-table-cell-text-font-weight, var(--spectrum-global-font-weight-regular));\n  line-height: var(--spectrum-listview-item-line-height);\n  padding: var(--spectrum-listview-item-regular-padding-y) var(--spectrum-global-dimension-size-160);\n  position: relative;\n  /*background-color: var(--spectrum-table-background-color, var(--spectrum-global-color-gray-50));*/\n  color: var(--spectrum-listview-item-text-color);\n  outline: 0;\n  min-height: var(--spectrum-global-dimension-size-500);\n\n  &.is-hovered,\n  &.is-focused {\n    background-color: var(--spectrum-listview-item-background-color-hover);\n  }\n\n  &:focus-visible {\n    background-color: var(--spectrum-listview-item-background-color-hover);\n  }\n\n  &.is-active {\n    background-color: var(--spectrum-listview-item-background-color-down);\n  }\n\n  &.is-selected {\n    background-color: var(--spectrum-listview-item-background-color-hover);\n\n    &.is-hovered,\n    &.is-active {\n      background-color: var(--spectrum-listview-item-background-color-hover);\n    }\n\n    &:focus-visible {\n      background-color: var(--spectrum-listview-item-background-color-selected-key-focus);\n    }\n  }\n\n  &.is-disabled {\n    &, .react-spectrum-ListViewItem-content, .react-spectrum-ListViewItem-description {\n      color: var(--spectrum-listview-item-text-color-disabled);\n    }\n  }\n\n  &.has-checkbox {\n    /* have to eliminate vertical padding to allow proper vertical alignment */\n    padding-top: 0px;\n    padding-bottom: 0px;\n  }\n\n  .react-spectrum-ListViewItem-grid {\n    display: grid;\n    grid-template-columns: auto auto auto 1fr auto auto auto;\n    grid-template-rows: 1fr auto;\n    grid-template-areas:\n      \"draghandle checkbox thumbnail content actions actionmenu chevron\"\n      \"draghandle checkbox thumbnail description actions actionmenu chevron\";\n    align-items: center;\n  }\n\n  .react-spectrum-ListViewItem-draghandle-container {\n    grid-area: draghandle;\n    width: var(--spectrum-global-dimension-size-250);\n    display: flex;\n    align-self: stretch;\n    justify-self: stretch;\n    justify-content: center;\n    padding: var(--spectrum-global-dimension-size-25);\n    padding-inline-start: var(--spectrum-global-dimension-size-40);\n\n\n    .react-spectrum-ListViewItem-draghandle-button {\n      width: var(--spectrum-global-dimension-size-200);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: var(--spectrum-alias-border-radius-regular);\n\n      &:focus-visible {\n        box-shadow: inset 0 0 0 2px var(--spectrum-listview-item-draghandle-border-color-key-focus);\n        outline: none;\n\n        /* forced-color-adjust: none, so that box-shadow style will render */\n        forced-color-adjust: none;\n      }\n    }\n  }\n\n  .react-spectrum-ListViewItem-checkboxWrapper {\n    grid-area: checkbox;\n    align-items: center;\n    justify-items: center;\n    transition-duration: 160ms;\n    display: flex;\n  }\n\n  .react-spectrum-ListViewItem-checkbox {\n    min-height: 0;\n    height: 100%;\n\n    > span {\n      margin: 0;\n    }\n  }\n\n  .react-spectrum-ListViewItem-thumbnail {\n    box-sizing: content-box;\n    grid-area: thumbnail;\n    justify-items: center;\n    padding-inline-end: var(--spectrum-global-dimension-size-100);\n    display: flex;\n    border-radius: var(--spectrum-global-dimension-size-25);\n    width: var(--spectrum-global-dimension-size-400);\n    height: var(--spectrum-global-dimension-size-400);\n    align-items: center;\n    justify-content: center;\n\n    > img {\n      width: unset;\n      height: 100%;\n    }\n  }\n\n  .react-spectrum-ListViewItem-content,\n  .react-spectrum-ListViewItem-description {\n    flex-grow: 1;\n\n    /* truncate text with ellipsis */\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    height: var(--spectrum-listview-item-line-height);\n  }\n\n  .react-spectrum-ListViewItem-content {\n    grid-area: content;\n    color: var(--spectrum-listview-item-title-text-color);\n    font-size: var(--spectrum-listview-item-title-text-size);\n  }\n\n  &:not(.react-spectrum-ListView--hasDescription) {\n    .react-spectrum-ListViewItem-content {\n      grid-area: content / description;\n    }\n  }\n\n  .react-spectrum-ListViewItem-description {\n    grid-area: description;\n    color: var(--spectrum-listview-item-description-text-color);\n    font-size: var(--spectrum-listview-item-description-text-size);\n  }\n\n  .react-spectrum-ListViewItem-actions {\n    grid-area: actions;\n    flex-grow: 0;\n    flex-shrink: 0;\n  }\n\n  .react-spectrum-ListViewItem-actionmenu {\n    grid-area: actionmenu;\n  }\n\n  .react-spectrum-ListViewItem-parentIndicator {\n    grid-area: chevron;\n    padding-inline-start: var(--spectrum-global-dimension-size-75);\n    display: none;\n    transition: color var(--spectrum-global-animation-duration-100);\n\n    &.is-disabled {\n      color: var(--spectrum-alias-icon-color-disabled);\n    }\n  }\n\n  &.react-spectrum-ListViewItem-dragPreview {\n    width: var(--spectrum-global-dimension-size-2400);\n    border: 1px solid var(--spectrum-listview-dropzone-border-color-selected-hover);\n    border-radius: var(--spectrum-alias-border-radius-regular);\n    background-color: var(--spectrum-listview-background-color);\n\n    /* forced-color-adjust: none, so that background-color style will render */\n    forced-color-adjust: none;\n\n    &.react-spectrum-ListViewItem-dragPreview--compact {\n      padding-top: var(--spectrum-listview-item-compact-padding-y);\n      padding-bottom: var(--spectrum-listview-item-compact-padding-y);\n    }\n\n    &.react-spectrum-ListViewItem-dragPreview--spacious {\n      padding-top: var(--spectrum-listview-item-spacious-padding-y);\n      padding-bottom: var(--spectrum-listview-item-spacious-padding-y);\n    }\n\n    .react-spectrum-ListViewItem-grid {\n      grid-template-areas:\n        \"thumbnail content     . badge\"\n        \"thumbnail description . badge\";\n      grid-template-columns: auto auto 1fr auto;\n    }\n\n    .react-spectrum-ListViewItem-badge {\n      grid-area: badge;\n      color: var(--spectrum-listview-item-badge-text-color);\n      background: var(--spectrum-listview-item-badge-background-color);\n      padding: 0 8px;\n      border-radius: var(--spectrum-alias-border-radius-regular);\n    }\n\n    &.react-spectrum-ListViewItem-dragPreview--multiple {\n      position: relative;\n\n      &:after {\n        content: '';\n        display: block;\n        position: absolute;\n        z-index: -1;\n        top: 4px;\n        inset-inline-start: 4px;\n        width: 100%;\n        height: 100%;\n        border: 1px solid var(--spectrum-listview-dropzone-border-color-selected-hover);\n        border-radius: var(--spectrum-alias-border-radius-regular);\n        background-color: var(--spectrum-listview-background-color);\n\n        /* forced-color-adjust: none, so that box-shadow style will render */\n        forced-color-adjust: none;\n      }\n    }\n\n    .react-spectrum-ListViewItem-actions,\n    .react-spectrum-ListViewItem-actionmenu {\n      display: none;\n    }\n  }\n}\n.react-spectrum-ListView:not(.react-spectrum-ListView--quiet) {\n  /* give first and last items border-radius to match listview container */\n\n  .react-spectrum-ListViewItem--firstRow.react-spectrum-ListViewItem {\n    border-start-start-radius: var(--spectrum-listview-item-start-end-border-radius);\n    border-start-end-radius: var(--spectrum-listview-item-start-end-border-radius);\n  }\n\n  .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem {\n    border-end-start-radius: var(--spectrum-listview-item-start-end-border-radius);\n    border-end-end-radius: var(--spectrum-listview-item-start-end-border-radius);\n  }\n\n  &.react-spectrum-ListView--isVerticalScrollbarVisible {\n    .react-spectrum-ListViewItem--firstRow.react-spectrum-ListViewItem {\n      border-start-end-radius: 0;\n    }\n\n    .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem {\n      border-end-end-radius: 0;\n    }\n  }\n\n  &.react-spectrum-ListView--isHorizontalScrollbarVisible {\n    .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem {\n      border-end-start-radius: 0;\n      border-end-end-radius: 0;\n    }\n  }\n}\n\n.react-spectrum-ListView {\n  /* When we can use subgrid, get rid of this. */\n  &.react-spectrum-ListView--hasAnyChildren {\n    .react-spectrum-ListViewItem-parentIndicator {\n      display: inline-block;\n      visibility: hidden;\n    }\n    .react-spectrum-ListViewItem-parentIndicator--hasChildItems {\n      visibility: visible;\n    }\n  }\n}\n\n.react-spectrum-ListView--compact .react-spectrum-ListViewItem {\n  padding-top: var(--spectrum-listview-item-compact-padding-y);\n  padding-bottom: var(--spectrum-listview-item-compact-padding-y);\n  min-height: var(--spectrum-global-dimension-size-400);\n}\n\n.react-spectrum-ListView--spacious .react-spectrum-ListViewItem {\n  padding-top: var(--spectrum-listview-item-spacious-padding-y);\n  padding-bottom: var(--spectrum-listview-item-spacious-padding-y);\n  min-height: var(--spectrum-global-dimension-size-600);\n}\n\n.react-spectrum-ListView--draggable .react-spectrum-ListViewItem {\n  padding-inline-start: 0;\n\n  .react-spectrum-ListViewItem-checkbox {\n    input {\n      inset-inline-start: 0;\n    }\n  }\n}\n\n.react-spectrum-ListViewItem--dropTarget {\n  background-color: var(--spectrum-listview-droptarget-background-color);\n  box-shadow:\n    inset 2px 0 0 0 var(--spectrum-listview-item-border-color-key-focus),\n    inset -2px 0 0 0 var(--spectrum-listview-item-border-color-key-focus),\n    inset 0 -3px 0 0 var(--spectrum-listview-item-border-color-key-focus),\n    inset 0 2px 0 0 var(--spectrum-listview-item-border-color-key-focus);\n\n  /* forced-color-adjust: none, so that box-shadow style will render */\n  forced-color-adjust: none;\n}\n\n.react-spectrum-ListView.react-spectrum-ListView--dropTarget {\n  border-color: var(--spectrum-listview-border-color-key-focus);\n  background-color: var(--spectrum-listview-droptarget-background-color);\n  box-shadow: inset 0 0 0 1px var(--spectrum-listview-item-border-color-key-focus);\n\n  /* forced-color-adjust: none, so that box-shadow and background color styles will render */\n  forced-color-adjust: none;\n\n  /* Add border to quiet ListView only when it is a drop target */\n  &.react-spectrum-ListView--quiet {\n    box-shadow: inset 0 0 0 1px var(--spectrum-listview-item-border-color-key-focus), 0 0 0 1px var(--spectrum-listview-item-border-color-key-focus);\n  }\n}\n\n.react-spectrum-ListView-centeredWrapper {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  &.react-spectrum-ListView-centeredWrapper--loadingMore {\n    padding-top: var(--spectrum-global-dimension-size-50);\n  }\n}\n\n.react-spectrum-ListViewInsertionIndicator {\n  width: calc(100% - (2 * var(--spectrum-listview-dropindicator-circle-size)));\n  inset-inline-start: var(--spectrum-listview-dropindicator-circle-size);\n  position: absolute;\n  outline: none;\n\n  &.react-spectrum-ListViewInsertionIndicator--dropTarget {\n    background: var(--spectrum-listview-dropindicator-border-color);\n    border-bottom: 2px solid var(--spectrum-listview-dropindicator-border-color);\n\n    /* forced-color-adjust: none, so that background color\n    will render border for insertion indicator. */\n    forced-color-adjust: none;\n\n    &:before {\n      left: calc(var(--spectrum-listview-dropindicator-circle-size) * -1);\n    }\n\n    &:after {\n      right: calc(var(--spectrum-listview-dropindicator-circle-size) * -1);\n    }\n\n    &:before,\n    &:after {\n      content: '';\n      position: absolute;\n      top: calc(var(--spectrum-listview-dropindicator-circle-size) * -1 / 2 + var(--spectrum-listview-dropindicator-border-size) / 2);\n      width: var(--spectrum-listview-dropindicator-circle-size);\n      height: var(--spectrum-listview-dropindicator-circle-size);\n      border-radius: 50%;\n      border: var(--spectrum-listview-dropindicator-border-size) solid;\n      box-sizing: border-box;\n      border-color: var(--spectrum-listview-dropindicator-circle-border-color);\n      background-color: var(--spectrum-listview-background-color);\n      z-index: 5;\n\n      /* forced-color-adjust: none, so that box-shadow and background-color styles will render */\n      forced-color-adjust: none;\n    }\n  }\n}\n\n.react-spectrum-ListViewItem-checkbox--enter {\n  opacity: 0.01;\n  max-width: 0px;\n}\n.react-spectrum-ListViewItem-checkbox--enterActive {\n  opacity: 1;\n  max-width: 80px;\n}\n.react-spectrum-ListViewItem-checkbox--exit {\n  opacity: 1;\n  max-width: 80px;\n}\n.react-spectrum-ListViewItem-checkbox--exitActive {\n  opacity: 0.01;\n  max-width: 0px;\n}\n\n.react-spectrum-ListView {\n  &:focus-visible {\n    border-color: var(--spectrum-listview-border-color-key-focus);\n    box-shadow: inset 0 0 0 1px var(--spectrum-listview-border-color-key-focus);\n  }\n}\n\n@media (forced-colors: active) {\n  .react-spectrum-ListView,\n  .react-spectrum-ListViewItem {\n    --spectrum-listview-background-color: Canvas;\n    --spectrum-listview-item-background-color: Canvas;\n    --spectrum-listview-item-background-color-selected: Canvas;\n    --spectrum-listview-border-color-key-focus: Highlight;\n    --spectrum-listview-item-border-color: CanvasText;\n    --spectrum-listview-item-border-color-selected: Highlight;\n    --spectrum-listview-item-border-color-key-focus: Highlight;\n    --spectrum-listview-row-sticky-focus-indicator-color: Highlight;\n    --spectrum-listview-droptarget-background-color: var(--spectrum-alias-global-color-transparent);\n    --spectrum-listview-dropindicator-border-color: Highlight;\n    --spectrum-listview-dropindicator-circle-border-color: Highlight;\n    --spectrum-listview-dropzone-border-color-selected-hover: Highlight;\n    --spectrum-listview-item-badge-text-color: HighlightText;\n    --spectrum-listview-item-badge-background-color: Highlight;\n    --spectrum-listview-item-title-text-color: CanvasText;\n    --spectrum-listview-item-description-text-color: CanvasText;\n  }\n\n  .react-spectrum-ListView-row {\n    &:focus-visible {\n      .react-spectrum-ListViewItem {\n        /* Adds a full outline style to the focused listview item to better distinguish between\n        the selected, not selected, selected + focused and selected + not focused\n        states without using a background color on the row in forced-colors: active mode. */\n        &:after {\n          outline: var(--spectrum-listview-row-sticky-focus-indicator-width) solid var(--spectrum-listview-row-sticky-focus-indicator-color);\n          outline-offset: calc(-1 * var(--spectrum-listview-row-sticky-focus-indicator-width));\n          top: calc(-1 * var(--spectrum-listview-border-width));\n          height: calc(100% + var(--spectrum-listview-border-width));\n        }\n      }\n    }\n  }\n\n  .react-spectrum-ListViewItem-draghandle-container {\n    box-sizing: content-box;\n\n    .react-spectrum-ListViewItem-draghandle-button {\n      /* Use CanvasText, so that focus ring color on drag handle button matches\n      focus ring color for other interactive elements within the listview item. */\n      --spectrum-listview-item-draghandle-border-color-key-focus: CanvasText;\n    }\n  }\n\n}\n"],"names":[],"version":3,"file":"styles.ad343ab0.css.map"}
+{"mappings":"AAYA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA;;;;;;;;;;;;;;;;;;;AAiBE;;;;AAQM;;;;;AAQF;;;;;;;;;;AAeA;;;;AAEE;;;;AAKA;;;;AAKA;;;;;AAaE;;;;AAYA;;;;AAMA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAUE;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAQA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAUA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAUR;;;;;AAQJ;;;;AAII;;;;;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAgBJ;;;;;;AAQQ;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAIF;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAIE;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAIF;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAIE;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AASR;;;;AAIA;;;;;;;;;;;;;AAaE;;;;AASA;;;;AAIA;;;;AAQE;;;;AAMA;;;;AAKF;;;;;AAMA;;;;;;;;AAUA;;;;;;;;;;AAWE;;;;;;;;AAOE;;;;;;AAUJ;;;;;;;AAQA;;;;;AAIE;;;;AAKF;;;;;;;;;;;;AAYE;;;;;AAMF;;;;;;;;AAWA;;;;;;AAOE;;;;AAKF;;;;;;AAMA;;;;;;AAMA;;;;AAIA;;;;;;;AAME;;;;AAKF;;;;;;;;AASE;;;;;AAKA;;;;;AAKA;;;;;;AAOA;;;;;;;;AAQA;;;;AAGE;;;;;;;;;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAkBF;;;;AAUF;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAKA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAME;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAIA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAMA;;;;;AAAA;;;;;AAAA;;;;;AAAA;;;;;AAUA;;;;;AAIA;;;;AAMJ;;;;;;AAMA;;;;;;AAMA;;;;AAII;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAMJ;;;;;;AAYA;;;;;;;AASE;;;;AAKF;;;;;;;;AAME;;;;AAKF;;;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAAA;;;;AAME;;;;;;AAQE;;;;AAIA;;;;AAIA;;;;;;;;;;;;;;;AAoBJ;;;;;AAKA;;;;;AAUA;;;;;AAME;;;;;AAMF;EACE;;;;;;;;;;;;;;;;;;;EA0BM;;;;;;;EAUN;;;;EAGE","sources":["packages/@react-spectrum/list/src/styles.css"],"sourcesContent":["/*\n * Copyright 2022 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n*/\n\n.react-spectrum-ListView,\n.react-spectrum-ListViewItem {\n  --spectrum-listview-item-compact-padding-y: var(--spectrum-global-dimension-size-50);\n  --spectrum-listview-item-regular-padding-y: var(--spectrum-global-dimension-size-85);\n  --spectrum-listview-item-spacious-padding-y: var(--spectrum-global-dimension-size-100);\n  --spectrum-listview-border-width: var(--spectrum-table-border-size, var(--spectrum-alias-border-size-thin));\n  --spectrum-listview-border-radius: var(--spectrum-table-border-radius, var(--spectrum-alias-border-radius-regular));\n  --spectrum-listview-item-border-radius: calc(var(--spectrum-listview-border-radius) - var(--spectrum-listview-border-width));\n  --spectrum-listview-row-sticky-focus-indicator-width: 3px;\n  --spectrum-listview-item-line-height: calc(var(--spectrum-table-cell-text-size, var(--spectrum-alias-font-size-default)) * var(--spectrum-table-cell-text-line-height, var(--spectrum-alias-body-text-line-height)) - 1px);\n  --spectrum-listview-item-title-text-color: var(--spectrum-global-color-gray-800);\n  --spectrum-listview-item-title-text-size: var(--spectrum-global-dimension-font-size-100);\n  --spectrum-listview-item-description-text-color: var(--spectrum-global-color-gray-700);\n  --spectrum-listview-item-description-text-size: var(--spectrum-global-dimension-font-size-75);\n\n  --spectrum-listview-border-color: var(--spectrum-table-border-color, var(--spectrum-alias-border-color-mid));\n  --spectrum-listview-border-color-key-focus: var(--spectrum-table-cell-border-color-key-focus, var(--spectrum-alias-focus-color));\n  --spectrum-listview-background-color: var(--spectrum-table-background-color, var(--spectrum-global-color-gray-50));\n  --spectrum-listview-item-background-color-hover: var(--spectrum-table-row-background-color-hover);\n  --spectrum-listview-item-background-color-down: var(--spectrum-table-row-background-color-down);\n  --spectrum-listview-item-background-color-selected: var(--spectrum-table-row-background-color-selected);\n  --spectrum-listview-item-background-color-selected-hover: var(--spectrum-table-row-background-color-selected);\n  --spectrum-listview-item-background-color-selected-key-focus: var(--spectrum-table-row-background-color-selected-key-focus);\n  --spectrum-listview-item-border-color: var(--spectrum-table-cell-border-color, var(--spectrum-alias-border-color-mid));\n  --spectrum-listview-item-border-color-selected: var(--spectrum-global-color-blue-500);\n  --spectrum-listview-item-border-color-key-focus: var(--spectrum-table-cell-border-color-key-focus, var(--spectrum-alias-focus-color));\n  --spectrum-listview-row-sticky-focus-indicator-color: var(--spectrum-selectlist-option-focus-indicator-color);\n  --spectrum-listview-quiet-background-color: var(--spectrum-alias-background-color-transparent);\n  --spectrum-listview-item-text-color: var(--spectrum-table-cell-text-color, var(--spectrum-alias-text-color));\n  --spectrum-listview-item-text-color-disabled: var(--spectrum-alias-text-color-disabled);\n  --spectrum-listview-droptarget-background-color: var(--spectrum-alias-highlight-selected);\n  --spectrum-listview-dropindicator-border-color: var(--spectrum-dropindicator-border-color);\n  --spectrum-listview-dropindicator-circle-border-color: var(--spectrum-dropindicator-circle-border-color);\n\n  --spectrum-listview-dropindicator-circle-size: var(--spectrum-dropindicator-circle-size);\n  --spectrum-listview-dropindicator-border-size: var(--spectrum-dropindicator-border-size);\n\n  --spectrum-listview-dropzone-border-color-selected-hover: var(--spectrum-dropzone-border-color-selected-hover);\n  --spectrum-listview-item-badge-text-color: var(--spectrum-global-color-static-white);\n  --spectrum-listview-item-badge-background-color: var(--spectrum-global-color-blue-400);\n\n  --spectrum-listview-item-draghandle-border-color-key-focus: var(--spectrum-listview-item-border-color-key-focus);\n}\n\n.react-spectrum-ListView {\n  box-sizing: border-box;\n  border-color: var(--spectrum-listview-border-color);\n  border-style: solid;\n  position: relative;\n  border-width: var(--spectrum-listview-border-width);\n  border-radius: var(--spectrum-listview-border-radius);\n  overflow: auto;\n  vertical-align: var(--spectrum-table-cell-vertical-alignment);\n  border-collapse: separate;\n  border-spacing: 0;\n  transform: translate3d(0, 0, 0);\n  padding: 0;\n  background-color: var(--spectrum-listview-background-color);\n  outline: 0;\n  user-select: none;\n\n  .react-spectrum-ListView-row {\n    outline: none;\n  }\n\n  &.react-spectrum-ListView--emphasized {\n    &.react-spectrum-ListView--dropTarget {\n      .react-spectrum-ListViewItem:not(.is-selected) {\n        /* shift bottom border inwards so it doesn't overlap the root drop target */\n        &:after {\n          inset-inline-start: 1px;\n          inset-inline-end: 1px;\n        }\n      }\n    }\n    .react-spectrum-ListViewItem {\n      /* common pseudoelement for box shadows */\n      &:after {\n        content: '';\n        display: block;\n        position: absolute;\n        inset-inline-start: 0;\n        inset-inline-end: 0;\n        inset-block-end: 0;\n        inset-block-start: 0;\n        z-index: 3;\n        pointer-events: none;\n\n        /* forced-color-adjust: none, so that box-shadow style will render */\n        forced-color-adjust: none;\n      }\n\n      &.is-selected {\n        background-color: var(--spectrum-listview-item-background-color-selected);\n        &.is-hovered,\n        &.is-active {\n          background-color: var(--spectrum-listview-item-background-color-selected-hover);\n        }\n\n        &:focus-visible {\n          background-color: var(--spectrum-listview-item-background-color-selected-key-focus);\n        }\n\n        /* Negative block start causes borders to actually be shared between items. Only works if we allow item overflow to be visible, like card focus rings. */\n        &:after {\n          inset-block-start: -1px;\n          box-shadow:\n            inset 1px 0 0 0 var(--spectrum-listview-item-border-color-selected),\n            inset -1px 0 0 0 var(--spectrum-listview-item-border-color-selected),\n            inset 0 -1px 0 0 var(--spectrum-listview-item-border-color-selected),\n            inset 0 1px 0 0 var(--spectrum-listview-item-border-color-selected);\n        }\n      }\n\n      /* First item in the ListView should not have a border that extends outside of itself to the top, it doesn't need to share a border space. */\n      &.react-spectrum-ListViewItem--firstRow {\n        &.is-selected {\n          &:after {\n            inset-block-start: 0px;\n          }\n        }\n      }\n    }\n\n    &:not(.react-spectrum-ListView--quiet) {\n      .react-spectrum-ListViewItem {\n        /* Box shadow for bottom border for non-selected rows that aren't immediately above a selected row (grey border bottom). */\n        /* Also omit bottom border for last row if the total content height of the ListView is equal or greater than the height of the container. This avoids overlapping bottom borders. */\n        &:not(.is-selected):not(.is-next-selected):not(.react-spectrum-ListViewItem--isFlushBottom) {\n          &:after {\n            box-shadow: inset 0 -1px 0 0 var(--spectrum-listview-item-border-color);\n          }\n        }\n\n        &.react-spectrum-ListViewItem--firstRow.is-selected {\n          &:after {\n            border-start-start-radius: var(--spectrum-listview-item-border-radius);\n            border-start-end-radius: var(--spectrum-listview-item-border-radius);\n          }\n        }\n      }\n\n      &:not(.react-spectrum-ListView--loadingMore) {\n        .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem--isFlushBottom.is-selected {\n          &:after {\n            border-end-start-radius: var(--spectrum-listview-item-border-radius);\n            border-end-end-radius: var(--spectrum-listview-item-border-radius);\n          }\n        }\n      }\n\n      &.react-spectrum-ListView--isVerticalScrollbarVisible {\n        .react-spectrum-ListViewItem {\n          &.react-spectrum-ListViewItem--firstRow.is-selected {\n            &:after {\n              border-start-end-radius: 0;\n            }\n          }\n        }\n\n        &:not(.react-spectrum-ListView--loadingMore) {\n          .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem--isFlushBottom.is-selected {\n            &:after {\n              border-end-end-radius: 0;\n            }\n          }\n        }\n      }\n\n      &.react-spectrum-ListView--isHorizontalScrollbarVisible {\n        &:not(.react-spectrum-ListView--loadingMore) {\n          .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem--isFlushBottom.is-selected {\n            &:after {\n              border-end-start-radius: 0;\n              border-end-end-radius: 0;\n            }\n          }\n        }\n      }\n    }\n  }\n  &.react-spectrum-ListView--wrap .react-spectrum-ListViewItem {\n    & .react-spectrum-ListViewItem-content,\n    & .react-spectrum-ListViewItem-description {\n      white-space: normal;\n      height: auto;\n    }\n  }\n}\n\n.react-spectrum-ListView-row {\n  cursor: default;\n  /* Not sticky because listview is a single column. If we want to make sticky, will need a cell wrapper like TableView for display: inline-block */\n  &:focus-visible {\n    &:before {\n      content: '';\n      position: absolute;\n      inset-block-start: 0;\n      inset-block-end: 0;\n      inset-inline-start: 0;\n      width: var(--spectrum-listview-row-sticky-focus-indicator-width);\n      z-index: 4;\n      background: var(--spectrum-listview-row-sticky-focus-indicator-color);\n\n      /* forced-color-adjust: none, so that background color will render for the sticky focus indicator. */\n      forced-color-adjust: none;\n    }\n  }\n}\n\n.react-spectrum-ListView.react-spectrum-ListView--quiet {\n  background-color: var(--spectrum-listview-quiet-background-color);\n  border-width: 0;\n  border-radius: 0;\n\n  .react-spectrum-ListView-row {\n    &.round-tops {\n      &:focus-visible {\n        &:before {\n          border-start-start-radius: var(--spectrum-listview-item-border-radius);\n        }\n      }\n      & > .react-spectrum-ListViewItem {\n        border-start-start-radius: var(--spectrum-listview-item-border-radius);\n        border-start-end-radius: var(--spectrum-listview-item-border-radius);\n\n        &:after {\n          border-start-start-radius: var(--spectrum-listview-item-border-radius);\n          border-start-end-radius: var(--spectrum-listview-item-border-radius);\n        }\n      }\n    }\n\n    &.round-bottoms {\n      &:focus-visible {\n        &:before {\n          border-end-start-radius: var(--spectrum-listview-item-border-radius);\n        }\n      }\n      & > .react-spectrum-ListViewItem {\n        border-end-start-radius: var(--spectrum-listview-item-border-radius);\n        border-end-end-radius: var(--spectrum-listview-item-border-radius);\n\n        &:after {\n          border-end-start-radius: var(--spectrum-listview-item-border-radius);\n          border-end-end-radius: var(--spectrum-listview-item-border-radius);\n        }\n      }\n    }\n  }\n}\n\n.react-spectrum-ListView-row[data-href] {\n  cursor: pointer;\n}\n\n.react-spectrum-ListViewItem {\n  display: grid; /* TODO: define grid areas */\n  box-sizing: border-box;\n  font-size: var(--spectrum-table-cell-text-size, var(--spectrum-alias-font-size-default));\n  font-weight: var(--spectrum-table-cell-text-font-weight, var(--spectrum-global-font-weight-regular));\n  line-height: var(--spectrum-listview-item-line-height);\n  padding: var(--spectrum-listview-item-regular-padding-y) var(--spectrum-global-dimension-size-160);\n  position: relative;\n  /*background-color: var(--spectrum-table-background-color, var(--spectrum-global-color-gray-50));*/\n  color: var(--spectrum-listview-item-text-color);\n  outline: 0;\n  min-height: var(--spectrum-global-dimension-size-500);\n\n  &.is-hovered,\n  &.is-focused {\n    background-color: var(--spectrum-listview-item-background-color-hover);\n  }\n\n  &:focus-visible {\n    background-color: var(--spectrum-listview-item-background-color-hover);\n  }\n\n  &.is-active {\n    background-color: var(--spectrum-listview-item-background-color-down);\n  }\n\n  &.is-selected {\n    background-color: var(--spectrum-listview-item-background-color-hover);\n\n    &.is-hovered,\n    &.is-active {\n      background-color: var(--spectrum-listview-item-background-color-hover);\n    }\n\n    &:focus-visible {\n      background-color: var(--spectrum-listview-item-background-color-selected-key-focus);\n    }\n  }\n\n  &.is-disabled {\n    &, .react-spectrum-ListViewItem-content, .react-spectrum-ListViewItem-description {\n      color: var(--spectrum-listview-item-text-color-disabled);\n    }\n  }\n\n  &.has-checkbox {\n    /* have to eliminate vertical padding to allow proper vertical alignment */\n    padding-top: 0px;\n    padding-bottom: 0px;\n  }\n\n  .react-spectrum-ListViewItem-grid {\n    display: grid;\n    grid-template-columns: auto auto auto 1fr auto auto auto;\n    grid-template-rows: 1fr auto;\n    grid-template-areas:\n      \"draghandle checkbox thumbnail content actions actionmenu chevron\"\n      \"draghandle checkbox thumbnail description actions actionmenu chevron\";\n    align-items: center;\n  }\n\n  .react-spectrum-ListViewItem-draghandle-container {\n    grid-area: draghandle;\n    width: var(--spectrum-global-dimension-size-250);\n    display: flex;\n    align-self: stretch;\n    justify-self: stretch;\n    justify-content: center;\n    padding: var(--spectrum-global-dimension-size-25);\n    padding-inline-start: var(--spectrum-global-dimension-size-40);\n\n\n    .react-spectrum-ListViewItem-draghandle-button {\n      width: var(--spectrum-global-dimension-size-200);\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      border-radius: var(--spectrum-alias-border-radius-regular);\n\n      &:focus-visible {\n        box-shadow: inset 0 0 0 2px var(--spectrum-listview-item-draghandle-border-color-key-focus);\n        outline: none;\n\n        /* forced-color-adjust: none, so that box-shadow style will render */\n        forced-color-adjust: none;\n      }\n    }\n  }\n\n  .react-spectrum-ListViewItem-checkboxWrapper {\n    grid-area: checkbox;\n    align-items: center;\n    justify-items: center;\n    transition-duration: 160ms;\n    display: flex;\n  }\n\n  .react-spectrum-ListViewItem-checkbox {\n    min-height: 0;\n    height: 100%;\n\n    > span {\n      margin: 0;\n    }\n  }\n\n  .react-spectrum-ListViewItem-thumbnail {\n    box-sizing: content-box;\n    grid-area: thumbnail;\n    justify-items: center;\n    padding-inline-end: var(--spectrum-global-dimension-size-100);\n    display: flex;\n    border-radius: var(--spectrum-global-dimension-size-25);\n    width: var(--spectrum-global-dimension-size-400);\n    height: var(--spectrum-global-dimension-size-400);\n    align-items: center;\n    justify-content: center;\n\n    > img {\n      width: unset;\n      height: 100%;\n    }\n  }\n\n  .react-spectrum-ListViewItem-content,\n  .react-spectrum-ListViewItem-description {\n    flex-grow: 1;\n\n    /* truncate text with ellipsis */\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n    height: var(--spectrum-listview-item-line-height);\n  }\n\n  .react-spectrum-ListViewItem-content {\n    grid-area: content;\n    color: var(--spectrum-listview-item-title-text-color);\n    font-size: var(--spectrum-listview-item-title-text-size);\n  }\n\n  &:not(.react-spectrum-ListView--hasDescription) {\n    .react-spectrum-ListViewItem-content {\n      grid-area: content / description;\n    }\n  }\n\n  .react-spectrum-ListViewItem-description {\n    grid-area: description;\n    color: var(--spectrum-listview-item-description-text-color);\n    font-size: var(--spectrum-listview-item-description-text-size);\n  }\n\n  .react-spectrum-ListViewItem-actions {\n    grid-area: actions;\n    flex-grow: 0;\n    flex-shrink: 0;\n  }\n\n  .react-spectrum-ListViewItem-actionmenu {\n    grid-area: actionmenu;\n  }\n\n  .react-spectrum-ListViewItem-parentIndicator {\n    grid-area: chevron;\n    padding-inline-start: var(--spectrum-global-dimension-size-75);\n    display: none;\n    transition: color var(--spectrum-global-animation-duration-100);\n\n    &.is-disabled {\n      color: var(--spectrum-alias-icon-color-disabled);\n    }\n  }\n\n  &.react-spectrum-ListViewItem-dragPreview {\n    width: var(--spectrum-global-dimension-size-2400);\n    border: 1px solid var(--spectrum-listview-dropzone-border-color-selected-hover);\n    border-radius: var(--spectrum-alias-border-radius-regular);\n    background-color: var(--spectrum-listview-background-color);\n\n    /* forced-color-adjust: none, so that background-color style will render */\n    forced-color-adjust: none;\n\n    &.react-spectrum-ListViewItem-dragPreview--compact {\n      padding-top: var(--spectrum-listview-item-compact-padding-y);\n      padding-bottom: var(--spectrum-listview-item-compact-padding-y);\n    }\n\n    &.react-spectrum-ListViewItem-dragPreview--spacious {\n      padding-top: var(--spectrum-listview-item-spacious-padding-y);\n      padding-bottom: var(--spectrum-listview-item-spacious-padding-y);\n    }\n\n    .react-spectrum-ListViewItem-grid {\n      grid-template-areas:\n        \"thumbnail content     . badge\"\n        \"thumbnail description . badge\";\n      grid-template-columns: auto auto 1fr auto;\n    }\n\n    .react-spectrum-ListViewItem-badge {\n      grid-area: badge;\n      color: var(--spectrum-listview-item-badge-text-color);\n      background: var(--spectrum-listview-item-badge-background-color);\n      padding: 0 8px;\n      border-radius: var(--spectrum-alias-border-radius-regular);\n    }\n\n    &.react-spectrum-ListViewItem-dragPreview--multiple {\n      position: relative;\n\n      &:after {\n        content: '';\n        display: block;\n        position: absolute;\n        z-index: -1;\n        top: 4px;\n        inset-inline-start: 4px;\n        width: 100%;\n        height: 100%;\n        border: 1px solid var(--spectrum-listview-dropzone-border-color-selected-hover);\n        border-radius: var(--spectrum-alias-border-radius-regular);\n        background-color: var(--spectrum-listview-background-color);\n\n        /* forced-color-adjust: none, so that box-shadow style will render */\n        forced-color-adjust: none;\n      }\n    }\n\n    .react-spectrum-ListViewItem-actions,\n    .react-spectrum-ListViewItem-actionmenu {\n      display: none;\n    }\n  }\n}\n.react-spectrum-ListView:not(.react-spectrum-ListView--quiet) {\n  /* give first and last items border-radius to match listview container */\n\n  .react-spectrum-ListViewItem--firstRow.react-spectrum-ListViewItem {\n    border-start-start-radius: var(--spectrum-listview-item-start-end-border-radius);\n    border-start-end-radius: var(--spectrum-listview-item-start-end-border-radius);\n  }\n\n  .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem {\n    border-end-start-radius: var(--spectrum-listview-item-start-end-border-radius);\n    border-end-end-radius: var(--spectrum-listview-item-start-end-border-radius);\n  }\n\n  &.react-spectrum-ListView--isVerticalScrollbarVisible {\n    .react-spectrum-ListViewItem--firstRow.react-spectrum-ListViewItem {\n      border-start-end-radius: 0;\n    }\n\n    .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem {\n      border-end-end-radius: 0;\n    }\n  }\n\n  &.react-spectrum-ListView--isHorizontalScrollbarVisible {\n    .react-spectrum-ListViewItem--lastRow.react-spectrum-ListViewItem {\n      border-end-start-radius: 0;\n      border-end-end-radius: 0;\n    }\n  }\n}\n\n.react-spectrum-ListView {\n  /* When we can use subgrid, get rid of this. */\n  &.react-spectrum-ListView--hasAnyChildren {\n    .react-spectrum-ListViewItem-parentIndicator {\n      display: inline-block;\n      visibility: hidden;\n    }\n    .react-spectrum-ListViewItem-parentIndicator--hasChildItems {\n      visibility: visible;\n    }\n  }\n}\n\n.react-spectrum-ListView--compact .react-spectrum-ListViewItem {\n  padding-top: var(--spectrum-listview-item-compact-padding-y);\n  padding-bottom: var(--spectrum-listview-item-compact-padding-y);\n  min-height: var(--spectrum-global-dimension-size-400);\n}\n\n.react-spectrum-ListView--spacious .react-spectrum-ListViewItem {\n  padding-top: var(--spectrum-listview-item-spacious-padding-y);\n  padding-bottom: var(--spectrum-listview-item-spacious-padding-y);\n  min-height: var(--spectrum-global-dimension-size-600);\n}\n\n.react-spectrum-ListView--draggable .react-spectrum-ListViewItem {\n  padding-inline-start: 0;\n\n  .react-spectrum-ListViewItem-checkbox {\n    input {\n      inset-inline-start: 0;\n    }\n  }\n}\n\n.react-spectrum-ListViewItem--dropTarget {\n  background-color: var(--spectrum-listview-droptarget-background-color);\n  box-shadow:\n    inset 2px 0 0 0 var(--spectrum-listview-item-border-color-key-focus),\n    inset -2px 0 0 0 var(--spectrum-listview-item-border-color-key-focus),\n    inset 0 -3px 0 0 var(--spectrum-listview-item-border-color-key-focus),\n    inset 0 2px 0 0 var(--spectrum-listview-item-border-color-key-focus);\n\n  /* forced-color-adjust: none, so that box-shadow style will render */\n  forced-color-adjust: none;\n}\n\n.react-spectrum-ListView.react-spectrum-ListView--dropTarget {\n  border-color: var(--spectrum-listview-border-color-key-focus);\n  background-color: var(--spectrum-listview-droptarget-background-color);\n  box-shadow: inset 0 0 0 1px var(--spectrum-listview-item-border-color-key-focus);\n\n  /* forced-color-adjust: none, so that box-shadow and background color styles will render */\n  forced-color-adjust: none;\n\n  /* Add border to quiet ListView only when it is a drop target */\n  &.react-spectrum-ListView--quiet {\n    box-shadow: inset 0 0 0 1px var(--spectrum-listview-item-border-color-key-focus), 0 0 0 1px var(--spectrum-listview-item-border-color-key-focus);\n  }\n}\n\n.react-spectrum-ListView-centeredWrapper {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  &.react-spectrum-ListView-centeredWrapper--loadingMore {\n    padding-top: var(--spectrum-global-dimension-size-50);\n  }\n}\n\n.react-spectrum-ListViewInsertionIndicator {\n  width: calc(100% - (2 * var(--spectrum-listview-dropindicator-circle-size)));\n  inset-inline-start: var(--spectrum-listview-dropindicator-circle-size);\n  position: absolute;\n  outline: none;\n\n  &.react-spectrum-ListViewInsertionIndicator--dropTarget {\n    background: var(--spectrum-listview-dropindicator-border-color);\n    border-bottom: 2px solid var(--spectrum-listview-dropindicator-border-color);\n\n    /* forced-color-adjust: none, so that background color\n    will render border for insertion indicator. */\n    forced-color-adjust: none;\n\n    &:before {\n      left: calc(var(--spectrum-listview-dropindicator-circle-size) * -1);\n    }\n\n    &:after {\n      right: calc(var(--spectrum-listview-dropindicator-circle-size) * -1);\n    }\n\n    &:before,\n    &:after {\n      content: '';\n      position: absolute;\n      top: calc(var(--spectrum-listview-dropindicator-circle-size) * -1 / 2 + var(--spectrum-listview-dropindicator-border-size) / 2);\n      width: var(--spectrum-listview-dropindicator-circle-size);\n      height: var(--spectrum-listview-dropindicator-circle-size);\n      border-radius: 50%;\n      border: var(--spectrum-listview-dropindicator-border-size) solid;\n      box-sizing: border-box;\n      border-color: var(--spectrum-listview-dropindicator-circle-border-color);\n      background-color: var(--spectrum-listview-background-color);\n      z-index: 5;\n\n      /* forced-color-adjust: none, so that box-shadow and background-color styles will render */\n      forced-color-adjust: none;\n    }\n  }\n}\n\n.react-spectrum-ListViewItem-checkbox--enter {\n  opacity: 0.01;\n  max-width: 0px;\n}\n.react-spectrum-ListViewItem-checkbox--enterActive {\n  opacity: 1;\n  max-width: 80px;\n}\n.react-spectrum-ListViewItem-checkbox--exit {\n  opacity: 1;\n  max-width: 80px;\n}\n.react-spectrum-ListViewItem-checkbox--exitActive {\n  opacity: 0.01;\n  max-width: 0px;\n}\n\n.react-spectrum-ListView {\n  &:focus-visible {\n    border-color: var(--spectrum-listview-border-color-key-focus);\n    box-shadow: inset 0 0 0 1px var(--spectrum-listview-border-color-key-focus);\n  }\n}\n\n@media (forced-colors: active) {\n  .react-spectrum-ListView,\n  .react-spectrum-ListViewItem {\n    --spectrum-listview-background-color: Canvas;\n    --spectrum-listview-item-background-color: Canvas;\n    --spectrum-listview-item-background-color-selected: Canvas;\n    --spectrum-listview-border-color-key-focus: Highlight;\n    --spectrum-listview-item-border-color: CanvasText;\n    --spectrum-listview-item-border-color-selected: Highlight;\n    --spectrum-listview-item-border-color-key-focus: Highlight;\n    --spectrum-listview-row-sticky-focus-indicator-color: Highlight;\n    --spectrum-listview-droptarget-background-color: var(--spectrum-alias-global-color-transparent);\n    --spectrum-listview-dropindicator-border-color: Highlight;\n    --spectrum-listview-dropindicator-circle-border-color: Highlight;\n    --spectrum-listview-dropzone-border-color-selected-hover: Highlight;\n    --spectrum-listview-item-badge-text-color: HighlightText;\n    --spectrum-listview-item-badge-background-color: Highlight;\n    --spectrum-listview-item-title-text-color: CanvasText;\n    --spectrum-listview-item-description-text-color: CanvasText;\n  }\n\n  .react-spectrum-ListView-row {\n    &:focus-visible {\n      .react-spectrum-ListViewItem {\n        /* Adds a full outline style to the focused listview item to better distinguish between\n        the selected, not selected, selected + focused and selected + not focused\n        states without using a background color on the row in forced-colors: active mode. */\n        &:after {\n          outline: var(--spectrum-listview-row-sticky-focus-indicator-width) solid var(--spectrum-listview-row-sticky-focus-indicator-color);\n          outline-offset: calc(-1 * var(--spectrum-listview-row-sticky-focus-indicator-width));\n          top: calc(-1 * var(--spectrum-listview-border-width));\n          height: calc(100% + var(--spectrum-listview-border-width));\n        }\n      }\n    }\n  }\n\n  .react-spectrum-ListViewItem-draghandle-container {\n    box-sizing: content-box;\n\n    .react-spectrum-ListViewItem-draghandle-button {\n      /* Use CanvasText, so that focus ring color on drag handle button matches\n      focus ring color for other interactive elements within the listview item. */\n      --spectrum-listview-item-draghandle-border-color-key-focus: CanvasText;\n    }\n  }\n\n}\n"],"names":[],"version":3,"file":"list.5918e378.css.map"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-spectrum/list",
-  "version": "3.9.2",
+  "version": "3.10.0",
   "description": "Spectrum UI components in React",
   "license": "Apache-2.0",
   "main": "dist/main.js",
@@ -36,28 +36,28 @@
     "url": "https://github.com/adobe/react-spectrum"
   },
   "dependencies": {
-    "@react-aria/button": "^3.12.0",
-    "@react-aria/focus": "^3.20.0",
-    "@react-aria/gridlist": "^3.11.0",
-    "@react-aria/i18n": "^3.12.6",
-    "@react-aria/interactions": "^3.24.0",
-    "@react-aria/selection": "^3.23.0",
-    "@react-aria/utils": "^3.28.0",
-    "@react-aria/virtualizer": "^4.1.2",
-    "@react-aria/visually-hidden": "^3.8.20",
-    "@react-spectrum/checkbox": "^3.9.13",
-    "@react-spectrum/dnd": "^3.5.2",
-    "@react-spectrum/layout": "^3.6.12",
-    "@react-spectrum/progress": "^3.7.13",
-    "@react-spectrum/text": "^3.5.12",
-    "@react-spectrum/utils": "^3.12.2",
-    "@react-stately/collections": "^3.12.2",
-    "@react-stately/layout": "^4.2.0",
-    "@react-stately/list": "^3.12.0",
-    "@react-stately/virtualizer": "^4.3.0",
-    "@react-types/grid": "^3.3.0",
-    "@react-types/shared": "^3.28.0",
-    "@spectrum-icons/ui": "^3.6.13",
+    "@react-aria/button": "^3.13.0",
+    "@react-aria/focus": "^3.20.2",
+    "@react-aria/gridlist": "^3.12.0",
+    "@react-aria/i18n": "^3.12.8",
+    "@react-aria/interactions": "^3.25.0",
+    "@react-aria/selection": "^3.24.0",
+    "@react-aria/utils": "^3.28.2",
+    "@react-aria/virtualizer": "^4.1.4",
+    "@react-aria/visually-hidden": "^3.8.22",
+    "@react-spectrum/checkbox": "^3.9.15",
+    "@react-spectrum/dnd": "^3.5.4",
+    "@react-spectrum/layout": "^3.6.14",
+    "@react-spectrum/progress": "^3.7.15",
+    "@react-spectrum/text": "^3.5.14",
+    "@react-spectrum/utils": "^3.12.4",
+    "@react-stately/collections": "^3.12.3",
+    "@react-stately/layout": "^4.2.2",
+    "@react-stately/list": "^3.12.1",
+    "@react-stately/virtualizer": "^4.3.2",
+    "@react-types/grid": "^3.3.1",
+    "@react-types/shared": "^3.29.0",
+    "@spectrum-icons/ui": "^3.6.15",
     "@swc/helpers": "^0.5.0",
     "react-transition-group": "^4.4.5"
   },
@@ -75,5 +75,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "4d3c72c94eea2d72eb3a0e7d56000c6ef7e39726"
+  "gitHead": "9b66d270572f482948afee95622a85cdf68ed408"
 }

package/src/DragPreview.tsx

@@ -13,7 +13,7 @@ import {classNames, SlotProvider} from '@react-spectrum/utils';
 import {Grid} from '@react-spectrum/layout';
 import {GridNode} from '@react-types/grid';
 import listStyles from './styles.css';
-import React from 'react';
+import React, {ReactNode} from 'react';
 import type {SpectrumListViewProps} from './ListView';
 import {Text} from '@react-spectrum/text';
 
@@ -24,7 +24,7 @@ interface DragPreviewProps<T> {
   density: SpectrumListViewProps<T>['density']
 }
 
-export function DragPreview(props: DragPreviewProps<unknown>) {
+export function DragPreview(props: DragPreviewProps<unknown>): ReactNode {
   let {
     item,
     itemCount,

package/src/InsertionIndicator.tsx

@@ -2,7 +2,7 @@ import {classNames} from '@react-spectrum/utils';
 import {ItemDropTarget} from '@react-types/shared';
 import listStyles from './styles.css';
 import {ListViewContext} from './ListView';
-import React, {useContext, useRef} from 'react';
+import React, {ReactNode, useContext, useRef} from 'react';
 import {useVisuallyHidden} from '@react-aria/visually-hidden';
 
 interface InsertionIndicatorProps {
@@ -10,7 +10,7 @@ interface InsertionIndicatorProps {
   isPresentationOnly?: boolean
 }
 
-export default function InsertionIndicator(props: InsertionIndicatorProps) {
+export default function InsertionIndicator(props: InsertionIndicatorProps): ReactNode | null {
   let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;
   const {target, isPresentationOnly} = props;
 

package/src/ListView.tsx

@@ -124,10 +124,10 @@ export const ListView = React.forwardRef(function ListView<T extends object>(pro
   let dragHooksProvided = useRef(isListDraggable);
   let dropHooksProvided = useRef(isListDroppable);
   useEffect(() => {
-    if (dragHooksProvided.current !== isListDraggable) {
+    if (dragHooksProvided.current !== isListDraggable && process.env.NODE_ENV !== 'production') {
       console.warn('Drag hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
     }
-    if (dropHooksProvided.current !== isListDroppable) {
+    if (dropHooksProvided.current !== isListDroppable && process.env.NODE_ENV !== 'production') {
       console.warn('Drop hooks were provided during one render, but not another. This should be avoided as it may produce unexpected behavior.');
     }
   }, [isListDraggable, isListDroppable]);

package/src/ListViewItem.tsx

@@ -24,7 +24,7 @@ import listStyles from './styles.css';
 import {ListViewContext} from './ListView';
 import {mergeProps} from '@react-aria/utils';
 import {Provider} from '@react-spectrum/provider';
-import React, {useContext, useRef} from 'react';
+import React, {ReactNode, useContext, useRef} from 'react';
 import {Text} from '@react-spectrum/text';
 import {useButton} from '@react-aria/button';
 import {useGridListItem, useGridListSelectionCheckbox} from '@react-aria/gridlist';
@@ -37,7 +37,7 @@ interface ListViewItemProps<T> {
   hasActions: boolean
 }
 
-export function ListViewItem<T>(props: ListViewItemProps<T>) {
+export function ListViewItem<T>(props: ListViewItemProps<T>): ReactNode {
   let {
     item,
     isEmphasized
@@ -81,7 +81,7 @@ export function ListViewItem<T>(props: ListViewItemProps<T>) {
 
   let draggableItem: DraggableItemResult | null = null;
   if (isListDraggable && dragAndDropHooks && dragState) {
-     
+
     draggableItem = dragAndDropHooks.useDraggableItem!({key: item.key, hasDragButton: true}, dragState);
     if (isDisabled) {
       draggableItem = null;
@@ -93,7 +93,7 @@ export function ListViewItem<T>(props: ListViewItemProps<T>) {
   if (isListDroppable && dragAndDropHooks && dropState) {
     let target = {type: 'item', key: item.key, dropPosition: 'on'} as DropTarget;
     isDropTarget = dropState.isDropTarget(target);
-     
+
     dropIndicator = dragAndDropHooks.useDropIndicator!({target}, dropState, dropIndicatorRef);
   }
 
@@ -143,7 +143,7 @@ export function ListViewItem<T>(props: ListViewItemProps<T>) {
     focusWithinProps,
     focusProps
   );
-  
+
   // Remove tab index from list row if performing a screenreader drag. This prevents TalkBack from focusing the row,
   // allowing for single swipe navigation between row drop indicator
   if (dragAndDropHooks?.isVirtualDragging?.()) {

package/src/RootDropIndicator.tsx

@@ -1,8 +1,8 @@
 import {ListViewContext} from './ListView';
-import React, {useContext, useRef} from 'react';
+import React, {ReactNode, useContext, useRef} from 'react';
 import {useVisuallyHidden} from '@react-aria/visually-hidden';
 
-export default function RootDropIndicator() {
+export default function RootDropIndicator(): ReactNode | null {
   let {dropState, dragAndDropHooks} = useContext(ListViewContext)!;
   let ref = useRef<HTMLDivElement | null>(null);
   let {dropIndicatorProps} = dragAndDropHooks!.useDropIndicator!({