weasel-icons 0.1.0 → 0.3.0

package/dist/icons/close/close-icon.js

@@ -0,0 +1,27 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useRef, useCallback } from 'react';
+import { motion, useTransform } from 'motion/react';
+import { usePoseWeight, useBehaviorClock, useActionProgress } from "../../shared/use-icon-motion.js";
+import { useMotionPreference } from "../../shared/use-motion-preference.js";
+import { CLOSE_FIRST, CLOSE_SECOND, sampleClose } from "./close-rig.js";
+export { closeStates } from "./close-rig.js";
+export const CloseIcon = memo(function CloseIcon({ state = 'ready', size = 24, color = 'currentColor', accentColor = 'currentColor', strokeWidth = 1.65, speed = 1, alive = false, className, }) {
+    const reduced = useMotionPreference(), element = useRef(null);
+    const pace = Number.isFinite(speed) ? Math.min(4, Math.max(0.1, speed)) : 1;
+    const w0 = usePoseWeight(state === 'ready', pace, reduced);
+    const w1 = usePoseWeight(state === 'closing', pace, reduced);
+    const w2 = usePoseWeight(state === 'blocked', pace, reduced);
+    const performs = alive && !reduced && (state === 'closing' || state === 'blocked');
+    const life = usePoseWeight(performs, pace, reduced), time = useBehaviorClock(element, performs, pace, life);
+    const can0 = useCallback(() => w1.get() < 0.001, [w1]);
+    const e0 = useActionProgress(state === 'closing', pace, reduced, 1.15, can0);
+    const can1 = useCallback(() => w2.get() < 0.001, [w2]);
+    const e1 = useActionProgress(state === 'blocked', pace, reduced, 1, can1);
+    const rig = useTransform(() => sampleClose([w0.get(), w1.get(), w2.get()], time.get(), life.get(), e0.get(), e1.get()));
+    const firstDash = useTransform(rig, (r) => r.firstDash);
+    const secondDash = useTransform(rig, (r) => r.secondDash);
+    const stop = useTransform(rig, (r) => r.stop);
+    const stopOpacity = useTransform(rig, (r) => r.stopOpacity);
+    return (_jsx("svg", { ref: element, className: className, width: size, height: size, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", fill: "none", stroke: color, strokeWidth: strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", focusable: "false", pointerEvents: "none", style: { display: 'block' }, children: _jsxs("g", { "data-layer": "close-body", transform: "translate(12 12) scale(.84) translate(-12 -12)", children: [_jsxs("g", { "data-layer": "close-arms", children: [_jsx(motion.path, { "data-part": "first", d: CLOSE_FIRST, strokeDasharray: firstDash }), _jsx(motion.path, { "data-part": "second", d: CLOSE_SECOND, strokeDasharray: secondDash })] }), _jsx(motion.path, { "data-layer": "close-stop", d: stop, opacity: stopOpacity, stroke: accentColor, strokeWidth: Math.min(strokeWidth, 1.6) })] }) }));
+});

package/dist/icons/close/close-rig.d.ts

@@ -0,0 +1,10 @@
+export declare const closeStates: readonly ["ready", "closing", "blocked"];
+export type CloseState = (typeof closeStates)[number];
+export declare const CLOSE_FIRST = "M6 6L18 18";
+export declare const CLOSE_SECOND = "M18 6L6 18";
+export declare function sampleClose(weights: readonly number[], time?: number, alive?: number, entry?: number, successEntry?: number): {
+    firstDash: string;
+    secondDash: string;
+    stop: string;
+    stopOpacity: number;
+};

package/dist/icons/close/close-rig.js

