@bcgov/design-system-react-components 0.5.0-pr513 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +185 -185
  2. package/dist/cjs/index.cjs +24 -24
  3. package/dist/cjs/index.cjs.map +1 -1
  4. package/dist/esm/index.js +24 -24
  5. package/dist/esm/index.js.map +1 -1
  6. package/package.json +86 -86
package/dist/cjs/index.cjs CHANGED
@@ -15821,10 +15821,10 @@ function $4e3b923658d69c60$var$TooltipInner(props) {
15821
15821
  }, renderProps.children));
15822
15822
  }
15823
15823
 
15824
- var css_248z$n = ".bcds-react-aria-Disclosure {\n display: flex;\n flex-direction: column;\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n overflow: hidden;\n}\n\n.bcds-react-aria-Disclosure--Button {\n display: inline-flex;\n flex-direction: row;\n padding: var(--layout-padding-small) var(--layout-padding-medium);\n gap: var(--layout-margin-small);\n justify-content: space-between;\n align-items: center;\n background-color: var(--surface-color-background-light-gray);\n border: none;\n cursor: pointer;\n font: var(--typography-bold-body);\n color: var(--typography-color-primary);\n}\n\n/* Hover */\n.bcds-react-aria-Disclosure--Button[data-hovered] {\n background-color: var(--surface-color-menus-hover);\n}\n\n/* Accordion content */\n.bcds-react-aria-Disclosure[data-expanded]\n > .bcds-react-aria-Disclosure--Panel {\n display: flex;\n align-items: flex-start;\n padding: var(--layout-padding-medium);\n gap: var(--layout-margin-small);\n background-color: var(--surface-color-forms-default);\n font: var(--typography-regular-body);\n}\n\n/* Focus state */\n.bcds-react-aria-Disclosure[data-focus-visible-within] {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Override default focus behaviour for button */\n.bcds-react-aria-Disclosure[data-focus-visible-within]\n > .bcds-react-aria-Disclosure--Button {\n outline: none;\n}\n\n.bcds-react-aria-Disclosure--Button[data-focused] {\n outline: none;\n}\n\n/* Disabled state */\n.bcds-react-aria-Disclosure[data-disabled]\n > .bcds-react-aria-Disclosure--Button {\n background-color: var(--surface-color-forms-disabled);\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n";
15824
+ var css_248z$n = ".bcds-react-aria-Disclosure {\r\n display: flex;\r\n flex-direction: column;\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-default);\r\n border-radius: var(--layout-border-radius-medium);\r\n overflow: hidden;\r\n}\r\n\r\n.bcds-react-aria-Disclosure--Button {\r\n display: inline-flex;\r\n flex-direction: row;\r\n padding: var(--layout-padding-small) var(--layout-padding-medium);\r\n gap: var(--layout-margin-small);\r\n justify-content: space-between;\r\n align-items: center;\r\n background-color: var(--surface-color-background-light-gray);\r\n border: none;\r\n cursor: pointer;\r\n font: var(--typography-bold-body);\r\n color: var(--typography-color-primary);\r\n}\r\n\r\n/* Hover */\r\n.bcds-react-aria-Disclosure--Button[data-hovered] {\r\n background-color: var(--surface-color-menus-hover);\r\n}\r\n\r\n/* Accordion content */\r\n.bcds-react-aria-Disclosure[data-expanded]\r\n > .bcds-react-aria-Disclosure--Panel {\r\n display: flex;\r\n align-items: flex-start;\r\n padding: var(--layout-padding-medium);\r\n gap: var(--layout-margin-small);\r\n background-color: var(--surface-color-forms-default);\r\n font: var(--typography-regular-body);\r\n}\r\n\r\n/* Focus state */\r\n.bcds-react-aria-Disclosure[data-focus-visible-within] {\r\n outline: solid var(--layout-border-width-medium)\r\n var(--surface-color-border-active);\r\n outline-offset: var(--layout-margin-hair);\r\n}\r\n\r\n/* Override default focus behaviour for button */\r\n.bcds-react-aria-Disclosure[data-focus-visible-within]\r\n > .bcds-react-aria-Disclosure--Button {\r\n outline: none;\r\n}\r\n\r\n.bcds-react-aria-Disclosure--Button[data-focused] {\r\n outline: none;\r\n}\r\n\r\n/* Disabled state */\r\n.bcds-react-aria-Disclosure[data-disabled]\r\n > .bcds-react-aria-Disclosure--Button {\r\n background-color: var(--surface-color-forms-disabled);\r\n color: var(--typography-color-disabled);\r\n cursor: not-allowed;\r\n}\r\n";
15825
15825
  styleInject(css_248z$n);
15826
15826
 
15827
- var css_248z$m = ".bcds-react-aria-Button {\n border: none;\n border-radius: var(--layout-border-radius-medium);\n cursor: pointer;\n display: inline-flex;\n align-items: center;\n gap: var(--layout-padding-small);\n font: var(--typography-regular-body);\n padding-left: 16px;\n padding-right: 16px;\n}\n.bcds-react-aria-Button[data-disabled] {\n cursor: not-allowed;\n}\n.bcds-react-aria-Button[data-focused] {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Icon button */\n.bcds-react-aria-Button.icon {\n align-items: center;\n justify-content: space-around;\n}\n\n/* Sizes */\n.bcds-react-aria-Button.small {\n min-height: 32px;\n}\n.bcds-react-aria-Button.small.icon {\n padding: unset;\n height: 32px;\n width: 32px;\n min-width: 32px;\n}\n.bcds-react-aria-Button.medium {\n min-height: 40px;\n}\n.bcds-react-aria-Button.medium.icon {\n padding: unset;\n height: 40px;\n width: 40px;\n min-width: 40px;\n}\n\n/* Variant - Primary */\n.bcds-react-aria-Button.primary {\n background: var(--surface-color-primary-button-default);\n color: var(--icons-color-primary-invert);\n}\n.bcds-react-aria-Button.primary.danger {\n background-color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Button.primary[data-disabled] {\n background-color: var(--surface-color-primary-danger-button-disabled);\n color: var(--typography-color-disabled);\n}\n.bcds-react-aria-Button.primary[data-hovered] {\n background-color: var(--surface-color-primary-button-hover);\n}\n.bcds-react-aria-Button.primary.danger[data-hovered] {\n background-color: var(--surface-color-primary-danger-button-hover);\n}\n\n/* Variant - Secondary */\n.bcds-react-aria-Button.secondary {\n background-color: var(--surface-color-secondary-button-default);\n border: 1px solid var(--surface-color-border-dark);\n color: var(--typography-color-primary);\n}\n.bcds-react-aria-Button.secondary.danger {\n border-color: var(--support-border-color-danger);\n color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Button.secondary[data-disabled] {\n background-color: var(--surface-color-secondary-button-disabled);\n border-color: var(--surface-color-border-default);\n color: var(--typography-color-disabled);\n}\n.bcds-react-aria-Button.secondary[data-hovered] {\n background-color: var(--surface-color-secondary-button-hover);\n}\n.bcds-react-aria-Button.secondary.danger[data-hovered] {\n background-color: var(--support-surface-color-danger);\n}\n\n/* Variant - Tertiary */\n.bcds-react-aria-Button.tertiary {\n background-color: var(--surface-color-tertiary-button-default);\n color: var(--typography-color-primary);\n}\n.bcds-react-aria-Button.tertiary.danger {\n color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Button.tertiary[data-disabled] {\n background-color: var(--surface-color-tertiary-button-default);\n color: var(--typography-color-disabled);\n}\n.bcds-react-aria-Button.tertiary[data-hovered] {\n background-color: var(--surface-color-tertiary-button-hover);\n}\n.bcds-react-aria-Button.tertiary.danger[data-hovered] {\n background-color: var(--support-surface-color-danger);\n}\n\n/* Variant - Link */\n.bcds-react-aria-Button.link {\n background-color: var(--surface-color-tertiary-button-default);\n color: var(--typography-color-link);\n text-decoration: underline;\n text-underline-offset: 0.3em;\n}\n.bcds-react-aria-Button.link.danger {\n color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Button.link[data-disabled] {\n color: var(--typography-color-disabled);\n}\n";
15827
+ var css_248z$m = ".bcds-react-aria-Button {\r\n border: none;\r\n border-radius: var(--layout-border-radius-medium);\r\n cursor: pointer;\r\n display: inline-flex;\r\n align-items: center;\r\n gap: var(--layout-padding-small);\r\n font: var(--typography-regular-body);\r\n padding-left: 16px;\r\n padding-right: 16px;\r\n}\r\n.bcds-react-aria-Button[data-disabled] {\r\n cursor: not-allowed;\r\n}\r\n.bcds-react-aria-Button[data-focused] {\r\n outline: solid var(--layout-border-width-medium)\r\n var(--surface-color-border-active);\r\n outline-offset: var(--layout-margin-hair);\r\n}\r\n\r\n/* Icon button */\r\n.bcds-react-aria-Button.icon {\r\n align-items: center;\r\n justify-content: space-around;\r\n}\r\n\r\n/* Sizes */\r\n.bcds-react-aria-Button.small {\r\n min-height: 32px;\r\n}\r\n.bcds-react-aria-Button.small.icon {\r\n padding: unset;\r\n height: 32px;\r\n width: 32px;\r\n min-width: 32px;\r\n}\r\n.bcds-react-aria-Button.medium {\r\n min-height: 40px;\r\n}\r\n.bcds-react-aria-Button.medium.icon {\r\n padding: unset;\r\n height: 40px;\r\n width: 40px;\r\n min-width: 40px;\r\n}\r\n\r\n/* Variant - Primary */\r\n.bcds-react-aria-Button.primary {\r\n background: var(--surface-color-primary-button-default);\r\n color: var(--icons-color-primary-invert);\r\n}\r\n.bcds-react-aria-Button.primary.danger {\r\n background-color: var(--surface-color-primary-danger-button-default);\r\n}\r\n.bcds-react-aria-Button.primary[data-disabled] {\r\n background-color: var(--surface-color-primary-danger-button-disabled);\r\n color: var(--typography-color-disabled);\r\n}\r\n.bcds-react-aria-Button.primary[data-hovered] {\r\n background-color: var(--surface-color-primary-button-hover);\r\n}\r\n.bcds-react-aria-Button.primary.danger[data-hovered] {\r\n background-color: var(--surface-color-primary-danger-button-hover);\r\n}\r\n\r\n/* Variant - Secondary */\r\n.bcds-react-aria-Button.secondary {\r\n background-color: var(--surface-color-secondary-button-default);\r\n border: 1px solid var(--surface-color-border-dark);\r\n color: var(--typography-color-primary);\r\n}\r\n.bcds-react-aria-Button.secondary.danger {\r\n border-color: var(--support-border-color-danger);\r\n color: var(--surface-color-primary-danger-button-default);\r\n}\r\n.bcds-react-aria-Button.secondary[data-disabled] {\r\n background-color: var(--surface-color-secondary-button-disabled);\r\n border-color: var(--surface-color-border-default);\r\n color: var(--typography-color-disabled);\r\n}\r\n.bcds-react-aria-Button.secondary[data-hovered] {\r\n background-color: var(--surface-color-secondary-button-hover);\r\n}\r\n.bcds-react-aria-Button.secondary.danger[data-hovered] {\r\n background-color: var(--support-surface-color-danger);\r\n}\r\n\r\n/* Variant - Tertiary */\r\n.bcds-react-aria-Button.tertiary {\r\n background-color: var(--surface-color-tertiary-button-default);\r\n color: var(--typography-color-primary);\r\n}\r\n.bcds-react-aria-Button.tertiary.danger {\r\n color: var(--surface-color-primary-danger-button-default);\r\n}\r\n.bcds-react-aria-Button.tertiary[data-disabled] {\r\n background-color: var(--surface-color-tertiary-button-default);\r\n color: var(--typography-color-disabled);\r\n}\r\n.bcds-react-aria-Button.tertiary[data-hovered] {\r\n background-color: var(--surface-color-tertiary-button-hover);\r\n}\r\n.bcds-react-aria-Button.tertiary.danger[data-hovered] {\r\n background-color: var(--support-surface-color-danger);\r\n}\r\n\r\n/* Variant - Link */\r\n.bcds-react-aria-Button.link {\r\n background-color: var(--surface-color-tertiary-button-default);\r\n color: var(--typography-color-link);\r\n text-decoration: underline;\r\n text-underline-offset: 0.3em;\r\n}\r\n.bcds-react-aria-Button.link.danger {\r\n color: var(--surface-color-primary-danger-button-default);\r\n}\r\n.bcds-react-aria-Button.link[data-disabled] {\r\n color: var(--typography-color-disabled);\r\n}\r\n";
15828
15828
  styleInject(css_248z$m);
15829
15829
 
15830
15830
  function Button({ size = "medium", variant = "primary", danger = false, isIconButton = false, ...props }) {
@@ -15845,7 +15845,7 @@ function Accordion({ label, children, ...props }) {
15845
15845
  return (jsxRuntime.jsx($28f4fd908f0de97f$export$74a362b31437ec83, { className: `bcds-react-aria-Disclosure`, ...props, children: ({ isExpanded }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(Button, { className: "bcds-react-aria-Disclosure--Button", size: "small", variant: "link", slot: "trigger", children: [label, isExpanded ? jsxRuntime.jsx(SvgChevronUpIcon, {}) : jsxRuntime.jsx(SvgChevronDownIcon, {})] }), jsxRuntime.jsx($28f4fd908f0de97f$export$feabaa331e1d464c, { className: "bcds-react-aria-Disclosure--Panel", children: jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }) })] })) }));
15846
15846
  }
15847
15847
 
15848
- var css_248z$l = ".bcds-react-aria-DisclosureGroup {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: var(--layout-border-width-small);\n background-color: var(--surface-color-border-default);\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n overflow: hidden;\n}\n\n/* Override individual accordion item borders */\n.bcds-react-aria-DisclosureGroup > .bcds-react-aria-Disclosure {\n border: none;\n border-radius: var(--layout-border-radius-none);\n}\n\n/* Focus state */\n.bcds-react-aria-DisclosureGroup\n > .bcds-react-aria-Disclosure[data-focus-visible-within] {\n border-radius: var(--layout-border-radius-hair);\n outline-offset: calc(var(--layout-margin-hair) * -1);\n}\n\n/* Title styles */\n.bcds-react-aria-DisclosureGroup--Title {\n color: var(--typography-color-primary);\n margin: var(--layout-margin-medium) var(--layout-margin-none);\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h1 {\n font: var(--typography-bold-h1);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h2 {\n font: var(--typography-bold-h2);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h3 {\n font: var(--typography-bold-h3);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h4 {\n font: var(--typography-bold-h4);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h5 {\n font: var(--typography-bold-h5);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h6 {\n font: var(--typography-bold-h6);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > span {\n font: var(--typography-bold-large-body);\n}\n";
15848
+ var css_248z$l = ".bcds-react-aria-DisclosureGroup {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n gap: var(--layout-border-width-small);\r\n background-color: var(--surface-color-border-default);\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-default);\r\n border-radius: var(--layout-border-radius-medium);\r\n overflow: hidden;\r\n}\r\n\r\n/* Override individual accordion item borders */\r\n.bcds-react-aria-DisclosureGroup > .bcds-react-aria-Disclosure {\r\n border: none;\r\n border-radius: var(--layout-border-radius-none);\r\n}\r\n\r\n/* Focus state */\r\n.bcds-react-aria-DisclosureGroup\r\n > .bcds-react-aria-Disclosure[data-focus-visible-within] {\r\n border-radius: var(--layout-border-radius-hair);\r\n outline-offset: calc(var(--layout-margin-hair) * -1);\r\n}\r\n\r\n/* Title styles */\r\n.bcds-react-aria-DisclosureGroup--Title {\r\n color: var(--typography-color-primary);\r\n margin: var(--layout-margin-medium) var(--layout-margin-none);\r\n}\r\n\r\n.bcds-react-aria-DisclosureGroup--Title > h1 {\r\n font: var(--typography-bold-h1);\r\n margin-block-start: 0;\r\n margin-block-end: 0;\r\n}\r\n\r\n.bcds-react-aria-DisclosureGroup--Title > h2 {\r\n font: var(--typography-bold-h2);\r\n margin-block-start: 0;\r\n margin-block-end: 0;\r\n}\r\n\r\n.bcds-react-aria-DisclosureGroup--Title > h3 {\r\n font: var(--typography-bold-h3);\r\n margin-block-start: 0;\r\n margin-block-end: 0;\r\n}\r\n\r\n.bcds-react-aria-DisclosureGroup--Title > h4 {\r\n font: var(--typography-bold-h4);\r\n margin-block-start: 0;\r\n margin-block-end: 0;\r\n}\r\n\r\n.bcds-react-aria-DisclosureGroup--Title > h5 {\r\n font: var(--typography-bold-h5);\r\n margin-block-start: 0;\r\n margin-block-end: 0;\r\n}\r\n\r\n.bcds-react-aria-DisclosureGroup--Title > h6 {\r\n font: var(--typography-bold-h6);\r\n margin-block-start: 0;\r\n margin-block-end: 0;\r\n}\r\n\r\n.bcds-react-aria-DisclosureGroup--Title > span {\r\n font: var(--typography-bold-large-body);\r\n}\r\n";
15849
15849
  styleInject(css_248z$l);
15850
15850
 
15851
15851
  function AccordionGroup({ title, titleElement, children, ...props }) {
@@ -15870,7 +15870,7 @@ function AccordionGroup({ title, titleElement, children, ...props }) {
15870
15870
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [title && (jsxRuntime.jsx("div", { className: "bcds-react-aria-DisclosureGroup--Title", children: getTitle() })), jsxRuntime.jsx($28f4fd908f0de97f$export$944aceb4f8c89f10, { className: "bcds-react-aria-DisclosureGroup", ...props, children: children })] }));
15871
15871
  }
15872
15872
 
