mythik-react 0.1.0

package/dist/animation/useShapeAnimations.js

@@ -0,0 +1,119 @@
+// useShapeAnimations (web) — Layer 3 runner for SVG-child animations.
+//
+// Consumes the same ElementAnimations contract as useElementAnimations but
+// targets an SVG child (path, circle, rect, …) via its attribute/style
+// surface. Plan 3 scope is strictly `ambient` — SVG children have no
+// hover/focus/active affordance (they don't receive pointer events in the
+// decorative-blob use case) and no mount/unmount ceremony distinct from
+// their parent element's mount.
+//
+// Why a separate hook instead of reusing useElementAnimations?
+//   - Simpler surface: no options.isHovered/isFocused/isActive, no store,
+//     no triggerUnmount. Matches Layer 3's narrow use case.
+//   - Refs typed to SVGElement so consumers (BlobLayer, icon primitives)
+//     get correct type inference.
+//   - useElementAnimations pulls in StateStore + reanimated imports that
+//     shape-level consumers don't need.
+//
+// Keyframes are registered once into the plan-2 stylesheet singleton
+// (`registerKeyframes`) and deduplicated by hash. Multiple shape instances
+// with the same recipe share one CSS rule — zero per-instance duplication.
+//
+// Cleanup: on unmount (or animations→null transition), `el.style.animation`
+// is cleared. The CSSOM keyframe rule stays registered (its cost is one
+// @keyframes block per unique recipe; global lifetime is fine).
+//
+// Performance: `options.recipes` SHOULD be a stable reference (typically
+// ANIMATION_RECIPES from core, which is module-scope). Inline object
+// literals invalidate the useMemo every render — correct but wasteful,
+// especially when a BlobLayer iterates over many blob instances.
+import { useEffect, useMemo } from 'react';
+import { resolveAnimation, buildCSSKeyframes, applyReducedMotion, toArray, } from 'mythik';
+import { registerKeyframes } from './stylesheet-singleton.js';
+import { usePrefersReducedMotion } from './usePrefersReducedMotion.js';
+/**
+ * Compose a CSS `animation` shorthand from a resolved AnimationSpec.
+ *
+ * Order matches the CSS spec:
+ *   name duration easing delay iteration-count direction fill-mode
+ *
+ * Side effect: registers the keyframes rule into the singleton stylesheet
+ * (idempotent via `registerKeyframes`'s internal dedup).
+ */
+function buildAnimationCSS(spec, staggerIndex) {
+    const built = buildCSSKeyframes(spec);
+    registerKeyframes(built.name, built.keyframesText);
+    const staggerDelay = spec.stagger ? spec.stagger.delay * (staggerIndex ?? 0) : 0;
+    const delayMs = spec.delay + staggerDelay;
+    const iterStr = spec.iterations === 'infinite' ? 'infinite' : `${spec.iterations}`;
+    return `${built.name} ${spec.duration}ms ${spec.easing} ${delayMs}ms ${iterStr} ${spec.direction} ${spec.fillMode}`;
+}
+/**
+ * Attach ambient CSS animations to an SVG child element.
+ *
+ * @param ref        Ref to an SVG element (path, circle, rect, g, …).
+ * @param animations ElementAnimations (Layer 3 reads only `ambient`) or
+ *                   null for "no animations".
+ * @param options    Recipe registry, optional stagger index, reduced-motion
+ *                   override.
+ */
+export function useShapeAnimations(ref, animations, options) {
+    const reducedMotion = usePrefersReducedMotion(options.reducedMotion);
+    // Dev-mode guard: Layer 3 scope is strictly `ambient`. If the consumer
+    // passes hover/mount/etc., the trigger is silently dropped in production
+    // (robust against being fed a full ElementAnimations object from a
+    // cascade merge). In dev we warn to surface a likely mistake — usually
+    // the consumer meant useElementAnimations. Runtime behavior unchanged.
+    if (process.env.NODE_ENV !== 'production' && animations) {
+        const extras = [];
+        for (const key of ['mount', 'unmount', 'hover', 'focus', 'active', 'stateChange']) {
+            if (key in animations && animations[key] !== undefined && animations[key] !== null) {
+                extras.push(key);
+            }
+        }
+        if (extras.length > 0) {
+            // eslint-disable-next-line no-console
+            console.warn(`useShapeAnimations: ignoring non-ambient triggers [${extras.join(', ')}]. ` +
+                'Use useElementAnimations for interactive/mount animations; shapes only support ambient.');
+        }
+    }
+    // Compose the `animation` shorthand string from every ambient entry.
+    // Memoized on inputs so a re-render with the same refs is cheap.
+    const animationCSS = useMemo(() => {
+        if (!animations)
+            return '';
+        const ambient = animations.ambient;
+        if (!ambient)
+            return '';
+        const refs = toArray(ambient);
+        const parts = [];
+        for (const animRef of refs) {
+            let spec = resolveAnimation(animRef, options.recipes);
+            if (reducedMotion) {
+                const policy = applyReducedMotion(spec, 'ambient');
+                if (policy === null)
+                    continue;
+                spec = policy;
+            }
+            parts.push(buildAnimationCSS(spec, options.staggerIndex));
+        }
+        return parts.join(', ');
+    }, [animations, options.recipes, options.staggerIndex, reducedMotion]);
+    useEffect(() => {
+        const el = ref.current;
+        if (!el)
+            return;
+        // SVG elements' `style` surface is the same property-style API as
+        // HTMLElement's for CSS animation properties in all browsers plan 3
+        // targets; jsdom mirrors that. No attribute-write path needed.
+        el.style.animation = animationCSS;
+        return () => {
+            // Graceful cleanup on unmount or next effect re-run. Accessing
+            // `el.style` post-unmount is safe — the element reference stays
+            // valid until React releases it; the DOM node is already detached
+            // so the write is a no-op.
+            el.style.animation = '';
+        };
+    }, [animationCSS, ref]);
+}
+//# sourceMappingURL=useShapeAnimations.js.map

