@vaam-apps/ui 0.1.0

package/dist/components/status/state-mark.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../../lib/cn.js";
+// Geometry per design doc §4.3, at a 16x16 viewBox: circle r=6 centred at
+// (8,8), stroke 1.5; the progress wedge/ring inset 1.5 from that stroke
+// (r=4.5); diamond = square rotated 45deg, circumradius 7; square = 10x10
+// centred, corner radius 1. All at stroke-width 1.5.
+const CX = 8;
+const CY = 8;
+const R = 6;
+const R_INNER = 4.5;
+/** Clockwise pie wedge from 12 o'clock, `sweepDeg` degrees, radius `r`. */
+function pieWedgePath(sweepDeg, r) {
+    const rad = (sweepDeg * Math.PI) / 180;
+    const x = CX + r * Math.sin(rad);
+    const y = CY - r * Math.cos(rad);
+    const largeArc = sweepDeg > 180 ? 1 : 0;
+    return `M${CX},${CY} L${CX},${CY - r} A${r},${r} 0 ${largeArc},1 ${round(x)},${round(y)} Z`;
+}
+function round(n) {
+    return Math.round(n * 100) / 100;
+}
+const DIAMOND_POINTS = `${CX},${CY - 7} ${CX + 7},${CY} ${CX},${CY + 7} ${CX - 7},${CY}`;
+function Silhouette({ meta }) {
+    const fill = meta.filled ? "currentColor" : "none";
+    const stroke = "currentColor";
+    switch (meta.silhouette) {
+        case "circle":
+            return _jsx("circle", { cx: CX, cy: CY, r: R, fill: fill, stroke: stroke, strokeWidth: 1.5 });
+        case "diamond":
+            return _jsx("polygon", { points: DIAMOND_POINTS, fill: fill, stroke: stroke, strokeWidth: 1.5 });
+        case "square":
+            return (_jsx("rect", { x: 3, y: 3, width: 10, height: 10, rx: 1, fill: fill, stroke: stroke, strokeWidth: 1.5 }));
+    }
+}
+/**
+ * Terminal states (delivered/cancelled/expired/rejected/failed) render a
+ * solid, filled silhouette (design doc §4.3: "is it over?" is readable from
+ * fill alone). The interior mark then has to cut through that fill to stay
+ * legible — this is the one place `StateMark` is not literally
+ * single-tone: the mark strokes in `--state-mark-knockout` (default: the
+ * page canvas colour) rather than `currentColor`, since a currentColor
+ * stroke on a currentColor fill would be invisible. Non-terminal marks
+ * (pie wedges, the submitted ring, the uncertain "?", the undelivered
+ * pause bars) stay `currentColor` throughout, on an unfilled silhouette.
+ */
+function InteriorMark({ mark, knockout }) {
+    const stroke = knockout ? "var(--state-mark-knockout, var(--color-base-100))" : "currentColor";
+    const common = {
+        stroke,
+        strokeWidth: 1.5,
+        strokeLinecap: "round",
+        fill: "none",
+    };
+    switch (mark) {
+        case "pie-1":
+            return _jsx("path", { d: pieWedgePath(90, R_INNER), fill: "currentColor" });
+        case "pie-2":
+            return _jsx("path", { d: pieWedgePath(180, R_INNER), fill: "currentColor" });
+        case "pie-3":
+            return _jsx("path", { d: pieWedgePath(270, R_INNER), fill: "currentColor" });
+        case "ring":
+            return (_jsx("circle", { cx: CX, cy: CY, r: R_INNER, fill: "none", stroke: "currentColor", strokeWidth: 1.5 }));
+        case "check":
+            return _jsx("polyline", { points: "5.4,8.3 7.2,10.2 11,5.8", strokeLinejoin: "round", ...common });
+        case "cross":
+            return (_jsxs("g", { ...common, children: [_jsx("line", { x1: 5.6, y1: 5.6, x2: 10.4, y2: 10.4 }), _jsx("line", { x1: 10.4, y1: 5.6, x2: 5.6, y2: 10.4 })] }));
+        case "slash":
+            return _jsx("line", { x1: 5.6, y1: 10.4, x2: 10.4, y2: 5.6, ...common });
+        case "bar":
+            return _jsx("line", { x1: 5, y1: 8, x2: 11, y2: 8, ...common });
+        case "clock":
+            return (_jsxs("g", { ...common, children: [_jsx("line", { x1: 8, y1: 8, x2: 8, y2: 5.4 }), _jsx("line", { x1: 8, y1: 8, x2: 10.1, y2: 8.9 })] }));
+        case "question":
+            return (_jsxs("g", { ...common, children: [_jsx("path", { d: "M6.2 6.6c0-1.1 0.9-1.9 1.9-1.9s1.9 0.7 1.9 1.7c0 1.3-1.9 1.3-1.9 2.9" }), _jsx("circle", { cx: 8, cy: 10.7, r: 0.15, fill: "currentColor", stroke: "none" })] }));
+        case "pause":
+            return (_jsxs("g", { ...common, children: [_jsx("line", { x1: 6.3, y1: 5.5, x2: 6.3, y2: 10.5 }), _jsx("line", { x1: 9.7, y1: 5.5, x2: 9.7, y2: 10.5 })] }));
+    }
+}
+/**
+ * The status-glyph SVG primitive: silhouette × interior mark × fill.
+ *
+ * Parameterised on a raw [`StatusMeta`] rather than on any particular
+ * state enum, so every state machine's pill renders through this one
+ * geometry instead of forking it. Pure, and `aria-hidden` — the
+ * accessible name belongs on the wrapping pill, which has the label.
+ */
+export function StateMark({ meta, size = 14, className, ...props }) {
+    return (_jsxs("svg", { viewBox: "0 0 16 16", width: size, height: size, "aria-hidden": "true", className: cn("shrink-0", className), ...props, children: [_jsx(Silhouette, { meta: meta }), _jsx(InteriorMark, { mark: meta.mark, knockout: meta.filled })] }));
+}
+//# sourceMappingURL=state-mark.js.map

