@fangxinyan/lumina 0.6.2 → 0.6.4

package/dist/{Select-JVBQAZBG.css → Select-YZ2NUJSX.css}

@@ -14,11 +14,11 @@
   border: none;
   border-radius: var(--r-md);
   background: var(--bg);
-  box-shadow: var(--neu-out-sm);
+  box-shadow: var(--neu-shadow-control);
   display: inline-flex;
   align-items: center;
   gap: 8px;
-  font-size: 13px;
+  font-size: var(--fs-md);
   font-family: inherit;
   color: var(--fg);
   cursor: pointer;
@@ -33,21 +33,46 @@
   flex: 1;
   min-width: 0;
 }
-.select-value > span {
+.select-value-label {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
+.select-icon,
+.menu-item-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  line-height: 0;
+  flex-shrink: 0;
+}
+.select-icon img,
+.menu-item-icon img {
+  display: block;
+  width: 16px;
+  height: 16px;
+  object-fit: contain;
+}
+.select.sm .select-icon img,
+.select.sm .menu-item-icon img {
+  width: 14px;
+  height: 14px;
+}
+.select.lg .select-icon img,
+.select.lg .menu-item-icon img {
+  width: 18px;
+  height: 18px;
+}
 .select.invalid .select-trigger {
-  box-shadow: var(--neu-out-sm), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
+  box-shadow: var(--neu-shadow-control), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
 }
 .select.invalid.open .select-trigger {
-  box-shadow: var(--neu-in-sm), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
+  box-shadow: var(--neu-shadow-inset), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
 }
-.select.sm .select-trigger { height: 30px; padding: 0 32px 0 12px; font-size: 12px; border-radius: var(--r-sm); }
-.select.lg .select-trigger { height: 48px; padding: 0 36px 0 18px; font-size: 14px; border-radius: var(--r-lg); }
+.select.sm .select-trigger { height: var(--ctrl-h-sm); padding: 0 32px 0 var(--ctrl-pad-x-sm); font-size: var(--fs-sm); border-radius: var(--r-sm); }
+.select.lg .select-trigger { height: var(--field-h-lg); padding: 0 36px 0 var(--ctrl-pad-x); font-size: var(--fs-lg); border-radius: var(--r-lg); }
 .select-trigger:hover { color: var(--accent-ink); }
-.select.open .select-trigger { box-shadow: var(--neu-in-sm); color: var(--accent-ink); }
+.select.open .select-trigger { box-shadow: var(--neu-shadow-inset); color: var(--accent-ink); }
 .select-trigger .placeholder { color: var(--fg-subtle); }
 .select-caret {
   position: absolute;
@@ -96,7 +121,7 @@
   height: 20px;
   border-radius: 999px;
   background: var(--bg);
-  box-shadow: var(--neu-out-sm);
+  box-shadow: var(--neu-shadow-control);
   display: inline-grid;
   place-items: center;
   cursor: pointer;
@@ -106,7 +131,7 @@
   z-index: 1;
 }
 .select:hover .select-clear { opacity: 1; }
-.select-clear:hover { color: var(--accent-ink); box-shadow: var(--neu-in-sm); }
+.select-clear:hover { color: var(--accent-ink); box-shadow: var(--neu-shadow-inset); }
 
 /* Multi-select menu: leading checkbox per item */
 .menu-check {
@@ -114,7 +139,7 @@
   height: 16px;
   border-radius: 5px;
   background: var(--bg);
-  box-shadow: var(--neu-in-sm);
+  box-shadow: var(--neu-shadow-inset);
   display: inline-grid;
   place-items: center;
   flex-shrink: 0;
@@ -123,7 +148,7 @@
 }
 .menu-check.on {
   background: var(--accent);
-  box-shadow: var(--neu-out-sm), 0 1px 4px var(--accent-glow);
+  box-shadow: var(--neu-shadow-control), 0 1px 4px var(--accent-glow);
 }
 
 /* Menu search — flush with menu, single subtle separator (no nested frame) */
@@ -143,7 +168,7 @@
   justify-content: center;
   gap: 10px;
   padding: 26px 12px;
-  font-size: 12px;
+  font-size: var(--fs-sm);
   color: var(--fg-muted);
 }
 .menu-state .menu-state-ico {
@@ -151,7 +176,7 @@
   height: 40px;
   border-radius: var(--r-md);
   background: var(--bg);
-  box-shadow: var(--neu-in-sm);
+  box-shadow: var(--neu-shadow-inset);
   display: grid;
   place-items: center;
   color: var(--fg-subtle);
@@ -182,7 +207,7 @@
   text-overflow: ellipsis;
 }
 .menu-item-desc {
-  font-size: 11px;
+  font-size: var(--fs-xs);
   color: var(--fg-subtle);
   white-space: nowrap;
   overflow: hidden;
@@ -193,7 +218,7 @@
 /* Keyboard / hover highlight — soft raised pill */
 .menu-item.highlight:not([disabled]) {
   background: var(--bg);
-  box-shadow: var(--neu-out-sm);
+  box-shadow: var(--neu-shadow-control);
   color: var(--accent-ink);
 }
 .menu-item[disabled] {
@@ -204,7 +229,7 @@
 .menu {
   background: var(--bg);
   border-radius: var(--r-md);
-  box-shadow: var(--neu-float);
+  box-shadow: var(--neu-shadow-float);
   padding: 6px;
   min-width: 180px;
   z-index: 1000;
@@ -215,7 +240,7 @@
 .menu-item {
   padding: 9px 12px;
   border-radius: var(--r-sm);
-  font-size: 13px;
+  font-size: var(--fs-md);
   cursor: pointer;
   color: var(--fg);
   display: flex;
@@ -228,7 +253,7 @@
   width: 100%;
   text-align: left;
 }
-.menu-item:hover { background: var(--bg); box-shadow: var(--neu-flat); color: var(--accent-ink); }
+.menu-item:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); color: var(--accent-ink); }
 .menu-item.active { color: var(--accent-ink); font-weight: 500; }
 .menu-item .tick { margin-left: auto; color: var(--accent); opacity: 0; }
 .menu-item.active .tick { opacity: 1; }

package/dist/Select.cjs

@@ -1,15 +1,15 @@
 'use strict';
 
-var chunkOYMJVU66_cjs = require('./chunk-OYMJVU66.cjs');
-require('./chunk-ZIP7F4UF.cjs');
+var chunkIDJCFYPP_cjs = require('./chunk-IDJCFYPP.cjs');
+require('./chunk-SYWTT5TY.cjs');
 require('./chunk-YB3IWIOJ.cjs');
-require('./chunk-6LZ54NPO.cjs');
-require('./chunk-OQBDU5I2.cjs');
-require('./chunk-TJII7BQ2.cjs');
+require('./chunk-VAXWWJJP.cjs');
+require('./chunk-5NFSDFBB.cjs');
+require('./chunk-6LARTGLP.cjs');
 
 
 
 Object.defineProperty(exports, "Select", {
   enumerable: true,
-  get: function () { return chunkOYMJVU66_cjs.Select; }
+  get: function () { return chunkIDJCFYPP_cjs.Select; }
 });

package/dist/Select.d.cts

@@ -1,5 +1,6 @@
 import * as React from 'react';
-import { IconName } from './Icon.cjs';
+import { IconSlot } from './Icon.cjs';
+import 'react/jsx-runtime';
 
 interface SelectOption<T extends string | number = string> {
     value: T;
@@ -8,8 +9,8 @@ interface SelectOption<T extends string | number = string> {
     text?: string;
     /** Secondary line shown beneath the label. */
     description?: React.ReactNode;
-    /** Leading icon. */
-    icon?: IconName;
+    /** Leading icon. Accepts a built-in icon name or custom React node. */
+    icon?: IconSlot;
     disabled?: boolean;
 }
 interface SelectOptionGroup<T extends string | number = string> {

package/dist/Select.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
-import { IconName } from './Icon.js';
+import { IconSlot } from './Icon.js';
+import 'react/jsx-runtime';
 
 interface SelectOption<T extends string | number = string> {
     value: T;
@@ -8,8 +9,8 @@ interface SelectOption<T extends string | number = string> {
     text?: string;
     /** Secondary line shown beneath the label. */
     description?: React.ReactNode;
-    /** Leading icon. */
-    icon?: IconName;
+    /** Leading icon. Accepts a built-in icon name or custom React node. */
+    icon?: IconSlot;
     disabled?: boolean;
 }
 interface SelectOptionGroup<T extends string | number = string> {

package/dist/Select.js

@@ -1,6 +1,6 @@
-export { Select } from './chunk-WKKSAGYH.js';
-import './chunk-DQTSTJ6O.js';
+export { Select } from './chunk-7D76MI37.js';
+import './chunk-VNNQYJLT.js';
 import './chunk-DUFRASGO.js';
-import './chunk-XTIN5545.js';
-import './chunk-WGZ2KJTZ.js';
-import './chunk-OF3SGLZY.js';
+import './chunk-XVP7IKLZ.js';
+import './chunk-56PHETWO.js';
+import './chunk-YT5NLCRC.js';

package/dist/Skeleton.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkHZSIUOCN_cjs = require('./chunk-HZSIUOCN.cjs');
+var chunkYUKXNWVE_cjs = require('./chunk-YUKXNWVE.cjs');
 
 
 
 Object.defineProperty(exports, "Skeleton", {
   enumerable: true,
-  get: function () { return chunkHZSIUOCN_cjs.Skeleton; }
+  get: function () { return chunkYUKXNWVE_cjs.Skeleton; }
 });

package/dist/Skeleton.js

@@ -1 +1 @@
-export { Skeleton } from './chunk-5TKC6IEN.js';
+export { Skeleton } from './chunk-PEJLXJQD.js';

package/dist/{Slider-3JKA5EW6.css → Slider-UM2IZZBH.css}

@@ -26,7 +26,7 @@
   height: 10px;
   border-radius: 999px;
   background: var(--bg);
-  box-shadow: var(--neu-in-sm);
+  box-shadow: var(--neu-shadow-inset);
   touch-action: none;
   z-index: 1;
 }
@@ -47,7 +47,7 @@
   width: 22px; height: 22px;
   border-radius: 999px;
   background: var(--bg-raised);
-  box-shadow: var(--neu-out-sm);
+  box-shadow: var(--neu-shadow-control);
   transform: translate(-50%, -50%);
   transition: all var(--dur-fast) var(--ease);
   display: grid; place-items: center;
@@ -62,7 +62,7 @@
   background: var(--slider-thumb-color, var(--accent));
 }
 .slider-thumb:focus-visible {
-  box-shadow: var(--neu-out-sm), 0 0 0 3px var(--accent-glow);
+  box-shadow: var(--neu-shadow-control), 0 0 0 3px var(--accent-glow);
 }
 .slider:hover .slider-thumb { transform: translate(-50%, -50%) scale(1.08); }
 
@@ -77,13 +77,13 @@
 /* Tone variants */
 .slider.success .slider-thumb { --slider-thumb-color: var(--success); }
 .slider.success .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--success) 70%, white), var(--success)); box-shadow: 0 0 10px color-mix(in oklch, var(--success) 35%, transparent); }
