@swisspost/design-system-components 10.0.0-next.75 → 10.0.0-next.76

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

@@ -25,9 +25,6 @@ export class PostAccordionItem {
          */
         this.collapsed = false;
     }
-    componentWillLoad() {
-        this.id = this.host.id || `p${nanoid(6)}`;
-    }
     // Capture to make sure the "collapsed" property is updated before the event is consumed
     onCollapseToggle(event) {
         this.collapsed = !event.detail;
@@ -45,12 +42,13 @@ export class PostAccordionItem {
         this.slottedLogo = this.host.querySelector('img[slot="logo"]');
     }
     render() {
+        const collapsibleId = `c${nanoid(6)}`;
         const headingLevel = this.host.closest('post-accordion')?.getAttribute('heading-level');
-        const HeadingTag = `h${headingLevel ?? this.headingLevel ?? 2}`;
-        return (h(Host, { key: '67b3be2ea798d007c3c05fafaa95d447bd3245b4', id: this.id, "data-version": version }, h("post-collapsible-trigger", { key: '2c545ead0717cefef325576125b548db4c7d6e11', for: `${this.id}--collapse` }, h(HeadingTag, { key: '82840144efc0588a73f5aaa734e1492acccd498e', class: "accordion-header", id: `${this.id}--header` }, h("button", { key: 'bfd05c00e2df07800a20a9e0b69e6b918d80085d', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "post-accordion-button" }, h("span", { key: 'af2e574d4e521316f9d5e4da040d777e0384c783', class: {
+        const HeadingTag = `h${headingLevel ?? 2}`;
+        return (h(Host, { key: 'b9699596d57887d99214c6f163355535c68eae1a', "data-version": version }, h("post-collapsible-trigger", { key: 'ebd7c9d6bf2bc35d548867edc8766e31125d8509', for: collapsibleId }, h(HeadingTag, { key: '93806261d7dba93569b09d37dff0c01b4f29268b', class: "accordion-header" }, h("button", { key: '785a4bcff2c6705aade9b045e1176d43a2ef202b', type: "button", class: `accordion-button${this.collapsed ? ' collapsed' : ''}`, part: "post-accordion-button" }, h("span", { key: '87f8ba7f7ebe2ba851b6dc134656296820c467d0', class: {
                 'logo-container': true,
                 'has-image': !!this.slottedLogo,
-            } }, h("slot", { key: '178cf7d6e26f52d8fe2fc15ef026db4bd51ff70c', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: 'c160f107a8bc7be52a538f6f19ffaa25fa4a729d', name: "header" }), h("post-icon", { key: '19d621e055e1973d1a0e3e7cb750a88101f962d3', name: "chevronup" })))), h("post-collapsible", { key: 'f0ff63e67476cc05467db907e010cd1c026aa044', id: `${this.id}--collapse`, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: '73418485496fa27ecc98e068317e39cea6dd8f2b', class: "accordion-body", part: "post-accordion-body" }, h("slot", { key: '7a0e5d6c3b8da2e3170b5e47104d3ff4509b2040' })))));
+            } }, h("slot", { key: '146256cb174f5895b25fd8f44464ca32fba6b6ee', name: "logo", onSlotchange: this.onSlotLogoChange.bind(this) })), h("slot", { key: 'd742ef89a88280f85c7da697536d4ad2ff825f0b', name: "header" }), h("post-icon", { key: 'f83e438c9d504ebaa0066df81b6f74ec14dcb08a', name: "chevronup" })))), h("post-collapsible", { key: '179f36eab7ebdb9faa909a70eb43e1d78503e6e1', id: collapsibleId, collapsed: this.collapsed, ref: el => (this.collapsible = el) }, h("div", { key: 'e93c3570cf76c971b49bf28d3d5540ac289b2469', class: "accordion-body", part: "post-accordion-body" }, h("slot", { key: 'db26c35edb371cb855141b6f7552d96ea10e06a4' })))));
     }
     static get is() { return "post-accordion-item"; }
     static get encapsulation() { return "shadow"; }
@@ -85,41 +83,11 @@ export class PostAccordionItem {
                 "reflect": true,
                 "attribute": "collapsed",
                 "defaultValue": "false"
-            },
-            "headingLevel": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "HeadingLevel",
-                    "resolved": "1 | 2 | 3 | 4 | 5 | 6",
-                    "references": {
-                        "HeadingLevel": {
-                            "location": "import",
-                            "path": "@/types",
-                            "id": "src/types/index.ts::HeadingLevel",
-                            "referenceLocation": "HeadingLevel"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [{
-                            "name": "deprecated",
-                            "text": "set the `heading-level` property on the parent `post-accordion` instead."
-                        }],
-                    "text": "Defines the hierarchical level of the accordion item header within the headings structure."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "heading-level"
             }
         };
     }
     static get states() {
         return {
-            "id": {},
             "slottedLogo": {}
         };
     }

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

