@skdx/web-components 0.26.0 → 0.28.0

package/dist/angle-slider/AngleSliderMarks.d.cts

@@ -1,17 +1,11 @@
 import { LitElement } from 'lit';
 /**
- * `<skdx-angle-slider-marks>` — container for an `<skdx-angle-slider>`'s tick
- * marks. Structural only: it mirrors the root's `data-disabled` /
- * `data-readonly` so a brand layer can dim the whole ring in one rule, and
- * otherwise stays out of the way.
+ * Container for an `<skdx-angle-slider>`'s tick marks. Structural: mirrors the
+ * root's disabled/readonly state and gives the ring a positioning context.
  *
- * It is deliberately **not** `aria-hidden`: marks often carry real labels
- * ("N", "E", "S", "W", "45°"), and hiding them wholesale would throw away text
- * a screen-reader user may want. Add `aria-hidden` yourself on purely
- * decorative ticks.
- *
- * Marks do not have to live inside it — the root finds them anywhere in its
- * subtree — but grouping them gives the ring a single positioning context.
+ * Deliberately **not** `aria-hidden` since marks often carry real labels
+ * ("N", "E", "S", "W", "45°"). Add `aria-hidden` yourself on purely decorative
+ * ticks.
  *
  * @example
  * ```html

package/dist/angle-slider/AngleSliderMarks.d.ts

@@ -1,17 +1,11 @@
 import { LitElement } from 'lit';
 /**
- * `<skdx-angle-slider-marks>` — container for an `<skdx-angle-slider>`'s tick
- * marks. Structural only: it mirrors the root's `data-disabled` /
- * `data-readonly` so a brand layer can dim the whole ring in one rule, and
- * otherwise stays out of the way.
+ * Container for an `<skdx-angle-slider>`'s tick marks. Structural: mirrors the
+ * root's disabled/readonly state and gives the ring a positioning context.
  *
- * It is deliberately **not** `aria-hidden`: marks often carry real labels
- * ("N", "E", "S", "W", "45°"), and hiding them wholesale would throw away text
- * a screen-reader user may want. Add `aria-hidden` yourself on purely
- * decorative ticks.
- *
- * Marks do not have to live inside it — the root finds them anywhere in its
- * subtree — but grouping them gives the ring a single positioning context.
+ * Deliberately **not** `aria-hidden` since marks often carry real labels
+ * ("N", "E", "S", "W", "45°"). Add `aria-hidden` yourself on purely decorative
+ * ticks.
  *
  * @example
  * ```html

package/dist/angle-slider/AngleSliderThumb.d.cts

@@ -1,25 +1,9 @@
 import { LitElement } from 'lit';
 /**
- * `<skdx-angle-slider-thumb>` — the handle that points at an
- * `<skdx-angle-slider>`'s current angle. Purely visual: `aria-hidden` and out of
- * the tab order, because the root carries the whole widget's `role="slider"`
- * semantics and takes the single tab stop — a second focusable element here
- * would announce the same value twice.
+ * `<skdx-angle-slider-thumb>` — the handle showing the current angle.
  *
- * It ships **no positioning**. The root publishes `--skdx-angle-slider-angle`,
- * so one CSS rule rotates the thumb and nothing recomputes a transform per
- * frame:
- *
- * ```css
- * skdx-angle-slider-thumb {
- *   transform: rotate(var(--skdx-angle-slider-angle)) translateY(-60px);
- * }
- * ```
- *
- * Exposes `data-value`, `data-disabled`, `data-readonly` and `data-dragging`
- * (present while a pointer drag is in flight) for styling. Must be used inside
- * `<skdx-angle-slider>`, which it finds with `closest()` and which pushes those
- * attributes down after every update.
+ * Purely visual: `aria-hidden`, out of tab order. The root publishes `--skdx-angle-slider-angle` for rotation.
+ * Exposes `data-value`, `data-disabled`, `data-readonly`, `data-dragging` for styling.
  *
  * @example
  * ```html

package/dist/angle-slider/AngleSliderThumb.d.ts

@@ -1,25 +1,9 @@
 import { LitElement } from 'lit';
 /**
- * `<skdx-angle-slider-thumb>` — the handle that points at an
- * `<skdx-angle-slider>`'s current angle. Purely visual: `aria-hidden` and out of
- * the tab order, because the root carries the whole widget's `role="slider"`
- * semantics and takes the single tab stop — a second focusable element here
- * would announce the same value twice.
+ * `<skdx-angle-slider-thumb>` — the handle showing the current angle.
  *
- * It ships **no positioning**. The root publishes `--skdx-angle-slider-angle`,
- * so one CSS rule rotates the thumb and nothing recomputes a transform per
- * frame:
- *
- * ```css
- * skdx-angle-slider-thumb {
- *   transform: rotate(var(--skdx-angle-slider-angle)) translateY(-60px);
- * }
- * ```
- *
- * Exposes `data-value`, `data-disabled`, `data-readonly` and `data-dragging`
- * (present while a pointer drag is in flight) for styling. Must be used inside
- * `<skdx-angle-slider>`, which it finds with `closest()` and which pushes those
- * attributes down after every update.
+ * Purely visual: `aria-hidden`, out of tab order. The root publishes `--skdx-angle-slider-angle` for rotation.
+ * Exposes `data-value`, `data-disabled`, `data-readonly`, `data-dragging` for styling.
  *
  * @example
  * ```html

package/dist/angle-slider/index.cjs

@@ -1 +1 @@
-"use strict";var o=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var i=Object.getOwnPropertyNames;var n=Object.prototype.hasOwnProperty;var p=(e,r)=>{for(var l in r)o(e,l,{get:r[l],enumerable:!0})},t=(e,r,l,x)=>{if(r&&typeof r=="object"||typeof r=="function")for(let d of i(r))!n.call(e,d)&&d!==l&&o(e,d,{get:()=>r[d],enumerable:!(x=g(r,d))||x.enumerable});return e};var A=e=>t(o({},"__esModule",{value:!0}),e);var a={};p(a,{SkdxAngleSlider:()=>S.SkdxAngleSlider,SkdxAngleSliderMark:()=>f.SkdxAngleSliderMark,SkdxAngleSliderMarks:()=>m.SkdxAngleSliderMarks,SkdxAngleSliderThumb:()=>k.SkdxAngleSliderThumb});module.exports=A(a);var S=require("./AngleSlider.cjs"),k=require("./AngleSliderThumb.cjs"),m=require("./AngleSliderMarks.cjs"),f=require("./AngleSliderMark.cjs");0&&(module.exports={SkdxAngleSlider,SkdxAngleSliderMark,SkdxAngleSliderMarks,SkdxAngleSliderThumb});
+"use strict";var d=Object.defineProperty;var g=Object.getOwnPropertyDescriptor;var i=Object.getOwnPropertyNames;var n=Object.prototype.hasOwnProperty;var k=(l,e)=>{for(var r in e)d(l,r,{get:e[r],enumerable:!0})},p=(l,e,r,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of i(e))!n.call(l,a)&&a!==r&&d(l,a,{get:()=>e[a],enumerable:!(t=g(e,a))||t.enumerable});return l};var x=l=>p(d({},"__esModule",{value:!0}),l);var A={};k(A,{SkdxAngleSlider:()=>S.SkdxAngleSlider});module.exports=x(A);var S=require("./AngleSlider.cjs");0&&(module.exports={SkdxAngleSlider});

package/dist/angle-slider/index.d.cts

@@ -1,4 +1 @@
-export { SkdxAngleSlider } from './AngleSlider.cjs';
-export { SkdxAngleSliderThumb } from './AngleSliderThumb.cjs';
-export { SkdxAngleSliderMarks } from './AngleSliderMarks.cjs';
-export { SkdxAngleSliderMark } from './AngleSliderMark.cjs';
+export { SkdxAngleSlider, type AngleSliderMarkData, type SkdxAngleSliderValueChangeDetail, } from './AngleSlider.cjs';

package/dist/angle-slider/index.d.ts

@@ -1,4 +1 @@
-export { SkdxAngleSlider } from './AngleSlider.js';
-export { SkdxAngleSliderThumb } from './AngleSliderThumb.js';
-export { SkdxAngleSliderMarks } from './AngleSliderMarks.js';
-export { SkdxAngleSliderMark } from './AngleSliderMark.js';
+export { SkdxAngleSlider, type AngleSliderMarkData, type SkdxAngleSliderValueChangeDetail, } from './AngleSlider.js';

package/dist/angle-slider/index.js

@@ -1 +1 @@
-import{SkdxAngleSlider as d}from"./AngleSlider.js";import{SkdxAngleSliderThumb as o}from"./AngleSliderThumb.js";import{SkdxAngleSliderMarks as S}from"./AngleSliderMarks.js";import{SkdxAngleSliderMark as m}from"./AngleSliderMark.js";export{d as SkdxAngleSlider,m as SkdxAngleSliderMark,S as SkdxAngleSliderMarks,o as SkdxAngleSliderThumb};
+import{SkdxAngleSlider as a}from"./AngleSlider.js";export{a as SkdxAngleSlider};

package/dist/angle-slider/primitives.cjs

@@ -0,0 +1 @@
+"use strict";var o=Object.defineProperty;var f=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var i=Object.prototype.hasOwnProperty;var n=(e,r)=>{for(var l in r)o(e,l,{get:r[l],enumerable:!0})},p=(e,r,l,x)=>{if(r&&typeof r=="object"||typeof r=="function")for(let d of g(r))!i.call(e,d)&&d!==l&&o(e,d,{get:()=>r[d],enumerable:!(x=f(r,d))||x.enumerable});return e};var t=e=>p(o({},"__esModule",{value:!0}),e);var A={};n(A,{SkdxAngleSliderMark:()=>m.SkdxAngleSliderMark,SkdxAngleSliderMarks:()=>k.SkdxAngleSliderMarks,SkdxAngleSliderThumb:()=>S.SkdxAngleSliderThumb});module.exports=t(A);var S=require("./AngleSliderThumb.cjs"),k=require("./AngleSliderMarks.cjs"),m=require("./AngleSliderMark.cjs");0&&(module.exports={SkdxAngleSliderMark,SkdxAngleSliderMarks,SkdxAngleSliderThumb});

package/dist/angle-slider/primitives.d.cts

@@ -0,0 +1,21 @@
+/**
+ * Advanced primitives for `<skdx-angle-slider>` — the parts the recipe composes.
+ * Reach for these when the derived anatomy is not the structure you need.
+ *
+ * @example
+ * ```ts
+ * import * as AngleSlider from '@skdx/web-components/primitives/angle-slider';
+ * ```
+ * ```html
+ * <skdx-angle-slider aria-label="Wind direction" default-value="0" restrict-to-marks>
+ *   <skdx-angle-slider-marks>
+ *     <skdx-angle-slider-mark value="0">N</skdx-angle-slider-mark>
+ *     <skdx-angle-slider-mark value="90">E</skdx-angle-slider-mark>
+ *   </skdx-angle-slider-marks>
+ *   <skdx-angle-slider-thumb></skdx-angle-slider-thumb>
+ * </skdx-angle-slider>
+ * ```
+ */
+export { SkdxAngleSliderThumb } from './AngleSliderThumb.cjs';
+export { SkdxAngleSliderMarks } from './AngleSliderMarks.cjs';
+export { SkdxAngleSliderMark } from './AngleSliderMark.cjs';