package/dist/components/status/state-mark.js.map

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

package/dist/components/status/status-pill.d.ts

@@ -0,0 +1,62 @@
+import type { ComponentType, ReactNode } from "react";
+import { type StatusMeta, type StatusSystem } from "./status-tokens.js";
+export interface StatusPillProps {
+    /** One state's presentation, e.g. `MY_STATUS_SYSTEM[state]`. */
+    meta: StatusMeta;
+    /** The raw enum literal, shown when `showLiteral` is set and used in the
+     * accessible name. Optional: a pill for a state machine whose literals
+     * are not user-facing can omit it. */
+    literal?: string | undefined;
+    /** Default `'auto'`: resolved from the state's own `attention` field. */
+    variant?: "auto" | "quiet" | "loud";
+    size?: "sm" | "md";
+    /** Render the mono enum literal beside the label. True in detail views,
+     * false in tables, where the label alone is enough and the literal is
+     * noise repeated down the column. */
+    showLiteral?: boolean;
+    /** Short mono qualifier, e.g. `failed · 4xx`. */
+    detail?: ReactNode;
+    /** Optimistic-transition case: dimmed + dashed, held until the server
+     * confirms. Never use it to mean "we think this is probably the state" —
+     * only for a transition this client has itself just requested. */
+    pending?: boolean;
+    interactive?: boolean;
+    onClick?: (() => void) | undefined;
+    className?: string | undefined;
+}
+/**
+ * The canonical status representation: glyph + label + attention
+ * treatment. Typically the single most-reused component in an operator
+ * console — every screen showing a state renders through it.
+ *
+ * Takes a [`StatusMeta`] rather than a state literal, so one
+ * implementation serves every state machine in an application.
+ * [`createStatusPill`] is the ergonomic wrapper; reach for this directly
+ * only when the meta comes from somewhere other than a fixed table.
+ */
+export declare function StatusPill({ meta, literal, variant, size, showLiteral, detail, pending, interactive, onClick, className, }: StatusPillProps): import("react").JSX.Element;
+export type TypedStatusPillProps<S extends string> = Omit<StatusPillProps, "meta" | "literal"> & {
+    state: S;
+};
+/**
+ * Binds a [`StatusSystem`] to a pill component whose `state` prop accepts
+ * exactly that system's states and nothing else.
+ *
+ * ```tsx
+ * export const OrderStatusPill = createStatusPill(ORDER_STATUS);
+ * <OrderStatusPill state="refunded" showLiteral />
+ * ```
+ *
+ * This replaced three hand-written, near-identical pill components — one
+ * per state machine — that differed only in which table they indexed and
+ * had already drifted apart in small ways (one set `role="img"`, one did
+ * not; one supported `interactive`, two did not). Their own doc comments
+ * each argued for staying separate on the grounds that the state machines
+ * genuinely differ in meaning — which is true, and is preserved here:
+ * each machine still has its own table and its own component identity,
+ * and `state` is still typed to one machine's literals, so a `JobState`
+ * cannot be passed to an order pill. What they do not need is three
+ * copies of the rendering.
+ */
+export declare function createStatusPill<S extends string>(system: StatusSystem<S>): ComponentType<TypedStatusPillProps<S>>;
+//# sourceMappingURL=status-pill.d.ts.map

