@westpac/ui 0.1.0

package/src/components/icon/components/email-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function EmailIcon({ 'aria-label': ariaLabel = 'Email', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,2 L22,2 C23.1045695,2 24,2.8954305 24,4 L24,20 C24,21.1045695 23.1045695,22 22,22 L2,22 C0.8954305,22 -1.64108609e-15,21.1045695 -1.77635684e-15,20 L-1.77635684e-15,4 C-1.91162759e-15,2.8954305 0.8954305,2 2,2 Z M22,9 L22,6 L12,12 L2,6 L2,9 L12,15 L22,9 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/error-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function ErrorIcon({ 'aria-label': ariaLabel = 'Error', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M24,12 C24,18.627 18.62775,24 12,24 C5.37225,24 0,18.627 0,12 C0,5.373 5.37225,0 12,0 C18.62775,0 24,5.373 24,12 Z M12,2 C6.47714286,2 2,6.47714286 2,12 C2,17.5228571 6.47714286,22 12,22 C17.5228571,22 22,17.5228571 22,12 C22,6.47714286 17.5228571,2 12,2 Z M11,14 L11,6 L13,6 L13,14 L11,14 Z M11,18 L11,16 L13,16 L13,18 L11,18 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/excel-file-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function ExcelFileIcon({ 'aria-label': ariaLabel = 'Excel File', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M4,0 L16,0 L22,6 L22,22 C22,23.1045695 21.1045695,24 20,24 L4,24 C2.8954305,24 2,23.1045695 2,22 L2,2 L2,2 C2,0.8954305 2.8954305,2.02906125e-16 4,0 L4,0 Z M4,2 L4,22 L20,22 L20,6 L16,6 L16,2 L4,2 Z M14.2810673,8 L17.5044473,8 L13.6414231,13.68275 L18,20 L14.6546379,20 L12,16.0955 L10.8053367,17.8535 L12.2485388,17.8535 L12.2485388,20 L6,20 L10.3593393,13.68275 L6.49555273,8 L9.71893266,8 L12,11.30525 L14.2810673,8 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/exit-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function ExitIcon({ 'aria-label': ariaLabel = 'Exit', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M22.0144284,3.41682007 L12.4142136,13.0170349 L11,11.6028214 L20.6028214,2 L16.0144284,2 L16.0144284,0 L24.0144284,0 L24.0144284,8 L22.0144284,8 L22.0144284,3.41682007 Z M12,0 L12,2 C6.47714286,2 2,6.47714286 2,12 C2,17.5228571 6.47714286,22 12,22 C17.5228571,22 22,17.5228571 22,12 L24,12 C24,18.627 18.62775,24 12,24 C5.37225,24 0,18.627 0,12 C0,5.373 5.37225,0 12,0 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/expand-less-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function ExpandLessIcon({
+  'aria-label': ariaLabel = 'Expand Less',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <polygon fill="currentColor" fillRule="evenodd" points="12 9.824 18.588 16.412 20 15 12 7 4 15 5.412 16.412" />
+    </Icon>
+  );
+}

package/src/components/icon/components/expand-more-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function ExpandMoreIcon({
+  'aria-label': ariaLabel = 'Expand More',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <polygon fill="currentColor" fillRule="evenodd" points="12 13.588 5.412 7 4 8.412 12 16.412 20 8.412 18.588 7" />
+    </Icon>
+  );
+}

package/src/components/icon/components/face-happy-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function FaceHappyIcon({ 'aria-label': ariaLabel = 'Face Happy', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M24,12 C24,18.627 18.62775,24 12,24 C5.37225,24 0,18.627 0,12 C0,5.373 5.37225,0 12,0 C18.62775,0 24,5.373 24,12 Z M12,2 C6.47714286,2 2,6.47714286 2,12 C2,17.5228571 6.47714286,22 12,22 C17.5228571,22 22,17.5228571 22,12 C22,6.47714286 17.5228571,2 12,2 Z M5,16.0142014 L5,16.0142014 L6.72414236,15 C7.767498,16.7698831 9.6933545,17.9573958 11.8965695,17.9573958 C14.0997844,17.9573958 16.0256409,16.7698831 17.0689965,15 L18.7931389,16.0142014 C17.4019981,18.3740455 14.8341894,19.9573958 11.8965695,19.9573958 C8.95894951,19.9573958 6.39114084,18.3740455 5,16.0142014 Z M15,8.25 C15,9.07875 15.67125,9.75 16.5,9.75 C17.32875,9.75 18,9.07875 18,8.25 C18,7.42125 17.32875,6.75 16.5,6.75 C15.67125,6.75 15,7.42125 15,8.25 M6,8.25 C6,7.42125 6.67125,6.75 7.5,6.75 C8.32875,6.75 9,7.42125 9,8.25 C9,9.07875 8.32875,9.75 7.5,9.75 C6.67125,9.75 6,9.07875 6,8.25"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/facebook-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function FacebookIcon({ 'aria-label': ariaLabel = 'Facebook', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,0 L22,0 C23.1045695,-2.02906125e-16 24,0.8954305 24,2 L24,22 C24,23.1045695 23.1045695,24 22,24 L2,24 C0.8954305,24 1.3527075e-16,23.1045695 0,22 L0,2 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 L2,0 Z M20.7142857,9.14285714 L16.4285714,9.14285714 L16.4285714,7 C16.4285714,6.07642857 16.5514286,5.57 17.5,5.57142857 L20.7142857,5.57142857 L20.7142857,2 L16.7828571,2 C13.3885714,2 12.1428571,3.42857143 12.1428571,6.64285714 L12.1428571,9.14285714 L10,9.14285714 L10,12 L12.1428571,12 L12.1428571,22 L16.4285714,22 L16.4285714,12 L20,12 L20.7142857,9.14285714 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/favourite-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function FavouriteIcon({ 'aria-label': ariaLabel = 'Favourite', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M12,23 L10.26,21.4174387 C4.08,15.8185286 0,12.1258856 0,7.59400545 C0,3.9013624 2.904,1 6.6,1 C8.688,1 10.692,1.97111717 12,3.50572207 C13.308,1.97111717 15.312,1 17.4,1 C21.096,1 24,3.9013624 24,7.59400545 C24,12.1258856 19.92,15.8185286 13.74,21.4294278 L12,23 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/filter-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function FilterIcon({ 'aria-label': ariaLabel = 'Filter', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,12 L2,10 L4,10 L4,12 L2,12 Z M2,16 L2,14 L4,14 L4,16 L2,16 Z M2,8 L2,6 L4,6 L4,8 L2,8 Z M6,12 L6,10 L22,10 L22,12 L6,12 Z M6,16 L6,14 L22,14 L22,16 L6,16 Z M6,6 L22,6 L22,8 L6,8 L6,6 Z M16,18 L22,18 L19,21 L16,18 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/fingerprint-icon.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function FingerprintIcon({
+  'aria-label': ariaLabel = 'Fingerprint',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M15.2452008,23.9699311 C13.3415488,23.4431343 12.0839842,22.7324518 10.7695209,21.4421031 C9.08009938,19.7647488 8.15161172,17.5319571 8.15161172,15.1448276 C8.15161172,13.128635 9.865476,11.4916256 11.9703309,11.4916256 C14.0751859,11.4916256 15.7890501,13.128635 15.7890501,15.1448276 C15.7890501,16.310142 16.8076746,17.2610837 18.0708235,17.2610837 C19.3339725,17.2610837 20.3525969,16.310142 20.3525969,15.1448276 C20.3525969,10.7887822 16.5926717,7.24729064 11.9585083,7.24729064 C8.66455553,7.24729064 5.65561228,9.08009972 4.3035135,11.9114156 C3.85459564,12.8437834 3.62353291,13.9406002 3.62353291,15.1448276 C3.62353291,16.5035435 3.82095577,17.7947957 4.40383065,19.3491466 C4.55801258,19.7500196 4.35580234,20.1977708 3.9591154,20.3349775 C3.56273512,20.4874315 3.11343448,20.2796903 2.97270327,19.8887302 C2.3857201,18.3194487 2.09840975,16.7614565 2.09840975,15.1448276 C2.09840975,13.7032432 2.37479458,12.3881374 2.91960918,11.2379745 C4.52272447,7.87504847 8.0744351,5.69852217 11.9585083,5.69852217 C17.4344468,5.69852217 21.8895428,9.92620323 21.8895428,15.1330049 C21.8895428,17.1491975 20.1756785,18.7862069 18.0708235,18.7862069 C15.9659686,18.7862069 14.2521043,17.1491975 14.2521043,15.1330049 C14.2521043,13.9676905 13.2334799,13.0167488 11.9703309,13.0167488 C10.707182,13.0167488 9.68855754,13.9676905 9.68855754,15.1330049 C9.68855754,17.1111287 10.4525945,18.9562932 11.8467881,20.3389647 C12.9536273,21.4341529 14.0052857,22.0304282 15.6325705,22.4805523 C16.0433544,22.5870518 16.2825782,23.0128702 16.1751504,23.4110713 C16.10017,23.7559809 15.7870889,24 15.446193,24 C15.3871178,24 15.3215088,23.9890652 15.2452008,23.9699311 Z M14.0580187,20.4817689 C12.2476626,19.2546147 11.1663901,17.2607084 11.1663901,15.1448276 C11.1663901,14.715851 11.5058864,14.3763547 11.934863,14.3763547 C12.3638396,14.3763547 12.7033359,14.715851 12.7033359,15.1448276 C12.7033359,16.7559563 13.5279366,18.2718577 14.9189155,19.2067786 C15.7253537,19.7519763 16.6710589,20.0157635 17.8225477,20.0157635 C18.1358491,20.0157635 18.60117,19.9737554 19.0198126,19.9005017 C19.4380485,19.8230506 19.8363993,20.1028446 19.9121938,20.5273142 C19.9896448,20.9455501 19.7098508,21.3439009 19.286693,21.4194473 C18.7419789,21.5245676 18.2162926,21.564532 17.8225477,21.564532 C16.3788255,21.564532 15.1030374,21.1987036 14.0580187,20.4817689 Z M9.34570039,23.7517241 C9.13729082,23.7517241 8.93767779,23.668552 8.80650904,23.5224426 C7.67216381,22.3880973 7.14773141,21.7114104 6.40088685,20.3626258 C5.57189943,18.8848656 5.1368334,17.08289 5.1368334,15.1448276 C5.1368334,11.5330947 8.22156712,8.59507389 12.0057989,8.59507389 C15.7900307,8.59507389 18.8747644,11.5330947 18.8747644,15.1448276 C18.8747644,15.5738042 18.5352681,15.9133005 18.1062915,15.9133005 C17.6773149,15.9133005 17.3378186,15.5738042 17.3378186,15.1448276 C17.3378186,12.3836767 14.9480883,10.1320197 12.0057989,10.1320197 C9.06350952,10.1320197 6.67377921,12.3836767 6.67377921,15.1448276 C6.67377921,16.8201822 7.04583598,18.3619855 7.75090606,19.6103135 C8.42130815,20.8149422 8.8509643,21.3609245 9.91171015,22.4354927 C10.2013655,22.740393 10.2013655,23.2142868 9.90243055,23.5282652 C9.74258611,23.6735784 9.54722166,23.7517241 9.34570039,23.7517241 Z M1.51240817,9.3436088 C1.16082907,9.09903204 1.08058459,8.62228542 1.32701381,8.26805263 C2.51491291,6.58819532 4.02694155,5.26932003 5.82399619,4.3468324 C9.59225071,2.40270109 14.4054504,2.39598343 18.1754561,4.33484356 C19.9766441,5.25945342 21.4871851,6.56798597 22.6713876,8.23066906 C22.9205255,8.57323366 22.8387851,9.06367608 22.487367,9.30814082 C22.1342524,9.55378575 21.6575058,9.47354127 21.4142009,9.12376638 C20.3654553,7.65552257 19.0388769,6.50464997 17.4697815,5.70266779 C14.1243584,3.98915838 9.84593625,3.99243185 6.51848445,5.7143295 C4.94525801,6.52407841 3.61602962,7.68349348 2.57159573,9.14414287 C2.44745565,9.361388 2.21528381,9.4817734 1.95653783,9.4817734 C1.80154047,9.4817734 1.64935119,9.43494593 1.51240817,9.3436088 Z M18.8747644,3.27487685 C18.7482608,3.27487685 18.6235774,3.24270048 18.5215703,3.18422125 C16.276614,2.02666565 14.3418192,1.53694581 12.0176216,1.53694581 C9.69601158,1.53694581 7.50432578,2.09001552 5.51686391,3.18253454 C5.14876443,3.38192176 4.68898713,3.24586521 4.47252546,2.87461179 C4.27202395,2.50445514 4.41087066,2.03046119 4.7802863,1.83036115 C7.01156446,0.618753123 9.45337557,0 12.0176216,0 C14.5626231,0 16.7894371,0.561642557 19.2285019,1.8170453 C19.6098658,2.01535456 19.7529399,2.4779606 19.5535791,2.84581128 C19.419777,3.11341553 19.1605891,3.27487685 18.8747644,3.27487685 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/future-clock-icon.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function FutureClockIcon({
+  'aria-label': ariaLabel = 'Future Clock',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M24,12 L20,16.5 L16,12 L19,12 C19,7.30557963 15.1944204,3.5 10.5,3.5 C5.80557963,3.5 2,7.30557963 2,12 C2,16.6944204 5.80557963,20.5 10.5,20.5 C12.5701131,20.5 14.4673847,19.7599774 15.9417031,18.5300437 L17.2221038,20.0665245 C15.4008869,21.5858544 13.0571985,22.5 10.5,22.5 C4.70101013,22.5 0,17.7989899 0,12 C0,6.20101013 4.70101013,1.5 10.5,1.5 C16.2989899,1.5 21,6.20101013 21,12 L24,12 Z M11.0012419,12.8457833 L15.1999998,15.268433 L14.1993789,17.0004838 L9,14 L9,6 L11.0012419,6 L11.0012419,12.8457833 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/gel-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function GelIcon({ 'aria-label': ariaLabel = 'GEL', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="nonzero"
+        d="M11.998.034c5.797 0 10.496 4.697 10.496 10.491 0 8.673-8.083 12.257-10.496 13.464v-2.973c-5.797 0-10.496-4.697-10.496-10.49C1.502 4.73 6.202.033 11.998.033zM7.209 7.601c-1.881 0-3.282 1.286-3.282 3.193v.07c0 1.872 1.156 3.193 3.282 3.193 2.022 0 3.063-1.198 3.063-2.79v-.77h-2.94v1.25h1.173c-.036.5-.368.945-1.243.945-1.085 0-1.462-.787-1.462-1.802v-.07c0-1.128.534-1.81 1.418-1.81.665 0 1.042.306 1.129.892h1.777c-.123-1.627-1.436-2.3-2.915-2.3zm7.912.097h-4.323v6.254h4.463V12.57h-2.678v-1.137h2.022v-1.277h-2.022V9.08h2.538V7.698zm2.486 0h-1.803v6.254h4.166v-1.39h-2.363V7.697z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/generic-file-icon.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function GenericFileIcon({
+  'aria-label': ariaLabel = 'Generic File',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M4,0 L16,0 L22,6 L22,22 C22,23.1045695 21.1045695,24 20,24 L4,24 C2.8954305,24 2,23.1045695 2,22 L2,2 L2,2 C2,0.8954305 2.8954305,2.02906125e-16 4,0 L4,0 Z M4,2 L4,22 L20,22 L20,6 L16,6 L16,2 L4,2 Z M6,12 L18,12 L18,10 L6,10 L6,12 Z M6,16 L18,16 L18,14 L6,14 L6,16 Z M6,20 L18,20 L18,18 L6,18 L6,20 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/geolocation-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function GeolocationIcon({
+  'aria-label': ariaLabel = 'Geolocation',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <polygon fill="currentColor" fillRule="evenodd" points="0 12 11.143 12.857 12 24 24 0" />
+    </Icon>
+  );
+}

package/src/components/icon/components/gift-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function GiftIcon({ 'aria-label': ariaLabel = 'Gift', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M18.4648712,6 L22,6 C23.1045695,6 24,6.8954305 24,8 L24,12 L13,12 L13,7.46487122 C12.6235948,7.24713257 12.2859638,6.96981926 12,6.6458244 C11.7140362,6.96981926 11.3764052,7.24713257 11,7.46487122 L11,12 L0,12 L0,8 C-1.3527075e-16,6.8954305 0.8954305,6 2,6 L2,6 L5.53512878,6 C5.19478857,5.41165327 5,4.72857429 5,4 C5,1.790861 6.790861,0 9,0 C10.1946925,0 11.2670555,0.523754887 12,1.3541756 L12,1.3541756 C12.7329445,0.523754887 13.8053075,0 15,0 C17.209139,0 19,1.790861 19,4 C19,4.72857429 18.8052114,5.41165327 18.4648712,6 Z M11,14 L1,14 L1,22 C1,23.1045695 1.8954305,24 3,24 L21,24 C22.1045695,24 23,23.1045695 23,22 L23,14 L13,14 L13,24 L11,24 L11,14 Z M9,6 C10.1045695,6 11,5.1045695 11,4 C11,2.8954305 10.1045695,2 9,2 C7.8954305,2 7,2.8954305 7,4 C7,5.1045695 7.8954305,6 9,6 Z M15,6 C16.1045695,6 17,5.1045695 17,4 C17,2.8954305 16.1045695,2 15,2 C13.8954305,2 13,2.8954305 13,4 C13,5.1045695 13.8954305,6 15,6 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/github-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function GithubIcon({ 'aria-label': ariaLabel = 'Github', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M11.9992265,0 C5.37298948,0 0,5.50873921 0,12.3044759 C0,17.7397153 3.43799327,22.3514562 8.20648393,23.9789531 C8.80723276,24.0914528 9.02623233,23.7119536 9.02623233,23.3857042 C9.02623233,23.0939548 9.01573235,22.3199563 9.00973236,21.2932083 C5.6714889,22.0364569 4.96724027,19.6432115 4.96724027,19.6432115 C4.42124134,18.2227143 3.63524288,17.8439651 3.63524288,17.8439651 C2.54549502,17.0804666 3.71774272,17.0962165 3.71774272,17.0962165 C4.92149036,17.1832164 5.55523912,18.363714 5.55523912,18.363714 C6.62623703,20.2439604 8.36398362,19.7017114 9.04798229,19.386712 C9.15673207,18.5909636 9.46723146,18.0487147 9.80998079,17.7412153 C7.14523601,17.4307159 4.3432415,16.3754679 4.3432415,11.6609772 C4.3432415,10.3177298 4.81124058,9.21898195 5.57848908,8.35948363 C5.45548932,8.04748424 5.04374013,6.79723669 5.69623885,5.10299001 C5.69623885,5.10299001 6.70423687,4.77149066 8.99623239,6.36373754 C9.95323051,6.09148807 10.9799785,5.95423834 12.0007265,5.95048835 C13.0199745,5.95423834 14.0459725,6.09148807 15.0044706,6.36373754 C17.2957161,4.77149066 18.3014642,5.10299001 18.3014642,5.10299001 C18.9562129,6.79723669 18.5444637,8.04748424 18.4214639,8.35948363 C19.1902124,9.21898195 19.6544615,10.3177298 19.6544615,11.6609772 C19.6544615,16.3874679 16.848717,17.4269659 14.1757222,17.7322153 C14.6062214,18.1117145 14.9902207,18.8624631 14.9902207,20.0107108 C14.9902207,21.6554576 14.9752207,22.982955 14.9752207,23.3857042 C14.9752207,23.7149536 15.1912203,24.0974528 15.8002191,23.9774531 C20.5649597,22.3469562 23.999953,17.7382153 23.999953,12.3044759 C23.999953,5.50873921 18.6262135,0 11.9992265,0"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/global-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function GlobalIcon({ 'aria-label': ariaLabel = 'Global', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M20.486,3.51475 C22.75175,5.7805 24.0005,8.7955 24.0005,11.9995 C24.0005,15.20575 22.75175,18.2185 20.486,20.4865 C18.22025,22.75225 15.206,23.9995 12.0005,23.9995 C8.79425,23.9995 5.78225,22.75225 3.51425,20.4865 C1.2485,18.2185 0.0005,15.20575 0.0005,11.9995 C0.0005,8.7955 1.2485,5.7805 3.51425,3.51475 C5.78225,1.249 8.79425,-0.0005 12.0005,-0.0005 C15.206,-0.0005 18.22025,1.249 20.486,3.51475 M19.42475,19.426 C20.90375,17.947 21.88475,16.1065 22.2905,14.10325 C21.974,14.56825 21.67325,14.7415 21.48575,13.69975 C21.2915,12.00325 19.7345,13.08775 18.75425,12.4855 C17.723,13.18 15.40625,11.13325 15.8,13.441 C16.40825,14.482 19.08125,12.049 17.7485,14.251 C16.898,15.7885 14.639,19.19425 14.9345,20.9605 C14.9705,23.53225 12.305,21.49675 11.38625,20.64325 C10.769,18.93475 11.17625,15.94675 9.5615,15.1105 C7.808,15.034 6.3035,14.87425 5.624,12.9145 C5.21525,11.51275 6.059,9.4255 7.562,9.10225 C9.76025,7.72075 10.547,10.72075 12.6095,10.77775 C13.2515,10.1065 14.996,9.89425 15.14075,9.14275 C13.787,8.9035 16.8575,8.0035 15.01025,7.49275 C13.9925,7.612 13.33625,8.5495 13.87775,9.343 C11.90375,9.80425 11.84075,6.4855 9.94175,7.5325 C9.8945,9.18625 6.84425,8.06875 8.88575,7.7335 C9.58925,7.4275 7.742,6.53725 8.7395,6.69925 C9.2285,6.673 10.87925,6.09325 10.4345,5.70625 C11.351,5.13475 12.125,7.07125 13.02425,5.66125 C13.67375,4.57675 12.75125,4.3765 11.939,4.927 C11.4785,4.4125 12.749,3.30325 13.868,2.82325 C14.24075,2.66275 14.5955,2.57575 14.86925,2.6005 C15.434,3.25225 16.475,3.3655 16.53125,2.52325 C15.13325,1.8535 13.59425,1.4995 12.0005,1.4995 C9.71225,1.4995 7.535,2.22775 5.73575,3.57175 C6.22025,3.7945 6.494,4.06975 6.02825,4.423 C5.6645,5.50225 4.19525,6.95125 2.90525,6.7465 C2.2355,7.90225 1.79375,9.175 1.604,10.5085 C2.687,10.86625 2.936,11.5735 2.70275,11.8105 C2.15375,12.2905 1.814,12.97075 1.63925,13.717 C1.99175,15.8695 3.00275,17.8525 4.5755,19.426 C6.56,21.40825 9.19475,22.4995 12.0005,22.4995 C14.80475,22.4995 17.44025,21.40825 19.42475,19.426"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/google-plus-icon.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function GooglePlusIcon({
+  'aria-label': ariaLabel = 'Google Plus',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,0 L22,0 C23.1045695,-2.02906125e-16 24,0.8954305 24,2 L24,22 C24,23.1045695 23.1045695,24 22,24 L2,24 C0.8954305,24 1.3527075e-16,23.1045695 0,22 L0,2 L0,2 C-1.3527075e-16,0.8954305 0.8954305,2.02906125e-16 2,0 L2,0 Z M18,11 L16,11 L16,13 L18,13 L18,15 L20,15 L20,13 L22,13 L22,11 L20,11 L20,9 L18,9 L18,11 Z M8.36363636,13.1863638 L11.9727273,13.1863638 C11.8272727,14.1227275 10.8818182,15.9318184 8.36363636,15.9318184 C6.19090909,15.9318184 4.41818182,14.1318184 4.41818182,11.9136366 C4.41818182,9.69545474 6.19090909,7.89545474 8.36363636,7.89545474 C9.6,7.89545474 10.4272727,8.42272746 10.9,8.87727292 L12.6272727,7.21363655 C11.5181818,6.17727292 10.0818182,5.55000019 8.36363636,5.55000019 C4.84545455,5.55000019 2,8.39545474 2,11.9136366 C2,15.4318184 4.84545455,18.2772729 8.36363636,18.2772729 C12.0363636,18.2772729 14.4727273,15.6954547 14.4727273,12.0590911 C14.4727273,11.6409093 14.4272727,11.3227275 14.3727273,11.0045456 L8.36363636,11 L8.36363636,13.1863638 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/grid-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function GridIcon({ 'aria-label': ariaLabel = 'Grid', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M20,2 L4,2 C2.9,2 2,2.9 2,4 L2,20 C2,21.1 2.9,22 4,22 L20,22 C21.1,22 22,21.1 22,20 L22,4 C22,2.9 21.1,2 20,2 Z M8,20 L4,20 L4,16 L8,16 L8,20 Z M8,14 L4,14 L4,10 L8,10 L8,14 Z M8,8 L4,8 L4,4 L8,4 L8,8 Z M14,20 L10,20 L10,16 L14,16 L14,20 Z M14,14 L10,14 L10,10 L14,10 L14,14 Z M14,8 L10,8 L10,4 L14,4 L14,8 Z M20,20 L16,20 L16,16 L20,16 L20,20 Z M20,14 L16,14 L16,10 L20,10 L20,14 Z M20,8 L16,8 L16,4 L20,4 L20,8 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/growth-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function GrowthIcon({ 'aria-label': ariaLabel = 'Growth', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,14 C2,19.5222222 6.47777778,24 12,24 C12,18.4777778 7.52222222,14 2,14 Z M12,24 C17.5222222,24 22,19.5222222 22,14 C16.4777778,14 12,18.4777778 12,24 Z M9.00569016,2.81370323 C9.10188477,1.2436235 10.4057105,5.91645679e-31 12,5.91645679e-31 C13.5942895,5.91645679e-31 14.8981152,1.2436235 14.9943098,2.81370323 C16.4021361,2.11197034 18.1310585,2.61930477 18.9282032,4 C19.725348,5.38069523 19.3002513,7.13165316 17.9886197,8 C19.3002513,8.86834684 19.725348,10.6193048 18.9282032,12 C18.1310585,13.3806952 16.4021361,13.8880297 14.9943098,13.1862968 C14.8981152,14.7563765 13.5942895,16 12,16 C10.4057105,16 9.10188477,14.7563765 9.00569016,13.1862968 C7.59786393,13.8880297 5.86894154,13.3806952 5.07179677,12 C4.274652,10.6193048 4.6997487,8.86834684 6.01138033,8 C4.6997487,7.13165316 4.274652,5.38069523 5.07179677,4 C5.86894154,2.61930477 7.59786393,2.11197034 9.00569016,2.81370323 L9.00569016,2.81370323 Z M12,11 C13.6568542,11 15,9.65685425 15,8 C15,6.34314575 13.6568542,5 12,5 C10.3431458,5 9,6.34314575 9,8 C9,9.65685425 10.3431458,11 12,11 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/hamburger-menu-icon.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function HamburgerMenuIcon({
+  'aria-label': ariaLabel = 'Hamburger Menu',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,7 L22,7 L22,5 L2,5 L2,7 Z M2,19 L2,17 L22,17 L22,19 L2,19 Z M2,13 L2,11 L22,11 L22,13 L2,13 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/headset-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function HeadsetIcon({ 'aria-label': ariaLabel = 'Headset', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M22,21 L22,10 C22,4.4771525 17.5228475,0 12,0 C6.4771525,0 2,4.4771525 2,10 L2,17 C2,18.6568542 3.34314575,20 5,20 L8,20 L8,12 L4,12 L4,10 C4,5.581722 7.581722,2 12,2 C16.418278,2 20,5.581722 20,10 L20,12 L16,12 L16,20 L20,20 L20,20.25 C20,21.2164983 19.3604068,22 18.5714286,22 L12,22 L12,24 L19,24 C20.6568542,24 22,22.6568542 22,21 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/help-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function HelpIcon({ 'aria-label': ariaLabel = 'Help', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M24,12 C24,18.627 18.62775,24 12,24 C5.37225,24 0,18.627 0,12 C0,5.373 5.37225,0 12,0 C18.62775,0 24,5.373 24,12 Z M12,2 C6.47714286,2 2,6.47714286 2,12 C2,17.5228571 6.47714286,22 12,22 C17.5228571,22 22,17.5228571 22,12 C22,6.47714286 17.5228571,2 12,2 Z M11,18 L11,16 L13,16 L13,18 L11,18 Z M12,6 C14.21,6 16,7.79 16,10 C16,12.5 13,12.75 13,15 L11,15 C11,11.75 14,12 14,10 C14,8.9 13.1,8 12,8 C10.9,8 10,8.9 10,10 L8,10 C8,7.79 9.79,6 12,6 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/history-clock-icon.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function HistoryClockIcon({
+  'aria-label': ariaLabel = 'History Clock',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M6.77789622,20.0665245 L8.05829694,18.5300437 C9.53261534,19.7599774 11.4298869,20.5 13.5,20.5 C18.1944204,20.5 22,16.6944204 22,12 C22,7.30557963 18.1944204,3.5 13.5,3.5 C8.80557963,3.5 5,7.30557963 5,12 L3,12 C3,6.20101013 7.70101013,1.5 13.5,1.5 C19.2989899,1.5 24,6.20101013 24,12 C24,17.7989899 19.2989899,22.5 13.5,22.5 C10.9428015,22.5 8.59911307,21.5858544 6.77789622,20.0665245 L6.77789622,20.0665245 Z M4,16.5 L0,12 L8,12 L4,16.5 Z M14,12.8457833 L18.1961524,15.268433 L17.1961524,17.0004838 L12,14.0004838 L12.0002793,14 L12,14 L12,6 L14,6 L14,12.8457833 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/house-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function HouseIcon({ 'aria-label': ariaLabel = 'House', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <polygon
+        fill="currentColor"
+        fillRule="evenodd"
+        points="12 0 0 12 4 12 4 24 10 24 10 17 14 17 14 24 20 24 20 12 24 12"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/id-card-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function IdCardIcon({ 'aria-label': ariaLabel = 'Id Card', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,2 L22,2 C23.1045695,2 24,2.8954305 24,4 L24,20 C24,21.1045695 23.1045695,22 22,22 L2,22 C0.8954305,22 1.3527075e-16,21.1045695 0,20 L0,4 C-1.3527075e-16,2.8954305 0.8954305,2 2,2 Z M16,16 L16,18 L22,18 L22,16 L16,16 Z M16,8 L16,10 L22,10 L22,8 L16,8 Z M16,12 L16,14 L22,14 L22,12 L16,12 Z M14,18.1 L2,18.1 L2,17.1 C2,15.1 6,14 8,14 C10,14 14,15.1 14,17.1 L14,18.1 Z M8,6 C9.66,6 11,7.34 11,9 C11,10.66 9.66,12 8,12 C6.34,12 5,10.66 5,9 C5,7.34 6.34,6 8,6 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/image-square-icon.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function ImageSquareIcon({
+  'aria-label': ariaLabel = 'Image Square',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M13.9767442,18.3255814 L16.5,14 L20,20 L14,20 L4,20 L9.5,11 L13.9767442,18.3255814 Z M24,2.4 L24,21.6 C24,22.9254834 23.1045695,24 22,24 L2,24 C0.8954305,24 -2.66453526e-15,22.9254834 -2.66453526e-15,21.6 L8.8817842e-16,2.4 C8.8817842e-16,1.0745166 0.8954305,3.6292676e-16 2,4.4408921e-16 L22,4.85281769e-15 C23.1045695,4.93398014e-15 24,1.0745166 24,2.4 Z M22,2 L2,2 L2,22 L22,22 L22,2 Z M15.5,10 C14.1192881,10 13,8.88071187 13,7.5 C13,6.11928813 14.1192881,5 15.5,5 C16.8807119,5 18,6.11928813 18,7.5 C18,8.88071187 16.8807119,10 15.5,10 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/info-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function InfoIcon({ 'aria-label': ariaLabel = 'Info', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M24,12 C24,18.627 18.62775,24 12,24 C5.37225,24 0,18.627 0,12 C0,5.373 5.37225,0 12,0 C18.62775,0 24,5.373 24,12 Z M12,2 C6.47714286,2 2,6.47714286 2,12 C2,17.5228571 6.47714286,22 12,22 C17.5228571,22 22,17.5228571 22,12 C22,6.47714286 17.5228571,2 12,2 Z M11,18 L11,10 L13,10 L13,18 L11,18 Z M11,8 L11,6 L13,6 L13,8 L11,8 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/instagram-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function InstagramIcon({ 'aria-label': ariaLabel = 'Instagram', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M6,0 L18,0 C21.3137085,-6.08718376e-16 24,2.6862915 24,6 L24,18 C24,21.3137085 21.3137085,24 18,24 L6,24 C2.6862915,24 4.05812251e-16,21.3137085 0,18 L0,6 C-4.05812251e-16,2.6862915 2.6862915,6.08718376e-16 6,0 Z M6,2 C3.790861,2 2,3.790861 2,6 L2,18 C2,20.209139 3.790861,22 6,22 L18,22 C20.209139,22 22,20.209139 22,18 L22,6 C22,3.790861 20.209139,2 18,2 L6,2 Z M5.838,12 C5.838,8.5965 8.5965,5.838 12,5.838 C15.4035,5.838 18.162,8.5965 18.162,12 C18.162,15.4035 15.4035,18.162 12,18.162 C8.5965,18.162 5.838,15.4035 5.838,12 Z M8.00025,12 C8.00025,14.20875 9.79125,15.99975 12,15.99975 C14.20875,15.99975 15.99975,14.20875 15.99975,12 C15.99975,9.79125 14.20875,8.00025 12,8.00025 C9.79125,8.00025 8.00025,9.79125 8.00025,12 Z M18.405675,7.03425 C17.610675,7.03425 16.965675,6.39 16.965675,5.59425 C16.965675,4.7985 17.610675,4.15425 18.405675,4.15425 C19.201425,4.15425 19.845675,4.7985 19.845675,5.59425 C19.845675,6.39 19.201425,7.03425 18.405675,7.03425 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/invest-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function InvestIcon({ 'aria-label': ariaLabel = 'Invest', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M18,24 L22,24 L22,10 L18,10 L18,24 Z M10,24 L14,24 L14,16 L10,16 L10,24 Z M2,24 L6,24 L6,14 L2,14 L2,24 Z M21.7309981,3.73099809 L12.2500311,13.4994066 L5.63133825,6.8807138 L0,12.512052 L8.8817842e-16,9.68362492 L5.63133825,4.05228667 L12.2287557,10.6497041 L20.3166269,2.31662686 L18,3.99680289e-15 L24,0 L24,6 L21.7309981,3.73099809 L21.7309981,3.73099809 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/key-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function KeyIcon({ 'aria-label': ariaLabel = 'Key', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M18,13 L13.7101213,13 C12.8495721,15.8914889 10.1710206,18 7,18 C3.13400675,18 0,14.8659932 0,11 C0,7.13400675 3.13400675,4 7,4 C10.1710206,4 12.8495721,6.10851105 13.7101213,9 L24,9 L24,13 L22,13 L22,17 L18,17 L18,13 Z M7,14 C8.65685425,14 10,12.6568542 10,11 C10,9.34314575 8.65685425,8 7,8 C5.34314575,8 4,9.34314575 4,11 C4,12.6568542 5.34314575,14 7,14 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/keyhole-icon.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+
+import { Icon } from '../icon.component.js';
+import { type IconProps } from '../icon.types.js';
+
+export function KeyholeIcon({ 'aria-label': ariaLabel = 'Keyhole', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M13.5661739,11.5480575 L15.00015,18.0002 L9.00025,18.0002 L10.4334761,11.5480575 C9.5762404,11.0200663 9.00025,10.081082 9.00025,9.00035 C9.00025,7.34362761 10.3434776,6.0004 12.0002,6.0004 C13.6569224,6.0004 15.00015,7.34362761 15.00015,9.00035 C15.00015,10.081082 14.4234096,11.0200663 13.5661739,11.5480575 M12.0002,0.0005 C5.37256046,0.0005 0.0004,5.37266046 0.0004,12.0003 C0.0004,18.6271896 5.37256046,24.0001 12.0002,24.0001 C18.6270895,24.0001 24,18.6271896 24,12.0003 C24,5.37266046 18.6270895,0.0005 12.0002,0.0005"
+      />
+    </Icon>
+  );
+}