@getflip/swirl-components 0.14.1 → 0.16.0

package/dist/components/swirl-lightbox.js

@@ -3,12 +3,19 @@ import { A as A11yDialog } from './a11y-dialog.esm.js';
 import { d as disableBodyScroll, e as enableBodyScroll } from './bodyScrollLock.esm.js';
 import { c as classnames } from './index2.js';
 import { q as querySelectorAllDeep } from './utils.js';
-import { d as defineCustomElement$5 } from './swirl-icon-arrow-left2.js';
-import { d as defineCustomElement$4 } from './swirl-icon-arrow-right2.js';
-import { d as defineCustomElement$3 } from './swirl-icon-close2.js';
-import { d as defineCustomElement$2 } from './swirl-icon-download2.js';
+import { d as defineCustomElement$c } from './swirl-action-list2.js';
+import { d as defineCustomElement$b } from './swirl-action-list-item2.js';
+import { d as defineCustomElement$a } from './swirl-icon-arrow-left2.js';
+import { d as defineCustomElement$9 } from './swirl-icon-arrow-right2.js';
+import { d as defineCustomElement$8 } from './swirl-icon-close2.js';
+import { d as defineCustomElement$7 } from './swirl-icon-more-vertikal2.js';
+import { d as defineCustomElement$6 } from './swirl-popover2.js';
+import { d as defineCustomElement$5 } from './swirl-separator2.js';
+import { d as defineCustomElement$4 } from './swirl-stack2.js';
+import { d as defineCustomElement$3 } from './swirl-text2.js';
+import { d as defineCustomElement$2 } from './swirl-thumbnail2.js';
 
-const swirlLightboxCss = ":host{display:block}:host *{box-sizing:border-box}.lightbox{position:fixed;z-index:var(--s-z-40);background-color:rgba(0, 0, 0, 1);inset:0}.lightbox[aria-hidden=\"true\"]{display:none}@media (min-width: 768px){.lightbox{background-color:rgba(0, 0, 0, 0.6)}}.lightbox:not(.lightbox--closing) .lightbox__body{-webkit-animation:0.15s lightbox-fade-in;animation:0.15s lightbox-fade-in}@media (prefers-reduced-motion){.lightbox:not(.lightbox--closing) .lightbox__body{-webkit-animation:none;animation:none}}.lightbox--closing{-webkit-animation:0.15s lightbox-fade-out;animation:0.15s lightbox-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.lightbox--closing{-webkit-animation:none;animation:none}}.lightbox__body{position:relative;width:100%;height:100%}.lightbox__header{position:absolute;z-index:1;top:0;right:0;left:0;display:flex;padding:var(--s-space-12) var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}.lightbox__controls{position:absolute;z-index:1;top:50%;right:0;left:0;display:none;padding-right:var(--s-space-16);padding-left:var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}@media (min-width: 768px){.lightbox__controls{display:flex}}.lightbox__close-button,.lightbox__download-button,.lightbox__previous-slide-button,.lightbox__next-slide-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer;transition:opacity 0.15s;pointer-events:auto}.lightbox__close-button:disabled,.lightbox__download-button:disabled,.lightbox__previous-slide-button:disabled,.lightbox__next-slide-button:disabled{pointer-events:none;opacity:0}.lightbox__content{overflow:hidden;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none}.lightbox__slides{display:flex;width:100%;height:100%}.lightbox__slides ::slotted(*){flex-basis:100%;flex-shrink:0;transition:transform 0.3s}@media (min-width: 768px){.lightbox__slides ::slotted(*){padding:4rem 5rem}}@media (prefers-reduced-motion){.lightbox__slides ::slotted(*){transition:none}}.lightbox__pagination{position:absolute;bottom:var(--s-space-32);left:50%;padding:var(--s-space-4) var(--s-space-12);border-radius:var(--s-border-radius-base);color:var(--s-text-on-image);background-color:rgba(0, 0, 0, 0.6);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);transform:translateX(-50%);pointer-events:none}@media (min-width: 768px){.lightbox__pagination{display:none}}@-webkit-keyframes lightbox-fade-in{from{opacity:0}to{opacity:1}}@keyframes lightbox-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes lightbox-fade-out{from{opacity:1}to{opacity:0}}@keyframes lightbox-fade-out{from{opacity:1}to{opacity:0}}";
+const swirlLightboxCss = ":host{display:block}:host *{box-sizing:border-box}.lightbox{position:fixed;z-index:var(--s-z-40);background-color:rgba(0, 0, 0, 1);inset:0}.lightbox[aria-hidden=\"true\"]{display:none}@media (min-width: 768px){.lightbox{background-color:rgba(0, 0, 0, 0.6)}}.lightbox:not(.lightbox--closing) .lightbox__body{-webkit-animation:0.15s lightbox-fade-in;animation:0.15s lightbox-fade-in}@media (prefers-reduced-motion){.lightbox:not(.lightbox--closing) .lightbox__body{-webkit-animation:none;animation:none}}.lightbox--closing{-webkit-animation:0.15s lightbox-fade-out;animation:0.15s lightbox-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.lightbox--closing{-webkit-animation:none;animation:none}}.lightbox__body{position:relative;width:100%;height:100%}.lightbox__header{position:absolute;z-index:1;top:0;right:0;left:0;display:flex;padding:var(--s-space-12) var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}.lightbox__controls{position:absolute;z-index:1;top:50%;right:0;left:0;display:none;padding-right:var(--s-space-16);padding-left:var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}@media (min-width: 768px){.lightbox__controls{display:flex}}.lightbox__close-button,.lightbox__menu-button,.lightbox__previous-slide-button,.lightbox__next-slide-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer;transition:opacity 0.15s;pointer-events:auto}.lightbox__close-button:disabled,.lightbox__menu-button:disabled,.lightbox__previous-slide-button:disabled,.lightbox__next-slide-button:disabled{pointer-events:none;opacity:0}.lightbox__content{overflow:hidden;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none}.lightbox__slides{display:flex;width:100%;height:100%}.lightbox__slides ::slotted(*){flex-basis:100%;flex-shrink:0;transition:transform 0.3s}@media (min-width: 768px){.lightbox__slides ::slotted(*){padding:4rem 5rem}}@media (prefers-reduced-motion){.lightbox__slides ::slotted(*){transition:none}}.lightbox__pagination{position:absolute;bottom:var(--s-space-32);left:50%;padding:var(--s-space-4) var(--s-space-12);border-radius:var(--s-border-radius-base);color:var(--s-text-on-image);background-color:rgba(0, 0, 0, 0.6);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);transform:translateX(-50%);pointer-events:none}@media (min-width: 768px){.lightbox__pagination{display:none}}.lightbox__meta{display:flex;padding-top:var(--s-space-4);padding-right:var(--s-space-16);padding-bottom:var(--s-space-4);padding-left:var(--s-space-16);align-items:center;gap:var(--s-space-12)}@media (min-width: 768px){.lightbox__meta{max-width:18rem}}.lightbox__thumbnail{display:inline-flex;flex-shrink:0}.lightbox__file-info{display:flex;min-width:0;flex-grow:1;flex-direction:column}@-webkit-keyframes lightbox-fade-in{from{opacity:0}to{opacity:1}}@keyframes lightbox-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes lightbox-fade-out{from{opacity:1}to{opacity:0}}@keyframes lightbox-fade-out{from{opacity:1}to{opacity:0}}";
 
 const SwirlLightbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -23,6 +30,7 @@ const SwirlLightbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     this.onDownloadButtonClick = () => {
       var _a;
       (_a = this.slides[this.activeSlideIndex]) === null || _a === void 0 ? void 0 : _a.download();
+      this.menu.close();
     };
     this.onKeyDown = (event) => {
       if (event.code === "Escape") {
@@ -42,7 +50,7 @@ const SwirlLightbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
       this.activateSlide(Math.max(0, this.activeSlideIndex - 1));
     };
     this.registerSlides = () => {
-      this.slides = Array.from(this.el.children);
+      this.slides = Array.from(this.el.children).filter((el) => el.tagName === "SWIRL-FILE-VIEWER");
       this.setSlideAttributes();
       this.updateMediaPlayers();
     };
@@ -98,8 +106,10 @@ const SwirlLightbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
       }
     };
     this.closeButtonLabel = "Close modal";