-.slider.success .slider-thumb:focus-visible { box-shadow: var(--neu-out-sm), 0 0 0 3px color-mix(in oklch, var(--success) 35%, transparent); }
+.slider.success .slider-thumb:focus-visible { box-shadow: var(--neu-shadow-control), 0 0 0 3px color-mix(in oklch, var(--success) 35%, transparent); }
 .slider.warning .slider-thumb { --slider-thumb-color: var(--warning); }
 .slider.warning .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--warning) 70%, white), var(--warning)); box-shadow: 0 0 10px color-mix(in oklch, var(--warning) 35%, transparent); }
-.slider.warning .slider-thumb:focus-visible { box-shadow: var(--neu-out-sm), 0 0 0 3px color-mix(in oklch, var(--warning) 35%, transparent); }
+.slider.warning .slider-thumb:focus-visible { box-shadow: var(--neu-shadow-control), 0 0 0 3px color-mix(in oklch, var(--warning) 35%, transparent); }
 .slider.danger .slider-thumb { --slider-thumb-color: var(--danger); }
 .slider.danger  .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--danger) 70%, white), var(--danger));  box-shadow: 0 0 10px color-mix(in oklch, var(--danger) 35%, transparent); }
-.slider.danger  .slider-thumb:focus-visible { box-shadow: var(--neu-out-sm), 0 0 0 3px color-mix(in oklch, var(--danger) 35%, transparent); }
+.slider.danger  .slider-thumb:focus-visible { box-shadow: var(--neu-shadow-control), 0 0 0 3px color-mix(in oklch, var(--danger) 35%, transparent); }
 
 /* Marks */
 .slider-marks {
@@ -110,7 +110,7 @@
   width: 6px; height: 6px;
   border-radius: 999px;
   background: var(--bg);
-  box-shadow: var(--neu-in-sm);
+  box-shadow: var(--neu-shadow-inset);
   position: absolute;
   top: -12px;
   left: 50%;

package/dist/Slider.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkIZOHYJUQ_cjs = require('./chunk-IZOHYJUQ.cjs');
+var chunkZWCDB5PP_cjs = require('./chunk-ZWCDB5PP.cjs');
 
 
 
 Object.defineProperty(exports, "Slider", {
   enumerable: true,
-  get: function () { return chunkIZOHYJUQ_cjs.Slider; }
+  get: function () { return chunkZWCDB5PP_cjs.Slider; }
 });

package/dist/Slider.js

@@ -1 +1 @@
-export { Slider } from './chunk-7JN6FJ55.js';
+export { Slider } from './chunk-HU7T64Y3.js';

package/dist/{Spin-3GJNMSIH.css → Spin-GONGPV4Q.css}

@@ -20,7 +20,7 @@
   border: none;
   border-radius: 50%;
   background: var(--bg);
-  box-shadow: var(--neu-in-sm);
+  box-shadow: var(--neu-shadow-inset);
   animation: none;
 }
 

