@uh-design-system/component-library 0.4.0 → 0.4.1
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/component-library.cjs.js +2 -2
- package/dist/cjs/controlUtils-041de0fd.js +7 -0
- package/dist/cjs/ds-accordion_3.cjs.entry.js +27 -20
- package/dist/cjs/ds-checkbox-group.cjs.entry.js +156 -0
- package/dist/cjs/ds-checkbox.cjs.entry.js +153 -0
- package/dist/cjs/ds-input-validity.cjs.entry.js +38 -0
- package/dist/cjs/ds-link-with-arrow.cjs.entry.js +8 -7
- package/dist/cjs/ds-link.cjs.entry.js +11 -8
- package/dist/cjs/ds-text-input.cjs.entry.js +30 -6
- package/dist/cjs/ds-visually-hidden.cjs.entry.js +2 -2
- package/dist/cjs/{index-bfa0f441.js → index-b1d61146.js} +116 -2
- package/dist/cjs/{linkUtils-695da37c.js → linkUtils-e911e899.js} +10 -0
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/utils-c9113835.js +18 -0
- package/dist/collection/accessibility/accessibility.stories.js +10 -0
- package/dist/collection/accessibility/stories/ariaLabel.stories.js +19 -0
- package/dist/collection/accessibility/stories/ariaLabelledBy.stories.js +49 -0
- package/dist/collection/accessibility/stories/naming.stories.js +39 -0
- package/dist/collection/collection-manifest.json +3 -0
- package/dist/collection/components/00-foundations/icons/categories/information.js +4 -0
- package/dist/collection/components/00-foundations/typography/stories/typography.stories.js +133 -48
- package/dist/collection/components/01-base-components/ds-accordion/ds-accordion.css +1 -1
- package/dist/collection/components/01-base-components/ds-accordion/ds-accordion.js +6 -6
- package/dist/collection/components/01-base-components/ds-button/ds-button.css +9 -9
- package/dist/collection/components/01-base-components/ds-button/ds-button.js +2 -2
- package/dist/collection/components/01-base-components/ds-button/stories/ds-button.examples.stories.js +53 -12
- package/dist/collection/components/01-base-components/ds-button/stories/ds-button.features.stories.js +88 -55
- package/dist/collection/components/01-base-components/ds-button/stories/ds-button.stories.js +1 -1
- package/dist/collection/components/01-base-components/ds-checkbox/ds-checkbox.css +315 -0
- package/dist/collection/components/01-base-components/ds-checkbox/ds-checkbox.js +429 -0
- package/dist/collection/components/01-base-components/ds-checkbox/stories/ds-checkbox.features.stories.js +115 -0
- package/dist/collection/components/01-base-components/ds-checkbox/stories/ds-checkbox.stories.js +37 -0
- package/dist/collection/components/01-base-components/ds-checkbox-group/ds-checkbox-group.css +38 -0
- package/dist/collection/components/01-base-components/ds-checkbox-group/ds-checkbox-group.js +445 -0
- package/dist/collection/components/01-base-components/ds-checkbox-group/stories/ds-checkbox-group.features.stories.js +89 -0
- package/dist/collection/components/01-base-components/ds-checkbox-group/stories/ds-checkbox-group.stories.js +47 -0
- package/dist/collection/components/01-base-components/ds-icon/ds-icon.js +1 -1
- package/dist/collection/components/01-base-components/ds-icon/{ds-icon.stories.js → stories/ds-icon.stories.js} +12 -2
- package/dist/collection/components/01-base-components/ds-input-validity/ds-input-validity.css +31 -0
- package/dist/collection/components/01-base-components/ds-input-validity/ds-input-validity.js +114 -0
- package/dist/collection/components/01-base-components/ds-input-validity/stories/ds-input-validity.features.stories.js +17 -0
- package/dist/collection/components/01-base-components/ds-input-validity/stories/ds-input-validity.stories.js +21 -0
- package/dist/collection/components/01-base-components/ds-link/ds-link.css +19 -1
- package/dist/collection/components/01-base-components/ds-link/ds-link.js +68 -8
- package/dist/collection/components/01-base-components/ds-link/stories/ds-link.examples.stories.js +6 -2
- package/dist/collection/components/01-base-components/ds-link/stories/ds-link.features.stories.js +2 -2
- package/dist/collection/components/01-base-components/ds-link/stories/ds-link.stories.js +11 -3
- package/dist/collection/components/01-base-components/ds-link-with-arrow/ds-link-with-arrow.css +1 -1
- package/dist/collection/components/01-base-components/ds-link-with-arrow/ds-link-with-arrow.js +25 -5
- package/dist/collection/components/01-base-components/ds-link-with-arrow/stories/{ds-arrow-link.examples.stories.js → ds-link-with-arrow.examples.stories.js} +26 -3
- package/dist/collection/components/01-base-components/ds-link-with-arrow/stories/{ds-arrow-link.stories.js → ds-link-with-arrow.stories.js} +1 -3
- package/dist/collection/components/01-base-components/ds-text-input/ds-text-input.css +8 -11
- package/dist/collection/components/01-base-components/ds-text-input/ds-text-input.js +30 -5
- package/dist/collection/components/01-base-components/ds-text-input/stories/ds-text-input.examples.stories.js +29 -7
- package/dist/collection/components/01-base-components/ds-text-input/utils.js +0 -6
- package/dist/collection/components/01-base-components/ds-visually-hidden/ds-visually-hidden.js +1 -1
- package/dist/collection/utils/controls/controlUtils.js +2 -0
- package/dist/collection/utils/link/linkUtils.js +9 -0
- package/dist/collection/utils/typography/typographyUtils.js +39 -0
- package/dist/collection/utils/utils.js +24 -6
- package/dist/component-library/component-library.css +1 -1
- package/dist/component-library/component-library.esm.js +1 -1
- package/dist/component-library/controlUtils-9ca4087b.js +1 -0
- package/dist/component-library/ds-accordion_3.entry.js +1 -1
- package/dist/component-library/ds-checkbox-group.entry.js +1 -0
- package/dist/component-library/ds-checkbox.entry.js +1 -0
- package/dist/component-library/ds-input-validity.entry.js +1 -0
- package/dist/component-library/ds-link-with-arrow.entry.js +1 -1
- package/dist/component-library/ds-link.entry.js +1 -1
- package/dist/component-library/ds-text-input.entry.js +1 -1
- package/dist/component-library/ds-visually-hidden.entry.js +1 -1
- package/dist/component-library/index-aaccd233.js +2 -0
- package/dist/component-library/{linkUtils-3d1b28cf.js → linkUtils-fe63ff72.js} +1 -1
- package/dist/component-library/utils-b5843ae1.js +1 -0
- package/dist/components/attributes.js +1 -80
- package/dist/components/controlUtils.js +4 -0
- package/dist/components/ds-accordion.js +8 -8
- package/dist/components/ds-button2.js +4 -3
- package/dist/components/ds-checkbox-group.d.ts +11 -0
- package/dist/components/ds-checkbox-group.js +206 -0
- package/dist/components/ds-checkbox.d.ts +11 -0
- package/dist/components/ds-checkbox.js +6 -0
- package/dist/components/ds-checkbox2.js +185 -0
- package/dist/components/ds-icon2.js +24 -4
- package/dist/components/ds-input-validity.d.ts +11 -0
- package/dist/components/ds-input-validity.js +6 -0
- package/dist/components/ds-input-validity2.js +59 -0
- package/dist/components/ds-link-with-arrow.js +10 -8
- package/dist/components/ds-link.js +15 -9
- package/dist/components/ds-text-input.js +30 -7
- package/dist/components/ds-visually-hidden2.js +1 -1
- package/dist/components/index2.js +104 -4
- package/dist/components/index3.js +80 -0
- package/dist/components/linkUtils.js +10 -1
- package/dist/esm/component-library.js +3 -3
- package/dist/esm/controlUtils-9ca4087b.js +4 -0
- package/dist/esm/ds-accordion_3.entry.js +25 -18
- package/dist/esm/ds-checkbox-group.entry.js +152 -0
- package/dist/esm/ds-checkbox.entry.js +149 -0
- package/dist/esm/ds-input-validity.entry.js +34 -0
- package/dist/esm/ds-link-with-arrow.entry.js +8 -7
- package/dist/esm/ds-link.entry.js +11 -8
- package/dist/esm/ds-text-input.entry.js +30 -6
- package/dist/esm/ds-visually-hidden.entry.js +2 -2
- package/dist/esm/{index-42701395.js → index-aaccd233.js} +116 -3
- package/dist/esm/{linkUtils-3d1b28cf.js → linkUtils-fe63ff72.js} +10 -1
- package/dist/esm/loader.js +3 -3
- package/dist/esm/utils-b5843ae1.js +15 -0
- package/dist/types/accessibility/accessibility.stories.d.ts +3 -0
- package/dist/types/accessibility/stories/ariaLabel.stories.d.ts +5 -0
- package/dist/types/accessibility/stories/ariaLabelledBy.stories.d.ts +4 -0
- package/dist/types/accessibility/stories/naming.stories.d.ts +4 -0
- package/dist/types/components/00-foundations/typography/stories/typography.stories.d.ts +1 -0
- package/dist/types/components/01-base-components/ds-button/stories/ds-button.examples.stories.d.ts +2 -0
- package/dist/types/components/01-base-components/ds-button/stories/ds-button.features.stories.d.ts +4 -1
- package/dist/types/components/01-base-components/ds-checkbox/ds-checkbox.d.ts +49 -0
- package/dist/types/components/01-base-components/ds-checkbox/stories/ds-checkbox.features.stories.d.ts +13 -0
- package/dist/types/components/01-base-components/ds-checkbox/stories/ds-checkbox.stories.d.ts +7 -0
- package/dist/types/components/01-base-components/ds-checkbox-group/ds-checkbox-group.d.ts +56 -0
- package/dist/types/components/01-base-components/ds-checkbox-group/stories/ds-checkbox-group.features.stories.d.ts +11 -0
- package/dist/types/components/01-base-components/ds-checkbox-group/stories/ds-checkbox-group.stories.d.ts +7 -0
- package/dist/types/components/01-base-components/ds-icon/{ds-icon.stories.d.ts → stories/ds-icon.stories.d.ts} +2 -1
- package/dist/types/components/01-base-components/ds-input-validity/ds-input-validity.d.ts +12 -0
- package/dist/types/components/01-base-components/ds-input-validity/stories/ds-input-validity.features.stories.d.ts +7 -0
- package/dist/types/components/01-base-components/ds-input-validity/stories/ds-input-validity.stories.d.ts +7 -0
- package/dist/types/components/01-base-components/ds-link/ds-link.d.ts +4 -1
- package/dist/types/components/01-base-components/ds-link-with-arrow/ds-link-with-arrow.d.ts +1 -0
- package/dist/types/components/01-base-components/ds-text-input/ds-text-input.d.ts +5 -0
- package/dist/types/components/01-base-components/ds-text-input/utils.d.ts +0 -1
- package/dist/types/components.d.ts +142 -2
- package/dist/types/utils/controls/controlUtils.d.ts +2 -0
- package/dist/types/utils/link/linkUtils.d.ts +1 -0
- package/dist/types/utils/typography/typographyUtils.d.ts +5 -0
- package/dist/types/utils/utils.d.ts +10 -3
- package/package.json +3 -2
- package/dist/cjs/utils-8b73aa91.js +0 -10
- package/dist/collection/components/00-foundations/typography/typography.stories.js +0 -68
- package/dist/component-library/index-42701395.js +0 -2
- package/dist/component-library/utils-cca2a41a.js +0 -1
- package/dist/components/utils.js +0 -8
- package/dist/esm/utils-cca2a41a.js +0 -8
- package/dist/types/components/00-foundations/typography/typography.stories.d.ts +0 -7
- /package/dist/cjs/{attributes-f7831329.js → attributes-5f5b58be.js} +0 -0
- /package/dist/collection/components/01-base-components/ds-link-with-arrow/stories/{ds-arrow-link.features.stories.js → ds-link-with-arrow.features.stories.js} +0 -0
- /package/dist/collection/utils/{attributes.js → attributes/attributes.js} +0 -0
- /package/dist/component-library/{attributes-9419ac39.js → attributes-7d09be1b.js} +0 -0
- /package/dist/esm/{attributes-9419ac39.js → attributes-7d09be1b.js} +0 -0
- /package/dist/types/components/01-base-components/ds-link-with-arrow/stories/{ds-arrow-link.examples.stories.d.ts → ds-link-with-arrow.examples.stories.d.ts} +0 -0
- /package/dist/types/components/01-base-components/ds-link-with-arrow/stories/{ds-arrow-link.features.stories.d.ts → ds-link-with-arrow.features.stories.d.ts} +0 -0
- /package/dist/types/components/01-base-components/ds-link-with-arrow/stories/{ds-arrow-link.stories.d.ts → ds-link-with-arrow.stories.d.ts} +0 -0
- /package/dist/types/utils/{attributes.d.ts → attributes/attributes.d.ts} +0 -0
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-b1d61146.js');
|
|
6
6
|
const index$1 = require('./index-5b0b9d4c.js');
|
|
7
|
-
const attributes = require('./attributes-
|
|
8
|
-
const
|
|
9
|
-
const
|
|
7
|
+
const attributes = require('./attributes-5f5b58be.js');
|
|
8
|
+
const linkUtils = require('./linkUtils-e911e899.js');
|
|
9
|
+
const utils = require('./utils-c9113835.js');
|
|
10
10
|
|
|
11
|
-
const dsLinkWithArrowCss = ":root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-borderWidth-none:0px;--ds-borderWidth-hairline:1px;--ds-borderWidth-thin:2px;--ds-borderWidth-thick:4px;--ds-borderWidth-xThick:8px;--ds-borderRadius-none:0px}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-fontFamily-heading:\"Open Sans\", sans-serif;--ds-fontFamily-body:\"Open Sans\", sans-serif;--ds-fontSize-12:12px;--ds-fontSize-14:14px;--ds-fontSize-16:16px;--ds-fontSize-18:18px;--ds-fontSize-20:20px;--ds-fontSize-22:22px;--ds-fontSize-24:24px;--ds-fontSize-26:26px;--ds-fontSize-30:30px;--ds-fontSize-32:32px;--ds-fontSize-36:36px;--ds-fontSize-40:40px;--ds-fontSize-48:48px;--ds-fontSize-56:56px;--ds-fontSize-64:64px;--ds-fontWeight-regular:400;--ds-fontWeight-semibold:600;--ds-fontWeight-semiboldPlus:650;--ds-fontWeight-bold:700;--ds-letterSpacing-xTight:-2;--ds-letterSpacing-tight:-1.4;--ds-letterSpacing-normal:-0.4;--ds-letterSpacing-wide:0;--ds-letterSpacing-xWide:0.4;--ds-lineHeight-small:1;--ds-lineHeight-medium:1.2;--ds-lineHeight-large:1.5;--ds-lineHeight-xLarge:1.75;--ds-fontWidth-normal:100;--ds-fontWidth-condense:90;--ds-number-style:proportional-figures;}@supports (font-variation-settings: normal){:root{--ds-fontFamily-heading:\"Open Sans Variable\", sans-serif;--ds-fontFamily-body:\"Open Sans Variable\", sans-serif}}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.ds-bodyText--2xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--2xLarge{font-size:var(--ds-fontSize-22)}}.ds-bodyText--xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--xLarge{font-size:var(--ds-fontSize-20)}}.ds-bodyText--large{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--large{font-size:var(--ds-fontSize-18)}}.ds-bodyText--medium{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--medium{font-size:var(--ds-fontSize-16)}}.ds-bodyText--small{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--small{font-size:var(--ds-fontSize-14)}}:host{display:inline-block}.ds-link-with-arrow{display:inline-flex;align-items:center;color:var(--ds-textColor-link);letter-spacing:var(--ds-letterSpacing-wide);font-weight:var(--ds-fontWeight-semibold);font-size:var(--ds-fontSize-16);text-decoration-line:none}.ds-link-with-arrow:focus-visible
|
|
11
|
+
const dsLinkWithArrowCss = ":root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-borderWidth-none:0px;--ds-borderWidth-hairline:1px;--ds-borderWidth-thin:2px;--ds-borderWidth-thick:4px;--ds-borderWidth-xThick:8px;--ds-borderRadius-none:0px}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-fontFamily-heading:\"Open Sans\", sans-serif;--ds-fontFamily-body:\"Open Sans\", sans-serif;--ds-fontSize-12:12px;--ds-fontSize-14:14px;--ds-fontSize-16:16px;--ds-fontSize-18:18px;--ds-fontSize-20:20px;--ds-fontSize-22:22px;--ds-fontSize-24:24px;--ds-fontSize-26:26px;--ds-fontSize-30:30px;--ds-fontSize-32:32px;--ds-fontSize-36:36px;--ds-fontSize-40:40px;--ds-fontSize-48:48px;--ds-fontSize-56:56px;--ds-fontSize-64:64px;--ds-fontWeight-regular:400;--ds-fontWeight-semibold:600;--ds-fontWeight-semiboldPlus:650;--ds-fontWeight-bold:700;--ds-letterSpacing-xTight:-2;--ds-letterSpacing-tight:-1.4;--ds-letterSpacing-normal:-0.4;--ds-letterSpacing-wide:0;--ds-letterSpacing-xWide:0.4;--ds-lineHeight-small:1;--ds-lineHeight-medium:1.2;--ds-lineHeight-large:1.5;--ds-lineHeight-xLarge:1.75;--ds-fontWidth-normal:100;--ds-fontWidth-condense:90;--ds-number-style:proportional-figures;}@supports (font-variation-settings: normal){:root{--ds-fontFamily-heading:\"Open Sans Variable\", sans-serif;--ds-fontFamily-body:\"Open Sans Variable\", sans-serif}}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.ds-bodyText--2xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--2xLarge{font-size:var(--ds-fontSize-22)}}.ds-bodyText--xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--xLarge{font-size:var(--ds-fontSize-20)}}.ds-bodyText--large{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--large{font-size:var(--ds-fontSize-18)}}.ds-bodyText--medium{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--medium{font-size:var(--ds-fontSize-16)}}.ds-bodyText--small{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--small{font-size:var(--ds-fontSize-14)}}:host{display:inline-block}.ds-link-with-arrow{display:inline-flex;align-items:center;color:var(--ds-textColor-link);letter-spacing:var(--ds-letterSpacing-wide);font-weight:var(--ds-fontWeight-semibold);font-size:var(--ds-fontSize-16);text-decoration-line:none}.ds-link-with-arrow:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline-color:var(--ds-borderColor-black);outline-offset:var(--ds-borderWidth-thin);outline-style:solid;outline-width:var(--ds-borderWidth-thin)}@media (min-width: 30rem){.ds-link-with-arrow{font-size:var(--ds-fontSize-18)}}.ds-link-with-arrow__icon{display:inline-flex;width:2em;height:2em;line-height:0;align-items:center;justify-content:center;color:var(--ds-textColor-white);background-color:var(--ds-bgColor-primary)}.ds-link-with-arrow__icon--start{margin-right:var(--ds-spacing-xSmall)}.ds-link-with-arrow__icon--end{margin-left:var(--ds-spacing-xSmall)}:hover slot>.ds-link-with-arrow__icon{outline:10px solid;background-color:var(--ds-bgColor-primary-hover)}:active slot>.ds-link-with-arrow__icon{background-color:var(--ds-bgColor-primary-active)}.ds-link-with-arrow:hover,.ds-link-with-arrow:active{text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:auto;text-decoration-thickness:7%;text-underline-offset:12%;text-underline-position:from-font}.ds-link-with-arrow:hover{color:var(--ds-textColor-link-hover)}.ds-link-with-arrow:active,.ds-link-with-arrow:focus-visible{color:var(--ds-textColor-link-active)}";
|
|
12
12
|
const DsLinkWithArrowStyle0 = dsLinkWithArrowCss;
|
|
13
13
|
|
|
14
14
|
const visuallyHiddenAssistiveTextIdGenerator = utils.idGenerator('visually-hidden-assistive-text');
|
|
@@ -26,8 +26,9 @@ const DsLinkWithArrow = class {
|
|
|
26
26
|
href;
|
|
27
27
|
target;
|
|
28
28
|
language;
|
|
29
|
+
ariaLabel;
|
|
29
30
|
componentWillLoad() {
|
|
30
|
-
this.inheritedAttributes = attributes.inheritAriaAttributes(this.el);
|
|
31
|
+
this.inheritedAttributes = attributes.inheritAriaAttributes(this.el, ['aria-label']);
|
|
31
32
|
if (linkUtils.opensInNewTab(this.target)) {
|
|
32
33
|
this.icon = 'arrow_outward';
|
|
33
34
|
this.rel = 'noopener noreferrer';
|
|
@@ -39,7 +40,7 @@ const DsLinkWithArrow = class {
|
|
|
39
40
|
'ds-link-with-arrow__icon--start': this.iconPosition === 'start',
|
|
40
41
|
'ds-link-with-arrow__icon--end': this.iconPosition === 'end',
|
|
41
42
|
});
|
|
42
|
-
return (index.h("a", { key: '
|
|
43
|
+
return (index.h("a", { key: 'a5773a53bca7c886919e79f668604db1b97f825b', href: this.href, class: classes, rel: this.rel, target: this.target, "aria-label": linkUtils.getAriaLabel(this.text, this.ariaLabel), ...this.inheritedAttributes }, index.h("slot", { key: '2205bd5ee34150f491824520278b8de44d73f44f', name: "iconStart" }, this.iconPosition === 'start' && index.h("ds-icon", { key: '56402edf3a1e50da213931530318f58bc5288b3b', name: this.icon, class: iconClasses, size: "1.4em" })), this.text, index.h("slot", { key: '5df46dff1abe8821533b0c09be9987ce32ea135c', name: "iconStart" }, this.iconPosition === 'end' && index.h("ds-icon", { key: 'a5c9a78865619a1bebbb0e3587466b2b77160c0c', name: this.icon, class: iconClasses, size: "1.4em" })), linkUtils.opensInNewTab(this.target) && (index.h("ds-visually-hidden", { key: '9222ab3fd72b597b314e5bdb97b4467ec5ec41a9', id: this.visuallyHiddenAssistiveTextId }, linkUtils.visuallyHiddenAssistiveText(this.language ?? document.documentElement.lang)))));
|
|
43
44
|
}
|
|
44
45
|
};
|
|
45
46
|
DsLinkWithArrow.style = DsLinkWithArrowStyle0;
|
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-b1d61146.js');
|
|
6
6
|
const index$1 = require('./index-5b0b9d4c.js');
|
|
7
|
-
const attributes = require('./attributes-
|
|
8
|
-
const
|
|
9
|
-
const
|
|
7
|
+
const attributes = require('./attributes-5f5b58be.js');
|
|
8
|
+
const linkUtils = require('./linkUtils-e911e899.js');
|
|
9
|
+
const utils = require('./utils-c9113835.js');
|
|
10
10
|
|
|
11
|
-
const dsLinkCss = ":root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-borderWidth-none:0px;--ds-borderWidth-hairline:1px;--ds-borderWidth-thin:2px;--ds-borderWidth-thick:4px;--ds-borderWidth-xThick:8px;--ds-borderRadius-none:0px}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-fontFamily-heading:\"Open Sans\", sans-serif;--ds-fontFamily-body:\"Open Sans\", sans-serif;--ds-fontSize-12:12px;--ds-fontSize-14:14px;--ds-fontSize-16:16px;--ds-fontSize-18:18px;--ds-fontSize-20:20px;--ds-fontSize-22:22px;--ds-fontSize-24:24px;--ds-fontSize-26:26px;--ds-fontSize-30:30px;--ds-fontSize-32:32px;--ds-fontSize-36:36px;--ds-fontSize-40:40px;--ds-fontSize-48:48px;--ds-fontSize-56:56px;--ds-fontSize-64:64px;--ds-fontWeight-regular:400;--ds-fontWeight-semibold:600;--ds-fontWeight-semiboldPlus:650;--ds-fontWeight-bold:700;--ds-letterSpacing-xTight:-2;--ds-letterSpacing-tight:-1.4;--ds-letterSpacing-normal:-0.4;--ds-letterSpacing-wide:0;--ds-letterSpacing-xWide:0.4;--ds-lineHeight-small:1;--ds-lineHeight-medium:1.2;--ds-lineHeight-large:1.5;--ds-lineHeight-xLarge:1.75;--ds-fontWidth-normal:100;--ds-fontWidth-condense:90;--ds-number-style:proportional-figures;}@supports (font-variation-settings: normal){:root{--ds-fontFamily-heading:\"Open Sans Variable\", sans-serif;--ds-fontFamily-body:\"Open Sans Variable\", sans-serif}}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.ds-bodyText--2xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--2xLarge{font-size:var(--ds-fontSize-22)}}.ds-bodyText--xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--xLarge{font-size:var(--ds-fontSize-20)}}.ds-bodyText--large{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--large{font-size:var(--ds-fontSize-18)}}.ds-bodyText--medium{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--medium{font-size:var(--ds-fontSize-16)}}.ds-bodyText--small{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--small{font-size:var(--ds-fontSize-14)}}:host{display:inline-block}.ds-link{display:inline-flex;align-items:center;color:var(--ds-textColor-link);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:auto;text-decoration-thickness:7%;text-underline-offset:12%;text-underline-position:from-font}.ds-link:focus-visible
|
|
11
|
+
const dsLinkCss = ":root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-borderWidth-none:0px;--ds-borderWidth-hairline:1px;--ds-borderWidth-thin:2px;--ds-borderWidth-thick:4px;--ds-borderWidth-xThick:8px;--ds-borderRadius-none:0px}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}:root{--ds-fontFamily-heading:\"Open Sans\", sans-serif;--ds-fontFamily-body:\"Open Sans\", sans-serif;--ds-fontSize-12:12px;--ds-fontSize-14:14px;--ds-fontSize-16:16px;--ds-fontSize-18:18px;--ds-fontSize-20:20px;--ds-fontSize-22:22px;--ds-fontSize-24:24px;--ds-fontSize-26:26px;--ds-fontSize-30:30px;--ds-fontSize-32:32px;--ds-fontSize-36:36px;--ds-fontSize-40:40px;--ds-fontSize-48:48px;--ds-fontSize-56:56px;--ds-fontSize-64:64px;--ds-fontWeight-regular:400;--ds-fontWeight-semibold:600;--ds-fontWeight-semiboldPlus:650;--ds-fontWeight-bold:700;--ds-letterSpacing-xTight:-2;--ds-letterSpacing-tight:-1.4;--ds-letterSpacing-normal:-0.4;--ds-letterSpacing-wide:0;--ds-letterSpacing-xWide:0.4;--ds-lineHeight-small:1;--ds-lineHeight-medium:1.2;--ds-lineHeight-large:1.5;--ds-lineHeight-xLarge:1.75;--ds-fontWidth-normal:100;--ds-fontWidth-condense:90;--ds-number-style:proportional-figures;}@supports (font-variation-settings: normal){:root{--ds-fontFamily-heading:\"Open Sans Variable\", sans-serif;--ds-fontFamily-body:\"Open Sans Variable\", sans-serif}}:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.ds-bodyText--2xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-20);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--2xLarge{font-size:var(--ds-fontSize-22)}}.ds-bodyText--xLarge{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-18);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--xLarge{font-size:var(--ds-fontSize-20)}}.ds-bodyText--large{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--large{font-size:var(--ds-fontSize-18)}}.ds-bodyText--medium{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--medium{font-size:var(--ds-fontSize-16)}}.ds-bodyText--small{color:var(--ds-textColor-default);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-12);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}@media (min-width: 30rem){.ds-bodyText--small{font-size:var(--ds-fontSize-14)}}:host{display:inline-block}.ds-link{display:inline-flex;align-items:center;color:var(--ds-textColor-link);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);text-decoration-line:underline;text-decoration-style:solid;text-decoration-skip-ink:auto;text-decoration-thickness:7%;text-underline-offset:12%;text-underline-position:from-font}.ds-link:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline-color:var(--ds-borderColor-black);outline-offset:var(--ds-borderWidth-thin);outline-style:solid;outline-width:var(--ds-borderWidth-thin)}.ds-link--semibold{font-weight:var(--ds-fontWeight-semibold)}.ds-link--bold{font-weight:var(--ds-fontWeight-bold)}.ds-link--2xLarge{font-size:var(--ds-fontSize-22)}.ds-link--xLarge{font-size:var(--ds-fontSize-20)}.ds-link--large{font-size:var(--ds-fontSize-18)}.ds-link--medium{font-size:var(--ds-fontSize-16)}.ds-link--small{font-size:var(--ds-fontSize-14)}.ds-link--xSmall{font-size:var(--ds-fontSize-12)}.ds-link__icon{height:1em;width:1em}.ds-link__icon--start-inline{margin-right:var(--ds-spacing-3xSmall)}.ds-link__icon--start-standalone{margin-right:var(--ds-spacing-2xSmall)}.ds-link__icon--end-inline{margin-left:var(--ds-spacing-3xSmall)}.ds-link__icon--end-standalone{margin-left:var(--ds-spacing-2xSmall)}.ds-link:hover,.ds-link:active{text-decoration-thickness:13%;text-underline-offset:12%}.ds-link:hover{color:var(--ds-textColor-link-hover)}.ds-link:active{color:var(--ds-textColor-link-active)}.ds-link:visited{color:var(--ds-textColor-link-visited)}.ds-link--standalone{color:var(--ds-textColor-link);text-decoration-line:none}.ds-link--standalone:hover,.ds-link--standalone:active{text-decoration-line:underline}.ds-link--standalone:hover{color:var(--ds-textColor-link-hover)}.ds-link--standalone:active{color:var(--ds-textColor-link-active)}.ds-link--standalone:focus-visible{color:var(--ds-textColor-link)}.ds-link--standalone:visited{color:var(--ds-textColor-link)}";
|
|
12
12
|
const DsLinkStyle0 = dsLinkCss;
|
|
13
13
|
|
|
14
14
|
const visuallyHiddenAssistiveTextIdGenerator = utils.idGenerator('visually-hidden-assistive-text');
|
|
@@ -26,12 +26,15 @@ const DsLink = class {
|
|
|
26
26
|
weight = 'regular';
|
|
27
27
|
icon = '';
|
|
28
28
|
iconPosition = 'end';
|
|
29
|
+
iconTitle;
|
|
30
|
+
iconHidden;
|
|
29
31
|
href;
|
|
30
32
|
target;
|
|
31
33
|
download;
|
|
32
34
|
language;
|
|
35
|
+
ariaLabel;
|
|
33
36
|
componentWillLoad() {
|
|
34
|
-
this.inheritedAttributes = attributes.inheritAriaAttributes(this.el);
|
|
37
|
+
this.inheritedAttributes = attributes.inheritAriaAttributes(this.el, ['aria-label']);
|
|
35
38
|
if (linkUtils.opensInNewTab(this.target)) {
|
|
36
39
|
this.icon = 'open_in_new';
|
|
37
40
|
this.iconPosition = 'end';
|
|
@@ -40,13 +43,13 @@ const DsLink = class {
|
|
|
40
43
|
}
|
|
41
44
|
render() {
|
|
42
45
|
const classes = index$1.classNames('ds-link', `ds-link--${this.weight}`, `ds-link--${this.variant}`, {
|
|
43
|
-
[`
|
|
46
|
+
[`ds-link--${this.size}`]: Boolean(this.size),
|
|
44
47
|
});
|
|
45
48
|
const iconClasses = index$1.classNames('ds-link__icon', {
|
|
46
49
|
[`ds-link__icon--start-${this.variant}`]: this.iconPosition === 'start',
|
|
47
50
|
[`ds-link__icon--end-${this.variant}`]: this.iconPosition === 'end',
|
|
48
51
|
});
|
|
49
|
-
return (index.h("a", { key: '
|
|
52
|
+
return (index.h("a", { key: '8ac4ff399eabfbe264f031b0cf7192ee1f9f2725', href: this.href, class: classes, rel: this.rel, target: this.target, download: this.download, "aria-label": linkUtils.getAriaLabel(this.text, this.ariaLabel), ...this.inheritedAttributes }, index.h("slot", { key: '2301357ed75faeb5037c71f5da4fb8c3f8c76b6d', name: "iconStart" }, this.icon && this.iconPosition === 'start' && index.h("ds-icon", { key: '2d478d2cf110107d5ea31b1ea44b4904377d686b', name: this.icon, class: iconClasses, size: "1em", title: this.iconTitle, hidden: this.iconHidden })), this.text, index.h("slot", { key: 'a132464b8b41499c2f8b9da6f22f09d133d86219', name: "iconEnd" }, this.icon && this.iconPosition === 'end' && index.h("ds-icon", { key: '5fff8019a4d810e4b686f09e204cf457783d1907', name: this.icon, class: iconClasses, size: "1em", title: this.iconTitle, hidden: this.iconHidden })), linkUtils.opensInNewTab(this.target) && (index.h("ds-visually-hidden", { key: 'cc773ec9fb38d1aa042f812187389e75aab511b2', id: this.visuallyHiddenAssistiveTextId }, linkUtils.visuallyHiddenAssistiveText(this.language ?? document.documentElement.lang)))));
|
|
50
53
|
}
|
|
51
54
|
};
|
|
52
55
|
DsLink.style = DsLinkStyle0;
|
|
@@ -2,11 +2,12 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-b1d61146.js');
|
|
6
6
|
const index$1 = require('./index-5b0b9d4c.js');
|
|
7
|
-
const utils = require('./utils-
|
|
7
|
+
const utils = require('./utils-c9113835.js');
|
|
8
|
+
const controlUtils = require('./controlUtils-041de0fd.js');
|
|
8
9
|
|
|
9
|
-
const dsTextInputCss = ".sc-ds-text-input:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.sc-ds-text-input-h{display:block;width:288px}@media (min-width: 75rem){.sc-ds-text-input-h{width:320px}}.ds-input--label-container.sc-ds-text-input{margin-block-end:var(--ds-spacing-2xSmall)}.ds-input--label-container.sc-ds-text-input label.sc-ds-text-input{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-semibold);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);color:var(--ds-textColor-default)}.ds-input--label-container.sc-ds-text-input
|
|
10
|
+
const dsTextInputCss = ".sc-ds-text-input:root{--ds-breakpoint-xSmall:20rem;--ds-breakpoint-small:30rem;--ds-breakpoint-medium:60rem;--ds-breakpoint-large:75rem;--ds-breakpoint-xLarge:90rem}.sc-ds-text-input-h{display:block;width:288px}@media (min-width: 75rem){.sc-ds-text-input-h{width:320px}}.ds-input--label-container.sc-ds-text-input{margin-block-end:var(--ds-spacing-2xSmall)}.ds-input--label-container.sc-ds-text-input label.sc-ds-text-input{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-semibold);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);color:var(--ds-textColor-default)}.ds-input--label-container.sc-ds-text-input small.sc-ds-text-input{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);display:block;margin-block-start:var(--ds-spacing-3xSmall);color:var(--ds-textColor-secondary)}.ds-input--container.sc-ds-text-input{box-sizing:border-box;width:100%;display:inline-flex;position:relative;align-items:center;border-width:var(--ds-borderWidth-thin);border-style:solid;border-color:var(--ds-borderColor-default);padding-inline:var(--ds-spacing-xSmall)}.ds-input--container.sc-ds-text-input:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline-color:var(--ds-borderColor-black);outline-offset:var(--ds-borderWidth-thin);outline-style:solid;outline-width:var(--ds-borderWidth-thin)}.ds-input--container.sc-ds-text-input:focus-within{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline-color:var(--ds-borderColor-black);outline-offset:var(--ds-borderWidth-thin);outline-style:solid;outline-width:var(--ds-borderWidth-thin)}.ds-input--container.invalid.sc-ds-text-input{background-color:var(--ds-bgColor-danger);border-color:var(--ds-borderColor-danger)}.ds-input--container.invalid.sc-ds-text-input:hover:not(.ds-input--container.invalid:focus-within){background-color:var(--ds-bgColor-danger-hover);border-color:var(--ds-borderColor-danger)}.ds-input--container.invalid.active.sc-ds-text-input{background-color:var(--ds-bgColor-danger-active);border-color:var(--ds-borderColor-danger)}.ds-input--container.valid.sc-ds-text-input{background-color:var(--ds-bgColor-success);border-color:var(--ds-borderColor-success)}.ds-input--container.valid.sc-ds-text-input:hover:not(.ds-input--container.valid:focus-within){background-color:var(--ds-bgColor-success-hover);border-color:var(--ds-borderColor-success)}.ds-input--container.valid.active.sc-ds-text-input{background-color:var(--ds-bgColor-success-active);border-color:var(--ds-borderColor-success)}.ds-input--container.readonly.sc-ds-text-input,.ds-input--container.disabled.sc-ds-text-input{background-color:var(--ds-bgColor-disabled-onLight);border-color:var(--ds-borderColor-disabled-onLight)}.ds-input--container.sc-ds-text-input:has(input:active){outline:none}.ds-input--container.sc-ds-text-input:has(input:active):not:has(input:disabled,input.sc-ds-text-input:readonly){border-color:var(--ds-borderColor-default)}.ds-input--container.active.sc-ds-text-input:not(.ds-input--container.disabled,.ds-input--container.readonly.sc-ds-text-input,.ds-input--container.invalid.sc-ds-text-input,.ds-input--container.valid).sc-ds-text-input{border-color:var(--ds-borderColor-default);background-color:var(--ds-bgColor-white-active)}.ds-input--container.sc-ds-text-input:hover:not(.ds-input--container.disabled,.ds-input--container.readonly.sc-ds-text-input,.ds-input--container.active.sc-ds-text-input,.ds-input--container.invalid.sc-ds-text-input,.ds-input--container.valid.sc-ds-text-input,.ds-input--container.sc-ds-text-input:focus-within){border-color:var(--ds-borderColor-default);background-color:var(--ds-bgColor-white-hover)}.ds-input--container.sc-ds-text-input:focus-within:not(.ds-input--container:focus-within.invalid,.ds-input--container.sc-ds-text-input:focus-within.valid,.ds-input--container.sc-ds-text-input:focus-within.readonly){border-color:var(--ds-borderColor-primary)}.ds-input--container.sc-ds-text-input:focus-within *.sc-ds-text-input>ds-button.suffix.sc-ds-text-input>button.sc-ds-text-input:focus-visible{background-clip:padding-box;outline-offset:-5px;box-shadow:none;height:var(--ds-spacing-xLarge);background-color:var(--ds-bgColor-transparent-onLight-hover)}.ds-input--container.sc-ds-text-input>input.sc-ds-text-input{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);width:100%;box-sizing:border-box;background-color:unset;flex-grow:1;height:var(--ds-spacing-xLarge);line-height:var(--ds-fontSize-24);color:var(--ds-textColor-default);border:none;padding-block:var(--ds-spacing-4xSmall)}.ds-input--container.sc-ds-text-input>input.sc-ds-text-input:disabled{color:var(--ds-textColor-disabled-onLight)}.ds-input--container.sc-ds-text-input>input.sc-ds-text-input:disabled::placeholder{color:var(--ds-textColor-disabled-onLight)}.ds-input--container.sc-ds-text-input>input.sc-ds-text-input::placeholder{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);color:var(--ds-textColor-secondary)}.ds-input--container.sc-ds-text-input>input.sc-ds-text-input:focus{outline:none;border:none}.ds-input--container.sc-ds-text-input>input[type=number].sc-ds-text-input{-moz-appearance:textfield}.ds-input--container.sc-ds-text-input>input.sc-ds-text-input::-webkit-search-decoration,.ds-input--container.sc-ds-text-input>input.sc-ds-text-input::-webkit-search-cancel-button,.ds-input--container.sc-ds-text-input>input.sc-ds-text-input::-webkit-search-results-button,.ds-input--container.sc-ds-text-input>input.sc-ds-text-input::-webkit-search-results-decoration,.ds-input--container.sc-ds-text-input>input.sc-ds-text-input::-webkit-inner-spin-button,.ds-input--container.sc-ds-text-input>input.sc-ds-text-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.ds-input--container.sc-ds-text-input:has(span.prefix,ds-icon.prefix).sc-ds-text-input{padding-inline-start:var(--ds-spacing-2xSmall)}.ds-input--container.sc-ds-text-input:has(span.prefix,ds-icon.prefix).sc-ds-text-input>input.sc-ds-text-input{padding-inline-start:var(--ds-spacing-2xSmall)}.ds-input--container.sc-ds-text-input:has(ds-button.suffix){padding-inline-end:unset}.ds-input--container.sc-ds-text-input span.prefix.sc-ds-text-input,.ds-input--container.sc-ds-text-input span.suffix.sc-ds-text-input{color:var(--ds-palette-black-70)}.ds-input--container.sc-ds-text-input ds-icon.prefix.sc-ds-text-input,.ds-input--container.sc-ds-text-input-s>[slot=prefix],.ds-input--container .sc-ds-text-input-s>[slot=prefix]{height:1.5rem;color:var(--ds-textColor-default)}.ds-input--container.sc-ds-text-input ds-button.suffix.sc-ds-text-input{margin-top:calc(var(--ds-spacing-3xSmall) * -1);margin-right:calc(var(--ds-spacing-4xSmall) * -1);max-height:40px}.error-text--container.sc-ds-text-input,.success-text--container.sc-ds-text-input{display:flex;align-items:center;margin-top:var(--ds-spacing-2xSmall);gap:var(--ds-spacing-2xSmall)}.error-text--container.sc-ds-text-input ds-icon.sc-ds-text-input,.success-text--container.sc-ds-text-input ds-icon.sc-ds-text-input{display:block;height:1.5rem}.error-text--container.sc-ds-text-input small.sc-ds-text-input,.success-text--container.sc-ds-text-input small.sc-ds-text-input{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}.error-text--container.sc-ds-text-input{color:var(--ds-textColor-danger)}.success-text--container.sc-ds-text-input{color:var(--ds-textColor-success)}";
|
|
10
11
|
const DsTextInputStyle0 = dsTextInputCss;
|
|
11
12
|
|
|
12
13
|
const INPUT_TYPE_ICONS_MAP = {
|
|
@@ -16,6 +17,7 @@ const INPUT_TYPE_ACTION_BUTTON_ICON_MAP = {
|
|
|
16
17
|
search: ({ clearButtonVisible }) => (clearButtonVisible ? 'cancel_fill' : ''),
|
|
17
18
|
password: ({ passwordInputVisible }) => (passwordInputVisible ? 'visibility_off_fill' : 'visibility_fill'),
|
|
18
19
|
};
|
|
20
|
+
const inputIdGenerator = utils.idGenerator('ds-input');
|
|
19
21
|
const assistiveTextIdGenerator = utils.idGenerator('ds-assistive-text');
|
|
20
22
|
const visuallyHiddenAssistiveTextIdGenerator = utils.idGenerator('visually-hidden-assistive-text');
|
|
21
23
|
const successTextIdGenerator = utils.idGenerator('success-text');
|
|
@@ -30,9 +32,12 @@ const DsTextInput = class {
|
|
|
30
32
|
visuallyHiddenAssistiveTextId = visuallyHiddenAssistiveTextIdGenerator.next().value;
|
|
31
33
|
successTextId = successTextIdGenerator.next().value;
|
|
32
34
|
errorTextId = errorTextIdGenerator.next().value;
|
|
35
|
+
hasPrefixSlot = false;
|
|
36
|
+
hasSuffixSlot = false;
|
|
37
|
+
get el() { return index.getElement(this); }
|
|
33
38
|
label;
|
|
34
39
|
placeholder;
|
|
35
|
-
dsId =
|
|
40
|
+
dsId = inputIdGenerator.next().value;
|
|
36
41
|
name;
|
|
37
42
|
disabled;
|
|
38
43
|
optional;
|
|
@@ -69,6 +74,19 @@ const DsTextInput = class {
|
|
|
69
74
|
this.inputElement.focus();
|
|
70
75
|
this.clearButtonVisible = false;
|
|
71
76
|
}
|
|
77
|
+
getLabelText = () => {
|
|
78
|
+
if (this.required) {
|
|
79
|
+
return controlUtils.getRequiredText(this.label);
|
|
80
|
+
}
|
|
81
|
+
if (this.optional) {
|
|
82
|
+
return controlUtils.getOptionalText(this.label, this.optionalText);
|
|
83
|
+
}
|
|
84
|
+
return this.label;
|
|
85
|
+
};
|
|
86
|
+
componentWillLoad() {
|
|
87
|
+
this.hasPrefixSlot = !!this.el.querySelector('[slot="prefix"]');
|
|
88
|
+
this.hasSuffixSlot = !!this.el.querySelector('[slot="suffix"]');
|
|
89
|
+
}
|
|
72
90
|
onActionButtonClicked = (e) => {
|
|
73
91
|
e.stopPropagation();
|
|
74
92
|
switch (this.type) {
|
|
@@ -88,6 +106,9 @@ const DsTextInput = class {
|
|
|
88
106
|
return (index.h("slot", { name: className }, text && (index.h("div", { class: `${className}--container` }, index.h("ds-icon", { name: icon }), index.h("small", { id: textId, class: className }, text)))));
|
|
89
107
|
}
|
|
90
108
|
renderPrefixContent() {
|
|
109
|
+
if (this.hasPrefixSlot) {
|
|
110
|
+
return index.h("slot", { name: "prefix" });
|
|
111
|
+
}
|
|
91
112
|
if (this.prefixText) {
|
|
92
113
|
return (index.h("slot", { name: "prefix" }, index.h("span", { class: "prefix" }, this.prefixText)));
|
|
93
114
|
}
|
|
@@ -98,6 +119,9 @@ const DsTextInput = class {
|
|
|
98
119
|
return null;
|
|
99
120
|
}
|
|
100
121
|
renderSuffixContent() {
|
|
122
|
+
if (this.hasSuffixSlot) {
|
|
123
|
+
return index.h("slot", { name: "suffix" });
|
|
124
|
+
}
|
|
101
125
|
if (this.suffixText) {
|
|
102
126
|
return (index.h("slot", { name: "suffix" }, index.h("span", { class: "suffix" }, this.suffixText)));
|
|
103
127
|
}
|
|
@@ -115,14 +139,14 @@ const DsTextInput = class {
|
|
|
115
139
|
}
|
|
116
140
|
render() {
|
|
117
141
|
const inputType = this.type === 'password' && this.passwordInputVisible ? 'text' : this.type;
|
|
118
|
-
return (index.h(index.Fragment, { key: '
|
|
142
|
+
return (index.h(index.Fragment, { key: '4d3ad7cc3f0d7c6aba4bcb8e5b05d0794b614f32' }, index.h("div", { key: '1cad6e50d1a9c0f4214824d1ff46a8418a095790', class: "ds-input--label-container" }, index.h("slot", { key: '67d096bb1eecd6ac492a5dcd14bd6f9bda21eb2c', name: "label" }, index.h("label", { key: 'cfffb9b06f2122dd80e4ad94831ca69b71e5a0de', htmlFor: this.dsId }, this.getLabelText())), index.h("slot", { key: '2256dfda0cf19eae50307b9badc2a2a97d9e190b', name: "help-text" }, index.h("small", { key: 'b9496a9afec60a4a64a0ff66505a7572362387ac', id: this.assistiveTextId }, this.assistiveText), index.h("ds-visually-hidden", { key: '23026b2453728e607802aabb7760f07229edeb7c', id: this.visuallyHiddenAssistiveTextId }, this.hiddenAssistiveText))), index.h("div", { key: '161a4d4eed706c5fd6ba2af90029e68b1c6b95c9', onMouseDown: () => (this.inputActive = true), onMouseUp: () => (this.inputActive = false), onClick: e => this.handleInputContainerClick(e), class: index$1.classNames('ds-input--container', {
|
|
119
143
|
disabled: this.disabled,
|
|
120
144
|
readonly: this.readonly,
|
|
121
145
|
valid: !!this.successText,
|
|
122
146
|
invalid: !!this.errorText,
|
|
123
147
|
focus: this.hasFocus,
|
|
124
148
|
active: !!this.inputActive,
|
|
125
|
-
}) }, this.renderPrefixContent(), index.h("input", { key: '
|
|
149
|
+
}) }, this.renderPrefixContent(), index.h("input", { key: 'a04e9ed4de86a65290206ca62efde1c27d76aa80', ref: e => (this.inputElement = e), id: this.dsId, name: this.name, "aria-label": this.ariaLabel, "aria-labelledby": this.ariaLabelledBy, "aria-describedby": this.ariaDescribedby ||
|
|
126
150
|
index$1.classNames(this.assistiveTextId, this.visuallyHiddenAssistiveTextId, {
|
|
127
151
|
[this.successTextId]: this.successText,
|
|
128
152
|
[this.errorTextId]: this.errorText,
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-b1d61146.js');
|
|
6
6
|
|
|
7
7
|
const dsVisuallyHiddenCss = ":host{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}";
|
|
8
8
|
const DsVisuallyHiddenStyle0 = dsVisuallyHiddenCss;
|
|
@@ -12,7 +12,7 @@ const DsVisuallyHidden = class {
|
|
|
12
12
|
index.registerInstance(this, hostRef);
|
|
13
13
|
}
|
|
14
14
|
render() {
|
|
15
|
-
return (index.h("slot", { key: '
|
|
15
|
+
return (index.h("slot", { key: '4307602964aa15c8d3f4fb0f4b89188cf0a8b55e' }));
|
|
16
16
|
}
|
|
17
17
|
};
|
|
18
18
|
DsVisuallyHidden.style = DsVisuallyHiddenStyle0;
|
|
@@ -21,7 +21,7 @@ function _interopNamespace(e) {
|
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
const NAMESPACE = 'component-library';
|
|
24
|
-
const BUILD = /* component-library */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad:
|
|
24
|
+
const BUILD = /* component-library */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: true, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: false, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: true, hasRenderFn: true, hostListener: true, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, modernPropertyDecls: true, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: false, scoped: true, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
|
|
25
25
|
|
|
26
26
|
/*
|
|
27
27
|
Stencil Client Platform v4.26.0 | MIT Licensed | https://stenciljs.com
|
|
@@ -124,6 +124,12 @@ var HYDRATED_STYLE_ID = "sty-id";
|
|
|
124
124
|
var HYDRATED_CSS = "{visibility:hidden}.hydrated{visibility:inherit}";
|
|
125
125
|
var SLOT_FB_CSS = "slot-fb{display:contents}slot-fb[hidden]{display:none}";
|
|
126
126
|
var XLINK_NS = "http://www.w3.org/1999/xlink";
|
|
127
|
+
var FORM_ASSOCIATED_CUSTOM_ELEMENT_CALLBACKS = [
|
|
128
|
+
"formAssociatedCallback",
|
|
129
|
+
"formResetCallback",
|
|
130
|
+
"formDisabledCallback",
|
|
131
|
+
"formStateRestoreCallback"
|
|
132
|
+
];
|
|
127
133
|
var win = typeof window !== "undefined" ? window : {};
|
|
128
134
|
var doc = win.document || { head: {} };
|
|
129
135
|
var plt = {
|
|
@@ -135,6 +141,22 @@ var plt = {
|
|
|
135
141
|
rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
|
|
136
142
|
ce: (eventName, opts) => new CustomEvent(eventName, opts)
|
|
137
143
|
};
|
|
144
|
+
var supportsListenerOptions = /* @__PURE__ */ (() => {
|
|
145
|
+
let supportsListenerOptions2 = false;
|
|
146
|
+
try {
|
|
147
|
+
doc.addEventListener(
|
|
148
|
+
"e",
|
|
149
|
+
null,
|
|
150
|
+
Object.defineProperty({}, "passive", {
|
|
151
|
+
get() {
|
|
152
|
+
supportsListenerOptions2 = true;
|
|
153
|
+
}
|
|
154
|
+
})
|
|
155
|
+
);
|
|
156
|
+
} catch (e) {
|
|
157
|
+
}
|
|
158
|
+
return supportsListenerOptions2;
|
|
159
|
+
})();
|
|
138
160
|
var promiseResolve = (v) => Promise.resolve(v);
|
|
139
161
|
var supportsConstructableStylesheets = /* @__PURE__ */ (() => {
|
|
140
162
|
try {
|
|
@@ -439,6 +461,21 @@ var parsePropertyValue = (propValue, propType) => {
|
|
|
439
461
|
return propValue;
|
|
440
462
|
};
|
|
441
463
|
var getElement = (ref) => getHostRef(ref).$hostElement$ ;
|
|
464
|
+
|
|
465
|
+
// src/runtime/event-emitter.ts
|
|
466
|
+
var createEvent = (ref, name, flags) => {
|
|
467
|
+
const elm = getElement(ref);
|
|
468
|
+
return {
|
|
469
|
+
emit: (detail) => {
|
|
470
|
+
return emitEvent(elm, name, {
|
|
471
|
+
bubbles: !!(flags & 4 /* Bubbles */),
|
|
472
|
+
composed: !!(flags & 2 /* Composed */),
|
|
473
|
+
cancelable: !!(flags & 1 /* Cancellable */),
|
|
474
|
+
detail
|
|
475
|
+
});
|
|
476
|
+
}
|
|
477
|
+
};
|
|
478
|
+
};
|
|
442
479
|
var emitEvent = (elm, name, opts) => {
|
|
443
480
|
const ev = plt.ce(name, opts);
|
|
444
481
|
elm.dispatchEvent(ev);
|
|
@@ -1183,6 +1220,13 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
|
|
|
1183
1220
|
}
|
|
1184
1221
|
let maybePromise;
|
|
1185
1222
|
if (isInitialLoad) {
|
|
1223
|
+
{
|
|
1224
|
+
hostRef.$flags$ |= 256 /* isListenReady */;
|
|
1225
|
+
if (hostRef.$queuedListeners$) {
|
|
1226
|
+
hostRef.$queuedListeners$.map(([methodName, event]) => safeCall(instance, methodName, event, elm));
|
|
1227
|
+
hostRef.$queuedListeners$ = void 0;
|
|
1228
|
+
}
|
|
1229
|
+
}
|
|
1186
1230
|
{
|
|
1187
1231
|
maybePromise = safeCall(instance, "componentWillLoad", void 0, elm);
|
|
1188
1232
|
}
|
|
@@ -1250,12 +1294,16 @@ var postUpdateComponent = (hostRef) => {
|
|
|
1250
1294
|
const tagName = hostRef.$cmpMeta$.$tagName$;
|
|
1251
1295
|
const elm = hostRef.$hostElement$;
|
|
1252
1296
|
const endPostUpdate = createTime("postUpdate", tagName);
|
|
1297
|
+
const instance = hostRef.$lazyInstance$ ;
|
|
1253
1298
|
const ancestorComponent = hostRef.$ancestorComponent$;
|
|
1254
1299
|
if (!(hostRef.$flags$ & 64 /* hasLoadedComponent */)) {
|
|
1255
1300
|
hostRef.$flags$ |= 64 /* hasLoadedComponent */;
|
|
1256
1301
|
{
|
|
1257
1302
|
addHydratedFlag(elm);
|
|
1258
1303
|
}
|
|
1304
|
+
{
|
|
1305
|
+
safeCall(instance, "componentDidLoad", void 0, elm);
|
|
1306
|
+
}
|
|
1259
1307
|
endPostUpdate();
|
|
1260
1308
|
{
|
|
1261
1309
|
hostRef.$onReadyResolve$(elm);
|
|
@@ -1264,6 +1312,9 @@ var postUpdateComponent = (hostRef) => {
|
|
|
1264
1312
|
}
|
|
1265
1313
|
}
|
|
1266
1314
|
} else {
|
|
1315
|
+
{
|
|
1316
|
+
safeCall(instance, "componentDidUpdate", void 0, elm);
|
|
1317
|
+
}
|
|
1267
1318
|
endPostUpdate();
|
|
1268
1319
|
}
|
|
1269
1320
|
{
|
|
@@ -1340,6 +1391,25 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
|
|
|
1340
1391
|
var proxyComponent = (Cstr, cmpMeta, flags) => {
|
|
1341
1392
|
var _a, _b;
|
|
1342
1393
|
const prototype = Cstr.prototype;
|
|
1394
|
+
if (cmpMeta.$flags$ & 64 /* formAssociated */ && flags & 1 /* isElementConstructor */) {
|
|
1395
|
+
FORM_ASSOCIATED_CUSTOM_ELEMENT_CALLBACKS.forEach((cbName) => {
|
|
1396
|
+
Object.defineProperty(prototype, cbName, {
|
|
1397
|
+
value(...args) {
|
|
1398
|
+
const hostRef = getHostRef(this);
|
|
1399
|
+
const instance = hostRef.$lazyInstance$ ;
|
|
1400
|
+
if (!instance) {
|
|
1401
|
+
hostRef.$onReadyPromise$.then((asyncInstance) => {
|
|
1402
|
+
const cb = asyncInstance[cbName];
|
|
1403
|
+
typeof cb === "function" && cb.call(asyncInstance, ...args);
|
|
1404
|
+
});
|
|
1405
|
+
} else {
|
|
1406
|
+
const cb = instance[cbName] ;
|
|
1407
|
+
typeof cb === "function" && cb.call(instance, ...args);
|
|
1408
|
+
}
|
|
1409
|
+
}
|
|
1410
|
+
});
|
|
1411
|
+
});
|
|
1412
|
+
}
|
|
1343
1413
|
if (cmpMeta.$members$ || (cmpMeta.$watchers$ || Cstr.watchers)) {
|
|
1344
1414
|
if (Cstr.watchers && !cmpMeta.$watchers$) {
|
|
1345
1415
|
cmpMeta.$watchers$ = Cstr.watchers;
|
|
@@ -1577,6 +1647,7 @@ var connectedCallback = (elm) => {
|
|
|
1577
1647
|
initializeComponent(elm, hostRef, cmpMeta);
|
|
1578
1648
|
}
|
|
1579
1649
|
} else {
|
|
1650
|
+
addHostEventListeners(elm, hostRef, cmpMeta.$listeners$);
|
|
1580
1651
|
if (hostRef == null ? void 0 : hostRef.$lazyInstance$) ; else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
|
|
1581
1652
|
hostRef.$onReadyPromise$.then(() => fireConnectedCallback());
|
|
1582
1653
|
}
|
|
@@ -1596,6 +1667,12 @@ var disconnectInstance = (instance, elm) => {
|
|
|
1596
1667
|
var disconnectedCallback = async (elm) => {
|
|
1597
1668
|
if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
|
|
1598
1669
|
const hostRef = getHostRef(elm);
|
|
1670
|
+
{
|
|
1671
|
+
if (hostRef.$rmListeners$) {
|
|
1672
|
+
hostRef.$rmListeners$.map((rmListener) => rmListener());
|
|
1673
|
+
hostRef.$rmListeners$ = void 0;
|
|
1674
|
+
}
|
|
1675
|
+
}
|
|
1599
1676
|
if (hostRef == null ? void 0 : hostRef.$lazyInstance$) ; else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
|
|
1600
1677
|
hostRef.$onReadyPromise$.then(() => disconnectInstance());
|
|
1601
1678
|
}
|
|
@@ -1639,6 +1716,9 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1639
1716
|
{
|
|
1640
1717
|
cmpMeta.$members$ = compactMeta[2];
|
|
1641
1718
|
}
|
|
1719
|
+
{
|
|
1720
|
+
cmpMeta.$listeners$ = compactMeta[3];
|
|
1721
|
+
}
|
|
1642
1722
|
{
|
|
1643
1723
|
cmpMeta.$watchers$ = (_a2 = compactMeta[4]) != null ? _a2 : {};
|
|
1644
1724
|
}
|
|
@@ -1667,9 +1747,10 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1667
1747
|
}
|
|
1668
1748
|
}
|
|
1669
1749
|
connectedCallback() {
|
|
1670
|
-
getHostRef(this);
|
|
1750
|
+
const hostRef = getHostRef(this);
|
|
1671
1751
|
if (!this.hasRegisteredEventListeners) {
|
|
1672
1752
|
this.hasRegisteredEventListeners = true;
|
|
1753
|
+
addHostEventListeners(this, hostRef, cmpMeta.$listeners$);
|
|
1673
1754
|
}
|
|
1674
1755
|
if (appLoadFallback) {
|
|
1675
1756
|
clearTimeout(appLoadFallback);
|
|
@@ -1699,6 +1780,9 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1699
1780
|
return getHostRef(this).$onReadyPromise$;
|
|
1700
1781
|
}
|
|
1701
1782
|
};
|
|
1783
|
+
if (cmpMeta.$flags$ & 64 /* formAssociated */) {
|
|
1784
|
+
HostElement.formAssociated = true;
|
|
1785
|
+
}
|
|
1702
1786
|
cmpMeta.$lazyBundleId$ = lazyBundle[0];
|
|
1703
1787
|
if (!exclude.includes(tagName) && !customElements2.get(tagName)) {
|
|
1704
1788
|
cmpTags.push(tagName);
|
|
@@ -1738,12 +1822,42 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1738
1822
|
|
|
1739
1823
|
// src/runtime/fragment.ts
|
|
1740
1824
|
var Fragment = (_, children) => children;
|
|
1825
|
+
var addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
|
|
1826
|
+
if (listeners) {
|
|
1827
|
+
listeners.map(([flags, name, method]) => {
|
|
1828
|
+
const target = elm;
|
|
1829
|
+
const handler = hostListenerProxy(hostRef, method);
|
|
1830
|
+
const opts = hostListenerOpts(flags);
|
|
1831
|
+
plt.ael(target, name, handler, opts);
|
|
1832
|
+
(hostRef.$rmListeners$ = hostRef.$rmListeners$ || []).push(() => plt.rel(target, name, handler, opts));
|
|
1833
|
+
});
|
|
1834
|
+
}
|
|
1835
|
+
};
|
|
1836
|
+
var hostListenerProxy = (hostRef, methodName) => (ev) => {
|
|
1837
|
+
var _a;
|
|
1838
|
+
try {
|
|
1839
|
+
{
|
|
1840
|
+
if (hostRef.$flags$ & 256 /* isListenReady */) {
|
|
1841
|
+
(_a = hostRef.$lazyInstance$) == null ? void 0 : _a[methodName](ev);
|
|
1842
|
+
} else {
|
|
1843
|
+
(hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
|
|
1844
|
+
}
|
|
1845
|
+
}
|
|
1846
|
+
} catch (e) {
|
|
1847
|
+
consoleError(e, hostRef.$hostElement$);
|
|
1848
|
+
}
|
|
1849
|
+
};
|
|
1850
|
+
var hostListenerOpts = (flags) => supportsListenerOptions ? {
|
|
1851
|
+
passive: (flags & 1 /* Passive */) !== 0,
|
|
1852
|
+
capture: (flags & 2 /* Capture */) !== 0
|
|
1853
|
+
} : (flags & 2 /* Capture */) !== 0;
|
|
1741
1854
|
|
|
1742
1855
|
// src/runtime/nonce.ts
|
|
1743
1856
|
var setNonce = (nonce) => plt.$nonce$ = nonce;
|
|
1744
1857
|
|
|
1745
1858
|
exports.Fragment = Fragment;
|
|
1746
1859
|
exports.bootstrapLazy = bootstrapLazy;
|
|
1860
|
+
exports.createEvent = createEvent;
|
|
1747
1861
|
exports.getElement = getElement;
|
|
1748
1862
|
exports.h = h;
|
|
1749
1863
|
exports.promiseResolve = promiseResolve;
|
|
@@ -11,6 +11,16 @@ const visuallyHiddenAssistiveText = (lang) => {
|
|
|
11
11
|
return 'Opens in a new tab';
|
|
12
12
|
}
|
|
13
13
|
};
|
|
14
|
+
const getAriaLabel = (text, ariaLabel) => {
|
|
15
|
+
if (!ariaLabel) {
|
|
16
|
+
return undefined;
|
|
17
|
+
}
|
|
18
|
+
if (ariaLabel.startsWith(text)) {
|
|
19
|
+
return ariaLabel;
|
|
20
|
+
}
|
|
21
|
+
return [text, ariaLabel].join(' ');
|
|
22
|
+
};
|
|
14
23
|
|
|
24
|
+
exports.getAriaLabel = getAriaLabel;
|
|
15
25
|
exports.opensInNewTab = opensInNewTab;
|
|
16
26
|
exports.visuallyHiddenAssistiveText = visuallyHiddenAssistiveText;
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-b1d61146.js');
|
|
6
6
|
const appGlobals = require('./app-globals-3a1e7e63.js');
|
|
7
7
|
|
|
8
8
|
const defineCustomElements = async (win, options) => {
|
|
9
9
|
if (typeof window === 'undefined') return undefined;
|
|
10
10
|
await appGlobals.globalScripts();
|
|
11
|
-
return index.bootstrapLazy([["ds-
|
|
11
|
+
return index.bootstrapLazy([["ds-accordion_3.cjs",[[1,"ds-accordion",{"variant":[1],"borderAligned":[4,"border-aligned"],"openByDefault":[4,"open-by-default"],"accordionId":[1,"accordion-id"],"headingLevel":[2,"heading-level"],"useCloseButton":[4,"use-close-button"],"closeButtonLabel":[1,"close-button-label"],"hideTopBorder":[4,"hide-top-border"],"isExpanded":[32]},null,{"isExpanded":["watchHandler"]}],[6,"ds-button",{"value":[1],"variant":[1],"colour":[1],"size":[1],"fontWeight":[1,"font-weight"],"icon":[1],"iconPosition":[1,"icon-position"],"type":[1],"disabled":[4],"fullWidth":[4,"full-width"],"ariaDisabled":[1,"aria-disabled"]}],[1,"ds-icon",{"name":[1],"colour":[1],"size":[1],"dsTitle":[1,"title"],"role":[1],"hidden":[4],"message":[32]}]]],["ds-checkbox-group.cjs",[[1,"ds-checkbox-group",{"legend":[1],"assistiveText":[1,"assistive-text"],"direction":[1],"errorText":[1,"error-text"],"text":[1],"checked":[1028],"checkedChildElementCount":[1026,"checked-child-element-count"],"disabled":[4],"parentCheckedCount":[2,"parent-checked-count"],"childElementsCount":[32],"isIndeterminate":[32],"indeterminateChildCheckboxCount":[32],"setChecked":[64]},[[0,"dsCheckboxGroupIndeterminateChildChange","handleIndeterminateChildChange"],[0,"dsCheckboxChange","handleCheckboxChange"],[0,"dsCheckboxGroupChange","handleCheckboxGroupChange"]],{"disabled":["handleCheckboxDisabledChange"],"checked":["handleCheckedChange"],"isIndeterminate":["handleIndeterminateChange"],"checkedChildElementCount":["handleCheckedChildElementCountChange"]}]]],["ds-visually-hidden.cjs",[[1,"ds-visually-hidden"]]],["ds-text-input.cjs",[[6,"ds-text-input",{"label":[1],"placeholder":[1],"dsId":[1,"id"],"name":[1],"disabled":[4],"optional":[4],"required":[4],"readonly":[4],"value":[1],"min":[2],"max":[2],"maxlength":[2],"pattern":[1],"autocomplete":[1],"optionalText":[1,"optional-text"],"errorText":[1,"error-text"],"successText":[1,"success-text"],"assistiveText":[1,"assistive-text"],"actionButtonAriaLabel":[1,"action-button-aria-label"],"hiddenAssistiveText":[1,"hidden-assistive-text"],"prefixText":[1,"prefix-text"],"suffixText":[1,"suffix-text"],"icon":[1],"type":[1],"ariaLabel":[1,"aria-label"],"ariaLabelledBy":[1,"aria-labelledby"],"ariaDescribedby":[1,"aria-describedby"],"hasFocus":[32],"clearButtonVisible":[32],"passwordInputVisible":[32],"inputActive":[32],"togglePasswordVisibility":[64],"clearInput":[64]}]]],["ds-link.cjs",[[1,"ds-link",{"text":[1],"size":[1],"variant":[1],"weight":[1],"icon":[1025],"iconPosition":[1025,"icon-position"],"iconTitle":[1,"icon-title"],"iconHidden":[4,"icon-hidden"],"href":[1],"target":[1],"download":[4],"language":[1,"lang"],"ariaLabel":[1,"aria-label"]}]]],["ds-link-with-arrow.cjs",[[1,"ds-link-with-arrow",{"text":[1],"iconPosition":[1,"icon-position"],"href":[1],"target":[1],"language":[1,"lang"],"ariaLabel":[1,"aria-label"]}]]],["ds-input-validity.cjs",[[0,"ds-input-validity",{"text":[1],"type":[1],"role":[1],"identifier":[32]}]]],["ds-checkbox.cjs",[[65,"ds-checkbox",{"checkboxId":[1025,"id"],"checked":[1028],"legend":[1],"assistiveText":[1,"assistive-text"],"text":[1],"indeterminate":[4],"disabled":[4],"errorText":[1,"error-text"],"errorsDisabled":[4,"data-errors-disabled"],"required":[4],"optional":[4],"optionalText":[1,"optional-text"],"ariaLabel":[32],"value":[32],"validationMessage":[32]}]]]], options);
|
|
12
12
|
};
|
|
13
13
|
|
|
14
14
|
exports.setNonce = index.setNonce;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
const formatAs = (value, suffix) => value.endsWith(suffix) ? value : `${value}${suffix}`;
|
|
4
|
+
const formatAsPx = (value) => formatAs(value, 'px');
|
|
5
|
+
const remToPx = (remString) => {
|
|
6
|
+
const rootFontSize = 16;
|
|
7
|
+
const rem = parseFloat(remString);
|
|
8
|
+
return formatAsPx(`${rem * rootFontSize}`);
|
|
9
|
+
};
|
|
10
|
+
function* idGenerator(id) {
|
|
11
|
+
let currentId = 1;
|
|
12
|
+
while (true) {
|
|
13
|
+
yield `${id}-${currentId++}`;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
exports.idGenerator = idGenerator;
|
|
18
|
+
exports.remToPx = remToPx;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { html } from "lit";
|
|
2
|
+
const meta = {
|
|
3
|
+
title: 'Accessibility/aria-label',
|
|
4
|
+
};
|
|
5
|
+
export default meta;
|
|
6
|
+
export const HowToAriaLabel = {
|
|
7
|
+
name: 'How to "aria-label"',
|
|
8
|
+
render: () => html `
|
|
9
|
+
<ds-button aria-label="My profile Some other relevant thing" value="My profile"></ds-button>
|
|
10
|
+
<!This is a good example.>
|
|
11
|
+
`,
|
|
12
|
+
};
|
|
13
|
+
export const HowNotToAriaLabel = {
|
|
14
|
+
name: 'How not to "aria-label"',
|
|
15
|
+
render: () => html `
|
|
16
|
+
<ds-button aria-label="this will override the visible name of the button" value="My profile"></ds-button>
|
|
17
|
+
<!Think of this as a very bad example.>
|
|
18
|
+
`,
|
|
19
|
+
};
|