@duetds/components 10.0.0-alpha.9 → 10.0.0

package/lib/dist-custom-elements/duet-footer.js

@@ -1,223 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { p as proxyCustomElement, H, c as createEvent$1, h, F as Fragment } from './p-548610a6.js';
-import { a as actionNewWindowSmall } from './p-f11208c3.js';
-import { D as DuetStringsExternalDefaults } from './p-9df4cfa4.js';
-import { i as inheritGlobalTheme } from './p-aaa7a7bd.js';
-import { s as subscribeTabbingChange, u as unsubscribeTabbingChange } from './p-8db11326.js';
-import { a as getLanguage, g as getLocaleString, c as connectLanguageChangeObserver, d as disconnectLanguageChangeObserver } from './p-35375593.js';
-import { h as hasSlot } from './p-ad615991.js';
-import { p as parsePossibleJSON } from './p-9c3c64b9.js';
-import { d as defineCustomElement$7 } from './p-9ee4d52e.js';
-import { d as defineCustomElement$6 } from './p-77667998.js';
-import { d as defineCustomElement$5 } from './p-77d42564.js';
-import { d as defineCustomElement$4 } from './p-0871ccd4.js';
-import { d as defineCustomElement$3 } from './p-3c70317f.js';
-import { d as defineCustomElement$2 } from './p-196352e6.js';
-
-const duetFooterCss = "*,*::after,*::before{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none}:host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;display:block;flex-shrink:0;width:100%}::slotted([slot=info]){padding:0 28px;margin-top:0;margin-bottom:16px}@media (min-width: 62em){::slotted([slot=info]){padding:0;margin-top:calc(20px - 0.5em);margin-bottom:0}}.duet-footer{display:block;width:100%;padding-top:24px;padding-bottom:16px;margin-top:48px;font-family:\"localtapiola-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";font-size:1rem;font-weight:400;line-height:1.5;color:rgb(255, 255, 255);text-align:left;background:rgb(8, 42, 77)}.duet-footer.duet-p-0{padding:0 !important}.duet-footer.duet-m-0{margin:0 !important}@media (min-width: 62em){.duet-footer{padding-top:48px;padding-bottom:36px}}.duet-footer.duet-theme-turva{font-family:\"turva-sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";background:rgb(198, 12, 48)}.duet-footer a{color:rgb(255, 255, 255);text-decoration:none}@media (min-width: 62em){.duet-footer a{border-radius:4px}}.duet-footer a:focus{outline:0}:host(.user-is-tabbing) .duet-footer a:focus{box-shadow:0 0 0 4px rgba(0, 119, 179, 0.3), 0 0 0 1px #0077b3}:host(.user-is-tabbing) .duet-theme-turva a:focus{box-shadow:0 0 0 4px rgba(23, 28, 58, 0.2), 0 0 0 1px #171c3a}.duet-footer-wrapper{position:relative;margin:0 auto}@media (min-width: 62em){.duet-footer-wrapper{padding:0 72px 0 48px}}@media (min-width: 76.25em){.duet-footer-wrapper{max-width:1110px;padding:0 20px 0 0}}.duet-footer-top{width:100%}@media (min-width: 62em){.duet-footer-top{display:flex;flex-direction:row;align-items:center}.duet-footer-top.duet-has-info{align-items:flex-start}}.duet-footer-top .footer-top-logo{flex-grow:1}.duet-footer-top .footer-top-right-container{flex-grow:1}@media (min-width: 62em){.duet-footer-top .footer-top-right-container{text-align:right}}.duet-footer-top .footer-top-items{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding-left:28px}@media (min-width: 62em){.duet-footer-top .footer-top-items{flex-direction:row;justify-content:flex-end}}duet-logo{margin-bottom:24px;margin-left:16px !important}@media (min-width: 62em){duet-logo{margin-bottom:0;margin-left:0 !important}}.duet-footer-link{padding:16px !important;display:flex;flex-direction:row;align-items:center;width:100%;font-weight:600;border-bottom:1px solid rgba(255, 255, 255, 0.2);transition:background-color 300ms ease}@media (min-width: 36em){.duet-footer-link{padding-right:20px !important;padding-left:28px !important}}@media (min-width: 62em){.duet-footer-link{width:auto;min-width:0;padding-right:0 !important;padding-left:0 !important;border:0}}.duet-footer-link:first-of-type{margin-top:20px;border-top:1px solid rgba(255, 255, 255, 0.2)}@media (min-width: 62em){.duet-footer-link:first-of-type{margin:0;border:0}}.duet-footer-link span{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.duet-footer-link:hover{background:rgba(0, 0, 0, 0.1)}@media (min-width: 62em){.duet-footer-link:hover{background:transparent}}.duet-footer-menu{padding:20px !important;display:flex;gap:2rem;padding-left:28px !important;font-size:0.875rem}@media (min-width: 36em){.duet-footer-menu{padding:28px !important}}@media (min-width: 62em){.duet-footer-menu{padding-right:0 !important;padding-left:8px !important}}.duet-footer-menu a{display:inline-block;text-decoration:none;overflow-wrap:break-word}.duet-footer-menu a:hover,.duet-footer-menu a:focus{text-decoration:underline}.duet-footer-menu a:hover .duet-footer-divider,.duet-footer-menu a:focus .duet-footer-divider{text-decoration:none}.duet-footer-menu .duet-footer-divider{display:inline-block;margin:0 8px}.duet-footer-menu .duet-footer-divider-copyright{display:none}.duet-footer-menu .duet-footer-menu-links{display:block;flex:1}@media (min-width: 62em){.duet-footer-menu .duet-footer-menu-links{text-align:right}}.duet-footer-menu a:last-of-type .duet-footer-divider{display:none}.duet-footer-copyright{display:none;font-size:0.875rem;color:rgb(255, 255, 255)}@media (min-width: 62em){.duet-footer-copyright{display:inline}}.duet-footer-copyright.duet-footer-copyright-mobile{display:block;padding-top:0.5rem;padding-bottom:1.25rem;padding-left:28px;text-align:left}@media (min-width: 62em){.duet-footer-copyright.duet-footer-copyright-mobile{display:none}}.duet-footer-simple{padding:0;margin:0;margin-top:16px;color:rgb(8, 42, 77);background:transparent !important;border-top:1px solid rgb(212, 223, 229)}.duet-footer-simple .duet-footer-wrapper{max-width:100%;padding:0 20px;margin:0}@media (min-width: 62em){.duet-footer-simple .duet-footer-wrapper{padding:0 36px}}@media (min-width: 106.25em){.duet-footer-simple .duet-footer-wrapper{padding:0 48px}}.duet-footer-simple .duet-footer-copyright,.duet-footer-simple .duet-footer-menu a{color:rgb(8, 42, 77)}.duet-footer-simple .duet-footer-menu{padding:20px 0 !important}.duet-footer-simple .duet-footer-copyright-mobile{padding-left:0}.duet-footer-simple.duet-theme-turva{color:rgb(23, 28, 58);border-color:rgb(222, 224, 228)}.duet-footer-simple.duet-theme-turva .duet-footer-copyright,.duet-footer-simple.duet-theme-turva .duet-footer-menu a{color:rgb(23, 28, 58)}.duet-footer-external{display:inline-block;margin-left:4px;color:rgb(0, 119, 179)}.duet-theme-turva .duet-footer-external{color:rgb(255, 255, 255)}.duet-footer-simple.duet-theme-turva .duet-footer-external{color:rgb(198, 12, 48)}";
-const DuetFooterStyle0 = duetFooterCss;
-
-const i18n = {
-    fi: { lahi: "© LähiTapiola", turva: "© Turva" },
-    sv: { lahi: "© LokalTapiola", turva: "© Turva" },
-    en: { lahi: "© LocalTapiola", turva: "© Turva" },
-};
-const createEvent = (ev, data) => ({
-    component: "duet-footer",
-    data,
-    originalEvent: ev,
-});
-const DuetFooter$1 = /*@__PURE__*/ proxyCustomElement(class DuetFooter extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.duetChange = createEvent$1(this, "duetChange", 3);
-        this.duetLogoClick = createEvent$1(this, "duetLogoClick", 7);
-        this.duetMenuClick = createEvent$1(this, "duetMenuClick", 7);
-        this.duetItemClick = createEvent$1(this, "duetItemClick", 7);
-        this.duetAnalytics = createEvent$1(this, "duetAnalytics", 7);
-        this.duetEvent = createEvent$1(this, "duetEvent", 7);
-        /**
-         * Component event handling.
-         */
-        this.handleClick = (event) => {
-            if (event.data.analyticsId) {
-                this.duetAnalytics.emit({
-                    component: "duet-footer",
-                    analyticsId: event.data.analyticsId,
-                });
-            }
-            this.duetChange.emit(event);
-        };
-        this.handleLogoClick = (ev) => {
-            const e = createEvent(ev, { href: this.logoHref, label: "logo" });
-            this.duetLogoClick.emit(e);
-            this.handleClick(e);
-        };
-        this.handleMenuClick = (ev, data) => {
-            const e = createEvent(ev, data);
-            this.handleClick(e);
-            this.duetMenuClick.emit(e);
-        };
-        this.handleItemClick = (ev, data) => {
-            const e = createEvent(ev, data);
-            this.handleClick(e);
-            this.duetItemClick.emit(e);
-        };
-        this.emitDuetEvent = (ev, data) => {
-            this.duetEvent.emit({
-                component: "duet-footer",
-                data,
-                originalEvent: ev,
-            });
-        };
-        this.setDataAttributes = (element, item) => {
-            if (!item.data) {
-                return;
-            }
-            for (const key in item.data) {
-                element.dataset[key] = item.data[key];
-            }
-        };
-        this.processedMainItem = null;
-        this.processedItems = null;
-        this.processedMenu = null;
-        this.theme = "";
-        this.variation = "default";
-        this.margin = "auto";
-        this.logoHref = "/";
-        this.language = getLanguage();
-        this.items = undefined;
-        this.accessibleLabel = undefined;
-        this.accessibleLabelExternalDefaults = DuetStringsExternalDefaults;
-        this.accessibleLabelExternal = getLocaleString(this.accessibleLabelExternalDefaults);
-        this.menu = undefined;
-    }
-    /**
-     * Component lifecycle events.
-     */
-    componentWillLoad() {
-        inheritGlobalTheme(this);
-        this.refresh();
-        this.hasInfoSlot = hasSlot(this.element, "info");
-    }
-    connectedCallback() {
-        connectLanguageChangeObserver(this, {
-            prop: "accessibleLabelExternal",
-            defaults: "accessibleLabelExternalDefaults",
-        });
-        subscribeTabbingChange(this);
-    }
-    disconnectedCallback() {
-        disconnectLanguageChangeObserver(this);
-        unsubscribeTabbingChange(this);
-    }
-    /**
-     * Local methods
-     */
-    async refresh() {
-        this.processedItems = parsePossibleJSON(this.items);
-        this.processedMenu = parsePossibleJSON(this.menu);
-    }
-    /**
-     * render() function
-     * Always the last one in the class.
-     */
-    render() {
-        const text = getLocaleString(i18n, this.language);
-        const copyrightLabel = this.theme === "turva" ? text.turva : text.lahi;
-        return (h("footer", { key: '7ae4293b454d64394607de43e760c64f4644003a', class: {
-                "duet-footer": true,
-                "duet-m-0": this.margin === "none",
-                "duet-theme-turva": this.theme === "turva",
-                "duet-footer-simple": this.variation === "simple",
-            }, "aria-label": this.accessibleLabel }, h("div", { key: '98ad43f9effced4943cdd6b9903fff536837ceb0', class: "duet-footer-wrapper" }, this.variation !== "simple" && (h("div", { key: 'b06a863d3bf6043b4aea1daa3c3792f5f75aa1fb', class: {
-                "duet-footer-top": true,
-                "duet-has-info": this.hasInfoSlot,
-            }, part: "top" }, h("div", { key: 'b4c000b6e5f933bab8b99f6a662fff8e31f4958c', class: "footer-top-logo" }, h("duet-logo", { key: '1dd4789774e55c30390ab703b5b8ad384c51f8cf', href: this.logoHref, onClick: this.handleLogoClick, size: "large", inverse: true, language: this.language, theme: this.theme })), h("div", { key: '1eca3d87feb76d9d4854a622cfd8ae88c474d775', class: "footer-top-right-container" }, h("slot", { key: 'df47caa012189f4e21e604a705b7d8c7c8a13d11', name: "info" }), h("div", { key: '143327524232e37b5174397da10401204149f90e', class: "footer-top-items" }, this.processedItems &&
-            this.processedItems.map((item, index) => {
-                var _a, _b, _c, _d, _e, _f;
-                return (h(Fragment, null, index > 0 && h("duet-spacer", { size: "x-large", direction: "horizontal" }), h("duet-button", { ref: element => this.setDataAttributes(element, item), theme: this.theme, id: item.id, class: "duet-footer-link", variation: "plain", margin: "none", fixed: true, negative: true, url: item.href, external: item.external, icon: ((_a = item.href) === null || _a === void 0 ? void 0 : _a.startsWith("tel:"))
-                        ? "form-tel"
-                        : ((_b = item.href) === null || _b === void 0 ? void 0 : _b.startsWith("mailto:"))
-                            ? "navigation-message"
-                            : "navigation-arrow-right", "icon-right": !((_c = item.href) === null || _c === void 0 ? void 0 : _c.startsWith("tel:")) && !((_d = item.href) === null || _d === void 0 ? void 0 : _d.startsWith("mailto:")), "icon-size": ((_e = item.href) === null || _e === void 0 ? void 0 : _e.startsWith("tel:")) || ((_f = item.href) === null || _f === void 0 ? void 0 : _f.startsWith("mailto:"))
-                        ? "medium"
-                        : "medium-small", onClick: event => this.handleItemClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, item.label)));
-            }))))), h("slot", { key: '6cb5f4f380025c8bbdaa2ac5451f5229bf3187f1', name: "extra" }), h("p", { key: 'cd54917ff7f57ad3575241e75df45f6eb856e54c', class: "duet-footer-menu", part: "menu" }, h("span", { key: '528f6fdec2f93b1ab7babbfbe7aec319263ac95a', class: "duet-footer-copyright" }, `${copyrightLabel} ${new Date().getFullYear()}`), h("span", { key: '4eeb4bf5ec30d4e8d3a1d14e9224c48dfbf1796b', class: "duet-footer-menu-links" }, this.processedMenu && (h(Fragment, { key: 'd985c3412bc83d4f558fb8ec8b21dd1adb1da256' }, this.processedMenu.map(item => (h("a", { ref: element => this.setDataAttributes(element, item), href: item.href, id: item.id, target: item.external ? "_blank" : "_self", onClick: event => this.handleMenuClick(event, item), onMouseEnter: event => this.emitDuetEvent(event, item), onTouchStart: event => this.emitDuetEvent(event, item) }, item.label, item.external && (h(Fragment, null, h("duet-visually-hidden", null, ", ", this.accessibleLabelExternal), h("span", { class: "duet-footer-external" }, h("duet-icon", { icon: actionNewWindowSmall.svg, size: "xx-small", margin: "none", color: "currentColor" })))), h("span", { class: "duet-footer-divider", role: "presentation", "aria-hidden": "true" }, "/")))))))), h("p", { key: 'eac6be8cb430f9fdf6cef0fcef71eb38debde6e7', class: "duet-footer-copyright duet-footer-copyright-mobile" }, `${copyrightLabel} ${new Date().getFullYear()}`))));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "menu": ["refresh"],
-        "items": ["refresh"]
-    }; }
-    static get style() { return DuetFooterStyle0; }
-}, [1, "duet-footer", {
-        "theme": [1025],
-        "variation": [1],
-        "margin": [1],
-        "logoHref": [1, "logo-href"],
-        "language": [1537],
-        "items": [8],
-        "accessibleLabel": [1, "accessible-label"],
-        "accessibleLabelExternalDefaults": [1, "accessible-label-external-default"],
-        "accessibleLabelExternal": [1025, "accessible-label-external"],
-        "menu": [8],
-        "processedMainItem": [32],
-        "processedItems": [32],
-        "processedMenu": [32]
-    }, undefined, {
-        "menu": ["refresh"],
-        "items": ["refresh"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["duet-footer", "duet-button", "duet-icon", "duet-logo", "duet-spacer", "duet-spinner", "duet-visually-hidden"];
-    components.forEach(tagName => { switch (tagName) {
-        case "duet-footer":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DuetFooter$1);
-            }
-            break;
-        case "duet-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "duet-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "duet-logo":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "duet-spacer":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "duet-spinner":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "duet-visually-hidden":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const DuetFooter = DuetFooter$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DuetFooter, defineCustomElement };

package/lib/dist-custom-elements/duet-grid-item.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetGridItem extends Components.DuetGridItem, HTMLElement {}
-export const DuetGridItem: {
-    prototype: DuetGridItem;
-    new (): DuetGridItem;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-grid-item.js

@@ -1,9 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { D as DuetGridItem$1, d as defineCustomElement$1 } from './p-18248c41.js';
-
-const DuetGridItem = DuetGridItem$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DuetGridItem, defineCustomElement };

package/lib/dist-custom-elements/duet-grid.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetGrid extends Components.DuetGrid, HTMLElement {}
-export const DuetGrid: {
-    prototype: DuetGrid;
-    new (): DuetGrid;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/lib/dist-custom-elements/duet-grid.js

@@ -1,9 +0,0 @@
-/*!
- * Built with Duet Design System
- */
-import { D as DuetGrid$1, d as defineCustomElement$1 } from './p-8a840972.js';
-
-const DuetGrid = DuetGrid$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DuetGrid, defineCustomElement };

package/lib/dist-custom-elements/duet-header.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface DuetHeader extends Components.DuetHeader, HTMLElement {}
-export const DuetHeader: {
-    prototype: DuetHeader;
-    new (): DuetHeader;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;