x-ui-design 1.0.23 → 1.0.25
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 +4 -7
- package/dist/esm/types/index.d.ts +1 -7
- package/dist/index.d.ts +1 -7
- package/dist/index.esm.js +11 -6
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +10 -5
- package/dist/index.js.map +1 -1
- package/lib/components/Input/Input.tsx +10 -6
- package/package.json +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,
|
|
@@ -3874,10 +3874,13 @@ const InputComponent = /*#__PURE__*/React.forwardRef(({
|
|
|
3874
3874
|
// @ts-expect-error
|
|
3875
3875
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
3876
3876
|
__injected,
|
|
3877
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
3877
3878
|
defaultValue,
|
|
3879
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
3878
3880
|
child,
|
|
3881
|
+
ref,
|
|
3879
3882
|
...props
|
|
3880
|
-
}
|
|
3883
|
+
}) => {
|
|
3881
3884
|
const inputRef = React.useRef(null);
|
|
3882
3885
|
const lastKeyPressed = React.useRef(null);
|
|
3883
3886
|
const internalValue = mask ? applyMask(stripMask(`${value ?? ''}`, mask, maskChar), mask, maskChar).masked : value ?? '';
|
|
@@ -3890,9 +3893,11 @@ const InputComponent = /*#__PURE__*/React.forwardRef(({
|
|
|
3890
3893
|
input: inputRef.current,
|
|
3891
3894
|
nativeElement: inputRef.current,
|
|
3892
3895
|
setSelectionRange: (start, end) => {
|
|
3893
|
-
inputRef.current
|
|
3896
|
+
if (inputRef.current) {
|
|
3897
|
+
inputRef.current.setSelectionRange(start, end);
|
|
3898
|
+
}
|
|
3894
3899
|
}
|
|
3895
|
-
})
|
|
3900
|
+
}));
|
|
3896
3901
|
React.useEffect(() => {
|
|
3897
3902
|
setMaskValue(mask ? applyMask(stripMask(`${value ?? ''}`, mask, maskChar), mask, maskChar).masked : value ?? '');
|
|
3898
3903
|
}, [value, mask, maskChar]);
|
|
@@ -3984,7 +3989,7 @@ const InputComponent = /*#__PURE__*/React.forwardRef(({
|
|
|
3984
3989
|
} : {}), suffix || iconRender?.(iconRenderVisible), error && feedbackIcons ? /*#__PURE__*/React.createElement(ErrorIcon, null) : null)), addonAfter ? /*#__PURE__*/React.createElement("span", {
|
|
3985
3990
|
className: `${prefixCls}-addon ${prefixCls}-after ${prefixClsV3}-addon ${prefixClsV3}-after`
|
|
3986
3991
|
}, addonAfter) : null);
|
|
3987
|
-
}
|
|
3992
|
+
};
|
|
3988
3993
|
InputComponent.displayName = 'Input';
|
|
3989
3994
|
const Input$1 = InputComponent;
|
|
3990
3995
|
Input$1.TextArea = Textarea;
|