@bcgov/design-system-react-components 0.1.1-pr434 → 0.1.1-pr437

package/dist/cjs/types/components/Icons/SvgCheckCircleIcon/SvgCheckCircleIcon.d.ts

@@ -0,0 +1,3 @@
+export default function SvgCheckCircleIcon({ id }: {
+    id?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/components/Icons/SvgCheckCircleIcon/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./SvgCheckCircleIcon";

package/dist/cjs/types/components/Icons/SvgCloseIcon/SvgCloseIcon.d.ts

@@ -0,0 +1,3 @@
+export default function SvgCloseIcon({ id }: {
+    id?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/components/Icons/SvgCloseIcon/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./SvgCloseIcon";

package/dist/cjs/types/components/Icons/SvgExclamationCircleIcon/SvgExclamationCircleIcon.d.ts

@@ -0,0 +1,3 @@
+export default function SvgExclamationCircleIcon({ id, }: {
+    id?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/components/Icons/SvgExclamationCircleIcon/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./SvgExclamationCircleIcon";

package/dist/cjs/types/components/Icons/SvgInfoIcon/SvgInfoIcon.d.ts

@@ -0,0 +1,3 @@
+export default function SvgInfoIcon({ id }: {
+    id?: string | undefined;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/components/Icons/SvgInfoIcon/index.d.ts

@@ -0,0 +1 @@
+export { default } from "./SvgInfoIcon";

package/dist/cjs/types/components/InlineAlert/InlineAlert.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import "./InlineAlert.css";
+export interface InlineAlertProps extends React.PropsWithChildren {
+    variant?: "info" | "success" | "warning" | "danger";
+    title?: string;
+    description?: string;
+    isCloseable?: boolean;
+    isIconHidden?: boolean;
+    role?: React.AriaRole | undefined;
+    onClose?: () => void;
+}
+export default function InlineAlert({ variant, title, description, isIconHidden, isCloseable, role, children, onClose, ...props }: InlineAlertProps): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/components/InlineAlert/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./InlineAlert";
+export type { InlineAlertProps } from "./InlineAlert";

package/dist/cjs/types/components/Select/Select.d.ts

@@ -31,7 +31,10 @@ export interface SelectProps<T extends object> extends ReactAriaSelectProps<T> {
     placeholder?: string;
     /** Defaults to `medium` */
     size?: "small" | "medium";
+    /** Description or helper text that renders below the select input */
+    description?: string;
+    /** Used for data validation and error handling */
     errorMessage?: string | ((validation: ValidationResult) => string);
 }
 /** Select displays a collapsible list of options and allows a user to select one of them. */
-export default function Select<T extends object>({ items, sections, label, placeholder, size, errorMessage, ...props }: SelectProps<T>): import("react/jsx-runtime").JSX.Element;
+export default function Select<T extends object>({ items, sections, label, description, placeholder, size, errorMessage, ...props }: SelectProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/types/components/index.d.ts

@@ -1,10 +1,16 @@
 import "@bcgov/design-tokens/css/variables.css";
+export { default as InlineAlert } from "./InlineAlert";
 export { default as Button } from "./Button";
 export { default as Header } from "./Header";
 export { default as Footer, FooterLinks } from "./Footer";
 export { default as Form } from "./Form";
 export { default as Select } from "./Select";
-export { default as SvgBcLogo } from "./SvgBcLogo";
+export { default as SvgBcLogo } from "./Icons/SvgBcLogo";
+export { default as SvgCheckCircleIcon } from "./Icons/SvgCheckCircleIcon";
+export { default as SvgExclamationIcon } from "./Icons/SvgExclamationIcon";
+export { default as SvgExclamationCircleIcon } from "./Icons/SvgExclamationCircleIcon";
+export { default as SvgCloseIcon } from "./Icons/SvgCloseIcon";
+export { default as SvgInfoIcon } from "./Icons/SvgInfoIcon";
 export { default as Tag } from "./Tag";
 export { default as TagGroup } from "./TagGroup";
 export { default as TagList } from "./TagList";

package/dist/esm/index.js

@@ -1,4 +1,4 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import $dbSRa$react, { useMemo, cloneElement, useContext, useState, useRef, forwardRef, createContext, useCallback, useEffect, createElement } from 'react';
 import $iETbY$reactdom, { createPortal, flushSync } from 'react-dom';
 
@@ -29,9 +29,30 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z$a = "/**\n * Do not edit directly\n * Generated on Wed, 01 May 2024 18:02:21 GMT\n */\n\n:root {\n  --surface-opacity-0: 0;\n  --surface-opacity-10: 0.1;\n  --surface-opacity-20: 0.2;\n  --surface-opacity-30: 0.3;\n  --surface-opacity-40: 0.4;\n  --surface-opacity-50: 0.5;\n  --surface-opacity-60: 0.6;\n  --surface-opacity-70: 0.7;\n  --surface-opacity-80: 0.8;\n  --surface-opacity-90: 0.9;\n  --surface-opacity-100: 1;\n  --surface-shadow-none: 0 0.30000001192092896px 0.8999999761581421px 0 #0000001a, 0 1.600000023841858px 3.5999999046325684px 0 #00000021;\n  --surface-shadow-small: 0 0.6000000238418579px 1.7999999523162842px 0 #0000001a, 0 3.200000047683716px 7.199999809265137px 0 #00000021; /* Primarily used as a hover effect for cards */\n  --surface-shadow-medium: 0 1.2000000476837158px 3.5999999046325684px 0 #0000001a, 0 6.400000095367432px 14.399999618530273px 0 #00000021; /* Primarily used for dropdown menus and tooltips */\n  --surface-shadow-large: 0 4.800000190734863px 14.399999618530273px 0 #0000002e, 0 25.600000381469727px 57.599998474121094px 0 #00000038; /* Primarily used for dialogs */\n  --surface-color-primary-button-default: #013366;\n  --surface-color-primary-button-hover: #1E5189;\n  --surface-color-primary-button-disabled: #EDEBE9;\n  --surface-color-primary-danger-button-default: #CE3E39;\n  --surface-color-primary-danger-button-hover: #A2312D;\n  --surface-color-primary-danger-button-disabled: #EDEBE9;\n  --surface-color-secondary-button-default: #FFFFFF;\n  --surface-color-secondary-button-hover: #EDEBE9;\n  --surface-color-secondary-button-disabled: #EDEBE9;\n  --surface-color-tertiary-button-default: rgba(255,255,255,0);\n  --surface-color-tertiary-button-hover: #ECEAE8;\n  --surface-color-tertiary-button-disabled: #EDEBE9;\n  --surface-color-menus-default: #FFFFFF;\n  --surface-color-menus-hover: #EDEBE9;\n  --surface-color-forms-default: #FFFFFF;\n  --surface-color-forms-disabled: #EDEBE9;\n  --surface-color-background-white: #FFFFFF;\n  --surface-color-background-light-gray: #FAF9F8;\n  --surface-color-background-light-blue: #F1F8FE;\n  --surface-color-background-dark-blue: #053662;\n  --surface-color-border-default: #D8D8D8;\n  --surface-color-border-medium: #898785;\n  --surface-color-border-dark: #353433;\n  --surface-color-border-active: #2E5DD7;\n  --surface-color-overlay-default: rgba(0,0,0,0.45);\n  --support-surface-color-info: #F7F9FC;\n  --support-surface-color-danger: #F4E1E2;\n  --support-surface-color-success: #F6FFF8;\n  --support-surface-color-warning: #FEF1D8;\n  --support-border-color-info: #053662;\n  --support-border-color-danger: #CE3E39;\n  --support-border-color-success: #42814A;\n  --support-border-color-warning: #F8BB47;\n  --icons-size-xsmall: 14px;\n  --icons-size-small: 16px;\n  --icons-size-medium: 20px;\n  --icons-size-large: 24px;\n  --icons-size-xlarge: 32px;\n  --icons-color-primary: #2D2D2D;\n  --icons-color-secondary: #474543;\n  --icons-color-disabled: #9F9D9C;\n  --icons-color-link: #255A90;\n  --icons-color-info: #053662;\n  --icons-color-danger: #CE3E39;\n  --icons-color-success: #42814A;\n  --icons-color-warning: #F8BB47;\n  --icons-color-primary-invert: #FFFFFF;\n  --layout-border-width-none: 0;\n  --layout-border-width-small: 1px;\n  --layout-border-width-medium: 2px;\n  --layout-border-width-large: 4px;\n  --layout-padding-none: 0;\n  --layout-padding-xsmall: 0.25rem;\n  --layout-padding-small: 0.5rem;\n  --layout-padding-medium: 1rem;\n  --layout-padding-large: 1.5rem;\n  --layout-padding-xlarge: 2rem;\n  --layout-margin-none: 0rem;\n  --layout-margin-hair: 0.125rem;\n  --layout-margin-xsmall: 0.25rem;\n  --layout-margin-small: 0.5rem;\n  --layout-margin-medium: 1rem;\n  --layout-margin-large: 1.5rem;\n  --layout-margin-xlarge: 2rem;\n  --layout-margin-xxlarge: 2.5rem;\n  --layout-margin-xxxlarge: 3rem;\n  --layout-margin-huge: 3.5rem;\n  --layout-border-radius-none: 0;\n  --layout-border-radius-small: 2px;\n  --layout-border-radius-medium: 4px;\n  --layout-border-radius-large: 6px;\n  --typography-font-families-bc-sans: 'BC Sans';\n  --typography-line-heights-xxxdense: 1.125rem;\n  --typography-line-heights-xxdense: 1.313rem;\n  --typography-line-heights-xdense: 1.688rem;\n  --typography-line-heights-dense: 1.913rem;\n  --typography-line-heights-regular: 2.125rem;\n  --typography-line-heights-sparse: 2.25rem;\n  --typography-line-heights-xsparse: 3rem;\n  --typography-line-heights-xxsparse: 3.375rem;\n  --typography-line-heights-auto: AUTO;\n  --typography-font-weights-regular: 400;\n  --typography-font-weights-bold: 700;\n  --typography-font-weights-italic: Italic;\n  --typography-font-size-label: 0.75rem;\n  --typography-font-size-small-body: 0.875rem;\n  --typography-font-size-body: 1rem;\n  --typography-font-size-large-body: 1.125rem;\n  --typography-font-size-h5: 1.25rem;\n  --typography-font-size-h4: 1.5rem;\n  --typography-font-size-h3: 1.75rem;\n  --typography-font-size-h2: 2rem;\n  --typography-font-size-h1: 2.25rem;\n  --typography-font-size-display: 3rem;\n  --typography-letter-spacing-0: 0em;\n  --typography-paragraph-spacing-0: 0;\n  --typography-regular-label: 400 0.75rem/1.125rem 'BC Sans';\n  --typography-regular-small-body: 400 0.875rem/1.313rem 'BC Sans';\n  --typography-regular-body: 400 1rem/1.688rem 'BC Sans';\n  --typography-regular-large-body: 400 1.125rem/1.913rem 'BC Sans';\n  --typography-regular-h6: 400 1.125rem/1.913rem 'BC Sans';\n  --typography-regular-h5: 400 1.25rem/2.125rem 'BC Sans';\n  --typography-regular-h4: 400 1.5rem/2.25rem 'BC Sans';\n  --typography-regular-h3: 400 1.75rem/3rem 'BC Sans';\n  --typography-regular-h2: 400 2rem/3.375rem 'BC Sans';\n  --typography-regular-h1: 400 2.25rem/3rem 'BC Sans';\n  --typography-regular-display: 400 3rem/AUTO 'BC Sans';\n  --typography-bold-label: 700 0.75rem/1.125rem 'BC Sans';\n  --typography-bold-small-body: 700 0.875rem/1.313rem 'BC Sans';\n  --typography-bold-body: 700 1rem/1.688rem 'BC Sans';\n  --typography-bold-large-body: 700 1.125rem/1.913rem 'BC Sans';\n  --typography-bold-h6: 700 1.125rem/1.913rem 'BC Sans';\n  --typography-bold-h5: 700 1.25rem/2.125rem 'BC Sans';\n  --typography-bold-h4: 700 1.5rem/2.25rem 'BC Sans';\n  --typography-bold-h3: 700 1.75rem/3rem 'BC Sans';\n  --typography-bold-h2: 700 2rem/3rem 'BC Sans';\n  --typography-bold-h1: 700 2.25rem/3.375rem 'BC Sans';\n  --typography-bold-display: 700 3rem/AUTO 'BC Sans';\n  --typography-italic-label: 400 italic 0.75rem/1.125rem 'BC Sans';\n  --typography-italic-small-body: 400 italic 0.875rem/1.313rem 'BC Sans';\n  --typography-italic-body: 400 italic 1rem/1.688rem 'BC Sans';\n  --typography-italic-large-body: 400 italic 1.125rem/1.913rem 'BC Sans';\n  --typography-italic-h6: 400 italic 1.125rem/1.913rem 'BC Sans';\n  --typography-italic-h5: 400 italic 1.25rem/2.125rem 'BC Sans';\n  --typography-italic-h4: 400 italic 1.5rem/2.25rem 'BC Sans';\n  --typography-italic-h3: 400 italic 1.75rem/3.375rem 'BC Sans';\n  --typography-italic-h2: 400 italic 2rem/3rem 'BC Sans';\n  --typography-italic-h1: 400 italic 2.25rem/3.375rem 'BC Sans';\n  --typography-italic-display: 400 italic 3rem/AUTO 'BC Sans';\n  --typography-text-case-none: none;\n  --typography-text-decoration-none: none;\n  --typography-paragraph-indent-0: 0px;\n  --typography-color-primary: #2D2D2D;\n  --typography-color-secondary: #474543;\n  --typography-color-placeholder: #9F9D9C;\n  --typography-color-disabled: #9F9D9C;\n  --typography-color-link: #255A90;\n  --typography-color-danger: #CE3E39;\n  --typography-color-primary-invert: #FFFFFF;\n  --typography-color-secondary-invert: #ECEAE8;\n  --theme-gold-10: #FEF8E8;\n  --theme-gold-20: #FEF0D8;\n  --theme-gold-30: #FDE9C4;\n  --theme-gold-40: #FCE2B0;\n  --theme-gold-50: #FBDA9D;\n  --theme-gold-60: #FBD389;\n  --theme-gold-70: #FACC75;\n  --theme-gold-80: #F9C462;\n  --theme-gold-90: #F8BA47;\n  --theme-gold-100: #FCBA19;\n  --theme-blue-10: #F1F8FE;\n  --theme-blue-20: #D8EAFD;\n  --theme-blue-30: #C1DDFC;\n  --theme-blue-40: #A8D0FB;\n  --theme-blue-50: #91C4FA;\n  --theme-blue-60: #7AB8F9;\n  --theme-blue-70: #5595D9;\n  --theme-blue-80: #3470B1;\n  --theme-blue-90: #1E5189;\n  --theme-blue-100: #013366;\n  --theme-gray-10: #FAF9F8;\n  --theme-gray-20: #F3F2F1;\n  --theme-gray-30: #ECEAE8;\n  --theme-gray-40: #E0DEDC;\n  --theme-gray-50: #D1CFCD;\n  --theme-gray-60: #C6C5C3;\n  --theme-gray-70: #9F9D9C;\n  --theme-gray-80: #605E5C;\n  --theme-gray-90: #3D3C3B;\n  --theme-gray-100: #353433;\n  --theme-gray-110: #252423;\n  --theme-gray-white: #FFFFFF;\n  --theme-primary-blue: #013366;\n  --theme-primary-gold: #FCBA19;\n}\n";
+var css_248z$b = "/**\n * Do not edit directly\n * Generated on Wed, 01 May 2024 18:02:21 GMT\n */\n\n:root {\n  --surface-opacity-0: 0;\n  --surface-opacity-10: 0.1;\n  --surface-opacity-20: 0.2;\n  --surface-opacity-30: 0.3;\n  --surface-opacity-40: 0.4;\n  --surface-opacity-50: 0.5;\n  --surface-opacity-60: 0.6;\n  --surface-opacity-70: 0.7;\n  --surface-opacity-80: 0.8;\n  --surface-opacity-90: 0.9;\n  --surface-opacity-100: 1;\n  --surface-shadow-none: 0 0.30000001192092896px 0.8999999761581421px 0 #0000001a, 0 1.600000023841858px 3.5999999046325684px 0 #00000021;\n  --surface-shadow-small: 0 0.6000000238418579px 1.7999999523162842px 0 #0000001a, 0 3.200000047683716px 7.199999809265137px 0 #00000021; /* Primarily used as a hover effect for cards */\n  --surface-shadow-medium: 0 1.2000000476837158px 3.5999999046325684px 0 #0000001a, 0 6.400000095367432px 14.399999618530273px 0 #00000021; /* Primarily used for dropdown menus and tooltips */\n  --surface-shadow-large: 0 4.800000190734863px 14.399999618530273px 0 #0000002e, 0 25.600000381469727px 57.599998474121094px 0 #00000038; /* Primarily used for dialogs */\n  --surface-color-primary-button-default: #013366;\n  --surface-color-primary-button-hover: #1E5189;\n  --surface-color-primary-button-disabled: #EDEBE9;\n  --surface-color-primary-danger-button-default: #CE3E39;\n  --surface-color-primary-danger-button-hover: #A2312D;\n  --surface-color-primary-danger-button-disabled: #EDEBE9;\n  --surface-color-secondary-button-default: #FFFFFF;\n  --surface-color-secondary-button-hover: #EDEBE9;\n  --surface-color-secondary-button-disabled: #EDEBE9;\n  --surface-color-tertiary-button-default: rgba(255,255,255,0);\n  --surface-color-tertiary-button-hover: #ECEAE8;\n  --surface-color-tertiary-button-disabled: #EDEBE9;\n  --surface-color-menus-default: #FFFFFF;\n  --surface-color-menus-hover: #EDEBE9;\n  --surface-color-forms-default: #FFFFFF;\n  --surface-color-forms-disabled: #EDEBE9;\n  --surface-color-background-white: #FFFFFF;\n  --surface-color-background-light-gray: #FAF9F8;\n  --surface-color-background-light-blue: #F1F8FE;\n  --surface-color-background-dark-blue: #053662;\n  --surface-color-border-default: #D8D8D8;\n  --surface-color-border-medium: #898785;\n  --surface-color-border-dark: #353433;\n  --surface-color-border-active: #2E5DD7;\n  --surface-color-overlay-default: rgba(0,0,0,0.45);\n  --support-surface-color-info: #F7F9FC;\n  --support-surface-color-danger: #F4E1E2;\n  --support-surface-color-success: #F6FFF8;\n  --support-surface-color-warning: #FEF1D8;\n  --support-border-color-info: #053662;\n  --support-border-color-danger: #CE3E39;\n  --support-border-color-success: #42814A;\n  --support-border-color-warning: #F8BB47;\n  --icons-size-xsmall: 14px;\n  --icons-size-small: 16px;\n  --icons-size-medium: 20px;\n  --icons-size-large: 24px;\n  --icons-size-xlarge: 32px;\n  --icons-color-primary: #2D2D2D;\n  --icons-color-secondary: #474543;\n  --icons-color-disabled: #9F9D9C;\n  --icons-color-link: #255A90;\n  --icons-color-info: #053662;\n  --icons-color-danger: #CE3E39;\n  --icons-color-success: #42814A;\n  --icons-color-warning: #F8BB47;\n  --icons-color-primary-invert: #FFFFFF;\n  --layout-border-width-none: 0;\n  --layout-border-width-small: 1px;\n  --layout-border-width-medium: 2px;\n  --layout-border-width-large: 4px;\n  --layout-padding-none: 0;\n  --layout-padding-xsmall: 0.25rem;\n  --layout-padding-small: 0.5rem;\n  --layout-padding-medium: 1rem;\n  --layout-padding-large: 1.5rem;\n  --layout-padding-xlarge: 2rem;\n  --layout-margin-none: 0rem;\n  --layout-margin-hair: 0.125rem;\n  --layout-margin-xsmall: 0.25rem;\n  --layout-margin-small: 0.5rem;\n  --layout-margin-medium: 1rem;\n  --layout-margin-large: 1.5rem;\n  --layout-margin-xlarge: 2rem;\n  --layout-margin-xxlarge: 2.5rem;\n  --layout-margin-xxxlarge: 3rem;\n  --layout-margin-huge: 3.5rem;\n  --layout-border-radius-none: 0;\n  --layout-border-radius-small: 2px;\n  --layout-border-radius-medium: 4px;\n  --layout-border-radius-large: 6px;\n  --typography-font-families-bc-sans: 'BC Sans';\n  --typography-line-heights-xxxdense: 1.125rem;\n  --typography-line-heights-xxdense: 1.313rem;\n  --typography-line-heights-xdense: 1.688rem;\n  --typography-line-heights-dense: 1.913rem;\n  --typography-line-heights-regular: 2.125rem;\n  --typography-line-heights-sparse: 2.25rem;\n  --typography-line-heights-xsparse: 3rem;\n  --typography-line-heights-xxsparse: 3.375rem;\n  --typography-line-heights-auto: AUTO;\n  --typography-font-weights-regular: 400;\n  --typography-font-weights-bold: 700;\n  --typography-font-weights-italic: Italic;\n  --typography-font-size-label: 0.75rem;\n  --typography-font-size-small-body: 0.875rem;\n  --typography-font-size-body: 1rem;\n  --typography-font-size-large-body: 1.125rem;\n  --typography-font-size-h5: 1.25rem;\n  --typography-font-size-h4: 1.5rem;\n  --typography-font-size-h3: 1.75rem;\n  --typography-font-size-h2: 2rem;\n  --typography-font-size-h1: 2.25rem;\n  --typography-font-size-display: 3rem;\n  --typography-letter-spacing-0: 0em;\n  --typography-paragraph-spacing-0: 0;\n  --typography-regular-label: 400 0.75rem/1.125rem 'BC Sans';\n  --typography-regular-small-body: 400 0.875rem/1.313rem 'BC Sans';\n  --typography-regular-body: 400 1rem/1.688rem 'BC Sans';\n  --typography-regular-large-body: 400 1.125rem/1.913rem 'BC Sans';\n  --typography-regular-h6: 400 1.125rem/1.913rem 'BC Sans';\n  --typography-regular-h5: 400 1.25rem/2.125rem 'BC Sans';\n  --typography-regular-h4: 400 1.5rem/2.25rem 'BC Sans';\n  --typography-regular-h3: 400 1.75rem/3rem 'BC Sans';\n  --typography-regular-h2: 400 2rem/3.375rem 'BC Sans';\n  --typography-regular-h1: 400 2.25rem/3rem 'BC Sans';\n  --typography-regular-display: 400 3rem/AUTO 'BC Sans';\n  --typography-bold-label: 700 0.75rem/1.125rem 'BC Sans';\n  --typography-bold-small-body: 700 0.875rem/1.313rem 'BC Sans';\n  --typography-bold-body: 700 1rem/1.688rem 'BC Sans';\n  --typography-bold-large-body: 700 1.125rem/1.913rem 'BC Sans';\n  --typography-bold-h6: 700 1.125rem/1.913rem 'BC Sans';\n  --typography-bold-h5: 700 1.25rem/2.125rem 'BC Sans';\n  --typography-bold-h4: 700 1.5rem/2.25rem 'BC Sans';\n  --typography-bold-h3: 700 1.75rem/3rem 'BC Sans';\n  --typography-bold-h2: 700 2rem/3rem 'BC Sans';\n  --typography-bold-h1: 700 2.25rem/3.375rem 'BC Sans';\n  --typography-bold-display: 700 3rem/AUTO 'BC Sans';\n  --typography-italic-label: 400 italic 0.75rem/1.125rem 'BC Sans';\n  --typography-italic-small-body: 400 italic 0.875rem/1.313rem 'BC Sans';\n  --typography-italic-body: 400 italic 1rem/1.688rem 'BC Sans';\n  --typography-italic-large-body: 400 italic 1.125rem/1.913rem 'BC Sans';\n  --typography-italic-h6: 400 italic 1.125rem/1.913rem 'BC Sans';\n  --typography-italic-h5: 400 italic 1.25rem/2.125rem 'BC Sans';\n  --typography-italic-h4: 400 italic 1.5rem/2.25rem 'BC Sans';\n  --typography-italic-h3: 400 italic 1.75rem/3.375rem 'BC Sans';\n  --typography-italic-h2: 400 italic 2rem/3rem 'BC Sans';\n  --typography-italic-h1: 400 italic 2.25rem/3.375rem 'BC Sans';\n  --typography-italic-display: 400 italic 3rem/AUTO 'BC Sans';\n  --typography-text-case-none: none;\n  --typography-text-decoration-none: none;\n  --typography-paragraph-indent-0: 0px;\n  --typography-color-primary: #2D2D2D;\n  --typography-color-secondary: #474543;\n  --typography-color-placeholder: #9F9D9C;\n  --typography-color-disabled: #9F9D9C;\n  --typography-color-link: #255A90;\n  --typography-color-danger: #CE3E39;\n  --typography-color-primary-invert: #FFFFFF;\n  --typography-color-secondary-invert: #ECEAE8;\n  --theme-gold-10: #FEF8E8;\n  --theme-gold-20: #FEF0D8;\n  --theme-gold-30: #FDE9C4;\n  --theme-gold-40: #FCE2B0;\n  --theme-gold-50: #FBDA9D;\n  --theme-gold-60: #FBD389;\n  --theme-gold-70: #FACC75;\n  --theme-gold-80: #F9C462;\n  --theme-gold-90: #F8BA47;\n  --theme-gold-100: #FCBA19;\n  --theme-blue-10: #F1F8FE;\n  --theme-blue-20: #D8EAFD;\n  --theme-blue-30: #C1DDFC;\n  --theme-blue-40: #A8D0FB;\n  --theme-blue-50: #91C4FA;\n  --theme-blue-60: #7AB8F9;\n  --theme-blue-70: #5595D9;\n  --theme-blue-80: #3470B1;\n  --theme-blue-90: #1E5189;\n  --theme-blue-100: #013366;\n  --theme-gray-10: #FAF9F8;\n  --theme-gray-20: #F3F2F1;\n  --theme-gray-30: #ECEAE8;\n  --theme-gray-40: #E0DEDC;\n  --theme-gray-50: #D1CFCD;\n  --theme-gray-60: #C6C5C3;\n  --theme-gray-70: #9F9D9C;\n  --theme-gray-80: #605E5C;\n  --theme-gray-90: #3D3C3B;\n  --theme-gray-100: #353433;\n  --theme-gray-110: #252423;\n  --theme-gray-white: #FFFFFF;\n  --theme-primary-blue: #013366;\n  --theme-primary-gold: #FCBA19;\n}\n";
+styleInject(css_248z$b);
+
+var css_248z$a = ".bcds-Inline-Alert {\n  display: flex;\n  flex-direction: row;\n  align-items: flex-start;\n  gap: var(--layout-margin-small);\n  padding: var(--layout-padding-medium) var(--layout-padding-large);\n}\n\n/* Alert content */\n.bcds-Inline-Alert--container {\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n}\n\n.bcds-Inline-Alert--container > .title {\n  font: var(--typography-bold-body);\n  color: var(--typography-color-primary);\n}\n\n.bcds-Inline-Alert--container > .description {\n  font: var(--typography-regular-body);\n  color: var(--typography-color-primary);\n}\n\n/* Left icon */\n.bcds-Inline-Alert--icon {\n  display: inline-flex;\n  align-self: flex-start;\n  padding-top: var(--layout-padding-xsmall);\n}\n\n.bcds-Inline-Alert--icon > svg {\n  min-width: var(--icons-size-medium);\n  height: var(--icons-size-medium);\n}\n\n/* Close icon button */\n.bcds-Inline-Alert--closeIcon {\n  display: inline-flex;\n  align-self: first baseline;\n  color: var(--icons-color-primary);\n}\n\n.bcds-Inline-Alert--closeIcon > svg {\n  min-width: var(--icons-size-medium);\n  height: var(--icons-size-medium);\n}\n\n/* Info variant */\n.bcds-Inline-Alert.info {\n  background-color: var(--support-surface-color-info);\n  border: var(--layout-border-width-small) solid\n    var(--support-border-color-info);\n  border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.info > .bcds-Inline-Alert--icon {\n  color: var(--icons-color-info);\n}\n\n/* Success variant */\n.bcds-Inline-Alert.success {\n  background-color: var(--suport-surface-color-success);\n  border: var(--layout-border-width-small) solid\n    var(--support-border-color-success);\n  border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.success > .bcds-Inline-Alert--icon {\n  color: var(--icons-color-success);\n}\n\n/* Warning variant */\n.bcds-Inline-Alert.warning {\n  background-color: var(--support-surface-color-warning);\n  border: var(--layout-border-width-small) solid\n    var(--support-border-color-warning);\n  border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.warning > .bcds-Inline-Alert--icon {\n  color: var(--icons-color-warning);\n}\n\n/* Danger variant */\n.bcds-Inline-Alert.danger {\n  background-color: var(--support-surface-color-danger);\n  border: var(--layout-border-width-small) solid\n    var(--support-border-color-danger);\n  border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.danger > .bcds-Inline-Alert--icon {\n  color: var(--icons-color-danger);\n}\n";
 styleInject(css_248z$a);
 
+function getIcon(variant) {
+    switch (variant) {
+        case "info":
+            return jsx(SvgInfoIcon, {});
+        case "success":
+            return jsx(SvgCheckCircleIcon, {});
+        case "warning":
+            return jsx(SvgExclamationIcon, {});
+        case "danger":
+            return jsx(SvgExclamationCircleIcon, {});
+        default:
+            return;
+    }
+}
+function InlineAlert({ variant = "info", title, description, isIconHidden = false, isCloseable = false, role = "note", children, onClose, ...props }) {
+    return (jsxs("div", { className: `bcds-Inline-Alert ${variant}`, ...props, children: [!isIconHidden && (jsx("span", { className: "bcds-Inline-Alert--icon", children: getIcon(variant) })), jsx("div", { className: "bcds-Inline-Alert--container", role: role, "aria-labelledby": "alert-title", children: children ? (children) : (jsxs(Fragment, { children: [title && (jsx("span", { className: "title", id: "alert-title", children: title })), description && jsx("span", { className: "description", children: description })] })) }), isCloseable && (jsx("span", { className: "bcds-Inline-Alert--closeIcon", children: jsx(Button, { variant: "tertiary", isIconButton: true, size: "small", "aria-label": "Close this alert", type: "button", onPress: onClose, children: jsx(SvgCloseIcon, {}) }) }))] }));
+}
+
 /*
  * Copyright 2024 Adobe. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
@@ -13784,7 +13805,7 @@ function Form({ ...props }) {
     return jsx($d3e0e05bdfcf66bd$export$a7fed597f4b8afd8, { ...props });
 }
 
-var css_248z$6 = ".bcds-react-aria-Select {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\n  max-width: -moz-available;\n  max-width: -webkit-fill-available;\n}\n\n/* Label above select input */\n.bcds-react-aria-Select--Label {\n  color: var(--typography-color-secondary);\n  font: var(--typography-regular-small-body);\n  padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n.bcds-react-aria-Select[data-disabled] > .bcds-react-aria-Select--Label {\n  color: var(--typography-color-disabled);\n}\n\n/* Error message */\n.bcds-react-aria-Select--Error {\n  font: var(--typography-regular-small-body);\n  color: var(--typography-color-danger);\n}\n\n/* Select input equivalent */\n.bcds-react-aria-Select--Button {\n  background-color: var(--surface-color-forms-default);\n  border: 1px solid var(--surface-color-border-default);\n  border-radius: var(--layout-border-radius-medium);\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  gap: var(--layout-margin-small);\n  align-items: center;\n  padding: 0 12px;\n  max-width: 100%;\n}\n.bcds-react-aria-Select--Button.invalid {\n  border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Select[data-invalid] > .bcds-react-aria-Select--Button {\n  border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Select--Button[data-disabled] {\n  background-color: var(--surface-color-forms-disabled);\n  cursor: not-allowed;\n}\n.bcds-react-aria-Select--Button[data-hovered] {\n  border-color: var(--surface-color-border-dark);\n}\n.bcds-react-aria-Select--Button[data-focused] {\n  border-color: var(--surface-color-border-active);\n  outline: solid var(--layout-border-width-medium)\n    var(--surface-color-border-active);\n  outline-offset: var(--layout-margin-hair);\n}\n.bcds-react-aria-Select--Button[data-pressed] {\n  border-color: var(--surface-color-border-active);\n}\n.bcds-react-aria-Select--Button.medium {\n  height: 40px;\n}\n.bcds-react-aria-Select--Button.small {\n  height: 32px;\n}\n.bcds-react-aria-Select--Button > .bcds-react-aria-SelectValue {\n  font: var(--typography-regular-body);\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  min-width: 0;\n}\n.bcds-react-aria-Select--Button > svg {\n  flex-shrink: 0;\n}\n\n/* Dropdown menu panel */\n.bcds-react-aria-Select--Popover {\n  background-color: var(--surface-color-forms-default);\n  border: 1px solid var(--surface-color-border-default);\n  border-radius: var(--layout-border-radius-medium);\n  box-shadow: var(--surface-shadow-medium);\n  box-sizing: border-box;\n  overflow-y: auto;\n  padding: var(--layout-margin-hair) var(--layout-padding-xsmall);\n  width: var(\n    --trigger-width\n  ); /* Variable provided by Select component https://react-spectrum.adobe.com/react-aria/Select.html#popover-1 */\n}\n.bcds-react-aria-Select--ListBox[data-focused] {\n  outline: none;\n}\n.bcds-react-aria-Select--ListBox > .bcds-react-aria-Section:not(:first-child) {\n  border-top: 1px solid var(--surface-color-border-default);\n  margin-top: 1px;\n  padding-top: 2px;\n}\n\n/* Header label within Section of multi-section Select */\n.bcds-react-aria-Select--Header {\n  color: var(--typography-color-secondary);\n  font: var(--typography-regular-small-body);\n  padding: var(--layout-margin-hair) var(--layout-padding-small);\n}\n\n/* ListBox option item */\n.bcds-react-aria-Select--ListBoxItem {\n  border-radius: var(--layout-margin-xsmall);\n  cursor: pointer;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--layout-margin-small);\n  padding: 6.5px var(--layout-padding-small);\n}\n.bcds-react-aria-Select--ListBoxItem[data-focused],\n.bcds-react-aria-Select--ListBoxItem[data-hovered] {\n  background-color: var(--surface-color-secondary-button-hover);\n  outline: none;\n}\n.bcds-react-aria-Select--ListBoxItem-icon {\n  display: flex;\n  align-items: center;\n  justify-content: space-around;\n  /* This `min-width` rule can cause horizontal overflow on very narrow Select\n  instances, but if we leave it out, the icons will shrink instead. */\n  min-width: 20px;\n}\n.bcds-react-aria-Select--ListBoxItem-Text-container {\n  color: var(--typography-color-primary);\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n}\n.bcds-react-aria-Select--ListBoxItem-Text-label {\n  font: var(--typography-regular-body);\n}\n.bcds-react-aria-Select--ListBoxItem.destructive {\n  color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Select--ListBoxItem.destructive\n  .bcds-react-aria-Select--ListBoxItem-Text-label {\n  color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Select--ListBoxItem-Text-description {\n  font: var(--typography-regular-small-body);\n  color: var(--typography-color-secondary);\n}\n";
+var css_248z$6 = ".bcds-react-aria-Select {\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\n  max-width: -moz-available;\n  max-width: -webkit-fill-available;\n}\n\n/* Label above select input */\n.bcds-react-aria-Select--Label {\n  color: var(--typography-color-secondary);\n  font: var(--typography-regular-small-body);\n  padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n.bcds-react-aria-Select[data-disabled] > .bcds-react-aria-Select--Label {\n  color: var(--typography-color-disabled);\n}\n\n/* Text description below select input */\n.bcds-react-aria-Select--Description {\n  font: var(--typography-regular-small-body);\n  color: var(--typography-color-secondary);\n  padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n/* Error message */\n.bcds-react-aria-Select--Error {\n  font: var(--typography-regular-small-body);\n  color: var(--typography-color-danger);\n}\n\n/* Select input equivalent */\n.bcds-react-aria-Select--Button {\n  background-color: var(--surface-color-forms-default);\n  border: 1px solid var(--surface-color-border-default);\n  border-radius: var(--layout-border-radius-medium);\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  gap: var(--layout-margin-small);\n  align-items: center;\n  padding: 0 12px;\n  max-width: 100%;\n}\n.bcds-react-aria-Select--Button.invalid {\n  border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Select[data-invalid] > .bcds-react-aria-Select--Button {\n  border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Select--Button[data-disabled] {\n  background-color: var(--surface-color-forms-disabled);\n  cursor: not-allowed;\n}\n.bcds-react-aria-Select--Button[data-hovered] {\n  border-color: var(--surface-color-border-dark);\n}\n.bcds-react-aria-Select--Button[data-focused] {\n  border-color: var(--surface-color-border-active);\n  outline: solid var(--layout-border-width-medium)\n    var(--surface-color-border-active);\n  outline-offset: var(--layout-margin-hair);\n}\n.bcds-react-aria-Select--Button[data-pressed] {\n  border-color: var(--surface-color-border-active);\n}\n.bcds-react-aria-Select--Button.medium {\n  height: 40px;\n}\n.bcds-react-aria-Select--Button.small {\n  height: 32px;\n}\n.bcds-react-aria-Select--Button > .bcds-react-aria-SelectValue {\n  font: var(--typography-regular-body);\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  min-width: 0;\n}\n.bcds-react-aria-Select--Button > svg {\n  flex-shrink: 0;\n}\n\n/* Dropdown menu panel */\n.bcds-react-aria-Select--Popover {\n  background-color: var(--surface-color-forms-default);\n  border: 1px solid var(--surface-color-border-default);\n  border-radius: var(--layout-border-radius-medium);\n  box-shadow: var(--surface-shadow-medium);\n  box-sizing: border-box;\n  overflow-y: auto;\n  padding: var(--layout-margin-hair) var(--layout-padding-xsmall);\n  width: var(\n    --trigger-width\n  ); /* Variable provided by Select component https://react-spectrum.adobe.com/react-aria/Select.html#popover-1 */\n}\n.bcds-react-aria-Select--ListBox[data-focused] {\n  outline: none;\n}\n.bcds-react-aria-Select--ListBox > .bcds-react-aria-Section:not(:first-child) {\n  border-top: 1px solid var(--surface-color-border-default);\n  margin-top: 1px;\n  padding-top: 2px;\n}\n\n/* Header label within Section of multi-section Select */\n.bcds-react-aria-Select--Header {\n  color: var(--typography-color-secondary);\n  font: var(--typography-regular-small-body);\n  padding: var(--layout-margin-hair) var(--layout-padding-small);\n}\n\n/* ListBox option item */\n.bcds-react-aria-Select--ListBoxItem {\n  border-radius: var(--layout-margin-xsmall);\n  cursor: pointer;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--layout-margin-small);\n  padding: 6.5px var(--layout-padding-small);\n}\n.bcds-react-aria-Select--ListBoxItem[data-focused],\n.bcds-react-aria-Select--ListBoxItem[data-hovered] {\n  background-color: var(--surface-color-secondary-button-hover);\n  outline: none;\n}\n.bcds-react-aria-Select--ListBoxItem-icon {\n  display: flex;\n  align-items: center;\n  justify-content: space-around;\n  /* This `min-width` rule can cause horizontal overflow on very narrow Select\n  instances, but if we leave it out, the icons will shrink instead. */\n  min-width: 20px;\n}\n.bcds-react-aria-Select--ListBoxItem-Text-container {\n  color: var(--typography-color-primary);\n  display: flex;\n  flex-direction: column;\n  flex-grow: 1;\n}\n.bcds-react-aria-Select--ListBoxItem-Text-label {\n  font: var(--typography-regular-body);\n}\n.bcds-react-aria-Select--ListBoxItem.destructive {\n  color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Select--ListBoxItem.destructive\n  .bcds-react-aria-Select--ListBoxItem-Text-label {\n  color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Select--ListBoxItem-Text-description {\n  font: var(--typography-regular-small-body);\n  color: var(--typography-color-secondary);\n}\n";
 styleInject(css_248z$6);
 
 function ChevronDown() {
@@ -13796,14 +13817,14 @@ function ChevronUp() {
 /* Icon displayed when input is in invalid state */
 const iconError$1 = (jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { id: "20px/Error icon", children: jsx("path", { id: "Icon", d: "M17.835 15.0312C18.335 15.9062 17.71 17 16.6787 17H3.33499C2.30374 17 1.67874 15.9062 2.14749 15.0312L8.83499 3.65625C9.11624 3.21875 9.55373 3 10.0225 3C10.46 3 10.8975 3.21875 11.1787 3.65625L17.835 15.0312ZM3.64749 15.5H16.3663L9.99123 4.65625L3.64749 15.5ZM10.0225 12.5625C10.5537 12.5625 10.9912 13 10.9912 13.5312C10.9912 14.0625 10.5537 14.5 10.0225 14.5C9.45998 14.5 9.02249 14.0625 9.02249 13.5312C9.02249 13 9.45998 12.5625 10.0225 12.5625ZM9.27249 7.75C9.27249 7.34375 9.58498 7 10.0225 7C10.4287 7 10.7725 7.34375 10.7725 7.75V10.75C10.7725 11.1875 10.4287 11.5 10.0225 11.5C9.58498 11.5 9.27249 11.1875 9.27249 10.75V7.75Z", fill: "var(--icons-color-danger)" }) }) }));
 /** Select displays a collapsible list of options and allows a user to select one of them. */
-function Select({ items, sections, label, placeholder, size = "medium", errorMessage, ...props }) {
+function Select({ items, sections, label, description, placeholder, size = "medium", errorMessage, ...props }) {
     return (jsx($82d7e5349645de74$export$ef9b1a59e592288f, { ...props, className: "bcds-react-aria-Select", children: ({ isOpen, isRequired, isInvalid }) => (jsxs(Fragment, { children: [label && (jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-Select--Label", children: isRequired ? `${label} (required)` : label })), jsxs($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { className: `bcds-react-aria-Select--Button ${size === "medium" ? "medium" : "small"} ${isInvalid && "invalid"}`, children: [jsx($82d7e5349645de74$export$e288731fd71264f0, { className: "bcds-react-aria-SelectValue", children: (value) => {
                                 if (value.selectedText)
                                     return value.selectedText;
                                 if (placeholder)
                                     return placeholder;
                                 return "Select an item";
-                            } }), isInvalid && iconError$1, isOpen ? jsx(ChevronUp, {}) : jsx(ChevronDown, {})] }), jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { className: "bcds-react-aria-Select--Error", children: errorMessage }), jsx($07b14b47974efb58$export$5b6b19405a83ff9d, { className: "bcds-react-aria-Select--Popover", offset: 4, children: jsx($eed445e0843c11d0$export$41f133550aa26f48, { className: "bcds-react-aria-Select--ListBox", 
+                            } }), isInvalid && iconError$1, isOpen ? jsx(ChevronUp, {}) : jsx(ChevronDown, {})] }), description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: `bcds-react-aria-Select--Description`, children: description })), jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { className: "bcds-react-aria-Select--Error", children: errorMessage }), jsx($07b14b47974efb58$export$5b6b19405a83ff9d, { className: "bcds-react-aria-Select--Popover", offset: 4, children: jsx($eed445e0843c11d0$export$41f133550aa26f48, { className: "bcds-react-aria-Select--ListBox", 
                         // This ternary statement is used to mock the data for `sections`
                         // if a flat list of `items` was passed instead. This allows us to
                         // use one component to support both flat and sectioned lists of
@@ -13815,6 +13836,27 @@ function Select({ items, sections, label, placeholder, size = "medium", errorMes
                             : [{ id: "section", header: "", items: items ? items : [] }], children: (section) => (jsxs($7135fc7d473fd974$export$6e2c8f0811a474ce, { id: section.id, className: "bcds-react-aria-Section", children: [section?.header && (jsx($72a5793c14baf454$export$8b251419efc915eb, { className: "bcds-react-aria-Select--Header", children: section.header })), jsx($e1995378a142960e$export$fb8073518f34e6ec, { items: section.items, children: (item) => (jsxs($eed445e0843c11d0$export$a11e76429ed99b4, { id: item?.id ? item.id : item.label, className: `bcds-react-aria-Select--ListBoxItem ${item?.isDestructive ? "destructive" : ""}`, textValue: item.label, children: [item?.iconLeft && (jsx("div", { className: "bcds-react-aria-Select--ListBoxItem-icon", children: item.iconLeft })), jsxs("div", { className: "bcds-react-aria-Select--ListBoxItem-Text-container", children: [jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "label", className: "bcds-react-aria-Select--ListBoxItem-Text-label", children: item.label }), item.description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-Select--ListBoxItem-Text-description", children: item.description }))] }), item?.iconRight && (jsx("div", { className: "bcds-react-aria-Select--ListBoxItem-icon", children: item.iconRight }))] })) })] })) }) })] })) }));
 }
 
+function SvgCheckCircleIcon({ id = "check-icon" }) {
+    return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M12.4688 7.46875C12.75 7.1875 13.2188 7.1875 13.5 7.5C13.8125 7.78125 13.8125 8.25 13.5 8.53125L9.5 12.5312C9.375 12.6875 9.1875 12.75 9 12.75C8.78125 12.75 8.59375 12.6875 8.4375 12.5312L6.4375 10.5312C6.125 10.25 6.125 9.78125 6.4375 9.46875C6.71875 9.1875 7.1875 9.1875 7.5 9.46875L9 10.9688L12.4688 7.46875ZM10 2C14.4062 2 18 5.59375 18 10C18 14.4375 14.4062 18 10 18C5.5625 18 2 14.4375 2 10C2 5.59375 5.5625 2 10 2ZM10 16.5C13.5625 16.5 16.5 13.5938 16.5 10C16.5 6.4375 13.5625 3.5 10 3.5C6.40625 3.5 3.5 6.4375 3.5 10C3.5 13.5938 6.40625 16.5 10 16.5Z", fill: "currentColor" }) }) }));
+}
+
+// This icon is available as a plain SVG at src/assets/icon-exclamation.svg
+function SvgExclamationIcon({ id = "exclamation-icon" }) {
+    return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M17.835 15.0312C18.335 15.9062 17.71 17 16.6787 17H3.33499C2.30374 17 1.67874 15.9062 2.14749 15.0312L8.83499 3.65625C9.11624 3.21875 9.55373 3 10.0225 3C10.46 3 10.8975 3.21875 11.1787 3.65625L17.835 15.0312ZM3.64749 15.5H16.3663L9.99123 4.65625L3.64749 15.5ZM10.0225 12.5625C10.5537 12.5625 10.9912 13 10.9912 13.5312C10.9912 14.0625 10.5537 14.5 10.0225 14.5C9.45998 14.5 9.02249 14.0625 9.02249 13.5312C9.02249 13 9.45998 12.5625 10.0225 12.5625ZM9.27249 7.75C9.27249 7.34375 9.58498 7 10.0225 7C10.4287 7 10.7725 7.34375 10.7725 7.75V10.75C10.7725 11.1875 10.4287 11.5 10.0225 11.5C9.58498 11.5 9.27249 11.1875 9.27249 10.75V7.75Z", fill: "currentColor" }) }) }));
+}
+
+function SvgExclamationCircleIcon({ id = "exclamation-icon-circle", }) {
+    return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M9.99999 2C14.4062 2 18 5.59375 18 10C18 14.4375 14.4062 18 9.99999 18C5.56249 18 1.99998 14.4375 1.99998 10C1.99998 5.59375 5.56249 2 9.99999 2ZM9.99999 16.5C13.5625 16.5 16.5 13.5938 16.5 10C16.5 6.4375 13.5625 3.5 9.99999 3.5C6.40624 3.5 3.49999 6.4375 3.49999 10C3.49999 13.5938 6.40624 16.5 9.99999 16.5ZM9.99999 11.5C9.56249 11.5 9.24999 11.1875 9.24999 10.75V6.75C9.24999 6.34375 9.56249 6 9.99999 6C10.4062 6 10.75 6.34375 10.75 6.75V10.75C10.75 11.1875 10.4062 11.5 9.99999 11.5ZM9.99999 12.5625C10.5312 12.5625 10.9687 13 10.9687 13.5312C10.9687 14.0625 10.5312 14.5 9.99999 14.5C9.43749 14.5 8.99999 14.0625 8.99999 13.5312C8.99999 13 9.43749 12.5625 9.99999 12.5625Z", fill: "currentColor" }) }) }));
+}
+
+function SvgCloseIcon({ id = "close-icon" }) {
+    return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M16 5.21286L14.7871 4L10 8.78714L5.21286 4L4 5.21286L8.78714 10L4 14.7871L5.21286 16L10 11.2129L14.7871 16L16 14.7871L11.2129 10L16 5.21286Z", fill: "currentColor" }) }) }));
+}
+
+function SvgInfoIcon({ id = "information-icon" }) {
+    return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M9.99999 2C14.4062 2 18 5.59375 18 10C18 14.4375 14.4062 18 9.99999 18C5.56249 18 1.99998 14.4375 1.99998 10C1.99998 5.59375 5.56249 2 9.99999 2ZM9.99999 16.5C13.5625 16.5 16.5 13.5938 16.5 10C16.5 6.4375 13.5625 3.5 9.99999 3.5C6.40624 3.5 3.49999 6.4375 3.49999 10C3.49999 13.5938 6.40624 16.5 9.99999 16.5ZM11.25 12.5C11.6562 12.5 12 12.8438 12 13.25C12 13.6875 11.6562 14 11.25 14H8.74999C8.31249 14 7.99999 13.6875 7.99999 13.25C7.99999 12.8438 8.31249 12.5 8.74999 12.5H9.24999V10.5H8.99999C8.56249 10.5 8.24999 10.1875 8.24999 9.75C8.24999 9.34375 8.56249 9 8.99999 9H9.99999C10.4062 9 10.75 9.34375 10.75 9.75V12.5H11.25ZM9.99999 8C9.43749 8 8.99999 7.5625 8.99999 7C8.99999 6.46875 9.43749 6 9.99999 6C10.5312 6 11 6.46875 11 7C11 7.5625 10.5312 8 9.99999 8Z", fill: "currentColor" }) }) }));
+}
+
 var css_248z$5 = ".bcds-react-aria-Tag {\n  color: var(--typography-color-primary);\n  cursor: pointer;\n  border-radius: var(--layout-margin-hair);\n  border: 1px solid;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font: var(--typography-regular-label);\n  padding: 2px 8px;\n  width: fit-content;\n}\n.bcds-react-aria-Tag .react-aria-Button {\n  background: none;\n  border: none;\n  color: var(--typography-color-primary);\n  cursor: pointer;\n  display: flex;\n  margin: 0;\n  padding: 0;\n}\n\n/* Tag colors */\n.bcds-react-aria-Tag.bc-blue {\n  background-color: var(--theme-primary-blue);\n  border-color: var(--theme-blue-90);\n  color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.bc-blue .react-aria-Button {\n  color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.bc-gold {\n  background-color: var(--theme-primary-gold);\n  border-color: var(--theme-blue-90);\n}\n.bcds-react-aria-Tag.blue {\n  background-color: var(--support-surface-color-info);\n  border-color: var(--support-border-color-info);\n}\n.bcds-react-aria-Tag.dark {\n  background: var(--theme-gray-110);\n  border-color: var(--theme-blue-90);\n  color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.dark .react-aria-Button {\n  color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.gray,\n.bcds-react-aria-Tag.grey {\n  background-color: var(--theme-gray-20);\n  border-color: var(--surface-color-border-dark);\n}\n.bcds-react-aria-Tag.green {\n  background-color: var(--support-surface-color-success);\n  border-color: var(--support-border-color-success);\n}\n.bcds-react-aria-Tag.red {\n  background-color: var(--support-surface-color-danger);\n  border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Tag.yellow {\n  background-color: var(--support-surface-color-warning);\n  border-color: var(--support-border-color-warning);\n}\n\n/* Selected */\n.bcds-react-aria-Tag[data-selected] {\n  border-radius: var(--layout-border-radius-small);\n  border: var(--layout-border-width-medium) solid\n    var(--surface-color-border-active);\n}\n\n/* Focused */\n.bcds-react-aria-Tag[data-focused] {\n  outline: var(--layout-border-width-medium) solid\n    var(--surface-color-border-active);\n  outline-offset: var(--layout-margin-hair);\n}\n\n/* Disabled */\n.bcds-react-aria-Tag[data-disabled] {\n  background-color: var(--surface-color-primary-button-disabled);\n  border-color: var(--surface-color-border-default);\n  color: var(--typography-color-disabled);\n  cursor: not-allowed;\n}\n";
 styleInject(css_248z$5);
 
@@ -13822,11 +13864,11 @@ function Tag({ color = "blue", icon, id, textValue }) {
     return (jsx($eaf9e70818b436db$export$3288d34c523a1192, { className: `bcds-react-aria-Tag ${color}`, id: id, textValue: textValue, children: ({ allowsRemoving, isDisabled }) => (jsxs(Fragment, { children: [icon, textValue, !isDisabled && allowsRemoving && (jsx($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { "aria-label": `Remove ${textValue}`, slot: "remove", children: jsx("svg", { width: "14", height: "15", viewBox: "0 0 14 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { id: "Icons / Close", children: jsx("path", { id: "Vector", d: "M12.6004 3.03239L11.4684 1.90039L7.00039 6.36839L2.53239 1.90039L1.40039 3.03239L5.86839 7.50039L1.40039 11.9684L2.53239 13.1004L7.00039 8.63239L11.4684 13.1004L12.6004 11.9684L8.13239 7.50039L12.6004 3.03239Z", fill: "currentColor" }) }) }) }))] })) }));
 }
 
-var css_248z$4 = ".bcds-react-aria-TagGroup {\n  color: var(--typography-color-primary);\n  font: var(--typography-regular-small-body);\n}\n\n.bcds-react-aria-TagGroup--Label,\n.bcds-react-aria-TagGroup--Text-description,\n.bcds-react-aria-TagGroup--Text-error {\n  display: block;\n  padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n.bcds-react-aria-TagGroup--Text-error {\n  color: var(--typography-color-danger);\n}\n";
+var css_248z$4 = ".bcds-react-aria-TagGroup {\n  color: var(--typography-color-primary);\n  font: var(--typography-regular-small-body);\n}\n\n.bcds-react-aria-TagGroup--Label,\n.bcds-react-aria-TagGroup--Text-description,\n.bcds-react-aria-TagGroup--Text-error {\n  display: block;\n  padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n.bcds-react-aria-TagGroup--Text-error {\n  display: flex;\n  color: var(--typography-color-danger);\n}\n\n.bcds-react-aria-TagGroup--Text-error > svg {\n  padding-right: var(--layout-padding-xsmall);\n  color: var(--icons-color-danger);\n  min-width: var(--icons-size-medium);\n  height: var(--icons-size-medium);\n}\n";
 styleInject(css_248z$4);
 
 function TagGroup({ children, label, description, errorMessage, ...props }) {
-    return (jsxs($eaf9e70818b436db$export$67ea30858aaf75e3, { className: "bcds-react-aria-TagGroup", ...props, children: [label && (jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TagGroup--Label", children: label })), children, description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-TagGroup--Text-description", children: description })), errorMessage && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "errorMessage", className: "bcds-react-aria-TagGroup--Text-error", children: errorMessage }))] }));
+    return (jsxs($eaf9e70818b436db$export$67ea30858aaf75e3, { className: "bcds-react-aria-TagGroup", ...props, children: [label && (jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TagGroup--Label", children: label })), children, description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-TagGroup--Text-description", children: description })), errorMessage && (jsxs($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "errorMessage", className: "bcds-react-aria-TagGroup--Text-error", children: [jsx(SvgExclamationIcon, {}), errorMessage] }))] }));
 }
 
 var css_248z$3 = ".bcds-react-aria-TagList {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--layout-padding-small);\n  width: fit-content;\n}\n\n.bcds-react-aria-TagList.horizontal {\n  flex-direction: row;\n}\n\n.bcds-react-aria-TagList.vertical {\n  flex-direction: column;\n}\n";
@@ -13839,11 +13881,6 @@ function TagList({ items, orientation = "horizontal", renderEmptyState, ...props
 var css_248z$2 = ".bcds-react-aria-TextArea {\n  display: inline-flex;\n  flex-direction: column;\n  /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\n  align-self: stretch;\n  max-width: -moz-available;\n  max-width: -webkit-fill-available;\n}\n\n/* Styles for the text label above the input field */\n.bcds-react-aria-TextArea--Label {\n  font: var(--typography-regular-small-body);\n  color: var(--typography-color-primary);\n  padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n/* Styles for the description and character count slot below the input field */\n.bcds-react-aria-TextArea--Description {\n  display: grid;\n  gap: var(--layout-margin-medium);\n  padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n  font: var(--typography-regular-small-body);\n  color: var(--typography-color-secondary);\n}\n\n/* Description label */\n.bcds-react-aria-TextArea--Description > .text {\n  justify-self: flex-start;\n  grid-row: 1;\n}\n\n/* Character counter */\n.bcds-react-aria-TextArea--Description > .counter {\n  justify-self: flex-end;\n  grid-row: 1;\n}\n\n/* Styles for the input field container */\n.bcds-react-aria-TextArea--Container {\n  color: var(--typography-color-primary);\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--layout-margin-small);\n  background: var(--surface-color-forms-default);\n  box-sizing: border-box;\n  border: var(--layout-border-width-small) solid\n    var(--surface-color-border-default);\n  border-radius: var(--layout-border-radius-medium);\n  padding: var(--layout-padding-small) 12px;\n}\n\n/* Text input field */\n.bcds-react-aria-TextArea--Input {\n  font: var(--typography-regular-body);\n  padding: var(--layout-padding-none);\n  color: var(--typography-color-primary);\n  border: none;\n  flex-grow: 1;\n}\n\n.bcds-rect-aria-TextArea--Input::placeholder {\n  color: var(--typography-color-placeholder);\n}\n\n/* Hover and focus states */\n.bcds-react-aria-TextArea--Container\n  > .bcds-react-aria-TextArea--Input[data-focused] {\n  outline: none;\n}\n\n.bcds-react-aria-TextArea--Container:focus-within {\n  border-radius: var(--layout-border-radius-large);\n  border: var(--layout-border-width-small) solid\n    var(--surface-color-border-active);\n  outline: solid var(--layout-border-width-medium)\n    var(--surface-color-border-active);\n  outline-offset: var(--layout-margin-hair);\n}\n\n.bcds-react-aria-TextArea--Container:hover {\n  border-color: var(--surface-color-border-dark);\n}\n\n/* Disabled and invalid states */\n.bcds-react-aria-TextArea[data-disabled]\n  > .bcds-react-aria-TextArea--Container {\n  background: var(--surface-color-forms-disabled);\n  cursor: not-allowed;\n}\n\n.bcds-react-aria-TextArea--Input[data-disabled] {\n  cursor: not-allowed;\n}\n\n.bcds-react-aria-TextArea[data-invalid] > .bcds-react-aria-TextArea--Container {\n  border-radius: var(--layout-border-radius-medium);\n  border: 1px solid var(--support-border-color-danger);\n  background: var(--surface-color-forms-default);\n}\n\n.bcds-react-aria-TextArea[data-readonly]\n  > .bcds-react-aria-TextArea--Container {\n  background: var(--surface-color-forms-disabled);\n}\n\n.bcds-react-aria-TextArea[data-readonly]\n  > .bcds-react-aria-TextArea--Container\n  > .bcds-react-aria-TextArea--Input {\n  background: var(--surface-color-forms-disabled);\n}\n\n/* Styles for the error message slot */\n.bcds-react-aria-TextArea--Error {\n  display: flex;\n  font: var(--typography-regular-small-body);\n  color: var(--typography-color-danger);\n}\n\n.bcds-react-aria-TextArea--Error > svg {\n  padding-right: var(--layout-padding-xsmall);\n  color: var(--icons-color-danger);\n  width: var(--icons-size-medium);\n  height: var(--icons-size-medium);\n}\n";
 styleInject(css_248z$2);
 
-// This icon is available as a plain SVG at src/assets/icon-exclamation.svg
-function SvgExclamationIcon({ id = "exclamation-icon" }) {
-    return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M17.835 15.0312C18.335 15.9062 17.71 17 16.6787 17H3.33499C2.30374 17 1.67874 15.9062 2.14749 15.0312L8.83499 3.65625C9.11624 3.21875 9.55373 3 10.0225 3C10.46 3 10.8975 3.21875 11.1787 3.65625L17.835 15.0312ZM3.64749 15.5H16.3663L9.99123 4.65625L3.64749 15.5ZM10.0225 12.5625C10.5537 12.5625 10.9912 13 10.9912 13.5312C10.9912 14.0625 10.5537 14.5 10.0225 14.5C9.45998 14.5 9.02249 14.0625 9.02249 13.5312C9.02249 13 9.45998 12.5625 10.0225 12.5625ZM9.27249 7.75C9.27249 7.34375 9.58498 7 10.0225 7C10.4287 7 10.7725 7.34375 10.7725 7.75V10.75C10.7725 11.1875 10.4287 11.5 10.0225 11.5C9.58498 11.5 9.27249 11.1875 9.27249 10.75V7.75Z", fill: "currentColor" }) }) }));
-}
-
 function TextArea({ label, description, errorMessage, maxLength, onChange, value, ...props }) {
     // handler for character counter, displayed when a maxLength is set
     const [charCount, setCharCount] = useState(value ? value.length : 0);
@@ -13875,5 +13912,5 @@ function Tooltip(props) {
     return (jsxs($4e3b923658d69c60$export$28c660c63b792dea, { className: "bcds-react-aria-Tooltip", ...props, children: [jsx($44f671af83e7d9e0$export$746d02f47f4d381, { className: "bcds-react-aria-OverlayArrow", children: jsx(SvgTooltipArrowUp, {}) }), jsx(Fragment, { children: props.children })] }));
 }
 
-export { Button, Footer, FooterLinks, Form, Header, Select, SvgBcLogo, Tag, TagGroup, TagList, TextArea, TextField, Tooltip, $4e3b923658d69c60$export$8c610744efcf8a1d as TooltipTrigger };
+export { Button, Footer, FooterLinks, Form, Header, InlineAlert, Select, SvgBcLogo, SvgCheckCircleIcon, SvgCloseIcon, SvgExclamationCircleIcon, SvgExclamationIcon, SvgInfoIcon, Tag, TagGroup, TagList, TextArea, TextField, Tooltip, $4e3b923658d69c60$export$8c610744efcf8a1d as TooltipTrigger };
 //# sourceMappingURL=index.js.map