@mkbabb/glass-ui 3.8.0 → 3.10.0

package/dist/components/custom/handmark/brush.d.ts

@@ -0,0 +1,219 @@
+/**
+ * brush.ts — the flat Brush DATA model (the keystone; SPEC §2). Pure data, 0 deps.
+ * ─────────────────────────────────────────────────────────────────────────────
+ * A `Brush` is a plain JSON-serialisable record — twelve scalars, four enums, and
+ * one optional `stamp` function. Every built-in medium is a frozen literal: a
+ * POINT in one continuous parameter space, NOT a class in a taxonomy. The renderer
+ * (`ink.ts`) reads fields — it NEVER branches on instrument name (SPEC §12 acc-1).
+ * Adding a medium = adding one row here; an in-between medium = a spread/lerp.
+ *
+ * Field-count discipline (SPEC §2): resist a 13th scalar per new instrument —
+ * `blend` earned its place only because highlighter genuinely needed `multiply`.
+ *
+ * The shipped register: PEN is the default (clean ink, grain:0 ⇒ no filter); the
+ * CRAYON ships as the proven STROKE-crayon (constant-width offset passes + the
+ * seeded static feTurbulence grain — `ds-crayon-handmark` verdict), i.e.
+ * `ribbon:'stroke'` (the `ribbon:'hull'` perfect-freehand width-variance upgrade
+ * is wired but unconsumed — a later field-delta, never a code branch).
+ */
+export type BlendMode = "source-over" | "multiply" | "darken" | "screen";
+export interface TaperSpec {
+    /** px the width ramps 0→full at the start (lift-on). */
+    start: number;
+    /** px the width ramps full→0 at the end (lift-off / dry run-out). */
+    end: number;
+    /** out-cubic = the lazy pencil run-out. */
+    ease: "linear" | "out-cubic";
+}
+export interface Brush {
+    /** base stroke diameter, in viewBox units. */
+    weight: number;
+    /** 0..1.4 seeded ±width variance along arc-length. */
+    weightJitter: number;
+    /** -1..1 pressure→width gain (pf `thinning`). */
+    thinning: number;
+    /** lift-on / lift-off ramp. */
+    taper: TaperSpec;
+    /** L2 body strategy: plain stroked <path> | pf filled hull. DEFAULT 'stroke'. */
+    ribbon: "stroke" | "hull";
+    /** 0..1 base alpha. */
+    opacity: number;
+    /** 'source-over' ink | 'multiply' highlighter-behind-text. */
+    blend: BlendMode;
+    /** overdraw count (pen 1 · crayon 2-3). */
+    passes: number;
+    /** 0..1 per-pass alpha falloff (heavy core, light fringe). */
+    passOpacity: number;
+    /** 0..1 paper-through depth — THE master pen↔crayon knob. 0 ⇒ NO filter. */
+    grain: number;
+    /** feTurbulence baseFrequency (high=pencil tooth · low=crayon wax). */
+    grainFreq: number;
+    /** feDisplacementMap edge-fray scale, px. */
+    grainScale: number;
+    /** feTurbulence numOctaves (grain richness). */
+    octaves: number;
+    /** macro tremor → wobbleLinePoints({ roughness }). */
+    roughness: number;
+    /** micro displacement scale (boil amplitude + warp filter). */
+    wobble: number;
+    /** wobble centerline resolution. */
+    segments: number;
+    cap: "round" | "square" | "butt";
+    /** when present, OVERRIDES the built-in ink stage only. */
+    stamp?: StampFn;
+}
+/** SPEC §5 — the arbitrary-brush escape hatch (one optional field, not a framework). */
+export type StampFn = (ctx: {
+    centerline: [number, number][];
+    brush: Brush;
+    rng: () => number;
+    seed: number;
+    length: number;
+    color: string;
+}) => {
+    paths: InkPath[];
+    filterId?: string | null;
+    defs?: string[];
+};
+/** One ink path the renderer emits (shared with ink.ts; declared here to avoid a cycle). */
+export interface InkPath {
+    d: string;
+    fill?: string;
+    stroke?: string;
+    opacity: number;
+    blend: BlendMode;
+}
+/**
+ * The named points in the continuum. `pen` is the DEFAULT (clean ink, grain:0).
+ * `crayon` is the SHIPPED stroke-crayon (ribbon:'stroke', the static grain filter);
+ * `pencil`/`marker`/`highlighter` round out the spanning set.
+ */
+export declare const BRUSHES: {
+    readonly pen: {
+        readonly weight: 6;
+        readonly weightJitter: 0.1;
+        readonly thinning: 0.15;
+        readonly taper: {
+            readonly start: 14;
+            readonly end: 14;
+            readonly ease: "out-cubic";
+        };
+        readonly ribbon: "stroke";
+        readonly opacity: 1;
+        readonly blend: "source-over";
+        readonly passes: 1;
+        readonly passOpacity: 0;
+        readonly grain: 0;
+        readonly grainFreq: 0.1;
+        readonly grainScale: 0;
+        readonly octaves: 2;
+        readonly roughness: 0.7;
+        readonly wobble: 1.2;
+        readonly segments: 9;
+        readonly cap: "round";
+    };
+    readonly pencil: {
+        readonly weight: 3;
+        readonly weightJitter: 0.3;
+        readonly thinning: 0.4;
+        readonly taper: {
+            readonly start: 8;
+            readonly end: 18;
+            readonly ease: "out-cubic";
+        };
+        readonly ribbon: "stroke";
+        readonly opacity: 0.6;
+        readonly blend: "source-over";
+        readonly passes: 1;
+        readonly passOpacity: 0;
+        readonly grain: 0.5;
+        readonly grainFreq: 0.42;
+        readonly grainScale: 1.5;
+        readonly octaves: 3;
+        readonly roughness: 1;
+        readonly wobble: 1.6;
+        readonly segments: 11;
+        readonly cap: "round";
+    };
+    readonly crayon: {
+        readonly weight: 16;
+        readonly weightJitter: 1;
+        readonly thinning: 0.25;
+        readonly taper: {
+            readonly start: 6;
+            readonly end: 6;
+            readonly ease: "linear";
+        };
+        readonly ribbon: "stroke";
+        readonly opacity: 0.8;
+        readonly blend: "source-over";
+        readonly passes: 2;
+        readonly passOpacity: 0.18;
+        readonly grain: 0.85;
+        readonly grainFreq: 0.16;
+        readonly grainScale: 2.6;
+        readonly octaves: 4;
+        readonly roughness: 1.5;
+        readonly wobble: 3;
+        readonly segments: 13;
+        readonly cap: "round";
+    };
+    readonly marker: {
+        readonly weight: 12;
+        readonly weightJitter: 0.2;
+        readonly thinning: 0.1;
+        readonly taper: {
+            readonly start: 4;
+            readonly end: 10;
+            readonly ease: "out-cubic";
+        };
+        readonly ribbon: "stroke";
+        readonly opacity: 0.92;
+        readonly blend: "source-over";
+        readonly passes: 1;
+        readonly passOpacity: 0;
+        readonly grain: 0.22;
+        readonly grainFreq: 0.09;
+        readonly grainScale: 1;
+        readonly octaves: 3;
+        readonly roughness: 1;
+        readonly wobble: 2.2;
+        readonly segments: 9;
+        readonly cap: "square";
+    };
+    readonly highlighter: {
+        readonly weight: 26;
+        readonly weightJitter: 0.05;
+        readonly thinning: 0;
+        readonly taper: {
+            readonly start: 0;
+            readonly end: 0;
+            readonly ease: "linear";
+        };
+        readonly ribbon: "stroke";
+        readonly opacity: 0.38;
+        readonly blend: "multiply";
+        readonly passes: 1;
+        readonly passOpacity: 0;
+        readonly grain: 0.12;
+        readonly grainFreq: 0.2;
+        readonly grainScale: 1.5;
+        readonly octaves: 2;
+        readonly roughness: 0.5;
+        readonly wobble: 1.4;
+        readonly segments: 9;
+        readonly cap: "square";
+    };
+};
+export type BrushName = keyof typeof BRUSHES;
+/**
+ * Resolution order (KISS, deterministic): preset → object overrides → extra `o`.
+ * A string selects a preset; an object spreads over `pen`. Later wins.
+ */
+export declare const resolveBrush: (b: BrushName | Partial<Brush>, o?: Partial<Brush>) => Brush;
+/**
+ * lerpBrush — the continuum proof (SPEC §12 acc-2). Linearly interpolate the
+ * scalar fields of two brushes; enums/taper/ribbon snap from `a` below 0.5, `b`
+ * at/above. Yields a sensible in-between ("inky crayon"), no NaN.
+ */
+export declare const lerpBrush: (a: Brush, b: Brush, t: number) => Brush;