-    this.downloadButtonLabel = "Download active slide content";
+    this.downloadButtonLabel = "Download";
     this.label = undefined;
+    this.menuLabel = "Slide options";
+    this.menuTriggerLabel = "Open slide menu";
     this.nextSlideButtonLabel = "Next slide";
     this.previousSlideButtonLabel = "Previous slide";
     this.activeSlideIndex = 0;
@@ -145,6 +155,8 @@ const SwirlLightbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
    * @param newActiveSlideIndex
    */
   async activateSlide(newActiveSlideIndex) {
+    var _a, _b;
+    (_b = (_a = this.menu) === null || _a === void 0 ? void 0 : _a.close) === null || _b === void 0 ? void 0 : _b.call(_a);
     this.dragging = false;
     this.activeSlideIndex = newActiveSlideIndex;
     this.slides.forEach((slide, index) => {
@@ -189,6 +201,18 @@ const SwirlLightbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
       slide.style.transform = `translate3d(-${100 * this.activeSlideIndex}%, 0, 0)`;
     });
   }
+  getCurrentFileName() {
+    var _a, _b;
+    return (_b = (_a = this.slides[this.activeSlideIndex]) === null || _a === void 0 ? void 0 : _a.file) === null || _b === void 0 ? void 0 : _b.split("/").pop();
+  }
+  getCurrentFileType() {
+    var _a;
+    return (_a = this.slides[this.activeSlideIndex]) === null || _a === void 0 ? void 0 : _a.type;
+  }
+  getCurrentThumbnailUrl() {
+    var _a;
+    return (_a = this.slides[this.activeSlideIndex]) === null || _a === void 0 ? void 0 : _a.thumbnailUrl;
+  }
   lockBodyScroll() {
     disableBodyScroll(this.el);
   }
@@ -213,10 +237,13 @@ const SwirlLightbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
   }
   render() {
     const showPagination = this.slides.length > 1;
+    const currentFileName = this.getCurrentFileName();
+    const currentFileType = this.getCurrentFileType();
+    const currentThumbnailUrl = this.getCurrentThumbnailUrl();
     const className = classnames("lightbox", {
       "lightbox--closing": this.closing,
     });
-    return (h(Host, null, h("section", { "aria-hidden": "true", "aria-label": this.label, class: className, id: "lightbox", onMouseDown: this.onPointerDown, onMouseMove: this.onPointerMove, onMouseOut: this.onPointerUp, onMouseUp: this.onPointerUp, onKeyDown: this.onKeyDown, onTouchEnd: this.onPointerUp, onTouchMove: this.onPointerMove, onTouchStart: this.onPointerDown, ref: (el) => (this.modalEl = el) }, h("div", { class: "lightbox__body", role: "document" }, h("header", { class: "lightbox__header" }, h("button", { "aria-label": this.closeButtonLabel, class: "lightbox__close-button", onClick: this.onCloseButtonClick }, h("swirl-icon-close", null)), h("button", { "aria-label": this.downloadButtonLabel, class: "lightbox__download-button", onClick: this.onDownloadButtonClick }, h("swirl-icon-download", null))), h("div", { "aria-roledescription": "carousel", class: "lightbox__content", role: "group" }, h("div", { "aria-atomic": "false", "aria-live": "polite", class: "lightbox__slides" }, h("slot", { onSlotchange: this.registerSlides }))), h("div", { class: "lightbox__controls" }, h("button", { "aria-label": this.previousSlideButtonLabel, class: "lightbox__previous-slide-button", disabled: this.activeSlideIndex === 0, onClick: this.onPreviousSlideClick }, h("swirl-icon-arrow-left", null)), h("button", { "aria-label": this.nextSlideButtonLabel, class: "lightbox__next-slide-button", disabled: this.activeSlideIndex === this.slides.length - 1, onClick: this.onNextSlideClick }, h("swirl-icon-arrow-right", null))), showPagination && (h("span", { class: "lightbox__pagination" }, h("span", { "aria-current": "page" }, this.activeSlideIndex + 1), " /", " ", this.slides.length))))));
+    return (h(Host, null, h("section", { "aria-hidden": "true", "aria-label": this.label, class: className, id: "lightbox", onMouseDown: this.onPointerDown, onMouseMove: this.onPointerMove, onMouseOut: this.onPointerUp, onMouseUp: this.onPointerUp, onKeyDown: this.onKeyDown, onTouchEnd: this.onPointerUp, onTouchMove: this.onPointerMove, onTouchStart: this.onPointerDown, ref: (el) => (this.modalEl = el) }, h("div", { class: "lightbox__body", role: "document" }, h("header", { class: "lightbox__header" }, h("button", { "aria-label": this.closeButtonLabel, class: "lightbox__close-button", onClick: this.onCloseButtonClick }, h("swirl-icon-close", null)), h("button", { "aria-label": this.menuTriggerLabel, class: "lightbox__menu-button", id: "slide-menu-trigger" }, h("swirl-icon-more-vertikal", null))), h("div", { "aria-roledescription": "carousel", class: "lightbox__content", role: "group" }, h("div", { "aria-atomic": "false", "aria-live": "polite", class: "lightbox__slides" }, h("slot", { onSlotchange: this.registerSlides }))), h("div", { class: "lightbox__controls" }, h("button", { "aria-label": this.previousSlideButtonLabel, class: "lightbox__previous-slide-button", disabled: this.activeSlideIndex === 0, onClick: this.onPreviousSlideClick }, h("swirl-icon-arrow-left", null)), h("button", { "aria-label": this.nextSlideButtonLabel, class: "lightbox__next-slide-button", disabled: this.activeSlideIndex === this.slides.length - 1, onClick: this.onNextSlideClick }, h("swirl-icon-arrow-right", null))), showPagination && (h("span", { class: "lightbox__pagination" }, h("span", { "aria-current": "page" }, this.activeSlideIndex + 1), " /", " ", this.slides.length))), h("swirl-popover", { animation: "scale-in-y", disableScrollLock: true, label: this.menuLabel, placement: "bottom-end", popoverId: "slide-menu", ref: (el) => (this.menu = el), trigger: "slide-menu-trigger" }, h("swirl-stack", null, h("div", { class: "lightbox__meta" }, currentThumbnailUrl && (h("div", { class: "lightbox__thumbnail" }, h("swirl-thumbnail", { alt: "", src: currentThumbnailUrl }))), h("div", { class: "lightbox__file-info" }, h("swirl-text", { truncate: true, weight: "semibold" }, currentFileName), h("swirl-text", { color: "subdued", size: "sm", truncate: true }, currentFileType))), h("swirl-separator", null), h("swirl-action-list", null, h("swirl-action-list-item", { icon: "<swirl-icon-download></swirl-icon-download>", label: this.downloadButtonLabel, onClick: this.onDownloadButtonClick }), h("slot", { name: "menu-items" })))))));
   }
   get el() { return this; }
   static get style() { return swirlLightboxCss; }
