@westpac/ui 0.1.0

package/src/components/icon/components/light-bulb-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 LightBulbIcon({ 'aria-label': ariaLabel = 'Light Bulb', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M9,22 L15,22 L15,23 C15,23.5522847 14.5522847,24 14,24 L10,24 C9.44771525,24 9,23.5522847 9,23 L9,22 Z M16,16.0018987 L16,18 C16,19.1045695 15.1045695,20 14,20 L10,20 C8.8954305,20 8,19.1045695 8,18 L8,16.0018987 C5.32211278,14.5710686 3.5,11.7483229 3.5,8.5 C3.5,3.80557963 7.30557963,0 12,0 C16.6944204,0 20.5,3.80557963 20.5,8.5 C20.5,11.7483229 18.6778872,14.5710686 16,16.0018987 L16,16.0018987 Z M14,14.6865006 L14,14.6865006 C16.611264,13.8429436 18.5,11.3920408 18.5,8.5 C18.5,4.91014913 15.5898509,2 12,2 C8.41014913,2 5.5,4.91014913 5.5,8.5 C5.5,11.3920408 7.38873598,13.8429436 10,14.6865006 L10,18 L14,18 L14,14.6865006 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/limit-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 LimitIcon({ 'aria-label': ariaLabel = 'Limit', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M20.4663464,17.3242108 C21.437899,15.7825285 22,13.9569085 22,12 C22,6.47714286 17.5228571,2 12,2 C10.0430915,2 8.21747148,2.562101 6.67578925,3.53365362 L20.4663464,17.3242108 L20.4663464,17.3242108 Z M17.7016635,20.2163822 L3.78361783,6.29833646 C2.6591542,7.91570425 2,9.88087368 2,12 C2,17.5228571 6.47714286,22 12,22 C14.1191263,22 16.0842958,21.3408458 17.7016635,20.2163822 L17.7016635,20.2163822 Z M24,12 C24,18.627 18.62775,24 12,24 C5.37225,24 -8.8817842e-16,18.627 -8.8817842e-16,12 C-8.8817842e-16,5.373 5.37225,0 12,0 C18.62775,0 24,5.373 24,12 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/link-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 LinkIcon({ 'aria-label': ariaLabel = 'Link', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M13,18 L13,16 L18,16 C20.209139,16 22,14.209139 22,12 C22,9.790861 20.209139,8 18,8 L13,8 L13,6 L18,6 C21.3137085,6 24,8.6862915 24,12 C24,15.3137085 21.3137085,18 18,18 L13,18 Z M11,18 L6,18 C2.6862915,18 -1.77635684e-15,15.3137085 -1.77635684e-15,12 C-1.77635684e-15,8.6862915 2.6862915,6 6,6 L11,6 L11,8 L6,8 C3.790861,8 2,9.790861 2,12 C2,14.209139 3.790861,16 6,16 L11,16 L11,18 L11,18 Z M8,11 L16,11 L16,13 L8,13 L8,11 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/linkedin-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 LinkedinIcon({ 'aria-label': ariaLabel = 'Linkedin', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M18.75,12.75 C18.75,10.6785 17.61375,9 15.75,9 C14.25,9 13.5,10.0125 12.75,10.8615 L12.75,9 L9.75,9 L9.75,19.5 L12.75,19.5 L12.75,13.5 C12.75,12.67125 13.42125,12 14.25,12 C15.07875,12 15.75,12.67125 15.75,13.5 L15.75,19.5 L18.75,19.5 L18.75,12.75 Z M8.25,6 C8.25,5.17125 7.57875,4.5 6.75,4.5 C5.92125,4.5 5.25,5.17125 5.25,6 C5.25,6.82875 5.92125,7.5 6.75,7.5 C7.57875,7.5 8.25,6.82875 8.25,6 L8.25,6 Z M5.25,19.5 L8.25,19.5 L8.25,9 L5.25,9 L5.25,19.5 Z M1.5,0 L22.5,0 L22.5,0 C23.3284271,-1.52179594e-16 24,0.671572875 24,1.5 L24,22.5 L24,22.5 C24,23.3284271 23.3284271,24 22.5,24 L1.5,24 L1.5,24 C0.671572875,24 1.01453063e-16,23.3284271 0,22.5 L0,1.5 L0,1.5 C-1.01453063e-16,0.671572875 0.671572875,1.52179594e-16 1.5,0 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/list-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 ListIcon({ 'aria-label': ariaLabel = 'List', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,13 L4,13 L4,11 L2,11 L2,13 Z M2,17 L4,17 L4,15 L2,15 L2,17 Z M2,9 L4,9 L4,7 L2,7 L2,9 Z M6,13 L22,13 L22,11 L6,11 L6,13 Z M6,17 L22,17 L22,15 L6,15 L6,17 Z M6,7 L6,9 L22,9 L22,7 L6,7 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/live-chat-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 LiveChatIcon({ 'aria-label': ariaLabel = 'Live Chat', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M20,6 L23,6 C23.5522847,6 24,6.44771525 24,7 L24,24 L20,20 L7,20 C6.44771525,20 6,19.5522847 6,19 L6,16 L20,16 L20,6 Z M5,14 L0,20 L0,1 C-6.76353751e-17,0.44771525 0.44771525,1.01453063e-16 1,0 L17,0 C17.5522847,-1.01453063e-16 18,0.44771525 18,1 L18,13 C18,13.5522847 17.5522847,14 17,14 L5,14 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/map-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 MapIcon({ 'aria-label': ariaLabel = 'Map', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M21.4444444,2 C21.7555556,2 22,2.24444444 22,2.55555556 L22,19.3555556 C22,19.6111111 21.8333333,19.8111111 21.6,19.8888889 L15,22 L9,19 L2.73333333,21.9666667 L2.55555556,22 C2.24444444,22 2,21.7555556 2,21.4444444 L2,4.64444444 C2,4.38888889 2.16666667,4.18888889 2.4,4.11111111 L9,2 L15,4 L21.2666667,2.03333333 L21.4444444,2 Z M15,20 L15,6 L9,4 L9,17 L15,20 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/map-pin-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 MapPinIcon({ 'aria-label': ariaLabel = 'Map Pin', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M12,24 C6.66666667,16.278852 4,10.9455187 4,8 C4,3.581722 7.581722,0 12,0 C16.418278,0 20,3.581722 20,8 C20,10.9455187 17.3333333,16.278852 12,24 Z M12,14 C15.3137085,14 18,11.3137085 18,8 C18,4.6862915 15.3137085,2 12,2 C8.6862915,2 6,4.6862915 6,8 C6,11.3137085 8.6862915,14 12,14 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/message-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 MessageIcon({ 'aria-label': ariaLabel = 'Message', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M10.5,15.633 L19.725,18.97725 L24,0 L10.5,15.633 Z M0,11.99925 L7.49925,14.5845 L24,0 L0,11.99925 Z M10.5,23.25 L14.853,18.82875 L10.5,17.24925 L10.5,23.25 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/mobile-pay-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 MobilePayIcon({ 'aria-label': ariaLabel = 'Mobile Pay', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M6,0 C4.8954305,2.02906125e-16 4,0.8954305 4,2 L4,22 C4,23.1045695 4.8954305,24 6,24 L16,24 C17.1045695,24 18,23.1045695 18,22 L18,14 L16,14 L16,20 L6,20 L6,4 L10,4 L10,0 L6,0 Z M12,9 C13.66,9 15,10.34 15,12 L12,12 L12,9 Z M12,5 C15.87,5 19,8.13 19,12 L17,12 C17,9.24 14.76,7 12,7 L12,5 Z M12,1 C18.08,1 23,5.92 23,12 L21,12 C21,7.03 16.97,3 12,3 L12,1 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/money-in-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 MoneyInIcon({ 'aria-label': ariaLabel = 'Money In', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2.14761501,18.852385 L2.14761501,18.852385 L3.58898664,17.4110134 C5.36880523,20.1718994 8.47091473,22 12,22 C17.5228475,22 22,17.5228475 22,12 C22,6.4771525 17.5228475,2 12,2 C8.47091473,2 5.36880523,3.82810059 3.58898664,6.58898664 L2.14761501,5.14761501 C4.31568302,2.03618125 7.91994596,0 12,0 C18.62775,0 24,5.373 24,12 C24,18.627 18.62775,24 12,24 C7.91994596,24 4.31568302,21.9638188 2.14761501,18.852385 Z M0,18 L0,6 L6,12 L0,18 Z M11,18.4461876 C8.57453187,18.1650794 7.06873973,16.7978464 7,14.7036169 L9.50430293,14.7036169 C9.62478485,15.7397857 10.6919105,16.4189551 12.0688468,16.4189551 C13.454389,16.4189551 14.4010327,15.748493 14.4010327,14.8255191 C14.4010327,14.0070328 13.8072289,13.5542532 12.3098107,13.2146685 L10.6919105,12.8576691 C8.40275387,12.361353 7.27538726,11.1858674 7.27538726,9.34862693 C7.27538726,7.32989847 8.77903863,5.90649143 11,5.57422136 L11,4 L13,4 L13,5.56126841 C15.3198703,5.86481374 16.7382778,7.27356464 16.7762478,9.27896852 L14.3407917,9.27896852 C14.2547332,8.21667783 13.3339071,7.57233758 12.0344234,7.57233758 C10.7521515,7.57233758 9.89156627,8.19055593 9.89156627,9.12223711 C9.89156627,9.89718687 10.4939759,10.3325519 11.9225473,10.6634293 L13.4285714,10.9855995 C15.9156627,11.5254521 17,12.6051574 17,14.5207636 C17,16.6733683 15.4771218,18.1268298 13,18.4376583 L13,20 L11,20 L11,18.4461876 L11,18.4461876 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/money-out-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 MoneyOutIcon({ 'aria-label': ariaLabel = 'Money Out', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M21.852385,18.852385 C19.684317,21.9638188 16.080054,24 12,24 C5.37225,24 -8.8817842e-16,18.627 -8.8817842e-16,12 C-8.8817842e-16,5.373 5.37225,0 12,0 C16.080054,0 19.684317,2.03618125 21.852385,5.14761501 L20.4110134,6.58898664 C18.6311948,3.82810059 15.5290853,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,17.5228475 6.4771525,22 12,22 C15.5290853,22 18.6311948,20.1718994 20.4110134,17.4110134 L21.852385,18.852385 L21.852385,18.852385 Z M18,18 L18,6 L24,12 L18,18 Z M10,18.4461876 C7.57453187,18.1650794 6.06873973,16.7978464 6,14.7036169 L8.50430293,14.7036169 C8.62478485,15.7397857 9.6919105,16.4189551 11.0688468,16.4189551 C12.454389,16.4189551 13.4010327,15.748493 13.4010327,14.8255191 C13.4010327,14.0070328 12.8072289,13.5542532 11.3098107,13.2146685 L9.6919105,12.8576691 C7.40275387,12.361353 6.27538726,11.1858674 6.27538726,9.34862693 C6.27538726,7.32989847 7.77903863,5.90649143 10,5.57422136 L10,4 L12,4 L12,5.56126841 C14.3198703,5.86481374 15.7382778,7.27356464 15.7762478,9.27896852 L13.3407917,9.27896852 C13.2547332,8.21667783 12.3339071,7.57233758 11.0344234,7.57233758 C9.75215146,7.57233758 8.89156627,8.19055593 8.89156627,9.12223711 C8.89156627,9.89718687 9.4939759,10.3325519 10.9225473,10.6634293 L12.4285714,10.9855995 C14.9156627,11.5254521 16,12.6051574 16,14.5207636 C16,16.6733683 14.4771218,18.1268298 12,18.4376583 L12,20 L10,20 L10,18.4461876 L10,18.4461876 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/more-horizontal-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 MoreHorizontalIcon({
+  'aria-label': ariaLabel = 'More Horizontal',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M4.5,9.5 C5.875,9.5 7,10.625 7,12 C7,13.375 5.875,14.5 4.5,14.5 C3.125,14.5 2,13.375 2,12 C2,10.625 3.125,9.5 4.5,9.5 Z M19.5,9.5 C20.875,9.5 22,10.625 22,12 C22,13.375 20.875,14.5 19.5,14.5 C18.125,14.5 17,13.375 17,12 C17,10.625 18.125,9.5 19.5,9.5 Z M12,9.5 C13.375,9.5 14.5,10.625 14.5,12 C14.5,13.375 13.375,14.5 12,14.5 C10.625,14.5 9.5,13.375 9.5,12 C9.5,10.625 10.625,9.5 12,9.5 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/more-vertical-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 MoreVerticalIcon({
+  'aria-label': ariaLabel = 'More Vertical',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M12,7 C13.375,7 14.5,5.875 14.5,4.5 C14.5,3.125 13.375,2 12,2 C10.625,2 9.5,3.125 9.5,4.5 C9.5,5.875 10.625,7 12,7 Z M12,9.5 C10.625,9.5 9.5,10.625 9.5,12 C9.5,13.375 10.625,14.5 12,14.5 C13.375,14.5 14.5,13.375 14.5,12 C14.5,10.625 13.375,9.5 12,9.5 Z M12,17 C10.625,17 9.5,18.125 9.5,19.5 C9.5,20.875 10.625,22 12,22 C13.375,22 14.5,20.875 14.5,19.5 C14.5,18.125 13.375,17 12,17 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/move-from-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 MoveFromIcon({ 'aria-label': ariaLabel = 'Move From', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,0 L20,0 C21.11,0 22,0.9 22,2 L22,7 L20,5 L20,2 L2,2 L2,22 L20,22 L20,19 L22,17 L22,22 C22,23.1 21.11,24 20,24 L2,24 C0.9,24 0,23.1 0,22 L0,2 C0,0.9 0.9,0 2,0 Z M24,12 L18.015,18 L18.015,14 L10,14 L10,10 L18.015,10 L18.015,6 L24,12 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/move-to-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 MoveToIcon({ 'aria-label': ariaLabel = 'Move To', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M22,0 C23.1,0 24,0.9 24,2 L24,22 C24,23.1 23.1,24 22,24 L4,24 C2.89,24 2,23.1 2,22 L2,18 L4,18 L4,22 L22,22 L22,2 L4,2 L4,6 L2,6 L2,2 C2,0.9 2.89,0 4,0 L22,0 Z M14,12 L8.015,18 L8.015,14 L0,14 L0,10 L8.015,10 L8.015,6 L14,12 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/new-content-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 NewContentIcon({
+  'aria-label': ariaLabel = 'New Content',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M12.0708889,4 L4,4 L4,22 L20,22 L20,11.9291111 C20.7061453,11.828105 21.3782934,11.6217094 22,11.3263688 L22,22 C22,23.1045695 21.1045695,24 20,24 L4,24 C2.8954305,24 2,23.1045695 2,22 L2,4 C2,2.8954305 2.8954305,2 4,2 L12.6736312,2 C12.3782906,2.62170659 12.171895,3.2938547 12.0708889,4 Z M19,0 C21.7614286,0 24,2.23857143 24,5 C24,7.76142857 21.7614286,10 19,10 C16.2385714,10 14,7.76142857 14,5 C14,2.23857143 16.2385714,0 19,0 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/new-window-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 NewWindowIcon({ 'aria-label': ariaLabel = 'New Window', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M12,0 L12,2 L2,2 L2,22 L22,22 L22,12 L24,12 L24,22 C24,23.1045695 23.1045695,24 22,24 L2,24 C0.8954305,24 0,23.1045695 0,22 L0,2 C-3.33066907e-16,0.8954305 0.8954305,0 2,0 L12,0 Z M22,3.41682007 L12.3997851,13.0170349 L10.9855716,11.6028214 L20.5883929,2 L16,2 L16,0 L24,0 L24,8 L22,8 L22,3.41682007 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/notification-active-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 NotificationActiveIcon({
+  'aria-label': ariaLabel = 'Notification Active',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M14,3.25203497 C17.4504544,4.14012056 20,7.27232114 20,11 L20,17 L22,19 L22,20 L2,20 L2,19 L4,17 L4,11 C4,7.27232114 6.54954557,4.14012056 10,3.25203497 L10,2 C10,0.8954305 10.8954305,0 12,0 C13.1045695,0 14,0.8954305 14,2 L14,3.25203497 L14,3.25203497 Z M9,21 L15.003,21 C15.003,22.6568542 13.6591827,24 12.0015,24 C10.3438173,24 9,22.6568542 9,21 Z M0.041073777,10 C0.316286557,6.66401946 1.95604422,3.71495492 4.40091892,1.71223423 L5.66743243,3.2601952 C3.67084816,4.89569849 2.31858497,7.28854422 2.04937524,10 L0.041073777,10 L0.041073777,10 Z M23.9589262,10 L23.9589262,10 L21.9506248,10 C21.681415,7.28854422 20.3291518,4.89569849 18.3325676,3.2601952 L19.5990811,1.71223423 C22.0439558,3.71495492 23.6837134,6.66401946 23.9589262,10 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/notification-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 NotificationIcon({
+  'aria-label': ariaLabel = 'Notification',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M14,3.25203497 C17.4504544,4.14012056 20,7.27232114 20,11 L20,17 L22,19 L22,20 L2,20 L2,19 L4,17 L4,11 C4,7.27232114 6.54954557,4.14012056 10,3.25203497 L10,2 C10,0.8954305 10.8954305,0 12,0 C13.1045695,0 14,0.8954305 14,2 L14,3.25203497 L14,3.25203497 Z M9,21 L15.003,21 C15.003,22.6568542 13.6591827,24 12.0015,24 C10.3438173,24 9,22.6568542 9,21 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/notification-off-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 NotificationOffIcon({
+  'aria-label': ariaLabel = 'Notification Off',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M9,21 L15.003,21 C15.003,22.6568542 13.6591827,24 12.0015,24 C10.3438173,24 9,22.6568542 9,21 Z M10,3.25203497 L10,2 C10,0.8954305 10.8954305,-8.8817842e-16 12,-8.8817842e-16 C13.1045695,-8.8817842e-16 14,0.8954305 14,2 L14,3.25203497 C17.4504544,4.14012056 20,7.27232114 20,11 L20,16.4226821 L7.77974993,4.20243206 C8.45863802,3.78005235 9.20543208,3.45654262 10,3.25203497 Z M2.37898178,1.62101822 L22.3789818,21.6210182 L20.9647682,23.0352318 L17.9295364,20 L2,20 L2,19 L4,17 L4,11 C4,9.57970281 4.37012145,8.24585212 5.01917435,7.08963792 L0.964768219,3.03523178 L2.37898178,1.62101822 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/office-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 OfficeIcon({ 'aria-label': ariaLabel = 'Office', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M14,6 L24,6 L24,24 L0,24 L0,0 L14,0 L14,6 Z M14,8 L14,22 L22,22 L22,8 L14,8 Z M16,10 L20,10 L20,12 L16,12 L16,10 Z M16,14 L20,14 L20,16 L16,16 L16,14 Z M16,18 L20,18 L20,20 L16,20 L16,18 Z M2,4 L2,8 L6,8 L6,4 L2,4 Z M8,4 L8,8 L12,8 L12,4 L8,4 Z M2,10 L2,14 L6,14 L6,10 L2,10 Z M8,10 L8,14 L12,14 L12,10 L8,10 Z M2,16 L2,20 L6,20 L6,16 L2,16 Z M8,16 L8,20 L12,20 L12,16 L8,16 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/open-browser-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 OpenBrowserIcon({
+  'aria-label': ariaLabel = 'Open Browser',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M22,0 L2,0 C0.89,0 0,0.9 0,2 L0,18 C0,19.1 0.89,20 2,20 L7,20 L7,18 L2,18 L2,6 L22,6 L22,18 L17,18 L17,20 L22,20 C23.1,20 24,19.1 24,18 L24,2 C24,0.9 23.11,0 22,0 Z M12,9 L6,15 L10,15 L10,24 L14,24 L14,15 L18,15 L12,9 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/padlock-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 PadlockIcon({ 'aria-label': ariaLabel = 'Padlock', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M6,8 L6,6 C6,2.6862915 8.6862915,0 12,0 C15.3137085,0 18,2.6862915 18,6 L18,8 L20,8 C21.1045695,8 22,8.8954305 22,10 L22,22 C22,23.1045695 21.1045695,24 20,24 L4,24 C2.8954305,24 2,23.1045695 2,22 L2,10 C2,8.8954305 2.8954305,8 4,8 L6,8 Z M16,8 L16,6 C16,3.790861 14.209139,2 12,2 C9.790861,2 8,3.790861 8,6 L8,8 L16,8 Z M12,18.5 C13.3807119,18.5 14.5,17.3807119 14.5,16 C14.5,14.6192881 13.3807119,13.5 12,13.5 C10.6192881,13.5 9.5,14.6192881 9.5,16 C9.5,17.3807119 10.6192881,18.5 12,18.5 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/padlock-open-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 PadlockOpenIcon({
+  'aria-label': ariaLabel = 'Padlock Open',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M16,8 L16,6 C16,3.790861 14.209139,2 12,2 C9.790861,2 8,3.790861 8,6 L6,6 C6,2.6862915 8.6862915,0 12,0 C15.3137085,0 18,2.6862915 18,6 L18,8 L20,8 C21.1045695,8 22,8.8954305 22,10 L22,22 C22,23.1045695 21.1045695,24 20,24 L4,24 C2.8954305,24 2,23.1045695 2,22 L2,10 C2,8.8954305 2.8954305,8 4,8 L16,8 Z M12,18.5 C13.3807119,18.5 14.5,17.3807119 14.5,16 C14.5,14.6192881 13.3807119,13.5 12,13.5 C10.6192881,13.5 9.5,14.6192881 9.5,16 C9.5,17.3807119 10.6192881,18.5 12,18.5 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/pause-circle-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 PauseCircleIcon({ 'aria-label': ariaLabel = 'Pause', 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 M9,16 L9,8 L11,8 L11,16 L9,16 Z M13,16 L13,8 L15,8 L15,16 L13,16 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/pause-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 PauseIcon({ 'aria-label': ariaLabel = 'Pause', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M6,19 L10,19 L10,5 L6,5 L6,19 Z M14,5 L14,19 L18,19 L18,5 L14,5 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/pay-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 PayIcon({ 'aria-label': ariaLabel = 'Pay', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M12,14 L4,22 L4,18 L0,18 L0,10 L4,10 L4,6 L12,14 Z M14.8269987,14.0014284 C14.8856891,14.0004762 14.9433762,14 15,14 C18.00375,14 24,15.34 24,18 L24,22 L6.82842712,22 L14.8269987,14.0014284 L14.8269987,14.0014284 Z M20,7 C20,9.7625 17.7625,12 15,12 C12.2375,12 10,9.7625 10,7 C10,4.2375 12.2375,2 15,2 C17.7625,2 20,4.2375 20,7 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/pay-to-mobile-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 PayToMobileIcon({
+  'aria-label': ariaLabel = 'Pay To Mobile',
+  copyrightYear = '2020',
+  ...props
+}: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M2,17 L2,19 C4.76,19 7,21.24 7,24 L9,24 C9,20.13 5.87,17 2,17 Z M2,21 L2,24 L5,24 C5,22.34 3.66,21 2,21 Z M2,13 C8.08,13 13,17.92 13,24 L11,24 C11,19.03 6.97,15 2,15 L2,13 Z M18,24 L15,24 C15,22.6043798 14.7800789,21.260125 14.3730012,20 L18,20 L18,4 L8,4 L8,12.4644213 C7.36250073,12.1321607 6.69400958,11.8511954 6,11.6269988 L6,2 C6,0.9 6.9,0 8,0 L18,0 C19.1,0 20,0.9 20,2 L20,22 C20,23.1 19.1,24 18,24 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/paypass-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 PaypassIcon({ 'aria-label': ariaLabel = 'Paypass', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M14.3137085,0.686291501 C17.209139,3.581722 19,7.581722 19,12 C19,16.418278 17.209139,20.418278 14.3137085,23.3137085 L12.8994949,21.8994949 C15.4329966,19.3659932 17,15.8659932 17,12 C17,8.13400675 15.4329966,4.63400675 12.8994949,2.10050506 L14.3137085,0.686291501 L14.3137085,0.686291501 Z M11.4852814,3.51471863 C13.6568542,5.6862915 15,8.6862915 15,12 C15,15.3137085 13.6568542,18.3137085 11.4852814,20.4852814 L10.0710678,19.0710678 C11.8807119,17.2614237 13,14.7614237 13,12 C13,9.23857625 11.8807119,6.73857625 10.0710678,4.92893219 L11.4852814,3.51471863 Z M8.65685425,6.34314575 C10.1045695,7.790861 11,9.790861 11,12 C11,14.209139 10.1045695,16.209139 8.65685425,17.6568542 L7.24264069,16.2426407 C8.32842712,15.1568542 9,13.6568542 9,12 C9,10.3431458 8.32842712,8.84314575 7.24264069,7.75735931 L8.65685425,6.34314575 L8.65685425,6.34314575 Z M5.82842712,9.17157288 C6.55228475,9.8954305 7,10.8954305 7,12 C7,13.1045695 6.55228475,14.1045695 5.82842712,14.8284271 L4.41421356,13.4142136 C4.77614237,13.0522847 5,12.5522847 5,12 C5,11.4477153 4.77614237,10.9477153 4.41421356,10.5857864 L5.82842712,9.17157288 L5.82842712,9.17157288 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/pdf-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 PdfFileIcon({ 'aria-label': ariaLabel = 'PDF 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 M18.5030447,16.5503616 C18.417082,16.6046746 18.1736303,16.6361895 18.0167975,16.6361895 C17.5102081,16.6361895 16.8835333,16.3988218 16.0055323,16.014608 C16.342165,15.9891278 16.6518932,15.9757172 16.9294675,15.9757172 C17.4367132,15.9757172 17.5882963,15.9743762 18.085699,16.1037885 C18.581133,16.2325303 18.5883512,16.4960487 18.5030447,16.5503616 L18.5030447,16.5503616 Z M9.68431929,16.6308252 C9.87789946,16.2761148 10.0800103,15.9026294 10.2860583,15.5063461 C10.7880544,14.5367594 11.1056571,13.7763782 11.3418906,13.1521146 C11.8117326,14.0258154 12.3977228,14.7687629 13.0847684,15.3628526 C13.1700749,15.4372815 13.2612872,15.5117103 13.3577492,15.5854687 C11.9580661,15.8684324 10.7486822,16.2124144 9.68431929,16.6308252 L9.68431929,16.6308252 Z M11.3162986,7.45663106 C11.5945291,7.45663106 11.7526743,8.17342785 11.7657983,8.8452991 C11.7789224,9.51717036 11.6253707,9.98855309 11.4344153,10.3365583 C11.2762702,9.82092054 11.2001505,9.00622635 11.2001505,8.4744959 C11.2001505,8.4744959 11.188995,7.45663106 11.3162986,7.45663106 L11.3162986,7.45663106 Z M5.84552595,20.3301403 C6.00301491,19.8889315 6.62772111,19.0165717 7.55165632,18.2441209 C7.60940227,18.1958427 7.75311095,18.0597251 7.88369554,17.9316538 C6.91776327,19.5060587 6.27140234,20.1330045 5.84552595,20.3301403 L5.84552595,20.3301403 Z M18.7720883,15.6243594 C18.4932016,15.3427367 17.8711203,15.192538 16.9268427,15.1804684 C16.2870438,15.1730926 15.5179728,15.2307582 14.7088732,15.3467599 C14.3466486,15.1321902 13.9726124,14.9008573 13.6806016,14.6205757 C12.8911882,13.8682408 12.2336718,12.8235548 11.8235443,11.6735955 C11.8504487,11.5663106 11.8721034,11.4724364 11.8937581,11.3765506 C11.8937581,11.3765506 12.3380082,8.79769146 12.2205477,7.92533167 C12.2041426,7.80664783 12.1942995,7.77178026 12.1628018,7.67790603 L12.1247419,7.5773265 C12.0033442,7.29235117 11.7671107,6.99061258 11.3950431,7.00737583 L11.1771834,7 L11.1706213,7 C10.7572128,7 10.4192678,7.21658125 10.3306802,7.53910628 C10.0609804,8.55495953 10.3392109,10.0730399 10.8425193,12.0390344 L10.7139033,12.3602184 C10.3529912,13.2587289 9.90152281,14.1632741 9.50255078,14.9618756 L9.45071067,15.0658077 C9.03205252,15.9039705 8.6501418,16.6160736 8.3049785,17.2202213 L7.94865974,17.4126634 C7.92306778,17.426074 7.31345427,17.7566454 7.1697456,17.8444849 C5.95445581,18.5860913 5.14994972,19.4282772 5.01674031,20.0961253 C4.97343085,20.3086834 5.00492864,20.5815892 5.22147596,20.7076488 L5.56598305,20.8853393 C5.71559756,20.9617798 5.87308652,21 6.0338565,21 C6.90070197,21 7.90469407,19.8983189 9.28797208,17.4300972 C10.886485,16.8983668 12.7061387,16.4564874 14.3007144,16.2130849 C15.5160041,16.9124479 17.0101806,17.3979118 17.9531458,17.3979118 C18.121134,17.3979118 18.2654989,17.3824896 18.3829594,17.3496336 C18.5640717,17.3013554 18.716311,17.1960822 18.809492,17.0525887 C18.9925729,16.770966 19.0293203,16.3833996 18.980105,15.9864457 C18.9630437,15.8697735 18.8718313,15.7242684 18.7720883,15.6243594 L18.7720883,15.6243594 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/pending-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 PendingIcon({ 'aria-label': ariaLabel = 'Pending', 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 M10.5,14.5 C9.11928813,14.5 8,13.3807119 8,12 C8,10.6192881 9.11928813,9.5 10.5,9.5 C11.8807119,9.5 13,10.6192881 13,12 C13,13.3807119 11.8807119,14.5 10.5,14.5 Z"
+      />
+    </Icon>
+  );
+}

package/src/components/icon/components/people-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 PeopleIcon({ 'aria-label': ariaLabel = 'People', copyrightYear = '2020', ...props }: IconProps) {
+  return (
+    <Icon aria-label={ariaLabel} copyrightYear={copyrightYear} {...props}>
+      <path
+        fill="currentColor"
+        fillRule="evenodd"
+        d="M17.7223772,14.2593068 C20.6642206,14.7663417 24,16.0160056 24,18 L24,22 L20,22 L20,18 C20,16.4654583 19.112709,15.214323 17.7223772,14.2593068 L17.7223772,14.2593068 Z M13.9997631,11.9000397 L13.9997631,11.9000397 C15.237188,10.6375754 16,8.90816252 16,7 C16,5.09183748 15.237188,3.36242456 13.9997631,2.09996035 C14.3229246,2.03440871 14.6574255,2 15,2 C17.7625,2 20,4.2375 20,7 C20,9.7625 17.7625,12 15,12 C14.6574255,12 14.3229246,11.9655913 13.9997631,11.9000397 Z M14,7 C14,9.7625 11.7625,12 9,12 C6.2375,12 4,9.7625 4,7 C4,4.2375 6.2375,2 9,2 C11.7625,2 14,4.2375 14,7 Z M0,18 C0,15.34 5.99625,14 9,14 C12.00375,14 18,15.34 18,18 L18,22 L0,22 L0,18 Z"
+      />
+    </Icon>
+  );
+}