@megafon/ui-core 3.5.0 → 3.5.3-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,36 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [3.5.3-beta.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@3.5.2...@megafon/ui-core@3.5.3-beta.0) (2022-04-13)
7
+
8
+ **Note:** Version bump only for package @megafon/ui-core
9
+
10
+
11
+
12
+
13
+
14
+ ## [3.5.2](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@3.5.1...@megafon/ui-core@3.5.2) (2022-04-13)
15
+
16
+ **Note:** Version bump only for package @megafon/ui-core
17
+
18
+
19
+
20
+
21
+
22
+ ## [3.5.1](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@3.5.0...@megafon/ui-core@3.5.1) (2022-04-11)
23
+
24
+
25
+ ### Bug Fixes
26
+
27
+ * **colors:** fix colors page; correct values for soft colors in dark theme ([81d1801](https://github.com/MegafonWebLab/megafon-ui/commit/81d18012234fa52ce0fdbff0de8de7dd2d6de8f5))
28
+ * **colors:** fix colors usage in components: Notification, Preloader, Tile and Card ([96d0eef](https://github.com/MegafonWebLab/megafon-ui/commit/96d0eef51458b35c5b69c1677ec6f4a22f7f130d))
29
+ * **search:** scroll highlighted item into users view ([5105863](https://github.com/MegafonWebLab/megafon-ui/commit/51058637a78598773e945b1f21eecbc319d7df78))
30
+ * **select:** scroll highlighted item into users view ([50860e8](https://github.com/MegafonWebLab/megafon-ui/commit/50860e82a557cd6dd2e89448740a13b6e25c8261))
31
+
32
+
33
+
34
+
35
+
6
36
  # [3.5.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-core@3.4.0...@megafon/ui-core@3.5.0) (2022-04-05)
7
37
 
8
38
 
@@ -18,6 +18,9 @@
18
18
  .colors__title {
19
19
  margin-bottom: 8px;
20
20
  }
21
+ .colors__title-note {
22
+ margin-bottom: 60px;
23
+ }
21
24
  .colors__group-title {
22
25
  margin-bottom: 24px;
23
26
  }
@@ -82,7 +85,8 @@
82
85
  }
83
86
  .colors__description {
84
87
  position: relative;
85
- padding-top: 15px;
88
+ padding-top: 11px;
89
+ color: var(--spbSky3);
86
90
  font-size: 12px;
87
91
  line-height: 18px;
88
92
  text-align: center;
@@ -16,7 +16,103 @@ import ColorItem from "./ColorItem/ColorItem";
16
16
  import colorsData from "./colorsData";
17
17
  import "./Colors.css";
18
18
 
19
- var Diagram = function Diagram(props) {
19
+ var DiagramDark = function DiagramDark(props) {
20
+ return /*#__PURE__*/React.createElement("svg", _extends({
21
+ viewBox: "0 0 260 261",
22
+ fill: "none"
23
+ }, props), /*#__PURE__*/React.createElement("mask", {
24
+ id: "DiagramDark__a",
25
+ style: {
26
+ maskType: 'alpha'
27
+ },
28
+ maskUnits: "userSpaceOnUse",
29
+ x: 0,
30
+ y: 0,
31
+ width: 260,
32
+ height: 261
33
+ }, /*#__PURE__*/React.createElement("path", {
34
+ fillRule: "evenodd",
35
+ clipRule: "evenodd",
36
+ d: "M130.491 260.678c71.526 0 129.509-58.19 129.509-129.972C260 58.925 202.017.734 130.491.734 58.965.734.981 58.924.981 130.706c0 71.782 57.984 129.972 129.51 129.972zm.216-22.279c59.477 0 107.693-48.215 107.693-107.693 0-59.477-48.216-107.693-107.693-107.693-59.478 0-107.694 48.216-107.694 107.693 0 59.478 48.216 107.693 107.694 107.693z",
37
+ fill: "#333"
38
+ })), /*#__PURE__*/React.createElement("g", {
39
+ mask: "url(#DiagramDark__a)"
40
+ }, /*#__PURE__*/React.createElement("path", {
41
+ d: "M75.979 13.036a129.498 129.498 0 01113.346 2.095L130.5 130.499 75.979 13.036z",
42
+ fill: "#314138"
43
+ }), /*#__PURE__*/React.createElement("path", {
44
+ d: "M189.067 15a129.507 129.507 0 0167.808 87.224L130.5 130.499l58.567-115.5z",
45
+ fill: "#35484A"
46
+ }), /*#__PURE__*/React.createElement("path", {
47
+ d: "M256.835 102.042a129.508 129.508 0 01-25.217 109.361L130.5 130.499l126.335-28.457z",
48
+ fill: "#2F2F3C"
49
+ }), /*#__PURE__*/React.createElement("path", {
50
+ d: "M231.817 211.153a129.497 129.497 0 01-101.043 48.846l-.274-129.5 101.317 80.654z",
51
+ fill: "#38273C"
52
+ }), /*#__PURE__*/React.createElement("path", {
53
+ d: "M130.5 259.999a129.505 129.505 0 01-101.147-48.632L130.5 130.499v129.5z",
54
+ fill: "#442B2D"
55
+ }), /*#__PURE__*/React.createElement("path", {
56
+ d: "M29.086 211.032A129.5 129.5 0 014.271 101.579l126.229 28.92-101.414 80.533z",
57
+ fill: "#422A26"
58
+ }), /*#__PURE__*/React.createElement("path", {
59
+ d: "M4.377 101.12a129.5 129.5 0 0171.422-88L130.5 130.498 4.377 101.12z",
60
+ fill: "#4A3D27"
61
+ })), /*#__PURE__*/React.createElement("path", {
62
+ d: "M85.367 33.023a107.695 107.695 0 0194.259 1.742l-48.919 95.941-45.34-97.683z",
63
+ fill: "#24804E"
64
+ }), /*#__PURE__*/React.createElement("path", {
65
+ d: "M179.411 34.656a107.695 107.695 0 0156.391 72.536l-105.095 23.514 48.704-96.05z",
66
+ fill: "#5B9DA3"
67
+ }), /*#__PURE__*/React.createElement("path", {
68
+ d: "M235.768 107.041a107.686 107.686 0 01-20.971 90.946l-84.09-67.281 105.061-23.665z",
69
+ fill: "#4B497C"
70
+ }), /*#__PURE__*/React.createElement("path", {
71
+ d: "M214.963 197.779a107.694 107.694 0 01-84.028 40.62l-.228-107.693 84.256 67.073z",
72
+ fill: "#5C2C64"
73
+ }), /*#__PURE__*/React.createElement("path", {
74
+ d: "M130.707 238.4a107.694 107.694 0 01-84.115-40.443l84.115-67.251V238.4z",
75
+ fill: "#CA3A43"
76
+ }), /*#__PURE__*/React.createElement("path", {
77
+ d: "M46.357 197.664a107.692 107.692 0 01-20.637-91.022l104.973 24.051-84.336 66.971z",
78
+ fill: "#B85B4A"
79
+ }), /*#__PURE__*/React.createElement("path", {
80
+ d: "M25.821 106.274a107.694 107.694 0 0159.396-73.182l45.49 97.614-104.886-24.432z",
81
+ fill: "#BC862E"
82
+ }), /*#__PURE__*/React.createElement("path", {
83
+ d: "M94.146 52.187a86.329 86.329 0 0175.559 1.397l-39.214 76.906-36.345-78.303z",
84
+ fill: "#00B956"
85
+ }), /*#__PURE__*/React.createElement("path", {
86
+ d: "M169.533 53.496a86.332 86.332 0 0145.202 58.146l-84.244 18.848 39.042-76.994z",
87
+ fill: "#5BD9E5"
88
+ }), /*#__PURE__*/React.createElement("path", {
89
+ d: "M214.708 111.52a86.325 86.325 0 01-16.81 72.903l-67.407-53.933 84.217-18.97z",
90
+ fill: "#444189"
91
+ }), /*#__PURE__*/React.createElement("path", {
92
+ d: "M198.031 184.256a86.331 86.331 0 01-67.358 32.561l-.182-86.327 67.54 53.766z",
93
+ fill: "#731982"
94
+ }), /*#__PURE__*/React.createElement("path", {
95
+ d: "M130.491 216.818a86.327 86.327 0 01-67.427-32.419l67.427-53.909v86.328z",
96
+ fill: "#F62434"
97
+ }), /*#__PURE__*/React.createElement("path", {
98
+ d: "M62.886 184.175a86.324 86.324 0 01-16.542-72.964l84.147 19.279-67.605 53.685z",
99
+ fill: "#EB5A40"
100
+ }), /*#__PURE__*/React.createElement("path", {
101
+ d: "M46.414 110.906a86.328 86.328 0 0147.612-58.664l36.465 78.248-84.077-19.584z",
102
+ fill: "#FFA717"
103
+ }), /*#__PURE__*/React.createElement("ellipse", {
104
+ cx: 130.491,
105
+ cy: 130.706,
106
+ rx: 60.429,
107
+ ry: 60.645,
108
+ fill: "#333"
109
+ }), /*#__PURE__*/React.createElement("path", {
110
+ d: "M125.234 15h3.832v-.569h-2.76l1.576-1.536c.704-.688 1.152-1.376 1.152-2.08 0-.984-.672-1.608-1.728-1.608-1.088 0-1.768.712-1.856 1.832h.648c.112-.896.544-1.272 1.208-1.272.648 0 1.024.384 1.024 1.024 0 .584-.304 1.104-.824 1.656l-2.272 2.392V15zm6.991.071c1.408 0 2.216-1.12 2.216-2.784v-.32c0-1.632-.824-2.76-2.232-2.76-1.4 0-2.256 1.088-2.256 2.776v.32c0 1.664.904 2.768 2.272 2.768zm0-.576c-.952 0-1.56-.752-1.56-2.2v-.32c0-1.408.576-2.208 1.544-2.208.968 0 1.528.864 1.528 2.192v.32c0 1.448-.512 2.216-1.512 2.216zM243.602 154.771l-.992 3.701.548.147.715-2.666 1.076 1.92c.482.858 1.031 1.469 1.711 1.651.95.255 1.727-.233 2-1.253.282-1.051-.23-1.892-1.289-2.267l-.168.626c.837.34 1.088.855.916 1.496-.168.626-.636.89-1.254.724-.564-.151-.988-.579-1.386-1.224l-1.723-2.814-.154-.041zm-1.879 6.734c-.365 1.36.508 2.43 2.115 2.861l.309.082c1.577.423 2.88-.081 3.244-1.441.362-1.352-.467-2.461-2.097-2.898l-.31-.083c-1.607-.43-2.907.157-3.261 1.479zm.556.149c.247-.92 1.13-1.313 2.529-.938l.309.083c1.36.364 1.984 1.128 1.733 2.063-.25.935-1.23 1.252-2.513.908l-.309-.082c-1.398-.375-2.008-1.068-1.749-2.034zM188.685 229.41l-3.369 1.826.271.5 2.426-1.316-.653 2.101c-.291.941-.357 1.759-.021 2.378.469.865 1.357 1.093 2.285.59.957-.519 1.215-1.469.759-2.495l-.57.309c.329.841.128 1.377-.456 1.694-.569.309-1.083.15-1.388-.412-.278-.514-.259-1.116-.065-1.849l.857-3.186-.076-.14zm-6.18 3.268c-1.238.672-1.414 2.041-.621 3.504l.153.281c.778 1.435 2.04 2.034 3.277 1.363 1.231-.667 1.465-2.032.66-3.516l-.152-.281c-.793-1.463-2.114-2.003-3.317-1.351zm.275.507c.837-.454 1.73-.083 2.42 1.19l.152.282c.671 1.237.546 2.215-.305 2.677-.851.461-1.755-.032-2.388-1.199l-.152-.281c-.69-1.273-.606-2.193.273-2.669zM83.243 236.09l-3.422-1.724-.256.507 2.465 1.242-2.099.662c-.938.298-1.647.711-1.964 1.34-.443.878-.123 1.738.82 2.213.971.49 1.899.16 2.481-.801l-.578-.292c-.503.75-1.058.892-1.651.593-.58-.291-.742-.804-.454-1.375.263-.522.768-.849 1.48-1.108l3.106-1.115.072-.142zm-6.21-3.21c-1.258-.633-2.484.004-3.233 1.49l-.144.285c-.734 1.458-.505 2.836.752 3.47 1.25.629 2.504.043 3.264-1.465l.144-.286c.748-1.486.438-2.878-.784-3.494zm-.26.515c.85.428 1.055 1.373.403 2.666l-.144.286c-.633 1.258-1.507 1.713-2.372 1.277-.864-.435-.976-1.459-.378-2.645l.144-.285c.651-1.294 1.454-1.749 2.347-1.299zM19.766 162.136l-.845-3.737-.555.125.61 2.692-1.846-1.198c-.827-.535-1.597-.82-2.283-.665-.96.217-1.42 1.01-1.188 2.04.24 1.061 1.085 1.568 2.197 1.406l-.143-.632c-.899.089-1.36-.25-1.507-.897-.143-.632.148-1.084.773-1.225.57-.129 1.143.053 1.797.438l2.834 1.689.156-.036zm-1.472-6.834c-.31-1.373-1.581-1.914-3.204-1.547l-.313.071c-1.591.36-2.51 1.412-2.2 2.785.31 1.366 1.56 1.961 3.206 1.588l.312-.07c1.623-.367 2.5-1.493 2.199-2.827zm-.562.127c.21.929-.39 1.688-1.802 2.007l-.312.071c-1.373.31-2.28-.075-2.494-1.019-.213-.944.506-1.681 1.801-1.974l.312-.071c1.412-.319 2.275.011 2.495.986zM36.376 64.413l2.323-3.048-.452-.344-1.673 2.195-.267-2.184c-.12-.977-.396-1.75-.956-2.177-.783-.596-1.686-.44-2.326.4-.66.865-.505 1.838.332 2.587l.393-.516c-.645-.632-.682-1.203-.28-1.732.393-.515.926-.581 1.435-.194.465.354.694.911.818 1.66l.526 3.256.127.097zm4.294-5.516c.853-1.12.452-2.442-.871-3.45l-.255-.194c-1.298-.99-2.695-1.018-3.548.102-.849 1.114-.502 2.454.84 3.477l.255.194c1.324 1.009 2.75.959 3.58-.13zm-.458-.35c-.577.758-1.544.786-2.696-.092l-.254-.194c-1.12-.853-1.407-1.796-.82-2.566.586-.77 1.613-.692 2.67.113l.254.194c1.151.877 1.452 1.75.846 2.545zM215.977 53.57l2.473 2.926.434-.366-1.781-2.108 2.19.212c.98.094 1.795-.008 2.332-.463.752-.635.795-1.55.113-2.357-.702-.831-1.685-.891-2.597-.235l.418.494c.757-.492 1.323-.405 1.751.102.419.495.368 1.03-.121 1.443-.446.377-1.039.48-1.796.44l-3.294-.192-.122.104zm4.457 5.386c.909 1.075 2.286.97 3.557-.105l.244-.206c1.247-1.054 1.577-2.411.668-3.487-.904-1.07-2.287-1.02-3.577.069l-.244.207c-1.271 1.074-1.531 2.477-.648 3.522zm.44-.372c-.614-.727-.432-1.677.674-2.612l.244-.206c1.075-.91 2.058-.986 2.683-.246s.326 1.724-.688 2.582l-.244.206c-1.106.935-2.023 1.04-2.669.276zM127.819 37.071c.968 0 1.968-.568 1.968-1.712 0-.736-.432-1.232-1.096-1.472.528-.232.88-.632.88-1.208 0-.896-.864-1.472-1.752-1.472-.88 0-1.76.56-1.76 1.488 0 .56.32.992.864 1.2-.608.216-1.08.712-1.08 1.48 0 1.136 1.04 1.696 1.976 1.696zm.024-3.424c-.584 0-1.08-.344-1.08-.944 0-.592.464-.952 1.056-.952.592 0 1.048.384 1.048.936 0 .608-.416.96-1.024.96zm-.024 2.856c-.664 0-1.264-.4-1.264-1.152 0-.76.6-1.152 1.28-1.152s1.24.384 1.24 1.136c0 .76-.552 1.168-1.256 1.168zm5.101.568c1.408 0 2.216-1.12 2.216-2.784v-.32c0-1.632-.824-2.76-2.232-2.76-1.4 0-2.256 1.088-2.256 2.776v.32c0 1.664.904 2.768 2.272 2.768zm0-.576c-.952 0-1.56-.752-1.56-2.2v-.32c0-1.408.576-2.208 1.544-2.208.968 0 1.528.864 1.528 2.192v.32c0 1.448-.512 2.216-1.512 2.216zM221.613 151.555c-.251.935.039 2.047 1.144 2.344.711.19 1.302-.099 1.705-.678.088.57.383 1.013.939 1.163.866.231 1.646-.454 1.876-1.312.228-.85-.086-1.845-.982-2.085-.541-.145-1.041.052-1.383.524-.051-.643-.408-1.227-1.15-1.426-1.097-.294-1.907.565-2.149 1.47zm3.301.909c.151-.564.612-.954 1.191-.799.572.153.8.695.646 1.266-.153.572-.642.913-1.175.77-.587-.157-.82-.65-.662-1.237zm-2.753-.762c.172-.642.714-1.118 1.44-.923.734.196.958.877.782 1.534-.176.657-.692 1.099-1.419.904-.734-.197-.985-.835-.803-1.515zm-1.869 4.78c-.364 1.36.509 2.43 2.116 2.861l.309.083c1.576.422 2.879-.082 3.244-1.442.362-1.352-.467-2.46-2.098-2.897l-.309-.083c-1.607-.431-2.908.157-3.262 1.478zm.557.149c.246-.92 1.13-1.312 2.528-.937l.31.082c1.36.365 1.983 1.128 1.733 2.063-.251.935-1.23 1.253-2.513.909l-.309-.083c-1.399-.375-2.008-1.068-1.749-2.034zM175.892 211.238c-.851.462-1.459 1.438-.914 2.443.351.647.967.877 1.665.772-.353.455-.472.975-.197 1.481.427.788 1.461.882 2.241.459.774-.419 1.281-1.331.838-2.147-.266-.492-.754-.719-1.331-.643.431-.48.61-1.141.244-1.816-.542-.998-1.723-.995-2.546-.549zm1.611 3.022c.514-.279 1.114-.213 1.4.315.282.52.046 1.058-.475 1.34-.52.282-1.104.162-1.367-.323-.29-.535-.092-1.043.442-1.332zm-1.34-2.523c.584-.316 1.302-.25 1.66.411.363.668.022 1.298-.576 1.623-.598.324-1.273.253-1.631-.408-.363-.668-.072-1.29.547-1.626zm-4.755 1.933c-1.238.671-1.414 2.04-.621 3.503l.152.282c.778 1.434 2.04 2.033 3.278 1.362 1.231-.667 1.465-2.032.66-3.516l-.152-.281c-.794-1.463-2.114-2.002-3.317-1.35zm.274.506c.837-.454 1.73-.082 2.42 1.19l.153.282c.671 1.238.546 2.215-.305 2.677-.851.461-1.755-.032-2.388-1.199l-.152-.281c-.691-1.273-.607-2.192.272-2.669zM90.864 215.214c-.864-.435-2.013-.378-2.528.644-.33.657-.168 1.295.317 1.808-.576-.031-1.07.168-1.33.683-.402.8.11 1.703.903 2.103.786.395 1.824.291 2.241-.538.252-.5.16-1.029-.231-1.46.64.081 1.284-.15 1.63-.836.511-1.014-.166-1.982-1.002-2.404zm-1.562 3.048c.522.262.81.793.54 1.329-.266.528-.842.641-1.371.375-.529-.267-.763-.815-.515-1.308.274-.543.803-.67 1.346-.396zm1.307-2.54c.593.298.949.926.61 1.597-.342.679-1.054.759-1.661.453s-.935-.901-.596-1.572c.341-.679 1.018-.795 1.647-.478zm-4.3-2.802c-1.258-.634-2.483.003-3.232 1.489l-.144.286c-.734 1.457-.506 2.835.752 3.469 1.25.63 2.504.043 3.263-1.464l.144-.286c.749-1.486.438-2.879-.784-3.494zm-.26.514c.85.428 1.055 1.373.404 2.667l-.144.285c-.634 1.258-1.508 1.713-2.373 1.278-.864-.436-.975-1.459-.378-2.645l.144-.286c.651-1.293 1.454-1.749 2.347-1.299zM40.724 154.746c-.214-.944-.988-1.794-2.104-1.542-.718.163-1.107.693-1.194 1.394-.343-.464-.81-.719-1.373-.592-.873.198-1.245 1.168-1.049 2.034.194.858.935 1.593 1.84 1.388.546-.123.897-.531.98-1.107.345.545.932.896 1.681.726 1.108-.25 1.425-1.388 1.219-2.301zm-3.345.732c.129.57-.097 1.129-.683 1.262-.577.13-1.03-.243-1.161-.82-.13-.578.143-1.107.682-1.229.593-.134 1.028.194 1.162.787zm2.79-.607c.147.648-.11 1.321-.844 1.487-.741.168-1.256-.331-1.406-.994-.15-.663.101-1.294.835-1.46.74-.168 1.26.281 1.416.967zm-.57-5.101c-.311-1.373-1.582-1.914-3.205-1.547l-.312.071c-1.592.36-2.51 1.412-2.2 2.786.31 1.365 1.56 1.96 3.206 1.588l.312-.071c1.623-.367 2.5-1.492 2.198-2.827zm-.562.128c.21.928-.39 1.687-1.802 2.006l-.312.071c-1.373.311-2.28-.075-2.494-1.019-.214-.944.505-1.681 1.8-1.974l.313-.07c1.412-.32 2.274.01 2.495.986zM55.5 75.734c.586-.77.74-1.91-.17-2.603-.585-.446-1.242-.403-1.835-.02.136-.56.03-1.083-.427-1.432-.713-.543-1.695-.205-2.233.501-.533.7-.621 1.74.117 2.302.445.34.983.347 1.478.04-.197.614-.088 1.29.523 1.756.903.688 1.979.2 2.546-.544zm-2.71-2.094c-.354.464-.928.65-1.405.287-.471-.359-.476-.946-.117-1.417.358-.471.94-.601 1.38-.266.483.368.51.912.142 1.396zm2.258 1.75c-.403.528-1.085.763-1.683.307-.604-.46-.553-1.175-.14-1.716.412-.541 1.056-.754 1.655-.298.604.46.594 1.147.167 1.707zm3.543-3.714c.853-1.12.452-2.441-.872-3.45l-.254-.193c-1.298-.99-2.695-1.018-3.548.102-.849 1.114-.502 2.454.84 3.477l.255.194c1.324 1.008 2.75.959 3.579-.13zm-.458-.349c-.577.758-1.544.785-2.696-.092l-.254-.194c-1.12-.853-1.407-1.796-.82-2.566.586-.77 1.612-.692 2.669.113l.254.194c1.152.877 1.453 1.75.847 2.545zM200.787 69.79c.625.74 1.704 1.137 2.578.399.562-.475.662-1.125.417-1.787.518.253 1.051.264 1.49-.108.685-.578.567-1.61-.006-2.288-.568-.672-1.564-.983-2.273-.384-.427.361-.551.885-.358 1.434-.558-.325-1.241-.365-1.828.13-.868.734-.624 1.89-.02 2.605zm2.631-2.191c-.377-.446-.435-1.047.024-1.434.452-.383 1.026-.26 1.408.192.383.452.384 1.048-.038 1.404-.464.393-1.002.302-1.394-.162zm-2.197 1.825c-.429-.507-.51-1.224.064-1.709.58-.49 1.267-.285 1.706.234.439.52.507 1.195-.067 1.68-.581.491-1.249.333-1.703-.205zm2.859 4.263c.909 1.075 2.286.97 3.556-.105l.245-.206c1.246-1.053 1.576-2.411.667-3.486-.903-1.07-2.287-1.021-3.576.068l-.245.207c-1.271 1.074-1.53 2.477-.647 3.522zm.44-.372c-.615-.727-.433-1.677.673-2.611l.245-.207c1.075-.909 2.058-.985 2.683-.246.624.74.326 1.725-.688 2.582l-.245.207c-1.106.934-2.023 1.039-2.668.275zM122.259 61.071c1.464 0 2.48-.88 2.48-2.536v-.424h-2.352v.576h1.672c-.024 1.016-.56 1.824-1.8 1.824-1.344 0-2.048-.928-2.048-2.344v-.064c0-1.4.752-2.36 2.064-2.36.832 0 1.456.352 1.616 1.264h.696c-.176-1.288-1.192-1.816-2.328-1.816-1.64 0-2.768 1.248-2.768 2.92v.064c0 1.672 1.008 2.896 2.768 2.896zm3.597-.072h.664v-2.296c0-1.032.536-1.296 1.376-1.336v-.624c-.752.024-1.112.352-1.376.824v-.752h-.664V61zm4.602.072c.944 0 1.64-.44 1.784-1.28h-.664c-.088.488-.464.728-1.112.728-.856 0-1.312-.528-1.344-1.48h3.152v-.216c0-1.496-.912-2.08-1.88-2.08-1.152 0-1.96.88-1.96 2.144v.064c0 1.288.84 2.12 2.024 2.12zm-1.312-2.568c.112-.744.568-1.208 1.248-1.208.688 0 1.136.344 1.2 1.208h-2.448zm5.859 2.568c.944 0 1.64-.44 1.784-1.28h-.664c-.088.488-.464.728-1.112.728-.856 0-1.312-.528-1.344-1.48h3.152v-.216c0-1.496-.912-2.08-1.88-2.08-1.152 0-1.96.88-1.96 2.144v.064c0 1.288.84 2.12 2.024 2.12zm-1.312-2.568c.112-.744.568-1.208 1.248-1.208.688 0 1.136.344 1.2 1.208h-2.448zM137.84 61h.664v-2.536c0-.752.552-1.144 1.168-1.144.672 0 .984.328.984 1.064V61h.664v-2.568c0-1.216-.608-1.688-1.472-1.688-.688 0-1.152.344-1.344.736v-.664h-.664V61zM205.843 129.705l2.047.548-.277 1.036c-.201.749-.573 1.147-1.322.946l-.031-.008c-.68-.183-.906-.699-.695-1.487l.278-1.035zm-2.757-1.46l-.18.673 2.403.644-.227.85-2.845 1.002-.201.749 2.904-1.036c-.057.797.228 1.528 1.14 1.772l.031.008c1.105.296 1.772-.461 2.055-1.52l.445-1.661-5.525-1.481zm-1.77 6.328c-.244.912.001 1.698.775 2.055l.172-.642c-.449-.211-.583-.636-.416-1.262.222-.827.85-1.131 1.778-.915l-.816 3.044.209.056c1.445.387 2.245-.342 2.495-1.277.298-1.113-.342-2.121-1.563-2.449l-.062-.016c-1.244-.333-2.265.263-2.572 1.406zm2.82-.602c.69.3 1.02.861.844 1.518-.178.664-.626 1.008-1.477.846l.633-2.364zm-3.521 3.498l-.172.642 3.5.938-.265.989.541.145.265-.99.727.195c.409.11.652.349.542.758a1.124 1.124 0 01-.181.399l.541.145c.079-.111.123-.215.179-.424.214-.796-.16-1.318-.979-1.538l-.657-.176.155-.579-.54-.145-.156.579-3.5-.938zm-.653 2.435l-.174.649 5.974 1.6.174-.649-5.974-1.6zm-1.038 3.596c-.244.912.001 1.698.775 2.055l.172-.641c-.449-.212-.583-.637-.416-1.263.222-.827.85-1.131 1.778-.915l-.816 3.045.209.055c1.445.388 2.245-.342 2.495-1.277.298-1.113-.342-2.121-1.563-2.448l-.062-.017c-1.244-.333-2.265.263-2.572 1.406zm2.82-.602c.69.301 1.02.861.844 1.518-.178.665-.626 1.008-1.477.846l.633-2.364zm-3.338 2.813l-.184.688 1.332 1.55-1.922.652-.203.758 2.52-.907 1.559 1.851.186-.696-1.205-1.375 1.733-.595.201-.75-2.325.826-1.692-2.002zm-1.77 6.607l-.507 1.893c-.296 1.105.015 1.951 1.059 2.23l.031.009c.718.192 1.208.001 1.617-.751.047.691.441 1.012.943 1.147l.031.008c1.09.292 1.631-.366 1.906-1.394l.445-1.661-5.525-1.481zm2.938 1.491l1.886.506-.265.989c-.207.772-.56 1.067-1.186.9l-.031-.009c-.68-.182-.89-.57-.673-1.381l.269-1.005zm-2.589-.693l2.064.553-.303 1.128c-.238.888-.664 1.18-1.344.998l-.031-.008c-.672-.18-.928-.647-.713-1.45l.327-1.221zm-1.629 3.978l-.174.649 5.974 1.601.174-.649-5.974-1.601zm-.961 3.311c-.174.649.038 1.186.367 1.473l-.642-.172-.171.642 4.041 1.083.172-.642-2.45-.656c-.726-.195-.96-.837-.807-1.409.17-.634.568-.85 1.279-.66l2.527.678.171-.642-2.557-.685c-1.113-.298-1.715.186-1.93.99zm-1.306 4.874c-.245.912 0 1.698.774 2.055l.172-.642c-.449-.211-.583-.636-.415-1.262.221-.827.849-1.131 1.777-.915l-.816 3.044.209.056c1.445.387 2.245-.343 2.496-1.278.298-1.112-.343-2.121-1.564-2.448l-.062-.016c-1.244-.334-2.265.262-2.571 1.406zm2.82-.603c.689.301 1.019.862.843 1.519-.178.664-.626 1.008-1.477.846l.634-2.365zM172.053 186.101l-.611.332 1.109 2.046-.816.442c-.956.519-1.533 1.369-.953 2.438l.015.028c.568 1.048 1.592 1.039 2.555.516l1.428-.774-2.727-5.028zm.761 2.863l1.087 2.005-.858.465c-.682.37-1.249.331-1.634-.379l-.015-.028c-.351-.647-.155-1.209.562-1.597l.858-.466zm-6.084-.059c-.591.32-.835.844-.817 1.28l-.316-.584-.584.317 1.994 3.678.584-.316-1.209-2.23c-.358-.661-.053-1.272.468-1.555.577-.312 1.007-.173 1.358.474l1.247 2.3.584-.316-1.263-2.328c-.549-1.013-1.315-1.116-2.046-.72zm-2.897 1.653l-.583.316 1.094 2.018c.492.908.147 1.395-.573 1.831l.298.548c.649-.379.809-.839.817-1.38l.358.661.584-.316-1.995-3.678zm-4.187 2.816c.717-.389 1.45-.213 1.961.73l.03.056c.511.942.235 1.675-.447 2.044-.619.336-1.384.15-1.888-.778l-.03-.056c-.485-.894-.358-1.599.374-1.996zm.849-2.663l-.583.317 1.021 1.885c-.409-.252-1.002-.322-1.607.006-1.012.549-1.254 1.681-.644 2.807l.031.056c.621 1.146 1.713 1.464 2.676.942.535-.29.859-.884.875-1.357l.336.619.584-.317-2.689-4.958zm-3.729 3.678l-.591.321 2.948 5.436.591-.32-2.948-5.437zm-3.325 1.721c-.83.45-1.232 1.169-.958 1.976l.584-.317c-.155-.471.061-.861.63-1.17.753-.408 1.405-.161 1.887.661l-2.771 1.502.103.19c.713 1.315 1.793 1.394 2.644.932 1.013-.549 1.304-1.707.702-2.819l-.031-.056c-.614-1.132-1.749-1.463-2.79-.899zm2.378 1.632c.256.708.076 1.333-.522 1.657-.604.328-1.162.239-1.63-.49l2.152-1.167zM105.844 195.968l-.621-.313-1.152 2.286-1.843-.928-.256.507 1.843.929-.91 1.807-2.365-1.191-.256.507 2.987 1.505 2.573-5.109zm-4.95-2.574c-.6-.302-1.17-.204-1.517.06l.299-.593-.593-.299-1.883 3.737.593.299 1.141-2.265c.339-.672 1.015-.77 1.544-.504.586.295.717.729.386 1.386l-1.177 2.336.593.299 1.191-2.365c.518-1.029.166-1.717-.577-2.091zm-3.01-1.436l-.593-.298-1.033 2.05c-.464.922-1.061.916-1.83.574l-.28.558c.682.316 1.151.185 1.6-.117l-.34.671.594.299 1.882-3.737zm-2.402-2.84l-.6-.302-4.602 3.997.607.306 2.386-2.158-.206 3.255.635.321.224-4.089 1.556-1.33zM68.194 167.733l-.14-.617-4.703-.306 4.122-2.261-.14-.624-5.908-.19.143.632 4.777.125-4.221 2.333.11.484 4.798.293-4.246 2.149.157.695 5.25-2.713zm-2.035-6.926c.13.57-.09.832-.511.928-.601.136-.94-.419-1.125-1.239l-.127-.561.507-.115c.632-.143 1.101.3 1.256.987zm.53-.054c-.136-.601-.422-.922-.873-1.14l.515-.116-.147-.648-2.692.609c-1.139.258-1.298 1.04-1.122 1.82.178.789.69 1.452 1.637 1.328l-.146-.648c-.514.051-.818-.208-.945-.77-.141-.624.075-.936.723-1.082l.296-.067.133.585c.236 1.045.782 1.972 1.726 1.758.835-.188 1.066-.872.895-1.629zm-.792-3.176l-.147-.648-2.24.507c-1.006.228-1.382-.237-1.606-1.047l-.609.137c.19.728.589 1.007 1.108 1.161l-.734.165.147.648 4.08-.923zm-.664-2.934l-.147-.647-2.496.564c-.734.166-1.216-.299-1.336-.829-.127-.562.1-.933.818-1.096l2.575-.582-.146-.648-2.497.565c-.734.166-1.216-.299-1.336-.83-.127-.562.1-.933.818-1.095l2.575-.583-.146-.647-2.529.571c-1.186.269-1.478 1.007-1.312 1.741.115.507.487 1.063 1.08 1.224-.498.334-.612.844-.494 1.366.132.586.545.96.97 1.061l-.624.141.146.647 4.081-.923zm-5.203-9.222l-2.067.468-.237-1.045c-.171-.757-.027-1.282.73-1.453l.03-.007c.688-.156 1.128.196 1.308.992l.236 1.045zm3.119.009l-.154-.679-2.426.549-.194-.859 2.05-2.211-.17-.756-2.088 2.268c-.321-.731-.913-1.245-1.834-1.037l-.03.007c-1.117.252-1.354 1.233-1.112 2.302l.379 1.678 5.579-1.262zm-1.38-6.425c-.207-.92-.79-1.502-1.641-1.457l.146.647c.496-.021.813.292.956.924.189.835-.226 1.397-1.147 1.638l-.696-3.075-.21.048c-1.46.33-1.828 1.348-1.614 2.293.254 1.123 1.29 1.717 2.523 1.438l.063-.014c1.256-.284 1.882-1.287 1.62-2.442zm-2.215 1.847c-.75.054-1.303-.288-1.453-.951-.152-.671.085-1.184.913-1.437l.54 2.388zm.688-6.097c.156.686-.21 1.352-1.24 1.585l-.063.014c-.99.224-1.67-.131-1.853-.943-.18-.796.198-1.406 1.244-1.643l.062-.014c1.046-.236 1.68.244 1.85 1.001zm.555-.052c-.134-.593-.638-1.078-1.089-1.222l.703-.159-.147-.647-6.032 1.364.147.648 2.606-.59c-.345.324-.577.82-.424 1.499.254 1.123 1.313 1.704 2.561 1.422l.063-.014c1.271-.288 1.853-1.232 1.612-2.301zm-1.764-7.8c-.283-1.248-1.116-1.995-2.448-1.899l.143.633c.937-.065 1.54.463 1.747 1.376.272 1.202-.424 2.114-1.844 2.435l-.063.014c-1.404.318-2.476-.252-2.737-1.407-.216-.952.11-1.542.929-1.875l-.152-.671c-1.183.391-1.577 1.513-1.314 2.676.342 1.514 1.787 2.352 3.441 1.978l.062-.015c1.717-.388 2.6-1.629 2.236-3.245zM71.376 94.379l.422-.554-4.55-3.467-.393.516-.041 1.638.515.393.044-1.576 4.003 3.05zm2.464-3.116c.718-.942.735-1.994-.092-2.625-.63-.48-1.267-.422-1.815.006.144-.545.07-1.083-.445-1.476-.63-.48-1.585-.413-2.245.452-.659.866-.518 1.908.177 2.488l.368-.484c-.472-.45-.524-1.093-.093-1.66.422-.553.961-.575 1.394-.245.496.378.578.853.127 1.444l-.243.319.465.353.262-.343c.49-.643 1.03-.733 1.616-.287.535.407.631.993.088 1.706-.548.72-1.209.729-1.788.367l-.388.51c.82.574 1.875.443 2.612-.525zm2.047-2.806l.432-.566-3.174-5.114-.076-.058-2.284 2.997.445.34 1.76-2.31 2.897 4.711zm3.783-4.846c.776-1.018.813-2.136-.115-3.095l-.393.515c.65.677.633 1.479.066 2.223-.747.98-1.893 1.032-3.05.15l-.052-.039c-1.145-.873-1.397-2.06-.68-3.002.592-.776 1.254-.906 2.035-.492l.417-.547c-1.06-.656-2.173-.237-2.895.71-.94 1.235-.656 2.88.693 3.909l.051.038c1.4 1.067 2.92.947 3.923-.37zM179.867 82.219c.765.904 1.789 1.149 2.583.478.605-.512.687-1.146.387-1.773.501.258 1.042.303 1.537-.115.605-.511.747-1.459.045-2.29-.703-.83-1.751-.919-2.467-.366l.392.465c.541-.364 1.181-.276 1.641.268.449.531.353 1.063-.062 1.414-.477.403-.957.38-1.438-.189l-.258-.306-.446.377.279.33c.522.617.493 1.166-.07 1.64-.513.435-1.106.402-1.684-.283-.584-.69-.45-1.337.028-1.825l-.413-.489c-.738.676-.838 1.735-.054 2.664zm2.646 3.018l.449.532 4.369-3.692-.418-.495-1.591-.395-.495.419 1.529.383-3.843 3.248zm2.062 2.44l.449.532 4.369-3.692-.418-.495-1.59-.394-.495.418 1.529.384-3.844 3.248zm3.02 3.685c.826.978 1.91 1.257 3.047.557l-.418-.495c-.802.49-1.581.299-2.185-.416-.795-.94-.598-2.071.514-3.01l.049-.042c1.1-.93 2.314-.919 3.078-.014.63.745.613 1.42.04 2.092l.444.526c.87-.892.702-2.07-.068-2.98-1.002-1.186-2.67-1.264-3.965-.169l-.049.041c-1.344 1.136-1.556 2.646-.487 3.91z",
111
+ fill: "#fff"
112
+ }));
113
+ };
114
+
115
+ var DiagramLight = function DiagramLight(props) {
20
116
  return /*#__PURE__*/React.createElement("svg", _extends({
21
117
  viewBox: "0 0 259 259",
22
118
  fill: "none"
@@ -126,6 +222,7 @@ var cn = cnCreate('colors');
126
222
  var Colors = function Colors() {
127
223
  var _React$useState = React.useState(getThemeFromLocalStorage()),
128
224
  _React$useState2 = _slicedToArray(_React$useState, 2),
225
+ currentTheme = _React$useState2[0],
129
226
  setCurrentTheme = _React$useState2[1];
130
227
 
131
228
  var _React$useState3 = React.useState(false),
@@ -278,7 +375,9 @@ var Colors = function Colors() {
278
375
  }, /*#__PURE__*/React.createElement(Header, {
279
376
  as: "h1",
280
377
  className: cn('title')
281
- }, "\u0426\u0432\u0435\u0442\u0430"), /*#__PURE__*/React.createElement(Paragraph, null, "\u041F\u0430\u043B\u0438\u0442\u0440\u0430 \u0446\u0432\u0435\u0442\u043E\u0432, \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u043C\u0430\u044F \u0432 \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u0430\u0445 \u041C\u0435\u0433\u0430\u0424\u043E\u043D"), /*#__PURE__*/React.createElement("div", {
378
+ }, "Colors"), /*#__PURE__*/React.createElement(Paragraph, {
379
+ className: cn('title-note')
380
+ }, "\u041F\u0430\u043B\u0438\u0442\u0440\u0430 \u0446\u0432\u0435\u0442\u043E\u0432, \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u043C\u0430\u044F \u0432 \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u0430\u0445 \u041C\u0435\u0433\u0430\u0424\u043E\u043D"), /*#__PURE__*/React.createElement("div", {
282
381
  className: cn('inner')
283
382
  }, /*#__PURE__*/React.createElement("div", {
284
383
  className: cn('container')
@@ -311,9 +410,9 @@ var Colors = function Colors() {
311
410
  className: cn('group-title')
312
411
  }, "Soft"), /*#__PURE__*/React.createElement("div", {
313
412
  className: cn('group')
314
- }, /*#__PURE__*/React.createElement(Diagram, {
413
+ }, /*#__PURE__*/React.createElement("div", {
315
414
  className: cn('diagram')
316
- }), renderSoftColors()))));
415
+ }, currentTheme === 'light' && /*#__PURE__*/React.createElement(DiagramLight, null), currentTheme === 'dark' && /*#__PURE__*/React.createElement(DiagramDark, null)), renderSoftColors()))));
317
416
  };
318
417
 
319
418
  export default Colors;
@@ -15,18 +15,19 @@ var colors = {
15
15
  colors: [{
16
16
  name: 'Base',
17
17
  code: 'base',
18
- border: '1px solid var(--spbSky1)'
18
+ border: '1px solid var(--spbSky2)'
19
19
  }, {
20
20
  name: 'Content',
21
21
  code: 'content',
22
- border: '1px solid var(--spbSky1)'
22
+ border: '1px solid var(--spbSky2)'
23
23
  }, {
24
24
  name: 'Spb Sky 0',
25
25
  code: 'spbSky0',
26
- border: '2px solid var(--spbSky1)'
26
+ border: '1px solid var(--spbSky2)'
27
27
  }, {
28
28
  name: 'Spb Sky 1',
29
- code: 'spbSky1'
29
+ code: 'spbSky1',
30
+ border: '1px solid var(--spbSky2)'
30
31
  }, {
31
32
  name: 'Spb Sky 2',
32
33
  code: 'spbSky2'
@@ -67,7 +68,8 @@ var colors = {
67
68
  code: 'systemBlue'
68
69
  }, {
69
70
  name: 'Background',
70
- code: 'background'
71
+ code: 'background',
72
+ border: '1px solid var(--spbSky2)'
71
73
  }, {
72
74
  name: 'Button Hov. G.',
73
75
  code: 'buttonHoverGreen'
@@ -106,11 +108,11 @@ var colors = {
106
108
  colors: [{
107
109
  name: 'STC White',
108
110
  code: 'stcWhite',
109
- border: '1px solid var(--spbSky1)'
111
+ border: '1px solid var(--spbSky2)'
110
112
  }, {
111
113
  name: 'STC Black',
112
114
  code: 'stcBlack',
113
- border: '1px solid var(--spbSky1)'
115
+ border: '1px solid var(--spbSky2)'
114
116
  }]
115
117
  }
116
118
  },
@@ -121,35 +123,35 @@ var colors = {
121
123
  colors: [{
122
124
  name: 'STC White 5%',
123
125
  code: 'stcWhite5',
124
- border: '1px solid var(--spbSky1)'
126
+ border: '1px solid var(--spbSky2)'
125
127
  }, {
126
128
  name: 'STC White 10%',
127
129
  code: 'stcWhite10',
128
- border: '1px solid var(--spbSky1)'
130
+ border: '1px solid var(--spbSky2)'
129
131
  }, {
130
132
  name: 'STC White 20%',
131
133
  code: 'stcWhite20',
132
- border: '1px solid var(--spbSky1)'
134
+ border: '1px solid var(--spbSky2)'
133
135
  }, {
134
136
  name: 'STC White 50%',
135
137
  code: 'stcWhite50',
136
- border: '1px solid var(--spbSky1)'
138
+ border: '1px solid var(--spbSky2)'
137
139
  }, {
138
140
  name: 'STC Black 5%',
139
141
  code: 'stcBlack5',
140
- border: '1px solid var(--spbSky1)'
142
+ border: '1px solid var(--spbSky2)'
141
143
  }, {
142
144
  name: 'STC Black 10%',
143
145
  code: 'stcBlack10',
144
- border: '1px solid var(--spbSky1)'
146
+ border: '1px solid var(--spbSky2)'
145
147
  }, {
146
148
  name: 'STC Black 20%',
147
149
  code: 'stcBlack20',
148
- border: '1px solid var(--spbSky1)'
150
+ border: '1px solid var(--spbSky2)'
149
151
  }, {
150
152
  name: 'STC Black 50%',
151
153
  code: 'stcBlack50',
152
- border: '1px solid var(--spbSky1)'
154
+ border: '1px solid var(--spbSky2)'
153
155
  }]
154
156
  }
155
157
  },
@@ -160,11 +162,11 @@ var colors = {
160
162
  colors: [{
161
163
  name: 'Brand Green 80',
162
164
  code: 'brandGreen80',
163
- parentColor: 'green'
165
+ parentColor: 'brandGreen'
164
166
  }, {
165
167
  name: 'Brand Purple 80',
166
168
  code: 'brandPurple80',
167
- parentColor: 'purple'
169
+ parentColor: 'brandPurple'
168
170
  }, {
169
171
  name: 'Warm Red C 80',
170
172
  code: 'warmRedC80',
@@ -188,11 +190,11 @@ var colors = {
188
190
  }, {
189
191
  name: 'Brand Green 20',
190
192
  code: 'brandGreen20',
191
- parentColor: 'green'
193
+ parentColor: 'brandGreen'
192
194
  }, {
193
195
  name: 'Brand Purple 20',
194
196
  code: 'brandPurple20',
195
- parentColor: 'purple'
197
+ parentColor: 'brandPurple'
196
198
  }, {
197
199
  name: 'Warm Red C 20',
198
200
  code: 'warmRedC20',
@@ -8,7 +8,7 @@ h5 {
8
8
  .mfui-notification {
9
9
  position: relative;
10
10
  padding: 16px 12px;
11
- background-color: var(--background);
11
+ background-color: var(--base);
12
12
  }
13
13
  @media screen and (min-width: 768px) {
14
14
  .mfui-notification {
@@ -187,7 +187,7 @@ h5 {
187
187
  fill: var(--311C);
188
188
  }
189
189
  .mfui-notification_colored .mfui-notification__icon-container {
190
- background-color: var(--stcWhite);
190
+ background-color: var(--base);
191
191
  }
192
192
  .mfui-notification_colored.mfui-notification_type_info {
193
193
  background-color: var(--311C20);
@@ -204,7 +204,7 @@ h5 {
204
204
  .mfui-notification_colored.mfui-notification_type_info .mfui-notification__text,
205
205
  .mfui-notification_colored.mfui-notification_type_warning .mfui-notification__text,
206
206
  .mfui-notification_colored.mfui-notification_type_success .mfui-notification__text {
207
- color: var(--stcBlack);
207
+ color: var(--content);
208
208
  }
209
209
  .mfui-notification_colored.mfui-notification_type_info .mfui-notification__link,
210
210
  .mfui-notification_colored.mfui-notification_type_warning .mfui-notification__link,
@@ -67,6 +67,7 @@ var Search = function Search(_ref) {
67
67
  var debouncedOnChange = React.useRef(debounce(function (inputValue) {
68
68
  return onChange && onChange(inputValue);
69
69
  }, changeDelay));
70
+ var highlightedItem = React.useRef(null);
70
71
  var handleChange = React.useCallback(function (e) {
71
72
  var _e$target$value = e.target.value,
72
73
  inputValue = _e$target$value === void 0 ? '' : _e$target$value;
@@ -148,6 +149,16 @@ var Search = function Search(_ref) {
148
149
  setFocus(false);
149
150
  }
150
151
  }, [disabled, isFocused]);
152
+ React.useEffect(function () {
153
+ var _a, _b;
154
+
155
+ if (activeIndex !== -1) {
156
+ (_b = (_a = highlightedItem.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView) === null || _b === void 0 ? void 0 : _b.call(_a, {
157
+ behavior: 'smooth',
158
+ block: 'nearest'
159
+ });
160
+ }
161
+ }, [activeIndex, items]);
151
162
 
152
163
  var highlightString = function highlightString(title) {
153
164
  var query = searchQuery.replace(/[^A-Z-a-zА-ЯЁа-яё0-9]/g, function (w) {
@@ -199,6 +210,7 @@ var Search = function Search(_ref) {
199
210
  var itemValue = _ref2.value,
200
211
  searchView = _ref2.searchView;
201
212
  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, i + 1), {
213
+ ref: activeIndex === i ? highlightedItem : null,
202
214
  className: cn('list-item', {
203
215
  active: activeIndex === i
204
216
  }),
@@ -105,29 +105,12 @@ var Select = function Select(_ref) {
105
105
  }, [onClosed, isOpened]);
106
106
 
107
107
  var scrollList = function scrollList(itemIndex) {
108
- if (!itemsNodeList.current.length) {
109
- return;
110
- }
111
-
112
- var wrapper = itemWrapperNode.current;
113
- var item = itemsNodeList.current[itemIndex];
114
-
115
- if (!item || !wrapper) {
116
- return;
117
- }
108
+ var _a, _b;
118
109
 
119
- var wrapperScroll = wrapper === null || wrapper === void 0 ? void 0 : wrapper.scrollTop;
120
- var wrapperHeight = wrapper === null || wrapper === void 0 ? void 0 : wrapper.offsetHeight;
121
- var itemOffset = item.offsetTop;
122
- var itemHeight = item.offsetHeight;
123
-
124
- if (itemOffset + itemHeight > wrapperScroll + wrapperHeight) {
125
- wrapper.scrollTop = itemOffset + itemHeight - wrapperHeight;
126
- }
127
-
128
- if (itemOffset < wrapperScroll) {
129
- wrapper.scrollTop = itemOffset;
130
- }
110
+ (_b = (_a = itemsNodeList.current[itemIndex]) === null || _a === void 0 ? void 0 : _a.scrollIntoView) === null || _b === void 0 ? void 0 : _b.call(_a, {
111
+ behavior: 'smooth',
112
+ block: 'nearest'
113
+ });
131
114
  };
132
115
 
133
116
  useEffect(function () {
@@ -1,6 +1,6 @@
1
1
  .mfui-tile {
2
2
  color: var(--content);
3
- background-color: var(--background);
3
+ background-color: var(--base);
4
4
  }
5
5
  .mfui-tile_radius_rounded {
6
6
  border-radius: 8px;
@@ -18,6 +18,9 @@
18
18
  .colors__title {
19
19
  margin-bottom: 8px;
20
20
  }
21
+ .colors__title-note {
22
+ margin-bottom: 60px;
23
+ }
21
24
  .colors__group-title {
22
25
  margin-bottom: 24px;
23
26
  }
@@ -82,7 +85,8 @@
82
85
  }
83
86
  .colors__description {
84
87
  position: relative;
85
- padding-top: 15px;
88
+ padding-top: 11px;
89
+ color: var(--spbSky3);
86
90
  font-size: 12px;
87
91
  line-height: 18px;
88
92
  text-align: center;
@@ -45,7 +45,103 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
45
45
 
46
46
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
47
47
 
48
- var Diagram = function Diagram(props) {
48
+ var DiagramDark = function DiagramDark(props) {
49
+ return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
50
+ viewBox: "0 0 260 261",
51
+ fill: "none"
52
+ }, props), /*#__PURE__*/React.createElement("mask", {
53
+ id: "DiagramDark__a",
54
+ style: {
55
+ maskType: 'alpha'
56
+ },
57
+ maskUnits: "userSpaceOnUse",
58
+ x: 0,
59
+ y: 0,
60
+ width: 260,
61
+ height: 261
62
+ }, /*#__PURE__*/React.createElement("path", {
63
+ fillRule: "evenodd",
64
+ clipRule: "evenodd",
65
+ d: "M130.491 260.678c71.526 0 129.509-58.19 129.509-129.972C260 58.925 202.017.734 130.491.734 58.965.734.981 58.924.981 130.706c0 71.782 57.984 129.972 129.51 129.972zm.216-22.279c59.477 0 107.693-48.215 107.693-107.693 0-59.477-48.216-107.693-107.693-107.693-59.478 0-107.694 48.216-107.694 107.693 0 59.478 48.216 107.693 107.694 107.693z",
66
+ fill: "#333"
67
+ })), /*#__PURE__*/React.createElement("g", {
68
+ mask: "url(#DiagramDark__a)"
69
+ }, /*#__PURE__*/React.createElement("path", {
70
+ d: "M75.979 13.036a129.498 129.498 0 01113.346 2.095L130.5 130.499 75.979 13.036z",
71
+ fill: "#314138"
72
+ }), /*#__PURE__*/React.createElement("path", {
73
+ d: "M189.067 15a129.507 129.507 0 0167.808 87.224L130.5 130.499l58.567-115.5z",
74
+ fill: "#35484A"
75
+ }), /*#__PURE__*/React.createElement("path", {
76
+ d: "M256.835 102.042a129.508 129.508 0 01-25.217 109.361L130.5 130.499l126.335-28.457z",
77
+ fill: "#2F2F3C"
78
+ }), /*#__PURE__*/React.createElement("path", {
79
+ d: "M231.817 211.153a129.497 129.497 0 01-101.043 48.846l-.274-129.5 101.317 80.654z",
80
+ fill: "#38273C"
81
+ }), /*#__PURE__*/React.createElement("path", {
82
+ d: "M130.5 259.999a129.505 129.505 0 01-101.147-48.632L130.5 130.499v129.5z",
83
+ fill: "#442B2D"
84
+ }), /*#__PURE__*/React.createElement("path", {
85
+ d: "M29.086 211.032A129.5 129.5 0 014.271 101.579l126.229 28.92-101.414 80.533z",
86
+ fill: "#422A26"
87
+ }), /*#__PURE__*/React.createElement("path", {
88
+ d: "M4.377 101.12a129.5 129.5 0 0171.422-88L130.5 130.498 4.377 101.12z",
89
+ fill: "#4A3D27"
90
+ })), /*#__PURE__*/React.createElement("path", {
91
+ d: "M85.367 33.023a107.695 107.695 0 0194.259 1.742l-48.919 95.941-45.34-97.683z",
92
+ fill: "#24804E"
93
+ }), /*#__PURE__*/React.createElement("path", {
94
+ d: "M179.411 34.656a107.695 107.695 0 0156.391 72.536l-105.095 23.514 48.704-96.05z",
95
+ fill: "#5B9DA3"
96
+ }), /*#__PURE__*/React.createElement("path", {
97
+ d: "M235.768 107.041a107.686 107.686 0 01-20.971 90.946l-84.09-67.281 105.061-23.665z",
98
+ fill: "#4B497C"
99
+ }), /*#__PURE__*/React.createElement("path", {
100
+ d: "M214.963 197.779a107.694 107.694 0 01-84.028 40.62l-.228-107.693 84.256 67.073z",
101
+ fill: "#5C2C64"
102
+ }), /*#__PURE__*/React.createElement("path", {
103
+ d: "M130.707 238.4a107.694 107.694 0 01-84.115-40.443l84.115-67.251V238.4z",
104
+ fill: "#CA3A43"
105
+ }), /*#__PURE__*/React.createElement("path", {
106
+ d: "M46.357 197.664a107.692 107.692 0 01-20.637-91.022l104.973 24.051-84.336 66.971z",
107
+ fill: "#B85B4A"
108
+ }), /*#__PURE__*/React.createElement("path", {
109
+ d: "M25.821 106.274a107.694 107.694 0 0159.396-73.182l45.49 97.614-104.886-24.432z",
110
+ fill: "#BC862E"
111
+ }), /*#__PURE__*/React.createElement("path", {
112
+ d: "M94.146 52.187a86.329 86.329 0 0175.559 1.397l-39.214 76.906-36.345-78.303z",
113
+ fill: "#00B956"
114
+ }), /*#__PURE__*/React.createElement("path", {
115
+ d: "M169.533 53.496a86.332 86.332 0 0145.202 58.146l-84.244 18.848 39.042-76.994z",
116
+ fill: "#5BD9E5"
117
+ }), /*#__PURE__*/React.createElement("path", {
118
+ d: "M214.708 111.52a86.325 86.325 0 01-16.81 72.903l-67.407-53.933 84.217-18.97z",
119
+ fill: "#444189"
120
+ }), /*#__PURE__*/React.createElement("path", {
121
+ d: "M198.031 184.256a86.331 86.331 0 01-67.358 32.561l-.182-86.327 67.54 53.766z",
122
+ fill: "#731982"
123
+ }), /*#__PURE__*/React.createElement("path", {
124
+ d: "M130.491 216.818a86.327 86.327 0 01-67.427-32.419l67.427-53.909v86.328z",
125
+ fill: "#F62434"
126
+ }), /*#__PURE__*/React.createElement("path", {
127
+ d: "M62.886 184.175a86.324 86.324 0 01-16.542-72.964l84.147 19.279-67.605 53.685z",
128
+ fill: "#EB5A40"
129
+ }), /*#__PURE__*/React.createElement("path", {
130
+ d: "M46.414 110.906a86.328 86.328 0 0147.612-58.664l36.465 78.248-84.077-19.584z",
131
+ fill: "#FFA717"
132
+ }), /*#__PURE__*/React.createElement("ellipse", {
133
+ cx: 130.491,
134
+ cy: 130.706,
135
+ rx: 60.429,
136
+ ry: 60.645,
137
+ fill: "#333"
138
+ }), /*#__PURE__*/React.createElement("path", {
139
+ d: "M125.234 15h3.832v-.569h-2.76l1.576-1.536c.704-.688 1.152-1.376 1.152-2.08 0-.984-.672-1.608-1.728-1.608-1.088 0-1.768.712-1.856 1.832h.648c.112-.896.544-1.272 1.208-1.272.648 0 1.024.384 1.024 1.024 0 .584-.304 1.104-.824 1.656l-2.272 2.392V15zm6.991.071c1.408 0 2.216-1.12 2.216-2.784v-.32c0-1.632-.824-2.76-2.232-2.76-1.4 0-2.256 1.088-2.256 2.776v.32c0 1.664.904 2.768 2.272 2.768zm0-.576c-.952 0-1.56-.752-1.56-2.2v-.32c0-1.408.576-2.208 1.544-2.208.968 0 1.528.864 1.528 2.192v.32c0 1.448-.512 2.216-1.512 2.216zM243.602 154.771l-.992 3.701.548.147.715-2.666 1.076 1.92c.482.858 1.031 1.469 1.711 1.651.95.255 1.727-.233 2-1.253.282-1.051-.23-1.892-1.289-2.267l-.168.626c.837.34 1.088.855.916 1.496-.168.626-.636.89-1.254.724-.564-.151-.988-.579-1.386-1.224l-1.723-2.814-.154-.041zm-1.879 6.734c-.365 1.36.508 2.43 2.115 2.861l.309.082c1.577.423 2.88-.081 3.244-1.441.362-1.352-.467-2.461-2.097-2.898l-.31-.083c-1.607-.43-2.907.157-3.261 1.479zm.556.149c.247-.92 1.13-1.313 2.529-.938l.309.083c1.36.364 1.984 1.128 1.733 2.063-.25.935-1.23 1.252-2.513.908l-.309-.082c-1.398-.375-2.008-1.068-1.749-2.034zM188.685 229.41l-3.369 1.826.271.5 2.426-1.316-.653 2.101c-.291.941-.357 1.759-.021 2.378.469.865 1.357 1.093 2.285.59.957-.519 1.215-1.469.759-2.495l-.57.309c.329.841.128 1.377-.456 1.694-.569.309-1.083.15-1.388-.412-.278-.514-.259-1.116-.065-1.849l.857-3.186-.076-.14zm-6.18 3.268c-1.238.672-1.414 2.041-.621 3.504l.153.281c.778 1.435 2.04 2.034 3.277 1.363 1.231-.667 1.465-2.032.66-3.516l-.152-.281c-.793-1.463-2.114-2.003-3.317-1.351zm.275.507c.837-.454 1.73-.083 2.42 1.19l.152.282c.671 1.237.546 2.215-.305 2.677-.851.461-1.755-.032-2.388-1.199l-.152-.281c-.69-1.273-.606-2.193.273-2.669zM83.243 236.09l-3.422-1.724-.256.507 2.465 1.242-2.099.662c-.938.298-1.647.711-1.964 1.34-.443.878-.123 1.738.82 2.213.971.49 1.899.16 2.481-.801l-.578-.292c-.503.75-1.058.892-1.651.593-.58-.291-.742-.804-.454-1.375.263-.522.768-.849 1.48-1.108l3.106-1.115.072-.142zm-6.21-3.21c-1.258-.633-2.484.004-3.233 1.49l-.144.285c-.734 1.458-.505 2.836.752 3.47 1.25.629 2.504.043 3.264-1.465l.144-.286c.748-1.486.438-2.878-.784-3.494zm-.26.515c.85.428 1.055 1.373.403 2.666l-.144.286c-.633 1.258-1.507 1.713-2.372 1.277-.864-.435-.976-1.459-.378-2.645l.144-.285c.651-1.294 1.454-1.749 2.347-1.299zM19.766 162.136l-.845-3.737-.555.125.61 2.692-1.846-1.198c-.827-.535-1.597-.82-2.283-.665-.96.217-1.42 1.01-1.188 2.04.24 1.061 1.085 1.568 2.197 1.406l-.143-.632c-.899.089-1.36-.25-1.507-.897-.143-.632.148-1.084.773-1.225.57-.129 1.143.053 1.797.438l2.834 1.689.156-.036zm-1.472-6.834c-.31-1.373-1.581-1.914-3.204-1.547l-.313.071c-1.591.36-2.51 1.412-2.2 2.785.31 1.366 1.56 1.961 3.206 1.588l.312-.07c1.623-.367 2.5-1.493 2.199-2.827zm-.562.127c.21.929-.39 1.688-1.802 2.007l-.312.071c-1.373.31-2.28-.075-2.494-1.019-.213-.944.506-1.681 1.801-1.974l.312-.071c1.412-.319 2.275.011 2.495.986zM36.376 64.413l2.323-3.048-.452-.344-1.673 2.195-.267-2.184c-.12-.977-.396-1.75-.956-2.177-.783-.596-1.686-.44-2.326.4-.66.865-.505 1.838.332 2.587l.393-.516c-.645-.632-.682-1.203-.28-1.732.393-.515.926-.581 1.435-.194.465.354.694.911.818 1.66l.526 3.256.127.097zm4.294-5.516c.853-1.12.452-2.442-.871-3.45l-.255-.194c-1.298-.99-2.695-1.018-3.548.102-.849 1.114-.502 2.454.84 3.477l.255.194c1.324 1.009 2.75.959 3.58-.13zm-.458-.35c-.577.758-1.544.786-2.696-.092l-.254-.194c-1.12-.853-1.407-1.796-.82-2.566.586-.77 1.613-.692 2.67.113l.254.194c1.151.877 1.452 1.75.846 2.545zM215.977 53.57l2.473 2.926.434-.366-1.781-2.108 2.19.212c.98.094 1.795-.008 2.332-.463.752-.635.795-1.55.113-2.357-.702-.831-1.685-.891-2.597-.235l.418.494c.757-.492 1.323-.405 1.751.102.419.495.368 1.03-.121 1.443-.446.377-1.039.48-1.796.44l-3.294-.192-.122.104zm4.457 5.386c.909 1.075 2.286.97 3.557-.105l.244-.206c1.247-1.054 1.577-2.411.668-3.487-.904-1.07-2.287-1.02-3.577.069l-.244.207c-1.271 1.074-1.531 2.477-.648 3.522zm.44-.372c-.614-.727-.432-1.677.674-2.612l.244-.206c1.075-.91 2.058-.986 2.683-.246s.326 1.724-.688 2.582l-.244.206c-1.106.935-2.023 1.04-2.669.276zM127.819 37.071c.968 0 1.968-.568 1.968-1.712 0-.736-.432-1.232-1.096-1.472.528-.232.88-.632.88-1.208 0-.896-.864-1.472-1.752-1.472-.88 0-1.76.56-1.76 1.488 0 .56.32.992.864 1.2-.608.216-1.08.712-1.08 1.48 0 1.136 1.04 1.696 1.976 1.696zm.024-3.424c-.584 0-1.08-.344-1.08-.944 0-.592.464-.952 1.056-.952.592 0 1.048.384 1.048.936 0 .608-.416.96-1.024.96zm-.024 2.856c-.664 0-1.264-.4-1.264-1.152 0-.76.6-1.152 1.28-1.152s1.24.384 1.24 1.136c0 .76-.552 1.168-1.256 1.168zm5.101.568c1.408 0 2.216-1.12 2.216-2.784v-.32c0-1.632-.824-2.76-2.232-2.76-1.4 0-2.256 1.088-2.256 2.776v.32c0 1.664.904 2.768 2.272 2.768zm0-.576c-.952 0-1.56-.752-1.56-2.2v-.32c0-1.408.576-2.208 1.544-2.208.968 0 1.528.864 1.528 2.192v.32c0 1.448-.512 2.216-1.512 2.216zM221.613 151.555c-.251.935.039 2.047 1.144 2.344.711.19 1.302-.099 1.705-.678.088.57.383 1.013.939 1.163.866.231 1.646-.454 1.876-1.312.228-.85-.086-1.845-.982-2.085-.541-.145-1.041.052-1.383.524-.051-.643-.408-1.227-1.15-1.426-1.097-.294-1.907.565-2.149 1.47zm3.301.909c.151-.564.612-.954 1.191-.799.572.153.8.695.646 1.266-.153.572-.642.913-1.175.77-.587-.157-.82-.65-.662-1.237zm-2.753-.762c.172-.642.714-1.118 1.44-.923.734.196.958.877.782 1.534-.176.657-.692 1.099-1.419.904-.734-.197-.985-.835-.803-1.515zm-1.869 4.78c-.364 1.36.509 2.43 2.116 2.861l.309.083c1.576.422 2.879-.082 3.244-1.442.362-1.352-.467-2.46-2.098-2.897l-.309-.083c-1.607-.431-2.908.157-3.262 1.478zm.557.149c.246-.92 1.13-1.312 2.528-.937l.31.082c1.36.365 1.983 1.128 1.733 2.063-.251.935-1.23 1.253-2.513.909l-.309-.083c-1.399-.375-2.008-1.068-1.749-2.034zM175.892 211.238c-.851.462-1.459 1.438-.914 2.443.351.647.967.877 1.665.772-.353.455-.472.975-.197 1.481.427.788 1.461.882 2.241.459.774-.419 1.281-1.331.838-2.147-.266-.492-.754-.719-1.331-.643.431-.48.61-1.141.244-1.816-.542-.998-1.723-.995-2.546-.549zm1.611 3.022c.514-.279 1.114-.213 1.4.315.282.52.046 1.058-.475 1.34-.52.282-1.104.162-1.367-.323-.29-.535-.092-1.043.442-1.332zm-1.34-2.523c.584-.316 1.302-.25 1.66.411.363.668.022 1.298-.576 1.623-.598.324-1.273.253-1.631-.408-.363-.668-.072-1.29.547-1.626zm-4.755 1.933c-1.238.671-1.414 2.04-.621 3.503l.152.282c.778 1.434 2.04 2.033 3.278 1.362 1.231-.667 1.465-2.032.66-3.516l-.152-.281c-.794-1.463-2.114-2.002-3.317-1.35zm.274.506c.837-.454 1.73-.082 2.42 1.19l.153.282c.671 1.238.546 2.215-.305 2.677-.851.461-1.755-.032-2.388-1.199l-.152-.281c-.691-1.273-.607-2.192.272-2.669zM90.864 215.214c-.864-.435-2.013-.378-2.528.644-.33.657-.168 1.295.317 1.808-.576-.031-1.07.168-1.33.683-.402.8.11 1.703.903 2.103.786.395 1.824.291 2.241-.538.252-.5.16-1.029-.231-1.46.64.081 1.284-.15 1.63-.836.511-1.014-.166-1.982-1.002-2.404zm-1.562 3.048c.522.262.81.793.54 1.329-.266.528-.842.641-1.371.375-.529-.267-.763-.815-.515-1.308.274-.543.803-.67 1.346-.396zm1.307-2.54c.593.298.949.926.61 1.597-.342.679-1.054.759-1.661.453s-.935-.901-.596-1.572c.341-.679 1.018-.795 1.647-.478zm-4.3-2.802c-1.258-.634-2.483.003-3.232 1.489l-.144.286c-.734 1.457-.506 2.835.752 3.469 1.25.63 2.504.043 3.263-1.464l.144-.286c.749-1.486.438-2.879-.784-3.494zm-.26.514c.85.428 1.055 1.373.404 2.667l-.144.285c-.634 1.258-1.508 1.713-2.373 1.278-.864-.436-.975-1.459-.378-2.645l.144-.286c.651-1.293 1.454-1.749 2.347-1.299zM40.724 154.746c-.214-.944-.988-1.794-2.104-1.542-.718.163-1.107.693-1.194 1.394-.343-.464-.81-.719-1.373-.592-.873.198-1.245 1.168-1.049 2.034.194.858.935 1.593 1.84 1.388.546-.123.897-.531.98-1.107.345.545.932.896 1.681.726 1.108-.25 1.425-1.388 1.219-2.301zm-3.345.732c.129.57-.097 1.129-.683 1.262-.577.13-1.03-.243-1.161-.82-.13-.578.143-1.107.682-1.229.593-.134 1.028.194 1.162.787zm2.79-.607c.147.648-.11 1.321-.844 1.487-.741.168-1.256-.331-1.406-.994-.15-.663.101-1.294.835-1.46.74-.168 1.26.281 1.416.967zm-.57-5.101c-.311-1.373-1.582-1.914-3.205-1.547l-.312.071c-1.592.36-2.51 1.412-2.2 2.786.31 1.365 1.56 1.96 3.206 1.588l.312-.071c1.623-.367 2.5-1.492 2.198-2.827zm-.562.128c.21.928-.39 1.687-1.802 2.006l-.312.071c-1.373.311-2.28-.075-2.494-1.019-.214-.944.505-1.681 1.8-1.974l.313-.07c1.412-.32 2.274.01 2.495.986zM55.5 75.734c.586-.77.74-1.91-.17-2.603-.585-.446-1.242-.403-1.835-.02.136-.56.03-1.083-.427-1.432-.713-.543-1.695-.205-2.233.501-.533.7-.621 1.74.117 2.302.445.34.983.347 1.478.04-.197.614-.088 1.29.523 1.756.903.688 1.979.2 2.546-.544zm-2.71-2.094c-.354.464-.928.65-1.405.287-.471-.359-.476-.946-.117-1.417.358-.471.94-.601 1.38-.266.483.368.51.912.142 1.396zm2.258 1.75c-.403.528-1.085.763-1.683.307-.604-.46-.553-1.175-.14-1.716.412-.541 1.056-.754 1.655-.298.604.46.594 1.147.167 1.707zm3.543-3.714c.853-1.12.452-2.441-.872-3.45l-.254-.193c-1.298-.99-2.695-1.018-3.548.102-.849 1.114-.502 2.454.84 3.477l.255.194c1.324 1.008 2.75.959 3.579-.13zm-.458-.349c-.577.758-1.544.785-2.696-.092l-.254-.194c-1.12-.853-1.407-1.796-.82-2.566.586-.77 1.612-.692 2.669.113l.254.194c1.152.877 1.453 1.75.847 2.545zM200.787 69.79c.625.74 1.704 1.137 2.578.399.562-.475.662-1.125.417-1.787.518.253 1.051.264 1.49-.108.685-.578.567-1.61-.006-2.288-.568-.672-1.564-.983-2.273-.384-.427.361-.551.885-.358 1.434-.558-.325-1.241-.365-1.828.13-.868.734-.624 1.89-.02 2.605zm2.631-2.191c-.377-.446-.435-1.047.024-1.434.452-.383 1.026-.26 1.408.192.383.452.384 1.048-.038 1.404-.464.393-1.002.302-1.394-.162zm-2.197 1.825c-.429-.507-.51-1.224.064-1.709.58-.49 1.267-.285 1.706.234.439.52.507 1.195-.067 1.68-.581.491-1.249.333-1.703-.205zm2.859 4.263c.909 1.075 2.286.97 3.556-.105l.245-.206c1.246-1.053 1.576-2.411.667-3.486-.903-1.07-2.287-1.021-3.576.068l-.245.207c-1.271 1.074-1.53 2.477-.647 3.522zm.44-.372c-.615-.727-.433-1.677.673-2.611l.245-.207c1.075-.909 2.058-.985 2.683-.246.624.74.326 1.725-.688 2.582l-.245.207c-1.106.934-2.023 1.039-2.668.275zM122.259 61.071c1.464 0 2.48-.88 2.48-2.536v-.424h-2.352v.576h1.672c-.024 1.016-.56 1.824-1.8 1.824-1.344 0-2.048-.928-2.048-2.344v-.064c0-1.4.752-2.36 2.064-2.36.832 0 1.456.352 1.616 1.264h.696c-.176-1.288-1.192-1.816-2.328-1.816-1.64 0-2.768 1.248-2.768 2.92v.064c0 1.672 1.008 2.896 2.768 2.896zm3.597-.072h.664v-2.296c0-1.032.536-1.296 1.376-1.336v-.624c-.752.024-1.112.352-1.376.824v-.752h-.664V61zm4.602.072c.944 0 1.64-.44 1.784-1.28h-.664c-.088.488-.464.728-1.112.728-.856 0-1.312-.528-1.344-1.48h3.152v-.216c0-1.496-.912-2.08-1.88-2.08-1.152 0-1.96.88-1.96 2.144v.064c0 1.288.84 2.12 2.024 2.12zm-1.312-2.568c.112-.744.568-1.208 1.248-1.208.688 0 1.136.344 1.2 1.208h-2.448zm5.859 2.568c.944 0 1.64-.44 1.784-1.28h-.664c-.088.488-.464.728-1.112.728-.856 0-1.312-.528-1.344-1.48h3.152v-.216c0-1.496-.912-2.08-1.88-2.08-1.152 0-1.96.88-1.96 2.144v.064c0 1.288.84 2.12 2.024 2.12zm-1.312-2.568c.112-.744.568-1.208 1.248-1.208.688 0 1.136.344 1.2 1.208h-2.448zM137.84 61h.664v-2.536c0-.752.552-1.144 1.168-1.144.672 0 .984.328.984 1.064V61h.664v-2.568c0-1.216-.608-1.688-1.472-1.688-.688 0-1.152.344-1.344.736v-.664h-.664V61zM205.843 129.705l2.047.548-.277 1.036c-.201.749-.573 1.147-1.322.946l-.031-.008c-.68-.183-.906-.699-.695-1.487l.278-1.035zm-2.757-1.46l-.18.673 2.403.644-.227.85-2.845 1.002-.201.749 2.904-1.036c-.057.797.228 1.528 1.14 1.772l.031.008c1.105.296 1.772-.461 2.055-1.52l.445-1.661-5.525-1.481zm-1.77 6.328c-.244.912.001 1.698.775 2.055l.172-.642c-.449-.211-.583-.636-.416-1.262.222-.827.85-1.131 1.778-.915l-.816 3.044.209.056c1.445.387 2.245-.342 2.495-1.277.298-1.113-.342-2.121-1.563-2.449l-.062-.016c-1.244-.333-2.265.263-2.572 1.406zm2.82-.602c.69.3 1.02.861.844 1.518-.178.664-.626 1.008-1.477.846l.633-2.364zm-3.521 3.498l-.172.642 3.5.938-.265.989.541.145.265-.99.727.195c.409.11.652.349.542.758a1.124 1.124 0 01-.181.399l.541.145c.079-.111.123-.215.179-.424.214-.796-.16-1.318-.979-1.538l-.657-.176.155-.579-.54-.145-.156.579-3.5-.938zm-.653 2.435l-.174.649 5.974 1.6.174-.649-5.974-1.6zm-1.038 3.596c-.244.912.001 1.698.775 2.055l.172-.641c-.449-.212-.583-.637-.416-1.263.222-.827.85-1.131 1.778-.915l-.816 3.045.209.055c1.445.388 2.245-.342 2.495-1.277.298-1.113-.342-2.121-1.563-2.448l-.062-.017c-1.244-.333-2.265.263-2.572 1.406zm2.82-.602c.69.301 1.02.861.844 1.518-.178.665-.626 1.008-1.477.846l.633-2.364zm-3.338 2.813l-.184.688 1.332 1.55-1.922.652-.203.758 2.52-.907 1.559 1.851.186-.696-1.205-1.375 1.733-.595.201-.75-2.325.826-1.692-2.002zm-1.77 6.607l-.507 1.893c-.296 1.105.015 1.951 1.059 2.23l.031.009c.718.192 1.208.001 1.617-.751.047.691.441 1.012.943 1.147l.031.008c1.09.292 1.631-.366 1.906-1.394l.445-1.661-5.525-1.481zm2.938 1.491l1.886.506-.265.989c-.207.772-.56 1.067-1.186.9l-.031-.009c-.68-.182-.89-.57-.673-1.381l.269-1.005zm-2.589-.693l2.064.553-.303 1.128c-.238.888-.664 1.18-1.344.998l-.031-.008c-.672-.18-.928-.647-.713-1.45l.327-1.221zm-1.629 3.978l-.174.649 5.974 1.601.174-.649-5.974-1.601zm-.961 3.311c-.174.649.038 1.186.367 1.473l-.642-.172-.171.642 4.041 1.083.172-.642-2.45-.656c-.726-.195-.96-.837-.807-1.409.17-.634.568-.85 1.279-.66l2.527.678.171-.642-2.557-.685c-1.113-.298-1.715.186-1.93.99zm-1.306 4.874c-.245.912 0 1.698.774 2.055l.172-.642c-.449-.211-.583-.636-.415-1.262.221-.827.849-1.131 1.777-.915l-.816 3.044.209.056c1.445.387 2.245-.343 2.496-1.278.298-1.112-.343-2.121-1.564-2.448l-.062-.016c-1.244-.334-2.265.262-2.571 1.406zm2.82-.603c.689.301 1.019.862.843 1.519-.178.664-.626 1.008-1.477.846l.634-2.365zM172.053 186.101l-.611.332 1.109 2.046-.816.442c-.956.519-1.533 1.369-.953 2.438l.015.028c.568 1.048 1.592 1.039 2.555.516l1.428-.774-2.727-5.028zm.761 2.863l1.087 2.005-.858.465c-.682.37-1.249.331-1.634-.379l-.015-.028c-.351-.647-.155-1.209.562-1.597l.858-.466zm-6.084-.059c-.591.32-.835.844-.817 1.28l-.316-.584-.584.317 1.994 3.678.584-.316-1.209-2.23c-.358-.661-.053-1.272.468-1.555.577-.312 1.007-.173 1.358.474l1.247 2.3.584-.316-1.263-2.328c-.549-1.013-1.315-1.116-2.046-.72zm-2.897 1.653l-.583.316 1.094 2.018c.492.908.147 1.395-.573 1.831l.298.548c.649-.379.809-.839.817-1.38l.358.661.584-.316-1.995-3.678zm-4.187 2.816c.717-.389 1.45-.213 1.961.73l.03.056c.511.942.235 1.675-.447 2.044-.619.336-1.384.15-1.888-.778l-.03-.056c-.485-.894-.358-1.599.374-1.996zm.849-2.663l-.583.317 1.021 1.885c-.409-.252-1.002-.322-1.607.006-1.012.549-1.254 1.681-.644 2.807l.031.056c.621 1.146 1.713 1.464 2.676.942.535-.29.859-.884.875-1.357l.336.619.584-.317-2.689-4.958zm-3.729 3.678l-.591.321 2.948 5.436.591-.32-2.948-5.437zm-3.325 1.721c-.83.45-1.232 1.169-.958 1.976l.584-.317c-.155-.471.061-.861.63-1.17.753-.408 1.405-.161 1.887.661l-2.771 1.502.103.19c.713 1.315 1.793 1.394 2.644.932 1.013-.549 1.304-1.707.702-2.819l-.031-.056c-.614-1.132-1.749-1.463-2.79-.899zm2.378 1.632c.256.708.076 1.333-.522 1.657-.604.328-1.162.239-1.63-.49l2.152-1.167zM105.844 195.968l-.621-.313-1.152 2.286-1.843-.928-.256.507 1.843.929-.91 1.807-2.365-1.191-.256.507 2.987 1.505 2.573-5.109zm-4.95-2.574c-.6-.302-1.17-.204-1.517.06l.299-.593-.593-.299-1.883 3.737.593.299 1.141-2.265c.339-.672 1.015-.77 1.544-.504.586.295.717.729.386 1.386l-1.177 2.336.593.299 1.191-2.365c.518-1.029.166-1.717-.577-2.091zm-3.01-1.436l-.593-.298-1.033 2.05c-.464.922-1.061.916-1.83.574l-.28.558c.682.316 1.151.185 1.6-.117l-.34.671.594.299 1.882-3.737zm-2.402-2.84l-.6-.302-4.602 3.997.607.306 2.386-2.158-.206 3.255.635.321.224-4.089 1.556-1.33zM68.194 167.733l-.14-.617-4.703-.306 4.122-2.261-.14-.624-5.908-.19.143.632 4.777.125-4.221 2.333.11.484 4.798.293-4.246 2.149.157.695 5.25-2.713zm-2.035-6.926c.13.57-.09.832-.511.928-.601.136-.94-.419-1.125-1.239l-.127-.561.507-.115c.632-.143 1.101.3 1.256.987zm.53-.054c-.136-.601-.422-.922-.873-1.14l.515-.116-.147-.648-2.692.609c-1.139.258-1.298 1.04-1.122 1.82.178.789.69 1.452 1.637 1.328l-.146-.648c-.514.051-.818-.208-.945-.77-.141-.624.075-.936.723-1.082l.296-.067.133.585c.236 1.045.782 1.972 1.726 1.758.835-.188 1.066-.872.895-1.629zm-.792-3.176l-.147-.648-2.24.507c-1.006.228-1.382-.237-1.606-1.047l-.609.137c.19.728.589 1.007 1.108 1.161l-.734.165.147.648 4.08-.923zm-.664-2.934l-.147-.647-2.496.564c-.734.166-1.216-.299-1.336-.829-.127-.562.1-.933.818-1.096l2.575-.582-.146-.648-2.497.565c-.734.166-1.216-.299-1.336-.83-.127-.562.1-.933.818-1.095l2.575-.583-.146-.647-2.529.571c-1.186.269-1.478 1.007-1.312 1.741.115.507.487 1.063 1.08 1.224-.498.334-.612.844-.494 1.366.132.586.545.96.97 1.061l-.624.141.146.647 4.081-.923zm-5.203-9.222l-2.067.468-.237-1.045c-.171-.757-.027-1.282.73-1.453l.03-.007c.688-.156 1.128.196 1.308.992l.236 1.045zm3.119.009l-.154-.679-2.426.549-.194-.859 2.05-2.211-.17-.756-2.088 2.268c-.321-.731-.913-1.245-1.834-1.037l-.03.007c-1.117.252-1.354 1.233-1.112 2.302l.379 1.678 5.579-1.262zm-1.38-6.425c-.207-.92-.79-1.502-1.641-1.457l.146.647c.496-.021.813.292.956.924.189.835-.226 1.397-1.147 1.638l-.696-3.075-.21.048c-1.46.33-1.828 1.348-1.614 2.293.254 1.123 1.29 1.717 2.523 1.438l.063-.014c1.256-.284 1.882-1.287 1.62-2.442zm-2.215 1.847c-.75.054-1.303-.288-1.453-.951-.152-.671.085-1.184.913-1.437l.54 2.388zm.688-6.097c.156.686-.21 1.352-1.24 1.585l-.063.014c-.99.224-1.67-.131-1.853-.943-.18-.796.198-1.406 1.244-1.643l.062-.014c1.046-.236 1.68.244 1.85 1.001zm.555-.052c-.134-.593-.638-1.078-1.089-1.222l.703-.159-.147-.647-6.032 1.364.147.648 2.606-.59c-.345.324-.577.82-.424 1.499.254 1.123 1.313 1.704 2.561 1.422l.063-.014c1.271-.288 1.853-1.232 1.612-2.301zm-1.764-7.8c-.283-1.248-1.116-1.995-2.448-1.899l.143.633c.937-.065 1.54.463 1.747 1.376.272 1.202-.424 2.114-1.844 2.435l-.063.014c-1.404.318-2.476-.252-2.737-1.407-.216-.952.11-1.542.929-1.875l-.152-.671c-1.183.391-1.577 1.513-1.314 2.676.342 1.514 1.787 2.352 3.441 1.978l.062-.015c1.717-.388 2.6-1.629 2.236-3.245zM71.376 94.379l.422-.554-4.55-3.467-.393.516-.041 1.638.515.393.044-1.576 4.003 3.05zm2.464-3.116c.718-.942.735-1.994-.092-2.625-.63-.48-1.267-.422-1.815.006.144-.545.07-1.083-.445-1.476-.63-.48-1.585-.413-2.245.452-.659.866-.518 1.908.177 2.488l.368-.484c-.472-.45-.524-1.093-.093-1.66.422-.553.961-.575 1.394-.245.496.378.578.853.127 1.444l-.243.319.465.353.262-.343c.49-.643 1.03-.733 1.616-.287.535.407.631.993.088 1.706-.548.72-1.209.729-1.788.367l-.388.51c.82.574 1.875.443 2.612-.525zm2.047-2.806l.432-.566-3.174-5.114-.076-.058-2.284 2.997.445.34 1.76-2.31 2.897 4.711zm3.783-4.846c.776-1.018.813-2.136-.115-3.095l-.393.515c.65.677.633 1.479.066 2.223-.747.98-1.893 1.032-3.05.15l-.052-.039c-1.145-.873-1.397-2.06-.68-3.002.592-.776 1.254-.906 2.035-.492l.417-.547c-1.06-.656-2.173-.237-2.895.71-.94 1.235-.656 2.88.693 3.909l.051.038c1.4 1.067 2.92.947 3.923-.37zM179.867 82.219c.765.904 1.789 1.149 2.583.478.605-.512.687-1.146.387-1.773.501.258 1.042.303 1.537-.115.605-.511.747-1.459.045-2.29-.703-.83-1.751-.919-2.467-.366l.392.465c.541-.364 1.181-.276 1.641.268.449.531.353 1.063-.062 1.414-.477.403-.957.38-1.438-.189l-.258-.306-.446.377.279.33c.522.617.493 1.166-.07 1.64-.513.435-1.106.402-1.684-.283-.584-.69-.45-1.337.028-1.825l-.413-.489c-.738.676-.838 1.735-.054 2.664zm2.646 3.018l.449.532 4.369-3.692-.418-.495-1.591-.395-.495.419 1.529.383-3.843 3.248zm2.062 2.44l.449.532 4.369-3.692-.418-.495-1.59-.394-.495.418 1.529.384-3.844 3.248zm3.02 3.685c.826.978 1.91 1.257 3.047.557l-.418-.495c-.802.49-1.581.299-2.185-.416-.795-.94-.598-2.071.514-3.01l.049-.042c1.1-.93 2.314-.919 3.078-.014.63.745.613 1.42.04 2.092l.444.526c.87-.892.702-2.07-.068-2.98-1.002-1.186-2.67-1.264-3.965-.169l-.049.041c-1.344 1.136-1.556 2.646-.487 3.91z",
140
+ fill: "#fff"
141
+ }));
142
+ };
143
+
144
+ var DiagramLight = function DiagramLight(props) {
49
145
  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
50
146
  viewBox: "0 0 259 259",
51
147
  fill: "none"
@@ -155,6 +251,7 @@ var cn = (0, _uiHelpers.cnCreate)('colors');
155
251
  var Colors = function Colors() {
156
252
  var _React$useState = React.useState(getThemeFromLocalStorage()),
157
253
  _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
254
+ currentTheme = _React$useState2[0],
158
255
  setCurrentTheme = _React$useState2[1];
159
256
 
160
257
  var _React$useState3 = React.useState(false),
@@ -304,7 +401,9 @@ var Colors = function Colors() {
304
401
  }, /*#__PURE__*/React.createElement(_Header["default"], {
305
402
  as: "h1",
306
403
  className: cn('title')
307
- }, "\u0426\u0432\u0435\u0442\u0430"), /*#__PURE__*/React.createElement(_Paragraph["default"], null, "\u041F\u0430\u043B\u0438\u0442\u0440\u0430 \u0446\u0432\u0435\u0442\u043E\u0432, \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u043C\u0430\u044F \u0432 \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u0430\u0445 \u041C\u0435\u0433\u0430\u0424\u043E\u043D"), /*#__PURE__*/React.createElement("div", {
404
+ }, "Colors"), /*#__PURE__*/React.createElement(_Paragraph["default"], {
405
+ className: cn('title-note')
406
+ }, "\u041F\u0430\u043B\u0438\u0442\u0440\u0430 \u0446\u0432\u0435\u0442\u043E\u0432, \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u043C\u0430\u044F \u0432 \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u0430\u0445 \u041C\u0435\u0433\u0430\u0424\u043E\u043D"), /*#__PURE__*/React.createElement("div", {
308
407
  className: cn('inner')
309
408
  }, /*#__PURE__*/React.createElement("div", {
310
409
  className: cn('container')
@@ -337,9 +436,9 @@ var Colors = function Colors() {
337
436
  className: cn('group-title')
338
437
  }, "Soft"), /*#__PURE__*/React.createElement("div", {
339
438
  className: cn('group')
340
- }, /*#__PURE__*/React.createElement(Diagram, {
439
+ }, /*#__PURE__*/React.createElement("div", {
341
440
  className: cn('diagram')
342
- }), renderSoftColors()))));
441
+ }, currentTheme === 'light' && /*#__PURE__*/React.createElement(DiagramLight, null), currentTheme === 'dark' && /*#__PURE__*/React.createElement(DiagramDark, null)), renderSoftColors()))));
343
442
  };
344
443
 
345
444
  var _default = Colors;
@@ -21,18 +21,19 @@ var colors = {
21
21
  colors: [{
22
22
  name: 'Base',
23
23
  code: 'base',
24
- border: '1px solid var(--spbSky1)'
24
+ border: '1px solid var(--spbSky2)'
25
25
  }, {
26
26
  name: 'Content',
27
27
  code: 'content',
28
- border: '1px solid var(--spbSky1)'
28
+ border: '1px solid var(--spbSky2)'
29
29
  }, {
30
30
  name: 'Spb Sky 0',
31
31
  code: 'spbSky0',
32
- border: '2px solid var(--spbSky1)'
32
+ border: '1px solid var(--spbSky2)'
33
33
  }, {
34
34
  name: 'Spb Sky 1',
35
- code: 'spbSky1'
35
+ code: 'spbSky1',
36
+ border: '1px solid var(--spbSky2)'
36
37
  }, {
37
38
  name: 'Spb Sky 2',
38
39
  code: 'spbSky2'
@@ -73,7 +74,8 @@ var colors = {
73
74
  code: 'systemBlue'
74
75
  }, {
75
76
  name: 'Background',
76
- code: 'background'
77
+ code: 'background',
78
+ border: '1px solid var(--spbSky2)'
77
79
  }, {
78
80
  name: 'Button Hov. G.',
79
81
  code: 'buttonHoverGreen'
@@ -112,11 +114,11 @@ var colors = {
112
114
  colors: [{
113
115
  name: 'STC White',
114
116
  code: 'stcWhite',
115
- border: '1px solid var(--spbSky1)'
117
+ border: '1px solid var(--spbSky2)'
116
118
  }, {
117
119
  name: 'STC Black',
118
120
  code: 'stcBlack',
119
- border: '1px solid var(--spbSky1)'
121
+ border: '1px solid var(--spbSky2)'
120
122
  }]
121
123
  }
122
124
  },
@@ -127,35 +129,35 @@ var colors = {
127
129
  colors: [{
128
130
  name: 'STC White 5%',
129
131
  code: 'stcWhite5',
130
- border: '1px solid var(--spbSky1)'
132
+ border: '1px solid var(--spbSky2)'
131
133
  }, {
132
134
  name: 'STC White 10%',
133
135
  code: 'stcWhite10',
134
- border: '1px solid var(--spbSky1)'
136
+ border: '1px solid var(--spbSky2)'
135
137
  }, {
136
138
  name: 'STC White 20%',
137
139
  code: 'stcWhite20',
138
- border: '1px solid var(--spbSky1)'
140
+ border: '1px solid var(--spbSky2)'
139
141
  }, {
140
142
  name: 'STC White 50%',
141
143
  code: 'stcWhite50',
142
- border: '1px solid var(--spbSky1)'
144
+ border: '1px solid var(--spbSky2)'
143
145
  }, {
144
146
  name: 'STC Black 5%',
145
147
  code: 'stcBlack5',
146
- border: '1px solid var(--spbSky1)'
148
+ border: '1px solid var(--spbSky2)'
147
149
  }, {
148
150
  name: 'STC Black 10%',
149
151
  code: 'stcBlack10',
150
- border: '1px solid var(--spbSky1)'
152
+ border: '1px solid var(--spbSky2)'
151
153
  }, {
152
154
  name: 'STC Black 20%',
153
155
  code: 'stcBlack20',
154
- border: '1px solid var(--spbSky1)'
156
+ border: '1px solid var(--spbSky2)'
155
157
  }, {
156
158
  name: 'STC Black 50%',
157
159
  code: 'stcBlack50',
158
- border: '1px solid var(--spbSky1)'
160
+ border: '1px solid var(--spbSky2)'
159
161
  }]
160
162
  }
161
163
  },
@@ -166,11 +168,11 @@ var colors = {
166
168
  colors: [{
167
169
  name: 'Brand Green 80',
168
170
  code: 'brandGreen80',
169
- parentColor: 'green'
171
+ parentColor: 'brandGreen'
170
172
  }, {
171
173
  name: 'Brand Purple 80',
172
174
  code: 'brandPurple80',
173
- parentColor: 'purple'
175
+ parentColor: 'brandPurple'
174
176
  }, {
175
177
  name: 'Warm Red C 80',
176
178
  code: 'warmRedC80',
@@ -194,11 +196,11 @@ var colors = {
194
196
  }, {
195
197
  name: 'Brand Green 20',
196
198
  code: 'brandGreen20',
197
- parentColor: 'green'
199
+ parentColor: 'brandGreen'
198
200
  }, {
199
201
  name: 'Brand Purple 20',
200
202
  code: 'brandPurple20',
201
- parentColor: 'purple'
203
+ parentColor: 'brandPurple'
202
204
  }, {
203
205
  name: 'Warm Red C 20',
204
206
  code: 'warmRedC20',
@@ -8,7 +8,7 @@ h5 {
8
8
  .mfui-notification {
9
9
  position: relative;
10
10
  padding: 16px 12px;
11
- background-color: var(--background);
11
+ background-color: var(--base);
12
12
  }
13
13
  @media screen and (min-width: 768px) {
14
14
  .mfui-notification {
@@ -187,7 +187,7 @@ h5 {
187
187
  fill: var(--311C);
188
188
  }
189
189
  .mfui-notification_colored .mfui-notification__icon-container {
190
- background-color: var(--stcWhite);
190
+ background-color: var(--base);
191
191
  }
192
192
  .mfui-notification_colored.mfui-notification_type_info {
193
193
  background-color: var(--311C20);
@@ -204,7 +204,7 @@ h5 {
204
204
  .mfui-notification_colored.mfui-notification_type_info .mfui-notification__text,
205
205
  .mfui-notification_colored.mfui-notification_type_warning .mfui-notification__text,
206
206
  .mfui-notification_colored.mfui-notification_type_success .mfui-notification__text {
207
- color: var(--stcBlack);
207
+ color: var(--content);
208
208
  }
209
209
  .mfui-notification_colored.mfui-notification_type_info .mfui-notification__link,
210
210
  .mfui-notification_colored.mfui-notification_type_warning .mfui-notification__link,
@@ -95,6 +95,8 @@ var Search = function Search(_ref) {
95
95
  return onChange && onChange(inputValue);
96
96
  }, changeDelay));
97
97
 
98
+ var highlightedItem = _react["default"].useRef(null);
99
+
98
100
  var handleChange = _react["default"].useCallback(function (e) {
99
101
  var _e$target$value = e.target.value,
100
102
  inputValue = _e$target$value === void 0 ? '' : _e$target$value;
@@ -188,6 +190,17 @@ var Search = function Search(_ref) {
188
190
  }
189
191
  }, [disabled, isFocused]);
190
192
 
193
+ _react["default"].useEffect(function () {
194
+ var _a, _b;
195
+
196
+ if (activeIndex !== -1) {
197
+ (_b = (_a = highlightedItem.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView) === null || _b === void 0 ? void 0 : _b.call(_a, {
198
+ behavior: 'smooth',
199
+ block: 'nearest'
200
+ });
201
+ }
202
+ }, [activeIndex, items]);
203
+
191
204
  var highlightString = function highlightString(title) {
192
205
  var query = searchQuery.replace(/[^A-Z-a-zА-ЯЁа-яё0-9]/g, function (w) {
193
206
  return "\\".concat(w);
@@ -238,6 +251,7 @@ var Search = function Search(_ref) {
238
251
  var itemValue = _ref2.value,
239
252
  searchView = _ref2.searchView;
240
253
  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, i + 1), {
254
+ ref: activeIndex === i ? highlightedItem : null,
241
255
  className: cn('list-item', {
242
256
  active: activeIndex === i
243
257
  }),
@@ -140,29 +140,12 @@ var Select = function Select(_ref) {
140
140
  }, [onClosed, isOpened]);
141
141
 
142
142
  var scrollList = function scrollList(itemIndex) {
143
- if (!itemsNodeList.current.length) {
144
- return;
145
- }
146
-
147
- var wrapper = itemWrapperNode.current;
148
- var item = itemsNodeList.current[itemIndex];
149
-
150
- if (!item || !wrapper) {
151
- return;
152
- }
143
+ var _a, _b;
153
144
 
154
- var wrapperScroll = wrapper === null || wrapper === void 0 ? void 0 : wrapper.scrollTop;
155
- var wrapperHeight = wrapper === null || wrapper === void 0 ? void 0 : wrapper.offsetHeight;
156
- var itemOffset = item.offsetTop;
157
- var itemHeight = item.offsetHeight;
158
-
159
- if (itemOffset + itemHeight > wrapperScroll + wrapperHeight) {
160
- wrapper.scrollTop = itemOffset + itemHeight - wrapperHeight;
161
- }
162
-
163
- if (itemOffset < wrapperScroll) {
164
- wrapper.scrollTop = itemOffset;
165
- }
145
+ (_b = (_a = itemsNodeList.current[itemIndex]) === null || _a === void 0 ? void 0 : _a.scrollIntoView) === null || _b === void 0 ? void 0 : _b.call(_a, {
146
+ behavior: 'smooth',
147
+ block: 'nearest'
148
+ });
166
149
  };
167
150
 
168
151
  (0, React.useEffect)(function () {
@@ -1,6 +1,6 @@
1
1
  .mfui-tile {
2
2
  color: var(--content);
3
- background-color: var(--background);
3
+ background-color: var(--base);
4
4
  }
5
5
  .mfui-tile_radius_rounded {
6
6
  border-radius: 8px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megafon/ui-core",
3
- "version": "3.5.0",
3
+ "version": "3.5.3-beta.0",
4
4
  "files": [
5
5
  "dist",
6
6
  "styles"
@@ -54,7 +54,7 @@
54
54
  "@babel/preset-env": "^7.8.6",
55
55
  "@babel/preset-react": "^7.8.3",
56
56
  "@babel/preset-typescript": "^7.8.3",
57
- "@megafon/ui-icons": "^1.1.1",
57
+ "@megafon/ui-icons": "^2.0.0-beta.0",
58
58
  "@svgr/core": "^2.4.1",
59
59
  "@testing-library/react-hooks": "^7.0.1",
60
60
  "@types/enzyme": "^3.10.5",
@@ -86,7 +86,7 @@
86
86
  "dependencies": {
87
87
  "@babel/runtime": "^7.8.4",
88
88
  "@datepicker-react/hooks": "^2.7.0",
89
- "@megafon/ui-helpers": "^2.1.1",
89
+ "@megafon/ui-helpers": "^2.1.2",
90
90
  "@popperjs/core": "^2.5.3",
91
91
  "core-js": "^3.6.4",
92
92
  "date-fns": "^2.16.1",
@@ -97,5 +97,5 @@
97
97
  "react-popper": "^2.2.3",
98
98
  "swiper": "^6.5.6"
99
99
  },
100
- "gitHead": "48ac683c2daf04dfdc42d1359024800699f2e7dc"
100
+ "gitHead": "d8f15c21373bd06b111df24c20cdfae1ce328afa"
101
101
  }
@@ -44,19 +44,19 @@
44
44
  --stcBlack50: #33333380;
45
45
 
46
46
  /* Soft (new) */
47
- --brandGreen80: #0CDC78;
48
- --brandGreen20: #DDFFEC;
49
- --brandPurple80: #AA67C1;
50
- --brandPurple20: #FFEEFF;
51
- --warmRedC80: #FF765D;
52
- --warmRedC20: #FFCFC7;
53
- --137C80: #FFB945;
54
- --137C20: #FFEDD1;
55
- --311C80: #62E3FF;
56
- --311C20: #E1FAFF;
57
- --reflexBlue80: #554FC9;
58
- --reflexBlue20: #EBEAFF;
59
- --fury80: #F8505D;
60
- --fury20: #FFC5C9;
47
+ --brandGreen80: #24804E;
48
+ --brandGreen20: #314138;
49
+ --brandPurple80: #5C2C64;
50
+ --brandPurple20: #38273C;
51
+ --warmRedC80: #B85B4A;
52
+ --warmRedC20: #422A26;
53
+ --137C80: #BC862E;
54
+ --137C20: #4A3D27;
55
+ --311C80: #5B9DA3;
56
+ --311C20: #35484A;
57
+ --reflexBlue80: #4B497C;
58
+ --reflexBlue20: #2F2F3C;
59
+ --fury80: #CA3A43;
60
+ --fury20: #442B2D;
61
61
  }
62
62
  }