package/dist/components/custom/handmark/freehand.d.ts

@@ -0,0 +1,69 @@
+/**
+ * freehand.ts — the VENDORED perfect-freehand geometry core (MIT, tldraw).
+ * ─────────────────────────────────────────────────────────────────────────────
+ * SPEC §1.1 / §11: glass-ui ships ZERO hard deps. `perfect-freehand` is an
+ * OPTIONAL peer; its `getStroke` is the only one of the four engines that
+ * produces TRUE variable width (the swelling/tapering crayon nib). We vendor only
+ * its *geometry* core (a few hundred LOC, MIT) behind this L2 seam so:
+ *
+ *   - the default pen/crayon presets (`ribbon: 'stroke'`) NEVER import it — the
+ *     bundle treeshakes it away (the shipped stroke-crayon, `ds-crayon-handmark`),
+ *   - the `ribbon: 'hull'` opt-in (the future width-variance upgrade) has a
+ *     dependency-free, deterministic body engine already in place,
+ *   - the pointer-capture half of the library (dead weight to us) never ships.
+ *
+ * This is the `getStroke` + `getStrokeOutlinePoints` + `getStrokePoints` core
+ * from perfect-freehand@1.2.3 (Steve Ruiz, MIT), transcribed to TypeScript with
+ * the `getSvgPathFromStroke` median-quad serialiser the references use. The
+ * algorithm is verbatim; only the module shape (named exports, vendored vec math)
+ * is glass-ui-local.
+ *
+ * @license MIT — perfect-freehand © Stephen Ruiz Ltd. https://github.com/steveruizok/perfect-freehand
+ */
+/** A point: [x, y] or [x, y, pressure]. */
+export type InputPoint = [number, number] | [number, number, number];
+export interface StrokeOptions {
+    size?: number;
+    thinning?: number;
+    smoothing?: number;
+    streamline?: number;
+    easing?: (t: number) => number;
+    simulatePressure?: boolean;
+    start?: {
+        cap?: boolean;
+        taper?: number | boolean;
+        easing?: (t: number) => number;
+    };
+    end?: {
+        cap?: boolean;
+        taper?: number | boolean;
+        easing?: (t: number) => number;
+    };
+    last?: boolean;
+}
+interface StrokePoint {
+    point: number[];
+    pressure: number;
+    distance: number;
+    vector: number[];
+    runningLength: number;
+}
+/**
+ * getStrokePoints — resample the raw input into smoothed StrokePoints with
+ * running length + per-segment unit vectors (the streamline low-pass).
+ */
+export declare function getStrokePoints(points: InputPoint[], options?: StrokeOptions): StrokePoint[];
+/**
+ * getStrokeOutlinePoints — walk the StrokePoints, emit left/right offset points
+ * (the variable-width hull), with tapered caps.
+ */
+export declare function getStrokeOutlinePoints(points: StrokePoint[], options?: StrokeOptions): number[][];
+/** getStroke — the public entry: raw input → variable-width hull outline points. */
+export declare function getStroke(points: InputPoint[], options?: StrokeOptions): number[][];
+/**
+ * getSvgPathFromStroke — the canonical median-quad serialiser the references use:
+ * each segment's control point is the midpoint of two consecutive outline points,
+ * yielding a smooth closed fill `d`-string.
+ */
+export declare function getSvgPathFromStroke(stroke: number[][], closed?: boolean): string;
+export {};

