@mkbabb/glass-ui 3.13.0 → 4.0.0

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,52 @@
+/**
+ * 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.x's `ellipsePoints` (the hand-circle
+ * overshoot ring — the sole upstream geometry delta this component required).
+ *
+ * THE SEED RECONCILE (BA.W-HANDMARK [S2]): the wobble centerlines are seeded from
+ * the HOUSE prng leaf (`src/utils/prng.ts` mulberry32 + hashString — the AV.W14
+ * single-source). The family FEEDS pencil-boil a house-derived integer seed; glass-
+ * ui code imports ZERO `mulberry32` from pencil-boil (its internal mulberry32 stays
+ * inside its OWN perturb math). ONE seed leaf, the house identity.
+ */
+import { type WobbleOptions } from "@mkbabb/pencil-boil";
+import { UNDERLINE_GAP, VB_H, VB_W } from "./constants";
+import type { HandShape, MarkBox } from "./types";
+export { VB_W, VB_H, UNDERLINE_GAP };
+/** 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).
+ *
+ * The text-mode underline anchors to a MEASURED baseline: `baselineFrac` is the
+ * slotted word's alphabetic baseline as a fraction of the `.hm` box height (the SFC
+ * measures it via ResizeObserver + `document.fonts.ready`). The underline y is then
+ * `VB_H × (baselineFrac + UNDERLINE_GAP)` — never the old hardcoded `32` (80% of the
+ * box), which struck through tight-leading headings. `null` ⇒ not yet measured: fall
+ * back to the legacy `VB_H − 8` constant so first paint (and jsdom/SSR) still renders
+ * a line, replaced the instant the measure lands.
+ *
+ * `natural` (BA.W-HANDMARK C-2) routes the underline through the procedural
+ * `naturalUnderlinePoints` morphology instead of pencil-boil's `wobbleLinePoints`
+ * (the masthead `boil` voice); the default underline keeps the pencil-boil line.
+ */
+export declare function shapeGeom(shape: HandShape, opts: WobbleOptions, box?: MarkBox | null, baselineFrac?: number | null, natural?: boolean): 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,27 @@
+/**
+ * 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'` (the highlighter) touches the vendored pf core (treeshaken
+ * otherwise).
+ *
+ * BA.W-HANDMARK: `GlassUnderline`/the `/underline` subpath RETIRED onto
+ * `HandMark shape="underline"` (DEC-8 outcome 1; clean break, no alias). The
+ * editorial draw-on underline is `<HandMark shape="underline" animation="draw-on">`;
+ * the natural pencil-boil morphology is the `boil` brush.
+ */
+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, UNDERLINE_GAP, 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, type BoilClock, } from "./composables/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,62 @@
+/**
+ * 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;
+    /**
+     * NATURAL underline morphology (BA.W-HANDMARK C-2). When true (the masthead
+     * `boil` voice), the underline geometry goes PROCEDURAL — scale-relative
+     * amplitude, an IRREGULAR seeded period count, off the house prng leaf feeding
+     * pencil-boil — instead of pencil-boil's single `wobbleLinePoints` line. The
+     * `boil` brush auto-engages it; the default underline keeps the pencil-boil line.
+     * Ignored on non-underline shapes.
+     */
+    natural?: 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/icon-chip/IconChip.vue.d.ts

@@ -0,0 +1,4 @@
+import type { IconChipProps } from "./types";
+declare const __VLS_export: import("vue").DefineComponent<IconChipProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<IconChipProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/custom/icon-chip/index.d.ts

@@ -0,0 +1,2 @@
+export { default as IconChip } from "./IconChip.vue";
+export type { IconChipProps, IconChipIcon, IconChipSection, IconChipTone, } from "./types";

package/dist/components/custom/icon-chip/types.d.ts

