eidotter 0.38.1 → 0.40.0

package/dist/components/Connector/components/connectorGeometry.js

@@ -0,0 +1,102 @@
+/**
+ * Pure geometry for the Connector's tapered SVG ribbons (DMNC-1388).
+ *
+ * A ribbon is a filled, closed `<path>` sampled along a cubic bezier from a
+ * source point to an attach point, offset by a width profile. The taper is
+ * deliberately SUBTLE (locked 2026-07-13): near a straight thin thread, only a
+ * whisper thicker where it leaves the yolk. No DOM, no React — testable with
+ * literal points.
+ */
+/**
+ * Locked weights (2026-07-13 shape proof). `delicate` is the default — a thin
+ * product-chrome thread; `medium` reads a touch bolder on large surfaces.
+ */
+export const CONNECTOR_WEIGHTS = {
+    delicate: { base: 5, mid: 3.2, tip: 3.6, curvature: 22 },
+    medium: { base: 8, mid: 4.4, tip: 5.0, curvature: 30 },
+};
+/** Number of samples along the centre curve. */
+const SAMPLES = 28;
+const r2 = (n) => Math.round(n * 100) / 100;
+const lerp = (a, b, t) => a + (b - a) * t;
+const easeInOut = (t) => (t < 0.5 ? 2 * t * t : 1 - Math.pow(-2 * t + 2, 2) / 2);
+/** Half-width at parameter t: thick base → thin middle → slight swell into tip. */
+function halfWidthAt(t, w) {
+    if (t < 0.5)
+        return lerp(w.base, w.mid, easeInOut(t / 0.5));
+    return lerp(w.mid, w.tip, easeInOut((t - 0.5) / 0.5));
+}
+/**
+ * The point on the target rect border along the ray from the rect centre toward
+ * the source — where the ribbon must STOP (touching the edge, never inside).
+ */
+export function attachPoint(center, source, rect) {
+    const dx = source.x - center.x;
+    const dy = source.y - center.y;
+    const hw = rect.width / 2;
+    const hh = rect.height / 2;
+    const tx = dx !== 0 ? hw / Math.abs(dx) : Infinity;
+    const ty = dy !== 0 ? hh / Math.abs(dy) : Infinity;
+    const t = Math.min(tx, ty);
+    // Degenerate (zero-size rect, or source at centre) → the centre itself.
+    if (!Number.isFinite(t))
+        return { x: center.x, y: center.y };
+    return { x: center.x + dx * t, y: center.y + dy * t };
+}
+function cubic(p0, c1, c2, p3, t) {
+    const mt = 1 - t;
+    const a = mt * mt * mt;
+    const b = 3 * mt * mt * t;
+    const c = 3 * mt * t * t;
+    const d = t * t * t;
+    return { x: a * p0.x + b * c1.x + c * c2.x + d * p3.x, y: a * p0.y + b * c1.y + c * c2.y + d * p3.y };
+}
+function cubicTangent(p0, c1, c2, p3, t) {
+    const mt = 1 - t;
+    const a = 3 * mt * mt;
+    const b = 6 * mt * t;
+    const c = 3 * t * t;
+    return {
+        x: a * (c1.x - p0.x) + b * (c2.x - c1.x) + c * (p3.x - c2.x),
+        y: a * (c1.y - p0.y) + b * (c2.y - c1.y) + c * (p3.y - c2.y),
+    };
+}
+/**
+ * Build a closed tapered-ribbon path from `source` to `attach`. Returns an SVG
+ * path `d` string (empty when the endpoints coincide).
+ */
+export function ribbonPath(source, attach, weight, options = {}) {
+    const { sign = 1, sway = 0 } = options;
+    const dx = attach.x - source.x;
+    const dy = attach.y - source.y;
+    const len = Math.hypot(dx, dy);
+    if (len < 0.5)
+        return '';
+    const nx = -dy / len;
+    const ny = dx / len;
+    const c = Math.min(weight.curvature, len / 3);
+    const off1 = (c + sway) * sign;
+    const off2 = (c * 0.5 - sway * 0.6) * sign;
+    const c1 = { x: source.x + dx * 0.33 + nx * off1, y: source.y + dy * 0.33 + ny * off1 };
+    const c2 = { x: source.x + dx * 0.66 + nx * off2, y: source.y + dy * 0.66 + ny * off2 };
+    const left = [];
+    const right = [];
+    for (let i = 0; i <= SAMPLES; i++) {
+        const t = i / SAMPLES;
+        const p = cubic(source, c1, c2, attach, t);
+        const tan = cubicTangent(source, c1, c2, attach, t);
+        const tl = Math.hypot(tan.x, tan.y) || 1;
+        const mx = -tan.y / tl;
+        const my = tan.x / tl;
+        const hwid = halfWidthAt(t, weight);
+        left.push({ x: p.x + mx * hwid, y: p.y + my * hwid });
+        right.push({ x: p.x - mx * hwid, y: p.y - my * hwid });
+    }
+    let d = `M ${r2(left[0].x)} ${r2(left[0].y)}`;
+    for (let i = 1; i <= SAMPLES; i++)
+        d += ` L ${r2(left[i].x)} ${r2(left[i].y)}`;
+    for (let i = SAMPLES; i >= 0; i--)
+        d += ` L ${r2(right[i].x)} ${r2(right[i].y)}`;
+    d += ' Z';
+    return d;
+}