package/dist/Spin.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkQKQHZIF3_cjs = require('./chunk-QKQHZIF3.cjs');
+var chunkSG42F5VB_cjs = require('./chunk-SG42F5VB.cjs');
 
 
 
 Object.defineProperty(exports, "Spin", {
   enumerable: true,
-  get: function () { return chunkQKQHZIF3_cjs.Spin; }
+  get: function () { return chunkSG42F5VB_cjs.Spin; }
 });

package/dist/Spin.js

@@ -1 +1 @@
-export { Spin } from './chunk-ELNT3CFO.js';
+export { Spin } from './chunk-Y5F7ZTBH.js';

package/dist/Splitter.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunk2TL37AP5_cjs = require('./chunk-2TL37AP5.cjs');
+var chunkN3OLFKV5_cjs = require('./chunk-N3OLFKV5.cjs');
 
 
 
 Object.defineProperty(exports, "Splitter", {
   enumerable: true,
-  get: function () { return chunk2TL37AP5_cjs.Splitter; }
+  get: function () { return chunkN3OLFKV5_cjs.Splitter; }
 });

package/dist/Splitter.js

@@ -1 +1 @@
-export { Splitter } from './chunk-KLEKKZ73.js';
+export { Splitter } from './chunk-7ZNGHWVS.js';

