wcs-core 7.6.0 → 7.7.0

package/dist/collection/components/tooltip/tooltip.js

@@ -180,7 +180,7 @@ export class Tooltip {
         (_a = this.tippyInstance) === null || _a === void 0 ? void 0 : _a.destroy();
     }
     render() {
-        return (h(Host, { key: '430814e1eefde613ed887a70b837c5603b3d7656', role: "tooltip" }, h("slot", { key: 'f1915740c4c18c7c154bedd8db7bc10e7836822c', onSlotchange: _ => this.updateTippyContent() })));
+        return (h(Host, { key: '1176204e4bb1cb9d64ae9ec886723cbaa61186d3', role: "tooltip" }, h("slot", { key: 'ae9c0e875c10486f51796eca6cbb64efd16ae5f6', onSlotchange: _ => this.updateTippyContent() })));
     }
     static get is() { return "wcs-tooltip"; }
     static get encapsulation() { return "shadow"; }

package/dist/esm/alert-close-button-2ce5ac95.js

@@ -0,0 +1,8 @@
+import { h } from './index-d9de61ce.js';
+
+const AlertCloseButton = ({ onClick }) => (h("wcs-button", { shape: "round", size: "s", mode: "clear", class: "close-button wcs-dark", "aria-label": "Fermer cette notification", onClick: onClick },
+    h("wcs-mat-icon", { icon: "close" })));
+
+export { AlertCloseButton as A };
+
+//# sourceMappingURL=alert-close-button-2ce5ac95.js.map

package/dist/esm/alert-close-button-2ce5ac95.js.map

@@ -0,0 +1 @@
+{"file":"alert-close-button-2ce5ac95.js","mappings":";;MAEa,gBAAgB,GAExB,CAAC,EAAE,OAAO,EAAE,MACb,kBACI,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,GAAG,EACR,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,uBAAuB,gBAClB,2BAA2B,EACtC,OAAO,EAAE,OAAO;IAEhB,oBAAc,IAAI,EAAC,OAAO,GAAgB,CACjC;;;;","names":[],"sources":["src/components/alert/alert-close-button.tsx"],"sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\n\nexport const AlertCloseButton: FunctionalComponent<{\n    onClick: (e: MouseEvent) => void;\n}> = ({ onClick }) => (\n    <wcs-button\n        shape=\"round\"\n        size=\"s\"\n        mode=\"clear\"\n        class=\"close-button wcs-dark\"\n        aria-label=\"Fermer cette notification\"\n        onClick={onClick}\n    >\n        <wcs-mat-icon icon=\"close\"></wcs-mat-icon>\n    </wcs-button>\n);\n"],"version":3}

package/dist/esm/{com-nav-utils-27c1efdf.js → com-nav-utils-a5af32af.js}

@@ -1,4 +1,4 @@
-import { g as getCssRootPropertyValue } from './helpers-89faa1b1.js';
+import { g as getCssRootPropertyValue } from './helpers-2d73ee7c.js';
 
 /**
  * This function add event handlers on the navigableItems list. The handlers call the function close() on the nodeName.
@@ -48,4 +48,4 @@ function comNavDidLoadWithResizeObserver(comNavElement) {
 
 export { comNavDidLoadWithResizeObserver as c, registerCloseHandlerForFocusOutEventOn as r };
 
-//# sourceMappingURL=com-nav-utils-27c1efdf.js.map
+//# sourceMappingURL=com-nav-utils-a5af32af.js.map

package/dist/esm/{com-nav-utils-27c1efdf.js.map → com-nav-utils-a5af32af.js.map}

@@ -1 +1 @@
-{"file":"com-nav-utils-27c1efdf.js","mappings":";;AAKA;;;;;;;;SAQgB,sCAAsC,CAA+B,cAAmC,EAAE,eAAuB;IAC7I,cAAc,CAAC,OAAO,CAAC,aAAa;QAChC,aAAa,CAAC,gBAAgB,CAAC,UAAU,EAAE,CAAC,GAAe;YACvD,MAAM,oBAAoB,GAAG,GAAG,CAAC,aAA4B,CAAC;YAC9D,IAAI,CAAC,6BAA6B,CAAC,aAAa,EAAE,oBAAoB,CAAC,EAAE;gBACrE,MAAM,iBAAiB,GAAI,GAAa,CAAC,YAAY,EAAE,CAAC;gBACxD,IAAI,uCAAuC,CAAC,iBAAiB,EAAE,eAAe,CAAC,EAAE;oBAC5E,iBAAiB,CAAC,MAAM,CAAC,yBAAyB,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAkB,CAAC,KAAK,EAAE,CAAC;iBACrG;aACJ;SACJ,CAAC,CAAA;KACL,CAAC,CAAC;AACP,CAAC;AAED,SAAS,6BAA6B,CAAC,aAAsB,EAAE,OAAgB;IAC3E,OAAO,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;AAC3C,CAAC;AAED,SAAS,yBAAyB,CAAC,QAAgB;IAC/C,OAAO,CAAC,IAAK,CAAiB,CAAC,QAAQ,KAAK,QAAQ,CAAC;AACzD,CAAC;AAED,SAAS,uCAAuC,CAAC,iBAAgC,EAAE,QAAgB;IAC/F,OAAO,iBAAiB,CAAC,GAAG,CAAC,CAAC,IAAK,CAAiB,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;AAC5F,CAAC;SAEe,+BAA+B,CAAC,aAAsD;IAClG,MAAM,eAAe,GAAG,uBAAuB,CAAC,kCAAkC,CAAC,IAAI,OAAO,CAAC;IAC/F,MAAM,oBAAoB,GAAG,QAAQ,CAAC,eAAe,EAAE,EAAE,CAAC,CAAC;IAE3D,OAAO,IAAI,cAAc,CAAC,KAAK;QAC3B,MAAM,EAAE,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC;QAChC,MAAM,YAAY,GAAG,EAAE,CAAC,KAAK,GAAG,EAAE,CAAC,KAAK,CAAC;QACzC,MAAM,WAAW,GAAG,EAAE,CAAC,IAAI,CAAC;QAC5B,IAAI,EAAE,CAAC,KAAK,IAAI,oBAAoB,IAAI,WAAW,GAAG,YAAY,CAAC,EAAE;YACjE,aAAa,CAAC,mBAAmB,GAAG,QAAQ,CAAC;SAChD;aAAM;YACH,aAAa,CAAC,mBAAmB,GAAG,SAAS,CAAC;SACjD;KACJ,CAAC,CAAC;AACP;;;;","names":[],"sources":["src/components/com-nav/com-nav-utils.ts"],"sourcesContent":["import { getCssRootPropertyValue } from \"../../utils/helpers\";\nimport { ComNav } from \"./com-nav\";\nimport { ComNavSubmenu } from \"../com-nav-submenu/com-nav-submenu\";\nimport { ComNavCategory } from \"../com-nav-category/com-nav-category\";\n\n/**\n * This function add event handlers on the navigableItems list. The handlers call the function close() on the nodeName.\n *\n * T: type class of the nodeNameToClose param (must have a close function)\n *\n * @param navigableItems items on which focusout event listeners must be added\n * @param nodeNameToClose nodeName of the element we want to close in the event path\n */\nexport function registerCloseHandlerForFocusOutEventOn<T extends {close: () => any}>(navigableItems: NodeListOf<Element>, nodeNameToClose: string): void {\n    navigableItems.forEach(navigableItem => {\n        navigableItem.addEventListener(\"focusout\", (evt: FocusEvent) => {\n            const relatedTargetElement = evt.relatedTarget as HTMLElement;\n            if (!isElementChildOfNavigableItem(navigableItem, relatedTargetElement)) {\n                const eventComposedPath = (evt as Event).composedPath();\n                if (isEventThrownFromChildOfNodeNameToClose(eventComposedPath, nodeNameToClose)) {\n                    (eventComposedPath.filter(eventTargetNodeNameEquals(nodeNameToClose))[0] as unknown as T).close();\n                }\n            }\n        })\n    });\n}\n\nfunction isElementChildOfNavigableItem(navigableItem: Element, element: Element) {\n    return navigableItem.contains(element);\n}\n\nfunction eventTargetNodeNameEquals(nodeName: string) {\n    return x => (x as HTMLElement).nodeName === nodeName;\n}\n\nfunction isEventThrownFromChildOfNodeNameToClose(eventComposedPath: EventTarget[], nodeName: string) {\n    return eventComposedPath.map(x => (x as HTMLElement).nodeName).indexOf(nodeName) !== -1;\n}\n\nexport function comNavDidLoadWithResizeObserver(comNavElement: ComNav | ComNavSubmenu | ComNavCategory): ResizeObserver {\n    const smallBreakpoint = getCssRootPropertyValue('--wcs-phone-breakpoint-max-width') || '575px';\n    const smallBreakpointValue = parseInt(smallBreakpoint, 10);\n\n    return new ResizeObserver(entry => {\n        const cr = entry[0].contentRect;\n        const paddingRight = cr.right - cr.width;\n        const paddingLeft = cr.left;\n        if (cr.width <= smallBreakpointValue - (paddingLeft + paddingRight)) {\n            comNavElement.currentActiveSizing = 'mobile';\n        } else {\n            comNavElement.currentActiveSizing = 'desktop';\n        }\n    });\n}\n"],"version":3}
+{"file":"com-nav-utils-a5af32af.js","mappings":";;AAKA;;;;;;;;SAQgB,sCAAsC,CAA+B,cAAmC,EAAE,eAAuB;IAC7I,cAAc,CAAC,OAAO,CAAC,aAAa;QAChC,aAAa,CAAC,gBAAgB,CAAC,UAAU,EAAE,CAAC,GAAe;YACvD,MAAM,oBAAoB,GAAG,GAAG,CAAC,aAA4B,CAAC;YAC9D,IAAI,CAAC,6BAA6B,CAAC,aAAa,EAAE,oBAAoB,CAAC,EAAE;gBACrE,MAAM,iBAAiB,GAAI,GAAa,CAAC,YAAY,EAAE,CAAC;gBACxD,IAAI,uCAAuC,CAAC,iBAAiB,EAAE,eAAe,CAAC,EAAE;oBAC5E,iBAAiB,CAAC,MAAM,CAAC,yBAAyB,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAkB,CAAC,KAAK,EAAE,CAAC;iBACrG;aACJ;SACJ,CAAC,CAAA;KACL,CAAC,CAAC;AACP,CAAC;AAED,SAAS,6BAA6B,CAAC,aAAsB,EAAE,OAAgB;IAC3E,OAAO,aAAa,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;AAC3C,CAAC;AAED,SAAS,yBAAyB,CAAC,QAAgB;IAC/C,OAAO,CAAC,IAAK,CAAiB,CAAC,QAAQ,KAAK,QAAQ,CAAC;AACzD,CAAC;AAED,SAAS,uCAAuC,CAAC,iBAAgC,EAAE,QAAgB;IAC/F,OAAO,iBAAiB,CAAC,GAAG,CAAC,CAAC,IAAK,CAAiB,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC;AAC5F,CAAC;SAEe,+BAA+B,CAAC,aAAsD;IAClG,MAAM,eAAe,GAAG,uBAAuB,CAAC,kCAAkC,CAAC,IAAI,OAAO,CAAC;IAC/F,MAAM,oBAAoB,GAAG,QAAQ,CAAC,eAAe,EAAE,EAAE,CAAC,CAAC;IAE3D,OAAO,IAAI,cAAc,CAAC,KAAK;QAC3B,MAAM,EAAE,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC;QAChC,MAAM,YAAY,GAAG,EAAE,CAAC,KAAK,GAAG,EAAE,CAAC,KAAK,CAAC;QACzC,MAAM,WAAW,GAAG,EAAE,CAAC,IAAI,CAAC;QAC5B,IAAI,EAAE,CAAC,KAAK,IAAI,oBAAoB,IAAI,WAAW,GAAG,YAAY,CAAC,EAAE;YACjE,aAAa,CAAC,mBAAmB,GAAG,QAAQ,CAAC;SAChD;aAAM;YACH,aAAa,CAAC,mBAAmB,GAAG,SAAS,CAAC;SACjD;KACJ,CAAC,CAAC;AACP;;;;","names":[],"sources":["src/components/com-nav/com-nav-utils.ts"],"sourcesContent":["import { getCssRootPropertyValue } from \"../../utils/helpers\";\nimport { ComNav } from \"./com-nav\";\nimport { ComNavSubmenu } from \"../com-nav-submenu/com-nav-submenu\";\nimport { ComNavCategory } from \"../com-nav-category/com-nav-category\";\n\n/**\n * This function add event handlers on the navigableItems list. The handlers call the function close() on the nodeName.\n *\n * T: type class of the nodeNameToClose param (must have a close function)\n *\n * @param navigableItems items on which focusout event listeners must be added\n * @param nodeNameToClose nodeName of the element we want to close in the event path\n */\nexport function registerCloseHandlerForFocusOutEventOn<T extends {close: () => any}>(navigableItems: NodeListOf<Element>, nodeNameToClose: string): void {\n    navigableItems.forEach(navigableItem => {\n        navigableItem.addEventListener(\"focusout\", (evt: FocusEvent) => {\n            const relatedTargetElement = evt.relatedTarget as HTMLElement;\n            if (!isElementChildOfNavigableItem(navigableItem, relatedTargetElement)) {\n                const eventComposedPath = (evt as Event).composedPath();\n                if (isEventThrownFromChildOfNodeNameToClose(eventComposedPath, nodeNameToClose)) {\n                    (eventComposedPath.filter(eventTargetNodeNameEquals(nodeNameToClose))[0] as unknown as T).close();\n                }\n            }\n        })\n    });\n}\n\nfunction isElementChildOfNavigableItem(navigableItem: Element, element: Element) {\n    return navigableItem.contains(element);\n}\n\nfunction eventTargetNodeNameEquals(nodeName: string) {\n    return x => (x as HTMLElement).nodeName === nodeName;\n}\n\nfunction isEventThrownFromChildOfNodeNameToClose(eventComposedPath: EventTarget[], nodeName: string) {\n    return eventComposedPath.map(x => (x as HTMLElement).nodeName).indexOf(nodeName) !== -1;\n}\n\nexport function comNavDidLoadWithResizeObserver(comNavElement: ComNav | ComNavSubmenu | ComNavCategory): ResizeObserver {\n    const smallBreakpoint = getCssRootPropertyValue('--wcs-phone-breakpoint-max-width') || '575px';\n    const smallBreakpointValue = parseInt(smallBreakpoint, 10);\n\n    return new ResizeObserver(entry => {\n        const cr = entry[0].contentRect;\n        const paddingRight = cr.right - cr.width;\n        const paddingLeft = cr.left;\n        if (cr.width <= smallBreakpointValue - (paddingLeft + paddingRight)) {\n            comNavElement.currentActiveSizing = 'mobile';\n        } else {\n            comNavElement.currentActiveSizing = 'desktop';\n        }\n    });\n}\n"],"version":3}

package/dist/esm/{grid-pagination-23102986.js → grid-pagination-c29173f6.js}

@@ -1,5 +1,5 @@
 import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-d9de61ce.js';
-import { i as inheritAriaAttributes, a as inheritAttributes, s as setOrRemoveAttribute } from './helpers-89faa1b1.js';
+import { i as inheritAriaAttributes, a as inheritAttributes, s as setOrRemoveAttribute } from './helpers-2d73ee7c.js';
 
 const getAccessibleName = (order, double) => {
     switch (order) {
@@ -43,7 +43,7 @@ const GridPaginationArrow = ({ active, order, double = false }) => (h("wcs-butto
                 h("path", { d: "M0 0h24v24H0z", fill: "none" }))
             : '')));
 
-const gridPaginationCss = ":host{display:block;margin-top:var(--wcs-grid-pagination-margin-top);--wcs-grid-pagination-color:var(--wcs-semantic-color-text-primary);--wcs-grid-pagination-font-size:var(--wcs-semantic-font-size-label-2);--wcs-grid-pagination-font-weight:var(--wcs-semantic-font-weight-medium);--wcs-grid-pagination-gap:var(--wcs-semantic-spacing-base);--wcs-grid-pagination-page-size-gap:var(--wcs-semantic-spacing-base);--wcs-grid-pagination-counter-gap:var(--wcs-semantic-spacing-small);--wcs-grid-pagination-margin-top:var(--wcs-semantic-spacing-large);--wcs-grid-pagination-arrow-color-inactive:unset;--wcs-grid-pagination-arrow-color-active:unset;}.container{display:grid;gap:var(--wcs-grid-pagination-gap);grid-template-columns:auto auto auto;justify-content:space-between;align-items:center;color:var(--wcs-grid-pagination-color);font-size:var(--wcs-grid-pagination-font-size);font-weight:var(--wcs-grid-pagination-font-weight)}.available-page-sizes{width:auto}.page-management,.page-size,.items-count{display:flex;align-items:center}.page-size{gap:var(--wcs-grid-pagination-page-size-gap)}.page-management{margin:0;padding:0;list-style-type:none}.pagination-arrow{display:flex}.pagination-counter{padding:0 var(--wcs-grid-pagination-counter-gap)}.pagination-counter span{white-space:nowrap}wcs-select.available-page-sizes{--wcs-select-control-height:var(--wcs-semantic-size-s)}";
+const gridPaginationCss = ":host{display:block;margin-top:var(--wcs-grid-pagination-margin-top);--wcs-grid-pagination-color:var(--wcs-semantic-color-text-primary);--wcs-grid-pagination-font-size:var(--wcs-semantic-font-size-label-2);--wcs-grid-pagination-font-weight:var(--wcs-semantic-font-weight-medium);--wcs-grid-pagination-gap:var(--wcs-semantic-spacing-base);--wcs-grid-pagination-page-size-gap:var(--wcs-semantic-spacing-base);--wcs-grid-pagination-counter-gap:var(--wcs-semantic-spacing-small);--wcs-grid-pagination-margin-top:var(--wcs-semantic-spacing-large);--wcs-grid-pagination-arrow-color-inactive:unset;--wcs-grid-pagination-arrow-color-active:unset;}.container{display:grid;gap:var(--wcs-grid-pagination-gap);grid-template-columns:auto auto auto;justify-content:space-between;align-items:center;color:var(--wcs-grid-pagination-color);font-size:var(--wcs-grid-pagination-font-size);font-weight:var(--wcs-grid-pagination-font-weight)}.available-page-sizes{width:auto}.page-management,.page-size,.items-count{display:flex;align-items:center}.items-count p{margin:0}.page-size{gap:var(--wcs-grid-pagination-page-size-gap)}.page-management{margin:0;padding:0;list-style-type:none}.pagination-arrow{display:flex}.pagination-counter{padding:0 var(--wcs-grid-pagination-counter-gap)}.pagination-counter span{white-space:nowrap}wcs-select.available-page-sizes{--wcs-select-control-height:var(--wcs-semantic-size-s)}";
 const WcsGridPaginationStyle0 = gridPaginationCss;
 
 const GRID_PAGINATION_INHERITED_ATTRS = ['tabindex', 'title'];
@@ -128,7 +128,7 @@ const GridPagination = class {
         });
     }
     render() {
-        return (h(Host, { key: '3efc96789e89f352f23038016baf6cbc232d6e0c', slot: "grid-pagination" }, h("div", { key: 'df2365f3367fe20bfb66f8b4969036a1662daef3', class: "container" }, h("div", { key: 'b700909bbdcef7087af7a7f5d624db07bf909315', class: "page-size" }, h("wcs-select", { key: 'bd9454c106da98c1dfbd7c5081f1bc2c564db2ae', placeholder: "El\u00E9ments par page", class: "available-page-sizes", "aria-labelledby": "elements-per-page-number elements-per-page-text", value: this.pageSize, onWcsChange: this.onChangePageSize.bind(this) }, this.availablePageSizes.map((pageSize) => h("wcs-select-option", { value: pageSize }, pageSize))), h("span", { key: '792711f34454bb10a42c44b7e13d03f8fbf4af74', id: "elements-per-page-number", hidden: true }, this.pageSize), h("span", { key: '00848f6a348aed84d37ebb19172e3d7818ba3c17', id: "elements-per-page-text" }, h("slot", { key: '21848ccaf60179a82c53916f8e438e8b63ebaf61', name: "elements-per-page-text" }, h("span", { key: '6bf5a0c3e6dc2bd81193e362abab61b7e165de54' }, " \u00E9l\u00E9ments par page")))), h("div", { key: 'ef6378352c7251430bb90540b28d52407b792b4d', class: "items-count" }, h("span", { key: 'a0f8ebf6564358233cf2683107d7a3af50bbd3e7' }, this.itemsCount, h("slot", { key: 'b0549af31d518ea3d748ba615c226d242aa1ea3e', name: "items-count-text" }, h("span", { key: 'b0266239fa9726005d9946ccedf59bfe26e030a3' }, " \u00E9l\u00E9ments")))), h("nav", Object.assign({ key: '43a87e737be4890ac0f4fcb8f76e56fc5a40a27d', "aria-label": "pagination", ref: (el) => (this.nativeNav = el) }, this.inheritedAttributes), h("ul", { key: '6e95be555deb6741ac851eaa0163483bd9a33e19', class: "page-management" }, h("li", { key: 'faab6e7ab55628be3b5bf4e61c559a67c6ea2a57', class: "pagination-arrow", onClick: this.firstPage.bind(this) }, h(GridPaginationArrow, { key: '699c51108204e3e13c408abb43ed59039b12cddb', active: this.canGoToPreviousPage(), order: "previous", double: true })), h("li", { key: '3e13d327cab3e2b4c54ad915e38c10effa852970', class: "pagination-arrow", onClick: this.previousPage.bind(this) }, h(GridPaginationArrow, { key: '5fbe8676685d367affe840948a4ae037e7e1b0d0', active: this.canGoToPreviousPage(), order: "previous" })), h("li", { key: '086fd79d45cc0d8c60cf53b9ae44015944341b95', class: "pagination-counter" }, h("span", { key: '9bd2e83985ae3b482830628ed9384c1583392f70', "aria-label": `Page ${this.currentPage + 1} sur ${this.pageCount}`, "aria-current": "page" }, this.currentPage + 1, " / ", this.pageCount)), h("li", { key: '6a61141774ba5ddc261e911945cbe71282c34793', class: "pagination-arrow", onClick: this.nextPage.bind(this) }, h(GridPaginationArrow, { key: '4c41d7cdce692495b67227f0bb24fd0b605998e0', active: this.canGoToNextPage(), order: "next" })), h("li", { key: 'c929ccd8c749763034a42a7006264747eed59b02', class: "pagination-arrow", onClick: this.lastPage.bind(this) }, h(GridPaginationArrow, { key: '184d97af95b7fad98617f7fb138463826f94c9a8', active: this.canGoToNextPage(), order: "next", double: true })))))));
+        return (h(Host, { key: '2b66040862ae88efc9c2fdf69f4b6398a1467765', slot: "grid-pagination" }, h("div", { key: '26ad3a0408a18669e6edef534de9056f6b7b438a', class: "container" }, h("div", { key: '7160d82226cbc902028d1ff3456e110ba1930907', class: "page-size" }, h("wcs-select", { key: '8eabadf8c1d750f47998ef8bc58764ec94ca8efc', placeholder: "El\u00E9ments par page", class: "available-page-sizes", "aria-labelledby": "elements-per-page-number elements-per-page-text", value: this.pageSize, onWcsChange: this.onChangePageSize.bind(this) }, this.availablePageSizes.map((pageSize) => h("wcs-select-option", { value: pageSize }, pageSize))), h("span", { key: 'a02dbcb0b3150112ce68697fa7e6e596613fdbbf', id: "elements-per-page-number", hidden: true }, this.pageSize), h("span", { key: '9e4676f3042fb8199a4ecb7ae9d49a492b22e6c6', id: "elements-per-page-text" }, h("slot", { key: '95635bcbe8251327916722cbac7da2d02192d00d', name: "elements-per-page-text" }, h("span", { key: '7e2ec062a42d983c0def5cbaf3799e37d51387b1' }, " \u00E9l\u00E9ments par page")))), h("div", { key: '06310a17ab65d3904715263b755d8293f60963bc', class: "items-count" }, h("p", { key: '8692ce9d64ef8af6eadea566367212d2f627e4a2' }, this.itemsCount, h("slot", { key: 'a449b2752bf712f34f2f4692331db98cac24e425', name: "items-count-text" }, h("span", { key: 'eb8f58c0b822fc56113f5674ec5f84d9ec9783fe' }, " \u00E9l\u00E9ments")))), h("nav", Object.assign({ key: '5cde096a375644a4a5282060006cddcf87cbee06', "aria-label": "pagination", ref: (el) => (this.nativeNav = el) }, this.inheritedAttributes), h("ul", { key: '1adac702212d51f51790fea4cc7fc237a90d2a1c', class: "page-management" }, h("li", { key: '9b11e07954ea7ee9a11f35acfcb634ce803c3ec3', class: "pagination-arrow", onClick: this.firstPage.bind(this) }, h(GridPaginationArrow, { key: '3ad79b51e5a21c91767d60c5d79016de378054c1', active: this.canGoToPreviousPage(), order: "previous", double: true })), h("li", { key: 'd8d56d81054b3487acc4aeabe7dca35e07004e8d', class: "pagination-arrow", onClick: this.previousPage.bind(this) }, h(GridPaginationArrow, { key: '47489f5211613cb9ff49a5f91cccd5baa2cd1b81', active: this.canGoToPreviousPage(), order: "previous" })), h("li", { key: '8bef90ad2eb8fca1161fdfead7193d64db263754', class: "pagination-counter" }, h("span", { key: '360f57f5ac09f4a86f2bb452651b2157f32fcaea', "aria-label": `Page ${this.currentPage + 1} sur ${this.pageCount}`, "aria-current": "page" }, this.currentPage + 1, " / ", this.pageCount)), h("li", { key: '31b214923f3e8c91b20948bd324e3ab9246df335', class: "pagination-arrow", onClick: this.nextPage.bind(this) }, h(GridPaginationArrow, { key: '03a73099f418ca3518bce9a19244d0ebf31c4b2c', active: this.canGoToNextPage(), order: "next" })), h("li", { key: '92f0c159253ec4a1d7337e87329d95cd15b280e4', class: "pagination-arrow", onClick: this.lastPage.bind(this) }, h(GridPaginationArrow, { key: '6c390af9e0b7a15e6f6fafaa6a6d62adda28b5b9', active: this.canGoToNextPage(), order: "next", double: true })))))));
     }
     get el() { return getElement(this); }
 };
