@xaypay/tui 0.0.120 → 0.0.121
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/index.es.js +74 -217
- package/dist/index.js +74 -217
- package/package.json +1 -1
- package/storybook-static/favicon.ico +0 -0
package/dist/index.es.js
CHANGED
|
@@ -436,7 +436,6 @@ const compereConfigs = () => {
|
|
|
436
436
|
projectConfig = {};
|
|
437
437
|
// console.log(error, 'Project: if you want to use custom styles, create tui.config.js file in your project root');
|
|
438
438
|
}
|
|
439
|
-
|
|
440
439
|
return _.merge(packageConfig, projectConfig);
|
|
441
440
|
};
|
|
442
441
|
const hasOwnerProperty = (object, property) => {
|
|
@@ -476,11 +475,6 @@ const Button = ({
|
|
|
476
475
|
...props
|
|
477
476
|
}) => {
|
|
478
477
|
const [isHover, setIsHover] = useState(false);
|
|
479
|
-
useEffect(() => {
|
|
480
|
-
if (!label && !icon) {
|
|
481
|
-
alert('Add icon or label props on Button component');
|
|
482
|
-
}
|
|
483
|
-
}, []);
|
|
484
478
|
const configStyles = compereConfigs();
|
|
485
479
|
const classProps = classnames(className ? className : configStyles.BUTTON.className);
|
|
486
480
|
const handleMouseEnter = () => {
|
|
@@ -489,6 +483,11 @@ const Button = ({
|
|
|
489
483
|
const handleMouseLeave = () => {
|
|
490
484
|
setIsHover(false);
|
|
491
485
|
};
|
|
486
|
+
useEffect(() => {
|
|
487
|
+
if (!label && !icon) {
|
|
488
|
+
alert('Add icon or label props on Button component');
|
|
489
|
+
}
|
|
490
|
+
}, []);
|
|
492
491
|
return /*#__PURE__*/React__default.createElement("button", _extends({
|
|
493
492
|
style: {
|
|
494
493
|
display: 'flex',
|
|
@@ -1770,11 +1769,11 @@ const Table = ({
|
|
|
1770
1769
|
openListFontFamily,
|
|
1771
1770
|
hideBorder
|
|
1772
1771
|
}) => {
|
|
1772
|
+
const configStyles = compereConfigs();
|
|
1773
1773
|
const [body, setBody] = useState([]);
|
|
1774
1774
|
const [header, setHeader] = useState([]);
|
|
1775
1775
|
const [disableArr, setDisableArr] = useState([]);
|
|
1776
1776
|
const [checkedArray, setCheckedArray] = useState([]);
|
|
1777
|
-
const configStyles = compereConfigs();
|
|
1778
1777
|
const handleCheckIfArrow = (bodyData, data) => {
|
|
1779
1778
|
let removeItemIndex;
|
|
1780
1779
|
let headerWithoutArrow = [];
|
|
@@ -2895,133 +2894,102 @@ const Input = ({
|
|
|
2895
2894
|
const animation = () => css`
|
|
2896
2895
|
${errorShow} ${errorAnimationDuration ? errorAnimationDuration : configStyles.INPUT.errorAnimationDuration} forwards
|
|
2897
2896
|
`;
|
|
2898
|
-
const
|
|
2899
|
-
const currentValue = event.target.value;
|
|
2900
|
-
let prevValue = innerValue;
|
|
2901
|
-
setInnerValue(() => currentValue);
|
|
2902
|
-
if (change) {
|
|
2903
|
-
change(currentValue);
|
|
2904
|
-
}
|
|
2897
|
+
const handleCheckTypeTel = (val, prevVal) => {
|
|
2905
2898
|
if (type === 'tel') {
|
|
2906
|
-
if (!phoneNumberRegex.test(
|
|
2907
|
-
if (
|
|
2899
|
+
if (!phoneNumberRegex.test(val)) {
|
|
2900
|
+
if (val === '') {
|
|
2908
2901
|
setInnerErrorMessage('');
|
|
2909
2902
|
} else {
|
|
2910
2903
|
telErrorMessage ? setInnerErrorMessage(telErrorMessage) : setInnerErrorMessage(configStyles.INPUT.telErrorMessage);
|
|
2911
|
-
|
|
2912
|
-
if (change) {
|
|
2913
|
-
change(prevValue);
|
|
2914
|
-
}
|
|
2904
|
+
val = prevVal;
|
|
2915
2905
|
}
|
|
2916
2906
|
} else {
|
|
2917
2907
|
setInnerErrorMessage('');
|
|
2918
|
-
if (
|
|
2919
|
-
|
|
2920
|
-
if (change) {
|
|
2921
|
-
change(currentValue.substr(0, 8));
|
|
2922
|
-
}
|
|
2908
|
+
if (val.length > 8) {
|
|
2909
|
+
val = val.substr(0, 8);
|
|
2923
2910
|
}
|
|
2924
2911
|
}
|
|
2925
2912
|
}
|
|
2913
|
+
return val;
|
|
2914
|
+
};
|
|
2915
|
+
const handleCheckTypeNumber = val => {
|
|
2926
2916
|
if (type === 'number') {
|
|
2927
2917
|
const regNum = floatToFix && floatToFix >= 0 ? /^\d+(\.)?(\d+)?$/ : /^\d+$/;
|
|
2928
|
-
if (
|
|
2929
|
-
|
|
2930
|
-
if (change) {
|
|
2931
|
-
change(`${minNumSize}`);
|
|
2932
|
-
}
|
|
2918
|
+
if (val.length > 16) {
|
|
2919
|
+
val = val.substr(0, 16);
|
|
2933
2920
|
}
|
|
2934
|
-
if (
|
|
2935
|
-
|
|
2936
|
-
|
|
2937
|
-
|
|
2938
|
-
|
|
2921
|
+
if (val > Number.MAX_SAFE_INTEGER) {
|
|
2922
|
+
val = Number.MAX_SAFE_INTEGER;
|
|
2923
|
+
}
|
|
2924
|
+
if (val < Number.MIN_SAFE_INTEGER) {
|
|
2925
|
+
val = Number.MIN_SAFE_INTEGER;
|
|
2926
|
+
}
|
|
2927
|
+
if (minNumSize && val < minNumSize) {
|
|
2928
|
+
val = minNumSize;
|
|
2929
|
+
}
|
|
2930
|
+
if (maxNumSize && val > maxNumSize) {
|
|
2931
|
+
val = maxNumSize;
|
|
2939
2932
|
}
|
|
2940
2933
|
if (floatToFix > 0) {
|
|
2941
|
-
const floatNumParts = typeof
|
|
2934
|
+
const floatNumParts = typeof val === 'string' ? val.split('.') : val;
|
|
2942
2935
|
const int = floatNumParts[0];
|
|
2943
2936
|
const float = floatNumParts[1];
|
|
2944
2937
|
if (float) {
|
|
2945
2938
|
if (float[0] === '0' || float[0] !== '0') {
|
|
2946
2939
|
if (float[1] === undefined) {
|
|
2947
|
-
|
|
2948
|
-
if (change) {
|
|
2949
|
-
change(`${int}.${float[0]}`);
|
|
2950
|
-
}
|
|
2940
|
+
val = `${int}.${float[0]}`;
|
|
2951
2941
|
} else if (float[1] === '0') {
|
|
2952
2942
|
if (float[2] === undefined || float[2] === '0') {
|
|
2953
|
-
|
|
2954
|
-
if (change) {
|
|
2955
|
-
change(`${int}.${float[0]}`);
|
|
2956
|
-
}
|
|
2943
|
+
val = `${int}.${float[0]}`;
|
|
2957
2944
|
} else if (float[2] !== undefined && float[2] !== '0') {
|
|
2958
|
-
|
|
2959
|
-
if (change) {
|
|
2960
|
-
change(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
2961
|
-
}
|
|
2945
|
+
val = `${int}.${float[0]}${float[1]}${float[2]}`;
|
|
2962
2946
|
}
|
|
2963
2947
|
} else if (float[1] !== undefined && float[1] !== '0') {
|
|
2964
2948
|
if (float[2] === undefined || float[2] === '0') {
|
|
2965
|
-
|
|
2966
|
-
if (change) {
|
|
2967
|
-
change(`${int}.${float[0]}${float[1]}`);
|
|
2968
|
-
}
|
|
2949
|
+
val = `${int}.${float[0]}${float[1]}`;
|
|
2969
2950
|
} else if (float[2] !== undefined && float[2] !== '0') {
|
|
2970
|
-
|
|
2971
|
-
if (change) {
|
|
2972
|
-
change(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
2973
|
-
}
|
|
2951
|
+
val = `${int}.${float[0]}${float[1]}${float[2]}`;
|
|
2974
2952
|
}
|
|
2975
2953
|
}
|
|
2976
2954
|
}
|
|
2977
2955
|
}
|
|
2978
2956
|
} else {
|
|
2979
|
-
const floatNumParts = typeof
|
|
2957
|
+
const floatNumParts = typeof val === 'string' ? val.split('.') : val;
|
|
2980
2958
|
const int = floatNumParts[0];
|
|
2981
2959
|
if (floatNumParts && floatNumParts.length > 0 && floatToFix === 0) {
|
|
2982
|
-
|
|
2983
|
-
if (change) {
|
|
2984
|
-
change(`${int}`);
|
|
2985
|
-
}
|
|
2960
|
+
val = `${int}`;
|
|
2986
2961
|
}
|
|
2987
2962
|
}
|
|
2988
|
-
if (!regNum.test(
|
|
2989
|
-
const newStr =
|
|
2963
|
+
if (!regNum.test(val)) {
|
|
2964
|
+
const newStr = val.replace(/[^0-9.]/g, '').replace(/^([^.]*\.)(.*)$/, function (_, b, c) {
|
|
2990
2965
|
return b + c.replace(/\./g, '');
|
|
2991
2966
|
});
|
|
2992
|
-
|
|
2993
|
-
if (change) {
|
|
2994
|
-
change(newStr);
|
|
2995
|
-
}
|
|
2967
|
+
val = newStr;
|
|
2996
2968
|
}
|
|
2997
|
-
if (withoutDot && !/^\d+$/.test(
|
|
2998
|
-
const newStr =
|
|
2969
|
+
if (withoutDot && !/^\d+$/.test(val)) {
|
|
2970
|
+
const newStr = val.replace(/[^0-9]/g, '').replace(/^([^.]*\.)(.*)$/, function (_, b, c) {
|
|
2999
2971
|
return b + c.replace(/\./g, '');
|
|
3000
2972
|
});
|
|
3001
|
-
|
|
3002
|
-
if (change) {
|
|
3003
|
-
change(newStr);
|
|
3004
|
-
}
|
|
3005
|
-
}
|
|
3006
|
-
if (currentValue === '') {
|
|
3007
|
-
setInnerValue('');
|
|
3008
|
-
if (change) {
|
|
3009
|
-
change('');
|
|
3010
|
-
}
|
|
2973
|
+
val = newStr;
|
|
3011
2974
|
}
|
|
3012
2975
|
}
|
|
3013
|
-
|
|
2976
|
+
return val;
|
|
2977
|
+
};
|
|
2978
|
+
const handleChange = event => {
|
|
2979
|
+
let prevValue = innerValue;
|
|
2980
|
+
let currentValue = event.target.value;
|
|
2981
|
+
const max = maxLength ? maxLength : configStyles.INPUT.maxLength;
|
|
2982
|
+
currentValue = handleCheckTypeTel(currentValue, prevValue);
|
|
2983
|
+
currentValue = handleCheckTypeNumber(currentValue);
|
|
3014
2984
|
if (max && currentValue.length > max && type !== 'tel' && type !== 'number') {
|
|
3015
|
-
|
|
3016
|
-
if (change) {
|
|
3017
|
-
change(currentValue.substr(0, max));
|
|
3018
|
-
}
|
|
2985
|
+
currentValue = currentValue.substr(0, max);
|
|
3019
2986
|
}
|
|
3020
2987
|
if (regexp && regexpErrorMessage && !maxLength && type !== 'tel') {
|
|
3021
2988
|
!regexp.test(currentValue) ? setInnerErrorMessage(regexpErrorMessage) : setInnerErrorMessage('');
|
|
3022
|
-
|
|
3023
|
-
|
|
3024
|
-
|
|
2989
|
+
}
|
|
2990
|
+
setInnerValue(() => currentValue);
|
|
2991
|
+
if (change && currentValue !== prevValue) {
|
|
2992
|
+
change(currentValue);
|
|
3025
2993
|
}
|
|
3026
2994
|
};
|
|
3027
2995
|
const handleMouseEnter = () => {
|
|
@@ -3039,135 +3007,24 @@ const Input = ({
|
|
|
3039
3007
|
} else {
|
|
3040
3008
|
setInnerErrorMessage('');
|
|
3041
3009
|
}
|
|
3010
|
+
let newValue = value;
|
|
3042
3011
|
if (value !== undefined) {
|
|
3043
3012
|
if (value === null) {
|
|
3044
|
-
|
|
3013
|
+
newValue = '';
|
|
3045
3014
|
} else {
|
|
3046
|
-
|
|
3047
|
-
|
|
3048
|
-
|
|
3049
|
-
// if (!phoneNumberRegex.test(value)) {
|
|
3050
|
-
// if (value === '') {
|
|
3051
|
-
// setInnerErrorMessage('');
|
|
3052
|
-
// } else {
|
|
3053
|
-
// telErrorMessage ? setInnerErrorMessage(telErrorMessage) : setInnerErrorMessage(configStyles.INPUT.telErrorMessage);
|
|
3054
|
-
// }
|
|
3055
|
-
// } else {
|
|
3056
|
-
// if (value.length < 8) {
|
|
3057
|
-
// telErrorMessage ? setInnerErrorMessage(telErrorMessage) : setInnerErrorMessage(configStyles.INPUT.telErrorMessage);
|
|
3058
|
-
// } else if (value.length > 8) {
|
|
3059
|
-
// setInnerValue(value.substr(0, 8));
|
|
3060
|
-
// }
|
|
3061
|
-
// }
|
|
3062
|
-
if (value.length <= 8) {
|
|
3063
|
-
setInnerValue(value);
|
|
3064
|
-
} else {
|
|
3065
|
-
setInnerValue(value.substr(0, 8));
|
|
3066
|
-
}
|
|
3067
|
-
}
|
|
3068
|
-
if (type === 'number') {
|
|
3069
|
-
const regNum = floatToFix && floatToFix >= 0 ? /^\d+(\.)?(\d+)?$/ : /^\d+$/;
|
|
3070
|
-
if (minNumSize && value < minNumSize) {
|
|
3071
|
-
setInnerValue(`${minNumSize}`);
|
|
3072
|
-
if (change) {
|
|
3073
|
-
change(`${minNumSize}`);
|
|
3074
|
-
}
|
|
3075
|
-
}
|
|
3076
|
-
if (maxNumSize && value > maxNumSize) {
|
|
3077
|
-
setInnerValue(`${maxNumSize}`);
|
|
3078
|
-
if (change) {
|
|
3079
|
-
change(`${maxNumSize}`);
|
|
3080
|
-
}
|
|
3081
|
-
}
|
|
3082
|
-
if (floatToFix > 0) {
|
|
3083
|
-
const floatNumParts = typeof value === 'string' ? value.split('.') : value;
|
|
3084
|
-
const int = floatNumParts[0];
|
|
3085
|
-
const float = floatNumParts[1];
|
|
3086
|
-
if (float) {
|
|
3087
|
-
if (float[0] === '0' || float[0] !== '0') {
|
|
3088
|
-
if (float[1] === undefined) {
|
|
3089
|
-
setInnerValue(`${int}.${float[0]}`);
|
|
3090
|
-
if (change) {
|
|
3091
|
-
change(`${int}.${float[0]}`);
|
|
3092
|
-
}
|
|
3093
|
-
} else if (float[1] === '0') {
|
|
3094
|
-
if (float[2] === undefined || float[2] === '0') {
|
|
3095
|
-
setInnerValue(`${int}.${float[0]}`);
|
|
3096
|
-
if (change) {
|
|
3097
|
-
change(`${int}.${float[0]}`);
|
|
3098
|
-
}
|
|
3099
|
-
} else if (float[2] !== undefined && float[2] !== '0') {
|
|
3100
|
-
setInnerValue(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
3101
|
-
if (change) {
|
|
3102
|
-
change(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
3103
|
-
}
|
|
3104
|
-
}
|
|
3105
|
-
} else if (float[1] !== undefined && float[1] !== '0') {
|
|
3106
|
-
if (float[2] === undefined || float[2] === '0') {
|
|
3107
|
-
setInnerValue(`${int}.${float[0]}${float[1]}`);
|
|
3108
|
-
if (change) {
|
|
3109
|
-
change(`${int}.${float[0]}${float[1]}`);
|
|
3110
|
-
}
|
|
3111
|
-
} else if (float[2] !== undefined && float[2] !== '0') {
|
|
3112
|
-
setInnerValue(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
3113
|
-
if (change) {
|
|
3114
|
-
change(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
3115
|
-
}
|
|
3116
|
-
}
|
|
3117
|
-
}
|
|
3118
|
-
}
|
|
3119
|
-
}
|
|
3120
|
-
} else {
|
|
3121
|
-
const floatNumParts = typeof value === 'string' ? value.split('.') : value;
|
|
3122
|
-
const int = floatNumParts[0];
|
|
3123
|
-
if (floatNumParts && floatNumParts.length > 0 && floatToFix === 0) {
|
|
3124
|
-
setInnerValue(`${int}`);
|
|
3125
|
-
if (change) {
|
|
3126
|
-
change(`${int}`);
|
|
3127
|
-
}
|
|
3128
|
-
}
|
|
3129
|
-
}
|
|
3130
|
-
if (!regNum.test(value)) {
|
|
3131
|
-
const newStr = value.replace(/[^0-9.]/g, '').replace(/^([^.]*\.)(.*)$/, function (_, b, c) {
|
|
3132
|
-
return b + c.replace(/\./g, '');
|
|
3133
|
-
});
|
|
3134
|
-
setInnerValue(newStr);
|
|
3135
|
-
if (change) {
|
|
3136
|
-
change(newStr);
|
|
3137
|
-
}
|
|
3138
|
-
}
|
|
3139
|
-
if (withoutDot && !/^\d+$/.test(value)) {
|
|
3140
|
-
const newStr = value.replace(/[^0-9]/g, '').replace(/^([^.]*\.)(.*)$/, function (_, b, c) {
|
|
3141
|
-
return b + c.replace(/\./g, '');
|
|
3142
|
-
});
|
|
3143
|
-
setInnerValue(newStr);
|
|
3144
|
-
if (change) {
|
|
3145
|
-
change(newStr);
|
|
3146
|
-
}
|
|
3147
|
-
}
|
|
3148
|
-
if (value === '') {
|
|
3149
|
-
setInnerValue('');
|
|
3150
|
-
if (change) {
|
|
3151
|
-
change('');
|
|
3152
|
-
}
|
|
3153
|
-
}
|
|
3154
|
-
}
|
|
3155
|
-
if (maxLength && value.length > maxLength && type !== 'tel') {
|
|
3156
|
-
setInnerValue(value.substr(0, maxLength));
|
|
3157
|
-
}
|
|
3158
|
-
const max = configStyles.INPUT.maxLength || maxLength;
|
|
3015
|
+
const max = maxLength ? maxLength : configStyles.INPUT.maxLength;
|
|
3016
|
+
newValue = handleCheckTypeTel(newValue, value);
|
|
3017
|
+
newValue = handleCheckTypeNumber(value);
|
|
3159
3018
|
if (max && value.length > max && type !== 'tel' && type !== 'number') {
|
|
3160
|
-
|
|
3161
|
-
if (change) {
|
|
3162
|
-
change(value.substr(0, max));
|
|
3163
|
-
}
|
|
3019
|
+
newValue = value.substr(0, max);
|
|
3164
3020
|
}
|
|
3165
3021
|
if (regexp && regexpErrorMessage && !maxLength && type !== 'tel') {
|
|
3166
3022
|
!regexp.test(value) ? setInnerErrorMessage(regexpErrorMessage) : setInnerErrorMessage('');
|
|
3167
3023
|
}
|
|
3024
|
+
setInnerValue(() => newValue);
|
|
3168
3025
|
}
|
|
3169
3026
|
}
|
|
3170
|
-
}, [type, value, regexp, maxLength, errorMessage, regexpErrorMessage, telErrorMessage
|
|
3027
|
+
}, [type, value, regexp, maxLength, errorMessage, regexpErrorMessage, telErrorMessage]);
|
|
3171
3028
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
3172
3029
|
className: classProps
|
|
3173
3030
|
}, label ? /*#__PURE__*/React__default.createElement("label", {
|
|
@@ -3594,12 +3451,12 @@ const Select = ({
|
|
|
3594
3451
|
boxShadowHover
|
|
3595
3452
|
}) => {
|
|
3596
3453
|
const ref = useRef();
|
|
3454
|
+
const configStyles = compereConfigs();
|
|
3455
|
+
const classProps = classnames(className ? className : configStyles.SELECT.className);
|
|
3597
3456
|
const [opened, setOpened] = useState(false);
|
|
3598
3457
|
const [isHover, setIsHover] = useState(false);
|
|
3599
3458
|
const [newSelected, setNewSelected] = useState([]);
|
|
3600
3459
|
const [existOptions, setExistOptions] = useState([]);
|
|
3601
|
-
const configStyles = compereConfigs();
|
|
3602
|
-
const classProps = classnames(className ? className : configStyles.SELECT.className);
|
|
3603
3460
|
const handleOpenClose = () => {
|
|
3604
3461
|
setOpened(!opened);
|
|
3605
3462
|
};
|
|
@@ -4276,11 +4133,11 @@ const Tooltip = ({
|
|
|
4276
4133
|
tooltipBackgroundColor
|
|
4277
4134
|
}) => {
|
|
4278
4135
|
const tooltipRef = /*#__PURE__*/createRef(null);
|
|
4136
|
+
const configStyles = compereConfigs();
|
|
4137
|
+
const classProps = classnames(styles$4['tooltip-block'], className ? className : configStyles.TOOLTIP.className);
|
|
4279
4138
|
const [checkTooltipWidth, setCheckTooltipWidth] = useState(0);
|
|
4280
4139
|
const [checkTooltipHeight, setCheckTooltipHeight] = useState(0);
|
|
4281
4140
|
const [showTooltip, setShowTooltip] = useState(false);
|
|
4282
|
-
const configStyles = compereConfigs();
|
|
4283
|
-
const classProps = classnames(styles$4['tooltip-block'], className ? className : configStyles.TOOLTIP.className);
|
|
4284
4141
|
const handleShow = () => {
|
|
4285
4142
|
setShowTooltip(!showTooltip);
|
|
4286
4143
|
};
|
|
@@ -4692,12 +4549,12 @@ const Textarea = ({
|
|
|
4692
4549
|
showCharacterCount,
|
|
4693
4550
|
characterCountPosition
|
|
4694
4551
|
}) => {
|
|
4552
|
+
const configStyles = compereConfigs();
|
|
4553
|
+
const classProps = classnames(className ? className : configStyles.TEXTAREA.className);
|
|
4695
4554
|
const [error, setError] = useState('');
|
|
4696
4555
|
const [isHover, setIsHover] = useState(false);
|
|
4697
4556
|
const [isFocus, setIsFocus] = useState(false);
|
|
4698
4557
|
const [innerValue, setInnerValue] = useState('');
|
|
4699
|
-
const configStyles = compereConfigs();
|
|
4700
|
-
const classProps = classnames(className ? className : configStyles.TEXTAREA.className);
|
|
4701
4558
|
const handleMouseEnter = () => {
|
|
4702
4559
|
setIsHover(true);
|
|
4703
4560
|
};
|
|
@@ -4897,11 +4754,6 @@ const Typography = ({
|
|
|
4897
4754
|
const classProps = classnames(className ? className : configStyles.TYPOGRAPHY.className);
|
|
4898
4755
|
const [isHover, setIsHover] = useState(false);
|
|
4899
4756
|
const [validVariant, setValidVariant] = useState(false);
|
|
4900
|
-
useEffect(() => {
|
|
4901
|
-
if (!Object.values(TypographyType).includes(variant)) {
|
|
4902
|
-
setValidVariant(true);
|
|
4903
|
-
}
|
|
4904
|
-
}, [variant]);
|
|
4905
4757
|
const handleMouseEnter = () => {
|
|
4906
4758
|
setIsHover(true);
|
|
4907
4759
|
};
|
|
@@ -4931,6 +4783,11 @@ const Typography = ({
|
|
|
4931
4783
|
onMouseEnter: handleMouseEnter,
|
|
4932
4784
|
onMouseLeave: handleMouseLeave
|
|
4933
4785
|
}, [children]);
|
|
4786
|
+
useEffect(() => {
|
|
4787
|
+
if (!Object.values(TypographyType).includes(variant)) {
|
|
4788
|
+
setValidVariant(true);
|
|
4789
|
+
}
|
|
4790
|
+
}, [variant]);
|
|
4934
4791
|
return validVariant ? 'Please set Typography valid variant' : tagT;
|
|
4935
4792
|
};
|
|
4936
4793
|
Typography.propTypes = {
|
package/dist/index.js
CHANGED
|
@@ -466,7 +466,6 @@ const compereConfigs = () => {
|
|
|
466
466
|
projectConfig = {};
|
|
467
467
|
// console.log(error, 'Project: if you want to use custom styles, create tui.config.js file in your project root');
|
|
468
468
|
}
|
|
469
|
-
|
|
470
469
|
return _.merge(packageConfig, projectConfig);
|
|
471
470
|
};
|
|
472
471
|
const hasOwnerProperty = (object, property) => {
|
|
@@ -506,11 +505,6 @@ const Button = ({
|
|
|
506
505
|
...props
|
|
507
506
|
}) => {
|
|
508
507
|
const [isHover, setIsHover] = React.useState(false);
|
|
509
|
-
React.useEffect(() => {
|
|
510
|
-
if (!label && !icon) {
|
|
511
|
-
alert('Add icon or label props on Button component');
|
|
512
|
-
}
|
|
513
|
-
}, []);
|
|
514
508
|
const configStyles = compereConfigs();
|
|
515
509
|
const classProps = classnames__default["default"](className ? className : configStyles.BUTTON.className);
|
|
516
510
|
const handleMouseEnter = () => {
|
|
@@ -519,6 +513,11 @@ const Button = ({
|
|
|
519
513
|
const handleMouseLeave = () => {
|
|
520
514
|
setIsHover(false);
|
|
521
515
|
};
|
|
516
|
+
React.useEffect(() => {
|
|
517
|
+
if (!label && !icon) {
|
|
518
|
+
alert('Add icon or label props on Button component');
|
|
519
|
+
}
|
|
520
|
+
}, []);
|
|
522
521
|
return /*#__PURE__*/React__default["default"].createElement("button", _extends({
|
|
523
522
|
style: {
|
|
524
523
|
display: 'flex',
|
|
@@ -1800,11 +1799,11 @@ const Table = ({
|
|
|
1800
1799
|
openListFontFamily,
|
|
1801
1800
|
hideBorder
|
|
1802
1801
|
}) => {
|
|
1802
|
+
const configStyles = compereConfigs();
|
|
1803
1803
|
const [body, setBody] = React.useState([]);
|
|
1804
1804
|
const [header, setHeader] = React.useState([]);
|
|
1805
1805
|
const [disableArr, setDisableArr] = React.useState([]);
|
|
1806
1806
|
const [checkedArray, setCheckedArray] = React.useState([]);
|
|
1807
|
-
const configStyles = compereConfigs();
|
|
1808
1807
|
const handleCheckIfArrow = (bodyData, data) => {
|
|
1809
1808
|
let removeItemIndex;
|
|
1810
1809
|
let headerWithoutArrow = [];
|
|
@@ -2925,133 +2924,102 @@ const Input = ({
|
|
|
2925
2924
|
const animation = () => styled.css`
|
|
2926
2925
|
${errorShow} ${errorAnimationDuration ? errorAnimationDuration : configStyles.INPUT.errorAnimationDuration} forwards
|
|
2927
2926
|
`;
|
|
2928
|
-
const
|
|
2929
|
-
const currentValue = event.target.value;
|
|
2930
|
-
let prevValue = innerValue;
|
|
2931
|
-
setInnerValue(() => currentValue);
|
|
2932
|
-
if (change) {
|
|
2933
|
-
change(currentValue);
|
|
2934
|
-
}
|
|
2927
|
+
const handleCheckTypeTel = (val, prevVal) => {
|
|
2935
2928
|
if (type === 'tel') {
|
|
2936
|
-
if (!phoneNumberRegex.test(
|
|
2937
|
-
if (
|
|
2929
|
+
if (!phoneNumberRegex.test(val)) {
|
|
2930
|
+
if (val === '') {
|
|
2938
2931
|
setInnerErrorMessage('');
|
|
2939
2932
|
} else {
|
|
2940
2933
|
telErrorMessage ? setInnerErrorMessage(telErrorMessage) : setInnerErrorMessage(configStyles.INPUT.telErrorMessage);
|
|
2941
|
-
|
|
2942
|
-
if (change) {
|
|
2943
|
-
change(prevValue);
|
|
2944
|
-
}
|
|
2934
|
+
val = prevVal;
|
|
2945
2935
|
}
|
|
2946
2936
|
} else {
|
|
2947
2937
|
setInnerErrorMessage('');
|
|
2948
|
-
if (
|
|
2949
|
-
|
|
2950
|
-
if (change) {
|
|
2951
|
-
change(currentValue.substr(0, 8));
|
|
2952
|
-
}
|
|
2938
|
+
if (val.length > 8) {
|
|
2939
|
+
val = val.substr(0, 8);
|
|
2953
2940
|
}
|
|
2954
2941
|
}
|
|
2955
2942
|
}
|
|
2943
|
+
return val;
|
|
2944
|
+
};
|
|
2945
|
+
const handleCheckTypeNumber = val => {
|
|
2956
2946
|
if (type === 'number') {
|
|
2957
2947
|
const regNum = floatToFix && floatToFix >= 0 ? /^\d+(\.)?(\d+)?$/ : /^\d+$/;
|
|
2958
|
-
if (
|
|
2959
|
-
|
|
2960
|
-
if (change) {
|
|
2961
|
-
change(`${minNumSize}`);
|
|
2962
|
-
}
|
|
2948
|
+
if (val.length > 16) {
|
|
2949
|
+
val = val.substr(0, 16);
|
|
2963
2950
|
}
|
|
2964
|
-
if (
|
|
2965
|
-
|
|
2966
|
-
|
|
2967
|
-
|
|
2968
|
-
|
|
2951
|
+
if (val > Number.MAX_SAFE_INTEGER) {
|
|
2952
|
+
val = Number.MAX_SAFE_INTEGER;
|
|
2953
|
+
}
|
|
2954
|
+
if (val < Number.MIN_SAFE_INTEGER) {
|
|
2955
|
+
val = Number.MIN_SAFE_INTEGER;
|
|
2956
|
+
}
|
|
2957
|
+
if (minNumSize && val < minNumSize) {
|
|
2958
|
+
val = minNumSize;
|
|
2959
|
+
}
|
|
2960
|
+
if (maxNumSize && val > maxNumSize) {
|
|
2961
|
+
val = maxNumSize;
|
|
2969
2962
|
}
|
|
2970
2963
|
if (floatToFix > 0) {
|
|
2971
|
-
const floatNumParts = typeof
|
|
2964
|
+
const floatNumParts = typeof val === 'string' ? val.split('.') : val;
|
|
2972
2965
|
const int = floatNumParts[0];
|
|
2973
2966
|
const float = floatNumParts[1];
|
|
2974
2967
|
if (float) {
|
|
2975
2968
|
if (float[0] === '0' || float[0] !== '0') {
|
|
2976
2969
|
if (float[1] === undefined) {
|
|
2977
|
-
|
|
2978
|
-
if (change) {
|
|
2979
|
-
change(`${int}.${float[0]}`);
|
|
2980
|
-
}
|
|
2970
|
+
val = `${int}.${float[0]}`;
|
|
2981
2971
|
} else if (float[1] === '0') {
|
|
2982
2972
|
if (float[2] === undefined || float[2] === '0') {
|
|
2983
|
-
|
|
2984
|
-
if (change) {
|
|
2985
|
-
change(`${int}.${float[0]}`);
|
|
2986
|
-
}
|
|
2973
|
+
val = `${int}.${float[0]}`;
|
|
2987
2974
|
} else if (float[2] !== undefined && float[2] !== '0') {
|
|
2988
|
-
|
|
2989
|
-
if (change) {
|
|
2990
|
-
change(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
2991
|
-
}
|
|
2975
|
+
val = `${int}.${float[0]}${float[1]}${float[2]}`;
|
|
2992
2976
|
}
|
|
2993
2977
|
} else if (float[1] !== undefined && float[1] !== '0') {
|
|
2994
2978
|
if (float[2] === undefined || float[2] === '0') {
|
|
2995
|
-
|
|
2996
|
-
if (change) {
|
|
2997
|
-
change(`${int}.${float[0]}${float[1]}`);
|
|
2998
|
-
}
|
|
2979
|
+
val = `${int}.${float[0]}${float[1]}`;
|
|
2999
2980
|
} else if (float[2] !== undefined && float[2] !== '0') {
|
|
3000
|
-
|
|
3001
|
-
if (change) {
|
|
3002
|
-
change(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
3003
|
-
}
|
|
2981
|
+
val = `${int}.${float[0]}${float[1]}${float[2]}`;
|
|
3004
2982
|
}
|
|
3005
2983
|
}
|
|
3006
2984
|
}
|
|
3007
2985
|
}
|
|
3008
2986
|
} else {
|
|
3009
|
-
const floatNumParts = typeof
|
|
2987
|
+
const floatNumParts = typeof val === 'string' ? val.split('.') : val;
|
|
3010
2988
|
const int = floatNumParts[0];
|
|
3011
2989
|
if (floatNumParts && floatNumParts.length > 0 && floatToFix === 0) {
|
|
3012
|
-
|
|
3013
|
-
if (change) {
|
|
3014
|
-
change(`${int}`);
|
|
3015
|
-
}
|
|
2990
|
+
val = `${int}`;
|
|
3016
2991
|
}
|
|
3017
2992
|
}
|
|
3018
|
-
if (!regNum.test(
|
|
3019
|
-
const newStr =
|
|
2993
|
+
if (!regNum.test(val)) {
|
|
2994
|
+
const newStr = val.replace(/[^0-9.]/g, '').replace(/^([^.]*\.)(.*)$/, function (_, b, c) {
|
|
3020
2995
|
return b + c.replace(/\./g, '');
|
|
3021
2996
|
});
|
|
3022
|
-
|
|
3023
|
-
if (change) {
|
|
3024
|
-
change(newStr);
|
|
3025
|
-
}
|
|
2997
|
+
val = newStr;
|
|
3026
2998
|
}
|
|
3027
|
-
if (withoutDot && !/^\d+$/.test(
|
|
3028
|
-
const newStr =
|
|
2999
|
+
if (withoutDot && !/^\d+$/.test(val)) {
|
|
3000
|
+
const newStr = val.replace(/[^0-9]/g, '').replace(/^([^.]*\.)(.*)$/, function (_, b, c) {
|
|
3029
3001
|
return b + c.replace(/\./g, '');
|
|
3030
3002
|
});
|
|
3031
|
-
|
|
3032
|
-
if (change) {
|
|
3033
|
-
change(newStr);
|
|
3034
|
-
}
|
|
3035
|
-
}
|
|
3036
|
-
if (currentValue === '') {
|
|
3037
|
-
setInnerValue('');
|
|
3038
|
-
if (change) {
|
|
3039
|
-
change('');
|
|
3040
|
-
}
|
|
3003
|
+
val = newStr;
|
|
3041
3004
|
}
|
|
3042
3005
|
}
|
|
3043
|
-
|
|
3006
|
+
return val;
|
|
3007
|
+
};
|
|
3008
|
+
const handleChange = event => {
|
|
3009
|
+
let prevValue = innerValue;
|
|
3010
|
+
let currentValue = event.target.value;
|
|
3011
|
+
const max = maxLength ? maxLength : configStyles.INPUT.maxLength;
|
|
3012
|
+
currentValue = handleCheckTypeTel(currentValue, prevValue);
|
|
3013
|
+
currentValue = handleCheckTypeNumber(currentValue);
|
|
3044
3014
|
if (max && currentValue.length > max && type !== 'tel' && type !== 'number') {
|
|
3045
|
-
|
|
3046
|
-
if (change) {
|
|
3047
|
-
change(currentValue.substr(0, max));
|
|
3048
|
-
}
|
|
3015
|
+
currentValue = currentValue.substr(0, max);
|
|
3049
3016
|
}
|
|
3050
3017
|
if (regexp && regexpErrorMessage && !maxLength && type !== 'tel') {
|
|
3051
3018
|
!regexp.test(currentValue) ? setInnerErrorMessage(regexpErrorMessage) : setInnerErrorMessage('');
|
|
3052
|
-
|
|
3053
|
-
|
|
3054
|
-
|
|
3019
|
+
}
|
|
3020
|
+
setInnerValue(() => currentValue);
|
|
3021
|
+
if (change && currentValue !== prevValue) {
|
|
3022
|
+
change(currentValue);
|
|
3055
3023
|
}
|
|
3056
3024
|
};
|
|
3057
3025
|
const handleMouseEnter = () => {
|
|
@@ -3069,135 +3037,24 @@ const Input = ({
|
|
|
3069
3037
|
} else {
|
|
3070
3038
|
setInnerErrorMessage('');
|
|
3071
3039
|
}
|
|
3040
|
+
let newValue = value;
|
|
3072
3041
|
if (value !== undefined) {
|
|
3073
3042
|
if (value === null) {
|
|
3074
|
-
|
|
3043
|
+
newValue = '';
|
|
3075
3044
|
} else {
|
|
3076
|
-
|
|
3077
|
-
|
|
3078
|
-
|
|
3079
|
-
// if (!phoneNumberRegex.test(value)) {
|
|
3080
|
-
// if (value === '') {
|
|
3081
|
-
// setInnerErrorMessage('');
|
|
3082
|
-
// } else {
|
|
3083
|
-
// telErrorMessage ? setInnerErrorMessage(telErrorMessage) : setInnerErrorMessage(configStyles.INPUT.telErrorMessage);
|
|
3084
|
-
// }
|
|
3085
|
-
// } else {
|
|
3086
|
-
// if (value.length < 8) {
|
|
3087
|
-
// telErrorMessage ? setInnerErrorMessage(telErrorMessage) : setInnerErrorMessage(configStyles.INPUT.telErrorMessage);
|
|
3088
|
-
// } else if (value.length > 8) {
|
|
3089
|
-
// setInnerValue(value.substr(0, 8));
|
|
3090
|
-
// }
|
|
3091
|
-
// }
|
|
3092
|
-
if (value.length <= 8) {
|
|
3093
|
-
setInnerValue(value);
|
|
3094
|
-
} else {
|
|
3095
|
-
setInnerValue(value.substr(0, 8));
|
|
3096
|
-
}
|
|
3097
|
-
}
|
|
3098
|
-
if (type === 'number') {
|
|
3099
|
-
const regNum = floatToFix && floatToFix >= 0 ? /^\d+(\.)?(\d+)?$/ : /^\d+$/;
|
|
3100
|
-
if (minNumSize && value < minNumSize) {
|
|
3101
|
-
setInnerValue(`${minNumSize}`);
|
|
3102
|
-
if (change) {
|
|
3103
|
-
change(`${minNumSize}`);
|
|
3104
|
-
}
|
|
3105
|
-
}
|
|
3106
|
-
if (maxNumSize && value > maxNumSize) {
|
|
3107
|
-
setInnerValue(`${maxNumSize}`);
|
|
3108
|
-
if (change) {
|
|
3109
|
-
change(`${maxNumSize}`);
|
|
3110
|
-
}
|
|
3111
|
-
}
|
|
3112
|
-
if (floatToFix > 0) {
|
|
3113
|
-
const floatNumParts = typeof value === 'string' ? value.split('.') : value;
|
|
3114
|
-
const int = floatNumParts[0];
|
|
3115
|
-
const float = floatNumParts[1];
|
|
3116
|
-
if (float) {
|
|
3117
|
-
if (float[0] === '0' || float[0] !== '0') {
|
|
3118
|
-
if (float[1] === undefined) {
|
|
3119
|
-
setInnerValue(`${int}.${float[0]}`);
|
|
3120
|
-
if (change) {
|
|
3121
|
-
change(`${int}.${float[0]}`);
|
|
3122
|
-
}
|
|
3123
|
-
} else if (float[1] === '0') {
|
|
3124
|
-
if (float[2] === undefined || float[2] === '0') {
|
|
3125
|
-
setInnerValue(`${int}.${float[0]}`);
|
|
3126
|
-
if (change) {
|
|
3127
|
-
change(`${int}.${float[0]}`);
|
|
3128
|
-
}
|
|
3129
|
-
} else if (float[2] !== undefined && float[2] !== '0') {
|
|
3130
|
-
setInnerValue(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
3131
|
-
if (change) {
|
|
3132
|
-
change(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
3133
|
-
}
|
|
3134
|
-
}
|
|
3135
|
-
} else if (float[1] !== undefined && float[1] !== '0') {
|
|
3136
|
-
if (float[2] === undefined || float[2] === '0') {
|
|
3137
|
-
setInnerValue(`${int}.${float[0]}${float[1]}`);
|
|
3138
|
-
if (change) {
|
|
3139
|
-
change(`${int}.${float[0]}${float[1]}`);
|
|
3140
|
-
}
|
|
3141
|
-
} else if (float[2] !== undefined && float[2] !== '0') {
|
|
3142
|
-
setInnerValue(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
3143
|
-
if (change) {
|
|
3144
|
-
change(`${int}.${float[0]}${float[1]}${float[2]}`);
|
|
3145
|
-
}
|
|
3146
|
-
}
|
|
3147
|
-
}
|
|
3148
|
-
}
|
|
3149
|
-
}
|
|
3150
|
-
} else {
|
|
3151
|
-
const floatNumParts = typeof value === 'string' ? value.split('.') : value;
|
|
3152
|
-
const int = floatNumParts[0];
|
|
3153
|
-
if (floatNumParts && floatNumParts.length > 0 && floatToFix === 0) {
|
|
3154
|
-
setInnerValue(`${int}`);
|
|
3155
|
-
if (change) {
|
|
3156
|
-
change(`${int}`);
|
|
3157
|
-
}
|
|
3158
|
-
}
|
|
3159
|
-
}
|
|
3160
|
-
if (!regNum.test(value)) {
|
|
3161
|
-
const newStr = value.replace(/[^0-9.]/g, '').replace(/^([^.]*\.)(.*)$/, function (_, b, c) {
|
|
3162
|
-
return b + c.replace(/\./g, '');
|
|
3163
|
-
});
|
|
3164
|
-
setInnerValue(newStr);
|
|
3165
|
-
if (change) {
|
|
3166
|
-
change(newStr);
|
|
3167
|
-
}
|
|
3168
|
-
}
|
|
3169
|
-
if (withoutDot && !/^\d+$/.test(value)) {
|
|
3170
|
-
const newStr = value.replace(/[^0-9]/g, '').replace(/^([^.]*\.)(.*)$/, function (_, b, c) {
|
|
3171
|
-
return b + c.replace(/\./g, '');
|
|
3172
|
-
});
|
|
3173
|
-
setInnerValue(newStr);
|
|
3174
|
-
if (change) {
|
|
3175
|
-
change(newStr);
|
|
3176
|
-
}
|
|
3177
|
-
}
|
|
3178
|
-
if (value === '') {
|
|
3179
|
-
setInnerValue('');
|
|
3180
|
-
if (change) {
|
|
3181
|
-
change('');
|
|
3182
|
-
}
|
|
3183
|
-
}
|
|
3184
|
-
}
|
|
3185
|
-
if (maxLength && value.length > maxLength && type !== 'tel') {
|
|
3186
|
-
setInnerValue(value.substr(0, maxLength));
|
|
3187
|
-
}
|
|
3188
|
-
const max = configStyles.INPUT.maxLength || maxLength;
|
|
3045
|
+
const max = maxLength ? maxLength : configStyles.INPUT.maxLength;
|
|
3046
|
+
newValue = handleCheckTypeTel(newValue, value);
|
|
3047
|
+
newValue = handleCheckTypeNumber(value);
|
|
3189
3048
|
if (max && value.length > max && type !== 'tel' && type !== 'number') {
|
|
3190
|
-
|
|
3191
|
-
if (change) {
|
|
3192
|
-
change(value.substr(0, max));
|
|
3193
|
-
}
|
|
3049
|
+
newValue = value.substr(0, max);
|
|
3194
3050
|
}
|
|
3195
3051
|
if (regexp && regexpErrorMessage && !maxLength && type !== 'tel') {
|
|
3196
3052
|
!regexp.test(value) ? setInnerErrorMessage(regexpErrorMessage) : setInnerErrorMessage('');
|
|
3197
3053
|
}
|
|
3054
|
+
setInnerValue(() => newValue);
|
|
3198
3055
|
}
|
|
3199
3056
|
}
|
|
3200
|
-
}, [type, value, regexp, maxLength, errorMessage, regexpErrorMessage, telErrorMessage
|
|
3057
|
+
}, [type, value, regexp, maxLength, errorMessage, regexpErrorMessage, telErrorMessage]);
|
|
3201
3058
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3202
3059
|
className: classProps
|
|
3203
3060
|
}, label ? /*#__PURE__*/React__default["default"].createElement("label", {
|
|
@@ -3624,12 +3481,12 @@ const Select = ({
|
|
|
3624
3481
|
boxShadowHover
|
|
3625
3482
|
}) => {
|
|
3626
3483
|
const ref = React.useRef();
|
|
3484
|
+
const configStyles = compereConfigs();
|
|
3485
|
+
const classProps = classnames__default["default"](className ? className : configStyles.SELECT.className);
|
|
3627
3486
|
const [opened, setOpened] = React.useState(false);
|
|
3628
3487
|
const [isHover, setIsHover] = React.useState(false);
|
|
3629
3488
|
const [newSelected, setNewSelected] = React.useState([]);
|
|
3630
3489
|
const [existOptions, setExistOptions] = React.useState([]);
|
|
3631
|
-
const configStyles = compereConfigs();
|
|
3632
|
-
const classProps = classnames__default["default"](className ? className : configStyles.SELECT.className);
|
|
3633
3490
|
const handleOpenClose = () => {
|
|
3634
3491
|
setOpened(!opened);
|
|
3635
3492
|
};
|
|
@@ -4306,11 +4163,11 @@ const Tooltip = ({
|
|
|
4306
4163
|
tooltipBackgroundColor
|
|
4307
4164
|
}) => {
|
|
4308
4165
|
const tooltipRef = /*#__PURE__*/React.createRef(null);
|
|
4166
|
+
const configStyles = compereConfigs();
|
|
4167
|
+
const classProps = classnames__default["default"](styles$4['tooltip-block'], className ? className : configStyles.TOOLTIP.className);
|
|
4309
4168
|
const [checkTooltipWidth, setCheckTooltipWidth] = React.useState(0);
|
|
4310
4169
|
const [checkTooltipHeight, setCheckTooltipHeight] = React.useState(0);
|
|
4311
4170
|
const [showTooltip, setShowTooltip] = React.useState(false);
|
|
4312
|
-
const configStyles = compereConfigs();
|
|
4313
|
-
const classProps = classnames__default["default"](styles$4['tooltip-block'], className ? className : configStyles.TOOLTIP.className);
|
|
4314
4171
|
const handleShow = () => {
|
|
4315
4172
|
setShowTooltip(!showTooltip);
|
|
4316
4173
|
};
|
|
@@ -4722,12 +4579,12 @@ const Textarea = ({
|
|
|
4722
4579
|
showCharacterCount,
|
|
4723
4580
|
characterCountPosition
|
|
4724
4581
|
}) => {
|
|
4582
|
+
const configStyles = compereConfigs();
|
|
4583
|
+
const classProps = classnames__default["default"](className ? className : configStyles.TEXTAREA.className);
|
|
4725
4584
|
const [error, setError] = React.useState('');
|
|
4726
4585
|
const [isHover, setIsHover] = React.useState(false);
|
|
4727
4586
|
const [isFocus, setIsFocus] = React.useState(false);
|
|
4728
4587
|
const [innerValue, setInnerValue] = React.useState('');
|
|
4729
|
-
const configStyles = compereConfigs();
|
|
4730
|
-
const classProps = classnames__default["default"](className ? className : configStyles.TEXTAREA.className);
|
|
4731
4588
|
const handleMouseEnter = () => {
|
|
4732
4589
|
setIsHover(true);
|
|
4733
4590
|
};
|
|
@@ -4927,11 +4784,6 @@ const Typography = ({
|
|
|
4927
4784
|
const classProps = classnames__default["default"](className ? className : configStyles.TYPOGRAPHY.className);
|
|
4928
4785
|
const [isHover, setIsHover] = React.useState(false);
|
|
4929
4786
|
const [validVariant, setValidVariant] = React.useState(false);
|
|
4930
|
-
React.useEffect(() => {
|
|
4931
|
-
if (!Object.values(TypographyType).includes(variant)) {
|
|
4932
|
-
setValidVariant(true);
|
|
4933
|
-
}
|
|
4934
|
-
}, [variant]);
|
|
4935
4787
|
const handleMouseEnter = () => {
|
|
4936
4788
|
setIsHover(true);
|
|
4937
4789
|
};
|
|
@@ -4961,6 +4813,11 @@ const Typography = ({
|
|
|
4961
4813
|
onMouseEnter: handleMouseEnter,
|
|
4962
4814
|
onMouseLeave: handleMouseLeave
|
|
4963
4815
|
}, [children]);
|
|
4816
|
+
React.useEffect(() => {
|
|
4817
|
+
if (!Object.values(TypographyType).includes(variant)) {
|
|
4818
|
+
setValidVariant(true);
|
|
4819
|
+
}
|
|
4820
|
+
}, [variant]);
|
|
4964
4821
|
return validVariant ? 'Please set Typography valid variant' : tagT;
|
|
4965
4822
|
};
|
|
4966
4823
|
Typography.propTypes = {
|
package/package.json
CHANGED
|
Binary file
|