@@ -224,6 +251,8 @@ const SwirlLightbox$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLEleme
     "closeButtonLabel": [1, "close-button-label"],
     "downloadButtonLabel": [1, "download-button-label"],
     "label": [1],
+    "menuLabel": [1, "menu-label"],
+    "menuTriggerLabel": [1, "menu-trigger-label"],
     "nextSlideButtonLabel": [1, "next-slide-button-label"],
     "previousSlideButtonLabel": [1, "previous-slide-button-label"],
     "activeSlideIndex": [32],
@@ -237,35 +266,71 @@ function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["swirl-lightbox", "swirl-icon-arrow-left", "swirl-icon-arrow-right", "swirl-icon-close", "swirl-icon-download"];
+  const components = ["swirl-lightbox", "swirl-action-list", "swirl-action-list-item", "swirl-icon-arrow-left", "swirl-icon-arrow-right", "swirl-icon-close", "swirl-icon-more-vertikal", "swirl-popover", "swirl-separator", "swirl-stack", "swirl-text", "swirl-thumbnail"];
   components.forEach(tagName => { switch (tagName) {
     case "swirl-lightbox":
       if (!customElements.get(tagName)) {
         customElements.define(tagName, SwirlLightbox$1);
       }
       break;
+    case "swirl-action-list":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$c();
+      }
+      break;
+    case "swirl-action-list-item":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$b();
+      }
+      break;
     case "swirl-icon-arrow-left":
       if (!customElements.get(tagName)) {
-        defineCustomElement$5();
+        defineCustomElement$a();
       }
       break;
     case "swirl-icon-arrow-right":
       if (!customElements.get(tagName)) {
-        defineCustomElement$4();
+        defineCustomElement$9();
       }
       break;
     case "swirl-icon-close":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$8();
+      }
+      break;
+    case "swirl-icon-more-vertikal":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$7();
+      }
+      break;
+    case "swirl-popover":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$6();
+      }
+      break;
+    case "swirl-separator":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$5();
+      }
+      break;
+    case "swirl-stack":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "swirl-text":
       if (!customElements.get(tagName)) {
         defineCustomElement$3();
       }
       break;
-    case "swirl-icon-download":
+    case "swirl-thumbnail":
       if (!customElements.get(tagName)) {
         defineCustomElement$2();
       }
       break;
   } });
 }
+defineCustomElement$1();
 
 const SwirlLightbox = SwirlLightbox$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/swirl-link.js

@@ -33,6 +33,7 @@ function defineCustomElement$1() {
       break;
   } });
 }
+defineCustomElement$1();
 
 const SwirlLink = SwirlLink$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/swirl-list.js

@@ -31,6 +31,7 @@ function defineCustomElement$1() {
       break;
   } });
 }
+defineCustomElement$1();
 
 const SwirlList = SwirlList$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/swirl-modal.js

@@ -156,6 +156,7 @@ function defineCustomElement$1() {
       break;
   } });
 }
+defineCustomElement$1();
 
 const SwirlModal = SwirlModal$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/swirl-option-list-item2.js

@@ -110,5 +110,6 @@ function defineCustomElement() {
       break;
   } });
 }
+defineCustomElement();
 
 export { SwirlOptionListItem as S, defineCustomElement as d };

package/dist/components/swirl-option-list-section.js

@@ -29,6 +29,7 @@ function defineCustomElement$1() {
       break;
   } });
 }
+defineCustomElement$1();
 
 const SwirlOptionListSection = SwirlOptionListSection$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/swirl-option-list2.js

@@ -3375,5 +3375,6 @@ function defineCustomElement() {
       break;
   } });
 }
+defineCustomElement();
 
 export { SwirlOptionList as S, defineCustomElement as d };

package/dist/components/swirl-pagination.js

@@ -96,6 +96,7 @@ function defineCustomElement$1() {
       break;
   } });
 }
+defineCustomElement$1();
 
 const SwirlPagination = SwirlPagination$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/swirl-pdf-reader.js

@@ -3,25 +3,31 @@ import { A as A11yDialog } from './a11y-dialog.esm.js';
 import { d as disableBodyScroll, e as enableBodyScroll } from './bodyScrollLock.esm.js';
 import { c as classnames } from './index2.js';
 import { i as isMobileViewport } from './utils.js';
-import { d as defineCustomElement$i } from './swirl-button2.js';
-import { d as defineCustomElement$h } from './swirl-file-viewer2.js';
-import { d as defineCustomElement$g } from './swirl-file-viewer-audio2.js';
-import { d as defineCustomElement$f } from './swirl-file-viewer-csv2.js';
-import { d as defineCustomElement$e } from './swirl-file-viewer-image2.js';
-import { d as defineCustomElement$d } from './swirl-file-viewer-pdf2.js';
-import { d as defineCustomElement$c } from './swirl-file-viewer-text2.js';
-import { d as defineCustomElement$b } from './swirl-file-viewer-video2.js';
-import { d as defineCustomElement$a } from './swirl-icon-add2.js';
-import { d as defineCustomElement$9 } from './swirl-icon-error2.js';
-import { d as defineCustomElement$8 } from './swirl-icon-expand-more2.js';
-import { d as defineCustomElement$7 } from './swirl-icon-fullscreen2.js';
-import { d as defineCustomElement$6 } from './swirl-icon-fullscreen-exit2.js';
-import { d as defineCustomElement$5 } from './swirl-icon-remove2.js';
-import { d as defineCustomElement$4 } from './swirl-inline-error2.js';
-import { d as defineCustomElement$3 } from './swirl-spinner2.js';
+import { d as defineCustomElement$o } from './swirl-action-list2.js';
+import { d as defineCustomElement$n } from './swirl-action-list-item2.js';
+import { d as defineCustomElement$m } from './swirl-button2.js';
+import { d as defineCustomElement$l } from './swirl-file-viewer2.js';
+import { d as defineCustomElement$k } from './swirl-file-viewer-audio2.js';
+import { d as defineCustomElement$j } from './swirl-file-viewer-csv2.js';
+import { d as defineCustomElement$i } from './swirl-file-viewer-image2.js';
+import { d as defineCustomElement$h } from './swirl-file-viewer-pdf2.js';
+import { d as defineCustomElement$g } from './swirl-file-viewer-text2.js';
+import { d as defineCustomElement$f } from './swirl-file-viewer-video2.js';
+import { d as defineCustomElement$e } from './swirl-icon-add2.js';
+import { d as defineCustomElement$d } from './swirl-icon-error2.js';
+import { d as defineCustomElement$c } from './swirl-icon-expand-more2.js';
+import { d as defineCustomElement$b } from './swirl-icon-fullscreen2.js';
+import { d as defineCustomElement$a } from './swirl-icon-fullscreen-exit2.js';
+import { d as defineCustomElement$9 } from './swirl-icon-remove2.js';
+import { d as defineCustomElement$8 } from './swirl-inline-error2.js';
+import { d as defineCustomElement$7 } from './swirl-popover2.js';
+import { d as defineCustomElement$6 } from './swirl-separator2.js';
+import { d as defineCustomElement$5 } from './swirl-spinner2.js';
+import { d as defineCustomElement$4 } from './swirl-stack2.js';
+import { d as defineCustomElement$3 } from './swirl-text2.js';
 import { d as defineCustomElement$2 } from './swirl-visually-hidden2.js';
 