@@ -137,4 +137,4 @@ GridPagination.style = WcsGridPaginationStyle0;
 
 export { GridPagination as G };
 
-//# sourceMappingURL=grid-pagination-23102986.js.map
+//# sourceMappingURL=grid-pagination-c29173f6.js.map

package/dist/esm/grid-pagination-c29173f6.js.map

@@ -0,0 +1 @@
+{"file":"grid-pagination-c29173f6.js","mappings":"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","names":[],"sources":["src/components/grid-pagination/grid-pagination-arrow.tsx","src/components/grid-pagination/grid-pagination.scss?tag=wcs-grid-pagination&encapsulation=shadow","src/components/grid-pagination/grid-pagination.tsx"],"sourcesContent":["import { FunctionalComponent, h } from '@stencil/core';\n\ninterface GridPaginationArrowProps {\n  active: boolean;\n  order: 'next' | 'previous';\n  double?: boolean;\n}\n\nconst getAccessibleName = (order: GridPaginationArrowProps['order'], double: GridPaginationArrowProps['double']): string => {\n  switch (order) {\n    case 'next':\n      return double ? 'Dernière page' : 'Page suivante';\n    case 'previous':\n    default:\n      return double ? 'Première page' : 'Page précédente';\n  }\n}\n\nexport const GridPaginationArrow: FunctionalComponent<GridPaginationArrowProps> = ({active, order, double = false}) => (\n  <wcs-button mode=\"clear\"\n              shape=\"square\"\n              size=\"s\"\n              disabled={!active}\n              title={getAccessibleName(order, double)}>\n    <svg style={{cursor: 'pointer'}}\n         aria-hidden=\"true\"\n         xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"20\" viewBox=\"0 0 24 20\">\n      <style type=\"text/css\">{`\n              .arrow-group {\n                  transform-origin: 50% 51%;\n                  transition: transform 175ms ease-in-out;\n              }\n              .arrow {\n                  transition: fill 175ms ease-in-out;\n                  fill: var(--wcs-grid-pagination-arrow-color-inactive, var(--wcs-button-color));\n              }\n              .second-arrow {\n                  transform: translateY(-8px);\n              }\n              .next {\n                  transform: rotate(90deg);\n              }\n              .previous {\n                  transform: rotate(-90deg);\n              }\n              .active {\n                  fill: var(--wcs-grid-pagination-arrow-color-active, var(--wcs-button-color));\n              }\n          `}</style>\n      <g fill=\"none\" class={order + ' arrow-group'}>\n        <path class={(active ? 'active' : '') + ' arrow'} d=\"M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z\"/>\n        <path d=\"M0 0h24v24H0z\" fill=\"none\"/>\n      </g>\n      {\n        double ?\n          <g fill=\"none\" class={order + ' arrow-group'}>\n            <path class={(active ? 'active' : '') + ' arrow second-arrow'}\n                  d=\"M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z\"/>\n            <path d=\"M0 0h24v24H0z\" fill=\"none\"/>\n          </g>\n          : ''\n      }\n    </svg>\n  </wcs-button>\n);\n","@import '../../style/focus-outline.scss';\n\n:host {\n    display: block;\n    margin-top: var(--wcs-grid-pagination-margin-top);\n\n    --wcs-grid-pagination-color: var(--wcs-semantic-color-text-primary);\n    --wcs-grid-pagination-font-size: var(--wcs-semantic-font-size-label-2);\n    --wcs-grid-pagination-font-weight: var(--wcs-semantic-font-weight-medium);\n\n    --wcs-grid-pagination-gap: var(--wcs-semantic-spacing-base);\n    --wcs-grid-pagination-page-size-gap: var(--wcs-semantic-spacing-base);\n    --wcs-grid-pagination-counter-gap: var(--wcs-semantic-spacing-small);\n    --wcs-grid-pagination-margin-top: var(--wcs-semantic-spacing-large);\n\n    --wcs-grid-pagination-arrow-color-inactive: unset; /* Optional : Overrides the fill property of the grid-pagination-arrow */\n    --wcs-grid-pagination-arrow-color-active: unset; /* Optional : Overrides the fill property of the grid-pagination-arrow */\n}\n\n.container {\n    display: grid;\n    gap: var(--wcs-grid-pagination-gap);\n    grid-template-columns: auto auto auto;\n    justify-content: space-between;\n    align-items: center;\n    color: var(--wcs-grid-pagination-color);\n    font-size: var(--wcs-grid-pagination-font-size);\n    font-weight: var(--wcs-grid-pagination-font-weight);\n}\n\n.available-page-sizes {\n    width: auto;\n}\n\n.page-management, .page-size, .items-count {\n    display: flex;\n    align-items: center;\n}\n\n.items-count p {\n    margin: 0;\n}\n\n.page-size {\n    gap: var(--wcs-grid-pagination-page-size-gap);\n}\n\n.page-management {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n}\n\n.pagination-arrow {\n    display: flex;\n}\n\n.pagination-counter {\n    padding: 0 var(--wcs-grid-pagination-counter-gap);\n\n    span {\n        white-space: nowrap;\n    }\n}\n\n/* TODO : Remove this when the select component will be able to handle the size S */\nwcs-select.available-page-sizes {\n    --wcs-select-control-height: var(--wcs-semantic-size-s);\n}\n","import {\n    Component,\n    ComponentInterface, Element,\n    Event, EventEmitter,\n    h,\n    Host, Method,\n    Prop\n} from '@stencil/core';\nimport {\n    WcsGridPaginationChangeEventDetails\n} from '../grid/grid-interface';\nimport { SelectChangeEventDetail } from '../select/select-interface';\nimport { GridPaginationArrow } from './grid-pagination-arrow';\nimport { AriaAttributeName, MutableAriaAttribute } from \"../../utils/mutable-aria-attribute\";\nimport { inheritAriaAttributes, inheritAttributes, setOrRemoveAttribute } from \"../../utils/helpers\";\n\nconst GRID_PAGINATION_INHERITED_ATTRS = ['tabindex', 'title'];\n\n/**\n * The grid pagination is a subcomponent of `wcs-grid`, slotted in `grid-pagination` under the `<table>` element.\n * \n * @cssprop --wcs-grid-pagination-color - Text color of the grid pagination\n * @cssprop --wcs-grid-pagination-font-size - Font-size of the grid pagination\n * @cssprop --wcs-grid-pagination-font-weight - Font-weight of the grid pagination\n * @cssprop --wcs-grid-pagination-gap - Gap between the page size, number of elements and page management\n * @cssprop --wcs-grid-pagination-page-size-gap - Gap between the select and the text within the page size container\n * @cssprop --wcs-grid-pagination-counter-gap - Gap within the page management counter\n * @cssprop --wcs-grid-pagination-margin-top - Margin between the grid and the pagination\n * @cssprop --wcs-grid-pagination-arrow-color-inactive - Color of the inactive arrow\n * @cssprop --wcs-grid-pagination-arrow-color-active - Color of the active arrow\n * \n * @slot elements-per-page-text - Text following the page size select. Default text is \" éléments par page\". You may want to add a non-breaking space before the text to separate it from the number.\n * @slot items-count-text - Text following the number of elements. Default text is \" éléments\". You may want to add a non-breaking space before the text to separate it from the number.\n */\n@Component({\n    tag: 'wcs-grid-pagination',\n    styleUrl: 'grid-pagination.scss',\n    shadow: true\n})\nexport class GridPagination implements ComponentInterface, MutableAriaAttribute {\n    @Element() private el!: HTMLElement;\n    private nativeNav!: HTMLElement;\n    private inheritedAttributes: { [k: string]: any } = {};\n    \n    static readonly INDEX_FIRST_PAGE: number = 0;\n    /**\n     * Set the available page sizes in the pagination dropdown on the left.\n     */\n    @Prop() availablePageSizes: number[] = [10, 20, 50];\n    /**\n     * The current page of the pagination. First page starts at index 0.\n     */\n    @Prop({mutable: true}) currentPage: number = GridPagination.INDEX_FIRST_PAGE;\n    /**\n     * Maximum number of elements shown per page.  \n     * Default is the first value of `availablePageSizes`.\n     */\n    @Prop() pageSize: number = this.availablePageSizes[0];\n    /**\n     * Total elements in the grid.  \n     * - **Grid in `Server mode`** : You have to set `itemsCount` = your total data length.  \n     * - **Grid not in Server mode** : Do not set it manually : itemsCount is set and updated every pagination refresh.\n     */\n    @Prop() itemsCount: number = 0;\n    /**\n     * Max number of pages.  \n     * - **Grid in `Server mode`** : You have to set `pageCount` = `itemsCount` divided by `pageSize`.  \n     * - **Grid not in Server mode** : Do not set it manually : pageCount is set and updated every pagination refresh.\n     */\n    @Prop() pageCount: number = 1;\n    /**\n     * Event emitted when the pagination changes.\n     */\n    @Event() wcsGridPaginationChange!: EventEmitter<WcsGridPaginationChangeEventDetails>;\n\n    componentWillLoad(): Promise<void> | void {\n        this.inheritedAttributes = {\n            ...inheritAriaAttributes(this.el),\n            ...inheritAttributes(this.el, GRID_PAGINATION_INHERITED_ATTRS),\n        };\n    }\n\n    @Method()\n    async setAriaAttribute(attr: AriaAttributeName, value: string | null | undefined) {\n        setOrRemoveAttribute(this.nativeNav, attr, value);\n    }\n    \n    private getWcsGrid(): HTMLWcsGridElement | undefined {\n        return this.el.parentElement.tagName === 'WCS-GRID' ? this.el.parentElement as HTMLWcsGridElement : undefined;\n    }\n\n    private lastPage(): void {\n        this.currentPage = this.pageCount - 1;\n        this.emitPaginationChange();\n        this.focusFirstGridCell();\n    }\n\n    private nextPage(): void {\n        if (this.canGoToNextPage()) {\n            this.currentPage++;\n            this.emitPaginationChange();\n            this.focusFirstGridCell();\n        }\n    }\n\n    private canGoToNextPage(): boolean {\n        return this.currentPage + 1 < this.pageCount;\n    }\n\n    private previousPage(): void {\n        if (this.canGoToPreviousPage()) {\n            this.currentPage--;\n            this.emitPaginationChange();\n            this.focusFirstGridCell();\n        }\n    }\n\n    private canGoToPreviousPage(): boolean {\n        return this.currentPage > 0;\n    }\n\n    private firstPage(): void {\n        this.currentPage = 0;\n        this.emitPaginationChange();\n        this.focusFirstGridCell();\n    }\n\n    private onChangePageSize(event: CustomEvent<SelectChangeEventDetail>): void {\n        this.pageSize = event.detail.value;\n        if (this.currentPage + 1 > this.pageSize) {\n            this.currentPage = 0;\n        }\n        this.emitPaginationChange();\n        this.focusFirstGridCell();\n    }\n\n    /**\n     * Move focus to the first grid cell after a pagination change\n     */\n    private focusFirstGridCell() {\n        const grid = this.getWcsGrid();\n        if (grid) {\n            requestAnimationFrame(() => {\n                this.el.blur();\n                grid.focusFirstCell();\n            })\n        }\n    }\n\n    private emitPaginationChange(): void {\n        this.wcsGridPaginationChange.emit({\n            pagination: {\n                currentPage: this.currentPage,\n                pageSize: this.pageSize,\n                itemsCount: this.itemsCount,\n                pageCount: this.pageCount\n            }\n        });\n    }\n\n    render(): any {\n        return (<Host slot=\"grid-pagination\">\n            <div class=\"container\">\n                <div class=\"page-size\">\n                    <wcs-select placeholder=\"Eléments par page\"\n                                class=\"available-page-sizes\"\n                                aria-labelledby=\"elements-per-page-number elements-per-page-text\"\n                                value={this.pageSize}\n                                onWcsChange={this.onChangePageSize.bind(this)}>\n                        {\n                            this.availablePageSizes.map((pageSize) =>\n                                <wcs-select-option value={pageSize}>{pageSize}</wcs-select-option>\n                            )\n                        }\n                    </wcs-select>\n                    <span id=\"elements-per-page-number\" hidden>{this.pageSize}</span>\n                    <span id=\"elements-per-page-text\">    \n                        <slot name=\"elements-per-page-text\">\n                            <span> éléments par page</span>\n                        </slot>\n                    </span>\n                </div>\n\n                <div class=\"items-count\">\n                    <p>{this.itemsCount}\n                        <slot name=\"items-count-text\">\n                            <span> éléments</span>\n                        </slot>\n                    </p>\n                </div>\n\n                <nav aria-label=\"pagination\" ref={(el) => (this.nativeNav = el)} {...this.inheritedAttributes}>\n                    <ul class=\"page-management\">\n                        <li class=\"pagination-arrow\" onClick={this.firstPage.bind(this)}>\n                            <GridPaginationArrow active={this.canGoToPreviousPage()} order=\"previous\" double></GridPaginationArrow>\n                        </li>\n                        <li class=\"pagination-arrow\" onClick={this.previousPage.bind(this)}>\n                            <GridPaginationArrow active={this.canGoToPreviousPage()} order=\"previous\"></GridPaginationArrow>\n                        </li>\n    \n                        <li class=\"pagination-counter\">\n                            <span aria-label={`Page ${this.currentPage + 1} sur ${this.pageCount}`} aria-current=\"page\">\n                                {this.currentPage + 1} / {this.pageCount}\n                            </span>\n                        </li>\n    \n                        <li class=\"pagination-arrow\" onClick={this.nextPage.bind(this)}>\n                            <GridPaginationArrow active={this.canGoToNextPage()} order=\"next\"></GridPaginationArrow>\n                        </li>\n                        <li class=\"pagination-arrow\" onClick={this.lastPage.bind(this)}>\n                            <GridPaginationArrow active={this.canGoToNextPage()} order=\"next\" double></GridPaginationArrow>\n                        </li>\n                    </ul>\n                </nav>\n            </div>\n        </Host>)\n    }\n}\n"],"version":3}

