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

package/dist/components/ds-ribbon.js

@@ -1,496 +1 @@
-import { p as proxyCustomElement, H, c as createEvent, h } from './p-GalXVdFP.js';
-import { c as classNames } from './p-BfTCfPZ1.js';
-import { b as inheritSpecifiedAttributes, i as inheritAriaAttributes } from './p-BecId8t2.js';
-import { i as idGenerator, t as transformTagName, d as declareComponentDependencies } from './p-J5Ghj1_T.js';
-import { c as cx } from './p-C34PGDVY.js';
-import { v as visuallyHiddenAssistiveText } from './p-CFr-8gB_.js';
-import { d as defaultLanguage, g as getLanguage, o as onChange } from './p-B71giUZh.js';
-import { a as appData } from './p-gPkqWfeS.js';
-import { d as defineCustomElement$8 } from './p-CBTcmEBq.js';
-import { d as defineCustomElement$7 } from './p-DIxFOW85.js';
-import { d as defineCustomElement$6 } from './p-47OG_OLT.js';
-import { d as defineCustomElement$5 } from './p-qN7q9daC.js';
-import { d as defineCustomElement$4 } from './p-Dq55XDgV.js';
-import { d as defineCustomElement$3 } from './p-DcrTglyg.js';
-import { d as defineCustomElement$2 } from './p-Cq_RwLX7.js';
-
-const convertToRibbonLinks = (links, ribbonData, lang = 'en') => {
-    return links.map(link => ({
-        id: link.id,
-        href: link.href || '#',
-        text: link.text,
-        badge: link.badge ? ribbonData.badgeTexts[link.badge][lang] : undefined,
-        target: link.target,
-        mobileOnly: link.mobileOnly || false,
-    }));
-};
-
-class DataService {
-    static async loadRibbonData(url) {
-        if (!url || url.trim() === '') {
-            return null;
-        }
-        try {
-            const response = await fetch(url);
-            if (!response.ok) {
-                throw new Error(`Failed to fetch data: ${response.status}`);
-            }
-            const data = await response.json();
-            if (data.v1?.ribbon) {
-                return data.v1.ribbon;
-            }
-            else {
-                throw new Error('Invalid data structure: expected v1.ribbon');
-            }
-        }
-        catch (error) {
-            console.warn('Failed to load external ribbon data:', error);
-            return null;
-        }
-    }
-}
-
-const dsRibbonCss = ".ds-no-style-leak *{all:unset;box-sizing:border-box;display:block}:host{display:block;width:100%;border-bottom:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light, #ccc);background-color:var(--ds-bgColor-white, #fff);position:relative;z-index:1000}.ds-ribbon__oSBnIJ{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);display:block}.ds-ribbon__oSBnIJ__container{display:grid;grid-template-columns:8rem auto;align-items:center;justify-content:space-between;padding:0 var(--ds-spacing-small, 16px);max-width:120rem;margin:0 auto;height:3rem}@media (min-width: 30rem){.ds-ribbon__oSBnIJ__container{grid-template-columns:auto auto}}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__container{grid-template-columns:145px auto;padding:0 var(--ds-spacing-large, 32px)}}@media (min-width: 75rem){.ds-ribbon__oSBnIJ__container{grid-template-columns:auto auto}}.ds-ribbon__oSBnIJ__branding{display:flex;align-items:center;flex-shrink:0}.ds-ribbon__oSBnIJ__mobile-toggle{display:block;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__mobile-toggle{display:none}}.ds-ribbon__oSBnIJ__drawer-backdrop{position:fixed;inset:0;background-color:var(--ds-overlay-black-00);grid-column-end:-1;opacity:0;z-index:-1;pointer-events:none}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-backdrop{display:none}}.ds-ribbon__oSBnIJ--drawer-open .ds-ribbon__oSBnIJ__drawer-backdrop{cursor:pointer;pointer-events:auto}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-backdrop{pointer-events:auto;z-index:1}.ds-ribbon__oSBnIJ__drawer-backdrop,.ds-ribbon__oSBnIJ--drawer-open .ds-ribbon__oSBnIJ__container .ds-ribbon__oSBnIJ__drawer-backdrop{position:static;background-color:unset;backdrop-filter:unset;opacity:1;transition:none}}.ds-ribbon__oSBnIJ--drawer-clicked .ds-ribbon__oSBnIJ__drawer-backdrop{transition:background-color 0.3s, opacity 0s 0.3s}.ds-ribbon__oSBnIJ--drawer-open .ds-ribbon__oSBnIJ__drawer-backdrop{background-color:var(--ds-overlay-black-50);opacity:1;transition:background-color 0.1s 0.3s, opacity 0s 0s;z-index:999}.ds-ribbon__oSBnIJ__desktop-nav{display:none;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__desktop-nav{display:block}}.ds-ribbon__oSBnIJ__desktop-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;gap:var(--ds-spacing-medium, 24px);align-items:center}.ds-ribbon__oSBnIJ__desktop-link-item{display:flex;align-items:center;position:relative;text-transform:uppercase;height:var(--ds-spacing-2xLarge, 3rem)}.ds-ribbon__oSBnIJ__desktop-link{font-size:var(--ds-fontSize-12);white-space:nowrap}.ds-ribbon__oSBnIJ__desktop-badge{font-size:var(--ds-fontSize-12);letter-spacing:var(--ds-letterSpacing-wide, 0);margin-left:var(--ds-spacing-2xSmall, 8px);text-transform:none;position:absolute;top:0;right:100%}.ds-ribbon__oSBnIJ__desktop-badge>*{display:flex;align-items:center;justify-content:center;min-width:1.5rem;min-height:1.5rem;border-radius:1.25rem;padding:0 var(--ds-spacing-2xSmall, 0.5rem)}.ds-ribbon__oSBnIJ__desktop-badge>* span{font-size:var(--ds-fontSize-12);line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}.ds-ribbon__oSBnIJ__drawer{position:absolute;top:0;right:0;bottom:0;width:calc(100% - var(--ds-spacing-small, 16px));background-color:var(--ds-bgColor-white, #fff);box-shadow:var(--ds-shadow-medium);padding-top:0;transform:translateX(100%);transition:transform 0.3s ease;overflow-y:auto;cursor:default}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer{position:static;width:auto;max-width:none;background-color:transparent;box-shadow:none;padding-top:0;transform:none;transition:none;overflow-y:visible}}.ds-ribbon__oSBnIJ--drawer-open .ds-ribbon__oSBnIJ__drawer{transform:translateX(0%)}.ds-ribbon__oSBnIJ__drawer-header{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;height:3rem;z-index:1;padding:var(--ds-spacing-small, 16px) var(--ds-spacing-medium, 24px);border-bottom:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light, #ccc);background-color:var(--ds-bgColor-white, #fff)}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-header{display:none}}.ds-ribbon__oSBnIJ__drawer-branding{display:flex;align-items:center;flex-shrink:0;max-width:8rem}@media (min-width: 30rem){.ds-ribbon__oSBnIJ__drawer-branding{max-width:unset}}.ds-ribbon__oSBnIJ__drawer-close{flex-shrink:0;margin-left:var(--ds-spacing-small, 16px)}.ds-ribbon__oSBnIJ__drawer-nav{display:block;padding:var(--ds-spacing-medium, 24px);position:relative}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-nav{padding:0}}.ds-ribbon__oSBnIJ__top-scrim,.ds-ribbon__oSBnIJ__bottom-scrim{pointer-events:none;width:100%;height:2.75rem;margin-top:-2.75rem;flex:0 0 auto;min-height:0;position:sticky;z-index:1;display:none}.ds-ribbon__oSBnIJ__top-scrim{top:3rem;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-ribbon__oSBnIJ__bottom-scrim{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.has-top-scrim .ds-ribbon__oSBnIJ__top-scrim{display:block}.has-bottom-scrim .ds-ribbon__oSBnIJ__bottom-scrim{display:block}.ds-ribbon__oSBnIJ__drawer-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--ds-spacing-4xSmall, 2px)}.ds-ribbon__oSBnIJ__drawer-link-item{display:flex;align-items:center;position:relative;text-transform:uppercase;border-bottom:var(--ds-borderWidth-hairline) solid var(--ds-color-border-subtle);height:var(--ds-spacing-2xLarge, 3rem)}.ds-ribbon__oSBnIJ__drawer-link-item:last-child{border-bottom:none}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-link-item{justify-content:flex-start;padding:0;border-bottom:none}.ds-ribbon__oSBnIJ__drawer-link-item:last-child{border-bottom:none}}.ds-ribbon__oSBnIJ__drawer-link{font-size:var(--ds-fontSize-14, 0.875rem);white-space:nowrap}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-link{font-size:var(--ds-fontSize-12, 0.75rem)}}.ds-ribbon__oSBnIJ__drawer-badge{font-size:var(--ds-fontSize-12);letter-spacing:var(--ds-letterSpacing-wide, 0);margin-left:var(--ds-spacing-2xSmall, 8px);text-transform:none}@media (min-width: 60rem){.ds-ribbon__oSBnIJ__drawer-badge{position:absolute;top:0;right:100%}}.ds-ribbon__oSBnIJ__drawer-badge>*{display:flex;align-items:center;justify-content:center;min-width:1.5rem;min-height:1.5rem;border-radius:1.25rem;padding:0 var(--ds-spacing-2xSmall, 0.5rem)}.ds-ribbon__oSBnIJ__drawer-badge>* span{font-size:inherit;line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}:host(.ds-ribbon__oSBnIJ--drawer-open) .ds-ribbon__oSBnIJ__drawer-backdrop{display:block}@media (min-width: 60rem){:host(.ds-ribbon__oSBnIJ--drawer-open) .ds-ribbon__oSBnIJ__drawer-backdrop{display:block}}:host(.ds-ribbon__oSBnIJ--drawer-open) .ds-ribbon__oSBnIJ__drawer{transform:translateX(0)}@media (min-width: 60rem){:host(.ds-ribbon__oSBnIJ--drawer-open) .ds-ribbon__oSBnIJ__drawer{transform:none}}";
-
-const fallbackRibbonData = appData.v1.ribbon;
-const DsRibbon$1 = proxyCustomElement(class DsRibbon extends H {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.dsDrawerToggle = createEvent(this, "dsDrawerToggle");
-    }
-    inheritedAttributes = {};
-    get el() { return this; }
-    drawerRef;
-    mobileToggleRef;
-    dsIcon;
-    dsSiteName;
-    dsHideBranding = false;
-    dsIconTitle;
-    dsIconAriaLabel;
-    dsLinks;
-    dsBrandingUrls;
-    dsMobileToggleText;
-    dsCloseButtonText;
-    dsNavAriaLabel;
-    dsLogoAriaLabel;
-    dsCloseButtonId = idGenerator('ds-button-drawer-close').next().value;
-    dsMobileToggleId = idGenerator('ds-button-mobile-toggle').next().value;
-    dsDataUrl = '';
-    isMobileDrawerOpen = false;
-    isMobileDrawerClicked = false;
-    loadedExternalData = null;
-    lang = defaultLanguage;
-    icon;
-    brandingUrls;
-    get DsLinkLogo() {
-        return transformTagName('ds-link-logo', 'ds-ribbon', this.el);
-    }
-    get DsLink() {
-        return transformTagName('ds-link', 'ds-ribbon', this.el);
-    }
-    get DsButton() {
-        return transformTagName('ds-button', 'ds-ribbon', this.el);
-    }
-    get DsTag() {
-        return transformTagName('ds-tag', 'ds-ribbon', this.el);
-    }
-    get DsVisuallyHidden() {
-        return transformTagName('ds-visually-hidden', 'ds-ribbon', this.el);
-    }
-    get localizedLinks() {
-        if (this.dsLinks)
-            return this.dsLinks;
-        if (this.loadedExternalData?.links?.[this.lang]) {
-            return convertToRibbonLinks(this.loadedExternalData.links[this.lang], this.loadedExternalData, this.lang);
-        }
-        return undefined;
-    }
-    get localizedSiteName() {
-        return this.dsSiteName || this.loadedExternalData?.siteNames?.[this.lang];
-    }
-    get localizedSitesText() {
-        return this.dsMobileToggleText || this.loadedExternalData?.uiTexts?.sites?.[this.lang];
-    }
-    get localizedCloseText() {
-        return this.dsCloseButtonText || this.loadedExternalData?.uiTexts?.close?.[this.lang];
-    }
-    get localizedNavAriaLabel() {
-        return this.dsNavAriaLabel || this.loadedExternalData?.uiTexts?.navigationLabel?.[this.lang];
-    }
-    get localizedLogoAriaLabel() {
-        return this.dsLogoAriaLabel || this.loadedExternalData?.uiTexts?.logoLabel?.[this.lang];
-    }
-    dsDrawerToggle;
-    componentWillLoad() {
-        this.inheritedAttributes = {
-            ...inheritAriaAttributes(this.el),
-            ...inheritSpecifiedAttributes(this.el, ['lang']),
-        };
-    }
-    async componentDidLoad() {
-        this.lang = getLanguage();
-        this.setupStoreListener();
-        if (this.dsDataUrl && this.dsDataUrl.trim() !== '') {
-            await this.loadExternalData();
-        }
-    }
-    async loadExternalData() {
-        try {
-            const data = await DataService.loadRibbonData(this.dsDataUrl);
-            if (!data)
-                throw new Error('No external data');
-            this.loadedExternalData = data;
-        }
-        catch {
-            this.loadedExternalData = fallbackRibbonData;
-        }
-        if (!this.dsIcon) {
-            this.icon = this.loadedExternalData?.config?.dsIcon;
-        }
-        if (!this.dsBrandingUrls) {
-            this.brandingUrls = this.loadedExternalData?.brandingUrls;
-        }
-    }
-    setupStoreListener() {
-        this.storeUnsubscribe = onChange('language', newLanguage => {
-            if (newLanguage && newLanguage !== this.lang) {
-                this.lang = newLanguage;
-            }
-        });
-    }
-    dsIconObserver(newIcon) {
-        this.icon = newIcon;
-    }
-    dsBrandingUrlsObserver(newUrls) {
-        this.brandingUrls = newUrls;
-    }
-    isMobileDrawerOpenObserver(isOpen) {
-        this.dsDrawerToggle.emit(isOpen);
-        if (isOpen) {
-            this.openMobileDrawer();
-        }
-        else {
-            this.closeMobileDrawer();
-        }
-    }
-    handleLanguageChange(newValue) {
-        this.lang = newValue.detail;
-    }
-    handleKeyDown(event) {
-        if (!this.isMobileDrawerOpen)
-            return;
-        if (event.key === 'Escape') {
-            event.preventDefault();
-            this.closeMobileDrawer();
-            return;
-        }
-        if (event.key === 'Tab') {
-            this.handleFocusTrap(event);
-            return;
-        }
-    }
-    handleWindowResize() {
-        clearTimeout(this.resizeTimeout);
-        this.resizeTimeout = setTimeout(() => {
-            this.updateScrollState();
-        }, 150);
-    }
-    resizeTimeout;
-    storeUnsubscribe;
-    handleMobileToggle = () => {
-        this.isMobileDrawerClicked = true;
-        this.isMobileDrawerOpen = !this.isMobileDrawerOpen;
-    };
-    handleDrawerScroll = (event) => {
-        const drawer = event.target;
-        if (!drawer)
-            return;
-        const scrollTop = drawer.scrollTop;
-        const scrollHeight = drawer.scrollHeight;
-        const clientHeight = drawer.clientHeight;
-        const scrollableHeight = scrollHeight - clientHeight;
-        if (scrollableHeight <= 0)
-            return;
-        const tolerance = 1;
-        if (scrollTop <= tolerance) {
-            drawer.classList.remove('has-top-scrim');
-            drawer.classList.add('has-bottom-scrim');
-        }
-        else if (scrollTop >= scrollableHeight - tolerance) {
-            drawer.classList.add('has-top-scrim');
-            drawer.classList.remove('has-bottom-scrim');
-        }
-        else {
-            drawer.classList.add('has-top-scrim');
-            drawer.classList.add('has-bottom-scrim');
-        }
-    };
-    handleDrawerBackdropClick = (event) => {
-        if (event.target === event.currentTarget) {
-            this.isMobileDrawerOpen = false;
-        }
-    };
-    getDrawerFocusableElements() {
-        if (!this.drawerRef)
-            return [];
-        const focusableElements = [];
-        const closeButton = this.drawerRef.querySelector(`#${this.dsCloseButtonId}`);
-        if (closeButton && this.isFocusableElement(closeButton)) {
-            focusableElements.push(closeButton);
-        }
-        const logoComponent = this.drawerRef.querySelector(this.DsLinkLogo);
-        if (logoComponent && logoComponent.shadowRoot) {
-            const logoLink = logoComponent.shadowRoot.querySelector('a');
-            if (logoLink && this.isFocusableElement(logoLink)) {
-                focusableElements.push(logoLink);
-            }
-        }
-        const navLinkContainers = this.drawerRef.querySelectorAll(`[class*="drawer-link-item"]`);
-        navLinkContainers.forEach(container => {
-            const dsLinkElement = container.querySelector(this.DsLink);
-            if (dsLinkElement && dsLinkElement.shadowRoot) {
-                const linkElement = dsLinkElement.shadowRoot.querySelector('a');
-                if (linkElement && this.isFocusableElement(linkElement)) {
-                    focusableElements.push(linkElement);
-                }
-            }
-        });
-        return focusableElements;
-    }
-    isFocusableElement(element) {
-        if (!element || element.offsetParent === null)
-            return false;
-        const tagName = element.tagName.toLowerCase();
-        return ['a', 'button'].includes(tagName) && element.tabIndex !== -1;
-    }
-    handleFocusTrap(event) {
-        const focusableElements = this.getDrawerFocusableElements();
-        if (focusableElements.length === 0)
-            return;
-        let currentElement = document.activeElement;
-        if (currentElement && currentElement.shadowRoot && currentElement.shadowRoot.activeElement) {
-            currentElement = currentElement.shadowRoot.activeElement;
-        }
-        if (this.el.shadowRoot && this.el.shadowRoot.activeElement) {
-            currentElement = this.el.shadowRoot.activeElement;
-            if (currentElement.shadowRoot && currentElement.shadowRoot.activeElement) {
-                currentElement = currentElement.shadowRoot.activeElement;
-            }
-        }
-        const currentIndex = focusableElements.indexOf(currentElement);
-        if (event.shiftKey) {
-            const nextIndex = currentIndex <= 0 ? focusableElements.length - 1 : currentIndex - 1;
-            focusableElements[nextIndex]?.focus();
-        }
-        else {
-            const nextIndex = currentIndex >= focusableElements.length - 1 ? 0 : currentIndex + 1;
-            focusableElements[nextIndex]?.focus();
-        }
-        event.preventDefault();
-    }
-    openMobileDrawer() {
-        setTimeout(() => {
-            const buttonElement = this.el.shadowRoot?.querySelector(`#${this.dsCloseButtonId}`);
-            if (buttonElement) {
-                buttonElement.focus();
-            }
-            if (this.drawerRef) {
-                const scrollHeight = this.drawerRef.scrollHeight;
-                const clientHeight = this.drawerRef.clientHeight;
-                const scrollableHeight = scrollHeight - clientHeight;
-                if (scrollableHeight > 0) {
-                    this.setupScrollListener(this.drawerRef, scrollableHeight);
-                }
-            }
-        }, 50);
-    }
-    setupScrollListener(scrollableElement, scrollableHeight) {
-        scrollableElement.removeEventListener('scroll', this.handleDrawerScroll);
-        scrollableElement.addEventListener('scroll', this.handleDrawerScroll, { passive: true });
-        if (this.drawerRef) {
-            const scrollTop = scrollableElement.scrollTop;
-            const tolerance = 1;
-            if (scrollTop <= tolerance) {
-                this.drawerRef.classList.remove('has-top-scrim');
-                this.drawerRef.classList.add('has-bottom-scrim');
-            }
-            else if (scrollTop >= scrollableHeight - tolerance) {
-                this.drawerRef.classList.add('has-top-scrim');
-                this.drawerRef.classList.remove('has-bottom-scrim');
-            }
-            else {
-                this.drawerRef.classList.add('has-top-scrim');
-                this.drawerRef.classList.add('has-bottom-scrim');
-            }
-        }
-    }
-    updateScrollState() {
-        if (!this.isMobileDrawerOpen || !this.drawerRef)
-            return;
-        const scrollHeight = this.drawerRef.scrollHeight;
-        const clientHeight = this.drawerRef.clientHeight;
-        const scrollableHeight = scrollHeight - clientHeight;
-        if (scrollableHeight <= 0) {
-            this.drawerRef.classList.remove('has-top-scrim', 'has-bottom-scrim');
-            this.drawerRef.removeEventListener('scroll', this.handleDrawerScroll);
-            return;
-        }
-        this.setupScrollListener(this.drawerRef, scrollableHeight);
-    }
-    closeMobileDrawer() {
-        this.isMobileDrawerOpen = false;
-        if (this.drawerRef) {
-            this.drawerRef.removeEventListener('scroll', this.handleDrawerScroll);
-        }
-        const buttonInToggle = this.mobileToggleRef?.querySelector('button');
-        setTimeout(() => {
-            buttonInToggle?.focus();
-        }, 100);
-    }
-    getBrandingUrl() {
-        const language = getLanguage() || 'fi';
-        return this.dsBrandingUrls?.[language] || this.brandingUrls?.[language] || fallbackRibbonData.brandingUrls?.[language];
-    }
-    renderBranding() {
-        if (this.dsHideBranding)
-            return null;
-        const baseClass = cx('ds-ribbon');
-        const brandingUrl = this.getBrandingUrl();
-        const iconName = this.dsIcon || this.icon || fallbackRibbonData.config?.dsIcon;
-        return (h("div", { class: `${baseClass}__branding` }, h(this.DsLinkLogo, { dsHref: brandingUrl, dsIcon: iconName, dsIconTitle: this.dsIconTitle, dsIconAriaLabel: this.dsIconAriaLabel, dsText: this.localizedSiteName, dsTarget: "_self", dsAriaLabel: this.localizedLogoAriaLabel })));
-    }
-    renderDesktopNavigation() {
-        const links = this.localizedLinks;
-        if (!links?.length)
-            return null;
-        const baseClass = cx('ds-ribbon');
-        return (h("div", { class: `${baseClass}__desktop-nav` }, h("ul", { class: `${baseClass}__desktop-links` }, links
-            .filter(link => !link.mobileOnly)
-            .map(link => (h("li", { key: `desktop-${link.id}`, class: `${baseClass}__desktop-link-item` }, h(this.DsLink, { dsHref: link.href, dsText: link.text, dsTarget: link.target || '_self', dsVariant: "standalone", dsColour: "black", dsWeight: "semibold", class: `${baseClass}__desktop-link` }, link.badge && (h("span", { slot: "suffix" }, h(this.DsVisuallyHidden, null, " - ", link.badge)))), link.badge && h(this.DsTag, { dsText: link.badge, dsColour: "info", class: `${baseClass}__desktop-badge`, dsAriaHidden: true }), link.target === '_blank' && h(this.DsVisuallyHidden, null, visuallyHiddenAssistiveText())))))));
-    }
-    renderMobileNavigation() {
-        const links = this.localizedLinks;
-        if (!links?.length)
-            return null;
-        const baseClass = cx('ds-ribbon');
-        return (h("div", { class: `${baseClass}__drawer-backdrop`, onClick: this.handleDrawerBackdropClick, ...(this.isMobileDrawerOpen ? {} : { inert: true }) }, h("div", { id: `${baseClass}__drawer`, class: `${baseClass}__drawer`, role: "dialog", "aria-label": "Site navigation menu", "aria-modal": "true", "aria-hidden": this.isMobileDrawerOpen ? 'false' : 'true', ref: el => (this.drawerRef = el) }, this.renderDrawerHeader(), h("div", { class: `${baseClass}__drawer-nav` }, h("div", { class: `${baseClass}__top-scrim` }), h("ul", { class: `${baseClass}__drawer-links` }, links.map(link => (h("li", { key: `mobile-${link.id}`, class: `${baseClass}__drawer-link-item` }, h(this.DsLink, { dsHref: link.href, dsText: link.text, dsTarget: link.target || '_self', dsVariant: "standalone", dsColour: "black", dsWeight: "semibold", class: `${baseClass}__drawer-link` }, link.badge && (h("span", { slot: "suffix" }, h(this.DsVisuallyHidden, null, " - ", link.badge)))), link.badge && h(this.DsTag, { dsText: link.badge, dsColour: "info", class: `${baseClass}__drawer-badge`, dsAriaHidden: true }), link.target === '_blank' && h(this.DsVisuallyHidden, null, visuallyHiddenAssistiveText()))))), h("div", { class: `${baseClass}__bottom-scrim` })))));
-    }
-    renderDrawerHeader() {
-        const baseClass = cx('ds-ribbon');
-        const brandingUrl = this.getBrandingUrl();
-        const iconName = this.dsIcon || this.icon || fallbackRibbonData.config?.dsIcon;
-        return (h("div", { class: `${baseClass}__drawer-header` }, h("div", { class: `${baseClass}__drawer-branding` }, h(this.DsLinkLogo, { class: `${baseClass}__drawer-branding-link`, dsHref: brandingUrl, dsIcon: iconName, dsIconTitle: this.dsIconTitle, dsIconAriaLabel: this.dsIconAriaLabel, dsText: this.localizedSiteName, dsTarget: "_self", dsAriaLabel: this.localizedLogoAriaLabel })), h(this.DsButton, { dsId: this.dsCloseButtonId, dsType: "button", dsVariant: "supplementary", dsColour: "black", dsSize: "small", dsText: this.localizedCloseText, dsIcon: "close", dsIconPosition: "end", class: `${baseClass}__drawer-close`, onClick: this.handleMobileToggle })));
-    }
-    renderMobileToggle() {
-        const links = this.localizedLinks;
-        if (!links?.length || !this.localizedSitesText || !this.localizedCloseText)
-            return null;
-        const baseClass = cx('ds-ribbon');
-        const buttonText = this.localizedSitesText;
-        const iconName = 'keyboard_arrow_down';
-        return (h(this.DsButton, { ref: el => (this.mobileToggleRef = el), id: this.dsMobileToggleId, class: `${baseClass}__mobile-toggle`, dsVariant: "supplementary", dsColour: "black", dsSize: "small", dsText: buttonText, dsIcon: iconName, dsIconPosition: "end", onClick: this.handleMobileToggle, dsAriaExpanded: this.isMobileDrawerOpen, dsAriaControls: `${baseClass}__drawer`, dsAriaHaspopup: "dialog" }));
-    }
-    disconnectedCallback() {
-        clearTimeout(this.resizeTimeout);
-        const drawer = this.el.shadowRoot?.querySelector(`#${cx('ds-ribbon')}__drawer`);
-        drawer?.removeEventListener('scroll', this.handleDrawerScroll);
-        this.storeUnsubscribe?.();
-    }
-    render() {
-        const baseClass = cx('ds-ribbon');
-        const ribbonClasses = classNames(baseClass, {
-            [`${baseClass}--drawer-open`]: this.isMobileDrawerOpen,
-            [`${baseClass}--drawer-clicked`]: this.isMobileDrawerClicked,
-        });
-        return (h("div", { key: '87e9bae7c9e635fb51e618d1027829725bf9701f', class: ribbonClasses }, h("nav", { key: '66425f1bbea02075de67220e9faead1d04cf36c0', "aria-label": this.localizedNavAriaLabel, ...(this.isMobileDrawerOpen ? { inert: true } : {}) }, h("div", { key: 'e19044437b0739fe43d9f22e5e9f0e528e214902', class: `${baseClass}__container`, ...this.inheritedAttributes }, this.renderBranding(), this.renderDesktopNavigation(), this.renderMobileToggle())), this.renderMobileNavigation()));
-    }
-    static get watchers() { return {
-        "dsIcon": ["dsIconObserver"],
-        "dsBrandingUrls": ["dsBrandingUrlsObserver"],
-        "isMobileDrawerOpen": ["isMobileDrawerOpenObserver"]
-    }; }
-    static get style() { return dsRibbonCss; }
-}, [257, "ds-ribbon", {
-        "dsIcon": [1, "ds-icon"],
-        "dsSiteName": [1, "ds-site-name"],
-        "dsHideBranding": [4, "ds-hide-branding"],
-        "dsIconTitle": [1, "ds-icon-title"],
-        "dsIconAriaLabel": [1, "ds-icon-aria-label"],
-        "dsLinks": [16],
-        "dsBrandingUrls": [16],
-        "dsMobileToggleText": [1, "ds-mobile-toggle-text"],
-        "dsCloseButtonText": [1, "ds-close-button-text"],
-        "dsNavAriaLabel": [1, "ds-nav-aria-label"],
-        "dsLogoAriaLabel": [1, "ds-logo-aria-label"],
-        "dsCloseButtonId": [1, "ds-close-button-id"],
-        "dsMobileToggleId": [1, "ds-mobile-toggle-id"],
-        "dsDataUrl": [1, "ds-data-url"],
-        "isMobileDrawerOpen": [32],
-        "isMobileDrawerClicked": [32],
-        "loadedExternalData": [32],
-        "lang": [32],
-        "icon": [32],
-        "brandingUrls": [32]
-    }, [[16, "dsLanguageChange", "handleLanguageChange"], [4, "keydown", "handleKeyDown"], [9, "resize", "handleWindowResize"]], {
-        "dsIcon": ["dsIconObserver"],
-        "dsBrandingUrls": ["dsBrandingUrlsObserver"],
-        "isMobileDrawerOpen": ["isMobileDrawerOpenObserver"]
-    }]);
-declareComponentDependencies([h("ds-link-logo", { dsHref: "" }), h("ds-link", { dsText: "" }), h("ds-button", null), h("ds-tag", { dsText: "" }), h("ds-visually-hidden", null)]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ds-ribbon", "ds-button", "ds-icon", "ds-link", "ds-link-logo", "ds-spinner", "ds-tag", "ds-visually-hidden"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ds-ribbon":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DsRibbon$1);
-            }
-            break;
-        case "ds-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "ds-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "ds-link":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "ds-link-logo":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "ds-spinner":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "ds-tag":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "ds-visually-hidden":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const DsRibbon = DsRibbon$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DsRibbon, defineCustomElement };
+import{p as s,H as i,c as e,h as t,t as r}from"./p-D7drWwKe.js";import{c as o}from"./p-BfTCfPZ1.js";import{b as n,i as a}from"./p-BecId8t2.js";import{i as d,t as l,d as b}from"./p-J5Ghj1_T.js";import{c}from"./p-DgTb4Jpc.js";import{v as h}from"./p-CRw90huu.js";import{d as _,g as m,o as p}from"./p-J7Ct1MQ0.js";import{a as g}from"./p-gPkqWfeS.js";import{d as u}from"./p-Dib6BujO.js";import{d as w}from"./p-BRKwvv98.js";import{d as f}from"./p-3h1AY-Xk.js";import{d as k}from"./p-ywaasssP.js";import{d as v}from"./p-B9VvQC9G.js";import{d as S}from"./p-ORTpE52P.js";import{d as x}from"./p-tTA4zhDH.js";class E{static async loadRibbonData(s){if(!s||""===s.trim())return null;try{const i=await fetch(s);if(!i.ok)throw Error("Failed to fetch data: "+i.status);const e=await i.json();if(e.v1?.ribbon)return e.v1.ribbon;throw Error("Invalid data structure: expected v1.ribbon")}catch(s){return console.warn("Failed to load external ribbon data:",s),null}}}const y=g.v1.ribbon,F=s(class extends i{constructor(s){super(),!1!==s&&this.__registerHost(),this.__attachShadow(),this.dsDrawerToggle=e(this,"dsDrawerToggle",7)}inheritedAttributes={};get el(){return this}drawerRef;mobileToggleRef;dsIcon;dsSiteName;dsHideBranding=!1;dsIconTitle;dsIconAriaLabel;dsLinks;dsBrandingUrls;dsMobileToggleText;dsCloseButtonText;dsNavAriaLabel;dsLogoAriaLabel;dsCloseButtonId=d("ds-button-drawer-close").next().value;dsMobileToggleId=d("ds-button-mobile-toggle").next().value;dsDataUrl="";isMobileDrawerOpen=!1;isMobileDrawerClicked=!1;loadedExternalData=null;lang=_;icon;brandingUrls;get DsLinkLogo(){return l("ds-link-logo","ds-ribbon",this.el)}get DsLink(){return l("ds-link","ds-ribbon",this.el)}get DsButton(){return l("ds-button","ds-ribbon",this.el)}get DsTag(){return l("ds-tag","ds-ribbon",this.el)}get DsVisuallyHidden(){return l("ds-visually-hidden","ds-ribbon",this.el)}get localizedLinks(){return this.dsLinks?this.dsLinks:this.loadedExternalData?.links?.[this.lang]?((s,i,e="en")=>this.loadedExternalData.links[this.lang].map((s=>({id:s.id,href:s.href||"#",text:s.text,badge:s.badge?i.badgeTexts[s.badge][e]:void 0,target:s.target,mobileOnly:s.mobileOnly||!1}))))(0,this.loadedExternalData,this.lang):void 0}get localizedSiteName(){return this.dsSiteName||this.loadedExternalData?.siteNames?.[this.lang]}get localizedSitesText(){return this.dsMobileToggleText||this.loadedExternalData?.uiTexts?.sites?.[this.lang]}get localizedCloseText(){return this.dsCloseButtonText||this.loadedExternalData?.uiTexts?.close?.[this.lang]}get localizedNavAriaLabel(){return this.dsNavAriaLabel||this.loadedExternalData?.uiTexts?.navigationLabel?.[this.lang]}get localizedLogoAriaLabel(){return this.dsLogoAriaLabel||this.loadedExternalData?.uiTexts?.logoLabel?.[this.lang]}dsDrawerToggle;componentWillLoad(){this.inheritedAttributes={...a(this.el),...n(this.el,["lang"])}}async componentDidLoad(){this.lang=m(),this.setupStoreListener(),this.dsDataUrl&&""!==this.dsDataUrl.trim()&&await this.loadExternalData()}async loadExternalData(){try{const s=await E.loadRibbonData(this.dsDataUrl);if(!s)throw Error("No external data");this.loadedExternalData=s}catch{this.loadedExternalData=y}this.dsIcon||(this.icon=this.loadedExternalData?.config?.dsIcon),this.dsBrandingUrls||(this.brandingUrls=this.loadedExternalData?.brandingUrls)}setupStoreListener(){this.storeUnsubscribe=p("language",(s=>{s&&s!==this.lang&&(this.lang=s)}))}dsIconObserver(s){this.icon=s}dsBrandingUrlsObserver(s){this.brandingUrls=s}isMobileDrawerOpenObserver(s){this.dsDrawerToggle.emit(s),s?this.openMobileDrawer():this.closeMobileDrawer()}handleLanguageChange(s){this.lang=s.detail}handleKeyDown(s){if(this.isMobileDrawerOpen)return"Escape"===s.key?(s.preventDefault(),void this.closeMobileDrawer()):void("Tab"!==s.key||this.handleFocusTrap(s))}handleWindowResize(){clearTimeout(this.resizeTimeout),this.resizeTimeout=setTimeout((()=>{this.updateScrollState()}),150)}resizeTimeout;storeUnsubscribe;handleMobileToggle=()=>{this.isMobileDrawerClicked=!0,this.isMobileDrawerOpen=!this.isMobileDrawerOpen};handleDrawerScroll=s=>{const i=s.target;if(!i)return;const e=i.scrollTop,t=i.scrollHeight-i.clientHeight;t<=0||(e<=1?(i.classList.remove("has-top-scrim"),i.classList.add("has-bottom-scrim")):e>=t-1?(i.classList.add("has-top-scrim"),i.classList.remove("has-bottom-scrim")):(i.classList.add("has-top-scrim"),i.classList.add("has-bottom-scrim")))};handleDrawerBackdropClick=s=>{s.target===s.currentTarget&&(this.isMobileDrawerOpen=!1)};getDrawerFocusableElements(){if(!this.drawerRef)return[];const s=[],i=this.drawerRef.querySelector("#"+this.dsCloseButtonId);i&&this.isFocusableElement(i)&&s.push(i);const e=this.drawerRef.querySelector(this.DsLinkLogo);if(e&&e.shadowRoot){const i=e.shadowRoot.querySelector("a");i&&this.isFocusableElement(i)&&s.push(i)}return this.drawerRef.querySelectorAll('[class*="drawer-link-item"]').forEach((i=>{const e=i.querySelector(this.DsLink);if(e&&e.shadowRoot){const i=e.shadowRoot.querySelector("a");i&&this.isFocusableElement(i)&&s.push(i)}})),s}isFocusableElement(s){if(!s||null===s.offsetParent)return!1;const i=s.tagName.toLowerCase();return["a","button"].includes(i)&&-1!==s.tabIndex}handleFocusTrap(s){const i=this.getDrawerFocusableElements();if(0===i.length)return;let e=document.activeElement;e&&e.shadowRoot&&e.shadowRoot.activeElement&&(e=e.shadowRoot.activeElement),this.el.shadowRoot&&this.el.shadowRoot.activeElement&&(e=this.el.shadowRoot.activeElement,e.shadowRoot&&e.shadowRoot.activeElement&&(e=e.shadowRoot.activeElement));const t=i.indexOf(e);if(s.shiftKey){const s=t<=0?i.length-1:t-1;i[s]?.focus()}else{const s=t>=i.length-1?0:t+1;i[s]?.focus()}s.preventDefault()}openMobileDrawer(){setTimeout((()=>{const s=this.el.shadowRoot?.querySelector("#"+this.dsCloseButtonId);if(s&&s.focus(),this.drawerRef){const s=this.drawerRef.scrollHeight-this.drawerRef.clientHeight;s>0&&this.setupScrollListener(this.drawerRef,s)}}),50)}setupScrollListener(s,i){if(s.removeEventListener("scroll",this.handleDrawerScroll),s.addEventListener("scroll",this.handleDrawerScroll,{passive:!0}),this.drawerRef){const e=s.scrollTop,t=1;e<=t?(this.drawerRef.classList.remove("has-top-scrim"),this.drawerRef.classList.add("has-bottom-scrim")):e>=i-t?(this.drawerRef.classList.add("has-top-scrim"),this.drawerRef.classList.remove("has-bottom-scrim")):(this.drawerRef.classList.add("has-top-scrim"),this.drawerRef.classList.add("has-bottom-scrim"))}}updateScrollState(){if(!this.isMobileDrawerOpen||!this.drawerRef)return;const s=this.drawerRef.scrollHeight-this.drawerRef.clientHeight;if(s<=0)return this.drawerRef.classList.remove("has-top-scrim","has-bottom-scrim"),void this.drawerRef.removeEventListener("scroll",this.handleDrawerScroll);this.setupScrollListener(this.drawerRef,s)}closeMobileDrawer(){this.isMobileDrawerOpen=!1,this.drawerRef&&this.drawerRef.removeEventListener("scroll",this.handleDrawerScroll);const s=this.mobileToggleRef?.querySelector("button");setTimeout((()=>{s?.focus()}),100)}getBrandingUrl(){const s=m()||"fi";return this.dsBrandingUrls?.[s]||this.brandingUrls?.[s]||y.brandingUrls?.[s]}renderBranding(){if(this.dsHideBranding)return null;const s=c("ds-ribbon"),i=this.getBrandingUrl();return t("div",{class:s+"__branding"},t(this.DsLinkLogo,{dsHref:i,dsIcon:this.dsIcon||this.icon||y.config?.dsIcon,dsIconTitle:this.dsIconTitle,dsIconAriaLabel:this.dsIconAriaLabel,dsText:this.localizedSiteName,dsTarget:"_self",dsAriaLabel:this.localizedLogoAriaLabel}))}renderDesktopNavigation(){const s=this.localizedLinks;if(!s?.length)return null;const i=c("ds-ribbon");return t("div",{class:i+"__desktop-nav"},t("ul",{class:i+"__desktop-links"},s.filter((s=>!s.mobileOnly)).map((s=>t("li",{key:"desktop-"+s.id,class:i+"__desktop-link-item"},t(this.DsLink,{dsHref:s.href,dsText:s.text,dsTarget:s.target||"_self",dsVariant:"standalone",dsColour:"black",dsWeight:"semibold",class:i+"__desktop-link"},s.badge&&t("span",{slot:"suffix"},t(this.DsVisuallyHidden,null," - ",s.badge))),s.badge&&t(this.DsTag,{dsText:s.badge,dsColour:"info",class:i+"__desktop-badge",dsAriaHidden:!0}),"_blank"===s.target&&t(this.DsVisuallyHidden,null,h()))))))}renderMobileNavigation(){const s=this.localizedLinks;if(!s?.length)return null;const i=c("ds-ribbon");return t("div",{class:i+"__drawer-backdrop",onClick:this.handleDrawerBackdropClick,...this.isMobileDrawerOpen?{}:{inert:!0}},t("div",{id:i+"__drawer",class:i+"__drawer",role:"dialog","aria-label":"Site navigation menu","aria-modal":"true","aria-hidden":this.isMobileDrawerOpen?"false":"true",ref:s=>this.drawerRef=s},this.renderDrawerHeader(),t("div",{class:i+"__drawer-nav"},t("div",{class:i+"__top-scrim"}),t("ul",{class:i+"__drawer-links"},s.map((s=>t("li",{key:"mobile-"+s.id,class:i+"__drawer-link-item"},t(this.DsLink,{dsHref:s.href,dsText:s.text,dsTarget:s.target||"_self",dsVariant:"standalone",dsColour:"black",dsWeight:"semibold",class:i+"__drawer-link"},s.badge&&t("span",{slot:"suffix"},t(this.DsVisuallyHidden,null," - ",s.badge))),s.badge&&t(this.DsTag,{dsText:s.badge,dsColour:"info",class:i+"__drawer-badge",dsAriaHidden:!0}),"_blank"===s.target&&t(this.DsVisuallyHidden,null,h()))))),t("div",{class:i+"__bottom-scrim"}))))}renderDrawerHeader(){const s=c("ds-ribbon"),i=this.getBrandingUrl();return t("div",{class:s+"__drawer-header"},t("div",{class:s+"__drawer-branding"},t(this.DsLinkLogo,{class:s+"__drawer-branding-link",dsHref:i,dsIcon:this.dsIcon||this.icon||y.config?.dsIcon,dsIconTitle:this.dsIconTitle,dsIconAriaLabel:this.dsIconAriaLabel,dsText:this.localizedSiteName,dsTarget:"_self",dsAriaLabel:this.localizedLogoAriaLabel})),t(this.DsButton,{dsId:this.dsCloseButtonId,dsType:"button",dsVariant:"supplementary",dsColour:"black",dsSize:"small",dsText:this.localizedCloseText,dsIcon:"close",dsIconPosition:"end",class:s+"__drawer-close",onClick:this.handleMobileToggle}))}renderMobileToggle(){const s=this.localizedLinks;if(!s?.length||!this.localizedSitesText||!this.localizedCloseText)return null;const i=c("ds-ribbon");return t(this.DsButton,{ref:s=>this.mobileToggleRef=s,id:this.dsMobileToggleId,class:i+"__mobile-toggle",dsVariant:"supplementary",dsColour:"black",dsSize:"small",dsText:this.localizedSitesText,dsIcon:"keyboard_arrow_down",dsIconPosition:"end",onClick:this.handleMobileToggle,dsAriaExpanded:this.isMobileDrawerOpen,dsAriaControls:i+"__drawer",dsAriaHaspopup:"dialog"})}disconnectedCallback(){clearTimeout(this.resizeTimeout);const s=this.el.shadowRoot?.querySelector(`#${c("ds-ribbon")}__drawer`);s?.removeEventListener("scroll",this.handleDrawerScroll),this.storeUnsubscribe?.()}render(){const s=c("ds-ribbon"),i=o(s,{[s+"--drawer-open"]:this.isMobileDrawerOpen,[s+"--drawer-clicked"]:this.isMobileDrawerClicked});return t("div",{key:"083f9b57e28d8eecbfae7e2030d64a93b1d06c7c",class:i},t("nav",{key:"e27bb14d0158c3338a9cee617cadd6d7a939f4c4","aria-label":this.localizedNavAriaLabel,...this.isMobileDrawerOpen?{inert:!0}:{}},t("div",{key:"dd069ba6a40bbd9e8019f63de6cd6a8c76c07427",class:s+"__container",...this.inheritedAttributes},this.renderBranding(),this.renderDesktopNavigation(),this.renderMobileToggle())),this.renderMobileNavigation())}static get watchers(){return{dsIcon:[{dsIconObserver:0}],dsBrandingUrls:[{dsBrandingUrlsObserver:0}],isMobileDrawerOpen:[{isMobileDrawerOpenObserver:0}]}}static get style(){return".ds-no-style-leak *{all:unset;box-sizing:border-box;display:block}:host{display:block;width:100%;border-bottom:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light, #ccc);background-color:var(--ds-bgColor-white, #fff);position:relative;z-index:1000}.ds-ribbon__SPFJ1E{all:initial;display:revert;box-sizing:border-box;font-family:var(--ds-fontFamily-body);font-size:var(--ds-fontSize-16);display:block}.ds-ribbon__SPFJ1E__container{display:grid;grid-template-columns:8rem auto;align-items:center;justify-content:space-between;padding:0 var(--ds-spacing-small, 16px);max-width:120rem;margin:0 auto;height:3rem}@media (min-width: 30rem){.ds-ribbon__SPFJ1E__container{grid-template-columns:auto auto}}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__container{grid-template-columns:145px auto;padding:0 var(--ds-spacing-large, 32px)}}@media (min-width: 75rem){.ds-ribbon__SPFJ1E__container{grid-template-columns:auto auto}}.ds-ribbon__SPFJ1E__branding{display:flex;align-items:center;flex-shrink:0}.ds-ribbon__SPFJ1E__mobile-toggle{display:block;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__mobile-toggle{display:none}}.ds-ribbon__SPFJ1E__drawer-backdrop{position:fixed;inset:0;background-color:var(--ds-overlay-black-00);grid-column-end:-1;opacity:0;z-index:-1;pointer-events:none}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-backdrop{display:none}}.ds-ribbon__SPFJ1E--drawer-open .ds-ribbon__SPFJ1E__drawer-backdrop{cursor:pointer;pointer-events:auto}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-backdrop{pointer-events:auto;z-index:1}.ds-ribbon__SPFJ1E__drawer-backdrop,.ds-ribbon__SPFJ1E--drawer-open .ds-ribbon__SPFJ1E__container .ds-ribbon__SPFJ1E__drawer-backdrop{position:static;background-color:unset;backdrop-filter:unset;opacity:1;transition:none}}.ds-ribbon__SPFJ1E--drawer-clicked .ds-ribbon__SPFJ1E__drawer-backdrop{transition:background-color 0.3s, opacity 0s 0.3s}.ds-ribbon__SPFJ1E--drawer-open .ds-ribbon__SPFJ1E__drawer-backdrop{background-color:var(--ds-overlay-black-50);opacity:1;transition:background-color 0.1s 0.3s, opacity 0s 0s;z-index:999}.ds-ribbon__SPFJ1E__desktop-nav{display:none;grid-column-end:-1}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__desktop-nav{display:block}}.ds-ribbon__SPFJ1E__desktop-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:row;gap:var(--ds-spacing-medium, 24px);align-items:center}.ds-ribbon__SPFJ1E__desktop-link-item{display:flex;align-items:center;position:relative;text-transform:uppercase;height:var(--ds-spacing-2xLarge, 3rem)}.ds-ribbon__SPFJ1E__desktop-link{font-size:var(--ds-fontSize-12);white-space:nowrap}.ds-ribbon__SPFJ1E__desktop-badge{font-size:var(--ds-fontSize-12);letter-spacing:var(--ds-letterSpacing-wide, 0);margin-left:var(--ds-spacing-2xSmall, 8px);text-transform:none;position:absolute;top:0;right:100%}.ds-ribbon__SPFJ1E__desktop-badge>*{display:flex;align-items:center;justify-content:center;min-width:1.5rem;min-height:1.5rem;border-radius:1.25rem;padding:0 var(--ds-spacing-2xSmall, 0.5rem)}.ds-ribbon__SPFJ1E__desktop-badge>* span{font-size:var(--ds-fontSize-12);line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}.ds-ribbon__SPFJ1E__drawer{position:absolute;top:0;right:0;bottom:0;width:calc(100% - var(--ds-spacing-small, 16px));background-color:var(--ds-bgColor-white, #fff);box-shadow:var(--ds-shadow-medium);padding-top:0;transform:translateX(100%);transition:transform 0.3s ease;overflow-y:auto;cursor:default}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer{position:static;width:auto;max-width:none;background-color:transparent;box-shadow:none;padding-top:0;transform:none;transition:none;overflow-y:visible}}.ds-ribbon__SPFJ1E--drawer-open .ds-ribbon__SPFJ1E__drawer{transform:translateX(0%)}.ds-ribbon__SPFJ1E__drawer-header{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;height:3rem;z-index:1;padding:var(--ds-spacing-small, 16px) var(--ds-spacing-medium, 24px);border-bottom:var(--ds-borderWidth-hairline, 1px) solid var(--ds-borderColor-light, #ccc);background-color:var(--ds-bgColor-white, #fff)}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-header{display:none}}.ds-ribbon__SPFJ1E__drawer-branding{display:flex;align-items:center;flex-shrink:0;max-width:8rem}@media (min-width: 30rem){.ds-ribbon__SPFJ1E__drawer-branding{max-width:unset}}.ds-ribbon__SPFJ1E__drawer-close{flex-shrink:0;margin-left:var(--ds-spacing-small, 16px)}.ds-ribbon__SPFJ1E__drawer-nav{display:block;padding:var(--ds-spacing-medium, 24px);position:relative}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-nav{padding:0}}.ds-ribbon__SPFJ1E__top-scrim,.ds-ribbon__SPFJ1E__bottom-scrim{pointer-events:none;width:100%;height:2.75rem;margin-top:-2.75rem;flex:0 0 auto;min-height:0;position:sticky;z-index:1;display:none}.ds-ribbon__SPFJ1E__top-scrim{top:3rem;background:linear-gradient(to bottom, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.ds-ribbon__SPFJ1E__bottom-scrim{bottom:0;background:linear-gradient(to top, var(--ds-bgColor-white) 0%, var(--ds-overlay-white-00) 100%)}.has-top-scrim .ds-ribbon__SPFJ1E__top-scrim{display:block}.has-bottom-scrim .ds-ribbon__SPFJ1E__bottom-scrim{display:block}.ds-ribbon__SPFJ1E__drawer-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--ds-spacing-4xSmall, 2px)}.ds-ribbon__SPFJ1E__drawer-link-item{display:flex;align-items:center;position:relative;text-transform:uppercase;border-bottom:var(--ds-borderWidth-hairline) solid var(--ds-color-border-subtle);height:var(--ds-spacing-2xLarge, 3rem)}.ds-ribbon__SPFJ1E__drawer-link-item:last-child{border-bottom:none}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-link-item{justify-content:flex-start;padding:0;border-bottom:none}.ds-ribbon__SPFJ1E__drawer-link-item:last-child{border-bottom:none}}.ds-ribbon__SPFJ1E__drawer-link{font-size:var(--ds-fontSize-14, 0.875rem);white-space:nowrap}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-link{font-size:var(--ds-fontSize-12, 0.75rem)}}.ds-ribbon__SPFJ1E__drawer-badge{font-size:var(--ds-fontSize-12);letter-spacing:var(--ds-letterSpacing-wide, 0);margin-left:var(--ds-spacing-2xSmall, 8px);text-transform:none}@media (min-width: 60rem){.ds-ribbon__SPFJ1E__drawer-badge{position:absolute;top:0;right:100%}}.ds-ribbon__SPFJ1E__drawer-badge>*{display:flex;align-items:center;justify-content:center;min-width:1.5rem;min-height:1.5rem;border-radius:1.25rem;padding:0 var(--ds-spacing-2xSmall, 0.5rem)}.ds-ribbon__SPFJ1E__drawer-badge>* span{font-size:inherit;line-height:0;font-weight:600;color:var(--ds-textColor-info, #005b80)}:host(.ds-ribbon__SPFJ1E--drawer-open) .ds-ribbon__SPFJ1E__drawer-backdrop{display:block}@media (min-width: 60rem){:host(.ds-ribbon__SPFJ1E--drawer-open) .ds-ribbon__SPFJ1E__drawer-backdrop{display:block}}:host(.ds-ribbon__SPFJ1E--drawer-open) .ds-ribbon__SPFJ1E__drawer{transform:translateX(0)}@media (min-width: 60rem){:host(.ds-ribbon__SPFJ1E--drawer-open) .ds-ribbon__SPFJ1E__drawer{transform:none}}"}},[513,"ds-ribbon",{dsIcon:[1,"ds-icon"],dsSiteName:[1,"ds-site-name"],dsHideBranding:[4,"ds-hide-branding"],dsIconTitle:[1,"ds-icon-title"],dsIconAriaLabel:[1,"ds-icon-aria-label"],dsLinks:[16],dsBrandingUrls:[16],dsMobileToggleText:[1,"ds-mobile-toggle-text"],dsCloseButtonText:[1,"ds-close-button-text"],dsNavAriaLabel:[1,"ds-nav-aria-label"],dsLogoAriaLabel:[1,"ds-logo-aria-label"],dsCloseButtonId:[1,"ds-close-button-id"],dsMobileToggleId:[1,"ds-mobile-toggle-id"],dsDataUrl:[1,"ds-data-url"],isMobileDrawerOpen:[32],isMobileDrawerClicked:[32],loadedExternalData:[32],lang:[32],icon:[32],brandingUrls:[32]},[[16,"dsLanguageChange","handleLanguageChange"],[4,"keydown","handleKeyDown"],[9,"resize","handleWindowResize"]],{dsIcon:[{dsIconObserver:0}],dsBrandingUrls:[{dsBrandingUrlsObserver:0}],isMobileDrawerOpen:[{isMobileDrawerOpenObserver:0}]}]);b([t("ds-link-logo",{dsHref:""}),t("ds-link",{dsText:""}),t("ds-button",null),t("ds-tag",{dsText:""}),t("ds-visually-hidden",null)]);const P=F,J=function(){"undefined"!=typeof customElements&&["ds-ribbon","ds-button","ds-icon","ds-link","ds-link-logo","ds-spinner","ds-tag","ds-visually-hidden"].forEach((s=>{switch(s){case"ds-ribbon":customElements.get(r(s))||customElements.define(r(s),F);break;case"ds-button":customElements.get(r(s))||u();break;case"ds-icon":customElements.get(r(s))||w();break;case"ds-link":customElements.get(r(s))||f();break;case"ds-link-logo":customElements.get(r(s))||k();break;case"ds-spinner":customElements.get(r(s))||v();break;case"ds-tag":customElements.get(r(s))||S();break;case"ds-visually-hidden":customElements.get(r(s))||x()}}))};export{P as DsRibbon,J as defineCustomElement}

package/dist/components/ds-select-native.js

@@ -1,6 +1 @@
-import { D as DsSelectNative$1, d as defineCustomElement$1 } from './p-DFoE5OTe.js';
-
-const DsSelectNative = DsSelectNative$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DsSelectNative, defineCustomElement };
+import{D as o,d as s}from"./p-CGJXc6RW.js";const p=o,r=s;export{p as DsSelectNative,r as defineCustomElement}