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

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

@@ -1,14 +1,83 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
+var index = require('./index-CRMt-jq2.js');
+var _package = require('./package-C2pR6Vs2.js');
+var index$1 = require('./index-DtvYdwe1.js');
+require('./breakpoints-DIH5Oaz7.js');
+var placement = require('./placement-qEFR9hmI.js');
 
-const postTooltip = require('./post-tooltip-560cf42c.js');
-require('./index-b60129c4.js');
-require('./package-b731881e.js');
-require('./index-2b2b85e5.js');
-require('./breakpoints-cdf1b747.js');
-require('./placement-b2bb6ec4.js');
+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 PostTooltip = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        /**
+         * Defines the position of the tooltip relative to its trigger.
+         * Tooltips are automatically flipped to the opposite side if there is not enough available space and are shifted towards the viewport if they would overlap edge boundaries.
+         * For supported values and behavior details, see the [Floating UI placement documentation](https://floating-ui.com/docs/computePosition#placement).
+         */
+        this.placement = 'top';
+        /**
+         * Whether or not to display a little pointer arrow
+         */
+        this.arrow = false;
+        /**
+         * Indicates the open state of the tooltip
+         */
+        this.open = false;
+    }
+    validatePlacement() {
+        index$1.checkEmptyOrOneOf(this, 'placement', placement.PLACEMENT_TYPES);
+    }
+    componentWillLoad() {
+        this.validatePlacement();
+    }
+    componentDidLoad() {
+        if (!this.host.id) {
+            console.error(
+            /*prettier-ignore*/
+            'No id set: <post-tooltip> must have an id, linking it to it\'s target element with a <post-tooltip-trigger> element.');
+        }
+    }
+    /**
+     * Programmatically display the tooltip.
+     * @param target An element where the tooltip should be shown
+     */
+    async show(target) {
+        if (this.open)
+            return;
+        this.popoverRef.show(target);
+    }
+    /**
+     * Programmatically hide this tooltip.
+     */
+    async hide() {
+        this.popoverRef.hide();
+    }
+    /**
+     * Toggle tooltip display.
+     * @param target An element where the tooltip should be shown
+     * @param [force] Pass true to always show or false to always hide
+     */
+    async toggle(target, force) {
+        this.popoverRef.toggle(target, force);
+    }
+    /**
+     * Set the open state based on the toggle event.
+     * @param e Popovercontainer toggle event
+     */
+    handleToggle(e) {
+        this.open = e.detail;
+    }
+    render() {
+        const popoverClass = `${this.arrow ? 'has-arrow' : ''}`;
+        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 {
+        "placement": ["validatePlacement"]
+    }; }
+};
+PostTooltip.style = postTooltipCss;
 
-
-exports.post_tooltip = postTooltip.PostTooltip;
+exports.post_tooltip = PostTooltip;

package/dist/collection/collection-manifest.json

@@ -5,8 +5,8 @@
     "components/post-avatar/post-avatar.js",
     "components/post-back-to-top/post-back-to-top.js",
     "components/post-banner/post-banner.js",
-    "components/post-breadcrumbs/post-breadcrumbs.js",
     "components/post-breadcrumb-item/post-breadcrumb-item.js",
+    "components/post-breadcrumbs/post-breadcrumbs.js",
     "components/post-card-control/post-card-control.js",
     "components/post-closebutton/post-closebutton.js",
     "components/post-collapsible/post-collapsible.js",
@@ -29,9 +29,9 @@
     "components/post-popover/post-popover.js",
     "components/post-popovercontainer/post-popovercontainer.js",
     "components/post-rating/post-rating.js",
-    "components/post-tabs/post-tabs.js",
     "components/post-tab-header/post-tab-header.js",
     "components/post-tab-panel/post-tab-panel.js",
+    "components/post-tabs/post-tabs.js",
     "components/post-tag/post-tag.js",
     "components/post-togglebutton/post-togglebutton.js",
     "components/post-tooltip/post-tooltip.js",
@@ -39,8 +39,8 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.19.2",
-    "typescriptVersion": "5.4.5"
+    "version": "4.35.0",
+    "typescriptVersion": "5.5.4"
   },
   "collections": [],
   "bundles": []

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

