Infinity Trace

1"use client";
2 
3import type { CSSProperties } from "react";
4 
5import { cx } from "@/components/ui/cellforge-core";
6import { resolveDmxColorTokens } from "@/components/ui/cellforge-core";
7import { useCellForgePhases } from "@/components/ui/cellforge-hooks";
8import { styleOpacity, stylePx } from "@/components/ui/cellforge-core";
9import { remapOpacityToTriplet } from "@/components/ui/cellforge-core";
10import { dmxBloomRootActive, dmxDotBloomParts } from "@/components/ui/cellforge-core";
11import { useCyclePhase } from "@/components/ui/cellforge-hooks";
12import { usePrefersReducedMotion } from "@/components/ui/cellforge-hooks";
13import type { CellForgeCommonProps } from "@/components/ui/cellforge-core";
14 
15export type CellAngle17Props = CellForgeCommonProps;
16 
17const MATRIX_SIZE = 7;
18const BASE_OPACITY = 0.06;
19const HIGH_OPACITY = 0.95;
20 
21const TRIANGLE_CELLS = new Set([
22  "1,3",
23  "2,2",
24  "2,4",
25  "3,1",
26  "3,3",
27  "3,5",
28  "4,0",
29  "4,2",
30  "4,4",
31  "4,6"
32]);
33 
34/**
35 * Visits every triangle cell once per lap: up the left rim to the apex, down the right rim,
36 * then cuts through (4,4) → center → (4,2) — reads as a crossing “∞” on the silhouette.
37 */
38const INFINITY_PATH: ReadonlyArray<readonly [number, number]> = [
39  [4, 0],
40  [3, 1],
41  [2, 2],
42  [1, 3],
43  [2, 4],
44  [3, 5],
45  [4, 6],
46  [4, 4],
47  [3, 3],
48  [4, 2]
49];
50 
51const PATH_LEN = INFINITY_PATH.length;
52const TRAIL_SPAN = 4.35;
53 
54function isWithinTriangleMask(row: number, col: number): boolean {
55  if (row < 0 || row >= MATRIX_SIZE || col < 0 || col >= MATRIX_SIZE) {
56    return false;
57  }
58 
59  return TRIANGLE_CELLS.has(`${row},${col}`);
60}
61 
62function pathIndex(row: number, col: number): number | null {
63  for (let i = 0; i < PATH_LEN; i += 1) {
64    const [pr, pc] = INFINITY_PATH[i]!;
65    if (pr === row && pc === col) {
66      return i;
67    }
68  }
69  return null;
70}
71 
72function modF(n: number, m: number): number {
73  return ((n % m) + m) % m;
74}
75 
76function behindAlongPath(s: number, i: number, L: number): number {
77  return modF(s - i, L);
78}
79 
80function smoothstep01(edge0: number, edge1: number, x: number): number {
81  if (edge1 <= edge0) {
82    return x >= edge1 ? 1 : 0;
83  }
84  const t = Math.max(0, Math.min(1, (x - edge0) / (edge1 - edge0)));
85  return t * t * (3 - 2 * t);
86}
87 
88function opacityForCell(row: number, col: number, phase: number): number {
89  const idx = pathIndex(row, col);
90  if (idx === null) {
91    return 0;
92  }
93 
94  const s = phase * PATH_LEN;
95  const d = behindAlongPath(s, idx, PATH_LEN);
96// … truncated