@scottish-government/designsystem-react 0.12.1 → 0.13.0

package/src/hooks/useTracking/useTracking.ts

@@ -1,6 +1,6 @@
 import { useEffect } from 'react';
 
-//@ts-ignore
+// @ts-expect-error no types from core SGDS
 import DSTracking from '@scottish-government/design-system/src/base/tools/tracking/tracking';
 
 export default function () {

package/src/images/icons/arrow_upward.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgArrowUpward = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0V0z" fill="none" />
-        <path d="M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0V0z" fill="none" />
+    <path d="M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z" />
+  </svg>
 );
 export default SvgArrowUpward;

package/src/images/icons/calendar_today.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgCalendarToday = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z" />
+  </svg>
 );
 export default SvgCalendarToday;

package/src/images/icons/cancel.tsx

@@ -1,13 +1,13 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgCancel = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        role="img"
-        {...props}
-    >
-        <path d="m8.4 17 3.6-3.6 3.6 3.6 1.4-1.4-3.6-3.6L17 8.4 15.6 7 12 10.6 8.4 7 7 8.4l3.6 3.6L7 15.6 8.4 17Zm3.6 5c-1.4 0-2.7-.3-3.9-.8S5.8 20 4.9 19.1s-1.6-2-2.1-3.2S2 13.4 2 12s.3-2.7.8-3.9S4 5.8 4.9 4.9s2-1.6 3.2-2.1S10.6 2 12 2s2.7.3 3.9.8 2.3 1.2 3.2 2.1 1.6 2 2.1 3.2.8 2.5.8 3.9-.3 2.7-.8 3.9-1.2 2.3-2.1 3.2-2 1.6-3.2 2.1-2.5.8-3.9.8Z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    role="img"
+    {...props}
+  >
+    <path d="m8.4 17 3.6-3.6 3.6 3.6 1.4-1.4-3.6-3.6L17 8.4 15.6 7 12 10.6 8.4 7 7 8.4l3.6 3.6L7 15.6 8.4 17Zm3.6 5c-1.4 0-2.7-.3-3.9-.8S5.8 20 4.9 19.1s-1.6-2-2.1-3.2S2 13.4 2 12s.3-2.7.8-3.9S4 5.8 4.9 4.9s2-1.6 3.2-2.1S10.6 2 12 2s2.7.3 3.9.8 2.3 1.2 3.2 2.1 1.6 2 2.1 3.2.8 2.5.8 3.9-.3 2.7-.8 3.9-1.2 2.3-2.1 3.2-2 1.6-3.2 2.1-2.5.8-3.9.8Z" />
+  </svg>
 );
 export default SvgCancel;

package/src/images/icons/check_circle.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgCheckCircle = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" />
+  </svg>
 );
 export default SvgCheckCircle;

package/src/images/icons/chevron_left.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgChevronLeft = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" />
+  </svg>
 );
 export default SvgChevronLeft;

package/src/images/icons/chevron_right.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgChevronRight = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" />
+  </svg>
 );
 export default SvgChevronRight;

package/src/images/icons/close.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgClose = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" />
+  </svg>
 );
 export default SvgClose;

package/src/images/icons/description.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgDescription = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm2 16H8v-2h8v2zm0-4H8v-2h8v2zm-3-5V3.5L18.5 9H13z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M14 2H6c-1.1 0-1.99.9-1.99 2L4 20c0 1.1.89 2 1.99 2H18c1.1 0 2-.9 2-2V8l-6-6zm2 16H8v-2h8v2zm0-4H8v-2h8v2zm-3-5V3.5L18.5 9H13z" />
+  </svg>
 );
 export default SvgDescription;

package/src/images/icons/double_chevron_left.tsx

@@ -1,13 +1,13 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgDoubleChevronLeft = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        role="img"
-        {...props}
-    >
-        <path d="M19 16.6 17.6 18l-6-6 6-6L19 7.4 14.4 12l4.6 4.6Zm-6.6 0L11 18l-6-6 6-6 1.4 1.4L7.8 12l4.6 4.6Z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    role="img"
+    {...props}
+  >
+    <path d="M19 16.6 17.6 18l-6-6 6-6L19 7.4 14.4 12l4.6 4.6Zm-6.6 0L11 18l-6-6 6-6 1.4 1.4L7.8 12l4.6 4.6Z" />
+  </svg>
 );
 export default SvgDoubleChevronLeft;

package/src/images/icons/double_chevron_right.tsx

@@ -1,13 +1,13 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgDoubleChevronRight = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        role="img"
-        {...props}
-    >
-        <path d="M9.6 12 5 7.4 6.4 6l6 6-6 6L5 16.6 9.6 12Zm6.6 0-4.6-4.6L13 6l6 6-6 6-1.4-1.4 4.6-4.6Z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    role="img"
+    {...props}
+  >
+    <path d="M9.6 12 5 7.4 6.4 6l6 6-6 6L5 16.6 9.6 12Zm6.6 0-4.6-4.6L13 6l6 6-6 6-1.4-1.4 4.6-4.6Z" />
+  </svg>
 );
 export default SvgDoubleChevronRight;