package/dist/animation/useShapeAnimations.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useShapeAnimations.js","sourceRoot":"","sources":["../../src/animation/useShapeAnimations.ts"],"names":[],"mappings":"AAAA,sEAAsE;AACtE,EAAE;AACF,2EAA2E;AAC3E,uEAAuE;AACvE,qEAAqE;AACrE,0EAA0E;AAC1E,wEAAwE;AACxE,gCAAgC;AAChC,EAAE;AACF,+DAA+D;AAC/D,0EAA0E;AAC1E,4DAA4D;AAC5D,yEAAyE;AACzE,kCAAkC;AAClC,yEAAyE;AACzE,wCAAwC;AACxC,EAAE;AACF,qEAAqE;AACrE,2EAA2E;AAC3E,2EAA2E;AAC3E,EAAE;AACF,4EAA4E;AAC5E,wEAAwE;AACxE,gEAAgE;AAChE,EAAE;AACF,yEAAyE;AACzE,qEAAqE;AACrE,uEAAuE;AACvE,iEAAiE;AAEjE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAkB,MAAM,OAAO,CAAC;AAC3D,OAAO,EACL,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,OAAO,GAKR,MAAM,QAAQ,CAAC;AAChB,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AAWvE;;;;;;;;GAQG;AACH,SAAS,iBAAiB,CACxB,IAAmB,EACnB,YAAgC;IAEhC,MAAM,KAAK,GAAG,iBAAiB,CAAC,IAAI,CAAC,CAAC;IACtC,iBAAiB,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,CAAC;IACnD,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,GAAG,CAAC,YAAY,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACjF,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,GAAG,YAAY,CAAC;IAC1C,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,KAAK,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;IACnF,OAAO,GAAG,KAAK,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,MAAM,IAAI,CAAC,MAAM,IAAI,OAAO,MAAM,OAAO,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;AACtH,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,UAAU,kBAAkB,CAChC,GAAwB,EACxB,UAAoC,EACpC,OAAkC;IAElC,MAAM,aAAa,GAAG,uBAAuB,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IAErE,uEAAuE;IACvE,yEAAyE;IACzE,mEAAmE;IACnE,uEAAuE;IACvE,uEAAuE;IACvE,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,IAAI,UAAU,EAAE,CAAC;QACxD,MAAM,MAAM,GAAa,EAAE,CAAC;QAC5B,KAAK,MAAM,GAAG,IAAI,CAAC,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,aAAa,CAAU,EAAE,CAAC;YAC3F,IAAI,GAAG,IAAI,UAAU,IAAI,UAAU,CAAC,GAAG,CAAC,KAAK,SAAS,IAAI,UAAU,CAAC,GAAG,CAAC,KAAK,IAAI,EAAE,CAAC;gBACnF,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACnB,CAAC;QACH,CAAC;QACD,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACtB,sCAAsC;YACtC,OAAO,CAAC,IAAI,CACV,sDAAsD,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK;gBAC1E,yFAAyF,CAC5F,CAAC;QACJ,CAAC;IACH,CAAC;IAED,qEAAqE;IACrE,iEAAiE;IACjE,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE;QAChC,IAAI,CAAC,UAAU;YAAE,OAAO,EAAE,CAAC;QAC3B,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;QACnC,IAAI,CAAC,OAAO;YAAE,OAAO,EAAE,CAAC;QAExB,MAAM,IAAI,GAAmB,OAAO,CAAC,OAAO,CAAC,CAAC;QAC9C,MAAM,KAAK,GAAa,EAAE,CAAC;QAC3B,KAAK,MAAM,OAAO,IAAI,IAAI,EAAE,CAAC;YAC3B,IAAI,IAAI,GAAG,gBAAgB,CAAC,OAAO,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC;YACtD,IAAI,aAAa,EAAE,CAAC;gBAClB,MAAM,MAAM,GAAG,kBAAkB,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;gBACnD,IAAI,MAAM,KAAK,IAAI;oBAAE,SAAS;gBAC9B,IAAI,GAAG,MAAM,CAAC;YAChB,CAAC;YACD,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC;QAC5D,CAAC;QACD,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,CAAC,OAAO,EAAE,OAAO,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC,CAAC;IAEvE,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,GAAG,GAAG,CAAC,OAAO,CAAC;QACvB,IAAI,CAAC,EAAE;YAAE,OAAO;QAChB,kEAAkE;QAClE,oEAAoE;QACpE,+DAA+D;QAC/D,EAAE,CAAC,KAAK,CAAC,SAAS,GAAG,YAAY,CAAC;QAClC,OAAO,GAAG,EAAE;YACV,+DAA+D;YAC/D,gEAAgE;YAChE,kEAAkE;YAClE,2BAA2B;YAC3B,EAAE,CAAC,KAAK,CAAC,SAAS,GAAG,EAAE,CAAC;QAC1B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,YAAY,EAAE,GAAG,CAAC,CAAC,CAAC;AAC1B,CAAC"}

