sti-antd-package 0.1.6 → 0.1.8

package/dist/esm/components/Checkbox/Component.js

@@ -4,7 +4,7 @@ import style from './style.module.css.js';
 import { Checkbox, Skeleton } from 'antd';
 import React__default, { useState, useImperativeHandle } from 'react';
 
-const CheckboxComponent = ({ noItem, loading, disabled, readOnly, checked, defaultChecked, removeError, onChange, formColLayout, name, label, formClassNames, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, children, ref, }) => {
+const CheckboxComponent = ({ noItem, loading, disabled, readOnly, checked, defaultChecked, removeError, onChange, formColLayout, name, label, formClassNames, formStyle, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, children, ref, }) => {
     const [checkedValue, setCheckedValue] = useState(defaultChecked !== null && defaultChecked !== void 0 ? defaultChecked : false);
     const handleChange = (event) => {
         var _a;
@@ -17,7 +17,7 @@ const CheckboxComponent = ({ noItem, loading, disabled, readOnly, checked, defau
         setChecked: setCheckedValue,
     }));
     const checkbox = !loading ? (jsxRuntimeExports.jsx(Checkbox, { disabled: disabled || readOnly, className: readOnly ? style['readonly'] : undefined, checked: checked !== null && checked !== void 0 ? checked : checkedValue, defaultChecked: checkedValue, onChange: handleChange, children: children })) : jsxRuntimeExports.jsx(Skeleton.Input, { active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, valuePropName: "checked", validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: checkbox })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, valuePropName: "checked", validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: checkbox })))
             : checkbox }));
 };
 var CheckboxComponent$1 = React__default.memo(CheckboxComponent);

package/dist/esm/components/Checkbox/Group/Component.js

@@ -4,7 +4,7 @@ import style from '../style.module.css.js';
 import { Checkbox, Row, Col, Skeleton } from 'antd';
 import React__default, { useState, useImperativeHandle } from 'react';
 
-const CheckboxComponent = ({ noItem, loading, disabled, options, value, defaultValue, removeError, onChange, formColLayout, name, label, formClassNames, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
+const CheckboxComponent = ({ noItem, loading, disabled, options, value, defaultValue, removeError, onChange, formColLayout, name, label, formClassNames, formStyle, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
     const [valueCheckboxGroup, setValueCheckboxGroup] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : []);
     const handleChange = (checkedValue) => {
         setValueCheckboxGroup(checkedValue);
@@ -30,7 +30,7 @@ const CheckboxComponent = ({ noItem, loading, disabled, options, value, defaultV
                 checkboxProps.className = className.length ? className.join(' ') : undefined;
                 return (jsxRuntimeExports.jsx(Col, { span: 8, children: jsxRuntimeExports.jsx(Checkbox, Object.assign({}, checkboxProps, { children: isObject ? option.label : option })) }, `cb${index}`));
             }) })) })) : jsxRuntimeExports.jsx(Skeleton.Input, { active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: checkbox })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: checkbox })))
             : checkbox }));
 };
 var Component = React__default.memo(CheckboxComponent);

package/dist/esm/components/DatePicker/Component.js

@@ -6,7 +6,7 @@ import FormItemComponent from '../Form/Item/Component.js';
 import { DatePicker, Skeleton } from 'antd';
 import React__default, { useState, useImperativeHandle, useMemo } from 'react';
 
-const DatePickerComponent = ({ noItem, size, variant, status, placeholder, prefix, prefixCls, suffixIcon, picker, format, disabledDate, disabledTime, loading, readOnly, disabled, value, defaultValue, removeError, onChange, style, formColLayout, name, label, formClassNames, classNames = [], className, required, rules, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
+const DatePickerComponent = ({ noItem, size, variant, status, placeholder, prefix, prefixCls, suffixIcon, picker, format, disabledDate, disabledTime, loading, readOnly, disabled, value, defaultValue, removeError, onChange, style, formColLayout, name, label, formClassNames, formStyle, classNames = [], className, required, rules, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
     const [valueDate, setValueDate] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
     const handleChange = (date, dateString) => {
         setValueDate(date);
@@ -24,7 +24,7 @@ const DatePickerComponent = ({ noItem, size, variant, status, placeholder, prefi
         return className;
     }, [readOnly]);
     const datePicker = !loading ? (jsxRuntimeExports.jsx(DatePicker, { className: classDate === null || classDate === void 0 ? void 0 : classDate.join(' '), classNames: className, size: size !== null && size !== void 0 ? size : 'middle', variant: variant, status: status, placeholder: placeholder, prefix: prefix, prefixCls: prefixCls === null || prefixCls === void 0 ? void 0 : prefixCls.join(' '), suffixIcon: suffixIcon, picker: picker, format: datePickerFormat[format !== null && format !== void 0 ? format : 'default'], allowClear: !required, inputReadOnly: readOnly, readOnly: readOnly, disabled: disabled !== null && disabled !== void 0 ? disabled : readOnly, disabledDate: disabledDate, disabledTime: disabledTime, value: value !== null && value !== void 0 ? value : valueDate, onChange: handleChange, style: style })) : jsxRuntimeExports.jsx(Skeleton.Input, { block: true, active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "date", ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: datePicker })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "date", ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: datePicker })))
             : datePicker }));
 };
 var DatePickerComponent$1 = React__default.memo(DatePickerComponent);

package/dist/esm/components/DateRangePicker/Component.js

@@ -7,7 +7,7 @@ import { DatePicker, Skeleton } from 'antd';
 import React__default, { useState, useImperativeHandle, useMemo } from 'react';
 
 const { RangePicker } = DatePicker;
-const DateRangePickerComponent = ({ noItem, size, variant, status, placeholder, prefix, prefixCls, suffixIcon, picker, format, disabledDate, disabledTime, loading, readOnly, disabled, value, defaultValue, removeError, onChange, style, formColLayout, name, label, formClassNames, classNames = [], className, required, rules, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
+const DateRangePickerComponent = ({ noItem, size, variant, status, placeholder, prefix, prefixCls, suffixIcon, picker, format, disabledDate, disabledTime, loading, readOnly, disabled, value, defaultValue, removeError, onChange, style, formColLayout, name, label, formClassNames, formStyle, classNames = [], className, required, rules, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
     var _a;
     const [valueDateRange, setValueDateRange] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
     const handleChange = (date, dateStrings) => {
@@ -26,7 +26,7 @@ const DateRangePickerComponent = ({ noItem, size, variant, status, placeholder,
         return className;
     }, [readOnly]);
     const datePicker = !loading ? (jsxRuntimeExports.jsx(RangePicker, { className: classDateRange.join(' '), classNames: className, size: size !== null && size !== void 0 ? size : 'middle', variant: variant, status: status, placeholder: placeholder, prefix: prefix, prefixCls: prefixCls === null || prefixCls === void 0 ? void 0 : prefixCls.join(' '), suffixIcon: suffixIcon, picker: picker, format: datePickerFormat[format !== null && format !== void 0 ? format : 'default'], allowEmpty: !required, allowClear: !required, inputReadOnly: readOnly, readOnly: readOnly, disabled: disabled !== null && disabled !== void 0 ? disabled : readOnly, disabledDate: disabledDate, disabledTime: disabledTime, value: (_a = value !== null && value !== void 0 ? value : valueDateRange) !== null && _a !== void 0 ? _a : null, onChange: handleChange, style: style })) : jsxRuntimeExports.jsx(Skeleton.Input, { block: true, active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "array", ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: datePicker })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "array", ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: datePicker })))
             : datePicker }));
 };
 var DateRangePickerComponent$1 = React__default.memo(DateRangePickerComponent);

