@react-stately/layout 4.2.2 → 4.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/GridLayout.main.js +17 -4
- package/dist/GridLayout.main.js.map +1 -1
- package/dist/GridLayout.mjs +17 -4
- package/dist/GridLayout.module.js +17 -4
- package/dist/GridLayout.module.js.map +1 -1
- package/dist/ListLayout.main.js +24 -5
- package/dist/ListLayout.main.js.map +1 -1
- package/dist/ListLayout.mjs +24 -5
- package/dist/ListLayout.module.js +24 -5
- package/dist/ListLayout.module.js.map +1 -1
- package/dist/TableLayout.main.js +26 -4
- package/dist/TableLayout.main.js.map +1 -1
- package/dist/TableLayout.mjs +27 -5
- package/dist/TableLayout.module.js +27 -5
- package/dist/TableLayout.module.js.map +1 -1
- package/dist/WaterfallLayout.main.js +30 -18
- package/dist/WaterfallLayout.main.js.map +1 -1
- package/dist/WaterfallLayout.mjs +30 -18
- package/dist/WaterfallLayout.module.js +30 -18
- package/dist/WaterfallLayout.module.js.map +1 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +13 -9
- package/src/GridLayout.ts +21 -4
- package/src/ListLayout.ts +30 -8
- package/src/TableLayout.ts +35 -5
- package/src/WaterfallLayout.ts +16 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-stately/layout/src/WaterfallLayout.ts"],"sourcesContent":["/*\n * Copyright 2024 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 {DropTarget, DropTargetDelegate, Key, LayoutDelegate, Node} from '@react-types/shared';\nimport {InvalidationContext, Layout, LayoutInfo, Point, Rect, Size} from '@react-stately/virtualizer';\n\nexport interface WaterfallLayoutOptions {\n /**\n * The minimum item size.\n * @default 200 x 200\n */\n minItemSize?: Size,\n /**\n * The maximum item size.\n * @default Infinity\n */\n maxItemSize?: Size,\n /**\n * The minimum space required between items.\n * @default 18 x 18\n */\n minSpace?: Size,\n /**\n * The maximum number of columns.\n * @default Infinity\n */\n maxColumns?: number,\n /**\n * The thickness of the drop indicator.\n * @default 2\n */\n dropIndicatorThickness?: number\n}\n\nclass WaterfallLayoutInfo extends LayoutInfo {\n column = 0;\n\n copy(): WaterfallLayoutInfo {\n let res = super.copy() as WaterfallLayoutInfo;\n res.column = this.column;\n return res;\n }\n}\n\nconst DEFAULT_OPTIONS = {\n minItemSize: new Size(200, 200),\n maxItemSize: new Size(Infinity, Infinity),\n minSpace: new Size(18, 18),\n maxColumns: Infinity,\n dropIndicatorThickness: 2\n};\n\nexport class WaterfallLayout<T extends object, O extends WaterfallLayoutOptions = WaterfallLayoutOptions> extends Layout<Node<T>, O> implements LayoutDelegate, DropTargetDelegate {\n private contentSize: Size = new Size();\n private layoutInfos: Map<Key, WaterfallLayoutInfo> = new Map();\n protected numColumns = 0;\n protected dropIndicatorThickness = 2;\n\n shouldInvalidateLayoutOptions(newOptions: O, oldOptions: O): boolean {\n return newOptions.maxColumns !== oldOptions.maxColumns\n || newOptions.dropIndicatorThickness !== oldOptions.dropIndicatorThickness\n || (!(newOptions.minItemSize || DEFAULT_OPTIONS.minItemSize).equals(oldOptions.minItemSize || DEFAULT_OPTIONS.minItemSize))\n || (!(newOptions.maxItemSize || DEFAULT_OPTIONS.maxItemSize).equals(oldOptions.maxItemSize || DEFAULT_OPTIONS.maxItemSize))\n || (!(newOptions.minSpace || DEFAULT_OPTIONS.minSpace).equals(oldOptions.minSpace || DEFAULT_OPTIONS.minSpace));\n }\n\n update(invalidationContext: InvalidationContext<O>): void {\n let {\n minItemSize = DEFAULT_OPTIONS.minItemSize,\n maxItemSize = DEFAULT_OPTIONS.maxItemSize,\n minSpace = DEFAULT_OPTIONS.minSpace,\n maxColumns = DEFAULT_OPTIONS.maxColumns,\n dropIndicatorThickness = DEFAULT_OPTIONS.dropIndicatorThickness\n } = invalidationContext.layoutOptions || {};\n this.dropIndicatorThickness = dropIndicatorThickness;\n let visibleWidth = this.virtualizer!.visibleRect.width;\n\n // The max item width is always the entire viewport.\n // If the max item height is infinity, scale in proportion to the max width.\n let maxItemWidth = Math.min(maxItemSize.width, visibleWidth);\n let maxItemHeight = Number.isFinite(maxItemSize.height)\n ? maxItemSize.height\n : Math.floor((minItemSize.height / minItemSize.width) * maxItemWidth);\n\n // Compute the number of rows and columns needed to display the content\n let columns = Math.floor(visibleWidth / (minItemSize.width + minSpace.width));\n let numColumns = Math.max(1, Math.min(maxColumns, columns));\n\n // Compute the available width (minus the space between items)\n let width = visibleWidth - (minSpace.width * Math.max(0, numColumns));\n\n // Compute the item width based on the space available\n let itemWidth = Math.floor(width / numColumns);\n itemWidth = Math.max(minItemSize.width, Math.min(maxItemWidth, itemWidth));\n\n // Compute the item height, which is proportional to the item width\n let t = ((itemWidth - minItemSize.width) / Math.max(1, maxItemWidth - minItemSize.width));\n let itemHeight = minItemSize.height + Math.floor((maxItemHeight - minItemSize.height) * t);\n itemHeight = Math.max(minItemSize.height, Math.min(maxItemHeight, itemHeight));\n\n // Compute the horizontal spacing and content height\n let horizontalSpacing = Math.floor((visibleWidth - numColumns * itemWidth) / (numColumns + 1));\n\n // Setup an array of column heights\n let columnHeights = Array(numColumns).fill(minSpace.height);\n let newLayoutInfos = new Map();\n let addNode = (key: Key, node: Node<T>) => {\n let oldLayoutInfo = this.layoutInfos.get(key);\n let height = itemHeight;\n let estimatedSize = true;\n if (oldLayoutInfo) {\n height = oldLayoutInfo.rect.height;\n estimatedSize = invalidationContext.sizeChanged || oldLayoutInfo.estimatedSize || oldLayoutInfo.content !== node;\n }\n\n // Figure out which column to place the item in, and compute its position.\n // Preserve the previous column index so items don't jump around during resizing unless the number of columns changed.\n let prevColumn = numColumns === this.numColumns && oldLayoutInfo && oldLayoutInfo.rect.y < this.virtualizer!.visibleRect.maxY ? oldLayoutInfo.column : undefined;\n let column = prevColumn ?? columnHeights.reduce((minIndex, h, i) => h < columnHeights[minIndex] ? i : minIndex, 0);\n let x = horizontalSpacing + column * (itemWidth + horizontalSpacing);\n let y = columnHeights[column];\n\n let rect = new Rect(x, y, itemWidth, height);\n let layoutInfo = new WaterfallLayoutInfo(node.type, key, rect);\n layoutInfo.estimatedSize = estimatedSize;\n layoutInfo.allowOverflow = true;\n layoutInfo.content = node;\n layoutInfo.column = column;\n newLayoutInfos.set(key, layoutInfo);\n\n columnHeights[column] += layoutInfo.rect.height + minSpace.height;\n };\n\n let skeletonCount = 0;\n for (let node of this.virtualizer!.collection) {\n if (node.type === 'skeleton') {\n // Add skeleton cards until every column has at least one, and we fill the viewport.\n let startingHeights = [...columnHeights];\n while (\n !columnHeights.every((h, i) => h !== startingHeights[i]) ||\n Math.min(...columnHeights) < this.virtualizer!.visibleRect.height\n ) {\n let key = `${node.key}-${skeletonCount++}`;\n let content = this.layoutInfos.get(key)?.content || {...node};\n addNode(key, content);\n }\n break;\n } else {\n addNode(node.key, node);\n }\n }\n\n // Reset all columns to the maximum for the next section\n let maxHeight = Math.max(...columnHeights);\n this.contentSize = new Size(this.virtualizer!.visibleRect.width, maxHeight);\n this.layoutInfos = newLayoutInfos;\n this.numColumns = numColumns;\n }\n\n getLayoutInfo(key: Key): LayoutInfo {\n return this.layoutInfos.get(key)!;\n }\n\n getContentSize(): Size {\n return this.contentSize;\n }\n\n getVisibleLayoutInfos(rect: Rect): LayoutInfo[] {\n let layoutInfos: LayoutInfo[] = [];\n for (let layoutInfo of this.layoutInfos.values()) {\n if (layoutInfo.rect.intersects(rect) || this.virtualizer!.isPersistedKey(layoutInfo.key)) {\n layoutInfos.push(layoutInfo);\n }\n }\n return layoutInfos;\n }\n\n updateItemSize(key: Key, size: Size): boolean {\n let layoutInfo = this.layoutInfos.get(key);\n if (!size || !layoutInfo) {\n return false;\n }\n\n if (size.height !== layoutInfo.rect.height) {\n let newLayoutInfo = layoutInfo.copy();\n newLayoutInfo.rect.height = size.height;\n newLayoutInfo.estimatedSize = false;\n this.layoutInfos.set(key, newLayoutInfo);\n return true;\n }\n\n return false;\n }\n\n // Override keyboard navigation to work spatially.\n getKeyRightOf(key: Key): Key | null {\n let layoutInfo = this.getLayoutInfo(key);\n if (!layoutInfo) {\n return null;\n }\n\n let rect = new Rect(layoutInfo.rect.maxX, layoutInfo.rect.y, this.virtualizer!.visibleRect.maxX - layoutInfo.rect.maxX, layoutInfo.rect.height);\n let layoutInfos = this.getVisibleLayoutInfos(rect);\n let bestKey: Key | null = null;\n let bestDistance = Infinity;\n for (let candidate of layoutInfos) {\n if (candidate.key === key) {\n continue;\n }\n\n // Find the closest item in the x direction with the most overlap in the y direction.\n let deltaX = candidate.rect.x - rect.x;\n let overlapY = Math.min(candidate.rect.maxY, rect.maxY) - Math.max(candidate.rect.y, rect.y);\n let distance = deltaX - overlapY;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestKey = candidate.key;\n }\n }\n\n return bestKey;\n }\n\n getKeyLeftOf(key: Key): Key | null {\n let layoutInfo = this.getLayoutInfo(key);\n if (!layoutInfo) {\n return null;\n }\n\n let rect = new Rect(0, layoutInfo.rect.y, layoutInfo.rect.x, layoutInfo.rect.height);\n let layoutInfos = this.getVisibleLayoutInfos(rect);\n let bestKey: Key | null = null;\n let bestDistance = Infinity;\n for (let candidate of layoutInfos) {\n if (candidate.key === key) {\n continue;\n }\n\n // Find the closest item in the x direction with the most overlap in the y direction.\n let deltaX = rect.maxX - candidate.rect.maxX;\n let overlapY = Math.min(candidate.rect.maxY, rect.maxY) - Math.max(candidate.rect.y, rect.y);\n let distance = deltaX - overlapY;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestKey = candidate.key;\n }\n }\n\n return bestKey;\n }\n\n // This overrides the default behavior of shift selection to work spatially\n // rather than following the order of the items in the collection (which may appear unpredictable).\n getKeyRange(from: Key, to: Key): Key[] {\n let fromLayoutInfo = this.getLayoutInfo(from);\n let toLayoutInfo = this.getLayoutInfo(to);\n if (!fromLayoutInfo || !toLayoutInfo) {\n return [];\n }\n\n // Find items where half of the area intersects the rectangle\n // formed from the first item to the last item in the range.\n let rect = fromLayoutInfo.rect.union(toLayoutInfo.rect);\n let keys: Key[] = [];\n for (let layoutInfo of this.layoutInfos.values()) {\n if (rect.intersection(layoutInfo.rect).area > layoutInfo.rect.area / 2) {\n keys.push(layoutInfo.key);\n }\n }\n return keys;\n }\n\n getDropTargetFromPoint(x: number, y: number): DropTarget {\n if (this.layoutInfos.size === 0) {\n return {type: 'root'};\n }\n\n x += this.virtualizer!.visibleRect.x;\n y += this.virtualizer!.visibleRect.y;\n let key = this.virtualizer!.keyAtPoint(new Point(x, y));\n if (key == null) {\n return {type: 'root'};\n }\n\n // Only support \"on\" drop position in waterfall layout.\n // Reordering doesn't make sense because the items don't have a deterministic order.\n return {\n type: 'item',\n key,\n dropPosition: 'on'\n };\n }\n}\n"],"names":[],"version":3,"file":"WaterfallLayout.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-stately/layout/src/WaterfallLayout.ts"],"sourcesContent":["/*\n * Copyright 2024 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 {DropTarget, DropTargetDelegate, Key, LayoutDelegate, Node} from '@react-types/shared';\nimport {InvalidationContext, Layout, LayoutInfo, Point, Rect, Size} from '@react-stately/virtualizer';\n\nexport interface WaterfallLayoutOptions {\n /**\n * The minimum item size.\n * @default 200 x 200\n */\n minItemSize?: Size,\n /**\n * The maximum item size.\n * @default Infinity\n */\n maxItemSize?: Size,\n /**\n * The minimum space required between items.\n * @default 18 x 18\n */\n minSpace?: Size,\n /**\n * The maximum number of columns.\n * @default Infinity\n */\n maxColumns?: number,\n /**\n * The thickness of the drop indicator.\n * @default 2\n */\n dropIndicatorThickness?: number\n}\n\nclass WaterfallLayoutInfo extends LayoutInfo {\n column = 0;\n\n copy(): WaterfallLayoutInfo {\n let res = super.copy() as WaterfallLayoutInfo;\n res.column = this.column;\n return res;\n }\n}\n\nconst DEFAULT_OPTIONS = {\n minItemSize: new Size(200, 200),\n maxItemSize: new Size(Infinity, Infinity),\n minSpace: new Size(18, 18),\n maxColumns: Infinity,\n dropIndicatorThickness: 2\n};\n\nexport class WaterfallLayout<T extends object, O extends WaterfallLayoutOptions = WaterfallLayoutOptions> extends Layout<Node<T>, O> implements LayoutDelegate, DropTargetDelegate {\n private contentSize: Size = new Size();\n private layoutInfos: Map<Key, WaterfallLayoutInfo> = new Map();\n protected numColumns = 0;\n protected dropIndicatorThickness = 2;\n\n shouldInvalidateLayoutOptions(newOptions: O, oldOptions: O): boolean {\n return newOptions.maxColumns !== oldOptions.maxColumns\n || newOptions.dropIndicatorThickness !== oldOptions.dropIndicatorThickness\n || (!(newOptions.minItemSize || DEFAULT_OPTIONS.minItemSize).equals(oldOptions.minItemSize || DEFAULT_OPTIONS.minItemSize))\n || (!(newOptions.maxItemSize || DEFAULT_OPTIONS.maxItemSize).equals(oldOptions.maxItemSize || DEFAULT_OPTIONS.maxItemSize))\n || (!(newOptions.minSpace || DEFAULT_OPTIONS.minSpace).equals(oldOptions.minSpace || DEFAULT_OPTIONS.minSpace));\n }\n\n update(invalidationContext: InvalidationContext<O>): void {\n let {\n minItemSize = DEFAULT_OPTIONS.minItemSize,\n maxItemSize = DEFAULT_OPTIONS.maxItemSize,\n minSpace = DEFAULT_OPTIONS.minSpace,\n maxColumns = DEFAULT_OPTIONS.maxColumns,\n dropIndicatorThickness = DEFAULT_OPTIONS.dropIndicatorThickness\n } = invalidationContext.layoutOptions || {};\n this.dropIndicatorThickness = dropIndicatorThickness;\n let visibleWidth = this.virtualizer!.visibleRect.width;\n\n // The max item width is always the entire viewport.\n // If the max item height is infinity, scale in proportion to the max width.\n let maxItemWidth = Math.min(maxItemSize.width, visibleWidth);\n let maxItemHeight = Number.isFinite(maxItemSize.height)\n ? maxItemSize.height\n : Math.floor((minItemSize.height / minItemSize.width) * maxItemWidth);\n\n // Compute the number of rows and columns needed to display the content\n let columns = Math.floor(visibleWidth / (minItemSize.width + minSpace.width));\n let numColumns = Math.max(1, Math.min(maxColumns, columns));\n\n // Compute the available width (minus the space between items)\n let width = visibleWidth - (minSpace.width * Math.max(0, numColumns));\n\n // Compute the item width based on the space available\n let itemWidth = Math.floor(width / numColumns);\n itemWidth = Math.max(minItemSize.width, Math.min(maxItemWidth, itemWidth));\n\n // Compute the item height, which is proportional to the item width\n let t = ((itemWidth - minItemSize.width) / Math.max(1, maxItemWidth - minItemSize.width));\n let itemHeight = minItemSize.height + Math.floor((maxItemHeight - minItemSize.height) * t);\n itemHeight = Math.max(minItemSize.height, Math.min(maxItemHeight, itemHeight));\n\n // Compute the horizontal spacing and content height\n let horizontalSpacing = Math.floor((visibleWidth - numColumns * itemWidth) / (numColumns + 1));\n\n // Setup an array of column heights\n let columnHeights = Array(numColumns).fill(minSpace.height);\n let newLayoutInfos = new Map();\n let addNode = (key: Key, node: Node<T>) => {\n let oldLayoutInfo = this.layoutInfos.get(key);\n let height = itemHeight;\n let estimatedSize = true;\n if (oldLayoutInfo) {\n height = oldLayoutInfo.rect.height;\n estimatedSize = invalidationContext.sizeChanged || oldLayoutInfo.estimatedSize || oldLayoutInfo.content !== node;\n }\n\n // Figure out which column to place the item in, and compute its position.\n // Preserve the previous column index so items don't jump around during resizing unless the number of columns changed.\n let prevColumn = numColumns === this.numColumns && oldLayoutInfo && oldLayoutInfo.rect.y < this.virtualizer!.visibleRect.maxY ? oldLayoutInfo.column : undefined;\n let column = prevColumn ?? columnHeights.reduce((minIndex, h, i) => h < columnHeights[minIndex] ? i : minIndex, 0);\n let x = horizontalSpacing + column * (itemWidth + horizontalSpacing);\n let y = columnHeights[column];\n\n let rect = new Rect(x, y, itemWidth, height);\n let layoutInfo = new WaterfallLayoutInfo(node.type, key, rect);\n layoutInfo.estimatedSize = estimatedSize;\n layoutInfo.allowOverflow = true;\n layoutInfo.content = node;\n layoutInfo.column = column;\n newLayoutInfos.set(key, layoutInfo);\n\n columnHeights[column] += layoutInfo.rect.height + minSpace.height;\n };\n\n let collection = this.virtualizer!.collection;\n let skeletonCount = 0;\n for (let node of collection) {\n if (node.type === 'skeleton') {\n // Add skeleton cards until every column has at least one, and we fill the viewport.\n let startingHeights = [...columnHeights];\n while (\n !columnHeights.every((h, i) => h !== startingHeights[i]) ||\n Math.min(...columnHeights) < this.virtualizer!.visibleRect.height\n ) {\n let key = `${node.key}-${skeletonCount++}`;\n let content = this.layoutInfos.get(key)?.content || {...node};\n addNode(key, content);\n }\n break;\n } else if (node.type !== 'loader') {\n addNode(node.key, node);\n }\n }\n\n // Always add the loader sentinel if present in the collection so we can make sure it is never virtualized out.\n // Add it under the first column for simplicity\n let lastNode = collection.getItem(collection.getLastKey()!);\n if (lastNode?.type === 'loader') {\n let rect = new Rect(horizontalSpacing, columnHeights[0], itemWidth, 0);\n let layoutInfo = new LayoutInfo('loader', lastNode.key, rect);\n newLayoutInfos.set(lastNode.key, layoutInfo);\n }\n\n // Reset all columns to the maximum for the next section. If loading, set to 0 so virtualizer doesn't render its body since there aren't items to render\n let isEmptyOrLoading = collection?.size === 0 || (collection.size === 1 && collection.getItem(collection.getFirstKey()!)!.type === 'loader');\n let maxHeight = isEmptyOrLoading ? 0 : Math.max(...columnHeights);\n this.contentSize = new Size(this.virtualizer!.visibleRect.width, maxHeight);\n this.layoutInfos = newLayoutInfos;\n this.numColumns = numColumns;\n }\n\n getLayoutInfo(key: Key): LayoutInfo {\n return this.layoutInfos.get(key)!;\n }\n\n getContentSize(): Size {\n return this.contentSize;\n }\n\n getVisibleLayoutInfos(rect: Rect): LayoutInfo[] {\n let layoutInfos: LayoutInfo[] = [];\n for (let layoutInfo of this.layoutInfos.values()) {\n if (layoutInfo.rect.intersects(rect) || this.virtualizer!.isPersistedKey(layoutInfo.key) || layoutInfo.type === 'loader') {\n layoutInfos.push(layoutInfo);\n }\n }\n return layoutInfos;\n }\n\n updateItemSize(key: Key, size: Size): boolean {\n let layoutInfo = this.layoutInfos.get(key);\n if (!size || !layoutInfo) {\n return false;\n }\n\n if (size.height !== layoutInfo.rect.height) {\n let newLayoutInfo = layoutInfo.copy();\n newLayoutInfo.rect.height = size.height;\n newLayoutInfo.estimatedSize = false;\n this.layoutInfos.set(key, newLayoutInfo);\n return true;\n }\n\n return false;\n }\n\n // Override keyboard navigation to work spatially.\n getKeyRightOf(key: Key): Key | null {\n let layoutInfo = this.getLayoutInfo(key);\n if (!layoutInfo) {\n return null;\n }\n\n let rect = new Rect(layoutInfo.rect.maxX, layoutInfo.rect.y, this.virtualizer!.visibleRect.maxX - layoutInfo.rect.maxX, layoutInfo.rect.height);\n let layoutInfos = this.getVisibleLayoutInfos(rect);\n let bestKey: Key | null = null;\n let bestDistance = Infinity;\n for (let candidate of layoutInfos) {\n if (candidate.key === key) {\n continue;\n }\n\n // Find the closest item in the x direction with the most overlap in the y direction.\n let deltaX = candidate.rect.x - rect.x;\n let overlapY = Math.min(candidate.rect.maxY, rect.maxY) - Math.max(candidate.rect.y, rect.y);\n let distance = deltaX - overlapY;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestKey = candidate.key;\n }\n }\n\n return bestKey;\n }\n\n getKeyLeftOf(key: Key): Key | null {\n let layoutInfo = this.getLayoutInfo(key);\n if (!layoutInfo) {\n return null;\n }\n\n let rect = new Rect(0, layoutInfo.rect.y, layoutInfo.rect.x, layoutInfo.rect.height);\n let layoutInfos = this.getVisibleLayoutInfos(rect);\n let bestKey: Key | null = null;\n let bestDistance = Infinity;\n for (let candidate of layoutInfos) {\n if (candidate.key === key) {\n continue;\n }\n\n // Find the closest item in the x direction with the most overlap in the y direction.\n let deltaX = rect.maxX - candidate.rect.maxX;\n let overlapY = Math.min(candidate.rect.maxY, rect.maxY) - Math.max(candidate.rect.y, rect.y);\n let distance = deltaX - overlapY;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestKey = candidate.key;\n }\n }\n\n return bestKey;\n }\n\n // This overrides the default behavior of shift selection to work spatially\n // rather than following the order of the items in the collection (which may appear unpredictable).\n getKeyRange(from: Key, to: Key): Key[] {\n let fromLayoutInfo = this.getLayoutInfo(from);\n let toLayoutInfo = this.getLayoutInfo(to);\n if (!fromLayoutInfo || !toLayoutInfo) {\n return [];\n }\n\n // Find items where half of the area intersects the rectangle\n // formed from the first item to the last item in the range.\n let rect = fromLayoutInfo.rect.union(toLayoutInfo.rect);\n let keys: Key[] = [];\n for (let layoutInfo of this.layoutInfos.values()) {\n if (rect.intersection(layoutInfo.rect).area > layoutInfo.rect.area / 2) {\n keys.push(layoutInfo.key);\n }\n }\n return keys;\n }\n\n getDropTargetFromPoint(x: number, y: number): DropTarget {\n if (this.layoutInfos.size === 0) {\n return {type: 'root'};\n }\n\n x += this.virtualizer!.visibleRect.x;\n y += this.virtualizer!.visibleRect.y;\n let key = this.virtualizer!.keyAtPoint(new Point(x, y));\n if (key == null) {\n return {type: 'root'};\n }\n\n // Only support \"on\" drop position in waterfall layout.\n // Reordering doesn't make sense because the items don't have a deterministic order.\n return {\n type: 'item',\n key,\n dropPosition: 'on'\n };\n }\n}\n"],"names":[],"version":3,"file":"WaterfallLayout.main.js.map"}
|
package/dist/WaterfallLayout.mjs
CHANGED
|
@@ -80,24 +80,36 @@ class $f483179558aa907f$export$e9f7cda058ba8df8 extends (0, $lFzwI$Layout) {
|
|
|
80
80
|
newLayoutInfos.set(key, layoutInfo);
|
|
81
81
|
columnHeights[column] += layoutInfo.rect.height + minSpace.height;
|
|
82
82
|
};
|
|
83
|
+
let collection = this.virtualizer.collection;
|
|
83
84
|
let skeletonCount = 0;
|
|
84
|
-
for (let node of
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
85
|
+
for (let node of collection){
|
|
86
|
+
if (node.type === 'skeleton') {
|
|
87
|
+
// Add skeleton cards until every column has at least one, and we fill the viewport.
|
|
88
|
+
let startingHeights = [
|
|
89
|
+
...columnHeights
|
|
90
|
+
];
|
|
91
|
+
while(!columnHeights.every((h, i)=>h !== startingHeights[i]) || Math.min(...columnHeights) < this.virtualizer.visibleRect.height){
|
|
92
|
+
var _this_layoutInfos_get;
|
|
93
|
+
let key = `${node.key}-${skeletonCount++}`;
|
|
94
|
+
let content = ((_this_layoutInfos_get = this.layoutInfos.get(key)) === null || _this_layoutInfos_get === void 0 ? void 0 : _this_layoutInfos_get.content) || {
|
|
95
|
+
...node
|
|
96
|
+
};
|
|
97
|
+
addNode(key, content);
|
|
98
|
+
}
|
|
99
|
+
break;
|
|
100
|
+
} else if (node.type !== 'loader') addNode(node.key, node);
|
|
101
|
+
}
|
|
102
|
+
// Always add the loader sentinel if present in the collection so we can make sure it is never virtualized out.
|
|
103
|
+
// Add it under the first column for simplicity
|
|
104
|
+
let lastNode = collection.getItem(collection.getLastKey());
|
|
105
|
+
if ((lastNode === null || lastNode === void 0 ? void 0 : lastNode.type) === 'loader') {
|
|
106
|
+
let rect = new (0, $lFzwI$Rect)(horizontalSpacing, columnHeights[0], itemWidth, 0);
|
|
107
|
+
let layoutInfo = new (0, $lFzwI$LayoutInfo)('loader', lastNode.key, rect);
|
|
108
|
+
newLayoutInfos.set(lastNode.key, layoutInfo);
|
|
109
|
+
}
|
|
110
|
+
// Reset all columns to the maximum for the next section. If loading, set to 0 so virtualizer doesn't render its body since there aren't items to render
|
|
111
|
+
let isEmptyOrLoading = (collection === null || collection === void 0 ? void 0 : collection.size) === 0 || collection.size === 1 && collection.getItem(collection.getFirstKey()).type === 'loader';
|
|
112
|
+
let maxHeight = isEmptyOrLoading ? 0 : Math.max(...columnHeights);
|
|
101
113
|
this.contentSize = new (0, $lFzwI$Size)(this.virtualizer.visibleRect.width, maxHeight);
|
|
102
114
|
this.layoutInfos = newLayoutInfos;
|
|
103
115
|
this.numColumns = numColumns;
|
|
@@ -110,7 +122,7 @@ class $f483179558aa907f$export$e9f7cda058ba8df8 extends (0, $lFzwI$Layout) {
|
|
|
110
122
|
}
|
|
111
123
|
getVisibleLayoutInfos(rect) {
|
|
112
124
|
let layoutInfos = [];
|
|
113
|
-
for (let layoutInfo of this.layoutInfos.values())if (layoutInfo.rect.intersects(rect) || this.virtualizer.isPersistedKey(layoutInfo.key)) layoutInfos.push(layoutInfo);
|
|
125
|
+
for (let layoutInfo of this.layoutInfos.values())if (layoutInfo.rect.intersects(rect) || this.virtualizer.isPersistedKey(layoutInfo.key) || layoutInfo.type === 'loader') layoutInfos.push(layoutInfo);
|
|
114
126
|
return layoutInfos;
|
|
115
127
|
}
|
|
116
128
|
updateItemSize(key, size) {
|
|
@@ -80,24 +80,36 @@ class $f483179558aa907f$export$e9f7cda058ba8df8 extends (0, $lFzwI$Layout) {
|
|
|
80
80
|
newLayoutInfos.set(key, layoutInfo);
|
|
81
81
|
columnHeights[column] += layoutInfo.rect.height + minSpace.height;
|
|
82
82
|
};
|
|
83
|
+
let collection = this.virtualizer.collection;
|
|
83
84
|
let skeletonCount = 0;
|
|
84
|
-
for (let node of
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
85
|
+
for (let node of collection){
|
|
86
|
+
if (node.type === 'skeleton') {
|
|
87
|
+
// Add skeleton cards until every column has at least one, and we fill the viewport.
|
|
88
|
+
let startingHeights = [
|
|
89
|
+
...columnHeights
|
|
90
|
+
];
|
|
91
|
+
while(!columnHeights.every((h, i)=>h !== startingHeights[i]) || Math.min(...columnHeights) < this.virtualizer.visibleRect.height){
|
|
92
|
+
var _this_layoutInfos_get;
|
|
93
|
+
let key = `${node.key}-${skeletonCount++}`;
|
|
94
|
+
let content = ((_this_layoutInfos_get = this.layoutInfos.get(key)) === null || _this_layoutInfos_get === void 0 ? void 0 : _this_layoutInfos_get.content) || {
|
|
95
|
+
...node
|
|
96
|
+
};
|
|
97
|
+
addNode(key, content);
|
|
98
|
+
}
|
|
99
|
+
break;
|
|
100
|
+
} else if (node.type !== 'loader') addNode(node.key, node);
|
|
101
|
+
}
|
|
102
|
+
// Always add the loader sentinel if present in the collection so we can make sure it is never virtualized out.
|
|
103
|
+
// Add it under the first column for simplicity
|
|
104
|
+
let lastNode = collection.getItem(collection.getLastKey());
|
|
105
|
+
if ((lastNode === null || lastNode === void 0 ? void 0 : lastNode.type) === 'loader') {
|
|
106
|
+
let rect = new (0, $lFzwI$Rect)(horizontalSpacing, columnHeights[0], itemWidth, 0);
|
|
107
|
+
let layoutInfo = new (0, $lFzwI$LayoutInfo)('loader', lastNode.key, rect);
|
|
108
|
+
newLayoutInfos.set(lastNode.key, layoutInfo);
|
|
109
|
+
}
|
|
110
|
+
// Reset all columns to the maximum for the next section. If loading, set to 0 so virtualizer doesn't render its body since there aren't items to render
|
|
111
|
+
let isEmptyOrLoading = (collection === null || collection === void 0 ? void 0 : collection.size) === 0 || collection.size === 1 && collection.getItem(collection.getFirstKey()).type === 'loader';
|
|
112
|
+
let maxHeight = isEmptyOrLoading ? 0 : Math.max(...columnHeights);
|
|
101
113
|
this.contentSize = new (0, $lFzwI$Size)(this.virtualizer.visibleRect.width, maxHeight);
|
|
102
114
|
this.layoutInfos = newLayoutInfos;
|
|
103
115
|
this.numColumns = numColumns;
|
|
@@ -110,7 +122,7 @@ class $f483179558aa907f$export$e9f7cda058ba8df8 extends (0, $lFzwI$Layout) {
|
|
|
110
122
|
}
|
|
111
123
|
getVisibleLayoutInfos(rect) {
|
|
112
124
|
let layoutInfos = [];
|
|
113
|
-
for (let layoutInfo of this.layoutInfos.values())if (layoutInfo.rect.intersects(rect) || this.virtualizer.isPersistedKey(layoutInfo.key)) layoutInfos.push(layoutInfo);
|
|
125
|
+
for (let layoutInfo of this.layoutInfos.values())if (layoutInfo.rect.intersects(rect) || this.virtualizer.isPersistedKey(layoutInfo.key) || layoutInfo.type === 'loader') layoutInfos.push(layoutInfo);
|
|
114
126
|
return layoutInfos;
|
|
115
127
|
}
|
|
116
128
|
updateItemSize(key, size) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-stately/layout/src/WaterfallLayout.ts"],"sourcesContent":["/*\n * Copyright 2024 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 {DropTarget, DropTargetDelegate, Key, LayoutDelegate, Node} from '@react-types/shared';\nimport {InvalidationContext, Layout, LayoutInfo, Point, Rect, Size} from '@react-stately/virtualizer';\n\nexport interface WaterfallLayoutOptions {\n /**\n * The minimum item size.\n * @default 200 x 200\n */\n minItemSize?: Size,\n /**\n * The maximum item size.\n * @default Infinity\n */\n maxItemSize?: Size,\n /**\n * The minimum space required between items.\n * @default 18 x 18\n */\n minSpace?: Size,\n /**\n * The maximum number of columns.\n * @default Infinity\n */\n maxColumns?: number,\n /**\n * The thickness of the drop indicator.\n * @default 2\n */\n dropIndicatorThickness?: number\n}\n\nclass WaterfallLayoutInfo extends LayoutInfo {\n column = 0;\n\n copy(): WaterfallLayoutInfo {\n let res = super.copy() as WaterfallLayoutInfo;\n res.column = this.column;\n return res;\n }\n}\n\nconst DEFAULT_OPTIONS = {\n minItemSize: new Size(200, 200),\n maxItemSize: new Size(Infinity, Infinity),\n minSpace: new Size(18, 18),\n maxColumns: Infinity,\n dropIndicatorThickness: 2\n};\n\nexport class WaterfallLayout<T extends object, O extends WaterfallLayoutOptions = WaterfallLayoutOptions> extends Layout<Node<T>, O> implements LayoutDelegate, DropTargetDelegate {\n private contentSize: Size = new Size();\n private layoutInfos: Map<Key, WaterfallLayoutInfo> = new Map();\n protected numColumns = 0;\n protected dropIndicatorThickness = 2;\n\n shouldInvalidateLayoutOptions(newOptions: O, oldOptions: O): boolean {\n return newOptions.maxColumns !== oldOptions.maxColumns\n || newOptions.dropIndicatorThickness !== oldOptions.dropIndicatorThickness\n || (!(newOptions.minItemSize || DEFAULT_OPTIONS.minItemSize).equals(oldOptions.minItemSize || DEFAULT_OPTIONS.minItemSize))\n || (!(newOptions.maxItemSize || DEFAULT_OPTIONS.maxItemSize).equals(oldOptions.maxItemSize || DEFAULT_OPTIONS.maxItemSize))\n || (!(newOptions.minSpace || DEFAULT_OPTIONS.minSpace).equals(oldOptions.minSpace || DEFAULT_OPTIONS.minSpace));\n }\n\n update(invalidationContext: InvalidationContext<O>): void {\n let {\n minItemSize = DEFAULT_OPTIONS.minItemSize,\n maxItemSize = DEFAULT_OPTIONS.maxItemSize,\n minSpace = DEFAULT_OPTIONS.minSpace,\n maxColumns = DEFAULT_OPTIONS.maxColumns,\n dropIndicatorThickness = DEFAULT_OPTIONS.dropIndicatorThickness\n } = invalidationContext.layoutOptions || {};\n this.dropIndicatorThickness = dropIndicatorThickness;\n let visibleWidth = this.virtualizer!.visibleRect.width;\n\n // The max item width is always the entire viewport.\n // If the max item height is infinity, scale in proportion to the max width.\n let maxItemWidth = Math.min(maxItemSize.width, visibleWidth);\n let maxItemHeight = Number.isFinite(maxItemSize.height)\n ? maxItemSize.height\n : Math.floor((minItemSize.height / minItemSize.width) * maxItemWidth);\n\n // Compute the number of rows and columns needed to display the content\n let columns = Math.floor(visibleWidth / (minItemSize.width + minSpace.width));\n let numColumns = Math.max(1, Math.min(maxColumns, columns));\n\n // Compute the available width (minus the space between items)\n let width = visibleWidth - (minSpace.width * Math.max(0, numColumns));\n\n // Compute the item width based on the space available\n let itemWidth = Math.floor(width / numColumns);\n itemWidth = Math.max(minItemSize.width, Math.min(maxItemWidth, itemWidth));\n\n // Compute the item height, which is proportional to the item width\n let t = ((itemWidth - minItemSize.width) / Math.max(1, maxItemWidth - minItemSize.width));\n let itemHeight = minItemSize.height + Math.floor((maxItemHeight - minItemSize.height) * t);\n itemHeight = Math.max(minItemSize.height, Math.min(maxItemHeight, itemHeight));\n\n // Compute the horizontal spacing and content height\n let horizontalSpacing = Math.floor((visibleWidth - numColumns * itemWidth) / (numColumns + 1));\n\n // Setup an array of column heights\n let columnHeights = Array(numColumns).fill(minSpace.height);\n let newLayoutInfos = new Map();\n let addNode = (key: Key, node: Node<T>) => {\n let oldLayoutInfo = this.layoutInfos.get(key);\n let height = itemHeight;\n let estimatedSize = true;\n if (oldLayoutInfo) {\n height = oldLayoutInfo.rect.height;\n estimatedSize = invalidationContext.sizeChanged || oldLayoutInfo.estimatedSize || oldLayoutInfo.content !== node;\n }\n\n // Figure out which column to place the item in, and compute its position.\n // Preserve the previous column index so items don't jump around during resizing unless the number of columns changed.\n let prevColumn = numColumns === this.numColumns && oldLayoutInfo && oldLayoutInfo.rect.y < this.virtualizer!.visibleRect.maxY ? oldLayoutInfo.column : undefined;\n let column = prevColumn ?? columnHeights.reduce((minIndex, h, i) => h < columnHeights[minIndex] ? i : minIndex, 0);\n let x = horizontalSpacing + column * (itemWidth + horizontalSpacing);\n let y = columnHeights[column];\n\n let rect = new Rect(x, y, itemWidth, height);\n let layoutInfo = new WaterfallLayoutInfo(node.type, key, rect);\n layoutInfo.estimatedSize = estimatedSize;\n layoutInfo.allowOverflow = true;\n layoutInfo.content = node;\n layoutInfo.column = column;\n newLayoutInfos.set(key, layoutInfo);\n\n columnHeights[column] += layoutInfo.rect.height + minSpace.height;\n };\n\n let skeletonCount = 0;\n for (let node of this.virtualizer!.collection) {\n if (node.type === 'skeleton') {\n // Add skeleton cards until every column has at least one, and we fill the viewport.\n let startingHeights = [...columnHeights];\n while (\n !columnHeights.every((h, i) => h !== startingHeights[i]) ||\n Math.min(...columnHeights) < this.virtualizer!.visibleRect.height\n ) {\n let key = `${node.key}-${skeletonCount++}`;\n let content = this.layoutInfos.get(key)?.content || {...node};\n addNode(key, content);\n }\n break;\n } else {\n addNode(node.key, node);\n }\n }\n\n // Reset all columns to the maximum for the next section\n let maxHeight = Math.max(...columnHeights);\n this.contentSize = new Size(this.virtualizer!.visibleRect.width, maxHeight);\n this.layoutInfos = newLayoutInfos;\n this.numColumns = numColumns;\n }\n\n getLayoutInfo(key: Key): LayoutInfo {\n return this.layoutInfos.get(key)!;\n }\n\n getContentSize(): Size {\n return this.contentSize;\n }\n\n getVisibleLayoutInfos(rect: Rect): LayoutInfo[] {\n let layoutInfos: LayoutInfo[] = [];\n for (let layoutInfo of this.layoutInfos.values()) {\n if (layoutInfo.rect.intersects(rect) || this.virtualizer!.isPersistedKey(layoutInfo.key)) {\n layoutInfos.push(layoutInfo);\n }\n }\n return layoutInfos;\n }\n\n updateItemSize(key: Key, size: Size): boolean {\n let layoutInfo = this.layoutInfos.get(key);\n if (!size || !layoutInfo) {\n return false;\n }\n\n if (size.height !== layoutInfo.rect.height) {\n let newLayoutInfo = layoutInfo.copy();\n newLayoutInfo.rect.height = size.height;\n newLayoutInfo.estimatedSize = false;\n this.layoutInfos.set(key, newLayoutInfo);\n return true;\n }\n\n return false;\n }\n\n // Override keyboard navigation to work spatially.\n getKeyRightOf(key: Key): Key | null {\n let layoutInfo = this.getLayoutInfo(key);\n if (!layoutInfo) {\n return null;\n }\n\n let rect = new Rect(layoutInfo.rect.maxX, layoutInfo.rect.y, this.virtualizer!.visibleRect.maxX - layoutInfo.rect.maxX, layoutInfo.rect.height);\n let layoutInfos = this.getVisibleLayoutInfos(rect);\n let bestKey: Key | null = null;\n let bestDistance = Infinity;\n for (let candidate of layoutInfos) {\n if (candidate.key === key) {\n continue;\n }\n\n // Find the closest item in the x direction with the most overlap in the y direction.\n let deltaX = candidate.rect.x - rect.x;\n let overlapY = Math.min(candidate.rect.maxY, rect.maxY) - Math.max(candidate.rect.y, rect.y);\n let distance = deltaX - overlapY;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestKey = candidate.key;\n }\n }\n\n return bestKey;\n }\n\n getKeyLeftOf(key: Key): Key | null {\n let layoutInfo = this.getLayoutInfo(key);\n if (!layoutInfo) {\n return null;\n }\n\n let rect = new Rect(0, layoutInfo.rect.y, layoutInfo.rect.x, layoutInfo.rect.height);\n let layoutInfos = this.getVisibleLayoutInfos(rect);\n let bestKey: Key | null = null;\n let bestDistance = Infinity;\n for (let candidate of layoutInfos) {\n if (candidate.key === key) {\n continue;\n }\n\n // Find the closest item in the x direction with the most overlap in the y direction.\n let deltaX = rect.maxX - candidate.rect.maxX;\n let overlapY = Math.min(candidate.rect.maxY, rect.maxY) - Math.max(candidate.rect.y, rect.y);\n let distance = deltaX - overlapY;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestKey = candidate.key;\n }\n }\n\n return bestKey;\n }\n\n // This overrides the default behavior of shift selection to work spatially\n // rather than following the order of the items in the collection (which may appear unpredictable).\n getKeyRange(from: Key, to: Key): Key[] {\n let fromLayoutInfo = this.getLayoutInfo(from);\n let toLayoutInfo = this.getLayoutInfo(to);\n if (!fromLayoutInfo || !toLayoutInfo) {\n return [];\n }\n\n // Find items where half of the area intersects the rectangle\n // formed from the first item to the last item in the range.\n let rect = fromLayoutInfo.rect.union(toLayoutInfo.rect);\n let keys: Key[] = [];\n for (let layoutInfo of this.layoutInfos.values()) {\n if (rect.intersection(layoutInfo.rect).area > layoutInfo.rect.area / 2) {\n keys.push(layoutInfo.key);\n }\n }\n return keys;\n }\n\n getDropTargetFromPoint(x: number, y: number): DropTarget {\n if (this.layoutInfos.size === 0) {\n return {type: 'root'};\n }\n\n x += this.virtualizer!.visibleRect.x;\n y += this.virtualizer!.visibleRect.y;\n let key = this.virtualizer!.keyAtPoint(new Point(x, y));\n if (key == null) {\n return {type: 'root'};\n }\n\n // Only support \"on\" drop position in waterfall layout.\n // Reordering doesn't make sense because the items don't have a deterministic order.\n return {\n type: 'item',\n key,\n dropPosition: 'on'\n };\n }\n}\n"],"names":[],"version":3,"file":"WaterfallLayout.module.js.map"}
|
|
1
|
+
{"mappings":";;AAAA;;;;;;;;;;CAUC;AAiCD,MAAM,kDAA4B,CAAA,GAAA,iBAAS;IAGzC,OAA4B;QAC1B,IAAI,MAAM,KAAK,CAAC;QAChB,IAAI,MAAM,GAAG,IAAI,CAAC,MAAM;QACxB,OAAO;IACT;;QAPF,qBACE,SAAS;;AAOX;AAEA,MAAM,wCAAkB;IACtB,aAAa,IAAI,CAAA,GAAA,WAAG,EAAE,KAAK;IAC3B,aAAa,IAAI,CAAA,GAAA,WAAG,EAAE,UAAU;IAChC,UAAU,IAAI,CAAA,GAAA,WAAG,EAAE,IAAI;IACvB,YAAY;IACZ,wBAAwB;AAC1B;AAEO,MAAM,kDAAqG,CAAA,GAAA,aAAK;IAMrH,8BAA8B,UAAa,EAAE,UAAa,EAAW;QACnE,OAAO,WAAW,UAAU,KAAK,WAAW,UAAU,IACjD,WAAW,sBAAsB,KAAK,WAAW,sBAAsB,IACtE,CAAC,AAAC,CAAA,WAAW,WAAW,IAAI,sCAAgB,WAAW,AAAD,EAAG,MAAM,CAAC,WAAW,WAAW,IAAI,sCAAgB,WAAW,KACrH,CAAC,AAAC,CAAA,WAAW,WAAW,IAAI,sCAAgB,WAAW,AAAD,EAAG,MAAM,CAAC,WAAW,WAAW,IAAI,sCAAgB,WAAW,KACrH,CAAC,AAAC,CAAA,WAAW,QAAQ,IAAI,sCAAgB,QAAQ,AAAD,EAAG,MAAM,CAAC,WAAW,QAAQ,IAAI,sCAAgB,QAAQ;IACjH;IAEA,OAAO,mBAA2C,EAAQ;QACxD,IAAI,eACF,cAAc,sCAAgB,WAAW,eACzC,cAAc,sCAAgB,WAAW,YACzC,WAAW,sCAAgB,QAAQ,cACnC,aAAa,sCAAgB,UAAU,0BACvC,yBAAyB,sCAAgB,sBAAsB,EAChE,GAAG,oBAAoB,aAAa,IAAI,CAAC;QAC1C,IAAI,CAAC,sBAAsB,GAAG;QAC9B,IAAI,eAAe,IAAI,CAAC,WAAW,CAAE,WAAW,CAAC,KAAK;QAEtD,oDAAoD;QACpD,4EAA4E;QAC5E,IAAI,eAAe,KAAK,GAAG,CAAC,YAAY,KAAK,EAAE;QAC/C,IAAI,gBAAgB,OAAO,QAAQ,CAAC,YAAY,MAAM,IAClD,YAAY,MAAM,GAClB,KAAK,KAAK,CAAC,AAAC,YAAY,MAAM,GAAG,YAAY,KAAK,GAAI;QAE1D,uEAAuE;QACvE,IAAI,UAAU,KAAK,KAAK,CAAC,eAAgB,CAAA,YAAY,KAAK,GAAG,SAAS,KAAK,AAAD;QAC1E,IAAI,aAAa,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,YAAY;QAElD,8DAA8D;QAC9D,IAAI,QAAQ,eAAgB,SAAS,KAAK,GAAG,KAAK,GAAG,CAAC,GAAG;QAEzD,sDAAsD;QACtD,IAAI,YAAY,KAAK,KAAK,CAAC,QAAQ;QACnC,YAAY,KAAK,GAAG,CAAC,YAAY,KAAK,EAAE,KAAK,GAAG,CAAC,cAAc;QAE/D,mEAAmE;QACnE,IAAI,IAAK,AAAC,CAAA,YAAY,YAAY,KAAK,AAAD,IAAK,KAAK,GAAG,CAAC,GAAG,eAAe,YAAY,KAAK;QACvF,IAAI,aAAa,YAAY,MAAM,GAAI,KAAK,KAAK,CAAC,AAAC,CAAA,gBAAgB,YAAY,MAAM,AAAD,IAAK;QACzF,aAAa,KAAK,GAAG,CAAC,YAAY,MAAM,EAAE,KAAK,GAAG,CAAC,eAAe;QAElE,oDAAoD;QACpD,IAAI,oBAAoB,KAAK,KAAK,CAAC,AAAC,CAAA,eAAe,aAAa,SAAQ,IAAM,CAAA,aAAa,CAAA;QAE3F,mCAAmC;QACnC,IAAI,gBAAgB,MAAM,YAAY,IAAI,CAAC,SAAS,MAAM;QAC1D,IAAI,iBAAiB,IAAI;QACzB,IAAI,UAAU,CAAC,KAAU;YACvB,IAAI,gBAAgB,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC;YACzC,IAAI,SAAS;YACb,IAAI,gBAAgB;YACpB,IAAI,eAAe;gBACjB,SAAS,cAAc,IAAI,CAAC,MAAM;gBAClC,gBAAgB,oBAAoB,WAAW,IAAI,cAAc,aAAa,IAAI,cAAc,OAAO,KAAK;YAC9G;YAEA,0EAA0E;YAC1E,sHAAsH;YACtH,IAAI,aAAa,eAAe,IAAI,CAAC,UAAU,IAAI,iBAAiB,cAAc,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,WAAW,CAAE,WAAW,CAAC,IAAI,GAAG,cAAc,MAAM,GAAG;YACvJ,IAAI,SAAS,uBAAA,wBAAA,aAAc,cAAc,MAAM,CAAC,CAAC,UAAU,GAAG,IAAM,IAAI,aAAa,CAAC,SAAS,GAAG,IAAI,UAAU;YAChH,IAAI,IAAI,oBAAoB,SAAU,CAAA,YAAY,iBAAgB;YAClE,IAAI,IAAI,aAAa,CAAC,OAAO;YAE7B,IAAI,OAAO,IAAI,CAAA,GAAA,WAAG,EAAE,GAAG,GAAG,WAAW;YACrC,IAAI,aAAa,IAAI,0CAAoB,KAAK,IAAI,EAAE,KAAK;YACzD,WAAW,aAAa,GAAG;YAC3B,WAAW,aAAa,GAAG;YAC3B,WAAW,OAAO,GAAG;YACrB,WAAW,MAAM,GAAG;YACpB,eAAe,GAAG,CAAC,KAAK;YAExB,aAAa,CAAC,OAAO,IAAI,WAAW,IAAI,CAAC,MAAM,GAAG,SAAS,MAAM;QACnE;QAEA,IAAI,aAAa,IAAI,CAAC,WAAW,CAAE,UAAU;QAC7C,IAAI,gBAAgB;QACpB,KAAK,IAAI,QAAQ,WAAY;YAC3B,IAAI,KAAK,IAAI,KAAK,YAAY;gBAC5B,oFAAoF;gBACpF,IAAI,kBAAkB;uBAAI;iBAAc;gBACxC,MACE,CAAC,cAAc,KAAK,CAAC,CAAC,GAAG,IAAM,MAAM,eAAe,CAAC,EAAE,KACvD,KAAK,GAAG,IAAI,iBAAiB,IAAI,CAAC,WAAW,CAAE,WAAW,CAAC,MAAM,CACjE;wBAEc;oBADd,IAAI,MAAM,GAAG,KAAK,GAAG,CAAC,CAAC,EAAE,iBAAiB;oBAC1C,IAAI,UAAU,EAAA,wBAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,kBAArB,4CAAA,sBAA2B,OAAO,KAAI;wBAAC,GAAG,IAAI;oBAAA;oBAC5D,QAAQ,KAAK;gBACf;gBACA;YACF,OAAO,IAAI,KAAK,IAAI,KAAK,UACvB,QAAQ,KAAK,GAAG,EAAE;QAEtB;QAEA,+GAA+G;QAC/G,+CAA+C;QAC/C,IAAI,WAAW,WAAW,OAAO,CAAC,WAAW,UAAU;QACvD,IAAI,CAAA,qBAAA,+BAAA,SAAU,IAAI,MAAK,UAAU;YAC/B,IAAI,OAAO,IAAI,CAAA,GAAA,WAAG,EAAE,mBAAmB,aAAa,CAAC,EAAE,EAAE,WAAW;YACpE,IAAI,aAAa,IAAI,CAAA,GAAA,iBAAS,EAAE,UAAU,SAAS,GAAG,EAAE;YACxD,eAAe,GAAG,CAAC,SAAS,GAAG,EAAE;QACnC;QAEA,wJAAwJ;QACxJ,IAAI,mBAAmB,CAAA,uBAAA,iCAAA,WAAY,IAAI,MAAK,KAAM,WAAW,IAAI,KAAK,KAAK,WAAW,OAAO,CAAC,WAAW,WAAW,IAAM,IAAI,KAAK;QACnI,IAAI,YAAY,mBAAmB,IAAI,KAAK,GAAG,IAAI;QACnD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAA,GAAA,WAAG,EAAE,IAAI,CAAC,WAAW,CAAE,WAAW,CAAC,KAAK,EAAE;QACjE,IAAI,CAAC,WAAW,GAAG;QACnB,IAAI,CAAC,UAAU,GAAG;IACpB;IAEA,cAAc,GAAQ,EAAc;QAClC,OAAO,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC;IAC9B;IAEA,iBAAuB;QACrB,OAAO,IAAI,CAAC,WAAW;IACzB;IAEA,sBAAsB,IAAU,EAAgB;QAC9C,IAAI,cAA4B,EAAE;QAClC,KAAK,IAAI,cAAc,IAAI,CAAC,WAAW,CAAC,MAAM,GAC5C,IAAI,WAAW,IAAI,CAAC,UAAU,CAAC,SAAS,IAAI,CAAC,WAAW,CAAE,cAAc,CAAC,WAAW,GAAG,KAAK,WAAW,IAAI,KAAK,UAC9G,YAAY,IAAI,CAAC;QAGrB,OAAO;IACT;IAEA,eAAe,GAAQ,EAAE,IAAU,EAAW;QAC5C,IAAI,aAAa,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC;QACtC,IAAI,CAAC,QAAQ,CAAC,YACZ,OAAO;QAGT,IAAI,KAAK,MAAM,KAAK,WAAW,IAAI,CAAC,MAAM,EAAE;YAC1C,IAAI,gBAAgB,WAAW,IAAI;YACnC,cAAc,IAAI,CAAC,MAAM,GAAG,KAAK,MAAM;YACvC,cAAc,aAAa,GAAG;YAC9B,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK;YAC1B,OAAO;QACT;QAEA,OAAO;IACT;IAEA,kDAAkD;IAClD,cAAc,GAAQ,EAAc;QAClC,IAAI,aAAa,IAAI,CAAC,aAAa,CAAC;QACpC,IAAI,CAAC,YACH,OAAO;QAGT,IAAI,OAAO,IAAI,CAAA,GAAA,WAAG,EAAE,WAAW,IAAI,CAAC,IAAI,EAAE,WAAW,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,WAAW,CAAE,WAAW,CAAC,IAAI,GAAG,WAAW,IAAI,CAAC,IAAI,EAAE,WAAW,IAAI,CAAC,MAAM;QAC9I,IAAI,cAAc,IAAI,CAAC,qBAAqB,CAAC;QAC7C,IAAI,UAAsB;QAC1B,IAAI,eAAe;QACnB,KAAK,IAAI,aAAa,YAAa;YACjC,IAAI,UAAU,GAAG,KAAK,KACpB;YAGF,qFAAqF;YACrF,IAAI,SAAS,UAAU,IAAI,CAAC,CAAC,GAAG,KAAK,CAAC;YACtC,IAAI,WAAW,KAAK,GAAG,CAAC,UAAU,IAAI,CAAC,IAAI,EAAE,KAAK,IAAI,IAAI,KAAK,GAAG,CAAC,UAAU,IAAI,CAAC,CAAC,EAAE,KAAK,CAAC;YAC3F,IAAI,WAAW,SAAS;YACxB,IAAI,WAAW,cAAc;gBAC3B,eAAe;gBACf,UAAU,UAAU,GAAG;YACzB;QACF;QAEA,OAAO;IACT;IAEA,aAAa,GAAQ,EAAc;QACjC,IAAI,aAAa,IAAI,CAAC,aAAa,CAAC;QACpC,IAAI,CAAC,YACH,OAAO;QAGT,IAAI,OAAO,IAAI,CAAA,GAAA,WAAG,EAAE,GAAG,WAAW,IAAI,CAAC,CAAC,EAAE,WAAW,IAAI,CAAC,CAAC,EAAE,WAAW,IAAI,CAAC,MAAM;QACnF,IAAI,cAAc,IAAI,CAAC,qBAAqB,CAAC;QAC7C,IAAI,UAAsB;QAC1B,IAAI,eAAe;QACnB,KAAK,IAAI,aAAa,YAAa;YACjC,IAAI,UAAU,GAAG,KAAK,KACpB;YAGF,qFAAqF;YACrF,IAAI,SAAS,KAAK,IAAI,GAAG,UAAU,IAAI,CAAC,IAAI;YAC5C,IAAI,WAAW,KAAK,GAAG,CAAC,UAAU,IAAI,CAAC,IAAI,EAAE,KAAK,IAAI,IAAI,KAAK,GAAG,CAAC,UAAU,IAAI,CAAC,CAAC,EAAE,KAAK,CAAC;YAC3F,IAAI,WAAW,SAAS;YACxB,IAAI,WAAW,cAAc;gBAC3B,eAAe;gBACf,UAAU,UAAU,GAAG;YACzB;QACF;QAEA,OAAO;IACT;IAEA,2EAA2E;IAC3E,mGAAmG;IACnG,YAAY,IAAS,EAAE,EAAO,EAAS;QACrC,IAAI,iBAAiB,IAAI,CAAC,aAAa,CAAC;QACxC,IAAI,eAAe,IAAI,CAAC,aAAa,CAAC;QACtC,IAAI,CAAC,kBAAkB,CAAC,cACtB,OAAO,EAAE;QAGX,6DAA6D;QAC7D,4DAA4D;QAC5D,IAAI,OAAO,eAAe,IAAI,CAAC,KAAK,CAAC,aAAa,IAAI;QACtD,IAAI,OAAc,EAAE;QACpB,KAAK,IAAI,cAAc,IAAI,CAAC,WAAW,CAAC,MAAM,GAC5C,IAAI,KAAK,YAAY,CAAC,WAAW,IAAI,EAAE,IAAI,GAAG,WAAW,IAAI,CAAC,IAAI,GAAG,GACnE,KAAK,IAAI,CAAC,WAAW,GAAG;QAG5B,OAAO;IACT;IAEA,uBAAuB,CAAS,EAAE,CAAS,EAAc;QACvD,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,KAAK,GAC5B,OAAO;YAAC,MAAM;QAAM;QAGtB,KAAK,IAAI,CAAC,WAAW,CAAE,WAAW,CAAC,CAAC;QACpC,KAAK,IAAI,CAAC,WAAW,CAAE,WAAW,CAAC,CAAC;QACpC,IAAI,MAAM,IAAI,CAAC,WAAW,CAAE,UAAU,CAAC,IAAI,CAAA,GAAA,YAAI,EAAE,GAAG;QACpD,IAAI,OAAO,MACT,OAAO;YAAC,MAAM;QAAM;QAGtB,uDAAuD;QACvD,oFAAoF;QACpF,OAAO;YACL,MAAM;iBACN;YACA,cAAc;QAChB;IACF;;QA1PK,qBACG,cAAoB,IAAI,CAAA,GAAA,WAAG,UAC3B,cAA6C,IAAI,YAC/C,aAAa,QACb,yBAAyB;;AAuPrC","sources":["packages/@react-stately/layout/src/WaterfallLayout.ts"],"sourcesContent":["/*\n * Copyright 2024 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 {DropTarget, DropTargetDelegate, Key, LayoutDelegate, Node} from '@react-types/shared';\nimport {InvalidationContext, Layout, LayoutInfo, Point, Rect, Size} from '@react-stately/virtualizer';\n\nexport interface WaterfallLayoutOptions {\n /**\n * The minimum item size.\n * @default 200 x 200\n */\n minItemSize?: Size,\n /**\n * The maximum item size.\n * @default Infinity\n */\n maxItemSize?: Size,\n /**\n * The minimum space required between items.\n * @default 18 x 18\n */\n minSpace?: Size,\n /**\n * The maximum number of columns.\n * @default Infinity\n */\n maxColumns?: number,\n /**\n * The thickness of the drop indicator.\n * @default 2\n */\n dropIndicatorThickness?: number\n}\n\nclass WaterfallLayoutInfo extends LayoutInfo {\n column = 0;\n\n copy(): WaterfallLayoutInfo {\n let res = super.copy() as WaterfallLayoutInfo;\n res.column = this.column;\n return res;\n }\n}\n\nconst DEFAULT_OPTIONS = {\n minItemSize: new Size(200, 200),\n maxItemSize: new Size(Infinity, Infinity),\n minSpace: new Size(18, 18),\n maxColumns: Infinity,\n dropIndicatorThickness: 2\n};\n\nexport class WaterfallLayout<T extends object, O extends WaterfallLayoutOptions = WaterfallLayoutOptions> extends Layout<Node<T>, O> implements LayoutDelegate, DropTargetDelegate {\n private contentSize: Size = new Size();\n private layoutInfos: Map<Key, WaterfallLayoutInfo> = new Map();\n protected numColumns = 0;\n protected dropIndicatorThickness = 2;\n\n shouldInvalidateLayoutOptions(newOptions: O, oldOptions: O): boolean {\n return newOptions.maxColumns !== oldOptions.maxColumns\n || newOptions.dropIndicatorThickness !== oldOptions.dropIndicatorThickness\n || (!(newOptions.minItemSize || DEFAULT_OPTIONS.minItemSize).equals(oldOptions.minItemSize || DEFAULT_OPTIONS.minItemSize))\n || (!(newOptions.maxItemSize || DEFAULT_OPTIONS.maxItemSize).equals(oldOptions.maxItemSize || DEFAULT_OPTIONS.maxItemSize))\n || (!(newOptions.minSpace || DEFAULT_OPTIONS.minSpace).equals(oldOptions.minSpace || DEFAULT_OPTIONS.minSpace));\n }\n\n update(invalidationContext: InvalidationContext<O>): void {\n let {\n minItemSize = DEFAULT_OPTIONS.minItemSize,\n maxItemSize = DEFAULT_OPTIONS.maxItemSize,\n minSpace = DEFAULT_OPTIONS.minSpace,\n maxColumns = DEFAULT_OPTIONS.maxColumns,\n dropIndicatorThickness = DEFAULT_OPTIONS.dropIndicatorThickness\n } = invalidationContext.layoutOptions || {};\n this.dropIndicatorThickness = dropIndicatorThickness;\n let visibleWidth = this.virtualizer!.visibleRect.width;\n\n // The max item width is always the entire viewport.\n // If the max item height is infinity, scale in proportion to the max width.\n let maxItemWidth = Math.min(maxItemSize.width, visibleWidth);\n let maxItemHeight = Number.isFinite(maxItemSize.height)\n ? maxItemSize.height\n : Math.floor((minItemSize.height / minItemSize.width) * maxItemWidth);\n\n // Compute the number of rows and columns needed to display the content\n let columns = Math.floor(visibleWidth / (minItemSize.width + minSpace.width));\n let numColumns = Math.max(1, Math.min(maxColumns, columns));\n\n // Compute the available width (minus the space between items)\n let width = visibleWidth - (minSpace.width * Math.max(0, numColumns));\n\n // Compute the item width based on the space available\n let itemWidth = Math.floor(width / numColumns);\n itemWidth = Math.max(minItemSize.width, Math.min(maxItemWidth, itemWidth));\n\n // Compute the item height, which is proportional to the item width\n let t = ((itemWidth - minItemSize.width) / Math.max(1, maxItemWidth - minItemSize.width));\n let itemHeight = minItemSize.height + Math.floor((maxItemHeight - minItemSize.height) * t);\n itemHeight = Math.max(minItemSize.height, Math.min(maxItemHeight, itemHeight));\n\n // Compute the horizontal spacing and content height\n let horizontalSpacing = Math.floor((visibleWidth - numColumns * itemWidth) / (numColumns + 1));\n\n // Setup an array of column heights\n let columnHeights = Array(numColumns).fill(minSpace.height);\n let newLayoutInfos = new Map();\n let addNode = (key: Key, node: Node<T>) => {\n let oldLayoutInfo = this.layoutInfos.get(key);\n let height = itemHeight;\n let estimatedSize = true;\n if (oldLayoutInfo) {\n height = oldLayoutInfo.rect.height;\n estimatedSize = invalidationContext.sizeChanged || oldLayoutInfo.estimatedSize || oldLayoutInfo.content !== node;\n }\n\n // Figure out which column to place the item in, and compute its position.\n // Preserve the previous column index so items don't jump around during resizing unless the number of columns changed.\n let prevColumn = numColumns === this.numColumns && oldLayoutInfo && oldLayoutInfo.rect.y < this.virtualizer!.visibleRect.maxY ? oldLayoutInfo.column : undefined;\n let column = prevColumn ?? columnHeights.reduce((minIndex, h, i) => h < columnHeights[minIndex] ? i : minIndex, 0);\n let x = horizontalSpacing + column * (itemWidth + horizontalSpacing);\n let y = columnHeights[column];\n\n let rect = new Rect(x, y, itemWidth, height);\n let layoutInfo = new WaterfallLayoutInfo(node.type, key, rect);\n layoutInfo.estimatedSize = estimatedSize;\n layoutInfo.allowOverflow = true;\n layoutInfo.content = node;\n layoutInfo.column = column;\n newLayoutInfos.set(key, layoutInfo);\n\n columnHeights[column] += layoutInfo.rect.height + minSpace.height;\n };\n\n let collection = this.virtualizer!.collection;\n let skeletonCount = 0;\n for (let node of collection) {\n if (node.type === 'skeleton') {\n // Add skeleton cards until every column has at least one, and we fill the viewport.\n let startingHeights = [...columnHeights];\n while (\n !columnHeights.every((h, i) => h !== startingHeights[i]) ||\n Math.min(...columnHeights) < this.virtualizer!.visibleRect.height\n ) {\n let key = `${node.key}-${skeletonCount++}`;\n let content = this.layoutInfos.get(key)?.content || {...node};\n addNode(key, content);\n }\n break;\n } else if (node.type !== 'loader') {\n addNode(node.key, node);\n }\n }\n\n // Always add the loader sentinel if present in the collection so we can make sure it is never virtualized out.\n // Add it under the first column for simplicity\n let lastNode = collection.getItem(collection.getLastKey()!);\n if (lastNode?.type === 'loader') {\n let rect = new Rect(horizontalSpacing, columnHeights[0], itemWidth, 0);\n let layoutInfo = new LayoutInfo('loader', lastNode.key, rect);\n newLayoutInfos.set(lastNode.key, layoutInfo);\n }\n\n // Reset all columns to the maximum for the next section. If loading, set to 0 so virtualizer doesn't render its body since there aren't items to render\n let isEmptyOrLoading = collection?.size === 0 || (collection.size === 1 && collection.getItem(collection.getFirstKey()!)!.type === 'loader');\n let maxHeight = isEmptyOrLoading ? 0 : Math.max(...columnHeights);\n this.contentSize = new Size(this.virtualizer!.visibleRect.width, maxHeight);\n this.layoutInfos = newLayoutInfos;\n this.numColumns = numColumns;\n }\n\n getLayoutInfo(key: Key): LayoutInfo {\n return this.layoutInfos.get(key)!;\n }\n\n getContentSize(): Size {\n return this.contentSize;\n }\n\n getVisibleLayoutInfos(rect: Rect): LayoutInfo[] {\n let layoutInfos: LayoutInfo[] = [];\n for (let layoutInfo of this.layoutInfos.values()) {\n if (layoutInfo.rect.intersects(rect) || this.virtualizer!.isPersistedKey(layoutInfo.key) || layoutInfo.type === 'loader') {\n layoutInfos.push(layoutInfo);\n }\n }\n return layoutInfos;\n }\n\n updateItemSize(key: Key, size: Size): boolean {\n let layoutInfo = this.layoutInfos.get(key);\n if (!size || !layoutInfo) {\n return false;\n }\n\n if (size.height !== layoutInfo.rect.height) {\n let newLayoutInfo = layoutInfo.copy();\n newLayoutInfo.rect.height = size.height;\n newLayoutInfo.estimatedSize = false;\n this.layoutInfos.set(key, newLayoutInfo);\n return true;\n }\n\n return false;\n }\n\n // Override keyboard navigation to work spatially.\n getKeyRightOf(key: Key): Key | null {\n let layoutInfo = this.getLayoutInfo(key);\n if (!layoutInfo) {\n return null;\n }\n\n let rect = new Rect(layoutInfo.rect.maxX, layoutInfo.rect.y, this.virtualizer!.visibleRect.maxX - layoutInfo.rect.maxX, layoutInfo.rect.height);\n let layoutInfos = this.getVisibleLayoutInfos(rect);\n let bestKey: Key | null = null;\n let bestDistance = Infinity;\n for (let candidate of layoutInfos) {\n if (candidate.key === key) {\n continue;\n }\n\n // Find the closest item in the x direction with the most overlap in the y direction.\n let deltaX = candidate.rect.x - rect.x;\n let overlapY = Math.min(candidate.rect.maxY, rect.maxY) - Math.max(candidate.rect.y, rect.y);\n let distance = deltaX - overlapY;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestKey = candidate.key;\n }\n }\n\n return bestKey;\n }\n\n getKeyLeftOf(key: Key): Key | null {\n let layoutInfo = this.getLayoutInfo(key);\n if (!layoutInfo) {\n return null;\n }\n\n let rect = new Rect(0, layoutInfo.rect.y, layoutInfo.rect.x, layoutInfo.rect.height);\n let layoutInfos = this.getVisibleLayoutInfos(rect);\n let bestKey: Key | null = null;\n let bestDistance = Infinity;\n for (let candidate of layoutInfos) {\n if (candidate.key === key) {\n continue;\n }\n\n // Find the closest item in the x direction with the most overlap in the y direction.\n let deltaX = rect.maxX - candidate.rect.maxX;\n let overlapY = Math.min(candidate.rect.maxY, rect.maxY) - Math.max(candidate.rect.y, rect.y);\n let distance = deltaX - overlapY;\n if (distance < bestDistance) {\n bestDistance = distance;\n bestKey = candidate.key;\n }\n }\n\n return bestKey;\n }\n\n // This overrides the default behavior of shift selection to work spatially\n // rather than following the order of the items in the collection (which may appear unpredictable).\n getKeyRange(from: Key, to: Key): Key[] {\n let fromLayoutInfo = this.getLayoutInfo(from);\n let toLayoutInfo = this.getLayoutInfo(to);\n if (!fromLayoutInfo || !toLayoutInfo) {\n return [];\n }\n\n // Find items where half of the area intersects the rectangle\n // formed from the first item to the last item in the range.\n let rect = fromLayoutInfo.rect.union(toLayoutInfo.rect);\n let keys: Key[] = [];\n for (let layoutInfo of this.layoutInfos.values()) {\n if (rect.intersection(layoutInfo.rect).area > layoutInfo.rect.area / 2) {\n keys.push(layoutInfo.key);\n }\n }\n return keys;\n }\n\n getDropTargetFromPoint(x: number, y: number): DropTarget {\n if (this.layoutInfos.size === 0) {\n return {type: 'root'};\n }\n\n x += this.virtualizer!.visibleRect.x;\n y += this.virtualizer!.visibleRect.y;\n let key = this.virtualizer!.keyAtPoint(new Point(x, y));\n if (key == null) {\n return {type: 'root'};\n }\n\n // Only support \"on\" drop position in waterfall layout.\n // Reordering doesn't make sense because the items don't have a deterministic order.\n return {\n type: 'item',\n key,\n dropPosition: 'on'\n };\n }\n}\n"],"names":[],"version":3,"file":"WaterfallLayout.module.js.map"}
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;AAeA;IACE;;;OAGG;IACH,WAAW,CAAC,EAAE,IAAI,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,IAAI,CAAC;IACnB;;;;;OAKG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAC;IAChB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAA;CAChC;AAWD;;;;;GAKG;AACH,wBAAwB,CAAC,EAAE,CAAC,SAAS,iBAAiB,GAAG,iBAAiB,CAAE,SAAQ,OAAO,KAAK,CAAC,CAAC,EAAE,CAAC,CAAE,YAAW,kBAAkB;IAClI,SAAS,CAAC,GAAG,EAAE,IAAI,CAA4B;IAC/C,SAAS,CAAC,sBAAsB,SAAK;IACrC,SAAS,CAAC,UAAU,EAAE,MAAM,CAAK;IAIjC,6BAA6B,CAAC,UAAU,EAAE,CAAC,EAAE,UAAU,EAAE,CAAC,GAAG,OAAO;IASpE,MAAM,CAAC,mBAAmB,EAAE,oBAAoB,CAAC,CAAC,GAAG,IAAI;
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-stately/layout/src/packages/@react-stately/layout/src/GridLayout.ts","packages/@react-stately/layout/src/packages/@react-stately/layout/src/ListLayout.ts","packages/@react-stately/layout/src/packages/@react-stately/layout/src/TableLayout.ts","packages/@react-stately/layout/src/packages/@react-stately/layout/src/WaterfallLayout.ts","packages/@react-stately/layout/src/packages/@react-stately/layout/src/index.ts","packages/@react-stately/layout/src/index.ts"],"sourcesContent":[null,null,null,null,null,"/*\n * Copyright 2020 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 */\nexport type {GridLayoutOptions} from './GridLayout';\nexport type {ListLayoutOptions, LayoutNode} from './ListLayout';\nexport type {TableLayoutProps} from './TableLayout';\nexport type {WaterfallLayoutOptions} from './WaterfallLayout';\nexport {GridLayout} from './GridLayout';\nexport {ListLayout} from './ListLayout';\nexport {TableLayout} from './TableLayout';\nexport {WaterfallLayout} from './WaterfallLayout';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
package/package.json
CHANGED
|
@@ -1,12 +1,16 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-stately/layout",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.3.1",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
7
7
|
"module": "dist/module.js",
|
|
8
8
|
"exports": {
|
|
9
|
-
"
|
|
9
|
+
"source": "./src/index.ts",
|
|
10
|
+
"types": [
|
|
11
|
+
"./dist/types.d.ts",
|
|
12
|
+
"./src/index.ts"
|
|
13
|
+
],
|
|
10
14
|
"import": "./dist/import.mjs",
|
|
11
15
|
"require": "./dist/main.js"
|
|
12
16
|
},
|
|
@@ -22,12 +26,12 @@
|
|
|
22
26
|
"url": "https://github.com/adobe/react-spectrum"
|
|
23
27
|
},
|
|
24
28
|
"dependencies": {
|
|
25
|
-
"@react-stately/collections": "^3.12.
|
|
26
|
-
"@react-stately/table": "^3.14.
|
|
27
|
-
"@react-stately/virtualizer": "^4.
|
|
28
|
-
"@react-types/grid": "^3.3.
|
|
29
|
-
"@react-types/shared": "^3.
|
|
30
|
-
"@react-types/table": "^3.
|
|
29
|
+
"@react-stately/collections": "^3.12.5",
|
|
30
|
+
"@react-stately/table": "^3.14.3",
|
|
31
|
+
"@react-stately/virtualizer": "^4.4.1",
|
|
32
|
+
"@react-types/grid": "^3.3.3",
|
|
33
|
+
"@react-types/shared": "^3.30.0",
|
|
34
|
+
"@react-types/table": "^3.13.1",
|
|
31
35
|
"@swc/helpers": "^0.5.0"
|
|
32
36
|
},
|
|
33
37
|
"peerDependencies": {
|
|
@@ -37,5 +41,5 @@
|
|
|
37
41
|
"publishConfig": {
|
|
38
42
|
"access": "public"
|
|
39
43
|
},
|
|
40
|
-
"gitHead": "
|
|
44
|
+
"gitHead": "265b4d7f107905ee1c6e87a8af1613ab440a6849"
|
|
41
45
|
}
|
package/src/GridLayout.ts
CHANGED
|
@@ -120,8 +120,12 @@ export class GridLayout<T, O extends GridLayoutOptions = GridLayoutOptions> exte
|
|
|
120
120
|
let horizontalSpacing = Math.floor((visibleWidth - numColumns * itemWidth) / (numColumns + 1));
|
|
121
121
|
this.gap = new Size(horizontalSpacing, minSpace.height);
|
|
122
122
|
|
|
123
|
-
let
|
|
124
|
-
|
|
123
|
+
let collection = this.virtualizer!.collection;
|
|
124
|
+
// Make sure to set rows to 0 if we performing a first time load or are rendering the empty state so that Virtualizer
|
|
125
|
+
// won't try to render its body
|
|
126
|
+
let isEmptyOrLoading = collection?.size === 0 || (collection.size === 1 && collection.getItem(collection.getFirstKey()!)!.type === 'loader');
|
|
127
|
+
let rows = isEmptyOrLoading ? 0 : Math.ceil(collection.size / numColumns);
|
|
128
|
+
let iterator = collection[Symbol.iterator]();
|
|
125
129
|
let y = rows > 0 ? minSpace.height : 0;
|
|
126
130
|
let newLayoutInfos = new Map();
|
|
127
131
|
let skeleton: Node<T> | null = null;
|
|
@@ -136,6 +140,11 @@ export class GridLayout<T, O extends GridLayoutOptions = GridLayoutOptions> exte
|
|
|
136
140
|
break;
|
|
137
141
|
}
|
|
138
142
|
|
|
143
|
+
// We will add the loader after the skeletons so skip here
|
|
144
|
+
if (node.type === 'loader') {
|
|
145
|
+
continue;
|
|
146
|
+
}
|
|
147
|
+
|
|
139
148
|
if (node.type === 'skeleton') {
|
|
140
149
|
skeleton = node;
|
|
141
150
|
}
|
|
@@ -177,6 +186,14 @@ export class GridLayout<T, O extends GridLayoutOptions = GridLayoutOptions> exte
|
|
|
177
186
|
}
|
|
178
187
|
}
|
|
179
188
|
|
|
189
|
+
// Always add the loader sentinel if present in the collection so we can make sure it is never virtualized out.
|
|
190
|
+
let lastNode = collection.getItem(collection.getLastKey()!);
|
|
191
|
+
if (lastNode?.type === 'loader') {
|
|
192
|
+
let rect = new Rect(horizontalSpacing, y, itemWidth, 0);
|
|
193
|
+
let layoutInfo = new LayoutInfo('loader', lastNode.key, rect);
|
|
194
|
+
newLayoutInfos.set(lastNode.key, layoutInfo);
|
|
195
|
+
}
|
|
196
|
+
|
|
180
197
|
this.layoutInfos = newLayoutInfos;
|
|
181
198
|
this.contentSize = new Size(this.virtualizer!.visibleRect.width, y);
|
|
182
199
|
}
|
|
@@ -192,7 +209,7 @@ export class GridLayout<T, O extends GridLayoutOptions = GridLayoutOptions> exte
|
|
|
192
209
|
getVisibleLayoutInfos(rect: Rect): LayoutInfo[] {
|
|
193
210
|
let layoutInfos: LayoutInfo[] = [];
|
|
194
211
|
for (let layoutInfo of this.layoutInfos.values()) {
|
|
195
|
-
if (layoutInfo.rect.intersects(rect) || this.virtualizer!.isPersistedKey(layoutInfo.key)) {
|
|
212
|
+
if (layoutInfo.rect.intersects(rect) || this.virtualizer!.isPersistedKey(layoutInfo.key) || layoutInfo.type === 'loader') {
|
|
196
213
|
layoutInfos.push(layoutInfo);
|
|
197
214
|
}
|
|
198
215
|
}
|
|
@@ -227,7 +244,7 @@ export class GridLayout<T, O extends GridLayoutOptions = GridLayoutOptions> exte
|
|
|
227
244
|
// Find the closest item within on either side of the point using the gap width.
|
|
228
245
|
let key: Key | null = null;
|
|
229
246
|
if (this.numColumns === 1) {
|
|
230
|
-
let searchRect = new Rect(x, Math.max(0, y - this.gap.height), 1, this.gap.height * 2);
|
|
247
|
+
let searchRect = new Rect(x, Math.max(0, y - this.gap.height), 1, Math.max(1, this.gap.height * 2));
|
|
231
248
|
let candidates = this.getVisibleLayoutInfos(searchRect);
|
|
232
249
|
let minDistance = Infinity;
|
|
233
250
|
for (let candidate of candidates) {
|
package/src/ListLayout.ts
CHANGED
|
@@ -29,7 +29,7 @@ export interface ListLayoutOptions {
|
|
|
29
29
|
headingHeight?: number,
|
|
30
30
|
/** The estimated height of a section header, when the height is variable. */
|
|
31
31
|
estimatedHeadingHeight?: number,
|
|
32
|
-
/**
|
|
32
|
+
/**
|
|
33
33
|
* The fixed height of a loader element in px. This loader is specifically for
|
|
34
34
|
* "load more" elements rendered when loading more rows at the root level or inside nested row/sections.
|
|
35
35
|
* @default 48
|
|
@@ -184,7 +184,7 @@ export class ListLayout<T, O extends ListLayoutOptions = ListLayoutOptions> exte
|
|
|
184
184
|
}
|
|
185
185
|
|
|
186
186
|
protected isVisible(node: LayoutNode, rect: Rect): boolean {
|
|
187
|
-
return node.layoutInfo.rect.intersects(rect) || node.layoutInfo.isSticky || node.layoutInfo.type === 'header' || this.virtualizer!.isPersistedKey(node.layoutInfo.key);
|
|
187
|
+
return node.layoutInfo.rect.intersects(rect) || node.layoutInfo.isSticky || node.layoutInfo.type === 'header' || node.layoutInfo.type === 'loader' || this.virtualizer!.isPersistedKey(node.layoutInfo.key);
|
|
188
188
|
}
|
|
189
189
|
|
|
190
190
|
protected shouldInvalidateEverything(invalidationContext: InvalidationContext<O>): boolean {
|
|
@@ -255,9 +255,13 @@ export class ListLayout<T, O extends ListLayoutOptions = ListLayoutOptions> exte
|
|
|
255
255
|
let collection = this.virtualizer!.collection;
|
|
256
256
|
let skipped = 0;
|
|
257
257
|
let nodes: LayoutNode[] = [];
|
|
258
|
+
let isEmptyOrLoading = collection?.size === 0 || (collection.size === 1 && collection.getItem(collection.getFirstKey()!)!.type === 'loader');
|
|
259
|
+
if (isEmptyOrLoading) {
|
|
260
|
+
y = 0;
|
|
261
|
+
}
|
|
262
|
+
|
|
258
263
|
for (let node of collection) {
|
|
259
264
|
let rowHeight = (this.rowHeight ?? this.estimatedRowHeight ?? DEFAULT_HEIGHT) + this.gap;
|
|
260
|
-
|
|
261
265
|
// Skip rows before the valid rectangle unless they are already cached.
|
|
262
266
|
if (node.type === 'item' && y + rowHeight < this.requestedRect.y && !this.isValid(node, y)) {
|
|
263
267
|
y += rowHeight;
|
|
@@ -268,15 +272,28 @@ export class ListLayout<T, O extends ListLayoutOptions = ListLayoutOptions> exte
|
|
|
268
272
|
let layoutNode = this.buildChild(node, this.padding, y, null);
|
|
269
273
|
y = layoutNode.layoutInfo.rect.maxY + this.gap;
|
|
270
274
|
nodes.push(layoutNode);
|
|
271
|
-
|
|
272
275
|
if (node.type === 'item' && y > this.requestedRect.maxY) {
|
|
273
|
-
|
|
276
|
+
let itemsAfterRect = collection.size - (nodes.length + skipped);
|
|
277
|
+
let lastNode = collection.getItem(collection.getLastKey()!);
|
|
278
|
+
if (lastNode?.type === 'loader') {
|
|
279
|
+
itemsAfterRect--;
|
|
280
|
+
}
|
|
281
|
+
|
|
282
|
+
y += itemsAfterRect * rowHeight;
|
|
283
|
+
|
|
284
|
+
// Always add the loader sentinel if present. This assumes the loader is the last option/row
|
|
285
|
+
// will need to refactor when handling multi section loading
|
|
286
|
+
if (lastNode?.type === 'loader' && nodes.at(-1)?.layoutInfo.type !== 'loader') {
|
|
287
|
+
let loader = this.buildChild(lastNode, this.padding, y, null);
|
|
288
|
+
nodes.push(loader);
|
|
289
|
+
y = loader.layoutInfo.rect.maxY;
|
|
290
|
+
}
|
|
274
291
|
break;
|
|
275
292
|
}
|
|
276
293
|
}
|
|
277
294
|
|
|
278
295
|
y -= this.gap;
|
|
279
|
-
y += this.padding;
|
|
296
|
+
y += isEmptyOrLoading ? 0 : this.padding;
|
|
280
297
|
this.contentSize = new Size(this.virtualizer!.visibleRect.width, y);
|
|
281
298
|
return nodes;
|
|
282
299
|
}
|
|
@@ -301,6 +318,7 @@ export class ListLayout<T, O extends ListLayoutOptions = ListLayoutOptions> exte
|
|
|
301
318
|
let layoutNode = this.buildNode(node, x, y);
|
|
302
319
|
|
|
303
320
|
layoutNode.layoutInfo.parentKey = parentKey ?? null;
|
|
321
|
+
layoutNode.layoutInfo.allowOverflow = true;
|
|
304
322
|
this.layoutNodes.set(node.key, layoutNode);
|
|
305
323
|
return layoutNode;
|
|
306
324
|
}
|
|
@@ -315,6 +333,8 @@ export class ListLayout<T, O extends ListLayoutOptions = ListLayoutOptions> exte
|
|
|
315
333
|
return this.buildSectionHeader(node, x, y);
|
|
316
334
|
case 'loader':
|
|
317
335
|
return this.buildLoader(node, x, y);
|
|
336
|
+
case 'separator':
|
|
337
|
+
return this.buildItem(node, x, y);
|
|
318
338
|
default:
|
|
319
339
|
throw new Error('Unsupported node type: ' + node.type);
|
|
320
340
|
}
|
|
@@ -324,7 +344,9 @@ export class ListLayout<T, O extends ListLayoutOptions = ListLayoutOptions> exte
|
|
|
324
344
|
let rect = new Rect(x, y, this.padding, 0);
|
|
325
345
|
let layoutInfo = new LayoutInfo('loader', node.key, rect);
|
|
326
346
|
rect.width = this.virtualizer!.contentSize.width - this.padding - x;
|
|
327
|
-
|
|
347
|
+
// Note that if the user provides isLoading to their sentinel during a case where they only want to render the emptyState, this will reserve
|
|
348
|
+
// room for the loader alongside rendering the emptyState
|
|
349
|
+
rect.height = node.props.isLoading ? this.loaderHeight ?? this.rowHeight ?? this.estimatedRowHeight ?? DEFAULT_HEIGHT : 0;
|
|
328
350
|
|
|
329
351
|
return {
|
|
330
352
|
layoutInfo,
|
|
@@ -506,7 +528,7 @@ export class ListLayout<T, O extends ListLayoutOptions = ListLayoutOptions> exte
|
|
|
506
528
|
y += this.virtualizer!.visibleRect.y;
|
|
507
529
|
|
|
508
530
|
// Find the closest item within on either side of the point using the gap width.
|
|
509
|
-
let searchRect = new Rect(x, Math.max(0, y - this.gap), 1, this.gap * 2);
|
|
531
|
+
let searchRect = new Rect(x, Math.max(0, y - this.gap), 1, Math.max(1, this.gap * 2));
|
|
510
532
|
let candidates = this.getVisibleLayoutInfos(searchRect);
|
|
511
533
|
let key: Key | null = null;
|
|
512
534
|
let minDistance = Infinity;
|