@webitel/ui-sdk 24.6.17 → 24.6.18

package/src/components/wt-app-header/assets/supervisor-dark.svg

@@ -1,74 +1,74 @@
 <svg width="100" height="85" viewBox="0 0 100 85" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_8126_6168)">
-<rect x="1.94174" y="1.93164" width="96.1165" height="4.82955" rx="2" fill="#14171F"/>
-<rect x="1.94174" y="19.3184" width="96.1165" height="4.82955" rx="2" fill="#2B3040"/>
-<rect x="1.94174" y="26.0796" width="96.1165" height="56.9886" rx="2" fill="#2B3040"/>
-<rect x="3.8835" y="28.0112" width="92.233" height="4.82955" rx="2" fill="#5A6587"/>
-<rect x="3.8835" y="34.7729" width="92.233" height="4.82955" rx="2" fill="#272C3A"/>
-<rect x="3.8835" y="46.3638" width="92.233" height="4.82955" rx="2" fill="#272C3A"/>
-<rect x="3.8835" y="57.9546" width="92.233" height="4.82955" rx="2" fill="#272C3A"/>
-<rect x="3.8835" y="69.5454" width="92.233" height="4.82955" rx="2" fill="#272C3A"/>
-<rect x="1.94174" y="8.69336" width="96.1165" height="8.69318" rx="2" fill="#2B3040"/>
-<rect x="5.82524" y="12.5566" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="5.82524" y="21.25" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="21.3592" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#919AB6"/>
-<rect x="83.4951" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#919AB6"/>
-<rect x="88.3495" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#919AB6"/>
-<rect x="93.2039" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#919AB6"/>
-<rect x="87.3786" y="10.625" width="8.73786" height="4.82955" rx="1" fill="#C9981D"/>
-<rect x="62.6359" y="11.125" width="21.3301" height="3.82955" rx="0.5" stroke="#737EA1"/>
-<rect x="5.82524" y="36.7046" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="66.9903" y="36.7046" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="74.7573" y="36.7046" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="28.1553" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="42.5" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="66.9903" y="42.5" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="74.7573" y="42.5" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="28.1553" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="54.0908" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="66.9903" y="54.0908" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="74.7573" y="54.0908" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="28.1553" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="65.6816" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="66.9903" y="65.6816" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="74.7573" y="65.6816" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="28.1553" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="77.2725" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="66.9903" y="77.2725" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="74.7573" y="77.2725" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="28.1553" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="48.2954" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="66.9903" y="48.2954" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="74.7573" y="48.2954" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="28.1553" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="59.8862" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="66.9903" y="59.8862" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="74.7573" y="59.8862" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="28.1553" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="71.4771" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="66.9903" y="71.4771" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="74.7573" y="71.4771" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
-<rect x="28.1553" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-</g>
-<defs>
-<clipPath id="clip0_8126_6168">
-<rect width="100" height="85" fill="white"/>
-</clipPath>
-</defs>
+    <g clip-path="url(#clip0_8126_6168)">
+        <rect x="1.94174" y="1.93164" width="96.1165" height="4.82955" rx="2" fill="#14171F"/>
+        <rect x="1.94174" y="19.3184" width="96.1165" height="4.82955" rx="2" fill="#2B3040"/>
+        <rect x="1.94174" y="26.0796" width="96.1165" height="56.9886" rx="2" fill="#2B3040"/>
+        <rect x="3.8835" y="28.0112" width="92.233" height="4.82955" rx="2" fill="#5A6587"/>
+        <rect x="3.8835" y="34.7729" width="92.233" height="4.82955" rx="2" fill="#272C3A"/>
+        <rect x="3.8835" y="46.3638" width="92.233" height="4.82955" rx="2" fill="#272C3A"/>
+        <rect x="3.8835" y="57.9546" width="92.233" height="4.82955" rx="2" fill="#272C3A"/>
+        <rect x="3.8835" y="69.5454" width="92.233" height="4.82955" rx="2" fill="#272C3A"/>
+        <rect x="1.94174" y="8.69336" width="96.1165" height="8.69318" rx="2" fill="#2B3040"/>
+        <rect x="5.82524" y="12.5566" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="5.82524" y="21.25" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="21.3592" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#919AB6"/>
+        <rect x="83.4951" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#919AB6"/>
+        <rect x="88.3495" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#919AB6"/>
+        <rect x="93.2039" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#919AB6"/>
+        <rect x="87.3786" y="10.625" width="8.73786" height="4.82955" rx="1" fill="#C9981D"/>
+        <rect x="62.6359" y="11.125" width="21.3301" height="3.82955" rx="0.5" stroke="#737EA1"/>
+        <rect x="5.82524" y="36.7046" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="66.9903" y="36.7046" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="74.7573" y="36.7046" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="28.1553" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="42.5" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="66.9903" y="42.5" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="74.7573" y="42.5" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="28.1553" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="54.0908" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="66.9903" y="54.0908" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="74.7573" y="54.0908" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="28.1553" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="65.6816" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="66.9903" y="65.6816" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="74.7573" y="65.6816" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="28.1553" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="77.2725" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="66.9903" y="77.2725" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="74.7573" y="77.2725" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="28.1553" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="48.2954" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="66.9903" y="48.2954" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="74.7573" y="48.2954" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="28.1553" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="59.8862" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="66.9903" y="59.8862" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="74.7573" y="59.8862" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="28.1553" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="71.4771" width="13.5922" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="66.9903" y="71.4771" width="4.85437" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="74.7573" y="71.4771" width="19.4175" height="0.965909" rx="0.482955" fill="#AFB6CA"/>
+        <rect x="28.1553" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+    </g>
+    <defs>
+        <clipPath id="clip0_8126_6168">
+            <rect width="100" height="85" fill="white"/>
+        </clipPath>
+    </defs>
 </svg>

