@thewaver/ss-components 0.0.1 → 0.0.2

package/dist/Exotics/Satellite/Satellite.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Satellite.js","names":["ParentProps","Show","createMemo","createSignal","CSSUtils","Point2d","StringUtils","AnchorPlacement","ElementObserver","access","SatelliteProps","SatelliteUtils","styles","DEFAULT_SATELLITE_PLACEMENT","x","y","DEFAULT_SATELLITE_OFFSET","SUBJECT_Z_INDEX","RAISED_SUBJECT_Z_INDEX","Satellite","props","getSubjectRef","setSubjectRef","HTMLElement","getSatelliteRef","setSatelliteRef","getSubjectSize","createBorderBoxSizeObserver","getSatelliteSize","getPlacement","placement","getOffset","offset","getLayout","computeLayout","_$createComponent","when","renderSatellite","fallback","children","_el$","_tmpl$","_el$2","firstChild","_el$3","nextSibling","_$className","satelliteRoot","_$use","satelliteSubject","_$insert","satelliteBody","_$effect","_p$","_v$","spreadableToStyle","padding","camelToKebabCase","_v$2","isBehindSubject","_v$3","satelliteOffset","_v$4","e","_$style","t","_$setStyleProperty","a","o","undefined"],"sources":["../../../src/Exotics/Satellite/Satellite.tsx"],"sourcesContent":["import type { ParentProps } from \"solid-js\";\nimport { Show, createMemo, createSignal } from \"solid-js\";\n\nimport { CSSUtils, type Point2d, StringUtils } from \"@thewaver/ss-utils\";\n\nimport type { AnchorPlacement } from \"../../Abstracts/Anchor/Anchor.types\";\nimport { ElementObserver } from \"../../Abstracts/ElementObserver/ElementObserver\";\nimport { access } from \"../../Utils/propUtils\";\nimport type { SatelliteProps } from \"./Satellite.types\";\nimport { SatelliteUtils } from \"./Satellite.utils\";\n\nimport * as styles from \"./Satellite.css\";\n\nconst DEFAULT_SATELLITE_PLACEMENT: AnchorPlacement = { x: \"center\", y: \"center\" };\nconst DEFAULT_SATELLITE_OFFSET: Point2d = { x: 0, y: 0 };\nconst SUBJECT_Z_INDEX = 0;\nconst RAISED_SUBJECT_Z_INDEX = 1;\n\nexport const Satellite = (props: ParentProps<SatelliteProps>) => {\n    const [getSubjectRef, setSubjectRef] = createSignal<HTMLElement>();\n    const [getSatelliteRef, setSatelliteRef] = createSignal<HTMLElement>();\n\n    const getSubjectSize = ElementObserver.createBorderBoxSizeObserver(getSubjectRef);\n\n    const getSatelliteSize = ElementObserver.createBorderBoxSizeObserver(getSatelliteRef);\n\n    const getPlacement = createMemo(() => access(props.placement) ?? DEFAULT_SATELLITE_PLACEMENT);\n\n    const getOffset = createMemo(() => access(props.offset) ?? DEFAULT_SATELLITE_OFFSET);\n\n    const getLayout = createMemo(() =>\n        SatelliteUtils.computeLayout(getSubjectSize(), getSatelliteSize(), getPlacement(), getOffset()),\n    );\n\n    return (\n        <Show when={props.renderSatellite} fallback={props.children}>\n            <div\n                class={styles.satelliteRoot}\n                style={CSSUtils.spreadableToStyle(getLayout().padding, StringUtils.camelToKebabCase)}\n            >\n                <div\n                    ref={setSubjectRef}\n                    class={styles.satelliteSubject}\n                    style={{\n                        \"z-index\": access(props.isBehindSubject) ? RAISED_SUBJECT_Z_INDEX : SUBJECT_Z_INDEX,\n                    }}\n                >\n                    {props.children}\n                </div>\n\n                <div\n                    ref={setSatelliteRef}\n                    class={styles.satelliteBody}\n                    style={{\n                        left: `${getLayout().satelliteOffset.x}px`,\n                        top: `${getLayout().satelliteOffset.y}px`,\n                    }}\n                >\n                    {props.renderSatellite?.()}\n                </div>\n            </div>\n        </Show>\n    );\n};\n"],"mappings":";;;;;;;;;AAaA,IAAMa,8BAA+C;CAAEC,GAAG;CAAUC,GAAG;AAAS;AAChF,IAAMC,2BAAoC;CAAEF,GAAG;CAAGC,GAAG;AAAE;AACvD,IAAME,kBAAkB;AACxB,IAAMC,yBAAyB;AAE/B,IAAaC,aAAaC,UAAuC;CAC7D,MAAM,CAACC,eAAeC,iBAAiBnB,aAA0B;CACjE,MAAM,CAACqB,iBAAiBC,mBAAmBtB,aAA0B;CAErE,MAAMuB,iBAAiBlB,gBAAgBmB,4BAA4BN,aAAa;CAEhF,MAAMO,mBAAmBpB,gBAAgBmB,4BAA4BH,eAAe;CAEpF,MAAMK,eAAe3B,iBAAiBO,OAAOW,MAAMU,SAAS,KAAKjB,2BAA2B;CAE5F,MAAMkB,YAAY7B,iBAAiBO,OAAOW,MAAMY,MAAM,KAAKhB,wBAAwB;CAEnF,MAAMiB,YAAY/B,iBACdS,eAAeuB,cAAcR,eAAe,GAAGE,iBAAiB,GAAGC,aAAa,GAAGE,UAAU,CAAC,CAClG;CAEA,OAAAI,gBACKlC,MAAI;EAAA,IAACmC,OAAI;GAAA,OAAEhB,MAAMiB;EAAe;EAAA,IAAEC,WAAQ;GAAA,OAAElB,MAAMmB;EAAQ;EAAA,IAAAA,WAAA;GAAA,IAAAC,OAAAC,OAAA,GAAAC,QAAAF,KAAAG,YAAAC,QAAAF,MAAAG;GAAAC,UAAAN,MAE5C5B,aAAoB;GAAAoC,IAIlB1B,eAAaoB,KAAA;GAAAI,UAAAJ,OACX9B,gBAAuB;GAAAsC,OAAAR,aAK7BtB,MAAMmB,QAAQ;GAAAS,IAIVvB,iBAAemB,KAAA;GAAAE,UAAAF,OACbhC,aAAoB;GAAAsC,OAAAN,aAM1BxB,MAAMiB,kBAAkB,CAAC;GAAAe,QAAAC,QAAA;IAAA,IAAAC,MApBvBlD,SAASmD,kBAAkBtB,UAAU,CAAC,CAACuB,SAASlD,YAAYmD,gBAAgB,GAACC,OAMjEjD,OAAOW,MAAMuC,eAAe,IAAIzC,yBAAyBD,iBAAe2C,OAU7E,GAAG3B,UAAU,CAAC,CAAC4B,gBAAgB/C,EAAC,KAAIgD,OACrC,GAAG7B,UAAU,CAAC,CAAC4B,gBAAgB9C,EAAC;IAAIsC,IAAAU,IAAAC,MAAAxB,MAAAc,KAAAD,IAAAU,CAAA;IAAAL,SAAAL,IAAAY,KAAAC,iBAAAxB,OAAA,WAAAW,IAAAY,IAAAP,IAAA;IAAAE,SAAAP,IAAAc,KAAAD,iBAAAtB,OAAA,QAAAS,IAAAc,IAAAP,IAAA;IAAAE,SAAAT,IAAAe,KAAAF,iBAAAtB,OAAA,OAAAS,IAAAe,IAAAN,IAAA;IAAA,OAAAT;GAAA,GAAA;IAAAU,GAAAM,KAAAA;IAAAJ,GAAAI,KAAAA;IAAAF,GAAAE,KAAAA;IAAAD,GAAAC,KAAAA;GAAA,CAAA;GAAA,OAAA7B;EAAA;CAAA,CAAA;AAQjE"}

