react-grid-layout 1.5.3 → 2.0.0

package/dist/chunk-2KUHNJXF.mjs

@@ -0,0 +1,90 @@
+// src/core/calculate.ts
+function calcGridColWidth(positionParams) {
+  const { margin, containerPadding, containerWidth, cols } = positionParams;
+  return (containerWidth - margin[0] * (cols - 1) - containerPadding[0] * 2) / cols;
+}
+function calcGridItemWHPx(gridUnits, colOrRowSize, marginPx) {
+  if (!Number.isFinite(gridUnits)) return gridUnits;
+  return Math.round(
+    colOrRowSize * gridUnits + Math.max(0, gridUnits - 1) * marginPx
+  );
+}
+function calcGridItemPosition(positionParams, x, y, w, h, dragPosition, resizePosition) {
+  const { margin, containerPadding, rowHeight } = positionParams;
+  const colWidth = calcGridColWidth(positionParams);
+  let width;
+  let height;
+  let top;
+  let left;
+  if (resizePosition) {
+    width = Math.round(resizePosition.width);
+    height = Math.round(resizePosition.height);
+  } else {
+    width = calcGridItemWHPx(w, colWidth, margin[0]);
+    height = calcGridItemWHPx(h, rowHeight, margin[1]);
+  }
+  if (dragPosition) {
+    top = Math.round(dragPosition.top);
+    left = Math.round(dragPosition.left);
+  } else if (resizePosition) {
+    top = Math.round(resizePosition.top);
+    left = Math.round(resizePosition.left);
+  } else {
+    top = Math.round((rowHeight + margin[1]) * y + containerPadding[1]);
+    left = Math.round((colWidth + margin[0]) * x + containerPadding[0]);
+  }
+  return { top, left, width, height };
+}
+function calcXY(positionParams, top, left, w, h) {
+  const { margin, containerPadding, cols, rowHeight, maxRows } = positionParams;
+  const colWidth = calcGridColWidth(positionParams);
+  let x = Math.round((left - containerPadding[0]) / (colWidth + margin[0]));
+  let y = Math.round((top - containerPadding[1]) / (rowHeight + margin[1]));
+  x = clamp(x, 0, cols - w);
+  y = clamp(y, 0, maxRows - h);
+  return { x, y };
+}
+function calcWH(positionParams, width, height, x, y, handle) {
+  const { margin, maxRows, cols, rowHeight } = positionParams;
+  const colWidth = calcGridColWidth(positionParams);
+  const w = Math.round((width + margin[0]) / (colWidth + margin[0]));
+  const h = Math.round((height + margin[1]) / (rowHeight + margin[1]));
+  let _w = clamp(w, 0, cols - x);
+  let _h = clamp(h, 0, maxRows - y);
+  if (handle === "sw" || handle === "w" || handle === "nw") {
+    _w = clamp(w, 0, cols);
+  }
+  if (handle === "nw" || handle === "n" || handle === "ne") {
+    _h = clamp(h, 0, maxRows);
+  }
+  return { w: _w, h: _h };
+}
+function clamp(num, lowerBound, upperBound) {
+  return Math.max(Math.min(num, upperBound), lowerBound);
+}
+function calcGridCellDimensions(config) {
+  const {
+    width,
+    cols,
+    rowHeight,
+    margin = [10, 10],
+    containerPadding
+  } = config;
+  const padding = containerPadding ?? margin;
+  const cellWidth = (width - padding[0] * 2 - margin[0] * (cols - 1)) / cols;
+  const cellHeight = rowHeight;
+  return {
+    cellWidth,
+    cellHeight,
+    offsetX: padding[0],
+    offsetY: padding[1],
+    gapX: margin[0],
+    gapY: margin[1],
+    cols,
+    containerWidth: width
+  };
+}
+
+export { calcGridCellDimensions, calcGridColWidth, calcGridItemPosition, calcGridItemWHPx, calcWH, calcXY, clamp };
+//# sourceMappingURL=chunk-2KUHNJXF.mjs.map
+//# sourceMappingURL=chunk-2KUHNJXF.mjs.map