package/dist/angle-slider/primitives.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Advanced primitives for `<skdx-angle-slider>` — the parts the recipe composes.
+ * Reach for these when the derived anatomy is not the structure you need.
+ *
+ * @example
+ * ```ts
+ * import * as AngleSlider from '@skdx/web-components/primitives/angle-slider';
+ * ```
+ * ```html
+ * <skdx-angle-slider aria-label="Wind direction" default-value="0" restrict-to-marks>
+ *   <skdx-angle-slider-marks>
+ *     <skdx-angle-slider-mark value="0">N</skdx-angle-slider-mark>
+ *     <skdx-angle-slider-mark value="90">E</skdx-angle-slider-mark>
+ *   </skdx-angle-slider-marks>
+ *   <skdx-angle-slider-thumb></skdx-angle-slider-thumb>
+ * </skdx-angle-slider>
+ * ```
+ */
+export { SkdxAngleSliderThumb } from './AngleSliderThumb.js';
+export { SkdxAngleSliderMarks } from './AngleSliderMarks.js';
+export { SkdxAngleSliderMark } from './AngleSliderMark.js';

package/dist/angle-slider/primitives.js

@@ -0,0 +1 @@
+import{SkdxAngleSliderThumb as d}from"./AngleSliderThumb.js";import{SkdxAngleSliderMarks as o}from"./AngleSliderMarks.js";import{SkdxAngleSliderMark as S}from"./AngleSliderMark.js";export{S as SkdxAngleSliderMark,o as SkdxAngleSliderMarks,d as SkdxAngleSliderThumb};

