Petal Shimmer

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 { styleOpacity, stylePx } from "@/components/ui/cellforge-core";
8import { remapOpacityToTriplet } from "@/components/ui/cellforge-core";
9import { dmxBloomHaloSpreadClass, dmxBloomRootActive, dmxDotBloomParts } from "@/components/ui/cellforge-core";
10import { getPatternIndexes } from "@/components/ui/cellforge-core";
11import { useCellForgePhases } from "@/components/ui/cellforge-hooks";
12import { useCyclePhase } from "@/components/ui/cellforge-hooks";
13import { usePrefersReducedMotion } from "@/components/ui/cellforge-hooks";
14import type { CellForgeCommonProps } from "@/components/ui/cellforge-core";
15 
16export type CellLattice9Props = CellForgeCommonProps;
17 
18const ROW_COUNTS = [3, 4, 5, 4, 3] as const;
19const BASE_OPACITY = 0.15;
20const HIGH_OPACITY = 0.98;
21const HEX_ROW_PITCH_RATIO = Math.sqrt(3) / 2;
22 
23function hexPatternIndex(row: number, rowCount: number, col: number): number {
24  return row * ROW_COUNTS[2] + Math.floor((ROW_COUNTS[2] - rowCount) / 2) + col;
25}
26const PETAL_WIDTH = 0.42;
27 
28function clamp01(n: number | undefined) {
29  if (n == null || !Number.isFinite(n)) {
30    return;
31  }
32  return Math.min(1, Math.max(0, n));
33}
34 
35function pointForCell(row: number, col: number): { angle: number; radius: number } {
36  const count = ROW_COUNTS[row] ?? 1;
37  const x = col - (count - 1) / 2;
38  const y = (row - 2) * HEX_ROW_PITCH_RATIO;
39  return {
40    angle: Math.atan2(y, x),
41    radius: Math.sqrt(x * x + y * y)
42  };
43}
44 
45function angularDistance(a: number, b: number): number {
46  return Math.abs(Math.atan2(Math.sin(a - b), Math.cos(a - b)));
47}
48 
49function opacityForCell(row: number, col: number, phase: number): number {
50  const { angle, radius } = pointForCell(row, col);
51  if (radius < 0.1) {
52    return 0.42 + Math.sin(phase * Math.PI * 2) * 0.2;
53  }
54 
55  const rotation = phase * Math.PI * 2;
56  const petalA = Math.max(0, 1 - angularDistance(angle, rotation) / PETAL_WIDTH);
57  const petalB = Math.max(0, 1 - angularDistance(angle, rotation + Math.PI) / PETAL_WIDTH);
58  const crossA = Math.max(0, 1 - angularDistance(angle, rotation + Math.PI / 2) / 0.52) * 0.46;
59  const crossB = Math.max(0, 1 - angularDistance(angle, rotation + Math.PI * 1.5) / 0.52) * 0.46;
60  const ring = (0.5 + 0.5 * Math.sin(phase * Math.PI * 2 - radius * 2.7)) * (radius > 1.3 ? 0.22 : 0.1);
61// … truncated