@fangxinyan/lumina 0.6.1 → 0.6.2

package/dist/chunk-WGZ2KJTZ.js

@@ -0,0 +1,81 @@
+import { Icon } from './chunk-OF3SGLZY.js';
+import './tokens-BIIUTPKN.css';
+import './shared-NJHRNLRH.css';
+import './Textarea-YNET7IBH.css';
+import * as React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Textarea = React.forwardRef(
+  ({
+    value,
+    defaultValue,
+    onChange,
+    onValueChange,
+    invalid,
+    allowClear,
+    maxLength,
+    showCount,
+    className = "",
+    ...rest
+  }, ref) => {
+    const [inner, setInner] = React.useState(defaultValue ?? "");
+    const isControlled = value !== void 0;
+    const currentValue = isControlled ? value : inner;
+    const disabled = rest.disabled;
+    const handleChange = (e) => {
+      if (!isControlled) setInner(e.target.value);
+      onChange?.(e);
+      onValueChange?.(e.target.value, e);
+    };
+    const handleClear = (e) => {
+      e.stopPropagation();
+      if (disabled) return;
+      if (!isControlled) setInner("");
+      const synthetic = {
+        ...e,
+        target: { ...e.target, value: "" },
+        currentTarget: { ...e.currentTarget, value: "" }
+      };
+      onChange?.(synthetic);
+      onValueChange?.("", synthetic);
+    };
+    const cls = ["textarea", invalid && "invalid", className].filter(Boolean).join(" ");
+    const showClear = !!allowClear && !!currentValue && !disabled;
+    const count = currentValue ? currentValue.length : 0;
+    const field = /* @__PURE__ */ jsxs("div", { className: "textarea-wrap", children: [
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          ref,
+          className: cls,
+          value: isControlled ? value : void 0,
+          defaultValue: isControlled ? void 0 : defaultValue,
+          onChange: handleChange,
+          maxLength,
+          ...rest
+        }
+      ),
+      showClear && /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "textarea-clear",
+          role: "button",
+          "aria-label": "Clear",
+          tabIndex: -1,
+          onMouseDown: (e) => e.preventDefault(),
+          onClick: handleClear,
+          children: /* @__PURE__ */ jsx(Icon, { name: "x", size: 12 })
+        }
+      )
+    ] });
+    if (!showCount) return field;
+    return /* @__PURE__ */ jsxs("div", { className: "textarea-shell", children: [
+      field,
+      /* @__PURE__ */ jsx("div", { className: "textarea-count", children: maxLength != null ? `${count} / ${maxLength}` : `${count}` })
+    ] });
+  }
+);
+Textarea.displayName = "Textarea";
+var TextArea = Textarea;
+
+export { TextArea, Textarea };

package/dist/{chunk-RPFMQZA5.js → chunk-WKKSAGYH.js}

@@ -1,18 +1,20 @@
-import { Tag } from './chunk-TWGQZX2R.js';
+import { Tag } from './chunk-DQTSTJ6O.js';
 import { useFloating } from './chunk-DUFRASGO.js';
-import { Icon } from './chunk-NJ6B22YJ.js';
+import { Input } from './chunk-XTIN5545.js';
+import { Icon } from './chunk-OF3SGLZY.js';
 import './tokens-BIIUTPKN.css';
 import './shared-NJHRNLRH.css';
-import './Select-J3CCVFJ7.css';
+import './Select-JVBQAZBG.css';
 import * as React from 'react';
 import { createPortal } from 'react-dom';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 var isGroup = (it) => Array.isArray(it.options);
 var flatten = (items) => items.flatMap((it) => isGroup(it) ? it.options : [it]);
