@almadar/ui 6.54.0 → 6.56.0

package/dist/components/index.d.ts

@@ -1,12 +1,12 @@
-import { A11yProps, Asset, EventKey, EventPayload, EventEmit, AssetUrl, FieldValue, EntityRow, EntityRole, AnimationName, SpriteDirection, AnimationDef, ScenePos, Camera, SoundEntry, EntityWith, TraitConfigValue, SkeletonVariant, SkeletonSpec, SkeletonNode, SurfaceMode, EventListen, JsonValue, AssetCatalog, SExpr as SExpr$1, JsonObject, EventPayloadValue, DeclaredTraitConfig, TraitConfig, ControlValue, OrbitalSchema, Trait, TraceActivity, OrbitalEntity, FormSubmitPayload, UISlot, EnterAnimation, EditFocus, TraceSubagent, TraceChatMessage } from '@almadar/core';
+import { A11yProps, Asset, EventKey, EventPayload, EventEmit, AssetUrl, FieldValue, EntityRow, EntityRole, AnimationName, SpriteDirection, AnimationDef, ScenePos, Camera, SoundEntry, EntityWith, DiagramMarkRoles, TraitConfigValue, SkeletonVariant, SkeletonSpec, SkeletonNode, SurfaceMode, EventListen, JsonValue, AssetCatalog, SExpr as SExpr$1, JsonObject, EventPayloadValue, DeclaredTraitConfig, TraitConfig, ControlValue, OrbitalSchema, Trait, TraceActivity, OrbitalEntity, FormSubmitPayload, UISlot, EnterAnimation, EditFocus, TraceSubagent, TraceChatMessage } from '@almadar/core';
 export { AnimationDef, AnimationName, AudioManifest, BusEvent, BusEventListener, BusEventSource, BusEventListener as EventListener, SkeletonVariant, SoundEntry, SpriteDirection, UISlot, Unsubscribe } from '@almadar/core';
 import * as React$1 from 'react';
 import React__default, { ReactNode, ErrorInfo } from 'react';
 import { I as IconInput, U as UiError, D as DrawableNode, P as Projector, F as FxOverlayItem, B as BadgeColor, M as MeshShapeKind, a as MeshMaterial, b as DrawGroupProps, c as DrawTextProps, d as DrawMeshProps, e as DisplayField, f as BadgeVariant, C as ColorToken } from '../paintDispatch-_6EhJCiL.js';
 export { g as Badge, h as BadgeProps, i as FxOverlayKind, j as Icon, k as IconAnimation, l as IconProps, m as IconSize, n as ImageSource, L as LinkAction, o as Point, R as Rect } from '../paintDispatch-_6EhJCiL.js';
 import { SExpr } from '@almadar/evaluator';
-import { U as UnitAnimationState, F as FacingDirection, S as SpriteSheetUrls, f as SpriteFrameDims, R as ResolvedFrame, g as CanvasLighting, h as CanvasPost, a as IsometricUnit, i as CameraState } from '../Canvas3DHost-B-y2TNij.js';
-export { B as BoardTile, G as GameAction, j as GamePhase, k as GameState, l as GameUnit, b as IsometricFeature, I as IsometricTile, P as Position, m as UnitTrait, n as calculateAttackTargets, o as calculateValidMoves, p as createInitialGameState } from '../Canvas3DHost-B-y2TNij.js';
+import { U as UnitAnimationState, F as FacingDirection, S as SpriteSheetUrls, f as SpriteFrameDims, R as ResolvedFrame, g as CanvasLighting, h as CanvasPost, a as IsometricUnit, i as CameraState } from '../Canvas3DHost-DfAhg6EH.js';
+export { B as BoardTile, G as GameAction, j as GamePhase, k as GameState, l as GameUnit, b as IsometricFeature, I as IsometricTile, P as Position, m as UnitTrait, n as calculateAttackTargets, o as calculateValidMoves, p as createInitialGameState } from '../Canvas3DHost-DfAhg6EH.js';
 export { G as GameAudioContext, a as GameAudioContextValue, e as GameAudioControls, b as GameAudioProvider, c as GameAudioProviderProps, U as UseGameAudioOptions, f as useGameAudio, u as useGameAudioContext } from '../GameAudioProvider-DyBvYP2c.js';
 import { c as AvlStateMachineProps } from '../FileTree-DUi7e7Z8.js';
 export { B as BehaviorView, d as BehaviorViewProps, e as FileTree, F as FileTreeItem, f as FileTreeNode, g as FileTreeProps, M as ModuleCard, h as ModuleCardProps } from '../FileTree-DUi7e7Z8.js';
@@ -3448,7 +3448,12 @@ interface LearningPoint {
     x: number;
     y: number;
 }
