/* PRAXIS Loop — shared instrument primitives + app chrome */
/* global React */
const { useState, useEffect, useRef } = React;
/* ── hooks ──────────────────────────────────────────────────────────────── */
function useCountUp(target, dur = 1200, start = 0, delay = 0) {
const [v, setV] = useState(start);
useEffect(() => {
// interval-based (not rAF) so it completes even in throttled/hidden frames
const t0 = performance.now() + delay;
const ease = t => 1 - Math.pow(1 - t, 3);
const iv = setInterval(() => {
const el = performance.now() - t0;
if (el < 0) return;
const t = Math.min(1, el / dur);
setV(start + (target - start) * ease(t));
if (t >= 1) clearInterval(iv);
}, 33);
return () => clearInterval(iv);
}, [target, dur, start, delay]);
return v;
}
/* ── atoms ──────────────────────────────────────────────────────────────── */
function Kicker({ children, tone, style }) {
return {children}
;
}
function Chip({ children, tone = 'neutral' }) {
return {children};
}
function MasteryBar({ value, height = 4, animate = true }) {
const color = window.PRAXIS.ramp(value);
return (
= 75 ? 'rgba(63,216,192,0.5)' : 'transparent'}`,
transition: animate ? 'width 900ms cubic-bezier(0.16,1,0.3,1)' : 'none' }}>
);
}
function Ring({ value, size = 200, stroke = 5, label, sub, tone = 'var(--signal)', delay = 0 }) {
const v = useCountUp(value, 1400, 0, delay);
const r = (size - stroke * 2) / 2;
const C = 2 * Math.PI * r;
return (
{Math.round(v)}/100
{label ?
{label}
: null}
{sub ?
{sub}
: null}
);
}
function Btn({ primary, children, onClick, small, style, disabled }) {
return (
);
}
function StatCell({ k, v, tone }) {
return (
);
}
/* ── top bar: wordmark · search · breadcrumb cosmology · telemetry · sound ── */
function TopBar({ crumbs, onCrumb, sound, onSound, lex }) {
const atUniverse = crumbs.length === 1;
return (
{atUniverse ? (
) : (
)}
sectors 13
explored 13
stars 71
loop amber
);
}
/* ── status strip (bottom) ──────────────────────────────────────────────── */
function StatusStrip({ items, hint }) {
return (
);
}
Object.assign(window, { useCountUp, Kicker, Chip, MasteryBar, Ring, Btn, StatCell, TopBar, StatusStrip });