@@ -1,15 +1,26 @@
+var __decorate = (this && this.__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;
+};
 import { h, Host } from "@stencil/core";
 import { version } from "../../../../package";
 import { HEADING_LEVELS } from "../../types/index";
-import { checkRequiredAndOneOf } from "../../utils/index";
-import { eventGuard } from "../../utils/event-gua"; // Import eventGuard
+import { checkRequiredAndOneOf, EventFrom } from "../../utils/index";
 /**
  * @slot default - Slot for placing post-accordion-item components.
  */
 export class PostAccordion {
     constructor() {
         this.expandedItems = new Set();
-        this.headingLevel = undefined;
+        /**
+         * If `true`, multiple `post-accordion-item` can be open at the same time.
+         */
         this.multiple = false;
     }
     validateHeadingLevel() {
@@ -25,23 +36,21 @@ export class PostAccordion {
         this.validateHeadingLevel();
     }
     collapseToggleHandler(event) {
-        eventGuard(this.host, event, { targetLocalName: 'post-accordion-item', delegatorSelector: 'post-accordion' }, () => {
-            const toggledAccordionItem = event.target;
-            const isClosing = this.expandedItems.has(toggledAccordionItem);
-            if (isClosing) {
-                this.expandedItems.delete(toggledAccordionItem);
-            }
-            else {
-                this.expandedItems.add(toggledAccordionItem);
-            }
-            if (this.multiple || isClosing)
-                return;
-            // Close other open accordion items to ensure only one is open at a time
-            Array.from(this.expandedItems.values())
-                .filter(item => item !== toggledAccordionItem)
-                .forEach(item => {
-                item.toggle(false);
-            });
+        const toggledAccordionItem = event.target;
+        const isClosing = this.expandedItems.has(toggledAccordionItem);
+        if (isClosing) {
+            this.expandedItems.delete(toggledAccordionItem);
+        }
+        else {
+            this.expandedItems.add(toggledAccordionItem);
+        }
+        if (this.multiple || isClosing)
+            return;
+        // Close other open accordion items to ensure only one is open at a time
+        Array.from(this.expandedItems.values())
+            .filter(item => item !== toggledAccordionItem)
+            .forEach(item => {
+            item.toggle(false);
         });
     }
     /**
@@ -88,7 +97,7 @@ export class PostAccordion {
         });
     }
     render() {
-        return (h(Host, { key: '7057a6926f2279f7fc86d7f8539dd3ca884a3d70', "data-version": version }, h("div", { key: 'a6d337471d1d16c09d7e6af950d39c58fc6f2880', class: "accordion" }, h("slot", { key: '9687babb4b539f6e54468555b4057a2b378e1e10', onSlotchange: () => this.registerAccordionItems() }))));
+        return (h(Host, { key: 'ab800b580f0dd591a9413305afa282ff7e697759', "data-version": version }, h("div", { key: '258ba1dc99811545c0dd9796ef521a05a0c87dda', class: "accordion" }, h("slot", { key: '2ad7482962316723f5c8ff334bad7cc33b6fa953', onSlotchange: () => this.registerAccordionItems() }))));
     }
     static get is() { return "post-accordion"; }
     static get encapsulation() { return "shadow"; }
@@ -106,6 +115,7 @@ export class PostAccordion {
         return {
             "headingLevel": {
                 "type": "number",
+                "attribute": "heading-level",
                 "mutable": false,
                 "complexType": {
                     "original": "HeadingLevel",
@@ -124,11 +134,13 @@ export class PostAccordion {
                     "tags": [],
                     "text": "Defines the hierarchical level of the `post-accordion-item` headers within the headings structure."
                 },
-                "attribute": "heading-level",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "multiple": {
                 "type": "boolean",
+                "attribute": "multiple",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -141,7 +153,8 @@ export class PostAccordion {
                     "tags": [],
                     "text": "If `true`, multiple `post-accordion-item` can be open at the same time."
                 },
-                "attribute": "multiple",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             }
@@ -223,3 +236,6 @@ export class PostAccordion {
             }];
     }
 }
+__decorate([
+    EventFrom('post-accordion-item')
+], PostAccordion.prototype, "collapseToggleHandler", null);

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

@@ -1,7 +1,17 @@
+var __decorate = (this && this.__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;
+};
 import { h, Host } from "@stencil/core";
 import { version } from "../../../../package";
 import { HEADING_LEVELS } from "../../types/index";
-import { checkEmptyOrOneOf, eventGuard } from "../../utils/index";
+import { checkEmptyOrOneOf, EventFrom } from "../../utils/index";
 import { nanoid } from "nanoid";
 /**
  * @part button - The pseudo-element, used to override styles on the components internal header `button` element.
@@ -12,10 +22,10 @@ import { nanoid } from "nanoid";
  */
 export class PostAccordionItem {
     constructor() {
-        this.id = undefined;
-        this.slottedLogo = undefined;
+        /**
+         * If `true`, the element is collapsed otherwise it is displayed.
+         */
         this.collapsed = false;
-        this.headingLevel = undefined;
     }
     validateHeadingLevel() {
         checkEmptyOrOneOf(this, 'headingLevel', HEADING_LEVELS);
@@ -28,9 +38,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-accordion-item', delegatorSelector: 'post-accordion-item' }, () => {
-            this.collapsed = !event.detail;
-        });
+        this.collapsed = !event.detail;
     }
     /**
      * Triggers the collapse programmatically.
@@ -47,10 +55,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: '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: {
+        return (h(Host, { key: 'd7176f314fa0f907bd5b69555a2f25561f3875cf', id: this.id, "data-version": version }, h("div", { key: '978c451798e5bafe38ef57be29818f02ccf49dab', part: "accordion-item", class: "accordion-item" }, h("post-collapsible-trigger", { key: '615da8a2ad5fb3c3fd1e5e0c2c8ee9a260a34263', for: `${this.id}--collapse` }, h(HeadingTag, { key: '9c270ded36f1e1b1b466ba8c4ca529ab26368d5c', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: 'ddf278d1ccf6d78932ae4c6a9617d5852fb73064', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "button" }, h("span", { key: '3989145bdbe0a313c6ed10220d2089c89688d613', class: {
                 'logo-container': true,
                 'has-image': !!this.slottedLogo,
-            } }, 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' }))))));
+            } }, h("slot", { key: 'dd053bf73234db3bac772bf730003b4f2cc030cb', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: '9ac06513d55828a9d7a3552aa66c9946fde7c793', name: "header" }), h("post-icon", { key: 'fb46c528581e1a149706fd9e124857cc288747f8', name: "2051" })))), h("post-collapsible", { key: '996887d6a0098a37dbac8d5edb950900f57d15f7', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: '21fa64a007cf0da4e0c0cf56f5862641d016517a', class: "accordion-body", part: "body" }, h("slot", { key: '2a9f7731183e35c37523e079d437612dbda1a01b' }))))));
     }
     static get is() { return "post-accordion-item"; }
     static get encapsulation() { return "shadow"; }
@@ -68,6 +76,7 @@ export class PostAccordionItem {
         return {
             "collapsed": {
                 "type": "boolean",
+                "attribute": "collapsed",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -80,12 +89,14 @@ export class PostAccordionItem {
                     "tags": [],
                     "text": "If `true`, the element is collapsed otherwise it is displayed."
                 },
-                "attribute": "collapsed",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "headingLevel": {
                 "type": "number",
+                "attribute": "heading-level",
                 "mutable": false,
                 "complexType": {
                     "original": "HeadingLevel",
@@ -107,7 +118,8 @@ export class PostAccordionItem {
                         }],
                     "text": "Defines the hierarchical level of the accordion item header within the headings structure."
                 },
-                "attribute": "heading-level",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };
@@ -160,3 +172,6 @@ export class PostAccordionItem {
             }];
     }
 }
+__decorate([
+    EventFrom('post-accordion-item')
+], PostAccordionItem.prototype, "onCollapseToggle", null);

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

@@ -19,11 +19,6 @@ var AvatarType;
  */
 export class PostAvatar {
     constructor() {
-        this.firstname = undefined;
-        this.lastname = undefined;
-        this.userid = undefined;
-        this.email = undefined;
-        this.slottedImage = undefined;
         this.avatarType = null;
         this.imageUrl = '';
         this.imageAlt = '';
@@ -159,6 +154,7 @@ export class PostAvatar {
         return {
             "firstname": {
                 "type": "string",
+                "attribute": "firstname",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -171,11 +167,13 @@ export class PostAvatar {
                     "tags": [],
                     "text": "Defines the users firstname."
                 },
-                "attribute": "firstname",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "lastname": {
                 "type": "string",
+                "attribute": "lastname",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -188,11 +186,13 @@ export class PostAvatar {
                     "tags": [],
                     "text": "Defines the users lastname."
                 },
-                "attribute": "lastname",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "userid": {
                 "type": "string",
+                "attribute": "userid",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -205,11 +205,13 @@ export class PostAvatar {
                     "tags": [],
                     "text": "Defines the company internal userId.<div className=\"mb-4 banner banner-warning banner-sm\">Can only be used on post.ch domains!</div>"
                 },
-                "attribute": "userid",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "email": {
                 "type": "string",
+                "attribute": "email",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -222,7 +224,8 @@ export class PostAvatar {
                     "tags": [],
                     "text": "Defines the users email address associated with a gravatar profile picture."
                 },
-                "attribute": "email",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

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

@@ -4,11 +4,10 @@ import { version } from "../../../../package";
 import { checkRequiredAndType } from "../../utils/index";
 export class PostBackToTop {
     constructor() {
+        this.belowFold = false;
         this.handleScroll = () => {
             this.belowFold = this.isBelowFold();
         };
-        this.label = undefined;
-        this.belowFold = false;
     }
     isBelowFold() {
         return window.scrollY > window.innerHeight;
@@ -90,6 +89,7 @@ export class PostBackToTop {
         return {
             "label": {
                 "type": "string",
+                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -102,7 +102,8 @@ export class PostBackToTop {
                     "tags": [],
                     "text": "The label of the back-to-top button, intended solely for accessibility purposes.\nThis label is always hidden from view."
                 },
-                "attribute": "label",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             }
         };

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

@@ -12,13 +12,14 @@ import { nanoid } from "nanoid";
 export class PostBanner {
     constructor() {
         this.bannerId = `p${nanoid(6)}`;
-        this.classes = undefined;
-        this.hasActions = undefined;
-        this.hasHeading = undefined;
         this.onDismissButtonClick = () => this.dismiss();
+        /**
+         * If `true`, a close button (×) is displayed and the banner can be dismissed by the user.
+         */
         this.dismissible = false;
-        this.dismissLabel = undefined;
-        this.icon = undefined;
+        /**
+         * The type of the banner.
+         */
         this.type = 'neutral';
     }
     checkDismissible() {
@@ -86,6 +87,7 @@ export class PostBanner {
         return {
             "dismissible": {
                 "type": "boolean",
+                "attribute": "dismissible",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -98,12 +100,14 @@ export class PostBanner {
                     "tags": [],
                     "text": "If `true`, a close button (\u00D7) is displayed and the banner can be dismissed by the user."
                 },
-                "attribute": "dismissible",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "dismissLabel": {
                 "type": "string",
+                "attribute": "dismiss-label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -116,11 +120,13 @@ export class PostBanner {
                     "tags": [],
                     "text": "The label to use for the close button of a dismissible banner."
                 },
-                "attribute": "dismiss-label",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "icon": {
                 "type": "string",
+                "attribute": "icon",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -133,11 +139,13 @@ export class PostBanner {
                     "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."
                 },
-                "attribute": "icon",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "BannerType",
@@ -156,7 +164,8 @@ export class PostBanner {
                     "tags": [],
                     "text": "The type of the banner."
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'neutral'"
             }

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

@@ -5,10 +5,6 @@ import { checkEmptyOrUrl } from "../../utils/index";
  * @slot default - Slot for placing the text inside the breadcrumb item.
  */
 export class PostBreadcrumbItem {
-    constructor() {
-        this.url = undefined;
-        this.fullUrl = undefined;
-    }
     validateUrl() {
         try {
             this.validUrl = this.constructUrl(this.url);
@@ -41,7 +37,7 @@ export class PostBreadcrumbItem {
     }
     render() {
         const BreadcrumbTag = this.validUrl ? 'a' : 'span';
-        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' }))));
+        return (h(Host, { key: '872c34ab9464ab8c48ad3e3f8af3f44b4c3dcd54', "data-version": version }, h("post-icon", { key: '7637ec79d84bb72ed8066789f3e5b07925e1ca9a', name: "2111", class: "breadcrumb-item-icon" }), h(BreadcrumbTag, { key: 'fd3f54306a49821af4267596a308f6043d4d4ac3', class: "breadcrumb-item", ...(this.validUrl ? { href: this.validUrl } : {}), onKeyDown: event => this.handleKeyDown(event) }, h("slot", { key: '09e41b58cba991ec5ce4e15aa248aba49f459592' }))));
     }
     static get is() { return "post-breadcrumb-item"; }
     static get encapsulation() { return "shadow"; }
@@ -59,6 +55,7 @@ export class PostBreadcrumbItem {
         return {
             "url": {
                 "type": "string",
+                "attribute": "url",
                 "mutable": false,
                 "complexType": {
                     "original": "string | URL",
@@ -76,7 +73,8 @@ export class PostBreadcrumbItem {
                     "tags": [],
                     "text": "The optional URL to which the breadcrumb item will link."
                 },
-                "attribute": "url",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

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

@@ -1 +1 @@
-@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{display:flex;align-items:center}.breadcrumbs-nav{display:flex;align-items:center}.hidden-items{gap:var(--post-device-spacing-gap-inline-4);position:absolute;height:0;overflow:hidden;white-space:nowrap}.breadcrumbs-list{display:flex;flex-wrap:nowrap;position:relative;margin:0;padding:0;list-style:none;align-items:center;height:100%;gap:var(--post-device-spacing-gap-inline-4)}post-icon{display:inline-block;box-sizing:border-box;color:var(--post-scheme-color-interactive-primary-enabled-fg1);height:var(--post-core-dimension-24);width:var(--post-core-dimension-24)}.breadcrumb-item-icon{padding-block:var(--post-core-dimension-4);padding-inline:var(--post-core-dimension-4)}li a{display:flex;align-items:center}li a{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}li a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){li a:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}li a:focus{border-radius:var(--post-device-border-radius-focus)}li a .home-icon{padding-block:var(--post-device-spacing-padding-4);padding-inline:var(--post-device-spacing-padding-4)}li a .home-icon:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a .home-icon a,li a .home-icon:focus,li a .home-icon:hover{color:CanvasText !important}}.menu-trigger-wrapper{display:flex;align-items:center;gap:var(--post-device-spacing-gap-inline-5)}.actual-menu{display:flex;align-items:center}post-menu-trigger{display:flex;align-items:center;padding-block:var(--post-device-spacing-padding-block-7)}post-menu-trigger{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}post-menu-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-menu-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-menu-trigger:focus{border-radius:var(--post-device-border-radius-focus)}post-menu-trigger button{background:none;border:none;line-height:150%;font-size:var(--post-device-font-size-6);cursor:pointer;padding:0;color:var(--post-scheme-color-interactive-primary-enabled-fg1)}post-menu-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger button a,post-menu-trigger button:focus,post-menu-trigger button:hover{color:LinkText !important}}post-menu::part(popover-container){display:flex;flex-direction:column;align-items:start;padding:.6rem;gap:var(--post-device-spacing-gap-inline-4)}post-menu::part(popover-container) ::slotted(post-menu-item:not(:last-child)){margin-block-end:var(--post-device-spacing-gap-inline-4)}.breadcrumb-item{display:flex;align-items:center;justify-content:center;gap:var(--post-device-spacing-gap-inline-5)}.breadcrumb-item a{text-decoration:none;color:var(--post-scheme-color-surface-default-fg);line-height:150%;padding-block:var(--post-device-spacing-padding-block-7);font-size:var(--post-device-font-size-6)}.breadcrumb-item a{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}.breadcrumb-item a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.breadcrumb-item a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){.breadcrumb-item a:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.breadcrumb-item a:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}.breadcrumb-item a:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1);text-decoration:var(--post-core-text-decoration-underline)}.breadcrumb-item a:focus-visible{border-radius:var(--post-device-border-radius-focus)}.breadcrumb-item span:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1);text-decoration:var(--post-core-text-decoration-underline)}.breadcrumb-item span:focus-visible{border-radius:var(--post-device-border-radius-focus)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.breadcrumb-item a,.breadcrumb-item:focus,.breadcrumb-item:hover{color:LinkText !important}.breadcrumb-item:visited{color:VisitedText !important}}post-breadcrumb-item:last-of-type{pointer-events:none;color:var(--post-scheme-color-interactive-primary-selected-fg1);font-weight:var(--post-device-font-weight-bold);text-decoration:var(--post-core-text-decoration-none)}post-breadcrumb-item:last-of-type:hover{color:var(--post-scheme-color-interactive-primary-selected-fg1);text-decoration:none}.visually-hidden{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}.visually-hidden:not(caption){position:absolute !important}
+@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{display:flex;align-items:center}.breadcrumbs-nav{display:flex;align-items:center}.hidden-items{gap:var(--post-device-spacing-gap-inline-4);position:absolute;height:0;overflow:hidden;white-space:nowrap}.breadcrumbs-list{display:flex;flex-wrap:nowrap;position:relative;margin:0;padding:0;list-style:none;align-items:center;height:100%;gap:var(--post-device-spacing-gap-inline-4)}post-icon{display:inline-block;box-sizing:border-box;color:var(--post-scheme-color-interactive-primary-enabled-fg1);height:var(--post-core-dimension-24);width:var(--post-core-dimension-24)}.breadcrumb-item-icon{padding-block:var(--post-core-dimension-4);padding-inline:var(--post-core-dimension-4)}li a{display:flex;align-items:center}li a{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}li a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){li a:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}li a:focus{border-radius:var(--post-device-border-radius-focus)}li a .home-icon{padding-block:var(--post-device-spacing-padding-4);padding-inline:var(--post-device-spacing-padding-4)}li a .home-icon:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){li a .home-icon a,li a .home-icon:focus,li a .home-icon:hover{color:CanvasText !important}}.menu-trigger-wrapper{display:flex;align-items:center;gap:var(--post-device-spacing-gap-inline-5)}.actual-menu{display:flex;align-items:center}post-menu-trigger{display:flex;align-items:center;padding-block:var(--post-device-spacing-padding-block-7)}post-menu-trigger{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}post-menu-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger:is(:focus-visible,:has(:focus-visible),.pretend-focus){outline-color:Highlight !important}}@supports not selector(:has(:focus-visible)){post-menu-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-style:var(--post-core-border-style-solid) !important}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger:is(:focus-visible,:focus-within,.pretend-focus){outline-color:Highlight !important}}}post-menu-trigger:focus{border-radius:var(--post-device-border-radius-focus)}post-menu-trigger button{background:none;border:none;line-height:150%;font-size:var(--post-device-font-size-6);cursor:pointer;padding:0;color:var(--post-scheme-color-interactive-primary-enabled-fg1)}post-menu-trigger button:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){post-menu-trigger button a,post-menu-trigger button:focus,post-menu-trigger button:hover{color:LinkText !important}}post-menu::part(popover-container){display:flex;flex-direction:column;align-items:start;padding:.6rem;gap:var(--post-device-spacing-gap-inline-4)}post-menu::part(popover-container) ::slotted(post-menu-item:not(:last-child)){margin-block-end:var(--post-device-spacing-gap-inline-4)}.breadcrumb-item{display:flex;align-items:center;justify-content:center;gap:var(--post-device-spacing-gap-inline-5)}.breadcrumb-item span:hover{color:var(--post-scheme-color-interactive-primary-hover-fg1);text-decoration:var(--post-core-text-decoration-underline)}.breadcrumb-item span:focus-visible{border-radius:var(--post-device-border-radius-focus)}@media(forced-colors: active),(-ms-high-contrast: active),(-ms-high-contrast: white-on-black){.breadcrumb-item a,.breadcrumb-item:focus,.breadcrumb-item:hover{color:LinkText !important}.breadcrumb-item:visited{color:VisitedText !important}}post-breadcrumb-item:last-of-type{pointer-events:none;color:var(--post-scheme-color-interactive-primary-selected-fg1);font-weight:var(--post-device-font-weight-bold);text-decoration:var(--post-core-text-decoration-none)}post-breadcrumb-item:last-of-type:hover{color:var(--post-scheme-color-interactive-primary-selected-fg1);text-decoration:none}.visually-hidden{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}.visually-hidden:not(caption){position:absolute !important}