package/dist/app-context.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { AppEngine } from 'mythik';
+import type { MythikInstance } from 'mythik';
+import type { SpecStore } from 'mythik';
+import type { SpecRuntime } from 'mythik';
+export interface AppContextValue {
+    appEngine: AppEngine;
+    svc: MythikInstance;
+    specStore: SpecStore;
+    fetcher?: (url: string, options?: RequestInit) => Promise<Response>;
+    onSpecRuntimeMount?: (runtime: SpecRuntime | null) => void;
+}
+export declare const AppContext: React.Context<AppContextValue | null>;
+export declare function useAppContext(): AppContextValue;
+//# sourceMappingURL=app-context.d.ts.map

package/dist/app-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-context.d.ts","sourceRoot":"","sources":["../src/app-context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,QAAQ,CAAC;AAC7C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAE1C,MAAM,WAAW,eAAe;IAC9B,SAAS,EAAE,SAAS,CAAC;IACrB,GAAG,EAAE,cAAc,CAAC;IACpB,SAAS,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,OAAO,CAAC,QAAQ,CAAC,CAAC;IACpE,kBAAkB,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;CAC5D;AAED,eAAO,MAAM,UAAU,uCAAoD,CAAC;AAE5E,wBAAgB,aAAa,IAAI,eAAe,CAI/C"}

package/dist/app-context.js

@@ -0,0 +1,9 @@
+import React from 'react';
+export const AppContext = React.createContext(null);
+export function useAppContext() {
+    const ctx = React.useContext(AppContext);
+    if (!ctx)
+        throw new Error('useAppContext must be used inside <MythikApp>');
+    return ctx;
+}
+//# sourceMappingURL=app-context.js.map

package/dist/app-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"app-context.js","sourceRoot":"","sources":["../src/app-context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,aAAa,CAAyB,IAAI,CAAC,CAAC;AAE5E,MAAM,UAAU,aAAa;IAC3B,MAAM,GAAG,GAAG,KAAK,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC;IACzC,IAAI,CAAC,GAAG;QAAE,MAAM,IAAI,KAAK,CAAC,+CAA+C,CAAC,CAAC;IAC3E,OAAO,GAAG,CAAC;AACb,CAAC"}

package/dist/background/BackgroundLayer.d.ts

@@ -0,0 +1,7 @@
+import type { LayerSpec } from 'mythik';
+interface BackgroundLayerProps {
+    spec: LayerSpec;
+}
+export declare function BackgroundLayer({ spec }: BackgroundLayerProps): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=BackgroundLayer.d.ts.map

package/dist/background/BackgroundLayer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackgroundLayer.d.ts","sourceRoot":"","sources":["../../src/background/BackgroundLayer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAExC,UAAU,oBAAoB;IAC5B,IAAI,EAAE,SAAS,CAAC;CACjB;AAkBD,wBAAgB,eAAe,CAAC,EAAE,IAAI,EAAE,EAAE,oBAAoB,kDA2D7D"}