package/dist/components/status/status-pill.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-pill.d.ts","sourceRoot":"","sources":["../../../src/components/status/status-pill.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtD,OAAO,EAAe,KAAK,UAAU,EAAE,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAElF,MAAM,WAAW,eAAe;IAC9B,gEAAgE;IAChE,IAAI,EAAE,UAAU,CAAC;IACjB;;0CAEsC;IACtC,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,yEAAyE;IACzE,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IACpC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;yCAEqC;IACrC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iDAAiD;IACjD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;sEAEkE;IAClE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAChC;AAED;;;;;;;;;GASG;AACH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,OAAO,EACP,OAAgB,EAChB,IAAW,EACX,WAAmB,EACnB,MAAM,EACN,OAAe,EACf,WAAmB,EACnB,OAAO,EACP,SAAS,GACV,EAAE,eAAe,+BAoEjB;AAED,MAAM,MAAM,oBAAoB,CAAC,CAAC,SAAS,MAAM,IAAI,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC,GAAG;IAC/F,KAAK,EAAE,CAAC,CAAC;CACV,CAAC;AAEF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,EAC/C,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,GACtB,aAAa,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC,CAKxC"}

package/dist/components/status/status-pill.js

@@ -0,0 +1,65 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "../../lib/cn.js";
+import { StateMark } from "./state-mark.js";
+import { HUE_CLASSES } from "./status-tokens.js";
+/**
+ * The canonical status representation: glyph + label + attention
+ * treatment. Typically the single most-reused component in an operator
+ * console — every screen showing a state renders through it.
+ *
+ * Takes a [`StatusMeta`] rather than a state literal, so one
+ * implementation serves every state machine in an application.
+ * [`createStatusPill`] is the ergonomic wrapper; reach for this directly
+ * only when the meta comes from somewhere other than a fixed table.
+ */
+export function StatusPill({ meta, literal, variant = "auto", size = "sm", showLiteral = false, detail, pending = false, interactive = false, onClick, className, }) {
+    const resolvedVariant = variant === "auto" ? meta.attention : variant;
+    const loud = resolvedVariant === "loud";
+    const hue = HUE_CLASSES[meta.hue];
+    const markSize = size === "md" ? 16 : 14;
+    const Comp = interactive ? "button" : "span";
+    return (_jsxs(Comp, { type: interactive ? "button" : undefined, onClick: interactive ? onClick : undefined, title: meta.tooltip, 
+        // A non-interactive pill is an image of a state, not a label for
+        // one; without `role="img"` the `aria-label` on a `<span>` is
+        // ignored by several screen readers.
+        role: interactive ? undefined : "img", "aria-label": literal === undefined ? meta.label : `${literal} — ${meta.label}`, className: cn("inline-flex items-center gap-[5px] whitespace-nowrap align-middle", "text-caption", loud && [hue.bg, hue.border, "rounded-sm border py-0.5 pr-1.5 pl-[5px] font-medium"], 
+        // A dashed outline, and NOT dimming. `pending` used to be
+        // `opacity-60`, which took its own text to 2.71:1 against the
+        // page — below AA, and unreadable at exactly the moment a reader
+        // most wants to know what is happening. Measured before changing
+        // it: the opacity that keeps this text at AA is 0.90, by which
+        // point the dimming conveys nothing. So the state says so with a
+        // border instead, at full text contrast.
+        //
+        // A quiet pill has no border to dash, so it grows the same box a
+        // loud one has — otherwise `pending` would be invisible on the
+        // majority of pills.
+        pending && "border-dashed", pending && !loud && "rounded-sm border border-edge-strong py-0.5 pr-1.5 pl-[5px]", interactive && "cursor-pointer", className), children: [_jsx(StateMark, { meta: meta, size: markSize, className: hue.fg }), _jsx("span", { className: loud ? hue.fg : "text-muted-foreground", children: meta.label }), showLiteral && literal !== undefined && (_jsx("span", { className: cn("font-mono text-micro", loud ? "text-muted-foreground" : "text-subtle-foreground"), children: literal })), detail != null && (_jsx("span", { className: cn("font-mono", loud ? "text-muted-foreground" : "text-subtle-foreground"), children: detail }))] }));
+}
+/**
+ * Binds a [`StatusSystem`] to a pill component whose `state` prop accepts
+ * exactly that system's states and nothing else.
+ *
+ * ```tsx
+ * export const OrderStatusPill = createStatusPill(ORDER_STATUS);
+ * <OrderStatusPill state="refunded" showLiteral />
+ * ```
+ *
+ * This replaced three hand-written, near-identical pill components — one
+ * per state machine — that differed only in which table they indexed and
+ * had already drifted apart in small ways (one set `role="img"`, one did
+ * not; one supported `interactive`, two did not). Their own doc comments
+ * each argued for staying separate on the grounds that the state machines
+ * genuinely differ in meaning — which is true, and is preserved here:
+ * each machine still has its own table and its own component identity,
+ * and `state` is still typed to one machine's literals, so a `JobState`
+ * cannot be passed to an order pill. What they do not need is three
+ * copies of the rendering.
+ */
+export function createStatusPill(system) {
+    function BoundStatusPill({ state, ...props }) {
+        return _jsx(StatusPill, { meta: system[state], literal: state, ...props });
+    }
+    return BoundStatusPill;
+}
+//# sourceMappingURL=status-pill.js.map