@@ -0,0 +1,31 @@
+import { behaviorBeat } from "../../shared/behavior-curves.js";
+const clamp = (n) => Math.max(0, Math.min(1, Number.isFinite(n) ? n : 0));
+const normalized = (values) => {
+    const w = values.map(clamp), sum = w.reduce((a, b) => a + b, 0) || 1;
+    return w.map((v) => v / sum);
+};
+export const closeStates = ['ready', 'closing', 'blocked'];
+export const CLOSE_FIRST = 'M6 6L18 18';
+export const CLOSE_SECOND = 'M18 6L6 18';
+const LENGTH = Math.hypot(12, 12);
+export function sampleClose(weights, time = 0, alive = 0, entry = 1, successEntry = 1) {
+    const [, closing, blocked] = normalized(weights), life = clamp(alive), t = time % 4.4;
+    // Ink retracts towards the start, then crosses the diagonal again. The
+    // second stroke follows only after the first is substantially written.
+    const rewrite = (s, delay) => behaviorBeat(s, 0.02 + delay, 0.14, 0.02, 0.38);
+    const ink = (delay) => 1 -
+        0.84 * closing * ((1 - life) * rewrite(clamp(entry) * 1.15, delay) + life * rewrite(t, delay));
+    const refusal = (s) => behaviorBeat(s, 0.05, 0.18, 0.03, 0.35);
+    const stopAttempt = blocked * ((1 - life) * refusal(clamp(successEntry)) + life * refusal(t));
+    const gap = blocked * 0.45;
+    const dash = (amount) => {
+        const arm = (LENGTH * amount * (1 - gap)) / 2;
+        return [arm, LENGTH * gap, arm, LENGTH * 2 - arm * 2 - LENGTH * gap].join(' ');
+    };
+    return {
+        firstDash: dash(ink(0) * (1 - stopAttempt * 0.16)),
+        secondDash: dash(ink(0.29) * (1 - stopAttempt * 0.16)),
+        stop: 'M10.5 12H13.5',
+        stopOpacity: blocked,
+    };
+}

package/dist/icons/cloud/cloud-icon.d.ts

@@ -0,0 +1,5 @@
+import type { StatefulIconProps } from "../../shared/icon-types.js";
+import { type CloudState } from "./cloud-rig.js";
+export { cloudStates, type CloudState } from "./cloud-rig.js";
+export type CloudIconProps = StatefulIconProps<CloudState>;
+export declare const CloudIcon: import("react").NamedExoticComponent<CloudIconProps>;

package/dist/icons/cloud/cloud-icon.js

@@ -0,0 +1,9 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+import { ArticulatedIcon } from "../../shared/articulated-icon.js";
+import { cloudArt, cloudStates } from "./cloud-rig.js";
+export { cloudStates } from "./cloud-rig.js";
+export const CloudIcon = memo(function CloudIcon(props) {
+    return _jsx(ArticulatedIcon, { art: cloudArt, states: cloudStates, ...props });
+});

package/dist/icons/cloud/cloud-rig.d.ts

@@ -0,0 +1,74 @@
+export declare const cloudStates: readonly ["idle", "syncing", "synced"];
+export type CloudState = (typeof cloudStates)[number];
+export declare const cloudArt: {
+    readonly name: "cloud";
+    readonly parts: readonly [{
+        readonly name: "cloud";
+        readonly paths: readonly ["M17.5 19H9a7 7 0 1 1 6.71-9h1.79a4.5 4.5 0 1 1 0 9Z"];
+        readonly poses: readonly [{}, {}, {}];
+        readonly pivot: readonly [12, 12];
+        readonly gestures: readonly [];
+    }, {
+        readonly name: "transfer";
+        readonly detail: true;
+        readonly paths: readonly ["M8 13.5L11 13.5L15 13.5"];
+        readonly poses: readonly [{
+            readonly opacity: 0;
+        }, {
+            readonly opacity: 1;
+            readonly draw: 0.3;
+        }, {
+            readonly opacity: 1;
+        }];
+        readonly pivot: readonly [12, 14];
+        readonly gestures: readonly [null, {
+            readonly duration: 2.8;
+            readonly repeatAfter: 4;
+            readonly loop: true;
+            readonly frames: readonly [{
+                readonly at: 0;
+            }, {
+                readonly at: 0.12;
+                readonly y: 1;
+                readonly draw: 0.6;
+            }, {
+                readonly at: 0.3;
+                readonly y: 1;
+                readonly draw: 0.6;
+            }, {
+                readonly at: 0.58;
+                readonly y: -1.2;
+                readonly draw: 0.6;
+            }, {
+                readonly at: 0.72;
+                readonly y: -1.2;
+                readonly draw: 0.6;
+                readonly opacity: -1;
+            }, {
+                readonly at: 0.87;
+                readonly opacity: -1;
+            }, {
+                readonly at: 1;
+            }];
+        }, {
+            readonly duration: 1.2;
+            readonly repeatAfter: 2.2;
+            readonly loop: false;
+            readonly frames: readonly [{
+                readonly at: 0;
+            }, {
+                readonly at: 0.12;
+                readonly draw: -0.9;
+            }, {
+                readonly at: 0.6;
+                readonly draw: 0;
+                readonly scaleX: 0.04;
+                readonly scaleY: 0.04;
+            }, {
+                readonly at: 1;
+            }];
+        }];
+        readonly pathStates: readonly [readonly ["M8 13.5L11 13.5L15 13.5"], readonly ["M8 13.5L11 13.5L15 13.5"], readonly ["M8 13.5L10.7 15.5L15 12.5"]];
+        readonly traceLength: 9;
+    }];
+};

