@cosmicdrift/kumiko-renderer 0.374.0 → 0.378.0

package/dist/web/theme-plugin.d.ts

@@ -0,0 +1,41 @@
+import plugin from "tailwindcss/plugin";
+import { type DefaultColorScheme } from "./default-color-scheme.ts";
+export declare const FRAMEWORK_COLOR_NAMES: readonly ["background", "foreground", "foreground-secondary", "foreground-disabled", "card", "card-foreground", "popover", "popover-foreground", "primary", "primary-foreground", "secondary", "secondary-foreground", "muted", "muted-foreground", "accent", "accent-foreground", "destructive", "destructive-foreground", "border", "border-strong", "border-row", "input", "ring", "sidebar", "sidebar-foreground", "sidebar-primary", "sidebar-primary-foreground", "sidebar-accent", "sidebar-accent-foreground", "sidebar-muted", "sidebar-input", "sidebar-border", "sidebar-ring", "status-ok", "status-ok-surface", "status-warn", "status-warn-surface", "status-bad", "status-bad-surface", "status-critical", "status-critical-surface", "status-neutral", "status-neutral-surface", "status-active", "status-active-surface", "syntax-key", "syntax-string", "syntax-number", "syntax-literal", "promo", "promo-foreground", "promo-accent", "promo-accent-foreground"];
+export type FrameworkColorName = (typeof FRAMEWORK_COLOR_NAMES)[number];
+/** A plain string applies to both modes; `dark` falls back to `light`. */
+export type ThemeColorValue = string | {
+    readonly light: string;
+    readonly dark?: string;
+};
+export type AppTheme = {
+    /** Scheme for visitors without a stored choice. "auto" follows the OS setting.
+     *  The FOUC inline script cannot read this value; copy it into the script as a
+     *  literal fallback (see the header comment in tokens.ts). */
+    readonly defaultColorScheme?: DefaultColorScheme;
+    readonly colors?: Readonly<Partial<Record<FrameworkColorName | (string & {}), ThemeColorValue>>>;
+    /** Base radius; the sm/md/lg/xl scale derives from it. */
+    readonly radius?: string;
+    readonly fonts?: {
+        readonly sans?: string;
+        readonly heading?: string;
+        readonly mono?: string;
+    };
+    readonly shadows?: {
+        readonly card?: string;
+    };
+    readonly spacing?: {
+        readonly card?: string;
+    };
+};
+type CssDeclarations = Record<string, string>;
+type ThemeCss = {
+    readonly light: CssDeclarations;
+    readonly dark: CssDeclarations;
+    readonly modeInvariant: CssDeclarations;
+    readonly extraColorUtilities: CssDeclarations;
+    readonly bodyFontFamily: string | undefined;
+};
+export declare function defineAppTheme<Theme extends AppTheme>(theme: Theme): Theme;
+export declare function buildThemeCss(theme: AppTheme): ThemeCss;
+export declare function createThemePlugin(theme: AppTheme): ReturnType<typeof plugin>;
+export {};

package/dist/web/theme-plugin.js