package/dist/components/status/status-pill.js.map

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

package/dist/components/status/status-tokens.d.ts

@@ -0,0 +1,110 @@
+/**
+ * The vocabulary of a status-glyph system — types and shared classes only,
+ * no domain data.
+ *
+ * # What this is
+ *
+ * A *status system* is one state machine's presentation: a table mapping
+ * every state that machine can be in to a glyph, a hue, an attention level
+ * and human copy. This module owns the vocabulary and the rendering; the
+ * table itself belongs to whoever owns the state machine, which is never
+ * this package.
+ *
+ * ```tsx
+ * const ORDER_STATUS = defineStatusSystem({
+ *   pending:  { family: "in-flight", silhouette: "circle", mark: "pie-1",
+ *               hue: "neutral", filled: false, attention: "quiet",
+ *               label: "Pending", tooltip: "Awaiting payment." },
+ *   paid:     { family: "terminal", silhouette: "circle", mark: "check",
+ *               hue: "success", filled: true, attention: "quiet",
+ *               label: "Paid", tooltip: "Settled." },
+ *   refunded: { family: "terminal", silhouette: "circle", mark: "bar",
+ *               hue: "neutral", filled: true, attention: "quiet",
+ *               label: "Refunded", tooltip: "Returned to the payer." },
+ * });
+ *
+ * const OrderStatusPill = createStatusPill(ORDER_STATUS);
+ * <OrderStatusPill state="paid" />
+ * ```
+ *
+ * # Every field here is PRESENTATIONAL
+ *
+ * Never use `family` — or anything else in a `StatusMeta` — to decide
+ * whether an action is permitted. Terminality is data, and the server
+ * owns it: a UI that greys out "cancel" because its own table says
+ * `terminal` will be wrong the first time the state machine changes and
+ * nobody remembers this table exists. Propose the action and let the
+ * server refuse it.
+ *
+ * # Why a glyph and not just colour
+ *
+ * Colour alone fails for the ~8% of men with a colour-vision deficiency,
+ * and fails completely in a screenshot pasted into a monochrome ticket.
+ * Each state therefore differs in *silhouette* (circle / diamond /
+ * square), *interior mark*, and *fill* as well as hue — three redundant
+ * channels, so no single one is load-bearing.
+ */
+/**
+ * The three-way split every state machine this system has met so far
+ * reduces to: still moving, stopped somewhere that needs a human, or done.
+ *
+ * `unresolved` is the one worth naming explicitly — it is not a failure
+ * and not a success, and systems that only model two outcomes end up
+ * calling it whichever is more convenient, which is how "we never learned
+ * the outcome" gets reported to a user as "delivered".
+ */
+export type StatusFamily = "in-flight" | "unresolved" | "terminal";
+export type StatusSilhouette = "circle" | "diamond" | "square";
+/**
+ * The interior mark drawn inside the silhouette. `pie-1`..`pie-3` are the
+ * quarter-fill progress wedge; `ring` is a completed stroke with a hollow
+ * centre (handed off, awaiting an external answer).
+ */
+export type StatusMark = "pie-1" | "pie-2" | "pie-3" | "ring" | "check" | "bar" | "clock" | "slash" | "cross" | "question" | "pause";
+/**
+ * The saturated hues a status may take.
+ *
+ * `warning` and `uncertain` are deliberately distinct despite both reading
+ * as "attention": `uncertain` means the outcome is unknown, `warning`
+ * means a recoverable condition needs a human. `expired` and `parked` are
+ * separated from `neutral` for the same reason — a state nobody needs to
+ * act on and a state waiting for someone should not look identical.
+ */
+export type StatusHue = "neutral" | "success" | "warning" | "danger" | "uncertain" | "expired" | "parked";
+/** Quiet: glyph only, no fill. Loud: tinted background + border. */
+export type StatusAttention = "quiet" | "loud";
+export interface StatusMeta {
+    family: StatusFamily;
+    silhouette: StatusSilhouette;
+    mark: StatusMark;
+    hue: StatusHue;
+    /** Terminal marks sit on a filled silhouette; in-flight/unresolved marks are stroked-only. */
+    filled: boolean;
+    attention: StatusAttention;
+    /** Human-facing name. Sentence case, not the raw enum literal. */
+    label: string;
+    /** One or two sentences saying what this state means and what happens next. */
+    tooltip: string;
+}
+/** One state machine's complete presentation table. */
+export type StatusSystem<S extends string> = Readonly<Record<S, StatusMeta>>;
+/**
+ * Identity at runtime; exists for inference. Without it a caller must
+ * write `const X: StatusSystem<"a" | "b"> = {…}` and repeat every key in
+ * the type annotation; with it, `S` is inferred from the object's own keys
+ * and `createStatusPill(X)` then accepts exactly those keys and no others.
+ */
+export declare function defineStatusSystem<S extends string>(system: StatusSystem<S>): StatusSystem<S>;
+/**
+ * Whether a state is terminal *according to its own table* — a
+ * presentational question ("should this row stop animating"), never an
+ * authorisation one. See this module's own warning above.
+ */
+export declare function isTerminalStatus<S extends string>(system: StatusSystem<S>, state: S): boolean;
+/** Hue → the token classes every status surface renders through. */
+export declare const HUE_CLASSES: Record<StatusHue, {
+    fg: string;
+    bg: string;
+    border: string;
+}>;
+//# sourceMappingURL=status-tokens.d.ts.map

