npm - @spw-ds/spw-stencil-library - Versions diffs - 1.2.8 → 1.3.0 - Mend

@spw-ds/spw-stencil-library 1.2.8 → 1.3.0

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

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

	@@ -1 +1 @@
1	- {"file":"spw-header-lang.entry.cjs.js","mappings":";;;;AAAA,MAAM,gBAAgB,GAAG~~,4qHAA4qH~~;;~~MCOxrH~~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","names":["h","Host"],"sources":["src/components/spw-header/spw-header-lang/spw-header-lang.scss?tag=spw-header-lang&encapsulation=shadow","src/components/spw-header/spw-header-lang/spw-header-lang.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-header-lang {\n position: relative;\n @include under-breakpoint(lg) {\n margin-bottom: 0;\n }\n @include breakpoint(lg) {\n margin-left: 16px;\n }\n &:hover {\n .spw-header-lang__dropdown {\n @include breakpoint(lg) {\n display: block;\n }\n }\n }\n\n &__select {\n display: none;\n @include breakpoint(lg) {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n z-index: 2;\n }\n }\n\n &__active-lang {\n display: none;\n @include breakpoint(lg) {\n display: block;\n }\n }\n\n &__options {\n display: flex;\n gap: 24px;\n text-transform: uppercase;\n @include breakpoint(lg) {\n display: none;\n }\n }\n\n &__option {\n padding: ~~24px~~ 0;\n font-weight: bold;\n text-decoration: underline;\n &--selected {\n color: var(--spw-ds-primary);\n text-decoration: none;\n }\n }\n\n &__dropdown {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n z-index: 99999;\n position: absolute;\n overflow: hidden;\n top: 100%;\n width: max-content;\n right: 0;\n background: white;\n border-radius: 4px;\n box-shadow: var(--spw-effect-elevation-8);\n }\n }\n}\n","import { Component, h, Host, Element, State } from '@stencil/core';\n\n@Component({\n tag: 'spw-header-lang',\n styleUrl: 'spw-header-lang.scss',\n shadow: true,\n})\nexport class SpwHeaderLang {\n @Element() el!: HTMLElement;\n @State() activeLang: string = '';\n @State() options: HTMLOptionElement[] = [];\n\n private selectEl!: HTMLSelectElement;\n\n componentWillLoad() {\n this.updateActiveLangFromDOM();\n }\n\n componentDidLoad() {\n this.moveOptionsToSelect();\n }\n\n private updateActiveLangFromDOM() {\n const selected = this.el.querySelector('option[selected]');\n this.activeLang = selected?.textContent?.trim() \|\| '';\n }\n\n private moveOptionsToSelect() {\n const lightDomOptions = Array.from(this.el.querySelectorAll('option'));\n this.options = lightDomOptions;\n\n lightDomOptions.forEach(option => {\n this.selectEl.appendChild(option);\n });\n }\n\n private handleChange(event: Event) {\n const target = event.target as HTMLSelectElement;\n const selectedOption = target.selectedOptions[0];\n this.setActiveLangAndRedirect(selectedOption);\n }\n\n private setActiveLangAndRedirect(option: HTMLOptionElement) {\n this.activeLang = option?.textContent?.trim() \|\| '';\n const link = option?.getAttribute('data-link');\n if (link) {\n window.location.href = link;\n }\n }\n\n private handleButtonKeyDown = (event: KeyboardEvent) => {\n if (event.key === ' ' \|\| event.key === 'Enter') {\n event.preventDefault();\n this.selectEl?.click();\n }\n };\n\n private handleButtonClick = () => {\n this.selectEl?.click();\n };\n\n private handleOptionClick = (option: HTMLOptionElement) => {\n this.setActiveLangAndRedirect(option);\n };\n\n render() {\n return (\n <Host>\n <div class=\"spw-header-lang\">\n <spw-button\n variant=\"tertiary\"\n surface=\"light\"\n icon=\"fa-chevron-down\"\n class=\"spw-header-lang__active-lang\"\n onKeyDown={this.handleButtonKeyDown}\n onClick={this.handleButtonClick}\n >\n {this.activeLang}\n </spw-button>\n\n <select class=\"spw-header-lang__select\" onChange={e => this.handleChange(e)} ref={el => (this.selectEl = el as HTMLSelectElement)} tabIndex={-1} />\n\n <ul class=\"spw-header-lang__options\">\n {this.options.map(option => {\n const label = option.textContent?.trim() \|\| '';\n const value = option.getAttribute('value') \|\| '';\n const isSelected = label === this.activeLang;\n return (\n <li class={{ 'spw-header-lang__option': true, 'spw-header-lang__option--selected': isSelected }} data-value={value} onClick={() => this.handleOptionClick(option)}>\n {label}\n </li>\n );\n })}\n </ul>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-header-lang.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/spw-header/spw-header-lang/spw-header-lang.scss?tag=spw-header-lang&encapsulation=shadow","src/components/spw-header/spw-header-lang/spw-header-lang.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-header-lang {\n position: relative;\n @include under-breakpoint(lg) {\n margin-bottom: 0;\n }\n @include breakpoint(lg) {\n margin-left: 16px;\n }\n &:hover {\n .spw-header-lang__dropdown {\n @include breakpoint(lg) {\n display: block;\n }\n }\n }\n\n &__select {\n display: none;\n @include breakpoint(lg) {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n z-index: 2;\n }\n }\n\n &__active-lang {\n display: none;\n @include breakpoint(lg) {\n display: block;\n }\n }\n\n &__options {\n display: flex;\n gap: 24px;\n text-transform: uppercase;\n @include breakpoint(lg) {\n display: none;\n }\n }\n\n &__option {\n padding: 16px 0;\n font-weight: bold;\n text-decoration: underline;\n &--selected {\n color: var(--spw-ds-primary);\n text-decoration: none;\n }\n @include breakpoint(lg) {\n padding: 24px 0;\n }\n }\n\n &__dropdown {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n z-index: 99999;\n position: absolute;\n overflow: hidden;\n top: 100%;\n width: max-content;\n right: 0;\n background: white;\n border-radius: 4px;\n box-shadow: var(--spw-effect-elevation-8);\n }\n }\n}\n","import { Component, h, Host, Element, State } from '@stencil/core';\n\n@Component({\n tag: 'spw-header-lang',\n styleUrl: 'spw-header-lang.scss',\n shadow: true,\n})\nexport class SpwHeaderLang {\n @Element() el!: HTMLElement;\n @State() activeLang: string = '';\n @State() options: HTMLOptionElement[] = [];\n\n private selectEl!: HTMLSelectElement;\n\n componentWillLoad() {\n this.updateActiveLangFromDOM();\n }\n\n componentDidLoad() {\n this.moveOptionsToSelect();\n }\n\n private updateActiveLangFromDOM() {\n const selected = this.el.querySelector('option[selected]');\n this.activeLang = selected?.textContent?.trim() \|\| '';\n }\n\n private moveOptionsToSelect() {\n const lightDomOptions = Array.from(this.el.querySelectorAll('option'));\n this.options = lightDomOptions;\n\n lightDomOptions.forEach(option => {\n this.selectEl.appendChild(option);\n });\n }\n\n private handleChange(event: Event) {\n const target = event.target as HTMLSelectElement;\n const selectedOption = target.selectedOptions[0];\n this.setActiveLangAndRedirect(selectedOption);\n }\n\n private setActiveLangAndRedirect(option: HTMLOptionElement) {\n this.activeLang = option?.textContent?.trim() \|\| '';\n const link = option?.getAttribute('data-link');\n if (link) {\n window.location.href = link;\n }\n }\n\n private handleButtonKeyDown = (event: KeyboardEvent) => {\n if (event.key === ' ' \|\| event.key === 'Enter') {\n event.preventDefault();\n this.selectEl?.click();\n }\n };\n\n private handleButtonClick = () => {\n this.selectEl?.click();\n };\n\n private handleOptionClick = (option: HTMLOptionElement) => {\n this.setActiveLangAndRedirect(option);\n };\n\n render() {\n return (\n <Host>\n <div class=\"spw-header-lang\">\n <spw-button\n variant=\"tertiary\"\n surface=\"light\"\n icon=\"fa-chevron-down\"\n class=\"spw-header-lang__active-lang\"\n onKeyDown={this.handleButtonKeyDown}\n onClick={this.handleButtonClick}\n >\n {this.activeLang}\n </spw-button>\n\n <select class=\"spw-header-lang__select\" onChange={e => this.handleChange(e)} ref={el => (this.selectEl = el as HTMLSelectElement)} tabIndex={-1} />\n\n <ul class=\"spw-header-lang__options\">\n {this.options.map(option => {\n const label = option.textContent?.trim() \|\| '';\n const value = option.getAttribute('value') \|\| '';\n const isSelected = label === this.activeLang;\n return (\n <li class={{ 'spw-header-lang__option': true, 'spw-header-lang__option--selected': isSelected }} data-value={value} onClick={() => this.handleOptionClick(option)}>\n {label}\n </li>\n );\n })}\n </ul>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-header-lang.entry.cjs.js","sources":["src/components/spw-header/spw-header-lang/spw-header-lang.scss?tag=spw-header-lang&encapsulation=shadow","src/components/spw-header/spw-header-lang/spw-header-lang.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-header-lang {\n position: relative;\n @include under-breakpoint(lg) {\n margin-bottom: 0;\n }\n @include breakpoint(lg) {\n margin-left: 16px;\n }\n &:hover {\n .spw-header-lang__dropdown {\n @include breakpoint(lg) {\n display: block;\n }\n }\n }\n\n &__select {\n display: none;\n @include breakpoint(lg) {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n z-index: 2;\n }\n }\n\n &__active-lang {\n display: none;\n @include breakpoint(lg) {\n display: block;\n }\n }\n\n &__options {\n display: flex;\n gap: 24px;\n text-transform: uppercase;\n @include breakpoint(lg) {\n display: none;\n }\n }\n\n &__option {\n padding: ~~24px~~ 0;\n font-weight: bold;\n text-decoration: underline;\n &--selected {\n color: var(--spw-ds-primary);\n text-decoration: none;\n }\n }\n\n &__dropdown {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n z-index: 99999;\n position: absolute;\n overflow: hidden;\n top: 100%;\n width: max-content;\n right: 0;\n background: white;\n border-radius: 4px;\n box-shadow: var(--spw-effect-elevation-8);\n }\n }\n}\n","import { Component, h, Host, Element, State } from '@stencil/core';\n\n@Component({\n tag: 'spw-header-lang',\n styleUrl: 'spw-header-lang.scss',\n shadow: true,\n})\nexport class SpwHeaderLang {\n @Element() el!: HTMLElement;\n @State() activeLang: string = '';\n @State() options: HTMLOptionElement[] = [];\n\n private selectEl!: HTMLSelectElement;\n\n componentWillLoad() {\n this.updateActiveLangFromDOM();\n }\n\n componentDidLoad() {\n this.moveOptionsToSelect();\n }\n\n private updateActiveLangFromDOM() {\n const selected = this.el.querySelector('option[selected]');\n this.activeLang = selected?.textContent?.trim() \|\| '';\n }\n\n private moveOptionsToSelect() {\n const lightDomOptions = Array.from(this.el.querySelectorAll('option'));\n this.options = lightDomOptions;\n\n lightDomOptions.forEach(option => {\n this.selectEl.appendChild(option);\n });\n }\n\n private handleChange(event: Event) {\n const target = event.target as HTMLSelectElement;\n const selectedOption = target.selectedOptions[0];\n this.setActiveLangAndRedirect(selectedOption);\n }\n\n private setActiveLangAndRedirect(option: HTMLOptionElement) {\n this.activeLang = option?.textContent?.trim() \|\| '';\n const link = option?.getAttribute('data-link');\n if (link) {\n window.location.href = link;\n }\n }\n\n private handleButtonKeyDown = (event: KeyboardEvent) => {\n if (event.key === ' ' \|\| event.key === 'Enter') {\n event.preventDefault();\n this.selectEl?.click();\n }\n };\n\n private handleButtonClick = () => {\n this.selectEl?.click();\n };\n\n private handleOptionClick = (option: HTMLOptionElement) => {\n this.setActiveLangAndRedirect(option);\n };\n\n render() {\n return (\n <Host>\n <div class=\"spw-header-lang\">\n <spw-button\n variant=\"tertiary\"\n surface=\"light\"\n icon=\"fa-chevron-down\"\n class=\"spw-header-lang__active-lang\"\n onKeyDown={this.handleButtonKeyDown}\n onClick={this.handleButtonClick}\n >\n {this.activeLang}\n </spw-button>\n\n <select class=\"spw-header-lang__select\" onChange={e => this.handleChange(e)} ref={el => (this.selectEl = el as HTMLSelectElement)} tabIndex={-1} />\n\n <ul class=\"spw-header-lang__options\">\n {this.options.map(option => {\n const label = option.textContent?.trim() \|\| '';\n const value = option.getAttribute('value') \|\| '';\n const isSelected = label === this.activeLang;\n return (\n <li class={{ 'spw-header-lang__option': true, 'spw-header-lang__option--selected': isSelected }} data-value={value} onClick={() => this.handleOptionClick(option)}>\n {label}\n </li>\n );\n })}\n </ul>\n </div>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,gBAAgB,GAAG~~,4qHAA4qH~~;;~~MCOxrH~~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"}
1	+ {"version":3,"file":"spw-header-lang.entry.cjs.js","sources":["src/components/spw-header/spw-header-lang/spw-header-lang.scss?tag=spw-header-lang&encapsulation=shadow","src/components/spw-header/spw-header-lang/spw-header-lang.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-header-lang {\n position: relative;\n @include under-breakpoint(lg) {\n margin-bottom: 0;\n }\n @include breakpoint(lg) {\n margin-left: 16px;\n }\n &:hover {\n .spw-header-lang__dropdown {\n @include breakpoint(lg) {\n display: block;\n }\n }\n }\n\n &__select {\n display: none;\n @include breakpoint(lg) {\n display: block;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0;\n cursor: pointer;\n z-index: 2;\n }\n }\n\n &__active-lang {\n display: none;\n @include breakpoint(lg) {\n display: block;\n }\n }\n\n &__options {\n display: flex;\n gap: 24px;\n text-transform: uppercase;\n @include breakpoint(lg) {\n display: none;\n }\n }\n\n &__option {\n padding: 16px 0;\n font-weight: bold;\n text-decoration: underline;\n &--selected {\n color: var(--spw-ds-primary);\n text-decoration: none;\n }\n @include breakpoint(lg) {\n padding: 24px 0;\n }\n }\n\n &__dropdown {\n display: flex;\n @include breakpoint(lg) {\n display: none;\n z-index: 99999;\n position: absolute;\n overflow: hidden;\n top: 100%;\n width: max-content;\n right: 0;\n background: white;\n border-radius: 4px;\n box-shadow: var(--spw-effect-elevation-8);\n }\n }\n}\n","import { Component, h, Host, Element, State } from '@stencil/core';\n\n@Component({\n tag: 'spw-header-lang',\n styleUrl: 'spw-header-lang.scss',\n shadow: true,\n})\nexport class SpwHeaderLang {\n @Element() el!: HTMLElement;\n @State() activeLang: string = '';\n @State() options: HTMLOptionElement[] = [];\n\n private selectEl!: HTMLSelectElement;\n\n componentWillLoad() {\n this.updateActiveLangFromDOM();\n }\n\n componentDidLoad() {\n this.moveOptionsToSelect();\n }\n\n private updateActiveLangFromDOM() {\n const selected = this.el.querySelector('option[selected]');\n this.activeLang = selected?.textContent?.trim() \|\| '';\n }\n\n private moveOptionsToSelect() {\n const lightDomOptions = Array.from(this.el.querySelectorAll('option'));\n this.options = lightDomOptions;\n\n lightDomOptions.forEach(option => {\n this.selectEl.appendChild(option);\n });\n }\n\n private handleChange(event: Event) {\n const target = event.target as HTMLSelectElement;\n const selectedOption = target.selectedOptions[0];\n this.setActiveLangAndRedirect(selectedOption);\n }\n\n private setActiveLangAndRedirect(option: HTMLOptionElement) {\n this.activeLang = option?.textContent?.trim() \|\| '';\n const link = option?.getAttribute('data-link');\n if (link) {\n window.location.href = link;\n }\n }\n\n private handleButtonKeyDown = (event: KeyboardEvent) => {\n if (event.key === ' ' \|\| event.key === 'Enter') {\n event.preventDefault();\n this.selectEl?.click();\n }\n };\n\n private handleButtonClick = () => {\n this.selectEl?.click();\n };\n\n private handleOptionClick = (option: HTMLOptionElement) => {\n this.setActiveLangAndRedirect(option);\n };\n\n render() {\n return (\n <Host>\n <div class=\"spw-header-lang\">\n <spw-button\n variant=\"tertiary\"\n surface=\"light\"\n icon=\"fa-chevron-down\"\n class=\"spw-header-lang__active-lang\"\n onKeyDown={this.handleButtonKeyDown}\n onClick={this.handleButtonClick}\n >\n {this.activeLang}\n </spw-button>\n\n <select class=\"spw-header-lang__select\" onChange={e => this.handleChange(e)} ref={el => (this.selectEl = el as HTMLSelectElement)} tabIndex={-1} />\n\n <ul class=\"spw-header-lang__options\">\n {this.options.map(option => {\n const label = option.textContent?.trim() \|\| '';\n const value = option.getAttribute('value') \|\| '';\n const isSelected = label === this.activeLang;\n return (\n <li class={{ 'spw-header-lang__option': true, 'spw-header-lang__option--selected': isSelected }} data-value={value} onClick={() => this.handleOptionClick(option)}>\n {label}\n </li>\n );\n })}\n </ul>\n </div>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":"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"}

package/dist/cjs/spw-header-navigation-dropdown.cjs.entry.js CHANGED Viewed

@@ -2,14 +2,14 @@
 var index = require('./index-ivINMH9O.js');
-const spwHeaderNavigationDropdownCss = "/*! 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)}}";
+const spwHeaderNavigationDropdownCss = "/*! 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:1232px;--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)}}";
 const SpwHeaderNavigationDropdown = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '3f571a93cbeb495f421749d1be4059ce4c7f7ac1' }, index.h("slot", { key: '2865d81ea800fe6e611eded2dfbce4520ce4b760' })));
