@salmexio/ui 1.1.0 → 1.2.0

package/dist/layout/ThermalBackground/ThermalBackground.svelte

@@ -1,13 +1,12 @@
 <!--
   ThermalBackground — Dynamic INFRARED background
 
-  Layered ambient background with thermal blob drift, radar sweep,
+  Layered ambient background with thermal blob drift
   and film grain. Pure CSS — zero JS runtime cost.
 
   Usage:
     <ThermalBackground />              — default (all layers)
     <ThermalBackground grain={false} /> — no grain overlay
-    <ThermalBackground sweep={false} /> — no radar sweep
     <ThermalBackground intensity="low" /> — subtler blobs
 -->
 
@@ -15,8 +14,6 @@
 	interface Props {
 		/** Show film grain overlay */
 		grain?: boolean;
-		/** Show radar sweep line */
-		sweep?: boolean;
 		/** Blob intensity: low = barely visible, default = subtle, high = pronounced */
 		intensity?: 'low' | 'default' | 'high';
 		/** Additional CSS class */
@@ -27,7 +24,6 @@
 
 	let {
 		grain = true,
-		sweep = true,
 		intensity = 'default',
 		class: className = '',
 		testId = undefined,
@@ -47,12 +43,7 @@
 		<div class="sx-thermal-blob sx-thermal-blob-4"></div>
 	</div>
 
-	<!-- Layer 2: Radar/thermal sweep — horizontal scan line -->
-	{#if sweep}
-		<div class="sx-thermal-sweep"></div>
-	{/if}
-
-	<!-- Layer 3: Animated film grain -->
+	<!-- Layer 2: Animated film grain -->
 	{#if grain}
 		<div class="sx-thermal-grain"></div>
 	{/if}
@@ -244,34 +235,6 @@
 		);
 	}
 
-	/* ========================================
-	   RADAR SWEEP — Horizontal scan line
-	   A faint horizontal gradient that sweeps
-	   top to bottom like a thermal scanner or
-	   radar display. Very subtle.
-	   ======================================== */
-
-	.sx-thermal-sweep {
-		position: absolute;
-		inset: 0;
-		background: linear-gradient(
-			180deg,
-			transparent 0%,
-			rgba(255, 107, 53, 0.015) 48%,
-			rgba(255, 107, 53, 0.04) 50%,
-			rgba(255, 107, 53, 0.015) 52%,
-			transparent 100%
-		);
-		background-size: 100% 300%;
-		animation: sx-thermal-scan 8s linear infinite;
-		opacity: 0.7;
-	}
-
-	@keyframes sx-thermal-scan {
-		0%   { background-position: 0% 0%; }
-		100% { background-position: 0% 100%; }
-	}
-
 	/* ========================================
 	   FILM GRAIN — Animated noise texture
 	   SVG feTurbulence noise with subtle position
@@ -305,7 +268,6 @@
 
 	@media (prefers-reduced-motion: reduce) {
 		.sx-thermal-blob,
-		.sx-thermal-sweep,
 		.sx-thermal-grain {
 			animation: none !important;
 		}

package/dist/layout/ThermalBackground/ThermalBackground.svelte.d.ts

@@ -1,8 +1,6 @@
 interface Props {
     /** Show film grain overlay */
     grain?: boolean;
-    /** Show radar sweep line */
-    sweep?: boolean;
     /** Blob intensity: low = barely visible, default = subtle, high = pronounced */
     intensity?: 'low' | 'default' | 'high';
     /** Additional CSS class */

package/dist/layout/ThermalBackground/ThermalBackground.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThermalBackground.svelte.d.ts","sourceRoot":"","sources":["../../../src/layout/ThermalBackground/ThermalBackground.svelte.ts"],"names":[],"mappings":"AAGC,UAAU,KAAK;IACd,8BAA8B;IAC9B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,gFAAgF;IAChF,SAAS,CAAC,EAAE,KAAK,GAAG,SAAS,GAAG,MAAM,CAAC;IACvC,2BAA2B;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB;AAuCF,QAAA,MAAM,iBAAiB,2CAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}
+{"version":3,"file":"ThermalBackground.svelte.d.ts","sourceRoot":"","sources":["../../../src/layout/ThermalBackground/ThermalBackground.svelte.ts"],"names":[],"mappings":"AAGC,UAAU,KAAK;IACd,8BAA8B;IAC9B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,gFAAgF;IAChF,SAAS,CAAC,EAAE,KAAK,GAAG,SAAS,GAAG,MAAM,CAAC;IACvC,2BAA2B;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CAChB;AAiCF,QAAA,MAAM,iBAAiB,2CAAwC,CAAC;AAChE,KAAK,iBAAiB,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAC9D,eAAe,iBAAiB,CAAC"}

package/dist/navigation/CommandPalette/CommandPalette.svelte

@@ -467,14 +467,37 @@ function getItemId(itemId: string): string {
 		border: 1px solid var(--sx-color-border-strong);
 		border-radius: var(--sx-radius-lg);
 		box-shadow:
-			var(--sx-shadow-xl),
-			0 0 0 1px rgba(255, 255, 255, 0.04),
-			0 0 60px rgba(0, 0, 0, 0.5);
+			/* 3D extrusion */
+			0 1px 0 0 rgba(0, 0, 0, 0.2),
+			0 2px 0 0 rgba(0, 0, 0, 0.15),
+			0 3px 0 0 rgba(0, 0, 0, 0.1),
+			0 4px 0 0 rgba(0, 0, 0, 0.06),
+			/* Deep ambient shadow */
+			0 8px 24px -4px rgba(0, 0, 0, 0.5),
+			0 16px 48px -8px rgba(0, 0, 0, 0.3),
+			/* Warm forge glow */
+			0 0 40px -10px rgba(255, 107, 53, 0.1);
 		font-family: var(--sx-font-body);
 		overflow: hidden;
 		animation: sx-cmd-panel-in 200ms var(--sx-ease-out) both;
 	}
 
+	/* Top-lit bevel */
+	.sx-command::before {
+		content: '';
+		position: absolute;
+		inset: 0;
+		border-radius: inherit;
+		background: linear-gradient(
+			180deg,
+			rgba(255, 255, 255, 0.04) 0%,
+			transparent 25%,
+			rgba(0, 0, 0, 0.04) 100%
+		);
+		pointer-events: none;
+		z-index: 10;
+	}
+
 	.sx-command-exit {
 		animation: sx-cmd-panel-out 120ms ease-in both;
 	}
@@ -505,11 +528,18 @@ function getItemId(itemId: string): string {
 	   SEARCH FIELD
 	   ======================================== */
 	.sx-command-search {
+		position: relative;
+		z-index: 1;
 		display: flex;
 		align-items: center;
 		gap: var(--sx-space-3);
 		padding: var(--sx-space-4) var(--sx-space-5);
 		border-bottom: 1px solid var(--sx-color-border);
+		/* Recessed search well */
+		background: rgba(0, 0, 0, 0.08);
+		box-shadow:
+			inset 0 1px 3px rgba(0, 0, 0, 0.2),
+			inset 0 0 0 1px rgba(0, 0, 0, 0.04);
 	}
 
 	.sx-command-search-icon {
@@ -559,6 +589,8 @@ function getItemId(itemId: string): string {
 	   RESULTS LIST
 	   ======================================== */
 	.sx-command-results {
+		position: relative;
+		z-index: 1;
 		flex: 1;
 		overflow-y: auto;
 		overscroll-behavior: contain;
@@ -735,6 +767,8 @@ function getItemId(itemId: string): string {
 	   FOOTER
 	   ======================================== */
 	.sx-command-footer {
+		position: relative;
+		z-index: 1;
 		display: flex;
 		align-items: center;
 		gap: var(--sx-space-5);