package/dist/Exotics/Satellite/Satellite.utils.js

@@ -0,0 +1,33 @@
+import { AnchorUtils } from "../../Abstracts/Anchor/Anchor.utils.js";
+//#region src/Exotics/Satellite/Satellite.utils.ts
+var SatelliteUtils;
+(function(_SatelliteUtils) {
+	_SatelliteUtils.computeLayout = (subjectSize, satelliteSize, placement, offset) => {
+		const subjectRect = {
+			x: 0,
+			y: 0,
+			width: subjectSize.width,
+			height: subjectSize.height
+		};
+		const shift = {
+			x: AnchorUtils.getHPlacementShift(placement.x, subjectRect, satelliteSize) + offset.x,
+			y: AnchorUtils.getVPlacementShift(placement.y, subjectRect, satelliteSize) + offset.y
+		};
+		return {
+			padding: {
+				paddingLeft: Math.max(0, -shift.x),
+				paddingTop: Math.max(0, -shift.y),
+				paddingRight: Math.max(0, shift.x + satelliteSize.width - subjectSize.width),
+				paddingBottom: Math.max(0, shift.y + satelliteSize.height - subjectSize.height)
+			},
+			satelliteOffset: {
+				x: Math.max(0, shift.x),
+				y: Math.max(0, shift.y)
+			}
+		};
+	};
+})(SatelliteUtils || (SatelliteUtils = {}));
+//#endregion
+export { SatelliteUtils };
+
+//# sourceMappingURL=Satellite.utils.js.map

package/dist/Exotics/Satellite/Satellite.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Satellite.utils.js","names":[],"sources":["../../../src/Exotics/Satellite/Satellite.utils.ts"],"sourcesContent":["import type { Point2d, Rect, Size2d } from \"@thewaver/ss-utils\";\n\nimport type { AnchorPlacement } from \"../../Abstracts/Anchor/Anchor.types\";\nimport { AnchorUtils } from \"../../Abstracts/Anchor/Anchor.utils\";\nimport type { SatelliteLayout } from \"./Satellite.types\";\n\nexport namespace SatelliteUtils {\n    export const computeLayout = (\n        subjectSize: Size2d,\n        satelliteSize: Size2d,\n        placement: AnchorPlacement,\n        offset: Point2d,\n    ): SatelliteLayout => {\n        const subjectRect: Rect = { x: 0, y: 0, width: subjectSize.width, height: subjectSize.height };\n        const shift: Point2d = {\n            x: AnchorUtils.getHPlacementShift(placement.x, subjectRect, satelliteSize) + offset.x,\n            y: AnchorUtils.getVPlacementShift(placement.y, subjectRect, satelliteSize) + offset.y,\n        };\n\n        return {\n            padding: {\n                paddingLeft: Math.max(0, -shift.x),\n                paddingTop: Math.max(0, -shift.y),\n                paddingRight: Math.max(0, shift.x + satelliteSize.width - subjectSize.width),\n                paddingBottom: Math.max(0, shift.y + satelliteSize.height - subjectSize.height),\n            },\n            satelliteOffset: {\n                x: Math.max(0, shift.x),\n                y: Math.max(0, shift.y),\n            },\n        };\n    };\n}\n"],"mappings":";;AAMO,IAAU;CAAV,SAAA,iBAAA;CACU,gBAAA,iBACT,aACA,eACA,WACA,WACkB;EAClB,MAAM,cAAoB;GAAE,GAAG;GAAG,GAAG;GAAG,OAAO,YAAY;GAAO,QAAQ,YAAY;EAAO;EAC7F,MAAM,QAAiB;GACnB,GAAG,YAAY,mBAAmB,UAAU,GAAG,aAAa,aAAa,IAAI,OAAO;GACpF,GAAG,YAAY,mBAAmB,UAAU,GAAG,aAAa,aAAa,IAAI,OAAO;EACxF;EAEA,OAAO;GACH,SAAS;IACL,aAAa,KAAK,IAAI,GAAG,CAAC,MAAM,CAAC;IACjC,YAAY,KAAK,IAAI,GAAG,CAAC,MAAM,CAAC;IAChC,cAAc,KAAK,IAAI,GAAG,MAAM,IAAI,cAAc,QAAQ,YAAY,KAAK;IAC3E,eAAe,KAAK,IAAI,GAAG,MAAM,IAAI,cAAc,SAAS,YAAY,MAAM;GAClF;GACA,iBAAiB;IACb,GAAG,KAAK,IAAI,GAAG,MAAM,CAAC;IACtB,GAAG,KAAK,IAAI,GAAG,MAAM,CAAC;GAC1B;EACJ;CACJ;AACH,EAAA,CAAA,mBAAA,iBAAA,CAAA,EAAD"}

package/dist/Exotics/ScanlineAnimation/ScanlineAnimation.js

@@ -0,0 +1,19 @@
+import { access } from "../../Utils/propUtils.js";
+import { CellAnimation } from "../CellAnimation/CellAnimation.js";
+import { splitProps } from "solid-js";
+import { createComponent, mergeProps } from "solid-js/web";
+//#region src/Exotics/ScanlineAnimation/ScanlineAnimation.tsx
+var ScanlineAnimation = (props) => {
+	const [local, otherProps] = splitProps(props, ["lineCount", "computeScanlineAnimation"]);
+	return createComponent(CellAnimation, mergeProps(otherProps, {
+		cellCount: () => ({
+			x: 1,
+			y: access(local.lineCount)
+		}),
+		computeCellAnimation: (defs, timeline) => local.computeScanlineAnimation(defs, timeline)
+	}));
+};
+//#endregion
+export { ScanlineAnimation };
+
+//# sourceMappingURL=ScanlineAnimation.js.map

package/dist/Exotics/ScanlineAnimation/ScanlineAnimation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScanlineAnimation.js","names":["splitProps","access","CellAnimation","ScanlineAnimationProps","ScanlineAnimation","props","local","otherProps","_$createComponent","_$mergeProps","cellCount","x","y","lineCount","computeCellAnimation","defs","timeline","computeScanlineAnimation"],"sources":["../../../src/Exotics/ScanlineAnimation/ScanlineAnimation.tsx"],"sourcesContent":["import { splitProps } from \"solid-js\";\n\nimport { access } from \"../../Utils/propUtils\";\nimport { CellAnimation } from \"../CellAnimation/CellAnimation\";\nimport type { ScanlineAnimationProps } from \"./ScanlineAnimation.types\";\n\nexport const ScanlineAnimation = (props: ScanlineAnimationProps) => {\n    const [local, otherProps] = splitProps(props, [\"lineCount\", \"computeScanlineAnimation\"]);\n\n    return (\n        <CellAnimation\n            {...otherProps}\n            cellCount={() => ({ x: 1, y: access(local.lineCount) })}\n            computeCellAnimation={(defs, timeline) => local.computeScanlineAnimation(defs, timeline)}\n        />\n    );\n};\n"],"mappings":";;;;;AAMA,IAAaI,qBAAqBC,UAAkC;CAChE,MAAM,CAACC,OAAOC,cAAcP,WAAWK,OAAO,CAAC,aAAa,0BAA0B,CAAC;CAEvF,OAAAG,gBACKN,eAAaO,WACNF,YAAU;EACdG,kBAAkB;GAAEC,GAAG;GAAGC,GAAGX,OAAOK,MAAMO,SAAS;EAAE;EACrDC,uBAAuBC,MAAMC,aAAaV,MAAMW,yBAAyBF,MAAMC,QAAQ;CAAC,CAAA,CAAA;AAGpG"}

