@dreamboard-games/ui-sdk 0.0.41

package/dist/theme/board.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Board theming helpers.
+ *
+ * The SDK's board renderers (`<HexGrid>`, `<SquareGrid>`,
+ * `<NetworkGraph>`, `<ZoneMap>`, `<TrackBoard>`, `<SlotSystem>`) need a
+ * tiny but consistent set of visual tokens — frame border, frame fill,
+ * eligible-target hint, and active hover ring — so authors don't have
+ * to re-pick colours per board. {@link useBoardTheme} exposes those
+ * tokens, derived from the active {@link Theme}.
+ */
+import type { Theme } from "./tokens.js";
+/**
+ * Resolved board tokens consumed by board renderers and per-tile
+ * default renderers. All values are CSS-ready strings.
+ */
+export interface BoardTheme {
+    /** Border drawn around the board's outer frame. */
+    readonly frameBorder: string;
+    /** Background painted under the tile renderer (visible at tile gaps). */
+    readonly frameBackground: string;
+    /** Hover-state ring drawn over an interactive target. */
+    readonly hoverRing: string;
+    /** Idle hint colour for an eligible-but-unhovered target. */
+    readonly eligibleHint: string;
+    /** Border drawn on inactive tiles (matches semantic.border.default). */
+    readonly tileBorder: string;
+    /** Subtle dotted border for non-interactive scaffolding (e.g. ports). */
+    readonly tileBorderSubtle: string;
+    /** Foreground used for board labels (numbers, port ratios). */
+    readonly tileText: string;
+    /** Recommended ring stroke width in px for hover/eligible markers. */
+    readonly ringWidth: number;
+}
+/**
+ * Derive a {@link BoardTheme} from the active theme. Memoised on the
+ * theme reference so consumers can pass it straight to a board's
+ * `defaultTileProps` / `defaultEdgeProps` slots.
+ */
+export declare function useBoardTheme(): BoardTheme;
+/** Standalone derivation for renderers that already hold a {@link Theme}. */
+export declare function deriveBoardTheme(theme: Theme): BoardTheme;
+//# sourceMappingURL=board.d.ts.map

package/dist/theme/board.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"board.d.ts","sourceRoot":"","sources":["../../src/theme/board.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAIH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEzC;;;GAGG;AACH,MAAM,WAAW,UAAU;IACzB,mDAAmD;IACnD,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAC;IAC7B,yEAAyE;IACzE,QAAQ,CAAC,eAAe,EAAE,MAAM,CAAC;IACjC,yDAAyD;IACzD,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,6DAA6D;IAC7D,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,wEAAwE;IACxE,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,yEAAyE;IACzE,QAAQ,CAAC,gBAAgB,EAAE,MAAM,CAAC;IAClC,+DAA+D;IAC/D,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC;IAC1B,sEAAsE;IACtE,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;CAC5B;AAED;;;;GAIG;AACH,wBAAgB,aAAa,IAAI,UAAU,CAG1C;AAED,6EAA6E;AAC7E,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,KAAK,GAAG,UAAU,CAWzD"}

package/dist/theme/board.js

@@ -0,0 +1,34 @@
+/**
+ * Board theming helpers.
+ *
+ * The SDK's board renderers (`<HexGrid>`, `<SquareGrid>`,
+ * `<NetworkGraph>`, `<ZoneMap>`, `<TrackBoard>`, `<SlotSystem>`) need a
+ * tiny but consistent set of visual tokens — frame border, frame fill,
+ * eligible-target hint, and active hover ring — so authors don't have
+ * to re-pick colours per board. {@link useBoardTheme} exposes those
+ * tokens, derived from the active {@link Theme}.
+ */
+import { useMemo } from "react";
+import { useTheme } from "./ThemeProvider.js";
+/**
+ * Derive a {@link BoardTheme} from the active theme. Memoised on the
+ * theme reference so consumers can pass it straight to a board's
+ * `defaultTileProps` / `defaultEdgeProps` slots.
+ */
+export function useBoardTheme() {
+    const theme = useTheme();
+    return useMemo(() => deriveBoardTheme(theme), [theme]);
+}
+/** Standalone derivation for renderers that already hold a {@link Theme}. */
+export function deriveBoardTheme(theme) {
+    return {
+        frameBorder: theme.component.board.frameBorder,
+        frameBackground: theme.component.board.frameBackground,
+        hoverRing: theme.component.board.hoverRing,
+        eligibleHint: theme.component.board.eligibleHint,
+        tileBorder: theme.semantic.border.default,
+        tileBorderSubtle: theme.semantic.border.subtle,
+        tileText: theme.semantic.text.primary,
+        ringWidth: 3,
+    };
+}

