@fangxinyan/lumina 0.6.18 → 0.7.0

package/dist/chunk-NRJXZPZR.cjs

@@ -0,0 +1,351 @@
+'use strict';
+
+var chunkEE5KXDRK_cjs = require('./chunk-EE5KXDRK.cjs');
+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);
+
+var useIsomorphicLayoutEffect = typeof window === "undefined" ? React__namespace.useEffect : React__namespace.useLayoutEffect;
+var ACCENT_KEYS = /* @__PURE__ */ new Set([
+  "sky",
+  "coral",
+  "mint",
+  "violet",
+  "amber",
+  "rose"
+]);
+var InternalComponentThemePartContext = React__namespace.createContext([]);
+function InternalComponentThemePart({
+  components,
+  children
+}) {
+  const inherited = React__namespace.useContext(InternalComponentThemePartContext);
+  const value = React__namespace.useMemo(() => {
+    const next = Array.isArray(components) ? components : [components];
+    return [...inherited, ...next];
+  }, [components, inherited]);
+  return /* @__PURE__ */ jsxRuntime.jsx(InternalComponentThemePartContext.Provider, { value, children });
+}
+var THEME_COLOR_VARIABLES = {
+  bg: "--bg",
+  bgRaised: "--bg-raised",
+  bgSunken: "--bg-sunken",
+  fg: "--fg",
+  fgMuted: "--fg-muted",
+  fgSubtle: "--fg-subtle",
+  border: "--border",
+  divider: "--divider",
+  shadowDark: "--shadow-dark",
+  shadowLight: "--shadow-light",
+  accent: "--accent",
+  accentInk: "--accent-ink",
+  accentSoft: "--accent-soft",
+  accentGlow: "--accent-glow",
+  info: "--info",
+  success: "--success",
+  warning: "--warning",
+  danger: "--danger"
+};
+function normalizeComponentThemeInput(theme) {
+  if (theme === void 0) return void 0;
+  if (typeof theme === "string") {
+    return ACCENT_KEYS.has(theme) ? { accent: theme } : { baseColor: theme };
+  }
+  return theme;
+}
+function mergeComponentTheme(inherited, own) {
+  if (!inherited && !own) return void 0;
+  return {
+    ...inherited,
+    ...own,
+    colors: { ...inherited?.colors ?? {}, ...own?.colors ?? {} },
+    tokens: { ...inherited?.tokens ?? {}, ...own?.tokens ?? {} },
+    components: own?.components
+  };
+}
+function hasExplicitIconForeground(config) {
+  if (!config) return false;
+  return config.baseColor !== void 0 || config.colorScheme !== void 0 || config.colors?.fg !== void 0 || config.tokens?.fg !== void 0 || config.tokens?.["--fg"] !== void 0 || config.tokens?.["--lmn-icon-fg"] !== void 0;
+}
+function getStaticColorScheme(rootElement) {
+  if (typeof document === "undefined") return "light";
+  const inheritedElement = rootElement?.parentElement ?? document.documentElement;
+  const themeScope = inheritedElement.closest("[data-theme]");
+  return themeScope?.dataset.theme === "dark" ? "dark" : "light";
+}
+function hasLocalStaticThemeScope(rootElement) {
+  if (!rootElement || typeof document === "undefined") return false;
+  const themeScope = rootElement.parentElement?.closest("[data-theme]");
+  return themeScope != null && themeScope !== document.documentElement && themeScope !== document.body;
+}
+function getFallbackSnapshot(rootElement) {
+  const colorScheme = getStaticColorScheme(rootElement);
+  return {
+    colorScheme,
+    intensity: 5,
+    colors: { ...chunkEE5KXDRK_cjs.DEFAULT_THEME_COLORS[colorScheme] }
+  };
+}
+function getDefaultSnapshot(rootElement) {
+  const fallback = getFallbackSnapshot(rootElement);
+  if (typeof window === "undefined" || typeof document === "undefined") {
+    return fallback;
+  }
+  const inheritedElement = rootElement?.parentElement ?? document.documentElement;
+  const computed = window.getComputedStyle(inheritedElement);
+  const colors = { ...fallback.colors };
+  for (const key of Object.keys(THEME_COLOR_VARIABLES)) {
+    const value = computed.getPropertyValue(THEME_COLOR_VARIABLES[key]).trim();
+    if (value) colors[key] = value;
+  }
+  const shadowDepth = Number.parseFloat(computed.getPropertyValue("--d"));
+  const intensity = Number.isFinite(shadowDepth) ? (shadowDepth - 0.4) / 0.12 : fallback.intensity;
+  return { ...fallback, intensity, colors };
+}
+function createInheritedTokenResetStyle(ownerStyle, cssPrefixes) {
+  const variablePrefixes = cssPrefixes.map((prefix) => `--lmn-${prefix}-`);
+  const style = {};
+  for (const property of Object.keys(ownerStyle)) {
+    if (variablePrefixes.some((prefix) => property.startsWith(prefix))) {
+      style[property] = "initial";
+    }
+  }
+  return style;
+}
+function useComponentThemeRootRef(forwardedRef, { component, theme }) {
+  const inheritedVisualTheme = chunkEE5KXDRK_cjs.useVisualThemeSnapshot();
+  const inheritedOverrides = chunkEE5KXDRK_cjs.useComponentOverrides();
+  const [rootState, setRootState] = React__namespace.useState({
+    element: null,
+    revision: 0
+  });
+  const mountedRootRef = React__namespace.useRef(null);
+  const tracksRootElement = React__namespace.useRef(false);
+  const shouldTrackConfiguredTheme = inheritedVisualTheme === null && (theme !== void 0 || inheritedOverrides[component] !== void 0);
+  const shouldDetectLocalStaticTheme = inheritedVisualTheme === null;
+  const rootRef = React__namespace.useCallback((node) => {
+    mountedRootRef.current = node;
+    const shouldTrackNode = node !== null && (shouldTrackConfiguredTheme || shouldDetectLocalStaticTheme && hasLocalStaticThemeScope(node));
+    if (shouldTrackNode) {
+      tracksRootElement.current = true;
+      setRootState((current) => current.element === node ? current : { element: node, revision: current.revision + 1 });
+    } else if (node !== null) {
+      tracksRootElement.current = false;
+      setRootState((current) => current.element === null ? current : { element: null, revision: current.revision + 1 });
+    } else {
+      tracksRootElement.current = false;
+    }
+    if (typeof forwardedRef === "function") forwardedRef(node);
+    else if (forwardedRef) forwardedRef.current = node;
+  }, [forwardedRef, shouldDetectLocalStaticTheme, shouldTrackConfiguredTheme]);
+  useIsomorphicLayoutEffect(() => {
+    if (!shouldDetectLocalStaticTheme) return;
+    return chunkEE5KXDRK_cjs.subscribeImperativeThemeChange((target) => {
+      const node = mountedRootRef.current;
+      if (!node || !target.contains(node)) return;
+      const shouldTrackNode = shouldTrackConfiguredTheme || hasLocalStaticThemeScope(node);
+      if (!shouldTrackNode && !tracksRootElement.current) return;
+      tracksRootElement.current = shouldTrackNode;
+      setRootState((current) => ({
+        element: shouldTrackNode ? node : null,
+        revision: current.revision + 1
+      }));
+    });
+  }, [shouldDetectLocalStaticTheme, shouldTrackConfiguredTheme]);
+  return [rootState.element, rootRef];
+}
+function ComponentThemeBoundary({
+  component,
+  cssPrefix,
+  theme,
+  rootElement,
+  children
+}) {
+  const inheritedVisualTheme = chunkEE5KXDRK_cjs.useVisualThemeSnapshot();
+  const inheritedOwner = chunkEE5KXDRK_cjs.useOwnerPortalTheme();
+  const inheritedOverrides = chunkEE5KXDRK_cjs.useComponentOverrides();
+  const internalComponents = React__namespace.useContext(InternalComponentThemePartContext);
+  const own = normalizeComponentThemeInput(theme);
+  const override = inheritedOverrides[component];
+  const config = mergeComponentTheme(override, own);
+  const active = config !== void 0;
+  const scope = own?.scope ?? "self";
+  const cssPrefixes = Array.isArray(cssPrefix) ? cssPrefix : [cssPrefix];
+  const isOwnedInternalPart = internalComponents.includes(component);
+  const matchesInheritedCssPrefix = cssPrefixes.some(
+    (prefix) => inheritedOwner?.cssPrefixes.includes(prefix)
+  );
+  const shouldResetSelfTheme = !active && inheritedOwner !== null && !isOwnedInternalPart && (inheritedOwner?.component === component || matchesInheritedCssPrefix) && !inheritedOwner.subtree;
+  const hasLocalStaticTheme = inheritedVisualTheme === null && hasLocalStaticThemeScope(rootElement);
+  const inheritedSnapshot = inheritedVisualTheme ?? (shouldResetSelfTheme && inheritedOwner ? inheritedOwner.inheritedSnapshot : active || hasLocalStaticTheme ? getDefaultSnapshot(rootElement) : getFallbackSnapshot(rootElement));
+  const snapshot = active ? chunkEE5KXDRK_cjs.resolveVisualThemeSnapshot(config, inheritedSnapshot) : inheritedSnapshot;
+  const inheritedTokenResetStyle = shouldResetSelfTheme && inheritedOwner ? createInheritedTokenResetStyle(inheritedOwner.style, cssPrefixes) : {};
+  const prefixedStyle = active || shouldResetSelfTheme ? cssPrefixes.reduce((result, currentPrefix) => {
+    const prefix = `lmn-${currentPrefix}-`;
+    return {
+      ...result,
+      ...chunkEE5KXDRK_cjs.visualThemeToStyle(snapshot, prefix),
+      ...active ? chunkEE5KXDRK_cjs.componentTokensToStyle(config.tokens, prefix) : null
+    };
+  }, inheritedTokenResetStyle) : {};
+  const subtreeStyle = active && scope === "subtree" ? chunkEE5KXDRK_cjs.visualThemeToStyle(snapshot) : {};
+  const styles = override?.styles ?? {};
+  const rootStyle = {
+    ...styles.root ?? {},
+    ...prefixedStyle,
+    ...subtreeStyle
+  };
+  const rootDataAttributes = active || shouldResetSelfTheme ? active && scope === "subtree" ? {
+    "data-theme": snapshot.colorScheme,
+    "data-lumina-color-scheme": snapshot.colorScheme
+  } : { "data-lumina-color-scheme": snapshot.colorScheme } : {};
+  if (component === "Icon" && active && hasExplicitIconForeground(config)) {
+    rootDataAttributes["data-lumina-icon-color"] = "";
+  }
+  const shouldApplyPortalTheme = active || inheritedVisualTheme !== null || hasLocalStaticTheme;
+  const portalStyle = shouldApplyPortalTheme ? {
+    ...chunkEE5KXDRK_cjs.visualThemeToStyle(inheritedSnapshot),
+    ...prefixedStyle,
+    ...scope === "subtree" ? subtreeStyle : {}
+  } : {};
+  const portalDataAttributes = shouldApplyPortalTheme ? {
+    "data-theme": scope === "subtree" ? snapshot.colorScheme : inheritedSnapshot.colorScheme,
+    "data-lumina-color-scheme": snapshot.colorScheme
+  } : {};
+  const state = {
+    active,
+    scope,
+    snapshot,
+    rootStyle,
+    rootDataAttributes,
+    portalStyle,
+    portalDataAttributes,
+    styles
+  };
+  const consumedIndex = internalComponents.indexOf(component);
+  const remainingInternalComponents = isOwnedInternalPart ? [
+    ...internalComponents.slice(0, consumedIndex),
+    ...internalComponents.slice(consumedIndex + 1)
+  ] : internalComponents;
+  const ownerPortalTheme = active ? {
+    component,
+    cssPrefixes,
+    style: portalStyle,
+    colorScheme: snapshot.colorScheme,
+    inheritedColorScheme: inheritedSnapshot.colorScheme,
+    inheritedSnapshot,
+    subtree: scope === "subtree",
+    styles
+  } : shouldResetSelfTheme ? null : inheritedOwner;
+  const providedVisualTheme = active && scope === "subtree" ? snapshot : !active && hasLocalStaticTheme ? inheritedSnapshot : null;
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkEE5KXDRK_cjs.VisualThemeProvider, { value: providedVisualTheme ?? inheritedVisualTheme, children: /* @__PURE__ */ jsxRuntime.jsx(chunkEE5KXDRK_cjs.ComponentOverridesProvider, { value: own?.components, children: /* @__PURE__ */ jsxRuntime.jsx(chunkEE5KXDRK_cjs.OwnerPortalThemeProvider, { value: ownerPortalTheme, children: /* @__PURE__ */ jsxRuntime.jsx(InternalComponentThemePartContext.Provider, { value: remainingInternalComponents, children: children(state) }) }) }) });
+}
+function mergeComponentRootStyleWithInstanceStyle(rootStyle, instanceStyle) {
+  if (!instanceStyle) return rootStyle;
+  const overrides = {};
+  const instanceRecord = instanceStyle;
+  for (const property of Object.keys(rootStyle)) {
+    if (Object.prototype.hasOwnProperty.call(instanceRecord, property)) {
+      overrides[property] = instanceRecord[property];
+    }
+  }
+  return { ...rootStyle, ...overrides };
+}
+function withInternalComponentThemePart(Component, components) {
+  const Wrapped = React__namespace.forwardRef(
+    (props, ref) => /* @__PURE__ */ jsxRuntime.jsx(InternalComponentThemePart, { components, children: React__namespace.createElement(Component, { ...props, ref }) })
+  );
+  Wrapped.displayName = `InternalThemePart(${typeof Component === "string" ? Component : Component.displayName ?? Component.name ?? "Component"})`;
+  return Wrapped;
+}
+function useComponentPortalTheme(component) {
+  const owner = chunkEE5KXDRK_cjs.useOwnerPortalTheme();
+  const inherited = chunkEE5KXDRK_cjs.useVisualThemeSnapshot();
+  const matchesOwner = owner && (Array.isArray(component) ? component.includes(owner.component) : owner.component === component);
+  if (matchesOwner && owner) {
+    return {
+      style: owner.style,
+      dataAttributes: {
+        "data-theme": owner.subtree ? owner.colorScheme : owner.inheritedColorScheme,
+        "data-lumina-color-scheme": owner.colorScheme
+      },
+      styles: owner.styles
+    };
+  }
+  if (!inherited) {
+    return { style: {}, dataAttributes: {}, styles: {} };
+  }
+  return {
+    style: chunkEE5KXDRK_cjs.visualThemeToStyle(inherited),
+    dataAttributes: {
+      "data-theme": inherited.colorScheme,
+      "data-lumina-color-scheme": inherited.colorScheme
+    },
+    styles: {}
+  };
+}
+function withComponentTheme(Component, component, cssPrefix = component.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase(), options = {}) {
+  const Wrapped = React__namespace.forwardRef((props, ref) => {
+    const { theme, style, ...rest } = props;
+    const [rootElement, rootRef] = useComponentThemeRootRef(
+      options.portalOnly ? void 0 : ref,
+      { component, theme }
+    );
+    const themedNode = /* @__PURE__ */ jsxRuntime.jsx(
+      ComponentThemeBoundary,
+      {
+        component,
+        cssPrefix,
+        theme,
+        rootElement,
+        children: (state) => React__namespace.createElement(Component, {
+          ...rest,
+          ...state.rootDataAttributes,
+          ref: options.portalOnly ? ref : rootRef,
+          style: { ...state.rootStyle, ...style }
+        })
+      }
+    );
+    if (!options.portalOnly) return themedNode;
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "template",
+        {
+          ref: rootRef,
+          "data-lumina-theme-anchor": component
+        }
+      ),
+      themedNode
+    ] });
+  });
+  Wrapped.displayName = Component.displayName ?? component;
+  return Wrapped;
+}
+
+exports.ComponentThemeBoundary = ComponentThemeBoundary;
+exports.InternalComponentThemePart = InternalComponentThemePart;
+exports.mergeComponentRootStyleWithInstanceStyle = mergeComponentRootStyleWithInstanceStyle;
+exports.normalizeComponentThemeInput = normalizeComponentThemeInput;
+exports.useComponentPortalTheme = useComponentPortalTheme;
+exports.useComponentThemeRootRef = useComponentThemeRootRef;
+exports.withComponentTheme = withComponentTheme;
+exports.withInternalComponentThemePart = withInternalComponentThemePart;