15873
- var css_248z$k = ".bcds-Alert-Banner {\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-around;\n width: 100%;\n padding: var(--layout-padding-none) var(--layout-padding-medium);\n}\n\n.bcds-Alert-Banner--Container {\n flex-grow: 1;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-padding-medium);\n max-width: 1100px;\n padding: var(--layout-padding-small) var(--layout-padding-none);\n}\n\n.bcds-Alert-Banner--Icon {\n align-self: first baseline;\n justify-self: flex-start;\n padding-top: var(--layout-padding-xsmall);\n color: var(--icons-color-primary-invert);\n}\n\n.bcds-Alert-Banner--Content {\n display: inline-flex;\n gap: var(--layout-margin-medium);\n align-items: first baseline;\n flex-grow: 1;\n flex-wrap: wrap;\n font: var(--typography-regular-body);\n color: var(--typography-color-primary-invert);\n}\n\n.bcds-Alert-Banner--closeIcon {\n align-self: first baseline;\n}\n\n.bcds-Alert-Banner--closeIcon > .bcds-react-aria-Button[data-hovered] svg {\n color: var(--icons-color-primary);\n}\n\n.bcds-Alert-Banner--closeIcon svg {\n color: var(--icons-color-primary-invert);\n}\n\n/* Variants */\n\n/* Info theme */\n.bcds-Alert-Banner.info {\n background-color: var(--surface-color-background-dark-blue);\n}\n\n/* Success theme */\n.bcds-Alert-Banner.success {\n background-color: var(--support-border-color-success);\n}\n\n/* Warning theme */\n.bcds-Alert-Banner.warning {\n background-color: var(--support-border-color-warning);\n}\n\n.bcds-Alert-Banner.warning .bcds-Alert-Banner--Icon {\n color: var(--icons-color-primary);\n}\n\n.bcds-Alert-Banner.warning .bcds-Alert-Banner--Content {\n color: var(--typography-color-primary);\n}\n\n.bcds-Alert-Banner.warning .bcds-Alert-Banner--closeIcon svg {\n color: var(--icons-color-primary);\n}\n\n/* Danger theme */\n.bcds-Alert-Banner.danger {\n background-color: var(--support-border-color-danger);\n}\n\n/* Black theme */\n\n.bcds-Alert-Banner.black {\n background-color: var(--theme-gray-110);\n}\n";
15873
+ var css_248z$k = ".bcds-Alert-Banner {\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n justify-content: space-around;\r\n width: 100%;\r\n padding: var(--layout-padding-none) var(--layout-padding-medium);\r\n}\r\n\r\n.bcds-Alert-Banner--Container {\r\n flex-grow: 1;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: var(--layout-padding-medium);\r\n max-width: 1100px;\r\n padding: var(--layout-padding-small) var(--layout-padding-none);\r\n}\r\n\r\n.bcds-Alert-Banner--Icon {\r\n align-self: first baseline;\r\n justify-self: flex-start;\r\n padding-top: var(--layout-padding-xsmall);\r\n color: var(--icons-color-primary-invert);\r\n}\r\n\r\n.bcds-Alert-Banner--Content {\r\n display: inline-flex;\r\n gap: var(--layout-margin-medium);\r\n align-items: first baseline;\r\n flex-grow: 1;\r\n flex-wrap: wrap;\r\n font: var(--typography-regular-body);\r\n color: var(--typography-color-primary-invert);\r\n}\r\n\r\n.bcds-Alert-Banner--closeIcon {\r\n align-self: first baseline;\r\n}\r\n\r\n.bcds-Alert-Banner--closeIcon > .bcds-react-aria-Button[data-hovered] svg {\r\n color: var(--icons-color-primary);\r\n}\r\n\r\n.bcds-Alert-Banner--closeIcon svg {\r\n color: var(--icons-color-primary-invert);\r\n}\r\n\r\n/* Variants */\r\n\r\n/* Info theme */\r\n.bcds-Alert-Banner.info {\r\n background-color: var(--surface-color-background-dark-blue);\r\n}\r\n\r\n/* Success theme */\r\n.bcds-Alert-Banner.success {\r\n background-color: var(--support-border-color-success);\r\n}\r\n\r\n/* Warning theme */\r\n.bcds-Alert-Banner.warning {\r\n background-color: var(--support-border-color-warning);\r\n}\r\n\r\n.bcds-Alert-Banner.warning .bcds-Alert-Banner--Icon {\r\n color: var(--icons-color-primary);\r\n}\r\n\r\n.bcds-Alert-Banner.warning .bcds-Alert-Banner--Content {\r\n color: var(--typography-color-primary);\r\n}\r\n\r\n.bcds-Alert-Banner.warning .bcds-Alert-Banner--closeIcon svg {\r\n color: var(--icons-color-primary);\r\n}\r\n\r\n/* Danger theme */\r\n.bcds-Alert-Banner.danger {\r\n background-color: var(--support-border-color-danger);\r\n}\r\n\r\n/* Black theme */\r\n\r\n.bcds-Alert-Banner.black {\r\n background-color: var(--theme-gray-110);\r\n}\r\n";
15874
15874
  styleInject(css_248z$k);
15875
15875
 
15876
15876
  /* The component implements the Circle Check icon from Font Awesome: https://fontawesome.com/icons/circle-check */
@@ -15919,14 +15919,14 @@ function AlertBanner({ variant = "info", isIconHidden = false, isCloseable = tru
15919
15919
  return (jsxRuntime.jsx("div", { className: `bcds-Alert-Banner ${variant}`, ...props, children: jsxRuntime.jsxs("div", { className: "bcds-Alert-Banner--Container", children: [" ", !isIconHidden && (jsxRuntime.jsx("span", { className: "bcds-Alert-Banner--Icon", children: customIcon ? customIcon : getIcon$2(variant) })), jsxRuntime.jsx("div", { className: "bcds-Alert-Banner--Content", role: role, children: children }), isCloseable && (jsxRuntime.jsx("span", { className: "bcds-Alert-Banner--closeIcon", children: jsxRuntime.jsx(Button, { variant: "tertiary", isIconButton: true, size: "small", "aria-label": "Close this alert", type: "button", onPress: onClose, children: jsxRuntime.jsx(SvgCloseIcon, {}) }) }))] }) }));
15920
15920
  }
15921
15921
 
15922
- var css_248z$j = ".bcds-ButtonGroup {\n display: flex;\n gap: var(--layout-margin-small);\n flex-grow: 1;\n}\n\n.bcds-ButtonGroup.horizontal {\n flex-direction: row;\n}\n\n.bcds-ButtonGroup.vertical {\n flex-direction: column;\n}\n\n.bcds-ButtonGroup.start {\n justify-content: flex-start;\n}\n\n.bcds-ButtonGroup.center {\n justify-content: center;\n}\n\n.bcds-ButtonGroup.end {\n justify-content: flex-end;\n}\n";
15922
+ var css_248z$j = ".bcds-ButtonGroup {\r\n display: flex;\r\n gap: var(--layout-margin-small);\r\n flex-grow: 1;\r\n}\r\n\r\n.bcds-ButtonGroup.horizontal {\r\n flex-direction: row;\r\n}\r\n\r\n.bcds-ButtonGroup.vertical {\r\n flex-direction: column;\r\n}\r\n\r\n.bcds-ButtonGroup.start {\r\n justify-content: flex-start;\r\n}\r\n\r\n.bcds-ButtonGroup.center {\r\n justify-content: center;\r\n}\r\n\r\n.bcds-ButtonGroup.end {\r\n justify-content: flex-end;\r\n}\r\n";
15923
15923
  styleInject(css_248z$j);
15924
15924
 
15925
15925
  function ButtonGroup({ orientation = "horizontal", alignment = "start", ariaLabel, children, ...props }) {
15926
15926
  return (jsxRuntime.jsx("div", { className: `bcds-ButtonGroup ${orientation} ${alignment}`, role: "group", "aria-label": ariaLabel, ...props, children: children }));
15927
15927
  }
15928
15928
 
15929
- var css_248z$i = ".bcds-react-aria-AlertDialog {\n display: flex;\n flex-direction: column;\n}\n\n/* Variant icons */\n.bcds-react-aria-AlertDialog.info .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-primary);\n}\n.bcds-react-aria-AlertDialog.confirmation .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-success);\n}\n.bcds-react-aria-AlertDialog.warning .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-warning);\n}\n.bcds-react-aria-AlertDialog.error .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-danger);\n}\n.bcds-react-aria-AlertDialog.destructive .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-danger);\n}\n\n.bcds-react-aria-AlertDialog--Header {\n display: inline-flex;\n flex-direction: row;\n gap: var(--layout-padding-small);\n justify-content: space-between;\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n border-bottom: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n}\n\n.bcds-react-aria-AlertDialog--Title {\n flex-grow: 1;\n font: var(--typography-bold-h5);\n color: var(--typography-color-primary);\n}\n\n.bcds-react-aria-AlertDialog--Icon {\n justify-self: flex-start;\n align-self: center;\n padding-top: var(--layout-padding-xsmall);\n}\n\n.bcds-react-aria-AlertDialog--closeIcon {\n justify-self: flex-end;\n color: var(--icons-color-primary);\n}\n\n.bcds-react-aria-AlertDialog--children {\n font: var(--typography-regular-body);\n color: var(--typography-color-primary);\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n border-bottom: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n}\n\n.bcds-react-aria-AlertDialog > .bcds-ButtonGroup {\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n}\n";
15929
+ var css_248z$i = ".bcds-react-aria-AlertDialog {\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n/* Variant icons */\r\n.bcds-react-aria-AlertDialog.info .bcds-react-aria-AlertDialog--Icon {\r\n color: var(--icons-color-primary);\r\n}\r\n.bcds-react-aria-AlertDialog.confirmation .bcds-react-aria-AlertDialog--Icon {\r\n color: var(--icons-color-success);\r\n}\r\n.bcds-react-aria-AlertDialog.warning .bcds-react-aria-AlertDialog--Icon {\r\n color: var(--icons-color-warning);\r\n}\r\n.bcds-react-aria-AlertDialog.error .bcds-react-aria-AlertDialog--Icon {\r\n color: var(--icons-color-danger);\r\n}\r\n.bcds-react-aria-AlertDialog.destructive .bcds-react-aria-AlertDialog--Icon {\r\n color: var(--icons-color-danger);\r\n}\r\n\r\n.bcds-react-aria-AlertDialog--Header {\r\n display: inline-flex;\r\n flex-direction: row;\r\n gap: var(--layout-padding-small);\r\n justify-content: space-between;\r\n padding: var(--layout-padding-medium) var(--layout-padding-large);\r\n border-bottom: var(--layout-border-width-small) solid\r\n var(--surface-color-border-default);\r\n}\r\n\r\n.bcds-react-aria-AlertDialog--Title {\r\n flex-grow: 1;\r\n font: var(--typography-bold-h5);\r\n color: var(--typography-color-primary);\r\n}\r\n\r\n.bcds-react-aria-AlertDialog--Icon {\r\n justify-self: flex-start;\r\n align-self: center;\r\n padding-top: var(--layout-padding-xsmall);\r\n}\r\n\r\n.bcds-react-aria-AlertDialog--closeIcon {\r\n justify-self: flex-end;\r\n color: var(--icons-color-primary);\r\n}\r\n\r\n.bcds-react-aria-AlertDialog--children {\r\n font: var(--typography-regular-body);\r\n color: var(--typography-color-primary);\r\n padding: var(--layout-padding-medium) var(--layout-padding-large);\r\n border-bottom: var(--layout-border-width-small) solid\r\n var(--surface-color-border-default);\r\n}\r\n\r\n.bcds-react-aria-AlertDialog > .bcds-ButtonGroup {\r\n padding: var(--layout-padding-medium) var(--layout-padding-large);\r\n}\r\n";
15930
15930
  styleInject(css_248z$i);
15931
15931
 
15932
15932
  /* Sets correct left icon for selected variant */
@@ -15950,7 +15950,7 @@ function AlertDialog({ children, variant = "info", role = "dialog", title, isClo
15950
15950
  return (jsxRuntime.jsx($de32f1b87079253c$export$3ddf2d174ce01153, { className: `bcds-react-aria-AlertDialog ${variant}`, role: role, ...props, children: ({ close }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "bcds-react-aria-AlertDialog--Header", children: [!isIconHidden && (jsxRuntime.jsx("div", { className: "bcds-react-aria-AlertDialog--Icon", children: getIcon$1(variant) })), title && (jsxRuntime.jsx("div", { className: "bcds-react-aria-AlertDialog--Title", slot: "title", children: title })), isCloseable && (jsxRuntime.jsx("div", { className: "bcds-react-aria-AlertDialog--closeIcon", children: jsxRuntime.jsx(Button, { variant: "tertiary", isIconButton: true, size: "small", "aria-label": "Close", type: "button", onPress: close, children: jsxRuntime.jsx(SvgCloseIcon, {}) }) }))] }), children && (jsxRuntime.jsx("div", { className: "bcds-react-aria-AlertDialog--children", slot: "children", children: jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }) })), buttons && (jsxRuntime.jsx(ButtonGroup, { alignment: "end", orientation: "horizontal", children: buttons }))] })) }));
15951
15951
  }
15952
15952
 
15953
- var css_248z$h = ".bcds-Callout {\n display: flex;\n width: 100%;\n box-sizing: border-box;\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n border-radius: var(--layout-border-radius-medium)\n var(--layout-border-radius-none) var(--layout-border-radius-none)\n var(--layout-border-radius-medium);\n}\n\n.bcds-Callout--Container {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n gap: var(--layout-margin-small);\n}\n\n.bcds-Callout--Container > .bcds-Callout--Title {\n font: var(--typography-bold-large-body);\n color: var(--typography-color-primary);\n}\n\n.bcds-Callout--Container > .bcds-Callout--Description {\n font: var(--typography-regular-body);\n color: var(--typography-color-secondary);\n}\n\n/* Theme - light grey (default) */\n.bcds-Callout.lightGrey {\n background-color: var(--surface-color-background-light-gray);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-blue);\n}\n\n/* Theme - light blue */\n.bcds-Callout.lightBlue {\n background-color: var(--theme-blue-10);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-blue);\n}\n\n/* Theme - light gold */\n.bcds-Callout.lightGold {\n background-color: var(--theme-gold-10);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-blue);\n}\n\n/* Theme - blue */\n.bcds-Callout.Blue {\n background-color: var(--surface-color-background-dark-blue);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-gold);\n}\n\n.bcds-Callout.Blue .bcds-Callout--Title {\n color: var(--typography-color-primary-invert);\n}\n\n.bcds-Callout.Blue .bcds-Callout--Description {\n color: var(--typography-color-secondary-invert);\n}\n\n/* Theme - grey */\n.bcds-Callout.Grey {\n background-color: var(--theme-gray-80);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-gold);\n}\n\n.bcds-Callout.Grey .bcds-Callout--Title {\n color: var(--typography-color-primary-invert);\n}\n\n.bcds-Callout.Grey .bcds-Callout--Description {\n color: var(--typography-color-secondary-invert);\n}\n\n/* Theme - black */\n.bcds-Callout.Black {\n background-color: var(--theme-gray-100);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-gold);\n}\n\n.bcds-Callout.Black .bcds-Callout--Title {\n color: var(--typography-color-primary-invert);\n}\n\n.bcds-Callout.Black .bcds-Callout--Description {\n color: var(--typography-color-secondary-invert);\n}\n\n/* Border disabled */\n.bcds-Callout.lightGrey.noBorder,\n.bcds-Callout.lightGold.noBorder,\n.bcds-Callout.lightBlue.noBorder,\n.bcds-Callout.Blue.noBorder,\n.bcds-Callout.Grey.noBorder,\n.bcds-Callout.Black.noBorder {\n border-left: none;\n border-radius: var(--layout-border-radius-none);\n}\n";
15953
+ var css_248z$h = ".bcds-Callout {\r\n display: flex;\r\n width: 100%;\r\n box-sizing: border-box;\r\n padding: var(--layout-padding-medium) var(--layout-padding-large);\r\n border-radius: var(--layout-border-radius-medium)\r\n var(--layout-border-radius-none) var(--layout-border-radius-none)\r\n var(--layout-border-radius-medium);\r\n}\r\n\r\n.bcds-Callout--Container {\r\n display: flex;\r\n flex-direction: column;\r\n flex-grow: 1;\r\n gap: var(--layout-margin-small);\r\n}\r\n\r\n.bcds-Callout--Container > .bcds-Callout--Title {\r\n font: var(--typography-bold-large-body);\r\n color: var(--typography-color-primary);\r\n}\r\n\r\n.bcds-Callout--Container > .bcds-Callout--Description {\r\n font: var(--typography-regular-body);\r\n color: var(--typography-color-secondary);\r\n}\r\n\r\n/* Theme - light grey (default) */\r\n.bcds-Callout.lightGrey {\r\n background-color: var(--surface-color-background-light-gray);\r\n border-left: var(--layout-border-width-large) solid var(--theme-primary-blue);\r\n}\r\n\r\n/* Theme - light blue */\r\n.bcds-Callout.lightBlue {\r\n background-color: var(--theme-blue-10);\r\n border-left: var(--layout-border-width-large) solid var(--theme-primary-blue);\r\n}\r\n\r\n/* Theme - light gold */\r\n.bcds-Callout.lightGold {\r\n background-color: var(--theme-gold-10);\r\n border-left: var(--layout-border-width-large) solid var(--theme-primary-blue);\r\n}\r\n\r\n/* Theme - blue */\r\n.bcds-Callout.Blue {\r\n background-color: var(--surface-color-background-dark-blue);\r\n border-left: var(--layout-border-width-large) solid var(--theme-primary-gold);\r\n}\r\n\r\n.bcds-Callout.Blue .bcds-Callout--Title {\r\n color: var(--typography-color-primary-invert);\r\n}\r\n\r\n.bcds-Callout.Blue .bcds-Callout--Description {\r\n color: var(--typography-color-secondary-invert);\r\n}\r\n\r\n/* Theme - grey */\r\n.bcds-Callout.Grey {\r\n background-color: var(--theme-gray-80);\r\n border-left: var(--layout-border-width-large) solid var(--theme-primary-gold);\r\n}\r\n\r\n.bcds-Callout.Grey .bcds-Callout--Title {\r\n color: var(--typography-color-primary-invert);\r\n}\r\n\r\n.bcds-Callout.Grey .bcds-Callout--Description {\r\n color: var(--typography-color-secondary-invert);\r\n}\r\n\r\n/* Theme - black */\r\n.bcds-Callout.Black {\r\n background-color: var(--theme-gray-100);\r\n border-left: var(--layout-border-width-large) solid var(--theme-primary-gold);\r\n}\r\n\r\n.bcds-Callout.Black .bcds-Callout--Title {\r\n color: var(--typography-color-primary-invert);\r\n}\r\n\r\n.bcds-Callout.Black .bcds-Callout--Description {\r\n color: var(--typography-color-secondary-invert);\r\n}\r\n\r\n/* Border disabled */\r\n.bcds-Callout.lightGrey.noBorder,\r\n.bcds-Callout.lightGold.noBorder,\r\n.bcds-Callout.lightBlue.noBorder,\r\n.bcds-Callout.Blue.noBorder,\r\n.bcds-Callout.Grey.noBorder,\r\n.bcds-Callout.Black.noBorder {\r\n border-left: none;\r\n border-radius: var(--layout-border-radius-none);\r\n}\r\n";
15954
15954
  styleInject(css_248z$h);
15955
15955
 
15956
15956
  function Callout({ variant = "lightGrey", title, description, buttons, role = "note", isLeftBorderDisabled = false, children, ...props }) {
@@ -15966,21 +15966,21 @@ function SvgDashIcon({ id = "dash-icon" }) {
15966
15966
  return (jsxRuntime.jsx("svg", { id: id, width: "8", height: "10", viewBox: "0 0 8 2", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { d: "M6.99005 1.96004H1.01005C0.479855 1.96004 0.0500488 1.53023 0.0500488 1.00004C0.0500488 0.469846 0.479855 0.0400391 1.01005 0.0400391H6.99005C7.52024 0.0400391 7.95005 0.469846 7.95005 1.00004C7.95005 1.53023 7.52024 1.96004 6.99005 1.96004H6.99005Z", fill: "currentColor" }) }));
15967
15967
  }
