@birdapi/velinstyle 1.1.0 → 1.2.0

package/dist/chunks/velin-file-dropzone-XIZMJ3NB.js

@@ -0,0 +1,154 @@
+import {
+  escapeHTML
+} from "./chunk-RDE3QE7Z.js";
+
+// components/velin-file-dropzone.js
+var styles = `
+  :host { display: block; }
+  .zone {
+    border: 2px dashed var(--velin-color-border, #cbd5e1);
+    border-radius: var(--velin-radius-md, 0.5rem);
+    padding: var(--velin-space-6, 1.5rem);
+    background: var(--velin-color-surface-dim, var(--velin-color-bg-subtle, #f8fafc));
+    color: var(--velin-color-text, #111);
+    text-align: center;
+    transition: border-color 150ms ease, background 150ms ease;
+  }
+  :host([dragging]) .zone {
+    border-color: var(--velin-color-primary, #2563eb);
+    background: var(--velin-color-primary-subtle, #eff6ff);
+  }
+  .hint { margin: 0 0 var(--velin-space-3, 0.75rem); color: var(--velin-color-text-muted, #64748b); }
+  .browse {
+    display: inline-flex; align-items: center; justify-content: center;
+    min-block-size: 2.75rem; padding-inline: var(--velin-space-4, 1rem);
+    border-radius: var(--velin-radius-md, 0.5rem);
+    border: none; cursor: pointer;
+    background: var(--velin-color-primary, #2563eb);
+    color: var(--velin-color-on-primary, #fff);
+    font: inherit;
+  }
+  .browse:focus-visible { outline: 2px solid var(--velin-color-focus, #2563eb); outline-offset: 2px; }
+  input[type="file"] {
+    position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px;
+    overflow: hidden; clip: rect(0,0,0,0); border: 0;
+  }
+  .list { list-style: none; padding: 0; margin: var(--velin-space-4, 1rem) 0 0; text-align: start; }
+  .list li {
+    display: flex; justify-content: space-between; gap: var(--velin-space-3, 0.75rem);
+    padding: var(--velin-space-2, 0.5rem) 0;
+    border-block-end: 1px solid var(--velin-color-border, #e2e8f0);
+    font-size: var(--velin-text-sm, 0.875rem);
+  }
+  .progress {
+    margin-block-start: var(--velin-space-3, 0.75rem);
+    block-size: 0.5rem; border-radius: 999px;
+    background: var(--velin-color-border, #e2e8f0); overflow: hidden;
+  }
+  .bar {
+    block-size: 100%; inline-size: 0%;
+    background: var(--velin-color-primary, #2563eb);
+    transition: inline-size 150ms ease;
+  }
+  .status { margin: var(--velin-space-2, 0.5rem) 0 0; font-size: var(--velin-text-sm, 0.875rem); }
+  .status[data-tone="error"] { color: var(--velin-color-danger, #b91c1c); }
+`;
+var VelinFileDropzone = class extends HTMLElement {
+  static get observedAttributes() {
+    return ["accept", "multiple", "label", "progress"];
+  }
+  constructor() {
+    super();
+    this.attachShadow({ mode: "open" });
+    this._files = [];
+  }
+  connectedCallback() {
+    this._render();
+  }
+  attributeChangedCallback() {
+    if (this.shadowRoot?.querySelector(".zone")) this._render();
+  }
+  get files() {
+    return this._files.slice();
+  }
+  _emitFiles(fileList) {
+    const accept = this.getAttribute("accept");
+    const files = [...fileList];
+    if (accept) {
+      const parts = accept.split(",").map((s) => s.trim().toLowerCase());
+      const bad = files.find((f) => {
+        const name = f.name.toLowerCase();
+        const type = (f.type || "").toLowerCase();
+        return !parts.some((p) => p.startsWith(".") ? name.endsWith(p) : type === p || type.startsWith(p.replace("/*", "/")));
+      });
+      if (bad) {
+        this._setStatus(`File type not allowed: ${bad.name}`, "error");
+        this.dispatchEvent(new CustomEvent("velin-error", { bubbles: true, detail: { message: "accept", file: bad } }));
+        return;
+      }
+    }
+    this._files = files;
+    this._setStatus(files.length ? `${files.length} file(s) ready` : "", "ok");
+    this.dispatchEvent(new CustomEvent("velin-files", { bubbles: true, detail: { files } }));
+    this._renderList();
+  }
+  _setStatus(text, tone = "ok") {
+    const el = this.shadowRoot?.querySelector(".status");
+    if (!el) return;
+    el.textContent = text;
+    el.dataset.tone = tone;
+  }
+  _renderList() {
+    const ul = this.shadowRoot?.querySelector(".list");
+    if (!ul) return;
+    ul.innerHTML = this._files.map((f) => `<li><span>${escapeHTML(f.name)}</span><span>${Math.round(f.size / 1024)} KB</span></li>`).join("");
+  }
+  _render() {
+    const label = escapeHTML(this.getAttribute("label") || "Upload files");
+    const accept = this.getAttribute("accept") || "";
+    const multiple = this.hasAttribute("multiple");
+    const progress = Math.max(0, Math.min(100, Number(this.getAttribute("progress") || 0)));
+    this.shadowRoot.innerHTML = `
+      <style>${styles}</style>
+      <div class="zone" role="group" aria-label="${label}">
+        <p class="hint">Drag and drop files here, or browse. Client-side only \u2014 wire <code>velin-files</code> to your upload API.</p>
+        <button type="button" class="browse">Browse files</button>
+        <input type="file" ${accept ? `accept="${escapeHTML(accept)}"` : ""} ${multiple ? "multiple" : ""} />
+        <div class="progress" hidden="${progress <= 0 ? "true" : "false"}" aria-hidden="${progress <= 0 ? "true" : "false"}">
+          <div class="bar" style="inline-size:${progress}%"></div>
+        </div>
+        <p class="status" role="status" aria-live="polite"></p>
+        <ul class="list"></ul>
+      </div>
+    `;
+    const input = this.shadowRoot.querySelector("input");
+    const browse = this.shadowRoot.querySelector(".browse");
+    const zone = this.shadowRoot.querySelector(".zone");
+    browse.addEventListener("click", () => input.click());
+    input.addEventListener("change", () => {
+      if (input.files?.length) this._emitFiles(input.files);
+    });
+    ["dragenter", "dragover"].forEach((ev) => {
+      zone.addEventListener(ev, (e) => {
+        e.preventDefault();
+        this.setAttribute("dragging", "");
+      });
+    });
+    ["dragleave", "drop"].forEach((ev) => {
+      zone.addEventListener(ev, (e) => {
+        e.preventDefault();
+        this.removeAttribute("dragging");
+      });
+    });
+    zone.addEventListener("drop", (e) => {
+      const list = e.dataTransfer?.files;
+      if (list?.length) this._emitFiles(list);
+    });
+    this._renderList();
+  }
+};
+customElements.define("velin-file-dropzone", VelinFileDropzone);
+var velin_file_dropzone_default = VelinFileDropzone;
+export {
+  velin_file_dropzone_default as default
+};