package/dist/esm/{helpers-89faa1b1.js → helpers-2d73ee7c.js}

@@ -132,13 +132,6 @@ function setOrRemoveAttribute(el, attr, value) {
         }
     }
 }
-const findItemLabel = (componentEl) => {
-    const itemEl = componentEl.closest('wcs-form-field');
-    if (itemEl) {
-        return itemEl.querySelector('wcs-label');
-    }
-    return null;
-};
 /**
  * Given two lists of items, this function will return the items that were removed, kept, and added compared to the source list.
  * @param sourceList - The source list of items
@@ -264,6 +257,6 @@ function parseCssTimeValueToMilliseconds(timeValue) {
     return match[2] === 's' ? value * 1000 : value;
 }
 
-export { compareLists as A, findItemLabel as B, isElement as C, hasShadowDom as D, inheritAttributes as a, isEscapeKey as b, isSpaceKey as c, isEnterKey as d, isKeyup as e, isKeydown as f, getCssRootPropertyValue as g, isHomeKey as h, inheritAriaAttributes as i, isEndKey as j, clickTargetIsElementOrChildren as k, isPageUpKey as l, isPageDownKey as m, isTabKey as n, isMouseEvent as o, parseCssTimeValueToMilliseconds as p, clickInsideElement as q, debounceEvent as r, setOrRemoveAttribute as s, isDownArrowKey as t, isRightArrowKey as u, isUpArrowKey as v, isLeftArrowKey as w, raf as x, normalizeWhitespace as y, generateUniqueId as z };
+export { compareLists as A, isElement as B, hasShadowDom as C, inheritAttributes as a, isEscapeKey as b, isSpaceKey as c, isEnterKey as d, isKeyup as e, isKeydown as f, getCssRootPropertyValue as g, isHomeKey as h, inheritAriaAttributes as i, isEndKey as j, clickTargetIsElementOrChildren as k, isPageUpKey as l, isPageDownKey as m, isTabKey as n, isMouseEvent as o, parseCssTimeValueToMilliseconds as p, clickInsideElement as q, debounceEvent as r, setOrRemoveAttribute as s, isDownArrowKey as t, isRightArrowKey as u, isUpArrowKey as v, isLeftArrowKey as w, raf as x, normalizeWhitespace as y, generateUniqueId as z };
 
-//# sourceMappingURL=helpers-89faa1b1.js.map
+//# sourceMappingURL=helpers-2d73ee7c.js.map

package/dist/esm/helpers-2d73ee7c.js.map

@@ -0,0 +1 @@
+{"file":"helpers-2d73ee7c.js","mappings":"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","names":[],"sources":["src/utils/helpers.ts"],"sourcesContent":["import { EventEmitter } from '@stencil/core';\n\nexport function isElement(element: any): element is Element {\n    return 'clientWidth' in element\n        && 'clientHeight' in element;\n}\n\nexport function hasShadowDom(el: HTMLElement) {\n    return !!el.shadowRoot && !!(el as any).attachShadow;\n}\n\nexport const debounceEvent = (event: EventEmitter, wait: number): EventEmitter => {\n    const original = (event as any)._original || event;\n    return {\n        _original: event,\n        emit: debounce(original.emit.bind(original), wait)\n    } as EventEmitter;\n};\n\nexport const debounce = (func: (...args: any[]) => void, wait = 0) => {\n    let timer: any;\n    return (...args: any[]): any => {\n        clearTimeout(timer);\n        timer = setTimeout(func, wait, ...args);\n    };\n};\n\n/**\n * Elements inside of web components sometimes need to inherit global attributes\n * set on the host. For example, the inner input in `wcs-input` should inherit\n * the `title` attribute that developers set directly on `wcs-input`. This\n * helper function should be called in componentWillLoad and assigned to a variable\n * that is later used in the render function.\n *\n * This does not need to be reactive as changing attributes on the host element\n * does not trigger a re-render.\n */\nexport const inheritAttributes = (el: HTMLElement, attributes: string[] = []) => {\n    const attributeObject: { [k: string]: any } = {};\n\n    attributes.forEach(attr => {\n        if (el.hasAttribute(attr)) {\n            const value = el.getAttribute(attr);\n            if (value !== null) {\n                attributeObject[attr] = el.getAttribute(attr);\n            }\n            el.removeAttribute(attr);\n        }\n    });\n\n    return attributeObject;\n}\n\n/**\n * List of available ARIA attributes + `role`.\n * Removed deprecated attributes.\n * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes\n */\nconst ariaAttributes = [\n    'role',\n    'aria-activedescendant',\n    'aria-atomic',\n    'aria-autocomplete',\n    'aria-braillelabel',\n    'aria-brailleroledescription',\n    'aria-busy',\n    'aria-checked',\n    'aria-colcount',\n    'aria-colindex',\n    'aria-colindextext',\n    'aria-colspan',\n    'aria-controls',\n    'aria-current',\n    'aria-describedby',\n    'aria-description',\n    'aria-details',\n    'aria-disabled',\n    'aria-errormessage',\n    'aria-expanded',\n    'aria-flowto',\n    'aria-haspopup',\n    'aria-hidden',\n    'aria-invalid',\n    'aria-keyshortcuts',\n    'aria-label',\n    'aria-labelledby',\n    'aria-level',\n    'aria-live',\n    'aria-multiline',\n    'aria-multiselectable',\n    'aria-orientation',\n    'aria-owns',\n    'aria-placeholder',\n    'aria-posinset',\n    'aria-pressed',\n    'aria-readonly',\n    'aria-relevant',\n    'aria-required',\n    'aria-roledescription',\n    'aria-rowcount',\n    'aria-rowindex',\n    'aria-rowindextext',\n    'aria-rowspan',\n    'aria-selected',\n    'aria-setsize',\n    'aria-sort',\n    'aria-valuemax',\n    'aria-valuemin',\n    'aria-valuenow',\n    'aria-valuetext',\n];\n\n/**\n * Returns an array of aria attributes that should be copied from\n * the shadow host element to a target within the light DOM.\n * @param el The element that the attributes should be copied from.\n * @param ignoreList The list of aria-attributes to ignore reflecting and removing from the host.\n * Use this in instances where we manually specify aria attributes on the `<Host>` element.\n */\nexport const inheritAriaAttributes = (el: HTMLElement, ignoreList?: string[]) => {\n    let attributesToInherit = ariaAttributes;\n    if (ignoreList && ignoreList.length > 0) {\n        attributesToInherit = attributesToInherit.filter((attr) => !ignoreList.includes(attr));\n    }\n    return inheritAttributes(el, attributesToInherit);\n};\n\n/**\n * Dynamically add or remove an attribute on the element.\n * If the value of the attribute is null or undefined, the attribute is removed.\n *\n * @param el - The HTMLElement\n * @param attr - The attribute to be added or removed\n * @param value - The value of the attribute\n */\nexport function setOrRemoveAttribute(el: HTMLElement, attr: string, value: string | null | undefined) {\n    if (el) {\n        if (value === undefined || value === null) {\n            el.removeAttribute(attr);\n        } else {\n            el.setAttribute(attr, value);\n        }\n    }\n}\n\nexport const findItemLabel = (componentEl: HTMLElement): HTMLWcsLabelElement | null => {\n    const itemEl = componentEl.closest('wcs-form-field');\n    if (itemEl) {\n        return itemEl.querySelector('wcs-label');\n    }\n    return null;\n};\n\n/**\n * Given two lists of items, this function will return the items that were removed, kept, and added compared to the source list.\n * @param sourceList - The source list of items\n * @param newList - The target list of items\n * @param compareFn - The function to compare the items\n */\nexport const compareLists: <T>(sourceList: T[], newList: T[], compareFn: (v1: T, v2: T) => boolean) => {\n    removed: T[];\n    kept: T[];\n    added: T[]\n} = <T>(sourceList: T[], newList: T[], compareFn: (v1: T, v2: T) => boolean) => {\n    const removed = sourceList.filter(val => !newList.some(newVal => compareFn(val, newVal)));\n    const kept = sourceList.filter(val => newList.some(newVal => compareFn(val, newVal)));\n    const added = newList.filter(val => !sourceList.some(sourceVal => compareFn(val, sourceVal)));\n\n    return { removed, kept, added };\n};\n\n/**\n * Normalizes whitespace by replacing multiple consecutive whitespace characters \n * with a single space and removes leading and trailing whitespace.\n * \n * @param content - String potentially containing multiple whitespace characters to normalize, if the content is null or undefined, it will return an empty string.\n * @returns Normalized string where sequences of whitespace are replaced by a single space.\n * \n * @example\n * normalizeWhitespace(\"  Text   with    spaces  \") // Returns \"Text with spaces\"\n */\nexport function normalizeWhitespace(content: string): string {\n    return content?.replace(/\\s+/g, ' ')?.trim() ?? '';\n}\n\ndeclare const __zone_symbol__requestAnimationFrame: any;\n\n/**\n * Patched version of requestAnimationFrame that avoids ngzone\n * Use only when you know ngzone should not run\n */\nexport const raf = (h: any) => {\n    if (typeof __zone_symbol__requestAnimationFrame === 'function') {\n        return __zone_symbol__requestAnimationFrame(h);\n    }\n    if (typeof requestAnimationFrame === 'function') {\n        return requestAnimationFrame(h);\n    }\n    return setTimeout(h);\n};\n\n/**\n * Return true if the mouseEvent click is inside the given HTML element\n */\nexport const clickInsideElement = (event: MouseEvent, element: HTMLElement): boolean => {\n    return event.x >= element.getBoundingClientRect().x && event.x <= element.getBoundingClientRect().x + element.getBoundingClientRect().width\n        && event.y >= element.getBoundingClientRect().y && event.y <= element.getBoundingClientRect().y + element.getBoundingClientRect().height;\n}\n\nexport const clickTargetIsElementOrChildren = (mouseEvent: MouseEvent, element: HTMLElement) => {\n    return mouseEvent.target instanceof Node\n        && element.contains(mouseEvent.target);\n}\n\nexport function generateUniqueId(componentName: string): string {\n    return componentName + \"-\" + Math.random().toString(36);\n}\n\n/**\n * `clientX` property doesn't exist on KeyboardEvent, we therefore deduce it's a MouseEvent.\n */\nexport function isMouseEvent(event: MouseEvent | KeyboardEvent): event is MouseEvent {\n    return 'clientX' in event;\n}\n\nexport function isKeyup(evt: KeyboardEvent) {\n    return evt.code === 'ArrowUp';\n}\n\nexport function isKeydown(evt: KeyboardEvent) {\n    return evt.code === 'ArrowDown';\n}\n\nexport function isEscapeKey(evt: KeyboardEvent) {\n    return evt.code === 'Escape';\n}\n\nexport function isSpaceKey(evt: KeyboardEvent) {\n    return evt.code === 'Space';\n}\n\nexport function isEnterKey(evt: KeyboardEvent) {\n    return evt.key === 'Enter';\n}\n\nexport function isHomeKey(evt: KeyboardEvent) {\n    return evt.code === 'Home';\n}\n\nexport function isEndKey(evt: KeyboardEvent) {\n    return evt.code === 'End';\n}\n\nexport function isUpArrowKey(evt: KeyboardEvent) {\n    return evt.key === 'ArrowUp';\n}\n\nexport function isDownArrowKey(evt: KeyboardEvent) {\n    return evt.key === 'ArrowDown';\n}\n\nexport function isLeftArrowKey(evt: KeyboardEvent) {\n    return evt.key === 'ArrowLeft';\n}\n\nexport function isRightArrowKey(evt: KeyboardEvent) {\n    return evt.key === 'ArrowRight';\n}\n\nexport function isPageDownKey(evt: KeyboardEvent) {\n    return evt.key === 'PageDown';\n}\n\nexport function isPageUpKey(evt: KeyboardEvent) {\n    return evt.key === 'PageUp';\n}\n\nexport function isTabKey(evt: KeyboardEvent) {\n    return evt.key === 'Tab';\n}\n\nexport function isCtrlA(evt: KeyboardEvent) {\n    return evt.key === 'a' && evt.ctrlKey;\n}\n\nexport function getCssRootPropertyValue(name: string): string | null {\n    return window.getComputedStyle(document.body).getPropertyValue(name) || null;\n}\n\n/**\n * Converts a CSS time value string (e.g., '150ms', '1.5s') into milliseconds\n * @param {string} timeValue - The CSS time value string\n * @returns {number} Time in milliseconds\n */\nexport function parseCssTimeValueToMilliseconds(timeValue: string): number {\n    if (!timeValue) return 0;\n\n    const TIME_REGEX = /^([\\d.]+)(?:(ms|s))?$/;\n\n    const trimmedValue = timeValue.trim();\n    if (!/^\\d/.test(trimmedValue)) return 0;\n\n    const match = TIME_REGEX.exec(trimmedValue);\n    if (!match) return 0;\n\n    const value = Number(match[1]);\n    if (!Number.isFinite(value)) return 0;\n\n    return match[2] === 's' ? value * 1000 : value;\n}\n"],"version":3}

package/dist/esm/{keyboard-event-dd35bb6b.js → keyboard-event-3a0579d5.js}

