@qsxy/element-plus-react 1.0.0-next.1 → 1.0.0-next.10

package/dist/Form/FormItem.d.ts

@@ -9,14 +9,22 @@ interface ChildProps {
 }
 export interface InternalFieldProps<Values = any> extends Omit<FormItemProps<Values>, 'children'> {
     children?: ComponentChildren | ((control: ChildProps, meta: Meta, form: FormInstance<Values>) => React.ReactElement);
+    /**
+     * Set up `dependencies` field.
+     * When dependencies field update and current field is touched,
+     * will trigger validate rules and render.
+     */
     dependencies?: NamePath[];
     getValueFromEvent?: (...args: EventArgs) => StoreValue;
+    /** 字段名，支持数组 */
     name?: InternalNamePath;
     normalize?: (value: StoreValue, prevValue: StoreValue, allValues: Store) => StoreValue;
+    /** 校验规则，设置字段的校验逻辑。点击此处查看示例 */
     rules?: Rule[];
     shouldUpdate?: ShouldUpdate<Values>;
     trigger?: string;
     validateTrigger?: string | string[] | false;
+    /** 当某一规则校验不通过时，是否停止剩下的规则的校验。设置 parallel 时会并行校验 */
     validateFirst?: boolean | 'parallel';
     valuePropName?: string;
     getValueProps?: (value: StoreValue) => Record<string, unknown>;
@@ -27,8 +35,12 @@ export interface InternalFieldProps<Values = any> extends Omit<FormItemProps<Val
         destroy?: boolean;
     }) => void;
     preserve?: boolean;
+    /** @private Passed by Form.List props. Do not use since it will break by path check. */
     isListField?: boolean;
+    /** @private Passed by Form.List props. Do not use since it will break by path check. */
     isList?: boolean;
+    /** @private Pass context as prop instead of context api
+     *  since class component can not get context in constructor */
     fieldContext?: InternalFormInstance;
 }
 export interface FieldProps<Values = any> extends Omit<InternalFieldProps<Values>, 'name' | 'fieldContext'> {

package/dist/Form/FormItem.js

@@ -377,13 +377,15 @@ var Field = class extends import_react.default.Component {
     };
     this.getValidateLable = () => {
       const { errorStyle, warningStyle } = this.props;
-      return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_Transition.Transition, { name: (0, import_classUtil.b)("slide-up"), visible: this.errors.length > 0, transitionAppear: true, unmountOnExit: true, display: "" }, /* @__PURE__ */ import_react.default.createElement("label", { className: import_classUtil.e`error`, style: errorStyle }, (0, import_head.default)(this.errors))), /* @__PURE__ */ import_react.default.createElement(import_Transition.Transition, { name: (0, import_classUtil.b)("slide-up"), visible: this.warnings.length > 0, transitionAppear: true, unmountOnExit: true, display: "" }, /* @__PURE__ */ import_react.default.createElement("label", { className: import_classUtil.e`warning`, style: warningStyle }, (0, import_head.default)(this.warnings))));
+      return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_Transition.Transition, { nodeRef: this.errorRef, name: (0, import_classUtil.b)("slide-up"), visible: this.errors.length > 0, transitionAppear: true, unmountOnExit: true, display: "" }, /* @__PURE__ */ import_react.default.createElement("label", { ref: this.errorRef, className: import_classUtil.e`error`, style: errorStyle }, (0, import_head.default)(this.errors))), /* @__PURE__ */ import_react.default.createElement(import_Transition.Transition, { nodeRef: this.warningRef, name: (0, import_classUtil.b)("slide-up"), visible: this.warnings.length > 0, transitionAppear: true, unmountOnExit: true, display: "" }, /* @__PURE__ */ import_react.default.createElement("label", { ref: this.warningRef, className: import_classUtil.e`warning`, style: warningStyle }, (0, import_head.default)(this.warnings))));
     };
     if (props.fieldContext) {
       const { getInternalHooks } = props.fieldContext;
       const { initEntityValue } = getInternalHooks(import_FieldContext.HOOK_MARK);
       initEntityValue(this);
     }