-const swirlPdfReaderCss = ":host{display:block}:host *{box-sizing:border-box}.pdf-reader{position:fixed;z-index:var(--s-z-40);background-color:var(--s-surface-raised-default);inset:0;touch-action:pan-x pan-y}.pdf-reader[aria-hidden=\"true\"]{display:none}.pdf-reader:not(.pdf-reader--closing) .pdf-reader__body{-webkit-animation:0.15s pdf-reader-fade-in;animation:0.15s pdf-reader-fade-in}@media (prefers-reduced-motion){.pdf-reader:not(.pdf-reader--closing) .pdf-reader__body{-webkit-animation:none;animation:none}}.pdf-reader--closing{-webkit-animation:0.15s pdf-reader-fade-out;animation:0.15s pdf-reader-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.pdf-reader--closing{-webkit-animation:none;animation:none}}.pdf-reader__body{position:relative;width:100%;height:100%}.pdf-reader__header{display:flex;height:4rem;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center;border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);gap:var(--s-space-8)}.pdf-reader__header-left,.pdf-reader__header-right{display:flex;flex-grow:1;align-items:center;gap:var(--s-space-8)}@media (min-width: 768px){.pdf-reader__header-left,.pdf-reader__header-right{flex-basis:calc(100 / 3 * 1%);flex-grow:0}}.pdf-reader__header-right{justify-content:flex-end}.pdf-reader__header-center{display:none;flex-grow:1;justify-content:center;align-items:center;gap:var(--s-space-16)}@media (min-width: 768px){.pdf-reader__header-center{display:flex}}.pdf-reader__label{overflow:hidden;flex-grow:1;font-weight:var(--s-font-weight-semibold);white-space:nowrap;text-overflow:ellipsis}.pdf-reader__zoom-button-container{display:flex;align-items:center;gap:var(--s-space-8)}.pdf-reader__zoom-button-container>*:not(:last-child){position:relative}.pdf-reader__zoom-button-container>*:not(:last-child):after{position:absolute;top:50%;right:calc(-1 * var(--s-space-4));width:var(--s-border-width-default);height:1.5rem;background-color:var(--s-border-default);content:\"\";transform:translate3d(50%, -50%, 0)}.pdf-reader__zoom-select-container{position:relative}.pdf-reader__zoom-select{display:inline-flex;height:2.5rem;padding-right:var(--s-space-12);padding-right:calc(var(--s-space-8) + 1.5rem + var(--s-space-12));padding-left:var(--s-space-12);justify-content:flex-start;align-items:center;border:var(--s-border-width-default) solid var(--s-border-default);border-radius:var(--s-border-radius-sm);color:var(--s-interactive-neutral-default);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-medium);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.pdf-reader__zoom-select:focus:not(:focus-visible){outline:none}.pdf-reader__zoom-select:focus-visible{outline-color:var(--s-focus-default)}.pdf-reader__zoom-select-icon{position:absolute;top:50%;right:var(--s-space-8);display:inline-flex;transform:translateY(-50%);pointer-events:none}.pdf-reader__content{width:100%;height:calc(100% - 4rem)}.pdf-reader__mobile-zoom-controls{position:absolute;z-index:1;right:var(--s-space-16);bottom:var(--s-space-32);display:flex;padding-bottom:var(--s-space-4);flex-direction:column;gap:var(--s-space-8)}@media (min-width: 768px){.pdf-reader__mobile-zoom-controls{display:none}}.pdf-reader__mobile-zoom-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer;transition:opacity 0.15s;pointer-events:auto}.pdf-reader__mobile-zoom-button:disabled{cursor:default}@-webkit-keyframes pdf-reader-fade-in{from{opacity:0}to{opacity:1}}@keyframes pdf-reader-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes pdf-reader-fade-out{from{opacity:1}to{opacity:0}}@keyframes pdf-reader-fade-out{from{opacity:1}to{opacity:0}}";
+const swirlPdfReaderCss = ":host{display:block}:host *{box-sizing:border-box}.pdf-reader{position:fixed;z-index:var(--s-z-40);background-color:var(--s-surface-raised-default);inset:0;touch-action:pan-x pan-y}.pdf-reader[aria-hidden=\"true\"]{display:none}.pdf-reader:not(.pdf-reader--closing) .pdf-reader__body{-webkit-animation:0.15s pdf-reader-fade-in;animation:0.15s pdf-reader-fade-in}@media (prefers-reduced-motion){.pdf-reader:not(.pdf-reader--closing) .pdf-reader__body{-webkit-animation:none;animation:none}}.pdf-reader--closing{-webkit-animation:0.15s pdf-reader-fade-out;animation:0.15s pdf-reader-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.pdf-reader--closing{-webkit-animation:none;animation:none}}.pdf-reader__body{position:relative;width:100%;height:100%}.pdf-reader__header{display:flex;height:4rem;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center;border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);gap:var(--s-space-8)}.pdf-reader__header-left,.pdf-reader__header-right{display:flex;flex-grow:1;align-items:center;gap:var(--s-space-8)}@media (min-width: 768px){.pdf-reader__header-left,.pdf-reader__header-right{flex-basis:calc(100 / 3 * 1%);flex-grow:0}}.pdf-reader__header-right{justify-content:flex-end}.pdf-reader__header-center{display:none;flex-grow:1;justify-content:center;align-items:center;gap:var(--s-space-16)}@media (min-width: 768px){.pdf-reader__header-center{display:flex}}.pdf-reader__label{overflow:hidden;flex-grow:1;font-weight:var(--s-font-weight-semibold);white-space:nowrap;text-overflow:ellipsis}.pdf-reader__zoom-button-container{display:flex;align-items:center;gap:var(--s-space-8)}.pdf-reader__zoom-button-container>*:not(:last-child){position:relative}.pdf-reader__zoom-button-container>*:not(:last-child):after{position:absolute;top:50%;right:calc(-1 * var(--s-space-4));width:var(--s-border-width-default);height:1.5rem;background-color:var(--s-border-default);content:\"\";transform:translate3d(50%, -50%, 0)}.pdf-reader__zoom-select-container{position:relative}.pdf-reader__zoom-select{display:inline-flex;height:2.5rem;padding-right:var(--s-space-12);padding-right:calc(var(--s-space-8) + 1.5rem + var(--s-space-12));padding-left:var(--s-space-12);justify-content:flex-start;align-items:center;border:var(--s-border-width-default) solid var(--s-border-default);border-radius:var(--s-border-radius-sm);color:var(--s-interactive-neutral-default);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-medium);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.pdf-reader__zoom-select:focus:not(:focus-visible){outline:none}.pdf-reader__zoom-select:focus-visible{outline-color:var(--s-focus-default)}.pdf-reader__zoom-select-icon{position:absolute;top:50%;right:var(--s-space-8);display:inline-flex;transform:translateY(-50%);pointer-events:none}.pdf-reader__content{width:100%;height:calc(100% - 4rem)}.pdf-reader__mobile-zoom-controls{position:absolute;z-index:1;right:var(--s-space-16);bottom:var(--s-space-32);display:flex;padding-bottom:var(--s-space-4);flex-direction:column;gap:var(--s-space-8)}@media (min-width: 768px){.pdf-reader__mobile-zoom-controls{display:none}}.pdf-reader__mobile-zoom-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer;transition:opacity 0.15s;pointer-events:auto}.pdf-reader__mobile-zoom-button:disabled{cursor:default}.pdf-reader__meta{display:flex;padding-top:var(--s-space-4);padding-right:var(--s-space-16);padding-bottom:var(--s-space-4);padding-left:var(--s-space-8);align-items:center;gap:var(--s-space-12)}@media (min-width: 768px){.pdf-reader__meta{max-width:18rem}}.pdf-reader__thumbnail{display:inline-flex;flex-shrink:0;padding-left:var(--s-space-4)}.pdf-reader__file-info{display:flex;min-width:0;flex-grow:1;flex-direction:column}@-webkit-keyframes pdf-reader-fade-in{from{opacity:0}to{opacity:1}}@keyframes pdf-reader-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes pdf-reader-fade-out{from{opacity:1}to{opacity:0}}@keyframes pdf-reader-fade-out{from{opacity:1}to{opacity:0}}";
 
 const SwirlPdfReader$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -44,11 +50,13 @@ const SwirlPdfReader$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     };
     this.onPrintButtonClick = () => {
       this.pdfViewer.print();
+      this.menu.close();
     };
     this.onDownloadButtonClick = async () => {
       this.downloading = true;
       await this.viewer.download();
       this.downloading = false;
+      this.menu.close();
     };
     this.onZoomInButtonClick = () => {
       const currentZoomStepIndex = this.zoomSteps.indexOf(+this.zoom);
@@ -75,7 +83,10 @@ const SwirlPdfReader$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     this.closeButtonLabel = "Close PDF viewer";
     this.downloadButtonLabel = "Download PDF";
     this.file = undefined;
+    this.fileTypeLabel = "PDF Document";
     this.label = undefined;
+    this.menuLabel = "File menu";
+    this.menuTriggerLabel = "Open file menu";
     this.printButtonLabel = "Print PDF";
     this.zoomInButtonLabel = "Zoom in";
     this.zoomOutButtonLabel = "Zoom out";
@@ -148,9 +159,9 @@ const SwirlPdfReader$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     const className = classnames("pdf-reader", {
       "pdf-reader--closing": this.closing,
     });
-    return (h(Host, null, h("section", { "aria-hidden": "true", "aria-label": this.label, class: className, id: "pdf-reader", onKeyDown: this.onKeyDown, ref: (el) => (this.modalEl = el) }, h("div", { class: "pdf-reader__body", role: "document" }, h("header", { class: "pdf-reader__header" }, h("span", { class: "pdf-reader__header-left" }, h("swirl-button", { class: "pdf-reader__close-button", hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick }), h("span", { class: "pdf-reader__label" }, this.label)), h("span", { class: "pdf-reader__header-center" }, h("span", { class: "pdf-reader__zoom-button-container" }, h("swirl-button", { class: "pdf-reader__zoom-button", disabled: this.zoom === this.zoomSteps[0], hideLabel: true, icon: "<swirl-icon-remove></swirl-icon-remove>", label: this.zoomOutButtonLabel, onClick: this.onZoomOutButtonClick }), h("swirl-button", { class: "pdf-reader__zoom-button", disabled: this.zoom === this.zoomSteps[this.zoomSteps.length - 1], hideLabel: true, icon: "<swirl-icon-add></swirl-icon-add>", label: this.zoomInButtonLabel, onClick: this.onZoomInButtonClick })), h("span", { class: "pdf-reader__zoom-select-container" }, h("select", { "aria-label": this.zoomSelectLabel, class: "pdf-reader__zoom-select", name: "zoom-select", id: "zoom-select", onChange: this.onZoomChange }, h("option", { selected: this.zoom === "auto", value: "auto" }, this.autoZoomLabel), this.zoomSteps.map((zoom) => (h("option", { key: zoom, selected: this.zoom === zoom, value: zoom }, zoom * 100, "%")))), h("swirl-icon-expand-more", { class: "pdf-reader__zoom-select-icon" }))), h("span", { class: "pdf-reader__header-right" }, h("swirl-button", { class: "pdf-reader__print-button", hideLabel: true, icon: "<swirl-icon-print></swirl-icon-print>", label: this.printButtonLabel, onClick: this.onPrintButtonClick }), h("swirl-button", { class: "pdf-reader__download-button", disabled: this.downloading, hideLabel: true, icon: !this.downloading
+    return (h(Host, null, h("section", { "aria-hidden": "true", "aria-label": this.label, class: className, id: "pdf-reader", onKeyDown: this.onKeyDown, ref: (el) => (this.modalEl = el) }, h("div", { class: "pdf-reader__body", role: "document" }, h("header", { class: "pdf-reader__header" }, h("span", { class: "pdf-reader__header-left" }, h("swirl-button", { class: "pdf-reader__close-button", hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick }), h("span", { class: "pdf-reader__label" }, this.label)), h("span", { class: "pdf-reader__header-center" }, h("span", { class: "pdf-reader__zoom-button-container" }, h("swirl-button", { class: "pdf-reader__zoom-button", disabled: this.zoom === this.zoomSteps[0], hideLabel: true, icon: "<swirl-icon-remove></swirl-icon-remove>", label: this.zoomOutButtonLabel, onClick: this.onZoomOutButtonClick }), h("swirl-button", { class: "pdf-reader__zoom-button", disabled: this.zoom === this.zoomSteps[this.zoomSteps.length - 1], hideLabel: true, icon: "<swirl-icon-add></swirl-icon-add>", label: this.zoomInButtonLabel, onClick: this.onZoomInButtonClick })), h("span", { class: "pdf-reader__zoom-select-container" }, h("select", { "aria-label": this.zoomSelectLabel, class: "pdf-reader__zoom-select", name: "zoom-select", id: "zoom-select", onChange: this.onZoomChange }, h("option", { selected: this.zoom === "auto", value: "auto" }, this.autoZoomLabel), this.zoomSteps.map((zoom) => (h("option", { key: zoom, selected: this.zoom === zoom, value: zoom }, zoom * 100, "%")))), h("swirl-icon-expand-more", { class: "pdf-reader__zoom-select-icon" }))), h("span", { class: "pdf-reader__header-right" }, h("swirl-button", { class: "pdf-reader__menu-button", hideLabel: true, icon: "<swirl-icon-more-vertikal></swirl-icon-more-vertikal>", id: "menu-trigger", label: this.menuTriggerLabel }))), h("div", { class: "pdf-reader__content" }, h("swirl-file-viewer", { active: this.active, file: this.file, onActivate: this.onActivate, ref: (el) => (this.viewer = el), type: "application/pdf", zoom: this.zoom }), h("div", { class: "pdf-reader__mobile-zoom-controls" }, h("button", { "aria-label": this.autoZoomLabel, class: "pdf-reader__mobile-zoom-button", onClick: this.onZoomAutoButtonClick, type: "button" }, this.zoom === "auto" ? (h("swirl-icon-fullscreen-exit", null)) : (h("swirl-icon-fullscreen", null))), h("button", { "aria-label": this.zoomInButtonLabel, class: "pdf-reader__mobile-zoom-button", disabled: this.zoom === this.zoomSteps[this.zoomSteps.length - 1], onClick: this.onZoomInButtonClick, type: "button" }, h("swirl-icon-add", null)), h("button", { "aria-label": this.zoomOutButtonLabel, class: "pdf-reader__mobile-zoom-button", disabled: this.zoom === this.zoomSteps[0], onClick: this.onZoomOutButtonClick, type: "button" }, h("swirl-icon-remove", null))))), h("swirl-popover", { animation: "scale-in-y", disableScrollLock: true, label: this.menuLabel, placement: "bottom-end", popoverId: "menu", ref: (el) => (this.menu = el), trigger: "menu-trigger" }, h("swirl-stack", null, h("div", { class: "pdf-reader__meta" }, h("div", { class: "pdf-reader__thumbnail" }, h("svg", { fill: "none", height: "36", viewBox: "0 0 24 36", width: "24" }, h("path", { d: "M7.01755 21.6V15.192H8.39455C8.64655 15.192 8.86855 15.225 9.06055 15.291C9.25255 15.357 9.42655 15.474 9.58255 15.642C9.73855 15.81 9.84655 16.008 9.90655 16.236C9.96655 16.458 9.99655 16.761 9.99655 17.145C9.99655 17.433 9.97855 17.676 9.94255 17.874C9.91255 18.072 9.84355 18.258 9.73555 18.432C9.60955 18.642 9.44155 18.807 9.23155 18.927C9.02155 19.041 8.74555 19.098 8.40355 19.098H7.93555V21.6H7.01755ZM7.93555 16.056V18.234H8.37655C8.56255 18.234 8.70655 18.207 8.80855 18.153C8.91055 18.099 8.98555 18.024 9.03355 17.928C9.08155 17.838 9.10855 17.727 9.11455 17.595C9.12655 17.463 9.13255 17.316 9.13255 17.154C9.13255 17.004 9.12955 16.863 9.12355 16.731C9.11755 16.593 9.09055 16.473 9.04255 16.371C8.99455 16.269 8.92255 16.191 8.82655 16.137C8.73055 16.083 8.59255 16.056 8.41255 16.056H7.93555Z", fill: "white" }), h("path", { d: "M10.6826 21.6V15.192H12.0416C12.5696 15.192 12.9686 15.336 13.2386 15.624C13.5146 15.912 13.6526 16.32 13.6526 16.848V19.845C13.6526 20.445 13.5056 20.889 13.2116 21.177C12.9236 21.459 12.5066 21.6 11.9606 21.6H10.6826ZM11.6006 16.056V20.736H12.0236C12.2816 20.736 12.4646 20.673 12.5726 20.547C12.6806 20.415 12.7346 20.211 12.7346 19.935V16.848C12.7346 16.596 12.6836 16.401 12.5816 16.263C12.4796 16.125 12.2936 16.056 12.0236 16.056H11.6006Z", fill: "white" }), h("path", { d: "M14.5146 21.6V15.192H17.2506V16.056H15.4326V18H17.0166V18.864H15.4326V21.6H14.5146Z", fill: "white" }), h("path", { d: "M3.59961 9.00001C3.59961 8.0059 4.4055 7.20001 5.39961 7.20001H14.854C15.3314 7.20001 15.7893 7.38965 16.1268 7.72722L19.8724 11.4728C20.21 11.8104 20.3996 12.2682 20.3996 12.7456V27C20.3996 27.9941 19.5937 28.8 18.5996 28.8H5.39961C4.4055 28.8 3.59961 27.9941 3.59961 27V9.00001Z", fill: "#FF574D" }), h("path", { d: "M15.5996 7.36166V10.2C15.5996 11.1941 16.4055 12 17.3996 12H20.2379C20.3237 12.1884 20.3768 12.3913 20.3937 12.6H17.3996C16.0785 12.6 15.0067 11.5325 14.9996 10.213L14.9996 7.20587C15.2083 7.2228 15.4112 7.27593 15.5996 7.36166Z", fill: "white" }), h("path", { d: "M7.01755 21.6V15.192H8.39455C8.64655 15.192 8.86855 15.225 9.06055 15.291C9.25255 15.357 9.42655 15.474 9.58255 15.642C9.73855 15.81 9.84655 16.008 9.90655 16.236C9.96655 16.458 9.99655 16.761 9.99655 17.145C9.99655 17.433 9.97855 17.676 9.94255 17.874C9.91255 18.072 9.84355 18.258 9.73555 18.432C9.60955 18.642 9.44155 18.807 9.23155 18.927C9.02155 19.041 8.74555 19.098 8.40355 19.098H7.93555V21.6H7.01755ZM7.93555 16.056V18.234H8.37655C8.56255 18.234 8.70655 18.207 8.80855 18.153C8.91055 18.099 8.98555 18.024 9.03355 17.928C9.08155 17.838 9.10855 17.727 9.11455 17.595C9.12655 17.463 9.13255 17.316 9.13255 17.154C9.13255 17.004 9.12955 16.863 9.12355 16.731C9.11755 16.593 9.09055 16.473 9.04255 16.371C8.99455 16.269 8.92255 16.191 8.82655 16.137C8.73055 16.083 8.59255 16.056 8.41255 16.056H7.93555Z", fill: "white" }), h("path", { d: "M10.6826 21.6V15.192H12.0416C12.5696 15.192 12.9686 15.336 13.2386 15.624C13.5146 15.912 13.6526 16.32 13.6526 16.848V19.845C13.6526 20.445 13.5056 20.889 13.2116 21.177C12.9236 21.459 12.5066 21.6 11.9606 21.6H10.6826ZM11.6006 16.056V20.736H12.0236C12.2816 20.736 12.4646 20.673 12.5726 20.547C12.6806 20.415 12.7346 20.211 12.7346 19.935V16.848C12.7346 16.596 12.6836 16.401 12.5816 16.263C12.4796 16.125 12.2936 16.056 12.0236 16.056H11.6006Z", fill: "white" }), h("path", { d: "M14.5146 21.6V15.192H17.2506V16.056H15.4326V18H17.0166V18.864H15.4326V21.6H14.5146Z", fill: "white" }))), h("div", { class: "pdf-reader__file-info" }, h("swirl-text", { truncate: true, weight: "semibold" }, this.label), h("swirl-text", { color: "subdued", size: "sm", truncate: true }, this.fileTypeLabel))), h("swirl-separator", null), h("swirl-action-list", null, h("swirl-action-list-item", { class: "pdf-reader__print-button", icon: "<swirl-icon-print></swirl-icon-print>", label: this.printButtonLabel, onClick: this.onPrintButtonClick }), h("swirl-action-list-item", { class: "pdf-reader__download-button", disabled: this.downloading, icon: !this.downloading
         ? "<swirl-icon-download></swirl-icon-download>"
-        : '<swirl-spinner size="s"></swirl-spinner>', label: this.downloadButtonLabel, onClick: this.onDownloadButtonClick }))), h("div", { class: "pdf-reader__content" }, h("swirl-file-viewer", { active: this.active, file: this.file, onActivate: this.onActivate, ref: (el) => (this.viewer = el), type: "application/pdf", zoom: this.zoom }), h("div", { class: "pdf-reader__mobile-zoom-controls" }, h("button", { "aria-label": this.autoZoomLabel, class: "pdf-reader__mobile-zoom-button", onClick: this.onZoomAutoButtonClick, type: "button" }, this.zoom === "auto" ? (h("swirl-icon-fullscreen-exit", null)) : (h("swirl-icon-fullscreen", null))), h("button", { "aria-label": this.zoomInButtonLabel, class: "pdf-reader__mobile-zoom-button", disabled: this.zoom === this.zoomSteps[this.zoomSteps.length - 1], onClick: this.onZoomInButtonClick, type: "button" }, h("swirl-icon-add", null)), h("button", { "aria-label": this.zoomOutButtonLabel, class: "pdf-reader__mobile-zoom-button", disabled: this.zoom === this.zoomSteps[0], onClick: this.onZoomOutButtonClick, type: "button" }, h("swirl-icon-remove", null))))))));
+        : '<swirl-spinner size="xs"></swirl-spinner>', label: this.downloadButtonLabel, onClick: this.onDownloadButtonClick }), h("slot", { name: "menu-items" })))))));
   }
   get el() { return this; }
   static get style() { return swirlPdfReaderCss; }