package/dist/{StatusBar-CDS2GPSI.css → StatusBar-FJKEEPXU.css}

@@ -46,13 +46,9 @@
 
 .statusbar-item.tone-muted   { color: var(--fg-subtle); }
 .statusbar-item.tone-accent  { color: var(--accent-ink); }
-.statusbar-item.tone-success { color: oklch(52% 0.14 150); }
-.statusbar-item.tone-warning { color: oklch(58% 0.14 75); }
-.statusbar-item.tone-danger  { color: oklch(56% 0.18 25); }
-
-[data-theme="dark"] .statusbar-item.tone-success { color: oklch(78% 0.14 150); }
-[data-theme="dark"] .statusbar-item.tone-warning { color: oklch(82% 0.14 75); }
-[data-theme="dark"] .statusbar-item.tone-danger  { color: oklch(76% 0.16 25); }
+.statusbar-item.tone-success { color: var(--success); }
+.statusbar-item.tone-warning { color: var(--warning); }
+.statusbar-item.tone-danger  { color: var(--danger); }
 
 .statusbar-item-icon { display: inline-flex; flex-shrink: 0; }
 .statusbar-item-label { overflow: hidden; text-overflow: ellipsis; }

package/dist/StatusBar.cjs

@@ -1,14 +1,14 @@
 'use strict';
 
