@uh-design-system/component-library 1.4.0-rc.2 → 1.4.0

package/dist/esm/ds-link-logo_2.entry.js

@@ -1,20 +1,20 @@
-import { M as Mixin, r as registerInstance, c as createEvent, d as getElement, f as forceUpdate, h } from './index-B4ZCBfpo.js';
+import { M as Mixin, r as registerInstance, c as createEvent, e as getElement, f as forceUpdate, h } from './index-WKPTmD1Z.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
 import { c as inheritSpecifiedAttributes, b as inheritAriaAttributes, i as inheritAttributes } from './attributes-DfbgRyXR.js';
 import { i as idGenerator, t as transformTagName, a as ifDefined, d as declareComponentDependencies, o as omit } from './utils-J5Ghj1_T.js';
-import { l as linkFactory } from './linkFactory-HDvWs7Ax.js';
-import { c as cx } from './cx-hUnOoCpm.js';
-import { o as opensInNewTab, v as visuallyHiddenAssistiveText } from './linkUtils-BMdgqvM-.js';
-import './store-I792JNgf.js';
+import { l as linkFactory } from './linkFactory-Dy94WoxH.js';
+import { c as cx } from './cx-jGcD6jB5.js';
+import { o as opensInNewTab, v as visuallyHiddenAssistiveText } from './linkUtils-Bh8gSuaY.js';
+import './store-CaI4gcSt.js';
 
-const dsLinkLogoCss = ".ds-no-style-leak *{all:unset;box-sizing:border-box;display:block}:host{display:inline-block}.ds-link-logo__oSBnIJ{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16)}.ds-link-logo__oSBnIJ:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-link-logo__oSBnIJ{display:flex;align-items:center;gap:var(--ds-spacing-2xSmall, 0.5rem);color:var(--ds-textColor-default, #0c0c0c);cursor:pointer;font-family:var(--ds-fontFamily-headings);font-size:var(--ds-fontSize-14, 0.875rem);font-weight:var(--ds-fontWeight-bold, 700);letter-spacing:-0.04375rem;line-height:1;text-transform:uppercase}.ds-link-logo__oSBnIJ:hover{color:var(--ds-bgColor-primary, #005a94)}@media (min-width: 60rem){.ds-link-logo__oSBnIJ{font-size:var(--ds-fontSize-16, 1rem)}}";
+const dsLinkLogoCss = () => `.ds-no-style-leak *{all:unset;box-sizing:border-box;display:block}:host{display:inline-block}.ds-link-logo__SPFJ1E{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16)}.ds-link-logo__SPFJ1E:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-link-logo__SPFJ1E{display:flex;align-items:center;gap:var(--ds-spacing-2xSmall, 0.5rem);color:var(--ds-textColor-default, #0c0c0c);cursor:pointer;font-family:var(--ds-fontFamily-headings);font-size:var(--ds-fontSize-14, 0.875rem);font-weight:var(--ds-fontWeight-bold, 700);letter-spacing:-0.04375rem;line-height:1;text-transform:uppercase}.ds-link-logo__SPFJ1E:hover{color:var(--ds-bgColor-primary, #005a94)}@media (min-width: 60rem){.ds-link-logo__SPFJ1E{font-size:var(--ds-fontSize-16, 1rem)}}`;
 
 const visuallyHiddenAssistiveTextIdGenerator = idGenerator('visually-hidden-assistive-text');
 const DsLinkLogo = class extends Mixin(linkFactory) {
     constructor(hostRef) {
         super();
         registerInstance(this, hostRef);
-        this.dsClick = createEvent(this, "dsClick");
+        this.dsClick = createEvent(this, "dsClick", 7);
     }
     inheritedAttributes = {};
     visuallyHiddenAssistiveTextId = visuallyHiddenAssistiveTextIdGenerator.next().value;
@@ -72,16 +72,18 @@ const DsLinkLogo = class extends Mixin(linkFactory) {
         const { ['aria-label']: attrAriaLabel, ['aria-labelledby']: attrAriaLabelledby, ...restAttributes } = this.inheritedAttributes;
         const ariaLabel = this.dsAriaLabel || attrAriaLabel;
         const ariaLabelledby = this.dsAriaLabelledby || attrAriaLabelledby;
-        return (h(this.dsTag, { key: 'a0e795f53eba7b011b91f104bf8f2190ec2738de', part: "link", class: classes, ...ifDefined('aria-label', ariaLabel), ...ifDefined('aria-labelledby', ariaLabelledby), ...restAttributes, ...this.linkAttributes }, this.dsIcon && h(this.DsIcon, { key: '935d89af0864fe2d152b390cba0bb954c8ee2c54', dsName: this.dsIcon, dsSize: "2rem", dsRole: "img" }), this.dsText, opensInNewTab(this.dsTarget) && (h(DsVisuallyHidden, { key: 'a91748eeaf4354db7ec7841580bee06c80f72422', id: this.visuallyHiddenAssistiveTextId, dsTag: "span" }, visuallyHiddenAssistiveText()))));
+        return (h(this.dsTag, { key: 'c22bfdb0d15a07deab3dda38c87ecdc8dcda13e6', part: "link", class: classes, ...ifDefined('aria-label', ariaLabel), ...ifDefined('aria-labelledby', ariaLabelledby), ...restAttributes, ...this.linkAttributes }, this.dsIcon && h(this.DsIcon, { key: 'd6ba5703084ef752b5e54bb4286fded73c127dac', dsName: this.dsIcon, dsSize: "2rem", dsRole: "img" }), this.dsText, opensInNewTab(this.dsTarget) && (h(DsVisuallyHidden, { key: 'e134912dfff02fcb1d447d2d089fa061daaeb33a', id: this.visuallyHiddenAssistiveTextId, dsTag: "span" }, visuallyHiddenAssistiveText()))));
     }
     static get watchers() { return {
-        "aria-label": ["onAriaChanged"]
+        "aria-label": [{
+                "onAriaChanged": 0
+            }]
     }; }
 };
 declareComponentDependencies([h("ds-icon", { dsName: "" }), h("ds-link", { dsText: "" })]);
-DsLinkLogo.style = dsLinkLogoCss;
+DsLinkLogo.style = dsLinkLogoCss();
 