package/src/components/wt-app-header/assets/supervisor-light.svg

@@ -1,74 +1,74 @@
 <svg width="100" height="85" viewBox="0 0 100 85" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g clip-path="url(#clip0_8126_5684)">
-<rect x="1.94174" y="1.93164" width="96.1165" height="4.82955" rx="2" fill="#D1D5E0"/>
-<rect x="1.94174" y="19.3184" width="96.1165" height="4.82955" rx="2" fill="#F3F4F7"/>
-<rect x="1.94174" y="26.0796" width="96.1165" height="56.9886" rx="2" fill="#F3F4F7"/>
-<rect x="3.8835" y="28.0112" width="92.233" height="4.82955" rx="2" fill="#737EA1"/>
-<rect x="3.8835" y="34.7729" width="92.233" height="4.82955" rx="2" fill="#EDEEF3"/>
-<rect x="3.8835" y="46.3638" width="92.233" height="4.82955" rx="2" fill="#EDEEF3"/>
-<rect x="3.8835" y="57.9546" width="92.233" height="4.82955" rx="2" fill="#EDEEF3"/>
-<rect x="3.8835" y="69.5454" width="92.233" height="4.82955" rx="2" fill="#EDEEF3"/>
-<rect x="1.94174" y="8.69336" width="96.1165" height="8.69318" rx="2" fill="#F3F4F7"/>
-<rect x="5.82524" y="12.5566" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="5.82524" y="21.25" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="21.3592" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#454E68"/>
-<rect x="83.4951" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#454E68"/>
-<rect x="88.3495" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#454E68"/>
-<rect x="93.2039" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#454E68"/>
-<rect x="87.3786" y="10.625" width="8.73786" height="4.82955" rx="1" fill="#FAB404"/>
-<rect x="62.6359" y="11.125" width="21.3301" height="3.82955" rx="0.5" stroke="#5A6587"/>
-<rect x="5.82524" y="36.7046" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="66.9903" y="36.7046" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="74.7573" y="36.7046" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="28.1553" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="42.5" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="66.9903" y="42.5" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="74.7573" y="42.5" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="28.1553" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="54.0908" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="66.9903" y="54.0908" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="74.7573" y="54.0908" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="28.1553" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="65.6816" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="66.9903" y="65.6816" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="74.7573" y="65.6816" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="28.1553" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="77.2725" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="66.9903" y="77.2725" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="74.7573" y="77.2725" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="28.1553" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="48.2954" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="66.9903" y="48.2954" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="74.7573" y="48.2954" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="28.1553" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="59.8862" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="66.9903" y="59.8862" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="74.7573" y="59.8862" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="28.1553" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-<rect x="5.82524" y="71.4771" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="66.9903" y="71.4771" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="74.7573" y="71.4771" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
-<rect x="28.1553" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
-<rect x="39.8058" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
-<rect x="51.4563" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
-</g>
-<defs>
-<clipPath id="clip0_8126_5684">
-<rect width="100" height="85" fill="white"/>
-</clipPath>
-</defs>
+    <g clip-path="url(#clip0_8126_5684)">
+        <rect x="1.94174" y="1.93164" width="96.1165" height="4.82955" rx="2" fill="#D1D5E0"/>
+        <rect x="1.94174" y="19.3184" width="96.1165" height="4.82955" rx="2" fill="#F3F4F7"/>
+        <rect x="1.94174" y="26.0796" width="96.1165" height="56.9886" rx="2" fill="#F3F4F7"/>
+        <rect x="3.8835" y="28.0112" width="92.233" height="4.82955" rx="2" fill="#737EA1"/>
+        <rect x="3.8835" y="34.7729" width="92.233" height="4.82955" rx="2" fill="#EDEEF3"/>
+        <rect x="3.8835" y="46.3638" width="92.233" height="4.82955" rx="2" fill="#EDEEF3"/>
+        <rect x="3.8835" y="57.9546" width="92.233" height="4.82955" rx="2" fill="#EDEEF3"/>
+        <rect x="3.8835" y="69.5454" width="92.233" height="4.82955" rx="2" fill="#EDEEF3"/>
+        <rect x="1.94174" y="8.69336" width="96.1165" height="8.69318" rx="2" fill="#F3F4F7"/>
+        <rect x="5.82524" y="12.5566" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="5.82524" y="21.25" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="21.3592" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#454E68"/>
+        <rect x="83.4951" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#454E68"/>
+        <rect x="88.3495" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#454E68"/>
+        <rect x="93.2039" y="21.25" width="2.91262" height="0.965909" rx="0.482955" fill="#454E68"/>
+        <rect x="87.3786" y="10.625" width="8.73786" height="4.82955" rx="1" fill="#FAB404"/>
+        <rect x="62.6359" y="11.125" width="21.3301" height="3.82955" rx="0.5" stroke="#5A6587"/>
+        <rect x="5.82524" y="36.7046" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="66.9903" y="36.7046" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="74.7573" y="36.7046" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="28.1553" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="35.7388" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="42.5" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="66.9903" y="42.5" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="74.7573" y="42.5" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="28.1553" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="41.5342" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="54.0908" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="66.9903" y="54.0908" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="74.7573" y="54.0908" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="28.1553" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="53.125" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="65.6816" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="66.9903" y="65.6816" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="74.7573" y="65.6816" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="28.1553" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="64.7158" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="77.2725" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="66.9903" y="77.2725" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="74.7573" y="77.2725" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="28.1553" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="76.3066" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="48.2954" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="66.9903" y="48.2954" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="74.7573" y="48.2954" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="28.1553" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="47.3296" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="59.8862" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="66.9903" y="59.8862" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="74.7573" y="59.8862" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="28.1553" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="58.9204" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+        <rect x="5.82524" y="71.4771" width="13.5922" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="66.9903" y="71.4771" width="4.85437" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="74.7573" y="71.4771" width="19.4175" height="0.965909" rx="0.482955" fill="#313749"/>
+        <rect x="28.1553" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#169C18"/>
+        <rect x="39.8058" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#F6AB55"/>
+        <rect x="51.4563" y="70.5112" width="2.91262" height="2.89773" rx="1.44886" fill="#CDD1DE"/>
+    </g>
+    <defs>
+        <clipPath id="clip0_8126_5684">
+            <rect width="100" height="85" fill="white"/>
+        </clipPath>
+    </defs>
 </svg>