package/dist/theme/css-vars.d.ts

@@ -0,0 +1,31 @@
+import type { CSSProperties } from "react";
+import type { Theme } from "./tokens.js";
+/**
+ * Walk the theme tree and produce a flat `{ "--db-...": value }` map.
+ * Arrays are walked positionally with a 1-based index (so
+ * `theme.player[0]` → `--db-player-1-...`).
+ */
+export declare function themeToCssVars(theme: Theme): CSSProperties;
+/**
+ * Build a `var(--db-...)` reference for a token path.
+ *
+ * @example
+ * ```ts
+ * cssVar("semantic", "intent", "primary", "solid")
+ *   // => "var(--db-semantic-intent-primary-solid)"
+ * cssVar("player", 1, "solid")
+ *   // => "var(--db-player-1-solid)"
+ * ```
+ */
+export declare function cssVar(...path: Array<string | number>): string;
+/**
+ * Convenience for declaring a `var(--db-...)` with an inline fallback.
+ *
+ * @example
+ * ```ts
+ * cssVarOr("transparent", "semantic", "border", "default")
+ *   // => "var(--db-semantic-border-default, transparent)"
+ * ```
+ */
+export declare function cssVarOr(fallback: string, ...path: Array<string | number>): string;
+//# sourceMappingURL=css-vars.d.ts.map

package/dist/theme/css-vars.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"css-vars.d.ts","sourceRoot":"","sources":["../../src/theme/css-vars.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAqCzC;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,KAAK,GAAG,aAAa,CAI1D;AA4BD;;;;;;;;;;GAUG;AACH,wBAAgB,MAAM,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,GAAG,MAAM,CAE9D;AAED;;;;;;;;GAQG;AACH,wBAAgB,QAAQ,CACtB,QAAQ,EAAE,MAAM,EAChB,GAAG,IAAI,EAAE,KAAK,CAAC,MAAM,GAAG,MAAM,CAAC,GAC9B,MAAM,CAER"}

package/dist/theme/css-vars.js

@@ -0,0 +1,88 @@
+/**
+ * CSS variable bridge for {@link Theme}.
+ *
+ * The {@link ThemeProvider} mounts a wrapper element and applies the
+ * map returned by {@link themeToCssVars} as inline `style`, which
+ * declares one CSS custom property per leaf token. Components inside
+ * the provider can:
+ *
+ * 1. Read tokens via `useTheme()` (typed) and use them inline, or
+ * 2. Read the CSS variable directly in Tailwind / className styling
+ *    via the helpers in {@link var()} below.
+ *
+ * The variable naming scheme is `--db-<dot.path>` with `.` and any
+ * non-identifier characters replaced by `-`. Example:
+ *
+ * - `theme.semantic.intent.primary.solid` → `--db-semantic-intent-primary-solid`
+ * - `theme.player[0].solid`              → `--db-player-1-solid`
+ * - `theme.color.brand.600`              → `--db-color-brand-600`
+ *
+ * The 1-based player suffix (rather than 0-based) keeps the variable
+ * name aligned with how seats are labelled in product UI ("Player 1").
+ */
+const PREFIX = "--db";
+/** Convert a token-tree path to a kebab-case CSS variable name. */
+function toVarName(parts) {
+    const tail = parts
+        .map((part) => String(part))
+        .join("-")
+        .replace(/[^a-zA-Z0-9-]/g, "-")
+        .replace(/-+/g, "-");
+    return `${PREFIX}-${tail}`;
+}
+/**
+ * Walk the theme tree and produce a flat `{ "--db-...": value }` map.
+ * Arrays are walked positionally with a 1-based index (so
+ * `theme.player[0]` → `--db-player-1-...`).
+ */
+export function themeToCssVars(theme) {
+    const out = {};
+    walk(theme, [], out);
+    return out;
+}
+function walk(node, path, out) {
+    if (node === null || node === undefined)
+        return;
+    if (typeof node === "string" || typeof node === "number") {
+        out[toVarName(path)] = String(node);
+        return;
+    }
+    if (Array.isArray(node)) {
+        node.forEach((child, idx) => {
+            // 1-based index for player slots, etc.
+            walk(child, [...path, idx + 1], out);
+        });
+        return;
+    }
+    if (typeof node === "object") {
+        for (const [key, value] of Object.entries(node)) {
+            walk(value, [...path, key], out);
+        }
+    }
+}
+/**
+ * Build a `var(--db-...)` reference for a token path.
+ *
+ * @example
+ * ```ts
+ * cssVar("semantic", "intent", "primary", "solid")
+ *   // => "var(--db-semantic-intent-primary-solid)"
+ * cssVar("player", 1, "solid")
+ *   // => "var(--db-player-1-solid)"
+ * ```
+ */
+export function cssVar(...path) {
+    return `var(${toVarName(path)})`;
+}
+/**
+ * Convenience for declaring a `var(--db-...)` with an inline fallback.
+ *
+ * @example
+ * ```ts
+ * cssVarOr("transparent", "semantic", "border", "default")
+ *   // => "var(--db-semantic-border-default, transparent)"
+ * ```
+ */
+export function cssVarOr(fallback, ...path) {
+    return `var(${toVarName(path)}, ${fallback})`;
+}