@@ -199,7 +199,7 @@ export class PostAutocomplete {
         this.outputElement.textContent = this.textAvailableSuggestions.replace('{count}', String(count));
     }
     render() {
-        return (h(Host, { key: 'd8f594b17240359b03d1e443d0f8ea28a1a5f687', "data-version": version }, h("slot", { key: 'b76771582cdfb4f84e6018551508daaa5e5c91c5' }), this.clearable && this.inputValue && (h("button", { key: 'ff6255a9b10df6609703bfa302d519b52931786e', type: "button", class: "autocomplete-clear", onClick: this.clearInput }, h("post-icon", { key: '3c7da3532ae720ab6f392a8de8b2ca21e4b092aa', "aria-hidden": "true", name: "closex" }))), h("post-icon", { key: 'd2a3c04b68a3b9b3303b80f37292578c5182157e', "aria-hidden": "true", class: "autocomplete-icon", name: "chevronDown" }), h("output", { key: '187a75fa1e1935a372521c57f75c6740f330f891', class: "visually-hidden", ref: el => (this.outputElement = el) })));
+        return (h(Host, { key: 'a88d1a65adcbe0603dc2c7ccf5900ae49dbe8edc', "data-version": version }, h("slot", { key: 'ff4724e2e298a38020c4eb93b2b9a38d811274b8' }), this.clearable && this.inputValue && (h("button", { key: '6a5f67d5376bdb0d261fd687ad29dd32d4f3be36', type: "button", class: "autocomplete-clear", onClick: this.clearInput }, h("post-icon", { key: '5b123fa4dbd581ebbba96f820b30d9d266b69b7d', "aria-hidden": "true", name: "closex" }))), h("post-icon", { key: '9d3fcaf73cfff3e17d440e7add858482e48a12a7', "aria-hidden": "true", class: "autocomplete-icon", name: "chevronDown" }), h("output", { key: '9c894f8ea34ffcc8b8c741216679ffbbd7b866bf', class: "visually-hidden", ref: el => (this.outputElement = el) })));
     }
     static get is() { return "post-autocomplete"; }
     static get encapsulation() { return "shadow"; }

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

