@bcgov/design-system-react-components 0.1.1 → 0.1.2-pr447
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.
- package/README.md +3 -0
- package/dist/cjs/index.cjs +280 -28
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/types/components/ButtonGroup/ButtonGroup.d.ts +7 -0
- package/dist/cjs/types/components/ButtonGroup/index.d.ts +2 -0
- package/dist/cjs/types/components/Icons/SvgCheckCircleIcon/SvgCheckCircleIcon.d.ts +3 -0
- package/dist/cjs/types/components/Icons/SvgCheckCircleIcon/index.d.ts +1 -0
- package/dist/cjs/types/components/Icons/SvgCloseIcon/SvgCloseIcon.d.ts +3 -0
- package/dist/cjs/types/components/Icons/SvgCloseIcon/index.d.ts +1 -0
- package/dist/cjs/types/components/Icons/SvgExclamationCircleIcon/SvgExclamationCircleIcon.d.ts +3 -0
- package/dist/cjs/types/components/Icons/SvgExclamationCircleIcon/index.d.ts +1 -0
- package/dist/cjs/types/components/Icons/SvgInfoIcon/SvgInfoIcon.d.ts +3 -0
- package/dist/cjs/types/components/Icons/SvgInfoIcon/index.d.ts +1 -0
- package/dist/cjs/types/components/InlineAlert/InlineAlert.d.ts +13 -0
- package/dist/cjs/types/components/InlineAlert/index.d.ts +2 -0
- package/dist/cjs/types/components/Select/Select.d.ts +4 -1
- package/dist/cjs/types/components/Switch/Switch.d.ts +7 -0
- package/dist/cjs/types/components/Switch/index.d.ts +2 -0
- package/dist/cjs/types/components/index.d.ts +9 -1
- package/dist/esm/index.js +274 -30
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/ButtonGroup/ButtonGroup.d.ts +7 -0
- package/dist/esm/types/components/ButtonGroup/index.d.ts +2 -0
- package/dist/esm/types/components/Icons/SvgCheckCircleIcon/SvgCheckCircleIcon.d.ts +3 -0
- package/dist/esm/types/components/Icons/SvgCheckCircleIcon/index.d.ts +1 -0
- package/dist/esm/types/components/Icons/SvgCloseIcon/SvgCloseIcon.d.ts +3 -0
- package/dist/esm/types/components/Icons/SvgCloseIcon/index.d.ts +1 -0
- package/dist/esm/types/components/Icons/SvgExclamationCircleIcon/SvgExclamationCircleIcon.d.ts +3 -0
- package/dist/esm/types/components/Icons/SvgExclamationCircleIcon/index.d.ts +1 -0
- package/dist/esm/types/components/Icons/SvgInfoIcon/SvgInfoIcon.d.ts +3 -0
- package/dist/esm/types/components/Icons/SvgInfoIcon/index.d.ts +1 -0
- package/dist/esm/types/components/InlineAlert/InlineAlert.d.ts +13 -0
- package/dist/esm/types/components/InlineAlert/index.d.ts +2 -0
- package/dist/esm/types/components/Select/Select.d.ts +4 -1
- package/dist/esm/types/components/Switch/Switch.d.ts +7 -0
- package/dist/esm/types/components/Switch/index.d.ts +2 -0
- package/dist/esm/types/components/index.d.ts +9 -1
- package/dist/index.d.ts +52 -4
- package/package.json +1 -1
- package/dist/cjs/types/components/Select/ListBoxItem.d.ts +0 -15
- package/dist/esm/types/components/Select/ListBoxItem.d.ts +0 -15
- /package/dist/cjs/types/components/{SvgBcLogo → Icons/SvgBcLogo}/SvgBcLogo.d.ts +0 -0
- /package/dist/cjs/types/components/{SvgBcLogo → Icons/SvgBcLogo}/index.d.ts +0 -0
- /package/dist/cjs/types/components/{SvgExclamationIcon → Icons/SvgExclamationIcon}/SvgExclamationIcon.d.ts +0 -0
- /package/dist/cjs/types/components/{SvgExclamationIcon → Icons/SvgExclamationIcon}/index.d.ts +0 -0
- /package/dist/esm/types/components/{SvgBcLogo → Icons/SvgBcLogo}/SvgBcLogo.d.ts +0 -0
- /package/dist/esm/types/components/{SvgBcLogo → Icons/SvgBcLogo}/index.d.ts +0 -0
- /package/dist/esm/types/components/{SvgExclamationIcon → Icons/SvgExclamationIcon}/SvgExclamationIcon.d.ts +0 -0
- /package/dist/esm/types/components/{SvgExclamationIcon → Icons/SvgExclamationIcon}/index.d.ts +0 -0
package/dist/esm/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import $dbSRa$react, { useMemo, cloneElement, useContext, useState, useRef, forwardRef, createContext, useCallback, useEffect, createElement } from 'react';
|
|
3
3
|
import $iETbY$reactdom, { createPortal, flushSync } from 'react-dom';
|
|
4
4
|
|
|
@@ -29,8 +29,29 @@ function styleInject(css, ref) {
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
-
var css_248z$
|
|
33
|
-
styleInject(css_248z$
|
|
32
|
+
var css_248z$d = "/**\n * Do not edit directly\n * Generated on Wed, 01 May 2024 18:02:21 GMT\n */\n\n:root {\n --surface-opacity-0: 0;\n --surface-opacity-10: 0.1;\n --surface-opacity-20: 0.2;\n --surface-opacity-30: 0.3;\n --surface-opacity-40: 0.4;\n --surface-opacity-50: 0.5;\n --surface-opacity-60: 0.6;\n --surface-opacity-70: 0.7;\n --surface-opacity-80: 0.8;\n --surface-opacity-90: 0.9;\n --surface-opacity-100: 1;\n --surface-shadow-none: 0 0.30000001192092896px 0.8999999761581421px 0 #0000001a, 0 1.600000023841858px 3.5999999046325684px 0 #00000021;\n --surface-shadow-small: 0 0.6000000238418579px 1.7999999523162842px 0 #0000001a, 0 3.200000047683716px 7.199999809265137px 0 #00000021; /* Primarily used as a hover effect for cards */\n --surface-shadow-medium: 0 1.2000000476837158px 3.5999999046325684px 0 #0000001a, 0 6.400000095367432px 14.399999618530273px 0 #00000021; /* Primarily used for dropdown menus and tooltips */\n --surface-shadow-large: 0 4.800000190734863px 14.399999618530273px 0 #0000002e, 0 25.600000381469727px 57.599998474121094px 0 #00000038; /* Primarily used for dialogs */\n --surface-color-primary-button-default: #013366;\n --surface-color-primary-button-hover: #1E5189;\n --surface-color-primary-button-disabled: #EDEBE9;\n --surface-color-primary-danger-button-default: #CE3E39;\n --surface-color-primary-danger-button-hover: #A2312D;\n --surface-color-primary-danger-button-disabled: #EDEBE9;\n --surface-color-secondary-button-default: #FFFFFF;\n --surface-color-secondary-button-hover: #EDEBE9;\n --surface-color-secondary-button-disabled: #EDEBE9;\n --surface-color-tertiary-button-default: rgba(255,255,255,0);\n --surface-color-tertiary-button-hover: #ECEAE8;\n --surface-color-tertiary-button-disabled: #EDEBE9;\n --surface-color-menus-default: #FFFFFF;\n --surface-color-menus-hover: #EDEBE9;\n --surface-color-forms-default: #FFFFFF;\n --surface-color-forms-disabled: #EDEBE9;\n --surface-color-background-white: #FFFFFF;\n --surface-color-background-light-gray: #FAF9F8;\n --surface-color-background-light-blue: #F1F8FE;\n --surface-color-background-dark-blue: #053662;\n --surface-color-border-default: #D8D8D8;\n --surface-color-border-medium: #898785;\n --surface-color-border-dark: #353433;\n --surface-color-border-active: #2E5DD7;\n --surface-color-overlay-default: rgba(0,0,0,0.45);\n --support-surface-color-info: #F7F9FC;\n --support-surface-color-danger: #F4E1E2;\n --support-surface-color-success: #F6FFF8;\n --support-surface-color-warning: #FEF1D8;\n --support-border-color-info: #053662;\n --support-border-color-danger: #CE3E39;\n --support-border-color-success: #42814A;\n --support-border-color-warning: #F8BB47;\n --icons-size-xsmall: 14px;\n --icons-size-small: 16px;\n --icons-size-medium: 20px;\n --icons-size-large: 24px;\n --icons-size-xlarge: 32px;\n --icons-color-primary: #2D2D2D;\n --icons-color-secondary: #474543;\n --icons-color-disabled: #9F9D9C;\n --icons-color-link: #255A90;\n --icons-color-info: #053662;\n --icons-color-danger: #CE3E39;\n --icons-color-success: #42814A;\n --icons-color-warning: #F8BB47;\n --icons-color-primary-invert: #FFFFFF;\n --layout-border-width-none: 0;\n --layout-border-width-small: 1px;\n --layout-border-width-medium: 2px;\n --layout-border-width-large: 4px;\n --layout-padding-none: 0;\n --layout-padding-xsmall: 0.25rem;\n --layout-padding-small: 0.5rem;\n --layout-padding-medium: 1rem;\n --layout-padding-large: 1.5rem;\n --layout-padding-xlarge: 2rem;\n --layout-margin-none: 0rem;\n --layout-margin-hair: 0.125rem;\n --layout-margin-xsmall: 0.25rem;\n --layout-margin-small: 0.5rem;\n --layout-margin-medium: 1rem;\n --layout-margin-large: 1.5rem;\n --layout-margin-xlarge: 2rem;\n --layout-margin-xxlarge: 2.5rem;\n --layout-margin-xxxlarge: 3rem;\n --layout-margin-huge: 3.5rem;\n --layout-border-radius-none: 0;\n --layout-border-radius-small: 2px;\n --layout-border-radius-medium: 4px;\n --layout-border-radius-large: 6px;\n --typography-font-families-bc-sans: 'BC Sans';\n --typography-line-heights-xxxdense: 1.125rem;\n --typography-line-heights-xxdense: 1.313rem;\n --typography-line-heights-xdense: 1.688rem;\n --typography-line-heights-dense: 1.913rem;\n --typography-line-heights-regular: 2.125rem;\n --typography-line-heights-sparse: 2.25rem;\n --typography-line-heights-xsparse: 3rem;\n --typography-line-heights-xxsparse: 3.375rem;\n --typography-line-heights-auto: AUTO;\n --typography-font-weights-regular: 400;\n --typography-font-weights-bold: 700;\n --typography-font-weights-italic: Italic;\n --typography-font-size-label: 0.75rem;\n --typography-font-size-small-body: 0.875rem;\n --typography-font-size-body: 1rem;\n --typography-font-size-large-body: 1.125rem;\n --typography-font-size-h5: 1.25rem;\n --typography-font-size-h4: 1.5rem;\n --typography-font-size-h3: 1.75rem;\n --typography-font-size-h2: 2rem;\n --typography-font-size-h1: 2.25rem;\n --typography-font-size-display: 3rem;\n --typography-letter-spacing-0: 0em;\n --typography-paragraph-spacing-0: 0;\n --typography-regular-label: 400 0.75rem/1.125rem 'BC Sans';\n --typography-regular-small-body: 400 0.875rem/1.313rem 'BC Sans';\n --typography-regular-body: 400 1rem/1.688rem 'BC Sans';\n --typography-regular-large-body: 400 1.125rem/1.913rem 'BC Sans';\n --typography-regular-h6: 400 1.125rem/1.913rem 'BC Sans';\n --typography-regular-h5: 400 1.25rem/2.125rem 'BC Sans';\n --typography-regular-h4: 400 1.5rem/2.25rem 'BC Sans';\n --typography-regular-h3: 400 1.75rem/3rem 'BC Sans';\n --typography-regular-h2: 400 2rem/3.375rem 'BC Sans';\n --typography-regular-h1: 400 2.25rem/3rem 'BC Sans';\n --typography-regular-display: 400 3rem/AUTO 'BC Sans';\n --typography-bold-label: 700 0.75rem/1.125rem 'BC Sans';\n --typography-bold-small-body: 700 0.875rem/1.313rem 'BC Sans';\n --typography-bold-body: 700 1rem/1.688rem 'BC Sans';\n --typography-bold-large-body: 700 1.125rem/1.913rem 'BC Sans';\n --typography-bold-h6: 700 1.125rem/1.913rem 'BC Sans';\n --typography-bold-h5: 700 1.25rem/2.125rem 'BC Sans';\n --typography-bold-h4: 700 1.5rem/2.25rem 'BC Sans';\n --typography-bold-h3: 700 1.75rem/3rem 'BC Sans';\n --typography-bold-h2: 700 2rem/3rem 'BC Sans';\n --typography-bold-h1: 700 2.25rem/3.375rem 'BC Sans';\n --typography-bold-display: 700 3rem/AUTO 'BC Sans';\n --typography-italic-label: 400 italic 0.75rem/1.125rem 'BC Sans';\n --typography-italic-small-body: 400 italic 0.875rem/1.313rem 'BC Sans';\n --typography-italic-body: 400 italic 1rem/1.688rem 'BC Sans';\n --typography-italic-large-body: 400 italic 1.125rem/1.913rem 'BC Sans';\n --typography-italic-h6: 400 italic 1.125rem/1.913rem 'BC Sans';\n --typography-italic-h5: 400 italic 1.25rem/2.125rem 'BC Sans';\n --typography-italic-h4: 400 italic 1.5rem/2.25rem 'BC Sans';\n --typography-italic-h3: 400 italic 1.75rem/3.375rem 'BC Sans';\n --typography-italic-h2: 400 italic 2rem/3rem 'BC Sans';\n --typography-italic-h1: 400 italic 2.25rem/3.375rem 'BC Sans';\n --typography-italic-display: 400 italic 3rem/AUTO 'BC Sans';\n --typography-text-case-none: none;\n --typography-text-decoration-none: none;\n --typography-paragraph-indent-0: 0px;\n --typography-color-primary: #2D2D2D;\n --typography-color-secondary: #474543;\n --typography-color-placeholder: #9F9D9C;\n --typography-color-disabled: #9F9D9C;\n --typography-color-link: #255A90;\n --typography-color-danger: #CE3E39;\n --typography-color-primary-invert: #FFFFFF;\n --typography-color-secondary-invert: #ECEAE8;\n --theme-gold-10: #FEF8E8;\n --theme-gold-20: #FEF0D8;\n --theme-gold-30: #FDE9C4;\n --theme-gold-40: #FCE2B0;\n --theme-gold-50: #FBDA9D;\n --theme-gold-60: #FBD389;\n --theme-gold-70: #FACC75;\n --theme-gold-80: #F9C462;\n --theme-gold-90: #F8BA47;\n --theme-gold-100: #FCBA19;\n --theme-blue-10: #F1F8FE;\n --theme-blue-20: #D8EAFD;\n --theme-blue-30: #C1DDFC;\n --theme-blue-40: #A8D0FB;\n --theme-blue-50: #91C4FA;\n --theme-blue-60: #7AB8F9;\n --theme-blue-70: #5595D9;\n --theme-blue-80: #3470B1;\n --theme-blue-90: #1E5189;\n --theme-blue-100: #013366;\n --theme-gray-10: #FAF9F8;\n --theme-gray-20: #F3F2F1;\n --theme-gray-30: #ECEAE8;\n --theme-gray-40: #E0DEDC;\n --theme-gray-50: #D1CFCD;\n --theme-gray-60: #C6C5C3;\n --theme-gray-70: #9F9D9C;\n --theme-gray-80: #605E5C;\n --theme-gray-90: #3D3C3B;\n --theme-gray-100: #353433;\n --theme-gray-110: #252423;\n --theme-gray-white: #FFFFFF;\n --theme-primary-blue: #013366;\n --theme-primary-gold: #FCBA19;\n}\n";
|
|
33
|
+
styleInject(css_248z$d);
|
|
34
|
+
|
|
35
|
+
var css_248z$c = ".bcds-Inline-Alert {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n gap: var(--layout-margin-small);\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n}\n\n/* Alert content */\n.bcds-Inline-Alert--container {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n}\n\n.bcds-Inline-Alert--container > .title {\n font: var(--typography-bold-body);\n color: var(--typography-color-primary);\n}\n\n.bcds-Inline-Alert--container > .description {\n font: var(--typography-regular-body);\n color: var(--typography-color-primary);\n}\n\n/* Left icon */\n.bcds-Inline-Alert--icon {\n display: inline-flex;\n align-self: flex-start;\n padding-top: var(--layout-padding-xsmall);\n}\n\n.bcds-Inline-Alert--icon > svg {\n min-width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n\n/* Close icon button */\n.bcds-Inline-Alert--closeIcon {\n display: inline-flex;\n align-self: first baseline;\n color: var(--icons-color-primary);\n}\n\n.bcds-Inline-Alert--closeIcon > svg {\n min-width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n\n/* Info variant */\n.bcds-Inline-Alert.info {\n background-color: var(--support-surface-color-info);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-info);\n border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.info > .bcds-Inline-Alert--icon {\n color: var(--icons-color-info);\n}\n\n/* Success variant */\n.bcds-Inline-Alert.success {\n background-color: var(--suport-surface-color-success);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-success);\n border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.success > .bcds-Inline-Alert--icon {\n color: var(--icons-color-success);\n}\n\n/* Warning variant */\n.bcds-Inline-Alert.warning {\n background-color: var(--support-surface-color-warning);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-warning);\n border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.warning > .bcds-Inline-Alert--icon {\n color: var(--icons-color-warning);\n}\n\n/* Danger variant */\n.bcds-Inline-Alert.danger {\n background-color: var(--support-surface-color-danger);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.danger > .bcds-Inline-Alert--icon {\n color: var(--icons-color-danger);\n}\n\n/* Button group */\n.bcds-Inline-Alert--container > .bcds-ButtonGroup {\n padding-top: var(--layout-padding-small);\n}\n";
|
|
36
|
+
styleInject(css_248z$c);
|
|
37
|
+
|
|
38
|
+
function getIcon(variant) {
|
|
39
|
+
switch (variant) {
|
|
40
|
+
case "info":
|
|
41
|
+
return jsx(SvgInfoIcon, {});
|
|
42
|
+
case "success":
|
|
43
|
+
return jsx(SvgCheckCircleIcon, {});
|
|
44
|
+
case "warning":
|
|
45
|
+
return jsx(SvgExclamationIcon, {});
|
|
46
|
+
case "danger":
|
|
47
|
+
return jsx(SvgExclamationCircleIcon, {});
|
|
48
|
+
default:
|
|
49
|
+
return;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
function InlineAlert({ variant = "info", title, description, isIconHidden = false, isCloseable = false, role = "note", buttons, children, onClose, ...props }) {
|
|
53
|
+
return (jsxs("div", { className: `bcds-Inline-Alert ${variant}`, ...props, children: [!isIconHidden && (jsx("span", { className: "bcds-Inline-Alert--icon", children: getIcon(variant) })), jsx("div", { className: "bcds-Inline-Alert--container", role: role, "aria-labelledby": "alert-title", children: children ? (children) : (jsxs(Fragment, { children: [title && (jsx("span", { className: "title", id: "alert-title", children: title })), description && jsx("span", { className: "description", children: description }), buttons && (jsx(ButtonGroup, { alignment: "end", orientation: "horizontal", children: buttons }))] })) }), isCloseable && (jsx("span", { className: "bcds-Inline-Alert--closeIcon", children: jsx(Button, { variant: "tertiary", isIconButton: true, size: "small", "aria-label": "Close this alert", type: "button", onPress: onClose, children: jsx(SvgCloseIcon, {}) }) }))] }));
|
|
54
|
+
}
|
|
34
55
|
|
|
35
56
|
/*
|
|
36
57
|
* Copyright 2024 Adobe. All rights reserved.
|
|
@@ -5663,6 +5684,73 @@ function $e5be200c675c3b3a$var$isEqualValidation(a, b) {
|
|
|
5663
5684
|
return a && b && a.isInvalid === b.isInvalid && a.validationErrors.length === b.validationErrors.length && a.validationErrors.every((a, i)=>a === b.validationErrors[i]) && Object.entries(a.validationDetails).every(([k, v])=>b.validationDetails[k] === v);
|
|
5664
5685
|
}
|
|
5665
5686
|
|
|
5687
|
+
/*
|
|
5688
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
5689
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
5690
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
5691
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
5692
|
+
*
|
|
5693
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
5694
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
5695
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
5696
|
+
* governing permissions and limitations under the License.
|
|
5697
|
+
*/
|
|
5698
|
+
|
|
5699
|
+
|
|
5700
|
+
function $d2c8e2b0480f3f34$export$cbe85ee05b554577(props, state, ref) {
|
|
5701
|
+
let { isDisabled: isDisabled = false, isReadOnly: isReadOnly = false, value: value, name: name, children: children, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, validationState: validationState = 'valid', isInvalid: isInvalid } = props;
|
|
5702
|
+
let onChange = (e)=>{
|
|
5703
|
+
// since we spread props on label, onChange will end up there as well as in here.
|
|
5704
|
+
// so we have to stop propagation at the lowest level that we care about
|
|
5705
|
+
e.stopPropagation();
|
|
5706
|
+
state.setSelected(e.target.checked);
|
|
5707
|
+
};
|
|
5708
|
+
let hasChildren = children != null;
|
|
5709
|
+
let hasAriaLabel = ariaLabel != null || ariaLabelledby != null;
|
|
5710
|
+
if (!hasChildren && !hasAriaLabel) console.warn('If you do not provide children, you must specify an aria-label for accessibility');
|
|
5711
|
+
// This handles focusing the input on pointer down, which Safari does not do by default.
|
|
5712
|
+
let { pressProps: pressProps, isPressed: isPressed } = ($f6c31cce2adf654f$export$45712eceda6fad21)({
|
|
5713
|
+
isDisabled: isDisabled
|
|
5714
|
+
});
|
|
5715
|
+
// iOS does not toggle checkboxes if you drag off and back onto the label, so handle it ourselves.
|
|
5716
|
+
let { pressProps: labelProps, isPressed: isLabelPressed } = ($f6c31cce2adf654f$export$45712eceda6fad21)({
|
|
5717
|
+
isDisabled: isDisabled || isReadOnly,
|
|
5718
|
+
onPress () {
|
|
5719
|
+
state.toggle();
|
|
5720
|
+
}
|
|
5721
|
+
});
|
|
5722
|
+
let { focusableProps: focusableProps } = ($e6afbd83fe6ebbd2$export$4c014de7c8940b4c)(props, ref);
|
|
5723
|
+
let interactions = ($3ef42575df84b30b$export$9d1611c77c2fe928)(pressProps, focusableProps);
|
|
5724
|
+
let domProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props, {
|
|
5725
|
+
labelable: true
|
|
5726
|
+
});
|
|
5727
|
+
($99facab73266f662$export$5add1d006293d136)(ref, state.isSelected, state.setSelected);
|
|
5728
|
+
return {
|
|
5729
|
+
labelProps: ($3ef42575df84b30b$export$9d1611c77c2fe928)(labelProps, {
|
|
5730
|
+
onClick: (e)=>e.preventDefault()
|
|
5731
|
+
}),
|
|
5732
|
+
inputProps: ($3ef42575df84b30b$export$9d1611c77c2fe928)(domProps, {
|
|
5733
|
+
'aria-invalid': isInvalid || validationState === 'invalid' || undefined,
|
|
5734
|
+
'aria-errormessage': props['aria-errormessage'],
|
|
5735
|
+
'aria-controls': props['aria-controls'],
|
|
5736
|
+
'aria-readonly': isReadOnly || undefined,
|
|
5737
|
+
onChange: onChange,
|
|
5738
|
+
disabled: isDisabled,
|
|
5739
|
+
...value == null ? {} : {
|
|
5740
|
+
value: value
|
|
5741
|
+
},
|
|
5742
|
+
name: name,
|
|
5743
|
+
type: 'checkbox',
|
|
5744
|
+
...interactions
|
|
5745
|
+
}),
|
|
5746
|
+
isSelected: state.isSelected,
|
|
5747
|
+
isPressed: isPressed || isLabelPressed,
|
|
5748
|
+
isDisabled: isDisabled,
|
|
5749
|
+
isReadOnly: isReadOnly,
|
|
5750
|
+
isInvalid: isInvalid || validationState === 'invalid'
|
|
5751
|
+
};
|
|
5752
|
+
}
|
|
5753
|
+
|
|
5666
5754
|
/*
|
|
5667
5755
|
* Copyright 2020 Adobe. All rights reserved.
|
|
5668
5756
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -5744,6 +5832,35 @@ function $2baaea4c71418dea$export$294aa081a6c6f55d(props) {
|
|
|
5744
5832
|
};
|
|
5745
5833
|
}
|
|
5746
5834
|
|
|
5835
|
+
/*
|
|
5836
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
5837
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
5838
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
5839
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
5840
|
+
*
|
|
5841
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
5842
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
5843
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
5844
|
+
* governing permissions and limitations under the License.
|
|
5845
|
+
*/
|
|
5846
|
+
function $3017fa7ffdddec74$export$8042c6c013fd5226(props = {}) {
|
|
5847
|
+
let { isReadOnly: isReadOnly } = props;
|
|
5848
|
+
// have to provide an empty function so useControlledState doesn't throw a fit
|
|
5849
|
+
// can't use useControlledState's prop calling because we need the event object from the change
|
|
5850
|
+
let [isSelected, setSelected] = ($458b0a5536c1a7cf$export$40bfa8c7b0832715)(props.isSelected, props.defaultSelected || false, props.onChange);
|
|
5851
|
+
function updateSelected(value) {
|
|
5852
|
+
if (!isReadOnly) setSelected(value);
|
|
5853
|
+
}
|
|
5854
|
+
function toggleState() {
|
|
5855
|
+
if (!isReadOnly) setSelected(!isSelected);
|
|
5856
|
+
}
|
|
5857
|
+
return {
|
|
5858
|
+
isSelected: isSelected,
|
|
5859
|
+
setSelected: updateSelected,
|
|
5860
|
+
toggle: toggleState
|
|
5861
|
+
};
|
|
5862
|
+
}
|
|
5863
|
+
|
|
5747
5864
|
/*
|
|
5748
5865
|
* Copyright 2020 Adobe. All rights reserved.
|
|
5749
5866
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -10389,6 +10506,33 @@ function $bdd25dc72710631f$export$cbd84cdb2e668835(props) {
|
|
|
10389
10506
|
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
10390
10507
|
* governing permissions and limitations under the License.
|
|
10391
10508
|
*/
|
|
10509
|
+
function $b418ec0c85c52f27$export$d853f7095ae95f88(props, state, ref) {
|
|
10510
|
+
let { labelProps: labelProps, inputProps: inputProps, isSelected: isSelected, isPressed: isPressed, isDisabled: isDisabled, isReadOnly: isReadOnly } = ($d2c8e2b0480f3f34$export$cbe85ee05b554577)(props, state, ref);
|
|
10511
|
+
return {
|
|
10512
|
+
labelProps: labelProps,
|
|
10513
|
+
inputProps: {
|
|
10514
|
+
...inputProps,
|
|
10515
|
+
role: 'switch',
|
|
10516
|
+
checked: isSelected
|
|
10517
|
+
},
|
|
10518
|
+
isSelected: isSelected,
|
|
10519
|
+
isPressed: isPressed,
|
|
10520
|
+
isDisabled: isDisabled,
|
|
10521
|
+
isReadOnly: isReadOnly
|
|
10522
|
+
};
|
|
10523
|
+
}
|
|
10524
|
+
|
|
10525
|
+
/*
|
|
10526
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
10527
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
10528
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
10529
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
10530
|
+
*
|
|
10531
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
10532
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
10533
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
10534
|
+
* governing permissions and limitations under the License.
|
|
10535
|
+
*/
|
|
10392
10536
|
|
|
10393
10537
|
|
|
10394
10538
|
|
|
@@ -13232,6 +13376,76 @@ function $82d7e5349645de74$var$SelectValue(props, ref) {
|
|
|
13232
13376
|
|
|
13233
13377
|
|
|
13234
13378
|
|
|
13379
|
+
const $8e59e948500a8fe1$export$8699e3b644d5a28a = /*#__PURE__*/ (createContext)(null);
|
|
13380
|
+
function $8e59e948500a8fe1$var$Switch(props, ref) {
|
|
13381
|
+
let { inputRef: userProvidedInputRef = null, ...otherProps } = props;
|
|
13382
|
+
[props, ref] = ($64fa3d84918910a7$export$29f1550f4b0d4415)(otherProps, ref, $8e59e948500a8fe1$export$8699e3b644d5a28a);
|
|
13383
|
+
let inputRef = ($df56164dff5785e2$export$4338b53315abf666)(($5dc95899b306f630$export$c9058316764c140e)(userProvidedInputRef, props.inputRef !== undefined ? props.inputRef : null));
|
|
13384
|
+
let state = ($3017fa7ffdddec74$export$8042c6c013fd5226)(props);
|
|
13385
|
+
let { labelProps: labelProps, inputProps: inputProps, isSelected: isSelected, isDisabled: isDisabled, isReadOnly: isReadOnly, isPressed: isPressed } = ($b418ec0c85c52f27$export$d853f7095ae95f88)({
|
|
13386
|
+
...($64fa3d84918910a7$export$ef03459518577ad4)(props),
|
|
13387
|
+
// ReactNode type doesn't allow function children.
|
|
13388
|
+
children: typeof props.children === 'function' ? true : props.children
|
|
13389
|
+
}, state, inputRef);
|
|
13390
|
+
let { isFocused: isFocused, isFocusVisible: isFocusVisible, focusProps: focusProps } = ($f7dceffc5ad7768b$export$4e328f61c538687f)();
|
|
13391
|
+
let isInteractionDisabled = props.isDisabled || props.isReadOnly;
|
|
13392
|
+
let { hoverProps: hoverProps, isHovered: isHovered } = ($6179b936705e76d3$export$ae780daf29e6d456)({
|
|
13393
|
+
...props,
|
|
13394
|
+
isDisabled: isInteractionDisabled
|
|
13395
|
+
});
|
|
13396
|
+
let renderProps = ($64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
13397
|
+
...props,
|
|
13398
|
+
defaultClassName: 'react-aria-Switch',
|
|
13399
|
+
values: {
|
|
13400
|
+
isSelected: isSelected,
|
|
13401
|
+
isPressed: isPressed,
|
|
13402
|
+
isHovered: isHovered,
|
|
13403
|
+
isFocused: isFocused,
|
|
13404
|
+
isFocusVisible: isFocusVisible,
|
|
13405
|
+
isDisabled: isDisabled,
|
|
13406
|
+
isReadOnly: isReadOnly,
|
|
13407
|
+
state: state
|
|
13408
|
+
}
|
|
13409
|
+
});
|
|
13410
|
+
let DOMProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props);
|
|
13411
|
+
delete DOMProps.id;
|
|
13412
|
+
return /*#__PURE__*/ ($dbSRa$react).createElement("label", {
|
|
13413
|
+
...($3ef42575df84b30b$export$9d1611c77c2fe928)(DOMProps, labelProps, hoverProps, renderProps),
|
|
13414
|
+
ref: ref,
|
|
13415
|
+
slot: props.slot || undefined,
|
|
13416
|
+
"data-selected": isSelected || undefined,
|
|
13417
|
+
"data-pressed": isPressed || undefined,
|
|
13418
|
+
"data-hovered": isHovered || undefined,
|
|
13419
|
+
"data-focused": isFocused || undefined,
|
|
13420
|
+
"data-focus-visible": isFocusVisible || undefined,
|
|
13421
|
+
"data-disabled": isDisabled || undefined,
|
|
13422
|
+
"data-readonly": isReadOnly || undefined
|
|
13423
|
+
}, /*#__PURE__*/ ($dbSRa$react).createElement(($5c3e21d68f1c4674$export$439d29a4e110a164), {
|
|
13424
|
+
elementType: "span"
|
|
13425
|
+
}, /*#__PURE__*/ ($dbSRa$react).createElement("input", {
|
|
13426
|
+
...($3ef42575df84b30b$export$9d1611c77c2fe928)(inputProps, focusProps),
|
|
13427
|
+
ref: inputRef
|
|
13428
|
+
})), renderProps.children);
|
|
13429
|
+
}
|
|
13430
|
+
/**
|
|
13431
|
+
* A switch allows a user to turn a setting on or off.
|
|
13432
|
+
*/ const $8e59e948500a8fe1$export$b5d5cf8927ab7262 = /*#__PURE__*/ (forwardRef)($8e59e948500a8fe1$var$Switch);
|
|
13433
|
+
|
|
13434
|
+
/*
|
|
13435
|
+
* Copyright 2022 Adobe. All rights reserved.
|
|
13436
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
13437
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
13438
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
13439
|
+
*
|
|
13440
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
13441
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
13442
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
13443
|
+
* governing permissions and limitations under the License.
|
|
13444
|
+
*/
|
|
13445
|
+
|
|
13446
|
+
|
|
13447
|
+
|
|
13448
|
+
|
|
13235
13449
|
|
|
13236
13450
|
|
|
13237
13451
|
|
|
@@ -13683,20 +13897,27 @@ function $4e3b923658d69c60$var$TooltipInner(props) {
|
|
|
13683
13897
|
}, renderProps.children));
|
|
13684
13898
|
}
|
|
13685
13899
|
|
|
13686
|
-
var css_248z$
|
|
13687
|
-
styleInject(css_248z$
|
|
13900
|
+
var css_248z$b = ".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";
|
|
13901
|
+
styleInject(css_248z$b);
|
|
13688
13902
|
|
|
13689
13903
|
function Button({ size = "medium", variant = "primary", danger = false, isIconButton = false, ...props }) {
|
|
13690
13904
|
return (jsx($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { className: `bcds-react-aria-Button ${size} ${variant} ${danger ? "danger" : ""} ${isIconButton ? "icon" : ""}`, ...props }));
|
|
13691
13905
|
}
|
|
13692
13906
|
|
|
13907
|
+
var css_248z$a = ".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";
|
|
13908
|
+
styleInject(css_248z$a);
|
|
13909
|
+
|
|
13910
|
+
function ButtonGroup({ orientation = "horizontal", alignment = "start", ariaLabel, children, ...props }) {
|
|
13911
|
+
return (jsx("div", { className: `bcds-ButtonGroup ${orientation} ${alignment}`, role: "group", "aria-label": ariaLabel, ...props, children: children }));
|
|
13912
|
+
}
|
|
13913
|
+
|
|
13693
13914
|
// This logo is available as a plain SVG at src/assets/BCID_H_rgb_pos.svg
|
|
13694
13915
|
function SvgBcLogo({ id = "bcgov-logo" }) {
|
|
13695
13916
|
return (jsxs("svg", { id: id, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 847.65 327.01", children: [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" } }), jsxs("g", { children: [jsxs("g", { children: [jsx("rect", { x: "415.4", y: "252.98", width: "314.66", height: "3.82", style: { fill: "#e3a82b", strokeWidth: "0px" } }), 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" } }), 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" } }), 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" } }), 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" } }), 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" } }), 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" } }), 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" } }), 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" } }), 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" } }), 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" } }), 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" } }), jsxs("g", { children: [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" } }), 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" } }), 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" } }), 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" } })] }), jsx("rect", { width: "847.65", height: "327.01", style: { fill: "none", strokeWidth: "0px" } })] }), jsxs("g", { children: [jsx("polygon", { points: "295.89 176.17 301.27 178.4 313.19 170.08 295.89 176.17", style: { fill: "#e3a82b", strokeWidth: "0px" } }), 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" } })] }), 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" } })] })] }));
|
|
13696
13917
|
}
|
|
13697
13918
|
|
|
13698
|
-
var css_248z$
|
|
13699
|
-
styleInject(css_248z$
|
|
13919
|
+
var css_248z$9 = ".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-background-white);\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-background-white);\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";
|
|
13920
|
+
styleInject(css_248z$9);
|
|
13700
13921
|
|
|
13701
13922
|
function Header({ children, logoLinkElement, logoImage = jsx(SvgBcLogo, { id: "bcgov-logo-header" }), skipLinks, title = "", titleElement = "span", }) {
|
|
13702
13923
|
function getLogo() {
|
|
@@ -13729,8 +13950,8 @@ function Header({ children, logoLinkElement, logoImage = jsx(SvgBcLogo, { id: "b
|
|
|
13729
13950
|
}) })), title && (jsxs(Fragment, { children: [jsx("div", { className: "bcds-header--line" }), getTitle()] })), children] }) }));
|
|
13730
13951
|
}
|
|
13731
13952
|
|
|
13732
|
-
var css_248z$
|
|
13733
|
-
styleInject(css_248z$
|
|
13953
|
+
var css_248z$8 = ".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";
|
|
13954
|
+
styleInject(css_248z$8);
|
|
13734
13955
|
|
|
13735
13956
|
/**
|
|
13736
13957
|
* A titled list of links for use in the Footer. Rendered inside a `<figure>`
|
|
@@ -13784,8 +14005,8 @@ function Form({ ...props }) {
|
|
|
13784
14005
|
return jsx($d3e0e05bdfcf66bd$export$a7fed597f4b8afd8, { ...props });
|
|
13785
14006
|
}
|
|
13786
14007
|
|
|
13787
|
-
var css_248z$
|
|
13788
|
-
styleInject(css_248z$
|
|
14008
|
+
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/* Select input equivalent */\n.bcds-react-aria-Select--Button {\n background-color: var(--surface-color-forms-default);\n border: 1px solid var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n gap: var(--layout-margin-small);\n align-items: center;\n padding: 0 12px;\n max-width: 100%;\n}\n.bcds-react-aria-Select--Button.invalid {\n border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Select[data-invalid] > .bcds-react-aria-Select--Button {\n border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Select--Button[data-disabled] {\n background-color: var(--surface-color-forms-disabled);\n cursor: not-allowed;\n}\n.bcds-react-aria-Select--Button[data-hovered] {\n border-color: var(--surface-color-border-dark);\n}\n.bcds-react-aria-Select--Button[data-focused] {\n border-color: var(--surface-color-border-active);\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n.bcds-react-aria-Select--Button[data-pressed] {\n border-color: var(--surface-color-border-active);\n}\n.bcds-react-aria-Select--Button.medium {\n height: 40px;\n}\n.bcds-react-aria-Select--Button.small {\n height: 32px;\n}\n.bcds-react-aria-Select--Button > .bcds-react-aria-SelectValue {\n font: var(--typography-regular-body);\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n min-width: 0;\n}\n.bcds-react-aria-Select--Button > svg {\n flex-shrink: 0;\n}\n\n/* Dropdown menu panel */\n.bcds-react-aria-Select--Popover {\n background-color: var(--surface-color-forms-default);\n border: 1px solid var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n box-shadow: var(--surface-shadow-medium);\n box-sizing: border-box;\n overflow-y: auto;\n padding: var(--layout-margin-hair) var(--layout-padding-xsmall);\n width: var(\n --trigger-width\n ); /* Variable provided by Select component https://react-spectrum.adobe.com/react-aria/Select.html#popover-1 */\n}\n.bcds-react-aria-Select--ListBox[data-focused] {\n outline: none;\n}\n.bcds-react-aria-Select--ListBox > .bcds-react-aria-Section:not(:first-child) {\n border-top: 1px solid var(--surface-color-border-default);\n margin-top: 1px;\n padding-top: 2px;\n}\n\n/* Header label within Section of multi-section Select */\n.bcds-react-aria-Select--Header {\n color: var(--typography-color-secondary);\n font: var(--typography-regular-small-body);\n padding: var(--layout-margin-hair) var(--layout-padding-small);\n}\n\n/* ListBox option item */\n.bcds-react-aria-Select--ListBoxItem {\n border-radius: var(--layout-margin-xsmall);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-margin-small);\n padding: 6.5px var(--layout-padding-small);\n}\n.bcds-react-aria-Select--ListBoxItem[data-focused],\n.bcds-react-aria-Select--ListBoxItem[data-hovered] {\n background-color: var(--surface-color-secondary-button-hover);\n outline: none;\n}\n.bcds-react-aria-Select--ListBoxItem-icon {\n display: flex;\n align-items: center;\n justify-content: space-around;\n /* This `min-width` rule can cause horizontal overflow on very narrow Select\n instances, but if we leave it out, the icons will shrink instead. */\n min-width: 20px;\n}\n.bcds-react-aria-Select--ListBoxItem-Text-container {\n color: var(--typography-color-primary);\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n}\n.bcds-react-aria-Select--ListBoxItem-Text-label {\n font: var(--typography-regular-body);\n}\n.bcds-react-aria-Select--ListBoxItem.destructive {\n color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Select--ListBoxItem.destructive\n .bcds-react-aria-Select--ListBoxItem-Text-label {\n color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Select--ListBoxItem-Text-description {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n}\n";
|
|
14009
|
+
styleInject(css_248z$7);
|
|
13789
14010
|
|
|
13790
14011
|
function ChevronDown() {
|
|
13791
14012
|
return (jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M15.7882 9.15569L10.4858 14.236C10.3192 14.3748 10.1527 14.4303 10.0139 14.4303C9.84731 14.4303 9.68074 14.3748 9.54194 14.2637L4.21182 9.15569C3.9342 8.90584 3.9342 8.46167 4.18405 8.21182C4.4339 7.9342 4.87808 7.9342 5.12793 8.18405L10.0139 12.8479L14.872 8.18405C15.1219 7.9342 15.5661 7.9342 15.8159 8.21182C16.0658 8.46167 16.0658 8.90584 15.7882 9.15569Z", fill: "currentColor" }) }));
|
|
@@ -13796,14 +14017,14 @@ function ChevronUp() {
|
|
|
13796
14017
|
/* Icon displayed when input is in invalid state */
|
|
13797
14018
|
const iconError$1 = (jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { id: "20px/Error icon", children: jsx("path", { id: "Icon", d: "M17.835 15.0312C18.335 15.9062 17.71 17 16.6787 17H3.33499C2.30374 17 1.67874 15.9062 2.14749 15.0312L8.83499 3.65625C9.11624 3.21875 9.55373 3 10.0225 3C10.46 3 10.8975 3.21875 11.1787 3.65625L17.835 15.0312ZM3.64749 15.5H16.3663L9.99123 4.65625L3.64749 15.5ZM10.0225 12.5625C10.5537 12.5625 10.9912 13 10.9912 13.5312C10.9912 14.0625 10.5537 14.5 10.0225 14.5C9.45998 14.5 9.02249 14.0625 9.02249 13.5312C9.02249 13 9.45998 12.5625 10.0225 12.5625ZM9.27249 7.75C9.27249 7.34375 9.58498 7 10.0225 7C10.4287 7 10.7725 7.34375 10.7725 7.75V10.75C10.7725 11.1875 10.4287 11.5 10.0225 11.5C9.58498 11.5 9.27249 11.1875 9.27249 10.75V7.75Z", fill: "var(--icons-color-danger)" }) }) }));
|
|
13798
14019
|
/** Select displays a collapsible list of options and allows a user to select one of them. */
|
|
13799
|
-
function Select({ items, sections, label, placeholder, size = "medium", errorMessage, ...props }) {
|
|
14020
|
+
function Select({ items, sections, label, description, placeholder, size = "medium", errorMessage, ...props }) {
|
|
13800
14021
|
return (jsx($82d7e5349645de74$export$ef9b1a59e592288f, { ...props, className: "bcds-react-aria-Select", children: ({ isOpen, isRequired, isInvalid }) => (jsxs(Fragment, { children: [label && (jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-Select--Label", children: isRequired ? `${label} (required)` : label })), jsxs($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { className: `bcds-react-aria-Select--Button ${size === "medium" ? "medium" : "small"} ${isInvalid && "invalid"}`, children: [jsx($82d7e5349645de74$export$e288731fd71264f0, { className: "bcds-react-aria-SelectValue", children: (value) => {
|
|
13801
14022
|
if (value.selectedText)
|
|
13802
14023
|
return value.selectedText;
|
|
13803
14024
|
if (placeholder)
|
|
13804
14025
|
return placeholder;
|
|
13805
14026
|
return "Select an item";
|
|
13806
|
-
} }), isInvalid && iconError$1, isOpen ? jsx(ChevronUp, {}) : jsx(ChevronDown, {})] }), jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { className: "bcds-react-aria-Select--Error", children: errorMessage }), jsx($07b14b47974efb58$export$5b6b19405a83ff9d, { className: "bcds-react-aria-Select--Popover", offset: 4, children: jsx($eed445e0843c11d0$export$41f133550aa26f48, { className: "bcds-react-aria-Select--ListBox",
|
|
14027
|
+
} }), isInvalid && iconError$1, isOpen ? jsx(ChevronUp, {}) : jsx(ChevronDown, {})] }), description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: `bcds-react-aria-Select--Description`, children: description })), jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { className: "bcds-react-aria-Select--Error", children: errorMessage }), jsx($07b14b47974efb58$export$5b6b19405a83ff9d, { className: "bcds-react-aria-Select--Popover", offset: 4, children: jsx($eed445e0843c11d0$export$41f133550aa26f48, { className: "bcds-react-aria-Select--ListBox",
|
|
13807
14028
|
// This ternary statement is used to mock the data for `sections`
|
|
13808
14029
|
// if a flat list of `items` was passed instead. This allows us to
|
|
13809
14030
|
// use one component to support both flat and sectioned lists of
|
|
@@ -13815,34 +14036,50 @@ function Select({ items, sections, label, placeholder, size = "medium", errorMes
|
|
|
13815
14036
|
: [{ id: "section", header: "", items: items ? items : [] }], children: (section) => (jsxs($7135fc7d473fd974$export$6e2c8f0811a474ce, { id: section.id, className: "bcds-react-aria-Section", children: [section?.header && (jsx($72a5793c14baf454$export$8b251419efc915eb, { className: "bcds-react-aria-Select--Header", children: section.header })), jsx($e1995378a142960e$export$fb8073518f34e6ec, { items: section.items, children: (item) => (jsxs($eed445e0843c11d0$export$a11e76429ed99b4, { id: item?.id ? item.id : item.label, className: `bcds-react-aria-Select--ListBoxItem ${item?.isDestructive ? "destructive" : ""}`, textValue: item.label, children: [item?.iconLeft && (jsx("div", { className: "bcds-react-aria-Select--ListBoxItem-icon", children: item.iconLeft })), jsxs("div", { className: "bcds-react-aria-Select--ListBoxItem-Text-container", children: [jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "label", className: "bcds-react-aria-Select--ListBoxItem-Text-label", children: item.label }), item.description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-Select--ListBoxItem-Text-description", children: item.description }))] }), item?.iconRight && (jsx("div", { className: "bcds-react-aria-Select--ListBoxItem-icon", children: item.iconRight }))] })) })] })) }) })] })) }));
|
|
13816
14037
|
}
|
|
13817
14038
|
|
|
13818
|
-
|
|
13819
|
-
|
|
14039
|
+
function SvgCheckCircleIcon({ id = "check-icon" }) {
|
|
14040
|
+
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M12.4688 7.46875C12.75 7.1875 13.2188 7.1875 13.5 7.5C13.8125 7.78125 13.8125 8.25 13.5 8.53125L9.5 12.5312C9.375 12.6875 9.1875 12.75 9 12.75C8.78125 12.75 8.59375 12.6875 8.4375 12.5312L6.4375 10.5312C6.125 10.25 6.125 9.78125 6.4375 9.46875C6.71875 9.1875 7.1875 9.1875 7.5 9.46875L9 10.9688L12.4688 7.46875ZM10 2C14.4062 2 18 5.59375 18 10C18 14.4375 14.4062 18 10 18C5.5625 18 2 14.4375 2 10C2 5.59375 5.5625 2 10 2ZM10 16.5C13.5625 16.5 16.5 13.5938 16.5 10C16.5 6.4375 13.5625 3.5 10 3.5C6.40625 3.5 3.5 6.4375 3.5 10C3.5 13.5938 6.40625 16.5 10 16.5Z", fill: "currentColor" }) }) }));
|
|
14041
|
+
}
|
|
14042
|
+
|
|
14043
|
+
// This icon is available as a plain SVG at src/assets/icon-exclamation.svg
|
|
14044
|
+
function SvgExclamationIcon({ id = "exclamation-icon" }) {
|
|
14045
|
+
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M17.835 15.0312C18.335 15.9062 17.71 17 16.6787 17H3.33499C2.30374 17 1.67874 15.9062 2.14749 15.0312L8.83499 3.65625C9.11624 3.21875 9.55373 3 10.0225 3C10.46 3 10.8975 3.21875 11.1787 3.65625L17.835 15.0312ZM3.64749 15.5H16.3663L9.99123 4.65625L3.64749 15.5ZM10.0225 12.5625C10.5537 12.5625 10.9912 13 10.9912 13.5312C10.9912 14.0625 10.5537 14.5 10.0225 14.5C9.45998 14.5 9.02249 14.0625 9.02249 13.5312C9.02249 13 9.45998 12.5625 10.0225 12.5625ZM9.27249 7.75C9.27249 7.34375 9.58498 7 10.0225 7C10.4287 7 10.7725 7.34375 10.7725 7.75V10.75C10.7725 11.1875 10.4287 11.5 10.0225 11.5C9.58498 11.5 9.27249 11.1875 9.27249 10.75V7.75Z", fill: "currentColor" }) }) }));
|
|
14046
|
+
}
|
|
14047
|
+
|
|
14048
|
+
function SvgExclamationCircleIcon({ id = "exclamation-icon-circle", }) {
|
|
14049
|
+
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M9.99999 2C14.4062 2 18 5.59375 18 10C18 14.4375 14.4062 18 9.99999 18C5.56249 18 1.99998 14.4375 1.99998 10C1.99998 5.59375 5.56249 2 9.99999 2ZM9.99999 16.5C13.5625 16.5 16.5 13.5938 16.5 10C16.5 6.4375 13.5625 3.5 9.99999 3.5C6.40624 3.5 3.49999 6.4375 3.49999 10C3.49999 13.5938 6.40624 16.5 9.99999 16.5ZM9.99999 11.5C9.56249 11.5 9.24999 11.1875 9.24999 10.75V6.75C9.24999 6.34375 9.56249 6 9.99999 6C10.4062 6 10.75 6.34375 10.75 6.75V10.75C10.75 11.1875 10.4062 11.5 9.99999 11.5ZM9.99999 12.5625C10.5312 12.5625 10.9687 13 10.9687 13.5312C10.9687 14.0625 10.5312 14.5 9.99999 14.5C9.43749 14.5 8.99999 14.0625 8.99999 13.5312C8.99999 13 9.43749 12.5625 9.99999 12.5625Z", fill: "currentColor" }) }) }));
|
|
14050
|
+
}
|
|
14051
|
+
|
|
14052
|
+
function SvgCloseIcon({ id = "close-icon" }) {
|
|
14053
|
+
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M16 5.21286L14.7871 4L10 8.78714L5.21286 4L4 5.21286L8.78714 10L4 14.7871L5.21286 16L10 11.2129L14.7871 16L16 14.7871L11.2129 10L16 5.21286Z", fill: "currentColor" }) }) }));
|
|
14054
|
+
}
|
|
14055
|
+
|
|
14056
|
+
function SvgInfoIcon({ id = "information-icon" }) {
|
|
14057
|
+
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M9.99999 2C14.4062 2 18 5.59375 18 10C18 14.4375 14.4062 18 9.99999 18C5.56249 18 1.99998 14.4375 1.99998 10C1.99998 5.59375 5.56249 2 9.99999 2ZM9.99999 16.5C13.5625 16.5 16.5 13.5938 16.5 10C16.5 6.4375 13.5625 3.5 9.99999 3.5C6.40624 3.5 3.49999 6.4375 3.49999 10C3.49999 13.5938 6.40624 16.5 9.99999 16.5ZM11.25 12.5C11.6562 12.5 12 12.8438 12 13.25C12 13.6875 11.6562 14 11.25 14H8.74999C8.31249 14 7.99999 13.6875 7.99999 13.25C7.99999 12.8438 8.31249 12.5 8.74999 12.5H9.24999V10.5H8.99999C8.56249 10.5 8.24999 10.1875 8.24999 9.75C8.24999 9.34375 8.56249 9 8.99999 9H9.99999C10.4062 9 10.75 9.34375 10.75 9.75V12.5H11.25ZM9.99999 8C9.43749 8 8.99999 7.5625 8.99999 7C8.99999 6.46875 9.43749 6 9.99999 6C10.5312 6 11 6.46875 11 7C11 7.5625 10.5312 8 9.99999 8Z", fill: "currentColor" }) }) }));
|
|
14058
|
+
}
|
|
14059
|
+
|
|
14060
|
+
var css_248z$6 = ".bcds-react-aria-Tag {\n color: var(--typography-color-primary);\n cursor: pointer;\n border-radius: var(--layout-margin-hair);\n border: 1px solid;\n display: flex;\n align-items: center;\n gap: 8px;\n font: var(--typography-regular-label);\n padding: 2px 8px;\n width: fit-content;\n}\n.bcds-react-aria-Tag .react-aria-Button {\n background: none;\n border: none;\n color: var(--typography-color-primary);\n cursor: pointer;\n display: flex;\n margin: 0;\n padding: 0;\n}\n\n/* Tag colors */\n.bcds-react-aria-Tag.bc-blue {\n background-color: var(--theme-primary-blue);\n border-color: var(--theme-blue-90);\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.bc-blue .react-aria-Button {\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.bc-gold {\n background-color: var(--theme-primary-gold);\n border-color: var(--theme-blue-90);\n}\n.bcds-react-aria-Tag.blue {\n background-color: var(--support-surface-color-info);\n border-color: var(--support-border-color-info);\n}\n.bcds-react-aria-Tag.dark {\n background: var(--theme-gray-110);\n border-color: var(--theme-blue-90);\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.dark .react-aria-Button {\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.gray,\n.bcds-react-aria-Tag.grey {\n background-color: var(--theme-gray-20);\n border-color: var(--surface-color-border-dark);\n}\n.bcds-react-aria-Tag.green {\n background-color: var(--support-surface-color-success);\n border-color: var(--support-border-color-success);\n}\n.bcds-react-aria-Tag.red {\n background-color: var(--support-surface-color-danger);\n border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Tag.yellow {\n background-color: var(--support-surface-color-warning);\n border-color: var(--support-border-color-warning);\n}\n\n/* Selected */\n.bcds-react-aria-Tag[data-selected] {\n border-radius: var(--layout-border-radius-small);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-active);\n}\n\n/* Focused */\n.bcds-react-aria-Tag[data-focused] {\n outline: var(--layout-border-width-medium) solid\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Disabled */\n.bcds-react-aria-Tag[data-disabled] {\n background-color: var(--surface-color-primary-button-disabled);\n border-color: var(--surface-color-border-default);\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n";
|
|
14061
|
+
styleInject(css_248z$6);
|
|
13820
14062
|
|
|
13821
14063
|
function Tag({ color = "blue", icon, id, textValue }) {
|
|
13822
14064
|
return (jsx($eaf9e70818b436db$export$3288d34c523a1192, { className: `bcds-react-aria-Tag ${color}`, id: id, textValue: textValue, children: ({ allowsRemoving, isDisabled }) => (jsxs(Fragment, { children: [icon, textValue, !isDisabled && allowsRemoving && (jsx($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { "aria-label": `Remove ${textValue}`, slot: "remove", children: jsx("svg", { width: "14", height: "15", viewBox: "0 0 14 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { id: "Icons / Close", children: jsx("path", { id: "Vector", d: "M12.6004 3.03239L11.4684 1.90039L7.00039 6.36839L2.53239 1.90039L1.40039 3.03239L5.86839 7.50039L1.40039 11.9684L2.53239 13.1004L7.00039 8.63239L11.4684 13.1004L12.6004 11.9684L8.13239 7.50039L12.6004 3.03239Z", fill: "currentColor" }) }) }) }))] })) }));
|
|
13823
14065
|
}
|
|
13824
14066
|
|
|
13825
|
-
var css_248z$
|
|
13826
|
-
styleInject(css_248z$
|
|
14067
|
+
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";
|
|
14068
|
+
styleInject(css_248z$5);
|
|
13827
14069
|
|
|
13828
14070
|
function TagGroup({ children, label, description, errorMessage, ...props }) {
|
|
13829
|
-
return (jsxs($eaf9e70818b436db$export$67ea30858aaf75e3, { className: "bcds-react-aria-TagGroup", ...props, children: [label && (jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TagGroup--Label", children: label })), children, description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-TagGroup--Text-description", children: description })), errorMessage && (
|
|
14071
|
+
return (jsxs($eaf9e70818b436db$export$67ea30858aaf75e3, { className: "bcds-react-aria-TagGroup", ...props, children: [label && (jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TagGroup--Label", children: label })), children, description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-TagGroup--Text-description", children: description })), errorMessage && (jsxs($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "errorMessage", className: "bcds-react-aria-TagGroup--Text-error", children: [jsx(SvgExclamationIcon, {}), errorMessage] }))] }));
|
|
13830
14072
|
}
|
|
13831
14073
|
|
|
13832
|
-
var css_248z$
|
|
13833
|
-
styleInject(css_248z$
|
|
14074
|
+
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";
|
|
14075
|
+
styleInject(css_248z$4);
|
|
13834
14076
|
|
|
13835
14077
|
function TagList({ items, orientation = "horizontal", renderEmptyState, ...props }) {
|
|
13836
14078
|
return (jsx($eaf9e70818b436db$export$f9fef0f55402315b, { className: `bcds-react-aria-TagList ${orientation}`, ...props, renderEmptyState: renderEmptyState, items: items, children: (item) => createElement(Tag, { ...item, key: item.id }) }));
|
|
13837
14079
|
}
|
|
13838
14080
|
|
|
13839
|
-
var css_248z$
|
|
13840
|
-
styleInject(css_248z$
|
|
13841
|
-
|
|
13842
|
-
// This icon is available as a plain SVG at src/assets/icon-exclamation.svg
|
|
13843
|
-
function SvgExclamationIcon({ id = "exclamation-icon" }) {
|
|
13844
|
-
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M17.835 15.0312C18.335 15.9062 17.71 17 16.6787 17H3.33499C2.30374 17 1.67874 15.9062 2.14749 15.0312L8.83499 3.65625C9.11624 3.21875 9.55373 3 10.0225 3C10.46 3 10.8975 3.21875 11.1787 3.65625L17.835 15.0312ZM3.64749 15.5H16.3663L9.99123 4.65625L3.64749 15.5ZM10.0225 12.5625C10.5537 12.5625 10.9912 13 10.9912 13.5312C10.9912 14.0625 10.5537 14.5 10.0225 14.5C9.45998 14.5 9.02249 14.0625 9.02249 13.5312C9.02249 13 9.45998 12.5625 10.0225 12.5625ZM9.27249 7.75C9.27249 7.34375 9.58498 7 10.0225 7C10.4287 7 10.7725 7.34375 10.7725 7.75V10.75C10.7725 11.1875 10.4287 11.5 10.0225 11.5C9.58498 11.5 9.27249 11.1875 9.27249 10.75V7.75Z", fill: "currentColor" }) }) }));
|
|
13845
|
-
}
|
|
14081
|
+
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: 1px solid var(--support-border-color-danger);\n background: var(--surface-color-forms-default);\n}\n\n.bcds-react-aria-TextArea[data-readonly]\n > .bcds-react-aria-TextArea--Container {\n background: var(--surface-color-forms-disabled);\n}\n\n.bcds-react-aria-TextArea[data-readonly]\n > .bcds-react-aria-TextArea--Container\n > .bcds-react-aria-TextArea--Input {\n background: var(--surface-color-forms-disabled);\n}\n\n/* Styles for the error message slot */\n.bcds-react-aria-TextArea--Error {\n display: flex;\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n\n.bcds-react-aria-TextArea--Error > svg {\n padding-right: var(--layout-padding-xsmall);\n color: var(--icons-color-danger);\n width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n";
|
|
14082
|
+
styleInject(css_248z$3);
|
|
13846
14083
|
|
|
13847
14084
|
function TextArea({ label, description, errorMessage, maxLength, onChange, value, ...props }) {
|
|
13848
14085
|
// handler for character counter, displayed when a maxLength is set
|
|
@@ -13855,8 +14092,8 @@ function TextArea({ label, description, errorMessage, maxLength, onChange, value
|
|
|
13855
14092
|
return (jsx($bcdf0525bf22703d$export$2c73285ae9390cec, { className: `bcds-react-aria-TextArea`, ...props, children: ({ isRequired, isInvalid }) => (jsxs(Fragment, { children: [label && (jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TextArea--Label", children: isRequired ? `${label} (required)` : label })), jsx("div", { className: "bcds-react-aria-TextArea--Container", children: jsx($216918bed6669f72$export$f5c9f3c2c4054eec, { className: "bcds-react-aria-TextArea--Input", value: value, onChange: (e) => handleChange(e.target.value) }) }), description || maxLength ? (jsxs("div", { className: "bcds-react-aria-TextArea--Description", children: [description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "text", children: description })), maxLength && (jsxs("div", { className: "counter", children: [charCount, "/", maxLength] }))] })) : null, isInvalid && (jsxs("div", { className: "bcds-react-aria-TextArea--Error", children: [jsx(SvgExclamationIcon, {}), jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { children: errorMessage })] }))] })) }));
|
|
13856
14093
|
}
|
|
13857
14094
|
|
|
13858
|
-
var css_248z$
|
|
13859
|
-
styleInject(css_248z$
|
|
14095
|
+
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 /* using margin token is kludgy, consider adding component-specific token for input sizing */\n height: var(--layout-margin-xlarge);\n min-height: var(--layout-margin-xlarge);\n}\n\n.bcds-react-aria-TextField--container.medium {\n /* using margin token is kludgy, consider adding component-specific token for input sizing */\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: 1px solid 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";
|
|
14096
|
+
styleInject(css_248z$2);
|
|
13860
14097
|
|
|
13861
14098
|
/* Icon displayed when input is in invalid state */
|
|
13862
14099
|
const iconError = (jsx("svg", { width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { id: "20px/Error icon", children: jsx("path", { id: "Icon", d: "M17.835 15.0312C18.335 15.9062 17.71 17 16.6787 17H3.33499C2.30374 17 1.67874 15.9062 2.14749 15.0312L8.83499 3.65625C9.11624 3.21875 9.55373 3 10.0225 3C10.46 3 10.8975 3.21875 11.1787 3.65625L17.835 15.0312ZM3.64749 15.5H16.3663L9.99123 4.65625L3.64749 15.5ZM10.0225 12.5625C10.5537 12.5625 10.9912 13 10.9912 13.5312C10.9912 14.0625 10.5537 14.5 10.0225 14.5C9.45998 14.5 9.02249 14.0625 9.02249 13.5312C9.02249 13 9.45998 12.5625 10.0225 12.5625ZM9.27249 7.75C9.27249 7.34375 9.58498 7 10.0225 7C10.4287 7 10.7725 7.34375 10.7725 7.75V10.75C10.7725 11.1875 10.4287 11.5 10.0225 11.5C9.58498 11.5 9.27249 11.1875 9.27249 10.75V7.75Z", fill: "var(--icons-color-danger)" }) }) }));
|
|
@@ -13864,6 +14101,13 @@ function TextField({ size, label, description, errorMessage, iconLeft, iconRight
|
|
|
13864
14101
|
return (jsx($bcdf0525bf22703d$export$2c73285ae9390cec, { className: "bcds-react-aria-TextField", ...props, children: ({ isRequired, isInvalid }) => (jsxs(Fragment, { children: [label && (jsxs($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TextField--Label", children: [label, isRequired && (jsx("span", { className: "bcds-react-aria-TextField--Label required", children: "(required)" }))] })), jsxs("div", { className: `bcds-react-aria-TextField--container ${size === "small" ? "small" : "medium"}`, children: [iconLeft, jsx($3985021b0ad6602f$export$f5b8910cec6cf069, { className: "bcds-react-aria-TextField--Input" }), isInvalid && iconError, iconRight] }), description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: `bcds-react-aria-TextField--Description`, children: description })), jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { className: "bcds-react-aria-TextField--Error", children: errorMessage })] })) }));
|
|
13865
14102
|
}
|
|
13866
14103
|
|
|
14104
|
+
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-forms-disabled);\n border-radius: var(--icons-size-medium);\n transition: all 200ms;\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-background-light-gray);\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\n/* Selected */\n.bcds-react-aria-Switch[data-selected] > .indicator {\n background-color: var(--surface-color-primary-button-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-button-default);\n}\n\n/* Hover */\n.bcds-react-aria-Switch[data-hovered] > .indicator {\n cursor: pointer;\n}\n\n.bcds-react-aria-Switch[data-hovered][data-selected] > .indicator {\n cursor: pointer;\n background-color: var(--surface-color-primary-button-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-button-default);\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}\n\n.bcds-react-aria-Switch[data-disabled] > .indicator {\n background-color: var(--surface-color-forms-disabled);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-Switch[data-disabled] > .indicator::before {\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] > .indicator {\n cursor: not-allowed;\n}\n";
|
|
14105
|
+
styleInject(css_248z$1);
|
|
14106
|
+
|
|
14107
|
+
function Switch({ labelPosition = "right", children, ...props }) {
|
|
14108
|
+
return (jsxs($8e59e948500a8fe1$export$b5d5cf8927ab7262, { className: `bcds-react-aria-Switch`, ...props, children: [labelPosition === "left" && jsx(Fragment, { children: children }), jsx("div", { className: "indicator" }), labelPosition === "right" && jsx(Fragment, { children: children })] }));
|
|
14109
|
+
}
|
|
14110
|
+
|
|
13867
14111
|
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";
|
|
13868
14112
|
styleInject(css_248z);
|
|
13869
14113
|
|
|
@@ -13875,5 +14119,5 @@ function Tooltip(props) {
|
|
|
13875
14119
|
return (jsxs($4e3b923658d69c60$export$28c660c63b792dea, { className: "bcds-react-aria-Tooltip", ...props, children: [jsx($44f671af83e7d9e0$export$746d02f47f4d381, { className: "bcds-react-aria-OverlayArrow", children: jsx(SvgTooltipArrowUp, {}) }), jsx(Fragment, { children: props.children })] }));
|
|
13876
14120
|
}
|
|
13877
14121
|
|
|
13878
|
-
export { Button, Footer, FooterLinks, Form, Header, Select, SvgBcLogo, Tag, TagGroup, TagList, TextArea, TextField, Tooltip, $4e3b923658d69c60$export$8c610744efcf8a1d as TooltipTrigger };
|
|
14122
|
+
export { Button, ButtonGroup, Footer, FooterLinks, Form, Header, InlineAlert, Select, SvgBcLogo, SvgCheckCircleIcon, SvgCloseIcon, SvgExclamationCircleIcon, SvgExclamationIcon, SvgInfoIcon, Switch, Tag, TagGroup, TagList, TextArea, TextField, Tooltip, $4e3b923658d69c60$export$8c610744efcf8a1d as TooltipTrigger };
|
|
13879
14123
|
//# sourceMappingURL=index.js.map
|