package/dist/theme/derive.d.ts

@@ -0,0 +1,66 @@
+import type { CSSProperties } from "react";
+import type { IntentColor, Theme } from "./tokens.js";
+/**
+ * Helpers that derive component-specific style fragments from a
+ * resolved {@link Theme}. They live alongside the theme module (rather
+ * than in each component) so that:
+ *
+ * - There is one canonical mapping of "intent → button style", "intent →
+ *   chip style", etc.
+ * - Component visuals stay aligned automatically when an author tweaks
+ *   the theme; nobody has to remember to update a bespoke calc inside
+ *   `<Card>` or `<DefaultInteractionButton>`.
+ *
+ * Each helper returns a plain {@link CSSProperties} fragment so the
+ * caller can spread it into an inline style (or pass it through to
+ * Framer Motion's `style` prop).
+ */
+/** Button visual variants derived from semantic intent slots. */
+export type ButtonVariant = "primary" | "secondary" | "danger" | "submitted" | "success" | "warning" | "info" | "ghost";
+export type ButtonSize = "sm" | "md" | "lg";
+/**
+ * Compute the inline style for a button in `variant`/`size` from the
+ * theme. `disabled` and `pressed` are visual-only — they affect colour
+ * intensity and elevation but never touch interactivity (the consuming
+ * component owns `aria-disabled` and event wiring).
+ */
+export declare function buttonStyle(theme: Theme, options?: {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    disabled?: boolean;
+    pressed?: boolean;
+}): CSSProperties;
+/**
+ * Soft-intent chip ("Your turn", "Largest army", "Waiting…"). Reads
+ * `intent.<variant>.soft` for background and `.onSoft` for text.
+ */
+export declare function chipStyle(theme: Theme, options?: {
+    variant?: Exclude<ButtonVariant, "ghost">;
+    size?: "sm" | "md";
+}): CSSProperties;
+/**
+ * Standard surface card (player card, action panel, hand drawer). The
+ * `tone` selects which `surface.*` slot to read; `interactive` adds
+ * the hover-elevation transition baseline.
+ */
+export declare function surfaceStyle(theme: Theme, options?: {
+    tone?: keyof Theme["semantic"]["surface"];
+    interactive?: boolean;
+    /** Override radius to one of the theme tokens. Defaults to `lg`. */
+    radius?: keyof Theme["radius"];
+}): CSSProperties;
+/** Resolve a {@link ButtonVariant} to its underlying {@link IntentColor}. */
+export declare function intentForVariant(theme: Theme, variant: ButtonVariant): IntentColor;
+/**
+ * Pick a {@link Theme.player} entry by 0-based seat slot, wrapping
+ * around when there are more players than palette entries (so a
+ * 7-player game cycles back to player 1's palette).
+ */
+export declare function playerColor(theme: Theme, slot: number): import("./tokens.js").PlayerColor;
+/**
+ * Returns `theme.motion.duration.<key>` zeroed out when the theme has
+ * `motion.reducedMotion === "true"`. Use this in any component that
+ * starts an animation so `prefers-reduced-motion` is honoured uniformly.
+ */
+export declare function motionDuration(theme: Theme, key: keyof Theme["motion"]["duration"]): string;
+//# sourceMappingURL=derive.d.ts.map