-const dsTagCss = ".ds-no-style-leak *{all:unset;box-sizing:border-box;display:block}.ds-tag__oSBnIJ{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16)}.ds-tag__oSBnIJ:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-tag__oSBnIJ:focus-within{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-tag__oSBnIJ{box-sizing:border-box;display:inline-flex;align-items:center;min-height:1.5rem;background-color:var(--ds-bgColor-neutral);padding:calc(var(--ds-spacing-4xSmall) - 0.03125rem) var(--ds-spacing-2xSmall);gap:var(--ds-spacing-3xSmall)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--default{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-neutral)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--default:has(.ds-tag__oSBnIJ__link:hover){background-color:var(--ds-bgColor-neutral-hover)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--default:has(.ds-tag__oSBnIJ__link:active){background-color:var(--ds-bgColor-neutral-active)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--black{color:var(--ds-textColor-white);background-color:var(--ds-bgColor-black)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--black:has(.ds-tag__oSBnIJ__link:hover){background-color:var(--ds-bgColor-black-hover)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--black:has(.ds-tag__oSBnIJ__link:active){background-color:var(--ds-bgColor-black-active)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--white{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-white)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--white:has(.ds-tag__oSBnIJ__link:hover){background-color:var(--ds-bgColor-white-hover)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--white:has(.ds-tag__oSBnIJ__link:active){background-color:var(--ds-bgColor-white-active)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--info{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-info)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--info:has(.ds-tag__oSBnIJ__link:hover){background-color:var(--ds-bgColor-info-hover)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--info:has(.ds-tag__oSBnIJ__link:active){background-color:var(--ds-bgColor-info-active)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--danger{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-danger)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--danger:has(.ds-tag__oSBnIJ__link:hover){background-color:var(--ds-bgColor-danger-hover)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--danger:has(.ds-tag__oSBnIJ__link:active){background-color:var(--ds-bgColor-danger-active)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--attention{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-attention)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--attention:has(.ds-tag__oSBnIJ__link:hover){background-color:var(--ds-bgColor-attention-hover)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--attention:has(.ds-tag__oSBnIJ__link:active){background-color:var(--ds-bgColor-attention-active)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--success{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-success)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--success:has(.ds-tag__oSBnIJ__link:hover){background-color:var(--ds-bgColor-success-hover)}.ds-tag__oSBnIJ.ds-tag__oSBnIJ--success:has(.ds-tag__oSBnIJ__link:active){background-color:var(--ds-bgColor-success-active)}.ds-tag__oSBnIJ__text{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-semibold);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}.ds-tag__oSBnIJ__link{display:contents}.ds-tag__oSBnIJ__link::part(link):focus-visible{box-shadow:none;outline:none;outline-offset:none}";
+const dsTagCss = () => `.ds-no-style-leak *{all:unset;box-sizing:border-box;display:block}.ds-tag__SPFJ1E{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16)}.ds-tag__SPFJ1E:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-tag__SPFJ1E:focus-within{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-tag__SPFJ1E{box-sizing:border-box;display:inline-flex;align-items:center;min-height:1.5rem;background-color:var(--ds-bgColor-neutral);padding:calc(var(--ds-spacing-4xSmall) - 0.03125rem) var(--ds-spacing-2xSmall);gap:var(--ds-spacing-3xSmall)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--default{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-neutral)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--default:has(.ds-tag__SPFJ1E__link:hover){background-color:var(--ds-bgColor-neutral-hover)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--default:has(.ds-tag__SPFJ1E__link:active){background-color:var(--ds-bgColor-neutral-active)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--black{color:var(--ds-textColor-white);background-color:var(--ds-bgColor-black)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--black:has(.ds-tag__SPFJ1E__link:hover){background-color:var(--ds-bgColor-black-hover)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--black:has(.ds-tag__SPFJ1E__link:active){background-color:var(--ds-bgColor-black-active)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--white{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-white)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--white:has(.ds-tag__SPFJ1E__link:hover){background-color:var(--ds-bgColor-white-hover)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--white:has(.ds-tag__SPFJ1E__link:active){background-color:var(--ds-bgColor-white-active)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--info{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-info)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--info:has(.ds-tag__SPFJ1E__link:hover){background-color:var(--ds-bgColor-info-hover)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--info:has(.ds-tag__SPFJ1E__link:active){background-color:var(--ds-bgColor-info-active)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--danger{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-danger)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--danger:has(.ds-tag__SPFJ1E__link:hover){background-color:var(--ds-bgColor-danger-hover)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--danger:has(.ds-tag__SPFJ1E__link:active){background-color:var(--ds-bgColor-danger-active)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--attention{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-attention)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--attention:has(.ds-tag__SPFJ1E__link:hover){background-color:var(--ds-bgColor-attention-hover)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--attention:has(.ds-tag__SPFJ1E__link:active){background-color:var(--ds-bgColor-attention-active)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--success{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-success)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--success:has(.ds-tag__SPFJ1E__link:hover){background-color:var(--ds-bgColor-success-hover)}.ds-tag__SPFJ1E.ds-tag__SPFJ1E--success:has(.ds-tag__SPFJ1E__link:active){background-color:var(--ds-bgColor-success-active)}.ds-tag__SPFJ1E__text{font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-semibold);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large)}.ds-tag__SPFJ1E__link{display:contents}.ds-tag__SPFJ1E__link::part(link):focus-visible{box-shadow:none;outline:none;outline-offset:none}`;
 
 const DsTag = class {
     constructor(hostRef) {
@@ -114,10 +116,10 @@ const DsTag = class {
         const ariaHidden = this.dsAriaHidden !== undefined ? this.dsAriaHidden : this.dsHref ? false : true;
         const role = this.dsRole ?? this.inheritedAttributes.role;
         const restAttributes = omit(this.inheritedAttributes, ['aria-hidden', 'role']);
-        return (h("div", { key: '9683346fa7b290810e7fc26537dcc81c29f63593', class: classes, ...restAttributes, "aria-hidden": ariaHidden, role: role }, h("slot", { key: 'c7267550496a43ad448f07c2c0a6737419002feb', name: "prefix" }, !this.dsHref && this.dsIcon && this.dsIconPosition === 'start' ? h(DsIcon, { dsName: this.dsIcon, dsSize: "1rem" }) : null), h("slot", { key: '9603043bd16cc29168add57c71efdb0b21670b5f' }, this.dsHref ? (h(DsLink, { class: `${baseClass}__link`, dsText: this.dsText, dsHref: this.dsHref, dsTarget: this.dsTarget, dsDownload: this.dsDownload, dsColour: this.dsColour === 'black' ? 'white' : 'black', dsSize: "small", dsWeight: "semibold" })) : (h("span", { class: `${baseClass}__text` }, this.dsText))), h("slot", { key: '1443584c285df865d184d910798df05143c9b80c', name: "suffix" }, !this.dsHref && this.dsIcon && this.dsIconPosition === 'end' ? h(DsIcon, { dsName: this.dsIcon, dsSize: "1rem" }) : null)));
+        return (h("div", { key: 'd9d997face7b1d347d89d2ed42973bd4c6c2176a', class: classes, ...restAttributes, "aria-hidden": ariaHidden, role: role }, h("slot", { key: '08f9b77a75d1e26d4e58383c0e6f55f1e2eeb55a', name: "prefix" }, !this.dsHref && this.dsIcon && this.dsIconPosition === 'start' ? h(DsIcon, { dsName: this.dsIcon, dsSize: "1rem" }) : null), h("slot", { key: 'f6f31221e173e54321d45d3b423db830b371269e' }, this.dsHref ? (h(DsLink, { class: `${baseClass}__link`, dsText: this.dsText, dsHref: this.dsHref, dsTarget: this.dsTarget, dsDownload: this.dsDownload, dsColour: this.dsColour === 'black' ? 'white' : 'black', dsSize: "small", dsWeight: "semibold" })) : (h("span", { class: `${baseClass}__text` }, this.dsText))), h("slot", { key: '6515a21c36bd267d5ac6132fd6509d480f7f8112', name: "suffix" }, !this.dsHref && this.dsIcon && this.dsIconPosition === 'end' ? h(DsIcon, { dsName: this.dsIcon, dsSize: "1rem" }) : null)));
     }
 };
 declareComponentDependencies([h("ds-icon", { dsName: "" }), h("ds-link", { dsText: "" })]);
-DsTag.style = dsTagCss;
+DsTag.style = dsTagCss();
 
 export { DsLinkLogo as ds_link_logo, DsTag as ds_tag };

package/dist/esm/ds-link-with-arrow.entry.js

@@ -1,22 +1,22 @@
-import { M as Mixin, r as registerInstance, c as createEvent, d as getElement, h } from './index-B4ZCBfpo.js';
+import { M as Mixin, r as registerInstance, c as createEvent, e as getElement, h } from './index-WKPTmD1Z.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
 import { b as inheritAriaAttributes, i as inheritAttributes } from './attributes-DfbgRyXR.js';
-import { o as opensInNewTab, v as visuallyHiddenAssistiveText } from './linkUtils-BMdgqvM-.js';
+import { o as opensInNewTab, v as visuallyHiddenAssistiveText } from './linkUtils-Bh8gSuaY.js';
 import { i as idGenerator, t as transformTagName, a as ifDefined, d as declareComponentDependencies } from './utils-J5Ghj1_T.js';
-import { l as linkFactory } from './linkFactory-HDvWs7Ax.js';
-import { a as ariaDeprecationFactory } from './ariaDeprecationFactory-DXsGmVd4.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { l as linkFactory } from './linkFactory-Dy94WoxH.js';
+import { a as ariaDeprecationFactory } from './ariaDeprecationFactory-DwC_l-Le.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 import { i as isGreaterThanEqualBreakpointMediaQuery } from './utils-BW1GUsO7.js';
-import './store-I792JNgf.js';
+import './store-CaI4gcSt.js';
 
-const dsLinkWithArrowCss = ":host{display:inline-block}:host:has(.ds-link-with-arrow__oSBnIJ--full-width){width:100%}.ds-link-with-arrow__oSBnIJ:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-link-with-arrow__oSBnIJ{display:inline-flex;align-items:center;color:var(--ds-textColor-link);letter-spacing:var(--ds-letterSpacing-wide);font-family:var(--ds-fontFamily-body);font-weight:var(--ds-fontWeight-semibold);font-size:var(--ds-fontSize-16);text-decoration-line:none}@media (min-width: 30rem){.ds-link-with-arrow__oSBnIJ{font-size:var(--ds-fontSize-18)}}.ds-link-with-arrow__oSBnIJ--full-width{width:100%;justify-content:space-between}.ds-link-with-arrow__oSBnIJ__icon{display:inline-flex;flex-shrink:0;width:2rem;height:2rem;line-height:0;align-items:center;justify-content:center;color:var(--ds-textColor-white);background-color:var(--ds-bgColor-primary)}@media (min-width: 30rem){.ds-link-with-arrow__oSBnIJ__icon{width:2.5rem;height:2.5rem}}.ds-link-with-arrow__oSBnIJ__icon--start{margin-right:var(--ds-spacing-xSmall)}.ds-link-with-arrow__oSBnIJ__icon--end{margin-left:var(--ds-spacing-xSmall)}:hover slot>.ds-link-with-arrow__oSBnIJ__icon{background-color:var(--ds-bgColor-primary-hover)}:active slot>.ds-link-with-arrow__oSBnIJ__icon{background-color:var(--ds-bgColor-primary-active)}.ds-link-with-arrow__oSBnIJ:hover,.ds-link-with-arrow__oSBnIJ: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__oSBnIJ:hover{color:var(--ds-textColor-link-hover)}.ds-link-with-arrow__oSBnIJ:active,.ds-link-with-arrow__oSBnIJ:focus-visible{color:var(--ds-textColor-link-active)}";
+const dsLinkWithArrowCss = () => `:host{display:inline-block}:host:has(.ds-link-with-arrow__SPFJ1E--full-width){width:100%}.ds-link-with-arrow__SPFJ1E:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-link-with-arrow__SPFJ1E{display:inline-flex;align-items:center;color:var(--ds-textColor-link);letter-spacing:var(--ds-letterSpacing-wide);font-family:var(--ds-fontFamily-body);font-weight:var(--ds-fontWeight-semibold);font-size:var(--ds-fontSize-16);text-decoration-line:none}@media (min-width: 30rem){.ds-link-with-arrow__SPFJ1E{font-size:var(--ds-fontSize-18)}}.ds-link-with-arrow__SPFJ1E--full-width{width:100%;justify-content:space-between}.ds-link-with-arrow__SPFJ1E__icon{display:inline-flex;flex-shrink:0;width:2rem;height:2rem;line-height:0;align-items:center;justify-content:center;color:var(--ds-textColor-white);background-color:var(--ds-bgColor-primary)}@media (min-width: 30rem){.ds-link-with-arrow__SPFJ1E__icon{width:2.5rem;height:2.5rem}}.ds-link-with-arrow__SPFJ1E__icon--start{margin-right:var(--ds-spacing-xSmall)}.ds-link-with-arrow__SPFJ1E__icon--end{margin-left:var(--ds-spacing-xSmall)}:hover slot>.ds-link-with-arrow__SPFJ1E__icon{background-color:var(--ds-bgColor-primary-hover)}:active slot>.ds-link-with-arrow__SPFJ1E__icon{background-color:var(--ds-bgColor-primary-active)}.ds-link-with-arrow__SPFJ1E:hover,.ds-link-with-arrow__SPFJ1E: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__SPFJ1E:hover{color:var(--ds-textColor-link-hover)}.ds-link-with-arrow__SPFJ1E:active,.ds-link-with-arrow__SPFJ1E:focus-visible{color:var(--ds-textColor-link-active)}`;
 
 const visuallyHiddenAssistiveTextIdGenerator = idGenerator('visually-hidden-assistive-text');
 const DsLinkWithArrow = class extends Mixin(linkFactory, ariaDeprecationFactory) {
     constructor(hostRef) {
         super();
         registerInstance(this, hostRef);
-        this.dsClick = createEvent(this, "dsClick");
+        this.dsClick = createEvent(this, "dsClick", 7);
     }
     inheritedAttributes = {};
     isGreaterThanEqualSmallMediaQuery = isGreaterThanEqualBreakpointMediaQuery('small');
@@ -80,10 +80,10 @@ const DsLinkWithArrow = class extends Mixin(linkFactory, ariaDeprecationFactory)
         const { ['aria-label']: attrAriaLabel, ['aria-labelledby']: attrAriaLabelledby, ...restAttributes } = this.inheritedAttributes;
         const ariaLabel = this.dsAriaLabel || attrAriaLabel;
         const ariaLabelledby = this.dsAriaLabelledby || attrAriaLabelledby;
-        return (h(this.dsTag, { key: 'ad3dd25d78d622927798b8f18f346f7ad759a951', class: classes, ...ifDefined('aria-label', ariaLabel), ...ifDefined('aria-labelledby', ariaLabelledby), ...restAttributes, ...this.linkAttributes }, h("slot", { key: 'd316743492b6f16604be85e1da1aefbec170a474', name: "prefix" }, this.dsIconPosition === 'start' && h(DsIcon, { key: '670660fe3f99daac22d71ac4059d0b6308e0fed9', dsName: this.icon, class: iconClasses, dsSize: this.iconSize })), this.dsText, h("slot", { key: '0d5788fd52a05d440eeccfe02338a492698120e9', name: "suffix" }, this.dsIconPosition === 'end' && h(DsIcon, { key: '55fcb69cec4f307563d54e5e8e708bc52f0deaa5', dsName: this.icon, class: iconClasses, dsSize: this.iconSize })), opensInNewTab(this.dsTarget) && (h(DsVisuallyHidden, { key: '2562814fb0d5f2fb7cd214d58146f2328ec4a79f', id: this.visuallyHiddenAssistiveTextId, dsTag: "span" }, visuallyHiddenAssistiveText()))));
+        return (h(this.dsTag, { key: 'fc0f8980144f76aef80ffede688b5ad58dcf97bb', class: classes, ...ifDefined('aria-label', ariaLabel), ...ifDefined('aria-labelledby', ariaLabelledby), ...restAttributes, ...this.linkAttributes }, h("slot", { key: '1533ec6f843e4300c94c7bac1e0c72e9208fba06', name: "prefix" }, this.dsIconPosition === 'start' && h(DsIcon, { key: '481aefe4ed9760347c5417fccf79af4e9feb51a4', dsName: this.icon, class: iconClasses, dsSize: this.iconSize })), this.dsText, h("slot", { key: '4af8c0f99fb2fc5b132bee73a8a3e17a3bc166a9', name: "suffix" }, this.dsIconPosition === 'end' && h(DsIcon, { key: '270b77401665ba8c457f73704c7e310a9dfff0a2', dsName: this.icon, class: iconClasses, dsSize: this.iconSize })), opensInNewTab(this.dsTarget) && (h(DsVisuallyHidden, { key: '4959b02fbe4bf3891253864e36d1654ff671c4ab', id: this.visuallyHiddenAssistiveTextId, dsTag: "span" }, visuallyHiddenAssistiveText()))));
     }
 };
 declareComponentDependencies([h("ds-icon", { dsName: "" }), h("ds-visually-hidden", null)]);
-DsLinkWithArrow.style = dsLinkWithArrowCss;
+DsLinkWithArrow.style = dsLinkWithArrowCss();
 
 export { DsLinkWithArrow as ds_link_with_arrow };

package/dist/esm/ds-link.entry.js

@@ -1,14 +1,14 @@
-import { M as Mixin, r as registerInstance, c as createEvent, d as getElement, f as forceUpdate, h } from './index-B4ZCBfpo.js';
+import { M as Mixin, r as registerInstance, c as createEvent, e as getElement, f as forceUpdate, h } from './index-WKPTmD1Z.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
 import { b as inheritAriaAttributes, i as inheritAttributes } from './attributes-DfbgRyXR.js';
-import { o as opensInNewTab, v as visuallyHiddenAssistiveText } from './linkUtils-BMdgqvM-.js';
+import { o as opensInNewTab, v as visuallyHiddenAssistiveText } from './linkUtils-Bh8gSuaY.js';
 import { i as idGenerator, t as transformTagName, a as ifDefined, d as declareComponentDependencies } from './utils-J5Ghj1_T.js';
-import { l as linkFactory } from './linkFactory-HDvWs7Ax.js';
-import { a as ariaDeprecationFactory } from './ariaDeprecationFactory-DXsGmVd4.js';
-import { c as cx } from './cx-hUnOoCpm.js';
-import './store-I792JNgf.js';
+import { l as linkFactory } from './linkFactory-Dy94WoxH.js';
+import { a as ariaDeprecationFactory } from './ariaDeprecationFactory-DwC_l-Le.js';
+import { c as cx } from './cx-jGcD6jB5.js';
+import './store-CaI4gcSt.js';
 
