@fangxinyan/lumina 0.6.18 → 0.8.0

package/dist/{chunk-LEMMFFEY.cjs → chunk-ZEYK37VW.cjs}

@@ -1,9 +1,10 @@
 'use strict';
 
-var chunkQMX67CVT_cjs = require('./chunk-QMX67CVT.cjs');
-require('./tokens-RYJ3DFTU.css');
+var chunk2AUXUZ3Z_cjs = require('./chunk-2AUXUZ3Z.cjs');
+var chunkNRJXZPZR_cjs = require('./chunk-NRJXZPZR.cjs');
+require('./tokens-CEJVVA3G.css');
 require('./shared-NJHRNLRH.css');
-require('./Alert-HVPI6L4V.css');
+require('./Alert-DJ3K7N7L.css');
 var React = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -27,7 +28,7 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-var Alert = React__namespace.forwardRef(({
+var AlertBase = React__namespace.forwardRef(({
   tone = "info",
   title,
   children,
@@ -39,7 +40,13 @@ var Alert = React__namespace.forwardRef(({
   className = "",
   ...rest
 }, ref) => {
+  const [closed, setClosed] = React__namespace.useState(false);
   const iconNode = icon ?? (tone === "success" ? "check2" : tone === "warning" || tone === "danger" ? "alert" : "info");
+  const handleClose = () => {
+    setClosed(true);
+    onClose?.();
+  };
+  if (closed) return null;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -48,17 +55,18 @@ var Alert = React__namespace.forwardRef(({
       role: "alert",
       ...rest,
       children: [
-        showIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "alert-ico", children: chunkQMX67CVT_cjs.renderIconSlot(iconNode, { size: 14 }) }),
+        showIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "alert-ico", children: chunk2AUXUZ3Z_cjs.renderIconSlot(iconNode, { size: 14 }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "alert-body", children: [
           title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "alert-title", children: title }),
           children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "alert-desc", children })
         ] }),
         action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "alert-action", children: action }),
-        closable && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "alert-close", onClick: onClose, "aria-label": "Dismiss", children: /* @__PURE__ */ jsxRuntime.jsx(chunkQMX67CVT_cjs.Icon, { name: "x", size: 12 }) })
+        closable && /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", className: "alert-close", onClick: handleClose, "aria-label": "\u5173\u95ED\u63D0\u793A", children: /* @__PURE__ */ jsxRuntime.jsx(chunk2AUXUZ3Z_cjs.Icon, { name: "x", size: 12 }) })
       ]
     }
   );
 });
-Alert.displayName = "Alert";
+AlertBase.displayName = "Alert";
+var Alert = chunkNRJXZPZR_cjs.withComponentTheme(AlertBase, "Alert", "alert");
 
 exports.Alert = Alert;

package/dist/{chunk-ES7AWMNH.cjs → chunk-ZHVR4YPB.cjs}

@@ -1,8 +1,9 @@
 'use strict';
 
-require('./tokens-RYJ3DFTU.css');
+var chunkNRJXZPZR_cjs = require('./chunk-NRJXZPZR.cjs');
+require('./tokens-CEJVVA3G.css');
 require('./shared-NJHRNLRH.css');
-require('./Empty-CZTRZMZQ.css');
+require('./Empty-U5CBLCAL.css');
 var React = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -26,8 +27,7 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-// src/components/Empty/Empty.tsx
