@vchasno/ui-kit 0.3.29 → 0.3.31

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 (147) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/Datepicker/index.cjs.js +2 -2
  3. package/dist/Datepicker/index.cjs.js.map +1 -1
  4. package/dist/Datepicker/index.d.ts +5 -1
  5. package/dist/Datepicker/index.js +2 -2
  6. package/dist/Datepicker/index.js.map +1 -1
  7. package/dist/Datepicker/types/components/Alert/Alert.d.ts +2 -1
  8. package/dist/Datepicker/types/components/Button/Button.d.ts +2 -2
  9. package/dist/Datepicker/types/components/Checkbox/Checkbox.d.ts +2 -2
  10. package/dist/Datepicker/types/components/Datepicker/DatePicker.d.ts +2 -2
  11. package/dist/Datepicker/types/components/FlexBox/FlexBox.d.ts +2 -1
  12. package/dist/Datepicker/types/components/Input/Input.d.ts +2 -2
  13. package/dist/Datepicker/types/components/MaskInput/MaskInput.d.ts +2 -1
  14. package/dist/Datepicker/types/components/Paragraph/Paragraph.d.ts +2 -2
  15. package/dist/Datepicker/types/components/Select/Select.d.ts +2 -3
  16. package/dist/Datepicker/types/components/Select/SelectCreatable.d.ts +2 -3
  17. package/dist/Datepicker/types/components/Switch/Switch.d.ts +2 -2
  18. package/dist/Datepicker/types/components/Text/Text.d.ts +2 -2
  19. package/dist/Datepicker/types/components/TextAreaInput/TextAreaInput.d.ts +2 -1
  20. package/dist/Datepicker/types/components/TextInput/TextInput.d.ts +2 -1
  21. package/dist/Datepicker/types/components/Title/Title.d.ts +2 -2
  22. package/dist/Datepicker/types/components/types.d.ts +4 -0
  23. package/dist/Menu/types/components/Alert/Alert.d.ts +2 -1
  24. package/dist/Menu/types/components/Button/Button.d.ts +2 -2
  25. package/dist/Menu/types/components/Checkbox/Checkbox.d.ts +2 -2
  26. package/dist/Menu/types/components/Datepicker/DatePicker.d.ts +2 -2
  27. package/dist/Menu/types/components/FlexBox/FlexBox.d.ts +2 -1
  28. package/dist/Menu/types/components/Input/Input.d.ts +2 -2
  29. package/dist/Menu/types/components/MaskInput/MaskInput.d.ts +2 -1
  30. package/dist/Menu/types/components/Paragraph/Paragraph.d.ts +2 -2
  31. package/dist/Menu/types/components/Select/Select.d.ts +2 -3
  32. package/dist/Menu/types/components/Select/SelectCreatable.d.ts +2 -3
  33. package/dist/Menu/types/components/Switch/Switch.d.ts +2 -2
  34. package/dist/Menu/types/components/Text/Text.d.ts +2 -2
  35. package/dist/Menu/types/components/TextAreaInput/TextAreaInput.d.ts +2 -1
  36. package/dist/Menu/types/components/TextInput/TextInput.d.ts +2 -1
  37. package/dist/Menu/types/components/Title/Title.d.ts +2 -2
  38. package/dist/Menu/types/components/types.d.ts +4 -0
  39. package/dist/ProjectsPopover/index.cjs.js +2 -2
  40. package/dist/ProjectsPopover/index.cjs.js.map +1 -1
  41. package/dist/ProjectsPopover/index.js +2 -2
  42. package/dist/ProjectsPopover/index.js.map +1 -1
  43. package/dist/ProjectsPopover/types/components/Alert/Alert.d.ts +2 -1
  44. package/dist/ProjectsPopover/types/components/Button/Button.d.ts +2 -2
  45. package/dist/ProjectsPopover/types/components/Checkbox/Checkbox.d.ts +2 -2
  46. package/dist/ProjectsPopover/types/components/Datepicker/DatePicker.d.ts +2 -2
  47. package/dist/ProjectsPopover/types/components/FlexBox/FlexBox.d.ts +2 -1
  48. package/dist/ProjectsPopover/types/components/Input/Input.d.ts +2 -2
  49. package/dist/ProjectsPopover/types/components/MaskInput/MaskInput.d.ts +2 -1
  50. package/dist/ProjectsPopover/types/components/Paragraph/Paragraph.d.ts +2 -2
  51. package/dist/ProjectsPopover/types/components/Select/Select.d.ts +2 -3
  52. package/dist/ProjectsPopover/types/components/Select/SelectCreatable.d.ts +2 -3
  53. package/dist/ProjectsPopover/types/components/Switch/Switch.d.ts +2 -2
  54. package/dist/ProjectsPopover/types/components/Text/Text.d.ts +2 -2
  55. package/dist/ProjectsPopover/types/components/TextAreaInput/TextAreaInput.d.ts +2 -1
  56. package/dist/ProjectsPopover/types/components/TextInput/TextInput.d.ts +2 -1
  57. package/dist/ProjectsPopover/types/components/Title/Title.d.ts +2 -2
  58. package/dist/ProjectsPopover/types/components/types.d.ts +4 -0
  59. package/dist/Select/index.cjs.js +1 -1
  60. package/dist/Select/index.cjs.js.map +1 -1
  61. package/dist/Select/index.d.ts +5 -2
  62. package/dist/Select/index.js +1 -1
  63. package/dist/Select/index.js.map +1 -1
  64. package/dist/Select/types/components/Alert/Alert.d.ts +2 -1
  65. package/dist/Select/types/components/Button/Button.d.ts +2 -2
  66. package/dist/Select/types/components/Checkbox/Checkbox.d.ts +2 -2
  67. package/dist/Select/types/components/Datepicker/DatePicker.d.ts +2 -2
  68. package/dist/Select/types/components/FlexBox/FlexBox.d.ts +2 -1
  69. package/dist/Select/types/components/Input/Input.d.ts +2 -2
  70. package/dist/Select/types/components/MaskInput/MaskInput.d.ts +2 -1
  71. package/dist/Select/types/components/Paragraph/Paragraph.d.ts +2 -2
  72. package/dist/Select/types/components/Select/Select.d.ts +2 -3
  73. package/dist/Select/types/components/Select/SelectCreatable.d.ts +2 -3
  74. package/dist/Select/types/components/Switch/Switch.d.ts +2 -2
  75. package/dist/Select/types/components/Text/Text.d.ts +2 -2
  76. package/dist/Select/types/components/TextAreaInput/TextAreaInput.d.ts +2 -1
  77. package/dist/Select/types/components/TextInput/TextInput.d.ts +2 -1
  78. package/dist/Select/types/components/Title/Title.d.ts +2 -2
  79. package/dist/Select/types/components/types.d.ts +4 -0
  80. package/dist/SelectCreatable/index.cjs.js +1 -1
  81. package/dist/SelectCreatable/index.cjs.js.map +1 -1
  82. package/dist/SelectCreatable/index.d.ts +5 -2
  83. package/dist/SelectCreatable/index.js +1 -1
  84. package/dist/SelectCreatable/index.js.map +1 -1
  85. package/dist/SelectCreatable/types/components/Alert/Alert.d.ts +2 -1
  86. package/dist/SelectCreatable/types/components/Button/Button.d.ts +2 -2
  87. package/dist/SelectCreatable/types/components/Checkbox/Checkbox.d.ts +2 -2
  88. package/dist/SelectCreatable/types/components/Datepicker/DatePicker.d.ts +2 -2
  89. package/dist/SelectCreatable/types/components/FlexBox/FlexBox.d.ts +2 -1
  90. package/dist/SelectCreatable/types/components/Input/Input.d.ts +2 -2
  91. package/dist/SelectCreatable/types/components/MaskInput/MaskInput.d.ts +2 -1
  92. package/dist/SelectCreatable/types/components/Paragraph/Paragraph.d.ts +2 -2
  93. package/dist/SelectCreatable/types/components/Select/Select.d.ts +2 -3
  94. package/dist/SelectCreatable/types/components/Select/SelectCreatable.d.ts +2 -3
  95. package/dist/SelectCreatable/types/components/Switch/Switch.d.ts +2 -2
  96. package/dist/SelectCreatable/types/components/Text/Text.d.ts +2 -2
  97. package/dist/SelectCreatable/types/components/TextAreaInput/TextAreaInput.d.ts +2 -1
  98. package/dist/SelectCreatable/types/components/TextInput/TextInput.d.ts +2 -1
  99. package/dist/SelectCreatable/types/components/Title/Title.d.ts +2 -2
  100. package/dist/SelectCreatable/types/components/types.d.ts +4 -0
  101. package/dist/Snackbar/index.cjs.js +32 -32
  102. package/dist/Snackbar/index.cjs.js.map +1 -1
  103. package/dist/Snackbar/index.js +32 -32
  104. package/dist/Snackbar/index.js.map +1 -1
  105. package/dist/Snackbar/types/components/Alert/Alert.d.ts +2 -1
  106. package/dist/Snackbar/types/components/Button/Button.d.ts +2 -2
  107. package/dist/Snackbar/types/components/Checkbox/Checkbox.d.ts +2 -2
  108. package/dist/Snackbar/types/components/Datepicker/DatePicker.d.ts +2 -2
  109. package/dist/Snackbar/types/components/FlexBox/FlexBox.d.ts +2 -1
  110. package/dist/Snackbar/types/components/Input/Input.d.ts +2 -2
  111. package/dist/Snackbar/types/components/MaskInput/MaskInput.d.ts +2 -1
  112. package/dist/Snackbar/types/components/Paragraph/Paragraph.d.ts +2 -2
  113. package/dist/Snackbar/types/components/Select/Select.d.ts +2 -3
  114. package/dist/Snackbar/types/components/Select/SelectCreatable.d.ts +2 -3
  115. package/dist/Snackbar/types/components/Switch/Switch.d.ts +2 -2
  116. package/dist/Snackbar/types/components/Text/Text.d.ts +2 -2
  117. package/dist/Snackbar/types/components/TextAreaInput/TextAreaInput.d.ts +2 -1
  118. package/dist/Snackbar/types/components/TextInput/TextInput.d.ts +2 -1
  119. package/dist/Snackbar/types/components/Title/Title.d.ts +2 -2
  120. package/dist/Snackbar/types/components/types.d.ts +4 -0
  121. package/dist/css/Button.global.css +16 -7
  122. package/dist/css/Checkbox.global.css +3 -1
  123. package/dist/css/MaskInput.global.css +2 -2
  124. package/dist/css/Select.global.css +4 -0
  125. package/dist/css/TextInput.global.css +4 -0
  126. package/dist/css/Title.global.css +11 -11
  127. package/dist/css/_theme.css +61 -4
  128. package/dist/index.d.ts +28 -24
  129. package/dist/index.js +36 -36
  130. package/dist/index.js.map +1 -1
  131. package/dist/types/components/Alert/Alert.d.ts +2 -1
  132. package/dist/types/components/Button/Button.d.ts +2 -2
  133. package/dist/types/components/Checkbox/Checkbox.d.ts +2 -2
  134. package/dist/types/components/Datepicker/DatePicker.d.ts +2 -2
  135. package/dist/types/components/FlexBox/FlexBox.d.ts +2 -1
  136. package/dist/types/components/Input/Input.d.ts +2 -2
  137. package/dist/types/components/MaskInput/MaskInput.d.ts +2 -1
  138. package/dist/types/components/Paragraph/Paragraph.d.ts +2 -2
  139. package/dist/types/components/Select/Select.d.ts +2 -3
  140. package/dist/types/components/Select/SelectCreatable.d.ts +2 -3
  141. package/dist/types/components/Switch/Switch.d.ts +2 -2
  142. package/dist/types/components/Text/Text.d.ts +2 -2
  143. package/dist/types/components/TextAreaInput/TextAreaInput.d.ts +2 -1
  144. package/dist/types/components/TextInput/TextInput.d.ts +2 -1
  145. package/dist/types/components/Title/Title.d.ts +2 -2
  146. package/dist/types/components/types.d.ts +4 -0
  147. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -221,8 +221,8 @@ var css_248z$n = ".vchasno-ui-flex-box {\n display: flex;\n max-width: 100