package/dist/components/Connector/components/connectorGeometry.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Connector/components/index.d.ts

@@ -0,0 +1,4 @@
+export { Connector } from './Connector.js';
+export type { ConnectorProps, ConnectorTarget } from './Connector.js';
+export { attachPoint, ribbonPath, CONNECTOR_WEIGHTS, } from './connectorGeometry.js';
+export type { Point, Rect, RibbonWeight, RibbonOptions } from './connectorGeometry.js';

package/dist/components/Connector/components/index.js

@@ -0,0 +1,2 @@
+export { Connector } from './Connector.js';
+export { attachPoint, ribbonPath, CONNECTOR_WEIGHTS, } from './connectorGeometry.js';

package/dist/components/Connector/index.d.ts

@@ -0,0 +1,2 @@
+export { Connector } from './components/index.js';
+export type { ConnectorProps, ConnectorTarget } from './components/index.js';

package/dist/components/Connector/index.js

@@ -0,0 +1 @@
+export { Connector } from './components/index.js';

package/dist/components/DecayStrip/components/DecayStrip.d.ts

@@ -0,0 +1,60 @@
+import React from 'react';
+import type { HealthLabels, Provenance, Tone } from '../../../utils/health/index.js';
+import type { DecaySample, TimeInput } from './resample.js';
+export interface DecayStripItem {
+    /** Stable key for the row. */
+    id: string;
+    label: string;
+    /** Starting amount, e.g. 40. `null` renders as unknown. */
+    amount: number | null;
+    unit: string;
+    /** Share still active, 0..1. `null`, `NaN` and `Infinity` render as unknown. */
+    remainingShare: number | null;
+    /** Required: where the share comes from. */
+    provenance: Provenance;
+}
+export interface DecayStripProps {
+    /** What is still active. An empty list renders EmptyState; the strip still renders. */
+    items: DecayStripItem[];
+    /**
+     * Consumer-computed decay curve. `t` is epoch ms or an ISO string;
+     * `remaining` is a 0..1 share. eidotter does no absorption math (KTD5).
+     */
+    samples: DecaySample[];
+    /** Current time, epoch ms or ISO string. Pass it in; the strip never reads the clock. */
+    now: TimeInput;
+    /** Time span the strip covers. */
+    window: {
+        from: TimeInput;
+        to: TimeInput;
+    };
+    /** Required: where the samples come from. */
+    provenance: Provenance;
+    /** Size variant. `sm` renders items as a text list, `md` and `lg` as small Gauges. */
+    size?: 'sm' | 'md' | 'lg';
+    /** Tone of the strip and the item Gauges. */
+    tone?: Tone;
+    /** Number of strip cells (default 24). */
+    columns?: number;
+    /** BCP 47 locale for numbers and times (default `en`). */
+    locale?: string;
+    /**
+     * IANA time zone for the from, to and now labels (e.g. `Europe/Berlin`).
+     * Defaults to the runtime zone, which on a server render is the server's.
+     */
+    timeZone?: string;
+    /** Overrides for the built-in label text. */
+    labels?: Partial<HealthLabels>;
+    /** Opt in to a polite live region and the now-marker pulse (R14). */
+    announce?: boolean;
+    /** Additional CSS class name. */
+    className?: string;
+}
+/**
+ * Horizontal time strip of what is still active (a meal, a dose): past cells
+ * as stepped block glyphs scaled by the consumer's `remaining` samples, future
+ * cells dimmed, and a now marker. Item rows sit above the strip.
+ * The strip is `role="img"` with a composed summary, so the glyphs are never
+ * the only reading. Presentational and hook-free, so it stays server-safe.
+ */
+export declare const DecayStrip: React.ForwardRefExoticComponent<DecayStripProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/DecayStrip/components/DecayStrip.js

