npm - @spw-ds/spw-stencil-library - Versions diffs - 1.2.0 → 1.2.1 - Mend

@spw-ds/spw-stencil-library 1.2.0 → 1.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (658) hide show

package/dist/cjs/spw-iodda.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 async function fetchData(page = 1, itemsPerPage, search = '', filters) {
     const offset = (page - 1) * itemsPerPage;
@@ -109,7 +109,7 @@ const SpwIodda = class {
     render() {
         const totalPages = Math.ceil(this.totalItems / this.itemsPerPage);
         const resultsText = this.totalItems > 1 ? 'résultats trouvés' : 'résultat trouvé';
-        return (index.h(index.Host, { key: 'd33ef7a83fc3533b51875481af8578cbf78f75c9' }, index.h("div", { key: 'c4606f2ce6eec2017dc22181aaccdb29d32fc946', class: "spw-search-input" }, index.h("spw-text-field", { key: '437fce3bde6b517537003ccedfe1a4d183bdbcca', "is-search": "true", size: "large", type: "text", value: this.searchTerm, placeholder: "Rechercher une d\u00E9marche", onValueChanged: event => this.handleSearchInput(event) })), index.h("div", { key: 'b161657cab9854ba5b841a181e3fa9b31f887c0c', hidden: true, class: "spw-filter spw-tw-mb-6" }, Object.keys(this.filters).map(filterKey => (index.h("label", { class: "spw-tw-mr-4" }, index.h("input", { type: "checkbox", checked: this.filters[filterKey], onChange: (event) => this.handleFilterChange(filterKey, event.target.checked) }), index.h("span", { class: "spw-tw-ml-2" }, filterKey))))), this.totalItems === 0 && !this.isLoading ? (index.h("div", { class: "spw-no-results" }, index.h("h3", { class: "spw-no-results__title" }, "Aucun r\u00E9sultat ne correspond \u00E0 votre recherche."), index.h("ul", { class: "spw-no-results__list" }, index.h("li", null, "V\u00E9rifiez si votre orthographe est correcte"), index.h("li", null, "Supprimez des filtres"), index.h("li", null, "Essayez d\u2019autres termes de recherche")))) : null, this.totalItems > 0 && !this.isLoading ? (index.h("p", { class: "spw-results" }, this.totalItems, " ", resultsText)) : null, this.isLoading ? index.h("spw-loading", { class: "spw-tw-mb-10" }) : null, index.h("ul", { key: 'a4d473a1c9fd7777f5e825bf7eff84420f141dd7', class: "spw-list" }, this.items.map(item => (index.h("li", { class: "spw-list-item", key: item.name }, index.h("a", { href: item.url, target: "_blank" }, index.h("h3", { class: "spw-list-item__title" }, item.title), index.h("p", { class: "spw-list-item__text" }, item.summary)))))), totalPages > 1 && (index.h("spw-pagination", { key: 'c04a6ec754f9b6d136347f0de0c45ae8240dc5f4', class: "spw-tw-mt-12", currentPage: this.currentPage, "is-disabled": this.isLoading, totalItems: this.totalItems, itemsPerPage: this.itemsPerPage, onPageChanged: this.handlePageChanged.bind(this) }))));
+        return (index.h(index.Host, { key: 'ea95bf004af93055851da812e59fe293fe407c27' }, index.h("div", { key: '14acd70572f5fb6f8679f1b3683ea855a4a507f7', class: "spw-search-input" }, index.h("spw-text-field", { key: '56d8fee78634f3412a5db202f1caea1ddd82b643', "is-search": "true", size: "large", type: "text", value: this.searchTerm, placeholder: "Rechercher une d\u00E9marche", onValueChanged: event => this.handleSearchInput(event) })), index.h("div", { key: 'e0fe7ce9d3bcf8b499bdbc574e536508b72407b7', hidden: true, class: "spw-filter spw-tw-mb-6" }, Object.keys(this.filters).map(filterKey => (index.h("label", { class: "spw-tw-mr-4" }, index.h("input", { type: "checkbox", checked: this.filters[filterKey], onChange: (event) => this.handleFilterChange(filterKey, event.target.checked) }), index.h("span", { class: "spw-tw-ml-2" }, filterKey))))), this.totalItems === 0 && !this.isLoading ? (index.h("div", { class: "spw-no-results" }, index.h("h3", { class: "spw-no-results__title" }, "Aucun r\u00E9sultat ne correspond \u00E0 votre recherche."), index.h("ul", { class: "spw-no-results__list" }, index.h("li", null, "V\u00E9rifiez si votre orthographe est correcte"), index.h("li", null, "Supprimez des filtres"), index.h("li", null, "Essayez d\u2019autres termes de recherche")))) : null, this.totalItems > 0 && !this.isLoading ? (index.h("p", { class: "spw-results" }, this.totalItems, " ", resultsText)) : null, this.isLoading ? index.h("spw-loading", { class: "spw-tw-mb-10" }) : null, index.h("ul", { key: '03ae08cddc04f58a0eefb5e75e034fde08c2b1e0', class: "spw-list" }, this.items.map(item => (index.h("li", { class: "spw-list-item", key: item.name }, index.h("a", { href: item.url, target: "_blank" }, index.h("h3", { class: "spw-list-item__title" }, item.title), index.h("p", { class: "spw-list-item__text" }, item.summary)))))), totalPages > 1 && (index.h("spw-pagination", { key: '14e7e64ff658ec136f8537cb50850e10d9a61a04', class: "spw-tw-mt-12", currentPage: this.currentPage, "is-disabled": this.isLoading, totalItems: this.totalItems, itemsPerPage: this.itemsPerPage, onPageChanged: this.handlePageChanged.bind(this) }))));
     }
 };
 SpwIodda.style = spwIoddaCss;

package/dist/cjs/spw-list-description.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 const spwListDescriptionCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{-webkit-text-size-adjust:100%;line-height:1.3}h1,h2,h3,h4,h5,h6,li,p,ul{margin:0;padding:0}ul{list-style:none}:host{-webkit-text-size-adjust:100%;box-sizing:border-box;display:block;font-size:100%;line-height:1.3}:host *,:host :after,:host :before{box-sizing:inherit;font-family:Nunito Sans}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}:root{--spw-ds-container-xl:1200px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px;width:100%}@media (min-width:460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width:768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width:1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width:1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}.spw-list-description{color:var(--spw-color-themes-grey-grey-800);font-size:16px;line-height:1.5;margin-top:6px}.spw-list-description--has-clamp{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis}.spw-list-description--clamp-1{-webkit-line-clamp:1;line-clamp:1}.spw-list-description--clamp-2{-webkit-line-clamp:2;line-clamp:2}.spw-list-description--clamp-3{-webkit-line-clamp:3;line-clamp:3}.spw-list-description--clamp-4{-webkit-line-clamp:4;line-clamp:4}.spw-list-description--clamp-5{-webkit-line-clamp:5;line-clamp:5}.spw-list-description--clamp-6{-webkit-line-clamp:6;line-clamp:6}.spw-list-description--clamp-7{-webkit-line-clamp:7;line-clamp:7}.spw-list-description--clamp-8{-webkit-line-clamp:8;line-clamp:8}.spw-list-description--clamp-9{-webkit-line-clamp:9;line-clamp:9}.spw-list-description--clamp-10{-webkit-line-clamp:10;line-clamp:10}";
@@ -17,7 +17,7 @@ const SpwListDescription = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: '8df709182a652913eb36c0beb356106f15f0cf5e' }, index.h("div", { key: 'e5c3498c0f109f880fb3b9b8db9b5a83f0b36795', class: this.elementClass }, index.h("slot", { key: '1bbe92471d1c2e0d29a63b954ef1c558297bb0a2' }))));
+        return (index.h(index.Host, { key: '925d0f30cbc67c142da858fdaaa20478d22c1a44' }, index.h("div", { key: '6c5cf2d8d88b1c8d50dec302c10e0e604685cd54', class: this.elementClass }, index.h("slot", { key: 'eb21533589983ddfa49166e20415c203170e04cf' }))));
     }
 };
 SpwListDescription.style = spwListDescriptionCss;

package/dist/cjs/spw-list-item.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 const spwListItemCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{-webkit-text-size-adjust:100%;line-height:1.3}h1,h2,h3,h4,h5,h6,li,p,ul{margin:0;padding:0}ul{list-style:none}:host{-webkit-text-size-adjust:100%;box-sizing:border-box;display:contents;font-size:100%;line-height:1.3}:host *,:host :after,:host :before{box-sizing:inherit;font-family:Nunito Sans}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}:root{--spw-ds-container-xl:1200px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px;width:100%}@media (min-width:460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width:768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width:1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width:1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}.spw-list-item{color:var(--spw-color-themes-grey-grey-900);position:relative;text-decoration:none;transition:all .3s ease-in-out}.spw-list-item--hoverable:hover{transform:translateX(5px)}.spw-list-item a{text-decoration:none}.spw-list-item--icon{padding-left:28px}.spw-list-item__category{color:var(--spw-ds-primary);display:inline-block;font-size:16px;font-weight:700;line-height:1.5;margin-bottom:6px;position:relative}.spw-list-item__category spw-icon{left:-28px;position:absolute;top:2px}.spw-list-item__category--hoverable{cursor:pointer}.spw-list-item__category--hoverable:hover{text-decoration:underline}";
@@ -104,7 +104,7 @@ const SpwListItem = class {
                 href,
                 target,
             };