package/dist/icons/cloud/cloud-rig.js

@@ -0,0 +1,103 @@
+export const cloudStates = ['idle', 'syncing', 'synced'];
+// Lucide-derived outline; attribution and pinned source: THIRD_PARTY_NOTICES.md.
+// Sync a file: a chunk gathers low inside the cloud, travels upward, and fades before the next chunk. Synced draws the existing check once.
+export const cloudArt = {
+    name: 'cloud',
+    parts: [
+        {
+            name: 'cloud',
+            paths: ['M17.5 19H9a7 7 0 1 1 6.71-9h1.79a4.5 4.5 0 1 1 0 9Z'],
+            poses: [{}, {}, {}],
+            pivot: [12, 12],
+            gestures: [],
+        },
+        {
+            name: 'transfer',
+            detail: true,
+            paths: ['M8 13.5L11 13.5L15 13.5'],
+            poses: [
+                {
+                    opacity: 0,
+                },
+                {
+                    opacity: 1,
+                    draw: 0.3,
+                },
+                {
+                    opacity: 1,
+                },
+            ],
+            pivot: [12, 14],
+            gestures: [
+                null,
+                {
+                    duration: 2.8,
+                    repeatAfter: 4,
+                    loop: true,
+                    frames: [
+                        {
+                            at: 0,
+                        },
+                        {
+                            at: 0.12,
+                            y: 1,
+                            draw: 0.6,
+                        },
+                        {
+                            at: 0.3,
+                            y: 1,
+                            draw: 0.6,
+                        },
+                        {
+                            at: 0.58,
+                            y: -1.2,
+                            draw: 0.6,
+                        },
+                        {
+                            at: 0.72,
+                            y: -1.2,
+                            draw: 0.6,
+                            opacity: -1,
+                        },
+                        {
+                            at: 0.87,
+                            opacity: -1,
+                        },
+                        {
+                            at: 1,
+                        },
+                    ],
+                },
+                {
+                    duration: 1.2,
+                    repeatAfter: 2.2,
+                    loop: false,
+                    frames: [
+                        {
+                            at: 0,
+                        },
+                        {
+                            at: 0.12,
+                            draw: -0.9,
+                        },
+                        {
+                            at: 0.6,
+                            draw: 0,
+                            scaleX: 0.04,
+                            scaleY: 0.04,
+                        },
+                        {
+                            at: 1,
+                        },
+                    ],
+                },
+            ],
+            pathStates: [
+                ['M8 13.5L11 13.5L15 13.5'],
+                ['M8 13.5L11 13.5L15 13.5'],
+                ['M8 13.5L10.7 15.5L15 12.5'],
+            ],
+            traceLength: 9,
+        },
+    ],
+};

package/dist/icons/code/code-icon.d.ts