@@ -0,0 +1,99 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { cn } from '../../../utils/cn.js';
+import { Gauge } from '../../Gauge/index.js';
+import { EmptyState } from '../../EmptyState/index.js';
+import { formatValue, isKnown, PLACEHOLDER, provenanceLabel, resolveLabels, } from '../../../utils/health/index.js';
+import { normaliseSamples, resample, toMs } from './resample.js';
+const sizeClasses = {
+    sm: 'eidotter-decay-strip--sm text-dos-text-xs',
+    md: 'eidotter-decay-strip--md text-dos-text-sm',
+    lg: 'eidotter-decay-strip--lg text-dos-text-md',
+};
+const toneClasses = {
+    neutral: 'eidotter-tone--neutral',
+    info: 'eidotter-tone--info',
+    success: 'eidotter-tone--success',
+    warning: 'eidotter-tone--warning',
+    critical: 'eidotter-tone--critical',
+};
+/** Progress glyph ladder, empty to full. */
+const LADDER = ['░', '▒', '▓', '█'];
+const MARKER = '│';
+const NO_DATA = '·';
+function glyph(value) {
+    if (value === null)
+        return NO_DATA;
+    const v = Math.min(1, Math.max(0, value));
+    return LADDER[Math.round(v * (LADDER.length - 1))];
+}
+/**
+ * Time from `now` until the curve reaches zero for good (the first zero
+ * sample after the last positive one), as locale text. Null when the curve
+ * never reaches zero or is already at zero before `now`.
+ */
+function timeToZero(samples, now, locale) {
+    const points = normaliseSamples(samples);
+    let lastPositive = -1;
+    points.forEach((p, i) => {
+        if (p.v > 0)
+            lastPositive = i;
+    });
+    const zero = points.slice(lastPositive + 1).find((p) => p.v <= 0);
+    if (!zero || !Number.isFinite(now) || zero.t < now)
+        return null;
+    const minutes = (zero.t - now) / 60000;
+    const rtf = new Intl.RelativeTimeFormat(locale, { numeric: 'always' });
+    return minutes < 60
+        ? rtf.format(Math.round(minutes), 'minute')
+        : rtf.format(Math.round(minutes / 6) / 10, 'hour');
+}
+/**
+ * Horizontal time strip of what is still active (a meal, a dose): past cells
+ * as stepped block glyphs scaled by the consumer's `remaining` samples, future
+ * cells dimmed, and a now marker. Item rows sit above the strip.
+ * The strip is `role="img"` with a composed summary, so the glyphs are never
+ * the only reading. Presentational and hook-free, so it stays server-safe.
+ */
+export const DecayStrip = forwardRef(({ items, samples, now, window, provenance, size = 'md', tone = 'neutral', columns = 24, locale = 'en', timeZone, labels: labelOverrides, announce = false, className, ...props }, ref) => {
+    const labels = resolveLabels(labelOverrides);
+    const nowMs = toMs(now);
+    const cells = resample(samples, window, columns);
+    const time = new Intl.DateTimeFormat(locale, {
+        timeStyle: 'short',
+        ...(timeZone && { timeZone }),
+    });
+    const formatTime = (ms) => (Number.isFinite(ms) ? time.format(ms) : PLACEHOLDER);
+    const fromText = formatTime(toMs(window.from));
+    const toText = formatTime(toMs(window.to));
+    const tag = (p) => provenanceLabel(labels, p);
+    const zeroPercent = formatValue(0, { locale, percent: true }).text;
+    const rows = items.map((item) => {
+        const amountText = formatValue(item.amount, { locale, unit: item.unit }).text;
+        const share = isKnown(item.remainingShare) ? item.remainingShare : null;
+        const shareText = share === null
+            ? labels.unknown
+            : `${formatValue(share * 100, { locale, percent: true }).text} ${labels.remaining}`;
+        return { item, amountText, share, shareText, tagText: tag(item.provenance) };
+    });
+    const zeroText = timeToZero(samples, nowMs, locale);
+    const stripTag = tag(provenance);
+    const summary = [
+        ...rows.map((r) => `${r.item.label} ${r.amountText}: ${r.shareText}${r.tagText ? `, ${r.tagText}` : ''}`),
+        `${fromText}–${toText}`,
+        Number.isFinite(nowMs) && `${labels.now} ${time.format(nowMs)}`,
+        zeroText && `${zeroPercent} ${zeroText}`,
+        stripTag,
+    ]
+        .filter(Boolean)
+        .join('; ');
+    const compact = size === 'sm';
+    return (_jsxs("div", { ref: ref, className: cn('eidotter-decay-strip eidotter-health flex flex-col gap-2 w-full min-w-0 font-dos text-dos-text-brand', sizeClasses[size] ?? sizeClasses.md, toneClasses[tone], className), ...props, children: [items.length === 0 ? (_jsx(EmptyState, { title: `${zeroPercent} ${labels.remaining}`, className: "py-2" })) : (_jsx("ul", { className: cn('flex gap-2 min-w-0', compact ? 'flex-col' : 'flex-wrap'), children: rows.map((r) => (_jsx("li", { className: cn('eidotter-decay-strip__item min-w-0', compact ? 'flex flex-wrap items-baseline gap-2 tabular-nums' : 'flex-1'), children: compact ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "truncate text-dos-text-accent", title: r.item.label, children: r.item.label }), _jsx("span", { children: r.amountText }), _jsx("span", { children: r.shareText }), r.tagText && (_jsx("span", { className: "eidotter-decay-strip__item-provenance border border-dos-border-brand px-1", children: r.tagText }))] })) : (_jsx(Gauge, { label: r.item.label, value: r.share === null ? null : r.share * 100, secondary: r.item.amount === null ? undefined : r.amountText, size: "sm", tone: tone, provenance: r.item.provenance, locale: locale, labels: labelOverrides })) }, r.item.id))) })), _jsxs("div", { className: "eidotter-decay-strip__strip flex items-center gap-2 min-w-0 tabular-nums", role: "img", "aria-label": summary, children: [_jsx("span", { className: "eidotter-decay-strip__from shrink-0", children: fromText }), _jsx("span", { className: "eidotter-decay-strip__cells flex-1 min-w-0 overflow-hidden whitespace-nowrap leading-none", style: tone === 'neutral' ? undefined : { color: 'var(--eidotter-fill)' }, children: cells.map((cell, i) => {
+                            const last = i === cells.length - 1;
+                            const isNow = nowMs >= cell.start && (nowMs < cell.end || (last && nowMs === cell.end));
+                            const future = !isNow && nowMs < cell.start && nowMs >= cells[0].start;
+                            const state = isNow ? 'now' : future ? 'future' : 'past';
+                            return (_jsx("span", { className: cn('eidotter-decay-strip__cell', `eidotter-decay-strip__cell--${state}`, future && 'opacity-50', isNow && 'text-dos-text-accent', isNow && announce && 'eidotter-health-pulse'), children: isNow ? MARKER : glyph(cell.value) }, i));
+                        }) }), _jsx("span", { className: "eidotter-decay-strip__to shrink-0", children: toText })] }), stripTag && (_jsx("span", { className: "eidotter-decay-strip__provenance self-start border border-dos-border-brand px-1", children: stripTag })), announce && (_jsx("p", { className: "sr-only", "aria-live": "polite", children: summary }))] }));
+});
+DecayStrip.displayName = 'DecayStrip';

