@sekiui/elements 0.1.4 → 0.1.5

package/dist/collection/components/navigation-menu/seki-navigation-menu-trigger.js

@@ -170,12 +170,12 @@ export class SekiNavigationMenuTrigger {
     }
     render() {
         const itemId = this.getItemId();
-        return (h(Host, { key: '43e30977a6c18c829b8cce891e3676e84067f33d', class: {
+        return (h(Host, { key: '3f8474f05e9eeb0aa7581397417d3022de0ce599', class: {
                 'navigation-menu-trigger': true,
                 'navigation-menu-trigger--open': this.isOpen,
                 'navigation-menu-trigger--disabled': this.disabled,
                 'navigation-menu-trigger--mobile': this.isMobile,
-            } }, h("button", { key: '8e00fe1d4607a852a27f502f0577dce2162ca6fe', type: "button", class: "navigation-menu-trigger__button", role: "menuitem", "aria-haspopup": "true", "aria-expanded": String(this.isOpen), "aria-controls": `content-${itemId}`, disabled: this.disabled, tabindex: this.isOpen ? '0' : '-1', onClick: this.handleClick, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onKeyDown: this.handleKeyDown }, h("span", { key: '57f81cc6150a873676e8474ca07fd22714220743', class: "navigation-menu-trigger__label" }, h("slot", { key: '8de657942decb251d39af48ea37cd8adb31b8efc' })), h("svg", { key: '17c885eb1b266c0d083699d029b9f29f1c72473a', class: "navigation-menu-trigger__chevron", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: '79eb27611eb6cca360502e630d8a88692a83efb3', points: "2 4 6 8 10 4" })))));
+            } }, h("button", { key: '348ada3dffa6e6d3d66346d67460fe7bfe957125', type: "button", class: "navigation-menu-trigger__button", role: "menuitem", "aria-haspopup": "true", "aria-expanded": String(this.isOpen), "aria-controls": `content-${itemId}`, disabled: this.disabled, tabindex: this.isOpen ? '0' : '-1', onClick: this.handleClick, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onKeyDown: this.handleKeyDown }, h("span", { key: 'e53f5e0b209f7dd5bd6b85285809b14ff9f5624e', class: "navigation-menu-trigger__label" }, h("slot", { key: '777910a3d8e0d4c06ebe372542516f1458277370' })), h("svg", { key: 'd507fc70e02c0e7ee73ee38314b86cd8026454ac', class: "navigation-menu-trigger__chevron", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polyline", { key: 'a975f7dffdc86730b7345ec46c2f4a9d4f4fea77', points: "2 4 6 8 10 4" })))));
     }
     static get is() { return "seki-navigation-menu-trigger"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/navigation-menu/seki-navigation-menu-viewport.js

@@ -138,14 +138,14 @@ export class SekiNavigationMenuViewport {
         return h("slot", null);
     }
     render() {
-        return (h(Host, { key: 'a4faf57c8b809771ffd16d391f86f30dc57abfeb', class: {
+        return (h(Host, { key: '9a7a71359bd65aed23c51aa4849e29af0167e69e', class: {
                 'navigation-menu-viewport': true,
                 'navigation-menu-viewport--visible': this.isVisible,
             }, style: {
                 '--indicator-left': `${this.indicatorLeft}px`,
                 '--content-offset': `${this.contentOffset}px`,
                 '--content-height': `${this.contentHeight}px`,
-            } }, h("div", { key: 'c23723552a476ea2e02265e28a028497fe42eb13', class: "navigation-menu-viewport__indicator" }, h("svg", { key: '77f89f31f58a05ef2fd5cfd680f2fb60ca697ee4', width: "20", height: "10", viewBox: "0 0 20 10", fill: "currentColor" }, h("polygon", { key: '6e4c2eab40db141d1aa3830ee77deaf7a118511f', points: "10,0 20,10 0,10" }))), h("div", { key: '1cec7239144da9544b5fc3aed3dec6f6a6fa97e7', ref: el => (this.contentRef = el), class: "navigation-menu-viewport__content" }, this.renderContent())));
+            } }, h("div", { key: 'f2d1f7a4e9188e5ade10d9d6352a2e07dffacf3f', class: "navigation-menu-viewport__indicator" }, h("svg", { key: '2b05e0ee187d7e1085fc17109d8464bdd36baf40', width: "20", height: "10", viewBox: "0 0 20 10", fill: "currentColor" }, h("polygon", { key: '758ca94b027abc70d9f811d6e7592a83ea102914', points: "10,0 20,10 0,10" }))), h("div", { key: '35add8a4203a528e1772567157187aca1afe2605', ref: el => (this.contentRef = el), class: "navigation-menu-viewport__content" }, this.renderContent())));
     }
     static get is() { return "seki-navigation-menu-viewport"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-content.js

@@ -6,7 +6,7 @@ import { h } from "@stencil/core";
  */
 export class SekiPaginationContent {
     render() {
-        return (h("ul", { key: '33f74f2cf89fdb9b35afb22aef30f26ee99d2b2b', class: "seki-pagination-content", part: "content" }, h("slot", { key: '2a72b7aff344a98781f8ef233880f31ae8915ee9' })));
+        return (h("ul", { key: 'e952803062fa6e402e037b0adb99b102173e51f3', class: "seki-pagination-content", part: "content" }, h("slot", { key: '0acf6af8425d825def202d96f1f784fb273b42c3' })));
     }
     static get is() { return "seki-pagination-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-ellipsis.js

@@ -6,7 +6,7 @@ import { h } from "@stencil/core";
  */
 export class SekiPaginationEllipsis {
     render() {
-        return (h("span", { key: '4a46896bef2fe178314b6a66c093a6ff6480d556', "aria-hidden": "true", class: "seki-pagination-ellipsis", part: "ellipsis" }, h("svg", { key: '23cd560f34e544083fd5cc76e6f7c1e9bceba40d', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("circle", { key: '5111a3cfdd1484b9f94272eb98f1cfd10d13e310', cx: "12", cy: "12", r: "1" }), h("circle", { key: '93c2c8d22962fdf68f0af2809d8ad329827a3b2a', cx: "19", cy: "12", r: "1" }), h("circle", { key: '05add43c30efc845d3526f39c5bcd1cf2c39ed81', cx: "5", cy: "12", r: "1" })), h("span", { key: 'd136c488671089c979a19cd26055336a43354ea9', class: "sr-only" }, "More pages")));
+        return (h("span", { key: 'bb7f50e2ab36b2a77e9e10e0da1608fcaed4612f', "aria-hidden": "true", class: "seki-pagination-ellipsis", part: "ellipsis" }, h("svg", { key: '263d352dafc2bc3b3cc88f90c4e225d86f3591a0', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("circle", { key: '807c22e6d58bcdd7110284299472ebaca73515b2', cx: "12", cy: "12", r: "1" }), h("circle", { key: 'cd19b56b9b0ddba6005a6a4ac9f5a221b35db767', cx: "19", cy: "12", r: "1" }), h("circle", { key: '4b07ff1adca4bc159995572adc2d31f0668114f8', cx: "5", cy: "12", r: "1" })), h("span", { key: '4396ec145fa63d818d00d1e37dd3ed5a53f809a6', class: "sr-only" }, "More pages")));
     }
     static get is() { return "seki-pagination-ellipsis"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-item.js

@@ -6,7 +6,7 @@ import { h } from "@stencil/core";
  */
 export class SekiPaginationItem {
     render() {
-        return (h("li", { key: 'aa0dbdf9ff896e7cb6bb9df819a2183c86e76a03', class: "seki-pagination-item", part: "item" }, h("slot", { key: '77dce23442b37d646ad299e2712fe953943e362b' })));
+        return (h("li", { key: '45c202e9ce61a7a8680d75b7918a0df46be7245f', class: "seki-pagination-item", part: "item" }, h("slot", { key: '8890c6e8af09e91ab7f610090897433be48f5974' })));
     }
     static get is() { return "seki-pagination-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-link.js

@@ -17,11 +17,11 @@ export class SekiPaginationLink {
     }
     render() {
         const Tag = this.href && !this.disabled ? 'a' : 'span';
-        return (h(Tag, { key: 'f8c88be17b2ce3f1c558de14ea8c2b0c08acde1b', href: this.href && !this.disabled ? this.href : undefined, "aria-current": this.active ? 'page' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, class: {
+        return (h(Tag, { key: '902ef02569d8a2e01d45a8e67c893423910eace0', href: this.href && !this.disabled ? this.href : undefined, "aria-current": this.active ? 'page' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, class: {
                 'seki-pagination-link': true,
                 'seki-pagination-link--active': !!this.active,
                 'seki-pagination-link--disabled': !!this.disabled,
-            }, part: "link" }, h("slot", { key: '835bd6b16a5ce4d846febe2632107f6049208d1e' })));
+            }, part: "link" }, h("slot", { key: 'cbeb29f1edf9edf35b39b3d03593f92c7daae73b' })));
     }
     static get is() { return "seki-pagination-link"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-next.js

@@ -13,11 +13,11 @@ export class SekiPaginationNext {
     }
     render() {
         const Tag = this.href && !this.disabled ? 'a' : 'span';
-        return (h(Tag, { key: '5fa678b9bf3614f0fb260169b6d9b9de5aa07da5', href: this.href && !this.disabled ? this.href : undefined, "aria-label": "Go to next page", "aria-disabled": this.disabled ? 'true' : undefined, class: {
+        return (h(Tag, { key: '1414dc7b606cee7efdfb8cd97eebe05ceb44379b', href: this.href && !this.disabled ? this.href : undefined, "aria-label": "Go to next page", "aria-disabled": this.disabled ? 'true' : undefined, class: {
                 'seki-pagination-link': true,
                 'seki-pagination-nav': true,
                 'seki-pagination-link--disabled': !!this.disabled,
-            }, part: "next" }, h("span", { key: 'e34aa0858c3ab2bafdc7240bf225f3615fe4a951' }, "Next"), h("svg", { key: '26cefe2d929a633e68a5a3f144a862a6d313de85', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { key: '4cf4ff63f382dfd6f5cfce6c2099ea1539d08253', d: "m9 18 6-6-6-6" }))));
+            }, part: "next" }, h("span", { key: '8553f6781cde1bb59cc04ff563a4a53cd43ed3b1' }, "Next"), h("svg", { key: 'd40b5f737917144397c9dcf3b61f4fe143cd978b', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { key: '55579507aad90b50b476d37e0618955bf3fa25d5', d: "m9 18 6-6-6-6" }))));
     }
     static get is() { return "seki-pagination-next"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination-previous.js

@@ -13,11 +13,11 @@ export class SekiPaginationPrevious {
     }
     render() {
         const Tag = this.href && !this.disabled ? 'a' : 'span';
-        return (h(Tag, { key: 'cc592702e87b4a1fc4dd9ab047fe53ac018173ba', href: this.href && !this.disabled ? this.href : undefined, "aria-label": "Go to previous page", "aria-disabled": this.disabled ? 'true' : undefined, class: {
+        return (h(Tag, { key: '5cb1815c2e8fb5a35d30c95dbca5e79c6d0d1c73', href: this.href && !this.disabled ? this.href : undefined, "aria-label": "Go to previous page", "aria-disabled": this.disabled ? 'true' : undefined, class: {
                 'seki-pagination-link': true,
                 'seki-pagination-nav': true,
                 'seki-pagination-link--disabled': !!this.disabled,
-            }, part: "previous" }, h("svg", { key: '82d44d0c82b9aa43440ebbe327112b14387f431d', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { key: 'f48185516c545f947f4ea27cd2cda63c0ba76fc3', d: "m15 18-6-6 6-6" })), h("span", { key: '9f73300b5d8e6d221d20936db767899de0888af2' }, "Previous")));
+            }, part: "previous" }, h("svg", { key: 'f636dc1cd3d8f0ebc7cba93ad0ce3671057ca1bc', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", "aria-hidden": "true" }, h("path", { key: 'f1b3cd508431fae338769afa846508dc85c6ccd8', d: "m15 18-6-6 6-6" })), h("span", { key: '9beadc04eaccb57385d8acc51b1a13a73bb472ce' }, "Previous")));
     }
     static get is() { return "seki-pagination-previous"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/pagination/seki-pagination.js

@@ -20,7 +20,7 @@ import { h } from "@stencil/core";
  */
 export class SekiPagination {
     render() {
-        return (h("nav", { key: '7e6002c4f74510148eca79aa1956c4c743ff4edc', role: "navigation", "aria-label": "pagination", class: "seki-pagination", part: "pagination" }, h("slot", { key: '14245330500261a43ea88a527579af5851723054' })));
+        return (h("nav", { key: '1fa4e0476641e1c598a681113ee8945f2b0d552f', role: "navigation", "aria-label": "pagination", class: "seki-pagination", part: "pagination" }, h("slot", { key: 'b278d597776f6388daf1a8a67d9ee5b2ef6ff29a' })));
     }
     static get is() { return "seki-pagination"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/popover/seki-popover-close.js

@@ -11,7 +11,7 @@ export class SekiPopoverClose {
         this.closePopover.emit();
     }
     render() {
-        return (h(Host, { key: '2e319063d318d91845c901f33d783f5a1a57a7e0' }, h("button", { key: '3747a565a121c9c6ff1dda91a0cb4cfeb2f1e153', part: "close", type: "button", class: "popover-close", "aria-label": "Close" }, h("slot", { key: '038c53260e062b0ffdfcfba147ede70ba60e73c5' }, h("svg", { key: '4df793633a13578370b0c64d6144317faa80e284', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { key: '24fbad124008c1a48650c3e589eaedf697c5a133', d: "M18 6 6 18" }), h("path", { key: '98d74b90d280f45b7a401aabf9ea56271484fe61', d: "m6 6 12 12" }))))));
+        return (h(Host, { key: '2114f5f3fba691fe355eeef334748e1a018c9d90' }, h("button", { key: 'a7b6aca7acd19539b43bd958ffbe54a9c61903c1', part: "close", type: "button", class: "popover-close", "aria-label": "Close" }, h("slot", { key: '2388bd5101e10286d94ef8b57cefe275dbfb3009' }, h("svg", { key: '2062e887f5dc52a1e4ff125c5108839fd372656c', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { key: 'f74dc22a288423c47349d5f983fcc10c9e3e5871', d: "M18 6 6 18" }), h("path", { key: '6ac5fa0c681104dd5f5601934e5495e7fa6aa22a', d: "m6 6 12 12" }))))));
     }
     static get is() { return "seki-popover-close"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/popover/seki-popover-trigger.js

@@ -12,7 +12,7 @@ export class SekiPopoverTrigger {
         this.triggerClick.emit();
     }
     render() {
-        return (h(Host, { key: '27bb74ff57019219dd2d967dc7753bc9ef75e578' }, h("span", { key: '6d9221c17895112c4896d1edb5c3050e1ce9d7a5', part: "trigger", class: "popover-trigger" }, h("slot", { key: 'e02f2210b1c7bc3e745973486d1744552100a59d' }))));
+        return (h(Host, { key: '9b0832d6148488cab7c64e05f941a1f744b5cd17' }, h("span", { key: '4f3c0a4510928cf82c14d62d5fe0216ee022a5ac', part: "trigger", class: "popover-trigger" }, h("slot", { key: '87e56a06cf8477458efe70a37a62d1ce10ecc299' }))));
     }
     static get is() { return "seki-popover-trigger"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/popover/seki-popover.js

@@ -1,5 +1,6 @@
 import { h, Host } from "@stencil/core";
 import { publishContext } from "../../utils/context-bridge";
+import { OverlayLayer } from "../../utils/overlay";
 /**
  * Popover component - floating content triggered by click
  *
@@ -41,6 +42,19 @@ export class SekiPopover {
          * Internal open state
          */
         this._isOpen = false;
+        /**
+         * Place on the overlay stack (utils/overlay.ts): Escape reaches this
+         * component only when nothing is open on top of it, so one key press closes
+         * one layer (#332).
+         */
+        this.layer = new OverlayLayer({
+            onEscape: (event) => {
+                if (this._isOpen && this.closeOnEscape) {
+                    event.preventDefault();
+                    this.closePopover();
+                }
+            },
+        });
     }
     componentWillLoad() {
         this._isOpen = this.open || this.defaultOpen;
@@ -104,12 +118,6 @@ export class SekiPopover {
     handleCloseRequest() {
         this.closePopover();
     }
-    handleKeyDown(event) {
-        if (this._isOpen && event.key === 'Escape' && this.closeOnEscape) {
-            event.preventDefault();
-            this.closePopover();
-        }
-    }
     setupClickOutside() {
         if (!this.closeOnOutsideClick)
             return;
@@ -158,11 +166,15 @@ export class SekiPopover {
             this.setupClickOutside();
         }
     }
+    componentDidRender() {
+        this.layer.setActive(this._isOpen);
+    }
     disconnectedCallback() {
         this.removeClickOutside();
+        this.layer.setActive(false);
     }
     render() {
-        return (h(Host, { key: '4843a3d2aab19c70804a6fec2059880dbd193456', "data-state": this._isOpen ? 'open' : 'closed' }, h("div", { key: 'dc6dd157034bec1abb59f8289e665a304bb7ca26', part: "popover", class: "popover" }, h("slot", { key: 'c079493c83ccbeaf8fded4777428f720610afaf3' }))));
+        return (h(Host, { key: '428f4dd66a23e7b14f04c90129f92a62219ff4e4', "data-state": this._isOpen ? 'open' : 'closed' }, h("div", { key: 'b11b34b8b4dd3d7d45d87647687c8f48c421aebc', part: "popover", class: "popover" }, h("slot", { key: '40385e1965f28c37318ba5656d8a0ffaa873d4ca' }))));
     }
     static get is() { return "seki-popover"; }
     static get encapsulation() { return "shadow"; }
@@ -451,12 +463,6 @@ export class SekiPopover {
                 "target": undefined,
                 "capture": false,
                 "passive": false
-            }, {
-                "name": "keydown",
-                "method": "handleKeyDown",
-                "target": "window",
-                "capture": false,
-                "passive": false
             }];
     }
 }

package/dist/collection/components/progress/seki-progress.js

@@ -66,7 +66,7 @@ export class SekiProgress {
         const state = this.getState();
         const percentage = this.getPercentage();
         const isIndeterminate = state === 'indeterminate';
-        return (h("div", { key: '50654fb987c08ffbb70070bcdd4de6ad2cfcee40', class: "seki-progress", role: "progressbar", "aria-valuenow": isIndeterminate ? undefined : this.value, "aria-valuemin": 0, "aria-valuemax": this.max, "aria-valuetext": this.getValueLabel(), "aria-label": this.ariaLabel, "data-state": state, "data-value": this.value, "data-max": this.max }, h("div", { key: '5f7763f0ed0eaa4d30abe034595a5bc84d9dbd81', class: {
+        return (h("div", { key: '6605ec4cd3b8cefa6d7c98e825bf02058fe2f33f', class: "seki-progress", role: "progressbar", "aria-valuenow": isIndeterminate ? undefined : this.value, "aria-valuemin": 0, "aria-valuemax": this.max, "aria-valuetext": this.getValueLabel(), "aria-label": this.ariaLabel, "data-state": state, "data-value": this.value, "data-max": this.max }, h("div", { key: '27c3a1316fb44a8a663b1f4e7f67d5757e0e9c8e', class: {
                 'seki-progress__indicator': true,
                 'seki-progress__indicator--indeterminate': isIndeterminate,
             }, "data-state": state, "data-value": this.value, "data-max": this.max, style: {

package/dist/collection/components/radio-group/seki-radio-group-item.js

@@ -47,7 +47,7 @@ export class SekiRadioGroupItem {
     }
     render() {
         const dataState = this.checked ? 'checked' : 'unchecked';
-        return (h(Host, { key: 'eeb5fc7e9ca03c9abd46c416841ceea3f8f0e02a', "data-state": dataState, "data-disabled": this.disabled ? '' : null }, h("button", { key: '68df8ecdc6e2b0fa9815ee41c3b15141275db38e', type: "button", role: "radio", class: "radio", part: "radio", ref: el => this.buttonEl = el, "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel || undefined, "aria-describedby": this.ariaDescribedby || undefined, tabindex: this.checked ? 0 : -1, disabled: this.disabled, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, this.checked && (h("span", { key: '8716c8b1bf4169f1035a86d8a46eb218377d4baf', class: "indicator", part: "indicator" })))));
+        return (h(Host, { key: 'd1a1c231c0125135ff2d5b994136549a017f50a1', "data-state": dataState, "data-disabled": this.disabled ? '' : null }, h("button", { key: 'bc514d9ff7aec4d8024f4c617dedcb92f7b9f3de', type: "button", role: "radio", class: "radio", part: "radio", ref: el => this.buttonEl = el, "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, "aria-label": this.ariaLabel || undefined, "aria-describedby": this.ariaDescribedby || undefined, tabindex: this.checked ? 0 : -1, disabled: this.disabled, onClick: this.handleClick, onKeyDown: this.handleKeyDown }, this.checked && (h("span", { key: 'b01d0d5652684152de16e1dfd88d65aa44976a0d', class: "indicator", part: "indicator" })))));
     }
     static get is() { return "seki-radio-group-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/radio-group/seki-radio-group.js

@@ -180,7 +180,7 @@ export class SekiRadioGroup {
         this.updateChildItems();
     }
     render() {
-        return (h(Host, { key: '68c46542431391dbffba9ca0186a99a9a308da61', role: "radiogroup", "aria-label": this.ariaLabel, "aria-required": this.required ? 'true' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-orientation": this.orientation, "data-orientation": this.orientation, "data-disabled": this.disabled ? '' : null }, h("slot", { key: '5e688548a968a174bba849ba10dc312922964e45' })));
+        return (h(Host, { key: 'd0bc24b9a623cd6ef420fcf1665e23d9d8952680', role: "radiogroup", "aria-label": this.ariaLabel, "aria-required": this.required ? 'true' : undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-orientation": this.orientation, "data-orientation": this.orientation, "data-disabled": this.disabled ? '' : null }, h("slot", { key: '8ea91aeda0738ed3a9b9232ddd28e6f924714a7e' })));
     }
     static get is() { return "seki-radio-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/resizable/seki-resizable-handle.js

@@ -162,13 +162,13 @@ export class SekiResizableHandle {
     }
     render() {
         const isHorizontal = this._direction === 'horizontal';
-        return (h(Host, { key: '145ee501547445a33ab122d557aaca1770cc7b40' }, h("div", { key: '260ca91d58689d7fdbb60f8a33ec1f5d8cc9b12a', part: "handle", role: "separator", tabindex: this.disabled ? -1 : 0, "aria-valuenow": this.getAriaValue(), "aria-valuemin": 0, "aria-valuemax": 100, "aria-orientation": isHorizontal ? 'vertical' : 'horizontal', "aria-label": "Resize handle", class: {
+        return (h(Host, { key: 'b09b62418c7022dea8d557a0424f9144a3a328ab' }, h("div", { key: '3ce823970f32a942edbffaf208b01ee8ec94cb7b', part: "handle", role: "separator", tabindex: this.disabled ? -1 : 0, "aria-valuenow": this.getAriaValue(), "aria-valuemin": 0, "aria-valuemax": 100, "aria-orientation": isHorizontal ? 'vertical' : 'horizontal', "aria-label": "Resize handle", class: {
                 'resizable-handle': true,
                 'resizable-handle--horizontal': isHorizontal,
                 'resizable-handle--vertical': !isHorizontal,
                 'resizable-handle--disabled': this.disabled,
                 'resizable-handle--dragging': this._isDragging,
-            }, onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp }, this.withHandle && (h("div", { key: '945a41b12735498d94c2912ff8f72022ef4f5258', part: "grip", class: "resizable-handle__grip" }, h("svg", { key: 'f3803a9e896066c700b9e2afa2fb08ce14c06d4f', class: "resizable-handle__grip-icon", viewBox: "0 0 6 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { key: '403ab8afad382406c7db05bee2e6103cc803f4b1', cx: "1.5", cy: "2", r: "1", fill: "currentColor" }), h("circle", { key: '120cf0754a4741e94abef7f2d3dcc4a04e35ffc3', cx: "4.5", cy: "2", r: "1", fill: "currentColor" }), h("circle", { key: '31a281a5b2a90698f82ac6d5e23892ba4b07ccbc', cx: "1.5", cy: "6", r: "1", fill: "currentColor" }), h("circle", { key: '198294e622959f3022f24bf13dfcb4da807dc26a', cx: "4.5", cy: "6", r: "1", fill: "currentColor" }), h("circle", { key: '0099e06f5fd627446d696e3ca39572639253cafe', cx: "1.5", cy: "10", r: "1", fill: "currentColor" }), h("circle", { key: '4e3851be4a84d183219269bcaded43141abc8835', cx: "4.5", cy: "10", r: "1", fill: "currentColor" }), h("circle", { key: '11c97894690f088ff4fe1ed04ce10505ebb84cfb', cx: "1.5", cy: "14", r: "1", fill: "currentColor" }), h("circle", { key: 'fe7131a715d44d274764744d884a1b93a0715d8e', cx: "4.5", cy: "14", r: "1", fill: "currentColor" })))))));
+            }, onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp }, this.withHandle && (h("div", { key: '8a13bde6e35ce46fc8ec5cef8f0e5b6edd11af5f', part: "grip", class: "resizable-handle__grip" }, h("svg", { key: 'fd3a70a0632c08b82bc2978170e857cb04c46f13', class: "resizable-handle__grip-icon", viewBox: "0 0 6 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { key: 'c10da135841d6aee675e66652ae7e4ee1635ab9b', cx: "1.5", cy: "2", r: "1", fill: "currentColor" }), h("circle", { key: 'e02a17503852dd5bfcfa9ffbae26676154f41148', cx: "4.5", cy: "2", r: "1", fill: "currentColor" }), h("circle", { key: '8538d187bedecaba841028b0934e8ae96e40d089', cx: "1.5", cy: "6", r: "1", fill: "currentColor" }), h("circle", { key: '9bb14af4b24130c95a1be8e345c94d3197dd37ba', cx: "4.5", cy: "6", r: "1", fill: "currentColor" }), h("circle", { key: '57c6a924a0f920980b200abd65d1e3123b2e529d', cx: "1.5", cy: "10", r: "1", fill: "currentColor" }), h("circle", { key: '54d6cc12a1f737a13ac5769f926ad53362a4c14d', cx: "4.5", cy: "10", r: "1", fill: "currentColor" }), h("circle", { key: '0250ca679d28272b72296929dcbc1bffa574bc45', cx: "1.5", cy: "14", r: "1", fill: "currentColor" }), h("circle", { key: 'fe6e5dc77473f0673b6ddf1c9e07db20505027ec', cx: "4.5", cy: "14", r: "1", fill: "currentColor" })))))));
     }
     static get is() { return "seki-resizable-handle"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/resizable/seki-resizable-panel-group.js

@@ -312,11 +312,11 @@ export class SekiResizablePanelGroup {
         }
     }
     render() {
-        return (h(Host, { key: 'ac1ecc1492362d7439963ec0cb8a124c2396f6ef' }, h("div", { key: '27e9cd19531a16256ac58fe662721e49504c61d8', part: "group", role: "group", "aria-label": "Resizable panel group", class: {
+        return (h(Host, { key: '38f00f78a09473cd8197e2ab86de77b7452ae056' }, h("div", { key: '3e70a20b91c12276faa806c0b558286f2af5e1d5', part: "group", role: "group", "aria-label": "Resizable panel group", class: {
                 'resizable-panel-group': true,
                 'resizable-panel-group--horizontal': this.direction === 'horizontal',
                 'resizable-panel-group--vertical': this.direction === 'vertical',
-            } }, h("slot", { key: 'ba2700999ef2bb3034b0404c826045fd19bb2027' }))));
+            } }, h("slot", { key: '04b9acd57ec8dbc4d1ec24831d4d1f779063afa2' }))));
     }
     static get is() { return "seki-resizable-panel-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/resizable/seki-resizable-panel.js

@@ -164,14 +164,14 @@ export class SekiResizablePanel {
         return this.panelId;
     }
     render() {
-        return (h(Host, { key: 'cfaf9c57ec9b7c5b8f6d9e8f768b8f438648ec89', style: {
+        return (h(Host, { key: 'b8de78bb2e22fcdb55a75ce15ec2738f8ce5503d', style: {
                 flexBasis: `${this._size}%`,
                 flexGrow: '0',
                 flexShrink: '0',
-            } }, h("div", { key: '013aca61b6d8abe68c50b264ec678e96f11fb2c3', part: "panel", role: "region", class: {
+            } }, h("div", { key: '157870f62b18e505693463b7f098563e61c9845f', part: "panel", role: "region", class: {
                 'resizable-panel': true,
                 'resizable-panel--collapsed': this._isCollapsed,
-            } }, h("slot", { key: '2a69e04c6b797c8bcf36ab1ab63dc0a49c1a12a2' }))));
+            } }, h("slot", { key: '69fd5281eabcf236869470e9138c474a645a7fc5' }))));
     }
     static get is() { return "seki-resizable-panel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/scroll-area/seki-scroll-area.js

@@ -152,7 +152,7 @@ export class SekiScrollArea {
     render() {
         const hasVerticalOverflow = this.scrollState.scrollHeight > this.scrollState.clientHeight;
         const hasHorizontalOverflow = this.scrollState.scrollWidth > this.scrollState.clientWidth;
-        return (h(Host, { key: 'f8d32b2e3cecb27de5d882975ac81f46328ca67f', "data-state": this.isScrollbarVisible ? 'visible' : 'hidden', "data-has-vertical-overflow": hasVerticalOverflow ? '' : undefined, "data-has-horizontal-overflow": hasHorizontalOverflow ? '' : undefined }, h("div", { key: 'f624636b0b417e268394c0f057a44c8cd59bba92', ref: (el) => (this.viewportRef = el), part: "viewport", class: "viewport", tabindex: "0", onScroll: this.handleScroll, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("div", { key: '7e42ec534bcb3f779e853e9e5490070eff4c4427', class: "content" }, h("slot", { key: '0bac7e5fd2878fb504e0b9bb4d1951f818c2cfff' }))), h("slot", { key: '5f409c21ba5b9fba4123e2797018ad5454ba23c7', name: "scrollbar" })));
+        return (h(Host, { key: 'd933f2f45821018aa92a2b9b88638eb6f061aaf6', "data-state": this.isScrollbarVisible ? 'visible' : 'hidden', "data-has-vertical-overflow": hasVerticalOverflow ? '' : undefined, "data-has-horizontal-overflow": hasHorizontalOverflow ? '' : undefined }, h("div", { key: '14c88c502df49b8609f8a7177d4920bca2df4f47', ref: (el) => (this.viewportRef = el), part: "viewport", class: "viewport", tabindex: "0", onScroll: this.handleScroll, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, h("div", { key: 'db9426461caa0293381031c4943c0748bce2a0f9', class: "content" }, h("slot", { key: '2c686a9252fde9cd33d35935340c15f2ab7c521c' }))), h("slot", { key: 'c99e4816a50c0fea88cadf3e86764494db2f487e', name: "scrollbar" })));
     }
     static get is() { return "seki-scroll-area"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/select/seki-select.js

@@ -1,6 +1,7 @@
 import { Host, h } from "@stencil/core";
 import { publishContext } from "../../utils/context-bridge";
 import { FormControl } from "../../utils/form-control";
+import { OverlayLayer } from "../../utils/overlay";
 /**
  * @slot - Content containing seki-select-trigger and seki-select-content
  */
@@ -36,6 +37,21 @@ export class SekiSelect {
         this.triggerId = `select-trigger-${Math.random().toString(36).substr(2, 9)}`;
         this.searchTimeoutId = null;
         this.searchDebounce = 500;
+        /**
+         * The trigger already closes the list on Escape; this also covers focus
+         * anywhere else and keeps an enclosing dialog open.
+         * Place on the overlay stack (utils/overlay.ts): Escape reaches this
+         * component only when nothing is open on top of it, so one key press closes
+         * one layer (#332).
+         */
+        this.layer = new OverlayLayer({
+            onEscape: (event) => {
+                if (this.isOpen) {
+                    event.preventDefault();
+                    this.handleOpenChange(false);
+                }
+            },
+        });
         this.registrationPublishQueued = false;
         this.handleClickOutside = (event) => {
             // Only close if dropdown is open
@@ -53,10 +69,10 @@ export class SekiSelect {
         // ===========================
         this.handleValueChange = (newValue) => {
             this.internalValue = newValue;
-            // Update controlled prop if it exists
-            if (this.value !== undefined) {
-                this.value = newValue;
-            }
+            // Always mirror the selection onto the `value` prop, so el.value reads
+            // back what the user picked in uncontrolled mode too (#339). A controlled
+            // consumer that re-sets the same value is a no-op for the @Watch.
+            this.value = newValue;
             // Emit change event
             const selectedOptions = this.getSelectedOptions();
             if (this.multiple && Array.isArray(newValue)) {
@@ -214,12 +230,14 @@ export class SekiSelect {
         // (aria-*). State that parts render from is republished with a
         // notification by the watchers below.
         this.el.selectContext = this.buildSelectContext();
+        this.layer.setActive(this.isOpen);
     }
     disconnectedCallback() {
         // Clean up click-outside listener
         if (this.clickOutsideListener) {
             document.removeEventListener('click', this.clickOutsideListener, true);
         }
+        this.layer.setActive(false);
     }
     handleValuePropChange(newValue) {
         if (newValue !== undefined) {
@@ -278,9 +296,7 @@ export class SekiSelect {
     setValueFromForm(next) {
         const value = Array.isArray(next) ? [...next] : next;
         this.internalValue = value;
-        if (this.value !== undefined) {
-            this.value = value;
-        }
+        this.value = value;
     }
     isValueEmpty() {
         const v = this.internalValue;
@@ -441,6 +457,8 @@ export class SekiSelect {
             ariaLabel: this.ariaLabel,
             ariaLabelledby: this.ariaLabelledby,
             ariaDescribedby: this.ariaDescribedby,
+            ariaDescription: this.ariaDescription,
+            ariaInvalid: this.ariaInvalid,
             onValueChange: this.handleValueChange,
             onOpenChange: this.handleOpenChange,
             onOptionFocus: this.handleOptionFocus,
@@ -455,7 +473,7 @@ export class SekiSelect {
     // Render
     // ===========================
     render() {
-        return (h(Host, { key: '13a58769075314b9067f60c14e73dfc8f0bb4242' }, h("slot", { key: '28939ca73356763701694d0633b7d9052f702050' })));
+        return (h(Host, { key: '4a71aaf5068c00bcad390e6a015c23ee16203753' }, h("slot", { key: '69883968cd901d89b376c23a6620edd7b9ec4ef3' })));
     }
     static get is() { return "seki-select"; }
     static get encapsulation() { return "shadow"; }
@@ -737,6 +755,44 @@ export class SekiSelect {
                 "reflect": false,
                 "attribute": "aria-describedby"
             },
+            "ariaDescription": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Text that describes this control. Set by `seki-field` from its description\n(and error) slot, because an `aria-describedby` id cannot cross the shadow\nboundary to the inner element (#358)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "aria-description"
+            },
+            "ariaInvalid": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Marks the control invalid for assistive technology. Set by `seki-field` (#358)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "aria-invalid"
+            },
             "placement": {
                 "type": "string",
                 "mutable": false,

package/dist/collection/components/select-group/seki-select-group.js

@@ -11,7 +11,7 @@ export class SekiSelectGroup {
     // Render
     // ===========================
     render() {
-        return (h(Host, { key: '0ba0fad191131966a75fa138b780e6c0b8ce39bc' }, h("div", { key: '3f445d46b63b0ba92a896c7f48e06f9daf5437bb', class: "group", role: "group", "aria-labelledby": this.groupLabelId }, h("div", { key: '4911d1d1d40cd59b2a252ce07da3462a0c5aaca2', class: "group-separator", "aria-hidden": "true" }), h("div", { key: '9ee28a2cc4980e9eea8510f35aa9f829a36c0f78', class: "group-label", id: this.groupLabelId, role: "presentation" }, h("slot", { key: 'd5c68fe3a81277db11c444d809f77580ac6335bf', name: "label" }, this.label)), h("div", { key: 'ec98783c7ad64bff2f0560558b2d26426f30ef3d', class: "group-options" }, h("slot", { key: 'cd3b66013c12886b41628be9674b839a6d892783' })))));
+        return (h(Host, { key: '0707b0bf05de6c1b88196de6729f3c10b6259a40' }, h("div", { key: '59d2bfe73a9b1bc693d81309740c98228d3f2486', class: "group", role: "group", "aria-labelledby": this.groupLabelId }, h("div", { key: '19598269e7471b45d7694b20c4f1872f1de9fed6', class: "group-separator", "aria-hidden": "true" }), h("div", { key: '113bcca772015b15ff3c7f625db31ace791b5d5d', class: "group-label", id: this.groupLabelId, role: "presentation" }, h("slot", { key: 'b223766c95a812ad6c74e306688f50079ae0d079', name: "label" }, this.label)), h("div", { key: 'b77bcce151260031191a029e29fb12e3a4d5f832', class: "group-options" }, h("slot", { key: '8b45fc6d7b4070ad1c21ad13aa54f553bf6f0507' })))));
     }
     static get is() { return "seki-select-group"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/select-option/seki-select-option.js

@@ -141,7 +141,7 @@ export class SekiSelectOption {
         const selectContext = this.getSelectContext();
         const isSelected = (selectContext === null || selectContext === void 0 ? void 0 : selectContext.isValueSelected(this.value)) || false;
         const isFocused = (selectContext === null || selectContext === void 0 ? void 0 : selectContext.focusedOptionValue) === this.value;
-        return (h(Host, { key: '0c513bf5a4f3d1b462836bb8abd08017f5b75880' }, h("div", { key: '7a4a9008d7c14d016ee2747e0a18ed6e94d769aa', class: "option", role: "option", id: this.optionId, onClick: this.handleOptionClick, onFocus: this.handleOptionFocus, onKeyDown: this.handleOptionKeyDown, "aria-selected": isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, "data-selected": isSelected ? 'true' : undefined, "data-focused": isFocused ? 'true' : undefined, "data-disabled": this.disabled ? 'true' : undefined, tabindex: -1 }, h("span", { key: '6660252c5c42e3e3fe297a734aecacf45bb9afab', class: "option-label" }, h("slot", { key: 'ab3c1a534982cdbe6dc75dc6174ecea320a1f21b' })), h("span", { key: 'a8bf08a92e88a1b3c0f61a2d5ec312f5b9f34b7f', class: "option-indicator", "aria-hidden": "true" }, h("slot", { key: '3e9b9d8ecdb242fdfaf6b0ff5a431f9b8ea6bd67', name: "selected-indicator" }, h("svg", { key: '238a90118e217381e39951d5b92859f759488075', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '08be34c46c3017035ff9f281f433ffa9f91c7d06', d: "M10 3L4.5 8.5L2 6", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
+        return (h(Host, { key: '2f9cda6aace5745c241cc41516964f32dd9c9150' }, h("div", { key: '5c20fffbb001fca4e149ecf142c82e46ff472e6e', class: "option", role: "option", id: this.optionId, onClick: this.handleOptionClick, onFocus: this.handleOptionFocus, onKeyDown: this.handleOptionKeyDown, "aria-selected": isSelected ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : undefined, "data-selected": isSelected ? 'true' : undefined, "data-focused": isFocused ? 'true' : undefined, "data-disabled": this.disabled ? 'true' : undefined, tabindex: -1 }, h("span", { key: '1a36aa341c260a1d3d93cbc05ccbc68989d9fa22', class: "option-label" }, h("slot", { key: '1c89f2be8c02b85bde14b2c71b9e4052fdb16cf3' })), h("span", { key: '95e4c6f4b9bfc1ee64a0b870cd19b5129da99879', class: "option-indicator", "aria-hidden": "true" }, h("slot", { key: '21b90d788c95b3c6bcebb4a881ac17be0e7a5bb4', name: "selected-indicator" }, h("svg", { key: '977dc30b75e9572ad1d05899c097fa7576f7e5b4', width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'd023e0d908de93f227037995e33783e115274a19', d: "M10 3L4.5 8.5L2 6", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
     }
     static get is() { return "seki-select-option"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/select-trigger/seki-select-trigger.js

@@ -117,7 +117,7 @@ export class SekiSelectTrigger {
         const isDisabled = selectContext.disabled;
         return (h(Host, null, h("button", { ref: (el) => this.setButtonRef(el), type: "button", class: "trigger-button", role: "combobox", "aria-expanded": isOpen ? 'true' : 'false', "aria-controls": selectContext.contentId, "aria-activedescendant": selectContext.focusedOptionValue !== null
                 ? buildOptionId(selectContext.contentId, selectContext.focusedOptionValue)
-                : undefined, "aria-label": selectContext.ariaLabel, "aria-labelledby": selectContext.ariaLabelledby, "aria-disabled": isDisabled ? 'true' : undefined, disabled: isDisabled, "data-disabled": isDisabled ? 'true' : undefined, "data-state": isOpen ? 'open' : 'closed' }, selectContext.multiple
+                : undefined, "aria-label": selectContext.ariaLabel, "aria-labelledby": selectContext.ariaLabelledby, "aria-description": selectContext.ariaDescription, "aria-invalid": selectContext.ariaInvalid === 'true' ? 'true' : undefined, "aria-disabled": isDisabled ? 'true' : undefined, disabled: isDisabled, "data-disabled": isDisabled ? 'true' : undefined, "data-state": isOpen ? 'open' : 'closed' }, selectContext.multiple
             ? this.renderMultiValue(selectContext)
             : this.renderSingleValue(selectContext), h("svg", { class: "trigger-chevron", width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true" }, h("path", { d: "M3 4.5L6 7.5L9 4.5", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))));
     }

package/dist/collection/components/separator/seki-separator.js

@@ -23,7 +23,7 @@ export class SekiSeparator {
     }
     render() {
         const isVertical = this.orientation === 'vertical';
-        return (h("div", { key: 'ee0a6075ad39effed579fcf238fd7a0ae1187cc9', class: {
+        return (h("div", { key: '8f0ba61d0c6c5b848b3a32343a2ed6efd7b8775f', class: {
                 'seki-separator': true,
                 'seki-separator--horizontal': !isVertical,
                 'seki-separator--vertical': isVertical,

package/dist/collection/components/sheet/seki-sheet-close.js

@@ -11,7 +11,7 @@ export class SekiSheetClose {
         };
     }
     render() {
-        return (h("div", { key: '2a211518fb3c5764720299775870e506fa51e0a0', class: "seki-sheet-close", part: "close", onClick: this.handleClick }, h("slot", { key: '8882072920feb646fb253933d2f0e2f3548e6efe' })));
+        return (h("div", { key: '41a3bf71c3ed63cd8715f1deb68468ee304b7f82', class: "seki-sheet-close", part: "close", onClick: this.handleClick }, h("slot", { key: '3d5d7fa1c217ac82ddb308d1388a9c08df5c0bd2' })));
     }
     static get is() { return "seki-sheet-close"; }
     static get encapsulation() { return "shadow"; }