-var chunkYLIQ37KY_cjs = require('./chunk-YLIQ37KY.cjs');
+var chunk6XVLERA3_cjs = require('./chunk-6XVLERA3.cjs');
 
 
 
 Object.defineProperty(exports, "StatusBar", {
   enumerable: true,
-  get: function () { return chunkYLIQ37KY_cjs.StatusBar; }
+  get: function () { return chunk6XVLERA3_cjs.StatusBar; }
 });
 Object.defineProperty(exports, "StatusBarItem", {
   enumerable: true,
-  get: function () { return chunkYLIQ37KY_cjs.StatusBarItem; }
+  get: function () { return chunk6XVLERA3_cjs.StatusBarItem; }
 });

package/dist/StatusBar.js

@@ -1 +1 @@
-export { StatusBar, StatusBarItem } from './chunk-6BWELOCT.js';
+export { StatusBar, StatusBarItem } from './chunk-2SCXQ7QS.js';

package/dist/Surface-UDDN3DGL.css

@@ -0,0 +1,42 @@
+/* ============ Surface ============ */
+.surface {
+  position: relative;
+  box-sizing: border-box;
+  min-width: 0;
+  color: var(--fg);
+  background: var(--bg);
+  border-radius: var(--r-lg);
+}
+
+.surface.tone-raised { background: var(--bg-raised); }
+.surface.tone-sunken { background: var(--bg-sunken); }
+.surface.tone-accent {
+  color: var(--accent-ink);
+  background: var(--accent-soft);
+}
+
+.surface.plain { box-shadow: none; }
+.surface.raised { box-shadow: var(--neu-shadow-panel); }
+.surface.sunken { box-shadow: var(--neu-shadow-inset-strong); }
+.surface.floating { box-shadow: var(--neu-shadow-float); }
+.surface.bordered { border: 1px solid var(--border); }
+
+.surface.pad-none { padding: 0; }
+.surface.pad-sm { padding: var(--gap-3); }
+.surface.pad-md { padding: var(--gap-5); }
+.surface.pad-lg { padding: var(--gap-8); }
+.surface.pad-xl { padding: var(--gap-10); }
+
+.surface.radius-none { border-radius: 0; }
+.surface.radius-sm { border-radius: var(--r-sm); }
+.surface.radius-md { border-radius: var(--r-md); }
+.surface.radius-lg { border-radius: var(--r-lg); }
+.surface.radius-xl { border-radius: var(--r-xl); }
+
+.surface.height-content { min-height: 0; }
+.surface.height-fill { min-height: 100%; }
+.surface.height-screen { min-height: 100vh; }
+.surface.scrollable { overflow: auto; }
+
+.surface > *:first-child { margin-top: 0; }
+.surface > *:last-child { margin-bottom: 0; }

package/dist/Surface.cjs

@@ -0,0 +1,16 @@
+'use strict';
+
+var chunkNT6CJYI3_cjs = require('./chunk-NT6CJYI3.cjs');
+require('./chunk-6EOSMK34.cjs');
+require('./chunk-N2COYOXE.cjs');
+
+
+
+Object.defineProperty(exports, "SURFACE_THEME_PRESETS", {
+  enumerable: true,
+  get: function () { return chunkNT6CJYI3_cjs.SURFACE_THEME_PRESETS; }
+});
+Object.defineProperty(exports, "Surface", {
+  enumerable: true,
+  get: function () { return chunkNT6CJYI3_cjs.Surface; }
+});

