git-hash-art 0.13.0 → 0.14.0

package/CHANGELOG.md

@@ -4,10 +4,18 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+#### [0.14.0](https://github.com/gfargo/git-hash-art/compare/0.13.0...0.14.0)
+
+- feat: Custom shapes API + remove portal/cutout feature [`#24`](https://github.com/gfargo/git-hash-art/pull/24)
+- feat: add custom shapes API, remove portal/cutout feature [`68d1d5e`](https://github.com/gfargo/git-hash-art/commit/68d1d5eb05c09e4459153b277cf07f325fe27b1a)
+
 #### [0.13.0](https://github.com/gfargo/git-hash-art/compare/0.12.0...0.13.0)
 
+> 20 March 2026
+
 - perf: 33-111× pipeline speedup via phase-level profiling [`#23`](https://github.com/gfargo/git-hash-art/pull/23)
 - perf: 33-111× speedup via phase-level profiling and targeted optimizations [`90ed5f5`](https://github.com/gfargo/git-hash-art/commit/90ed5f567bb57a507f11b836156bf8828a946013)
+- chore: release v0.13.0 [`79ae33e`](https://github.com/gfargo/git-hash-art/commit/79ae33e6645ab25c144558dd1fe601bd33b96d32)
 
 #### [0.12.0](https://github.com/gfargo/git-hash-art/compare/0.11.0...0.12.0)
 

package/dist/browser.js

@@ -2072,14 +2072,15 @@ function $e0f99502ff383dd8$export$909ab0580e273f19(style) {
     }
 }
 function $e0f99502ff383dd8$export$71b514a25c47df50(ctx, shape, x, y, config) {
-    const { fillColor: fillColor, strokeColor: strokeColor, strokeWidth: strokeWidth, size: size, rotation: rotation } = config;
+    const { fillColor: fillColor, strokeColor: strokeColor, strokeWidth: strokeWidth, size: size, rotation: rotation, activeShapes: activeShapes } = config;
     ctx.save();
     ctx.translate(x, y);
     ctx.rotate(rotation * Math.PI / 180);
     ctx.fillStyle = fillColor;
     ctx.strokeStyle = strokeColor;
     ctx.lineWidth = strokeWidth;
-    const drawFunction = (0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5)[shape];
+    const registry = activeShapes ?? (0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5);
+    const drawFunction = registry[shape];
     if (drawFunction) {
         drawFunction(ctx, size);
         ctx.fill();
@@ -2589,7 +2590,8 @@ function $e0f99502ff383dd8$export$bb35a6995ddbf32d(ctx, shape, x, y, config) {
     } else ctx.fillStyle = fillColor;
     ctx.strokeStyle = strokeColor;
     ctx.lineWidth = strokeWidth;
-    const drawFunction = (0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5)[shape];
+    const registry = config.activeShapes ?? (0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5);
+    const drawFunction = registry[shape];
     if (drawFunction) {
         drawFunction(ctx, size, {
             rng: rng
@@ -3453,6 +3455,26 @@ const $8286059160ee2e04$export$4343b39fe47bd82c = {
         ]
     }
 };
+function $8286059160ee2e04$export$90912290d628650f(name, partial) {
+    $8286059160ee2e04$export$4343b39fe47bd82c[name] = {
+        tier: partial?.tier ?? 2,
+        minSizeFraction: partial?.minSizeFraction ?? 0.05,
+        maxSizeFraction: partial?.maxSizeFraction ?? 1.0,
+        affinities: partial?.affinities ?? [
+            "circle",
+            "square"
+        ],
+        category: "procedural",
+        heroCandidate: partial?.heroCandidate ?? false,
+        bestStyles: partial?.bestStyles ?? [
+            "fill-and-stroke",
+            "watercolor"
+        ]
+    };
+}
+function $8286059160ee2e04$export$f4ca68bd046f15ae(name) {
+    delete $8286059160ee2e04$export$4343b39fe47bd82c[name];
+}
 function $8286059160ee2e04$export$4a95df8944b5033b(rng, shapeNames, archetypeName) {
     const available = shapeNames.filter((s)=>$8286059160ee2e04$export$4343b39fe47bd82c[s]);
     // Pick a seed shape — tier 1 shapes that are hero candidates
@@ -3642,7 +3664,14 @@ function $8286059160ee2e04$export$ab873bb6fb56c1a8(shapeName, layerStyle, rng) {
 
 
 /**
- * Configuration options for image generation.
+ * Draw function signature for custom shapes.
+ * The function should build a canvas path (moveTo/lineTo/arc/etc.)
+ * centered at the origin. The pipeline handles translate, rotate,
+ * fill, and stroke — your function just defines the geometry.
+ *
+ * @param ctx  - Canvas 2D rendering context (already translated to shape center)
+ * @param size - Bounding size in pixels
+ * @param rng  - Deterministic RNG seeded from the git hash — use this instead of Math.random()
  */ const $81c1b644006d48ec$export$c2f8e0cc249a8d8f = {
     width: 2048,
     height: 2048,
@@ -4611,7 +4640,39 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
     // ── 0b. Color hierarchy — dominant/secondary/accent weighting ──
     const colorHierarchy = (0, $b5a262d09b87e373$export$fabac4600b87056)(colors, rng);
     // ── 0c. Shape palette — curated shapes that work well together ──
-    const shapeNames = Object.keys((0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5));
+    // Merge custom shapes into a combined registry
+    const customShapeNames = [];
+    let activeShapes;
+    if (finalConfig.customShapes && Object.keys(finalConfig.customShapes).length > 0) {
+        activeShapes = {
+            ...(0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5)
+        };
+        for (const [name, def] of Object.entries(finalConfig.customShapes)){
+            // Wrap CustomDrawFunction (ctx, size, rng) into DrawFunction (ctx, size, config?)
+            const customDraw = def.draw;
+            activeShapes[name] = (ctx, size, config)=>{
+                customDraw(ctx, size, config?.rng ?? Math.random);
+            };
+            // Register profile for affinity system (inlined to avoid ESM interop issues)
+            (0, $8286059160ee2e04$export$4343b39fe47bd82c)[name] = {
+                tier: def.profile?.tier ?? 2,
+                minSizeFraction: def.profile?.minSizeFraction ?? 0.05,
+                maxSizeFraction: def.profile?.maxSizeFraction ?? 1.0,
+                affinities: def.profile?.affinities ?? [
+                    "circle",
+                    "square"
+                ],
+                category: "procedural",
+                heroCandidate: def.profile?.heroCandidate ?? false,
+                bestStyles: def.profile?.bestStyles ?? [
+                    "fill-and-stroke",
+                    "watercolor"
+                ]
+            };
+            customShapeNames.push(name);
+        }
+    }
+    const shapeNames = Object.keys(activeShapes ?? (0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5));
     const shapePalette = (0, $8286059160ee2e04$export$4a95df8944b5033b)(rng, shapeNames, archetype.name);
     // ── 0d. Color grading — unified tone for the whole image ───────
     const colorGrade = (0, $b5a262d09b87e373$export$6d1620b367f86f7a)(rng);
@@ -4912,7 +4973,8 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
             renderStyle: heroStyle,
             rng: rng,
             lightAngle: lightAngle,
-            scaleFactor: scaleFactor
+            scaleFactor: scaleFactor,
+            activeShapes: activeShapes
         });
         heroCenter = {
             x: heroFocal.x,
@@ -5115,7 +5177,8 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
                 renderStyle: finalRenderStyle,
                 rng: rng,
                 lightAngle: lightAngle,
-                scaleFactor: scaleFactor
+                scaleFactor: scaleFactor,
+                activeShapes: activeShapes
             };
             if (shouldMirror) {
                 (0, $e0f99502ff383dd8$export$8bd8bbd1a8e53689)(ctx, shape, finalX, finalY, {
@@ -5146,7 +5209,8 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
                             rotation: rotation,
                             proportionType: "GOLDEN_RATIO",
                             renderStyle: "fill-only",
-                            rng: rng
+                            rng: rng,
+                            activeShapes: activeShapes
                         });
                     }
                     extrasSpent += glazePasses;
@@ -5186,7 +5250,8 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
                             rotation: rotation + (e + 1) * 15,
                             proportionType: "GOLDEN_RATIO",
                             renderStyle: finalRenderStyle,
-                            rng: rng
+                            rng: rng,
+                            activeShapes: activeShapes
                         });
                         shapePositions.push({
                             x: echoX,
@@ -5233,7 +5298,8 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
                         rotation: innerRot,
                         proportionType: "GOLDEN_RATIO",
                         renderStyle: innerStyle,
-                        rng: rng
+                        rng: rng,
+                        activeShapes: activeShapes
                     });
                     extrasSpent += $1f63dc64b5593c73$var$RENDER_STYLE_COST[innerStyle] ?? 1;
                 }
@@ -5280,7 +5346,8 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
                             rotation: member.rotation + groupRotation * 180 / Math.PI,
                             proportionType: "GOLDEN_RATIO",
                             renderStyle: memberStyle,
-                            rng: rng
+                            rng: rng,
+                            activeShapes: activeShapes
                         });
                         shapePositions.push({
                             x: mx,
@@ -5334,7 +5401,8 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
                             rotation: rotation + (r + 1) * 12,
                             proportionType: "GOLDEN_RATIO",
                             renderStyle: finalRenderStyle,
-                            rng: rng
+                            rng: rng,
+                            activeShapes: activeShapes
                         });
                         shapePositions.push({
                             x: rx,
@@ -5366,64 +5434,7 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
         _dt.extraCount = extrasSpent;
     }
     _mark("5_shape_layers");
-    // ── 5g. Layered masking / cutout portals ───────────────────────
-    // ~18% of images get 1-3 portal windows that paint over foreground
-    // with a tinted background wash, creating a "peek through" effect.
-    if (rng() < 0.18 && shapePositions.length > 3) {
-        const portalCount = 1 + Math.floor(rng() * 2);
-        for(let p = 0; p < portalCount; p++){
-            // Pick a position biased toward placed shapes
-            const sourceShape = shapePositions[Math.floor(rng() * shapePositions.length)];
-            const portalX = sourceShape.x + (rng() - 0.5) * sourceShape.size * 0.5;
-            const portalY = sourceShape.y + (rng() - 0.5) * sourceShape.size * 0.5;
-            const portalSize = adjustedMaxSize * (0.15 + rng() * 0.25);
-            // Pick a portal shape from the palette
-            const portalShape = (0, $8286059160ee2e04$export$3c37d9a045754d0e)(shapePalette, rng, portalSize / adjustedMaxSize);
-            const portalRotation = rng() * 360;
-            const portalAlpha = 0.6 + rng() * 0.35;
-            ctx.save();
-            ctx.translate(portalX, portalY);
-            ctx.rotate(portalRotation * Math.PI / 180);
-            // Step 1: Clip to the portal shape and fill with background wash
-            ctx.beginPath();
-            (0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5)[portalShape]?.(ctx, portalSize);
-            ctx.clip();
-            // Fill the clipped region with a radial gradient from background colors
-            const portalColor = (0, $b5a262d09b87e373$export$18a34c25ea7e724b)(bgStart, rng, 15, 0.1);
-            const portalGrad = ctx.createRadialGradient(0, 0, 0, 0, 0, portalSize);
-            portalGrad.addColorStop(0, portalColor);
-            portalGrad.addColorStop(1, bgEnd);
-            ctx.globalAlpha = portalAlpha;
-            ctx.fillStyle = portalGrad;
-            ctx.fillRect(-portalSize, -portalSize, portalSize * 2, portalSize * 2);
-            // Optional: subtle inner texture — a few tiny dots inside the portal
-            if (rng() < 0.5) {
-                const dotCount = 3 + Math.floor(rng() * 5);
-                ctx.globalAlpha = portalAlpha * 0.3;
-                ctx.fillStyle = (0, $b5a262d09b87e373$export$f2121afcad3d553f)((0, $b5a262d09b87e373$export$b49f62f0a99da0e8)(colorHierarchy, rng), 0.2);
-                for(let d = 0; d < dotCount; d++){
-                    const dx = (rng() - 0.5) * portalSize * 1.4;
-                    const dy = (rng() - 0.5) * portalSize * 1.4;
-                    const dr = (1 + rng() * 3) * scaleFactor;
-                    ctx.beginPath();
-                    ctx.arc(dx, dy, dr, 0, Math.PI * 2);
-                    ctx.fill();
-                }
-            }
-            ctx.restore();
-            // Step 2: Draw a border ring around the portal (outside the clip)
-            ctx.save();
-            ctx.translate(portalX, portalY);
-            ctx.rotate(portalRotation * Math.PI / 180);
-            ctx.globalAlpha = 0.15 + rng() * 0.2;
-            ctx.strokeStyle = (0, $b5a262d09b87e373$export$f2121afcad3d553f)((0, $b5a262d09b87e373$export$b49f62f0a99da0e8)(colorHierarchy, rng), 0.5);
-            ctx.lineWidth = (1.5 + rng() * 2.5) * scaleFactor;
-            ctx.beginPath();
-            (0, $e41b41d8dcf837ad$export$4ff7fc6f1af248b5)[portalShape]?.(ctx, portalSize * 1.06);
-            ctx.stroke();
-            ctx.restore();
-        }
-    }
+    // ── 5g. (Portal/cutout feature removed — replaced by custom shapes API) ──
     _mark("5g_portals");
     // ── 6. Flow-line pass — variable color, branching, pressure ────
     // Optimized: collect all segments into width-quantized buckets, then
@@ -6021,6 +6032,8 @@ function $1f63dc64b5593c73$export$29a844702096332e(ctx, gitHash, config = {}) {
     }
     ctx.globalAlpha = 1;
     _mark("11_signature");
+    // Clean up custom shape profiles to avoid leaking into subsequent renders
+    for (const name of customShapeNames)delete (0, $8286059160ee2e04$export$4343b39fe47bd82c)[name];
 }