@swisspost/design-system-components 10.0.0-next.55 → 10.0.0-next.57

package/dist/components/post-collapsible-trigger2.js

@@ -1,136 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-import { c as checkRequiredAndType } from './index2.js';
-import './breakpoints.js';
-import { E as EventFrom } from './event-from.js';
-import { g as getRoot } from './get-root.js';
-
-var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-        r = Reflect.decorate(decorators, target, key, desc);
-    else
-        for (var i = decorators.length - 1; i >= 0; i--)
-            if (d = decorators[i])
-                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-const PostCollapsibleTrigger = /*@__PURE__*/ proxyCustomElement(class PostCollapsibleTrigger extends HTMLElement {
-    /**
-     * Set the "aria-controls" and "aria-expanded" attributes on the trigger to match the state of the controlled post-collapsible
-     */
-    validateAriaAttributes() {
-        checkRequiredAndType(this, 'for', 'string');
-    }
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.observer = new MutationObserver(() => this.setTrigger());
-        this.handlePostToggle = this.handlePostToggle.bind(this);
-    }
-    /**
-     * Initiate a mutation observer that updates the trigger whenever necessary
-     */
-    connectedCallback() {
-        this.root = getRoot(this.host);
-        this.root.addEventListener('postToggle', this.handlePostToggle);
-        this.observer.observe(this.host, { childList: true, subtree: true });
-    }
-    componentDidLoad() {
-        this.setTrigger();
-        if (!this.trigger)
-            console.warn('The post-collapsible-trigger must contain a button.');
-        this.validateAriaAttributes();
-    }
-    disconnectedCallback() {
-        this.observer.disconnect();
-        this.root?.removeEventListener('postToggle', this.handlePostToggle);
-    }
-    /**
-     * Update the "aria-controls" and "aria-expanded" attributes on the trigger button
-     */
-    async update() {
-        this.updateAriaAttributes();
-    }
-    /**
-     * Private handler for the 'postToggle' event.
-     * This updates the trigger's "aria-expanded" attribute based on the event detail.
-     */
-    handlePostToggle(e) {
-        if (this.trigger) {
-            this.trigger.setAttribute('aria-expanded', `${e.detail}`);
-        }
-    }
-    updateAriaAttributes() {
-        if (!this.trigger)
-            return;
-        // add the provided id to the aria-controls list
-        const ariaControls = this.trigger.getAttribute('aria-controls');
-        if (!ariaControls?.includes(this.for)) {
-            const newAriaControls = ariaControls ? `${ariaControls} ${this.for}` : this.for;
-            this.trigger.setAttribute('aria-controls', newAriaControls);
-        }
-        // set the aria-expanded to `false` if the controlled collapsible is collapsed or undefined, set it to `true` otherwise
-        const isCollapsed = this.collapsible?.collapsed;
-        const newAriaExpanded = isCollapsed !== undefined ? !isCollapsed : undefined;
-        this.trigger.setAttribute('aria-expanded', `${newAriaExpanded}`);
-    }
-    /**
-     * Toggle the post-collapsible controlled by the trigger
-     */
-    async toggleCollapsible() {
-        await this.collapsible?.toggle();
-    }
-    /**
-     * Retrieve the post-collapsible controlled by the trigger
-     */
-    get collapsible() {
-        const ref = this.root.getElementById(this.for);
-        if (ref && ref.localName === 'post-collapsible') {
-            return ref;
-        }
-        return null;
-    }
-    /**
-     * Find the button and add the proper event listener and ARIA attributes to it
-     */
-    setTrigger() {
-        const trigger = this.host.querySelector('button');
-        if (!trigger || (this.trigger && trigger.isEqualNode(this.trigger)))
-            return;
-        this.trigger = trigger;
-        this.trigger.addEventListener('click', () => this.toggleCollapsible());
-        this.updateAriaAttributes();
-    }
-    render() {
-        return (h(Host, { key: '1cd00cfdb29b9ce191b8eb1fe6a91ddab412d006', "data-version": version }, h("slot", { key: 'b0625b4f2074852609d4a3dd700c04e01fa34d0a' })));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "for": ["validateAriaAttributes"]
-    }; }
-}, [1, "post-collapsible-trigger", {
-        "for": [513],
-        "update": [64]
-    }, undefined, {
-        "for": ["validateAriaAttributes"]
-    }]);
-__decorate([
-    EventFrom('post-collapsible')
-], PostCollapsibleTrigger.prototype, "handlePostToggle", null);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-collapsible-trigger"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-collapsible-trigger":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostCollapsibleTrigger);
-            }
-            break;
-    } });
-}
-
-export { PostCollapsibleTrigger as P, defineCustomElement as d };
+import{proxyCustomElement as t,HTMLElement as s,h as i,Host as e,transformTag as o}from"@stencil/core/internal/client";import{v as r}from"./package.js";import{c as a}from"./breakpoints.js";import{E as l}from"./event-from.js";import{g as n}from"./get-root.js";const c=t(class extends s{validateAriaAttributes(){a(this,"for","string")}constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.observer=new MutationObserver((()=>this.setTrigger())),this.handlePostToggle=this.handlePostToggle.bind(this)}connectedCallback(){this.root=n(this.host),this.root.addEventListener("postToggle",this.handlePostToggle),this.observer.observe(this.host,{childList:!0,subtree:!0})}componentDidLoad(){this.setTrigger(),this.trigger||console.warn("The post-collapsible-trigger must contain a button."),this.validateAriaAttributes()}disconnectedCallback(){this.observer.disconnect(),this.root?.removeEventListener("postToggle",this.handlePostToggle)}async update(){this.updateAriaAttributes()}handlePostToggle(t){this.trigger&&this.trigger.setAttribute("aria-expanded",`${t.detail}`)}updateAriaAttributes(){if(!this.trigger)return;const t=this.trigger.getAttribute("aria-controls");t?.includes(this.for)||this.trigger.setAttribute("aria-controls",t?`${t} ${this.for}`:this.for);const s=this.collapsible?.collapsed;this.trigger.setAttribute("aria-expanded",`${void 0!==s?!s:void 0}`)}async toggleCollapsible(){await(this.collapsible?.toggle())}get collapsible(){const t=this.root.getElementById(this.for);return t&&"post-collapsible"===t.localName?t:null}setTrigger(){const t=this.host.querySelector("button");!t||this.trigger&&t.isEqualNode(this.trigger)||(this.trigger=t,this.trigger.addEventListener("click",(()=>this.toggleCollapsible())),this.updateAriaAttributes())}render(){return i(e,{key:"f5055d5970eb900d345957f306c9a373680f257a","data-version":r},i("slot",{key:"cf63bdbca00602b9c4e2a81f28723bd274561045"}))}get host(){return this}static get watchers(){return{for:[{validateAriaAttributes:0}]}}},[257,"post-collapsible-trigger",{for:[513],update:[64]},void 0,{for:[{validateAriaAttributes:0}]}]);function h(){"undefined"!=typeof customElements&&["post-collapsible-trigger"].forEach((t=>{"post-collapsible-trigger"===t&&(customElements.get(o(t))||customElements.define(o(t),c))}))}!function(t,s,i,e){var o,r=arguments.length,a=r<3?s:null===e?e=Object.getOwnPropertyDescriptor(s,i):e;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,s,i,e);else for(var l=t.length-1;l>=0;l--)(o=t[l])&&(a=(r<3?o(a):r>3?o(s,i,a):o(s,i))||a);r>3&&a&&Object.defineProperty(s,i,a)}([l("post-collapsible")],c.prototype,"handlePostToggle",null);export{c as P,h as d}