package/dist/components/status/status-tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-tokens.d.ts","sourceRoot":"","sources":["../../../src/components/status/status-tokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AAEH;;;;;;;;GAQG;AACH,MAAM,MAAM,YAAY,GAAG,WAAW,GAAG,YAAY,GAAG,UAAU,CAAC;AAEnE,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE/D;;;;GAIG;AACH,MAAM,MAAM,UAAU,GAClB,OAAO,GACP,OAAO,GACP,OAAO,GACP,MAAM,GACN,OAAO,GACP,KAAK,GACL,OAAO,GACP,OAAO,GACP,OAAO,GACP,UAAU,GACV,OAAO,CAAC;AAEZ;;;;;;;;GAQG;AACH,MAAM,MAAM,SAAS,GACjB,SAAS,GACT,SAAS,GACT,SAAS,GACT,QAAQ,GACR,WAAW,GACX,SAAS,GACT,QAAQ,CAAC;AAEb,oEAAoE;AACpE,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,MAAM,CAAC;AAE/C,MAAM,WAAW,UAAU;IACzB,MAAM,EAAE,YAAY,CAAC;IACrB,UAAU,EAAE,gBAAgB,CAAC;IAC7B,IAAI,EAAE,UAAU,CAAC;IACjB,GAAG,EAAE,SAAS,CAAC;IACf,8FAA8F;IAC9F,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,eAAe,CAAC;IAC3B,kEAAkE;IAClE,KAAK,EAAE,MAAM,CAAC;IACd,+EAA+E;IAC/E,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,uDAAuD;AACvD,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,MAAM,IAAI,QAAQ,CAAC,MAAM,CAAC,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC;AAE7E;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,MAAM,EAAE,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,CAE7F;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,EAAE,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,OAAO,CAE7F;AAED,oEAAoE;AACpE,eAAO,MAAM,WAAW,EAAE,MAAM,CAAC,SAAS,EAAE;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAoCrF,CAAC"}

package/dist/components/status/status-tokens.js