15968
15968
 
15969
- var css_248z$g = ".bcds-react-aria-Checkbox {\n cursor: pointer;\n display: flex;\n flex-direction: row;\n gap: 10px;\n align-items: center;\n}\n\n/* Checkbox */\n.bcds-react-aria-Checkbox > .checkbox {\n align-self: first baseline;\n display: flex;\n margin-top: var(--layout-margin-hair);\n justify-content: space-around;\n width: var(--icons-size-small);\n height: var(--icons-size-small);\n min-width: var(--icons-size-small);\n background-color: var(--surface-color-secondary-default);\n border-color: var(--surface-color-border-medium);\n border-style: solid;\n border-width: var(--layout-border-width-small);\n border-radius: var(--layout-border-radius-small);\n}\n.bcds-react-aria-Checkbox > .checkbox > svg {\n align-self: center;\n}\n\n/* Label */\n.bcds-react-aria-Checkbox > .label {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n}\n\n/* Focus */\n.bcds-react-aria-Checkbox[data-focused] > .checkbox {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Hover */\n.bcds-react-aria-Checkbox[data-hovered] > .checkbox {\n border-color: var(--surface-color-border-dark);\n}\n.bcds-react-aria-Checkbox[data-selected][data-hovered] > .checkbox {\n background-color: var(--surface-color-primary-hover);\n border-color: var(--surface-color-primary-hover);\n}\n\n/* Pressed */\n.bcds-react-aria-Checkbox[data-pressed] > .checkbox {\n background-color: var(--surface-color-primary-default);\n}\n\n/* Selected */\n.bcds-react-aria-Checkbox[data-selected] > .checkbox {\n background-color: var(--surface-color-primary-default);\n border-color: var(--surface-color-primary-default);\n}\n.bcds-react-aria-Checkbox[data-selected] > .checkbox > svg {\n color: var(--icons-color-primary-invert);\n}\n\n/* Disabled */\n.bcds-react-aria-Checkbox[data-disabled] {\n cursor: not-allowed;\n}\n.bcds-react-aria-Checkbox[data-disabled] > .checkbox {\n border-color: var(--surface-color-border-medium);\n background-color: var(--surface-color-primary-disabled);\n}\n.bcds-react-aria-Checkbox[data-disabled] > .label {\n color: var(--typography-color-disabled);\n}\n.bcds-react-aria-Checkbox[data-selected][data-disabled] > .checkbox {\n border-color: var(--surface-color-primary-disabled);\n background-color: var(--surface-color-primary-disabled);\n}\n.bcds-react-aria-Checkbox[data-selected][data-disabled] > .checkbox > svg {\n color: var(--icons-color-disabled);\n}\n\n/* Indeterminate */\n.bcds-react-aria-Checkbox[data-indeterminate] > .checkbox {\n background-color: var(--surface-color-primary-default);\n border-color: var(--surface-color-primary-default);\n}\n.bcds-react-aria-Checkbox[data-indeterminate][data-disabled] > .checkbox {\n background-color: var(--surface-color-primary-disabled);\n border-color: var(--surface-color-primary-disabled);\n}\n.bcds-react-aria-Checkbox[data-indeterminate][data-invalid] > .checkbox {\n background-color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Checkbox[data-indeterminate] > .checkbox > svg {\n color: var(--icons-color-primary-invert);\n align-self: center;\n vertical-align: middle;\n}\n.bcds-react-aria-Checkbox[data-indeterminate][data-disabled] > .checkbox > svg {\n color: var(--icons-color-disabled);\n}\n\n/* Read-only */\n.bcds-react-aria-Checkbox[data-readonly] {\n cursor: not-allowed;\n}\n\n/* Invalid */\n.bcds-react-aria-Checkbox[data-invalid] > .checkbox {\n border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Checkbox[data-invalid] > .checkbox > svg {\n color: var(--icons-color-primary-invert);\n}\n.bcds-react-aria-Checkbox[data-selected][data-invalid] > .checkbox {\n background-color: var(--surface-color-primary-danger-button-default);\n}\n";
15969
+ var css_248z$g = ".bcds-react-aria-Checkbox {\r\n cursor: pointer;\r\n display: flex;\r\n flex-direction: row;\r\n gap: 10px;\r\n align-items: center;\r\n}\r\n\r\n/* Checkbox */\r\n.bcds-react-aria-Checkbox > .checkbox {\r\n align-self: first baseline;\r\n display: flex;\r\n margin-top: var(--layout-margin-hair);\r\n justify-content: space-around;\r\n width: var(--icons-size-small);\r\n height: var(--icons-size-small);\r\n min-width: var(--icons-size-small);\r\n background-color: var(--surface-color-secondary-default);\r\n border-color: var(--surface-color-border-medium);\r\n border-style: solid;\r\n border-width: var(--layout-border-width-small);\r\n border-radius: var(--layout-border-radius-small);\r\n}\r\n.bcds-react-aria-Checkbox > .checkbox > svg {\r\n align-self: center;\r\n}\r\n\r\n/* Label */\r\n.bcds-react-aria-Checkbox > .label {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-secondary);\r\n}\r\n\r\n/* Focus */\r\n.bcds-react-aria-Checkbox[data-focused] > .checkbox {\r\n outline: solid var(--layout-border-width-medium)\r\n var(--surface-color-border-active);\r\n outline-offset: var(--layout-margin-hair);\r\n}\r\n\r\n/* Hover */\r\n.bcds-react-aria-Checkbox[data-hovered] > .checkbox {\r\n border-color: var(--surface-color-border-dark);\r\n}\r\n.bcds-react-aria-Checkbox[data-selected][data-hovered] > .checkbox {\r\n background-color: var(--surface-color-primary-hover);\r\n border-color: var(--surface-color-primary-hover);\r\n}\r\n\r\n/* Pressed */\r\n.bcds-react-aria-Checkbox[data-pressed] > .checkbox {\r\n background-color: var(--surface-color-primary-default);\r\n}\r\n\r\n/* Selected */\r\n.bcds-react-aria-Checkbox[data-selected] > .checkbox {\r\n background-color: var(--surface-color-primary-default);\r\n border-color: var(--surface-color-primary-default);\r\n}\r\n.bcds-react-aria-Checkbox[data-selected] > .checkbox > svg {\r\n color: var(--icons-color-primary-invert);\r\n}\r\n\r\n/* Disabled */\r\n.bcds-react-aria-Checkbox[data-disabled] {\r\n cursor: not-allowed;\r\n}\r\n.bcds-react-aria-Checkbox[data-disabled] > .checkbox {\r\n border-color: var(--surface-color-border-medium);\r\n background-color: var(--surface-color-primary-disabled);\r\n}\r\n.bcds-react-aria-Checkbox[data-disabled] > .label {\r\n color: var(--typography-color-disabled);\r\n}\r\n.bcds-react-aria-Checkbox[data-selected][data-disabled] > .checkbox {\r\n border-color: var(--surface-color-primary-disabled);\r\n background-color: var(--surface-color-primary-disabled);\r\n}\r\n.bcds-react-aria-Checkbox[data-selected][data-disabled] > .checkbox > svg {\r\n color: var(--icons-color-disabled);\r\n}\r\n\r\n/* Indeterminate */\r\n.bcds-react-aria-Checkbox[data-indeterminate] > .checkbox {\r\n background-color: var(--surface-color-primary-default);\r\n border-color: var(--surface-color-primary-default);\r\n}\r\n.bcds-react-aria-Checkbox[data-indeterminate][data-disabled] > .checkbox {\r\n background-color: var(--surface-color-primary-disabled);\r\n border-color: var(--surface-color-primary-disabled);\r\n}\r\n.bcds-react-aria-Checkbox[data-indeterminate][data-invalid] > .checkbox {\r\n background-color: var(--surface-color-primary-danger-button-default);\r\n}\r\n.bcds-react-aria-Checkbox[data-indeterminate] > .checkbox > svg {\r\n color: var(--icons-color-primary-invert);\r\n align-self: center;\r\n vertical-align: middle;\r\n}\r\n.bcds-react-aria-Checkbox[data-indeterminate][data-disabled] > .checkbox > svg {\r\n color: var(--icons-color-disabled);\r\n}\r\n\r\n/* Read-only */\r\n.bcds-react-aria-Checkbox[data-readonly] {\r\n cursor: not-allowed;\r\n}\r\n\r\n/* Invalid */\r\n.bcds-react-aria-Checkbox[data-invalid] > .checkbox {\r\n border-color: var(--support-border-color-danger);\r\n}\r\n.bcds-react-aria-Checkbox[data-invalid] > .checkbox > svg {\r\n color: var(--icons-color-primary-invert);\r\n}\r\n.bcds-react-aria-Checkbox[data-selected][data-invalid] > .checkbox {\r\n background-color: var(--surface-color-primary-danger-button-default);\r\n}\r\n";
15970
15970
  styleInject(css_248z$g);
15971
15971
 
15972
15972
  function Checkbox({ value, children, ...props }) {
15973
15973
  return (jsxRuntime.jsx($bc237834342dbd75$export$48513f6b9f8ce62d, { className: "bcds-react-aria-Checkbox", value: value, ...props, children: ({ isRequired, isSelected, isIndeterminate }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "checkbox", children: [isSelected && !isIndeterminate && jsxRuntime.jsx(SvgCheckIcon, {}), isIndeterminate && jsxRuntime.jsx(SvgDashIcon, {})] }), jsxRuntime.jsxs("span", { className: "label", children: [jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }), " ", isRequired && "(required)"] })] })) }));
15974
15974
  }
15975
15975
 
15976
- var css_248z$f = ".bcds-react-aria-CheckboxGroup {\n display: flex;\n flex-direction: column;\n gap: var(--layout-margin-small);\n}\n\n/* Orientation */\n.bcds-react-aria-CheckboxGroup--options {\n display: flex;\n}\n\n.bcds-react-aria-CheckboxGroup--options.vertical {\n flex-direction: column;\n gap: var(--layout-margin-small);\n}\n\n.bcds-react-aria-CheckboxGroup--options.horizontal {\n flex-direction: row;\n gap: var(--layout-margin-medium);\n}\n.bcds-react-aria-CheckboxGroup--options.horizontal.flex-wrap-nowrap {\n flex-wrap: nowrap;\n}\n.bcds-react-aria-CheckboxGroup--options.horizontal.flex-wrap-wrap {\n flex-wrap: wrap;\n}\n.bcds-react-aria-CheckboxGroup--options.horizontal.flex-wrap-wrap-reverse {\n flex-wrap: wrap-reverse;\n}\n\n/* Parts */\n.bcds-react-aria-CheckboxGroup--label {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-primary);\n}\n\n.bcds-react-aria-CheckboxGroup--description {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n}\n\n.bcds-react-aria-CheckboxGroup--error {\n display: inline-flex;\n flex-direction: row;\n gap: var(--layout-margin-xsmall);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n";
15976
+ var css_248z$f = ".bcds-react-aria-CheckboxGroup {\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--layout-margin-small);\r\n}\r\n\r\n/* Orientation */\r\n.bcds-react-aria-CheckboxGroup--options {\r\n display: flex;\r\n}\r\n\r\n.bcds-react-aria-CheckboxGroup--options.vertical {\r\n flex-direction: column;\r\n gap: var(--layout-margin-small);\r\n}\r\n\r\n.bcds-react-aria-CheckboxGroup--options.horizontal {\r\n flex-direction: row;\r\n gap: var(--layout-margin-medium);\r\n}\r\n.bcds-react-aria-CheckboxGroup--options.horizontal.flex-wrap-nowrap {\r\n flex-wrap: nowrap;\r\n}\r\n.bcds-react-aria-CheckboxGroup--options.horizontal.flex-wrap-wrap {\r\n flex-wrap: wrap;\r\n}\r\n.bcds-react-aria-CheckboxGroup--options.horizontal.flex-wrap-wrap-reverse {\r\n flex-wrap: wrap-reverse;\r\n}\r\n\r\n/* Parts */\r\n.bcds-react-aria-CheckboxGroup--label {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-primary);\r\n}\r\n\r\n.bcds-react-aria-CheckboxGroup--description {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-secondary);\r\n}\r\n\r\n.bcds-react-aria-CheckboxGroup--error {\r\n display: inline-flex;\r\n flex-direction: row;\r\n gap: var(--layout-margin-xsmall);\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-danger);\r\n}\r\n";
15977
15977
  styleInject(css_248z$f);
15978
15978
 
15979
15979
  function CheckboxGroup({ orientation = "vertical", label, description, errorMessage, flexWrap = "nowrap", children, ...props }) {
15980
15980
  return (jsxRuntime.jsx($bc237834342dbd75$export$4aa08d5625cb8ead, { className: `bcds-react-aria-CheckboxGroup`, ...props, children: ({ isRequired, isInvalid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [label && (jsxRuntime.jsxs($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-CheckboxGroup--label", children: [label, " ", isRequired && "(required)"] })), jsxRuntime.jsx("div", { className: `bcds-react-aria-CheckboxGroup--options ${orientation} flex-wrap-${flexWrap}`, children: jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }) }), description && (jsxRuntime.jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-CheckboxGroup--description", children: description })), isInvalid && (jsxRuntime.jsxs("div", { className: "bcds-react-aria-CheckboxGroup--error", children: [jsxRuntime.jsx(SvgExclamationIcon, {}), jsxRuntime.jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { children: errorMessage })] }))] })) }));
15981
15981
  }
15982
15982
 
15983
- var css_248z$e = ".bcds-react-aria-Dialog {\n display: flex;\n flex-direction: column;\n min-height: var(--layout-margin-xxxlarge);\n}\n\n.bcds-react-aria-Dialog--Container {\n position: relative;\n}\n\n/* Close icon */\n.bcds-react-aria-Dialog--closeIcon {\n color: var(--icons-color-primary);\n position: absolute;\n top: 0;\n right: 0;\n padding: var(--layout-padding-small);\n}\n.bcds-react-aria-Dialog--closeIcon > svg {\n min-width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n";
15983
+ var css_248z$e = ".bcds-react-aria-Dialog {\r\n display: flex;\r\n flex-direction: column;\r\n min-height: var(--layout-margin-xxxlarge);\r\n}\r\n\r\n.bcds-react-aria-Dialog--Container {\r\n position: relative;\r\n}\r\n\r\n/* Close icon */\r\n.bcds-react-aria-Dialog--closeIcon {\r\n color: var(--icons-color-primary);\r\n position: absolute;\r\n top: 0;\r\n right: 0;\r\n padding: var(--layout-padding-small);\r\n}\r\n.bcds-react-aria-Dialog--closeIcon > svg {\r\n min-width: var(--icons-size-medium);\r\n height: var(--icons-size-medium);\r\n}\r\n";
15984
15984
  styleInject(css_248z$e);
15985
15985
 