package/dist/theme/derive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"derive.d.ts","sourceRoot":"","sources":["../../src/theme/derive.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEtD;;;;;;;;;;;;;;GAcG;AAEH,iEAAiE;AACjE,MAAM,MAAM,aAAa,GACrB,SAAS,GACT,WAAW,GACX,QAAQ,GACR,WAAW,GACX,SAAS,GACT,SAAS,GACT,MAAM,GACN,OAAO,CAAC;AAEZ,MAAM,MAAM,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C;;;;;GAKG;AACH,wBAAgB,WAAW,CACzB,KAAK,EAAE,KAAK,EACZ,OAAO,GAAE;IACP,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;CACd,GACL,aAAa,CAgDf;AA+BD;;;GAGG;AACH,wBAAgB,SAAS,CACvB,KAAK,EAAE,KAAK,EACZ,OAAO,GAAE;IACP,OAAO,CAAC,EAAE,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;IAC1C,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACf,GACL,aAAa,CAuBf;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAC1B,KAAK,EAAE,KAAK,EACZ,OAAO,GAAE;IACP,IAAI,CAAC,EAAE,MAAM,KAAK,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,CAAC;IAC1C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oEAAoE;IACpE,MAAM,CAAC,EAAE,MAAM,KAAK,CAAC,QAAQ,CAAC,CAAC;CAC3B,GACL,aAAa,CAYf;AAED,6EAA6E;AAC7E,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,aAAa,GACrB,WAAW,CAmBb;AAED;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,qCASrD;AAED;;;;GAIG;AACH,wBAAgB,cAAc,CAC5B,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,MAAM,KAAK,CAAC,QAAQ,CAAC,CAAC,UAAU,CAAC,GACrC,MAAM,CAGR"}

package/dist/theme/derive.js

