@fangxinyan/lumina 0.6.18 → 0.7.0

package/dist/chunk-LG62MPMU.cjs

@@ -0,0 +1,213 @@
+'use strict';
+
+var chunkG5LCOBOT_cjs = require('./chunk-G5LCOBOT.cjs');
+var chunkNRJXZPZR_cjs = require('./chunk-NRJXZPZR.cjs');
+var chunkEE5KXDRK_cjs = require('./chunk-EE5KXDRK.cjs');
+require('./tokens-CEJVVA3G.css');
+require('./shared-NJHRNLRH.css');
+require('./Surface-CTN775GD.css');
+var React = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+function createSurfaceThemePreset(key) {
+  const preset = chunkG5LCOBOT_cjs.cloneLuminaThemePreset(key);
+  delete preset.density;
+  delete preset.font;
+  delete preset.label;
+  delete preset.description;
+  return preset;
+}
+var SURFACE_THEME_PRESETS = {
+  mist: createSurfaceThemePreset("light"),
+  porcelain: createSurfaceThemePreset("porcelain"),
+  graphite: createSurfaceThemePreset("graphite"),
+  ember: createSurfaceThemePreset("ember")
+};
+var surfacePresetMap = SURFACE_THEME_PRESETS;
+var isDefined = (value) => value !== void 0;
+var Surface = React__namespace.forwardRef(
+  ({
+    preset = "inherit",
+    tone = "base",
+    variant = "plain",
+    padding = "md",
+    radius = "lg",
+    height = "content",
+    bordered,
+    scrollable,
+    mode,
+    colorScheme,
+    accent,
+    baseColor,
+    density,
+    intensity,
+    themeRadius,
+    font,
+    tokens,
+    colors,
+    components,
+    theme,
+    themes,
+    className = "",
+    children,
+    style,
+    ...rest
+  }, ref) => {
+    const inherited = chunkEE5KXDRK_cjs.useThemeOptional();
+    const normalizedTheme = chunkNRJXZPZR_cjs.normalizeComponentThemeInput(theme);
+    const presetConfig = preset === "inherit" ? void 0 : surfacePresetMap[preset];
+    const effectiveSurfaceMode = mode ?? colorScheme ?? normalizedTheme?.colorScheme ?? presetConfig?.base ?? inherited?.mode ?? "light";
+    const [systemDark, setSystemDark] = React__namespace.useState(
+      () => typeof window !== "undefined" && window.matchMedia("(prefers-color-scheme: dark)").matches
+    );
+    React__namespace.useEffect(() => {
+      if (effectiveSurfaceMode !== "system" || typeof window === "undefined") return;
+      const media = window.matchMedia("(prefers-color-scheme: dark)");
+      setSystemDark(media.matches);
+      const handleChange = (event) => setSystemDark(event.matches);
+      media.addEventListener?.("change", handleChange);
+      return () => media.removeEventListener?.("change", handleChange);
+    }, [effectiveSurfaceMode]);
+    const registeredModePreset = effectiveSurfaceMode != null && effectiveSurfaceMode !== "light" && effectiveSurfaceMode !== "dark" && effectiveSurfaceMode !== "system" ? themes?.[effectiveSurfaceMode] ?? inherited?.themes[effectiveSurfaceMode] : void 0;
+    const localComponents = chunkEE5KXDRK_cjs.mergeComponentThemeOverrides(
+      normalizedTheme?.components,
+      components
+    );
+    const hasLocalComponentPalette = normalizedTheme != null && [
+      normalizedTheme.baseColor,
+      normalizedTheme.colorScheme,
+      normalizedTheme.accent,
+      normalizedTheme.intensity,
+      normalizedTheme.colors,
+      normalizedTheme.tokens
+    ].some(isDefined);
+    const usesLocalTheme = preset !== "inherit" || isDefined(mode) || isDefined(colorScheme) || isDefined(accent) || isDefined(baseColor) || isDefined(density) || isDefined(intensity) || isDefined(themeRadius) || isDefined(font) || isDefined(tokens) || isDefined(colors) || hasLocalComponentPalette || isDefined(themes);
+    const modeBaseColorScheme = effectiveSurfaceMode === "light" || effectiveSurfaceMode === "dark" ? effectiveSurfaceMode : effectiveSurfaceMode === "system" ? systemDark ? "dark" : "light" : void 0;
+    const localSurfaceColorScheme = modeBaseColorScheme ?? colorScheme ?? normalizedTheme?.colorScheme ?? presetConfig?.base ?? registeredModePreset?.base;
+    const hasLocalSurfacePalette = presetConfig != null || registeredModePreset != null || mode === "light" || mode === "dark" || [
+      colorScheme,
+      accent,
+      baseColor,
+      intensity,
+      tokens,
+      colors
+    ].some(isDefined) || hasLocalComponentPalette;
+    const localSurfaceTheme = hasLocalSurfacePalette ? {
+      colorScheme: localSurfaceColorScheme,
+      baseColor: baseColor ?? normalizedTheme?.baseColor ?? presetConfig?.baseColor ?? registeredModePreset?.baseColor,
+      accent: accent ?? normalizedTheme?.accent ?? presetConfig?.accent ?? registeredModePreset?.accent,
+      intensity: intensity ?? normalizedTheme?.intensity ?? presetConfig?.intensity ?? registeredModePreset?.intensity,
+      tokens: {
+        ...registeredModePreset?.tokens ?? {},
+        ...presetConfig?.tokens ?? {},
+        ...normalizedTheme?.tokens ?? {},
+        ...tokens ?? {}
+      },
+      colors: {
+        ...registeredModePreset?.colors ?? {},
+        ...presetConfig?.colors ?? {},
+        ...normalizedTheme?.colors ?? {},
+        ...colors ?? {}
+      },
+      scope: "self"
+    } : void 0;
+    const [themeRootElement, themeRootRef] = chunkNRJXZPZR_cjs.useComponentThemeRootRef(
+      ref,
+      { component: "Surface", theme: localSurfaceTheme }
+    );
+    const cls = [
+      "surface",
+      `tone-${tone}`,
+      variant,
+      `pad-${padding}`,
+      `radius-${radius}`,
+      `height-${height}`,
+      bordered && "bordered",
+      scrollable && "scrollable",
+      className
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      chunkNRJXZPZR_cjs.ComponentThemeBoundary,
+      {
+        component: "Surface",
+        cssPrefix: "surface",
+        theme: localSurfaceTheme,
+        rootElement: themeRootElement,
+        children: (themeState) => {
+          const surfaceNode = /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              ref: themeRootRef,
+              className: cls,
+              "data-surface-preset": preset === "inherit" ? void 0 : preset,
+              "data-surface-tone": tone,
+              ...themeState.rootDataAttributes,
+              ...rest,
+              style: { ...themeState.rootStyle, ...style },
+              children
+            }
+          );
+          return /* @__PURE__ */ jsxRuntime.jsx(chunkEE5KXDRK_cjs.ComponentOverridesProvider, { value: localComponents, children: /* @__PURE__ */ jsxRuntime.jsx(
+            chunkEE5KXDRK_cjs.ThemeProvider,
+            {
+              enabled: usesLocalTheme,
+              target: "scope",
+              asChild: true,
+              mode: effectiveSurfaceMode,
+              colorScheme: localSurfaceColorScheme ?? inherited?.colorScheme ?? "light",
+              baseColor: baseColor ?? normalizedTheme?.baseColor ?? presetConfig?.baseColor,
+              accent: accent ?? normalizedTheme?.accent ?? presetConfig?.accent,
+              density: density ?? presetConfig?.density ?? registeredModePreset?.density ?? inherited?.density ?? "comfortable",
+              intensity: intensity ?? normalizedTheme?.intensity ?? presetConfig?.intensity ?? registeredModePreset?.intensity ?? inherited?.intensity ?? 5,
+              radius: themeRadius ?? presetConfig?.radius ?? registeredModePreset?.radius ?? inherited?.radius ?? 20,
+              font: font ?? presetConfig?.font ?? registeredModePreset?.font ?? inherited?.font ?? "sf",
+              tokens: {
+                ...presetConfig?.tokens ?? {},
+                ...normalizedTheme?.tokens ?? {},
+                ...tokens ?? {}
+              },
+              colors: {
+                ...presetConfig?.colors ?? {},
+                ...normalizedTheme?.colors ?? {},
+                ...colors ?? {}
+              },
+              components: chunkEE5KXDRK_cjs.mergeComponentThemeOverrides(
+                presetConfig?.components,
+                localComponents
+              ),
+              themes: {
+                ...inherited?.themes ?? {},
+                ...themes ?? {}
+              },
+              children: surfaceNode
+            }
+          ) });
+        }
+      }
+    );
+  }
+);
+Surface.displayName = "Surface";
+
+exports.SURFACE_THEME_PRESETS = SURFACE_THEME_PRESETS;
+exports.Surface = Surface;

