npm - @spw-ds/spw-stencil-library - Versions diffs - 1.2.2 → 1.2.3 - Mend

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

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

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

	@@ -1 +1 @@
1	- {"file":"spw-list-item.entry.cjs.js","mappings":";;;;AAAA,MAAM,cAAc,GAAG,~~krGAAkrG~~;;~~MCO5rG~~,WAAW,GAAA,MAAA;AALxB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AASU,QAAA,IAAO,CAAA,OAAA,GAA4B,SAAS;;AAI5C,QAAA,IAAM,CAAA,MAAA,GAAW,OAAO;;AAExB,QAAA,IAAI,CAAA,IAAA,GAAY,gBAAgB;;AAEhC,QAAA,IAAS,CAAA,SAAA,GAAoB,GAAG;;AAMhC,QAAA,IAAY,CAAA,YAAA,GAAY,mBAAmB;~~AAkIpD~~;~~IAhIC~~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","names":["h","Host"],"sources":["src/components/spw-list/spw-list-item/spw-list-item.scss?tag=spw-list-item&encapsulation=shadow","src/components/spw-list/spw-list-item/spw-list-item.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n\n.spw-list-item {\n position: relative;\n color: var(--spw-color-themes-grey-grey-900);\n transition: all 0.3s ease-in-out;\n text-decoration: none;\n &--hoverable:hover {\n transform: translateX(5px);\n }\n a {\n text-decoration: none;\n }\n &--icon {\n padding-left: 28px;\n }\n &__category {\n display: inline-block;\n position: relative;\n margin-bottom: 6px;\n color: var(--spw-ds-primary);\n font-weight: 700;\n font-size: 16px;\n line-height: 1.5;\n spw-icon {\n position: absolute;\n top: 2px;\n left: -28px;\n }\n &--hoverable {\n cursor: pointer;\n &:hover {\n text-decoration: underline;\n }\n }\n }\n}\n","import { Component, Host, Element, Listen, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list-item',\n styleUrl: 'spw-list-item.scss',\n shadow: true,\n})\nexport class SpwListItem {\n @Element() el: HTMLSpwListItemElement;\n\n /** Type de variante d'élément de liste /\n @Prop() variant?: 'shortcut' \| 'default' = 'default';\n /* Spécifie le lien si nécessaire /\n @Prop() href?: string;\n /* Attribut target, s'applique uniquement si href est rempli /\n @Prop() target: string = '_self';\n /* Spécifie une icône à côté du titre /\n @Prop() icon?: string = 'fa-arrow-right';\n /* Permet de limiter le nombre de lignes du titre et de la description /\n @Prop() lineClamp: string \| 'none' = '3';\n /* Permet de spécifier une catégorie pour l'élément de liste /\n @Prop() category?: string;\n /* Permet de spécifier un lien pour la catégorie /\n @Prop() categoryLink?: string;\n /* Permet de spécifier une icône pour la catégorie */\n @Prop() categoryIcon?: string = 'fa-file-signature';\n\n componentWillLoad() {\n this.applyVariantToChildren();\n }\n\n @Listen('slotchange')\n slotChanged() {\n this.applyVariantToChildren();\n }\n\n private applyVariantToChildren() {\n requestAnimationFrame(() => {\n const variantClass = `--${this.variant}`;\n const iconClass = `--icon`;\n const titleElement = this.el.querySelector('spw-list-title');\n const descriptionElement = this.el.querySelector('spw-list-description');\n\n titleElement && titleElement.classList.add(variantClass);\n titleElement && this.icon && titleElement.setAttribute('icon', this.icon);\n titleElement && titleElement.setAttribute('line-clamp', this.lineClamp);\n descriptionElement && descriptionElement.classList.add(variantClass);\n descriptionElement && this.icon && descriptionElement.classList.add(iconClass);\n descriptionElement && descriptionElement.setAttribute('line-clamp', this.lineClamp);\n });\n }\n\n @Listen('mouseenter')\n onMouseEnter() {\n this.setHovered(true);\n }\n\n @Listen('mouseleave')\n onMouseLeave() {\n this.setHovered(false);\n this.setActive(false);\n }\n\n @Listen('touchstart', { passive: true })\n onTouchStart() {\n this.setActive(true);\n }\n\n @Listen('touchend')\n onTouchEnd() {\n this.setActive(false);\n }\n\n @Listen('mousedown')\n onMouseDown() {\n this.setActive(true);\n }\n\n @Listen('mouseup')\n onMouseUp() {\n this.setActive(false);\n }\n\n @Listen('blur')\n onBlur() {\n this.setActive(false);\n }\n\n @Listen('focus')\n onFocus() {\n this.setActive(true);\n }\n\n private setHovered(isHovered: boolean) {\n const titleElement = this.el.querySelector('spw-list-title');\n if (titleElement && this.href) {\n titleElement.classList.toggle('--hovered', isHovered);\n }\n }\n\n private setActive(isActive: boolean) {\n const titleElement = this.el.querySelector('spw-list-title');\n if (titleElement && this.href) {\n titleElement.classList.toggle('--active', isActive);\n }\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-list-item': true,\n 'spw-list-item--hoverable': !!this.href,\n 'spw-list-item--icon': !!this.icon \|\| !!this.categoryIcon,\n [`spw-list-item--${this.variant}`]: true,\n };\n }\n\n private get elementCatClass(): { [className: string]: boolean } {\n return {\n 'spw-list-item__category': true,\n 'spw-list-item__category--icon': !!this.categoryIcon,\n 'spw-list-item__category--hoverable': !!this.categoryLink,\n };\n }\n\n handleClick() {\n if (this.categoryLink) {\n window.location.href = this.categoryLink;\n }\n }\n\n render() {\n const { href, target } = this;\n const TagType = this.href === undefined ? 'div' : 'a';\n const attrs =\n TagType === 'div'\n ? {}\n : {\n href,\n target,\n };\n return (\n <Host>\n <li class={this.elementClass}>\n {this.category && (\n <span class={this.elementCatClass} onClick={() => this.handleClick()}>\n {this.categoryIcon && <spw-icon icon={this.categoryIcon}></spw-icon>} {this.category}\n </span>\n )}\n <TagType {...attrs}>\n <slot></slot>\n </TagType>\n </li>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-list-item.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/spw-list/spw-list-item/spw-list-item.scss?tag=spw-list-item&encapsulation=shadow","src/components/spw-list/spw-list-item/spw-list-item.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n\n.spw-list-item {\n position: relative;\n color: var(--spw-color-themes-grey-grey-900);\n transition: all 0.3s ease-in-out;\n text-decoration: none;\n :host(.--dark) & {\n color: var(--spw-ds-white);\n }\n &--hoverable:hover {\n transform: translateX(5px);\n }\n a {\n text-decoration: none;\n }\n &--icon {\n padding-left: 28px;\n }\n &__category {\n display: inline-block;\n position: relative;\n margin-bottom: 6px;\n color: var(--spw-ds-primary);\n font-weight: 700;\n font-size: 16px;\n line-height: 1.5;\n spw-icon {\n position: absolute;\n top: 2px;\n left: -28px;\n }\n &--hoverable {\n cursor: pointer;\n &:hover {\n text-decoration: underline;\n }\n }\n }\n}\n","import { Component, Host, Element, Listen, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list-item',\n styleUrl: 'spw-list-item.scss',\n shadow: true,\n})\nexport class SpwListItem {\n @Element() el: HTMLSpwListItemElement;\n\n /** Type de variante d'élément de liste /\n @Prop() variant?: 'shortcut' \| 'default' = 'default';\n /* Spécifie le lien si nécessaire /\n @Prop() href?: string;\n /* Attribut target, s'applique uniquement si href est rempli /\n @Prop() target: string = '_self';\n /* Spécifie une icône à côté du titre /\n @Prop() icon?: string = 'fa-arrow-right';\n /* Permet de limiter le nombre de lignes du titre et de la description /\n @Prop() lineClamp: string \| 'none' = '3';\n /* Permet de spécifier une catégorie pour l'élément de liste /\n @Prop() category?: string;\n /* Permet de spécifier un lien pour la catégorie /\n @Prop() categoryLink?: string;\n /* Permet de spécifier une icône pour la catégorie /\n @Prop() categoryIcon?: string = 'fa-file-signature';\n /* Permet de choisir la surface d'arrière-plan de la liste */\n @Prop() surface?: 'light' \| 'dark' = 'light';\n\n componentWillLoad() {\n this.applyVariantToChildren();\n }\n\n @Listen('slotchange')\n slotChanged() {\n this.applyVariantToChildren();\n }\n\n private applyVariantToChildren() {\n requestAnimationFrame(() => {\n const variantClass = `--${this.variant}`;\n const surfaceClass = `--${this.surface}`;\n const iconClass = `--icon`;\n const titleElement = this.el.querySelector('spw-list-title');\n const descriptionElement = this.el.querySelector('spw-list-description');\n\n titleElement && titleElement.classList.add(variantClass);\n titleElement && titleElement.classList.add(surfaceClass);\n titleElement && this.icon && titleElement.setAttribute('icon', this.icon);\n titleElement && titleElement.setAttribute('line-clamp', this.lineClamp);\n descriptionElement && descriptionElement.classList.add(variantClass);\n descriptionElement && this.icon && descriptionElement.classList.add(iconClass);\n descriptionElement && descriptionElement.setAttribute('line-clamp', this.lineClamp);\n });\n }\n\n @Listen('mouseenter')\n onMouseEnter() {\n this.setHovered(true);\n }\n\n @Listen('mouseleave')\n onMouseLeave() {\n this.setHovered(false);\n this.setActive(false);\n }\n\n @Listen('touchstart', { passive: true })\n onTouchStart() {\n this.setActive(true);\n }\n\n @Listen('touchend')\n onTouchEnd() {\n this.setActive(false);\n }\n\n @Listen('mousedown')\n onMouseDown() {\n this.setActive(true);\n }\n\n @Listen('mouseup')\n onMouseUp() {\n this.setActive(false);\n }\n\n @Listen('blur')\n onBlur() {\n this.setActive(false);\n }\n\n @Listen('focus')\n onFocus() {\n this.setActive(true);\n }\n\n private setHovered(isHovered: boolean) {\n const titleElement = this.el.querySelector('spw-list-title');\n if (titleElement && this.href) {\n titleElement.classList.toggle('--hovered', isHovered);\n }\n }\n\n private setActive(isActive: boolean) {\n const titleElement = this.el.querySelector('spw-list-title');\n if (titleElement && this.href) {\n titleElement.classList.toggle('--active', isActive);\n }\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-list-item': true,\n 'spw-list-item--hoverable': !!this.href,\n 'spw-list-item--icon': !!this.icon \|\| !!this.categoryIcon,\n [`spw-list-item--${this.variant}`]: true,\n };\n }\n\n private get elementCatClass(): { [className: string]: boolean } {\n return {\n 'spw-list-item__category': true,\n 'spw-list-item__category--icon': !!this.categoryIcon,\n 'spw-list-item__category--hoverable': !!this.categoryLink,\n };\n }\n\n handleClick() {\n if (this.categoryLink) {\n window.location.href = this.categoryLink;\n }\n }\n\n render() {\n const { href, target } = this;\n const TagType = this.href === undefined ? 'div' : 'a';\n const attrs =\n TagType === 'div'\n ? {}\n : {\n href,\n target,\n };\n return (\n <Host>\n <li class={this.elementClass}>\n {this.category && (\n <span class={this.elementCatClass} onClick={() => this.handleClick()}>\n {this.categoryIcon && <spw-icon icon={this.categoryIcon}></spw-icon>} {this.category}\n </span>\n )}\n <TagType {...attrs}>\n <slot></slot>\n </TagType>\n </li>\n </Host>\n );\n }\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-list-item.entry.cjs.js","sources":["src/components/spw-list/spw-list-item/spw-list-item.scss?tag=spw-list-item&encapsulation=shadow","src/components/spw-list/spw-list-item/spw-list-item.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n\n.spw-list-item {\n position: relative;\n color: var(--spw-color-themes-grey-grey-900);\n transition: all 0.3s ease-in-out;\n text-decoration: none;\n &--hoverable:hover {\n transform: translateX(5px);\n }\n a {\n text-decoration: none;\n }\n &--icon {\n padding-left: 28px;\n }\n &__category {\n display: inline-block;\n position: relative;\n margin-bottom: 6px;\n color: var(--spw-ds-primary);\n font-weight: 700;\n font-size: 16px;\n line-height: 1.5;\n spw-icon {\n position: absolute;\n top: 2px;\n left: -28px;\n }\n &--hoverable {\n cursor: pointer;\n &:hover {\n text-decoration: underline;\n }\n }\n }\n}\n","import { Component, Host, Element, Listen, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list-item',\n styleUrl: 'spw-list-item.scss',\n shadow: true,\n})\nexport class SpwListItem {\n @Element() el: HTMLSpwListItemElement;\n\n /** Type de variante d'élément de liste /\n @Prop() variant?: 'shortcut' \| 'default' = 'default';\n /* Spécifie le lien si nécessaire /\n @Prop() href?: string;\n /* Attribut target, s'applique uniquement si href est rempli /\n @Prop() target: string = '_self';\n /* Spécifie une icône à côté du titre /\n @Prop() icon?: string = 'fa-arrow-right';\n /* Permet de limiter le nombre de lignes du titre et de la description /\n @Prop() lineClamp: string \| 'none' = '3';\n /* Permet de spécifier une catégorie pour l'élément de liste /\n @Prop() category?: string;\n /* Permet de spécifier un lien pour la catégorie /\n @Prop() categoryLink?: string;\n /* Permet de spécifier une icône pour la catégorie */\n @Prop() categoryIcon?: string = 'fa-file-signature';\n\n componentWillLoad() {\n this.applyVariantToChildren();\n }\n\n @Listen('slotchange')\n slotChanged() {\n this.applyVariantToChildren();\n }\n\n private applyVariantToChildren() {\n requestAnimationFrame(() => {\n const variantClass = `--${this.variant}`;\n const iconClass = `--icon`;\n const titleElement = this.el.querySelector('spw-list-title');\n const descriptionElement = this.el.querySelector('spw-list-description');\n\n titleElement && titleElement.classList.add(variantClass);\n titleElement && this.icon && titleElement.setAttribute('icon', this.icon);\n titleElement && titleElement.setAttribute('line-clamp', this.lineClamp);\n descriptionElement && descriptionElement.classList.add(variantClass);\n descriptionElement && this.icon && descriptionElement.classList.add(iconClass);\n descriptionElement && descriptionElement.setAttribute('line-clamp', this.lineClamp);\n });\n }\n\n @Listen('mouseenter')\n onMouseEnter() {\n this.setHovered(true);\n }\n\n @Listen('mouseleave')\n onMouseLeave() {\n this.setHovered(false);\n this.setActive(false);\n }\n\n @Listen('touchstart', { passive: true })\n onTouchStart() {\n this.setActive(true);\n }\n\n @Listen('touchend')\n onTouchEnd() {\n this.setActive(false);\n }\n\n @Listen('mousedown')\n onMouseDown() {\n this.setActive(true);\n }\n\n @Listen('mouseup')\n onMouseUp() {\n this.setActive(false);\n }\n\n @Listen('blur')\n onBlur() {\n this.setActive(false);\n }\n\n @Listen('focus')\n onFocus() {\n this.setActive(true);\n }\n\n private setHovered(isHovered: boolean) {\n const titleElement = this.el.querySelector('spw-list-title');\n if (titleElement && this.href) {\n titleElement.classList.toggle('--hovered', isHovered);\n }\n }\n\n private setActive(isActive: boolean) {\n const titleElement = this.el.querySelector('spw-list-title');\n if (titleElement && this.href) {\n titleElement.classList.toggle('--active', isActive);\n }\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-list-item': true,\n 'spw-list-item--hoverable': !!this.href,\n 'spw-list-item--icon': !!this.icon \|\| !!this.categoryIcon,\n [`spw-list-item--${this.variant}`]: true,\n };\n }\n\n private get elementCatClass(): { [className: string]: boolean } {\n return {\n 'spw-list-item__category': true,\n 'spw-list-item__category--icon': !!this.categoryIcon,\n 'spw-list-item__category--hoverable': !!this.categoryLink,\n };\n }\n\n handleClick() {\n if (this.categoryLink) {\n window.location.href = this.categoryLink;\n }\n }\n\n render() {\n const { href, target } = this;\n const TagType = this.href === undefined ? 'div' : 'a';\n const attrs =\n TagType === 'div'\n ? {}\n : {\n href,\n target,\n };\n return (\n <Host>\n <li class={this.elementClass}>\n {this.category && (\n <span class={this.elementCatClass} onClick={() => this.handleClick()}>\n {this.categoryIcon && <spw-icon icon={this.categoryIcon}></spw-icon>} {this.category}\n </span>\n )}\n <TagType {...attrs}>\n <slot></slot>\n </TagType>\n </li>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,cAAc,GAAG,~~krGAAkrG~~;;~~MCO5rG~~,WAAW,GAAA,MAAA;AALxB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AASU,QAAA,IAAO,CAAA,OAAA,GAA4B,SAAS;;AAI5C,QAAA,IAAM,CAAA,MAAA,GAAW,OAAO;;AAExB,QAAA,IAAI,CAAA,IAAA,GAAY,gBAAgB;;AAEhC,QAAA,IAAS,CAAA,SAAA,GAAoB,GAAG;;AAMhC,QAAA,IAAY,CAAA,YAAA,GAAY,mBAAmB;~~AAkIpD~~;~~IAhIC~~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"}
1	+ {"version":3,"file":"spw-list-item.entry.cjs.js","sources":["src/components/spw-list/spw-list-item/spw-list-item.scss?tag=spw-list-item&encapsulation=shadow","src/components/spw-list/spw-list-item/spw-list-item.tsx"],"sourcesContent":[":host {\n display: contents;\n}\n\n.spw-list-item {\n position: relative;\n color: var(--spw-color-themes-grey-grey-900);\n transition: all 0.3s ease-in-out;\n text-decoration: none;\n :host(.--dark) & {\n color: var(--spw-ds-white);\n }\n &--hoverable:hover {\n transform: translateX(5px);\n }\n a {\n text-decoration: none;\n }\n &--icon {\n padding-left: 28px;\n }\n &__category {\n display: inline-block;\n position: relative;\n margin-bottom: 6px;\n color: var(--spw-ds-primary);\n font-weight: 700;\n font-size: 16px;\n line-height: 1.5;\n spw-icon {\n position: absolute;\n top: 2px;\n left: -28px;\n }\n &--hoverable {\n cursor: pointer;\n &:hover {\n text-decoration: underline;\n }\n }\n }\n}\n","import { Component, Host, Element, Listen, Prop, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list-item',\n styleUrl: 'spw-list-item.scss',\n shadow: true,\n})\nexport class SpwListItem {\n @Element() el: HTMLSpwListItemElement;\n\n /** Type de variante d'élément de liste /\n @Prop() variant?: 'shortcut' \| 'default' = 'default';\n /* Spécifie le lien si nécessaire /\n @Prop() href?: string;\n /* Attribut target, s'applique uniquement si href est rempli /\n @Prop() target: string = '_self';\n /* Spécifie une icône à côté du titre /\n @Prop() icon?: string = 'fa-arrow-right';\n /* Permet de limiter le nombre de lignes du titre et de la description /\n @Prop() lineClamp: string \| 'none' = '3';\n /* Permet de spécifier une catégorie pour l'élément de liste /\n @Prop() category?: string;\n /* Permet de spécifier un lien pour la catégorie /\n @Prop() categoryLink?: string;\n /* Permet de spécifier une icône pour la catégorie /\n @Prop() categoryIcon?: string = 'fa-file-signature';\n /* Permet de choisir la surface d'arrière-plan de la liste */\n @Prop() surface?: 'light' \| 'dark' = 'light';\n\n componentWillLoad() {\n this.applyVariantToChildren();\n }\n\n @Listen('slotchange')\n slotChanged() {\n this.applyVariantToChildren();\n }\n\n private applyVariantToChildren() {\n requestAnimationFrame(() => {\n const variantClass = `--${this.variant}`;\n const surfaceClass = `--${this.surface}`;\n const iconClass = `--icon`;\n const titleElement = this.el.querySelector('spw-list-title');\n const descriptionElement = this.el.querySelector('spw-list-description');\n\n titleElement && titleElement.classList.add(variantClass);\n titleElement && titleElement.classList.add(surfaceClass);\n titleElement && this.icon && titleElement.setAttribute('icon', this.icon);\n titleElement && titleElement.setAttribute('line-clamp', this.lineClamp);\n descriptionElement && descriptionElement.classList.add(variantClass);\n descriptionElement && this.icon && descriptionElement.classList.add(iconClass);\n descriptionElement && descriptionElement.setAttribute('line-clamp', this.lineClamp);\n });\n }\n\n @Listen('mouseenter')\n onMouseEnter() {\n this.setHovered(true);\n }\n\n @Listen('mouseleave')\n onMouseLeave() {\n this.setHovered(false);\n this.setActive(false);\n }\n\n @Listen('touchstart', { passive: true })\n onTouchStart() {\n this.setActive(true);\n }\n\n @Listen('touchend')\n onTouchEnd() {\n this.setActive(false);\n }\n\n @Listen('mousedown')\n onMouseDown() {\n this.setActive(true);\n }\n\n @Listen('mouseup')\n onMouseUp() {\n this.setActive(false);\n }\n\n @Listen('blur')\n onBlur() {\n this.setActive(false);\n }\n\n @Listen('focus')\n onFocus() {\n this.setActive(true);\n }\n\n private setHovered(isHovered: boolean) {\n const titleElement = this.el.querySelector('spw-list-title');\n if (titleElement && this.href) {\n titleElement.classList.toggle('--hovered', isHovered);\n }\n }\n\n private setActive(isActive: boolean) {\n const titleElement = this.el.querySelector('spw-list-title');\n if (titleElement && this.href) {\n titleElement.classList.toggle('--active', isActive);\n }\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-list-item': true,\n 'spw-list-item--hoverable': !!this.href,\n 'spw-list-item--icon': !!this.icon \|\| !!this.categoryIcon,\n [`spw-list-item--${this.variant}`]: true,\n };\n }\n\n private get elementCatClass(): { [className: string]: boolean } {\n return {\n 'spw-list-item__category': true,\n 'spw-list-item__category--icon': !!this.categoryIcon,\n 'spw-list-item__category--hoverable': !!this.categoryLink,\n };\n }\n\n handleClick() {\n if (this.categoryLink) {\n window.location.href = this.categoryLink;\n }\n }\n\n render() {\n const { href, target } = this;\n const TagType = this.href === undefined ? 'div' : 'a';\n const attrs =\n TagType === 'div'\n ? {}\n : {\n href,\n target,\n };\n return (\n <Host>\n <li class={this.elementClass}>\n {this.category && (\n <span class={this.elementCatClass} onClick={() => this.handleClick()}>\n {this.categoryIcon && <spw-icon icon={this.categoryIcon}></spw-icon>} {this.category}\n </span>\n )}\n <TagType {...attrs}>\n <slot></slot>\n </TagType>\n </li>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":"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"}

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

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

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

	@@ -1 +1 @@
1	- {"file":"spw-list-title.entry.cjs.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,~~g9QAAg9Q~~;;~~MCO39Q~~,YAAY,GAAA,MAAA;;;;AAMvB,IAAA,IAAY,YAAY,GAAA;AACtB,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,KAAK,MAAM;QAC9C,OAAO;AACL,YAAA,gBAAgB,EAAE,IAAI;YACtB,CAAC,CAAA,yBAAA,CAA2B,GAAG,YAAY;AAC3C,YAAA,CAAC,sBAAsB,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;AACrC,YAAA,CAAC,yBAAyB,IAAI,CAAC,SAAS,CAAE,CAAA,GAAG,IAAI;SAClD;;IAGH,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,YAAY,EAAA,EAC1B,IAAI,CAAC,IAAI,IAAIA,OAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAE,IAAI,CAAC,IAAI,EAAa,CAAA,EACpDA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,yBAAyB,EAAA,EAClCA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,8BAA8B,EAAA,EACvCA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACF,CACF,CACD;;;;;;;","names":["h","Host"],"sources":["src/components/spw-list/spw-list-title/spw-list-title.scss?tag=spw-list-title&encapsulation=shadow","src/components/spw-list/spw-list-title/spw-list-title.tsx"],"sourcesContent":["@import '../../../scss/utils/foundations/typography';\n\n:host {\n display: block;\n}\n\n.spw-list-title {\n position: relative;\n transition: all 0.2s linear;\n display: inline-flex;\n spw-icon {\n transition: all 0.2s linear;\n position: absolute;\n top: 4px;\n left: -28px;\n color: var(--spw-ds-primary);\n :host(.--active) & {\n color: var(--spw-ds-active);\n }\n }\n &__content-text {\n display: inline;\n border-bottom: 1px solid transparent;\n transition: all 0.2s linear;\n :host(.--hovered) & {\n border-color: var(--spw-ds-primary);\n }\n :host(.--active) & {\n border-color: var(--spw-ds-active);\n }\n }\n :host(.--default) & {\n @extend .spw-ds-typography-heading-04;\n color: var(--spw-color-themes-grey-grey-900);\n }\n :host(.--shortcut) & {\n @extend .spw-ds-typography-heading-05;\n color: var(--spw-ds-primary);\n }\n :host(.--hovered) & {\n color: var(--spw-ds-primary);\n }\n :host(.--active) & {\n color: var(--spw-ds-active);\n }\n &--has-clamp {\n .spw-list-title__content {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n }\n }\n @for $i from 1 through 10 {\n &--clamp-#{$i} {\n .spw-list-title__content {\n -webkit-line-clamp: $i;\n line-clamp: $i;\n }\n }\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list-title',\n styleUrl: 'spw-list-title.scss',\n shadow: true,\n})\nexport class SpwListTitle {\n /** Spécifie une icône à côté du titre /\n @Prop() icon?: string;\n /* Spécifie un nombre de ligne maximum à afficher */\n @Prop() lineClamp?: string;\n\n private get elementClass(): { [className: string]: boolean } {\n const hasLineClamp = this.lineClamp !== 'none';\n return {\n 'spw-list-title': true,\n [`spw-list-title--has-clamp`]: hasLineClamp,\n [`spw-list-title--icon`]: !!this.icon,\n [`spw-list-title--clamp-${this.lineClamp}`]: true,\n };\n }\n\n render() {\n return (\n <Host>\n <div class={this.elementClass}>\n {this.icon && <spw-icon icon={this.icon}></spw-icon>}\n <div class=\"spw-list-title__content\">\n <div class=\"spw-list-title__content-text\">\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-list-title.entry.cjs.js","mappings":";;;;AAAA,MAAM,eAAe,GAAG,2kRAA2kR;;MCOtlR,YAAY,GAAA,MAAA;;;;AAMvB,IAAA,IAAY,YAAY,GAAA;AACtB,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,KAAK,MAAM;QAC9C,OAAO;AACL,YAAA,gBAAgB,EAAE,IAAI;YACtB,CAAC,CAAA,yBAAA,CAA2B,GAAG,YAAY;AAC3C,YAAA,CAAC,sBAAsB,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;AACrC,YAAA,CAAC,yBAAyB,IAAI,CAAC,SAAS,CAAE,CAAA,GAAG,IAAI;SAClD;;IAGH,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,YAAY,EAAA,EAC1B,IAAI,CAAC,IAAI,IAAIA,OAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAE,IAAI,CAAC,IAAI,EAAa,CAAA,EACpDA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,yBAAyB,EAAA,EAClCA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,8BAA8B,EAAA,EACvCA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACF,CACF,CACD;;;;;;;","names":["h","Host"],"sources":["src/components/spw-list/spw-list-title/spw-list-title.scss?tag=spw-list-title&encapsulation=shadow","src/components/spw-list/spw-list-title/spw-list-title.tsx"],"sourcesContent":["@import '../../../scss/utils/foundations/typography';\n\n:host {\n display: block;\n}\n\n.spw-list-title {\n position: relative;\n transition: all 0.2s linear;\n display: inline-flex;\n spw-icon {\n transition: all 0.2s linear;\n position: absolute;\n top: 4px;\n left: -28px;\n color: var(--spw-ds-primary);\n :host(.--active) & {\n color: var(--spw-ds-active);\n }\n :host(.--dark) & {\n color: var(--spw-ds-white);\n }\n }\n &__content-text {\n display: inline;\n border-bottom: 1px solid transparent;\n transition: all 0.2s linear;\n :host(.--hovered) & {\n border-color: var(--spw-ds-primary);\n }\n :host(.--active) & {\n border-color: var(--spw-ds-active);\n }\n }\n :host(.--default) & {\n @extend .spw-ds-typography-heading-04;\n color: var(--spw-color-themes-grey-grey-900);\n }\n :host(.--shortcut) & {\n @extend .spw-ds-typography-heading-05;\n color: var(--spw-ds-primary);\n }\n :host(.--hovered) & {\n color: var(--spw-ds-primary);\n }\n :host(.--active) & {\n color: var(--spw-ds-active);\n }\n :host(.--dark) & {\n color: var(--spw-ds-white);\n }\n &--has-clamp {\n .spw-list-title__content {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n }\n }\n @for $i from 1 through 10 {\n &--clamp-#{$i} {\n .spw-list-title__content {\n -webkit-line-clamp: $i;\n line-clamp: $i;\n }\n }\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list-title',\n styleUrl: 'spw-list-title.scss',\n shadow: true,\n})\nexport class SpwListTitle {\n /** Spécifie une icône à côté du titre /\n @Prop() icon?: string;\n /* Spécifie un nombre de ligne maximum à afficher */\n @Prop() lineClamp?: string;\n\n private get elementClass(): { [className: string]: boolean } {\n const hasLineClamp = this.lineClamp !== 'none';\n return {\n 'spw-list-title': true,\n [`spw-list-title--has-clamp`]: hasLineClamp,\n [`spw-list-title--icon`]: !!this.icon,\n [`spw-list-title--clamp-${this.lineClamp}`]: true,\n };\n }\n\n render() {\n return (\n <Host>\n <div class={this.elementClass}>\n {this.icon && <spw-icon icon={this.icon}></spw-icon>}\n <div class=\"spw-list-title__content\">\n <div class=\"spw-list-title__content-text\">\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-list-title.entry.cjs.js","sources":["src/components/spw-list/spw-list-title/spw-list-title.scss?tag=spw-list-title&encapsulation=shadow","src/components/spw-list/spw-list-title/spw-list-title.tsx"],"sourcesContent":["@import '../../../scss/utils/foundations/typography';\n\n:host {\n display: block;\n}\n\n.spw-list-title {\n position: relative;\n transition: all 0.2s linear;\n display: inline-flex;\n spw-icon {\n transition: all 0.2s linear;\n position: absolute;\n top: 4px;\n left: -28px;\n color: var(--spw-ds-primary);\n :host(.--active) & {\n color: var(--spw-ds-active);\n }\n }\n &__content-text {\n display: inline;\n border-bottom: 1px solid transparent;\n transition: all 0.2s linear;\n :host(.--hovered) & {\n border-color: var(--spw-ds-primary);\n }\n :host(.--active) & {\n border-color: var(--spw-ds-active);\n }\n }\n :host(.--default) & {\n @extend .spw-ds-typography-heading-04;\n color: var(--spw-color-themes-grey-grey-900);\n }\n :host(.--shortcut) & {\n @extend .spw-ds-typography-heading-05;\n color: var(--spw-ds-primary);\n }\n :host(.--hovered) & {\n color: var(--spw-ds-primary);\n }\n :host(.--active) & {\n color: var(--spw-ds-active);\n }\n &--has-clamp {\n .spw-list-title__content {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n }\n }\n @for $i from 1 through 10 {\n &--clamp-#{$i} {\n .spw-list-title__content {\n -webkit-line-clamp: $i;\n line-clamp: $i;\n }\n }\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list-title',\n styleUrl: 'spw-list-title.scss',\n shadow: true,\n})\nexport class SpwListTitle {\n /** Spécifie une icône à côté du titre /\n @Prop() icon?: string;\n /* Spécifie un nombre de ligne maximum à afficher */\n @Prop() lineClamp?: string;\n\n private get elementClass(): { [className: string]: boolean } {\n const hasLineClamp = this.lineClamp !== 'none';\n return {\n 'spw-list-title': true,\n [`spw-list-title--has-clamp`]: hasLineClamp,\n [`spw-list-title--icon`]: !!this.icon,\n [`spw-list-title--clamp-${this.lineClamp}`]: true,\n };\n }\n\n render() {\n return (\n <Host>\n <div class={this.elementClass}>\n {this.icon && <spw-icon icon={this.icon}></spw-icon>}\n <div class=\"spw-list-title__content\">\n <div class=\"spw-list-title__content-text\">\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,eAAe,GAAG,~~g9QAAg9Q~~;;~~MCO39Q~~,YAAY,GAAA,MAAA;;;;AAMvB,IAAA,IAAY,YAAY,GAAA;AACtB,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,KAAK,MAAM;QAC9C,OAAO;AACL,YAAA,gBAAgB,EAAE,IAAI;YACtB,CAAC,CAAA,yBAAA,CAA2B,GAAG,YAAY;AAC3C,YAAA,CAAC,sBAAsB,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;AACrC,YAAA,CAAC,yBAAyB,IAAI,CAAC,SAAS,CAAE,CAAA,GAAG,IAAI;SAClD;;IAGH,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,YAAY,EAAA,EAC1B,IAAI,CAAC,IAAI,IAAIA,OAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAE,IAAI,CAAC,IAAI,EAAa,CAAA,EACpDA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,yBAAyB,EAAA,EAClCA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,8BAA8B,EAAA,EACvCA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACF,CACF,CACD;;;;;;;"}
1	+ {"version":3,"file":"spw-list-title.entry.cjs.js","sources":["src/components/spw-list/spw-list-title/spw-list-title.scss?tag=spw-list-title&encapsulation=shadow","src/components/spw-list/spw-list-title/spw-list-title.tsx"],"sourcesContent":["@import '../../../scss/utils/foundations/typography';\n\n:host {\n display: block;\n}\n\n.spw-list-title {\n position: relative;\n transition: all 0.2s linear;\n display: inline-flex;\n spw-icon {\n transition: all 0.2s linear;\n position: absolute;\n top: 4px;\n left: -28px;\n color: var(--spw-ds-primary);\n :host(.--active) & {\n color: var(--spw-ds-active);\n }\n :host(.--dark) & {\n color: var(--spw-ds-white);\n }\n }\n &__content-text {\n display: inline;\n border-bottom: 1px solid transparent;\n transition: all 0.2s linear;\n :host(.--hovered) & {\n border-color: var(--spw-ds-primary);\n }\n :host(.--active) & {\n border-color: var(--spw-ds-active);\n }\n }\n :host(.--default) & {\n @extend .spw-ds-typography-heading-04;\n color: var(--spw-color-themes-grey-grey-900);\n }\n :host(.--shortcut) & {\n @extend .spw-ds-typography-heading-05;\n color: var(--spw-ds-primary);\n }\n :host(.--hovered) & {\n color: var(--spw-ds-primary);\n }\n :host(.--active) & {\n color: var(--spw-ds-active);\n }\n :host(.--dark) & {\n color: var(--spw-ds-white);\n }\n &--has-clamp {\n .spw-list-title__content {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n }\n }\n @for $i from 1 through 10 {\n &--clamp-#{$i} {\n .spw-list-title__content {\n -webkit-line-clamp: $i;\n line-clamp: $i;\n }\n }\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list-title',\n styleUrl: 'spw-list-title.scss',\n shadow: true,\n})\nexport class SpwListTitle {\n /** Spécifie une icône à côté du titre /\n @Prop() icon?: string;\n /* Spécifie un nombre de ligne maximum à afficher */\n @Prop() lineClamp?: string;\n\n private get elementClass(): { [className: string]: boolean } {\n const hasLineClamp = this.lineClamp !== 'none';\n return {\n 'spw-list-title': true,\n [`spw-list-title--has-clamp`]: hasLineClamp,\n [`spw-list-title--icon`]: !!this.icon,\n [`spw-list-title--clamp-${this.lineClamp}`]: true,\n };\n }\n\n render() {\n return (\n <Host>\n <div class={this.elementClass}>\n {this.icon && <spw-icon icon={this.icon}></spw-icon>}\n <div class=\"spw-list-title__content\">\n <div class=\"spw-list-title__content-text\">\n <slot></slot>\n </div>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,eAAe,GAAG,2kRAA2kR;;MCOtlR,YAAY,GAAA,MAAA;;;;AAMvB,IAAA,IAAY,YAAY,GAAA;AACtB,QAAA,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,KAAK,MAAM;QAC9C,OAAO;AACL,YAAA,gBAAgB,EAAE,IAAI;YACtB,CAAC,CAAA,yBAAA,CAA2B,GAAG,YAAY;AAC3C,YAAA,CAAC,sBAAsB,GAAG,CAAC,CAAC,IAAI,CAAC,IAAI;AACrC,YAAA,CAAC,yBAAyB,IAAI,CAAC,SAAS,CAAE,CAAA,GAAG,IAAI;SAClD;;IAGH,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,IAAI,CAAC,YAAY,EAAA,EAC1B,IAAI,CAAC,IAAI,IAAIA,OAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAE,IAAI,CAAC,IAAI,EAAa,CAAA,EACpDA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,yBAAyB,EAAA,EAClCA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,8BAA8B,EAAA,EACvCA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACF,CACF,CACD;;;;;;;"}

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

@@ -9,6 +9,24 @@ const SpwList = class {
         index.registerInstance(this, hostRef);
         /** Spécifie l'écart entre les éléments de liste */
         this.gap = 'medium';
+        /** Permet de choisir la surface d'arrière-plan de la liste */
+        this.surface = 'light';
+    }
+    componentWillLoad() {
+        this.applyVariantToChildren();
+    }
+    slotChanged() {
+        this.applyVariantToChildren();
+    }
+    applyVariantToChildren() {
+        requestAnimationFrame(() => {
+            const variantClass = `--${this.surface}`;
+            const contentElements = this.el.querySelectorAll('spw-list-item');
+            contentElements.forEach(contentElement => {
+                contentElement.classList.add(variantClass);
+                contentElement.setAttribute('surface', this.surface);
+            });
+        });
     }
     get elementClass() {
         return {
@@ -17,8 +35,9 @@ const SpwList = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: '7474a92f800b0e42ee4f7ae928602fab40678129' }, index.h("ul", { key: 'bb478eb83d2b3533c70f74a6c4054bd5c8985883', class: this.elementClass }, index.h("slot", { key: 'ec64155dd2191f5f751611729b814e4228c19ec3' }))));
+        return (index.h(index.Host, { key: 'b4148947174922198db9c5d900e0bd3e12dc3463' }, index.h("ul", { key: '100ab0ec463be6a6c94aa5853c6b4cadc95f8f55', class: this.elementClass }, index.h("slot", { key: 'b0a7ee73af4a21f35aa90b0eb77522b0d9679e27' }))));
     }
+    get el() { return index.getElement(this); }
 };
 SpwList.style = spwListCss;

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

	@@ -1 +1 @@
1	- {"file":"spw-list.entry.cjs.js","mappings":";;;;AAAA,MAAM,UAAU,GAAG,wsFAAwsF;;MCO9sF,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;;~~AAOU~~,QAAA,IAAG,CAAA,GAAA,GAAkC,QAAQ;~~AAkBtD~~;~~AAhBC~~,IAAA,IAAY,YAAY,GAAA;QACtB,OAAO;AACL,YAAA,UAAU,EAAE,IAAI;AAChB,YAAA,CAAC,aAAa,IAAI,CAAC,GAAG,CAAE,CAAA,GAAG,IAAI;SAChC;;IAGH,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAI,KAAK,EAAE,IAAI,CAAC,YAAY,EAAA,EAC1BA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACV,CACA~~;;;;;;;~~","names":["h","Host"],"sources":["src/components/spw-list/spw-list.scss?tag=spw-list&encapsulation=shadow","src/components/spw-list/spw-list.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-list {\n display: flex;\n flex-direction: column;\n &--small {\n gap: 12px;\n }\n &--medium {\n gap: 24px;\n }\n &--large {\n gap: 32px;\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list',\n styleUrl: 'spw-list.scss',\n shadow: true,\n})\nexport class SpwList {\n /** Spécifie l'écart entre les éléments de liste */\n @Prop() gap?: 'small' \| 'medium' \| 'large' = 'medium';\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-list': true,\n [`spw-list--${this.gap}`]: true,\n };\n }\n\n render() {\n return (\n <Host>\n <ul class={this.elementClass}>\n <slot></slot>\n </ul>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"spw-list.entry.cjs.js","mappings":";;;;AAAA,MAAM,UAAU,GAAG,wsFAAwsF;;MCO9sF,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAQU,QAAA,IAAG,CAAA,GAAA,GAAkC,QAAQ;;AAE7C,QAAA,IAAO,CAAA,OAAA,GAAsB,OAAO;AAuC7C;IArCC,iBAAiB,GAAA;QACf,IAAI,CAAC,sBAAsB,EAAE;;IAI/B,WAAW,GAAA;QACT,IAAI,CAAC,sBAAsB,EAAE;;IAGvB,sBAAsB,GAAA;QAC5B,qBAAqB,CAAC,MAAK;AACzB,YAAA,MAAM,YAAY,GAAG,CAAA,EAAA,EAAK,IAAI,CAAC,OAAO,EAAE;YACxC,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,eAAe,CAAC;AAEjE,YAAA,eAAe,CAAC,OAAO,CAAC,cAAc,IAAG;AACvC,gBAAA,cAAc,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC;gBAC1C,cAAc,CAAC,YAAY,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC;AACtD,aAAC,CAAC;AACJ,SAAC,CAAC;;AAGJ,IAAA,IAAY,YAAY,GAAA;QACtB,OAAO;AACL,YAAA,UAAU,EAAE,IAAI;AAChB,YAAA,CAAC,aAAa,IAAI,CAAC,GAAG,CAAE,CAAA,GAAG,IAAI;SAChC;;IAGH,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAI,KAAK,EAAE,IAAI,CAAC,YAAY,EAAA,EAC1BA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACV,CACA;;;;;;;;","names":["h","Host"],"sources":["src/components/spw-list/spw-list.scss?tag=spw-list&encapsulation=shadow","src/components/spw-list/spw-list.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-list {\n display: flex;\n flex-direction: column;\n &--small {\n gap: 12px;\n }\n &--medium {\n gap: 24px;\n }\n &--large {\n gap: 32px;\n }\n}\n","import { Component, Prop, Element, Listen, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list',\n styleUrl: 'spw-list.scss',\n shadow: true,\n})\nexport class SpwList {\n @Element() el: HTMLSpwListElement;\n /** Spécifie l'écart entre les éléments de liste /\n @Prop() gap?: 'small' \| 'medium' \| 'large' = 'medium';\n /* Permet de choisir la surface d'arrière-plan de la liste */\n @Prop() surface?: 'light' \| 'dark' = 'light';\n\n componentWillLoad() {\n this.applyVariantToChildren();\n }\n\n @Listen('slotchange')\n slotChanged() {\n this.applyVariantToChildren();\n }\n\n private applyVariantToChildren() {\n requestAnimationFrame(() => {\n const variantClass = `--${this.surface}`;\n const contentElements = this.el.querySelectorAll('spw-list-item');\n\n contentElements.forEach(contentElement => {\n contentElement.classList.add(variantClass);\n contentElement.setAttribute('surface', this.surface);\n });\n });\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-list': true,\n [`spw-list--${this.gap}`]: true,\n };\n }\n\n render() {\n return (\n <Host>\n <ul class={this.elementClass}>\n <slot></slot>\n </ul>\n </Host>\n );\n }\n}\n"],"version":3}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"spw-list.entry.cjs.js","sources":["src/components/spw-list/spw-list.scss?tag=spw-list&encapsulation=shadow","src/components/spw-list/spw-list.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-list {\n display: flex;\n flex-direction: column;\n &--small {\n gap: 12px;\n }\n &--medium {\n gap: 24px;\n }\n &--large {\n gap: 32px;\n }\n}\n","import { Component, Prop, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list',\n styleUrl: 'spw-list.scss',\n shadow: true,\n})\nexport class SpwList {\n /** Spécifie l'écart entre les éléments de liste */\n @Prop() gap?: 'small' \| 'medium' \| 'large' = 'medium';\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-list': true,\n [`spw-list--${this.gap}`]: true,\n };\n }\n\n render() {\n return (\n <Host>\n <ul class={this.elementClass}>\n <slot></slot>\n </ul>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,UAAU,GAAG,wsFAAwsF;;MCO9sF,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;;~~AAOU~~,QAAA,IAAG,CAAA,GAAA,GAAkC,QAAQ;~~AAkBtD~~;~~AAhBC~~,IAAA,IAAY,YAAY,GAAA;QACtB,OAAO;AACL,YAAA,UAAU,EAAE,IAAI;AAChB,YAAA,CAAC,aAAa,IAAI,CAAC,GAAG,CAAE,CAAA,GAAG,IAAI;SAChC;;IAGH,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAI,KAAK,EAAE,IAAI,CAAC,YAAY,EAAA,EAC1BA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACV,CACA~~;;;;;;;~~"}
1	+ {"version":3,"file":"spw-list.entry.cjs.js","sources":["src/components/spw-list/spw-list.scss?tag=spw-list&encapsulation=shadow","src/components/spw-list/spw-list.tsx"],"sourcesContent":[":host {\n display: block;\n}\n\n.spw-list {\n display: flex;\n flex-direction: column;\n &--small {\n gap: 12px;\n }\n &--medium {\n gap: 24px;\n }\n &--large {\n gap: 32px;\n }\n}\n","import { Component, Prop, Element, Listen, Host, h } from '@stencil/core';\n\n@Component({\n tag: 'spw-list',\n styleUrl: 'spw-list.scss',\n shadow: true,\n})\nexport class SpwList {\n @Element() el: HTMLSpwListElement;\n /** Spécifie l'écart entre les éléments de liste /\n @Prop() gap?: 'small' \| 'medium' \| 'large' = 'medium';\n /* Permet de choisir la surface d'arrière-plan de la liste */\n @Prop() surface?: 'light' \| 'dark' = 'light';\n\n componentWillLoad() {\n this.applyVariantToChildren();\n }\n\n @Listen('slotchange')\n slotChanged() {\n this.applyVariantToChildren();\n }\n\n private applyVariantToChildren() {\n requestAnimationFrame(() => {\n const variantClass = `--${this.surface}`;\n const contentElements = this.el.querySelectorAll('spw-list-item');\n\n contentElements.forEach(contentElement => {\n contentElement.classList.add(variantClass);\n contentElement.setAttribute('surface', this.surface);\n });\n });\n }\n\n private get elementClass(): { [className: string]: boolean } {\n return {\n 'spw-list': true,\n [`spw-list--${this.gap}`]: true,\n };\n }\n\n render() {\n return (\n <Host>\n <ul class={this.elementClass}>\n <slot></slot>\n </ul>\n </Host>\n );\n }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,UAAU,GAAG,wsFAAwsF;;MCO9sF,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAQU,QAAA,IAAG,CAAA,GAAA,GAAkC,QAAQ;;AAE7C,QAAA,IAAO,CAAA,OAAA,GAAsB,OAAO;AAuC7C;IArCC,iBAAiB,GAAA;QACf,IAAI,CAAC,sBAAsB,EAAE;;IAI/B,WAAW,GAAA;QACT,IAAI,CAAC,sBAAsB,EAAE;;IAGvB,sBAAsB,GAAA;QAC5B,qBAAqB,CAAC,MAAK;AACzB,YAAA,MAAM,YAAY,GAAG,CAAA,EAAA,EAAK,IAAI,CAAC,OAAO,EAAE;YACxC,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,eAAe,CAAC;AAEjE,YAAA,eAAe,CAAC,OAAO,CAAC,cAAc,IAAG;AACvC,gBAAA,cAAc,CAAC,SAAS,CAAC,GAAG,CAAC,YAAY,CAAC;gBAC1C,cAAc,CAAC,YAAY,CAAC,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC;AACtD,aAAC,CAAC;AACJ,SAAC,CAAC;;AAGJ,IAAA,IAAY,YAAY,GAAA;QACtB,OAAO;AACL,YAAA,UAAU,EAAE,IAAI;AAChB,YAAA,CAAC,aAAa,IAAI,CAAC,GAAG,CAAE,CAAA,GAAG,IAAI;SAChC;;IAGH,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,IAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAI,KAAK,EAAE,IAAI,CAAC,YAAY,EAAA,EAC1BA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACV,CACA;;;;;;;;"}

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

@@ -138,7 +138,7 @@ const KEYFRAMES = {
     ],
 };
-const spwModalCss = "/*! 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-modal{align-items:center;display:none;height:100%;justify-content:center;left:0;overflow-y:auto;position:fixed;top:0;width:100%;z-index:1060}.spw-modal--opened{display:flex}.spw-modal__overlay{background:#000;height:100%;left:0;opacity:.7;position:absolute;top:0;width:100%;z-index:0}.spw-modal__content-container{align-items:stretch;background-color:#fff;border-radius:var(--spw-spacings-border-radius-lg);box-shadow:var(--spw-effect-elevation-6);box-sizing:border-box;display:flex;justify-content:center;overflow:hidden;position:absolute;width:90%}.spw-modal__content-container--small{max-width:480px}.spw-modal__content-container--medium{max-width:600px}.spw-modal__content-container--large{max-width:768px}.spw-modal__content-container--fluid{max-width:100%}.spw-modal__content{border:1px solid var(--spw-color-themes-grey-grey-300);display:flex;flex-direction:column;max-height:90vh;overflow-y:auto;width:100%}.spw-modal--sticky-buttons .spw-modal__content{overflow-y:visible}.spw-modal__icon-container{align-items:center;align-self:stretch;background-color:#fff;display:flex;justify-content:center;width:32px}.spw-modal__header{align-items:center;border-radius:1px 1px 0 0;box-sizing:border-box;color:var(--spw-colors-support-grey-grey-900);display:flex;justify-content:space-between;margin-bottom:12px;margin-top:6px;padding:24px 24px 0}.spw-modal__caption{word-wrap:break-word;overflow:hidden;white-space:pre-wrap}.spw-modal__header h2{color:var(--spw-colors-support-grey-grey-900);font-size:18px;margin:0}.spw-modal__header button{background:none;border:none;cursor:pointer;font-size:1.5em;padding:0}.spw-modal__close-button{cursor:pointer;font-size:21px;position:absolute;right:12px;top:12px}.spw-modal__close-button:hover{opacity:.7}.spw-modal__body{box-sizing:border-box;color:var(--spw-colors-support-grey-grey-700);flex:1;font-size:16px;margin-bottom:12px;padding:0 24px}.spw-modal--sticky-buttons .spw-modal__body{overflow-y:auto}.spw-modal__buttons ::slotted([slot=buttons]){padding:12px 24px 24px}.spw-modal__footer--buttons-present ::slotted(*){display:flex;gap:12px;justify-content:flex-end;padding:8px 24px 24px}.spw-modal__content-container--small .spw-modal__footer--buttons-present ::slotted(*){flex-direction:column;gap:8px}.spw-modal__content-container--medium .spw-modal__footer--buttons-present ::slotted(*){display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.spw-modal__border{align-items:center;display:flex;flex-grow:1;font-size:1.5em;justify-content:center;width:100%}";
+const spwModalCss = "/*! 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-modal{align-items:center;display:none;height:100%;justify-content:center;left:0;overflow-y:auto;position:fixed;top:0;width:100%;z-index:1060}.spw-modal--opened{display:flex}.spw-modal__overlay{background:#000;height:100%;left:0;opacity:.7;position:absolute;top:0;width:100%;z-index:0}.spw-modal__content-container{align-items:stretch;background-color:#fff;border-radius:var(--spw-spacings-border-radius-lg);box-shadow:var(--spw-effect-elevation-6);box-sizing:border-box;display:flex;justify-content:center;overflow:hidden;position:absolute;width:90%}.spw-modal__content-container--small{max-width:480px}.spw-modal__content-container--medium{max-width:600px}.spw-modal__content-container--large{max-width:768px}.spw-modal__content-container--fluid{max-width:100%}.spw-modal__content{border:1px solid var(--spw-color-themes-grey-grey-300);display:flex;flex-direction:column;max-height:90vh;overflow-y:auto;width:100%}.spw-modal--sticky-buttons .spw-modal__content{overflow-y:visible}.spw-modal__icon-container{align-items:center;align-self:stretch;background-color:#fff;display:flex;justify-content:center;width:32px}.spw-modal__header{align-items:center;border-radius:1px 1px 0 0;box-sizing:border-box;color:var(--spw-colors-support-grey-grey-900);display:flex;justify-content:space-between;margin-bottom:12px;margin-top:6px;padding:24px 24px 0}.spw-modal__caption{word-wrap:break-word;overflow:hidden;white-space:pre-wrap}.spw-modal__header h2{color:var(--spw-colors-support-grey-grey-900);font-size:18px;margin:0}.spw-modal__header button{background:none;border:none;cursor:pointer;font-size:1.5em;padding:0}.spw-modal__close-button{cursor:pointer;font-size:21px;position:absolute;right:12px;top:12px}.spw-modal__close-button:hover{opacity:.7}.spw-modal__body{box-sizing:border-box;color:var(--spw-colors-support-grey-grey-700);flex:1;font-size:16px;margin-bottom:12px;padding:0 24px}.spw-modal--sticky-buttons .spw-modal__body{overflow-y:auto}.spw-modal__buttons{padding-top:12px}.spw-modal__buttons ::slotted([slot=buttons]){padding:0 24px 24px}.spw-modal__footer--buttons-present ::slotted(*){display:flex;gap:12px;justify-content:flex-end;padding:8px 24px 24px}.spw-modal__content-container--small .spw-modal__footer--buttons-present ::slotted(*){flex-direction:column;gap:8px}.spw-modal__content-container--medium .spw-modal__footer--buttons-present ::slotted(*){display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.spw-modal__border{align-items:center;display:flex;flex-grow:1;font-size:1.5em;justify-content:center;width:100%}";
 const SpwModal = class {
     constructor(hostRef) {
@@ -256,6 +256,7 @@ const SpwModal = class {
         }
     }
     close() {
+        this.stopAllVideos();
         try {
             const anim = animationTo(this.modalContainer, KEYFRAMES.fadeOut, {
                 duration: 200,
@@ -270,6 +271,12 @@ const SpwModal = class {
             this.spwModalClose.emit();
         }
     }
+    stopAllVideos() {
+        const iframes = this.hostElement.querySelectorAll('iframe');
+        iframes.forEach(iframe => {
+            iframe.src = iframe.src;
+        });
+    }
     doBeforeClose(trigger) {
         const triggers = [];
         triggers.push(trigger);
@@ -294,7 +301,7 @@ const SpwModal = class {
         };
     }
     render() {
-        return (index.h(index.Host, { key: 'ef3f979574368eb716f783a10b0df51de505844d' }, index.h("div", { key: 'd3de3986ed767588fbbc33771f5a2ec96950c814', ref: el => (this.modalContainer = el), class: this.elementClass }, index.h("div", { key: 'e838b0d47874973d88bd325cadafcbccecd62e71', class: "spw-modal__overlay", onClick: () => this.handleOverlayClick() }), index.h("div", { key: '959a56f373b62d3905ca072f842270d50f7974e9', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabindex: "0" }), index.h("div", { key: '5a4e4d7e92007969e2bdfbccb8a30901448edaa4', class: `spw-modal__content-container spw-modal__content-container--${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, index.h("div", { key: 'ff3c6bd78a3aa647a5fc10b007219bfa0a406fbc', class: "spw-modal__content" }, index.h("div", { key: '78448d8952820d8d1b32c8633642daca6e6eaa61', class: "spw-modal__header" }, index.h("h2", { key: '64cd4b7a37899ff59b94cdfaeb24841c185ff68d', class: "spw-modal__caption" }, this.caption), this.showCloseButton && (index.h("spw-icon", { key: '6ccf7739a69cc24dd7d05ee73851bdc9391e63d0', class: "spw-modal__close-button", ref: el => (this.closeButton = el), icon: "fa-xmark", onClick: () => this.doBeforeClose('CLOSE_BUTTON') }))), index.h("div", { key: '588bb35bb2dc1cdff8d85911851fa3acbd2e36c4', class: "spw-modal__body" }, index.h("slot", { key: 'b9e689f2f08aa6456eaeb4481ac09bf7841ded24', name: "content" })), index.h("div", { key: '7d66d94b7de6b109d9897d44329c897822f70179', class: "spw-modal__buttons" }, index.h("slot", { key: '052f64558204a71b45cf367026c5213939645ba4', name: "buttons" })))), index.h("div", { key: '65632a2bcb8d66ab99f45a20e159caaf44a3cec7', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
+        return (index.h(index.Host, { key: '48c698e01ba5d0545c04246eaddbde29a9cae6b9' }, index.h("div", { key: 'a82e49fb97ee9d19dd1fc4fcde824e408cbdef09', ref: el => (this.modalContainer = el), class: this.elementClass }, index.h("div", { key: '35eb6c15f52d877cf0089904238651f39d66c964', class: "spw-modal__overlay", onClick: () => this.handleOverlayClick() }), index.h("div", { key: 'cff9c1866bfba1349853f075868ae1cddb8f4a03', "data-focus-trap-edge": true, onFocus: this.handleTopFocus, tabindex: "0" }), index.h("div", { key: '44c011464dbea7f7e41c33d36c703689f0953dff', class: `spw-modal__content-container spw-modal__content-container--${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, index.h("div", { key: '2b8c969ed7a5d0ff31b1993ba3cf6582dcfd3a4a', class: "spw-modal__content" }, index.h("div", { key: '9a8857bfae65ab5faa7df24591090a073e7b8a7f', class: "spw-modal__header" }, index.h("h2", { key: 'adb8a929be3706f248767beac148efd1c5ab02ba', class: "spw-modal__caption" }, this.caption), this.showCloseButton && (index.h("spw-icon", { key: '0a295da24d9deec49c7cb6dca7c9b02478aaedf8', class: "spw-modal__close-button", ref: el => (this.closeButton = el), icon: "fa-xmark", onClick: () => this.doBeforeClose('CLOSE_BUTTON') }))), index.h("div", { key: '81a2f2838737c49291eea6c571db70d2c5858141', class: "spw-modal__body" }, index.h("slot", { key: '2641d4d98bb5e4b3a2bd0b4fcff1587a7e071337', name: "content" })), index.h("div", { key: '640ae662d1b7e4a9d3fac0abe71a6e548d80a298', class: "spw-modal__buttons" }, index.h("slot", { key: '1cc48d97165b66e05dc2cce809ac9b66f9893a64', name: "buttons" })))), index.h("div", { key: 'c6bf055784ae5808d82b0fea5fac6e34ca9d9eca', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

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

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