@@ -0,0 +1,161 @@
+/**
+ * Compute the inline style for a button in `variant`/`size` from the
+ * theme. `disabled` and `pressed` are visual-only — they affect colour
+ * intensity and elevation but never touch interactivity (the consuming
+ * component owns `aria-disabled` and event wiring).
+ */
+export function buttonStyle(theme, options = {}) {
+    const { variant = "primary", size = "md", disabled, pressed } = options;
+    const intent = intentForVariant(theme, variant);
+    const sizing = BUTTON_SIZE[size];
+    const visuallyDisabled = disabled && variant !== "submitted";
+    const baseShadow = variant === "ghost"
+        ? "none"
+        : pressed
+            ? theme.elevation.rest
+            : theme.elevation.hover;
+    return {
+        display: "inline-flex",
+        alignItems: "center",
+        justifyContent: "center",
+        gap: theme.space[2],
+        minHeight: sizing.minHeight,
+        paddingBlock: sizing.paddingBlock,
+        paddingInline: sizing.paddingInline,
+        borderRadius: theme.radius.md,
+        border: variant === "ghost"
+            ? "1px solid transparent"
+            : `1px solid ${visuallyDisabled ? theme.semantic.border.subtle : intent.border}`,
+        background: variant === "ghost"
+            ? "transparent"
+            : visuallyDisabled
+                ? theme.semantic.surface.inset
+                : intent.solid,
+        color: visuallyDisabled
+            ? theme.semantic.text.disabled
+            : variant === "ghost"
+                ? theme.semantic.text.primary
+                : intent.on,
+        fontFamily: theme.typography.fontFamily.body,
+        fontSize: sizing.fontSize,
+        fontWeight: theme.typography.fontWeight.bold,
+        lineHeight: theme.typography.lineHeight.tight,
+        letterSpacing: theme.typography.letterSpacing.normal,
+        cursor: disabled ? "not-allowed" : "pointer",
+        boxShadow: disabled ? "none" : baseShadow,
+        transition: `background-color ${theme.motion.duration.fast} ${theme.motion.easing.out}, transform ${theme.motion.duration.fast} ${theme.motion.easing.out}, box-shadow ${theme.motion.duration.normal} ${theme.motion.easing.out}`,
+        userSelect: "none",
+        WebkitTapHighlightColor: "transparent",
+    };
+}
+const BUTTON_SIZE = {
+    sm: {
+        minHeight: 32,
+        paddingBlock: "0.25rem",
+        paddingInline: "0.625rem",
+        fontSize: "0.8125rem",
+    },
+    md: {
+        minHeight: 40,
+        paddingBlock: "0.5rem",
+        paddingInline: "0.875rem",
+        fontSize: "0.9375rem",
+    },
+    lg: {
+        minHeight: 52,
+        paddingBlock: "0.75rem",
+        paddingInline: "1.125rem",
+        fontSize: "1.0625rem",
+    },
+};
+/**
+ * Soft-intent chip ("Your turn", "Largest army", "Waiting…"). Reads
+ * `intent.<variant>.soft` for background and `.onSoft` for text.
+ */
+export function chipStyle(theme, options = {}) {
+    const { variant = "secondary", size = "sm" } = options;
+    const intent = intentForVariant(theme, variant);
+    return {
+        display: "inline-flex",
+        alignItems: "center",
+        gap: theme.space[1],
+        paddingBlock: size === "md" ? "0.25rem" : "0.125rem",
+        paddingInline: size === "md" ? "0.625rem" : "0.5rem",
+        borderRadius: theme.radius.pill,
+        border: `1px solid ${intent.border}`,
+        background: intent.soft,
+        color: intent.onSoft,
+        fontFamily: theme.typography.fontFamily.body,
+        fontSize: size === "md"
+            ? theme.typography.fontSize.sm
+            : theme.typography.fontSize.xs,
+        fontWeight: theme.typography.fontWeight.bold,
+        letterSpacing: theme.typography.letterSpacing.wide,
+        textTransform: "uppercase",
+        whiteSpace: "nowrap",
+    };
+}
+/**
+ * Standard surface card (player card, action panel, hand drawer). The
+ * `tone` selects which `surface.*` slot to read; `interactive` adds
+ * the hover-elevation transition baseline.
+ */
+export function surfaceStyle(theme, options = {}) {
+    const { tone = "card", interactive, radius = "lg" } = options;
+    return {
+        background: theme.semantic.surface[tone],
+        color: theme.semantic.text.primary,
+        border: `1px solid ${theme.semantic.border.subtle}`,
+        borderRadius: theme.radius[radius],
+        boxShadow: theme.elevation.rest,
+        transition: interactive
+            ? `box-shadow ${theme.motion.duration.normal} ${theme.motion.easing.out}, transform ${theme.motion.duration.normal} ${theme.motion.easing.out}`
+            : undefined,
+    };
+}
+/** Resolve a {@link ButtonVariant} to its underlying {@link IntentColor}. */
+export function intentForVariant(theme, variant) {
+    switch (variant) {
+        case "primary":
+            return theme.semantic.intent.primary;
+        case "secondary":
+            return theme.semantic.intent.secondary;
+        case "danger":
+            return theme.semantic.intent.danger;
+        case "submitted":
+            return theme.semantic.intent.success;
+        case "success":
+            return theme.semantic.intent.success;
+        case "warning":
+            return theme.semantic.intent.warning;
+        case "info":
+            return theme.semantic.intent.info;
+        case "ghost":
+            return theme.semantic.intent.secondary;
+    }
+}
+/**
+ * Pick a {@link Theme.player} entry by 0-based seat slot, wrapping
+ * around when there are more players than palette entries (so a
+ * 7-player game cycles back to player 1's palette).
+ */
+export function playerColor(theme, slot) {
+    const length = theme.player.length;
+    const idx = ((slot % length) + length) % length;
+    // The {@link Theme.player} contract pins length === 6 at the type
+    // level, but indexing by a runtime-computed value widens the result
+    // to `PlayerColor | undefined`. Falling back to slot 0 (also typed
+    // `PlayerColor`) keeps the return type narrow without a non-null
+    // assertion.
+    return theme.player[idx] ?? theme.player[0];
+}
+/**
+ * Returns `theme.motion.duration.<key>` zeroed out when the theme has
+ * `motion.reducedMotion === "true"`. Use this in any component that
+ * starts an animation so `prefers-reduced-motion` is honoured uniformly.
+ */
+export function motionDuration(theme, key) {
+    if (theme.motion.reducedMotion === "true")
+        return "0ms";
+    return theme.motion.duration[key];
+}

package/dist/theme/index.d.ts