221
221
  styleInject(css_248z$n);
222
222
 
223
223
  var FlexBox = React$1.forwardRef(function (_a, ref) {
224
- var className = _a.className, _b = _a.tagName, tagName = _b === void 0 ? 'div' : _b, children = _a.children, direction = _a.direction, gap = _a.gap, wrap = _a.wrap, align = _a.align, justify = _a.justify, grow = _a.grow, shrink = _a.shrink, _c = _a.style, style = _c === void 0 ? {} : _c, rest = __rest(_a, ["className", "tagName", "children", "direction", "gap", "wrap", "align", "justify", "grow", "shrink", "style"]);
225
- return React$1.createElement(tagName, __assign({ ref: ref, className: cn('vchasno-ui-flex-box', className), style: __assign(__assign({}, style), { flexDirection: direction, gap: gap, flexWrap: wrap, justifyContent: justify, alignItems: align, alignContent: align, flexGrow: grow, flexShrink: shrink }) }, rest), children);
224
+ var className = _a.className, _b = _a.tagName, tagName = _b === void 0 ? 'div' : _b, children = _a.children, direction = _a.direction, gap = _a.gap, wrap = _a.wrap, align = _a.align, justify = _a.justify, grow = _a.grow, shrink = _a.shrink, _c = _a.style, style = _c === void 0 ? {} : _c, dataQa = _a.dataQa, rest = __rest(_a, ["className", "tagName", "children", "direction", "gap", "wrap", "align", "justify", "grow", "shrink", "style", "dataQa"]);
225
+ return React$1.createElement(tagName, __assign({ ref: ref, className: cn('vchasno-ui-flex-box', className), 'data-qa': dataQa, style: __assign(__assign({}, style), { flexDirection: direction, gap: gap, flexWrap: wrap, justifyContent: justify, alignItems: align, alignContent: align, flexGrow: grow, flexShrink: shrink }) }, rest), children);
226
226
  });
227
227
  FlexBox.displayName = 'FlexBox';
228
228
 
@@ -236,12 +236,12 @@ var Spinner = function (_a) {
236
236
  React$1.createElement("circle", { className: "vchasno-ui-spinner__svg__circle", cx: "50", cy: "50", r: "20", fill: "none", stroke: color, strokeWidth: "2", strokeMiterlimit: "10" }))));