package/dist/components/custom/handmark/geometry.d.ts

@@ -0,0 +1,32 @@
+/**
+ * geometry.ts — SEMANTIC shape → pencil-boil centerlines (L1, pure; SPEC §3).
+ * ─────────────────────────────────────────────────────────────────────────────
+ * A shape is a pure mapper: (semantic target) → L1 geometry. The renderer never
+ * knows what it drew — it sees only `Point[]`. Adding a shape = adding one switch
+ * arm; nothing downstream changes (texture + animation are shape-blind). This is
+ * the generality lever (Brush ⟂ Path).
+ *
+ * The marking coordinate space is 0..100 × 0..40, with `preserveAspectRatio="none"`
+ * so the <svg> stretches to the slotted word box (the SPEC §6.2 width-invariance
+ * contract). Two usage modes:
+ *   - text mode (box == null): use the full viewBox (single-line underline/strike)
+ *   - positioned mode (box = {x,y,w,h}): map an explicit rect (circle a datum)
+ *
+ * The circle arm rides pencil-boil 0.4.0's `ellipsePoints` (the hand-circle
+ * overshoot ring — the sole upstream geometry delta this component required).
+ */
+import { type WobbleOptions } from "@mkbabb/pencil-boil";
+import type { HandShape, MarkBox } from "./types";
+export declare const VB_W = 100;
+export declare const VB_H = 40;
+/** A shape maps to one or more centerlines (open polylines) or one closed ring. */
+export interface ShapeGeom {
+    lines: [number, number][][];
+    closed: boolean;
+}
+/** Semantic shape → { lines, closed } in the marking space (or a positioned box). */
+export declare function shapeGeom(shape: HandShape, opts: WobbleOptions, box?: MarkBox | null): ShapeGeom;
+/** Boil one geometry: re-perturb the CACHED centerlines (anchored → no draw-on pop). */
+export declare function boilLines({ lines, closed }: ShapeGeom, amount: number, seed: number): [number, number][][];
+/** Serialize centerlines → one SVG `d` (multi-line shapes concat with a space). */
+export declare function serialize(lines: [number, number][][], jagged?: boolean): string;