@@ -0,0 +1,22 @@
+/**
+ * Public theme surface for `@dreamboard/ui-sdk`.
+ *
+ * Authors who only consume the SDK never need to import from
+ * sub-modules — `<ThemeProvider>`, `useTheme()`, and the preset ids
+ * are the entire public API. Type-level exports cover advanced use
+ * (custom themes, deep overrides) without leaking internal token shape
+ * surfaces (CSS-var serializer, derive helpers) that may move.
+ *
+ * Module entry order is import-friendly: tokens (types) before
+ * presets (values) before provider (consumes both).
+ */
+export type { ColorRamp, ComponentTokens, Elevation, FoundationColor, IntentColor, Motion, PlayerColor, Radius, SemanticColor, Space, Theme, ThemeMeta, ThemeOverride, Typography, } from "./tokens.js";
+export { mergeTheme } from "./tokens.js";
+export { tabletopTheme } from "./presets/tabletop.js";
+export { arcadeTheme } from "./presets/arcade.js";
+export { studioTheme } from "./presets/studio.js";
+export { ThemeProvider, resolveTheme, getThemePreset, useTheme, useThemeCssVars, type ThemeContextValue, type ThemePresetId, type ThemeProviderProps, } from "./ThemeProvider.js";
+export { themeToCssVars, cssVar, cssVarOr } from "./css-vars.js";
+export { buttonStyle, chipStyle, surfaceStyle, intentForVariant, playerColor, motionDuration, type ButtonSize, type ButtonVariant, } from "./derive.js";
+export { useBoardTheme, deriveBoardTheme, type BoardTheme } from "./board.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/theme/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/theme/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,YAAY,EACV,SAAS,EACT,eAAe,EACf,SAAS,EACT,eAAe,EACf,WAAW,EACX,MAAM,EACN,WAAW,EACX,MAAM,EACN,aAAa,EACb,KAAK,EACL,KAAK,EACL,SAAS,EACT,aAAa,EACb,UAAU,GACX,MAAM,aAAa,CAAC;AAErB,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAElD,OAAO,EACL,aAAa,EACb,YAAY,EACZ,cAAc,EACd,QAAQ,EACR,eAAe,EACf,KAAK,iBAAiB,EACtB,KAAK,aAAa,EAClB,KAAK,kBAAkB,GACxB,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EAAE,cAAc,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEjE,OAAO,EACL,WAAW,EACX,SAAS,EACT,YAAY,EACZ,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,KAAK,UAAU,EACf,KAAK,aAAa,GACnB,MAAM,aAAa,CAAC;AAErB,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,KAAK,UAAU,EAAE,MAAM,YAAY,CAAC"}

package/dist/theme/index.js

@@ -0,0 +1,20 @@
+/**
+ * Public theme surface for `@dreamboard/ui-sdk`.
+ *
+ * Authors who only consume the SDK never need to import from
+ * sub-modules — `<ThemeProvider>`, `useTheme()`, and the preset ids
+ * are the entire public API. Type-level exports cover advanced use
+ * (custom themes, deep overrides) without leaking internal token shape
+ * surfaces (CSS-var serializer, derive helpers) that may move.
+ *
+ * Module entry order is import-friendly: tokens (types) before
+ * presets (values) before provider (consumes both).
+ */
+export { mergeTheme } from "./tokens.js";
+export { tabletopTheme } from "./presets/tabletop.js";
+export { arcadeTheme } from "./presets/arcade.js";
+export { studioTheme } from "./presets/studio.js";
+export { ThemeProvider, resolveTheme, getThemePreset, useTheme, useThemeCssVars, } from "./ThemeProvider.js";
+export { themeToCssVars, cssVar, cssVarOr } from "./css-vars.js";
+export { buttonStyle, chipStyle, surfaceStyle, intentForVariant, playerColor, motionDuration, } from "./derive.js";
+export { useBoardTheme, deriveBoardTheme } from "./board.js";

package/dist/theme/presets/arcade.d.ts

@@ -0,0 +1,10 @@
+import type { Theme } from "../tokens.js";
+/**
+ * `arcade` — high-contrast neon theme for fast/competitive games.
+ *
+ * Visual identity: deep slate background, electric cyan/magenta
+ * intents, square-ish corners, sharp drop shadows. Designed to evoke
+ * action games and to keep critical CTAs popping at a glance.
+ */
+export declare const arcadeTheme: Theme;
+//# sourceMappingURL=arcade.d.ts.map

package/dist/theme/presets/arcade.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"arcade.d.ts","sourceRoot":"","sources":["../../../src/theme/presets/arcade.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAE1C;;;;;;GAMG;AACH,eAAO,MAAM,WAAW,EAAE,KA2PzB,CAAC"}