-        return (index.h(index.Host, { key: 'e384d43f9c6220367f309f30bbd031e031a72d59' }, index.h("li", { key: 'f3f689928003d9856b5d67bffb0954817d5ca1c8', class: this.elementClass }, this.category && (index.h("span", { key: 'ada6e2cf2173230ae6b3200ac4a167cc682be2ec', class: this.elementCatClass, onClick: () => this.handleClick() }, this.categoryIcon && index.h("spw-icon", { key: '6bb9cd13f2a28278dd1c08f73a20083e7cce33ba', icon: this.categoryIcon }), " ", this.category)), index.h(TagType, Object.assign({ key: '5edd2200f87d487a3936a1853588f1ea5dc1ea02' }, attrs), index.h("slot", { key: 'a1e3250ec54c2a8d6ef8907155d59a6ab8862fb3' })))));
+        return (index.h(index.Host, { key: '192d8ccef83045358b6ca57a52fd079a494ef36d' }, index.h("li", { key: 'e8d16cdf681e7fe3a11f783b3f44394f173e3930', class: this.elementClass }, this.category && (index.h("span", { key: 'a1e2e0c7e64ddb0fa9f357b1e0d60a71be9ca544', class: this.elementCatClass, onClick: () => this.handleClick() }, this.categoryIcon && index.h("spw-icon", { key: 'b347c9d90ad85c13f42a81c16199fd2e522c7430', icon: this.categoryIcon }), " ", this.category)), index.h(TagType, Object.assign({ key: 'b1b4cee16f6ace291d9e822a080c722befecf98d' }, attrs), index.h("slot", { key: 'ca0c1aeccb72f623732f528938f5b6c8cec8b51a' })))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/spw-list-title.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 const spwListTitleCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{-webkit-text-size-adjust:100%;line-height:1.3}h1,h2,h3,h4,h5,h6,li,p,ul{margin:0;padding:0}ul{list-style:none}:host{-webkit-text-size-adjust:100%;box-sizing:border-box;display:block;font-size:100%;line-height:1.3}:host *,:host :after,:host :before{box-sizing:inherit;font-family:Nunito Sans}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}:root{--spw-ds-container-xl:1200px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px;width:100%}@media (min-width:460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width:768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width:1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width:1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}.spw-ds-typography,[class*=spw-ds-typography-]{font-family:Nunito Sans}.spw-ds-typography-display-1{font-size:56px;font-weight:400;line-height:1.2}@media (min-width:1024px){.spw-ds-typography-display-1{font-size:68px;font-weight:400;line-height:1.1}}.spw-ds-typography-display-2{font-size:40px;font-weight:400;line-height:1.25}@media (min-width:1024px){.spw-ds-typography-display-2{font-size:56px;font-weight:400;line-height:1.2}}.spw-ds-typography-display-3{font-size:32px;font-weight:400;line-height:1.4}@media (min-width:1024px){.spw-ds-typography-display-3{font-size:48px;font-weight:400;line-height:1.2}}.spw-ds-typography-heading-01{font-size:28px;font-weight:700;line-height:1.4}@media (min-width:1024px){.spw-ds-typography-heading-01{font-size:32px;font-weight:700;line-height:1.25}}.spw-ds-typography-heading-02{font-size:24px;font-weight:700;line-height:1.4}@media (min-width:1024px){.spw-ds-typography-heading-02{font-size:28px;font-weight:700;line-height:1.3}}.spw-ds-typography-heading-03{font-size:20px;font-weight:700;line-height:1.4}@media (min-width:1024px){.spw-ds-typography-heading-03{font-size:20px;font-weight:700;line-height:1.4}}.spw-ds-typography-heading-04,:host(.--default) .spw-list-title{font-size:18px;font-weight:700;line-height:1.5}@media (min-width:1024px){.spw-ds-typography-heading-04,:host(.--default) .spw-list-title{font-size:18px;font-weight:700;line-height:1.5}}.spw-ds-typography-heading-05,:host(.--shortcut) .spw-list-title{font-size:16px;font-weight:700;line-height:1.5}@media (min-width:1024px){.spw-ds-typography-heading-05,:host(.--shortcut) .spw-list-title{font-size:16px;font-weight:700;line-height:1.6}}.spw-ds-typography-heading-06{font-size:14px;font-weight:700;line-height:1.7}@media (min-width:1024px){.spw-ds-typography-heading-06{font-size:14px;font-weight:700;line-height:1.6}}.spw-ds-typography-lead-body{font-size:20px!important;font-weight:400;line-height:1.6}@media (min-width:1024px){.spw-ds-typography-lead-body{font-size:20px;font-weight:400;line-height:1.5}}.spw-ds-typography-lead-body-compact{font-size:20px;font-weight:400;line-height:1.5}@media (min-width:1024px){.spw-ds-typography-lead-body-compact{font-size:20px;font-weight:400;line-height:1.25}}.spw-ds-typography-body-1{font-size:18px;font-weight:400;line-height:1.6}@media (min-width:1024px){.spw-ds-typography-body-1{font-size:18px;font-weight:400;line-height:1.5}}.spw-ds-typography-body-compact-1{font-size:18px;font-weight:400;line-height:1.5}@media (min-width:1024px){.spw-ds-typography-body-compact-1{font-size:18px;font-weight:400;line-height:1.25}}.spw-ds-typography-body-2{font-size:16px;font-weight:400;line-height:1.6}@media (min-width:1024px){.spw-ds-typography-body-2{font-size:16px;font-weight:400;line-height:1.5}}.spw-ds-typography-body-compact-2{font-size:16px;font-weight:400;line-height:1.5}@media (min-width:1024px){.spw-ds-typography-body-compact-2{font-size:16px;font-weight:400;line-height:1.25}}.spw-ds-typography-body-3{font-size:14px;font-weight:400;line-height:1.6}@media (min-width:1024px){.spw-ds-typography-body-3{font-size:14px;font-weight:400;line-height:1.5}}.spw-ds-typography-body-compact-3{font-size:14px;font-weight:400;line-height:1.5}@media (min-width:1024px){.spw-ds-typography-body-compact-3{font-size:14px;font-weight:400;line-height:1.25}}.spw-ds-typography-tag{font-size:14px;font-weight:700;line-height:1.2}.spw-ds-typography-label{font-size:16px;font-weight:600;line-height:1.2}.spw-ds-typography-date{font-size:16px;font-weight:300;line-height:1}.spw-ds-typography-caption{font-size:14px;font-style:italic;font-weight:300;line-height:1}.spw-ds-typography-link{border-bottom:1px solid var(--spw-ds-primary);color:var(--spw-ds-primary);font-size:inherit;font-weight:700;line-height:1.2}.spw-ds-typography-link:hover{color:var(--spw-ds-variant)}.spw-ds-typography-link:active{color:var(--spw-ds-active)}.spw-ds-typography-link:active,.spw-ds-typography-link:hover{border-color:currentColor;border-width:2px}.spw-ds-typography-hint{font-size:14px;font-weight:400;line-height:1.5}.spw-ds-typography-code{font-family:monospace;font-size:14px;font-weight:400;line-height:1.2}.spw-ds-typography-overline{font-size:10px;font-weight:800;line-height:1;text-transform:uppercase}.spw-list-title{display:inline-flex;position:relative;transition:all .2s linear}.spw-list-title spw-icon{color:var(--spw-ds-primary);left:-28px;position:absolute;top:4px;transition:all .2s linear}:host(.--active) .spw-list-title spw-icon{color:var(--spw-ds-active)}.spw-list-title__content-text{border-bottom:1px solid transparent;display:inline;transition:all .2s linear}:host(.--hovered) .spw-list-title__content-text{border-color:var(--spw-ds-primary)}:host(.--active) .spw-list-title__content-text{border-color:var(--spw-ds-active)}:host(.--default) .spw-list-title{color:var(--spw-color-themes-grey-grey-900)}:host(.--shortcut) .spw-list-title{color:var(--spw-ds-primary)}:host(.--hovered) .spw-list-title{color:var(--spw-ds-primary)}:host(.--active) .spw-list-title{color:var(--spw-ds-active)}.spw-list-title--has-clamp .spw-list-title__content{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis}.spw-list-title--clamp-1 .spw-list-title__content{-webkit-line-clamp:1;line-clamp:1}.spw-list-title--clamp-2 .spw-list-title__content{-webkit-line-clamp:2;line-clamp:2}.spw-list-title--clamp-3 .spw-list-title__content{-webkit-line-clamp:3;line-clamp:3}.spw-list-title--clamp-4 .spw-list-title__content{-webkit-line-clamp:4;line-clamp:4}.spw-list-title--clamp-5 .spw-list-title__content{-webkit-line-clamp:5;line-clamp:5}.spw-list-title--clamp-6 .spw-list-title__content{-webkit-line-clamp:6;line-clamp:6}.spw-list-title--clamp-7 .spw-list-title__content{-webkit-line-clamp:7;line-clamp:7}.spw-list-title--clamp-8 .spw-list-title__content{-webkit-line-clamp:8;line-clamp:8}.spw-list-title--clamp-9 .spw-list-title__content{-webkit-line-clamp:9;line-clamp:9}.spw-list-title--clamp-10 .spw-list-title__content{-webkit-line-clamp:10;line-clamp:10}";
@@ -18,7 +18,7 @@ const SpwListTitle = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: 'ce3f7f56d9b976a92464e01bd770de53708a5418' }, index.h("div", { key: '192299d836e27078b26f7640cef0af065c0c9449', class: this.elementClass }, this.icon && index.h("spw-icon", { key: 'a4a10d0ac6c7eafe6f6b9cb915548a633640f730', icon: this.icon }), index.h("div", { key: '9bc9daffc9f7e728629c3f381452146129f1e3c9', class: "spw-list-title__content" }, index.h("div", { key: '954d01415386841993600c4731542c0de2621194', class: "spw-list-title__content-text" }, index.h("slot", { key: '916bbcc355daf8d6942c371215eebb9871cb5cd3' }))))));
+        return (index.h(index.Host, { key: 'ad14bfcd3bfada1c60232e997dd33652a64fbb4f' }, index.h("div", { key: 'bcbcec42f4bfaeafccc79f043a15d5367417ccb9', class: this.elementClass }, this.icon && index.h("spw-icon", { key: '3c9a1c92397cb9d515a33f128ccb4cbdae647d10', icon: this.icon }), index.h("div", { key: '7750035079b904fd161cc50911726c44387fb9e5', class: "spw-list-title__content" }, index.h("div", { key: 'd6747d9c5df1fa4fb599d32a21d924353ed39508', class: "spw-list-title__content-text" }, index.h("slot", { key: '97fd31f8a4ef2824ae0f708d1f295e5be0e7fcd7' }))))));
     }
 };
 SpwListTitle.style = spwListTitleCss;

package/dist/cjs/spw-list.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 const spwListCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{-webkit-text-size-adjust:100%;line-height:1.3}h1,h2,h3,h4,h5,h6,li,p,ul{margin:0;padding:0}ul{list-style:none}:host{-webkit-text-size-adjust:100%;box-sizing:border-box;display:block;font-size:100%;line-height:1.3}:host *,:host :after,:host :before{box-sizing:inherit;font-family:Nunito Sans}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}:root{--spw-ds-container-xl:1200px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px;width:100%}@media (min-width:460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width:768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width:1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width:1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}.spw-list{display:flex;flex-direction:column}.spw-list--small{gap:12px}.spw-list--medium{gap:24px}.spw-list--large{gap:32px}";
@@ -17,7 +17,7 @@ const SpwList = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: '059f274ca3a1cf4dd9d09eeb0efa03fd30418e62' }, index.h("ul", { key: '8fca26bbe4501a3cad7a541761bf978593e132c0', class: this.elementClass }, index.h("slot", { key: '66127da5a78a3c3e10b6d2f22dce9b539810bedd' }))));
+        return (index.h(index.Host, { key: '86ca7deb432066f7b72a9f0e831f086c83c951e1' }, index.h("ul", { key: '0f52adae23009c2fc4ceefa8bdb5cde7ff24d1a3', class: this.elementClass }, index.h("slot", { key: 'cf2221f6fd25097e90110418f7b17c5570e4ea9e' }))));
     }
 };
 SpwList.style = spwListCss;