15986
15986
  function Dialog({ isCloseable = true, role = "dialog", children, ...props }) {
@@ -15992,7 +15992,7 @@ function SvgBcLogo({ id = "bcgov-logo" }) {
15992
15992
  return (jsxRuntime.jsxs("svg", { id: id, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 847.65 327.01", children: [jsxRuntime.jsx("path", { d: "M109.59,226.32c44.7,0,106.54,25.17,151.41,25.17,32.02,0,63.26-8.54,81.04-21.13,1.24-7.39,1.9-14.97,1.9-22.72,0-75.13-60.91-136.04-136.04-136.04s-136.04,60.91-136.04,136.04c0,7.65.64,15.15,1.86,22.46,4.9-.91,21.57-3.79,35.87-3.79Z", style: { fill: "#fff", strokeWidth: "0px" } }), jsxRuntime.jsxs("g", { children: [jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("rect", { x: "415.4", y: "252.98", width: "314.66", height: "3.82", style: { fill: "#e3a82b", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M423.47,116.64c0-6.39-.45-8.08-4.76-8.43l-3-.21c-.49-.39-.35-2.12.1-2.16,5.17-.46,11.69-.69,20.6-.69,6.04,0,11.79.43,16.1,2.42,4.12,1.81,7.28,5.26,7.28,10.79,0,6.22-4.03,9.41-9.77,11.83,0,.86.77,1.12,1.82,1.29,5.17.86,12.84,5.18,12.84,14.42,0,10.01-8.24,16.75-25.49,16.75-2.78,0-7.47-.26-11.5-.26s-7.47.17-11.02.26c-.57-.26-.77-1.64-.19-2.16l1.73-.26c5.08-.78,5.27-1.73,5.27-10.79v-32.8ZM431.32,128.12c0,2.42.1,2.59,4.98,2.42,9.77-.35,15.04-2.94,15.04-11.05s-7-11.65-14.28-11.65c-2.11,0-3.55.17-4.41.52-.96.26-1.34.69-1.34,2.24v17.52ZM431.32,148.14c0,3.11.19,7.51,2.01,9.41,1.82,1.98,4.7,2.42,7.57,2.42,8.53,0,15.04-3.45,15.04-12.08,0-6.82-3.83-14.76-19.07-14.76-5.17,0-5.56.52-5.56,2.24v12.77Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M531.26,125.14c0-7.82-.16-9.07-4.99-9.44l-2.05-.15c-.49-.29-.33-1.62.16-1.84,4.09.15,6.87.22,10.31.22s6.06-.07,10.15-.22c.49.22.65,1.55.16,1.84l-2.04.15c-4.83.37-4.99,1.62-4.99,9.44v26.25c0,7.82.16,8.85,4.99,9.36l2.04.22c.49.29.33,1.62-.16,1.84-4.09-.15-6.87-.22-10.15-.22-3.44,0-6.22.07-10.31.22-.49-.22-.66-1.4-.16-1.84l2.05-.22c4.83-.52,4.99-1.55,4.99-9.36v-26.25Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M576.66,151.53c0,7.74.15,8.85,4.6,9.22l2.45.22c.46.29.31,1.62-.15,1.84-4.37-.15-6.98-.22-10.05-.22s-5.75.07-10.66.22c-.46-.22-.62-1.47,0-1.84l2.76-.22c4.37-.37,4.75-1.48,4.75-9.22v-32.96c0-2.28,0-2.36-2.3-2.36h-4.22c-3.3,0-7.51.15-9.43,1.84-1.84,1.62-2.61,3.24-3.45,5.09-.62.44-1.69.07-1.99-.52,1.22-3.32,2.38-8.04,2.91-10.98.23-.15,1.23-.22,1.46,0,.46,2.36,2.99,2.29,6.52,2.29h31.05c4.14,0,4.83-.15,5.98-2.06.38-.15,1.23-.07,1.38.22-.84,3.02-1.38,9-1.15,11.21-.31.59-1.61.59-1.99.15-.23-1.84-.77-4.57-1.92-5.38-1.76-1.25-4.68-1.84-8.89-1.84h-5.44c-2.3,0-2.22.07-2.22,2.51v32.81Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M609.53,125.14c0-7.82-.16-9.07-4.99-9.44l-2.05-.15c-.49-.29-.33-1.62.16-1.84,4.09.15,6.87.22,10.31.22s6.05-.07,10.15-.22c.49.22.66,1.55.17,1.84l-2.05.15c-4.83.37-4.99,1.62-4.99,9.44v26.25c0,7.82.16,8.85,4.99,9.36l2.05.22c.49.29.33,1.62-.17,1.84-4.09-.15-6.87-.22-10.15-.22-3.44,0-6.22.07-10.31.22-.49-.22-.65-1.4-.16-1.84l2.05-.22c4.83-.52,4.99-1.55,4.99-9.36v-26.25Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M646.2,163.57c-7.31,0-11.92-1.92-13.57-2.73-1.04-1.62-2.18-6.86-2.35-10.32.44-.52,1.74-.66,2.09-.22,1.31,3.76,4.87,10.98,14.96,10.98,7.31,0,10.87-4.05,10.87-8.48,0-3.24-.78-6.86-7.13-10.32l-8.26-4.57c-4.35-2.43-9.4-6.64-9.4-12.68,0-7,6.44-12.68,17.75-12.68,2.7,0,5.83.44,8.09.96,1.13.29,2.35.44,3.04.44.78,1.77,1.57,5.9,1.57,9-.35.44-1.74.66-2.18.22-1.13-3.54-3.48-8.33-11.83-8.33s-10.35,4.79-10.35,8.18c0,4.28,4.18,7.38,7.39,9.07l6.96,3.69c5.48,2.88,10.88,7.15,10.88,14.16,0,8.11-7.22,13.64-18.53,13.64Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M689.99,138.78c-3.81,0-3.96.15-3.96,2.36v10.4c0,7.74.4,8.77,4.84,9.22l2.3.22c.48.29.32,1.62-.16,1.84-4.28-.15-6.98-.22-10.08-.22-3.41,0-6.11.15-9.2.22-.47-.22-.63-1.4-.16-1.84l1.35-.22c4.45-.74,4.6-1.48,4.6-9.22v-26.54c0-7.74-.55-8.99-4.68-9.29l-2.06-.15c-.48-.29-.32-1.62.16-1.84,3.89.07,6.58.22,10,.22,3.1,0,5.79-.07,9.2-.22.48.22.63,1.55.16,1.84l-1.51.15c-4.6.44-4.76,1.55-4.76,9.29v8.48c0,2.28.16,2.36,3.96,2.36h22.69c3.81,0,3.97-.07,3.97-2.36v-8.48c0-7.74-.16-8.85-4.84-9.29l-1.51-.15c-.48-.29-.32-1.62.16-1.84,3.65.15,6.35.22,9.6.22s5.79-.07,9.36-.22c.48.22.63,1.55.16,1.84l-1.66.15c-4.6.44-4.76,1.55-4.76,9.29v26.54c0,7.74.16,8.7,4.76,9.22l1.9.22c.47.29.32,1.62-.16,1.84-3.81-.15-6.51-.22-9.6-.22-3.25,0-6.11.07-9.6.22-.48-.22-.63-1.4-.16-1.84l1.51-.22c4.84-.74,4.84-1.48,4.84-9.22v-10.4c0-2.21-.16-2.36-3.97-2.36h-22.69Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M378.06,179.01c6.52-5.07,14.83-7.57,24.12-7.57,4.82,0,11.61.98,15.81,2.14,1.07.27,1.7.45,2.5.36.09,2.05.54,7.65,1.25,13.09-.45.62-1.79.71-2.41.18-1.34-6.05-5.36-13-18.31-13-13.67,0-25.28,8.64-25.28,27.06s11.88,29.02,26.53,29.02c11.52,0,16.62-7.48,18.67-12.73.63-.44,1.97-.27,2.32.36-.62,4.63-2.95,10.5-4.29,12.2-1.07.18-2.14.53-3.13.89-1.97.71-8.4,2.05-14.11,2.05-8.04,0-15.72-1.6-22.24-5.96-7.15-4.9-12.69-12.99-12.69-24.48,0-9.88,4.47-18.34,11.26-23.59Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M426.92,207.81c0-14.75,11.61-26.03,27.56-26.03,17.88,0,26.86,12.31,26.86,25.29,0,14.89-11.92,25.73-26.86,25.73-17.19,0-27.56-11.72-27.56-25ZM473.6,209.35c0-12.17-5.65-25.29-20.44-25.29-8.05,0-18.5,5.24-18.5,21.38,0,10.91,5.57,25.07,20.82,25.07,9.29,0,18.12-6.64,18.12-21.16Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M568.68,201.47c0-4.57-.16-13.05-1.49-15.26-.55-.89-1.95-1.4-3.91-1.55l-1.95-.15c-.47-.52-.31-1.47.15-1.77,2.97.15,5.86.22,8.91.22,3.28,0,5.39-.08,8.21-.22.62.37.55,1.33.16,1.77l-1.88.15c-1.95.15-3.44.81-3.91,1.77-1.09,2.43-1.09,10.91-1.09,15.04v8.33c0,6.42-1.1,13.2-5.47,17.62-3.36,3.47-9.14,5.38-14.93,5.38-5.39,0-10.79-.96-14.62-4.05-4.14-3.24-6.1-8.63-6.1-17.4v-17.4c0-7.67-.16-8.92-4.69-9.29l-1.96-.15c-.47-.29-.31-1.55.15-1.77,3.91.15,6.57.22,9.69.22s5.78-.08,9.61-.22c.47.22.63,1.47.16,1.77l-1.88.15c-4.53.37-4.69,1.62-4.69,9.29v15.93c0,11.87,3.91,19.69,15.87,19.69,11.33,0,15.63-8.41,15.63-19.61v-8.48Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M659.52,192.26c0-5.51-.35-6.93-4.23-7.22l-2.77-.27c-.31-.28-.48-1.78.09-1.82,4.67-.35,10.54-.59,18.57-.59,5.44,0,10.62.37,14.51,2.08,3.71,1.57,6.56,4.54,6.56,9.31,0,5.36-3.63,8.12-8.81,10.2,0,.75.69.97,1.64,1.12,4.67.74,11.58,4.47,11.58,12.44,0,8.64-7.43,14.45-22.98,14.45-2.5,0-6.74-.22-10.37-.22s-6.74.15-9.93.22c-.52-.22-.69-1.41-.17-1.86l1.55-.22c4.58-.67,4.75-1.49,4.75-9.31v-28.3ZM666.6,202.16c0,2.09.09,2.24,4.49,2.09,8.81-.3,13.56-2.53,13.56-9.53s-6.3-10.05-12.87-10.05c-1.9,0-3.2.15-3.97.45-.87.22-1.21.59-1.21,1.94v15.12ZM666.6,219.44c0,2.68.17,6.48,1.81,8.12,1.64,1.71,4.23,2.08,6.82,2.08,7.69,0,13.56-2.98,13.56-10.43,0-5.88-3.45-12.73-17.19-12.73-4.67,0-5.01.44-5.01,1.94v11.02Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M518.75,160.97l-2.05-.18c-.41-.04-.78-.1-1.13-.15-2.99-.53-4.19-3.2-5.6-5.67l-7.08-12.32c-1.22-2.05-2.53-4.82-5.33-5.21,7.25-.87,13.81-5.06,13.81-12.24,0-8.3-8.21-12.01-16.52-12.01-4.98,0-9.52.13-14.59.13-2.79,0-6.12-.13-8.92-.13-1.55,0-1.57.32-1.57,1.18,0,1.28.54.92,2.19,1.02,5.9.33,5.68,1.43,5.68,6.49v32.31c0,4.62.4,6-4.46,6.44,0,0-.74.08-1.17.12l-2.06.21c-.49.44-.33,1.62.16,1.84,1.09-.04,3.03-.12,3.03-.12,2.69-.08,5.38-.28,8.06-.28s5.29.21,7.95.29h0c.94.03,1.94.07,3.03.1.49-.22.66-1.4.16-1.84l-2.07-.2c-.42-.05-1.15-.11-1.15-.11-4.9-.33-4.6-1.71-4.6-6.46v-12.17c0-.71-.09-2.61.44-3.16.44-.48,1.22-.4,1.92-.4,6.64,0,6.55.63,9.7,6.16l8.56,15.4c.7,1.19,1.22,2.69,2.97,2.69h7.44c.94.03,1.92.06,3.01.1.49-.22.65-1.4.16-1.84ZM488.92,136.74c-1.49,0-4.46.55-4.46-1.42v-14.14c0-5.53.18-6.32,6.82-6.32,7.78,0,12.58,3.95,12.58,11.22,0,3.16-1.14,6.08-4.02,8.06-3.32,2.29-6.9,2.61-10.92,2.61Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("path", { d: "M490.53,194.2c0-7.74-.16-8.92-5.27-9.29l-2.03-.15c-.49-.3-.32-1.62.16-1.84,4.54.15,7.3.22,10.54.22s5.92-.07,9.98-.22c.49.22.65,1.55.16,1.84l-1.95.15c-4.78.37-4.95,1.55-4.95,9.29v25.66c0,4.64.24,6.56,1.7,7.96.89.81,2.43,1.7,8.84,1.7,6.89,0,8.6-.3,9.9-.96,1.62-.89,3.73-3.54,5.35-7.3.49-.37,2.03-.07,2.03.44,0,.81-2.27,8.33-3.41,10.32-4.13-.15-11.84-.22-20.2-.22h-7.46c-3.41,0-6,.07-10.54.22-.49-.22-.65-1.4-.16-1.84l2.43-.22c4.7-.44,4.87-1.48,4.87-9.22v-26.54Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M707.79,194.34c0-7.81-.16-9.07-4.86-9.44l-1.99-.15c-.48-.3-.32-1.62.16-1.84,3.98.15,6.69.22,10.03.22s5.89-.07,9.87-.22c.48.22.64,1.55.16,1.84l-1.99.15c-4.7.37-4.86,1.62-4.86,9.44v26.25c0,7.82.16,8.85,4.86,9.36l1.99.22c.48.3.32,1.62-.16,1.84-3.98-.15-6.69-.22-9.87-.22-3.35,0-6.05.07-10.03.22-.48-.22-.64-1.4-.16-1.84l1.99-.22c4.7-.52,4.86-1.55,4.86-9.36v-26.25Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M644.16,229.94c-.41-.04-1.17-.1-1.17-.1-.84-.08-1.59-.2-2.19-.86-1.03-1.1-.95-4.23-.95-5.48v-32.31c0-1.41-.34-4.46.69-5.56.52-.58,1.59-.67,2.55-.73h0c.58-.05.6-.05,1.11-.07l2.05-.15c.49-.3.33-1.62-.16-1.84-1.09.04-2.09.02-3.03.05h0s-8.7,0-8.7,0c-.95,0-1.81,0-2.32,1.02l-17.73,36.92-15.66-35.67c-.52-1.25-.6-2.27-2.24-2.27h-9.05c-.94-.03-1.98-.02-3.08-.06-.49.22-.66,1.55-.16,1.84l2.05.15c.42.03,1.19.09,1.19.09,3.4.22,3.61.98,3.3,4.55l-2.67,34.65c-.23,3.48-.42,5.32-4.07,5.66,0,0-.77.1-1.19.14l-2.04.22c-.49.44-.33,1.62.16,1.84,1.08-.04,3-.1,3-.1,1.85-.09,3.73-.25,5.61-.25,2.03,0,4.06.19,6.1.27h0c.94.03,1.94.07,3.03.1.49-.22.66-1.4.16-1.84l-2.04-.22c-.54-.04-1.14-.1-1.14-.1-5.26-.36-5.14-4.07-4.81-8.62l2.5-32.23h.6l16.95,39.66c.17.55.43,1.49,1.29,1.49.78,0,1.03-.86,1.29-1.41l19.1-40.68h.6v35.44c0,1.41.17,4.3-1.29,5.4-.76.57-3.25.91-3.25.91-.34.05-.7.1-1.11.15l-2.04.22c-.49.44-.33,1.62.16,1.84,1.08-.04,2.99-.1,2.99-.1,2.77-.08,5.59-.28,8.41-.28,2.03,0,6,.19,6,.19.95.03,2.02.13,3.12.17.49-.22.66-1.4.16-1.84l-2.05-.22Z", style: { fill: "#234075", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M777.13,230.14l-.28-.22c-.41-.04-.77-.09-1.11-.15-3.19-.71-4.43-4.55-5.61-7.29l-16.41-38.83c-.16-.47-.49-1.47-1.14-1.47-.89,0-1.14,1.08-1.38,1.7l-15.68,38.76c-.57,1.47-2.03,5.03-3.09,6.11-.81.83-1.86.99-2.99,1.1,0,0-.88.08-1.31.13l-1.93.2c-.49.44-.33,1.62.16,1.84,1.09-.04,3.03-.11,3.03-.11,2.14-.03,4.29-.3,6.44-.3,1.81,0,3.61.19,5.41.27,0,0,1.94.07,3.03.11.49-.22.65-1.4.16-1.84l-2.05-.22c-.41-.04-1.11-.11-1.11-.11-1.89-.21-4.24-.55-4.24-2.62,0-1.39.65-3.02,1.14-4.25l2.44-5.8c1.22-2.78.73-3.1,3.98-3.1h11.05c3.9,0,3.33,0,5.04,3.95l2.6,5.88c.41,1.01,1.14,2.71,1.14,3.79,0,1.94-2.12,2.07-4.11,2.24,0,0-.66.06-1.23.1l-1.97.14c-.49.44-.33,1.62.17,1.84,1.09-.04,3.03-.12,3.03-.12,2.31-.08,4.64-.26,6.87-.26,2.85,0,5.69.19,8.54.27h0c.93.03.14.06,1.22.1.49-.22.65-1.4.16-1.84ZM755.64,211.89h-9.57c-.33,0-3,.31-3-.47,0-.24.17-.7.25-.94l5.75-14.23c.17-.39.75-2.35,1.41-2.35.5,0,1.17,2.03,1.33,2.35l5.66,13.29c0,.16.58,1.41.58,1.72,0,.86-1.91.62-2.41.62Z", style: { fill: "#234075", strokeWidth: "0px" } })] }), jsxRuntime.jsx("rect", { width: "847.65", height: "327.01", style: { fill: "none", strokeWidth: "0px" } })] }), jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("polygon", { points: "295.89 176.17 301.27 178.4 313.19 170.08 295.89 176.17", style: { fill: "#e3a82b", strokeWidth: "0px" } }), jsxRuntime.jsx("path", { d: "M95.46,166.88l-14.14-4.97.71-1.73,15.92,5.31.07-.04,2.1-1.19.84-.53-17.36-7.39.73-1.82,38.75,15.67,1.28-.53-38.44-18.73.86-1.76,40.73,18.96.56-.29-39.49-22.4.81-1.68,57.03,31.03c.47-.86,1.44-2.44,1.95-3.28-21.68-20.39-42.61-35.69-42.61-35.69,0,0,21.52,14.41,48.07,27.81.88-1.09,1.6-1.97,2.53-3.01l-48.65-42.83,1.31-1.34,39.27,33.47-36.38-36.43,1.36-1.41,40.84,39.47-38.02-42.2,1.45-1.31,35.14,37.63-32.07-40.41,1.38-1.26,41.11,50.03c1.06-.92,1.95-1.61,3.06-2.46-12.44-26.91-26.02-48.8-26.02-48.8,0,0,14.46,21.28,33.96,43.56,1.19-.67,2.4-1.31,3.63-1.92l-.21-.13-28.81-57.5,1.71-.75,23.87,45.74-20.08-47.41,1.79-.8,23.08,51.9-19.45-53.37,1.84-.67,18.49,48.05-14.6-49.49,1.75-.65,19.22,61.38-.04.16.05-.02c1.28-.43,2.58-.81,3.89-1.16-1.46-29.48-5.82-54.7-5.82-54.7,0,0,5.4,25,15.08,52.87,1.35-.17,2.71-.31,4.07-.4l-.04-.06h.17l-.1-.14-5.17-64.11,1.87-.06,5,51.35-.86-51.48,1.96-.07,1.96,56.77,1.96-56.77,1.96.07-.86,51.48,5-51.35,1.87.06-5.17,64.11-.1.14h.03v.02s.07,0,.07,0c1.34.08,2.66.22,3.98.38,9.67-27.84,15.06-52.8,15.06-52.8,0,0-4.35,25.14-5.82,54.57,1.32.35,2.63.73,3.91,1.15l19.15-61.16,1.76.65-14.6,49.48,18.49-48.05,1.84.67-19.45,53.37,23.08-51.9,1.79.8-20.08,47.41,23.87-45.74,1.71.75-28.71,57.3.05.02c1.18.58,2.34,1.19,3.49,1.83,19.42-22.21,33.79-43.37,33.79-43.37,0,0-13.49,21.74-25.89,48.52,1.11.84,2.19,1.7,3.24,2.6l40.63-49.49,1.39,1.26-32.08,40.41,35.14-37.63,1.45,1.31-38.02,42.2,40.84-39.47,1.36,1.41-36.38,36.43,39.27-33.47,1.31,1.34-48.06,42.35.03.03c.84.94,1.65,1.9,2.44,2.88,26.39-13.34,47.71-27.62,47.71-27.62,0,0-20.72,15.16-42.29,35.4.59.99,1.55,2.67,2.09,3.69l56.22-30.61.81,1.69-44.88,25.45,46.68-21.72.86,1.76-43.48,21.19.83.29,44.24-17.89.74,1.82-41.12,17.49.77.32,27.4-9.13,4.13-2.88,1.37,1.05,9.02-3.01.71,1.73-7.8,2.75,11.27,8.6,3.61,2.01c-14.49-60.58-68.98-105.62-134-105.62s-121.42,46.63-134.73,108.82c.17-.08.34-.16.51-.24l1.65-.75,1.01-.47,19.01-10.66Z", style: { fill: "#e3a82b", strokeWidth: "0px" } })] }), jsxRuntime.jsx("path", { d: "M72.5,233.02s20.32-4.06,37.29-4.06c44.7,0,106.54,25.17,151.41,25.17,32.91,0,65.02-9.03,82.51-22.19,1.37-7.79,2.08-15.8,2.08-23.98,0-11.08-1.32-21.85-3.79-32.17l-18.7-10.43-21.95,15.39-14.76-5.75c-5,2.53-35.83,23.15-35.83,23.15l-11.84-8.57-12.7-2.51-16.93-12.33-19.42,13.33s-21.67,12.58-22.41,12.58-26.14-20.13-26.14-20.13l-11.7-12.33c-1.99,1.26-9.95,4.91-9.95,4.91l-.41.11-7.7-2.38-9.35-4.96-28.41,12.88c-.17.08-.34.16-.51.24-2,9.34-3.06,19.03-3.06,28.96,0,8.56.79,16.93,2.28,25.06Z", style: { fill: "#234075", strokeWidth: "0px" } })] })] }));
15993
15993
  }
15994
15994
 
15995
- var css_248z$d = ".bcds-footer {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n width: 100%;\n}\n\n.bcds-footer > .bcds-footer--acknowledgement {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-around;\n border-top: var(--layout-border-width-large) solid var(--theme-gold-60);\n border-bottom: var(--layout-border-width-large) solid var(--theme-gold-60);\n background-color: var(--theme-gray-110);\n padding: var(--layout-padding-xlarge);\n}\n\n.bcds-footer\n > .bcds-footer--acknowledgement\n > .bcds-footer--acknowledgement-text {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: stretch;\n color: var(--typography-color-primary-invert);\n font: var(--typography-regular-small-body);\n max-width: 1100px;\n width: 100%;\n}\n\n.bcds-footer\n > .bcds-footer--acknowledgement\n > .bcds-footer--acknowledgement-text\n > p {\n margin: var(--layout-margin-none);\n}\n\n.bcds-footer > .bcds-footer--container {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-around;\n background-color: var(--surface-color-background-light-gray);\n padding: var(--layout-padding-xlarge);\n}\n\n.bcds-footer > .bcds-footer--container > .bcds-footer--container-content {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: var(--layout-padding-xlarge);\n max-width: 1100px;\n width: 100%;\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links {\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n align-items: flex-start;\n column-gap: var(--layout-padding-xlarge);\n row-gap: var(--layout-padding-medium);\n justify-content: space-between;\n width: 100%;\n}\n\n/* `horizontal` class is the default, when no `children` prop is passed */\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links.horizontal {\n flex-direction: row;\n}\n\n/* `vertical` class is used when a `children` prop is passed */\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links.vertical {\n flex-direction: column;\n align-items: stretch;\n row-gap: var(--layout-padding-xlarge);\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--logo {\n display: flex;\n flex-direction: column;\n gap: var(--layout-padding-large);\n min-width: 324px;\n width: 576px;\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--logo\n > #bcgov-logo-footer {\n width: 146px;\n min-width: 146px;\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--logo\n > p {\n font: var(--typography-regular-small-body);\n margin: var(--layout-margin-none);\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--logo\n > p\n > a {\n color: var(--typography-color-secondary);\n font: var(--typography-regular-small-body);\n text-decoration: underline;\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--logo\n > p\n > a:hover {\n text-decoration: none;\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--links {\n margin: var(--layout-margin-none);\n}\n\n/*\n When Footer hasn't been passed `children`, expand the links container to take\n up 320px, as the default links are narrower.\n*/\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links.horizontal\n > .bcds-footer--links {\n min-width: 320px;\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--links\n > .bcds-footer--links-title {\n display: block;\n font: var(--typography-bold-small-body);\n margin-bottom: var(--layout-padding-medium);\n text-transform: uppercase;\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--links\n > ul {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n grid-template-rows: auto;\n grid-column-gap: var(--layout-padding-xlarge);\n grid-row-gap: var(--layout-padding-small);\n list-style: none;\n margin: var(--layout-margin-none);\n padding: var(--layout-padding-none);\n}\n\n/*\n When a Footer has been passed `children`, the logo-links container fills the\n full width of the container, so there's room for 4 columns of links.\n*/\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links.vertical\n > .bcds-footer--links\n > ul {\n grid-template-columns: repeat(4, 1fr);\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--links\n > ul\n > li {\n font: var(--typography-regular-small-body);\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--links\n > ul\n > li\n > a {\n color: var(--typography-color-primary);\n text-decoration: none;\n}\n\n.bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--links\n > ul\n > li\n > a:hover {\n text-decoration: underline;\n}\n\n.bcds-footer > .bcds-footer--container > .bcds-footer--container-content > hr {\n background-color: var(--surface-color-border-dark);\n border: var(--layout-border-width-none);\n height: var(--layout-border-width-small);\n margin: var(--layout-margin-none);\n width: 100%;\n}\n\np.bcds-footer--copyright {\n color: var(--typography-color-secondary);\n font: var(--typography-regular-body);\n margin: var(--layout-margin-none);\n}\n\n/* Tablet */\n@media (max-width: 991px) {\n /* Links drop beneath logo in the default configuration */\n .bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links {\n flex-wrap: wrap;\n }\n\n .bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--logo {\n max-width: 324px;\n }\n\n /*\n When the `children` prop is used with multiple FooterLinks components,\n only two columns of links appear on screen at once.\n */\n .bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links.vertical\n > .bcds-footer--links\n > ul {\n grid-template-columns: repeat(2, 1fr);\n }\n}\n\n/* Extra small screens */\n@media (max-width: 575px) {\n .bcds-footer > .bcds-footer--acknowledgement {\n padding: var(--layout-padding-xlarge) var(--layout-padding-medium);\n }\n\n .bcds-footer > .bcds-footer--container {\n padding: var(--layout-padding-medium);\n }\n\n .bcds-footer > .bcds-footer--container > .bcds-footer--container-content {\n gap: var(--layout-padding-medium);\n }\n\n .bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links\n > .bcds-footer--logo {\n gap: var(--layout-padding-medium);\n }\n\n /*\n When the `children` prop is used with multiple FooterLinks components,\n only one column of links appear on screen at once.\n */\n .bcds-footer\n > .bcds-footer--container\n > .bcds-footer--container-content\n > .bcds-footer--logo-links.vertical\n > .bcds-footer--links\n > ul {\n grid-template-columns: repeat(1, 1fr);\n }\n}\n";
15995
+ var css_248z$d = ".bcds-footer {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n width: 100%;\r\n}\r\n\r\n.bcds-footer > .bcds-footer--acknowledgement {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: space-around;\r\n border-top: var(--layout-border-width-large) solid var(--theme-gold-60);\r\n border-bottom: var(--layout-border-width-large) solid var(--theme-gold-60);\r\n background-color: var(--theme-gray-110);\r\n padding: var(--layout-padding-xlarge);\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--acknowledgement\r\n > .bcds-footer--acknowledgement-text {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: stretch;\r\n color: var(--typography-color-primary-invert);\r\n font: var(--typography-regular-small-body);\r\n max-width: 1100px;\r\n width: 100%;\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--acknowledgement\r\n > .bcds-footer--acknowledgement-text\r\n > p {\r\n margin: var(--layout-margin-none);\r\n}\r\n\r\n.bcds-footer > .bcds-footer--container {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: space-around;\r\n background-color: var(--surface-color-background-light-gray);\r\n padding: var(--layout-padding-xlarge);\r\n}\r\n\r\n.bcds-footer > .bcds-footer--container > .bcds-footer--container-content {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n gap: var(--layout-padding-xlarge);\r\n max-width: 1100px;\r\n width: 100%;\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links {\r\n display: flex;\r\n flex-direction: row;\r\n flex-wrap: nowrap;\r\n align-items: flex-start;\r\n column-gap: var(--layout-padding-xlarge);\r\n row-gap: var(--layout-padding-medium);\r\n justify-content: space-between;\r\n width: 100%;\r\n}\r\n\r\n/* `horizontal` class is the default, when no `children` prop is passed */\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links.horizontal {\r\n flex-direction: row;\r\n}\r\n\r\n/* `vertical` class is used when a `children` prop is passed */\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links.vertical {\r\n flex-direction: column;\r\n align-items: stretch;\r\n row-gap: var(--layout-padding-xlarge);\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--logo {\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--layout-padding-large);\r\n min-width: 324px;\r\n width: 576px;\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--logo\r\n > #bcgov-logo-footer {\r\n width: 146px;\r\n min-width: 146px;\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--logo\r\n > p {\r\n font: var(--typography-regular-small-body);\r\n margin: var(--layout-margin-none);\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--logo\r\n > p\r\n > a {\r\n color: var(--typography-color-secondary);\r\n font: var(--typography-regular-small-body);\r\n text-decoration: underline;\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--logo\r\n > p\r\n > a:hover {\r\n text-decoration: none;\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--links {\r\n margin: var(--layout-margin-none);\r\n}\r\n\r\n/*\r\n When Footer hasn't been passed `children`, expand the links container to take\r\n up 320px, as the default links are narrower.\r\n*/\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links.horizontal\r\n > .bcds-footer--links {\r\n min-width: 320px;\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--links\r\n > .bcds-footer--links-title {\r\n display: block;\r\n font: var(--typography-bold-small-body);\r\n margin-bottom: var(--layout-padding-medium);\r\n text-transform: uppercase;\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--links\r\n > ul {\r\n display: grid;\r\n grid-template-columns: repeat(2, 1fr);\r\n grid-template-rows: auto;\r\n grid-column-gap: var(--layout-padding-xlarge);\r\n grid-row-gap: var(--layout-padding-small);\r\n list-style: none;\r\n margin: var(--layout-margin-none);\r\n padding: var(--layout-padding-none);\r\n}\r\n\r\n/*\r\n When a Footer has been passed `children`, the logo-links container fills the\r\n full width of the container, so there's room for 4 columns of links.\r\n*/\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links.vertical\r\n > .bcds-footer--links\r\n > ul {\r\n grid-template-columns: repeat(4, 1fr);\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--links\r\n > ul\r\n > li {\r\n font: var(--typography-regular-small-body);\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--links\r\n > ul\r\n > li\r\n > a {\r\n color: var(--typography-color-primary);\r\n text-decoration: none;\r\n}\r\n\r\n.bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--links\r\n > ul\r\n > li\r\n > a:hover {\r\n text-decoration: underline;\r\n}\r\n\r\n.bcds-footer > .bcds-footer--container > .bcds-footer--container-content > hr {\r\n background-color: var(--surface-color-border-dark);\r\n border: var(--layout-border-width-none);\r\n height: var(--layout-border-width-small);\r\n margin: var(--layout-margin-none);\r\n width: 100%;\r\n}\r\n\r\np.bcds-footer--copyright {\r\n color: var(--typography-color-secondary);\r\n font: var(--typography-regular-body);\r\n margin: var(--layout-margin-none);\r\n}\r\n\r\n/* Tablet */\r\n@media (max-width: 991px) {\r\n /* Links drop beneath logo in the default configuration */\r\n .bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links {\r\n flex-wrap: wrap;\r\n }\r\n\r\n .bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--logo {\r\n max-width: 324px;\r\n }\r\n\r\n /*\r\n When the `children` prop is used with multiple FooterLinks components,\r\n only two columns of links appear on screen at once.\r\n */\r\n .bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links.vertical\r\n > .bcds-footer--links\r\n > ul {\r\n grid-template-columns: repeat(2, 1fr);\r\n }\r\n}\r\n\r\n/* Extra small screens */\r\n@media (max-width: 575px) {\r\n .bcds-footer > .bcds-footer--acknowledgement {\r\n padding: var(--layout-padding-xlarge) var(--layout-padding-medium);\r\n }\r\n\r\n .bcds-footer > .bcds-footer--container {\r\n padding: var(--layout-padding-medium);\r\n }\r\n\r\n .bcds-footer > .bcds-footer--container > .bcds-footer--container-content {\r\n gap: var(--layout-padding-medium);\r\n }\r\n\r\n .bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links\r\n > .bcds-footer--logo {\r\n gap: var(--layout-padding-medium);\r\n }\r\n\r\n /*\r\n When the `children` prop is used with multiple FooterLinks components,\r\n only one column of links appear on screen at once.\r\n */\r\n .bcds-footer\r\n > .bcds-footer--container\r\n > .bcds-footer--container-content\r\n > .bcds-footer--logo-links.vertical\r\n > .bcds-footer--links\r\n > ul {\r\n grid-template-columns: repeat(1, 1fr);\r\n }\r\n}\r\n";
15996
15996
  styleInject(css_248z$d);
15997
15997
 
15998
15998
  /**
@@ -16047,7 +16047,7 @@ function Form({ ...props }) {
16047
16047
  return jsxRuntime.jsx($d3e0e05bdfcf66bd$export$a7fed597f4b8afd8, { ...props });
16048
16048
  }
16049
16049
 
16050
- var css_248z$c = ".bcds-header {\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-around;\n background-color: var(--surface-color-forms-default);\n border-bottom-color: var(--surface-color-border-default);\n border-bottom-style: solid;\n border-bottom-width: var(--layout-border-width-small);\n min-height: 65px;\n padding: var(--layout-padding-none) var(--layout-padding-medium);\n width: 100%;\n}\n\n.bcds-header > .bcds-header--container {\n flex-grow: 1;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-padding-medium);\n max-width: 1100px;\n}\n\n.bcds-header > .bcds-header--container > .bcds-header--title {\n flex-grow: 1;\n font: var(--typography-bold-h4);\n color: var(--typography-color-primary);\n}\n\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks {\n list-style: none;\n margin: 0;\n padding: 0;\n position: absolute;\n}\n\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks li a,\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks li button {\n background-color: var(--surface-color-forms-default);\n box-sizing: border-box;\n color: var(--typography-color-link);\n font: var(--typography-regular-body);\n margin-top: -17.5px; /* Center the link visually in a single line-height header */\n padding: var(--layout-padding-xsmall) var(--layout-padding-medium);\n position: absolute;\n margin-left: -100000px;\n}\n\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks li a:focus,\n.bcds-header\n > .bcds-header--container\n > ul.bcds-header--skiplinks\n li\n button:focus {\n margin-left: 0; /* Line up left edge with left edge of logo image */\n text-wrap: nowrap;\n}\n\n.bcds-header > .bcds-header--container > .bcds-header--line {\n background-color: var(--surface-color-border-default);\n width: 1px;\n height: 32px;\n}\n\n.bcds-header > .bcds-header--container svg#bcgov-logo-header {\n min-width: 129px;\n width: 129px;\n}\n";
16050
+ var css_248z$c = ".bcds-header {\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n justify-content: space-around;\r\n background-color: var(--surface-color-forms-default);\r\n border-bottom-color: var(--surface-color-border-default);\r\n border-bottom-style: solid;\r\n border-bottom-width: var(--layout-border-width-small);\r\n min-height: 65px;\r\n padding: var(--layout-padding-none) var(--layout-padding-medium);\r\n width: 100%;\r\n}\r\n\r\n.bcds-header > .bcds-header--container {\r\n flex-grow: 1;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: var(--layout-padding-medium);\r\n max-width: 1100px;\r\n}\r\n\r\n.bcds-header > .bcds-header--container > .bcds-header--title {\r\n flex-grow: 1;\r\n font: var(--typography-bold-h4);\r\n color: var(--typography-color-primary);\r\n}\r\n\r\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n position: absolute;\r\n}\r\n\r\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks li a,\r\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks li button {\r\n background-color: var(--surface-color-forms-default);\r\n box-sizing: border-box;\r\n color: var(--typography-color-link);\r\n font: var(--typography-regular-body);\r\n margin-top: -17.5px; /* Center the link visually in a single line-height header */\r\n padding: var(--layout-padding-xsmall) var(--layout-padding-medium);\r\n position: absolute;\r\n margin-left: -100000px;\r\n}\r\n\r\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks li a:focus,\r\n.bcds-header\r\n > .bcds-header--container\r\n > ul.bcds-header--skiplinks\r\n li\r\n button:focus {\r\n margin-left: 0; /* Line up left edge with left edge of logo image */\r\n text-wrap: nowrap;\r\n}\r\n\r\n.bcds-header > .bcds-header--container > .bcds-header--line {\r\n background-color: var(--surface-color-border-default);\r\n width: 1px;\r\n height: 32px;\r\n}\r\n\r\n.bcds-header > .bcds-header--container svg#bcgov-logo-header {\r\n min-width: 129px;\r\n width: 129px;\r\n}\r\n";
16051
16051
  styleInject(css_248z$c);
16052
16052
 
16053
16053
  function Header({ children, logoLinkElement, logoImage = jsxRuntime.jsx(SvgBcLogo, { id: "bcgov-logo-header" }), skipLinks, title = "", titleElement = "span", }) {
@@ -16081,7 +16081,7 @@ function Header({ children, logoLinkElement, logoImage = jsxRuntime.jsx(SvgBcLog
16081
16081
  }) })), title && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "bcds-header--line" }), getTitle()] })), children] }) }));