package/dist/Exotics/ScrambleText/ScrambleText.css.js

@@ -0,0 +1,10 @@
+/* empty css                                */
+//#region src/Exotics/ScrambleText/ScrambleText.css.ts
+var scrambleTextWord = "j193cc0";
+var scrambleTextCharacter = "j193cc1";
+var scrambleTextSettling = "j193cc2";
+var scrambleTextNoise = "j193cc3";
+//#endregion
+export { scrambleTextCharacter, scrambleTextNoise, scrambleTextSettling, scrambleTextWord };
+
+//# sourceMappingURL=ScrambleText.css.js.map

package/dist/Exotics/ScrambleText/ScrambleText.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrambleText.css.js","names":[],"sources":["../../../src/Exotics/ScrambleText/ScrambleText.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nexport const scrambleTextWord = style({\n    display: \"inline-block\",\n});\n\nexport const scrambleTextCharacter = style({\n    position: \"relative\",\n    display: \"inline-block\",\n});\n\nexport const scrambleTextSettling = style({\n    color: \"transparent\",\n});\n\nexport const scrambleTextNoise = style({\n    position: \"absolute\",\n    inset: 0,\n    display: \"flex\",\n    justifyContent: \"center\",\n    pointerEvents: \"none\",\n});\n"],"mappings":""}

package/dist/Exotics/ScrambleText/ScrambleText.js

@@ -0,0 +1,116 @@
+import { access } from "../../Utils/propUtils.js";
+import { ScrambleTextUtils } from "./ScrambleText.utils.js";
+import { scrambleTextCharacter, scrambleTextSettling, scrambleTextWord } from "./ScrambleText.css.js";
+import { Index, Show, createEffect, createMemo, createSignal, on, onCleanup, onMount } from "solid-js";
+import { classList, className, createComponent, effect, insert, memo, template } from "solid-js/web";
+//#region src/Exotics/ScrambleText/ScrambleText.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<span>`);
+var _tmpl$2 = /*#__PURE__*/ template(`<span><span>`);
+var _tmpl$3 = /*#__PURE__*/ template(`<span aria-hidden=true>`);
+var DEFAULT_GLYPHS = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789#%&@*+=<>/\\";
+var DEFAULT_SETTLE_DURATION_MS = 900;
+var DEFAULT_SCRAMBLE_INTERVAL_MS = 45;
+var NO_DELAY = 0;
+var NO_ELAPSED = 0;
+var ScrambleText = (props) => {
+	const [getElapsedMs, setElapsedMs] = createSignal(NO_ELAPSED);
+	const [getNoise, setNoise] = createSignal([]);
+	const [getIsScrambling, setIsScrambling] = createSignal(false);
+	let scrambleInterval;
+	let startedAtMs = NO_ELAPSED;
+	onCleanup(() => {
+		clearInterval(scrambleInterval);
+	});
+	const getCharacters = createMemo(() => Array.from(access(props.text)));
+	const getSegments = createMemo(() => ScrambleTextUtils.getSegments(getCharacters()));
+	const getGlyphs = createMemo(() => Array.from(access(props.glyphs) ?? DEFAULT_GLYPHS));
+	const getSettleDurationMs = createMemo(() => access(props.settleDurationMs) ?? DEFAULT_SETTLE_DURATION_MS);
+	const getInitialDelayMs = createMemo(() => access(props.initialDelayMs) ?? NO_DELAY);
+	const getChurnDurationMs = createMemo(() => access(props.churnDurationMs));
+	const getScrambleIntervalMs = createMemo(() => access(props.scrambleIntervalMs) ?? DEFAULT_SCRAMBLE_INTERVAL_MS);
+	const getSettleTimes = createMemo(() => {
+		const characters = getCharacters();
+		return ScrambleTextUtils.getSettleTimes(ScrambleTextUtils.resolveWeights(characters.length, props.computeCharacterWeights?.(characters.length)), getInitialDelayMs(), getSettleDurationMs());
+	});
+	const getStartTimes = createMemo(() => ScrambleTextUtils.getStartTimes(getSettleTimes(), getChurnDurationMs()));
+	const getIsSettled = (index) => !getIsScrambling() || getElapsedMs() >= getSettleTimes()[index];
+	const getIsPending = (index) => getIsScrambling() && getElapsedMs() < getStartTimes()[index];
+	const rollNoise = () => {
+		const glyphs = getGlyphs();
+		setNoise(getCharacters().map((character) => ScrambleTextUtils.pickGlyph(glyphs, character, Math.random())));
+	};
+	const stopScrambling = () => {
+		clearInterval(scrambleInterval);
+		setIsScrambling(false);
+	};
+	const startScrambling = () => {
+		stopScrambling();
+		startedAtMs = Date.now();
+		setElapsedMs(NO_ELAPSED);
+		rollNoise();
+		setIsScrambling(true);
+		scrambleInterval = setInterval(() => {
+			const elapsedMs = Date.now() - startedAtMs;
+			setElapsedMs(elapsedMs);
+			rollNoise();
+			if (elapsedMs < getInitialDelayMs() + getSettleDurationMs()) return;
+			stopScrambling();
+			props.onAnimationEnd?.();
+		}, getScrambleIntervalMs());
+		return true;
+	};
+	const controller = createMemo(() => ({ restartAnimation: () => {
+		if (getIsScrambling()) return false;
+		return startScrambling();
+	} }));
+	createEffect(on(getCharacters, () => startScrambling()));
+	onMount(() => {
+		props.onMount?.(controller());
+	});
+	return createComponent(Index, {
+		get each() {
+			return getSegments();
+		},
+		children: (getSegment) => createComponent(Show, {
+			get when() {
+				return !getSegment().isWhitespace;
+			},
+			get fallback() {
+				return memo(() => getSegment().characters.join(""));
+			},
+			get children() {
+				var _el$ = _tmpl$();
+				className(_el$, scrambleTextWord);
+				insert(_el$, createComponent(Index, {
+					get each() {
+						return getSegment().characters;
+					},
+					children: (getCharacter, offset) => {
+						const getIndex = () => getSegment().startIndex + offset;
+						return (() => {
+							var _el$2 = _tmpl$2(), _el$3 = _el$2.firstChild;
+							className(_el$2, scrambleTextCharacter);
+							insert(_el$3, getCharacter);
+							insert(_el$2, (() => {
+								var _c$ = memo(() => !!(!getIsSettled(getIndex()) && !getIsPending(getIndex())));
+								return () => _c$() && (() => {
+									var _el$4 = _tmpl$3();
+									className(_el$4, "j193cc3");
+									insert(_el$4, () => getNoise()[getIndex()]);
+									return _el$4;
+								})();
+							})(), null);
+							effect((_$p) => classList(_el$3, { [scrambleTextSettling]: !getIsSettled(getIndex()) }, _$p));
+							return _el$2;
+						})();
+					}
+				}));
+				return _el$;
+			}
+		})
+	});
+};
+//#endregion
+export { ScrambleText };
+
+//# sourceMappingURL=ScrambleText.js.map

