@bcgov/design-system-react-components 0.5.2-pr604 → 0.5.2-pr611
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/dist/cjs/index.cjs +2157 -134
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/esm/index.js +2152 -134
- package/dist/esm/index.js.map +1 -1
- package/dist/index.d.ts +31 -4
- package/package.json +1 -1
package/dist/esm/index.js
CHANGED
|
@@ -29,8 +29,8 @@ function styleInject(css, ref) {
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
-
var css_248z$s = "/**\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 --layout-border-radius-circular: 9999px; /* Used for components with a circular radius */\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-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$t = "/**\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 --layout-border-radius-circular: 9999px; /* Used for components with a circular radius */\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-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$t);
|
|
34
34
|
|
|
35
35
|
/*
|
|
36
36
|
* Copyright 2024 Adobe. All rights reserved.
|
|
@@ -2008,6 +2008,36 @@ function $458b0a5536c1a7cf$export$40bfa8c7b0832715(value, defaultValue, onChange
|
|
|
2008
2008
|
let newValue = Math.min(Math.max(value, min), max);
|
|
2009
2009
|
return newValue;
|
|
2010
2010
|
}
|
|
2011
|
+
function $9446cca9a3875146$export$e1a7b8e69ef6c52f(value, step) {
|
|
2012
|
+
let roundedValue = value;
|
|
2013
|
+
let precision = 0;
|
|
2014
|
+
let stepString = step.toString();
|
|
2015
|
+
// Handle negative exponents in exponential notation (e.g., "1e-7" → precision 8)
|
|
2016
|
+
let eIndex = stepString.toLowerCase().indexOf('e-');
|
|
2017
|
+
if (eIndex > 0) precision = Math.abs(Math.floor(Math.log10(Math.abs(step)))) + eIndex;
|
|
2018
|
+
else {
|
|
2019
|
+
let pointIndex = stepString.indexOf('.');
|
|
2020
|
+
if (pointIndex >= 0) precision = stepString.length - pointIndex;
|
|
2021
|
+
}
|
|
2022
|
+
if (precision > 0) {
|
|
2023
|
+
let pow = Math.pow(10, precision);
|
|
2024
|
+
roundedValue = Math.round(roundedValue * pow) / pow;
|
|
2025
|
+
}
|
|
2026
|
+
return roundedValue;
|
|
2027
|
+
}
|
|
2028
|
+
function $9446cca9a3875146$export$cb6e0bb50bc19463(value, min, max, step) {
|
|
2029
|
+
min = Number(min);
|
|
2030
|
+
max = Number(max);
|
|
2031
|
+
let remainder = (value - (isNaN(min) ? 0 : min)) % step;
|
|
2032
|
+
let snappedValue = $9446cca9a3875146$export$e1a7b8e69ef6c52f(Math.abs(remainder) * 2 >= step ? value + Math.sign(remainder) * (step - Math.abs(remainder)) : value - remainder, step);
|
|
2033
|
+
if (!isNaN(min)) {
|
|
2034
|
+
if (snappedValue < min) snappedValue = min;
|
|
2035
|
+
else if (!isNaN(max) && snappedValue > max) snappedValue = min + Math.floor($9446cca9a3875146$export$e1a7b8e69ef6c52f((max - min) / step, step)) * step;
|
|
2036
|
+
} else if (!isNaN(max) && snappedValue > max) snappedValue = Math.floor($9446cca9a3875146$export$e1a7b8e69ef6c52f(max / step, step)) * step;
|
|
2037
|
+
// correct floating point behavior by rounding to step precision
|
|
2038
|
+
snappedValue = $9446cca9a3875146$export$e1a7b8e69ef6c52f(snappedValue, step);
|
|
2039
|
+
return snappedValue;
|
|
2040
|
+
}
|
|
2011
2041
|
|
|
2012
2042
|
/*
|
|
2013
2043
|
* Copyright 2022 Adobe. All rights reserved.
|
|
@@ -2178,6 +2208,9 @@ function $319e236875307eab$export$a9b970dcc4ae71a9(message, assertiveness = 'ass
|
|
|
2178
2208
|
else $319e236875307eab$var$liveAnnouncer.announce(message, assertiveness, timeout);
|
|
2179
2209
|
} else $319e236875307eab$var$liveAnnouncer.announce(message, assertiveness, timeout);
|
|
2180
2210
|
}
|
|
2211
|
+
function $319e236875307eab$export$d10ae4f68404609a(assertiveness) {
|
|
2212
|
+
if ($319e236875307eab$var$liveAnnouncer) $319e236875307eab$var$liveAnnouncer.clear(assertiveness);
|
|
2213
|
+
}
|
|
2181
2214
|
// LiveAnnouncer is implemented using vanilla DOM, not React. That's because as of React 18
|
|
2182
2215
|
// ReactDOM.render is deprecated, and the replacement, ReactDOM.createRoot is moved into a
|
|
2183
2216
|
// subpath import `react-dom/client`. That makes it hard for us to support multiple React versions.
|
|
@@ -3020,6 +3053,444 @@ function _class_private_field_init(obj, privateMap, value) {
|
|
|
3020
3053
|
privateMap.set(obj, value);
|
|
3021
3054
|
}
|
|
3022
3055
|
|
|
3056
|
+
/*
|
|
3057
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
3058
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
3059
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
3060
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
3061
|
+
*
|
|
3062
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
3063
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
3064
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
3065
|
+
* governing permissions and limitations under the License.
|
|
3066
|
+
*/ let $488c6ddbf4ef74c2$var$formatterCache = new Map();
|
|
3067
|
+
let $488c6ddbf4ef74c2$var$supportsSignDisplay = false;
|
|
3068
|
+
try {
|
|
3069
|
+
$488c6ddbf4ef74c2$var$supportsSignDisplay = new Intl.NumberFormat('de-DE', {
|
|
3070
|
+
signDisplay: 'exceptZero'
|
|
3071
|
+
}).resolvedOptions().signDisplay === 'exceptZero';
|
|
3072
|
+
// eslint-disable-next-line no-empty
|
|
3073
|
+
} catch {}
|
|
3074
|
+
let $488c6ddbf4ef74c2$var$supportsUnit = false;
|
|
3075
|
+
try {
|
|
3076
|
+
$488c6ddbf4ef74c2$var$supportsUnit = new Intl.NumberFormat('de-DE', {
|
|
3077
|
+
style: 'unit',
|
|
3078
|
+
unit: 'degree'
|
|
3079
|
+
}).resolvedOptions().style === 'unit';
|
|
3080
|
+
// eslint-disable-next-line no-empty
|
|
3081
|
+
} catch {}
|
|
3082
|
+
// Polyfill for units since Safari doesn't support them yet. See https://bugs.webkit.org/show_bug.cgi?id=215438.
|
|
3083
|
+
// Currently only polyfilling the unit degree in narrow format for ColorSlider in our supported locales.
|
|
3084
|
+
// Values were determined by switching to each locale manually in Chrome.
|
|
3085
|
+
const $488c6ddbf4ef74c2$var$UNITS = {
|
|
3086
|
+
degree: {
|
|
3087
|
+
narrow: {
|
|
3088
|
+
default: "\xb0",
|
|
3089
|
+
'ja-JP': " \u5EA6",
|
|
3090
|
+
'zh-TW': "\u5EA6",
|
|
3091
|
+
'sl-SI': " \xb0"
|
|
3092
|
+
}
|
|
3093
|
+
}
|
|
3094
|
+
};
|
|
3095
|
+
class $488c6ddbf4ef74c2$export$cc77c4ff7e8673c5 {
|
|
3096
|
+
/** Formats a number value as a string, according to the locale and options provided to the constructor. */ format(value) {
|
|
3097
|
+
let res = '';
|
|
3098
|
+
if (!$488c6ddbf4ef74c2$var$supportsSignDisplay && this.options.signDisplay != null) res = $488c6ddbf4ef74c2$export$711b50b3c525e0f2(this.numberFormatter, this.options.signDisplay, value);
|
|
3099
|
+
else res = this.numberFormatter.format(value);
|
|
3100
|
+
if (this.options.style === 'unit' && !$488c6ddbf4ef74c2$var$supportsUnit) {
|
|
3101
|
+
var _UNITS_unit;
|
|
3102
|
+
let { unit: unit, unitDisplay: unitDisplay = 'short', locale: locale } = this.resolvedOptions();
|
|
3103
|
+
if (!unit) return res;
|
|
3104
|
+
let values = (_UNITS_unit = $488c6ddbf4ef74c2$var$UNITS[unit]) === null || _UNITS_unit === void 0 ? void 0 : _UNITS_unit[unitDisplay];
|
|
3105
|
+
res += values[locale] || values.default;
|
|
3106
|
+
}
|
|
3107
|
+
return res;
|
|
3108
|
+
}
|
|
3109
|
+
/** Formats a number to an array of parts such as separators, digits, punctuation, and more. */ formatToParts(value) {
|
|
3110
|
+
// TODO: implement signDisplay for formatToParts
|
|
3111
|
+
return this.numberFormatter.formatToParts(value);
|
|
3112
|
+
}
|
|
3113
|
+
/** Formats a number range as a string. */ formatRange(start, end) {
|
|
3114
|
+
if (typeof this.numberFormatter.formatRange === 'function') return this.numberFormatter.formatRange(start, end);
|
|
3115
|
+
if (end < start) throw new RangeError('End date must be >= start date');
|
|
3116
|
+
// Very basic fallback for old browsers.
|
|
3117
|
+
return `${this.format(start)} \u{2013} ${this.format(end)}`;
|
|
3118
|
+
}
|
|
3119
|
+
/** Formats a number range as an array of parts. */ formatRangeToParts(start, end) {
|
|
3120
|
+
if (typeof this.numberFormatter.formatRangeToParts === 'function') return this.numberFormatter.formatRangeToParts(start, end);
|
|
3121
|
+
if (end < start) throw new RangeError('End date must be >= start date');
|
|
3122
|
+
let startParts = this.numberFormatter.formatToParts(start);
|
|
3123
|
+
let endParts = this.numberFormatter.formatToParts(end);
|
|
3124
|
+
return [
|
|
3125
|
+
...startParts.map((p)=>({
|
|
3126
|
+
...p,
|
|
3127
|
+
source: 'startRange'
|
|
3128
|
+
})),
|
|
3129
|
+
{
|
|
3130
|
+
type: 'literal',
|
|
3131
|
+
value: " \u2013 ",
|
|
3132
|
+
source: 'shared'
|
|
3133
|
+
},
|
|
3134
|
+
...endParts.map((p)=>({
|
|
3135
|
+
...p,
|
|
3136
|
+
source: 'endRange'
|
|
3137
|
+
}))
|
|
3138
|
+
];
|
|
3139
|
+
}
|
|
3140
|
+
/** Returns the resolved formatting options based on the values passed to the constructor. */ resolvedOptions() {
|
|
3141
|
+
let options = this.numberFormatter.resolvedOptions();
|
|
3142
|
+
if (!$488c6ddbf4ef74c2$var$supportsSignDisplay && this.options.signDisplay != null) options = {
|
|
3143
|
+
...options,
|
|
3144
|
+
signDisplay: this.options.signDisplay
|
|
3145
|
+
};
|
|
3146
|
+
if (!$488c6ddbf4ef74c2$var$supportsUnit && this.options.style === 'unit') options = {
|
|
3147
|
+
...options,
|
|
3148
|
+
style: 'unit',
|
|
3149
|
+
unit: this.options.unit,
|
|
3150
|
+
unitDisplay: this.options.unitDisplay
|
|
3151
|
+
};
|
|
3152
|
+
return options;
|
|
3153
|
+
}
|
|
3154
|
+
constructor(locale, options = {}){
|
|
3155
|
+
this.numberFormatter = $488c6ddbf4ef74c2$var$getCachedNumberFormatter(locale, options);
|
|
3156
|
+
this.options = options;
|
|
3157
|
+
}
|
|
3158
|
+
}
|
|
3159
|
+
function $488c6ddbf4ef74c2$var$getCachedNumberFormatter(locale, options = {}) {
|
|
3160
|
+
let { numberingSystem: numberingSystem } = options;
|
|
3161
|
+
if (numberingSystem && locale.includes('-nu-')) {
|
|
3162
|
+
if (!locale.includes('-u-')) locale += '-u-';
|
|
3163
|
+
locale += `-nu-${numberingSystem}`;
|
|
3164
|
+
}
|
|
3165
|
+
if (options.style === 'unit' && !$488c6ddbf4ef74c2$var$supportsUnit) {
|
|
3166
|
+
var _UNITS_unit;
|
|
3167
|
+
let { unit: unit, unitDisplay: unitDisplay = 'short' } = options;
|
|
3168
|
+
if (!unit) throw new Error('unit option must be provided with style: "unit"');
|
|
3169
|
+
if (!((_UNITS_unit = $488c6ddbf4ef74c2$var$UNITS[unit]) === null || _UNITS_unit === void 0 ? void 0 : _UNITS_unit[unitDisplay])) throw new Error(`Unsupported unit ${unit} with unitDisplay = ${unitDisplay}`);
|
|
3170
|
+
options = {
|
|
3171
|
+
...options,
|
|
3172
|
+
style: 'decimal'
|
|
3173
|
+
};
|
|
3174
|
+
}
|
|
3175
|
+
let cacheKey = locale + (options ? Object.entries(options).sort((a, b)=>a[0] < b[0] ? -1 : 1).join() : '');
|
|
3176
|
+
if ($488c6ddbf4ef74c2$var$formatterCache.has(cacheKey)) return $488c6ddbf4ef74c2$var$formatterCache.get(cacheKey);
|
|
3177
|
+
let numberFormatter = new Intl.NumberFormat(locale, options);
|
|
3178
|
+
$488c6ddbf4ef74c2$var$formatterCache.set(cacheKey, numberFormatter);
|
|
3179
|
+
return numberFormatter;
|
|
3180
|
+
}
|
|
3181
|
+
function $488c6ddbf4ef74c2$export$711b50b3c525e0f2(numberFormat, signDisplay, num) {
|
|
3182
|
+
if (signDisplay === 'auto') return numberFormat.format(num);
|
|
3183
|
+
else if (signDisplay === 'never') return numberFormat.format(Math.abs(num));
|
|
3184
|
+
else {
|
|
3185
|
+
let needsPositiveSign = false;
|
|
3186
|
+
if (signDisplay === 'always') needsPositiveSign = num > 0 || Object.is(num, 0);
|
|
3187
|
+
else if (signDisplay === 'exceptZero') {
|
|
3188
|
+
if (Object.is(num, -0) || Object.is(num, 0)) num = Math.abs(num);
|
|
3189
|
+
else needsPositiveSign = num > 0;
|
|
3190
|
+
}
|
|
3191
|
+
if (needsPositiveSign) {
|
|
3192
|
+
let negative = numberFormat.format(-num);
|
|
3193
|
+
let noSign = numberFormat.format(num);
|
|
3194
|
+
// ignore RTL/LTR marker character
|
|
3195
|
+
let minus = negative.replace(noSign, '').replace(/\u200e|\u061C/, '');
|
|
3196
|
+
if ([
|
|
3197
|
+
...minus
|
|
3198
|
+
].length !== 1) console.warn('@react-aria/i18n polyfill for NumberFormat signDisplay: Unsupported case');
|
|
3199
|
+
let positive = negative.replace(noSign, '!!!').replace(minus, '+').replace('!!!', noSign);
|
|
3200
|
+
return positive;
|
|
3201
|
+
} else return numberFormat.format(num);
|
|
3202
|
+
}
|
|
3203
|
+
}
|
|
3204
|
+
|
|
3205
|
+
/*
|
|
3206
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
3207
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
3208
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
3209
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
3210
|
+
*
|
|
3211
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
3212
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
3213
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
3214
|
+
* governing permissions and limitations under the License.
|
|
3215
|
+
*/
|
|
3216
|
+
const $6c7bd7858deea686$var$CURRENCY_SIGN_REGEX = new RegExp('^.*\\(.*\\).*$');
|
|
3217
|
+
const $6c7bd7858deea686$var$NUMBERING_SYSTEMS = [
|
|
3218
|
+
'latn',
|
|
3219
|
+
'arab',
|
|
3220
|
+
'hanidec',
|
|
3221
|
+
'deva',
|
|
3222
|
+
'beng',
|
|
3223
|
+
'fullwide'
|
|
3224
|
+
];
|
|
3225
|
+
class $6c7bd7858deea686$export$cd11ab140839f11d {
|
|
3226
|
+
/**
|
|
3227
|
+
* Parses the given string to a number. Returns NaN if a valid number could not be parsed.
|
|
3228
|
+
*/ parse(value) {
|
|
3229
|
+
return $6c7bd7858deea686$var$getNumberParserImpl(this.locale, this.options, value).parse(value);
|
|
3230
|
+
}
|
|
3231
|
+
/**
|
|
3232
|
+
* Returns whether the given string could potentially be a valid number. This should be used to
|
|
3233
|
+
* validate user input as the user types. If a `minValue` or `maxValue` is provided, the validity
|
|
3234
|
+
* of the minus/plus sign characters can be checked.
|
|
3235
|
+
*/ isValidPartialNumber(value, minValue, maxValue) {
|
|
3236
|
+
return $6c7bd7858deea686$var$getNumberParserImpl(this.locale, this.options, value).isValidPartialNumber(value, minValue, maxValue);
|
|
3237
|
+
}
|
|
3238
|
+
/**
|
|
3239
|
+
* Returns a numbering system for which the given string is valid in the current locale.
|
|
3240
|
+
* If no numbering system could be detected, the default numbering system for the current
|
|
3241
|
+
* locale is returned.
|
|
3242
|
+
*/ getNumberingSystem(value) {
|
|
3243
|
+
return $6c7bd7858deea686$var$getNumberParserImpl(this.locale, this.options, value).options.numberingSystem;
|
|
3244
|
+
}
|
|
3245
|
+
constructor(locale, options = {}){
|
|
3246
|
+
this.locale = locale;
|
|
3247
|
+
this.options = options;
|
|
3248
|
+
}
|
|
3249
|
+
}
|
|
3250
|
+
const $6c7bd7858deea686$var$numberParserCache = new Map();
|
|
3251
|
+
function $6c7bd7858deea686$var$getNumberParserImpl(locale, options, value) {
|
|
3252
|
+
// First try the default numbering system for the provided locale
|
|
3253
|
+
let defaultParser = $6c7bd7858deea686$var$getCachedNumberParser(locale, options);
|
|
3254
|
+
// If that doesn't match, and the locale doesn't include a hard coded numbering system,
|
|
3255
|
+
// try each of the other supported numbering systems until we find one that matches.
|
|
3256
|
+
if (!locale.includes('-nu-') && !defaultParser.isValidPartialNumber(value)) {
|
|
3257
|
+
for (let numberingSystem of $6c7bd7858deea686$var$NUMBERING_SYSTEMS)if (numberingSystem !== defaultParser.options.numberingSystem) {
|
|
3258
|
+
let parser = $6c7bd7858deea686$var$getCachedNumberParser(locale + (locale.includes('-u-') ? '-nu-' : '-u-nu-') + numberingSystem, options);
|
|
3259
|
+
if (parser.isValidPartialNumber(value)) return parser;
|
|
3260
|
+
}
|
|
3261
|
+
}
|
|
3262
|
+
return defaultParser;
|
|
3263
|
+
}
|
|
3264
|
+
function $6c7bd7858deea686$var$getCachedNumberParser(locale, options) {
|
|
3265
|
+
let cacheKey = locale + (options ? Object.entries(options).sort((a, b)=>a[0] < b[0] ? -1 : 1).join() : '');
|
|
3266
|
+
let parser = $6c7bd7858deea686$var$numberParserCache.get(cacheKey);
|
|
3267
|
+
if (!parser) {
|
|
3268
|
+
parser = new $6c7bd7858deea686$var$NumberParserImpl(locale, options);
|
|
3269
|
+
$6c7bd7858deea686$var$numberParserCache.set(cacheKey, parser);
|
|
3270
|
+
}
|
|
3271
|
+
return parser;
|
|
3272
|
+
}
|
|
3273
|
+
// The actual number parser implementation. Instances of this class are cached
|
|
3274
|
+
// based on the locale, options, and detected numbering system.
|
|
3275
|
+
class $6c7bd7858deea686$var$NumberParserImpl {
|
|
3276
|
+
parse(value) {
|
|
3277
|
+
// to parse the number, we need to remove anything that isn't actually part of the number, for example we want '-10.40' not '-10.40 USD'
|
|
3278
|
+
let fullySanitizedValue = this.sanitize(value);
|
|
3279
|
+
if (this.symbols.group) // Remove group characters, and replace decimal points and numerals with ASCII values.
|
|
3280
|
+
fullySanitizedValue = $6c7bd7858deea686$var$replaceAll(fullySanitizedValue, this.symbols.group, '');
|
|
3281
|
+
if (this.symbols.decimal) fullySanitizedValue = fullySanitizedValue.replace(this.symbols.decimal, '.');
|
|
3282
|
+
if (this.symbols.minusSign) fullySanitizedValue = fullySanitizedValue.replace(this.symbols.minusSign, '-');
|
|
3283
|
+
fullySanitizedValue = fullySanitizedValue.replace(this.symbols.numeral, this.symbols.index);
|
|
3284
|
+
if (this.options.style === 'percent') {
|
|
3285
|
+
// javascript is bad at dividing by 100 and maintaining the same significant figures, so perform it on the string before parsing
|
|
3286
|
+
let isNegative = fullySanitizedValue.indexOf('-');
|
|
3287
|
+
fullySanitizedValue = fullySanitizedValue.replace('-', '');
|
|
3288
|
+
fullySanitizedValue = fullySanitizedValue.replace('+', '');
|
|
3289
|
+
let index = fullySanitizedValue.indexOf('.');
|
|
3290
|
+
if (index === -1) index = fullySanitizedValue.length;
|
|
3291
|
+
fullySanitizedValue = fullySanitizedValue.replace('.', '');
|
|
3292
|
+
if (index - 2 === 0) fullySanitizedValue = `0.${fullySanitizedValue}`;
|
|
3293
|
+
else if (index - 2 === -1) fullySanitizedValue = `0.0${fullySanitizedValue}`;
|
|
3294
|
+
else if (index - 2 === -2) fullySanitizedValue = '0.00';
|
|
3295
|
+
else fullySanitizedValue = `${fullySanitizedValue.slice(0, index - 2)}.${fullySanitizedValue.slice(index - 2)}`;
|
|
3296
|
+
if (isNegative > -1) fullySanitizedValue = `-${fullySanitizedValue}`;
|
|
3297
|
+
}
|
|
3298
|
+
let newValue = fullySanitizedValue ? +fullySanitizedValue : NaN;
|
|
3299
|
+
if (isNaN(newValue)) return NaN;
|
|
3300
|
+
if (this.options.style === 'percent') {
|
|
3301
|
+
var _this_options_minimumFractionDigits, _this_options_maximumFractionDigits;
|
|
3302
|
+
// extra step for rounding percents to what our formatter would output
|
|
3303
|
+
let options = {
|
|
3304
|
+
...this.options,
|
|
3305
|
+
style: 'decimal',
|
|
3306
|
+
minimumFractionDigits: Math.min(((_this_options_minimumFractionDigits = this.options.minimumFractionDigits) !== null && _this_options_minimumFractionDigits !== void 0 ? _this_options_minimumFractionDigits : 0) + 2, 20),
|
|
3307
|
+
maximumFractionDigits: Math.min(((_this_options_maximumFractionDigits = this.options.maximumFractionDigits) !== null && _this_options_maximumFractionDigits !== void 0 ? _this_options_maximumFractionDigits : 0) + 2, 20)
|
|
3308
|
+
};
|
|
3309
|
+
return new $6c7bd7858deea686$export$cd11ab140839f11d(this.locale, options).parse(new ($488c6ddbf4ef74c2$export$cc77c4ff7e8673c5)(this.locale, options).format(newValue));
|
|
3310
|
+
}
|
|
3311
|
+
// accounting will always be stripped to a positive number, so if it's accounting and has a () around everything, then we need to make it negative again
|
|
3312
|
+
if (this.options.currencySign === 'accounting' && $6c7bd7858deea686$var$CURRENCY_SIGN_REGEX.test(value)) newValue = -1 * newValue;
|
|
3313
|
+
return newValue;
|
|
3314
|
+
}
|
|
3315
|
+
sanitize(value) {
|
|
3316
|
+
// Remove literals and whitespace, which are allowed anywhere in the string
|
|
3317
|
+
value = value.replace(this.symbols.literals, '');
|
|
3318
|
+
// Replace the ASCII minus sign with the minus sign used in the current locale
|
|
3319
|
+
// so that both are allowed in case the user's keyboard doesn't have the locale's minus sign.
|
|
3320
|
+
if (this.symbols.minusSign) value = value.replace('-', this.symbols.minusSign);
|
|
3321
|
+
// In arab numeral system, their decimal character is 1643, but most keyboards don't type that
|
|
3322
|
+
// instead they use the , (44) character or apparently the (1548) character.
|
|
3323
|
+
if (this.options.numberingSystem === 'arab') {
|
|
3324
|
+
if (this.symbols.decimal) {
|
|
3325
|
+
value = value.replace(',', this.symbols.decimal);
|
|
3326
|
+
value = value.replace(String.fromCharCode(1548), this.symbols.decimal);
|
|
3327
|
+
}
|
|
3328
|
+
if (this.symbols.group) value = $6c7bd7858deea686$var$replaceAll(value, '.', this.symbols.group);
|
|
3329
|
+
}
|
|
3330
|
+
// In some locale styles, such as swiss currency, the group character can be a special single quote
|
|
3331
|
+
// that keyboards don't typically have. This expands the character to include the easier to type single quote.
|
|
3332
|
+
if (this.symbols.group === "\u2019" && value.includes("'")) value = $6c7bd7858deea686$var$replaceAll(value, "'", this.symbols.group);
|
|
3333
|
+
// fr-FR group character is narrow non-breaking space, char code 8239 (U+202F), but that's not a key on the french keyboard,
|
|
3334
|
+
// so allow space and non-breaking space as a group char as well
|
|
3335
|
+
if (this.options.locale === 'fr-FR' && this.symbols.group) {
|
|
3336
|
+
value = $6c7bd7858deea686$var$replaceAll(value, ' ', this.symbols.group);
|
|
3337
|
+
value = $6c7bd7858deea686$var$replaceAll(value, /\u00A0/g, this.symbols.group);
|
|
3338
|
+
}
|
|
3339
|
+
return value;
|
|
3340
|
+
}
|
|
3341
|
+
isValidPartialNumber(value, minValue = -Infinity, maxValue = Infinity) {
|
|
3342
|
+
value = this.sanitize(value);
|
|
3343
|
+
// Remove minus or plus sign, which must be at the start of the string.
|
|
3344
|
+
if (this.symbols.minusSign && value.startsWith(this.symbols.minusSign) && minValue < 0) value = value.slice(this.symbols.minusSign.length);
|
|
3345
|
+
else if (this.symbols.plusSign && value.startsWith(this.symbols.plusSign) && maxValue > 0) value = value.slice(this.symbols.plusSign.length);
|
|
3346
|
+
// Numbers cannot start with a group separator
|
|
3347
|
+
if (this.symbols.group && value.startsWith(this.symbols.group)) return false;
|
|
3348
|
+
// Numbers that can't have any decimal values fail if a decimal character is typed
|
|
3349
|
+
if (this.symbols.decimal && value.indexOf(this.symbols.decimal) > -1 && this.options.maximumFractionDigits === 0) return false;
|
|
3350
|
+
// Remove numerals, groups, and decimals
|
|
3351
|
+
if (this.symbols.group) value = $6c7bd7858deea686$var$replaceAll(value, this.symbols.group, '');
|
|
3352
|
+
value = value.replace(this.symbols.numeral, '');
|
|
3353
|
+
if (this.symbols.decimal) value = value.replace(this.symbols.decimal, '');
|
|
3354
|
+
// The number is valid if there are no remaining characters
|
|
3355
|
+
return value.length === 0;
|
|
3356
|
+
}
|
|
3357
|
+
constructor(locale, options = {}){
|
|
3358
|
+
this.locale = locale;
|
|
3359
|
+
// see https://tc39.es/ecma402/#sec-setnfdigitoptions, when using roundingIncrement, the maximumFractionDigits and minimumFractionDigits must be equal
|
|
3360
|
+
// by default, they are 0 and 3 respectively, so we set them to 0 if neither are set
|
|
3361
|
+
if (options.roundingIncrement !== 1 && options.roundingIncrement != null) {
|
|
3362
|
+
if (options.maximumFractionDigits == null && options.minimumFractionDigits == null) {
|
|
3363
|
+
options.maximumFractionDigits = 0;
|
|
3364
|
+
options.minimumFractionDigits = 0;
|
|
3365
|
+
} else if (options.maximumFractionDigits == null) options.maximumFractionDigits = options.minimumFractionDigits;
|
|
3366
|
+
else if (options.minimumFractionDigits == null) options.minimumFractionDigits = options.maximumFractionDigits;
|
|
3367
|
+
// if both are specified, let the normal Range Error be thrown
|
|
3368
|
+
}
|
|
3369
|
+
this.formatter = new Intl.NumberFormat(locale, options);
|
|
3370
|
+
this.options = this.formatter.resolvedOptions();
|
|
3371
|
+
this.symbols = $6c7bd7858deea686$var$getSymbols(locale, this.formatter, this.options, options);
|
|
3372
|
+
var _this_options_minimumFractionDigits, _this_options_maximumFractionDigits;
|
|
3373
|
+
if (this.options.style === 'percent' && (((_this_options_minimumFractionDigits = this.options.minimumFractionDigits) !== null && _this_options_minimumFractionDigits !== void 0 ? _this_options_minimumFractionDigits : 0) > 18 || ((_this_options_maximumFractionDigits = this.options.maximumFractionDigits) !== null && _this_options_maximumFractionDigits !== void 0 ? _this_options_maximumFractionDigits : 0) > 18)) console.warn('NumberParser cannot handle percentages with greater than 18 decimal places, please reduce the number in your options.');
|
|
3374
|
+
}
|
|
3375
|
+
}
|
|
3376
|
+
const $6c7bd7858deea686$var$nonLiteralParts = new Set([
|
|
3377
|
+
'decimal',
|
|
3378
|
+
'fraction',
|
|
3379
|
+
'integer',
|
|
3380
|
+
'minusSign',
|
|
3381
|
+
'plusSign',
|
|
3382
|
+
'group'
|
|
3383
|
+
]);
|
|
3384
|
+
// This list is derived from https://www.unicode.org/cldr/charts/43/supplemental/language_plural_rules.html#comparison and includes
|
|
3385
|
+
// all unique numbers which we need to check in order to determine all the plural forms for a given locale.
|
|
3386
|
+
// See: https://github.com/adobe/react-spectrum/pull/5134/files#r1337037855 for used script
|
|
3387
|
+
const $6c7bd7858deea686$var$pluralNumbers = [
|
|
3388
|
+
0,
|
|
3389
|
+
4,
|
|
3390
|
+
2,
|
|
3391
|
+
1,
|
|
3392
|
+
11,
|
|
3393
|
+
20,
|
|
3394
|
+
3,
|
|
3395
|
+
7,
|
|
3396
|
+
100,
|
|
3397
|
+
21,
|
|
3398
|
+
0.1,
|
|
3399
|
+
1.1
|
|
3400
|
+
];
|
|
3401
|
+
function $6c7bd7858deea686$var$getSymbols(locale, formatter, intlOptions, originalOptions) {
|
|
3402
|
+
var _allParts_find, _posAllParts_find, _decimalParts_find, _allParts_find1;
|
|
3403
|
+
// formatter needs access to all decimal places in order to generate the correct literal strings for the plural set
|
|
3404
|
+
let symbolFormatter = new Intl.NumberFormat(locale, {
|
|
3405
|
+
...intlOptions,
|
|
3406
|
+
// Resets so we get the full range of symbols
|
|
3407
|
+
minimumSignificantDigits: 1,
|
|
3408
|
+
maximumSignificantDigits: 21,
|
|
3409
|
+
roundingIncrement: 1,
|
|
3410
|
+
roundingPriority: 'auto',
|
|
3411
|
+
roundingMode: 'halfExpand'
|
|
3412
|
+
});
|
|
3413
|
+
// Note: some locale's don't add a group symbol until there is a ten thousands place
|
|
3414
|
+
let allParts = symbolFormatter.formatToParts(-10000.111);
|
|
3415
|
+
let posAllParts = symbolFormatter.formatToParts(10000.111);
|
|
3416
|
+
let pluralParts = $6c7bd7858deea686$var$pluralNumbers.map((n)=>symbolFormatter.formatToParts(n));
|
|
3417
|
+
var _allParts_find_value;
|
|
3418
|
+
let minusSign = (_allParts_find_value = (_allParts_find = allParts.find((p)=>p.type === 'minusSign')) === null || _allParts_find === void 0 ? void 0 : _allParts_find.value) !== null && _allParts_find_value !== void 0 ? _allParts_find_value : '-';
|
|
3419
|
+
let plusSign = (_posAllParts_find = posAllParts.find((p)=>p.type === 'plusSign')) === null || _posAllParts_find === void 0 ? void 0 : _posAllParts_find.value;
|
|
3420
|
+
// Safari does not support the signDisplay option, but our number parser polyfills it.
|
|
3421
|
+
// If no plus sign was returned, but the original options contained signDisplay, default to the '+' character.
|
|
3422
|
+
if (!plusSign && ((originalOptions === null || originalOptions === void 0 ? void 0 : originalOptions.signDisplay) === 'exceptZero' || (originalOptions === null || originalOptions === void 0 ? void 0 : originalOptions.signDisplay) === 'always')) plusSign = '+';
|
|
3423
|
+
// If maximumSignificantDigits is 1 (the minimum) then we won't get decimal characters out of the above formatters
|
|
3424
|
+
// Percent also defaults to 0 fractionDigits, so we need to make a new one that isn't percent to get an accurate decimal
|
|
3425
|
+
let decimalParts = new Intl.NumberFormat(locale, {
|
|
3426
|
+
...intlOptions,
|
|
3427
|
+
minimumFractionDigits: 2,
|
|
3428
|
+
maximumFractionDigits: 2
|
|
3429
|
+
}).formatToParts(0.001);
|
|
3430
|
+
let decimal = (_decimalParts_find = decimalParts.find((p)=>p.type === 'decimal')) === null || _decimalParts_find === void 0 ? void 0 : _decimalParts_find.value;
|
|
3431
|
+
let group = (_allParts_find1 = allParts.find((p)=>p.type === 'group')) === null || _allParts_find1 === void 0 ? void 0 : _allParts_find1.value;
|
|
3432
|
+
// this set is also for a regex, it's all literals that might be in the string we want to eventually parse that
|
|
3433
|
+
// don't contribute to the numerical value
|
|
3434
|
+
let allPartsLiterals = allParts.filter((p)=>!$6c7bd7858deea686$var$nonLiteralParts.has(p.type)).map((p)=>$6c7bd7858deea686$var$escapeRegex(p.value));
|
|
3435
|
+
let pluralPartsLiterals = pluralParts.flatMap((p)=>p.filter((p)=>!$6c7bd7858deea686$var$nonLiteralParts.has(p.type)).map((p)=>$6c7bd7858deea686$var$escapeRegex(p.value)));
|
|
3436
|
+
let sortedLiterals = [
|
|
3437
|
+
...new Set([
|
|
3438
|
+
...allPartsLiterals,
|
|
3439
|
+
...pluralPartsLiterals
|
|
3440
|
+
])
|
|
3441
|
+
].sort((a, b)=>b.length - a.length);
|
|
3442
|
+
let literals = sortedLiterals.length === 0 ? new RegExp('[\\p{White_Space}]', 'gu') : new RegExp(`${sortedLiterals.join('|')}|[\\p{White_Space}]`, 'gu');
|
|
3443
|
+
// These are for replacing non-latn characters with the latn equivalent
|
|
3444
|
+
let numerals = [
|
|
3445
|
+
...new Intl.NumberFormat(intlOptions.locale, {
|
|
3446
|
+
useGrouping: false
|
|
3447
|
+
}).format(9876543210)
|
|
3448
|
+
].reverse();
|
|
3449
|
+
let indexes = new Map(numerals.map((d, i)=>[
|
|
3450
|
+
d,
|
|
3451
|
+
i
|
|
3452
|
+
]));
|
|
3453
|
+
let numeral = new RegExp(`[${numerals.join('')}]`, 'g');
|
|
3454
|
+
let index = (d)=>String(indexes.get(d));
|
|
3455
|
+
return {
|
|
3456
|
+
minusSign: minusSign,
|
|
3457
|
+
plusSign: plusSign,
|
|
3458
|
+
decimal: decimal,
|
|
3459
|
+
group: group,
|
|
3460
|
+
literals: literals,
|
|
3461
|
+
numeral: numeral,
|
|
3462
|
+
index: index
|
|
3463
|
+
};
|
|
3464
|
+
}
|
|
3465
|
+
function $6c7bd7858deea686$var$replaceAll(str, find, replace) {
|
|
3466
|
+
if (str.replaceAll) return str.replaceAll(find, replace);
|
|
3467
|
+
return str.split(find).join(replace);
|
|
3468
|
+
}
|
|
3469
|
+
function $6c7bd7858deea686$var$escapeRegex(string) {
|
|
3470
|
+
return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
|
|
3471
|
+
}
|
|
3472
|
+
|
|
3473
|
+
/*
|
|
3474
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
3475
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
3476
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
3477
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
3478
|
+
*
|
|
3479
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
3480
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
3481
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
3482
|
+
* governing permissions and limitations under the License.
|
|
3483
|
+
*/
|
|
3484
|
+
|
|
3485
|
+
|
|
3486
|
+
function $a916eb452884faea$export$b7a616150fdb9f44(options = {}) {
|
|
3487
|
+
let { locale: locale } = ($18f2051aff69b9bf$export$43bb16f9c6d9e3f7)();
|
|
3488
|
+
return (useMemo)(()=>new ($488c6ddbf4ef74c2$export$cc77c4ff7e8673c5)(locale, options), [
|
|
3489
|
+
locale,
|
|
3490
|
+
options
|
|
3491
|
+
]);
|
|
3492
|
+
}
|
|
3493
|
+
|
|
3023
3494
|
/*
|
|
3024
3495
|
* Copyright 2020 Adobe. All rights reserved.
|
|
3025
3496
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -5056,6 +5527,36 @@ function $e0b6e0b68ec7f50f$var$isValidEvent(event, ref) {
|
|
|
5056
5527
|
return !event.composedPath().includes(ref.current);
|
|
5057
5528
|
}
|
|
5058
5529
|
|
|
5530
|
+
/*
|
|
5531
|
+
* Copyright 2021 Adobe. All rights reserved.
|
|
5532
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
5533
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
5534
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
5535
|
+
*
|
|
5536
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
5537
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
5538
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
5539
|
+
* governing permissions and limitations under the License.
|
|
5540
|
+
*/
|
|
5541
|
+
|
|
5542
|
+
function $7d0a636d7a4dcefd$export$2123ff2b87c81ca(props, ref) {
|
|
5543
|
+
let { onScroll: onScroll, isDisabled: isDisabled } = props;
|
|
5544
|
+
let onScrollHandler = (useCallback)((e)=>{
|
|
5545
|
+
// If the ctrlKey is pressed, this is a zoom event, do nothing.
|
|
5546
|
+
if (e.ctrlKey) return;
|
|
5547
|
+
// stop scrolling the page
|
|
5548
|
+
e.preventDefault();
|
|
5549
|
+
e.stopPropagation();
|
|
5550
|
+
if (onScroll) onScroll({
|
|
5551
|
+
deltaX: e.deltaX,
|
|
5552
|
+
deltaY: e.deltaY
|
|
5553
|
+
});
|
|
5554
|
+
}, [
|
|
5555
|
+
onScroll
|
|
5556
|
+
]);
|
|
5557
|
+
($e9faafb641e167db$export$90fc3a17d93f704c)(ref, 'wheel', isDisabled ? undefined : onScrollHandler);
|
|
5558
|
+
}
|
|
5559
|
+
|
|
5059
5560
|
/*
|
|
5060
5561
|
* Copyright 2020 Adobe. All rights reserved.
|
|
5061
5562
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -6635,7 +7136,7 @@ function $5c3e21d68f1c4674$export$439d29a4e110a164(props) {
|
|
|
6635
7136
|
return /*#__PURE__*/ ($dbSRa$react).createElement(Element, ($3ef42575df84b30b$export$9d1611c77c2fe928)(otherProps, visuallyHiddenProps), children);
|
|
6636
7137
|
}
|
|
6637
7138
|
|
|
6638
|
-
function $parcel$interopDefault$
|
|
7139
|
+
function $parcel$interopDefault$7(a) {
|
|
6639
7140
|
return a && a.__esModule ? a.default : a;
|
|
6640
7141
|
}
|
|
6641
7142
|
/*
|
|
@@ -6655,7 +7156,7 @@ function $parcel$interopDefault$5(a) {
|
|
|
6655
7156
|
|
|
6656
7157
|
function $86ea4cb521eb2e37$export$2317d149ed6f78c4(props) {
|
|
6657
7158
|
let { onDismiss: onDismiss, ...otherProps } = props;
|
|
6658
|
-
let stringFormatter = ($fca6afa0e843324b$export$f12b703ca79dfbb1)((($parcel$interopDefault$
|
|
7159
|
+
let stringFormatter = ($fca6afa0e843324b$export$f12b703ca79dfbb1)((($parcel$interopDefault$7($a2f21f5f14f60553$exports))), '@react-aria/overlays');
|
|
6659
7160
|
let labels = ($313b98861ee5dd6c$export$d6875122194c7b44)(otherProps, stringFormatter.format('dismiss'));
|
|
6660
7161
|
let onClick = ()=>{
|
|
6661
7162
|
if (onDismiss) onDismiss();
|
|
@@ -9053,7 +9554,7 @@ $2cbb7ca666678a14$exports = {
|
|
|
9053
9554
|
"zh-TW": $f1b682a4c8c5631c$exports
|
|
9054
9555
|
};
|
|
9055
9556
|
|
|
9056
|
-
function $parcel$interopDefault$
|
|
9557
|
+
function $parcel$interopDefault$6(a) {
|
|
9057
9558
|
return a && a.__esModule ? a.default : a;
|
|
9058
9559
|
}
|
|
9059
9560
|
/*
|
|
@@ -9105,7 +9606,7 @@ function $168583247155ddda$export$dc9c12ed27dd1b49(props, state, ref) {
|
|
|
9105
9606
|
if ('continuePropagation' in e) e.continuePropagation();
|
|
9106
9607
|
}
|
|
9107
9608
|
};
|
|
9108
|
-
let stringFormatter = ($fca6afa0e843324b$export$f12b703ca79dfbb1)((($parcel$interopDefault$
|
|
9609
|
+
let stringFormatter = ($fca6afa0e843324b$export$f12b703ca79dfbb1)((($parcel$interopDefault$6($2cbb7ca666678a14$exports))), '@react-aria/menu');
|
|
9109
9610
|
let { longPressProps: longPressProps } = ($8a26561d2877236e$export$c24ed0104d07eab9)({
|
|
9110
9611
|
isDisabled: isDisabled || trigger !== 'longPress',
|
|
9111
9612
|
accessibilityDescription: stringFormatter.format('longPressMessage'),
|
|
@@ -9362,6 +9863,129 @@ function $2d73ec29415bd339$export$712718f7aec83d5(props, ref) {
|
|
|
9362
9863
|
};
|
|
9363
9864
|
}
|
|
9364
9865
|
|
|
9866
|
+
/*
|
|
9867
|
+
* Copyright 2021 Adobe. All rights reserved.
|
|
9868
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
9869
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
9870
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
9871
|
+
*
|
|
9872
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
9873
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
9874
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
9875
|
+
* governing permissions and limitations under the License.
|
|
9876
|
+
*/
|
|
9877
|
+
|
|
9878
|
+
|
|
9879
|
+
function $d841c8010a73d545$var$supportsNativeBeforeInputEvent() {
|
|
9880
|
+
return typeof window !== 'undefined' && window.InputEvent && typeof InputEvent.prototype.getTargetRanges === 'function';
|
|
9881
|
+
}
|
|
9882
|
+
function $d841c8010a73d545$export$4f384c9210e583c3(props, state, inputRef) {
|
|
9883
|
+
// All browsers implement the 'beforeinput' event natively except Firefox
|
|
9884
|
+
// (currently behind a flag as of Firefox 84). React's polyfill does not
|
|
9885
|
+
// run in all cases that the native event fires, e.g. when deleting text.
|
|
9886
|
+
// Use the native event if available so that we can prevent invalid deletions.
|
|
9887
|
+
// We do not attempt to polyfill this in Firefox since it would be very complicated,
|
|
9888
|
+
// the benefit of doing so is fairly minor, and it's going to be natively supported soon.
|
|
9889
|
+
let onBeforeInputFallback = ($8ae05eaa5c114e9c$export$7f54fc3180508a52)((e)=>{
|
|
9890
|
+
let input = inputRef.current;
|
|
9891
|
+
if (!input) return;
|
|
9892
|
+
// Compute the next value of the input if the event is allowed to proceed.
|
|
9893
|
+
// See https://www.w3.org/TR/input-events-2/#interface-InputEvent-Attributes for a full list of input types.
|
|
9894
|
+
let nextValue = null;
|
|
9895
|
+
switch(e.inputType){
|
|
9896
|
+
case 'historyUndo':
|
|
9897
|
+
case 'historyRedo':
|
|
9898
|
+
// Explicitly allow undo/redo. e.data is null in this case, but there's no need to validate,
|
|
9899
|
+
// because presumably the input would have already been validated previously.
|
|
9900
|
+
return;
|
|
9901
|
+
case 'insertLineBreak':
|
|
9902
|
+
// Explicitly allow "insertLineBreak" event, to allow onSubmit for "enter" key. e.data is null in this case.
|
|
9903
|
+
return;
|
|
9904
|
+
case 'deleteContent':
|
|
9905
|
+
case 'deleteByCut':
|
|
9906
|
+
case 'deleteByDrag':
|
|
9907
|
+
nextValue = input.value.slice(0, input.selectionStart) + input.value.slice(input.selectionEnd);
|
|
9908
|
+
break;
|
|
9909
|
+
case 'deleteContentForward':
|
|
9910
|
+
// This is potentially incorrect, since the browser may actually delete more than a single UTF-16
|
|
9911
|
+
// character. In reality, a full Unicode grapheme cluster consisting of multiple UTF-16 characters
|
|
9912
|
+
// or code points may be deleted. However, in our currently supported locales, there are no such cases.
|
|
9913
|
+
// If we support additional locales in the future, this may need to change.
|
|
9914
|
+
nextValue = input.selectionEnd === input.selectionStart ? input.value.slice(0, input.selectionStart) + input.value.slice(input.selectionEnd + 1) : input.value.slice(0, input.selectionStart) + input.value.slice(input.selectionEnd);
|
|
9915
|
+
break;
|
|
9916
|
+
case 'deleteContentBackward':
|
|
9917
|
+
nextValue = input.selectionEnd === input.selectionStart ? input.value.slice(0, input.selectionStart - 1) + input.value.slice(input.selectionStart) : input.value.slice(0, input.selectionStart) + input.value.slice(input.selectionEnd);
|
|
9918
|
+
break;
|
|
9919
|
+
case 'deleteSoftLineBackward':
|
|
9920
|
+
case 'deleteHardLineBackward':
|
|
9921
|
+
nextValue = input.value.slice(input.selectionStart);
|
|
9922
|
+
break;
|
|
9923
|
+
default:
|
|
9924
|
+
if (e.data != null) nextValue = input.value.slice(0, input.selectionStart) + e.data + input.value.slice(input.selectionEnd);
|
|
9925
|
+
break;
|
|
9926
|
+
}
|
|
9927
|
+
// If we did not compute a value, or the new value is invalid, prevent the event
|
|
9928
|
+
// so that the browser does not update the input text, move the selection, or add to
|
|
9929
|
+
// the undo/redo stack.
|
|
9930
|
+
if (nextValue == null || !state.validate(nextValue)) e.preventDefault();
|
|
9931
|
+
});
|
|
9932
|
+
(useEffect)(()=>{
|
|
9933
|
+
if (!$d841c8010a73d545$var$supportsNativeBeforeInputEvent() || !inputRef.current) return;
|
|
9934
|
+
let input = inputRef.current;
|
|
9935
|
+
input.addEventListener('beforeinput', onBeforeInputFallback, false);
|
|
9936
|
+
return ()=>{
|
|
9937
|
+
input.removeEventListener('beforeinput', onBeforeInputFallback, false);
|
|
9938
|
+
};
|
|
9939
|
+
}, [
|
|
9940
|
+
inputRef
|
|
9941
|
+
]);
|
|
9942
|
+
let onBeforeInput = !$d841c8010a73d545$var$supportsNativeBeforeInputEvent() ? (e)=>{
|
|
9943
|
+
let nextValue = e.target.value.slice(0, e.target.selectionStart) + e.data + e.target.value.slice(e.target.selectionEnd);
|
|
9944
|
+
if (!state.validate(nextValue)) e.preventDefault();
|
|
9945
|
+
} : null;
|
|
9946
|
+
let { labelProps: labelProps, inputProps: textFieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, ...validation } = ($2d73ec29415bd339$export$712718f7aec83d5)(props, inputRef);
|
|
9947
|
+
let compositionStartState = (useRef)(null);
|
|
9948
|
+
return {
|
|
9949
|
+
inputProps: ($3ef42575df84b30b$export$9d1611c77c2fe928)(textFieldProps, {
|
|
9950
|
+
onBeforeInput: onBeforeInput,
|
|
9951
|
+
onCompositionStart () {
|
|
9952
|
+
// Chrome does not implement Input Events Level 2, which specifies the insertFromComposition
|
|
9953
|
+
// and deleteByComposition inputType values for the beforeinput event. These are meant to occur
|
|
9954
|
+
// at the end of a composition (e.g. Pinyin IME, Android auto correct, etc.), and crucially, are
|
|
9955
|
+
// cancelable. The insertCompositionText and deleteCompositionText input types are not cancelable,
|
|
9956
|
+
// nor would we want to cancel them because the input from the user is incomplete at that point.
|
|
9957
|
+
// In Safari, insertFromComposition/deleteFromComposition will fire, however, allowing us to cancel
|
|
9958
|
+
// the final composition result if it is invalid. As a fallback for Chrome and Firefox, which either
|
|
9959
|
+
// don't support Input Events Level 2, or beforeinput at all, we store the state of the input when
|
|
9960
|
+
// the compositionstart event fires, and undo the changes in compositionend (below) if it is invalid.
|
|
9961
|
+
// Unfortunately, this messes up the undo/redo stack, but until insertFromComposition/deleteByComposition
|
|
9962
|
+
// are implemented, there is no other way to prevent composed input.
|
|
9963
|
+
// See https://bugs.chromium.org/p/chromium/issues/detail?id=1022204
|
|
9964
|
+
let { value: value, selectionStart: selectionStart, selectionEnd: selectionEnd } = inputRef.current;
|
|
9965
|
+
compositionStartState.current = {
|
|
9966
|
+
value: value,
|
|
9967
|
+
selectionStart: selectionStart,
|
|
9968
|
+
selectionEnd: selectionEnd
|
|
9969
|
+
};
|
|
9970
|
+
},
|
|
9971
|
+
onCompositionEnd () {
|
|
9972
|
+
if (inputRef.current && !state.validate(inputRef.current.value)) {
|
|
9973
|
+
// Restore the input value in the DOM immediately so we can synchronously update the selection position.
|
|
9974
|
+
// But also update the value in React state as well so it is correct for future updates.
|
|
9975
|
+
let { value: value, selectionStart: selectionStart, selectionEnd: selectionEnd } = compositionStartState.current;
|
|
9976
|
+
inputRef.current.value = value;
|
|
9977
|
+
inputRef.current.setSelectionRange(selectionStart, selectionEnd);
|
|
9978
|
+
state.setInputValue(value);
|
|
9979
|
+
}
|
|
9980
|
+
}
|
|
9981
|
+
}),
|
|
9982
|
+
labelProps: labelProps,
|
|
9983
|
+
descriptionProps: descriptionProps,
|
|
9984
|
+
errorMessageProps: errorMessageProps,
|
|
9985
|
+
...validation
|
|
9986
|
+
};
|
|
9987
|
+
}
|
|
9988
|
+
|
|
9365
9989
|
/*
|
|
9366
9990
|
* Copyright 2024 Adobe. All rights reserved.
|
|
9367
9991
|
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
@@ -11033,70 +11657,1279 @@ function $fba3e38d5ca8983f$export$353b32fc6898d37d(props, state, inputRef) {
|
|
|
11033
11657
|
|
|
11034
11658
|
|
|
11035
11659
|
|
|
11036
|
-
function $
|
|
11037
|
-
let {
|
|
11038
|
-
|
|
11039
|
-
|
|
11040
|
-
|
|
11041
|
-
|
|
11042
|
-
|
|
11043
|
-
|
|
11044
|
-
|
|
11045
|
-
|
|
11046
|
-
|
|
11047
|
-
|
|
11048
|
-
|
|
11049
|
-
|
|
11050
|
-
|
|
11051
|
-
|
|
11052
|
-
|
|
11053
|
-
|
|
11054
|
-
|
|
11055
|
-
|
|
11056
|
-
|
|
11057
|
-
|
|
11058
|
-
|
|
11059
|
-
|
|
11060
|
-
|
|
11061
|
-
|
|
11660
|
+
function $de67e98908f0c6ee$export$7f629e9dc1ecf37c(props) {
|
|
11661
|
+
let { minValue: minValue, maxValue: maxValue, step: step, formatOptions: formatOptions, value: value, defaultValue: defaultValue = NaN, onChange: onChange, locale: locale, isDisabled: isDisabled, isReadOnly: isReadOnly } = props;
|
|
11662
|
+
if (value === null) value = NaN;
|
|
11663
|
+
if (value !== undefined && !isNaN(value)) {
|
|
11664
|
+
if (step !== undefined && !isNaN(step)) value = ($9446cca9a3875146$export$cb6e0bb50bc19463)(value, minValue, maxValue, step);
|
|
11665
|
+
else value = ($9446cca9a3875146$export$7d15b64cf5a3a4c4)(value, minValue, maxValue);
|
|
11666
|
+
}
|
|
11667
|
+
if (!isNaN(defaultValue)) {
|
|
11668
|
+
if (step !== undefined && !isNaN(step)) defaultValue = ($9446cca9a3875146$export$cb6e0bb50bc19463)(defaultValue, minValue, maxValue, step);
|
|
11669
|
+
else defaultValue = ($9446cca9a3875146$export$7d15b64cf5a3a4c4)(defaultValue, minValue, maxValue);
|
|
11670
|
+
}
|
|
11671
|
+
let [numberValue, setNumberValue] = ($458b0a5536c1a7cf$export$40bfa8c7b0832715)(value, isNaN(defaultValue) ? NaN : defaultValue, onChange);
|
|
11672
|
+
let [initialValue] = (useState)(numberValue);
|
|
11673
|
+
let [inputValue, setInputValue] = (useState)(()=>isNaN(numberValue) ? '' : new ($488c6ddbf4ef74c2$export$cc77c4ff7e8673c5)(locale, formatOptions).format(numberValue));
|
|
11674
|
+
let numberParser = (useMemo)(()=>new ($6c7bd7858deea686$export$cd11ab140839f11d)(locale, formatOptions), [
|
|
11675
|
+
locale,
|
|
11676
|
+
formatOptions
|
|
11677
|
+
]);
|
|
11678
|
+
let numberingSystem = (useMemo)(()=>numberParser.getNumberingSystem(inputValue), [
|
|
11679
|
+
numberParser,
|
|
11680
|
+
inputValue
|
|
11681
|
+
]);
|
|
11682
|
+
let formatter = (useMemo)(()=>new ($488c6ddbf4ef74c2$export$cc77c4ff7e8673c5)(locale, {
|
|
11683
|
+
...formatOptions,
|
|
11684
|
+
numberingSystem: numberingSystem
|
|
11685
|
+
}), [
|
|
11686
|
+
locale,
|
|
11687
|
+
formatOptions,
|
|
11688
|
+
numberingSystem
|
|
11689
|
+
]);
|
|
11690
|
+
let intlOptions = (useMemo)(()=>formatter.resolvedOptions(), [
|
|
11691
|
+
formatter
|
|
11692
|
+
]);
|
|
11693
|
+
let format = (useCallback)((value)=>isNaN(value) || value === null ? '' : formatter.format(value), [
|
|
11694
|
+
formatter
|
|
11695
|
+
]);
|
|
11696
|
+
let validation = ($e5be200c675c3b3a$export$fc1a364ae1f3ff10)({
|
|
11697
|
+
...props,
|
|
11698
|
+
value: numberValue
|
|
11699
|
+
});
|
|
11700
|
+
let clampStep = step !== undefined && !isNaN(step) ? step : 1;
|
|
11701
|
+
if (intlOptions.style === 'percent' && (step === undefined || isNaN(step))) clampStep = 0.01;
|
|
11702
|
+
// Update the input value when the number value or format options change. This is done
|
|
11703
|
+
// in a useEffect so that the controlled behavior is correct and we only update the
|
|
11704
|
+
// textfield after prop changes.
|
|
11705
|
+
let [prevValue, setPrevValue] = (useState)(numberValue);
|
|
11706
|
+
let [prevLocale, setPrevLocale] = (useState)(locale);
|
|
11707
|
+
let [prevFormatOptions, setPrevFormatOptions] = (useState)(formatOptions);
|
|
11708
|
+
if (!Object.is(numberValue, prevValue) || locale !== prevLocale || formatOptions !== prevFormatOptions) {
|
|
11709
|
+
setInputValue(format(numberValue));
|
|
11710
|
+
setPrevValue(numberValue);
|
|
11711
|
+
setPrevLocale(locale);
|
|
11712
|
+
setPrevFormatOptions(formatOptions);
|
|
11713
|
+
}
|
|
11714
|
+
let parsedValue = (useMemo)(()=>numberParser.parse(inputValue), [
|
|
11715
|
+
numberParser,
|
|
11716
|
+
inputValue
|
|
11717
|
+
]);
|
|
11718
|
+
let commit = ()=>{
|
|
11719
|
+
// Set to empty state if input value is empty
|
|
11720
|
+
if (!inputValue.length) {
|
|
11721
|
+
setNumberValue(NaN);
|
|
11722
|
+
setInputValue(value === undefined ? '' : format(numberValue));
|
|
11723
|
+
return;
|
|
11062
11724
|
}
|
|
11063
|
-
|
|
11064
|
-
|
|
11725
|
+
// if it failed to parse, then reset input to formatted version of current number
|
|
11726
|
+
if (isNaN(parsedValue)) {
|
|
11727
|
+
setInputValue(format(numberValue));
|
|
11728
|
+
return;
|
|
11729
|
+
}
|
|
11730
|
+
// Clamp to min and max, round to the nearest step, and round to specified number of digits
|
|
11731
|
+
let clampedValue;
|
|
11732
|
+
if (step === undefined || isNaN(step)) clampedValue = ($9446cca9a3875146$export$7d15b64cf5a3a4c4)(parsedValue, minValue, maxValue);
|
|
11733
|
+
else clampedValue = ($9446cca9a3875146$export$cb6e0bb50bc19463)(parsedValue, minValue, maxValue, step);
|
|
11734
|
+
clampedValue = numberParser.parse(format(clampedValue));
|
|
11735
|
+
setNumberValue(clampedValue);
|
|
11736
|
+
// in a controlled state, the numberValue won't change, so we won't go back to our old input without help
|
|
11737
|
+
setInputValue(format(value === undefined ? clampedValue : numberValue));
|
|
11738
|
+
validation.commitValidation();
|
|
11739
|
+
};
|
|
11740
|
+
let safeNextStep = (operation, minMax = 0)=>{
|
|
11741
|
+
let prev = parsedValue;
|
|
11742
|
+
if (isNaN(prev)) {
|
|
11743
|
+
// if the input is empty, start from the min/max value when incrementing/decrementing,
|
|
11744
|
+
// or zero if there is no min/max value defined.
|
|
11745
|
+
let newValue = isNaN(minMax) ? 0 : minMax;
|
|
11746
|
+
return ($9446cca9a3875146$export$cb6e0bb50bc19463)(newValue, minValue, maxValue, clampStep);
|
|
11747
|
+
} else {
|
|
11748
|
+
// otherwise, first snap the current value to the nearest step. if it moves in the direction
|
|
11749
|
+
// we're going, use that value, otherwise add the step and snap that value.
|
|
11750
|
+
let newValue = ($9446cca9a3875146$export$cb6e0bb50bc19463)(prev, minValue, maxValue, clampStep);
|
|
11751
|
+
if (operation === '+' && newValue > prev || operation === '-' && newValue < prev) return newValue;
|
|
11752
|
+
return ($9446cca9a3875146$export$cb6e0bb50bc19463)($de67e98908f0c6ee$var$handleDecimalOperation(operation, prev, clampStep), minValue, maxValue, clampStep);
|
|
11753
|
+
}
|
|
11754
|
+
};
|
|
11755
|
+
let increment = ()=>{
|
|
11756
|
+
let newValue = safeNextStep('+', minValue);
|
|
11757
|
+
// if we've arrived at the same value that was previously in the state, the
|
|
11758
|
+
// input value should be updated to match
|
|
11759
|
+
// ex type 4, press increment, highlight the number in the input, type 4 again, press increment
|
|
11760
|
+
// you'd be at 5, then incrementing to 5 again, so no re-render would happen and 4 would be left in the input
|
|
11761
|
+
if (newValue === numberValue) setInputValue(format(newValue));
|
|
11762
|
+
setNumberValue(newValue);
|
|
11763
|
+
validation.commitValidation();
|
|
11764
|
+
};
|
|
11765
|
+
let decrement = ()=>{
|
|
11766
|
+
let newValue = safeNextStep('-', maxValue);
|
|
11767
|
+
if (newValue === numberValue) setInputValue(format(newValue));
|
|
11768
|
+
setNumberValue(newValue);
|
|
11769
|
+
validation.commitValidation();
|
|
11770
|
+
};
|
|
11771
|
+
let incrementToMax = ()=>{
|
|
11772
|
+
if (maxValue != null) {
|
|
11773
|
+
setNumberValue(($9446cca9a3875146$export$cb6e0bb50bc19463)(maxValue, minValue, maxValue, clampStep));
|
|
11774
|
+
validation.commitValidation();
|
|
11775
|
+
}
|
|
11776
|
+
};
|
|
11777
|
+
let decrementToMin = ()=>{
|
|
11778
|
+
if (minValue != null) {
|
|
11779
|
+
setNumberValue(minValue);
|
|
11780
|
+
validation.commitValidation();
|
|
11781
|
+
}
|
|
11782
|
+
};
|
|
11783
|
+
let canIncrement = (useMemo)(()=>!isDisabled && !isReadOnly && (isNaN(parsedValue) || maxValue === undefined || isNaN(maxValue) || ($9446cca9a3875146$export$cb6e0bb50bc19463)(parsedValue, minValue, maxValue, clampStep) > parsedValue || $de67e98908f0c6ee$var$handleDecimalOperation('+', parsedValue, clampStep) <= maxValue), [
|
|
11784
|
+
isDisabled,
|
|
11785
|
+
isReadOnly,
|
|
11786
|
+
minValue,
|
|
11787
|
+
maxValue,
|
|
11788
|
+
clampStep,
|
|
11789
|
+
parsedValue
|
|
11065
11790
|
]);
|
|
11066
|
-
($
|
|
11067
|
-
|
|
11068
|
-
|
|
11069
|
-
|
|
11070
|
-
|
|
11071
|
-
|
|
11791
|
+
let canDecrement = (useMemo)(()=>!isDisabled && !isReadOnly && (isNaN(parsedValue) || minValue === undefined || isNaN(minValue) || ($9446cca9a3875146$export$cb6e0bb50bc19463)(parsedValue, minValue, maxValue, clampStep) < parsedValue || $de67e98908f0c6ee$var$handleDecimalOperation('-', parsedValue, clampStep) >= minValue), [
|
|
11792
|
+
isDisabled,
|
|
11793
|
+
isReadOnly,
|
|
11794
|
+
minValue,
|
|
11795
|
+
maxValue,
|
|
11796
|
+
clampStep,
|
|
11797
|
+
parsedValue
|
|
11798
|
+
]);
|
|
11799
|
+
let validate = (value)=>numberParser.isValidPartialNumber(value, minValue, maxValue);
|
|
11072
11800
|
return {
|
|
11073
|
-
|
|
11074
|
-
|
|
11075
|
-
|
|
11076
|
-
|
|
11077
|
-
|
|
11078
|
-
|
|
11079
|
-
|
|
11080
|
-
|
|
11081
|
-
|
|
11082
|
-
|
|
11083
|
-
|
|
11084
|
-
|
|
11085
|
-
|
|
11086
|
-
|
|
11087
|
-
|
|
11088
|
-
|
|
11089
|
-
}
|
|
11801
|
+
...validation,
|
|
11802
|
+
validate: validate,
|
|
11803
|
+
increment: increment,
|
|
11804
|
+
incrementToMax: incrementToMax,
|
|
11805
|
+
decrement: decrement,
|
|
11806
|
+
decrementToMin: decrementToMin,
|
|
11807
|
+
canIncrement: canIncrement,
|
|
11808
|
+
canDecrement: canDecrement,
|
|
11809
|
+
minValue: minValue,
|
|
11810
|
+
maxValue: maxValue,
|
|
11811
|
+
numberValue: parsedValue,
|
|
11812
|
+
defaultNumberValue: isNaN(defaultValue) ? initialValue : defaultValue,
|
|
11813
|
+
setNumberValue: setNumberValue,
|
|
11814
|
+
setInputValue: setInputValue,
|
|
11815
|
+
inputValue: inputValue,
|
|
11816
|
+
commit: commit
|
|
11090
11817
|
};
|
|
11091
11818
|
}
|
|
11819
|
+
function $de67e98908f0c6ee$var$handleDecimalOperation(operator, value1, value2) {
|
|
11820
|
+
let result = operator === '+' ? value1 + value2 : value1 - value2;
|
|
11821
|
+
// Check if we have decimals
|
|
11822
|
+
if (value1 % 1 !== 0 || value2 % 1 !== 0) {
|
|
11823
|
+
const value1Decimal = value1.toString().split('.');
|
|
11824
|
+
const value2Decimal = value2.toString().split('.');
|
|
11825
|
+
const value1DecimalLength = value1Decimal[1] && value1Decimal[1].length || 0;
|
|
11826
|
+
const value2DecimalLength = value2Decimal[1] && value2Decimal[1].length || 0;
|
|
11827
|
+
const multiplier = Math.pow(10, Math.max(value1DecimalLength, value2DecimalLength));
|
|
11828
|
+
// Transform the decimals to integers based on the precision
|
|
11829
|
+
value1 = Math.round(value1 * multiplier);
|
|
11830
|
+
value2 = Math.round(value2 * multiplier);
|
|
11831
|
+
// Perform the operation on integers values to make sure we don't get a fancy decimal value
|
|
11832
|
+
result = operator === '+' ? value1 + value2 : value1 - value2;
|
|
11833
|
+
// Transform the integer result back to decimal
|
|
11834
|
+
result /= multiplier;
|
|
11835
|
+
}
|
|
11836
|
+
return result;
|
|
11837
|
+
}
|
|
11092
11838
|
|
|
11093
|
-
|
|
11094
|
-
|
|
11095
|
-
|
|
11096
|
-
|
|
11097
|
-
|
|
11098
|
-
|
|
11099
|
-
|
|
11839
|
+
var $ed6aae4e5f766f1e$exports = {};
|
|
11840
|
+
$ed6aae4e5f766f1e$exports = {
|
|
11841
|
+
"Empty": `\u{641}\u{627}\u{631}\u{63A}`
|
|
11842
|
+
};
|
|
11843
|
+
|
|
11844
|
+
var $38854e2b175151fa$exports = {};
|
|
11845
|
+
$38854e2b175151fa$exports = {
|
|
11846
|
+
"Empty": `\u{418}\u{437}\u{43F}\u{440}\u{430}\u{437}\u{43D}\u{438}`
|
|
11847
|
+
};
|
|
11848
|
+
|
|
11849
|
+
var $15b25ab20f3945b2$exports = {};
|
|
11850
|
+
$15b25ab20f3945b2$exports = {
|
|
11851
|
+
"Empty": `Pr\xe1zdn\xe9`
|
|
11852
|
+
};
|
|
11853
|
+
|
|
11854
|
+
var $692a4298b6b649a2$exports = {};
|
|
11855
|
+
$692a4298b6b649a2$exports = {
|
|
11856
|
+
"Empty": `Tom`
|
|
11857
|
+
};
|
|
11858
|
+
|
|
11859
|
+
var $1c6e1539193f1243$exports = {};
|
|
11860
|
+
$1c6e1539193f1243$exports = {
|
|
11861
|
+
"Empty": `Leer`
|
|
11862
|
+
};
|
|
11863
|
+
|
|
11864
|
+
var $1e8678632c464b6d$exports = {};
|
|
11865
|
+
$1e8678632c464b6d$exports = {
|
|
11866
|
+
"Empty": `\u{386}\u{3B4}\u{3B5}\u{3B9}\u{3BF}`
|
|
11867
|
+
};
|
|
11868
|
+
|
|
11869
|
+
var $4adc85d9bf5b9eed$exports = {};
|
|
11870
|
+
$4adc85d9bf5b9eed$exports = {
|
|
11871
|
+
"Empty": `Empty`
|
|
11872
|
+
};
|
|
11873
|
+
|
|
11874
|
+
var $41c4b2bb61dafbca$exports = {};
|
|
11875
|
+
$41c4b2bb61dafbca$exports = {
|
|
11876
|
+
"Empty": `Vac\xedo`
|
|
11877
|
+
};
|
|
11878
|
+
|
|
11879
|
+
var $405f8b24f5dd2a60$exports = {};
|
|
11880
|
+
$405f8b24f5dd2a60$exports = {
|
|
11881
|
+
"Empty": `T\xfchjenda`
|
|
11882
|
+
};
|
|
11883
|
+
|
|
11884
|
+
var $7efe3ed02b9b9dd4$exports = {};
|
|
11885
|
+
$7efe3ed02b9b9dd4$exports = {
|
|
11886
|
+
"Empty": `Tyhj\xe4`
|
|
11887
|
+
};
|
|
11888
|
+
|
|
11889
|
+
var $99fc4c101d92daf3$exports = {};
|
|
11890
|
+
$99fc4c101d92daf3$exports = {
|
|
11891
|
+
"Empty": `Vide`
|
|
11892
|
+
};
|
|
11893
|
+
|
|
11894
|
+
var $f9e155e6e8cacaa2$exports = {};
|
|
11895
|
+
$f9e155e6e8cacaa2$exports = {
|
|
11896
|
+
"Empty": `\u{5E8}\u{5D9}\u{5E7}`
|
|
11897
|
+
};
|
|
11898
|
+
|
|
11899
|
+
var $c31b5e8e9a249fd5$exports = {};
|
|
11900
|
+
$c31b5e8e9a249fd5$exports = {
|
|
11901
|
+
"Empty": `Prazno`
|
|
11902
|
+
};
|
|
11903
|
+
|
|
11904
|
+
var $9c5435bc17499bd9$exports = {};
|
|
11905
|
+
$9c5435bc17499bd9$exports = {
|
|
11906
|
+
"Empty": `\xdcres`
|
|
11907
|
+
};
|
|
11908
|
+
|
|
11909
|
+
var $6d1fc8e84d8165e1$exports = {};
|
|
11910
|
+
$6d1fc8e84d8165e1$exports = {
|
|
11911
|
+
"Empty": `Vuoto`
|
|
11912
|
+
};
|
|
11913
|
+
|
|
11914
|
+
var $46ea6b3641b83e71$exports = {};
|
|
11915
|
+
$46ea6b3641b83e71$exports = {
|
|
11916
|
+
"Empty": `\u{7A7A}`
|
|
11917
|
+
};
|
|
11918
|
+
|
|
11919
|
+
var $0e3cc9a288289dc5$exports = {};
|
|
11920
|
+
$0e3cc9a288289dc5$exports = {
|
|
11921
|
+
"Empty": `\u{BE44}\u{C5B4} \u{C788}\u{C74C}`
|
|
11922
|
+
};
|
|
11923
|
+
|
|
11924
|
+
var $4ff2bb25c0089ffb$exports = {};
|
|
11925
|
+
$4ff2bb25c0089ffb$exports = {
|
|
11926
|
+
"Empty": `Tu\u{161}\u{10D}ias`
|
|
11927
|
+
};
|
|
11928
|
+
|
|
11929
|
+
var $6cf33cd4c010a2fb$exports = {};
|
|
11930
|
+
$6cf33cd4c010a2fb$exports = {
|
|
11931
|
+
"Empty": `Tuk\u{161}s`
|
|
11932
|
+
};
|
|
11933
|
+
|
|
11934
|
+
var $5a9f8486f8b8837e$exports = {};
|
|
11935
|
+
$5a9f8486f8b8837e$exports = {
|
|
11936
|
+
"Empty": `Tom`
|
|
11937
|
+
};
|
|
11938
|
+
|
|
11939
|
+
var $583f94d807f6ecea$exports = {};
|
|
11940
|
+
$583f94d807f6ecea$exports = {
|
|
11941
|
+
"Empty": `Leeg`
|
|
11942
|
+
};
|
|
11943
|
+
|
|
11944
|
+
var $cc4dcfeea2b4050d$exports = {};
|
|
11945
|
+
$cc4dcfeea2b4050d$exports = {
|
|
11946
|
+
"Empty": `Pusty`
|
|
11947
|
+
};
|
|
11948
|
+
|
|
11949
|
+
var $68ac2954d56e12b4$exports = {};
|
|
11950
|
+
$68ac2954d56e12b4$exports = {
|
|
11951
|
+
"Empty": `Vazio`
|
|
11952
|
+
};
|
|
11953
|
+
|
|
11954
|
+
var $fdb0616f309780b0$exports = {};
|
|
11955
|
+
$fdb0616f309780b0$exports = {
|
|
11956
|
+
"Empty": `Vazio`
|
|
11957
|
+
};
|
|
11958
|
+
|
|
11959
|
+
var $fe1eccf4ee1d6f52$exports = {};
|
|
11960
|
+
$fe1eccf4ee1d6f52$exports = {
|
|
11961
|
+
"Empty": `Gol`
|
|
11962
|
+
};
|
|
11963
|
+
|
|
11964
|
+
var $a38b6c4e18725976$exports = {};
|
|
11965
|
+
$a38b6c4e18725976$exports = {
|
|
11966
|
+
"Empty": `\u{41D}\u{435} \u{437}\u{430}\u{43F}\u{43E}\u{43B}\u{43D}\u{435}\u{43D}\u{43E}`
|
|
11967
|
+
};
|
|
11968
|
+
|
|
11969
|
+
var $6c14ae2b766b652c$exports = {};
|
|
11970
|
+
$6c14ae2b766b652c$exports = {
|
|
11971
|
+
"Empty": `Pr\xe1zdne`
|
|
11972
|
+
};
|
|
11973
|
+
|
|
11974
|
+
var $8f1c9692e16dc5eb$exports = {};
|
|
11975
|
+
$8f1c9692e16dc5eb$exports = {
|
|
11976
|
+
"Empty": `Prazen`
|
|
11977
|
+
};
|
|
11978
|
+
|
|
11979
|
+
var $d2aa7abea627cafa$exports = {};
|
|
11980
|
+
$d2aa7abea627cafa$exports = {
|
|
11981
|
+
"Empty": `Prazno`
|
|
11982
|
+
};
|
|
11983
|
+
|
|
11984
|
+
var $676b82e4b56408e6$exports = {};
|
|
11985
|
+
$676b82e4b56408e6$exports = {
|
|
11986
|
+
"Empty": `Tomt`
|
|
11987
|
+
};
|
|
11988
|
+
|
|
11989
|
+
var $14c9042552d7ce08$exports = {};
|
|
11990
|
+
$14c9042552d7ce08$exports = {
|
|
11991
|
+
"Empty": `Bo\u{15F}`
|
|
11992
|
+
};
|
|
11993
|
+
|
|
11994
|
+
var $393254ebcb66c9f5$exports = {};
|
|
11995
|
+
$393254ebcb66c9f5$exports = {
|
|
11996
|
+
"Empty": `\u{41F}\u{443}\u{441}\u{442}\u{43E}`
|
|
11997
|
+
};
|
|
11998
|
+
|
|
11999
|
+
var $d49d621f310cf6ce$exports = {};
|
|
12000
|
+
$d49d621f310cf6ce$exports = {
|
|
12001
|
+
"Empty": `\u{7A7A}`
|
|
12002
|
+
};
|
|
12003
|
+
|
|
12004
|
+
var $94b60c866ca5dfe6$exports = {};
|
|
12005
|
+
$94b60c866ca5dfe6$exports = {
|
|
12006
|
+
"Empty": `\u{7A7A}\u{767D}`
|
|
12007
|
+
};
|
|
12008
|
+
|
|
12009
|
+
var $a99895ee3dc79e61$exports = {};
|
|
12010
|
+
|
|
12011
|
+
|
|
12012
|
+
|
|
12013
|
+
|
|
12014
|
+
|
|
12015
|
+
|
|
12016
|
+
|
|
12017
|
+
|
|
12018
|
+
|
|
12019
|
+
|
|
12020
|
+
|
|
12021
|
+
|
|
12022
|
+
|
|
12023
|
+
|
|
12024
|
+
|
|
12025
|
+
|
|
12026
|
+
|
|
12027
|
+
|
|
12028
|
+
|
|
12029
|
+
|
|
12030
|
+
|
|
12031
|
+
|
|
12032
|
+
|
|
12033
|
+
|
|
12034
|
+
|
|
12035
|
+
|
|
12036
|
+
|
|
12037
|
+
|
|
12038
|
+
|
|
12039
|
+
|
|
12040
|
+
|
|
12041
|
+
|
|
12042
|
+
|
|
12043
|
+
|
|
12044
|
+
$a99895ee3dc79e61$exports = {
|
|
12045
|
+
"ar-AE": $ed6aae4e5f766f1e$exports,
|
|
12046
|
+
"bg-BG": $38854e2b175151fa$exports,
|
|
12047
|
+
"cs-CZ": $15b25ab20f3945b2$exports,
|
|
12048
|
+
"da-DK": $692a4298b6b649a2$exports,
|
|
12049
|
+
"de-DE": $1c6e1539193f1243$exports,
|
|
12050
|
+
"el-GR": $1e8678632c464b6d$exports,
|
|
12051
|
+
"en-US": $4adc85d9bf5b9eed$exports,
|
|
12052
|
+
"es-ES": $41c4b2bb61dafbca$exports,
|
|
12053
|
+
"et-EE": $405f8b24f5dd2a60$exports,
|
|
12054
|
+
"fi-FI": $7efe3ed02b9b9dd4$exports,
|
|
12055
|
+
"fr-FR": $99fc4c101d92daf3$exports,
|
|
12056
|
+
"he-IL": $f9e155e6e8cacaa2$exports,
|
|
12057
|
+
"hr-HR": $c31b5e8e9a249fd5$exports,
|
|
12058
|
+
"hu-HU": $9c5435bc17499bd9$exports,
|
|
12059
|
+
"it-IT": $6d1fc8e84d8165e1$exports,
|
|
12060
|
+
"ja-JP": $46ea6b3641b83e71$exports,
|
|
12061
|
+
"ko-KR": $0e3cc9a288289dc5$exports,
|
|
12062
|
+
"lt-LT": $4ff2bb25c0089ffb$exports,
|
|
12063
|
+
"lv-LV": $6cf33cd4c010a2fb$exports,
|
|
12064
|
+
"nb-NO": $5a9f8486f8b8837e$exports,
|
|
12065
|
+
"nl-NL": $583f94d807f6ecea$exports,
|
|
12066
|
+
"pl-PL": $cc4dcfeea2b4050d$exports,
|
|
12067
|
+
"pt-BR": $68ac2954d56e12b4$exports,
|
|
12068
|
+
"pt-PT": $fdb0616f309780b0$exports,
|
|
12069
|
+
"ro-RO": $fe1eccf4ee1d6f52$exports,
|
|
12070
|
+
"ru-RU": $a38b6c4e18725976$exports,
|
|
12071
|
+
"sk-SK": $6c14ae2b766b652c$exports,
|
|
12072
|
+
"sl-SI": $8f1c9692e16dc5eb$exports,
|
|
12073
|
+
"sr-SP": $d2aa7abea627cafa$exports,
|
|
12074
|
+
"sv-SE": $676b82e4b56408e6$exports,
|
|
12075
|
+
"tr-TR": $14c9042552d7ce08$exports,
|
|
12076
|
+
"uk-UA": $393254ebcb66c9f5$exports,
|
|
12077
|
+
"zh-CN": $d49d621f310cf6ce$exports,
|
|
12078
|
+
"zh-TW": $94b60c866ca5dfe6$exports
|
|
12079
|
+
};
|
|
12080
|
+
|
|
12081
|
+
function $parcel$interopDefault$5(a) {
|
|
12082
|
+
return a && a.__esModule ? a.default : a;
|
|
12083
|
+
}
|
|
12084
|
+
/*
|
|
12085
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
12086
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
12087
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
12088
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
12089
|
+
*
|
|
12090
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
12091
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
12092
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
12093
|
+
* governing permissions and limitations under the License.
|
|
12094
|
+
*/
|
|
12095
|
+
|
|
12096
|
+
|
|
12097
|
+
|
|
12098
|
+
|
|
12099
|
+
function $d2e8511e6f209edf$export$e908e06f4b8e3402(props) {
|
|
12100
|
+
const _async = (useRef)(undefined);
|
|
12101
|
+
let { value: value, textValue: textValue, minValue: minValue, maxValue: maxValue, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, onIncrement: onIncrement, onIncrementPage: onIncrementPage, onDecrement: onDecrement, onDecrementPage: onDecrementPage, onDecrementToMin: onDecrementToMin, onIncrementToMax: onIncrementToMax } = props;
|
|
12102
|
+
const stringFormatter = ($fca6afa0e843324b$export$f12b703ca79dfbb1)((($parcel$interopDefault$5($a99895ee3dc79e61$exports))), '@react-aria/spinbutton');
|
|
12103
|
+
let isSpinning = (useRef)(false);
|
|
12104
|
+
const clearAsync = (useCallback)(()=>{
|
|
12105
|
+
clearTimeout(_async.current);
|
|
12106
|
+
isSpinning.current = false;
|
|
12107
|
+
}, []);
|
|
12108
|
+
const clearAsyncEvent = ($8ae05eaa5c114e9c$export$7f54fc3180508a52)(()=>{
|
|
12109
|
+
clearAsync();
|
|
12110
|
+
});
|
|
12111
|
+
(useEffect)(()=>{
|
|
12112
|
+
return ()=>clearAsyncEvent();
|
|
12113
|
+
}, []);
|
|
12114
|
+
let onKeyDown = (e)=>{
|
|
12115
|
+
if (e.ctrlKey || e.metaKey || e.shiftKey || e.altKey || isReadOnly || e.nativeEvent.isComposing) return;
|
|
12116
|
+
switch(e.key){
|
|
12117
|
+
case 'PageUp':
|
|
12118
|
+
if (onIncrementPage) {
|
|
12119
|
+
e.preventDefault();
|
|
12120
|
+
onIncrementPage === null || onIncrementPage === void 0 ? void 0 : onIncrementPage();
|
|
12121
|
+
break;
|
|
12122
|
+
}
|
|
12123
|
+
// fallthrough!
|
|
12124
|
+
case 'ArrowUp':
|
|
12125
|
+
case 'Up':
|
|
12126
|
+
if (onIncrement) {
|
|
12127
|
+
e.preventDefault();
|
|
12128
|
+
onIncrement === null || onIncrement === void 0 ? void 0 : onIncrement();
|
|
12129
|
+
}
|
|
12130
|
+
break;
|
|
12131
|
+
case 'PageDown':
|
|
12132
|
+
if (onDecrementPage) {
|
|
12133
|
+
e.preventDefault();
|
|
12134
|
+
onDecrementPage === null || onDecrementPage === void 0 ? void 0 : onDecrementPage();
|
|
12135
|
+
break;
|
|
12136
|
+
}
|
|
12137
|
+
// fallthrough
|
|
12138
|
+
case 'ArrowDown':
|
|
12139
|
+
case 'Down':
|
|
12140
|
+
if (onDecrement) {
|
|
12141
|
+
e.preventDefault();
|
|
12142
|
+
onDecrement === null || onDecrement === void 0 ? void 0 : onDecrement();
|
|
12143
|
+
}
|
|
12144
|
+
break;
|
|
12145
|
+
case 'Home':
|
|
12146
|
+
if (onDecrementToMin) {
|
|
12147
|
+
e.preventDefault();
|
|
12148
|
+
onDecrementToMin === null || onDecrementToMin === void 0 ? void 0 : onDecrementToMin();
|
|
12149
|
+
}
|
|
12150
|
+
break;
|
|
12151
|
+
case 'End':
|
|
12152
|
+
if (onIncrementToMax) {
|
|
12153
|
+
e.preventDefault();
|
|
12154
|
+
onIncrementToMax === null || onIncrementToMax === void 0 ? void 0 : onIncrementToMax();
|
|
12155
|
+
}
|
|
12156
|
+
break;
|
|
12157
|
+
}
|
|
12158
|
+
};
|
|
12159
|
+
let isFocused = (useRef)(false);
|
|
12160
|
+
let onFocus = ()=>{
|
|
12161
|
+
isFocused.current = true;
|
|
12162
|
+
};
|
|
12163
|
+
let onBlur = ()=>{
|
|
12164
|
+
isFocused.current = false;
|
|
12165
|
+
};
|
|
12166
|
+
// Replace Unicode hyphen-minus (U+002D) with minus sign (U+2212).
|
|
12167
|
+
// This ensures that macOS VoiceOver announces it as "minus" even with other characters between the minus sign
|
|
12168
|
+
// and the number (e.g. currency symbol). Otherwise it announces nothing because it assumes the character is a hyphen.
|
|
12169
|
+
// In addition, replace the empty string with the word "Empty" so that iOS VoiceOver does not read "50%" for an empty field.
|
|
12170
|
+
let ariaTextValue = textValue === '' ? stringFormatter.format('Empty') : (textValue || `${value}`).replace('-', '\u2212');
|
|
12171
|
+
(useEffect)(()=>{
|
|
12172
|
+
if (isFocused.current) {
|
|
12173
|
+
($319e236875307eab$export$d10ae4f68404609a)('assertive');
|
|
12174
|
+
($319e236875307eab$export$a9b970dcc4ae71a9)(ariaTextValue, 'assertive');
|
|
12175
|
+
}
|
|
12176
|
+
}, [
|
|
12177
|
+
ariaTextValue
|
|
12178
|
+
]);
|
|
12179
|
+
// For touch users, if they move their finger like they're scrolling, we don't want to trigger a spin.
|
|
12180
|
+
let onPointerCancel = (useCallback)(()=>{
|
|
12181
|
+
clearAsync();
|
|
12182
|
+
}, [
|
|
12183
|
+
clearAsync
|
|
12184
|
+
]);
|
|
12185
|
+
const onIncrementPressStart = ($8ae05eaa5c114e9c$export$7f54fc3180508a52)((initialStepDelay)=>{
|
|
12186
|
+
clearAsyncEvent();
|
|
12187
|
+
isSpinning.current = true;
|
|
12188
|
+
onIncrement === null || onIncrement === void 0 ? void 0 : onIncrement();
|
|
12189
|
+
// Start spinning after initial delay
|
|
12190
|
+
_async.current = window.setTimeout(()=>{
|
|
12191
|
+
if (maxValue === undefined || isNaN(maxValue) || value === undefined || isNaN(value) || value < maxValue) onIncrementPressStart(60);
|
|
12192
|
+
}, initialStepDelay);
|
|
12193
|
+
});
|
|
12194
|
+
const onDecrementPressStart = ($8ae05eaa5c114e9c$export$7f54fc3180508a52)((initialStepDelay)=>{
|
|
12195
|
+
clearAsyncEvent();
|
|
12196
|
+
isSpinning.current = true;
|
|
12197
|
+
onDecrement === null || onDecrement === void 0 ? void 0 : onDecrement();
|
|
12198
|
+
// Start spinning after initial delay
|
|
12199
|
+
_async.current = window.setTimeout(()=>{
|
|
12200
|
+
if (minValue === undefined || isNaN(minValue) || value === undefined || isNaN(value) || value > minValue) onDecrementPressStart(60);
|
|
12201
|
+
}, initialStepDelay);
|
|
12202
|
+
});
|
|
12203
|
+
let cancelContextMenu = (e)=>{
|
|
12204
|
+
e.preventDefault();
|
|
12205
|
+
};
|
|
12206
|
+
let { addGlobalListener: addGlobalListener, removeAllGlobalListeners: removeAllGlobalListeners } = ($03deb23ff14920c4$export$4eaf04e54aa8eed6)();
|
|
12207
|
+
// Tracks in touch if the press end event was preceded by a press up.
|
|
12208
|
+
// If it wasn't, then we know the finger left the button while still in contact with the screen.
|
|
12209
|
+
// This means that the user is trying to scroll or interact in some way that shouldn't trigger
|
|
12210
|
+
// an increment or decrement.
|
|
12211
|
+
let isUp = (useRef)(false);
|
|
12212
|
+
let [isIncrementPressed, setIsIncrementPressed] = (useState)(null);
|
|
12213
|
+
(useEffect)(()=>{
|
|
12214
|
+
if (isIncrementPressed === 'touch') onIncrementPressStart(60);
|
|
12215
|
+
else if (isIncrementPressed) onIncrementPressStart(400);
|
|
12216
|
+
}, [
|
|
12217
|
+
isIncrementPressed
|
|
12218
|
+
]);
|
|
12219
|
+
let [isDecrementPressed, setIsDecrementPressed] = (useState)(null);
|
|
12220
|
+
(useEffect)(()=>{
|
|
12221
|
+
if (isDecrementPressed === 'touch') onDecrementPressStart(60);
|
|
12222
|
+
else if (isDecrementPressed) onDecrementPressStart(400);
|
|
12223
|
+
}, [
|
|
12224
|
+
isDecrementPressed
|
|
12225
|
+
]);
|
|
12226
|
+
return {
|
|
12227
|
+
spinButtonProps: {
|
|
12228
|
+
role: 'spinbutton',
|
|
12229
|
+
'aria-valuenow': value !== undefined && !isNaN(value) ? value : undefined,
|
|
12230
|
+
'aria-valuetext': ariaTextValue,
|
|
12231
|
+
'aria-valuemin': minValue,
|
|
12232
|
+
'aria-valuemax': maxValue,
|
|
12233
|
+
'aria-disabled': isDisabled || undefined,
|
|
12234
|
+
'aria-readonly': isReadOnly || undefined,
|
|
12235
|
+
'aria-required': isRequired || undefined,
|
|
12236
|
+
onKeyDown: onKeyDown,
|
|
12237
|
+
onFocus: onFocus,
|
|
12238
|
+
onBlur: onBlur
|
|
12239
|
+
},
|
|
12240
|
+
incrementButtonProps: {
|
|
12241
|
+
onPressStart: (e)=>{
|
|
12242
|
+
if (e.pointerType !== 'touch') setIsIncrementPressed('mouse');
|
|
12243
|
+
else {
|
|
12244
|
+
if (_async.current) clearAsync();
|
|
12245
|
+
addGlobalListener(window, 'pointercancel', onPointerCancel, {
|
|
12246
|
+
capture: true
|
|
12247
|
+
});
|
|
12248
|
+
isUp.current = false;
|
|
12249
|
+
// For touch users, don't trigger a decrement on press start, we'll wait for the press end to trigger it if
|
|
12250
|
+
// the control isn't spinning.
|
|
12251
|
+
_async.current = window.setTimeout(()=>{
|
|
12252
|
+
setIsIncrementPressed('touch');
|
|
12253
|
+
}, 600);
|
|
12254
|
+
}
|
|
12255
|
+
addGlobalListener(window, 'contextmenu', cancelContextMenu);
|
|
12256
|
+
},
|
|
12257
|
+
onPressUp: (e)=>{
|
|
12258
|
+
if (e.pointerType === 'touch') isUp.current = true;
|
|
12259
|
+
clearAsync();
|
|
12260
|
+
removeAllGlobalListeners();
|
|
12261
|
+
setIsIncrementPressed(null);
|
|
12262
|
+
},
|
|
12263
|
+
onPressEnd: (e)=>{
|
|
12264
|
+
if (e.pointerType === 'touch') {
|
|
12265
|
+
if (!isSpinning.current && isUp.current) onIncrement === null || onIncrement === void 0 ? void 0 : onIncrement();
|
|
12266
|
+
}
|
|
12267
|
+
clearAsync();
|
|
12268
|
+
isUp.current = false;
|
|
12269
|
+
setIsIncrementPressed(null);
|
|
12270
|
+
},
|
|
12271
|
+
onFocus: onFocus,
|
|
12272
|
+
onBlur: onBlur
|
|
12273
|
+
},
|
|
12274
|
+
decrementButtonProps: {
|
|
12275
|
+
onPressStart: (e)=>{
|
|
12276
|
+
if (e.pointerType !== 'touch') setIsDecrementPressed('mouse');
|
|
12277
|
+
else {
|
|
12278
|
+
if (_async.current) clearAsync();
|
|
12279
|
+
addGlobalListener(window, 'pointercancel', onPointerCancel, {
|
|
12280
|
+
capture: true
|
|
12281
|
+
});
|
|
12282
|
+
isUp.current = false;
|
|
12283
|
+
// For touch users, don't trigger a decrement on press start, we'll wait for the press end to trigger it if
|
|
12284
|
+
// the control isn't spinning.
|
|
12285
|
+
_async.current = window.setTimeout(()=>{
|
|
12286
|
+
setIsDecrementPressed('touch');
|
|
12287
|
+
}, 600);
|
|
12288
|
+
}
|
|
12289
|
+
},
|
|
12290
|
+
onPressUp: (e)=>{
|
|
12291
|
+
if (e.pointerType === 'touch') isUp.current = true;
|
|
12292
|
+
clearAsync();
|
|
12293
|
+
removeAllGlobalListeners();
|
|
12294
|
+
setIsDecrementPressed(null);
|
|
12295
|
+
},
|
|
12296
|
+
onPressEnd: (e)=>{
|
|
12297
|
+
if (e.pointerType === 'touch') {
|
|
12298
|
+
if (!isSpinning.current && isUp.current) onDecrement === null || onDecrement === void 0 ? void 0 : onDecrement();
|
|
12299
|
+
}
|
|
12300
|
+
clearAsync();
|
|
12301
|
+
isUp.current = false;
|
|
12302
|
+
setIsDecrementPressed(null);
|
|
12303
|
+
},
|
|
12304
|
+
onFocus: onFocus,
|
|
12305
|
+
onBlur: onBlur
|
|
12306
|
+
}
|
|
12307
|
+
};
|
|
12308
|
+
}
|
|
12309
|
+
|
|
12310
|
+
var $fb78e0f6ab6349ed$exports = {};
|
|
12311
|
+
$fb78e0f6ab6349ed$exports = {
|
|
12312
|
+
"decrease": (args)=>`\u{62E}\u{641}\u{636} ${args.fieldLabel}`,
|
|
12313
|
+
"increase": (args)=>`\u{632}\u{64A}\u{627}\u{62F}\u{629} ${args.fieldLabel}`,
|
|
12314
|
+
"numberField": `\u{62D}\u{642}\u{644} \u{631}\u{642}\u{645}\u{64A}`
|
|
12315
|
+
};
|
|
12316
|
+
|
|
12317
|
+
var $2776acdd9959a647$exports = {};
|
|
12318
|
+
$2776acdd9959a647$exports = {
|
|
12319
|
+
"decrease": (args)=>`\u{41D}\u{430}\u{43C}\u{430}\u{43B}\u{44F}\u{432}\u{430}\u{43D}\u{435} ${args.fieldLabel}`,
|
|
12320
|
+
"increase": (args)=>`\u{423}\u{441}\u{438}\u{43B}\u{432}\u{430}\u{43D}\u{435} ${args.fieldLabel}`,
|
|
12321
|
+
"numberField": `\u{41D}\u{43E}\u{43C}\u{435}\u{440} \u{43D}\u{430} \u{43F}\u{43E}\u{43B}\u{435}\u{442}\u{43E}`
|
|
12322
|
+
};
|
|
12323
|
+
|
|
12324
|
+
var $741954410a365ad3$exports = {};
|
|
12325
|
+
$741954410a365ad3$exports = {
|
|
12326
|
+
"decrease": (args)=>`Sn\xed\u{17E}it ${args.fieldLabel}`,
|
|
12327
|
+
"increase": (args)=>`Zv\xfd\u{161}it ${args.fieldLabel}`,
|
|
12328
|
+
"numberField": `\u{10C}\xedseln\xe9 pole`
|
|
12329
|
+
};
|
|
12330
|
+
|
|
12331
|
+
var $8321ed0f8ab642f0$exports = {};
|
|
12332
|
+
$8321ed0f8ab642f0$exports = {
|
|
12333
|
+
"decrease": (args)=>`Reducer ${args.fieldLabel}`,
|
|
12334
|
+
"increase": (args)=>`\xd8g ${args.fieldLabel}`,
|
|
12335
|
+
"numberField": `Talfelt`
|
|
12336
|
+
};
|
|
12337
|
+
|
|
12338
|
+
var $92978e0c4ecafa32$exports = {};
|
|
12339
|
+
$92978e0c4ecafa32$exports = {
|
|
12340
|
+
"decrease": (args)=>`${args.fieldLabel} verringern`,
|
|
12341
|
+
"increase": (args)=>`${args.fieldLabel} erh\xf6hen`,
|
|
12342
|
+
"numberField": `Nummernfeld`
|
|
12343
|
+
};
|
|
12344
|
+
|
|
12345
|
+
var $ac5ff71962864a84$exports = {};
|
|
12346
|
+
$ac5ff71962864a84$exports = {
|
|
12347
|
+
"decrease": (args)=>`\u{39C}\u{3B5}\u{3AF}\u{3C9}\u{3C3}\u{3B7} ${args.fieldLabel}`,
|
|
12348
|
+
"increase": (args)=>`\u{391}\u{3CD}\u{3BE}\u{3B7}\u{3C3}\u{3B7} ${args.fieldLabel}`,
|
|
12349
|
+
"numberField": `\u{3A0}\u{3B5}\u{3B4}\u{3AF}\u{3BF} \u{3B1}\u{3C1}\u{3B9}\u{3B8}\u{3BC}\u{3BF}\u{3CD}`
|
|
12350
|
+
};
|
|
12351
|
+
|
|
12352
|
+
var $efe4685e2440d8be$exports = {};
|
|
12353
|
+
$efe4685e2440d8be$exports = {
|
|
12354
|
+
"decrease": (args)=>`Decrease ${args.fieldLabel}`,
|
|
12355
|
+
"increase": (args)=>`Increase ${args.fieldLabel}`,
|
|
12356
|
+
"numberField": `Number field`
|
|
12357
|
+
};
|
|
12358
|
+
|
|
12359
|
+
var $e50a9a48739b90e1$exports = {};
|
|
12360
|
+
$e50a9a48739b90e1$exports = {
|
|
12361
|
+
"decrease": (args)=>`Reducir ${args.fieldLabel}`,
|
|
12362
|
+
"increase": (args)=>`Aumentar ${args.fieldLabel}`,
|
|
12363
|
+
"numberField": `Campo de n\xfamero`
|
|
12364
|
+
};
|
|
12365
|
+
|
|
12366
|
+
var $6e0d5294ecbb8ab6$exports = {};
|
|
12367
|
+
$6e0d5294ecbb8ab6$exports = {
|
|
12368
|
+
"decrease": (args)=>`V\xe4henda ${args.fieldLabel}`,
|
|
12369
|
+
"increase": (args)=>`Suurenda ${args.fieldLabel}`,
|
|
12370
|
+
"numberField": `Numbri v\xe4li`
|
|
12371
|
+
};
|
|
12372
|
+
|
|
12373
|
+
var $e7129d65f607f77f$exports = {};
|
|
12374
|
+
$e7129d65f607f77f$exports = {
|
|
12375
|
+
"decrease": (args)=>`V\xe4henn\xe4 ${args.fieldLabel}`,
|
|
12376
|
+
"increase": (args)=>`Lis\xe4\xe4 ${args.fieldLabel}`,
|
|
12377
|
+
"numberField": `Numerokentt\xe4`
|
|
12378
|
+
};
|
|
12379
|
+
|
|
12380
|
+
var $d72adf5b20573e34$exports = {};
|
|
12381
|
+
$d72adf5b20573e34$exports = {
|
|
12382
|
+
"decrease": (args)=>`Diminuer ${args.fieldLabel}`,
|
|
12383
|
+
"increase": (args)=>`Augmenter ${args.fieldLabel}`,
|
|
12384
|
+
"numberField": `Champ de nombre`
|
|
12385
|
+
};
|
|
12386
|
+
|
|
12387
|
+
var $a25c707e88b844a7$exports = {};
|
|
12388
|
+
$a25c707e88b844a7$exports = {
|
|
12389
|
+
"decrease": (args)=>`\u{5D4}\u{5E7}\u{5D8}\u{5DF} ${args.fieldLabel}`,
|
|
12390
|
+
"increase": (args)=>`\u{5D4}\u{5D2}\u{5D3}\u{5DC} ${args.fieldLabel}`,
|
|
12391
|
+
"numberField": `\u{5E9}\u{5D3}\u{5D4} \u{5DE}\u{5E1}\u{5E4}\u{5E8}`
|
|
12392
|
+
};
|
|
12393
|
+
|
|
12394
|
+
var $69b41140b9a4ca54$exports = {};
|
|
12395
|
+
$69b41140b9a4ca54$exports = {
|
|
12396
|
+
"decrease": (args)=>`Smanji ${args.fieldLabel}`,
|
|
12397
|
+
"increase": (args)=>`Pove\u{107}aj ${args.fieldLabel}`,
|
|
12398
|
+
"numberField": `Polje broja`
|
|
12399
|
+
};
|
|
12400
|
+
|
|
12401
|
+
var $81dab28f37f59d1a$exports = {};
|
|
12402
|
+
$81dab28f37f59d1a$exports = {
|
|
12403
|
+
"decrease": (args)=>`${args.fieldLabel} cs\xf6kkent\xe9se`,
|
|
12404
|
+
"increase": (args)=>`${args.fieldLabel} n\xf6vel\xe9se`,
|
|
12405
|
+
"numberField": `Sz\xe1mmez\u{151}`
|
|
12406
|
+
};
|
|
12407
|
+
|
|
12408
|
+
var $866555b31f2d7711$exports = {};
|
|
12409
|
+
$866555b31f2d7711$exports = {
|
|
12410
|
+
"decrease": (args)=>`Riduci ${args.fieldLabel}`,
|
|
12411
|
+
"increase": (args)=>`Aumenta ${args.fieldLabel}`,
|
|
12412
|
+
"numberField": `Campo numero`
|
|
12413
|
+
};
|
|
12414
|
+
|
|
12415
|
+
var $dafcd55d52b9d371$exports = {};
|
|
12416
|
+
$dafcd55d52b9d371$exports = {
|
|
12417
|
+
"decrease": (args)=>`${args.fieldLabel}\u{3092}\u{7E2E}\u{5C0F}`,
|
|
12418
|
+
"increase": (args)=>`${args.fieldLabel}\u{3092}\u{62E1}\u{5927}`,
|
|
12419
|
+
"numberField": `\u{6570}\u{5024}\u{30D5}\u{30A3}\u{30FC}\u{30EB}\u{30C9}`
|
|
12420
|
+
};
|
|
12421
|
+
|
|
12422
|
+
var $f090c1f8c5da0145$exports = {};
|
|
12423
|
+
$f090c1f8c5da0145$exports = {
|
|
12424
|
+
"decrease": (args)=>`${args.fieldLabel} \u{AC10}\u{C18C}`,
|
|
12425
|
+
"increase": (args)=>`${args.fieldLabel} \u{C99D}\u{AC00}`,
|
|
12426
|
+
"numberField": `\u{BC88}\u{D638} \u{D544}\u{B4DC}`
|
|
12427
|
+
};
|
|
12428
|
+
|
|
12429
|
+
var $6f10f3a13360a75c$exports = {};
|
|
12430
|
+
$6f10f3a13360a75c$exports = {
|
|
12431
|
+
"decrease": (args)=>`Suma\u{17E}inti ${args.fieldLabel}`,
|
|
12432
|
+
"increase": (args)=>`Padidinti ${args.fieldLabel}`,
|
|
12433
|
+
"numberField": `Numerio laukas`
|
|
12434
|
+
};
|
|
12435
|
+
|
|
12436
|
+
var $47432cefd4b7bd1b$exports = {};
|
|
12437
|
+
$47432cefd4b7bd1b$exports = {
|
|
12438
|
+
"decrease": (args)=>`Samazin\u{101}\u{161}ana ${args.fieldLabel}`,
|
|
12439
|
+
"increase": (args)=>`Palielin\u{101}\u{161}ana ${args.fieldLabel}`,
|
|
12440
|
+
"numberField": `Skait\u{13C}u lauks`
|
|
12441
|
+
};
|
|
12442
|
+
|
|
12443
|
+
var $dc578a950a2bf23d$exports = {};
|
|
12444
|
+
$dc578a950a2bf23d$exports = {
|
|
12445
|
+
"decrease": (args)=>`Reduser ${args.fieldLabel}`,
|
|
12446
|
+
"increase": (args)=>`\xd8k ${args.fieldLabel}`,
|
|
12447
|
+
"numberField": `Tallfelt`
|
|
12448
|
+
};
|
|
12449
|
+
|
|
12450
|
+
var $353f1bfca4dc395a$exports = {};
|
|
12451
|
+
$353f1bfca4dc395a$exports = {
|
|
12452
|
+
"decrease": (args)=>`${args.fieldLabel} verlagen`,
|
|
12453
|
+
"increase": (args)=>`${args.fieldLabel} verhogen`,
|
|
12454
|
+
"numberField": `Getalveld`
|
|
12455
|
+
};
|
|
12456
|
+
|
|
12457
|
+
var $241bc0bbd870e982$exports = {};
|
|
12458
|
+
$241bc0bbd870e982$exports = {
|
|
12459
|
+
"decrease": (args)=>`Zmniejsz ${args.fieldLabel}`,
|
|
12460
|
+
"increase": (args)=>`Zwi\u{119}ksz ${args.fieldLabel}`,
|
|
12461
|
+
"numberField": `Pole numeru`
|
|
12462
|
+
};
|
|
12463
|
+
|
|
12464
|
+
var $da3005c7bd72b0a8$exports = {};
|
|
12465
|
+
$da3005c7bd72b0a8$exports = {
|
|
12466
|
+
"decrease": (args)=>`Diminuir ${args.fieldLabel}`,
|
|
12467
|
+
"increase": (args)=>`Aumentar ${args.fieldLabel}`,
|
|
12468
|
+
"numberField": `Campo de n\xfamero`
|
|
12469
|
+
};
|
|
12470
|
+
|
|
12471
|
+
var $cf48bfc540882310$exports = {};
|
|
12472
|
+
$cf48bfc540882310$exports = {
|
|
12473
|
+
"decrease": (args)=>`Diminuir ${args.fieldLabel}`,
|
|
12474
|
+
"increase": (args)=>`Aumentar ${args.fieldLabel}`,
|
|
12475
|
+
"numberField": `Campo num\xe9rico`
|
|
12476
|
+
};
|
|
12477
|
+
|
|
12478
|
+
var $b63a28c481ab9ee3$exports = {};
|
|
12479
|
+
$b63a28c481ab9ee3$exports = {
|
|
12480
|
+
"decrease": (args)=>`Sc\u{103}dere ${args.fieldLabel}`,
|
|
12481
|
+
"increase": (args)=>`Cre\u{219}tere ${args.fieldLabel}`,
|
|
12482
|
+
"numberField": `C\xe2mp numeric`
|
|
12483
|
+
};
|
|
12484
|
+
|
|
12485
|
+
var $19f9df95c2464ab6$exports = {};
|
|
12486
|
+
$19f9df95c2464ab6$exports = {
|
|
12487
|
+
"decrease": (args)=>`\u{423}\u{43C}\u{435}\u{43D}\u{44C}\u{448}\u{435}\u{43D}\u{438}\u{435} ${args.fieldLabel}`,
|
|
12488
|
+
"increase": (args)=>`\u{423}\u{432}\u{435}\u{43B}\u{438}\u{447}\u{435}\u{43D}\u{438}\u{435} ${args.fieldLabel}`,
|
|
12489
|
+
"numberField": `\u{427}\u{438}\u{441}\u{43B}\u{43E}\u{432}\u{43E}\u{435} \u{43F}\u{43E}\u{43B}\u{435}`
|
|
12490
|
+
};
|
|
12491
|
+
|
|
12492
|
+
var $b272932a685e8482$exports = {};
|
|
12493
|
+
$b272932a685e8482$exports = {
|
|
12494
|
+
"decrease": (args)=>`Zn\xed\u{17E}i\u{165} ${args.fieldLabel}`,
|
|
12495
|
+
"increase": (args)=>`Zv\xfd\u{161}i\u{165} ${args.fieldLabel}`,
|
|
12496
|
+
"numberField": `\u{10C}\xedseln\xe9 pole`
|
|
12497
|
+
};
|
|
12498
|
+
|
|
12499
|
+
var $cbaf8b5b61f9e544$exports = {};
|
|
12500
|
+
$cbaf8b5b61f9e544$exports = {
|
|
12501
|
+
"decrease": (args)=>`Upadati ${args.fieldLabel}`,
|
|
12502
|
+
"increase": (args)=>`Pove\u{10D}ajte ${args.fieldLabel}`,
|
|
12503
|
+
"numberField": `\u{160}tevil\u{10D}no polje`
|
|
12504
|
+
};
|
|
12505
|
+
|
|
12506
|
+
var $e0a3af6ac1449b2f$exports = {};
|
|
12507
|
+
$e0a3af6ac1449b2f$exports = {
|
|
12508
|
+
"decrease": (args)=>`Smanji ${args.fieldLabel}`,
|
|
12509
|
+
"increase": (args)=>`Pove\u{107}aj ${args.fieldLabel}`,
|
|
12510
|
+
"numberField": `Polje broja`
|
|
12511
|
+
};
|
|
12512
|
+
|
|
12513
|
+
var $71e167d2458a6019$exports = {};
|
|
12514
|
+
$71e167d2458a6019$exports = {
|
|
12515
|
+
"decrease": (args)=>`Minska ${args.fieldLabel}`,
|
|
12516
|
+
"increase": (args)=>`\xd6ka ${args.fieldLabel}`,
|
|
12517
|
+
"numberField": `Nummerf\xe4lt`
|
|
12518
|
+
};
|
|
12519
|
+
|
|
12520
|
+
var $3719245abc082946$exports = {};
|
|
12521
|
+
$3719245abc082946$exports = {
|
|
12522
|
+
"decrease": (args)=>`${args.fieldLabel} azalt`,
|
|
12523
|
+
"increase": (args)=>`${args.fieldLabel} artt\u{131}r`,
|
|
12524
|
+
"numberField": `Say\u{131} alan\u{131}`
|
|
12525
|
+
};
|
|
12526
|
+
|
|
12527
|
+
var $2ccc589e2f51824d$exports = {};
|
|
12528
|
+
$2ccc589e2f51824d$exports = {
|
|
12529
|
+
"decrease": (args)=>`\u{417}\u{43C}\u{435}\u{43D}\u{448}\u{438}\u{442}\u{438} ${args.fieldLabel}`,
|
|
12530
|
+
"increase": (args)=>`\u{417}\u{431}\u{456}\u{43B}\u{44C}\u{448}\u{438}\u{442}\u{438} ${args.fieldLabel}`,
|
|
12531
|
+
"numberField": `\u{41F}\u{43E}\u{43B}\u{435} \u{43D}\u{43E}\u{43C}\u{435}\u{440}\u{430}`
|
|
12532
|
+
};
|
|
12533
|
+
|
|
12534
|
+
var $e1103cb9b4c13942$exports = {};
|
|
12535
|
+
$e1103cb9b4c13942$exports = {
|
|
12536
|
+
"decrease": (args)=>`\u{964D}\u{4F4E} ${args.fieldLabel}`,
|
|
12537
|
+
"increase": (args)=>`\u{63D0}\u{9AD8} ${args.fieldLabel}`,
|
|
12538
|
+
"numberField": `\u{6570}\u{5B57}\u{5B57}\u{6BB5}`
|
|
12539
|
+
};
|
|
12540
|
+
|
|
12541
|
+
var $448607634f80dccb$exports = {};
|
|
12542
|
+
$448607634f80dccb$exports = {
|
|
12543
|
+
"decrease": (args)=>`\u{7E2E}\u{5C0F} ${args.fieldLabel}`,
|
|
12544
|
+
"increase": (args)=>`\u{653E}\u{5927} ${args.fieldLabel}`,
|
|
12545
|
+
"numberField": `\u{6578}\u{5B57}\u{6B04}\u{4F4D}`
|
|
12546
|
+
};
|
|
12547
|
+
|
|
12548
|
+
var $280a227d7cb94b92$exports = {};
|
|
12549
|
+
|
|
12550
|
+
|
|
12551
|
+
|
|
12552
|
+
|
|
12553
|
+
|
|
12554
|
+
|
|
12555
|
+
|
|
12556
|
+
|
|
12557
|
+
|
|
12558
|
+
|
|
12559
|
+
|
|
12560
|
+
|
|
12561
|
+
|
|
12562
|
+
|
|
12563
|
+
|
|
12564
|
+
|
|
12565
|
+
|
|
12566
|
+
|
|
12567
|
+
|
|
12568
|
+
|
|
12569
|
+
|
|
12570
|
+
|
|
12571
|
+
|
|
12572
|
+
|
|
12573
|
+
|
|
12574
|
+
|
|
12575
|
+
|
|
12576
|
+
|
|
12577
|
+
|
|
12578
|
+
|
|
12579
|
+
|
|
12580
|
+
|
|
12581
|
+
|
|
12582
|
+
|
|
12583
|
+
$280a227d7cb94b92$exports = {
|
|
12584
|
+
"ar-AE": $fb78e0f6ab6349ed$exports,
|
|
12585
|
+
"bg-BG": $2776acdd9959a647$exports,
|
|
12586
|
+
"cs-CZ": $741954410a365ad3$exports,
|
|
12587
|
+
"da-DK": $8321ed0f8ab642f0$exports,
|
|
12588
|
+
"de-DE": $92978e0c4ecafa32$exports,
|
|
12589
|
+
"el-GR": $ac5ff71962864a84$exports,
|
|
12590
|
+
"en-US": $efe4685e2440d8be$exports,
|
|
12591
|
+
"es-ES": $e50a9a48739b90e1$exports,
|
|
12592
|
+
"et-EE": $6e0d5294ecbb8ab6$exports,
|
|
12593
|
+
"fi-FI": $e7129d65f607f77f$exports,
|
|
12594
|
+
"fr-FR": $d72adf5b20573e34$exports,
|
|
12595
|
+
"he-IL": $a25c707e88b844a7$exports,
|
|
12596
|
+
"hr-HR": $69b41140b9a4ca54$exports,
|
|
12597
|
+
"hu-HU": $81dab28f37f59d1a$exports,
|
|
12598
|
+
"it-IT": $866555b31f2d7711$exports,
|
|
12599
|
+
"ja-JP": $dafcd55d52b9d371$exports,
|
|
12600
|
+
"ko-KR": $f090c1f8c5da0145$exports,
|
|
12601
|
+
"lt-LT": $6f10f3a13360a75c$exports,
|
|
12602
|
+
"lv-LV": $47432cefd4b7bd1b$exports,
|
|
12603
|
+
"nb-NO": $dc578a950a2bf23d$exports,
|
|
12604
|
+
"nl-NL": $353f1bfca4dc395a$exports,
|
|
12605
|
+
"pl-PL": $241bc0bbd870e982$exports,
|
|
12606
|
+
"pt-BR": $da3005c7bd72b0a8$exports,
|
|
12607
|
+
"pt-PT": $cf48bfc540882310$exports,
|
|
12608
|
+
"ro-RO": $b63a28c481ab9ee3$exports,
|
|
12609
|
+
"ru-RU": $19f9df95c2464ab6$exports,
|
|
12610
|
+
"sk-SK": $b272932a685e8482$exports,
|
|
12611
|
+
"sl-SI": $cbaf8b5b61f9e544$exports,
|
|
12612
|
+
"sr-SP": $e0a3af6ac1449b2f$exports,
|
|
12613
|
+
"sv-SE": $71e167d2458a6019$exports,
|
|
12614
|
+
"tr-TR": $3719245abc082946$exports,
|
|
12615
|
+
"uk-UA": $2ccc589e2f51824d$exports,
|
|
12616
|
+
"zh-CN": $e1103cb9b4c13942$exports,
|
|
12617
|
+
"zh-TW": $448607634f80dccb$exports
|
|
12618
|
+
};
|
|
12619
|
+
|
|
12620
|
+
function $parcel$interopDefault$4(a) {
|
|
12621
|
+
return a && a.__esModule ? a.default : a;
|
|
12622
|
+
}
|
|
12623
|
+
/*
|
|
12624
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
12625
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
12626
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
12627
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
12628
|
+
*
|
|
12629
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
12630
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
12631
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
12632
|
+
* governing permissions and limitations under the License.
|
|
12633
|
+
*/
|
|
12634
|
+
|
|
12635
|
+
|
|
12636
|
+
|
|
12637
|
+
|
|
12638
|
+
|
|
12639
|
+
|
|
12640
|
+
|
|
12641
|
+
function $81397a9303501bda$export$23f548e970bdf099(props, state, inputRef) {
|
|
12642
|
+
let { id: id, decrementAriaLabel: decrementAriaLabel, incrementAriaLabel: incrementAriaLabel, isDisabled: isDisabled, isReadOnly: isReadOnly, isRequired: isRequired, minValue: minValue, maxValue: maxValue, autoFocus: autoFocus, label: label, formatOptions: formatOptions, onBlur: onBlur = ()=>{}, onFocus: onFocus, onFocusChange: onFocusChange, onKeyDown: onKeyDown, onKeyUp: onKeyUp, description: description, errorMessage: errorMessage, isWheelDisabled: isWheelDisabled, ...otherProps } = props;
|
|
12643
|
+
let { increment: increment, incrementToMax: incrementToMax, decrement: decrement, decrementToMin: decrementToMin, numberValue: numberValue, inputValue: inputValue, commit: commit, commitValidation: commitValidation } = state;
|
|
12644
|
+
const stringFormatter = ($fca6afa0e843324b$export$f12b703ca79dfbb1)((($parcel$interopDefault$4($280a227d7cb94b92$exports))), '@react-aria/numberfield');
|
|
12645
|
+
let inputId = ($bdb11010cef70236$export$f680877a34711e37)(id);
|
|
12646
|
+
let { focusProps: focusProps } = ($a1ea59d68270f0dd$export$f8168d8dd8fd66e6)({
|
|
12647
|
+
onBlur () {
|
|
12648
|
+
// Set input value to normalized valid value
|
|
12649
|
+
commit();
|
|
12650
|
+
}
|
|
12651
|
+
});
|
|
12652
|
+
let numberFormatter = ($a916eb452884faea$export$b7a616150fdb9f44)(formatOptions);
|
|
12653
|
+
let intlOptions = (useMemo)(()=>numberFormatter.resolvedOptions(), [
|
|
12654
|
+
numberFormatter
|
|
12655
|
+
]);
|
|
12656
|
+
// Replace negative textValue formatted using currencySign: 'accounting'
|
|
12657
|
+
// with a textValue that can be announced using a minus sign.
|
|
12658
|
+
let textValueFormatter = ($a916eb452884faea$export$b7a616150fdb9f44)({
|
|
12659
|
+
...formatOptions,
|
|
12660
|
+
currencySign: undefined
|
|
12661
|
+
});
|
|
12662
|
+
let textValue = (useMemo)(()=>isNaN(numberValue) ? '' : textValueFormatter.format(numberValue), [
|
|
12663
|
+
textValueFormatter,
|
|
12664
|
+
numberValue
|
|
12665
|
+
]);
|
|
12666
|
+
let { spinButtonProps: spinButtonProps, incrementButtonProps: incButtonProps, decrementButtonProps: decButtonProps } = ($d2e8511e6f209edf$export$e908e06f4b8e3402)({
|
|
12667
|
+
isDisabled: isDisabled,
|
|
12668
|
+
isReadOnly: isReadOnly,
|
|
12669
|
+
isRequired: isRequired,
|
|
12670
|
+
maxValue: maxValue,
|
|
12671
|
+
minValue: minValue,
|
|
12672
|
+
onIncrement: increment,
|
|
12673
|
+
onIncrementToMax: incrementToMax,
|
|
12674
|
+
onDecrement: decrement,
|
|
12675
|
+
onDecrementToMin: decrementToMin,
|
|
12676
|
+
value: numberValue,
|
|
12677
|
+
textValue: textValue
|
|
12678
|
+
});
|
|
12679
|
+
let [focusWithin, setFocusWithin] = (useState)(false);
|
|
12680
|
+
let { focusWithinProps: focusWithinProps } = ($9ab94262bd0047c7$export$420e68273165f4ec)({
|
|
12681
|
+
isDisabled: isDisabled,
|
|
12682
|
+
onFocusWithinChange: setFocusWithin
|
|
12683
|
+
});
|
|
12684
|
+
let onWheel = (useCallback)((e)=>{
|
|
12685
|
+
// if on a trackpad, users can scroll in both X and Y at once, check the magnitude of the change
|
|
12686
|
+
// if it's mostly in the X direction, then just return, the user probably doesn't mean to inc/dec
|
|
12687
|
+
// this isn't perfect, events come in fast with small deltas and a part of the scroll may give a false indication
|
|
12688
|
+
// especially if the user is scrolling near 45deg
|
|
12689
|
+
if (Math.abs(e.deltaY) <= Math.abs(e.deltaX)) return;
|
|
12690
|
+
if (e.deltaY > 0) increment();
|
|
12691
|
+
else if (e.deltaY < 0) decrement();
|
|
12692
|
+
}, [
|
|
12693
|
+
decrement,
|
|
12694
|
+
increment
|
|
12695
|
+
]);
|
|
12696
|
+
// If the input isn't supposed to receive input, disable scrolling.
|
|
12697
|
+
let scrollingDisabled = isWheelDisabled || isDisabled || isReadOnly || !focusWithin;
|
|
12698
|
+
($7d0a636d7a4dcefd$export$2123ff2b87c81ca)({
|
|
12699
|
+
onScroll: onWheel,
|
|
12700
|
+
isDisabled: scrollingDisabled
|
|
12701
|
+
}, inputRef);
|
|
12702
|
+
var _intlOptions_maximumFractionDigits;
|
|
12703
|
+
// The inputMode attribute influences the software keyboard that is shown on touch devices.
|
|
12704
|
+
// Browsers and operating systems are quite inconsistent about what keys are available, however.
|
|
12705
|
+
// We choose between numeric and decimal based on whether we allow negative and fractional numbers,
|
|
12706
|
+
// and based on testing on various devices to determine what keys are available in each inputMode.
|
|
12707
|
+
let hasDecimals = ((_intlOptions_maximumFractionDigits = intlOptions.maximumFractionDigits) !== null && _intlOptions_maximumFractionDigits !== void 0 ? _intlOptions_maximumFractionDigits : 0) > 0;
|
|
12708
|
+
let hasNegative = state.minValue === undefined || isNaN(state.minValue) || state.minValue < 0;
|
|
12709
|
+
let inputMode = 'numeric';
|
|
12710
|
+
if (($c87311424ea30a05$export$186c6964ca17d99)()) {
|
|
12711
|
+
// iPhone doesn't have a minus sign in either numeric or decimal.
|
|
12712
|
+
// Note this is only for iPhone, not iPad, which always has both
|
|
12713
|
+
// minus and decimal in numeric.
|
|
12714
|
+
if (hasNegative) inputMode = 'text';
|
|
12715
|
+
else if (hasDecimals) inputMode = 'decimal';
|
|
12716
|
+
} else if (($c87311424ea30a05$export$a11b0059900ceec8)()) {
|
|
12717
|
+
// Android numeric has both a decimal point and minus key.
|
|
12718
|
+
// decimal does not have a minus key.
|
|
12719
|
+
if (hasNegative) inputMode = 'numeric';
|
|
12720
|
+
else if (hasDecimals) inputMode = 'decimal';
|
|
12721
|
+
}
|
|
12722
|
+
let onChange = (value)=>{
|
|
12723
|
+
if (state.validate(value)) state.setInputValue(value);
|
|
12724
|
+
};
|
|
12725
|
+
let domProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props);
|
|
12726
|
+
let onKeyDownEnter = (useCallback)((e)=>{
|
|
12727
|
+
if (e.nativeEvent.isComposing) return;
|
|
12728
|
+
if (e.key === 'Enter') {
|
|
12729
|
+
commit();
|
|
12730
|
+
commitValidation();
|
|
12731
|
+
} else e.continuePropagation();
|
|
12732
|
+
}, [
|
|
12733
|
+
commit,
|
|
12734
|
+
commitValidation
|
|
12735
|
+
]);
|
|
12736
|
+
let { isInvalid: isInvalid, validationErrors: validationErrors, validationDetails: validationDetails } = state.displayValidation;
|
|
12737
|
+
let { labelProps: labelProps, inputProps: textFieldProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps } = ($d841c8010a73d545$export$4f384c9210e583c3)({
|
|
12738
|
+
...otherProps,
|
|
12739
|
+
...domProps,
|
|
12740
|
+
// These props are added to a hidden input rather than the formatted textfield.
|
|
12741
|
+
name: undefined,
|
|
12742
|
+
form: undefined,
|
|
12743
|
+
label: label,
|
|
12744
|
+
autoFocus: autoFocus,
|
|
12745
|
+
isDisabled: isDisabled,
|
|
12746
|
+
isReadOnly: isReadOnly,
|
|
12747
|
+
isRequired: isRequired,
|
|
12748
|
+
validate: undefined,
|
|
12749
|
+
[($e5be200c675c3b3a$export$a763b9476acd3eb)]: state,
|
|
12750
|
+
value: inputValue,
|
|
12751
|
+
defaultValue: '!',
|
|
12752
|
+
autoComplete: 'off',
|
|
12753
|
+
'aria-label': props['aria-label'] || undefined,
|
|
12754
|
+
'aria-labelledby': props['aria-labelledby'] || undefined,
|
|
12755
|
+
id: inputId,
|
|
12756
|
+
type: 'text',
|
|
12757
|
+
inputMode: inputMode,
|
|
12758
|
+
onChange: onChange,
|
|
12759
|
+
onBlur: onBlur,
|
|
12760
|
+
onFocus: onFocus,
|
|
12761
|
+
onFocusChange: onFocusChange,
|
|
12762
|
+
onKeyDown: (useMemo)(()=>($ff5963eb1fccf552$export$e08e3b67e392101e)(onKeyDownEnter, onKeyDown), [
|
|
12763
|
+
onKeyDownEnter,
|
|
12764
|
+
onKeyDown
|
|
12765
|
+
]),
|
|
12766
|
+
onKeyUp: onKeyUp,
|
|
12767
|
+
description: description,
|
|
12768
|
+
errorMessage: errorMessage
|
|
12769
|
+
}, state, inputRef);
|
|
12770
|
+
($99facab73266f662$export$5add1d006293d136)(inputRef, state.defaultNumberValue, state.setNumberValue);
|
|
12771
|
+
let inputProps = ($3ef42575df84b30b$export$9d1611c77c2fe928)(spinButtonProps, focusProps, textFieldProps, {
|
|
12772
|
+
// override the spinbutton role, we can't focus a spin button with VO
|
|
12773
|
+
role: null,
|
|
12774
|
+
// ignore aria-roledescription on iOS so that required state will announce when it is present
|
|
12775
|
+
'aria-roledescription': !($c87311424ea30a05$export$fedb369cb70207f1)() ? stringFormatter.format('numberField') : null,
|
|
12776
|
+
'aria-valuemax': null,
|
|
12777
|
+
'aria-valuemin': null,
|
|
12778
|
+
'aria-valuenow': null,
|
|
12779
|
+
'aria-valuetext': null,
|
|
12780
|
+
autoCorrect: 'off',
|
|
12781
|
+
spellCheck: 'false'
|
|
12782
|
+
});
|
|
12783
|
+
if (props.validationBehavior === 'native') inputProps['aria-required'] = undefined;
|
|
12784
|
+
let onButtonPressStart = (e)=>{
|
|
12785
|
+
var _inputRef_current;
|
|
12786
|
+
// If focus is already on the input, keep it there so we don't hide the
|
|
12787
|
+
// software keyboard when tapping the increment/decrement buttons.
|
|
12788
|
+
if (document.activeElement === inputRef.current) return;
|
|
12789
|
+
// Otherwise, when using a mouse, move focus to the input.
|
|
12790
|
+
// On touch, or with a screen reader, focus the button so that the software
|
|
12791
|
+
// keyboard does not appear and the screen reader cursor is not moved off the button.
|
|
12792
|
+
if (e.pointerType === 'mouse') (_inputRef_current = inputRef.current) === null || _inputRef_current === void 0 ? void 0 : _inputRef_current.focus();
|
|
12793
|
+
else e.target.focus();
|
|
12794
|
+
};
|
|
12795
|
+
// Determine the label for the increment and decrement buttons. There are 4 cases:
|
|
12796
|
+
//
|
|
12797
|
+
// 1. With a visible label that is a string: aria-label: `Increase ${props.label}`
|
|
12798
|
+
// 2. With a visible label that is JSX: aria-label: 'Increase', aria-labelledby: '${incrementId} ${labelId}'
|
|
12799
|
+
// 3. With an aria-label: aria-label: `Increase ${props['aria-label']}`
|
|
12800
|
+
// 4. With an aria-labelledby: aria-label: 'Increase', aria-labelledby: `${incrementId} ${props['aria-labelledby']}`
|
|
12801
|
+
//
|
|
12802
|
+
// (1) and (2) could possibly be combined and both use aria-labelledby. However, placing the label in
|
|
12803
|
+
// the aria-label string rather than using aria-labelledby gives more flexibility to translators to change
|
|
12804
|
+
// the order or add additional words around the label if needed.
|
|
12805
|
+
let fieldLabel = props['aria-label'] || (typeof props.label === 'string' ? props.label : '');
|
|
12806
|
+
let ariaLabelledby;
|
|
12807
|
+
if (!fieldLabel) ariaLabelledby = props.label != null ? labelProps.id : props['aria-labelledby'];
|
|
12808
|
+
let incrementId = ($bdb11010cef70236$export$f680877a34711e37)();
|
|
12809
|
+
let decrementId = ($bdb11010cef70236$export$f680877a34711e37)();
|
|
12810
|
+
let incrementButtonProps = ($3ef42575df84b30b$export$9d1611c77c2fe928)(incButtonProps, {
|
|
12811
|
+
'aria-label': incrementAriaLabel || stringFormatter.format('increase', {
|
|
12812
|
+
fieldLabel: fieldLabel
|
|
12813
|
+
}).trim(),
|
|
12814
|
+
id: ariaLabelledby && !incrementAriaLabel ? incrementId : null,
|
|
12815
|
+
'aria-labelledby': ariaLabelledby && !incrementAriaLabel ? `${incrementId} ${ariaLabelledby}` : null,
|
|
12816
|
+
'aria-controls': inputId,
|
|
12817
|
+
excludeFromTabOrder: true,
|
|
12818
|
+
preventFocusOnPress: true,
|
|
12819
|
+
allowFocusWhenDisabled: true,
|
|
12820
|
+
isDisabled: !state.canIncrement,
|
|
12821
|
+
onPressStart: onButtonPressStart
|
|
12822
|
+
});
|
|
12823
|
+
let decrementButtonProps = ($3ef42575df84b30b$export$9d1611c77c2fe928)(decButtonProps, {
|
|
12824
|
+
'aria-label': decrementAriaLabel || stringFormatter.format('decrease', {
|
|
12825
|
+
fieldLabel: fieldLabel
|
|
12826
|
+
}).trim(),
|
|
12827
|
+
id: ariaLabelledby && !decrementAriaLabel ? decrementId : null,
|
|
12828
|
+
'aria-labelledby': ariaLabelledby && !decrementAriaLabel ? `${decrementId} ${ariaLabelledby}` : null,
|
|
12829
|
+
'aria-controls': inputId,
|
|
12830
|
+
excludeFromTabOrder: true,
|
|
12831
|
+
preventFocusOnPress: true,
|
|
12832
|
+
allowFocusWhenDisabled: true,
|
|
12833
|
+
isDisabled: !state.canDecrement,
|
|
12834
|
+
onPressStart: onButtonPressStart
|
|
12835
|
+
});
|
|
12836
|
+
return {
|
|
12837
|
+
groupProps: {
|
|
12838
|
+
...focusWithinProps,
|
|
12839
|
+
role: 'group',
|
|
12840
|
+
'aria-disabled': isDisabled,
|
|
12841
|
+
'aria-invalid': isInvalid ? 'true' : undefined
|
|
12842
|
+
},
|
|
12843
|
+
labelProps: labelProps,
|
|
12844
|
+
inputProps: inputProps,
|
|
12845
|
+
incrementButtonProps: incrementButtonProps,
|
|
12846
|
+
decrementButtonProps: decrementButtonProps,
|
|
12847
|
+
errorMessageProps: errorMessageProps,
|
|
12848
|
+
descriptionProps: descriptionProps,
|
|
12849
|
+
isInvalid: isInvalid,
|
|
12850
|
+
validationErrors: validationErrors,
|
|
12851
|
+
validationDetails: validationDetails
|
|
12852
|
+
};
|
|
12853
|
+
}
|
|
12854
|
+
|
|
12855
|
+
/*
|
|
12856
|
+
* Copyright 2020 Adobe. All rights reserved.
|
|
12857
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
12858
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
12859
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
12860
|
+
*
|
|
12861
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
12862
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
12863
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
12864
|
+
* governing permissions and limitations under the License.
|
|
12865
|
+
*/
|
|
12866
|
+
|
|
12867
|
+
|
|
12868
|
+
|
|
12869
|
+
function $40df3f8667284809$export$d55e7ee900f34e93(props, ref) {
|
|
12870
|
+
let { role: role = 'dialog' } = props;
|
|
12871
|
+
let titleId = ($bdb11010cef70236$export$b4cc09c592e8fdb8)();
|
|
12872
|
+
titleId = props['aria-label'] ? undefined : titleId;
|
|
12873
|
+
let isRefocusing = (useRef)(false);
|
|
12874
|
+
// Focus the dialog itself on mount, unless a child element is already focused.
|
|
12875
|
+
(useEffect)(()=>{
|
|
12876
|
+
if (ref.current && !ref.current.contains(document.activeElement)) {
|
|
12877
|
+
($3ad3f6e1647bc98d$export$80f3e147d781571c)(ref.current);
|
|
12878
|
+
// Safari on iOS does not move the VoiceOver cursor to the dialog
|
|
12879
|
+
// or announce that it has opened until it has rendered. A workaround
|
|
12880
|
+
// is to wait for half a second, then blur and re-focus the dialog.
|
|
12881
|
+
let timeout = setTimeout(()=>{
|
|
12882
|
+
// Check that the dialog is still focused, or focused was lost to the body.
|
|
12883
|
+
if (document.activeElement === ref.current || document.activeElement === document.body) {
|
|
12884
|
+
isRefocusing.current = true;
|
|
12885
|
+
if (ref.current) {
|
|
12886
|
+
ref.current.blur();
|
|
12887
|
+
($3ad3f6e1647bc98d$export$80f3e147d781571c)(ref.current);
|
|
12888
|
+
}
|
|
12889
|
+
isRefocusing.current = false;
|
|
12890
|
+
}
|
|
12891
|
+
}, 500);
|
|
12892
|
+
return ()=>{
|
|
12893
|
+
clearTimeout(timeout);
|
|
12894
|
+
};
|
|
12895
|
+
}
|
|
12896
|
+
}, [
|
|
12897
|
+
ref
|
|
12898
|
+
]);
|
|
12899
|
+
($337b884510726a0d$export$14c98a7594375490)();
|
|
12900
|
+
// We do not use aria-modal due to a Safari bug which forces the first focusable element to be focused
|
|
12901
|
+
// on mount when inside an iframe, no matter which element we programmatically focus.
|
|
12902
|
+
// See https://bugs.webkit.org/show_bug.cgi?id=211934.
|
|
12903
|
+
// useModal sets aria-hidden on all elements outside the dialog, so the dialog will behave as a modal
|
|
12904
|
+
// even without aria-modal on the dialog itself.
|
|
12905
|
+
return {
|
|
12906
|
+
dialogProps: {
|
|
12907
|
+
...($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props, {
|
|
12908
|
+
labelable: true
|
|
12909
|
+
}),
|
|
12910
|
+
role: role,
|
|
12911
|
+
tabIndex: -1,
|
|
12912
|
+
'aria-labelledby': props['aria-labelledby'] || titleId,
|
|
12913
|
+
// Prevent blur events from reaching useOverlay, which may cause
|
|
12914
|
+
// popovers to close. Since focus is contained within the dialog,
|
|
12915
|
+
// we don't want this to occur due to the above useEffect.
|
|
12916
|
+
onBlur: (e)=>{
|
|
12917
|
+
if (isRefocusing.current) e.stopPropagation();
|
|
12918
|
+
}
|
|
12919
|
+
},
|
|
12920
|
+
titleProps: {
|
|
12921
|
+
id: titleId
|
|
12922
|
+
}
|
|
12923
|
+
};
|
|
12924
|
+
}
|
|
12925
|
+
|
|
12926
|
+
/*
|
|
12927
|
+
* Copyright 2024 Adobe. All rights reserved.
|
|
12928
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the 'License');
|
|
12929
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
12930
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
12931
|
+
*
|
|
12932
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
11100
12933
|
* the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
11101
12934
|
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
11102
12935
|
* governing permissions and limitations under the License.
|
|
@@ -15000,6 +16833,46 @@ const $bc237834342dbd75$export$48513f6b9f8ce62d = /*#__PURE__*/ (forwardRef)(fun
|
|
|
15000
16833
|
|
|
15001
16834
|
|
|
15002
16835
|
const $a049562f99e7db0e$export$f9c6924e160136d1 = /*#__PURE__*/ (createContext)({});
|
|
16836
|
+
const $a049562f99e7db0e$export$eb2fcfdbd7ba97d4 = /*#__PURE__*/ (forwardRef)(function Group(props, ref) {
|
|
16837
|
+
[props, ref] = ($64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $a049562f99e7db0e$export$f9c6924e160136d1);
|
|
16838
|
+
let { isDisabled: isDisabled, isInvalid: isInvalid, isReadOnly: isReadOnly, onHoverStart: onHoverStart, onHoverChange: onHoverChange, onHoverEnd: onHoverEnd, ...otherProps } = props;
|
|
16839
|
+
isDisabled !== null && isDisabled !== void 0 ? isDisabled : isDisabled = !!props['aria-disabled'] && props['aria-disabled'] !== 'false';
|
|
16840
|
+
isInvalid !== null && isInvalid !== void 0 ? isInvalid : isInvalid = !!props['aria-invalid'] && props['aria-invalid'] !== 'false';
|
|
16841
|
+
let { hoverProps: hoverProps, isHovered: isHovered } = ($6179b936705e76d3$export$ae780daf29e6d456)({
|
|
16842
|
+
onHoverStart: onHoverStart,
|
|
16843
|
+
onHoverChange: onHoverChange,
|
|
16844
|
+
onHoverEnd: onHoverEnd,
|
|
16845
|
+
isDisabled: isDisabled
|
|
16846
|
+
});
|
|
16847
|
+
let { isFocused: isFocused, isFocusVisible: isFocusVisible, focusProps: focusProps } = ($f7dceffc5ad7768b$export$4e328f61c538687f)({
|
|
16848
|
+
within: true
|
|
16849
|
+
});
|
|
16850
|
+
let renderProps = ($64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
16851
|
+
...props,
|
|
16852
|
+
values: {
|
|
16853
|
+
isHovered: isHovered,
|
|
16854
|
+
isFocusWithin: isFocused,
|
|
16855
|
+
isFocusVisible: isFocusVisible,
|
|
16856
|
+
isDisabled: isDisabled,
|
|
16857
|
+
isInvalid: isInvalid
|
|
16858
|
+
},
|
|
16859
|
+
defaultClassName: 'react-aria-Group'
|
|
16860
|
+
});
|
|
16861
|
+
var _props_role, _props_slot;
|
|
16862
|
+
return /*#__PURE__*/ ($dbSRa$react).createElement("div", {
|
|
16863
|
+
...($3ef42575df84b30b$export$9d1611c77c2fe928)(otherProps, focusProps, hoverProps),
|
|
16864
|
+
...renderProps,
|
|
16865
|
+
ref: ref,
|
|
16866
|
+
role: (_props_role = props.role) !== null && _props_role !== void 0 ? _props_role : 'group',
|
|
16867
|
+
slot: (_props_slot = props.slot) !== null && _props_slot !== void 0 ? _props_slot : undefined,
|
|
16868
|
+
"data-focus-within": isFocused || undefined,
|
|
16869
|
+
"data-hovered": isHovered || undefined,
|
|
16870
|
+
"data-focus-visible": isFocusVisible || undefined,
|
|
16871
|
+
"data-disabled": isDisabled || undefined,
|
|
16872
|
+
"data-invalid": isInvalid || undefined,
|
|
16873
|
+
"data-readonly": isReadOnly || undefined
|
|
16874
|
+
}, renderProps.children);
|
|
16875
|
+
});
|
|
15003
16876
|
|
|
15004
16877
|
/*
|
|
15005
16878
|
* Copyright 2022 Adobe. All rights reserved.
|
|
@@ -16757,6 +18630,126 @@ function $f3f84453ead64de5$var$ModalContent(props) {
|
|
|
16757
18630
|
|
|
16758
18631
|
|
|
16759
18632
|
|
|
18633
|
+
|
|
18634
|
+
const $b91743d66a0ed188$export$b414a48cf5dcbc11 = /*#__PURE__*/ (createContext)(null);
|
|
18635
|
+
const $b91743d66a0ed188$export$6cc906c6cff9bec5 = /*#__PURE__*/ (createContext)(null);
|
|
18636
|
+
const $b91743d66a0ed188$export$63c5fa0b2fdccd2e = /*#__PURE__*/ (forwardRef)(function NumberField(props, ref) {
|
|
18637
|
+
[props, ref] = ($64fa3d84918910a7$export$29f1550f4b0d4415)(props, ref, $b91743d66a0ed188$export$b414a48cf5dcbc11);
|
|
18638
|
+
let { validationBehavior: formValidationBehavior } = ($64fa3d84918910a7$export$fabf2dc03a41866e)(($d3e0e05bdfcf66bd$export$c24727297075ec6a)) || {};
|
|
18639
|
+
var _props_validationBehavior, _ref;
|
|
18640
|
+
let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : 'native';
|
|
18641
|
+
let { locale: locale } = ($18f2051aff69b9bf$export$43bb16f9c6d9e3f7)();
|
|
18642
|
+
let state = ($de67e98908f0c6ee$export$7f629e9dc1ecf37c)({
|
|
18643
|
+
...props,
|
|
18644
|
+
locale: locale,
|
|
18645
|
+
validationBehavior: validationBehavior
|
|
18646
|
+
});
|
|
18647
|
+
let inputRef = (useRef)(null);
|
|
18648
|
+
let [labelRef, label] = ($64fa3d84918910a7$export$9d4c57ee4c6ffdd8)(!props['aria-label'] && !props['aria-labelledby']);
|
|
18649
|
+
let { labelProps: labelProps, groupProps: groupProps, inputProps: inputProps, incrementButtonProps: incrementButtonProps, decrementButtonProps: decrementButtonProps, descriptionProps: descriptionProps, errorMessageProps: errorMessageProps, ...validation } = ($81397a9303501bda$export$23f548e970bdf099)({
|
|
18650
|
+
...($64fa3d84918910a7$export$ef03459518577ad4)(props),
|
|
18651
|
+
label: label,
|
|
18652
|
+
validationBehavior: validationBehavior
|
|
18653
|
+
}, state, inputRef);
|
|
18654
|
+
let renderProps = ($64fa3d84918910a7$export$4d86445c2cf5e3)({
|
|
18655
|
+
...props,
|
|
18656
|
+
values: {
|
|
18657
|
+
state: state,
|
|
18658
|
+
isDisabled: props.isDisabled || false,
|
|
18659
|
+
isInvalid: validation.isInvalid || false,
|
|
18660
|
+
isRequired: props.isRequired || false
|
|
18661
|
+
},
|
|
18662
|
+
defaultClassName: 'react-aria-NumberField'
|
|
18663
|
+
});
|
|
18664
|
+
let DOMProps = ($65484d02dcb7eb3e$export$457c3d6518dd4c6f)(props, {
|
|
18665
|
+
global: true
|
|
18666
|
+
});
|
|
18667
|
+
delete DOMProps.id;
|
|
18668
|
+
return /*#__PURE__*/ ($dbSRa$react).createElement(($64fa3d84918910a7$export$2881499e37b75b9a), {
|
|
18669
|
+
values: [
|
|
18670
|
+
[
|
|
18671
|
+
$b91743d66a0ed188$export$6cc906c6cff9bec5,
|
|
18672
|
+
state
|
|
18673
|
+
],
|
|
18674
|
+
[
|
|
18675
|
+
($a049562f99e7db0e$export$f9c6924e160136d1),
|
|
18676
|
+
groupProps
|
|
18677
|
+
],
|
|
18678
|
+
[
|
|
18679
|
+
($3985021b0ad6602f$export$37fb8590cf2c088c),
|
|
18680
|
+
{
|
|
18681
|
+
...inputProps,
|
|
18682
|
+
ref: inputRef
|
|
18683
|
+
}
|
|
18684
|
+
],
|
|
18685
|
+
[
|
|
18686
|
+
($01b77f81d0f07f68$export$75b6ee27786ba447),
|
|
18687
|
+
{
|
|
18688
|
+
...labelProps,
|
|
18689
|
+
ref: labelRef
|
|
18690
|
+
}
|
|
18691
|
+
],
|
|
18692
|
+
[
|
|
18693
|
+
($d2b4bc8c273e7be6$export$24d547caef80ccd1),
|
|
18694
|
+
{
|
|
18695
|
+
slots: {
|
|
18696
|
+
increment: incrementButtonProps,
|
|
18697
|
+
decrement: decrementButtonProps
|
|
18698
|
+
}
|
|
18699
|
+
}
|
|
18700
|
+
],
|
|
18701
|
+
[
|
|
18702
|
+
($514c0188e459b4c0$export$9afb8bc826b033ea),
|
|
18703
|
+
{
|
|
18704
|
+
slots: {
|
|
18705
|
+
description: descriptionProps,
|
|
18706
|
+
errorMessage: errorMessageProps
|
|
18707
|
+
}
|
|
18708
|
+
}
|
|
18709
|
+
],
|
|
18710
|
+
[
|
|
18711
|
+
($ee014567cb39d3f0$export$ff05c3ac10437e03),
|
|
18712
|
+
validation
|
|
18713
|
+
]
|
|
18714
|
+
]
|
|
18715
|
+
}, /*#__PURE__*/ ($dbSRa$react).createElement("div", {
|
|
18716
|
+
...DOMProps,
|
|
18717
|
+
...renderProps,
|
|
18718
|
+
ref: ref,
|
|
18719
|
+
slot: props.slot || undefined,
|
|
18720
|
+
"data-disabled": props.isDisabled || undefined,
|
|
18721
|
+
"data-required": props.isRequired || undefined,
|
|
18722
|
+
"data-invalid": validation.isInvalid || undefined
|
|
18723
|
+
}), props.name && /*#__PURE__*/ ($dbSRa$react).createElement("input", {
|
|
18724
|
+
type: "hidden",
|
|
18725
|
+
name: props.name,
|
|
18726
|
+
form: props.form,
|
|
18727
|
+
value: isNaN(state.numberValue) ? '' : state.numberValue,
|
|
18728
|
+
disabled: props.isDisabled || undefined
|
|
18729
|
+
}));
|
|
18730
|
+
});
|
|
18731
|
+
|
|
18732
|
+
/*
|
|
18733
|
+
* Copyright 2022 Adobe. All rights reserved.
|
|
18734
|
+
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
18735
|
+
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
18736
|
+
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
18737
|
+
*
|
|
18738
|
+
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
18739
|
+
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
18740
|
+
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
18741
|
+
* governing permissions and limitations under the License.
|
|
18742
|
+
*/
|
|
18743
|
+
|
|
18744
|
+
|
|
18745
|
+
|
|
18746
|
+
|
|
18747
|
+
|
|
18748
|
+
|
|
18749
|
+
|
|
18750
|
+
|
|
18751
|
+
|
|
18752
|
+
|
|
16760
18753
|
const $b6c3ddc6086f204d$export$a79eda4ff50e30b6 = /*#__PURE__*/ (createContext)(null);
|
|
16761
18754
|
const $b6c3ddc6086f204d$export$b118023277d4a5c3 = /*#__PURE__*/ (createContext)(null);
|
|
16762
18755
|
const $b6c3ddc6086f204d$export$29d84393af70866c = /*#__PURE__*/ (createContext)(null);
|
|
@@ -17744,22 +19737,22 @@ function $4e3b923658d69c60$var$TooltipInner(props) {
|
|
|
17744
19737
|
}, renderProps.children));
|
|
17745
19738
|
}
|
|
17746
19739
|
|
|
17747
|
-
var css_248z$
|
|
17748
|
-
styleInject(css_248z$
|
|
19740
|
+
var css_248z$s = ".bcds-react-aria-Disclosure {\n display: flex;\n flex-direction: column;\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n overflow: hidden;\n}\n\n.bcds-react-aria-Disclosure--Button {\n display: inline-flex;\n flex-direction: row;\n padding: var(--layout-padding-small) var(--layout-padding-medium);\n gap: var(--layout-margin-small);\n justify-content: space-between;\n align-items: center;\n background-color: var(--surface-color-background-light-gray);\n border: none;\n cursor: pointer;\n font: var(--typography-bold-body);\n color: var(--typography-color-primary);\n}\n\n/* Hover */\n.bcds-react-aria-Disclosure--Button[data-hovered] {\n background-color: var(--surface-color-menus-hover);\n}\n\n/* Accordion content */\n.bcds-react-aria-Disclosure[data-expanded]\n > .bcds-react-aria-Disclosure--Panel {\n display: flex;\n align-items: flex-start;\n padding: var(--layout-padding-medium);\n gap: var(--layout-margin-small);\n background-color: var(--surface-color-forms-default);\n font: var(--typography-regular-body);\n}\n\n/* Focus state */\n.bcds-react-aria-Disclosure[data-focus-visible-within] {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Override default focus behaviour for button */\n.bcds-react-aria-Disclosure[data-focus-visible-within]\n > .bcds-react-aria-Disclosure--Button {\n outline: none;\n}\n\n.bcds-react-aria-Disclosure--Button[data-focused] {\n outline: none;\n}\n\n/* Disabled state */\n.bcds-react-aria-Disclosure[data-disabled]\n > .bcds-react-aria-Disclosure--Button {\n background-color: var(--surface-color-forms-disabled);\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n";
|
|
19741
|
+
styleInject(css_248z$s);
|
|
17749
19742
|
|
|
17750
|
-
var css_248z$
|
|
17751
|
-
styleInject(css_248z$
|
|
19743
|
+
var css_248z$r = ".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}\n.bcds-react-aria-Button[data-disabled] {\n cursor: not-allowed;\n}\n.bcds-react-aria-Button[data-focus-visible] {\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.xsmall {\n min-height: 24px;\n padding: var(--layout-padding-hair) var(--layout-padding-small);\n font: var(--typography-regular-label);\n}\n.bcds-react-aria-Button.xsmall.icon {\n padding: unset;\n height: 24px;\n width: 24px;\n min-width: 24px;\n}\n.bcds-react-aria-Button.small {\n min-height: 32px;\n padding: var(--layout-padding-none) 0.75rem /* to be replaced with new token later */;\n font: var(--typography-regular-small-body);\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 padding: var(--layout-padding-none) var(--layout-padding-medium);\n}\n.bcds-react-aria-Button.medium.icon {\n padding: unset;\n height: 40px;\n width: 40px;\n min-width: 40px;\n}\n.bcds-react-aria-Button.large, /* this doesn't work on its own */\n.bcds-react-aria-Button.large.primary, \n.bcds-react-aria-Button.large.secondary, \n.bcds-react-aria-Button.large.tertiary, \n.bcds-react-aria-Button.large.link {\n min-height: 48px;\n padding: var(--layout-padding-none) var(--layout-padding-large);\n}\n.bcds-react-aria-Button.large.icon {\n padding: unset;\n height: 48px;\n width: 48px;\n min-width: 48px;\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";
|
|
19744
|
+
styleInject(css_248z$r);
|
|
17752
19745
|
|
|
17753
19746
|
function Button({ size = "medium", variant = "primary", danger = false, isIconButton = false, ...props }) {
|
|
17754
19747
|
return (jsx($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { className: `bcds-react-aria-Button ${size} ${variant} ${danger ? "danger" : ""} ${isIconButton ? "icon" : ""}`, ...props }));
|
|
17755
19748
|
}
|
|
17756
19749
|
|
|
17757
|
-
/*
|
|
19750
|
+
/* This component implements the Chevron Up icon from Font Awesome: https://fontawesome.com/icons/chevron-up */
|
|
17758
19751
|
function SvgChevronUpIcon({ id = "chevron-up-icon" }) {
|
|
17759
19752
|
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" }) }));
|
|
17760
19753
|
}
|
|
17761
19754
|
|
|
17762
|
-
/*
|
|
19755
|
+
/* This component implements the Chevron Down icon from Font Awesome: https://fontawesome.com/icons/chevron-down */
|
|
17763
19756
|
function SvgChevronDownIcon({ id = "chevron-down-icon" }) {
|
|
17764
19757
|
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: "M15.7882 9.15569L10.4858 14.236C10.3192 14.3748 10.1527 14.4303 10.0139 14.4303C9.84731 14.4303 9.68074 14.3748 9.54194 14.2637L4.21182 9.15569C3.9342 8.90584 3.9342 8.46167 4.18405 8.21182C4.4339 7.9342 4.87808 7.9342 5.12793 8.18405L10.0139 12.8479L14.872 8.18405C15.1219 7.9342 15.5661 7.9342 15.8159 8.21182C16.0658 8.46167 16.0658 8.90584 15.7882 9.15569Z", fill: "currentColor" }) }));
|
|
17765
19758
|
}
|
|
@@ -17768,8 +19761,8 @@ function Accordion({ label, children, ...props }) {
|
|
|
17768
19761
|
return (jsx($28f4fd908f0de97f$export$74a362b31437ec83, { className: `bcds-react-aria-Disclosure`, ...props, children: ({ isExpanded }) => (jsxs(Fragment$1, { children: [jsxs(Button, { className: "bcds-react-aria-Disclosure--Button", size: "small", variant: "link", slot: "trigger", children: [label, isExpanded ? jsx(SvgChevronUpIcon, {}) : jsx(SvgChevronDownIcon, {})] }), jsx($28f4fd908f0de97f$export$feabaa331e1d464c, { className: "bcds-react-aria-Disclosure--Panel", children: jsx(Fragment$1, { children: children }) })] })) }));
|
|
17769
19762
|
}
|
|
17770
19763
|
|
|
17771
|
-
var css_248z$
|
|
17772
|
-
styleInject(css_248z$
|
|
19764
|
+
var css_248z$q = ".bcds-react-aria-DisclosureGroup {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n gap: var(--layout-border-width-small);\n background-color: var(--surface-color-border-default);\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n overflow: hidden;\n}\n\n/* Override individual accordion item borders */\n.bcds-react-aria-DisclosureGroup > .bcds-react-aria-Disclosure {\n border: none;\n border-radius: var(--layout-border-radius-none);\n}\n\n/* Focus state */\n.bcds-react-aria-DisclosureGroup\n > .bcds-react-aria-Disclosure[data-focus-visible-within] {\n border-radius: var(--layout-border-radius-hair);\n outline-offset: calc(var(--layout-margin-hair) * -1);\n}\n\n/* Title styles */\n.bcds-react-aria-DisclosureGroup--Title {\n color: var(--typography-color-primary);\n margin: var(--layout-margin-medium) var(--layout-margin-none);\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h1 {\n font: var(--typography-bold-h1);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h2 {\n font: var(--typography-bold-h2);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h3 {\n font: var(--typography-bold-h3);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h4 {\n font: var(--typography-bold-h4);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h5 {\n font: var(--typography-bold-h5);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > h6 {\n font: var(--typography-bold-h6);\n margin-block-start: 0;\n margin-block-end: 0;\n}\n\n.bcds-react-aria-DisclosureGroup--Title > span {\n font: var(--typography-bold-large-body);\n}\n";
|
|
19765
|
+
styleInject(css_248z$q);
|
|
17773
19766
|
|
|
17774
19767
|
function AccordionGroup({ title, titleElement, children, ...props }) {
|
|
17775
19768
|
function getTitle() {
|
|
@@ -17793,30 +19786,30 @@ function AccordionGroup({ title, titleElement, children, ...props }) {
|
|
|
17793
19786
|
return (jsxs(Fragment$1, { children: [title && (jsx("div", { className: "bcds-react-aria-DisclosureGroup--Title", children: getTitle() })), jsx($28f4fd908f0de97f$export$944aceb4f8c89f10, { className: "bcds-react-aria-DisclosureGroup", ...props, children: children })] }));
|
|
17794
19787
|
}
|
|
17795
19788
|
|
|
17796
|
-
var css_248z$
|
|
17797
|
-
styleInject(css_248z$
|
|
19789
|
+
var css_248z$p = ".bcds-Alert-Banner {\n box-sizing: border-box;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-around;\n width: 100%;\n padding: var(--layout-padding-none) var(--layout-padding-medium);\n}\n\n.bcds-Alert-Banner--Container {\n flex-grow: 1;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-padding-medium);\n max-width: 1100px;\n padding: var(--layout-padding-small) var(--layout-padding-none);\n}\n\n.bcds-Alert-Banner--Icon {\n align-self: first baseline;\n justify-self: flex-start;\n padding-top: var(--layout-padding-xsmall);\n color: var(--icons-color-primary-invert);\n}\n\n.bcds-Alert-Banner--Content {\n display: inline-flex;\n gap: var(--layout-margin-medium);\n align-items: first baseline;\n flex-grow: 1;\n flex-wrap: wrap;\n font: var(--typography-regular-body);\n color: var(--typography-color-primary-invert);\n}\n\n.bcds-Alert-Banner--closeIcon {\n align-self: first baseline;\n}\n\n.bcds-Alert-Banner--closeIcon > .bcds-react-aria-Button[data-hovered] svg {\n color: var(--icons-color-primary);\n}\n\n.bcds-Alert-Banner--closeIcon svg {\n color: var(--icons-color-primary-invert);\n}\n\n/* Variants */\n\n/* Info theme */\n.bcds-Alert-Banner.info {\n background-color: var(--surface-color-background-dark-blue);\n}\n\n/* Success theme */\n.bcds-Alert-Banner.success {\n background-color: var(--support-border-color-success);\n}\n\n/* Warning theme */\n.bcds-Alert-Banner.warning {\n background-color: var(--support-border-color-warning);\n}\n\n.bcds-Alert-Banner.warning .bcds-Alert-Banner--Icon {\n color: var(--icons-color-primary);\n}\n\n.bcds-Alert-Banner.warning .bcds-Alert-Banner--Content {\n color: var(--typography-color-primary);\n}\n\n.bcds-Alert-Banner.warning .bcds-Alert-Banner--closeIcon svg {\n color: var(--icons-color-primary);\n}\n\n/* Danger theme */\n.bcds-Alert-Banner.danger {\n background-color: var(--support-border-color-danger);\n}\n\n/* Black theme */\n\n.bcds-Alert-Banner.black {\n background-color: var(--theme-gray-110);\n}\n";
|
|
19790
|
+
styleInject(css_248z$p);
|
|
17798
19791
|
|
|
17799
|
-
/*
|
|
19792
|
+
/* This component implements the Circle Check icon from Font Awesome: https://fontawesome.com/icons/circle-check */
|
|
17800
19793
|
function SvgCheckCircleIcon({ id = "check-icon" }) {
|
|
17801
19794
|
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M12.4688 7.46875C12.75 7.1875 13.2188 7.1875 13.5 7.5C13.8125 7.78125 13.8125 8.25 13.5 8.53125L9.5 12.5312C9.375 12.6875 9.1875 12.75 9 12.75C8.78125 12.75 8.59375 12.6875 8.4375 12.5312L6.4375 10.5312C6.125 10.25 6.125 9.78125 6.4375 9.46875C6.71875 9.1875 7.1875 9.1875 7.5 9.46875L9 10.9688L12.4688 7.46875ZM10 2C14.4062 2 18 5.59375 18 10C18 14.4375 14.4062 18 10 18C5.5625 18 2 14.4375 2 10C2 5.59375 5.5625 2 10 2ZM10 16.5C13.5625 16.5 16.5 13.5938 16.5 10C16.5 6.4375 13.5625 3.5 10 3.5C6.40625 3.5 3.5 6.4375 3.5 10C3.5 13.5938 6.40625 16.5 10 16.5Z", fill: "currentColor" }) }) }));
|
|
17802
19795
|
}
|
|
17803
19796
|
|
|
17804
|
-
/*
|
|
19797
|
+
/* This component implements the X Mark icon from Font Awesome: https://fontawesome.com/icons/xmark */
|
|
17805
19798
|
function SvgCloseIcon({ id = "close-icon" }) {
|
|
17806
19799
|
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M16 5.21286L14.7871 4L10 8.78714L5.21286 4L4 5.21286L8.78714 10L4 14.7871L5.21286 16L10 11.2129L14.7871 16L16 14.7871L11.2129 10L16 5.21286Z", fill: "currentColor" }) }) }));
|
|
17807
19800
|
}
|
|
17808
19801
|
|
|
17809
|
-
/*
|
|
19802
|
+
/* This component implements the Circle Exclamation icon from Font Awesome: https://fontawesome.com/icons/circle-exclamation */
|
|
17810
19803
|
function SvgExclamationCircleIcon({ id = "exclamation-icon-circle", }) {
|
|
17811
19804
|
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M9.99999 2C14.4062 2 18 5.59375 18 10C18 14.4375 14.4062 18 9.99999 18C5.56249 18 1.99998 14.4375 1.99998 10C1.99998 5.59375 5.56249 2 9.99999 2ZM9.99999 16.5C13.5625 16.5 16.5 13.5938 16.5 10C16.5 6.4375 13.5625 3.5 9.99999 3.5C6.40624 3.5 3.49999 6.4375 3.49999 10C3.49999 13.5938 6.40624 16.5 9.99999 16.5ZM9.99999 11.5C9.56249 11.5 9.24999 11.1875 9.24999 10.75V6.75C9.24999 6.34375 9.56249 6 9.99999 6C10.4062 6 10.75 6.34375 10.75 6.75V10.75C10.75 11.1875 10.4062 11.5 9.99999 11.5ZM9.99999 12.5625C10.5312 12.5625 10.9687 13 10.9687 13.5312C10.9687 14.0625 10.5312 14.5 9.99999 14.5C9.43749 14.5 8.99999 14.0625 8.99999 13.5312C8.99999 13 9.43749 12.5625 9.99999 12.5625Z", fill: "currentColor" }) }) }));
|
|
17812
19805
|
}
|
|
17813
19806
|
|
|
17814
|
-
/*
|
|
19807
|
+
/* This component implements the Triangle Exclamation icon from Font Awesome: https://fontawesome.com/icons/triangle-exclamation */
|
|
17815
19808
|
function SvgExclamationIcon({ id = "exclamation-icon" }) {
|
|
17816
19809
|
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 20 20", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M17.835 15.0312C18.335 15.9062 17.71 17 16.6787 17H3.33499C2.30374 17 1.67874 15.9062 2.14749 15.0312L8.83499 3.65625C9.11624 3.21875 9.55373 3 10.0225 3C10.46 3 10.8975 3.21875 11.1787 3.65625L17.835 15.0312ZM3.64749 15.5H16.3663L9.99123 4.65625L3.64749 15.5ZM10.0225 12.5625C10.5537 12.5625 10.9912 13 10.9912 13.5312C10.9912 14.0625 10.5537 14.5 10.0225 14.5C9.45998 14.5 9.02249 14.0625 9.02249 13.5312C9.02249 13 9.45998 12.5625 10.0225 12.5625ZM9.27249 7.75C9.27249 7.34375 9.58498 7 10.0225 7C10.4287 7 10.7725 7.34375 10.7725 7.75V10.75C10.7725 11.1875 10.4287 11.5 10.0225 11.5C9.58498 11.5 9.27249 11.1875 9.27249 10.75V7.75Z", fill: "currentColor" }) }) }));
|
|
17817
19810
|
}
|
|
17818
19811
|
|
|
17819
|
-
/*
|
|
19812
|
+
/* This component implements the Circle Info icon from Font Awesome: https://fontawesome.com/icons/circle-info */
|
|
17820
19813
|
function SvgInfoIcon({ id = "information-icon" }) {
|
|
17821
19814
|
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" }) }) }));
|
|
17822
19815
|
}
|
|
@@ -17842,15 +19835,15 @@ function AlertBanner({ variant = "info", isIconHidden = false, isCloseable = tru
|
|
|
17842
19835
|
return (jsx("div", { className: `bcds-Alert-Banner ${variant}`, ...props, children: jsxs("div", { className: "bcds-Alert-Banner--Container", children: [" ", !isIconHidden && (jsx("span", { className: "bcds-Alert-Banner--Icon", children: customIcon ? customIcon : getIcon$2(variant) })), jsx("div", { className: "bcds-Alert-Banner--Content", role: role, children: children }), isCloseable && (jsx("span", { className: "bcds-Alert-Banner--closeIcon", children: jsx(Button, { variant: "tertiary", isIconButton: true, size: "small", "aria-label": "Close this alert", type: "button", onPress: onClose, children: jsx(SvgCloseIcon, {}) }) }))] }) }));
|
|
17843
19836
|
}
|
|
17844
19837
|
|
|
17845
|
-
var css_248z$
|
|
17846
|
-
styleInject(css_248z$
|
|
19838
|
+
var css_248z$o = ".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";
|
|
19839
|
+
styleInject(css_248z$o);
|
|
17847
19840
|
|
|
17848
19841
|
function ButtonGroup({ orientation = "horizontal", alignment = "start", ariaLabel, children, ...props }) {
|
|
17849
19842
|
return (jsx("div", { className: `bcds-ButtonGroup ${orientation} ${alignment}`, role: "group", "aria-label": ariaLabel, ...props, children: children }));
|
|
17850
19843
|
}
|
|
17851
19844
|
|
|
17852
|
-
var css_248z$
|
|
17853
|
-
styleInject(css_248z$
|
|
19845
|
+
var css_248z$n = ".bcds-react-aria-AlertDialog {\n display: flex;\n flex-direction: column;\n}\n\n/* Variant icons */\n.bcds-react-aria-AlertDialog.info .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-primary);\n}\n.bcds-react-aria-AlertDialog.confirmation .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-success);\n}\n.bcds-react-aria-AlertDialog.warning .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-warning);\n}\n.bcds-react-aria-AlertDialog.error .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-danger);\n}\n.bcds-react-aria-AlertDialog.destructive .bcds-react-aria-AlertDialog--Icon {\n color: var(--icons-color-danger);\n}\n\n.bcds-react-aria-AlertDialog--Header {\n display: inline-flex;\n flex-direction: row;\n gap: var(--layout-padding-small);\n justify-content: space-between;\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n border-bottom: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n}\n\n.bcds-react-aria-AlertDialog--Title {\n flex-grow: 1;\n font: var(--typography-bold-h5);\n color: var(--typography-color-primary);\n}\n\n.bcds-react-aria-AlertDialog--Icon {\n justify-self: flex-start;\n align-self: center;\n padding-top: var(--layout-padding-xsmall);\n}\n\n.bcds-react-aria-AlertDialog--closeIcon {\n justify-self: flex-end;\n color: var(--icons-color-primary);\n}\n\n.bcds-react-aria-AlertDialog--children {\n font: var(--typography-regular-body);\n color: var(--typography-color-primary);\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n border-bottom: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n}\n\n.bcds-react-aria-AlertDialog > .bcds-ButtonGroup {\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n}\n";
|
|
19846
|
+
styleInject(css_248z$n);
|
|
17854
19847
|
|
|
17855
19848
|
/* Sets correct left icon for selected variant */
|
|
17856
19849
|
function getIcon$1(variant) {
|
|
@@ -17873,52 +19866,52 @@ function AlertDialog({ children, variant = "info", role = "dialog", title, isClo
|
|
|
17873
19866
|
return (jsx($de32f1b87079253c$export$3ddf2d174ce01153, { className: `bcds-react-aria-AlertDialog ${variant}`, role: role, ...props, children: ({ close }) => (jsxs(Fragment$1, { children: [jsxs("div", { className: "bcds-react-aria-AlertDialog--Header", children: [!isIconHidden && (jsx("div", { className: "bcds-react-aria-AlertDialog--Icon", children: getIcon$1(variant) })), title && (jsx("div", { className: "bcds-react-aria-AlertDialog--Title", slot: "title", children: title })), isCloseable && (jsx("div", { className: "bcds-react-aria-AlertDialog--closeIcon", children: jsx(Button, { variant: "tertiary", isIconButton: true, size: "small", "aria-label": "Close", type: "button", onPress: close, children: jsx(SvgCloseIcon, {}) }) }))] }), children && (jsx("div", { className: "bcds-react-aria-AlertDialog--children", slot: "children", children: jsx(Fragment$1, { children: children }) })), buttons && (jsx(ButtonGroup, { alignment: "end", orientation: "horizontal", children: buttons }))] })) }));
|
|
17874
19867
|
}
|
|
17875
19868
|
|
|
17876
|
-
var css_248z$
|
|
17877
|
-
styleInject(css_248z$
|
|
19869
|
+
var css_248z$m = ".bcds-Callout {\n display: flex;\n width: 100%;\n box-sizing: border-box;\n padding: var(--layout-padding-medium) var(--layout-padding-large);\n border-radius: var(--layout-border-radius-medium)\n var(--layout-border-radius-none) var(--layout-border-radius-none)\n var(--layout-border-radius-medium);\n}\n\n.bcds-Callout--Container {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n gap: var(--layout-margin-small);\n}\n\n.bcds-Callout--Container > .bcds-Callout--Title {\n font: var(--typography-bold-large-body);\n color: var(--typography-color-primary);\n}\n\n.bcds-Callout--Container > .bcds-Callout--Description {\n font: var(--typography-regular-body);\n color: var(--typography-color-secondary);\n}\n\n/* Theme - light grey (default) */\n.bcds-Callout.lightGrey {\n background-color: var(--surface-color-background-light-gray);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-blue);\n}\n\n/* Theme - light blue */\n.bcds-Callout.lightBlue {\n background-color: var(--theme-blue-10);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-blue);\n}\n\n/* Theme - light gold */\n.bcds-Callout.lightGold {\n background-color: var(--theme-gold-10);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-blue);\n}\n\n/* Theme - blue */\n.bcds-Callout.Blue {\n background-color: var(--surface-color-background-dark-blue);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-gold);\n}\n\n.bcds-Callout.Blue .bcds-Callout--Title {\n color: var(--typography-color-primary-invert);\n}\n\n.bcds-Callout.Blue .bcds-Callout--Description {\n color: var(--typography-color-secondary-invert);\n}\n\n/* Theme - grey */\n.bcds-Callout.Grey {\n background-color: var(--theme-gray-80);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-gold);\n}\n\n.bcds-Callout.Grey .bcds-Callout--Title {\n color: var(--typography-color-primary-invert);\n}\n\n.bcds-Callout.Grey .bcds-Callout--Description {\n color: var(--typography-color-secondary-invert);\n}\n\n/* Theme - black */\n.bcds-Callout.Black {\n background-color: var(--theme-gray-100);\n border-left: var(--layout-border-width-large) solid var(--theme-primary-gold);\n}\n\n.bcds-Callout.Black .bcds-Callout--Title {\n color: var(--typography-color-primary-invert);\n}\n\n.bcds-Callout.Black .bcds-Callout--Description {\n color: var(--typography-color-secondary-invert);\n}\n\n/* Border disabled */\n.bcds-Callout.lightGrey.noBorder,\n.bcds-Callout.lightGold.noBorder,\n.bcds-Callout.lightBlue.noBorder,\n.bcds-Callout.Blue.noBorder,\n.bcds-Callout.Grey.noBorder,\n.bcds-Callout.Black.noBorder {\n border-left: none;\n border-radius: var(--layout-border-radius-none);\n}\n";
|
|
19870
|
+
styleInject(css_248z$m);
|
|
17878
19871
|
|
|
17879
19872
|
function Callout({ variant = "lightGrey", title, description, buttons, role = "note", isLeftBorderDisabled = false, children, ...props }) {
|
|
17880
19873
|
return (jsx("div", { className: `bcds-Callout ${variant} ${isLeftBorderDisabled ? "noBorder" : ""}`, ...props, role: role, children: children ? (children) : (jsx(Fragment$1, { children: jsxs("div", { className: "bcds-Callout--Container", "aria-labelledby": "callout-title", role: role, children: [title && (jsx("span", { className: "bcds-Callout--Title", id: "callout-title", children: title })), description && (jsx("span", { className: "bcds-Callout--Description", children: description })), buttons && (jsx(ButtonGroup, { alignment: "start", orientation: "horizontal", children: buttons }))] }) })) }));
|
|
17881
19874
|
}
|
|
17882
19875
|
|
|
17883
|
-
/*
|
|
19876
|
+
/* This component implements the Check icon from Font Awesome: https://fontawesome.com/icons/check */
|
|
17884
19877
|
function SvgCheckIcon({ id = "check-icon" }) {
|
|
17885
19878
|
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" }) }) }));
|
|
17886
19879
|
}
|
|
17887
19880
|
|
|
17888
|
-
function SvgDashIcon({ id = "dash-icon" }) {
|
|
19881
|
+
function SvgDashIcon$1({ id = "dash-icon" }) {
|
|
17889
19882
|
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" }) }));
|
|
17890
19883
|
}
|
|
17891
19884
|
|
|
17892
|
-
var css_248z$
|
|
17893
|
-
styleInject(css_248z$
|
|
19885
|
+
var css_248z$l = ".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";
|
|
19886
|
+
styleInject(css_248z$l);
|
|
17894
19887
|
|
|
17895
19888
|
function Checkbox({ value, children, ...props }) {
|
|
17896
|
-
return (jsx($bc237834342dbd75$export$48513f6b9f8ce62d, { className: "bcds-react-aria-Checkbox", value: value, ...props, children: ({ isRequired, isSelected, isIndeterminate }) => (jsxs(Fragment$1, { children: [jsxs("div", { className: "checkbox", children: [isSelected && !isIndeterminate && jsx(SvgCheckIcon, {}), isIndeterminate && jsx(SvgDashIcon, {})] }), jsxs("span", { className: "label", children: [jsx(Fragment$1, { children: children }), " ", isRequired && "(required)"] })] })) }));
|
|
19889
|
+
return (jsx($bc237834342dbd75$export$48513f6b9f8ce62d, { className: "bcds-react-aria-Checkbox", value: value, ...props, children: ({ isRequired, isSelected, isIndeterminate }) => (jsxs(Fragment$1, { children: [jsxs("div", { className: "checkbox", children: [isSelected && !isIndeterminate && jsx(SvgCheckIcon, {}), isIndeterminate && jsx(SvgDashIcon$1, {})] }), jsxs("span", { className: "label", children: [jsx(Fragment$1, { children: children }), " ", isRequired && "(required)"] })] })) }));
|
|
17897
19890
|
}
|
|
17898
19891
|
|
|
17899
|
-
var css_248z$
|
|
17900
|
-
styleInject(css_248z$
|
|
19892
|
+
var css_248z$k = ".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";
|
|
19893
|
+
styleInject(css_248z$k);
|
|
17901
19894
|
|
|
17902
19895
|
function CheckboxGroup({ orientation = "vertical", label, description, errorMessage, flexWrap = "nowrap", children, ...props }) {
|
|
17903
19896
|
return (jsx($bc237834342dbd75$export$4aa08d5625cb8ead, { className: `bcds-react-aria-CheckboxGroup`, ...props, children: ({ isRequired, isInvalid }) => (jsxs(Fragment$1, { 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$1, { 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 })] }))] })) }));
|
|
17904
19897
|
}
|
|
17905
19898
|
|
|
17906
|
-
var css_248z$
|
|
17907
|
-
styleInject(css_248z$
|
|
19899
|
+
var css_248z$j = ".bcds-react-aria-Dialog {\n display: flex;\n flex-direction: column;\n min-height: var(--layout-margin-xxxlarge);\n}\n\n.bcds-react-aria-Dialog--Container {\n position: relative;\n}\n\n/* Close icon */\n.bcds-react-aria-Dialog--closeIcon {\n color: var(--icons-color-primary);\n position: absolute;\n top: 0;\n right: 0;\n padding: var(--layout-padding-small);\n}\n.bcds-react-aria-Dialog--closeIcon > svg {\n min-width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n";
|
|
19900
|
+
styleInject(css_248z$j);
|
|
17908
19901
|
|
|
17909
19902
|
function Dialog({ isCloseable = true, role = "dialog", children, ...props }) {
|
|
17910
19903
|
return (jsx($de32f1b87079253c$export$3ddf2d174ce01153, { className: "bcds-react-aria-Dialog", role: role, ...props, children: ({ close }) => (jsx(Fragment$1, { children: jsxs("div", { className: "bcds-react-aria-Dialog--Container", children: [isCloseable && (jsx("span", { className: "bcds-react-aria-Dialog--closeIcon", children: jsx(Button, { variant: "tertiary", isIconButton: true, size: "small", "aria-label": "Close", type: "button", onPress: close, children: jsx(SvgCloseIcon, {}) }) })), jsx(Fragment$1, { children: children })] }) })) }));
|
|
17911
19904
|
}
|
|
17912
19905
|
|
|
17913
|
-
var css_248z$
|
|
17914
|
-
styleInject(css_248z$
|
|
19906
|
+
var css_248z$i = ".bcds-bc-logo--whiteFill {\n fill: #ffffff;\n stroke-width: 0px;\n}\n\n.bcds-bc-logo--blueFill {\n fill: #234075;\n stroke-width: 0px;\n}\n\n.bcds-bc-logo--goldFill {\n fill: #e3a82b;\n stroke-width: 0px;\n}\n\n.bcds-bc-logo--noFill {\n fill: none;\n stroke-width: 0px;\n}\n";
|
|
19907
|
+
styleInject(css_248z$i);
|
|
17915
19908
|
|
|
17916
19909
|
function SvgBcLogo({ id = "bcgov-logo" }) {
|
|
17917
19910
|
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", className: "bcds-bc-logo--whiteFill" }), jsxs("g", { children: [jsxs("g", { children: [jsx("rect", { x: "415.4", y: "252.98", width: "314.66", height: "3.82", className: "bcds-bc-logo--goldFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" }), 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", className: "bcds-bc-logo--blueFill" })] }), jsx("rect", { width: "847.65", height: "327.01", className: "bcds-bc-logo--noFill" })] }), jsxs("g", { children: [jsx("polygon", { points: "295.89 176.17 301.27 178.4 313.19 170.08 295.89 176.17", className: "bcds-bc-logo--goldFill" }), 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", className: "bcds-bc-logo--goldFill" })] }), 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", className: "bcds-bc-logo--blueFill" })] })] }));
|
|
17918
19911
|
}
|
|
17919
19912
|
|
|
17920
|
-
var css_248z$
|
|
17921
|
-
styleInject(css_248z$
|
|
19913
|
+
var css_248z$h = ".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";
|
|
19914
|
+
styleInject(css_248z$h);
|
|
17922
19915
|
|
|
17923
19916
|
/**
|
|
17924
19917
|
* A titled list of links for use in the Footer. Rendered inside a `<figure>`
|
|
@@ -17972,8 +19965,8 @@ function Form({ ...props }) {
|
|
|
17972
19965
|
return jsx($d3e0e05bdfcf66bd$export$a7fed597f4b8afd8, { ...props });
|
|
17973
19966
|
}
|
|
17974
19967
|
|
|
17975
|
-
var css_248z$
|
|
17976
|
-
styleInject(css_248z$
|
|
19968
|
+
var css_248z$g = ".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";
|
|
19969
|
+
styleInject(css_248z$g);
|
|
17977
19970
|
|
|
17978
19971
|
function Header({ children, logoLinkElement, logoImage = jsx(SvgBcLogo, { id: "bcgov-logo-header" }), skipLinks, title = "", titleElement = "span", }) {
|
|
17979
19972
|
function getLogo() {
|
|
@@ -18011,15 +20004,15 @@ function Header({ children, logoLinkElement, logoImage = jsx(SvgBcLogo, { id: "b
|
|
|
18011
20004
|
}) })), title && (jsxs(Fragment$1, { children: [jsx("div", { className: "bcds-header--line" }), getTitle()] })), children] }) }));
|
|
18012
20005
|
}
|
|
18013
20006
|
|
|
18014
|
-
var css_248z$
|
|
18015
|
-
styleInject(css_248z$
|
|
20007
|
+
var css_248z$f = "/* Headings */\nh1.bcds-react-aria-Heading {\n font: var(--typography-bold-h1);\n}\n\nh2.bcds-react-aria-Heading {\n font: var(--typography-bold-h2);\n}\n\nh3.bcds-react-aria-Heading {\n font: var(--typography-bold-h3);\n}\n\nh4.bcds-react-aria-Heading {\n font: var(--typography-bold-h4);\n}\n\nh5.bcds-react-aria-Heading {\n font: var(--typography-bold-h5);\n}\n\nh6.bcds-react-aria-Heading {\n font: var(--typography-bold-h6);\n}\n\n/* Text colour */\n.bcds-react-aria-Heading.primary {\n color: var(--typography-color-primary);\n}\n.bcds-react-aria-Heading.primaryInvert {\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Heading.secondary {\n color: var(--typography-color-secondary);\n}\n.bcds-react-aria-Heading.secondaryInvert {\n color: var(--typography-color-secondary-invert);\n}\n.bcds-react-aria-Heading.disabled {\n color: var(--typography-color-disabled);\n}\n.bcds-react-aria-Heading.danger {\n color: var(--typography-color-danger);\n}\n";
|
|
20008
|
+
styleInject(css_248z$f);
|
|
18016
20009
|
|
|
18017
20010
|
function Heading({ color = "primary", isUnstyled = false, ...props }) {
|
|
18018
20011
|
return (jsx($5cb03073d3f54797$export$a8a3e93435678ff9, { className: isUnstyled ? undefined : `bcds-react-aria-Heading ${color}`, ...props }));
|
|
18019
20012
|
}
|
|
18020
20013
|
|
|
18021
|
-
var css_248z$
|
|
18022
|
-
styleInject(css_248z$
|
|
20014
|
+
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";
|
|
20015
|
+
styleInject(css_248z$e);
|
|
18023
20016
|
|
|
18024
20017
|
function getIcon(variant) {
|
|
18025
20018
|
switch (variant) {
|
|
@@ -18035,12 +20028,12 @@ function getIcon(variant) {
|
|
|
18035
20028
|
return;
|
|
18036
20029
|
}
|
|
18037
20030
|
}
|
|
18038
|
-
function InlineAlert({ variant = "info", title, description, isIconHidden = false, isCloseable = false, role = "note", buttons, children, onClose, ...props }) {
|
|
18039
|
-
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$1, { 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, {}) }) }))] }));
|
|
20031
|
+
function InlineAlert({ variant = "info", title, description, isIconHidden = false, isCloseable = false, role = "note", customIcon, buttons, children, onClose, ...props }) {
|
|
20032
|
+
return (jsxs("div", { className: `bcds-Inline-Alert ${variant} ${isCloseable ? "closeable" : null}`, ...props, children: [!isIconHidden && (jsx("span", { className: "bcds-Inline-Alert--icon", children: customIcon ? customIcon : getIcon(variant) })), jsx("div", { className: "bcds-Inline-Alert--container", role: role, "aria-labelledby": "alert-title", children: children ? (children) : (jsxs(Fragment$1, { 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, {}) }) }))] }));
|
|
18040
20033
|
}
|
|
18041
20034
|
|
|
18042
|
-
var css_248z$
|
|
18043
|
-
styleInject(css_248z$
|
|
20035
|
+
var css_248z$d = ".bcds-react-aria-Link {\n color: var(--typography-color-link);\n text-decoration: underline;\n text-underline-offset: var(--layout-padding-hair);\n cursor: pointer;\n}\n\n/* Icon slots */\n.bcds-react-aria-Link--Icon {\n display: inline-flex;\n flex-direction: row;\n vertical-align: text-bottom;\n margin: var(--layout-margin-none) var(--layout-margin-xsmall);\n}\n\n/* Sizing */\n.bcds-react-aria-Link.small {\n font: var(--typography-regular-small-body);\n}\n\n.bcds-react-aria-Link.medium {\n font: var(--typography-regular-body);\n}\n\n.bcds-react-aria-Link.large {\n font: var(--typography-regular-large-body);\n}\n\n/* Placeholder large button style */\n.bcds-react-aria-Button.large {\n min-height: 40px;\n}\n\n/* Hover */\n.bcds-react-aria-Link[data-hovered] {\n color: var(--surface-color-border-active);\n}\n\n.bcds-react-aria-Link[data-hovered].danger {\n color: var(--surface-color-primary-danger-button-hover);\n}\n\n/* Selected */\n.bcds-react-aria-Link[data-current] {\n color: var(--surface-color-border-active);\n}\n\n/* Focus */\n.bcds-react-aria-Link[data-focus-visible] {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n border-radius: var(--layout-border-radius-small);\n}\n\n/* Disabled */\n.bcds-react-aria-Link[data-disabled],\n.bcds-react-aria-Link[data-disabled].danger {\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n\n/* Danger */\n.bcds-react-aria-Link.danger {\n color: var(--typography-color-danger);\n}\n";
|
|
20036
|
+
styleInject(css_248z$d);
|
|
18044
20037
|
|
|
18045
20038
|
function Link({ children, size = "medium", danger = false, isButton = false, buttonVariant = "primary", isUnstyled = false, iconLeft, iconRight, ariaLabel, ...props }) {
|
|
18046
20039
|
return (jsxs($4f118338184dc1d9$export$a6c7ac8248d6e38a, { className: !isUnstyled
|
|
@@ -18050,29 +20043,29 @@ function Link({ children, size = "medium", danger = false, isButton = false, but
|
|
|
18050
20043
|
: undefined, "aria-label": ariaLabel, ...props, children: [iconLeft && (jsx("span", { className: "bcds-react-aria-Link--Icon", children: iconLeft })), children, iconRight && (jsx("span", { className: "bcds-react-aria-Link--Icon", children: iconRight }))] }));
|
|
18051
20044
|
}
|
|
18052
20045
|
|
|
18053
|
-
var css_248z$
|
|
18054
|
-
styleInject(css_248z$
|
|
20046
|
+
var css_248z$c = "/* Styles for overlay element */\n.react-aria-ModalOverlay:has(.bcds-react-aria-Modal) {\n position: fixed;\n inset: 0;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n gap: var(--layout-margin-small);\n background: var(--surface-color-overlay-default);\n height: 100vh;\n width: 100vw;\n z-index: 1000;\n}\n.react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-entering] {\n animation: modal-fade 200ms;\n}\n.react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-exiting] {\n animation: modal-fade 150ms reverse ease-in;\n}\n@media (prefers-reduced-motion) {\n /* Don't animate modal fade in/out if prefers-reduced-motion is on */\n .react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-entering] {\n animation: unset;\n }\n .react-aria-ModalOverlay:has(.bcds-react-aria-Modal)[data-exiting] {\n animation: unset;\n }\n}\n\n@keyframes modal-fade {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n/* Styles for content container */\n.bcds-react-aria-Modal {\n box-sizing: border-box;\n max-width: 100vw;\n width: 600px;\n max-height: 100vh;\n min-height: var(--layout-margin-xxxlarge);\n height: auto;\n margin: var(--layout-margin-large);\n border-radius: var(--layout-border-radius-medium);\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n background: var(--surface-color-forms-default);\n box-shadow: var(--surface-shadow-large);\n}\n";
|
|
20047
|
+
styleInject(css_248z$c);
|
|
18055
20048
|
|
|
18056
20049
|
function Modal({ children, ...props }) {
|
|
18057
20050
|
return (jsx($f3f84453ead64de5$export$2b77a92f1a5ad772, { className: "bcds-react-aria-Modal", ...props, children: children }));
|
|
18058
20051
|
}
|
|
18059
20052
|
|
|
18060
|
-
var css_248z$
|
|
18061
|
-
styleInject(css_248z$
|
|
20053
|
+
var css_248z$b = ".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";
|
|
20054
|
+
styleInject(css_248z$b);
|
|
18062
20055
|
|
|
18063
20056
|
function Radio({ value, children, ...props }) {
|
|
18064
20057
|
return (jsx($b6c3ddc6086f204d$export$d7b12c4107be0d61, { className: "bcds-react-aria-Radio", value: value, ...props, children: children }));
|
|
18065
20058
|
}
|
|
18066
20059
|
|
|
18067
|
-
var css_248z$
|
|
18068
|
-
styleInject(css_248z$
|
|
20060
|
+
var css_248z$a = ".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";
|
|
20061
|
+
styleInject(css_248z$a);
|
|
18069
20062
|
|
|
18070
20063
|
function RadioGroup({ orientation = "vertical", label, description, children, errorMessage, flexWrap = "nowrap", ...props }) {
|
|
18071
20064
|
return (jsx($b6c3ddc6086f204d$export$a98f0dcb43a68a25, { className: "bcds-react-aria-RadioGroup", ...props, children: ({ isRequired, isInvalid }) => (jsxs(Fragment$1, { 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 })] }))] })) }));
|
|
18072
20065
|
}
|
|
18073
20066
|
|
|
18074
|
-
var css_248z$
|
|
18075
|
-
styleInject(css_248z$
|
|
20067
|
+
var css_248z$9 = ".bcds-react-aria-Select {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\n max-width: -moz-available;\n max-width: -webkit-fill-available;\n}\n\n/* Label above select input */\n.bcds-react-aria-Select--Label {\n color: var(--typography-color-secondary);\n font: var(--typography-regular-small-body);\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n.bcds-react-aria-Select[data-disabled] > .bcds-react-aria-Select--Label {\n color: var(--typography-color-disabled);\n}\n\n/* Text description below select input */\n.bcds-react-aria-Select--Description {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n/* Error message */\n.bcds-react-aria-Select--Error {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n\n/* Error icon */\n.bcds-react-aria-Select[data-invalid]\n > .bcds-react-aria-Select--Button\n > svg:not(:last-child) {\n color: var(--icons-color-danger);\n}\n\n/* Select input equivalent */\n.bcds-react-aria-Select--Button {\n background-color: var(--surface-color-forms-default);\n border: 1px solid var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n cursor: pointer;\n display: flex;\n justify-content: space-between;\n gap: var(--layout-margin-small);\n align-items: center;\n padding: 0 12px;\n max-width: 100%;\n}\n.bcds-react-aria-Select--Button.invalid {\n border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Select[data-invalid] > .bcds-react-aria-Select--Button {\n border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Select--Button[data-disabled] {\n background-color: var(--surface-color-forms-disabled);\n cursor: not-allowed;\n}\n.bcds-react-aria-Select--Button[data-hovered] {\n border-color: var(--surface-color-border-dark);\n}\n.bcds-react-aria-Select--Button[data-focused] {\n border-color: var(--surface-color-border-active);\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n.bcds-react-aria-Select--Button[data-pressed] {\n border-color: var(--surface-color-border-active);\n}\n.bcds-react-aria-Select--Button.medium {\n height: 40px;\n}\n.bcds-react-aria-Select--Button.small {\n height: 32px;\n}\n.bcds-react-aria-Select--Button > .bcds-react-aria-SelectValue {\n font: var(--typography-regular-body);\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n min-width: 0;\n}\n.bcds-react-aria-Select--Button > svg {\n flex-shrink: 0;\n}\n\n/* Dropdown menu panel */\n.bcds-react-aria-Select--Popover {\n background-color: var(--surface-color-forms-default);\n border: 1px solid var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n box-shadow: var(--surface-shadow-medium);\n box-sizing: border-box;\n overflow-y: auto;\n padding: var(--layout-padding-hair) var(--layout-padding-xsmall);\n width: var(\n --trigger-width\n ); /* Variable provided by Select component https://react-spectrum.adobe.com/react-aria/Select.html#popover-1 */\n}\n.bcds-react-aria-Select--ListBox[data-focused] {\n outline: none;\n}\n.bcds-react-aria-Select--ListBox > .bcds-react-aria-Section:not(:first-child) {\n border-top: 1px solid var(--surface-color-border-default);\n margin-top: 1px;\n padding-top: 2px;\n}\n\n/* Header label within Section of multi-section Select */\n.bcds-react-aria-Select--Header {\n color: var(--typography-color-secondary);\n font: var(--typography-regular-small-body);\n padding: var(--layout-padding-hair) var(--layout-padding-small);\n}\n\n/* ListBox option item */\n.bcds-react-aria-Select--ListBoxItem {\n border-radius: var(--layout-border-radius-medium);\n cursor: pointer;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-margin-small);\n padding: var(--layout-padding-small);\n}\n.bcds-react-aria-Select--ListBoxItem[data-focused],\n.bcds-react-aria-Select--ListBoxItem[data-hovered] {\n background-color: var(--surface-color-secondary-button-hover);\n outline: none;\n}\n.bcds-react-aria-Select--ListBoxItem-icon {\n display: flex;\n align-items: center;\n justify-content: space-around;\n /* This `min-width` rule can cause horizontal overflow on very narrow Select\n instances, but if we leave it out, the icons will shrink instead. */\n min-width: 20px;\n}\n.bcds-react-aria-Select--ListBoxItem-Text-container {\n color: var(--typography-color-primary);\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n}\n.bcds-react-aria-Select--ListBoxItem-Text-label {\n font: var(--typography-regular-body);\n}\n.bcds-react-aria-Select--ListBoxItem.destructive {\n color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Select--ListBoxItem.destructive\n .bcds-react-aria-Select--ListBoxItem-Text-label {\n color: var(--surface-color-primary-danger-button-default);\n}\n.bcds-react-aria-Select--ListBoxItem-Text-description {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n}\n";
|
|
20068
|
+
styleInject(css_248z$9);
|
|
18076
20069
|
|
|
18077
20070
|
/** Select displays a collapsible list of options and allows a user to select one of them. */
|
|
18078
20071
|
function Select({ items, sections, label, description, placeholder, size = "medium", errorMessage, ...props }) {
|
|
@@ -18098,45 +20091,63 @@ function SvgBcOutlineIcon({ id = "bc-outline-icon" }) {
|
|
|
18098
20091
|
return (jsx("svg", { id: id, xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 18 18", fill: "currentColor", children: jsxs("g", { children: [jsx("path", { d: "M8.55494 17.9955C8.48489 17.9953 8.4157 17.9801 8.35199 17.951C8.28827 17.9219 8.23149 17.8795 8.18543 17.8268L7.40648 16.9832L6.22541 16.0636L5.199 15.4961C5.11007 15.4438 5.03665 15.3688 4.98625 15.2788C4.93585 15.1887 4.91028 15.0869 4.91217 14.9838V13.6103C4.90822 13.4748 4.9534 13.3423 5.03939 13.2374C5.12538 13.1325 5.24638 13.0622 5.3801 13.0395L5.90315 12.9832C5.85315 12.9105 5.81957 12.8278 5.80473 12.7408L5.47065 10.7162L4.85199 9.65994C4.77992 9.54214 4.75071 9.40308 4.76932 9.26624L5.06009 7.19318L4.03761 6.7708C3.97024 6.74182 3.90941 6.69953 3.85878 6.64647C3.80814 6.59342 3.76873 6.53069 3.74291 6.46204L2.8481 4.13645L2.06072 4.06615C1.97763 4.05479 1.89849 4.02362 1.82998 3.97527C1.76146 3.92691 1.70557 3.86279 1.66703 3.78831L0.0922668 0.863752C0.0326295 0.767506 0.000706201 0.65667 1.15824e-05 0.543447C-0.000683036 0.430224 0.0298779 0.319005 0.0883299 0.222035C0.14711 0.132622 0.233402 0.0647766 0.33416 0.0287553C0.434919 -0.00726609 0.544665 -0.00950484 0.646809 0.0223775C0.717673 0.042062 7.83223 2.31085 11.7298 1.5634C11.7994 1.5514 11.8709 1.55502 11.9389 1.57398C12.007 1.59295 12.0701 1.62679 12.1235 1.67307C12.2388 1.77389 12.3119 1.91446 12.3282 2.06676L13.0245 9.77692L13.6994 10.2111C13.7984 10.2792 13.8741 10.3762 13.9159 10.4889L14.1836 11.2324L15.3647 11.7251C15.4523 11.7653 15.5285 11.8268 15.5862 11.904C15.6439 11.9812 15.6812 12.0717 15.6948 12.1672L15.8326 13.0749L16.5131 13.5249C16.5697 13.5613 16.6179 13.6092 16.6549 13.6655L17.8922 15.4179C17.9503 15.5022 17.9865 15.5996 17.9975 15.7013C18.0085 15.803 17.9939 15.9059 17.9552 16.0006C17.9216 16.0925 17.8628 16.1731 17.7857 16.2333C17.7085 16.2934 17.616 16.3307 17.5187 16.3409L10.2529 16.9123C10.2067 17.0062 10.136 17.0859 10.0482 17.1429L8.81084 17.9252C8.73397 17.9725 8.64519 17.9969 8.55494 17.9955ZM5.97851 14.6356L6.76589 15.0619C6.79052 15.0739 6.81311 15.0896 6.83282 15.1086L8.07014 16.0827L8.13706 16.139L8.65224 16.7098L9.43962 16.2211L9.11342 15.5642L8.32604 14.8893L7.08872 14.0367L5.96389 14.1581L5.97851 14.6356ZM7.22539 12.8595C7.32381 12.8587 7.42002 12.8888 7.50041 12.9456L8.91601 13.9197L8.96719 13.959L9.85187 14.7414C9.91189 14.7939 9.95904 14.8595 9.98966 14.9331L10.3834 15.7588L16.4957 15.2768L15.9136 14.4551L15.1262 13.923C15.0604 13.8776 15.0044 13.8193 14.9618 13.7517C14.9191 13.684 14.8907 13.6084 14.8782 13.5294L14.7522 12.6857L13.6156 12.2161C13.5437 12.1851 13.4791 12.1395 13.4256 12.0823C13.3722 12.0251 13.3312 11.9575 13.3051 11.8837L13.0183 11.1014L12.2826 10.6166C12.2115 10.567 12.1521 10.5025 12.1085 10.4274C12.065 10.3524 12.0384 10.2688 12.0307 10.1824L11.3631 2.78271C8.21693 3.17641 3.76484 2.09432 1.6136 1.48916L2.40098 2.94413L3.24461 3.01837C3.34242 3.03086 3.43481 3.07037 3.5114 3.13246C3.588 3.19455 3.64577 3.27677 3.67823 3.36988L4.61015 5.78826L5.83341 6.27307C5.94925 6.32592 6.04441 6.41555 6.10411 6.52802C6.1638 6.6405 6.1847 6.76953 6.16355 6.8951L5.83341 9.20719L6.42844 10.192C6.46921 10.2576 6.49601 10.3309 6.50718 10.4074L6.86094 12.5513C6.8826 12.6703 6.8675 12.7932 6.81764 12.9034L7.18321 12.8601L7.22539 12.8595Z", fill: "currentColor" }), jsx("path", { d: "M4.04436 12.2499C3.95082 12.2486 3.8594 12.2218 3.78006 12.1722C3.70073 12.1226 3.63652 12.0522 3.59443 11.9687L2.23676 9.43722C2.19774 9.36465 2.17379 9.28495 2.16634 9.20289C2.1589 9.12084 2.16812 9.03813 2.19345 8.95973C2.21557 8.8832 2.2541 8.81242 2.30636 8.7523C2.35861 8.69218 2.42334 8.64416 2.49603 8.61159L3.4004 8.2179C3.46575 8.19146 3.53591 8.17896 3.60637 8.1812C3.67684 8.18345 3.74606 8.20039 3.80959 8.23094C3.87313 8.26149 3.92959 8.30498 3.97534 8.35862C4.02109 8.41225 4.05514 8.47486 4.0753 8.54241C4.12772 8.68078 4.12656 8.83374 4.07204 8.97129C4.01752 9.10884 3.91357 9.22106 3.78059 9.28593L3.44314 9.43047L4.48923 11.3866C4.56015 11.5165 4.58089 11.6679 4.54751 11.8122C4.51412 11.9564 4.42894 12.0833 4.30814 12.1689C4.23031 12.2217 4.13841 12.2499 4.04436 12.2499Z", fill: "currentColor" })] }) }));
|
|
18099
20092
|
}
|
|
18100
20093
|
|
|
18101
|
-
/*
|
|
20094
|
+
/* This component implements the Flask icon from Font Awesome: https://fontawesome.com/icons/flask */
|
|
18102
20095
|
function SvgBetaIcon({ id = "beta-icon" }) {
|
|
18103
20096
|
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 448 512", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M288 0L160 0 128 0C110.3 0 96 14.3 96 32s14.3 32 32 32l0 132.8c0 11.8-3.3 23.5-9.5 33.5L10.3 406.2C3.6 417.2 0 429.7 0 442.6C0 480.9 31.1 512 69.4 512l309.2 0c38.3 0 69.4-31.1 69.4-69.4c0-12.8-3.6-25.4-10.3-36.4L329.5 230.4c-6.2-10.1-9.5-21.7-9.5-33.5L320 64c17.7 0 32-14.3 32-32s-14.3-32-32-32L288 0zM192 196.8L192 64l64 0 0 132.8c0 23.7 6.6 46.9 19 67.1L309.5 320l-171 0L173 263.9c12.4-20.2 19-43.4 19-67.1z", fill: "currentColor" }) }) }));
|
|
18104
20097
|
}
|
|
18105
20098
|
|
|
20099
|
+
/* This component implements the Minus icon from Font Awesome: https://fontawesome.com/icons/minus */
|
|
20100
|
+
function SvgDashIcon({ id = "dash-icon" }) {
|
|
20101
|
+
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 640 640", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M96 320C96 302.3 110.3 288 128 288L512 288C529.7 288 544 302.3 544 320C544 337.7 529.7 352 512 352L128 352C110.3 352 96 337.7 96 320z", fill: "currentColor" }) }));
|
|
20102
|
+
}
|
|
20103
|
+
|
|
20104
|
+
/* This component implements the Plus icon from Font Awesome: https://fontawesome.com/icons/plus */
|
|
20105
|
+
function SvgPlusIcon({ id = "plus-icon" }) {
|
|
20106
|
+
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "0 0 640 640", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M352 128C352 110.3 337.7 96 320 96C302.3 96 288 110.3 288 128L288 288L128 288C110.3 288 96 302.3 96 320C96 337.7 110.3 352 128 352L288 352L288 512C288 529.7 302.3 544 320 544C337.7 544 352 529.7 352 512L352 352L512 352C529.7 352 544 337.7 544 320C544 302.3 529.7 288 512 288L352 288L352 128z", fill: "currentColor" }) }));
|
|
20107
|
+
}
|
|
20108
|
+
|
|
18106
20109
|
function SvgTooltipArrowUp({ id = "tooltip-arrow" }) {
|
|
18107
20110
|
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" }) }) }));
|
|
18108
20111
|
}
|
|
18109
20112
|
|
|
18110
|
-
|
|
18111
|
-
|
|
20113
|
+
function SvgUpRightFromSquareIcon({ size = 20, id, }) {
|
|
20114
|
+
return (jsx("svg", { id: id, width: size, height: size, viewBox: "0 0 512 512", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M290.4 19.8C295.4 7.8 307.1 0 320 0L480 0c17.7 0 32 14.3 32 32l0 160c0 12.9-7.8 24.6-19.8 29.6s-25.7 2.2-34.9-6.9L400 157.3 246.6 310.6c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L354.7 112 297.4 54.6c-9.2-9.2-11.9-22.9-6.9-34.9zM0 176c0-44.2 35.8-80 80-80l80 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-80 0c-8.8 0-16 7.2-16 16l0 256c0 8.8 7.2 16 16 16l256 0c8.8 0 16-7.2 16-16l0-80c0-17.7 14.3-32 32-32s32 14.3 32 32l0 80c0 44.2-35.8 80-80 80L80 512c-44.2 0-80-35.8-80-80L0 176z", fill: "currentColor" }) }) }));
|
|
20115
|
+
}
|
|
20116
|
+
|
|
20117
|
+
function SvgReactAriaIcon({ id = "react-aria-icon" }) {
|
|
20118
|
+
return (jsx("svg", { id: id, width: "20", height: "20", viewBox: "200 206 800 790", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { children: jsx("path", { d: "M720.67 205.995C867.583 205.995 986.679 325.091 986.68 472.003C986.68 590.753 908.865 691.325 801.446 725.521L979.312 948.055C994.438 966.98 980.963 995 956.736 995H795.612C778.743 995 762.715 987.629 751.734 974.823L697.365 911.421L493.126 653.39C457.134 607.918 489.518 540.979 547.511 540.977L720.67 540.971C758.758 540.971 789.635 510.091 789.635 472.003C789.634 433.915 758.758 403.038 720.67 403.038H429.939C404.955 403.038 388.623 391.886 373.994 373.623L277.349 252.966C262.194 234.045 275.664 205.996 299.905 205.995H720.67Z M396.605 720.706C407.798 705.406 430.443 704.843 442.381 719.568L503.816 797.018H502.786L535.569 838.934C548.074 854.358 549.943 877.191 538.047 893.09L476.638 972.545C465.692 986.707 448.803 995 430.903 995H242.276C218.18 995 204.665 967.248 219.523 948.278L337.992 797.018H337.923L396.605 720.706Z", fill: "#7F57FF" }) }) }));
|
|
20119
|
+
}
|
|
20120
|
+
|
|
20121
|
+
var css_248z$8 = ".bcds-react-aria-Tag {\n color: var(--typography-color-primary);\n cursor: pointer;\n border: var(--layout-border-width-small) solid;\n display: flex;\n align-items: center;\n font: var(--typography-regular-label);\n width: fit-content;\n}\n.bcds-react-aria-Tag .react-aria-Button {\n background: none;\n border: none;\n color: var(--typography-color-primary);\n cursor: pointer;\n display: flex;\n margin: 0;\n padding: 0;\n}\n\n/* Tag colors */\n.bcds-react-aria-Tag.bc-blue {\n background-color: var(--theme-primary-blue);\n border-color: var(--theme-blue-90);\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.bc-blue .react-aria-Button {\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.bc-gold {\n background-color: var(--theme-primary-gold);\n border-color: var(--theme-blue-90);\n}\n.bcds-react-aria-Tag.blue {\n background-color: var(--support-surface-color-info);\n border-color: var(--support-border-color-info);\n}\n.bcds-react-aria-Tag.dark {\n background: var(--theme-gray-110);\n border-color: var(--theme-blue-90);\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.dark .react-aria-Button {\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Tag.gray,\n.bcds-react-aria-Tag.grey {\n background-color: var(--theme-gray-20);\n border-color: var(--surface-color-border-dark);\n}\n.bcds-react-aria-Tag.green {\n background-color: var(--support-surface-color-success);\n border-color: var(--support-border-color-success);\n}\n.bcds-react-aria-Tag.red {\n background-color: var(--support-surface-color-danger);\n border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-Tag.yellow {\n background-color: var(--support-surface-color-warning);\n border-color: var(--support-border-color-warning);\n}\n\n/* Tag style */\n.bcds-react-aria-Tag.rectangular {\n border-radius: var(--layout-border-radius-small);\n}\n.bcds-react-aria-Tag.circular {\n border-radius: var(--layout-borderRadius-Circular, 9999px);\n}\n\n/* Tag size */\n.bcds-react-aria-Tag.medium {\n height: var(--layout-padding-xlarge);\n padding: var(--layout-padding-hair) var(--layout-padding-medium);\n gap: var(--layout-margin-medium);\n}\n.bcds-react-aria-Tag.small {\n height: var(--layout-padding-large);\n padding: var(--layout-padding-hair) var(--layout-padding-small);\n gap: var(--layout-margin-small);\n}\n\n/* Selected */\n.bcds-react-aria-Tag[data-selected] {\n border-radius: var(--layout-border-radius-small);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-active);\n}\n\n/* Focused */\n.bcds-react-aria-Tag[data-focused] {\n outline: var(--layout-border-width-medium) solid\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Disabled */\n.bcds-react-aria-Tag[data-disabled] {\n background-color: var(--surface-color-primary-button-disabled);\n border-color: var(--surface-color-border-default);\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n";
|
|
20122
|
+
styleInject(css_248z$8);
|
|
18112
20123
|
|
|
18113
20124
|
function Tag({ color = "blue", tagStyle = "rectangular", size = "small", icon, id, textValue, }) {
|
|
18114
20125
|
return (jsx($eaf9e70818b436db$export$3288d34c523a1192, { className: `bcds-react-aria-Tag ${color} ${tagStyle} ${size}`, id: id, textValue: textValue, children: ({ allowsRemoving, isDisabled }) => (jsxs(Fragment$1, { children: [icon, textValue, !isDisabled && allowsRemoving && (jsx($d2b4bc8c273e7be6$export$353f5b6fc5456de1, { "aria-label": `Remove ${textValue}`, slot: "remove", children: jsx("svg", { width: "14", height: "15", viewBox: "0 0 14 15", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("g", { id: "Icons / Close", children: jsx("path", { id: "Vector", d: "M12.6004 3.03239L11.4684 1.90039L7.00039 6.36839L2.53239 1.90039L1.40039 3.03239L5.86839 7.50039L1.40039 11.9684L2.53239 13.1004L7.00039 8.63239L11.4684 13.1004L12.6004 11.9684L8.13239 7.50039L12.6004 3.03239Z", fill: "currentColor" }) }) }) }))] })) }));
|
|
18115
20126
|
}
|
|
18116
20127
|
|
|
18117
|
-
var css_248z$
|
|
18118
|
-
styleInject(css_248z$
|
|
20128
|
+
var css_248z$7 = ".bcds-react-aria-TagGroup {\n color: var(--typography-color-primary);\n font: var(--typography-regular-small-body);\n}\n\n.bcds-react-aria-TagGroup--Label,\n.bcds-react-aria-TagGroup--Text-description,\n.bcds-react-aria-TagGroup--Text-error {\n display: block;\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n.bcds-react-aria-TagGroup--Text-error {\n display: flex;\n color: var(--typography-color-danger);\n}\n\n.bcds-react-aria-TagGroup--Text-error > svg {\n padding-right: var(--layout-padding-xsmall);\n color: var(--icons-color-danger);\n min-width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n";
|
|
20129
|
+
styleInject(css_248z$7);
|
|
18119
20130
|
|
|
18120
20131
|
function TagGroup({ children, label, description, errorMessage, ...props }) {
|
|
18121
20132
|
return (jsxs($eaf9e70818b436db$export$67ea30858aaf75e3, { className: "bcds-react-aria-TagGroup", ...props, children: [label && (jsx($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-TagGroup--Label", children: label })), children, description && (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: "bcds-react-aria-TagGroup--Text-description", children: description })), errorMessage && (jsxs($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "errorMessage", className: "bcds-react-aria-TagGroup--Text-error", children: [jsx(SvgExclamationIcon, {}), errorMessage] }))] }));
|
|
18122
20133
|
}
|
|
18123
20134
|
|
|
18124
|
-
var css_248z$
|
|
18125
|
-
styleInject(css_248z$
|
|
20135
|
+
var css_248z$6 = ".bcds-react-aria-TagList {\n display: flex;\n flex-wrap: wrap;\n gap: var(--layout-padding-small);\n width: fit-content;\n}\n\n.bcds-react-aria-TagList.horizontal {\n flex-direction: row;\n}\n\n.bcds-react-aria-TagList.vertical {\n flex-direction: column;\n}\n";
|
|
20136
|
+
styleInject(css_248z$6);
|
|
18126
20137
|
|
|
18127
20138
|
function TagList({ items, orientation = "horizontal", renderEmptyState, ...props }) {
|
|
18128
20139
|
return (jsx($eaf9e70818b436db$export$f9fef0f55402315b, { className: `bcds-react-aria-TagList ${orientation}`, ...props, renderEmptyState: renderEmptyState, items: items, children: (item) => createElement(Tag, { ...item, key: item.id }) }));
|
|
18129
20140
|
}
|
|
18130
20141
|
|
|
18131
|
-
var css_248z$
|
|
18132
|
-
styleInject(css_248z$
|
|
20142
|
+
var css_248z$5 = "/* Medium size (default) */\n.bcds-react-aria-Text.medium {\n font: var(--typography-regular-body);\n}\n\n.bcds-react-aria-Text.medium b,\n.bcds-react-aria-Text.medium strong {\n font: var(--typography-bold-body);\n}\n\n.bcds-react-aria-Text.medium i,\n.bcds-react-aria-Text.medium em {\n font: var(--typography-italic-body);\n}\n\n/* Small size */\n.bcds-react-aria-Text.small {\n font: var(--typography-regular-small-body);\n}\n\n.bcds-react-aria-Text.small b,\n.bcds-react-aria-Text.small strong {\n font: var(--typography-bold-small-body);\n}\n\n.bcds-react-aria-Text.small i,\n.bcds-react-aria-Text.small em {\n font: var(--typography-italic-small-body);\n}\n\n/* Large size */\n.bcds-react-aria-Text.large {\n font: var(--typography-regular-large-body);\n}\n\n.bcds-react-aria-Text.large b,\n.bcds-react-aria-Text.large strong {\n font: var(--typography-bold-large-body);\n}\n\n.bcds-react-aria-Text.large i,\n.bcds-react-aria-Text.large em {\n font: var(--typography-italic-large-body);\n}\n\n/* Text color */\n.bcds-react-aria-Text.primary {\n color: var(--typography-color-primary);\n}\n.bcds-react-aria-Text.primaryInvert {\n color: var(--typography-color-primary-invert);\n}\n.bcds-react-aria-Text.secondary {\n color: var(--typography-color-secondary);\n}\n.bcds-react-aria-Text.secondaryInvert {\n color: var(--typography-color-secondary-invert);\n}\n.bcds-react-aria-Text.disabled {\n color: var(--typography-color-disabled);\n}\n.bcds-react-aria-Text.danger {\n color: var(--typography-color-danger);\n}\n";
|
|
20143
|
+
styleInject(css_248z$5);
|
|
18133
20144
|
|
|
18134
20145
|
function Text({ elementType = "span", size = "medium", color = "primary", isUnstyled = false, ...props }) {
|
|
18135
20146
|
return (jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { elementType: elementType, className: isUnstyled ? undefined : `bcds-react-aria-Text ${size} ${color}`, ...props, children: props.children }));
|
|
18136
20147
|
}
|
|
18137
20148
|
|
|
18138
|
-
var css_248z$
|
|
18139
|
-
styleInject(css_248z$
|
|
20149
|
+
var css_248z$4 = ".bcds-react-aria-TextArea {\n display: inline-flex;\n flex-direction: column;\n /* Hacks for `stretch`: https://caniuse.com/mdn-css_properties_max-width_stretch */\n align-self: stretch;\n max-width: -moz-available;\n max-width: -webkit-fill-available;\n}\n\n/* Styles for the text label above the input field */\n.bcds-react-aria-TextArea--Label {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-primary);\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n}\n\n/* Styles for the description and character count slot below the input field */\n.bcds-react-aria-TextArea--Description {\n display: grid;\n gap: var(--layout-margin-medium);\n padding: var(--layout-padding-xsmall) var(--layout-padding-none);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n}\n\n/* Description label */\n.bcds-react-aria-TextArea--Description > .text {\n justify-self: flex-start;\n grid-row: 1;\n}\n\n/* Character counter */\n.bcds-react-aria-TextArea--Description > .counter {\n justify-self: flex-end;\n grid-row: 1;\n}\n\n/* Styles for the input field container */\n.bcds-react-aria-TextArea--Container {\n color: var(--typography-color-primary);\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--layout-margin-small);\n background: var(--surface-color-forms-default);\n box-sizing: border-box;\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-medium);\n padding: var(--layout-padding-small) 12px;\n}\n\n/* Text input field */\n.bcds-react-aria-TextArea--Input {\n font: var(--typography-regular-body);\n padding: var(--layout-padding-none);\n color: var(--typography-color-primary);\n border: none;\n flex-grow: 1;\n}\n\n.bcds-rect-aria-TextArea--Input::placeholder {\n color: var(--typography-color-placeholder);\n}\n\n/* Hover and focus states */\n.bcds-react-aria-TextArea--Container\n > .bcds-react-aria-TextArea--Input[data-focused] {\n outline: none;\n}\n\n.bcds-react-aria-TextArea--Container:focus-within {\n border-radius: var(--layout-border-radius-large);\n border: var(--layout-border-width-small) solid\n var(--surface-color-border-active);\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n.bcds-react-aria-TextArea--Container:hover {\n border-color: var(--surface-color-border-dark);\n}\n\n/* Disabled and invalid states */\n.bcds-react-aria-TextArea[data-disabled] > .bcds-react-aria-TextArea--Container,\n.bcds-react-aria-TextArea[data-disabled] .bcds-react-aria-TextArea--Input {\n background: var(--surface-color-forms-disabled);\n color: var(--typography-color-placeholder);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-TextArea[data-invalid] > .bcds-react-aria-TextArea--Container {\n border-radius: var(--layout-border-radius-medium);\n border: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n background: var(--surface-color-forms-default);\n}\n\n.bcds-react-aria-TextArea[data-readonly] > .bcds-react-aria-TextArea--Container,\n.bcds-react-aria-TextArea[data-readonly] .bcds-react-aria-TextArea--Input {\n background: var(--surface-color-forms-disabled);\n}\n\n/* Styles for the error message slot */\n.bcds-react-aria-TextArea--Error {\n display: flex;\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n\n.bcds-react-aria-TextArea--Error > svg {\n padding-right: var(--layout-padding-xsmall);\n color: var(--icons-color-danger);\n width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n}\n";
|
|
20150
|
+
styleInject(css_248z$4);
|
|
18140
20151
|
|
|
18141
20152
|
function TextArea({ label, description, errorMessage, maxLength, onChange, value, ...props }) {
|
|
18142
20153
|
// handler for character counter, displayed when a maxLength is set
|
|
@@ -18149,26 +20160,33 @@ function TextArea({ label, description, errorMessage, maxLength, onChange, value
|
|
|
18149
20160
|
return (jsx($bcdf0525bf22703d$export$2c73285ae9390cec, { className: `bcds-react-aria-TextArea`, ...props, children: ({ isRequired, isInvalid }) => (jsxs(Fragment$1, { 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 })] }))] })) }));
|
|
18150
20161
|
}
|
|
18151
20162
|
|
|
18152
|
-
var css_248z$
|
|
18153
|
-
styleInject(css_248z$
|
|
20163
|
+
var css_248z$3 = ".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.bcds-react-aria-TextField[data-disabled] .bcds-react-aria-TextField--Input {\n background: var(--surface-color-forms-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.bcds-react-aria-TextField[data-readonly] .bcds-react-aria-TextField--Input {\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";
|
|
20164
|
+
styleInject(css_248z$3);
|
|
18154
20165
|
|
|
18155
20166
|
function TextField({ size, label, description, errorMessage, iconLeft, iconRight, ...props }) {
|
|
18156
20167
|
return (jsx($bcdf0525bf22703d$export$2c73285ae9390cec, { className: "bcds-react-aria-TextField", ...props, children: ({ isRequired, isInvalid }) => (jsxs(Fragment$1, { 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 })] })) }));
|
|
18157
20168
|
}
|
|
18158
20169
|
|
|
18159
|
-
var css_248z$
|
|
18160
|
-
styleInject(css_248z$
|
|
20170
|
+
var css_248z$2 = ".bcds-react-aria-Switch {\n display: flex;\n align-items: center;\n gap: var(--layout-margin-small);\n font: var(--typography-regular-small-body);\n color: var(--typography-color-secondary);\n forced-color-adjust: none;\n}\n\n/* Container */\n.bcds-react-aria-Switch > .indicator {\n align-items: center;\n width: var(--layout-margin-xxlarge);\n height: var(--icons-size-medium);\n background-color: var(--surface-color-primary-disabled);\n border-radius: var(--icons-size-medium);\n transition: all 200ms;\n}\n@media (prefers-reduced-motion) {\n /* No animation on Switch container color if user has reduced motion set */\n .bcds-react-aria-Switch > .indicator {\n transition: none;\n }\n}\n\n/* Indicator */\n.bcds-react-aria-Switch > .indicator::before {\n content: \"\";\n display: block;\n box-sizing: border-box;\n width: var(--icons-size-medium);\n height: var(--icons-size-medium);\n background-color: var(--surface-color-secondary-default);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-medium);\n border-radius: var(--icons-size-small);\n transition: all 200ms;\n}\n@media (prefers-reduced-motion) {\n /* No animation on Switch circle indicator if user has reduced motion set */\n .bcds-react-aria-Switch > .indicator::before {\n transition: none;\n }\n}\n\n/* Selected */\n.bcds-react-aria-Switch[data-selected] > .indicator {\n background-color: var(--surface-color-primary-default);\n}\n\n.bcds-react-aria-Switch[data-selected] > .indicator::before {\n transform: translateX(100%);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-primary-default);\n}\n\n/* Hover */\n.bcds-react-aria-Switch[data-hovered] {\n cursor: pointer;\n}\n\n.bcds-react-aria-Switch[data-hovered][data-selected] > .indicator {\n background-color: var(--surface-color-primary-hover);\n}\n\n.bcds-react-aria-Switch[data-hovered] > .indicator::before {\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-dark);\n}\n\n.bcds-react-aria-Switch[data-hovered][data-selected] > .indicator::before {\n border: var(--layout-border-width-medium) solid\n var(--surface-color-primary-hover);\n}\n\n/* Focused */\n.bcds-react-aria-Switch[data-focus-visible] > .indicator {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Disabled */\n.bcds-react-aria-Switch[data-disabled] {\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n\n.bcds-react-aria-Switch[data-disabled] > .indicator {\n background-color: var(--surface-color-primary-disabled);\n}\n\n.bcds-react-aria-Switch[data-disabled] > .indicator::before {\n background-color: var(--theme-gray-10);\n border: var(--layout-border-width-medium) solid\n var(--surface-color-border-default);\n}\n\n/* Read only */\n.bcds-react-aria-Switch[data-readonly] {\n cursor: not-allowed;\n}\n";
|
|
20171
|
+
styleInject(css_248z$2);
|
|
18161
20172
|
|
|
18162
20173
|
function Switch({ labelPosition = "right", children, ...props }) {
|
|
18163
20174
|
return (jsxs($8e59e948500a8fe1$export$b5d5cf8927ab7262, { className: `bcds-react-aria-Switch`, ...props, children: [labelPosition === "left" && jsx(Fragment$1, { children: children }), jsx("div", { className: "indicator" }), labelPosition === "right" && jsx(Fragment$1, { children: children })] }));
|
|
18164
20175
|
}
|
|
18165
20176
|
|
|
18166
|
-
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";
|
|
18167
|
-
styleInject(css_248z);
|
|
20177
|
+
var css_248z$1 = ".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";
|
|
20178
|
+
styleInject(css_248z$1);
|
|
18168
20179
|
|
|
18169
20180
|
function Tooltip(props) {
|
|
18170
20181
|
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$1, { children: props.children })] }));
|
|
18171
20182
|
}
|
|
18172
20183
|
|
|
18173
|
-
|
|
20184
|
+
var css_248z = ".bcds-react-aria-NumberField {\n display: flex;\n flex-direction: column;\n gap: var(--layout-margin-hair);\n background-color: var(--surface-color-forms-default);\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/* Input and controls */\n.bcds-react-aria-NumberField--Group {\n display: inline-flex;\n flex-direction: row;\n align-items: center;\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}\n/* Decrement button */\n.bcds-react-aria-NumberField--Group\n > .bcds-react-aria-NumberField--Button:first-child {\n border-right: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-none);\n}\n.bcds-react-aria-NumberField--Group\n > .bcds-react-aria-NumberField--Button:first-child\n > .bcds-react-aria-Button {\n border-top-right-radius: var(--layout-border-radius-none);\n border-bottom-right-radius: var(--layout-border-radius-none);\n}\n/* Increment button */\n.bcds-react-aria-NumberField--Group\n > .bcds-react-aria-NumberField--Button:last-child {\n border-left: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-radius: var(--layout-border-radius-none);\n}\n.bcds-react-aria-NumberField--Group\n > .bcds-react-aria-NumberField--Button:last-child\n > .bcds-react-aria-Button {\n border-top-left-radius: var(--layout-border-radius-none);\n border-bottom-left-radius: var(--layout-border-radius-none);\n}\n/* Button icons */\n.bcds-react-aria-NumberField--Group > button > svg {\n color: var(--icons-color-primary);\n}\n/* Input container */\n.bcds-react-aria-NumberField--InputContainer {\n display: flex;\n flex-direction: row;\n flex: 1 1 0;\n min-width: 0;\n align-items: center;\n gap: var(--layout-margin-small);\n padding: var(--layout-padding-small) 0.75rem;\n}\n/* Input field */\n.bcds-react-aria-NumberField--Input {\n box-sizing: border-box;\n border: none;\n width: 100%;\n}\n\n/* Sizing */\n.bcds-react-aria-NumberField.medium > .bcds-react-aria-NumberField--Group {\n height: 40px;\n}\n.bcds-react-aria-NumberField.medium .bcds-react-aria-NumberField--Input {\n font: var(--typography-regular-body);\n}\n.bcds-react-aria-NumberField.small > .bcds-react-aria-NumberField--Group {\n height: 32px;\n}\n.bcds-react-aria-NumberField.small .bcds-react-aria-NumberField--Input {\n font: var(--typography-regular-small-body);\n}\n\n/* Label above the input field */\n.bcds-react-aria-NumberField--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/* \"Required\" label */\n.bcds-react-aria-NumberField--Label.required {\n color: var(--typography-color-secondary);\n padding: var(--layout-padding-small) var(--layout-padding-xsmall);\n}\n\n/* Description below the input field */\n.bcds-react-aria-NumberField--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/* Hover state */\n.bcds-react-aria-NumberField--Group[data-hovered],\n.bcds-react-aria-NumberField--Group[data-hovered][data-disabled],\n.bcds-react-aria-NumberField--Group[data-hovered]\n > .bcds-react-aria-NumberField--Button {\n border-color: var(--surface-color-border-dark);\n}\n\n/* Focus state */\n.bcds-react-aria-NumberField--Group[data-focus-within],\n.bcds-react-aria-NumberField--Group[data-focus-within]\n > .bcds-react-aria-NumberField--Button,\n.bcds-react-aria-NumberField--Group[data-hovered][data-focus-within]\n > .bcds-react-aria-NumberField--Button {\n border-color: var(--surface-color-border-active);\n}\n.bcds-react-aria-NumberField--Group[data-focus-within]\n .bcds-react-aria-NumberField--Input,\n.bcds-react-aria-NumberField--Group[data-focus-visible]\n .bcds-react-aria-NumberField--Input {\n outline: none;\n}\n.bcds-react-aria-NumberField--Group[data-focus-visible] {\n outline: solid var(--layout-border-width-medium)\n var(--surface-color-border-active);\n outline-offset: var(--layout-margin-hair);\n}\n\n/* Error state */\n.bcds-react-aria-NumberField--Error {\n font: var(--typography-regular-small-body);\n color: var(--typography-color-danger);\n}\n.bcds-react-aria-NumberField[data-invalid]\n .bcds-react-aria-NumberField--InputContainer\n > svg {\n color: var(--icons-color-danger);\n}\n.bcds-react-aria-NumberField[data-invalid]\n > .bcds-react-aria-NumberField--Group {\n border-color: var(--support-border-color-danger);\n}\n.bcds-react-aria-NumberField[data-invalid]\n > .bcds-react-aria-NumberField--Group\n > .bcds-react-aria-NumberField--Button {\n border-color: var(--support-border-color-danger);\n}\n\n/* Disabled and read-only states */\n.bcds-react-aria-NumberField[data-disabled]\n > .bcds-react-aria-NumberField--Group,\n.bcds-react-aria-NumberField[data-disabled]\n .bcds-react-aria-NumberField--Input {\n background-color: var(--surface-color-forms-disabled);\n color: var(--typography-color-disabled);\n cursor: not-allowed;\n}\n.bcds-react-aria-NumberField--Group\n > .bcds-react-aria-NumberField--Button\n > .bcds-react-aria-Button[data-disabled] {\n background-color: var(--surface-color-forms-disabled);\n}\n/* BCDS Button style tweaks */\n/* Hover/focus states */\n.bcds-react-aria-NumberField--Group[data-hovered]\n > .bcds-react-aria-NumberField--Button\n > .bcds-react-aria-Button,\n.bcds-react-aria-NumberField--Group[data-hovered]\n > .bcds-react-aria-NumberField--Button\n > .bcds-react-aria-Button[data-disabled] {\n border-top: var(--layout-border-width-small) solid\n var(--surface-color-border-dark);\n border-bottom: var(--layout-border-width-small) solid\n var(--surface-color-border-dark);\n}\n.bcds-react-aria-NumberField--Group[data-hovered][data-focus-within]\n > .bcds-react-aria-NumberField--Button\n > .bcds-react-aria-Button,\n.bcds-react-aria-NumberField--Group[data-focus-within]\n > .bcds-react-aria-NumberField--Button\n .bcds-react-aria-Button[data-disabled] {\n border-top: var(--layout-border-width-small) solid\n var(--surface-color-border-active);\n border-bottom: var(--layout-border-width-small) solid\n var(--surface-color-border-active);\n}\n/* Disabled/read-only states */\n.bcds-react-aria-NumberField--Group[data-disabled],\n.bcds-react-aria-NumberField--Group\n > .bcds-react-aria-NumberField--Button\n > .bcds-react-aria-Button[data-disabled] {\n border-top: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n border-bottom: var(--layout-border-width-small) solid\n var(--surface-color-border-default);\n}\n/* Error state */\n.bcds-react-aria-NumberField--Group[data-invalid]\n > .bcds-react-aria-NumberField--Button\n > .bcds-react-aria-Button,\n.bcds-react-aria-NumberField--Group[data-invalid][data-focus-within]\n > .bcds-react-aria-NumberField--Button\n > .bcds-react-aria-Button,\n.bcds-react-aria-NumberField--Group[data-invalid][data-hovered]\n > .bcds-react-aria-NumberField--Button\n > .bcds-react-aria-Button[data-disabled],\n.bcds-react-aria-NumberField--Group[data-invalid][data-focus-within]\n > .bcds-react-aria-NumberField--Button\n > .bcds-react-aria-Button[data-disabled] {\n border-top: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n border-bottom: var(--layout-border-width-small) solid\n var(--support-border-color-danger);\n}\n";
|
|
20185
|
+
styleInject(css_248z);
|
|
20186
|
+
|
|
20187
|
+
function NumberField({ size = "medium", label, description, errorMessage, ...props }) {
|
|
20188
|
+
return (jsx($b91743d66a0ed188$export$63c5fa0b2fdccd2e, { className: `bcds-react-aria-NumberField ${size}`, minValue: 0, ...props, children: ({ isRequired, isInvalid }) => (jsxs(Fragment$1, { children: [label && (jsxs($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: "bcds-react-aria-NumberField--Label", children: [label, isRequired && (jsx("span", { className: "bcds-react-aria-NumberField--Label required", children: "(required)" }))] })), jsxs($a049562f99e7db0e$export$eb2fcfdbd7ba97d4, { className: "bcds-react-aria-NumberField--Group", children: [jsx("div", { className: "bcds-react-aria-NumberField--Button", children: size == "small" ? (jsx(Button, { size: "small", slot: "decrement", variant: "tertiary", isIconButton: true, children: jsx(SvgDashIcon, {}) })) : (jsx(Button, { slot: "decrement", variant: "tertiary", isIconButton: true, children: jsx(SvgDashIcon, {}) })) }), jsxs("div", { className: "bcds-react-aria-NumberField--InputContainer", children: [jsx($3985021b0ad6602f$export$f5b8910cec6cf069, { className: "bcds-react-aria-NumberField--Input" }), isInvalid && jsx(SvgExclamationIcon, {})] }), jsx("div", { className: "bcds-react-aria-NumberField--Button", children: size == "small" ? (jsx(Button, { size: "small", slot: "increment", variant: "tertiary", isIconButton: true, children: jsx(SvgPlusIcon, {}) })) : (jsx(Button, { slot: "increment", variant: "tertiary", isIconButton: true, children: jsx(SvgPlusIcon, {}) })) })] }), description && (jsx(Text, { className: "bcds-react-aria-NumberField--Description", slot: "description", children: description })), isInvalid && (jsx($ee014567cb39d3f0$export$f551688fc98f2e09, { className: "bcds-react-aria-NumberField--Error", children: errorMessage }))] })) }));
|
|
20189
|
+
}
|
|
20190
|
+
|
|
20191
|
+
export { Accordion, AccordionGroup, AlertBanner, AlertDialog, Button, ButtonGroup, Callout, Checkbox, CheckboxGroup, Dialog, $de32f1b87079253c$export$2e1e1122cf0cba88 as DialogTrigger, Footer, FooterLinks, Form, Header, Heading, InlineAlert, Link, Modal, NumberField, Radio, RadioGroup, Select, SvgBcLogo, SvgBcOutlineIcon, SvgBetaIcon, SvgCheckCircleIcon, SvgCheckIcon, SvgChevronDownIcon, SvgChevronUpIcon, SvgCloseIcon, SvgDashIcon$1 as SvgDashIcon, SvgExclamationCircleIcon, SvgExclamationIcon, SvgInfoIcon, SvgDashIcon as SvgMinusIcon, SvgPlusIcon, SvgReactAriaIcon, SvgTooltipArrowUp, SvgUpRightFromSquareIcon, Switch, Tag, TagGroup, TagList, Text, TextArea, TextField, Tooltip, $4e3b923658d69c60$export$8c610744efcf8a1d as TooltipTrigger };
|
|
18174
20192
|
//# sourceMappingURL=index.js.map
|