@react-spectrum/card 3.0.0-alpha.30 → 3.0.0-alpha.32

package/dist/GalleryLayout.main.js

@@ -0,0 +1,229 @@
+var $5ee605f09afaa4de$exports = require("./BaseLayout.main.js");
+var $lJHSi$reactstatelyvirtualizer = require("@react-stately/virtualizer");
+
+
+function $parcel$export(e, n, v, s) {
+  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
+}
+
+$parcel$export(module.exports, "GalleryLayout", () => $8019a3d2c7d098ea$export$8e52095834484b61);
+/*
+ * Copyright 2021 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
+
+const $8019a3d2c7d098ea$var$DEFAULT_OPTIONS = {
+    S: {
+        idealRowHeight: 112,
+        minItemSize: new (0, $lJHSi$reactstatelyvirtualizer.Size)(96, 96),
+        itemSpacing: new (0, $lJHSi$reactstatelyvirtualizer.Size)(8, 16),
+        itemPadding: 24,
+        dropSpacing: 50,
+        margin: 8
+    },
+    L: {
+        idealRowHeight: 208,
+        minItemSize: new (0, $lJHSi$reactstatelyvirtualizer.Size)(136, 136),
+        itemSpacing: new (0, $lJHSi$reactstatelyvirtualizer.Size)(18, 18),
+        itemPadding: {
+            "medium": 78,
+            "large": 99
+        },
+        dropSpacing: 100,
+        margin: 24
+    }
+};
+class $8019a3d2c7d098ea$export$8e52095834484b61 extends (0, $5ee605f09afaa4de$exports.BaseLayout) {
+    get layoutType() {
+        return "gallery";
+    }
+    /**
+   * Takes a row of widths and if there are any widths smaller than the min-width, leech width starting from
+   * the widest in the row until it can't give anymore, then move to the second widest and so forth.
+   * Do this until all assets meet the min-width.
+   * */ _distributeWidths(widths) {
+        // create a copy of the widths array and sort it largest to smallest
+        let sortedWidths = widths.concat().sort((a, b)=>a[1] > b[1] ? -1 : 1);
+        for (let width of widths)// for each width, if it's smaller than the min width
+        if (width[1] < this.minItemSize.width) {
+            // then figure out how much smaller
+            let delta = this.minItemSize.width - width[1];
+            for (let item of sortedWidths)// go from the largest width in the row to the smallest
+            // if the width is greater than the min width
+            if (widths[item[0]][1] > this.minItemSize.width) {
+                // subtract the delta from the width, if it's still greater than the min width
+                // then we have finished, subtract the delta permanently from that width
+                // eslint-disable-next-line max-depth
+                if (widths[item[0]][1] - delta > this.minItemSize.width) {
+                    widths[item[0]][1] -= delta;
+                    delta = 0;
+                    break;
+                } else {
+                    // otherwise, we take as much as we can from the current width and then move on to
+                    // the next largest and take some width from it
+                    let maxChange = widths[item[0]][1] - this.minItemSize.width;
+                    delta -= maxChange;
+                    widths[item[0]][1] -= maxChange;
+                }
+            }
+            if (delta > 0) return false;
+            // force the width to be the min width that we just rebalanced for
+            width[1] = this.minItemSize.width;
+        }
+        return true;
+    }
+    buildCollection() {
+        let visibleWidth = this.virtualizer.visibleRect.width;
+        let visibleHeight = this.virtualizer.visibleRect.height;
+        let y = this.margin;
+        let availableWidth = visibleWidth - this.margin * 2;
+        // If avaliable width is not greater than 0, skip node layout calculations
+        if (availableWidth > 0) {
+            // Compute aspect ratios for all of the items, and the total width if all items were on in a single row.
+            let ratios = [];
+            let totalWidth = 0;
+            let minRatio = this.minItemSize.width / this.minItemSize.height;
+            let maxRatio = availableWidth / this.minItemSize.height;
+            for (let node of this.collection){
+                let ratio = node.props.width / node.props.height;
+                if (ratio < minRatio) ratio = minRatio;
+                else if (ratio > maxRatio && ratio !== minRatio) ratio = maxRatio;
+                let itemWidth = ratio * this.minItemSize.height;
+                ratios.push(ratio);
+                totalWidth += itemWidth;
+            }
+            totalWidth += this.itemSpacing.width * (this.collection.size - 1);
+            // Determine how many rows we'll need, and partition the items into rows
+            // using the aspect ratios as weights.
+            let rows = Math.max(1, Math.ceil(totalWidth / availableWidth));
+            // if the available width can't hold two items, then every item will get its own row
+            // this leads to a faster run through linear partition and more dependable output for small row widths
+            if (availableWidth <= this.minItemSize.width * 2 + this.itemPadding * 2) rows = this.collection.size;
+            let weightedRatios = ratios.map((ratio)=>ratio < this.threshold ? ratio + 0.5 * (1 / ratio) : ratio);
+            let partition = $8019a3d2c7d098ea$var$linearPartition(weightedRatios, rows);
+            let index = 0;
+            for (let row of partition){
+                // Compute the total weight for this row
+                let totalWeight = 0;
+                for(let j = index; j < index + row.length; j++)totalWeight += ratios[j];
+                // Determine the row height based on the total available width and weight of this row.
+                let bestRowHeight = (availableWidth - (row.length - 1) * this.itemSpacing.width) / totalWeight;
+                // if this is the last row and the row height is >2x the ideal row height, then cap to the ideal height
+                // probably doing this because if the last row has one extremely tall image, then the row becomes huge
+                // though that can happen anywhere if a row has lots of tall images... so i'm not sure why this one matters
+                if (row === partition[partition.length - 1] && bestRowHeight > this.idealRowHeight * 2) bestRowHeight = this.idealRowHeight;
+                let itemHeight = Math.round(bestRowHeight) + this.itemPadding;
+                let x = this.margin;
+                // if any items are going to end up too small, add a bit of width to them and subtract it from wider objects
+                let widths = [];
+                for(let j = index; j < index + row.length; j++){
+                    let width = Math.round(bestRowHeight * ratios[j]);
+                    widths.push([
+                        j - index,
+                        width
+                    ]);
+                }
+                this._distributeWidths(widths);
+                // Create items for this row.
+                for(let j = index; j < index + row.length; j++){
+                    let node = this.collection.rows[j];
+                    let itemWidth = Math.max(widths[j - index][1], this.minItemSize.width);
+                    let rect = new (0, $lJHSi$reactstatelyvirtualizer.Rect)(x, y, itemWidth, itemHeight);
+                    let layoutInfo = new (0, $lJHSi$reactstatelyvirtualizer.LayoutInfo)(node.type, node.key, rect);
+                    layoutInfo.allowOverflow = true;
+                    this.layoutInfos.set(node.key, layoutInfo);
+                    x += itemWidth + this.itemSpacing.width;
+                }
+                y += itemHeight + this.itemSpacing.height;
+                index += row.length;
+            }
+            if (this.isLoading) {
+                let loaderY = y;
+                let loaderHeight = 60;
+                // If there aren't any items, make loader take all avaliable room and remove margin from y calculation
+                // so it doesn't scroll
+                if (this.collection.size === 0) {
+                    loaderY = 0;
+                    loaderHeight = visibleHeight || 60;
+                }
+                let rect = new (0, $lJHSi$reactstatelyvirtualizer.Rect)(0, loaderY, visibleWidth, loaderHeight);
+                let loader = new (0, $lJHSi$reactstatelyvirtualizer.LayoutInfo)("loader", "loader", rect);
+                this.layoutInfos.set("loader", loader);
+                y = loader.rect.maxY;
+            }
+            if (this.collection.size === 0 && !this.isLoading) {
+                let rect = new (0, $lJHSi$reactstatelyvirtualizer.Rect)(0, 0, visibleWidth, visibleHeight);
+                let placeholder = new (0, $lJHSi$reactstatelyvirtualizer.LayoutInfo)("placeholder", "placeholder", rect);
+                this.layoutInfos.set("placeholder", placeholder);
+                y = placeholder.rect.maxY;
+            }
+        }
+        this.contentSize = new (0, $lJHSi$reactstatelyvirtualizer.Size)(visibleWidth, y);
+    }
+    constructor(options = {}){
+        super(options);
+        let cardSize = "L";
+        this.idealRowHeight = options.idealRowHeight || $8019a3d2c7d098ea$var$DEFAULT_OPTIONS[cardSize].idealRowHeight;
+        this.itemSpacing = options.itemSpacing || $8019a3d2c7d098ea$var$DEFAULT_OPTIONS[cardSize].itemSpacing;
+        this.itemPadding = options.itemPadding != null ? options.itemPadding : $8019a3d2c7d098ea$var$DEFAULT_OPTIONS[cardSize].itemPadding[this.scale];
+        this.minItemSize = options.minItemSize || $8019a3d2c7d098ea$var$DEFAULT_OPTIONS[cardSize].minItemSize;
+        this.threshold = options.threshold || 1;
+        this.margin = options.margin != null ? options.margin : $8019a3d2c7d098ea$var$DEFAULT_OPTIONS[cardSize].margin;
+    }
+}
+// https://www8.cs.umu.se/kurser/TDBA77/VT06/algorithms/BOOK/BOOK2/NODE45.HTM
+function $8019a3d2c7d098ea$var$linearPartition(seq, k) {
+    let n = seq.length;
+    if (k <= 0) return [];
+    if (k >= n) return seq.map((x)=>[
+            x
+        ]);
+    if (n === 1) return [
+        seq
+    ];
+    let table = Array(n).fill(0).map(()=>Array(k).fill(0));
+    let solution = Array(n - 1).fill(0).map(()=>Array(k - 1).fill(0));
+    for(let i = 0; i < n; i++)table[i][0] = seq[i] + (i > 0 ? table[i - 1][0] : 0);
+    for(let i = 0; i < k; i++)table[0][i] = seq[0];
+    for(let i = 1; i < n; i++)for(let j = 1; j < k; j++){
+        let currentMin = 0;
+        let minX = Infinity;
+        for(let x = 0; x < i; x++){
+            let c1 = table[x][j - 1];
+            let c2 = table[i][0] - table[x][0];
+            let cost = Math.max(c1, c2);
+            if (!x || cost < currentMin) {
+                currentMin = cost;
+                minX = x;
+            }
+        }
+        table[i][j] = currentMin;
+        solution[i - 1][j - 1] = minX;
+    }
+    n = n - 1;
+    k = k - 2;
+    let result = [];
+    while(k >= 0){
+        if (n >= 1) {
+            let row = [];
+            for(let i = solution[n - 1][k] + 1; i < n + 1; i++)row.push(seq[i]);
+            result.unshift(row);
+            n = solution[n - 1][k];
+        }
+        k--;
+    }
+    let row = [];
+    for(let i = 0; i < n + 1; i++)row.push(seq[i]);
+    result.unshift(row);
+    return result;
+}
+
+
+//# sourceMappingURL=GalleryLayout.main.js.map

