@snap-rail/framework-shadcn 0.0.0-stage → 0.2.0

package/lib/types/ui/drag-scroll.d.ts

@@ -0,0 +1,13 @@
+/**
+ * DragScroll: an overflow-auto container that also pans when held and
+ * dragged with the mouse (both axes). Touch and pen keep Chromium's native
+ * pan, so only mouse pointers are intercepted. A 6px threshold separates a
+ * pan from a press; the click that follows a pan is swallowed so dragged
+ * rows never fire. DragScrolls nest (a table inside a scrolled page); only
+ * the innermost container under the pressed target takes the gesture.
+ *
+ * @module @snap-rail/framework-shadcn/ui/drag-scroll
+ */
+import { type ComponentProps, type ReactNode } from 'react';
+/** An auto-scrolling div that pans under a held mouse drag. */
+export declare function DragScroll({ className, children, ...props }: ComponentProps<'div'>): ReactNode;

package/lib/types/ui/drag-scroll.js

@@ -0,0 +1,85 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * DragScroll: an overflow-auto container that also pans when held and
+ * dragged with the mouse (both axes). Touch and pen keep Chromium's native
+ * pan, so only mouse pointers are intercepted. A 6px threshold separates a
+ * pan from a press; the click that follows a pan is swallowed so dragged
+ * rows never fire. DragScrolls nest (a table inside a scrolled page); only
+ * the innermost container under the pressed target takes the gesture.
+ *
+ * @module @snap-rail/framework-shadcn/ui/drag-scroll
+ */
+import { useRef } from 'react';
+import { cn } from "./utils.js";
+/** Movement (px) before a held press turns into a pan. */
+const PAN_THRESHOLD = 6;
+/** An auto-scrolling div that pans under a held mouse drag. */
+export function DragScroll({ className, children, ...props }) {
+    const container = useRef(null);
+    const pan = useRef(null);
+    const swallowClick = useRef(false);
+    const onPointerDown = (event) => {
+        if (event.pointerType !== 'mouse' || event.button !== 0)
+            return;
+        // DragScrolls nest (a table inside a scrolled page). If both armed on
+        // one press, the ancestor's setPointerCapture would steal the pointer
+        // from the innermost container mid-gesture: its pan freezes and its
+        // state leaks past the release into a hover-follow. Only the innermost
+        // container under the pressed target arms.
+        if (container.current === null)
+            return;
+        const innermost = event.target instanceof Element ? event.target.closest('[data-drag-scroll]') : null;
+        if (innermost !== null && innermost !== container.current)
+            return;
+        pan.current = { id: event.pointerId, x: event.clientX, y: event.clientY, moved: false };
+    };
+    const onPointerMove = (event) => {
+        const state = pan.current;
+        if (state === null || state.id !== event.pointerId)
+            return;
+        // A buttonless move means the press ended without our pointerup — the
+        // capture was stolen. Drop the stale pan instead of following hover.
+        if (event.buttons === 0) {
+            pan.current = null;
+            return;
+        }
+        const el = container.current;
+        if (el === null)
+            return;
+        const dx = state.x - event.clientX;
+        const dy = state.y - event.clientY;
+        if (!state.moved) {
+            if (Math.hypot(dx, dy) < PAN_THRESHOLD)
+                return;
+            state.moved = true;
+            el.setPointerCapture(event.pointerId);
+            el.dataset.panning = 'true';
+        }
+        el.scrollLeft += dx;
+        el.scrollTop += dy;
+        state.x = event.clientX;
+        state.y = event.clientY;
+    };
+    const endPan = (event) => {
+        const state = pan.current;
+        if (state === null || state.id !== event.pointerId)
+            return;
+        pan.current = null;
+        const el = container.current;
+        if (el === null)
+            return;
+        if (state.moved) {
+            if (el.hasPointerCapture(event.pointerId))
+                el.releasePointerCapture(event.pointerId);
+            delete el.dataset.panning;
+            swallowClick.current = true;
+        }
+    };
+    return (_jsx("div", { ref: container, "data-drag-scroll": "", className: cn('overflow-auto', className), onPointerDown: onPointerDown, onPointerMove: onPointerMove, onPointerUp: endPan, onPointerCancel: endPan, onClickCapture: event => {
+            if (!swallowClick.current)
+                return;
+            swallowClick.current = false;
+            event.preventDefault();
+            event.stopPropagation();
+        }, ...props, children: children }));
+}

