@megafon/ui-core 9.0.0-alpha.9 → 9.1.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 (234) hide show
  1. package/dist/es/components/Accordion/Accordion.css +1 -1
  2. package/dist/es/components/Accordion/Accordion.js +1 -3
  3. package/dist/es/components/Badges/CounterBadge/CounterBadge.js +1 -2
  4. package/dist/es/components/Badges/InfoBadge/InfoBadge.js +28 -16
  5. package/dist/es/components/Badges/PriceBadge/PriceBadge.js +28 -16
  6. package/dist/es/components/Badges/StatusBadge/StatusBadge.css +1 -1
  7. package/dist/es/components/Badges/StatusBadge/StatusBadge.js +16 -7
  8. package/dist/es/components/Badges/TimerBadge/TimerBadge.d.ts +2 -0
  9. package/dist/es/components/Badges/TimerBadge/TimerBadge.js +6 -2
  10. package/dist/es/components/Buttons/Button/Button.css +1 -1
  11. package/dist/es/components/Buttons/Button/Button.d.ts +4 -0
  12. package/dist/es/components/Buttons/Button/Button.js +37 -12
  13. package/dist/es/components/Buttons/ButtonClose/ButtonClose.css +1 -1
  14. package/dist/es/components/Buttons/ButtonClose/ButtonClose.js +1 -2
  15. package/dist/es/components/Calendar/components/_Month/Month.js +2 -6
  16. package/dist/es/components/Carousel/Carousel.css +1 -1
  17. package/dist/es/components/Carousel/Carousel.d.ts +7 -0
  18. package/dist/es/components/Carousel/Carousel.js +7 -1
  19. package/dist/es/components/Checkbox/Checkbox.css +1 -1
  20. package/dist/es/components/Checkbox/Checkbox.js +3 -2
  21. package/dist/es/components/Chips/Chips/Chip.css +1 -1
  22. package/dist/es/components/Chips/Chips/Chip.js +4 -6
  23. package/dist/es/components/Chips/Chips/Chips.d.ts +4 -0
  24. package/dist/es/components/Chips/Chips/Chips.js +8 -0
  25. package/dist/es/components/Chips/Chips/components/ChipsScrollPanel/ChipsScrollPanel.d.ts +8 -0
  26. package/dist/es/components/Chips/Chips/components/ChipsScrollPanel/ChipsScrollPanel.js +10 -7
  27. package/dist/es/components/Chips/ChipsSuggest/ChipSuggest.css +1 -1
  28. package/dist/es/components/Chips/ChipsSuggest/ChipSuggest.d.ts +7 -0
  29. package/dist/es/components/Chips/ChipsSuggest/ChipSuggest.js +7 -0
  30. package/dist/es/components/Chips/ChipsSuggest/ChipsSuggest.d.ts +4 -2
  31. package/dist/es/components/Chips/ChipsSuggest/ChipsSuggest.js +3 -0
  32. package/dist/es/components/ContentArea/ContentArea.css +1 -1
  33. package/dist/es/components/ContentArea/ContentArea.d.ts +3 -2
  34. package/dist/es/components/ContentArea/ContentArea.js +5 -0
  35. package/dist/es/components/ContentView/ContentView.css +1 -1
  36. package/dist/es/components/ContentView/ContentView.d.ts +15 -4
  37. package/dist/es/components/ContentView/ContentView.js +16 -3
  38. package/dist/es/components/Counter/Counter.css +1 -1
  39. package/dist/es/components/Counter/Counter.js +2 -2
  40. package/dist/es/components/Dropdown/Dropdown.css +1 -1
  41. package/dist/es/components/Dropdown/Dropdown.d.ts +3 -1
  42. package/dist/es/components/Dropdown/Dropdown.js +26 -4
  43. package/dist/es/components/ErrorLoad/ErrorLoad.css +1 -1
  44. package/dist/es/components/ErrorLoad/ErrorLoad.js +1 -3
  45. package/dist/es/components/Link/Link.css +1 -0
  46. package/dist/es/components/Link/Link.d.ts +3 -0
  47. package/dist/es/components/Link/Link.js +7 -3
  48. package/dist/es/components/ListData/ListData.css +1 -1
  49. package/dist/es/components/ListData/ListData.js +12 -14
  50. package/dist/es/components/ListData/components/ListDataSortable.css +1 -1
  51. package/dist/es/components/ListData/components/ListDataSortable.js +1 -3
  52. package/dist/es/components/Modal/Modal.d.ts +4 -0
  53. package/dist/es/components/Modal/Modal.js +4 -0
  54. package/dist/es/components/Modal/_ModalContent/ModalContent.css +1 -1
  55. package/dist/es/components/Modal/_ModalContent/ModalContent.js +25 -10
  56. package/dist/es/components/Modal/_ModalMobile/ModalMobile.js +2 -3
  57. package/dist/es/components/Modal/types.d.ts +1 -1
  58. package/dist/es/components/NavArrow/NavArrow.css +1 -1
  59. package/dist/es/components/NavArrow/NavArrow.js +4 -4
  60. package/dist/es/components/Notification/Notification.js +13 -9
  61. package/dist/es/components/Pagination/components/PaginationButton/PaginationButton.css +1 -1
  62. package/dist/es/components/Pagination/components/PaginationNavigation/PaginationNavigation.css +1 -1
  63. package/dist/es/components/Pagination/components/PaginationNavigation/PaginationNavigation.js +4 -4
  64. package/dist/es/components/Parameter/Parameter.js +3 -1
  65. package/dist/es/components/RadioButton/RadioButton.css +1 -1
  66. package/dist/es/components/Row/Row.css +1 -1
  67. package/dist/es/components/Row/Row.js +6 -4
  68. package/dist/es/components/ScrollBar/ScrollBar.d.ts +2 -0
  69. package/dist/es/components/ScrollBar/ScrollBar.js +6 -1
  70. package/dist/es/components/Search/Search.css +1 -1
  71. package/dist/es/components/Search/Search.d.ts +2 -0
  72. package/dist/es/components/Search/Search.js +14 -7
  73. package/dist/es/components/SectionAccordionGroup/SectionAccordionGroup.css +1 -0
  74. package/dist/es/components/SectionAccordionGroup/SectionAccordionGroup.d.ts +45 -0
  75. package/dist/es/components/SectionAccordionGroup/SectionAccordionGroup.js +161 -0
  76. package/dist/es/components/Select/Select.css +1 -1
  77. package/dist/es/components/Select/Select.d.ts +8 -1
  78. package/dist/es/components/Select/Select.js +17 -2
  79. package/dist/es/components/Selector/Selector.css +1 -1
  80. package/dist/es/components/Sliders/Slider/Slider.css +1 -1
  81. package/dist/es/components/Sliders/SliderRange/SliderRange.css +1 -1
  82. package/dist/es/components/Sliders/SliderRatio/SliderRatio.css +1 -1
  83. package/dist/es/components/Snackbar/Snackbar.css +1 -1
  84. package/dist/es/components/Snackbar/Snackbar.js +19 -20
  85. package/dist/es/components/Stepper/Stepper.css +1 -0
  86. package/dist/es/components/Stepper/Stepper.d.ts +52 -0
  87. package/dist/es/components/Stepper/Stepper.js +159 -0
  88. package/dist/es/components/Stepper/StepperItem.css +1 -0
  89. package/dist/es/components/Stepper/StepperItem.d.ts +57 -0
  90. package/dist/es/components/Stepper/StepperItem.js +101 -0
  91. package/dist/es/components/Stepper/img/separator-mobile.png +0 -0
  92. package/dist/es/components/Stepper/img/separator-vertical.png +0 -0
  93. package/dist/es/components/Stepper/img/separator.png +0 -0
  94. package/dist/es/components/Switcher/Switcher.css +1 -1
  95. package/dist/es/components/Switcher/Switcher.js +3 -2
  96. package/dist/es/components/Tabs/Tabs.css +1 -1
  97. package/dist/es/components/Tabs/Tabs.d.ts +2 -0
  98. package/dist/es/components/Tabs/Tabs.js +64 -55
  99. package/dist/es/components/TextField/TextField.css +1 -1
  100. package/dist/es/components/TextField/TextField.d.ts +2 -2
  101. package/dist/es/components/TextField/TextField.js +16 -9
  102. package/dist/es/components/Tile/Tile.d.ts +2 -0
  103. package/dist/es/components/Tile/Tile.js +3 -1
  104. package/dist/es/components/Tooltip/Tooltip.js +5 -3
  105. package/dist/es/components/UploadForm/UploadField/UploadField.css +1 -1
  106. package/dist/es/components/UploadForm/UploadField/UploadField.d.ts +3 -0
  107. package/dist/es/components/UploadForm/UploadField/UploadField.js +8 -2
  108. package/dist/es/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.css +1 -1
  109. package/dist/es/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.d.ts +2 -0
  110. package/dist/es/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.js +9 -2
  111. package/dist/es/components/UploadForm/UploadFileItem/UploadFileItem.css +1 -1
  112. package/dist/es/components/UploadForm/UploadFileItem/UploadFileItem.js +3 -4
  113. package/dist/es/components/UploadForm/UploadFileItem/components/_UploadFileItemIcon/UploadFileItemIcon.js +6 -0
  114. package/dist/es/hooks/useResolution.js +15 -23
  115. package/dist/es/index.d.ts +3 -0
  116. package/dist/es/index.js +3 -0
  117. package/dist/lib/components/Accordion/Accordion.css +1 -1
  118. package/dist/lib/components/Accordion/Accordion.js +1 -3
  119. package/dist/lib/components/Badges/CounterBadge/CounterBadge.js +1 -2
  120. package/dist/lib/components/Badges/InfoBadge/InfoBadge.js +28 -16
  121. package/dist/lib/components/Badges/PriceBadge/PriceBadge.js +28 -16
  122. package/dist/lib/components/Badges/StatusBadge/StatusBadge.css +1 -1
  123. package/dist/lib/components/Badges/StatusBadge/StatusBadge.js +16 -7
  124. package/dist/lib/components/Badges/TimerBadge/TimerBadge.d.ts +2 -0
  125. package/dist/lib/components/Badges/TimerBadge/TimerBadge.js +6 -2
  126. package/dist/lib/components/Buttons/Button/Button.css +1 -1
  127. package/dist/lib/components/Buttons/Button/Button.d.ts +4 -0
  128. package/dist/lib/components/Buttons/Button/Button.js +37 -12
  129. package/dist/lib/components/Buttons/ButtonClose/ButtonClose.css +1 -1
  130. package/dist/lib/components/Buttons/ButtonClose/ButtonClose.js +1 -2
  131. package/dist/lib/components/Calendar/components/_Month/Month.js +2 -6
  132. package/dist/lib/components/Carousel/Carousel.css +1 -1
  133. package/dist/lib/components/Carousel/Carousel.d.ts +7 -0
  134. package/dist/lib/components/Carousel/Carousel.js +8 -2
  135. package/dist/lib/components/Checkbox/Checkbox.css +1 -1
  136. package/dist/lib/components/Checkbox/Checkbox.js +3 -2
  137. package/dist/lib/components/Chips/Chips/Chip.css +1 -1
  138. package/dist/lib/components/Chips/Chips/Chip.js +4 -6
  139. package/dist/lib/components/Chips/Chips/Chips.d.ts +4 -0
  140. package/dist/lib/components/Chips/Chips/Chips.js +8 -0
  141. package/dist/lib/components/Chips/Chips/components/ChipsScrollPanel/ChipsScrollPanel.d.ts +8 -0
  142. package/dist/lib/components/Chips/Chips/components/ChipsScrollPanel/ChipsScrollPanel.js +9 -6
  143. package/dist/lib/components/Chips/ChipsSuggest/ChipSuggest.css +1 -1
  144. package/dist/lib/components/Chips/ChipsSuggest/ChipSuggest.d.ts +7 -0
  145. package/dist/lib/components/Chips/ChipsSuggest/ChipSuggest.js +8 -1
  146. package/dist/lib/components/Chips/ChipsSuggest/ChipsSuggest.d.ts +4 -2
  147. package/dist/lib/components/Chips/ChipsSuggest/ChipsSuggest.js +3 -0
  148. package/dist/lib/components/ContentArea/ContentArea.css +1 -1
  149. package/dist/lib/components/ContentArea/ContentArea.d.ts +3 -2
  150. package/dist/lib/components/ContentArea/ContentArea.js +5 -0
  151. package/dist/lib/components/ContentView/ContentView.css +1 -1
  152. package/dist/lib/components/ContentView/ContentView.d.ts +15 -4
  153. package/dist/lib/components/ContentView/ContentView.js +16 -3
  154. package/dist/lib/components/Counter/Counter.css +1 -1
  155. package/dist/lib/components/Counter/Counter.js +2 -2
  156. package/dist/lib/components/Dropdown/Dropdown.css +1 -1
  157. package/dist/lib/components/Dropdown/Dropdown.d.ts +3 -1
  158. package/dist/lib/components/Dropdown/Dropdown.js +26 -4
  159. package/dist/lib/components/ErrorLoad/ErrorLoad.css +1 -1
  160. package/dist/lib/components/ErrorLoad/ErrorLoad.js +1 -3
  161. package/dist/lib/components/Link/Link.css +1 -0
  162. package/dist/lib/components/Link/Link.d.ts +3 -0
  163. package/dist/lib/components/Link/Link.js +5 -2
  164. package/dist/lib/components/ListData/ListData.css +1 -1
  165. package/dist/lib/components/ListData/ListData.js +12 -14
  166. package/dist/lib/components/ListData/components/ListDataSortable.css +1 -1
  167. package/dist/lib/components/ListData/components/ListDataSortable.js +1 -3
  168. package/dist/lib/components/Modal/Modal.d.ts +4 -0
  169. package/dist/lib/components/Modal/Modal.js +4 -0
  170. package/dist/lib/components/Modal/_ModalContent/ModalContent.css +1 -1
  171. package/dist/lib/components/Modal/_ModalContent/ModalContent.js +25 -10
  172. package/dist/lib/components/Modal/_ModalMobile/ModalMobile.js +2 -3
  173. package/dist/lib/components/Modal/types.d.ts +1 -1
  174. package/dist/lib/components/NavArrow/NavArrow.css +1 -1
  175. package/dist/lib/components/NavArrow/NavArrow.js +4 -4
  176. package/dist/lib/components/Notification/Notification.js +13 -9
  177. package/dist/lib/components/Pagination/components/PaginationButton/PaginationButton.css +1 -1
  178. package/dist/lib/components/Pagination/components/PaginationNavigation/PaginationNavigation.css +1 -1
  179. package/dist/lib/components/Pagination/components/PaginationNavigation/PaginationNavigation.js +4 -4
  180. package/dist/lib/components/Parameter/Parameter.js +3 -1
  181. package/dist/lib/components/RadioButton/RadioButton.css +1 -1
  182. package/dist/lib/components/Row/Row.css +1 -1
  183. package/dist/lib/components/Row/Row.js +5 -3
  184. package/dist/lib/components/ScrollBar/ScrollBar.d.ts +2 -0
  185. package/dist/lib/components/ScrollBar/ScrollBar.js +6 -1
  186. package/dist/lib/components/Search/Search.css +1 -1
  187. package/dist/lib/components/Search/Search.d.ts +2 -0
  188. package/dist/lib/components/Search/Search.js +14 -7
  189. package/dist/lib/components/SectionAccordionGroup/SectionAccordionGroup.css +1 -0
  190. package/dist/lib/components/SectionAccordionGroup/SectionAccordionGroup.d.ts +45 -0
  191. package/dist/lib/components/SectionAccordionGroup/SectionAccordionGroup.js +170 -0
  192. package/dist/lib/components/Select/Select.css +1 -1
  193. package/dist/lib/components/Select/Select.d.ts +8 -1
  194. package/dist/lib/components/Select/Select.js +17 -2
  195. package/dist/lib/components/Selector/Selector.css +1 -1
  196. package/dist/lib/components/Sliders/Slider/Slider.css +1 -1
  197. package/dist/lib/components/Sliders/SliderRange/SliderRange.css +1 -1
  198. package/dist/lib/components/Sliders/SliderRatio/SliderRatio.css +1 -1
  199. package/dist/lib/components/Snackbar/Snackbar.css +1 -1
  200. package/dist/lib/components/Snackbar/Snackbar.js +19 -20
  201. package/dist/lib/components/Stepper/Stepper.css +1 -0
  202. package/dist/lib/components/Stepper/Stepper.d.ts +52 -0
  203. package/dist/lib/components/Stepper/Stepper.js +168 -0
  204. package/dist/lib/components/Stepper/StepperItem.css +1 -0
  205. package/dist/lib/components/Stepper/StepperItem.d.ts +57 -0
  206. package/dist/lib/components/Stepper/StepperItem.js +110 -0
  207. package/dist/lib/components/Stepper/img/separator-mobile.png +0 -0
  208. package/dist/lib/components/Stepper/img/separator-vertical.png +0 -0
  209. package/dist/lib/components/Stepper/img/separator.png +0 -0
  210. package/dist/lib/components/Switcher/Switcher.css +1 -1
  211. package/dist/lib/components/Switcher/Switcher.js +3 -2
  212. package/dist/lib/components/Tabs/Tabs.css +1 -1
  213. package/dist/lib/components/Tabs/Tabs.d.ts +2 -0
  214. package/dist/lib/components/Tabs/Tabs.js +64 -55
  215. package/dist/lib/components/TextField/TextField.css +1 -1
  216. package/dist/lib/components/TextField/TextField.d.ts +2 -2
  217. package/dist/lib/components/TextField/TextField.js +16 -9
  218. package/dist/lib/components/Tile/Tile.d.ts +2 -0
  219. package/dist/lib/components/Tile/Tile.js +3 -1
  220. package/dist/lib/components/Tooltip/Tooltip.js +5 -3
  221. package/dist/lib/components/UploadForm/UploadField/UploadField.css +1 -1
  222. package/dist/lib/components/UploadForm/UploadField/UploadField.d.ts +3 -0
  223. package/dist/lib/components/UploadForm/UploadField/UploadField.js +8 -2
  224. package/dist/lib/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.css +1 -1
  225. package/dist/lib/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.d.ts +2 -0
  226. package/dist/lib/components/UploadForm/UploadField/components/_UploadFieldDropArea/UploadFieldDropArea.js +9 -2
  227. package/dist/lib/components/UploadForm/UploadFileItem/UploadFileItem.css +1 -1
  228. package/dist/lib/components/UploadForm/UploadFileItem/UploadFileItem.js +3 -4
  229. package/dist/lib/components/UploadForm/UploadFileItem/components/_UploadFileItemIcon/UploadFileItemIcon.js +6 -0
  230. package/dist/lib/hooks/useResolution.js +15 -23
  231. package/dist/lib/index.d.ts +3 -0
  232. package/dist/lib/index.js +21 -0
  233. package/package.json +5 -5
  234. package/styles/base.scss +54 -0