-var Empty = React__namespace.forwardRef(({
+var EmptyBase = React__namespace.forwardRef(({
   title = "\u6682\u65E0\u5185\u5BB9",
   description,
   icon,
@@ -42,6 +42,7 @@ var Empty = React__namespace.forwardRef(({
   description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "empty-desc", children: description }),
   action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "empty-action", children: action })
 ] }));
-Empty.displayName = "Empty";
+EmptyBase.displayName = "Empty";
+var Empty = chunkNRJXZPZR_cjs.withComponentTheme(EmptyBase, "Empty", "empty");
 
 exports.Empty = Empty;

package/dist/{chunk-MPOO5VPW.cjs → chunk-ZYIE3BH7.cjs}

@@ -1,8 +1,9 @@
 'use strict';
 
-require('./tokens-RYJ3DFTU.css');
+var chunkNRJXZPZR_cjs = require('./chunk-NRJXZPZR.cjs');
+require('./tokens-CEJVVA3G.css');
 require('./shared-NJHRNLRH.css');
-require('./Slider-UM2IZZBH.css');
+require('./Slider-FZ5MI4X2.css');
 var React = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -26,7 +27,6 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-// src/components/Slider/Slider.tsx
 function clamp(v, lo, hi) {
   return Math.max(lo, Math.min(hi, v));
 }
@@ -40,29 +40,41 @@ function lerpColor(colors, t) {
   if (frac === 0) return colors[i];
   return `color-mix(in oklch, ${colors[i + 1]} ${Math.round(frac * 100)}%, ${colors[i]})`;
 }
-var Slider = React__namespace.forwardRef(
+var SliderBase = React__namespace.forwardRef(
   (props, ref) => {
     const {
-      min = 0,
-      max = 100,
-      step = 1,
+      min: minProp = 0,
+      max: maxProp = 100,
+      step: stepProp = 1,
       disabled,
       showValue,
       tone = "accent",
       colors,
       marks,
-      className = ""
+      ariaLabel,
+      range: rangeProp,
+      value: controlled,
+      defaultValue: defaultVal,
+      onChange: onChangeProp,
+      className = "",
+      ...rest
     } = props;
-    const range = props.range === true;
-    const controlled = props.value;
-    const defaultVal = props.defaultValue;
-    const onChange = props.onChange;
+    const min = Number.isFinite(minProp) ? minProp : 0;
+    const max = Number.isFinite(maxProp) && maxProp > min ? maxProp : min + 1;
+    const step = Number.isFinite(stepProp) && stepProp > 0 ? stepProp : 1;
+    const range = rangeProp === true;
+    const onChange = onChangeProp;
     const initRef = React__namespace.useRef(
       defaultVal !== void 0 ? Array.isArray(defaultVal) ? [...defaultVal] : [defaultVal] : range ? [min, max] : [min]
     );
     const [inner, setInner] = React__namespace.useState(initRef.current);
     const isControlled = controlled !== void 0;
-    const vals = isControlled ? Array.isArray(controlled) ? controlled : [controlled] : inner;
+    const rawVals = isControlled ? Array.isArray(controlled) ? controlled : [controlled] : inner;
+    const vals = rawVals.map((item, index) => {
+      const fallback = range && index === 1 ? max : min;
+      const finiteItem = Number.isFinite(item) ? item : fallback;
+      return clamp(snap(finiteItem, step, min), min, max);
+    }).sort((a, b) => range ? a - b : 0);
     const valsRef = React__namespace.useRef(vals);
     valsRef.current = vals;
     const trackRef = React__namespace.useRef(null);
@@ -86,7 +98,10 @@ var Slider = React__namespace.forwardRef(
         const clamped = clamp(snapped, min, max);
         const out = [...valsRef.current];
         out[index] = clamped;
-        if (range && out.length === 2 && out[0] > out[1]) out.sort((a, b) => a - b);
+        if (range && out.length === 2 && out[0] > out[1]) {
+          out.sort((a, b) => a - b);
+          if (dragging.current === index) dragging.current = index === 0 ? 1 : 0;
+        }
         commit(out);
       },
       [min, max, step, range, commit]
@@ -94,7 +109,7 @@ var Slider = React__namespace.forwardRef(
     const valFromX = React__namespace.useCallback(
       (clientX) => {
         const rect = trackRef.current?.getBoundingClientRect();
-        if (!rect) return min;
+        if (!rect || rect.width <= 0) return null;
         const ratio = clamp((clientX - rect.left) / rect.width, 0, 1);
         return min + ratio * (max - min);
       },
@@ -116,10 +131,11 @@ var Slider = React__namespace.forwardRef(
         if (disabled) return;
         e.preventDefault();
         const val = valFromX(e.clientX);
+        if (val == null) return;
         const idx = closerIndex(val);
         dragging.current = idx;
         setAt(idx, val);
-        trackRef.current?.setPointerCapture(e.pointerId);
+        trackRef.current?.setPointerCapture?.(e.pointerId);
         thumbEls.current[idx]?.focus();
       },
       [disabled, valFromX, closerIndex, setAt]
@@ -127,7 +143,8 @@ var Slider = React__namespace.forwardRef(
     const onPointerMove = React__namespace.useCallback(
       (e) => {
         if (dragging.current === null) return;
-        setAt(dragging.current, valFromX(e.clientX));
+        const value = valFromX(e.clientX);
+        if (value != null) setAt(dragging.current, value);
       },
       [valFromX, setAt]
     );
@@ -141,9 +158,11 @@ var Slider = React__namespace.forwardRef(
         if (e.key === "ArrowRight" || e.key === "ArrowUp") delta = step;
         else if (e.key === "ArrowLeft" || e.key === "ArrowDown") delta = -step;
         else if (e.key === "Home") {
+          e.preventDefault();
           setAt(index, min);
           return;
         } else if (e.key === "End") {
+          e.preventDefault();
           setAt(index, max);
           return;
         } else return;
@@ -181,6 +200,7 @@ var Slider = React__namespace.forwardRef(
       "div",
       {
         ref,
+        ...rest,
         className: `slider ${range ? "range" : ""} ${hasGradient ? "gradient" : tone} ${disabled ? "disabled" : ""} ${marks ? "has-marks" : ""} ${className}`,
         children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "slider-rail", children: [
@@ -192,6 +212,8 @@ var Slider = React__namespace.forwardRef(
                 onPointerDown,
                 onPointerMove,
                 onPointerUp,
+                onPointerCancel: onPointerUp,
+                onLostPointerCapture: onPointerUp,
                 children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "slider-fill", style: fillStyle })
               }
             ),
@@ -214,13 +236,14 @@ var Slider = React__namespace.forwardRef(
                   "aria-valuemax": max,
                   "aria-valuenow": n,
                   "aria-disabled": disabled || void 0,
+                  "aria-label": Array.isArray(ariaLabel) ? ariaLabel[i] : ariaLabel,
                   onKeyDown: (e) => handleKey(i, e),
                   onPointerDown: (e) => {
                     if (disabled) return;
                     e.preventDefault();
                     e.stopPropagation();
                     dragging.current = i;
-                    trackRef.current?.setPointerCapture(e.pointerId);
+                    trackRef.current?.setPointerCapture?.(e.pointerId);
                     e.currentTarget.focus();
                   }
                 },
@@ -229,13 +252,17 @@ var Slider = React__namespace.forwardRef(
             }),
             marks && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "slider-marks", children: Object.entries(marks).map(([k, label]) => {
               const n = Number(k);
+              if (!Number.isFinite(n) || n < min || n > max) return null;
+              const markPosition = pct(n);
               const active = range ? n >= Math.min(vals[0], vals[1]) && n <= Math.max(vals[0], vals[1]) : n <= vals[0];
               return /* @__PURE__ */ jsxRuntime.jsxs(
-                "span",
+                "button",
                 {
-                  className: `slider-mark ${active ? "active" : ""}`,
-                  style: { left: `${pct(n)}%` },
+                  type: "button",
+                  className: `slider-mark ${markPosition === 0 ? "edge-start" : markPosition === 100 ? "edge-end" : ""} ${active ? "active" : ""}`,
+                  style: { left: `${markPosition}%` },
                   onClick: () => handleMarkClick(n),
+                  disabled,
                   children: [
                     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "slider-mark-dot" }),
                     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "slider-mark-label", children: label })
@@ -251,5 +278,7 @@ var Slider = React__namespace.forwardRef(
     );
   }
 );
+SliderBase.displayName = "Slider";
+var Slider = chunkNRJXZPZR_cjs.withComponentTheme(SliderBase, "Slider", "slider");
 
 exports.Slider = Slider;

package/dist/componentThemeTypes-Jt4B5aU8.d.cts

@@ -0,0 +1,77 @@
+import * as React from 'react';
+
+/** 主题使用的浅色或深色基础模式。 */
+type ThemeBaseMode = "light" | "dark";
+/** 内置强调色名称。 */
+type AccentKey = "sky" | "coral" | "mint" | "violet" | "amber" | "rose";
+/** 由基色或现有主题 token 解析出的完整拟态表面色板。 */
+interface ThemeSurfacePalette {
+    bg: string;
+    bgRaised: string;
+    bgSunken: string;
+    fg: string;
+    fgMuted: string;
+    fgSubtle: string;
+    border: string;
+    divider: string;
+    shadowDark: string;
+    shadowLight: string;
+    accent: string;
+    accentInk: string;
+    accentSoft: string;
+    accentGlow: string;
+}
+/** 默认继承、可以在任意主题作用域中精确覆盖的语义颜色。 */
+interface ThemeSemanticColors {
+    info: string;
+    success: string;
+    warning: string;
+    danger: string;
+}
+/** 主题颜色的最终精确覆盖；未提供的字段继续继承或使用派生值。 */
+type ThemeColorOverrides = Partial<ThemeSurfacePalette & ThemeSemanticColors>;
+/** 组件和 Portal 运行时消费的完整解析色板。 */
+type ResolvedThemeColors = ThemeSurfacePalette & ThemeSemanticColors;
+/** 完整强调色色板。 */
+interface AccentPalette {
+    accent: string;
+    ink: string;
+    soft: string;
+    glow: string;
+}
+/** 自定义强调色可以是颜色字符串或带主色的部分色板。 */
+type CustomAccentInput = string | Partial<AccentPalette> & {
+    accent: string;
+};
+/** 任意 CSS 变量覆盖，键可使用短名称或完整变量名。 */
+type ThemeTokens = Record<string, string>;
+
+/** 普通组件主题影响自身，subtree 主题继续向业务后代传递。 */
+type ComponentThemeScope = "self" | "subtree";
+/** 所有可以通过 ThemeProvider.components 定向配置的公共 UI 组件。 */
+type ComponentThemeName = "Alert" | "AppShell" | "TitleBar" | "WindowControls" | "Sidebar" | "AutoComplete" | "Avatar" | "Badge" | "Button" | "IconButton" | "Calendar" | "Card" | "Cascader" | "Checkbox" | "Collapse" | "ColorPicker" | "CommandPalette" | "ContextMenu" | "DatePicker" | "DateTimePicker" | "Divider" | "Drawer" | "Empty" | "Form" | "FormItem" | "Icon" | "Image" | "ImageGrid" | "SpriteImage" | "LayeredImage" | "Input" | "InputPassword" | "InputNumber" | "List" | "MessageContainer" | "Modal" | "Pagination" | "Popover" | "Progress" | "Radio" | "RadioGroup" | "Select" | "Skeleton" | "Slider" | "Spin" | "Splitter" | "StatusBar" | "StatusBarItem" | "Surface" | "Switch" | "Table" | "TablePro" | "Tabs" | "Tag" | "Textarea" | "ThemePanel" | "Timeline" | "TimePicker" | "Tooltip" | "Typography" | "Title" | "Text" | "Paragraph" | "Link";
+/** 单个组件类型可以覆盖的颜色、token 与静态插槽样式。 */
+interface ComponentThemeOverride<TSlot extends string = string> {
+    baseColor?: string;
+    colorScheme?: ThemeBaseMode;
+    accent?: AccentKey | CustomAccentInput;
+    intensity?: number;
+    colors?: ThemeColorOverrides;
+    tokens?: ThemeTokens;
+    styles?: Partial<Record<TSlot, React.CSSProperties>>;
+}
+/** 按公共组件名称配置的主题覆盖。 */
+type ComponentThemeOverrides = Partial<Record<ComponentThemeName, ComponentThemeOverride>>;
+/** 单个组件或组件子树使用的视觉主题。 */
+interface ComponentThemeOptions extends Omit<ComponentThemeOverride, "styles"> {
+    scope?: ComponentThemeScope;
+    components?: ComponentThemeOverrides;
+}
+/** AccentKey 使用预设，其他字符串作为表面基色。 */
+type ComponentTheme = AccentKey | string | ComponentThemeOptions;
+/** 所有公共 UI 组件共享的局部主题属性。 */
+interface ComponentThemeProps {
+    theme?: ComponentTheme;
+}
+
+export type { AccentKey as A, ComponentTheme as C, ResolvedThemeColors as R, ThemeBaseMode as T, AccentPalette as a, ComponentThemeName as b, ComponentThemeOptions as c, ComponentThemeOverride as d, ComponentThemeOverrides as e, ComponentThemeProps as f, ComponentThemeScope as g, CustomAccentInput as h, ThemeColorOverrides as i, ThemeSemanticColors as j, ThemeSurfacePalette as k, ThemeTokens as l };

package/dist/componentThemeTypes-Jt4B5aU8.d.ts

@@ -0,0 +1,77 @@
+import * as React from 'react';
+
+/** 主题使用的浅色或深色基础模式。 */
+type ThemeBaseMode = "light" | "dark";
+/** 内置强调色名称。 */
+type AccentKey = "sky" | "coral" | "mint" | "violet" | "amber" | "rose";
+/** 由基色或现有主题 token 解析出的完整拟态表面色板。 */
+interface ThemeSurfacePalette {
+    bg: string;
+    bgRaised: string;
+    bgSunken: string;
+    fg: string;
+    fgMuted: string;
+    fgSubtle: string;
+    border: string;
+    divider: string;
+    shadowDark: string;
+    shadowLight: string;
+    accent: string;
+    accentInk: string;
+    accentSoft: string;
+    accentGlow: string;
+}
+/** 默认继承、可以在任意主题作用域中精确覆盖的语义颜色。 */
+interface ThemeSemanticColors {
+    info: string;
+    success: string;
+    warning: string;
+    danger: string;
+}
+/** 主题颜色的最终精确覆盖；未提供的字段继续继承或使用派生值。 */
+type ThemeColorOverrides = Partial<ThemeSurfacePalette & ThemeSemanticColors>;
+/** 组件和 Portal 运行时消费的完整解析色板。 */
+type ResolvedThemeColors = ThemeSurfacePalette & ThemeSemanticColors;
+/** 完整强调色色板。 */
+interface AccentPalette {
+    accent: string;
+    ink: string;
+    soft: string;
+    glow: string;
+}
+/** 自定义强调色可以是颜色字符串或带主色的部分色板。 */
+type CustomAccentInput = string | Partial<AccentPalette> & {
+    accent: string;
+};
+/** 任意 CSS 变量覆盖，键可使用短名称或完整变量名。 */
+type ThemeTokens = Record<string, string>;
+
+/** 普通组件主题影响自身，subtree 主题继续向业务后代传递。 */
+type ComponentThemeScope = "self" | "subtree";
+/** 所有可以通过 ThemeProvider.components 定向配置的公共 UI 组件。 */
+type ComponentThemeName = "Alert" | "AppShell" | "TitleBar" | "WindowControls" | "Sidebar" | "AutoComplete" | "Avatar" | "Badge" | "Button" | "IconButton" | "Calendar" | "Card" | "Cascader" | "Checkbox" | "Collapse" | "ColorPicker" | "CommandPalette" | "ContextMenu" | "DatePicker" | "DateTimePicker" | "Divider" | "Drawer" | "Empty" | "Form" | "FormItem" | "Icon" | "Image" | "ImageGrid" | "SpriteImage" | "LayeredImage" | "Input" | "InputPassword" | "InputNumber" | "List" | "MessageContainer" | "Modal" | "Pagination" | "Popover" | "Progress" | "Radio" | "RadioGroup" | "Select" | "Skeleton" | "Slider" | "Spin" | "Splitter" | "StatusBar" | "StatusBarItem" | "Surface" | "Switch" | "Table" | "TablePro" | "Tabs" | "Tag" | "Textarea" | "ThemePanel" | "Timeline" | "TimePicker" | "Tooltip" | "Typography" | "Title" | "Text" | "Paragraph" | "Link";
+/** 单个组件类型可以覆盖的颜色、token 与静态插槽样式。 */
+interface ComponentThemeOverride<TSlot extends string = string> {
+    baseColor?: string;
+    colorScheme?: ThemeBaseMode;
+    accent?: AccentKey | CustomAccentInput;
+    intensity?: number;
+    colors?: ThemeColorOverrides;
+    tokens?: ThemeTokens;
+    styles?: Partial<Record<TSlot, React.CSSProperties>>;
+}
+/** 按公共组件名称配置的主题覆盖。 */
+type ComponentThemeOverrides = Partial<Record<ComponentThemeName, ComponentThemeOverride>>;
+/** 单个组件或组件子树使用的视觉主题。 */
+interface ComponentThemeOptions extends Omit<ComponentThemeOverride, "styles"> {
+    scope?: ComponentThemeScope;
+    components?: ComponentThemeOverrides;
+}
+/** AccentKey 使用预设，其他字符串作为表面基色。 */
+type ComponentTheme = AccentKey | string | ComponentThemeOptions;
+/** 所有公共 UI 组件共享的局部主题属性。 */
+interface ComponentThemeProps {
+    theme?: ComponentTheme;
+}
+
+export type { AccentKey as A, ComponentTheme as C, ResolvedThemeColors as R, ThemeBaseMode as T, AccentPalette as a, ComponentThemeName as b, ComponentThemeOptions as c, ComponentThemeOverride as d, ComponentThemeOverrides as e, ComponentThemeProps as f, ComponentThemeScope as g, CustomAccentInput as h, ThemeColorOverrides as i, ThemeSemanticColors as j, ThemeSurfacePalette as k, ThemeTokens as l };