@@ -159,7 +170,10 @@ const SwirlPdfReader$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     "closeButtonLabel": [1, "close-button-label"],
     "downloadButtonLabel": [1, "download-button-label"],
     "file": [1],
+    "fileTypeLabel": [1, "file-type-label"],
     "label": [1],
+    "menuLabel": [1, "menu-label"],
+    "menuTriggerLabel": [1, "menu-trigger-label"],
     "printButtonLabel": [1, "print-button-label"],
     "zoomInButtonLabel": [1, "zoom-in-button-label"],
     "zoomOutButtonLabel": [1, "zoom-out-button-label"],
@@ -176,89 +190,119 @@ function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["swirl-pdf-reader", "swirl-button", "swirl-file-viewer", "swirl-file-viewer-audio", "swirl-file-viewer-csv", "swirl-file-viewer-image", "swirl-file-viewer-pdf", "swirl-file-viewer-text", "swirl-file-viewer-video", "swirl-icon-add", "swirl-icon-error", "swirl-icon-expand-more", "swirl-icon-fullscreen", "swirl-icon-fullscreen-exit", "swirl-icon-remove", "swirl-inline-error", "swirl-spinner", "swirl-visually-hidden"];
+  const components = ["swirl-pdf-reader", "swirl-action-list", "swirl-action-list-item", "swirl-button", "swirl-file-viewer", "swirl-file-viewer-audio", "swirl-file-viewer-csv", "swirl-file-viewer-image", "swirl-file-viewer-pdf", "swirl-file-viewer-text", "swirl-file-viewer-video", "swirl-icon-add", "swirl-icon-error", "swirl-icon-expand-more", "swirl-icon-fullscreen", "swirl-icon-fullscreen-exit", "swirl-icon-remove", "swirl-inline-error", "swirl-popover", "swirl-separator", "swirl-spinner", "swirl-stack", "swirl-text", "swirl-visually-hidden"];
   components.forEach(tagName => { switch (tagName) {
     case "swirl-pdf-reader":
       if (!customElements.get(tagName)) {
         customElements.define(tagName, SwirlPdfReader$1);
       }
       break;
+    case "swirl-action-list":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$o();
+      }
+      break;
+    case "swirl-action-list-item":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$n();
+      }
+      break;
     case "swirl-button":
       if (!customElements.get(tagName)) {
-        defineCustomElement$i();
+        defineCustomElement$m();
       }
       break;
     case "swirl-file-viewer":
       if (!customElements.get(tagName)) {
-        defineCustomElement$h();
+        defineCustomElement$l();
       }
       break;
     case "swirl-file-viewer-audio":
       if (!customElements.get(tagName)) {
-        defineCustomElement$g();
+        defineCustomElement$k();
       }
       break;
     case "swirl-file-viewer-csv":
       if (!customElements.get(tagName)) {
-        defineCustomElement$f();
+        defineCustomElement$j();
       }
       break;
     case "swirl-file-viewer-image":
       if (!customElements.get(tagName)) {
-        defineCustomElement$e();
+        defineCustomElement$i();
       }
       break;
     case "swirl-file-viewer-pdf":
       if (!customElements.get(tagName)) {
-        defineCustomElement$d();
+        defineCustomElement$h();
       }
       break;
     case "swirl-file-viewer-text":
       if (!customElements.get(tagName)) {
-        defineCustomElement$c();
+        defineCustomElement$g();
       }
       break;
     case "swirl-file-viewer-video":
       if (!customElements.get(tagName)) {
-        defineCustomElement$b();
+        defineCustomElement$f();
       }
       break;
     case "swirl-icon-add":
       if (!customElements.get(tagName)) {
-        defineCustomElement$a();
+        defineCustomElement$e();
       }
       break;
     case "swirl-icon-error":
       if (!customElements.get(tagName)) {
-        defineCustomElement$9();
+        defineCustomElement$d();
       }
       break;
     case "swirl-icon-expand-more":
       if (!customElements.get(tagName)) {
-        defineCustomElement$8();
+        defineCustomElement$c();
       }
       break;
     case "swirl-icon-fullscreen":
       if (!customElements.get(tagName)) {
-        defineCustomElement$7();
+        defineCustomElement$b();
       }
       break;
     case "swirl-icon-fullscreen-exit":
       if (!customElements.get(tagName)) {
-        defineCustomElement$6();
+        defineCustomElement$a();
       }
       break;
     case "swirl-icon-remove":
       if (!customElements.get(tagName)) {
-        defineCustomElement$5();
+        defineCustomElement$9();
       }
       break;
     case "swirl-inline-error":
       if (!customElements.get(tagName)) {
-        defineCustomElement$4();
+        defineCustomElement$8();
+      }
+      break;
+    case "swirl-popover":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$7();
+      }
+      break;
+    case "swirl-separator":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$6();
       }
       break;
     case "swirl-spinner":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$5();
