@selvajs/ui 4.11.0 → 4.12.0

package/dist/components/compute/AppLayout.svelte

@@ -37,6 +37,8 @@
 		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;
 	}
 
 	let {
@@ -57,7 +59,8 @@
 		onSaveState,
 		onListStates,
 		presetLabels,
-		viewerConfig = {}
+		viewerConfig = {},
+		logoUrl
 	}: Props = $props();
 
 	const hasViewer = $derived(
@@ -185,6 +188,7 @@
 					{isSolving}
 					isBlurred={drawerOpen}
 					{drawerOpen}
+					{logoUrl}
 					viewerConfig={{
 						...viewerConfig,
 						backgroundColor: schema?.viewerOptions?.backgroundColor,
@@ -347,6 +351,7 @@
 							{meshes}
 							bind:isFullscreen={isViewerFullscreen}
 							{isSolving}
+							{logoUrl}
 							viewerConfig={{
 								backgroundColor: schema?.viewerOptions?.backgroundColor
 							}}

package/dist/components/compute/AppLayout.svelte.d.ts

@@ -21,6 +21,8 @@ interface Props {
     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;
 }
 declare const AppLayout: import("svelte").Component<Props, {}, "isViewerFullscreen">;
 type AppLayout = ReturnType<typeof AppLayout>;

package/dist/components/compute/ComputeApp.svelte

@@ -26,6 +26,8 @@
 		onSolve: SolveFn;
 		definitionKey?: string;
 		title?: string;
+		/** Branding logo URL shown as a watermark in the viewer's bottom-right corner. Hidden when unset. */
+		logo?: string;
 		isEmbedded?: boolean;
 		primaryColor?: string;
 		showModeToggle?: boolean;
@@ -70,6 +72,7 @@
 		onSolve,
 		definitionKey = '',
 		title,
+		logo,
 		isEmbedded,
 		primaryColor,
 		showModeToggle = false,
@@ -150,7 +153,7 @@
 		});
 	});
 
