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

package/loaders/post-avatar.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { v as version } from './package.js';
-import { c as checkNonEmpty } from './check-non-empty.js';
+import { c as checkRequiredAndType, a as checkEmptyOrType, b as checkEmptyOrPattern } from './index2.js';
 import './breakpoints.js';
 
 const postAvatarCss = "@keyframes popIn{from{transform:scale(0.9);opacity:0;transition-property:transform,opacity,overlay,display;transition-behavior:allow-discrete;transition-duration:var(--post-transition-duration, 0.35s);transition-timing-function:linear(0, 0.007, 0.029 2.2%, 0.118 4.7%, 0.625 14.4%, 0.826 19%, 0.902, 0.962, 1.008 26.1%, 1.041 28.7%, 1.064 32.1%, 1.07 36%, 1.061 40.5%, 1.015 53.4%, 0.999 61.6%, 0.995 71.2%, 1)}to{opacity:1;transform:scale(1)}}:host{--post-avatar-bg:var(--post-scheme-color-interactive-primary-enabled-bg2);--post-avatar-fg:var(--post-scheme-color-interactive-primary-enabled-fg3);display:inline-flex;position:relative;width:var(--post-device-sizing-interactive-icon-size3);height:var(--post-device-sizing-interactive-icon-size3);background-color:var(--post-scheme-color-interactive-primary-enabled-stroke3);border:var(--post-device-border-width-default) solid var(--post-scheme-color-interactive-primary-enabled-stroke3);border-radius:var(--post-device-border-radius-round);font-size:var(--post-device-font-size-8);vertical-align:top;line-height:1}:host::after{display:block;content:\"\";position:absolute;inset:0;z-index:1;border-radius:inherit}*,*::before,*::after{box-sizing:border-box}slot,img,::slotted(img){display:block;width:100%;height:100%}img,::slotted(img){border-radius:var(--post-device-border-radius-round)}::slotted(:not(img)){display:none !important}.initials{display:flex;justify-content:center;align-items:center;position:relative;z-index:2;width:100%;height:100%;background-color:var(--post-avatar-bg);border-radius:var(--post-device-border-radius-round);color:var(--post-avatar-fg);text-transform:uppercase}.initials span{width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.initials span:not(caption){position:absolute !important}";