@@ -0,0 +1,123 @@
+import plugin from "tailwindcss/plugin";
+import { DEFAULT_COLOR_SCHEME_VARIABLE } from "./default-color-scheme.js";
+export const FRAMEWORK_COLOR_NAMES = [
+    "background",
+    "foreground",
+    "foreground-secondary",
+    "foreground-disabled",
+    "card",
+    "card-foreground",
+    "popover",
+    "popover-foreground",
+    "primary",
+    "primary-foreground",
+    "secondary",
+    "secondary-foreground",
+    "muted",
+    "muted-foreground",
+    "accent",
+    "accent-foreground",
+    "destructive",
+    "destructive-foreground",
+    "border",
+    "border-strong",
+    "border-row",
+    "input",
+    "ring",
+    "sidebar",
+    "sidebar-foreground",
+    "sidebar-primary",
+    "sidebar-primary-foreground",
+    "sidebar-accent",
+    "sidebar-accent-foreground",
+    "sidebar-muted",
+    "sidebar-input",
+    "sidebar-border",
+    "sidebar-ring",
+    "status-ok",
+    "status-ok-surface",
+    "status-warn",
+    "status-warn-surface",
+    "status-bad",
+    "status-bad-surface",
+    "status-critical",
+    "status-critical-surface",
+    "status-neutral",
+    "status-neutral-surface",
+    "status-active",
+    "status-active-surface",
+    "syntax-key",
+    "syntax-string",
+    "syntax-number",
+    "syntax-literal",
+    "promo",
+    "promo-foreground",
+    "promo-accent",
+    "promo-accent-foreground",
+];
+const COLOR_NAME_PATTERN = /^[a-z][a-z0-9]*(-[a-z0-9]+)*$/;
+const frameworkColorNames = new Set(FRAMEWORK_COLOR_NAMES);
+export function defineAppTheme(theme) {
+    return theme;
+}
+export function buildThemeCss(theme) {
+    return {
+        ...buildColorDeclarations(theme.colors ?? {}),
+        modeInvariant: buildModeInvariantDeclarations(theme),
+        bodyFontFamily: theme.fonts?.sans === undefined ? undefined : "var(--font-sans)",
+    };
+}
+function buildColorDeclarations(colors) {
+    const light = {};
+    const dark = {};
+    const extraColorUtilities = {};
+    for (const [name, value] of Object.entries(colors)) {
+        if (value === undefined)
+            continue;
+        if (!COLOR_NAME_PATTERN.test(name)) {
+            throw new Error(`[kumiko theme] color name "${name}" must be kebab-case (e.g. "brand-soft")`);
+        }
+        const variable = `--color-${name}`;
+        const lightValue = typeof value === "string" ? value : value.light;
+        light[variable] = lightValue;
+        dark[variable] = typeof value === "string" ? value : (value.dark ?? lightValue);
+        if (!frameworkColorNames.has(name))
+            extraColorUtilities[name] = `var(${variable})`;
+    }
+    return { light, dark, extraColorUtilities };
+}
+function buildModeInvariantDeclarations(theme) {
+    const modeInvariant = {};
+    if (theme.defaultColorScheme !== undefined) {
+        modeInvariant[DEFAULT_COLOR_SCHEME_VARIABLE] = theme.defaultColorScheme;
+    }
+    if (theme.radius !== undefined)
+        modeInvariant["--radius"] = theme.radius;
+    if (theme.fonts?.sans !== undefined)
+        modeInvariant["--font-sans"] = theme.fonts.sans;
+    if (theme.fonts?.heading !== undefined)
+        modeInvariant["--font-heading"] = theme.fonts.heading;
+    if (theme.fonts?.mono !== undefined)
+        modeInvariant["--font-mono"] = theme.fonts.mono;
+    if (theme.shadows?.card !== undefined)
+        modeInvariant["--card-shadow"] = theme.shadows.card;
+    if (theme.spacing?.card !== undefined)
+        modeInvariant["--card-padding"] = theme.spacing.card;
+    return modeInvariant;
+}
+// The framework's light palette sits in `@layer base :root:not(.dark)`, which beats any app
+// `@theme` value. addBase emits into the same base layer after the framework's import, so the
+// same selectors here win by source order without the app repeating its palette in `:root`.
+export function createThemePlugin(theme) {
+    const css = buildThemeCss(theme);
+    return plugin(({ addBase }) => {
+        addBase({
+            ":root": { ...css.modeInvariant },
+            ":root:not(.dark)": { ...css.light },
+            ".dark": { ...css.dark },
+            ...(css.bodyFontFamily === undefined
+                ? {}
+                : { body: { "font-family": css.bodyFontFamily } }),
+        });
+    }, { theme: { extend: { colors: { ...css.extraColorUtilities } } } });
+}

package/dist/web/tokens.d.ts