-const dsLinkCss = ":host{display:inline}:host:has(.ds-link__oSBnIJ--standalone){display:inline-block}.ds-link__oSBnIJ:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-link__oSBnIJ{box-sizing:border-box;display:inline;color:var(--ds-textColor-link);font-family:var(--ds-fontFamily-body);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);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__oSBnIJ--semibold{font-weight:var(--ds-fontWeight-semibold)}.ds-link__oSBnIJ--bold{font-weight:var(--ds-fontWeight-bold)}.ds-link__oSBnIJ--2xLarge{font-size:var(--ds-fontSize-22)}.ds-link__oSBnIJ--xLarge{font-size:var(--ds-fontSize-20)}.ds-link__oSBnIJ--large{font-size:var(--ds-fontSize-18)}.ds-link__oSBnIJ--medium{font-size:var(--ds-fontSize-16)}.ds-link__oSBnIJ--small{font-size:var(--ds-fontSize-14)}.ds-link__oSBnIJ--xSmall{font-size:var(--ds-fontSize-12)}.ds-link__oSBnIJ__icon{display:inline-block;vertical-align:-0.125em}.ds-link__oSBnIJ__icon--start-inline{margin-right:var(--ds-spacing-3xSmall)}.ds-link__oSBnIJ__icon--start-standalone{margin-right:var(--ds-spacing-2xSmall)}.ds-link__oSBnIJ__icon--end-inline{margin-left:var(--ds-spacing-3xSmall)}.ds-link__oSBnIJ__icon--end-standalone{margin-left:var(--ds-spacing-2xSmall)}.ds-link__oSBnIJ:hover,.ds-link__oSBnIJ:active{text-decoration-thickness:13%;text-underline-offset:12%}.ds-link__oSBnIJ:hover{color:var(--ds-textColor-link-hover)}.ds-link__oSBnIJ:active{color:var(--ds-textColor-link-active)}.ds-link__oSBnIJ:visited{color:var(--ds-textColor-link-visited)}.ds-link__oSBnIJ--standalone{color:var(--ds-textColor-link);text-decoration-line:none}.ds-link__oSBnIJ--standalone:hover,.ds-link__oSBnIJ--standalone:active{text-decoration-line:underline}.ds-link__oSBnIJ--standalone:focus-visible,.ds-link__oSBnIJ--standalone:visited{color:var(--ds-textColor-link)}.ds-link__oSBnIJ--standalone:active{color:var(--ds-textColor-link-active)}.ds-link__oSBnIJ--standalone:hover{color:var(--ds-textColor-link-hover)}.ds-link__oSBnIJ--colour-white{color:var(--ds-textColor-white)}.ds-link__oSBnIJ--colour-white:hover,.ds-link__oSBnIJ--colour-white:active,.ds-link__oSBnIJ--colour-white:visited,.ds-link__oSBnIJ--colour-white:focus-visible{color:var(--ds-textColor-white)}.ds-link__oSBnIJ--colour-black{color:var(--ds-textColor-default)}.ds-link__oSBnIJ--colour-black:hover,.ds-link__oSBnIJ--colour-black:active,.ds-link__oSBnIJ--colour-black:visited,.ds-link__oSBnIJ--colour-black:focus-visible{color:var(--ds-textColor-default)}";
+const dsLinkCss = () => `:host{display:inline}:host:has(.ds-link__SPFJ1E--standalone){display:inline-block}.ds-link__SPFJ1E:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-link__SPFJ1E{box-sizing:border-box;display:inline;color:var(--ds-textColor-link);font-family:var(--ds-fontFamily-body);font-weight:var(--ds-fontWeight-regular);letter-spacing:var(--ds-letterSpacing-wide);line-height:var(--ds-lineHeight-large);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__SPFJ1E--semibold{font-weight:var(--ds-fontWeight-semibold)}.ds-link__SPFJ1E--bold{font-weight:var(--ds-fontWeight-bold)}.ds-link__SPFJ1E--2xLarge{font-size:var(--ds-fontSize-22)}.ds-link__SPFJ1E--xLarge{font-size:var(--ds-fontSize-20)}.ds-link__SPFJ1E--large{font-size:var(--ds-fontSize-18)}.ds-link__SPFJ1E--medium{font-size:var(--ds-fontSize-16)}.ds-link__SPFJ1E--small{font-size:var(--ds-fontSize-14)}.ds-link__SPFJ1E--xSmall{font-size:var(--ds-fontSize-12)}.ds-link__SPFJ1E__icon{display:inline-block;vertical-align:-0.125em}.ds-link__SPFJ1E__icon--start-inline{margin-right:var(--ds-spacing-3xSmall)}.ds-link__SPFJ1E__icon--start-standalone{margin-right:var(--ds-spacing-2xSmall)}.ds-link__SPFJ1E__icon--end-inline{margin-left:var(--ds-spacing-3xSmall)}.ds-link__SPFJ1E__icon--end-standalone{margin-left:var(--ds-spacing-2xSmall)}.ds-link__SPFJ1E:hover,.ds-link__SPFJ1E:active{text-decoration-thickness:13%;text-underline-offset:12%}.ds-link__SPFJ1E:hover{color:var(--ds-textColor-link-hover)}.ds-link__SPFJ1E:active{color:var(--ds-textColor-link-active)}.ds-link__SPFJ1E:visited{color:var(--ds-textColor-link-visited)}.ds-link__SPFJ1E--standalone{color:var(--ds-textColor-link);text-decoration-line:none}.ds-link__SPFJ1E--standalone:hover,.ds-link__SPFJ1E--standalone:active{text-decoration-line:underline}.ds-link__SPFJ1E--standalone:focus-visible,.ds-link__SPFJ1E--standalone:visited{color:var(--ds-textColor-link)}.ds-link__SPFJ1E--standalone:active{color:var(--ds-textColor-link-active)}.ds-link__SPFJ1E--standalone:hover{color:var(--ds-textColor-link-hover)}.ds-link__SPFJ1E--colour-white{color:var(--ds-textColor-white)}.ds-link__SPFJ1E--colour-white:hover,.ds-link__SPFJ1E--colour-white:active,.ds-link__SPFJ1E--colour-white:visited,.ds-link__SPFJ1E--colour-white:focus-visible{color:var(--ds-textColor-white)}.ds-link__SPFJ1E--colour-black{color:var(--ds-textColor-default)}.ds-link__SPFJ1E--colour-black:hover,.ds-link__SPFJ1E--colour-black:active,.ds-link__SPFJ1E--colour-black:visited,.ds-link__SPFJ1E--colour-black:focus-visible{color:var(--ds-textColor-default)}`;
 
 const visuallyHiddenAssistiveTextIdGenerator = idGenerator('visually-hidden-assistive-text');
 const linkIconSizeMap = {
@@ -23,7 +23,7 @@ const DsLink = class extends Mixin(linkFactory, ariaDeprecationFactory) {
     constructor(hostRef) {
         super();
         registerInstance(this, hostRef);
-        this.dsClick = createEvent(this, "dsClick");
+        this.dsClick = createEvent(this, "dsClick", 7);
     }
     inheritedAttributes = {};
     visuallyHiddenAssistiveTextId = visuallyHiddenAssistiveTextIdGenerator.next().value;
@@ -112,14 +112,18 @@ const DsLink = class extends Mixin(linkFactory, ariaDeprecationFactory) {
         const { ['aria-label']: attrAriaLabel, ['aria-labelledby']: attrAriaLabelledby, ...restAttributes } = this.inheritedAttributes;
         const ariaLabel = this.dsAriaLabel || attrAriaLabel;
         const ariaLabelledby = this.dsAriaLabelledby || attrAriaLabelledby;
-        return (h(this.dsTag, { key: 'd985419c4a5f78e353d4a3d393ad9b9204c37022', ref: el => (this.linkRef = el), part: "link", class: classes, ...ifDefined('aria-label', ariaLabel), ...ifDefined('aria-labelledby', ariaLabelledby), ...restAttributes, ...this.linkAttributes }, h("slot", { key: 'af6ce80796310e1ef08763bd6405012896c24a23', name: "prefix" }, this.dsIcon && this.dsIconPosition === 'start' && this.renderIcon(baseClass)), this.dsText, h("slot", { key: '88023fdf25b60b99f4a17bead37994cf1c2bc8f0', name: "suffix" }, this.renderSuffixIcon(baseClass)), opensInNewTab(this.dsTarget) && (h(DsVisuallyHidden, { key: '8ad4419b6399f0f1aaa828604ee1a6522383afaf', id: this.visuallyHiddenAssistiveTextId, dsTag: "span" }, visuallyHiddenAssistiveText()))));
+        return (h(this.dsTag, { key: '473090c1309762d7bf8be27568c1f35307774514', ref: el => (this.linkRef = el), part: "link", class: classes, ...ifDefined('aria-label', ariaLabel), ...ifDefined('aria-labelledby', ariaLabelledby), ...restAttributes, ...this.linkAttributes }, h("slot", { key: '8cdb65481a0b646a2fed499f5945bb81b03b164c', name: "prefix" }, this.dsIcon && this.dsIconPosition === 'start' && this.renderIcon(baseClass)), this.dsText, h("slot", { key: '4bb55caa2e5491181d99be9ecd73166175bf2e83', name: "suffix" }, this.renderSuffixIcon(baseClass)), opensInNewTab(this.dsTarget) && (h(DsVisuallyHidden, { key: '080db20d8bb58e5c230d2de759744daea0b2ce46', id: this.visuallyHiddenAssistiveTextId, dsTag: "span" }, visuallyHiddenAssistiveText()))));
     }
     static get watchers() { return {
-        "dsTarget": ["onTargetChanged"],
-        "aria-label": ["ariaLabelObserver"]
+        "dsTarget": [{
+                "onTargetChanged": 0
+            }],
+        "aria-label": [{
+                "ariaLabelObserver": 0
+            }]
     }; }
 };
 declareComponentDependencies([h("ds-icon", { dsName: "" }), h("ds-visually-hidden", null)]);
-DsLink.style = dsLinkCss;
+DsLink.style = dsLinkCss();
 
 export { DsLink as ds_link };

package/dist/esm/ds-media.entry.js

@@ -1,16 +1,16 @@
-import { h, r as registerInstance, c as createEvent, d as getElement } from './index-B4ZCBfpo.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { h, r as registerInstance, c as createEvent, e as getElement } from './index-WKPTmD1Z.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 import { d as declareComponentDependencies, a as ifDefined, t as transformTagName } from './utils-J5Ghj1_T.js';
 import { b as inheritAriaAttributes, i as inheritAttributes } from './attributes-DfbgRyXR.js';
-import { g as getLanguage } from './store-I792JNgf.js';
+import { g as getLanguage } from './store-CaI4gcSt.js';
 
-const dsMediaCss = ".ds-media__oSBnIJ{position:relative;width:100%;height:auto;overflow:hidden;background-color:var(--ds-palette-black-05)}.ds-media__oSBnIJ .ds-media__image,.ds-media__oSBnIJ .ds-media__video,.ds-media__oSBnIJ .ds-media__youtube{width:100%;height:100%;object-fit:cover;display:block;max-height:var(--horizontal-image-max-height, auto);aspect-ratio:var(--ds-media-aspect-ratio)}.ds-media__oSBnIJ .ds-media__image--fluid,.ds-media__oSBnIJ .ds-media__video--fluid,.ds-media__oSBnIJ .ds-media__youtube--fluid{aspect-ratio:unset}.ds-media__oSBnIJ__youtube{border:none;object-fit:initial}.ds-media__oSBnIJ--loading .ds-media__image,.ds-media__oSBnIJ--loading .ds-media__video{opacity:0}.ds-media__oSBnIJ--error{aspect-ratio:var(--ds-media-aspect-ratio)}.ds-media__oSBnIJ--error .ds-media__image,.ds-media__oSBnIJ--error .ds-media__video{display:none}.ds-media__oSBnIJ--error .ds-media__error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background-color:var(--ds-bgColor-secondary);color:var(--ds-bgColor-danger-bold);z-index:1;padding:16px;text-align:center}.ds-media__oSBnIJ--error .ds-media__error-icon{width:48px;height:48px;color:var(--ds-bgColor-danger-bold);flex-shrink:0}.ds-media__oSBnIJ--error .ds-media__error-text{font-size:14px;font-weight:500;line-height:1.4}.ds-media__oSBnIJ--image .ds-media__image{transition:opacity 0.3s ease}.ds-media__oSBnIJ--video .ds-media__video{transition:opacity 0.3s ease}.ds-media__oSBnIJ--youtube .ds-media__youtube{transition:opacity 0.3s ease}.ds-media__oSBnIJ--fluid{width:100%;height:100%}.ds-media__oSBnIJ--fluid .ds-media__oSBnIJ__image,.ds-media__oSBnIJ--fluid .ds-media__oSBnIJ__video,.ds-media__oSBnIJ--fluid .ds-media__oSBnIJ__youtube{width:100%;height:100%;object-fit:cover}@media (max-width: 768px){.ds-media__oSBnIJ{border-radius:2px}.ds-media__oSBnIJ__loading-spinner{width:24px;height:24px;border-width:2px}.ds-media__oSBnIJ__loading-text{font-size:12px}.ds-media__oSBnIJ__error-icon{width:40px;height:40px}.ds-media__oSBnIJ__error-text{font-size:12px}}";
+const dsMediaCss = () => `.ds-media__SPFJ1E{position:relative;width:100%;height:auto;overflow:hidden;background-color:var(--ds-palette-black-05)}.ds-media__SPFJ1E .ds-media__image,.ds-media__SPFJ1E .ds-media__video,.ds-media__SPFJ1E .ds-media__youtube{width:100%;height:100%;object-fit:cover;display:block;max-height:var(--horizontal-image-max-height, auto);aspect-ratio:var(--ds-media-aspect-ratio)}.ds-media__SPFJ1E .ds-media__image--fluid,.ds-media__SPFJ1E .ds-media__video--fluid,.ds-media__SPFJ1E .ds-media__youtube--fluid{aspect-ratio:unset}.ds-media__SPFJ1E__youtube{border:none;object-fit:initial}.ds-media__SPFJ1E--loading .ds-media__image,.ds-media__SPFJ1E--loading .ds-media__video{opacity:0}.ds-media__SPFJ1E--error{aspect-ratio:var(--ds-media-aspect-ratio)}.ds-media__SPFJ1E--error .ds-media__image,.ds-media__SPFJ1E--error .ds-media__video{display:none}.ds-media__SPFJ1E--error .ds-media__error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background-color:var(--ds-bgColor-secondary);color:var(--ds-bgColor-danger-bold);z-index:1;padding:16px;text-align:center}.ds-media__SPFJ1E--error .ds-media__error-icon{width:48px;height:48px;color:var(--ds-bgColor-danger-bold);flex-shrink:0}.ds-media__SPFJ1E--error .ds-media__error-text{font-size:14px;font-weight:500;line-height:1.4}.ds-media__SPFJ1E--image .ds-media__image{transition:opacity 0.3s ease}.ds-media__SPFJ1E--video .ds-media__video{transition:opacity 0.3s ease}.ds-media__SPFJ1E--youtube .ds-media__youtube{transition:opacity 0.3s ease}.ds-media__SPFJ1E--fluid{width:100%;height:100%}.ds-media__SPFJ1E--fluid .ds-media__SPFJ1E__image,.ds-media__SPFJ1E--fluid .ds-media__SPFJ1E__video,.ds-media__SPFJ1E--fluid .ds-media__SPFJ1E__youtube{width:100%;height:100%;object-fit:cover}@media (max-width: 768px){.ds-media__SPFJ1E{border-radius:2px}.ds-media__SPFJ1E__loading-spinner{width:24px;height:24px;border-width:2px}.ds-media__SPFJ1E__loading-text{font-size:12px}.ds-media__SPFJ1E__error-icon{width:40px;height:40px}.ds-media__SPFJ1E__error-text{font-size:12px}}`;
 
 const DsMedia = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.dsLoad = createEvent(this, "dsLoad");
-        this.dsError = createEvent(this, "dsError");
+        this.dsLoad = createEvent(this, "dsLoad", 7);
+        this.dsError = createEvent(this, "dsError", 7);
     }
     inheritedAttributes = {};
     dsSrc;
