npm - @spw-ds/spw-stencil-library - Versions diffs - 1.2.4 → 1.2.6 - Mend

@spw-ds/spw-stencil-library 1.2.4 → 1.2.6

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 (395) hide show

package/dist/components/spw-header-navigation-item.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, a as Host } from './index.js';
 import { d as defineCustomElement$2 } from './p-_q4w18VU.js';
-const spwHeaderNavigationItemCss = "/*! 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;width:100%}: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:1024px){:host{display:contents;width:auto}}.spw-header-navigation-item{background:#fff;color:var(--spw-colors-support-grey-grey-900);font-size:16px;font-weight:700}@media (max-width:1023px){.spw-header-navigation-item ::slotted(a:hover){color:var(--spw-ds-primary)!important}}:host([data-level=\"1\"]) .spw-header-navigation-item ::slotted(a){font-size:20px;padding:24px 16px;position:relative}:host([data-level=\"1\"]) .spw-header-navigation-item ::slotted(a):before{background:var(--spw-colors-support-grey-grey-300);content:\"\";height:1px;left:16px;position:absolute;top:0;width:calc(100% - 32px)}@media (min-width:1024px){:host([data-level=\"1\"]) .spw-header-navigation-item ::slotted(a){border-bottom:0;font-size:16px;padding:20px 16px}:host([data-level=\"1\"]) .spw-header-navigation-item ::slotted(a):before{background:var(--spw-ds-primary);bottom:0;content:\"\";height:3px;left:16px;position:absolute;top:auto;width:0}:host([data-level=\"1\"]) .spw-header-navigation-item:hover ::slotted(spw-header-navigation-dropdown){margin-left:16px;opacity:1;pointer-events:auto;top:100%;transition:opacity .1s ease-in}:host([data-level=\"1\"]) .spw-header-navigation-item:hover ::slotted(a){color:var(--spw-ds-primary)!important}:host([data-level=\"1\"]) .spw-header-navigation-item:hover ::slotted(a):before{width:calc(100% - 32px)}}:host([data-level=\"1\"]) .spw-header-navigation-item--has-subnav ::slotted(a):after{content:\"\\f054\";font-family:var(--spw-ds-font-icons-solid);font-size:18px}@media (min-width:1024px){:host([data-level=\"1\"]) .spw-header-navigation-item--has-subnav ::slotted(a):after{content:\"\\f078\";font-size:14px}}:host([data-level=\"1\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(spw-header-navigation-dropdown){z-index:10}:host([data-level=\"1\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(a):after{content:\"\\f054\"}@media (min-width:1024px){:host([data-level=\"1\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(a):after{content:\"\\f078\"}}:host([data-level=\"2\"]) .spw-header-navigation-item ::slotted(a){font-size:18px;font-weight:400;padding:12px 16px}@media (min-width:1024px){:host([data-level=\"2\"]) .spw-header-navigation-item ::slotted(a){font-size:16px;font-weight:700;padding:20px}:host([data-level=\"2\"]) .spw-header-navigation-item:hover ::slotted(spw-header-navigation-dropdown){left:100%;opacity:1;pointer-events:auto;top:0;transition:opacity .1s ease-in;z-index:38}:host([data-level=\"2\"]) .spw-header-navigation-item:hover ::slotted(a){background:var(--spw-colors-support-grey-grey-100);color:var(--spw-ds-primary)!important}:host([data-level=\"2\"]) .spw-header-navigation-item:hover ::slotted(a):before{display:none}}:host([data-level=\"2\"]) .spw-header-navigation-item--has-subnav ::slotted(a):after{content:\"\\f054\";font-family:var(--spw-ds-font-icons-solid);font-weight:700}:host([data-level=\"2\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(spw-header-navigation-dropdown){z-index:11}:host([data-level=\"2\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(a):after{content:\"\\f054\"}:host([data-level=\"3\"]) .spw-header-navigation-item ::slotted(a){font-size:16px;font-weight:400;padding:12px 16px}@media (min-width:1024px){:host([data-level=\"3\"]) .spw-header-navigation-item ::slotted(a){font-size:16px;font-weight:700;padding:20px}:host([data-level=\"3\"]) .spw-header-navigation-item ::slotted(a:hover){color:var(--spw-ds-primary)!important}}:host([data-level=\"3\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(spw-header-navigation-dropdown){z-index:12}.spw-header-navigation-item--is-active ::slotted(a){color:var(--spw-ds-primary)!important}.spw-header-navigation-item ::slotted(a){align-items:center;color:inherit;display:inline-flex;gap:8px;justify-content:space-between;padding:16px 0;position:relative;text-decoration:none;width:100%}@media (min-width:1024px){.spw-header-navigation-item ::slotted(a){padding:16px}.spw-header-navigation-item ::slotted(a):before{background:var(--spw-ds-primary);bottom:0;content:\"\";height:5px;left:16px;position:absolute;transition:width .2s ease-in;width:0}}.spw-header-navigation-item ::slotted(a:focus-visible){box-shadow:0 0 0 3px #000;outline:3px solid #fff;outline-offset:-3px}.spw-header-navigation-item ::slotted(a:active){color:var(--spw-ds-primary)!important}.spw-header-navigation-item ::slotted(spw-header-navigation-dropdown){display:none;opacity:0}@media (min-width:1024px){.spw-header-navigation-item ::slotted(spw-header-navigation-dropdown){box-shadow:var(--spw-effect-elevation-8);display:block;opacity:0;pointer-events:none;position:absolute;width:320px}}@media (max-width:1023px){.spw-header-navigation-item--is-subnav-visible ::slotted(spw-header-navigation-dropdown){background:#fff;display:block;left:0;margin-top:0;min-height:100%;opacity:1;overflow-y:auto;padding-top:132px;position:absolute;top:0;width:100%}}.spw-header-navigation-item__top{background:#fff;border-bottom:1px solid var(--spw-colors-support-grey-grey-300);display:flex;flex-direction:column;height:118px;justify-content:space-between;left:16px;padding:24px 0;position:absolute;top:0;width:calc(100% - 32px);z-index:9999999}.spw-header-navigation-item__top-back{align-items:center;color:var(--spw-colors-support-grey-grey-900);display:flex;font-size:14px;font-weight:700;gap:8px;justify-content:left;text-decoration:none}.spw-header-navigation-item__top-back span{text-decoration:underline}.spw-header-navigation-item__top-back spw-icon{font-size:18px}.spw-header-navigation-item__top-title a{color:var(--spw-colors-support-grey-grey-900);display:block;font-size:20px;font-weight:700;overflow:hidden;text-decoration:underline;text-overflow:ellipsis;white-space:nowrap}:host([data-level-visible=\"1\"]) .spw-header-navigation-item__top--1{display:flex}@media (min-width:1024px){:host([data-level-visible=\"1\"]) .spw-header-navigation-item__top--1{display:none}}:host([data-level-visible=\"2\"]) .spw-header-navigation-item__top--1{display:none}:host([data-level-visible=\"3\"]) .spw-header-navigation-item__top--1{display:none}:host([data-level-visible=\"1\"]) .spw-header-navigation-item__top--2{display:none}:host([data-level-visible=\"2\"]) .spw-header-navigation-item__top--2{display:flex}@media (min-width:1024px){:host([data-level-visible=\"2\"]) .spw-header-navigation-item__top--2{display:none}}:host([data-level-visible=\"3\"]) .spw-header-navigation-item__top--2{display:none}:host([data-level-visible=\"1\"]) .spw-header-navigation-item__top--3{display:none}:host([data-level-visible=\"2\"]) .spw-header-navigation-item__top--3{display:none}:host([data-level-visible=\"3\"]) .spw-header-navigation-item__top--3{display:flex}@media (min-width:1024px){:host([data-level-visible=\"3\"]) .spw-header-navigation-item__top--3{display:none}.spw-header-navigation-item__top{display:none}}";
+const spwHeaderNavigationItemCss = "/*! 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;width:100%}: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:1024px){:host{display:contents;width:auto}}.spw-header-navigation-item{background:#fff;color:var(--spw-colors-support-grey-grey-900);font-size:16px;font-weight:700}@media (max-width:1023px){.spw-header-navigation-item ::slotted(a:hover){color:var(--spw-ds-primary)!important}}:host([data-level=\"1\"]) .spw-header-navigation-item ::slotted(a){font-size:20px;padding:24px 16px;position:relative}:host([data-level=\"1\"]) .spw-header-navigation-item ::slotted(a):before{background:var(--spw-colors-support-grey-grey-300);content:\"\";height:1px;left:16px;position:absolute;top:0;width:calc(100% - 32px)}@media (min-width:1024px){:host([data-level=\"1\"]) .spw-header-navigation-item ::slotted(a){border-bottom:0;font-size:16px;padding:20px 16px}:host([data-level=\"1\"]) .spw-header-navigation-item ::slotted(a):before{background:var(--spw-ds-primary);bottom:0;content:\"\";height:3px;left:16px;position:absolute;top:auto;width:0}:host([data-level=\"1\"]) .spw-header-navigation-item:hover ::slotted(spw-header-navigation-dropdown){margin-left:16px;opacity:1;pointer-events:auto;top:100%;transition:opacity .1s ease-in}:host([data-level=\"1\"]) .spw-header-navigation-item:hover ::slotted(a){color:var(--spw-ds-primary)!important}:host([data-level=\"1\"]) .spw-header-navigation-item:hover ::slotted(a):before{width:calc(100% - 32px)}}:host([data-level=\"1\"]) .spw-header-navigation-item--has-subnav ::slotted(a):after{content:\"\\f054\";font-family:var(--spw-ds-font-icons-solid);font-size:18px}@media (min-width:1024px){:host([data-level=\"1\"]) .spw-header-navigation-item--has-subnav ::slotted(a):after{content:\"\\f078\";font-size:14px}}:host([data-level=\"1\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(spw-header-navigation-dropdown){z-index:10}:host([data-level=\"1\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(a):after{content:\"\\f054\"}@media (min-width:1024px){:host([data-level=\"1\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(a):after{content:\"\\f078\"}:host([data-level=\"2\"]) .spw-header-navigation-item{position:relative}}:host([data-level=\"2\"]) .spw-header-navigation-item ::slotted(a){font-size:18px;font-weight:400;padding:12px 16px}@media (min-width:1024px){:host([data-level=\"2\"]) .spw-header-navigation-item ::slotted(a){font-size:16px;font-weight:700;padding:20px}:host([data-level=\"2\"]) .spw-header-navigation-item:hover ::slotted(spw-header-navigation-dropdown){left:100%;opacity:1;pointer-events:auto;top:0;transition:opacity .1s ease-in;z-index:38}:host([data-level=\"2\"]) .spw-header-navigation-item:hover ::slotted(a){background:var(--spw-colors-support-grey-grey-100);color:var(--spw-ds-primary)!important}:host([data-level=\"2\"]) .spw-header-navigation-item:hover ::slotted(a):before{display:none}}:host([data-level=\"2\"]) .spw-header-navigation-item--has-subnav ::slotted(a):after{content:\"\\f054\";font-family:var(--spw-ds-font-icons-solid);font-weight:700}:host([data-level=\"2\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(spw-header-navigation-dropdown){z-index:11}:host([data-level=\"2\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(a):after{content:\"\\f054\"}:host([data-level=\"3\"]) .spw-header-navigation-item ::slotted(a){font-size:16px;font-weight:400;padding:12px 16px}@media (min-width:1024px){:host([data-level=\"3\"]) .spw-header-navigation-item ::slotted(a){font-size:16px;font-weight:700;padding:20px}:host([data-level=\"3\"]) .spw-header-navigation-item ::slotted(a:hover){color:var(--spw-ds-primary)!important}}:host([data-level=\"3\"]) .spw-header-navigation-item--is-subnav-visible ::slotted(spw-header-navigation-dropdown){z-index:12}.spw-header-navigation-item--is-active ::slotted(a){color:var(--spw-ds-primary)!important}.spw-header-navigation-item ::slotted(a){align-items:center;color:inherit;display:inline-flex;gap:8px;justify-content:space-between;padding:16px 0;position:relative;text-decoration:none;width:100%}@media (min-width:1024px){.spw-header-navigation-item ::slotted(a){padding:16px}.spw-header-navigation-item ::slotted(a):before{background:var(--spw-ds-primary);bottom:0;content:\"\";height:5px;left:16px;position:absolute;transition:width .2s ease-in;width:0}}.spw-header-navigation-item ::slotted(a:focus-visible){box-shadow:0 0 0 3px #000;outline:3px solid #fff;outline-offset:-3px}.spw-header-navigation-item ::slotted(a:active){color:var(--spw-ds-primary)!important}.spw-header-navigation-item ::slotted(spw-header-navigation-dropdown){display:none;opacity:0}@media (min-width:1024px){.spw-header-navigation-item ::slotted(spw-header-navigation-dropdown){box-shadow:var(--spw-effect-elevation-8);display:block;opacity:0;pointer-events:none;position:absolute;width:320px}}@media (max-width:1023px){.spw-header-navigation-item--is-subnav-visible ::slotted(spw-header-navigation-dropdown){background:#fff;display:block;left:0;margin-top:0;min-height:100%;opacity:1;overflow-y:auto;padding-top:132px;position:absolute;top:0;width:100%}}.spw-header-navigation-item__top{background:#fff;border-bottom:1px solid var(--spw-colors-support-grey-grey-300);display:flex;flex-direction:column;height:118px;justify-content:space-between;left:16px;padding:24px 0;position:absolute;top:0;width:calc(100% - 32px);z-index:9999999}.spw-header-navigation-item__top-back{align-items:center;color:var(--spw-colors-support-grey-grey-900);display:flex;font-size:14px;font-weight:700;gap:8px;justify-content:left;text-decoration:none}.spw-header-navigation-item__top-back span{text-decoration:underline}.spw-header-navigation-item__top-back spw-icon{font-size:18px}.spw-header-navigation-item__top-title a{color:var(--spw-colors-support-grey-grey-900);display:block;font-size:20px;font-weight:700;overflow:hidden;text-decoration:underline;text-overflow:ellipsis;white-space:nowrap}:host([data-level-visible=\"1\"]) .spw-header-navigation-item__top--1{display:flex}@media (min-width:1024px){:host([data-level-visible=\"1\"]) .spw-header-navigation-item__top--1{display:none}}:host([data-level-visible=\"2\"]) .spw-header-navigation-item__top--1{display:none}:host([data-level-visible=\"3\"]) .spw-header-navigation-item__top--1{display:none}:host([data-level-visible=\"1\"]) .spw-header-navigation-item__top--2{display:none}:host([data-level-visible=\"2\"]) .spw-header-navigation-item__top--2{display:flex}@media (min-width:1024px){:host([data-level-visible=\"2\"]) .spw-header-navigation-item__top--2{display:none}}:host([data-level-visible=\"3\"]) .spw-header-navigation-item__top--2{display:none}:host([data-level-visible=\"1\"]) .spw-header-navigation-item__top--3{display:none}:host([data-level-visible=\"2\"]) .spw-header-navigation-item__top--3{display:none}:host([data-level-visible=\"3\"]) .spw-header-navigation-item__top--3{display:flex}@media (min-width:1024px){:host([data-level-visible=\"3\"]) .spw-header-navigation-item__top--3{display:none}.spw-header-navigation-item__top{display:none}}";
 const SpwHeaderNavigationItem$1 = /*@__PURE__*/ proxyCustomElement(class SpwHeaderNavigationItem extends H {
     constructor() {

package/dist/components/spw-header-navigation-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"spw-header-navigation-item.js","mappings":"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","names":["SpwHeaderNavigationItem","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-header/spw-header-navigation-item/spw-header-navigation-item.scss?tag=spw-header-navigation-item&encapsulation=shadow","src/components/spw-header/spw-header-navigation-item/spw-header-navigation-item.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n @include breakpoint(lg) {\n display: contents;\n width: auto;\n }\n}\n\n.spw-header-navigation-item {\n color: var(--spw-colors-support-grey-grey-900);\n font-size: 16px;\n font-weight: 700;\n background: white;\n\n ::slotted(a:hover) {\n @include under-breakpoint(lg) {\n color: var(--spw-ds-primary) !important;\n }\n }\n\n :host([data-level='1']) & {\n ::slotted(a) {\n position: relative;\n padding: 24px 16px;\n font-size: 20px;\n &:before {\n content: '';\n position: absolute;\n top: 0;\n left: 16px;\n width: calc(100% - 32px);\n height: 1px;\n background: var(--spw-colors-support-grey-grey-300);\n }\n @include breakpoint(lg) {\n padding: 20px 16px;\n font-size: 16px;\n border-bottom: 0;\n &:before {\n content: '';\n position: absolute;\n top: auto;\n bottom: 0;\n left: 16px;\n width: 0;\n height: 3px;\n background: var(--spw-ds-primary);\n }\n }\n }\n &:hover {\n @include breakpoint(lg) {\n ::slotted(spw-header-navigation-dropdown) {\n pointer-events: auto;\n opacity: 1;\n top: 100%;\n margin-left: 16px;\n transition: opacity 0.1s ease-in;\n }\n ::slotted(a) {\n color: var(--spw-ds-primary) !important;\n &:before {\n width: calc(100% - 32px);\n }\n }\n }\n }\n\n &--has-subnav {\n ::slotted(a) {\n &:after {\n font-family: var(--spw-ds-font-icons-solid);\n content: '\\f054';\n font-size: 18px;\n @include breakpoint(lg) {\n content: '\\f078';\n font-size: 14px;\n }\n }\n }\n }\n\n &--is-subnav-visible {\n ::slotted(spw-header-navigation-dropdown) {\n z-index: 10;\n }\n ::slotted(a) {\n &:after {\n content: '\\f054';\n @include breakpoint(lg) {\n content: '\\f078';\n }\n }\n }\n }\n }\n\n :host([data-level='2']) & {\n ::slotted(a) {\n padding: 12px 16px;\n font-weight: 400;\n font-size: 18px;\n @include breakpoint(lg) {\n padding: 20px;\n font-weight: 700;\n font-size: 16px;\n }\n }\n @include breakpoint(lg) {\n &:hover {\n ::slotted(spw-header-navigation-dropdown) {\n pointer-events: auto;\n opacity: 1;\n left: 100%;\n top: 0;\n transition: opacity 0.1s ease-in;\n z-index: 38;\n }\n ::slotted(a) {\n color: var(--spw-ds-primary) !important;\n background: var(--spw-colors-support-grey-grey-100);\n &:before {\n display: none;\n }\n }\n }\n }\n\n &--has-subnav {\n ::slotted(a) {\n &:after {\n font-family: var(--spw-ds-font-icons-solid);\n content: '\\f054';\n font-weight: 700;\n }\n }\n }\n\n &--is-subnav-visible {\n ::slotted(spw-header-navigation-dropdown) {\n z-index: 11;\n }\n ::slotted(a) {\n &:after {\n content: '\\f054';\n }\n }\n }\n }\n\n :host([data-level='3']) & {\n ::slotted(a) {\n padding: 12px 16px;\n font-weight: 400;\n font-size: 16px;\n @include breakpoint(lg) {\n padding: 20px;\n font-weight: 700;\n font-size: 16px;\n }\n }\n ::slotted(a:hover) {\n @include breakpoint(lg) {\n color: var(--spw-ds-primary) !important;\n }\n }\n &--is-subnav-visible {\n ::slotted(spw-header-navigation-dropdown) {\n z-index: 12;\n }\n }\n }\n\n &--is-active {\n ::slotted(a) {\n color: var(--spw-ds-primary) !important;\n }\n }\n\n ::slotted(a) {\n display: inline-flex;\n position: relative;\n color: inherit;\n text-decoration: none;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n width: 100%;\n padding: 16px 0;\n @include breakpoint(lg) {\n padding: 16px;\n }\n &:before {\n @include breakpoint(lg) {\n content: '';\n transition: width 0.2s ease-in;\n bottom: 0;\n left: 16px;\n height: 5px;\n width: 0;\n position: absolute;\n background: var(--spw-ds-primary);\n }\n }\n }\n\n ::slotted(a:focus-visible) {\n outline: 3px solid white;\n outline-offset: -3px;\n box-shadow: 0 0 0 3px black;\n }\n\n ::slotted(a:active) {\n color: var(--spw-ds-primary) !important;\n }\n\n ::slotted(spw-header-navigation-dropdown) {\n display: none;\n opacity: 0;\n @include breakpoint(lg) {\n display: block;\n pointer-events: none;\n opacity: 0;\n position: absolute;\n width: 320px;\n box-shadow: var(--spw-effect-elevation-8);\n }\n }\n\n &--is-subnav-visible {\n ::slotted(spw-header-navigation-dropdown) {\n @include under-breakpoint(lg) {\n display: block;\n opacity: 1;\n position: absolute;\n background: white;\n width: 100%;\n margin-top: 0;\n padding-top: 132px;\n top: 0;\n left: 0;\n min-height: 100%;\n overflow-y: auto;\n }\n }\n }\n}\n\n.spw-header-navigation-item__top {\n position: absolute;\n display: flex;\n justify-content: space-between;\n flex-direction: column;\n top: 0;\n left: 16px;\n height: 118px;\n z-index: 9999999;\n width: calc(100% - 32px);\n padding: 24px 0;\n background: white;\n border-bottom: 1px solid var(--spw-colors-support-grey-grey-300);\n\n &-back {\n gap: 8px;\n display: flex;\n justify-content: left;\n align-items: center;\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n color: var(--spw-colors-support-grey-grey-900);\n span {\n text-decoration: underline;\n }\n spw-icon {\n font-size: 18px;\n }\n }\n\n &-title {\n a {\n font-size: 20px;\n font-weight: 700;\n text-decoration: underline;\n color: var(--spw-colors-support-grey-grey-900);\n display: block;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n }\n\n &--1 {\n :host([data-level-visible='1']) & {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n }\n }\n :host([data-level-visible='2']) & {\n display: none;\n }\n :host([data-level-visible='3']) & {\n display: none;\n }\n }\n\n &--2 {\n :host([data-level-visible='1']) & {\n display: none;\n }\n :host([data-level-visible='2']) & {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n }\n }\n :host([data-level-visible='3']) & {\n display: none;\n }\n }\n\n &--3 {\n :host([data-level-visible='1']) & {\n display: none;\n }\n :host([data-level-visible='2']) & {\n display: none;\n }\n :host([data-level-visible='3']) & {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n }\n }\n }\n\n @include breakpoint(lg) {\n display: none;\n }\n}\n","import { Component, Event, EventEmitter, Host, h, Prop, Element, State } from '@stencil/core';\n\n@Component({\n tag: 'spw-header-navigation-item',\n styleUrl: 'spw-header-navigation-item.scss',\n shadow: true,\n})\nexport class SpwHeaderNavigationItem {\n @Element() el: HTMLSpwHeaderNavigationItemElement;\n\n /** Définit si l'élément de menu est la page courante */\n @Prop() isActive: boolean = false;\n\n @State() internalIsActive: boolean = false;\n @State() hasSubnav: boolean = false;\n @State() level: number = 1;\n @State() isSubnavVisible: boolean = false;\n @State() lastClickedLevel1Item: string \| null = null;\n @State() isMobile: boolean = window.innerWidth < 1024;\n\n @Event() spwHeaderNavigationNavigate: EventEmitter<{ level: number; element: HTMLSpwHeaderNavigationItemElement }>;\n\n componentWillLoad() {\n this.internalIsActive = this.isActive;\n this.checkForSubnav();\n this.calculateLevel();\n this.updateLevelClass();\n }\n\n componentWillUpdate() {\n if (this.isActive !== this.internalIsActive) {\n this.internalIsActive = this.isActive;\n }\n this.updateLevelClass();\n }\n\n private checkForSubnav() {\n const slot = this.el.shadowRoot.querySelector('slot');\n if (slot) {\n const assignedElements = slot.assignedElements({ flatten: true });\n const hasSubnav = assignedElements.some(el => el.tagName === 'SPW-HEADER-NAVIGATION-DROPDOWN');\n\n if (hasSubnav !== this.hasSubnav) {\n this.hasSubnav = hasSubnav;\n }\n }\n }\n\n private calculateLevel() {\n let level = 1;\n let parent = this.el.parentElement;\n\n while (parent && parent.tagName !== 'SPW-HEADER-NAVIGATION') {\n if (parent.tagName === 'SPW-HEADER-NAVIGATION-DROPDOWN') {\n level++;\n }\n parent = parent.parentElement;\n }\n\n this.level = level;\n }\n\n private updateLevelClass() {\n const htmlElement = document.documentElement;\n Array.from(htmlElement.classList).forEach(className => {\n if (className.startsWith('spw-ds-nav-level-')) {\n htmlElement.classList.remove(className);\n }\n });\n htmlElement.classList.add(`spw-ds-nav-level-${this.level}`);\n this.spwHeaderNavigationNavigate.emit({ level: this.level, element: this.el });\n }\n\n private toggleSubnavVisibility(event: MouseEvent) {\n if (!this.isMobile) return;\n\n event.stopPropagation();\n\n if (this.hasSubnav && !this.isSubnavVisible) {\n const isMobileScreen = window.matchMedia('(max-width: 1024px)').matches;\n if (isMobileScreen) {\n event.preventDefault();\n }\n\n if (this.level === 1) {\n this.lastClickedLevel1Item = this.el.innerText;\n document.documentElement.setAttribute('data-ds-nav-level1', this.lastClickedLevel1Item);\n }\n\n this.isSubnavVisible = !this.isSubnavVisible;\n\n if (this.isSubnavVisible) {\n this.level++;\n this.updateLevelClass();\n }\n }\n }\n\n private getStoredLevel1Item(): string {\n return document.documentElement.getAttribute('data-ds-nav-level1') \|\| '';\n }\n\n private handleBackClick(event: MouseEvent) {\n event.stopPropagation();\n\n this.isSubnavVisible = false;\n\n if (this.level > 1) {\n this.level--;\n this.updateLevelClass();\n }\n\n this.internalIsActive = false;\n\n if (this.level === 1 && !this.isSubnavVisible) {\n this.lastClickedLevel1Item = null;\n document.documentElement.removeAttribute('data-ds-nav-level1');\n }\n }\n\n private getPageTitle(): { title: string; link: string \| null; target: string \| null } \| null {\n const parent = this.el.shadowRoot.querySelector('slot');\n\n if (parent) {\n const assignedElements = parent.assignedElements({ flatten: true }) as HTMLElement[];\n\n if (assignedElements.length > 0) {\n const firstElement = assignedElements[0];\n\n const title = firstElement.innerText \|\| '';\n const link = (firstElement as HTMLAnchorElement).href \|\| null;\n const target = (firstElement as HTMLAnchorElement).target \|\| null;\n\n return { title, link, target };\n }\n }\n\n return null;\n }\n\n async componentDidLoad() {\n setTimeout(() => {\n this.checkForSubnav();\n }, 0);\n\n const slot = this.el.shadowRoot.querySelector('slot');\n if (slot) {\n const mutationObserver = new MutationObserver(() => {\n this.checkForSubnav();\n });\n\n mutationObserver.observe(slot, { childList: true, subtree: true });\n }\n }\n\n render() {\n const pageTitle = this.getPageTitle();\n const storedTitle = this.getStoredLevel1Item();\n\n const elementClass = {\n 'spw-header-navigation-item': true,\n 'spw-header-navigation-item--has-subnav': this.hasSubnav,\n 'spw-header-navigation-item--is-active': this.internalIsActive,\n 'spw-header-navigation-item--is-subnav-visible': this.isSubnavVisible,\n };\n\n return (\n <Host data-level={this.level}>\n <li class={elementClass}>\n <div class=\"spw-header-navigation-item__content\" onClick={event => this.toggleSubnavVisibility(event)}>\n {this.isSubnavVisible && (\n <div class={`spw-header-navigation-item__top spw-header-navigation-item__top--${this.level}`}>\n <div class=\"spw-header-navigation-item__top-back\" onClick={event => this.handleBackClick(event)}>\n <spw-icon icon=\"fa-chevron-left\"></spw-icon> <span>{this.level === 1 ? '' : this.level === 2 ? 'Menu principal' : storedTitle}</span>\n </div>\n <div class=\"spw-header-navigation-item__top-title\">\n <a href={pageTitle?.link \|\| '#'} target={pageTitle?.target \|\| '_self'}>\n {pageTitle?.title \|\| ''}\n </a>\n </div>\n </div>\n )}\n <slot></slot>\n </div>\n </li>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-header-navigation-item.js","mappings":"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","names":["SpwHeaderNavigationItem","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-header/spw-header-navigation-item/spw-header-navigation-item.scss?tag=spw-header-navigation-item&encapsulation=shadow","src/components/spw-header/spw-header-navigation-item/spw-header-navigation-item.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n @include breakpoint(lg) {\n display: contents;\n width: auto;\n }\n}\n\n.spw-header-navigation-item {\n color: var(--spw-colors-support-grey-grey-900);\n font-size: 16px;\n font-weight: 700;\n background: white;\n\n ::slotted(a:hover) {\n @include under-breakpoint(lg) {\n color: var(--spw-ds-primary) !important;\n }\n }\n\n :host([data-level='1']) & {\n ::slotted(a) {\n position: relative;\n padding: 24px 16px;\n font-size: 20px;\n &:before {\n content: '';\n position: absolute;\n top: 0;\n left: 16px;\n width: calc(100% - 32px);\n height: 1px;\n background: var(--spw-colors-support-grey-grey-300);\n }\n @include breakpoint(lg) {\n padding: 20px 16px;\n font-size: 16px;\n border-bottom: 0;\n &:before {\n content: '';\n position: absolute;\n top: auto;\n bottom: 0;\n left: 16px;\n width: 0;\n height: 3px;\n background: var(--spw-ds-primary);\n }\n }\n }\n &:hover {\n @include breakpoint(lg) {\n ::slotted(spw-header-navigation-dropdown) {\n pointer-events: auto;\n opacity: 1;\n top: 100%;\n margin-left: 16px;\n transition: opacity 0.1s ease-in;\n }\n ::slotted(a) {\n color: var(--spw-ds-primary) !important;\n &:before {\n width: calc(100% - 32px);\n }\n }\n }\n }\n\n &--has-subnav {\n ::slotted(a) {\n &:after {\n font-family: var(--spw-ds-font-icons-solid);\n content: '\\f054';\n font-size: 18px;\n @include breakpoint(lg) {\n content: '\\f078';\n font-size: 14px;\n }\n }\n }\n }\n\n &--is-subnav-visible {\n ::slotted(spw-header-navigation-dropdown) {\n z-index: 10;\n }\n ::slotted(a) {\n &:after {\n content: '\\f054';\n @include breakpoint(lg) {\n content: '\\f078';\n }\n }\n }\n }\n }\n\n :host([data-level='2']) & {\n @include breakpoint(lg) {\n position: relative;\n }\n ::slotted(a) {\n padding: 12px 16px;\n font-weight: 400;\n font-size: 18px;\n @include breakpoint(lg) {\n padding: 20px;\n font-weight: 700;\n font-size: 16px;\n }\n }\n @include breakpoint(lg) {\n &:hover {\n ::slotted(spw-header-navigation-dropdown) {\n pointer-events: auto;\n opacity: 1;\n left: 100%;\n top: 0;\n transition: opacity 0.1s ease-in;\n z-index: 38;\n }\n ::slotted(a) {\n color: var(--spw-ds-primary) !important;\n background: var(--spw-colors-support-grey-grey-100);\n &:before {\n display: none;\n }\n }\n }\n }\n\n &--has-subnav {\n ::slotted(a) {\n &:after {\n font-family: var(--spw-ds-font-icons-solid);\n content: '\\f054';\n font-weight: 700;\n }\n }\n }\n\n &--is-subnav-visible {\n ::slotted(spw-header-navigation-dropdown) {\n z-index: 11;\n }\n ::slotted(a) {\n &:after {\n content: '\\f054';\n }\n }\n }\n }\n\n :host([data-level='3']) & {\n ::slotted(a) {\n padding: 12px 16px;\n font-weight: 400;\n font-size: 16px;\n @include breakpoint(lg) {\n padding: 20px;\n font-weight: 700;\n font-size: 16px;\n }\n }\n ::slotted(a:hover) {\n @include breakpoint(lg) {\n color: var(--spw-ds-primary) !important;\n }\n }\n &--is-subnav-visible {\n ::slotted(spw-header-navigation-dropdown) {\n z-index: 12;\n }\n }\n }\n\n &--is-active {\n ::slotted(a) {\n color: var(--spw-ds-primary) !important;\n }\n }\n\n ::slotted(a) {\n display: inline-flex;\n position: relative;\n color: inherit;\n text-decoration: none;\n align-items: center;\n justify-content: space-between;\n gap: 8px;\n width: 100%;\n padding: 16px 0;\n @include breakpoint(lg) {\n padding: 16px;\n }\n &:before {\n @include breakpoint(lg) {\n content: '';\n transition: width 0.2s ease-in;\n bottom: 0;\n left: 16px;\n height: 5px;\n width: 0;\n position: absolute;\n background: var(--spw-ds-primary);\n }\n }\n }\n\n ::slotted(a:focus-visible) {\n outline: 3px solid white;\n outline-offset: -3px;\n box-shadow: 0 0 0 3px black;\n }\n\n ::slotted(a:active) {\n color: var(--spw-ds-primary) !important;\n }\n\n ::slotted(spw-header-navigation-dropdown) {\n display: none;\n opacity: 0;\n @include breakpoint(lg) {\n display: block;\n pointer-events: none;\n opacity: 0;\n position: absolute;\n width: 320px;\n box-shadow: var(--spw-effect-elevation-8);\n }\n }\n\n &--is-subnav-visible {\n ::slotted(spw-header-navigation-dropdown) {\n @include under-breakpoint(lg) {\n display: block;\n opacity: 1;\n position: absolute;\n background: white;\n width: 100%;\n margin-top: 0;\n padding-top: 132px;\n top: 0;\n left: 0;\n min-height: 100%;\n overflow-y: auto;\n }\n }\n }\n}\n\n.spw-header-navigation-item__top {\n position: absolute;\n display: flex;\n justify-content: space-between;\n flex-direction: column;\n top: 0;\n left: 16px;\n height: 118px;\n z-index: 9999999;\n width: calc(100% - 32px);\n padding: 24px 0;\n background: white;\n border-bottom: 1px solid var(--spw-colors-support-grey-grey-300);\n\n &-back {\n gap: 8px;\n display: flex;\n justify-content: left;\n align-items: center;\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n color: var(--spw-colors-support-grey-grey-900);\n span {\n text-decoration: underline;\n }\n spw-icon {\n font-size: 18px;\n }\n }\n\n &-title {\n a {\n font-size: 20px;\n font-weight: 700;\n text-decoration: underline;\n color: var(--spw-colors-support-grey-grey-900);\n display: block;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n }\n\n &--1 {\n :host([data-level-visible='1']) & {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n }\n }\n :host([data-level-visible='2']) & {\n display: none;\n }\n :host([data-level-visible='3']) & {\n display: none;\n }\n }\n\n &--2 {\n :host([data-level-visible='1']) & {\n display: none;\n }\n :host([data-level-visible='2']) & {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n }\n }\n :host([data-level-visible='3']) & {\n display: none;\n }\n }\n\n &--3 {\n :host([data-level-visible='1']) & {\n display: none;\n }\n :host([data-level-visible='2']) & {\n display: none;\n }\n :host([data-level-visible='3']) & {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n }\n }\n }\n\n @include breakpoint(lg) {\n display: none;\n }\n}\n","import { Component, Event, EventEmitter, Host, h, Prop, Element, State } from '@stencil/core';\n\n@Component({\n tag: 'spw-header-navigation-item',\n styleUrl: 'spw-header-navigation-item.scss',\n shadow: true,\n})\nexport class SpwHeaderNavigationItem {\n @Element() el: HTMLSpwHeaderNavigationItemElement;\n\n /** Définit si l'élément de menu est la page courante */\n @Prop() isActive: boolean = false;\n\n @State() internalIsActive: boolean = false;\n @State() hasSubnav: boolean = false;\n @State() level: number = 1;\n @State() isSubnavVisible: boolean = false;\n @State() lastClickedLevel1Item: string \| null = null;\n @State() isMobile: boolean = window.innerWidth < 1024;\n\n @Event() spwHeaderNavigationNavigate: EventEmitter<{ level: number; element: HTMLSpwHeaderNavigationItemElement }>;\n\n componentWillLoad() {\n this.internalIsActive = this.isActive;\n this.checkForSubnav();\n this.calculateLevel();\n this.updateLevelClass();\n }\n\n componentWillUpdate() {\n if (this.isActive !== this.internalIsActive) {\n this.internalIsActive = this.isActive;\n }\n this.updateLevelClass();\n }\n\n private checkForSubnav() {\n const slot = this.el.shadowRoot.querySelector('slot');\n if (slot) {\n const assignedElements = slot.assignedElements({ flatten: true });\n const hasSubnav = assignedElements.some(el => el.tagName === 'SPW-HEADER-NAVIGATION-DROPDOWN');\n\n if (hasSubnav !== this.hasSubnav) {\n this.hasSubnav = hasSubnav;\n }\n }\n }\n\n private calculateLevel() {\n let level = 1;\n let parent = this.el.parentElement;\n\n while (parent && parent.tagName !== 'SPW-HEADER-NAVIGATION') {\n if (parent.tagName === 'SPW-HEADER-NAVIGATION-DROPDOWN') {\n level++;\n }\n parent = parent.parentElement;\n }\n\n this.level = level;\n }\n\n private updateLevelClass() {\n const htmlElement = document.documentElement;\n Array.from(htmlElement.classList).forEach(className => {\n if (className.startsWith('spw-ds-nav-level-')) {\n htmlElement.classList.remove(className);\n }\n });\n htmlElement.classList.add(`spw-ds-nav-level-${this.level}`);\n this.spwHeaderNavigationNavigate.emit({ level: this.level, element: this.el });\n }\n\n private toggleSubnavVisibility(event: MouseEvent) {\n if (!this.isMobile) return;\n\n event.stopPropagation();\n\n if (this.hasSubnav && !this.isSubnavVisible) {\n const isMobileScreen = window.matchMedia('(max-width: 1024px)').matches;\n if (isMobileScreen) {\n event.preventDefault();\n }\n\n if (this.level === 1) {\n this.lastClickedLevel1Item = this.el.innerText;\n document.documentElement.setAttribute('data-ds-nav-level1', this.lastClickedLevel1Item);\n }\n\n this.isSubnavVisible = !this.isSubnavVisible;\n\n if (this.isSubnavVisible) {\n this.level++;\n this.updateLevelClass();\n }\n }\n }\n\n private getStoredLevel1Item(): string {\n return document.documentElement.getAttribute('data-ds-nav-level1') \|\| '';\n }\n\n private handleBackClick(event: MouseEvent) {\n event.stopPropagation();\n\n this.isSubnavVisible = false;\n\n if (this.level > 1) {\n this.level--;\n this.updateLevelClass();\n }\n\n this.internalIsActive = false;\n\n if (this.level === 1 && !this.isSubnavVisible) {\n this.lastClickedLevel1Item = null;\n document.documentElement.removeAttribute('data-ds-nav-level1');\n }\n }\n\n private getPageTitle(): { title: string; link: string \| null; target: string \| null } \| null {\n const parent = this.el.shadowRoot.querySelector('slot');\n\n if (parent) {\n const assignedElements = parent.assignedElements({ flatten: true }) as HTMLElement[];\n\n if (assignedElements.length > 0) {\n const firstElement = assignedElements[0];\n\n const title = firstElement.innerText \|\| '';\n const link = (firstElement as HTMLAnchorElement).href \|\| null;\n const target = (firstElement as HTMLAnchorElement).target \|\| null;\n\n return { title, link, target };\n }\n }\n\n return null;\n }\n\n async componentDidLoad() {\n setTimeout(() => {\n this.checkForSubnav();\n }, 0);\n\n const slot = this.el.shadowRoot.querySelector('slot');\n if (slot) {\n const mutationObserver = new MutationObserver(() => {\n this.checkForSubnav();\n });\n\n mutationObserver.observe(slot, { childList: true, subtree: true });\n }\n }\n\n render() {\n const pageTitle = this.getPageTitle();\n const storedTitle = this.getStoredLevel1Item();\n\n const elementClass = {\n 'spw-header-navigation-item': true,\n 'spw-header-navigation-item--has-subnav': this.hasSubnav,\n 'spw-header-navigation-item--is-active': this.internalIsActive,\n 'spw-header-navigation-item--is-subnav-visible': this.isSubnavVisible,\n };\n\n return (\n <Host data-level={this.level}>\n <li class={elementClass}>\n <div class=\"spw-header-navigation-item__content\" onClick={event => this.toggleSubnavVisibility(event)}>\n {this.isSubnavVisible && (\n <div class={`spw-header-navigation-item__top spw-header-navigation-item__top--${this.level}`}>\n <div class=\"spw-header-navigation-item__top-back\" onClick={event => this.handleBackClick(event)}>\n <spw-icon icon=\"fa-chevron-left\"></spw-icon> <span>{this.level === 1 ? '' : this.level === 2 ? 'Menu principal' : storedTitle}</span>\n </div>\n <div class=\"spw-header-navigation-item__top-title\">\n <a href={pageTitle?.link \|\| '#'} target={pageTitle?.target \|\| '_self'}>\n {pageTitle?.title \|\| ''}\n </a>\n </div>\n </div>\n )}\n <slot></slot>\n </div>\n </li>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/spw-header-navigation.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, h, a as Host } from './index.js';
 import { d as defineCustomElement$2 } from './p-_q4w18VU.js';
-const spwHeaderNavigationCss = "/*! 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-header-navigation{background:#fff;border-top:1px solid var(--spw-colors-support-grey-grey-300);display:none;height:calc(100% - 80px);left:0;order:2;overflow-y:auto;width:100%;z-index:9999}:host(.spw-ds-nav-open) .spw-header-navigation{display:flex;flex-direction:column}@media (min-width:1024px){.spw-header-navigation{display:block;height:auto;left:auto;order:0;overflow-y:initial;top:auto;width:auto;z-index:30}:host(.spw-ds-search-open) .spw-header-navigation{display:none}}.spw-header-navigation__list{align-items:center;display:flex;flex:1;flex-direction:column;margin-left:-16px;margin-right:-16px;position:relative;width:calc(100% + 32px)}@media (min-width:1024px){.spw-header-navigation__list{flex-direction:row}}@media (min-width:1350px){.spw-header-navigation__list{gap:24px}}.spw-header-navigation__list-back{display:flex;justify-content:left;padding:24px 16px 0;position:relative;width:100%;z-index:3}.spw-header-navigation__list-back:after{background:#fff;bottom:-1px;content:\"\";height:1px;left:0;position:absolute;width:100%}.spw-header-navigation__list-back a{align-items:center;color:var(--spw-colors-support-grey-grey-900);display:flex;font-size:14px;font-weight:700;gap:8px;justify-content:left;text-decoration:none}.spw-header-navigation__list-back a span{text-decoration:underline}.spw-header-navigation__list-back a spw-icon{font-size:18px}@media (min-width:1024px){.spw-header-navigation__list-back{display:none}}";
+const spwHeaderNavigationCss = "/*! 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-header-navigation{background:#fff;border-top:1px solid var(--spw-colors-support-grey-grey-300);display:none;height:calc(100% - 80px);left:0;order:2;overflow-y:auto;width:100%;z-index:9999}:host(.spw-ds-nav-open) .spw-header-navigation{display:flex;flex-direction:column}@media (min-width:1024px){.spw-header-navigation{display:block;height:auto;left:auto;order:0;overflow-y:initial;top:auto;width:auto;z-index:30}:host(.spw-ds-search-open) .spw-header-navigation{display:none}}.spw-header-navigation__list{align-items:center;display:flex;flex:1;flex-direction:column;margin-left:-16px;margin-right:-16px;position:relative;width:calc(100% + 32px)}@media (min-width:1024px){.spw-header-navigation__list{flex-direction:row}.spw-header-navigation--flex-start .spw-header-navigation__list{justify-content:flex-start}.spw-header-navigation--space-between .spw-header-navigation__list{justify-content:space-between}}@media (min-width:1350px){.spw-header-navigation__list{gap:24px}}.spw-header-navigation__list-back{display:flex;justify-content:left;padding:24px 16px 0;position:relative;width:100%;z-index:3}.spw-header-navigation__list-back:after{background:#fff;bottom:-1px;content:\"\";height:1px;left:0;position:absolute;width:100%}.spw-header-navigation__list-back a{align-items:center;color:var(--spw-colors-support-grey-grey-900);display:flex;font-size:14px;font-weight:700;gap:8px;justify-content:left;text-decoration:none}.spw-header-navigation__list-back a span{text-decoration:underline}.spw-header-navigation__list-back a spw-icon{font-size:18px}@media (min-width:1024px){.spw-header-navigation__list-back{display:none}}";
 const SpwHeaderNavigation$1 = /*@__PURE__*/ proxyCustomElement(class SpwHeaderNavigation extends H {
     constructor() {
@@ -10,6 +10,8 @@ const SpwHeaderNavigation$1 = /*@__PURE__*/ proxyCustomElement(class SpwHeaderNa
         this.__attachShadow();
         this.level = 0;
         this.element = null;
+        /** Alignement des éléments de navigation sur desktop */
+        this.alignment = 'flex-start';
     }
     redirectToHome(event) {
         event.preventDefault();
@@ -43,11 +45,18 @@ const SpwHeaderNavigation$1 = /*@__PURE__*/ proxyCustomElement(class SpwHeaderNa
         });
         return allItems;
     }
+    get elementClass() {
+        return {
+            'spw-header-navigation': true,
+            [`spw-header-navigation--${this.alignment}`]: true,
+        };
+    }
     render() {
-        return (h(Host, { key: 'fdd23724de968f9f8f9bb90f139f472072a53791' }, h("nav", { key: '856a388643e35f8ed40414de018ec1bcc9066a09', class: "spw-header-navigation" }, h("div", { key: 'ef69808d9320c23248ccddc538d0877ba6c7c635', class: "spw-ds-container" }, h("ul", { key: 'f25aed8a2c70f0f56ea9534a49df75c62a263547', class: "spw-header-navigation__list" }, h("li", { key: 'bf1cbdbf5301298b9a6f02e2baa8913d923029f4', class: "spw-header-navigation__list-back" }, h("a", { key: '5cb1e3fd7c9b245f4f8d0aad15dc7205b9a39538', href: "#", onClick: event => this.redirectToHome(event) }, h("spw-icon", { key: '19c6d078a813bbfe079177aa7239ac301449c5f2', icon: "fa-chevron-left" }), " ", h("span", { key: 'a63aed32e504e226053a0dd168cb5121568ea142' }, "Page d'accueil"))), h("slot", { key: 'd91290ce2ba155d777125b251c6d16fc3eb025d1' }))))));
+        return (h(Host, { key: '7f5b13ff34e597859a64d9dd4a805bb597480413' }, h("nav", { key: '6026cae72487130e08b34518e7903de948384557', class: this.elementClass }, h("div", { key: 'b9e42ee32a6963cdf53b34ce87a924ec07bf700e', class: "spw-ds-container" }, h("ul", { key: '642886313210a484f812cfd4d1139f342aaa24f0', class: "spw-header-navigation__list" }, h("li", { key: '79b7c6ff983462742cd787d42f9fa60bc07749ca', class: "spw-header-navigation__list-back" }, h("a", { key: '2272b6529c377cf4bd6714054503e2f2a5a967a6', href: "#", onClick: event => this.redirectToHome(event) }, h("spw-icon", { key: '36282eff01ee7938b74db532436aa27cced7bc57', icon: "fa-chevron-left" }), " ", h("span", { key: 'ba710742a72afd1eca41083373a29ad9087721b2' }, "Page d'accueil"))), h("slot", { key: '2ea73b2057aa7c9f353f10bde40e89d211cc7272' }))))));
     }
     static get style() { return spwHeaderNavigationCss; }
 }, [1, "spw-header-navigation", {
+        "alignment": [1],
         "level": [32],
         "element": [32]
     }, [[2, "spwHeaderNavigationNavigate", "handleNavigation"]]]);

package/dist/components/spw-header-navigation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"spw-header-navigation.js","mappings":";;;AAAA,MAAM,sBAAsB,GAAG,i/~~HAAi/H;;MCOngIA~~,qBAAmB,iBAAAC,kBAAA,CAAA,MAAA,mBAAA,SAAAC,CAAA,CAAA;AALhC,IAAA,WAAA,GAAA;;;;AAMW,QAAA,IAAK,CAAA,KAAA,GAAW,CAAC;AACjB,QAAA,IAAO,CAAA,OAAA,GAA8C,IAAI;~~AA6DnE~~;~~AA3DS~~,IAAA,cAAc,CAAC,KAAiB,EAAA;QACtC,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,GAAG;;AAI5B,IAAA,gBAAgB,CAAC,KAAkF,EAAA;QACjG,KAAK,CAAC,eAAe,EAAE;QACvB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO;QACnC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK;QAE/B,UAAU,CAAC,MAAK;YACd,IAAI,CAAC,qBAAqB,EAAE;SAC7B,EAAE,CAAC,CAAC;;IAGC,qBAAqB,GAAA;AAC3B,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,qBAAqB,EAAE;QAE7C,QAAQ,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;YAC/B,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE,CAAG,EAAA,KAAK,GAAG,CAAC,CAAE,CAAA,CAAC;YAC5C,IAAI,CAAC,YAAY,CAAC,oBAAoB,EAAE,CAAG,EAAA,IAAI,CAAC,KAAK,CAAE,CAAA,CAAC;AAC1D,SAAC,CAAC;;IAGI,qBAAqB,GAAA;QAC3B,MAAM,QAAQ,GAAkB,EAAE;QAClC,MAAM,QAAQ,GAAG,QAAQ,CAAC,gBAAgB,CAAC,4BAA4B,CAAC;AAExE,QAAA,QAAQ,CAAC,OAAO,CAAC,IAAI,IAAG;AACtB,YAAA,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;AACnB,YAAA,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU;YAClC,IAAI,UAAU,EAAE;gBACd,MAAM,QAAQ,GAAG,UAAU,CAAC,gBAAgB,CAAC,4BAA4B,CAAC;AAC1E,gBAAA,QAAQ,CAAC,OAAO,CAAC,OAAO,IAAI,QAAQ,CAAC,IAAI,CAAC,OAAsB,CAAC,CAAC;;AAEtE,SAAC,CAAC;AAEF,QAAA,OAAO,QAAQ;;~~IAGjB~~,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,~~CAAK~~,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,~~EAAA~~,KAAK,~~EAAC~~,~~uBAAuB~~,EAAA,~~EAChC~~,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kBAAkB,EAAA,EAC3B,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,6BAA6B,EAAA,EACrC,CAAI,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kCAAkC,EAAA,EAC1C,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,KAAK,IAAI,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAA,EACtD,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,iBAAiB,EAAY,CAAA,OAAC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAA,gBAAA,CAA2B,CACtE,CACD,EACL,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACV,CACD,CACF,CACD~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~","names":["SpwHeaderNavigation","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-header/spw-header-navigation/spw-header-navigation.scss?tag=spw-header-navigation&encapsulation=shadow","src/components/spw-header/spw-header-navigation/spw-header-navigation.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n\n.spw-header-navigation {\n display: none;\n left: 0;\n width: 100%;\n height: calc(100% - 80px);\n background: white;\n z-index: 9999;\n overflow-y: auto;\n order: 2;\n border-top: 1px solid var(--spw-colors-support-grey-grey-300);\n :host(.spw-ds-nav-open) & {\n display: flex;\n flex-direction: column;\n }\n @include breakpoint(lg) {\n order: initial;\n display: block;\n height: auto;\n width: auto;\n overflow-y: initial;\n top: auto;\n left: auto;\n z-index: 30;\n }\n :host(.spw-ds-search-open) & {\n @include breakpoint(lg) {\n display: none;\n }\n }\n &__list {\n position: relative;\n display: flex;\n flex: 1;\n align-items: center;\n flex-direction: column;\n width: calc(100% + 32px);\n margin-left: -16px;\n margin-right: -16px;\n @include breakpoint(lg) {\n flex-direction: row;\n }\n @include breakpoint(xl) {\n gap: 24px;\n }\n &-back {\n display: flex;\n justify-content: left;\n width: 100%;\n padding: 24px 16px;\n padding-bottom: 0;\n position: relative;\n z-index: 3;\n &:after {\n content: '';\n position: absolute;\n bottom: -1px;\n width: 100%;\n left: 0;\n height: 1px;\n background: white;\n }\n a {\n gap: 8px;\n display: flex;\n justify-content: left;\n align-items: center;\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n color: var(--spw-colors-support-grey-grey-900);\n span {\n text-decoration: underline;\n }\n spw-icon {\n font-size: 18px;\n }\n }\n @include breakpoint(lg) {\n display: none;\n }\n }\n }\n}\n","import { Component, Listen, Host, State, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-header-navigation',\n styleUrl: 'spw-header-navigation.scss',\n shadow: true,\n})\nexport class SpwHeaderNavigation {\n @State() level: number = 0;\n @State() element: HTMLSpwHeaderNavigationItemElement \| null = null;\n\n private redirectToHome(event: MouseEvent) {\n event.preventDefault();\n window.location.href = '/';\n }\n\n @Listen('spwHeaderNavigationNavigate', { capture: true })\n handleNavigation(event: CustomEvent<{ level: number; element: HTMLSpwHeaderNavigationItemElement }>) {\n event.stopPropagation();\n this.element = event.detail.element;\n this.level = event.detail.level;\n\n setTimeout(() => {\n this.updateNavigationItems();\n }, 0);\n }\n\n private updateNavigationItems() {\n const allItems = this.getAllNavigationItems();\n\n allItems.forEach((item, index) => {\n item.setAttribute('data-id', `${index + 1}`);\n item.setAttribute('data-level-visible', `${this.level}`);\n });\n }\n\n private getAllNavigationItems(): HTMLElement[] {\n const allItems: HTMLElement[] = [];\n const navItems = document.querySelectorAll('spw-header-navigation-item');\n\n navItems.forEach(item => {\n allItems.push(item);\n const shadowRoot = item.shadowRoot;\n if (shadowRoot) {\n const subItems = shadowRoot.querySelectorAll('spw-header-navigation-item');\n subItems.forEach(subItem => allItems.push(subItem as HTMLElement));\n }\n });\n\n return allItems;\n }\n\n render() {\n return (\n <Host>\n <nav class~~=\"spw-header-navigation\"~~>\n <div class=\"spw-ds-container\">\n <ul class=\"spw-header-navigation__list\">\n <li class=\"spw-header-navigation__list-back\">\n <a href=\"#\" onClick={event => this.redirectToHome(event)}>\n <spw-icon icon=\"fa-chevron-left\"></spw-icon> <span>Page d'accueil</span>\n </a>\n </li>\n <slot></slot>\n </ul>\n </div>\n </nav>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-header-navigation.js","mappings":"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","names":["SpwHeaderNavigation","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-header/spw-header-navigation/spw-header-navigation.scss?tag=spw-header-navigation&encapsulation=shadow","src/components/spw-header/spw-header-navigation/spw-header-navigation.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n\n.spw-header-navigation {\n display: none;\n left: 0;\n width: 100%;\n height: calc(100% - 80px);\n background: white;\n z-index: 9999;\n overflow-y: auto;\n order: 2;\n border-top: 1px solid var(--spw-colors-support-grey-grey-300);\n :host(.spw-ds-nav-open) & {\n display: flex;\n flex-direction: column;\n }\n @include breakpoint(lg) {\n order: initial;\n display: block;\n height: auto;\n width: auto;\n overflow-y: initial;\n top: auto;\n left: auto;\n z-index: 30;\n }\n :host(.spw-ds-search-open) & {\n @include breakpoint(lg) {\n display: none;\n }\n }\n &__list {\n position: relative;\n display: flex;\n flex: 1;\n align-items: center;\n flex-direction: column;\n width: calc(100% + 32px);\n margin-left: -16px;\n margin-right: -16px;\n @include breakpoint(lg) {\n flex-direction: row;\n .spw-header-navigation--flex-start & {\n justify-content: flex-start;\n }\n .spw-header-navigation--space-between & {\n justify-content: space-between;\n }\n }\n @include breakpoint(xl) {\n gap: 24px;\n }\n &-back {\n display: flex;\n justify-content: left;\n width: 100%;\n padding: 24px 16px;\n padding-bottom: 0;\n position: relative;\n z-index: 3;\n &:after {\n content: '';\n position: absolute;\n bottom: -1px;\n width: 100%;\n left: 0;\n height: 1px;\n background: white;\n }\n a {\n gap: 8px;\n display: flex;\n justify-content: left;\n align-items: center;\n font-weight: 700;\n font-size: 14px;\n text-decoration: none;\n color: var(--spw-colors-support-grey-grey-900);\n span {\n text-decoration: underline;\n }\n spw-icon {\n font-size: 18px;\n }\n }\n @include breakpoint(lg) {\n display: none;\n }\n }\n }\n}\n","import { Component, Listen, Host, Prop, State, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-header-navigation',\n styleUrl: 'spw-header-navigation.scss',\n shadow: true,\n})\nexport class SpwHeaderNavigation {\n @State() level: number = 0;\n @State() element: HTMLSpwHeaderNavigationItemElement \| null = null;\n\n /** Alignement des éléments de navigation sur desktop */\n @Prop() alignment: 'flex-start' \| 'space-between' = 'flex-start';\n\n private redirectToHome(event: MouseEvent) {\n event.preventDefault();\n window.location.href = '/';\n }\n\n @Listen('spwHeaderNavigationNavigate', { capture: true })\n handleNavigation(event: CustomEvent<{ level: number; element: HTMLSpwHeaderNavigationItemElement }>) {\n event.stopPropagation();\n this.element = event.detail.element;\n this.level = event.detail.level;\n\n setTimeout(() => {\n this.updateNavigationItems();\n }, 0);\n }\n\n private updateNavigationItems() {\n const allItems = this.getAllNavigationItems();\n\n allItems.forEach((item, index) => {\n item.setAttribute('data-id', `${index + 1}`);\n item.setAttribute('data-level-visible', `${this.level}`);\n });\n }\n\n private getAllNavigationItems(): HTMLElement[] {\n const allItems: HTMLElement[] = [];\n const navItems = document.querySelectorAll('spw-header-navigation-item');\n\n navItems.forEach(item => {\n allItems.push(item);\n const shadowRoot = item.shadowRoot;\n if (shadowRoot) {\n const subItems = shadowRoot.querySelectorAll('spw-header-navigation-item');\n subItems.forEach(subItem => allItems.push(subItem as HTMLElement));\n }\n });\n\n return allItems;\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-header-navigation': true,\n [`spw-header-navigation--${this.alignment}`]: true,\n };\n }\n\n render() {\n return (\n <Host>\n <nav class={this.elementClass}>\n <div class=\"spw-ds-container\">\n <ul class=\"spw-header-navigation__list\">\n <li class=\"spw-header-navigation__list-back\">\n <a href=\"#\" onClick={event => this.redirectToHome(event)}>\n <spw-icon icon=\"fa-chevron-left\"></spw-icon> <span>Page d'accueil</span>\n </a>\n </li>\n <slot></slot>\n </ul>\n </div>\n </nav>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/spw-header.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { d as defineCustomElement$4 } from './p-AjhBdYbk.js';
+import { d as defineCustomElement$4 } from './p-DjyPtAVX.js';
 import { d as defineCustomElement$3 } from './p-_q4w18VU.js';
 import { d as defineCustomElement$2 } from './p-CVuBJlFL.js';

package/dist/components/spw-iodda.js CHANGED Viewed

@@ -3,8 +3,8 @@ import { d as defineCustomElement$7 } from './p-t1vZcpqC.js';
 import { d as defineCustomElement$6 } from './p-qgvllwX6.js';
 import { d as defineCustomElement$5 } from './p-_q4w18VU.js';
 import { d as defineCustomElement$4 } from './p-CVuBJlFL.js';
-import { d as defineCustomElement$3 } from './p-du-Bai6S.js';
-import { d as defineCustomElement$2 } from './p-_sdYD0eS.js';
+import { d as defineCustomElement$3 } from './p-BFGmcTVw.js';
+import { d as defineCustomElement$2 } from './p-BZy3vC1Y.js';
 async function fetchData(page = 1, itemsPerPage, search = '', filters) {
     const offset = (page - 1) * itemsPerPage;

package/dist/components/spw-link.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { S as SpwLink$1, d as defineCustomElement$1 } from './p-CNNUoO2J.js';
+import { S as SpwLink$1, d as defineCustomElement$1 } from './p-qROlK2WR.js';
 const SpwLink = SpwLink$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/spw-message.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h, a as Host } from './index.js';
 import { d as defineCustomElement$3 } from './p-_q4w18VU.js';
-import { d as defineCustomElement$2 } from './p-CNNUoO2J.js';
+import { d as defineCustomElement$2 } from './p-qROlK2WR.js';
 const getIcon = variant => {
   const icons = {

package/dist/components/spw-pagination.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { S as SpwPagination$1, d as defineCustomElement$1 } from './p-du-Bai6S.js';
+import { S as SpwPagination$1, d as defineCustomElement$1 } from './p-BFGmcTVw.js';
 const SpwPagination = SpwPagination$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/spw-search-field.js CHANGED Viewed

@@ -1,16 +1,17 @@
-import { p as proxyCustomElement, H, h } from './index.js';
+import { p as proxyCustomElement, H, c as createEvent, h } from './index.js';
 import { d as defineCustomElement$5 } from './p-t1vZcpqC.js';
 import { d as defineCustomElement$4 } from './p-qgvllwX6.js';
 import { d as defineCustomElement$3 } from './p-_q4w18VU.js';
-import { d as defineCustomElement$2 } from './p-_sdYD0eS.js';
+import { d as defineCustomElement$2 } from './p-BZy3vC1Y.js';
-const spwSearchFieldCss = "/*! 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-search-field{position:relative}.spw-search-field--large spw-text-field{--spw-input-height:54px;--spw-input-padding:16px 24px;--spw-input-radius:60px;--spw-input-border:transparent;--spw-input-icon-search-color:var(--spw-ds-primary)}.spw-search-field__options{background-color:#fff;border:1px solid var(--spw-color-themes-grey-grey-800);border-radius:0 0 4px 4px;margin-top:-2px;max-height:200px;overflow-y:auto;position:absolute;transition:transform .3s ease,opacity .3s ease;width:100%;z-index:44}.spw-search-field__options--down,.spw-search-field__options--up{top:100%;transform:translateY(0)}.spw-search-field__option{border-bottom:1px solid var(--spw-color-themes-grey-grey-900);color:var(--spw-color-themes-grey-grey-900);cursor:pointer;padding:12px;text-align:left;transition:background-color .2s ease}.spw-search-field__option:hover{background-color:var(--spw-color-themes-grey-grey-200)}.spw-search-field__option:last-child{border-bottom:none}.spw-search-field__option--focused{background-color:var(--spw-color-themes-grey-grey-300)}.spw-search-field__option--selected{font-weight:700}.spw-search-field__no-results{color:var(--spw-color-themes-grey-grey-600);cursor:not-allowed;padding:12px;text-align:left}.spw-tw-italic{font-style:italic}.-spw-tw-mt-1{margin-top:-.25rem}.spw-tw-mb-2{margin-bottom:.5rem}";
+const spwSearchFieldCss = "/*! 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-search-field{position:relative}.spw-search-field--large spw-text-field{--spw-input-height:54px;--spw-input-padding:16px 24px;--spw-input-radius:60px;--spw-input-border:transparent;--spw-input-icon-search-color:var(--spw-ds-primary)}.spw-search-field--has-submit-button spw-text-field{--spw-input-padding-right:56px}.spw-search-field__submit{align-items:center;background:transparent;border:none;border-radius:50%;cursor:pointer;display:flex;height:40px;justify-content:center;position:absolute;right:0;top:50%;transform:translateY(-50%);transition:all .2s ease;width:40px;z-index:10}.spw-search-field--large .spw-search-field__submit{height:46px;right:16px;width:46px}.spw-search-field__options{background-color:#fff;border:1px solid var(--spw-color-themes-grey-grey-800);border-radius:0 0 4px 4px;margin-top:-2px;max-height:200px;overflow-y:auto;position:absolute;transition:transform .3s ease,opacity .3s ease;width:100%;z-index:44}.spw-search-field--is-rounded .spw-search-field__options{border-radius:24px;margin-top:12px}.spw-search-field--is-rounded .spw-search-field__options ul{padding:12px}.spw-search-field__options--down,.spw-search-field__options--up{top:100%;transform:translateY(0)}.spw-search-field__option{border-bottom:1px solid var(--spw-color-themes-grey-grey-900);color:var(--spw-color-themes-grey-grey-900);cursor:pointer;padding:12px;text-align:left;transition:background-color .2s ease}.spw-search-field--is-rounded .spw-search-field__option{border-bottom:none;border-radius:12px;padding:12px}.spw-search-field__option:hover{background-color:var(--spw-color-themes-grey-grey-200)}.spw-search-field__option:last-child{border-bottom:none}.spw-search-field__option--focused{background-color:var(--spw-color-themes-grey-grey-300)}.spw-search-field__option--selected{font-weight:700}.spw-search-field__no-results{color:var(--spw-color-themes-grey-grey-600);cursor:not-allowed;padding:12px;text-align:left}.spw-search-field--is-rounded .spw-search-field__no-results{padding:24px}.spw-search-field__view-all{bottom:0;cursor:pointer;font-weight:700;position:sticky}.spw-search-field--is-rounded .spw-search-field__view-all{border-radius:12px;border-top:none}.spw-search-field__view-all a{background:#fff;border-top:1px solid var(--spw-color-themes-grey-grey-900);color:#000;display:block;display:inline-flex;justify-content:space-between;padding:12px;text-decoration:underline;width:100%}.spw-search-field--is-rounded .spw-search-field__view-all a{border-top:none;color:var(--spw-ds-primary);padding:12px 24px 24px}.spw-search-field__view-all a:hover{text-decoration:none}.spw-tw-italic{font-style:italic}.-spw-tw-mt-1{margin-top:-.25rem}.spw-tw-mb-2{margin-bottom:.5rem}";
 const SpwSearchField$1 = /*@__PURE__*/ proxyCustomElement(class SpwSearchField extends H {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
+        this.valueChanged = createEvent(this, "valueChanged", 7);
         /** Placeholder à afficher dans le champ de recherche */
         this.placeholder = 'Recherche...';
         /** Taille du champ de recherche */
@@ -19,6 +20,12 @@ const SpwSearchField$1 = /*@__PURE__*/ proxyCustomElement(class SpwSearchField e
         this.label = '';
         /** Indique si le champ est requis */
         this.required = false;
+        /** Texte du lien pour voir tous les résultats */
+        this.viewAllResults = 'Voir plus de résultats';
+        /** Texte à afficher si pas de résultats */
+        this.noResults = 'Pas de résultats.';
+        /** Affiche un bouton submit (loupe) qui déclenche le submit du formulaire parent */
+        this.hasSubmitButton = false;
         this.filteredItems = [];
         this.searchText = '';
         this.isOpen = false;
@@ -33,6 +40,28 @@ const SpwSearchField$1 = /*@__PURE__*/ proxyCustomElement(class SpwSearchField e
                 }
             }
         };
+        this.handleValueChanged = (event) => {
+            const newValue = String(event.detail);
+            this.searchText = newValue;
+            this.updateHiddenInput();
+            this.filterItems();
+            this.determineDropdownDirection();
+            if (!this.searchText) {
+                this.isOpen = false;
+            }
+            else {
+                this.isOpen = true;
+            }
+            this.valueChanged.emit(this.searchText);
+        };
+        this.handleSubmit = (event) => {
+            event.preventDefault();
+            this.updateHiddenInput();
+            const form = this.el.closest('form');
+            if (form) {
+                form.submit();
+            }
+        };
     }
     componentWillLoad() {
         if (this.items) {
@@ -44,9 +73,46 @@ const SpwSearchField$1 = /*@__PURE__*/ proxyCustomElement(class SpwSearchField e
     }
     componentDidLoad() {
         document.addEventListener('click', this.handleClickOutside);
+        this.createHiddenInput();
     }
     disconnectedCallback() {
         document.removeEventListener('click', this.handleClickOutside);
+        if (this.hiddenInput && this.hiddenInput.parentNode) {
+            this.hiddenInput.parentNode.removeChild(this.hiddenInput);
+        }
+    }
+    createHiddenInput() {
+        if (this.name) {
+            this.hiddenInput = document.createElement('input');
+            this.hiddenInput.type = 'hidden';
+            this.hiddenInput.name = this.name;
+            this.hiddenInput.value = this.searchText;
+            this.el.appendChild(this.hiddenInput);
+        }
+    }
+    updateHiddenInput() {
+        if (this.hiddenInput) {
+            this.hiddenInput.value = this.searchText;
+        }
+    }
+    /** Réinitialise le champ de recherche */
+    async resetInput() {
+        this.searchText = '';
+        this.updateHiddenInput();
+        this.isOpen = false;
+        this.focusedItemIndex = null;
+        this.valueChanged.emit(this.searchText);
+    }
+    /** Définit la valeur du champ de recherche */
+    async setValue(value) {
+        this.searchText = value;
+        this.updateHiddenInput();
+        this.filterItems();
+        this.valueChanged.emit(this.searchText);
+    }
+    /** Récupère la valeur actuelle du champ de recherche */
+    async getValue() {
+        return this.searchText;
     }
     parseItems(newValue) {
         if (!newValue) {
@@ -61,13 +127,6 @@ const SpwSearchField$1 = /*@__PURE__*/ proxyCustomElement(class SpwSearchField e
             this.filteredItems = [];
         }
     }
-    handleSearchInput(event) {
-        const input = event.target;
-        this.searchText = input.value;
-        this.filterItems();
-        this.determineDropdownDirection();
-        this.isOpen = true;
-    }
     filterItems() {
         if (!this.items) {
             this.filteredItems = [];
@@ -84,7 +143,9 @@ const SpwSearchField$1 = /*@__PURE__*/ proxyCustomElement(class SpwSearchField e
     }
     selectItem(item) {
         this.searchText = item.label;
+        this.updateHiddenInput();
         this.isOpen = false;
+        this.valueChanged.emit(this.searchText);
         if (item.url) {
             window.location.href = item.url;
         }
@@ -138,15 +199,18 @@ const SpwSearchField$1 = /*@__PURE__*/ proxyCustomElement(class SpwSearchField e
     get elementClass() {
         return {
             'spw-search-field': true,
+            'spw-search-field--is-rounded': this.isRounded,
+            'spw-search-field--has-submit-button': this.hasSubmitButton,
             [`spw-search-field--${this.size}`]: true,
         };
     }
     render() {
-        return (h("div", { key: 'd00840338c82da443e332932278054e498365138', ref: el => (this.hostElement = el), class: this.elementClass }, h("spw-text-field", { key: '9c05d301ae19f15d1e1669b8addf0474ab403802', placeholder: this.placeholder, name: this.name, label: this.label, size: this.size, "is-search": true, "is-clear": true, required: this.required, disabled: this.disabled, assistiveText: this.assistiveText, value: this.searchText, onInput: event => this.handleSearchInput(event), onKeyDown: event => this.handleKeyDown(event) }), this.isOpen && !!this.items && (h("div", { key: '4f249bd675da1df764386f15f30b721d15e14ebc', class: `spw-search-field__options spw-search-field__options--${this.dropdownDirection}` }, !!this.filteredItems.length && (h("ul", { key: '404416e18cbd2eb5b5679f4353febc3994e438f8' }, this.filteredItems.map((item, index) => (h("li", { class: {
+        return (h("div", { key: '07e35a89a2689deb130a67021e40edcce012bef6', ref: el => (this.hostElement = el), class: this.elementClass }, h("spw-text-field", { key: '05a4ef03fe1f53afcd12e2c1e1238db2a1aa2cad', placeholder: this.placeholder, name: this.name, label: this.label, size: this.size, "is-search": true, "is-clear": true, required: this.required, disabled: this.disabled, assistiveText: this.assistiveText, value: this.searchText, onValueChanged: this.handleValueChanged, onKeyDown: event => this.handleKeyDown(event) }), this.hasSubmitButton && h("button", { key: '088382c1095ec44de895485ce815ce5d1fa21b6d', type: "button", class: "spw-search-field__submit", onClick: this.handleSubmit, "aria-label": "Rechercher" }), this.isOpen && !!this.items && (h("div", { key: 'c3f4b5a451a350c908bf5515c53b5bb10d439096', class: `spw-search-field__options spw-search-field__options--${this.dropdownDirection}` }, !!this.filteredItems.length && (h("ul", { key: '64097e5de526ed83489234fb4382b3999c5dc2ce' }, this.filteredItems.map((item, index) => (h("li", { class: {
                 'spw-search-field__option': true,
                 'spw-search-field__option--focused': index === this.focusedItemIndex,
-            }, onClick: () => this.selectItem(item) }, this.highlightMatch(item.label), " ", item.category && h("span", { class: "spw-tw-italic" }, " - ", item.category)))))), !this.filteredItems.length && h("p", { key: 'a8f3a1c750733ae59470cc3fe378e996ba6dd31c', class: "spw-search-field__no-results" }, "Pas de r\u00E9sultats.")))));
+            }, onClick: () => this.selectItem(item) }, this.highlightMatch(item.label), " ", item.category && h("span", { class: "spw-tw-italic" }, " - ", item.category)))))), !this.filteredItems.length && h("p", { key: '9c5728bfb4cd1591446b697cc311b77c9c4288ec', class: "spw-search-field__no-results" }, this.noResults), !!this.filteredItems.length && this.viewAllResults && this.viewAllResultsLink && (h("p", { key: '6f4f69c0283fccad053b0d2608e2beb2543546a5', class: "spw-search-field__view-all" }, h("a", { key: '939963c172d388220cef9cf33e9ee3ea6c47802c', href: this.viewAllResultsLink }, this.viewAllResults, " ", h("spw-icon", { key: '49eff81ffbdda6342459c83b141deb65997f2c23', icon: "fa-arrow-right" }))))))));
     }
+    get el() { return this; }
     static get watchers() { return {
         "items": ["parseItems"]
     }; }
@@ -157,14 +221,22 @@ const SpwSearchField$1 = /*@__PURE__*/ proxyCustomElement(class SpwSearchField e
         "size": [1],
         "label": [1],
         "disabled": [4],
+        "isRounded": [4, "is-rounded"],
         "name": [1],
         "required": [4],
         "assistiveText": [1, "assistive-text"],
+        "viewAllResults": [1, "view-all-results"],
+        "viewAllResultsLink": [1, "view-all-results-link"],
+        "noResults": [1, "no-results"],
+        "hasSubmitButton": [4, "has-submit-button"],
         "filteredItems": [32],
         "searchText": [32],
         "isOpen": [32],
         "focusedItemIndex": [32],
-        "dropdownDirection": [32]
+        "dropdownDirection": [32],
+        "resetInput": [64],
+        "setValue": [64],
+        "getValue": [64]
     }, undefined, {
         "items": ["parseItems"]
     }]);

package/dist/components/spw-search-field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"spw-search-field.js","mappings":"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","names":["SpwSearchField","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-search-field/spw-search-field.scss?tag=spw-search-field&encapsulation=shadow","src/components/spw-search-field/spw-search-field.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-search-field {\n position: relative;\n &--large {\n spw-text-field {\n --spw-input-height: 54px;\n --spw-input-padding: 16px 24px;\n --spw-input-radius: 60px;\n --spw-input-border: transparent;\n --spw-input-icon-search-color: var(--spw-ds-primary);\n }\n }\n}\n\n.spw-search-field__options {\n position: absolute;\n width: 100%;\n background-color: #fff;\n border: 1px solid var(--spw-color-themes-grey-grey-800);\n border-radius: 0 0 4px 4px;\n max-height: 200px;\n overflow-y: auto;\n z-index: 44;\n margin-top: -2px;\n transition:\n transform 0.3s ease,\n opacity 0.3s ease;\n}\n\n.spw-search-field__options--down {\n top: 100%;\n transform: translateY(0);\n}\n\n.spw-search-field__options--up {\n top: 100%;\n transform: translateY(0);\n}\n\n.spw-search-field__option {\n padding: 12px;\n color: var(--spw-color-themes-grey-grey-900);\n text-align: left;\n border-bottom: 1px solid var(--spw-color-themes-grey-grey-900);\n cursor: pointer;\n transition: background-color 0.2s ease;\n\n &:hover {\n background-color: var(--spw-color-themes-grey-grey-200);\n }\n\n &:last-child {\n border-bottom: none;\n }\n\n &--focused {\n background-color: var(--spw-color-themes-grey-grey-300);\n }\n\n &--selected {\n font-weight: 700;\n }\n}\n\n.spw-search-field__no-results {\n padding: 12px;\n cursor: not-allowed;\n text-align: left;\n color: var(--spw-color-themes-grey-grey-600);\n}\n","import { Component, Prop, State, h, Watch } from '@stencil/core';\n\n@Component({\n tag: 'spw-search-field',\n styleUrl: 'spw-search-field.scss',\n shadow: true,\n})\nexport class SpwSearchField {\n private hostElement: HTMLElement;\n\n /** Liste des éléments à filtrer, passée sous forme de chaîne JSON /\n @Prop() items?: string;\n /* Placeholder à afficher dans le champ de recherche /\n @Prop() placeholder: string = 'Recherche...';\n /* Taille du champ de recherche /\n @Prop() size?: 'large' \| 'medium' = 'medium';\n /* Label associé au champ de recherche /\n @Prop() label?: string = '';\n /* Indique si le champ de recherche est désactivé /\n @Prop() disabled?: boolean;\n /* Nom du champ de recherche, utilisé pour les formulaires /\n @Prop() name: string;\n /* Indique si le champ est requis /\n @Prop() required?: boolean = false;\n /* Texte d'assistance affiché sous le champ de recherche */\n @Prop() assistiveText?: string;\n\n @State() filteredItems: Array<{ url?: string; label: string; category?: string }> = [];\n @State() searchText: string = '';\n @State() isOpen: boolean = false;\n @State() focusedItemIndex: number \| null = null;\n @State() dropdownDirection: 'up' \| 'down' = 'down';\n\n componentWillLoad() {\n if (this.items) {\n this.parseItems(this.items);\n } else {\n this.filteredItems = [];\n }\n }\n\n componentDidLoad() {\n document.addEventListener('click', this.handleClickOutside);\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this.handleClickOutside);\n }\n\n @Watch('items')\n parseItems(newValue: string) {\n if (!newValue) {\n this.filteredItems = [];\n return;\n }\n\n try {\n this.filteredItems = JSON.parse(newValue);\n } catch (e) {\n console.error('Invalid JSON format for items:', newValue);\n this.filteredItems = [];\n }\n }\n\n private handleClickOutside = (event: MouseEvent) => {\n if (this.isOpen) {\n const target = event.composedPath()[0] as Node;\n const isInsideHost = this.hostElement.contains(target);\n\n if (!isInsideHost) {\n this.isOpen = false;\n }\n }\n };\n\n private handleSearchInput(event: Event) {\n const input = event.target as HTMLInputElement;\n this.searchText = input.value;\n this.filterItems();\n this.determineDropdownDirection();\n this.isOpen = true;\n }\n\n private filterItems() {\n if (!this.items) {\n this.filteredItems = [];\n return;\n }\n\n const normalizedSearchText = this.normalizeString(this.searchText);\n\n this.filteredItems = JSON.parse(this.items).filter(item => this.normalizeString(item.label).includes(normalizedSearchText));\n }\n\n private normalizeString(str: string): string {\n return str\n .normalize('NFD')\n .replace(/[\\u0300-\\u036f]/g, '')\n .toLowerCase();\n }\n\n private selectItem(item: { url?: string; label: string }) {\n this.searchText = item.label;\n this.isOpen = false;\n\n if (item.url) {\n window.location.href = item.url;\n }\n }\n\n private determineDropdownDirection() {\n const rect = this.hostElement.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n\n if (rect.bottom + 200 > viewportHeight && rect.top > 200) {\n this.dropdownDirection = 'up';\n } else {\n this.dropdownDirection = 'down';\n }\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n if (this.isOpen) {\n this.focusedItemIndex = this.focusedItemIndex === null ? 0 : (this.focusedItemIndex + 1) % this.filteredItems.length;\n }\n break;\n case 'ArrowUp':\n event.preventDefault();\n if (this.isOpen) {\n this.focusedItemIndex =\n this.focusedItemIndex === null ? this.filteredItems.length - 1 : (this.focusedItemIndex - 1 + this.filteredItems.length) % this.filteredItems.length;\n }\n break;\n case 'Enter':\n event.preventDefault();\n if (this.isOpen && this.focusedItemIndex !== null) {\n this.selectItem(this.filteredItems[this.focusedItemIndex]);\n }\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n private highlightMatch(item: string) {\n const normalizedSearchText = this.normalizeString(this.searchText);\n const normalizedItem = this.normalizeString(item);\n\n const startIndex = normalizedItem.indexOf(normalizedSearchText);\n\n if (startIndex === -1 \|\| !this.searchText) {\n return item;\n }\n\n const endIndex = startIndex + normalizedSearchText.length;\n\n return (\n <span>\n {item.slice(0, startIndex)}\n <strong>{item.slice(startIndex, endIndex)}</strong>\n {item.slice(endIndex)}\n </span>\n );\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-search-field': true,\n [`spw-search-field--${this.size}`]: true,\n };\n }\n\n render() {\n return (\n <div ref={el => (this.hostElement = el as HTMLElement)} class={this.elementClass}>\n <spw-text-field\n placeholder={this.placeholder}\n name={this.name}\n label={this.label}\n size={this.size}\n is-search={true}\n is-clear={true}\n required={this.required}\n disabled={this.disabled}\n assistiveText={this.assistiveText}\n value={this.searchText}\n onInput={event => this.handleSearchInput(event)}\n onKeyDown={event => this.handleKeyDown(event)}\n ></spw-text-field>\n {this.isOpen && !!this.items && (\n <div class={`spw-search-field__options spw-search-field__options--${this.dropdownDirection}`}>\n {!!this.filteredItems.length && (\n <ul>\n {this.filteredItems.map((item, index) => (\n <li\n class={{\n 'spw-search-field__option': true,\n 'spw-search-field__option--focused': index === this.focusedItemIndex,\n }}\n onClick={() => this.selectItem(item)}\n >\n {this.highlightMatch(item.label)} {item.category && <span class=\"spw-tw-italic\"> - {item.category}</span>}\n </li>\n ))}\n </ul>\n )}\n {!this.filteredItems.length && <p class=\"spw-search-field__no-results\">Pas de résultats.</p>}\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-search-field.js","mappings":"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","names":["SpwSearchField","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-search-field/spw-search-field.scss?tag=spw-search-field&encapsulation=shadow","src/components/spw-search-field/spw-search-field.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-search-field {\n position: relative;\n &--large {\n spw-text-field {\n --spw-input-height: 54px;\n --spw-input-padding: 16px 24px;\n --spw-input-radius: 60px;\n --spw-input-border: transparent;\n --spw-input-icon-search-color: var(--spw-ds-primary);\n }\n }\n\n &--has-submit-button {\n spw-text-field {\n --spw-input-padding-right: 56px;\n }\n }\n}\n\n.spw-search-field__submit {\n position: absolute;\n right: 0;\n top: 50%;\n transform: translateY(-50%);\n width: 40px;\n height: 40px;\n border: none;\n border-radius: 50%;\n background: transparent;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: all 0.2s ease;\n z-index: 10;\n\n .spw-search-field--large & {\n width: 46px;\n height: 46px;\n right: 16px;\n }\n}\n\n.spw-search-field__options {\n position: absolute;\n width: 100%;\n background-color: #fff;\n border: 1px solid var(--spw-color-themes-grey-grey-800);\n border-radius: 0 0 4px 4px;\n max-height: 200px;\n overflow-y: auto;\n z-index: 44;\n margin-top: -2px;\n transition:\n transform 0.3s ease,\n opacity 0.3s ease;\n .spw-search-field--is-rounded & {\n border-radius: 24px;\n margin-top: 12px;\n ul {\n padding: 12px;\n }\n }\n}\n\n.spw-search-field__options--down {\n top: 100%;\n transform: translateY(0);\n}\n\n.spw-search-field__options--up {\n top: 100%;\n transform: translateY(0);\n}\n\n.spw-search-field__option {\n padding: 12px;\n color: var(--spw-color-themes-grey-grey-900);\n text-align: left;\n border-bottom: 1px solid var(--spw-color-themes-grey-grey-900);\n cursor: pointer;\n transition: background-color 0.2s ease;\n\n .spw-search-field--is-rounded & {\n border-radius: 12px;\n padding: 12px;\n border-bottom: none;\n }\n\n &:hover {\n background-color: var(--spw-color-themes-grey-grey-200);\n }\n\n &:last-child {\n border-bottom: none;\n }\n\n &--focused {\n background-color: var(--spw-color-themes-grey-grey-300);\n }\n\n &--selected {\n font-weight: 700;\n }\n}\n\n.spw-search-field__no-results {\n padding: 12px;\n cursor: not-allowed;\n text-align: left;\n color: var(--spw-color-themes-grey-grey-600);\n .spw-search-field--is-rounded & {\n padding: 24px;\n }\n}\n\n.spw-search-field__view-all {\n position: sticky;\n bottom: 0;\n cursor: pointer;\n font-weight: 700;\n\n .spw-search-field--is-rounded & {\n border-radius: 12px;\n border-top: none;\n }\n\n a {\n color: black;\n background: white;\n border-top: 1px solid var(--spw-color-themes-grey-grey-900);\n .spw-search-field--is-rounded & {\n color: var(--spw-ds-primary);\n padding: 12px 24px 24px 24px;\n border-top: none;\n }\n text-decoration: underline;\n display: block;\n width: 100%;\n padding: 12px;\n display: inline-flex;\n justify-content: space-between;\n\n &:hover {\n text-decoration: none;\n }\n }\n}\n","import { Component, Prop, State, Event, EventEmitter, Method, h, Watch, Element } from '@stencil/core';\n\n@Component({\n tag: 'spw-search-field',\n styleUrl: 'spw-search-field.scss',\n shadow: true,\n})\nexport class SpwSearchField {\n @Element() el: HTMLElement;\n private hostElement: HTMLElement;\n private hiddenInput: HTMLInputElement;\n\n /** Événement émis lorsque la valeur du champ de recherche change /\n @Event() valueChanged: EventEmitter<string>;\n\n /* Liste des éléments à filtrer, passée sous forme de chaîne JSON /\n @Prop() items?: string;\n /* Placeholder à afficher dans le champ de recherche /\n @Prop() placeholder: string = 'Recherche...';\n /* Taille du champ de recherche /\n @Prop() size?: 'large' \| 'medium' = 'medium';\n /* Label associé au champ de recherche /\n @Prop() label?: string = '';\n /* Indique si le champ de recherche est désactivé /\n @Prop() disabled?: boolean;\n /* Indique si le champ de recherche est arrondi ou pas (communément utilisé dans un hero banner) /\n @Prop() isRounded?: boolean;\n /* Nom du champ de recherche, utilisé pour les formulaires /\n @Prop() name: string;\n /* Indique si le champ est requis /\n @Prop() required?: boolean = false;\n /* Texte d'assistance affiché sous le champ de recherche /\n @Prop() assistiveText?: string;\n /* Texte du lien pour voir tous les résultats /\n @Prop() viewAllResults?: string = 'Voir plus de résultats';\n /* URL vers laquelle renvoie le lien \"voir tous les résultats\" /\n @Prop() viewAllResultsLink?: string;\n /* Texte à afficher si pas de résultats /\n @Prop() noResults?: string = 'Pas de résultats.';\n /* Affiche un bouton submit (loupe) qui déclenche le submit du formulaire parent /\n @Prop() hasSubmitButton?: boolean = false;\n\n @State() filteredItems: Array<{ url?: string; label: string; category?: string }> = [];\n @State() searchText: string = '';\n @State() isOpen: boolean = false;\n @State() focusedItemIndex: number \| null = null;\n @State() dropdownDirection: 'up' \| 'down' = 'down';\n\n componentWillLoad() {\n if (this.items) {\n this.parseItems(this.items);\n } else {\n this.filteredItems = [];\n }\n }\n\n componentDidLoad() {\n document.addEventListener('click', this.handleClickOutside);\n this.createHiddenInput();\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this.handleClickOutside);\n if (this.hiddenInput && this.hiddenInput.parentNode) {\n this.hiddenInput.parentNode.removeChild(this.hiddenInput);\n }\n }\n\n private createHiddenInput() {\n if (this.name) {\n this.hiddenInput = document.createElement('input');\n this.hiddenInput.type = 'hidden';\n this.hiddenInput.name = this.name;\n this.hiddenInput.value = this.searchText;\n this.el.appendChild(this.hiddenInput);\n }\n }\n\n private updateHiddenInput() {\n if (this.hiddenInput) {\n this.hiddenInput.value = this.searchText;\n }\n }\n\n /* Réinitialise le champ de recherche /\n @Method()\n async resetInput() {\n this.searchText = '';\n this.updateHiddenInput();\n this.isOpen = false;\n this.focusedItemIndex = null;\n this.valueChanged.emit(this.searchText);\n }\n\n /* Définit la valeur du champ de recherche /\n @Method()\n async setValue(value: string) {\n this.searchText = value;\n this.updateHiddenInput();\n this.filterItems();\n this.valueChanged.emit(this.searchText);\n }\n\n /* Récupère la valeur actuelle du champ de recherche */\n @Method()\n async getValue(): Promise<string> {\n return this.searchText;\n }\n\n @Watch('items')\n parseItems(newValue: string) {\n if (!newValue) {\n this.filteredItems = [];\n return;\n }\n\n try {\n this.filteredItems = JSON.parse(newValue);\n } catch (e) {\n console.error('Invalid JSON format for items:', newValue);\n this.filteredItems = [];\n }\n }\n\n private handleClickOutside = (event: MouseEvent) => {\n if (this.isOpen) {\n const target = event.composedPath()[0] as Node;\n const isInsideHost = this.hostElement.contains(target);\n\n if (!isInsideHost) {\n this.isOpen = false;\n }\n }\n };\n\n private handleValueChanged = (event: CustomEvent<string \| number>) => {\n const newValue = String(event.detail);\n this.searchText = newValue;\n this.updateHiddenInput();\n this.filterItems();\n this.determineDropdownDirection();\n\n if (!this.searchText) {\n this.isOpen = false;\n } else {\n this.isOpen = true;\n }\n\n this.valueChanged.emit(this.searchText);\n };\n\n private filterItems() {\n if (!this.items) {\n this.filteredItems = [];\n return;\n }\n\n const normalizedSearchText = this.normalizeString(this.searchText);\n\n this.filteredItems = JSON.parse(this.items).filter(item => this.normalizeString(item.label).includes(normalizedSearchText));\n }\n\n private normalizeString(str: string): string {\n return str\n .normalize('NFD')\n .replace(/[\\u0300-\\u036f]/g, '')\n .toLowerCase();\n }\n\n private selectItem(item: { url?: string; label: string }) {\n this.searchText = item.label;\n this.updateHiddenInput();\n this.isOpen = false;\n this.valueChanged.emit(this.searchText);\n\n if (item.url) {\n window.location.href = item.url;\n }\n }\n\n private determineDropdownDirection() {\n const rect = this.hostElement.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n\n if (rect.bottom + 200 > viewportHeight && rect.top > 200) {\n this.dropdownDirection = 'up';\n } else {\n this.dropdownDirection = 'down';\n }\n }\n\n private handleKeyDown(event: KeyboardEvent) {\n switch (event.key) {\n case 'ArrowDown':\n event.preventDefault();\n if (this.isOpen) {\n this.focusedItemIndex = this.focusedItemIndex === null ? 0 : (this.focusedItemIndex + 1) % this.filteredItems.length;\n }\n break;\n case 'ArrowUp':\n event.preventDefault();\n if (this.isOpen) {\n this.focusedItemIndex =\n this.focusedItemIndex === null ? this.filteredItems.length - 1 : (this.focusedItemIndex - 1 + this.filteredItems.length) % this.filteredItems.length;\n }\n break;\n case 'Enter':\n event.preventDefault();\n if (this.isOpen && this.focusedItemIndex !== null) {\n this.selectItem(this.filteredItems[this.focusedItemIndex]);\n }\n break;\n case 'Escape':\n this.isOpen = false;\n break;\n }\n }\n\n private highlightMatch(item: string) {\n const normalizedSearchText = this.normalizeString(this.searchText);\n const normalizedItem = this.normalizeString(item);\n\n const startIndex = normalizedItem.indexOf(normalizedSearchText);\n\n if (startIndex === -1 \|\| !this.searchText) {\n return item;\n }\n\n const endIndex = startIndex + normalizedSearchText.length;\n\n return (\n <span>\n {item.slice(0, startIndex)}\n <strong>{item.slice(startIndex, endIndex)}</strong>\n {item.slice(endIndex)}\n </span>\n );\n }\n\n private handleSubmit = (event: Event) => {\n event.preventDefault();\n\n this.updateHiddenInput();\n\n const form = this.el.closest('form');\n if (form) {\n form.submit();\n }\n };\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-search-field': true,\n 'spw-search-field--is-rounded': this.isRounded,\n 'spw-search-field--has-submit-button': this.hasSubmitButton,\n [`spw-search-field--${this.size}`]: true,\n };\n }\n\n render() {\n return (\n <div ref={el => (this.hostElement = el as HTMLElement)} class={this.elementClass}>\n <spw-text-field\n placeholder={this.placeholder}\n name={this.name}\n label={this.label}\n size={this.size}\n is-search={true}\n is-clear={true}\n required={this.required}\n disabled={this.disabled}\n assistiveText={this.assistiveText}\n value={this.searchText}\n onValueChanged={this.handleValueChanged}\n onKeyDown={event => this.handleKeyDown(event)}\n ></spw-text-field>\n {this.hasSubmitButton && <button type=\"button\" class=\"spw-search-field__submit\" onClick={this.handleSubmit} aria-label=\"Rechercher\"></button>}\n {this.isOpen && !!this.items && (\n <div class={`spw-search-field__options spw-search-field__options--${this.dropdownDirection}`}>\n {!!this.filteredItems.length && (\n <ul>\n {this.filteredItems.map((item, index) => (\n <li\n class={{\n 'spw-search-field__option': true,\n 'spw-search-field__option--focused': index === this.focusedItemIndex,\n }}\n onClick={() => this.selectItem(item)}\n >\n {this.highlightMatch(item.label)} {item.category && <span class=\"spw-tw-italic\"> - {item.category}</span>}\n </li>\n ))}\n </ul>\n )}\n {!this.filteredItems.length && <p class=\"spw-search-field__no-results\">{this.noResults}</p>}\n {!!this.filteredItems.length && this.viewAllResults && this.viewAllResultsLink && (\n <p class=\"spw-search-field__view-all\">\n <a href={this.viewAllResultsLink}>\n {this.viewAllResults} <spw-icon icon=\"fa-arrow-right\"></spw-icon>\n </a>\n </p>\n )}\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/components/spw-select.js CHANGED Viewed

@@ -122,8 +122,10 @@ const SpwSelect$1 = /*@__PURE__*/ proxyCustomElement(class SpwSelect extends H {
                 const option = document.createElement('option');
                 const value = this.itemValue ? item[this.itemValue] : item;
                 const label = this.itemLabel ? item[this.itemLabel] : item;
+                const disabled = item.disabled || false;
                 option.value = String(value);
                 option.textContent = String(label);
+                option.disabled = disabled;
                 this.selectElement.appendChild(option);
             });
         }
@@ -160,7 +162,7 @@ const SpwSelect$1 = /*@__PURE__*/ proxyCustomElement(class SpwSelect extends H {
         };
     }
     render() {
-        return (h(Host, { key: '17dff311dbe9762fe0d38f1949f012767e9a2b51' }, h("div", { key: '0fc7e6d39e182c1044bb5b3d117110d44316a958', class: this.elementClass }, this.label && h("spw-field-label", { key: '6a4eda2b4ff3caefb9b05b12b1581274f1be10a6', label: this.label, name: this.name, required: this.required }), this.assistiveText && (h("spw-field-message", { key: 'f0b09de81771bc5008bb58c0b90ff15e5a4615b6', class: "spw-tw-mb-2 -spw-tw-mt-1", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: 'ac1906e5238eb49410d2a2f534b56b2f9853e7aa', class: "spw-select__container" }, h("select", { key: 'e1e817c838f15973a6ef86672e15eca40b740d33', id: this.name, class: "spw-select__trigger", onChange: event => this.handleSelectChange(event), disabled: this.disabled, ref: el => (this.selectElement = el), tabindex: this.disabled ? -1 : 0 }, h("option", { key: 'a5e2727f8418964b03462f16b266d1cbb8cac425', value: "", disabled: true, selected: !this.internalValue }, this.placeholder)), h("spw-icon", { key: 'fe958cab33e002cab576bffd8f720feeeaf455d1', class: "spw-select__arrow", icon: "fa-chevron-down" })), !this.items && h("slot", { key: '5e81d8b62ce0e59dd25204aa7a88ccdaf413722e' })), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
+        return (h(Host, { key: 'deb7266660e609a3e44623613a990bf8dcbe7343' }, h("div", { key: 'ff425d15ea0fd790039e72674d7657324b3c62cb', class: this.elementClass }, this.label && h("spw-field-label", { key: '71f35858b08561f526d52498aa04da0b7dd46c57', label: this.label, name: this.name, required: this.required }), this.assistiveText && (h("spw-field-message", { key: '1e0b80d55ae61be1d161fc4dcad2e5abb0d3b351', class: "spw-tw-mb-2 -spw-tw-mt-1", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: '3af822dbdc83f589aad041fd6fd0cb7cd43be639', class: "spw-select__container" }, h("select", { key: '727b2f5f46ac0610f91da0eeb13530ec99dc98a3', id: this.name, class: "spw-select__trigger", onChange: event => this.handleSelectChange(event), disabled: this.disabled, ref: el => (this.selectElement = el), tabindex: this.disabled ? -1 : 0 }, h("option", { key: '54fdb7a9268d4e796cc2cf6e70642719668ac3a7', value: "", disabled: true, selected: !this.internalValue }, this.placeholder)), h("spw-icon", { key: '345e115df06ae4373a0d910947997d4f2f7cd2d4', class: "spw-select__arrow", icon: "fa-chevron-down" })), !this.items && h("slot", { key: 'ca10c23f8e7e9b7422d479b5b648f661c6d431a0' })), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
     }
     static get formAssociated() { return true; }
     get el() { return this; }