package/dist/aspect-ratio/AspectRatio.cjs

@@ -1,15 +1,7 @@
-"use strict";var p=Object.defineProperty;var n=Object.getOwnPropertyDescriptor;var b=Object.getOwnPropertyNames;var f=Object.prototype.hasOwnProperty;var h=(e,t)=>{for(var o in t)p(e,o,{get:t[o],enumerable:!0})},u=(e,t,o,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of b(t))!f.call(e,r)&&r!==o&&p(e,r,{get:()=>t[r],enumerable:!(a=n(t,r))||a.enumerable});return e};var g=e=>u(p({},"__esModule",{value:!0}),e),m=(e,t,o,a)=>{for(var r=a>1?void 0:a?n(t,o):t,l=e.length-1,d;l>=0;l--)(d=e[l])&&(r=(a?d(t,o,r):d(r))||r);return a&&r&&p(t,o,r),r};var w={};h(w,{SkdxAspectRatio:()=>i});module.exports=g(w);var s=require("lit"),c=require("lit/decorators.js"),v=require("../internal/define.cjs"),y=require("../internal/styles.cjs");var i=class extends s.LitElement{constructor(){super(...arguments);this.ratio=1}render(){return s.html`
-      <div
-        part="wrapper"
-        data-skdx-aspect-ratio-wrapper
-        style=${`position: relative; width: 100%; padding-bottom: ${100/this.ratio}%`}
-      >
-        <div part="aspect-ratio" data-skdx-aspect-ratio style="position: absolute; inset: 0">
-          <slot></slot>
-        </div>
-      </div>
-    `}};i.styles=[y.hiddenHostStyles,s.css`
+"use strict";var l=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var g=Object.getOwnPropertyNames;var y=Object.prototype.hasOwnProperty;var w=(e,t)=>{for(var o in t)l(e,o,{get:t[o],enumerable:!0})},x=(e,t,o,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of g(t))!y.call(e,r)&&r!==o&&l(e,r,{get:()=>t[r],enumerable:!(i=p(t,r))||i.enumerable});return e};var E=e=>x(l({},"__esModule",{value:!0}),e),d=(e,t,o,i)=>{for(var r=i>1?void 0:i?p(t,o):t,n=e.length-1,m;n>=0;n--)(m=e[n])&&(r=(i?m(t,o,r):m(r))||r);return i&&r&&l(t,o,r),r};var M={};w(M,{SkdxAspectRatio:()=>a,resolveAspectRatio:()=>v});module.exports=E(M);var s=require("lit"),u=require("lit/decorators.js"),f=require("../internal/define.cjs"),b=require("../internal/styles.cjs"),h=require("../utils/is-dev-mode.cjs");var c=!1;function v(e){return Number.isFinite(e)&&e>0?e:(c||(c=!0,(0,h.isDevMode)()&&console.warn(`[skdx] AspectRatio: \`ratio\` must be a finite number greater than zero, got ${e}. Falling back to the default of 1. A non-positive ratio is not a valid CSS aspect-ratio, so the declaration would be discarded and the box would collapse to no height.`)),1)}var a=class extends s.LitElement{constructor(){super(...arguments);this.ratio=1}render(){return s.html`<div part="aspect-ratio" style=${`aspect-ratio: ${v(this.ratio)}`}>
+      <slot></slot>
+    </div>`}};a.styles=[b.hiddenHostStyles,s.css`
       :host {
         display: block;
       }
-    `],m([(0,c.property)({type:Number})],i.prototype,"ratio",2),i=m([(0,v.customElement)("skdx-aspect-ratio","aspect-ratio","root")],i);0&&(module.exports={SkdxAspectRatio});
+    `],d([(0,u.property)({type:Number})],a.prototype,"ratio",2),a=d([(0,f.customElement)("skdx-aspect-ratio","aspect-ratio","root")],a);0&&(module.exports={SkdxAspectRatio,resolveAspectRatio});

package/dist/aspect-ratio/AspectRatio.d.cts

@@ -1,12 +1,14 @@
 import { LitElement } from 'lit';
 /**
- * `<skdx-aspect-ratio>` — the Web Components implementation of the shared
- * AspectRatio contract (see `@skdx/shared`'s `aspectRatioContract`).
- * Maintains a fixed width:height ratio for its content via the
- * padding-percentage technique, independent of consumer CSS. Renders a
- * `part="wrapper"` that owns the padding hack, containing an
- * absolutely-positioned `part="aspect-ratio"` that fills it and slots the
- * actual content.
+ * Fallback for invalid ratios. Non-positive or non-finite numbers are invalid
+ * CSS `aspect-ratio` values; the declaration is discarded and the element
+ * collapses to no height (looks broken).
+ */
+export declare function resolveAspectRatio(ratio: number): number;
+/**
+ * Maintains a fixed width:height ratio for content via the `aspect-ratio` CSS
+ * property. Independent of consumer CSS. Requires a containing block with a
+ * definite inline size; `aspect-ratio` resolves one axis from the other.
  *
  * @example
  * ```html