package/dist/esm/components/Form/Item/Component.js

@@ -3,7 +3,7 @@ import { Form } from 'antd';
 import React__default from 'react';
 
 const { Item } = Form;
-const FormItemComponent = ({ noItem, formColLayout, name, label, classNames, trigger, normalize, required, rules, ruleType, ruleMessage, ruleTransform, ruleMin, ruleMax, valuePropName, getValueFromEvent, validateStatus, help, shouldUpdate, children, }) => {
+const FormItemComponent = ({ noItem, formColLayout, name, label, classNames, trigger, normalize, required, rules, ruleType, ruleMessage, ruleTransform, ruleMin, ruleMax, valuePropName, getValueFromEvent, validateStatus, help, shouldUpdate, style, children, }) => {
     const rule = {
         required: required,
         type: ruleType,
@@ -13,7 +13,7 @@ const FormItemComponent = ({ noItem, formColLayout, name, label, classNames, tri
         max: ruleMax,
         min: ruleMin,
     };
-    return !noItem ? (jsxRuntimeExports.jsx(Item, Object.assign({}, formColLayout, { name: name, label: label, className: classNames === null || classNames === void 0 ? void 0 : classNames.join(' '), trigger: trigger, normalize: normalize, required: required, rules: rules !== null && rules !== void 0 ? rules : [rule], valuePropName: valuePropName, getValueFromEvent: getValueFromEvent, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: children }))) : children;
+    return !noItem ? (jsxRuntimeExports.jsx(Item, Object.assign({}, formColLayout, { name: name, label: label, className: classNames === null || classNames === void 0 ? void 0 : classNames.join(' '), trigger: trigger, normalize: normalize, required: required, rules: rules !== null && rules !== void 0 ? rules : [rule], valuePropName: valuePropName, getValueFromEvent: getValueFromEvent, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: style, children: children }))) : children;
 };
 var FormItemComponent$1 = React__default.memo(FormItemComponent);
 

package/dist/esm/components/Input/Component.js

@@ -5,7 +5,7 @@ import styleInput from './style.module.css.js';
 import { Input, Space, Skeleton } from 'antd';
 import React__default, { useState, useImperativeHandle } from 'react';
 
-const InputComponent = React__default.memo(({ noItem, password, autoFocus, allowClear, size, formClassNames, classNames, variant, status, autoCompleteOff, loading, disabled, readOnly, maxLength, addonBefore, addonAfter, prefix, suffix, placeholder, value, removeError, onChange, onKeyDown, onPressEnter, onMouseEnter, onMouseLeave, onClick, onFocus, onBlur, defaultValue, formColLayout, name, label, uppercase, number, required, rules, ruleType, ruleMessage, ruleMin, ruleMax, validateStatus, help, shouldUpdate, ref, }) => {
+const InputComponent = React__default.memo(({ noItem, password, autoFocus, allowClear, size, formClassNames, formStyle, classNames, variant, status, autoCompleteOff, loading, disabled, readOnly, maxLength, addonBefore, addonAfter, prefix, suffix, placeholder, value, removeError, onChange, onKeyDown, onPressEnter, onMouseEnter, onMouseLeave, onClick, onFocus, onBlur, defaultValue, formColLayout, name, label, uppercase, number, required, rules, ruleType, ruleMessage, ruleMin, ruleMax, validateStatus, help, shouldUpdate, ref, }) => {
     const [valueInput, setValueInput] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : '');
     const handleChange = (event) => {
         setValueInput(event.target.value);
@@ -28,7 +28,7 @@ const InputComponent = React__default.memo(({ noItem, password, autoFocus, allow
             return value.replace(/\D/g, '');
         return value;
     };
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, normalize: normalize, required: required, ruleType: ruleType, ruleMessage: ruleMessage, ruleMax: ruleMax, ruleMin: ruleMin, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: inputComponent })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, normalize: normalize, required: required, ruleType: ruleType, ruleMessage: ruleMessage, ruleMax: ruleMax, ruleMin: ruleMin, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: inputComponent })))
             : inputComponent }));
 });
 var InputComponent$1 = Object.assign(InputComponent, { OTP });

package/dist/esm/components/Input/OTP/Component.js

@@ -25,7 +25,7 @@ import '../../Tag/style.module.css.js';
 import '../../TextArea/Component.js';
 import '../../Upload/Dragger/Component.js';
 
-const OTP = ({ noItem, loading, disabled, size, formClassNames, classNames, variant, mask, separator, length, value, defaultValue, removeError, onChange, onKeyDown, onMouseEnter, onMouseLeave, onClick, onFocus, onBlur, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
+const OTP = ({ noItem, loading, disabled, size, formClassNames, formStyle, classNames, variant, mask, separator, length, value, defaultValue, removeError, onChange, onKeyDown, onMouseEnter, onMouseLeave, onClick, onFocus, onBlur, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
     const [valueInput, setValueInput] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : '');
     const handleChange = (value) => {
         setValueInput(value);
@@ -33,7 +33,7 @@ const OTP = ({ noItem, loading, disabled, size, formClassNames, classNames, vari
         onChange === null || onChange === void 0 ? void 0 : onChange(value);
     };
     const otp = !loading ? (jsxRuntimeExports.jsx(Input.OTP, { disabled: disabled, size: size, className: classNames === null || classNames === void 0 ? void 0 : classNames.join(' '), variant: variant, mask: mask, separator: separator, length: length, value: value !== null && value !== void 0 ? value : valueInput, onChange: handleChange, onKeyDown: onKeyDown, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onClick: onClick, onFocus: onFocus, onBlur: onBlur })) : jsxRuntimeExports.jsx(Skeleton.Input, { block: true, active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, children: otp })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, style: formStyle, children: otp })))
             : otp }));
 };
 

package/dist/esm/components/NumberFormat/Component.js

@@ -6,7 +6,7 @@ import FormItemComponent from '../Form/Item/Component.js';
 import styleNumberFormat from './style.module.css.js';
 import { NumericFormat } from 'react-number-format';
 