+      }
+      break;
+    case "swirl-stack":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "swirl-text":
       if (!customElements.get(tagName)) {
         defineCustomElement$3();
       }
@@ -270,6 +314,7 @@ function defineCustomElement$1() {
       break;
   } });
 }
+defineCustomElement$1();
 
 const SwirlPdfReader = SwirlPdfReader$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/swirl-popover2.js

@@ -1,8 +1,8 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { c as computePosition, a as autoUpdate, o as offset, s as shift, f as flip } from './floating-ui.dom.esm.js';
-import { e as enableBodyScroll, d as disableBodyScroll } from './bodyScrollLock.esm.js';
+import { d as disableBodyScroll, e as enableBodyScroll } from './bodyScrollLock.esm.js';
 import { c as classnames } from './index2.js';
-import { i as isMobileViewport, q as querySelectorAllDeep } from './utils.js';
+import { i as isMobileViewport, q as querySelectorAllDeep, b as getActiveElement } from './utils.js';
 
 const swirlPopoverCss = ":host{position:relative;z-index:var(--s-z-40);display:inline-flex}:host *{box-sizing:border-box}.popover--active:not(.popover--closing) .popover__backdrop{-webkit-animation:0.15s popover-fade-in;animation:0.15s popover-fade-in}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__backdrop{-webkit-animation:none;animation:none}}.popover--active:not(.popover--closing) .popover__content{-webkit-animation:0.15s popover-slide-in;animation:0.15s popover-slide-in}@media (min-width: 768px){.popover--active:not(.popover--closing) .popover__content{transform-origin:top left;-webkit-animation:0.15s popover-fade-scale-in-xy;animation:0.15s popover-fade-scale-in-xy}}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__content{-webkit-animation:none;animation:none}}.popover--closing .popover__backdrop{-webkit-animation:0.15s popover-fade-out;animation:0.15s popover-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.popover--closing .popover__backdrop{-webkit-animation:none;animation:none}}.popover--closing .popover__content{-webkit-animation:0.15s popover-slide-out;animation:0.15s popover-slide-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (min-width: 768px){.popover--closing .popover__content{-webkit-animation:0.15s popover-fade-out;animation:0.15s popover-fade-out}}@media (prefers-reduced-motion){.popover--closing .popover__content{-webkit-animation:none;animation:none}}.popover--inactive .popover__content{display:none}@media (min-width: 768px){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{-webkit-animation:0.15s popover-fade-scale-in-y;animation:0.15s popover-fade-scale-in-y}}@media (prefers-reduced-motion){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{-webkit-animation:none;animation:none}}.popover__backdrop{position:fixed;z-index:0;background-color:rgba(0, 0, 0, 0.2);-webkit-animation:0.15s popover-backdrop-fade-in;animation:0.15s popover-backdrop-fade-in;inset:0}@media (prefers-reduced-motion){.popover__backdrop{-webkit-animation:none;animation:none}}@media (min-width: 768px){.popover__backdrop{display:none}}.popover__content{position:fixed;z-index:2;right:0;bottom:0;left:0;overflow:hidden;border-top-left-radius:var(--s-border-radius-xl);border-top-right-radius:var(--s-border-radius-xl);background-color:var(--s-surface-overlay-default)}@media (min-width: 768px){.popover__content{right:unset;bottom:unset;left:unset;max-width:22.5rem;border-radius:var(--s-border-radius-sm);-webkit-animation:none;animation:none;box-shadow:var(--s-shadow-level-1)}}.popover__scroll-container{overflow-x:hidden;overflow-y:auto;width:100%;max-height:90vh;padding-top:var(--s-space-24);padding-bottom:var(--s-space-24);overscroll-behavior:contain}@media (min-width: 768px){.popover__scroll-container{max-height:22rem;padding-top:var(--s-space-8);padding-bottom:var(--s-space-8)}}.popover__handle{position:absolute;top:var(--s-space-8);left:50%;width:2.5rem;height:0.375rem;border-radius:0.1875rem;background-color:var(--s-border-default);transform:translatex(-50%)}@media (min-width: 768px){.popover__handle{display:none}}@-webkit-keyframes popover-slide-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes popover-slide-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@-webkit-keyframes popover-slide-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes popover-slide-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@-webkit-keyframes popover-fade-in{from{opacity:0}to{opacity:1}}@keyframes popover-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes popover-fade-out{from{opacity:1}to{opacity:0}}@keyframes popover-fade-out{from{opacity:1}to{opacity:0}}@-webkit-keyframes popover-fade-scale-in-xy{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes popover-fade-scale-in-xy{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@-webkit-keyframes popover-fade-scale-in-y{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}@keyframes popover-fade-scale-in-y{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}";
 