@@ -1,4 +1,4 @@
-import { h as isHomeKey, j as isEndKey, l as isPageUpKey, m as isPageDownKey, d as isEnterKey, c as isSpaceKey, n as isTabKey, b as isEscapeKey } from './helpers-89faa1b1.js';
+import { h as isHomeKey, j as isEndKey, l as isPageUpKey, m as isPageDownKey, d as isEnterKey, c as isSpaceKey, n as isTabKey, b as isEscapeKey } from './helpers-2d73ee7c.js';
 
 /**
  * Convert a {@link KeyboardEvent} into a {@link KeyboardShortcut}
@@ -75,4 +75,4 @@ function keyboardShortcutFromKeyboardEvent(event) {
 
 export { keyboardShortcutFromKeyboardEvent as k };
 
-//# sourceMappingURL=keyboard-event-dd35bb6b.js.map
+//# sourceMappingURL=keyboard-event-3a0579d5.js.map

package/dist/esm/{keyboard-event-dd35bb6b.js.map → keyboard-event-3a0579d5.js.map}

@@ -1 +1 @@
-{"file":"keyboard-event-dd35bb6b.js","mappings":";;AAmBA;;;;;SAKgB,iCAAiC,CAAC,KAAoB;IAClE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC;IAEtB,IAAI,KAAK,CAAC,QAAQ,EAAE;QAChB,QAAQ,GAAG;YACP,KAAK,GAAG;gBACJ,OAAO,WAAW,CAAC;YACvB,KAAK,KAAK;gBACN,OAAO,SAAS,CAAC;SACxB;KACJ;SAAM,IAAI,KAAK,CAAC,MAAM,EAAE;QACrB,QAAQ,GAAG;YACP,KAAK,WAAW;gBACZ,OAAO,gBAAgB,CAAC;YAC5B,KAAK,SAAS;gBACV,OAAO,cAAc,CAAC;SAC7B;KACJ;SAAM,IAAI,KAAK,CAAC,OAAO,EAAE;QACtB,IAAG,SAAS,CAAC,KAAK,CAAC,EAAE;YACjB,OAAO,WAAW,CAAC;SACtB;aAAM,IAAG,QAAQ,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO,UAAU,CAAC;SACrB;aAAM,IAAI,GAAG,KAAK,GAAG,EAAE;YACpB,OAAO,QAAQ,CAAC;SACnB;KACJ;SAAM;QACH,QAAQ,GAAG;YACP,KAAK,WAAW;gBACZ,OAAO,YAAY,CAAC;YACxB,KAAK,SAAS;gBACV,OAAO,UAAU,CAAC;YACtB,KAAK,WAAW;gBACZ,OAAO,YAAY,CAAC;YACxB,KAAK,YAAY;gBACb,OAAO,aAAa,CAAC;SAC5B;QAED,IAAG,SAAS,CAAC,KAAK,CAAC,EAAE;YACjB,OAAO,MAAM,CAAC;SACjB;aAAM,IAAI,QAAQ,CAAC,KAAK,CAAC,EAAE;YACxB,OAAO,KAAK,CAAC;SAChB;aAAM,IAAG,WAAW,CAAC,KAAK,CAAC,EAAE;YAC1B,OAAO,SAAS,CAAC;SACpB;aAAM,IAAG,aAAa,CAAC,KAAK,CAAC,EAAE;YAC5B,OAAO,WAAW,CAAC;SACtB;aAAM,IAAG,UAAU,CAAC,KAAK,CAAC,EAAE;YACzB,OAAO,OAAO,CAAC;SAClB;aAAM,IAAG,UAAU,CAAC,KAAK,CAAC,EAAE;YACzB,OAAO,OAAO,CAAC;SAClB;aAAM,IAAG,QAAQ,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO,KAAK,CAAC;SAChB;aAAM,IAAI,WAAW,CAAC,KAAK,CAAC,EAAE;YAC3B,OAAO,QAAQ,CAAC;SACnB;KACJ;IAED,OAAO,SAAS,CAAC;AACrB;;;;","names":[],"sources":["src/utils/keyboard-event.ts"],"sourcesContent":["import {\n    isEndKey,\n    isEnterKey,\n    isEscapeKey,\n    isHomeKey,\n    isPageDownKey,\n    isPageUpKey,\n    isSpaceKey,\n    isTabKey\n} from \"./helpers\";\n\ntype KeyboardShortcutCtrl = 'CTRL+A' | 'CTRL+HOME' | 'CTRL+END';\ntype KeyboardShortcutAlt = 'ALT+DOWN_ARROW' | 'ALT+UP_ARROW';\ntype KeyboardShortcutMaj = 'MAJ+TAB' | 'MAJ+SPACE';\ntype KeyboardShortcutDirectional = 'DOWN_ARROW' | 'UP_ARROW' | 'LEFT_ARROW' | 'RIGHT_ARROW';\ntype KeyboardShortcutOthers = 'HOME' | 'END' | 'PAGE_UP' | 'PAGE_DOWN' | 'ENTER' | 'SPACE' | 'TAB' | 'ESCAPE';\n\nexport type KeyboardShortcut = KeyboardShortcutCtrl | KeyboardShortcutAlt | KeyboardShortcutMaj | KeyboardShortcutDirectional | KeyboardShortcutOthers | 'UNKNOWN';\n\n/**\n * Convert a {@link KeyboardEvent} into a {@link KeyboardShortcut}\n * @param event - KeyboardEvent\n * @returns The corresponding {@link KeyboardShortcut}\n */\nexport function keyboardShortcutFromKeyboardEvent(event: KeyboardEvent): KeyboardShortcut {\n    const { key } = event;\n\n    if (event.shiftKey) {\n        switch (key) {\n            case ' ':\n                return 'MAJ+SPACE';\n            case 'Tab':\n                return 'MAJ+TAB';\n        }\n    } else if (event.altKey) {\n        switch (key) {\n            case 'ArrowDown':\n                return 'ALT+DOWN_ARROW';\n            case 'ArrowUp':\n                return 'ALT+UP_ARROW';\n        }\n    } else if (event.ctrlKey) {\n        if(isHomeKey(event)) {\n            return 'CTRL+HOME';\n        } else if(isEndKey(event)) {\n            return 'CTRL+END';\n        } else if (key === 'a') {\n            return 'CTRL+A';\n        }\n    } else {\n        switch (key) {\n            case 'ArrowDown':\n                return 'DOWN_ARROW';\n            case 'ArrowUp':\n                return 'UP_ARROW';\n            case 'ArrowLeft':\n                return 'LEFT_ARROW';\n            case 'ArrowRight':\n                return 'RIGHT_ARROW';\n        }\n\n        if(isHomeKey(event)) {\n            return 'HOME';\n        } else if (isEndKey(event)) {\n            return 'END';\n        } else if(isPageUpKey(event)) {\n            return 'PAGE_UP';\n        } else if(isPageDownKey(event)) {\n            return 'PAGE_DOWN';\n        } else if(isEnterKey(event)) {\n            return 'ENTER';\n        } else if(isSpaceKey(event)) {\n            return 'SPACE';\n        } else if(isTabKey(event)) {\n            return 'TAB';\n        } else if (isEscapeKey(event)) {\n            return 'ESCAPE';\n        }\n    }\n\n    return 'UNKNOWN';\n}\n"],"version":3}
+{"file":"keyboard-event-3a0579d5.js","mappings":";;AAmBA;;;;;SAKgB,iCAAiC,CAAC,KAAoB;IAClE,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC;IAEtB,IAAI,KAAK,CAAC,QAAQ,EAAE;QAChB,QAAQ,GAAG;YACP,KAAK,GAAG;gBACJ,OAAO,WAAW,CAAC;YACvB,KAAK,KAAK;gBACN,OAAO,SAAS,CAAC;SACxB;KACJ;SAAM,IAAI,KAAK,CAAC,MAAM,EAAE;QACrB,QAAQ,GAAG;YACP,KAAK,WAAW;gBACZ,OAAO,gBAAgB,CAAC;YAC5B,KAAK,SAAS;gBACV,OAAO,cAAc,CAAC;SAC7B;KACJ;SAAM,IAAI,KAAK,CAAC,OAAO,EAAE;QACtB,IAAG,SAAS,CAAC,KAAK,CAAC,EAAE;YACjB,OAAO,WAAW,CAAC;SACtB;aAAM,IAAG,QAAQ,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO,UAAU,CAAC;SACrB;aAAM,IAAI,GAAG,KAAK,GAAG,EAAE;YACpB,OAAO,QAAQ,CAAC;SACnB;KACJ;SAAM;QACH,QAAQ,GAAG;YACP,KAAK,WAAW;gBACZ,OAAO,YAAY,CAAC;YACxB,KAAK,SAAS;gBACV,OAAO,UAAU,CAAC;YACtB,KAAK,WAAW;gBACZ,OAAO,YAAY,CAAC;YACxB,KAAK,YAAY;gBACb,OAAO,aAAa,CAAC;SAC5B;QAED,IAAG,SAAS,CAAC,KAAK,CAAC,EAAE;YACjB,OAAO,MAAM,CAAC;SACjB;aAAM,IAAI,QAAQ,CAAC,KAAK,CAAC,EAAE;YACxB,OAAO,KAAK,CAAC;SAChB;aAAM,IAAG,WAAW,CAAC,KAAK,CAAC,EAAE;YAC1B,OAAO,SAAS,CAAC;SACpB;aAAM,IAAG,aAAa,CAAC,KAAK,CAAC,EAAE;YAC5B,OAAO,WAAW,CAAC;SACtB;aAAM,IAAG,UAAU,CAAC,KAAK,CAAC,EAAE;YACzB,OAAO,OAAO,CAAC;SAClB;aAAM,IAAG,UAAU,CAAC,KAAK,CAAC,EAAE;YACzB,OAAO,OAAO,CAAC;SAClB;aAAM,IAAG,QAAQ,CAAC,KAAK,CAAC,EAAE;YACvB,OAAO,KAAK,CAAC;SAChB;aAAM,IAAI,WAAW,CAAC,KAAK,CAAC,EAAE;YAC3B,OAAO,QAAQ,CAAC;SACnB;KACJ;IAED,OAAO,SAAS,CAAC;AACrB;;;;","names":[],"sources":["src/utils/keyboard-event.ts"],"sourcesContent":["import {\n    isEndKey,\n    isEnterKey,\n    isEscapeKey,\n    isHomeKey,\n    isPageDownKey,\n    isPageUpKey,\n    isSpaceKey,\n    isTabKey\n} from \"./helpers\";\n\ntype KeyboardShortcutCtrl = 'CTRL+A' | 'CTRL+HOME' | 'CTRL+END';\ntype KeyboardShortcutAlt = 'ALT+DOWN_ARROW' | 'ALT+UP_ARROW';\ntype KeyboardShortcutMaj = 'MAJ+TAB' | 'MAJ+SPACE';\ntype KeyboardShortcutDirectional = 'DOWN_ARROW' | 'UP_ARROW' | 'LEFT_ARROW' | 'RIGHT_ARROW';\ntype KeyboardShortcutOthers = 'HOME' | 'END' | 'PAGE_UP' | 'PAGE_DOWN' | 'ENTER' | 'SPACE' | 'TAB' | 'ESCAPE';\n\nexport type KeyboardShortcut = KeyboardShortcutCtrl | KeyboardShortcutAlt | KeyboardShortcutMaj | KeyboardShortcutDirectional | KeyboardShortcutOthers | 'UNKNOWN';\n\n/**\n * Convert a {@link KeyboardEvent} into a {@link KeyboardShortcut}\n * @param event - KeyboardEvent\n * @returns The corresponding {@link KeyboardShortcut}\n */\nexport function keyboardShortcutFromKeyboardEvent(event: KeyboardEvent): KeyboardShortcut {\n    const { key } = event;\n\n    if (event.shiftKey) {\n        switch (key) {\n            case ' ':\n                return 'MAJ+SPACE';\n            case 'Tab':\n                return 'MAJ+TAB';\n        }\n    } else if (event.altKey) {\n        switch (key) {\n            case 'ArrowDown':\n                return 'ALT+DOWN_ARROW';\n            case 'ArrowUp':\n                return 'ALT+UP_ARROW';\n        }\n    } else if (event.ctrlKey) {\n        if(isHomeKey(event)) {\n            return 'CTRL+HOME';\n        } else if(isEndKey(event)) {\n            return 'CTRL+END';\n        } else if (key === 'a') {\n            return 'CTRL+A';\n        }\n    } else {\n        switch (key) {\n            case 'ArrowDown':\n                return 'DOWN_ARROW';\n            case 'ArrowUp':\n                return 'UP_ARROW';\n            case 'ArrowLeft':\n                return 'LEFT_ARROW';\n            case 'ArrowRight':\n                return 'RIGHT_ARROW';\n        }\n\n        if(isHomeKey(event)) {\n            return 'HOME';\n        } else if (isEndKey(event)) {\n            return 'END';\n        } else if(isPageUpKey(event)) {\n            return 'PAGE_UP';\n        } else if(isPageDownKey(event)) {\n            return 'PAGE_DOWN';\n        } else if(isEnterKey(event)) {\n            return 'ENTER';\n        } else if(isSpaceKey(event)) {\n            return 'SPACE';\n        } else if(isTabKey(event)) {\n            return 'TAB';\n        } else if (isEscapeKey(event)) {\n            return 'ESCAPE';\n        }\n    }\n\n    return 'UNKNOWN';\n}\n"],"version":3}

package/dist/esm/loader.js