@@ -17,12 +19,15 @@ import { LitElement } from 'lit';
  * </div>
  * ```
  *
- * @csspart wrapper - The outer element owning the padding-percentage ratio hack.
- * @csspart aspect-ratio - The absolutely-positioned inner element that fills the wrapper and slots content.
+ * @csspart aspect-ratio - The element the ratio is applied to.
  */
 export declare class SkdxAspectRatio extends LitElement {
     static styles: import("lit").CSSResult[];
-    /** Desired width:height ratio, e.g. `16 / 9`. */
+    /**
+     * Width:height ratio (e.g., `16 / 9`). Must be finite and positive;
+     * anything else falls back to 1 with a dev-mode warning.
+     * @default 1
+     */
     ratio: number;
     render(): import("lit").TemplateResult<1>;
 }

package/dist/aspect-ratio/AspectRatio.d.ts

@@ -1,12 +1,14 @@
 import { LitElement } from 'lit';
 /**
- * `<skdx-aspect-ratio>` — the Web Components implementation of the shared
- * AspectRatio contract (see `@skdx/shared`'s `aspectRatioContract`).
- * Maintains a fixed width:height ratio for its content via the
- * padding-percentage technique, independent of consumer CSS. Renders a
- * `part="wrapper"` that owns the padding hack, containing an
- * absolutely-positioned `part="aspect-ratio"` that fills it and slots the
- * actual content.
+ * Fallback for invalid ratios. Non-positive or non-finite numbers are invalid
+ * CSS `aspect-ratio` values; the declaration is discarded and the element
+ * collapses to no height (looks broken).
+ */
+export declare function resolveAspectRatio(ratio: number): number;
+/**
+ * Maintains a fixed width:height ratio for content via the `aspect-ratio` CSS
+ * property. Independent of consumer CSS. Requires a containing block with a
+ * definite inline size; `aspect-ratio` resolves one axis from the other.
  *
  * @example
  * ```html