@@ -0,0 +1,72 @@
+import type { Component, FunctionalComponent, HTMLAttributes } from "vue";
+/**
+ * Permissive icon type — Vue's `Component` ships across multiple structurally
+ * incompatible shapes (the @lucide/vue v1 functional-component form is one), so
+ * we accept the union a `<component :is>` render expression handles. Mirrors the
+ * `MetricCell` `IconLike` precedent (the AZ `isComponent` allowance).
+ */
+export type IconChipIcon = Component | FunctionalComponent | object;
+/** A 0..12 index into the `--section-color-N` 13-stop ramp. */
+export type IconChipSection = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+/**
+ * A complete token colour for the chip event (e.g. `var(--chart-download)`,
+ * `var(--tier-featured)`) — the MetricCell-`iconColor` reconcile path. NEVER a
+ * demo-local literal hue (ppmycota purple stays out of the library — the chip
+ * `tone` arm takes a token).
+ */
+export type IconChipTone = string;
+export interface IconChipProps {
+    /**
+     * The lucide glyph (functional-component form per the AZ `isComponent`
+     * precedent). Rendered via `<component :is>`.
+     */
+    icon: IconChipIcon;
+    /**
+     * The `--section-color-N` ramp index (0..12) — the section arm. XOR `tone`.
+     * When both are set, `tone` wins (the explicit complete-token override).
+     * Typed `number` for data-driven consumers (a `v-for` over a descriptor list
+     * with a `section: number` field); the 0..12 canonical range is the
+     * `IconChipSection` union the discovery layer publishes.
+     */
+    section?: number;
+    /**
+     * A complete token colour (the tone arm — the MetricCell-`iconColor`
+     * reconcile). XOR `section`.
+     */
+    tone?: IconChipTone;
+    /**
+     * The chip diameter in px — the FLOOR is `glyphSize × --icon-chip-glyph-ratio`
+     * so the plate can never paint under the glyph (the d2 proportion, structural).
+     * Default `48` (the reference register, 48/22 ≈ 2.18).
+     */
+    size?: number;
+    /** The lucide glyph pixel size. Default `22` (the reference register). */
+    glyphSize?: number;
+    /** The lucide glyph stroke width. Default `1.75` (the reference register). */
+    strokeWidth?: number;
+    /**
+     * The NO-PLATE register — render the full-chroma glyph with NO backplate
+     * (the MetricCell leading-glyph tint). The chip≤glyph floor is moot (no plate).
+     */
+    bare?: boolean;
+    /**
+     * Duotone fill — a low-alpha fill of the same hue UNDER the full-chroma
+     * stroke (the iOS/Material "filled-tonal" move). Mono-hue (proportion-safe,
+     * never a second hue). Default `false`.
+     */
+    duotone?: boolean;
+    /**
+     * The chip's own smooth-glass hover register (the backplate mix lifts, a soft
+     * glow ring appears, the stroke firms) — on the §6 easing doctrine, PRM-gated,
+     * disco-FREE. Default `false`.
+     */
+    bloom?: boolean;
+    /**
+     * Entrance choreography — composes the shipped `vReveal` directive. A numeric
+     * value is the `--d` stagger index; `true` is index 0. PRM-gated by `vReveal`'s
+     * construction. Default `false`.
+     */
+    reveal?: boolean | number;
+    /** Pass-through class on the chip root. */
+    class?: HTMLAttributes["class"];
+}

package/dist/components/custom/instrument-chassis/InstrumentChassis.vue.d.ts

@@ -17,8 +17,19 @@ export type InstrumentChassisPhase = "ready" | "ping" | "download" | "upload" |
  *   architectural underclaim. Consumed at quiet-content App-level
  *   mounts (the inner card paints its own glass tier — the spine is
  *   the housing that frames it).
+ *
+ * - `"structure"` (BA.W-ATLAS-RECONCILE C-3) — the SILVER structure-metal
+ *   register. A cool polished-steel milled-panel read: the engraved bezel +
+ *   the structural grooves re-point to the `--silver` quad (the gold quad's
+ *   cool mirror) instead of the warm-cream `--surface-tint-*` default, so the
+ *   chassis reads as an INDUSTRIAL precision-instrument housing — the cool-metal
+ *   twin of the gold "complete"-phase affirmation. The phase cascade stays
+ *   orthogonal (a `structure` chassis still retints on `data-phase`); only the
+ *   structure-metal recipe forks. The silver is the W-NO-GRAY named cool-neutral
+ *   exception. Consumer #2 of the silver quad (the atlas's structure surface is
+ *   consumer #1).
  */