-const NumberFormat = ({ noItem, text, size, align, formClassNames, classNames, variant, trailing: trailingProps, prefix, suffix, placeholder, loading, disabled, readOnly, allowNegative, value, defaultValue, onValueChange, removeError, onChange, style, onBlur, onKeyDown, onMouseEnter, onMouseLeave, onFocus, onClick, formColLayout, name, label, required, rules, ruleMessage, ruleMin, ruleMax, validateStatus, help, shouldUpdate, ref, }) => {
+const NumberFormat = ({ noItem, text, size, align, formClassNames, formStyle, classNames, variant, trailing: trailingProps, prefix, suffix, placeholder, loading, disabled, readOnly, allowNegative, value, defaultValue, onValueChange, removeError, onChange, style, onBlur, onKeyDown, onMouseEnter, onMouseLeave, onFocus, onClick, formColLayout, name, label, required, rules, ruleMessage, ruleMin, ruleMax, validateStatus, help, shouldUpdate, ref, }) => {
     const { trailing } = useConfig();
     const { status } = !noItem ? Form.Item.useStatus() : {};
     const [valueNumberFormat, setValueNumberFormat] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : '');
@@ -33,7 +33,7 @@ const NumberFormatComponent = props => {
     const numberFormat = !props.loading ? jsxRuntimeExports.jsx(NumberFormat, Object.assign({}, props)) : jsxRuntimeExports.jsx(Skeleton.Input, { block: true, active: true });
     return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !props.noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, props.formColLayout, { name: props.name, label: props.label, classNames: props.formClassNames, required: props.required, ruleType: "number", 
             // ruleTransform={value => Number(value)}
-            ruleMessage: props.ruleMessage, ruleMax: props.ruleMax, ruleMin: props.ruleMin, rules: props.rules, trigger: "onValueChange", normalize: (values) => values.floatValue, validateStatus: props.validateStatus, help: props.help, shouldUpdate: props.shouldUpdate, children: numberFormat })))
+            ruleMessage: props.ruleMessage, ruleMax: props.ruleMax, ruleMin: props.ruleMin, rules: props.rules, trigger: "onValueChange", normalize: (values) => values.floatValue, validateStatus: props.validateStatus, help: props.help, shouldUpdate: props.shouldUpdate, style: props.formStyle, children: numberFormat })))
             : numberFormat }));
 };
 var NumberFormatComponent$1 = React__default.memo(NumberFormatComponent);

package/dist/esm/components/Radio/Component.js

@@ -4,7 +4,7 @@ import style from './style.module.css.js';
 import { Radio, Row, Col, Skeleton } from 'antd';
 import React__default from 'react';
 
-const RadioComponent = ({ noItem, loading, disabled, buttonStyle, formClassNames, options, optionType, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
+const RadioComponent = ({ noItem, loading, disabled, buttonStyle, formClassNames, formStyle, options, optionType, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
     const radio = !loading ? (jsxRuntimeExports.jsx(Radio.Group, { block: true, buttonStyle: buttonStyle, disabled: disabled, 
         // options={options}
         optionType: optionType, onChange: event => {
@@ -23,7 +23,7 @@ const RadioComponent = ({ noItem, loading, disabled, buttonStyle, formClassNames
                 checkboxProps.className = className.length ? className.join(' ') : undefined;
                 return (jsxRuntimeExports.jsx(Col, { span: 8, children: jsxRuntimeExports.jsx(Radio, Object.assign({}, checkboxProps, { children: isObject ? option.label : option })) }, `radio${index}`));
             }) })) })) : jsxRuntimeExports.jsx(Skeleton, { active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, children: radio })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, style: formStyle, children: radio })))
             : radio }));
 };
 var Component = React__default.memo(RadioComponent);

package/dist/esm/components/Select/Component.js

@@ -6,7 +6,7 @@ import React__default, { useState, useMemo } from 'react';
 import RefIcon from '../../node_modules/@ant-design/icons/es/icons/PlusOutlined.js';
 
 const { Link } = Typography;
-const SelectComponent = ({ noItem, showSearch, mode, variant, status, size, suffixIcon, formClassNames, classNames, loading, readOnly, disabled, open, placeholder, value, defaultValue, removeError, onChange, onKeyDown, onFocus, notFoundContent, tokenSeparators, options, style, addItem, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
+const SelectComponent = ({ noItem, showSearch, mode, variant, status, size, suffixIcon, formClassNames, formStyle, classNames, loading, readOnly, disabled, open, placeholder, value, defaultValue, removeError, onChange, onKeyDown, onFocus, notFoundContent, tokenSeparators, options, style, addItem, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
     const [addItemValue, setAddItemValue] = useState('');
     const classNameSelect = useMemo(() => {
         const className = [styleSelect['select']];
@@ -29,7 +29,7 @@ const SelectComponent = ({ noItem, showSearch, mode, variant, status, size, suff
             removeError === null || removeError === void 0 ? void 0 : removeError(name);
             onChange === null || onChange === void 0 ? void 0 : onChange(value, event);
         }, onKeyDown: onKeyDown, onFocus: onFocus, notFoundContent: notFoundContent, tokenSeparators: tokenSeparators, options: options === null || options === void 0 ? void 0 : options.filter(option => option.value !== undefined), optionLabelProp: "label", optionRender: optionRender, popupRender: popupRender, style: style })) : jsxRuntimeExports.jsx(Skeleton.Input, { block: true, active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, children: select })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, style: formStyle, children: select })))
             : select }));
 };
 var SelectComponent$1 = React__default.memo(SelectComponent);

package/dist/esm/components/Switch/Component.js

@@ -5,7 +5,7 @@ import React__default, { useState } from 'react';
 import RefIcon from '../../node_modules/@ant-design/icons/es/icons/CloseOutlined.js';
 import RefIcon$1 from '../../node_modules/@ant-design/icons/es/icons/CheckOutlined.js';
 
-const SwitchComponent = ({ noItem, icon, checkedChildren, unCheckedChildren, loading, disabled, formClassNames, value, checked, defaultChecked, removeError, onChange, formColLayout, name, label, required, rules, ruleMessage, validateStatus, help, shouldUpdate, }) => {
+const SwitchComponent = ({ noItem, icon, checkedChildren, unCheckedChildren, loading, disabled, formClassNames, formStyle, value, checked, defaultChecked, removeError, onChange, formColLayout, name, label, required, rules, ruleMessage, validateStatus, help, shouldUpdate, }) => {
     var _a;
     const [checkedSwitch, setCheckedSwitch] = useState((_a = value !== null && value !== void 0 ? value : defaultChecked) !== null && _a !== void 0 ? _a : false);
     const handleChange = (value, event) => {
@@ -21,7 +21,7 @@ const SwitchComponent = ({ noItem, icon, checkedChildren, unCheckedChildren, loa
         unCheckedChildren,
     };
     const switchComponent = !loading ? (jsxRuntimeExports.jsx(Switch, Object.assign({}, checkChildren, { onChange: handleChange, disabled: disabled, checked: checked !== null && checked !== void 0 ? checked : checkedSwitch, defaultChecked: checked !== null && checked !== void 0 ? checked : checkedSwitch }))) : jsxRuntimeExports.jsx(Skeleton.Input, { active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "boolean", ruleMessage: ruleMessage, rules: rules, valuePropName: "checked", validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: switchComponent })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "boolean", ruleMessage: ruleMessage, rules: rules, valuePropName: "checked", validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: switchComponent })))
             : switchComponent }));
 };
 var SwitchComponent$1 = React__default.memo(SwitchComponent);

