@taprootio/espalier 3.9.0 → 4.1.0

package/dist/progress/esp-progress.d.ts

@@ -54,7 +54,7 @@ import { EspalierElementBase } from "../shared/esp-element-base.js";
  *   const startBtn = findById("start-btn");
  *   const resetBtn = findById("reset-btn");
  *   let running = false;
- *   startBtn.addEventListener("clicked", () => {
+ *   startBtn.addEventListener("esp-clicked", () => {
  *     if (running) return;
  *     running = true;
  *     progress.value = 0;
@@ -72,7 +72,7 @@ import { EspalierElementBase } from "../shared/esp-element-base.js";
  *     }
  *     requestAnimationFrame(step);
  *   });
- *   resetBtn.addEventListener("clicked", () => {
+ *   resetBtn.addEventListener("esp-clicked", () => {
  *     running = false;
  *     progress.value = 0;
  *   });
@@ -139,7 +139,7 @@ import { EspalierElementBase } from "../shared/esp-element-base.js";
  *   const startCircleBtn = findById("start-circle-btn");
  *   const resetCircleBtn = findById("reset-circle-btn");
  *   let circleRunning = false;
- *   startCircleBtn.addEventListener("clicked", () => {
+ *   startCircleBtn.addEventListener("esp-clicked", () => {
  *     if (circleRunning) return;
  *     circleRunning = true;
  *     circleProgress.value = 0;
@@ -157,7 +157,7 @@ import { EspalierElementBase } from "../shared/esp-element-base.js";
  *     }
  *     requestAnimationFrame(step);
  *   });
- *   resetCircleBtn.addEventListener("clicked", () => {
+ *   resetCircleBtn.addEventListener("esp-clicked", () => {
  *     circleRunning = false;
  *     circleProgress.value = 0;
  *   });

package/dist/radio-button/esp-radio-button-group.d.ts

@@ -33,9 +33,11 @@ import { type EspalierFormField } from "../form-item/esp-form-item.js";
  *
  * @slot - Place `esp-radio-button` elements in the default slot.
  *
- * @event {CustomEvent<string>} value-changed - Fired when the
+ * @event {CustomEvent<string>} esp-value-changed - Fired when the
  * selected radio button changes. The detail is the value of the
  * newly selected radio button.
+ * @event {CustomEvent<{ valid: boolean; message: string }>} esp-validity-changed -
+ * Fired whenever constraint validation runs.
  *
  * @docPageTitle Radio Button Group
  * @docUrl /components/radio-button/group
@@ -78,7 +80,7 @@ export declare class EspalierRadioButtonGroup extends EspalierElementBase implem
      * radio button if none is checked.
      */
     focus(options?: FocusOptions): void;
-    /** Re-run constraint validation and dispatch `validity-changed`. */
+    /** Re-run constraint validation and dispatch `esp-validity-changed`. */
     validate(): void;
     /** Check whether the current state is valid (delegates to ElementInternals). */
     checkValidity(): boolean;

package/dist/radio-button/esp-radio-button-group.js

@@ -1,15 +1,15 @@
-var l=function(n,e,t,i){var a=arguments.length,r=a<3?e:i===null?i=Object.getOwnPropertyDescriptor(e,t):i,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(n,e,t,i);else for(var h=n.length-1;h>=0;h--)(o=n[h])&&(r=(a<3?o(r):a>3?o(e,t,r):o(e,t))||r);return a>3&&r&&Object.defineProperty(e,t,r),r};import{css as f,html as c}from"lit";import{customElement as p,property as d}from"lit/decorators.js";import{EspalierElementBase as u}from"../shared/esp-element-base.js";import{createRef as m,ref as g}from"lit/directives/ref.js";import{EspalierRadioButton as y}from"./esp-radio-button.js";import{FormFieldController as b}from"../shared/form-field-controller.js";let s=class extends u{constructor(){super(...arguments),this.internals=this.attachInternals(),this.formCtrl=new b({host:this,internals:this.internals,getFormValue:()=>this.value||null,getValidity:()=>this.required&&!this.value?{flags:{valueMissing:!0},message:this.requiredMessage||"Please select an option."}:null,onReset:()=>{for(const e of this.getRadioButtons())e.checked=!1},onRestore:e=>{for(const t of this.getRadioButtons())t.checked=t.value===e},onDisabled:e=>{this.disabled=e}}),this.itemsSlot=m(),this.formItemDescription=null,this.describedRadios=new Set,this.name="",this.required=!1,this.requiredMessage="",this.disabled=!1,this.handleItemsSlotChange=()=>{this.applyDisabledState(),this.applyFormItemDescription()}}get value(){return this.getRadioButtons().find(e=>e.checked)?.value??""}focus(e){this.focusResolvedElementAfterUpdate(()=>{const t=this.getRadioButtons();return t.find(i=>i.checked&&!i.disabled)??t.find(i=>!i.disabled)},e)}setFormItemDescription(e){this.formItemDescription=e,this.applyFormItemDescription()}validate(){this.formCtrl.validate()}checkValidity(){return this.formCtrl.checkValidity()}getRadioButtons(){return this.itemsSlot.value?Array.from(this.itemsSlot.value.assignedElements()).filter(e=>e instanceof y):[]}applyDisabledState(){for(const e of this.getRadioButtons())e.disabled=this.disabled}applyFormItemDescription(){const e=new Set(this.getRadioButtons());for(const t of this.describedRadios)e.has(t)||t.setFormItemDescription(null);for(const t of e)t.setFormItemDescription(this.formItemDescription);this.describedRadios=e}handleChildChanged(e){e.stopPropagation();const t=e.detail;if(t.checked){for(const i of this.getRadioButtons())i.value!==t.value&&(i.checked=!1);this.formCtrl.syncValue(),this.emitValueChanged(t.value)}}handleKeyDown(e){if(!["ArrowDown","ArrowRight","ArrowUp","ArrowLeft"].includes(e.key))return;e.preventDefault();const t=this.getRadioButtons().filter(o=>!o.disabled);if(t.length===0)return;const i=t.findIndex(o=>o.checked),a=e.key==="ArrowDown"||e.key==="ArrowRight";let r;i===-1?r=0:a?r=(i+1)%t.length:r=(i-1+t.length)%t.length,i!==-1&&(t[i].checked=!1),t[r].checked=!0,t[r].focus(),this.formCtrl.syncValue(),this.emitValueChanged(t[r].value)}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}firstUpdated(e){super.firstUpdated(e),this.applyDisabledState(),this.applyFormItemDescription()}updated(e){super.updated(e),e.has("disabled")&&this.applyDisabledState()}render(){return c`
+var l=function(n,e,t,i){var a=arguments.length,s=a<3?e:i===null?i=Object.getOwnPropertyDescriptor(e,t):i,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")s=Reflect.decorate(n,e,t,i);else for(var h=n.length-1;h>=0;h--)(o=n[h])&&(s=(a<3?o(s):a>3?o(e,t,s):o(e,t))||s);return a>3&&s&&Object.defineProperty(e,t,s),s};import{css as f,html as c}from"lit";import{customElement as p,property as d}from"lit/decorators.js";import{EspalierElementBase as u}from"../shared/esp-element-base.js";import{createRef as m,ref as g}from"lit/directives/ref.js";import{EspalierRadioButton as y}from"./esp-radio-button.js";import{FormFieldController as b}from"../shared/form-field-controller.js";let r=class extends u{constructor(){super(...arguments),this.internals=this.attachInternals(),this.formCtrl=new b({host:this,internals:this.internals,getFormValue:()=>this.value||null,getValidity:()=>this.required&&!this.value?{flags:{valueMissing:!0},message:this.requiredMessage||"Please select an option."}:null,onReset:()=>{for(const e of this.getRadioButtons())e.checked=!1},onRestore:e=>{for(const t of this.getRadioButtons())t.checked=t.value===e},onDisabled:e=>{this.disabled=e}}),this.itemsSlot=m(),this.formItemDescription=null,this.describedRadios=new Set,this.name="",this.required=!1,this.requiredMessage="",this.disabled=!1,this.handleItemsSlotChange=()=>{this.applyDisabledState(),this.applyFormItemDescription()}}get value(){return this.getRadioButtons().find(e=>e.checked)?.value??""}focus(e){this.focusResolvedElementAfterUpdate(()=>{const t=this.getRadioButtons();return t.find(i=>i.checked&&!i.disabled)??t.find(i=>!i.disabled)},e)}setFormItemDescription(e){this.formItemDescription=e,this.applyFormItemDescription()}validate(){this.formCtrl.validate()}checkValidity(){return this.formCtrl.checkValidity()}getRadioButtons(){return this.itemsSlot.value?Array.from(this.itemsSlot.value.assignedElements()).filter(e=>e instanceof y):[]}applyDisabledState(){for(const e of this.getRadioButtons())e.disabled=this.disabled}applyFormItemDescription(){const e=new Set(this.getRadioButtons());for(const t of this.describedRadios)e.has(t)||t.setFormItemDescription(null);for(const t of e)t.setFormItemDescription(this.formItemDescription);this.describedRadios=e}handleChildChanged(e){e.stopPropagation();const t=e.detail;if(t.checked){for(const i of this.getRadioButtons())i.value!==t.value&&(i.checked=!1);this.formCtrl.syncValue(),this.emitValueChanged(t.value)}}handleKeyDown(e){if(!["ArrowDown","ArrowRight","ArrowUp","ArrowLeft"].includes(e.key))return;e.preventDefault();const t=this.getRadioButtons().filter(o=>!o.disabled);if(t.length===0)return;const i=t.findIndex(o=>o.checked),a=e.key==="ArrowDown"||e.key==="ArrowRight";let s;i===-1?s=0:a?s=(i+1)%t.length:s=(i-1+t.length)%t.length,i!==-1&&(t[i].checked=!1),t[s].checked=!0,t[s].focus(),this.formCtrl.syncValue(),this.emitValueChanged(t[s].value)}formResetCallback(){this.formCtrl.handleFormReset()}formStateRestoreCallback(e){this.formCtrl.handleFormStateRestore(e)}formDisabledCallback(e){this.formCtrl.handleFormDisabled(e)}firstUpdated(e){super.firstUpdated(e),this.applyDisabledState(),this.applyFormItemDescription()}updated(e){super.updated(e),e.has("disabled")&&this.applyDisabledState()}render(){return c`
       <div
         class="radio-group"
         role="radiogroup"
-        @value-changed=${this.handleChildChanged}
+        @esp-value-changed=${this.handleChildChanged}
         @keydown=${this.handleKeyDown}
       >
         <slot ${g(this.itemsSlot)} @slotchange=${this.handleItemsSlotChange}></slot>
       </div>
-    `}};s.formAssociated=!0,s.styles=[...u.styles,f`
+    `}};r.formAssociated=!0,r.styles=[...u.styles,f`
       .radio-group {
         display: grid;
         gap: var(--esp-size-tiny);
       }
-    `],l([d({type:String,reflect:!0})],s.prototype,"name",void 0),l([d({type:Boolean,reflect:!0})],s.prototype,"required",void 0),l([d({attribute:"required-message"})],s.prototype,"requiredMessage",void 0),l([d({type:Boolean,reflect:!0})],s.prototype,"disabled",void 0),s=l([p("esp-radio-button-group")],s);export{s as EspalierRadioButtonGroup};
+    `],l([d({type:String,reflect:!0})],r.prototype,"name",void 0),l([d({type:Boolean,reflect:!0})],r.prototype,"required",void 0),l([d({attribute:"required-message"})],r.prototype,"requiredMessage",void 0),l([d({type:Boolean,reflect:!0})],r.prototype,"disabled",void 0),r=l([p("esp-radio-button-group")],r);export{r as EspalierRadioButtonGroup};

package/dist/radio-button/esp-radio-button.d.ts

@@ -31,7 +31,7 @@ import { type EspalierFormField } from "../form-item/esp-form-item.js";
  *
  * @slot - The label text for the radio button.
  *
- * @event {CustomEvent<{ checked: boolean; value: string }>} value-changed -
+ * @event {CustomEvent<{ checked: boolean; value: string }>} esp-value-changed -
  * Fired when the radio button is selected. The detail contains the
  * new `checked` state and the radio button `value`.
  *

package/dist/repeater/esp-repeater.d.ts

@@ -2,16 +2,6 @@ import { nothing, type PropertyValues, type TemplateResult } from "lit";
 import { EspalierElementBase } from "../shared/esp-element-base.js";
 import { type CursorPageRequest, type CursorPageResult } from "../shared/cursor-pagination.js";
 import "../shared/virtualizer/lit-virtualizer.js";
-/**
- * @deprecated Use `CursorPageRequest` from `shared/cursor-pagination.js`. This
- * alias is retained for one release; the shape is unchanged.
- */
-export type RepeaterFetchParams = CursorPageRequest;
-/**
- * @deprecated Use `CursorPageResult` from `shared/cursor-pagination.js`. This
- * alias is retained for one release; the shape is unchanged.
- */
-export type RepeaterFetchResult<T = unknown> = CursorPageResult<T>;
 export type RepeaterLayout = "list" | "grid";
 export type RepeaterScrollModel = "contained" | "page";
 export type RepeaterRenderValue = TemplateResult | Node | string | number | boolean | typeof nothing | null | undefined;
@@ -378,8 +368,8 @@ export declare class EspalierRepeater extends EspalierElementBase {
      * the repeater fetches additional items as the user scrolls near the end
      * of the currently loaded range.
      */
-    get fetchPage(): ((params: RepeaterFetchParams) => Promise<RepeaterFetchResult>) | null;
-    set fetchPage(value: ((params: RepeaterFetchParams) => Promise<RepeaterFetchResult>) | null);
+    get fetchPage(): ((params: CursorPageRequest) => Promise<CursorPageResult<unknown>>) | null;
+    set fetchPage(value: ((params: CursorPageRequest) => Promise<CursorPageResult<unknown>>) | null);
     connectedCallback(): void;
     protected firstUpdated(changedProperties: PropertyValues): void;
     disconnectedCallback(): void;

package/dist/search/esp-search.d.ts

@@ -16,17 +16,17 @@ export interface SearchResult {
  *
  * `<esp-search>` is a pure UI shell with no search-engine dependency.
  * Consumers wire it to any search backend (Pagefind, MiniSearch, API,
- * etc.) by listening for `search-requested` events and calling
+ * etc.) by listening for `esp-search-requested` events and calling
  * `setResults()` with the matches.
  *
- * @fires search-requested - The user changed the query input. Fires on
+ * @event {CustomEvent<{ query: string }>} esp-search-requested - The user changed the query input. Fires on
  *   every keystroke (not debounced) so consumers can track the latest
  *   query and discard stale async results. Consumers that need debouncing
  *   should apply it themselves (e.g. Pagefind's `debouncedSearch()`).
  *   `detail: { query: string }`
- * @fires result-selected - The user chose a result.
+ * @event {CustomEvent<{ url: string }>} esp-search-result-selected - The user chose a result.
  *   `detail: { url: string }`
- * @fires search-closed - The overlay was closed (Escape, backdrop click,
+ * @event {CustomEvent<{}>} esp-search-closed - The overlay was closed (Escape, backdrop click,
  *   or result selection). Consumers should use this to cancel in-flight
  *   searches or discard pending results.
  *   `detail: {}`

package/dist/search/esp-search.js

@@ -1,4 +1,4 @@
-var o=function(a,e,t,c){var h=arguments.length,r=h<3?e:c===null?c=Object.getOwnPropertyDescriptor(e,t):c,p;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(a,e,t,c);else for(var d=a.length-1;d>=0;d--)(p=a[d])&&(r=(h<3?p(r):h>3?p(e,t,r):p(e,t))||r);return h>3&&r&&Object.defineProperty(e,t,r),r};import{css as y,html as l,nothing as i}from"lit";import{customElement as k,property as w,state as n}from"lit/decorators.js";import{classMap as f}from"lit/directives/class-map.js";import{createRef as u,ref as v}from"lit/directives/ref.js";import{unsafeHTML as E}from"lit/directives/unsafe-html.js";import{EspalierElementBase as b}from"../shared/esp-element-base.js";import{OverlayController as I}from"../shared/overlay-controller.js";import{ESP_EVENTS as m}from"../shared/events.js";import{srOnly as $}from"../shared/style-fragments.js";const g="%%ESP_MARK_OPEN%%",x="%%ESP_MARK_CLOSE%%";function R(a){return a.replace(/<mark>/gi,g).replace(/<\/mark>/gi,x).replace(/<[^>]*>/g,"").replaceAll(g,"<mark>").replaceAll(x,"</mark>")}let s=class extends b{constructor(){super(...arguments),this.placeholder="Search\u2026",this.isOpen=!1,this.results=[],this.loading=!1,this.query="",this.activeIndex=-1,this.vellumRef=u(),this.inputRef=u(),this.resultsRef=u(),this.idPrefix=`esp-search-${this.correlationId}`,this._overlay=new I({host:this,getFocusTrapContainer:()=>this.vellumRef.value??null,getFocusFallback:()=>this.inputRef.value??null})}show(){this.isOpen||(this.isOpen=!0,this._overlay.open(),this.updateComplete.then(()=>{this.inputRef.value?.focus()}))}hide(){this.isOpen&&(this.isOpen=!1,this.query="",this.results=[],this.activeIndex=-1,this.loading=!1,this._overlay.close(),this.dispatchEvent(new CustomEvent(m.SEARCH_CLOSED,{detail:{},bubbles:!0,composed:!0})))}setResults(e){this.results=e,this.activeIndex=e.length>0?0:-1}setLoading(e){this.loading=e}handleInput(e){const t=e.target.value;this.query=t,this.activeIndex=-1,this.dispatchEvent(new CustomEvent(m.SEARCH_REQUESTED,{detail:{query:t},bubbles:!0,composed:!0})),t.trim()||(this.results=[])}selectResult(e){this.dispatchEvent(new CustomEvent(m.RESULT_SELECTED,{detail:{url:e.url},bubbles:!0,composed:!0})),this.hide()}handleKeyDown(e){if(this.isOpen)switch(e.key){case"Escape":e.preventDefault(),this.hide();break;case"ArrowDown":e.preventDefault(),this.results.length>0&&(this.activeIndex=Math.min(this.activeIndex+1,this.results.length-1),this.scrollActiveIntoView());break;case"ArrowUp":e.preventDefault(),this.results.length>0&&(this.activeIndex=Math.max(this.activeIndex-1,0),this.scrollActiveIntoView());break;case"Enter":e.preventDefault(),this.activeIndex>=0&&this.activeIndex<this.results.length&&this.selectResult(this.results[this.activeIndex]);break;case"Tab":this._overlay.trapFocus(e);break}}handleBackdropClick(e){e.target===this.vellumRef.value&&this.hide()}scrollActiveIntoView(){this.updateComplete.then(()=>{const e=this.resultsRef.value?.querySelectorAll(".result");e&&this.activeIndex>=0&&e[this.activeIndex]&&e[this.activeIndex].scrollIntoView({block:"nearest"})})}get hasListbox(){return this.results.length>0}get listboxId(){return`${this.idPrefix}-listbox`}optionId(e){return`${this.idPrefix}-option-${e}`}render(){return l`
+var o=function(a,e,t,c){var h=arguments.length,r=h<3?e:c===null?c=Object.getOwnPropertyDescriptor(e,t):c,p;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(a,e,t,c);else for(var d=a.length-1;d>=0;d--)(p=a[d])&&(r=(h<3?p(r):h>3?p(e,t,r):p(e,t))||r);return h>3&&r&&Object.defineProperty(e,t,r),r};import{css as y,html as l,nothing as i}from"lit";import{customElement as k,property as w,state as n}from"lit/decorators.js";import{classMap as f}from"lit/directives/class-map.js";import{createRef as u,ref as v}from"lit/directives/ref.js";import{unsafeHTML as E}from"lit/directives/unsafe-html.js";import{EspalierElementBase as b}from"../shared/esp-element-base.js";import{OverlayController as I}from"../shared/overlay-controller.js";import{ESP_EVENTS as m}from"../shared/events.js";import{srOnly as R}from"../shared/style-fragments.js";const g="%%ESP_MARK_OPEN%%",x="%%ESP_MARK_CLOSE%%";function $(a){return a.replace(/<mark>/gi,g).replace(/<\/mark>/gi,x).replace(/<[^>]*>/g,"").replaceAll(g,"<mark>").replaceAll(x,"</mark>")}let s=class extends b{constructor(){super(...arguments),this.placeholder="Search\u2026",this.isOpen=!1,this.results=[],this.loading=!1,this.query="",this.activeIndex=-1,this.vellumRef=u(),this.inputRef=u(),this.resultsRef=u(),this.idPrefix=`esp-search-${this.correlationId}`,this._overlay=new I({host:this,getFocusTrapContainer:()=>this.vellumRef.value??null,getFocusFallback:()=>this.inputRef.value??null})}show(){this.isOpen||(this.isOpen=!0,this._overlay.open(),this.updateComplete.then(()=>{this.inputRef.value?.focus()}))}hide(){this.isOpen&&(this.isOpen=!1,this.query="",this.results=[],this.activeIndex=-1,this.loading=!1,this._overlay.close(),this.dispatchEvent(new CustomEvent(m.SEARCH_CLOSED,{detail:{},bubbles:!0,composed:!0})))}setResults(e){this.results=e,this.activeIndex=e.length>0?0:-1}setLoading(e){this.loading=e}handleInput(e){const t=e.target.value;this.query=t,this.activeIndex=-1,this.dispatchEvent(new CustomEvent(m.SEARCH_REQUESTED,{detail:{query:t},bubbles:!0,composed:!0})),t.trim()||(this.results=[])}selectResult(e){this.dispatchEvent(new CustomEvent(m.SEARCH_RESULT_SELECTED,{detail:{url:e.url},bubbles:!0,composed:!0})),this.hide()}handleKeyDown(e){if(this.isOpen)switch(e.key){case"Escape":e.preventDefault(),this.hide();break;case"ArrowDown":e.preventDefault(),this.results.length>0&&(this.activeIndex=Math.min(this.activeIndex+1,this.results.length-1),this.scrollActiveIntoView());break;case"ArrowUp":e.preventDefault(),this.results.length>0&&(this.activeIndex=Math.max(this.activeIndex-1,0),this.scrollActiveIntoView());break;case"Enter":e.preventDefault(),this.activeIndex>=0&&this.activeIndex<this.results.length&&this.selectResult(this.results[this.activeIndex]);break;case"Tab":this._overlay.trapFocus(e);break}}handleBackdropClick(e){e.target===this.vellumRef.value&&this.hide()}scrollActiveIntoView(){this.updateComplete.then(()=>{const e=this.resultsRef.value?.querySelectorAll(".result");e&&this.activeIndex>=0&&e[this.activeIndex]&&e[this.activeIndex].scrollIntoView({block:"nearest"})})}get hasListbox(){return this.results.length>0}get listboxId(){return`${this.idPrefix}-listbox`}optionId(e){return`${this.idPrefix}-option-${e}`}render(){return l`
       <div
         ${v(this.vellumRef)}
         class=${f({vellum:!0,"is-open":this.isOpen})}
@@ -49,11 +49,11 @@ var o=function(a,e,t,c){var h=arguments.length,r=h<3?e:c===null?c=Object.getOwnP
               @mouseenter=${()=>{this.activeIndex=t}}
             >
               <span class="result-title">${e.title}</span>
-              <span class="result-excerpt">${E(R(e.excerpt))}</span>
+              <span class="result-excerpt">${E($(e.excerpt))}</span>
             </li>
           `)}
       </ul>
-    `:i}};s.styles=[...b.styles,$,y`
+    `:i}};s.styles=[...b.styles,R,y`
       :host {
         display: block;
       }

package/dist/shared/esp-element-base.js

@@ -1,4 +1,4 @@
-var c=function(u,e,t,r){var o=arguments.length,s=o<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")s=Reflect.decorate(u,e,t,r);else for(var i=u.length-1;i>=0;i--)(a=u[i])&&(s=(o<3?a(s):o>3?a(e,t,s):a(e,t))||s);return o>3&&s&&Object.defineProperty(e,t,s),s};import{css as T,LitElement as C}from"lit";import{property as d,state as S}from"lit/decorators.js";import{subscribeToRootEvent as p}from"./root-event-subscription.js";import{traverseToClosest as m}from"./utilities.js";import{parseCssColor as w,serializeOklch as x,gamutMapToSRGB as P}from"./color-engine.js";import{computeVariants as b}from"../root/helpers/compute-variants.js";import{computeSemanticProperties as v}from"../root/helpers/compute-semantic-properties.js";import{DocumentSpriteController as E}from"./document-sprite.js";import{dataCompanionProperties as U}from"../root/helpers/data-companion-properties.js";import{dataSeriesProperties as V}from"../root/helpers/compute-theme-properties.js";import{lightnessRampProperties as I}from"../root/helpers/lightness-ramp-properties.js";import{ELEVATION_PROPERTIES as O,TYPE_ROLE_COLOR_PROPERTIES as A}from"./scale-engine.js";import{resolveContextTheme as y,resolveDataColorSource as D,semanticToCSS as z}from"./theme.js";import{alignAttributeTextInheritance as F,focusRing as N}from"./style-fragments.js";import{syncNormalizedAttribute as j}from"./attribute-helpers.js";import{INTENT_VARIANTS as k,normalizeIntentVariant as B}from"./intent-values.js";class n extends C{get seedColor(){return this.seedColorBacker}set seedColor(e){this.seedColorBacker=e}focusResolvedElementAfterUpdate(e,t){const r=()=>{const o=e();return o?(o.focus(t),!0):!1};r()||this.updateComplete.then(()=>{r()})}focusShadowElementAfterUpdate(e,t){this.focusResolvedElementAfterUpdate(()=>this.shadowRoot?.querySelector(e),t)}emitValueChanged(e){this.dispatchEvent(new CustomEvent("value-changed",{detail:e,bubbles:!0,composed:!0}))}get intent(){return this.intentBacker}set intent(e){const t=typeof e=="string"?e.trim():"";t!==""&&!k.includes(t)&&!this.warnedUnknownIntents.has(t)&&(this.warnedUnknownIntents.add(t),console.warn(`Espalier intent: "${t}" is not an intent; expected one of ${k.join(", ")}. Treating it as "neutral".`));const r=this.intentBacker,o=B(e);j(this,"intent",o),o!==r&&(this.intentBacker=o,this.requestUpdate("intent",r),this.applyTokensWhenRootReady())}get context(){return this.contextBacker}set context(e){const t=e??"";t!==this.contextBacker&&(this.contextBacker=t,this.applyTokensWhenRootReady(),this.refreshDescendantIntentDerivations())}refreshDescendantIntentDerivations(){const e=new Set,t=o=>{for(const s of Array.from(o.children))r(s)},r=o=>{if(!e.has(o)){if(e.add(o),o instanceof n&&o.applyTokensWhenRootReady(),o.shadowRoot&&t(o.shadowRoot),o instanceof HTMLSlotElement)for(const s of o.assignedElements({flatten:!0}))r(s);t(o)}};t(this),this.shadowRoot&&t(this.shadowRoot)}static flattenedParent(e){return e instanceof Element&&e.assignedSlot?e.assignedSlot:e instanceof ShadowRoot?e.host:e.parentNode}resolveAncestorZoneTheme(e){let t=n.flattenedParent(this);for(;t;){if(t instanceof Element&&t.localName==="esp-root")return null;if(t instanceof n){const r=t.contextBacker.trim();if(r){const o=this.resolveNamedContextTheme(e,r);if(o)return o}}t=n.flattenedParent(t)}return null}connectedCallback(){super.connectedCallback();const e=this.syncRootFromDom(!1);e&&this.subscribeToRootEvents(e)}disconnectedCallback(){super.disconnectedCallback(),this.unsubscribeFromRootEvents(),this.clearScopedTokens(),this.espRoot=null}firstUpdated(e){this.syncRootFromDom(!0),this.applyTokensWhenRootReady()}syncRootFromDom(e){const t=m(this,"esp-root");if(!t){if(this.espRoot&&this.clearScopedTokens(),this.unsubscribeFromRootEvents(),this.espRoot=null,!e)return null;throw new Error("No esp-root ancestor found. Espalier components must be placed inside an <esp-root> element.")}const r=t!==this.espRoot,s=t.scheme==="dark"?"dark":"light",a=this.scheme!==s,i=this.seedColor!==t.seedColor;return this.espRoot=t,r&&this.isConnected&&this.subscribeToRootEvents(t),(r||a||i)&&(this.scheme=s,this.seedColor=t.seedColor,this.applyTokensWhenRootReady()),r&&this.requestUpdate(),t}applyTokensWhenRootReady(){const e=this.espRoot;if(e&&(!e.hasUpdated||e.isUpdatePending)){this.applyTokensAfterInitialRootUpdate(e);return}this.applyScopedColorTokens()}applyTokensAfterInitialRootUpdate(e){if(this.pendingInitialThemeRoot===e)return;this.pendingInitialThemeRoot=e;const t=e.updateComplete;if(!t){this.pendingInitialThemeRoot=null,this.applyScopedColorTokens();return}t.then(()=>{this.pendingInitialThemeRoot===e&&(this.pendingInitialThemeRoot=null),!(!this.isConnected||this.espRoot!==e)&&(this.scheme=e.scheme==="dark"?"dark":"light",this.seedColor=e.seedColor,this.applyScopedColorTokens())})}subscribeToRootEvents(e){this.rootEventSubscriptionsActive&&this.subscribedRoot===e||(this.unsubscribeFromRootEvents(),this.subscribedRoot=e,this.rootEventUnsubscribers=[p(e,"seed-color-changed",this.handleSeedColorChanged),p(e,"scheme-changed",this.handleSchemeChanged),p(e,"theme-changed",this.handleThemeChanged),p(e,"icon-sprite-url-changed",this.handleIconSpriteUrlChanged)],this.rootEventSubscriptionsActive=!0)}unsubscribeFromRootEvents(){if(this.rootEventSubscriptionsActive){for(const e of this.rootEventUnsubscribers)e();this.rootEventUnsubscribers=[],this.subscribedRoot=null,this.rootEventSubscriptionsActive=!1}}constructor(){super(),this.seedColorBacker="oklch(0.7 0.125 216)",this.espRoot=null,this.contextBacker="",this.scopedTokenOriginalValues=new Map,this.warnedUnknownContexts=new Set,this.pendingInitialThemeRoot=null,this.rootEventSubscriptionsActive=!1,this.subscribedRoot=null,this.rootEventUnsubscribers=[],this.intentBacker="neutral",this.intentEmitsTokens=!0,this.warnedUnknownIntents=new Set,this.correlationId=globalThis.crypto?.randomUUID?.()??Math.random().toString(36),this.scheme="light",this.handleSeedColorChanged=e=>{this.syncRootFromDom(!1)&&(this.seedColor=e.seedColor,this.applyScopedColorTokens())},this.handleSchemeChanged=e=>{!this.syncRootFromDom(!1)||this.scheme===e.scheme||(this.scheme=e.scheme,this.applyScopedColorTokens())},this.handleThemeChanged=()=>{this.syncRootFromDom(!1)&&this.applyScopedColorTokens()},this.handleIconSpriteUrlChanged=()=>{this.syncRootFromDom(!1)&&this.requestUpdate()},new E(this,{reactToSpriteChanges:!1})}traverseToClosest(e){return m(this,e)}applyScopedColorTokens(){if(!this.espRoot)return;const e=this.intentEmitsTokens?n.intentColorSources[this.intentBacker]:"";if(!e&&!this.context.trim()){this.clearScopedTokens();return}const t=this.espRoot.activeTheme;if(!t){this.clearScopedTokens();return}const r=this.resolveContextTheme(t),o=r.theme,s=w(o.seedColor);if(!s)return;const a=b(s,o),i={};if(r.applied&&(Object.assign(i,v(o,a)),Object.assign(i,I(o)),Object.assign(i,O),Object.assign(i,A),Object.assign(i,U(i,V(o,s,l=>(typeof l=="string"?D(l,o.anchors):null)??o.seedColor)))),e){let l=o;r.applied||(l=this.resolveAncestorZoneTheme(t)??o);const g=l===o?a:b(s,l),R=v(l,g,{effectiveSource:(f,h)=>n.semanticActionTokens.has(f)?e:h});i["--esp-color-primary"]=x(P(g[e]));for(const f of n.semanticActionTokens){const h=z(f);i[h]=R[h]}}this.applyScopedTokenProperties(i)}resolveContextTheme(e){const t=this.context.trim();if(!t)return{applied:!1,theme:e};const r=this.resolveNamedContextTheme(e,t);return r?{applied:!0,theme:r}:(this.warnUnknownContextWhenSettled(t),{applied:!1,theme:e})}warnUnknownContextWhenSettled(e){if(this.warnedUnknownContexts.has(e))return;const t=this.espRoot;if(t&&!t.themeSettled){t.whenThemeSettled().then(()=>{if(!this.isConnected||this.espRoot!==t||this.context.trim()!==e)return;const r=t.activeTheme;r&&y(r,e)||this.warnUnknownContextWhenSettled(e)});return}this.warnedUnknownContexts.add(e),console.warn(`Espalier context: "${e}" is not defined by the active theme; inheriting root tokens.`)}resolveNamedContextTheme(e,t){return y(e,t)}applyScopedTokenProperties(e){for(const t of this.scopedTokenOriginalValues.keys())t in e||this.restoreScopedTokenProperty(t);for(const[t,r]of Object.entries(e))this.setScopedTokenProperty(t,r)}setScopedTokenProperty(e,t){const r=this.scopedTokenOriginalValues.get(e);if(r){const o=this.style.getPropertyValue(e),s=this.style.getPropertyPriority(e);(o!==r.generatedValue||s!==r.generatedPriority)&&(r.originalValue=o.length?o:null,r.originalPriority=s),r.generatedValue=t,r.generatedPriority=""}else{const o=this.style.getPropertyValue(e);this.scopedTokenOriginalValues.set(e,{generatedPriority:"",generatedValue:t,originalPriority:this.style.getPropertyPriority(e),originalValue:o.length?o:null})}this.style.setProperty(e,t)}restoreScopedTokenProperty(e){const t=this.scopedTokenOriginalValues.get(e);if(!t)return;const r=this.style.getPropertyValue(e),o=this.style.getPropertyPriority(e);(r!==t.generatedValue||o!==t.generatedPriority)&&(t.originalValue=r.length?r:null,t.originalPriority=o),t.originalValue===null?this.style.removeProperty(e):this.style.setProperty(e,t.originalValue,t.originalPriority),this.scopedTokenOriginalValues.delete(e)}clearScopedTokens(){for(const e of[...this.scopedTokenOriginalValues.keys()])this.restoreScopedTokenProperty(e)}}n.intentColorSources={danger:"danger",info:"info",neutral:"",success:"success",warning:"warning"},n.semanticActionTokens=new Set(["actionBackground","actionText"]),n.styles=[N(".esp-field:focus-within","--esp-field-focus-shadow"),F,T`
+var c=function(u,e,t,r){var o=arguments.length,s=o<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")s=Reflect.decorate(u,e,t,r);else for(var i=u.length-1;i>=0;i--)(a=u[i])&&(s=(o<3?a(s):o>3?a(e,t,s):a(e,t))||s);return o>3&&s&&Object.defineProperty(e,t,s),s};import{css as R,LitElement as C}from"lit";import{property as d,state as S}from"lit/decorators.js";import{subscribeToRootEvent as p}from"./root-event-subscription.js";import{traverseToClosest as m}from"./utilities.js";import{parseCssColor as w,serializeOklch as P,gamutMapToSRGB as x}from"./color-engine.js";import{computeVariants as b}from"../root/helpers/compute-variants.js";import{computeSemanticProperties as v}from"../root/helpers/compute-semantic-properties.js";import{DocumentSpriteController as E}from"./document-sprite.js";import{dataCompanionProperties as V}from"../root/helpers/data-companion-properties.js";import{dataSeriesProperties as U}from"../root/helpers/compute-theme-properties.js";import{lightnessRampProperties as I}from"../root/helpers/lightness-ramp-properties.js";import{ELEVATION_PROPERTIES as O,TYPE_ROLE_COLOR_PROPERTIES as A}from"./scale-engine.js";import{resolveContextTheme as y,resolveDataColorSource as D,semanticToCSS as z}from"./theme.js";import{alignAttributeTextInheritance as N,focusRing as F}from"./style-fragments.js";import{syncNormalizedAttribute as _}from"./attribute-helpers.js";import{INTENT_VARIANTS as k,normalizeIntentVariant as j}from"./intent-values.js";import{ESP_EVENTS as B}from"./events.js";class n extends C{get seedColor(){return this.seedColorBacker}set seedColor(e){this.seedColorBacker=e}focusResolvedElementAfterUpdate(e,t){const r=()=>{const o=e();return o?(o.focus(t),!0):!1};r()||this.updateComplete.then(()=>{r()})}focusShadowElementAfterUpdate(e,t){this.focusResolvedElementAfterUpdate(()=>this.shadowRoot?.querySelector(e),t)}emitValueChanged(e){this.dispatchEvent(new CustomEvent(B.VALUE_CHANGED,{detail:e,bubbles:!0,composed:!0}))}get intent(){return this.intentBacker}set intent(e){const t=typeof e=="string"?e.trim():"";t!==""&&!k.includes(t)&&!this.warnedUnknownIntents.has(t)&&(this.warnedUnknownIntents.add(t),console.warn(`Espalier intent: "${t}" is not an intent; expected one of ${k.join(", ")}. Treating it as "neutral".`));const r=this.intentBacker,o=j(e);_(this,"intent",o),o!==r&&(this.intentBacker=o,this.requestUpdate("intent",r),this.applyTokensWhenRootReady())}get context(){return this.contextBacker}set context(e){const t=e??"";t!==this.contextBacker&&(this.contextBacker=t,this.applyTokensWhenRootReady(),this.refreshDescendantIntentDerivations())}refreshDescendantIntentDerivations(){const e=new Set,t=o=>{for(const s of Array.from(o.children))r(s)},r=o=>{if(!e.has(o)){if(e.add(o),o instanceof n&&o.applyTokensWhenRootReady(),o.shadowRoot&&t(o.shadowRoot),o instanceof HTMLSlotElement)for(const s of o.assignedElements({flatten:!0}))r(s);t(o)}};t(this),this.shadowRoot&&t(this.shadowRoot)}static flattenedParent(e){return e instanceof Element&&e.assignedSlot?e.assignedSlot:e instanceof ShadowRoot?e.host:e.parentNode}resolveAncestorZoneTheme(e){let t=n.flattenedParent(this);for(;t;){if(t instanceof Element&&t.localName==="esp-root")return null;if(t instanceof n){const r=t.contextBacker.trim();if(r){const o=this.resolveNamedContextTheme(e,r);if(o)return o}}t=n.flattenedParent(t)}return null}connectedCallback(){super.connectedCallback();const e=this.syncRootFromDom(!1);e&&this.subscribeToRootEvents(e)}disconnectedCallback(){super.disconnectedCallback(),this.unsubscribeFromRootEvents(),this.clearScopedTokens(),this.espRoot=null}firstUpdated(e){this.syncRootFromDom(!0),this.applyTokensWhenRootReady()}syncRootFromDom(e){const t=m(this,"esp-root");if(!t){if(this.espRoot&&this.clearScopedTokens(),this.unsubscribeFromRootEvents(),this.espRoot=null,!e)return null;throw new Error("No esp-root ancestor found. Espalier components must be placed inside an <esp-root> element.")}const r=t!==this.espRoot,s=t.scheme==="dark"?"dark":"light",a=this.scheme!==s,i=this.seedColor!==t.seedColor;return this.espRoot=t,r&&this.isConnected&&this.subscribeToRootEvents(t),(r||a||i)&&(this.scheme=s,this.seedColor=t.seedColor,this.applyTokensWhenRootReady()),r&&this.requestUpdate(),t}applyTokensWhenRootReady(){const e=this.espRoot;if(e&&(!e.hasUpdated||e.isUpdatePending)){this.applyTokensAfterInitialRootUpdate(e);return}this.applyScopedColorTokens()}applyTokensAfterInitialRootUpdate(e){if(this.pendingInitialThemeRoot===e)return;this.pendingInitialThemeRoot=e;const t=e.updateComplete;if(!t){this.pendingInitialThemeRoot=null,this.applyScopedColorTokens();return}t.then(()=>{this.pendingInitialThemeRoot===e&&(this.pendingInitialThemeRoot=null),!(!this.isConnected||this.espRoot!==e)&&(this.scheme=e.scheme==="dark"?"dark":"light",this.seedColor=e.seedColor,this.applyScopedColorTokens())})}subscribeToRootEvents(e){this.rootEventSubscriptionsActive&&this.subscribedRoot===e||(this.unsubscribeFromRootEvents(),this.subscribedRoot=e,this.rootEventUnsubscribers=[p(e,"seed-color-changed",this.handleSeedColorChanged),p(e,"scheme-changed",this.handleSchemeChanged),p(e,"theme-changed",this.handleThemeChanged),p(e,"icon-sprite-url-changed",this.handleIconSpriteUrlChanged)],this.rootEventSubscriptionsActive=!0)}unsubscribeFromRootEvents(){if(this.rootEventSubscriptionsActive){for(const e of this.rootEventUnsubscribers)e();this.rootEventUnsubscribers=[],this.subscribedRoot=null,this.rootEventSubscriptionsActive=!1}}constructor(){super(),this.seedColorBacker="oklch(0.7 0.125 216)",this.espRoot=null,this.contextBacker="",this.scopedTokenOriginalValues=new Map,this.warnedUnknownContexts=new Set,this.pendingInitialThemeRoot=null,this.rootEventSubscriptionsActive=!1,this.subscribedRoot=null,this.rootEventUnsubscribers=[],this.intentBacker="neutral",this.intentEmitsTokens=!0,this.warnedUnknownIntents=new Set,this.correlationId=globalThis.crypto?.randomUUID?.()??Math.random().toString(36),this.scheme="light",this.handleSeedColorChanged=e=>{this.syncRootFromDom(!1)&&(this.seedColor=e.seedColor,this.applyScopedColorTokens())},this.handleSchemeChanged=e=>{!this.syncRootFromDom(!1)||this.scheme===e.scheme||(this.scheme=e.scheme,this.applyScopedColorTokens())},this.handleThemeChanged=()=>{this.syncRootFromDom(!1)&&this.applyScopedColorTokens()},this.handleIconSpriteUrlChanged=()=>{this.syncRootFromDom(!1)&&this.requestUpdate()},new E(this,{reactToSpriteChanges:!1})}traverseToClosest(e){return m(this,e)}applyScopedColorTokens(){if(!this.espRoot)return;const e=this.intentEmitsTokens?n.intentColorSources[this.intentBacker]:"";if(!e&&!this.context.trim()){this.clearScopedTokens();return}const t=this.espRoot.activeTheme;if(!t){this.clearScopedTokens();return}const r=this.resolveContextTheme(t),o=r.theme,s=w(o.seedColor);if(!s)return;const a=b(s,o),i={};if(r.applied&&(Object.assign(i,v(o,a)),Object.assign(i,I(o)),Object.assign(i,O),Object.assign(i,A),Object.assign(i,V(i,U(o,s,l=>(typeof l=="string"?D(l,o.anchors):null)??o.seedColor)))),e){let l=o;r.applied||(l=this.resolveAncestorZoneTheme(t)??o);const g=l===o?a:b(s,l),T=v(l,g,{effectiveSource:(f,h)=>n.semanticActionTokens.has(f)?e:h});i["--esp-color-primary"]=P(x(g[e]));for(const f of n.semanticActionTokens){const h=z(f);i[h]=T[h]}}this.applyScopedTokenProperties(i)}resolveContextTheme(e){const t=this.context.trim();if(!t)return{applied:!1,theme:e};const r=this.resolveNamedContextTheme(e,t);return r?{applied:!0,theme:r}:(this.warnUnknownContextWhenSettled(t),{applied:!1,theme:e})}warnUnknownContextWhenSettled(e){if(this.warnedUnknownContexts.has(e))return;const t=this.espRoot;if(t&&!t.themeSettled){t.whenThemeSettled().then(()=>{if(!this.isConnected||this.espRoot!==t||this.context.trim()!==e)return;const r=t.activeTheme;r&&y(r,e)||this.warnUnknownContextWhenSettled(e)});return}this.warnedUnknownContexts.add(e),console.warn(`Espalier context: "${e}" is not defined by the active theme; inheriting root tokens.`)}resolveNamedContextTheme(e,t){return y(e,t)}applyScopedTokenProperties(e){for(const t of this.scopedTokenOriginalValues.keys())t in e||this.restoreScopedTokenProperty(t);for(const[t,r]of Object.entries(e))this.setScopedTokenProperty(t,r)}setScopedTokenProperty(e,t){const r=this.scopedTokenOriginalValues.get(e);if(r){const o=this.style.getPropertyValue(e),s=this.style.getPropertyPriority(e);(o!==r.generatedValue||s!==r.generatedPriority)&&(r.originalValue=o.length?o:null,r.originalPriority=s),r.generatedValue=t,r.generatedPriority=""}else{const o=this.style.getPropertyValue(e);this.scopedTokenOriginalValues.set(e,{generatedPriority:"",generatedValue:t,originalPriority:this.style.getPropertyPriority(e),originalValue:o.length?o:null})}this.style.setProperty(e,t)}restoreScopedTokenProperty(e){const t=this.scopedTokenOriginalValues.get(e);if(!t)return;const r=this.style.getPropertyValue(e),o=this.style.getPropertyPriority(e);(r!==t.generatedValue||o!==t.generatedPriority)&&(t.originalValue=r.length?r:null,t.originalPriority=o),t.originalValue===null?this.style.removeProperty(e):this.style.setProperty(e,t.originalValue,t.originalPriority),this.scopedTokenOriginalValues.delete(e)}clearScopedTokens(){for(const e of[...this.scopedTokenOriginalValues.keys()])this.restoreScopedTokenProperty(e)}}n.intentColorSources={danger:"danger",info:"info",neutral:"",success:"success",warning:"warning"},n.semanticActionTokens=new Set(["actionBackground","actionText"]),n.styles=[F(".esp-field:focus-within","--esp-field-focus-shadow"),N,R`
       :host {
         
         --_esp-field-resolved-hover-bg: var(