+        return (index.h(index.Host, { key: 'aafee21c703f86996f6f130b8e5fb4a604bdb33b' }, index.h("slot", { key: 'a851de370cbe755a2a87c66b5d31b89efabf6a0d' })));
     }
 };
 SpwHeaderNavigationDropdown.style = spwHeaderNavigationDropdownCss;

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

@@ -2,7 +2,7 @@
 var index = require('./index-ivINMH9O.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{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 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:1232px;--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:var(--spw-colors-support-grey-grey-900)!important;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(a:hover){text-decoration:none!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 = class {
     constructor(hostRef) {
@@ -131,7 +131,7 @@ const SpwHeaderNavigationItem = class {
             'spw-header-navigation-item--is-active': this.internalIsActive,
             'spw-header-navigation-item--is-subnav-visible': this.isSubnavVisible,
         };
-        return (index.h(index.Host, { key: '13ff7f97c29f2c015c919a0694843da4fd3bba5a', "data-level": this.level }, index.h("li", { key: 'f63388a5ddbecbae45d5f5a3e7c8465eabd9fe41', class: elementClass }, index.h("div", { key: '61a95d580aaa7d7e73e52f0511e53b49fc2d2084', class: "spw-header-navigation-item__content", onClick: event => this.toggleSubnavVisibility(event) }, this.isSubnavVisible && (index.h("div", { key: '8d0b46b303d3315da041ffa8a05824c61e294a3b', class: `spw-header-navigation-item__top spw-header-navigation-item__top--${this.level}` }, index.h("div", { key: '6af1d33af03f27b20b446bfbecc6f3461e7454a8', class: "spw-header-navigation-item__top-back", onClick: event => this.handleBackClick(event) }, index.h("spw-icon", { key: '712e1ed77a0a45793a3150d2084224279a58a0db', icon: "fa-chevron-left" }), " ", index.h("span", { key: 'b78bf26282b71867a25e35fbbf299a59ca01370b' }, this.level === 1 ? '' : this.level === 2 ? 'Menu principal' : storedTitle)), index.h("div", { key: 'cd670631c58f94b8bc633e0fb3e15fa0fc0b9d5c', class: "spw-header-navigation-item__top-title" }, index.h("a", { key: '3060cd58307f5217b2b78e93cae17c461ac30e79', href: (pageTitle === null || pageTitle === void 0 ? void 0 : pageTitle.link) || '#', target: (pageTitle === null || pageTitle === void 0 ? void 0 : pageTitle.target) || '_self' }, (pageTitle === null || pageTitle === void 0 ? void 0 : pageTitle.title) || '')))), index.h("slot", { key: '7f9bb1dcc0844cb363483c96255cac86cc01d953' })))));
+        return (index.h(index.Host, { key: 'dc75c4e5d8b03daec749fd2e860d982dd31a7327', "data-level": this.level }, index.h("li", { key: '0b32ac1fee2a1dec903c45c60d7958110ba6a937', class: elementClass }, index.h("div", { key: '54237b0754db4d1b03fefa9ad2df046f2e27fa93', class: "spw-header-navigation-item__content", onClick: event => this.toggleSubnavVisibility(event) }, this.isSubnavVisible && (index.h("div", { key: 'ed0e55bf8a185a616562ce02d9c9ccb855a27e65', class: `spw-header-navigation-item__top spw-header-navigation-item__top--${this.level}` }, index.h("div", { key: 'e649b67579f733a60c7c94f4bdfc454b964df837', class: "spw-header-navigation-item__top-back", onClick: event => this.handleBackClick(event) }, index.h("spw-icon", { key: 'b257c79de74068f9a92eb433ce1b71acb29bca02', icon: "fa-chevron-left" }), " ", index.h("span", { key: '14fccdb573b68afd2d0a385c022382b97e2a9721' }, this.level === 1 ? '' : this.level === 2 ? 'Menu principal' : storedTitle)), index.h("div", { key: 'bf92f63b2529b5c186d0d9121a7460a3f8136d86', class: "spw-header-navigation-item__top-title" }, index.h("a", { key: 'e862de9aef38d0cac90e9e224c747fca1a8bf972', href: (pageTitle === null || pageTitle === void 0 ? void 0 : pageTitle.link) || '#', target: (pageTitle === null || pageTitle === void 0 ? void 0 : pageTitle.target) || '_self' }, (pageTitle === null || pageTitle === void 0 ? void 0 : pageTitle.title) || '')))), index.h("slot", { key: 'b46dec07e72fd341cfcd599baa107bca12fd3339' })))));
     }
     get el() { return index.getElement(this); }
 };

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

	@@ -1 +1 @@