@@ -0,0 +1,24 @@
+import { type Tokens, type TokensApi } from "../index.ts";
+export declare const THEME_STORAGE_KEY = "kumiko:theme";
+/** Reads the persisted theme choice (or the app default) and sets the `.dark`
+ *  class. Called on the first useBrowserTokensApi mount; the inline script in
+ *  the host HTML (see header comment) does the same synchronously before the
+ *  first paint. */
+export declare function applyStoredThemeMode(): void;
+/** Nur für Tests: der once-per-page-load-Guard ist ein Module-Singleton —
+ *  ohne Reset wäre der Mount-Restore-Pfad nach der ersten Render im
+ *  Testfile strukturell unerreichbar. */
+export declare function __resetStoredModeAppliedForTests(): void;
+/** Hook der eine TokensApi für den Browser baut. Wird von
+ *  createKumikoApp genutzt; App-Code der einen eigenen Token-State
+ *  braucht (z.B. User-Präferenz aus localStorage) kann selber
+ *  `<TokensProvider value={...}>` mounten. */
+export declare function useBrowserTokensApi(): TokensApi;
+/** Default-Tokens — identisch zu `cssVarTokens` (var-string-refs).
+ *  Light- und Dark-Werte switchen via `.dark`-class auf <html>. */
+export declare const defaultTokens: Tokens;
+export declare const lightTokens: Tokens;
+/** Historisch: schrieb Tokens auf :root als CSS-vars. Jetzt no-op —
+ *  die CSS-vars leben in styles.css, nicht in JS. Bleibt als Export
+ *  damit alter App-Code nicht bricht. */
+export declare function applyTokensToCssVars(_tokens: Tokens): void;

package/dist/web/tokens.js