@@ -126,7 +126,7 @@ export class PostAvatar {
             .join('')
             .trim();
         const fullname = names.join(' ');
-        return (h(Host, { key: '85af49f5beca48bec805f9c126e635b8b1042de3', "data-version": version }, h("span", { key: '950d20eeb38eae131bd2e459741ab03f7208ec37', class: this.avatarType === 'slotted' ? '' : 'd-none' }, h("slot", { key: '5404e8d04de78e9c95d7b7e0b1dbb42fb6afc3e6', onSlotchange: this.slotChanged.bind(this) })), this.avatarType === 'image' && h("img", { key: '0d9c7b0f74e99072544eaa94b408d8e70f5cef57', src: this.imageUrl, alt: this.imageAlt }), this.avatarType === 'initials' && (h("span", { key: 'e7260e54f5510707b19016badad66920df6b38f0', class: "initials" }, initials, h("span", { key: '647fe23a98a1338936ce701024bae944d6cce7ae' }, this.description ?? fullname)))));
+        return (h(Host, { key: 'ba9c39d64f6a1b77131ba8c603c9be3aad113c53', "data-version": version }, h("span", { key: '27a9ac87e8978fabf1717f3eb978e39d06670507', class: this.avatarType === 'slotted' ? '' : 'd-none' }, h("slot", { key: '3fa13670176f2fc3a79a8b11659962f433c37c2e', onSlotchange: this.slotChanged.bind(this) })), this.avatarType === 'image' && h("img", { key: '232099852c2ad8f2c4660eb1077c6d618092cdca', src: this.imageUrl, alt: this.imageAlt }), this.avatarType === 'initials' && (h("span", { key: 'e6b3bf751a95997a2abef2a16dcd8e2c78d308fa', class: "initials" }, initials, h("span", { key: '8d869a374678094e2ec5abc146b0b981c9079c15' }, this.description ?? fullname)))));
     }
     static get is() { return "post-avatar"; }
     static get encapsulation() { return "shadow"; }

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