@@ -11,6 +11,7 @@ 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";
@@ -34,7 +35,17 @@ const PostAvatar$1 = /*@__PURE__*/ proxyCustomElement(class PostAvatar extends H
         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) {
@@ -122,6 +133,9 @@ const PostAvatar$1 = /*@__PURE__*/ proxyCustomElement(class PostAvatar extends H
     }
     componentDidLoad() {
         this.validateFirstname();
+        this.validateLastname();
+        this.validateUserid();
+        this.validateEmail();
     }
     render() {
         const initials = this.getNames().reduce((acc, n, i) => {
@@ -136,7 +150,10 @@ const PostAvatar$1 = /*@__PURE__*/ proxyCustomElement(class PostAvatar extends H
     }
     get host() { return this; }
     static get watchers() { return {
-        "firstname": ["validateFirstname"]
+        "firstname": ["validateFirstname"],
+        "lastname": ["validateLastname"],
+        "userid": ["validateUserid"],
+        "email": ["validateEmail"]
     }; }
     static get style() { return PostAvatarStyle0; }
 }, [1, "post-avatar", {
@@ -150,7 +167,10 @@ const PostAvatar$1 = /*@__PURE__*/ proxyCustomElement(class PostAvatar extends H
         "imageAlt": [32],
         "initials": [32]
     }, undefined, {
-        "firstname": ["validateFirstname"]
+        "firstname": ["validateFirstname"],
+        "lastname": ["validateLastname"],
+        "userid": ["validateUserid"],
+        "email": ["validateEmail"]
     }]);
 PostAvatar$1.INTERNAL_USERID_IMAGE_SRC = 'https://web.post.ch/UserProfileImage/{userid}.png';
 function defineCustomElement$1() {

package/loaders/post-back-to-top.js

@@ -1,8 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { s as slideDown, a as slideUp } from './slide.js';
 import { v as version } from './package.js';
-import { c as checkType } from './check-type.js';
-import { c as checkNonEmpty } from './check-non-empty.js';
+import { c as checkRequiredAndType } from './index2.js';
 import './breakpoints.js';
 import { d as defineCustomElement$2 } from './post-icon2.js';
 
@@ -23,6 +22,9 @@ const PostBackToTop$1 = /*@__PURE__*/ proxyCustomElement(class PostBackToTop ext
     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) {
@@ -66,11 +68,6 @@ const PostBackToTop$1 = /*@__PURE__*/ proxyCustomElement(class PostBackToTop ext
             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();
@@ -84,20 +81,20 @@ const PostBackToTop$1 = /*@__PURE__*/ proxyCustomElement(class PostBackToTop ext
         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))));
     }
     get host() { return this; }
     static get watchers() { return {
-        "belowFold": ["watchBelowFold"],
-        "label": ["validateLabel"]
+        "label": ["validateLabel"],
+        "belowFold": ["watchBelowFold"]
     }; }
     static get style() { return PostBackToTopStyle0; }
 }, [1, "post-back-to-top", {
         "label": [513],
         "belowFold": [32]
     }, undefined, {
-        "belowFold": ["watchBelowFold"],
-        "label": ["validateLabel"]
+        "label": ["validateLabel"],
+        "belowFold": ["watchBelowFold"]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {

package/loaders/post-banner.js

@@ -1,12 +1,10 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { v as version } from './package.js';
 import { f as fadeOut } from './fade.js';
-import { c as checkEmptyOrPattern, a as checkEmptyOrOneOf } from './index2.js';
+import { c as checkRequiredAndType, a as checkEmptyOrType, d as checkEmptyOrOneOf } from './index2.js';
 import './breakpoints.js';
 import { n as nanoid } from './index.browser.js';
 import { d as defineCustomElement$2 } from './post-icon2.js';
-import { c as checkType } from './check-type.js';
-import { c as checkNonEmpty } from './check-non-empty.js';
 
 const BANNER_TYPES = ['neutral', 'success', 'warning', 'danger', 'info'];
 
@@ -29,23 +27,21 @@ const PostBanner$1 = /*@__PURE__*/ proxyCustomElement(class PostBanner extends H
         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();
     }
@@ -71,19 +67,18 @@ const PostBanner$1 = /*@__PURE__*/ proxyCustomElement(class PostBanner extends H
     }
     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)));
     }
     get host() { return this; }
     static get watchers() { return {
-        "dismissible": ["validateDismissible"],
-        "dismissLabel": ["validateDismissLabel"],
+        "dismissible": ["checkDismissible"],
         "icon": ["validateIcon"],
         "type": ["validateType"]
     }; }
@@ -100,8 +95,7 @@ const PostBanner$1 = /*@__PURE__*/ proxyCustomElement(class PostBanner extends H
         "onDismissButtonClick": [32],
         "dismiss": [64]
     }, undefined, {
-        "dismissible": ["validateDismissible"],
-        "dismissLabel": ["validateDismissLabel"],
+        "dismissible": ["checkDismissible"],
         "icon": ["validateIcon"],
         "type": ["validateType"]
     }]);

package/loaders/post-breadcrumb-item2.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { v as version } from './package.js';
-import { e as checkEmptyOrUrl } from './index2.js';
+import { g as checkEmptyOrUrl } from './index2.js';
 import './breakpoints.js';
 import { d as defineCustomElement$1 } from './post-icon2.js';
 
@@ -47,7 +47,7 @@ const PostBreadcrumbItem = /*@__PURE__*/ proxyCustomElement(class PostBreadcrumb
     }
     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' }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/loaders/post-breadcrumbs.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { v as version } from './package.js';
-import { b as checkUrl } from './index2.js';
+import { f as checkRequiredAndUrl, a as checkEmptyOrType } from './index2.js';
 import './breakpoints.js';
 import { d as defineCustomElement$7 } from './post-breadcrumb-item2.js';
 import { d as defineCustomElement$6 } from './post-icon2.js';
@@ -49,13 +49,18 @@ const PostBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(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();
     }