package/dist/Exotics/ScrambleText/ScrambleText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrambleText.js","names":["Index","Show","createEffect","createMemo","createSignal","on","onCleanup","onMount","access","ScrambleTextProps","ScrambleTextUtils","styles","DEFAULT_GLYPHS","DEFAULT_SETTLE_DURATION_MS","DEFAULT_SCRAMBLE_INTERVAL_MS","NO_DELAY","NO_ELAPSED","ScrambleText","props","getElapsedMs","setElapsedMs","getNoise","setNoise","getIsScrambling","setIsScrambling","scrambleInterval","ReturnType","setInterval","startedAtMs","clearInterval","getCharacters","Array","from","text","getSegments","getGlyphs","glyphs","getSettleDurationMs","settleDurationMs","getInitialDelayMs","initialDelayMs","getChurnDurationMs","churnDurationMs","getScrambleIntervalMs","scrambleIntervalMs","getSettleTimes","characters","resolveWeights","length","computeCharacterWeights","getStartTimes","getIsSettled","index","getIsPending","rollNoise","map","character","pickGlyph","Math","random","stopScrambling","startScrambling","Date","now","elapsedMs","onAnimationEnd","controller","restartAnimation","_$createComponent","each","children","getSegment","when","isWhitespace","fallback","_$memo","join","_el$","_tmpl$","_$className","scrambleTextWord","_$insert","getCharacter","offset","getIndex","startIndex","_el$2","_tmpl$2","_el$3","firstChild","scrambleTextCharacter","_c$","_el$4","_tmpl$3","scrambleTextNoise","_$effect","_$p","_$classList","scrambleTextSettling"],"sources":["../../../src/Exotics/ScrambleText/ScrambleText.tsx"],"sourcesContent":["import { Index, Show, createEffect, createMemo, createSignal, on, onCleanup, onMount } from \"solid-js\";\n\nimport { access } from \"../../Utils/propUtils\";\nimport type { ScrambleTextProps } from \"./ScrambleText.types\";\nimport { ScrambleTextUtils } from \"./ScrambleText.utils\";\n\nimport * as styles from \"./ScrambleText.css\";\n\nconst DEFAULT_GLYPHS = \"ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789#%&@*+=<>/\\\\\";\nconst DEFAULT_SETTLE_DURATION_MS = 900;\nconst DEFAULT_SCRAMBLE_INTERVAL_MS = 45;\nconst NO_DELAY = 0;\nconst NO_ELAPSED = 0;\n\nexport const ScrambleText = (props: ScrambleTextProps) => {\n    const [getElapsedMs, setElapsedMs] = createSignal(NO_ELAPSED);\n    const [getNoise, setNoise] = createSignal<string[]>([]);\n    const [getIsScrambling, setIsScrambling] = createSignal(false);\n\n    let scrambleInterval: ReturnType<typeof setInterval> | undefined;\n    let startedAtMs = NO_ELAPSED;\n\n    onCleanup(() => {\n        clearInterval(scrambleInterval);\n    });\n\n    const getCharacters = createMemo(() => Array.from(access(props.text)));\n\n    const getSegments = createMemo(() => ScrambleTextUtils.getSegments(getCharacters()));\n\n    const getGlyphs = createMemo(() => Array.from(access(props.glyphs) ?? DEFAULT_GLYPHS));\n\n    const getSettleDurationMs = createMemo(() => access(props.settleDurationMs) ?? DEFAULT_SETTLE_DURATION_MS);\n\n    const getInitialDelayMs = createMemo(() => access(props.initialDelayMs) ?? NO_DELAY);\n\n    const getChurnDurationMs = createMemo(() => access(props.churnDurationMs));\n\n    const getScrambleIntervalMs = createMemo(() => access(props.scrambleIntervalMs) ?? DEFAULT_SCRAMBLE_INTERVAL_MS);\n\n    const getSettleTimes = createMemo(() => {\n        const characters = getCharacters();\n\n        return ScrambleTextUtils.getSettleTimes(\n            ScrambleTextUtils.resolveWeights(characters.length, props.computeCharacterWeights?.(characters.length)),\n            getInitialDelayMs(),\n            getSettleDurationMs(),\n        );\n    });\n\n    const getStartTimes = createMemo(() => ScrambleTextUtils.getStartTimes(getSettleTimes(), getChurnDurationMs()));\n\n    const getIsSettled = (index: number) => !getIsScrambling() || getElapsedMs() >= getSettleTimes()[index];\n\n    const getIsPending = (index: number) => getIsScrambling() && getElapsedMs() < getStartTimes()[index];\n\n    const rollNoise = () => {\n        const glyphs = getGlyphs();\n\n        setNoise(getCharacters().map((character) => ScrambleTextUtils.pickGlyph(glyphs, character, Math.random())));\n    };\n\n    const stopScrambling = () => {\n        clearInterval(scrambleInterval);\n        setIsScrambling(false);\n    };\n\n    const startScrambling = () => {\n        stopScrambling();\n\n        startedAtMs = Date.now();\n        setElapsedMs(NO_ELAPSED);\n        rollNoise();\n        setIsScrambling(true);\n\n        scrambleInterval = setInterval(() => {\n            const elapsedMs = Date.now() - startedAtMs;\n\n            setElapsedMs(elapsedMs);\n            rollNoise();\n\n            if (elapsedMs < getInitialDelayMs() + getSettleDurationMs()) return;\n\n            stopScrambling();\n            props.onAnimationEnd?.();\n        }, getScrambleIntervalMs());\n\n        return true;\n    };\n\n    const controller = createMemo(() => ({\n        restartAnimation: () => {\n            if (getIsScrambling()) return false;\n\n            return startScrambling();\n        },\n    }));\n\n    createEffect(on(getCharacters, () => startScrambling()));\n\n    onMount(() => {\n        props.onMount?.(controller());\n    });\n\n    return (\n        <Index each={getSegments()}>\n            {(getSegment) => (\n                <Show when={!getSegment().isWhitespace} fallback={<>{getSegment().characters.join(\"\")}</>}>\n                    <span class={styles.scrambleTextWord}>\n                        <Index each={getSegment().characters}>\n                            {(getCharacter, offset) => {\n                                const getIndex = () => getSegment().startIndex + offset;\n\n                                return (\n                                    <span class={styles.scrambleTextCharacter}>\n                                        <span\n                                            classList={{\n                                                [styles.scrambleTextSettling]: !getIsSettled(getIndex()),\n                                            }}\n                                        >\n                                            {getCharacter()}\n                                        </span>\n\n                                        {!getIsSettled(getIndex()) && !getIsPending(getIndex()) && (\n                                            <span class={styles.scrambleTextNoise} aria-hidden=\"true\">\n                                                {getNoise()[getIndex()]}\n                                            </span>\n                                        )}\n                                    </span>\n                                );\n                            }}\n                        </Index>\n                    </span>\n                </Show>\n            )}\n        </Index>\n    );\n};\n"],"mappings":"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"}

package/dist/Exotics/ScrambleText/ScrambleText.utils.js

