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

package/dist/collection/components/spw-group/spw-group.js

@@ -44,7 +44,7 @@ export class SpwGroup {
         };
     }
     render() {
-        return (h(Host, { key: 'c0561007fc65fdebba6f36680c77e1d0bb3b8c03' }, h("div", { key: 'db79633cf10038a861d4094e0a275a7494a0d2fc', class: this.groupClasses }, this.label && h("spw-field-label", { key: '5d3d288dd1411dbc55114206300934a762a21cb4', class: "spw-tw-mb-3", label: this.label, name: this.name, required: this.required }), h("div", { key: '979e44abdad37b94539fd583957284b84154eb7f', class: "spw-group__container" }, h("slot", { key: 'd2241284113fe7df22eb381707bc8468d94a5026', ref: el => (this.slotEl = el) })))));
+        return (h(Host, { key: '9731f79adb2295e094b35b61c273886d1fe8eebe' }, h("div", { key: '13741d449663ef6ab13e61812552c8b9b3aa2cbd', class: this.groupClasses }, this.label && h("spw-field-label", { key: 'f9b3876ed3537eb551ac3f16fd368a30a2e44926', class: "spw-tw-mb-3", label: this.label, name: this.name, required: this.required }), h("div", { key: 'c72569c4fb300caea6183cfae05f334875dfc09e', class: "spw-group__container" }, h("slot", { key: '44bb853320a59a8ce1295e0fdf06bd3c4df09c49', ref: el => (this.slotEl = el) })))));
     }
     static get is() { return "spw-group"; }
     static get originalStyleUrls() {

package/dist/collection/components/spw-header/spw-header-lang/spw-header-lang.js

@@ -50,7 +50,7 @@ export class SpwHeaderLang {
         }
     }
     render() {
-        return (h(Host, { key: '7d1b8336387a5b7120f85a566f81b73edc07124f' }, h("div", { key: '0c3eeb5f9d3c13bd0b1c90b11258ba66469d7505', class: "spw-header-lang" }, h("spw-button", { key: '26b840cad9810c27d86a7bfb70654460b39a872c', variant: "tertiary", surface: "light", icon: "fa-chevron-down", class: "spw-header-lang__active-lang", onKeyDown: this.handleButtonKeyDown, onClick: this.handleButtonClick }, this.activeLang), h("select", { key: '9175d76ee94ee35cc868cf187ef30f33484efe09', class: "spw-header-lang__select", onChange: e => this.handleChange(e), ref: el => (this.selectEl = el), tabIndex: -1 }), h("ul", { key: '3b8cdd2f665810541a012e0cfffdc8f0e73b121a', class: "spw-header-lang__options" }, this.options.map(option => {
+        return (h(Host, { key: 'df40430562c0c38ca0d083496eb3ab3bfc9f6d83' }, h("div", { key: '213318a6543812175b5ab415dd65a80c4250289e', class: "spw-header-lang" }, h("spw-button", { key: 'ec3767cb9a82d55597a4847011a7c649df0672d2', variant: "tertiary", surface: "light", icon: "fa-chevron-down", class: "spw-header-lang__active-lang", onKeyDown: this.handleButtonKeyDown, onClick: this.handleButtonClick }, this.activeLang), h("select", { key: '338f8ab58bff50bdae6ff699d46d2a15e22792dc', class: "spw-header-lang__select", onChange: e => this.handleChange(e), ref: el => (this.selectEl = el), tabIndex: -1 }), h("ul", { key: 'c989e6da353f1bac2461f66cf880d10a3c0641cd', class: "spw-header-lang__options" }, this.options.map(option => {
             var _a;
             const label = ((_a = option.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || '';
             const value = option.getAttribute('value') || '';

package/dist/collection/components/spw-header/spw-header-lang-item/spw-header-lang-item.js

@@ -4,7 +4,7 @@ export class SpwHeaderLangItem {
         this.active = false;
     }
     render() {
-        return (h(Host, { key: '461dbda395ebde01c88aad9f840441799e300d59' }, h("div", { key: '8771d72a0f0857f270585e76a8d447092191bf0c', class: { 'spw-header-lang-item': true, 'spw-header-lang-item--active': this.active } }, h("slot", { key: 'b370b899db4e30fa50d3015749e9627a95e8a124' }))));
+        return (h(Host, { key: 'd800f4a5ab1726a07ca2596410add0c58f0000e6' }, h("div", { key: 'ca3886060340284cef67090d73a972b6af00c4b6', class: { 'spw-header-lang-item': true, 'spw-header-lang-item--active': this.active } }, h("slot", { key: 'ac512b451be1352bedfc889117d3168511a4678b' }))));
     }
     static get is() { return "spw-header-lang-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-header/spw-header-navigation/spw-header-navigation.js

@@ -37,7 +37,7 @@ export class SpwHeaderNavigation {
         return allItems;
     }
     render() {
-        return (h(Host, { key: '48a2e07745a8e6e94a728d7e1e0b25113957ee0e' }, h("nav", { key: 'c6234774e3004de18d2118443af1c83619cce574', class: "spw-header-navigation" }, h("div", { key: '3d1fe0743c9d31d8f0b2f79a30122b970de534b5', class: "spw-ds-container" }, h("ul", { key: '335b216d2aca769fac4ab03997fd10ddbadbf7a8', class: "spw-header-navigation__list" }, h("li", { key: '3056e222036ad1c6af437fec669e4f6add4e0b87', class: "spw-header-navigation__list-back" }, h("a", { key: '038a9ec293e6c2aeabd1f6d5432c25c44d8b6aed', href: "#", onClick: event => this.redirectToHome(event) }, h("spw-icon", { key: 'dfe7c247315c9051814f1e7d72652f352c30fbee', icon: "fa-chevron-left" }), " ", h("span", { key: '9fb20087fba505bfe48dbc6f73909ca43bc5ac54' }, "Page d'accueil"))), h("slot", { key: '1dddea73a4901044a073e8f1e01d4e3fc04c5638' }))))));
+        return (h(Host, { key: 'fbb659c46a4f2020ff043a8ac15b432eabe788fd' }, h("nav", { key: '235ab2e873b91b51ce4657f0f9bca9f93a6c4f1f', class: "spw-header-navigation" }, h("div", { key: '4f9eb3b0aa07907d29a866df99c803874c2ae389', class: "spw-ds-container" }, h("ul", { key: 'bd6d5958529b16fc8b91b5f998f63912d164704a', class: "spw-header-navigation__list" }, h("li", { key: '68d5ca52774ddfecdf460ec58ab4b61a729cec61', class: "spw-header-navigation__list-back" }, h("a", { key: '9e317cd130a1918b37a6b7851030b2d070b477b5', href: "#", onClick: event => this.redirectToHome(event) }, h("spw-icon", { key: 'e3e041d4e79f28fa3f756b112618fdb77ecbd53a', icon: "fa-chevron-left" }), " ", h("span", { key: '9c51890d66cdf1239e187bb234e0e0e92ee86f7d' }, "Page d'accueil"))), h("slot", { key: 'cd919f0bb080b23d935b04e52713eb71006ce36b' }))))));
     }
     static get is() { return "spw-header-navigation"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-header/spw-header-navigation-dropdown/spw-header-navigation-dropdown.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class SpwHeaderNavigationDropdown {
     render() {
-        return (h(Host, { key: '03d798674d8f6936c8f47181aec0b4f2de130e88' }, h("slot", { key: 'b6b96831ffb19b9a8fbcd2895f011f649c6f7c6d' })));
+        return (h(Host, { key: '0750309524960bdc6409b7f3308bfa5c0a0f63eb' }, h("slot", { key: 'e0d299a85392eea8815a952fbeeedf7238bb898a' })));
     }
     static get is() { return "spw-header-navigation-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-header/spw-header-navigation-item/spw-header-navigation-item.js

@@ -124,7 +124,7 @@ export class SpwHeaderNavigationItem {
             'spw-header-navigation-item--is-active': this.internalIsActive,
             'spw-header-navigation-item--is-subnav-visible': this.isSubnavVisible,
         };
-        return (h(Host, { key: '737d62fc41dd46de2af5ec5b3853a18fbdb1ad37', "data-level": this.level }, h("li", { key: '12f879077820c2dc94bc0eedbcf7ee4027950c93', class: elementClass }, h("div", { key: 'b2f8f46faa629d4a046d04618c37343eb210cf8d', class: "spw-header-navigation-item__content", onClick: event => this.toggleSubnavVisibility(event) }, this.isSubnavVisible && (h("div", { key: 'dcfee7b746e1d2607d8ac2e8ba5ff98972a7e44d', class: `spw-header-navigation-item__top spw-header-navigation-item__top--${this.level}` }, h("div", { key: '141f83d5e3f8944f8e32b5f98c01f0171b198b9a', class: "spw-header-navigation-item__top-back", onClick: event => this.handleBackClick(event) }, h("spw-icon", { key: '7533d7b9f16c878267057c14ede30c5d75304fb7', icon: "fa-chevron-left" }), " ", h("span", { key: 'ea37ed43aa5316f198c778420ff3309d6217bcb4' }, this.level === 1 ? '' : this.level === 2 ? 'Menu principal' : storedTitle)), h("div", { key: 'e755d2667c2044acb91d53100c727f3e8d46f063', class: "spw-header-navigation-item__top-title" }, h("a", { key: '6082ef9b61f1e3207e1c1e436eea4d7a460da8ce', 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) || '')))), h("slot", { key: 'afa92e5f3a7724e91c79fe93a8199afabb7676dd' })))));
+        return (h(Host, { key: '99e22960a8623ff32fd3cb05dcf22cf5fcae86d8', "data-level": this.level }, h("li", { key: '4a93483ef7a15c7c286cdc2ead368787eec7e402', class: elementClass }, h("div", { key: '9c2fcd9c8aa35a197603be2ae4b5f20e4bc07460', class: "spw-header-navigation-item__content", onClick: event => this.toggleSubnavVisibility(event) }, this.isSubnavVisible && (h("div", { key: 'c48a9e0a758f4dc8d32784f6e64cbcff6026f3f9', class: `spw-header-navigation-item__top spw-header-navigation-item__top--${this.level}` }, h("div", { key: '332d772c77e37fd2d34763a8fb1c4daba3c0f209', class: "spw-header-navigation-item__top-back", onClick: event => this.handleBackClick(event) }, h("spw-icon", { key: '16c3aaf99745cf973ac94b44f3685465594a5f6a', icon: "fa-chevron-left" }), " ", h("span", { key: '4c0e3ef02b1d804177814d21b6713acc92c72ae8' }, this.level === 1 ? '' : this.level === 2 ? 'Menu principal' : storedTitle)), h("div", { key: 'ca137c976669140ce05b6499bdb35f356f441cf8', class: "spw-header-navigation-item__top-title" }, h("a", { key: '1e32b4bcd035b77196ba22c15a9cf33672f610f1', 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) || '')))), h("slot", { key: 'd80ed70c92771c873a58564e08881bc6e81517c4' })))));
     }
     static get is() { return "spw-header-navigation-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-header/spw-header-persona/spw-header-persona.js

@@ -1,6 +1,8 @@
 import { h, Host } from "@stencil/core";
 export class SpwHeaderPersona {
     constructor() {
+        /** Label pour le choix du persona (à appliquer sur spw-header-persona) */
+        this.personaLabel = 'Je suis :';
         this.activePersona = '';
         this.options = [];
         this.handleButtonClick = () => {
@@ -44,7 +46,7 @@ export class SpwHeaderPersona {
         }
     }
     render() {
-        return (h(Host, { key: 'c4e42b78edc7792da592dc76db7b726f83ea89ca' }, h("div", { key: 'ebed11f53209bd13eb8d3e8b09eb828c9ef83889', class: "spw-header-persona", onClick: this.handleButtonClick, onKeyDown: this.handleButtonKeyDown }, h("span", { key: '5b95259e04809c897c7f92e603b79111d48224c3', class: "spw-header-persona__label" }, "Je suis :"), h("div", { key: '681dc667123c02925f48b36821ee5df1cc4d3545', class: "spw-header-persona__active-persona" }, this.activePersona, " ", h("spw-icon", { key: '2ae50c51b190de14382ddaee62a8d246d056e8e2', icon: "fa-chevron-down" })), h("select", { key: '795ef4b2c1fe0ff2b901ed08d79ad9f485bfaf30', class: "spw-header-persona__select", ref: el => (this.selectEl = el), onChange: e => this.handleChange(e), tabIndex: -1 }))));
+        return (h(Host, { key: 'b78b96b4c0f36a7e3eeea53a8129f9cd75a2f5fc' }, h("div", { key: '4721edf723463cfd6901ff64b791c84b0e942a2f', class: "spw-header-persona", onClick: this.handleButtonClick, onKeyDown: this.handleButtonKeyDown }, h("span", { key: '475f28ae1209129f444515e6175f4a05b1f8d5c3', class: "spw-header-persona__label" }, this.personaLabel), h("div", { key: '7e349e6db91d6fb3256b50c8176bcb4bea5463e3', class: "spw-header-persona__active-persona" }, this.activePersona, " ", h("spw-icon", { key: '2219b7a1bcefbb5dbff8faf721fb6b5496628f5d', icon: "fa-chevron-down" })), h("select", { key: '4d1b0dfae5d17578031e11c8ccf44d8d7018b080', class: "spw-header-persona__select", ref: el => (this.selectEl = el), onChange: e => this.handleChange(e), tabIndex: -1 }))));
     }
     static get is() { return "spw-header-persona"; }
     static get encapsulation() { return "shadow"; }
@@ -58,6 +60,30 @@ export class SpwHeaderPersona {
             "$": ["spw-header-persona.css"]
         };
     }
+    static get properties() {
+        return {
+            "personaLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Label pour le choix du persona (\u00E0 appliquer sur spw-header-persona)"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "persona-label",
+                "reflect": false,
+                "defaultValue": "'Je suis :'"
+            }
+        };
+    }
     static get states() {
         return {
             "activePersona": {},

package/dist/collection/components/spw-header/spw-header-persona/spw-header-persona.js.map

@@ -1 +1 @@
-{"version":3,"file":"spw-header-persona.js","sourceRoot":"","sources":["../../../../src/components/spw-header/spw-header-persona/spw-header-persona.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAOnE,MAAM,OAAO,gBAAgB;IAL7B;QAOW,kBAAa,GAAW,EAAE,CAAC;QAC3B,YAAO,GAAwB,EAAE,CAAC;QAmCnC,sBAAiB,GAAG,GAAG,EAAE;;YAC/B,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,EAAE,CAAC;QACzB,CAAC,CAAC;QAEM,wBAAmB,GAAG,CAAC,KAAoB,EAAE,EAAE;;YACrD,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;gBAC/C,KAAK,CAAC,cAAc,EAAE,CAAC;gBACvB,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,EAAE,CAAC;YACzB,CAAC;QACH,CAAC,CAAC;KAeH;IAvDC,iBAAiB;QACf,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC3B,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAEO,iBAAiB;;QACvB,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;QAC3D,IAAI,CAAC,aAAa,GAAG,CAAA,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,WAAW,0CAAE,IAAI,EAAE,KAAI,EAAE,CAAC;IAC3D,CAAC;IAEO,mBAAmB;QACzB,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC;QACvE,IAAI,CAAC,OAAO,GAAG,eAAe,CAAC;QAC/B,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC/B,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;QACpC,CAAC,CAAC,CAAC;IACL,CAAC;IAEO,YAAY,CAAC,KAAY;;QAC/B,MAAM,MAAM,GAAG,KAAK,CAAC,MAA2B,CAAC;QACjD,MAAM,cAAc,GAAG,MAAM,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;QACjD,IAAI,CAAC,aAAa,GAAG,CAAA,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,WAAW,0CAAE,IAAI,EAAE,KAAI,EAAE,CAAC;QAC/D,MAAM,IAAI,GAAG,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,YAAY,CAAC,WAAW,CAAC,CAAC;QACvD,IAAI,IAAI,EAAE,CAAC;YACT,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC;QAC9B,CAAC;IACH,CAAC;IAaD,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EAAC,oBAAoB,EAAC,OAAO,EAAE,IAAI,CAAC,iBAAiB,EAAE,SAAS,EAAE,IAAI,CAAC,mBAAmB;gBAClG,6DAAM,KAAK,EAAC,2BAA2B,gBAAiB;gBACxD,4DAAK,KAAK,EAAC,oCAAoC;oBAC5C,IAAI,CAAC,aAAa;;oBAAE,iEAAU,IAAI,EAAC,iBAAiB,GAAY,CAC7D;gBACN,+DAAQ,KAAK,EAAC,4BAA4B,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAuB,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,GAAI,CAClJ,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Host, Element, State } from '@stencil/core';\n\n@Component({\n  tag: 'spw-header-persona',\n  styleUrl: 'spw-header-persona.scss',\n  shadow: true,\n})\nexport class SpwHeaderPersona {\n  @Element() el!: HTMLElement;\n  @State() activePersona: string = '';\n  @State() options: HTMLOptionElement[] = [];\n\n  private selectEl!: HTMLSelectElement;\n\n  componentWillLoad() {\n    this.setInitialPersona();\n  }\n\n  componentDidLoad() {\n    this.moveOptionsToSelect();\n  }\n\n  private setInitialPersona() {\n    const selected = this.el.querySelector('option[selected]');\n    this.activePersona = selected?.textContent?.trim() || '';\n  }\n\n  private moveOptionsToSelect() {\n    const lightDomOptions = Array.from(this.el.querySelectorAll('option'));\n    this.options = lightDomOptions;\n    lightDomOptions.forEach(option => {\n      this.selectEl.appendChild(option);\n    });\n  }\n\n  private handleChange(event: Event) {\n    const select = event.target as HTMLSelectElement;\n    const selectedOption = select.selectedOptions[0];\n    this.activePersona = selectedOption?.textContent?.trim() || '';\n    const link = selectedOption?.getAttribute('data-link');\n    if (link) {\n      window.location.href = link;\n    }\n  }\n\n  private handleButtonClick = () => {\n    this.selectEl?.click();\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  render() {\n    return (\n      <Host>\n        <div class=\"spw-header-persona\" onClick={this.handleButtonClick} onKeyDown={this.handleButtonKeyDown}>\n          <span class=\"spw-header-persona__label\">Je suis :</span>\n          <div class=\"spw-header-persona__active-persona\">\n            {this.activePersona} <spw-icon icon=\"fa-chevron-down\"></spw-icon>\n          </div>\n          <select class=\"spw-header-persona__select\" ref={el => (this.selectEl = el as HTMLSelectElement)} onChange={e => this.handleChange(e)} tabIndex={-1} />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"spw-header-persona.js","sourceRoot":"","sources":["../../../../src/components/spw-header/spw-header-persona/spw-header-persona.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Host, Element, State } from '@stencil/core';\n\n@Component({\n  tag: 'spw-header-persona',\n  styleUrl: 'spw-header-persona.scss',\n  shadow: true,\n})\nexport class SpwHeaderPersona {\n  /** Label pour le choix du persona (à appliquer sur spw-header-persona) */\n  @Prop() personaLabel?: string = 'Je suis :';\n\n  @Element() el!: HTMLElement;\n  @State() activePersona: string = '';\n  @State() options: HTMLOptionElement[] = [];\n\n  private selectEl!: HTMLSelectElement;\n\n  componentWillLoad() {\n    this.setInitialPersona();\n  }\n\n  componentDidLoad() {\n    this.moveOptionsToSelect();\n  }\n\n  private setInitialPersona() {\n    const selected = this.el.querySelector('option[selected]');\n    this.activePersona = selected?.textContent?.trim() || '';\n  }\n\n  private moveOptionsToSelect() {\n    const lightDomOptions = Array.from(this.el.querySelectorAll('option'));\n    this.options = lightDomOptions;\n    lightDomOptions.forEach(option => {\n      this.selectEl.appendChild(option);\n    });\n  }\n\n  private handleChange(event: Event) {\n    const select = event.target as HTMLSelectElement;\n    const selectedOption = select.selectedOptions[0];\n    this.activePersona = selectedOption?.textContent?.trim() || '';\n    const link = selectedOption?.getAttribute('data-link');\n    if (link) {\n      window.location.href = link;\n    }\n  }\n\n  private handleButtonClick = () => {\n    this.selectEl?.click();\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  render() {\n    return (\n      <Host>\n        <div class=\"spw-header-persona\" onClick={this.handleButtonClick} onKeyDown={this.handleButtonKeyDown}>\n          <span class=\"spw-header-persona__label\">{this.personaLabel}</span>\n          <div class=\"spw-header-persona__active-persona\">\n            {this.activePersona} <spw-icon icon=\"fa-chevron-down\"></spw-icon>\n          </div>\n          <select class=\"spw-header-persona__select\" ref={el => (this.selectEl = el as HTMLSelectElement)} onChange={e => this.handleChange(e)} tabIndex={-1} />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/spw-header/spw-header-persona-item/spw-header-persona-item.js

@@ -4,7 +4,7 @@ export class SpwHeaderPersonaItem {
         this.active = false;
     }
     render() {
-        return (h(Host, { key: 'fd456cc825960db66edd70c2de2e56a691b2cc0b' }, h("div", { key: '9378c1231ae3be430b04ce1576748b23b38eb478', class: { 'spw-header-persona-item': true, 'spw-header-persona-item--active': this.active } }, h("slot", { key: '9a48d769b690742f89ae2bff992ceaa20bb6c78d' }))));
+        return (h(Host, { key: 'eee572c064debd003a1820ffaecd91a11fccc2aa' }, h("div", { key: 'c7b51b61d0d53bd659febab0d448d950ebcf14d4', class: { 'spw-header-persona-item': true, 'spw-header-persona-item--active': this.active } }, h("slot", { key: 'b7342be2d08ea3b760c330c0a16b30e883642079' }))));
     }
     static get is() { return "spw-header-persona-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-header/spw-header.css

@@ -1,2 +1,2 @@
 
- /*! 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{border-bottom:1px solid var(--spw-colors-support-grey-grey-300);display:flex;flex-direction:column}:host(.spw-ds-nav-open) .spw-header,:host(.spw-ds-search-open) .spw-header{background:#fff;height:100%;left:0;max-width:100vw;overflow:hidden;position:fixed;top:0;width:100%;z-index:9999}@media (min-width:1024px){:host(.spw-ds-nav-open) .spw-header,:host(.spw-ds-search-open) .spw-header{height:auto;overflow:initial;position:relative;width:auto}}.spw-header__title{color:var(--spw-colors-support-grey-grey-900);font-family:Arial;font-size:30px;font-weight:700;letter-spacing:-1px;line-height:1.1;margin:0;position:relative;transition:all .2s linear}@media (min-width:1024px){.spw-header__title{display:block}}.spw-header__title a{color:inherit;font-family:inherit;text-decoration:none}.spw-header__title a:hover{opacity:.8;text-decoration:none}.spw-header__title a:active{opacity:.9}.spw-header__title-border{bottom:0;display:block;height:4px;left:0;position:absolute;width:100%}.spw-header__title-border--mobile{bottom:-20px;transform:translateY(-100%)}.spw-header__title--mobile{display:block}@media (min-width:1024px){.spw-header__title--mobile{display:none}}.spw-header__title--desktop{display:none}@media (min-width:1024px){.spw-header__title--desktop{display:block}}.spw-header__content{background:var(--spw-color-themes-grey-grey-100);border-top:1px solid var(--spw-color-themes-grey-grey-300);display:none;order:3}:host(.spw-ds-nav-open) .spw-header__content{display:flex}@media (min-width:1024px){.spw-header__content{background:#fff;border-top:none;display:flex;order:0}}.spw-header__content-items{flex-direction:column;justify-content:flex-start}@media (min-width:1024px){.spw-header__content-items{align-items:center;flex-direction:row;justify-content:space-between}.spw-header__content-left{align-items:center;display:flex}}.spw-header__persona{display:none}:host(.spw-ds-nav-open) .spw-header__persona{display:block}@media (min-width:1024px){.spw-header__persona{display:block;order:0}}.spw-header__mobile{display:block;padding:16px 0}@media (min-width:1024px){.spw-header__mobile{display:none}}.spw-header__logo{align-items:center;display:none;gap:24px;padding-bottom:20px;padding-top:20px;position:relative}@media (min-width:1024px){.spw-header__logo{display:flex}}.spw-header__top{background:var(--spw-colors-support-grey-grey-100);display:none;order:4;padding:0 16px 16px}:host(.spw-ds-nav-open) .spw-header__top{display:block}@media (min-width:1024px){.spw-header__top{display:block;order:0;padding:8px 16px}}.spw-header__top-content{flex-direction:column;justify-content:left}@media (max-width:1023px){.spw-header__top-content{margin-left:auto;margin-right:auto;max-width:var(--spw-ds-container-md);padding-left:16px;padding-right:16px}}@media (min-width:1024px){.spw-header__top-content{align-items:center;flex-direction:row;justify-content:space-between}}.spw-header__top-logo{display:none;transition:all .2s linear}@media (min-width:1024px){.spw-header__top-logo{display:flex}}.spw-header__top-logo:hover{opacity:.8}.spw-header__top-logo:active{opacity:.9}.spw-header__top-buttons{flex-direction:column;flex-wrap:wrap}.spw-header__top-buttons spw-button{width:100%}@media (min-width:1024px){.spw-header__top-buttons spw-button{width:auto}.spw-header__top-buttons{flex-direction:row}}.spw-header__top-buttons ::slotted([slot=user-space]){width:100%}@media (min-width:1024px){.spw-header__top-buttons ::slotted([slot=user-space]){width:auto}}.spw-header__top-button--desktop{display:none}@media (min-width:1024px){.spw-header__top-button--desktop{display:block}}.spw-header__top-button--mobile{display:block}@media (min-width:1024px){.spw-header__top-button--mobile{display:none}}.spw-header__right{display:flex}@media (min-width:1024px){.spw-header__right{justify-content:flex-end}}.spw-header__right a{color:var(--spw-colors-support-grey-grey-900);font-size:21px}.spw-header__right a:hover{opacity:.7}.spw-header__right a:active{opacity:.5}.spw-header__hamburger{align-items:center;border-radius:50%;color:var(--spw-colors-support-grey-grey-900);cursor:pointer;display:inline-flex;flex-direction:row;font-size:12px;height:40px;justify-content:center;margin-left:16px;min-width:40px;text-align:center;width:40px}.spw-header__hamburger spw-icon{font-size:20px}@media (min-width:1024px){.spw-header__hamburger{display:none}}.spw-header__search-button{--spw-button-px-medium:12px;display:none}@media (min-width:1024px){.spw-header__search-button{display:block}}.spw-header__search{background:var(--spw-colors-support-grey-grey-50);border-top:1px solid var(--spw-colors-support-grey-grey-300);display:none;padding:24px 0}:host(.spw-ds-search-open) .spw-header__search{display:flex;flex:1;order:3;position:relative}@media (min-width:1024px){:host(.spw-ds-search-open) .spw-header__search{display:block;padding-bottom:36px;position:absolute;top:100%;width:100%;z-index:999}}.spw-header__overlay{display:none}@media (min-width:1024px){:host(.spw-ds-search-open) .spw-header__overlay{background:rgba(0,0,0,.38);display:block;height:100%;left:0;position:fixed;top:0;width:100%;z-index:-1}}.spw-header__top-nav{display:none;gap:32px}@media (min-width:1024px){.spw-header__top-nav{display:flex}}.spw-header__top-nav a{color:var(--spw-colors-support-grey-grey-600);text-decoration:none}.spw-header__top-nav a:hover{text-decoration:underline}.spw-header__top-nav-current a{color:var(--spw-colors-support-grey-grey-900);font-weight:600;position:relative}.spw-header__top-nav-current a:after{background:var(--spw-ds-primary);border-radius:50%;content:"";height:6px;position:absolute;right:-9px;top:-2px;width:6px}.spw-tw-relative{position:relative}.spw-tw-flex{display:flex}.spw-tw-w-full{width:100%}.spw-tw-items-center{align-items:center}.spw-tw-justify-between{justify-content:space-between}.spw-tw-gap-x-2{column-gap:.5rem}.spw-tw-gap-y-2{row-gap:.5rem}.spw-tw-space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(1rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(1rem*var(--tw-space-x-reverse))}
+ /*! 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{border-bottom:1px solid var(--spw-colors-support-grey-grey-300);display:flex;flex-direction:column}:host(.spw-ds-nav-open) .spw-header,:host(.spw-ds-search-open) .spw-header{background:#fff;height:100%;left:0;max-width:100vw;overflow:hidden;position:fixed;top:0;width:100%;z-index:9999}@media (min-width:1024px){:host(.spw-ds-nav-open) .spw-header,:host(.spw-ds-search-open) .spw-header{height:auto;overflow:initial;position:relative;width:auto}}.spw-header__title{color:var(--spw-colors-support-grey-grey-900);font-family:Arial;font-size:22px;font-weight:700;letter-spacing:-1px;line-height:1.1;margin:0;position:relative;transition:all .2s linear}@media (min-width:1024px){.spw-header__title{display:block;font-size:30px}}.spw-header__title a{color:inherit;font-family:inherit;text-decoration:none}.spw-header__title a:hover{opacity:.8;text-decoration:none}.spw-header__title a:active{opacity:.9}.spw-header__title svg{min-width:36px}.spw-header__title-border{bottom:0;display:block;height:4px;left:0;position:absolute;width:100%}.spw-header__title-border--mobile{bottom:-20px;transform:translateY(-100%)}.spw-header__title--mobile{display:block}@media (min-width:1024px){.spw-header__title--mobile{display:none}}.spw-header__title--desktop{display:none}@media (min-width:1024px){.spw-header__title--desktop{display:block}}.spw-header__content{background:var(--spw-color-themes-grey-grey-100);border-top:1px solid var(--spw-color-themes-grey-grey-300);display:none;order:3}:host(.spw-ds-nav-open) .spw-header__content{display:flex}@media (min-width:1024px){.spw-header__content{background:#fff;border-top:none;display:flex;order:0}}.spw-header__content-items{flex-direction:column;justify-content:flex-start}@media (min-width:1024px){.spw-header__content-items{align-items:center;flex-direction:row;justify-content:space-between}.spw-header__content-left{align-items:center;display:flex}}.spw-header__persona{display:none}:host(.spw-ds-nav-open) .spw-header__persona{display:block}@media (min-width:1024px){.spw-header__persona{display:block;order:0}}.spw-header__mobile{display:block;padding:16px 0}@media (min-width:1024px){.spw-header__mobile{display:none}}.spw-header__logo{align-items:center;display:none;gap:24px;padding-bottom:20px;padding-top:20px;position:relative}@media (min-width:1024px){.spw-header__logo{display:flex}}.spw-header__top{background:var(--spw-colors-support-grey-grey-100);display:none;order:4;padding:0 16px 16px}:host(.spw-ds-nav-open) .spw-header__top{display:block}@media (min-width:1024px){.spw-header__top{display:block;order:0;padding:8px 16px}}.spw-header__top-content{flex-direction:column;justify-content:left}@media (max-width:1023px){.spw-header__top-content{margin-left:auto;margin-right:auto;max-width:var(--spw-ds-container-md);padding-left:16px;padding-right:16px}}@media (min-width:1024px){.spw-header__top-content{align-items:center;flex-direction:row;justify-content:space-between}}.spw-header__top-logo{display:none;transition:all .2s linear}@media (min-width:1024px){.spw-header__top-logo{display:flex}}.spw-header__top-logo:hover{opacity:.8}.spw-header__top-logo:active{opacity:.9}.spw-header__top-buttons{flex-direction:column;flex-wrap:wrap}.spw-header__top-buttons spw-button{width:100%}@media (min-width:1024px){.spw-header__top-buttons spw-button{width:auto}.spw-header__top-buttons{flex-direction:row}}.spw-header__top-buttons ::slotted([slot=user-space]){width:100%}@media (min-width:1024px){.spw-header__top-buttons ::slotted([slot=user-space]){width:auto}}.spw-header__top-button--desktop{display:none}@media (min-width:1024px){.spw-header__top-button--desktop{display:block}}.spw-header__top-button--mobile{display:block}@media (min-width:1024px){.spw-header__top-button--mobile{display:none}}.spw-header__right{display:flex}@media (min-width:1024px){.spw-header__right{justify-content:flex-end}}.spw-header__right a{color:var(--spw-colors-support-grey-grey-900);font-size:21px}.spw-header__right a:hover{opacity:.7}.spw-header__right a:active{opacity:.5}.spw-header__hamburger{align-items:center;border-radius:50%;color:var(--spw-colors-support-grey-grey-900);cursor:pointer;display:inline-flex;flex-direction:row;font-size:12px;height:40px;justify-content:center;margin-left:16px;min-width:40px;text-align:center;width:40px}.spw-header__hamburger spw-icon{font-size:20px}@media (min-width:1024px){.spw-header__hamburger{display:none}}.spw-header__search-button{--spw-button-px-medium:12px;display:none}@media (min-width:1024px){.spw-header__search-button{display:block}}.spw-header__search{background:var(--spw-colors-support-grey-grey-50);border-top:1px solid var(--spw-colors-support-grey-grey-300);display:none;padding:24px 0}:host(.spw-ds-search-open) .spw-header__search{display:flex;flex:1;order:3;position:relative}@media (min-width:1024px){:host(.spw-ds-search-open) .spw-header__search{display:block;padding-bottom:36px;position:absolute;top:100%;width:100%;z-index:999}}.spw-header__overlay{display:none}@media (min-width:1024px){:host(.spw-ds-search-open) .spw-header__overlay{background:rgba(0,0,0,.38);display:block;height:100%;left:0;position:fixed;top:0;width:100%;z-index:-1}}.spw-header__top-nav{display:none;gap:32px}@media (min-width:1024px){.spw-header__top-nav{display:flex}}.spw-header__top-nav a{color:var(--spw-colors-support-grey-grey-600);text-decoration:none}.spw-header__top-nav a:hover{text-decoration:underline}.spw-header__top-nav-current a{color:var(--spw-colors-support-grey-grey-900);font-weight:600;position:relative}.spw-header__top-nav-current a:after{background:var(--spw-ds-primary);border-radius:50%;content:"";height:6px;position:absolute;right:-9px;top:-2px;width:6px}.spw-tw-relative{position:relative}.spw-tw-flex{display:flex}.spw-tw-w-full{width:100%}.spw-tw-items-center{align-items:center}.spw-tw-justify-between{justify-content:space-between}.spw-tw-gap-x-2{column-gap:.5rem}.spw-tw-gap-y-2{row-gap:.5rem}.spw-tw-space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(1rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(1rem*var(--tw-space-x-reverse))}