package/dist/Surface.d.cts

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import { ThemePreset, ThemeMode, ThemeBaseMode, AccentKey, CustomAccentInput, DensityMode, FontConfig, ThemeTokens, ThemePresets } from './Theme.cjs';
+
+type SurfacePreset = "inherit" | "mist" | "porcelain" | "graphite" | "ember";
+type SurfaceTone = "base" | "raised" | "sunken" | "accent";
+type SurfaceVariant = "plain" | "raised" | "sunken" | "floating";
+type SurfacePadding = "none" | "sm" | "md" | "lg" | "xl";
+type SurfaceRadius = "none" | "sm" | "md" | "lg" | "xl";
+type SurfaceHeight = "content" | "fill" | "screen";
+declare const SURFACE_THEME_PRESETS: Record<Exclude<SurfacePreset, "inherit">, ThemePreset>;
+interface SurfaceProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "color"> {
+    /** Built-in local surface palette. `inherit` keeps the surrounding theme. */
+    preset?: SurfacePreset;
+    /** Background token used by the visible surface. */
+    tone?: SurfaceTone;
+    /** Neumorphic depth treatment for the surface itself. */
+    variant?: SurfaceVariant;
+    /** Inner padding. */
+    padding?: SurfacePadding;
+    /** Corner radius for the visible surface. */
+    radius?: SurfaceRadius;
+    /** Height behavior for page-sized surfaces. */
+    height?: SurfaceHeight;
+    /** Adds a subtle token-driven border. */
+    bordered?: boolean;
+    /** Allows the surface to scroll when constrained by its parent. */
+    scrollable?: boolean;
+    /** Local theme mode. Inherits the nearest ThemeProvider when omitted. */
+    mode?: ThemeMode;
+    /** Base light/dark color scheme for custom modes. */
+    colorScheme?: ThemeBaseMode;
+    /** Local accent palette or preset key. */
+    accent?: AccentKey | CustomAccentInput;
+    /** Local density. */
+    density?: DensityMode;
+    /** Local shadow strength, 1..10. */
+    intensity?: number;
+    /** Local theme radius in px. This is separate from the surface's own `radius` prop. */
+    themeRadius?: number;
+    /** Local font preset or stack. */
+    font?: FontConfig;
+    /** Local token overrides. */
+    tokens?: ThemeTokens;
+    /** Local custom mode registry. */
+    themes?: ThemePresets;
+    children?: React.ReactNode;
+}
+/**
+ * `Surface` — theme-aware background container for Lumina content.
+ *
+ * @example
+ * ```tsx
+ * <Surface preset="graphite" padding="lg" radius="xl">
+ *   <Card>Content that needs the graphite surface tokens.</Card>
+ * </Surface>
+ * ```
+ */
+declare const Surface: React.ForwardRefExoticComponent<SurfaceProps & React.RefAttributes<HTMLDivElement>>;
+
+export { SURFACE_THEME_PRESETS, Surface, type SurfaceHeight, type SurfacePadding, type SurfacePreset, type SurfaceProps, type SurfaceRadius, type SurfaceTone, type SurfaceVariant };

package/dist/Surface.d.ts