package/dist/chunk-O6G3F5L4.js

@@ -0,0 +1,311 @@
+import { useFloating } from './chunk-3QXP2ZNP.js';
+import { Input } from './chunk-UE4HFGJ6.js';
+import { useOverlayLayer } from './chunk-2A4GYSN4.js';
+import { Icon, renderIconSlot } from './chunk-LQMOYVQF.js';
+import { useComponentPortalTheme, InternalComponentThemePart, withComponentTheme } from './chunk-DRDDQCDD.js';
+import { usePortalContainer } from './chunk-ULTDRMGN.js';
+import './tokens-CEJVVA3G.css';
+import './shared-NJHRNLRH.css';
+import './Cascader-YBVDK6DC.css';
+import * as React from 'react';
+import { createPortal } from 'react-dom';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var collectPaths = (options, prefix = []) => options.flatMap((option) => {
+  const next = [...prefix, option];
+  if (option.children?.length) return collectPaths(option.children, next);
+  return [next];
+});
+var defaultSearchFilter = (inputValue, path) => {
+  const q = inputValue.trim().toLowerCase();
+  if (!q) return true;
+  return path.map(getCascaderOptionText).join(" / ").toLowerCase().includes(q);
+};
+function getCascaderOptionText(option) {
+  if (option.text) return option.text;
+  if (typeof option.label === "string" || typeof option.label === "number") {
+    return String(option.label);
+  }
+  return option.value;
+}
+function getCascaderPathAriaLabel(path) {
+  return path.map((option) => option.ariaLabel ?? getCascaderOptionText(option)).join(" / ");
+}
+var CascaderBase = React.forwardRef(({
+  options,
+  value,
+  defaultValue = [],
+  onChange,
+  placeholder = "\u8BF7\u9009\u62E9",
+  disabled,
+  allowClear,
+  onClear,
+  changeOnSelect,
+  showSearch,
+  optionRender,
+  selectedRender,
+  listHeight = 280,
+  popupStyle,
+  popupClassName = "",
+  dropdownClassName = "",
+  className = "",
+  id: fieldId,
+  "aria-invalid": ariaInvalid,
+  "aria-describedby": ariaDescribedBy,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-required": ariaRequired,
+  "aria-label": ariaLabel,
+  ...rest
+}, ref) => {
+  const [inner, setInner] = React.useState(() => Array.isArray(defaultValue) ? defaultValue : []);
+  const isControlled = value !== void 0;
+  const cur = isControlled ? Array.isArray(value) ? value : [] : inner;
+  const [innerOpen, setInnerOpen] = React.useState(false);
+  const open = innerOpen && !disabled;
+  const [path, setPath] = React.useState(cur);
+  const [query, setQuery] = React.useState("");
+  const searchRef = React.useRef(null);
+  const portalContainer = usePortalContainer();
+  const portalTheme = useComponentPortalTheme("Cascader");
+  const panelId = React.useId();
+  const searchConfig = typeof showSearch === "object" ? showSearch : {};
+  const searchable = !!showSearch;
+  const mergedListHeight = Number.isFinite(listHeight) && listHeight > 0 ? listHeight : 280;
+  const { triggerRef, floatingRef: panelRef, floatingStyle, zIndex: panelZIndex } = useFloating({
+    open,
+    placement: "bottom",
+    panelWidth: 520,
+    panelHeight: mergedListHeight + (searchable ? 58 : 12)
+  });
+  useOverlayLayer({
+    open: open && portalContainer != null,
+    containerRef: panelRef,
+    ownerRef: triggerRef,
+    zIndex: panelZIndex,
+    onEscape: () => setInnerOpen(false),
+    restoreFocus: true
+  });
+  const setTriggerRef = React.useCallback(
+    (node) => {
+      triggerRef.current = node;
+      if (typeof ref === "function") ref(node);
+      else if (ref) ref.current = node;
+    },
+    [ref, triggerRef]
+  );
+  React.useEffect(() => {
+    if (disabled) setInnerOpen(false);
+  }, [disabled]);
+  React.useEffect(() => {
+    const h = (e) => {
+      const t = e.target;
+      if (triggerRef.current?.contains(t)) return;
+      if (panelRef.current?.contains(t)) return;
+      setInnerOpen(false);
+    };
+    document.addEventListener("mousedown", h);
+    return () => document.removeEventListener("mousedown", h);
+  }, []);
+  React.useEffect(() => {
+    if (open) setPath(cur);
+    if (!open) setQuery("");
+  }, [open, cur]);
+  React.useEffect(() => {
+    if (!open || !searchable) return;
+    requestAnimationFrame(() => searchRef.current?.focus());
+  }, [open, searchable]);
+  const columns = [options];
+  let cursor = options;
+  for (const v of path) {
+    const match = cursor.find((o) => o.value === v);
+    if (match && match.children) {
+      cursor = match.children;
+      columns.push(cursor);
+    } else break;
+  }
+  const selectedOptionsForPath = (nextPath) => {
+    const selected = [];
+    let list = options;
+    for (const item of nextPath) {
+      const match = list.find((option) => option.value === item);
+      if (!match) break;
+      selected.push(match);
+      list = match.children ?? [];
+    }
+    return selected;
+  };
+  const commit = (nextPath, closeAfterSelect) => {
+    if (disabled) return;
+    const selectedOptions2 = selectedOptionsForPath(nextPath);
+    if (nextPath.length > 0 && (selectedOptions2.length !== nextPath.length || selectedOptions2.some((option) => option.disabled))) {
+      return;
+    }
+    if (!isControlled) setInner(nextPath);
+    onChange?.(nextPath, selectedOptions2);
+    if (closeAfterSelect) setInnerOpen(false);
+  };
+  const pick = (depth, val, hasChildren) => {
+    if (disabled) return;
+    const np = [...path.slice(0, depth), val];
+    setPath(np);
+    if (!hasChildren || changeOnSelect) commit(np, !hasChildren);
+  };
+  const clear = (e) => {
+    e.stopPropagation();
+    if (disabled) return;
+    setPath([]);
+    if (!isControlled) setInner([]);
+    onChange?.([], []);
+    onClear?.();
+  };
+  const selectedOptions = selectedOptionsForPath(cur);
+  const labels = selectedOptions.map((option) => option.label);
+  const allPaths = React.useMemo(() => collectPaths(options), [options]);
+  const matchedPaths = React.useMemo(() => {
+    if (!query.trim()) return [];
+    const filter = searchConfig.filter ?? defaultSearchFilter;
+    const result = allPaths.filter(
+      (itemPath) => itemPath.every((option) => !option.disabled) && filter(query, itemPath)
+    );
+    const limit = searchConfig.limit === false ? result.length : searchConfig.limit ?? 50;
+    return result.slice(0, limit);
+  }, [allPaths, query, searchConfig.filter, searchConfig.limit]);
+  const panelClassName = [
+    "cascader-panel",
+    searchable && "with-search",
+    optionRender && "custom-options",
+    popupClassName,
+    dropdownClassName
+  ].filter(Boolean).join(" ");
+  const panelStyle = {
+    ...floatingStyle,
+    ...portalTheme.style,
+    ...portalTheme.styles.popup,
+    ["--cascader-list-height"]: `${mergedListHeight}px`,
+    ...popupStyle
+  };
+  return /* @__PURE__ */ jsxs("div", { ref: setTriggerRef, className: `cascader ${open ? "open" : ""} ${className}`, ...rest, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: `cascader-trigger ${labels.length === 0 ? "placeholder" : ""}`,
+        disabled,
+        onClick: () => !disabled && setInnerOpen((current) => !current),
+        onKeyDown: (event) => {
+          if (event.key === "Escape" && open) {
+            event.preventDefault();
+            setInnerOpen(false);
+          } else if (event.key === "ArrowDown" && !open) {
+            event.preventDefault();
+            setInnerOpen(true);
+          } else if ((event.key === "Delete" || event.key === "Backspace") && allowClear && labels.length) {
+            event.preventDefault();
+            clear(event);
+          }
+        },
+        "aria-haspopup": "dialog",
+        id: fieldId,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-invalid": ariaInvalid,
+        "aria-required": ariaRequired,
+        "aria-describedby": ariaDescribedBy,
+        "aria-expanded": open,
+        "aria-controls": open ? panelId : void 0,
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "cascader-value", children: labels.length ? selectedRender?.(selectedOptions, cur) ?? labels.map((label, index) => /* @__PURE__ */ jsxs("span", { children: [
+            index > 0 && " / ",
+            label
+          ] }, index)) : placeholder }),
+          !!allowClear && labels.length > 0 && !disabled && /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: "cascader-clear",
+              "aria-label": "Clear",
+              "aria-hidden": "true",
+              onClick: clear,
+              children: /* @__PURE__ */ jsx(Icon, { name: "x", size: 12 })
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { style: { position: "absolute", right: 12, color: "var(--lmn-cascader-fg-subtle, var(--fg-subtle))" }, children: /* @__PURE__ */ jsx(Icon, { name: "chevDown", size: 14 }) })
+        ]
+      }
+    ),
+    open && portalContainer && createPortal(
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ref: panelRef,
+          id: panelId,
+          role: "dialog",
+          "aria-label": "\u7EA7\u8054\u9009\u62E9",
+          className: panelClassName,
+          ...portalTheme.dataAttributes,
+          style: panelStyle,
+          children: [
+            searchable && /* @__PURE__ */ jsx("div", { className: "cascader-search", children: /* @__PURE__ */ jsx(InternalComponentThemePart, { components: "Input", children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                ref: searchRef,
+                size: "sm",
+                leadingIcon: "search",
+                value: query,
+                onValueChange: setQuery,
+                placeholder: "\u641C\u7D22...",
+                "aria-label": "\u641C\u7D22\u7EA7\u8054\u9009\u9879"
+              }
+            ) }) }),
+            searchable && query.trim() ? /* @__PURE__ */ jsx("div", { className: "cascader-search-list", role: "listbox", children: matchedPaths.length === 0 ? /* @__PURE__ */ jsx("div", { className: "cascader-empty", children: "\u6682\u65E0\u5339\u914D\u9879" }) : matchedPaths.map((itemPath) => /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                role: "option",
+                "aria-label": getCascaderPathAriaLabel(itemPath),
+                className: "cascader-search-item",
+                onClick: () => commit(itemPath.map((item) => item.value), true),
+                children: searchConfig.render ? searchConfig.render(query, itemPath) : itemPath.map((item) => item.label).map((label, index) => /* @__PURE__ */ jsxs(React.Fragment, { children: [
+                  index > 0 && /* @__PURE__ */ jsx("span", { className: "cascader-path-sep", children: "/" }),
+                  /* @__PURE__ */ jsx("span", { children: label })
+                ] }, index))
+              },
+              itemPath.map((item) => item.value).join("__")
+            )) }) : /* @__PURE__ */ jsx("div", { className: "cascader-columns", children: columns.map((col, depth) => /* @__PURE__ */ jsx("div", { className: "cascader-col", role: "listbox", "aria-label": `\u7B2C ${depth + 1} \u7EA7`, children: col.map((o) => {
+              const isActive = path[depth] === o.value;
+              const hasChildren = !!(o.children && o.children.length);
+              return /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  role: "option",
+                  "aria-selected": isActive,
+                  "aria-label": o.ariaLabel ?? getCascaderOptionText(o),
+                  className: `cascader-item ${isActive ? "active" : ""}`,
+                  disabled: o.disabled,
+                  onClick: () => pick(depth, o.value, hasChildren),
+                  children: [
+                    optionRender ? /* @__PURE__ */ jsx("span", { className: "cascader-item-custom", children: optionRender(o, { depth, selected: isActive, hasChildren }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                      renderIconSlot(o.icon, { size: 13, className: "cascader-icon" }),
+                      /* @__PURE__ */ jsx("span", { className: "cascader-item-label", children: o.label })
+                    ] }),
+                    hasChildren && /* @__PURE__ */ jsx("span", { className: "chev", children: /* @__PURE__ */ jsx(Icon, { name: "chevRight", size: 12 }) })
+                  ]
+                },
+                o.value
+              );
+            }) }, depth)) })
+          ]
+        }
+      ),
+      portalContainer
+    )
+  ] });
+});
+CascaderBase.displayName = "Cascader";
+var Cascader = withComponentTheme(
+  CascaderBase,
+  "Cascader",
+  ["cascader", "input"]
+);
+
+export { Cascader };