@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-0f993ce5.js';
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await globalScripts();
-  return bootstrapLazy(JSON.parse("[[\"wcs-editable-field\",[[1,\"wcs-editable-field\",{\"type\":[1],\"label\":[1],\"readonly\":[516],\"value\":[1032],\"validateFn\":[16],\"formatFn\":[16],\"errorMsg\":[1,\"error-msg\"],\"size\":[513],\"currentState\":[32],\"isError\":[32]},[[8,\"click\",\"onWindowClickEvent\"]],{\"value\":[\"onValueChange\"]}]]],[\"wcs-grid-pagination\",[[1,\"wcs-grid-pagination\",{\"availablePageSizes\":[16],\"currentPage\":[1026,\"current-page\"],\"pageSize\":[2,\"page-size\"],\"itemsCount\":[2,\"items-count\"],\"pageCount\":[2,\"page-count\"],\"setAriaAttribute\":[64]}]]],[\"wcs-alert-drawer\",[[1,\"wcs-alert-drawer\",{\"position\":[513],\"timeout\":[2],\"showProgressBar\":[4,\"show-progress-bar\"],\"show\":[64]}]]],[\"wcs-horizontal-stepper\",[[1,\"wcs-horizontal-stepper\",{\"currentStep\":[1026,\"current-step\"],\"steps\":[16],\"mode\":[1],\"checkOnComplete\":[516,\"check-on-complete\"],\"internalCurrentStepIndex\":[32],\"previous\":[64],\"next\":[64]},null,{\"currentStep\":[\"onCurrentStepChange\"]}]]],[\"wcs-breadcrumb\",[[1,\"wcs-breadcrumb\",{\"maxItems\":[2,\"max-items\"],\"itemsBeforeCollapse\":[2,\"items-before-collapse\"],\"itemsAfterCollapse\":[2,\"items-after-collapse\"],\"ariaLabelExpandButton\":[1,\"aria-label-expand-button\"],\"showHiddenItems\":[32],\"setAriaAttribute\":[64]},null,{\"maxItems\":[\"handleCollapsePropsChange\"],\"itemsBeforeCollapse\":[\"handleCollapsePropsChange\"],\"itemsAfterCollapse\":[\"handleCollapsePropsChange\"],\"ariaLabelExpandButton\":[\"handleAriaLabelExpandBtnChange\"]}]]],[\"wcs-counter\",[[17,\"wcs-counter\",{\"size\":[513],\"label\":[1],\"disabled\":[516],\"min\":[1026],\"max\":[1026],\"step\":[1026],\"value\":[1026],\"displayedValue\":[32],\"setAriaAttribute\":[64]},null,{\"value\":[\"valueChange\"]}]]],[\"wcs-grid\",[[1,\"wcs-grid\",{\"serverMode\":[516,\"server-mode\"],\"data\":[16],\"loading\":[516],\"selectionConfig\":[1,\"selection-config\"],\"selectedItems\":[8,\"selected-items\"],\"wcsGridPaginationId\":[1,\"wcs-grid-pagination-id\"],\"rowIdPath\":[1,\"row-id-path\"],\"rowCssPartsFn\":[16],\"columns\":[32],\"paginationEl\":[32],\"rows\":[32],\"cursorPosition\":[32],\"focusFirstCell\":[64],\"setAriaAttribute\":[64]},[[0,\"focus\",\"onFocus\"],[0,\"blur\",\"onBlur\"],[0,\"wcsHiddenChange\",\"onHiddenColumnChange\"],[0,\"keydown\",\"onKeyDown\"],[1,\"mousedown\",\"onClick\"],[0,\"wcsSortChange\",\"sortChangeEventHandler\"],[0,\"wcsGridPaginationChange\",\"paginationChangeEventHandler\"],[8,\"wcsGridPaginationChange\",\"paginationChangeEventHandlerOutside\"]],{\"cursorPosition\":[\"onCursorPositionChange\"],\"data\":[\"onDataChange\"],\"selectedItems\":[\"onSelectedItemsPropertyChange\"]}]]],[\"wcs-modal\",[[4,\"wcs-modal\",{\"withoutBackdrop\":[516,\"without-backdrop\"],\"show\":[1540],\"showCloseButton\":[516,\"show-close-button\"],\"closeButtonAriaLabel\":[1,\"close-button-aria-label\"],\"size\":[1],\"hideActions\":[516,\"hide-actions\"],\"modalTriggerControlsId\":[1,\"modal-trigger-controls-id\"],\"initialFocusElementId\":[1,\"initial-focus-element-id\"],\"disableAutoFocus\":[516,\"disable-auto-focus\"],\"setAriaAttribute\":[64]},[[4,\"keydown\",\"onKeyDown\"]],{\"show\":[\"onShowChange\"]}]]],[\"wcs-dropdown\",[[17,\"wcs-dropdown\",{\"noArrow\":[516,\"no-arrow\"],\"mode\":[1],\"shape\":[1],\"size\":[1],\"disabled\":[516],\"placement\":[1],\"expanded\":[32],\"setAriaAttribute\":[64]},[[0,\"blur\",\"onBlur\"],[8,\"click\",\"onWindowClickEvent\"],[0,\"wcsDropdownItemClick\",\"dropdownItemClick\"],[0,\"keydown\",\"onKeyDown\"]],{\"placement\":[\"placementChange\"]}]]],[\"wcs-galactic-menu\",[[1,\"wcs-galactic-menu\",{\"text\":[1],\"showPopoverMenu\":[32],\"setAriaAttribute\":[64]},[[8,\"click\",\"onWindowClickEvent\"],[0,\"keydown\",\"onKeyDown\"]]]]],[\"wcs-input\",[[17,\"wcs-input\",{\"fireFocusEvents\":[4,\"fire-focus-events\"],\"accept\":[1],\"autocapitalize\":[1],\"autocomplete\":[1],\"autocorrect\":[1],\"autofocus\":[4],\"debounce\":[2],\"prefixLabel\":[1,\"prefix-label\"],\"suffixLabel\":[1,\"suffix-label\"],\"disabled\":[516],\"enterkeyhint\":[1],\"size\":[513],\"icon\":[1],\"inputmode\":[1],\"max\":[1],\"maxlength\":[2],\"min\":[1],\"minlength\":[2],\"multiple\":[516],\"name\":[1],\"hidePasswordButtonAriaLabel\":[1,\"hide-password-button-aria-label\"],\"showPasswordButtonAriaLabel\":[1,\"show-password-button-aria-label\"],\"pattern\":[1],\"placeholder\":[1],\"readonly\":[516],\"required\":[516],\"spellcheck\":[4],\"state\":[513],\"step\":[1],\"type\":[1],\"value\":[1032],\"passwordReveal\":[32],\"setBlur\":[64],\"getInputElement\":[64],\"setAriaAttribute\":[64]},null,{\"debounce\":[\"debounceChanged\"],\"passwordReveal\":[\"onPasswordRevealChange\"]}]]],[\"wcs-textarea\",[[17,\"wcs-textarea\",{\"fireFocusEvents\":[4,\"fire-focus-events\"],\"autocapitalize\":[1],\"autofocus\":[4],\"debounce\":[2],\"disabled\":[516],\"icon\":[1],\"inputmode\":[1],\"enterkeyhint\":[1],\"maxlength\":[2],\"minlength\":[2],\"name\":[1],\"placeholder\":[1],\"readonly\":[516],\"required\":[516],\"spellcheck\":[4],\"state\":[513],\"cols\":[2],\"rows\":[2],\"wrap\":[1],\"autoGrow\":[516,\"auto-grow\"],\"value\":[1025],\"resize\":[513],\"setAriaAttribute\":[64],\"fitContent\":[64],\"setBlur\":[64],\"getInputElement\":[64]},null,{\"debounce\":[\"debounceChanged\"],\"value\":[\"valueChanged\"]}]]],[\"wcs-accordion\",[[1,\"wcs-accordion\",{\"hideActionText\":[516,\"hide-action-text\"],\"highlight\":[516],\"groupContentWithHeader\":[516,\"group-content-with-header\"],\"multiExpandable\":[4,\"multi-expandable\"]},[[0,\"wcsOpenChange\",\"wcsOpenChangeHandler\"]],{\"hideActionText\":[\"updateHideActiontextOnPanel\"],\"highlight\":[\"updateHighlightOnPanel\"],\"groupContentWithHeader\":[\"updateGroupContentWithHeader\"]}]]],[\"wcs-accordion-content\",[[1,\"wcs-accordion-content\"]]],[\"wcs-accordion-header\",[[1,\"wcs-accordion-header\"]]],[\"wcs-accordion-panel\",[[1,\"wcs-accordion-panel\",{\"open\":[1540],\"hideActionText\":[516,\"hide-action-text\"],\"highlight\":[516],\"groupContentWithHeader\":[516,\"group-content-with-header\"],\"setAriaAttribute\":[64],\"close\":[64]},null,{\"open\":[\"openChange\"]}]]],[\"wcs-action-bar\",[[1,\"wcs-action-bar\",{\"gutter\":[516],\"hasTabs\":[32]}]]],[\"wcs-app\",[[1,\"wcs-app\"]]],[\"wcs-badge\",[[1,\"wcs-badge\",{\"shape\":[1],\"color\":[1],\"size\":[513]}]]],[\"wcs-breadcrumb-item\",[[1,\"wcs-breadcrumb-item\",{\"last\":[4]}]]],[\"wcs-card\",[[1,\"wcs-card\",{\"mode\":[1537],\"orientation\":[513]},null,{\"orientation\":[\"orientationChanged\"]}]]],[\"wcs-card-body\",[[1,\"wcs-card-body\",{\"orientation\":[32],\"setOrientation\":[64]}]]],[\"wcs-card-content\",[[1,\"wcs-card-content\"]]],[\"wcs-card-footer\",[[1,\"wcs-card-footer\"]]],[\"wcs-card-header\",[[1,\"wcs-card-header\"]]],[\"wcs-card-media\",[[1,\"wcs-card-media\",{\"orientation\":[32],\"setOrientation\":[64]}]]],[\"wcs-chip\",[[1,\"wcs-chip\",{\"value\":[1],\"label\":[1],\"selected\":[516],\"open\":[516],\"disabled\":[516],\"variant\":[513],\"mode\":[513]}]]],[\"wcs-com-nav\",[[1,\"wcs-com-nav\",{\"appName\":[1,\"app-name\"],\"mobileMenuOpen\":[32],\"currentActiveSizing\":[32],\"setAriaAttribute\":[64]},[[0,\"wcsClickOnFinalAction\",\"onClickOnFinalAction\"],[8,\"keydown\",\"exitMobileMenuOnKeyDown\"]]]]],[\"wcs-com-nav-category\",[[1,\"wcs-com-nav-category\",{\"label\":[1],\"categoryOpen\":[32],\"currentActiveSizing\":[32],\"setAriaAttribute\":[64],\"close\":[64],\"open\":[64]},[[8,\"click\",\"onWindowClickEvent\"],[8,\"wcsCategoryOpened\",\"onSubmenuOpened\"]]]]],[\"wcs-com-nav-item\",[[1,\"wcs-com-nav-item\",null,[[0,\"click\",\"onClick\"]]]]],[\"wcs-com-nav-submenu\",[[1,\"wcs-com-nav-submenu\",{\"label\":[1],\"panelTitle\":[1,\"panel-title\"],\"panelDescription\":[1,\"panel-description\"],\"menuOpen\":[32],\"currentActiveSizing\":[32],\"setAriaAttribute\":[64],\"close\":[64],\"open\":[64]},[[8,\"click\",\"onWindowClickEvent\"],[8,\"wcsSubmenuOpened\",\"onSubmenuOpened\"],[8,\"keydown\",\"onEscapeKeyDown\"],[0,\"wcsClickOnFinalAction\",\"wcsCategoryItemClickedHandler\"]]]]],[\"wcs-divider\",[[1,\"wcs-divider\"]]],[\"wcs-dropdown-divider\",[[1,\"wcs-dropdown-divider\"]]],[\"wcs-dropdown-header\",[[1,\"wcs-dropdown-header\"]]],[\"wcs-dropdown-item\",[[4,\"wcs-dropdown-item\",null,[[1,\"mouseup\",\"onMouseUp\"],[0,\"keydown\",\"onKeyDown\"]]]]],[\"wcs-field\",[[1,\"wcs-field\"]]],[\"wcs-field-content\",[[1,\"wcs-field-content\"]]],[\"wcs-field-label\",[[1,\"wcs-field-label\"]]],[\"wcs-footer\",[[1,\"wcs-footer\"]]],[\"wcs-galactic\",[[1,\"wcs-galactic\",{\"text\":[1],\"show\":[32]}]]],[\"wcs-grid-column\",[[1,\"wcs-grid-column\",{\"path\":[1],\"name\":[1],\"sort\":[516],\"sortFn\":[16],\"formatter\":[16],\"sortOrder\":[1025,\"sort-order\"],\"width\":[1],\"customCells\":[516,\"custom-cells\"],\"hidden\":[516],\"cursorPosition\":[16],\"columnPosition\":[2,\"column-position\"],\"setAriaAttribute\":[64]},null,{\"hidden\":[\"parseMyObjectProp\"],\"sortOrder\":[\"sortOrderChange\"]}]]],[\"wcs-grid-custom-cell\",[[1,\"wcs-grid-custom-cell\",{\"columnId\":[1,\"column-id\"],\"rowId\":[8,\"row-id\"]}]]],[\"wcs-header\",[[1,\"wcs-header\",{\"setAriaAttribute\":[64]}]]],[\"wcs-hint\",[[1,\"wcs-hint\",{\"small\":[1540]}]]],[\"wcs-icon\",[[0,\"wcs-icon\",{\"icon\":[1],\"size\":[1],\"setAriaAttribute\":[64]}]]],[\"wcs-list-item\",[[1,\"wcs-list-item\",{\"activated\":[1540]}]]],[\"wcs-list-item-properties\",[[1,\"wcs-list-item-properties\"]]],[\"wcs-list-item-property\",[[1,\"wcs-list-item-property\"]]],[\"wcs-native-select\",[[1,\"wcs-native-select\",{\"size\":[513],\"required\":[516],\"expanded\":[32],\"disabled\":[32],\"setAriaAttribute\":[64],\"updateStyles\":[64]},null,{\"required\":[\"requiredChanged\"]}]]],[\"wcs-nav\",[[1,\"wcs-nav\",{\"setAriaAttribute\":[64]}]]],[\"wcs-nav-item\",[[4,\"wcs-nav-item\",null,[[0,\"keydown\",\"onKeyDown\"]]]]],[\"wcs-progress-radial\",[[1,\"wcs-progress-radial\",{\"size\":[2],\"showLabel\":[516,\"show-label\"],\"value\":[2],\"setAriaAttribute\":[64]}]]],[\"wcs-radio\",[[1,\"wcs-radio\",{\"value\":[1544],\"label\":[1537],\"disabled\":[1540],\"name\":[1025],\"mode\":[513],\"checked\":[32],\"radioTabIndex\":[32],\"updateState\":[64],\"setTabIndex\":[64],\"setAriaAttribute\":[64]}]]],[\"wcs-radio-group\",[[1,\"wcs-radio-group\",{\"value\":[1032],\"name\":[520],\"mode\":[513],\"setAriaAttribute\":[64]},[[0,\"wcsRadioClick\",\"handleRadioClick\"],[0,\"keydown\",\"handleKeyDown\"]],{\"value\":[\"onValueChangeHandler\"],\"name\":[\"updateAllRadioModeAndName\"],\"mode\":[\"updateAllRadioModeAndName\"]}]]],[\"wcs-skeleton-circle\",[[1,\"wcs-skeleton-circle\",{\"animation\":[513],\"radius\":[514]}]]],[\"wcs-skeleton-rectangle\",[[1,\"wcs-skeleton-rectangle\",{\"animation\":[513],\"rounded\":[516],\"height\":[513],\"width\":[513]}]]],[\"wcs-skeleton-text\",[[1,\"wcs-skeleton-text\",{\"animation\":[513],\"height\":[1]}]]],[\"wcs-switch\",[[17,\"wcs-switch\",{\"name\":[1],\"checked\":[516],\"labelAlignment\":[513,\"label-alignment\"],\"disabled\":[516],\"setAriaAttribute\":[64],\"getLabel\":[64]},[[0,\"click\",\"handleHostClick\"]]]]],[\"wcs-tab\",[[1,\"wcs-tab\",{\"header\":[513],\"itemKey\":[8,\"item-key\"]}]]],[\"wcs-tabs\",[[1,\"wcs-tabs\",{\"align\":[513],\"selectedIndex\":[2,\"selected-index\"],\"selectedKey\":[8,\"selected-key\"],\"headersOnly\":[516,\"headers-only\"],\"gutter\":[516],\"description\":[1],\"mobileOverlayExpanded\":[32],\"mobile\":[32],\"headers\":[32],\"currentActiveTabIndex\":[32],\"setAriaAttribute\":[64]},[[0,\"tabLoaded\",\"onTabLoaded\"],[8,\"click\",\"onWindowClickEvent\"]],{\"selectedIndex\":[\"selectedIndexChanged\"],\"selectedKey\":[\"selectedTabkeyChanged\"],\"mobile\":[\"onMobileChange\"]}]]],[\"wcs-tooltip\",[[1,\"wcs-tooltip\",{\"for\":[1],\"position\":[513],\"interactive\":[516],\"maxWidth\":[8,\"max-width\"],\"delay\":[2],\"duration\":[2],\"trigger\":[1],\"theme\":[1],\"content\":[1],\"appendTo\":[1,\"append-to\"],\"hide\":[64],\"show\":[64],\"disable\":[64],\"enable\":[64]},[[8,\"keydown\",\"handleKeyDown\"]],{\"interactive\":[\"updateProps\"],\"position\":[\"updateProps\"],\"maxWidth\":[\"updateProps\"],\"theme\":[\"updateProps\"],\"delay\":[\"updateProps\"],\"duration\":[\"updateProps\"],\"trigger\":[\"updateProps\"],\"content\":[\"updateTippyContent\"]}]]],[\"wcs-alert\",[[1,\"wcs-alert\",{\"show\":[1540],\"intent\":[513],\"timeout\":[2],\"showProgressBar\":[4,\"show-progress-bar\"]},[[1,\"mouseover\",\"mouseOverHandler\"],[1,\"mouseout\",\"mouseOutHandler\"]]]]],[\"wcs-progress-bar\",[[1,\"wcs-progress-bar\",{\"size\":[1],\"showLabel\":[516,\"show-label\"],\"value\":[2],\"setAriaAttribute\":[64]}]]],[\"wcs-checkbox\",[[17,\"wcs-checkbox\",{\"name\":[1],\"indeterminate\":[1540],\"checked\":[1540],\"required\":[4],\"labelAlignment\":[1537,\"label-alignment\"],\"disabled\":[516],\"setAriaAttribute\":[64],\"getLabel\":[64]},[[0,\"click\",\"handleHostClick\"]]]]],[\"wcs-select_2\",[[4,\"wcs-select-option\",{\"disabled\":[1540],\"selected\":[1540],\"highlighted\":[1540],\"value\":[8],\"chipColor\":[1,\"chip-color\"],\"chipBackgroundColor\":[1,\"chip-background-color\"],\"multiple\":[1540]},[[1,\"mouseup\",\"onMouseUp\"],[0,\"keydown\",\"handleKeydown\"]]],[1,\"wcs-select\",{\"size\":[513],\"value\":[1032],\"placeholder\":[1537],\"disabled\":[1540],\"required\":[516],\"multiple\":[516],\"autocomplete\":[516],\"serverMode\":[516,\"server-mode\"],\"filterFn\":[16],\"chips\":[516],\"name\":[1],\"compareWith\":[16],\"expanded\":[32],\"displayText\":[32],\"focused\":[32],\"showNoResultFoundLabel\":[32],\"autocompleteValue\":[32],\"overlayDirection\":[32],\"open\":[64],\"close\":[64],\"setAriaAttribute\":[64]},[[1,\"mouseup\",\"onMouseUp\"],[8,\"click\",\"onWindowClickEvent\"],[0,\"keydown\",\"onKeyDown\"],[0,\"wcsSelectOptionClick\",\"selectedOptionChanged\"],[0,\"focus\",\"onFocus\"],[2,\"blur\",\"onBlur\"]],{\"value\":[\"onValueChangeHandler\"]}]]],[\"wcs-error_3\",[[1,\"wcs-error\"],[1,\"wcs-form-field\",{\"isError\":[1540,\"is-error\"],\"hasPrefix\":[32],\"hasSuffix\":[32],\"spiedElement\":[32]},null,{\"isError\":[\"isErrorChange\"]}],[1,\"wcs-label\",{\"required\":[516],\"setAriaAttribute\":[64]}]]],[\"wcs-mat-icon\",[[1,\"wcs-mat-icon\",{\"icon\":[1],\"size\":[1],\"family\":[1],\"setAriaAttribute\":[64]}]]],[\"wcs-button_2\",[[17,\"wcs-button\",{\"type\":[1025],\"href\":[1],\"target\":[1],\"disabled\":[516],\"ripple\":[4],\"size\":[513],\"shape\":[513],\"mode\":[513],\"loading\":[1540],\"setAriaAttribute\":[64]},[[0,\"click\",\"onClick\"]],{\"ripple\":[\"onRippleChange\"]}],[1,\"wcs-spinner\",{\"mode\":[513]}]]]]"), options);
+  return bootstrapLazy(JSON.parse("[[\"wcs-grid-pagination\",[[1,\"wcs-grid-pagination\",{\"availablePageSizes\":[16],\"currentPage\":[1026,\"current-page\"],\"pageSize\":[2,\"page-size\"],\"itemsCount\":[2,\"items-count\"],\"pageCount\":[2,\"page-count\"],\"setAriaAttribute\":[64]}]]],[\"wcs-editable-field\",[[1,\"wcs-editable-field\",{\"type\":[1],\"label\":[1],\"readonly\":[516],\"value\":[1032],\"validateFn\":[16],\"formatFn\":[16],\"errorMsg\":[1,\"error-msg\"],\"size\":[513],\"currentState\":[32],\"isError\":[32]},[[8,\"click\",\"onWindowClickEvent\"]],{\"value\":[\"onValueChange\"]}]]],[\"wcs-alert-drawer\",[[1,\"wcs-alert-drawer\",{\"position\":[513],\"timeout\":[2],\"showProgressBar\":[4,\"show-progress-bar\"],\"show\":[64],\"clear\":[64]}]]],[\"wcs-grid\",[[1,\"wcs-grid\",{\"serverMode\":[516,\"server-mode\"],\"data\":[16],\"loading\":[516],\"selectionConfig\":[1,\"selection-config\"],\"selectedItems\":[8,\"selected-items\"],\"wcsGridPaginationId\":[1,\"wcs-grid-pagination-id\"],\"rowIdPath\":[1,\"row-id-path\"],\"rowCssPartsFn\":[16],\"columns\":[32],\"paginationEl\":[32],\"rows\":[32],\"cursorPosition\":[32],\"focusFirstCell\":[64],\"setAriaAttribute\":[64]},[[0,\"focus\",\"onFocus\"],[0,\"blur\",\"onBlur\"],[0,\"wcsHiddenChange\",\"onHiddenColumnChange\"],[0,\"keydown\",\"onKeyDown\"],[1,\"mousedown\",\"onClick\"],[0,\"wcsSortChange\",\"sortChangeEventHandler\"],[0,\"wcsGridPaginationChange\",\"paginationChangeEventHandler\"],[8,\"wcsGridPaginationChange\",\"paginationChangeEventHandlerOutside\"]],{\"cursorPosition\":[\"onCursorPositionChange\"],\"data\":[\"onDataChange\"],\"selectedItems\":[\"onSelectedItemsPropertyChange\"]}]]],[\"wcs-horizontal-stepper\",[[1,\"wcs-horizontal-stepper\",{\"currentStep\":[1026,\"current-step\"],\"steps\":[16],\"mode\":[1],\"checkOnComplete\":[516,\"check-on-complete\"],\"internalCurrentStepIndex\":[32],\"previous\":[64],\"next\":[64]},null,{\"currentStep\":[\"onCurrentStepChange\"]}]]],[\"wcs-breadcrumb\",[[1,\"wcs-breadcrumb\",{\"maxItems\":[2,\"max-items\"],\"itemsBeforeCollapse\":[2,\"items-before-collapse\"],\"itemsAfterCollapse\":[2,\"items-after-collapse\"],\"ariaLabelExpandButton\":[1,\"aria-label-expand-button\"],\"showHiddenItems\":[32],\"setAriaAttribute\":[64]},null,{\"maxItems\":[\"handleCollapsePropsChange\"],\"itemsBeforeCollapse\":[\"handleCollapsePropsChange\"],\"itemsAfterCollapse\":[\"handleCollapsePropsChange\"],\"ariaLabelExpandButton\":[\"handleAriaLabelExpandBtnChange\"]}]]],[\"wcs-counter\",[[17,\"wcs-counter\",{\"size\":[513],\"label\":[1],\"disabled\":[516],\"min\":[1026],\"max\":[1026],\"step\":[1026],\"value\":[1026],\"displayedValue\":[32],\"setAriaAttribute\":[64]},null,{\"value\":[\"valueChange\"]}]]],[\"wcs-dropdown\",[[17,\"wcs-dropdown\",{\"noArrow\":[516,\"no-arrow\"],\"mode\":[1],\"shape\":[1],\"size\":[1],\"disabled\":[516],\"placement\":[1],\"expanded\":[32],\"setAriaAttribute\":[64]},[[0,\"blur\",\"onBlur\"],[8,\"click\",\"onWindowClickEvent\"],[0,\"wcsDropdownItemClick\",\"dropdownItemClick\"],[0,\"keydown\",\"onKeyDown\"]],{\"placement\":[\"placementChange\"]}]]],[\"wcs-message\",[[1,\"wcs-message\",{\"intent\":[513],\"background\":[513],\"showCloseButton\":[516,\"show-close-button\"],\"showBorder\":[516,\"show-border\"]}]]],[\"wcs-modal\",[[4,\"wcs-modal\",{\"withoutBackdrop\":[516,\"without-backdrop\"],\"show\":[1540],\"showCloseButton\":[516,\"show-close-button\"],\"closeButtonAriaLabel\":[1,\"close-button-aria-label\"],\"size\":[1],\"hideActions\":[516,\"hide-actions\"],\"modalTriggerControlsId\":[1,\"modal-trigger-controls-id\"],\"initialFocusElementId\":[1,\"initial-focus-element-id\"],\"disableAutoFocus\":[516,\"disable-auto-focus\"],\"setAriaAttribute\":[64]},[[4,\"keydown\",\"onKeyDown\"]],{\"show\":[\"onShowChange\"]}]]],[\"wcs-galactic-menu\",[[1,\"wcs-galactic-menu\",{\"text\":[1],\"showPopoverMenu\":[32],\"setAriaAttribute\":[64]},[[8,\"click\",\"onWindowClickEvent\"],[0,\"keydown\",\"onKeyDown\"]]]]],[\"wcs-input\",[[17,\"wcs-input\",{\"fireFocusEvents\":[4,\"fire-focus-events\"],\"accept\":[1],\"autocapitalize\":[1],\"autocomplete\":[1],\"autocorrect\":[1],\"autofocus\":[4],\"debounce\":[2],\"prefixLabel\":[1,\"prefix-label\"],\"suffixLabel\":[1,\"suffix-label\"],\"disabled\":[516],\"enterkeyhint\":[1],\"size\":[513],\"icon\":[1],\"inputmode\":[1],\"max\":[1],\"maxlength\":[2],\"min\":[1],\"minlength\":[2],\"multiple\":[516],\"name\":[1],\"hidePasswordButtonAriaLabel\":[1,\"hide-password-button-aria-label\"],\"showPasswordButtonAriaLabel\":[1,\"show-password-button-aria-label\"],\"pattern\":[1],\"placeholder\":[1],\"readonly\":[516],\"required\":[516],\"spellcheck\":[4],\"state\":[513],\"step\":[1],\"type\":[1],\"value\":[1032],\"passwordReveal\":[32],\"setBlur\":[64],\"getInputElement\":[64],\"setAriaAttribute\":[64]},null,{\"debounce\":[\"debounceChanged\"],\"passwordReveal\":[\"onPasswordRevealChange\"]}]]],[\"wcs-textarea\",[[17,\"wcs-textarea\",{\"fireFocusEvents\":[4,\"fire-focus-events\"],\"autocapitalize\":[1],\"autofocus\":[4],\"debounce\":[2],\"disabled\":[516],\"icon\":[1],\"inputmode\":[1],\"enterkeyhint\":[1],\"maxlength\":[2],\"minlength\":[2],\"name\":[1],\"placeholder\":[1],\"readonly\":[516],\"required\":[516],\"spellcheck\":[4],\"state\":[513],\"cols\":[2],\"rows\":[2],\"wrap\":[1],\"autoGrow\":[516,\"auto-grow\"],\"value\":[1025],\"resize\":[513],\"setAriaAttribute\":[64],\"fitContent\":[64],\"setBlur\":[64],\"getInputElement\":[64]},null,{\"debounce\":[\"debounceChanged\"],\"value\":[\"valueChanged\"]}]]],[\"wcs-accordion\",[[1,\"wcs-accordion\",{\"hideActionText\":[516,\"hide-action-text\"],\"highlight\":[516],\"groupContentWithHeader\":[516,\"group-content-with-header\"],\"multiExpandable\":[4,\"multi-expandable\"]},[[0,\"wcsOpenChange\",\"wcsOpenChangeHandler\"]],{\"hideActionText\":[\"updateHideActiontextOnPanel\"],\"highlight\":[\"updateHighlightOnPanel\"],\"groupContentWithHeader\":[\"updateGroupContentWithHeader\"]}]]],[\"wcs-accordion-content\",[[1,\"wcs-accordion-content\"]]],[\"wcs-accordion-header\",[[1,\"wcs-accordion-header\"]]],[\"wcs-accordion-panel\",[[1,\"wcs-accordion-panel\",{\"open\":[1540],\"hideActionText\":[516,\"hide-action-text\"],\"highlight\":[516],\"groupContentWithHeader\":[516,\"group-content-with-header\"],\"setAriaAttribute\":[64],\"close\":[64]},null,{\"open\":[\"openChange\"]}]]],[\"wcs-action-bar\",[[1,\"wcs-action-bar\",{\"gutter\":[516],\"hasTabs\":[32]}]]],[\"wcs-app\",[[1,\"wcs-app\"]]],[\"wcs-badge\",[[1,\"wcs-badge\",{\"shape\":[1],\"color\":[1],\"size\":[513]}]]],[\"wcs-breadcrumb-item\",[[1,\"wcs-breadcrumb-item\",{\"last\":[4]}]]],[\"wcs-card\",[[1,\"wcs-card\",{\"mode\":[1537],\"orientation\":[513]},null,{\"orientation\":[\"orientationChanged\"]}]]],[\"wcs-card-body\",[[1,\"wcs-card-body\",{\"orientation\":[32],\"setOrientation\":[64]}]]],[\"wcs-card-content\",[[1,\"wcs-card-content\"]]],[\"wcs-card-footer\",[[1,\"wcs-card-footer\"]]],[\"wcs-card-header\",[[1,\"wcs-card-header\"]]],[\"wcs-card-media\",[[1,\"wcs-card-media\",{\"orientation\":[32],\"setOrientation\":[64]}]]],[\"wcs-chip\",[[1,\"wcs-chip\",{\"value\":[1],\"label\":[1],\"selected\":[516],\"open\":[516],\"disabled\":[516],\"variant\":[513],\"mode\":[513]}]]],[\"wcs-com-nav\",[[1,\"wcs-com-nav\",{\"appName\":[1,\"app-name\"],\"mobileMenuOpen\":[32],\"currentActiveSizing\":[32],\"setAriaAttribute\":[64]},[[0,\"wcsClickOnFinalAction\",\"onClickOnFinalAction\"],[8,\"keydown\",\"exitMobileMenuOnKeyDown\"]]]]],[\"wcs-com-nav-category\",[[1,\"wcs-com-nav-category\",{\"label\":[1],\"categoryOpen\":[32],\"currentActiveSizing\":[32],\"setAriaAttribute\":[64],\"close\":[64],\"open\":[64]},[[8,\"click\",\"onWindowClickEvent\"],[8,\"wcsCategoryOpened\",\"onSubmenuOpened\"]]]]],[\"wcs-com-nav-item\",[[1,\"wcs-com-nav-item\",null,[[0,\"click\",\"onClick\"]]]]],[\"wcs-com-nav-submenu\",[[1,\"wcs-com-nav-submenu\",{\"label\":[1],\"panelTitle\":[1,\"panel-title\"],\"panelDescription\":[1,\"panel-description\"],\"menuOpen\":[32],\"currentActiveSizing\":[32],\"setAriaAttribute\":[64],\"close\":[64],\"open\":[64]},[[8,\"click\",\"onWindowClickEvent\"],[8,\"wcsSubmenuOpened\",\"onSubmenuOpened\"],[8,\"keydown\",\"onEscapeKeyDown\"],[0,\"wcsClickOnFinalAction\",\"wcsCategoryItemClickedHandler\"]]]]],[\"wcs-divider\",[[1,\"wcs-divider\"]]],[\"wcs-dropdown-divider\",[[1,\"wcs-dropdown-divider\"]]],[\"wcs-dropdown-header\",[[1,\"wcs-dropdown-header\"]]],[\"wcs-dropdown-item\",[[4,\"wcs-dropdown-item\",null,[[1,\"mouseup\",\"onMouseUp\"],[0,\"keydown\",\"onKeyDown\"]]]]],[\"wcs-field\",[[1,\"wcs-field\"]]],[\"wcs-field-content\",[[1,\"wcs-field-content\"]]],[\"wcs-field-label\",[[1,\"wcs-field-label\"]]],[\"wcs-footer\",[[1,\"wcs-footer\"]]],[\"wcs-galactic\",[[1,\"wcs-galactic\",{\"text\":[1],\"show\":[32]}]]],[\"wcs-grid-column\",[[1,\"wcs-grid-column\",{\"path\":[1],\"name\":[1],\"sort\":[516],\"sortFn\":[16],\"formatter\":[16],\"sortOrder\":[1025,\"sort-order\"],\"width\":[1],\"customCells\":[516,\"custom-cells\"],\"hidden\":[516],\"cursorPosition\":[16],\"columnPosition\":[2,\"column-position\"],\"setAriaAttribute\":[64]},null,{\"hidden\":[\"parseMyObjectProp\"],\"sortOrder\":[\"sortOrderChange\"]}]]],[\"wcs-grid-custom-cell\",[[1,\"wcs-grid-custom-cell\",{\"columnId\":[1,\"column-id\"],\"rowId\":[8,\"row-id\"]}]]],[\"wcs-header\",[[1,\"wcs-header\",{\"setAriaAttribute\":[64]}]]],[\"wcs-hint\",[[1,\"wcs-hint\",{\"small\":[1540]}]]],[\"wcs-icon\",[[0,\"wcs-icon\",{\"icon\":[1],\"size\":[1],\"setAriaAttribute\":[64]}]]],[\"wcs-list-item\",[[1,\"wcs-list-item\",{\"activated\":[1540]}]]],[\"wcs-list-item-properties\",[[1,\"wcs-list-item-properties\"]]],[\"wcs-list-item-property\",[[1,\"wcs-list-item-property\"]]],[\"wcs-native-select\",[[1,\"wcs-native-select\",{\"size\":[513],\"required\":[516],\"expanded\":[32],\"disabled\":[32],\"setAriaAttribute\":[64],\"updateStyles\":[64]},null,{\"required\":[\"requiredChanged\"]}]]],[\"wcs-nav\",[[1,\"wcs-nav\",{\"setAriaAttribute\":[64]}]]],[\"wcs-nav-item\",[[4,\"wcs-nav-item\",null,[[0,\"keydown\",\"onKeyDown\"]]]]],[\"wcs-progress-radial\",[[1,\"wcs-progress-radial\",{\"size\":[2],\"showLabel\":[516,\"show-label\"],\"value\":[2],\"setAriaAttribute\":[64]}]]],[\"wcs-radio\",[[1,\"wcs-radio\",{\"value\":[1544],\"label\":[1537],\"disabled\":[1540],\"name\":[1025],\"mode\":[513],\"checked\":[32],\"radioTabIndex\":[32],\"updateState\":[64],\"setTabIndex\":[64],\"setAriaAttribute\":[64]}]]],[\"wcs-radio-group\",[[1,\"wcs-radio-group\",{\"value\":[1032],\"name\":[520],\"mode\":[513],\"setAriaAttribute\":[64]},[[0,\"wcsRadioClick\",\"handleRadioClick\"],[0,\"keydown\",\"handleKeyDown\"]],{\"value\":[\"onValueChangeHandler\"],\"name\":[\"updateAllRadioModeAndName\"],\"mode\":[\"updateAllRadioModeAndName\"]}]]],[\"wcs-skeleton-circle\",[[1,\"wcs-skeleton-circle\",{\"animation\":[513],\"radius\":[514]}]]],[\"wcs-skeleton-rectangle\",[[1,\"wcs-skeleton-rectangle\",{\"animation\":[513],\"rounded\":[516],\"height\":[513],\"width\":[513]}]]],[\"wcs-skeleton-text\",[[1,\"wcs-skeleton-text\",{\"animation\":[513],\"height\":[1]}]]],[\"wcs-switch\",[[17,\"wcs-switch\",{\"name\":[1],\"checked\":[516],\"labelAlignment\":[513,\"label-alignment\"],\"disabled\":[516],\"setAriaAttribute\":[64],\"getLabel\":[64]},[[0,\"click\",\"handleHostClick\"]]]]],[\"wcs-tab\",[[1,\"wcs-tab\",{\"header\":[513],\"itemKey\":[8,\"item-key\"]}]]],[\"wcs-tabs\",[[1,\"wcs-tabs\",{\"align\":[513],\"selectedIndex\":[2,\"selected-index\"],\"selectedKey\":[8,\"selected-key\"],\"headersOnly\":[516,\"headers-only\"],\"gutter\":[516],\"description\":[1],\"mobileOverlayExpanded\":[32],\"mobile\":[32],\"headers\":[32],\"currentActiveTabIndex\":[32],\"setAriaAttribute\":[64]},[[0,\"tabLoaded\",\"onTabLoaded\"],[8,\"click\",\"onWindowClickEvent\"]],{\"selectedIndex\":[\"selectedIndexChanged\"],\"selectedKey\":[\"selectedTabkeyChanged\"],\"mobile\":[\"onMobileChange\"]}]]],[\"wcs-tooltip\",[[1,\"wcs-tooltip\",{\"for\":[1],\"position\":[513],\"interactive\":[516],\"maxWidth\":[8,\"max-width\"],\"delay\":[2],\"duration\":[2],\"trigger\":[1],\"theme\":[1],\"content\":[1],\"appendTo\":[1,\"append-to\"],\"hide\":[64],\"show\":[64],\"disable\":[64],\"enable\":[64]},[[8,\"keydown\",\"handleKeyDown\"]],{\"interactive\":[\"updateProps\"],\"position\":[\"updateProps\"],\"maxWidth\":[\"updateProps\"],\"theme\":[\"updateProps\"],\"delay\":[\"updateProps\"],\"duration\":[\"updateProps\"],\"trigger\":[\"updateProps\"],\"content\":[\"updateTippyContent\"]}]]],[\"wcs-alert\",[[1,\"wcs-alert\",{\"show\":[1540],\"intent\":[513],\"timeout\":[2],\"showProgressBar\":[4,\"show-progress-bar\"]},[[1,\"mouseover\",\"mouseOverHandler\"],[1,\"mouseout\",\"mouseOutHandler\"]]]]],[\"wcs-progress-bar\",[[1,\"wcs-progress-bar\",{\"size\":[1],\"showLabel\":[516,\"show-label\"],\"value\":[2],\"setAriaAttribute\":[64]}]]],[\"wcs-checkbox\",[[17,\"wcs-checkbox\",{\"name\":[1],\"indeterminate\":[1540],\"checked\":[1540],\"required\":[4],\"labelAlignment\":[1537,\"label-alignment\"],\"disabled\":[516],\"setAriaAttribute\":[64],\"getLabel\":[64]},[[0,\"click\",\"handleHostClick\"]]]]],[\"wcs-select_2\",[[4,\"wcs-select-option\",{\"disabled\":[1540],\"selected\":[1540],\"highlighted\":[1540],\"value\":[8],\"chipColor\":[1,\"chip-color\"],\"chipBackgroundColor\":[1,\"chip-background-color\"],\"multiple\":[1540]},[[1,\"mouseup\",\"onMouseUp\"],[0,\"keydown\",\"handleKeydown\"]]],[1,\"wcs-select\",{\"size\":[513],\"value\":[1032],\"placeholder\":[1537],\"disabled\":[1540],\"required\":[516],\"multiple\":[516],\"autocomplete\":[516],\"serverMode\":[516,\"server-mode\"],\"filterFn\":[16],\"chips\":[516],\"name\":[1],\"compareWith\":[16],\"expanded\":[32],\"displayText\":[32],\"focused\":[32],\"showNoResultFoundLabel\":[32],\"autocompleteValue\":[32],\"overlayDirection\":[32],\"open\":[64],\"close\":[64],\"setAriaAttribute\":[64]},[[1,\"mouseup\",\"onMouseUp\"],[8,\"click\",\"onWindowClickEvent\"],[0,\"keydown\",\"onKeyDown\"],[0,\"wcsSelectOptionClick\",\"selectedOptionChanged\"],[0,\"focus\",\"onFocus\"],[2,\"blur\",\"onBlur\"]],{\"value\":[\"onValueChangeHandler\"]}]]],[\"wcs-error_3\",[[1,\"wcs-error\"],[1,\"wcs-form-field\",{\"isError\":[1540,\"is-error\"],\"hasPrefix\":[32],\"hasSuffix\":[32],\"spiedElement\":[32]},null,{\"isError\":[\"isErrorChange\"]}],[1,\"wcs-label\",{\"required\":[516],\"setAriaAttribute\":[64]}]]],[\"wcs-button_3\",[[17,\"wcs-button\",{\"type\":[1025],\"href\":[1],\"startIcon\":[1,\"start-icon\"],\"endIcon\":[1,\"end-icon\"],\"target\":[1],\"disabled\":[516],\"ripple\":[4],\"size\":[513],\"shape\":[513],\"mode\":[513],\"loading\":[1540],\"setAriaAttribute\":[64]},[[0,\"click\",\"onClick\"]],{\"ripple\":[\"onRippleChange\"]}],[1,\"wcs-spinner\",{\"mode\":[513]}],[1,\"wcs-mat-icon\",{\"icon\":[1],\"size\":[1],\"family\":[1],\"setAriaAttribute\":[64]}]]]]"), options);
 };
 
 export { defineCustomElements };