@@ -177,7 +177,7 @@ const DsMedia = class {
         const aspectRatioParts = this.dsAspectRatio.split('/');
         const aspectRatioValue = aspectRatioParts.length === 2 ? `${aspectRatioParts[0]} / ${aspectRatioParts[1]}` : this.dsAspectRatio;
         const baseClass = cx('ds-media');
-        return (h("div", { key: 'a87831e27a55e1006374189bd1d60ed1ffc74b88', class: {
+        return (h("div", { key: '1a5f9527435223be8dce54812bf17e83d30ac88d', class: {
                 [baseClass]: true,
                 [`${baseClass}--loading`]: this.isLoading,
                 [`${baseClass}--error`]: this.hasError,
@@ -190,11 +190,15 @@ const DsMedia = class {
             } }, this.isLoading && this.renderLoadingState(), this.hasError && this.renderErrorState(), !this.hasError && this.renderMedia()));
     }
     static get watchers() { return {
-        "dsSrc": ["onSrcChange"],
-        "dsType": ["onTypeChange"]
+        "dsSrc": [{
+                "onSrcChange": 0
+            }],
+        "dsType": [{
+                "onTypeChange": 0
+            }]
     }; }
 };
 declareComponentDependencies([h("ds-spinner", null), h("ds-icon", { dsName: "" })]);
-DsMedia.style = dsMediaCss;
+DsMedia.style = dsMediaCss();
 
 export { DsMedia as ds_media };

package/dist/esm/ds-modal.entry.js

@@ -1,18 +1,18 @@
-import { h, r as registerInstance, c as createEvent, d as getElement } from './index-B4ZCBfpo.js';
+import { h, r as registerInstance, c as createEvent, e as getElement } from './index-WKPTmD1Z.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 import { i as idGenerator, d as declareComponentDependencies, t as transformTagName, e as throttle, a as ifDefined } from './utils-J5Ghj1_T.js';
-import { g as getLanguage } from './store-I792JNgf.js';
+import { g as getLanguage } from './store-CaI4gcSt.js';
 import { M as MODAL_TRANSITION_IN_DURATION, b as MODAL_TRANSITION_OUT_DURATION } from './constants-CLNvzo86.js';
 import { i as isGreaterThanEqualBreakpointMediaQuery } from './utils-BW1GUsO7.js';
 
-const dsModalCss = ".ds-modal__oSBnIJ{position:fixed;padding:0;border:0;margin:0;max-height:100vh;max-height:100dvh;min-height:100vh;min-height:100dvh;width:100vw;background-color:var(--ds-bgColor-transparent-onLight);overflow-y:hidden;inset:0}.ds-modal__oSBnIJ--open{overflow-y:auto}.ds-modal__oSBnIJ__positioner{pointer-events:none;display:flex;flex-direction:column;justify-content:flex-end;min-height:100vh;min-height:100dvh;padding-block:var(--ds-spacing-small) 0;margin-block:auto 0}@media (min-width: 30rem){.ds-modal__oSBnIJ__positioner{justify-content:center;padding-block:var(--ds-spacing-small);margin-block:auto}}@media (min-width: 60rem){.ds-modal__oSBnIJ__positioner{padding-block:var(--ds-spacing-xLarge)}}.ds-modal__oSBnIJ__container{pointer-events:auto;cursor:unset;border:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-light);background-color:var(--ds-bgColor-white);box-shadow:var(--ds-shadow-overlay);scale:0.98;opacity:0;transform:translateY(0.75rem);transition:scale var(--ds-modal-transition-out-duration) ease-out, opacity var(--ds-modal-transition-out-duration) ease-out, transform var(--ds-modal-transition-out-duration) ease-out}@media (min-width: 30rem){.ds-modal__oSBnIJ__container{margin:auto;width:fit-content;max-width:calc(100vw - 2 * var(--ds-spacing-small))}}@media (min-width: 60rem){.ds-modal__oSBnIJ__container{max-width:calc(100vw - 2 * var(--ds-spacing-xLarge))}}.ds-modal__oSBnIJ__container--full{width:100%}@media (min-width: 30rem){.ds-modal__oSBnIJ__container--small{width:480px}.ds-modal__oSBnIJ__container--medium{width:640px}.ds-modal__oSBnIJ__container--large{width:800px}}.ds-modal__oSBnIJ__container--scrollable{display:flex;flex-direction:column;overflow:hidden;max-height:calc(100vh + calc(-1 * var(--ds-spacing-small)));max-height:calc(100dvh + calc(-1 * var(--ds-spacing-small)));min-height:calc(320px - 2 * var(--ds-spacing-small))}@media (min-width: 30rem){.ds-modal__oSBnIJ__container--scrollable{max-height:calc(100vh + calc(-2 * var(--ds-spacing-small)));max-height:calc(100dvh + calc(-2 * var(--ds-spacing-small)))}}@media (min-width: 60rem){.ds-modal__oSBnIJ__container--scrollable{max-height:calc(100vh + calc(-2 * var(--ds-spacing-xLarge)));max-height:calc(100dvh + calc(-2 * var(--ds-spacing-xLarge)))}}.ds-modal__oSBnIJ--open .ds-modal__oSBnIJ__container{scale:1;opacity:1;transform:translateY(0)}.ds-modal__oSBnIJ--in .ds-modal__oSBnIJ__container{transition:scale var(--ds-modal-transition-in-duration) ease-out, opacity var(--ds-modal-transition-in-duration) ease-out, transform var(--ds-modal-transition-in-duration) ease-out}@media (prefers-reduced-motion: reduce){.ds-modal__oSBnIJ__container,.ds-modal__oSBnIJ--in .ds-modal__oSBnIJ__container{transition:none}}.ds-modal__oSBnIJ__header{position:relative;display:flex;flex-direction:row;justify-content:space-between;gap:var(--ds-spacing-2xSmall);padding-block:var(--ds-spacing-small);padding-inline:var(--ds-spacing-small)}@media (min-width: 30rem){.ds-modal__oSBnIJ__header{padding-block:var(--ds-spacing-medium) var(--ds-spacing-small);padding-inline:var(--ds-spacing-medium)}}.ds-modal__oSBnIJ__header--sticky{position:sticky;top:0;background-color:var(--ds-bgColor-white);border-block-end:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-light)}.ds-modal__oSBnIJ__header__heading:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-modal__oSBnIJ__header__heading{display:flex;gap:var(--ds-spacing-xSmall)}.ds-modal__oSBnIJ__header__heading__text{margin-block:var(--ds-spacing-4xSmall)}@media (min-width: 60rem){.ds-modal__oSBnIJ__header__heading__text{margin-block:calc(var(--ds-spacing-3xSmall) + var(--ds-spacing-4xSmall))}}.ds-modal__oSBnIJ__header__heading__icon{display:block;margin-block:var(--ds-spacing-4xSmall);margin-inline-end:var(--ds-spacing-3xSmall)}@media (min-width: 60rem){.ds-modal__oSBnIJ__header__heading__icon{margin-block:var(--ds-spacing-3xSmall)}}.ds-modal__oSBnIJ__header__close-button{margin-inline-start:auto}@media (min-width: 60rem){.ds-modal__oSBnIJ__header__close-button{margin-block:var(--ds-spacing-4xSmall)}}.ds-modal__oSBnIJ__content:focus-visible{box-shadow:inset 0 0 0 var(--ds-borderWidth-thick) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * -1 * 1)}.ds-modal__oSBnIJ__content{position:relative;padding-inline:var(--ds-spacing-small);flex:1;min-height:0}@media (min-width: 30rem){.ds-modal__oSBnIJ__content{padding-inline:var(--ds-spacing-medium)}}.ds-modal__oSBnIJ__content--padded{padding-block-end:var(--ds-spacing-small)}@media (min-width: 30rem){.ds-modal__oSBnIJ__content--padded{padding-block-end:var(--ds-spacing-medium)}}.ds-modal__oSBnIJ__content--scrollable{overflow-y:auto;padding-block-end:unset}.ds-modal__oSBnIJ__content--scrollable__top-scrim,.ds-modal__oSBnIJ__content--scrollable__bottom-scrim{pointer-events:none;width:100%;height:2.75rem;margin-top:-2.75rem;flex:0 0 auto;position:sticky;z-index:1;display:none}.ds-modal__oSBnIJ__content--scrollable__top-scrim--open,.ds-modal__oSBnIJ__content--scrollable__bottom-scrim--open{display:block}.ds-modal__oSBnIJ__content--scrollable__top-scrim{top:0;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-bgColor-transparent-onLight) 100%)}.ds-modal__oSBnIJ__content--scrollable__bottom-scrim{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-bgColor-transparent-onLight) 100%)}.ds-modal__oSBnIJ__content--scrollable:focus-visible .ds-modal__oSBnIJ__content--scrollable__top-scrim{top:var(--ds-borderWidth-thin)}.ds-modal__oSBnIJ__content--scrollable:focus-visible .ds-modal__oSBnIJ__content--scrollable__bottom-scrim{bottom:var(--ds-borderWidth-thin)}.ds-modal__oSBnIJ__footer{position:relative}.ds-modal__oSBnIJ__footer:not(:empty){display:flex;flex-direction:column;padding:var(--ds-spacing-small);gap:var(--ds-spacing-xSmall)}@media (min-width: 30rem){.ds-modal__oSBnIJ__footer:not(:empty){flex-direction:row;padding:var(--ds-spacing-medium);gap:var(--ds-spacing-small)}}.ds-modal__oSBnIJ__footer:not(:empty)+.ds-modal__oSBnIJ__content{border-block-end:0}.ds-modal__oSBnIJ__footer--sticky:not(:empty){position:sticky;bottom:0;background-color:var(--ds-bgColor-white);border-block-start:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-light)}";
+const dsModalCss = () => `.ds-modal__SPFJ1E{position:fixed;padding:0;border:0;margin:0;max-height:100vh;max-height:100dvh;min-height:100vh;min-height:100dvh;width:100vw;background-color:var(--ds-bgColor-transparent-onLight);overflow-y:hidden;inset:0}.ds-modal__SPFJ1E--open{overflow-y:auto}.ds-modal__SPFJ1E__positioner{pointer-events:none;display:flex;flex-direction:column;justify-content:flex-end;min-height:100vh;min-height:100dvh;padding-block:var(--ds-spacing-small) 0;margin-block:auto 0}@media (min-width: 30rem){.ds-modal__SPFJ1E__positioner{justify-content:center;padding-block:var(--ds-spacing-small);margin-block:auto}}@media (min-width: 60rem){.ds-modal__SPFJ1E__positioner{padding-block:var(--ds-spacing-xLarge)}}.ds-modal__SPFJ1E__container{pointer-events:auto;cursor:unset;border:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-light);background-color:var(--ds-bgColor-white);box-shadow:var(--ds-shadow-overlay);scale:0.98;opacity:0;transform:translateY(0.75rem);transition:scale var(--ds-modal-transition-out-duration) ease-out, opacity var(--ds-modal-transition-out-duration) ease-out, transform var(--ds-modal-transition-out-duration) ease-out}@media (min-width: 30rem){.ds-modal__SPFJ1E__container{margin:auto;width:fit-content;max-width:calc(100vw - 2 * var(--ds-spacing-small))}}@media (min-width: 60rem){.ds-modal__SPFJ1E__container{max-width:calc(100vw - 2 * var(--ds-spacing-xLarge))}}.ds-modal__SPFJ1E__container--full{width:100%}@media (min-width: 30rem){.ds-modal__SPFJ1E__container--small{width:480px}.ds-modal__SPFJ1E__container--medium{width:640px}.ds-modal__SPFJ1E__container--large{width:800px}}.ds-modal__SPFJ1E__container--scrollable{display:flex;flex-direction:column;overflow:hidden;max-height:calc(100vh + calc(-1 * var(--ds-spacing-small)));max-height:calc(100dvh + calc(-1 * var(--ds-spacing-small)));min-height:calc(320px - 2 * var(--ds-spacing-small))}@media (min-width: 30rem){.ds-modal__SPFJ1E__container--scrollable{max-height:calc(100vh + calc(-2 * var(--ds-spacing-small)));max-height:calc(100dvh + calc(-2 * var(--ds-spacing-small)))}}@media (min-width: 60rem){.ds-modal__SPFJ1E__container--scrollable{max-height:calc(100vh + calc(-2 * var(--ds-spacing-xLarge)));max-height:calc(100dvh + calc(-2 * var(--ds-spacing-xLarge)))}}.ds-modal__SPFJ1E--open .ds-modal__SPFJ1E__container{scale:1;opacity:1;transform:translateY(0)}.ds-modal__SPFJ1E--in .ds-modal__SPFJ1E__container{transition:scale var(--ds-modal-transition-in-duration) ease-out, opacity var(--ds-modal-transition-in-duration) ease-out, transform var(--ds-modal-transition-in-duration) ease-out}@media (prefers-reduced-motion: reduce){.ds-modal__SPFJ1E__container,.ds-modal__SPFJ1E--in .ds-modal__SPFJ1E__container{transition:none}}.ds-modal__SPFJ1E__header{position:relative;display:flex;flex-direction:row;justify-content:space-between;gap:var(--ds-spacing-2xSmall);padding-block:var(--ds-spacing-small);padding-inline:var(--ds-spacing-small)}@media (min-width: 30rem){.ds-modal__SPFJ1E__header{padding-block:var(--ds-spacing-medium) var(--ds-spacing-small);padding-inline:var(--ds-spacing-medium)}}.ds-modal__SPFJ1E__header--sticky{position:sticky;top:0;background-color:var(--ds-bgColor-white);border-block-end:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-light)}.ds-modal__SPFJ1E__header__heading:focus-visible{box-shadow:0 0 0 var(--ds-borderWidth-thin) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * 1)}.ds-modal__SPFJ1E__header__heading{display:flex;gap:var(--ds-spacing-xSmall)}.ds-modal__SPFJ1E__header__heading__text{margin-block:var(--ds-spacing-4xSmall)}@media (min-width: 60rem){.ds-modal__SPFJ1E__header__heading__text{margin-block:calc(var(--ds-spacing-3xSmall) + var(--ds-spacing-4xSmall))}}.ds-modal__SPFJ1E__header__heading__icon{display:block;margin-block:var(--ds-spacing-4xSmall);margin-inline-end:var(--ds-spacing-3xSmall)}@media (min-width: 60rem){.ds-modal__SPFJ1E__header__heading__icon{margin-block:var(--ds-spacing-3xSmall)}}.ds-modal__SPFJ1E__header__close-button{margin-inline-start:auto}@media (min-width: 60rem){.ds-modal__SPFJ1E__header__close-button{margin-block:var(--ds-spacing-4xSmall)}}.ds-modal__SPFJ1E__content:focus-visible{box-shadow:inset 0 0 0 var(--ds-borderWidth-thick) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * -1 * 1)}.ds-modal__SPFJ1E__content{position:relative;padding-inline:var(--ds-spacing-small);flex:1;min-height:0}@media (min-width: 30rem){.ds-modal__SPFJ1E__content{padding-inline:var(--ds-spacing-medium)}}.ds-modal__SPFJ1E__content--padded{padding-block-end:var(--ds-spacing-small)}@media (min-width: 30rem){.ds-modal__SPFJ1E__content--padded{padding-block-end:var(--ds-spacing-medium)}}.ds-modal__SPFJ1E__content--scrollable{overflow-y:auto;padding-block-end:unset}.ds-modal__SPFJ1E__content--scrollable__top-scrim,.ds-modal__SPFJ1E__content--scrollable__bottom-scrim{pointer-events:none;width:100%;height:2.75rem;margin-top:-2.75rem;flex:0 0 auto;position:sticky;z-index:1;display:none}.ds-modal__SPFJ1E__content--scrollable__top-scrim--open,.ds-modal__SPFJ1E__content--scrollable__bottom-scrim--open{display:block}.ds-modal__SPFJ1E__content--scrollable__top-scrim{top:0;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-bgColor-transparent-onLight) 100%)}.ds-modal__SPFJ1E__content--scrollable__bottom-scrim{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-bgColor-transparent-onLight) 100%)}.ds-modal__SPFJ1E__content--scrollable:focus-visible .ds-modal__SPFJ1E__content--scrollable__top-scrim{top:var(--ds-borderWidth-thin)}.ds-modal__SPFJ1E__content--scrollable:focus-visible .ds-modal__SPFJ1E__content--scrollable__bottom-scrim{bottom:var(--ds-borderWidth-thin)}.ds-modal__SPFJ1E__footer{position:relative}.ds-modal__SPFJ1E__footer:not(:empty){display:flex;flex-direction:column;padding:var(--ds-spacing-small);gap:var(--ds-spacing-xSmall)}@media (min-width: 30rem){.ds-modal__SPFJ1E__footer:not(:empty){flex-direction:row;padding:var(--ds-spacing-medium);gap:var(--ds-spacing-small)}}.ds-modal__SPFJ1E__footer:not(:empty)+.ds-modal__SPFJ1E__content{border-block-end:0}.ds-modal__SPFJ1E__footer--sticky:not(:empty){position:sticky;bottom:0;background-color:var(--ds-bgColor-white);border-block-start:var(--ds-borderWidth-hairline) solid var(--ds-borderColor-light)}`;
 
 const modalIdGenerator = idGenerator('ds-modal');
 const DsModal = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.dsModalClose = createEvent(this, "dsModalClose");
+        this.dsModalClose = createEvent(this, "dsModalClose", 7);
     }
     get el() { return getElement(this); }
     RESIZE_THROTTLE_TIMEOUT = 100;
@@ -215,18 +215,22 @@ const DsModal = class {
         });
         const contentAriaLabel = this.dsScrollable ? this.contentScrollArea : undefined;
         const contentTabIndex = this.dsScrollable ? 0 : undefined;
-        return (h(this.DsBackdrop, { key: '1b5f40af038e12b3d52da9640c5bf7a41d5d9b4f', id: this.dsId, dsDialogClasses: classes, dsOpen: this.dsOpen, dsZIndex: this.dsBackdropZIndex, dsRole: this.dsVariant === 'danger' ? 'alertdialog' : 'dialog', onDsBackdropClose: this.handleBackdropClose }, h("div", { key: '0e163d7af42c3dbae1840b204df18898585168f9', class: `${baseClass}__positioner` }, h("div", { key: 'e05e230c24e1013b2e1c189b8ca17d7a8547843c', class: containerClasses, style: { '--ds-modal-transition-in-duration': `${MODAL_TRANSITION_IN_DURATION}ms`, '--ds-modal-transition-out-duration': `${MODAL_TRANSITION_OUT_DURATION}ms` } }, h("slot", { key: '9a370848c428237be7b8aa96d52400eb5e57ddca', name: "header", onSlotchange: () => this.checkHeaderSlot() }, !this.hasHeaderSlot && (h("div", { key: 'c92eded235813b73bf38cdb211a05cd664e8be1b', class: headerClasses }, this.dsHeadingText && (h("span", { key: 'c2ad72e6206615affac0d2792a6c981b73500cb8', role: "heading", tabIndex: -1, autoFocus: this.dsAutoFocusTarget === 'heading', "aria-level": this.dsHeadingLevel, class: headingClasses }, this.icon && (h(this.DsIcon, { key: '5f75e9e1fd83010a63f56139e73ea67460fee83a', class: `${baseClass}__header__heading__icon`, dsAriaHidden: this.icon.ariaHidden, dsAriaLabel: this.icon.ariaLabel, dsSize: this.icon.size, dsName: this.icon.name, dsColour: this.icon.colour })), h("span", { key: 'fd78a671a0905cc89df40547d417fc3c40fe2537', class: `${baseClass}__header__heading__text` }, this.dsHeadingText))), this.dsCloseable && (h(this.DsButton, { key: 'd38895149123fd62453f0b158db4a241d6cdd5a0', class: closeButtonClasses, dsVariant: "supplementary", dsSize: "small", dsColour: "black", dsIcon: "close", dsAriaLabel: this.close, dsAutoFocus: this.dsAutoFocusTarget === 'close-button', onClick: this.handleCloseClick }))))), h("div", { key: '5a90b48de2e501bb289cc91c1cb6b6f8fec0ac36', ref: el => (this.contentRef = el), class: contentClasses, ...ifDefined('aria-label', contentAriaLabel), ...ifDefined('tabIndex', contentTabIndex), onScroll: this.handleContentScroll }, this.dsScrollable && this.hasContentSlot && (h("div", { key: '4dbbaa944ab82627d0ceee5c84360f4435ddf15f', class: classNames(`${baseClass}__content--scrollable__top-scrim`, {
+        return (h(this.DsBackdrop, { key: '34f20ec233affd5f92d99d4b59ceb0c3a38e2760', id: this.dsId, dsDialogClasses: classes, dsOpen: this.dsOpen, dsZIndex: this.dsBackdropZIndex, dsRole: this.dsVariant === 'danger' ? 'alertdialog' : 'dialog', onDsBackdropClose: this.handleBackdropClose }, h("div", { key: '3bd47c3984fd90968d6760d6270c3f21ebc01e40', class: `${baseClass}__positioner` }, h("div", { key: '1a928135c70bfcf40949a982a8a2f9ecac649fb0', class: containerClasses, style: { '--ds-modal-transition-in-duration': `${MODAL_TRANSITION_IN_DURATION}ms`, '--ds-modal-transition-out-duration': `${MODAL_TRANSITION_OUT_DURATION}ms` } }, h("slot", { key: '851c23a858d2b8b65beefcd68bcadd363aaa43c9', name: "header", onSlotchange: () => this.checkHeaderSlot() }, !this.hasHeaderSlot && (h("div", { key: '12fbe87f94d59cd9a59975796ff72da9abba4f3c', class: headerClasses }, this.dsHeadingText && (h("span", { key: '1ae6ade01c6d29ceba2aec63deb11ab3873edc0a', role: "heading", tabIndex: -1, autoFocus: this.dsAutoFocusTarget === 'heading', "aria-level": this.dsHeadingLevel, class: headingClasses }, this.icon && (h(this.DsIcon, { key: '9407e530a689437ccea941efdacfda82ea47c7d5', class: `${baseClass}__header__heading__icon`, dsAriaHidden: this.icon.ariaHidden, dsAriaLabel: this.icon.ariaLabel, dsSize: this.icon.size, dsName: this.icon.name, dsColour: this.icon.colour })), h("span", { key: '97e4776346300a649a0cd6be8c02797a3843cfaf', class: `${baseClass}__header__heading__text` }, this.dsHeadingText))), this.dsCloseable && (h(this.DsButton, { key: 'b765dc5aa456c1f75fb9c617088f9a68fc5160f2', class: closeButtonClasses, dsVariant: "supplementary", dsSize: "small", dsColour: "black", dsIcon: "close", dsAriaLabel: this.close, dsAutoFocus: this.dsAutoFocusTarget === 'close-button', onClick: this.handleCloseClick }))))), h("div", { key: '7e4c9f7615e9bc8fbd21596cfa5753cb3271520b', ref: el => (this.contentRef = el), class: contentClasses, ...ifDefined('aria-label', contentAriaLabel), ...ifDefined('tabIndex', contentTabIndex), onScroll: this.handleContentScroll }, this.dsScrollable && this.hasContentSlot && (h("div", { key: '9f92416f7dd975358659a5c3b74be588c5a58743', class: classNames(`${baseClass}__content--scrollable__top-scrim`, {
                 [`${baseClass}__content--scrollable__top-scrim--open`]: this.scrollableContentState && !this.scrollableContentState.atTop,
-            }), "aria-hidden": "true" })), h("slot", { key: '9d242206dd77c38e73e87b29c5286773d328cb7b', name: "content", onSlotchange: () => this.checkContentSlot() }), this.dsScrollable && this.hasContentSlot && (h("div", { key: '859ca016c1131226b9febff8ce75de340767796f', class: classNames(`${baseClass}__content--scrollable__bottom-scrim`, {
+            }), "aria-hidden": "true" })), h("slot", { key: '5dfc1e4efa4d8c76779056a8e129e9086f7b274c', name: "content", onSlotchange: () => this.checkContentSlot() }), this.dsScrollable && this.hasContentSlot && (h("div", { key: '1891614721ba5cc9dcd12f57b60486cb3d30bab4', class: classNames(`${baseClass}__content--scrollable__bottom-scrim`, {
                 [`${baseClass}__content--scrollable__bottom-scrim--open`]: this.scrollableContentState && !this.scrollableContentState.atBottom,
-            }), "aria-hidden": "true" }))), h("div", { key: '6476d43904c097b2ac61994e7da5ba1f89ab05b5', class: footerClasses }, h("slot", { key: '9bc5185ec9b3cebbcb785e44655de023c0b5c74b', name: "footer", onSlotchange: () => this.checkFooterSlot() }))))));
+            }), "aria-hidden": "true" }))), h("div", { key: 'd96c91412976c2f7d5587e474ba5ea903233d2a8', class: footerClasses }, h("slot", { key: 'cd7591f3727ddd6228c50699afddc74810f97adf', name: "footer", onSlotchange: () => this.checkFooterSlot() }))))));
     }
     static get watchers() { return {
-        "hasContentSlot": ["hasContentSlotObserver"],
-        "dsOpen": ["dsOpenObserver"]
+        "hasContentSlot": [{
+                "hasContentSlotObserver": 0
+            }],
+        "dsOpen": [{
+                "dsOpenObserver": 0
+            }]
     }; }
 };
 declareComponentDependencies([h("ds-backdrop", null), h("ds-button", null), h("ds-icon", { dsName: "" })]);
