@ssa-ui-kit/core 0.0.36-alpha → 1.0.1

package/src/components/Icon/icons/Diet.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Diet = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Diet = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Diet',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -8,10 +13,12 @@ export const Diet = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Diet</title>
+    <title>{tooltip}</title>
     <path
       d="M15.3794 1.6875C15.3294 1.68734 15.2788 1.69189 15.2278 1.70215C14.1195 1.92375 13.0319 2.82406 12.4431 3.96241C8.37168 4.3361 5.25 9.29549 5.25 15.5625C5.25 19.2844 8.27812 22.3125 12 22.3125C15.7219 22.3125 18.75 19.2844 18.75 15.5625C18.75 13.7303 18.0635 12.4566 17.3994 11.2251C16.7443 10.009 16.125 8.86013 16.125 7.125C16.125 5.77573 15.2807 4.62307 14.094 4.1587C14.5181 3.61873 15.077 3.26196 15.5222 3.17286C15.9283 3.09186 16.1917 2.69641 16.1104 2.29029C16.0395 1.93493 15.7292 1.68864 15.3794 1.6875ZM12.9441 5.43824C13.8714 5.4419 14.625 6.19689 14.625 7.125C14.625 9.2385 15.3982 10.6714 16.0796 11.9363C16.7077 13.1018 17.25 14.1086 17.25 15.5625C17.25 18.4575 14.895 20.8125 12 20.8125C9.105 20.8125 6.75 18.4575 6.75 15.5625C6.75 10.0089 9.49693 5.4871 12.884 5.4397C12.9054 5.44185 12.9236 5.43802 12.9441 5.43824ZM12 11.4375C10.2319 11.4375 9 13.6247 9 15.5874C9 17.5599 10.2337 18.9375 12 18.9375C13.7662 18.9375 15 17.5599 15 15.5874C15 13.6247 13.7681 11.4375 12 11.4375ZM12 12.9375C12.6611 12.9375 13.5 14.1849 13.5 15.5874C13.5 16.7109 12.9113 17.4375 12 17.4375C11.0887 17.4375 10.5 16.7109 10.5 15.5874C10.5 14.1849 11.3389 12.9375 12 12.9375Z"
       fill={fill}
     />
   </svg>
 );
+
+export const ICON_NAME = 'diet';

package/src/components/Icon/icons/Edit.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Edit = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Edit = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Edit',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const Edit = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Edit</title>
+    <title>{tooltip}</title>
     <g id="Edit">
       <g id="Union">
         <path
@@ -28,3 +33,5 @@ export const Edit = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     </g>
   </svg>
 );
+
+export const ICON_NAME = 'edit';

package/src/components/Icon/icons/Email.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Email = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Email = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Email',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const Email = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Email</title>
+    <title>{tooltip}</title>
     <path
       fillRule="evenodd"
       clipRule="evenodd"
@@ -18,3 +23,5 @@ export const Email = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'email';

package/src/components/Icon/icons/Filter.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Filter = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Filter = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Filter',
+  ...props
+}: SVGProps) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width={`${size}px`}
@@ -8,7 +13,7 @@ export const Filter = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     viewBox="0 0 21 20"
     fill="none"
     {...props}>
-    <title>Filter</title>
+    <title>{tooltip}</title>
     <path
       fillRule="evenodd"
       clipRule="evenodd"
@@ -17,3 +22,5 @@ export const Filter = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'filter';