@@ -0,0 +1,5 @@
+import type { StatefulIconProps } from "../../shared/icon-types.js";
+import { type CodeState } from "./code-rig.js";
+export { codeStates, type CodeState } from "./code-rig.js";
+export type CodeIconProps = StatefulIconProps<CodeState>;
+export declare const CodeIcon: import("react").NamedExoticComponent<CodeIconProps>;

package/dist/icons/code/code-icon.js

@@ -0,0 +1,9 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+import { ArticulatedIcon } from "../../shared/articulated-icon.js";
+import { codeArt, codeStates } from "./code-rig.js";
+export { codeStates } from "./code-rig.js";
+export const CodeIcon = memo(function CodeIcon(props) {
+    return _jsx(ArticulatedIcon, { art: codeArt, states: codeStates, ...props });
+});

package/dist/icons/code/code-rig.d.ts

@@ -0,0 +1,104 @@
+export declare const codeStates: readonly ["idle", "compiling", "ready"];
+export type CodeState = (typeof codeStates)[number];
+export declare const codeArt: {
+    readonly name: "code";
+    readonly parts: readonly [{
+        readonly name: "right-bracket";
+        readonly paths: readonly ["m16 18 6-6-6-6"];
+        readonly poses: readonly [{}, {
+            readonly x: -2.6;
+            readonly scaleY: 0.75;
+        }, {
+            readonly x: 0.5;
+            readonly scaleY: 0.85;
+        }];
+        readonly pivot: readonly [12, 12];
+        readonly gestures: readonly [null, {
+            readonly duration: 2.8;
+            readonly repeatAfter: 4.3;
+            readonly loop: true;
+            readonly frames: readonly [{
+                readonly at: 0;
+            }, {
+                readonly at: 0.42;
+            }, {
+                readonly at: 0.58;
+                readonly x: -1.1;
+                readonly scaleY: -0.12;
+            }, {
+                readonly at: 0.72;
+                readonly x: 0.35;
+                readonly scaleY: 0.08;
+            }, {
+                readonly at: 0.86;
+            }, {
+                readonly at: 1;
+            }];
+        }, {
+            readonly duration: 1.1;
+            readonly repeatAfter: 2.1;
+            readonly loop: false;
+            readonly frames: readonly [{
+                readonly at: 0;
+            }, {
+                readonly at: 0.15;
+                readonly x: -0.55;
+                readonly scaleY: -0.08;
+            }, {
+                readonly at: 0.5;
+                readonly x: 0.1;
+            }, {
+                readonly at: 1;
+            }];
+        }];
+    }, {
+        readonly name: "left-bracket";
+        readonly paths: readonly ["m8 6-6 6 6 6"];
+        readonly poses: readonly [{}, {
+            readonly x: 2.6;
+            readonly scaleY: 0.75;
+        }, {
+            readonly x: -0.5;
+            readonly scaleY: 0.85;
+        }];
+        readonly pivot: readonly [12, 12];
+        readonly gestures: readonly [null, {
+            readonly duration: 2.8;
+            readonly repeatAfter: 4.3;
+            readonly loop: true;
+            readonly frames: readonly [{
+                readonly at: 0;
+            }, {
+                readonly at: 0.08;
+            }, {
+                readonly at: 0.24;
+                readonly x: 1.1;
+                readonly scaleY: -0.12;
+            }, {
+                readonly at: 0.38;
+                readonly x: -0.35;
+                readonly scaleY: 0.08;
+            }, {
+                readonly at: 0.52;
+            }, {
+                readonly at: 1;
+            }];
+        }, {
+            readonly duration: 1.1;
+            readonly repeatAfter: 2.1;
+            readonly loop: false;
+            readonly frames: readonly [{
+                readonly at: 0;
+            }, {
+                readonly at: 0.3;
+                readonly x: 0.55;
+                readonly scaleY: -0.08;
+            }, {
+                readonly at: 0.62;
+                readonly x: -0.1;
+            }, {
+                readonly at: 1;
+            }];
+        }];
+    }];
+};

package/dist/icons/code/code-rig.js