-export type InstrumentChassisVariant = "glass" | "spine";
+export type InstrumentChassisVariant = "glass" | "spine" | "structure";
 /**
  * <InstrumentChassis> — single glass surface composing strip / dial / control
  * regions, glued together by twin-line hairline grooves.
@@ -56,7 +67,9 @@ type __VLS_Props = {
      * Surface register. Defaults to `"glass"` (the canonical chassis
      * plate). Pass `"spine"` at App-level mount paths to get the
      * housing register (polished sleeve, no backdrop-filter, interior
-     * vignette + hairline outer stroke).
+     * vignette + hairline outer stroke). Pass `"structure"` for the
+     * silver milled-panel register (cool polished-steel bezel + grooves;
+     * BA.W-ATLAS-RECONCILE C-3).
      */
     variant?: InstrumentChassisVariant;
     class?: HTMLAttributes["class"];

package/dist/components/custom/pager-dots/PagerDots.vue.d.ts

@@ -0,0 +1,39 @@
+import type { HTMLAttributes } from "vue";
+export interface PagerDotsProps {
+    /** Total dot count (the slide/snap count). */
+    count: number;
+    /** Rail layout axis. Default horizontal. */
+    orientation?: "horizontal" | "vertical";
+    /**
+     * When set, window the rail to `fit` dots centered on the active dot
+     * (the DeckPager dock-gutter overflow generalized). Off (undefined) →
+     * show every dot.
+     */
+    windowFit?: number;
+    /** Encapsulate the rail in the glass pager pill chassis. Default true. */
+    ring?: boolean;
+    /** Accessible name for the rail group. */
+    ariaLabel?: string;
+    /** Additional classes for the rail root. */
+    class?: HTMLAttributes["class"];
+}
+type __VLS_Props = PagerDotsProps;
+type __VLS_ModelProps = {
+    /** v-model:active — the active 0-based index. */
+    "active"?: number;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:active": (value: number) => any;
+} & {
+    select: (index: number) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onSelect?: ((index: number) => any) | undefined;
+    "onUpdate:active"?: ((value: number) => any) | undefined;
+}>, {
+    orientation: "horizontal" | "vertical";
+    ariaLabel: string;
+    ring: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/custom/pager-dots/index.d.ts

@@ -0,0 +1,2 @@
+export { default as PagerDots } from "./PagerDots.vue";
+export type { PagerDotsProps } from "./PagerDots.vue";

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

@@ -1,5 +1,5 @@
 import { type HTMLAttributes } from "vue";
-/** The canonical tab/option shape — one descriptor across all three variants. */
+/** The canonical tab/option shape — one descriptor across both materials. */
 export interface SegmentedTabOption {
     label: string;
     value: string;
@@ -7,9 +7,13 @@ export interface SegmentedTabOption {
     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";
+/** The two materials. `pill` (DEFAULT) = the glass-track slider (absorbs the
+ *  retired `segmented`); `underline` = the paper ink-hairline rule. */
+export type SegmentedTabsVariant = "pill" | "underline";
+/** The orientation axis — `horizontal` (default) lays children in a row + tracks
+ *  the indicator on the inline axis; `vertical` stacks a column + tracks the
+ *  block axis (the vertical underline is the leading-edge ink rail). */
+export type SegmentedTabsOrientation = "horizontal" | "vertical";
 export interface SegmentedTabsResponsive {
     /**
      * CSS length consumed inside `(min-width: <breakpoint>)`. BELOW it the
@@ -30,34 +34,26 @@ export interface SegmentedTabsResponsive {
 export interface SegmentedTabsProps {
     options: SegmentedTabOption[];
     /**
-     * Indicator chrome — `segmented` (DEFAULT, the pill-slider over a muted
-     * track), `pill` (solid foreground pill), `underline` (the hairline rule).
+     * The material — `pill` (DEFAULT, the glass-track slider) or `underline`
+     * (the paper ink-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).
+     * Orientation — `horizontal` (default) or `vertical`. Axis-derived on the
+     * one indicator engine.
      */
-    multiSelect?: boolean;
+    orientation?: SegmentedTabsOrientation;
     /**
-     * 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 collapse — below the breakpoint the strip becomes a `<Select>`.
+     * `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[];
+    modelValue: string;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare var __VLS_50: {
@@ -73,14 +69,13 @@ type __VLS_Slots = {} & {
     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;
+    "update:modelValue": (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: string | string[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
-    overflow: "none" | "scroll" | "auto";
+    orientation: SegmentedTabsOrientation;
     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;

package/dist/components/custom/tabs/composables/useTabIndicator.d.ts

@@ -2,21 +2,32 @@ import { type Ref, type ComputedRef } from "vue";
 import type { SegmentedTabOption } from "../SegmentedTabs.vue";
 /**
  * Package-private composable for `SegmentedTabs.vue` — owns the JS-measured
- * indicator path: the single- and multi-select slider styles, the offset
- * measure, the model/options re-measure watchers, and the ResizeObserver
- * lifecycle. It ALSO owns the AX.W53 travel-squish: a velocity-driven,
- * volume-preserving `--stretch` scalar the active indicator reads so it
- * STRETCHES along its travel axis as it glides between tabs and settles to fit
- * (the Material 3 ELASTIC / Apple Liquid-Glass register, capped LOW).
+ * single-select indicator path: the slider style, the offset measure, the
+ * model/options re-measure watchers, and the ResizeObserver lifecycle. It ALSO
+ * owns the AX.W53 travel-squish: a velocity-driven, volume-preserving `--stretch`
+ * scalar the active indicator reads so it STRETCHES along its travel axis as it
+ * glides between tabs and settles to fit (the Material 3 ELASTIC / Apple
+ * Liquid-Glass register, capped LOW).
  *
- * The composable is the SOLE writer of the JS slider styles. The measure path
- * runs only on the multi-select OR `@supports not (anchor)` branch — on an
- * anchor-supporting single-select engine the CSS `anchor-name` owns the slider
- * position and that path stays dormant (no RO is constructed, no measure runs).
- * The squish is independent of the position path: it is a transient `--stretch`
- * write driven on EVERY selection (anchor or JS engine) and reads from
- * `--tab-indicator-max-stretch`, so the elastic warp lands on all three
- * variants. Honors `prefers-reduced-motion` (no squish under reduce).
+ * BA.W-TABS — the engine is AXIS-DERIVED (the `vertical` param): the JS slider
+ * writes width/translateX on the inline axis (horizontal) OR height/translateY on
+ * the block axis (vertical). It is CENTER-ANCHORED (the BA-VJS-3 / valuejs-fold A-5
+ * fix): the indicator is positioned by its CENTER == the active button's center
+ * (translate = buttonCenter − indicatorSize/2), so the squish (which scales from
+ * `transform-origin: center`) keeps the indicator center pinned to the label
+ * center — the prior `translateX(offsetLeft)` left-edge write is GONE.
+ *
+ * The composable is the SOLE writer of the JS slider style. The measure path runs
+ * only on the `@supports not (anchor)` branch — on an anchor-supporting engine the
+ * CSS `anchor-name` owns the slider position and that path stays dormant (no RO is
+ * constructed, no measure runs). The squish is independent of the position path: it
+ * is a transient `--stretch` write driven on EVERY selection (anchor or JS engine)
+ * and reads from `--tab-indicator-max-stretch`, and RELEASES AT ARRIVAL (keyed to
+ * the calibrated clock, not a fixed mid-glide timer). Honors
+ * `prefers-reduced-motion` (no squish under reduce). The underline material SLIDES
+ * (no squish — a hairline does not deform), gated by the `vertical`/underline
+ * early-return at the SFC's `squishOnTravel` call shape (the underline has no
+ * `indicatorRef` element).
  */
 export interface UseTabIndicatorParams {
     /** The container scroller root (observed by the ResizeObserver). */
@@ -28,21 +39,19 @@ export interface UseTabIndicatorParams {
     /** The tab options (re-measure on change). */
     options: ComputedRef<SegmentedTabOption[]>;
     /** The defineModel value (re-measure on change). */
-    model: Ref<string | string[] | undefined>;
-    /** True for the multi-select path. */
-    multiSelect: ComputedRef<boolean>;
+    model: Ref<string | undefined>;
     /** Whether the browser supports CSS anchor positioning. */
     anchorSupported: boolean;
-    /** True when ANY JS slider writer is live (gates RO/watcher attach). */
+    /** True when the JS slider writer is live (gates RO/watcher attach). */
     jsSliderActive: ComputedRef<boolean>;
-    /** The active option values (used by the multi-slider measure). */
+    /** The active option values (used by the measure). */
     activeValues: ComputedRef<string[]>;
+    /** True for the vertical (block-axis) orientation. */
+    vertical: ComputedRef<boolean>;
 }
 export interface UseTabIndicatorReturn {
     /** Inline style for the single-select JS slider. */
     singleSliderStyle: Ref<Record<string, string>>;
-    /** Inline styles for each active multi-select slider, keyed by value. */
-    multiSliderStyles: Ref<Record<string, Record<string, string>>>;
     /** Imperatively kick the travel-squish on a selection at `idx`. */
     squishOnTravel: (toIdx: number) => void;
 }

package/dist/components/custom/tabs/constants.d.ts

@@ -6,7 +6,13 @@
  */
 export declare const DEFAULT_INDICATOR_MAX_STRETCH = 1.08;
 /**
- * ms after the stretch opens before it releases back to fit (`--stretch → 1`) — the
- * Material "grow then shrink" close. Rides the same snappy glide clock as the travel.
+ * The travel-progress fraction at which the squish RELEASES — the Material
+ * "grow then shrink" close, keyed to ARRIVAL (BA.W-TABS). The squish opens with
+ * the glide and releases when the indicator is within this fraction of its target
+ * (release-at-arrival), retiring the fixed mid-glide `INDICATOR_RELEASE_MS` timer
+ * (which fired at 60ms — BEFORE the ~100ms 90%-travel point, mid-glide). The
+ * release schedules off the calibrated clock (`--spring-snappy-duration`) scaled
+ * by this fraction, so the stretch peaks during travel and shrinks to fit AT
+ * arrival, never before.
  */
-export declare const INDICATOR_RELEASE_MS = 60;
+export declare const INDICATOR_RELEASE_AT_ARRIVAL = 0.82;

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

@@ -1,2 +1,2 @@
 export { default as SegmentedTabs } from "./SegmentedTabs.vue";
-export type { SegmentedTabOption, SegmentedTabsVariant, SegmentedTabsProps, SegmentedTabsResponsive, } from "./SegmentedTabs.vue";
+export type { SegmentedTabOption, SegmentedTabsVariant, SegmentedTabsOrientation, SegmentedTabsProps, SegmentedTabsResponsive, } from "./SegmentedTabs.vue";

package/dist/components/custom/watercolor-dot/WatercolorDot.vue.d.ts

@@ -13,6 +13,19 @@
 type __VLS_Props = {
     /** CSS color painted as the swatch background (any CSS color form). */
     color: string;
+    /**
+     * Render mode (BA.W-EMISSION / BA-VJS-C2):
+     *   `solid` (default) — the filled organic blob (the swatch background IS the
+     *                       color; the existing register, unchanged).
+     *   `ghost`  — the SAME seeded blob SILHOUETTE rendered as a STROKE: a
+     *              `color` border over a low-alpha `color` fill, the irregular-blob
+     *              outline (NOT a CSS dashed rectangle). A `ghost` of a given
+     *              `color + seed` matches the SAME silhouette the `solid` dot of
+     *              that seed renders — both read the same `useWatercolorBlob`
+     *              border-radius morph; the stroke is the only delta. The
+     *              empty-palette-slot / placeholder affordance.
+     */
+    variant?: "solid" | "ghost";
     /** Run the rAF-driven shape morph (default false → static, hover-morph only). */
     animate?: boolean;
     /** Host tag — `div` (decorative) or `button` (interactive). */
@@ -30,6 +43,7 @@ type __VLS_Slots = {} & {
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     animate: boolean;
+    variant: "solid" | "ghost";
     seed: string;
     range: [number, number];
     tag: "div" | "button";