package/dist/components/custom/handmark/index.d.ts

@@ -0,0 +1,21 @@
+/**
+ * handmark — the ./handmark barrel (SPEC §11).
+ * ─────────────────────────────────────────────────────────────────────────────
+ * `HandMark` is the generic export; `InkMark` is the prose alias the atlas/slides
+ * import so call sites read as prose (one implementation, zero divergence). The
+ * pure L1–L3 functions ship too — they are framework-free, directly usable in
+ * slides decks, D3 charts (call `shapeGeom`/`ellipsePoints` to ink a path), even
+ * canvas.
+ *
+ * The DEFAULT is `pen` (clean ink, grain:0 ⇒ no filter, zero extra dep). The
+ * `@mkbabb/pencil-boil` geometry + `perfect-freehand` body are OPTIONAL PEERS;
+ * only `ribbon:'hull'` touches the vendored pf core (treeshaken otherwise).
+ */
+export { default as HandMark, default as InkMark } from "./HandMark.vue";
+export { BRUSHES, resolveBrush, lerpBrush, type Brush, type BrushName, type BlendMode, type TaperSpec, type StampFn, type InkPath, } from "./brush";
+export { shapeGeom, serialize, boilLines, VB_W, VB_H, type ShapeGeom, } from "./geometry";
+export { ink, type SVGFragment } from "./ink";
+export { grainFilter, hasGrain } from "./texture";
+export { getStroke, getStrokePoints, getSvgPathFromStroke, type StrokeOptions, type InputPoint, } from "./freehand";
+export { useHandMark, normalizeProps, type UseHandMarkInput, type HandMarkCore, } from "./useHandMark";
+export type { HandMarkProps, HandShape, HandAnimation, MarkBox, } from "./types";

package/dist/components/custom/handmark/ink.d.ts

@@ -0,0 +1,11 @@
+import type { Brush, InkPath } from "./brush";
+export interface SVGFragment {
+    paths: InkPath[];
+    filterId: string | null;
+    defs: string[];
+}
+/**
+ * ink — the only stage the brush fully drives. `jagged` serialises the stroke body
+ * with angular kinks (pointsToLinear) instead of the smooth Catmull-Rom bezier.
+ */
+export declare function ink(centerline: [number, number][], b: Brush, seed: number, color: string, filterId: string, jagged?: boolean): SVGFragment;

package/dist/components/custom/handmark/texture.d.ts