package/dist/components/post-collapsible.js

@@ -1,6 +1 @@
-import { P as PostCollapsible$1, d as defineCustomElement$1 } from './post-collapsible2.js';
-
-const PostCollapsible = PostCollapsible$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PostCollapsible, defineCustomElement };
+import{P as o,d as s}from"./post-collapsible2.js";const p=o,t=s;export{p as PostCollapsible,t as defineCustomElement}

package/dist/components/post-collapsible2.js

@@ -1,110 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-import { I as IS_BROWSER } from './breakpoints.js';
-import { e as checkEmptyOrType } from './index2.js';
-
-function isMotionReduced() {
-    return IS_BROWSER ? window.matchMedia('(prefers-reduced-motion: reduce)').matches : false;
-}
-
-const collapseDuration = 350;
-const collapseEasing = 'ease';
-const collapsedKeyframe = { height: '0', overflow: 'hidden' };
-const animationOptions = {
-    duration: collapseDuration,
-    easing: collapseEasing,
-    fill: 'forwards',
-};
-function collapse(el) {
-    const elHeight = IS_BROWSER ? window.getComputedStyle(el).height : `${el.scrollHeight}px`;
-    const expandedKeyframe = { height: elHeight };
-    return el.animate([expandedKeyframe, collapsedKeyframe], animationOptions);
-}
-function expand(el) {
-    const expandedKeyframe = { height: `${el.scrollHeight}px`, offset: 1 };
-    const finalKeyframe = { height: 'auto', overflow: 'visible' };
-    return el.animate([collapsedKeyframe, expandedKeyframe, finalKeyframe], animationOptions);
-}
-
-const postCollapsibleCss = ":host{display:block;position:relative;overflow:hidden}";
-
-const PostCollapsible = /*@__PURE__*/ proxyCustomElement(class PostCollapsible extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.postToggle = createEvent(this, "postToggle", 7);
-        this.isLoaded = false;
-        this.isOpen = true;
-        /**
-         * If `true`, the element is collapsed otherwise it is displayed.
-         */
-        this.collapsed = false;
-    }
-    collapsedChange() {
-        checkEmptyOrType(this, 'collapsed', 'boolean');
-        void this.toggle(!this.collapsed);
-    }
-    componentDidLoad() {
-        this.collapsedChange();
-        this.isLoaded = true;
-        this.updateTriggers();
-    }
-    /**
-     * Triggers the collapse programmatically.
-     *
-     * If there is a collapsing transition running already, it will be reversed.
-     */
-    async toggle(open = !this.isOpen) {
-        if (open === this.isOpen)
-            return open;
-        this.isOpen = open;
-        this.collapsed = !open;
-        if (this.isLoaded)
-            this.postToggle.emit(open);
-        const animation = open ? expand(this.host) : collapse(this.host);
-        if (!this.isLoaded || isMotionReduced())
-            animation.finish();
-        await animation.finished;
-        const isHostRendered = this.host.offsetParent;
-        if (isHostRendered)
-            animation.commitStyles();
-        this.updateTriggers();
-        return open;
-    }
-    /**
-     * Update all post-collapsible-trigger elements referring to the collapsible
-     */
-    updateTriggers() {
-        const triggers = document.querySelectorAll(`post-collapsible-trigger[for="${this.host.id}"]`);
-        triggers.forEach(trigger => trigger.update());
-    }
-    render() {
-        return (h(Host, { key: '3a11f1a60c536544881def998bcdf81f6d248837', "data-version": version, tabindex: this.collapsed ? -1 : undefined }, h("slot", { key: '6ea66375cdffefd02c8293aa1542c4cbfce905a4' })));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "collapsed": ["collapsedChange"]
-    }; }
-    static get style() { return postCollapsibleCss; }
-}, [1, "post-collapsible", {
-        "collapsed": [1028],
-        "toggle": [64]
-    }, undefined, {
-        "collapsed": ["collapsedChange"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-collapsible"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-collapsible":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostCollapsible);
-            }
-            break;
-    } });
-}
-
-export { PostCollapsible as P, defineCustomElement as d };
+import{proxyCustomElement as t,HTMLElement as e,createEvent as s,h as o,Host as i,transformTag as r}from"@stencil/core/internal/client";import{v as n}from"./package.js";import{I as l}from"./environment.js";import{e as a}from"./breakpoints.js";const c={height:"0",overflow:"hidden"},d={duration:!l||window.matchMedia("(prefers-reduced-motion: reduce)").matches?0:350,easing:"ease",fill:"forwards"},h=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.postToggle=s(this,"postToggle",7),this.collapsed=!1}collapsedChange(){a(this,"collapsed","boolean")}get isExpanded(){return!this.collapsed}componentDidLoad(){this.collapsedChange(),this.updateTriggers()}async toggle(t=!this.isExpanded){if(t===this.isExpanded)return this.isExpanded;this.collapsed=!t;const e=this.isExpanded;if(l){const t=e?(s=this.host).animate([c,{height:`${s.scrollHeight}px`,offset:1},{height:"auto",overflow:"visible"}],d):function(t){const e=l?window.getComputedStyle(t).height:`${t.scrollHeight}px`;return t.animate([{height:e},c],d)}(this.host);await t.finished,t.commitStyles(),this.updateTriggers(),this.postToggle.emit(e)}var s;return e}updateTriggers(){document.querySelectorAll(`post-collapsible-trigger[for="${this.host.id}"]`).forEach((t=>t.update()))}render(){return o(i,{key:"06400647373d6c66398e6f81561ab2c60b748af1","data-version":n,tabindex:this.collapsed?-1:void 0,style:this.collapsed?c:void 0},o("slot",{key:"63653d2d89b80b03c7f139b1370eaf18fe839409"}))}get host(){return this}static get watchers(){return{collapsed:[{collapsedChange:0}]}}static get style(){return":host{display:block;position:relative;overflow:hidden}"}},[257,"post-collapsible",{collapsed:[1028],toggle:[64]},void 0,{collapsed:[{collapsedChange:0}]}]);function p(){"undefined"!=typeof customElements&&["post-collapsible"].forEach((t=>{"post-collapsible"===t&&(customElements.get(r(t))||customElements.define(r(t),h))}))}export{h as P,p as d}