@@ -79,7 +79,7 @@ export class PostBackToTop {
         window.removeEventListener('scroll', this.handleScroll);
     }
     render() {
-        return (h(Host, { key: 'b4fb2fd83336752a5c67ab9ded8a20b871b8f967', "data-version": version }, h("button", { key: 'cdee4a23f45f9293ac0da814f97df8bda73028ef', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, h("post-icon", { key: '91e2be9b6c5dcd2b8e11aec4ff839de259d47a13', "aria-hidden": "true", name: "arrowup" }), h("span", { key: '0bee6a5151a4919ddffc436924a8a494650b069a', class: "visually-hidden" }, this.textBackToTop))));
+        return (h(Host, { key: '3d976e4e1a8ac4b72041369d5667c55d915d7118', "data-version": version }, h("button", { key: '7ceb4953248ca934a905ec63444934e9e6c09e43', class: "back-to-top", "aria-hidden": this.belowFold ? 'false' : 'true', tabindex: this.belowFold ? '0' : '-1', onClick: this.scrollToTop }, h("post-icon", { key: '89a2bc9a8278fb45d3fb915ec096ee94b3841edd', "aria-hidden": "true", name: "arrowup" }), h("span", { key: 'fc2517fba7599f37c3054b638afd6b9b2ba7e32a', class: "visually-hidden" }, this.textBackToTop))));
     }
     static get is() { return "post-back-to-top"; }
     static get encapsulation() { return "shadow"; }

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

@@ -53,7 +53,7 @@ export class PostBanner {
         this.hasActions = this.host.querySelectorAll('[slot="actions"]').length > 0;
     }
     render() {
-        return (h(Host, { key: '97695d768495db6f56d797d58d94db4b935c5436', "data-version": version, role: "alert", "data-color-scheme": "light" }, h("slot", { key: 'd60d826952da373557af9b2362cd26f2e246796e', name: "close-button" }), h("div", { key: '19e59cd3b7c476bad9d51e78ea970d0ee051dbb9', class: "post-banner-content" }, h("slot", { key: '715eee4468837ab5e26eec6394baa73db7053ead', name: "heading" }), h("slot", { key: 'decd8bec6f456fb833748d511e01dff938297b86' }), this.hasActions && (h("div", { key: '32642ba0a026f820de59388b702d077c6852f85a', class: "actions" }, h("slot", { key: '77082e9c4ee3566ec4726fa6461b9a031a394868', name: "actions" }))))));
+        return (h(Host, { key: 'afa4834733c7e9d985d2102a3e421f09f94b44ba', "data-version": version, role: "alert", "data-color-scheme": "light" }, h("slot", { key: '39dfccec7bf829ff354bac467a9b399e003ce473', name: "close-button" }), h("div", { key: 'e6dfc60165185da4384c4143153ee34db1299088', class: "post-banner-content" }, h("slot", { key: '9fc1e8e81cf396eb1ae1e5dfff7f04ccc6443986', name: "heading" }), h("slot", { key: 'e7d21db6f7feb1507c612319c3d56595b797a3c4' }), this.hasActions && (h("div", { key: 'd4229d09accb5cfb2a096c44ca523a132da4755d', class: "actions" }, h("slot", { key: 'b01633122bd45df2f95b7ee5e4694a83aceb68bd', name: "actions" }))))));
     }
     static get is() { return "post-banner"; }
     static get encapsulation() { return "shadow"; }

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

@@ -95,7 +95,7 @@ export class PostBreadcrumbs {
         return (h("div", { role: "listitem" }, h("div", { class: "breadcrumb-item" }, h("post-menu-trigger", { for: menuId }, h("button", null, h("span", { class: "visually-hidden" }, this.textMoreItems), h("span", { "aria-hidden": "true" }, "...")))), h("post-menu", { id: menuId, label: this.textMoreItems, placement: "bottom-start" }, h("slot", null))));
     }
     render() {
-        return (h(Host, { key: '8a3c4436b22c3f3d2454b61ff5ce4d4e11bed697', "data-version": version }, h("nav", { key: '5e13b27f36e2ffcade42416d2864177a7cd6ed29', "aria-label": this.textBreadcrumbs }, h("div", { key: '4b5aca825afe3be81913c0d67e748164b2d9123c', role: "list" }, h("div", { key: 'a3aa906e91046fe6779ea5cae8db5499800229e1', class: "breadcrumb-item home", role: "listitem" }, h("a", { key: 'a086c73567696a9da8fe5af8a9fbe4b80f4d4d91', href: this.homeUrl }, h("span", { key: '814f6c145c9f19db46fa3d4cddaac59d4518677f', class: "visually-hidden" }, this.textHome), h("post-icon", { key: '5096b9b77e0a4e6c21baec26b7c26614110c53f1', "aria-hidden": "true", name: "home" }))), this.shouldRenderMenu ? this.renderMenu() : h("slot", null), h("slot", { key: '561cef4586098f87688f5b9ad2a34b7a27bf0313', name: "selected" })))));
+        return (h(Host, { key: 'b6ac788d29127c030f4b1955c41a7d6e2ac8a346', "data-version": version }, h("nav", { key: 'a7c081b3b4d991cdab30b2ca424c47b7231484cd', "aria-label": this.textBreadcrumbs }, h("div", { key: 'c51606af26b874e66376afa2b7855b400368af85', role: "list" }, h("div", { key: '88a33d5554b807252b1d89ef6ce3a611dd7e5014', class: "breadcrumb-item home", role: "listitem" }, h("a", { key: 'f0fdbff28d44944d18497bf1be12bd22a1281778', href: this.homeUrl }, h("span", { key: '4d16bbe0565dfdd1764027db43cf4c61849f9159', class: "visually-hidden" }, this.textHome), h("post-icon", { key: '86611c819469da07c965c29db3510843e685e449', "aria-hidden": "true", name: "home" }))), this.shouldRenderMenu ? this.renderMenu() : h("slot", null), h("slot", { key: 'cb4a22117596bc8f3f9df72e62564b48c1d88975', name: "selected" })))));
     }
     static get is() { return "post-breadcrumbs"; }
     static get encapsulation() { return "shadow"; }

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

@@ -60,7 +60,7 @@ export class PostClosebutton {
         this.host.closest('dialog')?.close();
     }
     render() {
-        return (h(Host, { key: '55ec088421d5529b109a183b681a6e25e0fe9062', "data-version": version }, h("button", { key: '21e5bc2d1e305023530298c3750b4b8bb3f9705f', type: this.buttonType, class: "btn btn-icon btn-secondary btn-sm", onClick: () => this.handleClick() }, h("post-icon", { key: '456592d307bb7495712a645c234993ec1b5ec080', "aria-hidden": "true", name: "closex" }), h("span", { key: 'cea199698c413c94e12673df7b0769797f4d4f96', ref: el => (this.visuallyHidden = el), class: "visually-hidden" }, h("slot", { key: '7f9394eae2f4deb614f2aaac1dc697bec592d6db' })))));
+        return (h(Host, { key: '22ac2b07e9a8a8f8d157423fea1bcedb2c4f9b11', "data-version": version }, h("button", { key: '91eb413a2546f131e4c97c28340374addbf2c7a7', type: this.buttonType, class: "btn btn-icon btn-secondary btn-sm", onClick: () => this.handleClick() }, h("post-icon", { key: '02202b3df2e5830aeb267921c924c1e75508d546', "aria-hidden": "true", name: "closex" }), h("span", { key: 'c691c845dd58b4f975c33791d29518428ade6ee8', ref: el => (this.visuallyHidden = el), class: "visually-hidden" }, h("slot", { key: '3fd42b82ef1d1ea76343e0c69f421a2916c26006' })))));
     }
     static get is() { return "post-closebutton"; }
     static get encapsulation() { return "shadow"; }

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

@@ -66,7 +66,7 @@ export class PostCollapsible {
         triggers.forEach(trigger => trigger.update());
     }
     render() {
-        return (h(Host, { key: '7a1dc10a27c1432342ac24e95e000a469b2bf509', "data-version": version, tabindex: this.collapsed ? -1 : undefined, style: this.collapsed ? collapsedKeyframe : undefined }, h("slot", { key: '51c156d51e4191d3dd6dd93b37317c02d9737bf9' })));
+        return (h(Host, { key: '709d3f49d65324984e0aef09068cbc7c52299dcc', "data-version": version, tabindex: this.collapsed ? -1 : undefined, style: this.collapsed ? collapsedKeyframe : undefined }, h("slot", { key: 'c278bdbac8e10e9169a69ffe3037325016cc3fcb' })));
     }
     static get is() { return "post-collapsible"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-collapsible-trigger/post-collapsible-trigger.js

@@ -104,7 +104,7 @@ export class PostCollapsibleTrigger {
         this.updateAriaAttributes();
     }
     render() {
-        return (h(Host, { key: 'bc4bdfbfa942e0a70d0f7af3b0d33eed4341ebb6', "data-version": version }, h("slot", { key: '8770e4a22cbb06c39e1c94e2e358256c1a5509f7' })));
+        return (h(Host, { key: 'a62109f3d0490576da241fba140f0e32d37411e8', "data-version": version }, h("slot", { key: '4f56c5761fce00e350febdcf80c36ea5b94fd037' })));
     }
     static get is() { return "post-collapsible-trigger"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/post-date-picker/accessibility-utils.js

@@ -0,0 +1,59 @@
+/**
+ * Add role and aria-label to each grid cell based on its type.
+ * @param data The render cell data from AirDatepicker.
+ * @param localeCode The BCP 47 locale code for formatting.
+ * @returns An object with `attrs` to apply to the cell element.
+ */
+export function renderCellAccessibility({ date, cellType }, localeCode) {
+    if (cellType === 'day') {
+        return {
+            attrs: {
+                'role': 'gridcell',
+                'aria-label': date.toLocaleDateString(localeCode, {
+                    weekday: 'long',
+                    year: 'numeric',
+                    month: 'long',
+                    day: 'numeric',
+                }),
+            },
+        };
+    }
+    else if (cellType === 'month') {
+        return {
+            attrs: {
+                'role': 'gridcell',
+                'aria-label': date.toLocaleDateString(localeCode, {
+                    year: 'numeric',
+                    month: 'long',
+                }),
+            },
+        };
+    }
+    else if (cellType === 'year') {
+        return {
+            attrs: {
+                'role': 'gridcell',
+                'aria-label': date.toLocaleDateString(localeCode, {
+                    year: 'numeric',
+                }),
+            },
+        };
+    }
+}
+/**
+ * Merge the internal render cell (adding of role + aria-label attributes) and the user's render cell (disabling dates, etc.)
+ * @param base Internal render cell
+ * @param custom User render cell
+ * @returns Merged render cell
+ */
+export function mergeRenderCellResults(base, custom) {
+    if (!base)
+        return custom;
+    if (!custom)
+        return base;
+    return {
+        ...base,
+        classes: [base.classes, custom.classes].filter(Boolean).join(' '),
+        disabled: custom.disabled || base.disabled,
+    };
+}

package/dist/collection/components/post-date-picker/date-utils.js

@@ -0,0 +1,102 @@
+import { BUDDHIST_CALENDAR_YEAR_OFFSET } from "../../utils/index";
+import { DATE_FORMAT_KEYS, DATE_FORMAT_KEYS_REGEX, DATE_FORMAT_MAP, DATE_FORMAT_SEPARATOR_REGEX, DATE_FORMAT_STRING_OPTIONS, TEXT_DIRECTION_MARKERS_REGEX, } from "./constants";
+/**
+ * Pad the year component of an ISO date string to 4 digits.
+ * @param isoDateString An ISO formatted date string (YYYY-MM-DD).
+ * @returns The padded ISO date string.
+ */
+export function padIsoDate(isoDateString) {
+    const valueParts = isoDateString.split('-');
+    return `${valueParts[0].padStart(4, '0')}-${valueParts[1]}-${valueParts[2]}`;
+}
+/**
+ * Convert an ISO 8601 formatted date string (YYYY-MM-DD) to a localtime date object.
+ * @param isoDateString An ISO formatted, localtime date string.
+ * @returns A localtime date object.
+ */
+export function isoToDate(isoDateString) {
+    return new Date(`${padIsoDate(isoDateString)}T00:00`);
+}
+/**
+ * Convert a date object to an ISO 8601 formatted date string (YYYY-MM-DD).
+ * @param date A localtime date object.
+ * @returns An ISO formatted, localtime date string.
+ */
+export function dateToIso(date) {
+    // The swedish locale (`sv`) happens to format the date in the exact ISO format (YYYY-MM-DD),
+    // so we can use it as a shortcut instead of manually constructing the string from the date parts.
+    return date.toLocaleDateString('sv', DATE_FORMAT_STRING_OPTIONS);
+}
+/**
+ * Convert a date object to a localized date string.
+ * @param date A localtime date object.
+ * @param localeCode The BCP 47 locale code to use for formatting.
+ * @returns A localized date string, depending on the given `localeCode`.
+ */
+export function dateToString(date, localeCode) {
+    const dateString = date.toLocaleDateString(localeCode, DATE_FORMAT_STRING_OPTIONS);
+    const yearString = date.getFullYear().toString();
+    if (yearString.length < 4) {
+        return dateString.replace(yearString, yearString.padStart(4, '0'));
+    }
+    return dateString;
+}
+/**
+ * Convert a localized date string to a date object.
+ * The date string should be in the same format as the date picker's `dateFormat`, which depends on the given `localeCode`.
+ * @param localeDateString A localized date string.
+ * @param dateFormat The date format string (e.g. "dd.mm.yyyy").
+ * @param isBuddhistCalendar Whether the locale uses the Buddhist calendar.
+ * @returns A localtime date object.
+ */
+export function stringToDate(localeDateString, dateFormat, isBuddhistCalendar) {
+    // Match the separator chars in the date format (e.g. "." for "dd.mm.yyyy", etc.).
+    const dateSeparator = dateFormat.match(DATE_FORMAT_SEPARATOR_REGEX)[0];
+    // Remove the text direction markers, split the date string into its parts (e.g. ["31", "01", "2026"], etc.)
+    // and make sure its values only contains digits (e.g. for "bg-BG", etc.).
+    const dateParts = localeDateString
+        .replace(TEXT_DIRECTION_MARKERS_REGEX, '')
+        .split(dateSeparator)
+        .map(p => p.replaceAll(/[^\d]/g, ''));
+    // Split the dateFormat into its parts to get the year, month, day order (e.g. ["d", "m", "y"], etc.).
+    // Removing everything else but the DATE_FORMAT_KEYS is necessary to support date formats with additional chars (e.g. "d.m.y г.", etc.).
+    const formatParts = dateFormat.replace(DATE_FORMAT_KEYS_REGEX, '').split('');
+    // Map the datePart values to their corresponding keys (e.g. y, m, d),
+    // to construct an ISO date string (e.g. "2026-01-31") that can be parsed by the Date constructor.
+    // This is necessary because different locale date formats may have different orders (e.g. "ymd", "dmy", "mdy", etc.).
+    const { y, m, d } = DATE_FORMAT_KEYS.reduce((parts, key) => ({
+        ...parts,
+        [key]: dateParts[formatParts.indexOf(key)],
+    }), {});
+    // Adjust for Thai Buddhist calendar
+    const year = isBuddhistCalendar ? (Number(y) - BUDDHIST_CALENDAR_YEAR_OFFSET).toString() : y;
+    return isoToDate([year, m, d].join('-'));
+}
+/**
+ * Get the date format string for a locale, by formatting a sample date and replacing the date parts
+ * with format keys (y, m, d). For example, it will return "dd.mm.yyyy" for "de-CH" locale and "mm/dd/yyyy" for "en-US" locale.
+ * @param localeCode The BCP 47 locale code.
+ * @param isBuddhistCalendar Whether the locale uses the Buddhist calendar.
+ * @returns The date format string.
+ */
+export function getDateFormat(localeCode, isBuddhistCalendar) {
+    const date = new Date(Object.values(DATE_FORMAT_MAP).join('-'));
+    // get the locale date format e.g. `22.11.3333` for `de-CH` or `11/22/3333` for `en-US`
+    let localeDateString = date.toLocaleDateString(localeCode, DATE_FORMAT_STRING_OPTIONS);
+    // replace the date parts (3333, 11, 22) with the corresponding format keys (y, m, d)
+    for (const [key, value] of Object.entries(DATE_FORMAT_MAP)) {
+        // for Thai locale, the year is in Buddhist calendar which is 543 years ahead of Gregorian calendar, so we need to adjust the year value accordingly
+        localeDateString = localeDateString.replace(isBuddhistCalendar && value.length === 4
+            ? (Number(value) + BUDDHIST_CALENDAR_YEAR_OFFSET).toString()
+            : value, key);
+    }
+    return localeDateString;
+}
+/**
+ * Check if a value is a valid Date object.
+ * @param date The value to check.
+ * @returns `true` if the value is a valid Date, `false` otherwise.
+ */
+export function isValidDate(date) {
+    return date instanceof Date && !Number.isNaN(date.getTime()) && date.getFullYear() >= 1000;
+}

package/dist/collection/components/post-date-picker/native-mask-element.js

@@ -0,0 +1,36 @@
+import { HTMLInputMaskElement } from "imask";
+const nativeValueDescriptor = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value');
+// iMask adapter that bypasses the instance-level `input.value` override (which returns ISO strings)
+// so iMask always works with locale-formatted display text.
+export class NativeInputMaskElement extends HTMLInputMaskElement {
+    constructor() {
+        super(...arguments);
+        this.allowEvents = false;
+        this._inputEventSuppressor = (e) => {
+            if (this.allowEvents)
+                return;
+            if (!e.isTrusted)
+                e.stopImmediatePropagation();
+        };
+    }
+    get value() {
+        return nativeValueDescriptor.get.call(this.input);
+    }
+    set value(val) {
+        nativeValueDescriptor.set.call(this.input, val);
+    }
+    bindEvents(handlers) {
+        this.input.addEventListener('input', this._inputEventSuppressor, true);
+        super.bindEvents(handlers);
+    }
+    unbindEvents() {
+        this.input.removeEventListener('input', this._inputEventSuppressor, true);
+        super.unbindEvents();
+    }
+}
+export function getNativeValue(input) {
+    return nativeValueDescriptor.get.call(input);
+}
+export function setNativeValue(input, val) {
+    nativeValueDescriptor.set.call(input, val);
+}