@@ -0,0 +1,148 @@
+export const codeStates = ['idle', 'compiling', 'ready'];
+// Lucide-derived outline; attribution and pinned source: THIRD_PARTY_NOTICES.md.
+// Compile a snippet: the opening bracket checks the input, the closing bracket answers, then both align when ready. It reads as a paired exchange rather than a squeeze loop.
+export const codeArt = {
+    name: 'code',
+    parts: [
+        {
+            name: 'right-bracket',
+            paths: ['m16 18 6-6-6-6'],
+            poses: [
+                {},
+                {
+                    x: -2.6,
+                    scaleY: 0.75,
+                },
+                {
+                    x: 0.5,
+                    scaleY: 0.85,
+                },
+            ],
+            pivot: [12, 12],
+            gestures: [
+                null,
+                {
+                    duration: 2.8,
+                    repeatAfter: 4.3,
+                    loop: true,
+                    frames: [
+                        {
+                            at: 0,
+                        },
+                        {
+                            at: 0.42,
+                        },
+                        {
+                            at: 0.58,
+                            x: -1.1,
+                            scaleY: -0.12,
+                        },
+                        {
+                            at: 0.72,
+                            x: 0.35,
+                            scaleY: 0.08,
+                        },
+                        {
+                            at: 0.86,
+                        },
+                        {
+                            at: 1,
+                        },
+                    ],
+                },
+                {
+                    duration: 1.1,
+                    repeatAfter: 2.1,
+                    loop: false,
+                    frames: [
+                        {
+                            at: 0,
+                        },
+                        {
+                            at: 0.15,
+                            x: -0.55,
+                            scaleY: -0.08,
+                        },
+                        {
+                            at: 0.5,
+                            x: 0.1,
+                        },
+                        {
+                            at: 1,
+                        },
+                    ],
+                },
+            ],
+        },
+        {
+            name: 'left-bracket',
+            paths: ['m8 6-6 6 6 6'],
+            poses: [
+                {},
+                {
+                    x: 2.6,
+                    scaleY: 0.75,
+                },
+                {
+                    x: -0.5,
+                    scaleY: 0.85,
+                },
+            ],
+            pivot: [12, 12],
+            gestures: [
+                null,
+                {
+                    duration: 2.8,
+                    repeatAfter: 4.3,
+                    loop: true,
+                    frames: [
+                        {
+                            at: 0,
+                        },
+                        {
+                            at: 0.08,
+                        },
+                        {
+                            at: 0.24,
+                            x: 1.1,
+                            scaleY: -0.12,
+                        },
+                        {
+                            at: 0.38,
+                            x: -0.35,
+                            scaleY: 0.08,
+                        },
+                        {
+                            at: 0.52,
+                        },
+                        {
+                            at: 1,
+                        },
+                    ],
+                },
+                {
+                    duration: 1.1,
+                    repeatAfter: 2.1,
+                    loop: false,
+                    frames: [
+                        {
+                            at: 0,
+                        },
+                        {
+                            at: 0.3,
+                            x: 0.55,
+                            scaleY: -0.08,
+                        },
+                        {
+                            at: 0.62,
+                            x: -0.1,
+                        },
+                        {
+                            at: 1,
+                        },
+                    ],
+                },
+            ],
+        },
+    ],
+};

package/dist/icons/copy/copy-icon.d.ts

@@ -0,0 +1,5 @@
+import type { StatefulIconProps } from "../../shared/icon-types.js";
+import { type CopyState } from "./copy-rig.js";
+export { copyStates, type CopyState } from "./copy-rig.js";
+export type CopyIconProps = StatefulIconProps<CopyState>;
+export declare const CopyIcon: import("react").NamedExoticComponent<CopyIconProps>;

package/dist/icons/copy/copy-icon.js