16082
16082
  }
16083
16083
 
16084
- var css_248z$b = ".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/* Closeable */\n.bcds-Inline-Alert.closeable {\n /*\n Because the close icon button is removed from the document flow, we\n manually adjust the padding to push the `--container` element off the right\n edge of the InlineAlert.\n */\n padding: var(--layout-padding-medium) 52px var(--layout-padding-medium)\n var(--layout-padding-large);\n}\n\n.bcds-Inline-Alert--closeIcon {\n align-self: first baseline;\n color: var(--icons-color-primary);\n position: relative;\n}\n\n.bcds-Inline-Alert--closeIcon > button {\n position: absolute;\n /*\n Centers the button vertically.\n Button height (32px) minus line-height of text (27px) divided by 2.\n */\n top: -2.5px;\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\n/* Button group */\n.bcds-Inline-Alert--container > .bcds-ButtonGroup {\n padding-top: var(--layout-padding-small);\n}\n";
16084
+ var css_248z$b = ".bcds-Inline-Alert {\r\n display: flex;\r\n flex-direction: row;\r\n align-items: flex-start;\r\n gap: var(--layout-margin-small);\r\n padding: var(--layout-padding-medium) var(--layout-padding-large);\r\n}\r\n\r\n/* Alert content */\r\n.bcds-Inline-Alert--container {\r\n display: flex;\r\n flex-direction: column;\r\n flex-grow: 1;\r\n}\r\n\r\n.bcds-Inline-Alert--container > .title {\r\n font: var(--typography-bold-body);\r\n color: var(--typography-color-primary);\r\n}\r\n\r\n.bcds-Inline-Alert--container > .description {\r\n font: var(--typography-regular-body);\r\n color: var(--typography-color-primary);\r\n}\r\n\r\n/* Left icon */\r\n.bcds-Inline-Alert--icon {\r\n display: inline-flex;\r\n align-self: flex-start;\r\n padding-top: var(--layout-padding-xsmall);\r\n}\r\n\r\n.bcds-Inline-Alert--icon > svg {\r\n min-width: var(--icons-size-medium);\r\n height: var(--icons-size-medium);\r\n}\r\n\r\n/* Closeable */\r\n.bcds-Inline-Alert.closeable {\r\n /*\r\n Because the close icon button is removed from the document flow, we\r\n manually adjust the padding to push the `--container` element off the right\r\n edge of the InlineAlert.\r\n */\r\n padding: var(--layout-padding-medium) 52px var(--layout-padding-medium)\r\n var(--layout-padding-large);\r\n}\r\n\r\n.bcds-Inline-Alert--closeIcon {\r\n align-self: first baseline;\r\n color: var(--icons-color-primary);\r\n position: relative;\r\n}\r\n\r\n.bcds-Inline-Alert--closeIcon > button {\r\n position: absolute;\r\n /*\r\n Centers the button vertically.\r\n Button height (32px) minus line-height of text (27px) divided by 2.\r\n */\r\n top: -2.5px;\r\n}\r\n\r\n.bcds-Inline-Alert--closeIcon > svg {\r\n min-width: var(--icons-size-medium);\r\n height: var(--icons-size-medium);\r\n}\r\n\r\n/* Info variant */\r\n.bcds-Inline-Alert.info {\r\n background-color: var(--support-surface-color-info);\r\n border: var(--layout-border-width-small) solid\r\n var(--support-border-color-info);\r\n border-radius: var(--layout-border-radius-medium);\r\n}\r\n\r\n.bcds-Inline-Alert.info > .bcds-Inline-Alert--icon {\r\n color: var(--icons-color-info);\r\n}\r\n\r\n/* Success variant */\r\n.bcds-Inline-Alert.success {\r\n background-color: var(--suport-surface-color-success);\r\n border: var(--layout-border-width-small) solid\r\n var(--support-border-color-success);\r\n border-radius: var(--layout-border-radius-medium);\r\n}\r\n\r\n.bcds-Inline-Alert.success > .bcds-Inline-Alert--icon {\r\n color: var(--icons-color-success);\r\n}\r\n\r\n/* Warning variant */\r\n.bcds-Inline-Alert.warning {\r\n background-color: var(--support-surface-color-warning);\r\n border: var(--layout-border-width-small) solid\r\n var(--support-border-color-warning);\r\n border-radius: var(--layout-border-radius-medium);\r\n}\r\n\r\n.bcds-Inline-Alert.warning > .bcds-Inline-Alert--icon {\r\n color: var(--icons-color-warning);\r\n}\r\n\r\n/* Danger variant */\r\n.bcds-Inline-Alert.danger {\r\n background-color: var(--support-surface-color-danger);\r\n border: var(--layout-border-width-small) solid\r\n var(--support-border-color-danger);\r\n border-radius: var(--layout-border-radius-medium);\r\n}\r\n\r\n.bcds-Inline-Alert.danger > .bcds-Inline-Alert--icon {\r\n color: var(--icons-color-danger);\r\n}\r\n\r\n/* Button group */\r\n.bcds-Inline-Alert--container > .bcds-ButtonGroup {\r\n padding-top: var(--layout-padding-small);\r\n}\r\n";
16085
16085
  styleInject(css_248z$b);