package/dist/chunk-2KUHNJXF.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/core/calculate.ts"],"names":[],"mappings":"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","file":"chunk-2KUHNJXF.mjs","sourcesContent":["/**\n * Grid calculation utilities.\n *\n * These functions convert between grid units and pixel positions.\n */\n\nimport type { Position, ResizeHandleAxis } from \"./types.js\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\n/**\n * Parameters needed for position calculations.\n */\nexport interface PositionParams {\n  readonly margin: readonly [number, number];\n  readonly containerPadding: readonly [number, number];\n  readonly containerWidth: number;\n  readonly cols: number;\n  readonly rowHeight: number;\n  readonly maxRows: number;\n}\n\n// ============================================================================\n// Grid Column/Row Calculations\n// ============================================================================\n\n/**\n * Calculate the width of a single grid column in pixels.\n *\n * @param positionParams - Grid parameters\n * @returns Column width in pixels\n */\nexport function calcGridColWidth(positionParams: PositionParams): number {\n  const { margin, containerPadding, containerWidth, cols } = positionParams;\n  return (\n    (containerWidth - margin[0] * (cols - 1) - containerPadding[0] * 2) / cols\n  );\n}\n\n/**\n * Calculate the pixel size for a grid unit dimension (width or height).\n *\n * Can be called as:\n * - calcGridItemWHPx(w, colWidth, margin[0]) for width\n * - calcGridItemWHPx(h, rowHeight, margin[1]) for height\n *\n * @param gridUnits - Size in grid units\n * @param colOrRowSize - Column width or row height in pixels\n * @param marginPx - Margin between items in pixels\n * @returns Size in pixels\n */\nexport function calcGridItemWHPx(\n  gridUnits: number,\n  colOrRowSize: number,\n  marginPx: number\n): number {\n  // 0 * Infinity === NaN, which causes problems with resize constraints\n  if (!Number.isFinite(gridUnits)) return gridUnits;\n  return Math.round(\n    colOrRowSize * gridUnits + Math.max(0, gridUnits - 1) * marginPx\n  );\n}\n\n// ============================================================================\n// Position Calculations\n// ============================================================================\n\n/**\n * Calculate pixel position for a grid item.\n *\n * Returns left, top, width, height in pixels.\n *\n * @param positionParams - Grid parameters\n * @param x - X coordinate in grid units\n * @param y - Y coordinate in grid units\n * @param w - Width in grid units\n * @param h - Height in grid units\n * @param dragPosition - If present, use exact left/top from drag callbacks\n * @param resizePosition - If present, use exact dimensions from resize callbacks\n * @returns Position in pixels\n */\nexport function calcGridItemPosition(\n  positionParams: PositionParams,\n  x: number,\n  y: number,\n  w: number,\n  h: number,\n  dragPosition?: { top: number; left: number } | null,\n  resizePosition?: {\n    top: number;\n    left: number;\n    height: number;\n    width: number;\n  } | null\n): Position {\n  const { margin, containerPadding, rowHeight } = positionParams;\n  const colWidth = calcGridColWidth(positionParams);\n\n  let width: number;\n  let height: number;\n  let top: number;\n  let left: number;\n\n  // If resizing, use the exact width and height from resize callbacks\n  if (resizePosition) {\n    width = Math.round(resizePosition.width);\n    height = Math.round(resizePosition.height);\n  } else {\n    // Calculate from grid units\n    width = calcGridItemWHPx(w, colWidth, margin[0]);\n    height = calcGridItemWHPx(h, rowHeight, margin[1]);\n  }\n\n  // If dragging, use the exact left/top from drag callbacks\n  if (dragPosition) {\n    top = Math.round(dragPosition.top);\n    left = Math.round(dragPosition.left);\n  } else if (resizePosition) {\n    // If resizing, use the exact left/top from resize position\n    top = Math.round(resizePosition.top);\n    left = Math.round(resizePosition.left);\n  } else {\n    // Calculate from grid units\n    top = Math.round((rowHeight + margin[1]) * y + containerPadding[1]);\n    left = Math.round((colWidth + margin[0]) * x + containerPadding[0]);\n  }\n\n  return { top, left, width, height };\n}\n\n/**\n * Translate pixel coordinates to grid units.\n *\n * @param positionParams - Grid parameters\n * @param top - Top position in pixels (relative to parent)\n * @param left - Left position in pixels (relative to parent)\n * @param w - Width in grid units (for clamping)\n * @param h - Height in grid units (for clamping)\n * @returns x and y in grid units\n */\nexport function calcXY(\n  positionParams: PositionParams,\n  top: number,\n  left: number,\n  w: number,\n  h: number\n): { x: number; y: number } {\n  const { margin, containerPadding, cols, rowHeight, maxRows } = positionParams;\n  const colWidth = calcGridColWidth(positionParams);\n\n  // left = containerPaddingX + x * (colWidth + marginX)\n  // x = (left - containerPaddingX) / (colWidth + marginX)\n  let x = Math.round((left - containerPadding[0]) / (colWidth + margin[0]));\n  let y = Math.round((top - containerPadding[1]) / (rowHeight + margin[1]));\n\n  // Clamp to grid bounds\n  x = clamp(x, 0, cols - w);\n  y = clamp(y, 0, maxRows - h);\n\n  return { x, y };\n}\n\n/**\n * Calculate grid units from pixel dimensions.\n *\n * @param positionParams - Grid parameters\n * @param width - Width in pixels\n * @param height - Height in pixels\n * @param x - X coordinate in grid units (for clamping)\n * @param y - Y coordinate in grid units (for clamping)\n * @param handle - Resize handle being used\n * @returns w, h in grid units\n */\nexport function calcWH(\n  positionParams: PositionParams,\n  width: number,\n  height: number,\n  x: number,\n  y: number,\n  handle: ResizeHandleAxis\n): { w: number; h: number } {\n  const { margin, maxRows, cols, rowHeight } = positionParams;\n  const colWidth = calcGridColWidth(positionParams);\n\n  // width = colWidth * w - (margin * (w - 1))\n  // w = (width + margin) / (colWidth + margin)\n  const w = Math.round((width + margin[0]) / (colWidth + margin[0]));\n  const h = Math.round((height + margin[1]) / (rowHeight + margin[1]));\n\n  // Clamp based on resize handle direction\n  let _w = clamp(w, 0, cols - x);\n  let _h = clamp(h, 0, maxRows - y);\n\n  // West handles can resize to full width\n  if (handle === \"sw\" || handle === \"w\" || handle === \"nw\") {\n    _w = clamp(w, 0, cols);\n  }\n\n  // North handles can resize to full height\n  if (handle === \"nw\" || handle === \"n\" || handle === \"ne\") {\n    _h = clamp(h, 0, maxRows);\n  }\n\n  return { w: _w, h: _h };\n}\n\n// ============================================================================\n// Utility Functions\n// ============================================================================\n\n/**\n * Clamp a number between bounds.\n *\n * @param num - Number to clamp\n * @param lowerBound - Minimum value\n * @param upperBound - Maximum value\n * @returns Clamped value\n */\nexport function clamp(\n  num: number,\n  lowerBound: number,\n  upperBound: number\n): number {\n  return Math.max(Math.min(num, upperBound), lowerBound);\n}\n\n// ============================================================================\n// Grid Background Calculations\n// ============================================================================\n\n/**\n * Grid cell dimension information for rendering backgrounds or overlays.\n */\nexport interface GridCellDimensions {\n  /** Width of a single cell in pixels */\n  readonly cellWidth: number;\n  /** Height of a single cell in pixels */\n  readonly cellHeight: number;\n  /** Horizontal offset from container edge to first cell */\n  readonly offsetX: number;\n  /** Vertical offset from container edge to first cell */\n  readonly offsetY: number;\n  /** Horizontal gap between cells */\n  readonly gapX: number;\n  /** Vertical gap between cells */\n  readonly gapY: number;\n  /** Number of columns */\n  readonly cols: number;\n  /** Total container width */\n  readonly containerWidth: number;\n}\n\n/**\n * Configuration for grid cell dimension calculation.\n */\nexport interface GridCellConfig {\n  /** Container width in pixels */\n  width: number;\n  /** Number of columns */\n  cols: number;\n  /** Row height in pixels */\n  rowHeight: number;\n  /** Margin between items [x, y] */\n  margin?: readonly [number, number];\n  /** Container padding [x, y], defaults to margin if not specified */\n  containerPadding?: readonly [number, number] | null;\n}\n\n/**\n * Calculate grid cell dimensions for rendering backgrounds or overlays.\n *\n * This function provides all the measurements needed to render a visual\n * grid background that aligns with the actual grid cells.\n *\n * @param config - Grid configuration\n * @returns Cell dimensions and offsets\n *\n * @example\n * ```tsx\n * import { calcGridCellDimensions } from 'react-grid-layout/core';\n *\n * const dims = calcGridCellDimensions({\n *   width: 1200,\n *   cols: 12,\n *   rowHeight: 30,\n *   margin: [10, 10],\n *   containerPadding: [10, 10]\n * });\n *\n * // dims.cellWidth = 88.33...\n * // dims.cellHeight = 30\n * // dims.offsetX = 10 (containerPadding[0])\n * // dims.offsetY = 10 (containerPadding[1])\n * // dims.gapX = 10 (margin[0])\n * // dims.gapY = 10 (margin[1])\n * ```\n */\nexport function calcGridCellDimensions(\n  config: GridCellConfig\n): GridCellDimensions {\n  const {\n    width,\n    cols,\n    rowHeight,\n    margin = [10, 10],\n    containerPadding\n  } = config;\n\n  // Container padding defaults to margin if not specified\n  const padding = containerPadding ?? margin;\n\n  // Calculate cell width: total width minus padding and gaps, divided by columns\n  // Formula: width = 2*padding + cols*cellWidth + (cols-1)*gap\n  // Solving for cellWidth: cellWidth = (width - 2*padding - (cols-1)*gap) / cols\n  const cellWidth = (width - padding[0] * 2 - margin[0] * (cols - 1)) / cols;\n  const cellHeight = rowHeight;\n\n  return {\n    cellWidth,\n    cellHeight,\n    offsetX: padding[0],\n    offsetY: padding[1],\n    gapX: margin[0],\n    gapY: margin[1],\n    cols,\n    containerWidth: width\n  };\n}\n"]}