package/dist/GalleryLayout.main.js.map

@@ -0,0 +1 @@
+{"mappings":"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","sources":["packages/@react-spectrum/card/src/GalleryLayout.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 {BaseLayout, BaseLayoutOptions} from './BaseLayout';\nimport {LayoutInfo, Rect, Size} from '@react-stately/virtualizer';\n\nexport interface GalleryLayoutOptions extends BaseLayoutOptions {\n  // /**\n  //  * The card size in the grid.\n  //  */\n  // cardSize?: 'S' | 'M' | 'L',\n  /**\n   * The the default row height. Note this must be larger than the min item height.\n   * @default 208\n   */\n  idealRowHeight?: number,\n  /**\n   * The spacing between items.\n   * @default 18 x 18\n   */\n  itemSpacing?: Size,\n  /**\n   * The vertical padding for an item.\n   * @default 78\n   */\n  itemPadding?: number,\n  /**\n   * Minimum size for a item in the grid.\n   * @default 136 x 136\n   */\n  minItemSize?: Size,\n  /**\n   * Target for adding extra weight to elements during linear partitioning. Anything with an aspect ratio smaler than this value\n   * will be targeted.\n   * @type {number}\n   */\n  threshold?: number\n}\n\nconst DEFAULT_OPTIONS = {\n  S: {\n    idealRowHeight: 112,\n    minItemSize: new Size(96, 96),\n    itemSpacing: new Size(8, 16),\n    itemPadding: 24,\n    dropSpacing: 50,\n    margin: 8\n  },\n  L: {\n    idealRowHeight: 208,\n    minItemSize: new Size(136, 136),\n    itemSpacing: new Size(18, 18),\n    itemPadding: {\n      'medium': 78,\n      'large': 99\n    },\n    dropSpacing: 100,\n    margin: 24\n  }\n};\n\nexport class GalleryLayout<T> extends BaseLayout<T> {\n  protected idealRowHeight: number;\n  protected itemSpacing: Size;\n  itemPadding: number;\n  protected minItemSize: Size;\n  protected threshold: number;\n\n  constructor(options: GalleryLayoutOptions = {}) {\n    super(options);\n    let cardSize = 'L';\n    this.idealRowHeight = options.idealRowHeight || DEFAULT_OPTIONS[cardSize].idealRowHeight;\n    this.itemSpacing = options.itemSpacing || DEFAULT_OPTIONS[cardSize].itemSpacing;\n    this.itemPadding = options.itemPadding != null ? options.itemPadding : DEFAULT_OPTIONS[cardSize].itemPadding[this.scale];\n    this.minItemSize = options.minItemSize || DEFAULT_OPTIONS[cardSize].minItemSize;\n    this.threshold = options.threshold || 1;\n    this.margin = options.margin != null ? options.margin : DEFAULT_OPTIONS[cardSize].margin;\n  }\n\n  get layoutType() {\n    return 'gallery';\n  }\n\n  /**\n   * Takes a row of widths and if there are any widths smaller than the min-width, leech width starting from\n   * the widest in the row until it can't give anymore, then move to the second widest and so forth.\n   * Do this until all assets meet the min-width.\n   * */\n  _distributeWidths(widths) {\n    // create a copy of the widths array and sort it largest to smallest\n    let sortedWidths = widths.concat().sort((a, b) => a[1] > b[1] ? -1 : 1);\n    for (let width of widths) {\n      // for each width, if it's smaller than the min width\n      if (width[1] < this.minItemSize.width) {\n        // then figure out how much smaller\n        let delta = this.minItemSize.width - width[1];\n        for (let item of sortedWidths) {\n          // go from the largest width in the row to the smallest\n          // if the width is greater than the min width\n          if (widths[item[0]][1] > this.minItemSize.width) {\n            // subtract the delta from the width, if it's still greater than the min width\n            // then we have finished, subtract the delta permanently from that width\n            // eslint-disable-next-line max-depth\n            if (widths[item[0]][1] - delta > this.minItemSize.width) {\n              widths[item[0]][1] -= delta;\n              delta = 0;\n              break;\n            } else {\n              // otherwise, we take as much as we can from the current width and then move on to\n              // the next largest and take some width from it\n              let maxChange = widths[item[0]][1] - this.minItemSize.width;\n              delta -= maxChange;\n              widths[item[0]][1] -= maxChange;\n            }\n          }\n        }\n        if (delta > 0) {\n          return false;\n        }\n        // force the width to be the min width that we just rebalanced for\n        width[1] = this.minItemSize.width;\n      }\n    }\n    return true;\n  }\n\n  buildCollection() {\n    let visibleWidth = this.virtualizer.visibleRect.width;\n    let visibleHeight = this.virtualizer.visibleRect.height;\n    let y = this.margin;\n    let availableWidth = visibleWidth - this.margin * 2;\n\n    // If avaliable width is not greater than 0, skip node layout calculations\n    if (availableWidth > 0) {\n      // Compute aspect ratios for all of the items, and the total width if all items were on in a single row.\n      let ratios = [];\n      let totalWidth = 0;\n      let minRatio = this.minItemSize.width / this.minItemSize.height;\n      let maxRatio = availableWidth / this.minItemSize.height;\n\n      for (let node of this.collection) {\n        let ratio = node.props.width / node.props.height;\n        if (ratio < minRatio) {\n          ratio = minRatio;\n        } else if (ratio > maxRatio && ratio !== minRatio) {\n          ratio = maxRatio;\n        }\n\n        let itemWidth = ratio * this.minItemSize.height;\n        ratios.push(ratio);\n        totalWidth += itemWidth;\n      }\n\n      totalWidth += this.itemSpacing.width * (this.collection.size - 1);\n\n      // Determine how many rows we'll need, and partition the items into rows\n      // using the aspect ratios as weights.\n      let rows = Math.max(1, Math.ceil(totalWidth / availableWidth));\n      // if the available width can't hold two items, then every item will get its own row\n      // this leads to a faster run through linear partition and more dependable output for small row widths\n      if (availableWidth <= (this.minItemSize.width * 2) + (this.itemPadding * 2)) {\n        rows = this.collection.size;\n      }\n\n      let weightedRatios = ratios.map(ratio => ratio < this.threshold ? ratio + (0.5 * (1 / ratio)) : ratio);\n      let partition = linearPartition(weightedRatios, rows);\n\n      let index = 0;\n      for (let row of partition) {\n        // Compute the total weight for this row\n        let totalWeight = 0;\n        for (let j = index; j < index + row.length; j++) {\n          totalWeight += ratios[j];\n        }\n\n        // Determine the row height based on the total available width and weight of this row.\n        let bestRowHeight = (availableWidth - (row.length - 1) * this.itemSpacing.width) / totalWeight;\n\n        // if this is the last row and the row height is >2x the ideal row height, then cap to the ideal height\n        // probably doing this because if the last row has one extremely tall image, then the row becomes huge\n        // though that can happen anywhere if a row has lots of tall images... so i'm not sure why this one matters\n        if (row === partition[partition.length - 1] && bestRowHeight > this.idealRowHeight * 2) {\n          bestRowHeight = this.idealRowHeight;\n        }\n        let itemHeight = Math.round(bestRowHeight) + this.itemPadding;\n        let x = this.margin;\n\n        // if any items are going to end up too small, add a bit of width to them and subtract it from wider objects\n        let widths = [];\n        for (let j = index; j < index + row.length; j++) {\n          let width = Math.round(bestRowHeight * ratios[j]);\n          widths.push([j - index, width]);\n        }\n        this._distributeWidths(widths);\n\n        // Create items for this row.\n        for (let j = index; j < index + row.length; j++) {\n          let node = this.collection.rows[j];\n          let itemWidth = Math.max(widths[j - index][1], this.minItemSize.width);\n          let rect = new Rect(x, y, itemWidth, itemHeight);\n          let layoutInfo = new LayoutInfo(node.type, node.key, rect);\n          layoutInfo.allowOverflow = true;\n          this.layoutInfos.set(node.key, layoutInfo);\n          x += itemWidth + this.itemSpacing.width;\n        }\n\n        y += itemHeight + this.itemSpacing.height;\n        index += row.length;\n      }\n\n      if (this.isLoading) {\n        let loaderY = y;\n        let loaderHeight = 60;\n        // If there aren't any items, make loader take all avaliable room and remove margin from y calculation\n        // so it doesn't scroll\n        if (this.collection.size === 0) {\n          loaderY = 0;\n          loaderHeight = visibleHeight || 60;\n        }\n\n        let rect = new Rect(0, loaderY, visibleWidth, loaderHeight);\n        let loader = new LayoutInfo('loader', 'loader', rect);\n        this.layoutInfos.set('loader', loader);\n        y = loader.rect.maxY;\n      }\n\n      if (this.collection.size === 0 && !this.isLoading) {\n        let rect = new Rect(0, 0, visibleWidth, visibleHeight);\n        let placeholder = new LayoutInfo('placeholder', 'placeholder', rect);\n        this.layoutInfos.set('placeholder', placeholder);\n        y = placeholder.rect.maxY;\n      }\n    }\n    this.contentSize = new Size(visibleWidth, y);\n  }\n}\n\n// https://www8.cs.umu.se/kurser/TDBA77/VT06/algorithms/BOOK/BOOK2/NODE45.HTM\nfunction linearPartition(seq, k) {\n  let n = seq.length;\n  if (k <= 0) {\n    return [];\n  }\n\n  if (k >= n) {\n    return seq.map(x => [x]);\n  }\n\n  if (n === 1) {\n    return [seq];\n  }\n\n  let table = Array(n).fill(0).map(() => Array(k).fill(0));\n  let solution = Array(n - 1).fill(0).map(() => Array(k - 1).fill(0));\n\n  for (let i = 0; i < n; i++) {\n    table[i][0] = seq[i] + (i > 0 ? table[i - 1][0] : 0);\n  }\n\n  for (let i = 0; i < k; i++) {\n    table[0][i] = seq[0];\n  }\n\n  for (let i = 1; i < n; i++) {\n    for (let j = 1; j < k; j++) {\n      let currentMin = 0;\n      let minX = Infinity;\n\n      for (let x = 0; x < i; x++) {\n        let c1 = table[x][j - 1];\n        let c2 = table[i][0] - table[x][0];\n        let cost = Math.max(c1, c2);\n\n        if (!x || cost < currentMin) {\n          currentMin = cost;\n          minX = x;\n        }\n      }\n\n      table[i][j] = currentMin;\n      solution[i - 1][j - 1] = minX;\n    }\n  }\n\n  n = n - 1;\n  k = k - 2;\n\n  let result = [];\n  while (k >= 0) {\n    if (n >= 1) {\n      let row = [];\n      for (let i = solution[n - 1][k] + 1; i < n + 1; i++) {\n        row.push(seq[i]);\n      }\n\n      result.unshift(row);\n      n = solution[n - 1][k];\n    }\n\n    k--;\n  }\n\n  let row = [];\n  for (let i = 0; i < n + 1; i++) {\n    row.push(seq[i]);\n  }\n\n  result.unshift(row);\n\n  return result;\n}\n"],"names":[],"version":3,"file":"GalleryLayout.main.js.map"}

