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

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

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

Files changed (658) hide show

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

	@@ -1 +1 @@
1	- {"file":"spw-tabs-navigation-item.js","mappings":";;AAAA,MAAM,wBAAwB,GAAG,mrJAAmrJ;;MCOvsJA,uBAAqB,iBAAAC,kBAAA,CAAA,MAAA,qBAAA,SAAAC,CAAA,CAAA;AALlC,IAAA,WAAA,GAAA;;;;;;AAWU,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;;AAEvB,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;;AAEzB,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;AAItB,QAAA,IAAQ,CAAA,QAAA,GAAW,EAAE;AA2BtB,QAAA,IAAA,CAAA,WAAW,GAAG,CAAC,KAAY,KAAI;YACrC,KAAK,CAAC,cAAc,EAAE;YACtB,KAAK,CAAC,eAAe,EAAE;AAEvB,YAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;gBAClB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;;AAErC,SAAC;AAEO,QAAA,IAAA,CAAA,aAAa,GAAG,CAAC,KAAoB,KAAI;YAC/C,IAAI,IAAI,CAAC,QAAQ;gBAAE;AAEnB,YAAA,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG;YACrB,IAAI,GAAG,KAAK,OAAO,IAAI,GAAG,KAAK,GAAG,EAAE;gBAClC,KAAK,CAAC,cAAc,EAAE;gBACtB,KAAK,CAAC,eAAe,EAAE;gBACvB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC;;AAErC,SAAC;AAkCF;IA3EC,gBAAgB,GAAA;QACd,IAAI,CAAC,cAAc,EAAE;;IAIvB,gBAAgB,GAAA;QACd,IAAI,CAAC,cAAc,EAAE;;IAGf,cAAc,GAAA;;AACpB,QAAA,MAAM,IAAI,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,EAAE,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,MAAM,CAAC;QACtD,IAAI,IAAI,EAAE;AACR,YAAA,MAAM,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;YAC3D,MAAM,IAAI,GAAG;iBACV,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,KAAK,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY;AAC7E,iBAAA,GAAG,CAAC,CAAC,IAAG,UAAC,OAAA,CAAA,EAAA,GAAC,CAAwB,CAAC,WAAW,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAI,EAAE,CAAA,EAAA;iBACtD,IAAI,CAAC,GAAG;AACR,iBAAA,IAAI,EAAE;AAET,YAAA,IAAI,CAAC,QAAQ,GAAG,IAAI,IAAI,EAAE;;;AAwB9B,IAAA,IAAY,YAAY,GAAA;QACtB,OAAO;AACL,YAAA,0BAA0B,EAAE,IAAI;YAChC,kCAAkC,EAAE,IAAI,CAAC,MAAM;YAC/C,oCAAoC,EAAE,IAAI,CAAC,QAAQ;YACnD,kCAAkC,EAAE,IAAI,CAAC,MAAM;YAC/C,oCAAoC,EAAE,IAAI,CAAC,WAAW;SACvD;;IAGH,MAAM,GAAA;AACJ,QAAA,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,MAAM,GAAG,UAAU,GAAG,EAAE,EAAA,EACxC,CACE,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAE,CAAO,IAAA,EAAA,IAAI,CAAC,KAAK,CAAA,CAAE,EACvB,IAAI,EAAC,KAAK,EACK,eAAA,EAAA,IAAI,CAAC,MAAM,GAAG,MAAM,GAAG,OAAO,EAC9B,eAAA,EAAA,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,EAChC,eAAA,EAAA,SAAS,IAAI,CAAC,KAAK,CAAE,CAAA,EACxB,YAAA,EAAA,IAAI,CAAC,QAAQ,EACzB,SAAS,EAAE,IAAI,CAAC,aAAa,EAC7B,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,EAAE,GAAG,CAAC,EAChC,KAAK,EAAE,IAAI,CAAC,YAAY,EACxB,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,KAAK,EAAE,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,QAAQ,GAAG,SAAS,EAAA,EAEnD,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,EACZ,IAAI,CAAC,MAAM,IAAI,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,QAAQ,EAAQ,CAAA,CACzC,CACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["SpwTabsNavigationItem","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-tabs/spw-tabs-navigation-item/spw-tabs-navigation-item.scss?tag=spw-tabs-navigation-item&encapsulation=shadow","src/components/spw-tabs/spw-tabs-navigation-item/spw-tabs-navigation-item.tsx"],"sourcesContent":[":host {\n display: contents;\n --spw-tabs-max-width-text: 200px;\n --spw-tabs-border-radius: 4px 4px 0 0;\n --spw-tabs-margin-left: 0;\n}\n\n.spw-tabs-navigation-item {\n position: relative;\n cursor: pointer;\n padding: 8px 0 12px 0;\n font-size: 14px;\n color: var(--spw-colors-support-grey-grey-700);\n user-select: none;\n transition: color 0.2s linear;\n &:hover {\n color: var(--spw-colors-support-grey-grey-900);\n :host(.--box) & {\n color: var(--spw-colors-support-grey-grey-900);\n }\n }\n &:focus-visible {\n outline: 2px solid black;\n outline-offset: -2px;\n }\n :host(.--box) & {\n background: var(--spw-colors-support-grey-grey-100);\n color: var(--spw-colors-support-grey-grey-600);\n border: 1px solid var(--spw-colors-support-grey-grey-300);\n padding: 7px 16px 6px 16px;\n margin-top: 3px;\n border-radius: var(--spw-tabs-border-radius);\n margin-left: var(--spw-tabs-margin-left);\n }\n &--disabled {\n opacity: 0.6;\n cursor: not-allowed;\n &:hover {\n color: var(--spw-colors-support-grey-grey-700);\n }\n :host(.--box) & {\n opacity: 1;\n color: var(--spw-colors-support-grey-grey-400);\n &:hover {\n color: var(--spw-colors-support-grey-grey-400);\n }\n &:active {\n transform: none;\n }\n }\n }\n &--active {\n color: var(--spw-colors-support-grey-grey-900);\n &:after {\n content: '';\n position: absolute;\n width: 100%;\n bottom: 0;\n left: 0;\n height: 2px;\n background: var(--spw-ds-primary);\n }\n :host(.--box) & {\n color: var(--spw-colors-support-grey-grey-900);\n background: white;\n border-bottom-color: transparent;\n padding: 8px 16px;\n margin-top: 0;\n &:after {\n display: none;\n }\n }\n }\n &--bubble {\n &:before {\n content: '';\n position: absolute;\n top: 2px;\n right: -8px;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: var(--spw-ds-primary);\n :host(.--box) & {\n top: 4px;\n right: 4px;\n }\n }\n }\n :host(.--ellipsis) & {\n max-width: var(--spw-tabs-max-width-text);\n overflow: hidden;\n text-overflow: ellipsis;\n }\n}\n","import { Component, h, Element, Prop, Event, State, EventEmitter, Host, Listen } from '@stencil/core';\n\n@Component({\n tag: 'spw-tabs-navigation-item',\n styleUrl: 'spw-tabs-navigation-item.scss',\n shadow: true,\n})\nexport class SpwTabsNavigationItem {\n @Element() el: HTMLElement;\n\n /** Définit un id pour le tab /\n @Prop() tabId!: string;\n /* Définit si le tab est actif ou non /\n @Prop() active: boolean = false;\n /* Définit si le tab est disabled ou non /\n @Prop() disabled: boolean = false;\n /* Prévoit la présence d'une pastille sur l'élément de navigation /\n @Prop() bubble: boolean = false;\n /* Définit si le texte doit être coupé pour les onglets au titre trop long */\n @Prop() hasEllipsis?: boolean;\n\n @State() slotText: string = '';\n\n @Event() tabSelected: EventEmitter<string>;\n\n componentDidLoad() {\n this.updateSlotText();\n }\n\n @Listen('slotchange')\n handleSlotChange() {\n this.updateSlotText();\n }\n\n private updateSlotText() {\n const slot = this.el.shadowRoot?.querySelector('slot');\n if (slot) {\n const assignedNodes = slot.assignedNodes({ flatten: true });\n const text = assignedNodes\n .filter(n => n.nodeType === Node.TEXT_NODE \|\| n.nodeType === Node.ELEMENT_NODE)\n .map(n => (n as HTMLElement \| Text).textContent?.trim())\n .join(' ')\n .trim();\n\n this.slotText = text \|\| '';\n }\n }\n\n private handleClick = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n\n if (!this.disabled) {\n this.tabSelected.emit(this.tabId);\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (this.disabled) return;\n\n const key = event.key;\n if (key === 'Enter' \|\| key === ' ') {\n event.preventDefault();\n event.stopPropagation();\n this.tabSelected.emit(this.tabId);\n }\n };\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-tabs-navigation-item': true,\n 'spw-tabs-navigation-item--active': this.active,\n 'spw-tabs-navigation-item--disabled': this.disabled,\n 'spw-tabs-navigation-item--bubble': this.bubble,\n 'spw-tabs-navigation-item--ellipsis': this.hasEllipsis,\n };\n }\n\n render() {\n return (\n <Host class={this.active ? '--active' : ''}>\n <li\n id={`tab-${this.tabId}`}\n role=\"tab\"\n aria-selected={this.active ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : 'false'}\n aria-controls={`panel-${this.tabId}`}\n aria-label={this.slotText}\n onKeyDown={this.handleKeyDown}\n tabIndex={this.disabled ? -1 : 0}\n class={this.elementClass}\n onClick={this.handleClick}\n title={this.hasEllipsis ? this.slotText : undefined}\n >\n <slot></slot>\n {this.bubble && <span class=\"bubble\"></span>}\n </li>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-tabs-navigation-item.js","mappings":"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","names":["SpwTabsNavigationItem","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-tabs/spw-tabs-navigation-item/spw-tabs-navigation-item.scss?tag=spw-tabs-navigation-item&encapsulation=shadow","src/components/spw-tabs/spw-tabs-navigation-item/spw-tabs-navigation-item.tsx"],"sourcesContent":[":host {\n display: contents;\n --spw-tabs-max-width-text: 200px;\n --spw-tabs-border-radius: 4px 4px 0 0;\n --spw-tabs-margin-left: 0;\n}\n\n.spw-tabs-navigation-item {\n position: relative;\n cursor: pointer;\n color: var(--spw-colors-support-grey-grey-700);\n user-select: none;\n transition: color 0.2s linear;\n &:hover {\n color: var(--spw-colors-support-grey-grey-900);\n :host(.--box) & {\n color: var(--spw-colors-support-grey-grey-900);\n }\n }\n &:focus-visible {\n outline: 2px solid black;\n outline-offset: -2px;\n }\n :host(.--box) & {\n background: var(--spw-colors-support-grey-grey-100);\n color: var(--spw-colors-support-grey-grey-600);\n border: 1px solid var(--spw-colors-support-grey-grey-300);\n margin-top: 3px;\n border-radius: var(--spw-tabs-border-radius);\n margin-left: var(--spw-tabs-margin-left);\n }\n &--disabled {\n opacity: 0.6;\n cursor: not-allowed;\n &:hover {\n color: var(--spw-colors-support-grey-grey-700);\n }\n :host(.--box) & {\n opacity: 1;\n color: var(--spw-colors-support-grey-grey-400);\n &:hover {\n color: var(--spw-colors-support-grey-grey-400);\n }\n &:active {\n transform: none;\n }\n }\n }\n &--active {\n border-bottom: 0;\n color: var(--spw-colors-support-grey-grey-900);\n &:after {\n content: '';\n position: absolute;\n width: 100%;\n bottom: 0;\n left: 0;\n height: 2px;\n background: var(--spw-ds-primary);\n }\n :host(.--box) & {\n position: relative;\n top: 1px;\n color: var(--spw-colors-support-grey-grey-900);\n background: white;\n // border-bottom-color: transparent;\n margin-top: 0;\n &:after {\n display: none;\n }\n }\n }\n &--bubble {\n &:before {\n content: '';\n position: absolute;\n top: 2px;\n right: -8px;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background: var(--spw-ds-primary);\n :host(.--box) & {\n top: 4px;\n right: 4px;\n }\n }\n }\n :host(.--ellipsis) & {\n max-width: var(--spw-tabs-max-width-text);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n flex-shrink: 0;\n spw-tooltip {\n display: contents;\n }\n }\n :host(.--small) & {\n padding: 8px 0 12px 0;\n font-size: 14px;\n }\n :host(.--small.--box) & {\n padding: 7px 16px 6px 16px;\n .spw-tabs-navigation-item--active {\n padding: 8px 16px;\n }\n }\n :host(.--medium) & {\n padding: 12px 0 16px 0;\n font-size: 16px;\n }\n :host(.--medium.--box) & {\n padding: 11px 16px 10px 16px;\n .spw-tabs-navigation-item--active {\n padding: 12px 16px;\n }\n }\n :host(.--large) & {\n padding: 16px 0 20px 0;\n font-size: 18px;\n }\n :host(.--large.--box) & {\n padding: 15px 20px 14px 20px;\n .spw-tabs-navigation-item--active {\n padding: 16px 20px;\n }\n }\n .spw-icon {\n &--left {\n margin-right: 4px;\n }\n &--right {\n margin-left: 4px;\n }\n }\n}\n","import { Component, h, Fragment, Element, Prop, Event, State, EventEmitter, Host, Listen } from '@stencil/core';\n\n@Component({\n tag: 'spw-tabs-navigation-item',\n styleUrl: 'spw-tabs-navigation-item.scss',\n shadow: true,\n})\nexport class SpwTabsNavigationItem {\n @Element() el: HTMLElement;\n\n /** Définit un id pour le tab /\n @Prop() tabId!: string;\n /* Définit si le tab est actif ou non /\n @Prop() active: boolean = false;\n /* Définit si le tab est disabled ou non /\n @Prop() disabled: boolean = false;\n /* Prévoit la présence d'une pastille sur l'élément de navigation /\n @Prop() bubble: boolean = false;\n /* Définit si le texte doit être coupé pour les onglets au titre trop long /\n @Prop() hasEllipsis?: boolean;\n /* Si rempli, vous pouvez utiliser une référence d'icône font-awesome sur le spw-tabs-navigation-item /\n @Prop() icon?: string;\n /* Position de l'icône à l'intérieur du bouton sur le spw-tabs-navigation-item */\n @Prop() iconPosition?: 'left' \| 'right';\n\n @State() slotText: string = '';\n\n @Event() tabSelected: EventEmitter<string>;\n\n componentDidLoad() {\n this.updateSlotText();\n }\n\n @Listen('slotchange')\n handleSlotChange() {\n this.updateSlotText();\n }\n\n private updateSlotText() {\n const slot = this.el.shadowRoot?.querySelector('slot');\n if (slot) {\n const assignedNodes = slot.assignedNodes({ flatten: true });\n const text = assignedNodes\n .filter(n => n.nodeType === Node.TEXT_NODE \|\| n.nodeType === Node.ELEMENT_NODE)\n .map(n => (n as HTMLElement \| Text).textContent?.trim())\n .join(' ')\n .trim();\n\n this.slotText = text \|\| '';\n }\n }\n\n private handleClick = (event: Event) => {\n event.preventDefault();\n event.stopPropagation();\n\n if (!this.disabled) {\n this.tabSelected.emit(this.tabId);\n }\n };\n\n private handleKeyDown = (event: KeyboardEvent) => {\n if (this.disabled) return;\n\n const key = event.key;\n if (key === 'Enter' \|\| key === ' ') {\n event.preventDefault();\n event.stopPropagation();\n this.tabSelected.emit(this.tabId);\n }\n };\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-tabs-navigation-item': true,\n 'spw-tabs-navigation-item--active': this.active,\n 'spw-tabs-navigation-item--disabled': this.disabled,\n 'spw-tabs-navigation-item--bubble': this.bubble,\n 'spw-tabs-navigation-item--ellipsis': this.hasEllipsis,\n };\n }\n\n render() {\n const iconPosition = this.icon && !this.iconPosition ? 'right' : this.iconPosition;\n const iconClass = `spw-icon--${iconPosition}`;\n const iconElement = this.icon ? <spw-icon class={iconClass} icon={this.icon}></spw-icon> : null;\n\n return (\n <Host class={this.active ? '--active' : ''}>\n <li\n id={`tab-${this.tabId}`}\n role=\"tab\"\n aria-selected={this.active ? 'true' : 'false'}\n aria-disabled={this.disabled ? 'true' : 'false'}\n aria-controls={`panel-${this.tabId}`}\n aria-label={this.slotText}\n onKeyDown={this.handleKeyDown}\n tabIndex={this.disabled ? -1 : 0}\n class={this.elementClass}\n onClick={this.handleClick}\n >\n {this.hasEllipsis && (\n <spw-tooltip cursor={this.disabled ? 'disabled' : 'pointer'} class=\"spw-tooltip--has-ellipsis\" tooltipText={this.slotText}>\n {iconPosition === 'left' && iconElement}\n <slot></slot>\n {iconPosition === 'right' && iconElement}\n </spw-tooltip>\n )}\n {!this.hasEllipsis && (\n <Fragment>\n {iconPosition === 'left' && iconElement}\n <slot></slot>\n {iconPosition === 'right' && iconElement}\n </Fragment>\n )}{' '}\n {this.bubble && <span class=\"bubble\"></span>}\n </li>\n </Host>\n );\n }\n}\n"],"version":3}

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

@@ -1,29 +1,120 @@
 import { p as proxyCustomElement, H, h } from './index.js';
+import { d as defineCustomElement$2 } from './p-_q4w18VU.js';
-const spwTabsNavigationCss = "/*! 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-tabs-navigation__list{border-bottom:1px solid var(--spw-colors-support-grey-grey-300);display:flex;flex-wrap:nowrap;gap:24px;overflow-x:auto;position:relative;white-space:nowrap;z-index:2}:host(.--box) .spw-tabs-navigation__list{border-bottom:0;gap:0;top:1px}::slotted(spw-tabs-navigation-item){--spw-tabs-border-radius:0;--spw-tabs-margin-left:-1px}::slotted(spw-tabs-navigation-item:first-child){--spw-tabs-border-radius:4px 0 0 0;--spw-tabs-margin-left:0}::slotted(spw-tabs-navigation-item:last-child){--spw-tabs-border-radius:0 4px 0 0;--spw-tabs-margin-left:-1px}::slotted(spw-tabs-navigation-item.--active){--spw-tabs-border-radius:4px 4px 0 0}";
+const spwTabsNavigationCss = "/*! 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;position:relative;top:1px}: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-tabs-navigation-container{align-items:center;display:flex;overflow:hidden;position:relative;width:100%}.spw-tabs-navigation{flex:1;overflow:hidden}.spw-tabs-navigation__list{-ms-overflow-style:none;border-bottom:1px solid var(--spw-colors-support-grey-grey-300);display:flex;flex-wrap:nowrap;gap:24px;list-style:none;margin:0;overflow-x:auto;padding:0;position:relative;scroll-behavior:smooth;scrollbar-width:none;white-space:nowrap;z-index:2}.spw-tabs-navigation__list::-webkit-scrollbar{display:none}:host(.--box) .spw-tabs-navigation__list{border-bottom:0;gap:0}.spw-tabs-navigation__arrow{align-items:center;background:#fff;border:none;cursor:pointer;display:flex;height:33px;justify-content:center;position:relative;top:1px;transition:all .2s ease;width:33px;z-index:10}.spw-tabs-navigation__arrow spw-icon{color:var(--spw-colors-support-grey-grey-500);font-size:14px}.spw-tabs-navigation__arrow:hover spw-icon{color:var(--spw-colors-support-grey-grey-600)}.spw-tabs-navigation__arrow:active spw-icon{color:var(--spw-colors-support-grey-grey-900)}.spw-tabs-navigation__arrow--left{border-radius:4px 0 0 0;border-right:1px solid var(--spw-colors-support-grey-grey-300)}.spw-tabs-navigation__arrow--right{border-left:1px solid var(--spw-colors-support-grey-grey-300);border-radius:0 4px 0 0}::slotted(spw-tabs-navigation-item){--spw-tabs-border-radius:0;--spw-tabs-margin-left:-1px}::slotted(spw-tabs-navigation-item:first-child){--spw-tabs-border-radius:4px 0 0 0;--spw-tabs-margin-left:0}::slotted(spw-tabs-navigation-item:last-child){--spw-tabs-border-radius:0 4px 0 0;--spw-tabs-margin-left:-1px}::slotted(spw-tabs-navigation-item.--active){--spw-tabs-border-radius:4px 4px 0 0}";
 const SpwTabsNavigation$1 = /*@__PURE__*/ proxyCustomElement(class SpwTabsNavigation extends H {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
+        this.showLeftArrow = false;
+        this.showRightArrow = false;
+        this.scrollPercentage = 30;
+        this.resizeObserver = null;
+        this.mutationObserver = null;
+        this.setupObservers = () => {
+            this.resizeObserver = new ResizeObserver(() => {
+                this.checkOverflow();
+            });
+            if (this.ulElement) {
+                this.resizeObserver.observe(this.ulElement);
+            }
+            this.mutationObserver = new MutationObserver(() => {
+                this.updateSlottedElementsObservation();
+                setTimeout(() => this.checkOverflow(), 10);
+            });
+            this.mutationObserver.observe(this.hostElement, {
+                childList: true,
+                subtree: true,
+            });
+            this.updateSlottedElementsObservation();
+        };
+        this.updateSlottedElementsObservation = () => {
+            if (!this.resizeObserver)
+                return;
+            const children = Array.from(this.hostElement.children);
+            children.forEach(child => {
+                this.resizeObserver.observe(child);
+            });
+        };
+        this.cleanupObservers = () => {
+            if (this.resizeObserver) {
+                this.resizeObserver.disconnect();
+                this.resizeObserver = null;
+            }
+            if (this.mutationObserver) {
+                this.mutationObserver.disconnect();
+                this.mutationObserver = null;
+            }
+        };
+        this.checkOverflow = () => {
+            if (!this.ulElement)
+                return;
+            const containerWidth = this.ulElement.clientWidth;
+            const contentWidth = this.ulElement.scrollWidth;
+            const scrollLeft = this.ulElement.scrollLeft;
+            const hasOverflow = contentWidth > containerWidth;
+            this.showLeftArrow = hasOverflow && scrollLeft > 0;
+            this.showRightArrow = hasOverflow && scrollLeft < contentWidth - containerWidth - 1;
+        };
+        this.scrollLeft = () => {
+            if (!this.ulElement)
+                return;
+            const scrollAmount = (this.ulElement.clientWidth * this.scrollPercentage) / 100;
+            this.ulElement.scrollBy({
+                left: -scrollAmount,
+                behavior: 'smooth',
+            });
+        };
+        this.scrollRight = () => {
+            if (!this.ulElement)
+                return;
+            const scrollAmount = (this.ulElement.clientWidth * this.scrollPercentage) / 100;
+            this.ulElement.scrollBy({
+                left: scrollAmount,
+                behavior: 'smooth',
+            });
+        };
+        this.handleScroll = () => {
+            this.checkOverflow();
+        };
+    }
+    componentDidLoad() {
+        this.checkOverflow();
+        this.setupObservers();
+    }
+    disconnectedCallback() {
+        this.cleanupObservers();
+    }
+    onWindowResize() {
+        this.checkOverflow();
     }
     render() {
-        return (h("nav", { key: '1878948ed9fcde1587f9f81b9a67dcb84ece5f80', class: "spw-tabs-navigation" }, h("ul", { key: 'f50e5edb7db854f443618c88353ca419205950cf', class: "spw-tabs-navigation__list", role: "tablist" }, h("slot", { key: 'd76ac4cfa82e09dfddfeda783e5f755b9b68c030' }))));
+        return (h("div", { key: 'e30dd2eeaff721cf907cc90f274fea0e09374704', class: "spw-tabs-navigation-container" }, this.showLeftArrow && (h("button", { key: 'd06751d3a971c6fc8a766893a0f20287808e12b6', class: "spw-tabs-navigation__arrow spw-tabs-navigation__arrow--left", onClick: this.scrollLeft, "aria-label": "Faire d\u00E9filer vers la gauche" }, h("spw-icon", { key: 'af54fc328d44238155fb8137566c96e45e0a0483', icon: "fa-chevron-left" }))), h("nav", { key: 'ab61a57c0f21cf18a4ad25f2468ac9fe6c56bb24', class: "spw-tabs-navigation" }, h("ul", { key: '8e87fa8b691dc26b7196f2aca9f573cc4e15f294', class: "spw-tabs-navigation__list", role: "tablist", ref: el => (this.ulElement = el), onScroll: this.handleScroll }, h("slot", { key: '10933f456cb16f0a5f7f1b07fb831fd695a2cb8b' }))), this.showRightArrow && (h("button", { key: '365deb76145d29345b25c48235c82a8dd325a8fc', class: "spw-tabs-navigation__arrow spw-tabs-navigation__arrow--right", onClick: this.scrollRight, "aria-label": "Faire d\u00E9filer vers la droite" }, h("spw-icon", { key: '0595bfaf9a4dd1bb00e0f0f4a8386c33bdeb8c47', icon: "fa-chevron-right" })))));
     }
+    get hostElement() { return this; }
     static get style() { return spwTabsNavigationCss; }
-}, [1, "spw-tabs-navigation"]);
+}, [1, "spw-tabs-navigation", {
+        "showLeftArrow": [32],
+        "showRightArrow": [32]
+    }, [[9, "resize", "onWindowResize"]]]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {
         return;
     }