@@ -0,0 +1,31 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useRef, useCallback } from 'react';
+import { motion, useTransform } from 'motion/react';
+import { usePoseWeight, useBehaviorClock, useActionProgress } from "../../shared/use-icon-motion.js";
+import { useMotionPreference } from "../../shared/use-motion-preference.js";
+import { COPY_BACK, COPY_FRONT, sampleCopy } from "./copy-rig.js";
+export { copyStates } from "./copy-rig.js";
+const ORIGIN = { originX: '0px', originY: '0px', transformBox: 'view-box' };
+export const CopyIcon = memo(function CopyIcon({ state = 'ready', size = 24, color = 'currentColor', accentColor = 'currentColor', strokeWidth = 1.65, speed = 1, alive = false, className, }) {
+    const reduced = useMotionPreference(), element = useRef(null);
+    const pace = Number.isFinite(speed) ? Math.min(4, Math.max(0.1, speed)) : 1;
+    const w0 = usePoseWeight(state === 'ready', pace, reduced);
+    const w1 = usePoseWeight(state === 'copying', pace, reduced);
+    const w2 = usePoseWeight(state === 'copied', pace, reduced);
+    const w3 = usePoseWeight(state === 'failed', pace, reduced);
+    const performs = alive && !reduced && (state === 'copying' || state === 'failed');
+    const life = usePoseWeight(performs, pace, reduced), time = useBehaviorClock(element, performs, pace, life);
+    const can0 = useCallback(() => w1.get() < 0.001, [w1]);
+    const e0 = useActionProgress(state === 'copying', pace, reduced, 1.05, can0);
+    const can1 = useCallback(() => w2.get() < 0.001, [w2]);
+    const e1 = useActionProgress(state === 'copied', pace, reduced, 0.8, can1);
+    const can2 = useCallback(() => w3.get() < 0.001, [w3]);
+    const e2 = useActionProgress(state === 'failed', pace, reduced, 0.9, can2);
+    const rig = useTransform(() => sampleCopy([w0.get(), w1.get(), w2.get(), w3.get()], time.get(), life.get(), e0.get(), e1.get(), e2.get()));
+    const front = useTransform(rig, (r) => r.front);
+    const check = useTransform(rig, (r) => r.check);
+    const checkOffset = useTransform(rig, (r) => r.checkOffset);
+    const failure = useTransform(rig, (r) => r.failure);
+    return (_jsx("svg", { ref: element, className: className, width: size, height: size, viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", fill: "none", stroke: color, strokeWidth: strokeWidth, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", focusable: "false", pointerEvents: "none", style: { display: 'block' }, children: _jsxs("g", { "data-layer": "copy-body", transform: "translate(12 12) scale(.84) translate(-12 -12)", children: [_jsx("path", { "data-layer": "copy-back", "data-part": "back", d: COPY_BACK }), _jsxs(motion.g, { "data-layer": "copy-front", transform: front, style: ORIGIN, children: [_jsx("path", { "data-part": "front", d: COPY_FRONT }), _jsx(motion.path, { "data-layer": "copy-check", d: "M11.5 15L14 17.5L18.5 13", opacity: check, stroke: accentColor, strokeWidth: Math.min(strokeWidth * 0.8, 1.5), strokeDasharray: "9.91", strokeDashoffset: checkOffset }), _jsx(motion.path, { "data-layer": "copy-failure", d: "M12.5 12.5L17.5 17.5M17.5 12.5L12.5 17.5", opacity: failure, strokeWidth: Math.min(strokeWidth * 0.8, 1.5) })] })] }) }));
+});

package/dist/icons/copy/copy-rig.d.ts

@@ -0,0 +1,13 @@
+export declare const copyStates: readonly ["ready", "copying", "copied", "failed"];
+export type CopyState = (typeof copyStates)[number];
+export declare const COPY_BACK = "M4 16Q2 16 2 14V4Q2 2 4 2H14Q16 2 16 4";
+export declare const COPY_FRONT = "M10 8H20Q22 8 22 10V20Q22 22 20 22H10Q8 22 8 20V10Q8 8 10 8Z";
+export declare function sampleCopy(weights: readonly number[], time?: number, alive?: number, entry?: number, successEntry?: number, failureEntry?: number): {
+    front: string;
+    scanY: number;
+    scanOpacity: number;
+    check: number;
+    checkOffset: number;
+    failure: number;
+    failureOffset: number;
+};