-interface LearningShape {
+/**
+ * A drawn mark. Style comes from the theme by role (`tone`, `stroke`, `text`, `font`,
+ * `fillStyle`); a literal field on the same mark (`color`, `lineWidth`, `fontSize`) overrides its
+ * role. `color` and `fill` also accept a tone name.
+ */
+interface LearningShape extends DiagramMarkRoles {
     type: LearningShapeType;
     /** Optional stable id for interaction payloads. */
     id?: string;
@@ -3473,8 +3478,11 @@ interface LearningShape {
     min?: number;
     max?: number;
     step?: number;
+    /** Stroke/text color: a tone name (`ink`, `guide`, `series-2`, …), a `var()` token or a literal. Overrides `tone`. */
     color?: string;
+    /** Fill color: a tone name, a `var()` token or a literal. A literal fills solid unless `fillStyle` says otherwise. */
     fill?: string;
+    /** Stroke width in px. Overrides `stroke`. */
     lineWidth?: number;
     opacity?: number;
     /** Ellipse arc start, in degrees (screen convention: 0 = +x, clockwise). Omit with `endAngle` for a full ellipse. */
@@ -3494,7 +3502,7 @@ interface LearningReadout {
     label: string;
     /** Chip value, shown after the label. */
     value: string | number;
-    /** Chip fill/border color (default `var(--color-foreground)`). */
+    /** Accent of the chip's marker dot: a tone name, token or literal (default `highlight`). */
     color?: string;
 }
 /** One plotted line within a trace panel. */
@@ -3539,8 +3547,14 @@ interface LearningCanvasProps extends A11yProps {
     width?: number;
     /** Canvas height in CSS pixels. */
     height?: number;
-    /** Background color (default transparent). */
+    /** Canvas ground: a tone name, `var()` token or literal (default the theme's `--surface-diagram`). */
     backgroundColor?: string;
+    /**
+     * Overrides the theme's categorical palette for this canvas: `series-1…N` resolve to these
+     * colors instead. For real-world conventions (CPK atom colors, resistor bands); unset, the
+     * theme's `--color-series-*` apply.
+     */
+    series?: string[];
     /** Canvas text font family. Falls back to the theme's --font-family-body. */
     fontFamily?: string;
     /** Declarative shapes to draw. */
@@ -3565,6 +3579,10 @@ interface LearningCanvasProps extends A11yProps {
      * @synonyms sparkline, time series, history plot
      */
     traces?: LearningTracePanel[];
+    /** Maps a keydown `e.code` — optionally prefixed `Mod+` (⌘/Ctrl), `Shift+`, `Alt+` — to a SEMANTIC event emitted as `UI:{event}` (e.g. `{ Space: TOGGLE_RUN, ArrowRight: STEP, KeyR: RESET }`); keystrokes inside inputs never route. */
+    keyMap?: Record<string, EventKey>;
+    /** Maps a keyup `e.code` to a semantic event emitted as `UI:{event}`. */
+    keyUpMap?: Record<string, EventKey>;
     /** Enable pointer interaction (click/hover). */
     interactive?: boolean;
     /** Enable continuous redraw loop. */
@@ -6444,7 +6462,7 @@ interface MathRegion {
     samples2?: LearningPoint[];
     /** Baseline y-value the region closes against when `samples2` is absent (default 0). */
     baseline?: number;
-    /** Fill/stroke color (default '#2563eb'). */
+    /** Fill/stroke color: a tone name, token or literal (default `series-1`, tinted). */
     color?: string;
     /** Fill opacity (default 0.2). */
     opacity?: number;
@@ -6464,7 +6482,7 @@ interface MathBar {
     y0?: number;
     /** Top y-value. */
     y1: number;
-    /** Fill/stroke color (default '#93c5fd'). */
+    /** Fill/stroke color: a tone name, token or literal (default `series-2`, tinted). */
     color?: string;
     /** Fill opacity (default 0.5). */
     opacity?: number;
@@ -6475,7 +6493,7 @@ interface MathGuide {
     kind: 'vline' | 'hline';
     /** World coordinate the guide sits at. */
     at: number;
-    /** Line color (default '#9ca3af'). */
+    /** Line color: a tone name, token or literal (default `guide`). */
     color?: string;
     /** Stroke dash style (default 'dashed'); 'solid' draws an unbroken line. */
     dash?: 'solid' | 'dashed' | 'dotted';
@@ -6494,7 +6512,7 @@ interface MathAngle {
     to: number;
     /** Arc radius, in world-x units (default 0.8). */
     radius?: number;
-    /** Arc + label color (default '#0ea5e9'). */
+    /** Arc + label color: a tone name, token or literal (default `series-4`). */
     color?: string;
     /** Angle label. */
     label?: string;
@@ -6508,7 +6526,7 @@ interface MathHop {
     from: number;
     /** End x, in world coordinates. */
     to: number;
-    /** Arc + arrowhead color (default '#7c3aed'). */
+    /** Arc + arrowhead color: a tone name, token or literal (default `series-3`). */
     color?: string;
     /** Hop label, centered above the arc. */
     label?: string;
@@ -6525,17 +6543,24 @@ interface MathCanvasProps extends Omit<React$1.AriaAttributes, keyof A11yProps>,
     showAxes?: boolean;
     showGrid?: boolean;
     gridStep?: number;
-    /** Canvas fill color; `var(--token, fallback)` strings resolve against the active theme. Default transparent. */
+    /** Canvas ground: a tone name, `var()` token or literal. Default the theme's `--surface-diagram`. */
     backgroundColor?: string;
-    /** Grid line color; resolves theme tokens (default `var(--color-border, #9ca3af)`). */
+    /** Overrides the theme's categorical palette (`series-1…N`) for this canvas — real-world conventions like CPK atom colors or resistor bands. Unset, the theme's `--color-series-*` apply. */
+    series?: string[];
+    /** Grid line color: a tone name, token or literal (default the `grid` tone). */
     gridColor?: string;
-    /** Axis line color; resolves theme tokens (default `var(--color-muted-foreground, #374151)`). */
+    /** Axis line color: a tone name, token or literal (default the `axis` tone). */
     axisColor?: string;
+    /**
+     * How the x and y ranges map to the canvas. `fit` stretches each range to fill the plot (function
+     * plots); `equal` uses one scale for both axes so circles stay round (geometry). Default `fit`.
+     */
+    aspect?: 'fit' | 'equal';
     /** Draw numeric labels on grid lines (default false). */
     showTickLabels?: boolean;
-    /** Font size in px for axis tick labels (default 10). */
+    /** Font size in px for axis tick labels (default the theme's `xs` step). */
     tickLabelFontSize?: number;
-    /** Base font size in px for all other canvas annotations (points, vectors, guides, curves, regions, angles, hops; default 12). */
+    /** Font size in px for all other canvas annotations (default the theme's diagram label size). */
     labelFontSize?: number;
     /** Canvas text font family. Accepts a known game-font key (e.g. "future-narrow") or a CSS font-family string. */
     fontFamily?: string;
@@ -6599,6 +6624,7 @@ interface LearningPhysicsBody {
     /** 3D mode only: height in scene cells (2D ignores it). */
     z?: number;
     radius?: number;
+    /** Body color: a tone name, token or literal (default the `series-1`..`series-8` tone by body index). */
     color?: string;
     label?: string;
     vx?: number;
@@ -6613,6 +6639,7 @@ interface LearningPhysicsBody {
 interface LearningPhysicsConstraint {
     from: string;
     to: string;
+    /** Constraint color: a tone name, token or literal (default the `ink` tone). */
     color?: string;
     /** Draw style: rigid line (default), zigzag coil, or dashed tether. 2D only — 3D always draws a rod. */
     kind?: 'rod' | 'spring' | 'string';
@@ -6642,9 +6669,9 @@ interface PhysicsSceneObject {
     width?: number;
     /** Box height. */
     height?: number;
-    /** Stroke + hatch color (default '#334155'). */
+    /** Stroke + hatch color: a tone name, token or literal (default the `ink` tone). */
     color?: string;
-    /** Fill color; ramp defaults to '#e2e8f0'. */
+    /** Fill color: a tone name, token or literal; ramp defaults to the `fill` tone. */
     fill?: string;
     /** Fixture label. */
     label?: string;
@@ -6666,7 +6693,7 @@ interface PhysicsVector {
     dy: number;
     /** Multiplies `dx`/`dy` (default 1). */
     scale?: number;
-    /** Arrow + label color (default '#dc2626'). */
+    /** Arrow + label color: a tone name, token or literal (default the `series-5` tone). */
     color?: string;
     /** Label drawn at the tip, offset 8px further along the arrow direction. */
     label?: string;
@@ -6688,9 +6715,9 @@ interface PhysicsTrail {
     /** Authoring handle only — not clickable. */
     id?: string;
     points: PhysicsTrailPoint[];
-    /** Line color (default '#94a3b8'). */
+    /** Line color: a tone name, token or literal (default the `guide` tone). */
     color?: string;
-    /** 2D: stroke width in pixels (default 2). 3D: tube radius in scene cells (default 0.05). */
+    /** 2D: stroke width in pixels (default the theme's normal stroke). 3D: tube radius in scene cells (default 0.05). */
     width?: number;
     /** Multiplies the per-segment fade opacity (default 1). */
     opacity?: number;
@@ -6723,7 +6750,7 @@ interface PhysicsSurface3D {
     y?: number;
     /** Elevation color bands; omitted → a single flat-colored sheet. */
     bands?: PhysicsSurfaceBand[];
-    /** Fallback color when `bands` is omitted (default '#64748b'). */
+    /** Fallback color when `bands` is omitted: a tone name, token or literal (default the `series-1` tone). */
     color?: string;
     opacity?: number;
     /** Faceted low-poly shading (default true). */
@@ -6747,7 +6774,7 @@ interface PhysicsVector3D {
     dy: number;
     /** Height component (default 0). */
     dz?: number;
-    /** Arrow + label color (default '#dc2626'). */
+    /** Arrow + label color: a tone name, token or literal (default the `series-5` tone). */
     color?: string;
     /** Billboard label at the tip. */
     label?: string;
@@ -6767,7 +6794,7 @@ interface PhysicsAngleMarker {
     to: number;
     /** Arc radius in pixels (default 26). */
     radius?: number;
-    /** Arc + label color (default '#0ea5e9'). */
+    /** Arc + label color: a tone name, token or literal (default the `series-4` tone). */
     color?: string;
     /** Label drawn past the arc, along the bisecting bearing. */
     label?: string;
@@ -6784,7 +6811,7 @@ interface PhysicsField {
     angle?: number;
     /** Glyph size in pixels (default 14). */
     size?: number;
-    /** Glyph color (default '#94a3b8'). */
+    /** Glyph color: a tone name, token or literal (default the `guide` tone). */
     color?: string;
     /** Region left edge (default 0). */
     x?: number;
@@ -6804,7 +6831,7 @@ interface PhysicsMeter {
     value: number;
     /** Full-bar value (default: the max value across all meters, so bars stay comparable). */
     max?: number;
-    /** Bar + value color (default '#3b82f6'). */
+    /** Bar color: a tone name, token or literal (default the `series-1`..`series-8` tone by meter index). */
     color?: string;
 }
 interface PhysicsCanvasProps extends Omit<React$1.AriaAttributes, keyof A11yProps>, A11yProps {
@@ -6813,6 +6840,12 @@ interface PhysicsCanvasProps extends Omit<React$1.AriaAttributes, keyof A11yProp
     height?: number;
     title?: string;
     backgroundColor?: string;
+    /** Overrides the theme's categorical palette (`series-1…N`) for this canvas — real-world conventions like CPK atom colors or resistor bands. Unset, the theme's `--color-series-*` apply. */
+    series?: string[];
+    /** Maps a keydown `e.code` (optionally `Mod+`/`Shift+`/`Alt+` prefixed) to a SEMANTIC event emitted as `UI:{event}` — e.g. `{ Space: TOGGLE_RUN, ArrowRight: STEP, KeyR: RESET }`; keystrokes inside inputs never route. */
+    keyMap?: Record<string, EventKey>;
+    /** Maps a keyup `e.code` to a semantic event emitted as `UI:{event}`. */
+    keyUpMap?: Record<string, EventKey>;
     /** Painter: 2D raster (default) or 3D mesh scene via the lazy three.js host. */
     mode?: '2d' | '3d';
     /** 3D only: neutral camera pose ({ mode, zoom, fov, azimuth, target }). */
@@ -6918,18 +6951,18 @@ interface BiologyCompartment {
     height: number;
     /** Centered near the top of the ellipse. */
     label?: string;
-    /** Outline color (default '#16a34a'). */
+    /** Outline color: a tone name, token or literal (default `ink`). */
     color?: string;
-    /** Fill color (default = `color` at ~10% alpha). */
+    /** Fill color: a tone name, token or literal (default = `color`, tinted). */
     fill?: string;
     dash?: 'dashed' | 'dotted';
-    /** Outline stroke width (default 2). */
+    /** Outline stroke width in px (default the theme's normal stroke). */
     lineWidth?: number;
 }
 /** A horizontal background stripe spanning the canvas (e.g. a trophic level or elevation zone). */
 interface BiologyBand {
     label?: string;
-    /** Fill/stroke color (default cycles BIO_BAND_COLORS by index). */
+    /** Fill/stroke color: a tone name, token or literal (default cycles `series-1`..`series-8` by index). */
     color?: string;
 }
 type BiologyStageState = 'pending' | 'active' | 'done';
@@ -6938,7 +6971,7 @@ interface BiologyStage {
     label: string;
     /** Progress state driving fill/text color (default 'pending'). */
     state?: BiologyStageState;
-    /** Overrides the state-derived fill color. */
+    /** Overrides the state-derived fill: a tone name, token or literal. */
     color?: string;
 }
 /** One base pair (rung) of a `helix` ladder. */
@@ -6947,7 +6980,7 @@ interface BiologyHelixRung {
     a?: string;
     /** Base letter on strand B (bottom). */
     b?: string;
-    /** 'new' renders the rung in the newly-synthesized color (default '#16a34a'); 'open'/'paired' drive strand separation. */
+    /** 'new' renders the rung in the newly-synthesized color (default `accent`); 'open'/'paired' drive strand separation. */
     state?: 'paired' | 'open' | 'new';
     /** Overrides the state-derived rung color. */
     color?: string;
@@ -6965,18 +6998,18 @@ interface BiologyHelix {
     rungs: BiologyHelixRung[];
     /** Unzipped fraction from the left, 0..1 (default 0 = fully paired). */
     fork?: number;
-    /** Strand A (top) color (default '#2563eb'). */
+    /** Strand A (top) color: a tone name, token or literal (default `series-1`). */
     colorA?: string;
-    /** Strand B (bottom) color (default '#dc2626'). */
+    /** Strand B (bottom) color: a tone name, token or literal (default `series-2`). */
     colorB?: string;
-    /** Default paired-rung color (default '#94a3b8'). */
+    /** Default paired-rung color: a tone name, token or literal (default `muted`). */
     rungColor?: string;
 }
 /** One base-pair rung of a 3D `helix3d` ladder. */
 interface BiologyHelixRung3D {
     /** Clickable when present — stamped on this rung's marker sphere. */
     id?: string;
-    /** Rung cylinder + marker color (default '#94a3b8'). */
+    /** Rung cylinder + marker color: a tone name, token or literal (default `muted`). */
     color?: string;
     /** Marker sphere radius override (e.g. selection enlargement). */
     radius?: number;
@@ -6999,9 +7032,9 @@ interface BiologyHelix3D {
     rise?: number;
     /** Twist per rung in degrees (default 36). */
     twistDeg?: number;
-    /** Strand A (top) color (default '#38bdf8'). */
+    /** Strand A (top) color: a tone name, token or literal (default `series-1`). */
     strandAColor?: string;
-    /** Strand B (bottom) color (default '#fb923c'). */
+    /** Strand B (bottom) color: a tone name, token or literal (default `series-2`). */
     strandBColor?: string;
     /** Backbone strand cylinder + bead radius (default 0.16). */
     backboneRadius?: number;
@@ -7022,6 +7055,12 @@ interface BiologyCanvasProps extends Omit<React$1.AriaAttributes, keyof A11yProp
     height?: number;
     title?: string;
     backgroundColor?: string;
+    /** Overrides the theme's categorical palette (`series-1…N`) for this canvas — real-world conventions like CPK atom colors or resistor bands. Unset, the theme's `--color-series-*` apply. */
+    series?: string[];
+    /** Maps a keydown `e.code` (optionally `Mod+`/`Shift+`/`Alt+` prefixed) to a SEMANTIC event emitted as `UI:{event}` — e.g. `{ Space: TOGGLE_RUN, ArrowRight: STEP, KeyR: RESET }`; keystrokes inside inputs never route. */
+    keyMap?: Record<string, EventKey>;
+    /** Maps a keyup `e.code` to a semantic event emitted as `UI:{event}`. */
+    keyUpMap?: Record<string, EventKey>;
     /** Painter: 2D raster (default) or 3D mesh scene via the lazy three.js host. */
     mode?: '2d' | '3d';
     /** 3D only: neutral camera pose ({ mode, zoom, fov, azimuth, target }). */
@@ -7097,6 +7136,7 @@ interface ChemistryAtom {
     z?: number;
     element?: string;
     radius?: number;
+    /** Atom color: a tone name, token or literal (default a `series-1`..`series-8` tone per distinct element, in order of first appearance). */
     color?: string;
     /** Ionic charge label (e.g. '2+', '-'), drawn top-right of the atom. 2D only. */
     charge?: string;
@@ -7107,6 +7147,7 @@ interface ChemistryBond {
     from: string;
     to: string;
     type?: 'single' | 'double' | 'triple';
+    /** Bond color: a tone name, token or literal (default by `state`). */
     color?: string;
     /** Reaction-state coloring (overridden by an explicit `color`). 2D only. */
     state?: ChemistryBondState;
@@ -7119,11 +7160,11 @@ interface ChemistryContainer {
     y: number;
     width: number;
     height: number;
-    /** Outline + label color (default '#64748b'). */
+    /** Outline color: a tone name, token or literal (default the `ink` tone). */
     color?: string;
     /** Fill color for the outline rect itself (independent of the liquid level fill). */
     fill?: string;
-    /** Outline stroke width (default 2). */
+    /** Outline stroke width in px (default the theme's normal stroke). */
     lineWidth?: number;
     /** Vertical divider at the container's mid-width (default 'none'). */
     divider?: 'none' | 'solid' | 'dashed' | 'dotted';
@@ -7137,7 +7178,7 @@ interface ChemistryContainer {
     label?: string;
     /** Liquid fill level, 0..1 from the bottom. */
     level?: number;
-    /** Liquid fill color (default '#60a5fa'). */
+    /** Liquid fill color: a tone name, token or literal (default the `series-1` tone). */
     levelColor?: string;
 }
 interface ChemistryArrow {
@@ -7145,6 +7186,7 @@ interface ChemistryArrow {
     y: number;
     angle?: number;
     length?: number;
+    /** Arrow color: a tone name, token or literal (default the `ink` tone). */
     color?: string;
     label?: string;
 }
@@ -7157,7 +7199,7 @@ interface ChemistryLatticeSite {
     dy: number;
     dz: number;
     element?: string;
-    /** Marker color (default '#2563eb'). */
+    /** Marker color: a tone name, token or literal (default a `series-1`..`series-8` tone by basis index). */
     color?: string;
     /** Marker radius (default 0.3). */
     radius?: number;
@@ -7178,7 +7220,7 @@ interface ChemistryLatticeBond {
     dx?: number;
     dy?: number;
     dz?: number;
-    /** Bond color (default '#6b7280'). */
+    /** Bond color: a tone name, token or literal (default the `ink` tone). */
     color?: string;
 }
 /**
@@ -7200,13 +7242,13 @@ interface ChemistryLattice3D {
     bondRadius?: number;
     /** Dim every generated site outside unit cell (0,0,0) with `dimColor`; bonds with a dimmed endpoint dim too. */
     highlightCell?: boolean;
-    /** Dim color for `highlightCell` (default '#475569'). */
+    /** Dim color for `highlightCell`: a tone name, token or literal (default the `muted` tone). */
     dimColor?: string;
     /** Billboard each site's `element` above its marker (default false). */
     showLabels?: boolean;
     /** Generated site id (`lat-{key}-{i}-{j}-{k}`, as delivered by onShapeClick) to enlarge and recolor as the selection. */
     selectedId?: string;
-    /** Selected-site color (default '#f59e0b'). */
+    /** Selected-site color: a tone name, token or literal (default the `highlight` tone). */
     selectedColor?: string;
 }
 interface ChemistryCanvasProps extends Omit<React$1.AriaAttributes, keyof A11yProps>, A11yProps {
@@ -7215,6 +7257,12 @@ interface ChemistryCanvasProps extends Omit<React$1.AriaAttributes, keyof A11yPr
     height?: number;
     title?: string;
     backgroundColor?: string;
+    /** Overrides the theme's categorical palette (`series-1…N`) for this canvas — real-world conventions like CPK atom colors or resistor bands. Unset, the theme's `--color-series-*` apply. */
+    series?: string[];
+    /** Maps a keydown `e.code` (optionally `Mod+`/`Shift+`/`Alt+` prefixed) to a SEMANTIC event emitted as `UI:{event}` — e.g. `{ Space: TOGGLE_RUN, ArrowRight: STEP, KeyR: RESET }`; keystrokes inside inputs never route. */
+    keyMap?: Record<string, EventKey>;
+    /** Maps a keyup `e.code` to a semantic event emitted as `UI:{event}`. */
+    keyUpMap?: Record<string, EventKey>;
     /** Painter: 2D raster (default) or 3D mesh scene via the lazy three.js host. */
     mode?: '2d' | '3d';
     /** 3D only: neutral camera pose ({ mode, zoom, fov, azimuth, target }). */
@@ -7238,7 +7286,7 @@ interface ChemistryCanvasProps extends Omit<React$1.AriaAttributes, keyof A11yPr
      * @synonyms reaction equation, formula
      */
     equation?: string;
-    /** Equation text color (default '#111827'). */
+    /** Equation text color: a tone name, token or literal (default the `ink` tone). */
     equationColor?: string;
     /** A 3D crystal lattice block (simple cubic, BCC, FCC, rock salt, diamond, ...). 3D only. */
     lattice3d?: ChemistryLattice3D;
@@ -7363,6 +7411,12 @@ interface AlgorithmCanvasProps extends Omit<React$1.AriaAttributes, keyof A11yPr
     height?: number;
     title?: string;
     backgroundColor?: string;
+    /** Overrides the theme's categorical palette (`series-1…N`) for this canvas — real-world conventions like CPK atom colors or resistor bands. Unset, the theme's `--color-series-*` apply. */
+    series?: string[];
+    /** Maps a keydown `e.code` (optionally `Mod+`/`Shift+`/`Alt+` prefixed) to a SEMANTIC event emitted as `UI:{event}` — e.g. `{ Space: TOGGLE_RUN, ArrowRight: STEP, KeyR: RESET }`; keystrokes inside inputs never route. */
+    keyMap?: Record<string, EventKey>;
+    /** Maps a keyup `e.code` to a semantic event emitted as `UI:{event}`. */
+    keyUpMap?: Record<string, EventKey>;
     /** Sorting/histogram bars; laid out left-to-right, height proportional to value. */
     bars?: AlgorithmBar[];
     /** Grid/array/DP cells; laid out on a row/col lattice sized to the extent. */
@@ -7451,6 +7505,12 @@ interface AlgoGraphCanvasProps extends Omit<React$1.AriaAttributes, keyof A11yPr
     height?: number;
     title?: string;
     backgroundColor?: string;
+    /** Overrides the theme's categorical palette (`series-1…N`) for this canvas — real-world conventions like CPK atom colors or resistor bands. Unset, the theme's `--color-series-*` apply. */
+    series?: string[];
+    /** Maps a keydown `e.code` (optionally `Mod+`/`Shift+`/`Alt+` prefixed) to a SEMANTIC event emitted as `UI:{event}` — e.g. `{ Space: TOGGLE_RUN, ArrowRight: STEP, KeyR: RESET }`; keystrokes inside inputs never route. */
+    keyMap?: Record<string, EventKey>;
+    /** Maps a keyup `e.code` to a semantic event emitted as `UI:{event}`. */
+    keyUpMap?: Record<string, EventKey>;
     nodes?: AlgoGraphNode[];
     edges?: AlgoGraphEdge[];
     /** Deterministic layout to compute node positions; `manual` passes through `x`/`y`. */
@@ -7511,6 +7571,8 @@ interface LearningScene3DProps extends A11yProps {
     height?: number;
     title?: string;
     backgroundColor?: string;
+    /** Overrides the theme's categorical palette (`series-1…N`) for this scene. */
+    series?: string[];
     /** Neutral drawable descriptors derived from the molecule's vocabulary. */
     drawables: DrawableNode[];
     /** Neutral camera pose; `mode` defaults to 'perspective' for learning scenes. */
@@ -7530,7 +7592,7 @@ interface LearningScene3DProps extends A11yProps {
     /** Fires with the `id` of a clicked descriptor (descriptors carry `id` via DrawableBase). */
     onItemClick?: (id: string) => void;
 }
-declare function LearningScene3D({ className, width, height, title, backgroundColor, drawables, camera, lighting, post, showGrid, shadows, interactive, isLoading, error, onItemClick, description, ...rest }: LearningScene3DProps): React$1.JSX.Element;
+declare function LearningScene3D({ className, width, height, title, backgroundColor, series, drawables, camera, lighting, post, showGrid, shadows, interactive, isLoading, error, onItemClick, description, ...rest }: LearningScene3DProps): React$1.JSX.Element;
 declare namespace LearningScene3D {
     var displayName: string;
 }
@@ -11107,10 +11169,13 @@ declare namespace AgentActivityFeed {
 }
 
 /**
- * AgentChatFeed — a chat region's view of an agent turn: the activities the
- * host's audience selected, rendered by `AgentActivityFeed`, with raw LLM
- * responses behind a "Raw LLM" switch (off by default, so the conversation
- * stays readable until they're wanted). The switch is remembered per host.
+ * AgentChatFeed — the in-app assistant's conversation (Almadar_UX §3.6).
+ * Messages are bubbles by sender with their time; each turn's tool and model
+ * steps fold under the reply behind one "Worked through N steps" disclosure
+ * (open while the assistant is still working on that turn); replies carry a
+ * copy action; days are separated; and the feed follows new messages only
+ * while the reader is at the bottom, otherwise it shows a "New messages" cue.
+ * Raw LLM responses stay behind a switch inside the steps, remembered per host.
  */
 
 interface AgentChatFeedProps {
@@ -11119,7 +11184,7 @@ interface AgentChatFeedProps {
     emptyTitle: string;
     /** localStorage key remembering the Raw LLM switch for this host. */
     rawLlmPreferenceKey: string;
-    /** Prefix for the toolbar test id and the switch's element id. */
+    /** Prefix for the scroller test id and the switch's element id. */
     idPrefix: string;
     /** The agent is running — the feed shows it is thinking. */
     working?: boolean;

package/dist/components/index.js

@@ -1,25 +1,25 @@
 export { assertUniqueSlotsPerHost } from '../chunk-O2EIWXWE.js';
-import { JsonTreeEditor } from '../chunk-FJDS4SVD.js';
-export { JsonTreeEditor } from '../chunk-FJDS4SVD.js';
+import { JsonTreeEditor } from '../chunk-F4ZTPKZL.js';
+export { JsonTreeEditor } from '../chunk-F4ZTPKZL.js';
 export { keyChord, mergeCaptureTables, useAgentChat, useCompile, useConnectGitHub, useDeepAgentGeneration, useDisconnectGitHub, useExtensions, useFileEditor, useFileSystem, useGitHubBranches, useGitHubRepo, useGitHubRepos, useGitHubStatus, useKeyboardRouter, useNavStack, usePreview, useRenderInterpolation, useTraitListens, useUIEvents, useValidation } from '../chunk-2LFBQ4IS.js';
-export { I18nProvider, SharedEntityStoreContext, createSharedEntityStore, createTranslate, runTickFrame, useFormatContext, useRenderI18n, useSharedEntitySnapshot, useSharedEntityStore, useSharedEntityStoreContext, useTranslate } from '../chunk-4HC5HRHB.js';
+export { I18nProvider, SharedEntityStoreContext, createSharedEntityStore, createTranslate, runTickFrame, useFormatContext, useRenderI18n, useSharedEntitySnapshot, useSharedEntityStore, useSharedEntityStoreContext, useTranslate } from '../chunk-QGH4NAQO.js';
 export { DEFAULT_SLOTS, useUISlotManager } from '../chunk-VHTJRS2N.js';
-export { parseLessonSegments } from '../chunk-OKWD7LPO.js';
-import { GridPicker, Icon, Button, FormSection, Select, ThemedPortal, Switch, Input } from '../chunk-U2FGMHQP.js';
-export { ALL_PRESETS, Accordion, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, AgentActivityFeed, AgentActivityRow, AgentChatFeed, AgentThinkingRow, Alert, AlgoGraphCanvas, AlgorithmCanvas, AnimatedCounter, AnimatedGraphic, AnimatedReveal, Aside, AtlasImage, AtlasPanel, AuthLayout, Avatar, Badge, BehaviorView, BiologyCanvas, BloomQuizBlock, BranchingLogicBuilder, Breadcrumb, Button, ButtonGroup, COMPACT_MEDIA_QUERY, CalendarGrid, Canvas, Canvas2D, Card, CardBody, CardContent, CardFooter, CardHeader, CardTitle, Carousel, Center, ChangeList, Chart, ChartLegend, ChatBar, Checkbox, ChemistryCanvas, ChoiceButton, CodeBlock, CodeRunnerPanel, CollapsibleSection, CommandPalette, CommitRow, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTION_KEYS, DEFAULT_MATRIX_COLUMN_KEYS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DateRangePicker, DateRangeSelector, DayCell, DetailPanel, Dialog, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DockLayout, DocumentDetails, DocumentPanel, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ELEMENT_SELECTED_EVENT, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmojiPicker, EmptyState, ErrorBoundary, ErrorState, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureGrid, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, FloatingToolbar, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, FxOverlay, GameAudioContext, GameAudioCue, GameAudioProvider, GameAudioToggle, GameHud, GameIcon, GameMenu, GameShell, Gantt, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, Header, HealthBar, Icon, IconButton, Image, ImportPreviewTree, ImportProgress, ImportSourcePicker, InfiniteScrollSentinel, Input, InputGroup, JazariStateMachine, Label, LawReferenceTooltip, LearningCanvas, LearningScene3D, Lightbox, LikertScale, LineChart, LoadingState, MapView, MarkdownContent, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, ModuleCard, Navigation, NumberStepper, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, PageTransition, Pagination, PatternTile, PhysicsCanvas, Popover, PositionedCanvas, ProgressBar, ProgressDots, PullToRefresh, QrScanner, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, RichTextEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SkeletonTree, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, StatusBar, StatusDot, SubagentTracePanel, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagInput, TerrainPalette, TextHighlight, Textarea, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TopNavItem, TraitFrame, TraitSlot, TraitStateViewer, TrendIndicator, TypewriterText, UISlotComponent, UISlotRenderer, UploadDropZone, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, activityRowFacts, applyCompletion, applySuggestions, arrowBetween, billboardLabel, boardEntity, bool, calculateAttackTargets, calculateValidMoves, createInitialGameState, createUnitAnimationState, cylinderBetween, dispatchCommandPaletteCommand, get3DClickPayload, getCurrentFrame, getTileDimensions, groupIntoConversations, inferDirection, isoToScreen, makeAsset, makeAssetMap, meshSphere, num, objAvailableActions, objAvailableEvents, objCurrentState, objIcon, objId, objMaxRules, objName, objRules, objStates, parseEditFocus, pendulum, projectileMotion, registerCodeLanguageLoader, renderPatternValue, resolveFrame, resolveSheetDirection, rows, sanitizeRichHtml, screenToIso, springOscillator, str, tickAnimationState, toCodeLanguage, transitionAnimation, unitHealth, unitPosition, unitTeam, useAtlasSliceDataUrl, useCamera, useCompactLayout, useDockLayout, useGameAudio, useGameAudioContext, useImageCache, useUnitSpriteAtlas, vec2 } from '../chunk-U2FGMHQP.js';
-import { VStack, HStack, Box } from '../chunk-Z5IYJU44.js';
-export { Box, HStack, Stack, VStack } from '../chunk-Z5IYJU44.js';
-import { Typography } from '../chunk-4UP6BZ4R.js';
-export { Typography } from '../chunk-4UP6BZ4R.js';
+import { GridPicker, Icon, Button, FormSection, Select, ThemedPortal, Switch, Input } from '../chunk-XZKGRSIO.js';
+export { ALL_PRESETS, Accordion, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, AgentActivityFeed, AgentActivityRow, AgentChatFeed, AgentThinkingRow, Alert, AlgoGraphCanvas, AlgorithmCanvas, AnimatedCounter, AnimatedGraphic, AnimatedReveal, Aside, AtlasImage, AtlasPanel, AuthLayout, Avatar, Badge, BehaviorView, BiologyCanvas, BloomQuizBlock, BranchingLogicBuilder, Breadcrumb, Button, ButtonGroup, COMPACT_MEDIA_QUERY, CalendarGrid, Canvas, Canvas2D, Card, CardBody, CardContent, CardFooter, CardHeader, CardTitle, Carousel, Center, ChangeList, Chart, ChartLegend, ChatBar, Checkbox, ChemistryCanvas, ChoiceButton, CodeBlock, CodeRunnerPanel, CollapsibleSection, CommandPalette, CommitRow, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTION_KEYS, DEFAULT_MATRIX_COLUMN_KEYS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DateRangePicker, DateRangeSelector, DayCell, DetailPanel, Dialog, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DockLayout, DocumentDetails, DocumentPanel, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ELEMENT_SELECTED_EVENT, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmojiPicker, EmptyState, ErrorBoundary, ErrorState, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureGrid, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, FloatingToolbar, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, FxOverlay, GameAudioContext, GameAudioCue, GameAudioProvider, GameAudioToggle, GameHud, GameIcon, GameMenu, GameShell, Gantt, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, Header, HealthBar, Icon, IconButton, Image, ImportPreviewTree, ImportProgress, ImportSourcePicker, InfiniteScrollSentinel, Input, InputGroup, JazariStateMachine, Label, LawReferenceTooltip, LearningCanvas, LearningScene3D, Lightbox, LikertScale, LineChart, LoadingState, MapView, MarkdownContent, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, ModuleCard, Navigation, NumberStepper, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, PageTransition, Pagination, PatternTile, PhysicsCanvas, Popover, PositionedCanvas, ProgressBar, ProgressDots, PullToRefresh, QrScanner, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, RichTextEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SkeletonTree, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, StatusBar, StatusDot, SubagentTracePanel, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagInput, TerrainPalette, TextHighlight, Textarea, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TopNavItem, TraitFrame, TraitSlot, TraitStateViewer, TrendIndicator, TypewriterText, UISlotComponent, UISlotRenderer, UploadDropZone, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, activityRowFacts, applyCompletion, applySuggestions, arrowBetween, billboardLabel, boardEntity, bool, calculateAttackTargets, calculateValidMoves, createInitialGameState, createUnitAnimationState, cylinderBetween, dispatchCommandPaletteCommand, get3DClickPayload, getCurrentFrame, getTileDimensions, groupIntoConversations, inferDirection, isoToScreen, makeAsset, makeAssetMap, meshSphere, num, objAvailableActions, objAvailableEvents, objCurrentState, objIcon, objId, objMaxRules, objName, objRules, objStates, parseEditFocus, pendulum, projectileMotion, registerCodeLanguageLoader, renderPatternValue, resolveFrame, resolveSheetDirection, rows, sanitizeRichHtml, screenToIso, springOscillator, str, tickAnimationState, toCodeLanguage, transitionAnimation, unitHealth, unitPosition, unitTeam, useAtlasSliceDataUrl, useCamera, useCompactLayout, useDockLayout, useGameAudio, useGameAudioContext, useImageCache, useUnitSpriteAtlas, vec2 } from '../chunk-XZKGRSIO.js';
+import { VStack, HStack, Box } from '../chunk-Y53Q55H5.js';
+export { Box, HStack, Stack, VStack } from '../chunk-Y53Q55H5.js';
+import { Typography } from '../chunk-HCSJHRC4.js';
+export { Typography } from '../chunk-HCSJHRC4.js';
 export { ALMADAR_DND_MIME, parseQueryBinding, useAuthContext, useCanvasGestures, useDragReorder, useDraggable, useDropZone, useInfiniteScroll, useLongPress, useMediaQuery, usePrefersReducedMotion, usePullToRefresh, useQuerySingleton, useSwipeGesture } from '../chunk-JRW33U35.js';
 export { useTapReveal } from '../chunk-XJTHMW4G.js';
 export { useEmitEvent, useEventBus, useEventListener } from '../chunk-6EV3OEBQ.js';
+export { parseLessonSegments } from '../chunk-OKWD7LPO.js';
 export { Presence, parseMarkdownWithCodeBlocks, usePresence } from '../chunk-KQXXO42S.js';
-import '../chunk-O7OLVVBR.js';
+import '../chunk-Q47ZN2DW.js';
 import { cn, domPassthrough } from '../chunk-64WACXM7.js';
 export { cn } from '../chunk-64WACXM7.js';
-import '../chunk-MCKFWPT2.js';
-import '../chunk-N2V4LHFQ.js';
+import '../chunk-RNY5LJXJ.js';
+import '../chunk-HRCR53OW.js';
 import { getKnownPatterns, getPatternDefinition } from '../chunk-PQKU62LK.js';
 import '../chunk-PEST66PN.js';
 import '../chunk-QPXIAUJD.js';

package/dist/context/index.cjs

@@ -910,7 +910,38 @@ var SURFACE_VARS = [
   { cssVar: "--surface-backdrop", key: "backdrop" },
   { cssVar: "--surface-card-image", key: "cardImage" },
   { cssVar: "--surface-page-image", key: "pageImage" },
-  { cssVar: "--surface-page-image-size", key: "pageImageSize" }
+  { cssVar: "--surface-page-image-size", key: "pageImageSize" },
+  { cssVar: "--surface-diagram", key: "diagram" }
+];
+var DIAGRAM_VARS = [
+  { cssVar: "--diagram-stroke-thin", key: "strokeThin" },
+  { cssVar: "--diagram-stroke-normal", key: "strokeNormal" },
+  { cssVar: "--diagram-stroke-bold", key: "strokeBold" },
+  { cssVar: "--diagram-line-cap", key: "lineCap" },
+  { cssVar: "--diagram-line-join", key: "lineJoin" },
+  { cssVar: "--diagram-dash", key: "dash" },
+  { cssVar: "--diagram-dot", key: "dot" },
+  { cssVar: "--diagram-fill-style", key: "fillStyle" },
+  { cssVar: "--diagram-fill-opacity", key: "fillOpacity" },
+  { cssVar: "--diagram-roughness", key: "roughness" },
+  { cssVar: "--diagram-glow", key: "glow" },
+  { cssVar: "--diagram-shadow", key: "shadow" },
+  { cssVar: "--diagram-marker", key: "marker" },
+  { cssVar: "--diagram-label-font", key: "labelFont" },
+  { cssVar: "--diagram-label-size", key: "labelSize" },
+  { cssVar: "--diagram-label-weight", key: "labelWeight" },
+  { cssVar: "--diagram-label-case", key: "labelCase" },
+  { cssVar: "--diagram-corner", key: "corner" }
+];
+var SCENE_VARS = [
+  { cssVar: "--material-roughness", key: "materialRoughness" },
+  { cssVar: "--material-metalness", key: "materialMetalness" },
+  { cssVar: "--material-flat", key: "materialFlat" },
+  { cssVar: "--material-outline", key: "materialOutline" },
+  { cssVar: "--light-ambient", key: "lightAmbient" },
+  { cssVar: "--light-key", key: "lightKey" },
+  { cssVar: "--light-key-color", key: "lightKeyColor" },
+  { cssVar: "--scene-fog", key: "fog" }
 ];
 var LEGACY_PREFIXES = {
   colors: "--color-",
@@ -971,6 +1002,10 @@ function themeTokensToCssVars(tokens, mode = "light", darkVariant) {
   emitGeometry(pickGeometry, vars);
   const pickSurface = isDark && darkVariant?.surface ? darkVariant.surface : tokens.surface;
   applyFlat(pickSurface, SURFACE_VARS, vars);
+  const pickDiagram = isDark && darkVariant?.diagram ? darkVariant.diagram : tokens.diagram;
+  applyFlat(pickDiagram, DIAGRAM_VARS, vars);
+  const pickScene = isDark && darkVariant?.scene ? darkVariant.scene : tokens.scene;
+  applyFlat(pickScene, SCENE_VARS, vars);
   return vars;
 }
 function emitDensity(density, vars) {

package/dist/context/index.d.ts

@@ -1,7 +1,7 @@
 export { U as UISlotContext, a as UISlotProvider, u as useSlotContent, b as useSlotHasContent, c as useUISlots } from '../UISlotContext-CS487Uoc.js';
 import { U as UIThemeDefinition } from '../ArbitraryClassCompiler-DvzdeHxc.js';
 export { A as ARBITRARY_CLASS_STYLE_ID, a as ArbitraryClassCompiler, b as ArbitraryClassCompilerProvider, c as ArbitraryClassCompilerProviderProps, C as ColorMode, d as CurrentPagePathContext, e as CurrentPagePathProvider, f as CurrentPagePathProviderProps, D as DesignTheme, g as DesignThemeProvider, O as OrbitalThemeProvider, h as OrbitalThemeProviderProps, R as ResolvedMode, T as ThemeContext, i as ThemeProvider, j as ThemeProviderProps, k as ThemeScope, l as ThemeScopeContext, u as useArbitraryClassStyles, m as useCurrentPagePath, n as useDesignTheme, o as useTheme, p as useThemeScope } from '../ArbitraryClassCompiler-DvzdeHxc.js';
-export { T as ThemeMode, r as resolveThemeForRuntime, t as themeTokensToCssVars } from '../themeTokens-Ccu7EmGY.js';
+export { T as ThemeMode, r as resolveThemeForRuntime, t as themeTokensToCssVars } from '../themeTokens-D6MFwKrC.js';
 export { U as UserContext, a as UserContextValue, b as UserData, c as UserProvider, d as UserProviderProps, u as useHasPermission, e as useHasRole, f as useUser, g as useUserForEvaluation } from '../UserContext-D566nfWA.js';
 export { ANONYMOUS_USER, UISlot } from '@almadar/core';
 export { S as SlotChangeCallback, a as SlotContent, b as SlotRenderConfig, U as UISlotManager } from '../useUISlots-1dk2TR4j.js';