-    const components = ["spw-tabs-navigation"];
+    const components = ["spw-tabs-navigation", "spw-icon"];
     components.forEach(tagName => { switch (tagName) {
         case "spw-tabs-navigation":
             if (!customElements.get(tagName)) {
                 customElements.define(tagName, SpwTabsNavigation$1);
             }
             break;
+        case "spw-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
     } });
 }

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

	@@ -1 +1 @@
1	- {"file":"spw-tabs-navigation.js","mappings":";;AAAA,MAAM,oBAAoB,GAAG,~~2tGAA2tG~~;;~~MCO3uGA~~,mBAAiB,iBAAAC,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA~~;;;;;;IAC5B~~,MAAM,GAAA;~~QACJ~~,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,qBAAqB,EAAA,EAC9B,~~CAAA~~,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,~~EAAI~~,KAAK,EAAC,2BAA2B,EAAC,IAAI,EAAC,SAAS,EAAA,~~EAClD~~,~~CAAa~~,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACV,~~CACD;;;;;;;;;;;;;;;;;;;;;;;~~","names":["SpwTabsNavigation","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-tabs/spw-tabs-navigation/spw-tabs-navigation.scss?tag=spw-tabs-navigation&encapsulation=shadow","src/components/spw-tabs/spw-tabs-navigation/spw-tabs-navigation.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-tabs-navigation {\n &__list {\n position: relative;\n z-index: 2;\n display: flex;\n flex-wrap: nowrap;\n gap: 24px;\n overflow-x: auto;\n white-space: nowrap;\n border-bottom: 1px solid var(--spw-colors-support-grey-grey-300);\n :host(.--box) & {\n gap: 0;\n border-bottom: 0;\n top: 1px;\n }\n }\n}\n\n::slotted(spw-tabs-navigation-item) {\n --spw-tabs-border-radius: 0;\n --spw-tabs-margin-left: -1px;\n}\n\n::slotted(spw-tabs-navigation-item:first-child) {\n --spw-tabs-border-radius: 4px 0 0 0;\n --spw-tabs-margin-left: 0;\n}\n\n::slotted(spw-tabs-navigation-item:last-child) {\n --spw-tabs-border-radius: 0 4px 0 0;\n --spw-tabs-margin-left: -1px;\n}\n\n::slotted(spw-tabs-navigation-item.--active) {\n --spw-tabs-border-radius: 4px 4px 0 0;\n}\n","import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-tabs-navigation',\n styleUrl: 'spw-tabs-navigation.scss',\n shadow: true,\n})\nexport class SpwTabsNavigation {\n render() {\n return (\n <~~nav~~ class=\"spw-tabs-navigation\">\n <ul class=\"spw-tabs-navigation__list\" role=\"tablist\">\n <slot></slot>\n </ul>\n </nav>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-tabs-navigation.js","mappings":"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","names":["SpwTabsNavigation","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-tabs/spw-tabs-navigation/spw-tabs-navigation.scss?tag=spw-tabs-navigation&encapsulation=shadow","src/components/spw-tabs/spw-tabs-navigation/spw-tabs-navigation.tsx"],"sourcesContent":[":host {\n display: block;\n position: relative;\n top: 1px;\n // border-bottom: 1px solid var(--spw-colors-support-grey-grey-300);\n}\n\n.spw-tabs-navigation-container {\n display: flex;\n align-items: center;\n position: relative;\n width: 100%;\n overflow: hidden;\n}\n\n.spw-tabs-navigation {\n flex: 1;\n overflow: hidden;\n\n &__list {\n position: relative;\n z-index: 2;\n display: flex;\n flex-wrap: nowrap;\n gap: 24px;\n overflow-x: auto;\n white-space: nowrap;\n border-bottom: 1px solid var(--spw-colors-support-grey-grey-300);\n scroll-behavior: smooth;\n list-style: none;\n margin: 0;\n padding: 0;\n scrollbar-width: none;\n -ms-overflow-style: none;\n\n &::-webkit-scrollbar {\n display: none;\n }\n\n :host(.--box) & {\n gap: 0;\n border-bottom: 0;\n // top: 1px;\n }\n }\n}\n\n.spw-tabs-navigation__arrow {\n position: relative;\n top: 1px;\n display: flex;\n align-items: center;\n justify-content: center;\n background: white;\n // border: 1px solid #ddd;\n // border-bottom: 1px solid #ccc;\n border: none;\n width: 33px;\n height: 33px;\n cursor: pointer;\n z-index: 10;\n transition: all 0.2s ease;\n\n spw-icon {\n font-size: 14px;\n color: var(--spw-colors-support-grey-grey-500);\n }\n\n &:hover {\n // background: var(--spw-colors-support-grey-grey-100);\n spw-icon {\n color: var(--spw-colors-support-grey-grey-600);\n }\n }\n\n &:active {\n // background: var(--spw-colors-support-grey-grey-200);\n spw-icon {\n color: var(--spw-colors-support-grey-grey-900);\n }\n }\n\n &--left {\n border-radius: 4px 0 0 0;\n border-right: 1px solid var(--spw-colors-support-grey-grey-300);\n }\n\n &--right {\n border-radius: 0 4px 0 0;\n border-left: 1px solid var(--spw-colors-support-grey-grey-300);\n }\n}\n\n::slotted(spw-tabs-navigation-item) {\n --spw-tabs-border-radius: 0;\n --spw-tabs-margin-left: -1px;\n}\n\n::slotted(spw-tabs-navigation-item:first-child) {\n --spw-tabs-border-radius: 4px 0 0 0;\n --spw-tabs-margin-left: 0;\n}\n\n::slotted(spw-tabs-navigation-item:last-child) {\n --spw-tabs-border-radius: 0 4px 0 0;\n --spw-tabs-margin-left: -1px;\n}\n\n::slotted(spw-tabs-navigation-item.--active) {\n --spw-tabs-border-radius: 4px 4px 0 0;\n}\n","import { Component, h, Element, State, Listen } from '@stencil/core';\n\n@Component({\n tag: 'spw-tabs-navigation',\n styleUrl: 'spw-tabs-navigation.scss',\n shadow: true,\n})\nexport class SpwTabsNavigation {\n @Element() hostElement: HTMLElement;\n @State() showLeftArrow: boolean = false;\n @State() showRightArrow: boolean = false;\n\n private ulElement: HTMLUListElement;\n private scrollPercentage: number = 30;\n\n private resizeObserver: ResizeObserver \| null = null;\n private mutationObserver: MutationObserver \| null = null;\n\n componentDidLoad() {\n this.checkOverflow();\n this.setupObservers();\n }\n\n disconnectedCallback() {\n this.cleanupObservers();\n }\n\n @Listen('resize', { target: 'window' })\n onWindowResize() {\n this.checkOverflow();\n }\n\n private setupObservers = () => {\n this.resizeObserver = new ResizeObserver(() => {\n this.checkOverflow();\n });\n\n if (this.ulElement) {\n this.resizeObserver.observe(this.ulElement);\n }\n\n this.mutationObserver = new MutationObserver(() => {\n this.updateSlottedElementsObservation();\n setTimeout(() => this.checkOverflow(), 10);\n });\n\n this.mutationObserver.observe(this.hostElement, {\n childList: true,\n subtree: true,\n });\n\n this.updateSlottedElementsObservation();\n };\n\n private updateSlottedElementsObservation = () => {\n if (!this.resizeObserver) return;\n\n const children = Array.from(this.hostElement.children);\n children.forEach(child => {\n this.resizeObserver!.observe(child);\n });\n };\n\n private cleanupObservers = () => {\n if (this.resizeObserver) {\n this.resizeObserver.disconnect();\n this.resizeObserver = null;\n }\n if (this.mutationObserver) {\n this.mutationObserver.disconnect();\n this.mutationObserver = null;\n }\n };\n\n private checkOverflow = () => {\n if (!this.ulElement) return;\n\n const containerWidth = this.ulElement.clientWidth;\n const contentWidth = this.ulElement.scrollWidth;\n const scrollLeft = this.ulElement.scrollLeft;\n\n const hasOverflow = contentWidth > containerWidth;\n\n this.showLeftArrow = hasOverflow && scrollLeft > 0;\n this.showRightArrow = hasOverflow && scrollLeft < contentWidth - containerWidth - 1;\n };\n\n private scrollLeft = () => {\n if (!this.ulElement) return;\n\n const scrollAmount = (this.ulElement.clientWidth * this.scrollPercentage) / 100;\n this.ulElement.scrollBy({\n left: -scrollAmount,\n behavior: 'smooth',\n });\n };\n\n private scrollRight = () => {\n if (!this.ulElement) return;\n\n const scrollAmount = (this.ulElement.clientWidth * this.scrollPercentage) / 100;\n this.ulElement.scrollBy({\n left: scrollAmount,\n behavior: 'smooth',\n });\n };\n\n private handleScroll = () => {\n this.checkOverflow();\n };\n\n render() {\n return (\n <div class=\"spw-tabs-navigation-container\">\n {this.showLeftArrow && (\n <button class=\"spw-tabs-navigation__arrow spw-tabs-navigation__arrow--left\" onClick={this.scrollLeft} aria-label=\"Faire défiler vers la gauche\">\n <spw-icon icon=\"fa-chevron-left\"></spw-icon>\n </button>\n )}\n\n <nav class=\"spw-tabs-navigation\">\n <ul class=\"spw-tabs-navigation__list\" role=\"tablist\" ref={el => (this.ulElement = el as HTMLUListElement)} onScroll={this.handleScroll}>\n <slot></slot>\n </ul>\n </nav>\n\n {this.showRightArrow && (\n <button class=\"spw-tabs-navigation__arrow spw-tabs-navigation__arrow--right\" onClick={this.scrollRight} aria-label=\"Faire défiler vers la droite\">\n <spw-icon icon=\"fa-chevron-right\"></spw-icon>\n </button>\n )}\n </div>\n );\n }\n}\n"],"version":3}

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

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, h } from './index.js';
+import { p as proxyCustomElement, H, c as createEvent, h } from './index.js';
 const spwTabsCss = "/*! 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)}}";