@@ -0,0 +1,36 @@
+import { MathUtils } from "@thewaver/ss-utils";
+//#region src/Exotics/ScrambleText/ScrambleText.utils.ts
+var SINGLE_CHARACTER = 1;
+var NO_TIME = 0;
+var ScrambleTextUtils;
+(function(_ScrambleTextUtils) {
+	const getIsWhitespace = _ScrambleTextUtils.getIsWhitespace = (character) => !character.trim();
+	_ScrambleTextUtils.getSegments = (characters) => characters.reduce((segments, character, index) => {
+		const isWhitespace = getIsWhitespace(character);
+		const last = segments[segments.length - SINGLE_CHARACTER];
+		if (last?.isWhitespace === isWhitespace) {
+			last.characters.push(character);
+			return segments;
+		}
+		return [...segments, {
+			isWhitespace,
+			startIndex: index,
+			characters: [character]
+		}];
+	}, []);
+	_ScrambleTextUtils.resolveWeights = (count, computed) => {
+		const span = Math.max(count - SINGLE_CHARACTER, SINGLE_CHARACTER);
+		return Array.from({ length: count }, (_unused, index) => MathUtils.clamp01(computed?.[index] ?? index / span));
+	};
+	_ScrambleTextUtils.getSettleTimes = (weights, initialDelayMs, durationMs) => weights.map((weight) => initialDelayMs + weight * durationMs);
+	_ScrambleTextUtils.getStartTimes = (settleTimes, churnDurationMs) => settleTimes.map((settleTime) => churnDurationMs === void 0 ? NO_TIME : settleTime - churnDurationMs);
+	_ScrambleTextUtils.pickGlyph = (glyphs, excluded, roll) => {
+		const options = glyphs.filter((glyph) => glyph !== excluded);
+		if (!options.length) return excluded;
+		return options[Math.min(Math.floor(roll * options.length), options.length - SINGLE_CHARACTER)];
+	};
+})(ScrambleTextUtils || (ScrambleTextUtils = {}));
+//#endregion
+export { ScrambleTextUtils };
+
+//# sourceMappingURL=ScrambleText.utils.js.map

package/dist/Exotics/ScrambleText/ScrambleText.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrambleText.utils.js","names":[],"sources":["../../../src/Exotics/ScrambleText/ScrambleText.utils.ts"],"sourcesContent":["import { MathUtils } from \"@thewaver/ss-utils\";\n\nimport type { ScrambleTextSegment } from \"./ScrambleText.types\";\n\nconst SINGLE_CHARACTER = 1;\nconst NO_TIME = 0;\n\nexport namespace ScrambleTextUtils {\n    export const getIsWhitespace = (character: string) => !character.trim();\n\n    export const getSegments = (characters: string[]) =>\n        characters.reduce<ScrambleTextSegment[]>((segments, character, index) => {\n            const isWhitespace = getIsWhitespace(character);\n            const last = segments[segments.length - SINGLE_CHARACTER];\n\n            if (last?.isWhitespace === isWhitespace) {\n                last.characters.push(character);\n\n                return segments;\n            }\n\n            return [...segments, { isWhitespace, startIndex: index, characters: [character] }];\n        }, []);\n\n    export const resolveWeights = (count: number, computed: number[] | undefined) => {\n        const span = Math.max(count - SINGLE_CHARACTER, SINGLE_CHARACTER);\n\n        return Array.from({ length: count }, (_unused, index) => MathUtils.clamp01(computed?.[index] ?? index / span));\n    };\n\n    export const getSettleTimes = (weights: number[], initialDelayMs: number, durationMs: number) =>\n        weights.map((weight) => initialDelayMs + weight * durationMs);\n\n    export const getStartTimes = (settleTimes: number[], churnDurationMs: number | undefined) =>\n        settleTimes.map((settleTime) => (churnDurationMs === undefined ? NO_TIME : settleTime - churnDurationMs));\n\n    export const pickGlyph = (glyphs: string[], excluded: string, roll: number) => {\n        const options = glyphs.filter((glyph) => glyph !== excluded);\n\n        if (!options.length) return excluded;\n\n        return options[Math.min(Math.floor(roll * options.length), options.length - SINGLE_CHARACTER)];\n    };\n}\n"],"mappings":";;AAIA,IAAM,mBAAmB;AACzB,IAAM,UAAU;AAET,IAAU;CAAV,SAAA,oBAAA;CACI,MAAM,kBAAA,mBAAA,mBAAmB,cAAsB,CAAC,UAAU,KAAK;CAEzD,mBAAA,eAAe,eACxB,WAAW,QAA+B,UAAU,WAAW,UAAU;EACrE,MAAM,eAAe,gBAAgB,SAAS;EAC9C,MAAM,OAAO,SAAS,SAAS,SAAS;EAExC,IAAI,MAAM,iBAAiB,cAAc;GACrC,KAAK,WAAW,KAAK,SAAS;GAE9B,OAAO;EACX;EAEA,OAAO,CAAC,GAAG,UAAU;GAAE;GAAc,YAAY;GAAO,YAAY,CAAC,SAAS;EAAE,CAAC;CACrF,GAAG,CAAC,CAAC;CAEI,mBAAA,kBAAkB,OAAe,aAAmC;EAC7E,MAAM,OAAO,KAAK,IAAI,QAAQ,kBAAkB,gBAAgB;EAEhE,OAAO,MAAM,KAAK,EAAE,QAAQ,MAAM,IAAI,SAAS,UAAU,UAAU,QAAQ,WAAW,UAAU,QAAQ,IAAI,CAAC;CACjH;CAEa,mBAAA,kBAAkB,SAAmB,gBAAwB,eACtE,QAAQ,KAAK,WAAW,iBAAiB,SAAS,UAAU;CAEnD,mBAAA,iBAAiB,aAAuB,oBACjD,YAAY,KAAK,eAAgB,oBAAoB,KAAA,IAAY,UAAU,aAAa,eAAgB;CAE/F,mBAAA,aAAa,QAAkB,UAAkB,SAAiB;EAC3E,MAAM,UAAU,OAAO,QAAQ,UAAU,UAAU,QAAQ;EAE3D,IAAI,CAAC,QAAQ,QAAQ,OAAO;EAE5B,OAAO,QAAQ,KAAK,IAAI,KAAK,MAAM,OAAO,QAAQ,MAAM,GAAG,QAAQ,SAAS,gBAAgB;CAChG;AACH,EAAA,CAAA,sBAAA,oBAAA,CAAA,EAAD"}

package/dist/Exotics/ScratchCard/ScratchCard.css.js

@@ -0,0 +1,10 @@
+/* empty css                               */
+//#region src/Exotics/ScratchCard/ScratchCard.css.ts
+var scratchCardRoot = "nt38pw0";
+var scratchCardCover = "nt38pw1";
+var scratchCardCell = "nt38pw2";
+var scratchCardScratched = "nt38pw3";
+//#endregion
+export { scratchCardCell, scratchCardCover, scratchCardRoot, scratchCardScratched };
+
+//# sourceMappingURL=ScratchCard.css.js.map

package/dist/Exotics/ScratchCard/ScratchCard.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScratchCard.css.js","names":[],"sources":["../../../src/Exotics/ScratchCard/ScratchCard.css.ts"],"sourcesContent":["import { style } from \"@vanilla-extract/css\";\n\nexport const scratchCardRoot = style({\n    position: \"relative\",\n    width: \"100%\",\n    height: \"100%\",\n    overflow: \"hidden\",\n});\n\nexport const scratchCardCover = style({\n    position: \"absolute\",\n    inset: 0,\n    display: \"grid\",\n    touchAction: \"none\",\n    cursor: \"crosshair\",\n});\n\nexport const scratchCardCell = style({\n    position: \"relative\",\n    pointerEvents: \"none\",\n});\n\nexport const scratchCardScratched = style({\n    visibility: \"hidden\",\n});\n"],"mappings":""}

package/dist/Exotics/ScratchCard/ScratchCard.js

