@swisspost/design-system-components 10.0.0-next.38 → 10.0.0-next.40

package/dist/cjs/{post-tooltip-28e7711a.js → post-tooltip-560cf42c.js}

@@ -1,11 +1,12 @@
 'use strict';
 
 const index = require('./index-b60129c4.js');
-const _package = require('./package-3e61e6f3.js');
-const checkType = require('./check-type-cdbf6d29.js');
+const _package = require('./package-b731881e.js');
+const index$1 = require('./index-2b2b85e5.js');
 require('./breakpoints-cdf1b747.js');
+const placement = require('./placement-b2bb6ec4.js');
 
-const postTooltipCss = ":host{display:none}:host([open]){display:block}post-popovercontainer[arrow]::after{position:absolute;content:\"\";inset:-13px;z-index:-1}post-popovercontainer>div{padding:var(--post-core-dimension-4) var(--post-core-dimension-8);max-width:200px;min-height:32px}";
+const postTooltipCss = ":host{display:none}:host([open]){display:contents}post-popovercontainer[arrow]::after{position:absolute;content:\"\";inset:-13px;z-index:-1}post-popovercontainer>div{padding:var(--post-core-dimension-4) var(--post-core-dimension-8);max-width:280px;min-height:32px;word-wrap:break-word;white-space:normal}";
 const PostTooltipStyle0 = postTooltipCss;
 
 const PostTooltip = class {
@@ -13,14 +14,14 @@ const PostTooltip = class {
         index.registerInstance(this, hostRef);
         this.placement = 'top';
         this.arrow = false;
-        this.animation = null;
+        this.animation = undefined;
         this.open = false;
     }
-    validateOpen() {
-        checkType.checkType(this, 'open', 'boolean', 'The "open" property of the post-tooltip must be a boolean.');
+    validatePlacement() {
+        index$1.checkEmptyOrOneOf(this, 'placement', placement.PLACEMENT_TYPES);
     }
-    connectedCallback() {
-        this.validateOpen();
+    componentWillLoad() {
+        this.validatePlacement();
     }
     componentDidLoad() {
         if (!this.host.id) {
@@ -61,11 +62,11 @@ const PostTooltip = class {
     }
     render() {
         const popoverClass = `${this.arrow ? 'has-arrow' : ''}`;
-        return (index.h(index.Host, { key: 'd6a76533f22e354ff89f15c1e9a10e20fe471579', "data-version": _package.version, role: "tooltip" }, index.h("post-popovercontainer", { key: '60076aaa184ae98e9e813400cc2d03f5add274df', safeSpace: 'trapezoid', class: popoverClass, arrow: this.arrow, animation: this.animation, placement: this.placement, onPostToggle: e => this.handleToggle(e), ref: (el) => (this.popoverRef = el) }, index.h("slot", { key: '1d5ea42696cc60a8a84ff0ecc29e82152d028ba4' }))));
+        return (index.h(index.Host, { key: '1e1d3f4e204b42c8202af63bd7dec12de3c8e16a', "data-version": _package.version, role: "tooltip" }, index.h("post-popovercontainer", { key: 'e410952b4e75915e51d57eec2dbecce2b5d55733', safeSpace: "trapezoid", class: popoverClass, arrow: this.arrow, animation: this.animation, placement: this.placement, onPostToggle: e => this.handleToggle(e), ref: (el) => (this.popoverRef = el) }, index.h("slot", { key: '494e3136dbe96cf611a41753711efb03cab30a12' }))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
-        "open": ["validateOpen"]
+        "placement": ["validatePlacement"]
     }; }
 };
 PostTooltip.style = PostTooltipStyle0;

package/dist/cjs/{post-tooltip-trigger-cbc53d14.js → post-tooltip-trigger-2a54e3e4.js}

@@ -2,8 +2,8 @@
 
 const index = require('./index-b60129c4.js');
 const breakpoints = require('./breakpoints-cdf1b747.js');
-const checkType = require('./check-type-cdbf6d29.js');
-const _package = require('./package-3e61e6f3.js');
+const index$1 = require('./index-2b2b85e5.js');
+const _package = require('./package-b731881e.js');
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
@@ -4535,15 +4535,13 @@ const PostTooltipTrigger = class {
         this.boundTooltipHandler = this.handleTooltipEvent.bind(this);
     }
     validateControlFor() {
-        checkType.checkType(this, 'for', 'string');
+        index$1.checkEmptyOrType(this, 'for', 'string');
     }
     get tooltip() {
         if (!breakpoints.IS_BROWSER)
             return null;
         const ref = document.getElementById(this.for);
-        return ref?.localName === 'post-tooltip'
-            ? ref
-            : null;
+        return ref?.localName === 'post-tooltip' ? ref : null;
     }
     componentDidLoad() {
         this.setupTrigger();
@@ -4651,7 +4649,7 @@ const PostTooltipTrigger = class {
     handleLeave(event) {
         const newTarget = event.relatedTarget;
         if ((this.tooltip && newTarget && this.tooltip.contains(newTarget)) ||
-            (newTarget === this.trigger)) {
+            newTarget === this.trigger) {
             return;
         }
         this.interestLostHandler();
@@ -4675,7 +4673,7 @@ const PostTooltipTrigger = class {
         this.tooltip?.hide();
     }
     render() {
-        return (index.h(index.Host, { key: '4e4b53e85570d6dbba4ee7833a1d3de00e53dbc6', "data-version": _package.version }, index.h("slot", { key: 'f8f5ea2e2ce848d654e233617455bbbbdc6ba5b1', onSlotchange: () => this.handleSlotChange() })));
+        return (index.h(index.Host, { key: '26ac11df6c2961e3dd51722f6981185db17c6efb', "data-version": _package.version }, index.h("slot", { key: 'd08036f40d0a6708b8614232134b0d5b4eba4b78', onSlotchange: () => this.handleSlotChange() })));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/post-tooltip-trigger.cjs.entry.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const postTooltipTrigger = require('./post-tooltip-trigger-cbc53d14.js');
+const postTooltipTrigger = require('./post-tooltip-trigger-2a54e3e4.js');
 require('./index-b60129c4.js');
 require('./breakpoints-cdf1b747.js');
-require('./check-type-cdbf6d29.js');
-require('./package-3e61e6f3.js');
+require('./index-2b2b85e5.js');
+require('./package-b731881e.js');
 
 
 

package/dist/cjs/post-tooltip.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const postTooltip = require('./post-tooltip-28e7711a.js');
+const postTooltip = require('./post-tooltip-560cf42c.js');
 require('./index-b60129c4.js');
-require('./package-3e61e6f3.js');
-require('./check-type-cdbf6d29.js');
+require('./package-b731881e.js');
+require('./index-2b2b85e5.js');
 require('./breakpoints-cdf1b747.js');
+require('./placement-b2bb6ec4.js');
 
 
 

package/dist/collection/collection-manifest.json

@@ -1,6 +1,5 @@
 {
   "entries": [
-    "components/post-header/post-header.js",
     "components/post-accordion/post-accordion.js",
     "components/post-accordion-item/post-accordion-item.js",
     "components/post-avatar/post-avatar.js",
@@ -13,6 +12,7 @@
     "components/post-collapsible/post-collapsible.js",
     "components/post-collapsible-trigger/post-collapsible-trigger.js",
     "components/post-footer/post-footer.js",
+    "components/post-header/post-header.js",
     "components/post-icon/post-icon.js",
     "components/post-language-option/post-language-option.js",
     "components/post-language-switch/post-language-switch.js",

package/dist/collection/components/post-accordion/post-accordion.css

@@ -1 +1 @@
-:host{display:block}::slotted(post-accordion-item){display:block}::slotted(post-accordion-item:not(:only-of-type:first-of-type)){margin-block-start:calc(var(--post-device-border-width-default)*-1)}::slotted(post-accordion-item:not(:only-of-type):first-of-type){--post-accordion-button-border-top: var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke)}
+:host{display:block}::slotted(post-accordion-item){display:block}::slotted(post-accordion-item:not(:only-of-type:first-of-type)){margin-block-start:calc(var(--post-device-border-width-default)*-1)}::slotted(post-accordion-item:where(:only-of-type,:not(:first-of-type))){--post-accordion-button-border-top-width: 0}

package/dist/collection/components/post-accordion/post-accordion.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 import { version } from "../../../../package";
 import { HEADING_LEVELS } from "../../types/index";
-import { checkOneOf } from "../../utils/index";
+import { checkRequiredAndOneOf } from "../../utils/index";
 import { eventGuard } from "../../utils/event-gua"; // Import eventGuard
 /**
  * @slot default - Slot for placing post-accordion-item components.
@@ -12,16 +12,16 @@ export class PostAccordion {
         this.headingLevel = undefined;
         this.multiple = false;
     }
-    validateHeadingLevel(newValue = this.headingLevel) {
-        if (!newValue)
-            return;
-        checkOneOf(this, 'headingLevel', HEADING_LEVELS, 'The `heading-level` property of the `post-accordion` must be a number between 1 and 6.');
+    validateHeadingLevel() {
+        checkRequiredAndOneOf(this, 'headingLevel', HEADING_LEVELS);
         this.accordionItems.forEach(item => {
-            item.setAttribute('heading-level', String(newValue));
+            item.setAttribute('heading-level', String(this.headingLevel));
         });
     }
     componentWillLoad() {
         this.registerAccordionItems();
+    }
+    componentDidLoad() {
         this.validateHeadingLevel();
     }
     collapseToggleHandler(event) {
@@ -88,7 +88,7 @@ export class PostAccordion {
         });
     }
     render() {
-        return (h(Host, { key: '80e15cf7835f213cfee1ca7cf83cc2fd24bba3ff', "data-version": version }, h("div", { key: '1cf03d4960115b52394b5cb07cd2286747c728dd', class: "accordion" }, h("slot", { key: 'b94328a45a3cba6a8d3b418061036eb8af2cf027', onSlotchange: () => this.registerAccordionItems() }))));
+        return (h(Host, { key: '7057a6926f2279f7fc86d7f8539dd3ca884a3d70', "data-version": version }, h("div", { key: 'a6d337471d1d16c09d7e6af950d39c58fc6f2880', class: "accordion" }, h("slot", { key: '9687babb4b539f6e54468555b4057a2b378e1e10', onSlotchange: () => this.registerAccordionItems() }))));
     }
     static get is() { return "post-accordion"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-accordion-item/post-accordion-item.css

@@ -1 +1 @@
-.accordion-item::after{display:block;content:"";margin-block-start:calc(var(--post-device-border-width-default)*-1);border-block-end:var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke)}.accordion-item:has(.accordion-button:hover)::after{border-color:var(--post-scheme-color-interactive-primary-hover-stroke)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-item:has(.accordion-button:hover)::after{border-color:Highlight}}.accordion-header{color:var(--post-scheme-color-interactive-primary-enabled-fg1);font-size:var(--post-device-font-size-5);margin:0;line-height:var(--post-device-line-height-heading);font-weight:var(--post-device-font-weight-black)}.accordion-button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;display:flex;position:relative;width:100%;align-items:center;text-align:start;gap:var(--post-device-spacing-gap-7);padding:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default)) calc(var(--post-device-spacing-padding-5) + var(--post-device-border-width-default));cursor:pointer}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button{background-color:ButtonFace !important}.accordion-button:hover{background-color:Highlight !important}}.accordion-button::before{display:block;position:absolute;content:"";inset:0;inset-block-end:auto;border-block-start:var(--post-accordion-button-border-top)}.accordion-button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.accordion-button slot::slotted(span[slot=header]){flex-grow:1}.accordion-button post-icon{flex:none;width:var(--post-core-dimension-24);aspect-ratio:1;transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.accordion-button.collapsed{padding-block-start:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default));padding-block-end:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default))}.accordion-button.collapsed post-icon{transform:rotate(-180deg)}.accordion-button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}.accordion-button>::slotted(.text-truncate){display:block}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:hover,.accordion-button:focus-visible{color:Highlight}}.accordion-body{padding-block-start:var(--post-device-spacing-padding-15);padding-block-end:calc(var(--post-device-spacing-padding-block-25) + var(--post-device-border-width-default));padding-inline:var(--post-device-spacing-padding-5)}.logo-container{display:none;width:var(--post-device-sizing-logo-1);aspect-ratio:1}.logo-container.has-image{display:block}.logo-container slot::slotted(img){display:block;width:100%;height:100%;object-fit:cover}.accordion-button>::slotted(:first-child),.accordion-body>::slotted(:first-child){margin-block-start:0 !important}.accordion-button>::slotted(:last-child),.accordion-body>::slotted(:last-child){margin-block-end:0 !important}
+.accordion-item::after{display:block;content:"";margin-block-start:calc(var(--post-device-border-width-default)*-1);border-block-end:var(--post-device-border-width-default) var(--post-core-border-style-solid) var(--post-scheme-color-interactive-primary-enabled-stroke)}.accordion-item:has(.accordion-button:hover)::after{border-color:var(--post-scheme-color-interactive-primary-hover-stroke)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-item:has(.accordion-button:hover)::after{border-color:Highlight}}.accordion-header{color:var(--post-scheme-color-interactive-primary-enabled-fg1);font-size:var(--post-device-font-size-5);margin:0;line-height:var(--post-device-line-height-heading);font-weight:var(--post-device-font-weight-black)}.accordion-button{padding:0;overflow:visible;border:0;background:none;color:var(--post-scheme-color-interactive-button-secondary-enabled-fg);font:inherit;-webkit-user-select:none;user-select:none;appearance:button;display:flex;position:relative;width:100%;align-items:center;text-align:start;gap:var(--post-device-spacing-gap-7);padding:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default)) calc(var(--post-device-spacing-padding-5) + var(--post-device-border-width-default));cursor:pointer}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button{background-color:ButtonFace !important}.accordion-button:hover{background-color:Highlight !important}}.accordion-button::before{display:block;position:absolute;content:"";inset:0;inset-block-end:auto;border-block-start-width:var(--post-accordion-button-border-top-width, var(--post-device-border-width-default));border-block-start-style:var(--post-core-border-style-solid);border-block-start-color:var(--post-scheme-color-interactive-primary-enabled-stroke)}.accordion-button{outline-offset:var(--post-device-spacing-padding-2) !important;outline:var(--post-scheme-color-interactive-focus-stroke) none var(--post-device-border-width-focus) !important}.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important;border-radius:var(--post-device-border-radius-focus)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.accordion-button slot::slotted(span[slot=header]){flex-grow:1}.accordion-button post-icon{flex:none;width:var(--post-core-dimension-24);aspect-ratio:1;transition:transform 250ms cubic-bezier(0.4, 0, 0.2, 1)}.accordion-button.collapsed{padding-block-start:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default));padding-block-end:calc(var(--post-device-spacing-padding-19) + var(--post-device-border-width-default))}.accordion-button.collapsed post-icon{transform:rotate(-180deg)}.accordion-button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}.accordion-button>::slotted(.text-truncate){display:block}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.accordion-button:hover,.accordion-button:focus-visible{color:Highlight}}.accordion-body{padding-block-start:var(--post-device-spacing-padding-15);padding-block-end:calc(var(--post-device-spacing-padding-block-25) + var(--post-device-border-width-default));padding-inline:var(--post-device-spacing-padding-5)}.logo-container{display:none;width:var(--post-device-sizing-logo-1);aspect-ratio:1}.logo-container.has-image{display:block}.logo-container slot::slotted(img){display:block;width:100%;height:100%;object-fit:cover}.accordion-button>::slotted(:first-child),.accordion-body>::slotted(:first-child){margin-block-start:0 !important}.accordion-button>::slotted(:last-child),.accordion-body>::slotted(:last-child){margin-block-end:0 !important}

package/dist/collection/components/post-accordion-item/post-accordion-item.js

@@ -1,9 +1,8 @@
 import { h, Host } from "@stencil/core";
 import { version } from "../../../../package";
 import { HEADING_LEVELS } from "../../types/index";
-import { checkEmptyOrOneOf } from "../../utils/index";
+import { checkEmptyOrOneOf, eventGuard } from "../../utils/index";
 import { nanoid } from "nanoid";
-import { eventGuard } from "../../utils/event-gua";
 /**
  * @part button - The pseudo-element, used to override styles on the components internal header `button` element.
  * @part body - The pseudo-element, used to override styles on the components internal `body` element.
@@ -19,7 +18,7 @@ export class PostAccordionItem {
         this.headingLevel = undefined;
     }
     validateHeadingLevel() {
-        checkEmptyOrOneOf(this, 'headingLevel', HEADING_LEVELS, 'The `heading-level` property of the `post-accordion-item` must be a number between 1 and 6.');
+        checkEmptyOrOneOf(this, 'headingLevel', HEADING_LEVELS);
     }
     componentWillLoad() {
         this.id = this.host.id || `p${nanoid(6)}`;
@@ -29,7 +28,7 @@ export class PostAccordionItem {
     }
     // Capture to make sure the "collapsed" property is updated before the event is consumed
     onCollapseToggle(event) {
-        eventGuard(this.host, event, { targetLocalName: 'post-collapsible', delegatorSelector: 'post-accordion-item' }, () => {
+        eventGuard(this.host, event, { targetLocalName: 'post-accordion-item', delegatorSelector: 'post-accordion-item' }, () => {
             this.collapsed = !event.detail;
         });
     }
@@ -48,10 +47,10 @@ export class PostAccordionItem {
     render() {
         const headingLevel = this.host.closest('post-accordion')?.getAttribute('heading-level');
         const HeadingTag = `h${headingLevel ?? this.headingLevel ?? 2}`;
-        return (h(Host, { key: '725d3710f7937f82c2382938d15770001e923b61', id: this.id, "data-version": version }, h("div", { key: '679d25d8278fbf9ae68546ee50c27a86ded95999', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: '7c2af8dc6a1f5265b4ae2cad066be7d2e0bf6a78', for: `${this.id}--collapse` }, h(HeadingTag, { key: 'a10e59a17fdb272fe6308d2ba98f37f90490fab8', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: 'e2b527850c8342a8adf99453d0ac330b6a94760f', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, h("span", { key: 'b722a4bc51757546eefa58c7c3ea3a688838298a', class: {
+        return (h(Host, { key: '41b746c2ed269178d6a889899da6d55c44b647e1', id: this.id, "data-version": version }, h("div", { key: '8d675ccd039e8317673e68ac79cc3b99b5524200', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: 'b19a63493df6dded4797fc7286ee51a5984a6ecf', for: `${this.id}--collapse` }, h(HeadingTag, { key: 'c4dc2f1b5a6528ccd241a70da1b59ba3dbdc999c', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: '27d5e2111b32819d9df23f824ee9bcfeb6ae0714', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, h("span", { key: '4e6840a49b432a39a93392aab9e1fb31ed13e120', class: {
                 'logo-container': true,
                 'has-image': !!this.slottedLogo,
-            } }, h("slot", { key: '1a42494db72a7b437b1d98fa2e8159d73ece22fa', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: '049865bb25f833780ef8e27fe8477e06476a2427', name: "header" }), h("post-icon", { key: 'da0cf7078e4f51710dbfd39c0afa90465fcb53c6', name: "2051" })))), h("post-collapsible", { key: '7c3b268e34d3e4f52820b11a6c090aefbc16e3b9', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: '993a7fffbccb557aed2842305f3927e5c3b5047a', class: "accordion-body", part: "body" }, h("slot", { key: '580eb87b1cb4f88acd7dddddecaa1c1982b7f6e3' }))))));
+            } }, h("slot", { key: '1f802c84252b6ba84d8a595fec744e345e6cc77f', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: '3d7b75e30b0aa31c36fd558db73b9055985c872c', name: "header" }), h("post-icon", { key: '1d5a701f86551bd62d3ed88892d0c4561a7b86c5', name: "2051" })))), h("post-collapsible", { key: '95f5c1d5fc09ffaa32eda367f2a1364e38007b4a', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: '69a4c7a8c20283477f637ee61185f576cdadfbb5', class: "accordion-body", part: "body" }, h("slot", { key: '24eb9e5998b86189d321367702a9e6c97ca0c0e1' }))))));
     }
     static get is() { return "post-accordion-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-avatar/post-avatar.js

@@ -1,11 +1,12 @@
 import { h, Host } from "@stencil/core";
 import { version } from "../../../../package";
-import { checkNonEmpty } from "../../utils/index";
+import { checkRequiredAndType, checkEmptyOrPattern, checkEmptyOrType } from "../../utils/index";
 // https://docs.gravatar.com/api/avatars/images/
 const GRAVATAR_DEFAULT = '404';
 const GRAVATAR_RATING = 'g';
 const GRAVATAR_SIZE = 80;
 const GRAVATAR_BASE_URL = `https://www.gravatar.com/avatar/{email}?s=${GRAVATAR_SIZE}&d=${GRAVATAR_DEFAULT}&r=${GRAVATAR_RATING}`;
+const emailPattern = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
 var AvatarType;
 (function (AvatarType) {
     AvatarType["Slotted"] = "slotted";
@@ -29,7 +30,17 @@ export class PostAvatar {
         this.initials = '';
     }
     validateFirstname() {
-        checkNonEmpty(this, 'firstname');
+        checkRequiredAndType(this, 'firstname', 'string');
+    }
+    validateLastname() {
+        checkEmptyOrType(this, 'lastname', 'string');
+    }
+    validateUserid() {
+        checkEmptyOrType(this, 'userid', 'string');
+    }
+    validateEmail() {
+        if (this.email)
+            checkEmptyOrPattern(this, 'email', emailPattern);
     }
     async getAvatar() {
         if (this.slottedImage !== null) {
@@ -117,6 +128,9 @@ export class PostAvatar {
     }
     componentDidLoad() {
         this.validateFirstname();
+        this.validateLastname();
+        this.validateUserid();
+        this.validateEmail();
     }
     render() {
         const initials = this.getNames().reduce((acc, n, i) => {
@@ -227,6 +241,15 @@ export class PostAvatar {
         return [{
                 "propName": "firstname",
                 "methodName": "validateFirstname"
+            }, {
+                "propName": "lastname",
+                "methodName": "validateLastname"
+            }, {
+                "propName": "userid",
+                "methodName": "validateUserid"
+            }, {
+                "propName": "email",
+                "methodName": "validateEmail"
             }];
     }
 }

package/dist/collection/components/post-back-to-top/post-back-to-top.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 import { slideUp, slideDown } from "../../animations/slide";
 import { version } from "../../../../package";
-import { checkType, checkNonEmpty } from "../../utils/index";
+import { checkRequiredAndType } from "../../utils/index";
 export class PostBackToTop {
     constructor() {
         this.handleScroll = () => {
@@ -13,6 +13,9 @@ export class PostBackToTop {
     isBelowFold() {
         return window.scrollY > window.innerHeight;
     }
+    validateLabel() {
+        checkRequiredAndType(this, 'label', 'string');
+    }
     /*Watch for changes in belowFold to show/hide the back to top button*/
     watchBelowFold(newValue) {
         if (newValue) {
@@ -56,11 +59,6 @@ export class PostBackToTop {
             this.host.style.transform = `translateY(${this.translateY})`;
         }
     }
-    // Validate the label
-    validateLabel() {
-        checkNonEmpty(this, 'label');
-        checkType(this, 'label', 'string');
-    }
     // Set the initial state
     componentWillLoad() {
         this.belowFold = this.isBelowFold();
@@ -74,7 +72,7 @@ export class PostBackToTop {
         window.removeEventListener('scroll', this.handleScroll);
     }
     render() {
-        return (h(Host, { key: 'c1ab6c5e7619ad829d64aea16c59a923310cf091', "data-version": version }, h("button", { key: '99e10e4d16c8d82521b001c3b3d902d8ba47ee92', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, h("post-icon", { key: '5a6a1b472b45fcc466127ece7091617e4700ee16', "aria-hidden": "true", name: "3026" }), h("span", { key: 'c8502e4822347d48034f6a936203e3314c7ae91e', class: "visually-hidden" }, this.label))));
+        return (h(Host, { key: '7edc6db9d849cf9ce0308a2ac5b2c2f9bc4e47a9', "data-version": version }, h("button", { key: '610e81756ce3dd927f55d48beb8cd829b66fc247', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, h("post-icon", { key: 'bb1f3cc462de7680361f4cfd04abb1816aebd488', "aria-hidden": "true", name: "3026" }), h("span", { key: '4fbd84d78c425140adea5833450cef60af967f5a', class: "visually-hidden" }, this.label))));
     }
     static get is() { return "post-back-to-top"; }
     static get encapsulation() { return "shadow"; }
@@ -117,11 +115,11 @@ export class PostBackToTop {
     static get elementRef() { return "host"; }
     static get watchers() {
         return [{
-                "propName": "belowFold",
-                "methodName": "watchBelowFold"
-            }, {
                 "propName": "label",
                 "methodName": "validateLabel"
+            }, {
+                "propName": "belowFold",
+                "methodName": "watchBelowFold"
             }];
     }
 }

package/dist/collection/components/post-banner/post-banner.js

@@ -1,7 +1,7 @@
 import { Host, h, } from "@stencil/core";
 import { version } from "../../../../package";
 import { fadeOut } from "../../animations/index";
-import { checkEmptyOrOneOf, checkEmptyOrPattern, checkNonEmpty, checkType } from "../../utils/index";
+import { checkRequiredAndType, checkEmptyOrOneOf, checkEmptyOrType } from "../../utils/index";
 import { BANNER_TYPES } from "./banner-types";
 import { nanoid } from "nanoid";
 /**
@@ -21,23 +21,21 @@ export class PostBanner {
         this.icon = undefined;
         this.type = 'neutral';
     }
-    validateDismissible() {
-        checkType(this, 'dismissible', 'boolean');
-        setTimeout(() => this.validateDismissLabel());
-    }
-    validateDismissLabel() {
+    checkDismissible() {
         if (this.dismissible) {
-            checkNonEmpty(this, 'dismissLabel', 'Dismissible post-banner\'s require a "dismiss-label" prop.');
+            setTimeout(() => {
+                checkRequiredAndType(this, 'dismissLabel', 'string');
+            });
         }
     }
     validateIcon() {
-        checkEmptyOrPattern(this, 'icon', /\d{4}|none/, 'The post-banner "icon" prop should be a 4-digit string.');
+        checkEmptyOrType(this, 'icon', 'string');
     }
     validateType() {
         checkEmptyOrOneOf(this, 'type', BANNER_TYPES);
     }
     componentDidLoad() {
-        this.validateDismissible();
+        this.checkDismissible();
         this.validateIcon();
         this.validateType();
     }
@@ -63,14 +61,14 @@ export class PostBanner {
     }
     render() {
         const defaultBannerContent = [
-            this.hasHeading && (h("div", { key: `${this.bannerId}-heading`, class: "banner-heading" }, h("slot", { key: 'd4b29e3591f026b880c4b859a47bcbc3e3b11ced', name: "heading" }))),
+            this.hasHeading && (h("div", { key: `${this.bannerId}-heading`, class: "banner-heading" }, h("slot", { key: '6bf8a3c8152cda870f7d3036c837918f83dee8e1', name: "heading" }))),
             h("slot", { key: `${this.bannerId}-message` }),
         ];
         const actionBannerContent = [
             h("div", { key: `${this.bannerId}-content`, class: "banner-content" }, defaultBannerContent),
-            h("div", { key: `${this.bannerId}-buttons`, class: "banner-buttons" }, h("slot", { key: '2f1461a2374d736cb3b72641aa150bc611082f56', name: "actions" })),
+            h("div", { key: `${this.bannerId}-buttons`, class: "banner-buttons" }, h("slot", { key: '07a3ade9a798eeb292e28820483a4e5096fe3569', name: "actions" })),
         ];
-        return (h(Host, { key: 'ec72012fa82e03b0dca2368025449e1942731c21', "data-version": version }, h("div", { key: 'acae7ac34af951ca9176769ab4bcdc388d769931', role: "alert", class: this.classes, part: this.classes }, this.dismissible && (h("button", { key: '23cc4d77c2825bc76cedcdc321b80b9b0f333e71', class: "btn-close", onClick: this.onDismissButtonClick }, h("span", { key: '2f0753d49fc86f19df743f33a086c14b2a0686f7', class: "visually-hidden" }, this.dismissLabel))), this.icon && this.icon !== 'none' && (h("post-icon", { key: `${this.bannerId}-icon`, name: this.icon })), this.hasActions ? actionBannerContent : defaultBannerContent)));
+        return (h(Host, { key: '9b6c1935e20686e69005a0034ca711363b880647', "data-version": version }, h("div", { key: '9a4effd086d7279cbd91bea6b5510bc66349fdc5', role: "alert", class: this.classes, part: this.classes }, this.dismissible && (h("button", { key: '7e822d65eaf6eb9aa356aed8cc95c0107ee1ae27', class: "btn-close", onClick: this.onDismissButtonClick }, h("span", { key: 'f1c7356412ddb9d046f985fde25703715a20755d', class: "visually-hidden" }, this.dismissLabel))), this.icon && this.icon !== 'none' && (h("post-icon", { key: `${this.bannerId}-icon`, name: this.icon })), this.hasActions ? actionBannerContent : defaultBannerContent)));
     }
     static get is() { return "post-banner"; }
     static get encapsulation() { return "shadow"; }
@@ -113,7 +111,7 @@ export class PostBanner {
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": "The label to use for the close button of a dismissible banner."
@@ -130,7 +128,7 @@ export class PostBanner {
                     "references": {}
                 },
                 "required": false,
-                "optional": false,
+                "optional": true,
                 "docs": {
                     "tags": [],
                     "text": "The icon to display in the banner. By default, the icon depends on the banner type.\n\nIf `none`, no icon is displayed."
@@ -216,10 +214,7 @@ export class PostBanner {
     static get watchers() {
         return [{
                 "propName": "dismissible",
-                "methodName": "validateDismissible"
-            }, {
-                "propName": "dismissLabel",
-                "methodName": "validateDismissLabel"
+                "methodName": "checkDismissible"
             }, {
                 "propName": "icon",
                 "methodName": "validateIcon"

package/dist/collection/components/post-breadcrumb-item/post-breadcrumb-item.js

@@ -41,7 +41,7 @@ export class PostBreadcrumbItem {
     }
     render() {
         const BreadcrumbTag = this.validUrl ? 'a' : 'span';
-        return (h(Host, { key: 'd0444118aa031f4cf6f5161d7aa21900e9768348', "data-version": version }, h("post-icon", { key: '719a76e6e86bbb02526c4610acefb3ad253454af', name: "2111", class: "breadcrumb-item-icon" }), h(BreadcrumbTag, { key: '3f5ffb9c77567dba35efa7938029cd519de55474', class: "breadcrumb-item", ...(this.validUrl ? { href: this.validUrl } : {}), onKeyDown: event => this.handleKeyDown(event) }, h("slot", { key: 'bb1be29905c1533f2238a47a346fb35d6a7645fd' }))));
+        return (h(Host, { key: '8db753265537822996e971b6910284246ed0c9b2', "data-version": version }, h("post-icon", { key: '5a40f01b5876337f6dff6117b61d0138b0c85d1e', name: "2111", class: "breadcrumb-item-icon" }), h(BreadcrumbTag, { key: '8a023863726927eca0f222a27f9b8946bc6c3b57', class: "breadcrumb-item", ...(this.validUrl ? { href: this.validUrl } : {}), onKeyDown: event => this.handleKeyDown(event) }, h("slot", { key: 'f98dd0552ff91b845bb838518cc619d613f57e5c' }))));
     }
     static get is() { return "post-breadcrumb-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-breadcrumbs/post-breadcrumbs.js

@@ -1,6 +1,6 @@
 import { h, Host } from "@stencil/core";
 import { version } from "../../../../package";
-import { checkUrl, debounce } from "../../utils/index";
+import { checkRequiredAndUrl, checkEmptyOrType, debounce } from "../../utils/index";
 export class PostBreadcrumbs {
     constructor() {
         // Waits for breadcrumbs navigation reference to be available
@@ -25,13 +25,18 @@ export class PostBreadcrumbs {
         this.isConcatenated = undefined;
         this.lastWindowWidth = undefined;
     }
-    validateUrl() {
-        checkUrl(this, 'homeUrl');
+    validateHomeUrl() {
+        checkRequiredAndUrl(this, 'homeUrl');
+    }
+    validateHomeText() {
+        checkEmptyOrType(this, 'homeUrl', 'string');
     }
     componentWillLoad() {
         this.updateBreadcrumbItems();
     }
     componentDidLoad() {
+        this.validateHomeUrl();
+        this.validateHomeText();
         window.addEventListener('resize', this.handleResize);
         this.waitForBreadcrumbsRef();
     }
@@ -79,7 +84,7 @@ export class PostBreadcrumbs {
     }
     render() {
         const visibleItems = this.breadcrumbItems.slice(0, -1);
-        return (h(Host, { key: 'f0c2507a02ea79059af1e4dfefce17ab04780fbe', "data-version": version }, h("nav", { key: '0307206eecadfa5a47ba88f9c17c72b88d26be5c', "aria-label": "Breadcrumbs", class: "breadcrumbs-nav", ref: el => (this.breadcrumbsNavRef = el) }, h("ol", { key: '646809f73775f8cd74b6b97c21b7055569fa5f4c', class: "no-list breadcrumbs-list" }, h("li", { key: '15bd467366517f0b9a11e54dfdffc13a0b681f3c' }, h("a", { key: 'd05e860d2de60b740b77120f0745752ff1ec1d17', href: this.homeUrl, class: "breadcrumb-link" }, h("span", { key: '3241f72e9fdc82e1521762d2fc47a6472366f722', class: "visually-hidden" }, this.homeText), h("post-icon", { key: '2cdfdb5641b1ba459070b724e6578b842b8d90ae', name: "home", class: "home-icon" }))), this.isConcatenated ? (h("div", { class: "menu-trigger-wrapper", "aria-label": "More breadcrumbs", onKeyDown: e => {
+        return (h(Host, { key: '6498bbfb52739937fc8043a78fa66d922ce740ef', "data-version": version }, h("nav", { key: '421e51bdf79856ba2feb6c23f1b5bb4f5a87f975', "aria-label": "Breadcrumbs", class: "breadcrumbs-nav", ref: el => (this.breadcrumbsNavRef = el) }, h("ol", { key: '191140970a37312b486b594b065fcc6ef580f1ae', class: "no-list breadcrumbs-list" }, h("li", { key: '37e0da2803814556bac7102e4e27b13cfd268472' }, h("a", { key: 'b11a8dba7b19dac336dc5905dd74b84a9b83da58', href: this.homeUrl, class: "breadcrumb-link" }, h("span", { key: '147009734e9174d7b9541c3f5325d914ef5d35c0', class: "visually-hidden" }, this.homeText), h("post-icon", { key: '56dd5647116c03c11506fb1e2957edeb389c5718', name: "home", class: "home-icon" }))), this.isConcatenated ? (h("div", { class: "menu-trigger-wrapper", "aria-label": "More breadcrumbs", onKeyDown: e => {
                 if (e.key === 'Enter' || e.key === ' ') {
                     e.preventDefault();
                     this.handleBreadcrumbItemClick();
@@ -90,7 +95,7 @@ export class PostBreadcrumbs {
                     linkElement?.click();
                     e.preventDefault();
                 }
-            } }, item.url ? h("a", { href: item.url }, item.text) : h("span", null, item.text)))))))) : (visibleItems.map(item => (h("post-breadcrumb-item", { url: item.url, key: item.url || item.text }, item.text)))), this.lastItem && (h("post-breadcrumb-item", { key: '9820e7cc99072f16f9118e3783de126b1c65c51c', url: this.lastItem.url, "aria-current": "page", tabindex: -1 }, this.lastItem.text))), h("div", { key: '960f5784f11bd87e787722bd888cf91ec65329e1', class: "hidden-items" }, h("a", { key: '73dfb29ff5b45c6e3fe9a8f88abfde56fc9bb5e3', href: this.homeUrl, class: "hidden-breadcrumb-item" }, h("span", { key: 'bf6be08c70fca37879312b2adbf2808d83599cf3', class: "visually-hidden" }, this.homeText), h("post-icon", { key: '8c94c725dc315ac31187e079cb01def2891ac352', name: "home", class: "home-icon" })), this.breadcrumbItems.map(item => (h("post-breadcrumb-item", { url: item.url, key: `hidden-${item.url || item.text}`, class: "hidden-breadcrumb-item" }, item.text)))))));
+            } }, item.url ? h("a", { href: item.url }, item.text) : h("span", null, item.text)))))))) : (visibleItems.map(item => (h("post-breadcrumb-item", { url: item.url, key: item.url || item.text }, item.text)))), this.lastItem && (h("post-breadcrumb-item", { key: 'ca1fe70041a11fa14e04e3e3d4fce699f23a127f', url: this.lastItem.url, "aria-current": "page", tabindex: -1 }, this.lastItem.text))), h("div", { key: '360825da69d23943a55ceb7095fabcccbf65795b', class: "hidden-items" }, h("a", { key: '9c5dedc65e639c853bc537a93971a45c6d801d00', href: this.homeUrl, class: "hidden-breadcrumb-item" }, h("span", { key: '2e6961ca93e24ba8042cf15f2f8cc14511c3d374', class: "visually-hidden" }, this.homeText), h("post-icon", { key: 'ea61643af1b2384e931ecbf5b9ff48950b69719e', name: "home", class: "home-icon" })), this.breadcrumbItems.map(item => (h("post-breadcrumb-item", { url: item.url, key: `hidden-${item.url || item.text}`, class: "hidden-breadcrumb-item" }, item.text)))))));
     }
     static get is() { return "post-breadcrumbs"; }
     static get encapsulation() { return "shadow"; }
@@ -114,7 +119,7 @@ export class PostBreadcrumbs {
                     "resolved": "string",
                     "references": {}
                 },
-                "required": false,
+                "required": true,
                 "optional": false,
                 "docs": {
                     "tags": [],
@@ -154,7 +159,10 @@ export class PostBreadcrumbs {
     static get watchers() {
         return [{
                 "propName": "homeUrl",
-                "methodName": "validateUrl"
+                "methodName": "validateHomeUrl"
+            }, {
+                "propName": "homeText",
+                "methodName": "validateHomeText"
             }];
     }
 }