@@ -0,0 +1,39 @@
+/**
+ * texture.ts — the L3 grain as ONE parameterized SVG <filter> (pure; SPEC §4.2).
+ * ─────────────────────────────────────────────────────────────────────────────
+ * `grainFilter(id, b, seed)` returns the markup for ONE static, seeded <filter>
+ * driven entirely by the brush vector. The KISS invariant (the PEN-is-free law,
+ * SPEC §12 acc-4):
+ *
+ *     grain <= 0 && grainScale <= 0  ⇒  returns ''  ⇒  NO filter emitted  ⇒  bare <path>.
+ *
+ * So pen/marker-lite get the cleanest vector edge at zero filter cost; pencil/
+ * crayon get a real broken-edge filter. SAME code path, field delta only — never
+ * an instrument `if`.
+ *
+ * The graph is the proven 5-stage pipeline from the `proto/_final` sandbox (it
+ * supersets the bare SPEC §4.2 graph with a trailing re-break displacement —
+ * `ds-crayon-handmark §4.4` keeps the proven one):
+ *   1. feTurbulence (warp)      — low-freq fractal noise for edge wobble
+ *   2. feDisplacementMap (wob)  — push the stroke edge by grainScale
+ *   3. feTurbulence (grain)     — high-freq noise = paper tooth / wax grain
+ *   4. feColorMatrix (grainA)   — threshold the grain into a hard alpha mask
+ *   5. feComposite + feDisplace — knock paper-through holes (operator="in") + re-break
+ *
+ * CRITICAL (the Δ4 gate, `ds-crayon-handmark §3`): this filter is STATIC + SEEDED.
+ * It rasters ONCE per (mount, resize, scheme flip) and is cached. The draw-on is a
+ * `clip-path: inset()` wipe that mutates only the clip — it NEVER animates
+ * `stroke-dashoffset` under the filter (which would re-raster the graph per frame).
+ * Boil does NOT ship on this register (`ds-crayon-handmark §5.3`).
+ *
+ * `id` MUST be per-instance (the component's `useId()`) so two marks never collide
+ * their <filter> namespaces — the glass-ui WatercolorDot idiom.
+ *
+ * The grain sub-seed is derived (`seed ^ 0x85eb`) per SPEC §7, so one top seed
+ * re-rolls the grain coherently with the centerline wobble.
+ */
+import type { Brush } from "./brush";
+/** @returns SVG <filter> markup, or '' when the brush is clean ink (pen). */
+export declare function grainFilter(id: string, b: Brush, seed: number): string;
+/** Does this brush emit a grain filter? (the pen-is-free predicate). */
+export declare function hasGrain(b: Brush): boolean;

package/dist/components/custom/handmark/types.d.ts