package/src/components/Icon/icons/Home.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Home = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Home = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Home',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -8,10 +13,12 @@ export const Home = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Home</title>
+    <title>{tooltip}</title>
     <path
       d="M8.97559 0.250119C8.81566 0.25558 8.66168 0.312041 8.53613 0.411252L1.42969 6.00988C0.527739 6.7207 0 7.80687 0 8.9552V18.5001C0 19.1819 0.568203 19.7501 1.25 19.7501H6.25C6.9318 19.7501 7.5 19.1819 7.5 18.5001V13.5001C7.5 13.3526 7.60248 13.2501 7.75 13.2501H10.25C10.3975 13.2501 10.5 13.3526 10.5 13.5001V18.5001C10.5 19.1819 11.0682 19.7501 11.75 19.7501H16.75C17.4318 19.7501 18 19.1819 18 18.5001V8.9552C18 7.80687 17.4723 6.7207 16.5703 6.00988L9.46387 0.411252C9.32518 0.301689 9.15225 0.244623 8.97559 0.250119ZM9 1.9552L15.6426 7.1886C16.1846 7.61578 16.5 8.26552 16.5 8.9552V18.2501H12V13.5001C12 12.5426 11.2075 11.7501 10.25 11.7501H7.75C6.79252 11.7501 6 12.5426 6 13.5001V18.2501H1.5V8.9552C1.5 8.26552 1.81537 7.61578 2.35742 7.1886L9 1.9552Z"
       fill={fill}
     />
   </svg>
 );
+
+export const ICON_NAME = 'home';

package/src/components/Icon/icons/Import.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Import = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Import = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Import',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const Import = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Import</title>
+    <title>{tooltip}</title>
     <g id="box-arrow-in-down">
       <path
         id="box-arrow-bg"
@@ -29,3 +34,5 @@ export const Import = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     </g>
   </svg>
 );
+
+export const ICON_NAME = 'import';

package/src/components/Icon/icons/Information.tsx

