@skdx/web-components 0.28.0 → 0.29.0

package/dist/internal/styles.cjs

@@ -1,4 +1,4 @@
-"use strict";var l=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var c=Object.getOwnPropertyNames;var k=Object.prototype.hasOwnProperty;var h=(t,e)=>{for(var i in e)l(t,i,{get:e[i],enumerable:!0})},b=(t,e,i,d)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of c(e))!k.call(t,o)&&o!==i&&l(t,o,{get:()=>e[o],enumerable:!(d=x(e,o))||d.enumerable});return t};var g=t=>b(l({},"__esModule",{value:!0}),t);var C={};h(C,{adoptInheritanceStyles:()=>E,controlBoxOnHost:()=>y,delegatesFocusShadowRootOptions:()=>f,hiddenHostStyles:()=>v,installLightDomStyles:()=>w,resetNativeControl:()=>m});module.exports=g(C);var n=require("lit"),f={...n.LitElement.shadowRootOptions,delegatesFocus:!0},r=`
+"use strict";var a=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var S=Object.prototype.hasOwnProperty;var u=(t,e)=>{for(var o in e)a(t,o,{get:e[o],enumerable:!0})},f=(t,e,o,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of p(e))!S.call(t,r)&&r!==o&&a(t,r,{get:()=>e[r],enumerable:!(s=c(e,r))||s.enumerable});return t};var b=t=>f(a({},"__esModule",{value:!0}),t);var C={};u(C,{NATIVE_CONTROL_RESET:()=>h,adoptInheritanceStyles:()=>E,controlBoxOnHost:()=>g,delegatesFocusShadowRootOptions:()=>x,hiddenHostStyles:()=>k,partInheritsHostBox:()=>m,resetNativeControl:()=>y});module.exports=b(C);var n=require("lit"),x={...n.LitElement.shadowRootOptions,delegatesFocus:!0},h=`
   appearance: none;
   background: none;
   border: 0;
@@ -8,14 +8,14 @@
   color: inherit;
   text-align: inherit;
   cursor: inherit;
-`,m=n.css`
+`,y=n.css`
   button,
   input,
   select,
   textarea {
-    ${(0,n.unsafeCSS)(r)}
+    ${(0,n.unsafeCSS)(h)}
   }
-`,y=n.css`
+`,g=n.css`
   :host {
     position: relative;
   }
@@ -37,151 +37,20 @@
     position: absolute;
     inset: 0;
   }
