@spw-ds/spw-stencil-library 1.14.0 → 1.14.2

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

@@ -0,0 +1,507 @@
+import { Host, h } from "@stencil/core";
+import { queryShadowRoot, isHidden, isFocusable } from "../../utils/focus-trap";
+import { animationTo } from "../../utils/animation";
+const SLIDE_KEYFRAMES = {
+    left: {
+        open: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(-100%)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(0)' },
+        ],
+        close: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(0)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(-100%)' },
+        ],
+    },
+    right: {
+        open: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(100%)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(0)' },
+        ],
+        close: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(0)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(100%)' },
+        ],
+    },
+    top: {
+        open: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(-100%)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(0)' },
+        ],
+        close: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(0)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(-100%)' },
+        ],
+    },
+    bottom: {
+        open: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(100%)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(0)' },
+        ],
+        close: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(0)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(100%)' },
+        ],
+    },
+};
+export class SpwDrawer {
+    constructor() {
+        /** Indique si le drawer est ouvert ou fermé, mutable et reflété dans le DOM */
+        this.opened = false;
+        this.showDrawer = this.opened || false;
+        /** Titre du drawer */
+        this.caption = 'Titre du drawer';
+        /** Texte du bouton de fermeture */
+        this.closeButtonText = 'Fermer';
+        /** Indique si la fermeture du drawer est possible en cliquant sur l'overlay */
+        this.closeOnOverlayClick = true;
+        /** Position du drawer : 'left', 'right', 'top' ou 'bottom' */
+        this.position = 'right';
+        /** Taille du drawer (largeur pour left/right) : 'small', 'medium', 'large' ou 'full' */
+        this.size = 'medium';
+        /** Indique si le bouton de fermeture est visible */
+        this.showCloseButton = true;
+        /** Indique si le titre est visible */
+        this.showCaption = true;
+        /** Indique si l'overlay (fond sombre) est visible */
+        this.modal = true;
+        this.slotFooterPresent = false;
+        this.focusableElements = [];
+        this.handleTriggerClick = (event) => {
+            const path = event.composedPath();
+            const trigger = path.find(el => { var _a; return el instanceof HTMLElement && ((_a = el.hasAttribute) === null || _a === void 0 ? void 0 : _a.call(el, 'data-drawer-trigger')); });
+            if (trigger) {
+                const drawerId = trigger.getAttribute('data-drawer-trigger');
+                if (drawerId === this.hostElement.id) {
+                    this.opened = true;
+                }
+            }
+        };
+        this.handleCloseAttribute = (event) => {
+            const path = event.composedPath();
+            const trigger = path.find(el => { var _a; return el instanceof HTMLElement && ((_a = el.hasAttribute) === null || _a === void 0 ? void 0 : _a.call(el, 'data-drawer-close')); });
+            if (trigger) {
+                const drawerId = trigger.getAttribute('data-drawer-close');
+                if (drawerId === this.hostElement.id) {
+                    this.opened = false;
+                }
+            }
+        };
+        this.handleKeypress = (event) => {
+            if (this.showDrawer && event.key === 'Escape') {
+                this.doBeforeClose('ESCAPE_KEY');
+            }
+        };
+        this.handleBottomFocus = () => {
+            this.attemptFocus(this.getFirstFocusableElement());
+        };
+    }
+    /**
+     * Méthode publique pour ouvrir le drawer programmatiquement
+     */
+    async openDrawer() {
+        this.opened = true;
+    }
+    /**
+     * Méthode publique pour fermer le drawer programmatiquement
+     */
+    async closeDrawer() {
+        this.doBeforeClose('PROGRAMMATIC');
+    }
+    componentDidLoad() {
+        this.focusableElements = queryShadowRoot(this.hostElement.shadowRoot, el => isHidden(el) || el.matches('[data-focus-trap-edge]'), isFocusable);
+        window.addEventListener('click', this.handleTriggerClick, { capture: true });
+        window.addEventListener('click', this.handleCloseAttribute, { capture: true });
+        window.addEventListener('keydown', this.handleKeypress);
+    }
+    disconnectedCallback() {
+        window.removeEventListener('click', this.handleTriggerClick);
+        window.removeEventListener('click', this.handleCloseAttribute);
+        window.removeEventListener('keydown', this.handleKeypress);
+    }
+    getFirstFocusableElement() {
+        return this.focusableElements[0];
+    }
+    attemptFocus(element) {
+        if (element == null) {
+            setTimeout(() => {
+                var _a;
+                (_a = this.closeButtonEl) === null || _a === void 0 ? void 0 : _a.focus();
+            });
+            return;
+        }
+        setTimeout(() => {
+            element.focus();
+        }, 0);
+    }
+    getSiblings() {
+        const parent = this.hostElement.parentElement;
+        if (!parent)
+            return [];
+        return Array.from(parent.children).filter(el => el !== this.hostElement);
+    }
+    setInert(inert) {
+        this.getSiblings().forEach(el => {
+            if (inert) {
+                el.setAttribute('inert', '');
+            }
+            else {
+                el.removeAttribute('inert');
+            }
+        });
+    }
+    open() {
+        this.showDrawer = true;
+        this.setInert(true);
+        requestAnimationFrame(() => {
+            if (this.drawerContent) {
+                this.drawerContent.scrollTop = 0;
+            }
+        });
+        try {
+            const keyframes = SLIDE_KEYFRAMES[this.position];
+            const anim = animationTo(this.drawerPanel, keyframes.open, { duration: 250 });
+            anim.addEventListener('finish', () => {
+                this.attemptFocus(this.getFirstFocusableElement());
+                this.spwDrawerOpen.emit();
+            });
+        }
+        catch (err) {
+            this.attemptFocus(this.getFirstFocusableElement());
+            this.spwDrawerOpen.emit();
+        }
+    }
+    close() {
+        this.setInert(false);
+        try {
+            const keyframes = SLIDE_KEYFRAMES[this.position];
+            const anim = animationTo(this.drawerPanel, keyframes.close, { duration: 250 });
+            anim.addEventListener('finish', () => {
+                this.showDrawer = false;
+                this.spwDrawerClose.emit();
+            });
+        }
+        catch (err) {
+            this.showDrawer = false;
+            this.spwDrawerClose.emit();
+        }
+    }
+    openedChanged(newValue) {
+        newValue === true ? this.open() : this.close();
+    }
+    handleOverlayClick() {
+        if (this.closeOnOverlayClick) {
+            this.doBeforeClose('BACKDROP');
+        }
+    }
+    doBeforeClose(trigger) {
+        const triggers = [];
+        triggers.push(trigger);
+        const prevented = triggers.some((event) => event.defaultPrevented);
+        if (!prevented) {
+            this.opened = false;
+        }
+    }
+    get containerClass() {
+        return {
+            'spw-drawer': true,
+            'spw-drawer--opened': this.showDrawer,
+            [`spw-drawer--${this.position}`]: true,
+        };
+    }
+    get panelClass() {
+        return {
+            'spw-drawer__panel': true,
+            [`spw-drawer__panel--${this.size}`]: true,
+            [`spw-drawer__panel--${this.position}`]: true,
+        };
+    }
+    render() {
+        return (h(Host, { key: '1884a1b336c6eb2d225277379c005daf7530be6f' }, h("div", { key: '95a7e553242502ad92d70d468cfd69738b27d950', class: this.containerClass }, this.modal && h("div", { key: '68ad5a5c2406036e36a3c22819e7e946dc9abfb9', class: "spw-drawer__overlay", onClick: () => this.handleOverlayClick() }), h("div", { key: 'f3631ae7ddcfd2eeae47f92973d54fea7d2dfc31', ref: el => (this.drawerPanel = el), class: this.panelClass, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, h("div", { key: '3da8046661146882ae1322258dec72d68ba10377', class: "spw-drawer__header" }, this.showCaption && h("h2", { key: 'f4a555d0408adb2febc9c30e3d09ac633f7a24e2', class: "spw-drawer__caption" }, this.caption), this.showCloseButton && (h("div", { key: 'd707889f78f1c13f342771a47f9817bdc852f559', class: "spw-drawer__close-button", ref: el => (this.closeButtonEl = el), tabindex: "0", role: "button", onClick: () => this.doBeforeClose('CLOSE_BUTTON'), onKeyDown: (e) => (e.key === 'Enter' || e.key === ' ') && this.doBeforeClose('CLOSE_BUTTON') }, h("spw-link", { key: 'e64251421e038ecbd06e13b18b95e4c2eb91209e', "icon-position": "right", icon: "fa-xmark" }, this.closeButtonText)))), h("div", { key: 'd6ae0d5c001a0955f102db7d05f44fcfccd8e852', class: "spw-drawer__body", ref: el => (this.drawerContent = el) }, h("slot", { key: 'c504f66f8bdf8201cd89add6d2be6564cf463def', name: "content" })), h("div", { key: 'c48a0840f77d49aa32d509fe8cb5d664019bf323', class: {
+                'spw-drawer__footer': true,
+                'spw-drawer__footer--present': this.slotFooterPresent,
+            } }, h("slot", { key: 'dd720c1c5d968a07028bc847ec3f2237fbf6a63c', name: "footer", onSlotchange: (e) => {
+                const slot = e.target;
+                this.slotFooterPresent = slot.assignedNodes({ flatten: true }).length > 0;
+            } }))), h("div", { key: '7b5c33d211b0555de269c69da4a4136d631ba624', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
+    }
+    static get is() { return "spw-drawer"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["spw-drawer.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["spw-drawer.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "opened": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si le drawer est ouvert ou ferm\u00E9, mutable et refl\u00E9t\u00E9 dans le DOM"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "opened",
+                "defaultValue": "false"
+            },
+            "caption": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Titre du drawer"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "caption",
+                "defaultValue": "'Titre du drawer'"
+            },
+            "closeButtonText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Texte du bouton de fermeture"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "close-button-text",
+                "defaultValue": "'Fermer'"
+            },
+            "closeOnOverlayClick": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si la fermeture du drawer est possible en cliquant sur l'overlay"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "close-on-overlay-click",
+                "defaultValue": "true"
+            },
+            "position": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'left' | 'right' | 'top' | 'bottom'",
+                    "resolved": "\"bottom\" | \"left\" | \"right\" | \"top\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Position du drawer : 'left', 'right', 'top' ou 'bottom'"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "position",
+                "defaultValue": "'right'"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'small' | 'medium' | 'large' | 'full'",
+                    "resolved": "\"full\" | \"large\" | \"medium\" | \"small\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Taille du drawer (largeur pour left/right) : 'small', 'medium', 'large' ou 'full'"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "size",
+                "defaultValue": "'medium'"
+            },
+            "showCloseButton": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si le bouton de fermeture est visible"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-close-button",
+                "defaultValue": "true"
+            },
+            "showCaption": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si le titre est visible"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-caption",
+                "defaultValue": "true"
+            },
+            "modal": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si l'overlay (fond sombre) est visible"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "modal",
+                "defaultValue": "true"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "showDrawer": {},
+            "slotFooterPresent": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "spwDrawerOpen",
+                "name": "spwDrawerOpen",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u00C9v\u00E9nement d\u00E9clench\u00E9 lors de l'ouverture du drawer"
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "spwDrawerClose",
+                "name": "spwDrawerClose",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u00C9v\u00E9nement d\u00E9clench\u00E9 lors de la fermeture du drawer"
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "openDrawer": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "M\u00E9thode publique pour ouvrir le drawer programmatiquement",
+                    "tags": []
+                }
+            },
+            "closeDrawer": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "M\u00E9thode publique pour fermer le drawer programmatiquement",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "hostElement"; }
+    static get watchers() {
+        return [{
+                "propName": "opened",
+                "methodName": "openedChanged"
+            }];
+    }
+}

