@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.
Files changed (82) hide show
  1. package/LICENSE +201 -201
  2. package/dist/components/DatePicker/DatePicker.styles.d.ts +4 -5
  3. package/dist/components/FiltersPane/index.d.ts +1 -0
  4. package/dist/components/Flag/augment.d.ts +1 -1
  5. package/dist/components/Icon/complexIcons/augment.d.ts +1 -1
  6. package/dist/components/Input/Input.d.ts +1 -0
  7. package/dist/true-react-common-ui-kit.js +59 -59
  8. package/dist/true-react-common-ui-kit.js.map +1 -1
  9. package/dist/true-react-common-ui-kit.umd.cjs +59 -59
  10. package/dist/true-react-common-ui-kit.umd.cjs.map +1 -1
  11. package/dist/vite-env.d.ts +1 -1
  12. package/package.json +1 -1
  13. package/src/components/AccountInfo/AccountInfo.styles.ts +55 -55
  14. package/src/components/AccountInfo/index.ts +2 -2
  15. package/src/components/AddButton/AddButton.stories.tsx +21 -21
  16. package/src/components/AddButton/AddButton.styles.ts +34 -34
  17. package/src/components/AddButton/index.ts +2 -2
  18. package/src/components/Button/Button.styles.ts +196 -196
  19. package/src/components/Checkbox/Checkbox.styles.ts +62 -62
  20. package/src/components/Checkbox/index.ts +2 -2
  21. package/src/components/CloseButton/index.ts +2 -2
  22. package/src/components/Colors/Colors.stories.tsx +7 -7
  23. package/src/components/Colors/Colors.styles.ts +38 -38
  24. package/src/components/Colors/index.ts +2 -2
  25. package/src/components/CssBaseline/CssBaseline.styles.ts +15 -15
  26. package/src/components/CssBaseline/index.ts +2 -2
  27. package/src/components/DateInput/DateInput.styles.ts +14 -14
  28. package/src/components/DateInput/constants.ts +2 -2
  29. package/src/components/DateInput/index.ts +3 -3
  30. package/src/components/DatePicker/DatePicker.styles.ts +4 -4
  31. package/src/components/Description/Description.styles.ts +31 -31
  32. package/src/components/Description/index.ts +2 -2
  33. package/src/components/FiltersPane/FiltersPane.styles.ts +71 -71
  34. package/src/components/FiltersPane/index.ts +1 -0
  35. package/src/components/Flag/Flag.styles.ts +18 -18
  36. package/src/components/Flag/augment.d.ts +1 -1
  37. package/src/components/Flag/index.ts +2 -2
  38. package/src/components/FlexibleTable/index.ts +3 -3
  39. package/src/components/Icon/Icon.styles.ts +10 -10
  40. package/src/components/Icon/complexIcons/augment.d.ts +1 -1
  41. package/src/components/Icon/complexIcons/avatarGreen.svg +57 -57
  42. package/src/components/Icon/complexIcons/index.ts +1 -1
  43. package/src/components/IncrementInput/IncrementInput.styles.ts +77 -77
  44. package/src/components/IncrementInput/index.ts +2 -2
  45. package/src/components/Input/Input.styles.ts +307 -307
  46. package/src/components/Input/Input.tsx +4 -2
  47. package/src/components/List/List.styles.ts +52 -52
  48. package/src/components/MoreMenu/MoreMenu.stories.tsx +46 -46
  49. package/src/components/MoreMenu/index.ts +2 -2
  50. package/src/components/MultiSelect/MultiSelect.styles.ts +55 -55
  51. package/src/components/NumberInput/index.ts +1 -1
  52. package/src/components/PhoneInput/PhoneInput.styles.ts +84 -84
  53. package/src/components/PhoneInput/types.ts +16 -16
  54. package/src/components/RadioButton/RadioButton.styles.ts +37 -37
  55. package/src/components/RadioButton/index.ts +2 -2
  56. package/src/components/ScrollIntoViewIfNeeded/index.ts +1 -1
  57. package/src/components/SearchInput/index.ts +2 -2
  58. package/src/components/Select/Select.styles.ts +96 -96
  59. package/src/components/Select/constants.ts +2 -2
  60. package/src/components/Select/types.ts +1 -1
  61. package/src/components/Switch/Switch.styles.ts +75 -75
  62. package/src/components/TextArea/TextArea.styles.ts +153 -153
  63. package/src/components/TextArea/index.ts +2 -2
  64. package/src/components/TextWithInfo/TextWithInfo.styles.ts +60 -60
  65. package/src/components/TextWithInfo/index.ts +2 -2
  66. package/src/components/TextWithTooltip/TextWithTooltip.stories.tsx +58 -58
  67. package/src/components/TextWithTooltip/TextWithTooltip.styles.ts +19 -19
  68. package/src/components/TextWithTooltip/index.ts +2 -2
  69. package/src/components/ThemedPreloader/ThemedPreloader.styles.ts +21 -21
  70. package/src/components/ThemedPreloader/components/DefaultPreloader/index.ts +1 -1
  71. package/src/components/ThemedPreloader/components/DotsPreloader/DotsPreloader.styles.ts +54 -54
  72. package/src/components/ThemedPreloader/components/DotsPreloader/index.ts +2 -2
  73. package/src/components/ThemedPreloader/components/SvgPreloader/SvgPreloader.styles.ts +11 -11
  74. package/src/components/ThemedPreloader/components/SvgPreloader/index.ts +2 -2
  75. package/src/components/Toaster/Toaster.styles.ts +59 -59
  76. package/src/components/Tooltip/types.ts +1 -1
  77. package/src/components/index.ts +36 -36
  78. package/src/helpers/popper-helpers.ts +17 -17
  79. package/src/hooks/index.ts +6 -6
  80. package/src/hooks/use-is-mounted.ts +15 -15
  81. package/src/index.ts +6 -6
  82. package/src/vite-env.d.ts +1 -1