package/lib/types/ui/hooks.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Shared React recipes over the client runtime's event fabric.
+ *
+ * @module @snap-rail/framework-shadcn/ui/hooks
+ */
+import type { Context, Events } from '@snap-rail/cordis';
+/**
+ * Re-render the component whenever any of the named ctx events fires —
+ * the standard "surface follows the seam" tick. The cordis import is
+ * type-only: this module stays a pure React utility at runtime.
+ *
+ * @param ctx - the plugin context whose events drive the refresh.
+ * @param events - event names to listen on (identity is not part of the
+ * effect key; a freshly built array literal is fine).
+ */
+export declare function useRefresh(ctx: Context, events: ReadonlyArray<keyof Events>): void;

package/lib/types/ui/hooks.js

@@ -0,0 +1,26 @@
+/**
+ * Shared React recipes over the client runtime's event fabric.
+ *
+ * @module @snap-rail/framework-shadcn/ui/hooks
+ */
+import { useEffect, useState } from 'react';
+/**
+ * Re-render the component whenever any of the named ctx events fires —
+ * the standard "surface follows the seam" tick. The cordis import is
+ * type-only: this module stays a pure React utility at runtime.
+ *
+ * @param ctx - the plugin context whose events drive the refresh.
+ * @param events - event names to listen on (identity is not part of the
+ * effect key; a freshly built array literal is fine).
+ */
+export function useRefresh(ctx, events) {
+    const [, setTick] = useState(0);
+    const key = events.join('\n');
+    useEffect(() => {
+        const bump = () => setTick(value => value + 1);
+        const names = (key === '' ? [] : key.split('\n'));
+        const detachers = names.map(event => ctx.on(event, bump));
+        return () => { for (const detach of detachers)
+            detach(); };
+    }, [ctx, key]);
+}

package/lib/types/ui/icons.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Icon primitives: lucide-style inline stroke glyphs the Button and page
+ * headers embed. Icons are inline strokes (no icon-package dependency, no
+ * fill dependencies on currentColor semantics) — same convention as
+ * {@link CollapsibleChevron}.
+ *
+ * @module @snap-rail/framework-shadcn/ui/icons
+ */
+import type { ReactNode } from 'react';
+/** A plus glyph — the "add / install something" affordance. */
+export declare function IconPlus({ className }: {
+    className?: string;
+}): ReactNode;
+/** Chevrons pointing together (down-up) — the "collapse all" affordance. */
+export declare function IconChevronsDownUp({ className }: {
+    className?: string;
+}): ReactNode;
+/** Chevrons pointing apart (up-down) — the "expand all" affordance. */
+export declare function IconChevronsUpDown({ className }: {
+    className?: string;
+}): ReactNode;

package/lib/types/ui/icons.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from "./utils.js";
+/** The shared stroke skeleton every icon renders. */
+function icon(path, className) {
+    return (_jsx("svg", { viewBox: "0 0 24 24", className: cn('h-4 w-4 shrink-0', className), fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: path }));
+}
+/** A plus glyph — the "add / install something" affordance. */
+export function IconPlus({ className }) {
+    return icon(_jsxs(_Fragment, { children: [_jsx("path", { d: "M5 12h14" }), _jsx("path", { d: "M12 5v14" })] }), className);
+}
+/** Chevrons pointing together (down-up) — the "collapse all" affordance. */
+export function IconChevronsDownUp({ className }) {
+    return icon(_jsxs(_Fragment, { children: [_jsx("path", { d: "m7 20 5-5 5 5" }), _jsx("path", { d: "m7 4 5 5 5-5" })] }), className);
+}
+/** Chevrons pointing apart (up-down) — the "expand all" affordance. */
+export function IconChevronsUpDown({ className }) {
+    return icon(_jsxs(_Fragment, { children: [_jsx("path", { d: "m7 15 5 5 5-5" }), _jsx("path", { d: "m7 9 5-5 5 5" })] }), className);
+}