@@ -0,0 +1,60 @@
+import * as React from 'react';
+import { ThemePreset, ThemeMode, ThemeBaseMode, AccentKey, CustomAccentInput, DensityMode, FontConfig, ThemeTokens, ThemePresets } from './Theme.js';
+
+type SurfacePreset = "inherit" | "mist" | "porcelain" | "graphite" | "ember";
+type SurfaceTone = "base" | "raised" | "sunken" | "accent";
+type SurfaceVariant = "plain" | "raised" | "sunken" | "floating";
+type SurfacePadding = "none" | "sm" | "md" | "lg" | "xl";
+type SurfaceRadius = "none" | "sm" | "md" | "lg" | "xl";
+type SurfaceHeight = "content" | "fill" | "screen";
+declare const SURFACE_THEME_PRESETS: Record<Exclude<SurfacePreset, "inherit">, ThemePreset>;
+interface SurfaceProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "color"> {
+    /** Built-in local surface palette. `inherit` keeps the surrounding theme. */
+    preset?: SurfacePreset;
+    /** Background token used by the visible surface. */
+    tone?: SurfaceTone;
+    /** Neumorphic depth treatment for the surface itself. */
+    variant?: SurfaceVariant;
+    /** Inner padding. */
+    padding?: SurfacePadding;
+    /** Corner radius for the visible surface. */
+    radius?: SurfaceRadius;
+    /** Height behavior for page-sized surfaces. */
+    height?: SurfaceHeight;
+    /** Adds a subtle token-driven border. */
+    bordered?: boolean;
+    /** Allows the surface to scroll when constrained by its parent. */
+    scrollable?: boolean;
+    /** Local theme mode. Inherits the nearest ThemeProvider when omitted. */
+    mode?: ThemeMode;
+    /** Base light/dark color scheme for custom modes. */
+    colorScheme?: ThemeBaseMode;
+    /** Local accent palette or preset key. */
+    accent?: AccentKey | CustomAccentInput;
+    /** Local density. */
+    density?: DensityMode;
+    /** Local shadow strength, 1..10. */
+    intensity?: number;
+    /** Local theme radius in px. This is separate from the surface's own `radius` prop. */
+    themeRadius?: number;
+    /** Local font preset or stack. */
+    font?: FontConfig;
+    /** Local token overrides. */
+    tokens?: ThemeTokens;
+    /** Local custom mode registry. */
+    themes?: ThemePresets;
+    children?: React.ReactNode;
+}
+/**
+ * `Surface` — theme-aware background container for Lumina content.
+ *
+ * @example
+ * ```tsx
+ * <Surface preset="graphite" padding="lg" radius="xl">
+ *   <Card>Content that needs the graphite surface tokens.</Card>
+ * </Surface>
+ * ```
+ */
+declare const Surface: React.ForwardRefExoticComponent<SurfaceProps & React.RefAttributes<HTMLDivElement>>;
+
+export { SURFACE_THEME_PRESETS, Surface, type SurfaceHeight, type SurfacePadding, type SurfacePreset, type SurfaceProps, type SurfaceRadius, type SurfaceTone, type SurfaceVariant };

package/dist/Surface.js

@@ -0,0 +1,3 @@
+export { SURFACE_THEME_PRESETS, Surface } from './chunk-O43DOE7V.js';
+import './chunk-6SPMHY54.js';
+import './chunk-7NZ2A4MA.js';

package/dist/{Switch-36KJNDXM.css → Switch-COAQIOMH.css}

@@ -19,7 +19,7 @@
   padding: 0;
   border-radius: 999px;
   background: var(--bg);
-  box-shadow: var(--neu-in-sm);
+  box-shadow: var(--neu-shadow-inset);
   cursor: inherit;
   flex-shrink: 0;
   transition: all var(--dur) var(--ease);
@@ -27,9 +27,9 @@
 .switch.sm { --w: 36px; --h: 20px; }
 .switch.lg { --w: 58px; --h: 32px; }
 /* When checkedChildren / unCheckedChildren are present, widen the track to fit. */
-.switch.with-children { --w: 60px; }
-.switch.with-children.sm { --w: 46px; }
-.switch.with-children.lg { --w: 74px; }
+.switch.with-children { --w: 72px; }
+.switch.with-children.sm { --w: 60px; }
+.switch.with-children.lg { --w: 86px; }
 
 .switch-thumb {
   position: absolute;
@@ -39,7 +39,7 @@
   height: calc(var(--h) - 6px);
   border-radius: 999px;
   background: var(--bg-raised);
-  box-shadow: var(--neu-out-sm);
+  box-shadow: var(--neu-shadow-control);
   transition: all var(--dur) var(--ease);
   z-index: 1;
 }
@@ -68,6 +68,9 @@
   display: inline-flex;
   align-items: center;
   justify-content: center;
+  min-width: 0;
+  overflow: hidden;
+  white-space: nowrap;
   transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
 }
 /* Checked label sits on the left side of the track (thumb pushes right). */

package/dist/Switch.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkWNM5RVXR_cjs = require('./chunk-WNM5RVXR.cjs');
+var chunk6GQPF3EI_cjs = require('./chunk-6GQPF3EI.cjs');
 
 
 
 Object.defineProperty(exports, "Switch", {
   enumerable: true,
-  get: function () { return chunkWNM5RVXR_cjs.Switch; }
+  get: function () { return chunk6GQPF3EI_cjs.Switch; }
 });

package/dist/Switch.js

@@ -1 +1 @@
-export { Switch } from './chunk-QCILPZWP.js';
+export { Switch } from './chunk-YJEXAO2I.js';