@@ -0,0 +1,116 @@
+import { ElementObserver } from "../../Abstracts/ElementObserver/ElementObserver.js";
+import { access } from "../../Utils/propUtils.js";
+import { InteractionTracker } from "../../Abstracts/InteractionTracker/InteractionTracker.js";
+import { ScratchCardUtils } from "./ScratchCard.utils.js";
+import { scratchCardRoot } from "./ScratchCard.css.js";
+import { Index, createEffect, createMemo, createSignal, on, onMount } from "solid-js";
+import { classList, className, createComponent, delegateEvents, effect, insert, memo, setAttribute, setStyleProperty, template, use } from "solid-js/web";
+//#region src/Exotics/ScratchCard/ScratchCard.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div>`);
+var _tmpl$2 = /*#__PURE__*/ template(`<div role=button>`);
+var DEFAULT_BRUSH_RADIUS = 26;
+var DEFAULT_CLEAR_THRESHOLD = 1;
+var NOTHING_SCRATCHED = 0;
+var CLEAR_KEYS = ["Enter", " "];
+var ScratchCard = (props) => {
+	const [getCoverRef, setCoverRef] = createSignal();
+	const [getScratched, setScratched] = createSignal(/* @__PURE__ */ new Set());
+	const getCellCount = createMemo(() => access(props.cellCount));
+	const getIsDisabled = createMemo(() => access(props.isDisabled) === true);
+	const getSize = ElementObserver.createBorderBoxSizeObserver(getCoverRef, () => !getIsDisabled());
+	const getTotal = createMemo(() => ScratchCardUtils.getCellCount(getCellCount()));
+	const getClearedRatio = createMemo(() => ScratchCardUtils.computeClearedRatio(getScratched().size, getCellCount()));
+	const getIsCleared = createMemo(() => getTotal() > NOTHING_SCRATCHED && getScratched().size >= getTotal());
+	const getClearThreshold = createMemo(() => access(props.clearThreshold) ?? DEFAULT_CLEAR_THRESHOLD);
+	const clearAll = () => setScratched(new Set(Array.from({ length: getTotal() }, (_unused, index) => index)));
+	const controller = createMemo(() => ({
+		reset: () => setScratched(/* @__PURE__ */ new Set()),
+		clear: clearAll
+	}));
+	onMount(() => {
+		props.onMount?.(controller());
+	});
+	createEffect(on(getCellCount, () => setScratched(/* @__PURE__ */ new Set()), { defer: true }));
+	createEffect(on(getClearedRatio, (ratio) => {
+		props.onScratch?.(ratio);
+		if (ratio < getClearThreshold() || getIsCleared()) return;
+		clearAll();
+	}, { defer: true }));
+	createEffect(on(getIsCleared, (isCleared) => {
+		if (isCleared) props.onClear?.();
+	}, { defer: true }));
+	const scratchAt = (ratio) => {
+		const size = getSize();
+		const brushed = ScratchCardUtils.computeBrushedCells({
+			point: {
+				x: ratio.x * size.width,
+				y: ratio.y * size.height
+			},
+			size,
+			cellCount: getCellCount(),
+			radius: access(props.brushRadius) ?? DEFAULT_BRUSH_RADIUS
+		});
+		setScratched((previous) => {
+			if (brushed.every((index) => previous.has(index))) return previous;
+			return /* @__PURE__ */ new Set([...previous, ...brushed]);
+		});
+	};
+	InteractionTracker.trackDrag(getCoverRef, getIsDisabled, { onDrag: scratchAt });
+	const handleKeyDown = (e) => {
+		if (getIsDisabled() || !CLEAR_KEYS.includes(e.key)) return;
+		e.preventDefault();
+		clearAll();
+	};
+	return (() => {
+		var _el$ = _tmpl$();
+		className(_el$, scratchCardRoot);
+		insert(_el$, () => props.renderContent(), null);
+		insert(_el$, (() => {
+			var _c$ = memo(() => !!!getIsCleared());
+			return () => _c$() && (() => {
+				var _el$2 = _tmpl$2();
+				_el$2.$$keydown = handleKeyDown;
+				use(setCoverRef, _el$2);
+				className(_el$2, "nt38pw1");
+				insert(_el$2, createComponent(Index, {
+					get each() {
+						return Array.from({ length: getTotal() }, (_unused, index) => index);
+					},
+					children: (getIndex) => (() => {
+						var _el$3 = _tmpl$();
+						className(_el$3, "nt38pw2");
+						insert(_el$3, () => props.renderCell(() => ({
+							index: getIndex(),
+							cell: ScratchCardUtils.getCellPosition(getIndex(), getCellCount()),
+							isScratched: getScratched().has(getIndex())
+						})));
+						effect((_$p) => classList(_el$3, { ["nt38pw3"]: getScratched().has(getIndex()) }, _$p));
+						return _el$3;
+					})()
+				}));
+				effect((_p$) => {
+					var _v$ = `repeat(${getCellCount().x}, 1fr)`, _v$2 = `repeat(${getCellCount().y}, 1fr)`, _v$3 = getIsDisabled() ? void 0 : 0, _v$4 = access(props.ariaLabel), _v$5 = getIsDisabled() || void 0;
+					_v$ !== _p$.e && setStyleProperty(_el$2, "grid-template-columns", _p$.e = _v$);
+					_v$2 !== _p$.t && setStyleProperty(_el$2, "grid-template-rows", _p$.t = _v$2);
+					_v$3 !== _p$.a && setAttribute(_el$2, "tabindex", _p$.a = _v$3);
+					_v$4 !== _p$.o && setAttribute(_el$2, "aria-label", _p$.o = _v$4);
+					_v$5 !== _p$.i && setAttribute(_el$2, "aria-disabled", _p$.i = _v$5);
+					return _p$;
+				}, {
+					e: void 0,
+					t: void 0,
+					a: void 0,
+					o: void 0,
+					i: void 0
+				});
+				return _el$2;
+			})();
+		})(), null);
+		return _el$;
+	})();
+};
+delegateEvents(["keydown"]);
+//#endregion
+export { ScratchCard };
+
+//# sourceMappingURL=ScratchCard.js.map

