graphics-debug 0.0.58 → 0.0.59

package/README.md

@@ -214,7 +214,10 @@ Use `stackGraphicsHorizontally` or `stackGraphicsVertically` to place graphics n
 ```tsx
 import { stackGraphicsHorizontally, stackGraphicsVertically } from "graphics-debug"
 
-const sideBySide = stackGraphicsHorizontally([graphicsObjectA, graphicsObjectB])
+const sideBySide = stackGraphicsHorizontally([
+  graphicsObjectA,
+  graphicsObjectB,
+], { titles: ["A", "B"] })
 const stacked = stackGraphicsVertically([graphicsObjectA, graphicsObjectB])
 ```
 

package/dist/{chunk-SKWP646L.js → chunk-B2UEZWMC.js}

@@ -9,11 +9,12 @@ import {
 } from "./chunk-TJJMMKHI.js";
 
 // lib/stackGraphics.ts
-function stackGraphicsHorizontally(graphicsList) {
+function stackGraphicsHorizontally(graphicsList, opts = {}) {
   if (graphicsList.length === 0) return {};
   let giantG = graphicsList[0];
   let prevBounds = getBounds(giantG);
   const baseMinY = prevBounds.minY;
+  const boundsList = [prevBounds];
   for (let i = 1; i < graphicsList.length; i++) {
     const newG = graphicsList[i];
     const bounds = getBounds(newG);
@@ -25,6 +26,24 @@ function stackGraphicsHorizontally(graphicsList) {
     const shifted = translateGraphics(newG, dx, dy);
     giantG = mergeGraphics(giantG, shifted);
     prevBounds = getBounds(shifted);
+    boundsList.push(prevBounds);
+  }
+  if (opts.titles && opts.titles.length > 0) {
+    const overall = getBounds(giantG);
+    const totalWidth = overall.maxX - overall.minX;
+    const fontSize = totalWidth * 0.025;
+    const texts = opts.titles.slice(0, boundsList.length).map((title, idx) => {
+      const b = boundsList[idx];
+      const centerX = (b.minX + b.maxX) / 2;
+      return {
+        x: centerX,
+        y: b.maxY + fontSize,
+        text: title,
+        fontSize,
+        anchorSide: "bottom_center"
+      };
+    });
+    giantG = mergeGraphics(giantG, { texts });
   }
   return giantG;
 }
@@ -81,4 +100,4 @@ export {
   stackGraphicsVertically,
   createGraphicsGrid
 };
-//# sourceMappingURL=chunk-SKWP646L.js.map
+//# sourceMappingURL=chunk-B2UEZWMC.js.map

package/dist/chunk-B2UEZWMC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../lib/stackGraphics.ts"],"sourcesContent":["export {\n  stackGraphicsHorizontally,\n  stackGraphicsVertically,\n  createGraphicsGrid,\n}\nimport type { GraphicsObject } from \"./types\"\nimport { getBounds } from \"./drawGraphicsToCanvas\"\nimport { translateGraphics } from \"./translateGraphics\"\nimport { mergeGraphics } from \"./mergeGraphics\"\n\nfunction stackGraphicsHorizontally(\n  graphicsList: GraphicsObject[],\n  opts: { titles?: string[] } = {},\n): GraphicsObject {\n  if (graphicsList.length === 0) return {}\n  let giantG = graphicsList[0]\n  let prevBounds = getBounds(giantG)\n  const baseMinY = prevBounds.minY\n  const boundsList = [prevBounds]\n  for (let i = 1; i < graphicsList.length; i++) {\n    const newG = graphicsList[i]\n    const bounds = getBounds(newG)\n    const prevWidth = prevBounds.maxX - prevBounds.minX\n    const width = bounds.maxX - bounds.minX\n    const padding = (prevWidth + width) / 8\n    // Place the next graphic to the right of the previous one\n    const dx = prevBounds.maxX + padding - bounds.minX\n    const dy = baseMinY - bounds.minY\n    const shifted = translateGraphics(newG, dx, dy)\n    giantG = mergeGraphics(giantG, shifted)\n    prevBounds = getBounds(shifted)\n    boundsList.push(prevBounds)\n  }\n  if (opts.titles && opts.titles.length > 0) {\n    const overall = getBounds(giantG)\n    const totalWidth = overall.maxX - overall.minX\n    const fontSize = totalWidth * 0.025\n    const texts = opts.titles.slice(0, boundsList.length).map((title, idx) => {\n      const b = boundsList[idx]\n      const centerX = (b.minX + b.maxX) / 2\n      return {\n        x: centerX,\n        y: b.maxY + fontSize,\n        text: title,\n        fontSize,\n        anchorSide: \"bottom_center\" as const,\n      }\n    })\n    giantG = mergeGraphics(giantG, { texts })\n  }\n  return giantG\n}\n\nfunction stackGraphicsVertically(\n  graphicsList: GraphicsObject[],\n): GraphicsObject {\n  if (graphicsList.length === 0) return {}\n  let result = graphicsList[0]\n  let prevBounds = getBounds(result)\n  const baseMinX = prevBounds.minX\n  for (let i = 1; i < graphicsList.length; i++) {\n    const g = graphicsList[i]\n    const bounds = getBounds(g)\n    const prevHeight = prevBounds.maxY - prevBounds.minY\n    const height = bounds.maxY - bounds.minY\n    const padding = (prevHeight + height) / 8\n    const dx = baseMinX - bounds.minX\n    const dy = prevBounds.minY - padding - bounds.maxY\n    const shifted = translateGraphics(g, dx, dy)\n    result = mergeGraphics(result, shifted)\n    prevBounds = getBounds(shifted)\n  }\n  return result\n}\n\nfunction createGraphicsGrid(\n  graphicsRows: GraphicsObject[][],\n  opts: {\n    cellWidth?: number\n    cellHeight?: number\n    gap?: number\n    gapAsCellWidthFraction?: number\n  } = {},\n): GraphicsObject {\n  if (graphicsRows.length === 0 || graphicsRows[0].length === 0) return {}\n\n  let maxWidth = 0\n  let maxHeight = 0\n  for (const row of graphicsRows) {\n    for (const g of row) {\n      const b = getBounds(g)\n      maxWidth = Math.max(maxWidth, b.maxX - b.minX)\n      maxHeight = Math.max(maxHeight, b.maxY - b.minY)\n    }\n  }\n\n  const cellWidth = opts.cellWidth ?? maxWidth\n  const cellHeight = opts.cellHeight ?? maxHeight\n  const gap =\n    opts.gap ??\n    (opts.gapAsCellWidthFraction !== undefined\n      ? opts.gapAsCellWidthFraction * cellWidth\n      : 0)\n\n  let result: GraphicsObject | null = null\n\n  for (let r = 0; r < graphicsRows.length; r++) {\n    const row = graphicsRows[r]\n    for (let c = 0; c < row.length; c++) {\n      const g = row[c]\n      const b = getBounds(g)\n      const dx = c * (cellWidth + gap) - b.minX\n      const dy = -r * (cellHeight + gap) - b.minY\n      const shifted = translateGraphics(g, dx, dy)\n      result = result ? mergeGraphics(result, shifted) : shifted\n    }\n  }\n\n  return result ?? {}\n}\n"],"mappings":"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","names":[]}

