@bcgov/design-system-react-components 0.2.1 → 0.2.2-pr472
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 +15 -13
- package/dist/cjs/index.cjs +974 -70
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/types/components/Checkbox/Checkbox.d.ts +3 -0
- package/dist/cjs/types/components/Checkbox/Checkbox.test.d.ts +1 -0
- package/dist/cjs/types/components/Checkbox/index.d.ts +2 -0
- package/dist/cjs/types/components/CheckboxGroup/CheckboxGroup.d.ts +11 -0
- package/dist/cjs/types/components/CheckboxGroup/CheckboxGroup.test.d.ts +1 -0
- package/dist/cjs/types/components/CheckboxGroup/index.d.ts +2 -0
- package/dist/cjs/types/components/Form/Form.d.ts +1 -2
- package/dist/cjs/types/components/Form/index.d.ts +1 -1
- package/dist/cjs/types/components/Icons/SvgCheckIcon/SvgCheckIcon.d.ts +3 -0
- package/dist/cjs/types/components/Icons/SvgCheckIcon/index.d.ts +1 -0
- package/dist/cjs/types/components/Icons/SvgDashIcon/SvgDashIcon.d.ts +3 -0
- package/dist/cjs/types/components/Icons/SvgDashIcon/index.d.ts +1 -0
- package/dist/cjs/types/components/Icons/SvgTooltipArrowUp/SvgTooltipArrowUp.d.ts +3 -0
- package/dist/cjs/types/components/Icons/SvgTooltipArrowUp/index.d.ts +1 -0
- package/dist/cjs/types/components/Radio/Radio.d.ts +3 -0
- package/dist/cjs/types/components/Radio/Radio.test.d.ts +1 -0
- package/dist/cjs/types/components/Radio/index.d.ts +2 -0
- package/dist/cjs/types/components/RadioGroup/RadioGroup.d.ts +12 -0
- package/dist/cjs/types/components/RadioGroup/RadioGroup.test.d.ts +1 -0
- package/dist/cjs/types/components/RadioGroup/index.d.ts +2 -0
- package/dist/cjs/types/components/Switch/Switch.d.ts +0 -1
- package/dist/cjs/types/components/index.d.ts +7 -0
- package/dist/esm/index.js +969 -72
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/Checkbox/Checkbox.d.ts +3 -0
- package/dist/esm/types/components/Checkbox/Checkbox.test.d.ts +1 -0
- package/dist/esm/types/components/Checkbox/index.d.ts +2 -0
- package/dist/esm/types/components/CheckboxGroup/CheckboxGroup.d.ts +11 -0
- package/dist/esm/types/components/CheckboxGroup/CheckboxGroup.test.d.ts +1 -0
- package/dist/esm/types/components/CheckboxGroup/index.d.ts +2 -0
- package/dist/esm/types/components/Form/Form.d.ts +1 -2
- package/dist/esm/types/components/Form/index.d.ts +1 -1
- package/dist/esm/types/components/Icons/SvgCheckIcon/SvgCheckIcon.d.ts +3 -0
- package/dist/esm/types/components/Icons/SvgCheckIcon/index.d.ts +1 -0
- package/dist/esm/types/components/Icons/SvgDashIcon/SvgDashIcon.d.ts +3 -0
- package/dist/esm/types/components/Icons/SvgDashIcon/index.d.ts +1 -0
- package/dist/esm/types/components/Icons/SvgTooltipArrowUp/SvgTooltipArrowUp.d.ts +3 -0
- package/dist/esm/types/components/Icons/SvgTooltipArrowUp/index.d.ts +1 -0
- package/dist/esm/types/components/Radio/Radio.d.ts +3 -0
- package/dist/esm/types/components/Radio/Radio.test.d.ts +1 -0
- package/dist/esm/types/components/Radio/index.d.ts +2 -0
- package/dist/esm/types/components/RadioGroup/RadioGroup.d.ts +12 -0
- package/dist/esm/types/components/RadioGroup/RadioGroup.test.d.ts +1 -0
- package/dist/esm/types/components/RadioGroup/index.d.ts +2 -0
- package/dist/esm/types/components/Switch/Switch.d.ts +0 -1
- package/dist/esm/types/components/index.d.ts +7 -0
- package/dist/index.d.ts +39 -4
- package/package.json +19 -16
package/dist/esm/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
|
-
import $dbSRa$react, { useMemo, cloneElement, useContext, useState, useRef, forwardRef,
|
|
2
|
+
import $dbSRa$react, { createContext, useMemo, cloneElement, useContext, useState, useRef, forwardRef, useCallback, useEffect, createElement } from 'react';
|
|
3
3
|
import $iETbY$reactdom, { createPortal, flushSync } from 'react-dom';
|
|
4
4
|
|
|
5
5
|
function styleInject(css, ref) {
|
|
@@ -29,8 +29,26 @@ function styleInject(css, ref) {
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
-
var css_248z$d = "/**\n * Do not edit directly, this file was auto-generated.\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; /* Default shadow for most content and UI elements */\n --surface-shadow-small: 0 0.6000000238418579px 1.7999999523162842px 0 #0000001a, 0 3.200000047683716px 7.199999809265137px 0 #00000021; /* Reduced shadow for secondary UI elements */\n --surface-shadow-medium: 0 1.2000000476837158px 3.5999999046325684px 0 #0000001a, 0 6.400000095367432px 14.399999618530273px 0 #00000021; /* Standard shadow for UI elements like cards and buttons */\n --surface-shadow-large: 0 4.800000190734863px 14.399999618530273px 0 #0000002e, 0 25.600000381469727px 57.599998474121094px 0 #00000038; /* Larger shadow for emphasis. Use sparingly */\n --surface-color-primary-button-default: #013366; /* Default fill colour for primary buttons */\n --surface-color-primary-button-hover: #1E5189; /* Fill colour used when user hovers over primary button */\n --surface-color-primary-button-disabled: #EDEBE9; /* Fill colour for inactive primary buttons */\n --surface-color-primary-danger-button-default: #CE3E39; /* Default fill colour for buttons in danger/warning state */\n --surface-color-primary-danger-button-hover: #A2312D; /* Fill colour used when user hovers over danger/warning button */\n --surface-color-primary-danger-button-disabled: #EDEBE9; /* Default fill colour for disabled danger/warning button */\n --surface-color-primary-default: #013366; /* Default theme colour for components and layout */\n --surface-color-primary-hover: #1E5189; /* Hover variant of surface.color.primary.default */\n --surface-color-primary-pressed: #01264C; /* Selected/pressed variant of surface.color.primary.default */\n --surface-color-primary-disabled: #EDEBE9; /* Disabled/inactive variant of surface.color.primary default */\n --surface-color-secondary-button-default: #FFFFFF; /* Fill colour for secondary buttons */\n --surface-color-secondary-button-hover: #EDEBE9; /* Fill colour used when user hovers over secondary button */\n --surface-color-secondary-button-disabled: #EDEBE9; /* Fill colour for inactive secondary buttons */\n --surface-color-secondary-default: #FFFFFF; /* Light theme colour for components and layout */\n --surface-color-secondary-hover: #EDEBE9; /* Hover variant of surface.color.secondary.default */\n --surface-color-secondary-pressed: #E0DEDC; /* Selected/pressed variant of surface.color.secondary.default */\n --surface-color-secondary-disabled: #EDEBE9; /* Disabled/inactive variant of surface.color.secondary default */\n --surface-color-tertiary-button-default: rgba(255,255,255,0); /* Default fill colour for tertiary buttons */\n --surface-color-tertiary-button-hover: #ECEAE8; /* Fill colour used when user hovers over tertiary button */\n --surface-color-tertiary-button-disabled: #EDEBE9; /* Fill colour for inactive tertiary buttons */\n --surface-color-tertiary-default: #FFFFFF00; /* Alternative light theme colour for components and layout */\n --surface-color-tertiary-hover: #ECEAE8; /* Hover variant of surface.color.tertiary.default */\n --surface-color-tertiary-pressed: #E0DEDC; /* Selected/pressed variant of surface.color.tertiary.default */\n --surface-color-tertiary-disabled: #EDEBE9; /* Disabled/inactive variant of surface.color.tertiary default */\n --surface-color-menus-default: #FFFFFF; /* Default fill colour for menu items */\n --surface-color-menus-hover: #EDEBE9; /* Fill colour used when user hovers over a menu item */\n --surface-color-forms-default: #FFFFFF; /* Default fill colour for form/input fields */\n --surface-color-forms-disabled: #EDEBE9; /* Fill colour for inactive/disabled form/input fields */\n --surface-color-background-white: #FFFFFF; /* White background */\n --surface-color-background-light-gray: #FAF9F8; /* Default background colour for layout */\n --surface-color-background-light-blue: #F1F8FE; /* Light blue background */\n --surface-color-background-dark-blue: #053662; /* Dark blue background */\n --surface-color-border-default: #D8D8D8; /* Lighter border colour for UI elements */\n --surface-color-border-medium: #898785; /* Default border colour for UI elements */\n --surface-color-border-dark: #353433; /* Used as a hover colour for form fields and inputs */\n --surface-color-border-active: #2E5DD7; /* Used as the active stroke colour for UI elements */\n --surface-color-overlay-default: rgba(0,0,0,0.45); /* Background overlay colour for images and modal dialogues */\n --support-surface-color-info: #F7F9FC;\n --support-surface-color-danger: #F4E1E2; /* Background colour for error, failure or danger messages */\n --support-surface-color-success: #F6FFF8; /* Background colour for success messages */\n --support-surface-color-warning: #FEF1D8; /* Background colour for warning messages */\n --support-border-color-info: #053662; /* Border stroke for general/informational messages */\n --support-border-color-danger: #CE3E39; /* Border stroke for error, failure or danger messages */\n --support-border-color-success: #42814A; /* Border stroke for success messages */\n --support-border-color-warning: #F8BB47; /* Border stroke for warning messages */\n --icons-size-xsmall: 14px; /* Smallest icon size */\n --icons-size-small: 16px;\n --icons-size-medium: 20px; /* Default icon size */\n --icons-size-large: 24px;\n --icons-size-xlarge: 32px; /* Largest icon size */\n --icons-color-primary: #2D2D2D; /* Default colour for icons */\n --icons-color-secondary: #474543; /* Alternative colour for secondary/miscellaneous icons */\n --icons-color-disabled: #9F9D9C; /* Use only for inactive/disabled icons */\n --icons-color-link: #255A90; /* Use for hyperlinked icons */\n --icons-color-info: #053662; /* Emphasis colour for icons in general/informational state */\n --icons-color-danger: #CE3E39; /* Emphasis colour for icons in error, failure or danger state */\n --icons-color-success: #42814A; /* Emphasis colour for icons in success state */\n --icons-color-warning: #F8BB47; /* Emphasis colour for icons in warning state */\n --icons-color-primary-invert: #FFFFFF; /* Default colour for icons on dark backgrounds */\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; /* No padding */\n --layout-padding-hair: 0.125rem; /* Smallest padding value for layout */\n --layout-padding-xsmall: 0.25rem;\n --layout-padding-small: 0.5rem;\n --layout-padding-medium: 1rem; /* Default padding value for layout */\n --layout-padding-large: 1.5rem;\n --layout-padding-xlarge: 2rem; /* Largest padding value for layout */\n --layout-margin-none: 0rem; /* No margin */\n --layout-margin-hair: 0.125rem; /* Smallest margin value for layout */\n --layout-margin-xsmall: 0.25rem;\n --layout-margin-small: 0.5rem; /* Default margin value for layout */\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; /* Largest margin value for layout */\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'; /* BC Sans font. Requires BC Sans package */\n --typography-line-heights-xxxdense: 1.125rem; /* Smallest line height */\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; /* Default line height */\n --typography-line-heights-sparse: 2.25rem;\n --typography-line-heights-xsparse: 3rem;\n --typography-line-heights-xxsparse: 3.375rem; /* Largest line height */\n --typography-line-heights-auto: AUTO; /* System token, used to generate type styles */\n --typography-font-weights-regular: 400; /* System token, used to generate text styles */\n --typography-font-weights-bold: 700; /* System token, used to generate text styles */\n --typography-font-weights-italic: Italic; /* DEPRECATED - will be removed in next major version. */\n --typography-font-weights-italic-weight: 400; /* System token, used to generate text styles */\n --typography-font-weights-italic-style: italic; /* System token, used to generate text styles */\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; /* System token, used to generate type styles */\n --typography-paragraph-spacing-0: 0; /* System token, used to generate type styles */\n --typography-regular-label: 400 0.75rem/1.125rem 'BC Sans'; /* Labels and captions */\n --typography-regular-small-body: 400 0.875rem/1.313rem 'BC Sans'; /* Smaller body text */\n --typography-regular-body: 400 1rem/1.688rem 'BC Sans'; /* Default body text */\n --typography-regular-large-body: 400 1.125rem/1.913rem 'BC Sans'; /* Larger body text */\n --typography-regular-h6: 400 1.125rem/1.913rem 'BC Sans'; /* Alternate (unbolded) style for Heading 6 */\n --typography-regular-h5: 400 1.25rem/2.125rem 'BC Sans'; /* Alternate (unbolded) style for Heading 5 */\n --typography-regular-h4: 400 1.5rem/2.25rem 'BC Sans'; /* Alternate (unbolded) style for Heading 4 */\n --typography-regular-h3: 400 1.75rem/3rem 'BC Sans'; /* Alternate (unbolded) style for Heading 3 */\n --typography-regular-h2: 400 2rem/3.375rem 'BC Sans'; /* Alternate (unbolded) style for Heading 2 */\n --typography-regular-h1: 400 2.25rem/3rem 'BC Sans'; /* Alternate (unbolded) style for Heading 1 */\n --typography-regular-display: 400 3rem/AUTO 'BC Sans'; /* Extra-large body text size. Do not use for headings */\n --typography-bold-label: 700 0.75rem/1.125rem 'BC Sans'; /* Labels and captions (bolded) */\n --typography-bold-small-body: 700 0.875rem/1.313rem 'BC Sans'; /* Default for small body text (bolded) */\n --typography-bold-body: 700 1rem/1.688rem 'BC Sans'; /* Default for body text (bolded) */\n --typography-bold-large-body: 700 1.125rem/1.913rem 'BC Sans'; /* Larger text size for body text (bolded) */\n --typography-bold-h6: 700 1.125rem/1.913rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H6 */\n --typography-bold-h5: 700 1.25rem/2.125rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H5 */\n --typography-bold-h4: 700 1.5rem/2.25rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H4 */\n --typography-bold-h3: 700 1.75rem/3rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H3 */\n --typography-bold-h2: 700 2rem/3rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H2 */\n --typography-bold-h1: 700 2.25rem/3.375rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H1 */\n --typography-bold-display: 700 3rem/AUTO 'BC Sans'; /* Extra-large font size (bolded). Do not use for headings */\n --typography-italic-label: 400 italic 0.75rem/1.125rem 'BC Sans'; /* Labels and captions (italic) */\n --typography-italic-small-body: 400 italic 0.875rem/1.313rem 'BC Sans'; /* Small body text (italic) */\n --typography-italic-body: 400 italic 1rem/1.688rem 'BC Sans'; /* Default for body text (italic) */\n --typography-italic-large-body: 400 italic 1.125rem/1.913rem 'BC Sans'; /* Larger text size for body text (italic) */\n --typography-italic-h6: 400 italic 1.125rem/1.913rem 'BC Sans'; /* Alternate (italic) style for Heading 6 */\n --typography-italic-h5: 400 italic 1.25rem/2.125rem 'BC Sans'; /* Alternate (italic) style for Heading 5 */\n --typography-italic-h4: 400 italic 1.5rem/2.25rem 'BC Sans'; /* Alternate (italic) style for Heading 4 */\n --typography-italic-h3: 400 italic 1.75rem/3.375rem 'BC Sans'; /* Alternate (italic) style for Heading 3 */\n --typography-italic-h2: 400 italic 2rem/3rem 'BC Sans'; /* Alternate (italic) style for Heading 2 */\n --typography-italic-h1: 400 italic 2.25rem/3.375rem 'BC Sans'; /* Alternate (italic) style for Heading 1 */\n --typography-italic-display: 400 italic 3rem/AUTO 'BC Sans'; /* Extra-large font size (italic). Do not use for headings */\n --typography-text-case-none: none;\n --typography-text-decoration-none: none; /* System token, used to generate type styles */\n --typography-paragraph-indent-0: 0px; /* System token, used to generate type styles */\n --typography-color-primary: #2D2D2D; /* Default colour for all body text and headings */\n --typography-color-secondary: #474543; /* Alternative colour for secondary/miscellaneous text */\n --typography-color-placeholder: #9F9D9C; /* Use for placeholder text in forms */\n --typography-color-disabled: #9F9D9C; /* Use only for text in inactive user interface elements */\n --typography-color-link: #255A90; /* Use for hyperlinks in body text and headings */\n --typography-color-danger: #CE3E39; /* Use for error, failure or danger message text */\n --typography-color-primary-invert: #FFFFFF; /* Default colour for text on dark backgrounds */\n --typography-color-secondary-invert: #ECEAE8; /* Secondary colour for text on dark backgrounds */\n --theme-gold-10: #FEF8E8; /* Gold scale — lightest */\n --theme-gold-20: #FEF0D8; /* Gold scale */\n --theme-gold-30: #FDE9C4; /* Gold scale */\n --theme-gold-40: #FCE2B0; /* Gold scale */\n --theme-gold-50: #FBDA9D; /* Gold scale */\n --theme-gold-60: #FBD389; /* Gold scale */\n --theme-gold-70: #FACC75; /* Gold scale */\n --theme-gold-80: #F9C462; /* Gold scale */\n --theme-gold-90: #F8BA47; /* Gold scale */\n --theme-gold-100: #FCBA19; /* Gold scale — darkest */\n --theme-blue-10: #F1F8FE; /* Blue scale — lightest */\n --theme-blue-20: #D8EAFD; /* Blue scale */\n --theme-blue-30: #C1DDFC; /* Blue scale */\n --theme-blue-40: #A8D0FB; /* Blue scale */\n --theme-blue-50: #91C4FA; /* Blue scale */\n --theme-blue-60: #7AB8F9; /* Blue scale */\n --theme-blue-70: #5595D9; /* Blue scale */\n --theme-blue-80: #3470B1; /* Blue scale */\n --theme-blue-90: #1E5189; /* Blue scale */\n --theme-blue-100: #013366; /* Blue scale — darkest */\n --theme-gray-10: #FAF9F8; /* Greyscale — lightest */\n --theme-gray-20: #F3F2F1; /* Greyscale */\n --theme-gray-30: #ECEAE8; /* Greyscale */\n --theme-gray-40: #E0DEDC; /* Greyscale */\n --theme-gray-50: #D1CFCD; /* Greyscale */\n --theme-gray-60: #C6C5C3; /* Greyscale */\n --theme-gray-70: #9F9D9C; /* Greyscale */\n --theme-gray-80: #605E5C; /* Greyscale */\n --theme-gray-90: #3D3C3B; /* Greyscale */\n --theme-gray-100: #353433; /* Greyscale */\n --theme-gray-110: #252423; /* Greyscale — darkest */\n --theme-gray-white: #FFFFFF; /* White */\n --theme-primary-blue: #013366; /* Primary Blue (Blue 100) */\n --theme-primary-gold: #FCBA19; /* Primary Gold (Gold 100) */\n}\n";
|
|
33
|
-
styleInject(css_248z$
|
|
32
|
+
var css_248z$h = "/**\n * Do not edit directly, this file was auto-generated.\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; /* Default shadow for most content and UI elements */\n --surface-shadow-small: 0 0.6000000238418579px 1.7999999523162842px 0 #0000001a, 0 3.200000047683716px 7.199999809265137px 0 #00000021; /* Reduced shadow for secondary UI elements */\n --surface-shadow-medium: 0 1.2000000476837158px 3.5999999046325684px 0 #0000001a, 0 6.400000095367432px 14.399999618530273px 0 #00000021; /* Standard shadow for UI elements like cards and buttons */\n --surface-shadow-large: 0 4.800000190734863px 14.399999618530273px 0 #0000002e, 0 25.600000381469727px 57.599998474121094px 0 #00000038; /* Larger shadow for emphasis. Use sparingly */\n --surface-color-primary-button-default: #013366; /* Default fill colour for primary buttons */\n --surface-color-primary-button-hover: #1E5189; /* Fill colour used when user hovers over primary button */\n --surface-color-primary-button-disabled: #EDEBE9; /* Fill colour for inactive primary buttons */\n --surface-color-primary-danger-button-default: #CE3E39; /* Default fill colour for buttons in danger/warning state */\n --surface-color-primary-danger-button-hover: #A2312D; /* Fill colour used when user hovers over danger/warning button */\n --surface-color-primary-danger-button-disabled: #EDEBE9; /* Default fill colour for disabled danger/warning button */\n --surface-color-primary-default: #013366; /* Default theme colour for components and layout */\n --surface-color-primary-hover: #1E5189; /* Hover variant of surface.color.primary.default */\n --surface-color-primary-pressed: #01264C; /* Selected/pressed variant of surface.color.primary.default */\n --surface-color-primary-disabled: #EDEBE9; /* Disabled/inactive variant of surface.color.primary default */\n --surface-color-secondary-button-default: #FFFFFF; /* Fill colour for secondary buttons */\n --surface-color-secondary-button-hover: #EDEBE9; /* Fill colour used when user hovers over secondary button */\n --surface-color-secondary-button-disabled: #EDEBE9; /* Fill colour for inactive secondary buttons */\n --surface-color-secondary-default: #FFFFFF; /* Light theme colour for components and layout */\n --surface-color-secondary-hover: #EDEBE9; /* Hover variant of surface.color.secondary.default */\n --surface-color-secondary-pressed: #E0DEDC; /* Selected/pressed variant of surface.color.secondary.default */\n --surface-color-secondary-disabled: #EDEBE9; /* Disabled/inactive variant of surface.color.secondary default */\n --surface-color-tertiary-button-default: rgba(255,255,255,0); /* Default fill colour for tertiary buttons */\n --surface-color-tertiary-button-hover: #ECEAE8; /* Fill colour used when user hovers over tertiary button */\n --surface-color-tertiary-button-disabled: #EDEBE9; /* Fill colour for inactive tertiary buttons */\n --surface-color-tertiary-default: #FFFFFF00; /* Alternative light theme colour for components and layout */\n --surface-color-tertiary-hover: #ECEAE8; /* Hover variant of surface.color.tertiary.default */\n --surface-color-tertiary-pressed: #E0DEDC; /* Selected/pressed variant of surface.color.tertiary.default */\n --surface-color-tertiary-disabled: #EDEBE9; /* Disabled/inactive variant of surface.color.tertiary default */\n --surface-color-menus-default: #FFFFFF; /* Default fill colour for menu items */\n --surface-color-menus-hover: #EDEBE9; /* Fill colour used when user hovers over a menu item */\n --surface-color-forms-default: #FFFFFF; /* Default fill colour for form/input fields */\n --surface-color-forms-disabled: #EDEBE9; /* Fill colour for inactive/disabled form/input fields */\n --surface-color-background-white: #FFFFFF; /* White background */\n --surface-color-background-light-gray: #FAF9F8; /* Default background colour for layout */\n --surface-color-background-light-blue: #F1F8FE; /* Light blue background */\n --surface-color-background-dark-blue: #053662; /* Dark blue background */\n --surface-color-border-default: #D8D8D8; /* Lighter border colour for UI elements */\n --surface-color-border-medium: #898785; /* Default border colour for UI elements */\n --surface-color-border-dark: #353433; /* Used as a hover colour for form fields and inputs */\n --surface-color-border-active: #2E5DD7; /* Used as the active stroke colour for UI elements */\n --surface-color-overlay-default: rgba(0,0,0,0.45); /* Background overlay colour for images and modal dialogues */\n --support-surface-color-info: #F7F9FC;\n --support-surface-color-danger: #F4E1E2; /* Background colour for error, failure or danger messages */\n --support-surface-color-success: #F6FFF8; /* Background colour for success messages */\n --support-surface-color-warning: #FEF1D8; /* Background colour for warning messages */\n --support-border-color-info: #053662; /* Border stroke for general/informational messages */\n --support-border-color-danger: #CE3E39; /* Border stroke for error, failure or danger messages */\n --support-border-color-success: #42814A; /* Border stroke for success messages */\n --support-border-color-warning: #F8BB47; /* Border stroke for warning messages */\n --icons-size-xsmall: 14px; /* Smallest icon size */\n --icons-size-small: 16px;\n --icons-size-medium: 20px; /* Default icon size */\n --icons-size-large: 24px;\n --icons-size-xlarge: 32px; /* Largest icon size */\n --icons-color-primary: #2D2D2D; /* Default colour for icons */\n --icons-color-secondary: #474543; /* Alternative colour for secondary/miscellaneous icons */\n --icons-color-disabled: #9F9D9C; /* Use only for inactive/disabled icons */\n --icons-color-link: #255A90; /* Use for hyperlinked icons */\n --icons-color-info: #053662; /* Emphasis colour for icons in general/informational state */\n --icons-color-danger: #CE3E39; /* Emphasis colour for icons in error, failure or danger state */\n --icons-color-success: #42814A; /* Emphasis colour for icons in success state */\n --icons-color-warning: #F8BB47; /* Emphasis colour for icons in warning state */\n --icons-color-primary-invert: #FFFFFF; /* Default colour for icons on dark backgrounds */\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; /* No padding */\n --layout-padding-hair: 0.125rem; /* Smallest padding value for layout */\n --layout-padding-xsmall: 0.25rem;\n --layout-padding-small: 0.5rem;\n --layout-padding-medium: 1rem; /* Default padding value for layout */\n --layout-padding-large: 1.5rem;\n --layout-padding-xlarge: 2rem; /* Largest padding value for layout */\n --layout-margin-none: 0rem; /* No margin */\n --layout-margin-hair: 0.125rem; /* Smallest margin value for layout */\n --layout-margin-xsmall: 0.25rem;\n --layout-margin-small: 0.5rem; /* Default margin value for layout */\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; /* Largest margin value for layout */\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'; /* BC Sans font. Requires BC Sans package */\n --typography-line-heights-xxxdense: 1.125rem; /* Smallest line height */\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; /* Default line height */\n --typography-line-heights-sparse: 2.25rem;\n --typography-line-heights-xsparse: 3rem;\n --typography-line-heights-xxsparse: 3.375rem; /* Largest line height */\n --typography-line-heights-auto: AUTO; /* System token, used to generate type styles */\n --typography-font-weights-regular: 400; /* System token, used to generate text styles */\n --typography-font-weights-bold: 700; /* System token, used to generate text styles */\n --typography-font-weights-italic: Italic; /* DEPRECATED - will be removed in next major version. */\n --typography-font-weights-italic-weight: 400; /* System token, used to generate text styles */\n --typography-font-weights-italic-style: italic; /* System token, used to generate text styles */\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; /* System token, used to generate type styles */\n --typography-paragraph-spacing-0: 0; /* System token, used to generate type styles */\n --typography-regular-label: 400 0.75rem/1.125rem 'BC Sans'; /* Labels and captions */\n --typography-regular-small-body: 400 0.875rem/1.313rem 'BC Sans'; /* Smaller body text */\n --typography-regular-body: 400 1rem/1.688rem 'BC Sans'; /* Default body text */\n --typography-regular-large-body: 400 1.125rem/1.913rem 'BC Sans'; /* Larger body text */\n --typography-regular-h6: 400 1.125rem/1.913rem 'BC Sans'; /* Alternate (unbolded) style for Heading 6 */\n --typography-regular-h5: 400 1.25rem/2.125rem 'BC Sans'; /* Alternate (unbolded) style for Heading 5 */\n --typography-regular-h4: 400 1.5rem/2.25rem 'BC Sans'; /* Alternate (unbolded) style for Heading 4 */\n --typography-regular-h3: 400 1.75rem/3rem 'BC Sans'; /* Alternate (unbolded) style for Heading 3 */\n --typography-regular-h2: 400 2rem/3.375rem 'BC Sans'; /* Alternate (unbolded) style for Heading 2 */\n --typography-regular-h1: 400 2.25rem/3rem 'BC Sans'; /* Alternate (unbolded) style for Heading 1 */\n --typography-regular-display: 400 3rem/AUTO 'BC Sans'; /* Extra-large body text size. Do not use for headings */\n --typography-bold-label: 700 0.75rem/1.125rem 'BC Sans'; /* Labels and captions (bolded) */\n --typography-bold-small-body: 700 0.875rem/1.313rem 'BC Sans'; /* Default for small body text (bolded) */\n --typography-bold-body: 700 1rem/1.688rem 'BC Sans'; /* Default for body text (bolded) */\n --typography-bold-large-body: 700 1.125rem/1.913rem 'BC Sans'; /* Larger text size for body text (bolded) */\n --typography-bold-h6: 700 1.125rem/1.913rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H6 */\n --typography-bold-h5: 700 1.25rem/2.125rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H5 */\n --typography-bold-h4: 700 1.5rem/2.25rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H4 */\n --typography-bold-h3: 700 1.75rem/3rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H3 */\n --typography-bold-h2: 700 2rem/3rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H2 */\n --typography-bold-h1: 700 2.25rem/3.375rem 'BC Sans'; /* Default style for Heading 6. Includes all sizing/spacing values for H1 */\n --typography-bold-display: 700 3rem/AUTO 'BC Sans'; /* Extra-large font size (bolded). Do not use for headings */\n --typography-italic-label: 400 italic 0.75rem/1.125rem 'BC Sans'; /* Labels and captions (italic) */\n --typography-italic-small-body: 400 italic 0.875rem/1.313rem 'BC Sans'; /* Small body text (italic) */\n --typography-italic-body: 400 italic 1rem/1.688rem 'BC Sans'; /* Default for body text (italic) */\n --typography-italic-large-body: 400 italic 1.125rem/1.913rem 'BC Sans'; /* Larger text size for body text (italic) */\n --typography-italic-h6: 400 italic 1.125rem/1.913rem 'BC Sans'; /* Alternate (italic) style for Heading 6 */\n --typography-italic-h5: 400 italic 1.25rem/2.125rem 'BC Sans'; /* Alternate (italic) style for Heading 5 */\n --typography-italic-h4: 400 italic 1.5rem/2.25rem 'BC Sans'; /* Alternate (italic) style for Heading 4 */\n --typography-italic-h3: 400 italic 1.75rem/3.375rem 'BC Sans'; /* Alternate (italic) style for Heading 3 */\n --typography-italic-h2: 400 italic 2rem/3rem 'BC Sans'; /* Alternate (italic) style for Heading 2 */\n --typography-italic-h1: 400 italic 2.25rem/3.375rem 'BC Sans'; /* Alternate (italic) style for Heading 1 */\n --typography-italic-display: 400 italic 3rem/AUTO 'BC Sans'; /* Extra-large font size (italic). Do not use for headings */\n --typography-text-case-none: none;\n --typography-text-decoration-none: none; /* System token, used to generate type styles */\n --typography-paragraph-indent-0: 0px; /* System token, used to generate type styles */\n --typography-color-primary: #2D2D2D; /* Default colour for all body text and headings */\n --typography-color-secondary: #474543; /* Alternative colour for secondary/miscellaneous text */\n --typography-color-placeholder: #9F9D9C; /* Use for placeholder text in forms */\n --typography-color-disabled: #9F9D9C; /* Use only for text in inactive user interface elements */\n --typography-color-link: #255A90; /* Use for hyperlinks in body text and headings */\n --typography-color-danger: #CE3E39; /* Use for error, failure or danger message text */\n --typography-color-primary-invert: #FFFFFF; /* Default colour for text on dark backgrounds */\n --typography-color-secondary-invert: #ECEAE8; /* Secondary colour for text on dark backgrounds */\n --theme-gold-10: #FEF8E8; /* Gold scale — lightest */\n --theme-gold-20: #FEF0D8; /* Gold scale */\n --theme-gold-30: #FDE9C4; /* Gold scale */\n --theme-gold-40: #FCE2B0; /* Gold scale */\n --theme-gold-50: #FBDA9D; /* Gold scale */\n --theme-gold-60: #FBD389; /* Gold scale */\n --theme-gold-70: #FACC75; /* Gold scale */\n --theme-gold-80: #F9C462; /* Gold scale */\n --theme-gold-90: #F8BA47; /* Gold scale */\n --theme-gold-100: #FCBA19; /* Gold scale — darkest */\n --theme-blue-10: #F1F8FE; /* Blue scale — lightest */\n --theme-blue-20: #D8EAFD; /* Blue scale */\n --theme-blue-30: #C1DDFC; /* Blue scale */\n --theme-blue-40: #A8D0FB; /* Blue scale */\n --theme-blue-50: #91C4FA; /* Blue scale */\n --theme-blue-60: #7AB8F9; /* Blue scale */\n --theme-blue-70: #5595D9; /* Blue scale */\n --theme-blue-80: #3470B1; /* Blue scale */\n --theme-blue-90: #1E5189; /* Blue scale */\n --theme-blue-100: #013366; /* Blue scale — darkest */\n --theme-gray-10: #FAF9F8; /* Greyscale — lightest */\n --theme-gray-20: #F3F2F1; /* Greyscale */\n --theme-gray-30: #ECEAE8; /* Greyscale */\n --theme-gray-40: #E0DEDC; /* Greyscale */\n --theme-gray-50: #D1CFCD; /* Greyscale */\n --theme-gray-60: #C6C5C3; /* Greyscale */\n --theme-gray-70: #9F9D9C; /* Greyscale */\n --theme-gray-80: #605E5C; /* Greyscale */\n --theme-gray-90: #3D3C3B; /* Greyscale */\n --theme-gray-100: #353433; /* Greyscale */\n --theme-gray-110: #252423; /* Greyscale — darkest */\n --theme-gray-white: #FFFFFF; /* White */\n --theme-primary-blue: #013366; /* Primary Blue (Blue 100) */\n --theme-primary-gold: #FCBA19; /* Primary Gold (Gold 100) */\n}\n";
|
|
33
|
+
styleInject(css_248z$h);
|
|
34
|
+
|
|
35
|
+
/*
|
|
36
|
+
* Copyright 2024 Adobe. All rights reserved.
|
|
37
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the 'License');
|
|
38
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
39
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
40
|
+
*
|
|
41
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
42
|
+
* the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
43
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
44
|
+
* governing permissions and limitations under the License.
|
|
45
|
+
*/
|
|
46
|
+
const $4e85f108e88277b8$export$b085522c77523c51 = (createContext)(null);
|
|
47
|
+
(createContext)(null);
|
|
48
|
+
(createContext)(null);
|
|
49
|
+
(createContext)(null);
|
|
50
|
+
(createContext)(null);
|
|
51
|
+
(createContext)({});
|
|
34
52
|
|
|
35
53
|
/*
|
|
36
54
|
* Copyright 2024 Adobe. All rights reserved.
|
|
@@ -5662,6 +5680,28 @@ function $e5be200c675c3b3a$var$isEqualValidation(a, b) {
|
|
|
5662
5680
|
if (a === b) return true;
|
|
5663
5681
|
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
5682
|
}
|
|
5683
|
+
function $e5be200c675c3b3a$export$75ee7c75d68f5b0e(...results) {
|
|
5684
|
+
let errors = new Set();
|
|
5685
|
+
let isInvalid = false;
|
|
5686
|
+
let validationDetails = {
|
|
5687
|
+
...$e5be200c675c3b3a$export$aca958c65c314e6c
|
|
5688
|
+
};
|
|
5689
|
+
for (let v of results){
|
|
5690
|
+
var _validationDetails, _key;
|
|
5691
|
+
for (let e of v.validationErrors)errors.add(e);
|
|
5692
|
+
// Only these properties apply for checkboxes.
|
|
5693
|
+
isInvalid || (isInvalid = v.isInvalid);
|
|
5694
|
+
for(let key in validationDetails)(_validationDetails = validationDetails)[_key = key] || (_validationDetails[_key] = v.validationDetails[key]);
|
|
5695
|
+
}
|
|
5696
|
+
validationDetails.valid = !isInvalid;
|
|
5697
|
+
return {
|
|
5698
|
+
isInvalid: isInvalid,
|
|
5699
|
+
validationErrors: [
|
|
5700
|
+
...errors
|
|
5701
|
+
],
|
|
5702
|
+
validationDetails: validationDetails
|
|
5703
|
+
};
|
|
5704
|
+
}
|
|
5665
5705
|
|
|
5666
5706
|
/*
|
|
5667
5707
|
* Copyright 2020 Adobe. All rights reserved.
|
|
@@ -5730,6 +5770,68 @@ function $d2c8e2b0480f3f34$export$cbe85ee05b554577(props, state, ref) {
|
|
|
5730
5770
|
};
|
|
5731
5771
|
}
|
|
5732
5772
|
|
|
5773
|
+
/*
|
|
5774
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
5775
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
5776
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
5777
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
5778
|
+
*
|
|
5779
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
5780
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
5781
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
5782
|
+
* governing permissions and limitations under the License.
|
|
5783
|
+
*/
|
|
5784
|
+
|
|
5785
|
+
|
|
5786
|
+
|
|
5787
|
+
function $406796ff087fe49b$export$e375f10ce42261c5(props, state, inputRef) {
|
|
5788
|
+
// Create validation state here because it doesn't make sense to add to general useToggleState.
|
|
5789
|
+
let validationState = ($e5be200c675c3b3a$export$fc1a364ae1f3ff10)({
|
|
5790
|
+
...props,
|
|
5791
|
+
value: state.isSelected
|
|
5792
|
+
});
|
|
5793
|
+
let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = validationState.displayValidation;
|
|
5794
|
+
let { labelProps: labelProps, inputProps: inputProps, isSelected: isSelected, isPressed: isPressed, isDisabled: isDisabled, isReadOnly: isReadOnly } = ($d2c8e2b0480f3f34$export$cbe85ee05b554577)({
|
|
5795
|
+
...props,
|
|
5796
|
+
isInvalid: isInvalid
|
|
5797
|
+
}, state, inputRef);
|
|
5798
|
+
($e93e671b31057976$export$b8473d3665f3a75a)(props, validationState, inputRef);
|
|
5799
|
+
let { isIndeterminate: isIndeterminate, isRequired: isRequired, validationBehavior: validationBehavior = 'aria' } = props;
|
|
5800
|
+
(useEffect)(()=>{
|
|
5801
|
+
// indeterminate is a property, but it can only be set via javascript
|
|
5802
|
+
// https://css-tricks.com/indeterminate-checkboxes/
|
|
5803
|
+
if (inputRef.current) inputRef.current.indeterminate = !!isIndeterminate;
|
|
5804
|
+
});
|
|
5805
|
+
return {
|
|
5806
|
+
labelProps: labelProps,
|
|
5807
|
+
inputProps: {
|
|
5808
|
+
...inputProps,
|
|
5809
|
+
checked: isSelected,
|
|
5810
|
+
'aria-required': isRequired && validationBehavior === 'aria' || undefined,
|
|
5811
|
+
required: isRequired && validationBehavior === 'native'
|
|
5812
|
+
},
|
|
5813
|
+
isSelected: isSelected,
|
|
5814
|
+
isPressed: isPressed,
|
|
5815
|
+
isDisabled: isDisabled,
|
|
5816
|
+
isReadOnly: isReadOnly,
|
|
5817
|
+
isInvalid: isInvalid,
|
|
5818
|
+
validationErrors: validationErrors,
|
|
5819
|
+
validationDetails: validationDetails
|
|
5820
|
+
};
|
|
5821
|
+
}
|
|
5822
|
+
|
|
5823
|
+
/*
|
|
5824
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
5825
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
5826
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
5827
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
5828
|
+
*
|
|
5829
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
5830
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
5831
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
5832
|
+
* governing permissions and limitations under the License.
|
|
5833
|
+
*/ const $1ae600c947479353$export$ec98120685d4f57d = new WeakMap();
|
|
5834
|
+
|
|
5733
5835
|
/*
|
|
5734
5836
|
* Copyright 2020 Adobe. All rights reserved.
|
|
5735
5837
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -5811,6 +5913,61 @@ function $2baaea4c71418dea$export$294aa081a6c6f55d(props) {
|
|
|
5811
5913
|
};
|
|
5812
5914
|
}
|
|
5813
5915
|
|
|
5916
|
+
/*
|
|
5917
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
5918
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
5919
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
5920
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
5921
|
+
*
|
|
5922
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
5923
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
5924
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
5925
|
+
* governing permissions and limitations under the License.
|
|
5926
|
+
*/
|
|
5927
|
+
|
|
5928
|
+
|
|
5929
|
+
|
|
5930
|
+
function $1e9fce0cfacc738b$export$49ff6f28c54f1cbe(props, state) {
|
|
5931
|
+
let { isDisabled: isDisabled, name: name, validationBehavior: validationBehavior = 'aria' } = props;
|
|
5932
|
+
let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
|
|
5933
|
+
let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = ($2baaea4c71418dea$export$294aa081a6c6f55d)({
|
|
5934
|
+
...props,
|
|
5935
|
+
// Checkbox group is not an HTML input element so it
|
|
5936
|
+
// shouldn't be labeled by a <label> element.
|
|
5937
|
+
labelElementType: 'span',
|
|
5938
|
+
isInvalid: isInvalid,
|
|
5939
|
+
errorMessage: props.errorMessage || validationErrors
|
|
5940
|
+
});
|
|
5941
|
+
($1ae600c947479353$export$ec98120685d4f57d).set(state, {
|
|
5942
|
+
name: name,
|
|
5943
|
+
descriptionId: descriptionProps.id,
|
|
5944
|
+
errorMessageId: errorMessageProps.id,
|
|
5945
|
+
validationBehavior: validationBehavior
|
|
5946
|
+
});
|
|
5947
|
+
let domProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props, {
|
|
5948
|
+
labelable: true
|
|
5949
|
+
});
|
|
5950
|
+
let { focusWithinProps: focusWithinProps } = ($9ab94262bd0047c7$export$420e68273165f4ec)({
|
|
5951
|
+
onBlurWithin: props.onBlur,
|
|
5952
|
+
onFocusWithin: props.onFocus,
|
|
5953
|
+
onFocusWithinChange: props.onFocusChange
|
|
5954
|
+
});
|
|
5955
|
+
return {
|
|
5956
|
+
groupProps: ($3ef42575df84b30b$export$9d1611c77c2fe928)(domProps, {
|
|
5957
|
+
role: 'group',
|
|
5958
|
+
'aria-disabled': isDisabled || undefined,
|
|
5959
|
+
...fieldProps,
|
|
5960
|
+
...focusWithinProps
|
|
5961
|
+
}),
|
|
5962
|
+
labelProps: labelProps,
|
|
5963
|
+
descriptionProps: descriptionProps,
|
|
5964
|
+
errorMessageProps: errorMessageProps,
|
|
5965
|
+
isInvalid: isInvalid,
|
|
5966
|
+
validationErrors: validationErrors,
|
|
5967
|
+
validationDetails: validationDetails
|
|
5968
|
+
};
|
|
5969
|
+
}
|
|
5970
|
+
|
|
5814
5971
|
/*
|
|
5815
5972
|
* Copyright 2020 Adobe. All rights reserved.
|
|
5816
5973
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -5840,6 +5997,83 @@ function $3017fa7ffdddec74$export$8042c6c013fd5226(props = {}) {
|
|
|
5840
5997
|
};
|
|
5841
5998
|
}
|
|
5842
5999
|
|
|
6000
|
+
/*
|
|
6001
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
6002
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
6003
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
6004
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
6005
|
+
*
|
|
6006
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
6007
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
6008
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
6009
|
+
* governing permissions and limitations under the License.
|
|
6010
|
+
*/
|
|
6011
|
+
|
|
6012
|
+
|
|
6013
|
+
|
|
6014
|
+
|
|
6015
|
+
function $fba3e38d5ca8983f$export$353b32fc6898d37d(props, state, inputRef) {
|
|
6016
|
+
const toggleState = ($3017fa7ffdddec74$export$8042c6c013fd5226)({
|
|
6017
|
+
isReadOnly: props.isReadOnly || state.isReadOnly,
|
|
6018
|
+
isSelected: state.isSelected(props.value),
|
|
6019
|
+
onChange (isSelected) {
|
|
6020
|
+
if (isSelected) state.addValue(props.value);
|
|
6021
|
+
else state.removeValue(props.value);
|
|
6022
|
+
if (props.onChange) props.onChange(isSelected);
|
|
6023
|
+
}
|
|
6024
|
+
});
|
|
6025
|
+
let { name: name, descriptionId: descriptionId, errorMessageId: errorMessageId, validationBehavior: validationBehavior } = ($1ae600c947479353$export$ec98120685d4f57d).get(state);
|
|
6026
|
+
var _props_validationBehavior;
|
|
6027
|
+
validationBehavior = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : validationBehavior;
|
|
6028
|
+
// Local validation for this checkbox.
|
|
6029
|
+
let { realtimeValidation: realtimeValidation } = ($e5be200c675c3b3a$export$fc1a364ae1f3ff10)({
|
|
6030
|
+
...props,
|
|
6031
|
+
value: toggleState.isSelected,
|
|
6032
|
+
// Server validation is handled at the group level.
|
|
6033
|
+
name: undefined,
|
|
6034
|
+
validationBehavior: 'aria'
|
|
6035
|
+
});
|
|
6036
|
+
// Update the checkbox group state when realtime validation changes.
|
|
6037
|
+
let nativeValidation = (useRef)(($e5be200c675c3b3a$export$dad6ae84456c676a));
|
|
6038
|
+
let updateValidation = ()=>{
|
|
6039
|
+
state.setInvalid(props.value, realtimeValidation.isInvalid ? realtimeValidation : nativeValidation.current);
|
|
6040
|
+
};
|
|
6041
|
+
(useEffect)(updateValidation);
|
|
6042
|
+
// Combine group and checkbox level validation.
|
|
6043
|
+
let combinedRealtimeValidation = state.realtimeValidation.isInvalid ? state.realtimeValidation : realtimeValidation;
|
|
6044
|
+
let displayValidation = validationBehavior === 'native' ? state.displayValidation : combinedRealtimeValidation;
|
|
6045
|
+
var _props_isRequired;
|
|
6046
|
+
let res = ($406796ff087fe49b$export$e375f10ce42261c5)({
|
|
6047
|
+
...props,
|
|
6048
|
+
isReadOnly: props.isReadOnly || state.isReadOnly,
|
|
6049
|
+
isDisabled: props.isDisabled || state.isDisabled,
|
|
6050
|
+
name: props.name || name,
|
|
6051
|
+
isRequired: (_props_isRequired = props.isRequired) !== null && _props_isRequired !== void 0 ? _props_isRequired : state.isRequired,
|
|
6052
|
+
validationBehavior: validationBehavior,
|
|
6053
|
+
[($e5be200c675c3b3a$export$a763b9476acd3eb)]: {
|
|
6054
|
+
realtimeValidation: combinedRealtimeValidation,
|
|
6055
|
+
displayValidation: displayValidation,
|
|
6056
|
+
resetValidation: state.resetValidation,
|
|
6057
|
+
commitValidation: state.commitValidation,
|
|
6058
|
+
updateValidation (v) {
|
|
6059
|
+
nativeValidation.current = v;
|
|
6060
|
+
updateValidation();
|
|
6061
|
+
}
|
|
6062
|
+
}
|
|
6063
|
+
}, toggleState, inputRef);
|
|
6064
|
+
return {
|
|
6065
|
+
...res,
|
|
6066
|
+
inputProps: {
|
|
6067
|
+
...res.inputProps,
|
|
6068
|
+
'aria-describedby': [
|
|
6069
|
+
props['aria-describedby'],
|
|
6070
|
+
state.isInvalid ? errorMessageId : null,
|
|
6071
|
+
descriptionId
|
|
6072
|
+
].filter(Boolean).join(' ') || undefined
|
|
6073
|
+
}
|
|
6074
|
+
};
|
|
6075
|
+
}
|
|
6076
|
+
|
|
5843
6077
|
/*
|
|
5844
6078
|
* Copyright 2020 Adobe. All rights reserved.
|
|
5845
6079
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -10233,74 +10467,282 @@ function $4e8b0456ef72939f$var$last(walker) {
|
|
|
10233
10467
|
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
10234
10468
|
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
10235
10469
|
* governing permissions and limitations under the License.
|
|
10236
|
-
*/
|
|
10237
|
-
|
|
10470
|
+
*/ const $884aeceb3d67f00f$export$37b65e5b5444d35c = new WeakMap();
|
|
10238
10471
|
|
|
10472
|
+
/*
|
|
10473
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
10474
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
10475
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
10476
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
10477
|
+
*
|
|
10478
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
10479
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
10480
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
10481
|
+
* governing permissions and limitations under the License.
|
|
10482
|
+
*/
|
|
10239
10483
|
|
|
10240
10484
|
|
|
10241
10485
|
|
|
10242
10486
|
|
|
10243
|
-
|
|
10244
|
-
|
|
10245
|
-
|
|
10246
|
-
|
|
10247
|
-
|
|
10248
|
-
|
|
10249
|
-
|
|
10250
|
-
|
|
10487
|
+
function $0d5c49892c1215da$export$37b0961d2f4751e2(props, state, ref) {
|
|
10488
|
+
let { value: value, children: children, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby } = props;
|
|
10489
|
+
const isDisabled = props.isDisabled || state.isDisabled;
|
|
10490
|
+
let hasChildren = children != null;
|
|
10491
|
+
let hasAriaLabel = ariaLabel != null || ariaLabelledby != null;
|
|
10492
|
+
if (!hasChildren && !hasAriaLabel) console.warn('If you do not provide children, you must specify an aria-label for accessibility');
|
|
10493
|
+
let checked = state.selectedValue === value;
|
|
10494
|
+
let onChange = (e)=>{
|
|
10495
|
+
e.stopPropagation();
|
|
10496
|
+
state.setSelectedValue(value);
|
|
10497
|
+
};
|
|
10498
|
+
let { pressProps: pressProps, isPressed: isPressed } = ($f6c31cce2adf654f$export$45712eceda6fad21)({
|
|
10499
|
+
isDisabled: isDisabled
|
|
10251
10500
|
});
|
|
10252
|
-
|
|
10253
|
-
|
|
10254
|
-
state.collection,
|
|
10255
|
-
state.disabledKeys,
|
|
10256
|
-
collator
|
|
10257
|
-
]);
|
|
10258
|
-
let { menuTriggerProps: menuTriggerProps, menuProps: menuProps } = ($168583247155ddda$export$dc9c12ed27dd1b49)({
|
|
10501
|
+
// iOS does not toggle radios if you drag off and back onto the label, so handle it ourselves.
|
|
10502
|
+
let { pressProps: labelProps, isPressed: isLabelPressed } = ($f6c31cce2adf654f$export$45712eceda6fad21)({
|
|
10259
10503
|
isDisabled: isDisabled,
|
|
10260
|
-
|
|
10261
|
-
|
|
10262
|
-
let onKeyDown = (e)=>{
|
|
10263
|
-
switch(e.key){
|
|
10264
|
-
case 'ArrowLeft':
|
|
10265
|
-
{
|
|
10266
|
-
// prevent scrolling containers
|
|
10267
|
-
e.preventDefault();
|
|
10268
|
-
let key = state.selectedKey != null ? delegate.getKeyAbove(state.selectedKey) : delegate.getFirstKey();
|
|
10269
|
-
if (key) state.setSelectedKey(key);
|
|
10270
|
-
break;
|
|
10271
|
-
}
|
|
10272
|
-
case 'ArrowRight':
|
|
10273
|
-
{
|
|
10274
|
-
// prevent scrolling containers
|
|
10275
|
-
e.preventDefault();
|
|
10276
|
-
let key = state.selectedKey != null ? delegate.getKeyBelow(state.selectedKey) : delegate.getFirstKey();
|
|
10277
|
-
if (key) state.setSelectedKey(key);
|
|
10278
|
-
break;
|
|
10279
|
-
}
|
|
10280
|
-
}
|
|
10281
|
-
};
|
|
10282
|
-
let { typeSelectProps: typeSelectProps } = ($fb3050f43d946246$export$e32c88dfddc6e1d8)({
|
|
10283
|
-
keyboardDelegate: delegate,
|
|
10284
|
-
selectionManager: state.selectionManager,
|
|
10285
|
-
onTypeSelect (key) {
|
|
10286
|
-
state.setSelectedKey(key);
|
|
10504
|
+
onPress () {
|
|
10505
|
+
state.setSelectedValue(value);
|
|
10287
10506
|
}
|
|
10288
10507
|
});
|
|
10508
|
+
let { focusableProps: focusableProps } = ($e6afbd83fe6ebbd2$export$4c014de7c8940b4c)(($3ef42575df84b30b$export$9d1611c77c2fe928)(props, {
|
|
10509
|
+
onFocus: ()=>state.setLastFocusedValue(value)
|
|
10510
|
+
}), ref);
|
|
10511
|
+
let interactions = ($3ef42575df84b30b$export$9d1611c77c2fe928)(pressProps, focusableProps);
|
|
10512
|
+
let domProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props, {
|
|
10513
|
+
labelable: true
|
|
10514
|
+
});
|
|
10515
|
+
let tabIndex = -1;
|
|
10516
|
+
if (state.selectedValue != null) {
|
|
10517
|
+
if (state.selectedValue === value) tabIndex = 0;
|
|
10518
|
+
} else if (state.lastFocusedValue === value || state.lastFocusedValue == null) tabIndex = 0;
|
|
10519
|
+
if (isDisabled) tabIndex = undefined;
|
|
10520
|
+
let { name: name, descriptionId: descriptionId, errorMessageId: errorMessageId, validationBehavior: validationBehavior } = ($884aeceb3d67f00f$export$37b65e5b5444d35c).get(state);
|
|
10521
|
+
($99facab73266f662$export$5add1d006293d136)(ref, state.selectedValue, state.setSelectedValue);
|
|
10522
|
+
($e93e671b31057976$export$b8473d3665f3a75a)({
|
|
10523
|
+
validationBehavior: validationBehavior
|
|
10524
|
+
}, state, ref);
|
|
10525
|
+
return {
|
|
10526
|
+
labelProps: ($3ef42575df84b30b$export$9d1611c77c2fe928)(labelProps, {
|
|
10527
|
+
onClick: (e)=>e.preventDefault()
|
|
10528
|
+
}),
|
|
10529
|
+
inputProps: ($3ef42575df84b30b$export$9d1611c77c2fe928)(domProps, {
|
|
10530
|
+
...interactions,
|
|
10531
|
+
type: 'radio',
|
|
10532
|
+
name: name,
|
|
10533
|
+
tabIndex: tabIndex,
|
|
10534
|
+
disabled: isDisabled,
|
|
10535
|
+
required: state.isRequired && validationBehavior === 'native',
|
|
10536
|
+
checked: checked,
|
|
10537
|
+
value: value,
|
|
10538
|
+
onChange: onChange,
|
|
10539
|
+
'aria-describedby': [
|
|
10540
|
+
props['aria-describedby'],
|
|
10541
|
+
state.isInvalid ? errorMessageId : null,
|
|
10542
|
+
descriptionId
|
|
10543
|
+
].filter(Boolean).join(' ') || undefined
|
|
10544
|
+
}),
|
|
10545
|
+
isDisabled: isDisabled,
|
|
10546
|
+
isSelected: checked,
|
|
10547
|
+
isPressed: isPressed || isLabelPressed
|
|
10548
|
+
};
|
|
10549
|
+
}
|
|
10550
|
+
|
|
10551
|
+
/*
|
|
10552
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
10553
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
10554
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
10555
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
10556
|
+
*
|
|
10557
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
10558
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
10559
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
10560
|
+
* governing permissions and limitations under the License.
|
|
10561
|
+
*/
|
|
10562
|
+
|
|
10563
|
+
|
|
10564
|
+
|
|
10565
|
+
|
|
10566
|
+
|
|
10567
|
+
function $430f30ed08ec25fa$export$62b9571f283ff5c2(props, state) {
|
|
10568
|
+
let { name: name, isReadOnly: isReadOnly, isRequired: isRequired, isDisabled: isDisabled, orientation: orientation = 'vertical', validationBehavior: validationBehavior = 'aria' } = props;
|
|
10569
|
+
let { direction: direction } = ($18f2051aff69b9bf$export$43bb16f9c6d9e3f7)();
|
|
10289
10570
|
let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
|
|
10290
10571
|
let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = ($2baaea4c71418dea$export$294aa081a6c6f55d)({
|
|
10291
10572
|
...props,
|
|
10573
|
+
// Radio group is not an HTML input element so it
|
|
10574
|
+
// shouldn't be labeled by a <label> element.
|
|
10292
10575
|
labelElementType: 'span',
|
|
10293
|
-
isInvalid: isInvalid,
|
|
10576
|
+
isInvalid: state.isInvalid,
|
|
10294
10577
|
errorMessage: props.errorMessage || validationErrors
|
|
10295
10578
|
});
|
|
10296
|
-
typeSelectProps.onKeyDown = typeSelectProps.onKeyDownCapture;
|
|
10297
|
-
delete typeSelectProps.onKeyDownCapture;
|
|
10298
10579
|
let domProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props, {
|
|
10299
10580
|
labelable: true
|
|
10300
10581
|
});
|
|
10301
|
-
|
|
10302
|
-
|
|
10303
|
-
|
|
10582
|
+
// When the radio group loses focus, reset the focusable radio to null if
|
|
10583
|
+
// there is no selection. This allows tabbing into the group from either
|
|
10584
|
+
// direction to go to the first or last radio.
|
|
10585
|
+
let { focusWithinProps: focusWithinProps } = ($9ab94262bd0047c7$export$420e68273165f4ec)({
|
|
10586
|
+
onBlurWithin (e) {
|
|
10587
|
+
var _props_onBlur;
|
|
10588
|
+
(_props_onBlur = props.onBlur) === null || _props_onBlur === void 0 ? void 0 : _props_onBlur.call(props, e);
|
|
10589
|
+
if (!state.selectedValue) state.setLastFocusedValue(null);
|
|
10590
|
+
},
|
|
10591
|
+
onFocusWithin: props.onFocus,
|
|
10592
|
+
onFocusWithinChange: props.onFocusChange
|
|
10593
|
+
});
|
|
10594
|
+
let onKeyDown = (e)=>{
|
|
10595
|
+
let nextDir;
|
|
10596
|
+
switch(e.key){
|
|
10597
|
+
case 'ArrowRight':
|
|
10598
|
+
if (direction === 'rtl' && orientation !== 'vertical') nextDir = 'prev';
|
|
10599
|
+
else nextDir = 'next';
|
|
10600
|
+
break;
|
|
10601
|
+
case 'ArrowLeft':
|
|
10602
|
+
if (direction === 'rtl' && orientation !== 'vertical') nextDir = 'next';
|
|
10603
|
+
else nextDir = 'prev';
|
|
10604
|
+
break;
|
|
10605
|
+
case 'ArrowDown':
|
|
10606
|
+
nextDir = 'next';
|
|
10607
|
+
break;
|
|
10608
|
+
case 'ArrowUp':
|
|
10609
|
+
nextDir = 'prev';
|
|
10610
|
+
break;
|
|
10611
|
+
default:
|
|
10612
|
+
return;
|
|
10613
|
+
}
|
|
10614
|
+
e.preventDefault();
|
|
10615
|
+
let walker = ($9bf71ea28793e738$export$2d6ec8fc375ceafa)(e.currentTarget, {
|
|
10616
|
+
from: e.target
|
|
10617
|
+
});
|
|
10618
|
+
let nextElem;
|
|
10619
|
+
if (nextDir === 'next') {
|
|
10620
|
+
nextElem = walker.nextNode();
|
|
10621
|
+
if (!nextElem) {
|
|
10622
|
+
walker.currentNode = e.currentTarget;
|
|
10623
|
+
nextElem = walker.firstChild();
|
|
10624
|
+
}
|
|
10625
|
+
} else {
|
|
10626
|
+
nextElem = walker.previousNode();
|
|
10627
|
+
if (!nextElem) {
|
|
10628
|
+
walker.currentNode = e.currentTarget;
|
|
10629
|
+
nextElem = walker.lastChild();
|
|
10630
|
+
}
|
|
10631
|
+
}
|
|
10632
|
+
if (nextElem) {
|
|
10633
|
+
// Call focus on nextElem so that keyboard navigation scrolls the radio into view
|
|
10634
|
+
nextElem.focus();
|
|
10635
|
+
state.setSelectedValue(nextElem.value);
|
|
10636
|
+
}
|
|
10637
|
+
};
|
|
10638
|
+
let groupName = ($bdb11010cef70236$export$f680877a34711e37)(name);
|
|
10639
|
+
($884aeceb3d67f00f$export$37b65e5b5444d35c).set(state, {
|
|
10640
|
+
name: groupName,
|
|
10641
|
+
descriptionId: descriptionProps.id,
|
|
10642
|
+
errorMessageId: errorMessageProps.id,
|
|
10643
|
+
validationBehavior: validationBehavior
|
|
10644
|
+
});
|
|
10645
|
+
return {
|
|
10646
|
+
radioGroupProps: ($3ef42575df84b30b$export$9d1611c77c2fe928)(domProps, {
|
|
10647
|
+
// https://www.w3.org/TR/wai-aria-1.2/#radiogroup
|
|
10648
|
+
role: 'radiogroup',
|
|
10649
|
+
onKeyDown: onKeyDown,
|
|
10650
|
+
'aria-invalid': state.isInvalid || undefined,
|
|
10651
|
+
'aria-errormessage': props['aria-errormessage'],
|
|
10652
|
+
'aria-readonly': isReadOnly || undefined,
|
|
10653
|
+
'aria-required': isRequired || undefined,
|
|
10654
|
+
'aria-disabled': isDisabled || undefined,
|
|
10655
|
+
'aria-orientation': orientation,
|
|
10656
|
+
...fieldProps,
|
|
10657
|
+
...focusWithinProps
|
|
10658
|
+
}),
|
|
10659
|
+
labelProps: labelProps,
|
|
10660
|
+
descriptionProps: descriptionProps,
|
|
10661
|
+
errorMessageProps: errorMessageProps,
|
|
10662
|
+
isInvalid: isInvalid,
|
|
10663
|
+
validationErrors: validationErrors,
|
|
10664
|
+
validationDetails: validationDetails
|
|
10665
|
+
};
|
|
10666
|
+
}
|
|
10667
|
+
|
|
10668
|
+
/*
|
|
10669
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
10670
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
10671
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
10672
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
10673
|
+
*
|
|
10674
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
10675
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
10676
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
10677
|
+
* governing permissions and limitations under the License.
|
|
10678
|
+
*/
|
|
10679
|
+
|
|
10680
|
+
|
|
10681
|
+
|
|
10682
|
+
|
|
10683
|
+
|
|
10684
|
+
|
|
10685
|
+
const $58aed456727eb0f3$export$703601b7e90536f8 = new WeakMap();
|
|
10686
|
+
function $58aed456727eb0f3$export$e64b2f635402ca43(props, state, ref) {
|
|
10687
|
+
let { keyboardDelegate: keyboardDelegate, isDisabled: isDisabled, isRequired: isRequired, name: name, validationBehavior: validationBehavior = 'aria' } = props;
|
|
10688
|
+
// By default, a KeyboardDelegate is provided which uses the DOM to query layout information (e.g. for page up/page down).
|
|
10689
|
+
// When virtualized, the layout object will be passed in as a prop and override this.
|
|
10690
|
+
let collator = ($325a3faab7a68acd$export$a16aca283550c30d)({
|
|
10691
|
+
usage: 'search',
|
|
10692
|
+
sensitivity: 'base'
|
|
10693
|
+
});
|
|
10694
|
+
let delegate = (useMemo)(()=>keyboardDelegate || new ($2a25aae57d74318e$export$a05409b8bb224a5a)(state.collection, state.disabledKeys, null, collator), [
|
|
10695
|
+
keyboardDelegate,
|
|
10696
|
+
state.collection,
|
|
10697
|
+
state.disabledKeys,
|
|
10698
|
+
collator
|
|
10699
|
+
]);
|
|
10700
|
+
let { menuTriggerProps: menuTriggerProps, menuProps: menuProps } = ($168583247155ddda$export$dc9c12ed27dd1b49)({
|
|
10701
|
+
isDisabled: isDisabled,
|
|
10702
|
+
type: 'listbox'
|
|
10703
|
+
}, state, ref);
|
|
10704
|
+
let onKeyDown = (e)=>{
|
|
10705
|
+
switch(e.key){
|
|
10706
|
+
case 'ArrowLeft':
|
|
10707
|
+
{
|
|
10708
|
+
// prevent scrolling containers
|
|
10709
|
+
e.preventDefault();
|
|
10710
|
+
let key = state.selectedKey != null ? delegate.getKeyAbove(state.selectedKey) : delegate.getFirstKey();
|
|
10711
|
+
if (key) state.setSelectedKey(key);
|
|
10712
|
+
break;
|
|
10713
|
+
}
|
|
10714
|
+
case 'ArrowRight':
|
|
10715
|
+
{
|
|
10716
|
+
// prevent scrolling containers
|
|
10717
|
+
e.preventDefault();
|
|
10718
|
+
let key = state.selectedKey != null ? delegate.getKeyBelow(state.selectedKey) : delegate.getFirstKey();
|
|
10719
|
+
if (key) state.setSelectedKey(key);
|
|
10720
|
+
break;
|
|
10721
|
+
}
|
|
10722
|
+
}
|
|
10723
|
+
};
|
|
10724
|
+
let { typeSelectProps: typeSelectProps } = ($fb3050f43d946246$export$e32c88dfddc6e1d8)({
|
|
10725
|
+
keyboardDelegate: delegate,
|
|
10726
|
+
selectionManager: state.selectionManager,
|
|
10727
|
+
onTypeSelect (key) {
|
|
10728
|
+
state.setSelectedKey(key);
|
|
10729
|
+
}
|
|
10730
|
+
});
|
|
10731
|
+
let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
|
|
10732
|
+
let { labelProps: labelProps, fieldProps: fieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = ($2baaea4c71418dea$export$294aa081a6c6f55d)({
|
|
10733
|
+
...props,
|
|
10734
|
+
labelElementType: 'span',
|
|
10735
|
+
isInvalid: isInvalid,
|
|
10736
|
+
errorMessage: props.errorMessage || validationErrors
|
|
10737
|
+
});
|
|
10738
|
+
typeSelectProps.onKeyDown = typeSelectProps.onKeyDownCapture;
|
|
10739
|
+
delete typeSelectProps.onKeyDownCapture;
|
|
10740
|
+
let domProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props, {
|
|
10741
|
+
labelable: true
|
|
10742
|
+
});
|
|
10743
|
+
let triggerProps = ($3ef42575df84b30b$export$9d1611c77c2fe928)(typeSelectProps, menuTriggerProps, fieldProps);
|
|
10744
|
+
let valueId = ($bdb11010cef70236$export$f680877a34711e37)();
|
|
10745
|
+
$58aed456727eb0f3$export$703601b7e90536f8.set(state, {
|
|
10304
10746
|
isDisabled: isDisabled,
|
|
10305
10747
|
isRequired: isRequired,
|
|
10306
10748
|
name: name,
|
|
@@ -11147,6 +11589,68 @@ function $514c0188e459b4c0$var$Text(props, ref) {
|
|
|
11147
11589
|
}
|
|
11148
11590
|
const $514c0188e459b4c0$export$5f1af8db9871e1d6 = /*#__PURE__*/ (forwardRef)($514c0188e459b4c0$var$Text);
|
|
11149
11591
|
|
|
11592
|
+
/*
|
|
11593
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
11594
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
11595
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
11596
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
11597
|
+
*
|
|
11598
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
11599
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
11600
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
11601
|
+
* governing permissions and limitations under the License.
|
|
11602
|
+
*/
|
|
11603
|
+
|
|
11604
|
+
|
|
11605
|
+
function $587d3ad58be6d31f$export$daff6da51032a415(props = {}) {
|
|
11606
|
+
let [selectedValues, setValue] = ($458b0a5536c1a7cf$export$40bfa8c7b0832715)(props.value, props.defaultValue || [], props.onChange);
|
|
11607
|
+
let isRequired = !!props.isRequired && selectedValues.length === 0;
|
|
11608
|
+
let invalidValues = (useRef)(new Map());
|
|
11609
|
+
let validation = ($e5be200c675c3b3a$export$fc1a364ae1f3ff10)({
|
|
11610
|
+
...props,
|
|
11611
|
+
value: selectedValues
|
|
11612
|
+
});
|
|
11613
|
+
let isInvalid = validation.displayValidation.isInvalid;
|
|
11614
|
+
var _props_validationState;
|
|
11615
|
+
const state = {
|
|
11616
|
+
...validation,
|
|
11617
|
+
value: selectedValues,
|
|
11618
|
+
setValue (value) {
|
|
11619
|
+
if (props.isReadOnly || props.isDisabled) return;
|
|
11620
|
+
setValue(value);
|
|
11621
|
+
},
|
|
11622
|
+
isDisabled: props.isDisabled || false,
|
|
11623
|
+
isReadOnly: props.isReadOnly || false,
|
|
11624
|
+
isSelected (value) {
|
|
11625
|
+
return selectedValues.includes(value);
|
|
11626
|
+
},
|
|
11627
|
+
addValue (value) {
|
|
11628
|
+
if (props.isReadOnly || props.isDisabled) return;
|
|
11629
|
+
if (!selectedValues.includes(value)) setValue(selectedValues.concat(value));
|
|
11630
|
+
},
|
|
11631
|
+
removeValue (value) {
|
|
11632
|
+
if (props.isReadOnly || props.isDisabled) return;
|
|
11633
|
+
if (selectedValues.includes(value)) setValue(selectedValues.filter((existingValue)=>existingValue !== value));
|
|
11634
|
+
},
|
|
11635
|
+
toggleValue (value) {
|
|
11636
|
+
if (props.isReadOnly || props.isDisabled) return;
|
|
11637
|
+
if (selectedValues.includes(value)) setValue(selectedValues.filter((existingValue)=>existingValue !== value));
|
|
11638
|
+
else setValue(selectedValues.concat(value));
|
|
11639
|
+
},
|
|
11640
|
+
setInvalid (value, v) {
|
|
11641
|
+
let s = new Map(invalidValues.current);
|
|
11642
|
+
if (v.isInvalid) s.set(value, v);
|
|
11643
|
+
else s.delete(value);
|
|
11644
|
+
invalidValues.current = s;
|
|
11645
|
+
validation.updateValidation(($e5be200c675c3b3a$export$75ee7c75d68f5b0e)(...s.values()));
|
|
11646
|
+
},
|
|
11647
|
+
validationState: (_props_validationState = props.validationState) !== null && _props_validationState !== void 0 ? _props_validationState : isInvalid ? 'invalid' : null,
|
|
11648
|
+
isInvalid: isInvalid,
|
|
11649
|
+
isRequired: isRequired
|
|
11650
|
+
};
|
|
11651
|
+
return state;
|
|
11652
|
+
}
|
|
11653
|
+
|
|
11150
11654
|
/*
|
|
11151
11655
|
* Copyright 2020 Adobe. All rights reserved.
|
|
11152
11656
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -11811,6 +12315,55 @@ function $fc909762b330b746$export$61c6a8c84e605fb6(props) {
|
|
|
11811
12315
|
*/
|
|
11812
12316
|
|
|
11813
12317
|
|
|
12318
|
+
let $a54cdc5c1942b639$var$instance = Math.round(Math.random() * 10000000000);
|
|
12319
|
+
let $a54cdc5c1942b639$var$i = 0;
|
|
12320
|
+
function $a54cdc5c1942b639$export$bca9d026f8e704eb(props) {
|
|
12321
|
+
// Preserved here for backward compatibility. React Aria now generates the name instead of stately.
|
|
12322
|
+
let name = (useMemo)(()=>props.name || `radio-group-${$a54cdc5c1942b639$var$instance}-${++$a54cdc5c1942b639$var$i}`, [
|
|
12323
|
+
props.name
|
|
12324
|
+
]);
|
|
12325
|
+
var _props_defaultValue;
|
|
12326
|
+
let [selectedValue, setSelected] = ($458b0a5536c1a7cf$export$40bfa8c7b0832715)(props.value, (_props_defaultValue = props.defaultValue) !== null && _props_defaultValue !== void 0 ? _props_defaultValue : null, props.onChange);
|
|
12327
|
+
let [lastFocusedValue, setLastFocusedValue] = (useState)(null);
|
|
12328
|
+
let validation = ($e5be200c675c3b3a$export$fc1a364ae1f3ff10)({
|
|
12329
|
+
...props,
|
|
12330
|
+
value: selectedValue
|
|
12331
|
+
});
|
|
12332
|
+
let setSelectedValue = (value)=>{
|
|
12333
|
+
if (!props.isReadOnly && !props.isDisabled) {
|
|
12334
|
+
setSelected(value);
|
|
12335
|
+
validation.commitValidation();
|
|
12336
|
+
}
|
|
12337
|
+
};
|
|
12338
|
+
let isInvalid = validation.displayValidation.isInvalid;
|
|
12339
|
+
return {
|
|
12340
|
+
...validation,
|
|
12341
|
+
name: name,
|
|
12342
|
+
selectedValue: selectedValue,
|
|
12343
|
+
setSelectedValue: setSelectedValue,
|
|
12344
|
+
lastFocusedValue: lastFocusedValue,
|
|
12345
|
+
setLastFocusedValue: setLastFocusedValue,
|
|
12346
|
+
isDisabled: props.isDisabled || false,
|
|
12347
|
+
isReadOnly: props.isReadOnly || false,
|
|
12348
|
+
isRequired: props.isRequired || false,
|
|
12349
|
+
validationState: props.validationState || (isInvalid ? 'invalid' : null),
|
|
12350
|
+
isInvalid: isInvalid
|
|
12351
|
+
};
|
|
12352
|
+
}
|
|
12353
|
+
|
|
12354
|
+
/*
|
|
12355
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
12356
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
12357
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
12358
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
12359
|
+
*
|
|
12360
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
12361
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
12362
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
12363
|
+
* governing permissions and limitations under the License.
|
|
12364
|
+
*/
|
|
12365
|
+
|
|
12366
|
+
|
|
11814
12367
|
|
|
11815
12368
|
function $2bc3a590c5373a4e$export$5159ec8b34d4ec12(props) {
|
|
11816
12369
|
let triggerState = ($fc909762b330b746$export$61c6a8c84e605fb6)(props);
|
|
@@ -12075,6 +12628,168 @@ const $01b77f81d0f07f68$export$b04be29aa201d4f5 = /*#__PURE__*/ ($f39a9eba43920a
|
|
|
12075
12628
|
|
|
12076
12629
|
|
|
12077
12630
|
|
|
12631
|
+
|
|
12632
|
+
|
|
12633
|
+
|
|
12634
|
+
|
|
12635
|
+
|
|
12636
|
+
|
|
12637
|
+
const $bc237834342dbd75$export$baf37c4be89255b8 = /*#__PURE__*/ (createContext)(null);
|
|
12638
|
+
const $bc237834342dbd75$export$139c5b8563afc1fc = /*#__PURE__*/ (createContext)(null);
|
|
12639
|
+
function $bc237834342dbd75$var$CheckboxGroup(props, ref) {
|
|
12640
|
+
[props, ref] = ($64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $bc237834342dbd75$export$baf37c4be89255b8);
|
|
12641
|
+
let { validationBehavior: formValidationBehavior } = ($64fa3d84918910a7$export$fabf2dc03a41866e)(($d3e0e05bdfcf66bd$export$c24727297075ec6a)) || {};
|
|
12642
|
+
var _props_validationBehavior, _ref;
|
|
12643
|
+
let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : 'native';
|
|
12644
|
+
let state = ($587d3ad58be6d31f$export$daff6da51032a415)({
|
|
12645
|
+
...props,
|
|
12646
|
+
validationBehavior: validationBehavior
|
|
12647
|
+
});
|
|
12648
|
+
let [labelRef, label] = ($64fa3d84918910a7$export$9d4c57ee4c6ffdd8)();
|
|
12649
|
+
let { groupProps: groupProps, labelProps: labelProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, ...validation } = ($1e9fce0cfacc738b$export$49ff6f28c54f1cbe)({
|
|
12650
|
+
...props,
|
|
12651
|
+
label: label,
|
|
12652
|
+
validationBehavior: validationBehavior
|
|
12653
|
+
}, state);
|
|
12654
|
+
let renderProps = ($64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
12655
|
+
...props,
|
|
12656
|
+
values: {
|
|
12657
|
+
isDisabled: state.isDisabled,
|
|
12658
|
+
isReadOnly: state.isReadOnly,
|
|
12659
|
+
isRequired: props.isRequired || false,
|
|
12660
|
+
isInvalid: state.isInvalid,
|
|
12661
|
+
state: state
|
|
12662
|
+
},
|
|
12663
|
+
defaultClassName: 'react-aria-CheckboxGroup'
|
|
12664
|
+
});
|
|
12665
|
+
return /*#__PURE__*/ ($dbSRa$react).createElement("div", {
|
|
12666
|
+
...groupProps,
|
|
12667
|
+
...renderProps,
|
|
12668
|
+
ref: ref,
|
|
12669
|
+
slot: props.slot || undefined,
|
|
12670
|
+
"data-readonly": state.isReadOnly || undefined,
|
|
12671
|
+
"data-required": props.isRequired || undefined,
|
|
12672
|
+
"data-invalid": state.isInvalid || undefined,
|
|
12673
|
+
"data-disabled": props.isDisabled || undefined
|
|
12674
|
+
}, /*#__PURE__*/ ($dbSRa$react).createElement(($64fa3d84918910a7$export$2881499e37b75b9a), {
|
|
12675
|
+
values: [
|
|
12676
|
+
[
|
|
12677
|
+
$bc237834342dbd75$export$139c5b8563afc1fc,
|
|
12678
|
+
state
|
|
12679
|
+
],
|
|
12680
|
+
[
|
|
12681
|
+
($01b77f81d0f07f68$export$75b6ee27786ba447),
|
|
12682
|
+
{
|
|
12683
|
+
...labelProps,
|
|
12684
|
+
ref: labelRef,
|
|
12685
|
+
elementType: 'span'
|
|
12686
|
+
}
|
|
12687
|
+
],
|
|
12688
|
+
[
|
|
12689
|
+
($514c0188e459b4c0$export$9afb8bc826b033ea),
|
|
12690
|
+
{
|
|
12691
|
+
slots: {
|
|
12692
|
+
description: descriptionProps,
|
|
12693
|
+
errorMessage: errorMessageProps
|
|
12694
|
+
}
|
|
12695
|
+
}
|
|
12696
|
+
],
|
|
12697
|
+
[
|
|
12698
|
+
($ee014567cb39d3f0$export$ff05c3ac10437e03),
|
|
12699
|
+
validation
|
|
12700
|
+
]
|
|
12701
|
+
]
|
|
12702
|
+
}, renderProps.children));
|
|
12703
|
+
}
|
|
12704
|
+
function $bc237834342dbd75$var$Checkbox(props, ref) {
|
|
12705
|
+
let { inputRef: userProvidedInputRef = null, ...otherProps } = props;
|
|
12706
|
+
[props, ref] = ($64fa3d84918910a7$export$29f1550f4b0d4415)(otherProps, ref, ($4e85f108e88277b8$export$b085522c77523c51));
|
|
12707
|
+
let { validationBehavior: formValidationBehavior } = ($64fa3d84918910a7$export$fabf2dc03a41866e)(($d3e0e05bdfcf66bd$export$c24727297075ec6a)) || {};
|
|
12708
|
+
var _props_validationBehavior, _ref;
|
|
12709
|
+
let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : 'native';
|
|
12710
|
+
let groupState = (useContext)($bc237834342dbd75$export$139c5b8563afc1fc);
|
|
12711
|
+
let inputRef = ($df56164dff5785e2$export$4338b53315abf666)(($5dc95899b306f630$export$c9058316764c140e)(userProvidedInputRef, props.inputRef !== undefined ? props.inputRef : null));
|
|
12712
|
+
let { labelProps: labelProps, inputProps: inputProps, isSelected: isSelected, isDisabled: isDisabled, isReadOnly: isReadOnly, isPressed: isPressed, isInvalid: isInvalid } = groupState ? ($fba3e38d5ca8983f$export$353b32fc6898d37d)({
|
|
12713
|
+
...props,
|
|
12714
|
+
// Value is optional for standalone checkboxes, but required for CheckboxGroup items;
|
|
12715
|
+
// it's passed explicitly here to avoid typescript error (requires ignore).
|
|
12716
|
+
// @ts-ignore
|
|
12717
|
+
value: props.value,
|
|
12718
|
+
// ReactNode type doesn't allow function children.
|
|
12719
|
+
children: typeof props.children === 'function' ? true : props.children
|
|
12720
|
+
}, groupState, inputRef) : ($406796ff087fe49b$export$e375f10ce42261c5)({
|
|
12721
|
+
...props,
|
|
12722
|
+
children: typeof props.children === 'function' ? true : props.children,
|
|
12723
|
+
validationBehavior: validationBehavior
|
|
12724
|
+
}, ($3017fa7ffdddec74$export$8042c6c013fd5226)(props), inputRef);
|
|
12725
|
+
let { isFocused: isFocused, isFocusVisible: isFocusVisible, focusProps: focusProps } = ($f7dceffc5ad7768b$export$4e328f61c538687f)();
|
|
12726
|
+
let isInteractionDisabled = isDisabled || isReadOnly;
|
|
12727
|
+
let { hoverProps: hoverProps, isHovered: isHovered } = ($6179b936705e76d3$export$ae780daf29e6d456)({
|
|
12728
|
+
...props,
|
|
12729
|
+
isDisabled: isInteractionDisabled
|
|
12730
|
+
});
|
|
12731
|
+
let renderProps = ($64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
12732
|
+
// TODO: should data attrs go on the label or on the <input>? useCheckbox passes them to the input...
|
|
12733
|
+
...props,
|
|
12734
|
+
defaultClassName: 'react-aria-Checkbox',
|
|
12735
|
+
values: {
|
|
12736
|
+
isSelected: isSelected,
|
|
12737
|
+
isIndeterminate: props.isIndeterminate || false,
|
|
12738
|
+
isPressed: isPressed,
|
|
12739
|
+
isHovered: isHovered,
|
|
12740
|
+
isFocused: isFocused,
|
|
12741
|
+
isFocusVisible: isFocusVisible,
|
|
12742
|
+
isDisabled: isDisabled,
|
|
12743
|
+
isReadOnly: isReadOnly,
|
|
12744
|
+
isInvalid: isInvalid,
|
|
12745
|
+
isRequired: props.isRequired || false
|
|
12746
|
+
}
|
|
12747
|
+
});
|
|
12748
|
+
let DOMProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props);
|
|
12749
|
+
delete DOMProps.id;
|
|
12750
|
+
return /*#__PURE__*/ ($dbSRa$react).createElement("label", {
|
|
12751
|
+
...($3ef42575df84b30b$export$9d1611c77c2fe928)(DOMProps, labelProps, hoverProps, renderProps),
|
|
12752
|
+
ref: ref,
|
|
12753
|
+
slot: props.slot || undefined,
|
|
12754
|
+
"data-selected": isSelected || undefined,
|
|
12755
|
+
"data-indeterminate": props.isIndeterminate || undefined,
|
|
12756
|
+
"data-pressed": isPressed || undefined,
|
|
12757
|
+
"data-hovered": isHovered || undefined,
|
|
12758
|
+
"data-focused": isFocused || undefined,
|
|
12759
|
+
"data-focus-visible": isFocusVisible || undefined,
|
|
12760
|
+
"data-disabled": isDisabled || undefined,
|
|
12761
|
+
"data-readonly": isReadOnly || undefined,
|
|
12762
|
+
"data-invalid": isInvalid || undefined,
|
|
12763
|
+
"data-required": props.isRequired || undefined
|
|
12764
|
+
}, /*#__PURE__*/ ($dbSRa$react).createElement(($5c3e21d68f1c4674$export$439d29a4e110a164), {
|
|
12765
|
+
elementType: "span"
|
|
12766
|
+
}, /*#__PURE__*/ ($dbSRa$react).createElement("input", {
|
|
12767
|
+
...($3ef42575df84b30b$export$9d1611c77c2fe928)(inputProps, focusProps),
|
|
12768
|
+
ref: inputRef
|
|
12769
|
+
})), renderProps.children);
|
|
12770
|
+
}
|
|
12771
|
+
/**
|
|
12772
|
+
* A checkbox allows a user to select multiple items from a list of individual items, or
|
|
12773
|
+
* to mark one individual item as selected.
|
|
12774
|
+
*/ const $bc237834342dbd75$export$48513f6b9f8ce62d = /*#__PURE__*/ (forwardRef)($bc237834342dbd75$var$Checkbox);
|
|
12775
|
+
/**
|
|
12776
|
+
* A checkbox group allows a user to select multiple items from a list of options.
|
|
12777
|
+
*/ const $bc237834342dbd75$export$4aa08d5625cb8ead = /*#__PURE__*/ (forwardRef)($bc237834342dbd75$var$CheckboxGroup);
|
|
12778
|
+
|
|
12779
|
+
/*
|
|
12780
|
+
* Copyright 2022 Adobe. All rights reserved.
|
|
12781
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
12782
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
12783
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
12784
|
+
*
|
|
12785
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
12786
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
12787
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
12788
|
+
* governing permissions and limitations under the License.
|
|
12789
|
+
*/
|
|
12790
|
+
|
|
12791
|
+
|
|
12792
|
+
|
|
12078
12793
|
const $3985021b0ad6602f$export$37fb8590cf2c088c = /*#__PURE__*/ (createContext)({});
|
|
12079
12794
|
let $3985021b0ad6602f$var$filterHoverProps = (props)=>{
|
|
12080
12795
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
@@ -13092,6 +13807,154 @@ function $07b14b47974efb58$var$PopoverInner({ state: state, isExiting: isExiting
|
|
|
13092
13807
|
|
|
13093
13808
|
const $de32f1b87079253c$export$d2f961adcb0afbe = /*#__PURE__*/ (createContext)(null);
|
|
13094
13809
|
|
|
13810
|
+
/*
|
|
13811
|
+
* Copyright 2022 Adobe. All rights reserved.
|
|
13812
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
13813
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
13814
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
13815
|
+
*
|
|
13816
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
13817
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
13818
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
13819
|
+
* governing permissions and limitations under the License.
|
|
13820
|
+
*/
|
|
13821
|
+
|
|
13822
|
+
|
|
13823
|
+
|
|
13824
|
+
|
|
13825
|
+
|
|
13826
|
+
|
|
13827
|
+
|
|
13828
|
+
|
|
13829
|
+
const $b6c3ddc6086f204d$export$a79eda4ff50e30b6 = /*#__PURE__*/ (createContext)(null);
|
|
13830
|
+
const $b6c3ddc6086f204d$export$b118023277d4a5c3 = /*#__PURE__*/ (createContext)(null);
|
|
13831
|
+
const $b6c3ddc6086f204d$export$29d84393af70866c = /*#__PURE__*/ (createContext)(null);
|
|
13832
|
+
function $b6c3ddc6086f204d$var$RadioGroup(props, ref) {
|
|
13833
|
+
[props, ref] = ($64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $b6c3ddc6086f204d$export$a79eda4ff50e30b6);
|
|
13834
|
+
let { validationBehavior: formValidationBehavior } = ($64fa3d84918910a7$export$fabf2dc03a41866e)(($d3e0e05bdfcf66bd$export$c24727297075ec6a)) || {};
|
|
13835
|
+
var _props_validationBehavior, _ref;
|
|
13836
|
+
let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : 'native';
|
|
13837
|
+
let state = ($a54cdc5c1942b639$export$bca9d026f8e704eb)({
|
|
13838
|
+
...props,
|
|
13839
|
+
validationBehavior: validationBehavior
|
|
13840
|
+
});
|
|
13841
|
+
let [labelRef, label] = ($64fa3d84918910a7$export$9d4c57ee4c6ffdd8)();
|
|
13842
|
+
let { radioGroupProps: radioGroupProps, labelProps: labelProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, ...validation } = ($430f30ed08ec25fa$export$62b9571f283ff5c2)({
|
|
13843
|
+
...props,
|
|
13844
|
+
label: label,
|
|
13845
|
+
validationBehavior: validationBehavior
|
|
13846
|
+
}, state);
|
|
13847
|
+
let renderProps = ($64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
13848
|
+
...props,
|
|
13849
|
+
values: {
|
|
13850
|
+
orientation: props.orientation || 'vertical',
|
|
13851
|
+
isDisabled: state.isDisabled,
|
|
13852
|
+
isReadOnly: state.isReadOnly,
|
|
13853
|
+
isRequired: state.isRequired,
|
|
13854
|
+
isInvalid: state.isInvalid,
|
|
13855
|
+
state: state
|
|
13856
|
+
},
|
|
13857
|
+
defaultClassName: 'react-aria-RadioGroup'
|
|
13858
|
+
});
|
|
13859
|
+
return /*#__PURE__*/ ($dbSRa$react).createElement("div", {
|
|
13860
|
+
...radioGroupProps,
|
|
13861
|
+
...renderProps,
|
|
13862
|
+
ref: ref,
|
|
13863
|
+
slot: props.slot || undefined,
|
|
13864
|
+
"data-orientation": props.orientation || 'vertical',
|
|
13865
|
+
"data-invalid": state.isInvalid || undefined,
|
|
13866
|
+
"data-disabled": state.isDisabled || undefined,
|
|
13867
|
+
"data-readonly": state.isReadOnly || undefined,
|
|
13868
|
+
"data-required": state.isRequired || undefined
|
|
13869
|
+
}, /*#__PURE__*/ ($dbSRa$react).createElement(($64fa3d84918910a7$export$2881499e37b75b9a), {
|
|
13870
|
+
values: [
|
|
13871
|
+
[
|
|
13872
|
+
$b6c3ddc6086f204d$export$29d84393af70866c,
|
|
13873
|
+
state
|
|
13874
|
+
],
|
|
13875
|
+
[
|
|
13876
|
+
($01b77f81d0f07f68$export$75b6ee27786ba447),
|
|
13877
|
+
{
|
|
13878
|
+
...labelProps,
|
|
13879
|
+
ref: labelRef,
|
|
13880
|
+
elementType: 'span'
|
|
13881
|
+
}
|
|
13882
|
+
],
|
|
13883
|
+
[
|
|
13884
|
+
($514c0188e459b4c0$export$9afb8bc826b033ea),
|
|
13885
|
+
{
|
|
13886
|
+
slots: {
|
|
13887
|
+
description: descriptionProps,
|
|
13888
|
+
errorMessage: errorMessageProps
|
|
13889
|
+
}
|
|
13890
|
+
}
|
|
13891
|
+
],
|
|
13892
|
+
[
|
|
13893
|
+
($ee014567cb39d3f0$export$ff05c3ac10437e03),
|
|
13894
|
+
validation
|
|
13895
|
+
]
|
|
13896
|
+
]
|
|
13897
|
+
}, renderProps.children));
|
|
13898
|
+
}
|
|
13899
|
+
function $b6c3ddc6086f204d$var$Radio(props, ref) {
|
|
13900
|
+
let { inputRef: userProvidedInputRef = null, ...otherProps } = props;
|
|
13901
|
+
[props, ref] = ($64fa3d84918910a7$export$29f1550f4b0d4415)(otherProps, ref, $b6c3ddc6086f204d$export$b118023277d4a5c3);
|
|
13902
|
+
let state = ($dbSRa$react).useContext($b6c3ddc6086f204d$export$29d84393af70866c);
|
|
13903
|
+
let inputRef = ($df56164dff5785e2$export$4338b53315abf666)(($5dc95899b306f630$export$c9058316764c140e)(userProvidedInputRef, props.inputRef !== undefined ? props.inputRef : null));
|
|
13904
|
+
let { labelProps: labelProps, inputProps: inputProps, isSelected: isSelected, isDisabled: isDisabled, isPressed: isPressed } = ($0d5c49892c1215da$export$37b0961d2f4751e2)({
|
|
13905
|
+
...($64fa3d84918910a7$export$ef03459518577ad4)(props),
|
|
13906
|
+
// ReactNode type doesn't allow function children.
|
|
13907
|
+
children: typeof props.children === 'function' ? true : props.children
|
|
13908
|
+
}, state, inputRef);
|
|
13909
|
+
let { isFocused: isFocused, isFocusVisible: isFocusVisible, focusProps: focusProps } = ($f7dceffc5ad7768b$export$4e328f61c538687f)();
|
|
13910
|
+
let interactionDisabled = isDisabled || state.isReadOnly;
|
|
13911
|
+
let { hoverProps: hoverProps, isHovered: isHovered } = ($6179b936705e76d3$export$ae780daf29e6d456)({
|
|
13912
|
+
...props,
|
|
13913
|
+
isDisabled: interactionDisabled
|
|
13914
|
+
});
|
|
13915
|
+
let renderProps = ($64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
13916
|
+
...props,
|
|
13917
|
+
defaultClassName: 'react-aria-Radio',
|
|
13918
|
+
values: {
|
|
13919
|
+
isSelected: isSelected,
|
|
13920
|
+
isPressed: isPressed,
|
|
13921
|
+
isHovered: isHovered,
|
|
13922
|
+
isFocused: isFocused,
|
|
13923
|
+
isFocusVisible: isFocusVisible,
|
|
13924
|
+
isDisabled: isDisabled,
|
|
13925
|
+
isReadOnly: state.isReadOnly,
|
|
13926
|
+
isInvalid: state.isInvalid,
|
|
13927
|
+
isRequired: state.isRequired
|
|
13928
|
+
}
|
|
13929
|
+
});
|
|
13930
|
+
let DOMProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props);
|
|
13931
|
+
delete DOMProps.id;
|
|
13932
|
+
return /*#__PURE__*/ ($dbSRa$react).createElement("label", {
|
|
13933
|
+
...($3ef42575df84b30b$export$9d1611c77c2fe928)(DOMProps, labelProps, hoverProps, renderProps),
|
|
13934
|
+
ref: ref,
|
|
13935
|
+
"data-selected": isSelected || undefined,
|
|
13936
|
+
"data-pressed": isPressed || undefined,
|
|
13937
|
+
"data-hovered": isHovered || undefined,
|
|
13938
|
+
"data-focused": isFocused || undefined,
|
|
13939
|
+
"data-focus-visible": isFocusVisible || undefined,
|
|
13940
|
+
"data-disabled": isDisabled || undefined,
|
|
13941
|
+
"data-readonly": state.isReadOnly || undefined,
|
|
13942
|
+
"data-invalid": state.isInvalid || undefined,
|
|
13943
|
+
"data-required": state.isRequired || undefined
|
|
13944
|
+
}, /*#__PURE__*/ ($dbSRa$react).createElement(($5c3e21d68f1c4674$export$439d29a4e110a164), {
|
|
13945
|
+
elementType: "span"
|
|
13946
|
+
}, /*#__PURE__*/ ($dbSRa$react).createElement("input", {
|
|
13947
|
+
...($3ef42575df84b30b$export$9d1611c77c2fe928)(inputProps, focusProps),
|
|
13948
|
+
ref: inputRef
|
|
13949
|
+
})), renderProps.children);
|
|
13950
|
+
}
|
|
13951
|
+
/**
|
|
13952
|
+
* A radio group allows a user to select a single item from a list of mutually exclusive options.
|
|
13953
|
+
*/ const $b6c3ddc6086f204d$export$a98f0dcb43a68a25 = /*#__PURE__*/ (forwardRef)($b6c3ddc6086f204d$var$RadioGroup);
|
|
13954
|
+
/**
|
|
13955
|
+
* A radio represents an individual option within a radio group.
|
|
13956
|
+
*/ const $b6c3ddc6086f204d$export$d7b12c4107be0d61 = /*#__PURE__*/ (forwardRef)($b6c3ddc6086f204d$var$Radio);
|
|
13957
|
+
|
|
13095
13958
|
function $parcel$interopDefault(a) {
|
|
13096
13959
|
return a && a.__esModule ? a.default : a;
|
|
13097
13960
|
}
|
|
@@ -13882,15 +14745,15 @@ function $4e3b923658d69c60$var$TooltipInner(props) {
|
|
|
13882
14745
|
}, renderProps.children));
|
|
13883
14746
|
}
|
|
13884
14747
|
|
|
13885
|
-
var css_248z$
|
|
13886
|
-
styleInject(css_248z$
|
|
14748
|
+
var css_248z$g = ".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";
|
|
14749
|
+
styleInject(css_248z$g);
|
|
13887
14750
|
|
|
13888
14751
|
function Button({ size = "medium", variant = "primary", danger = false, isIconButton = false, ...props }) {
|
|
13889
14752
|
return (jsx($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { className: `bcds-react-aria-Button ${size} ${variant} ${danger ? "danger" : ""} ${isIconButton ? "icon" : ""}`, ...props }));
|
|
13890
14753
|
}
|
|
13891
14754
|
|
|
13892
|
-
var css_248z$
|
|
13893
|
-
styleInject(css_248z$
|
|
14755
|
+
var css_248z$f = ".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";
|
|
14756
|
+
styleInject(css_248z$f);
|
|
13894
14757
|
|
|
13895
14758
|
function ButtonGroup({ orientation = "horizontal", alignment = "start", ariaLabel, children, ...props }) {
|
|
13896
14759
|
return (jsx("div", { className: `bcds-ButtonGroup ${orientation} ${alignment}`, role: "group", "aria-label": ariaLabel, ...props, children: children }));
|
|
@@ -13917,8 +14780,8 @@ function SvgInfoIcon({ id = "information-icon" }) {
|
|
|
13917
14780
|
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" }) }) }));
|
|
13918
14781
|
}
|
|
13919
14782
|
|
|
13920
|
-
var css_248z$
|
|
13921
|
-
styleInject(css_248z$
|
|
14783
|
+
var css_248z$e = ".bcds-Inline-Alert {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n gap: var(--layout-margin-small);\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n}\n\n/* Alert content */\n.bcds-Inline-Alert--container {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n}\n\n.bcds-Inline-Alert--container > .title {\n font: var(--typography-bold-body);\n color: var(--typography-color-primary);\n}\n\n.bcds-Inline-Alert--container > .description {\n font: var(--typography-regular-body);\n color: var(--typography-color-primary);\n}\n\n/* Left icon */\n.bcds-Inline-Alert--icon {\n display: inline-flex;\n align-self: flex-start;\n padding-top: var(--layout-padding-xsmall);\n}\n\n.bcds-Inline-Alert--icon > svg {\n min-width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n\n/* Closeable */\n.bcds-Inline-Alert.closeable {\n /*\n Because the close icon button is removed from the document flow, we\n manually adjust the padding to push the `--container` element off the right\n edge of the InlineAlert.\n */\n padding: var(--layout-padding-medium) 52px var(--layout-padding-medium)\n var(--layout-padding-large);\n}\n\n.bcds-Inline-Alert--closeIcon {\n align-self: first baseline;\n color: var(--icons-color-primary);\n position: relative;\n}\n\n.bcds-Inline-Alert--closeIcon > button {\n position: absolute;\n /*\n Centers the button vertically.\n Button height (32px) minus line-height of text (27px) divided by 2.\n */\n top: -2.5px;\n}\n\n.bcds-Inline-Alert--closeIcon > svg {\n min-width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n\n/* Info variant */\n.bcds-Inline-Alert.info {\n background-color: var(--support-surface-color-info);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-info);\n border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.info > .bcds-Inline-Alert--icon {\n color: var(--icons-color-info);\n}\n\n/* Success variant */\n.bcds-Inline-Alert.success {\n background-color: var(--suport-surface-color-success);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-success);\n border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.success > .bcds-Inline-Alert--icon {\n color: var(--icons-color-success);\n}\n\n/* Warning variant */\n.bcds-Inline-Alert.warning {\n background-color: var(--support-surface-color-warning);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-warning);\n border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.warning > .bcds-Inline-Alert--icon {\n color: var(--icons-color-warning);\n}\n\n/* Danger variant */\n.bcds-Inline-Alert.danger {\n background-color: var(--support-surface-color-danger);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n border-radius: var(--layout-border-radius-medium);\n}\n\n.bcds-Inline-Alert.danger > .bcds-Inline-Alert--icon {\n color: var(--icons-color-danger);\n}\n\n/* Button group */\n.bcds-Inline-Alert--container > .bcds-ButtonGroup {\n padding-top: var(--layout-padding-small);\n}\n";
|
|
14784
|
+
styleInject(css_248z$e);
|
|
13922
14785
|
|
|
13923
14786
|
function getIcon(variant) {
|
|
13924
14787
|
switch (variant) {
|
|
@@ -13938,13 +14801,35 @@ function InlineAlert({ variant = "info", title, description, isIconHidden = fals
|
|
|
13938
14801
|
return (jsxs("div", { className: `bcds-Inline-Alert ${variant} ${isCloseable ? "closeable" : null}`, ...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, {}) }) }))] }));
|
|
13939
14802
|
}
|
|
13940
14803
|
|
|
14804
|
+
function SvgCheckIcon({ id = "check-icon" }) {
|
|
14805
|
+
return (jsx("svg", { id: id, width: "10", height: "10", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M9.09447 1.16176C8.67766 0.834916 8.07489 0.907409 7.74747 1.32376L3.63547 6.55676L2.21847 4.85676C1.87495 4.46651 1.2832 4.42064 0.883639 4.75329C0.484082 5.08594 0.421942 5.6762 0.743468 6.08476L2.92047 8.69776C2.94047 8.72176 2.96947 8.72976 2.99047 8.75176C3.0133 8.78196 3.03802 8.81068 3.06447 8.83776C3.10707 8.86542 3.15189 8.8895 3.19847 8.90976C3.23068 8.92977 3.26407 8.9478 3.29847 8.96376C3.41159 9.01295 3.53316 9.03977 3.65647 9.04276H3.65747C3.78585 9.04006 3.91238 9.01149 4.02947 8.95876C4.06502 8.9413 4.09942 8.92159 4.13247 8.89976C4.18141 8.87729 4.22826 8.85052 4.27247 8.81976C4.29837 8.79134 4.32242 8.76128 4.34447 8.72976C4.36447 8.70976 4.39347 8.69976 4.41247 8.67576L9.25747 2.50976C9.58477 2.09253 9.51178 1.48896 9.09447 1.16176V1.16176Z", fill: "currentColor" }) }) }));
|
|
14806
|
+
}
|
|
14807
|
+
|
|
14808
|
+
function SvgDashIcon({ id = "dash-icon" }) {
|
|
14809
|
+
return (jsx("svg", { id: id, width: "8", height: "10", viewBox: "0 0 8 2", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M6.99005 1.96004H1.01005C0.479855 1.96004 0.0500488 1.53023 0.0500488 1.00004C0.0500488 0.469846 0.479855 0.0400391 1.01005 0.0400391H6.99005C7.52024 0.0400391 7.95005 0.469846 7.95005 1.00004C7.95005 1.53023 7.52024 1.96004 6.99005 1.96004H6.99005Z", fill: "currentColor" }) }));
|
|
14810
|
+
}
|
|
14811
|
+
|
|
14812
|
+
var css_248z$d = ".bcds-react-aria-Checkbox {\n cursor: pointer;\n display: flex;\n flex-direction: row;\n gap: 10px;\n align-items: center;\n}\n\n/* Checkbox */\n.bcds-react-aria-Checkbox > .checkbox {\n align-self: first baseline;\n display: flex;\n margin-top: var(--layout-margin-hair);\n justify-content: space-around;\n width: var(--icons-size-small);\n height: var(--icons-size-small);\n min-width: var(--icons-size-small);\n background-color: var(--surface-color-secondary-default);\n border-color: var(--surface-color-border-medium);\n border-style: solid;\n border-width: var(--layout-border-width-small);\n border-radius: var(--layout-border-radius-small);\n}\n.bcds-react-aria-Checkbox > .checkbox > svg {\n align-self: center;\n}\n\n/* Label */\n.bcds-react-aria-Checkbox > .label {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n}\n\n/* Focus */\n.bcds-react-aria-Checkbox[data-focused] > .checkbox {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Hover */\n.bcds-react-aria-Checkbox[data-hovered] > .checkbox {\n border-color: var(--surface-color-border-dark);\n}\n.bcds-react-aria-Checkbox[data-selected][data-hovered] > .checkbox {\n background-color: var(--surface-color-primary-hover);\n border-color: var(--surface-color-primary-hover);\n}\n\n/* Pressed */\n.bcds-react-aria-Checkbox[data-pressed] > .checkbox {\n background-color: var(--surface-color-primary-default);\n}\n\n/* Selected */\n.bcds-react-aria-Checkbox[data-selected] > .checkbox {\n background-color: var(--surface-color-primary-default);\n border-color: var(--surface-color-primary-default);\n}\n.bcds-react-aria-Checkbox[data-selected] > .checkbox > svg {\n color: var(--icons-color-primary-invert);\n}\n\n/* Disabled */\n.bcds-react-aria-Checkbox[data-disabled] {\n cursor: not-allowed;\n}\n.bcds-react-aria-Checkbox[data-disabled] > .checkbox {\n border-color: var(--surface-color-border-medium);\n background-color: var(--surface-color-primary-disabled);\n}\n.bcds-react-aria-Checkbox[data-disabled] > .label {\n color: var(--typography-color-disabled);\n}\n.bcds-react-aria-Checkbox[data-selected][data-disabled] > .checkbox {\n border-color: var(--surface-color-primary-disabled);\n background-color: var(--surface-color-primary-disabled);\n}\n.bcds-react-aria-Checkbox[data-selected][data-disabled] > .checkbox > svg {\n color: var(--icons-color-disabled);\n}\n\n/* Indeterminate */\n.bcds-react-aria-Checkbox[data-indeterminate] > .checkbox {\n background-color: var(--surface-color-primary-default);\n border-color: var(--surface-color-primary-default);\n}\n.bcds-react-aria-Checkbox[data-indeterminate][data-disabled] > .checkbox {\n background-color: var(--surface-color-primary-disabled);\n border-color: var(--surface-color-primary-disabled);\n}\n.bcds-react-aria-Checkbox[data-indeterminate][data-invalid] > .checkbox {\n background-color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Checkbox[data-indeterminate] > .checkbox > svg {\n color: var(--icons-color-primary-invert);\n align-self: center;\n vertical-align: middle;\n}\n.bcds-react-aria-Checkbox[data-indeterminate][data-disabled] > .checkbox > svg {\n color: var(--icons-color-disabled);\n}\n\n/* Read-only */\n.bcds-react-aria-Checkbox[data-readonly] {\n cursor: not-allowed;\n}\n\n/* Invalid */\n.bcds-react-aria-Checkbox[data-invalid] > .checkbox {\n border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Checkbox[data-invalid] > .checkbox > svg {\n color: var(--icons-color-primary-invert);\n}\n.bcds-react-aria-Checkbox[data-selected][data-invalid] > .checkbox {\n background-color: var(--surface-color-primary-danger-button-default);\n}\n";
|
|
14813
|
+
styleInject(css_248z$d);
|
|
14814
|
+
|
|
14815
|
+
function Checkbox({ value, children, ...props }) {
|
|
14816
|
+
return (jsx($bc237834342dbd75$export$48513f6b9f8ce62d, { className: "bcds-react-aria-Checkbox", value: value, ...props, children: ({ isRequired, isSelected, isIndeterminate }) => (jsxs(Fragment, { children: [jsxs("div", { className: "checkbox", children: [isSelected && !isIndeterminate && jsx(SvgCheckIcon, {}), isIndeterminate && jsx(SvgDashIcon, {})] }), jsxs("span", { className: "label", children: [jsx(Fragment, { children: children }), " ", isRequired && "(required)"] })] })) }));
|
|
14817
|
+
}
|
|
14818
|
+
|
|
14819
|
+
var css_248z$c = ".bcds-react-aria-CheckboxGroup {\n display: flex;\n flex-direction: column;\n gap: var(--layout-margin-small);\n}\n\n/* Orientation */\n.bcds-react-aria-CheckboxGroup--options {\n display: flex;\n}\n\n.bcds-react-aria-CheckboxGroup--options.vertical {\n flex-direction: column;\n gap: var(--layout-margin-small);\n}\n\n.bcds-react-aria-CheckboxGroup--options.horizontal {\n flex-direction: row;\n gap: var(--layout-margin-medium);\n}\n.bcds-react-aria-CheckboxGroup--options.horizontal.flex-wrap-nowrap {\n flex-wrap: nowrap;\n}\n.bcds-react-aria-CheckboxGroup--options.horizontal.flex-wrap-wrap {\n flex-wrap: wrap;\n}\n.bcds-react-aria-CheckboxGroup--options.horizontal.flex-wrap-wrap-reverse {\n flex-wrap: wrap-reverse;\n}\n\n/* Parts */\n.bcds-react-aria-CheckboxGroup--label {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-primary);\n}\n\n.bcds-react-aria-CheckboxGroup--description {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n}\n\n.bcds-react-aria-CheckboxGroup--error {\n display: inline-flex;\n flex-direction: row;\n gap: var(--layout-margin-xsmall);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n";
|
|
14820
|
+
styleInject(css_248z$c);
|
|
14821
|
+
|
|
14822
|
+
function CheckboxGroup({ orientation = "vertical", label, description, errorMessage, flexWrap = "nowrap", children, ...props }) {
|
|
14823
|
+
return (jsx($bc237834342dbd75$export$4aa08d5625cb8ead, { className: `bcds-react-aria-CheckboxGroup`, ...props, children: ({ isRequired, isInvalid }) => (jsxs(Fragment, { children: [label && (jsxs($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-CheckboxGroup--label", children: [label, " ", isRequired && "(required)"] })), jsx("div", { className: `bcds-react-aria-CheckboxGroup--options ${orientation} flex-wrap-${flexWrap}`, children: jsx(Fragment, { children: children }) }), description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-CheckboxGroup--description", children: description })), isInvalid && (jsxs("div", { className: "bcds-react-aria-CheckboxGroup--error", children: [jsx(SvgExclamationIcon, {}), jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { children: errorMessage })] }))] })) }));
|
|
14824
|
+
}
|
|
14825
|
+
|
|
13941
14826
|
// This logo is available as a plain SVG at src/assets/BCID_H_rgb_pos.svg
|
|
13942
14827
|
function SvgBcLogo({ id = "bcgov-logo" }) {
|
|
13943
14828
|
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" } })] })] }));
|
|
13944
14829
|
}
|
|
13945
14830
|
|
|
13946
|
-
var css_248z$
|
|
13947
|
-
styleInject(css_248z$
|
|
14831
|
+
var css_248z$b = ".bcds-header {\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-around;\n background-color: var(--surface-color-forms-default);\n border-bottom-color: var(--surface-color-border-default);\n border-bottom-style: solid;\n border-bottom-width: var(--layout-border-width-small);\n min-height: 65px;\n padding: var(--layout-padding-none) var(--layout-padding-medium);\n width: 100%;\n}\n\n.bcds-header > .bcds-header--container {\n flex-grow: 1;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-padding-medium);\n max-width: 1100px;\n}\n\n.bcds-header > .bcds-header--container > .bcds-header--title {\n flex-grow: 1;\n font: var(--typography-bold-h4);\n color: var(--typography-color-primary);\n}\n\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks {\n list-style: none;\n margin: 0;\n padding: 0;\n position: absolute;\n}\n\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks li a,\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks li button {\n background-color: var(--surface-color-forms-default);\n box-sizing: border-box;\n color: var(--typography-color-link);\n font: var(--typography-regular-body);\n margin-top: -17.5px; /* Center the link visually in a single line-height header */\n padding: var(--layout-padding-xsmall) var(--layout-padding-medium);\n position: absolute;\n margin-left: -100000px;\n}\n\n.bcds-header > .bcds-header--container > ul.bcds-header--skiplinks li a:focus,\n.bcds-header\n > .bcds-header--container\n > ul.bcds-header--skiplinks\n li\n button:focus {\n margin-left: 0; /* Line up left edge with left edge of logo image */\n text-wrap: nowrap;\n}\n\n.bcds-header > .bcds-header--container > .bcds-header--line {\n background-color: var(--surface-color-border-default);\n width: 1px;\n height: 32px;\n}\n\n.bcds-header > .bcds-header--container svg#bcgov-logo-header {\n min-width: 129px;\n width: 129px;\n}\n";
|
|
14832
|
+
styleInject(css_248z$b);
|
|
13948
14833
|
|
|
13949
14834
|
function Header({ children, logoLinkElement, logoImage = jsx(SvgBcLogo, { id: "bcgov-logo-header" }), skipLinks, title = "", titleElement = "span", }) {
|
|
13950
14835
|
function getLogo() {
|
|
@@ -13977,8 +14862,8 @@ function Header({ children, logoLinkElement, logoImage = jsx(SvgBcLogo, { id: "b
|
|
|
13977
14862
|
}) })), title && (jsxs(Fragment, { children: [jsx("div", { className: "bcds-header--line" }), getTitle()] })), children] }) }));
|
|
13978
14863
|
}
|
|
13979
14864
|
|
|
13980
|
-
var css_248z$
|
|
13981
|
-
styleInject(css_248z$
|
|
14865
|
+
var css_248z$a = ".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";
|
|
14866
|
+
styleInject(css_248z$a);
|
|
13982
14867
|
|
|
13983
14868
|
/**
|
|
13984
14869
|
* A titled list of links for use in the Footer. Rendered inside a `<figure>`
|
|
@@ -14032,6 +14917,20 @@ function Form({ ...props }) {
|
|
|
14032
14917
|
return jsx($d3e0e05bdfcf66bd$export$a7fed597f4b8afd8, { ...props });
|
|
14033
14918
|
}
|
|
14034
14919
|
|
|
14920
|
+
var css_248z$9 = ".bcds-react-aria-Radio {\n cursor: pointer;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-margin-small);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n forced-color-adjust: none;\n}\n\n/* Selector */\n.bcds-react-aria-Radio:before {\n align-self: first baseline;\n margin-top: var(--layout-margin-xsmall);\n content: \"\";\n display: block;\n width: var(--icons-size-xsmall);\n height: var(--icons-size-xsmall);\n box-sizing: border-box;\n background-color: var(--surface-color-secondary-default);\n border-radius: var(--icons-size-small);\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-medium);\n transition: all 200ms;\n}\n@media (prefers-reduced-motion) {\n .bcds-react-aria-Radio:before {\n /* No animation on radio button circle if user has reduced motion set */\n transition: none;\n }\n}\n\n/* Hover */\n.bcds-react-aria-Radio[data-hovered]:before {\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-dark);\n}\n\n/* Pressed */\n.bcds-react-aria-Radio[data-pressed]:before {\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-dark);\n}\n\n/* Selected */\n.bcds-react-aria-Radio[data-selected]:before {\n border: 5px solid var(--surface-color-primary-default);\n}\n\n/* Focused */\n.bcds-react-aria-Radio[data-focus-visible]:before {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Invalid */\n.bcds-react-aria-Radio[data-invalid]:before {\n border: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n}\n.bcds-react-aria-Radio[data-selected][data-invalid] {\n color: var(--typography-color-danger);\n}\n.bcds-react-aria-Radio[data-selected][data-invalid]:before {\n border: 5px solid var(--support-border-color-danger);\n}\n\n/* Disabled */\n.bcds-react-aria-Radio[data-disabled] {\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n.bcds-react-aria-radio[data-selected][data-disabled]:before {\n border: 5px solid var(--surface-color-border-default);\n}\n\n/* Read only */\n.bcds-react-aria-Radio[data-readonly] {\n cursor: not-allowed;\n}\n";
|
|
14921
|
+
styleInject(css_248z$9);
|
|
14922
|
+
|
|
14923
|
+
function Radio({ value, children, ...props }) {
|
|
14924
|
+
return (jsx($b6c3ddc6086f204d$export$d7b12c4107be0d61, { className: "bcds-react-aria-Radio", value: value, ...props, children: children }));
|
|
14925
|
+
}
|
|
14926
|
+
|
|
14927
|
+
var css_248z$8 = ".bcds-react-aria-RadioGroup {\n display: flex;\n flex-direction: column;\n gap: var(--layout-margin-small);\n}\n\n/* Orientation */\n.bcds-react-aria-RadioGroup--options {\n display: inline-flex;\n}\n\n.bcds-react-aria-RadioGroup--options.vertical {\n flex-direction: column;\n gap: var(--layout-margin-small);\n}\n\n.bcds-react-aria-RadioGroup--options.horizontal {\n flex-direction: row;\n gap: var(--layout-margin-medium);\n}\n.bcds-react-aria-RadioGroup--options.horizontal.flex-wrap-nowrap {\n flex-wrap: nowrap;\n}\n.bcds-react-aria-RadioGroup--options.horizontal.flex-wrap-wrap {\n flex-wrap: wrap;\n}\n.bcds-react-aria-RadioGroup--options.horizontal.flex-wrap-nowrap {\n flex-wrap: wrap-reverse;\n}\n\n/* Parts */\n.bcds-react-aria-RadioGroup--label {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-primary);\n}\n\n.bcds-react-aria-RadioGroup--description {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n}\n\n.bcds-react-aria-RadioGroup--error {\n display: inline-flex;\n flex-direction: row;\n gap: var(--layout-margin-xsmall);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n";
|
|
14928
|
+
styleInject(css_248z$8);
|
|
14929
|
+
|
|
14930
|
+
function RadioGroup({ orientation = "vertical", label, description, children, errorMessage, flexWrap = "nowrap", ...props }) {
|
|
14931
|
+
return (jsx($b6c3ddc6086f204d$export$a98f0dcb43a68a25, { className: "bcds-react-aria-RadioGroup", ...props, children: ({ isRequired, isInvalid }) => (jsxs(Fragment, { children: [label && (jsxs($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-RadioGroup--label", children: [label, " ", isRequired && "(required)"] })), jsx("div", { className: `bcds-react-aria-RadioGroup--options ${orientation} flex-wrap-${flexWrap}`, children: children }), description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-RadioGroup--description", children: description })), isInvalid && (jsxs("div", { className: "bcds-react-aria-RadioGroup--error", children: [jsx(SvgExclamationIcon, {}), jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { children: errorMessage })] }))] })) }));
|
|
14932
|
+
}
|
|
14933
|
+
|
|
14035
14934
|
function SvgChevronUpIcon({ id = "chevron-up-icon" }) {
|
|
14036
14935
|
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M4.21231 13.3146L9.52695 8.2226C9.6939 8.08348 9.86086 8 10.0278 8C10.1948 8 10.3339 8.05565 10.473 8.16695L15.7876 13.259C16.066 13.5372 16.066 13.9546 15.8155 14.2051C15.5651 14.4833 15.1477 14.4833 14.8694 14.2329L10.0278 9.61387L5.13054 14.2885C4.88011 14.539 4.43491 14.539 4.18448 14.2607C3.93405 13.9825 3.93405 13.5651 4.21231 13.3146Z", fill: "currentColor" }) }));
|
|
14037
14936
|
}
|
|
@@ -14063,6 +14962,10 @@ function Select({ items, sections, label, description, placeholder, size = "medi
|
|
|
14063
14962
|
: [{ 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 }))] })) })] })) }) })] })) }));
|
|
14064
14963
|
}
|
|
14065
14964
|
|
|
14965
|
+
function SvgTooltipArrowUp({ id = "tooltip-arrow" }) {
|
|
14966
|
+
return (jsx("svg", { id: id, width: "19", height: "9", viewBox: "0 0 19 9", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M8.4188 1.41421C9.19985 0.633163 10.4662 0.633165 11.2472 1.41421L18.833 9L0.833008 9L8.4188 1.41421Z", fill: "currentColor" }) }) }));
|
|
14967
|
+
}
|
|
14968
|
+
|
|
14066
14969
|
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: var(--layout-border-width-small) solid;\n display: flex;\n align-items: center;\n gap: var(--layout-margin-small);\n font: var(--typography-regular-label);\n padding: var(--layout-padding-hair) var(--layout-padding-small);\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";
|
|
14067
14970
|
styleInject(css_248z$6);
|
|
14068
14971
|
|
|
@@ -14098,13 +15001,11 @@ function TextArea({ label, description, errorMessage, maxLength, onChange, value
|
|
|
14098
15001
|
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 })] }))] })) }));
|
|
14099
15002
|
}
|
|
14100
15003
|
|
|
14101
|
-
var css_248z$2 = ".bcds-react-aria-TextField {\n display: inline-flex;\n flex-direction: column;\n /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\n align-self: stretch;\n max-width: -moz-available;\n max-width: -webkit-fill-available;\n}\n\n/* Styles for the text label above the input field */\n.bcds-react-aria-TextField--Label {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-primary);\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n.bcds-react-aria-TextField--Label .required {\n color: var(--typography-color-secondary);\n padding: var(--layout-padding-none) var(--layout-padding-xsmall);\n}\n\n/* Styles for the text description below the input field */\n.bcds-react-aria-TextField--Description {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n/* Styles for the input field container */\n.bcds-react-aria-TextField--container {\n color: var(--typography-color-primary);\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-margin-small);\n background: var(--surface-color-forms-default);\n box-sizing: border-box;\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n padding: var(--layout-padding-small) 12px;\n}\n\n/* Sizes */\n.bcds-react-aria-TextField--container.small {\n height: var(--layout-margin-xlarge);\n min-height: var(--layout-margin-xlarge);\n}\n\n.bcds-react-aria-TextField--container.medium {\n height: var(--layout-margin-xxlarge);\n min-height: var(--layout-margin-xxlarge);\n}\n\n/* Text input field */\n.bcds-react-aria-TextField--Input {\n font: var(--typography-regular-body);\n padding: var(--layout-padding-none);\n color: var(--typography-color-primary);\n border: none;\n flex-grow: 1;\n}\n\n.bcds-react-aria-TextField--Input::placeholder {\n color: var(--typography-color-placeholder);\n}\n\n/* Hover and focus states */\n\n.bcds-react-aria-TextField--container\n > .bcds-react-aria-TextField--Input[data-focused] {\n outline: none;\n}\n\n.bcds-react-aria-TextField--container:focus-within {\n border-radius: var(--layout-border-radius-large);\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-active);\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n.bcds-react-aria-TextField--container:hover {\n border-color: var(--surface-color-border-dark);\n}\n\n/* Disabled and invalid states */\n\n.bcds-react-aria-TextField[data-disabled]\n > .bcds-react-aria-TextField--container {\n background: var(--surface-color-forms-disabled);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-TextField--Input[data-disabled] {\n color: var(--typography-color-placeholder);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-TextField[data-invalid]\n > .bcds-react-aria-TextField--container {\n border-radius: var(--layout-border-radius-medium);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n background: var(--surface-color-forms-default);\n}\n\n.bcds-react-aria-TextField[data-readonly]\n > .bcds-react-aria-TextField--container {\n background: var(--surface-color-forms-disabled);\n}\n\n.bcds-react-aria-TextField[data-readonly]\n > .bcds-react-aria-TextField--container\n > .bcds-react-aria-TextField--Input {\n background: var(--surface-color-forms-disabled);\n}\n\n/* Styles for the error message slot */\n.bcds-react-aria-TextField--Error {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n";
|
|
15004
|
+
var css_248z$2 = ".bcds-react-aria-TextField {\n display: inline-flex;\n flex-direction: column;\n /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\n align-self: stretch;\n max-width: -moz-available;\n max-width: -webkit-fill-available;\n}\n\n/* Styles for the text label above the input field */\n.bcds-react-aria-TextField--Label {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-primary);\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n.bcds-react-aria-TextField--Label .required {\n color: var(--typography-color-secondary);\n padding: var(--layout-padding-none) var(--layout-padding-xsmall);\n}\n\n/* Styles for the text description below the input field */\n.bcds-react-aria-TextField--Description {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n/* Styles for the input field container */\n.bcds-react-aria-TextField--container {\n color: var(--typography-color-primary);\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-margin-small);\n background: var(--surface-color-forms-default);\n box-sizing: border-box;\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n padding: var(--layout-padding-small) 12px;\n}\n\n/* Sizes */\n.bcds-react-aria-TextField--container.small {\n height: var(--layout-margin-xlarge);\n min-height: var(--layout-margin-xlarge);\n}\n\n.bcds-react-aria-TextField--container.medium {\n height: var(--layout-margin-xxlarge);\n min-height: var(--layout-margin-xxlarge);\n}\n\n/* Text input field */\n.bcds-react-aria-TextField--Input {\n font: var(--typography-regular-body);\n padding: var(--layout-padding-none);\n color: var(--typography-color-primary);\n border: none;\n flex-grow: 1;\n}\n\n.bcds-react-aria-TextField--Input::placeholder {\n color: var(--typography-color-placeholder);\n}\n\n/* Hover and focus states */\n\n.bcds-react-aria-TextField--container\n > .bcds-react-aria-TextField--Input[data-focused] {\n outline: none;\n}\n\n.bcds-react-aria-TextField--container:focus-within {\n border-radius: var(--layout-border-radius-large);\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-active);\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n.bcds-react-aria-TextField--container:hover {\n border-color: var(--surface-color-border-dark);\n}\n\n/* Disabled and invalid states */\n\n.bcds-react-aria-TextField[data-disabled]\n > .bcds-react-aria-TextField--container {\n background: var(--surface-color-forms-disabled);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-TextField--Input[data-disabled] {\n color: var(--typography-color-placeholder);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-TextField[data-invalid]\n > .bcds-react-aria-TextField--container {\n border-radius: var(--layout-border-radius-medium);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n background: var(--surface-color-forms-default);\n}\n\n.bcds-react-aria-TextField[data-readonly]\n > .bcds-react-aria-TextField--container {\n background: var(--surface-color-forms-disabled);\n}\n\n.bcds-react-aria-TextField[data-readonly]\n > .bcds-react-aria-TextField--container\n > .bcds-react-aria-TextField--Input {\n background: var(--surface-color-forms-disabled);\n}\n\n/* Styles for the error message slot */\n.bcds-react-aria-TextField--Error {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n\n.bcds-react-aria-TextField[data-invalid]\n > .bcds-react-aria-TextField--container\n > svg#exclamation-icon {\n color: var(--icons-color-danger);\n min-width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n";
|
|
14102
15005
|
styleInject(css_248z$2);
|
|
14103
15006
|
|
|
14104
|
-
/* Icon displayed when input is in invalid state */
|
|
14105
|
-
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)" }) }) }));
|
|
14106
15007
|
function TextField({ size, label, description, errorMessage, iconLeft, iconRight, ...props }) {
|
|
14107
|
-
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 &&
|
|
15008
|
+
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 && jsx(SvgExclamationIcon, {}), 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 })] })) }));
|
|
14108
15009
|
}
|
|
14109
15010
|
|
|
14110
15011
|
var css_248z$1 = ".bcds-react-aria-Switch {\n display: flex;\n align-items: center;\n gap: var(--layout-margin-small);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n forced-color-adjust: none;\n}\n\n/* Container */\n.bcds-react-aria-Switch > .indicator {\n align-items: center;\n width: var(--layout-margin-xxlarge);\n height: var(--icons-size-medium);\n background-color: var(--surface-color-primary-disabled);\n border-radius: var(--icons-size-medium);\n transition: all 200ms;\n}\n\n/* Indicator */\n.bcds-react-aria-Switch > .indicator::before {\n content: \"\";\n display: block;\n box-sizing: border-box;\n width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n background-color: var(--surface-color-secondary-default);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-medium);\n border-radius: var(--icons-size-small);\n transition: all 200ms;\n}\n\n/* Selected */\n.bcds-react-aria-Switch[data-selected] > .indicator {\n background-color: var(--surface-color-primary-default);\n}\n\n.bcds-react-aria-Switch[data-selected] > .indicator::before {\n transform: translateX(100%);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-primary-default);\n}\n\n/* Hover */\n.bcds-react-aria-Switch[data-hovered] > .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-hover);\n}\n\n.bcds-react-aria-Switch[data-hovered] > .indicator::before {\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-dark);\n}\n\n.bcds-react-aria-Switch[data-hovered][data-selected] > .indicator::before {\n border: var(--layout-border-width-medium) solid\n var(--surface-color-primary-hover);\n}\n\n/* Focused */\n.bcds-react-aria-Switch[data-focus-visible] > .indicator {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Disabled */\n.bcds-react-aria-Switch[data-disabled] {\n color: var(--typography-color-disabled);\n}\n\n.bcds-react-aria-Switch[data-disabled] > .indicator {\n background-color: var(--surface-color-primary-disabled);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-Switch[data-disabled] > .indicator::before {\n background-color: var(--theme-gray-10);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-default);\n}\n\n/* Read only */\n.bcds-react-aria-Switch[data-readonly] > .indicator {\n cursor: not-allowed;\n}\n";
|
|
@@ -14117,13 +15018,9 @@ function Switch({ labelPosition = "right", children, ...props }) {
|
|
|
14117
15018
|
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";
|
|
14118
15019
|
styleInject(css_248z);
|
|
14119
15020
|
|
|
14120
|
-
// This tooltip arrow is available as a plain SVG at src/assets/tooltip-arrow-up.svg
|
|
14121
|
-
function SvgTooltipArrowUp() {
|
|
14122
|
-
return (jsx("svg", { width: "19", height: "9", viewBox: "0 0 19 9", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M8.4188 1.41421C9.19985 0.633163 10.4662 0.633165 11.2472 1.41421L18.833 9L0.833008 9L8.4188 1.41421Z", fill: "currentColor" }) }));
|
|
14123
|
-
}
|
|
14124
15021
|
function Tooltip(props) {
|
|
14125
15022
|
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 })] }));
|
|
14126
15023
|
}
|
|
14127
15024
|
|
|
14128
|
-
export { Button, ButtonGroup, Footer, FooterLinks, Form, Header, InlineAlert, Select, SvgBcLogo, SvgCheckCircleIcon, SvgChevronDownIcon, SvgChevronUpIcon, SvgCloseIcon, SvgExclamationCircleIcon, SvgExclamationIcon, SvgInfoIcon, Switch, Tag, TagGroup, TagList, TextArea, TextField, Tooltip, $4e3b923658d69c60$export$8c610744efcf8a1d as TooltipTrigger };
|
|
15025
|
+
export { Button, ButtonGroup, Checkbox, CheckboxGroup, Footer, FooterLinks, Form, Header, InlineAlert, Radio, RadioGroup, Select, SvgBcLogo, SvgCheckCircleIcon, SvgCheckIcon, SvgChevronDownIcon, SvgChevronUpIcon, SvgCloseIcon, SvgDashIcon, SvgExclamationCircleIcon, SvgExclamationIcon, SvgInfoIcon, SvgTooltipArrowUp, Switch, Tag, TagGroup, TagList, TextArea, TextField, Tooltip, $4e3b923658d69c60$export$8c610744efcf8a1d as TooltipTrigger };
|
|
14129
15026
|
//# sourceMappingURL=index.js.map
|