package/dist/components/{post-list.d.ts → post-env-test.d.ts}

@@ -1,9 +1,9 @@
 import type { Components, JSX } from "../types/components";
 
-interface PostList extends Components.PostList, HTMLElement {}
-export const PostList: {
-    prototype: PostList;
-    new (): PostList;
+interface PostEnvTest extends Components.PostEnvTest, HTMLElement {}
+export const PostEnvTest: {
+    prototype: PostEnvTest;
+    new (): PostEnvTest;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/components/post-env-test.js

@@ -0,0 +1 @@
+import{proxyCustomElement as e,HTMLElement as t,h as s,transformTag as n}from"@stencil/core/internal/client";import{a as o,I as r}from"./environment.js";const c=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow()}render(){return s("div",{key:"db3a159881c2c955d8e64b8fcc3a0a220cd20d66","data-browser":r+"","data-server":o+""})}},[1,"post-env-test"]),a=c,d=function(){"undefined"!=typeof customElements&&["post-env-test"].forEach((e=>{"post-env-test"===e&&(customElements.get(n(e))||customElements.define(n(e),c))}))};export{a as PostEnvTest,d as defineCustomElement}

package/dist/components/post-footer.js

@@ -1,116 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { v as version } from './package.js';
-import { c as checkRequiredAndType } from './index2.js';
-import { b as breakpoint } from './breakpoints.js';
-import { d as defineCustomElement$6 } from './post-accordion2.js';
-import { d as defineCustomElement$5 } from './post-accordion-item2.js';
-import { d as defineCustomElement$4 } from './post-collapsible2.js';
-import { d as defineCustomElement$3 } from './post-collapsible-trigger2.js';
-import { d as defineCustomElement$2 } from './post-icon2.js';
-
-const postFooterCss = ":host{display:block}footer{background-color:#fc0;--post-footer-container-padding-block:32px;--post-footer-container-padding-inline:16px;--post-footer-container-max-width:1200px;--post-footer-grid-template:auto / auto;--post-footer-grid-row-gap:0;--post-footer-grid-column-gap:0;--post-footer-grid-margin-block-end:24px;--post-footer-grid-padding-block-end:0;--post-footer-column-flex-direction:column;--post-footer-column-align-items:start;--post-footer-column-gap:0;--post-footer-post-list-flex-direction:column;--post-footer-post-list-gap:8px;--post-footer-post-list-align-items:start;--post-footer-socialmedia-margin-block-end:var(--post-footer-grid-margin-block-end);--post-footer-app-margin-block-end:var(--post-footer-grid-margin-block-end);--post-footer-businesssectors-margin-block-end:var(--post-footer-grid-margin-block-end);--post-footer-meta-margin-block-end:16px;--post-footer-meta-font-size:inherit;--post-footer-copyright-font-size:var(--post-footer-meta-font-size)}@media screen and (min-width: 600px){footer{--post-footer-container-padding-block:40px;--post-footer-grid-template:repeat(2, auto) / repeat(2, auto);--post-footer-grid-row-gap:32px;--post-footer-grid-column-gap:16px;--post-footer-grid-margin-block-end:32px;--post-footer-grid-padding-block-end:32px;--post-footer-post-list-flex-direction:row;--post-footer-post-list-gap:16px;--post-footer-post-list-align-items:center;--post-footer-meta-margin-block-end:8px}}@media screen and (min-width: 780px){footer{--post-footer-container-padding-inline:40px}}@media screen and (min-width: 1024px){footer{--post-footer-container-padding-block:56px;--post-footer-grid-template:auto / repeat(4, auto);--post-footer-grid-row-gap:0;--post-footer-grid-column-gap:24px;--post-footer-grid-margin-block-end:40px;--post-footer-column-flex-direction:row;--post-footer-column-align-items:center;--post-footer-column-gap:32px;--post-footer-post-list-gap:24px;--post-footer-businesssectors-margin-block-end:24px;--post-footer-meta-font-size:16px}}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.footer-container{box-sizing:content-box;margin:0 auto;padding:var(--post-footer-container-padding-block) var(--post-footer-container-padding-inline);max-width:var(--post-footer-container-max-width)}.footer-grid{display:grid;grid-template:var(--post-footer-grid-template);row-gap:var(--post-footer-grid-row-gap);column-gap:var(--post-footer-grid-column-gap);margin-block-end:var(--post-footer-grid-margin-block-end);padding-block-end:var(--post-footer-grid-padding-block-end)}.footer-grid ::part(button),.footer-grid ::part(body){padding-inline:0}.footer-column{display:flex;flex-direction:var(--post-footer-column-flex-direction);flex-wrap:wrap;justify-content:space-between;align-items:var(--post-footer-column-align-items);column-gap:var(--post-footer-column-gap)}.footer-socialmedia ::slotted(post-list),.footer-app ::slotted(post-list),.footer-businesssectors ::slotted(post-list),.footer-meta ::slotted(post-list){display:flex !important;flex-direction:var(--post-footer-post-list-flex-direction) !important;gap:var(--post-footer-post-list-gap) !important;align-items:var(--post-footer-post-list-align-items) !important}.footer-socialmedia{margin-block-end:var(--post-footer-socialmedia-margin-block-end)}.footer-app{margin-block-end:var(--post-footer-app-margin-block-end)}.footer-businesssectors{margin-block-end:var(--post-footer-businesssectors-margin-block-end)}.footer-meta{margin-block-end:var(--post-footer-meta-margin-block-end);font-size:var(--post-footer-meta-font-size)}.footer-copyright{display:flex;flex-wrap:wrap;column-gap:.5rem;font-size:var(--post-footer-copyright-font-size)}.d-none{display:none}";
-
-const GRID_SLOTS = ['grid-1', 'grid-2', 'grid-3', 'grid-4'];
-const PostFooter$1 = /*@__PURE__*/ proxyCustomElement(class PostFooter extends HTMLElement {
-    validateLabel() {
-        checkRequiredAndType(this, 'label', 'string');
-    }
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.device = breakpoint.get('device');
-        this.gridSlotDisplayed = {};
-        this.breakpointChange = (e) => {
-            this.device = e.detail;
-        };
-        this.handleGridSlotChange = (...devices) => (e) => {
-            if (devices.includes(this.device) && e.target instanceof HTMLSlotElement) {
-                this.updateGridSlotDisplay(e.target.name, e.target.assignedElements().length > 0);
-            }
-        };
-        this.handleGridSlotChange = this.handleGridSlotChange.bind(this);
-    }
-    connectedCallback() {
-        window.addEventListener('postBreakpoint:device', this.breakpointChange);
-    }
-    componentWillLoad() {
-        this.validateLabel();
-        // initialize grid visibility by checking the content of each slot
-        GRID_SLOTS.forEach(slotName => {
-            const assignedElements = this.host.querySelectorAll(`[slot="${slotName}"]`);
-            this.updateGridSlotDisplay(slotName, assignedElements.length > 0);
-        });
-    }
-    disconnectedCallback() {
-        window.removeEventListener('postBreakpoint:device', this.breakpointChange);
-    }
-    updateGridSlotDisplay(slotName, hasContent) {
-        if (this.gridSlotDisplayed[slotName] !== hasContent) {
-            this.gridSlotDisplayed = { ...this.gridSlotDisplayed, [slotName]: hasContent };
-        }
-    }
-    renderAccordion() {
-        return (h("post-accordion", { headingLevel: 3, multiple: true }, GRID_SLOTS.map(slotName => (h("post-accordion-item", { class: { 'd-none': !this.gridSlotDisplayed[slotName] }, collapsed: true }, h("span", { slot: "header" }, h("slot", { name: slotName + '-title' })), h("slot", { onSlotchange: this.handleGridSlotChange('mobile'), name: slotName }))))));
-    }
-    renderColumns() {
-        return GRID_SLOTS.map(slotName => (h("div", { class: { 'd-none': !this.gridSlotDisplayed[slotName] } }, h("slot", { onSlotchange: this.handleGridSlotChange('tablet', 'desktop'), name: slotName }))));
-    }
-    render() {
-        return (h(Host, { key: '5fc11a9cde5e0180c20c27e53fb177ecc9a49d78', "data-version": version, "data-color-scheme": "light" }, h("footer", { key: 'a844ab0ee3ef02c5266a6b259f6869ecb68f26cd' }, h("h2", { key: '543414f0394b276d5c8c22f2839f3afcd1d10575', class: "visually-hidden" }, this.label), h("div", { key: '6d6f38e761a134a39b5b5ed863c6832a5fc1f9a8', class: "footer-container" }, h("div", { key: '2c13938bb4bc9def54eb579207f1f5742b937aac', class: "footer-grid" }, this.device === 'mobile' ? this.renderAccordion() : this.renderColumns()), h("div", { key: 'cf097034f1987afa77d9646c51d8b8a1ae697e5b', class: "footer-column" }, h("div", { key: '4f47baa37bd3efe1f1fd3a0e5725106618eebe03', class: "footer-socialmedia" }, h("slot", { key: 'eccb942dcc1c20cf335cda88b18979fe4d80b431', name: "socialmedia" })), h("div", { key: 'b6aaff5655c50ef59679cd94dc15a53127e08ddc', class: "footer-app" }, h("slot", { key: 'd74e9e912a67747efd5413171d10ae7558e75da5', name: "app" }))), h("div", { key: '71ba540f7ce2ac65359eadc6b03a9b809c3deb82', class: "footer-businesssectors" }, h("slot", { key: 'bc5947b45a37132765526952127c03058fa33b90', name: "businesssectors" })), h("div", { key: '287b6ed9ed686a743d57709e8be4a85d1b7c3837', class: "footer-meta" }, h("slot", { key: 'ce5d85389422fe1b0fc231a32f96f60ac7d20459', name: "meta" })), h("div", { key: '2da10dc4c5923a697977a5eb6227c567df156de3', class: "footer-copyright" }, h("slot", { key: 'f6fb5282c228d33213c90141b51accff50ae233e', name: "copyright" }))))));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "label": ["validateLabel"]
-    }; }
-    static get style() { return postFooterCss; }
-}, [1, "post-footer", {
-        "label": [513],
-        "device": [32],
-        "gridSlotDisplayed": [32]
-    }, undefined, {
-        "label": ["validateLabel"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["post-footer", "post-accordion", "post-accordion-item", "post-collapsible", "post-collapsible-trigger", "post-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "post-footer":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, PostFooter$1);
-            }
-            break;
-        case "post-accordion":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "post-accordion-item":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "post-collapsible":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "post-collapsible-trigger":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "post-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const PostFooter = PostFooter$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { PostFooter, defineCustomElement };
+import{proxyCustomElement as o,HTMLElement as t,h as e,Host as i,transformTag as r}from"@stencil/core/internal/client";import{v as a}from"./package.js";import{c as s,g as n}from"./breakpoints.js";import{d}from"./post-accordion2.js";import{d as c}from"./post-accordion-item2.js";import{d as p}from"./post-collapsible2.js";import{d as l}from"./post-collapsible-trigger2.js";import{d as f}from"./post-icon2.js";const m=["grid-1","grid-2","grid-3","grid-4"],g=o(class extends t{validateTextFooter(){s(this,"textFooter","string")}constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow(),this.device=n.get("device"),this.gridSlotDisplayed={},this.breakpointChange=o=>{this.device=o.detail},this.handleGridSlotChange=this.handleGridSlotChange.bind(this)}connectedCallback(){window.addEventListener("postBreakpoint:device",this.breakpointChange)}componentWillLoad(){this.validateTextFooter(),m.forEach((o=>{const t=this.host.querySelectorAll(`[slot="${o}"]`);this.updateGridSlotDisplay(o,t.length>0)}))}disconnectedCallback(){window.removeEventListener("postBreakpoint:device",this.breakpointChange)}handleGridSlotChange(...o){return t=>{o.includes(this.device)&&t.target instanceof HTMLSlotElement&&this.updateGridSlotDisplay(t.target.name,t.target.assignedElements().length>0)}}updateGridSlotDisplay(o,t){this.gridSlotDisplayed[o]!==t&&(this.gridSlotDisplayed={...this.gridSlotDisplayed,[o]:t})}renderAccordion(){return e("post-accordion",{headingLevel:3,multiple:!0},m.map((o=>e("post-accordion-item",{class:{"d-none":!this.gridSlotDisplayed[o]},collapsed:!0},e("span",{slot:"header"},e("slot",{name:o+"-title"})),e("slot",{onSlotchange:this.handleGridSlotChange("mobile"),name:o})))))}renderColumns(){return m.map((o=>e("div",{class:{"d-none":!this.gridSlotDisplayed[o]}},e("h3",null,e("slot",{name:o+"-title"})),e("slot",{onSlotchange:this.handleGridSlotChange("tablet","desktop"),name:o}))))}render(){return e(i,{key:"e7a0cce19d579c46f60417cfa817ece8c2245ca7","data-version":a,"data-color-scheme":"light"},e("footer",{key:"492f1c264ecd72d18adca6e4ca8bc806a00c1643"},e("h2",{key:"7e08d975715e3e303e61eccead938b09845adc96",class:"visually-hidden"},this.textFooter),e("div",{key:"77e9434cd41864e2cfb845925ec3354d82db1ced",class:"footer-container"},e("div",{key:"2260e6da042d4fb489eacd0c7660fcd988b057c4",class:"footer-grid"},"mobile"===this.device?this.renderAccordion():this.renderColumns()),e("div",{key:"cf6e31f98324dfb4cfed0dcb47fcfa031d235125",class:"footer-column"},e("div",{key:"c4d1f3d153e1a28ae3a4e8b3752892515d9f1e11",class:"footer-socialmedia"},e("slot",{key:"7577106b20b768a97a1bb778493419242dab2c4a",name:"socialmedia"})),e("div",{key:"d91dbf22ee099b5604d1fb093fe9109889f1f7a0",class:"footer-app"},e("slot",{key:"0818814f5d2e286b6b1b6d917a3aeb08350a5ac2",name:"app"}))),e("div",{key:"928110b46617a18411987d1596135b0a5cc9a908",class:"footer-businesssectors"},e("slot",{key:"e0ca79bdfcf044641e0181435928951c8f91b719",name:"businesssectors"})),e("div",{key:"67fa6022ce1a0a85d8184c80ffc6d6d9a442a7ff",class:"footer-meta"},e("slot",{key:"dd45f04ba9dab63396ea62517dc993b495c406f0",name:"meta"})),e("div",{key:"de0a6d29504b6456bb75dc265dbb9ad68f1d305e",class:"footer-copyright"},e("slot",{key:"ef8a1baffbf26fa05e53370d6bb4df78030c9963",name:"copyright"})))))}get host(){return this}static get watchers(){return{textFooter:[{validateTextFooter:0}]}}static get style(){return":host{display:block}footer{background-color:#fc0;--post-footer-container-padding-block:32px;--post-footer-container-padding-inline:16px;--post-footer-container-max-width:1200px;--post-footer-grid-template:auto / auto;--post-footer-grid-row-gap:0;--post-footer-grid-column-gap:0;--post-footer-grid-margin-block-end:24px;--post-footer-grid-padding-block-end:0;--post-footer-column-flex-direction:column;--post-footer-column-align-items:start;--post-footer-column-gap:0;--post-footer-list-flex-direction:column;--post-footer-list-gap:8px;--post-footer-list-align-items:start;--post-footer-socialmedia-margin-block-end:var(--post-footer-grid-margin-block-end);--post-footer-app-margin-block-end:var(--post-footer-grid-margin-block-end);--post-footer-businesssectors-margin-block-end:var(--post-footer-grid-margin-block-end);--post-footer-meta-margin-block-end:16px;--post-footer-meta-font-size:inherit;--post-footer-copyright-font-size:var(--post-footer-meta-font-size)}@media screen and (min-width: 600px){footer{--post-footer-container-padding-block:40px;--post-footer-grid-template:repeat(2, auto) / repeat(2, auto);--post-footer-grid-row-gap:32px;--post-footer-grid-column-gap:16px;--post-footer-grid-margin-block-end:32px;--post-footer-grid-padding-block-end:32px;--post-footer-list-flex-direction:row;--post-footer-list-gap:16px;--post-footer-list-align-items:center;--post-footer-meta-margin-block-end:8px}}@media screen and (min-width: 780px){footer{--post-footer-container-padding-inline:40px}}@media screen and (min-width: 1024px){footer{--post-footer-container-padding-block:56px;--post-footer-grid-template:auto / repeat(4, auto);--post-footer-grid-row-gap:0;--post-footer-grid-column-gap:24px;--post-footer-grid-margin-block-end:40px;--post-footer-column-flex-direction:row;--post-footer-column-align-items:center;--post-footer-column-gap:32px;--post-footer-list-gap:24px;--post-footer-businesssectors-margin-block-end:24px;--post-footer-meta-font-size:16px}}:is(h3,.h3){margin:0;font-size:var(--post-device-font-size-6);line-height:var(--post-device-line-height-heading);font-weight:var(--post-device-font-weight-extra-black);text-wrap:balance}::slotted(ul){list-style:none;padding:0;margin:0}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}.footer-container{box-sizing:content-box;margin:0 auto;padding:var(--post-footer-container-padding-block) var(--post-footer-container-padding-inline);max-width:var(--post-footer-container-max-width)}.footer-grid{display:grid;grid-template:var(--post-footer-grid-template);row-gap:var(--post-footer-grid-row-gap);column-gap:var(--post-footer-grid-column-gap);margin-block-end:var(--post-footer-grid-margin-block-end);padding-block-end:var(--post-footer-grid-padding-block-end)}.footer-grid ::part(button),.footer-grid ::part(body){padding-inline:0}.footer-column{display:flex;flex-direction:var(--post-footer-column-flex-direction);flex-wrap:wrap;justify-content:space-between;align-items:var(--post-footer-column-align-items);column-gap:var(--post-footer-column-gap)}.footer-socialmedia ::slotted(div),.footer-app ::slotted(div),.footer-businesssectors ::slotted(div),.footer-meta ::slotted(div){display:flex !important;flex-direction:var(--post-footer-list-flex-direction) !important;gap:var(--post-footer-list-gap) !important;align-items:var(--post-footer-list-align-items) !important}.footer-socialmedia{margin-block-end:var(--post-footer-socialmedia-margin-block-end)}.footer-app{margin-block-end:var(--post-footer-app-margin-block-end)}.footer-businesssectors{margin-block-end:var(--post-footer-businesssectors-margin-block-end)}.footer-meta{margin-block-end:var(--post-footer-meta-margin-block-end);font-size:var(--post-footer-meta-font-size)}.footer-copyright{display:flex;flex-wrap:wrap;column-gap:.5rem;font-size:var(--post-footer-copyright-font-size)}.d-none{display:none}"}},[257,"post-footer",{textFooter:[513,"text-footer"],device:[32],gridSlotDisplayed:[32]},void 0,{textFooter:[{validateTextFooter:0}]}]),b=g,h=function(){"undefined"!=typeof customElements&&["post-footer","post-accordion","post-accordion-item","post-collapsible","post-collapsible-trigger","post-icon"].forEach((o=>{switch(o){case"post-footer":customElements.get(r(o))||customElements.define(r(o),g);break;case"post-accordion":customElements.get(r(o))||d();break;case"post-accordion-item":customElements.get(r(o))||c();break;case"post-collapsible":customElements.get(r(o))||p();break;case"post-collapsible-trigger":customElements.get(r(o))||l();break;case"post-icon":customElements.get(r(o))||f()}}))};export{b as PostFooter,h as defineCustomElement}