16086
16086
 
16087
16087
  function getIcon(variant) {
@@ -16102,28 +16102,28 @@ function InlineAlert({ variant = "info", title, description, isIconHidden = fals
16102
16102
  return (jsxRuntime.jsxs("div", { className: `bcds-Inline-Alert ${variant} ${isCloseable ? "closeable" : null}`, ...props, children: [!isIconHidden && (jsxRuntime.jsx("span", { className: "bcds-Inline-Alert--icon", children: getIcon(variant) })), jsxRuntime.jsx("div", { className: "bcds-Inline-Alert--container", role: role, "aria-labelledby": "alert-title", children: children ? (children) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [title && (jsxRuntime.jsx("span", { className: "title", id: "alert-title", children: title })), description && jsxRuntime.jsx("span", { className: "description", children: description }), buttons && (jsxRuntime.jsx(ButtonGroup, { alignment: "end", orientation: "horizontal", children: buttons }))] })) }), isCloseable && (jsxRuntime.jsx("span", { className: "bcds-Inline-Alert--closeIcon", children: jsxRuntime.jsx(Button, { variant: "tertiary", isIconButton: true, size: "small", "aria-label": "Close this alert", type: "button", onPress: onClose, children: jsxRuntime.jsx(SvgCloseIcon, {}) }) }))] }));
16103
16103
  }
16104
16104
 
16105
- var css_248z$a = "/* Styles for overlay element */\n.react-aria-ModalOverlay:has(.bcds-react-aria-Modal) {\n position: fixed;\n inset: 0;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: var(--layout-margin-small);\n background: var(--surface-color-overlay-default);\n height: 100vh;\n width: 100vw;\n z-index: 1000;\n}\n.react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-entering] {\n animation: modal-fade 200ms;\n}\n.react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-exiting] {\n animation: modal-fade 150ms reverse ease-in;\n}\n@media (prefers-reduced-motion) {\n /* Don't animate modal fade in/out if prefers-reduced-motion is on */\n .react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-entering] {\n animation: unset;\n }\n .react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-exiting] {\n animation: unset;\n }\n}\n\n@keyframes modal-fade {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n/* Styles for content container */\n.bcds-react-aria-Modal {\n box-sizing: border-box;\n max-width: 100vw;\n width: 600px;\n max-height: 100vh;\n min-height: var(--layout-margin-xxxlarge);\n height: auto;\n margin: var(--layout-margin-large);\n border-radius: var(--layout-border-radius-medium);\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n background: var(--surface-color-forms-default);\n box-shadow: var(--surface-shadow-large);\n}\n";
16105
+ var css_248z$a = "/* Styles for overlay element */\r\n.react-aria-ModalOverlay:has(.bcds-react-aria-Modal) {\r\n position: fixed;\r\n inset: 0;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n gap: var(--layout-margin-small);\r\n background: var(--surface-color-overlay-default);\r\n height: 100vh;\r\n width: 100vw;\r\n z-index: 1000;\r\n}\r\n.react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-entering] {\r\n animation: modal-fade 200ms;\r\n}\r\n.react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-exiting] {\r\n animation: modal-fade 150ms reverse ease-in;\r\n}\r\n@media (prefers-reduced-motion) {\r\n /* Don't animate modal fade in/out if prefers-reduced-motion is on */\r\n .react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-entering] {\r\n animation: unset;\r\n }\r\n .react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-exiting] {\r\n animation: unset;\r\n }\r\n}\r\n\r\n@keyframes modal-fade {\r\n from {\r\n opacity: 0;\r\n }\r\n\r\n to {\r\n opacity: 1;\r\n }\r\n}\r\n\r\n/* Styles for content container */\r\n.bcds-react-aria-Modal {\r\n box-sizing: border-box;\r\n max-width: 100vw;\r\n width: 600px;\r\n max-height: 100vh;\r\n min-height: var(--layout-margin-xxxlarge);\r\n height: auto;\r\n margin: var(--layout-margin-large);\r\n border-radius: var(--layout-border-radius-medium);\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-default);\r\n background: var(--surface-color-forms-default);\r\n box-shadow: var(--surface-shadow-large);\r\n}\r\n";
16106
16106
  styleInject(css_248z$a);
16107
16107
 
16108
16108
  function Modal({ children, ...props }) {
16109
16109
  return (jsxRuntime.jsx($f3f84453ead64de5$export$2b77a92f1a5ad772, { className: "bcds-react-aria-Modal", ...props, children: children }));
16110
16110
  }
16111
16111
 
16112
- var css_248z$9 = ".bcds-react-aria-Radio {\n cursor: pointer;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-margin-small);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n forced-color-adjust: none;\n}\n\n/* Selector */\n.bcds-react-aria-Radio:before {\n align-self: first baseline;\n margin-top: var(--layout-margin-xsmall);\n content: \"\";\n display: block;\n width: var(--icons-size-xsmall);\n height: var(--icons-size-xsmall);\n box-sizing: border-box;\n background-color: var(--surface-color-secondary-default);\n border-radius: var(--icons-size-small);\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-medium);\n transition: all 200ms;\n}\n@media (prefers-reduced-motion) {\n .bcds-react-aria-Radio:before {\n /* No animation on radio button circle if user has reduced motion set */\n transition: none;\n }\n}\n\n/* Hover */\n.bcds-react-aria-Radio[data-hovered]:before {\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-dark);\n}\n\n/* Pressed */\n.bcds-react-aria-Radio[data-pressed]:before {\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-dark);\n}\n\n/* Selected */\n.bcds-react-aria-Radio[data-selected]:before {\n border: 5px solid var(--surface-color-primary-default);\n}\n\n/* Focused */\n.bcds-react-aria-Radio[data-focus-visible]:before {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Invalid */\n.bcds-react-aria-Radio[data-invalid]:before {\n border: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n}\n.bcds-react-aria-Radio[data-selected][data-invalid] {\n color: var(--typography-color-danger);\n}\n.bcds-react-aria-Radio[data-selected][data-invalid]:before {\n border: 5px solid var(--support-border-color-danger);\n}\n\n/* Disabled */\n.bcds-react-aria-Radio[data-disabled] {\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n.bcds-react-aria-radio[data-selected][data-disabled]:before {\n border: 5px solid var(--surface-color-border-default);\n}\n\n/* Read only */\n.bcds-react-aria-Radio[data-readonly] {\n cursor: not-allowed;\n}\n";
16112
+ var css_248z$9 = ".bcds-react-aria-Radio {\r\n cursor: pointer;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: var(--layout-margin-small);\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-secondary);\r\n forced-color-adjust: none;\r\n}\r\n\r\n/* Selector */\r\n.bcds-react-aria-Radio:before {\r\n align-self: first baseline;\r\n margin-top: var(--layout-margin-xsmall);\r\n content: \"\";\r\n display: block;\r\n width: var(--icons-size-xsmall);\r\n height: var(--icons-size-xsmall);\r\n box-sizing: border-box;\r\n background-color: var(--surface-color-secondary-default);\r\n border-radius: var(--icons-size-small);\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-medium);\r\n transition: all 200ms;\r\n}\r\n@media (prefers-reduced-motion) {\r\n .bcds-react-aria-Radio:before {\r\n /* No animation on radio button circle if user has reduced motion set */\r\n transition: none;\r\n }\r\n}\r\n\r\n/* Hover */\r\n.bcds-react-aria-Radio[data-hovered]:before {\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-dark);\r\n}\r\n\r\n/* Pressed */\r\n.bcds-react-aria-Radio[data-pressed]:before {\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-dark);\r\n}\r\n\r\n/* Selected */\r\n.bcds-react-aria-Radio[data-selected]:before {\r\n border: 5px solid var(--surface-color-primary-default);\r\n}\r\n\r\n/* Focused */\r\n.bcds-react-aria-Radio[data-focus-visible]:before {\r\n outline: solid var(--layout-border-width-medium)\r\n var(--surface-color-border-active);\r\n outline-offset: var(--layout-margin-hair);\r\n}\r\n\r\n/* Invalid */\r\n.bcds-react-aria-Radio[data-invalid]:before {\r\n border: var(--layout-border-width-small) solid\r\n var(--support-border-color-danger);\r\n}\r\n.bcds-react-aria-Radio[data-selected][data-invalid] {\r\n color: var(--typography-color-danger);\r\n}\r\n.bcds-react-aria-Radio[data-selected][data-invalid]:before {\r\n border: 5px solid var(--support-border-color-danger);\r\n}\r\n\r\n/* Disabled */\r\n.bcds-react-aria-Radio[data-disabled] {\r\n color: var(--typography-color-disabled);\r\n cursor: not-allowed;\r\n}\r\n.bcds-react-aria-radio[data-selected][data-disabled]:before {\r\n border: 5px solid var(--surface-color-border-default);\r\n}\r\n\r\n/* Read only */\r\n.bcds-react-aria-Radio[data-readonly] {\r\n cursor: not-allowed;\r\n}\r\n";
16113
16113
  styleInject(css_248z$9);
16114
16114
 
16115
16115
  function Radio({ value, children, ...props }) {
16116
16116
  return (jsxRuntime.jsx($b6c3ddc6086f204d$export$d7b12c4107be0d61, { className: "bcds-react-aria-Radio", value: value, ...props, children: children }));
16117
16117
  }
16118
16118
 
16119
- var css_248z$8 = ".bcds-react-aria-RadioGroup {\n display: flex;\n flex-direction: column;\n gap: var(--layout-margin-small);\n}\n\n/* Orientation */\n.bcds-react-aria-RadioGroup--options {\n display: inline-flex;\n}\n\n.bcds-react-aria-RadioGroup--options.vertical {\n flex-direction: column;\n gap: var(--layout-margin-small);\n}\n\n.bcds-react-aria-RadioGroup--options.horizontal {\n flex-direction: row;\n gap: var(--layout-margin-medium);\n}\n.bcds-react-aria-RadioGroup--options.horizontal.flex-wrap-nowrap {\n flex-wrap: nowrap;\n}\n.bcds-react-aria-RadioGroup--options.horizontal.flex-wrap-wrap {\n flex-wrap: wrap;\n}\n.bcds-react-aria-RadioGroup--options.horizontal.flex-wrap-nowrap {\n flex-wrap: wrap-reverse;\n}\n\n/* Parts */\n.bcds-react-aria-RadioGroup--label {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-primary);\n}\n\n.bcds-react-aria-RadioGroup--description {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n}\n\n.bcds-react-aria-RadioGroup--error {\n display: inline-flex;\n flex-direction: row;\n gap: var(--layout-margin-xsmall);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n";
16119
+ var css_248z$8 = ".bcds-react-aria-RadioGroup {\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--layout-margin-small);\r\n}\r\n\r\n/* Orientation */\r\n.bcds-react-aria-RadioGroup--options {\r\n display: inline-flex;\r\n}\r\n\r\n.bcds-react-aria-RadioGroup--options.vertical {\r\n flex-direction: column;\r\n gap: var(--layout-margin-small);\r\n}\r\n\r\n.bcds-react-aria-RadioGroup--options.horizontal {\r\n flex-direction: row;\r\n gap: var(--layout-margin-medium);\r\n}\r\n.bcds-react-aria-RadioGroup--options.horizontal.flex-wrap-nowrap {\r\n flex-wrap: nowrap;\r\n}\r\n.bcds-react-aria-RadioGroup--options.horizontal.flex-wrap-wrap {\r\n flex-wrap: wrap;\r\n}\r\n.bcds-react-aria-RadioGroup--options.horizontal.flex-wrap-nowrap {\r\n flex-wrap: wrap-reverse;\r\n}\r\n\r\n/* Parts */\r\n.bcds-react-aria-RadioGroup--label {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-primary);\r\n}\r\n\r\n.bcds-react-aria-RadioGroup--description {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-secondary);\r\n}\r\n\r\n.bcds-react-aria-RadioGroup--error {\r\n display: inline-flex;\r\n flex-direction: row;\r\n gap: var(--layout-margin-xsmall);\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-danger);\r\n}\r\n";
16120
16120
  styleInject(css_248z$8);
16121
16121
 
16122
16122
  function RadioGroup({ orientation = "vertical", label, description, children, errorMessage, flexWrap = "nowrap", ...props }) {
16123
16123
  return (jsxRuntime.jsx($b6c3ddc6086f204d$export$a98f0dcb43a68a25, { className: "bcds-react-aria-RadioGroup", ...props, children: ({ isRequired, isInvalid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [label && (jsxRuntime.jsxs($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-RadioGroup--label", children: [label, " ", isRequired && "(required)"] })), jsxRuntime.jsx("div", { className: `bcds-react-aria-RadioGroup--options ${orientation} flex-wrap-${flexWrap}`, children: children }), description && (jsxRuntime.jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-RadioGroup--description", children: description })), isInvalid && (jsxRuntime.jsxs("div", { className: "bcds-react-aria-RadioGroup--error", children: [jsxRuntime.jsx(SvgExclamationIcon, {}), jsxRuntime.jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { children: errorMessage })] }))] })) }));
16124
16124
  }
16125
16125
 
16126
- var css_248z$7 = ".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/* Error icon */\n.bcds-react-aria-Select[data-invalid]\n > .bcds-react-aria-Select--Button\n > svg:not(:last-child) {\n color: var(--icons-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-padding-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-padding-hair) var(--layout-padding-small);\n}\n\n/* ListBox option item */\n.bcds-react-aria-Select--ListBoxItem {\n border-radius: var(--layout-border-radius-medium);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-margin-small);\n padding: 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";
16126
+ var css_248z$7 = ".bcds-react-aria-Select {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-start;\r\n /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\r\n max-width: -moz-available;\r\n max-width: -webkit-fill-available;\r\n}\r\n\r\n/* Label above select input */\r\n.bcds-react-aria-Select--Label {\r\n color: var(--typography-color-secondary);\r\n font: var(--typography-regular-small-body);\r\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\r\n}\r\n.bcds-react-aria-Select[data-disabled] > .bcds-react-aria-Select--Label {\r\n color: var(--typography-color-disabled);\r\n}\r\n\r\n/* Text description below select input */\r\n.bcds-react-aria-Select--Description {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-secondary);\r\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\r\n}\r\n\r\n/* Error message */\r\n.bcds-react-aria-Select--Error {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-danger);\r\n}\r\n\r\n/* Error icon */\r\n.bcds-react-aria-Select[data-invalid]\r\n > .bcds-react-aria-Select--Button\r\n > svg:not(:last-child) {\r\n color: var(--icons-color-danger);\r\n}\r\n\r\n/* Select input equivalent */\r\n.bcds-react-aria-Select--Button {\r\n background-color: var(--surface-color-forms-default);\r\n border: 1px solid var(--surface-color-border-default);\r\n border-radius: var(--layout-border-radius-medium);\r\n cursor: pointer;\r\n display: flex;\r\n justify-content: space-between;\r\n gap: var(--layout-margin-small);\r\n align-items: center;\r\n padding: 0 12px;\r\n max-width: 100%;\r\n}\r\n.bcds-react-aria-Select--Button.invalid {\r\n border-color: var(--support-border-color-danger);\r\n}\r\n.bcds-react-aria-Select[data-invalid] > .bcds-react-aria-Select--Button {\r\n border-color: var(--support-border-color-danger);\r\n}\r\n.bcds-react-aria-Select--Button[data-disabled] {\r\n background-color: var(--surface-color-forms-disabled);\r\n cursor: not-allowed;\r\n}\r\n.bcds-react-aria-Select--Button[data-hovered] {\r\n border-color: var(--surface-color-border-dark);\r\n}\r\n.bcds-react-aria-Select--Button[data-focused] {\r\n border-color: var(--surface-color-border-active);\r\n outline: solid var(--layout-border-width-medium)\r\n var(--surface-color-border-active);\r\n outline-offset: var(--layout-margin-hair);\r\n}\r\n.bcds-react-aria-Select--Button[data-pressed] {\r\n border-color: var(--surface-color-border-active);\r\n}\r\n.bcds-react-aria-Select--Button.medium {\r\n height: 40px;\r\n}\r\n.bcds-react-aria-Select--Button.small {\r\n height: 32px;\r\n}\r\n.bcds-react-aria-Select--Button > .bcds-react-aria-SelectValue {\r\n font: var(--typography-regular-body);\r\n overflow: hidden;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n min-width: 0;\r\n}\r\n.bcds-react-aria-Select--Button > svg {\r\n flex-shrink: 0;\r\n}\r\n\r\n/* Dropdown menu panel */\r\n.bcds-react-aria-Select--Popover {\r\n background-color: var(--surface-color-forms-default);\r\n border: 1px solid var(--surface-color-border-default);\r\n border-radius: var(--layout-border-radius-medium);\r\n box-shadow: var(--surface-shadow-medium);\r\n box-sizing: border-box;\r\n overflow-y: auto;\r\n padding: var(--layout-padding-hair) var(--layout-padding-xsmall);\r\n width: var(\r\n --trigger-width\r\n ); /* Variable provided by Select component https://react-spectrum.adobe.com/react-aria/Select.html#popover-1 */\r\n}\r\n.bcds-react-aria-Select--ListBox[data-focused] {\r\n outline: none;\r\n}\r\n.bcds-react-aria-Select--ListBox > .bcds-react-aria-Section:not(:first-child) {\r\n border-top: 1px solid var(--surface-color-border-default);\r\n margin-top: 1px;\r\n padding-top: 2px;\r\n}\r\n\r\n/* Header label within Section of multi-section Select */\r\n.bcds-react-aria-Select--Header {\r\n color: var(--typography-color-secondary);\r\n font: var(--typography-regular-small-body);\r\n padding: var(--layout-padding-hair) var(--layout-padding-small);\r\n}\r\n\r\n/* ListBox option item */\r\n.bcds-react-aria-Select--ListBoxItem {\r\n border-radius: var(--layout-border-radius-medium);\r\n cursor: pointer;\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: var(--layout-margin-small);\r\n padding: var(--layout-padding-small);\r\n}\r\n.bcds-react-aria-Select--ListBoxItem[data-focused],\r\n.bcds-react-aria-Select--ListBoxItem[data-hovered] {\r\n background-color: var(--surface-color-secondary-button-hover);\r\n outline: none;\r\n}\r\n.bcds-react-aria-Select--ListBoxItem-icon {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-around;\r\n /* This `min-width` rule can cause horizontal overflow on very narrow Select\r\n instances, but if we leave it out, the icons will shrink instead. */\r\n min-width: 20px;\r\n}\r\n.bcds-react-aria-Select--ListBoxItem-Text-container {\r\n color: var(--typography-color-primary);\r\n display: flex;\r\n flex-direction: column;\r\n flex-grow: 1;\r\n}\r\n.bcds-react-aria-Select--ListBoxItem-Text-label {\r\n font: var(--typography-regular-body);\r\n}\r\n.bcds-react-aria-Select--ListBoxItem.destructive {\r\n color: var(--surface-color-primary-danger-button-default);\r\n}\r\n.bcds-react-aria-Select--ListBoxItem.destructive\r\n .bcds-react-aria-Select--ListBoxItem-Text-label {\r\n color: var(--surface-color-primary-danger-button-default);\r\n}\r\n.bcds-react-aria-Select--ListBoxItem-Text-description {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-secondary);\r\n}\r\n";
16127
16127
  styleInject(css_248z$7);