-	function handleValueChange(id: string, val: unknown, forceSolve?: boolean) {
+	function handleValueChange(id: string, val: unknown, forceSolve = false) {
 		session.setValue(id, val, forceSolve);
 	}
 
@@ -212,6 +215,7 @@
 					hasNeverSolved={session.hasNeverSolved}
 					bind:isViewerFullscreen
 					values={session.values}
+					logoUrl={logo}
 					{panelActions}
 					{showSaveButton}
 					{showLoadButton}

package/dist/components/compute/ComputeApp.svelte.d.ts

@@ -10,6 +10,8 @@ interface Props {
     onSolve: SolveFn;
     definitionKey?: string;
     title?: string;
+    /** Branding logo URL shown as a watermark in the viewer's bottom-right corner. Hidden when unset. */
+    logo?: string;
     isEmbedded?: boolean;
     primaryColor?: string;
     showModeToggle?: boolean;

package/dist/components/viewer/Viewer.svelte

@@ -52,6 +52,11 @@
 		isBlurred?: boolean;
 		drawerOpen?: boolean;
 		viewerConfig?: ViewerConfig;
+		/**
+		 * Branding logo URL. When set, shown as a small watermark in the viewer's
+		 * bottom-right corner. Omitted/empty renders nothing.
+		 */
+		logoUrl?: string;
 		/**
 		 * UI language for the viewer's own chrome (tools menu, panels, dialogs).
 		 * When set, the viewer provides it to its subtree. When omitted, the viewer
@@ -78,6 +83,7 @@
 		isBlurred = false,
 		drawerOpen = false,
 		viewerConfig = {},
+		logoUrl,
 		lang
 	}: Props = $props();
 
@@ -272,6 +278,24 @@
 					></div>
 				{/if}
 
+				{#if logoUrl}
+					<!-- Branding watermark, bottom-right. Matches the tools menu's
+					     bottom offset so it clears the mobile drawer handle, and is
+					     non-interactive so it never intercepts canvas drags. -->
+					<div
+						class="right-4 {isFullscreen ? 'bottom-4' : 'bottom-16 sm:bottom-4'} absolute z-20"
+						style={hideButton
+							? 'opacity: 0; pointer-events: none;'
+							: 'opacity: 1; pointer-events: none;'}
+					>
+						<img
+							src={logoUrl}
+							alt=""
+							class="h-8 max-w-32 drop-shadow-sm sm:h-10 w-auto object-contain opacity-80"
+						/>
+					</div>
+				{/if}
+
 				{#if config.showToolsMenu}
 					{@const itemClass =
 						'gap-2 px-2 py-1.5 text-sm flex cursor-pointer select-none items-center rounded-sm outline-none transition-colors hover:bg-muted focus:bg-muted'}

package/dist/components/viewer/Viewer.svelte.d.ts

@@ -16,6 +16,11 @@ interface Props {
     isBlurred?: boolean;
     drawerOpen?: boolean;
     viewerConfig?: ViewerConfig;
+    /**
+     * Branding logo URL. When set, shown as a small watermark in the viewer's
+     * bottom-right corner. Omitted/empty renders nothing.
+     */
+    logoUrl?: string;
     /**
      * UI language for the viewer's own chrome (tools menu, panels, dialogs).
      * When set, the viewer provides it to its subtree. When omitted, the viewer

package/dist/constants.js

@@ -1,8 +1,13 @@
 export const APP_DEFAULTS = {
     // File upload limits
+    // TEMP (dev): raised 150 MB → 300 MB so large dev file-widget inputs aren't
+    // blocked client-side. The server request cap (COMPUTE_REQUEST_MAX_BYTES) was
+    // bumped to 300 MB to match, but base64 inflates a raw file by ~4/3, so a
+    // full 300 MB upload still won't fit the 300 MB request body. Revert to 150
+    // before release.
     FILE_UPLOAD: {
-        MAX_SIZE_MB: 150,
-        MAX_SIZE_BYTES: 150 * 1024 * 1024
+        MAX_SIZE_MB: 300,
+        MAX_SIZE_BYTES: 300 * 1024 * 1024
     },
     // Timing & performance thresholds
     TIMEOUTS: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@selvajs/ui",
-  "version": "4.11.0",
+  "version": "4.12.0",
   "description": "Shared UI components and utilities for Selva applications",
   "license": "MIT",
   "publishConfig": {
@@ -37,13 +37,13 @@
     "**/*.css"
   ],
   "peerDependencies": {
-    "@selvajs/compute": "^2.1.0",
+    "@selvajs/compute": "^3.0.0-beta.1",
     "@sveltejs/kit": "^2",
     "bits-ui": "^2.18.0",
     "svelte": "^5",
     "tailwind-variants": "^3.2.2",
     "three": "^0.184.0",
-    "@selvajs/schemas": "^4.6.0"
+    "@selvajs/schemas": "^4.6.1"
   },
   "peerDependenciesMeta": {
     "three": {
@@ -72,8 +72,8 @@
     "svelte": "5.55.5",
     "tailwind-variants": "^3.2.2",
     "vitest": "^3.2.6",
-    "@selvajs/config": "0.0.1",
-    "@selvajs/schemas": "4.6.0"
+    "@selvajs/schemas": "4.6.1",
+    "@selvajs/config": "0.0.2"
   },
   "scripts": {
     "dev": "vite dev",

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

@@ -37,6 +37,8 @@
 		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;
 	}
 
 	let {
@@ -57,7 +59,8 @@
 		onSaveState,
 		onListStates,
 		presetLabels,
-		viewerConfig = {}
+		viewerConfig = {},
+		logoUrl
 	}: Props = $props();
 
 	const hasViewer = $derived(
@@ -185,6 +188,7 @@
 					{isSolving}
 					isBlurred={drawerOpen}
 					{drawerOpen}
+					{logoUrl}
 					viewerConfig={{
 						...viewerConfig,
 						backgroundColor: schema?.viewerOptions?.backgroundColor,
@@ -347,6 +351,7 @@
 							{meshes}
 							bind:isFullscreen={isViewerFullscreen}
 							{isSolving}
+							{logoUrl}
 							viewerConfig={{
 								backgroundColor: schema?.viewerOptions?.backgroundColor
 							}}

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

@@ -26,6 +26,8 @@
 		onSolve: SolveFn;
 		definitionKey?: string;
 		title?: string;
+		/** Branding logo URL shown as a watermark in the viewer's bottom-right corner. Hidden when unset. */
+		logo?: string;
 		isEmbedded?: boolean;
 		primaryColor?: string;
 		showModeToggle?: boolean;
@@ -70,6 +72,7 @@
 		onSolve,
 		definitionKey = '',
 		title,
+		logo,
 		isEmbedded,
 		primaryColor,
 		showModeToggle = false,
@@ -150,7 +153,7 @@
 		});
 	});
 
-	function handleValueChange(id: string, val: unknown, forceSolve?: boolean) {
+	function handleValueChange(id: string, val: unknown, forceSolve = false) {
 		session.setValue(id, val, forceSolve);
 	}
 
@@ -212,6 +215,7 @@
 					hasNeverSolved={session.hasNeverSolved}
 					bind:isViewerFullscreen
 					values={session.values}
+					logoUrl={logo}
 					{panelActions}
 					{showSaveButton}
 					{showLoadButton}

package/src/lib/components/viewer/Viewer.svelte

@@ -52,6 +52,11 @@
 		isBlurred?: boolean;
 		drawerOpen?: boolean;
 		viewerConfig?: ViewerConfig;
+		/**
+		 * Branding logo URL. When set, shown as a small watermark in the viewer's
+		 * bottom-right corner. Omitted/empty renders nothing.
+		 */
+		logoUrl?: string;
 		/**
 		 * UI language for the viewer's own chrome (tools menu, panels, dialogs).
 		 * When set, the viewer provides it to its subtree. When omitted, the viewer
@@ -78,6 +83,7 @@
 		isBlurred = false,
 		drawerOpen = false,
 		viewerConfig = {},
+		logoUrl,
 		lang
 	}: Props = $props();
 
@@ -272,6 +278,24 @@
 					></div>
 				{/if}
 
+				{#if logoUrl}
+					<!-- Branding watermark, bottom-right. Matches the tools menu's
+					     bottom offset so it clears the mobile drawer handle, and is
+					     non-interactive so it never intercepts canvas drags. -->
+					<div
+						class="right-4 {isFullscreen ? 'bottom-4' : 'bottom-16 sm:bottom-4'} absolute z-20"
+						style={hideButton
+							? 'opacity: 0; pointer-events: none;'
+							: 'opacity: 1; pointer-events: none;'}
+					>
+						<img
+							src={logoUrl}
+							alt=""
+							class="h-8 max-w-32 drop-shadow-sm sm:h-10 w-auto object-contain opacity-80"
+						/>
+					</div>
+				{/if}
+
 				{#if config.showToolsMenu}
 					{@const itemClass =
 						'gap-2 px-2 py-1.5 text-sm flex cursor-pointer select-none items-center rounded-sm outline-none transition-colors hover:bg-muted focus:bg-muted'}

package/src/lib/constants.ts

@@ -1,8 +1,13 @@
 export const APP_DEFAULTS = {
 	// File upload limits
+	// TEMP (dev): raised 150 MB → 300 MB so large dev file-widget inputs aren't
+	// blocked client-side. The server request cap (COMPUTE_REQUEST_MAX_BYTES) was
+	// bumped to 300 MB to match, but base64 inflates a raw file by ~4/3, so a
+	// full 300 MB upload still won't fit the 300 MB request body. Revert to 150
+	// before release.
 	FILE_UPLOAD: {
-		MAX_SIZE_MB: 150,
-		MAX_SIZE_BYTES: 150 * 1024 * 1024
+		MAX_SIZE_MB: 300,
+		MAX_SIZE_BYTES: 300 * 1024 * 1024
 	},
 
 	// Timing & performance thresholds