-`,S=`@layer skdx-light-dom {
-  skdx-autocomplete-input,
-  skdx-combobox-input,
-  skdx-multi-select-input,
-  skdx-tree-select-input,
-  skdx-tree-select-item,
-  skdx-tree-select-tree { display: block; }
-
-  skdx-command-input,
-  skdx-date-picker-time-field,
-  skdx-label,
-  skdx-toast-region { display: contents; }
-
-  /* Text field needs a box (not contents) so clear button doesn't float alone. */
-  skdx-text-field-input { display: block; }
-
-  skdx-autocomplete-trigger,
-  skdx-collapsible-trigger,
-  skdx-select-trigger,
-  skdx-table-expand-trigger,
-  skdx-tree-select-trigger { display: inline-block; }
-
-  skdx-autocomplete-trigger[hidden] { display: none; }
-
-  skdx-autocomplete-input input,
-  skdx-autocomplete-trigger button,
-  skdx-collapsible-trigger button,
-  skdx-combobox-input input,
-  skdx-command-input input,
-  skdx-multi-select-input input,
-  skdx-password-input-field input,
-  skdx-select-trigger button,
-  skdx-table-expand-trigger button,
-  skdx-text-field-input input,
-  skdx-tree-select-input input,
-  skdx-tree-select-trigger button {${r}  }
-
-  /* controlBoxOnHost for light-DOM triggers: button must fill the host for focus ring. */
-  skdx-autocomplete-trigger button,
-  skdx-collapsible-trigger button,
-  skdx-select-trigger button,
-  skdx-table-expand-trigger button,
-  skdx-tree-select-trigger button {
+`,m=n.css`
+  span {
     display: inherit;
     align-items: inherit;
     justify-content: inherit;
     gap: inherit;
-    flex: 1;
-    align-self: stretch;
-    min-inline-size: 0;
-  }
-
-  /* Width 100% for field inputs. */
-  skdx-autocomplete-input input,
-  skdx-combobox-input input,
-  skdx-multi-select-input input,
-  skdx-text-field-input input,
-  skdx-tree-select-input input {
-    width: 100%;
-    box-sizing: border-box;
-  }
-
-  /* Input must fill host height vertically. */
-  skdx-text-field-input input {
-    height: 100%;
-  }
-
-  skdx-clipboard-input,
-  skdx-color-picker-area-thumb,
-  skdx-editable-input,
-  skdx-editable-textarea,
-  skdx-form-error-summary,
-  skdx-transfer-list-search { display: block; }
-
-  skdx-color-picker-format-select,
-  skdx-color-picker-input,
-  skdx-date-field,
-  skdx-date-picker-input,
-  skdx-number-field-input,
-  skdx-password-input-field,
-  skdx-pin-input-field,
-  skdx-tags-input-input,
-  skdx-time-field { display: inline-block; }
-
-  /* Not optional: these author declarations outrank the UA's [hidden] rule
-     and would pin these elements open, since they drive visibility via
-     this.hidden. No backticks anywhere in this block \u2014 it lives inside a
-     template literal, where one would terminate the string. */
-  skdx-color-picker-area-thumb[hidden],
-  skdx-color-picker-format-select[hidden],
-  skdx-color-picker-input[hidden],
-  skdx-date-field[hidden],
-  skdx-editable-input[hidden],
-  skdx-editable-textarea[hidden],
-  skdx-form-error-summary[hidden],
-  skdx-time-field[hidden],
-  skdx-transfer-list-search[hidden] { display: none; }
-
-  skdx-clipboard-input input,
-  skdx-color-picker-format-select select,
-  skdx-color-picker-input input,
-  skdx-editable-input input,
-  skdx-editable-textarea textarea,
-  skdx-number-field-input input,
-  skdx-pin-input-field input,
-  skdx-tags-input-input input,
-  skdx-transfer-list-search input {${r}  }
-
-  /* Width 100%: skin paints host, control must fill. */
-  skdx-clipboard-input input,
-  skdx-color-picker-input input,
-  skdx-editable-input input,
-  skdx-editable-textarea textarea,
-  skdx-number-field-input input,
-  skdx-password-input-field input,
-  skdx-pin-input-field input,
-  skdx-tags-input-input input,
-  skdx-transfer-list-search input {
-    width: 100%;
-    box-sizing: border-box;
-  }
-
-  /* Pin field input needs height 100% (sized by skin, not intrinsic height). */
-  skdx-pin-input-field input {
-    height: 100%;
-  }
-
-  /* Dialog host spans viewport but is click-through (not 0x0 hidden). */
-  skdx-dialog-content[data-state='open'],
-  skdx-alert-dialog-content[data-state='open'] {
-    display: block;
-    position: fixed;
-    inset: 0;
-    pointer-events: none;
-  }
-
-  skdx-dialog-content > dialog,
-  skdx-alert-dialog-content > dialog {
-    pointer-events: auto;
+    font: inherit;
+    color: inherit;
   }
-}`,a=!1;function w(){if(a||typeof document>"u")return;a=!0;let t=document.createElement("style");t.setAttribute("data-skdx-light-dom-styles",""),t.textContent=S,document.head.prepend(t)}var v=n.css`
+`,k=n.css`
   :host([hidden]) {
     display: none;
   }
-`,p=`
+`,l=`
   slot {
     vertical-align: inherit;
     border-color: inherit;
@@ -202,4 +71,4 @@
   :host(skdx-table-expanded-row) {
     vertical-align: inherit;
   }
-`,u="data-skdx-inheritance",s;function E(t){let e=t.adoptedStyleSheets;if(s===void 0&&(s=null,typeof CSSStyleSheet=="function"&&e!==void 0))try{let d=new CSSStyleSheet;d.replaceSync(p),s=d}catch{}if(s!==null&&e!==void 0){if(e.includes(s))return;t.adoptedStyleSheets=[...e,s];return}if(t.querySelector(`style[${u}]`))return;let i=document.createElement("style");i.setAttribute(u,""),i.textContent=p,t.append(i)}0&&(module.exports={adoptInheritanceStyles,controlBoxOnHost,delegatesFocusShadowRootOptions,hiddenHostStyles,installLightDomStyles,resetNativeControl});
+`,d="data-skdx-inheritance",i;function E(t){let e=t.adoptedStyleSheets;if(i===void 0&&(i=null,typeof CSSStyleSheet=="function"&&e!==void 0))try{let s=new CSSStyleSheet;s.replaceSync(l),i=s}catch{}if(i!==null&&e!==void 0){if(e.includes(i))return;t.adoptedStyleSheets=[...e,i];return}if(t.querySelector(`style[${d}]`))return;let o=document.createElement("style");o.setAttribute(d,""),o.textContent=l,t.append(o)}0&&(module.exports={NATIVE_CONTROL_RESET,adoptInheritanceStyles,controlBoxOnHost,delegatesFocusShadowRootOptions,hiddenHostStyles,partInheritsHostBox,resetNativeControl});

package/dist/internal/styles.d.cts

@@ -4,31 +4,18 @@
  * delegates focus straight to it, the same way a native form control works.
  */
 export declare const delegatesFocusShadowRootOptions: ShadowRootInit;
-/**
- * Removes UA chrome from native controls in shadow root.
- * Other frameworks' light-DOM controls get consumer reset for free; shadow boundary blocks document styles.
- * No `@layer` needed (unlike {@link LIGHT_DOM_STYLES}): outer styles beat inner for normal rules.
- */
+/** UA-chrome reset shared by the shadow-DOM `resetNativeControl` sheet and the light-DOM sheet. @internal */
+export declare const NATIVE_CONTROL_RESET = "\n  appearance: none;\n  background: none;\n  border: 0;\n  margin: 0;\n  padding: 0;\n  font: inherit;\n  color: inherit;\n  text-align: inherit;\n  cursor: inherit;\n";
+/** Removes UA chrome from native controls in the shadow root, since the shadow boundary blocks document styles that light-DOM frameworks get for free. */
 export declare const resetNativeControl: import("lit").CSSResult;
-/**
- * Host box styling for `@skdx/skins` to paint, while native control stays clickable on the whole surface.
- * Control mirrors host layout via `inherit` and fills with `flex: 1` / `align-self: stretch`.
- * `::before` overlay is the hit surface (pseudo-elements hit-test as their element).
- * Excludes dialog; `:host >` keeps this to the single direct control only.
- */
+/** Host box styling for `@skdx/skins` to paint, while a `::before` overlay keeps the whole surface as the native control's hit target. */
 export declare const controlBoxOnHost: import("lit").CSSResult;
-/**
- * Installs {@link LIGHT_DOM_STYLES} once per document.
- * Called from light-DOM elements' `connectedCallback`, not module side effect, so server imports stay inert.
- * @internal
- */
-export declare function installLightDomStyles(): void;
+/** For a host that wears the skin's flex box and wraps its slot in one `<span part>`, so the host's `gap`/`align-items` reach the slotted children. */
+export declare const partInheritsHostBox: import("lit").CSSResult;
 /** `:host([hidden]) { display: none; }` — shared by elements that render nothing while hidden. */
 export declare const hiddenHostStyles: import("lit").CSSResult;
 /**
- * Puts {@link INHERITANCE_STYLES} into shadow root. Called from every element's `connectedCallback` patch
- * (in `internal/define.ts`) so it reaches slots shadow DOM cannot otherwise reach. One shared `CSSStyleSheet`
- * means adopting into many roots costs one parse. `<style>` fallback for Safari <16.4 and jsdom.
+ * Puts {@link INHERITANCE_STYLES} into a shadow root via one shared `CSSStyleSheet` (or a `<style>` fallback for Safari <16.4 and jsdom), called from every element's `connectedCallback` patch.
  * @internal
  */
 export declare function adoptInheritanceStyles(root: ShadowRoot): void;

package/dist/internal/styles.d.ts

@@ -4,31 +4,18 @@
  * delegates focus straight to it, the same way a native form control works.
  */
 export declare const delegatesFocusShadowRootOptions: ShadowRootInit;
-/**
- * Removes UA chrome from native controls in shadow root.
- * Other frameworks' light-DOM controls get consumer reset for free; shadow boundary blocks document styles.
- * No `@layer` needed (unlike {@link LIGHT_DOM_STYLES}): outer styles beat inner for normal rules.
- */
+/** UA-chrome reset shared by the shadow-DOM `resetNativeControl` sheet and the light-DOM sheet. @internal */
+export declare const NATIVE_CONTROL_RESET = "\n  appearance: none;\n  background: none;\n  border: 0;\n  margin: 0;\n  padding: 0;\n  font: inherit;\n  color: inherit;\n  text-align: inherit;\n  cursor: inherit;\n";
+/** Removes UA chrome from native controls in the shadow root, since the shadow boundary blocks document styles that light-DOM frameworks get for free. */
 export declare const resetNativeControl: import("lit").CSSResult;
-/**
- * Host box styling for `@skdx/skins` to paint, while native control stays clickable on the whole surface.
- * Control mirrors host layout via `inherit` and fills with `flex: 1` / `align-self: stretch`.
- * `::before` overlay is the hit surface (pseudo-elements hit-test as their element).
- * Excludes dialog; `:host >` keeps this to the single direct control only.
- */
+/** Host box styling for `@skdx/skins` to paint, while a `::before` overlay keeps the whole surface as the native control's hit target. */
 export declare const controlBoxOnHost: import("lit").CSSResult;
-/**
- * Installs {@link LIGHT_DOM_STYLES} once per document.
- * Called from light-DOM elements' `connectedCallback`, not module side effect, so server imports stay inert.
- * @internal
- */
-export declare function installLightDomStyles(): void;
+/** For a host that wears the skin's flex box and wraps its slot in one `<span part>`, so the host's `gap`/`align-items` reach the slotted children. */
+export declare const partInheritsHostBox: import("lit").CSSResult;
 /** `:host([hidden]) { display: none; }` — shared by elements that render nothing while hidden. */
 export declare const hiddenHostStyles: import("lit").CSSResult;
 /**
- * Puts {@link INHERITANCE_STYLES} into shadow root. Called from every element's `connectedCallback` patch
- * (in `internal/define.ts`) so it reaches slots shadow DOM cannot otherwise reach. One shared `CSSStyleSheet`
- * means adopting into many roots costs one parse. `<style>` fallback for Safari <16.4 and jsdom.
+ * Puts {@link INHERITANCE_STYLES} into a shadow root via one shared `CSSStyleSheet` (or a `<style>` fallback for Safari <16.4 and jsdom), called from every element's `connectedCallback` patch.
  * @internal
  */
 export declare function adoptInheritanceStyles(root: ShadowRoot): void;

package/dist/internal/styles.js

@@ -1,4 +1,4 @@
-import{css as d,LitElement as p,unsafeCSS as u}from"lit";var k={...p.shadowRootOptions,delegatesFocus:!0},s=`
+import{css as o,LitElement as l,unsafeCSS as d}from"lit";var p={...l.shadowRootOptions,delegatesFocus:!0},h=`
   appearance: none;
   background: none;
   border: 0;
@@ -8,14 +8,14 @@ import{css as d,LitElement as p,unsafeCSS as u}from"lit";var k={...p.shadowRootO
   color: inherit;
   text-align: inherit;
   cursor: inherit;
-`,h=d`
+`,S=o`
   button,
   input,
   select,
   textarea {
-    ${u(s)}
+    ${d(h)}
   }
-`,b=d`
+`,u=o`
   :host {
     position: relative;
   }
@@ -37,147 +37,16 @@ import{css as d,LitElement as p,unsafeCSS as u}from"lit";var k={...p.shadowRootO
     position: absolute;
     inset: 0;
   }
-`,x=`@layer skdx-light-dom {
-  skdx-autocomplete-input,
-  skdx-combobox-input,
-  skdx-multi-select-input,
-  skdx-tree-select-input,
-  skdx-tree-select-item,
-  skdx-tree-select-tree { display: block; }
-
-  skdx-command-input,
-  skdx-date-picker-time-field,
-  skdx-label,
-  skdx-toast-region { display: contents; }
-
-  /* Text field needs a box (not contents) so clear button doesn't float alone. */
-  skdx-text-field-input { display: block; }
-
-  skdx-autocomplete-trigger,
-  skdx-collapsible-trigger,
-  skdx-select-trigger,
-  skdx-table-expand-trigger,
-  skdx-tree-select-trigger { display: inline-block; }
-
-  skdx-autocomplete-trigger[hidden] { display: none; }
-
-  skdx-autocomplete-input input,
-  skdx-autocomplete-trigger button,
-  skdx-collapsible-trigger button,
-  skdx-combobox-input input,
-  skdx-command-input input,
-  skdx-multi-select-input input,
-  skdx-password-input-field input,
-  skdx-select-trigger button,
-  skdx-table-expand-trigger button,
-  skdx-text-field-input input,
-  skdx-tree-select-input input,
-  skdx-tree-select-trigger button {${s}  }
-
-  /* controlBoxOnHost for light-DOM triggers: button must fill the host for focus ring. */
-  skdx-autocomplete-trigger button,
-  skdx-collapsible-trigger button,
-  skdx-select-trigger button,
-  skdx-table-expand-trigger button,
-  skdx-tree-select-trigger button {
+`,f=o`
+  span {
     display: inherit;
     align-items: inherit;
     justify-content: inherit;
     gap: inherit;
-    flex: 1;
-    align-self: stretch;
-    min-inline-size: 0;
-  }
-
-  /* Width 100% for field inputs. */
-  skdx-autocomplete-input input,
-  skdx-combobox-input input,
-  skdx-multi-select-input input,
-  skdx-text-field-input input,
-  skdx-tree-select-input input {
-    width: 100%;
-    box-sizing: border-box;
-  }
-
-  /* Input must fill host height vertically. */
-  skdx-text-field-input input {
-    height: 100%;
-  }
-
-  skdx-clipboard-input,
-  skdx-color-picker-area-thumb,
-  skdx-editable-input,
-  skdx-editable-textarea,
-  skdx-form-error-summary,
-  skdx-transfer-list-search { display: block; }
-
-  skdx-color-picker-format-select,
-  skdx-color-picker-input,
-  skdx-date-field,
-  skdx-date-picker-input,
-  skdx-number-field-input,
-  skdx-password-input-field,
-  skdx-pin-input-field,
-  skdx-tags-input-input,
-  skdx-time-field { display: inline-block; }
-
-  /* Not optional: these author declarations outrank the UA's [hidden] rule
-     and would pin these elements open, since they drive visibility via
-     this.hidden. No backticks anywhere in this block \u2014 it lives inside a
-     template literal, where one would terminate the string. */
-  skdx-color-picker-area-thumb[hidden],
-  skdx-color-picker-format-select[hidden],
-  skdx-color-picker-input[hidden],
-  skdx-date-field[hidden],
-  skdx-editable-input[hidden],
-  skdx-editable-textarea[hidden],
-  skdx-form-error-summary[hidden],
-  skdx-time-field[hidden],
-  skdx-transfer-list-search[hidden] { display: none; }
-
-  skdx-clipboard-input input,
-  skdx-color-picker-format-select select,
-  skdx-color-picker-input input,
-  skdx-editable-input input,
-  skdx-editable-textarea textarea,
-  skdx-number-field-input input,
-  skdx-pin-input-field input,
-  skdx-tags-input-input input,
-  skdx-transfer-list-search input {${s}  }
-
-  /* Width 100%: skin paints host, control must fill. */
-  skdx-clipboard-input input,
-  skdx-color-picker-input input,
-  skdx-editable-input input,
-  skdx-editable-textarea textarea,
-  skdx-number-field-input input,
-  skdx-password-input-field input,
-  skdx-pin-input-field input,
-  skdx-tags-input-input input,
-  skdx-transfer-list-search input {
-    width: 100%;
-    box-sizing: border-box;
-  }
-
-  /* Pin field input needs height 100% (sized by skin, not intrinsic height). */
-  skdx-pin-input-field input {
-    height: 100%;
-  }
-
-  /* Dialog host spans viewport but is click-through (not 0x0 hidden). */
-  skdx-dialog-content[data-state='open'],
-  skdx-alert-dialog-content[data-state='open'] {
-    display: block;
-    position: fixed;
-    inset: 0;
-    pointer-events: none;
-  }
-
-  skdx-dialog-content > dialog,
-  skdx-alert-dialog-content > dialog {
-    pointer-events: auto;
+    font: inherit;
+    color: inherit;
   }
-}`,l=!1;function g(){if(l||typeof document>"u")return;l=!0;let t=document.createElement("style");t.setAttribute("data-skdx-light-dom-styles",""),t.textContent=x,document.head.prepend(t)}var f=d`
+`,b=o`
   :host([hidden]) {
     display: none;
   }
@@ -202,4 +71,4 @@ import{css as d,LitElement as p,unsafeCSS as u}from"lit";var k={...p.shadowRootO
   :host(skdx-table-expanded-row) {
     vertical-align: inherit;
   }
-`,a="data-skdx-inheritance",e;function m(t){let i=t.adoptedStyleSheets;if(e===void 0&&(e=null,typeof CSSStyleSheet=="function"&&i!==void 0))try{let o=new CSSStyleSheet;o.replaceSync(r),e=o}catch{}if(e!==null&&i!==void 0){if(i.includes(e))return;t.adoptedStyleSheets=[...i,e];return}if(t.querySelector(`style[${a}]`))return;let n=document.createElement("style");n.setAttribute(a,""),n.textContent=r,t.append(n)}export{m as adoptInheritanceStyles,b as controlBoxOnHost,k as delegatesFocusShadowRootOptions,f as hiddenHostStyles,g as installLightDomStyles,h as resetNativeControl};
+`,a="data-skdx-inheritance",e;function x(t){let n=t.adoptedStyleSheets;if(e===void 0&&(e=null,typeof CSSStyleSheet=="function"&&n!==void 0))try{let s=new CSSStyleSheet;s.replaceSync(r),e=s}catch{}if(e!==null&&n!==void 0){if(n.includes(e))return;t.adoptedStyleSheets=[...n,e];return}if(t.querySelector(`style[${a}]`))return;let i=document.createElement("style");i.setAttribute(a,""),i.textContent=r,t.append(i)}export{h as NATIVE_CONTROL_RESET,x as adoptInheritanceStyles,u as controlBoxOnHost,p as delegatesFocusShadowRootOptions,b as hiddenHostStyles,f as partInheritsHostBox,S as resetNativeControl};

package/dist/internal/tabbable.cjs

@@ -1 +1 @@
-"use strict";var a=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var r=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var s=(e,t)=>{for(var o in t)a(e,o,{get:t[o],enumerable:!0})},E=(e,t,o,d)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of r(t))!b.call(e,n)&&n!==o&&a(e,n,{get:()=>t[n],enumerable:!(d=l(t,n))||d.enumerable});return e};var u=e=>E(a({},"__esModule",{value:!0}),e);var c={};s(c,{TABBABLE_SELECTOR:()=>i,tabbablesWithin:()=>x});module.exports=u(c);var i=["a[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(", ");function x(e){return Array.from(e.querySelectorAll(i))}0&&(module.exports={TABBABLE_SELECTOR,tabbablesWithin});
+"use strict";var i=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var r=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var s=(t,e)=>{for(var o in e)i(t,o,{get:e[o],enumerable:!0})},E=(t,e,o,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of r(e))!b.call(t,n)&&n!==o&&i(t,n,{get:()=>e[n],enumerable:!(a=l(e,n))||a.enumerable});return t};var u=t=>E(i({},"__esModule",{value:!0}),t);var c={};s(c,{TABBABLE_SELECTOR:()=>d,tabbablesWithin:()=>x});module.exports=u(c);var d=["a[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(", ");function x(t){return Array.from(t.querySelectorAll(d))}0&&(module.exports={TABBABLE_SELECTOR,tabbablesWithin});

package/dist/internal/tabbable.d.cts

@@ -1,11 +1,8 @@
-/**
- * Selector for tabbable elements: links, buttons, inputs, selects, textareas,
- * and elements with positive tabindex.
- * @internal
- */
+/** The elements a `Tab` press can land on — this package's one definition of "tabbable", for components that have to walk the tab order by hand. */
 export declare const TABBABLE_SELECTOR: string;
 /**
- * Tabbable elements in `container`, light DOM only: popovers slot consumer markup.
- * @internal
+ * Every tabbable element inside `container`, in document order. Uses only the
+ * selector without visibility checks (unlike focus traps) because overlays are
+ * small subtrees only in the DOM while open.
  */
 export declare function tabbablesWithin(container: Element): HTMLElement[];

package/dist/internal/tabbable.d.ts

@@ -1,11 +1,8 @@
-/**
- * Selector for tabbable elements: links, buttons, inputs, selects, textareas,
- * and elements with positive tabindex.
- * @internal
- */
+/** The elements a `Tab` press can land on — this package's one definition of "tabbable", for components that have to walk the tab order by hand. */
 export declare const TABBABLE_SELECTOR: string;
 /**
- * Tabbable elements in `container`, light DOM only: popovers slot consumer markup.
- * @internal
+ * Every tabbable element inside `container`, in document order. Uses only the
+ * selector without visibility checks (unlike focus traps) because overlays are
+ * small subtrees only in the DOM while open.
  */
 export declare function tabbablesWithin(container: Element): HTMLElement[];

package/dist/internal/tabbable.js

@@ -1 +1 @@
-var t=["a[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(", ");function n(e){return Array.from(e.querySelectorAll(t))}export{t as TABBABLE_SELECTOR,n as tabbablesWithin};
+var e=["a[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])'].join(", ");function n(t){return Array.from(t.querySelectorAll(e))}export{e as TABBABLE_SELECTOR,n as tabbablesWithin};

package/dist/internal/timer.cjs

@@ -0,0 +1 @@
+"use strict";var a=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames;var o=Object.prototype.hasOwnProperty;var u=(i,e)=>{for(var s in e)a(i,s,{get:e[s],enumerable:!0})},p=(i,e,s,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let t of h(e))!o.call(i,t)&&t!==s&&a(i,t,{get:()=>e[t],enumerable:!(r=d(e,t))||r.enumerable});return i};var c=i=>p(a({},"__esModule",{value:!0}),i);var l={};u(l,{Timer:()=>n});module.exports=c(l);var n=class{constructor(e={}){this.phase="idle";this.accrued=0;this.startedAt=0;this.pausedByPage=!1;this.onVisibilityChange=()=>{document.hidden?this.pauseForPage():this.pausedByPage&&this.resume()};this.onPageHide=()=>{this.pauseForPage()};this.options=e,this.duration=e.duration??Number.POSITIVE_INFINITY,this.tickMs=e.tickMs??0,!(e.pauseWhenHidden===!1||typeof document>"u")&&(document.addEventListener("visibilitychange",this.onVisibilityChange),window.addEventListener("pagehide",this.onPageHide))}get state(){let e=this.measure();return{phase:this.phase,elapsed:e,remaining:this.duration-e,duration:this.duration}}start(e){e!==void 0&&(this.duration=e),this.clearHandles(),this.accrued=0,this.pausedByPage=!1,this.run()}pause(){this.pausedByPage=!1,this.phase==="running"&&(this.accrued=this.measure(),this.clearHandles(),this.setPhase("paused"))}resume(){this.pausedByPage=!1,this.phase==="paused"&&this.run()}reset(){this.clearHandles(),this.accrued=0,this.startedAt=0,this.pausedByPage=!1,this.setPhase("idle")}destroy(){this.clearHandles(),!(this.options.pauseWhenHidden===!1||typeof document>"u")&&(document.removeEventListener("visibilitychange",this.onVisibilityChange),window.removeEventListener("pagehide",this.onPageHide))}measure(){let e=this.phase==="running"?Date.now()-this.startedAt:0;return Math.min(this.accrued+e,this.duration)}run(){this.startedAt=Date.now();let e=this.duration-this.accrued;Number.isFinite(e)&&(this.completion=setTimeout(()=>this.complete(),Math.max(e,0))),this.tickMs>0&&(this.ticker=setInterval(()=>this.options.onTick?.(this.state),this.tickMs)),this.setPhase("running")}complete(){this.clearHandles(),this.accrued=this.duration,this.setPhase("complete"),this.tickMs>0&&this.options.onTick?.(this.state)}setPhase(e){this.phase!==e&&(this.phase=e,this.options.onPhaseChange?.(this.state))}clearHandles(){clearTimeout(this.completion),clearInterval(this.ticker),this.completion=void 0,this.ticker=void 0}pauseForPage(){this.phase==="running"&&(this.pause(),this.pausedByPage=!0)}};0&&(module.exports={Timer});

package/dist/internal/timer.d.cts

@@ -0,0 +1,82 @@
+/** Where the clock stands: never started, running, held by a pause, or finished. */
+export type TimerPhase = 'idle' | 'running' | 'paused' | 'complete';
+/** The clock as a consumer renders it, computed fresh on every read. */
+export interface TimerState {
+    /** Where the clock stands right now, as one of the four phases. */
+    phase: TimerPhase;
+    /** Milliseconds the clock has actually run, never counting paused time. */
+    elapsed: number;
+    /** Milliseconds left before completion, or `Infinity` when counting up. */
+    remaining: number;
+    /** The countdown length in force, `Infinity` for an open-ended count-up. */
+    duration: number;
+}
+/** How one clock is configured; every field has a working default. */
+export interface TimerOptions {
+    /**
+     * Countdown length in milliseconds; leave it out to count up with no end.
+     *
+     * @default Infinity
+     */
+    duration?: number | undefined;
+    /**
+     * Milliseconds between `onTick` calls while running; `0` reports no ticks.
+     *
+     * @default 0
+     */
+    tickMs?: number | undefined;
+    /**
+     * Whether a hidden or unloading page pauses the clock and a returning page resumes it.
+     *
+     * @default true
+     */
+    pauseWhenHidden?: boolean | undefined;
+    /**
+     * Called on every tick and once more at completion, for rendering the clock only.
+     *
+     * Ticks are far too frequent to announce: write them to a progress bar or a
+     * `<time>`, never to a live region.
+     */
+    onTick?: ((state: TimerState) => void) | undefined;
+    /**
+     * Called when the phase changes, and only on an actual change, so it is the one place announcements belong.
+     */
+    onPhaseChange?: ((state: TimerState) => void) | undefined;
+}
+/** A framework-neutral countdown or count-up: `start`, `pause`, `resume`, `reset`, and a completion phase. */
+export declare class Timer {
+    private readonly options;
+    private readonly tickMs;
+    private duration;
+    private phase;
+    private accrued;
+    private startedAt;
+    private completion;
+    private ticker;
+    private pausedByPage;
+    constructor(options?: TimerOptions);
+    /** The phase, elapsed, remaining and duration as they read at this instant. */
+    get state(): TimerState;
+    /**
+     * Runs the clock from zero, replacing whatever it was doing.
+     *
+     * @param duration a new countdown length to adopt, in milliseconds
+     */
+    start(duration?: number): void;
+    /** Holds the clock where it stands; a second call while already paused changes nothing. */
+    pause(): void;
+    /** Runs the clock on from where a pause left it; ignored unless it is paused. */
+    resume(): void;
+    /** Stops the clock and returns it to zero, as it was before the first `start`. */
+    reset(): void;
+    /** Stops the clock and releases every listener and handle it holds. */
+    destroy(): void;
+    private measure;
+    private run;
+    private complete;
+    private setPhase;
+    private clearHandles;
+    private readonly onVisibilityChange;
+    private readonly onPageHide;
+    private pauseForPage;
+}