237
237
  };
238
238
 
239
- var css_248z$l = ".vchasno-ui-button {\n display: inline-flex;\n min-height: 40px;\n align-items: center;\n justify-content: center;\n border: 0;\n border-radius: 8px;\n background-color: var(--vchasno-ui-btn-default-bg);\n color: var(--vchasno-ui-btn-default-color);\n font-size: var(--vchasno-ui-btn-font-size);\n font-weight: 700;\n gap: 5px;\n transition:\n background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n color var(--vchasno-ui-transition-duration-sec, 0.3s);\n user-select: none;\n}\n\n.vchasno-ui-button:disabled {\n cursor: not-allowed;\n opacity: 0.8;\n}\n\n.vchasno-ui-button:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-default-hover-bg);\n color: var(--vchasno-ui-btn-default-hover-color);\n cursor: pointer;\n}\n\n.vchasno-ui-button.--sm {\n min-width: 40px;\n padding: 0 15px;\n}\n\n.vchasno-ui-button.--md {\n min-width: 145px;\n padding: 0 20px;\n}\n\n.vchasno-ui-button.--lg {\n min-width: 200px;\n min-height: 50px;\n padding: 0 20px;\n}\n\n.vchasno-ui-button.--wide {\n width: 100%;\n}\n\n.vchasno-ui-button.--primary {\n border: 1px solid transparent;\n background-color: var(--vchasno-ui-btn-primary-bg);\n color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline {\n border: 1px solid var(--vchasno-ui-btn-primary-bg);\n background-color: transparent;\n box-shadow: none;\n color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary {\n background-color: var(--vchasno-ui-btn-secondary-bg);\n color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button:disabled.--primary,\n.vchasno-ui-button:disabled.--secondary {\n border-color: #b6cadb;\n background-color: #b6cadb;\n color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-primary-hover-bg);\n color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline:not(:disabled):hover {\n border: 1px solid var(--vchasno-ui-btn-primary-bg);\n background-color: var(--vchasno-ui-btn-default-hover-bg);\n color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary.--outline {\n border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n background-color: transparent;\n box-shadow: none;\n color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--secondary:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-secondary-hover-bg);\n color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button.--secondary.--outline:not(:disabled):hover {\n border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n background-color: rgb(0 0 0 / 10%);\n color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--pink {\n background-color: var(--vchasno-ui-btn-pink-bg);\n color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline {\n border: 1px solid var(--vchasno-ui-btn-pink-bg);\n background-color: transparent;\n color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--pink:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-pink-hover-bg);\n color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline:not(:disabled):hover {\n border: 1px solid var(--vchasno-ui-btn-pink-bg);\n background-color: transparent;\n color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--danger {\n border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n background-color: var(--vchasno-ui-btn-danger-bg, rgb(239 101 98 / 20%));\n color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--danger.--outline {\n border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n background-color: transparent;\n color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button:disabled.--danger {\n border: 1px solid #b6cadb;\n background-color: rgb(182 202 219 / 20%);\n color: #b6cadb;\n}\n\n.vchasno-ui-button.--danger:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-danger-hover-bg, #ef6562);\n color: var(--vchasno-ui-btn-danger-hover-color, #fff);\n}\n\n.vchasno-ui-button.--danger.--outline:not(:disabled):hover {\n border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n background-color: rgb(0 0 0 / 10%);\n color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--transparent .vchasno-ui-spinner__svg__circle {\n stroke: var(--vchasno-ui-btn-default-color);\n transition: stroke var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-button.--transparent:hover .vchasno-ui-spinner__svg__circle {\n stroke: var(--vchasno-ui-btn-default-hover-color);\n}\n\n.vchasno-ui-button:disabled.--transparent {\n color: #b6cadb;\n}\n\n.vchasno-ui-button.--light {\n border: 1px solid transparent;\n background-color: var(--vchasno-ui-btn-light-bg, #fff);\n color: var(--vchasno-ui-btn-light-color);\n}\n\n.vchasno-ui-button:disabled.--light {\n border: none;\n background-color: rgb(182 202 219 / 20%);\n color: #b6cadb;\n}\n\n.vchasno-ui-button.--light.--outline {\n border: 1px solid var(--vchasno-ui-btn-primary-bg);\n background-color: var(--vchasno-ui-btn-primary-color);\n color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--light:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-light-hover-bg);\n color: var(--vchasno-ui-btn-primary-bg);\n}\n";
239
+ var css_248z$l = ".vchasno-ui-button {\n display: inline-flex;\n min-height: 40px;\n align-items: center;\n justify-content: center;\n border: 0;\n border-radius: 8px;\n background-color: var(--vchasno-ui-btn-default-bg);\n color: var(--vchasno-ui-btn-default-color);\n font-size: var(--vchasno-ui-btn-font-size);\n font-weight: 700;\n gap: 5px;\n transition:\n min-height var(--vchasno-ui-transition-duration-sec, 0.3s),\n padding var(--vchasno-ui-transition-duration-sec, 0.3s),\n background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n color var(--vchasno-ui-transition-duration-sec, 0.3s);\n user-select: none;\n}\n\n.vchasno-ui-button:disabled {\n cursor: not-allowed;\n opacity: 0.8;\n}\n\n.vchasno-ui-button:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-default-hover-bg);\n color: var(--vchasno-ui-btn-default-hover-color);\n cursor: pointer;\n}\n\n.vchasno-ui-button.--sm {\n min-width: 40px;\n padding: 0 15px;\n}\n\n.vchasno-ui-button.--md {\n min-width: 40px;\n padding: 0 24px;\n}\n\n.vchasno-ui-button.--lg {\n min-width: 50px;\n min-height: 50px;\n padding: 0 32px;\n}\n\n.vchasno-ui-button.--wide {\n width: 100%;\n}\n\n.vchasno-ui-button.--primary {\n border: 1px solid transparent;\n background-color: var(--vchasno-ui-btn-primary-bg);\n color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline {\n border: 1px solid var(--vchasno-ui-btn-primary-bg);\n background-color: transparent;\n box-shadow: none;\n color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary {\n border: 1px solid var(--vchasno-ui-btn-secondary-border-color);\n background-color: var(--vchasno-ui-btn-secondary-bg);\n color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button:disabled.--primary,\n.vchasno-ui-button:disabled.--secondary {\n background-color: #b6cadb;\n color: var(--vchasno-ui-btn-disabled-color);\n}\n\n.vchasno-ui-button:disabled.--primary {\n background-color: var(--vchasno-ui-btn-primary-disabled-bg);\n}\n\n.vchasno-ui-button:disabled.--secondary {\n background-color: var(--vchasno-ui-btn-secondary-disabled-bg);\n}\n\n.vchasno-ui-button.--primary:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-primary-hover-bg);\n color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--primary.--outline:not(:disabled):hover {\n border: 1px solid var(--vchasno-ui-btn-primary-bg);\n background-color: var(--vchasno-ui-btn-default-hover-bg);\n color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--secondary.--outline {\n border: 1px solid var(--vchasno-ui-btn-secondary-bg);\n background-color: transparent;\n box-shadow: none;\n color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--secondary:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-secondary-hover-bg);\n color: var(--vchasno-ui-btn-secondary-color);\n}\n\n.vchasno-ui-button.--secondary.--outline:not(:disabled):hover {\n background-color: rgb(0 0 0 / 10%);\n color: var(--vchasno-ui-btn-secondary-bg);\n}\n\n.vchasno-ui-button.--pink {\n background-color: var(--vchasno-ui-btn-pink-bg);\n color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline {\n border: 1px solid var(--vchasno-ui-btn-pink-bg);\n background-color: transparent;\n color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--pink:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-pink-hover-bg);\n color: var(--vchasno-ui-btn-primary-color);\n}\n\n.vchasno-ui-button.--pink.--outline:not(:disabled):hover {\n border: 1px solid var(--vchasno-ui-btn-pink-bg);\n background-color: transparent;\n color: var(--vchasno-ui-btn-pink-bg);\n}\n\n.vchasno-ui-button.--danger {\n border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n background-color: var(--vchasno-ui-btn-danger-bg, rgb(239 101 98 / 20%));\n color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--danger.--outline {\n border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n background-color: transparent;\n color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button:disabled.--danger {\n border: 1px solid #b6cadb;\n background-color: rgb(182 202 219 / 20%);\n color: #b6cadb;\n}\n\n.vchasno-ui-button.--danger:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-danger-hover-bg, #ef6562);\n color: var(--vchasno-ui-btn-danger-hover-color, #fff);\n}\n\n.vchasno-ui-button.--danger.--outline:not(:disabled):hover {\n border: 1px solid var(--vchasno-ui-btn-danger-color, #ef6562);\n background-color: rgb(0 0 0 / 10%);\n color: var(--vchasno-ui-btn-danger-color, #ef6562);\n}\n\n.vchasno-ui-button.--transparent .vchasno-ui-spinner__svg__circle {\n stroke: var(--vchasno-ui-btn-default-color);\n transition: stroke var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-button.--transparent:hover .vchasno-ui-spinner__svg__circle {\n stroke: var(--vchasno-ui-btn-default-hover-color);\n}\n\n.vchasno-ui-button:disabled.--transparent {\n color: #b6cadb;\n}\n\n.vchasno-ui-button.--light {\n border: 1px solid transparent;\n background-color: var(--vchasno-ui-btn-light-bg, #fff);\n color: var(--vchasno-ui-btn-light-color);\n}\n\n.vchasno-ui-button:disabled.--light {\n border: none;\n background-color: rgb(182 202 219 / 20%);\n color: #b6cadb;\n}\n\n.vchasno-ui-button.--light.--outline {\n border: 1px solid var(--vchasno-ui-btn-primary-bg);\n background-color: var(--vchasno-ui-btn-primary-color);\n color: var(--vchasno-ui-btn-primary-bg);\n}\n\n.vchasno-ui-button.--light:not(:disabled):hover {\n background-color: var(--vchasno-ui-btn-light-hover-bg);\n color: var(--vchasno-ui-btn-primary-bg);\n}\n";
240
240
  styleInject(css_248z$l);