1	- {"file":"spw-header-navigation-item.entry.cjs.js","mappings":"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","names":["h","Host"],"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}
1	+ {"file":"spw-header-navigation-item.entry.cjs.js","mappings":"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","names":["h","Host"],"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: var(--spw-colors-support-grey-grey-900) !important;\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(a:hover) {\n text-decoration: none !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/cjs/spw-header-navigation-item.entry.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-header-navigation-item.entry.cjs.js","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"],"names":["h","Host"],"mappings":"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"}
1	+ {"version":3,"file":"spw-header-navigation-item.entry.cjs.js","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: var(--spw-colors-support-grey-grey-900) !important;\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(a:hover) {\n text-decoration: none !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"],"names":["h","Host"],"mappings":"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"}

package/dist/cjs/spw-header-navigation.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 var index = require('./index-ivINMH9O.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}.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 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:1232px;--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__extra-button-parent{border-top:1px solid var(--spw-colors-support-grey-grey-300);order:2;padding:16px}@media (min-width:1024px){.spw-header-navigation__extra-button{padding-left:32px}}.spw-header-navigation__extra-button--desktop{display:none}@media (min-width:1024px){.spw-header-navigation__extra-button--desktop{display:block}}.spw-header-navigation__extra-button--mobile{display:none}@media (max-width:1023px){:host(.spw-ds-nav-open) .spw-header-navigation__extra-button--mobile{display:block}}.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}}.spw-tw-flex{display:flex}.spw-tw-items-center{align-items:center}.spw-tw-justify-between{justify-content:space-between}";
 const SpwHeaderNavigation = class {
     constructor(hostRef) {
@@ -11,6 +11,12 @@ const SpwHeaderNavigation = class {
         this.element = null;
         /** Alignement des éléments de navigation sur desktop */
         this.alignment = 'flex-start';
+        /** Présence ou non d'un bouton à droite de la navigation */
+        this.extraButton = false;
+        /** Attribut target de l'extra button */
+        this.extraButtonTarget = '_self';
+        /** Variant de l'extra button */
+        this.extraButtonVariant = 'primary';
     }
     redirectToHome(event) {
         event.preventDefault();
@@ -51,7 +57,7 @@ const SpwHeaderNavigation = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: '459248b92d350ed90d6a7eea8c8f54f00bdcd7a9' }, index.h("nav", { key: '1b1ecf8d43196fa9f2497973fa206b81dafb2fb4', class: this.elementClass }, index.h("div", { key: 'b20863ec6cb6b6df2653e2929bbfca0184a6ede3', class: "spw-ds-container" }, index.h("ul", { key: '2a9a80aee3b9e7f8d65610ed06309ece10830af1', class: "spw-header-navigation__list" }, index.h("li", { key: '37d1a48ae75d696332a5c59d119b7f22b070eada', class: "spw-header-navigation__list-back" }, index.h("a", { key: '0009502fcf61127117fb82e0175cafb2fdc8395b', href: "#", onClick: event => this.redirectToHome(event) }, index.h("spw-icon", { key: '132c5fd53cdd84020b9392ba37588872db2a6281', icon: "fa-chevron-left" }), " ", index.h("span", { key: 'c5629d8f3bac317c623964e50fb92c9ddaed7540' }, "Page d'accueil"))), index.h("slot", { key: '876756c6685df1f120cb644524744f4736232133' }))))));
+        return (index.h(index.Host, { key: 'ff546561731260e1d53c1cc3fd5acbdcb6ecee55' }, index.h("nav", { key: '2a445bec0bb6427af85b1a56cd224457fb2d677e', class: this.elementClass }, index.h("div", { key: 'f7172f49be6534fadaa04fa3e4a5c127ad3fe885', class: "spw-ds-container spw-tw-flex spw-tw-items-center spw-tw-justify-between" }, index.h("ul", { key: '4acb37dc74d81f177744183e4ab64903b62eae9a', class: "spw-header-navigation__list" }, index.h("li", { key: 'abe0d28bd2fc98ba237fca6d30100a8da19d5301', class: "spw-header-navigation__list-back" }, index.h("a", { key: '6e145d99d2201b8015e8af496abc6e2970b0b7ad', href: "#", onClick: event => this.redirectToHome(event) }, index.h("spw-icon", { key: 'd321e4c1e65d61e029d0ba755a2cb63cd34cbbea', icon: "fa-chevron-left" }), " ", index.h("span", { key: '9ee0deadb4fd25b0aeaa82919756070e007be193' }, "Page d'accueil"))), index.h("slot", { key: 'd3fd3e945198999414f496576be2bba1ae9829d8' })), this.extraButton && (index.h("div", { key: 'fdaf57c8ee9c039a80c87799cbd6d4c78db88839', class: "spw-header-navigation__extra-button spw-header-navigation__extra-button--desktop" }, index.h("spw-button", { key: '75561647e90a0ffedfbbd3d93f1b36f812b2868a', variant: this.extraButtonVariant, icon: this.extraButtonIcon, href: this.extraButtonHref, target: this.extraButtonTarget, size: "small" }, this.extraButtonText))))), this.extraButton && (index.h("div", { key: 'b5f3ff8de3cf91f918b979e9cfff62455c14dc71', class: "spw-header-navigation__extra-button-parent spw-header-navigation__extra-button--mobile" }, index.h("div", { key: 'cb29eb562182d1cf8594793545c832b637e66c2f', class: "spw-ds-container" }, index.h("div", { key: '4fe2ddb346389b88ea842167486b291840cbb5bc', class: "spw-header-navigation__extra-button spw-header-navigation__extra-button--mobile" }, index.h("spw-button", { key: '9daa480739e81901e928bbdb9bb7bfa22954f459', "is-full-width": "true", variant: this.extraButtonVariant, icon: this.extraButtonIcon, href: this.extraButtonHref, target: this.extraButtonTarget, size: "small" }, this.extraButtonText)))))));
     }
 };
 SpwHeaderNavigation.style = spwHeaderNavigationCss;

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

	@@ -1 +1 @@