package/dist/esm/wcs-accordion-panel.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-d9de61ce.js';
 import { S as SelectArrow } from './select-arrow-e62de386.js';
-import { i as inheritAriaAttributes, a as inheritAttributes, s as setOrRemoveAttribute } from './helpers-89faa1b1.js';
+import { i as inheritAriaAttributes, a as inheritAttributes, s as setOrRemoveAttribute } from './helpers-2d73ee7c.js';
 
 const accordionPanelCss = ":host{display:flex;flex-direction:column;cursor:pointer;--wcs-accordion-panel-color-default:var(--wcs-semantic-color-text-primary);--wcs-accordion-panel-color-highlight:var(--wcs-semantic-color-text-primary);--wcs-accordion-panel-color-hover:var(--wcs-semantic-color-text-primary);--wcs-accordion-panel-color-press:var(--wcs-semantic-color-text-primary);--wcs-accordion-panel-action-color-default:var(--wcs-semantic-color-foreground-action-secondary-default);--wcs-accordion-panel-action-color-highlight:var(--wcs-semantic-color-foreground-action-secondary-press);--wcs-accordion-panel-action-color-hover:var(--wcs-semantic-color-foreground-action-secondary-hover);--wcs-accordion-panel-action-color-press:var(--wcs-semantic-color-foreground-action-secondary-press);--wcs-accordion-panel-background-color-default:var(--wcs-semantic-color-background-action-secondary-default);--wcs-accordion-panel-background-color-highlight:var(--wcs-semantic-color-background-action-secondary-press);--wcs-accordion-panel-background-color-hover:var(--wcs-semantic-color-background-action-secondary-hover);--wcs-accordion-panel-background-color-press:var(--wcs-semantic-color-background-action-secondary-press);--wcs-accordion-panel-header-font-weight:var(--wcs-semantic-font-weight-medium);--wcs-accordion-panel-header-font-size:var(--wcs-semantic-font-size-heading-6);--wcs-accordion-panel-header-gap:calc(3 * var(--wcs-semantic-spacing-base));--wcs-accordion-panel-border-radius:var(--wcs-semantic-border-radius-base);--wcs-accordion-panel-border-radius-open:var(--wcs-accordion-panel-border-radius) var(--wcs-accordion-panel-border-radius) 0 0;--wcs-accordion-panel-padding-vertical:var(--wcs-semantic-spacing-large);--wcs-accordion-panel-padding-horizontal:calc(var(--wcs-semantic-spacing-base) * 3);--wcs-accordion-panel-header-border-width:var(--wcs-semantic-border-width-default);--wcs-accordion-panel-border-width:var(--wcs-semantic-border-width-default);--wcs-accordion-panel-border-width-focus:var(--wcs-semantic-border-width-large);--wcs-accordion-panel-border-color:var(--wcs-semantic-color-border-secondary);--wcs-accordion-panel-border-color-focus:var(--wcs-semantic-color-border-focus-base);--wcs-accordion-panel-border-style-focus:var(--wcs-semantic-border-style-focus-base);--wcs-accordion-transition-duration:var(--wcs-semantic-motion-duration-feedback-base);border:var(--wcs-accordion-panel-border-width) solid var(--wcs-accordion-panel-border-color);border-radius:var(--wcs-accordion-panel-border-radius)}:host .header{display:flex;align-items:center;justify-content:space-between;gap:var(--wcs-accordion-panel-header-gap);padding:var(--wcs-accordion-panel-padding-vertical) var(--wcs-accordion-panel-padding-horizontal);border-radius:var(--wcs-accordion-panel-border-radius);font-weight:var(--wcs-accordion-panel-header-font-weight);font-size:var(--wcs-accordion-panel-header-font-size);font-family:var(--wcs-font-sans-serif);color:var(--wcs-accordion-panel-color-default);background-color:var(--wcs-accordion-panel-background-color-default);border:none;transition:background-color var(--wcs-accordion-transition-duration)}@media (forced-colors: active){:host .header{border:var(--wcs-accordion-panel-header-border-width) solid ButtonBorder}}:host .header:focus-visible{outline:var(--wcs-accordion-panel-border-width-focus) var(--wcs-accordion-panel-border-style-focus) var(--wcs-accordion-panel-border-color-focus)}:host .header:hover{cursor:pointer;color:var(--wcs-accordion-panel-color-hover);background-color:var(--wcs-accordion-panel-background-color-hover)}:host .header:hover .header-action{color:var(--wcs-accordion-panel-action-color-hover)}:host .header:hover .header-action .arrow{fill:var(--wcs-accordion-panel-action-color-hover)}:host .header:active{background-color:var(--wcs-accordion-panel-background-color-press)}:host .header-action{display:flex;align-items:center;user-select:none;color:var(--wcs-accordion-panel-action-color-default)}:host .header-action .arrow{fill:var(--wcs-accordion-panel-action-color-default)}:host .content{display:none}:host([open]){margin-bottom:0;}:host([open]) .header{border-radius:var(--wcs-accordion-panel-border-radius-open)}:host([open]) .content{display:block}:host([open]):host([highlight]){}:host([open]):host([highlight]) .header{background-color:var(--wcs-accordion-panel-background-color-highlight);color:var(--wcs-accordion-panel-color-highlight)}:host([open]):host([highlight]) .header-action{color:var(--wcs-accordion-panel-action-color-highlight)}:host([open]):host([highlight]) .header-action .arrow{fill:var(--wcs-accordion-panel-action-color-highlight)}";
 const WcsAccordionPanelStyle0 = accordionPanelCss;