package/src/images/icons/error.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgError = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" />
+  </svg>
 );
 export default SvgError;

package/src/images/icons/expand_less.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgExpandLess = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z" />
+  </svg>
 );
 export default SvgExpandLess;

package/src/images/icons/expand_more.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgExpandMore = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z" />
+  </svg>
 );
 export default SvgExpandMore;

package/src/images/icons/list.tsx

@@ -1,18 +1,18 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgList = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <g fill="none">
-            <path d="M0 0h24v24H0V0z" />
-            <path d="M0 0h24v24H0V0z" opacity={0.87} />
-        </g>
-        <path d="M3 13h2v-2H3v2zm0 4h2v-2H3v2zm0-8h2V7H3v2zm4 4h14v-2H7v2zm0 4h14v-2H7v2zM7 7v2h14V7H7zm-4 6h2v-2H3v2zm0 4h2v-2H3v2zm0-8h2V7H3v2zm4 4h14v-2H7v2zm0 4h14v-2H7v2zM7 7v2h14V7H7z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <g fill="none">
+      <path d="M0 0h24v24H0V0z" />
+      <path d="M0 0h24v24H0V0z" opacity={0.87} />
+    </g>
+    <path d="M3 13h2v-2H3v2zm0 4h2v-2H3v2zm0-8h2V7H3v2zm4 4h14v-2H7v2zm0 4h14v-2H7v2zM7 7v2h14V7H7zm-4 6h2v-2H3v2zm0 4h2v-2H3v2zm0-8h2V7H3v2zm4 4h14v-2H7v2zm0 4h14v-2H7v2zM7 7v2h14V7H7z" />
+  </svg>
 );
 export default SvgList;

package/src/images/icons/menu.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgMenu = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" />
+  </svg>
 );
 export default SvgMenu;

package/src/images/icons/priority_high.tsx

@@ -1,16 +1,16 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgPriorityHigh = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <circle cx={12} cy={19} r={2} />
-        <path d="M10 3h4v12h-4z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <circle cx={12} cy={19} r={2} />
+    <path d="M10 3h4v12h-4z" />
+  </svg>
 );
 export default SvgPriorityHigh;

package/src/images/icons/search.tsx

@@ -1,15 +1,15 @@
 import * as React from "react";
 import type { SVGProps } from "react";
 const SvgSearch = (props: SVGProps<SVGSVGElement>) => (
-    <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 24 24"
-        fill="#000000"
-        role="img"
-        {...props}
-    >
-        <path d="M0 0h24v24H0z" fill="none" />
-        <path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" />
-    </svg>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="#000000"
+    role="img"
+    {...props}
+  >
+    <path d="M0 0h24v24H0z" fill="none" />
+    <path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" />
+  </svg>
 );
 export default SvgSearch;

package/src/shared-types.ts

@@ -0,0 +1,40 @@
+export type HeadingLevel = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+export type IconName = 'ArrowUpward' | 'CalendarToday' | 'Cancel' | 'CheckCircle' | 'ChevronLeft' | 'ChevronRight' | 'Close' | 'Description' | 'DoubleChevronLeft' | 'DoubleChevronRight' | 'Error' | 'ExpandLess' | 'ExpandMore' | 'List' | 'Menu' | 'PriorityHigh' | 'Search';
+export type DocumentIconName = 'Audio' | 'Csv' | 'Excel' | 'File' | 'Generic' | 'Geodata' | 'Ical' | 'Ico' | 'Image' | 'Odf' | 'Odg' | 'Odp' | 'Ods' | 'Odt' | 'Pdf' | 'Ppt' | 'Rtf' | 'Text' | 'Video' | 'Word' | 'Xml' | 'Zip';
+export type InputWidth = 'fixed-20' | 'fixed-10' | 'fixed-5' | 'fixed-4' | 'fixed-3' | 'fixed-2' | 'fluid-three-quarters' | 'fluid-two-thirds' | 'fluid-half' | 'fluid-one-third' | 'fluid-one-quarter';
+export type TagColour = 'grey' | 'green' | 'teal' | 'blue' | 'purple' | 'pink' | 'red' | 'orange' | 'yellow';
+export type TextInputType = 'date' | 'datetime-local' | 'email' | 'month' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'time' | 'url' | 'week';
+
+export type LinkComponentProps = {
+    'aria-label'?: React.AriaAttributes['aria-label'];
+    'aria-current'?: React.AriaAttributes['aria-current'];
+    'aria-describedby'?: React.AriaAttributes['aria-describedby'];
+    children?: React.ReactNode;
+    className?: string;
+    href?: string;
+    onClick?: React.EventHandler<React.MouseEvent>;
+}
+
+export type LinkComponent = (linkComponent: LinkComponentProps) => React.ReactNode;
+
+export interface CheckboxRadioBase<T> extends React.InputHTMLAttributes<T> {
+    hintText?: string;
+    label: string;
+    onBlur?: React.FocusEventHandler<T>;
+    onChange?: React.ChangeEventHandler<T>;
+    isSmall?: boolean;
+}
+
+export interface FormFieldBase<T> extends React.AllHTMLAttributes <T> {
+    errorMessage?: string;
+    hasError?: boolean;
+    hintText?: string;
+    label: string;
+    onBlur?: React.FocusEventHandler<T>;
+    onChange?: React.ChangeEventHandler<T>;
+}
+
+export interface TextInputBase<T> extends FormFieldBase<T> {
+    countThreshold?: number;
+    maxlength?: number;
+}