-DsModal.style = dsModalCss;
+DsModal.style = dsModalCss();
 
 export { DsModal as ds_modal };

package/dist/esm/ds-notification.entry.js

@@ -1,12 +1,12 @@
-import { M as Mixin, r as registerInstance, c as createEvent, d as getElement, f as forceUpdate, h } from './index-B4ZCBfpo.js';
+import { M as Mixin, r as registerInstance, c as createEvent, e as getElement, f as forceUpdate, h } from './index-WKPTmD1Z.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 import { i as idGenerator, t as transformTagName, o as omit, d as declareComponentDependencies } from './utils-J5Ghj1_T.js';
 import { b as inheritAriaAttributes, i as inheritAttributes } from './attributes-DfbgRyXR.js';
-import { g as getLanguage } from './store-I792JNgf.js';
-import { a as ariaDeprecationFactory } from './ariaDeprecationFactory-DXsGmVd4.js';
+import { g as getLanguage } from './store-CaI4gcSt.js';
+import { a as ariaDeprecationFactory } from './ariaDeprecationFactory-DwC_l-Le.js';
 
-const dsNotificationCss = ".sc-ds-notification-h{display:block;width:100%}.ds-notification__oSBnIJ.sc-ds-notification{padding:var(--ds-spacing-xSmall, 12px)}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--neutral.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-neutral);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--neutral.sc-ds-notification .ds-notification__oSBnIJ__icon.sc-ds-notification{color:var(--ds-iconColor-default);margin-bottom:auto}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--neutralWhite.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-white);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--neutralWhite.sc-ds-notification .ds-notification__oSBnIJ__icon.sc-ds-notification{color:var(--ds-iconColor-default);margin-bottom:auto}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--info.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-info);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-info);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--info.sc-ds-notification .ds-notification__oSBnIJ__icon.sc-ds-notification{color:var(--ds-iconColor-info);margin-bottom:auto}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--success.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-success);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-success);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--success.sc-ds-notification .ds-notification__oSBnIJ__icon.sc-ds-notification{color:var(--ds-iconColor-success);margin-bottom:auto}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--attention.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-attention);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-attention);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--attention.sc-ds-notification .ds-notification__oSBnIJ__icon.sc-ds-notification{color:var(--ds-iconColor-attention);margin-bottom:auto}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--danger.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-danger);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-danger);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__oSBnIJ.ds-notification__oSBnIJ--danger.sc-ds-notification .ds-notification__oSBnIJ__icon.sc-ds-notification{color:var(--ds-iconColor-danger);margin-bottom:auto}.ds-notification__oSBnIJ__content.sc-ds-notification{display:flex;gap:var(--ds-spacing-2xSmall, 8px);max-width:1376px;margin:0 auto}.ds-notification__oSBnIJ__content__text.sc-ds-notification{display:flex;padding:var(--ds-spacing-4xSmall, 2px) 0;flex-direction:column;align-items:flex-start;gap:var(--ds-spacing-4xSmall, 2px);flex:1 0 0}.ds-notification__oSBnIJ__content__text__heading.sc-ds-notification,.ds-notification__oSBnIJ__content__text__description.sc-ds-notification{font-family:var(--ds-fontFamily-body);line-height:var(--ds-lineHeight-large);letter-spacing:var(--ds-letterSpacing-wide)}.ds-notification__oSBnIJ__content__text__description.sc-ds-notification{max-width:var(--ds-notification-description-max-width, 550px)}";
+const dsNotificationCss = () => `.sc-ds-notification-h{display:block;width:100%}.ds-notification__SPFJ1E.sc-ds-notification{padding:var(--ds-spacing-xSmall, 12px)}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--neutral.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-neutral);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--neutral.sc-ds-notification .ds-notification__SPFJ1E__icon.sc-ds-notification{color:var(--ds-iconColor-default);margin-bottom:auto}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--neutralWhite.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-white);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--neutralWhite.sc-ds-notification .ds-notification__SPFJ1E__icon.sc-ds-notification{color:var(--ds-iconColor-default);margin-bottom:auto}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--info.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-info);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-info);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--info.sc-ds-notification .ds-notification__SPFJ1E__icon.sc-ds-notification{color:var(--ds-iconColor-info);margin-bottom:auto}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--success.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-success);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-success);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--success.sc-ds-notification .ds-notification__SPFJ1E__icon.sc-ds-notification{color:var(--ds-iconColor-success);margin-bottom:auto}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--attention.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-attention);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-attention);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--attention.sc-ds-notification .ds-notification__SPFJ1E__icon.sc-ds-notification{color:var(--ds-iconColor-attention);margin-bottom:auto}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--danger.sc-ds-notification{color:var(--ds-textColor-default);background-color:var(--ds-bgColor-danger);border:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-danger);margin-top:calc(-1 * var(--ds-borderWidth-hairline, 1px))}.ds-notification__SPFJ1E.ds-notification__SPFJ1E--danger.sc-ds-notification .ds-notification__SPFJ1E__icon.sc-ds-notification{color:var(--ds-iconColor-danger);margin-bottom:auto}.ds-notification__SPFJ1E__content.sc-ds-notification{display:flex;gap:var(--ds-spacing-2xSmall, 8px);max-width:1376px;margin:0 auto}.ds-notification__SPFJ1E__content__text.sc-ds-notification{display:flex;padding:var(--ds-spacing-4xSmall, 2px) 0;flex-direction:column;align-items:flex-start;gap:var(--ds-spacing-4xSmall, 2px);flex:1 0 0}.ds-notification__SPFJ1E__content__text__heading.sc-ds-notification,.ds-notification__SPFJ1E__content__text__description.sc-ds-notification{font-family:var(--ds-fontFamily-body);line-height:var(--ds-lineHeight-large);letter-spacing:var(--ds-letterSpacing-wide)}.ds-notification__SPFJ1E__content__text__description.sc-ds-notification{max-width:var(--ds-notification-description-max-width, 550px)}`;
 
 const notificationIdGenerator = idGenerator('ds-notification');
 const variants = ['neutral', 'neutralWhite', 'info', 'success', 'attention', 'danger'];
