@true-engineering/true-react-common-ui-kit 2.4.0 → 2.5.0
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/LICENSE +201 -201
- package/dist/components/DatePicker/DatePicker.styles.d.ts +4 -5
- package/dist/components/FiltersPane/index.d.ts +1 -0
- package/dist/components/Flag/augment.d.ts +1 -1
- package/dist/components/Icon/complexIcons/augment.d.ts +1 -1
- package/dist/components/Input/Input.d.ts +1 -0
- package/dist/true-react-common-ui-kit.js +59 -59
- package/dist/true-react-common-ui-kit.js.map +1 -1
- package/dist/true-react-common-ui-kit.umd.cjs +59 -59
- package/dist/true-react-common-ui-kit.umd.cjs.map +1 -1
- package/dist/vite-env.d.ts +1 -1
- package/package.json +1 -1
- package/src/components/AccountInfo/AccountInfo.styles.ts +55 -55
- package/src/components/AccountInfo/index.ts +2 -2
- package/src/components/AddButton/AddButton.stories.tsx +21 -21
- package/src/components/AddButton/AddButton.styles.ts +34 -34
- package/src/components/AddButton/index.ts +2 -2
- package/src/components/Button/Button.styles.ts +196 -196
- package/src/components/Checkbox/Checkbox.styles.ts +62 -62
- package/src/components/Checkbox/index.ts +2 -2
- package/src/components/CloseButton/index.ts +2 -2
- package/src/components/Colors/Colors.stories.tsx +7 -7
- package/src/components/Colors/Colors.styles.ts +38 -38
- package/src/components/Colors/index.ts +2 -2
- package/src/components/CssBaseline/CssBaseline.styles.ts +15 -15
- package/src/components/CssBaseline/index.ts +2 -2
- package/src/components/DateInput/DateInput.styles.ts +14 -14
- package/src/components/DateInput/constants.ts +2 -2
- package/src/components/DateInput/index.ts +3 -3
- package/src/components/DatePicker/DatePicker.styles.ts +4 -4
- package/src/components/Description/Description.styles.ts +31 -31
- package/src/components/Description/index.ts +2 -2
- package/src/components/FiltersPane/FiltersPane.styles.ts +71 -71
- package/src/components/FiltersPane/index.ts +1 -0
- package/src/components/Flag/Flag.styles.ts +18 -18
- package/src/components/Flag/augment.d.ts +1 -1
- package/src/components/Flag/index.ts +2 -2
- package/src/components/FlexibleTable/index.ts +3 -3
- package/src/components/Icon/Icon.styles.ts +10 -10
- package/src/components/Icon/complexIcons/augment.d.ts +1 -1
- package/src/components/Icon/complexIcons/avatarGreen.svg +57 -57
- package/src/components/Icon/complexIcons/index.ts +1 -1
- package/src/components/IncrementInput/IncrementInput.styles.ts +77 -77
- package/src/components/IncrementInput/index.ts +2 -2
- package/src/components/Input/Input.styles.ts +307 -307
- package/src/components/Input/Input.tsx +4 -2
- package/src/components/List/List.styles.ts +52 -52
- package/src/components/MoreMenu/MoreMenu.stories.tsx +46 -46
- package/src/components/MoreMenu/index.ts +2 -2
- package/src/components/MultiSelect/MultiSelect.styles.ts +55 -55
- package/src/components/NumberInput/index.ts +1 -1
- package/src/components/PhoneInput/PhoneInput.styles.ts +84 -84
- package/src/components/PhoneInput/types.ts +16 -16
- package/src/components/RadioButton/RadioButton.styles.ts +37 -37
- package/src/components/RadioButton/index.ts +2 -2
- package/src/components/ScrollIntoViewIfNeeded/index.ts +1 -1
- package/src/components/SearchInput/index.ts +2 -2
- package/src/components/Select/Select.styles.ts +96 -96
- package/src/components/Select/constants.ts +2 -2
- package/src/components/Select/types.ts +1 -1
- package/src/components/Switch/Switch.styles.ts +75 -75
- package/src/components/TextArea/TextArea.styles.ts +153 -153
- package/src/components/TextArea/index.ts +2 -2
- package/src/components/TextWithInfo/TextWithInfo.styles.ts +60 -60
- package/src/components/TextWithInfo/index.ts +2 -2
- package/src/components/TextWithTooltip/TextWithTooltip.stories.tsx +58 -58
- package/src/components/TextWithTooltip/TextWithTooltip.styles.ts +19 -19
- package/src/components/TextWithTooltip/index.ts +2 -2
- package/src/components/ThemedPreloader/ThemedPreloader.styles.ts +21 -21
- package/src/components/ThemedPreloader/components/DefaultPreloader/index.ts +1 -1
- package/src/components/ThemedPreloader/components/DotsPreloader/DotsPreloader.styles.ts +54 -54
- package/src/components/ThemedPreloader/components/DotsPreloader/index.ts +2 -2
- package/src/components/ThemedPreloader/components/SvgPreloader/SvgPreloader.styles.ts +11 -11
- package/src/components/ThemedPreloader/components/SvgPreloader/index.ts +2 -2
- package/src/components/Toaster/Toaster.styles.ts +59 -59
- package/src/components/Tooltip/types.ts +1 -1
- package/src/components/index.ts +36 -36
- package/src/helpers/popper-helpers.ts +17 -17
- package/src/hooks/index.ts +6 -6
- package/src/hooks/use-is-mounted.ts +15 -15
- package/src/index.ts +6 -6
- package/src/vite-env.d.ts +1 -1
|
@@ -3984,63 +3984,63 @@
|
|
|
3984
3984
|
};
|
|
3985
3985
|
}, dependencies);
|
|
3986
3986
|
};
|
|
3987
|
-
const avatarGreen = ` <svg
|
|
3988
|
-
width="100%"
|
|
3989
|
-
height="100%"
|
|
3990
|
-
viewBox="0 0 32 32"
|
|
3991
|
-
fill="none"
|
|
3992
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
3993
|
-
|
|
3994
|
-
<circle opacity="0.5" cx="16" cy="16" r="16" fill="#DDE3ED"
|
|
3995
|
-
<mask
|
|
3996
|
-
id="mask0_0_12744"
|
|
3997
|
-
style="mask-type: 'alpha';"
|
|
3998
|
-
maskUnits="userSpaceOnUse"
|
|
3999
|
-
x="0"
|
|
4000
|
-
y="0"
|
|
4001
|
-
width="32"
|
|
4002
|
-
height="32"
|
|
4003
|
-
|
|
4004
|
-
<circle cx="16" cy="16" r="16" fill="white"
|
|
4005
|
-
</mask
|
|
4006
|
-
<g mask="url(#mask0_0_12744)"
|
|
4007
|
-
<circle cx="16" cy="29" r="13" fill="url(#paint0_linear_0_12744)"
|
|
4008
|
-
<mask
|
|
4009
|
-
id="mask1_0_12744"
|
|
4010
|
-
style="mask-type: 'alpha';"
|
|
4011
|
-
maskUnits="userSpaceOnUse"
|
|
4012
|
-
x="3"
|
|
4013
|
-
y="16"
|
|
4014
|
-
width="26"
|
|
4015
|
-
height="26"
|
|
4016
|
-
|
|
4017
|
-
<circle cx="16" cy="29" r="13" fill="white"
|
|
4018
|
-
</mask
|
|
4019
|
-
<g mask="url(#mask1_0_12744)"
|
|
4020
|
-
<ellipse
|
|
4021
|
-
cx="16"
|
|
4022
|
-
cy="17.5"
|
|
4023
|
-
rx="6"
|
|
4024
|
-
ry="7.5"
|
|
4025
|
-
fill="#505F79"
|
|
4026
|
-
fill-opacity="0.204983"
|
|
4027
|
-
|
|
4028
|
-
</g
|
|
4029
|
-
</g
|
|
4030
|
-
<ellipse cx="16" cy="13" rx="6" ry="7" fill="white"
|
|
4031
|
-
<defs
|
|
4032
|
-
<linearGradient
|
|
4033
|
-
id="paint0_linear_0_12744"
|
|
4034
|
-
x1="13.347"
|
|
4035
|
-
y1="46.279"
|
|
4036
|
-
x2="33.5318"
|
|
4037
|
-
y2="30.8088"
|
|
4038
|
-
gradientUnits="userSpaceOnUse"
|
|
4039
|
-
|
|
4040
|
-
<stop stop-color="#ABD229"
|
|
4041
|
-
<stop offset="1" stop-color="#9CD03F"
|
|
4042
|
-
</linearGradient
|
|
4043
|
-
</defs
|
|
3987
|
+
const avatarGreen = ` <svg
|
|
3988
|
+
width="100%"
|
|
3989
|
+
height="100%"
|
|
3990
|
+
viewBox="0 0 32 32"
|
|
3991
|
+
fill="none"
|
|
3992
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
3993
|
+
>
|
|
3994
|
+
<circle opacity="0.5" cx="16" cy="16" r="16" fill="#DDE3ED" />
|
|
3995
|
+
<mask
|
|
3996
|
+
id="mask0_0_12744"
|
|
3997
|
+
style="mask-type: 'alpha';"
|
|
3998
|
+
maskUnits="userSpaceOnUse"
|
|
3999
|
+
x="0"
|
|
4000
|
+
y="0"
|
|
4001
|
+
width="32"
|
|
4002
|
+
height="32"
|
|
4003
|
+
>
|
|
4004
|
+
<circle cx="16" cy="16" r="16" fill="white" />
|
|
4005
|
+
</mask>
|
|
4006
|
+
<g mask="url(#mask0_0_12744)">
|
|
4007
|
+
<circle cx="16" cy="29" r="13" fill="url(#paint0_linear_0_12744)" />
|
|
4008
|
+
<mask
|
|
4009
|
+
id="mask1_0_12744"
|
|
4010
|
+
style="mask-type: 'alpha';"
|
|
4011
|
+
maskUnits="userSpaceOnUse"
|
|
4012
|
+
x="3"
|
|
4013
|
+
y="16"
|
|
4014
|
+
width="26"
|
|
4015
|
+
height="26"
|
|
4016
|
+
>
|
|
4017
|
+
<circle cx="16" cy="29" r="13" fill="white" />
|
|
4018
|
+
</mask>
|
|
4019
|
+
<g mask="url(#mask1_0_12744)">
|
|
4020
|
+
<ellipse
|
|
4021
|
+
cx="16"
|
|
4022
|
+
cy="17.5"
|
|
4023
|
+
rx="6"
|
|
4024
|
+
ry="7.5"
|
|
4025
|
+
fill="#505F79"
|
|
4026
|
+
fill-opacity="0.204983"
|
|
4027
|
+
/>
|
|
4028
|
+
</g>
|
|
4029
|
+
</g>
|
|
4030
|
+
<ellipse cx="16" cy="13" rx="6" ry="7" fill="white" />
|
|
4031
|
+
<defs>
|
|
4032
|
+
<linearGradient
|
|
4033
|
+
id="paint0_linear_0_12744"
|
|
4034
|
+
x1="13.347"
|
|
4035
|
+
y1="46.279"
|
|
4036
|
+
x2="33.5318"
|
|
4037
|
+
y2="30.8088"
|
|
4038
|
+
gradientUnits="userSpaceOnUse"
|
|
4039
|
+
>
|
|
4040
|
+
<stop stop-color="#ABD229" />
|
|
4041
|
+
<stop offset="1" stop-color="#9CD03F" />
|
|
4042
|
+
</linearGradient>
|
|
4043
|
+
</defs>
|
|
4044
4044
|
</svg>`;
|
|
4045
4045
|
var complexIcons = {
|
|
4046
4046
|
avatar: avatarGreen
|
|
@@ -7071,7 +7071,7 @@
|
|
|
7071
7071
|
}
|
|
7072
7072
|
};
|
|
7073
7073
|
var Input = /* @__PURE__ */ React.forwardRef(function(param, ref) {
|
|
7074
|
-
var _param_value = param.value, value = _param_value === void 0 ? "" : _param_value, label = param.label, placeholder = param.placeholder, _param_type = param.type, type = _param_type === void 0 ? "text" : _param_type, isDisabled = param.isDisabled, isReadonly = param.isReadonly, _param_hasFloatingLabel = param.hasFloatingLabel, hasFloatingLabel = _param_hasFloatingLabel === void 0 ? true : _param_hasFloatingLabel, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isActive = param.isActive, isActive = _param_isActive === void 0 ? false : _param_isActive, _param_isClearable = param.isClearable, isClearable = _param_isClearable === void 0 ? false : _param_isClearable, infoMessage = param.infoMessage, errorMessage = param.errorMessage, _param_errorPosition = param.errorPosition, errorPosition = _param_errorPosition === void 0 ? "bottom" : _param_errorPosition, inlineStyle = param.inlineStyle, border = param.border, isRequired = param.isRequired, isLoading = param.isLoading, isAutoSizeable = param.isAutoSizeable, _param_defaultSize = param.defaultSize, defaultSize = _param_defaultSize === void 0 ? DEFAULT_SIZE : _param_defaultSize, iconType = param.iconType, name = param.name, hasRequiredLabel = param.hasRequiredLabel, data = param.data, tweakStyles = param.tweakStyles, maxLength = param.maxLength, shouldFocusOnMount = param.shouldFocusOnMount, units = param.units, testId = param.testId, tabIndex = param.tabIndex, onChange = param.onChange, onPaste = param.onPaste, onFocus = param.onFocus, onBlur = param.onBlur, onIconClick = param.onIconClick, onKeyDown = param.onKeyDown, mask = param.mask, maskPlaceholder = param.maskPlaceholder, alwaysShowMask = param.alwaysShowMask, beforeMaskedStateChange = param.beforeMaskedStateChange;
|
|
7074
|
+
var _param_value = param.value, value = _param_value === void 0 ? "" : _param_value, label = param.label, placeholder = param.placeholder, _param_type = param.type, type = _param_type === void 0 ? "text" : _param_type, isDisabled = param.isDisabled, isReadonly = param.isReadonly, _param_hasFloatingLabel = param.hasFloatingLabel, hasFloatingLabel = _param_hasFloatingLabel === void 0 ? true : _param_hasFloatingLabel, _param_isInvalid = param.isInvalid, isInvalid = _param_isInvalid === void 0 ? false : _param_isInvalid, _param_isActive = param.isActive, isActive = _param_isActive === void 0 ? false : _param_isActive, _param_isClearable = param.isClearable, isClearable = _param_isClearable === void 0 ? false : _param_isClearable, infoMessage = param.infoMessage, errorMessage = param.errorMessage, _param_errorPosition = param.errorPosition, errorPosition = _param_errorPosition === void 0 ? "bottom" : _param_errorPosition, inlineStyle = param.inlineStyle, border = param.border, isRequired = param.isRequired, isLoading = param.isLoading, isAutoSizeable = param.isAutoSizeable, _param_defaultSize = param.defaultSize, defaultSize = _param_defaultSize === void 0 ? DEFAULT_SIZE : _param_defaultSize, iconType = param.iconType, name = param.name, hasRequiredLabel = param.hasRequiredLabel, data = param.data, tweakStyles = param.tweakStyles, maxLength = param.maxLength, shouldFocusOnMount = param.shouldFocusOnMount, units = param.units, testId = param.testId, tabIndex = param.tabIndex, onChange = param.onChange, onPaste = param.onPaste, onFocus = param.onFocus, onBlur = param.onBlur, onIconClick = param.onIconClick, onKeyDown = param.onKeyDown, mask = param.mask, maskPlaceholder = param.maskPlaceholder, alwaysShowMask = param.alwaysShowMask, shouldAlwaysShowPlaceholder = param.shouldAlwaysShowPlaceholder, beforeMaskedStateChange = param.beforeMaskedStateChange;
|
|
7075
7075
|
var _useTheme = useTheme("Input", styles$x, tweakStyles), classes = _useTheme.classes, componentStyles = _useTheme.componentStyles;
|
|
7076
7076
|
var _useState = _sliced_to_array$l(React.useState(false), 2), isFocused = _useState[0], setFocused = _useState[1];
|
|
7077
7077
|
var inputRef = React.useRef(null);
|
|
@@ -7116,7 +7116,7 @@
|
|
|
7116
7116
|
var hasValue = value !== void 0 && value !== "";
|
|
7117
7117
|
var hasUnits = units !== void 0 && units !== "";
|
|
7118
7118
|
var hasLabel = trueReactPlatformHelpers.isStringNotEmpty(label);
|
|
7119
|
-
var hasPlaceholder = (!hasLabel || hasFocus && !isReadonly) && trueReactPlatformHelpers.isStringNotEmpty(placeholder);
|
|
7119
|
+
var hasPlaceholder = (!hasLabel || hasFocus && !isReadonly || shouldAlwaysShowPlaceholder) && trueReactPlatformHelpers.isStringNotEmpty(placeholder);
|
|
7120
7120
|
var shouldShowUnits = (hasValue || isFocused && !hasPlaceholder) && hasUnits;
|
|
7121
7121
|
var _obj;
|
|
7122
7122
|
var props = _object_spread$A({
|