+    this.warningRef = (0, import_react.createRef)();
+    this.errorRef = (0, import_react.createRef)();
   }
   componentDidMount() {
     const { shouldUpdate, fieldContext } = this.props;

package/dist/Form/typings.d.ts

@@ -5,12 +5,15 @@ type BaseFormProps = Omit<React.AllHTMLAttributes<HTMLFormElement>, 'onSubmit' |
 type RenderProps = (values: Store, form: FormInstance) => React.ReactElement;
 export type FormRules = Record<string, Rule[]>;
 export interface FormProps<Values = any> extends BaseFormProps {
+    /** 经 Form.useForm() 创建的 form 控制实例，不提供时会自动创建 */
     form?: FormInstance<Values>;
     children?: RenderProps | ComponentChildren;
     component?: false | string | FC<any> | ComponentClass<any, any>;
     fields?: FieldData[];
+    /** 表单验证规则 */
     rules?: FormRules;
     name?: string;
+    /** 验证提示模板 */
     validateMessages?: ValidateMessages;
     onValuesChange?: Callbacks<Values>['onValuesChange'];
     onFieldsChange?: Callbacks<Values>['onFieldsChange'];
@@ -18,31 +21,55 @@ export interface FormProps<Values = any> extends BaseFormProps {
     onFinishFailed?: Callbacks<Values>['onFinishFailed'];
     validateTrigger?: string | string[] | false;
     preserve?: boolean;
+    /** 配置 Form.Item 的 colon 的默认值。表示是否显示 label 后面的冒号 */
     colon?: boolean;
+    /** 表单默认值，只有初始化以及重置时生效 */
     initialValues?: Store;
+    /** 表单域标签的位置， 如果值为 left 或者 right 时，则需要设置 label-width */
     labelPosition?: 'left' | 'right' | 'top';
+    /** 表单域标签的宽度，例如 '50px'。 作为 Form 直接子元素的 form-item 会继承该值。 支持 auto。 */
     labelWidth?: string | number;
+    /** 行内表单模式 */
     inline?: boolean;
+    /** 是否宽度100% */
     flat?: boolean;
+    /** 每行列数 */
+    /** 是否只读 */
     disabled?: boolean;
+    /** 用于控制该表单内组件的尺寸 */
     size?: TypeAttributes.Size;
     onChange?: (model: any) => void;
     formStyle?: React.CSSProperties;
     className?: string;
 }
 export interface FormItemProps<T> extends BaseProps, NativeProps {
+    /**
+     * 配合 label 属性使用，表示是否显示 label 后面的冒号
+     */
     colon?: boolean;
+    /** label 标签的文本 */
     label?: boolean | string | React.ReactElement;
+    /** 用于控制该表单内组件的尺寸 */
     size?: TypeAttributes.Size;
+    /** 标签的长度，例如 '50px'。 作为 Form 直接子元素的 form-item 会继承该值。 可以使用 auto。 */
     labelWidth?: string | number;
+    /** 必填样式设置。如不设置，则会根据校验规则自动生成 */
     required?: boolean;
+    /** 为 true 时不带样式，作为纯字段控件使用 */
     noStyle?: boolean;
+    /** 校验状态，如不设置，则会根据校验规则自动生成，可选：'success' 'warning' 'error' 'validating' */
     validateStatus?: 'success' | 'warning' | 'error' | 'validating';
+    /** 配置提示信息 */
     help?: string | React.ReactElement;
+    /** 是否标签宽度为0，等用于`labelWidth={0}`，如果同时设置了labelWidth，则此配置无效 */
     pure?: boolean;
+    /** 是否居中 */
     center?: boolean;
+    /** 文本自定义内联样式 */
     labelStyle?: React.CSSProperties;
+    /** 校验失败文本自定义内联样式 */
     errorStyle?: React.CSSProperties;
+    /** 校验警告自定义内联样式 */
     warningStyle?: React.CSSProperties;
 }
 export interface FieldEntity {
@@ -91,6 +118,9 @@ export interface Meta {
 export interface InternalFieldData extends Meta {
     value: StoreValue;
 }
+/**
+ * Used by `setFields` config
+ */
 export interface FieldData extends Partial<Omit<InternalFieldData, 'name'>> {
     name: NamePath;
 }
@@ -115,6 +145,7 @@ interface BaseRule {
     transform?: (value: StoreValue) => StoreValue;
     type?: RuleType;
     whitespace?: boolean;
+    /** Customize rule level `validateTrigger`. Must be subset of Field `validateTrigger` */
     validateTrigger?: string | string[];
     phone?: boolean;
 }
@@ -166,6 +197,10 @@ export interface ValidateOptions {
     label?: string | boolean | React.ReactElement<{}>;
     triggerName?: string;
     validateMessages?: ValidateMessages;
+    /**
+     * Recursive validate. It will validate all the name path that contains the provided one.
+     * e.g. ['a'] will validate ['a'] , ['a', 'b'] and ['a', 1].
+     */
     recursive?: boolean;
 }
 export type InternalValidateFields<Values = any> = (nameList?: NamePath[], options?: ValidateOptions) => Promise<Values>;
@@ -189,6 +224,11 @@ interface SetFieldInfo {
 }
 interface DependenciesUpdateInfo {
     type: 'dependenciesUpdate';
+    /**
+     * Contains all the related `InternalNamePath[]`.
+     * a <- b <- c : change `a`
+     * relatedFields=[a, b, c]
+     */
     relatedFields: InternalNamePath[];
 }
 export type NotifyInfo = ValueUpdateInfo | ValidateFinishInfo | ResetInfo | RemoveInfo | SetFieldInfo | DependenciesUpdateInfo;
@@ -216,6 +256,7 @@ export interface InternalHooks {
     setPreserve: (preserve?: boolean) => void;
     getInitialValue: (namePath: InternalNamePath) => StoreValue;
 }
+/** Only return partial when type is not any */
 type RecursivePartial<T> = T extends object ? {
     [P in keyof T]?: T[P] extends (infer U)[] ? RecursivePartial<U>[] : T[P] extends object ? RecursivePartial<T[P]> : T[P];
 } : any;
@@ -239,15 +280,29 @@ export interface FormInstance<Values = any> {
 }
 export type InternalFormInstance = Omit<FormInstance, 'validateFields'> & {
     validateFields: InternalValidateFields;
+    /**
+     * Passed by field context props
+     */
     prefixName?: InternalNamePath;
     validateTrigger?: string | string[] | false;
+    /**
+     * Form component should register some content into store.
+     * We pass the `HOOK_MARK` as key to avoid user call the function.
+     */
     getInternalHooks: (secret: string) => InternalHooks | null;
+    /** @private Internal usage. Do not use it in your production */
     _init?: boolean;
+    /** 配置 Form.Item 的 colon 的默认值。表示是否显示 label 后面的冒号 */
     colon?: boolean;
+    /** 是否禁用该表单内的所有组件。 如果设置为 true, 它将覆盖内部组件的 disabled 属性 */
     disabled?: boolean;
+    /** 表单域标签的位置， 如果值为 left 或者 right 时，则需要设置 label-width */
     labelPosition?: 'left' | 'right' | 'top';
+    /** 标签宽度，例如 '50px'。 可以使用 auto。 */
     labelWidth?: string | number;
+    /** 用于控制该表单域下组件的默认尺寸 */
     size?: TypeAttributes.Size;
+    /** 表单验证规则 */
     rules?: FormRules;
 };
 export type EventArgs = any[];

package/dist/Form/useForm.d.ts

@@ -26,7 +26,14 @@ export declare class FormStore {
     private scrollToField;
     private getInternalHooks;
     private useSubscribe;
+    /**
+     * Record prev Form unmount fieldEntities which config preserve false.
+     * This need to be refill with initialValues instead of store value.
+     */
     private prevWithoutPreserves;
+    /**
+     * First time `setInitialValues` should update store with initial value
+     */
     private setInitialValues;
     private destroyForm;
     private getInitialValue;
@@ -39,6 +46,10 @@ export declare class FormStore {
     private timeoutId;
     private warningUnhooked;
     private updateStore;
+    /**
+     * Get registered field entities.
+     * @param pure Only return field which has a `name`. Default: false
+     */
     private getFieldEntities;
     private getFieldsMap;
     private getFieldEntitiesForNamePathList;
@@ -51,15 +62,26 @@ export declare class FormStore {
     private isFieldTouched;
     private isFieldsValidating;
     private isFieldValidating;
+    /**
+     * Reset Field with field `initialValue` prop.
+     * Can pass `entities` or `namePathList` or just nothing.
+     */
     private resetWithFieldInitialValue;
     private resetFields;
     private setFields;
     private getFields;
+    /**
+     * This only trigger when a field is on constructor to avoid we get initialValue too late
+     */
     private initEntityValue;
     private isMergedPreserve;
     private registerField;
     private dispatch;
     private notifyObservers;
+    /**
+     * Notify dependencies children with parent update
+     * We need delay to trigger validate in case Field is under render props
+     */
     private triggerDependenciesUpdate;
     private updateValue;
     private setFieldsValue;

package/dist/Form/utils/NameMap.d.ts

@@ -3,6 +3,9 @@ interface KV<T> {
     key: InternalNamePath;
     value: T;
 }
+/**
+ * NameMap like a `Map` but accepts `string[]` as key.
+ */
 declare class NameMap<T> {
     private kvs;
     set(key: InternalNamePath, value: T): void;

package/dist/Form/utils/classUtil.js

@@ -37,10 +37,10 @@ module.exports = __toCommonJS(classUtil_exports);
 var import_classnames = __toESM(require("classnames"));
 var import_prefix = require("../../hooks/prefix");
 var prefixSplit = (splitCode, ...classes) => {
-  const mergeClasses = classes.length ? (0, import_classnames.default)(...classes).split(" ").map((item) => (0, import_prefix.prefix)(`${import_prefix.globalKey}-form-item`, item, splitCode)) : [];
+  const mergeClasses = classes.length ? (0, import_classnames.default)(...classes).split(" ").map((item) => (0, import_prefix.prefix)(`${import_prefix.namespace}-form-item`, item, splitCode)) : [];
   return mergeClasses.filter((cls) => cls).join(" ");
 };
-var b = (name) => `${import_prefix.globalKey}-${name}`;
+var b = (name) => `${import_prefix.namespace}-${name}`;
 var e = (...classes) => prefixSplit("__", ...classes);
 var m = (...classes) => prefixSplit("--", ...classes);
 // Annotate the CommonJS export names for ESM import in node:

package/dist/Form/utils/validateUtil.d.ts

@@ -1,2 +1,6 @@
 import type { InternalNamePath, RuleError, RuleObject, StoreValue, ValidateOptions } from '../typings';
+/**
+ * We use `async-validator` to validate the value.
+ * But only check one value in a time to avoid namePath validate issue.
+ */
 export declare function validateRules(namePath: InternalNamePath, value: StoreValue, rules: RuleObject[], options: ValidateOptions, validateFirst: boolean | 'parallel', messageVariables?: Record<string, string>): Promise<RuleError[]>;

package/dist/Form/utils/valueUtil.d.ts

@@ -1,4 +1,11 @@
 import type { EventArgs, InternalNamePath, NamePath, Store, StoreValue } from '../typings';
+/**
+ * Convert name to internal supported format.
+ * This function should keep since we still thinking if need support like `a.b.c` format.
+ * 'a' => ['a']
+ * 123 => [123]
+ * ['a', 123] => ['a', 123]
+ */
 export declare function getNamePath(path: NamePath | null): InternalNamePath;
 export declare function getValue(store: Store, namePath: InternalNamePath): any;
 export declare function setValue(store: Store, namePath: InternalNamePath, value: StoreValue, removeIfUndefined?: boolean): Store;
@@ -9,6 +16,16 @@ export declare function matchNamePath(namePath: InternalNamePath, changedNamePat
 type SimilarObject = string | number | {};
 export declare function isSimilar(source: SimilarObject, target: SimilarObject): boolean;
 export declare function defaultGetValueFromEvent(valuePropName: string, ...args: EventArgs): any;
+/**
+ * Moves an array item from one position in an array to another.
+ *
+ * Note: This is a pure function so a new array will be returned, instead
+ * of altering the array argument.
+ *
+ * @param array         Array in which to move an item.         (required)
+ * @param moveIndex     The index of the item to move.          (required)
+ * @param toIndex       The index to move item at moveIndex to. (required)
+ */
 export declare function move<T>(array: T[], moveIndex: number, toIndex: number): T[];
 export declare function toNamePathStr(name: NamePath): string;
 export {};

package/dist/Icon/Icon.js

@@ -38,7 +38,7 @@ var import_react = __toESM(require("react"));
 var import_hooks = require("../hooks");
 var Icon = (0, import_react.memo)(
   (0, import_react.forwardRef)((props, ref) => {
-    const { prefix, name, size, rotate, flip, spin, pulse, className, style, onClick, classPrefix = "icon", ...other } = props;
+    const { prefix = "far", name, size, rotate, flip, spin, pulse, className, style, onClick, classPrefix = "icon", ...other } = props;
     const { b } = (0, import_hooks.useClassNames)(classPrefix, "el");
     const hasFa = (0, import_startsWith.default)(name, "fa-");
     return /* @__PURE__ */ import_react.default.createElement(
@@ -59,8 +59,5 @@ var Icon = (0, import_react.memo)(
     );
   })
 );
-Icon.defaultProps = {
-  prefix: "far"
-};
 Icon.displayName = "ElIcon";
 var Icon_default = Icon;

package/dist/Icon/typings.d.ts

@@ -1,12 +1,19 @@
 import React from 'react';
 import { BaseProps, NativeProps } from '../types/common';
 export interface IconProps extends Omit<React.AllHTMLAttributes<HTMLElement>, 'size' | 'style' | 'className' | 'readOnly' | 'disabled' | 'children'>, BaseProps, NativeProps {
+    /** 图标前缀，定义图标字体粗细 */
     prefix?: IconPrefix;
+    /** 图标名称 */
     name: IconName;
+    /** 图标大小 */
     size?: IconSize;
+    /** 图标是否旋转 */
     rotate?: Rotate;
+    /** 图标是否翻转 */
     flip?: Flip;
+    /** 是否动画 */
     spin?: boolean;
+    /** 是否8方向旋转 */
     pulse?: boolean;
 }
 export type SvgIconProps = Omit<IconProps, 'name'>;

package/dist/Input/Input.js

@@ -44,6 +44,16 @@ var import_InputGroup = __toESM(require("./InputGroup"));
 var import_InputRange = __toESM(require("./InputRange"));
 var import_TextArea = __toESM(require("./TextArea"));
 function InternalInput(props, ref) {
+  props = (0, import_Util.mergeDefaultProps)(
+    {
+      type: "text",
+      placeholder: "请输入",
+      clearable: true,
+      debounceTime: 200,
+      defaultValue: ""
+    },
+    props
+  );
   const {
     name,
     title,
@@ -277,12 +287,16 @@ function InternalInput(props, ref) {
           onInput: handleInput,
           onClick: props.onClick,
           onFocus: (event) => {
-            (0, import_dom_lib.addClass)(contentRef.current, is("focus"));
+            if (contentRef.current) {
+              (0, import_dom_lib.addClass)(contentRef.current, is("focus"));
+            }
             showClear(value);
             onFocus == null ? void 0 : onFocus.call(this, event);
           },
           onBlur: (event) => {
-            (0, import_dom_lib.removeClass)(contentRef.current, is("focus"));
+            if (contentRef.current) {
+              (0, import_dom_lib.removeClass)(contentRef.current, is("focus"));
+            }
             hideClear();
             onBlur == null ? void 0 : onBlur.call(this, event);
           },
@@ -302,7 +316,7 @@ function InternalInput(props, ref) {
           }
         }
       ))),
-      suffixSlot && /* @__PURE__ */ import_react.default.createElement("span", { ref: suffixRef, key: "suffixSlot", className: (0, import_classnames.default)(e`suffix`, { "r-click": suffixCanClick }), onClick: onClickSuffix }, /* @__PURE__ */ import_react.default.createElement("span", { className: e`suffix-inner` }, suffixSlot))
+      suffixSlot && /* @__PURE__ */ import_react.default.createElement("span", { ref: suffixRef, key: "suffixSlot", className: (0, import_classnames.default)(e`suffix`, { [b("click", false)]: suffixCanClick }), onClick: onClickSuffix }, /* @__PURE__ */ import_react.default.createElement("span", { className: e`suffix-inner` }, suffixSlot))
     );
   }, [
     type,
@@ -328,6 +342,7 @@ function InternalInput(props, ref) {
     maxLength,
     handelClear,
     suffixSlot,
+    b,
     suffixCanClick,
     onClickSuffix,
     showClear,
@@ -380,12 +395,5 @@ var ForwardInput = (0, import_react.forwardRef)(InternalInput);
 var Input = ForwardInput;
 Input.TextArea = import_TextArea.default;
 Input.Range = import_InputRange.default;
-Input.defaultProps = {
-  type: "text",
-  placeholder: "请输入",
-  clearable: true,
-  debounceTime: 200,
-  defaultValue: ""
-};
 Input.displayName = "ElInput";
 var Input_default = Input;

package/dist/Input/InputRange.js

@@ -46,6 +46,17 @@ var import_hooks = require("../hooks");
 var import_prefix = require("../hooks/prefix");
 var import_InputGroup = __toESM(require("./InputGroup"));
 var InputRange = (0, import_react.forwardRef)((props, ref) => {
+  props = (0, import_Util.mergeDefaultProps)(
+    {
+      name: ["", ""],
+      startPlaceholder: "请输入",
+      endPlaceholder: "请输入",
+      type: "text",
+      clearable: true,
+      rangeSeparator: "到"
+    },
+    props
+  );
   const {
     name,
     clearable,
@@ -203,7 +214,7 @@ var InputRange = (0, import_react.forwardRef)((props, ref) => {
       if (nodeType === "ElIcon") {
         return (0, import_react.cloneElement)(prefix, {
           ...prefix.props,
-          className: (0, import_classnames.default)((_a = prefix.props) == null ? void 0 : _a.className, `${import_prefix.globalKey}-range__icon`)
+          className: (0, import_classnames.default)((_a = prefix.props) == null ? void 0 : _a.className, `${import_prefix.namespace}-range__icon`)
         });
       }
     }
@@ -218,11 +229,11 @@ var InputRange = (0, import_react.forwardRef)((props, ref) => {
         if (nodeType === "ElIcon") {
           return (0, import_react.cloneElement)(suffix, {
             ...suffix.props,
-            className: (0, import_classnames.default)((_a = suffix.props) == null ? void 0 : _a.className, `${import_prefix.globalKey}-input__icon ${import_prefix.globalKey}-range__close-icon`)
+            className: (0, import_classnames.default)((_a = suffix.props) == null ? void 0 : _a.className, `${import_prefix.namespace}-input__icon ${import_prefix.namespace}-range__close-icon`)
           });
         }
       } else {
-        return /* @__PURE__ */ import_react.default.createElement("span", { className: `${import_prefix.globalKey}-range__end-icon` }, suffix);
+        return /* @__PURE__ */ import_react.default.createElement("span", { className: `${import_prefix.namespace}-range__end-icon` }, suffix);
       }
     }
     return null;
@@ -341,13 +352,5 @@ var InputRange = (0, import_react.forwardRef)((props, ref) => {
     return content;
   }
 });
-InputRange.defaultProps = {
-  name: ["", ""],
-  startPlaceholder: "请输入",
-  endPlaceholder: "请输入",
-  type: "text",
-  clearable: true,
-  rangeSeparator: "到"
-};
 InputRange.displayName = "InputRange";
 var InputRange_default = InputRange;

package/dist/Input/TextArea.js

@@ -34,8 +34,16 @@ __export(TextArea_exports, {
 module.exports = __toCommonJS(TextArea_exports);
 var import_classnames = __toESM(require("classnames"));
 var import_react = __toESM(require("react"));
+var import_Util = require("../Util");
 var import_hooks = require("../hooks");
 var TextArea = (0, import_react.forwardRef)((props, ref) => {
+  props = (0, import_Util.mergeDefaultProps)(
+    {
+      placeholder: "请输入",
+      style: { width: "100%" }
+    },
+    props
+  );
   const { name, title, error, placeholder, readOnly, plain, rows, classPrefix = "textarea", onFocus, onBlur, onChange, warning, maxLength, showWordLimit, ...rest } = props;
   const { b, m, e, is } = (0, import_hooks.useClassNames)(classPrefix);
   const [value, setValue] = (0, import_hooks.useControlled)(props.value, props.defaultValue);
@@ -110,9 +118,5 @@ var TextArea = (0, import_react.forwardRef)((props, ref) => {
     }
   ), maxLength && showWordLimit ? /* @__PURE__ */ import_react.default.createElement("span", { className: e`count` }, typeof value === "string" ? value.length : 0, " / ", maxLength) : null);
 });
-TextArea.defaultProps = {
-  placeholder: "请输入",
-  style: { width: "100%" }
-};
 TextArea.displayName = "TextArea";
 var TextArea_default = TextArea;

package/dist/Input/typings.d.ts

@@ -3,11 +3,16 @@ import { BaseProps, FormControlBaseProps, NativeProps, TypeAttributes } from '..
 export type LiteralUnion<T extends U, U> = T | (U & {});
 export type ValueType = React.AllHTMLAttributes<HTMLInputElement>['value'];
 export type BaseInputRef = {
+    /** 获取值 */
     getValue: () => ValueType;
+    /** 设置值 */
     setValue: (value: ValueType) => void;
     onClear: (event?: any) => void;
+    /** 重置值 */
     clear: (event?: any) => void;
+    /** 使 input 组件获得焦点 */
     focus: () => void;
+    /** 使 input 组件失去焦点 */
     blur: () => void;
     showClear?: (value: ValueType) => void;
     hideClear?: () => void;
@@ -21,67 +26,123 @@ export type TextareaRef = {
 } & BaseInputRef;
 export interface InputProps extends FormControlBaseProps<ValueType>, BaseProps, NativeProps, Omit<React.AllHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'size' | 'prefix' | 'type' | 'onInput' | 'onChange' | 'style' | 'children'> {
     size?: TypeAttributes.Size;
+    /** 初始值 */
     defaultValue?: ValueType;
+    /**
+     * text，textarea 和其他原生 input 的 type 值
+     * ref: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#%3Cinput%3E_types */
     type?: LiteralUnion<'color' | 'date' | 'datetime-local' | 'email' | 'file' | 'hidden' | 'image' | 'number' | 'password' | 'range' | 'search' | 'tel' | 'text' | 'time' | 'url' | 'week', string>;
+    /** 输入框头部内容，只对 type="text" 有效 */
     prefix?: React.ReactElement<any> | string | number;
+    /** 输入框尾部内容，只对 type="text" 有效 */
     suffix?: React.ReactElement<any> | string | number;
+    /** 输入框前置内容，只对 type="text" 有效 */
     prepend?: React.ReactElement<any> | string | number;
+    /** 输入框后置内容，只对 type="text" 有效 */
     append?: React.ReactElement | string | number;
+    /** 是否可清空 */
     clearable?: boolean;
+    /** 是否显示切换密码图标 */
     showPassword?: boolean;
+    /** 是否纯文本模式，即无边框 */
     plain?: boolean;
+    /** 表单校验错误提示 */
     error?: boolean;
+    /** 表单校验警告提示 */
     warning?: boolean;
+    /** 输入是否防抖动 */
     debounceInput?: boolean;
+    /** 获取输入建议的防抖延时，单位为毫秒 */
     debounceTime?: number;
+    /** input自定义内联样式 */
     innerStyle?: React.CSSProperties;
+    /** 范围选择时开始输入框的占位内容 */
     startPlaceholder?: string;
+    /** 范围选择时结束输入框的占位内容 */
     endPlaceholder?: string;
+    /** 最大输入长度 */
     maxLength?: number;
+    /** 原生属性，最小输入长度 */
     minLength?: number;
+    /** 是否显示统计字数, 只在 type 为 'text' 或 'textarea' 的时候生效	 */
     showWordLimit?: boolean;
+    /** 是否隐藏值 */
     hiddenValue?: boolean;
+    /** 在点击由 clearable 属性生成的清空按钮时触发 */
     onClear?: (e: MouseEvent) => void;
+    /** 在 Input 值改变时触发 */
     onChange?: (value: ValueType, event?: React.ChangeEvent) => void;
 }
 export interface InputGroupProps extends BaseProps, NativeProps {
+    /** 输入框前置内容，只对 type="text" 有效 */
     prepend?: React.ReactElement<any> | string | number;
+    /** 输入框后置内容，只对 type="text" 有效 */
     append?: React.ReactElement | string | number;
 }
 export interface TextareaProps extends Omit<React.AllHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'size' | 'prefix' | 'type' | 'onInput' | 'onChange' | 'style' | 'children'>, FormControlBaseProps<ValueType>, BaseProps, NativeProps {
+    /** 初始值 */
     defaultValue?: ValueType;
+    /** 表单校验错误提示 */
     error?: boolean;
+    /** 表单校验警告提示 */
     warning?: boolean;
+    /** 是否纯文本模式，即无边框 */
     plain?: boolean;
     rows?: number;
+    /** input自定义内联样式 */
     innerStyle?: React.CSSProperties;
+    /** 最大输入长度 */
     maxLength?: number;
+    /** 原生属性，最小输入长度 */
     minLength?: number;
+    /** 是否显示统计字数, 只在 type 为 'text' 或 'textarea' 的时候生效	 */
     showWordLimit?: boolean;
+    /** 在 Input 值改变时触发 */
     onChange?: (value: ValueType, event?: React.ChangeEvent) => void;
 }
 export type InputRangeValueType = [string | null, string | null] | [number | null, number | null];
 export interface InputRangeProps<T = InputRangeValueType> extends Omit<FormControlBaseProps<T>, 'name' | 'onChange'>, BaseProps, NativeProps {
     name?: [string, string];
     size?: TypeAttributes.Size;
+    /** 只读 */
     readOnly?: boolean;
+    /** 是否激活状态 */
     active?: boolean;
     onClick?: React.MouseEventHandler<HTMLDivElement>;
+    /**
+     * text，textarea 和其他原生 input 的 type 值
+     * ref: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#%3Cinput%3E_types */
     type?: 'text' | 'hidden' | 'number';
+    /** 输入框头部内容，只对 type="text" 有效 */
     prefix?: React.ReactElement<any> | string | number;
+    /** 输入框尾部内容，只对 type="text" 有效 */
     suffix?: React.ReactElement<any> | string | number;
+    /** 输入框前置内容，只对 type="text" 有效 */
     prepend?: React.ReactElement<any> | string | number;
+    /** 输入框后置内容，只对 type="text" 有效 */
     append?: React.ReactElement | string | number;
+    /** 数值精度 */
     precision?: number;
+    /** 是否可清空 */
     clearable?: boolean;
+    /** 是否纯文本模式，即无边框 */
     plain?: boolean;
+    /** 表单校验失败 */
     error?: boolean;
+    /** 表单校验失败 */
     warning?: boolean;
+    /** 选择范围时的分隔符 */
     rangeSeparator?: string;
+    /** 输入是否防抖动 */
     debounceInput?: boolean;
+    /** input自定义内联样式 */
     innerStyle?: React.CSSProperties;
+    /** 范围选择时开始输入框的占位内容 */
     startPlaceholder?: string;
+    /** 范围选择时结束输入框的占位内容 */
     endPlaceholder?: string;
+    /** 在点击由 clearable 属性生成的清空按钮时触发 */
     onClear?: (e: MouseEvent) => void;
+    /** 选中值发生变化时触发 */
     onChange?: (value: InputRangeValueType | null, event?: Event) => void;
 }