@@ -16,7 +16,7 @@ const DsNotification = class extends Mixin(ariaDeprecationFactory) {
     constructor(hostRef) {
         super();
         registerInstance(this, hostRef);
-        this.dsDismiss = createEvent(this, "dsDismiss");
+        this.dsDismiss = createEvent(this, "dsDismiss", 7);
     }
     dsAriaLabel;
     dsAriaLabelledby;
@@ -151,14 +151,18 @@ const DsNotification = class extends Mixin(ariaDeprecationFactory) {
         const ariaLabelledby = this.dsAriaLabelledby ?? this.inheritedAttributes['aria-labelledby'] ?? this.ariaLabelledBy;
         const role = this.dsRole ?? this.inheritedAttributes['role'] ?? 'group';
         const restAttributes = omit(this.inheritedAttributes, ['aria-labelledby', 'aria-label', 'role']);
-        return (h("div", { key: '4529db2a1680f233c8d155133a400830346bb7fe', class: classes, id: this.dsId, role: role, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ...restAttributes }, h("div", { key: '503e52c69422e97f41cfc4e107babfe297acb2b4', class: contentClass }, this.dsIcon && (h("div", { key: 'fad4654bae659b880dc961df9d413016d77a3bfb', class: `${baseClass}__icon ds-p-3xs` }, h(this.DsIcon, { key: '28e2b9e11a8457571e839e9a2c0eaf790b5944d3', dsName: this.dsIcon }))), h("div", { key: '90bd6f2ede1758a26f1171a02c6a7a9a0e895def', class: textClass }, h("slot", { key: 'be1760ff79c03a9de088e566fa37bb0ab6e78410', name: "heading" }, this.dsHeading && (h("div", { key: '60b168f1d0976970f93eed585a9557c4fd27a986', class: `${textClass}__heading ds-text-semibold-lg`, id: this.headingId, role: this.dsDescription ? 'heading' : undefined, 'aria-level': this.dsDescription ? this.dsHeadingLevel : undefined }, this.dsHeading))), h("slot", { key: '936e108671e19603d21caa4b6312a123bb3f1af7', name: "description" }, this.dsDescription && (h("div", { key: '75d188cabad83a0ac0c3c835c112559761710063', class: `${textClass}__description ds-text-regular-md`, style: { '--ds-notification-description-max-width': this.dsDescriptionMaxWidth } }, this.dsDescription))), h("slot", { key: '95b462dfc54784c44bd3aa3af8d671cd66421024' })), this.dsDismissable && (h(this.DsButton, { key: '87a7782e83cf61a5eb62101afca9b7923a498ba5', dsId: `${this.dsId}-dismiss-button`, dsIcon: "close", dsVariant: "supplementary", dsColour: "black", dsSize: "small", dsAriaLabelledby: [`${this.dsId}-dismiss-button`, ariaLabelledby].filter(Boolean).join(' '), onClick: this.handleDismissButtonClick }, h(this.DsVisuallyHidden, { key: 'd9131f6eefb593fe82e56b0205b453fe176716c2', slot: "suffix", dsTag: "span" }, this.dsDismissButtonHiddenAssistiveText || this.close))))));
+        return (h("div", { key: '2c7be9f4ca5c418b5c61bab132d4411bc004600a', class: classes, id: this.dsId, role: role, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledby, ...restAttributes }, h("div", { key: 'baa8bf00a8ff422725dfa35d7aa42ce1b447a0c9', class: contentClass }, this.dsIcon && (h("div", { key: 'd0352dd16b66822af92b018f9e0d53ce1bce2699', class: `${baseClass}__icon ds-p-3xs` }, h(this.DsIcon, { key: 'b8c98820afc69339a667e20b0daaef7c8145c229', dsName: this.dsIcon }))), h("div", { key: 'ab25e7e55e76721b70a96fd8cfe7f002e9677eca', class: textClass }, h("slot", { key: 'ec5ad0d4f45e5f0831e5dc670707d68d4989c7d4', name: "heading" }, this.dsHeading && (h("div", { key: 'e29e20300b860da979cb2285925348449b0ce2d5', class: `${textClass}__heading ds-text-semibold-lg`, id: this.headingId, role: this.dsDescription ? 'heading' : undefined, 'aria-level': this.dsDescription ? this.dsHeadingLevel : undefined }, this.dsHeading))), h("slot", { key: '86622fac36f1c0828e974ced4d5fae415fbffeb6', name: "description" }, this.dsDescription && (h("div", { key: 'b4161e753abf969b4fe2f895650bd32f5dfd8485', class: `${textClass}__description ds-text-regular-md`, style: { '--ds-notification-description-max-width': this.dsDescriptionMaxWidth } }, this.dsDescription))), h("slot", { key: 'd4d2cfb91ec5c17073c8a2963998379586016a3a' })), this.dsDismissable && (h(this.DsButton, { key: '992e2ed905ae9eaefdabf15e9a3c4c006f4d7977', dsId: `${this.dsId}-dismiss-button`, dsIcon: "close", dsVariant: "supplementary", dsColour: "black", dsSize: "small", dsAriaLabelledby: [`${this.dsId}-dismiss-button`, ariaLabelledby].filter(Boolean).join(' '), onClick: this.handleDismissButtonClick }, h(this.DsVisuallyHidden, { key: 'e85535b98bd322df61f9b7dcc4f4a224f7d608f0', slot: "suffix", dsTag: "span" }, this.dsDismissButtonHiddenAssistiveText || this.close))))));
     }
     static get watchers() { return {
-        "aria-label": ["ariaAttributeObserver"],
-        "aria-labelledby": ["ariaAttributeObserver"]
+        "aria-label": [{
+                "ariaAttributeObserver": 0
+            }],
+        "aria-labelledby": [{
+                "ariaAttributeObserver": 0
+            }]
     }; }
 };
 declareComponentDependencies([h("ds-icon", { dsName: "" }), h("ds-button", null), h("ds-visually-hidden", null)]);