package/dist/esm/components/Tag/Component.js

@@ -2,11 +2,15 @@ import { j as jsxRuntimeExports } from '../../_virtual/jsx-runtime.js';
 import styleTag from './style.module.css.js';
 import { Flex, Tag } from 'antd';
 
-const TagComponent = ({ strong, color, tags, children, }) => {
+const TagComponent = ({ strong, variant, color, tags, children, }) => {
     const colors = ['red', 'gold', 'green', 'cyan', 'blue', 'purple'];
     const className = [];
     strong && className.push(styleTag['bold']);
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (tags === null || tags === void 0 ? void 0 : tags.length) ? (jsxRuntimeExports.jsx(Flex, { gap: "small", wrap: "wrap", children: tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (jsxRuntimeExports.jsx(Tag, { color: colors[index % colors.length], className: className.join(' '), children: item.value }, `tag-${index}`))) })) : (jsxRuntimeExports.jsx(Tag, { color: color, className: className.join(' '), children: children })) }));
+    const tagProps = {
+        variant,
+        className: className.join(' '),
+    };
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (tags === null || tags === void 0 ? void 0 : tags.length) ? (jsxRuntimeExports.jsx(Flex, { gap: "small", wrap: "wrap", children: tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (jsxRuntimeExports.jsx(Tag, Object.assign({ color: colors[index % colors.length] }, tagProps, { children: item.value }), `tag-${index}`))) })) : (jsxRuntimeExports.jsx(Tag, Object.assign({ color: color }, tagProps, { children: children }))) }));
 };
 
 export { TagComponent as default };

package/dist/esm/components/TextArea/Component.js

@@ -5,7 +5,7 @@ import { Skeleton } from 'antd';
 import TextArea from '../../node_modules/antd/es/input/TextArea.js';
 import React__default, { useState, useImperativeHandle } from 'react';
 
-const TextAreaComponent = ({ noItem, noResize, size, formClassNames, className, rows, variant, status, loading, disabled, readOnly, placeholder, value, defaultValue, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
+const TextAreaComponent = ({ noItem, noResize, size, formClassNames, formStyle, className, rows, variant, status, loading, disabled, readOnly, placeholder, value, defaultValue, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
     const classTextArea = [];
     className && classTextArea.push(...className);
     noResize && classTextArea.push(styleTextArea['resize-none']);
@@ -20,7 +20,7 @@ const TextAreaComponent = ({ noItem, noResize, size, formClassNames, className,
         setValue: () => setValueTextArea,
     }));
     const textArea = !loading ? (jsxRuntimeExports.jsx(TextArea, { size: size, className: className === null || className === void 0 ? void 0 : className.join(' '), rows: rows, variant: variant, status: status, disabled: disabled, readOnly: readOnly, onChange: handleChange, placeholder: placeholder, value: value !== null && value !== void 0 ? value : valueTextArea })) : jsxRuntimeExports.jsx(Skeleton.Input, { block: true, active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: textArea })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: textArea })))
             : textArea }));
 };
 var Component = React__default.memo(TextAreaComponent);

package/dist/esm/components/Upload/Dragger/Component.js

@@ -20,7 +20,7 @@ const normFile = event => {
         return event;
     return event && event['fileList'];
 };
-const UploadDraggerComponent = ({ noItem, readOnly, multiple, loading, disabled, listType, formClassNames, rootClassNames, classNames, accept, action, withCredentials, beforeUpload, customRequest, removeError, onChange, onRemove, onDrop, onPreview, defaultFileList, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
+const UploadDraggerComponent = ({ noItem, readOnly, multiple, loading, disabled, listType, formClassNames, formStyle, rootClassNames, classNames, accept, action, withCredentials, beforeUpload, customRequest, removeError, onChange, onRemove, onDrop, onPreview, defaultFileList, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
     const handleChange = (info) => {
         removeError === null || removeError === void 0 ? void 0 : removeError(name);
         onChange === null || onChange === void 0 ? void 0 : onChange(info);
@@ -31,7 +31,7 @@ const UploadDraggerComponent = ({ noItem, readOnly, multiple, loading, disabled,
     classNames && classDragger.push(...classNames);
     readOnly && classDragger.push(style['readonly']);
     const dragger = !loading ? (jsxRuntimeExports.jsxs(Dragger, { multiple: multiple, disabled: disabled || readOnly, listType: listType, rootClassName: rootClassDragger.join(' '), className: classDragger.join(' '), accept: accept === null || accept === void 0 ? void 0 : accept.map(accept => acceptFormat(accept)).join(', '), action: action, withCredentials: withCredentials, beforeUpload: beforeUpload, customRequest: customRequest, onChange: handleChange, onRemove: onRemove, onDrop: onDrop, onPreview: onPreview, defaultFileList: defaultFileList, children: [jsxRuntimeExports.jsx("p", { className: "ant-upload-drag-icon", children: jsxRuntimeExports.jsx(RefIcon, {}) }), jsxRuntimeExports.jsx("p", { className: "ant-upload-text", children: "Click or drag file to this area to upload" }), jsxRuntimeExports.jsx("p", { className: "ant-upload-hint", children: "Support for a single or bulk upload. Strictly prohibited from uploading company data or other banned files." })] })) : jsxRuntimeExports.jsx(Skeleton.Input, { block: true, active: true });
-    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, valuePropName: "fileList", getValueFromEvent: normFile, validateStatus: validateStatus, help: help, children: dragger })))
+    return (jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntimeExports.jsx(FormItemComponent, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, valuePropName: "fileList", getValueFromEvent: normFile, validateStatus: validateStatus, help: help, style: formStyle, children: dragger })))
             : dragger }));
 };
 

package/dist/esm/types/components/Checkbox/Group/Component.d.ts

@@ -1,4 +1,4 @@
 import { CheckboxGroupComponentProps } from "./types";
 import React from "react";
-declare const _default: React.MemoExoticComponent<(<T>({ noItem, loading, disabled, options, value, defaultValue, removeError, onChange, formColLayout, name, label, formClassNames, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }: CheckboxGroupComponentProps<T>) => import("react/jsx-runtime").JSX.Element)>;
+declare const _default: React.MemoExoticComponent<(<T>({ noItem, loading, disabled, options, value, defaultValue, removeError, onChange, formColLayout, name, label, formClassNames, formStyle, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }: CheckboxGroupComponentProps<T>) => import("react/jsx-runtime").JSX.Element)>;
 export default _default;

package/dist/esm/types/components/Form/Item/types.d.ts