1	- {"file":"spw-header-navigation.entry.cjs.js","mappings":"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","names":["h","Host"],"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}
1	+ {"file":"spw-header-navigation.entry.cjs.js","mappings":"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","names":["h","Host"],"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 &__extra-button-parent {\n padding: 16px;\n order: 2;\n border-top: 1px solid var(--spw-colors-support-grey-grey-300);\n }\n &__extra-button {\n @include breakpoint(lg) {\n padding-left: 32px;\n }\n &--desktop {\n display: none;\n @include breakpoint(lg) {\n display: block;\n }\n }\n &--mobile {\n display: none;\n :host(.spw-ds-nav-open) & {\n @include under-breakpoint(lg) {\n display: block;\n }\n }\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 /* Présence ou non d'un bouton à droite de la navigation /\n @Prop() extraButton?: boolean = false;\n /* Spécifie le lien de l'extra button /\n @Prop() extraButtonHref?: string;\n /* Attribut target de l'extra button /\n @Prop() extraButtonTarget?: string = '_self';\n /* Texte de l'extra button /\n @Prop() extraButtonText?: string;\n /* Variant de l'extra button /\n @Prop() extraButtonVariant?: 'primary' \| 'secondary' = 'primary';\n /* Icône de l'extra button (référence font-awesome) */\n @Prop() extraButtonIcon?: string;\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 spw-tw-flex spw-tw-items-center spw-tw-justify-between\">\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 {this.extraButton && (\n <div class=\"spw-header-navigation__extra-button spw-header-navigation__extra-button--desktop\">\n <spw-button variant={this.extraButtonVariant} icon={this.extraButtonIcon} href={this.extraButtonHref} target={this.extraButtonTarget} size=\"small\">\n {this.extraButtonText}\n </spw-button>\n </div>\n )}\n </div>\n </nav>\n {this.extraButton && (\n <div class=\"spw-header-navigation__extra-button-parent spw-header-navigation__extra-button--mobile\">\n <div class=\"spw-ds-container\">\n <div class=\"spw-header-navigation__extra-button spw-header-navigation__extra-button--mobile\">\n <spw-button\n is-full-width=\"true\"\n variant={this.extraButtonVariant}\n icon={this.extraButtonIcon}\n href={this.extraButtonHref}\n target={this.extraButtonTarget}\n size=\"small\"\n >\n {this.extraButtonText}\n </spw-button>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-header-navigation.entry.cjs.js","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"],"names":["h","Host"],"mappings":"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"}
1	+ {"version":3,"file":"spw-header-navigation.entry.cjs.js","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 &__extra-button-parent {\n padding: 16px;\n order: 2;\n border-top: 1px solid var(--spw-colors-support-grey-grey-300);\n }\n &__extra-button {\n @include breakpoint(lg) {\n padding-left: 32px;\n }\n &--desktop {\n display: none;\n @include breakpoint(lg) {\n display: block;\n }\n }\n &--mobile {\n display: none;\n :host(.spw-ds-nav-open) & {\n @include under-breakpoint(lg) {\n display: block;\n }\n }\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 /* Présence ou non d'un bouton à droite de la navigation /\n @Prop() extraButton?: boolean = false;\n /* Spécifie le lien de l'extra button /\n @Prop() extraButtonHref?: string;\n /* Attribut target de l'extra button /\n @Prop() extraButtonTarget?: string = '_self';\n /* Texte de l'extra button /\n @Prop() extraButtonText?: string;\n /* Variant de l'extra button /\n @Prop() extraButtonVariant?: 'primary' \| 'secondary' = 'primary';\n /* Icône de l'extra button (référence font-awesome) */\n @Prop() extraButtonIcon?: string;\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 spw-tw-flex spw-tw-items-center spw-tw-justify-between\">\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 {this.extraButton && (\n <div class=\"spw-header-navigation__extra-button spw-header-navigation__extra-button--desktop\">\n <spw-button variant={this.extraButtonVariant} icon={this.extraButtonIcon} href={this.extraButtonHref} target={this.extraButtonTarget} size=\"small\">\n {this.extraButtonText}\n </spw-button>\n </div>\n )}\n </div>\n </nav>\n {this.extraButton && (\n <div class=\"spw-header-navigation__extra-button-parent spw-header-navigation__extra-button--mobile\">\n <div class=\"spw-ds-container\">\n <div class=\"spw-header-navigation__extra-button spw-header-navigation__extra-button--mobile\">\n <spw-button\n is-full-width=\"true\"\n variant={this.extraButtonVariant}\n icon={this.extraButtonIcon}\n href={this.extraButtonHref}\n target={this.extraButtonTarget}\n size=\"small\"\n >\n {this.extraButtonText}\n </spw-button>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":"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"}

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