-var defaultFilter = (input, opt) => {
+var defaultFilter = (input, opt, optionFilterProp) => {
   const q = input.toLowerCase();
-  const txt = opt.text ?? (typeof opt.label === "string" ? opt.label : String(opt.value));
+  const propValue = optionFilterProp ? opt[optionFilterProp] : void 0;
+  const txt = propValue != null ? String(propValue) : opt.text ?? (typeof opt.label === "string" ? opt.label : String(opt.value));
   return txt.toLowerCase().includes(q);
 };
 var SelectInner = (props, forwardedRef) => {
@@ -23,8 +25,11 @@ var SelectInner = (props, forwardedRef) => {
     size = "md",
     invalid,
     clearable,
+    allowClear,
     searchable,
+    showSearch,
     filterOption,
+    optionFilterProp,
     loading,
     emptyContent,
     open: openProp,
@@ -32,6 +37,8 @@ var SelectInner = (props, forwardedRef) => {
     onOpenChange,
     className = "",
     menuClassName = "",
+    popupClassName = "",
+    dropdownClassName = "",
     onKeyDown: onRootKeyDown,
     multiple,
     value: _value,
@@ -42,6 +49,9 @@ var SelectInner = (props, forwardedRef) => {
     ...rest
   } = props;
   const isMulti = multiple === true;
+  const mergedClearable = clearable ?? !!allowClear;
+  const mergedSearchable = searchable ?? !!showSearch;
+  const mergedMenuClassName = [menuClassName, popupClassName, dropdownClassName].filter(Boolean).join(" ");
   const [innerSingle, setInnerSingle] = React.useState(
     !isMulti ? props.defaultValue : void 0
   );
@@ -89,17 +99,18 @@ var SelectInner = (props, forwardedRef) => {
     return () => document.removeEventListener("mousedown", h);
   }, [open]);
   React.useEffect(() => {
-    if (open && searchable) {
+    if (open && mergedSearchable) {
       requestAnimationFrame(() => searchRef.current?.focus());
     }
     if (!open) setActiveIdx(-1);
-  }, [open, searchable]);
+  }, [open, mergedSearchable]);
   const allFlat = React.useMemo(() => flatten(options), [options]);
   const filteredFlat = React.useMemo(() => {
     if (!query.trim()) return allFlat;
-    const f = filterOption ?? defaultFilter;
+    if (filterOption === false) return allFlat;
+    const f = typeof filterOption === "function" ? filterOption : (input, option) => defaultFilter(input, option, optionFilterProp);
     return allFlat.filter((o) => f(query, o));
-  }, [allFlat, query, filterOption]);
+  }, [allFlat, query, filterOption, optionFilterProp]);
   const filteredItems = React.useMemo(() => {
     if (!query.trim()) return options;
     return options.map((it) => {
@@ -131,8 +142,10 @@ var SelectInner = (props, forwardedRef) => {
     if (isMulti) {
       if (!multiControlled) setInnerMulti([]);
       props.onChange?.([]);
+      props.onClear?.();
     } else {
       if (!singleControlled) setInnerSingle(void 0);
+      props.onChange?.(void 0);
       props.onClear?.();
     }
   };
@@ -210,7 +223,7 @@ var SelectInner = (props, forwardedRef) => {
     ] });
   };
   const hasSelection = isMulti ? (multiValue?.length ?? 0) > 0 : singleValue !== void 0;
-  const showClear = clearable && hasSelection && !disabled;
+  const showClear = mergedClearable && hasSelection && !disabled;
   let renderIdx = -1;
   const renderOption = (o) => {
     renderIdx += 1;
@@ -271,30 +284,28 @@ var SelectInner = (props, forwardedRef) => {
             "div",
             {
               ref: menuRef,
-              className: `menu ${menuClassName}`,
+              className: `menu ${mergedMenuClassName}`,
               role: "listbox",
               "aria-multiselectable": isMulti || void 0,
               style: floatingStyle,
               children: [
-                searchable && /* @__PURE__ */ jsxs("div", { className: "menu-search", children: [
-                  /* @__PURE__ */ jsx(Icon, { name: "search", size: 13 }),
-                  /* @__PURE__ */ jsx(
-                    "input",
-                    {
-                      ref: searchRef,
-                      type: "text",
-                      value: query,
-                      placeholder: "\u641C\u7D22...",
-                      onChange: (e) => setQuery(e.target.value),
-                      onKeyDown: (e) => {
-                        if (e.key === "Escape" || e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "Enter") {
-                          e.preventDefault();
-                          onKeyDown(e);
-                        }
+                mergedSearchable && /* @__PURE__ */ jsx("div", { className: "menu-search", children: /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    ref: searchRef,
+                    size: "sm",
+                    leadingIcon: "search",
+                    value: query,
+                    placeholder: "\u641C\u7D22...",
+                    onValueChange: setQuery,
+                    onKeyDown: (e) => {
+                      if (e.key === "Escape" || e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "Enter") {
+                        e.preventDefault();
+                        onKeyDown(e);
                       }
                     }
-                  )
-                ] }),
+                  }
+                ) }),
                 loading ? /* @__PURE__ */ jsxs("div", { className: "menu-state", children: [
                   /* @__PURE__ */ jsx("span", { className: "menu-state-ico", children: /* @__PURE__ */ jsx("span", { className: "spinner" }) }),
                   /* @__PURE__ */ jsx("span", { children: "\u52A0\u8F7D\u4E2D..." })

package/dist/{chunk-54YLXXS2.js → chunk-XD3JGL5O.js}

@@ -1,4 +1,4 @@
-import { Input } from './chunk-DPNDHNKK.js';
+import { Input } from './chunk-XTIN5545.js';
 import './tokens-BIIUTPKN.css';
 import './shared-NJHRNLRH.css';
 import './CommandPalette-T45DBMPY.css';
@@ -131,7 +131,7 @@ var CommandPalette = React.forwardRef(({
               leadingIcon: "search",
               placeholder,
               value: query,
-              onChange: (v) => setQuery(v),
+              onValueChange: (v) => setQuery(v),
               onKeyDown: onKey,
               suffix: /* @__PURE__ */ jsx("span", { className: "cmdp-kbd", children: "esc" })
             }

package/dist/{chunk-DPNDHNKK.js → chunk-XTIN5545.js}

@@ -1,15 +1,17 @@
-import { Icon } from './chunk-NJ6B22YJ.js';
+import { Textarea } from './chunk-WGZ2KJTZ.js';
+import { Icon } from './chunk-OF3SGLZY.js';
 import './tokens-BIIUTPKN.css';
 import './shared-NJHRNLRH.css';
-import './Input-33CAH4O6.css';
+import './Input-3G4ONWNU.css';
 import * as React from 'react';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
-var Input = React.forwardRef(
+var InputBase = React.forwardRef(
   ({
     value,
     defaultValue,
     onChange,
+    onValueChange,
     placeholder,
     leadingIcon,
     trailingIcon,
@@ -27,8 +29,17 @@ var Input = React.forwardRef(
     ...rest
   }, ref) => {
     const [inner, setInner] = React.useState(defaultValue ?? "");
+    const inputRef = React.useRef(null);
     const isControlled = value !== void 0;
     const currentValue = isControlled ? value : inner;
+    const setInputRef = React.useCallback(
+      (node) => {
+        inputRef.current = node;
+        if (typeof ref === "function") ref(node);
+        else if (ref) ref.current = node;
+      },
+      [ref]
+    );
     const wrapCls = [
       "input-wrap",
       size !== "md" && size,
@@ -42,18 +53,21 @@ var Input = React.forwardRef(
     } : void 0;
     const handleChange = (e) => {
       if (!isControlled) setInner(e.target.value);
-      onChange?.(e.target.value, e);
+      onChange?.(e);
+      onValueChange?.(e.target.value, e);
     };
     const handleClear = (e) => {
       e.stopPropagation();
       if (disabled) return;
       if (!isControlled) setInner("");
+      if (inputRef.current) inputRef.current.value = "";
       const synthetic = {
         ...e,
-        target: { ...e.target, value: "" },
-        currentTarget: { ...e.currentTarget, value: "" }
+        target: inputRef.current ?? { value: "" },
+        currentTarget: inputRef.current ?? { value: "" }
       };
-      onChange?.("", synthetic);
+      onChange?.(synthetic);
+      onValueChange?.("", synthetic);
     };
     const showClear = !!allowClear && !!currentValue && !disabled;
     const count = currentValue ? currentValue.length : 0;
@@ -71,7 +85,7 @@ var Input = React.forwardRef(
       /* @__PURE__ */ jsx(
         "input",
         {
-          ref,
+          ref: setInputRef,
           className: "input",
           value: isControlled ? value : void 0,
           defaultValue: isControlled ? void 0 : defaultValue,
@@ -112,74 +126,56 @@ var Input = React.forwardRef(
     ] });
   }
 );
-Input.displayName = "Input";
-var Textarea = React.forwardRef(
+InputBase.displayName = "Input";
+var InputPassword = React.forwardRef(
   ({
-    value,
-    defaultValue,
-    onChange,
-    invalid,
-    allowClear,
-    maxLength,
-    showCount,
-    className = "",
+    visibilityToggle = true,
+    iconRender,
+    suffix,
+    onValueChange,
     ...rest
   }, ref) => {
-    const [inner, setInner] = React.useState(defaultValue ?? "");
-    const isControlled = value !== void 0;
-    const currentValue = isControlled ? value : inner;
-    const disabled = rest.disabled;
-    const handleChange = (e) => {
-      if (!isControlled) setInner(e.target.value);
-      onChange?.(e.target.value, e);
-    };
-    const handleClear = (e) => {
+    const [visible, setVisible] = React.useState(false);
+    const renderedIcon = iconRender?.(visible);
+    const useCustomToggle = visibilityToggle !== false && !!renderedIcon;
+    const useDefaultToggle = visibilityToggle !== false && !renderedIcon;
+    const toggle = (e) => {
+      e.preventDefault();
       e.stopPropagation();
-      if (disabled) return;
-      if (!isControlled) setInner("");
-      const synthetic = {
-        ...e,
-        target: { ...e.target, value: "" },
-        currentTarget: { ...e.currentTarget, value: "" }
-      };
-      onChange?.("", synthetic);
+      setVisible((v) => !v);
     };
-    const cls = ["textarea", invalid && "invalid", className].filter(Boolean).join(" ");
-    const showClear = !!allowClear && !!currentValue && !disabled;
-    const count = currentValue ? currentValue.length : 0;
-    const field = /* @__PURE__ */ jsxs("div", { className: "textarea-wrap", children: [
-      /* @__PURE__ */ jsx(
-        "textarea",
-        {
-          ref,
-          className: cls,
-          value: isControlled ? value : void 0,
-          defaultValue: isControlled ? void 0 : defaultValue,
-          onChange: handleChange,
-          maxLength,
-          ...rest
-        }
-      ),
-      showClear && /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: "textarea-clear",
-          role: "button",
-          "aria-label": "Clear",
-          tabIndex: -1,
-          onMouseDown: (e) => e.preventDefault(),
-          onClick: handleClear,
-          children: /* @__PURE__ */ jsx(Icon, { name: "x", size: 12 })
-        }
-      )
-    ] });
-    if (!showCount) return field;
-    return /* @__PURE__ */ jsxs("div", { className: "input-shell", children: [
-      field,
-      /* @__PURE__ */ jsx("div", { className: "input-count", children: maxLength != null ? `${count} / ${maxLength}` : `${count}` })
-    ] });
+    const toggleNode = useCustomToggle ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "input-password-toggle",
+        tabIndex: -1,
+        onMouseDown: (e) => e.preventDefault(),
+        onClick: toggle,
+        "aria-label": visible ? "Hide password" : "Show password",
+        children: renderedIcon
+      }
+    ) : null;
+    return /* @__PURE__ */ jsx(
+      InputBase,
+      {
+        ref,
+        ...rest,
+        type: visible ? "text" : "password",
+        suffix: toggleNode ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          suffix,
+          toggleNode
+        ] }) : suffix,
+        trailingIcon: useDefaultToggle ? visible ? "eyeOff" : "eye" : void 0,
+        onTrailingIconClick: useDefaultToggle ? () => setVisible((v) => !v) : void 0,
+        onValueChange
+      }
+    );
   }
 );
-Textarea.displayName = "Textarea";
+InputPassword.displayName = "Input.Password";
+var Input = InputBase;
+Input.Password = InputPassword;
+Input.TextArea = Textarea;
 
-export { Input, Textarea };
+export { Input, InputPassword };

package/dist/{chunk-LZU33BX6.cjs → chunk-ZIP7F4UF.cjs}

@@ -1,9 +1,9 @@
 'use strict';
 
-var chunk2MNAZRWE_cjs = require('./chunk-2MNAZRWE.cjs');
+var chunkTJII7BQ2_cjs = require('./chunk-TJII7BQ2.cjs');
 require('./tokens-BIIUTPKN.css');
 require('./shared-NJHRNLRH.css');
-require('./Tag-FGDY3W7E.css');
+require('./Tag-LB3OOJAO.css');
 var React = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -48,7 +48,7 @@ var Tag = React__namespace.forwardRef(({
   ].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className: cls, ...rest, children: [
     dot && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "dot" }),
-    icon && /* @__PURE__ */ jsxRuntime.jsx(chunk2MNAZRWE_cjs.Icon, { name: icon, size: 11, className: "tag-ico" }),
+    icon && /* @__PURE__ */ jsxRuntime.jsx(chunkTJII7BQ2_cjs.Icon, { name: icon, size: 11, className: "tag-ico" }),
     children,
     removable && /* @__PURE__ */ jsxRuntime.jsx(
       "span",
@@ -60,27 +60,11 @@ var Tag = React__namespace.forwardRef(({
           e.stopPropagation();
           onRemove?.();
         },
-        children: /* @__PURE__ */ jsxRuntime.jsx(chunk2MNAZRWE_cjs.Icon, { name: "x", size: 11 })
+        children: /* @__PURE__ */ jsxRuntime.jsx(chunkTJII7BQ2_cjs.Icon, { name: "x", size: 11 })
       }
     )
   ] });
 });
 Tag.displayName = "Tag";
-var Badge = React__namespace.forwardRef(({
-  count,
-  dot,
-  tone = "danger",
-  children,
-  className = "",
-  ...rest
-}, ref) => {
-  const show = dot || typeof count === "number" && count > 0;
-  return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className: `badge-wrap ${className}`, ...rest, children: [
-    children,
-    show && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `badge ${tone} ${dot ? "dot" : ""}`, children: !dot && (count > 99 ? "99+" : count) })
-  ] });
-});
-Badge.displayName = "Badge";
 
-exports.Badge = Badge;
 exports.Tag = Tag;