package/dist/background/BackgroundLayer.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+function commonStyle(spec) {
+    return {
+        position: 'absolute',
+        inset: 0,
+        opacity: spec.common.opacity,
+        mixBlendMode: spec.common.blendMode === 'normal' ? undefined : spec.common.blendMode,
+        zIndex: spec.common.zIndex,
+        pointerEvents: 'none',
+    };
+}
+function extractPatternId(svg) {
+    const match = svg.match(/<pattern\s+id="([^"]+)"/);
+    return match ? match[1] : 'unknown';
+}
+export function BackgroundLayer({ spec }) {
+    switch (spec.kind) {
+        case 'solid':
+            return _jsx("div", { style: { ...commonStyle(spec), backgroundColor: spec.color } });
+        case 'gradient':
+            return _jsx("div", { style: { ...commonStyle(spec), backgroundImage: spec.css } });
+        case 'image':
+            return (_jsx("div", { style: {
+                    ...commonStyle(spec),
+                    backgroundImage: `url(${spec.url})`,
+                    backgroundSize: spec.size,
+                    backgroundPosition: spec.position,
+                    backgroundRepeat: spec.repeat,
+                } }));
+        case 'pattern': {
+            const id = extractPatternId(spec.svg);
+            const innerHTML = `<defs>${spec.svg}</defs><rect width="100%" height="100%" fill="url(#${id})"/>`;
+            return (_jsx("svg", { style: commonStyle(spec), xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", dangerouslySetInnerHTML: { __html: innerHTML } }));
+        }
+        case 'grain':
+            return (_jsx("svg", { style: commonStyle(spec), xmlns: "http://www.w3.org/2000/svg", width: "100%", height: "100%", dangerouslySetInnerHTML: { __html: spec.svg } }));
+        case 'blobs':
+            // Plan 3 Task 16 stub — renders a placeholder div that carries common
+            // style. Task 18 replaces this branch with <BlobLayer /> which resolves
+            // palette + BLOB_CATALOG + motion → ambient animations and mounts an
+            // <svg> root with per-blob <path>/<circle> + useShapeAnimations.
+            return _jsx("div", { "data-sv-layer": "blobs", style: commonStyle(spec) });
+        default: {
+            const _exhaustive = spec;
+            void _exhaustive;
+            return null;
+        }
+    }
+}
+//# sourceMappingURL=BackgroundLayer.js.map

package/dist/background/BackgroundLayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackgroundLayer.js","sourceRoot":"","sources":["../../src/background/BackgroundLayer.tsx"],"names":[],"mappings":";AAQA,SAAS,WAAW,CAAC,IAAe;IAClC,OAAO;QACL,QAAQ,EAAE,UAAU;QACpB,KAAK,EAAE,CAAC;QACR,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO;QAC5B,YAAY,EAAE,IAAI,CAAC,MAAM,CAAC,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS;QACpF,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM;QAC1B,aAAa,EAAE,MAAM;KACtB,CAAC;AACJ,CAAC;AAED,SAAS,gBAAgB,CAAC,GAAW;IACnC,MAAM,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC,yBAAyB,CAAC,CAAC;IACnD,OAAO,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;AACtC,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,EAAE,IAAI,EAAwB;IAC5D,QAAQ,IAAI,CAAC,IAAI,EAAE,CAAC;QAClB,KAAK,OAAO;YACV,OAAO,cAAK,KAAK,EAAE,EAAE,GAAG,WAAW,CAAC,IAAI,CAAC,EAAE,eAAe,EAAE,IAAI,CAAC,KAAK,EAAE,GAAI,CAAC;QAE/E,KAAK,UAAU;YACb,OAAO,cAAK,KAAK,EAAE,EAAE,GAAG,WAAW,CAAC,IAAI,CAAC,EAAE,eAAe,EAAE,IAAI,CAAC,GAAG,EAAE,GAAI,CAAC;QAE7E,KAAK,OAAO;YACV,OAAO,CACL,cACE,KAAK,EAAE;oBACL,GAAG,WAAW,CAAC,IAAI,CAAC;oBACpB,eAAe,EAAE,OAAO,IAAI,CAAC,GAAG,GAAG;oBACnC,cAAc,EAAE,IAAI,CAAC,IAAI;oBACzB,kBAAkB,EAAE,IAAI,CAAC,QAAQ;oBACjC,gBAAgB,EAAE,IAAI,CAAC,MAAM;iBAC9B,GACD,CACH,CAAC;QAEJ,KAAK,SAAS,CAAC,CAAC,CAAC;YACf,MAAM,EAAE,GAAG,gBAAgB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACtC,MAAM,SAAS,GAAG,SAAS,IAAI,CAAC,GAAG,sDAAsD,EAAE,MAAM,CAAC;YAClG,OAAO,CACL,cACE,KAAK,EAAE,WAAW,CAAC,IAAI,CAAC,EACxB,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,uBAAuB,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,GAC9C,CACH,CAAC;QACJ,CAAC;QAED,KAAK,OAAO;YACV,OAAO,CACL,cACE,KAAK,EAAE,WAAW,CAAC,IAAI,CAAC,EACxB,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,MAAM,EACZ,MAAM,EAAC,MAAM,EACb,uBAAuB,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,GAAG,EAAE,GAC7C,CACH,CAAC;QAEJ,KAAK,OAAO;YACV,sEAAsE;YACtE,wEAAwE;YACxE,qEAAqE;YACrE,iEAAiE;YACjE,OAAO,+BAAmB,OAAO,EAAC,KAAK,EAAE,WAAW,CAAC,IAAI,CAAC,GAAI,CAAC;QAEjE,OAAO,CAAC,CAAC,CAAC;YACR,MAAM,WAAW,GAAU,IAAI,CAAC;YAChC,KAAK,WAAW,CAAC;YACjB,OAAO,IAAI,CAAC;QACd,CAAC;IACH,CAAC;AACH,CAAC"}

package/dist/background/BackgroundStack.d.ts

@@ -0,0 +1,19 @@
+import type { LayerBackground } from 'mythik';
+interface BackgroundStackProps {
+    background?: LayerBackground | string;
+    /**
+     * Palette source for blob layers (plan 3 Task 18). Without it, blob layers
+     * fall through to the BackgroundLayer stub which renders an empty
+     * positioned div (layer geometry stays consistent; no shapes paint). A dev-
+     * mode warning fires per render so Task 20 misuse (forgetting to thread
+     * tokens) doesn't fail silently. MythikRenderer populates this from
+     * resolved tokens in Task 20.
+     */
+    palette?: {
+        primary: string;
+        accent: string;
+    };
+}
+export declare function BackgroundStack({ background, palette }: BackgroundStackProps): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=BackgroundStack.d.ts.map

package/dist/background/BackgroundStack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackgroundStack.d.ts","sourceRoot":"","sources":["../../src/background/BackgroundStack.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAA2B,MAAM,QAAQ,CAAC;AAIvE,UAAU,oBAAoB;IAC5B,UAAU,CAAC,EAAE,eAAe,GAAG,MAAM,CAAC;IACtC;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;CAC/C;AAED,wBAAgB,eAAe,CAAC,EAAE,UAAU,EAAE,OAAO,EAAE,EAAE,oBAAoB,kDAgB5E"}

package/dist/background/BackgroundStack.js

@@ -0,0 +1,59 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { resolveBackgroundLayers, BACKGROUND_RECIPES } from 'mythik';
+import { BackgroundLayer } from './BackgroundLayer.js';
+import { BlobLayer } from './BlobLayer.js';
+export function BackgroundStack({ background, palette }) {
+    if (!background)
+        return null;
+    const config = typeof background === 'string' ? BACKGROUND_RECIPES[background] : background;
+    if (!config)
+        return null;
+    const specs = resolveBackgroundLayers(config);
+    if (!specs.length)
+        return null;
+    return (_jsx(_Fragment, { children: specs.map((spec, i) => renderLayer(spec, i, palette)) }));
+}
+/**
+ * Dispatch layer rendering: blob layers with a palette bypass BackgroundLayer
+ * entirely and mount <BlobLayer>; everything else (including blobs without a
+ * palette) goes through the generic BackgroundLayer path. The blob branch also
+ * maps BlobsLayerConfig.blobOpacity → BlobV2Config.opacity (the per-blob fill
+ * default) and strips layer-level fields (type/opacity/blendMode/zIndex) that
+ * don't belong inside resolveBlobLayer.
+ */
+function renderLayer(spec, i, palette) {
+    if (spec.kind === 'blobs' && !palette && process.env.NODE_ENV !== 'production') {
+        // Review M3 — surface the fallback so Task 20 misuse (forgetting to
+        // thread tokens through MythikRenderer) doesn't fail silently with an
+        // invisible blob layer. Only the preview/test harness legitimately hits
+        // this path without tokens; warn once per render.
+        // eslint-disable-next-line no-console
+        console.warn('BackgroundStack (web): blobs layer rendered without palette — falling back to empty stub. Pass the `palette` prop (typically `{ primary, accent }` from resolved tokens) to enable blob rendering.');
+    }
+    if (spec.kind === 'blobs' && palette) {
+        return (_jsx("div", { "data-sv-layer": "blobs", style: {
+                position: 'absolute',
+                inset: 0,
+                opacity: spec.common.opacity,
+                mixBlendMode: spec.common.blendMode === 'normal' ? undefined : spec.common.blendMode,
+                zIndex: spec.common.zIndex,
+                pointerEvents: 'none',
+            }, children: _jsx(BlobLayer, { config: toBlobV2Config(spec.config), palette: palette }) }, `bg-layer-${i}`));
+    }
+    return _jsx(BackgroundLayer, { spec: spec }, `bg-layer-${i}`);
+}
+/**
+ * Strip layer-level fields from BlobsLayerConfig and promote `blobOpacity` to
+ * the BlobV2Config.opacity slot that resolveBlobLayer consumes. Keeps the two
+ * opacity axes (layer-container vs per-blob fill) cleanly separated at the
+ * type boundary — see BlobsLayerConfig docstring.
+ */
+function toBlobV2Config(layerConfig) {
+    const { type: _type, opacity: _layerOpacity, blendMode: _blendMode, zIndex: _zIndex, blobOpacity, ...rest } = layerConfig;
+    void _type;
+    void _layerOpacity;
+    void _blendMode;
+    void _zIndex;
+    return blobOpacity !== undefined ? { ...rest, opacity: blobOpacity } : rest;
+}
+//# sourceMappingURL=BackgroundStack.js.map

package/dist/background/BackgroundStack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackgroundStack.js","sourceRoot":"","sources":["../../src/background/BackgroundStack.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,uBAAuB,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAC;AAErE,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAe3C,MAAM,UAAU,eAAe,CAAC,EAAE,UAAU,EAAE,OAAO,EAAwB;IAC3E,IAAI,CAAC,UAAU;QAAE,OAAO,IAAI,CAAC;IAE7B,MAAM,MAAM,GACV,OAAO,UAAU,KAAK,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC;IAE/E,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAEzB,MAAM,KAAK,GAAG,uBAAuB,CAAC,MAAM,CAAC,CAAC;IAC9C,IAAI,CAAC,KAAK,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IAE/B,OAAO,CACL,4BACG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,EAAE,OAAO,CAAC,CAAC,GACrD,CACJ,CAAC;AACJ,CAAC;AAED;;;;;;;GAOG;AACH,SAAS,WAAW,CAClB,IAAe,EACf,CAAS,EACT,OAAwC;IAExC,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE,CAAC;QAC/E,oEAAoE;QACpE,sEAAsE;QACtE,wEAAwE;QACxE,kDAAkD;QAClD,sCAAsC;QACtC,OAAO,CAAC,IAAI,CACV,oMAAoM,CACrM,CAAC;IACJ,CAAC;IACD,IAAI,IAAI,CAAC,IAAI,KAAK,OAAO,IAAI,OAAO,EAAE,CAAC;QACrC,OAAO,CACL,+BAEgB,OAAO,EACrB,KAAK,EAAE;gBACL,QAAQ,EAAE,UAAU;gBACpB,KAAK,EAAE,CAAC;gBACR,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO;gBAC5B,YAAY,EAAE,IAAI,CAAC,MAAM,CAAC,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS;gBACpF,MAAM,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM;gBAC1B,aAAa,EAAE,MAAM;aACtB,YAED,KAAC,SAAS,IAAC,MAAM,EAAE,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,GAAI,IAX/D,YAAY,CAAC,EAAE,CAYhB,CACP,CAAC;IACJ,CAAC;IACD,OAAO,KAAC,eAAe,IAAuB,IAAI,EAAE,IAAI,IAA3B,YAAY,CAAC,EAAE,CAAgB,CAAC;AAC/D,CAAC;AAED;;;;;GAKG;AACH,SAAS,cAAc,CACrB,WAA4D;IAE5D,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,IAAI,EAAE,GAAG,WAAW,CAAC;IAC1H,KAAK,KAAK,CAAC;IAAC,KAAK,aAAa,CAAC;IAAC,KAAK,UAAU,CAAC;IAAC,KAAK,OAAO,CAAC;IAC9D,OAAO,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;AAC9E,CAAC"}

package/dist/background/BlobLayer.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { type BlobV2Config } from 'mythik';
+interface BlobLayerProps {
+    config: BlobV2Config;
+    palette: {
+        primary: string;
+        accent: string;
+    };
+}
+export declare function BlobLayer({ config, palette }: BlobLayerProps): React.ReactElement;
+export {};
+//# sourceMappingURL=BlobLayer.d.ts.map

package/dist/background/BlobLayer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlobLayer.d.ts","sourceRoot":"","sources":["../../src/background/BlobLayer.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAC/C,OAAO,EAGL,KAAK,YAAY,EAElB,MAAM,QAAQ,CAAC;AAGhB,UAAU,cAAc;IACtB,MAAM,EAAE,YAAY,CAAC;IACrB,OAAO,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,CAAC;CAC9C;AAED,wBAAgB,SAAS,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,cAAc,GAAG,KAAK,CAAC,YAAY,CAajF"}

package/dist/background/BlobLayer.js

@@ -0,0 +1,60 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+// Plan 3 Task 18 — web BlobLayer.
+//
+// Consumes a BlobV2Config (explicit `blobs[]` or preset form) + a {primary,
+// accent} palette and mounts one <svg><path/></svg> per resolved BlobSpec.
+// Each path receives a ref that drives ambient motion through Layer 3's
+// `useShapeAnimations` hook (drift/rotate/scale → CSS @keyframes registered
+// once, dedup'd by recipe hash). Rendering is JSX-native — no
+// dangerouslySetInnerHTML — so React handles all escaping and the legacy
+// XSS surface (box.tsx:127 + resolveBlobStyles) is closed.
+//
+// Placement: this component emits a React fragment of positioned <svg>
+// elements (absolute with per-blob left/top/width/height). The caller
+// (BackgroundStack) provides the compositing wrapper div that applies
+// LayerCommonProps opacity/blendMode/zIndex; BlobLayer only handles the
+// blob-level styling.
+//
+// BlobV2Config.opacity (per-blob fill default) flows through resolveBlobLayer
+// and lands on each BlobRenderStyle.opacity → the `opacity` attribute on the
+// outer <svg>. Layer-container opacity lives separately on the caller's
+// wrapper. See BlobsLayerConfig.blobOpacity docstring for the naming
+// rationale at the layer-type surface.
+import { useMemo, useRef } from 'react';
+import { resolveBlobLayer, ANIMATION_RECIPES, } from 'mythik';
+import { useShapeAnimations } from '../animation/useShapeAnimations.js';
+export function BlobLayer({ config, palette }) {
+    // Task 19 review I1 (fix applied to web for parity) — resolveBlobLayer
+    // returns fresh BlobSpec references per call; each spec.animations drives a
+    // useShapeAnimations useMemo. Without this memo, every parent render
+    // cascades into an O(N) resolve across all blobs and keyframe re-register.
+    const specs = useMemo(() => resolveBlobLayer(config, palette), [config, palette]);
+    return (_jsx(_Fragment, { children: specs.map((spec, i) => (_jsx(BlobSvg, { spec: spec }, i))) }));
+}
+/**
+ * Per-blob <svg> wrapping a single <path>. The ref binds useShapeAnimations
+ * to the path element (ambient trigger only; see useShapeAnimations docstring
+ * for the Layer 3 scope narrowing).
+ *
+ * Why the ref targets <path> not <svg>: the keyframes transform
+ * (translate/rotate/scale) should apply to the shape geometry itself so
+ * layered blur and outer positioning remain stable. If we animated the <svg>
+ * root the wrapper div's position would shift under us, producing scroll-
+ * equivalent artifacts.
+ */
+function BlobSvg({ spec }) {
+    const ref = useRef(null);
+    useShapeAnimations(ref, spec.animations, { recipes: ANIMATION_RECIPES });
+    const { style, shape } = spec;
+    return (_jsx("svg", { viewBox: shape.viewBox, style: {
+            position: 'absolute',
+            left: style.position.x,
+            top: style.position.y,
+            width: style.size.width,
+            height: style.size.height,
+            transform: style.rotation ? `rotate(${style.rotation})` : undefined,
+            filter: style.blur > 0 ? `blur(${style.blur}px)` : undefined,
+            pointerEvents: 'none',
+        }, opacity: style.opacity, "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { ref: ref, d: shape.path, fill: style.color }) }));
+}
+//# sourceMappingURL=BlobLayer.js.map

package/dist/background/BlobLayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlobLayer.js","sourceRoot":"","sources":["../../src/background/BlobLayer.tsx"],"names":[],"mappings":";AAAA,kCAAkC;AAClC,EAAE;AACF,4EAA4E;AAC5E,2EAA2E;AAC3E,wEAAwE;AACxE,4EAA4E;AAC5E,8DAA8D;AAC9D,yEAAyE;AACzE,2DAA2D;AAC3D,EAAE;AACF,uEAAuE;AACvE,sEAAsE;AACtE,sEAAsE;AACtE,wEAAwE;AACxE,sBAAsB;AACtB,EAAE;AACF,8EAA8E;AAC9E,6EAA6E;AAC7E,wEAAwE;AACxE,qEAAqE;AACrE,uCAAuC;AAEvC,OAAc,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,EACL,gBAAgB,EAChB,iBAAiB,GAGlB,MAAM,QAAQ,CAAC;AAChB,OAAO,EAAE,kBAAkB,EAAE,MAAM,oCAAoC,CAAC;AAOxE,MAAM,UAAU,SAAS,CAAC,EAAE,MAAM,EAAE,OAAO,EAAkB;IAC3D,uEAAuE;IACvE,4EAA4E;IAC5E,qEAAqE;IACrE,2EAA2E;IAC3E,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAClF,OAAO,CACL,4BACG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CACtB,KAAC,OAAO,IAAS,IAAI,EAAE,IAAI,IAAb,CAAC,CAAgB,CAChC,CAAC,GACD,CACJ,CAAC;AACJ,CAAC;AAED;;;;;;;;;;GAUG;AACH,SAAS,OAAO,CAAC,EAAE,IAAI,EAAsB;IAC3C,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,kBAAkB,CAAC,GAAG,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,OAAO,EAAE,iBAAiB,EAAE,CAAC,CAAC;IAEzE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IAE9B,OAAO,CACL,cACE,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;YACtB,GAAG,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;YACrB,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,KAAK;YACvB,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,MAAM;YACzB,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,KAAK,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC,SAAS;YACnE,MAAM,EAAE,KAAK,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,KAAK,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,SAAS;YAC5D,aAAa,EAAE,MAAM;SACtB,EACD,OAAO,EAAE,KAAK,CAAC,OAAO,iBACV,MAAM,EAClB,KAAK,EAAC,4BAA4B,YAElC,eAAM,GAAG,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,KAAK,GAAI,GAChD,CACP,CAAC;AACJ,CAAC"}

package/dist/background/index.d.ts

@@ -0,0 +1,3 @@
+export { BackgroundLayer } from './BackgroundLayer.js';
+export { BackgroundStack } from './BackgroundStack.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/background/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/background/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/background/index.js

@@ -0,0 +1,3 @@
+export { BackgroundLayer } from './BackgroundLayer.js';
+export { BackgroundStack } from './BackgroundStack.js';
+//# sourceMappingURL=index.js.map

package/dist/background/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/background/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/css-hover.d.ts

@@ -0,0 +1,15 @@
+export declare function needsMotionWrapper(...fields: (Record<string, unknown> | undefined)[]): boolean;
+interface InteractionFields {
+    hover?: Record<string, unknown>;
+    active?: Record<string, unknown>;
+    focus?: Record<string, unknown>;
+    transition?: {
+        duration?: number;
+        ease?: string;
+        delay?: number;
+    };
+}
+export declare function generateHoverCSS(className: string, fields: InteractionFields): string;
+export declare function hashId(elementId: string): string;
+export {};
+//# sourceMappingURL=css-hover.d.ts.map

package/dist/css-hover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"css-hover.d.ts","sourceRoot":"","sources":["../src/css-hover.ts"],"names":[],"mappings":"AAEA,wBAAgB,kBAAkB,CAChC,GAAG,MAAM,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,CAAC,EAAE,GACjD,OAAO,CAQT;AAmBD,UAAU,iBAAiB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAChC,UAAU,CAAC,EAAE;QAAE,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;CACnE;AAED,wBAAgB,gBAAgB,CAAC,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,iBAAiB,GAAG,MAAM,CAarF;AAED,wBAAgB,MAAM,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAQhD"}

package/dist/css-hover.js

@@ -0,0 +1,51 @@
+const MOTION_ONLY_PROPS = new Set(['scale', 'scaleX', 'scaleY', 'rotate', 'x', 'y']);
+export function needsMotionWrapper(...fields) {
+    for (const field of fields) {
+        if (!field)
+            continue;
+        for (const key of Object.keys(field)) {
+            if (MOTION_ONLY_PROPS.has(key))
+                return true;
+        }
+    }
+    return false;
+}
+const EASE_MAP = {
+    linear: 'linear',
+    easeIn: 'ease-in',
+    easeOut: 'ease-out',
+    easeInOut: 'ease-in-out',
+};
+function toKebab(str) {
+    return str.replace(/[A-Z]/g, (m) => `-${m.toLowerCase()}`);
+}
+function buildDeclarations(style) {
+    return Object.entries(style)
+        .map(([key, value]) => `${toKebab(key)}: ${value}`)
+        .join('; ');
+}
+export function generateHoverCSS(className, fields) {
+    const rules = [];
+    const duration = fields.transition?.duration ?? 150;
+    const ease = EASE_MAP[fields.transition?.ease ?? 'easeOut'] ?? 'ease-out';
+    const delay = fields.transition?.delay ?? 0;
+    const transitionValue = `all ${duration}ms ${ease}${delay ? ` ${delay}ms` : ''}`;
+    rules.push(`.${className} { transition: ${transitionValue}; }`);
+    if (fields.hover)
+        rules.push(`.${className}:hover { ${buildDeclarations(fields.hover)}; }`);
+    if (fields.active)
+        rules.push(`.${className}:active { ${buildDeclarations(fields.active)}; }`);
+    if (fields.focus)
+        rules.push(`.${className}:focus-visible { ${buildDeclarations(fields.focus)}; }`);
+    return rules.join('\n');
+}
+export function hashId(elementId) {
+    // FNV-1a 32-bit for better distribution on short strings
+    let hash = 0x811c9dc5;
+    for (let i = 0; i < elementId.length; i++) {
+        hash ^= elementId.charCodeAt(i);
+        hash = (hash * 0x01000193) | 0;
+    }
+    return `sv-${(hash >>> 0).toString(36)}`;
+}
+//# sourceMappingURL=css-hover.js.map

package/dist/css-hover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css-hover.js","sourceRoot":"","sources":["../src/css-hover.ts"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -0,0 +1,10 @@
+export { MythikRenderer } from './MythikRenderer.js';
+export { registerReactPrimitives, PRIMITIVES } from './primitives/index.js';
+export { Box, Text, Image, Icon, Stack, Grid, Scroll, Divider, Spacer } from './primitives/index.js';
+export { Input, Textarea, Select, Checkbox, Toggle, Slider } from './primitives/index.js';
+export { Button, Touchable, List } from './primitives/index.js';
+export { MythikApp, createAuthSpecStore } from './MythikApp.js';
+export { AppContext, useAppContext } from './app-context.js';
+export { createSupabaseAuthProvider, createCustomJWTProvider, createMockAuthProvider } from 'mythik';
+export type { AuthProvider, AuthUser, AuthResult, AuthEvent } from 'mythik';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,uBAAuB,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAC5E,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AACrG,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC1F,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAG7D,OAAO,EAAE,0BAA0B,EAAE,uBAAuB,EAAE,sBAAsB,EAAE,MAAM,QAAQ,CAAC;AACrG,YAAY,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC"}

package/dist/index.js

@@ -0,0 +1,11 @@
+// mythik-react — public API
+export { MythikRenderer } from './MythikRenderer.js';
+export { registerReactPrimitives, PRIMITIVES } from './primitives/index.js';
+export { Box, Text, Image, Icon, Stack, Grid, Scroll, Divider, Spacer } from './primitives/index.js';
+export { Input, Textarea, Select, Checkbox, Toggle, Slider } from './primitives/index.js';
+export { Button, Touchable, List } from './primitives/index.js';
+export { MythikApp, createAuthSpecStore } from './MythikApp.js';
+export { AppContext, useAppContext } from './app-context.js';
+// Re-export auth providers for convenience (scaffolding imports from mythik-react)
+export { createSupabaseAuthProvider, createCustomJWTProvider, createMockAuthProvider } from 'mythik';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,4BAA4B;AAC5B,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,uBAAuB,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAC5E,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AACrG,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC1F,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,gBAAgB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAE7D,mFAAmF;AACnF,OAAO,EAAE,0BAA0B,EAAE,uBAAuB,EAAE,sBAAsB,EAAE,MAAM,QAAQ,CAAC"}

package/dist/primitives/accordion.d.ts

@@ -0,0 +1,12 @@
+import type { CSSProperties, ReactNode } from 'react';
+interface AccordionProps {
+    title?: string;
+    defaultOpen?: boolean;
+    badge?: string | number | boolean;
+    style?: CSSProperties;
+    _tokens?: Record<string, unknown>;
+    children?: ReactNode;
+}
+export declare function Accordion({ title, defaultOpen, badge, style, _tokens, children }: AccordionProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=accordion.d.ts.map

package/dist/primitives/accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../src/primitives/accordion.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtD,UAAU,cAAc;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;IAClC,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAClC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,SAAS,CAAC,EAAE,KAAU,EAAE,WAAmB,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,cAAc,2CA2C7G"}

package/dist/primitives/accordion.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { useDesignTokens } from './use-design-tokens.js';
+export function Accordion({ title = '', defaultOpen = false, badge, style, _tokens, children }) {
+    const [open, setOpen] = React.useState(defaultOpen);
+    const t = useDesignTokens(_tokens);
+    const showBadge = badge !== undefined && badge !== 0 && badge !== '' && badge !== false;
+    return (_jsxs("div", { style: { borderRadius: t.radius(t.shape.radius.md), color: t.colors.text, ...t.surface.card, ...style }, children: [_jsxs("button", { type: "button", "aria-expanded": open, onClick: () => setOpen(!open), style: {
+                    width: '100%', padding: `${t.spacing.scale.sm + t.spacing.unit}px ${t.spacing.scale.md}px`, display: 'flex',
+                    justifyContent: 'space-between', alignItems: 'center',
+                    border: 'none', backgroundColor: 'transparent', color: 'inherit',
+                    cursor: 'pointer', fontSize: t.typography.scale.md.fontSize, fontWeight: t.typography.weight.medium, fontFamily: t.typography.fontFamily.base,
+                }, children: [_jsx("span", { children: title }), _jsxs("span", { style: { display: 'flex', alignItems: 'center', gap: '8px' }, children: [showBadge && (_jsx("span", { "data-badge": true, style: {
+                                    backgroundColor: t.colors.primary,
+                                    color: '#fff',
+                                    padding: badge === true ? '0' : '1px 8px',
+                                    width: badge === true ? '8px' : undefined,
+                                    height: badge === true ? '8px' : undefined,
+                                    borderRadius: t.radius(t.shape.radius.full),
+                                    fontSize: '0.75em',
+                                    fontWeight: 600,
+                                    display: 'inline-block',
+                                }, children: badge === true ? '' : badge })), _jsx("span", { style: { transform: open ? 'rotate(180deg)' : 'rotate(0)', transition: `transform ${t.motion.duration.fast}ms` }, children: "\u25BC" })] })] }), open && _jsx("div", { style: { padding: `0 ${t.spacing.scale.md}px ${t.spacing.scale.md}px` }, children: children })] }));
+}
+//# sourceMappingURL=accordion.js.map

package/dist/primitives/accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.js","sourceRoot":"","sources":["../../src/primitives/accordion.tsx"],"names":[],"mappings":"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"}

package/dist/primitives/area-chart.d.ts

@@ -0,0 +1,14 @@
+import type { CSSProperties } from 'react';
+interface AreaChartDataPoint {
+    label: string;
+    value: number;
+}
+interface AreaChartProps {
+    data?: AreaChartDataPoint[];
+    height?: number;
+    color?: string;
+    style?: CSSProperties;
+}
+export declare function AreaChart({ data, height, color, style }: AreaChartProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=area-chart.d.ts.map

package/dist/primitives/area-chart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"area-chart.d.ts","sourceRoot":"","sources":["../../src/primitives/area-chart.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,UAAU,kBAAkB;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,cAAc;IACtB,IAAI,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED,wBAAgB,SAAS,CAAC,EAAE,IAAS,EAAE,MAAY,EAAE,KAAiB,EAAE,KAAK,EAAE,EAAE,cAAc,2CAyB9F"}