package/lib/types/ui/index.d.ts

@@ -0,0 +1,32 @@
+/**
+ * The UI primitive seam: theme tokens (theme.css) plus the shadcn-style
+ * component set every UI plugin shares. Consumers import components by
+ * package name; the runtime imports `@snap-rail/framework-shadcn/theme.css` once.
+ *
+ * @module @snap-rail/framework-shadcn/ui
+ */
+export { cn } from './utils.ts';
+export { useRefresh } from './hooks.tsx';
+export { Button, type ButtonProps } from './button.tsx';
+export { Card, CardHeader, CardTitle, CardContent } from './card.tsx';
+export { Badge, type BadgeProps } from './badge.tsx';
+export { Switch } from './switch.tsx';
+export { Tooltip, TooltipRoot, type TooltipProps, type TooltipContentProps } from './tooltip.tsx';
+export { ScrollArea } from './scroll-area.tsx';
+export { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from './dialog.tsx';
+export { Input } from './input.tsx';
+export { Textarea } from './textarea.tsx';
+export { Label } from './label.tsx';
+export { Checkbox } from './checkbox.tsx';
+export { Progress } from './progress.tsx';
+export { RadioGroup, RadioGroupItem } from './radio-group.tsx';
+export { TouchSelect, type TouchSelectOption } from './touch-select.tsx';
+export { NumberInput, NumberPad } from './number-input.tsx';
+export { SchemaForm, schemaDefaults, planSchemaFields, compactSchemaValue, type SchemaFormValue, } from './schema-form.tsx';
+export { DragScroll } from './drag-scroll.tsx';
+export { Table, TableHeader, TableBody, TableRow, TableHead, TableCell } from './table.tsx';
+export { Tabs, TabsList, TabsTrigger, TabsContent } from './tabs.tsx';
+export { Collapsible, CollapsibleTrigger, CollapsibleChevron, CollapsibleContent } from './collapsible.tsx';
+export { IconPlus, IconChevronsDownUp, IconChevronsUpDown } from './icons.tsx';
+export { Led, type LedTone } from './led.tsx';
+export { THEME_SETTINGS_KEY, DEFAULT_THEME, applyTheme, resolveThemeMode, themeSettingsSchema, type ThemeSettings, } from './theme.ts';

package/lib/types/ui/index.js

@@ -0,0 +1,32 @@
+/**
+ * The UI primitive seam: theme tokens (theme.css) plus the shadcn-style
+ * component set every UI plugin shares. Consumers import components by
+ * package name; the runtime imports `@snap-rail/framework-shadcn/theme.css` once.
+ *
+ * @module @snap-rail/framework-shadcn/ui
+ */
+export { cn } from "./utils.js";
+export { useRefresh } from "./hooks.js";
+export { Button } from "./button.js";
+export { Card, CardHeader, CardTitle, CardContent } from "./card.js";
+export { Badge } from "./badge.js";
+export { Switch } from "./switch.js";
+export { Tooltip, TooltipRoot } from "./tooltip.js";
+export { ScrollArea } from "./scroll-area.js";
+export { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from "./dialog.js";
+export { Input } from "./input.js";
+export { Textarea } from "./textarea.js";
+export { Label } from "./label.js";
+export { Checkbox } from "./checkbox.js";
+export { Progress } from "./progress.js";
+export { RadioGroup, RadioGroupItem } from "./radio-group.js";
+export { TouchSelect } from "./touch-select.js";
+export { NumberInput, NumberPad } from "./number-input.js";
+export { SchemaForm, schemaDefaults, planSchemaFields, compactSchemaValue, } from "./schema-form.js";
+export { DragScroll } from "./drag-scroll.js";
+export { Table, TableHeader, TableBody, TableRow, TableHead, TableCell } from "./table.js";
+export { Tabs, TabsList, TabsTrigger, TabsContent } from "./tabs.js";
+export { Collapsible, CollapsibleTrigger, CollapsibleChevron, CollapsibleContent } from "./collapsible.js";
+export { IconPlus, IconChevronsDownUp, IconChevronsUpDown } from "./icons.js";
+export { Led } from "./led.js";
+export { THEME_SETTINGS_KEY, DEFAULT_THEME, applyTheme, resolveThemeMode, themeSettingsSchema, } from "./theme.js";

package/lib/types/ui/input.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Input: themed single-line text entry for ids, numbers, and short values.
+ *
+ * @module @snap-rail/framework-shadcn/ui/input
+ */
+import type { ComponentProps } from 'react';
+/** A themed text input. */
+export declare function Input({ className, type, ...props }: ComponentProps<'input'>): import("react").JSX.Element;

package/lib/types/ui/input.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "./utils.js";
+/** A themed text input. */
+export function Input({ className, type = 'text', ...props }) {
+    return (_jsx("input", { type: type, className: cn('flex h-12 w-full rounded-md border border-input bg-transparent px-4 py-2 text-base', 'placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring', 'disabled:cursor-not-allowed disabled:opacity-50', className), ...props }));
+}

package/lib/types/ui/label.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Label: form field caption over Radix Label (click focuses the control).
+ *
+ * @module @snap-rail/framework-shadcn/ui/label
+ */
+import * as LabelPrimitive from '@radix-ui/react-label';
+import type { ComponentProps } from 'react';
+/** A themed field label. */
+export declare function Label({ className, ...props }: ComponentProps<typeof LabelPrimitive.Root>): import("react").JSX.Element;

package/lib/types/ui/label.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Label: form field caption over Radix Label (click focuses the control).
+ *
+ * @module @snap-rail/framework-shadcn/ui/label
+ */
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { cn } from "./utils.js";
+/** A themed field label. */
+export function Label({ className, ...props }) {
+    return (_jsx(LabelPrimitive.Root, { className: cn('text-sm font-medium text-muted-foreground select-none', className), ...props }));
+}

package/lib/types/ui/led.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Led: the breathing status dot connection/group health renders as. A plain
+ * span (not a Radix part) — `data-tone` is the test hook.
+ *
+ * @module @snap-rail/framework-shadcn/ui/led
+ */
+import type { ComponentProps } from 'react';
+/** Health tones: green = all good, yellow = partial, red = down. */
+export type LedTone = 'green' | 'yellow' | 'red';
+/** One pulsing dot; pass `aria-label` when it is the only status surface. */
+export declare function Led({ tone, className, ...props }: ComponentProps<'span'> & {
+    tone: LedTone;
+}): import("react").JSX.Element;

package/lib/types/ui/led.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "./utils.js";
+const TONE_CLASS = {
+    green: 'bg-success',
+    yellow: 'bg-warning',
+    red: 'bg-destructive',
+};
+/** One pulsing dot; pass `aria-label` when it is the only status surface. */
+export function Led({ tone, className, ...props }) {
+    return (_jsx("span", { "data-tone": tone, className: cn('inline-block h-3 w-3 shrink-0 animate-pulse rounded-full', TONE_CLASS[tone], className), ...props }));
+}

package/lib/types/ui/number-input.d.ts

@@ -0,0 +1,35 @@
+/**
+ * NumberInput / NumberPad: numeric entry for the touch terminal. The field
+ * is a button styled as an input (no system soft keyboard ever pops); a tap
+ * opens the NumberPad modal — a 3×4 keypad plus 清除/确定. NumberPad also
+ * mounts inline where the keypad should stay visible (the login card).
+ *
+ * @module @snap-rail/framework-shadcn/ui/number-input
+ */
+import { type ReactNode } from 'react';
+/** An inline 3×4 keypad (digits, optional decimal point, backspace) with a
+ * clear/confirm action row; every key is a full-size Button. */
+export declare function NumberPad(props: {
+    /** The current digit string (controlled). */
+    value: string;
+    onChange: (value: string) => void;
+    /** Fires on the confirm key; inline mounts use it as their primary action. */
+    onConfirm?: () => void;
+    /** Allow one decimal point (weights, scale factors). */
+    allowDecimal?: boolean;
+    /** Confirm key text (defaults to 确定). */
+    confirmLabel?: string;
+    className?: string;
+}): ReactNode;
+/** A numeric field: an input-styled button that opens the NumberPad modal;
+ * `onChange` commits on 确定 only — a cancelled edit changes nothing. */
+export declare function NumberInput(props: {
+    /** Field name; doubles as the trigger's aria-label and the modal title. */
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+    placeholder?: string;
+    allowDecimal?: boolean;
+    disabled?: boolean;
+    className?: string;
+}): ReactNode;

package/lib/types/ui/number-input.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * NumberInput / NumberPad: numeric entry for the touch terminal. The field
+ * is a button styled as an input (no system soft keyboard ever pops); a tap
+ * opens the NumberPad modal — a 3×4 keypad plus 清除/确定. NumberPad also
+ * mounts inline where the keypad should stay visible (the login card).
+ *
+ * @module @snap-rail/framework-shadcn/ui/number-input
+ */
+import { useEffect, useState } from 'react';
+import { Button } from "./button.js";
+import { Dialog, DialogContent, DialogTitle } from "./dialog.js";
+import { cn } from "./utils.js";
+/** The keypad's backspace glyph; inline so the seam carries no icon dep. */
+function BackspaceIcon() {
+    return (_jsxs("svg", { viewBox: "0 0 24 24", className: "h-6 w-6", fill: "none", "aria-hidden": "true", children: [_jsx("path", { d: "M9 5h11a1.5 1.5 0 0 1 1.5 1.5v11A1.5 1.5 0 0 1 20 19H9l-6.5-7L9 5Z", stroke: "currentColor", strokeWidth: "1.6", strokeLinejoin: "round" }), _jsx("path", { d: "m12.5 9.5 5 5m0-5-5 5", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" })] }));
+}
+/** An inline 3×4 keypad (digits, optional decimal point, backspace) with a
+ * clear/confirm action row; every key is a full-size Button. */
+export function NumberPad(props) {
+    const { value, onChange, onConfirm, allowDecimal = false, confirmLabel = '确定', className } = props;
+    const press = (key) => {
+        if (key === '.' && (value.includes('.') || value === ''))
+            return;
+        onChange(value + key);
+    };
+    const backspace = () => { onChange(value.slice(0, -1)); };
+    const clear = () => { onChange(''); };
+    return (_jsxs("div", { className: cn('grid grid-cols-3 gap-2', className), children: [['1', '2', '3', '4', '5', '6', '7', '8', '9'].map(digit => (_jsx(Button, { type: "button", variant: "secondary", "data-key": digit, className: "h-14 font-mono text-xl", onClick: () => { press(digit); }, children: digit }, digit))), allowDecimal
+                ? (_jsx(Button, { type: "button", variant: "secondary", "data-key": "dot", className: "h-14 font-mono text-xl", onClick: () => { press('.'); }, children: "\u00B7" }))
+                : _jsx("div", { "aria-hidden": "true" }), _jsx(Button, { type: "button", variant: "secondary", "data-key": "0", className: "h-14 font-mono text-xl", onClick: () => { press('0'); }, children: "0" }), _jsx(Button, { type: "button", variant: "secondary", "aria-label": "\u9000\u683C", "data-key": "back", className: "h-14", onClick: backspace, children: _jsx(BackspaceIcon, {}) }), _jsx(Button, { type: "button", variant: "outline", "data-key": "clear", className: "h-14 text-base", onClick: clear, children: "\u6E05\u9664" }), _jsx(Button, { type: "button", "data-key": "confirm", className: "col-span-2 h-14 text-base", onClick: () => { onConfirm?.(); }, children: confirmLabel })] }));
+}
+/** A numeric field: an input-styled button that opens the NumberPad modal;
+ * `onChange` commits on 确定 only — a cancelled edit changes nothing. */
+export function NumberInput(props) {
+    const { label, value, onChange, placeholder = '', allowDecimal = false, disabled = false, className } = props;
+    const [open, setOpen] = useState(false);
+    const [draft, setDraft] = useState(value);
+    useEffect(() => {
+        if (open)
+            setDraft(value);
+    }, [open, value]);
+    const confirm = () => {
+        onChange(draft);
+        setOpen(false);
+    };
+    return (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", disabled: disabled, "aria-label": label, "data-number-input": label, className: cn('flex h-12 w-full items-center rounded-md border border-input bg-transparent px-4 text-left', 'font-mono text-base tabular-nums', 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring', 'disabled:cursor-not-allowed disabled:opacity-50', className), onClick: () => { setOpen(true); }, children: value === '' ? _jsx("span", { className: "text-muted-foreground", children: placeholder }) : value }), _jsx(Dialog, { open: open, onOpenChange: setOpen, children: _jsxs(DialogContent, { "aria-describedby": undefined, className: "max-w-sm p-0", children: [_jsx("div", { className: "border-b border-border px-5 py-4", children: _jsx(DialogTitle, { className: "text-base font-medium", children: label }) }), _jsxs("div", { className: "px-5 pb-5 pt-4", children: [_jsx("div", { className: "mb-4 min-h-14 rounded-md border border-border bg-muted px-4 py-3 text-right font-mono text-2xl tabular-nums", "data-number-display": true, children: draft === '' ? _jsx("span", { className: "text-muted-foreground", children: "\u2014" }) : draft }), _jsx(NumberPad, { value: draft, onChange: setDraft, onConfirm: confirm, allowDecimal: allowDecimal })] })] }) })] }));
+}

package/lib/types/ui/progress.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Progress: the Radix progress bar with snap-rail chrome — determinate
+ * download/scan progress for long-running host work.
+ *
+ * @module @snap-rail/framework-shadcn/ui/progress
+ */
+import * as ProgressPrimitive from '@radix-ui/react-progress';
+import type { ComponentProps } from 'react';
+/** A themed linear progress bar (`value` 0–100, `aria-valuenow` included). */
+export declare function Progress({ className, value, ...props }: ComponentProps<typeof ProgressPrimitive.Root>): import("react").JSX.Element;

package/lib/types/ui/progress.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Progress: the Radix progress bar with snap-rail chrome — determinate
+ * download/scan progress for long-running host work.
+ *
+ * @module @snap-rail/framework-shadcn/ui/progress
+ */
+import * as ProgressPrimitive from '@radix-ui/react-progress';
+import { cn } from "./utils.js";
+/** A themed linear progress bar (`value` 0–100, `aria-valuenow` included). */
+export function Progress({ className, value, ...props }) {
+    const percent = typeof value === 'number' ? Math.min(100, Math.max(0, value)) : 0;
+    return (_jsx(ProgressPrimitive.Root, { className: cn('relative h-2 w-full overflow-hidden rounded-full bg-secondary', className), ...props, children: _jsx(ProgressPrimitive.Indicator, { className: "h-full w-full rounded-full bg-primary transition-transform", style: { transform: `translateX(-${100 - percent}%)` } }) }));
+}

package/lib/types/ui/radio-group.d.ts

@@ -0,0 +1,12 @@
+/**
+ * RadioGroup: exclusive choice over Radix RadioGroup (是/否 switches, model
+ * picks); the indicator is a plain dot so the UI seam needs no icon dep.
+ *
+ * @module @snap-rail/framework-shadcn/ui/radio-group
+ */
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import type { ComponentProps } from 'react';
+/** The exclusive group root. */
+export declare function RadioGroup({ className, ...props }: ComponentProps<typeof RadioGroupPrimitive.Root>): import("react").JSX.Element;
+/** One themed choice. */
+export declare function RadioGroupItem({ className, ...props }: ComponentProps<typeof RadioGroupPrimitive.Item>): import("react").JSX.Element;

package/lib/types/ui/radio-group.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * RadioGroup: exclusive choice over Radix RadioGroup (是/否 switches, model
+ * picks); the indicator is a plain dot so the UI seam needs no icon dep.
+ *
+ * @module @snap-rail/framework-shadcn/ui/radio-group
+ */
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import { cn } from "./utils.js";
+/** The exclusive group root. */
+export function RadioGroup({ className, ...props }) {
+    return _jsx(RadioGroupPrimitive.Root, { className: cn('grid gap-3', className), ...props });
+}
+/** One themed choice. */
+export function RadioGroupItem({ className, ...props }) {
+    return (_jsx(RadioGroupPrimitive.Item, { className: cn('aspect-square h-6 w-6 shrink-0 rounded-full border border-input bg-transparent', 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring', 'data-[state=checked]:border-primary disabled:cursor-not-allowed disabled:opacity-50', className), ...props, children: _jsx(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: _jsx("div", { className: "h-2.5 w-2.5 rounded-full bg-primary" }) }) }));
+}

package/lib/types/ui/schema-form.d.ts

@@ -0,0 +1,51 @@
+/**
+ * SchemaForm: the settings vocabulary's generic form engine. It renders one
+ * labeled control per property of a JSON Schema (the input-form projection
+ * drivers register with the field base — zod's `toJSONSchema`), on the touch
+ * baseline: enums and literal unions become TouchSelect rows (committing the
+ * literal's own type — a number const rides back as a number), numbers open
+ * the NumberPad, booleans ride a Switch. Property `title`s (zod
+ * `.meta({ title })`) label the fields; the host's zod schemas remain the
+ * only validator — this form shapes input, it does not judge it.
+ *
+ * The vocabulary is meant to grow (discovery pickers, repeatable groups);
+ * what a schema expresses beyond today's subset renders as a plain text
+ * field and still round-trips through the host's validation.
+ *
+ * @module @snap-rail/framework-shadcn/ui/schema-form
+ */
+import { type ReactNode } from 'react';
+import { type TouchSelectOption } from './touch-select.tsx';
+/** One form value per schema property: schema-native types, absent = unset. */
+export type SchemaFormValue = Record<string, string | number | boolean | undefined>;
+/** The schema subset one field renders from. */
+interface FieldPlan {
+    name: string;
+    label: string;
+    required: boolean;
+    kind: 'enum' | 'string' | 'integer' | 'number' | 'boolean' | 'text';
+    options?: TouchSelectOption[];
+    /** option value → the schema-native value to commit — number literals stay
+     * numbers (a union of `z.literal(1)`s must round-trip as 1, never "1"). */
+    literalOf?: Record<string, string | number | boolean>;
+    placeholder?: string;
+}
+/** Plan the renderable fields of an object schema (property order kept). */
+export declare function planSchemaFields(schema: Record<string, unknown>, hidden?: readonly string[]): FieldPlan[];
+/** Initial values from an object schema's `default`s (create dialogs). */
+export declare function schemaDefaults(schema: Record<string, unknown>): SchemaFormValue;
+/** Strip keys whose value is `undefined` so unset optionals ride clean. */
+export declare function compactSchemaValue(value: SchemaFormValue): Record<string, string | number | boolean>;
+/** A controlled, schema-driven form body (labels + controls, no buttons). */
+export declare function SchemaForm(props: {
+    /** The object schema driving the fields (input form, zod-projected). */
+    schema: Record<string, unknown>;
+    /** Current values keyed by property name; absent = unset. */
+    value: SchemaFormValue;
+    onChange: (value: SchemaFormValue) => void;
+    /** Property names the caller owns and renders itself (e.g. `type`). */
+    hidden?: readonly string[];
+    disabled?: boolean;
+    className?: string;
+}): ReactNode;
+export {};