package/dist/components/DecayStrip/components/index.d.ts

@@ -0,0 +1,3 @@
+export { DecayStrip } from './DecayStrip.js';
+export type { DecayStripProps, DecayStripItem } from './DecayStrip.js';
+export type { DecaySample, TimeInput } from './resample.js';

package/dist/components/DecayStrip/components/index.js

@@ -0,0 +1 @@
+export { DecayStrip } from './DecayStrip.js';

package/dist/components/DecayStrip/components/resample.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Pure resampling for DecayStrip. No absorption or insulin math lives here
+ * (KTD5): the consumer supplies `remaining` samples and this only bins them.
+ */
+/** Epoch milliseconds, or an ISO 8601 string. */
+export type TimeInput = number | string;
+export interface DecaySample {
+    t: TimeInput;
+    /** Share still active, 0..1 (0 = gone, 1 = all of it). */
+    remaining: number;
+}
+export interface DecayCell {
+    /** Cell start, epoch ms, inclusive. */
+    start: number;
+    /** Cell end, epoch ms, exclusive (the last cell includes the window end). */
+    end: number;
+    /** Mean `remaining` of the samples in the span, the nearest earlier sample when empty, or null. */
+    value: number | null;
+}
+export declare function toMs(t: TimeInput): number;
+/** Finite, time-sorted `{t, v}` points (stable for equal times); non-finite samples are dropped. */
+export declare function normaliseSamples(samples: DecaySample[]): {
+    t: number;
+    v: number;
+}[];
+/**
+ * Split `window` into `columns` equal cells. A cell's value is the mean of the
+ * samples whose time falls in its span; an empty cell carries the value of
+ * the nearest earlier sample, or null when no earlier sample exists.
+ */
+export declare function resample(samples: DecaySample[], window: {
+    from: TimeInput;
+    to: TimeInput;
+}, columns: number): DecayCell[];

package/dist/components/DecayStrip/components/resample.js

