@unicom-cloud/ui 0.8.156 → 0.8.158

package/input/Textarea.js

@@ -1,166 +1,176 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
-import { isNumber as e, isPlainObject as t } from "../utils/is.js";
-import n from "../hooks/use-merge-value/index.js";
-import r from "../utils/className.js";
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
+import { isNumber as e, isPlainObject as t, isUndefined as n } from "../utils/is.js";
+import r from "../hooks/use-controllable-value/index.js";
+import i from "../utils/className.js";
 import ee from "../hooks/use-merge-props/index.js";
 import te from "../config-provider/context.js";
-import { FormContext as ne, FormItemContext as i } from "../form/context.js";
-import a from "../icon-hover/index.js";
+import { FormContext as a, FormItemContext as ne } from "../form/context.js";
+import re from "../icon-hover/index.js";
 import "../config-provider/index.js";
-import { HYPHEN as re } from "../utils/string.js";
-import ie from "../hooks/use-isomorphic-layout-effect/index.js";
-import ae from "./useComposition.js";
-import { formatValue as o } from "./utils.js";
-import s from "../hooks/use-set-state/index.js";
-import c from "./autoSizeTextareaHeight.js";
-import l, { useContext as u, useImperativeHandle as oe, useMemo as se, useRef as ce, useState as le } from "react";
-import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
-import ue from "@unicom-cloud/icons/IconUiClose";
-var m = l.forwardRef((l, m) => {
-	let { prefixCls: de, getPrefixCls: fe, rtl: h, componentConfig: g } = u(te), _ = u(ne), v = u(i), y = fe?.("textarea"), b = ee(l, {}, g?.InputTextarea), { className: pe, style: me, wrapperStyle: he, placeholder: ge, disabled: x, error: _e, maxLength: S, showWordLimit: C, allowClear: w, onChange: T, onClear: E, onKeyDown: D, onPressEnter: O, status: k, clearIcon: A, autoSize: j, defaultValue: M, readOnly: N = v?.readOnly ?? _?.readOnly, ...P } = b, F = N ? re : ge, I = "defaultValue" in b, L = "value" in b, R = t(S) ? S.length : S, z = t(S) ? S.errorOnly ? void 0 : S.length : S, B = ce(void 0), [V, ve] = le({}), [H, U] = s({
+import ie from "../utils/getScrollBarHeight.js";
+import ae from "../utils/getScrollBarWidth.js";
+import { HYPHEN as o } from "../utils/string.js";
+import s from "../hooks/use-isomorphic-layout-effect/index.js";
+import c from "./useComposition.js";
+import { formatValue as l } from "./utils.js";
+import oe from "../hooks/use-set-state/index.js";
+import u from "./autoSizeTextareaHeight.js";
+import { forwardRef as d, useContext as f, useImperativeHandle as se, useMemo as ce, useRef as le, useState as ue } from "react";
+import { Fragment as de, jsx as p, jsxs as m } from "react/jsx-runtime";
+import fe from "@unicom-cloud/icons/IconUiClose";
+var h = d((d, h) => {
+	let { prefixCls: pe, getPrefixCls: g, rtl: _, componentConfig: me } = f(te), he = f(a), ge = f(ne), v = g?.("textarea"), y = ee(d, { wordLimitPosition: "inside" }, me?.InputTextarea), { className: _e, style: ve, wrapperStyle: ye, placeholder: be, disabled: b, error: xe, maxLength: x, showWordLimit: S, allowClear: C, onChange: w, onClear: T, onKeyDown: E, onPressEnter: D, status: O, clearIcon: k, wordLimitPosition: A = "inside", autoSize: j, defaultValue: M, readOnly: N = ge?.readOnly ?? he?.readOnly, onFocus: Se, onBlur: Ce, ...we } = y, Te = N ? o : be, Ee = "defaultValue" in y, P = "value" in y, F = t(x) ? x.length : x, I = t(x) ? x.errorOnly ? void 0 : x.length : x, L = le(null), [R, De] = ue({}), [z, B] = oe({
 		focus: !1,
 		blur: !0
-	}), [W, ye] = n("", {
-		defaultValue: I ? o(M, z) : void 0,
-		value: L ? o(b.value, z) : void 0
-	}), { compositionValue: be, compositionHandler: G, valueChangeHandler: xe, keyDownHandler: Se, triggerValueChangeCallback: Ce } = ae({
-		value: W,
-		maxLength: z,
-		onChange: T,
-		onKeyDown: D,
-		onPressEnter: O,
+	}), [V, Oe] = r({
+		defaultValue: Ee ? l(M, I) : void 0,
+		value: P ? l(y.value, I) : void 0
+	}, {
+		defaultValue: "",
+		triggerPropName: !1
+	}), { compositionValue: ke, compositionHandler: H, valueChangeHandler: Ae, keyDownHandler: je, triggerValueChangeCallback: Me } = c({
+		value: V,
+		maxLength: I,
+		onChange: w,
+		onKeyDown: E,
+		onPressEnter: D,
 		beforeTriggerValueChangeCallback: (e) => {
-			!L && (z === void 0 || e.length <= z) && ye(e);
+			!P && (n(I) || e.length <= I) && Oe(e);
 		}
-	}), K = be || W || "", q = N || x || b.resize === "none" || e(b.rows) || t(j) && e(j.minRows) && e(j.maxRows) && j.minRows === j.maxRows;
-	q ? V.resize = "none" : b.resize && (V.resize = b.resize);
-	let we = () => {
-		B.current?.select?.();
-	}, J = (e) => {
-		if (B.current && B.current.focus) {
-			if (B.current.setSelectionRange) {
-				let e = B.current.textContent.length;
-				B.current.setSelectionRange(e, e);
+	}), U = ke || V || "", W = N || b || y.resize === "none" || e(y.rows) || t(j) && e(j.minRows) && e(j.maxRows) && j.minRows === j.maxRows;
+	W ? R.resize = "none" : y.resize && (R.resize = y.resize);
+	let G = ae(L.current);
+	ie(L.current);
+	let Ne = () => {
+		L.current?.select?.();
+	}, K = (e) => {
+		if (L.current?.focus) {
+			if (L.current.setSelectionRange) {
+				let e = L.current.textContent.length;
+				L.current.setSelectionRange(e, e);
 			}
-			B.current.focus();
+			L.current.focus();
 		}
-	}, Te = () => {
-		B.current?.blur?.();
-	}, Ee = () => {
-		if ("rows" in b && b.rows) return;
-		let e = c(j, B.current);
-		e && ve(e);
-	}, Y = (e) => {
-		e.stopPropagation(), J(e), Ce("", e), E?.(e);
+	}, Pe = () => {
+		L.current?.blur?.();
+	}, Fe = () => {
+		if ("rows" in y && y.rows) return;
+		let e = u(j, L.current);
+		e && De(e);
+	}, q = (e) => {
+		e.stopPropagation(), K(e), Me("", e), T?.(e);
 	};
-	ie(() => {
-		Ee();
+	s(() => {
+		Fe();
 	}, [
-		K,
-		x,
-		b.autoSize
-	]), oe(m, () => ({
-		select: we,
-		focus: J,
-		blur: Te,
+		U,
+		b,
+		y.autoSize
+	]), se(h, () => ({
+		select: Ne,
+		focus: K,
+		blur: Pe,
 		getRootElement() {
-			return B.current;
+			return L.current;
 		}
 	}));
-	let X = W ? W.length : 0, De = R && C || w, Z = se(() => !z && R ? X > R : !1, [
-		X,
-		R,
-		z
-	]), Q = k || (_e || Z ? "error" : void 0), $ = /* @__PURE__ */ f("textarea", {
-		...P,
-		ref: B,
+	let J = V ? V.length : 0, Y = !!(F && S), Ie = Y || C, Le = Y && A === "inside", X = Y && A === "outside", [Re, ze] = _ ? [F, J] : [J, F], Be = Y ? `${Re}/${ze}` : "", Z = ce(() => !I && F ? J > F : !1, [
+		J,
+		F,
+		I
+	]), Q = O || (xe || Z ? "error" : void 0), $ = /* @__PURE__ */ p("textarea", {
+		...we,
+		ref: L,
 		style: {
-			...me,
-			...V,
-			...x ? { resize: "none" } : {}
+			...ve,
+			...R,
+			...b ? { resize: "none" } : {}
 		},
-		maxLength: z,
-		className: r(y, {
-			[`${y}-${Q}`]: Q,
-			[`${y}-focus`]: H.focus,
-			[`${y}-disabled`]: x,
-			[`${y}-readonly`]: N,
-			[`${y}-rtl`]: h,
-			[`${y}-status`]: k,
-			[`${y}-status-${k}`]: k,
-			[`${y}-resize-none`]: q
-		}, pe),
-		placeholder: F,
+		maxLength: I,
+		className: i(v, {
+			[`${v}-${Q}`]: Q,
+			[`${v}-focus`]: z.focus,
+			[`${v}-disabled`]: b,
+			[`${v}-readonly`]: N,
+			[`${v}-rtl`]: _,
+			[`${v}-status`]: O,
+			[`${v}-status-${O}`]: O,
+			[`${v}-resize-none`]: W
+		}, G > 0 && `${v}-has-scroll-bar`, _e),
+		placeholder: Te,
 		readOnly: N,
-		disabled: N || x,
-		value: K,
+		disabled: N || b,
+		value: U,
 		onFocus: (e) => {
-			U({
+			B({
 				focus: !0,
 				blur: !1
-			});
+			}), Se?.(e);
 		},
 		onBlur: (e) => {
-			U({
+			B({
 				focus: !1,
 				blur: !0
-			});
+			}), Ce?.(e);
 		},
-		onChange: xe,
-		onKeyDown: Se,
-		onCompositionStart: G,
-		onCompositionUpdate: G,
-		onCompositionEnd: G
-	});
-	if (De) {
+		onChange: Ae,
+		onKeyDown: je,
+		onCompositionStart: H,
+		onCompositionUpdate: H,
+		onCompositionEnd: H
+	}, "textarea");
+	if (Ie) {
+		let e;
 		if (!N) {
-			let e = !x && w && W, [t, n] = h ? [R, X] : [X, R];
-			if (e) {
-				let e, t = r(`${y}-clear-icon`, H.focus && `${y}-clear-icon-focus`);
-				e = A === void 0 ? /* @__PURE__ */ f(a, {
-					prefix: y,
-					className: t,
-					children: /* @__PURE__ */ f(ue, {
-						onClick: Y,
+			let t;
+			if (!b && C && V) {
+				let e = i(`${v}-clear-icon`, z.focus && `${v}-clear-icon-focus`, G > 0 && `${v}-clear-icon-has-scroll-bar`);
+				t = n(k) ? /* @__PURE__ */ p(re, {
+					prefix: v,
+					className: e,
+					children: /* @__PURE__ */ p(fe, {
+						onClick: q,
 						onMouseDown: (e) => {
 							e.preventDefault();
 						}
 					})
-				}) : /* @__PURE__ */ f("span", {
-					className: t,
-					onClick: Y,
+				}, "icon") : /* @__PURE__ */ p("span", {
+					className: e,
+					onClick: q,
 					onMouseDown: (e) => {
 						e.preventDefault();
 					},
-					children: A
-				}), $ = /* @__PURE__ */ p(d, { children: [$, e] });
+					children: k
+				}, "icon");
 			}
-			R && C && ($ = /* @__PURE__ */ p(d, { children: [$, /* @__PURE__ */ p("span", {
-				className: r(`${y}-word-limit`, { [`${y}-word-limit-error`]: Z }),
-				children: [
-					t,
-					"/",
-					n
-				]
-			})] }));
+			let r;
+			Y && (r = /* @__PURE__ */ p("span", {
+				className: i(`${v}-word-limit`, {
+					[`${v}-word-limit-inside`]: Le,
+					[`${v}-word-limit-outside`]: X,
+					[`${v}-word-limit-error`]: Z
+				}, G > 0 && `${v}-word-limit-has-scroll-bar`),
+				children: Be
+			}, "limit")), e = /* @__PURE__ */ m(de, { children: [t, r] });
 		}
-		$ = /* @__PURE__ */ f("div", {
-			style: { ...he },
-			className: r(`${y}-wrapper`, {
-				[`${y}-clear-wrapper`]: w,
-				[`${y}-wrapper-rtl`]: h,
-				[`${y}-wrapper-focus`]: H.focus,
-				[`${y}-wrapper-disabled`]: x,
-				[`${y}-wrapper-readonly`]: N,
-				[`${y}-wrapper-status`]: k,
-				[`${y}-wrapper-status-${k}`]: k
+		return /* @__PURE__ */ m("div", {
+			style: { ...ye },
+			className: i(`${v}-wrapper`, {
+				[`${v}-clear-wrapper`]: C,
+				[`${v}-wrapper-word-limit-outside`]: X,
+				[`${v}-wrapper-rtl`]: _,
+				[`${v}-wrapper-focus`]: z.focus,
+				[`${v}-wrapper-disabled`]: b,
+				[`${v}-wrapper-readonly`]: N,
+				[`${v}-wrapper-status`]: O,
+				[`${v}-wrapper-status-${O}`]: O
 			}),
-			children: $
+			children: [$, e]
 		});
 	}
 	return $;
 });
-m.displayName = "Textarea";
+h.displayName = "Textarea";
 //#endregion
-export { m as default };
+export { h as default };
 /* 独立思考，明辨是非 */

package/input/autoSizeTextareaHeight.js

@@ -1,4 +1,4 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
 import { isNumber as e, isPlainObject as t } from "../utils/is.js";
 //#region components/pc/input/autoSizeTextareaHeight.ts
 var n = [

package/input/index.d.ts

@@ -1,23 +1,25 @@
+import InputNumber from '../input-number';
+import InputTag from '../input-tag';
 import InputButton from './Button';
-import Group from './Group';
+import InputGroup from './Group';
+import InputComponent from './InputComponent';
 import type { InputPasswordProps, InputProps, InputSearchProps, RefInputType, TextareaProps } from './interface';
-import InputNumber from './Number';
-import Password from './Password';
-import Search from './Search';
-import InputTag from './Tag';
+import InputPassword from './Password';
+import InputSearch from './Search';
 import type { RefTextareaType } from './Textarea';
-import Textarea from './Textarea';
+import InputTextarea from './Textarea';
 declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("@unicom-cloud/ui-common/hooks/use-merge-props").MergePropsOptions & import("react").RefAttributes<RefInputType>> & {
     Search: import("react").ForwardRefExoticComponent<InputSearchProps & import("react").RefAttributes<RefInputType>>;
     Textarea: import("react").ForwardRefExoticComponent<TextareaProps & import("react").RefAttributes<RefTextareaType>>;
     Button: import("react").ForwardRefExoticComponent<import("./interface").InputButtonProps & import("react").RefAttributes<RefInputType>>;
     Password: import("react").ForwardRefExoticComponent<InputPasswordProps & import("react").RefAttributes<RefInputType>>;
     Number: import("react").ForwardRefExoticComponent<import("..").InputNumberProps & import("react").RefAttributes<RefInputType>>;
-    Tag: import("react").ForwardRefExoticComponent<import("..").InputTagProps<any> & import("react").RefAttributes<import("../interface").FocusAndBlur & import("../interface").GetRootElement>>;
+    Tag: import("react").ForwardRefExoticComponent<import("..").InputTagProps<string | import("../input-tag/interface").ObjectValueType> & import("react").RefAttributes<import("../interface").FocusAndBlur & import("../interface").GetRootElement>>;
     Group: import("react").ForwardRefExoticComponent<import("./interface").InputGroupProps & {
         children?: import("react").ReactNode | undefined;
     } & import("react").RefAttributes<HTMLDivElement>>;
+    Component: import("react").ForwardRefExoticComponent<import("./interface").InputComponentProps & import("react").RefAttributes<RefInputType>>;
 };
-export { InputButton, Group as InputGroup, InputNumber, Password as InputPassword, Search as InputSearch, InputTag, Textarea as InputTextarea, Textarea, };
+export { InputButton, InputComponent, InputGroup, InputNumber, InputPassword, InputSearch, InputTag, InputTextarea, InputTextarea as Textarea, };
 export default Input;
 export type { InputPasswordProps, InputProps, InputSearchProps, RefInputType, RefTextareaType, TextareaProps, };

package/input/index.js

@@ -1,23 +1,25 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
 import e from "./Group.js";
-import t from "./Input.js";
-import n from "./Button.js";
-import r from "./Number.js";
-import i from "./Password.js";
-import a from "./Search.js";
-import o from "./Tag.js";
-import s from "./Textarea.js";
+import t from "./InputComponent.js";
+import n from "./Input.js";
+import r from "../input-number/index.js";
+import i from "../input-tag/index.js";
+import a from "./Button.js";
+import o from "./Password.js";
+import s from "./Search.js";
+import c from "./Textarea.js";
 //#region components/pc/input/index.tsx
-var c = Object.assign(t, {
-	Search: a,
-	Textarea: s,
-	Button: n,
-	Password: i,
+var l = Object.assign(n, {
+	Search: s,
+	Textarea: c,
+	Button: a,
+	Password: o,
 	Number: r,
-	Tag: o,
-	Group: e
+	Tag: i,
+	Group: e,
+	Component: t
 });
-c.TextArea = c.Textarea, c.InputNumber = c.Number;
+l.TextArea = l.Textarea, l.InputNumber = l.Number;
 //#endregion
-export { n as InputButton, e as InputGroup, r as InputNumber, i as InputPassword, a as InputSearch, o as InputTag, s as InputTextarea, s as Textarea, c as default };
+export { a as InputButton, t as InputComponent, e as InputGroup, r as InputNumber, o as InputPassword, s as InputSearch, i as InputTag, c as InputTextarea, c as Textarea, l as default };
 /* 独立思考，明辨是非 */

package/input/interface.d.ts

@@ -8,7 +8,7 @@ import type { FocusAndBlur, ReadOnly, Size } from '../interface';
  */
 export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'prefix' | 'className' | 'size' | 'height' | 'maxLength'>, ReadOnly, Size {
     style?: CSSProperties;
-    className?: string | string[];
+    className?: string;
     /**
      * @zh 允许清空输入框
      * @en Whether allow clear value
@@ -144,7 +144,7 @@ export interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaE
      * @en With `showWordLimit`, a `div` will be outside the `textarea` tag, and `wrapperStyle` is used to configure the style of it.
      */
     wrapperStyle?: CSSProperties;
-    className?: string | string[];
+    className?: string;
     /**
      * @zh 是否禁用
      * @en Whether the textarea is disabled
@@ -206,7 +206,12 @@ export interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaE
         length: number;
         errorOnly?: boolean;
     };
-    showWordLimit?: boolean;
+    showWordLimit?: InputProps['showWordLimit'];
+    /**
+     * @zh 字数统计的位置
+     * @en The position of the word count
+     */
+    wordLimitPosition?: 'inside' | 'outside';
     /**
      * @zh 允许清空输入框
      * @en Whether allow clear the content
@@ -228,7 +233,7 @@ export interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaE
  */
 export interface InputGroupProps {
     style?: CSSProperties;
-    className?: string | string[];
+    className?: string;
     /**
      * @zh 是否使用紧凑模式
      * @en Whether to use compact mode

package/input/useComposition.d.ts

@@ -1,7 +1,7 @@
 import { ChangeEventHandler, CompositionEventHandler, KeyboardEventHandler } from 'react';
 import type { InputProps, TextareaProps } from './interface';
 declare function useComposition({ value, maxLength, onChange, onKeyDown, onPressEnter, beforeTriggerValueChangeCallback, normalizeHandler, }: {
-    value: string;
+    value?: string;
     maxLength: number;
     onChange: InputProps['onChange'];
     onKeyDown: InputProps['onKeyDown'] | TextareaProps['onKeyDown'];

package/input/useComposition.js

@@ -1,31 +1,31 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
-import { Enter as e } from "../utils/keyboardCode.js";
-import { useRef as t, useState as n } from "react";
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
+import { isFunction as e, isUndefined as t } from "../utils/is.js";
+import { Enter as n } from "../utils/keyboardCode.js";
+import { useRef as r, useState as i } from "react";
 //#region components/pc/input/useComposition.ts
-function r({ value: r, maxLength: i, onChange: a, onKeyDown: o, onPressEnter: s, beforeTriggerValueChangeCallback: c, normalizeHandler: l }) {
-	let u = t(!1), [d, f] = n(""), p = (e, t) => {
-		c && c(e), e !== r && (i === void 0 || e.length <= i) && a?.(e, t);
+function a({ value: a, maxLength: o, onChange: s, onKeyDown: c, onPressEnter: l, beforeTriggerValueChangeCallback: u, normalizeHandler: d }) {
+	let f = r(!1), [p, m] = i(""), h = (n, r) => {
+		e(u) && u(n), n !== a && (t(o) || n.length <= o) && e(s) && s(n, r);
 	};
 	return {
-		compositionValue: d,
-		triggerValueChangeCallback: p,
+		compositionValue: p,
+		triggerValueChangeCallback: h,
 		compositionHandler: (e) => {
-			u.current = e.type !== "compositionend", u.current || (f(void 0), p(e.target.value, e));
+			f.current = e.type !== "compositionend", f.current || (m(void 0), h(e.target.value, e));
 		},
 		valueChangeHandler: (e) => {
 			let t = e.target.value;
-			u.current ? (u.current = !1, f(t)) : (d && f(void 0), p(t, e));
+			f.current ? (f.current = !1, m(t)) : (p && m(void 0), h(t, e));
 		},
 		keyDownHandler: (t) => {
-			let n = t.key;
-			if (!u.current && (o?.(t), n === e.key)) {
-				s?.(t);
-				let e = l?.("onPressEnter");
-				e && p(e(t.target.value), t);
+			let r = t.key;
+			if (!f.current && (e(c) && c(t), r === n.key && (e(l) && l(t), e(d)))) {
+				let n = d("onPressEnter");
+				e(n) && h(n(t.target.value), t);
 			}
 		}
 	};
 }
 //#endregion
-export { r as default };
+export { a as default };
 /* 独立思考，明辨是非 */

package/input/utils.js

@@ -1,4 +1,4 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
 import { isNil as e, isString as t } from "../utils/is.js";
 //#region components/pc/input/utils.ts
 function n(n, r) {

package/input-number/InputNumber.d.ts

@@ -1,6 +1,5 @@
-import React from 'react';
 import type { RefInputType } from '../input/interface';
 import type { InputNumberProps } from './interface';
-declare const InputNumberComponent: React.ForwardRefExoticComponent<InputNumberProps & React.RefAttributes<RefInputType>>;
+declare const InputNumberComponent: import("react").ForwardRefExoticComponent<InputNumberProps & import("react").RefAttributes<RefInputType>>;
 export default InputNumberComponent;
 export type { InputNumberProps };