package/dist/esm/wcs-alert-drawer.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-d9de61ce.js';
-import { p as parseCssTimeValueToMilliseconds } from './helpers-89faa1b1.js';
+import { p as parseCssTimeValueToMilliseconds } from './helpers-2d73ee7c.js';
 
 const alertDrawerCss = "@keyframes slide-in-bottom{from{transform:translateY(100%)}to{transform:translateY(0%)}}@keyframes slide-out{from{opacity:1}to{opacity:0}}@keyframes slide-in-top{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0%)}}:host{--wcs-alert-drawer-gap:var(--wcs-semantic-spacing-base);--wcs-alert-drawer-margin-horizontal:var(--wcs-semantic-spacing-base);--wcs-alert-drawer-margin-vertical:var(--wcs-semantic-spacing-base);--wcs-alert-drawer-min-width:400px;--wcs-alert-drawer-hide-alert-animation-duration:var(--wcs-semantic-motion-duration-feedback-slow);position:fixed;z-index:99999;width:fit-content}:host wcs-alert{--wcs-alert-min-width:var(--wcs-alert-drawer-min-width)}:host wcs-alert:not([show]){animation-duration:var(--wcs-alert-drawer-hide-alert-animation-duration);animation-timing-function:ease;animation-name:slide-out;animation-fill-mode:forwards}@media (prefers-reduced-motion: reduce){:host wcs-alert:not([show]){animation:none}}:host #alerts-container{display:flex;flex-direction:column;gap:var(--wcs-alert-drawer-gap)}@media (max-width: 575px){:host{left:50% !important;transform:translate(-50%, 0);width:calc(100% - 2 * var(--wcs-alert-drawer-margin-horizontal))}:host wcs-alert{--wcs-alert-min-width:100%}}:host([position=top]),:host([position=top-left]),:host([position=top-right]){top:var(--wcs-alert-drawer-margin-vertical);flex-direction:column-reverse}:host([position=top]) wcs-alert[show],:host([position=top-left]) wcs-alert[show],:host([position=top-right]) wcs-alert[show]{animation:slide-in-top var(--wcs-alert-drawer-hide-alert-animation-duration) ease}@media (prefers-reduced-motion: reduce){:host([position=top]) wcs-alert[show],:host([position=top-left]) wcs-alert[show],:host([position=top-right]) wcs-alert[show]{animation:none}}:host([position=bottom]),:host([position=bottom-left]),:host([position=bottom-right]){bottom:var(--wcs-alert-drawer-margin-vertical)}:host([position=bottom]) wcs-alert[show],:host([position=bottom-left]) wcs-alert[show],:host([position=bottom-right]) wcs-alert[show]{animation:slide-in-bottom var(--wcs-alert-drawer-hide-alert-animation-duration) ease}@media (prefers-reduced-motion: reduce){:host([position=bottom]) wcs-alert[show],:host([position=bottom-left]) wcs-alert[show],:host([position=bottom-right]) wcs-alert[show]{animation:none}}:host([position=top-right]),:host([position=bottom-right]){right:var(--wcs-alert-drawer-margin-horizontal)}:host([position=top-left]),:host([position=bottom-left]){left:var(--wcs-alert-drawer-margin-horizontal)}:host([position=bottom]),:host([position=top]){left:50%;transform:translate(-50%, 0)}";
 const WcsAlertDrawerStyle0 = alertDrawerCss;
@@ -49,11 +49,23 @@ const AlertDrawer = class {
      *      showProgressBar: true,
      *      timeout: 5000
      *  });
+     * ```
      * @param alert The alert to show
      */
     async show(alert) {
         this.alertsContainer.appendChild(this.renderToast(alert));
     }
+    /**
+     * Method exposed on `wcs-alert-drawer` to clear all `wcs-alert` which are inside, via the JS API
+     * @example
+     * Plain javascript (example inside a script tag):
+     * ```javascript
+     *  document.querySelector('wcs-alert-drawer').clear();
+     * ```
+     */
+    async clear() {
+        this.alertsContainer.replaceChildren();
+    }
     renderToast(alert) {
         var _a, _b;
         const alertElement = document.createElement('wcs-alert');
@@ -80,7 +92,7 @@ const AlertDrawer = class {
     }
     render() {
         // https://www.clever-cloud.com/doc/clever-components/?path=/docs/%F0%9F%9B%A0-toast-cc-toaster--docs#about-accessibility
-        return (h(Host, { key: '18a68f9f7727b29da85e0852dc87de30d79581ed', role: "region", "aria-label": "Informations", "aria-live": "polite", "aria-atomic": "true" }, h("div", { key: 'ee0d30077439b991e5ff6eb02b24873f015dce5e', ref: (el) => this.alertsContainer = el, id: "alerts-container" })));
+        return (h(Host, { key: '7df0dd0305bc6a7074ba14d9bfd2153a9fe08ccf', role: "region", "aria-label": "Informations", "aria-live": "polite", "aria-atomic": "true" }, h("div", { key: '8037fe4cd08765cdebb5b78054d3370996f1ea9b', ref: (el) => this.alertsContainer = el, id: "alerts-container" })));
     }
     disconnectedCallback() {
         this.alertEventListeners = new WeakMap(); // Clear the event listeners, weakmap is not iterable

package/dist/esm/wcs-alert-drawer.entry.js.map

@@ -1 +1 @@
-{"file":"wcs-alert-drawer.entry.js","mappings":"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","names":[],"sources":["src/components/alert-drawer/alert-drawer.scss?tag=wcs-alert-drawer&encapsulation=shadow","src/components/alert-drawer/alert-drawer.tsx"],"sourcesContent":["@import '../../style/breakpoints';\n@import './alert-drawer-keyframes';\n\n:host {\n    --wcs-alert-drawer-gap: var(--wcs-semantic-spacing-base);\n    --wcs-alert-drawer-margin-horizontal: var(--wcs-semantic-spacing-base);\n    --wcs-alert-drawer-margin-vertical: var(--wcs-semantic-spacing-base);\n    --wcs-alert-drawer-min-width: 400px;\n\n    --wcs-alert-drawer-hide-alert-animation-duration: var(--wcs-semantic-motion-duration-feedback-slow);\n\n    position: fixed;\n    z-index: 99999;\n    width: fit-content;\n\n    wcs-alert {\n        --wcs-alert-min-width: var(--wcs-alert-drawer-min-width);\n    }\n\n    wcs-alert:not([show]) {\n        animation-duration: var(--wcs-alert-drawer-hide-alert-animation-duration);\n        animation-timing-function: ease;\n        animation-name: slide-out;\n\n        animation-fill-mode: forwards; // forwards = keep the last keyframe state => that keeps the alert with the opacity 0 at the end of the animation\n\n        @media (prefers-reduced-motion: reduce) {\n            animation: none;\n        }\n    }\n\n    #alerts-container {\n        display: flex;\n        flex-direction: column;\n        gap: var(--wcs-alert-drawer-gap);\n    }\n}\n\n@include for-phone-only {\n    :host {\n        left: 50% !important; // !important => to override the left applied by the :host([position=left]) selector\n        transform: translate(-50%, 0);\n        width: calc(100% - 2 * var(--wcs-alert-drawer-margin-horizontal)); // 1 * margin for the left and 1 * margin for the right\n\n        wcs-alert {\n            --wcs-alert-min-width: 100%;\n        }\n    }\n}\n\n:host([position=top]), :host([position=top-left]), :host([position=top-right]) {\n    top: var(--wcs-alert-drawer-margin-vertical);\n    flex-direction: column-reverse;\n\n    wcs-alert[show] {\n        animation: slide-in-top var(--wcs-alert-drawer-hide-alert-animation-duration) ease;\n\n        @media (prefers-reduced-motion: reduce) {\n            animation: none;\n        }\n    }\n}\n\n:host([position=bottom]), :host([position=bottom-left]), :host([position=bottom-right]) {\n    bottom: var(--wcs-alert-drawer-margin-vertical);\n\n    wcs-alert[show] {\n        animation: slide-in-bottom var(--wcs-alert-drawer-hide-alert-animation-duration) ease;\n\n        @media (prefers-reduced-motion: reduce) {\n            animation: none;\n        }\n    }\n}\n\n:host([position=top-right]), :host([position=bottom-right]) {\n    right: var(--wcs-alert-drawer-margin-horizontal);\n}\n\n:host([position=top-left]), :host([position=bottom-left]) {\n    left: var(--wcs-alert-drawer-margin-horizontal);\n}\n\n:host([position=bottom]), :host([position=top]) {\n    left: 50%;\n    transform: translate(-50%, 0);\n}\n","import { Component, Element, h, Host, Method, Prop } from '@stencil/core';\nimport { parseCssTimeValueToMilliseconds } from '../../utils/helpers';\nimport { WcsAlertDrawerPosition } from \"./alert-drawer-interface\";\nimport { WcsAlertConfig } from \"../alert/alert-interface\";\n\n/**\n * Serve as a container for displaying `wcs-alert` components. Directly use this component to display alerts in your applications.\n * \n * ## Usage\n * \n * You can place the `wcs-alert-drawer` component anywhere in your application. It will be used to display alerts.\n * You need to set `position` property to define where the alert drawer will be displayed on the screen.\n * \n * About alerts order:\n * - alerts are ordered up-bottom if the position is `top` and bottom-up if the position is `bottom`\n * \n * ## Accessibility guidelines 💡\n * \n * - The component has `aria-live=\"polite\"` and `aria-atomic=\"true\"` attributes to announce the new alerts to screen readers\n * \n * ## Configuration (on the web component)\n *\n * Per default, the `wcs-alert-drawer` is configured with:\n * - `position: 'top-right'`\n * - `showProgressBar: false`\n * - `timeout: 5000`\n *\n * When using the `WcsAlertDrawer::show(alert: WcsAlertConfig)` method, you can override the default configuration by \n * overriding it through the argument.\n * You can also set them in the `wcs-alert-drawer` component directly as attributes\n * \n * ```html\n * <wcs-alert-drawer position=\"top-right\" show-progress-bar timeout=\"10000\">\n * ```\n * With this configuration, all alerts will be displayed with a progress bar and a timeout of 10 seconds.\n * \n * @slot - the alert drawer content, where alerts you put as children will be displayed\n * \n * @cssprop --wcs-alert-drawer-gap - Gap between alerts\n * @cssprop --wcs-alert-drawer-margin-horizontal - Margin horizontal of the alert drawer\n * @cssprop --wcs-alert-drawer-margin-vertical - Margin vertical of the alert drawer\n * @cssprop --wcs-alert-drawer-hide-alert-animation-duration - Duration of the hide alert animation\n * @cssprop --wcs-alert-drawer-min-width - Minimum width of the alert drawer => define the width of the alerts\n */\n@Component({\n    tag: 'wcs-alert-drawer',\n    styleUrl: 'alert-drawer.scss',\n    shadow: true,\n})\nexport class AlertDrawer {\n    @Element()\n    private el!: HTMLWcsAlertDrawerElement;\n\n    /**\n     * Position of the alert drawer on the screen\n     */\n    @Prop({ reflect: true }) position: WcsAlertDrawerPosition = 'bottom-right';\n\n    /**\n     * Timeout for the alert to be dismissed automatically\n     */\n    @Prop() timeout: number = 5000;\n    /**\n     * Whether to show the progress bar or not\n     */\n    @Prop() showProgressBar: boolean = false;\n\n    /*\n     https://www.reddit.com/r/Frontend/comments/1ato11w/comment/kqz4gt8/?utm_source=share&utm_medium=web3x&utm_name=web3xcss&utm_term=1&utm_content=share_button\n     https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakRef\n     */\n    private alertEventListeners = new WeakMap<HTMLElement, (evt: AnimationEvent) => void>();\n    private timeoutId = undefined;\n\n    private userPrefersReducedMotion: boolean = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    private alertsContainer: HTMLDivElement;\n\n    /**\n     * Handles the dismissal of an alert\n     * @param alert The alert element\n     */\n    private close = (alert: HTMLWcsAlertElement): void => {\n        if (!this.userPrefersReducedMotion) {\n            this.timeoutId = setTimeout(() => {\n                alert.remove();\n                // Cleanup the event listener reference\n                this.alertEventListeners.delete(alert);\n            }, parseCssTimeValueToMilliseconds(window.getComputedStyle(this.el).getPropertyValue(\"--wcs-alert-drawer-hide-alert-animation-duration\")) || 300);\n        } else {\n            // If the user has reduced motion preference, remove the alert immediately\n            alert.remove();\n            // Cleanup the event listener reference\n            this.alertEventListeners.delete(alert);\n        }\n    };\n\n    /**\n     * Method exposed on `wcs-alert-drawer` to show an alert programmatically via the JS API\n     * @example\n     * Plain javascript (example inside a script tag):\n     * ```javascript\n     *  document.querySelector('wcs-alert-drawer').show({\n     *      title: 'Alert title',\n     *      subtitle: 'Alert subtitle',\n     *      intent: 'info',\n     *      showProgressBar: true,\n     *      timeout: 5000\n     *  });\n     * @param alert The alert to show\n     */\n    @Method()\n    async show(alert: WcsAlertConfig): Promise<void> {\n        this.alertsContainer.appendChild(this.renderToast(alert));\n    }\n\n    private renderToast(alert: WcsAlertConfig): HTMLWcsAlertElement {\n        const alertElement = document.createElement('wcs-alert') as HTMLWcsAlertElement;\n        alertElement.setAttribute('intent', alert.intent);\n\n        // Uses the alert config if defined, otherwise falls back to the drawer default\n        // as the showProgressBar is a boolean attribute, we need to set it to an empty string only if true\n        if ((alert.showProgressBar ?? this.showProgressBar)) {\n            alertElement.setAttribute('show-progress-bar', '');\n        }\n        \n        // Uses the alert config if defined, otherwise falls back to the drawer default\n        alertElement.setAttribute('timeout', String(alert.timeout ?? this.timeout));\n\n        const listener = () => this.close(alertElement);\n        this.alertEventListeners.set(alertElement, listener);\n        alertElement.addEventListener(\"wcsAlertDismiss\", listener);\n        \n        const title = document.createElement('span') as HTMLSpanElement;\n        title.setAttribute('slot', 'title');\n        title.textContent = alert.title;\n        alertElement.appendChild(title);\n\n        const subtitle = document.createElement('span') as HTMLSpanElement;\n        subtitle.setAttribute('slot', 'subtitle');\n        subtitle.textContent = alert.subtitle;\n        alertElement.appendChild(subtitle);\n\n        return alertElement;\n    }\n\n    render() {\n        // https://www.clever-cloud.com/doc/clever-components/?path=/docs/%F0%9F%9B%A0-toast-cc-toaster--docs#about-accessibility\n        return (\n            <Host role=\"region\" aria-label=\"Informations\" aria-live=\"polite\" aria-atomic=\"true\">\n                <div ref={(el) => this.alertsContainer = el} id=\"alerts-container\">\n                </div>\n            </Host>\n        );\n    }\n\n    disconnectedCallback() {\n        this.alertEventListeners = new WeakMap(); // Clear the event listeners, weakmap is not iterable\n        clearTimeout(this.timeoutId);\n    }\n}\n"],"version":3}
+{"file":"wcs-alert-drawer.entry.js","mappings":"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","names":[],"sources":["src/components/alert-drawer/alert-drawer.scss?tag=wcs-alert-drawer&encapsulation=shadow","src/components/alert-drawer/alert-drawer.tsx"],"sourcesContent":["@import '../../style/breakpoints';\n@import './alert-drawer-keyframes';\n\n:host {\n    --wcs-alert-drawer-gap: var(--wcs-semantic-spacing-base);\n    --wcs-alert-drawer-margin-horizontal: var(--wcs-semantic-spacing-base);\n    --wcs-alert-drawer-margin-vertical: var(--wcs-semantic-spacing-base);\n    --wcs-alert-drawer-min-width: 400px;\n\n    --wcs-alert-drawer-hide-alert-animation-duration: var(--wcs-semantic-motion-duration-feedback-slow);\n\n    position: fixed;\n    z-index: 99999;\n    width: fit-content;\n\n    wcs-alert {\n        --wcs-alert-min-width: var(--wcs-alert-drawer-min-width);\n    }\n\n    wcs-alert:not([show]) {\n        animation-duration: var(--wcs-alert-drawer-hide-alert-animation-duration);\n        animation-timing-function: ease;\n        animation-name: slide-out;\n\n        animation-fill-mode: forwards; // forwards = keep the last keyframe state => that keeps the alert with the opacity 0 at the end of the animation\n\n        @media (prefers-reduced-motion: reduce) {\n            animation: none;\n        }\n    }\n\n    #alerts-container {\n        display: flex;\n        flex-direction: column;\n        gap: var(--wcs-alert-drawer-gap);\n    }\n}\n\n@include for-phone-only {\n    :host {\n        left: 50% !important; // !important => to override the left applied by the :host([position=left]) selector\n        transform: translate(-50%, 0);\n        width: calc(100% - 2 * var(--wcs-alert-drawer-margin-horizontal)); // 1 * margin for the left and 1 * margin for the right\n\n        wcs-alert {\n            --wcs-alert-min-width: 100%;\n        }\n    }\n}\n\n:host([position=top]), :host([position=top-left]), :host([position=top-right]) {\n    top: var(--wcs-alert-drawer-margin-vertical);\n    flex-direction: column-reverse;\n\n    wcs-alert[show] {\n        animation: slide-in-top var(--wcs-alert-drawer-hide-alert-animation-duration) ease;\n\n        @media (prefers-reduced-motion: reduce) {\n            animation: none;\n        }\n    }\n}\n\n:host([position=bottom]), :host([position=bottom-left]), :host([position=bottom-right]) {\n    bottom: var(--wcs-alert-drawer-margin-vertical);\n\n    wcs-alert[show] {\n        animation: slide-in-bottom var(--wcs-alert-drawer-hide-alert-animation-duration) ease;\n\n        @media (prefers-reduced-motion: reduce) {\n            animation: none;\n        }\n    }\n}\n\n:host([position=top-right]), :host([position=bottom-right]) {\n    right: var(--wcs-alert-drawer-margin-horizontal);\n}\n\n:host([position=top-left]), :host([position=bottom-left]) {\n    left: var(--wcs-alert-drawer-margin-horizontal);\n}\n\n:host([position=bottom]), :host([position=top]) {\n    left: 50%;\n    transform: translate(-50%, 0);\n}\n","import { Component, Element, h, Host, Method, Prop } from '@stencil/core';\nimport { parseCssTimeValueToMilliseconds } from '../../utils/helpers';\nimport { WcsAlertDrawerPosition } from \"./alert-drawer-interface\";\nimport { WcsAlertConfig } from \"../alert/alert-interface\";\n\n/**\n * Serve as a container for displaying `wcs-alert` components. Directly use this component to display alerts in your applications.\n * \n * ## Usage\n * \n * You can place the `wcs-alert-drawer` component anywhere in your application. It will be used to display alerts.\n * You need to set `position` property to define where the alert drawer will be displayed on the screen.\n * \n * About alerts order:\n * - alerts are ordered up-bottom if the position is `top` and bottom-up if the position is `bottom`\n * \n * ## Accessibility guidelines 💡\n * \n * - The component has `aria-live=\"polite\"` and `aria-atomic=\"true\"` attributes to announce the new alerts to screen readers\n * \n * ## Configuration (on the web component)\n *\n * Per default, the `wcs-alert-drawer` is configured with:\n * - `position: 'top-right'`\n * - `showProgressBar: false`\n * - `timeout: 5000`\n *\n * When using the `WcsAlertDrawer::show(alert: WcsAlertConfig)` method, you can override the default configuration by \n * overriding it through the argument.\n * You can also set them in the `wcs-alert-drawer` component directly as attributes\n * \n * ```html\n * <wcs-alert-drawer position=\"top-right\" show-progress-bar timeout=\"10000\">\n * ```\n * With this configuration, all alerts will be displayed with a progress bar and a timeout of 10 seconds.\n * \n * @slot - the alert drawer content, where alerts you put as children will be displayed\n * \n * @cssprop --wcs-alert-drawer-gap - Gap between alerts\n * @cssprop --wcs-alert-drawer-margin-horizontal - Margin horizontal of the alert drawer\n * @cssprop --wcs-alert-drawer-margin-vertical - Margin vertical of the alert drawer\n * @cssprop --wcs-alert-drawer-hide-alert-animation-duration - Duration of the hide alert animation\n * @cssprop --wcs-alert-drawer-min-width - Minimum width of the alert drawer => define the width of the alerts\n */\n@Component({\n    tag: 'wcs-alert-drawer',\n    styleUrl: 'alert-drawer.scss',\n    shadow: true,\n})\nexport class AlertDrawer {\n    @Element()\n    private el!: HTMLWcsAlertDrawerElement;\n\n    /**\n     * Position of the alert drawer on the screen\n     */\n    @Prop({ reflect: true }) position: WcsAlertDrawerPosition = 'bottom-right';\n\n    /**\n     * Timeout for the alert to be dismissed automatically\n     */\n    @Prop() timeout: number = 5000;\n    /**\n     * Whether to show the progress bar or not\n     */\n    @Prop() showProgressBar: boolean = false;\n\n    /*\n     https://www.reddit.com/r/Frontend/comments/1ato11w/comment/kqz4gt8/?utm_source=share&utm_medium=web3x&utm_name=web3xcss&utm_term=1&utm_content=share_button\n     https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakRef\n     */\n    private alertEventListeners = new WeakMap<HTMLElement, (evt: AnimationEvent) => void>();\n    private timeoutId = undefined;\n\n    private userPrefersReducedMotion: boolean = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n    private alertsContainer: HTMLDivElement;\n\n    /**\n     * Handles the dismissal of an alert\n     * @param alert The alert element\n     */\n    private close = (alert: HTMLWcsAlertElement): void => {\n        if (!this.userPrefersReducedMotion) {\n            this.timeoutId = setTimeout(() => {\n                alert.remove();\n                // Cleanup the event listener reference\n                this.alertEventListeners.delete(alert);\n            }, parseCssTimeValueToMilliseconds(window.getComputedStyle(this.el).getPropertyValue(\"--wcs-alert-drawer-hide-alert-animation-duration\")) || 300);\n        } else {\n            // If the user has reduced motion preference, remove the alert immediately\n            alert.remove();\n            // Cleanup the event listener reference\n            this.alertEventListeners.delete(alert);\n        }\n    };\n\n    /**\n     * Method exposed on `wcs-alert-drawer` to show an alert programmatically via the JS API\n     * @example\n     * Plain javascript (example inside a script tag):\n     * ```javascript\n     *  document.querySelector('wcs-alert-drawer').show({\n     *      title: 'Alert title',\n     *      subtitle: 'Alert subtitle',\n     *      intent: 'info',\n     *      showProgressBar: true,\n     *      timeout: 5000\n     *  });\n     * ```\n     * @param alert The alert to show\n     */\n    @Method()\n    async show(alert: WcsAlertConfig): Promise<void> {\n        this.alertsContainer.appendChild(this.renderToast(alert));\n    }\n\n    /**\n     * Method exposed on `wcs-alert-drawer` to clear all `wcs-alert` which are inside, via the JS API\n     * @example\n     * Plain javascript (example inside a script tag):\n     * ```javascript\n     *  document.querySelector('wcs-alert-drawer').clear();\n     * ```\n     */\n    @Method()\n    async clear(): Promise<void> {\n        this.alertsContainer.replaceChildren();\n    }\n\n    private renderToast(alert: WcsAlertConfig): HTMLWcsAlertElement {\n        const alertElement = document.createElement('wcs-alert') as HTMLWcsAlertElement;\n        alertElement.setAttribute('intent', alert.intent);\n\n        // Uses the alert config if defined, otherwise falls back to the drawer default\n        // as the showProgressBar is a boolean attribute, we need to set it to an empty string only if true\n        if ((alert.showProgressBar ?? this.showProgressBar)) {\n            alertElement.setAttribute('show-progress-bar', '');\n        }\n        \n        // Uses the alert config if defined, otherwise falls back to the drawer default\n        alertElement.setAttribute('timeout', String(alert.timeout ?? this.timeout));\n\n        const listener = () => this.close(alertElement);\n        this.alertEventListeners.set(alertElement, listener);\n        alertElement.addEventListener(\"wcsAlertDismiss\", listener);\n        \n        const title = document.createElement('span') as HTMLSpanElement;\n        title.setAttribute('slot', 'title');\n        title.textContent = alert.title;\n        alertElement.appendChild(title);\n\n        const subtitle = document.createElement('span') as HTMLSpanElement;\n        subtitle.setAttribute('slot', 'subtitle');\n        subtitle.textContent = alert.subtitle;\n        alertElement.appendChild(subtitle);\n\n        return alertElement;\n    }\n\n    render() {\n        // https://www.clever-cloud.com/doc/clever-components/?path=/docs/%F0%9F%9B%A0-toast-cc-toaster--docs#about-accessibility\n        return (\n            <Host role=\"region\" aria-label=\"Informations\" aria-live=\"polite\" aria-atomic=\"true\">\n                <div ref={(el) => this.alertsContainer = el} id=\"alerts-container\">\n                </div>\n            </Host>\n        );\n    }\n\n    disconnectedCallback() {\n        this.alertEventListeners = new WeakMap(); // Clear the event listeners, weakmap is not iterable\n        clearTimeout(this.timeoutId);\n    }\n}\n"],"version":3}