@@ -7,12 +7,15 @@ const SpwTabs$1 = /*@__PURE__*/ proxyCustomElement(class SpwTabs extends H {
         super();
         this.__registerHost();
         this.__attachShadow();
+        this.tabChanged = createEvent(this, "tabChanged");
         /** Onglet actif par défaut */
         this.defaultActiveTab = '1';
         /** Variante des onglets */
         this.variant = 'default';
-        /** Texte coupé si trop long */
+        /** Texte coupé si trop long, affiche un tooltip si le contenu excède la max-width définie */
         this.hasEllipsis = false;
+        /** Permet de spécifier la taille de l'onglet */
+        this.size = 'small';
         this.activeTab = '1'; // Initialiser avec une valeur par défaut
     }
     componentWillLoad() {
@@ -21,9 +24,19 @@ const SpwTabs$1 = /*@__PURE__*/ proxyCustomElement(class SpwTabs extends H {
     componentDidLoad() {
         this.applyVariantToChildren();
         this.updateActiveStates();
+        setTimeout(() => {
+            this.applyMaxWidthToChildren();
+        }, 100);
     }
     activeTabChanged() {
         this.updateActiveStates();
+        this.tabChanged.emit(this.activeTab);
+    }
+    maxWidthChanged() {
+        this.applyMaxWidthToChildren();
+    }
+    hasEllipsisChanged() {
+        this.applyVariantToChildren();
     }
     /**
      * Récupère l'onglet actuellement sélectionné
@@ -50,6 +63,7 @@ const SpwTabs$1 = /*@__PURE__*/ proxyCustomElement(class SpwTabs extends H {
     slotChanged() {
         this.applyVariantToChildren();
         this.updateActiveStates();
+        this.applyMaxWidthToChildren();
     }
     updateActiveStates() {
         const isInThisComponent = (el) => el.closest('spw-tabs') === this.el;
@@ -62,11 +76,57 @@ const SpwTabs$1 = /*@__PURE__*/ proxyCustomElement(class SpwTabs extends H {
             content.active = content.tabId === this.activeTab;
         });
     }
+    applyMaxWidthToChildren() {
+        if (!this.maxWidth) {
+            return;
+        }
+        requestAnimationFrame(() => {
+            const isInThisComponent = (el) => el.closest('spw-tabs') === this.el;
+            const navItems = Array.from(this.el.querySelectorAll('spw-tabs-navigation-item')).filter(isInThisComponent);
+            const ellipsisClass = `--ellipsis`;
+            navItems.forEach(item => {
+                var _a;
+                const textContent = ((_a = item.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || '';
+                if (!textContent) {
+                    return;
+                }
+                const measureEl = document.createElement('div');
+                measureEl.style.cssText = `
+          position: absolute;
+          visibility: hidden;
+          white-space: nowrap;
+          top: -9999px;
+          left: -9999px;
+        `;
+                measureEl.textContent = textContent;
+                const computedStyle = window.getComputedStyle(item);
+                measureEl.style.fontSize = computedStyle.fontSize;
+                measureEl.style.fontFamily = computedStyle.fontFamily;
+                measureEl.style.fontWeight = computedStyle.fontWeight;
+                measureEl.style.fontStyle = computedStyle.fontStyle;
+                measureEl.style.letterSpacing = computedStyle.letterSpacing;
+                measureEl.style.textTransform = computedStyle.textTransform;
+                document.body.appendChild(measureEl);
+                const contentWidth = measureEl.getBoundingClientRect().width;
+                document.body.removeChild(measureEl);
+                if (contentWidth > this.maxWidth) {
+                    item.style.setProperty('--spw-tabs-max-width-text', `${this.maxWidth}px`);
+                    item.setAttribute('has-ellipsis', 'true');
+                    item.classList.add(ellipsisClass);
+                }
+                else {
+                    item.style.removeProperty('--spw-tabs-max-width-text');
+                    item.setAttribute('has-ellipsis', 'false');
+                    item.classList.remove(ellipsisClass);
+                }
+            });
+        });
+    }
     applyVariantToChildren() {
         requestAnimationFrame(() => {
             var _a, _b;
             const variantClass = `--${this.variant}`;
-            const ellipsisClass = `--ellipsis`;
+            const sizeClass = `--${this.size}`;
             const isInThisComponent = (el) => el.closest('spw-tabs') === this.el;
             const navigationSlot = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot[name="navigation"]');
             const contentSlot = (_b = this.el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('slot[name="content"]');
@@ -78,19 +138,13 @@ const SpwTabs$1 = /*@__PURE__*/ proxyCustomElement(class SpwTabs extends H {
                     el.querySelectorAll('spw-tabs-navigation-item').forEach(item => {
                         if (isInThisComponent(item)) {
                             item.classList.add(variantClass);
-                            if (this.hasEllipsis) {
-                                item.classList.add(ellipsisClass);
-                            }
-                            item.setAttribute('has-ellipsis', this.hasEllipsis ? 'true' : 'false');
+                            item.classList.add(sizeClass);
                         }
                     });
                 }
                 else if (el.tagName === 'SPW-TABS-NAVIGATION-ITEM') {
                     el.classList.add(variantClass);
-                    if (this.hasEllipsis) {
-                        el.classList.add(ellipsisClass);
-                    }
-                    el.setAttribute('has-ellipsis', this.hasEllipsis ? 'true' : 'false');
+                    el.classList.add(sizeClass);
                 }
             });
             contentElements.forEach(el => {
@@ -105,6 +159,7 @@ const SpwTabs$1 = /*@__PURE__*/ proxyCustomElement(class SpwTabs extends H {
                     });
                 }
             });
+            this.applyMaxWidthToChildren();
         });
     }
     get elementClass() {
@@ -114,22 +169,28 @@ const SpwTabs$1 = /*@__PURE__*/ proxyCustomElement(class SpwTabs extends H {
         };
     }
     render() {
-        return (h("div", { key: '0392ca75dfade56a1efa361c4dd095ff4eabdca8', class: this.elementClass }, h("slot", { key: 'e4dd5ae8018b8761faa787d2e6bfb2e7fcf2920d', name: "navigation" }), h("slot", { key: 'fe20c00bcaee65f76bded2e1f19864bb9d2a1912', name: "content" })));
+        return (h("div", { key: '524414454013d4f3d7fbf2c170fc58751fe46503', class: this.elementClass }, h("slot", { key: 'ebc36ddb238084cdfdc39c44021c3413949a0cbc', name: "navigation" }), h("slot", { key: '6bf3dd7c53dc133956b20169c9077c93d828ee8c', name: "content" })));
     }
     get el() { return this; }
     static get watchers() { return {
-        "activeTab": ["activeTabChanged"]
+        "activeTab": ["activeTabChanged"],
+        "maxWidth": ["maxWidthChanged"],
+        "hasEllipsis": ["hasEllipsisChanged"]
     }; }
     static get style() { return spwTabsCss; }
 }, [1, "spw-tabs", {
         "defaultActiveTab": [1, "default-active-tab"],
         "variant": [1],
         "hasEllipsis": [4, "has-ellipsis"],
+        "maxWidth": [2, "max-width"],
+        "size": [1],
         "activeTab": [32],
         "getSelectedTab": [64],
         "setSelectedTab": [64]
     }, [[2, "tabSelected", "handleTabSelected"], [0, "slotchange", "slotChanged"]], {
-        "activeTab": ["activeTabChanged"]
+        "activeTab": ["activeTabChanged"],
+        "maxWidth": ["maxWidthChanged"],
+        "hasEllipsis": ["hasEllipsisChanged"]
     }]);
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {

package/dist/components/spw-tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"spw-tabs.js","mappings":";;AAAA,MAAM,UAAU,GAAG,4kFAA4kF;;MCOllFA,SAAO,iBAAAC,kBAAA,CAAA,MAAA,OAAA,SAAAC,CAAA,CAAA;AALpB,IAAA,WAAA,GAAA;;;;;AASU,QAAA,IAAgB,CAAA,gBAAA,GAAW,GAAG;;AAE9B,QAAA,IAAO,CAAA,OAAA,GAAsB,SAAS;;AAEtC,QAAA,IAAW,CAAA,WAAA,GAAa,KAAK;AAE5B,QAAA,IAAA,CAAA,SAAS,GAAW,GAAG,CAAC;AAmIlC;IAjIC,iBAAiB,GAAA;AACf,QAAA,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,gBAAgB;;IAGxC,gBAAgB,GAAA;QACd,IAAI,CAAC,sBAAsB,EAAE;QAC7B,IAAI,CAAC,kBAAkB,EAAE;;IAI3B,gBAAgB,GAAA;QACd,IAAI,CAAC,kBAAkB,EAAE;;AAG3B;;;AAGG;AAEH,IAAA,MAAM,cAAc,GAAA;QAClB,OAAO,IAAI,CAAC,SAAS;;AAGvB;;;;AAIG;IAEH,MAAM,cAAc,CAAC,KAAa,EAAA;AAChC,QAAA,IAAI,CAAC,SAAS,GAAG,KAAK;;AAIxB,IAAA,iBAAiB,CAAC,KAA0B,EAAA;AAC1C,QAAA,IAAI,KAAK,CAAC,MAAM,IAAK,KAAK,CAAC,MAAsB,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC,EAAE,EAAE;YACjF;;AAGF,QAAA,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,MAAM;QAC7B,KAAK,CAAC,eAAe,EAAE;;IAIzB,WAAW,GAAA;QACT,IAAI,CAAC,sBAAsB,EAAE;QAC7B,IAAI,CAAC,kBAAkB,EAAE;;IAGnB,kBAAkB,GAAA;AACxB,QAAA,MAAM,iBAAiB,GAAG,CAAC,EAAW,KAAK,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC,EAAE;QAE7E,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,0BAA0B,CAAC,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAuC;QAEjJ,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,iBAAiB,CAAgC;AAElI,QAAA,QAAQ,CAAC,OAAO,CAAC,IAAI,IAAG;YACtB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,SAAS;AAC7C,SAAC,CAAC;AAEF,QAAA,QAAQ,CAAC,OAAO,CAAC,OAAO,IAAG;YACzB,OAAO,CAAC,MAAM,GAAG,OAAO,CAAC,KAAK,KAAK,IAAI,CAAC,SAAS;AACnD,SAAC,CAAC;;IAGI,sBAAsB,GAAA;QAC5B,qBAAqB,CAAC,MAAK;;AACzB,YAAA,MAAM,YAAY,GAAG,CAAA,EAAA,EAAK,IAAI,CAAC,OAAO,EAAE;YACxC,MAAM,aAAa,GAAG,CAAA,UAAA,CAAY;AAElC,YAAA,MAAM,iBAAiB,GAAG,CAAC,EAAW,KAAK,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,IAAI,CAAC,EAAE;AAE7E,YAAA,MAAM,cAAc,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,EAAE,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,yBAAyB,CAAoB;AACtG,YAAA,MAAM,WAAW,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,EAAE,CAAC,UAAU,MAAE,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,aAAa,CAAC,sBAAsB,CAAoB;AAEhG,YAAA,MAAM,kBAAkB,GAAG,CAAC,CAAA,cAAc,KAAd,IAAA,IAAA,cAAc,KAAd,MAAA,GAAA,MAAA,GAAA,cAAc,CAAE,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,KAAI,EAAE,EAAE,MAAM,CAAC,iBAAiB,CAAC;AAChH,YAAA,MAAM,eAAe,GAAG,CAAC,CAAA,WAAW,KAAX,IAAA,IAAA,WAAW,KAAX,MAAA,GAAA,MAAA,GAAA,WAAW,CAAE,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,KAAI,EAAE,EAAE,MAAM,CAAC,iBAAiB,CAAC;AAE1G,YAAA,kBAAkB,CAAC,OAAO,CAAC,EAAE,IAAG;AAC9B,gBAAA,IAAI,EAAE,CAAC,OAAO,KAAK,qBAAqB,EAAE;AACxC,oBAAA,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC;oBAE9B,EAAE,CAAC,gBAAgB,CAAC,0BAA0B,CAAC,CAAC,OAAO,CAAC,IAAI,IAAG;AAC7D,wBAAA,IAAI,iBAAiB,CAAC,IAAI,CAAC,EAAE;AAC3B,4BAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC;AAChC,4BAAA,IAAI,IAAI,CAAC,WAAW,EAAE;AACpB,gCAAA,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC;;AAEnC,4BAAA,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,IAAI,CAAC,WAAW,GAAG,MAAM,GAAG,OAAO,CAAC;;AAE1E,qBAAC,CAAC;;AACG,qBAAA,IAAI,EAAE,CAAC,OAAO,KAAK,0BAA0B,EAAE;AACpD,oBAAA,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC;AAC9B,oBAAA,IAAI,IAAI,CAAC,WAAW,EAAE;AACpB,wBAAA,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC;;AAEjC,oBAAA,EAAE,CAAC,YAAY,CAAC,cAAc,EAAE,IAAI,CAAC,WAAW,GAAG,MAAM,GAAG,OAAO,CAAC;;AAExE,aAAC,CAAC;AAEF,YAAA,eAAe,CAAC,OAAO,CAAC,EAAE,IAAG;AAC3B,gBAAA,IAAI,EAAE,CAAC,OAAO,KAAK,kBAAkB,EAAE;AACrC,oBAAA,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC;;qBACzB;oBACL,EAAE,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,OAAO,CAAC,OAAO,IAAG;AACxD,wBAAA,IAAI,iBAAiB,CAAC,OAAO,CAAC,EAAE;AAC9B,4BAAA,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC;;AAEvC,qBAAC,CAAC;;AAEN,aAAC,CAAC;AACJ,SAAC,CAAC;;AAGJ,IAAA,IAAY,YAAY,GAAA;QACtB,OAAO;AACL,YAAA,UAAU,EAAE,IAAI;AAChB,YAAA,CAAC,aAAa,IAAI,CAAC,OAAO,CAAE,CAAA,GAAG,IAAI;SACpC;;IAGH,MAAM,GAAA;QACJ,QACE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,YAAY,EAAA,EAC3B,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,YAAY,EAAQ,CAAA,EAC/B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,SAAS,EAAQ,CAAA,CACxB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["SpwTabs","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-tabs/spw-tabs.scss?tag=spw-tabs&encapsulation=shadow","src/components/spw-tabs/spw-tabs.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import { Component, h, State, Prop, Method, Element, Listen, Watch } from '@stencil/core';\n\n@Component({\n tag: 'spw-tabs',\n styleUrl: 'spw-tabs.scss',\n shadow: true,\n})\nexport class SpwTabs {\n @Element() el: HTMLElement;\n\n /** Onglet actif par défaut /\n @Prop() defaultActiveTab: string = '1';\n /* Variante des onglets /\n @Prop() variant: 'default' \| 'box' = 'default';\n /* Texte coupé si trop long /\n @Prop() hasEllipsis?: boolean = false;\n\n @State() activeTab: string = '1'; // Initialiser avec une valeur par défaut\n\n componentWillLoad() {\n this.activeTab = this.defaultActiveTab;\n }\n\n componentDidLoad() {\n this.applyVariantToChildren();\n this.updateActiveStates();\n }\n\n @Watch('activeTab')\n activeTabChanged() {\n this.updateActiveStates();\n }\n\n /\n Récupère l'onglet actuellement sélectionné\n * @returns {Promise<string>} L'ID de l'onglet actif\n /\n @Method()\n async getSelectedTab(): Promise<string> {\n return this.activeTab;\n }\n\n /\n Définit l'onglet sélectionné\n * @param tabId L'ID de l'onglet à sélectionner\n * @returns {Promise<void>}\n */\n @Method()\n async setSelectedTab(tabId: string): Promise<void> {\n this.activeTab = tabId;\n }\n\n @Listen('tabSelected', { capture: true })\n handleTabSelected(event: CustomEvent<string>) {\n if (event.target && (event.target as HTMLElement).closest('spw-tabs') !== this.el) {\n return;\n }\n\n this.activeTab = event.detail;\n event.stopPropagation();\n }\n\n @Listen('slotchange')\n slotChanged() {\n this.applyVariantToChildren();\n this.updateActiveStates();\n }\n\n private updateActiveStates() {\n const isInThisComponent = (el: Element) => el.closest('spw-tabs') === this.el;\n\n const navItems = Array.from(this.el.querySelectorAll('spw-tabs-navigation-item')).filter(isInThisComponent) as HTMLSpwTabsNavigationItemElement[];\n\n const contents = Array.from(this.el.querySelectorAll('spw-tabs-content')).filter(isInThisComponent) as HTMLSpwTabsContentElement[];\n\n navItems.forEach(item => {\n item.active = item.tabId === this.activeTab;\n });\n\n contents.forEach(content => {\n content.active = content.tabId === this.activeTab;\n });\n }\n\n private applyVariantToChildren() {\n requestAnimationFrame(() => {\n const variantClass = `--${this.variant}`;\n const ellipsisClass = `--ellipsis`;\n\n const isInThisComponent = (el: Element) => el.closest('spw-tabs') === this.el;\n\n const navigationSlot = this.el.shadowRoot?.querySelector('slot[name=\"navigation\"]') as HTMLSlotElement;\n const contentSlot = this.el.shadowRoot?.querySelector('slot[name=\"content\"]') as HTMLSlotElement;\n\n const navigationElements = (navigationSlot?.assignedElements({ flatten: true }) \|\| []).filter(isInThisComponent);\n const contentElements = (contentSlot?.assignedElements({ flatten: true }) \|\| []).filter(isInThisComponent);\n\n navigationElements.forEach(el => {\n if (el.tagName === 'SPW-TABS-NAVIGATION') {\n el.classList.add(variantClass);\n\n el.querySelectorAll('spw-tabs-navigation-item').forEach(item => {\n if (isInThisComponent(item)) {\n item.classList.add(variantClass);\n if (this.hasEllipsis) {\n item.classList.add(ellipsisClass);\n }\n item.setAttribute('has-ellipsis', this.hasEllipsis ? 'true' : 'false');\n }\n });\n } else if (el.tagName === 'SPW-TABS-NAVIGATION-ITEM') {\n el.classList.add(variantClass);\n if (this.hasEllipsis) {\n el.classList.add(ellipsisClass);\n }\n el.setAttribute('has-ellipsis', this.hasEllipsis ? 'true' : 'false');\n }\n });\n\n contentElements.forEach(el => {\n if (el.tagName === 'SPW-TABS-CONTENT') {\n el.classList.add(variantClass);\n } else {\n el.querySelectorAll('spw-tabs-content').forEach(content => {\n if (isInThisComponent(content)) {\n content.classList.add(variantClass);\n }\n });\n }\n });\n });\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-tabs': true,\n [`spw-tabs--${this.variant}`]: true,\n };\n }\n\n render() {\n return (\n <div class={this.elementClass}>\n <slot name=\"navigation\"></slot>\n <slot name=\"content\"></slot>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-tabs.js","mappings":"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","names":["SpwTabs","__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/spw-tabs/spw-tabs.scss?tag=spw-tabs&encapsulation=shadow","src/components/spw-tabs/spw-tabs.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import { Component, h, State, Event, EventEmitter, Prop, Method, Element, Listen, Watch } from '@stencil/core';\n\n@Component({\n tag: 'spw-tabs',\n styleUrl: 'spw-tabs.scss',\n shadow: true,\n})\nexport class SpwTabs {\n @Element() el: HTMLElement;\n\n /** Onglet actif par défaut /\n @Prop() defaultActiveTab: string = '1';\n /* Variante des onglets /\n @Prop() variant: 'default' \| 'box' = 'default';\n /* Texte coupé si trop long, affiche un tooltip si le contenu excède la max-width définie /\n @Prop() hasEllipsis?: boolean = false;\n /* Définit la largeur maximale de l'onglet (en pixels) /\n @Prop() maxWidth?: number;\n /* Permet de spécifier la taille de l'onglet /\n @Prop() size?: 'large' \| 'medium' \| 'small' = 'small';\n\n @State() activeTab: string = '1'; // Initialiser avec une valeur par défaut\n\n /* Événement émis lorsque l'onglet actif change /\n @Event() tabChanged: EventEmitter<string>;\n\n componentWillLoad() {\n this.activeTab = this.defaultActiveTab;\n }\n\n componentDidLoad() {\n this.applyVariantToChildren();\n this.updateActiveStates();\n\n setTimeout(() => {\n this.applyMaxWidthToChildren();\n }, 100);\n }\n\n @Watch('activeTab')\n activeTabChanged() {\n this.updateActiveStates();\n this.tabChanged.emit(this.activeTab);\n }\n\n @Watch('maxWidth')\n maxWidthChanged() {\n this.applyMaxWidthToChildren();\n }\n\n @Watch('hasEllipsis')\n hasEllipsisChanged() {\n this.applyVariantToChildren();\n }\n\n /\n Récupère l'onglet actuellement sélectionné\n * @returns {Promise<string>} L'ID de l'onglet actif\n /\n @Method()\n async getSelectedTab(): Promise<string> {\n return this.activeTab;\n }\n\n /\n Définit l'onglet sélectionné\n * @param tabId L'ID de l'onglet à sélectionner\n * @returns {Promise<void>}\n */\n @Method()\n async setSelectedTab(tabId: string): Promise<void> {\n this.activeTab = tabId;\n }\n\n @Listen('tabSelected', { capture: true })\n handleTabSelected(event: CustomEvent<string>) {\n if (event.target && (event.target as HTMLElement).closest('spw-tabs') !== this.el) {\n return;\n }\n\n this.activeTab = event.detail;\n event.stopPropagation();\n }\n\n @Listen('slotchange')\n slotChanged() {\n this.applyVariantToChildren();\n this.updateActiveStates();\n this.applyMaxWidthToChildren();\n }\n\n private updateActiveStates() {\n const isInThisComponent = (el: Element) => el.closest('spw-tabs') === this.el;\n\n const navItems = Array.from(this.el.querySelectorAll('spw-tabs-navigation-item')).filter(isInThisComponent) as HTMLSpwTabsNavigationItemElement[];\n\n const contents = Array.from(this.el.querySelectorAll('spw-tabs-content')).filter(isInThisComponent) as HTMLSpwTabsContentElement[];\n\n navItems.forEach(item => {\n item.active = item.tabId === this.activeTab;\n });\n\n contents.forEach(content => {\n content.active = content.tabId === this.activeTab;\n });\n }\n\n private applyMaxWidthToChildren() {\n if (!this.maxWidth) {\n return;\n }\n\n requestAnimationFrame(() => {\n const isInThisComponent = (el: Element) => el.closest('spw-tabs') === this.el;\n const navItems = Array.from(this.el.querySelectorAll('spw-tabs-navigation-item')).filter(isInThisComponent) as HTMLSpwTabsNavigationItemElement[];\n const ellipsisClass = `--ellipsis`;\n\n navItems.forEach(item => {\n const textContent = item.textContent?.trim() \|\| '';\n\n if (!textContent) {\n return;\n }\n\n const measureEl = document.createElement('div');\n measureEl.style.cssText = `\n position: absolute;\n visibility: hidden;\n white-space: nowrap;\n top: -9999px;\n left: -9999px;\n `;\n measureEl.textContent = textContent;\n\n const computedStyle = window.getComputedStyle(item);\n measureEl.style.fontSize = computedStyle.fontSize;\n measureEl.style.fontFamily = computedStyle.fontFamily;\n measureEl.style.fontWeight = computedStyle.fontWeight;\n measureEl.style.fontStyle = computedStyle.fontStyle;\n measureEl.style.letterSpacing = computedStyle.letterSpacing;\n measureEl.style.textTransform = computedStyle.textTransform;\n\n document.body.appendChild(measureEl);\n const contentWidth = measureEl.getBoundingClientRect().width;\n document.body.removeChild(measureEl);\n\n if (contentWidth > this.maxWidth) {\n item.style.setProperty('--spw-tabs-max-width-text', `${this.maxWidth}px`);\n\n item.setAttribute('has-ellipsis', 'true');\n\n item.classList.add(ellipsisClass);\n } else {\n item.style.removeProperty('--spw-tabs-max-width-text');\n item.setAttribute('has-ellipsis', 'false');\n item.classList.remove(ellipsisClass);\n }\n });\n });\n }\n\n private applyVariantToChildren() {\n requestAnimationFrame(() => {\n const variantClass = `--${this.variant}`;\n const sizeClass = `--${this.size}`;\n\n const isInThisComponent = (el: Element) => el.closest('spw-tabs') === this.el;\n\n const navigationSlot = this.el.shadowRoot?.querySelector('slot[name=\"navigation\"]') as HTMLSlotElement;\n const contentSlot = this.el.shadowRoot?.querySelector('slot[name=\"content\"]') as HTMLSlotElement;\n\n const navigationElements = (navigationSlot?.assignedElements({ flatten: true }) \|\| []).filter(isInThisComponent);\n const contentElements = (contentSlot?.assignedElements({ flatten: true }) \|\| []).filter(isInThisComponent);\n\n navigationElements.forEach(el => {\n if (el.tagName === 'SPW-TABS-NAVIGATION') {\n el.classList.add(variantClass);\n\n el.querySelectorAll('spw-tabs-navigation-item').forEach(item => {\n if (isInThisComponent(item)) {\n item.classList.add(variantClass);\n item.classList.add(sizeClass);\n }\n });\n } else if (el.tagName === 'SPW-TABS-NAVIGATION-ITEM') {\n el.classList.add(variantClass);\n el.classList.add(sizeClass);\n }\n });\n\n contentElements.forEach(el => {\n if (el.tagName === 'SPW-TABS-CONTENT') {\n el.classList.add(variantClass);\n } else {\n el.querySelectorAll('spw-tabs-content').forEach(content => {\n if (isInThisComponent(content)) {\n content.classList.add(variantClass);\n }\n });\n }\n });\n\n this.applyMaxWidthToChildren();\n });\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-tabs': true,\n [`spw-tabs--${this.variant}`]: true,\n };\n }\n\n render() {\n return (\n <div class={this.elementClass}>\n <slot name=\"navigation\"></slot>\n <slot name=\"content\"></slot>\n </div>\n );\n }\n}"],"version":3}

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

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, h, a as Host } from './index.js';
-import { d as defineCustomElement$2 } from './p-BrOEFNbv.js';
+import { d as defineCustomElement$2 } from './p-_q4w18VU.js';
 const spwTagCss = "/*! 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:inline-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-tag{align-items:center;border:1px solid transparent;border-radius:999px;display:inline-flex;gap:6px;justify-content:center;line-height:1;padding:6px 12px;text-decoration:none;white-space:nowrap}.spw-tag--hoverable{position:relative;transition:all .2s linear}.spw-tag--hoverable:hover{transform:translateY(-5px)}.spw-tag--default{background:#fff;border-color:var(--spw-colors-support-grey-grey-300);color:var(--spw-colors-support-grey-grey-900)}.spw-tag--grey{background:var(--spw-colors-support-grey-grey-100);color:var(--spw-colors-support-grey-grey-800)}.spw-tag--blue{background:#e6f3ff;color:#002e6b}.spw-tag--green{background:#e2fde3;color:#026100}.spw-tag--orange{background:#ffeee0;color:#702000}.spw-tag--red{background:#ffebed;color:#70000d}.spw-tag--purple{background:#f7ebff;color:#45036d}.spw-tag--surface-dark{box-shadow:0 2px 3px 0 rgba(0,0,0,.15)}.spw-tag--size-small{font-size:14px}.spw-tag--size-medium{font-size:16px}.spw-tag--size-large{font-size:18px}";
@@ -50,7 +50,7 @@ const SpwTag$1 = /*@__PURE__*/ proxyCustomElement(class SpwTag extends H {
                 href,
                 target,
             };
-        return (h(Host, { key: 'ab649f9851f69d2d4276cf0489bdf57f0d94bdd6' }, h(TagType, Object.assign({ key: '34d05a9275ef567f607446cd1822218575fe0788' }, attrs, { class: this.elementClass }), this.hasIcon && h("spw-icon", { key: 'b03781f4f2b740cbff91743bdace8b8cb2a49a57', icon: this.getIcon(this.variant) }), h("slot", { key: 'b2a1e7b049518c9123e962aa641ce332873beb7f' }))));
+        return (h(Host, { key: '191c0dc6f6f12157702513309ee9571fbd0cbcbd' }, h(TagType, Object.assign({ key: 'c13ec9535fe7160799797c7ea25a3e7c310cb771' }, attrs, { class: this.elementClass }), this.hasIcon && h("spw-icon", { key: '38910aed2a214dd079e37833236e3307a21dba8f', icon: this.getIcon(this.variant) }), h("slot", { key: '6cfcc45c9017420cc7f1e2269990e131790bcb07' }))));
     }
     static get style() { return spwTagCss; }
 }, [1, "spw-tag", {

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

@@ -1,4 +1,4 @@
-import { S as SpwTextField$1, d as defineCustomElement$1 } from './p-DibGOHbd.js';
+import { S as SpwTextField$1, d as defineCustomElement$1 } from './p-CahscFgh.js';
 const SpwTextField = SpwTextField$1;
 const defineCustomElement = defineCustomElement$1;

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

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './index.js';
-import { d as defineCustomElement$4 } from './p-CF4CA9QM.js';
-import { d as defineCustomElement$3 } from './p-wxevhJKV.js';
-import { d as defineCustomElement$2 } from './p-BrOEFNbv.js';
+import { d as defineCustomElement$4 } from './p-CwxUBfbv.js';
+import { d as defineCustomElement$3 } from './p-DogcJyQh.js';
+import { d as defineCustomElement$2 } from './p-_q4w18VU.js';
 const spwTextareaCss = "/*! 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-textarea{position:relative}.spw-textarea__input{border:1px solid var(--spw-color-themes-grey-grey-800);border-radius:4px;flex:1;min-height:40px;padding:12px;resize:vertical;width:100%}.spw-textarea__input:hover{outline:4px solid var(--spw-color-themes-grey-grey-300)}.spw-textarea__input:focus,.spw-textarea__input:focus-visible{box-shadow:0 0 0 6px #000;outline:3px solid #fff;outline-offset:0}.spw-textarea--disabled .spw-textarea__input{background:var(--spw-color-themes-grey-grey-100);border-color:var(--spw-color-themes-grey-grey-400);color:var(--spw-color-themes-grey-grey-500);cursor:not-allowed}.spw-textarea--disabled .spw-textarea__input::-moz-placeholder{color:var(--spw-color-themes-grey-grey-500)}.spw-textarea--disabled .spw-textarea__input::placeholder{color:var(--spw-color-themes-grey-grey-500)}.spw-textarea--disabled .spw-textarea__input:focus,.spw-textarea--disabled .spw-textarea__input:focus-visible,.spw-textarea--disabled .spw-textarea__input:hover{outline:none}.spw-textarea--is-error .spw-textarea__input{border-color:var(--spw-colors-states-error-error-300)}.spw-textarea--large .spw-textarea__input{height:60px;line-height:60px;padding:0 24px}.spw-textarea--is-search .spw-textarea__input{padding-right:80px}.spw-textarea__container{align-items:center;display:flex}.spw-textarea__indicator{padding-left:.75rem}.spw-textarea__icon{color:var(--spw-ds-primary);font-size:24px;pointer-events:none;position:absolute;right:30px;top:50%;transform:translateY(-50%)}.-spw-tw-mt-1{margin-top:-.25rem}.spw-tw-mb-2{margin-bottom:.5rem}";
@@ -98,7 +98,7 @@ const SpwTextarea$1 = /*@__PURE__*/ proxyCustomElement(class SpwTextarea extends
         };
     }
     render() {
-        return (h("div", { key: '41bda187f57240937dcdd7f654b8ea0c2b7f57fd', class: this.elementClass }, this.label && h("spw-field-label", { key: '7f6e0ea03fce3716f5fa184ec5fb9e805fb8a70c', label: this.label, name: this.name, required: this.required }), this.assistiveText && (h("spw-field-message", { key: 'd70e5e708cd01c8b3812dc5079804eedebc3b75e', class: "spw-tw-mb-2 -spw-tw-mt-1", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: '3b1ed247ab3cedb6a8b66c48b7e507224219d874', class: "spw-textarea__container" }, h("textarea", { key: '7df8f7ab43379a873f9423dd1ec922e804f40aa5', class: "spw-textarea__input", value: this.internalValue, placeholder: this.placeholder, disabled: this.disabled, name: this.name, id: this.name, rows: this.rows, minLength: this.minLength, maxLength: this.maxLength, required: this.required, onInput: event => this.handleChange(event) })), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
+        return (h("div", { key: '44a87ca6bc067012558daedeb5e9d422cee32e6f', class: this.elementClass }, this.label && h("spw-field-label", { key: '6782f844a1e971b430d1ecbeed2f68efe0de0d19', label: this.label, name: this.name, required: this.required }), this.assistiveText && (h("spw-field-message", { key: '60cdfba45c9461039bcc6dfec86d2edf1e485b77', class: "spw-tw-mb-2 -spw-tw-mt-1", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: '0a9b8ca0b9009d7703790b9f335bcbf039a93578', class: "spw-textarea__container" }, h("textarea", { key: '746e5be8b6435949b1af6bd2a139f28b71dd0d5a', class: "spw-textarea__input", value: this.internalValue, placeholder: this.placeholder, disabled: this.disabled, name: this.name, id: this.name, rows: this.rows, minLength: this.minLength, maxLength: this.maxLength, required: this.required, onInput: event => this.handleChange(event) })), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
     }
     static get formAssociated() { return true; }
     static get watchers() { return {

package/dist/components/spw-theme-provider.js CHANGED Viewed

@@ -59,7 +59,7 @@ const SpwThemeProvider$1 = /*@__PURE__*/ proxyCustomElement(class SpwThemeProvid
         document.documentElement.setAttribute('data-theme', theme);
     }
     render() {
-        return (h("main", { key: '92e750eeb7d9cfb5c45c287e79339e7a36a7aaa3', class: `spw-theme-${this.theme}` }, h("slot", { key: '3d17a62b77a464cbee50f4d91a3c7e3fa6417f6f' })));
+        return (h("main", { key: 'e43b29a2ab255b96dc8a0892239d4b0f160dff56', class: `spw-theme-${this.theme}` }, h("slot", { key: '105c1c1c91794d55b98e27547b2a06e4c7a5036e' })));
     }
     get el() { return this; }
 }, [4, "spw-theme-provider", {

package/dist/components/spw-tile-description.js CHANGED Viewed

@@ -9,7 +9,7 @@ const SpwTileDescription$1 = /*@__PURE__*/ proxyCustomElement(class SpwTileDescr
         this.__attachShadow();
     }
     render() {
-        return (h("div", { key: 'd37dd71f558988cf061279d1c67a1fd05f950376', class: "spw-tile-description" }, h("slot", { key: 'f290ad1a6bfd1af15745164694e84e8d5ddc6215' })));
+        return (h("div", { key: 'd29c67eb4445d2bf50d200570bcef8b0a7df06e4', class: "spw-tile-description" }, h("slot", { key: 'dcfcea58e70bd5dc4bde6a621ca53048659d27a1' })));
     }
     static get style() { return spwTileDescriptionCss; }
 }, [1, "spw-tile-description"]);

package/dist/components/spw-tile-title.js CHANGED Viewed

@@ -9,7 +9,7 @@ const SpwTileTitle$1 = /*@__PURE__*/ proxyCustomElement(class SpwTileTitle exten
         this.__attachShadow();
     }
     render() {
-        return (h("h3", { key: 'e1a925149a384b3edfb0f0ee7d91e7ffaca4e0ad', class: "spw-tile-title" }, h("slot", { key: '3ddfa9f9a5d1f1f512f7d438850950573f01722d' })));
+        return (h("h3", { key: '4084e7952f8637cce68f0a57b88067c8055c9da3', class: "spw-tile-title" }, h("slot", { key: 'f56e710371933b4f0cdd2a15b1e233b331a9a465' })));
     }
     static get style() { return spwTileTitleCss; }
 }, [1, "spw-tile-title"]);

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

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, h, F as Fragment, a as Host } from './index.js';
-import { d as defineCustomElement$2 } from './p-BrOEFNbv.js';
+import { d as defineCustomElement$2 } from './p-_q4w18VU.js';
 const spwTileCss = "/*! 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-tile{display:block;position:relative;text-decoration:none;transition:all .3s ease-in-out}.spw-tile--hoverable:hover{transform:translateY(-5px)}.spw-tile:focus-visible{border-radius:5px;box-shadow:0 0 0 5px #000;outline:3px solid #fff;outline-offset:-1px}.spw-tile--icon{padding:16px 0}.spw-tile--big,.spw-tile--light{border-radius:6px;overflow:hidden;padding-top:60%}@media (min-width:768px){.spw-tile--big{padding-top:110%}}.spw-tile__image,.spw-tile__overlay{height:100%;left:0;position:absolute;top:0;width:100%}.spw-tile__overlay{background:linear-gradient(180deg,transparent,rgba(0,0,0,.6) 65%,rgba(0,0,0,.75));z-index:2}.spw-tile__image{-o-object-fit:cover;object-fit:cover;z-index:1}.spw-tile__button{align-items:center;background:#fff;border:2px solid transparent;border-radius:50%;color:var(--spw-ds-primary);display:inline-flex;font-size:20px;height:48px;justify-content:center;transition:all .2s ease-in;width:48px}.spw-tile:hover .spw-tile__button{background:transparent;border-color:#fff;color:#fff}.spw-tile--icon .spw-tile__content{display:flex;flex-direction:column;gap:12px;padding:0 12px;text-align:center}.spw-tile--icon .spw-tile__content ::slotted(spw-icon){color:var(--spw-ds-primary);font-size:32px}.spw-tile--big .spw-tile__content,.spw-tile--light .spw-tile__content{bottom:0;display:flex;flex-direction:column;gap:16px;left:0;padding:16px;position:absolute;width:100%;z-index:3}.spw-tile--light .spw-tile__content{padding-bottom:24px;text-align:center}";
@@ -58,7 +58,7 @@ const SpwTile$1 = /*@__PURE__*/ proxyCustomElement(class SpwTile extends H {
                 href,
                 target,
             };
-        return (h(Host, { key: 'f78c7078531dbed2268e746bf105a21bd5fcf5f1' }, h(TagType, Object.assign({ key: '94941f19d35f9e97634973507e9854eaf4dfa665' }, attrs, { class: this.elementClass }), this.imageSrc && (this.variant === 'big' || this.variant === 'light') && (h(Fragment, { key: '6d49504c4d358e28e452b24323978df6e2212178' }, h("div", { key: 'b753643526594df6b5c01520b3ee3de2693c63a9', class: "spw-tile__overlay" }), h("img", { key: '4ab4e359cf80da1849d610621e3e22d2df9ce289', src: this.imageSrc, alt: this.imageAlt, class: "spw-tile__image" }))), h("div", { key: 'e7cb3747ac97550f174bcd59196dfa98a9bcd683', class: "spw-tile__content" }, h("slot", { key: '8fdb450b32c3afee46b6c8a16f8f48d8dc5418fa' }), this.href && this.variant === 'big' && (h("span", { key: 'da608c7616bcd675bee95ab63330b187c70712b3', class: "spw-tile__button" }, h("spw-icon", { key: '10ca3d8ae075bcc0a775d3a828724cec34d537d8', icon: "fa-chevron-right" })))))));
+        return (h(Host, { key: 'b10e182a4a2c1481c95bddeff9bacb1af30ec297' }, h(TagType, Object.assign({ key: '0851380bcfd04a1bdb97a0fc7ce2c149fa1016fa' }, attrs, { class: this.elementClass }), this.imageSrc && (this.variant === 'big' || this.variant === 'light') && (h(Fragment, { key: 'efaf43ac641af404f9cf09dbf5d396e80ee0dbfd' }, h("div", { key: '958a2a1e3027d0dc9dc282c9d1b3796817226b40', class: "spw-tile__overlay" }), h("img", { key: 'a6c9efe5c61cdf8382208b6a76f463058d880233', src: this.imageSrc, alt: this.imageAlt, class: "spw-tile__image" }))), h("div", { key: '705a6b31bbaf0ac069cf6faa11fa447e06e89b4f', class: "spw-tile__content" }, h("slot", { key: '7019a6fccca3e196a54e6ae00d1fe4c4df7474cf' }), this.href && this.variant === 'big' && (h("span", { key: 'c835f5b593839de764944b16c9217f8d8dd78bfd', class: "spw-tile__button" }, h("spw-icon", { key: '2448b41b3f3ef35eabf732c8207a08b30ed4d403', icon: "fa-chevron-right" })))))));
     }
     get el() { return this; }
     static get style() { return spwTileCss; }

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

@@ -1,4 +1,4 @@
-import { S as SpwTooltip$1, d as defineCustomElement$1 } from './p-DqtSG4Dc.js';
+import { S as SpwTooltip$1, d as defineCustomElement$1 } from './p-Bja0SU2g.js';
 const SpwTooltip = SpwTooltip$1;
 const defineCustomElement = defineCustomElement$1;