@@ -103,7 +108,7 @@ const PostBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(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();
@@ -114,11 +119,12 @@ const PostBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(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)))))));
     }
     get host() { return this; }
     static get watchers() { return {
-        "homeUrl": ["validateUrl"]
+        "homeUrl": ["validateHomeUrl"],
+        "homeText": ["validateHomeText"]
     }; }
     static get style() { return PostBreadcrumbsStyle0; }
 }, [1, "post-breadcrumbs", {
@@ -128,7 +134,8 @@ const PostBreadcrumbs$1 = /*@__PURE__*/ proxyCustomElement(class PostBreadcrumbs
         "isConcatenated": [32],
         "lastWindowWidth": [32]
     }, undefined, {
-        "homeUrl": ["validateUrl"]
+        "homeUrl": ["validateHomeUrl"],
+        "homeText": ["validateHomeText"]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {

package/loaders/post-card-control.js

@@ -1,6 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { c as checkOneOf } from './check-one-of.js';
-import { c as checkNonEmpty } from './check-non-empty.js';
+import { c as checkRequiredAndType, a as checkEmptyOrType, e as checkRequiredAndOneOf } from './index2.js';
 import './breakpoints.js';
 import { v as version } from './package.js';
 import { d as defineCustomElement$2 } from './post-icon2.js';
@@ -12,10 +11,10 @@ let cardControlIds = 0;
 const PostCardControl$1 = /*@__PURE__*/ proxyCustomElement(class PostCardControl extends HTMLElement {
     /**
      * A public method to reset the controls `checked` and `validity` state.
-     * The validity state is set to `null`, so it's neither valid nor invalid.
+     * The validity state is set to `undefined`, so it's neither valid nor invalid.
      */
     async reset() {
-        this.validity = null;
+        this.validity = undefined;
         this.controlSetChecked(this.initialChecked);
     }
     /**
@@ -27,10 +26,24 @@ const PostCardControl$1 = /*@__PURE__*/ proxyCustomElement(class PostCardControl
         this.controlSetChecked(false);
     }
     validateControlLabel() {
-        checkNonEmpty(this, 'label');
+        checkRequiredAndType(this, 'label', 'string');
+    }
+    validateControlDescription() {
+        checkEmptyOrType(this, 'description', 'string');
     }
     validateControlType() {
-        checkOneOf(this, 'type', ['checkbox', 'radio']);
+        checkRequiredAndOneOf(this, 'type', ['checkbox', 'radio']);
+    }
+    validateControlName() {
+        checkEmptyOrType(this, 'name', 'string');
+    }
+    validateControlValue() {
+        if (this.type == 'radio') {
+            checkEmptyOrType(this, 'value', 'string');
+        }
+    }
+    validateControlIcon() {
+        checkEmptyOrType(this, 'icon', 'string');
     }
     updateControlChecked(checked = this.checked) {
         this.controlSetChecked(checked);
@@ -67,14 +80,14 @@ const PostCardControl$1 = /*@__PURE__*/ proxyCustomElement(class PostCardControl
         this.controlId = `PostCardControl_${cardControlIds++}`;
         this.focused = false;
         this.label = undefined;
-        this.description = null;
+        this.description = undefined;
         this.type = undefined;
-        this.name = null;
-        this.value = null;
+        this.name = undefined;
+        this.value = undefined;
         this.checked = false;
         this.disabled = false;
-        this.validity = null;
-        this.icon = null;
+        this.validity = undefined;
+        this.icon = undefined;
         this.cardClickHandler = this.cardClickHandler.bind(this);
         this.controlClickHandler = this.controlClickHandler.bind(this);
         this.controlChangeHandler = this.controlChangeHandler.bind(this);
@@ -221,14 +234,14 @@ const PostCardControl$1 = /*@__PURE__*/ proxyCustomElement(class PostCardControl
         this.hasIcon = Boolean(this.host.querySelector('[slot="icon"]') || this.icon);
     }
     render() {
-        return (h(Host, { key: '9172642a4424a3393c0738feba3a3ef8dcea43e8', "data-version": version, onClick: this.cardClickHandler }, h("div", { key: 'd6e47613dfe9d33647fd2379010275d70cbcbdcb', class: {
+        return (h(Host, { key: 'ff23ac518f715fc7c2727dd7c2abccd0fdb486da', "data-version": version, onClick: this.cardClickHandler }, h("div", { key: '3519942dfeb694729e4b6c7c7df4b68854ccde81', class: {
                 'card-control': true,
                 'is-checked': this.checked,
                 'is-disabled': this.disabled,
                 'is-focused': this.focused,
-                'is-valid': this.validity !== null && this.validity !== 'false',
-                'is-invalid': this.validity === 'false',
-            } }, h("input", { key: '44b0e5d5c2c6a759300979a5c33c2a65afaaa27d', ref: el => (this.control = el), id: this.controlId, class: "card-control--input", type: this.type, name: this.name, value: this.value, checked: this.checked, "aria-describedby": `${this.controlId}_content`, "aria-disabled": this.disabled, "aria-invalid": this.validity === 'false', onClick: this.controlClickHandler, onInput: this.controlChangeHandler, onChange: this.controlChangeHandler, onFocus: this.controlFocusHandler, onBlur: this.controlFocusHandler, onKeyDown: this.controlKeyDownHandler }), h("label", { key: 'fd3106562bfcb5ca0e7e5704272f927bfb201af5', id: `${this.controlId}_label`, htmlFor: this.controlId, class: "card-control--label" }, this.label, this.description ? (h("div", { class: "card-control--description" }, this.description)) : null), this.hasIcon ? (h("div", { class: "card-control--icon" }, h("slot", { name: "icon" }, this.icon ? h("post-icon", { name: this.icon }) : null))) : null, h("div", { key: 'ebfa245a0e2b6e45384586408614ce85494fbc58', id: `${this.controlId}_content`, class: "card-control--content" }, h("slot", { key: '99b406bc58fbfcd054f1b551a453a7ac1f4276f6' })))));
+                'is-valid': this.validity !== undefined && this.validity !== false,
+                'is-invalid': this.validity === false,
+            } }, h("input", { key: 'f47a58485c7d507565e29c832ca1c3d6b053bc17', ref: el => (this.control = el), id: this.controlId, class: "card-control--input", type: this.type, name: this.name, value: this.value, checked: this.checked, "aria-describedby": `${this.controlId}_content`, "aria-disabled": this.disabled, "aria-invalid": this.validity === false, onClick: this.controlClickHandler, onInput: this.controlChangeHandler, onChange: this.controlChangeHandler, onFocus: this.controlFocusHandler, onBlur: this.controlFocusHandler, onKeyDown: this.controlKeyDownHandler }), h("label", { key: '65e8247d88c2cc6bb2e0be17e7d6fab3502fb364', id: `${this.controlId}_label`, htmlFor: this.controlId, class: "card-control--label" }, this.label, this.description ? (h("div", { class: "card-control--description" }, this.description)) : null), this.hasIcon ? (h("div", { class: "card-control--icon" }, h("slot", { name: "icon" }, this.icon ? h("post-icon", { name: this.icon }) : null))) : null, h("div", { key: 'df538a1f14b49fa7bd6907ef57d045c7303b6d77', id: `${this.controlId}_content`, class: "card-control--content" }, h("slot", { key: '1a79c6a2da57a5b8aef911dc2acd09e553b79489' })))));
     }
     componentDidRender() {
         this.setHostContext();
@@ -236,7 +249,11 @@ const PostCardControl$1 = /*@__PURE__*/ proxyCustomElement(class PostCardControl
     }
     componentDidLoad() {
         this.validateControlLabel();
+        this.validateControlName();
+        this.validateControlValue();
+        this.validateControlDescription();
         this.validateControlType();
+        this.validateControlIcon();
     }
     formAssociatedCallback() {
         this.controlSetChecked(this.checked);
@@ -254,7 +271,11 @@ const PostCardControl$1 = /*@__PURE__*/ proxyCustomElement(class PostCardControl
     get host() { return this; }
     static get watchers() { return {
         "label": ["validateControlLabel"],
+        "description": ["validateControlDescription"],
         "type": ["validateControlType"],
+        "name": ["validateControlName"],
+        "value": ["validateControlValue"],
+        "icon": ["validateControlIcon"],
         "checked": ["updateControlChecked"],
         "disabled": ["updateControlDisabled"]
     }; }
@@ -267,14 +288,18 @@ const PostCardControl$1 = /*@__PURE__*/ proxyCustomElement(class PostCardControl
         "value": [1],
         "checked": [1028],
         "disabled": [1028],
-        "validity": [1025],
+        "validity": [1028],
         "icon": [1],
         "focused": [32],
         "reset": [64],
         "groupReset": [64]
     }, undefined, {
         "label": ["validateControlLabel"],
+        "description": ["validateControlDescription"],
         "type": ["validateControlType"],
+        "name": ["validateControlName"],
+        "value": ["validateControlValue"],
+        "icon": ["validateControlIcon"],
         "checked": ["updateControlChecked"],
         "disabled": ["updateControlDisabled"]
     }]);

package/loaders/post-closebutton.js

@@ -12,7 +12,7 @@ const PostClosebutton$1 = /*@__PURE__*/ proxyCustomElement(class PostClosebutton
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: 'cfa55f799fdf9ad0f3ac1eb296e063b5001de997', "data-version": version }, h("button", { key: '7c8a084f6d7278329ddfb5fc4b2b8f992a185666', class: "btn btn-icon-close", type: "button" }, h("post-icon", { key: 'fc74ccb4f0c4c091a02a41cdef918d6c3b065c8c', "aria-hidden": "true", name: "closex" }), h("span", { key: '98478b013714df6d82c6c2f533ac8ecd2abae778', class: "visually-hidden" }, h("slot", { key: '109e2bca4436986dd037d8c29088cc79395bc200' })))));
+        return (h(Host, { key: '7b5e179b42eefd1823b2b2ef7ee17c94bd9f0ddd', "data-version": version }, h("button", { key: '471e68d1ddcfe741f5450d002b2daa86cec0f986', class: "btn btn-icon-close", type: "button" }, h("post-icon", { key: '928fa7460988cffa269a29506e68e056f84bcef8', "aria-hidden": "true", name: "closex" }), h("span", { key: 'c1501f4a8b7d8d95be7d02576b10143b9e6b0654', class: "visually-hidden" }, h("slot", { key: 'a9f1ab8db57486d420db0981090ad2ba5183c289' })))));
     }
     get host() { return this; }
     static get style() { return PostClosebuttonStyle0; }

package/loaders/post-collapsible-trigger2.js

@@ -1,7 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { v as version } from './package.js';
-import { c as checkType } from './check-type.js';
-import { c as checkNonEmpty } from './check-non-empty.js';
+import { c as checkRequiredAndType } from './index2.js';
 import './breakpoints.js';
 import { e as eventGuard } from './event-guard.js';
 import { g as getRoot } from './get-root.js';
@@ -18,8 +17,7 @@ const PostCollapsibleTrigger = /*@__PURE__*/ proxyCustomElement(class PostCollap
      * Set the "aria-controls" and "aria-expanded" attributes on the trigger to match the state of the controlled post-collapsible
      */
     validateAriaAttributes() {
-        checkNonEmpty(this, 'for');
-        checkType(this, 'for', 'string', 'The post-collapsible-trigger "for" prop should be a id.');
+        checkRequiredAndType(this, 'for', 'string');
     }
     /**
      * Initiate a mutation observer that updates the trigger whenever necessary
@@ -98,7 +96,7 @@ const PostCollapsibleTrigger = /*@__PURE__*/ proxyCustomElement(class PostCollap
         this.updateAriaAttributes();
     }
     render() {
-        return (h(Host, { key: 'cd703fe34b8c82afc5956b58724d36b06054bc0b', "data-version": version }, h("slot", { key: '5abe4ba2b8922b941cc8aebbc7039e34e1853855' })));
+        return (h(Host, { key: '8c835c780604b1138262489ca7d3313288e5ee86', "data-version": version }, h("slot", { key: 'ef354c2ca5e699a4e2c8940959f75a69918f388c' })));
     }
     get host() { return this; }
     static get watchers() { return {

package/loaders/post-collapsible2.js

@@ -1,7 +1,7 @@
 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 { d as checkEmptyOrType } from './index2.js';
+import { a as checkEmptyOrType } from './index2.js';
 
 function isMotionReduced() {
     return IS_BROWSER ? window.matchMedia('(prefers-reduced-motion: reduce)').matches : false;
@@ -78,7 +78,7 @@ const PostCollapsible = /*@__PURE__*/ proxyCustomElement(class PostCollapsible e
         triggers.forEach(trigger => trigger.update());
     }
     render() {
-        return (h(Host, { key: 'a678bc639dfd7686d8e1bd57ca0f09984a24ab61', "data-version": version, tabindex: this.collapsed ? -1 : undefined }, h("slot", { key: 'e0b88ac152fa09314b4bc01c9abdb11480e2cb4d' })));
+        return (h(Host, { key: '130edce2062a5f3dac3072f173d021e88dddd7cf', "data-version": version, tabindex: this.collapsed ? -1 : undefined }, h("slot", { key: '54ed1790df52911b821a4de38cd5f33c425f3399' })));
     }
     get host() { return this; }
     static get watchers() { return {

package/loaders/post-footer.js

@@ -1,5 +1,6 @@
 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$5 } from './post-accordion-item2.js';
 import { d as defineCustomElement$4 } from './post-collapsible2.js';
@@ -20,6 +21,12 @@ const PostFooter$1 = /*@__PURE__*/ proxyCustomElement(class PostFooter extends H
         this.label = undefined;
         this.isMobile = breakpoint.get('name') === 'mobile';
     }
+    validateLabel() {
+        checkRequiredAndType(this, 'label', 'string');
+    }
+    componentWillLoad() {
+        this.validateLabel();
+    }
     connectedCallback() {
         window.addEventListener('postBreakpoint:name', this.breakpointChange);
     }
@@ -33,13 +40,18 @@ const PostFooter$1 = /*@__PURE__*/ proxyCustomElement(class PostFooter extends H
         return (h("div", { class: "footer-grid" }, h("div", null, h("slot", { name: "grid-1" })), h("div", null, h("slot", { name: "grid-2" })), h("div", null, h("slot", { name: "grid-3" })), h("div", null, h("slot", { name: "grid-4" }))));
     }
     render() {
-        return (h(Host, { key: '4058ba0a63a666b82d274d1c35397c97d280ba49', "data-version": version }, h("footer", { key: '27adf1e2a1439fd69efd6e571fcdd6851304c92a' }, h("h2", { key: '1ca0cd955ec5e6d315521eb5c28c5963ed44856d', class: "visually-hidden" }, this.label), h("div", { key: '27a6f520dee9d6294fa3cd4ebc6fd5062ac327ce', class: "footer-container" }, this.isMobile ? this.renderAccordion() : this.renderGrid(), h("div", { key: '5607004d5e3ea553a86d476ca459b3b3632ef12d', class: "footer-column" }, h("div", { key: 'cd4727970358ffad4ca28fffaccc8a5eab4dec27', class: "footer-socialmedia" }, h("slot", { key: '92e105af21b69640a07c2d35c24bff6aae84abb6', name: "socialmedia" })), h("div", { key: '904b787df3f192593408d99857e213143cec6706', class: "footer-app" }, h("slot", { key: '2f4ab14e20737c6035c175e58982464fe6987724', name: "app" }))), h("div", { key: 'c85b261b4ae0cb1e27f424f460fa2838e1174fb0', class: "footer-businesssectors" }, h("slot", { key: 'c66baa3a1b689d881db68448b9d72d47acd11c7c', name: "businesssectors" })), h("div", { key: '4eebc88279f29eef028766c1fcb90effc1aaf1ca', class: "footer-meta" }, h("slot", { key: 'd689d7c14af01dc13c7f9f0fd170f3974150b9aa', name: "meta" })), h("div", { key: '36f87386755a4ae1186109b46609c6ad9c1d5041', class: "footer-copyright" }, h("slot", { key: 'c37231f795b1a5a407f83aeaf8a8b093713b8db1', name: "copyright" }))))));
+        return (h(Host, { key: 'bc281bf0152baa3afd8c84cffabfa30ce1e45078', "data-version": version }, h("footer", { key: '601562fd03a55f5f6c70e562fcdbd71d33806472' }, h("h2", { key: 'e2af67c5474ea7daa0f3a2d4c6e77e474cb826be', class: "visually-hidden" }, this.label), h("div", { key: '516aaf268492edc20f360ffa6e65a6cfd523212a', class: "footer-container" }, this.isMobile ? this.renderAccordion() : this.renderGrid(), h("div", { key: '9d375ab468bc83f8618e8182f9b378eed3f2f871', class: "footer-column" }, h("div", { key: '64bf6a7bbe203e585a21744323bd9e64cee2ef4f', class: "footer-socialmedia" }, h("slot", { key: 'f8c4ab3652fdbfd48db9906ea9b0a45cd9b9f034', name: "socialmedia" })), h("div", { key: '891558211351676a8917657f69c7d51d0e8d147c', class: "footer-app" }, h("slot", { key: 'e94a1a3ab56e7aa61026efa6c011fc507906147d', name: "app" }))), h("div", { key: 'dd1d69c520d0f56882c04294695dd300ed5b77a9', class: "footer-businesssectors" }, h("slot", { key: 'f2b5e4a217263815aac8ea44b30ea05081cfce53', name: "businesssectors" })), h("div", { key: '53d5f33b34c3e4a2b3563f576a16206a63a77673', class: "footer-meta" }, h("slot", { key: 'd18780dd7543d4e50f833550fcd3976d98186e86', name: "meta" })), h("div", { key: '4e057e39bf528a931de27f70d86ee938599274d8', class: "footer-copyright" }, h("slot", { key: '0dd9926c1d7ca418260f973de6eda41726ab54c0', name: "copyright" }))))));
     }
     get host() { return this; }
+    static get watchers() { return {
+        "label": ["validateLabel"]
+    }; }
     static get style() { return PostFooterStyle0; }
 }, [1, "post-footer", {
         "label": [1],
         "isMobile": [32]
+    }, undefined, {
+        "label": ["validateLabel"]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {