@selvajs/ui 6.0.0-beta.8 → 6.1.0

package/dist/index.js

@@ -1,34 +1,28 @@
-// Layout components (page chrome: shell, header, footer, nav)
+// The in-monorepo barrel: everything public.ts publishes, plus the design system,
+// page chrome, contexts and utils that never ship to npm. Reached via the
+// "selva-source" export condition.
 export * from './components/layout';
-// Compute app (schema + viewer + solve controls composed into a runnable app)
 export { default as AppLayout } from './components/compute/AppLayout.svelte';
 export { default as ComputeApp } from './components/compute/ComputeApp.svelte';
-// Error screen
 export { default as ErrorScreen } from './components/ErrorScreen.svelte';
 // Design-system primitives (shadcn-svelte + custom)
 export * from './components/primitives';
 export { default as StateDisplay } from './components/primitives/StateDisplay.svelte';
-// 3D viewer
 export { default as Viewer } from './components/viewer/Viewer.svelte';
-// Utilities
 export * from './schema/defaults';
 export * from './schema/dynamic-value-list';
 export * from './schema/traversal';
 export * from './compute/solving.svelte';
-// Solve Session seam. The session itself now lives in `@selvajs/solve/client`
-// (framework-free); `useSolveSession` is this package's Svelte binding, which republishes
-// the session's subscribe() notifications as rune state so its getters read reactively in
-// markup. Re-exported so transports outside this package — e.g. plugin-ui's WebSocket
-// driver — can satisfy SolveDriver and drive a session. See CONTEXT.md.
+// Solve Session seam. Re-exported so transports outside this package — e.g.
+// plugin-ui's WebSocket driver — can satisfy SolveDriver and drive a session.
+// See CONTEXT.md.
 export { useSolveSession } from './compute/useSolveSession.svelte';
 export { createSolveSession, createRequestResponseDriver } from '@selvajs/solve/client';
-// External-input transit storage (used by routes that wire pre-step producers)
+// Pre-step producer transit storage
 export { writeExternalValue, readExternalValue, clearExternalValue, getExternalInputs } from '@selvajs/solve/client';
-// Contexts & Composables
 export * from './contexts/footerContext.svelte';
 export * from './contexts/clientSlotContext.svelte';
 export * from './composables/useFooterItem.svelte';
-// Utils (cn function)
 export * from './utils';
 export { randomId } from './utils/randomId';
 export { DEFAULT_PRESET_LABELS } from './types/presetLabels';

package/dist/public.js

@@ -1,46 +1,30 @@
-// ============================================================================
-// Published public API of @selvajs/ui
-// ============================================================================
+// The only surface npm consumers of @selvajs/ui see. package.json maps the "."
+// export's `svelte`/`types` conditions at this file's build output.
 //
-// This is the ONLY surface npm consumers of @selvajs/ui see (package.json maps
-// the "." export's `svelte`/`types` conditions at this file's build output).
-//
-// Scope: the compute-app SDK — everything an external host app needs to embed a
-// Grasshopper-driven app (ComputeApp), drive solves, and wire pre-step
-// producers. Verified against real external host apps: they import
-// ComputeApp + its types, the solve seam, and the external-input storage
-// helpers. Nothing else.
-//
-// Deliberately NOT public: design-system primitives (Button, Card, Dialog, …),
-// page-chrome layout (AppShell, SideNav, …), toast/Toaster, ThemeSwitcher,
-// DataTable, contexts/composables, cn/randomId. These remain importable from
-// the full barrel (./index.ts) INSIDE the monorepo via the "@selvajs/source"
-// export condition, but never ship to npm. If an external consumer ever needs a
-// primitive directly, promote it here explicitly rather than re-exporting the
-// whole primitives barrel.
-// Compute app (schema + viewer + solve controls composed into a runnable app)
+// Design-system primitives, page chrome, toasts, DataTable, contexts and small
+// utils stay out on purpose: they remain importable from ./index.ts inside the
+// monorepo via the "selva-source" export condition, but never ship to npm.
+// Promote a symbol here explicitly rather than re-exporting a whole barrel.
+// Compute app: schema + viewer + solve controls composed into a runnable app.
 export { default as AppLayout } from './components/compute/AppLayout.svelte';
 export { default as ComputeApp } from './components/compute/ComputeApp.svelte';
-// Standalone 3D viewer. Render Grasshopper meshes on their own, outside a
-// ComputeApp host — external apps drive it directly with a `meshes` array and
-// an optional `viewerConfig`. Pass `lang` to localize its chrome, or provide a
-// locale context (setLocaleContext) at the host root to drive it app-wide.
+// Standalone 3D viewer: renders Grasshopper meshes outside a ComputeApp host,
+// driven directly with a `meshes` array and an optional `viewerConfig`.
 export { default as Viewer } from './components/viewer/Viewer.svelte';
 export { appSource, isHostOwned, isOwnedBy, pointerToNdc } from '@selvajs/visualization/render';
 export { VIEWER_MESSAGES, DEFAULT_LOCALE, messagesFor } from './i18n/messages';
 export { setLocaleContext, getLocaleContext } from './i18n/localeContext.svelte';
-// Full-screen states a host app renders
+// Full-screen states a host app renders.
 export { default as ErrorScreen } from './components/ErrorScreen.svelte';
-// Solve Session seam (transport-agnostic value/lifecycle state machine + its
-// driver interface). The session lives in `@selvajs/solve/client` and is
+// Solve Session seam, for hosts driving a session themselves rather than
+// embedding <ComputeApp>. The session lives in `@selvajs/solve/client` and is
 // framework-free; `useSolveSession` is the Svelte binding that makes its getters
-// read reactively inside components. A host embedding <ComputeApp> needs neither —
-// both are re-exported for hosts driving a session themselves. See CONTEXT.md.
+// read reactively inside components. See CONTEXT.md.
 export { useSolveSession } from './compute/useSolveSession.svelte';
 export { createSolveSession, createRequestResponseDriver } from '@selvajs/solve/client';
 // Pre-step producer transit storage (host apps wire producers via these).
 export { writeExternalValue, readExternalValue, clearExternalValue, getExternalInputs } from '@selvajs/solve/client';
-// Schema utilities a ComputeApp host reasonably needs to read/shape values.
+// Schema utilities a ComputeApp host needs to read/shape values.
 export * from './schema/defaults';
 export * from './schema/traversal';
 export * from './schema/dynamic-value-list';

package/dist/schema/defaults.js

@@ -1,4 +1,3 @@
-// Moved to @selvajs/schemas so server-side callers can share it without pulling
-// in the UI package. Re-exported here to keep existing `@selvajs/ui` importers
-// working.
+// Moved to @selvajs/schemas so server-side callers can share it without pulling in the
+// UI package. Re-exported to keep existing @selvajs/ui importers working.
 export { getDefaultValue } from '@selvajs/schemas';

package/dist/schema/dynamic-value-list.js

@@ -27,12 +27,11 @@ function coercePayload(value) {
     return null;
 }
 // Memoizes string-payload coercion. In compute mode the payload arrives as a JSON