package/dist/cjs/spw-message.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 const getIcon = variant => {
   const icons = {

package/dist/cjs/spw-modal.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 /**
  * Copy/pasted from https://github.com/andreasbm/focus-trap
@@ -163,7 +163,8 @@ const SpwModal = class {
         this.showCloseButton = true;
         this.focusableElements = [];
         this.handleClick = (event) => {
-            const trigger = event.target.closest('[data-modal-trigger]');
+            const path = event.composedPath();
+            const trigger = path.find(el => { var _a; return el instanceof HTMLElement && ((_a = el.hasAttribute) === null || _a === void 0 ? void 0 : _a.call(el, 'data-modal-trigger')); });
             if (trigger) {
                 const modalId = trigger.getAttribute('data-modal-trigger');
                 if (modalId === this.hostElement.id) {
@@ -172,7 +173,8 @@ const SpwModal = class {
             }
         };
         this.handleClose = (event) => {
-            const trigger = event.target.closest('[data-modal-close]');
+            const path = event.composedPath();
+            const trigger = path.find(el => { var _a; return el instanceof HTMLElement && ((_a = el.hasAttribute) === null || _a === void 0 ? void 0 : _a.call(el, 'data-modal-close')); });
             if (trigger) {
                 const modalId = trigger.getAttribute('data-modal-close');
                 if (modalId === this.hostElement.id) {
@@ -208,14 +210,14 @@ const SpwModal = class {
     }
     componentDidLoad() {
         this.focusableElements = queryShadowRoot(this.hostElement.shadowRoot, el => isHidden(el) || el.matches('[data-focus-trap-edge]'), isFocusable);
-        document.addEventListener('click', this.handleClick);
-        document.addEventListener('click', this.handleClose);
-        document.addEventListener('keydown', this.handleKeypress);
+        window.addEventListener('click', this.handleClick, { capture: true });
+        window.addEventListener('click', this.handleClose, { capture: true });
+        window.addEventListener('keydown', this.handleKeypress);
     }
     disconnectedCallback() {
-        document.removeEventListener('click', this.handleClick);
-        document.removeEventListener('click', this.handleClose);
-        document.removeEventListener('keydown', this.handleKeypress);
+        window.removeEventListener('click', this.handleClick);
+        window.removeEventListener('click', this.handleClose);
+        window.removeEventListener('keydown', this.handleKeypress);
     }
     getFirstFocusableElement() {
         return this.focusableElements[0];
@@ -292,7 +294,7 @@ const SpwModal = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: 'e7aa4b92f0553b8ec8cf5739e6f3a88c8c9e9362' }, index.h("div", { key: '732932f05f09d1d6368c7cf8c76d0d1cfa5f58d1', ref: el => (this.modalContainer = el), class: this.elementClass }, index.h("div", { key: 'ea426266f02a3579cfca5ebe8ec93dc490918de1', class: "spw-modal__overlay", onClick: () => this.handleOverlayClick() }), index.h("div", { key: '42669843354d7e1b6a5d834c413d31bfd73f0709', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabindex: "0" }), index.h("div", { key: 'c922f2f70443aa1f09dd1a60fd92fc4f6416fc04', class: `spw-modal__content-container spw-modal__content-container--${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, index.h("div", { key: '5d864bdc5921b9d9988144907a2955040285d8ca', class: "spw-modal__content" }, index.h("div", { key: 'e19de05508a77e25cb8a6e909eb8175303728d58', class: "spw-modal__header" }, index.h("h2", { key: 'b0d704cd27fe9e37440277c161e2f684dbc8141b', class: "spw-modal__caption" }, this.caption), this.showCloseButton && (index.h("spw-icon", { key: 'faddb3d23759e88242f2f4e4cd621790c4a87774', class: "spw-modal__close-button", ref: el => (this.closeButton = el), icon: "fa-xmark", onClick: () => this.doBeforeClose('CLOSE_BUTTON') }))), index.h("div", { key: 'e1b4c7f3dcdd762be5ad3277692b41b267d8eae0', class: "spw-modal__body" }, index.h("slot", { key: 'a7b36ec6180fe2fa06e087d4a87b16ba64ff2358', name: "content" })), index.h("div", { key: '5f23c91f1e3aa024f0d0aa7535a523f688489a4b', class: "spw-modal__buttons" }, index.h("slot", { key: '64ec09bca6ee569425d502838f244b16482cd1f7', name: "buttons" })))), index.h("div", { key: 'bddd086e4c65abee18d97e04f70232445c2b1815', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
+        return (index.h(index.Host, { key: 'ef446d6e84161f88485255def8ee494708ec0df2' }, index.h("div", { key: '9b4e6890821050b91cadbd5a62618fe5adef5e84', ref: el => (this.modalContainer = el), class: this.elementClass }, index.h("div", { key: '1f529135feeca79fdff181f1df0b3765ed3e13d7', class: "spw-modal__overlay", onClick: () => this.handleOverlayClick() }), index.h("div", { key: '8b66590a0ff6797f4ef30cd2ab54b4474166f3bc', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabindex: "0" }), index.h("div", { key: '0d9347f636fb221c5f64b9ebdf87ca223e1fdd6f', class: `spw-modal__content-container spw-modal__content-container--${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, index.h("div", { key: 'a7b273cad091dfed171c705c64c89bc9906f014b', class: "spw-modal__content" }, index.h("div", { key: 'dc4f195d8c84c8cd52c667b60a16d9637be024a0', class: "spw-modal__header" }, index.h("h2", { key: '4d195c0506a9a27af370fb8788e89a9243e116e0', class: "spw-modal__caption" }, this.caption), this.showCloseButton && (index.h("spw-icon", { key: '6fcaae9a6ec5712523d33a06471486c1553ed267', class: "spw-modal__close-button", ref: el => (this.closeButton = el), icon: "fa-xmark", onClick: () => this.doBeforeClose('CLOSE_BUTTON') }))), index.h("div", { key: 'bf3a82093a70f082995e4d471d42080fb260b212', class: "spw-modal__body" }, index.h("slot", { key: 'ed2f1e1fac388d4e42528831e8cfecf9d1517458', name: "content" })), index.h("div", { key: '0f33c657c7233fe1f98dd760fd725c3a12ab034c', class: "spw-modal__buttons" }, index.h("slot", { key: 'd1aba450ab89283394f7590967508eef80d50a42', name: "buttons" })))), index.h("div", { key: 'a2f78f2fd167f99abe6438e70ef3f68d24d845c8', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/spw-modal.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"spw-modal.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/utils/focus-trap.ts","src/utils/animation.ts","src/components/spw-modal/spw-modal.scss?tag=spw-modal&encapsulation=shadow","src/components/spw-modal/spw-modal.tsx"],"sourcesContent":["/*\n Copy/pasted from https://github.com/andreasbm/focus-trap\n /\n\n/\n Traverses the slots of the open shadowroots and returns all children matching the query.\n * We need to traverse each child-depth one at a time because if an element should be skipped\n * (for example because it is hidden) we need to skip all of it's children. If we use querySelectorAll(\"\")\n the information of whether the children is within a hidden parent is lost.\n * @param {ShadowRoot \| HTMLElement} root\n * @param skipNode\n * @param isMatch\n * @param {number} maxDepth\n * @param {number} depth\n * @returns {HTMLElement[]}\n /\nexport function queryShadowRoot(\n root: ShadowRoot \| HTMLElement,\n skipNode: ($elem: HTMLElement) => boolean,\n isMatch: ($elem: HTMLElement) => boolean,\n maxDepth: number = 20,\n depth: number = 0,\n): HTMLElement[] {\n const matches: HTMLElement[] = [];\n\n // If the depth is above the max depth, abort the searching here.\n if (depth >= maxDepth) {\n return matches;\n }\n\n // Traverses a slot element\n const traverseSlot = ($slot: HTMLSlotElement) => {\n // Only check nodes that are of the type Node.ELEMENT_NODE\n // Read more here https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType\n const assignedNodes = $slot.assignedNodes().filter(node => node.nodeType === 1);\n if (assignedNodes.length > 0) {\n const $slotParent = assignedNodes[0].parentElement!;\n return queryShadowRoot($slotParent, skipNode, isMatch, maxDepth, depth + 1);\n }\n\n return [];\n };\n\n // Go through each child and continue the traversing if necessary\n // Even though the typing says that children can't be undefined, Edge 15 sometimes gives an undefined value.\n // Therefore we fallback to an empty array if it is undefined.\n const children = Array.from(root.children \|\| []) as HTMLElement[];\n for (const $child of children) {\n // Check if the element and its descendants should be skipped\n if (skipNode($child)) {\n // console.log('-- SKIP', $child);\n continue;\n }\n\n // console.log('$child', $child);\n\n // If the element matches we always add it\n if (isMatch($child)) {\n matches.push($child);\n }\n\n if ($child.shadowRoot != null) {\n // If the element has a shadow root we need to traverse it\n matches.push(...queryShadowRoot($child.shadowRoot, skipNode, isMatch, maxDepth, depth + 1));\n } else if ($child.tagName === 'SLOT') {\n // If the child is a slot we need to traverse each assigned node\n matches.push(...traverseSlot($child as HTMLSlotElement));\n } else {\n // Traverse the children of the element\n matches.push(...queryShadowRoot($child, skipNode, isMatch, maxDepth, depth + 1));\n }\n }\n\n return matches;\n}\n\n/\n Returns whether the element is hidden.\n * @param $elem\n /\nexport function isHidden($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('hidden') \|\|\n ($elem.hasAttribute('aria-hidden') && $elem.getAttribute('aria-hidden') !== 'false') \|\|\n // A quick and dirty way to check whether the element is hidden.\n // For a more fine-grained check we could use \"window.getComputedStyle\" but we don't because of bad performance.\n // If the element has visibility set to \"hidden\" or \"collapse\", display set to \"none\" or opacity set to \"0\" through CSS\n // we won't be able to catch it here. We accept it due to the huge performance benefits.\n $elem.style.display === `none` \|\|\n $elem.style.opacity === `0` \|\|\n $elem.style.visibility === `hidden` \|\|\n $elem.style.visibility === `collapse`\n );\n\n // If offsetParent is null we can assume that the element is hidden\n // https://stackoverflow.com/questions/306305/what-would-make-offsetparent-null\n // \|\| $elem.offsetParent == null;\n}\n\n/\n Returns whether the element is disabled.\n * @param $elem\n /\nexport function isDisabled($elem: HTMLElement): boolean {\n return $elem.hasAttribute('disabled') \|\| ($elem.hasAttribute('aria-disabled') && $elem.getAttribute('aria-disabled') !== 'false');\n}\n\n/\n Determines whether an element is focusable.\n * Read more here: https://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus/1600194#1600194\n * Or here: https://stackoverflow.com/questions/18261595/how-to-check-if-a-dom-element-is-focusable\n * @param $elem\n /\nexport function isFocusable($elem: HTMLElement): boolean {\n // Discard elements that are removed from the tab order.\n if ($elem.getAttribute('tabindex') === '-1' \|\| isHidden($elem) \|\| isDisabled($elem)) {\n return false;\n }\n\n return (\n // At this point we know that the element can have focus (eg. won't be -1) if the tabindex attribute exists\n $elem.hasAttribute('tabindex') \|\|\n // Anchor tags or area tags with a href set\n (($elem instanceof HTMLAnchorElement \|\| $elem instanceof HTMLAreaElement) && $elem.hasAttribute('href')) \|\|\n // Form elements which are not disabled\n $elem instanceof HTMLButtonElement \|\|\n $elem instanceof HTMLInputElement \|\|\n $elem instanceof HTMLTextAreaElement \|\|\n $elem instanceof HTMLSelectElement \|\|\n // IFrames\n $elem instanceof HTMLIFrameElement\n );\n}\n","export function animationTo(element: HTMLElement, keyframes: Keyframe \| Keyframe[], options?: KeyframeAnimationOptions) {\n const animated = element.animate(keyframes, { ...options, fill: 'both' });\n animated.addEventListener('finish', () => {\n // @ts-ignore\n animated.commitStyles();\n animated.cancel();\n });\n\n return animated;\n}\n\nconst keyframeDefaults = {\n easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',\n};\n\nexport const KEYFRAMES = {\n fadeIn: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 0,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 1,\n },\n ],\n fadeOut: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 1,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 0,\n },\n ],\n};\n",":host {\n display: contents;\n}\n\n.spw-modal {\n display: none;\n justify-content: center;\n align-items: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1060;\n overflow-y: auto;\n\n &--opened {\n display: flex;\n }\n}\n\n.spw-modal__overlay {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: black;\n opacity: 0.7;\n z-index: 0;\n}\n\n.spw-modal__content-container {\n position: absolute;\n display: flex;\n justify-content: center;\n width: 90%;\n background-color: #fff;\n box-shadow: var(--spw-effect-elevation-6);\n overflow: hidden;\n box-sizing: border-box;\n align-items: stretch;\n border-radius: var(--spw-spacings-border-radius-lg);\n\n &--small {\n max-width: 480px;\n }\n\n &--medium {\n max-width: 600px;\n }\n\n &--large {\n max-width: 768px;\n }\n\n &--fluid {\n max-width: 100%;\n }\n}\n\n.spw-modal__content {\n display: flex;\n flex-direction: column;\n border: 1px solid var(--spw-color-themes-grey-grey-300);\n width: 100%;\n max-height: 90vh;\n overflow-y: auto;\n\n .spw-modal--sticky-buttons & {\n overflow-y: visible;\n }\n}\n\n.spw-modal__icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n background-color: #fff;\n align-self: stretch;\n}\n\n.spw-modal__header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 24px;\n padding-bottom: 0;\n margin-top: 6px;\n margin-bottom: 12px;\n box-sizing: border-box;\n border-radius: 1px 1px 0px 0px;\n color: var(--spw-colors-support-grey-grey-900);\n}\n\n.spw-modal__caption {\n overflow: hidden;\n white-space: pre-wrap;\n word-wrap: break-word;\n}\n\n.spw-modal__header h2 {\n margin: 0;\n font-size: 18px;\n color: var(--spw-colors-support-grey-grey-900);\n}\n\n.spw-modal__header button {\n background: none;\n border: none;\n font-size: 1.5em;\n padding: 0;\n cursor: pointer;\n}\n\n.spw-modal__close-button {\n position: absolute;\n top: 12px;\n right: 12px;\n cursor: pointer;\n font-size: 21px;\n &:hover {\n opacity: 0.7;\n }\n}\n\n.spw-modal__body {\n padding: 0 24px;\n margin-bottom: 12px;\n box-sizing: border-box;\n flex: 1;\n font-size: 16px;\n color: var(--spw-colors-support-grey-grey-700);\n\n .spw-modal--sticky-buttons & {\n overflow-y: auto;\n }\n}\n\n.spw-modal__buttons {\n ::slotted([slot='buttons']) {\n padding: 24px;\n padding-top: 12px;\n }\n}\n\n.spw-modal__footer--buttons-present ::slotted() {\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n padding: 24px;\n padding-top: 8px;\n\n .spw-modal__content-container--small & {\n flex-direction: column;\n gap: 8px;\n }\n\n .spw-modal__content-container--medium & {\n display: grid;\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n\n.spw-modal__border {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n font-size: 1.5em;\n flex-grow: 1;\n}\n","import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch, Method } from '@stencil/core';\nimport { queryShadowRoot, isHidden, isFocusable } from '@utils/focus-trap';\nimport { animationTo, KEYFRAMES } from '@utils/animation';\n\ntype CloseEventTrigger = 'CLOSE_BUTTON' \| 'ESCAPE_KEY' \| 'BACKDROP' \| 'PROGRAMMATIC';\n\nexport interface BeforeCloseEventDetail {\n trigger: CloseEventTrigger;\n}\n\n@Component({\n tag: 'spw-modal',\n styleUrl: 'spw-modal.scss',\n shadow: true,\n})\nexport class SpwModal {\n /** Indique si la modal est ouverte ou fermée, mutable et reflétée dans le DOM /\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\n\n @State() showModal: boolean = this.opened \|\| false;\n\n /* Titre de la modal /\n @Prop() caption: string = 'Titre de la modal';\n /* Indique si la fermeture de la modal est possible en cliquant sur l'overlay /\n @Prop() closeOnOverlayClick: boolean = true;\n /* Rend les boutons en bas de la modal \"collants\" (toujours visibles) si vrai /\n @Prop() stickyButtons: boolean = false;\n /* Événement déclenché lors de l'ouverture de la modal /\n @Event() spwModalOpen: EventEmitter;\n /* Événement déclenché lors de la fermeture de la modal /\n @Event() spwModalClose: EventEmitter;\n /* Définit la taille de la modal : 'small', 'medium', 'large' ou 'fluid' /\n @Prop() size: 'small' \| 'medium' \| 'large' \| 'fluid' = 'small';\n /* Icône d'alerte à afficher dans la modal /\n @Prop() alertIcon: string = '';\n\n @Element() hostElement: HTMLSpwModalElement;\n\n @State() slotButtonsPresent: boolean = false;\n\n /* Indique si le bouton de fermeture est visible /\n @Prop() showCloseButton: boolean = true;\n\n private modalContainer: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n private closeButton: HTMLSpwIconElement;\n\n /\n Méthode publique pour fermer la modal programmatiquement\n * @returns Promise qui se résout quand la modal est fermée\n /\n @Method()\n async closeModal(): Promise<void> {\n this.doBeforeClose('PROGRAMMATIC');\n }\n\n /\n Méthode publique pour ouvrir la modal programmatiquement\n * @returns Promise qui se résout quand la modal est ouverte\n */\n @Method()\n async openModal(): Promise<void> {\n this.opened = true;\n }\n\n componentDidLoad() {\n this.focusableElements = queryShadowRoot(this.hostElement.shadowRoot, el => isHidden(el) \|\| el.matches('[data-focus-trap-edge]'), isFocusable);\n document.addEventListener('click', this.handleClick);\n document.addEventListener('click', this.handleClose);\n document.addEventListener('keydown', this.handleKeypress);\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this.handleClick);\n document.removeEventListener('click', this.handleClose);\n document.removeEventListener('keydown', this.handleKeypress);\n }\n\n private handleClick = (event: MouseEvent) => {\n const trigger = (event.target as HTMLElement).closest('[data-modal-trigger]');\n if (trigger) {\n const modalId = trigger.getAttribute('data-modal-trigger');\n if (modalId === this.hostElement.id) {\n this.opened = true;\n }\n }\n };\n\n private handleClose = (event: MouseEvent) => {\n const trigger = (event.target as HTMLElement).closest('[data-modal-close]');\n if (trigger) {\n const modalId = trigger.getAttribute('data-modal-close');\n if (modalId === this.hostElement.id) {\n this.opened = false;\n }\n }\n };\n\n private getFirstFocusableElement(): HTMLElement \| null {\n return this.focusableElements[0];\n }\n\n private getLastFocusableElement(): HTMLElement \| null {\n return this.focusableElements[this.focusableElements.length - 1];\n }\n\n private handleTopFocus = () => {\n this.attemptFocus(this.getLastFocusableElement());\n };\n\n private handleBottomFocus = () => {\n this.attemptFocus(this.getFirstFocusableElement());\n };\n\n private attemptFocus(element: HTMLElement \| null) {\n if (element == null) {\n setTimeout(() => {\n this.closeButton.focus();\n });\n return;\n }\n\n setTimeout(() => {\n element.focus();\n }, 0);\n }\n\n private open() {\n this.showModal = true;\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n setTimeout(() => {\n this.getLastFocusableElement()?.focus();\n this.getLastFocusableElement()?.blur();\n }, 0);\n\n this.spwModalOpen.emit();\n });\n } catch (err) {\n this.spwModalOpen.emit();\n }\n }\n\n private close() {\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n this.showModal = false;\n this.spwModalClose.emit();\n });\n } catch (err) {\n this.showModal = false;\n this.spwModalClose.emit();\n }\n }\n\n private handleKeypress = (event: KeyboardEvent) => {\n if (this.showModal && event.key === 'Escape') {\n this.doBeforeClose('ESCAPE_KEY');\n }\n };\n\n private doBeforeClose(trigger: CloseEventTrigger) {\n const triggers = [];\n triggers.push(trigger);\n const prevented = triggers.some(event => event.defaultPrevented);\n if (!prevented) {\n this.opened = false;\n }\n }\n\n @Watch('opened')\n openedChanged(newValue: boolean) {\n newValue === true ? this.open() : this.close();\n }\n\n private handleOverlayClick() {\n if (this.closeOnOverlayClick) {\n this.doBeforeClose('BACKDROP');\n }\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-modal': true,\n 'spw-modal--opened': this.showModal,\n 'spw-modal--sticky-buttons': this.stickyButtons,\n };\n }\n\n render() {\n return (\n <Host>\n <div ref={el => (this.modalContainer = el)} class={this.elementClass}>\n <div class=\"spw-modal__overlay\" onClick={() => this.handleOverlayClick()}></div>\n <div data-focus-trap-edge onFocus={this.handleTopFocus} tabindex=\"0\"></div>\n <div class={`spw-modal__content-container spw-modal__content-container--${this.size}`} role=\"dialog\" aria-modal=\"true\" aria-label={this.caption}>\n <div class=\"spw-modal__content\">\n <div class=\"spw-modal__header\">\n <h2 class=\"spw-modal__caption\">{this.caption}</h2>\n {this.showCloseButton && (\n <spw-icon class=\"spw-modal__close-button\" ref={el => (this.closeButton = el)} icon=\"fa-xmark\" onClick={() => this.doBeforeClose('CLOSE_BUTTON')}></spw-icon>\n )}\n </div>\n <div class=\"spw-modal__body\">\n <slot name=\"content\" />\n </div>\n <div class=\"spw-modal__buttons\">\n <slot name=\"buttons\"></slot>\n </div>\n </div>\n </div>\n <div data-focus-trap-edge onFocus={this.handleBottomFocus} tabindex=\"0\"></div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-modal.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/utils/focus-trap.ts","src/utils/animation.ts","src/components/spw-modal/spw-modal.scss?tag=spw-modal&encapsulation=shadow","src/components/spw-modal/spw-modal.tsx"],"sourcesContent":["/*\n Copy/pasted from https://github.com/andreasbm/focus-trap\n /\n\n/\n Traverses the slots of the open shadowroots and returns all children matching the query.\n * We need to traverse each child-depth one at a time because if an element should be skipped\n * (for example because it is hidden) we need to skip all of it's children. If we use querySelectorAll(\"\")\n the information of whether the children is within a hidden parent is lost.\n * @param {ShadowRoot \| HTMLElement} root\n * @param skipNode\n * @param isMatch\n * @param {number} maxDepth\n * @param {number} depth\n * @returns {HTMLElement[]}\n /\nexport function queryShadowRoot(\n root: ShadowRoot \| HTMLElement,\n skipNode: ($elem: HTMLElement) => boolean,\n isMatch: ($elem: HTMLElement) => boolean,\n maxDepth: number = 20,\n depth: number = 0,\n): HTMLElement[] {\n const matches: HTMLElement[] = [];\n\n // If the depth is above the max depth, abort the searching here.\n if (depth >= maxDepth) {\n return matches;\n }\n\n // Traverses a slot element\n const traverseSlot = ($slot: HTMLSlotElement) => {\n // Only check nodes that are of the type Node.ELEMENT_NODE\n // Read more here https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType\n const assignedNodes = $slot.assignedNodes().filter(node => node.nodeType === 1);\n if (assignedNodes.length > 0) {\n const $slotParent = assignedNodes[0].parentElement!;\n return queryShadowRoot($slotParent, skipNode, isMatch, maxDepth, depth + 1);\n }\n\n return [];\n };\n\n // Go through each child and continue the traversing if necessary\n // Even though the typing says that children can't be undefined, Edge 15 sometimes gives an undefined value.\n // Therefore we fallback to an empty array if it is undefined.\n const children = Array.from(root.children \|\| []) as HTMLElement[];\n for (const $child of children) {\n // Check if the element and its descendants should be skipped\n if (skipNode($child)) {\n // console.log('-- SKIP', $child);\n continue;\n }\n\n // console.log('$child', $child);\n\n // If the element matches we always add it\n if (isMatch($child)) {\n matches.push($child);\n }\n\n if ($child.shadowRoot != null) {\n // If the element has a shadow root we need to traverse it\n matches.push(...queryShadowRoot($child.shadowRoot, skipNode, isMatch, maxDepth, depth + 1));\n } else if ($child.tagName === 'SLOT') {\n // If the child is a slot we need to traverse each assigned node\n matches.push(...traverseSlot($child as HTMLSlotElement));\n } else {\n // Traverse the children of the element\n matches.push(...queryShadowRoot($child, skipNode, isMatch, maxDepth, depth + 1));\n }\n }\n\n return matches;\n}\n\n/\n Returns whether the element is hidden.\n * @param $elem\n /\nexport function isHidden($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('hidden') \|\|\n ($elem.hasAttribute('aria-hidden') && $elem.getAttribute('aria-hidden') !== 'false') \|\|\n // A quick and dirty way to check whether the element is hidden.\n // For a more fine-grained check we could use \"window.getComputedStyle\" but we don't because of bad performance.\n // If the element has visibility set to \"hidden\" or \"collapse\", display set to \"none\" or opacity set to \"0\" through CSS\n // we won't be able to catch it here. We accept it due to the huge performance benefits.\n $elem.style.display === `none` \|\|\n $elem.style.opacity === `0` \|\|\n $elem.style.visibility === `hidden` \|\|\n $elem.style.visibility === `collapse`\n );\n\n // If offsetParent is null we can assume that the element is hidden\n // https://stackoverflow.com/questions/306305/what-would-make-offsetparent-null\n // \|\| $elem.offsetParent == null;\n}\n\n/\n Returns whether the element is disabled.\n * @param $elem\n /\nexport function isDisabled($elem: HTMLElement): boolean {\n return $elem.hasAttribute('disabled') \|\| ($elem.hasAttribute('aria-disabled') && $elem.getAttribute('aria-disabled') !== 'false');\n}\n\n/\n Determines whether an element is focusable.\n * Read more here: https://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus/1600194#1600194\n * Or here: https://stackoverflow.com/questions/18261595/how-to-check-if-a-dom-element-is-focusable\n * @param $elem\n /\nexport function isFocusable($elem: HTMLElement): boolean {\n // Discard elements that are removed from the tab order.\n if ($elem.getAttribute('tabindex') === '-1' \|\| isHidden($elem) \|\| isDisabled($elem)) {\n return false;\n }\n\n return (\n // At this point we know that the element can have focus (eg. won't be -1) if the tabindex attribute exists\n $elem.hasAttribute('tabindex') \|\|\n // Anchor tags or area tags with a href set\n (($elem instanceof HTMLAnchorElement \|\| $elem instanceof HTMLAreaElement) && $elem.hasAttribute('href')) \|\|\n // Form elements which are not disabled\n $elem instanceof HTMLButtonElement \|\|\n $elem instanceof HTMLInputElement \|\|\n $elem instanceof HTMLTextAreaElement \|\|\n $elem instanceof HTMLSelectElement \|\|\n // IFrames\n $elem instanceof HTMLIFrameElement\n );\n}\n","export function animationTo(element: HTMLElement, keyframes: Keyframe \| Keyframe[], options?: KeyframeAnimationOptions) {\n const animated = element.animate(keyframes, { ...options, fill: 'both' });\n animated.addEventListener('finish', () => {\n // @ts-ignore\n animated.commitStyles();\n animated.cancel();\n });\n\n return animated;\n}\n\nconst keyframeDefaults = {\n easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',\n};\n\nexport const KEYFRAMES = {\n fadeIn: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 0,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 1,\n },\n ],\n fadeOut: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 1,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 0,\n },\n ],\n};\n",":host {\n display: contents;\n}\n\n.spw-modal {\n display: none;\n justify-content: center;\n align-items: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1060;\n overflow-y: auto;\n\n &--opened {\n display: flex;\n }\n}\n\n.spw-modal__overlay {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: black;\n opacity: 0.7;\n z-index: 0;\n}\n\n.spw-modal__content-container {\n position: absolute;\n display: flex;\n justify-content: center;\n width: 90%;\n background-color: #fff;\n box-shadow: var(--spw-effect-elevation-6);\n overflow: hidden;\n box-sizing: border-box;\n align-items: stretch;\n border-radius: var(--spw-spacings-border-radius-lg);\n\n &--small {\n max-width: 480px;\n }\n\n &--medium {\n max-width: 600px;\n }\n\n &--large {\n max-width: 768px;\n }\n\n &--fluid {\n max-width: 100%;\n }\n}\n\n.spw-modal__content {\n display: flex;\n flex-direction: column;\n border: 1px solid var(--spw-color-themes-grey-grey-300);\n width: 100%;\n max-height: 90vh;\n overflow-y: auto;\n\n .spw-modal--sticky-buttons & {\n overflow-y: visible;\n }\n}\n\n.spw-modal__icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n background-color: #fff;\n align-self: stretch;\n}\n\n.spw-modal__header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 24px;\n padding-bottom: 0;\n margin-top: 6px;\n margin-bottom: 12px;\n box-sizing: border-box;\n border-radius: 1px 1px 0px 0px;\n color: var(--spw-colors-support-grey-grey-900);\n}\n\n.spw-modal__caption {\n overflow: hidden;\n white-space: pre-wrap;\n word-wrap: break-word;\n}\n\n.spw-modal__header h2 {\n margin: 0;\n font-size: 18px;\n color: var(--spw-colors-support-grey-grey-900);\n}\n\n.spw-modal__header button {\n background: none;\n border: none;\n font-size: 1.5em;\n padding: 0;\n cursor: pointer;\n}\n\n.spw-modal__close-button {\n position: absolute;\n top: 12px;\n right: 12px;\n cursor: pointer;\n font-size: 21px;\n &:hover {\n opacity: 0.7;\n }\n}\n\n.spw-modal__body {\n padding: 0 24px;\n margin-bottom: 12px;\n box-sizing: border-box;\n flex: 1;\n font-size: 16px;\n color: var(--spw-colors-support-grey-grey-700);\n\n .spw-modal--sticky-buttons & {\n overflow-y: auto;\n }\n}\n\n.spw-modal__buttons {\n ::slotted([slot='buttons']) {\n padding: 24px;\n padding-top: 12px;\n }\n}\n\n.spw-modal__footer--buttons-present ::slotted() {\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n padding: 24px;\n padding-top: 8px;\n\n .spw-modal__content-container--small & {\n flex-direction: column;\n gap: 8px;\n }\n\n .spw-modal__content-container--medium & {\n display: grid;\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n\n.spw-modal__border {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n font-size: 1.5em;\n flex-grow: 1;\n}\n","import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch, Method } from '@stencil/core';\nimport { queryShadowRoot, isHidden, isFocusable } from '@utils/focus-trap';\nimport { animationTo, KEYFRAMES } from '@utils/animation';\n\ntype CloseEventTrigger = 'CLOSE_BUTTON' \| 'ESCAPE_KEY' \| 'BACKDROP' \| 'PROGRAMMATIC';\n\nexport interface BeforeCloseEventDetail {\n trigger: CloseEventTrigger;\n}\n\n@Component({\n tag: 'spw-modal',\n styleUrl: 'spw-modal.scss',\n shadow: true,\n})\nexport class SpwModal {\n /** Indique si la modal est ouverte ou fermée, mutable et reflétée dans le DOM /\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\n\n @State() showModal: boolean = this.opened \|\| false;\n\n /* Titre de la modal /\n @Prop() caption: string = 'Titre de la modal';\n /* Indique si la fermeture de la modal est possible en cliquant sur l'overlay /\n @Prop() closeOnOverlayClick: boolean = true;\n /* Rend les boutons en bas de la modal \"collants\" (toujours visibles) si vrai /\n @Prop() stickyButtons: boolean = false;\n /* Événement déclenché lors de l'ouverture de la modal /\n @Event() spwModalOpen: EventEmitter;\n /* Événement déclenché lors de la fermeture de la modal /\n @Event() spwModalClose: EventEmitter;\n /* Définit la taille de la modal : 'small', 'medium', 'large' ou 'fluid' /\n @Prop() size: 'small' \| 'medium' \| 'large' \| 'fluid' = 'small';\n /* Icône d'alerte à afficher dans la modal /\n @Prop() alertIcon: string = '';\n\n @Element() hostElement: HTMLSpwModalElement;\n\n @State() slotButtonsPresent: boolean = false;\n\n /* Indique si le bouton de fermeture est visible /\n @Prop() showCloseButton: boolean = true;\n\n private modalContainer: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n private closeButton: HTMLSpwIconElement;\n\n /\n Méthode publique pour fermer la modal programmatiquement\n * @returns Promise qui se résout quand la modal est fermée\n /\n @Method()\n async closeModal(): Promise<void> {\n this.doBeforeClose('PROGRAMMATIC');\n }\n\n /\n Méthode publique pour ouvrir la modal programmatiquement\n * @returns Promise qui se résout quand la modal est ouverte\n */\n @Method()\n async openModal(): Promise<void> {\n this.opened = true;\n }\n\n componentDidLoad() {\n this.focusableElements = queryShadowRoot(this.hostElement.shadowRoot, el => isHidden(el) \|\| el.matches('[data-focus-trap-edge]'), isFocusable);\n window.addEventListener('click', this.handleClick, { capture: true });\n window.addEventListener('click', this.handleClose, { capture: true });\n window.addEventListener('keydown', this.handleKeypress);\n }\n\n disconnectedCallback() {\n window.removeEventListener('click', this.handleClick);\n window.removeEventListener('click', this.handleClose);\n window.removeEventListener('keydown', this.handleKeypress);\n }\n\n private handleClick = (event: MouseEvent) => {\n const path = event.composedPath() as HTMLElement[];\n const trigger = path.find(el => el instanceof HTMLElement && el.hasAttribute?.('data-modal-trigger')) as HTMLElement \| undefined;\n\n if (trigger) {\n const modalId = trigger.getAttribute('data-modal-trigger');\n if (modalId === this.hostElement.id) {\n this.opened = true;\n }\n }\n };\n\n private handleClose = (event: MouseEvent) => {\n const path = event.composedPath() as HTMLElement[];\n const trigger = path.find(el => el instanceof HTMLElement && el.hasAttribute?.('data-modal-close')) as HTMLElement \| undefined;\n\n if (trigger) {\n const modalId = trigger.getAttribute('data-modal-close');\n if (modalId === this.hostElement.id) {\n this.opened = false;\n }\n }\n };\n\n private getFirstFocusableElement(): HTMLElement \| null {\n return this.focusableElements[0];\n }\n\n private getLastFocusableElement(): HTMLElement \| null {\n return this.focusableElements[this.focusableElements.length - 1];\n }\n\n private handleTopFocus = () => {\n this.attemptFocus(this.getLastFocusableElement());\n };\n\n private handleBottomFocus = () => {\n this.attemptFocus(this.getFirstFocusableElement());\n };\n\n private attemptFocus(element: HTMLElement \| null) {\n if (element == null) {\n setTimeout(() => {\n this.closeButton.focus();\n });\n return;\n }\n\n setTimeout(() => {\n element.focus();\n }, 0);\n }\n\n private open() {\n this.showModal = true;\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n setTimeout(() => {\n this.getLastFocusableElement()?.focus();\n this.getLastFocusableElement()?.blur();\n }, 0);\n\n this.spwModalOpen.emit();\n });\n } catch (err) {\n this.spwModalOpen.emit();\n }\n }\n\n private close() {\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n this.showModal = false;\n this.spwModalClose.emit();\n });\n } catch (err) {\n this.showModal = false;\n this.spwModalClose.emit();\n }\n }\n\n private handleKeypress = (event: KeyboardEvent) => {\n if (this.showModal && event.key === 'Escape') {\n this.doBeforeClose('ESCAPE_KEY');\n }\n };\n\n private doBeforeClose(trigger: CloseEventTrigger) {\n const triggers = [];\n triggers.push(trigger);\n const prevented = triggers.some(event => event.defaultPrevented);\n if (!prevented) {\n this.opened = false;\n }\n }\n\n @Watch('opened')\n openedChanged(newValue: boolean) {\n newValue === true ? this.open() : this.close();\n }\n\n private handleOverlayClick() {\n if (this.closeOnOverlayClick) {\n this.doBeforeClose('BACKDROP');\n }\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-modal': true,\n 'spw-modal--opened': this.showModal,\n 'spw-modal--sticky-buttons': this.stickyButtons,\n };\n }\n\n render() {\n return (\n <Host>\n <div ref={el => (this.modalContainer = el)} class={this.elementClass}>\n <div class=\"spw-modal__overlay\" onClick={() => this.handleOverlayClick()}></div>\n <div data-focus-trap-edge onFocus={this.handleTopFocus} tabindex=\"0\"></div>\n <div class={`spw-modal__content-container spw-modal__content-container--${this.size}`} role=\"dialog\" aria-modal=\"true\" aria-label={this.caption}>\n <div class=\"spw-modal__content\">\n <div class=\"spw-modal__header\">\n <h2 class=\"spw-modal__caption\">{this.caption}</h2>\n {this.showCloseButton && (\n <spw-icon class=\"spw-modal__close-button\" ref={el => (this.closeButton = el)} icon=\"fa-xmark\" onClick={() => this.doBeforeClose('CLOSE_BUTTON')}></spw-icon>\n )}\n </div>\n <div class=\"spw-modal__body\">\n <slot name=\"content\" />\n </div>\n <div class=\"spw-modal__buttons\">\n <slot name=\"buttons\"></slot>\n </div>\n </div>\n </div>\n <div data-focus-trap-edge onFocus={this.handleBottomFocus} tabindex=\"0\"></div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/spw-modal.entry.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-modal.entry.cjs.js","sources":["src/utils/focus-trap.ts","src/utils/animation.ts","src/components/spw-modal/spw-modal.scss?tag=spw-modal&encapsulation=shadow","src/components/spw-modal/spw-modal.tsx"],"sourcesContent":["/*\n Copy/pasted from https://github.com/andreasbm/focus-trap\n /\n\n/\n Traverses the slots of the open shadowroots and returns all children matching the query.\n * We need to traverse each child-depth one at a time because if an element should be skipped\n * (for example because it is hidden) we need to skip all of it's children. If we use querySelectorAll(\"\")\n the information of whether the children is within a hidden parent is lost.\n * @param {ShadowRoot \| HTMLElement} root\n * @param skipNode\n * @param isMatch\n * @param {number} maxDepth\n * @param {number} depth\n * @returns {HTMLElement[]}\n /\nexport function queryShadowRoot(\n root: ShadowRoot \| HTMLElement,\n skipNode: ($elem: HTMLElement) => boolean,\n isMatch: ($elem: HTMLElement) => boolean,\n maxDepth: number = 20,\n depth: number = 0,\n): HTMLElement[] {\n const matches: HTMLElement[] = [];\n\n // If the depth is above the max depth, abort the searching here.\n if (depth >= maxDepth) {\n return matches;\n }\n\n // Traverses a slot element\n const traverseSlot = ($slot: HTMLSlotElement) => {\n // Only check nodes that are of the type Node.ELEMENT_NODE\n // Read more here https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType\n const assignedNodes = $slot.assignedNodes().filter(node => node.nodeType === 1);\n if (assignedNodes.length > 0) {\n const $slotParent = assignedNodes[0].parentElement!;\n return queryShadowRoot($slotParent, skipNode, isMatch, maxDepth, depth + 1);\n }\n\n return [];\n };\n\n // Go through each child and continue the traversing if necessary\n // Even though the typing says that children can't be undefined, Edge 15 sometimes gives an undefined value.\n // Therefore we fallback to an empty array if it is undefined.\n const children = Array.from(root.children \|\| []) as HTMLElement[];\n for (const $child of children) {\n // Check if the element and its descendants should be skipped\n if (skipNode($child)) {\n // console.log('-- SKIP', $child);\n continue;\n }\n\n // console.log('$child', $child);\n\n // If the element matches we always add it\n if (isMatch($child)) {\n matches.push($child);\n }\n\n if ($child.shadowRoot != null) {\n // If the element has a shadow root we need to traverse it\n matches.push(...queryShadowRoot($child.shadowRoot, skipNode, isMatch, maxDepth, depth + 1));\n } else if ($child.tagName === 'SLOT') {\n // If the child is a slot we need to traverse each assigned node\n matches.push(...traverseSlot($child as HTMLSlotElement));\n } else {\n // Traverse the children of the element\n matches.push(...queryShadowRoot($child, skipNode, isMatch, maxDepth, depth + 1));\n }\n }\n\n return matches;\n}\n\n/\n Returns whether the element is hidden.\n * @param $elem\n /\nexport function isHidden($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('hidden') \|\|\n ($elem.hasAttribute('aria-hidden') && $elem.getAttribute('aria-hidden') !== 'false') \|\|\n // A quick and dirty way to check whether the element is hidden.\n // For a more fine-grained check we could use \"window.getComputedStyle\" but we don't because of bad performance.\n // If the element has visibility set to \"hidden\" or \"collapse\", display set to \"none\" or opacity set to \"0\" through CSS\n // we won't be able to catch it here. We accept it due to the huge performance benefits.\n $elem.style.display === `none` \|\|\n $elem.style.opacity === `0` \|\|\n $elem.style.visibility === `hidden` \|\|\n $elem.style.visibility === `collapse`\n );\n\n // If offsetParent is null we can assume that the element is hidden\n // https://stackoverflow.com/questions/306305/what-would-make-offsetparent-null\n // \|\| $elem.offsetParent == null;\n}\n\n/\n Returns whether the element is disabled.\n * @param $elem\n /\nexport function isDisabled($elem: HTMLElement): boolean {\n return $elem.hasAttribute('disabled') \|\| ($elem.hasAttribute('aria-disabled') && $elem.getAttribute('aria-disabled') !== 'false');\n}\n\n/\n Determines whether an element is focusable.\n * Read more here: https://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus/1600194#1600194\n * Or here: https://stackoverflow.com/questions/18261595/how-to-check-if-a-dom-element-is-focusable\n * @param $elem\n /\nexport function isFocusable($elem: HTMLElement): boolean {\n // Discard elements that are removed from the tab order.\n if ($elem.getAttribute('tabindex') === '-1' \|\| isHidden($elem) \|\| isDisabled($elem)) {\n return false;\n }\n\n return (\n // At this point we know that the element can have focus (eg. won't be -1) if the tabindex attribute exists\n $elem.hasAttribute('tabindex') \|\|\n // Anchor tags or area tags with a href set\n (($elem instanceof HTMLAnchorElement \|\| $elem instanceof HTMLAreaElement) && $elem.hasAttribute('href')) \|\|\n // Form elements which are not disabled\n $elem instanceof HTMLButtonElement \|\|\n $elem instanceof HTMLInputElement \|\|\n $elem instanceof HTMLTextAreaElement \|\|\n $elem instanceof HTMLSelectElement \|\|\n // IFrames\n $elem instanceof HTMLIFrameElement\n );\n}\n","export function animationTo(element: HTMLElement, keyframes: Keyframe \| Keyframe[], options?: KeyframeAnimationOptions) {\n const animated = element.animate(keyframes, { ...options, fill: 'both' });\n animated.addEventListener('finish', () => {\n // @ts-ignore\n animated.commitStyles();\n animated.cancel();\n });\n\n return animated;\n}\n\nconst keyframeDefaults = {\n easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',\n};\n\nexport const KEYFRAMES = {\n fadeIn: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 0,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 1,\n },\n ],\n fadeOut: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 1,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 0,\n },\n ],\n};\n",":host {\n display: contents;\n}\n\n.spw-modal {\n display: none;\n justify-content: center;\n align-items: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1060;\n overflow-y: auto;\n\n &--opened {\n display: flex;\n }\n}\n\n.spw-modal__overlay {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: black;\n opacity: 0.7;\n z-index: 0;\n}\n\n.spw-modal__content-container {\n position: absolute;\n display: flex;\n justify-content: center;\n width: 90%;\n background-color: #fff;\n box-shadow: var(--spw-effect-elevation-6);\n overflow: hidden;\n box-sizing: border-box;\n align-items: stretch;\n border-radius: var(--spw-spacings-border-radius-lg);\n\n &--small {\n max-width: 480px;\n }\n\n &--medium {\n max-width: 600px;\n }\n\n &--large {\n max-width: 768px;\n }\n\n &--fluid {\n max-width: 100%;\n }\n}\n\n.spw-modal__content {\n display: flex;\n flex-direction: column;\n border: 1px solid var(--spw-color-themes-grey-grey-300);\n width: 100%;\n max-height: 90vh;\n overflow-y: auto;\n\n .spw-modal--sticky-buttons & {\n overflow-y: visible;\n }\n}\n\n.spw-modal__icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n background-color: #fff;\n align-self: stretch;\n}\n\n.spw-modal__header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 24px;\n padding-bottom: 0;\n margin-top: 6px;\n margin-bottom: 12px;\n box-sizing: border-box;\n border-radius: 1px 1px 0px 0px;\n color: var(--spw-colors-support-grey-grey-900);\n}\n\n.spw-modal__caption {\n overflow: hidden;\n white-space: pre-wrap;\n word-wrap: break-word;\n}\n\n.spw-modal__header h2 {\n margin: 0;\n font-size: 18px;\n color: var(--spw-colors-support-grey-grey-900);\n}\n\n.spw-modal__header button {\n background: none;\n border: none;\n font-size: 1.5em;\n padding: 0;\n cursor: pointer;\n}\n\n.spw-modal__close-button {\n position: absolute;\n top: 12px;\n right: 12px;\n cursor: pointer;\n font-size: 21px;\n &:hover {\n opacity: 0.7;\n }\n}\n\n.spw-modal__body {\n padding: 0 24px;\n margin-bottom: 12px;\n box-sizing: border-box;\n flex: 1;\n font-size: 16px;\n color: var(--spw-colors-support-grey-grey-700);\n\n .spw-modal--sticky-buttons & {\n overflow-y: auto;\n }\n}\n\n.spw-modal__buttons {\n ::slotted([slot='buttons']) {\n padding: 24px;\n padding-top: 12px;\n }\n}\n\n.spw-modal__footer--buttons-present ::slotted() {\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n padding: 24px;\n padding-top: 8px;\n\n .spw-modal__content-container--small & {\n flex-direction: column;\n gap: 8px;\n }\n\n .spw-modal__content-container--medium & {\n display: grid;\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n\n.spw-modal__border {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n font-size: 1.5em;\n flex-grow: 1;\n}\n","import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch, Method } from '@stencil/core';\nimport { queryShadowRoot, isHidden, isFocusable } from '@utils/focus-trap';\nimport { animationTo, KEYFRAMES } from '@utils/animation';\n\ntype CloseEventTrigger = 'CLOSE_BUTTON' \| 'ESCAPE_KEY' \| 'BACKDROP' \| 'PROGRAMMATIC';\n\nexport interface BeforeCloseEventDetail {\n trigger: CloseEventTrigger;\n}\n\n@Component({\n tag: 'spw-modal',\n styleUrl: 'spw-modal.scss',\n shadow: true,\n})\nexport class SpwModal {\n /** Indique si la modal est ouverte ou fermée, mutable et reflétée dans le DOM /\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\n\n @State() showModal: boolean = this.opened \|\| false;\n\n /* Titre de la modal /\n @Prop() caption: string = 'Titre de la modal';\n /* Indique si la fermeture de la modal est possible en cliquant sur l'overlay /\n @Prop() closeOnOverlayClick: boolean = true;\n /* Rend les boutons en bas de la modal \"collants\" (toujours visibles) si vrai /\n @Prop() stickyButtons: boolean = false;\n /* Événement déclenché lors de l'ouverture de la modal /\n @Event() spwModalOpen: EventEmitter;\n /* Événement déclenché lors de la fermeture de la modal /\n @Event() spwModalClose: EventEmitter;\n /* Définit la taille de la modal : 'small', 'medium', 'large' ou 'fluid' /\n @Prop() size: 'small' \| 'medium' \| 'large' \| 'fluid' = 'small';\n /* Icône d'alerte à afficher dans la modal /\n @Prop() alertIcon: string = '';\n\n @Element() hostElement: HTMLSpwModalElement;\n\n @State() slotButtonsPresent: boolean = false;\n\n /* Indique si le bouton de fermeture est visible /\n @Prop() showCloseButton: boolean = true;\n\n private modalContainer: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n private closeButton: HTMLSpwIconElement;\n\n /\n Méthode publique pour fermer la modal programmatiquement\n * @returns Promise qui se résout quand la modal est fermée\n /\n @Method()\n async closeModal(): Promise<void> {\n this.doBeforeClose('PROGRAMMATIC');\n }\n\n /\n Méthode publique pour ouvrir la modal programmatiquement\n * @returns Promise qui se résout quand la modal est ouverte\n */\n @Method()\n async openModal(): Promise<void> {\n this.opened = true;\n }\n\n componentDidLoad() {\n this.focusableElements = queryShadowRoot(this.hostElement.shadowRoot, el => isHidden(el) \|\| el.matches('[data-focus-trap-edge]'), isFocusable);\n document.addEventListener('click', this.handleClick);\n document.addEventListener('click', this.handleClose);\n document.addEventListener('keydown', this.handleKeypress);\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this.handleClick);\n document.removeEventListener('click', this.handleClose);\n document.removeEventListener('keydown', this.handleKeypress);\n }\n\n private handleClick = (event: MouseEvent) => {\n const trigger = (event.target as HTMLElement).closest('[data-modal-trigger]');\n if (trigger) {\n const modalId = trigger.getAttribute('data-modal-trigger');\n if (modalId === this.hostElement.id) {\n this.opened = true;\n }\n }\n };\n\n private handleClose = (event: MouseEvent) => {\n const trigger = (event.target as HTMLElement).closest('[data-modal-close]');\n if (trigger) {\n const modalId = trigger.getAttribute('data-modal-close');\n if (modalId === this.hostElement.id) {\n this.opened = false;\n }\n }\n };\n\n private getFirstFocusableElement(): HTMLElement \| null {\n return this.focusableElements[0];\n }\n\n private getLastFocusableElement(): HTMLElement \| null {\n return this.focusableElements[this.focusableElements.length - 1];\n }\n\n private handleTopFocus = () => {\n this.attemptFocus(this.getLastFocusableElement());\n };\n\n private handleBottomFocus = () => {\n this.attemptFocus(this.getFirstFocusableElement());\n };\n\n private attemptFocus(element: HTMLElement \| null) {\n if (element == null) {\n setTimeout(() => {\n this.closeButton.focus();\n });\n return;\n }\n\n setTimeout(() => {\n element.focus();\n }, 0);\n }\n\n private open() {\n this.showModal = true;\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n setTimeout(() => {\n this.getLastFocusableElement()?.focus();\n this.getLastFocusableElement()?.blur();\n }, 0);\n\n this.spwModalOpen.emit();\n });\n } catch (err) {\n this.spwModalOpen.emit();\n }\n }\n\n private close() {\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n this.showModal = false;\n this.spwModalClose.emit();\n });\n } catch (err) {\n this.showModal = false;\n this.spwModalClose.emit();\n }\n }\n\n private handleKeypress = (event: KeyboardEvent) => {\n if (this.showModal && event.key === 'Escape') {\n this.doBeforeClose('ESCAPE_KEY');\n }\n };\n\n private doBeforeClose(trigger: CloseEventTrigger) {\n const triggers = [];\n triggers.push(trigger);\n const prevented = triggers.some(event => event.defaultPrevented);\n if (!prevented) {\n this.opened = false;\n }\n }\n\n @Watch('opened')\n openedChanged(newValue: boolean) {\n newValue === true ? this.open() : this.close();\n }\n\n private handleOverlayClick() {\n if (this.closeOnOverlayClick) {\n this.doBeforeClose('BACKDROP');\n }\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-modal': true,\n 'spw-modal--opened': this.showModal,\n 'spw-modal--sticky-buttons': this.stickyButtons,\n };\n }\n\n render() {\n return (\n <Host>\n <div ref={el => (this.modalContainer = el)} class={this.elementClass}>\n <div class=\"spw-modal__overlay\" onClick={() => this.handleOverlayClick()}></div>\n <div data-focus-trap-edge onFocus={this.handleTopFocus} tabindex=\"0\"></div>\n <div class={`spw-modal__content-container spw-modal__content-container--${this.size}`} role=\"dialog\" aria-modal=\"true\" aria-label={this.caption}>\n <div class=\"spw-modal__content\">\n <div class=\"spw-modal__header\">\n <h2 class=\"spw-modal__caption\">{this.caption}</h2>\n {this.showCloseButton && (\n <spw-icon class=\"spw-modal__close-button\" ref={el => (this.closeButton = el)} icon=\"fa-xmark\" onClick={() => this.doBeforeClose('CLOSE_BUTTON')}></spw-icon>\n )}\n </div>\n <div class=\"spw-modal__body\">\n <slot name=\"content\" />\n </div>\n <div class=\"spw-modal__buttons\">\n <slot name=\"buttons\"></slot>\n </div>\n </div>\n </div>\n <div data-focus-trap-edge onFocus={this.handleBottomFocus} tabindex=\"0\"></div>\n </div>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":"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"}
1	+ {"version":3,"file":"spw-modal.entry.cjs.js","sources":["src/utils/focus-trap.ts","src/utils/animation.ts","src/components/spw-modal/spw-modal.scss?tag=spw-modal&encapsulation=shadow","src/components/spw-modal/spw-modal.tsx"],"sourcesContent":["/*\n Copy/pasted from https://github.com/andreasbm/focus-trap\n /\n\n/\n Traverses the slots of the open shadowroots and returns all children matching the query.\n * We need to traverse each child-depth one at a time because if an element should be skipped\n * (for example because it is hidden) we need to skip all of it's children. If we use querySelectorAll(\"\")\n the information of whether the children is within a hidden parent is lost.\n * @param {ShadowRoot \| HTMLElement} root\n * @param skipNode\n * @param isMatch\n * @param {number} maxDepth\n * @param {number} depth\n * @returns {HTMLElement[]}\n /\nexport function queryShadowRoot(\n root: ShadowRoot \| HTMLElement,\n skipNode: ($elem: HTMLElement) => boolean,\n isMatch: ($elem: HTMLElement) => boolean,\n maxDepth: number = 20,\n depth: number = 0,\n): HTMLElement[] {\n const matches: HTMLElement[] = [];\n\n // If the depth is above the max depth, abort the searching here.\n if (depth >= maxDepth) {\n return matches;\n }\n\n // Traverses a slot element\n const traverseSlot = ($slot: HTMLSlotElement) => {\n // Only check nodes that are of the type Node.ELEMENT_NODE\n // Read more here https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType\n const assignedNodes = $slot.assignedNodes().filter(node => node.nodeType === 1);\n if (assignedNodes.length > 0) {\n const $slotParent = assignedNodes[0].parentElement!;\n return queryShadowRoot($slotParent, skipNode, isMatch, maxDepth, depth + 1);\n }\n\n return [];\n };\n\n // Go through each child and continue the traversing if necessary\n // Even though the typing says that children can't be undefined, Edge 15 sometimes gives an undefined value.\n // Therefore we fallback to an empty array if it is undefined.\n const children = Array.from(root.children \|\| []) as HTMLElement[];\n for (const $child of children) {\n // Check if the element and its descendants should be skipped\n if (skipNode($child)) {\n // console.log('-- SKIP', $child);\n continue;\n }\n\n // console.log('$child', $child);\n\n // If the element matches we always add it\n if (isMatch($child)) {\n matches.push($child);\n }\n\n if ($child.shadowRoot != null) {\n // If the element has a shadow root we need to traverse it\n matches.push(...queryShadowRoot($child.shadowRoot, skipNode, isMatch, maxDepth, depth + 1));\n } else if ($child.tagName === 'SLOT') {\n // If the child is a slot we need to traverse each assigned node\n matches.push(...traverseSlot($child as HTMLSlotElement));\n } else {\n // Traverse the children of the element\n matches.push(...queryShadowRoot($child, skipNode, isMatch, maxDepth, depth + 1));\n }\n }\n\n return matches;\n}\n\n/\n Returns whether the element is hidden.\n * @param $elem\n /\nexport function isHidden($elem: HTMLElement): boolean {\n return (\n $elem.hasAttribute('hidden') \|\|\n ($elem.hasAttribute('aria-hidden') && $elem.getAttribute('aria-hidden') !== 'false') \|\|\n // A quick and dirty way to check whether the element is hidden.\n // For a more fine-grained check we could use \"window.getComputedStyle\" but we don't because of bad performance.\n // If the element has visibility set to \"hidden\" or \"collapse\", display set to \"none\" or opacity set to \"0\" through CSS\n // we won't be able to catch it here. We accept it due to the huge performance benefits.\n $elem.style.display === `none` \|\|\n $elem.style.opacity === `0` \|\|\n $elem.style.visibility === `hidden` \|\|\n $elem.style.visibility === `collapse`\n );\n\n // If offsetParent is null we can assume that the element is hidden\n // https://stackoverflow.com/questions/306305/what-would-make-offsetparent-null\n // \|\| $elem.offsetParent == null;\n}\n\n/\n Returns whether the element is disabled.\n * @param $elem\n /\nexport function isDisabled($elem: HTMLElement): boolean {\n return $elem.hasAttribute('disabled') \|\| ($elem.hasAttribute('aria-disabled') && $elem.getAttribute('aria-disabled') !== 'false');\n}\n\n/\n Determines whether an element is focusable.\n * Read more here: https://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus/1600194#1600194\n * Or here: https://stackoverflow.com/questions/18261595/how-to-check-if-a-dom-element-is-focusable\n * @param $elem\n /\nexport function isFocusable($elem: HTMLElement): boolean {\n // Discard elements that are removed from the tab order.\n if ($elem.getAttribute('tabindex') === '-1' \|\| isHidden($elem) \|\| isDisabled($elem)) {\n return false;\n }\n\n return (\n // At this point we know that the element can have focus (eg. won't be -1) if the tabindex attribute exists\n $elem.hasAttribute('tabindex') \|\|\n // Anchor tags or area tags with a href set\n (($elem instanceof HTMLAnchorElement \|\| $elem instanceof HTMLAreaElement) && $elem.hasAttribute('href')) \|\|\n // Form elements which are not disabled\n $elem instanceof HTMLButtonElement \|\|\n $elem instanceof HTMLInputElement \|\|\n $elem instanceof HTMLTextAreaElement \|\|\n $elem instanceof HTMLSelectElement \|\|\n // IFrames\n $elem instanceof HTMLIFrameElement\n );\n}\n","export function animationTo(element: HTMLElement, keyframes: Keyframe \| Keyframe[], options?: KeyframeAnimationOptions) {\n const animated = element.animate(keyframes, { ...options, fill: 'both' });\n animated.addEventListener('finish', () => {\n // @ts-ignore\n animated.commitStyles();\n animated.cancel();\n });\n\n return animated;\n}\n\nconst keyframeDefaults = {\n easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',\n};\n\nexport const KEYFRAMES = {\n fadeIn: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 0,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 1,\n },\n ],\n fadeOut: [\n {\n offset: 0,\n ...keyframeDefaults,\n opacity: 1,\n },\n {\n offset: 1,\n ...keyframeDefaults,\n opacity: 0,\n },\n ],\n};\n",":host {\n display: contents;\n}\n\n.spw-modal {\n display: none;\n justify-content: center;\n align-items: center;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1060;\n overflow-y: auto;\n\n &--opened {\n display: flex;\n }\n}\n\n.spw-modal__overlay {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: black;\n opacity: 0.7;\n z-index: 0;\n}\n\n.spw-modal__content-container {\n position: absolute;\n display: flex;\n justify-content: center;\n width: 90%;\n background-color: #fff;\n box-shadow: var(--spw-effect-elevation-6);\n overflow: hidden;\n box-sizing: border-box;\n align-items: stretch;\n border-radius: var(--spw-spacings-border-radius-lg);\n\n &--small {\n max-width: 480px;\n }\n\n &--medium {\n max-width: 600px;\n }\n\n &--large {\n max-width: 768px;\n }\n\n &--fluid {\n max-width: 100%;\n }\n}\n\n.spw-modal__content {\n display: flex;\n flex-direction: column;\n border: 1px solid var(--spw-color-themes-grey-grey-300);\n width: 100%;\n max-height: 90vh;\n overflow-y: auto;\n\n .spw-modal--sticky-buttons & {\n overflow-y: visible;\n }\n}\n\n.spw-modal__icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n background-color: #fff;\n align-self: stretch;\n}\n\n.spw-modal__header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 24px;\n padding-bottom: 0;\n margin-top: 6px;\n margin-bottom: 12px;\n box-sizing: border-box;\n border-radius: 1px 1px 0px 0px;\n color: var(--spw-colors-support-grey-grey-900);\n}\n\n.spw-modal__caption {\n overflow: hidden;\n white-space: pre-wrap;\n word-wrap: break-word;\n}\n\n.spw-modal__header h2 {\n margin: 0;\n font-size: 18px;\n color: var(--spw-colors-support-grey-grey-900);\n}\n\n.spw-modal__header button {\n background: none;\n border: none;\n font-size: 1.5em;\n padding: 0;\n cursor: pointer;\n}\n\n.spw-modal__close-button {\n position: absolute;\n top: 12px;\n right: 12px;\n cursor: pointer;\n font-size: 21px;\n &:hover {\n opacity: 0.7;\n }\n}\n\n.spw-modal__body {\n padding: 0 24px;\n margin-bottom: 12px;\n box-sizing: border-box;\n flex: 1;\n font-size: 16px;\n color: var(--spw-colors-support-grey-grey-700);\n\n .spw-modal--sticky-buttons & {\n overflow-y: auto;\n }\n}\n\n.spw-modal__buttons {\n ::slotted([slot='buttons']) {\n padding: 24px;\n padding-top: 12px;\n }\n}\n\n.spw-modal__footer--buttons-present ::slotted() {\n display: flex;\n justify-content: flex-end;\n gap: 12px;\n padding: 24px;\n padding-top: 8px;\n\n .spw-modal__content-container--small & {\n flex-direction: column;\n gap: 8px;\n }\n\n .spw-modal__content-container--medium & {\n display: grid;\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n}\n\n.spw-modal__border {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n font-size: 1.5em;\n flex-grow: 1;\n}\n","import { Component, Prop, Element, State, Event, Host, EventEmitter, h, Watch, Method } from '@stencil/core';\nimport { queryShadowRoot, isHidden, isFocusable } from '@utils/focus-trap';\nimport { animationTo, KEYFRAMES } from '@utils/animation';\n\ntype CloseEventTrigger = 'CLOSE_BUTTON' \| 'ESCAPE_KEY' \| 'BACKDROP' \| 'PROGRAMMATIC';\n\nexport interface BeforeCloseEventDetail {\n trigger: CloseEventTrigger;\n}\n\n@Component({\n tag: 'spw-modal',\n styleUrl: 'spw-modal.scss',\n shadow: true,\n})\nexport class SpwModal {\n /** Indique si la modal est ouverte ou fermée, mutable et reflétée dans le DOM /\n @Prop({ reflect: true, mutable: true }) opened?: boolean = false;\n\n @State() showModal: boolean = this.opened \|\| false;\n\n /* Titre de la modal /\n @Prop() caption: string = 'Titre de la modal';\n /* Indique si la fermeture de la modal est possible en cliquant sur l'overlay /\n @Prop() closeOnOverlayClick: boolean = true;\n /* Rend les boutons en bas de la modal \"collants\" (toujours visibles) si vrai /\n @Prop() stickyButtons: boolean = false;\n /* Événement déclenché lors de l'ouverture de la modal /\n @Event() spwModalOpen: EventEmitter;\n /* Événement déclenché lors de la fermeture de la modal /\n @Event() spwModalClose: EventEmitter;\n /* Définit la taille de la modal : 'small', 'medium', 'large' ou 'fluid' /\n @Prop() size: 'small' \| 'medium' \| 'large' \| 'fluid' = 'small';\n /* Icône d'alerte à afficher dans la modal /\n @Prop() alertIcon: string = '';\n\n @Element() hostElement: HTMLSpwModalElement;\n\n @State() slotButtonsPresent: boolean = false;\n\n /* Indique si le bouton de fermeture est visible /\n @Prop() showCloseButton: boolean = true;\n\n private modalContainer: HTMLElement;\n private focusableElements: HTMLElement[] = [];\n private closeButton: HTMLSpwIconElement;\n\n /\n Méthode publique pour fermer la modal programmatiquement\n * @returns Promise qui se résout quand la modal est fermée\n /\n @Method()\n async closeModal(): Promise<void> {\n this.doBeforeClose('PROGRAMMATIC');\n }\n\n /\n Méthode publique pour ouvrir la modal programmatiquement\n * @returns Promise qui se résout quand la modal est ouverte\n */\n @Method()\n async openModal(): Promise<void> {\n this.opened = true;\n }\n\n componentDidLoad() {\n this.focusableElements = queryShadowRoot(this.hostElement.shadowRoot, el => isHidden(el) \|\| el.matches('[data-focus-trap-edge]'), isFocusable);\n window.addEventListener('click', this.handleClick, { capture: true });\n window.addEventListener('click', this.handleClose, { capture: true });\n window.addEventListener('keydown', this.handleKeypress);\n }\n\n disconnectedCallback() {\n window.removeEventListener('click', this.handleClick);\n window.removeEventListener('click', this.handleClose);\n window.removeEventListener('keydown', this.handleKeypress);\n }\n\n private handleClick = (event: MouseEvent) => {\n const path = event.composedPath() as HTMLElement[];\n const trigger = path.find(el => el instanceof HTMLElement && el.hasAttribute?.('data-modal-trigger')) as HTMLElement \| undefined;\n\n if (trigger) {\n const modalId = trigger.getAttribute('data-modal-trigger');\n if (modalId === this.hostElement.id) {\n this.opened = true;\n }\n }\n };\n\n private handleClose = (event: MouseEvent) => {\n const path = event.composedPath() as HTMLElement[];\n const trigger = path.find(el => el instanceof HTMLElement && el.hasAttribute?.('data-modal-close')) as HTMLElement \| undefined;\n\n if (trigger) {\n const modalId = trigger.getAttribute('data-modal-close');\n if (modalId === this.hostElement.id) {\n this.opened = false;\n }\n }\n };\n\n private getFirstFocusableElement(): HTMLElement \| null {\n return this.focusableElements[0];\n }\n\n private getLastFocusableElement(): HTMLElement \| null {\n return this.focusableElements[this.focusableElements.length - 1];\n }\n\n private handleTopFocus = () => {\n this.attemptFocus(this.getLastFocusableElement());\n };\n\n private handleBottomFocus = () => {\n this.attemptFocus(this.getFirstFocusableElement());\n };\n\n private attemptFocus(element: HTMLElement \| null) {\n if (element == null) {\n setTimeout(() => {\n this.closeButton.focus();\n });\n return;\n }\n\n setTimeout(() => {\n element.focus();\n }, 0);\n }\n\n private open() {\n this.showModal = true;\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeIn, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n setTimeout(() => {\n this.getLastFocusableElement()?.focus();\n this.getLastFocusableElement()?.blur();\n }, 0);\n\n this.spwModalOpen.emit();\n });\n } catch (err) {\n this.spwModalOpen.emit();\n }\n }\n\n private close() {\n try {\n const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {\n duration: 200,\n });\n anim.addEventListener('finish', () => {\n this.showModal = false;\n this.spwModalClose.emit();\n });\n } catch (err) {\n this.showModal = false;\n this.spwModalClose.emit();\n }\n }\n\n private handleKeypress = (event: KeyboardEvent) => {\n if (this.showModal && event.key === 'Escape') {\n this.doBeforeClose('ESCAPE_KEY');\n }\n };\n\n private doBeforeClose(trigger: CloseEventTrigger) {\n const triggers = [];\n triggers.push(trigger);\n const prevented = triggers.some(event => event.defaultPrevented);\n if (!prevented) {\n this.opened = false;\n }\n }\n\n @Watch('opened')\n openedChanged(newValue: boolean) {\n newValue === true ? this.open() : this.close();\n }\n\n private handleOverlayClick() {\n if (this.closeOnOverlayClick) {\n this.doBeforeClose('BACKDROP');\n }\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-modal': true,\n 'spw-modal--opened': this.showModal,\n 'spw-modal--sticky-buttons': this.stickyButtons,\n };\n }\n\n render() {\n return (\n <Host>\n <div ref={el => (this.modalContainer = el)} class={this.elementClass}>\n <div class=\"spw-modal__overlay\" onClick={() => this.handleOverlayClick()}></div>\n <div data-focus-trap-edge onFocus={this.handleTopFocus} tabindex=\"0\"></div>\n <div class={`spw-modal__content-container spw-modal__content-container--${this.size}`} role=\"dialog\" aria-modal=\"true\" aria-label={this.caption}>\n <div class=\"spw-modal__content\">\n <div class=\"spw-modal__header\">\n <h2 class=\"spw-modal__caption\">{this.caption}</h2>\n {this.showCloseButton && (\n <spw-icon class=\"spw-modal__close-button\" ref={el => (this.closeButton = el)} icon=\"fa-xmark\" onClick={() => this.doBeforeClose('CLOSE_BUTTON')}></spw-icon>\n )}\n </div>\n <div class=\"spw-modal__body\">\n <slot name=\"content\" />\n </div>\n <div class=\"spw-modal__buttons\">\n <slot name=\"buttons\"></slot>\n </div>\n </div>\n </div>\n <div data-focus-trap-edge onFocus={this.handleBottomFocus} tabindex=\"0\"></div>\n </div>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":"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"}

package/dist/cjs/spw-mosaic-item.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 const spwMosaicItemCss = ".spw-tw-px-3{padding-left:.75rem;padding-right:.75rem}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{-webkit-text-size-adjust:100%;line-height:1.3}h1,h2,h3,h4,h5,h6,li,p,ul{margin:0;padding:0}ul{list-style:none}:host{-webkit-text-size-adjust:100%;--spw-mosaic-item-width-mobile:100%;--spw-mosaic-item-width-tablet:100%;--spw-mosaic-item-width-desktop:100%;box-sizing:border-box;font-size:100%;line-height:1.3;margin-bottom:1.5rem;padding-left:.75rem;padding-right:.75rem;width:var(--spw-mosaic-item-width-mobile)}:host *,:host :after,:host :before{box-sizing:inherit;font-family:Nunito Sans}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}:root{--spw-ds-container-xl:1200px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px;width:100%}@media (min-width:460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width:768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width:1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width:1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}@media (min-width:768px){:host{width:var(--spw-mosaic-item-width-tablet)}}@media (min-width:1024px){:host{width:var(--spw-mosaic-item-width-desktop)}}.spw-mobile-1{--spw-mosaic-item-width-mobile:100%}.spw-tablet-1{--spw-mosaic-item-width-tablet:100%}.spw-desktop-1{--spw-mosaic-item-width-desktop:100%}.spw-mobile-2{--spw-mosaic-item-width-mobile:50%}.spw-tablet-2{--spw-mosaic-item-width-tablet:50%}.spw-desktop-2{--spw-mosaic-item-width-desktop:50%}.spw-mobile-3{--spw-mosaic-item-width-mobile:33.33333%}.spw-tablet-3{--spw-mosaic-item-width-tablet:33.33333%}.spw-desktop-3{--spw-mosaic-item-width-desktop:33.33333%}.spw-mobile-4{--spw-mosaic-item-width-mobile:25%}.spw-tablet-4{--spw-mosaic-item-width-tablet:25%}.spw-desktop-4{--spw-mosaic-item-width-desktop:25%}.spw-mobile-5{--spw-mosaic-item-width-mobile:20%}.spw-tablet-5{--spw-mosaic-item-width-tablet:20%}.spw-desktop-5{--spw-mosaic-item-width-desktop:20%}.spw-mobile-6{--spw-mosaic-item-width-mobile:16.66667%}.spw-tablet-6{--spw-mosaic-item-width-tablet:16.66667%}.spw-desktop-6{--spw-mosaic-item-width-desktop:16.66667%}.spw-mobile-7{--spw-mosaic-item-width-mobile:14.28571%}.spw-tablet-7{--spw-mosaic-item-width-tablet:14.28571%}.spw-desktop-7{--spw-mosaic-item-width-desktop:14.28571%}.spw-mobile-8{--spw-mosaic-item-width-mobile:12.5%}.spw-tablet-8{--spw-mosaic-item-width-tablet:12.5%}.spw-desktop-8{--spw-mosaic-item-width-desktop:12.5%}.spw-mobile-9{--spw-mosaic-item-width-mobile:11.11111%}.spw-tablet-9{--spw-mosaic-item-width-tablet:11.11111%}.spw-desktop-9{--spw-mosaic-item-width-desktop:11.11111%}.spw-mobile-10{--spw-mosaic-item-width-mobile:10%}.spw-tablet-10{--spw-mosaic-item-width-tablet:10%}.spw-desktop-10{--spw-mosaic-item-width-desktop:10%}.spw-mobile-11{--spw-mosaic-item-width-mobile:9.09091%}.spw-tablet-11{--spw-mosaic-item-width-tablet:9.09091%}.spw-desktop-11{--spw-mosaic-item-width-desktop:9.09091%}.spw-mobile-12{--spw-mosaic-item-width-mobile:8.33333%}.spw-tablet-12{--spw-mosaic-item-width-tablet:8.33333%}.spw-desktop-12{--spw-mosaic-item-width-desktop:8.33333%}.spw-tw-mb-6{margin-bottom:1.5rem}";
@@ -22,7 +22,7 @@ const SpwMosaicItem = class {
         this.el.style.setProperty('--spw-mosaic-item-width-desktop', `calc(100% / ${colsDesktop})`);
     }
     render() {
-        return (index.h(index.Host, { key: '6dff7061b0f33914d1f0e6ba002ebb4a9d0f873b' }, index.h("slot", { key: '262e212d07d528af0c170b881bb6e2e224e8d02f' })));
+        return (index.h(index.Host, { key: '8365d1a1a94853460fd1f913f4aa921d42b8ad4a' }, index.h("slot", { key: 'dc72dc456aeb0f362946eb58099cf497b510a1a3' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/spw-mosaic.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 var _commonjsHelpers = require('./_commonjsHelpers-CFO10eej.js');
 var masonry = {exports: {}};
@@ -2510,7 +2510,7 @@ const SpwMosaic = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: 'e0fefb8265df98b4217f73d8b5a5f9c222d71066' }, index.h("div", { key: 'f6e5c792e60ee3148e285ca49115f3a8a30a931f', class: this.elementClass }, index.h("slot", { key: 'cfb0060e91a19e8963bfcfd225a2c6c1dded4efb' }))));
+        return (index.h(index.Host, { key: 'bc3c436b4a65d6060d443081412198acbeedef49' }, index.h("div", { key: '144bf0604f5ad620f29258ab5db30c20c218eae4', class: this.elementClass }, index.h("slot", { key: 'd36edc7d7e4c6de72cdd474d2843097bbeb817f8' }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/spw-pagination.cjs.entry.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var index = require('./index-DPoQq9TD.js');
+var index = require('./index-iVhYitTd.js');
 const spwPaginationCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{-webkit-text-size-adjust:100%;line-height:1.3}h1,h2,h3,h4,h5,h6,li,p,ul{margin:0;padding:0}ul{list-style:none}:host{-webkit-text-size-adjust:100%;box-sizing:border-box;display:block;font-size:100%;line-height:1.3}:host *,:host :after,:host :before{box-sizing:inherit;font-family:Nunito Sans}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}:root{--spw-ds-container-xl:1200px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px;width:100%}@media (min-width:460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width:768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width:1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width:1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}.spw-pagination__item button,.spw-pagination__item--dots{border-radius:32px;font-size:14px;font-weight:700;height:32px;line-height:32px;min-width:32px;text-align:center}.spw-pagination__item button:focus-visible,.spw-pagination__item--dots:focus-visible{box-shadow:0 0 0 5px #000;outline:3px solid #fff;outline-offset:-1px}.spw-pagination{align-items:center;display:flex;flex-direction:column}@media (min-width:768px){.spw-pagination{align-items:flex-start}}.spw-pagination ul{align-items:center;display:flex;padding:0}.spw-pagination__item{margin-right:12px}.spw-pagination__item spw-icon{font-size:18px}.spw-pagination__item button{background:none;border:none;color:var(--spw-color-themes-grey-grey-900);cursor:pointer;margin:0;padding:0 6px}.spw-pagination__item:not(.spw-pagination__item--active,.spw-pagination__item--dots,.spw-pagination__item--disabled):hover button{background:var(--spw-color-themes-grey-grey-200)}.spw-pagination__item:not(.spw-pagination__item--active,.spw-pagination__item--dots,.spw-pagination__item--disabled):active button{background:var(--spw-color-themes-grey-grey-300)}.spw-pagination__item--arrow button{align-items:center;display:flex;gap:8px;padding:0 12px;text-decoration:underline}.spw-pagination__item--arrow button:hover{text-decoration:none}.spw-pagination__item--dots{align-items:center;background:none;color:var(--spw-color-themes-grey-grey-400);cursor:default;display:inline-flex;justify-content:center;position:relative;top:3px}.spw-pagination__item--dots spw-icon{font-size:16px}.spw-pagination__item--desktop{display:none}@media (min-width:768px){.spw-pagination__item--desktop{display:inline-block}}.spw-pagination__item--active button{background:var(--spw-ds-primary);color:#fff}.spw-pagination__input spw-text-field{--spw-input-height:32px;--spw-input-padding:0 4px;--spw-input-text-align:center;--spw-input-font-size:14px;width:3ch}.spw-pagination__mobile-arrows{margin-top:12px}@media (min-width:768px){.spw-pagination__mobile-arrows{display:none!important}}.spw-pagination__total-pages{font-size:14px;margin:0 12px 0 6px}.spw-tw-mb-10{margin-bottom:2.5rem}.spw-tw-mb-6{margin-bottom:1.5rem}.spw-tw-ml-2{margin-left:.5rem}.spw-tw-mr-4{margin-right:1rem}.spw-tw-mt-12{margin-top:3rem}.-spw-tw-mt-1{margin-top:-.25rem}.spw-tw-mb-2{margin-bottom:.5rem}";
@@ -153,12 +153,12 @@ const SpwPagination = class {
         const pages = this.calculatePageRange();
         const showPrevArrow = this.currentPage > 1;
         const showNextArrow = this.currentPage < this.totalPages;
-        const prevArrow = showPrevArrow && (index.h("li", { key: 'ad6421f9725d6d1d46c3e5248d128d93c571ef87', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, index.h("button", { key: '3737b2adde08f75c8c0cee4e16fcb892945df486', onClick: () => this.goToPage(this.currentPage - 1) }, index.h("spw-icon", { key: '632ed04363a0fda345d681674b536440393283e8', icon: "fa-chevron-left" }), " ", index.h("span", { key: '343b5d4e3739b3ed5d13b64b9d610f1f56f61e75', class: "spw-pagination__item-arrow-text" }, "Pr\u00E9c\u00E9dent"))));
-        const nextArrow = showNextArrow && (index.h("li", { key: '2f5b080735b87f9dfc62c13de19816327f4904b4', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, index.h("button", { key: '45cce58381eb6498f6c1318e1043b7024994e31b', onClick: () => this.goToPage(this.currentPage + 1) }, index.h("span", { key: '810abe3ab60ef996eefaaf5d46252748752d3fe4', class: "spw-pagination__item-arrow-text" }, "Suivant"), " ", index.h("spw-icon", { key: '887ca874226b1f9c31e7a4078a7e22460d126431', icon: "fa-chevron-right" }))));
-        const prevArrowMobile = this.currentPage > 1 && (index.h("li", { key: '9fda929c0554c4bc3b7212ab500a10ea5e03faaa', class: "spw-pagination__item spw-pagination__item--arrow" }, index.h("button", { key: 'eca280e619eac2fe898766092a7c005ed4e3c751', onClick: () => this.goToPage(this.currentPage - 1) }, index.h("spw-icon", { key: 'ea7dd4a4e1e81d21d90fe9827bcc093ccd261a47', icon: "fa-chevron-left" }), " ", index.h("span", { key: 'da2e35f9760bfeaa4275dce60aa622dab938bd1a' }, "Pr\u00E9c\u00E9dent"))));
-        const nextArrowMobile = this.currentPage < this.totalPages && (index.h("li", { key: '5db8a31b06262316ae0debd3eb6219fbffaeec17', class: "spw-pagination__item spw-pagination__item--arrow" }, index.h("button", { key: 'a1e2ea032c64e9393eef7eb6fb27764999bf540b', onClick: () => this.goToPage(this.currentPage + 1), disabled: this.currentPage >= this.totalPages }, index.h("span", { key: '03c34b79c84f793a651433892955993fc658cdf8' }, "Suivant"), " ", index.h("spw-icon", { key: 'acceae7db2439ddad1dd03e91bda81afbbe75130', icon: "fa-chevron-right" }))));
-        const mobileArrows = (index.h("ul", { key: '40ef872f1a2ac2a1b6c8f4027b3ac5fa122d4035', class: "spw-pagination__mobile-arrows" }, prevArrowMobile, nextArrowMobile));
-        return (index.h(index.Host, { key: 'afde15a494fe4963ddfcdd5dcfddcc2e35b57c2d' }, index.h("div", { key: '3c3664b1e272a9903c2a0ccf45fe4f016cfbf60f', class: this.getPaginationClass() }, this.variant === 'input' && (index.h(index.Fragment, { key: '78c0f7dec1fb71e08c7a7667ba2195b153ec3511' }, index.h("ul", { key: '5ef9d9145c95e49291e747faba73b7293c8fcd89' }, prevArrow, index.h("li", { key: 'eb897ca570c25c8f2f0f4478067bba47d110e7ac', class: "spw-pagination__input" }, index.h("spw-text-field", { key: '61130bb24cf30ac0813081aae365f79a4f44f291', value: this.inputPageValue, type: "text", onInput: event => this.handleInputChange(event), onKeyDown: event => this.handleKeyDown(event), disabled: this.isDisabled, style: { width: this.calculateWidth() } })), index.h("li", { key: '036d0adc25074dd2e7000fff3192b542019d0473', class: "spw-pagination__total-pages" }, "sur ", this.totalPages, " pages"), nextArrow), mobileArrows)), this.variant === 'numbers' && (index.h(index.Fragment, { key: '8427a073b38ad4180c37fbb24ed2ff532a09e199' }, index.h("ul", { key: 'bb26786f760d5b4159a2ced9e0b1e0365aaa2f55' }, prevArrow, pages.map(({ page, class: pageClass }) => {
+        const prevArrow = showPrevArrow && (index.h("li", { key: '47f028f4bd7c5ed6ff076213d34d08216d705e90', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, index.h("button", { key: '5b6026d032d74e0a7b139b8ae3db760d67aa74b4', onClick: () => this.goToPage(this.currentPage - 1) }, index.h("spw-icon", { key: '6466354187f9541cba8793b0509c7e76356557f8', icon: "fa-chevron-left" }), " ", index.h("span", { key: '095eec25666905fce17e231b3de63ad4f3e523c1', class: "spw-pagination__item-arrow-text" }, "Pr\u00E9c\u00E9dent"))));
+        const nextArrow = showNextArrow && (index.h("li", { key: 'd4ea69bbe44d95006f9d904bb30b8754ad4e4df0', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, index.h("button", { key: '12887f98896dd8ede65447323fd73f6176c41bad', onClick: () => this.goToPage(this.currentPage + 1) }, index.h("span", { key: 'b4c75d6cc0c68f834cbd2294b765682f7014fcac', class: "spw-pagination__item-arrow-text" }, "Suivant"), " ", index.h("spw-icon", { key: '0639db5f0a4c1b25ef3b13c429d2c0175be04eb9', icon: "fa-chevron-right" }))));
+        const prevArrowMobile = this.currentPage > 1 && (index.h("li", { key: '5fa323f4800f3f1033212fdc4f9166f8b87b007d', class: "spw-pagination__item spw-pagination__item--arrow" }, index.h("button", { key: 'd70f07744f63e406601698dfabff490ae76f293d', onClick: () => this.goToPage(this.currentPage - 1) }, index.h("spw-icon", { key: '28480655c548fecd15f2885abbc1e0196ccc7ba7', icon: "fa-chevron-left" }), " ", index.h("span", { key: 'b70c8075628b226dca49c7c2d803813b39a3ee48' }, "Pr\u00E9c\u00E9dent"))));
+        const nextArrowMobile = this.currentPage < this.totalPages && (index.h("li", { key: '4ae05fe2b64002fdf8f7d6b45bbe711861a49e7c', class: "spw-pagination__item spw-pagination__item--arrow" }, index.h("button", { key: '6d8ef3a8bf364fb9c9cbd537595537b943d46ed8', onClick: () => this.goToPage(this.currentPage + 1), disabled: this.currentPage >= this.totalPages }, index.h("span", { key: 'e882c4c4e286a3dd03b25d27346dbd2bd87c5fb8' }, "Suivant"), " ", index.h("spw-icon", { key: 'dc8b1339f87ffc4cc0af9cd8d451d904d51961a8', icon: "fa-chevron-right" }))));
+        const mobileArrows = (index.h("ul", { key: 'c20100c57e7c6d3baba08613cbe8a6dd49d24556', class: "spw-pagination__mobile-arrows" }, prevArrowMobile, nextArrowMobile));
+        return (index.h(index.Host, { key: '98aac82c059aa930d11e6f8039f14e85c7074f57' }, index.h("div", { key: '9a2b54df66da17db256e2b2a66d7f2455cbd5b7d', class: this.getPaginationClass() }, this.variant === 'input' && (index.h(index.Fragment, { key: '18042de5a676f31d67520008c3fc84d5737f6958' }, index.h("ul", { key: 'e09e1a88994f1aae1ec0552d71ee774a0355b55d' }, prevArrow, index.h("li", { key: 'a3108fbc5474848124d577df75830445ab8dfdc9', class: "spw-pagination__input" }, index.h("spw-text-field", { key: 'e7610b00f51bdf4e422906ee0c237a887c9fdc9f', value: this.inputPageValue, type: "text", onInput: event => this.handleInputChange(event), onKeyDown: event => this.handleKeyDown(event), disabled: this.isDisabled, style: { width: this.calculateWidth() } })), index.h("li", { key: '429dc9dc3e816a76f6ea528fe735d987ba6d1e15', class: "spw-pagination__total-pages" }, "sur ", this.totalPages, " pages"), nextArrow), mobileArrows)), this.variant === 'numbers' && (index.h(index.Fragment, { key: 'f05e997578fdfb98dd2b05ca8369e71bf48e0a32' }, index.h("ul", { key: '6802f35dc7987d01c5a6f13975e9fab358c6ba44' }, prevArrow, pages.map(({ page, class: pageClass }) => {
             if (page === '...') {
                 return (index.h("li", { class: `spw-pagination__item spw-pagination__item--dots ${pageClass}` }, index.h("spw-icon", { icon: "fa-ellipsis" })));
             }