@@ -0,0 +1,102 @@
+/**
+ * The vocabulary of a status-glyph system — types and shared classes only,
+ * no domain data.
+ *
+ * # What this is
+ *
+ * A *status system* is one state machine's presentation: a table mapping
+ * every state that machine can be in to a glyph, a hue, an attention level
+ * and human copy. This module owns the vocabulary and the rendering; the
+ * table itself belongs to whoever owns the state machine, which is never
+ * this package.
+ *
+ * ```tsx
+ * const ORDER_STATUS = defineStatusSystem({
+ *   pending:  { family: "in-flight", silhouette: "circle", mark: "pie-1",
+ *               hue: "neutral", filled: false, attention: "quiet",
+ *               label: "Pending", tooltip: "Awaiting payment." },
+ *   paid:     { family: "terminal", silhouette: "circle", mark: "check",
+ *               hue: "success", filled: true, attention: "quiet",
+ *               label: "Paid", tooltip: "Settled." },
+ *   refunded: { family: "terminal", silhouette: "circle", mark: "bar",
+ *               hue: "neutral", filled: true, attention: "quiet",
+ *               label: "Refunded", tooltip: "Returned to the payer." },
+ * });
+ *
+ * const OrderStatusPill = createStatusPill(ORDER_STATUS);
+ * <OrderStatusPill state="paid" />
+ * ```
+ *
+ * # Every field here is PRESENTATIONAL
+ *
+ * Never use `family` — or anything else in a `StatusMeta` — to decide
+ * whether an action is permitted. Terminality is data, and the server
+ * owns it: a UI that greys out "cancel" because its own table says
+ * `terminal` will be wrong the first time the state machine changes and
+ * nobody remembers this table exists. Propose the action and let the
+ * server refuse it.
+ *
+ * # Why a glyph and not just colour
+ *
+ * Colour alone fails for the ~8% of men with a colour-vision deficiency,
+ * and fails completely in a screenshot pasted into a monochrome ticket.
+ * Each state therefore differs in *silhouette* (circle / diamond /
+ * square), *interior mark*, and *fill* as well as hue — three redundant
+ * channels, so no single one is load-bearing.
+ */
+/**
+ * Identity at runtime; exists for inference. Without it a caller must
+ * write `const X: StatusSystem<"a" | "b"> = {…}` and repeat every key in
+ * the type annotation; with it, `S` is inferred from the object's own keys
+ * and `createStatusPill(X)` then accepts exactly those keys and no others.
+ */
+export function defineStatusSystem(system) {
+    return system;
+}
+/**
+ * Whether a state is terminal *according to its own table* — a
+ * presentational question ("should this row stop animating"), never an
+ * authorisation one. See this module's own warning above.
+ */
+export function isTerminalStatus(system, state) {
+    return system[state].family === "terminal";
+}
+/** Hue → the token classes every status surface renders through. */
+export const HUE_CLASSES = {
+    neutral: {
+        fg: "text-state-neutral-fg",
+        bg: "bg-state-neutral-bg",
+        border: "border-state-neutral-border",
+    },
+    success: {
+        fg: "text-state-success-fg",
+        bg: "bg-state-success-bg",
+        border: "border-state-success-border",
+    },
+    warning: {
+        fg: "text-state-warning-fg",
+        bg: "bg-state-warning-bg",
+        border: "border-state-warning-border",
+    },
+    danger: {
+        fg: "text-state-danger-fg",
+        bg: "bg-state-danger-bg",
+        border: "border-state-danger-border",
+    },
+    uncertain: {
+        fg: "text-state-uncertain-fg",
+        bg: "bg-state-uncertain-bg",
+        border: "border-state-uncertain-border",
+    },
+    expired: {
+        fg: "text-state-expired-fg",
+        bg: "bg-state-expired-bg",
+        border: "border-state-expired-border",
+    },
+    parked: {
+        fg: "text-state-parked-fg",
+        bg: "bg-state-parked-bg",
+        border: "border-state-parked-border",
+    },
+};
+//# sourceMappingURL=status-tokens.js.map