-// string — potentially several MB for a large options list — and the options map is
-// derived from `values` (TabLayout), so it recomputes on EVERY value change. Without
-// memoization each keystroke/output-merge re-parses megabytes and allocates a fresh
-// options object, whose new identity re-renders the entire dropdown subtree; with a
-// 6.4 MB payload this was measured driving a tab out of memory. Map keys use
-// SameValueZero, so an identical response string from a later solve also hits.
+// string — several MB for a large options list — and the options map is derived from
+// `values` (TabLayout), so it recomputes on EVERY value change. Unmemoized, each
+// keystroke re-parses megabytes and allocates a fresh options object whose new
+// identity re-renders the whole dropdown subtree; a 6.4 MB payload drove a tab OOM.
+// Map keys use SameValueZero, so an identical string from a later solve also hits.
 const coerceCache = new Map();
 const COERCE_CACHE_MAX = 8;
 function coercePayloadMemo(value) {
@@ -48,10 +47,9 @@ function coercePayloadMemo(value) {
     }
     const parseStart = performance.now();
     const parsed = coercePayload(value);
-    // Diagnostic: an expensive parse should happen ONCE per distinct solve result.
-    // If this line storms in the console, payload memoization is being defeated
-    // (e.g. payload strings differing per recompute) — the pre-memoization churn
-    // pattern that could OOM a tab.
+    // An expensive parse should happen ONCE per distinct solve result. If this line
+    // storms the console, memoization is being defeated (payload strings differing
+    // per recompute) — the churn pattern that could OOM a tab.
     if (value.length > 256 * 1024) {
         const optionCount = parsed?.options ? Object.keys(parsed.options).length : 0;
         console.info(`[DVL] parsed ${(value.length / (1024 * 1024)).toFixed(1)} MB options payload ` +
@@ -68,11 +66,11 @@ function coercePayloadMemo(value) {
 /**
  * Every dynamicValueList output reference in the schema.
  *
- * Canonical location is `schema.outputs[]` — the plugin's SchemaSynchronizer enforces that every
- * dynamicValueList layout item is mirrored there (see CanonicalizeDynamicValueListOutputs). We ALSO
- * scan the layout purely as back-compat defense for schemas persisted by an older plugin that lacked
- * that invariant; for current schemas the layout pass finds nothing new.
- * Deduped by id, outputs[] winning so the canonical record's targetInputId takes precedence.
+ * Canonical location is `schema.outputs[]` — the plugin's SchemaSynchronizer mirrors every
+ * dynamicValueList layout item there (`CanonicalizeDynamicValueListOutputs`). The layout scan is
+ * back-compat defense for schemas persisted by an older plugin that lacked that invariant; on
+ * current schemas it finds nothing new. Deduped by id, `outputs[]` winning so the canonical
+ * record's targetInputId takes precedence.
  */
 function collectDynamicValueListSources(schema) {
     const byId = new Map();

package/dist/schema/param-exporter.d.ts

@@ -11,29 +11,22 @@ export declare function validateSavedState(savedState: ParameterPreset, currentS
     canLoad: boolean;
 };
 /**
- * The subset of a preset's parameters that can safely be applied to the current schema:
- * every param that still exists as an input. A param that no longer exists is dropped
- * (it's the same condition `validateSavedState` flags as an error), so this derives its
- * own "loadable" rule from the schema rather than re-reading validation issues — no
- * coupling to how sentinel ids are encoded.
+ * Params the current schema no longer has are dropped. That's the same condition
+ * `validateSavedState` flags as an error, but the rule is re-derived from the schema here
+ * rather than read back off the issue list — nothing couples to how sentinel ids are encoded.
  */
 export declare function extractLoadableValues(savedState: ParameterPreset, currentSchema: UISchema): Record<string, unknown>;
-/** The full outcome of loading a preset: what to apply, plus the diagnostics to surface. */
 export interface PresetLoadResult {
-    /** Values safe to apply now (params that still exist). */
+    /** Safe to apply now — the params that still exist in the schema. */
     values: Record<string, unknown>;
-    /** All validation issues (errors + warnings) for the load dialog. */
+    /** Errors and warnings both, for the load dialog. */
     issues: ValidationIssueMessage[];
     /** No issues at all — load silently. */
     isValid: boolean;
-    /** No blocking errors — load is allowed (warnings are fine). */
+    /** No errors — warnings alone still allow the load. */
     canLoad: boolean;
 }
-/**
- * Single entry point for applying a preset: validates against the current schema and, in
- * the same pass, computes the loadable values. Callers get one object instead of
- * threading a validation result back into a separate extraction step.
- */
+/** Validates and computes the loadable values in one pass, so callers thread one object. */
 export declare function loadPreset(savedState: ParameterPreset, currentSchema: UISchema): PresetLoadResult;
 export declare function exportStateAsJson(savedState: ParameterPreset): void;
 export declare function importStateFromJson(file: File): Promise<ParameterPreset>;

package/dist/schema/param-exporter.js

@@ -75,11 +75,9 @@ export function validateSavedState(savedState, currentSchema) {
     return { isValid: issues.length === 0, issues, canLoad: !hasErrors };
 }
 /**
- * The subset of a preset's parameters that can safely be applied to the current schema:
- * every param that still exists as an input. A param that no longer exists is dropped
- * (it's the same condition `validateSavedState` flags as an error), so this derives its
- * own "loadable" rule from the schema rather than re-reading validation issues — no
- * coupling to how sentinel ids are encoded.
+ * Params the current schema no longer has are dropped. That's the same condition
+ * `validateSavedState` flags as an error, but the rule is re-derived from the schema here
+ * rather than read back off the issue list — nothing couples to how sentinel ids are encoded.
  */
 export function extractLoadableValues(savedState, currentSchema) {
     const values = {};
@@ -91,11 +89,7 @@ export function extractLoadableValues(savedState, currentSchema) {
     }
     return values;
 }
-/**
- * Single entry point for applying a preset: validates against the current schema and, in
- * the same pass, computes the loadable values. Callers get one object instead of
- * threading a validation result back into a separate extraction step.
- */
+/** Validates and computes the loadable values in one pass, so callers thread one object. */
 export function loadPreset(savedState, currentSchema) {
     const validation = validateSavedState(savedState, currentSchema);
     return {
@@ -111,8 +105,8 @@ export function exportStateAsJson(savedState) {
     const date = savedState.timestamp.split('T')[0].replace(/-/g, '_');
     const link = document.createElement('a');
     link.href = URL.createObjectURL(blob);
-    // .slvp = Selva parameter preset. Import accepts legacy .sps files too — the content is
-    // identical JSON, only the writer's extension changed.
+    // .slvp = Selva parameter preset. Import still accepts the pre-rename .sps — same JSON,
+    // only the writer's extension changed.
     link.download = `${safeName}_${date}.slvp`;
     link.click();
     URL.revokeObjectURL(link.href);

package/dist/schema/traversal.js

@@ -1,5 +1,4 @@
-// Schema layout traversal now lives in @selvajs/schemas (next to the types it walks) so
-// any package depending on the schema can traverse it without pulling in @selvajs/ui.
-// Re-exported here to keep it part of @selvajs/ui's published surface for existing
-// consumers.
+// Moved to @selvajs/schemas, next to the types it walks, so any package depending on the
+// schema can traverse it without pulling in @selvajs/ui. Re-exported to keep existing
+// @selvajs/ui importers working.
 export { getGroups, getLayoutItems, getInputItems } from '@selvajs/schemas';

package/dist/schema/visibility-rules.d.ts

@@ -7,16 +7,12 @@ export interface VisibilityResult {
 export declare function evaluateRule(rule: VisibilityRule, values: Record<string, unknown>): boolean;
 export declare function evaluateCondition(condition: VisibilityCondition | GroupVisibilityCondition, values: Record<string, unknown>): boolean;
 export declare function evaluateVisibility(item: LayoutItem, values: Record<string, unknown>): VisibilityResult;
-/**
- * Stable key for a layout item: `paramId` for inputs/outputs, `id` for linebreaks.
- * Mirrors the key the renderers use in their `{#each}` blocks.
- */
+/** Must stay identical to the key the renderers use in their `{#each}` blocks. */
 export declare function itemKey(item: LayoutItem): string;
 /**
- * Evaluates every item's visibility once against the current values, keyed by itemKey.
- * Callers that touch the same items more than once per render (column layout + cell
- * render, plus the default-value sweep) read from this single map instead of
- * re-evaluating per access — one source of truth for "what's visible right now".
+ * Evaluates each item once per render. Callers that touch the same item several times
+ * (column layout, then cell render, then the default-value sweep) read this map instead of
+ * re-evaluating, so they can't disagree about what's visible mid-render.
  */
 export declare function buildVisibilityMap(items: LayoutItem[], values: Record<string, unknown>): Record<string, VisibilityResult>;
 export declare function evaluateGroupVisibility(group: {

package/dist/schema/visibility-rules.js

@@ -57,18 +57,14 @@ export function evaluateVisibility(item, values) {
     const actionFn = ACTIONS[action] ?? ACTIONS.show;
     return actionFn(met, defaultValue);
 }
-/**
- * Stable key for a layout item: `paramId` for inputs/outputs, `id` for linebreaks.
- * Mirrors the key the renderers use in their `{#each}` blocks.
- */
+/** Must stay identical to the key the renderers use in their `{#each}` blocks. */
 export function itemKey(item) {
     return item.type === 'linebreak' ? item.id : item.paramId;
 }
 /**
- * Evaluates every item's visibility once against the current values, keyed by itemKey.
- * Callers that touch the same items more than once per render (column layout + cell
- * render, plus the default-value sweep) read from this single map instead of
- * re-evaluating per access — one source of truth for "what's visible right now".
+ * Evaluates each item once per render. Callers that touch the same item several times
+ * (column layout, then cell render, then the default-value sweep) read this map instead of
+ * re-evaluating, so they can't disagree about what's visible mid-render.
  */
 export function buildVisibilityMap(items, values) {
     const map = {};

package/dist/types/actionButton.d.ts

@@ -1,31 +1,7 @@
-/**
- * Defines an action button for use in the UI.
- *
- * @example
- * ```typescript
- * const saveButton: ActionButton = {
- *   id: 'save-btn',
- *   label: 'Save Changes',
- *   icon: SaveIcon,
- *   variant: 'default',
- *   size: 'lg',
- *   onclick: async () => {
- *     await saveData();
- *     showNotification('Saved!');
- *   }
- * };
- * ```
- *
- * @property id - Unique identifier for this button
- * @property label - Display text shown on the button
- * @property icon - Optional icon component to display alongside the label
- * @property variant - Button styling variant (controls color/appearance)
- * @property size - Button size preset
- * @property onclick - Callback function executed when clicked; can be async
- */
 export interface ActionButton {
     id: string;
     label: string;
+    /** A Svelte component, rendered before the label. */
     icon?: any;
     variant?: 'default' | 'outline' | 'destructive' | 'secondary' | 'ghost';
     size?: 'default' | 'sm' | 'lg';

package/dist/types/presetLabels.d.ts

@@ -1,7 +1,6 @@
 /**
- * Overridable UI strings for the parameter-preset manager (Save/Load flow) and
- * footer copyright text. All optional — unset keys fall back to the English
- * defaults in `DEFAULT_PRESET_LABELS`. Pass a partial object to localize.
+ * Overridable UI strings for the parameter-preset manager. Pass a partial object to localize;
+ * unset keys fall back to `DEFAULT_PRESET_LABELS`.
  */
 export interface PresetLabels {
     saveButton: string;

package/dist/utils/color.js

@@ -1,38 +1,35 @@
-// Helper to convert hex to OKLCH
+// Hex → OKLCH. A non-null input that isn't a 6-digit hex comes back unchanged, so
+// callers can pass through CSS colors this function doesn't understand; null gives ''.
 export const hexToOklch = (hex) => {
     if (!hex)
         return '';
-    // Normalize hex (remove # if present)
     const normalized = hex.replace(/^#/, '');
-    // If it's not a valid hex color, return as-is
     if (!/^[0-9A-Fa-f]{6}$/.test(normalized)) {
         return hex;
     }
-    // Parse hex to RGB
     const r = parseInt(normalized.slice(0, 2), 16) / 255;
     const g = parseInt(normalized.slice(2, 4), 16) / 255;
     const b = parseInt(normalized.slice(4, 6), 16) / 255;
-    // Convert RGB to linear RGB
+    // sRGB transfer function, inverted: gamma-encoded channel → linear light.
     const toLinear = (c) => (c <= 0.04045 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4));
     const lr = toLinear(r);
     const lg = toLinear(g);
     const lb = toLinear(b);
-    // Convert linear RGB to XYZ
+    // Linear sRGB → CIE XYZ (D65 white point).
     const x = lr * 0.4124564 + lg * 0.3575761 + lb * 0.1804375;
     const y = lr * 0.2126729 + lg * 0.7151522 + lb * 0.072175;
     const z = lr * 0.0193339 + lg * 0.119192 + lb * 0.9503041;
-    // Convert XYZ to OKLab
+    // XYZ → OKLab: the M1 cone-response matrix, cube root, then the M2 matrix.
     const l_ = Math.cbrt(0.8189330101 * x + 0.3618667424 * y - 0.1288597137 * z);
     const m_ = Math.cbrt(0.0329845436 * x + 0.9293118715 * y + 0.0361456387 * z);
     const s_ = Math.cbrt(0.0482003018 * x + 0.2643662691 * y + 0.633851707 * z);
     const L = 0.2104542553 * l_ + 0.793617785 * m_ - 0.0040720468 * s_;
     const a = 1.9779984951 * l_ - 2.428592205 * m_ + 0.4505937099 * s_;
     const b_lab = 0.0259040371 * l_ + 0.7827717662 * m_ - 0.808675766 * s_;
-    // Convert to LCH
+    // OKLab → OKLCH: chroma and hue as polar coordinates of (a, b).
     const C = Math.sqrt(a * a + b_lab * b_lab);
     let H = (Math.atan2(b_lab, a) * 180) / Math.PI;
     if (H < 0)
         H += 360;
-    // Format as OKLCH (round to reasonable precision)
     return `oklch(${L.toFixed(3)} ${C.toFixed(3)} ${H.toFixed(1)})`;
 };

package/dist/utils/debounce.d.ts

@@ -1,14 +1,4 @@
-/**
- * Debounce utility - delays function execution until after a specified wait time
- * has elapsed since the last time it was invoked.
- *
- * Use for text inputs, search boxes, etc. where you want to wait for the user
- * to finish typing before executing.
- *
- * @param func The function to debounce
- * @param wait The delay in milliseconds
- * @returns A debounced version of the function with a cancel method
- */
+/** Runs `func` once `wait` ms have passed with no further calls. `cancel()` drops a pending call. */
 export declare function debounce<T extends (...args: any[]) => any>(func: T, wait: number): ((...args: Parameters<T>) => void) & {
     cancel: () => void;
 };

package/dist/utils/debounce.js

@@ -1,14 +1,4 @@
-/**
- * Debounce utility - delays function execution until after a specified wait time
- * has elapsed since the last time it was invoked.
- *
- * Use for text inputs, search boxes, etc. where you want to wait for the user
- * to finish typing before executing.
- *
- * @param func The function to debounce
- * @param wait The delay in milliseconds
- * @returns A debounced version of the function with a cancel method
- */
+/** Runs `func` once `wait` ms have passed with no further calls. `cancel()` drops a pending call. */
 export function debounce(func, wait) {
     let timeout = null;
     function debounced(...args) {

package/dist/utils/loadScript.d.ts

@@ -1,11 +1,6 @@
 /**
- * Load an external script from a CDN with automatic deduplication.
- * All calls to load the same script will share a single promise,
- * preventing duplicate script tags and race conditions.
- *
- * @param src The script URL
- * @param options Script attributes (crossOrigin, async, etc.)
- * @returns Promise that resolves when script is loaded
+ * Appends a `<script>` for `src` and resolves on load. Concurrent calls for the same URL share
+ * one promise, so a script never gets a second tag. A failed load is evicted so a retry can run.
  */
 export declare function loadScript(src: string, options?: {
     crossOrigin?: string;

package/dist/utils/loadScript.js

@@ -1,12 +1,7 @@
 const scriptLoaders = new Map();
 /**
- * Load an external script from a CDN with automatic deduplication.
- * All calls to load the same script will share a single promise,
- * preventing duplicate script tags and race conditions.
- *
- * @param src The script URL
- * @param options Script attributes (crossOrigin, async, etc.)
- * @returns Promise that resolves when script is loaded
+ * Appends a `<script>` for `src` and resolves on load. Concurrent calls for the same URL share
+ * one promise, so a script never gets a second tag. A failed load is evicted so a retry can run.
  */
 export function loadScript(src, options) {
     if (scriptLoaders.has(src)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@selvajs/ui",
-  "version": "6.0.0-beta.8",
+  "version": "6.1.0",
   "description": "Shared UI components and utilities for Selva applications",
   "license": "MIT",
   "author": "VektorNode",
@@ -57,12 +57,12 @@
     "@sveltejs/kit": "^2",
     "bits-ui": "^2.18.0",
     "svelte": "^5",
-    "tailwind-variants": "^3.3.0",
+    "tailwind-variants": "^3.3.1",
     "three": "^0.185.1",
-    "@selvajs/compute": "^4.0.0-beta.8",
-    "@selvajs/schemas": "^5.0.0-beta.3",
-    "@selvajs/solve": "^1.0.0-beta.10",
-    "@selvajs/visualization": "^1.0.0-beta.4"
+    "@selvajs/compute": "^4.0.1",
+    "@selvajs/schemas": "^5.0.0",
+    "@selvajs/solve": "^1.0.2",
+    "@selvajs/visualization": "^1.0.0"
   },
   "peerDependenciesMeta": {
     "three": {
@@ -72,7 +72,7 @@
   "dependencies": {
     "@floating-ui/dom": "^1.8.0",
     "@iconify/svelte": "^5.2.1",
-    "@lucide/svelte": "^1.27.0",
+    "@lucide/svelte": "^1.30.0",
     "clsx": "^2.1.1",
     "mode-watcher": "^1.1.0",
     "paneforge": "^1.0.2",
@@ -81,20 +81,20 @@
     "tw-animate-css": "^1.4.0"
   },
   "devDependencies": {
-    "@internationalized/date": "^3.12.1",
-    "@sveltejs/kit": "2.70.1",
+    "@internationalized/date": "^3.12.3",
+    "@sveltejs/kit": "2.70.2",
     "@sveltejs/vite-plugin-svelte": "^7.2.0",
-    "@types/three": "^0.185.1",
+    "@types/three": "^0.185.4",
     "bits-ui": "^2.18.0",
-    "rimraf": "^6.0.1",
+    "rimraf": "^6.1.3",
     "svelte": "5.56.8",
-    "tailwind-variants": "^3.3.0",
+    "tailwind-variants": "^3.3.1",
     "vitest": "^4.1.10",
-    "@selvajs/compute": "4.0.0-beta.8",
-    "@selvajs/schemas": "5.0.0-beta.3",
-    "@selvajs/config": "0.0.3",
-    "@selvajs/solve": "1.0.0-beta.10",
-    "@selvajs/visualization": "1.0.0-beta.4"
+    "@selvajs/visualization": "1.0.0",
+    "@selvajs/schemas": "5.0.0",
+    "@selvajs/solve": "1.0.2",
+    "@selvajs/config": "0.0.4",
+    "@selvajs/compute": "4.0.1"
   },
   "scripts": {
     "predev": "node ../../scripts/sync-shared-assets.js",

package/src/lib/components/compute/AppLayout.svelte

@@ -38,9 +38,7 @@
 		onListStates?: () => ParameterPreset[] | Promise<ParameterPreset[]>;
 		presetLabels?: Partial<PresetLabels>;
 		viewerConfig?: ViewerConfig;
-		/** Branding logo URL shown as a watermark in the viewer's bottom-right corner. */
 		logoUrl?: string;
-		/** Hands the live three.js viewer to the host. See `Viewer.svelte`. */
 		onViewerReady?: (viewer: ThreeViewer) => void | (() => void);
 	}
 
@@ -79,7 +77,7 @@
 	const hasLeftPanel = $derived(leftTabs.length > 0);
 	const hasRightPanel = $derived(rightTabs.length > 0);
 	const hasSidebar = $derived(hasViewer || hasRightPanel);
-	// Two-panel mode: left + right, no viewer — both panels grow to fill full width
+	// Left + right, no viewer — both panes grow to fill the full width.
 	const isTwoPanelMode = $derived(!hasViewer && hasLeftPanel && hasRightPanel);
 
 	let isMobile = $state(false);
@@ -298,7 +296,7 @@
 		</div>
 	{:else}
 		<div class="min-h-0 flex h-full flex-1">
-			<!-- Left collapsed strip (outside PaneGroup so it has fixed width) -->
+			<!-- Outside PaneGroup so the strip keeps a fixed width. -->
 			{#if leftCollapsed && hasSidebar && hasLeftPanel}
 				<CollapsedPanelStrip
 					side="left"
@@ -317,7 +315,6 @@
 				autoSaveId="selva-layout-{layoutKey}"
 				class="min-h-0 flex-1"
 			>
-				<!-- Left pane -->
 				{#if hasLeftPanel}
 					<Resizable.Pane
 						bind:this={leftPaneRef}
@@ -349,7 +346,6 @@
 					/>
 				{/if}
 
-				<!-- Viewer pane -->
 				{#if hasViewer}
 					<Resizable.Pane order={2} minSize={20} class="min-h-0 mx-1 flex flex-col">
 						<Viewer
@@ -359,13 +355,13 @@
 							{logoUrl}
 							{onViewerReady}
 							viewerConfig={{
+								...viewerConfig,
 								backgroundColor: schema?.viewerOptions?.backgroundColor
 							}}
 						/>
 					</Resizable.Pane>
 				{/if}
 
-				<!-- Right pane -->
 				{#if hasRightPanel}
 					<Resizable.Handle
 						withHandle
@@ -398,7 +394,6 @@
 				{/if}
 			</Resizable.PaneGroup>
 
-			<!-- Right collapsed strip -->
 			{#if rightCollapsed && hasRightPanel}
 				<CollapsedPanelStrip
 					side="right"