package/dist/esm/wcs-alert.entry.js

@@ -1,6 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-d9de61ce.js';
+import { A as AlertCloseButton } from './alert-close-button-2ce5ac95.js';
 
-const alertCss = "@keyframes progress-bar-slide{0%{width:0}100%{width:100%}}:host{--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-accent-lighter);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-brand-default);--wcs-alert-title-color:var(--wcs-semantic-color-text-primary);--wcs-alert-subtitle-color:var(--wcs-semantic-color-text-secondary);--wcs-alert-dismiss-button-color:var(--wcs-semantic-color-foreground-inverse);--wcs-alert-title-font-weight:var(--wcs-semantic-font-weight-heavy);--wcs-alert-subtitle-font-weight:var(--wcs-semantic-font-weight-roman);--wcs-alert-title-font-size:var(--wcs-semantic-font-size-base);--wcs-alert-subtitle-font-size:var(--wcs-semantic-font-size-caption-2);--wcs-alert-border-width:var(--wcs-semantic-border-width-default);--wcs-alert-border-color:var(--wcs-semantic-color-border-primary);--wcs-alert-border-radius:var(--wcs-semantic-border-radius-base);--wcs-alert-padding:var(--wcs-semantic-spacing-base-150);--wcs-alert-gap:var(--wcs-semantic-spacing-base-150);--wcs-alert-min-width:100%;--wcs-alert-progress-bar-height:0.25rem;--wcs-alert-progress-bar-background-color:var(--wcs-alert-icon-background-color);--wcs-alert-internal-progress-bar-animation-duration:5s;box-sizing:border-box;background-color:var(--wcs-alert-background-color);border-radius:var(--wcs-alert-border-radius);padding:var(--wcs-alert-padding);width:100%;min-width:var(--wcs-alert-min-width);position:relative;display:flex;align-items:center;justify-content:space-between;gap:var(--wcs-alert-gap);border:solid var(--wcs-alert-border-width) var(--wcs-alert-border-color);overflow:hidden}:host .content{display:flex;flex-direction:column}:host .announcement-icon{color:var(--wcs-alert-icon-background-color)}:host ::slotted([slot=title]){color:var(--wcs-alert-title-color);font-size:var(--wcs-alert-title-font-size);font-weight:var(--wcs-alert-title-font-weight)}:host ::slotted([slot=subtitle]){font-weight:var(--wcs-alert-subtitle-font-weight);color:var(--wcs-alert-subtitle-color);font-size:var(--wcs-alert-subtitle-font-size)}:host .progress-bar{bottom:0;left:0;width:100%;height:var(--wcs-alert-progress-bar-height);position:absolute}:host .progress-bar-track{background-color:var(--wcs-alert-progress-bar-background-color);height:100%;animation:progress-bar-slide var(--wcs-alert-internal-progress-bar-animation-duration) linear;border-bottom-left-radius:var(--wcs-alert-border-radius);border-bottom-right-radius:var(--wcs-alert-border-radius);border-top-right-radius:var(--wcs-alert-border-radius)}:host([intent=success]){--wcs-alert-border-color:var(--wcs-semantic-color-border-success);--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-success-lighter);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-success-default)}:host([intent=information]){--wcs-alert-border-color:var(--wcs-semantic-color-border-information);--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-information-lighter);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-information-default)}:host([intent=warning]){--wcs-alert-border-color:var(--wcs-semantic-color-border-warning);--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-warning-lighter);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-warning-default)}:host([intent=error]){--wcs-alert-border-color:var(--wcs-semantic-color-border-critical);--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-critical-lightest);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-critical-default)}:host>*{box-sizing:border-box}.icon-content-container{display:flex;gap:var(--wcs-alert-gap);align-items:center}.close-button wcs-mat-icon{color:var(--wcs-alert-dismiss-button-color)}.hidden{display:none}";
+const alertCss = "@keyframes progress-bar-slide{0%{width:0}100%{width:100%}}:host{box-sizing:border-box;position:relative;display:flex;align-items:center;justify-content:space-between;--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-accent-lighter);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-brand-default);--wcs-alert-title-color:var(--wcs-semantic-color-text-primary);--wcs-alert-subtitle-color:var(--wcs-semantic-color-text-secondary);--wcs-alert-dismiss-button-color:var(--wcs-semantic-color-foreground-inverse);--wcs-alert-title-font-weight:var(--wcs-semantic-font-weight-heavy);--wcs-alert-subtitle-font-weight:var(--wcs-semantic-font-weight-roman);--wcs-alert-title-font-size:var(--wcs-semantic-font-size-base);--wcs-alert-subtitle-font-size:var(--wcs-semantic-font-size-caption-2);--wcs-alert-border-width:var(--wcs-semantic-border-width-default);--wcs-alert-border-color:var(--wcs-semantic-color-border-primary);--wcs-alert-border-radius:var(--wcs-semantic-border-radius-base);--wcs-alert-padding:var(--wcs-semantic-spacing-base-150);--wcs-alert-gap:var(--wcs-semantic-spacing-base-150);--wcs-alert-min-width:100%;--wcs-alert-progress-bar-height:0.25rem;--wcs-alert-progress-bar-background-color:var(--wcs-alert-icon-background-color);--wcs-alert-internal-progress-bar-animation-duration:5s;background-color:var(--wcs-alert-background-color);border-radius:var(--wcs-alert-border-radius);padding:var(--wcs-alert-padding);width:100%;min-width:var(--wcs-alert-min-width);gap:var(--wcs-alert-gap);border:solid var(--wcs-alert-border-width) var(--wcs-alert-border-color);overflow:hidden}:host .content{display:flex;flex-direction:column}:host .icon-content-container{display:flex;align-items:center}:host .announcement-icon{color:var(--wcs-alert-icon-background-color)}:host .icon-content-container{gap:var(--wcs-alert-gap)}:host ::slotted([slot=title]){color:var(--wcs-alert-title-color);font-size:var(--wcs-alert-title-font-size);font-weight:var(--wcs-alert-title-font-weight)}:host ::slotted([slot=subtitle]){font-weight:var(--wcs-alert-subtitle-font-weight);color:var(--wcs-alert-subtitle-color);font-size:var(--wcs-alert-subtitle-font-size)}:host .progress-bar{bottom:0;left:0;width:100%;height:var(--wcs-alert-progress-bar-height);position:absolute}:host .progress-bar-track{background-color:var(--wcs-alert-progress-bar-background-color);height:100%;animation:progress-bar-slide var(--wcs-alert-internal-progress-bar-animation-duration) linear;border-bottom-left-radius:var(--wcs-alert-border-radius);border-bottom-right-radius:var(--wcs-alert-border-radius);border-top-right-radius:var(--wcs-alert-border-radius)}:host([intent=success]){--wcs-alert-border-color:var(--wcs-semantic-color-border-success);--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-success-lighter);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-success-default)}:host([intent=information]){--wcs-alert-border-color:var(--wcs-semantic-color-border-information);--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-information-lighter);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-information-default)}:host([intent=warning]){--wcs-alert-border-color:var(--wcs-semantic-color-border-warning);--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-warning-lighter);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-warning-default)}:host([intent=error]){--wcs-alert-border-color:var(--wcs-semantic-color-border-critical);--wcs-alert-background-color:var(--wcs-semantic-color-background-surface-critical-lightest);--wcs-alert-icon-background-color:var(--wcs-semantic-color-background-surface-critical-default)}:host>*{box-sizing:border-box}.close-button wcs-mat-icon{color:var(--wcs-alert-dismiss-button-color)}.hidden{display:none}";
 const WcsAlertStyle0 = alertCss;
 
 const Alert = class {
@@ -106,7 +107,7 @@ const Alert = class {
         clearTimeout(this.timeoutId);
     }
     render() {
-        return (h(Host, { key: '82c9f5879eae7adef41c921ef34b2b9d891c0d6b' }, h("div", { key: 'b46424dfb6b620b62767b6bb8048827f83d116a7', class: "icon-content-container" }, h("wcs-mat-icon", { key: 'ff3a0bc91a73e275936bbe8f77c904f397296551', class: "announcement-icon", ref: (el) => this.annoucementIconHtmlElement = el, icon: this.getMaterialIcon(), "aria-label": this.getAriaLabel(), role: "img", "aria-hidden": false }), h("div", { key: 'ea866940416ddaf5eaf73cec83f30c71b01c41d8', class: "content" }, h("slot", { key: 'd14c321ebdb78b646bb4fc19e613dbd2cc61ed31', name: "title" }), h("slot", { key: '569d6556ea823f82e1d6164ac20361e27c85b592', name: "subtitle" }))), h("wcs-button", { key: 'f13afc31116b7b6fe04e0186128d0288725ace98', shape: "round", size: "s", mode: "clear", class: "close-button wcs-dark", "aria-label": "Fermer cette notification", onClick: ($event) => this.onCloseButtonClick($event) }, h("wcs-mat-icon", { key: '02557c896159ec1a7fdab853a07f7c79c17dd5d7', icon: "close" })), h("div", { key: '9e90e95009da575ca693e5ba4e92b3916ad4ee6f', class: 'progress-bar' + (!this.showProgressBar ? ' hidden' : '') }, h("div", { key: 'c8858551592bb0b1622e2ee19c67a662f31ce068', class: "progress-bar-track" }))));
+        return (h(Host, { key: '9d063f0f07f1af0d1cd34d362503a8f7c79eb511' }, h("div", { key: 'd8c3709856c49c5392641113deabf7d2d00dc6d5', class: "icon-content-container" }, h("wcs-mat-icon", { key: 'aecbcb8979b40a28d90e372b4ec8889514cc4ce5', class: "announcement-icon", ref: (el) => this.annoucementIconHtmlElement = el, icon: this.getMaterialIcon(), "aria-label": this.getAriaLabel(), role: "img", "aria-hidden": false }), h("div", { key: '1b1ffabeae463b8fba6d77ee4636f45125a6cd4b', class: "content" }, h("slot", { key: '3afb040593b7e0d7d451018df4b1b10dc85f0f21', name: "title" }), h("slot", { key: 'ed674d6b1289f8dd3a3523f2536a717b5bd7031b', name: "subtitle" }))), h(AlertCloseButton, { key: '387c28511f2d4be039e4ea108c7c1245d9aad89c', onClick: ($event) => this.onCloseButtonClick($event) }), h("div", { key: '745eaef7aaaa2d8f258c97f298869eeabbe308b8', class: 'progress-bar' + (!this.showProgressBar ? ' hidden' : '') }, h("div", { key: 'e8ae7aa5de583328bf7be34317f5fb25f68c214d', class: "progress-bar-track" }))));
     }
     get el() { return getElement(this); }
 };