package/dist/icons/copy/copy-rig.js

@@ -0,0 +1,44 @@
+import { behaviorBeat } from "../../shared/behavior-curves.js";
+const clamp = (n) => Math.max(0, Math.min(1, Number.isFinite(n) ? n : 0));
+const smooth = (n) => {
+    const q = clamp(n);
+    return q * q * q * (q * (q * 6 - 15) + 10);
+};
+const normalized = (values) => {
+    const w = values.map(clamp), sum = w.reduce((a, b) => a + b, 0) || 1;
+    return w.map((v) => v / sum);
+};
+export const copyStates = ['ready', 'copying', 'copied', 'failed'];
+// Matching quadratic corners keep the two outlines registered at contact.
+export const COPY_BACK = 'M4 16Q2 16 2 14V4Q2 2 4 2H14Q16 2 16 4';
+export const COPY_FRONT = 'M10 8H20Q22 8 22 10V20Q22 22 20 22H10Q8 22 8 20V10Q8 8 10 8Z';
+export function sampleCopy(weights, time = 0, alive = 0, entry = 1, successEntry = 1, failureEntry = 1) {
+    const [, copying, copied, failed] = normalized(weights), life = clamp(alive);
+    const register = (s) => behaviorBeat(s, 0.04, 0.24, 0.1, 0.48);
+    const press = copying * ((1 - life) * register(clamp(entry) * 1.25) + life * register(time % 2.6));
+    const attempt = (s) => behaviorBeat(s, 0.03, 0.15, 0.04, 0.15);
+    const reject = (s) => behaviorBeat(s, 0.23, 0.1, 0.01, 0.42);
+    const f = clamp(failureEntry) * 1.15, loop = time % 3.1;
+    const jam = failed * ((1 - life) * attempt(f) + life * attempt(loop));
+    const kick = failed * ((1 - life) * reject(f) + life * reject(loop));
+    const dx = -copying * 0.35 - press * 5.65 - jam * 3.6 + kick * 1.4;
+    const dy = -copying * 0.35 - press * 5.65 - jam * 3.6 - kick * 0.7;
+    // Scan is an entry-only transfer cue. Its travel never depends on alive;
+    // repeated registration may continue, but toggles cannot rewind a visible scan.
+    const scanTime = clamp(entry) * 1.25;
+    return {
+        front: 'translate(' +
+            dx +
+            'px, ' +
+            dy +
+            'px) translate(15px, 15px) rotate(' +
+            kick * 6.5 +
+            'deg) translate(-15px, -15px)',
+        scanY: 8 * smooth((scanTime - 0.18) / 0.44),
+        scanOpacity: copying * behaviorBeat(scanTime, 0.18, 0.08, 0.26, 0.1),
+        check: copied,
+        checkOffset: 9.91 * (1 - smooth((successEntry - 0.08) / 0.65)),
+        failure: failed,
+        failureOffset: Math.SQRT2 * 2.5 * (1 - smooth((failureEntry - 0.3) / 0.42)),
+    };
+}

package/dist/icons/credit-card/credit-card-icon.d.ts

@@ -0,0 +1,5 @@
+import type { StatefulIconProps } from "../../shared/icon-types.js";
+import { type CreditCardState } from "./credit-card-rig.js";
+export { creditCardStates, type CreditCardState } from "./credit-card-rig.js";
+export type CreditCardIconProps = StatefulIconProps<CreditCardState>;
+export declare const CreditCardIcon: import("react").NamedExoticComponent<CreditCardIconProps>;

package/dist/icons/credit-card/credit-card-icon.js

@@ -0,0 +1,9 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+import { ArticulatedIcon } from "../../shared/articulated-icon.js";
+import { creditCardArt, creditCardStates } from "./credit-card-rig.js";
+export { creditCardStates } from "./credit-card-rig.js";
+export const CreditCardIcon = memo(function CreditCardIcon(props) {
+    return _jsx(ArticulatedIcon, { art: creditCardArt, states: creditCardStates, ...props });
+});