package/src/components/wt-app-header/wt-app-header.vue

@@ -17,10 +17,10 @@
   display: flex;
   align-items: center;
   justify-content: flex-end;
-  gap: var(--wt-app-header-content-gap);
+  box-sizing: border-box;
   min-height: var(--wt-app-header-min-height); // fixed height because anything can be put inside slot, so padding won't work properly
   padding: var(--wt-app-header-padding);
-  box-sizing: border-box;
   background: var(--wt-app-header-background);
+  gap: var(--wt-app-header-content-gap);
 }
 </style>

package/src/components/wt-app-header/wt-app-navigator.vue

@@ -56,7 +56,7 @@
 
 <script setup>
 import { computed, ref } from 'vue';
-import WebitelApplications from '../../enums/WebitelApplications/WebitelApplications.enum';
+import WebitelApplications from '../../enums/WebitelApplications/WebitelApplications.enum.js';
 
 import AdminDark from './assets/admin-dark.svg';
 import AdminLight from './assets/admin-light.svg';

package/src/components/wt-app-header/wt-header-actions.vue

@@ -146,7 +146,6 @@ export default {
   right: 0;
   display: flex;
   flex-direction: column;
-  gap: var(--wt-header-actions-content-sections-gap);
   min-width: var(--wt-header-actions-min-width);
   margin-top: var(--wt-app-header-content-panel-margin);
   padding: var(--wt-header-actions-padding);
@@ -154,6 +153,7 @@ export default {
   border-radius: var(--border-radius);
   background: var(--wt-app-header-content-bg-color);
   box-shadow: var(--elevation-10);
+  gap: var(--wt-header-actions-content-sections-gap);
 }
 
 .wt-header-actions__name {

package/src/components/wt-avatar/wt-avatar.vue

@@ -1,7 +1,7 @@
 <template>
   <div
-    class="wt-avatar"
     :class="[`wt-avatar--size-${size}`]"
+    class="wt-avatar"
   >
     <wt-badge
       v-if="badge"
@@ -10,16 +10,16 @@
     />
     <div
       v-if="isLetterAvatar"
-      class="wt-avatar__letters"
       :style="{ background: `var(${avatarLettersBackground})` }"
+      class="wt-avatar__letters"
     >
       {{ avatarLetters }}
     </div>
     <img
       v-else
-      class="wt-avatar__img"
       :src="imgSrc"
       alt="avatar"
+      class="wt-avatar__img"
     >
   </div>
 </template>
@@ -27,7 +27,7 @@
 <script setup>
 import { computed } from 'vue';
 import defaultAvatar from '../../assets/components/atoms/wt-avatar/default-avatar.svg';
-import AbstractUserStatus from '../../enums/AbstractUserStatus/AbstractUserStatus.enum';
+import AbstractUserStatus from '../../enums/AbstractUserStatus/AbstractUserStatus.enum.js';
 
 const props = defineProps({
   src: {
@@ -88,7 +88,7 @@ const isBadge = computed(() => {
   const eligibleStatuses = [
     AbstractUserStatus.DND,
     AbstractUserStatus.ONLINE,
-    AbstractUserStatus.PAUSE
+    AbstractUserStatus.PAUSE,
   ];
   return eligibleStatuses.includes(props.status);
 });
@@ -143,10 +143,10 @@ const badgeColorVar = computed(() => {
   border-radius: 50%;
 
   &__letters {
-    height: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
+    height: 100%;
     color: var(--wt-avatar-text-color);
     border-radius: 50%;
   }

package/src/components/wt-badge/wt-badge.vue

@@ -1,14 +1,14 @@
 <template>
   <aside
-    class="wt-badge"
     :class="{ 'wt-badge--outside': outside }"
     :style="{ background: `var(--${colorVariable})` }"
+    class="wt-badge"
   >
     <img
       v-if="iconBadgePic"
-      class="wt-badge__pic"
-      :src="iconBadgePic"
       :alt="iconBadge"
+      :src="iconBadgePic"
+      class="wt-badge__pic"
     >
   </aside>
 </template>
@@ -17,7 +17,7 @@
 import BadgeDnd from '../../assets/icons/badge-dnd.svg';
 import BadgeOnline from '../../assets/icons/badge-online.svg';
 import BadgePause from '../../assets/icons/badge-pause.svg';
-import AbstractUserStatus from '../../enums/AbstractUserStatus/AbstractUserStatus.enum';
+import AbstractUserStatus from '../../enums/AbstractUserStatus/AbstractUserStatus.enum.js';
 
 export default {
   name: 'WtBadge',

package/src/components/wt-button/__tests__/WtButton.spec.js

@@ -1,6 +1,6 @@
 import { shallowMount } from '@vue/test-utils';
-import WtButton from '../wt-button.vue';
 import WtLoader from '../../wt-loader/wt-loader.vue';
+import WtButton from '../wt-button.vue';
 
 describe('WtButton', () => {
   it('renders a component', () => {

package/src/components/wt-button/wt-button.vue

@@ -1,6 +1,5 @@
 <template>
   <button
-    class="wt-button"
     :class="[
       colorClass,
       `wt-button--size-${size}`,
@@ -11,15 +10,16 @@
         'wt-button--loading': showLoader,
       }
     ]"
-    type="button"
     :disabled="disabled"
+    class="wt-button"
+    type="button"
     @click="$emit('click', $event)"
   >
     <!--  Show loader and button contents at the same time to prevent width shift if content > min-width of button -->
     <wt-loader
       v-if="showLoader"
-      size="sm"
       :color="loaderColor"
+      size="sm"
     />
     <div class="wt-button__contents">
       <slot>
@@ -114,17 +114,17 @@ export default {
 <style lang="scss" scoped>
 .wt-button {
   @extend %typo-button;
-  box-sizing: border-box;
   position: relative;
   display: inline-block;
+  box-sizing: border-box;
   min-width: var(--btn-min-width);
   padding: var(--btn-padding);
+  cursor: pointer;
+  transition: var(--transition);
   color: var(--btn-primary-text-color);
+  border-radius: var(--border-radius);
   background-color: var(--btn-primary-color);
   background-clip: padding-box;
-  border-radius: var(--border-radius);
-  transition: var(--transition);
-  cursor: pointer;
 
   &__contents {
     display: contents;
@@ -230,10 +230,10 @@ export default {
   }
 
   &.wt-button--disabled {
-    color: var(--btn-disabled-text-color);
-    background-color: var(--btn-disabled-color);
     cursor: auto;
     pointer-events: none;
+    color: var(--btn-disabled-text-color);
+    background-color: var(--btn-disabled-color);
     box-shadow: none;
   }
 

package/src/components/wt-button-select/__tests__/WtButtonSelect.spec.js

@@ -1,4 +1,4 @@
-import { shallowMount, mount } from '@vue/test-utils';
+import { mount, shallowMount } from '@vue/test-utils';
 import WtSelectButton from '../wt-button-select.vue';
 
 // helps to mock @floating-ui/vue autoUpdate method
@@ -31,10 +31,12 @@ describe('WtSelectButton', () => {
       },
     });
     const arrowBtn = wrapper.findAllComponents({ name: 'wt-button' })
-           .find((component) => component.classes().includes('wt-button-select__select-btn'));
+    .find((component) => component.classes()
+    .includes('wt-button-select__select-btn'));
     arrowBtn.vm.$emit('click');
     await wrapper.vm.$nextTick();
     const wtIcon = wrapper.find('.wt-button-select__select-arrow');
-    expect(wtIcon.classes()).toContain('wt-button-select__select-arrow--active');
+    expect(wtIcon.classes())
+    .toContain('wt-button-select__select-arrow--active');
   });
 });

package/src/components/wt-button-select/wt-button-select.vue

@@ -4,10 +4,10 @@
     class="wt-button-select"
   >
     <wt-button
-      v-bind="$attrs"
       :color="color"
       :disabled="disabled"
       class="wt-button-select__button"
+      v-bind="$attrs"
       @click="$emit('click', $event)"
     >
       <slot />
@@ -20,11 +20,11 @@
     >
       <template #activator>
         <wt-button
-          v-bind="$attrs"
           :color="color"
           :disabled="disabled"
           :loading="false"
           class="wt-button-select__select-btn"
+          v-bind="$attrs"
           @click="isOpened = !isOpened"
         >
           <wt-icon

package/src/components/wt-checkbox/__tests__/WtCheckbox.spec.js

@@ -1,7 +1,7 @@
-import { shallowMount, mount } from '@vue/test-utils';
-import WtCheckbox from '../wt-checkbox.vue';
-import WtLabel from '../../wt-label/wt-label.vue';
+import { mount, shallowMount } from '@vue/test-utils';
 import WtIcon from '../../wt-icon/wt-icon.vue';
+import WtLabel from '../../wt-label/wt-label.vue';
+import WtCheckbox from '../wt-checkbox.vue';
 
 describe('WtCheckbox', () => {
   it('renders a component', () => {