@@ -3,6 +3,7 @@ import { SVGProps } from '@components/Icon/types';
 export const Information = ({
   fill = '#000',
   size = 24,
+  tooltip = 'Information',
   ...props
 }: SVGProps) => (
   <svg
@@ -13,7 +14,7 @@ export const Information = ({
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Information</title>
+    <title>{tooltip}</title>
     <path
       d="M9.99998 17.8889C14.3651 17.8889 17.9365 14.3175 17.9365 9.95238C17.9365 5.5873 14.3651 2.01587 9.99998 2.01587C5.6349 2.01587 2.06348 5.5873 2.06348 9.95238C2.06348 14.3175 5.6349 17.8889 9.99998 17.8889Z"
       stroke={fill}
@@ -27,3 +28,5 @@ export const Information = ({
     />
   </svg>
 );
+
+export const ICON_NAME = 'information';

package/src/components/Icon/icons/Invisible.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Invisible = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Invisible = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Invisible',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const Invisible = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Invisible</title>
+    <title>{tooltip}</title>
     <path
       d="M14.5299 9.46992L9.46992 14.5299C8.81992 13.8799 8.41992 12.9899 8.41992 11.9999C8.41992 10.0199 10.0199 8.41992 11.9999 8.41992C12.9899 8.41992 13.8799 8.81992 14.5299 9.46992Z"
       stroke={fill}
@@ -54,3 +59,5 @@ export const Invisible = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'invisible';

package/src/components/Icon/icons/Lock.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Lock = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Lock = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Lock',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,10 +14,12 @@ export const Lock = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Lock</title>
+    <title>{tooltip}</title>
     <path
       d="M13.625 8.41602H13V5.91602C13 3.15852 10.7575 0.916016 8 0.916016C5.2425 0.916016 3 3.15852 3 5.91602V8.41602H2.375C1.34167 8.41602 0.5 9.25685 0.5 10.291V19.041C0.5 20.0752 1.34167 20.916 2.375 20.916H13.625C14.6583 20.916 15.5 20.0752 15.5 19.041V10.291C15.5 9.25685 14.6583 8.41602 13.625 8.41602ZM4.66667 5.91602C4.66667 4.07768 6.16167 2.58268 8 2.58268C9.83833 2.58268 11.3333 4.07768 11.3333 5.91602V8.41602H4.66667V5.91602ZM8.83333 14.851V16.7493C8.83333 17.2093 8.46083 17.5827 8 17.5827C7.53917 17.5827 7.16667 17.2093 7.16667 16.7493V14.851C6.67083 14.5618 6.33333 14.0302 6.33333 13.416C6.33333 12.4968 7.08083 11.7493 8 11.7493C8.91917 11.7493 9.66667 12.4968 9.66667 13.416C9.66667 14.0302 9.32917 14.5618 8.83333 14.851Z"
       fill={fill}
     />
   </svg>
 );
+
+export const ICON_NAME = 'lock';

package/src/components/Icon/icons/LogIn.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const LogIn = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const LogIn = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Log in',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const LogIn = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Log in</title>
+    <title>{tooltip}</title>
     <path
       d="M7.39504 9.17067C8.58623 9.17067 9.61771 8.74344 10.4605 7.90051C11.3033 7.05773 11.7305 6.02652 11.7305 4.8352C11.7305 3.64428 11.3033 2.61294 10.4604 1.76988C9.61743 0.92723 8.58609 0.5 7.39504 0.5C6.20371 0.5 5.17251 0.92723 4.32972 1.77002C3.48694 2.6128 3.05957 3.64414 3.05957 4.8352C3.05957 6.02652 3.48694 7.05786 4.32986 7.90065C5.17279 8.7433 6.20413 9.17067 7.39504 9.17067Z"
       fill={fill}
@@ -20,3 +25,5 @@ export const LogIn = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'log-in';

package/src/components/Icon/icons/LogOut.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const LogOut = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const LogOut = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Log out',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const LogOut = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Log out</title>
+    <title>{tooltip}</title>
     <path
       d="M7.9751 13.7292H2.36876C2.0249 13.7292 1.74585 13.4502 1.74585 13.1063V1.89369C1.74585 1.54983 2.02493 1.27078 2.36876 1.27078H7.9751C8.31957 1.27078 8.59801 0.992344 8.59801 0.647871C8.59801 0.303398 8.31957 0.0249023 7.9751 0.0249023H2.36876C1.33845 0.0249023 0.5 0.863379 0.5 1.89369V13.1063C0.5 14.1366 1.33845 14.9751 2.36876 14.9751H7.9751C8.31957 14.9751 8.59801 14.6966 8.59801 14.3522C8.59801 14.0077 8.31957 13.7292 7.9751 13.7292Z"
       fill={fill}
@@ -20,3 +25,5 @@ export const LogOut = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'log-out';

package/src/components/Icon/icons/Measurements.tsx

@@ -3,6 +3,7 @@ import { SVGProps } from '@components/Icon/types';
 export const Measurements = ({
   fill = '#000',
   size = 24,
+  tooltip = 'Measurements',
   ...props
 }: SVGProps) => (
   <svg
@@ -12,7 +13,7 @@ export const Measurements = ({
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Measurements</title>
+    <title>{tooltip}</title>
     <path
       d="M8.8254 2C5 2 2 3.60317 2 5.65079V13.5873C2 15.2222 3.95238 16.6349 6.84127 17.0794H6.92064C7.15873 17.0794 7.34921 16.9048 7.39683 16.6825C7.44444 16.4286 7.25397 16.1745 7 16.1428C4.65079 15.7777 2.95238 14.6984 2.95238 13.5873V7.53974C4.12698 8.60324 6.30159 9.30159 8.8254 9.30159H19.1429C20.1905 9.30159 21.0476 10.1587 21.0476 11.2063C21.0476 12.254 20.1905 13.1111 19.1429 13.1111H10.4127C9.26984 13.1111 8.34921 14.0317 8.34921 15.1746V19.9365C8.34921 21.0794 9.26984 22 10.4127 22H19.1429C20.7143 22 22 20.7143 22 19.1429V11.2063C22 9.63492 20.7143 8.34921 19.1429 8.34921H8.8254C5.31746 8.34921 2.95238 6.95238 2.95238 5.65079C2.95238 4.34921 5.31746 2.95238 8.8254 2.95238C12.3333 2.95238 14.6984 4.34921 14.6984 5.65079V6.92064C14.6984 7.19048 14.9048 7.39683 15.1746 7.39683C15.4444 7.39683 15.6508 7.19048 15.6508 6.92064V5.65079C15.6508 3.60317 12.6508 2 8.8254 2ZM8.8254 4.85714C8.40442 4.85714 8.00068 4.94076 7.70301 5.0896C7.40533 5.23844 7.2381 5.4403 7.2381 5.65079C7.2381 5.86128 7.40533 6.06315 7.70301 6.21199C8.00068 6.36083 8.40442 6.44444 8.8254 6.44444C9.24638 6.44444 9.65011 6.36083 9.94779 6.21199C10.2455 6.06315 10.4127 5.86128 10.4127 5.65079C10.4127 5.4403 10.2455 5.23844 9.94779 5.0896C9.65011 4.94076 9.24638 4.85714 8.8254 4.85714ZM21.0476 13.3334V19.1429C21.0476 20.1905 20.1905 21.0476 19.1429 21.0476H10.4127C9.79365 21.0476 9.30159 20.5556 9.30159 19.9365V15.1746C9.30159 14.5556 9.79365 14.0635 10.4127 14.0635H13.1111V15.9683C13.1111 16.2381 13.3175 16.4444 13.5873 16.4444C13.8571 16.4444 14.0635 16.2381 14.0635 15.9683V14.0635H17.873V15.9683C17.873 16.2381 18.0794 16.4444 18.3492 16.4444C18.619 16.4444 18.8254 16.2381 18.8254 15.9683V14.0635H19.1429C19.873 14.0635 20.5397 13.7937 21.0476 13.3334Z"
       fill={fill}
@@ -21,3 +22,5 @@ export const Measurements = ({
     />
   </svg>
 );
+
+export const ICON_NAME = 'measurements';

package/src/components/Icon/icons/Minus.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Minus = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Minus = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Minus',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const Minus = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Minus</title>
+    <title>{tooltip}</title>
     <path
       d="M1 1H9"
       stroke={fill}
@@ -19,3 +24,5 @@ export const Minus = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'minus';

package/src/components/Icon/icons/More.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const More = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const More = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'More',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -8,7 +13,7 @@ export const More = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>More</title>
+    <title>{tooltip}</title>
     <path
       d="M5.4001 10.2C4.4101 10.2 3.6001 11.01 3.6001 12C3.6001 12.99 4.4101 13.8 5.4001 13.8C6.3901 13.8 7.2001 12.99 7.2001 12C7.2001 11.01 6.3901 10.2 5.4001 10.2Z"
       fill={fill}
@@ -23,3 +28,5 @@ export const More = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'more';

package/src/components/Icon/icons/MoreVertical.tsx

@@ -3,6 +3,7 @@ import { SVGProps } from '@components/Icon/types';
 export const MoreVertical = ({
   fill = '#000',
   size = 24,
+  tooltip = 'More vertical',
   ...props
 }: SVGProps) => (
   <svg
@@ -12,9 +13,11 @@ export const MoreVertical = ({
     viewBox="0 0 4 16"
     fill="none"
     {...props}>
-    <title>More vertical</title>
+    <title>{tooltip}</title>
     <circle cx="1.66016" cy="2" r="1.5" fill={fill} />
     <circle cx="1.66016" cy="8" r="1.5" fill={fill} />
     <circle cx="1.66016" cy="14" r="1.5" fill={fill} />
   </svg>
 );
+
+export const ICON_NAME = 'more-vertical';

package/src/components/Icon/icons/Notification.tsx

@@ -3,6 +3,7 @@ import { SVGProps } from '@components/Icon/types';
 export const Notification = ({
   fill = '#000',
   size = 24,
+  tooltip = 'Notification',
   ...props
 }: SVGProps) => (
   <svg
@@ -12,7 +13,7 @@ export const Notification = ({
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Notification</title>
+    <title>{tooltip}</title>
     <path
       d="M0.776752 7.36345C0.819992 7.37426 0.865032 7.37966 0.908271 7.37966C1.14969 7.37966 1.37129 7.21572 1.43255 6.97069C1.9334 4.96728 3.12608 3.19267 4.78899 1.97837C5.0304 1.80181 5.08265 1.46491 4.90609 1.22349C4.72953 0.98207 4.39263 0.929823 4.15121 1.10638C2.28472 2.47022 0.946106 4.45922 0.383997 6.70946C0.31013 6.99772 0.48669 7.29138 0.776752 7.36345ZM15.2114 1.97837C16.8743 3.19267 18.0652 4.96548 18.5679 6.97069C18.6291 7.21572 18.8489 7.37966 19.0921 7.37966C19.1354 7.37966 19.1804 7.37426 19.2237 7.36345C19.5137 7.29138 19.6885 6.99772 19.6164 6.70765C19.0543 4.45922 17.7157 2.46842 15.8492 1.10458C15.6078 0.928021 15.2709 0.980269 15.0943 1.22169C14.9178 1.46491 14.97 1.80181 15.2114 1.97837ZM1.92799 15.3879C1.75144 16.0924 1.90638 16.8256 2.35498 17.3967C2.80179 17.9697 3.4756 18.2976 4.20165 18.2976H6.80681C7.06445 19.8289 8.39765 21 10.0011 21C11.6046 21 12.936 19.8289 13.1954 18.2976H15.8006C16.5266 18.2976 17.2004 17.9697 17.6472 17.3967C18.094 16.8238 18.249 16.0924 18.0742 15.3879L16.1194 7.58325C15.4168 4.7691 12.8999 2.80352 9.9993 2.80352C7.09868 2.80352 4.5818 4.7691 3.87916 7.58325L1.92799 15.3879ZM9.9993 19.919C8.99399 19.919 8.14903 19.229 7.90761 18.2976H12.0892C11.8496 19.229 11.0046 19.919 9.9993 19.919ZM9.9993 3.8845C12.4027 3.8845 14.489 5.51317 15.0709 7.84448L17.0221 15.6492C17.1176 16.0293 17.0329 16.4221 16.7933 16.7319C16.5518 17.04 16.1897 17.2166 15.7988 17.2166H4.19985C3.8089 17.2166 3.44677 17.04 3.20535 16.7319C2.96393 16.4239 2.88106 16.0293 2.97654 15.6492L4.92771 7.84448C5.50964 5.51317 7.59593 3.8845 9.9993 3.8845Z"
       fill={fill}
@@ -21,3 +22,5 @@ export const Notification = ({
     />
   </svg>
 );
+
+export const ICON_NAME = 'notification';

package/src/components/Icon/icons/Pages.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Pages = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Pages = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Pages',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const Pages = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Pages</title>
+    <title>{tooltip}</title>
     <g id="Side Menu Icons">
       <g id="Union">
         <path
@@ -74,3 +79,5 @@ export const Pages = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     </g>
   </svg>
 );
+
+export const ICON_NAME = 'pages';

package/src/components/Icon/icons/Plus.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Plus = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Plus = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Plus',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const Plus = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Plus</title>
+    <title>{tooltip}</title>
     <path
       d="M1 5H9"
       stroke={fill}
@@ -26,3 +31,5 @@ export const Plus = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'plus';

package/src/components/Icon/icons/RadioOn.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const RadioOn = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const RadioOn = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Radio on',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -8,7 +13,7 @@ export const RadioOn = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     fill="#fff"
     xmlns="http://www.w3.org/2000/svg"
     {...props}>
-    <title>Radio on</title>
+    <title>{tooltip}</title>
     <rect x="0.7" y="1.39995" width="18.6" height="18.6" rx="9.3" fill={fill} />
     <rect
       x="0.7"
@@ -22,3 +27,5 @@ export const RadioOn = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     <circle cx="10" cy="10.7" r="5" fill={fill} />
   </svg>
 );
+
+export const ICON_NAME = 'radio-on';

package/src/components/Icon/icons/Robot.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Robot = ({ fill = '#000', size = 50, ...props }: SVGProps) => (
+export const Robot = ({
+  fill = '#000',
+  size = 50,
+  tooltip = 'Robot',
+  ...props
+}: SVGProps) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width={`${size}px`}
@@ -8,7 +13,7 @@ export const Robot = ({ fill = '#000', size = 50, ...props }: SVGProps) => (
     viewBox="0 0 54 50"
     fill="none"
     {...props}>
-    <title>Robot</title>
+    <title>{tooltip}</title>
     <path
       d="M32.7144 16.6105H32.7143H27.6714V15.0526C27.6714 14.8784 27.5998 14.7121 27.4736 14.59L27.4043 14.6617L27.4736 14.59C27.3474 14.468 27.177 14.4 27 14.4C26.823 14.4 26.6526 14.468 26.5264 14.59C26.4002 14.7121 26.3286 14.8784 26.3286 15.0526V16.6105L21.2857 16.6105L21.2856 16.6105C20.5026 16.6112 19.7513 16.9123 19.1967 17.4487C18.6419 17.9852 18.3293 18.7134 18.3286 19.4736V19.4737L18.3286 29.4211L18.3286 29.4212C18.3293 30.1814 18.6419 30.9096 19.1967 31.4461C19.7513 31.9825 20.5026 32.2836 21.2856 32.2843H21.2857H24.356L26.4422 35.3107L26.5246 35.254L26.4422 35.3107C26.5039 35.4001 26.5872 35.4731 26.6844 35.5234C26.7817 35.5738 26.8901 35.6 27 35.6C27.1099 35.6 27.2183 35.5738 27.3156 35.5234C27.4128 35.4731 27.4961 35.4001 27.5578 35.3107L27.4754 35.254L27.5578 35.3107L29.644 32.2843H32.7143H32.7144C33.4974 32.2836 34.2487 31.9825 34.8033 31.4461C35.3581 30.9096 35.6707 30.1814 35.6714 29.4212V29.4211V19.4737V19.4736C35.6707 18.7134 35.3581 17.9852 34.8033 17.4487C34.2487 16.9123 33.4974 16.6112 32.7144 16.6105ZM28.728 31.2683L27 33.775L25.272 31.2683L25.272 31.2682C25.2102 31.1789 25.127 31.106 25.0298 31.0557C24.9326 31.0054 24.8243 30.9791 24.7144 30.979H24.7143H21.2858C20.8567 30.9785 20.446 30.8135 20.1436 30.521C19.8413 30.2286 19.6719 29.833 19.6714 29.421V27.8632H34.3286V29.421C34.3281 29.833 34.1587 30.2286 33.8564 30.521C33.554 30.8135 33.1433 30.9785 32.7142 30.979H29.2857H29.2856C29.1757 30.9791 29.0674 31.0055 28.9702 31.0558C28.873 31.1061 28.7898 31.1789 28.728 31.2682L28.728 31.2683ZM34.3286 26.5579H19.6714V19.4738C19.6719 19.0618 19.8413 18.6662 20.1436 18.3738C20.446 18.0813 20.8567 17.9163 21.2858 17.9158H32.7142C33.1433 17.9163 33.554 18.0813 33.8564 18.3738C34.1587 18.6662 34.3281 19.0618 34.3286 19.4738V26.5579ZM24.604 23.4604C24.7409 23.2621 24.8143 23.0286 24.8143 22.7895C24.8143 22.4687 24.6825 22.1618 24.4491 21.9361C24.2158 21.7104 23.9 21.5842 23.5714 21.5842C23.3263 21.5842 23.0865 21.6545 22.8822 21.7865C22.6779 21.9185 22.5181 22.1066 22.4236 22.3272C22.3291 22.5478 22.3044 22.7908 22.3526 23.0253C22.4008 23.2597 22.5197 23.4746 22.6938 23.6429C22.8678 23.8112 23.0891 23.9255 23.3296 23.9717C23.57 24.018 23.8193 23.9943 24.046 23.9035C24.2727 23.8126 24.467 23.6586 24.604 23.4604ZM31.4611 23.4604C31.5981 23.2621 31.6714 23.0286 31.6714 22.7895C31.6714 22.4687 31.5396 22.1618 31.3062 21.9361C31.0729 21.7104 30.7571 21.5842 30.4286 21.5842C30.1835 21.5842 29.9436 21.6545 29.7394 21.7865C29.535 21.9185 29.3753 22.1066 29.2808 22.3272C29.1863 22.5478 29.1615 22.7908 29.2097 23.0253C29.2579 23.2597 29.3769 23.4746 29.5509 23.6429C29.725 23.8112 29.9463 23.9255 30.1867 23.9717C30.4272 24.018 30.6764 23.9943 30.9031 23.9035C31.1298 23.8126 31.3241 23.6586 31.4611 23.4604ZM16.2429 25V20.579C16.2429 20.4048 16.1713 20.2384 16.045 20.1163C15.9189 19.9943 15.7484 19.9263 15.5714 19.9263C15.3944 19.9263 15.224 19.9943 15.0978 20.1163C14.9716 20.2384 14.9 20.4048 14.9 20.579V25C14.9 25.1742 14.9716 25.3406 15.0978 25.4627C15.224 25.5847 15.3944 25.6527 15.5714 25.6527C15.7484 25.6527 15.9189 25.5847 16.045 25.4627C16.1713 25.3406 16.2429 25.1742 16.2429 25ZM39.1 25V20.579C39.1 20.4048 39.0284 20.2384 38.9022 20.1163C38.776 19.9943 38.6056 19.9263 38.4286 19.9263C38.2516 19.9263 38.0811 19.9943 37.955 20.1163C37.8287 20.2384 37.7571 20.4048 37.7571 20.579V25C37.7571 25.1742 37.8287 25.3406 37.955 25.4627C38.0811 25.5847 38.2516 25.6527 38.4286 25.6527C38.6056 25.6527 38.776 25.5847 38.9022 25.4627C39.0284 25.3406 39.1 25.1742 39.1 25Z"
       fill={fill}
@@ -17,3 +22,5 @@ export const Robot = ({ fill = '#000', size = 50, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'robot';

package/src/components/Icon/icons/Roles.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Roles = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Roles = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Roles',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -9,7 +14,7 @@ export const Roles = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Roles</title>
+    <title>{tooltip}</title>
     <g id="Contacts">
       <g id="Vector">
         <path
@@ -50,3 +55,5 @@ export const Roles = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     </g>
   </svg>
 );
+
+export const ICON_NAME = 'roles';

package/src/components/Icon/icons/Search.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Search = ({ fill = '#55575A', size = 24, ...props }: SVGProps) => (
+export const Search = ({
+  fill = '#55575A',
+  size = 24,
+  tooltip = 'Search',
+  ...props
+}: SVGProps) => (
   <svg
     xmlns="http://www.w3.org/2000/svg"
     width={`${size}px`}
@@ -8,7 +13,7 @@ export const Search = ({ fill = '#55575A', size = 24, ...props }: SVGProps) => (
     viewBox="0 0 20 20"
     fill="none"
     {...props}>
-    <title>Search</title>
+    <title>{tooltip}</title>
     <path
       fillRule="evenodd"
       clipRule="evenodd"
@@ -17,3 +22,5 @@ export const Search = ({ fill = '#55575A', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'search';

package/src/components/Icon/icons/Settings.tsx

@@ -1,6 +1,11 @@
 import { SVGProps } from '@components/Icon/types';
 
-export const Settings = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
+export const Settings = ({
+  fill = '#000',
+  size = 24,
+  tooltip = 'Settings',
+  ...props
+}: SVGProps) => (
   <svg
     width={`${size}px`}
     height={`${size}px`}
@@ -8,7 +13,7 @@ export const Settings = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     xmlns="http://www.w3.org/2000/svg"
     xmlnsXlink="http://www.w3.org/1999/xlink"
     {...props}>
-    <title>Settings</title>
+    <title>{tooltip}</title>
     <path
       fillRule="evenodd"
       clipRule="evenodd"
@@ -23,3 +28,5 @@ export const Settings = ({ fill = '#000', size = 24, ...props }: SVGProps) => (
     />
   </svg>
 );
+
+export const ICON_NAME = 'settings';