241
241
 
242
242
  var Button = React$1.forwardRef(function (_a, ref) {
243
- var _b = _a.theme, theme = _b === void 0 ? 'primary' : _b, _c = _a.type, type = _c === void 0 ? 'button' : _c, _d = _a.size, size = _d === void 0 ? 'md' : _d, _e = _a.outline, outline = _e === void 0 ? false : _e, _f = _a.loading, loading = _f === void 0 ? false : _f, _g = _a.wide, wide = _g === void 0 ? false : _g, className = _a.className, children = _a.children, rest = __rest(_a, ["theme", "type", "size", "outline", "loading", "wide", "className", "children"]);
244
- return (React$1.createElement("button", __assign({ ref: ref, type: type, className: cn('vchasno-ui-button', "--".concat(theme), "--".concat(size), {
243
+ var _b = _a.theme, theme = _b === void 0 ? 'primary' : _b, _c = _a.type, type = _c === void 0 ? 'button' : _c, _d = _a.size, size = _d === void 0 ? 'md' : _d, _e = _a.outline, outline = _e === void 0 ? false : _e, _f = _a.loading, loading = _f === void 0 ? false : _f, _g = _a.wide, wide = _g === void 0 ? false : _g, className = _a.className, dataQa = _a.dataQa, children = _a.children, rest = __rest(_a, ["theme", "type", "size", "outline", "loading", "wide", "className", "dataQa", "children"]);
244
+ return (React$1.createElement("button", __assign({ "data-qa": dataQa, ref: ref, type: type, className: cn('vchasno-ui-button', "--".concat(theme), "--".concat(size), {
245
245
  '--outline': outline,
246
246
  '--wide': wide,
247
247
  '--loading': loading,
@@ -282,8 +282,8 @@ var css_248z$i = ".vchasno-ui-input {\n display: inline-flex;\n max-width:
282
282
  styleInject(css_248z$i);
283
283
 
284
284
  var Input = function (_a) {
285
- var className = _a.className, disabled = _a.disabled, startElement = _a.startElement, endElement = _a.endElement, error = _a.error, label = _a.label, hint = _a.hint, wide = _a.wide, required = _a.required, loading = _a.loading, labelProps = _a.labelProps, _b = _a.hideEmptyMeta, hideEmptyMeta = _b === void 0 ? false : _b, children = _a.children;
286
- return (React$1.createElement("label", __assign({ className: cn('vchasno-ui-input', {
285
+ var className = _a.className, disabled = _a.disabled, startElement = _a.startElement, endElement = _a.endElement, error = _a.error, label = _a.label, hint = _a.hint, wide = _a.wide, required = _a.required, loading = _a.loading, labelProps = _a.labelProps, _b = _a.hideEmptyMeta, hideEmptyMeta = _b === void 0 ? false : _b, dataQa = _a.dataQa, children = _a.children;
286
+ return (React$1.createElement("label", __assign({ "data-qa": dataQa, className: cn('vchasno-ui-input', {
287
287
  '--required': required,
288
288
  '--disabled': disabled,
289
289
  '--wide': wide,
@@ -308,12 +308,12 @@ var reactTextMask = {exports: {}};
308
308
  var reactTextMaskExports = reactTextMask.exports;
309
309
  var MaskedInput = /*@__PURE__*/getDefaultExportFromCjs(reactTextMaskExports);
310
310
 
311
- var css_248z$h = ".vchasno-ui-mask-input {\n position: relative;\n font-size: var(--vchasno-ui-input-font-size);\n line-height: var(--vchasno-ui-input-font-size);\n}\n\n.vchasno-ui-mask-input::placeholder {\n color: var(--vchasno-ui-input-border-color-default);\n font-size: var(--vchasno-ui-input-font-size);\n line-height: calc(var(--vchasno-ui-input-font-size) * 1.2);\n transition: color var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-mask-input:focus::placeholder {\n color: transparent;\n}\n";
311
+ var css_248z$h = ".vchasno-ui-mask-input {\n position: relative;\n font-size: var(--vchasno-ui-input-font-size);\n line-height: var(--vchasno-ui-input-font-size);\n}\n\n.vchasno-ui-mask-input::placeholder {\n color: var(--vchasno-ui-input-border-color-default);\n font-size: var(--vchasno-ui-input-font-size);\n line-height: calc(var(--vchasno-ui-input-font-size) * 1.2);\n transition: color var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-mask-input:not(:focus-within)::placeholder {\n visibility: hidden;\n}\n";
312
312
  styleInject(css_248z$h);
313
313
 
314
314
  var MaskInput = function (_a) {
315
- var className = _a.className, disabled = _a.disabled, startElement = _a.startElement, endElement = _a.endElement, error = _a.error, label = _a.label, hint = _a.hint, wide = _a.wide, required = _a.required, loading = _a.loading, inputClassName = _a.inputClassName, labelProps = _a.labelProps, rest = __rest(_a, ["className", "disabled", "startElement", "endElement", "error", "label", "hint", "wide", "required", "loading", "inputClassName", "labelProps"]);
316
- return (React$1.createElement(Input, { required: required, wide: wide, className: className, loading: loading, disabled: disabled, label: label, error: error, hint: hint, endElement: endElement, labelProps: labelProps, startElement: startElement },
315
+ var className = _a.className, disabled = _a.disabled, startElement = _a.startElement, endElement = _a.endElement, error = _a.error, label = _a.label, hint = _a.hint, wide = _a.wide, required = _a.required, loading = _a.loading, inputClassName = _a.inputClassName, labelProps = _a.labelProps, dataQa = _a.dataQa, rest = __rest(_a, ["className", "disabled", "startElement", "endElement", "error", "label", "hint", "wide", "required", "loading", "inputClassName", "labelProps", "dataQa"]);
316
+ return (React$1.createElement(Input, { dataQa: dataQa, required: required, wide: wide, className: className, loading: loading, disabled: disabled, label: label, error: error, hint: hint, endElement: endElement, labelProps: labelProps, startElement: startElement },
317
317
  React$1.createElement(MaskedInput, __assign({}, rest, { required: required, disabled: disabled, className: cn('vchasno-ui-mask-input', inputClassName) }))));
318
318
  };
319
319
 
@@ -394,13 +394,13 @@ var Pagination = function (_a) {
394
394
  React$1.createElement("path", { d: "M7 9.99253C7 9.73253 7.1 9.48252 7.29 9.28253L11.29 5.29253C11.68 4.90253 12.32 4.90253 12.71 5.29253C13.1 5.68253 13.1 6.32253 12.71 6.71253L9.42 9.99253L12.71 13.2825C13.1 13.6725 13.1 14.3125 12.71 14.7025C12.32 15.0925 11.68 15.0925 11.29 14.7025L7.3 10.7125C7.1 10.5125 7 10.2525 7 9.99253Z", fill: "currentColor" })))));
395
395
  };
396
396
 
397
- var css_248z$f = ".vchasno-ui-text-input {\n font-size: var(--vchasno-ui-input-font-size);\n line-height: var(--vchasno-ui-input-font-size);\n}\n\n.vchasno-ui-text-input::-webkit-outer-spin-button,\n.vchasno-ui-text-input::-webkit-inner-spin-button {\n margin: 0;\n appearance: none;\n}\n\n/* Firefox */\n.vchasno-ui-text-input[type='number'] {\n appearance: textfield;\n}\n\n.vchasno-ui-text-input::placeholder {\n color: var(--vchasno-ui-input-border-color-default);\n font-size: var(--vchasno-ui-input-font-size);\n line-height: var(--vchasno-ui-input-font-size);\n transition: color var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n";
397
+ var css_248z$f = ".vchasno-ui-text-input {\n font-size: var(--vchasno-ui-input-font-size);\n line-height: var(--vchasno-ui-input-font-size);\n}\n\n.vchasno-ui-text-input::-webkit-outer-spin-button,\n.vchasno-ui-text-input::-webkit-inner-spin-button {\n margin: 0;\n appearance: none;\n}\n\n/* Firefox */\n.vchasno-ui-text-input[type='number'] {\n appearance: textfield;\n}\n\n.vchasno-ui-text-input::placeholder {\n color: var(--vchasno-ui-input-border-color-default);\n font-size: var(--vchasno-ui-input-font-size);\n line-height: var(--vchasno-ui-input-font-size);\n transition: color var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-text-input:not(:focus-within)::placeholder {\n visibility: hidden;\n}\n";
398
398
  styleInject(css_248z$f);
399
399
 
400
400
  var TextInput = React$1.forwardRef(function (_a, ref) {
401
- var className = _a.className, disabled = _a.disabled, startElement = _a.startElement, endElement = _a.endElement, error = _a.error, label = _a.label, hint = _a.hint, wide = _a.wide, required = _a.required, loading = _a.loading, inputClassName = _a.inputClassName, labelProps = _a.labelProps, hideEmptyMeta = _a.hideEmptyMeta, _b = _a.placeholder, placeholder = _b === void 0 ? ' ' : _b, //need "space" for correct label working
402
- rest = __rest(_a, ["className", "disabled", "startElement", "endElement", "error", "label", "hint", "wide", "required", "loading", "inputClassName", "labelProps", "hideEmptyMeta", "placeholder"]);
403
- return (React$1.createElement(Input, { required: required, wide: wide, className: className, loading: loading, disabled: disabled, label: label, error: error, hint: hint, endElement: endElement, startElement: startElement, labelProps: labelProps, hideEmptyMeta: hideEmptyMeta },
401
+ var className = _a.className, disabled = _a.disabled, startElement = _a.startElement, endElement = _a.endElement, error = _a.error, label = _a.label, hint = _a.hint, wide = _a.wide, required = _a.required, loading = _a.loading, inputClassName = _a.inputClassName, labelProps = _a.labelProps, hideEmptyMeta = _a.hideEmptyMeta, dataQa = _a.dataQa, _b = _a.placeholder, placeholder = _b === void 0 ? ' ' : _b, //need "space" for correct label working
402
+ rest = __rest(_a, ["className", "disabled", "startElement", "endElement", "error", "label", "hint", "wide", "required", "loading", "inputClassName", "labelProps", "hideEmptyMeta", "dataQa", "placeholder"]);
403
+ return (React$1.createElement(Input, { dataQa: dataQa, required: required, wide: wide, className: className, loading: loading, disabled: disabled, label: label, error: error, hint: hint, endElement: endElement, startElement: startElement, labelProps: labelProps, hideEmptyMeta: hideEmptyMeta },
404
404
  React$1.createElement("input", __assign({ disabled: disabled, className: cn('vchasno-ui-text-input', inputClassName), required: required, ref: ref, placeholder: placeholder }, rest))));
405
405
  });
406
406
  TextInput.displayName = 'TextInput';
@@ -418,7 +418,7 @@ var typeToCN = {
418
418
  likeLink: '--like-link',
419
419
  };
420
420
  var Text = React$1.forwardRef(function (_a, ref) {
421
- var _b = _a.type, type = _b === void 0 ? 'default' : _b, className = _a.className, _c = _a.code, code = _c === void 0 ? false : _c, _d = _a.del, del = _d === void 0 ? false : _d, _e = _a.underline, underline = _e === void 0 ? false : _e, _f = _a.strong, strong = _f === void 0 ? false : _f, children = _a.children, ellipsis = _a.ellipsis, _g = _a.required, required = _g === void 0 ? false : _g, rest = __rest(_a, ["type", "className", "code", "del", "underline", "strong", "children", "ellipsis", "required"]);
421
+ var _b = _a.type, type = _b === void 0 ? 'default' : _b, className = _a.className, _c = _a.code, code = _c === void 0 ? false : _c, _d = _a.del, del = _d === void 0 ? false : _d, _e = _a.underline, underline = _e === void 0 ? false : _e, _f = _a.strong, strong = _f === void 0 ? false : _f, children = _a.children, ellipsis = _a.ellipsis, _g = _a.required, required = _g === void 0 ? false : _g, dataQa = _a.dataQa, rest = __rest(_a, ["type", "className", "code", "del", "underline", "strong", "children", "ellipsis", "required", "dataQa"]);
422
422
  var element = 'span';
423
423
  if (del) {
424
424
  element = 'del';
@@ -432,7 +432,7 @@ var Text = React$1.forwardRef(function (_a, ref) {
432
432
  if (code) {
433
433
  element = 'code';
434
434
  }
435
- return React$1.createElement(element, __assign({ ref: ref, className: cn('vchasno-ui-text', className, typeToCN[type], {
435
+ return React$1.createElement(element, __assign({ ref: ref, 'data-qa': dataQa, className: cn('vchasno-ui-text', className, typeToCN[type], {
436
436
  '--code': code,
437
437
  '--ellipsis': ellipsis,
438
438
  '--required': required,
@@ -443,24 +443,24 @@ Text.displayName = 'Text';
443
443
  var css_248z$d = ".--text-start {\n text-align: start;\n}\n\n.--text-center {\n text-align: center;\n}\n\n.--text-end {\n text-align: end;\n}\n\n.--text-justify {\n text-align: justify;\n}\n";
444
444
  styleInject(css_248z$d);
445
445
 
446
- var css_248z$c = ".vchasno-ui-title {\n color: var(--vchasno-ui-text-primary-color, #333);\n}\n\n.vchasno-ui-title.--pretty {\n text-wrap: pretty;\n}\n\n.vchasno-ui-title.--ellipsis {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\nh1.vchasno-ui-title,\n.vchasno-ui-title h1 {\n font-size: 32px;\n font-weight: 500;\n line-height: 1.35;\n}\n\nh2.vchasno-ui-title,\n.vchasno-ui-title h2 {\n font-size: 30px;\n font-weight: 500;\n line-height: 1.35;\n}\n\nh3.vchasno-ui-title,\n.vchasno-ui-title h3 {\n font-size: 24px;\n font-weight: 500;\n line-height: 1.35;\n}\n\nh4.vchasno-ui-title,\n.vchasno-ui-title h4 {\n font-size: 20px;\n font-weight: 400;\n line-height: 1.4;\n}\n\nh5.vchasno-ui-title,\n.vchasno-ui-title h5 {\n font-size: 16px;\n font-weight: 400;\n line-height: 1.5;\n}\n";
446
+ var css_248z$c = ".vchasno-ui-title {\n color: var(--vchasno-ui-text-primary-color, #333);\n}\n\n.vchasno-ui-title.--pretty {\n text-wrap: pretty;\n}\n\n.vchasno-ui-title.--ellipsis {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\nh1.vchasno-ui-title,\n.vchasno-ui-title h1 {\n font-size: 32px;\n font-weight: 700;\n line-height: 40px;\n}\n\nh2.vchasno-ui-title,\n.vchasno-ui-title h2 {\n font-size: 24px;\n font-weight: 700;\n line-height: 28px;\n}\n\nh3.vchasno-ui-title,\n.vchasno-ui-title h3 {\n font-size: 20px;\n font-weight: 500;\n line-height: 24px;\n}\n\nh4.vchasno-ui-title,\n.vchasno-ui-title h4 {\n font-size: 16px;\n font-weight: 400;\n line-height: 20px;\n}\n\nh5.vchasno-ui-title,\n.vchasno-ui-title h5 {\n font-size: 12px;\n font-weight: 400;\n line-height: 14px;\n}\n";
447
447
  styleInject(css_248z$c);
448
448
 
449
449
  var Title = React$1.forwardRef(function (_a, ref) {
450
- var _b = _a.level, level = _b === void 0 ? 1 : _b, className = _a.className, _c = _a.ellipsis, ellipsis = _c === void 0 ? false : _c, textAlign = _a.textAlign, _d = _a.pretty, pretty = _d === void 0 ? true : _d, rest = __rest(_a, ["level", "className", "ellipsis", "textAlign", "pretty"]);
450
+ var _b = _a.level, level = _b === void 0 ? 1 : _b, className = _a.className, _c = _a.ellipsis, ellipsis = _c === void 0 ? false : _c, textAlign = _a.textAlign, _d = _a.pretty, pretty = _d === void 0 ? true : _d, dataQa = _a.dataQa, rest = __rest(_a, ["level", "className", "ellipsis", "textAlign", "pretty", "dataQa"]);
451
451
  var classes = cn('vchasno-ui-title', className, { '--ellipsis': ellipsis, '--pretty': pretty }, textAlign && "--text-".concat(textAlign));
452
452
  switch (level) {
453
453
  case 2:
454
- return React$1.createElement("h2", __assign({}, rest, { ref: ref, className: classes }));
454
+ return React$1.createElement("h2", __assign({}, rest, { ref: ref, "data-qa": dataQa, className: classes }));
455
455
  case 3:
456
- return React$1.createElement("h3", __assign({}, rest, { ref: ref, className: classes }));
456
+ return React$1.createElement("h3", __assign({}, rest, { ref: ref, "data-qa": dataQa, className: classes }));
457
457
  case 4:
458
- return React$1.createElement("h4", __assign({}, rest, { ref: ref, className: classes }));
458
+ return React$1.createElement("h4", __assign({}, rest, { ref: ref, "data-qa": dataQa, className: classes }));
459
459
  case 5:
460
- return React$1.createElement("h5", __assign({}, rest, { ref: ref, className: classes }));
460
+ return React$1.createElement("h5", __assign({}, rest, { ref: ref, "data-qa": dataQa, className: classes }));
461
461
  case 1:
462
462
  default:
463
- return React$1.createElement("h1", __assign({}, rest, { ref: ref, className: classes }));
463
+ return React$1.createElement("h1", __assign({}, rest, { ref: ref, "data-qa": dataQa, className: classes }));
464
464
  }
465
465
  });
466
466
  Title.displayName = 'Title';
@@ -469,8 +469,8 @@ var css_248z$b = ".vchasno-ui-paragraph {\n color: var(--vchasno-ui-text-prim
469
469
  styleInject(css_248z$b);
470
470
 
471
471
  var Paragraph = React$1.forwardRef(function (_a, ref) {
472
- var _b = _a.ellipsis, ellipsis = _b === void 0 ? false : _b, children = _a.children, className = _a.className, textAlign = _a.textAlign, ellipsisLine = _a.ellipsisLine, rest = __rest(_a, ["ellipsis", "children", "className", "textAlign", "ellipsisLine"]);
473
- return (React$1.createElement("p", __assign({ ref: ref, title: ellipsis && typeof children === 'string' ? children : undefined, className: cn('vchasno-ui-paragraph', className, { '--ellipsis': ellipsis, '--ellipsis-line': ellipsisLine !== undefined }, textAlign && "--text-".concat(textAlign)) }, rest, { style: ellipsisLine ? { WebkitLineClamp: ellipsisLine } : undefined }), children));
472
+ var _b = _a.ellipsis, ellipsis = _b === void 0 ? false : _b, children = _a.children, className = _a.className, textAlign = _a.textAlign, ellipsisLine = _a.ellipsisLine, dataQa = _a.dataQa, rest = __rest(_a, ["ellipsis", "children", "className", "textAlign", "ellipsisLine", "dataQa"]);
473
+ return (React$1.createElement("p", __assign({ "data-qa": dataQa, ref: ref, title: ellipsis && typeof children === 'string' ? children : undefined, className: cn('vchasno-ui-paragraph', className, { '--ellipsis': ellipsis, '--ellipsis-line': ellipsisLine !== undefined }, textAlign && "--text-".concat(textAlign)) }, rest, { style: ellipsisLine ? { WebkitLineClamp: ellipsisLine } : undefined }), children));
474
474
  });
475
475
  Paragraph.displayName = 'Paragraph';
476
476
 
@@ -2872,8 +2872,8 @@ var css_248z$a = ".vchasno-ui-textarea-input-container .vchasno-ui-input__wrappe
2872
2872
  styleInject(css_248z$a);
2873
2873
 
2874
2874
  var TextAreaInput = React$1.forwardRef(function (_a, ref) {
2875
- var className = _a.className, disabled = _a.disabled, startElement = _a.startElement, endElement = _a.endElement, error = _a.error, label = _a.label, hint = _a.hint, wide = _a.wide, required = _a.required, loading = _a.loading, minRows = _a.minRows, maxRows = _a.maxRows, textareaClassName = _a.textareaClassName, labelProps = _a.labelProps, rest = __rest(_a, ["className", "disabled", "startElement", "endElement", "error", "label", "hint", "wide", "required", "loading", "minRows", "maxRows", "textareaClassName", "labelProps"]);
2876
- return (React$1.createElement(Input, { required: required, wide: wide, className: cn(className, 'vchasno-ui-textarea-input-container'), loading: loading, disabled: disabled, label: label, error: error, hint: hint, endElement: endElement, labelProps: labelProps, startElement: startElement },
2875
+ var className = _a.className, disabled = _a.disabled, startElement = _a.startElement, endElement = _a.endElement, error = _a.error, label = _a.label, hint = _a.hint, wide = _a.wide, required = _a.required, loading = _a.loading, minRows = _a.minRows, maxRows = _a.maxRows, textareaClassName = _a.textareaClassName, labelProps = _a.labelProps, dataQa = _a.dataQa, rest = __rest(_a, ["className", "disabled", "startElement", "endElement", "error", "label", "hint", "wide", "required", "loading", "minRows", "maxRows", "textareaClassName", "labelProps", "dataQa"]);
2876
+ return (React$1.createElement(Input, { dataQa: dataQa, required: required, wide: wide, className: cn(className, 'vchasno-ui-textarea-input-container'), loading: loading, disabled: disabled, label: label, error: error, hint: hint, endElement: endElement, labelProps: labelProps, startElement: startElement },
2877
2877
  React$1.createElement(TextareaAutosize, __assign({}, rest, { ref: ref, minRows: minRows, maxRows: maxRows, required: required, disabled: disabled, className: cn('vchasno-ui-textarea-input', textareaClassName) }))));
2878
2878
  });
2879
2879
  TextAreaInput.displayName = 'TextAreaInput';
@@ -2890,7 +2890,7 @@ var iconMap = {
2890
2890
  config: function () { return React$1.createElement(React$1.Fragment, null, "\u2699\uFE0F"); },
2891
2891
  };
2892
2892
  var Alert = function (_a) {
2893
- var _b = _a.type, type = _b === void 0 ? 'info' : _b, _c = _a.leftBorder, leftBorder = _c === void 0 ? true : _c, _d = _a.hideIcon, hideIcon = _d === void 0 ? false : _d, _e = _a.scrollIntoView, scrollIntoView = _e === void 0 ? false : _e, icon = _a.icon, className = _a.className, children = _a.children, onClose = _a.onClose, wide = _a.wide, _f = _a.close, close = _f === void 0 ? false : _f, customIcon = _a.customIcon;
2893
+ var _b = _a.type, type = _b === void 0 ? 'info' : _b, _c = _a.leftBorder, leftBorder = _c === void 0 ? true : _c, _d = _a.hideIcon, hideIcon = _d === void 0 ? false : _d, _e = _a.scrollIntoView, scrollIntoView = _e === void 0 ? false : _e, icon = _a.icon, className = _a.className, children = _a.children, onClose = _a.onClose, wide = _a.wide, _f = _a.close, close = _f === void 0 ? false : _f, dataQa = _a.dataQa, customIcon = _a.customIcon;
2894
2894
  var iconNode = null;
2895
2895
  if (customIcon) {
2896
2896
  iconNode = React$1.createElement("span", { className: "vchasno-ui-alert__icon-wrapper" }, customIcon);
@@ -2915,7 +2915,7 @@ var Alert = function (_a) {
2915
2915
  });
2916
2916
  }
2917
2917
  }, [scrollIntoView]);
2918
- return (React$1.createElement("span", { ref: rootRef, className: cn('vchasno-ui-alert', "--".concat(type), { '--close': close }, { '--wide': wide }, { '--left-border': leftBorder }, className) },
2918
+ return (React$1.createElement("span", { "data-qa": dataQa, ref: rootRef, className: cn('vchasno-ui-alert', "--".concat(type), { '--close': close }, { '--wide': wide }, { '--left-border': leftBorder }, className) },
2919
2919
  !hideIcon && iconNode,
2920
2920
  React$1.createElement("div", null, children),
2921
2921
  closeNode));
@@ -2930,7 +2930,7 @@ var spinnerSizeMap = {
2930
2930
  lg: 36,
2931
2931
  };
2932
2932
  var Switch = React$1.forwardRef(function (_a, ref) {
2933
- var className = _a.className, label = _a.label, onChange = _a.onChange, onChecked = _a.onChecked, value = _a.value, _b = _a.defaultChecked, defaultChecked = _b === void 0 ? false : _b, disabled = _a.disabled, loading = _a.loading, id = _a.id, _c = _a.size, size = _c === void 0 ? 'md' : _c, rest = __rest(_a, ["className", "label", "onChange", "onChecked", "value", "defaultChecked", "disabled", "loading", "id", "size"]);
2933
+ var className = _a.className, label = _a.label, onChange = _a.onChange, onChecked = _a.onChecked, value = _a.value, _b = _a.defaultChecked, defaultChecked = _b === void 0 ? false : _b, disabled = _a.disabled, loading = _a.loading, id = _a.id, _c = _a.size, size = _c === void 0 ? 'md' : _c, dataQa = _a.dataQa, rest = __rest(_a, ["className", "label", "onChange", "onChecked", "value", "defaultChecked", "disabled", "loading", "id", "size", "dataQa"]);
2934
2934
  var _d = React$1.useState(defaultChecked), checked = _d[0], setChecked = _d[1];
2935
2935
  var isFullParentControlled = typeof value === 'boolean';
2936
2936
  var inputChecked = isFullParentControlled ? value : checked;
@@ -2941,7 +2941,7 @@ var Switch = React$1.forwardRef(function (_a, ref) {
2941
2941
  onChange === null || onChange === void 0 ? void 0 : onChange(event);
2942
2942
  onChecked === null || onChecked === void 0 ? void 0 : onChecked(event.target.checked, event);
2943
2943
  };
2944
- return (React$1.createElement("label", { className: cn('vchasno-ui-switch', "--".concat(size), {
2944
+ return (React$1.createElement("label", { "data-qa": dataQa, className: cn('vchasno-ui-switch', "--".concat(size), {
2945
2945
  'vchasno-ui-switch__active': inputChecked,
2946
2946
  'vchasno-ui-switch__disabled': disabled,
2947
2947
  }, className) },
@@ -3022,12 +3022,12 @@ var Tabs = function (_a) {
3022
3022
  React$1.createElement(Spinner, { color: "var(--vchasno-ui-tabs-active-color, #087dc1)" })))));
3023
3023
  };
3024
3024
 
3025
- var css_248z$6 = ".vchasno-ui-checkbox {\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n gap: 10px;\n user-select: none;\n}\n\n.vchasno-ui-checkbox__box {\n display: inline-flex;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border: 1px solid var(--vchasno-ui-checkbox-border-color, #b6cadb);\n border-radius: 3px;\n outline: 2px solid transparent;\n transition:\n background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n border var(--vchasno-ui-transition-duration-sec, 0.3s),\n outline var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle {\n stroke: var(--vchasno-ui-checkbox-bg-color);\n}\n\n.vchasno-ui-checkbox__svg {\n color: transparent;\n transform: scale(0) translateZ(0);\n transition:\n color var(--vchasno-ui-transition-duration-sec),\n transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(0.12, 0.4, 0.29, 1.46);\n}\n\n.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg {\n display: none;\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box {\n border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n background-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg {\n color: var(--vchasno-ui-checkbox-icon-color);\n transform: scale(1) translateZ(0);\n}\n\n.vchasno-ui-checkbox:hover > input:not(:disabled) + .vchasno-ui-checkbox__box,\n.vchasno-ui-checkbox > input:not(:disabled):active + .vchasno-ui-checkbox__box {\n border-color: var(--vchasno-ui-checkbox-bg-color, #3069fe);\n outline: 2px solid var(--vchasno-ui-checkbox-outline-color, #d9eaff);\n}\n\n.vchasno-ui-checkbox > input:disabled:checked + .vchasno-ui-checkbox__box {\n background-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle {\n stroke: var(--vchasno-ui-checkbox-icon-color);\n}\n\n.vchasno-ui-checkbox__label {\n font-size: var(--vchasno-ui-checkbox-font-size);\n line-height: 1;\n user-select: none;\n}\n\n.vchasno-ui-checkbox.--disabled {\n color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n cursor: not-allowed;\n}\n";
3025
+ var css_248z$6 = ".vchasno-ui-checkbox {\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n gap: 8px;\n user-select: none;\n}\n\n.vchasno-ui-checkbox__box {\n display: inline-flex;\n width: 16px;\n height: 16px;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n border: 1px solid var(--vchasno-ui-checkbox-border-color, #b6cadb);\n border-radius: 3px;\n outline: 2px solid transparent;\n transition:\n background-color var(--vchasno-ui-transition-duration-sec, 0.3s),\n border var(--vchasno-ui-transition-duration-sec, 0.3s),\n outline var(--vchasno-ui-transition-duration-sec, 0.3s);\n}\n\n.vchasno-ui-checkbox .vchasno-ui-spinner__svg__circle {\n stroke: var(--vchasno-ui-checkbox-bg-color);\n}\n\n.vchasno-ui-checkbox__svg {\n color: transparent;\n transform: scale(0) translateZ(0);\n transition:\n color var(--vchasno-ui-transition-duration-sec),\n transform var(--vchasno-ui-transition-duration-sec) cubic-bezier(0.12, 0.4, 0.29, 1.46);\n}\n\n.vchasno-ui-checkbox.--loading .vchasno-ui-checkbox__svg {\n display: none;\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box {\n border-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n background-color: var(--vchasno-ui-checkbox-bg-color, #604adf);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-checkbox__svg {\n color: var(--vchasno-ui-checkbox-icon-color);\n transform: scale(1) translateZ(0);\n}\n\n.vchasno-ui-checkbox.--hover > input:not(:disabled) + .vchasno-ui-checkbox__box,\n.vchasno-ui-checkbox:hover > input:not(:disabled) + .vchasno-ui-checkbox__box,\n.vchasno-ui-checkbox > input:not(:disabled):active + .vchasno-ui-checkbox__box {\n border-color: var(--vchasno-ui-checkbox-bg-color, #3069fe);\n outline: 2px solid var(--vchasno-ui-checkbox-outline-color, #d9eaff);\n}\n\n.vchasno-ui-checkbox > input:disabled:checked + .vchasno-ui-checkbox__box {\n border-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n background-color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n}\n\n.vchasno-ui-checkbox > input:checked + .vchasno-ui-checkbox__box .vchasno-ui-spinner__svg__circle {\n stroke: var(--vchasno-ui-checkbox-icon-color);\n}\n\n.vchasno-ui-checkbox__label {\n font-size: var(--vchasno-ui-checkbox-font-size);\n line-height: 1;\n user-select: none;\n}\n\n.vchasno-ui-checkbox.--disabled {\n color: var(--vchasno-ui-checkbox-disabled-bg, #b6cadb);\n cursor: not-allowed;\n}\n";
3026
3026
  styleInject(css_248z$6);
3027
3027
 
3028
3028
  var Checkbox = React$1.forwardRef(function (_a, ref) {
3029
- var className = _a.className, label = _a.label, partial = _a.partial, disabled = _a.disabled, loading = _a.loading, rest = __rest(_a, ["className", "label", "partial", "disabled", "loading"]);
3030
- return (React$1.createElement("label", { className: cn('vchasno-ui-checkbox', className, {
3029
+ var className = _a.className, label = _a.label, partial = _a.partial, disabled = _a.disabled, loading = _a.loading, dataQa = _a.dataQa, rest = __rest(_a, ["className", "label", "partial", "disabled", "loading", "dataQa"]);
3030
+ return (React$1.createElement("label", { "data-qa": dataQa, className: cn('vchasno-ui-checkbox', className, {
3031
3031
  '--loading': loading,
3032
3032
  '--disabled': disabled,
3033
3033
  }) },
@@ -13284,10 +13284,10 @@ var BlackTooltip = styled(function (_a) {
13284
13284
  var _a;
13285
13285
  return (_a = {},
13286
13286
  _a["& .".concat(tooltipClasses.arrow)] = {
13287
- color: '#333',
13287
+ color: 'rgba(0, 0, 0, 0.9)',
13288
13288
  },
13289
13289
  _a["& .".concat(tooltipClasses.tooltip)] = {
13290
- backgroundColor: '#333',
13290
+ backgroundColor: 'rgba(0, 0, 0, 0.9)',
13291
13291
  fontSize: '14px',
13292
13292
  color: '#fff',
13293
13293
  padding: '10px',