@@ -0,0 +1,203 @@
+import { useEffect, useState, useSyncExternalStore } from "react";
+import { createStore } from "../headless/index.js";
+import { cssVarTokens, } from "../index.js";
+import { DEFAULT_COLOR_SCHEME_VARIABLE } from "./default-color-scheme.js";
+// Web-spezifische TokensApi-Impl. Theme-Toggle via `.dark`-Class auf
+// <html>. Die echten Farben leben in styles.css; hier ist nur die
+// JS-Seite die den class-switch triggert und React-Consumer mit
+// useSyncExternalStore darüber informiert.
+//
+// Source-of-truth ist der DOM (`<html class="dark">`); der Store ist
+// reiner Notification-Bus (Tick-Counter), den setMode/toggleMode bei
+// jedem Class-Wechsel hochzählen. So bleibt die DOM-Klasse die einzige
+// Wahrheit — readCurrentMode liest sie frisch bei jedem getSnapshot.
+//
+// Persistence: the choice is stored in localStorage (THEME_STORAGE_KEY) and
+// restored on the first hook mount; without it the toggle was lost on every
+// reload (prod bug 2026-06-07).
+// Preference: "auto" follows prefers-color-scheme live (matchMedia listener),
+// "light"/"dark" are explicit choices and win. Without a stored choice,
+// AppTheme.defaultColorScheme (CSS variable) applies, otherwise the HTML state.
+//
+// Against FOUC the host HTML also needs a synchronous inline script BEFORE
+// the stylesheet link (nonce/hash under a strict CSP):
+//
+//   <script>try{var s=localStorage.getItem("kumiko:theme");
+//     if(s==="dark"||(s==="auto"&&matchMedia("(prefers-color-scheme: dark)").matches))
+//     document.documentElement.classList.add("dark")}catch(e){}</script>
+//
+// The script runs before the stylesheet, so it cannot read the
+// --kumiko-default-color-scheme variable. An app with AppTheme.defaultColorScheme
+// copies that value in as a literal fallback ("dark" or "auto" here):
+//
+//   <script>try{var s=localStorage.getItem("kumiko:theme")||"dark";
+//     if(s==="dark"||(s==="auto"&&matchMedia("(prefers-color-scheme: dark)").matches))
+//     document.documentElement.classList.add("dark")}catch(e){}</script>
+const themeTick = createStore(0);
+export const THEME_STORAGE_KEY = "kumiko:theme";
+const DARK_SCHEME_QUERY = "(prefers-color-scheme: dark)";
+function isThemePreference(value) {
+    return value === "auto" || value === "light" || value === "dark";
+}
+function readCurrentMode() {
+    if (typeof document === "undefined")
+        return "dark";
+    return document.documentElement.classList.contains("dark") ? "dark" : "light";
+}
+function systemPrefersDark() {
+    return typeof window.matchMedia === "function" && window.matchMedia(DARK_SCHEME_QUERY).matches;
+}
+function resolveMode(preference) {
+    if (preference === "auto")
+        return systemPrefersDark() ? "dark" : "light";
+    return preference;
+}
+function readDeclaredDefaultPreference() {
+    const declared = getComputedStyle(document.documentElement)
+        .getPropertyValue(DEFAULT_COLOR_SCHEME_VARIABLE)
+        .trim();
+    return isThemePreference(declared) ? declared : undefined;
+}
+function readDefaultPreference() {
+    return readDeclaredDefaultPreference() ?? readCurrentMode();
+}
+function readStoredPreference() {
+    try {
+        const stored = window.localStorage.getItem(THEME_STORAGE_KEY);
+        return isThemePreference(stored) ? stored : undefined;
+    }
+    catch {
+        // skip: localStorage can throw (private mode); without a stored choice
+        // the default stays.
+        return undefined;
+    }
+}
+// Module singleton like storedModeApplied: null until the first read, so the
+// import stays safe without a DOM (SSR/tests).
+let currentPreference = null;
+function readCurrentPreference() {
+    if (currentPreference === null) {
+        if (typeof document === "undefined")
+            return "dark";
+        currentPreference = readStoredPreference() ?? readDefaultPreference();
+    }
+    return currentPreference;
+}
+// @wrapper-known semantic-alias
+function notifyThemeChange() {
+    themeTick.setState((t) => t + 1);
+}
+// @wrapper-known semantic-alias
+function persistPreference(preference) {
+    try {
+        window.localStorage.setItem(THEME_STORAGE_KEY, preference);
+    }
+    catch {
+        // skip: localStorage kann werfen (Private-Mode/Quota) — Theme bleibt
+        // dann sessionbasiert, der Class-Toggle hat trotzdem funktioniert.
+    }
+}
+function applyPreference(preference) {
+    currentPreference = preference;
+    document.documentElement.classList.toggle("dark", resolveMode(preference) === "dark");
+    notifyThemeChange();
+}
+/** Reads the persisted theme choice (or the app default) and sets the `.dark`
+ *  class. Called on the first useBrowserTokensApi mount; the inline script in
+ *  the host HTML (see header comment) does the same synchronously before the
+ *  first paint. */
+export function applyStoredThemeMode() {
+    // skip: no document (SSR/non-DOM context), nothing to apply
+    if (typeof document === "undefined")
+        return;
+    const stored = readStoredPreference();
+    if (stored !== undefined) {
+        applyPreference(stored);
+        // skip: a stored choice wins over the app default
+        return;
+    }
+    // Without a stored choice only an app-declared default changes the HTML state.
+    const declared = readDeclaredDefaultPreference();
+    if (declared !== undefined)
+        applyPreference(declared);
+}
+let storedModeApplied = false;
+/** Nur für Tests: der once-per-page-load-Guard ist ein Module-Singleton —
+ *  ohne Reset wäre der Mount-Restore-Pfad nach der ersten Render im
+ *  Testfile strukturell unerreichbar. */
+export function __resetStoredModeAppliedForTests() {
+    storedModeApplied = false;
+    currentPreference = null;
+}
+/** Hook der eine TokensApi für den Browser baut. Wird von
+ *  createKumikoApp genutzt; App-Code der einen eigenen Token-State
+ *  braucht (z.B. User-Präferenz aus localStorage) kann selber
+ *  `<TokensProvider value={...}>` mounten. */
+export function useBrowserTokensApi() {
+    // Einmal pro Page-Load: gespeicherte Wahl anwenden. Lazy statt
+    // Modul-Side-Effect, damit Import ohne DOM (SSR/Tests) safe bleibt.
+    // Als useState-Lazy-Initializer statt nackt im Render-Body: der
+    // DOM-Side-Effect lief sonst potenziell in einem verworfenen
+    // Concurrent-Render (React darf Render-Bodies wiederholen/abbrechen).
+    useState(() => {
+        if (!storedModeApplied && typeof document !== "undefined") {
+            storedModeApplied = true;
+            applyStoredThemeMode();
+        }
+        return null;
+    });
+    const mode = useSyncExternalStore(themeTick.subscribe, readCurrentMode, () => "dark");
+    const preference = useSyncExternalStore(themeTick.subscribe, readCurrentPreference, () => "dark");
+    // kumiko-lint-ignore no-raw-hooks listener lifecycle, no data fetching
+    useEffect(() => {
+        // skip: without matchMedia, auto keeps the mode resolved at apply time
+        if (typeof window.matchMedia !== "function")
+            return;
+        const query = window.matchMedia(DARK_SCHEME_QUERY);
+        const followSystem = () => {
+            if (readCurrentPreference() === "auto")
+                applyPreference("auto");
+        };
+        // The OS scheme may have changed between the first apply and this mount.
+        followSystem();
+        query.addEventListener("change", followSystem);
+        return () => query.removeEventListener("change", followSystem);
+    }, []);
+    return {
+        tokens: cssVarTokens,
+        mode,
+        preference,
+        setPreference: (next) => {
+            // skip: no document (SSR/non-DOM context), nothing to apply
+            if (typeof document === "undefined")
+                return;
+            persistPreference(next);
+            applyPreference(next);
+        },
+        setMode: (next) => {
+            // skip: no document (SSR/non-DOM context), nothing to toggle
+            if (typeof document === "undefined")
+                return;
+            persistPreference(next);
+            applyPreference(next);
+        },
+        toggleMode: () => {
+            // skip: no document (SSR/non-DOM context), nothing to toggle
+            if (typeof document === "undefined")
+                return;
+            const next = readCurrentMode() === "dark" ? "light" : "dark";
+            persistPreference(next);
+            applyPreference(next);
+        },
+    };
+}
+/** Default-Tokens — identisch zu `cssVarTokens` (var-string-refs).
+ *  Light- und Dark-Werte switchen via `.dark`-class auf <html>. */
+export const defaultTokens = cssVarTokens;
+export const lightTokens = cssVarTokens;
+/** Historisch: schrieb Tokens auf :root als CSS-vars. Jetzt no-op —
+ *  die CSS-vars leben in styles.css, nicht in JS. Bleibt als Export
+ *  damit alter App-Code nicht bricht. */
+export function applyTokensToCssVars(_tokens) {
+    // Absichtlich leer — siehe Kommentar oben.
+}