package/dist/{chunk-7NTTRKNT.js → chunk-LJVQQEME.js}

@@ -1,14 +1,17 @@
 import { useInputTriggerToggle } from './chunk-RC6ULCQP.js';
-import { useFloating } from './chunk-DUFRASGO.js';
-import { Input } from './chunk-IOAOG5L7.js';
-import { Button } from './chunk-IPSNC5VZ.js';
-import { Calendar } from './chunk-I7TOBKJO.js';
-import './tokens-RYJ3DFTU.css';
+import { useFloating } from './chunk-3QXP2ZNP.js';
+import { Input } from './chunk-UE4HFGJ6.js';
+import { useOverlayLayer } from './chunk-2A4GYSN4.js';
+import { Button } from './chunk-JHM7MN3G.js';
+import { Calendar } from './chunk-3DKFS44V.js';
+import { useComponentPortalTheme, InternalComponentThemePart, withComponentTheme } from './chunk-DRDDQCDD.js';
+import { usePortalContainer } from './chunk-ULTDRMGN.js';
+import './tokens-CEJVVA3G.css';
 import './shared-NJHRNLRH.css';
-import './DatePicker-VDVSIARF.css';
+import './DatePicker-ZSFDXAYD.css';
 import * as React from 'react';
 import { createPortal } from 'react-dom';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 
 var pad = (value) => String(value).padStart(2, "0");
 var startOfDay = (date) => new Date(date.getFullYear(), date.getMonth(), date.getDate());