16128
16128
 
16129
16129
  /** Select displays a collapsible list of options and allows a user to select one of them. */
@@ -16159,28 +16159,28 @@ function SvgTooltipArrowUp({ id = "tooltip-arrow" }) {
16159
16159
  return (jsxRuntime.jsx("svg", { id: id, width: "19", height: "9", viewBox: "0 0 19 9", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("g", { children: jsxRuntime.jsx("path", { d: "M8.4188 1.41421C9.19985 0.633163 10.4662 0.633165 11.2472 1.41421L18.833 9L0.833008 9L8.4188 1.41421Z", fill: "currentColor" }) }) }));
16160
16160
  }
16161
16161
 
16162
- var css_248z$6 = ".bcds-react-aria-Tag {\n color: var(--typography-color-primary);\n cursor: pointer;\n border: var(--layout-border-width-small) solid;\n display: flex;\n align-items: center;\n font: var(--typography-regular-label);\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/* Tag style */\n.bcds-react-aria-Tag.rectangular {\n border-radius: var(--layout-border-radius-small);\n}\n.bcds-react-aria-Tag.circular {\n border-radius: var(--layout-borderRadius-Circular, 9999px);\n}\n\n/* Tag size */\n.bcds-react-aria-Tag.medium {\n height: var(--layout-padding-xlarge);\n padding: var(--layout-padding-hair) var(--layout-padding-medium);\n gap: var(--layout-margin-medium);\n}\n.bcds-react-aria-Tag.small {\n height: var(--layout-padding-large);\n padding: var(--layout-padding-hair) var(--layout-padding-small);\n gap: var(--layout-margin-small);\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";
16162
+ var css_248z$6 = ".bcds-react-aria-Tag {\r\n color: var(--typography-color-primary);\r\n cursor: pointer;\r\n border: var(--layout-border-width-small) solid;\r\n display: flex;\r\n align-items: center;\r\n font: var(--typography-regular-label);\r\n width: fit-content;\r\n}\r\n.bcds-react-aria-Tag .react-aria-Button {\r\n background: none;\r\n border: none;\r\n color: var(--typography-color-primary);\r\n cursor: pointer;\r\n display: flex;\r\n margin: 0;\r\n padding: 0;\r\n}\r\n\r\n/* Tag colors */\r\n.bcds-react-aria-Tag.bc-blue {\r\n background-color: var(--theme-primary-blue);\r\n border-color: var(--theme-blue-90);\r\n color: var(--typography-color-primary-invert);\r\n}\r\n.bcds-react-aria-Tag.bc-blue .react-aria-Button {\r\n color: var(--typography-color-primary-invert);\r\n}\r\n.bcds-react-aria-Tag.bc-gold {\r\n background-color: var(--theme-primary-gold);\r\n border-color: var(--theme-blue-90);\r\n}\r\n.bcds-react-aria-Tag.blue {\r\n background-color: var(--support-surface-color-info);\r\n border-color: var(--support-border-color-info);\r\n}\r\n.bcds-react-aria-Tag.dark {\r\n background: var(--theme-gray-110);\r\n border-color: var(--theme-blue-90);\r\n color: var(--typography-color-primary-invert);\r\n}\r\n.bcds-react-aria-Tag.dark .react-aria-Button {\r\n color: var(--typography-color-primary-invert);\r\n}\r\n.bcds-react-aria-Tag.gray,\r\n.bcds-react-aria-Tag.grey {\r\n background-color: var(--theme-gray-20);\r\n border-color: var(--surface-color-border-dark);\r\n}\r\n.bcds-react-aria-Tag.green {\r\n background-color: var(--support-surface-color-success);\r\n border-color: var(--support-border-color-success);\r\n}\r\n.bcds-react-aria-Tag.red {\r\n background-color: var(--support-surface-color-danger);\r\n border-color: var(--support-border-color-danger);\r\n}\r\n.bcds-react-aria-Tag.yellow {\r\n background-color: var(--support-surface-color-warning);\r\n border-color: var(--support-border-color-warning);\r\n}\r\n\r\n/* Tag style */\r\n.bcds-react-aria-Tag.rectangular {\r\n border-radius: var(--layout-border-radius-small);\r\n}\r\n.bcds-react-aria-Tag.circular {\r\n border-radius: var(--layout-borderRadius-Circular, 9999px);\r\n}\r\n\r\n/* Tag size */\r\n.bcds-react-aria-Tag.medium {\r\n height: var(--layout-padding-xlarge);\r\n padding: var(--layout-padding-hair) var(--layout-padding-medium);\r\n gap: var(--layout-margin-medium);\r\n}\r\n.bcds-react-aria-Tag.small {\r\n height: var(--layout-padding-large);\r\n padding: var(--layout-padding-hair) var(--layout-padding-small);\r\n gap: var(--layout-margin-small);\r\n}\r\n\r\n/* Selected */\r\n.bcds-react-aria-Tag[data-selected] {\r\n border-radius: var(--layout-border-radius-small);\r\n border: var(--layout-border-width-medium) solid\r\n var(--surface-color-border-active);\r\n}\r\n\r\n/* Focused */\r\n.bcds-react-aria-Tag[data-focused] {\r\n outline: var(--layout-border-width-medium) solid\r\n var(--surface-color-border-active);\r\n outline-offset: var(--layout-margin-hair);\r\n}\r\n\r\n/* Disabled */\r\n.bcds-react-aria-Tag[data-disabled] {\r\n background-color: var(--surface-color-primary-button-disabled);\r\n border-color: var(--surface-color-border-default);\r\n color: var(--typography-color-disabled);\r\n cursor: not-allowed;\r\n}\r\n";
16163
16163
  styleInject(css_248z$6);
16164
16164
 
16165
16165
  function Tag({ color = "blue", tagStyle = "rectangular", size = "small", icon, id, textValue, }) {
16166
16166
  return (jsxRuntime.jsx($eaf9e70818b436db$export$3288d34c523a1192, { className: `bcds-react-aria-Tag ${color} ${tagStyle} ${size}`, id: id, textValue: textValue, children: ({ allowsRemoving, isDisabled }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [icon, textValue, !isDisabled && allowsRemoving && (jsxRuntime.jsx($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { "aria-label": `Remove ${textValue}`, slot: "remove", children: jsxRuntime.jsx("svg", { width: "14", height: "15", viewBox: "0 0 14 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("g", { id: "Icons / Close", children: jsxRuntime.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" }) }) }) }))] })) }));
16167
16167
  }
16168
16168
 
16169
- var css_248z$5 = ".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";
16169
+ var css_248z$5 = ".bcds-react-aria-TagGroup {\r\n color: var(--typography-color-primary);\r\n font: var(--typography-regular-small-body);\r\n}\r\n\r\n.bcds-react-aria-TagGroup--Label,\r\n.bcds-react-aria-TagGroup--Text-description,\r\n.bcds-react-aria-TagGroup--Text-error {\r\n display: block;\r\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\r\n}\r\n\r\n.bcds-react-aria-TagGroup--Text-error {\r\n display: flex;\r\n color: var(--typography-color-danger);\r\n}\r\n\r\n.bcds-react-aria-TagGroup--Text-error > svg {\r\n padding-right: var(--layout-padding-xsmall);\r\n color: var(--icons-color-danger);\r\n min-width: var(--icons-size-medium);\r\n height: var(--icons-size-medium);\r\n}\r\n";
16170
16170
  styleInject(css_248z$5);
16171
16171
 
16172
16172
  function TagGroup({ children, label, description, errorMessage, ...props }) {
16173
16173
  return (jsxRuntime.jsxs($eaf9e70818b436db$export$67ea30858aaf75e3, { className: "bcds-react-aria-TagGroup", ...props, children: [label && (jsxRuntime.jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TagGroup--Label", children: label })), children, description && (jsxRuntime.jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-TagGroup--Text-description", children: description })), errorMessage && (jsxRuntime.jsxs($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "errorMessage", className: "bcds-react-aria-TagGroup--Text-error", children: [jsxRuntime.jsx(SvgExclamationIcon, {}), errorMessage] }))] }));
16174
16174
  }
16175
16175
 
16176
- var css_248z$4 = ".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";
16176
+ var css_248z$4 = ".bcds-react-aria-TagList {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: var(--layout-padding-small);\r\n width: fit-content;\r\n}\r\n\r\n.bcds-react-aria-TagList.horizontal {\r\n flex-direction: row;\r\n}\r\n\r\n.bcds-react-aria-TagList.vertical {\r\n flex-direction: column;\r\n}\r\n";
16177
16177
  styleInject(css_248z$4);
16178
16178
 
16179
16179
  function TagList({ items, orientation = "horizontal", renderEmptyState, ...props }) {
16180
16180
  return (jsxRuntime.jsx($eaf9e70818b436db$export$f9fef0f55402315b, { className: `bcds-react-aria-TagList ${orientation}`, ...props, renderEmptyState: renderEmptyState, items: items, children: (item) => $dbSRa$react.createElement(Tag, { ...item, key: item.id }) }));
16181
16181
  }
16182
16182
 
16183
- var css_248z$3 = ".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: var(--layout-border-width-small) solid\n 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";
16183
+ var css_248z$3 = ".bcds-react-aria-TextArea {\r\n display: inline-flex;\r\n flex-direction: column;\r\n /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\r\n align-self: stretch;\r\n max-width: -moz-available;\r\n max-width: -webkit-fill-available;\r\n}\r\n\r\n/* Styles for the text label above the input field */\r\n.bcds-react-aria-TextArea--Label {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-primary);\r\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\r\n}\r\n\r\n/* Styles for the description and character count slot below the input field */\r\n.bcds-react-aria-TextArea--Description {\r\n display: grid;\r\n gap: var(--layout-margin-medium);\r\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-secondary);\r\n}\r\n\r\n/* Description label */\r\n.bcds-react-aria-TextArea--Description > .text {\r\n justify-self: flex-start;\r\n grid-row: 1;\r\n}\r\n\r\n/* Character counter */\r\n.bcds-react-aria-TextArea--Description > .counter {\r\n justify-self: flex-end;\r\n grid-row: 1;\r\n}\r\n\r\n/* Styles for the input field container */\r\n.bcds-react-aria-TextArea--Container {\r\n color: var(--typography-color-primary);\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: var(--layout-margin-small);\r\n background: var(--surface-color-forms-default);\r\n box-sizing: border-box;\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-default);\r\n border-radius: var(--layout-border-radius-medium);\r\n padding: var(--layout-padding-small) 12px;\r\n}\r\n\r\n/* Text input field */\r\n.bcds-react-aria-TextArea--Input {\r\n font: var(--typography-regular-body);\r\n padding: var(--layout-padding-none);\r\n color: var(--typography-color-primary);\r\n border: none;\r\n flex-grow: 1;\r\n}\r\n\r\n.bcds-rect-aria-TextArea--Input::placeholder {\r\n color: var(--typography-color-placeholder);\r\n}\r\n\r\n/* Hover and focus states */\r\n.bcds-react-aria-TextArea--Container\r\n > .bcds-react-aria-TextArea--Input[data-focused] {\r\n outline: none;\r\n}\r\n\r\n.bcds-react-aria-TextArea--Container:focus-within {\r\n border-radius: var(--layout-border-radius-large);\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-active);\r\n outline: solid var(--layout-border-width-medium)\r\n var(--surface-color-border-active);\r\n outline-offset: var(--layout-margin-hair);\r\n}\r\n\r\n.bcds-react-aria-TextArea--Container:hover {\r\n border-color: var(--surface-color-border-dark);\r\n}\r\n\r\n/* Disabled and invalid states */\r\n.bcds-react-aria-TextArea[data-disabled]\r\n > .bcds-react-aria-TextArea--Container {\r\n background: var(--surface-color-forms-disabled);\r\n cursor: not-allowed;\r\n}\r\n\r\n.bcds-react-aria-TextArea--Input[data-disabled] {\r\n cursor: not-allowed;\r\n}\r\n\r\n.bcds-react-aria-TextArea[data-invalid] > .bcds-react-aria-TextArea--Container {\r\n border-radius: var(--layout-border-radius-medium);\r\n border: var(--layout-border-width-small) solid\r\n var(--support-border-color-danger);\r\n background: var(--surface-color-forms-default);\r\n}\r\n\r\n.bcds-react-aria-TextArea[data-readonly]\r\n > .bcds-react-aria-TextArea--Container {\r\n background: var(--surface-color-forms-disabled);\r\n}\r\n\r\n.bcds-react-aria-TextArea[data-readonly]\r\n > .bcds-react-aria-TextArea--Container\r\n > .bcds-react-aria-TextArea--Input {\r\n background: var(--surface-color-forms-disabled);\r\n}\r\n\r\n/* Styles for the error message slot */\r\n.bcds-react-aria-TextArea--Error {\r\n display: flex;\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-danger);\r\n}\r\n\r\n.bcds-react-aria-TextArea--Error > svg {\r\n padding-right: var(--layout-padding-xsmall);\r\n color: var(--icons-color-danger);\r\n width: var(--icons-size-medium);\r\n height: var(--icons-size-medium);\r\n}\r\n";
16184
16184
  styleInject(css_248z$3);
16185
16185
 