@@ -0,0 +1,44 @@
+/**
+ * Pure resampling for DecayStrip. No absorption or insulin math lives here
+ * (KTD5): the consumer supplies `remaining` samples and this only bins them.
+ */
+export function toMs(t) {
+    return typeof t === 'number' ? t : Date.parse(t);
+}
+/** Finite, time-sorted `{t, v}` points (stable for equal times); non-finite samples are dropped. */
+export function normaliseSamples(samples) {
+    return samples
+        .map((s) => ({ t: toMs(s.t), v: s.remaining }))
+        .filter((p) => Number.isFinite(p.t) && Number.isFinite(p.v))
+        .sort((a, b) => a.t - b.t);
+}
+/**
+ * Split `window` into `columns` equal cells. A cell's value is the mean of the
+ * samples whose time falls in its span; an empty cell carries the value of
+ * the nearest earlier sample, or null when no earlier sample exists.
+ */
+export function resample(samples, window, columns) {
+    const from = toMs(window.from);
+    const to = toMs(window.to);
+    const span = (to - from) / columns;
+    const points = normaliseSamples(samples);
+    const cells = [];
+    let next = 0;
+    let carry = null;
+    for (let i = 0; i < columns; i++) {
+        const start = from + i * span;
+        const end = i === columns - 1 ? to : from + (i + 1) * span;
+        const last = i === columns - 1;
+        while (next < points.length && points[next].t < start)
+            carry = points[next++].v;
+        let sum = 0;
+        let count = 0;
+        while (next < points.length && (points[next].t < end || (last && points[next].t === end))) {
+            sum += points[next].v;
+            carry = points[next++].v;
+            count++;
+        }
+        cells.push({ start, end, value: count > 0 ? sum / count : carry });
+    }
+    return cells;
+}

package/dist/components/DecayStrip/components/resample.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/DecayStrip/index.d.ts

@@ -0,0 +1,2 @@
+export { DecayStrip } from './components/index.js';
+export type { DecayStripProps, DecayStripItem, DecaySample, TimeInput } from './components/index.js';

package/dist/components/DecayStrip/index.js

@@ -0,0 +1 @@
+export { DecayStrip } from './components/index.js';