package/dist/components/status/status-tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-tokens.js","sourceRoot":"","sources":["../../../src/components/status/status-tokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AAuEH;;;;;GAKG;AACH,MAAM,UAAU,kBAAkB,CAAmB,MAAuB;IAC1E,OAAO,MAAM,CAAC;AAChB,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,gBAAgB,CAAmB,MAAuB,EAAE,KAAQ;IAClF,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC,MAAM,KAAK,UAAU,CAAC;AAC7C,CAAC;AAED,oEAAoE;AACpE,MAAM,CAAC,MAAM,WAAW,GAAkE;IACxF,OAAO,EAAE;QACP,EAAE,EAAE,uBAAuB;QAC3B,EAAE,EAAE,qBAAqB;QACzB,MAAM,EAAE,6BAA6B;KACtC;IACD,OAAO,EAAE;QACP,EAAE,EAAE,uBAAuB;QAC3B,EAAE,EAAE,qBAAqB;QACzB,MAAM,EAAE,6BAA6B;KACtC;IACD,OAAO,EAAE;QACP,EAAE,EAAE,uBAAuB;QAC3B,EAAE,EAAE,qBAAqB;QACzB,MAAM,EAAE,6BAA6B;KACtC;IACD,MAAM,EAAE;QACN,EAAE,EAAE,sBAAsB;QAC1B,EAAE,EAAE,oBAAoB;QACxB,MAAM,EAAE,4BAA4B;KACrC;IACD,SAAS,EAAE;QACT,EAAE,EAAE,yBAAyB;QAC7B,EAAE,EAAE,uBAAuB;QAC3B,MAAM,EAAE,+BAA+B;KACxC;IACD,OAAO,EAAE;QACP,EAAE,EAAE,uBAAuB;QAC3B,EAAE,EAAE,qBAAqB;QACzB,MAAM,EAAE,6BAA6B;KACtC;IACD,MAAM,EAAE;QACN,EAAE,EAAE,sBAAsB;QAC1B,EAAE,EAAE,oBAAoB;QACxB,MAAM,EAAE,4BAA4B;KACrC;CACF,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,76 @@
+/**
+ * `@vaam-apps/ui` — a dark-first React component library for operator
+ * consoles: daisyUI for styling, Headless UI for behaviour, and a
+ * parameterised status-glyph system for state machines.
+ *
+ * Import the token layer **once**, from the app's own global stylesheet,
+ * after loading Tailwind and the daisyUI plugin:
+ *
+ * ```css
+ * @import "tailwindcss";
+ * @plugin "daisyui";
+ * @import "@vaam-apps/ui/styles/theme.css";
+ * @source "../node_modules/@vaam-apps/ui/dist";
+ * ```
+ *
+ * The `@source` line is not optional: Tailwind v4 only generates the
+ * utilities it can see used, and it does not look inside `node_modules`
+ * by default. Omit it and every component renders unstyled — a silent
+ * failure that is miserable to debug.
+ */
+export * from "./components/data/code.js";
+export * from "./components/data/copy-button.js";
+export * from "./components/data/detail-row.js";
+export * from "./components/data/id-display.js";
+export * from "./components/data/masked-value.js";
+export * from "./components/data/money.js";
+export * from "./components/data/phone-display.js";
+export * from "./components/data/stat-tile.js";
+export * from "./components/data/timestamp-display.js";
+export * from "./components/patterns/inline-banner.js";
+export * from "./components/patterns/inline-empty-state.js";
+export * from "./components/patterns/live-row.js";
+export * from "./components/patterns/payload-inspector.js";
+export * from "./components/patterns/route-skeleton.js";
+export * from "./components/patterns/screen-layout.js";
+export * from "./components/patterns/stale-write-banner.js";
+export * from "./components/patterns/state-timeline.js";
+export * from "./components/primitives/badge.js";
+export * from "./components/primitives/button.js";
+export * from "./components/primitives/calendar.js";
+export * from "./components/primitives/card.js";
+export * from "./components/primitives/checkbox.js";
+export * from "./components/primitives/chip-select.js";
+export * from "./components/primitives/command-menu.js";
+export * from "./components/primitives/confirm-dialog.js";
+export * from "./components/primitives/date-picker.js";
+export * from "./components/primitives/dialog.js";
+export * from "./components/primitives/drawer.js";
+export * from "./components/primitives/dropdown-menu.js";
+export * from "./components/primitives/form-field.js";
+export * from "./components/primitives/inline-confirm.js";
+export * from "./components/primitives/input.js";
+export * from "./components/primitives/label.js";
+export * from "./components/primitives/pagination.js";
+export * from "./components/primitives/popover.js";
+export * from "./components/primitives/progress.js";
+export * from "./components/primitives/radio-group.js";
+export * from "./components/primitives/select.js";
+export * from "./components/primitives/separator.js";
+export * from "./components/primitives/side-nav.js";
+export * from "./components/primitives/skeleton.js";
+export * from "./components/primitives/spinner.js";
+export * from "./components/primitives/switch.js";
+export * from "./components/primitives/table.js";
+export * from "./components/primitives/tabs.js";
+export * from "./components/primitives/textarea.js";
+export * from "./components/primitives/toast.js";
+export * from "./components/primitives/tooltip.js";
+export * from "./components/status/state-chip.js";
+export * from "./components/status/state-mark.js";
+export * from "./components/status/status-pill.js";
+export * from "./components/status/status-tokens.js";
+export { cn } from "./lib/cn.js";
+export * from "./lib/money.js";
+export { omitUndefined } from "./lib/omit-undefined.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAMH,cAAc,wBAAwB,CAAC;AACvC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,yBAAyB,CAAC;AACxC,cAAc,iCAAiC,CAAC;AAChD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qCAAqC,CAAC;AAKpD,cAAc,qCAAqC,CAAC;AACpD,cAAc,0CAA0C,CAAC;AACzD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,yCAAyC,CAAC;AACxD,cAAc,sCAAsC,CAAC;AACrD,cAAc,qCAAqC,CAAC;AACpD,cAAc,0CAA0C,CAAC;AACzD,cAAc,sCAAsC,CAAC;AAIrD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,kCAAkC,CAAC;AACjD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,qCAAqC,CAAC;AACpD,cAAc,sCAAsC,CAAC;AACrD,cAAc,wCAAwC,CAAC;AACvD,cAAc,qCAAqC,CAAC;AACpD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,uCAAuC,CAAC;AACtD,cAAc,oCAAoC,CAAC;AACnD,cAAc,wCAAwC,CAAC;AACvD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,oCAAoC,CAAC;AACnD,cAAc,iCAAiC,CAAC;AAChD,cAAc,kCAAkC,CAAC;AACjD,cAAc,qCAAqC,CAAC;AACpD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,mCAAmC,CAAC;AAClD,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC;AACjD,cAAc,iCAAiC,CAAC;AAChD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,iCAAiC,CAAC;AAMhD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,iCAAiC,CAAC;AAChD,cAAc,mCAAmC,CAAC;AAKlD,OAAO,EAAE,EAAE,EAAE,MAAM,UAAU,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/index.js