16186
16186
  function TextArea({ label, description, errorMessage, maxLength, onChange, value, ...props }) {
@@ -16194,21 +16194,21 @@ function TextArea({ label, description, errorMessage, maxLength, onChange, value
16194
16194
  return (jsxRuntime.jsx($bcdf0525bf22703d$export$2c73285ae9390cec, { className: `bcds-react-aria-TextArea`, ...props, children: ({ isRequired, isInvalid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [label && (jsxRuntime.jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TextArea--Label", children: isRequired ? `${label} (required)` : label })), jsxRuntime.jsx("div", { className: "bcds-react-aria-TextArea--Container", children: jsxRuntime.jsx($216918bed6669f72$export$f5c9f3c2c4054eec, { className: "bcds-react-aria-TextArea--Input", value: value, onChange: (e) => handleChange(e.target.value) }) }), description || maxLength ? (jsxRuntime.jsxs("div", { className: "bcds-react-aria-TextArea--Description", children: [description && (jsxRuntime.jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "text", children: description })), maxLength && (jsxRuntime.jsxs("div", { className: "counter", children: [charCount, "/", maxLength] }))] })) : null, isInvalid && (jsxRuntime.jsxs("div", { className: "bcds-react-aria-TextArea--Error", children: [jsxRuntime.jsx(SvgExclamationIcon, {}), jsxRuntime.jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { children: errorMessage })] }))] })) }));
16195
16195
  }
16196
16196
 
16197
- var css_248z$2 = ".bcds-react-aria-TextField {\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-TextField--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.bcds-react-aria-TextField--Label .required {\n color: var(--typography-color-secondary);\n padding: var(--layout-padding-none) var(--layout-padding-xsmall);\n}\n\n/* Styles for the text description below the input field */\n.bcds-react-aria-TextField--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/* Styles for the input field container */\n.bcds-react-aria-TextField--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/* Sizes */\n.bcds-react-aria-TextField--container.small {\n height: var(--layout-margin-xlarge);\n min-height: var(--layout-margin-xlarge);\n}\n\n.bcds-react-aria-TextField--container.medium {\n height: var(--layout-margin-xxlarge);\n min-height: var(--layout-margin-xxlarge);\n}\n\n/* Text input field */\n.bcds-react-aria-TextField--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-react-aria-TextField--Input::placeholder {\n color: var(--typography-color-placeholder);\n}\n\n/* Hover and focus states */\n\n.bcds-react-aria-TextField--container\n > .bcds-react-aria-TextField--Input[data-focused] {\n outline: none;\n}\n\n.bcds-react-aria-TextField--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-TextField--container:hover {\n border-color: var(--surface-color-border-dark);\n}\n\n/* Disabled and invalid states */\n\n.bcds-react-aria-TextField[data-disabled]\n > .bcds-react-aria-TextField--container {\n background: var(--surface-color-forms-disabled);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-TextField--Input[data-disabled] {\n color: var(--typography-color-placeholder);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-TextField[data-invalid]\n > .bcds-react-aria-TextField--container {\n border-radius: var(--layout-border-radius-medium);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n background: var(--surface-color-forms-default);\n}\n\n.bcds-react-aria-TextField[data-readonly]\n > .bcds-react-aria-TextField--container {\n background: var(--surface-color-forms-disabled);\n}\n\n.bcds-react-aria-TextField[data-readonly]\n > .bcds-react-aria-TextField--container\n > .bcds-react-aria-TextField--Input {\n background: var(--surface-color-forms-disabled);\n}\n\n/* Styles for the error message slot */\n.bcds-react-aria-TextField--Error {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n\n.bcds-react-aria-TextField[data-invalid]\n > .bcds-react-aria-TextField--container\n > svg#exclamation-icon {\n color: var(--icons-color-danger);\n min-width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n";
16197
+ var css_248z$2 = ".bcds-react-aria-TextField {\r\n display: inline-flex;\r\n flex-direction: column;\r\n /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\r\n align-self: stretch;\r\n max-width: -moz-available;\r\n max-width: -webkit-fill-available;\r\n}\r\n\r\n/* Styles for the text label above the input field */\r\n.bcds-react-aria-TextField--Label {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-primary);\r\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\r\n}\r\n\r\n.bcds-react-aria-TextField--Label .required {\r\n color: var(--typography-color-secondary);\r\n padding: var(--layout-padding-none) var(--layout-padding-xsmall);\r\n}\r\n\r\n/* Styles for the text description below the input field */\r\n.bcds-react-aria-TextField--Description {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-secondary);\r\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\r\n}\r\n\r\n/* Styles for the input field container */\r\n.bcds-react-aria-TextField--container {\r\n color: var(--typography-color-primary);\r\n display: flex;\r\n flex-direction: row;\r\n align-items: center;\r\n gap: var(--layout-margin-small);\r\n background: var(--surface-color-forms-default);\r\n box-sizing: border-box;\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-default);\r\n border-radius: var(--layout-border-radius-medium);\r\n padding: var(--layout-padding-small) 12px;\r\n}\r\n\r\n/* Sizes */\r\n.bcds-react-aria-TextField--container.small {\r\n height: var(--layout-margin-xlarge);\r\n min-height: var(--layout-margin-xlarge);\r\n}\r\n\r\n.bcds-react-aria-TextField--container.medium {\r\n height: var(--layout-margin-xxlarge);\r\n min-height: var(--layout-margin-xxlarge);\r\n}\r\n\r\n/* Text input field */\r\n.bcds-react-aria-TextField--Input {\r\n font: var(--typography-regular-body);\r\n padding: var(--layout-padding-none);\r\n color: var(--typography-color-primary);\r\n border: none;\r\n flex-grow: 1;\r\n}\r\n\r\n.bcds-react-aria-TextField--Input::placeholder {\r\n color: var(--typography-color-placeholder);\r\n}\r\n\r\n/* Hover and focus states */\r\n\r\n.bcds-react-aria-TextField--container\r\n > .bcds-react-aria-TextField--Input[data-focused] {\r\n outline: none;\r\n}\r\n\r\n.bcds-react-aria-TextField--container:focus-within {\r\n border-radius: var(--layout-border-radius-large);\r\n border: var(--layout-border-width-small) solid\r\n var(--surface-color-border-active);\r\n outline: solid var(--layout-border-width-medium)\r\n var(--surface-color-border-active);\r\n outline-offset: var(--layout-margin-hair);\r\n}\r\n\r\n.bcds-react-aria-TextField--container:hover {\r\n border-color: var(--surface-color-border-dark);\r\n}\r\n\r\n/* Disabled and invalid states */\r\n\r\n.bcds-react-aria-TextField[data-disabled]\r\n > .bcds-react-aria-TextField--container {\r\n background: var(--surface-color-forms-disabled);\r\n cursor: not-allowed;\r\n}\r\n\r\n.bcds-react-aria-TextField--Input[data-disabled] {\r\n color: var(--typography-color-placeholder);\r\n cursor: not-allowed;\r\n}\r\n\r\n.bcds-react-aria-TextField[data-invalid]\r\n > .bcds-react-aria-TextField--container {\r\n border-radius: var(--layout-border-radius-medium);\r\n border: var(--layout-border-width-small) solid\r\n var(--support-border-color-danger);\r\n background: var(--surface-color-forms-default);\r\n}\r\n\r\n.bcds-react-aria-TextField[data-readonly]\r\n > .bcds-react-aria-TextField--container {\r\n background: var(--surface-color-forms-disabled);\r\n}\r\n\r\n.bcds-react-aria-TextField[data-readonly]\r\n > .bcds-react-aria-TextField--container\r\n > .bcds-react-aria-TextField--Input {\r\n background: var(--surface-color-forms-disabled);\r\n}\r\n\r\n/* Styles for the error message slot */\r\n.bcds-react-aria-TextField--Error {\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-danger);\r\n}\r\n\r\n.bcds-react-aria-TextField[data-invalid]\r\n > .bcds-react-aria-TextField--container\r\n > svg#exclamation-icon {\r\n color: var(--icons-color-danger);\r\n min-width: var(--icons-size-medium);\r\n height: var(--icons-size-medium);\r\n}\r\n";
16198
16198
  styleInject(css_248z$2);
16199
16199
 
16200
16200
  function TextField({ size, label, description, errorMessage, iconLeft, iconRight, ...props }) {
16201
16201
  return (jsxRuntime.jsx($bcdf0525bf22703d$export$2c73285ae9390cec, { className: "bcds-react-aria-TextField", ...props, children: ({ isRequired, isInvalid }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [label && (jsxRuntime.jsxs($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TextField--Label", children: [label, isRequired && (jsxRuntime.jsx("span", { className: "bcds-react-aria-TextField--Label required", children: "(required)" }))] })), jsxRuntime.jsxs("div", { className: `bcds-react-aria-TextField--container ${size === "small" ? "small" : "medium"}`, children: [iconLeft, jsxRuntime.jsx($3985021b0ad6602f$export$f5b8910cec6cf069, { className: "bcds-react-aria-TextField--Input" }), isInvalid && jsxRuntime.jsx(SvgExclamationIcon, {}), iconRight] }), description && (jsxRuntime.jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: `bcds-react-aria-TextField--Description`, children: description })), jsxRuntime.jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { className: "bcds-react-aria-TextField--Error", children: errorMessage })] })) }));
16202
16202
  }
16203
16203
 
16204
- var css_248z$1 = ".bcds-react-aria-Switch {\n display: flex;\n align-items: center;\n gap: var(--layout-margin-small);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n forced-color-adjust: none;\n}\n\n/* Container */\n.bcds-react-aria-Switch > .indicator {\n align-items: center;\n width: var(--layout-margin-xxlarge);\n height: var(--icons-size-medium);\n background-color: var(--surface-color-primary-disabled);\n border-radius: var(--icons-size-medium);\n transition: all 200ms;\n}\n@media (prefers-reduced-motion) {\n /* No animation on Switch container color if user has reduced motion set */\n .bcds-react-aria-Switch > .indicator {\n transition: none;\n }\n}\n\n/* Indicator */\n.bcds-react-aria-Switch > .indicator::before {\n content: \"\";\n display: block;\n box-sizing: border-box;\n width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n background-color: var(--surface-color-secondary-default);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-medium);\n border-radius: var(--icons-size-small);\n transition: all 200ms;\n}\n@media (prefers-reduced-motion) {\n /* No animation on Switch circle indicator if user has reduced motion set */\n .bcds-react-aria-Switch > .indicator::before {\n transition: none;\n }\n}\n\n/* Selected */\n.bcds-react-aria-Switch[data-selected] > .indicator {\n background-color: var(--surface-color-primary-default);\n}\n\n.bcds-react-aria-Switch[data-selected] > .indicator::before {\n transform: translateX(100%);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-primary-default);\n}\n\n/* Hover */\n.bcds-react-aria-Switch[data-hovered] {\n cursor: pointer;\n}\n\n.bcds-react-aria-Switch[data-hovered][data-selected] > .indicator {\n background-color: var(--surface-color-primary-hover);\n}\n\n.bcds-react-aria-Switch[data-hovered] > .indicator::before {\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-dark);\n}\n\n.bcds-react-aria-Switch[data-hovered][data-selected] > .indicator::before {\n border: var(--layout-border-width-medium) solid\n var(--surface-color-primary-hover);\n}\n\n/* Focused */\n.bcds-react-aria-Switch[data-focus-visible] > .indicator {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Disabled */\n.bcds-react-aria-Switch[data-disabled] {\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-Switch[data-disabled] > .indicator {\n background-color: var(--surface-color-primary-disabled);\n}\n\n.bcds-react-aria-Switch[data-disabled] > .indicator::before {\n background-color: var(--theme-gray-10);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-default);\n}\n\n/* Read only */\n.bcds-react-aria-Switch[data-readonly] {\n cursor: not-allowed;\n}\n";
16204
+ var css_248z$1 = ".bcds-react-aria-Switch {\r\n display: flex;\r\n align-items: center;\r\n gap: var(--layout-margin-small);\r\n font: var(--typography-regular-small-body);\r\n color: var(--typography-color-secondary);\r\n forced-color-adjust: none;\r\n}\r\n\r\n/* Container */\r\n.bcds-react-aria-Switch > .indicator {\r\n align-items: center;\r\n width: var(--layout-margin-xxlarge);\r\n height: var(--icons-size-medium);\r\n background-color: var(--surface-color-primary-disabled);\r\n border-radius: var(--icons-size-medium);\r\n transition: all 200ms;\r\n}\r\n@media (prefers-reduced-motion) {\r\n /* No animation on Switch container color if user has reduced motion set */\r\n .bcds-react-aria-Switch > .indicator {\r\n transition: none;\r\n }\r\n}\r\n\r\n/* Indicator */\r\n.bcds-react-aria-Switch > .indicator::before {\r\n content: \"\";\r\n display: block;\r\n box-sizing: border-box;\r\n width: var(--icons-size-medium);\r\n height: var(--icons-size-medium);\r\n background-color: var(--surface-color-secondary-default);\r\n border: var(--layout-border-width-medium) solid\r\n var(--surface-color-border-medium);\r\n border-radius: var(--icons-size-small);\r\n transition: all 200ms;\r\n}\r\n@media (prefers-reduced-motion) {\r\n /* No animation on Switch circle indicator if user has reduced motion set */\r\n .bcds-react-aria-Switch > .indicator::before {\r\n transition: none;\r\n }\r\n}\r\n\r\n/* Selected */\r\n.bcds-react-aria-Switch[data-selected] > .indicator {\r\n background-color: var(--surface-color-primary-default);\r\n}\r\n\r\n.bcds-react-aria-Switch[data-selected] > .indicator::before {\r\n transform: translateX(100%);\r\n border: var(--layout-border-width-medium) solid\r\n var(--surface-color-primary-default);\r\n}\r\n\r\n/* Hover */\r\n.bcds-react-aria-Switch[data-hovered] {\r\n cursor: pointer;\r\n}\r\n\r\n.bcds-react-aria-Switch[data-hovered][data-selected] > .indicator {\r\n background-color: var(--surface-color-primary-hover);\r\n}\r\n\r\n.bcds-react-aria-Switch[data-hovered] > .indicator::before {\r\n border: var(--layout-border-width-medium) solid\r\n var(--surface-color-border-dark);\r\n}\r\n\r\n.bcds-react-aria-Switch[data-hovered][data-selected] > .indicator::before {\r\n border: var(--layout-border-width-medium) solid\r\n var(--surface-color-primary-hover);\r\n}\r\n\r\n/* Focused */\r\n.bcds-react-aria-Switch[data-focus-visible] > .indicator {\r\n outline: solid var(--layout-border-width-medium)\r\n var(--surface-color-border-active);\r\n outline-offset: var(--layout-margin-hair);\r\n}\r\n\r\n/* Disabled */\r\n.bcds-react-aria-Switch[data-disabled] {\r\n color: var(--typography-color-disabled);\r\n cursor: not-allowed;\r\n}\r\n\r\n.bcds-react-aria-Switch[data-disabled] > .indicator {\r\n background-color: var(--surface-color-primary-disabled);\r\n}\r\n\r\n.bcds-react-aria-Switch[data-disabled] > .indicator::before {\r\n background-color: var(--theme-gray-10);\r\n border: var(--layout-border-width-medium) solid\r\n var(--surface-color-border-default);\r\n}\r\n\r\n/* Read only */\r\n.bcds-react-aria-Switch[data-readonly] {\r\n cursor: not-allowed;\r\n}\r\n";
16205
16205
  styleInject(css_248z$1);
16206
16206
 
16207
16207
  function Switch({ labelPosition = "right", children, ...props }) {
16208
16208
  return (jsxRuntime.jsxs($8e59e948500a8fe1$export$b5d5cf8927ab7262, { className: `bcds-react-aria-Switch`, ...props, children: [labelPosition === "left" && jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }), jsxRuntime.jsx("div", { className: "indicator" }), labelPosition === "right" && jsxRuntime.jsx(jsxRuntime.Fragment, { children: children })] }));
16209
16209
  }
16210
16210
 
16211
- var css_248z = ".bcds-react-aria-Tooltip {\n background-color: var(--theme-gray-110);\n border-radius: var(--layout-border-radius-medium);\n box-shadow: var(--surface-shadow-small);\n color: var(--typography-color-primary-invert);\n font: var(--typography-regular-small-body);\n padding: var(--layout-padding-xsmall) var(--layout-padding-small);\n transform: translate3d(0, 0, 0);\n}\n\n.bcds-react-aria-Tooltip > .bcds-react-aria-OverlayArrow {\n color: var(--theme-gray-110);\n}\n\n.bcds-react-aria-Tooltip[data-placement=\"top\"] > .bcds-react-aria-OverlayArrow,\n.bcds-react-aria-Tooltip[data-placement=\"bottom\"]\n > .bcds-react-aria-OverlayArrow {\n height: 9px;\n width: 19px;\n}\n\n.bcds-react-aria-Tooltip[data-placement=\"right\"]\n > .bcds-react-aria-OverlayArrow,\n.bcds-react-aria-Tooltip[data-placement=\"left\"]\n > .bcds-react-aria-OverlayArrow {\n height: 19px;\n width: 9px;\n}\n\n/* Top placement */\n.bcds-react-aria-Tooltip[data-placement=\"top\"] {\n margin-bottom: 10px; /* Offset is equal to the depth of the OverlayArrow */\n}\n.bcds-react-aria-Tooltip[data-placement=\"top\"] > .bcds-react-aria-OverlayArrow {\n margin-top: -7.5px;\n}\n.bcds-react-aria-Tooltip[data-placement=\"top\"]\n > .bcds-react-aria-OverlayArrow\n > svg {\n transform: rotate(180deg);\n}\n\n/* Right placement */\n.bcds-react-aria-Tooltip[data-placement=\"right\"] {\n margin-left: 10px;\n}\n.bcds-react-aria-Tooltip[data-placement=\"right\"]\n > .bcds-react-aria-OverlayArrow {\n margin-top: -2px;\n margin-right: 4.5px;\n}\n.bcds-react-aria-Tooltip[data-placement=\"right\"]\n > .bcds-react-aria-OverlayArrow\n > svg {\n transform: rotate(-90deg);\n}\n\n/* Bottom placement */\n.bcds-react-aria-Tooltip[data-placement=\"bottom\"] {\n margin-top: 9px;\n}\n.bcds-react-aria-Tooltip[data-placement=\"bottom\"]\n > .bcds-react-aria-OverlayArrow {\n margin-bottom: 6.5px;\n}\n\n/* Left placement */\n.bcds-react-aria-Tooltip[data-placement=\"left\"] {\n margin-right: 10px;\n}\n.bcds-react-aria-Tooltip[data-placement=\"left\"]\n > .bcds-react-aria-OverlayArrow {\n margin-top: -2px;\n margin-left: -5.5px;\n}\n.bcds-react-aria-Tooltip[data-placement=\"left\"]\n > .bcds-react-aria-OverlayArrow\n > svg {\n transform: rotate(90deg);\n}\n";
16211
+ var css_248z = ".bcds-react-aria-Tooltip {\r\n background-color: var(--theme-gray-110);\r\n border-radius: var(--layout-border-radius-medium);\r\n box-shadow: var(--surface-shadow-small);\r\n color: var(--typography-color-primary-invert);\r\n font: var(--typography-regular-small-body);\r\n padding: var(--layout-padding-xsmall) var(--layout-padding-small);\r\n transform: translate3d(0, 0, 0);\r\n}\r\n\r\n.bcds-react-aria-Tooltip > .bcds-react-aria-OverlayArrow {\r\n color: var(--theme-gray-110);\r\n}\r\n\r\n.bcds-react-aria-Tooltip[data-placement=\"top\"] > .bcds-react-aria-OverlayArrow,\r\n.bcds-react-aria-Tooltip[data-placement=\"bottom\"]\r\n > .bcds-react-aria-OverlayArrow {\r\n height: 9px;\r\n width: 19px;\r\n}\r\n\r\n.bcds-react-aria-Tooltip[data-placement=\"right\"]\r\n > .bcds-react-aria-OverlayArrow,\r\n.bcds-react-aria-Tooltip[data-placement=\"left\"]\r\n > .bcds-react-aria-OverlayArrow {\r\n height: 19px;\r\n width: 9px;\r\n}\r\n\r\n/* Top placement */\r\n.bcds-react-aria-Tooltip[data-placement=\"top\"] {\r\n margin-bottom: 10px; /* Offset is equal to the depth of the OverlayArrow */\r\n}\r\n.bcds-react-aria-Tooltip[data-placement=\"top\"] > .bcds-react-aria-OverlayArrow {\r\n margin-top: -7.5px;\r\n}\r\n.bcds-react-aria-Tooltip[data-placement=\"top\"]\r\n > .bcds-react-aria-OverlayArrow\r\n > svg {\r\n transform: rotate(180deg);\r\n}\r\n\r\n/* Right placement */\r\n.bcds-react-aria-Tooltip[data-placement=\"right\"] {\r\n margin-left: 10px;\r\n}\r\n.bcds-react-aria-Tooltip[data-placement=\"right\"]\r\n > .bcds-react-aria-OverlayArrow {\r\n margin-top: -2px;\r\n margin-right: 4.5px;\r\n}\r\n.bcds-react-aria-Tooltip[data-placement=\"right\"]\r\n > .bcds-react-aria-OverlayArrow\r\n > svg {\r\n transform: rotate(-90deg);\r\n}\r\n\r\n/* Bottom placement */\r\n.bcds-react-aria-Tooltip[data-placement=\"bottom\"] {\r\n margin-top: 9px;\r\n}\r\n.bcds-react-aria-Tooltip[data-placement=\"bottom\"]\r\n > .bcds-react-aria-OverlayArrow {\r\n margin-bottom: 6.5px;\r\n}\r\n\r\n/* Left placement */\r\n.bcds-react-aria-Tooltip[data-placement=\"left\"] {\r\n margin-right: 10px;\r\n}\r\n.bcds-react-aria-Tooltip[data-placement=\"left\"]\r\n > .bcds-react-aria-OverlayArrow {\r\n margin-top: -2px;\r\n margin-left: -5.5px;\r\n}\r\n.bcds-react-aria-Tooltip[data-placement=\"left\"]\r\n > .bcds-react-aria-OverlayArrow\r\n > svg {\r\n transform: rotate(90deg);\r\n}\r\n";
16212
16212
  styleInject(css_248z);
16213
16213
 
16214
16214
  function Tooltip(props) {