@@ -13,6 +13,7 @@ interface FormItemDefault {
     name?: NamePath;
     label?: React.ReactNode;
     formClassNames?: string[];
+    formStyle?: React.CSSProperties;
     required?: boolean;
 }
 interface FormItemRulesAndMessage {
@@ -58,6 +59,7 @@ export interface FormItemComponentProps {
     validateStatus?: ValidateStatus;
     help?: React.ReactNode;
     shouldUpdate?: FormItemProps['shouldUpdate'];
+    style?: React.CSSProperties;
     children?: React.ReactNode;
 }
 export {};

package/dist/esm/types/components/Radio/Component.d.ts

@@ -1,4 +1,4 @@
 import { RadioComponentProps } from "./types";
 import React from "react";
-declare const _default: React.MemoExoticComponent<(<T>({ noItem, loading, disabled, buttonStyle, formClassNames, options, optionType, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }: RadioComponentProps<T>) => import("react/jsx-runtime").JSX.Element)>;
+declare const _default: React.MemoExoticComponent<(<T>({ noItem, loading, disabled, buttonStyle, formClassNames, formStyle, options, optionType, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }: RadioComponentProps<T>) => import("react/jsx-runtime").JSX.Element)>;
 export default _default;

package/dist/esm/types/components/Tag/types.d.ts

@@ -2,6 +2,7 @@ import { TagProps } from "antd";
 import React from "react";
 export interface TagComponentProps {
     strong?: boolean;
+    variant?: TagProps['variant'];
     color?: TagProps['color'];
     tags?: {
         value: string;

package/dist/lib/components/Checkbox/Component.js

@@ -6,7 +6,7 @@ var style_module = require('./style.module.css.js');
 var antd = require('antd');
 var React = require('react');
 
-const CheckboxComponent = ({ noItem, loading, disabled, readOnly, checked, defaultChecked, removeError, onChange, formColLayout, name, label, formClassNames, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, children, ref, }) => {
+const CheckboxComponent = ({ noItem, loading, disabled, readOnly, checked, defaultChecked, removeError, onChange, formColLayout, name, label, formClassNames, formStyle, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, children, ref, }) => {
     const [checkedValue, setCheckedValue] = React.useState(defaultChecked !== null && defaultChecked !== void 0 ? defaultChecked : false);
     const handleChange = (event) => {
         var _a;
@@ -19,7 +19,7 @@ const CheckboxComponent = ({ noItem, loading, disabled, readOnly, checked, defau
         setChecked: setCheckedValue,
     }));
     const checkbox = !loading ? (jsxRuntime.jsxRuntimeExports.jsx(antd.Checkbox, { disabled: disabled || readOnly, className: readOnly ? style_module['readonly'] : undefined, checked: checked !== null && checked !== void 0 ? checked : checkedValue, defaultChecked: checkedValue, onChange: handleChange, children: children })) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, valuePropName: "checked", validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: checkbox })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, valuePropName: "checked", validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: checkbox })))
             : checkbox }));
 };
 var CheckboxComponent$1 = React.memo(CheckboxComponent);

package/dist/lib/components/Checkbox/Group/Component.js

@@ -6,7 +6,7 @@ var style_module = require('../style.module.css.js');
 var antd = require('antd');
 var React = require('react');
 
-const CheckboxComponent = ({ noItem, loading, disabled, options, value, defaultValue, removeError, onChange, formColLayout, name, label, formClassNames, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
+const CheckboxComponent = ({ noItem, loading, disabled, options, value, defaultValue, removeError, onChange, formColLayout, name, label, formClassNames, formStyle, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
     const [valueCheckboxGroup, setValueCheckboxGroup] = React.useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : []);
     const handleChange = (checkedValue) => {
         setValueCheckboxGroup(checkedValue);
@@ -32,7 +32,7 @@ const CheckboxComponent = ({ noItem, loading, disabled, options, value, defaultV
                 checkboxProps.className = className.length ? className.join(' ') : undefined;
                 return (jsxRuntime.jsxRuntimeExports.jsx(antd.Col, { span: 8, children: jsxRuntime.jsxRuntimeExports.jsx(antd.Checkbox, Object.assign({}, checkboxProps, { children: isObject ? option.label : option })) }, `cb${index}`));
             }) })) })) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component$1, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: checkbox })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component$1, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: checkbox })))
             : checkbox }));
 };
 var Component = React.memo(CheckboxComponent);

package/dist/lib/components/DatePicker/Component.js

@@ -8,7 +8,7 @@ var Component = require('../Form/Item/Component.js');
 var antd = require('antd');
 var React = require('react');
 
-const DatePickerComponent = ({ noItem, size, variant, status, placeholder, prefix, prefixCls, suffixIcon, picker, format, disabledDate, disabledTime, loading, readOnly, disabled, value, defaultValue, removeError, onChange, style, formColLayout, name, label, formClassNames, classNames = [], className, required, rules, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
+const DatePickerComponent = ({ noItem, size, variant, status, placeholder, prefix, prefixCls, suffixIcon, picker, format, disabledDate, disabledTime, loading, readOnly, disabled, value, defaultValue, removeError, onChange, style, formColLayout, name, label, formClassNames, formStyle, classNames = [], className, required, rules, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
     const [valueDate, setValueDate] = React.useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
     const handleChange = (date, dateString) => {
         setValueDate(date);
@@ -26,7 +26,7 @@ const DatePickerComponent = ({ noItem, size, variant, status, placeholder, prefi
         return className;
     }, [readOnly]);
     const datePicker = !loading ? (jsxRuntime.jsxRuntimeExports.jsx(antd.DatePicker, { className: classDate === null || classDate === void 0 ? void 0 : classDate.join(' '), classNames: className, size: size !== null && size !== void 0 ? size : 'middle', variant: variant, status: status, placeholder: placeholder, prefix: prefix, prefixCls: prefixCls === null || prefixCls === void 0 ? void 0 : prefixCls.join(' '), suffixIcon: suffixIcon, picker: picker, format: datePickerFormat[format !== null && format !== void 0 ? format : 'default'], allowClear: !required, inputReadOnly: readOnly, readOnly: readOnly, disabled: disabled !== null && disabled !== void 0 ? disabled : readOnly, disabledDate: disabledDate, disabledTime: disabledTime, value: value !== null && value !== void 0 ? value : valueDate, onChange: handleChange, style: style })) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { block: true, active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "date", ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: datePicker })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "date", ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: datePicker })))
             : datePicker }));
 };
 var DatePickerComponent$1 = React.memo(DatePickerComponent);

package/dist/lib/components/DateRangePicker/Component.js

@@ -9,7 +9,7 @@ var antd = require('antd');
 var React = require('react');
 
 const { RangePicker } = antd.DatePicker;