-DsNotification.style = dsNotificationCss;
+DsNotification.style = dsNotificationCss();
 
 export { DsNotification as ds_notification };

package/dist/esm/ds-option_2.entry.js

@@ -1,19 +1,19 @@
-import { h, r as registerInstance, c as createEvent, d as getElement, F as Fragment } from './index-B4ZCBfpo.js';
+import { h, r as registerInstance, c as createEvent, e as getElement, F as Fragment } from './index-WKPTmD1Z.js';
 import { c as classNames } from './index-BfTCfPZ1.js';
 import { i as idGenerator, d as declareComponentDependencies, t as transformTagName } from './utils-J5Ghj1_T.js';
-import { c as cx } from './cx-hUnOoCpm.js';
+import { c as cx } from './cx-jGcD6jB5.js';
 import { b as inheritAriaAttributes, i as inheritAttributes } from './attributes-DfbgRyXR.js';
 
-const dsOptionCss = ".ds-option__oSBnIJ.sc-ds-option{display:flex;align-items:center;justify-content:normal;min-height:2.5rem;padding:0.625rem var(--ds-spacing-xSmall);position:relative;cursor:pointer;background-color:var(--ds-bgColor-white);color:var(--ds-textColor-default);font-weight:var(--ds-fontWeight-regular);font-size:var(--ds-fontSize-16);line-height:var(--ds-lineHeight-large);letter-spacing:var(--ds-letterSpacing-wide)}.ds-option__oSBnIJ.sc-ds-option:not(.ds-option__oSBnIJ--multiple){justify-content:space-between}.ds-option__oSBnIJ--hidden.sc-ds-option{display:none}.ds-option__oSBnIJ--disabled.sc-ds-option{cursor:not-allowed;user-select:none;color:var(--ds-textColor-disabled-onLight)}.ds-option__oSBnIJ.sc-ds-option:hover:not(.ds-option__oSBnIJ--disabled){background-color:var(--ds-bgColor-white-hover)}.ds-option__oSBnIJ.sc-ds-option:active:not(.ds-option__oSBnIJ--disabled){background-color:var(--ds-bgColor-white-active)}.ds-option__oSBnIJ--active.sc-ds-option{box-shadow:inset 0 0 0 var(--ds-borderWidth-thick) var(--ds-borderColor-black);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-white);outline-offset:calc(var(--ds-borderWidth-thin) * -1 * 1)}.ds-option__oSBnIJ--active.ds-option__oSBnIJ--selected.sc-ds-option:not(.ds-option__oSBnIJ--multiple){box-shadow:inset 0 0 0 var(--ds-borderWidth-thick) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * -1 * 1)}.ds-option__oSBnIJ--multiple.ds-option__oSBnIJ--disabled.sc-ds-option{color:var(--ds-textColor-default)}.ds-option__oSBnIJ--multiple.sc-ds-option .ds-option__oSBnIJ__checkbox.sc-ds-option{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:20px;height:20px;margin-right:var(--ds-spacing-xSmall);border-width:var(--ds-borderWidth-thin);border-style:solid;border-color:var(--ds-borderColor-default);background-color:var(--ds-bgColor-white)}.ds-option__oSBnIJ--multiple.ds-option__oSBnIJ--disabled.sc-ds-option .ds-option__oSBnIJ__checkbox.sc-ds-option{border-color:var(--ds-borderColor-transparent);background-color:var(--ds-bgColor-disabled-onLight)}.ds-option__oSBnIJ--multiple.ds-option__oSBnIJ--disabled.sc-ds-option:not(.ds-option__oSBnIJ--selected) .ds-option__oSBnIJ__checkbox.sc-ds-option{border-color:var(--ds-borderColor-disabled-onLight)}.ds-option__oSBnIJ--selected.sc-ds-option .ds-option__oSBnIJ__checkbox.sc-ds-option{background-color:var(--ds-bgColor-primary);border-color:var(--ds-borderColor-transparent);color:var(--ds-textColor-white);padding:var(--ds-spacing-4xSmall)}.ds-option__oSBnIJ--selected.sc-ds-option:not(.ds-option__oSBnIJ--multiple){background-color:var(--ds-bgColor-primary);color:var(--ds-textColor-white)}.ds-option__oSBnIJ--selected.sc-ds-option:not(.ds-option__oSBnIJ--multiple).ds-option__oSBnIJ--disabled{background-color:var(--ds-bgColor-disabled-onLight);color:var(--ds-textColor-disabled-onLight)}.ds-option__oSBnIJ--selected.sc-ds-option:not(.ds-option__oSBnIJ--multiple) .ds-option__oSBnIJ__description.sc-ds-option{color:var(--ds-textColor-white)}.ds-option__oSBnIJ--selected.sc-ds-option:not(.ds-option__oSBnIJ--multiple) .ds-option__oSBnIJ__check-icon.sc-ds-option{visibility:visible;color:var(--ds-textColor-white)}.ds-option__oSBnIJ--selected.sc-ds-option:not(.ds-option__oSBnIJ--multiple).ds-option__oSBnIJ--disabled .ds-option__oSBnIJ__check-icon.sc-ds-option{color:var(--ds-textColor-disabled-onLight)}.ds-option__oSBnIJ--selected.sc-ds-option:not(.ds-option__oSBnIJ--multiple):hover:not(.ds-option__oSBnIJ--disabled){background-color:var(--ds-bgColor-primary-hover)}.ds-option__oSBnIJ--selected.sc-ds-option:not(.ds-option__oSBnIJ--multiple):active:not(.ds-option__oSBnIJ--disabled){background-color:var(--ds-bgColor-primary-active)}.ds-option__oSBnIJ__label.sc-ds-option{display:flex;flex-direction:column;flex:1 1 auto;font-family:var(--ds-fontFamily-body);min-width:0;grid-column:1;grid-row:1}.ds-option__oSBnIJ__check-icon.sc-ds-option{margin-left:var(--ds-spacing-small);flex-shrink:0;display:flex;align-items:center;height:100%}.ds-option__oSBnIJ__description.sc-ds-option{color:var(--ds-textColor-secondary);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);margin-top:var(--ds-spacing-3xSmall);line-height:1.3;grid-column:1;grid-row:2}.ds-option__oSBnIJ__description.sc-ds-option:not(:empty){display:block}";
+const dsOptionCss = () => `.ds-option__SPFJ1E.sc-ds-option{display:flex;align-items:center;justify-content:normal;min-height:2.5rem;padding:0.625rem var(--ds-spacing-xSmall);position:relative;cursor:pointer;background-color:var(--ds-bgColor-white);color:var(--ds-textColor-default);font-weight:var(--ds-fontWeight-regular);font-size:var(--ds-fontSize-16);line-height:var(--ds-lineHeight-large);letter-spacing:var(--ds-letterSpacing-wide)}.ds-option__SPFJ1E.sc-ds-option:not(.ds-option__SPFJ1E--multiple){justify-content:space-between}.ds-option__SPFJ1E--hidden.sc-ds-option{display:none}.ds-option__SPFJ1E--disabled.sc-ds-option{cursor:not-allowed;user-select:none;color:var(--ds-textColor-disabled-onLight)}.ds-option__SPFJ1E.sc-ds-option:hover:not(.ds-option__SPFJ1E--disabled){background-color:var(--ds-bgColor-white-hover)}.ds-option__SPFJ1E.sc-ds-option:active:not(.ds-option__SPFJ1E--disabled){background-color:var(--ds-bgColor-white-active)}.ds-option__SPFJ1E--active.sc-ds-option{box-shadow:inset 0 0 0 var(--ds-borderWidth-thick) var(--ds-borderColor-black);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-white);outline-offset:calc(var(--ds-borderWidth-thin) * -1 * 1)}.ds-option__SPFJ1E--active.ds-option__SPFJ1E--selected.sc-ds-option:not(.ds-option__SPFJ1E--multiple){box-shadow:inset 0 0 0 var(--ds-borderWidth-thick) var(--ds-borderColor-white);outline:var(--ds-borderWidth-thin) solid var(--ds-borderColor-black);outline-offset:calc(var(--ds-borderWidth-thin) * -1 * 1)}.ds-option__SPFJ1E--multiple.ds-option__SPFJ1E--disabled.sc-ds-option{color:var(--ds-textColor-default)}.ds-option__SPFJ1E--multiple.sc-ds-option .ds-option__SPFJ1E__checkbox.sc-ds-option{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:20px;height:20px;margin-right:var(--ds-spacing-xSmall);border-width:var(--ds-borderWidth-thin);border-style:solid;border-color:var(--ds-borderColor-default);background-color:var(--ds-bgColor-white)}.ds-option__SPFJ1E--multiple.ds-option__SPFJ1E--disabled.sc-ds-option .ds-option__SPFJ1E__checkbox.sc-ds-option{border-color:var(--ds-borderColor-transparent);background-color:var(--ds-bgColor-disabled-onLight)}.ds-option__SPFJ1E--multiple.ds-option__SPFJ1E--disabled.sc-ds-option:not(.ds-option__SPFJ1E--selected) .ds-option__SPFJ1E__checkbox.sc-ds-option{border-color:var(--ds-borderColor-disabled-onLight)}.ds-option__SPFJ1E--selected.sc-ds-option .ds-option__SPFJ1E__checkbox.sc-ds-option{background-color:var(--ds-bgColor-primary);border-color:var(--ds-borderColor-transparent);color:var(--ds-textColor-white);padding:var(--ds-spacing-4xSmall)}.ds-option__SPFJ1E--selected.sc-ds-option:not(.ds-option__SPFJ1E--multiple){background-color:var(--ds-bgColor-primary);color:var(--ds-textColor-white)}.ds-option__SPFJ1E--selected.sc-ds-option:not(.ds-option__SPFJ1E--multiple).ds-option__SPFJ1E--disabled{background-color:var(--ds-bgColor-disabled-onLight);color:var(--ds-textColor-disabled-onLight)}.ds-option__SPFJ1E--selected.sc-ds-option:not(.ds-option__SPFJ1E--multiple) .ds-option__SPFJ1E__description.sc-ds-option{color:var(--ds-textColor-white)}.ds-option__SPFJ1E--selected.sc-ds-option:not(.ds-option__SPFJ1E--multiple) .ds-option__SPFJ1E__check-icon.sc-ds-option{visibility:visible;color:var(--ds-textColor-white)}.ds-option__SPFJ1E--selected.sc-ds-option:not(.ds-option__SPFJ1E--multiple).ds-option__SPFJ1E--disabled .ds-option__SPFJ1E__check-icon.sc-ds-option{color:var(--ds-textColor-disabled-onLight)}.ds-option__SPFJ1E--selected.sc-ds-option:not(.ds-option__SPFJ1E--multiple):hover:not(.ds-option__SPFJ1E--disabled){background-color:var(--ds-bgColor-primary-hover)}.ds-option__SPFJ1E--selected.sc-ds-option:not(.ds-option__SPFJ1E--multiple):active:not(.ds-option__SPFJ1E--disabled){background-color:var(--ds-bgColor-primary-active)}.ds-option__SPFJ1E__label.sc-ds-option{display:flex;flex-direction:column;flex:1 1 auto;font-family:var(--ds-fontFamily-body);min-width:0;grid-column:1;grid-row:1}.ds-option__SPFJ1E__check-icon.sc-ds-option{margin-left:var(--ds-spacing-small);flex-shrink:0;display:flex;align-items:center;height:100%}.ds-option__SPFJ1E__description.sc-ds-option{color:var(--ds-textColor-secondary);font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-14);margin-top:var(--ds-spacing-3xSmall);line-height:1.3;grid-column:1;grid-row:2}.ds-option__SPFJ1E__description.sc-ds-option:not(:empty){display:block}`;
 
 const optionIdGenerator = idGenerator('ds-option');
 const DsOption = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.dsClick = createEvent(this, "dsClick");
