x-ui-design 1.0.26 → 1.0.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/types/components/Input/Input.d.ts +6 -26
- package/dist/esm/types/index.d.ts +1 -24
- package/dist/esm/types/types/input.d.ts +2 -1
- package/dist/index.d.ts +2 -26
- package/dist/index.esm.js +19 -11
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +18 -10
- package/dist/index.js.map +1 -1
- package/lib/components/Input/Input.tsx +18 -11
- package/lib/types/input.ts +2 -1
- package/package.json +1 -1
- package/src/app/page.tsx +1 -1
package/dist/index.js
CHANGED
|
@@ -3850,7 +3850,7 @@ function applyMask(raw, mask, maskChar = MASK_CHAR) {
|
|
|
3850
3850
|
var css_248z$f = ".xUi-input-container{align-items:center;background-color:transparent;border:1px solid var(--xui-border-color);border-radius:var(--xui-border-radius-sm);display:flex;overflow:hidden}.xUi-input-container:not(.xUi-input-error):not(.xUi-input-disabled):has(.xUi-input):hover,.xUi-input-container:not(.xUi-input-error):not(.xUi-input-disabled):has(.xUi-input:focus){border:1px solid var(--xui-primary-color)}.xUi-input-container.xUi-input-error{border-color:var(--xui-error-color)}.xUi-input-container.xUi-input-error .error-svg-icon,.xUi-input-suffix .error-svg-icon{color:var(--xui-error-color)}.xUi-input-wrapper{align-items:center;display:flex;flex-grow:1;position:relative;transition:border .3s}.xUi-input,.xUi-input-wrapper{background-color:transparent;height:-webkit-fill-available}.xUi-input{border:none;color:var(--xui-text-color);flex:1;outline:none;padding:.1px 7px;width:100%}.xUi-input:placeholder-shown{text-overflow:ellipsis}.xUi-input::placeholder{color:var(--xui-text-color);opacity:.6}.xUi-input-prefix,.xUi-input-suffix{background-color:transparent;gap:4px}.xUi-input-addon,.xUi-input-prefix,.xUi-input-suffix{align-items:center;color:var(--xui-text-color);display:flex;height:-webkit-fill-available;padding:0 7px}.xUi-input-addon.xUi-input-after{border-left:1px solid var(--xui-border-color)}.xUi-input-addon.xUi-input-before{border-right:1px solid var(--xui-border-color)}.xUi-input-large .xUi-input-addon{padding:0 10px}.xUi-input-clear{align-items:center;cursor:pointer;display:flex;margin:0 5px;position:relative;width:16px}.xUi-input-clear svg{color:var(--xui-text-color)}.xUi-input-disabled,.xUi-input-disabled .xUi-input,.xUi-input-disabled .xUi-input-suffix{background-color:var(--xui-color-disabled);cursor:not-allowed}.xUi-input-small{height:22px}.xUi-input-large .xUi-input-clear,.xUi-input-small .xUi-input,.xUi-input-small .xUi-input::placeholder{font-size:var(--xui-font-size-md)}.xUi-input-middle{border-radius:var(--xui-border-radius-md);height:30px}.xUi-input-large .xUi-input-clear,.xUi-input-middle .xUi-input,.xUi-input-middle .xUi-input::placeholder{font-size:var(--xui-font-size-md)}.xUi-input-large{border-radius:var(--xui-border-radius-lg);height:44px}.xUi-input-large .xUi-input,.xUi-input-large .xUi-input-clear,.xUi-input-large .xUi-input::placeholder{font-size:var(--xui-font-size-lg)}";
|
|
3851
3851
|
styleInject(css_248z$f);
|
|
3852
3852
|
|
|
3853
|
-
const InputComponent =
|
|
3853
|
+
const InputComponent = ({
|
|
3854
3854
|
size = 'large',
|
|
3855
3855
|
error,
|
|
3856
3856
|
suffix,
|
|
@@ -3870,13 +3870,17 @@ const InputComponent = /*#__PURE__*/React.forwardRef(({
|
|
|
3870
3870
|
mask,
|
|
3871
3871
|
maskChar = MASK_CHAR,
|
|
3872
3872
|
maskRegex = MASK_REGEX,
|
|
3873
|
+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
3873
3874
|
// @ts-expect-error
|
|
3874
3875
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
3875
3876
|
__injected,
|
|
3877
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
3876
3878
|
defaultValue,
|
|
3879
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
3877
3880
|
child,
|
|
3881
|
+
ref,
|
|
3878
3882
|
...props
|
|
3879
|
-
}
|
|
3883
|
+
}) => {
|
|
3880
3884
|
const inputRef = React.useRef(null);
|
|
3881
3885
|
const lastKeyPressed = React.useRef(null);
|
|
3882
3886
|
const internalValue = mask ? applyMask(stripMask(`${value ?? ''}`, mask, maskChar), mask, maskChar).masked : value ?? '';
|
|
@@ -3884,13 +3888,17 @@ const InputComponent = /*#__PURE__*/React.forwardRef(({
|
|
|
3884
3888
|
const [iconRenderVisible, setIconRenderVisible] = React.useState(false);
|
|
3885
3889
|
const animationRef = React.useRef(null);
|
|
3886
3890
|
React.useImperativeHandle(ref, () => ({
|
|
3887
|
-
|
|
3888
|
-
|
|
3889
|
-
|
|
3890
|
-
|
|
3891
|
-
|
|
3892
|
-
|
|
3893
|
-
|
|
3891
|
+
retry: () => ({
|
|
3892
|
+
focus: () => inputRef.current?.focus(),
|
|
3893
|
+
blur: () => inputRef.current?.blur(),
|
|
3894
|
+
input: inputRef.current,
|
|
3895
|
+
nativeElement: inputRef.current,
|
|
3896
|
+
setSelectionRange: (start, end) => {
|
|
3897
|
+
if (inputRef.current) {
|
|
3898
|
+
inputRef.current.setSelectionRange(start, end);
|
|
3899
|
+
}
|
|
3900
|
+
}
|
|
3901
|
+
})
|
|
3894
3902
|
}));
|
|
3895
3903
|
React.useEffect(() => {
|
|
3896
3904
|
setMaskValue(mask ? applyMask(stripMask(`${value ?? ''}`, mask, maskChar), mask, maskChar).masked : value ?? '');
|
|
@@ -3983,7 +3991,7 @@ const InputComponent = /*#__PURE__*/React.forwardRef(({
|
|
|
3983
3991
|
} : {}), suffix || iconRender?.(iconRenderVisible), error && feedbackIcons ? /*#__PURE__*/React.createElement(ErrorIcon, null) : null)), addonAfter ? /*#__PURE__*/React.createElement("span", {
|
|
3984
3992
|
className: `${prefixCls}-addon ${prefixCls}-after ${prefixClsV3}-addon ${prefixClsV3}-after`
|
|
3985
3993
|
}, addonAfter) : null);
|
|
3986
|
-
}
|
|
3994
|
+
};
|
|
3987
3995
|
InputComponent.displayName = 'Input';
|
|
3988
3996
|
const Input$1 = InputComponent;
|
|
3989
3997
|
Input$1.TextArea = Textarea;
|