-const DateRangePickerComponent = ({ noItem, size, variant, status, placeholder, prefix, prefixCls, suffixIcon, picker, format, disabledDate, disabledTime, loading, readOnly, disabled, value, defaultValue, removeError, onChange, style, formColLayout, name, label, formClassNames, classNames = [], className, required, rules, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
+const DateRangePickerComponent = ({ noItem, size, variant, status, placeholder, prefix, prefixCls, suffixIcon, picker, format, disabledDate, disabledTime, loading, readOnly, disabled, value, defaultValue, removeError, onChange, style, formColLayout, name, label, formClassNames, formStyle, classNames = [], className, required, rules, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
     var _a;
     const [valueDateRange, setValueDateRange] = React.useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : null);
     const handleChange = (date, dateStrings) => {
@@ -28,7 +28,7 @@ const DateRangePickerComponent = ({ noItem, size, variant, status, placeholder,
         return className;
     }, [readOnly]);
     const datePicker = !loading ? (jsxRuntime.jsxRuntimeExports.jsx(RangePicker, { className: classDateRange.join(' '), classNames: className, size: size !== null && size !== void 0 ? size : 'middle', variant: variant, status: status, placeholder: placeholder, prefix: prefix, prefixCls: prefixCls === null || prefixCls === void 0 ? void 0 : prefixCls.join(' '), suffixIcon: suffixIcon, picker: picker, format: datePickerFormat[format !== null && format !== void 0 ? format : 'default'], allowEmpty: !required, allowClear: !required, inputReadOnly: readOnly, readOnly: readOnly, disabled: disabled !== null && disabled !== void 0 ? disabled : readOnly, disabledDate: disabledDate, disabledTime: disabledTime, value: (_a = value !== null && value !== void 0 ? value : valueDateRange) !== null && _a !== void 0 ? _a : null, onChange: handleChange, style: style })) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { block: true, active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "array", ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: datePicker })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "array", ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: datePicker })))
             : datePicker }));
 };
 var DateRangePickerComponent$1 = React.memo(DateRangePickerComponent);

package/dist/lib/components/Form/Item/Component.js

@@ -5,7 +5,7 @@ var antd = require('antd');
 var React = require('react');
 
 const { Item } = antd.Form;
-const FormItemComponent = ({ noItem, formColLayout, name, label, classNames, trigger, normalize, required, rules, ruleType, ruleMessage, ruleTransform, ruleMin, ruleMax, valuePropName, getValueFromEvent, validateStatus, help, shouldUpdate, children, }) => {
+const FormItemComponent = ({ noItem, formColLayout, name, label, classNames, trigger, normalize, required, rules, ruleType, ruleMessage, ruleTransform, ruleMin, ruleMax, valuePropName, getValueFromEvent, validateStatus, help, shouldUpdate, style, children, }) => {
     const rule = {
         required: required,
         type: ruleType,
@@ -15,7 +15,7 @@ const FormItemComponent = ({ noItem, formColLayout, name, label, classNames, tri
         max: ruleMax,
         min: ruleMin,
     };
-    return !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Item, Object.assign({}, formColLayout, { name: name, label: label, className: classNames === null || classNames === void 0 ? void 0 : classNames.join(' '), trigger: trigger, normalize: normalize, required: required, rules: rules !== null && rules !== void 0 ? rules : [rule], valuePropName: valuePropName, getValueFromEvent: getValueFromEvent, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: children }))) : children;
+    return !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Item, Object.assign({}, formColLayout, { name: name, label: label, className: classNames === null || classNames === void 0 ? void 0 : classNames.join(' '), trigger: trigger, normalize: normalize, required: required, rules: rules !== null && rules !== void 0 ? rules : [rule], valuePropName: valuePropName, getValueFromEvent: getValueFromEvent, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: style, children: children }))) : children;
 };
 var FormItemComponent$1 = React.memo(FormItemComponent);
 

package/dist/lib/components/Input/Component.js

@@ -7,7 +7,7 @@ var style_module = require('./style.module.css.js');
 var antd = require('antd');
 var React = require('react');
 
-const InputComponent = React.memo(({ noItem, password, autoFocus, allowClear, size, formClassNames, classNames, variant, status, autoCompleteOff, loading, disabled, readOnly, maxLength, addonBefore, addonAfter, prefix, suffix, placeholder, value, removeError, onChange, onKeyDown, onPressEnter, onMouseEnter, onMouseLeave, onClick, onFocus, onBlur, defaultValue, formColLayout, name, label, uppercase, number, required, rules, ruleType, ruleMessage, ruleMin, ruleMax, validateStatus, help, shouldUpdate, ref, }) => {
+const InputComponent = React.memo(({ noItem, password, autoFocus, allowClear, size, formClassNames, formStyle, classNames, variant, status, autoCompleteOff, loading, disabled, readOnly, maxLength, addonBefore, addonAfter, prefix, suffix, placeholder, value, removeError, onChange, onKeyDown, onPressEnter, onMouseEnter, onMouseLeave, onClick, onFocus, onBlur, defaultValue, formColLayout, name, label, uppercase, number, required, rules, ruleType, ruleMessage, ruleMin, ruleMax, validateStatus, help, shouldUpdate, ref, }) => {
     const [valueInput, setValueInput] = React.useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : '');
     const handleChange = (event) => {
         setValueInput(event.target.value);
@@ -30,7 +30,7 @@ const InputComponent = React.memo(({ noItem, password, autoFocus, allowClear, si
             return value.replace(/\D/g, '');
         return value;
     };
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, normalize: normalize, required: required, ruleType: ruleType, ruleMessage: ruleMessage, ruleMax: ruleMax, ruleMin: ruleMin, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: inputComponent })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, normalize: normalize, required: required, ruleType: ruleType, ruleMessage: ruleMessage, ruleMax: ruleMax, ruleMin: ruleMin, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: inputComponent })))
             : inputComponent }));
 });
 var InputComponent$1 = Object.assign(InputComponent, { OTP: Component$1 });

package/dist/lib/components/Input/OTP/Component.js

@@ -27,7 +27,7 @@ require('../../Tag/style.module.css.js');
 require('../../TextArea/Component.js');
 require('../../Upload/Dragger/Component.js');
 
-const OTP = ({ noItem, loading, disabled, size, formClassNames, classNames, variant, mask, separator, length, value, defaultValue, removeError, onChange, onKeyDown, onMouseEnter, onMouseLeave, onClick, onFocus, onBlur, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
+const OTP = ({ noItem, loading, disabled, size, formClassNames, formStyle, classNames, variant, mask, separator, length, value, defaultValue, removeError, onChange, onKeyDown, onMouseEnter, onMouseLeave, onClick, onFocus, onBlur, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
     const [valueInput, setValueInput] = React.useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : '');
     const handleChange = (value) => {
         setValueInput(value);
@@ -35,7 +35,7 @@ const OTP = ({ noItem, loading, disabled, size, formClassNames, classNames, vari
         onChange === null || onChange === void 0 ? void 0 : onChange(value);
     };
     const otp = !loading ? (jsxRuntime.jsxRuntimeExports.jsx(antd.Input.OTP, { disabled: disabled, size: size, className: classNames === null || classNames === void 0 ? void 0 : classNames.join(' '), variant: variant, mask: mask, separator: separator, length: length, value: value !== null && value !== void 0 ? value : valueInput, onChange: handleChange, onKeyDown: onKeyDown, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onClick: onClick, onFocus: onFocus, onBlur: onBlur })) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { block: true, active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, children: otp })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, style: formStyle, children: otp })))
             : otp }));
 };
 

package/dist/lib/components/NumberFormat/Component.js

@@ -8,7 +8,7 @@ var Component = require('../Form/Item/Component.js');
 var style_module = require('./style.module.css.js');
 var reactNumberFormat = require('react-number-format');
 