@@ -37,12 +40,13 @@ var parseDateInput = (input) => {
   }
   return date;
 };
-var DatePicker = React.forwardRef(
+var DatePickerBase = React.forwardRef(
   ({
     value,
     defaultValue = null,
     onChange,
     format = "YYYY-MM-DD",
+    parse,
     placeholder = "\u8BF7\u9009\u62E9\u65E5\u671F",
     disabled,
     readOnly,
@@ -60,6 +64,12 @@ var DatePicker = React.forwardRef(
     dropdownClassName = "",
     className = "",
     onKeyDown,
+    id: fieldId,
+    "aria-invalid": ariaInvalid,
+    "aria-describedby": ariaDescribedBy,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-required": ariaRequired,
+    "aria-label": ariaLabel,
     ...rest
   }, ref) => {
     const controlled = value !== void 0;
@@ -94,13 +104,23 @@ var DatePicker = React.forwardRef(
       setOpen
     });
     const rootRef = React.useRef(null);
-    const panelRef = React.useRef(null);
-    const { triggerRef, floatingStyle } = useFloating({
+    const panelId = React.useId();
+    const portalContainer = usePortalContainer();
+    const portalTheme = useComponentPortalTheme("DatePicker");
+    const { triggerRef, floatingRef: panelRef, floatingStyle, zIndex: panelZIndex } = useFloating({
       open,
       placement,
       panelWidth: 344,
       panelHeight: 404
     });
+    useOverlayLayer({
+      open: open && !disabled && !readOnly && portalContainer != null,
+      containerRef: panelRef,
+      ownerRef: triggerRef,
+      zIndex: panelZIndex,
+      onEscape: () => setOpen(false),
+      restoreFocus: true
+    });
     const setRootRef = React.useCallback(
       (node) => {
         rootRef.current = node;
@@ -148,14 +168,9 @@ var DatePicker = React.forwardRef(
         if (panelRef.current?.contains(target)) return;
         setOpen(false);
       };
-      const onDocKey = (event) => {
-        if (event.key === "Escape") setOpen(false);
-      };
       document.addEventListener("mousedown", onDown);
-      document.addEventListener("keydown", onDocKey);
       return () => {
         document.removeEventListener("mousedown", onDown);
-        document.removeEventListener("keydown", onDocKey);
       };
     }, [open, setOpen]);
     const handleInputChange = (next) => {
@@ -167,12 +182,8 @@ var DatePicker = React.forwardRef(
         setDraft(formattedCurrent);
         return;
       }
-      if (typeof format === "function") {
-        setDraft(formattedCurrent);
-        return;
-      }
-      const parsed = parseDateInput(draft);
-      if (!parsed || isDisabledDate(parsed)) {
+      const parsed = parse ? parse(draft) : typeof format === "function" ? null : parseDateInput(draft);
+      if (!isValidDate(parsed) || isDisabledDate(parsed)) {
         setDraft(formattedCurrent);
         return;
       }
@@ -202,10 +213,16 @@ var DatePicker = React.forwardRef(
       invalid && "invalid",
       className
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsxs("div", { ref: setRootRef, className: rootClassName, onKeyDown: handleRootKeyDown, ...rest, children: [
+    return /* @__PURE__ */ jsx("div", { ref: setRootRef, className: rootClassName, onKeyDown: handleRootKeyDown, ...rest, children: /* @__PURE__ */ jsxs(InternalComponentThemePart, { components: ["Input", "Calendar", "Button"], children: [
       /* @__PURE__ */ jsx(
         Input,
         {
+          id: fieldId,
+          "aria-label": ariaLabel,
+          "aria-labelledby": ariaLabelledBy,
+          "aria-invalid": ariaInvalid,
+          "aria-required": ariaRequired,
+          "aria-describedby": ariaDescribedBy,
           value: draft,
           size,
           placeholder,
@@ -219,17 +236,21 @@ var DatePicker = React.forwardRef(
           onBlur: handleInputBlur,
           inputMode: "numeric",
           "aria-expanded": open,
-          "aria-haspopup": "dialog"
+          "aria-haspopup": "dialog",
+          "aria-controls": open ? panelId : void 0
         }
       ),
-      open && !disabled && !readOnly && typeof document !== "undefined" && createPortal(
+      open && !disabled && !readOnly && portalContainer && createPortal(
         /* @__PURE__ */ jsxs(
           "div",
           {
             ref: panelRef,
+            id: panelId,
             className: `date-picker-panel ${mergedPanelClassName}`,
             role: "dialog",
-            style: floatingStyle,
+            "aria-label": "\u9009\u62E9\u65E5\u671F",
+            ...portalTheme.dataAttributes,
+            style: { ...floatingStyle, ...portalTheme.style, ...portalTheme.styles.popup },
             children: [
               /* @__PURE__ */ jsx(
                 Calendar,
@@ -267,11 +288,16 @@ var DatePicker = React.forwardRef(
             ]
           }
         ),
-        document.body
+        portalContainer
       )
-    ] });
+    ] }) });
   }
 );
-DatePicker.displayName = "DatePicker";
+DatePickerBase.displayName = "DatePicker";
+var DatePicker = withComponentTheme(
+  DatePickerBase,
+  "DatePicker",
+  ["date-picker", "calendar", "input", "button"]
+);
 
 export { DatePicker };

package/dist/chunk-LOWTSOWT.js

@@ -0,0 +1,199 @@
+import { withComponentTheme } from './chunk-DRDDQCDD.js';
+import './tokens-CEJVVA3G.css';
+import './shared-NJHRNLRH.css';
+import './Splitter-IQ3PFIKK.css';
+import * as React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function clampSplitterSize(value, minimum, maximum) {
+  const normalized = Number.isFinite(value) ? value : minimum;
+  return Math.max(minimum, Math.min(maximum, normalized));
+}
+function readStoredSplitterSize(storageKey) {
+  if (!storageKey || typeof window === "undefined") return void 0;
+  try {
+    const storedValue = window.localStorage.getItem(`lumina:splitter:v1:${storageKey}`);
+    if (storedValue == null) return void 0;
+    const value = Number(storedValue);
+    return Number.isFinite(value) ? value : void 0;
+  } catch {
+    return void 0;
+  }
+}
+var SplitterBase = React.forwardRef(({
+  direction = "horizontal",
+  defaultSize = 240,
+  size,
+  onResize,
+  onResizeEnd,
+  min = 80,
+  max = Infinity,
+  step = 16,
+  children,
+  className = "",
+  handleClassName = "",
+  handleProps,
+  secondMin = 24,
+  storageKey,
+  ...rest
+}, ref) => {
+  const isControlled = size !== void 0;
+  const containerRef = React.useRef(null);
+  const cleanupDragRef = React.useRef(null);
+  const [inner, setInner] = React.useState(
+    () => clampSplitterSize(readStoredSplitterSize(storageKey) ?? defaultSize, min, max)
+  );
+  const [containerSize, setContainerSize] = React.useState(Infinity);
+  const [dragging, setDragging] = React.useState(false);
+  const clamp = React.useCallback(
+    (value) => {
+      const availableMaximum = Number.isFinite(containerSize) && containerSize > 0 ? Math.max(0, containerSize - Math.max(0, secondMin) - 6) : Infinity;
+      const effectiveMaximum = Math.max(min, Math.min(max, availableMaximum));
+      return clampSplitterSize(value, min, effectiveMaximum);
+    },
+    [containerSize, max, min, secondMin]
+  );
+  const rawCurrent = isControlled ? size : inner;
+  const current = clamp(rawCurrent);
+  const persistSize = React.useCallback((value) => {
+    if (!storageKey || typeof window === "undefined") return;
+    try {
+      window.localStorage.setItem(`lumina:splitter:v1:${storageKey}`, String(value));
+    } catch {
+    }
+  }, [storageKey]);
+  const commit = React.useCallback(
+    (value) => {
+      const clamped = clamp(value);
+      if (!isControlled) setInner(clamped);
+      onResize?.(clamped);
+      return clamped;
+    },
+    [clamp, isControlled, onResize]
+  );
+  React.useLayoutEffect(() => {
+    const element = containerRef.current;
+    if (!element) return;
+    const updateContainerSize = () => {
+      setContainerSize(direction === "horizontal" ? element.clientWidth : element.clientHeight);
+    };
+    updateContainerSize();
+    if (typeof ResizeObserver !== "undefined") {
+      const observer = new ResizeObserver(updateContainerSize);
+      observer.observe(element);
+      return () => observer.disconnect();
+    }
+    window.addEventListener("resize", updateContainerSize);
+    return () => window.removeEventListener("resize", updateContainerSize);
+  }, [direction]);
+  React.useEffect(() => () => cleanupDragRef.current?.(), []);
+  const onPointerDown = (e) => {
+    if (e.button !== 0) return;
+    e.preventDefault();
+    const el = containerRef.current;
+    if (!el) return;
+    const rect = el.getBoundingClientRect();
+    setDragging(true);
+    e.currentTarget.setPointerCapture?.(e.pointerId);
+    let latest = current;
+    const move = (ev) => {
+      const next = direction === "horizontal" ? ev.clientX - rect.left : ev.clientY - rect.top;
+      latest = commit(next);
+    };
+    const finish = () => {
+      setDragging(false);
+      onResizeEnd?.(latest);
+      persistSize(latest);
+      window.removeEventListener("pointermove", move);
+      window.removeEventListener("pointerup", finish);
+      window.removeEventListener("pointercancel", finish);
+      window.removeEventListener("blur", finish);
+      cleanupDragRef.current = null;
+    };
+    cleanupDragRef.current?.();
+    cleanupDragRef.current = finish;
+    window.addEventListener("pointermove", move);
+    window.addEventListener("pointerup", finish);
+    window.addEventListener("pointercancel", finish);
+    window.addEventListener("blur", finish);
+  };
+  const onKeyDown = (e) => {
+    const increment = (delta) => {
+      const next = commit(current + delta);
+      onResizeEnd?.(next);
+      persistSize(next);
+    };
+    if (direction === "horizontal") {
+      if (e.key === "ArrowLeft") {
+        e.preventDefault();
+        increment(-step);
+      }
+      if (e.key === "ArrowRight") {
+        e.preventDefault();
+        increment(step);
+      }
+    } else {
+      if (e.key === "ArrowUp") {
+        e.preventDefault();
+        increment(-step);
+      }
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        increment(step);
+      }
+    }
+    if (e.key === "Home") {
+      e.preventDefault();
+      const next = commit(min);
+      onResizeEnd?.(next);
+      persistSize(next);
+    }
+    if (e.key === "End") {
+      e.preventDefault();
+      const next = commit(Number.MAX_SAFE_INTEGER);
+      onResizeEnd?.(next);
+      persistSize(next);
+    }
+  };
+  const firstStyle = direction === "horizontal" ? { width: current } : { height: current };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: (node) => {
+        containerRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      className: `splitter ${direction} ${dragging ? "dragging" : ""} ${className}`,
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "splitter-panel first", style: firstStyle, children: children[0] }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            ...handleProps,
+            role: "separator",
+            tabIndex: 0,
+            "aria-label": handleProps?.["aria-label"] ?? "\u8C03\u6574\u5206\u680F\u5C3A\u5BF8",
+            "aria-orientation": direction === "horizontal" ? "vertical" : "horizontal",
+            "aria-valuenow": current,
+            "aria-valuemin": min,
+            "aria-valuemax": Number.isFinite(max) ? clamp(max) : void 0,
+            className: `splitter-handle ${handleClassName}`,
+            onPointerDown,
+            onKeyDown: (event) => {
+              handleProps?.onKeyDown?.(event);
+              if (!event.defaultPrevented) onKeyDown(event);
+            },
+            children: /* @__PURE__ */ jsx("span", { className: "splitter-handle-grip", "aria-hidden": true })
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "splitter-panel second", children: children[1] })
+      ]
+    }
+  );
+});
+SplitterBase.displayName = "Splitter";
+var Splitter = withComponentTheme(SplitterBase, "Splitter", "splitter");
+
+export { Splitter };