@thangdevalone/meeting-grid-layout-core 1.4.1

package/dist/index.mjs

@@ -0,0 +1,902 @@
+const DEFAULT_FLOAT_BREAKPOINTS = [
+  { minWidth: 0, width: 100, height: 135 },
+  { minWidth: 480, width: 130, height: 175 },
+  { minWidth: 768, width: 160, height: 215 },
+  { minWidth: 1024, width: 180, height: 240 },
+  { minWidth: 1440, width: 220, height: 295 }
+];
+function resolveFloatSize(containerWidth, breakpoints) {
+  const sorted = [...breakpoints].sort((a, b) => b.minWidth - a.minWidth);
+  const match = sorted.find((bp) => containerWidth >= bp.minWidth);
+  if (match) {
+    return { width: match.width, height: match.height };
+  }
+  const smallest = sorted[sorted.length - 1];
+  return smallest ? { width: smallest.width, height: smallest.height } : { width: 120, height: 160 };
+}
+function getAspectRatio(ratio) {
+  const [width, height] = ratio.split(":");
+  if (!width || !height) {
+    throw new Error(
+      'meet-layout-grid: Invalid aspect ratio provided, expected format is "width:height".'
+    );
+  }
+  return Number.parseInt(height) / Number.parseInt(width);
+}
+function parseAspectRatio(ratio) {
+  const [width, height] = ratio.split(":").map(Number);
+  if (!width || !height || isNaN(width) || isNaN(height)) {
+    throw new Error(
+      'meet-layout-grid: Invalid aspect ratio provided, expected format is "width:height".'
+    );
+  }
+  return { widthRatio: width, heightRatio: height };
+}
+function calculateContentDimensions(cellDimensions, itemRatio, defaultRatio) {
+  const { width: cellW, height: cellH } = cellDimensions;
+  const effectiveRatio = itemRatio ?? (defaultRatio ? defaultRatio : void 0);
+  if (!effectiveRatio || effectiveRatio === "auto") {
+    return {
+      width: cellW,
+      height: cellH,
+      offsetTop: 0,
+      offsetLeft: 0
+    };
+  }
+  const ratio = getAspectRatio(effectiveRatio);
+  let contentW = cellW;
+  let contentH = contentW * ratio;
+  if (contentH > cellH) {
+    contentH = cellH;
+    contentW = contentH / ratio;
+  }
+  const offsetTop = (cellH - contentH) / 2;
+  const offsetLeft = (cellW - contentW) / 2;
+  return {
+    width: contentW,
+    height: contentH,
+    offsetTop,
+    offsetLeft
+  };
+}
+function createGetItemContentDimensions(getItemDimensions, itemAspectRatios, defaultRatio) {
+  return (index, itemRatio) => {
+    const cellDimensions = getItemDimensions(index);
+    const effectiveRatio = itemRatio ?? itemAspectRatios?.[index] ?? defaultRatio;
+    return calculateContentDimensions(cellDimensions, effectiveRatio, defaultRatio);
+  };
+}
+function getGridItemDimensions({ count, dimensions, aspectRatio, gap }) {
+  let { width: W, height: H } = dimensions;
+  if (W === 0 || H === 0 || count === 0) {
+    return { width: 0, height: 0, rows: 1, cols: 1 };
+  }
+  W -= gap * 2;
+  H -= gap * 2;
+  const s = gap;
+  const N = count;
+  const r = getAspectRatio(aspectRatio);
+  let w = 0;
+  let h = 0;
+  let a = 1;
+  let b = 1;
+  const minCols = 1;
+  const widths = [];
+  for (let n = 1; n <= N; n++) {
+    widths.push((W - s * (n - 1)) / n, (H - s * (n - 1)) / (n * r));
+  }
+  widths.sort((a2, b2) => b2 - a2);
+  for (const width of widths) {
+    w = width;
+    h = w * r;
+    a = Math.floor((W + s) / (w + s));
+    b = Math.floor((H + s) / (h + s));
+    if (a < minCols && N >= minCols) {
+      continue;
+    }
+    if (a * b >= N) {
+      a = Math.max(minCols, Math.ceil(N / b));
+      b = Math.ceil(N / a);
+      break;
+    }
+  }
+  if (a < minCols && N >= minCols) {
+    a = minCols;
+    b = Math.ceil(N / a);
+    w = (W - s * (a - 1)) / a;
+    h = w * r;
+    const requiredHeight = b * h + (b - 1) * s;
+    if (requiredHeight > H) {
+      const scale = H / requiredHeight;
+      h = h * scale;
+      w = h / r;
+    }
+  }
+  return { width: w, height: h, rows: b, cols: a };
+}
+function createGridItemPositioner({
+  parentDimensions,
+  dimensions,
+  rows,
+  cols,
+  count,
+  gap
+}) {
+  const { width: W, height: H } = parentDimensions;
+  const { width: w, height: h } = dimensions;
+  const firstTop = (H - (h * rows + (rows - 1) * gap)) / 2;
+  let firstLeft = (W - (w * cols + (cols - 1) * gap)) / 2;
+  const topAdd = h + gap;
+  const leftAdd = w + gap;
+  const incompleteRowCols = count % cols;
+  const lastRowStartIndex = incompleteRowCols > 0 ? count - incompleteRowCols : count - cols;
+  function getPosition(index) {
+    const row = Math.floor(index / cols);
+    const col = index % cols;
+    const isInLastRow = incompleteRowCols > 0 && index >= lastRowStartIndex;
+    let leftOffset = firstLeft;
+    if (isInLastRow) {
+      const lastRowItemCount = incompleteRowCols;
+      const colInLastRow = index - lastRowStartIndex;
+      leftOffset = (W - (w * lastRowItemCount + (lastRowItemCount - 1) * gap)) / 2;
+      const top2 = firstTop + row * topAdd;
+      const left2 = leftOffset + colInLastRow * leftAdd;
+      return { top: top2, left: left2 };
+    }
+    const top = firstTop + row * topAdd;
+    const left = leftOffset + col * leftAdd;
+    return { top, left };
+  }
+  return getPosition;
+}
+function createGrid({ aspectRatio, count, dimensions, gap }) {
+  const { width, height, rows, cols } = getGridItemDimensions({
+    aspectRatio,
+    count,
+    dimensions,
+    gap
+  });
+  const getPosition = createGridItemPositioner({
+    parentDimensions: dimensions,
+    dimensions: { width, height },
+    rows,
+    cols,
+    count,
+    gap
+  });
+  return {
+    width,
+    height,
+    rows,
+    cols,
+    getPosition
+  };
+}
+function createFlexiblePinGrid(options) {
+  const {
+    dimensions,
+    gap,
+    aspectRatio,
+    count,
+    othersPosition = "right",
+    pinnedIndex = 0,
+    maxVisible = 0,
+    currentVisiblePage = 0
+  } = options;
+  if (count === 0) {
+    return createEmptyMeetGridResult("gallery");
+  }
+  if (count === 1) {
+    const { width: W2, height: H2 } = dimensions;
+    const mainWidth2 = W2 - gap * 2;
+    const mainHeight2 = H2 - gap * 2;
+    const getItemDimensions2 = () => ({ width: mainWidth2, height: mainHeight2 });
+    const pagination2 = createDefaultPagination(1);
+    return {
+      width: mainWidth2,
+      height: mainHeight2,
+      rows: 1,
+      cols: 1,
+      layoutMode: "gallery",
+      getPosition: () => ({ top: gap, left: gap }),
+      getItemDimensions: getItemDimensions2,
+      isMainItem: () => true,
+      pagination: pagination2,
+      isItemVisible: () => true,
+      hiddenCount: 0,
+      getLastVisibleOthersIndex: () => -1,
+      getItemContentDimensions: createGetItemContentDimensions(
+        getItemDimensions2,
+        options.itemAspectRatios,
+        aspectRatio
+      )
+    };
+  }
+  const { width: W, height: H } = dimensions;
+  const isPortrait = H > W;
+  const effectivePosition = isPortrait ? "bottom" : othersPosition;
+  const isVertical = effectivePosition === "bottom" || effectivePosition === "top";
+  const ratio = getAspectRatio(aspectRatio);
+  const totalOthers = count - 1;
+  const visibleOthers = maxVisible > 0 ? Math.min(maxVisible, totalOthers) : totalOthers;
+  const othersTotalPages = maxVisible > 0 ? Math.ceil(totalOthers / maxVisible) : 1;
+  const safeCurrentVisiblePage = Math.min(currentVisiblePage, Math.max(0, othersTotalPages - 1));
+  const startOthersIndex = safeCurrentVisiblePage * (maxVisible > 0 ? maxVisible : totalOthers);
+  const endOthersIndex = Math.min(startOthersIndex + visibleOthers, totalOthers);
+  const itemsOnPage = endOthersIndex - startOthersIndex;
+  const isPaginationMode = othersTotalPages > 1;
+  const isActivelyPaginating = isPaginationMode && currentVisiblePage > 0;
+  const hiddenCount = isActivelyPaginating ? 0 : totalOthers > itemsOnPage ? totalOthers - itemsOnPage + 1 : 0;
+  let mainWidth;
+  let mainHeight;
+  let othersAreaWidth;
+  let othersAreaHeight;
+  if (isVertical) {
+    const areaW = W - gap * 2;
+    const isMobilePin = W < 500;
+    if (isMobilePin && isPortrait && visibleOthers > 0) {
+      const mobileCols = Math.min(visibleOthers, 2);
+      const mobileRows = Math.ceil(visibleOthers / mobileCols);
+      let thumbW = (areaW - (mobileCols - 1) * gap) / mobileCols;
+      let thumbH = thumbW * ratio;
+      let neededH = mobileRows * thumbH + (mobileRows - 1) * gap + gap;
+      const maxOthersH = H * 0.7;
+      if (neededH > maxOthersH) {
+        neededH = maxOthersH;
+        const availThumbH = (neededH - (mobileRows - 1) * gap - gap * 2) / mobileRows;
+        thumbH = availThumbH;
+        thumbW = thumbH / ratio;
+      }
+      othersAreaHeight = neededH;
+      othersAreaWidth = areaW;
+    } else {
+      const othersRatio = isPortrait ? 1 : ratio;
+      let bestOthersH = 0;
+      let bestThumbArea = 0;
+      const maxRows = Math.min(3, visibleOthers || 1);
+      const maxOthersRatio = 0.5;
+      for (let rows = 1; rows <= maxRows; rows++) {
+        const cols = Math.ceil((visibleOthers || 1) / rows);
+        const thumbW = (areaW - (cols - 1) * gap) / cols;
+        const thumbH = thumbW * othersRatio;
+        const requiredH = rows * thumbH + (rows - 1) * gap + gap;
+        const areaRatio = requiredH / H;
+        if (areaRatio > maxOthersRatio)
+          continue;
+        if (thumbH < 40)
+          continue;
+        const thumbArea = thumbW * thumbH;
+        if (thumbArea > bestThumbArea) {
+          bestThumbArea = thumbArea;
+          bestOthersH = requiredH;
+        }
+      }
+      if (bestOthersH === 0) {
+        bestOthersH = H * (isPortrait ? 0.25 : 0.2);
+      }
+      const minRatio = 0.12;
+      const maxRatio = 0.45;
+      if (bestOthersH / H < minRatio)
+        bestOthersH = H * minRatio;
+      else if (bestOthersH / H > maxRatio)
+        bestOthersH = H * maxRatio;
+      othersAreaHeight = bestOthersH;
+      othersAreaWidth = areaW;
+    }
+    mainHeight = H - othersAreaHeight - gap * 3;
+    mainWidth = areaW;
+  } else {
+    const areaH = H - gap * 2;
+    let bestOthersW = W * 0.2;
+    let bestScore = 0;
+    const maxCols = Math.min(3, visibleOthers || 1);
+    for (let cols = 1; cols <= maxCols; cols++) {
+      const rows = Math.ceil((visibleOthers || 1) / cols);
+      const thumbH = (areaH - (rows - 1) * gap) / rows;
+      const thumbW = thumbH / ratio;
+      const requiredW = cols * thumbW + (cols - 1) * gap + gap * 2;
+      const areaRatio = requiredW / W;
+      const thumbArea = thumbW * thumbH;
+      const mainAreaBonus = (1 - areaRatio) * 0.5;
+      const score = thumbArea * (1 + mainAreaBonus);
+      if (areaRatio >= 0.1 && areaRatio <= 0.4 && score > bestScore) {
+        bestOthersW = requiredW;
+        bestScore = score;
+      }
+    }
+    if (bestOthersW / W < 0.1)
+      bestOthersW = W * 0.12;
+    else if (bestOthersW / W > 0.4)
+      bestOthersW = W * 0.35;
+    othersAreaWidth = bestOthersW;
+    othersAreaHeight = areaH;
+    mainWidth = W - othersAreaWidth - gap * 2;
+    mainHeight = areaH;
+  }
+  const mainItemWidth = mainWidth;
+  const mainItemHeight = mainHeight;
+  const positions = [];
+  let mainLeft;
+  let mainTop;
+  if (isVertical) {
+    mainLeft = gap + (mainWidth - mainItemWidth) / 2;
+    mainTop = effectivePosition === "top" ? othersAreaHeight + gap * 2 + (mainHeight - mainItemHeight) / 2 : gap + (mainHeight - mainItemHeight) / 2;
+  } else {
+    mainLeft = effectivePosition === "left" ? othersAreaWidth + gap * 2 + (mainWidth - mainItemWidth) / 2 : gap + (mainWidth - mainItemWidth) / 2;
+    mainTop = gap + (mainHeight - mainItemHeight) / 2;
+  }
+  positions[pinnedIndex] = {
+    position: { top: mainTop, left: mainLeft },
+    dimensions: { width: mainItemWidth, height: mainItemHeight }
+  };
+  {
+    const isMobileOthers = W < 500;
+    const othersRatio = isPortrait ? 1 : ratio;
+    let thumbCols = 1;
+    let thumbRows = 1;
+    let thumbWidth = 0;
+    let thumbHeight = 0;
+    if (visibleOthers > 0) {
+      if (isVertical) {
+        if (isMobileOthers && isPortrait) {
+          thumbCols = Math.min(visibleOthers, 2);
+          thumbRows = Math.ceil(visibleOthers / thumbCols);
+          const maxW = (othersAreaWidth - (thumbCols - 1) * gap) / thumbCols;
+          const maxH = (othersAreaHeight - (thumbRows - 1) * gap - gap) / thumbRows;
+          thumbWidth = maxW;
+          thumbHeight = thumbWidth * ratio;
+          if (thumbHeight > maxH) {
+            thumbHeight = maxH;
+            thumbWidth = thumbHeight / ratio;
+          }
+        } else {
+          let bestScore = -1;
+          for (let cols = 1; cols <= visibleOthers; cols++) {
+            const rows = Math.ceil(visibleOthers / cols);
+            const maxTileW = (othersAreaWidth - (cols - 1) * gap) / cols;
+            const maxTileH = (othersAreaHeight - (rows - 1) * gap) / rows;
+            let tileW = maxTileW;
+            let tileH = tileW * othersRatio;
+            if (tileH > maxTileH) {
+              tileH = maxTileH;
+              tileW = tileH / othersRatio;
+            }
+            const area = tileW * tileH;
+            const colsMultiplier = cols >= rows ? 1.5 : 0.5;
+            const score = area * colsMultiplier;
+            if (score > bestScore) {
+              bestScore = score;
+              thumbCols = cols;
+              thumbRows = rows;
+              thumbWidth = tileW;
+              thumbHeight = tileH;
+            }
+          }
+        }
+      } else {
+        let bestScore = -1;
+        const targetRatio = 1 / ratio;
+        for (let rows = 1; rows <= visibleOthers; rows++) {
+          const cols = Math.ceil(visibleOthers / rows);
+          const maxTileH = (othersAreaHeight - (rows - 1) * gap) / rows;
+          const idealTileW = maxTileH * targetRatio;
+          const maxTileW = (othersAreaWidth - (cols - 1) * gap) / cols;
+          let tileW, tileH;
+          if (idealTileW <= maxTileW) {
+            tileW = idealTileW;
+            tileH = maxTileH;
+          } else {
+            tileW = maxTileW;
+            tileH = tileW / targetRatio;
+          }
+          const area = tileW * tileH * visibleOthers;
+          if (area > bestScore) {
+            bestScore = area;
+            thumbCols = cols;
+            thumbRows = rows;
+            thumbWidth = tileW;
+            thumbHeight = tileH;
+          }
+        }
+      }
+    }
+    const totalGridWidth = thumbCols * thumbWidth + (thumbCols - 1) * gap;
+    const totalGridHeight = thumbRows * thumbHeight + (thumbRows - 1) * gap;
+    let gridStartLeft;
+    let gridStartTop;
+    if (isVertical) {
+      gridStartLeft = gap + (othersAreaWidth - totalGridWidth) / 2;
+      gridStartTop = effectivePosition === "top" ? gap + (othersAreaHeight - totalGridHeight) / 2 : mainHeight + gap * 2 + (othersAreaHeight - totalGridHeight) / 2;
+    } else {
+      gridStartLeft = effectivePosition === "left" ? gap + (othersAreaWidth - totalGridWidth) / 2 : mainWidth + gap * 2 + (othersAreaWidth - totalGridWidth) / 2;
+      gridStartTop = gap + (othersAreaHeight - totalGridHeight) / 2;
+    }
+    let othersIndex = 0;
+    for (let i = 0; i < count; i++) {
+      if (i === pinnedIndex)
+        continue;
+      const isInVisibleRange = othersIndex >= startOthersIndex && othersIndex < endOthersIndex;
+      if (isInVisibleRange) {
+        const pageRelativeIndex = othersIndex - startOthersIndex;
+        const row = Math.floor(pageRelativeIndex / thumbCols);
+        const col = pageRelativeIndex % thumbCols;
+        const itemsInLastRow = itemsOnPage % thumbCols || thumbCols;
+        let rowLeft = gridStartLeft;
+        const lastRowIndex = Math.ceil(itemsOnPage / thumbCols) - 1;
+        if (row === lastRowIndex && itemsInLastRow < thumbCols) {
+          const rowWidth = itemsInLastRow * thumbWidth + (itemsInLastRow - 1) * gap;
+          if (isVertical) {
+            rowLeft = gap + (othersAreaWidth - rowWidth) / 2;
+          } else {
+            rowLeft = (effectivePosition === "left" ? gap : mainWidth + gap * 2) + (othersAreaWidth - rowWidth) / 2;
+          }
+        }
+        positions[i] = {
+          position: {
+            top: gridStartTop + row * (thumbHeight + gap),
+            left: rowLeft + col * (thumbWidth + gap)
+          },
+          dimensions: { width: thumbWidth, height: thumbHeight }
+        };
+      } else {
+        positions[i] = {
+          position: { top: -9999, left: -9999 },
+          dimensions: { width: 0, height: 0 }
+        };
+      }
+      othersIndex++;
+    }
+  }
+  const pagination = {
+    enabled: maxVisible > 0 && totalOthers > maxVisible,
+    currentPage: safeCurrentVisiblePage,
+    totalPages: othersTotalPages,
+    itemsOnPage,
+    startIndex: startOthersIndex,
+    endIndex: endOthersIndex
+  };
+  const getItemDimensions = (index) => positions[index]?.dimensions ?? { width: 0, height: 0 };
+  const getLastVisibleOthersIndex = () => {
+    if (itemsOnPage === 0)
+      return -1;
+    let othersIdx = 0;
+    let lastVisibleOriginalIdx = -1;
+    for (let i = 0; i < count; i++) {
+      if (i === pinnedIndex)
+        continue;
+      if (othersIdx >= startOthersIndex && othersIdx < endOthersIndex) {
+        lastVisibleOriginalIdx = i;
+      }
+      othersIdx++;
+    }
+    return lastVisibleOriginalIdx;
+  };
+  return {
+    width: mainItemWidth,
+    height: mainItemHeight,
+    rows: isVertical ? 2 : 1,
+    cols: isVertical ? 1 : 2,
+    layoutMode: "gallery",
+    getPosition: (index) => positions[index]?.position ?? { top: 0, left: 0 },
+    getItemDimensions,
+    isMainItem: (index) => index === pinnedIndex,
+    pagination,
+    isItemVisible: (index) => {
+      if (index === pinnedIndex)
+        return true;
+      let sIdx = 0;
+      for (let i = 0; i < index; i++) {
+        if (i !== pinnedIndex)
+          sIdx++;
+      }
+      return sIdx >= startOthersIndex && sIdx < endOthersIndex;
+    },
+    hiddenCount,
+    getLastVisibleOthersIndex,
+    getItemContentDimensions: createGetItemContentDimensions(
+      getItemDimensions,
+      options.itemAspectRatios,
+      aspectRatio
+    )
+  };
+}
+function createSpotlightGrid(options) {
+  const { dimensions, gap, aspectRatio, pinnedIndex = 0, itemAspectRatios } = options;
+  const { width: W, height: H } = dimensions;
+  const itemRatio = itemAspectRatios?.[pinnedIndex];
+  const shouldFill = itemRatio === "auto";
+  let spotWidth;
+  let spotHeight;
+  if (shouldFill) {
+    spotWidth = W - gap * 2;
+    spotHeight = H - gap * 2;
+  } else {
+    const ratio = itemRatio ? getAspectRatio(itemRatio) : getAspectRatio(aspectRatio);
+    spotWidth = W - gap * 2;
+    spotHeight = spotWidth * ratio;
+    if (spotHeight > H - gap * 2) {
+      spotHeight = H - gap * 2;
+      spotWidth = spotHeight / ratio;
+    }
+  }
+  const position = {
+    top: gap + (H - gap * 2 - spotHeight) / 2,
+    left: gap + (W - gap * 2 - spotWidth) / 2
+  };
+  const pagination = createDefaultPagination(1);
+  const getItemDimensions = (index) => index === pinnedIndex ? { width: spotWidth, height: spotHeight } : { width: 0, height: 0 };
+  return {
+    width: spotWidth,
+    height: spotHeight,
+    rows: 1,
+    cols: 1,
+    layoutMode: "spotlight",
+    getPosition: (index) => index === pinnedIndex ? position : { top: -9999, left: -9999 },
+    getItemDimensions,
+    isMainItem: (index) => index === pinnedIndex,
+    pagination,
+    isItemVisible: (index) => index === pinnedIndex,
+    hiddenCount: 0,
+    getLastVisibleOthersIndex: () => -1,
+    getItemContentDimensions: createGetItemContentDimensions(
+      getItemDimensions,
+      options.itemAspectRatios,
+      aspectRatio
+    )
+  };
+}
+function createDefaultPagination(count) {
+  return {
+    enabled: false,
+    currentPage: 0,
+    totalPages: 1,
+    itemsOnPage: count,
+    startIndex: 0,
+    endIndex: count
+  };
+}
+function createPaginationInfo(count, maxItemsPerPage, currentPage) {
+  if (!maxItemsPerPage || maxItemsPerPage <= 0 || maxItemsPerPage >= count) {
+    return createDefaultPagination(count);
+  }
+  const totalPages = Math.ceil(count / maxItemsPerPage);
+  const page = Math.min(Math.max(0, currentPage ?? 0), totalPages - 1);
+  const startIndex = page * maxItemsPerPage;
+  const endIndex = Math.min(startIndex + maxItemsPerPage, count);
+  return {
+    enabled: true,
+    currentPage: page,
+    totalPages,
+    itemsOnPage: endIndex - startIndex,
+    startIndex,
+    endIndex
+  };
+}
+function createEmptyMeetGridResult(layoutMode) {
+  const getItemDimensions = () => ({ width: 0, height: 0 });
+  return {
+    width: 0,
+    height: 0,
+    rows: 0,
+    cols: 0,
+    layoutMode,
+    getPosition: () => ({ top: 0, left: 0 }),
+    getItemDimensions,
+    isMainItem: () => false,
+    pagination: createDefaultPagination(0),
+    isItemVisible: () => false,
+    hiddenCount: 0,
+    getLastVisibleOthersIndex: () => -1,
+    getItemContentDimensions: () => ({ width: 0, height: 0, offsetTop: 0, offsetLeft: 0 })
+  };
+}
+function createFlexibleGalleryGrid(options) {
+  const {
+    dimensions,
+    gap,
+    aspectRatio,
+    count,
+    itemAspectRatios = [],
+    maxItemsPerPage,
+    currentPage,
+    maxVisible = 0
+  } = options;
+  if (count === 0) {
+    return createEmptyMeetGridResult("gallery");
+  }
+  const { width: W, height: H } = dimensions;
+  const availW = W - gap * 2;
+  const availH = H - gap * 2;
+  let visibleCount = count;
+  let hiddenCount = 0;
+  let startIndex = 0;
+  let endIndex = count;
+  if (maxItemsPerPage && maxItemsPerPage > 0) {
+    const pagInfo = createPaginationInfo(count, maxItemsPerPage, currentPage);
+    visibleCount = pagInfo.itemsOnPage;
+    startIndex = pagInfo.startIndex;
+    endIndex = pagInfo.endIndex;
+  } else if (maxVisible > 0 && count > maxVisible) {
+    visibleCount = maxVisible;
+    hiddenCount = count - maxVisible + 1;
+    startIndex = 0;
+    endIndex = maxVisible;
+  }
+  const pagination = maxItemsPerPage && maxItemsPerPage > 0 ? createPaginationInfo(count, maxItemsPerPage, currentPage) : {
+    enabled: false,
+    currentPage: 0,
+    totalPages: 1,
+    itemsOnPage: visibleCount,
+    startIndex,
+    endIndex
+  };
+  const visibleIndices = [];
+  for (let i = startIndex; i < endIndex; i++) {
+    visibleIndices.push(i);
+  }
+  const itemWHRatios = [];
+  for (const idx of visibleIndices) {
+    const ratioStr = itemAspectRatios[idx] ?? aspectRatio;
+    const hw = getAspectRatio(ratioStr);
+    itemWHRatios.push(1 / hw);
+  }
+  const effectiveCount = visibleIndices.length;
+  function computeTotalHeightForRows(numRows) {
+    const base = Math.floor(effectiveCount / numRows);
+    const extra = effectiveCount % numRows;
+    let totalH = 0;
+    let itemIdx = 0;
+    for (let r = 0; r < numRows; r++) {
+      const rowSize = base + (r < extra ? 1 : 0);
+      let totalUnitW = 0;
+      for (let i = 0; i < rowSize; i++) {
+        totalUnitW += itemWHRatios[itemIdx + i];
+      }
+      const netW = availW - (rowSize - 1) * gap;
+      totalH += netW / totalUnitW;
+      itemIdx += rowSize;
+    }
+    return totalH + (numRows - 1) * gap;
+  }
+  function distributeEvenly(numRows) {
+    const result = [];
+    const base = Math.floor(effectiveCount / numRows);
+    const extra = effectiveCount % numRows;
+    let idx = 0;
+    for (let r = 0; r < numRows; r++) {
+      const size = base + (r < extra ? 1 : 0);
+      result.push(Array.from({ length: size }, (_, i) => idx + i));
+      idx += size;
+    }
+    return result;
+  }
+  let bestRowCount = 1;
+  let bestDiff = Infinity;
+  const maxTryRows = Math.min(effectiveCount, Math.ceil(Math.sqrt(effectiveCount) * 2.5));
+  let prevTotalH = 0;
+  for (let numRows = 1; numRows <= maxTryRows; numRows++) {
+    if (Math.floor(effectiveCount / numRows) === 0)
+      break;
+    const totalH = computeTotalHeightForRows(numRows);
+    const diff = Math.abs(totalH - availH);
+    if (diff < bestDiff) {
+      bestDiff = diff;
+      bestRowCount = numRows;
+    }
+    if (numRows > 1 && totalH > availH && prevTotalH < availH) {
+      break;
+    }
+    prevTotalH = totalH;
+  }
+  const bestRows = distributeEvenly(bestRowCount);
+  const posMap = /* @__PURE__ */ new Map();
+  const rowCount = bestRows.length;
+  const rowHeights = [];
+  for (const row of bestRows) {
+    const totalUnitW = row.reduce((s, relIdx) => s + itemWHRatios[relIdx], 0);
+    const netW = availW - (row.length - 1) * gap;
+    rowHeights.push(netW / totalUnitW);
+  }
+  const totalRowH = rowHeights.reduce((s, h) => s + h, 0) + (rowCount - 1) * gap;
+  const globalScale = Math.min(1, availH / totalRowH);
+  const scaledTotalH = rowHeights.reduce((s, h) => s + h * globalScale, 0) + (rowCount - 1) * gap;
+  const verticalOffset = (availH - scaledTotalH) / 2;
+  let currentTop = gap + verticalOffset;
+  for (let ri = 0; ri < rowCount; ri++) {
+    const row = bestRows[ri];
+    const finalRowH = rowHeights[ri] * globalScale;
+    const totalUnitW = row.reduce((s, relIdx) => s + itemWHRatios[relIdx], 0);
+    const netW = availW - (row.length - 1) * gap;
+    const itemWidths = row.map((relIdx) => itemWHRatios[relIdx] / totalUnitW * netW * globalScale);
+    const scaledRowW = itemWidths.reduce((s, w) => s + w, 0) + (row.length - 1) * gap;
+    const horizontalOffset = (availW - scaledRowW) / 2;
+    let currentLeft = gap + horizontalOffset;
+    for (let ci = 0; ci < row.length; ci++) {
+      posMap.set(row[ci], {
+        position: { top: currentTop, left: currentLeft },
+        dimensions: { width: itemWidths[ci], height: finalRowH }
+      });
+      currentLeft += itemWidths[ci] + gap;
+    }
+    currentTop += finalRowH + gap;
+  }
+  const getPosition = (index) => {
+    const relativeIndex = index - startIndex;
+    if (relativeIndex < 0 || relativeIndex >= effectiveCount) {
+      return { top: -9999, left: -9999 };
+    }
+    return posMap.get(relativeIndex)?.position ?? { top: -9999, left: -9999 };
+  };
+  const getItemDimensions = (index) => {
+    const relativeIndex = index - startIndex;
+    if (relativeIndex < 0 || relativeIndex >= effectiveCount) {
+      return { width: 0, height: 0 };
+    }
+    return posMap.get(relativeIndex)?.dimensions ?? { width: 0, height: 0 };
+  };
+  const lastVisibleIndex = endIndex - 1;
+  return {
+    width: availW,
+    height: availH,
+    rows: rowCount,
+    cols: rowCount > 0 ? Math.max(...bestRows.map((r) => r.length)) : 0,
+    layoutMode: "gallery",
+    getPosition,
+    getItemDimensions,
+    isMainItem: () => false,
+    pagination,
+    isItemVisible: (index) => index >= startIndex && index < endIndex,
+    hiddenCount,
+    getLastVisibleOthersIndex: () => hiddenCount > 0 ? lastVisibleIndex : -1,
+    getItemContentDimensions: createGetItemContentDimensions(
+      getItemDimensions,
+      itemAspectRatios,
+      aspectRatio
+    )
+  };
+}
+function createMeetGrid(options) {
+  const { layoutMode = "gallery", count } = options;
+  if (count === 0) {
+    return createEmptyMeetGridResult(layoutMode);
+  }
+  switch (layoutMode) {
+    case "spotlight":
+      return createSpotlightGrid(options);
+    case "gallery":
+    default: {
+      const { maxItemsPerPage, currentPage, pinnedIndex, maxVisible = 0 } = options;
+      if (pinnedIndex !== void 0 && pinnedIndex >= 0 && pinnedIndex < count) {
+        return createFlexiblePinGrid(options);
+      }
+      if (count === 2) {
+        const { width: W, height: H } = options.dimensions;
+        const mainWidth = W;
+        const mainHeight = H;
+        let floatW;
+        let floatH;
+        if (options.floatBreakpoints) {
+          const resolved = resolveFloatSize(W, options.floatBreakpoints);
+          floatW = options.floatWidth ?? resolved.width;
+          floatH = options.floatHeight ?? resolved.height;
+        } else {
+          const isMobileSize = W < 500;
+          floatW = options.floatWidth ?? (isMobileSize ? 130 : 180);
+          floatH = options.floatHeight ?? (isMobileSize ? 175 : 240);
+        }
+        const pagination2 = createDefaultPagination(2);
+        const getItemDimensions2 = (index) => index === 0 ? { width: mainWidth, height: mainHeight } : { width: floatW, height: floatH };
+        return {
+          width: mainWidth,
+          height: mainHeight,
+          rows: 1,
+          cols: 1,
+          layoutMode: "gallery",
+          getPosition: (index) => index === 0 ? { top: 0, left: 0 } : { top: -9999, left: -9999 },
+          getItemDimensions: getItemDimensions2,
+          isMainItem: (index) => index === 0,
+          pagination: pagination2,
+          isItemVisible: () => true,
+          hiddenCount: 0,
+          getLastVisibleOthersIndex: () => -1,
+          getItemContentDimensions: createGetItemContentDimensions(
+            getItemDimensions2,
+            options.itemAspectRatios,
+            options.aspectRatio
+          ),
+          floatIndex: 1,
+          floatDimensions: { width: floatW, height: floatH }
+        };
+      }
+      const isMobile = options.dimensions.width < 500;
+      if (isMobile && count > 1) {
+        const { width: cw, height: ch } = options.dimensions;
+        options = { ...options, aspectRatio: `${Math.round(cw)}:${Math.round(ch)}` };
+      }
+      if (options.itemAspectRatios && options.itemAspectRatios.length > 0) {
+        const ratios = /* @__PURE__ */ new Set();
+        for (const r of options.itemAspectRatios) {
+          ratios.add(r ?? options.aspectRatio);
+        }
+        if (ratios.size === 1) {
+          const sharedRatio = [...ratios][0];
+          if (sharedRatio !== options.aspectRatio) {
+            options = { ...options, aspectRatio: sharedRatio };
+          }
+        } else {
+          if (!isMobile) {
+            return createFlexibleGalleryGrid(options);
+          }
+        }
+      }
+      let visibleCount = count;
+      let hiddenCount = 0;
+      let startIndex = 0;
+      let endIndex = count;
+      if (maxItemsPerPage && maxItemsPerPage > 0) {
+        const pagination2 = createPaginationInfo(count, maxItemsPerPage, currentPage);
+        visibleCount = pagination2.itemsOnPage;
+        startIndex = pagination2.startIndex;
+        endIndex = pagination2.endIndex;
+      } else if (maxVisible > 0 && count > maxVisible) {
+        visibleCount = maxVisible;
+        hiddenCount = count - maxVisible + 1;
+        startIndex = 0;
+        endIndex = maxVisible;
+      }
+      const pagination = maxItemsPerPage && maxItemsPerPage > 0 ? createPaginationInfo(count, maxItemsPerPage, currentPage) : {
+        enabled: false,
+        currentPage: 0,
+        totalPages: 1,
+        itemsOnPage: visibleCount,
+        startIndex,
+        endIndex
+      };
+      const effectiveCount = visibleCount;
+      const grid = createGrid({ ...options, count: effectiveCount });
+      const getPosition = (index) => {
+        const relativeIndex = index - startIndex;
+        if (relativeIndex < 0 || relativeIndex >= effectiveCount) {
+          return { top: -9999, left: -9999 };
+        }
+        return grid.getPosition(relativeIndex);
+      };
+      const getItemDimensions = () => ({ width: grid.width, height: grid.height });
+      const lastVisibleIndex = endIndex - 1;
+      return {
+        ...grid,
+        layoutMode: "gallery",
+        getPosition,
+        getItemDimensions,
+        isMainItem: () => false,
+        pagination,
+        isItemVisible: (index) => index >= startIndex && index < endIndex,
+        hiddenCount,
+        getLastVisibleOthersIndex: () => hiddenCount > 0 ? lastVisibleIndex : -1,
+        getItemContentDimensions: createGetItemContentDimensions(
+          getItemDimensions,
+          options.itemAspectRatios,
+          options.aspectRatio
+        )
+      };
+    }
+  }
+}
+const springPresets = {
+  /** Snappy animations for UI interactions */
+  snappy: { stiffness: 400, damping: 30 },
+  /** Smooth animations for layout changes */
+  smooth: { stiffness: 300, damping: 30 },
+  /** Gentle animations for subtle effects */
+  gentle: { stiffness: 200, damping: 25 },
+  /** Bouncy animations for playful effects */
+  bouncy: { stiffness: 400, damping: 15 }
+};
+function getSpringConfig(preset = "smooth") {
+  return {
+    type: "spring",
+    ...springPresets[preset]
+  };
+}
+
+export { DEFAULT_FLOAT_BREAKPOINTS, calculateContentDimensions, createGrid, createGridItemPositioner, createMeetGrid, getAspectRatio, getGridItemDimensions, getSpringConfig, parseAspectRatio, resolveFloatSize, springPresets };