@@ -0,0 +1,53 @@
+/**
+ * types.ts — the public API surface (SPEC §6). Pure types, 0 runtime.
+ * ─────────────────────────────────────────────────────────────────────────────
+ * The L5 surface steals rough-notation's *vocabulary* (annotate-style props +
+ * ordered groups), not its code. Every prop has a per-brush default, so the
+ * common call is one tag: <HandMark>who pays in</HandMark>.
+ */
+import type { Brush, BrushName } from "./brush";
+/** A target rect in the 0..100 × 0..40 marking space (positioned mode). */
+export interface MarkBox {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+export type HandShape = "underline" | "strikethrough" | "highlight" | "circle" | "box" | "bracket" | "path";
+export type HandAnimation = "none" | "draw-on" | "boil" | "draw-then-boil";
+export interface HandMarkProps {
+    /** 'pen'(default) | preset name | full/partial Brush object. */
+    brush?: BrushName | Partial<Brush>;
+    /** default 'underline'. */
+    shape?: HandShape;
+    /** ANY CSS color. default 'currentColor'. */
+    color?: string;
+    /** procedural variant — deterministic. default 1. */
+    seed?: number;
+    /** spread over the resolved brush (3rd resolution level). */
+    overrides?: Partial<Brush>;
+    /** default 'none' (the static-masthead default). */
+    animation?: HandAnimation;
+    /** draw-on duration. default 800. */
+    drawMs?: number;
+    /** draw-on start delay. default 0. */
+    drawDelayMs?: number;
+    /** draw-on trigger. default 'visible' (IntersectionObserver). */
+    appear?: "mount" | "visible" | "manual";
+    /** boil frame rate. default 8 (≈125ms). */
+    boilFps?: number;
+    /** distinct boil frames. default 3. */
+    boilFrames?: number;
+    /** override brush.roughness. */
+    roughness?: number;
+    /** wobble resolution. default per-brush. */
+    segments?: number;
+    /** angular kinks vs smooth bezier. default false. */
+    jagged?: boolean;
+    /** POSITIONED mode (circle a datum): explicit target rect. */
+    box?: MarkBox;
+    /** shape:'path' escape hatch — arbitrary SVG `d` (wins over shape). */
+    path?: string;
+    /** arbitrary point stream → brush ink. */
+    points?: [number, number][];
+}

package/dist/components/custom/handmark/useHandMark.d.ts

@@ -0,0 +1,66 @@
+/**
+ * useHandMark.ts — the headless reactive core (L2/L3/L4; SPEC §9).
+ * ─────────────────────────────────────────────────────────────────────────────
+ * Sits between the props and the SFC template so a future React/web-component skin
+ * reuses L1–L4. It orchestrates: resolve brush → shapeGeom → ink → animation. It
+ * owns NO DOM (the SFC anchors/measures/mounts the filter); it owns the reactive
+ * pipeline + the draw-on / boil state machine.
+ *
+ * Two draw-on mechanisms, picked by a FIELD (never an instrument `if`):
+ *   - clean ink (no grain): `stroke-dashoffset` on `pathLength="1"` — the slides
+ *     recipe, geometry-agnostic, compositor-cheap, no filter to re-raster.
+ *   - grained ink (crayon): a `clip-path: inset()` WIPE — the filter rasters ONCE
+ *     and the reveal mutates only the clip (`ds-crayon-handmark §5.1`). NEVER
+ *     dashoffset under a filter (it would re-raster the graph per frame — the Δ4
+ *     gate).
+ *
+ * PRM: every draw-on collapses to instant (finished static state); boil no-ops
+ * (`useLineBoil.start()` early-returns under reduced motion).
+ */
+import { type Ref } from "vue";
+import { useLineBoil } from "@mkbabb/pencil-boil";
+import { type Brush, type BrushName } from "./brush";
+import { type ShapeGeom } from "./geometry";
+import { type SVGFragment } from "./ink";
+import type { HandAnimation, HandMarkProps, HandShape, MarkBox } from "./types";
+export interface UseHandMarkInput {
+    brush: BrushName | Partial<Brush>;
+    shape: HandShape;
+    color: string;
+    seed: number;
+    overrides?: Partial<Brush>;
+    animation: HandAnimation;
+    boilFps: number;
+    boilFrames: number;
+    roughness: number | null;
+    segments: number | null;
+    jagged: boolean;
+    box: MarkBox | null;
+    path: string | null;
+    filterId: string;
+}
+/** Normalise raw HandMarkProps (with their defaults applied) into the core input. */
+export declare function normalizeProps(props: HandMarkProps, filterId: string): UseHandMarkInput;
+export interface HandMarkCore {
+    /** the resolved effective brush vector. */
+    brush: Ref<Brush>;
+    /** the static base geometry (boil re-perturbs THIS). */
+    baseGeom: Ref<ShapeGeom>;
+    /** the live SVG fragment (paths + filter defs). */
+    fragment: Ref<SVGFragment>;
+    /** the live `d` (escape-hatch path > boiled geometry > static base). */
+    pathD: Ref<string>;
+    /** does the brush emit a grain filter? (drives the draw-on mechanism). */
+    grained: Ref<boolean>;
+    /** the draw-on mechanism for this mark: dashoffset (pen) | clip (crayon). */
+    drawKind: Ref<"dashoffset" | "clip">;
+    /** does this animation draw on at all? */
+    draws: Ref<boolean>;
+    /** does this animation boil? */
+    boils: Ref<boolean>;
+    /** the lazy boil clock (subscribes to the singleton RAF). */
+    boil: ReturnType<typeof useLineBoil>;
+    /** arm/disarm boil (draw-then-boil holds it until the draw finishes). */
+    boilArmed: Ref<boolean>;
+}
+export declare function useHandMark(input: Ref<UseHandMarkInput>): HandMarkCore;

package/dist/components/custom/metric-badge/MetricBadge.vue.d.ts

@@ -1,6 +1,7 @@
 import type { HTMLAttributes } from 'vue';
 type MetricBadgeSize = 'sm' | 'md' | 'lg' | 'xl';
 type MetricBadgeLabelPosition = 'inline' | 'stacked';
+type MetricBadgeVariant = 'default' | 'record';
 type __VLS_Props = {
     amount: string | number | null | undefined;
     unit?: string;
@@ -29,10 +30,17 @@ type __VLS_Props = {
      *  rung (`text-mono-prose` amount, `text-prose` unit) for hero
      *  placements that need to read at chassis distance. */
     size?: MetricBadgeSize;
+    /** Surface register. `default` is the canonical 5-tier glass pill;
+     *  `record` is the GILT pill (D6.b) — a 1px `--gold-rim` tooled edge +
+     *  `--gold-ink` amount + a faint ≤8% gold wash (never opaque). Gold marks
+     *  the SUPERLATIVE, exactly one per view: the all-time-high / peak figure.
+     *  The medal reads as earned, not as a fourth data color. */
+    variant?: MetricBadgeVariant;
     class?: HTMLAttributes['class'];
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     size: MetricBadgeSize;
+    variant: MetricBadgeVariant;
     placeholder: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

package/dist/components/custom/tabs/SegmentedTabs.vue.d.ts

@@ -0,0 +1,92 @@
+import { type HTMLAttributes } from "vue";
+/** The canonical tab/option shape — one descriptor across all three variants. */
+export interface SegmentedTabOption {
+    label: string;
+    value: string;
+    icon?: string;
+    disabled?: boolean;
+    tooltip?: string;
+}
+/** The three indicator chromes. `segmented` (default) = the muted pill-slider;
+ *  `pill` = the solid `--foreground` pill; `underline` = the hairline rule. */
+export type SegmentedTabsVariant = "segmented" | "pill" | "underline";
+export interface SegmentedTabsResponsive {
+    /**
+     * CSS length consumed inside `(min-width: <breakpoint>)`. BELOW it the
+     * strip collapses to a `<Select>`; at/above it renders the tab strip.
+     * Defaults to `"640px"` (Tailwind `sm:`).
+     */
+    breakpoint?: string;
+    /**
+     * Optional subset shown in the desktop strip (the mobile Select keeps the
+     * full option list). Falls back to `options`.
+     */
+    desktopOptions?: SegmentedTabOption[] | null;
+    /** Accessible name for the mobile `<SelectTrigger>`. */
+    ariaLabel?: string;
+    /** Class merged onto the mobile `<SelectTrigger>` only. */
+    triggerClass?: HTMLAttributes["class"];
+}
+export interface SegmentedTabsProps {
+    options: SegmentedTabOption[];
+    /**
+     * Indicator chrome — `segmented` (DEFAULT, the pill-slider over a muted
+     * track), `pill` (solid foreground pill), `underline` (the hairline rule).
+     */
+    variant?: SegmentedTabsVariant;
+    /**
+     * Multi-select — when true the surface mutates as a ToggleGroup (N
+     * simultaneous pressed buttons, `role="group"`). Only valid on the
+     * `segmented`/`pill` variants; `underline` is panel-nav (single-select).
+     */
+    multiSelect?: boolean;
+    /**
+     * Tab-row overflow handling.
+     * - `"none"` (default) — inline-grid; tabs share width and clip.
+     * - `"scroll"` — flex row with intrinsic widths + edge fades; never clips.
+     * - `"auto"` — flex row with intrinsic widths + plain horizontal scroll.
+     */
+    overflow?: "none" | "scroll" | "auto";
+    /**
+     * Responsive collapse — below the breakpoint the strip becomes a `<Select>`
+     * (subsumes the former standalone ResponsiveTabs). `true` uses defaults;
+     * an object tunes the breakpoint / desktop subset / accessible name.
+     */
+    responsive?: boolean | SegmentedTabsResponsive;
+    class?: HTMLAttributes["class"];
+}
+type __VLS_Props = SegmentedTabsProps;
+type __VLS_ModelProps = {
+    modelValue: string | string[];
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_50: {
+    option: SegmentedTabOption;
+    active: boolean;
+}, __VLS_58: {
+    option: SegmentedTabOption;
+    active: boolean;
+};
+type __VLS_Slots = {} & {
+    option?: (props: typeof __VLS_50) => any;
+} & {
+    option?: (props: typeof __VLS_58) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string | string[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | string[]) => any) | undefined;
+}>, {
+    overflow: "none" | "scroll" | "auto";
+    variant: SegmentedTabsVariant;
+    responsive: boolean | SegmentedTabsResponsive;
+    multiSelect: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};