package/dist/Exotics/ScratchCard/ScratchCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScratchCard.js","names":["Index","createEffect","createMemo","createSignal","on","onMount","ElementObserver","InteractionTracker","access","ScratchCardProps","ScratchCardUtils","styles","DEFAULT_BRUSH_RADIUS","DEFAULT_CLEAR_THRESHOLD","NOTHING_SCRATCHED","CLEAR_KEYS","ScratchCard","props","getCoverRef","setCoverRef","HTMLElement","getScratched","setScratched","Set","getCellCount","cellCount","getIsDisabled","isDisabled","getSize","createBorderBoxSizeObserver","getTotal","getClearedRatio","computeClearedRatio","size","getIsCleared","getClearThreshold","clearThreshold","clearAll","Array","from","length","_unused","index","controller","reset","clear","defer","ratio","onScratch","isCleared","onClear","scratchAt","x","y","brushed","computeBrushedCells","point","width","height","radius","brushRadius","previous","every","has","trackDrag","onDrag","handleKeyDown","e","KeyboardEvent","includes","key","preventDefault","_el$","_tmpl$","_$className","scratchCardRoot","_$insert","renderContent","_c$","_$memo","_el$2","_tmpl$2","$$keydown","_$use","scratchCardCover","_$createComponent","each","children","getIndex","_el$3","scratchCardCell","renderCell","cell","getCellPosition","isScratched","_$effect","_$p","_$classList","scratchCardScratched","_p$","_v$","_v$2","_v$3","undefined","_v$4","ariaLabel","_v$5","_$setStyleProperty","t","a","_$setAttribute","o","i","_$delegateEvents"],"sources":["../../../src/Exotics/ScratchCard/ScratchCard.tsx"],"sourcesContent":["import { Index, createEffect, createMemo, createSignal, on, onMount } from \"solid-js\";\n\nimport { ElementObserver } from \"../../Abstracts/ElementObserver/ElementObserver\";\nimport { InteractionTracker } from \"../../Abstracts/InteractionTracker/InteractionTracker\";\nimport { access } from \"../../Utils/propUtils\";\nimport type { ScratchCardProps } from \"./ScratchCard.types\";\nimport { ScratchCardUtils } from \"./ScratchCard.utils\";\n\nimport * as styles from \"./ScratchCard.css\";\n\nconst DEFAULT_BRUSH_RADIUS = 26;\nconst DEFAULT_CLEAR_THRESHOLD = 1;\nconst NOTHING_SCRATCHED = 0;\nconst CLEAR_KEYS = [\"Enter\", \" \"];\n\nexport const ScratchCard = (props: ScratchCardProps) => {\n    const [getCoverRef, setCoverRef] = createSignal<HTMLElement>();\n    const [getScratched, setScratched] = createSignal<Set<number>>(new Set());\n\n    const getCellCount = createMemo(() => access(props.cellCount));\n\n    const getIsDisabled = createMemo(() => access(props.isDisabled) === true);\n\n    const getSize = ElementObserver.createBorderBoxSizeObserver(getCoverRef, () => !getIsDisabled());\n\n    const getTotal = createMemo(() => ScratchCardUtils.getCellCount(getCellCount()));\n\n    const getClearedRatio = createMemo(() => ScratchCardUtils.computeClearedRatio(getScratched().size, getCellCount()));\n\n    const getIsCleared = createMemo(() => getTotal() > NOTHING_SCRATCHED && getScratched().size >= getTotal());\n\n    const getClearThreshold = createMemo(() => access(props.clearThreshold) ?? DEFAULT_CLEAR_THRESHOLD);\n\n    const clearAll = () => setScratched(new Set(Array.from({ length: getTotal() }, (_unused, index) => index)));\n\n    const controller = createMemo(() => ({\n        reset: () => setScratched(new Set<number>()),\n        clear: clearAll,\n    }));\n\n    onMount(() => {\n        props.onMount?.(controller());\n    });\n\n    createEffect(on(getCellCount, () => setScratched(new Set<number>()), { defer: true }));\n\n    createEffect(\n        on(\n            getClearedRatio,\n            (ratio) => {\n                props.onScratch?.(ratio);\n\n                if (ratio < getClearThreshold() || getIsCleared()) return;\n\n                clearAll();\n            },\n            { defer: true },\n        ),\n    );\n\n    createEffect(\n        on(\n            getIsCleared,\n            (isCleared) => {\n                if (isCleared) props.onClear?.();\n            },\n            { defer: true },\n        ),\n    );\n\n    const scratchAt = (ratio: { x: number; y: number }) => {\n        const size = getSize();\n        const brushed = ScratchCardUtils.computeBrushedCells({\n            point: { x: ratio.x * size.width, y: ratio.y * size.height },\n            size,\n            cellCount: getCellCount(),\n            radius: access(props.brushRadius) ?? DEFAULT_BRUSH_RADIUS,\n        });\n\n        setScratched((previous) => {\n            if (brushed.every((index) => previous.has(index))) return previous;\n\n            return new Set([...previous, ...brushed]);\n        });\n    };\n\n    InteractionTracker.trackDrag(getCoverRef, getIsDisabled, { onDrag: scratchAt });\n\n    const handleKeyDown = (e: KeyboardEvent) => {\n        if (getIsDisabled() || !CLEAR_KEYS.includes(e.key)) return;\n\n        e.preventDefault();\n        clearAll();\n    };\n\n    return (\n        <div class={styles.scratchCardRoot}>\n            {props.renderContent()}\n\n            {!getIsCleared() && (\n                <div\n                    ref={setCoverRef}\n                    class={styles.scratchCardCover}\n                    style={{\n                        \"grid-template-columns\": `repeat(${getCellCount().x}, 1fr)`,\n                        \"grid-template-rows\": `repeat(${getCellCount().y}, 1fr)`,\n                    }}\n                    role=\"button\"\n                    tabindex={getIsDisabled() ? undefined : 0}\n                    aria-label={access(props.ariaLabel)}\n                    aria-disabled={getIsDisabled() || undefined}\n                    onKeyDown={handleKeyDown}\n                >\n                    <Index each={Array.from({ length: getTotal() }, (_unused, index) => index)}>\n                        {(getIndex) => (\n                            <div\n                                class={styles.scratchCardCell}\n                                classList={{ [styles.scratchCardScratched]: getScratched().has(getIndex()) }}\n                            >\n                                {props.renderCell(() => ({\n                                    index: getIndex(),\n                                    cell: ScratchCardUtils.getCellPosition(getIndex(), getCellCount()),\n                                    isScratched: getScratched().has(getIndex()),\n                                }))}\n                            </div>\n                        )}\n                    </Index>\n                </div>\n            )}\n        </div>\n    );\n};\n"],"mappings":"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"}

package/dist/Exotics/ScratchCard/ScratchCard.utils.js

@@ -0,0 +1,51 @@
+//#region src/Exotics/ScratchCard/ScratchCard.utils.ts
+var NOTHING = 0;
+var ScratchCardUtils;
+(function(_ScratchCardUtils) {
+	const getCellCount = _ScratchCardUtils.getCellCount = (cellCount) => Math.max(cellCount.x, NOTHING) * Math.max(cellCount.y, NOTHING);
+	_ScratchCardUtils.getCellPosition = (index, cellCount) => ({
+		x: index % cellCount.x,
+		y: Math.floor(index / cellCount.x)
+	});
+	_ScratchCardUtils.computeBrushedCells = (defs) => {
+		if (defs.cellCount.x < 1 || defs.cellCount.y < 1) return [];
+		const cellSize = {
+			width: defs.size.width / defs.cellCount.x,
+			height: defs.size.height / defs.cellCount.y
+		};
+		const reach = {
+			x: defs.radius / Math.max(cellSize.width, NOTHING),
+			y: defs.radius / Math.max(cellSize.height, NOTHING)
+		};
+		const centre = {
+			x: defs.point.x / Math.max(cellSize.width, NOTHING),
+			y: defs.point.y / Math.max(cellSize.height, NOTHING)
+		};
+		const from = {
+			x: Math.floor(centre.x - reach.x),
+			y: Math.floor(centre.y - reach.y)
+		};
+		const to = {
+			x: Math.ceil(centre.x + reach.x),
+			y: Math.ceil(centre.y + reach.y)
+		};
+		const brushed = [];
+		for (let y = Math.max(from.y, NOTHING); y <= Math.min(to.y, defs.cellCount.y - 1); y++) for (let x = Math.max(from.x, NOTHING); x <= Math.min(to.x, defs.cellCount.x - 1); x++) {
+			const gap = {
+				x: Math.max(x * cellSize.width - defs.point.x, NOTHING, defs.point.x - (x + 1) * cellSize.width),
+				y: Math.max(y * cellSize.height - defs.point.y, NOTHING, defs.point.y - (y + 1) * cellSize.height)
+			};
+			if (gap.x * gap.x + gap.y * gap.y > defs.radius * defs.radius) continue;
+			brushed.push(y * defs.cellCount.x + x);
+		}
+		return brushed;
+	};
+	_ScratchCardUtils.computeClearedRatio = (scratchedCount, cellCount) => {
+		const total = getCellCount(cellCount);
+		return total > NOTHING ? Math.min(scratchedCount / total, 1) : NOTHING;
+	};
+})(ScratchCardUtils || (ScratchCardUtils = {}));
+//#endregion
+export { ScratchCardUtils };
+
+//# sourceMappingURL=ScratchCard.utils.js.map