package/dist/cli/cli.js

@@ -3,7 +3,7 @@ import {
   getHtmlFromLogString,
   getSvgsFromLogString
 } from "../chunk-KUBBJEL2.js";
-import "../chunk-SKWP646L.js";
+import "../chunk-B2UEZWMC.js";
 import "../chunk-K2IJQPPY.js";
 import "../chunk-ARYXS3GC.js";
 import {

package/dist/lib/index.js

@@ -7,7 +7,7 @@ import {
   createGraphicsGrid,
   stackGraphicsHorizontally,
   stackGraphicsVertically
-} from "../chunk-SKWP646L.js";
+} from "../chunk-B2UEZWMC.js";
 import {
   translateGraphics
 } from "../chunk-K2IJQPPY.js";

package/dist/lib/react.js

@@ -1,5 +1,5 @@
 import "../chunk-KUBBJEL2.js";
-import "../chunk-SKWP646L.js";
+import "../chunk-B2UEZWMC.js";
 import "../chunk-K2IJQPPY.js";
 import {
   defaultColors,

package/dist/lib/stackGraphics.d.ts

@@ -1,7 +1,9 @@
 import { GraphicsObject } from './types.js';
 import 'transformation-matrix';
 
-declare function stackGraphicsHorizontally(graphicsList: GraphicsObject[]): GraphicsObject;
+declare function stackGraphicsHorizontally(graphicsList: GraphicsObject[], opts?: {
+    titles?: string[];
+}): GraphicsObject;
 declare function stackGraphicsVertically(graphicsList: GraphicsObject[]): GraphicsObject;
 declare function createGraphicsGrid(graphicsRows: GraphicsObject[][], opts?: {
     cellWidth?: number;

package/dist/lib/stackGraphics.js

@@ -2,7 +2,7 @@ import {
   createGraphicsGrid,
   stackGraphicsHorizontally,
   stackGraphicsVertically
-} from "../chunk-SKWP646L.js";
+} from "../chunk-B2UEZWMC.js";
 import "../chunk-K2IJQPPY.js";
 import "../chunk-ARYXS3GC.js";
 import "../chunk-ZGI74PYD.js";

package/package.json

@@ -2,7 +2,7 @@
   "name": "graphics-debug",
   "main": "dist/lib/index.js",
   "type": "module",
-  "version": "0.0.58",
+  "version": "0.0.59",
   "files": [
     "dist"
   ],

package/dist/chunk-SKWP646L.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../lib/stackGraphics.ts"],"sourcesContent":["export {\n  stackGraphicsHorizontally,\n  stackGraphicsVertically,\n  createGraphicsGrid,\n}\nimport type { GraphicsObject } from \"./types\"\nimport { getBounds } from \"./drawGraphicsToCanvas\"\nimport { translateGraphics } from \"./translateGraphics\"\nimport { mergeGraphics } from \"./mergeGraphics\"\n\nfunction stackGraphicsHorizontally(\n  graphicsList: GraphicsObject[],\n): GraphicsObject {\n  if (graphicsList.length === 0) return {}\n  let giantG = graphicsList[0]\n  let prevBounds = getBounds(giantG)\n  const baseMinY = prevBounds.minY\n  for (let i = 1; i < graphicsList.length; i++) {\n    const newG = graphicsList[i]\n    const bounds = getBounds(newG)\n    const prevWidth = prevBounds.maxX - prevBounds.minX\n    const width = bounds.maxX - bounds.minX\n    const padding = (prevWidth + width) / 8\n    // Place the next graphic to the right of the previous one\n    const dx = prevBounds.maxX + padding - bounds.minX\n    const dy = baseMinY - bounds.minY\n    const shifted = translateGraphics(newG, dx, dy)\n    giantG = mergeGraphics(giantG, shifted)\n    prevBounds = getBounds(shifted)\n  }\n  return giantG\n}\n\nfunction stackGraphicsVertically(\n  graphicsList: GraphicsObject[],\n): GraphicsObject {\n  if (graphicsList.length === 0) return {}\n  let result = graphicsList[0]\n  let prevBounds = getBounds(result)\n  const baseMinX = prevBounds.minX\n  for (let i = 1; i < graphicsList.length; i++) {\n    const g = graphicsList[i]\n    const bounds = getBounds(g)\n    const prevHeight = prevBounds.maxY - prevBounds.minY\n    const height = bounds.maxY - bounds.minY\n    const padding = (prevHeight + height) / 8\n    const dx = baseMinX - bounds.minX\n    const dy = prevBounds.minY - padding - bounds.maxY\n    const shifted = translateGraphics(g, dx, dy)\n    result = mergeGraphics(result, shifted)\n    prevBounds = getBounds(shifted)\n  }\n  return result\n}\n\nfunction createGraphicsGrid(\n  graphicsRows: GraphicsObject[][],\n  opts: {\n    cellWidth?: number\n    cellHeight?: number\n    gap?: number\n    gapAsCellWidthFraction?: number\n  } = {},\n): GraphicsObject {\n  if (graphicsRows.length === 0 || graphicsRows[0].length === 0) return {}\n\n  let maxWidth = 0\n  let maxHeight = 0\n  for (const row of graphicsRows) {\n    for (const g of row) {\n      const b = getBounds(g)\n      maxWidth = Math.max(maxWidth, b.maxX - b.minX)\n      maxHeight = Math.max(maxHeight, b.maxY - b.minY)\n    }\n  }\n\n  const cellWidth = opts.cellWidth ?? maxWidth\n  const cellHeight = opts.cellHeight ?? maxHeight\n  const gap =\n    opts.gap ??\n    (opts.gapAsCellWidthFraction !== undefined\n      ? opts.gapAsCellWidthFraction * cellWidth\n      : 0)\n\n  let result: GraphicsObject | null = null\n\n  for (let r = 0; r < graphicsRows.length; r++) {\n    const row = graphicsRows[r]\n    for (let c = 0; c < row.length; c++) {\n      const g = row[c]\n      const b = getBounds(g)\n      const dx = c * (cellWidth + gap) - b.minX\n      const dy = -r * (cellHeight + gap) - b.minY\n      const shifted = translateGraphics(g, dx, dy)\n      result = result ? mergeGraphics(result, shifted) : shifted\n    }\n  }\n\n  return result ?? {}\n}\n"],"mappings":";;;;;;;;;;;AAUA,SAAS,0BACP,cACgB;AAChB,MAAI,aAAa,WAAW,EAAG,QAAO,CAAC;AACvC,MAAI,SAAS,aAAa,CAAC;AAC3B,MAAI,aAAa,UAAU,MAAM;AACjC,QAAM,WAAW,WAAW;AAC5B,WAAS,IAAI,GAAG,IAAI,aAAa,QAAQ,KAAK;AAC5C,UAAM,OAAO,aAAa,CAAC;AAC3B,UAAM,SAAS,UAAU,IAAI;AAC7B,UAAM,YAAY,WAAW,OAAO,WAAW;AAC/C,UAAM,QAAQ,OAAO,OAAO,OAAO;AACnC,UAAM,WAAW,YAAY,SAAS;AAEtC,UAAM,KAAK,WAAW,OAAO,UAAU,OAAO;AAC9C,UAAM,KAAK,WAAW,OAAO;AAC7B,UAAM,UAAU,kBAAkB,MAAM,IAAI,EAAE;AAC9C,aAAS,cAAc,QAAQ,OAAO;AACtC,iBAAa,UAAU,OAAO;AAAA,EAChC;AACA,SAAO;AACT;AAEA,SAAS,wBACP,cACgB;AAChB,MAAI,aAAa,WAAW,EAAG,QAAO,CAAC;AACvC,MAAI,SAAS,aAAa,CAAC;AAC3B,MAAI,aAAa,UAAU,MAAM;AACjC,QAAM,WAAW,WAAW;AAC5B,WAAS,IAAI,GAAG,IAAI,aAAa,QAAQ,KAAK;AAC5C,UAAM,IAAI,aAAa,CAAC;AACxB,UAAM,SAAS,UAAU,CAAC;AAC1B,UAAM,aAAa,WAAW,OAAO,WAAW;AAChD,UAAM,SAAS,OAAO,OAAO,OAAO;AACpC,UAAM,WAAW,aAAa,UAAU;AACxC,UAAM,KAAK,WAAW,OAAO;AAC7B,UAAM,KAAK,WAAW,OAAO,UAAU,OAAO;AAC9C,UAAM,UAAU,kBAAkB,GAAG,IAAI,EAAE;AAC3C,aAAS,cAAc,QAAQ,OAAO;AACtC,iBAAa,UAAU,OAAO;AAAA,EAChC;AACA,SAAO;AACT;AAEA,SAAS,mBACP,cACA,OAKI,CAAC,GACW;AAChB,MAAI,aAAa,WAAW,KAAK,aAAa,CAAC,EAAE,WAAW,EAAG,QAAO,CAAC;AAEvE,MAAI,WAAW;AACf,MAAI,YAAY;AAChB,aAAW,OAAO,cAAc;AAC9B,eAAW,KAAK,KAAK;AACnB,YAAM,IAAI,UAAU,CAAC;AACrB,iBAAW,KAAK,IAAI,UAAU,EAAE,OAAO,EAAE,IAAI;AAC7C,kBAAY,KAAK,IAAI,WAAW,EAAE,OAAO,EAAE,IAAI;AAAA,IACjD;AAAA,EACF;AAEA,QAAM,YAAY,KAAK,aAAa;AACpC,QAAM,aAAa,KAAK,cAAc;AACtC,QAAM,MACJ,KAAK,QACJ,KAAK,2BAA2B,SAC7B,KAAK,yBAAyB,YAC9B;AAEN,MAAI,SAAgC;AAEpC,WAAS,IAAI,GAAG,IAAI,aAAa,QAAQ,KAAK;AAC5C,UAAM,MAAM,aAAa,CAAC;AAC1B,aAAS,IAAI,GAAG,IAAI,IAAI,QAAQ,KAAK;AACnC,YAAM,IAAI,IAAI,CAAC;AACf,YAAM,IAAI,UAAU,CAAC;AACrB,YAAM,KAAK,KAAK,YAAY,OAAO,EAAE;AACrC,YAAM,KAAK,CAAC,KAAK,aAAa,OAAO,EAAE;AACvC,YAAM,UAAU,kBAAkB,GAAG,IAAI,EAAE;AAC3C,eAAS,SAAS,cAAc,QAAQ,OAAO,IAAI;AAAA,IACrD;AAAA,EACF;AAEA,SAAO,UAAU,CAAC;AACpB;","names":[]}