package/dist/components/Footer/components/Footer.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { cn } from '../../../utils/cn.js';
+import { isSafeHref } from '../../../utils/isSafeHref.js';
 /** Default legal links for German compliance (DDG § 5 / GDPR) */
 export const defaultLegalLinks = [
     { label: 'Impressum', href: '/impressum' },
@@ -14,5 +15,9 @@ export const Footer = ({ copyright, links, linkComponent, children, className, .
     const resolvedLinks = links ?? defaultLegalLinks;
     const LinkTag = linkComponent ?? 'a';
     const linkClassName = 'eidotter-footer__link text-dos-text-brand no-underline';
-    return (_jsxs("footer", { className: cn('font-dos text-sm py-4 px-2 text-center', 'eidotter-footer', className), ...props, children: [_jsx("div", { className: "h-px bg-dos-border-default mb-4", role: "separator" }), children && _jsx("div", { className: "mb-3", children: children }), resolvedLinks.length > 0 && (_jsx("nav", { className: "flex justify-center items-center flex-wrap gap-2 mb-2", "aria-label": "Footer links", children: resolvedLinks.map((link, index) => (_jsxs(React.Fragment, { children: [index > 0 && _jsx("span", { className: "text-dos-text-muted select-none eidotter-footer__dot", "aria-hidden": "true", children: "\u00B7" }), link.external ? (_jsx("a", { className: linkClassName, href: link.href, target: "_blank", rel: "noopener noreferrer", children: link.label })) : (_jsx(LinkTag, { className: linkClassName, href: link.href, children: link.label }))] }, link.href))) })), copyright && (_jsxs("p", { className: "text-dos-text-muted m-0", children: ["\u00A9 ", copyright] }))] }));
+    return (_jsxs("footer", { className: cn('font-dos text-sm py-4 px-2 text-center', 'eidotter-footer', className), ...props, children: [_jsx("div", { className: "h-px bg-dos-border-default mb-4", role: "separator" }), children && _jsx("div", { className: "mb-3", children: children }), resolvedLinks.length > 0 && (_jsx("nav", { className: "flex justify-center items-center flex-wrap gap-2 mb-2", "aria-label": "Footer links", children: resolvedLinks.map((link, index) => {
+                    // Unsafe hrefs (javascript, data, vbscript, …) render the label without an anchor.
+                    const safeHref = isSafeHref(link.href) ? link.href : undefined;
+                    return (_jsxs(React.Fragment, { children: [index > 0 && _jsx("span", { className: "text-dos-text-muted select-none eidotter-footer__dot", "aria-hidden": "true", children: "\u00B7" }), !safeHref ? (_jsx("span", { className: linkClassName, children: link.label })) : link.external ? (_jsx("a", { className: linkClassName, href: safeHref, target: "_blank", rel: "noopener noreferrer", children: link.label })) : (_jsx(LinkTag, { className: linkClassName, href: safeHref, children: link.label }))] }, link.href));
+                }) })), copyright && (_jsxs("p", { className: "text-dos-text-muted m-0", children: ["\u00A9 ", copyright] }))] }));
 };

package/dist/components/Gauge/components/Gauge.d.ts

@@ -0,0 +1,43 @@
+import React from 'react';
+import type { Band, HealthLabels, Provenance, Tone, ValueStatus } from '../../../utils/health/index.js';
+export interface GaugeProps {
+    /** Full label. Always part of the accessible name. */
+    label: string;
+    /** Shown instead of `label` below the medium container width. */
+    shortLabel?: string;
+    /** Current value. `null`, `NaN` and `Infinity` render as unknown. */
+    value: number | null;
+    /** Maximum value (default 100). Zero or negative renders as unknown. */
+    max?: number;
+    /** Unit of `value`, used only to flag mismatched band units in dev. */
+    unit?: string;
+    /** Absolute value text shown beneath the percent, e.g. "890 kcal". */
+    secondary?: string;
+    /** Size variant. */
+    size?: 'sm' | 'md' | 'lg';
+    /** Explicit tone. Wins over `bands`. */
+    tone?: Tone;
+    /** Data status. */
+    status?: ValueStatus;
+    /** Tag shown for `estimated` and `modelled` values. */
+    provenance?: Provenance;
+    /** Consumer-supplied bands. Resolved on the raw value. */
+    bands?: Band[];
+    /** BCP 47 locale for number formatting (default `en`). */
+    locale?: string;
+    /** Overrides for the built-in label text. */
+    labels?: Partial<HealthLabels>;
+    /** Enable the phosphor glow on the ring. */
+    glow?: boolean;
+    /** Additional CSS class name. */
+    className?: string;
+    /** Replaces `label` in the composed accessible name. */
+    'aria-label'?: string;
+}
+/**
+ * Ring gauge: a quantised ProgressRing arc with a dominant percent, optional
+ * secondary value, tone, status, provenance tag and overflow marker.
+ * The root owns the `meter` semantics; the ring is decorative (KTD7).
+ * Presentational and hook-free, so it stays server-safe.
+ */
+export declare const Gauge: React.ForwardRefExoticComponent<GaugeProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/Gauge/components/Gauge.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { cn } from '../../../utils/cn.js';
+import { ProgressRing } from '../../ProgressRing/index.js';
+import { Skeleton } from '../../Skeleton/index.js';
+import { formatValue, isKnown, provenanceLabel, resolveBand, resolveLabels, PLACEHOLDER, } from '../../../utils/health/index.js';
+const sizeClasses = {
+    sm: 'eidotter-gauge--sm text-dos-text-xs',
+    md: 'eidotter-gauge--md text-dos-text-sm',
+    lg: 'eidotter-gauge--lg text-dos-text-md',
+};
+const valueSizeClasses = {
+    sm: 'text-dos-text-sm',
+    md: 'text-dos-display-xs',
+    lg: 'text-dos-display-sm',
+};
+const ringSizes = { sm: 72, md: 104, lg: 136 };
+const toneClasses = {
+    neutral: 'eidotter-tone--neutral',
+    info: 'eidotter-tone--info',
+    success: 'eidotter-tone--success',
+    warning: 'eidotter-tone--warning',
+    critical: 'eidotter-tone--critical',
+};
+/** Segment rhythm per filled tone: SVG strokes cannot take gradient fills (KTD3). */
+const toneSegments = {
+    neutral: 16,
+    info: 12,
+    success: 16,
+    warning: 20,
+    critical: 24,
+};
+const statusClasses = {
+    ok: '',
+    loading: 'eidotter-gauge--loading',
+    empty: 'eidotter-gauge--empty',
+    stale: 'eidotter-gauge--stale',
+    unknown: 'eidotter-gauge--unknown',
+};
+/**
+ * Ring gauge: a quantised ProgressRing arc with a dominant percent, optional
+ * secondary value, tone, status, provenance tag and overflow marker.
+ * The root owns the `meter` semantics; the ring is decorative (KTD7).
+ * Presentational and hook-free, so it stays server-safe.
+ */
+export const Gauge = forwardRef(({ label, shortLabel, value, max = 100, unit, secondary, size = 'md', tone, status = 'ok', provenance, bands, locale = 'en', labels: labelOverrides, glow = false, className, 'aria-label': ariaLabel, ...props }, ref) => {
+    const labels = resolveLabels(labelOverrides);
+    const loading = status === 'loading';
+    const unknown = !isKnown(value) ||
+        !(max > 0) ||
+        !Number.isFinite(max) ||
+        status === 'empty' ||
+        status === 'unknown';
+    const pct = unknown ? 0 : (value / max) * 100;
+    const overflow = !unknown && value > max;
+    const resolved = resolveBand(unknown ? null : value, bands, unit);
+    const effectiveTone = tone ?? resolved.tone;
+    const valueText = unknown
+        ? PLACEHOLDER
+        : formatValue(pct, { locale, percent: true }).text;
+    const stale = status === 'stale' && !unknown;
+    const valuetext = [unknown || loading ? labels.unknown : valueText, stale && labels.stale]
+        .filter(Boolean)
+        .join(', ');
+    const name = `${ariaLabel ?? label}: ${valuetext}`;
+    const diameter = ringSizes[size] ?? ringSizes.md;
+    const tagText = provenanceLabel(labels, provenance);
+    return (_jsxs("div", { ref: ref, className: cn('eidotter-gauge eidotter-health flex flex-col items-center gap-1 w-full font-dos', sizeClasses[size] ?? sizeClasses.md, toneClasses[effectiveTone], statusClasses[status], className), style: { minWidth: diameter }, role: "meter", "aria-valuemin": 0, "aria-valuemax": unknown ? 100 : max, "aria-valuenow": unknown || loading ? 0 : Math.max(0, Math.min(value, max)), "aria-valuetext": valuetext, "aria-label": name, "aria-busy": loading || undefined, ...props, children: [_jsxs("div", { className: "relative inline-flex items-center justify-center", children: [_jsx(ProgressRing, { decorative: true, value: loading ? 0 : pct, max: 100, size: diameter, thickness: Math.round(diameter / 8), segments: toneSegments[effectiveTone] ?? 16, color: effectiveTone === 'neutral' ? undefined : 'var(--eidotter-fill)', glow: false, className: cn(glow && 'eidotter-health-glow') }), _jsx("div", { className: "absolute inset-0 flex flex-col items-center justify-center text-center leading-none", children: loading ? (_jsx("div", { "aria-hidden": "true", className: "eidotter-gauge__skeleton w-full overflow-hidden", children: _jsx(Skeleton, { variant: "figure", lines: 2, animated: false }) })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: cn('eidotter-gauge__value text-dos-text-accent tabular-nums', valueSizeClasses[size] ?? valueSizeClasses.md, stale && 'opacity-60'), children: valueText }), secondary && !unknown && (_jsx("span", { className: "eidotter-gauge__secondary text-dos-text-brand text-dos-text-xs tabular-nums", children: secondary }))] })) })] }), _jsxs("div", { className: "flex flex-wrap items-center justify-center gap-1 text-dos-text-brand uppercase tracking-wider leading-tight max-w-full", children: [effectiveTone === 'critical' && (_jsx("span", { "aria-hidden": "true", className: "eidotter-gauge__glyph text-dos-text-error", children: "\u25B2" })), _jsxs("span", { className: "eidotter-gauge__label truncate", title: label, children: [_jsx("span", { className: "eidotter-gauge__label--full", children: label }), shortLabel && _jsx("span", { className: "eidotter-gauge__label--short", children: shortLabel })] }), overflow && (_jsx("span", { "aria-hidden": "true", className: "eidotter-gauge__overflow text-dos-text-warning", children: "+" })), tagText !== null && (_jsx("span", { className: "eidotter-gauge__provenance border border-dos-border-brand px-1 normal-case", children: tagText })), stale && _jsx("span", { className: "eidotter-gauge__stale normal-case", children: labels.stale })] }), resolved.label && (_jsx("span", { className: "eidotter-gauge__band text-dos-text-brand normal-case", children: resolved.label }))] }));
+});
+Gauge.displayName = 'Gauge';