package/dist/Exotics/ScratchCard/ScratchCard.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScratchCard.utils.js","names":[],"sources":["../../../src/Exotics/ScratchCard/ScratchCard.utils.ts"],"sourcesContent":["import type { Point2d } from \"@thewaver/ss-utils\";\n\nimport type { ScratchCardBrushDefs } from \"./ScratchCard.types\";\n\nconst NOTHING = 0;\n\nexport namespace ScratchCardUtils {\n    export const getCellCount = (cellCount: Point2d) => Math.max(cellCount.x, NOTHING) * Math.max(cellCount.y, NOTHING);\n\n    export const getCellPosition = (index: number, cellCount: Point2d): Point2d => ({\n        x: index % cellCount.x,\n        y: Math.floor(index / cellCount.x),\n    });\n\n    export const computeBrushedCells = (defs: ScratchCardBrushDefs) => {\n        if (defs.cellCount.x < 1 || defs.cellCount.y < 1) return [];\n\n        const cellSize = { width: defs.size.width / defs.cellCount.x, height: defs.size.height / defs.cellCount.y };\n        const reach = {\n            x: defs.radius / Math.max(cellSize.width, NOTHING),\n            y: defs.radius / Math.max(cellSize.height, NOTHING),\n        };\n        const centre = {\n            x: defs.point.x / Math.max(cellSize.width, NOTHING),\n            y: defs.point.y / Math.max(cellSize.height, NOTHING),\n        };\n\n        const from = { x: Math.floor(centre.x - reach.x), y: Math.floor(centre.y - reach.y) };\n        const to = { x: Math.ceil(centre.x + reach.x), y: Math.ceil(centre.y + reach.y) };\n\n        const brushed: number[] = [];\n\n        for (let y = Math.max(from.y, NOTHING); y <= Math.min(to.y, defs.cellCount.y - 1); y++) {\n            for (let x = Math.max(from.x, NOTHING); x <= Math.min(to.x, defs.cellCount.x - 1); x++) {\n                const gap = {\n                    x: Math.max(x * cellSize.width - defs.point.x, NOTHING, defs.point.x - (x + 1) * cellSize.width),\n                    y: Math.max(y * cellSize.height - defs.point.y, NOTHING, defs.point.y - (y + 1) * cellSize.height),\n                };\n\n                if (gap.x * gap.x + gap.y * gap.y > defs.radius * defs.radius) continue;\n\n                brushed.push(y * defs.cellCount.x + x);\n            }\n        }\n\n        return brushed;\n    };\n\n    export const computeClearedRatio = (scratchedCount: number, cellCount: Point2d) => {\n        const total = getCellCount(cellCount);\n\n        return total > NOTHING ? Math.min(scratchedCount / total, 1) : NOTHING;\n    };\n}\n"],"mappings":";AAIA,IAAM,UAAU;AAET,IAAU;CAAV,SAAA,mBAAA;CACI,MAAM,eAAA,kBAAA,gBAAgB,cAAuB,KAAK,IAAI,UAAU,GAAG,OAAO,IAAI,KAAK,IAAI,UAAU,GAAG,OAAO;CAErG,kBAAA,mBAAmB,OAAe,eAAiC;EAC5E,GAAG,QAAQ,UAAU;EACrB,GAAG,KAAK,MAAM,QAAQ,UAAU,CAAC;CACrC;CAEa,kBAAA,uBAAuB,SAA+B;EAC/D,IAAI,KAAK,UAAU,IAAI,KAAK,KAAK,UAAU,IAAI,GAAG,OAAO,CAAC;EAE1D,MAAM,WAAW;GAAE,OAAO,KAAK,KAAK,QAAQ,KAAK,UAAU;GAAG,QAAQ,KAAK,KAAK,SAAS,KAAK,UAAU;EAAE;EAC1G,MAAM,QAAQ;GACV,GAAG,KAAK,SAAS,KAAK,IAAI,SAAS,OAAO,OAAO;GACjD,GAAG,KAAK,SAAS,KAAK,IAAI,SAAS,QAAQ,OAAO;EACtD;EACA,MAAM,SAAS;GACX,GAAG,KAAK,MAAM,IAAI,KAAK,IAAI,SAAS,OAAO,OAAO;GAClD,GAAG,KAAK,MAAM,IAAI,KAAK,IAAI,SAAS,QAAQ,OAAO;EACvD;EAEA,MAAM,OAAO;GAAE,GAAG,KAAK,MAAM,OAAO,IAAI,MAAM,CAAC;GAAG,GAAG,KAAK,MAAM,OAAO,IAAI,MAAM,CAAC;EAAE;EACpF,MAAM,KAAK;GAAE,GAAG,KAAK,KAAK,OAAO,IAAI,MAAM,CAAC;GAAG,GAAG,KAAK,KAAK,OAAO,IAAI,MAAM,CAAC;EAAE;EAEhF,MAAM,UAAoB,CAAC;EAE3B,KAAK,IAAI,IAAI,KAAK,IAAI,KAAK,GAAG,OAAO,GAAG,KAAK,KAAK,IAAI,GAAG,GAAG,KAAK,UAAU,IAAI,CAAC,GAAG,KAC/E,KAAK,IAAI,IAAI,KAAK,IAAI,KAAK,GAAG,OAAO,GAAG,KAAK,KAAK,IAAI,GAAG,GAAG,KAAK,UAAU,IAAI,CAAC,GAAG,KAAK;GACpF,MAAM,MAAM;IACR,GAAG,KAAK,IAAI,IAAI,SAAS,QAAQ,KAAK,MAAM,GAAG,SAAS,KAAK,MAAM,KAAK,IAAI,KAAK,SAAS,KAAK;IAC/F,GAAG,KAAK,IAAI,IAAI,SAAS,SAAS,KAAK,MAAM,GAAG,SAAS,KAAK,MAAM,KAAK,IAAI,KAAK,SAAS,MAAM;GACrG;GAEA,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,IAAI,KAAK,SAAS,KAAK,QAAQ;GAE/D,QAAQ,KAAK,IAAI,KAAK,UAAU,IAAI,CAAC;EACzC;EAGJ,OAAO;CACX;CAEa,kBAAA,uBAAuB,gBAAwB,cAAuB;EAC/E,MAAM,QAAQ,aAAa,SAAS;EAEpC,OAAO,QAAQ,UAAU,KAAK,IAAI,iBAAiB,OAAO,CAAC,IAAI;CACnE;AACH,EAAA,CAAA,qBAAA,mBAAA,CAAA,EAAD"}

package/dist/Exotics/ScreenWiper/ScreenWiper.css.js

@@ -0,0 +1,12 @@
+/* empty css                               */
+//#region src/Exotics/ScreenWiper/ScreenWiper.css.ts
+var screenWiperRoot = "hxy3ds0";
+var screenWiperRow = "hxy3ds1";
+var screenWiperCellShapes = {
+	lozenge: "hxy3ds3 hxy3ds2",
+	circle: "hxy3ds4 hxy3ds2"
+};
+//#endregion
+export { screenWiperCellShapes, screenWiperRoot, screenWiperRow };
+
+//# sourceMappingURL=ScreenWiper.css.js.map

package/dist/Exotics/ScreenWiper/ScreenWiper.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScreenWiper.css.js","names":[],"sources":["../../../src/Exotics/ScreenWiper/ScreenWiper.css.ts"],"sourcesContent":["import { style, styleVariants } from \"@vanilla-extract/css\";\n\nexport const screenWiperRoot = style({\n    position: \"fixed\",\n    inset: 0,\n    zIndex: 10,\n});\n\nexport const screenWiperRow = style({\n    display: \"flex\",\n    flexDirection: \"row\",\n});\n\nconst screenWiperCell = style({\n    flexShrink: 0,\n    backgroundColor: \"black\",\n});\n\nexport const screenWiperCellShapes = styleVariants({\n    lozenge: [screenWiperCell, { clipPath: \"polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)\" }],\n    circle: [screenWiperCell, { borderRadius: \"50%\" }],\n});\n"],"mappings":""}