@@ -2,7 +2,7 @@
 var index = require('./index-ivINMH9O.js');
-const spwHeaderPersonaItemCss = "/*! 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-header-persona-item{position:relative;transition:background .3s}@media (min-width:1024px){.spw-header-persona-item:hover{background:var(--spw-color-themes-grey-grey-200)}}.spw-header-persona-item ::slotted(a){color:var(--spw-colors-support-grey-grey-900);display:block;margin-top:6px;padding:4px 0}@media (min-width:1024px){.spw-header-persona-item ::slotted(a){display:block;padding:12px 24px;text-decoration:none!important;text-transform:none}}.spw-header-persona-item--active{display:none;font-weight:700}@media (min-width:1024px){.spw-header-persona-item--active{display:block}}@media (max-width:1023px){.spw-header-persona-item--active ::slotted(a){color:var(--spw-ds-primary)!important;text-decoration:none!important}}";
+const spwHeaderPersonaItemCss = "/*! 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:1232px;--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-persona-item{position:relative;transition:background .3s}@media (min-width:1024px){.spw-header-persona-item:hover{background:var(--spw-color-themes-grey-grey-200)}}.spw-header-persona-item ::slotted(a){color:var(--spw-colors-support-grey-grey-900);display:block;margin-top:6px;padding:4px 0}@media (min-width:1024px){.spw-header-persona-item ::slotted(a){display:block;padding:12px 24px;text-decoration:none!important;text-transform:none}}.spw-header-persona-item--active{display:none;font-weight:700}@media (min-width:1024px){.spw-header-persona-item--active{display:block}}@media (max-width:1023px){.spw-header-persona-item--active ::slotted(a){color:var(--spw-ds-primary)!important;text-decoration:none!important}}";
 const SpwHeaderPersonaItem = class {
     constructor(hostRef) {
@@ -10,7 +10,7 @@ const SpwHeaderPersonaItem = class {
         this.active = false;
     }
     render() {
-        return (index.h(index.Host, { key: '67cd2427f5e548403f2ce17902643b572e88b5e3' }, index.h("div", { key: 'fca93fb898034a1e99dcf94a745d645e9df5d713', class: { 'spw-header-persona-item': true, 'spw-header-persona-item--active': this.active } }, index.h("slot", { key: '518543d9ead4a1b56c121e93b3e2dd0655595306' }))));
+        return (index.h(index.Host, { key: '7c4452f4097bcd87134ba0662b4ef28aa52190d5' }, index.h("div", { key: 'f9bc552cbab068bde86e63272c44ee4771ed843e', class: { 'spw-header-persona-item': true, 'spw-header-persona-item--active': this.active } }, index.h("slot", { key: 'b7228ab08e77a421a3b54cd0e974b454cbb29090' }))));
     }
 };
 SpwHeaderPersonaItem.style = spwHeaderPersonaItemCss;