package/dist/collection/components/spw-dropdown/spw-dropdown-container/spw-dropdown-container.css

@@ -50,15 +50,6 @@ body {
   margin: 0;
 }
 
-/**
- * Correct the font size and margin on `h1` elements within `section` and
- * `article` contexts in Chrome, Firefox, and Safari.
- */
-h1 {
-  font-size: 2em;
-  margin: 0.67em 0;
-}
-
 /* Grouping content
    ========================================================================== */
 /**

package/dist/collection/components/spw-dropdown/spw-dropdown-container/spw-dropdown-container.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class SpwDropdownContainer {
     render() {
-        return (h(Host, { key: '79dc2cc099719ae4705b6b17fa914f137145bbf4' }, h("div", { key: 'e91b67898f25f782a67681a03c5a7ab6c2ed58a1', class: "spw-dropdown-container" }, h("slot", { key: 'c3ddaa4ae9f44d5e90cd1e26d93297935910be85' }))));
+        return (h(Host, { key: '48d874f662c7ecf665c4fd8e0bd8b426e7289c87' }, h("div", { key: '0cc824dad665cb14da6b12e3b24090ff315cf0fe', class: "spw-dropdown-container" }, h("slot", { key: 'f8a4c2f3e66128a94deda7b5f00a15949299d8f2' }))));
     }
     static get is() { return "spw-dropdown-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-dropdown/spw-dropdown-item/spw-dropdown-item.css

@@ -50,15 +50,6 @@ body {
   margin: 0;
 }
 
-/**
- * Correct the font size and margin on `h1` elements within `section` and
- * `article` contexts in Chrome, Firefox, and Safari.
- */
-h1 {
-  font-size: 2em;
-  margin: 0.67em 0;
-}
-
 /* Grouping content
    ========================================================================== */
 /**
@@ -388,6 +379,11 @@ template {
 .spw-dropdown-item:hover {
   background-color: var(--spw-colors-support-grey-grey-200);
 }
+.spw-dropdown-item:focus-visible {
+  outline: 2px solid white;
+  outline-offset: 0;
+  box-shadow: 0 0 0 4px black;
+}
 .spw-dropdown-item--disabled {
   cursor: not-allowed;
   opacity: 0.5;

package/dist/collection/components/spw-dropdown/spw-dropdown-item/spw-dropdown-item.js

@@ -23,6 +23,20 @@ export class SpwDropdownItem {
                 this.subItemsOpen = !this.subItemsOpen;
             }
         };
+        this.handleItemKeyDown = (event) => {
+            var _a;
+            if (this.disabled)
+                return;
+            if (event.key === 'Enter' || event.key === ' ') {
+                event.preventDefault();
+                if (this.hasSubItems && !this.href) {
+                    this.subItemsOpen = !this.subItemsOpen;
+                }
+                else if (this.href) {
+                    (_a = this.el.querySelector('a')) === null || _a === void 0 ? void 0 : _a.click();
+                }
+            }
+        };
     }
     componentDidLoad() {
         this.checkForSubItems();
@@ -69,7 +83,7 @@ export class SpwDropdownItem {
             'spw-dropdown-item__toggle': true,
             'spw-dropdown-item__toggle--open': this.subItemsOpen,
         };
-        return (h(Host, { key: '64d51205ea8e220d8d3d22c6163ffae1def82892' }, h(Tag, { key: '5cfb7b0bd5d57228f49efb175bfa01c2b1678c8c', class: this.classes, href: this.href, "aria-disabled": this.disabled ? 'true' : undefined, onClick: this.handleItemClick }, this.icon && (h("div", { key: 'b397503e12d41f4b3f339d73aa014942ee94b70e', class: "spw-dropdown-item__icon" }, h("spw-icon", { key: '0545ea4d6f163007279e315bbb0fd80c6f5e22a2', variant: this.iconVariant, icon: this.icon }))), h("div", { key: 'eff42c92481ce24a1807f7eb97ce0df4092b3310', class: "spw-dropdown-item__content" }, h("div", { key: '8735e69e60341295fdb844af88704ce040aa0cd8', class: "spw-dropdown-item__label" }, h("slot", { key: '8f186c331628491298a61ca203e1ef1d9f80825e' })), this.hasSubItems && (h("div", { key: '91c60f4dd34200d5e575a7cec98e6f690c6195ef', class: toggleClasses, onClick: this.handleToggleSubItems }, h("spw-icon", { key: 'c563396ee0b6e27f81be1466f2d9c7b8f03b9c70', icon: "fa-chevron-down" }))))), this.hasSubItems && (h("div", { key: '41325cd7b9755084a80ed15ebb7e505a1d5ca0a0', class: "spw-dropdown-item__sub-items", style: { display: this.subItemsOpen ? 'block' : 'none' } }, h("slot", { key: '927d7b7b3b9206ea64a4b930d3f91d76d49128e1', name: "sub-items" })))));
+        return (h(Host, { key: '77c0018164181046d760a1b6442e7428683043a3' }, h(Tag, { key: 'bbfce979bcd7984df8e98322200d41ad646a3929', class: this.classes, href: this.href, "aria-disabled": this.disabled ? 'true' : undefined, role: "menuitem", tabindex: this.disabled ? -1 : 0, onClick: this.handleItemClick, onKeyDown: this.handleItemKeyDown }, this.icon && (h("div", { key: '66bfddabf7f2b4cbeb47374ab20b36af04c6ba36', class: "spw-dropdown-item__icon" }, h("spw-icon", { key: 'ab7379b23b55ee580f172c9753de20f293fba609', variant: this.iconVariant, icon: this.icon }))), h("div", { key: '8c00965f636f69b33bbc9a70e7226e2ca3a46b05', class: "spw-dropdown-item__content" }, h("div", { key: 'd3fcee523706d6d17485c41f08a7a60ebbbf0016', class: "spw-dropdown-item__label" }, h("slot", { key: '4b5f86480f72daa0a73b4464bb81674b914f9c7f' })), this.hasSubItems && (h("div", { key: 'feab6bd1e1b716f9e67539dee9e10044e2bf56ca', class: toggleClasses, onClick: this.handleToggleSubItems }, h("spw-icon", { key: '3b09c91ff1625cf4c7057035f9462cdeda451a57', icon: "fa-chevron-down" }))))), this.hasSubItems && (h("div", { key: '151bd6199199c1ecb99a8c757e4a963020229c3b', class: "spw-dropdown-item__sub-items", style: { display: this.subItemsOpen ? 'block' : 'none' } }, h("slot", { key: '369f2b8c03221c05a42d4ad24df5cddb66f0421f', name: "sub-items" })))));
     }
     static get is() { return "spw-dropdown-item"; }
     static get originalStyleUrls() {

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

@@ -50,15 +50,6 @@ body {
   margin: 0;
 }
 
-/**
- * Correct the font size and margin on `h1` elements within `section` and
- * `article` contexts in Chrome, Firefox, and Safari.
- */
-h1 {
-  font-size: 2em;
-  margin: 0.67em 0;
-}
-
 /* Grouping content
    ========================================================================== */
 /**