-        this.dsMounted = createEvent(this, "dsMounted");
-        this.dsValueChange = createEvent(this, "dsValueChange");
-        this.dsLabelChange = createEvent(this, "dsLabelChange");
+        this.dsClick = createEvent(this, "dsClick", 7);
+        this.dsMounted = createEvent(this, "dsMounted", 7);
+        this.dsValueChange = createEvent(this, "dsValueChange", 7);
+        this.dsLabelChange = createEvent(this, "dsLabelChange", 7);
     }
     get el() { return getElement(this); }
     inheritedAttributes = {};
@@ -99,24 +99,30 @@ const DsOption = class {
     render() {
         const baseClass = cx('ds-option');
         const DsIcon = transformTagName('ds-icon', 'ds-option', this.el);
-        return (h("div", { key: 'bb04c65dc3caa755b68c857909841ba7e01062c9', ref: el => (this.optionRef = el), id: this.dsId, class: classNames(baseClass, {
+        return (h("div", { key: 'f3b3d9431c291de33bc44172db062ea4fcadd9ed', ref: el => (this.optionRef = el), id: this.dsId, class: classNames(baseClass, {
                 [`${baseClass}--multiple`]: this.isMultiple,
                 [`${baseClass}--active`]: this.dsActive,
                 [`${baseClass}--selected`]: this.dsSelected,
                 [`${baseClass}--disabled`]: this.dsDisabled,
                 [`${baseClass}--hidden`]: this.dsHidden,
-            }), role: "option", "aria-selected": String(this.dsSelected), "aria-disabled": String(this.dsDisabled), "aria-hidden": String(this.dsHidden), tabIndex: this.internalTabIndex, ...this.inheritedAttributes }, this.isMultiple && (h("span", { key: 'e9dd6caa4d6b1361bf2be12510009babf4ed6091', class: `${baseClass}__checkbox` }, this.dsSelected && (h(DsIcon, { key: '8dd1b3e8406c3b4a94aa0875be7471bf36619f60', class: `${baseClass}__checkbox__icon`, dsName: "check_small", dsSize: "1.25rem", dsColour: this.dsDisabled ? 'ds-textColor-disabled-onLight' : 'ds-textColor-white' })))), h(Fragment, { key: '500b7bfd93c36617382081a67d4e2ceae4e4bd48' }, h("span", { key: '71c0bcdc54ca94d20d92e0f935ecbcdeb070322f' }, h("span", { key: 'a53462d0aad23b33b5b5cb0177153319f179721a', class: `${baseClass}__label`, ref: el => (this.optionLabelTextRef = el) }, h("slot", { key: '702bd21da288d1bb6550e03581f5318929949bcc' }, this.dsLabel)), this.dsDescription && h("span", { key: 'e4ade35a738c189bbb9f72dbb7aede215dc7b942', class: `${baseClass}__description` }, this.dsDescription)), !this.isMultiple && this.dsSelected && h(DsIcon, { key: 'de13ceb3ffba87571d2785270480a17447e4df19', dsName: "check", class: `${baseClass}__check-icon` }))));
+            }), role: "option", "aria-selected": String(this.dsSelected), "aria-disabled": String(this.dsDisabled), "aria-hidden": String(this.dsHidden), tabIndex: this.internalTabIndex, ...this.inheritedAttributes }, this.isMultiple && (h("span", { key: 'c3406f80f847bea5ee8b8074f7d337069980a222', class: `${baseClass}__checkbox` }, this.dsSelected && (h(DsIcon, { key: '88f66a28771ca6238b3c3015e7ea5d01e3d4a9d6', class: `${baseClass}__checkbox__icon`, dsName: "check_small", dsSize: "1.25rem", dsColour: this.dsDisabled ? 'ds-textColor-disabled-onLight' : 'ds-textColor-white' })))), h(Fragment, { key: '9cb09a61253d7aed983626a547209057994184a3' }, h("span", { key: '1407f9ee7ba6faae1140335bc364fd552c3ca1f3' }, h("span", { key: 'b2dde5cbf32871dc64b9ea1456a9e16ab07e5490', class: `${baseClass}__label`, ref: el => (this.optionLabelTextRef = el) }, h("slot", { key: 'a78869160f7a66f6fe75b3b669b8633d595c2f60' }, this.dsLabel)), this.dsDescription && h("span", { key: 'c243fd5a045bf4d2218bff0ac8234b035365de0c', class: `${baseClass}__description` }, this.dsDescription)), !this.isMultiple && this.dsSelected && h(DsIcon, { key: 'a3b690f4035cdc9619c2bfc1eb5d24f5a994a2e6', dsName: "check", class: `${baseClass}__check-icon` }))));
     }
     static get watchers() { return {
-        "dsActive": ["dsActiveObserver"],
-        "dsValue": ["dsValueObserver"],
-        "dsLabel": ["dsLabelObserver"]
+        "dsActive": [{
+                "dsActiveObserver": 0
+            }],
+        "dsValue": [{
+                "dsValueObserver": 0
+            }],
+        "dsLabel": [{
+                "dsLabelObserver": 0
+            }]
     }; }
 };
 declareComponentDependencies([h("ds-icon", { dsName: "" })]);
-DsOption.style = dsOptionCss;
+DsOption.style = dsOptionCss();
 
-const dsOptionGroupCss = ".ds-option-group__oSBnIJ.sc-ds-option-group{display:block;font-family:var(--ds-fontFamily-body)}.ds-option-group__oSBnIJ--hidden.sc-ds-option-group{display:none}.ds-option-group__oSBnIJ.sc-ds-option-group ul.sc-ds-option-group{padding:0}.ds-option-group__oSBnIJ__label.sc-ds-option-group{position:sticky;display:block;top:0;background-color:var(--ds-bgColor-neutralLight);z-index:1;padding:var(--ds-spacing-2xSmall);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-semibold);line-height:var(--ds-lineHeight-large)}.ds-option-group__oSBnIJ__label__shadow.sc-ds-option-group{box-shadow:var(--ds-shadow-overflow)}";
+const dsOptionGroupCss = () => `.ds-option-group__SPFJ1E.sc-ds-option-group{display:block;font-family:var(--ds-fontFamily-body)}.ds-option-group__SPFJ1E--hidden.sc-ds-option-group{display:none}.ds-option-group__SPFJ1E.sc-ds-option-group ul.sc-ds-option-group{padding:0}.ds-option-group__SPFJ1E__label.sc-ds-option-group{position:sticky;display:block;top:0;background-color:var(--ds-bgColor-neutralLight);z-index:1;padding:var(--ds-spacing-2xSmall);font-size:var(--ds-fontSize-14);font-weight:var(--ds-fontWeight-semibold);line-height:var(--ds-lineHeight-large)}.ds-option-group__SPFJ1E__label__shadow.sc-ds-option-group{box-shadow:var(--ds-shadow-overflow)}`;
 
 const DsOptionGroup = class {
     constructor(hostRef) {
@@ -152,14 +158,16 @@ const DsOptionGroup = class {
     }
     render() {
         const baseClass = cx('ds-option-group');
-        return (h("div", { key: '2522430be2d00681a6b28f0a8c381846c66eca06', class: classNames(`${baseClass}`, {
+        return (h("div", { key: 'b1161298f8ef8d2b305b9837a3d2f9501858837b', class: classNames(`${baseClass}`, {
                 [`${baseClass}--hidden`]: this.dsHidden,
-            }), role: "group", "aria-labelledby": this.groupId, ...this.inheritedAttributes }, h("div", { key: 'b5f646b7eeb45b942e2e65e6f59446371aff0363', class: `${baseClass}__label`, id: this.groupId }, this.dsLabel), h("slot", { key: '4d2777f84ba0b4d2725199785bab6e54a9fc4a34' })));
+            }), role: "group", "aria-labelledby": this.groupId, ...this.inheritedAttributes }, h("div", { key: 'dff52700dd3d9aa86218b6a64969ea67970c2c3a', class: `${baseClass}__label`, id: this.groupId }, this.dsLabel), h("slot", { key: '3573bfa76edb767d6eb0fcef6dc752f4ed42cb64' })));
     }
     static get watchers() { return {
-        "dsLabel": ["dsLabelObserver"]
+        "dsLabel": [{
+                "dsLabelObserver": 0
+            }]
     }; }
 };
-DsOptionGroup.style = dsOptionGroupCss;
+DsOptionGroup.style = dsOptionGroupCss();
 
 export { DsOption as ds_option, DsOptionGroup as ds_option_group };