package/dist/chunks/{velin-icon-7M76DOPB.js → velin-icon-A6NCXGUK.js}

@@ -1,7 +1,7 @@
 import {
   sanitizeSVG,
   sanitizeURL
-} from "./chunk-MKZP2TBH.js";
+} from "./chunk-L7ZGUU4D.js";
 
 // components/velin-icon.js
 var PROVIDER_CDNS = {
@@ -29,7 +29,21 @@ function resolveProviderUrl(provider, variant) {
   return PROVIDER_CDNS[provider];
 }
 var _svgCache = /* @__PURE__ */ new Map();
+var DEFAULT_SPRITE = "velin-icons.svg";
+function resolveDefaultSpriteUrl() {
+  if (typeof document !== "undefined") {
+    const meta = document.querySelector('meta[name="velin-icon-sprite"]');
+    const fromMeta = meta?.getAttribute("content")?.trim();
+    if (fromMeta) return fromMeta;
+    const fromHtml = document.documentElement?.getAttribute("data-velin-icon-sprite")?.trim();
+    if (fromHtml) return fromHtml;
+  }
+  const configured = typeof VelinIcon.defaultSprite === "string" ? VelinIcon.defaultSprite.trim() : "";
+  return configured || DEFAULT_SPRITE;
+}
 var VelinIcon = class extends HTMLElement {
+  /** @type {string} Relative or absolute sprite URL used when `sprite` attribute is omitted. */
+  static defaultSprite = DEFAULT_SPRITE;
   static get observedAttributes() {
     return ["name", "size", "label", "provider", "variant", "sprite"];
   }
@@ -46,7 +60,7 @@ var VelinIcon = class extends HTMLElement {
   _render() {
     const name = this.getAttribute("name");
     const size = this.getAttribute("size") || "24";
-    const label = this.getAttribute("label");
+    const a11y = this._resolveA11y();
     const provider = this.getAttribute("provider");
     const variant = this.getAttribute("variant");
     if (!name) {
@@ -54,12 +68,18 @@ var VelinIcon = class extends HTMLElement {
       return;
     }
     if (provider && (PROVIDER_CDNS[provider] || PROVIDER_VARIANTS[provider])) {
-      this._renderFromCDN(name, size, label, provider, variant);
+      this._renderFromCDN(name, size, a11y, provider, variant);
       return;
     }
-    this._renderFromSprite(name, size, label);
+    this._renderFromSprite(name, size, a11y);
+  }
+  _resolveA11y() {
+    const label = (this.getAttribute("label") || this.getAttribute("aria-label") || "").trim();
+    if (label) return { label, hidden: false };
+    const hidden = this.getAttribute("aria-hidden") !== "false";
+    return { label: "", hidden };
   }
-  _renderFromSprite(name, size, label) {
+  _renderFromSprite(name, size, a11y) {
     const svgNS = "http://www.w3.org/2000/svg";
     const svg = document.createElementNS(svgNS, "svg");
     svg.setAttribute("width", size);
@@ -71,7 +91,6 @@ var VelinIcon = class extends HTMLElement {
     svg.setAttribute("stroke-linecap", "round");
     svg.setAttribute("stroke-linejoin", "round");
     this._applyStyle(svg);
-    this._applyA11y(svg, label);
     const use = document.createElementNS(svgNS, "use");
     const spriteAttr = this.getAttribute("sprite");
     const localSymbol = document.getElementById(name);
@@ -80,29 +99,31 @@ var VelinIcon = class extends HTMLElement {
     if (spriteAttr === "" || spriteAttr == null && isLocalSymbol) {
       href = `#${name}`;
     } else {
-      const spriteUrl = sanitizeURL(spriteAttr || "/dist/velin-icons.svg") || "/dist/velin-icons.svg";
+      const fallback = resolveDefaultSpriteUrl();
+      const spriteUrl = sanitizeURL(spriteAttr || fallback) || fallback || DEFAULT_SPRITE;
       href = `${spriteUrl}#${name}`;
     }
     use.setAttribute("href", href);
     svg.appendChild(use);
+    this._applyA11y(svg, a11y);
     this.innerHTML = "";
     this.appendChild(svg);
     this._rendered = true;
   }
-  async _renderFromCDN(name, size, label, provider, variant) {
+  async _renderFromCDN(name, size, a11y, provider, variant) {
     const cacheKey = `${provider}:${variant || "default"}:${name}`;
     if (_svgCache.has(cacheKey)) {
-      this._injectSVG(_svgCache.get(cacheKey), size, label);
+      this._injectSVG(_svgCache.get(cacheKey), size, a11y);
       return;
     }
     const template = resolveProviderUrl(provider, variant);
     if (!template) {
-      this._renderFromSprite(name, size, label);
+      this._renderFromSprite(name, size, a11y);
       return;
     }
     const url = sanitizeURL(template.replace("{name}", name));
     if (!url) {
-      this._renderFromSprite(name, size, label);
+      this._renderFromSprite(name, size, a11y);
       return;
     }
     try {
@@ -112,12 +133,20 @@ var VelinIcon = class extends HTMLElement {
       if (!text.includes("<svg")) throw new Error("Not SVG");
       const clean = await sanitizeSVG(text);
       _svgCache.set(cacheKey, clean);
-      this._injectSVG(clean, size, label);
+      this._injectSVG(clean, size, a11y);
     } catch {
-      this._renderFromSprite(name, size, label);
+      this._renderFromSprite(name, size, a11y);
     }
   }
-  _injectSVG(svgText, size, label) {
+  _stripForeignA11y(svg) {
+    svg.removeAttribute("role");
+    svg.removeAttribute("aria-label");
+    svg.removeAttribute("aria-labelledby");
+    svg.removeAttribute("aria-hidden");
+    svg.querySelector("title")?.remove();
+    svg.querySelector("desc")?.remove();
+  }
+  _injectSVG(svgText, size, a11y) {
     const parser = new DOMParser();
     const doc = parser.parseFromString(svgText, "image/svg+xml");
     const svg = doc.querySelector("svg");
@@ -125,11 +154,12 @@ var VelinIcon = class extends HTMLElement {
       this.innerHTML = "";
       return;
     }
+    this._stripForeignA11y(svg);
     svg.setAttribute("width", size);
     svg.setAttribute("height", size);
     if (!svg.getAttribute("viewBox")) svg.setAttribute("viewBox", "0 0 24 24");
     this._applyStyle(svg);
-    this._applyA11y(svg, label);
+    this._applyA11y(svg, a11y);
     this.innerHTML = "";
     this.appendChild(document.importNode(svg, true));
     this._rendered = true;
@@ -139,12 +169,24 @@ var VelinIcon = class extends HTMLElement {
     svg.style.verticalAlign = "middle";
     svg.style.flexShrink = "0";
   }
-  _applyA11y(svg, label) {
+  _applyA11y(svg, a11y) {
+    const { label, hidden } = a11y;
+    const use = svg.querySelector("use");
     if (label) {
       svg.setAttribute("role", "img");
       svg.setAttribute("aria-label", label);
-    } else {
+      svg.removeAttribute("aria-hidden");
+      svg.removeAttribute("focusable");
+      if (use) use.removeAttribute("aria-hidden");
+    } else if (hidden) {
+      svg.setAttribute("role", "presentation");
       svg.setAttribute("aria-hidden", "true");
+      svg.setAttribute("focusable", "false");
+      svg.removeAttribute("aria-label");
+      if (use) {
+        use.setAttribute("aria-hidden", "true");
+        use.setAttribute("focusable", "false");
+      }
     }
   }
   static get providers() {

package/dist/chunks/{velin-icon-ZTSKUOVN.js → velin-icon-EC4B5XCM.js}

@@ -29,9 +29,23 @@ function resolveProviderUrl(provider, variant) {
   return PROVIDER_CDNS[provider];
 }
 var _svgCache = /* @__PURE__ */ new Map();
+var DEFAULT_SPRITE = "velin-icons.svg";
+function resolveDefaultSpriteUrl() {
+  if (typeof document !== "undefined") {
+    const meta = document.querySelector('meta[name="velin-icon-sprite"]');
+    const fromMeta = meta?.getAttribute("content")?.trim();
+    if (fromMeta) return fromMeta;
+    const fromHtml = document.documentElement?.getAttribute("data-velin-icon-sprite")?.trim();
+    if (fromHtml) return fromHtml;
+  }
+  const configured = typeof VelinIcon.defaultSprite === "string" ? VelinIcon.defaultSprite.trim() : "";
+  return configured || DEFAULT_SPRITE;
+}
 var VelinIcon = class extends HTMLElement {
+  /** @type {string} Relative or absolute sprite URL used when `sprite` attribute is omitted. */
+  static defaultSprite = DEFAULT_SPRITE;
   static get observedAttributes() {
-    return ["name", "size", "label", "provider", "variant", "sprite", "aria-hidden", "aria-label"];
+    return ["name", "size", "label", "provider", "variant", "sprite"];
   }
   constructor() {
     super();
@@ -77,7 +91,6 @@ var VelinIcon = class extends HTMLElement {
     svg.setAttribute("stroke-linecap", "round");
     svg.setAttribute("stroke-linejoin", "round");
     this._applyStyle(svg);
-    this._applyA11y(svg, a11y);
     const use = document.createElementNS(svgNS, "use");
     const spriteAttr = this.getAttribute("sprite");
     const localSymbol = document.getElementById(name);
@@ -86,11 +99,13 @@ var VelinIcon = class extends HTMLElement {
     if (spriteAttr === "" || spriteAttr == null && isLocalSymbol) {
       href = `#${name}`;
     } else {
-      const spriteUrl = sanitizeURL(spriteAttr || "/dist/velin-icons.svg") || "/dist/velin-icons.svg";
+      const fallback = resolveDefaultSpriteUrl();
+      const spriteUrl = sanitizeURL(spriteAttr || fallback) || fallback || DEFAULT_SPRITE;
       href = `${spriteUrl}#${name}`;
     }
     use.setAttribute("href", href);
     svg.appendChild(use);
+    this._applyA11y(svg, a11y);
     this.innerHTML = "";
     this.appendChild(svg);
     this._rendered = true;
@@ -162,14 +177,12 @@ var VelinIcon = class extends HTMLElement {
       svg.setAttribute("aria-label", label);
       svg.removeAttribute("aria-hidden");
       svg.removeAttribute("focusable");
-      this.removeAttribute("aria-hidden");
       if (use) use.removeAttribute("aria-hidden");
     } else if (hidden) {
       svg.setAttribute("role", "presentation");
       svg.setAttribute("aria-hidden", "true");
       svg.setAttribute("focusable", "false");
       svg.removeAttribute("aria-label");
-      this.setAttribute("aria-hidden", "true");
       if (use) {
         use.setAttribute("aria-hidden", "true");
         use.setAttribute("focusable", "false");

package/dist/chunks/{velin-lightbox-6E7CAATP.js → velin-lightbox-FFK4TUUP.js}

@@ -1,11 +1,11 @@
-import {
-  announce
-} from "./chunk-Z4JYQ2XX.js";
 import {
   clearBackgroundInert,
   setBackgroundInert,
   trapFocus
 } from "./chunk-42VVPW6N.js";
+import {
+  announce
+} from "./chunk-Z4JYQ2XX.js";
 import {
   escapeHTML,
   sanitizeURL
@@ -101,7 +101,6 @@ var VelinLightbox = class extends HTMLElement {
     this.setAttribute("open", "");
     setBackgroundInert(this);
     this._render();
-    document.body.style.overflow = "hidden";
     const overlay = this.shadowRoot.querySelector(".overlay");
     overlay.removeEventListener("keydown", this._onTrapKey);
     overlay.addEventListener("keydown", this._onTrapKey);
@@ -109,14 +108,16 @@ var VelinLightbox = class extends HTMLElement {
   }
   close() {
     this.removeAttribute("open");
-    clearBackgroundInert();
-    document.body.style.overflow = "";
+    clearBackgroundInert(this);
     if (this._previousFocus) {
       this._previousFocus.focus();
       this._previousFocus = null;
     }
     this.dispatchEvent(new CustomEvent("velin-close", { bubbles: true }));
   }
+  disconnectedCallback() {
+    clearBackgroundInert(this);
+  }
   _prev() {
     this._index = (this._index - 1 + this._items.length) % this._items.length;
     this._render();

package/dist/chunks/{velin-lightbox-NXA3U2FM.js → velin-lightbox-P725FLTY.js}

@@ -9,7 +9,7 @@ import {
 import {
   escapeHTML,
   sanitizeURL
-} from "./chunk-RDE3QE7Z.js";
+} from "./chunk-L7ZGUU4D.js";
 
 // components/velin-lightbox.js
 var styles = `
@@ -101,7 +101,6 @@ var VelinLightbox = class extends HTMLElement {
     this.setAttribute("open", "");
     setBackgroundInert(this);
     this._render();
-    document.body.style.overflow = "hidden";
     const overlay = this.shadowRoot.querySelector(".overlay");
     overlay.removeEventListener("keydown", this._onTrapKey);
     overlay.addEventListener("keydown", this._onTrapKey);
@@ -109,14 +108,16 @@ var VelinLightbox = class extends HTMLElement {
   }
   close() {
     this.removeAttribute("open");
-    clearBackgroundInert();
-    document.body.style.overflow = "";
+    clearBackgroundInert(this);
     if (this._previousFocus) {
       this._previousFocus.focus();
       this._previousFocus = null;
     }
     this.dispatchEvent(new CustomEvent("velin-close", { bubbles: true }));
   }
+  disconnectedCallback() {
+    clearBackgroundInert(this);
+  }
   _prev() {
     this._index = (this._index - 1 + this._items.length) % this._items.length;
     this._render();

package/dist/chunks/{velin-menubar-J66JXRWW.js → velin-menubar-6I2LM5HL.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-42VVPW6N.js";
 import {
   escapeHTML
-} from "./chunk-LA7264K4.js";
+} from "./chunk-L7ZGUU4D.js";
 
 // components/velin-menubar.js
 var styles = `

package/dist/chunks/{velin-modal-5HYNNNUI.js → velin-modal-ICTMGRSU.js}

@@ -8,7 +8,7 @@ import {
 } from "./chunk-42VVPW6N.js";
 import {
   escapeHTML
-} from "./chunk-MKZP2TBH.js";
+} from "./chunk-L7ZGUU4D.js";
 
 // components/velin-modal.js
 var styles = `
@@ -105,14 +105,15 @@ var VelinModal = class extends HTMLElement {
     this._onKeydown = this._onKeydown.bind(this);
   }
   connectedCallback() {
-    const title = this.getAttribute("title") || "";
+    const title = (this.getAttribute("title") || "").trim();
     const safeTitle = escapeHTML(title);
+    const dialogLabel = title ? 'aria-labelledby="velin-modal-title"' : `aria-label="${escapeHTML(this.getAttribute("aria-label") || "Dialog")}"`;
     this.shadowRoot.innerHTML = `
       <style>${styles}</style>
       <div class="overlay" part="overlay">
-        <div class="dialog" role="dialog" aria-modal="true" aria-labelledby="velin-modal-title" part="dialog">
+        <div class="dialog" role="dialog" aria-modal="true" ${dialogLabel} part="dialog">
           <div class="header" part="header">
-            <h2 class="title" id="velin-modal-title">${safeTitle}</h2>
+            <h2 class="title" id="velin-modal-title"${title ? "" : ' class="velin-sr-only"'}>${safeTitle || "Dialog"}</h2>
             <button class="close-btn" aria-label="Close" part="close">&#215;</button>
           </div>
           <div class="body" part="body"><slot></slot></div>
@@ -145,7 +146,6 @@ var VelinModal = class extends HTMLElement {
     this._previouslyFocused = saveFocus();
     setBackgroundInert(this);
     document.addEventListener("keydown", this._onKeydown);
-    document.body.style.overflow = "hidden";
     requestAnimationFrame(() => {
       const focusable = getFocusableElements(this.shadowRoot);
       if (focusable.length > 0) focusable[0].focus();
@@ -153,8 +153,7 @@ var VelinModal = class extends HTMLElement {
   }
   _close() {
     document.removeEventListener("keydown", this._onKeydown);
-    document.body.style.overflow = "";
-    clearBackgroundInert();
+    clearBackgroundInert(this);
     restoreFocus(this._previouslyFocused);
   }
   _onKeydown(event) {
@@ -166,7 +165,7 @@ var VelinModal = class extends HTMLElement {
   }
   disconnectedCallback() {
     document.removeEventListener("keydown", this._onKeydown);
-    document.body.style.overflow = "";
+    clearBackgroundInert(this);
   }
 };
 customElements.define("velin-modal", VelinModal);

package/dist/chunks/{velin-modal-AEOTZ67O.js → velin-modal-JBNODH7D.js}

@@ -146,7 +146,6 @@ var VelinModal = class extends HTMLElement {
     this._previouslyFocused = saveFocus();
     setBackgroundInert(this);
     document.addEventListener("keydown", this._onKeydown);
-    document.body.style.overflow = "hidden";
     requestAnimationFrame(() => {
       const focusable = getFocusableElements(this.shadowRoot);
       if (focusable.length > 0) focusable[0].focus();
@@ -154,8 +153,7 @@ var VelinModal = class extends HTMLElement {
   }
   _close() {
     document.removeEventListener("keydown", this._onKeydown);
-    document.body.style.overflow = "";
-    clearBackgroundInert();
+    clearBackgroundInert(this);
     restoreFocus(this._previouslyFocused);
   }
   _onKeydown(event) {
@@ -167,7 +165,7 @@ var VelinModal = class extends HTMLElement {
   }
   disconnectedCallback() {
     document.removeEventListener("keydown", this._onKeydown);
-    document.body.style.overflow = "";
+    clearBackgroundInert(this);
   }
 };
 customElements.define("velin-modal", VelinModal);

package/dist/chunks/{velin-popover-T72HK3DF.js → velin-popover-WZG2GHBL.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-42VVPW6N.js";
 import {
   escapeHTML
-} from "./chunk-RDE3QE7Z.js";
+} from "./chunk-L7ZGUU4D.js";
 
 // components/velin-popover.js
 var styles = `
@@ -65,23 +65,44 @@ var VelinPopover = class extends HTMLElement {
       </div>
     `;
     const popoverEl = this.shadowRoot.querySelector(".popover");
-    if (!title) {
-      const ariaLabel = this.getAttribute("aria-label");
-      if (ariaLabel && popoverEl) popoverEl.setAttribute("aria-label", ariaLabel);
+    if (!title && popoverEl) {
+      const fallback = this.getAttribute("aria-label") || (role === "tooltip" ? "Tooltip" : "Popover");
+      popoverEl.setAttribute("aria-label", fallback);
     }
     const triggerSlot = this.shadowRoot.querySelector('slot[name="trigger"]');
     triggerSlot.addEventListener("slotchange", () => this._wireTrigger(triggerType));
     this._wireTrigger(triggerType);
   }
+  _ensureTriggerInteractive(trigger) {
+    const tag = trigger.tagName;
+    if (tag !== "BUTTON" && tag !== "A" && trigger.getAttribute("role") !== "button") {
+      trigger.setAttribute("role", "button");
+      if (!trigger.hasAttribute("tabindex")) trigger.setAttribute("tabindex", "0");
+    }
+  }
+  _onTriggerKey(e) {
+    if (e.key === "Escape") {
+      this.close();
+      return;
+    }
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      this.toggle();
+    }
+  }
   _wireTrigger(triggerType) {
     const trigger = this.shadowRoot.querySelector('slot[name="trigger"]')?.assignedElements()[0];
     if (!trigger) return;
+    this._ensureTriggerInteractive(trigger);
     const isHover = triggerType === "hover";
     trigger.setAttribute("aria-haspopup", isHover ? "true" : "dialog");
     trigger.setAttribute("aria-expanded", this.hasAttribute("open") ? "true" : "false");
     if (this._isDialog) {
       trigger.setAttribute("aria-controls", this._popoverId);
     }
+    trigger.removeEventListener("keydown", this._onTriggerKeyBound);
+    this._onTriggerKeyBound = this._onTriggerKeyBound || this._onTriggerKey.bind(this);
+    trigger.addEventListener("keydown", this._onTriggerKeyBound);
     if (triggerType === "click") {
       trigger.onclick = () => this.toggle();
     } else if (triggerType === "hover") {

package/dist/chunks/{velin-rating-N4DI2XNL.js → velin-rating-QBBYRRBU.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-42VVPW6N.js";
 import {
   escapeHTML
-} from "./chunk-MKZP2TBH.js";
+} from "./chunk-L7ZGUU4D.js";
 
 // components/velin-rating.js
 var styles = `

package/dist/chunks/{velin-search-7B4KJ6TX.js → velin-search-B3L6J2RP.js}

@@ -284,7 +284,7 @@ function createSearch(config = {}) {
   async function getWorker() {
     if (!wantWorker || workerClient) return workerClient;
     if (typeof Worker === "undefined") return null;
-    const { createSearchWorker } = await import("./worker-client-R6DBYPFT.js");
+    const { createSearchWorker } = await import("./worker-client-MPT7PNQ4.js");
     workerClient = createSearchWorker(config.workerUrl);
     return workerClient;
   }
@@ -427,7 +427,7 @@ var VelinSearch = class extends HTMLElement {
       return;
     }
     if (!this._indexLoaded) await this._loadIndex();
-    const { groups } = this._search.query(q, {
+    const { groups } = await this._search.query(q, {
       minChars: this.minChars,
       fuzzy: this.fuzzy,
       categories: this.categories || void 0,