@@ -0,0 +1,95 @@
+/**
+ * `@vaam-apps/ui` — a dark-first React component library for operator
+ * consoles: daisyUI for styling, Headless UI for behaviour, and a
+ * parameterised status-glyph system for state machines.
+ *
+ * Import the token layer **once**, from the app's own global stylesheet,
+ * after loading Tailwind and the daisyUI plugin:
+ *
+ * ```css
+ * @import "tailwindcss";
+ * @plugin "daisyui";
+ * @import "@vaam-apps/ui/styles/theme.css";
+ * @source "../node_modules/@vaam-apps/ui/dist";
+ * ```
+ *
+ * The `@source` line is not optional: Tailwind v4 only generates the
+ * utilities it can see used, and it does not look inside `node_modules`
+ * by default. Omit it and every component renders unstyled — a silent
+ * failure that is miserable to debug.
+ */
+// ---------------------------------------------------------------------------
+// Data display — consistency is the deliverable, so these are components
+// rather than ad hoc per-screen formatting.
+// ---------------------------------------------------------------------------
+export * from "./components/data/code.js";
+export * from "./components/data/copy-button.js";
+export * from "./components/data/detail-row.js";
+export * from "./components/data/id-display.js";
+export * from "./components/data/masked-value.js";
+export * from "./components/data/money.js";
+export * from "./components/data/phone-display.js";
+export * from "./components/data/stat-tile.js";
+export * from "./components/data/timestamp-display.js";
+// ---------------------------------------------------------------------------
+// Patterns — composed screen-level building blocks. Still domain-free,
+// but opinionated about layout in a way the primitives are not.
+// ---------------------------------------------------------------------------
+export * from "./components/patterns/inline-banner.js";
+export * from "./components/patterns/inline-empty-state.js";
+export * from "./components/patterns/live-row.js";
+export * from "./components/patterns/payload-inspector.js";
+export * from "./components/patterns/route-skeleton.js";
+export * from "./components/patterns/screen-layout.js";
+export * from "./components/patterns/stale-write-banner.js";
+export * from "./components/patterns/state-timeline.js";
+// ---------------------------------------------------------------------------
+// Primitives
+// ---------------------------------------------------------------------------
+export * from "./components/primitives/badge.js";
+export * from "./components/primitives/button.js";
+export * from "./components/primitives/calendar.js";
+export * from "./components/primitives/card.js";
+export * from "./components/primitives/checkbox.js";
+export * from "./components/primitives/chip-select.js";
+export * from "./components/primitives/command-menu.js";
+export * from "./components/primitives/confirm-dialog.js";
+export * from "./components/primitives/date-picker.js";
+export * from "./components/primitives/dialog.js";
+export * from "./components/primitives/drawer.js";
+export * from "./components/primitives/dropdown-menu.js";
+export * from "./components/primitives/form-field.js";
+export * from "./components/primitives/inline-confirm.js";
+export * from "./components/primitives/input.js";
+export * from "./components/primitives/label.js";
+export * from "./components/primitives/pagination.js";
+export * from "./components/primitives/popover.js";
+export * from "./components/primitives/progress.js";
+export * from "./components/primitives/radio-group.js";
+export * from "./components/primitives/select.js";
+export * from "./components/primitives/separator.js";
+export * from "./components/primitives/side-nav.js";
+export * from "./components/primitives/skeleton.js";
+export * from "./components/primitives/spinner.js";
+export * from "./components/primitives/switch.js";
+export * from "./components/primitives/table.js";
+export * from "./components/primitives/tabs.js";
+export * from "./components/primitives/textarea.js";
+export * from "./components/primitives/toast.js";
+export * from "./components/primitives/tooltip.js";
+// ---------------------------------------------------------------------------
+// Status — the most-reused surface in an operator console. Read
+// `status-tokens.ts` first: the tables live in the consuming application,
+// not here.
+// ---------------------------------------------------------------------------
+export * from "./components/status/state-chip.js";
+export * from "./components/status/state-mark.js";
+export * from "./components/status/status-pill.js";
+export * from "./components/status/status-tokens.js";
+// ---------------------------------------------------------------------------
+// Utilities
+// ---------------------------------------------------------------------------
+export { cn } from "./lib/cn.js";
+export * from "./lib/money.js";
+export { omitUndefined } from "./lib/omit-undefined.js";
+//# sourceMappingURL=index.js.map