package/vite.config.ts

@@ -1,4 +1,5 @@
-/// <reference types="vitest/config" />
+import "vitest/config";
+
 import { defineConfig } from 'vitest/config';
 import react from "@vitejs/plugin-react-swc";
 import { playwright } from '@vitest/browser-playwright';

package/@types/common/AbstractNotificationBanner.d.ts

@@ -1,17 +0,0 @@
-declare namespace SGDS.Common {
-    namespace AbstractNotificationBanner {
-        interface Buttons extends React.AllHTMLAttributes<HTMLDivElement> {
-            children: React.ReactNode
-        }
-    }
-
-    interface AbstractNotificationBanner extends React.AllHTMLAttributes<HTMLDivElement> {
-        hasIcon?: boolean,
-        hasColourIcon?: boolean,
-        hasInverseIcon?: boolean,
-        icon?: IconName,
-        isDismissable?: boolean,
-        title: string,
-        ref?: any
-    }
-}

package/@types/common/ActionLink.d.ts

@@ -1,8 +0,0 @@
-declare namespace SGDS.Common {
-    interface ActionLink extends React.AllHTMLAttributes<HTMLElement> {
-        describedby?: string,
-        href?: string,
-        linkComponent?: SGDS.LinkComponent,
-        onclick?: React.EventHandler<any>
-    }
-}

package/@types/common/ConditionalWrapper.d.ts

@@ -1,6 +0,0 @@
-declare namespace SGDS.Common {
-    interface ConditionalWrapper extends React.AllHTMLAttributes<HTMLElement> {
-        condition: boolean,
-        wrapper: any
-    }
-}

package/@types/common/FileIcon.d.ts

@@ -1,7 +0,0 @@
-declare namespace SGDS.Common {
-    interface FileIcon extends React.AllHTMLAttributes<SVGSVGElement> {
-        ariaLabel?: React.AriaAttributes['aria-label'],
-        className?: string,
-        icon: DocumentIconName
-    }
-}

package/@types/common/HintText.d.ts

@@ -1,6 +0,0 @@
-declare namespace SGDS.Common {
-    interface HintText extends React.AllHTMLAttributes<HTMLElement> {
-        id?: string,
-        text?: string
-    }
-}

package/@types/common/Icon.d.ts

@@ -1,9 +0,0 @@
-declare namespace SGDS.Common {
-    interface Icon extends React.AllHTMLAttributes<SVGSVGElement> {
-        ariaLabel?: React.AriaAttributes['aria-label'],
-        className?: string,
-        isFilled?: boolean,
-        icon: IconName,
-        iconSize?: string
-    }
-}

package/@types/common/ScreenReaderText.d.ts

@@ -1,4 +0,0 @@
-declare namespace SGDS.Common {
-    interface ScreenReaderText extends React.AllHTMLAttributes<HTMLElement> {
-    }
-}

package/@types/common/WrapperTag.d.ts

@@ -1,5 +0,0 @@
-declare namespace SGDS.Common {
-    interface WrapperTag extends React.AllHTMLAttributes<HTMLElement> {
-        tagName?: string
-    }
-}

package/@types/components/Accordion.d.ts

@@ -1,15 +0,0 @@
-declare namespace SGDS.Component {
-    namespace Accordion {
-        interface Item extends React.AllHTMLAttributes<HTMLElement> {
-            id?: string,
-            heading: string | React.ReactNode
-            isOpen?: boolean,
-        }
-    }
-
-    interface Accordion extends React.AllHTMLAttributes<HTMLElement> {
-        headingLevel?: SGDS.HeadingLevel,
-        hideOpenAll?: boolean,
-        isSmall?: boolean
-    }
-}

package/@types/components/AspectBox.d.ts

@@ -1,5 +0,0 @@
-declare namespace SGDS.Component {
-    interface AspectBox extends React.AllHTMLAttributes<HTMLElement> {
-        ratio?: 'square' | '1:1' | '4:3' | '16:9' | '21:9';
-    }
-}

package/@types/components/BackToTop.d.ts

@@ -1,5 +0,0 @@
-declare namespace SGDS.Component {
-    interface BackToTop extends React.AllHTMLAttributes<HTMLElement> {
-        href?: string;
-    }
-}

package/@types/components/Breadcrumbs.d.ts

@@ -1,11 +0,0 @@
-declare namespace SGDS.Component {
-    namespace Breadcrumbs {
-        interface Item extends React.AllHTMLAttributes<HTMLElement> {
-            isHidden?: boolean,
-            linkComponent?: SGDS.LinkComponent
-        }
-    }
-
-    interface Breadcrumbs extends React.AllHTMLAttributes<HTMLElement> {
-    }
-}