-const NumberFormat = ({ noItem, text, size, align, formClassNames, classNames, variant, trailing: trailingProps, prefix, suffix, placeholder, loading, disabled, readOnly, allowNegative, value, defaultValue, onValueChange, removeError, onChange, style, onBlur, onKeyDown, onMouseEnter, onMouseLeave, onFocus, onClick, formColLayout, name, label, required, rules, ruleMessage, ruleMin, ruleMax, validateStatus, help, shouldUpdate, ref, }) => {
+const NumberFormat = ({ noItem, text, size, align, formClassNames, formStyle, classNames, variant, trailing: trailingProps, prefix, suffix, placeholder, loading, disabled, readOnly, allowNegative, value, defaultValue, onValueChange, removeError, onChange, style, onBlur, onKeyDown, onMouseEnter, onMouseLeave, onFocus, onClick, formColLayout, name, label, required, rules, ruleMessage, ruleMin, ruleMax, validateStatus, help, shouldUpdate, ref, }) => {
     const { trailing } = Context.useConfig();
     const { status } = !noItem ? antd.Form.Item.useStatus() : {};
     const [valueNumberFormat, setValueNumberFormat] = React.useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : '');
@@ -35,7 +35,7 @@ const NumberFormatComponent = props => {
     const numberFormat = !props.loading ? jsxRuntime.jsxRuntimeExports.jsx(NumberFormat, Object.assign({}, props)) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { block: true, active: true });
     return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !props.noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, props.formColLayout, { name: props.name, label: props.label, classNames: props.formClassNames, required: props.required, ruleType: "number", 
             // ruleTransform={value => Number(value)}
-            ruleMessage: props.ruleMessage, ruleMax: props.ruleMax, ruleMin: props.ruleMin, rules: props.rules, trigger: "onValueChange", normalize: (values) => values.floatValue, validateStatus: props.validateStatus, help: props.help, shouldUpdate: props.shouldUpdate, children: numberFormat })))
+            ruleMessage: props.ruleMessage, ruleMax: props.ruleMax, ruleMin: props.ruleMin, rules: props.rules, trigger: "onValueChange", normalize: (values) => values.floatValue, validateStatus: props.validateStatus, help: props.help, shouldUpdate: props.shouldUpdate, style: props.formStyle, children: numberFormat })))
             : numberFormat }));
 };
 var NumberFormatComponent$1 = React.memo(NumberFormatComponent);

package/dist/lib/components/Radio/Component.js

@@ -6,7 +6,7 @@ var style_module = require('./style.module.css.js');
 var antd = require('antd');
 var React = require('react');
 
-const RadioComponent = ({ noItem, loading, disabled, buttonStyle, formClassNames, options, optionType, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
+const RadioComponent = ({ noItem, loading, disabled, buttonStyle, formClassNames, formStyle, options, optionType, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
     const radio = !loading ? (jsxRuntime.jsxRuntimeExports.jsx(antd.Radio.Group, { block: true, buttonStyle: buttonStyle, disabled: disabled, 
         // options={options}
         optionType: optionType, onChange: event => {
@@ -25,7 +25,7 @@ const RadioComponent = ({ noItem, loading, disabled, buttonStyle, formClassNames
                 checkboxProps.className = className.length ? className.join(' ') : undefined;
                 return (jsxRuntime.jsxRuntimeExports.jsx(antd.Col, { span: 8, children: jsxRuntime.jsxRuntimeExports.jsx(antd.Radio, Object.assign({}, checkboxProps, { children: isObject ? option.label : option })) }, `radio${index}`));
             }) })) })) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton, { active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component$1, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, children: radio })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component$1, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, style: formStyle, children: radio })))
             : radio }));
 };
 var Component = React.memo(RadioComponent);

package/dist/lib/components/Select/Component.js

@@ -8,7 +8,7 @@ var React = require('react');
 var PlusOutlined = require('../../node_modules/@ant-design/icons/es/icons/PlusOutlined.js');
 
 const { Link } = antd.Typography;
-const SelectComponent = ({ noItem, showSearch, mode, variant, status, size, suffixIcon, formClassNames, classNames, loading, readOnly, disabled, open, placeholder, value, defaultValue, removeError, onChange, onKeyDown, onFocus, notFoundContent, tokenSeparators, options, style, addItem, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
+const SelectComponent = ({ noItem, showSearch, mode, variant, status, size, suffixIcon, formClassNames, formStyle, classNames, loading, readOnly, disabled, open, placeholder, value, defaultValue, removeError, onChange, onKeyDown, onFocus, notFoundContent, tokenSeparators, options, style, addItem, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
     const [addItemValue, setAddItemValue] = React.useState('');
     const classNameSelect = React.useMemo(() => {
         const className = [style_module['select']];
@@ -31,7 +31,7 @@ const SelectComponent = ({ noItem, showSearch, mode, variant, status, size, suff
             removeError === null || removeError === void 0 ? void 0 : removeError(name);
             onChange === null || onChange === void 0 ? void 0 : onChange(value, event);
         }, onKeyDown: onKeyDown, onFocus: onFocus, notFoundContent: notFoundContent, tokenSeparators: tokenSeparators, options: options === null || options === void 0 ? void 0 : options.filter(option => option.value !== undefined), optionLabelProp: "label", optionRender: optionRender, popupRender: popupRender, style: style })) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { block: true, active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, children: select })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, style: formStyle, children: select })))
             : select }));
 };
 var SelectComponent$1 = React.memo(SelectComponent);

package/dist/lib/components/Switch/Component.js

@@ -7,7 +7,7 @@ var React = require('react');
 var CloseOutlined = require('../../node_modules/@ant-design/icons/es/icons/CloseOutlined.js');
 var CheckOutlined = require('../../node_modules/@ant-design/icons/es/icons/CheckOutlined.js');
 
-const SwitchComponent = ({ noItem, icon, checkedChildren, unCheckedChildren, loading, disabled, formClassNames, value, checked, defaultChecked, removeError, onChange, formColLayout, name, label, required, rules, ruleMessage, validateStatus, help, shouldUpdate, }) => {
+const SwitchComponent = ({ noItem, icon, checkedChildren, unCheckedChildren, loading, disabled, formClassNames, formStyle, value, checked, defaultChecked, removeError, onChange, formColLayout, name, label, required, rules, ruleMessage, validateStatus, help, shouldUpdate, }) => {
     var _a;
     const [checkedSwitch, setCheckedSwitch] = React.useState((_a = value !== null && value !== void 0 ? value : defaultChecked) !== null && _a !== void 0 ? _a : false);
     const handleChange = (value, event) => {
@@ -23,7 +23,7 @@ const SwitchComponent = ({ noItem, icon, checkedChildren, unCheckedChildren, loa
         unCheckedChildren,
     };
     const switchComponent = !loading ? (jsxRuntime.jsxRuntimeExports.jsx(antd.Switch, Object.assign({}, checkChildren, { onChange: handleChange, disabled: disabled, checked: checked !== null && checked !== void 0 ? checked : checkedSwitch, defaultChecked: checked !== null && checked !== void 0 ? checked : checkedSwitch }))) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "boolean", ruleMessage: ruleMessage, rules: rules, valuePropName: "checked", validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: switchComponent })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: "boolean", ruleMessage: ruleMessage, rules: rules, valuePropName: "checked", validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: switchComponent })))
             : switchComponent }));
 };
 var SwitchComponent$1 = React.memo(SwitchComponent);