@@ -53,6 +53,7 @@ const SwirlPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
       this.close();
     };
     this.animation = "scale-in-xy";
+    this.disableScrollLock = undefined;
     this.enableFlip = true;
     this.label = undefined;
     this.offset = 8;
@@ -70,14 +71,15 @@ const SwirlPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     this.updateTriggerAttributes();
   }
   disconnectedCallback() {
-    enableBodyScroll(this.scrollContainer);
+    this.unlockBodyScroll();
   }
   onWindowFocusIn(event) {
     if (!this.active) {
       return;
     }
     const target = event.target;
-    const popoverLostFocus = !this.el.contains(target);
+    const activeElement = getActiveElement();
+    const popoverLostFocus = !this.el.contains(target) && !this.el.contains(activeElement);
     if (popoverLostFocus) {
       this.close();
     }
@@ -202,12 +204,16 @@ const SwirlPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   }
   lockBodyScroll() {
     const mobile = isMobileViewport();
-    if (!mobile) {
+    if (!mobile || this.disableScrollLock) {
       return;
     }
     disableBodyScroll(this.scrollContainer);
   }
   unlockBodyScroll() {
+    const mobile = isMobileViewport();
+    if (!mobile || this.disableScrollLock) {
+      return;
+    }
     enableBodyScroll(this.scrollContainer);
   }
   render() {
@@ -226,6 +232,7 @@ const SwirlPopover = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   static get style() { return swirlPopoverCss; }
 }, [1, "swirl-popover", {
     "animation": [1],
+    "disableScrollLock": [4, "disable-scroll-lock"],
     "enableFlip": [4, "enable-flip"],
     "label": [1],
     "offset": [2],
@@ -252,5 +259,6 @@ function defineCustomElement() {
       break;
   } });
 }
+defineCustomElement();
 
 export { SwirlPopover as S, defineCustomElement as d };

package/dist/components/swirl-progress-indicator.js

@@ -41,6 +41,7 @@ function defineCustomElement$1() {
       break;
   } });
 }
+defineCustomElement$1();
 
 const SwirlProgressIndicator = SwirlProgressIndicator$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/swirl-radio-group.js

@@ -63,6 +63,7 @@ function defineCustomElement$1() {
       break;
   } });
 }
+defineCustomElement$1();
 
 const SwirlRadioGroup = SwirlRadioGroup$1;
 const defineCustomElement = defineCustomElement$1;