package/dist/GalleryLayout.mjs

@@ -0,0 +1,224 @@
+import {BaseLayout as $3d424c147206bac9$export$64943d2e59d72a29} from "./BaseLayout.mjs";
+import {Size as $lQvIB$Size, Rect as $lQvIB$Rect, LayoutInfo as $lQvIB$LayoutInfo} from "@react-stately/virtualizer";
+
+/*
+ * Copyright 2021 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
+
+const $c0ba81539c443916$var$DEFAULT_OPTIONS = {
+    S: {
+        idealRowHeight: 112,
+        minItemSize: new (0, $lQvIB$Size)(96, 96),
+        itemSpacing: new (0, $lQvIB$Size)(8, 16),
+        itemPadding: 24,
+        dropSpacing: 50,
+        margin: 8
+    },
+    L: {
+        idealRowHeight: 208,
+        minItemSize: new (0, $lQvIB$Size)(136, 136),
+        itemSpacing: new (0, $lQvIB$Size)(18, 18),
+        itemPadding: {
+            "medium": 78,
+            "large": 99
+        },
+        dropSpacing: 100,
+        margin: 24
+    }
+};
+class $c0ba81539c443916$export$8e52095834484b61 extends (0, $3d424c147206bac9$export$64943d2e59d72a29) {
+    get layoutType() {
+        return "gallery";
+    }
+    /**
+   * Takes a row of widths and if there are any widths smaller than the min-width, leech width starting from
+   * the widest in the row until it can't give anymore, then move to the second widest and so forth.
+   * Do this until all assets meet the min-width.
+   * */ _distributeWidths(widths) {
+        // create a copy of the widths array and sort it largest to smallest
+        let sortedWidths = widths.concat().sort((a, b)=>a[1] > b[1] ? -1 : 1);
+        for (let width of widths)// for each width, if it's smaller than the min width
+        if (width[1] < this.minItemSize.width) {
+            // then figure out how much smaller
+            let delta = this.minItemSize.width - width[1];
+            for (let item of sortedWidths)// go from the largest width in the row to the smallest
+            // if the width is greater than the min width
+            if (widths[item[0]][1] > this.minItemSize.width) {
+                // subtract the delta from the width, if it's still greater than the min width
+                // then we have finished, subtract the delta permanently from that width
+                // eslint-disable-next-line max-depth
+                if (widths[item[0]][1] - delta > this.minItemSize.width) {
+                    widths[item[0]][1] -= delta;
+                    delta = 0;
+                    break;
+                } else {
+                    // otherwise, we take as much as we can from the current width and then move on to
+                    // the next largest and take some width from it
+                    let maxChange = widths[item[0]][1] - this.minItemSize.width;
+                    delta -= maxChange;
+                    widths[item[0]][1] -= maxChange;
+                }
+            }
+            if (delta > 0) return false;
+            // force the width to be the min width that we just rebalanced for
+            width[1] = this.minItemSize.width;
+        }
+        return true;
+    }
+    buildCollection() {
+        let visibleWidth = this.virtualizer.visibleRect.width;
+        let visibleHeight = this.virtualizer.visibleRect.height;
+        let y = this.margin;
+        let availableWidth = visibleWidth - this.margin * 2;
+        // If avaliable width is not greater than 0, skip node layout calculations
+        if (availableWidth > 0) {
+            // Compute aspect ratios for all of the items, and the total width if all items were on in a single row.
+            let ratios = [];
+            let totalWidth = 0;
+            let minRatio = this.minItemSize.width / this.minItemSize.height;
+            let maxRatio = availableWidth / this.minItemSize.height;
+            for (let node of this.collection){
+                let ratio = node.props.width / node.props.height;
+                if (ratio < minRatio) ratio = minRatio;
+                else if (ratio > maxRatio && ratio !== minRatio) ratio = maxRatio;
+                let itemWidth = ratio * this.minItemSize.height;
+                ratios.push(ratio);
+                totalWidth += itemWidth;
+            }
+            totalWidth += this.itemSpacing.width * (this.collection.size - 1);
+            // Determine how many rows we'll need, and partition the items into rows
+            // using the aspect ratios as weights.
+            let rows = Math.max(1, Math.ceil(totalWidth / availableWidth));
+            // if the available width can't hold two items, then every item will get its own row
+            // this leads to a faster run through linear partition and more dependable output for small row widths
+            if (availableWidth <= this.minItemSize.width * 2 + this.itemPadding * 2) rows = this.collection.size;
+            let weightedRatios = ratios.map((ratio)=>ratio < this.threshold ? ratio + 0.5 * (1 / ratio) : ratio);
+            let partition = $c0ba81539c443916$var$linearPartition(weightedRatios, rows);
+            let index = 0;
+            for (let row of partition){
+                // Compute the total weight for this row
+                let totalWeight = 0;
+                for(let j = index; j < index + row.length; j++)totalWeight += ratios[j];
+                // Determine the row height based on the total available width and weight of this row.
+                let bestRowHeight = (availableWidth - (row.length - 1) * this.itemSpacing.width) / totalWeight;
+                // if this is the last row and the row height is >2x the ideal row height, then cap to the ideal height
+                // probably doing this because if the last row has one extremely tall image, then the row becomes huge
+                // though that can happen anywhere if a row has lots of tall images... so i'm not sure why this one matters
+                if (row === partition[partition.length - 1] && bestRowHeight > this.idealRowHeight * 2) bestRowHeight = this.idealRowHeight;
+                let itemHeight = Math.round(bestRowHeight) + this.itemPadding;
+                let x = this.margin;
+                // if any items are going to end up too small, add a bit of width to them and subtract it from wider objects
+                let widths = [];
+                for(let j = index; j < index + row.length; j++){
+                    let width = Math.round(bestRowHeight * ratios[j]);
+                    widths.push([
+                        j - index,
+                        width
+                    ]);
+                }
+                this._distributeWidths(widths);
+                // Create items for this row.
+                for(let j = index; j < index + row.length; j++){
+                    let node = this.collection.rows[j];
+                    let itemWidth = Math.max(widths[j - index][1], this.minItemSize.width);
+                    let rect = new (0, $lQvIB$Rect)(x, y, itemWidth, itemHeight);
+                    let layoutInfo = new (0, $lQvIB$LayoutInfo)(node.type, node.key, rect);
+                    layoutInfo.allowOverflow = true;
+                    this.layoutInfos.set(node.key, layoutInfo);
+                    x += itemWidth + this.itemSpacing.width;
+                }
+                y += itemHeight + this.itemSpacing.height;
+                index += row.length;
+            }
+            if (this.isLoading) {
+                let loaderY = y;
+                let loaderHeight = 60;
+                // If there aren't any items, make loader take all avaliable room and remove margin from y calculation
+                // so it doesn't scroll
+                if (this.collection.size === 0) {
+                    loaderY = 0;
+                    loaderHeight = visibleHeight || 60;
+                }
+                let rect = new (0, $lQvIB$Rect)(0, loaderY, visibleWidth, loaderHeight);
+                let loader = new (0, $lQvIB$LayoutInfo)("loader", "loader", rect);
+                this.layoutInfos.set("loader", loader);
+                y = loader.rect.maxY;
+            }
+            if (this.collection.size === 0 && !this.isLoading) {
+                let rect = new (0, $lQvIB$Rect)(0, 0, visibleWidth, visibleHeight);
+                let placeholder = new (0, $lQvIB$LayoutInfo)("placeholder", "placeholder", rect);
+                this.layoutInfos.set("placeholder", placeholder);
+                y = placeholder.rect.maxY;
+            }
+        }
+        this.contentSize = new (0, $lQvIB$Size)(visibleWidth, y);
+    }
+    constructor(options = {}){
+        super(options);
+        let cardSize = "L";
+        this.idealRowHeight = options.idealRowHeight || $c0ba81539c443916$var$DEFAULT_OPTIONS[cardSize].idealRowHeight;
+        this.itemSpacing = options.itemSpacing || $c0ba81539c443916$var$DEFAULT_OPTIONS[cardSize].itemSpacing;
+        this.itemPadding = options.itemPadding != null ? options.itemPadding : $c0ba81539c443916$var$DEFAULT_OPTIONS[cardSize].itemPadding[this.scale];
+        this.minItemSize = options.minItemSize || $c0ba81539c443916$var$DEFAULT_OPTIONS[cardSize].minItemSize;
+        this.threshold = options.threshold || 1;
+        this.margin = options.margin != null ? options.margin : $c0ba81539c443916$var$DEFAULT_OPTIONS[cardSize].margin;
+    }
+}
+// https://www8.cs.umu.se/kurser/TDBA77/VT06/algorithms/BOOK/BOOK2/NODE45.HTM
+function $c0ba81539c443916$var$linearPartition(seq, k) {
+    let n = seq.length;
+    if (k <= 0) return [];
+    if (k >= n) return seq.map((x)=>[
+            x
+        ]);
+    if (n === 1) return [
+        seq
+    ];
+    let table = Array(n).fill(0).map(()=>Array(k).fill(0));
+    let solution = Array(n - 1).fill(0).map(()=>Array(k - 1).fill(0));
+    for(let i = 0; i < n; i++)table[i][0] = seq[i] + (i > 0 ? table[i - 1][0] : 0);
+    for(let i = 0; i < k; i++)table[0][i] = seq[0];
+    for(let i = 1; i < n; i++)for(let j = 1; j < k; j++){
+        let currentMin = 0;
+        let minX = Infinity;
+        for(let x = 0; x < i; x++){
+            let c1 = table[x][j - 1];
+            let c2 = table[i][0] - table[x][0];
+            let cost = Math.max(c1, c2);
+            if (!x || cost < currentMin) {
+                currentMin = cost;
+                minX = x;
+            }
+        }
+        table[i][j] = currentMin;
+        solution[i - 1][j - 1] = minX;
+    }
+    n = n - 1;
+    k = k - 2;
+    let result = [];
+    while(k >= 0){
+        if (n >= 1) {
+            let row = [];
+            for(let i = solution[n - 1][k] + 1; i < n + 1; i++)row.push(seq[i]);
+            result.unshift(row);
+            n = solution[n - 1][k];
+        }
+        k--;
+    }
+    let row = [];
+    for(let i = 0; i < n + 1; i++)row.push(seq[i]);
+    result.unshift(row);
+    return result;
+}
+
+
+export {$c0ba81539c443916$export$8e52095834484b61 as GalleryLayout};
+//# sourceMappingURL=GalleryLayout.mjs.map