package/dist/components/Gauge/components/index.d.ts

@@ -0,0 +1,2 @@
+export { Gauge } from './Gauge.js';
+export type { GaugeProps } from './Gauge.js';

package/dist/components/Gauge/components/index.js

@@ -0,0 +1 @@
+export { Gauge } from './Gauge.js';

package/dist/components/Gauge/index.d.ts

@@ -0,0 +1,2 @@
+export { Gauge } from './components/index.js';
+export type { GaugeProps } from './components/index.js';

package/dist/components/Gauge/index.js

@@ -0,0 +1 @@
+export { Gauge } from './components/index.js';

package/dist/components/Header/components/Header.d.ts

@@ -1,5 +1,26 @@
 import React from 'react';
 import type { NavItem, NavProps } from '../../Nav/index.js';
+export interface HeaderCategory {
+    /** Stable identifier — emitted as `data-category-key` for DOM measurement (DMNC-1325 arm connectors). */
+    key: string;
+    label: string;
+    /** Icon name; rendered via `<Icon>` only when it matches a known IconName, otherwise label-only. */
+    icon: string;
+    href: string;
+}
+export interface HeaderReturnTo {
+    label: string;
+    href: string;
+    /**
+     * true → navigate via `window.open(href, 'rizomorf-shell')` to reuse a named
+     * tab (cross-site shell). Default: same-tab via linkComponent/anchor.
+     */
+    reuseTab?: boolean;
+}
+export interface HeaderContext {
+    categories: HeaderCategory[];
+    returnTo?: HeaderReturnTo;
+}
 export interface HeaderProps extends React.HTMLAttributes<HTMLElement> {
     /** Site brand name displayed in the header */
     brandName?: string;
@@ -15,6 +36,16 @@ export interface HeaderProps extends React.HTMLAttributes<HTMLElement> {
     sticky?: boolean;
     /** Custom link component for framework routing (Next.js Link, React Router Link, etc.) */
     linkComponent?: NavProps['linkComponent'];
+    /**
+     * Optional cross-site context row rendered below the brand+nav row: a
+     * measurable category badge row + an optional "← back" pill. When present and
+     * non-empty, the header lays out as two stacked rows and emits the stable
+     * measurement classes `.eidotter-header__context` / `.eidotter-header__categories`
+     * / `.eidotter-header__category` + `li[data-category-key]` (the Mark
+     * arm-connector contract, DMNC-1325). When absent or empty, the rendered DOM
+     * is identical to a header without this prop.
+     */
+    context?: HeaderContext;
     /** Custom branding content — replaces brandName when provided */
     children?: React.ReactNode;
     /** Additional CSS class name */

package/dist/components/Header/components/Header.js

@@ -1,13 +1,24 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { cn } from '../../../utils/cn.js';
+import { isSafeHref } from '../../../utils/isSafeHref.js';
 import { DesktopNav, MobileNav } from '../../Nav/index.js';
+import { HeaderContextRow } from './HeaderContextRow.js';
 const variantClasses = {
     retro: 'eidotter-header--retro',
     modern: 'eidotter-header--modern',
 };
-export const Header = forwardRef(({ brandName, brandHref = '/', items, activeHref, variant = 'retro', sticky = true, linkComponent, children, className, ...rest }, ref) => {
+export const Header = forwardRef(({ brandName, brandHref = '/', items, activeHref, variant = 'retro', sticky = true, linkComponent, context, children, className, ...rest }, ref) => {
     const LinkTag = linkComponent ?? 'a';
-    return (_jsxs("header", { ref: ref, className: cn('flex items-center justify-between px-4 py-3 font-dos', 'eidotter-header', variantClasses[variant], sticky && 'sticky top-0 z-50 bg-dos-bg-primary', className), ...rest, children: [_jsx(LinkTag, { href: brandHref, className: cn('no-underline text-base font-bold tracking-wide', 'eidotter-header__branding'), children: children || brandName }), _jsx(DesktopNav, { items: items, activeHref: activeHref, variant: variant, linkComponent: linkComponent }), _jsx(MobileNav, { items: items, activeHref: activeHref, variant: variant, linkComponent: linkComponent })] }));
+    // The brand link is structural — an unsafe brandHref falls back to '/' rather
+    // than unmounting the branding anchor.
+    const safeBrandHref = isSafeHref(brandHref) ? brandHref : '/';
+    // An empty context (no categories, no returnTo) is treated as absent so the
+    // rendered DOM stays byte-identical to a header without the prop.
+    const hasContext = !!context && (context.categories.length > 0 || !!context.returnTo);
+    const main = (_jsxs(_Fragment, { children: [_jsx(LinkTag, { href: safeBrandHref, className: cn('no-underline text-base font-bold tracking-wide', 'eidotter-header__branding'), children: children || brandName }), _jsx(DesktopNav, { items: items, activeHref: activeHref, variant: variant, linkComponent: linkComponent }), _jsx(MobileNav, { items: items, activeHref: activeHref, variant: variant, linkComponent: linkComponent })] }));
+    return (_jsx("header", { ref: ref, className: cn(hasContext
+            ? 'flex flex-col gap-2 px-4 py-3 font-dos'
+            : 'flex items-center justify-between px-4 py-3 font-dos', 'eidotter-header', variantClasses[variant], sticky && 'sticky top-0 z-50 bg-dos-bg-primary', className), ...rest, children: hasContext ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "eidotter-header__main flex w-full items-center justify-between", children: main }), _jsx(HeaderContextRow, { context: context, linkComponent: linkComponent, activeHref: activeHref })] })) : (main) }));
 });
 Header.displayName = 'Header';