@@ -3984,63 +3984,63 @@
3984
3984
  };
3985
3985
  }, dependencies);
3986
3986
  };
3987
- const avatarGreen = ` <svg\r
3988
- width="100%"\r
3989
- height="100%"\r
3990
- viewBox="0 0 32 32"\r
3991
- fill="none"\r
3992
- xmlns="http://www.w3.org/2000/svg"\r
3993
- >\r
3994
- <circle opacity="0.5" cx="16" cy="16" r="16" fill="#DDE3ED" />\r
3995
- <mask\r
3996
- id="mask0_0_12744"\r
3997
- style="mask-type: 'alpha';"\r
3998
- maskUnits="userSpaceOnUse"\r
3999
- x="0"\r
4000
- y="0"\r
4001
- width="32"\r
4002
- height="32"\r
4003
- >\r
4004
- <circle cx="16" cy="16" r="16" fill="white" />\r
4005
- </mask>\r
4006
- <g mask="url(#mask0_0_12744)">\r
4007
- <circle cx="16" cy="29" r="13" fill="url(#paint0_linear_0_12744)" />\r
4008
- <mask\r
4009
- id="mask1_0_12744"\r
4010
- style="mask-type: 'alpha';"\r
4011
- maskUnits="userSpaceOnUse"\r
4012
- x="3"\r
4013
- y="16"\r
4014
- width="26"\r
4015
- height="26"\r
4016
- >\r
4017
- <circle cx="16" cy="29" r="13" fill="white" />\r
4018
- </mask>\r
4019
- <g mask="url(#mask1_0_12744)">\r
4020
- <ellipse\r
4021
- cx="16"\r
4022
- cy="17.5"\r
4023
- rx="6"\r
4024
- ry="7.5"\r
4025
- fill="#505F79"\r
4026
- fill-opacity="0.204983"\r
4027
- />\r
4028
- </g>\r
4029
- </g>\r
4030
- <ellipse cx="16" cy="13" rx="6" ry="7" fill="white" />\r
4031
- <defs>\r
4032
- <linearGradient\r
4033
- id="paint0_linear_0_12744"\r
4034
- x1="13.347"\r
4035
- y1="46.279"\r
4036
- x2="33.5318"\r
4037
- y2="30.8088"\r
4038
- gradientUnits="userSpaceOnUse"\r
4039
- >\r
4040
- <stop stop-color="#ABD229" />\r
4041
- <stop offset="1" stop-color="#9CD03F" />\r
4042
- </linearGradient>\r
4043
- </defs>\r
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({