package/dist/lib/components/Tag/Component.js

@@ -4,11 +4,15 @@ var jsxRuntime = require('../../_virtual/jsx-runtime.js');
 var style_module = require('./style.module.css.js');
 var antd = require('antd');
 
-const TagComponent = ({ strong, color, tags, children, }) => {
+const TagComponent = ({ strong, variant, color, tags, children, }) => {
     const colors = ['red', 'gold', 'green', 'cyan', 'blue', 'purple'];
     const className = [];
     strong && className.push(style_module['bold']);
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: (tags === null || tags === void 0 ? void 0 : tags.length) ? (jsxRuntime.jsxRuntimeExports.jsx(antd.Flex, { gap: "small", wrap: "wrap", children: tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (jsxRuntime.jsxRuntimeExports.jsx(antd.Tag, { color: colors[index % colors.length], className: className.join(' '), children: item.value }, `tag-${index}`))) })) : (jsxRuntime.jsxRuntimeExports.jsx(antd.Tag, { color: color, className: className.join(' '), children: children })) }));
+    const tagProps = {
+        variant,
+        className: className.join(' '),
+    };
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: (tags === null || tags === void 0 ? void 0 : tags.length) ? (jsxRuntime.jsxRuntimeExports.jsx(antd.Flex, { gap: "small", wrap: "wrap", children: tags === null || tags === void 0 ? void 0 : tags.map((item, index) => (jsxRuntime.jsxRuntimeExports.jsx(antd.Tag, Object.assign({ color: colors[index % colors.length] }, tagProps, { children: item.value }), `tag-${index}`))) })) : (jsxRuntime.jsxRuntimeExports.jsx(antd.Tag, Object.assign({ color: color }, tagProps, { children: children }))) }));
 };
 
 module.exports = TagComponent;

package/dist/lib/components/TextArea/Component.js

@@ -7,7 +7,7 @@ var antd = require('antd');
 var TextArea = require('../../node_modules/antd/es/input/TextArea.js');
 var React = require('react');
 
-const TextAreaComponent = ({ noItem, noResize, size, formClassNames, className, rows, variant, status, loading, disabled, readOnly, placeholder, value, defaultValue, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
+const TextAreaComponent = ({ noItem, noResize, size, formClassNames, formStyle, className, rows, variant, status, loading, disabled, readOnly, placeholder, value, defaultValue, removeError, onChange, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, shouldUpdate, ref, }) => {
     const classTextArea = [];
     className && classTextArea.push(...className);
     noResize && classTextArea.push(style_module['resize-none']);
@@ -22,7 +22,7 @@ const TextAreaComponent = ({ noItem, noResize, size, formClassNames, className,
         setValue: () => setValueTextArea,
     }));
     const textArea = !loading ? (jsxRuntime.jsxRuntimeExports.jsx(TextArea, { size: size, className: className === null || className === void 0 ? void 0 : className.join(' '), rows: rows, variant: variant, status: status, disabled: disabled, readOnly: readOnly, onChange: handleChange, placeholder: placeholder, value: value !== null && value !== void 0 ? value : valueTextArea })) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { block: true, active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component$1, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, children: textArea })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component$1, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, validateStatus: validateStatus, help: help, shouldUpdate: shouldUpdate, style: formStyle, children: textArea })))
             : textArea }));
 };
 var Component = React.memo(TextAreaComponent);

package/dist/lib/components/Upload/Dragger/Component.js

@@ -22,7 +22,7 @@ const normFile = event => {
         return event;
     return event && event['fileList'];
 };
-const UploadDraggerComponent = ({ noItem, readOnly, multiple, loading, disabled, listType, formClassNames, rootClassNames, classNames, accept, action, withCredentials, beforeUpload, customRequest, removeError, onChange, onRemove, onDrop, onPreview, defaultFileList, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
+const UploadDraggerComponent = ({ noItem, readOnly, multiple, loading, disabled, listType, formClassNames, formStyle, rootClassNames, classNames, accept, action, withCredentials, beforeUpload, customRequest, removeError, onChange, onRemove, onDrop, onPreview, defaultFileList, formColLayout, name, label, required, rules, ruleType, ruleMessage, validateStatus, help, }) => {
     const handleChange = (info) => {
         removeError === null || removeError === void 0 ? void 0 : removeError(name);
         onChange === null || onChange === void 0 ? void 0 : onChange(info);
@@ -33,7 +33,7 @@ const UploadDraggerComponent = ({ noItem, readOnly, multiple, loading, disabled,
     classNames && classDragger.push(...classNames);
     readOnly && classDragger.push(style_module['readonly']);
     const dragger = !loading ? (jsxRuntime.jsxRuntimeExports.jsxs(Dragger, { multiple: multiple, disabled: disabled || readOnly, listType: listType, rootClassName: rootClassDragger.join(' '), className: classDragger.join(' '), accept: accept === null || accept === void 0 ? void 0 : accept.map(accept => acceptFormat(accept)).join(', '), action: action, withCredentials: withCredentials, beforeUpload: beforeUpload, customRequest: customRequest, onChange: handleChange, onRemove: onRemove, onDrop: onDrop, onPreview: onPreview, defaultFileList: defaultFileList, children: [jsxRuntime.jsxRuntimeExports.jsx("p", { className: "ant-upload-drag-icon", children: jsxRuntime.jsxRuntimeExports.jsx(InboxOutlined, {}) }), jsxRuntime.jsxRuntimeExports.jsx("p", { className: "ant-upload-text", children: "Click or drag file to this area to upload" }), jsxRuntime.jsxRuntimeExports.jsx("p", { className: "ant-upload-hint", children: "Support for a single or bulk upload. Strictly prohibited from uploading company data or other banned files." })] })) : jsxRuntime.jsxRuntimeExports.jsx(antd.Skeleton.Input, { block: true, active: true });
-    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, valuePropName: "fileList", getValueFromEvent: normFile, validateStatus: validateStatus, help: help, children: dragger })))
+    return (jsxRuntime.jsxRuntimeExports.jsx(jsxRuntime.jsxRuntimeExports.Fragment, { children: !noItem ? (jsxRuntime.jsxRuntimeExports.jsx(Component, Object.assign({}, formColLayout, { name: name, label: label, classNames: formClassNames, required: required, ruleType: ruleType, ruleMessage: ruleMessage, rules: rules, valuePropName: "fileList", getValueFromEvent: normFile, validateStatus: validateStatus, help: help, style: formStyle, children: dragger })))
             : dragger }));
 };
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sti-antd-package",
   "description": "STI ANT Design",
-  "version": "0.1.6",
+  "version": "0.1.8",
   "type": "module",
   "main": "dist/lib/index.js",
   "module": "dist/esm/index.js",