@@ -68,7 +68,7 @@ export type TextFieldProps = {
68
68
  customIcon?: JSX.Element;
69
69
  /** Маска для поля. Не работает с textarea=true. */
70
70
  /** Дополнительную информацию можно найти на https://github.com/sanniassin/react-input-mask */
71
- mask?: string;
71
+ mask?: string | Array<string | RegExp>;
72
72
  /** Разделение символов для маски. Не работает textarea=true */
73
73
  maskChar?: string;
74
74
  /** Дополнительный класс корневого элемента */
@@ -104,7 +104,7 @@ export type TextFieldProps = {
104
104
  /** Обработчик изменения значения */
105
105
  onChange?: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
106
106
  /** Обработчик изменения значения маскированного инпута до обработки маской */
107
- onBeforeMaskChange?: (value: string, newState: IMaskState, oldState: IMaskState) => void;
107
+ onBeforeMaskChange?: (value: string, newState: IMaskState, oldState: IMaskState, currentState: IMaskState) => void;
108
108
  /** Обработчик выхода из фокуса */
109
109
  onBlur?: (e: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
110
110
  /** Обработчик входа в фокус */
@@ -20,37 +20,43 @@ var Hide = function Hide(props) {
20
20
  return /*#__PURE__*/React.createElement("svg", _extends({
21
21
  viewBox: "0 0 32 32"
22
22
  }, props), /*#__PURE__*/React.createElement("path", {
23
- d: "M5.82 17.45l-1.65 2.31L5.8 21l1.65-2.3a15.9 15.9 0 002.67 1.3l-.87 2.71 1.92.63.86-2.7a15.64 15.64 0 003 .48V24h2v-2.84a15.64 15.64 0 003-.48l.86 2.7 1.92-.63-.93-2.75a15.9 15.9 0 002.67-1.38L26.2 21l1.63-1.2-1.65-2.31a16.16 16.16 0 001.82-1.8l-1.51-1.35a13.8 13.8 0 01-21 0L4 15.69a16.15 16.15 0 001.82 1.76zM23 11.92l1-1.77a16 16 0 00-16 0l1 1.77a14 14 0 0114 0z"
23
+ fillRule: "evenodd",
24
+ clipRule: "evenodd",
25
+ d: "M23.036 7.588c.553-.55 1.45-.55 2.004 0a1.4 1.4 0 01-.001 1.99l-1.221 1.21c.464.367.907.771 1.324 1.213l2.306 2.441c.74.784.736 1.995-.01 2.774l-2.335 2.437c-3.536 3.69-8.827 4.73-13.353 3.123l-1.646 1.636c-.553.55-1.45.55-2.003 0a1.401 1.401 0 010-1.99L23.036 7.588zm-7.865 11.79c.268.054.545.084.83.084 2.339 0 4.235-1.884 4.235-4.208 0-.282-.03-.558-.083-.824l-4.982 4.949z"
26
+ }), /*#__PURE__*/React.createElement("path", {
27
+ d: "M6.832 12c3.113-3.295 7.619-4.511 11.76-3.65l-2.719 2.699c-2.238.065-4.04 1.855-4.105 4.079L7.06 19.806a12.697 12.697 0 01-.168-.172l-2.334-2.448a2.005 2.005 0 01-.007-2.771l2.28-2.414z"
24
28
  }));
25
29
  };
26
30
  var Show = function Show(props) {
27
31
  return /*#__PURE__*/React.createElement("svg", _extends({
28
32
  viewBox: "0 0 32 32"
29
33
  }, props), /*#__PURE__*/React.createElement("path", {
30
- d: "M26 11.69l1.73-2-1.49-1.34-1.82 2.15a15.67 15.67 0 00-2.59-1.34l1.1-2.8-1.86-.73-1.14 2.9A15.53 15.53 0 0017 8.07V5h-2v3.07a15.53 15.53 0 00-2.93.47l-1.14-2.9-1.86.73 1.1 2.8a15.67 15.67 0 00-2.59 1.33L5.76 8.35l-1.52 1.3 1.73 2A19.78 19.78 0 004 13.5L5.46 15A13.72 13.72 0 0116 10a13.55 13.55 0 0110.52 5L28 13.5a19.78 19.78 0 00-2-1.81z"
34
+ fillRule: "evenodd",
35
+ clipRule: "evenodd",
36
+ d: "M6.833 12.31c4.936-5.08 13.373-5.08 18.31 0l2.305 2.373a1.91 1.91 0 01-.01 2.698l-2.335 2.369c-4.933 5.007-13.287 4.999-18.209-.019l-2.335-2.38a1.91 1.91 0 01-.007-2.693l2.28-2.348zM16 10.45a5.55 5.55 0 100 11.101 5.55 5.55 0 000-11.101z"
31
37
  }), /*#__PURE__*/React.createElement("path", {
32
- d: "M20 16a4 4 0 10-4 4 4 4 0 004-4zm-6 0a2 2 0 112 2 2 2 0 01-2-2z"
38
+ d: "M18.824 13.273c0 .753-.633 1.364-1.412 1.364-.78 0-1.412-.611-1.412-1.364 0-.753.632-1.364 1.412-1.364.78 0 1.412.61 1.412 1.364z"
33
39
  }));
34
40
  };
35
41
  var ClearIcon = function ClearIcon(props) {
36
42
  return /*#__PURE__*/React.createElement("svg", _extends({
37
43
  viewBox: "0 0 32 32"
38
44
  }, props), /*#__PURE__*/React.createElement("path", {
39
- className: "ClearIcon__st0",
40
- d: "M16 14.5L11.5 10 10 11.5l4.5 4.5-4.5 4.5 1.5 1.5 4.5-4.5 4.5 4.5 1.5-1.5-4.5-4.5 4.5-4.5-1.5-1.5-4.5 4.5z"
45
+ d: "M9.405 9.402a1.558 1.558 0 012.201 0l4.348 4.344 4.337-4.333a1.555 1.555 0 112.201 2.2l-4.338 4.331 4.339 4.335a1.555 1.555 0 11-2.201 2.2l-4.34-4.336-4.348 4.346a1.554 1.554 0 11-2.2-2.2l4.348-4.344L9.405 11.6a1.554 1.554 0 010-2.2z"
41
46
  }));
42
47
  };
43
48
  var CheckedIcon = function CheckedIcon(props) {
44
49
  return /*#__PURE__*/React.createElement("svg", _extends({
45
50
  viewBox: "0 0 32 32"
46
51
  }, props), /*#__PURE__*/React.createElement("path", {
47
- d: "M22.2 9l-7.8 9.4-3.6-3.7L9 16.5c3.6 3.7 5.4 5.5 5.5 5.5.1 0 3.3-3.8 9.5-11.3L22.2 9z"
52
+ d: "M11.033 15.1l3.39 3.39 6.817-6.742c.578-.572 1.483-.595 2.02-.051.538.544.504 1.449-.075 2.021l-7.858 7.773c-.576.57-1.476.595-2.015.056L8.95 17.185c-.54-.541-.512-1.446.063-2.021.576-.576 1.48-.604 2.021-.063z"
48
53
  }));
49
54
  };
50
55
  var ResizeIcon = function ResizeIcon(props) {
51
56
  return /*#__PURE__*/React.createElement("svg", _extends({
52
57
  width: 12,
53
- height: 12
58
+ height: 12,
59
+ viewBox: "0 0 12 12"
54
60
  }, props), /*#__PURE__*/React.createElement("path", {
55
61
  d: "M1 11L11 1M7 11l4-4"
56
62
  }));
@@ -307,8 +313,9 @@ var TextField = function TextField(_ref) {
307
313
  }, [onBlur, clickedElement]);
308
314
  var handleBeforeMaskChange = useCallback(function (_ref2) {
309
315
  var previousState = _ref2.previousState,
310
- nextState = _ref2.nextState;
311
- return onBeforeMaskChange === null || onBeforeMaskChange === void 0 ? void 0 : onBeforeMaskChange(nextState.enteredString, nextState, previousState);
316
+ nextState = _ref2.nextState,
317
+ currentState = _ref2.currentState;
318
+ return onBeforeMaskChange === null || onBeforeMaskChange === void 0 ? void 0 : onBeforeMaskChange(nextState.enteredString, nextState, previousState, currentState);
312
319
  }, [onBeforeMaskChange]);
313
320
  var textareaType = textarea === TextareaTypes.FLEXIBLE ? TextareaTypes.FLEXIBLE : TextareaTypes.FIXED;
314
321
  var commonParams = _extends(_extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input)), {
@@ -26,6 +26,8 @@ export declare const ShadowLevel: {
26
26
  };
27
27
  type ShadowLevelType = (typeof ShadowLevel)[keyof typeof ShadowLevel];
28
28
  export interface ITileProps {
29
+ /** Индекс для навигации через tab */
30
+ tabIndex?: number;
29
31
  /** Ссылка */
30
32
  href?: string;
31
33
  /** Атрибут для открытия ссылки */
@@ -25,7 +25,8 @@ export var ShadowLevel = {
25
25
  };
26
26
  var cn = cnCreate('mfui-9-tile');
27
27
  var Tile = function Tile(_ref) {
28
- var href = _ref.href,
28
+ var tabIndex = _ref.tabIndex,
29
+ href = _ref.href,
29
30
  children = _ref.children,
30
31
  className = _ref.className,
31
32
  _ref$theme = _ref.theme,
@@ -57,6 +58,7 @@ var Tile = function Tile(_ref) {
57
58
  pointer: isPointer,
58
59
  interactive: isInteractive
59
60
  }, className),
61
+ tabIndex: tabIndex,
60
62
  onClick: handleClick
61
63
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), href && /*#__PURE__*/React.createElement("a", {
62
64
  href: href,
@@ -12,13 +12,14 @@ var RightArrow = function RightArrow(props) {
12
12
  return /*#__PURE__*/React.createElement("svg", _extends({
13
13
  viewBox: "0 0 20 20"
14
14
  }, props), /*#__PURE__*/React.createElement("path", {
15
- d: "M8 13l3-3-3-3 1-1 4 4-4 4z"
15
+ d: "M10.084 5.282a1 1 0 011.414.022l3.61 3.726c.522.54.523 1.4 0 1.94l-3.61 3.726a1 1 0 01-1.436-1.392l2.225-2.297H5.5a1 1 0 010-2h6.8l-2.239-2.31a1 1 0 01.023-1.415z"
16
16
  }));
17
17
  };
18
18
  var ArrowWithContour = function ArrowWithContour(props) {
19
19
  return /*#__PURE__*/React.createElement("svg", _extends({
20
20
  width: 32,
21
- height: 12
21
+ height: 12,
22
+ viewBox: "0 0 32 12"
22
23
  }, props), /*#__PURE__*/React.createElement("path", {
23
24
  fillRule: "evenodd",
24
25
  clipRule: "evenodd",
@@ -32,7 +33,8 @@ var ArrowWithContour = function ArrowWithContour(props) {
32
33
  var Arrow = function Arrow(props) {
33
34
  return /*#__PURE__*/React.createElement("svg", _extends({
34
35
  width: 42,
35
- height: 12
36
+ height: 12,
37
+ viewBox: "0 0 42 12"
36
38
  }, props), /*#__PURE__*/React.createElement("path", {
37
39
  fillRule: "evenodd",
38
40
  clipRule: "evenodd",
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-upload-field{-webkit-box-sizing:border-box;box-sizing:border-box;max-width:455px;position:relative;width:100%}.mfui-9-upload-field__input{border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;clip:rect(0 0 0 0);clip-path:inset(100%)}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-9-upload-field{-webkit-box-sizing:border-box;box-sizing:border-box;max-width:455px;position:relative;width:100%}.mfui-9-upload-field__input{border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;clip:rect(0 0 0 0);clip-path:inset(100%)}.mfui-9-upload-field__error-text{color:var(--fury);font-size:12px;line-height:18px;margin-top:4px}
@@ -5,6 +5,8 @@ export interface IUploadDropField {
5
5
  className?: string;
6
6
  /** Обязательность поля */
7
7
  required?: boolean;
8
+ /** Ошибка обязательности заполнения поля */
9
+ requiredError?: string | null;
8
10
  /** Заблокированное состояние */
9
11
  disabled?: boolean;
10
12
  /** Действие при выборе файла */
@@ -18,6 +20,7 @@ export interface IUploadDropField {
18
20
  root?: Record<string, string>;
19
21
  input?: Record<string, string>;
20
22
  dropArea?: Record<string, string>;
23
+ errorText?: Record<string, string>;
21
24
  };
22
25
  }
23
26
  declare const UploadField: React.FC<IUploadDropField>;
@@ -15,6 +15,7 @@ var UploadField = function UploadField(_ref) {
15
15
  _ref$disabled = _ref.disabled,
16
16
  disabled = _ref$disabled === void 0 ? false : _ref$disabled,
17
17
  accept = _ref.accept,
18
+ requiredError = _ref.requiredError,
18
19
  onChange = _ref.onChange,
19
20
  description = _ref.description,
20
21
  dataAttrs = _ref.dataAttrs;
@@ -34,7 +35,9 @@ var UploadField = function UploadField(_ref) {
34
35
  inputRef.current.click();
35
36
  }, []);
36
37
  return /*#__PURE__*/React.createElement("div", _extends({
37
- className: cn([className])
38
+ className: cn({
39
+ error: !!requiredError
40
+ }, [className])
38
41
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("input", _extends({
39
42
  className: cn('input')
40
43
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input), {
@@ -45,6 +48,7 @@ var UploadField = function UploadField(_ref) {
45
48
  onChange: handleInputChange,
46
49
  disabled: disabled
47
50
  })), /*#__PURE__*/React.createElement(UploadFieldDropArea, {
51
+ isRequiredError: !!requiredError,
48
52
  description: description,
49
53
  required: required,
50
54
  disabled: disabled,
@@ -53,6 +57,8 @@ var UploadField = function UploadField(_ref) {
53
57
  dataAttrs: {
54
58
  root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.dropArea
55
59
  }
56
- }));
60
+ }), !!requiredError && /*#__PURE__*/React.createElement("div", _extends({
61
+ className: cn('error-text')
62
+ }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.errorText)), requiredError));
57
63
  };
58
64
  export default UploadField;
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-upload-field-drop-area{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px dashed var(--spbSky2);border-radius:16px;padding:12px 32px 20px;width:100%}.mfui-9-upload-field-drop-area__upload-icon{height:40px;width:40px;fill:var(--spbSky3)}.mfui-9-upload-field-drop-area__content{text-align:center}.mfui-9-upload-field-drop-area__select-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--brandGreen);cursor:pointer;display:inline-block;font-family:inherit;font-weight:500;margin-right:4px;outline:none;padding:0;text-align:center;text-decoration:none}.mfui-9-upload-field-drop-area__description{color:var(--spbSky3);font-size:12px;font-weight:400;line-height:18px;list-style:none;margin:0;padding:0;text-align:center}.mfui-9-upload-field-drop-area__description-item{margin:0;padding:0}.mfui-9-upload-field-drop-area__select-button:focus,.mfui-9-upload-field-drop-area__select-button:hover{color:var(--buttonHoverGreen)}.mfui-9-upload-field-drop-area__mark{color:var(--fury)}.mfui-9-upload-field-drop-area_dragging{border-color:var(--brandGreen)}.mfui-9-upload-field-drop-area_dragging *{pointer-events:none}.mfui-9-upload-field-drop-area_disabled{background-color:var(--spbSky0);color:var(--spbSky3)}.mfui-9-upload-field-drop-area_disabled .mfui-9-upload-field-drop-area__select-button{color:var(--spbSky3);cursor:not-allowed}.mfui-9-upload-field-drop-area_disabled .mfui-9-upload-field-drop-area__mark{color:var(--spbSky3)}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-9-upload-field-drop-area{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:8px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:1px dashed var(--spbSky2);border-radius:24px;padding:12px 32px 20px;width:100%}.mfui-9-upload-field-drop-area__upload-icon{height:40px;width:40px;fill:var(--spbSky3)}.mfui-9-upload-field-drop-area__content{text-align:center}.mfui-9-upload-field-drop-area__select-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;border-radius:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--brandGreen);cursor:pointer;display:inline-block;font-family:inherit;font-weight:500;margin-right:4px;outline:none;padding:0;text-align:center;text-decoration:none}.mfui-9-upload-field-drop-area__description{color:var(--spbSky3);font-size:12px;font-weight:400;line-height:18px;list-style:none;margin:0;padding:0;text-align:center}.mfui-9-upload-field-drop-area__description-item{margin:0;padding:0}.mfui-9-upload-field-drop-area__select-button:focus,.mfui-9-upload-field-drop-area__select-button:hover{color:var(--buttonHoverGreen)}.mfui-9-upload-field-drop-area__mark{color:var(--fury)}.mfui-9-upload-field-drop-area_dragging{border-color:var(--brandGreen)}.mfui-9-upload-field-drop-area_dragging *{pointer-events:none}.mfui-9-upload-field-drop-area_error:not(.mfui-9-upload-field-drop-area_dragging){border-color:var(--fury)}.mfui-9-upload-field-drop-area_error:not(.mfui-9-upload-field-drop-area_dragging) .mfui-9-upload-field-drop-area__upload-icon{fill:var(--fury)}.mfui-9-upload-field-drop-area_disabled{background-color:var(--spbSky0);color:var(--spbSky3)}.mfui-9-upload-field-drop-area_disabled .mfui-9-upload-field-drop-area__select-button{color:var(--spbSky3);cursor:not-allowed}.mfui-9-upload-field-drop-area_disabled .mfui-9-upload-field-drop-area__mark{color:var(--spbSky3)}
@@ -5,6 +5,8 @@ export interface IUploadFieldDropArea {
5
5
  description?: string | string[];
6
6
  /** Обязательность поля */
7
7
  required: boolean;
8
+ /** Ошибка обязательности заполнения поля */
9
+ isRequiredError: boolean;
8
10
  /** Заблокированное состояние */
9
11
  disabled: boolean;
10
12
  /** Обработчик события 'drop' */
@@ -11,7 +11,11 @@ var CloudUpload = function CloudUpload(props) {
11
11
  return /*#__PURE__*/React.createElement("svg", _extends({
12
12
  viewBox: "0 0 40 40"
13
13
  }, props), /*#__PURE__*/React.createElement("path", {
14
- d: "M19 36V22l-2.38 3.9-1.71-1L19 18h1.88l4.14 6.85-1.71 1L21 22v14zM8.21 32H14v-2H8.21A4.27 4.27 0 014 25.6a4.27 4.27 0 014.21-4.4h2.07V18a9.94 9.94 0 019.66-10 9.94 9.94 0 019.66 10v1h1a5.49 5.49 0 010 11H26v2h4.6a7.49 7.49 0 001-14.91A11.94 11.94 0 0019.94 6 11.94 11.94 0 008.27 18v1.16h-.06A6.27 6.27 0 002 25.6 6.27 6.27 0 008.21 32z"
14
+ fillRule: "evenodd",
15
+ clipRule: "evenodd",
16
+ d: "M19.28 24.394a.93.93 0 011.424 0l2.822 3.337c.526.622.094 1.59-.712 1.59h-.947v2.44c0 1.06-.84 1.92-1.876 1.92-1.037 0-1.88-.86-1.88-1.92v-2.44h-.942a.933.933 0 01-.89-.655c-.003-.01-.01-.02-.013-.03a1.01 1.01 0 01-.038-.235.955.955 0 01.228-.67l2.823-3.337z"
17
+ }), /*#__PURE__*/React.createElement("path", {
18
+ d: "M19.011 8.68c3.733 0 6.898 2.484 8.013 5.926.47-.094.956-.144 1.454-.144 4.154 0 7.522 3.436 7.522 7.677 0 4.24-3.368 7.678-7.522 7.678-.86 0-1.719.004-2.578.01-.293 0-.483-.322-.396-.601a2.876 2.876 0 00-.554-2.752l-2.821-3.336a2.784 2.784 0 00-4.052-.235l-.22.233-2.824 3.337a2.873 2.873 0 00-.552 2.756c.088.279-.1.6-.393.6H9.344v-.018C6.367 29.653 4 27.141 4 24.061c0-3.18 2.526-5.758 5.642-5.758.337 0 .667.03.989.088a8.959 8.959 0 01-.063-1.058c0-4.779 3.78-8.652 8.443-8.652z"
15
19
  }));
16
20
  };
17
21
  var cn = cnCreate('mfui-9-upload-field-drop-area');
@@ -19,6 +23,8 @@ var UploadFieldDropArea = function UploadFieldDropArea(_ref) {
19
23
  var description = _ref.description,
20
24
  required = _ref.required,
21
25
  disabled = _ref.disabled,
26
+ _ref$isRequiredError = _ref.isRequiredError,
27
+ isRequiredError = _ref$isRequiredError === void 0 ? false : _ref$isRequiredError,
22
28
  onDrop = _ref.onDrop,
23
29
  onSelectButtonClick = _ref.onSelectButtonClick,
24
30
  dataAttrs = _ref.dataAttrs;
@@ -48,7 +54,8 @@ var UploadFieldDropArea = function UploadFieldDropArea(_ref) {
48
54
  return /*#__PURE__*/React.createElement("div", _extends({
49
55
  className: cn({
50
56
  disabled: disabled,
51
- dragging: isDragging
57
+ dragging: isDragging,
58
+ error: isRequiredError
52
59
  }),
53
60
  ref: dropAreaRef
54
61
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement(CloudUpload, {
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-upload-file-item{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;border-color:var(--spbSky1);border-radius:16px;border-style:solid;border-width:1px;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:455px;padding:12px;width:100%}.mfui-9-upload-file-item__file-icon-box{-ms-flex-negative:0;flex-shrink:0;height:32px;margin-top:5px;width:32px}.mfui-9-upload-file-item__cancel-icon-box,.mfui-9-upload-file-item__download-icon-box{display:block;-ms-flex-negative:0;border:none;border-radius:50%;cursor:pointer;flex-shrink:0;height:32px;margin-top:5px;padding:0;width:32px}.mfui-9-upload-file-item__cancel-icon-box svg,.mfui-9-upload-file-item__download-icon-box svg{fill:var(--spbSky3)}.mfui-9-upload-file-item__cancel-icon-box{background-color:var(--spbSky0)}.mfui-9-upload-file-item__cancel-icon-box:hover{background-color:var(--spbSky1)}.mfui-9-upload-file-item__cancel-icon-box:active{background-color:var(--spbSky2)}.mfui-9-upload-file-item__download-icon-box:hover svg{fill:var(--buttonHoverGreen)}.mfui-9-upload-file-item__icon{height:100%;width:100%}.mfui-9-upload-file-item__content{display:grid;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;grid-template-columns:auto -webkit-min-content;grid-template-columns:auto min-content;grid-template-rows:auto auto}.mfui-9-upload-file-item__name{font-size:15px;font-weight:500;grid-column:1;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.mfui-9-upload-file-item__description{color:var(--spbSky3);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:12px;font-weight:400;gap:4px;grid-column:1;grid-row:2;line-height:18px}.mfui-9-upload-file-item__progress-bar{background-color:var(--spbSky1);border-radius:2px;grid-column:1/span 2;height:4px;margin-top:12px;width:100%}.mfui-9-upload-file-item__download-icon-box{grid-column:2;grid-row:1/span 2;margin-right:-4px}.mfui-9-upload-file-item__progress-bar-fill{background-color:var(--brandGreen);border-radius:2px;height:100%;-webkit-transition:width .3s ease;transition:width .3s ease;width:0}.mfui-9-upload-file-item__service-message{color:var(--content)}.mfui-9-upload-file-item__error-message{color:var(--fury);cursor:pointer;-webkit-text-decoration-color:var(--fury);text-decoration-color:var(--fury);-webkit-text-decoration-line:underline;text-decoration-line:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted;text-underline-offset:2px}.mfui-9-upload-file-item__error-tooltip{font-size:15px;font-weight:500;line-height:24px;max-width:260px}.mfui-9-upload-file-item_error{border-color:var(--fury20)}.mfui-9-upload-file-item_disabled{background-color:var(--spbSky0);border-color:var(--spbSky0);color:var(--spbSky3);pointer-events:none}.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__progress-bar-fill{background-color:var(--spbSky2)}.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__error-message,.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__service-message{color:var(--spbSky3)}.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__cancel-icon-box,.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__download-icon-box,.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__file-icon-box{opacity:.4}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-9-upload-file-item{display:-webkit-box;display:-ms-flexbox;display:flex;gap:12px;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;border-color:var(--spbSky1);border-radius:24px;border-style:solid;border-width:1px;-webkit-box-sizing:border-box;box-sizing:border-box;max-width:455px;padding:12px;width:100%}.mfui-9-upload-file-item__file-icon-box{-ms-flex-negative:0;flex-shrink:0;height:32px;margin-top:5px;width:32px}.mfui-9-upload-file-item__cancel-icon-box,.mfui-9-upload-file-item__download-icon-box{display:block;-ms-flex-negative:0;border:none;border-radius:12px;cursor:pointer;flex-shrink:0;height:32px;margin-top:5px;padding:0;width:32px}.mfui-9-upload-file-item__cancel-icon-box svg,.mfui-9-upload-file-item__download-icon-box svg{fill:var(--spbSky3)}.mfui-9-upload-file-item__cancel-icon-box{background-color:var(--spbSky0)}.mfui-9-upload-file-item__cancel-icon-box:hover{background-color:var(--spbSky1)}.mfui-9-upload-file-item__cancel-icon-box:active{background-color:var(--spbSky2)}.mfui-9-upload-file-item__download-icon-box:hover svg{fill:var(--buttonHoverGreen)}.mfui-9-upload-file-item__icon{height:100%;width:100%}.mfui-9-upload-file-item__content{display:grid;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;grid-template-columns:auto -webkit-min-content;grid-template-columns:auto min-content;grid-template-rows:auto auto}.mfui-9-upload-file-item__name{font-size:15px;font-weight:500;grid-column:1;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.mfui-9-upload-file-item__description{color:var(--spbSky3);display:-webkit-box;display:-ms-flexbox;display:flex;font-size:12px;font-weight:400;gap:4px;grid-column:1;grid-row:2;line-height:18px}.mfui-9-upload-file-item__progress-bar{background-color:var(--spbSky1);border-radius:2px;grid-column:1/span 2;height:4px;margin-top:12px;width:100%}.mfui-9-upload-file-item__download-icon-box{grid-column:2;grid-row:1/span 2;margin-right:-4px}.mfui-9-upload-file-item__progress-bar-fill{background-color:var(--brandGreen);border-radius:2px;height:100%;-webkit-transition:width .3s ease;transition:width .3s ease;width:0}.mfui-9-upload-file-item__service-message{color:var(--content)}.mfui-9-upload-file-item__error-message{color:var(--fury);cursor:pointer;-webkit-text-decoration-color:var(--fury);text-decoration-color:var(--fury);-webkit-text-decoration-line:underline;text-decoration-line:underline;-webkit-text-decoration-style:dotted;text-decoration-style:dotted;text-underline-offset:2px}.mfui-9-upload-file-item__error-tooltip{font-size:15px;font-weight:500;line-height:24px;max-width:260px}.mfui-9-upload-file-item_error{border-color:var(--fury20)}.mfui-9-upload-file-item_disabled{background-color:var(--spbSky0);border-color:var(--spbSky0);color:var(--spbSky3);pointer-events:none}.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__progress-bar-fill{background-color:var(--spbSky2)}.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__error-message,.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__service-message{color:var(--spbSky3)}.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__cancel-icon-box,.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__download-icon-box,.mfui-9-upload-file-item_disabled .mfui-9-upload-file-item__file-icon-box{opacity:.4}
@@ -10,17 +10,16 @@ var DownloadIcon = function DownloadIcon(props) {
10
10
  return /*#__PURE__*/React.createElement("svg", _extends({
11
11
  viewBox: "0 0 32 32"
12
12
  }, props), /*#__PURE__*/React.createElement("path", {
13
- d: "M15.04 5.99L14.97 17l-1.26-1.49-1.42 1.41L15.37 20h1.26l3.08-3.08-1.42-1.41-1.32 1.55.07-11.05-2-.02z"
13
+ d: "M26.4 14.507a1.6 1.6 0 011.601 1.6c0 1.5-.318 2.984-.93 4.363a11.295 11.295 0 01-2.625 3.67 12.08 12.08 0 01-3.888 2.427 12.67 12.67 0 01-9.115 0 12.083 12.083 0 01-3.888-2.427 11.295 11.295 0 01-2.625-3.67A10.75 10.75 0 014 16.107a1.6 1.6 0 113.2 0c0 1.048.22 2.09.653 3.065a8.097 8.097 0 001.884 2.63 8.881 8.881 0 002.86 1.78 9.453 9.453 0 003.403.631 9.45 9.45 0 003.402-.63 8.883 8.883 0 002.86-1.782 8.096 8.096 0 001.883-2.629 7.55 7.55 0 00.655-3.065 1.6 1.6 0 011.6-1.6z"
14
14
  }), /*#__PURE__*/React.createElement("path", {
15
- d: "M8 17H6a10 10 0 0020 0h-2a8 8 0 01-16 0z"
15
+ d: "M16 6.418a1.6 1.6 0 011.6 1.6v5.813l2.062-2.085a1.6 1.6 0 012.275 2.25l-4.231 4.278-.183.167a2.4 2.4 0 01-3.047 0l-.183-.167-4.23-4.278a1.6 1.6 0 112.275-2.25L14.4 13.83V8.018a1.6 1.6 0 011.6-1.6z"
16
16
  }));
17
17
  };
18
18
  var CancelIcon = function CancelIcon(props) {
19
19
  return /*#__PURE__*/React.createElement("svg", _extends({
20
20
  viewBox: "0 0 32 32"
21
21
  }, props), /*#__PURE__*/React.createElement("path", {
22
- className: "CancelIcon__st0",
23
- d: "M16 14.5L11.5 10 10 11.5l4.5 4.5-4.5 4.5 1.5 1.5 4.5-4.5 4.5 4.5 1.5-1.5-4.5-4.5 4.5-4.5-1.5-1.5-4.5 4.5z"
22
+ d: "M9.405 9.402a1.558 1.558 0 012.201 0l4.348 4.344 4.337-4.333a1.555 1.555 0 112.201 2.2l-4.338 4.331 4.339 4.335a1.555 1.555 0 11-2.201 2.2l-4.34-4.336-4.348 4.346a1.554 1.554 0 11-2.2-2.2l4.348-4.344L9.405 11.6a1.554 1.554 0 010-2.2z"
24
23
  }));
25
24
  };
26
25
  var MAX_PROGRESS = 100;
@@ -5,6 +5,7 @@ var AttachIcon = function AttachIcon(props) {
5
5
  return /*#__PURE__*/React.createElement("svg", _extends({
6
6
  width: 32,
7
7
  height: 32,
8
+ viewBox: "0 0 32 32",
8
9
  fill: "none"
9
10
  }, props), /*#__PURE__*/React.createElement("path", {
10
11
  d: "M25.538 8.297c-.944-.997-2.2-1.547-3.535-1.547-1.336 0-2.591.55-3.536 1.547l-7.881 8.325c-1.17 1.236-1.17 3.246 0 4.482a2.891 2.891 0 004.242 0l5.19-5.482c.39-.413.39-1.082 0-1.494a.963.963 0 00-1.414 0l-5.19 5.482a.964.964 0 01-1.414 0 1.1 1.1 0 010-1.494l7.881-8.325a2.902 2.902 0 012.122-.928c.8 0 1.554.33 2.12.928 1.17 1.236 1.17 3.246 0 4.481l-8.588 9.072c-1.95 2.06-5.121 2.06-7.07 0A5.4 5.4 0 017 19.61a5.4 5.4 0 011.464-3.735l8.589-9.072c.39-.412.39-1.081 0-1.494a.963.963 0 00-1.414 0L7.05 14.382C5.728 15.778 5 17.635 5 19.61c0 1.975.728 3.832 2.05 5.228C8.415 26.28 10.207 27 12 27c1.792 0 3.585-.72 4.95-2.162l8.588-9.072c1.95-2.06 1.95-5.41 0-7.469z",
@@ -15,6 +16,7 @@ var ExcelIcon = function ExcelIcon(props) {
15
16
  return /*#__PURE__*/React.createElement("svg", _extends({
16
17
  width: 32,
17
18
  height: 32,
19
+ viewBox: "0 0 32 32",
18
20
  fill: "none"
19
21
  }, props), /*#__PURE__*/React.createElement("path", {
20
22
  d: "M8 3a1 1 0 011-1h10v7H8V3z",
@@ -84,6 +86,7 @@ var ImageIcon = function ImageIcon(props) {
84
86
  return /*#__PURE__*/React.createElement("svg", _extends({
85
87
  width: 32,
86
88
  height: 32,
89
+ viewBox: "0 0 32 32",
87
90
  fill: "none"
88
91
  }, props), /*#__PURE__*/React.createElement("path", {
89
92
  d: "M5.21 2.058h21.578c1.74 0 3.154 1.508 3.154 3.366V26.58c0 1.855-1.414 3.362-3.154 3.362H5.21c-1.74 0-3.152-1.507-3.152-3.362V5.424c0-1.858 1.413-3.366 3.152-3.366zm6.7 5.181c-1.681 0-3.045 1.28-3.045 3.074 0 1.795 1.364 2.946 3.046 2.946 1.682 0 3.046-1.151 3.046-2.946 0-1.794-1.364-3.074-3.046-3.074zM6.2 26.832h19.165c.841 0 1.216-.65.836-1.45L21.758 15.13c-.378-.801-1.527-.713-2.038 0l-5.615 6.374c-.511.713-1.21.634-2.03.223l-2.811-1.493c-.408-.28-1.171-.544-1.654.191L5.55 25.5c-.481.736-.191 1.332.65 1.332z",
@@ -94,6 +97,7 @@ var PdfIcon = function PdfIcon(props) {
94
97
  return /*#__PURE__*/React.createElement("svg", _extends({
95
98
  width: 32,
96
99
  height: 32,
100
+ viewBox: "0 0 32 32",
97
101
  fill: "none"
98
102
  }, props), /*#__PURE__*/React.createElement("circle", {
99
103
  cx: 16,
@@ -111,6 +115,7 @@ var PowerIcon = function PowerIcon(props) {
111
115
  return /*#__PURE__*/React.createElement("svg", _extends({
112
116
  width: 32,
113
117
  height: 32,
118
+ viewBox: "0 0 32 32",
114
119
  fill: "none"
115
120
  }, props), /*#__PURE__*/React.createElement("circle", {
116
121
  cx: 17,
@@ -173,6 +178,7 @@ var WordIcon = function WordIcon(props) {
173
178
  return /*#__PURE__*/React.createElement("svg", _extends({
174
179
  width: 32,
175
180
  height: 32,
181
+ viewBox: "0 0 32 32",
176
182
  fill: "none"
177
183
  }, props), /*#__PURE__*/React.createElement("path", {
178
184
  d: "M8 3a1 1 0 011-1h20a1 1 0 011 1v6H8V3z",
@@ -1,21 +1,16 @@
1
1
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
2
2
  import * as React from 'react';
3
+ import throttle from 'lodash.throttle';
3
4
  var RESOLUTIONS;
4
5
  (function (RESOLUTIONS) {
5
- RESOLUTIONS[RESOLUTIONS["MOBILE_XS_END"] = 359] = "MOBILE_XS_END";
6
- RESOLUTIONS[RESOLUTIONS["MOBILE_END"] = 767] = "MOBILE_END";
6
+ RESOLUTIONS[RESOLUTIONS["MOBILE_XS_END"] = 360] = "MOBILE_XS_END";
7
+ RESOLUTIONS[RESOLUTIONS["MOBILE_END"] = 768] = "MOBILE_END";
7
8
  })(RESOLUTIONS || (RESOLUTIONS = {}));
8
9
  var _RESOLUTIONS = RESOLUTIONS,
9
10
  MOBILE_END = _RESOLUTIONS.MOBILE_END,
10
11
  MOBILE_XS_END = _RESOLUTIONS.MOBILE_XS_END;
11
- var MEDIA_QUERIES = {
12
- MAX_WIDTH_MOBILE_XS_END: "(max-width: ".concat(MOBILE_XS_END, "px)"),
13
- MAX_WIDTH_MOBILE_END: "(max-width: ".concat(MOBILE_END, "px)")
14
- };
15
- var MAX_WIDTH_MOBILE_XS_END = MEDIA_QUERIES.MAX_WIDTH_MOBILE_XS_END,
16
- MAX_WIDTH_MOBILE_END = MEDIA_QUERIES.MAX_WIDTH_MOBILE_END;
17
12
  var isScreenWidthAtMost = function isScreenWidthAtMost(maxWidth) {
18
- return typeof window !== 'undefined' ? window.innerWidth <= maxWidth : false;
13
+ return typeof window !== 'undefined' ? window.innerWidth < maxWidth : false;
19
14
  };
20
15
  function useResolution() {
21
16
  var _React$useState = React.useState(isScreenWidthAtMost(MOBILE_END)),
@@ -26,23 +21,20 @@ function useResolution() {
26
21
  _React$useState4 = _slicedToArray(_React$useState3, 2),
27
22
  isMobileExtraSmall = _React$useState4[0],
28
23
  setIsMobileExtraSmall = _React$useState4[1];
29
- var handleMediaChange = function handleMediaChange(updateStateFn) {
30
- return function (e) {
31
- return updateStateFn(e.matches);
32
- };
33
- };
34
- var handleMaxWidthMobileEnd = handleMediaChange(setIsMobile);
35
- var handleMaxWidthMobileExtraSmall = handleMediaChange(setIsMobileExtraSmall);
24
+ var handleResize = React.useMemo(function () {
25
+ return throttle(function () {
26
+ var width = window.innerWidth;
27
+ setIsMobile(width < MOBILE_END);
28
+ setIsMobileExtraSmall(width < MOBILE_XS_END);
29
+ }, 100);
30
+ }, []);
36
31
  React.useEffect(function () {
37
- var mobileExtraSmallQuery = window.matchMedia(MAX_WIDTH_MOBILE_XS_END);
38
- var mobileQuery = window.matchMedia(MAX_WIDTH_MOBILE_END);
39
- mobileExtraSmallQuery.addEventListener('change', handleMaxWidthMobileExtraSmall);
40
- mobileQuery.addEventListener('change', handleMaxWidthMobileEnd);
32
+ window.addEventListener('resize', handleResize);
41
33
  return function () {
42
- mobileExtraSmallQuery.removeEventListener('change', handleMaxWidthMobileExtraSmall);
43
- mobileQuery.removeEventListener('change', handleMaxWidthMobileEnd);
34
+ window.removeEventListener('resize', handleResize);
35
+ handleResize.cancel();
44
36
  };
45
- }, [handleMaxWidthMobileEnd, handleMaxWidthMobileExtraSmall]);
37
+ }, [handleResize]);
46
38
  return {
47
39
  isMobile: isMobile,
48
40
  isMobileExtraSmall: isMobileExtraSmall
@@ -57,6 +57,7 @@ export { default as RadioButton } from './components/RadioButton/RadioButton';
57
57
  export { default as Row } from './components/Row/Row';
58
58
  export { default as ScrollBar } from './components/ScrollBar/ScrollBar';
59
59
  export { default as Search } from './components/Search/Search';
60
+ export { default as SectionAccordionGroup } from './components/SectionAccordionGroup/SectionAccordionGroup';
60
61
  export { default as Select } from './components/Select/Select';
61
62
  export { default as Selector } from './components/Selector/Selector';
62
63
  export { default as selectReducer } from './components/Select/reducer/selectReducer';
@@ -68,6 +69,8 @@ export { default as slidesSettings } from './components/Banner/slidesSettings';
68
69
  export { default as Snackbar } from './components/Snackbar/Snackbar';
69
70
  export { default as SnackbarTimer } from './components/Snackbar/SnackbarTimer/SnackbarTimer';
70
71
  export { default as StatusBadge } from './components/Badges/StatusBadge/StatusBadge';
72
+ export { default as Stepper } from './components/Stepper/Stepper';
73
+ export { default as StepperItem } from './components/Stepper/StepperItem';
71
74
  export { default as Switcher } from './components/Switcher/Switcher';
72
75
  export { default as Tab } from './components/Tabs/Tab';
73
76
  export { default as Tabs } from './components/Tabs/Tabs';
package/dist/es/index.js CHANGED
@@ -57,6 +57,7 @@ export { default as RadioButton } from "./components/RadioButton/RadioButton";
57
57
  export { default as Row } from "./components/Row/Row";
58
58
  export { default as ScrollBar } from "./components/ScrollBar/ScrollBar";
59
59
  export { default as Search } from "./components/Search/Search";
60
+ export { default as SectionAccordionGroup } from "./components/SectionAccordionGroup/SectionAccordionGroup";
60
61
  export { default as Select } from "./components/Select/Select";
61
62
  export { default as Selector } from "./components/Selector/Selector";
62
63
  export { default as selectReducer } from "./components/Select/reducer/selectReducer";
@@ -68,6 +69,8 @@ export { default as slidesSettings } from "./components/Banner/slidesSettings";
68
69
  export { default as Snackbar } from "./components/Snackbar/Snackbar";
69
70
  export { default as SnackbarTimer } from "./components/Snackbar/SnackbarTimer/SnackbarTimer";
70
71
  export { default as StatusBadge } from "./components/Badges/StatusBadge/StatusBadge";
72
+ export { default as Stepper } from "./components/Stepper/Stepper";
73
+ export { default as StepperItem } from "./components/Stepper/StepperItem";
71
74
  export { default as Switcher } from "./components/Switcher/Switcher";
72
75
  export { default as Tab } from "./components/Tabs/Tab";
73
76
  export { default as Tabs } from "./components/Tabs/Tabs";
@@ -1 +1 @@
1
- h1,h2,h3,h4,h5{margin:0}.mfui-9-accordion{background:var(--spbSky0);border-radius:16px}.mfui-9-accordion+.mfui-9-accordion{margin-top:8px}@media screen and (min-width:768px){.mfui-9-accordion+.mfui-9-accordion{margin-top:12px}}.mfui-9-accordion__title-wrap{border-radius:inherit;cursor:pointer;outline:none;padding:16px 44px 16px 16px;position:relative;-webkit-transition:background-color .3s;transition:background-color .3s}@media screen and (min-width:768px){.mfui-9-accordion__title-wrap{padding:24px 56px 24px 24px}}.mfui-9-accordion__title-wrap:hover{background-color:var(--spbSky1)}@media screen and (max-width:1023px){.mfui-9-accordion__title-wrap:focus{background-color:inherit}}.mfui-9-accordion__icon-box{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;right:20px;top:50%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--stcWhite);border-radius:50%;height:24px;justify-content:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:24px}@media screen and (min-width:768px){.mfui-9-accordion__icon-box{height:32px;right:24px;width:32px}}.mfui-9-accordion__icon{height:20px;-webkit-transition:-webkit-transform .6s;transition:-webkit-transform .6s;transition:transform .6s;transition:transform .6s,-webkit-transform .6s;width:20px}@media screen and (min-width:768px){.mfui-9-accordion__icon{height:32px;width:32px}}.mfui-9-accordion__content-inner{padding:4px 20px 20px 16px}@media screen and (min-width:768px){.mfui-9-accordion__content-inner{padding:4px 24px 20px}}.mfui-9-accordion_opened .mfui-9-accordion__icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}
1
+ h1,h2,h3,h4,h5{margin:0}.mfui-9-accordion{background:var(--spbSky0);border-radius:16px}.mfui-9-accordion+.mfui-9-accordion{margin-top:8px}@media screen and (min-width:768px){.mfui-9-accordion+.mfui-9-accordion{margin-top:12px}}.mfui-9-accordion__title-wrap{border-radius:inherit;cursor:pointer;outline:none;padding:16px 44px 16px 16px;position:relative;-webkit-transition:background-color .3s;transition:background-color .3s}.mfui-9-accordion__title-wrap:focus-visible{-webkit-animation:focus-outline-shrink .3s linear forwards;animation:focus-outline-shrink .3s linear forwards;outline-offset:2px}@-webkit-keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}@keyframes focus-outline-shrink{0%{outline:0 solid var(--137C)}to{outline:4px solid var(--137C)}}.mfui-9-accordion__title-wrap:focus{outline:none}@media screen and (min-width:768px){.mfui-9-accordion__title-wrap{padding:24px 56px 24px 24px}}.mfui-9-accordion__title-wrap:hover{background-color:var(--spbSky1)}@media screen and (max-width:1023px){.mfui-9-accordion__title-wrap:focus{background-color:inherit}}.mfui-9-accordion__icon-box{display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;right:20px;top:50%;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--stcWhite);border-radius:50%;height:24px;justify-content:center;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:24px}@media screen and (min-width:768px){.mfui-9-accordion__icon-box{height:32px;right:24px;width:32px}}.mfui-9-accordion__icon{height:20px;-webkit-transition:-webkit-transform .6s;transition:-webkit-transform .6s;transition:transform .6s;transition:transform .6s,-webkit-transform .6s;width:20px}@media screen and (min-width:768px){.mfui-9-accordion__icon{height:32px;width:32px}}.mfui-9-accordion__content-inner{padding:4px 20px 20px 16px}@media screen and (min-width:768px){.mfui-9-accordion__content-inner{padding:4px 24px 20px}}.mfui-9-accordion_opened .mfui-9-accordion__icon{-webkit-transform:rotate(180deg);transform:rotate(180deg)}
@@ -18,9 +18,7 @@ var ArrowDown = function ArrowDown(props) {
18
18
  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
19
19
  viewBox: "0 0 32 32"
20
20
  }, props), /*#__PURE__*/React.createElement("path", {
21
- d: "M11 14h10l-5 6z",
22
- fillRule: "evenodd",
23
- clipRule: "evenodd"
21
+ d: "M16.774 18.697a1.092 1.092 0 01-1.51 0l-3.953-3.82c-.682-.66-.165-1.877.794-1.877h7.798c.96 0 1.465 1.217.783 1.876l-3.912 3.82z"
24
22
  }));
25
23
  };
26
24
  var cn = (0, _uiHelpers.cnCreate)('mfui-9-accordion');
@@ -15,8 +15,7 @@ var DefaultIcon = function DefaultIcon(props) {
15
15
  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
16
16
  viewBox: "0 0 20 20"
17
17
  }, props), /*#__PURE__*/React.createElement("path", {
18
- d: "M11.39 9H16v1l-7.5 8H7l1.61-7H4v-1l7.5-8H13z",
19
- fillRule: "evenodd"
18
+ d: "M9.478 2.094c.935-1.224 2.885-.413 2.678 1.112l-.587 4.33h2.947l.115.004c1.168.085 1.806 1.45 1.077 2.405l-6.07 7.961c-.93 1.22-2.875.423-2.681-1.098l.543-4.245H4.52c-1.242 0-1.945-1.423-1.192-2.41l6.15-8.06z"
20
19
  }));
21
20
  };
22
21
  var CounterBadgeColorTheme = exports.CounterBadgeColorTheme = {