@@ -17,12 +19,15 @@ import { LitElement } from 'lit';
  * </div>
  * ```
  *
- * @csspart wrapper - The outer element owning the padding-percentage ratio hack.
- * @csspart aspect-ratio - The absolutely-positioned inner element that fills the wrapper and slots content.
+ * @csspart aspect-ratio - The element the ratio is applied to.
  */
 export declare class SkdxAspectRatio extends LitElement {
     static styles: import("lit").CSSResult[];
-    /** Desired width:height ratio, e.g. `16 / 9`. */
+    /**
+     * Width:height ratio (e.g., `16 / 9`). Must be finite and positive;
+     * anything else falls back to 1 with a dev-mode warning.
+     * @default 1
+     */
     ratio: number;
     render(): import("lit").TemplateResult<1>;
 }

package/dist/aspect-ratio/AspectRatio.js

@@ -1,15 +1,7 @@
-var d=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var l=(a,e,i,o)=>{for(var t=o>1?void 0:o?m(e,i):e,s=a.length-1,p;s>=0;s--)(p=a[s])&&(t=(o?p(e,i,t):p(t))||t);return o&&t&&d(e,i,t),t};import{css as n,html as c,LitElement as v}from"lit";import{property as y}from"lit/decorators.js";import{customElement as b}from"../internal/define.js";import{hiddenHostStyles as f}from"../internal/styles.js";var r=class extends v{constructor(){super(...arguments);this.ratio=1}render(){return c`
-      <div
-        part="wrapper"
-        data-skdx-aspect-ratio-wrapper
-        style=${`position: relative; width: 100%; padding-bottom: ${100/this.ratio}%`}
-      >
-        <div part="aspect-ratio" data-skdx-aspect-ratio style="position: absolute; inset: 0">
-          <slot></slot>
-        </div>
-      </div>
-    `}};r.styles=[f,n`
+var d=Object.defineProperty;var p=Object.getOwnPropertyDescriptor;var n=(e,o,a,i)=>{for(var t=i>1?void 0:i?p(o,a):o,s=e.length-1,l;s>=0;s--)(l=e[s])&&(t=(i?l(o,a,t):l(t))||t);return i&&t&&d(o,a,t),t};import{css as c,html as u,LitElement as f}from"lit";import{property as b}from"lit/decorators.js";import{customElement as h}from"../internal/define.js";import{hiddenHostStyles as v}from"../internal/styles.js";import{isDevMode as g}from"../utils/is-dev-mode.js";var m=!1;function y(e){return Number.isFinite(e)&&e>0?e:(m||(m=!0,g()&&console.warn(`[skdx] AspectRatio: \`ratio\` must be a finite number greater than zero, got ${e}. Falling back to the default of 1. A non-positive ratio is not a valid CSS aspect-ratio, so the declaration would be discarded and the box would collapse to no height.`)),1)}var r=class extends f{constructor(){super(...arguments);this.ratio=1}render(){return u`<div part="aspect-ratio" style=${`aspect-ratio: ${y(this.ratio)}`}>
+      <slot></slot>
+    </div>`}};r.styles=[v,c`
       :host {
         display: block;
       }
-    `],l([y({type:Number})],r.prototype,"ratio",2),r=l([b("skdx-aspect-ratio","aspect-ratio","root")],r);export{r as SkdxAspectRatio};
+    `],n([b({type:Number})],r.prototype,"ratio",2),r=n([h("skdx-aspect-ratio","aspect-ratio","root")],r);export{r as SkdxAspectRatio,y as resolveAspectRatio};

package/dist/autocomplete/Autocomplete.cjs

@@ -1,5 +1,5 @@
-"use strict";var o=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var O=Object.getOwnPropertyNames;var C=Object.prototype.hasOwnProperty;var E=(l,r)=>{for(var e in r)o(l,e,{get:r[e],enumerable:!0})},T=(l,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let s of O(r))!C.call(l,s)&&s!==e&&o(l,s,{get:()=>r[s],enumerable:!(t=c(r,s))||t.enumerable});return l};var F=l=>T(o({},"__esModule",{value:!0}),l),n=(l,r,e,t)=>{for(var s=t>1?void 0:t?c(r,e):r,d=l.length-1,p;d>=0;d--)(p=l[d])&&(s=(t?p(r,e,s):p(s))||s);return t&&s&&o(r,e,s),s};var w={};E(w,{AUTOCOMPLETE_UPDATE_EVENT:()=>m,OPTION_SELECTOR:()=>h,SkdxAutocomplete:()=>i,defaultGetSuggestionCountLabel:()=>I});module.exports=F(w);var u=require("lit"),a=require("lit/decorators.js"),f=require("../internal/define.cjs"),v=require("../internal/form-associated.cjs"),g=require("../internal/ids.cjs"),b=require("../internal/open-change-complete.cjs"),y=require("../internal/positioning.cjs"),V=require("../utils/live-announcer.cjs");var h='[role="option"]:not([data-disabled])',m="skdx-autocomplete-internal-update";function I(l){return`${l} suggestion${l===1?"":"s"} available`}var i=class extends(0,v.FormAssociated)(u.LitElement){constructor(){super(...arguments);this.value="";this.defaultValue="";this.inputValue="";this.open=!1;this.defaultOpen=!1;this.allowCustomValue=!0;this.openOnFocus=!1;this.disabled=!1;this.readOnly=!1;this.invalid=!1;this.getSuggestionCountLabel=I;this.listId=(0,g.nextId)("skdx-autocomplete-list");this.activeId=null;this.inputHost=null;this.contentEl=null;this.committedText="";this.seeded=!1;this.itemRegistry=new Map;this.itemObserver=new MutationObserver(()=>this.announceSuggestionCount());this.hasUpdatedOnce=!1}setValue(e){this.value!==e&&(this.value=e,this.emit("value-change",e))}setInputValue(e){this.inputValue!==e&&(this.inputValue=e,this.emit("input-value-change",e))}setOpen(e){this.open!==e&&(this.open=e,e||(this.activeId=null),this.emit("open-change",e))}isSelected(e){return e!==""&&e===this.value}matchesFilter(e){return this.filter===void 0||this.filter(e,this.inputValue)}commitItem(e,t){this.disabled||this.readOnly||(this.setValue(e),this.setInputValue(t),this.committedText=t,this.setOpen(!1))}commitInputValue(){if(!(this.disabled||this.readOnly)){if(!this.allowCustomValue){this.setInputValue(this.committedText),this.setOpen(!1);return}this.setValue(this.inputValue),this.committedText=this.inputValue,this.setOpen(!1)}}revert(){this.setInputValue(this.committedText),this.setOpen(!1)}openWithHighlight(e){this.setOpen(!0),requestAnimationFrame(()=>{let t=Array.from(this.querySelectorAll(h));t.length!==0&&this.setActiveId((e==="last"?t[t.length-1]:t[0]).id)})}setActiveId(e){this.activeId=e,this.notify()}registerItem(e,t){this.itemRegistry.set(e,t)}unregisterItem(e){this.itemRegistry.delete(e),this.activeId===e&&this.scheduleReseed()}getItem(e){return this.itemRegistry.get(e)}scheduleReseed(){this.reseedFrame===void 0&&(this.reseedFrame=requestAnimationFrame(()=>{this.reseedFrame=void 0;let e=this.activeId;if(e===null)return;let t=Array.from(this.querySelectorAll(h));t.some(s=>s.id===e)||this.setActiveId(t[0]?.id??null)}))}emit(e,t){this.dispatchEvent(new CustomEvent(e,{detail:t,bubbles:!0,composed:!0})),this.notify()}notify(){this.dispatchEvent(new CustomEvent(m,{bubbles:!0,composed:!0})),this.requestUpdate()}announceSuggestionCount(){this.open&&(0,V.announce)(this.getSuggestionCountLabel(this.querySelectorAll(h).length))}connectedCallback(){super.connectedCallback(),this.seeded||(this.seeded=!0,this.hasAttribute("value")||(this.value=this.defaultValue),this.hasAttribute("input-value")||(this.inputValue=this.defaultInputValue??this.value),this.hasAttribute("open")||(this.open=this.defaultOpen),this.committedText=this.inputValue,this.initialValue=this.value,this.initialInputValue=this.inputValue),this.itemObserver.observe(this,{childList:!0,subtree:!0,attributeFilter:["data-disabled","role"]})}disconnectedCallback(){this.itemObserver.disconnect(),this.reseedFrame!==void 0&&cancelAnimationFrame(this.reseedFrame),this.reseedFrame=void 0,this.teardownOpenChangeComplete?.(),super.disconnectedCallback()}updated(e){let t=!this.hasUpdatedOnce;this.hasUpdatedOnce=!0,(e.has("inputValue")||e.has("name"))&&this.setFormValue(this.inputValue),e.has("open")&&this.open&&this.announceSuggestionCount(),e.size>0&&this.dispatchEvent(new CustomEvent(m,{bubbles:!0,composed:!0})),e.has("open")&&!t&&(this.teardownOpenChangeComplete?.(),this.teardownOpenChangeComplete=(0,b.notifyOpenChangeComplete)(()=>this.contentEl,this.open,s=>this.dispatchEvent(new CustomEvent("open-change-complete",{detail:s,bubbles:!0,composed:!0}))))}formResetCallback(){this.value=this.initialValue??"",this.inputValue=this.initialInputValue??"",this.committedText=this.inputValue}render(){return u.html`<slot></slot>`}};i.styles=u.css`
+"use strict";var d=Object.defineProperty;var b=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var A=(l,a)=>{for(var t in a)d(l,t,{get:a[t],enumerable:!0})},L=(l,a,t,e)=>{if(a&&typeof a=="object"||typeof a=="function")for(let i of R(a))!x.call(l,i)&&i!==t&&d(l,i,{get:()=>a[i],enumerable:!(e=b(a,i))||e.enumerable});return l};var F=l=>L(d({},"__esModule",{value:!0}),l),n=(l,a,t,e)=>{for(var i=e>1?void 0:e?b(a,t):a,o=l.length-1,p;o>=0;o--)(p=l[o])&&(i=(e?p(a,t,i):p(i))||i);return e&&i&&d(a,t,i),i};var M={};A(M,{AUTOCOMPLETE_UPDATE_EVENT:()=>g,OPTION_SELECTOR:()=>m,SkdxAutocomplete:()=>s,defaultGetSuggestionCountLabel:()=>T,scrollIntoPopup:()=>I});module.exports=F(M);var h=require("lit"),r=require("lit/decorators.js"),f=require("../internal/authored.cjs"),y=require("../internal/define.cjs"),O=require("../internal/form-associated.cjs"),V=require("../internal/ids.cjs"),E=require("../internal/open-change-complete.cjs"),v=require("../internal/positioning.cjs"),c=require("../internal/scored-filter.cjs"),C=require("../utils/live-announcer.cjs"),u=require("./AutocompleteAnatomy.cjs");var m='[role="option"]:not([data-disabled])',g="skdx-autocomplete-internal-update";function I(l,a){let t=l.querySelector('[data-part="viewport"]')??l;if(t===a||!t.contains(a))return;let e=t.getBoundingClientRect(),i=a.getBoundingClientRect();t.scrollTop+=i.top-e.top-(e.height-i.height)/2}function T(l){return`${l} suggestion${l===1?"":"s"} available`}var s=class extends(0,O.FormAssociated)(h.LitElement){constructor(){super(...arguments);this.value="";this.defaultValue="";this.inputValue="";this.open=!1;this.defaultOpen=!1;this.allowCustomValue=!0;this.openOnFocus=!1;this.autoHighlight=!1;this.loop=!0;this.disabled=!1;this.readOnly=!1;this.invalid=!1;this.loading=!1;this.getResultCountLabel=T;this.listId=(0,V.nextId)("skdx-autocomplete-list");this.activeId=null;this.inputHost=null;this.contentEl=null;this.committedText="";this.seeded=!1;this.itemRegistry=new Map;this.itemObserver=new MutationObserver(()=>{this.announceSuggestionCount(),this.visibleOptions()});this.fillAnatomy=()=>{if((0,f.hasAuthoredParts)(this,u.AUTOCOMPLETE_ANATOMY_GENERATED,u.AUTOCOMPLETE_RENDER_SLOTS)){this._anatomyOptionsRef=void 0;return}this.options!==this._anatomyOptionsRef||!(0,f.hasGeneratedContent)(this,u.AUTOCOMPLETE_ANATOMY_GENERATED)?(this._anatomyOptionsRef=this.options,(0,u.fillAutocompleteAnatomy)(this)):(0,u.refreshAutocompleteAnatomyText)(this)};this.hasUpdatedOnce=!1}setValue(t,e="programmatic",i=!1){if(this.value===t)return;let o=this.value;this.value=t;let p={value:t,previousValue:o===""?null:o,reason:e,created:i};this.dispatchEvent(new CustomEvent("value-change",{detail:p,bubbles:!0,composed:!0})),this.notify()}setInputValue(t){this.inputValue!==t&&(this.inputValue=t,this.emit("input-value-change",t))}setOpen(t){this.open!==t&&(this.open=t,t||(this.activeId=null),this.emit("open-change",t))}isSelected(t){return t!==""&&t===this.value}matchesFilter(t){return typeof this.filter!="function"||(0,c.filterKeeps)(this.filter(t,this.inputValue))}visibleOptions(){let t=this.filter;return typeof t!="function"?Array.from(this.querySelectorAll(m)):(0,c.sortByScore)(this,m,e=>{let i=this.itemRegistry.get(e);if(!i)return null;let o=t(i.text,this.inputValue);return typeof o=="number"?o:null})}commitItem(t,e,i="programmatic"){this.disabled||this.readOnly||(this.setValue(t,i,!1),this.setInputValue(e),this.committedText=e,this.setOpen(!1))}commitInputValue(t="keyboard"){if(!(this.disabled||this.readOnly)){if(!this.allowCustomValue){this.setInputValue(this.committedText),this.setOpen(!1);return}this.setValue(this.inputValue,t,!0),this.committedText=this.inputValue,this.setOpen(!1)}}revert(){this.setInputValue(this.committedText),this.setOpen(!1)}clear(){this.setValue("","pointer",!1),this.setInputValue(""),this.committedText="",this.setOpen(!1)}openWithHighlight(t){this.setOpen(!0),requestAnimationFrame(()=>{let e=this.visibleOptions();if(e.length===0)return;let i=t==="last"?e[e.length-1]:e[0];this.setActiveId(i.id),this.contentEl&&I(this.contentEl,i)})}setActiveId(t){this.activeId=t,this.notify()}registerItem(t,e){this.itemRegistry.set(t,e),this.activeId===null&&this.scheduleReseed()}unregisterItem(t){this.itemRegistry.delete(t),(this.activeId===t||this.activeId===null)&&this.scheduleReseed()}getItem(t){return this.itemRegistry.get(t)}scheduleReseed(){this.reseedFrame===void 0&&(this.reseedFrame=requestAnimationFrame(()=>{this.reseedFrame=void 0;let t=this.activeId;if(t===null&&!(this.autoHighlight&&this.open))return;let e=this.visibleOptions();if(t!==null&&e.some(o=>o.id===t))return;let i=e[0]?.id??null;i===null&&t===null||this.setActiveId(i)}))}emit(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0})),this.notify()}notify(){this.dispatchEvent(new CustomEvent(g,{bubbles:!0,composed:!0})),this.requestUpdate()}announceSuggestionCount(){!this.open||this.loading||(0,C.announce)(this.getResultCountLabel(this.querySelectorAll(m).length))}connectedCallback(){super.connectedCallback();let t=this.querySelector("skdx-autocomplete-list")?.id;t&&(this.listId=t),this.seeded||(this.seeded=!0,this.hasAttribute("value")||(this.value=this.defaultValue),this.hasAttribute("input-value")||(this.inputValue=this.defaultInputValue??this.value),this.hasAttribute("open")||(this.open=this.defaultOpen),this.committedText=this.inputValue,this.initialValue=this.value,this.initialInputValue=this.inputValue),this.itemObserver.observe(this,{childList:!0,subtree:!0,attributeFilter:["data-disabled","role"]}),queueMicrotask(this.fillAnatomy)}disconnectedCallback(){this.itemObserver.disconnect(),this.reseedFrame!==void 0&&cancelAnimationFrame(this.reseedFrame),this.reseedFrame=void 0,this.teardownOpenChangeComplete?.(),super.disconnectedCallback()}updated(t){let e=!this.hasUpdatedOnce;this.hasUpdatedOnce=!0,this.fillAnatomy(),(t.has("inputValue")||t.has("name"))&&this.setFormValue(this.inputValue),(t.has("open")||t.has("loading"))&&this.open&&this.announceSuggestionCount(),t.has("open")&&this.open&&this.autoHighlight&&this.activeId===null&&this.scheduleReseed(),(t.has("inputValue")||t.has("filter"))&&requestAnimationFrame(()=>this.visibleOptions()),t.size>0&&this.dispatchEvent(new CustomEvent(g,{bubbles:!0,composed:!0})),t.has("open")&&!e&&(this.teardownOpenChangeComplete?.(),this.teardownOpenChangeComplete=(0,E.notifyOpenChangeComplete)(()=>this.contentEl,this.open,i=>this.dispatchEvent(new CustomEvent("open-change-complete",{detail:i,bubbles:!0,composed:!0}))))}formResetCallback(){this.value=this.initialValue??"",this.inputValue=this.initialInputValue??"",this.committedText=this.inputValue}render(){return h.html`<slot @slotchange=${this.fillAnatomy}></slot>`}};s.styles=h.css`
     :host {
       display: contents;
     }
-  `,n([(0,a.property)({type:String,reflect:!0})],i.prototype,"value",2),n([(0,a.property)({type:String,attribute:"default-value"})],i.prototype,"defaultValue",2),n([(0,a.property)({type:String,attribute:"input-value"})],i.prototype,"inputValue",2),n([(0,a.property)({type:String,attribute:"default-input-value"})],i.prototype,"defaultInputValue",2),n([(0,a.property)({type:Boolean,reflect:!0})],i.prototype,"open",2),n([(0,a.property)({type:Boolean,attribute:"default-open"})],i.prototype,"defaultOpen",2),n([(0,a.property)({converter:y.optOutBoolean,attribute:"allow-custom-value"})],i.prototype,"allowCustomValue",2),n([(0,a.property)({type:Boolean,attribute:"open-on-focus",reflect:!0})],i.prototype,"openOnFocus",2),n([(0,a.property)({attribute:!1})],i.prototype,"filter",2),n([(0,a.property)({type:Boolean,reflect:!0})],i.prototype,"disabled",2),n([(0,a.property)({type:Boolean,attribute:"read-only",reflect:!0})],i.prototype,"readOnly",2),n([(0,a.property)({type:Boolean,reflect:!0})],i.prototype,"invalid",2),n([(0,a.property)({type:String,reflect:!0})],i.prototype,"name",2),n([(0,a.property)({attribute:!1})],i.prototype,"getSuggestionCountLabel",2),i=n([(0,f.customElement)("skdx-autocomplete")],i);0&&(module.exports={AUTOCOMPLETE_UPDATE_EVENT,OPTION_SELECTOR,SkdxAutocomplete,defaultGetSuggestionCountLabel});
+  `,n([(0,r.property)({type:String,reflect:!0})],s.prototype,"value",2),n([(0,r.property)({type:String,attribute:"default-value"})],s.prototype,"defaultValue",2),n([(0,r.property)({type:String,attribute:"input-value"})],s.prototype,"inputValue",2),n([(0,r.property)({type:String,attribute:"default-input-value"})],s.prototype,"defaultInputValue",2),n([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,"open",2),n([(0,r.property)({type:Boolean,attribute:"default-open"})],s.prototype,"defaultOpen",2),n([(0,r.property)({converter:v.optOutBoolean,attribute:"allow-custom-value"})],s.prototype,"allowCustomValue",2),n([(0,r.property)({type:Boolean,attribute:"open-on-focus",reflect:!0})],s.prototype,"openOnFocus",2),n([(0,r.property)({type:Boolean,attribute:"auto-highlight",reflect:!0})],s.prototype,"autoHighlight",2),n([(0,r.property)({converter:v.optOutBoolean,attribute:"loop"})],s.prototype,"loop",2),n([(0,r.property)({attribute:!1})],s.prototype,"filter",2),n([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,"disabled",2),n([(0,r.property)({type:Boolean,attribute:"read-only",reflect:!0})],s.prototype,"readOnly",2),n([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,"invalid",2),n([(0,r.property)({type:Boolean,reflect:!0})],s.prototype,"loading",2),n([(0,r.property)({type:String,reflect:!0})],s.prototype,"name",2),n([(0,r.property)({type:String,attribute:"form",reflect:!0})],s.prototype,"formId",2),n([(0,r.property)({attribute:!1})],s.prototype,"getResultCountLabel",2),n([(0,r.property)({attribute:!1})],s.prototype,"options",2),n([(0,r.property)({type:String})],s.prototype,"placeholder",2),s=n([(0,y.customElement)("skdx-autocomplete")],s);0&&(module.exports={AUTOCOMPLETE_UPDATE_EVENT,OPTION_SELECTOR,SkdxAutocomplete,defaultGetSuggestionCountLabel,scrollIntoPopup});