package/dist/web/ui/avatar.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+import { Avatar as AvatarPrimitive } from "radix-ui";
+declare function Avatar({ className, size, ...props }: React.ComponentProps<typeof AvatarPrimitive.Root> & {
+    size?: "default" | "sm" | "lg";
+}): React.JSX.Element;
+declare function AvatarImage({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Image>): React.JSX.Element;
+declare function AvatarFallback({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Fallback>): React.JSX.Element;
+declare function AvatarBadge({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+declare function AvatarGroup({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AvatarGroupCount({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+export { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount, };

package/dist/web/ui/avatar.js

@@ -0,0 +1,25 @@
+// @ts-nocheck — vendored shadcn, regenerate via scripts/sync-shadcn.ts
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Avatar as AvatarPrimitive } from "radix-ui";
+import { cn } from "../lib/cn.js";
+function Avatar({ className, size = "default", ...props }) {
+    return (_jsx(AvatarPrimitive.Root, { "data-slot": "avatar", "data-size": size, className: cn("group/avatar relative flex size-8 shrink-0 overflow-hidden rounded-full select-none data-[size=lg]:size-10 data-[size=sm]:size-6", className), ...props }));
+}
+function AvatarImage({ className, ...props }) {
+    return (_jsx(AvatarPrimitive.Image, { "data-slot": "avatar-image", className: cn("aspect-square size-full", className), ...props }));
+}
+function AvatarFallback({ className, ...props }) {
+    return (_jsx(AvatarPrimitive.Fallback, { "data-slot": "avatar-fallback", className: cn("flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs", className), ...props }));
+}
+function AvatarBadge({ className, ...props }) {
+    return (_jsx("span", { "data-slot": "avatar-badge", className: cn("absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground ring-2 ring-background select-none", "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden", "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2", "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2", className), ...props }));
+}
+function AvatarGroup({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "avatar-group", className: cn("group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background", className), ...props }));
+}
+function AvatarGroupCount({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "avatar-group-count", className: cn("relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3", className), ...props }));
+}
+export { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount, };

package/dist/web/ui/badge.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const badgeVariants: (props?: ({
+    variant?: "default" | "destructive" | "ghost" | "link" | "outline" | "secondary" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Badge({ className, variant, asChild, ...props }: React.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+export { Badge, badgeVariants };

package/dist/web/ui/badge.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// @ts-nocheck — vendored shadcn, regenerate via scripts/sync-shadcn.ts
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { Slot } from "radix-ui";
+import { cn } from "../lib/cn.js";
+const badgeVariants = cva("inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+            secondary: "bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+            destructive: "bg-destructive text-white focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/90",
+            outline: "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+            ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+            link: "text-primary underline-offset-4 [a&]:hover:underline",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+    },
+});
+function Badge({ className, variant = "default", asChild = false, ...props }) {
+    const Comp = asChild ? Slot.Root : "span";
+    return (_jsx(Comp, { "data-slot": "badge", "data-variant": variant, className: cn(badgeVariants({ variant }), className), ...props }));
+}
+export { Badge, badgeVariants };

package/dist/web/ui/breadcrumb.d.ts

@@ -0,0 +1,11 @@
+import * as React from "react";
+declare function Breadcrumb({ ...props }: React.ComponentProps<"nav">): React.JSX.Element;
+declare function BreadcrumbList({ className, ...props }: React.ComponentProps<"ol">): React.JSX.Element;
+declare function BreadcrumbItem({ className, ...props }: React.ComponentProps<"li">): React.JSX.Element;
+declare function BreadcrumbLink({ asChild, className, ...props }: React.ComponentProps<"a"> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+declare function BreadcrumbPage({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+declare function BreadcrumbSeparator({ children, className, ...props }: React.ComponentProps<"li">): React.JSX.Element;
+declare function BreadcrumbEllipsis({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
+export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis, };

package/dist/web/ui/breadcrumb.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// @ts-nocheck — vendored shadcn, regenerate via scripts/sync-shadcn.ts
+import * as React from "react";
+import { ChevronRight, MoreHorizontal } from "lucide-react";
+import { Slot } from "radix-ui";
+import { cn } from "../lib/cn.js";
+function Breadcrumb({ ...props }) {
+    return _jsx("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...props });
+}
+function BreadcrumbList({ className, ...props }) {
+    return (_jsx("ol", { "data-slot": "breadcrumb-list", className: cn("flex flex-wrap items-center gap-1.5 text-sm break-words text-muted-foreground sm:gap-2.5", className), ...props }));
+}
+function BreadcrumbItem({ className, ...props }) {
+    return (_jsx("li", { "data-slot": "breadcrumb-item", className: cn("inline-flex items-center gap-1.5", className), ...props }));
+}
+function BreadcrumbLink({ asChild, className, ...props }) {
+    const Comp = asChild ? Slot.Root : "a";
+    return (_jsx(Comp, { "data-slot": "breadcrumb-link", className: cn("transition-colors hover:text-foreground", className), ...props }));
+}
+function BreadcrumbPage({ className, ...props }) {
+    return (_jsx("span", { "data-slot": "breadcrumb-page", role: "link", "aria-disabled": "true", "aria-current": "page", className: cn("font-normal text-foreground", className), ...props }));
+}
+function BreadcrumbSeparator({ children, className, ...props }) {
+    return (_jsx("li", { "data-slot": "breadcrumb-separator", role: "presentation", "aria-hidden": "true", className: cn("[&>svg]:size-3.5", className), ...props, children: children ?? _jsx(ChevronRight, {}) }));
+}
+function BreadcrumbEllipsis({ className, ...props }) {
+    return (_jsxs("span", { "data-slot": "breadcrumb-ellipsis", role: "presentation", "aria-hidden": "true", className: cn("flex size-9 items-center justify-center", className), ...props, children: [_jsx(MoreHorizontal, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "More" })] }));
+}
+export { Breadcrumb, BreadcrumbList, BreadcrumbItem, BreadcrumbLink, BreadcrumbPage, BreadcrumbSeparator, BreadcrumbEllipsis, };

package/dist/web/ui/button.d.ts

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "destructive" | "ghost" | "link" | "outline" | "secondary" | null | undefined;
+    size?: "default" | "icon" | "icon-lg" | "icon-sm" | "icon-xs" | "lg" | "sm" | "xs" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+}): React.JSX.Element;
+export { Button, buttonVariants };

package/dist/web/ui/button.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// @ts-nocheck — vendored shadcn, regenerate via scripts/sync-shadcn.ts
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { Slot } from "radix-ui";
+import { cn } from "../lib/cn.js";
+const buttonVariants = cva("inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
+    variants: {
+        variant: {
+            default: "bg-primary text-primary-foreground hover:bg-primary/90",
+            destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
+            outline: "border border-border-strong bg-card shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
+            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+            ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+            link: "text-primary underline-offset-4 hover:underline",
+        },
+        size: {
+            default: "h-9 px-4 py-2 has-[>svg]:px-3 max-md:min-h-11",
+            xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
+            sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5 max-md:min-h-11",
+            lg: "h-10 rounded-md px-6 has-[>svg]:px-4 max-md:min-h-11",
+            icon: "size-9 max-md:size-11",
+            "icon-xs": "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
+            "icon-sm": "size-8 max-md:size-11",
+            "icon-lg": "size-10 max-md:size-11",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+function Button({ className, variant = "default", size = "default", asChild = false, ...props }) {
+    const Comp = asChild ? Slot.Root : "button";
+    return (_jsx(Comp, { "data-slot": "button", "data-variant": variant, "data-size": size, className: cn(buttonVariants({ variant, size, className })), ...props }));
+}
+export { Button, buttonVariants };

package/dist/web/ui/checkbox.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import { Checkbox as CheckboxPrimitive } from "radix-ui";
+declare function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>): React.JSX.Element;
+export { Checkbox };

package/dist/web/ui/checkbox.js

@@ -0,0 +1,11 @@
+// @ts-nocheck — vendored shadcn, regenerate via scripts/sync-shadcn.ts
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { CheckIcon } from "lucide-react";
+import { Checkbox as CheckboxPrimitive } from "radix-ui";
+import { cn } from "../lib/cn.js";
+function Checkbox({ className, ...props }) {
+    return (_jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", className: cn("peer size-4 shrink-0 rounded-[4px] border border-input shadow-xs transition-shadow outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:bg-input/30 dark:aria-invalid:ring-destructive/40 dark:data-[state=checked]:bg-primary", className), ...props, children: _jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "grid place-content-center text-current transition-none", children: _jsx(CheckIcon, { className: "size-3.5" }) }) }));
+}
+export { Checkbox };

package/dist/web/ui/input.d.ts

@@ -0,0 +1,3 @@
+import * as React from "react";
+declare function Input({ className, type, ...props }: React.ComponentProps<"input">): React.JSX.Element;
+export { Input };

package/dist/web/ui/input.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// @ts-nocheck — vendored shadcn, regenerate via scripts/sync-shadcn.ts
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+function Input({ className, type, ...props }) {
+    return (_jsx("input", { type: type, "data-slot": "input", className: cn("h-9 w-full min-w-0 max-md:min-h-11 rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm dark:bg-input/30", "focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50", "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40", className), ...props }));
+}
+export { Input };

package/dist/web/ui/label.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import { Label as LabelPrimitive } from "radix-ui";
+declare function Label({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): React.JSX.Element;
+export { Label };

package/dist/web/ui/label.js

@@ -0,0 +1,10 @@
+// @ts-nocheck — vendored shadcn, regenerate via scripts/sync-shadcn.ts
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Label as LabelPrimitive } from "radix-ui";
+import { cn } from "../lib/cn.js";
+function Label({ className, ...props }) {
+    return (_jsx(LabelPrimitive.Root, { "data-slot": "label", className: cn("flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50", className), ...props }));
+}
+export { Label };

package/dist/web/ui/resizable.d.ts

@@ -0,0 +1,7 @@
+import * as ResizablePrimitive from "react-resizable-panels";
+declare function ResizablePanelGroup({ className, ...props }: ResizablePrimitive.GroupProps): import("react").JSX.Element;
+declare function ResizablePanel({ ...props }: ResizablePrimitive.PanelProps): import("react").JSX.Element;
+declare function ResizableHandle({ withHandle, className, ...props }: ResizablePrimitive.SeparatorProps & {
+    withHandle?: boolean;
+}): import("react").JSX.Element;
+export { ResizableHandle, ResizablePanel, ResizablePanelGroup };