@luzmo/lucero 2.5.2 → 2.6.0

package/standalone/slider.js

@@ -17,7 +17,7 @@
  *
  */
 
-import"./tokens.js";import{c as e,i as t,y as n}from"./chunks/lit-DWANyjiY.js";import{a as r,c as i,h as a,i as o,l as s,u as c,v as l,y as u}from"./chunks/lucero-runtime-DMlHjBe_.js";import{r as d,t as f}from"./chunks/language-resolution-BwIkGyuH.js";import{t as p}from"./chunks/class-map-E9JVium5.js";import{t as m}from"./chunks/style-map-DmBaq1-c.js";import{t as h}from"./chunks/NumberFormatter-COykocAS.js";import{t as g}from"./chunks/manage-help-text-DO3PkWgh.js";import"./chunks/number-field-Dc4nBa6l.js";import{t as _}from"./chunks/repeat-CtNle5_O.js";var v={toNormalized(e,t,n){return n===t?0:(e-t)/(n-t)},fromNormalized(e,t,n){return e*(n-t)+t}},y=(e,t)=>{let n=e;for(let[e,r]of Object.entries(t))n=n.replaceAll(`{${e}}`,r);return n},b=e=>{if(!Number.isFinite(e))return 0;let t=Math.abs(e).toString(),n=t.match(/^\d+(?:\.(?<fraction>\d+))?e(?<exponent>[+-]\d+)$/);if(n?.groups){let{fraction:e=``,exponent:t}=n.groups;return Math.min(Math.max(e.length-Number(t),0),20)}let[,r=``]=t.split(`.`);return Math.min(r.length,20)},x=(e,t)=>{let n;try{n=e()}catch{n=void 0}if(typeof n==`number`&&!Number.isNaN(n))return n;let r=t();return Number.isNaN(r)?0:r},S=(e,t)=>Number.isFinite(e)?e:t,C=(e,t,n)=>Math.min(Math.max(e,Math.min(t,n)),Math.max(t,n)),w=(e,t,n,r)=>{let i=S(t,0),a=S(n,i),o=Number.isFinite(r)&&r>0?r:1,s=Number.isNaN(e)?i:e,c=Math.max(b(o),b(i),b(a)),l=i+Math.round((C(s,i,a)-i)/o)*o;return C(Number(l.toFixed(c)),i,a)},T=(e,t,n,r=v)=>C(x(()=>r.toNormalized(e,t,n),()=>v.toNormalized(e,t,n)),0,1),E=(e,t,n,r,i=v)=>{let a=C(e,0,1);return w(x(()=>i.fromNormalized(a,t,n),()=>v.fromNormalized(a,t,n)),t,n,r)},D=(e,t,n)=>{if(!Number.isFinite(e)||!Number.isFinite(t)||!Number.isFinite(n)||n<=0||t<=e)return[];let r=Math.floor((t-e)/n)+1;if(r>250)return[];let i=Math.max(b(e),b(n));return Array.from({length:r},(t,r)=>Number((e+r*n).toFixed(i)))},O=(e,t,n,r,i=v)=>{let a=t+(n-t)/2,o=r===!0?a:r===void 0?t:r,s=T(Number.isNaN(o)?t:o,t,n,i),c=T(e,t,n,i);return[Math.min(s,c),Math.max(s,c)]},k=(e,t)=>e+(t-e)/2,A=class{constructor(e,t,n,r){this._applySingleValue=t,this._formatHandleValue=n,this._formatHandleLabel=r,this._attachedHandles=/* @__PURE__ */ new Set,this._inputMap=/* @__PURE__ */ new WeakMap,this.activeIndex=0,this.draggingIndex=-1,this._host=e,this._host.addController(this)}hostConnected(){this.invalidate(),this._syncAttachments()}hostDisconnected(){this.draggingIndex=-1,this._detachHandles(),this._inputMap=/* @__PURE__ */ new WeakMap,this._cachedModels=void 0}hostUpdate(){this._syncAttachments(),this._cachedModels=this._resolveModels()}hostUpdated(){this._syncInputReferences(),this._commitClampedValues()}get handles(){let e=this._host.shadowRoot?.querySelector(`slot[name="handle"]`);return(e?e.assignedElements():[...this._host.children]).filter(e=>e.localName===`luzmo-slider-handle`&&e.slot===`handle`)}get models(){return this._cachedModels??this._resolveModels()}get values(){return Object.fromEntries(this.models.map(({name:e,value:t})=>[e,t]))}invalidate(){this._cachedModels=void 0}requestHostUpdate(){this.invalidate(),this._host.requestUpdate()}inputForHandle(e){return this._inputMap.get(e)}setValue(e,t){let n=this.models[e];if(!n)return!1;this.activeIndex=e;let r=w(t,n.effectiveMin,n.effectiveMax,n.step);return r!==n.value&&(n.handle?n.handle.value=r:this._applySingleValue(r),this._cachedModels=this._resolveModels(),!0)}setNormalizedValue(e,t){let n=this.models[e];return n?this.setValue(e,E(t,n.min,n.max,n.step,n.normalization)):!1}nearestIndex(e){let t=this.models;return t.reduce((n,r,i)=>Math.abs(r.normalizedValue-e)<Math.abs(t[n].normalizedValue-e)?i:n,Math.min(Math.max(this.activeIndex,0),t.length-1))}reset(e){let t=this.models[e];return!t||t.defaultValue===void 0||!this.setValue(e,t.defaultValue)?!1:(this.dispatchInput(e),this.dispatchChange(e),!0)}dispatchInput(e){this._eventTarget(e).dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0}))}dispatchChange(e){this._eventTarget(e).dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0}))}formatValue(e){let t=this.models[e];return t?this._formatHandleValue(t):``}_eventTarget(e){return this.models[e]?.handle??this._host}_syncInputReferences(){this._inputMap=/* @__PURE__ */ new WeakMap;let e=this._host.shadowRoot?.querySelectorAll(`input[type="range"]`)??[];this.models.forEach((t,n)=>{t.handle&&e[n]&&this._inputMap.set(t.handle,e[n])})}_commitClampedValues(){for(let e of this.models)e.handle&&e.handle.value!==e.value&&(e.handle.value=e.value)}_syncAttachments(){let e=new Set(this._host.isConnected?this.handles:[]);for(let t of this._attachedHandles)e.has(t)||t.detachController(this);for(let t of e)t.attachController(this);this._attachedHandles=e}_detachHandles(){for(let e of this._attachedHandles)e.detachController(this);this._attachedHandles.clear()}_resolveModels(){let e=this.handles;if(e.length===0)return[this._resolveSingleModel()];let t=e.map(e=>{let t=typeof e.min==`number`&&Number.isFinite(e.min)?e.min:this._host.min,n=typeof e.max==`number`&&Number.isFinite(e.max)?e.max:this._host.max;return{min:t,max:Math.max(t,n)}}),n=e.map((e,n)=>{let{min:r,max:i}=t[n],a=this._resolveStep(e.step);return w(Number.isFinite(e.value)?e.value:k(r,i),r,i,a)}),r=/* @__PURE__ */ new Set;return e.map((i,a)=>{let{min:o,max:s}=t[a],c=this._resolveStep(i.step),l=i.min===`previous`&&a>0?Math.max(o,n[a-1]):o,u=Math.max(l,i.max===`next`&&a<e.length-1?Math.min(s,n[a+1]):s),d=w(n[a],l,u,c),f=i.normalization;return{handle:i,name:this._uniqueName(i.name,a,r),label:this._formatHandleLabel(i,a),value:d,min:o,max:s,effectiveMin:l,effectiveMax:u,step:c,defaultValue:i.defaultValue,normalizedValue:T(d,o,s,f),normalization:f}})}_resolveSingleModel(){let{min:e,max:t,step:n,normalization:r}=this._host,i=w(this._host.value,e,t,n);return{name:`value`,label:this._host.label,value:i,min:e,max:t,effectiveMin:e,effectiveMax:t,step:n,defaultValue:this._host.defaultValue,normalizedValue:T(i,e,t,r),normalization:r}}_resolveStep(e){return e!==void 0&&Number.isFinite(e)&&e>0?e:this._host.step}_uniqueName(e,t,n){let r=e||`handle${t+1}`;if(!n.has(r))return n.add(r),r;let i=t+1;for(;n.has(`${r}${i}`);)i+=1;let a=`${r}${i}`;return n.add(a),a}};function j({model:n,index:r,total:i,grouped:a,label:s,appliedLabel:c,helpTextId:l,labelVisibility:u,formattedValue:d,activeIndex:f,draggingIndex:h,focusedIndex:g,invalid:_,readonly:v,disabled:y}){let b=i>1?n.label:s||c||n.label;return e`
+import"./tokens.js";import{c as e,i as t,y as n}from"./chunks/lit-DWANyjiY.js";import{a as r,c as i,h as a,i as o,l as s,u as c,v as l,y as u}from"./chunks/lucero-runtime-DMlHjBe_.js";import{r as d,t as f}from"./chunks/language-resolution-BwIkGyuH.js";import{t as p}from"./chunks/class-map-E9JVium5.js";import{t as m}from"./chunks/style-map-DmBaq1-c.js";import{t as h}from"./chunks/NumberFormatter-COykocAS.js";import{n as g,t as _}from"./chunks/interaction-BQyflxg-.js";import{t as v}from"./chunks/manage-help-text-DO3PkWgh.js";import"./chunks/number-field-BoIKbmIv.js";import{t as y}from"./chunks/repeat-CtNle5_O.js";var b={toNormalized(e,t,n){return n===t?0:(e-t)/(n-t)},fromNormalized(e,t,n){return e*(n-t)+t}},x=(e,t)=>{let n=e;for(let[e,r]of Object.entries(t))n=n.replaceAll(`{${e}}`,r);return n},S=e=>{if(!Number.isFinite(e))return 0;let t=Math.abs(e).toString(),n=t.match(/^\d+(?:\.(?<fraction>\d+))?e(?<exponent>[+-]\d+)$/);if(n?.groups){let{fraction:e=``,exponent:t}=n.groups;return Math.min(Math.max(e.length-Number(t),0),20)}let[,r=``]=t.split(`.`);return Math.min(r.length,20)},C=(e,t)=>{let n;try{n=e()}catch{n=void 0}if(typeof n==`number`&&!Number.isNaN(n))return n;let r=t();return Number.isNaN(r)?0:r},w=(e,t)=>Number.isFinite(e)?e:t,T=(e,t,n)=>Math.min(Math.max(e,Math.min(t,n)),Math.max(t,n)),E=(e,t,n,r)=>{let i=w(t,0),a=w(n,i),o=Number.isFinite(r)&&r>0?r:1,s=Number.isNaN(e)?i:e,c=Math.max(S(o),S(i),S(a)),l=i+Math.round((T(s,i,a)-i)/o)*o;return T(Number(l.toFixed(c)),i,a)},D=(e,t,n,r=b)=>T(C(()=>r.toNormalized(e,t,n),()=>b.toNormalized(e,t,n)),0,1),O=(e,t,n,r,i=b)=>{let a=T(e,0,1);return E(C(()=>i.fromNormalized(a,t,n),()=>b.fromNormalized(a,t,n)),t,n,r)},k=(e,t,n)=>{if(!Number.isFinite(e)||!Number.isFinite(t)||!Number.isFinite(n)||n<=0||t<=e)return[];let r=Math.floor((t-e)/n)+1;if(r>250)return[];let i=Math.max(S(e),S(n));return Array.from({length:r},(t,r)=>Number((e+r*n).toFixed(i)))},A=(e,t,n,r,i=b)=>{let a=t+(n-t)/2,o=r===!0?a:r===void 0?t:r,s=D(Number.isNaN(o)?t:o,t,n,i),c=D(e,t,n,i);return[Math.min(s,c),Math.max(s,c)]},j=(e,t)=>e+(t-e)/2,M=class{constructor(e,t,n,r){this._applySingleValue=t,this._formatHandleValue=n,this._formatHandleLabel=r,this._attachedHandles=/* @__PURE__ */ new Set,this._inputMap=/* @__PURE__ */ new WeakMap,this.activeIndex=0,this.draggingIndex=-1,this._host=e,this._host.addController(this)}hostConnected(){this.invalidate(),this._syncAttachments()}hostDisconnected(){this.draggingIndex=-1,this._detachHandles(),this._inputMap=/* @__PURE__ */ new WeakMap,this._cachedModels=void 0}hostUpdate(){this._syncAttachments(),this._cachedModels=this._resolveModels()}hostUpdated(){this._syncInputReferences(),this._commitClampedValues()}get handles(){let e=this._host.shadowRoot?.querySelector(`slot[name="handle"]`);return(e?e.assignedElements():[...this._host.children]).filter(e=>e.localName===`luzmo-slider-handle`&&e.slot===`handle`)}get models(){return this._cachedModels??this._resolveModels()}get values(){return Object.fromEntries(this.models.map(({name:e,value:t})=>[e,t]))}invalidate(){this._cachedModels=void 0}requestHostUpdate(){this.invalidate(),this._host.requestUpdate()}inputForHandle(e){return this._inputMap.get(e)}setValue(e,t){let n=this.models[e];if(!n)return!1;this.activeIndex=e;let r=E(t,n.effectiveMin,n.effectiveMax,n.step);return r!==n.value&&(n.handle?n.handle.value=r:this._applySingleValue(r),this._cachedModels=this._resolveModels(),!0)}setNormalizedValue(e,t){let n=this.models[e];return n?this.setValue(e,O(t,n.min,n.max,n.step,n.normalization)):!1}nearestIndex(e){let t=this.models;return t.reduce((n,r,i)=>Math.abs(r.normalizedValue-e)<Math.abs(t[n].normalizedValue-e)?i:n,Math.min(Math.max(this.activeIndex,0),t.length-1))}reset(e){let t=this.models[e];return!t||t.defaultValue===void 0||!this.setValue(e,t.defaultValue)?!1:(this.dispatchInput(e),this.dispatchChange(e),!0)}dispatchInput(e){this._eventTarget(e).dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0}))}dispatchChange(e){this._eventTarget(e).dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0}))}formatValue(e){let t=this.models[e];return t?this._formatHandleValue(t):``}_eventTarget(e){return this.models[e]?.handle??this._host}_syncInputReferences(){this._inputMap=/* @__PURE__ */ new WeakMap;let e=this._host.shadowRoot?.querySelectorAll(`input[type="range"]`)??[];this.models.forEach((t,n)=>{t.handle&&e[n]&&this._inputMap.set(t.handle,e[n])})}_commitClampedValues(){for(let e of this.models)e.handle&&e.handle.value!==e.value&&(e.handle.value=e.value)}_syncAttachments(){let e=new Set(this._host.isConnected?this.handles:[]);for(let t of this._attachedHandles)e.has(t)||t.detachController(this);for(let t of e)t.attachController(this);this._attachedHandles=e}_detachHandles(){for(let e of this._attachedHandles)e.detachController(this);this._attachedHandles.clear()}_resolveModels(){let e=this.handles;if(e.length===0)return[this._resolveSingleModel()];let t=e.map(e=>{let t=typeof e.min==`number`&&Number.isFinite(e.min)?e.min:this._host.min,n=typeof e.max==`number`&&Number.isFinite(e.max)?e.max:this._host.max;return{min:t,max:Math.max(t,n)}}),n=e.map((e,n)=>{let{min:r,max:i}=t[n],a=this._resolveStep(e.step);return E(Number.isFinite(e.value)?e.value:j(r,i),r,i,a)}),r=/* @__PURE__ */ new Set;return e.map((i,a)=>{let{min:o,max:s}=t[a],c=this._resolveStep(i.step),l=i.min===`previous`&&a>0?Math.max(o,n[a-1]):o,u=Math.max(l,i.max===`next`&&a<e.length-1?Math.min(s,n[a+1]):s),d=E(n[a],l,u,c),f=i.normalization;return{handle:i,name:this._uniqueName(i.name,a,r),label:this._formatHandleLabel(i,a),value:d,min:o,max:s,effectiveMin:l,effectiveMax:u,step:c,defaultValue:i.defaultValue,normalizedValue:D(d,o,s,f),normalization:f}})}_resolveSingleModel(){let{min:e,max:t,step:n,normalization:r}=this._host,i=E(this._host.value,e,t,n);return{name:`value`,label:this._host.label,value:i,min:e,max:t,effectiveMin:e,effectiveMax:t,step:n,defaultValue:this._host.defaultValue,normalizedValue:D(i,e,t,r),normalization:r}}_resolveStep(e){return e!==void 0&&Number.isFinite(e)&&e>0?e:this._host.step}_uniqueName(e,t,n){let r=e||`handle${t+1}`;if(!n.has(r))return n.add(r),r;let i=t+1;for(;n.has(`${r}${i}`);)i+=1;let a=`${r}${i}`;return n.add(a),a}};function N({model:n,index:r,total:i,grouped:a,label:s,appliedLabel:c,helpTextId:l,labelVisibility:u,formattedValue:d,activeIndex:f,draggingIndex:h,focusedIndex:g,invalid:_,readonly:v,disabled:y}){let b=i>1?n.label:s||c||n.label;return e`
     <span
       class=${p({handle:!0,"tooltip-open":h===r||g===r})}
       data-handle-index=${r}
@@ -41,7 +41,7 @@ import"./tokens.js";import{c as e,i as t,y as n}from"./chunks/lit-DWANyjiY.js";i
         ?disabled=${y}
       />
     </span>
-  `}function M({model:t,label:n,formatOptions:r,size:i,disabled:a,invalid:o,readonly:s,hideStepper:c,quiet:l,indeterminate:u,onInput:d,onChange:f}){return e`
+  `}function P({model:t,label:n,formatOptions:r,size:i,disabled:a,invalid:o,readonly:s,hideStepper:c,quiet:l,indeterminate:u,onInput:d,onChange:f}){return e`
     <luzmo-number-field
       id="number-field"
       label=${n}
@@ -60,9 +60,9 @@ import"./tokens.js";import{c as e,i as t,y as n}from"./chunks/lit-DWANyjiY.js";i
       @input=${d}
       @change=${f}
     ></luzmo-number-field>
-  `}function N(n,r,i,a,o){return n.length===0?t:e`
+  `}function F(n,r,i,a,o){return n.length===0?t:e`
     <div class="ticks" aria-hidden="true">
-      ${_(n,e=>e,n=>{let s=`${T(n,r,i)*100}%`;return e`
+      ${y(n,e=>e,n=>{let s=`${D(n,r,i)*100}%`;return e`
             <span
               class="tick"
               style=${m({"inset-inline-start":s})}
@@ -74,12 +74,12 @@ import"./tokens.js";import{c as e,i as t,y as n}from"./chunks/lit-DWANyjiY.js";i
                   >`:t}
           `})}
     </div>
-  `}function P(e,t){if(e.length===0)return;if(e.length>1){let t=e.map(({normalizedValue:e})=>e).sort((e,t)=>e-t);return[t[0],t.at(-1)]}let n=e[0];return O(n.value,n.min,n.max,t,n.normalization)}function F(n,r){let i=P(n,r);if(!i)return t;let[a,o]=i;return e`
+  `}function I(e,t){if(e.length===0)return;if(e.length>1){let t=e.map(({normalizedValue:e})=>e).sort((e,t)=>e-t);return[t[0],t.at(-1)]}let n=e[0];return A(n.value,n.min,n.max,t,n.normalization)}function L(n,r){let i=I(n,r);if(!i)return t;let[a,o]=i;return e`
     <span
       class="fill"
       style=${m({"--slider-fill-start":`${a*100}%`,"--slider-fill-end":`${o*100}%`})}
     ></span>
-  `}function I(n,r,i){let[a,o]=P(n,r)??[0,0];return e`
+  `}function R(n,r,i){let[a,o]=I(n,r)??[0,0];return e`
     <span class="ramp" aria-hidden="true">
       <svg viewBox="0 0 240 16" preserveAspectRatio="none" focusable="false">
         <path
@@ -94,7 +94,7 @@ import"./tokens.js";import{c as e,i as t,y as n}from"./chunks/lit-DWANyjiY.js";i
               ></span>
             `:t}
     </span>
-  `}var L=`:host{min-inline-size:var(--luzmo-slider-min-inline-size,var(--slider-min-inline-size));min-block-size:var(--luzmo-slider-item-height,var(--slider-item-height));color:var(--slider-label-color);font-family:var(--luzmo-slider-font-family,var(--slider-font-family));flex-grow:1;display:block}:host([disabled]){cursor:not-allowed}.handle-slot{display:none}.control-row{align-items:center;gap:var(--slider-label-gap);inline-size:100%;display:flex}.track{min-inline-size:0;block-size:var(--luzmo-slider-item-height,var(--slider-item-height));cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;flex:1;position:relative}.rail,.fill,.ramp{display:block;position:absolute;inset-block-start:calc(50% + var(--luzmo-slider-top-to-track,var(--slider-top-to-track)));transform:translateY(-50%)}.rail{block-size:var(--luzmo-slider-track-height,var(--slider-track-height));background:var(--highcontrast-slider-track-color,var(--slider-track-color));border-radius:var(--slider-track-radius);inset-inline:0}.fill{z-index:1;block-size:var(--luzmo-slider-track-height,var(--slider-track-height));background:var(--highcontrast-slider-fill-color,var(--luzmo-slider-fill-background,var(--slider-fill-background)));border-radius:var(--slider-track-radius);-webkit-mask-image:linear-gradient(to right, transparent 0, transparent var(--slider-fill-start), currentColor var(--slider-fill-start), currentColor var(--slider-fill-end), transparent var(--slider-fill-end), transparent 100%);mask-image:linear-gradient(to right, transparent 0, transparent var(--slider-fill-start), currentColor var(--slider-fill-start), currentColor var(--slider-fill-end), transparent var(--slider-fill-end), transparent 100%);inset-inline:0}.ramp{block-size:var(--slider-ramp-height);inset-inline:0}:host([ramp]) .rail{display:none}.ramp svg,.ramp-fill{block-size:100%;inline-size:100%;display:block;position:absolute;inset:0}.ramp-track{fill:var(--highcontrast-slider-track-color,var(--slider-track-color))}.ramp-fill{z-index:1;background:var(--highcontrast-slider-fill-color,var(--luzmo-slider-fill-background,var(--slider-fill-background)));clip-path:polygon(0 44%,100% 0,100% 100%,0 56%);-webkit-mask-image:linear-gradient(to right, transparent 0, transparent var(--slider-ramp-fill-start), currentColor var(--slider-ramp-fill-start), currentColor calc(100% - var(--slider-ramp-fill-end)), transparent calc(100% - var(--slider-ramp-fill-end)), transparent 100%);mask-image:linear-gradient(to right, transparent 0, transparent var(--slider-ramp-fill-start), currentColor var(--slider-ramp-fill-start), currentColor calc(100% - var(--slider-ramp-fill-end)), transparent calc(100% - var(--slider-ramp-fill-end)), transparent 100%)}:host(:dir(rtl)) .ramp svg{transform:scaleX(-1)}:host(:dir(rtl)) .fill{-webkit-mask-image:linear-gradient(to left, transparent 0, transparent var(--slider-fill-start), currentColor var(--slider-fill-start), currentColor var(--slider-fill-end), transparent var(--slider-fill-end), transparent 100%);mask-image:linear-gradient(to left, transparent 0, transparent var(--slider-fill-start), currentColor var(--slider-fill-start), currentColor var(--slider-fill-end), transparent var(--slider-fill-end), transparent 100%)}:host(:dir(rtl)) .ramp-fill{clip-path:polygon(0 0,100% 44%,100% 56%,0 100%);-webkit-mask-image:linear-gradient(to left, transparent 0, transparent var(--slider-ramp-fill-start), currentColor var(--slider-ramp-fill-start), currentColor calc(100% - var(--slider-ramp-fill-end)), transparent calc(100% - var(--slider-ramp-fill-end)), transparent 100%);mask-image:linear-gradient(to left, transparent 0, transparent var(--slider-ramp-fill-start), currentColor var(--slider-ramp-fill-start), currentColor calc(100% - var(--slider-ramp-fill-end)), transparent calc(100% - var(--slider-ramp-fill-end)), transparent 100%)}.handle{box-sizing:border-box;inline-size:var(--slider-hit-size);block-size:var(--slider-hit-size);cursor:grab;place-items:center;margin-inline-start:var(--luzmo-slider-edge-to-handle,var(--slider-edge-to-handle));display:grid;position:absolute;inset-block-start:calc(50% + var(--luzmo-slider-top-to-handle,var(--slider-top-to-handle)));transform:translate(-50%,-50%)}:host(:dir(rtl)) .handle{transform:translate(50%,-50%)}.handle:before{box-sizing:border-box;inline-size:var(--slider-handle-visual-size);block-size:var(--slider-handle-visual-size);background:var(--highcontrast-slider-handle-background,var(--slider-handle-color,var(--slider-handle-background)));border:var(--slider-handle-border-width) solid var(--highcontrast-slider-handle-border-color,var(--slider-handle-color,var(--slider-handle-border-color)));box-shadow:var(--slider-handle-shadow);content:"";transition:background-color var(--luzmo-animation-duration), border-color var(--luzmo-animation-duration);border-radius:50%}:host([ramp]) .handle:before,:host([variant=unfilled]) .handle:before{border-color:var(--highcontrast-slider-handle-border-color,var(--slider-handle-color,var(--slider-handle-border-color-unfilled)))}.handle:hover:before,:host([dragging]) .handle:before{background:var(--highcontrast-slider-handle-background,var(--slider-handle-color,var(--luzmo-slider-background-color-hover,var(--slider-handle-background-hover))))}:host([dragging]) .handle:before{border-color:var(--highcontrast-slider-focus-color,var(--slider-handle-color,var(--slider-handle-border-color-active)))}:host([dragging]) .handle{cursor:grabbing}.handle:has(input:focus-visible):before{border-color:var(--highcontrast-slider-focus-color,var(--slider-focus-color));outline:var(--slider-focus-width) solid var(--highcontrast-slider-focus-color,var(--slider-focus-color));outline-offset:var(--slider-focus-offset)}.handle input{block-size:100%;inline-size:100%;cursor:inherit;opacity:0;pointer-events:none;margin:0;position:absolute;inset:0}.ticks{z-index:1;pointer-events:none;position:absolute;inset:0}.tick{inline-size:var(--slider-tick-width);block-size:var(--slider-tick-height);background:var(--highcontrast-slider-tick-color,var(--slider-tick-color));position:absolute;inset-block-start:calc(50% + var(--luzmo-slider-top-to-track,var(--slider-top-to-track)) + var(--slider-tick-offset));transform:translate(-50%)}:host(:dir(rtl)) .tick{transform:translate(50%)}.tick-label{color:var(--slider-label-color);font-size:var(--slider-tick-label-font-size);white-space:nowrap;position:absolute;inset-block-start:calc(50% + var(--luzmo-slider-top-to-handle,var(--slider-top-to-handle)) + var(--slider-handle-visual-size) / 2 + var(--slider-tick-label-gap));transform:translate(-50%)}:host(:dir(rtl)) .tick-label{transform:translate(50%)}.value-label{min-inline-size:max-content;color:var(--slider-label-color);font-size:var(--slider-label-font-size);flex:none}.value-tooltip{z-index:1;box-sizing:border-box;padding:var(--slider-tooltip-padding);color:var(--highcontrast-slider-tooltip-color,var(--slider-tooltip-color));background:var(--highcontrast-slider-tooltip-background,var(--slider-tooltip-background));border:var(--slider-tooltip-border-width) solid var(--highcontrast-slider-tooltip-border-color,var(--slider-tooltip-border-color));border-radius:var(--slider-tooltip-border-radius);font-size:var(--luzmo-slider-tooltip-font-size,var(--slider-tooltip-font-size));white-space:nowrap;visibility:hidden;opacity:0;transition:opacity var(--luzmo-animation-duration), visibility 0s linear var(--luzmo-animation-duration);pointer-events:none;line-height:1;position:absolute;inset-block-end:calc(50% + var(--slider-handle-visual-size) / 2 + var(--slider-tooltip-gap));inset-inline-start:50%;transform:translate(-50%)}:host(:dir(rtl)) .value-tooltip{transform:translate(50%)}.handle:hover .value-tooltip,.handle.tooltip-open .value-tooltip{visibility:visible;opacity:1;transition-delay:0s}:host([disabled]) .value-tooltip{visibility:hidden;opacity:0}luzmo-number-field{inline-size:var(--slider-editable-width);flex:none}.visually-hidden{inline-size:calc(var(--luzmo-spacing-1) / 2);block-size:calc(var(--luzmo-spacing-1) / 2);clip-path:inset(50%);white-space:nowrap;position:absolute;overflow:hidden}:host([readonly]:not([disabled])) .track,:host([readonly]:not([disabled])) .handle{cursor:default}:host([disabled]) .track,:host([disabled]) .handle{cursor:not-allowed}:host([disabled]) .rail{background:var(--highcontrast-slider-track-color,var(--luzmo-slider-background-color-disabled,var(--slider-track-color-disabled)))}:host([disabled]) .ramp-track{fill:var(--highcontrast-slider-track-color,var(--luzmo-slider-background-color-disabled,var(--slider-track-color-disabled)))}:host([disabled]) .ramp-fill,:host([disabled]) .fill{background:var(--highcontrast-slider-fill-color,var(--slider-fill-color-disabled))}:host([disabled]) .handle:before,:host([disabled]) .handle:hover:before{background:var(--highcontrast-slider-handle-background,var(--luzmo-slider-background-color-disabled-hover,var(--slider-handle-background-disabled)));border-color:var(--highcontrast-slider-handle-border-color,var(--slider-handle-border-color-disabled));box-shadow:none}@media (forced-colors:active){.rail{--highcontrast-slider-track-color:ButtonFace;--highcontrast-slider-track-border-color:ButtonText;border:var(--slider-handle-border-width) solid var(--highcontrast-slider-track-border-color);forced-color-adjust:none}.ramp{--highcontrast-slider-track-color:ButtonText;--highcontrast-slider-fill-color:Highlight;forced-color-adjust:none}.fill{--highcontrast-slider-fill-color:Highlight;forced-color-adjust:none}.tick{--highcontrast-slider-tick-color:ButtonText;forced-color-adjust:none}.handle:before{--highcontrast-slider-handle-background:Canvas;--highcontrast-slider-handle-border-color:ButtonText;forced-color-adjust:none}:host([dragging]) .handle:before{--highcontrast-slider-focus-color:Highlight}.handle:has(input:focus-visible):before{--highcontrast-slider-focus-color:Highlight}.value-tooltip{--highcontrast-slider-tooltip-background:Canvas;--highcontrast-slider-tooltip-border-color:CanvasText;--highcontrast-slider-tooltip-color:CanvasText;forced-color-adjust:none}:host([disabled]) .rail,:host([disabled]) .ramp-track,:host([disabled]) .ramp-fill,:host([disabled]) .tick,:host([disabled]) .fill,:host([disabled]) .handle:before{--highcontrast-slider-disabled-color:GrayText;--highcontrast-slider-track-color:var(--highcontrast-slider-disabled-color);--highcontrast-slider-track-border-color:var(--highcontrast-slider-disabled-color);--highcontrast-slider-fill-color:var(--highcontrast-slider-disabled-color);--highcontrast-slider-tick-color:var(--highcontrast-slider-disabled-color);--highcontrast-slider-handle-background:Canvas;--highcontrast-slider-handle-border-color:var(--highcontrast-slider-disabled-color)}}@media (prefers-reduced-motion:reduce){.handle:before,.value-tooltip{transition:none}}:host{--slider-font-family:var(--luzmo-font-family);--slider-min-inline-size:calc(3 * var(--luzmo-component-height-l));--slider-item-height:var(--luzmo-component-height);--slider-track-height:var(--luzmo-spacing-2);--slider-handle-base-size:calc(var(--luzmo-component-height) + var(--luzmo-spacing-2));--slider-hit-size:var(--luzmo-component-height);--slider-top-to-track:0px;--slider-top-to-handle:0px;--slider-edge-to-handle:0px;--slider-handle-scale:.5;--slider-handle-visual-size:calc(var(--luzmo-slider-handle-size,var(--slider-handle-base-size)) * var(--luzmo-slider-handle-scale,var(--slider-handle-scale)));--slider-track-radius:var(--luzmo-border-radius-full);--slider-track-color:var(--luzmo-border-color);--slider-track-color-disabled:var(--luzmo-background-color-disabled);--slider-fill-color:var(--luzmo-primary);--slider-fill-background:var(--slider-fill-color);--slider-fill-color-disabled:var(--luzmo-disabled-color);--slider-handle-background:var(--luzmo-background-color);--slider-handle-background-hover:var(--luzmo-background-color-hover);--slider-handle-background-disabled:var(--luzmo-background-color);--slider-handle-border-color:var(--luzmo-border-color);--slider-handle-border-color-unfilled:var(--luzmo-primary);--slider-handle-border-color-active:var(--luzmo-primary);--slider-handle-border-color-disabled:var(--luzmo-border-color-disabled);--slider-handle-border-width:var(--luzmo-border-width);--slider-handle-shadow:0 var(--luzmo-spacing-1) var(--luzmo-spacing-2) var(--luzmo-shadow-color);--slider-focus-color:var(--luzmo-primary);--slider-focus-width:var(--luzmo-border-width);--slider-focus-offset:var(--luzmo-border-width);--slider-label-color:var(--luzmo-font-color);--slider-label-font-size:var(--luzmo-font-size-s);--slider-label-gap:var(--luzmo-spacing-3);--slider-ramp-height:var(--luzmo-spacing-4);--slider-tick-color:var(--luzmo-border-color-full);--slider-tick-width:var(--luzmo-border-width);--slider-tick-height:var(--luzmo-spacing-3);--slider-tick-offset:calc(-1 * var(--slider-tick-height) / 2);--slider-tick-label-gap:var(--luzmo-spacing-2);--slider-tick-label-font-size:var(--luzmo-font-size-xs);--slider-tooltip-padding:var(--luzmo-spacing-2);--slider-tooltip-border-radius:calc(var(--luzmo-spacing-2) - var(--luzmo-border-width));--slider-tooltip-background:var(--luzmo-background-color);--slider-tooltip-border-color:var(--luzmo-border-color);--slider-tooltip-border-width:var(--luzmo-border-width);--slider-tooltip-color:var(--luzmo-font-color);--slider-tooltip-font-size:var(--slider-label-font-size);--slider-tooltip-gap:var(--luzmo-spacing-2);--slider-editable-width:calc(3 * var(--luzmo-component-height))}:host([ramp]){--slider-tick-height:calc(var(--slider-ramp-height) + 2 * var(--luzmo-spacing-1))}:host([size=s]){--slider-item-height:var(--luzmo-component-height-s);--slider-track-height:calc(var(--luzmo-spacing-2) - var(--luzmo-border-width));--slider-handle-base-size:var(--luzmo-component-height-s);--slider-hit-size:var(--luzmo-component-height-s);--slider-label-font-size:var(--luzmo-font-size-xs);--slider-ramp-height:var(--luzmo-spacing-3)}:host([size=l]){--slider-item-height:var(--luzmo-component-height-l);--slider-track-height:calc(var(--luzmo-spacing-3) - var(--luzmo-spacing-1));--slider-handle-base-size:var(--luzmo-component-height-l);--slider-hit-size:var(--luzmo-component-height-l);--slider-label-font-size:var(--luzmo-font-size-m);--slider-ramp-height:var(--luzmo-spacing-5)}:host([size=xl]){--slider-item-height:var(--luzmo-component-height-xl);--slider-track-height:calc(var(--luzmo-spacing-3) - var(--luzmo-border-width));--slider-handle-base-size:calc(var(--luzmo-component-height-l) + var(--luzmo-spacing-2));--slider-hit-size:var(--luzmo-component-height-xl);--slider-label-font-size:var(--luzmo-font-size-m);--slider-ramp-height:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2))}`,R={handleName:`{label} {position}`},z=16,B=/* @__PURE__ */ new Set([`filled`,`unfilled`]),V=/* @__PURE__ */ new Set([`none`,`value`]),H={fromAttribute(e){if(e===null)return;if(e===``||e===`true`)return!0;let t=Number(e);return Number.isFinite(t)?t:void 0},toAttribute(e){return e===void 0?null:e===!0?``:String(e)}},U=class extends g(i(r),{mode:`internal`,live:`polite`}){constructor(...e){super(...e),this.label=``,this.labels={},this._appliedLabel=``,this.applyFocusElementLabel=e=>{this._appliedLabel=e},this.ramp=!1,this.ticks=!1,this.tickLabels=!1,this.editable=!1,this.hideStepper=!1,this.quiet=!1,this.indeterminate=!1,this.invalid=!1,this.readonly=!1,this.formatOptions={},this._languageResolver=new f(this),this._handleController=new A(this,e=>this._applySingleValue(e),e=>this._formatHandleValue(e),(e,t)=>this._formatHandleLabel(e,t)),this._rawValue=NaN,this._rawMin=0,this._rawMax=100,this._rawStep=1,this._rawTickStep=0,this._rawVariant=`filled`,this._rawLabelVisibility=`none`,this._focusedIndex=-1,this._formatterCache=/* @__PURE__ */ new Map,this._pendingCommits=/* @__PURE__ */ new Set,this._defaultAriaHandleText=(e,t)=>t.format(e),this._defaultAriaValueText=e=>this._formatValueList([...e.values()])}static get styles(){let e=super.styles;return[...Array.isArray(e)?e:e?[e]:[],n(L)]}set value(e){let t=Number.isFinite(e)?e:NaN;if(Object.is(t,this._rawValue))return;let n=this.value;this._rawValue=t,this.requestUpdate(`value`,n)}get value(){return Number.isFinite(this._rawValue)?this._rawValue:this.min+(this.max-this.min)/2}set min(e){let t=Number.isFinite(e)?e:0;if(t===this._rawMin)return;let n=this._rawMin;this._rawMin=t,this.requestUpdate(`min`,n)}get min(){return this._rawMin}set max(e){let t=Number.isFinite(e)?e:NaN;if(Object.is(t,this._rawMax))return;let n=this.max;this._rawMax=t,this.requestUpdate(`max`,n)}get max(){return this._rawMax>this._rawMin?this._rawMax:this._rawMin+100}set step(e){let t=Number.isFinite(e)&&e>0?e:1;if(t===this._rawStep)return;let n=this._rawStep;this._rawStep=t,this.requestUpdate(`step`,n)}get step(){return this._rawStep}set variant(e){let t=B.has(e)?e:`filled`;if(t===this._rawVariant)return;let n=this._rawVariant;this._rawVariant=t,this.requestUpdate(`variant`,n)}get variant(){return this._rawVariant}set labelVisibility(e){let t=V.has(e)?e:`none`;if(t===this._rawLabelVisibility)return;let n=this._rawLabelVisibility;this._rawLabelVisibility=t,this.requestUpdate(`labelVisibility`,n)}get labelVisibility(){return this._rawLabelVisibility}set tickStep(e){let t=Number.isFinite(e)&&e>0?e:0;if(t===this._rawTickStep)return;let n=this._rawTickStep;this._rawTickStep=t,this.requestUpdate(`tickStep`,n)}get tickStep(){return this._rawTickStep}set normalization(e){let t=this.normalization;this._normalization=e,this.requestUpdate(`normalization`,t)}get normalization(){return this._normalization??v}set getAriaHandleText(e){let t=this.getAriaHandleText;this._getAriaHandleText=e,this.requestUpdate(`getAriaHandleText`,t)}get getAriaHandleText(){return this._getAriaHandleText??this._defaultAriaHandleText}set getAriaValueText(e){let t=this.getAriaValueText;this._getAriaValueText=e,this.requestUpdate(`getAriaValueText`,t)}get getAriaValueText(){return this._getAriaValueText??this._defaultAriaValueText}get values(){return this._handleController.values}get focusElement(){return this.rangeInputs?.[Math.min(Math.max(this._handleController.activeIndex,0),this.rangeInputs.length-1)]??this}_applySingleValue(e){this.value=e}_normalizeRawValue(){if(!Number.isFinite(this._rawValue))return;let e=this._rawValue,t=w(this._rawValue,this.min,this.max,this.step);Object.is(t,this._rawValue)||(this._rawValue=t,this.requestUpdate(`value`,e))}_formatHandleValue(e){let t=e.handle?.formatOptions??this.formatOptions;return(e.handle?.getAriaHandleText??this.getAriaHandleText)(e.value,this._numberFormatter(this._withDefaultPrecision(t,e.step,e.min,e.max)))}_formatHandleLabel(e,t){if(e.label)return e.label;if(e.name)return e.name;let n=this.label||this._appliedLabel,r=this._numberFormatter({useGrouping:!1}).format(t+1);return n?y(this.labels.handleName??R.handleName,{label:n,position:r}):r}disconnectedCallback(){this._endDrag(),this._focusedIndex=-1,this._pendingCommits.clear(),super.disconnectedCallback()}_numberFormatter(e=this.formatOptions){let t=this._languageResolver.language;this._formatterCacheLanguage!==t&&(this._formatterCache.clear(),this._formatterCacheLanguage=t);let n=JSON.stringify(e??{}),r=this._formatterCache.get(n);if(r)return r;let i=this._createNumberFormatter(t,e??{});return this._formatterCache.size>=z&&this._formatterCache.clear(),this._formatterCache.set(n,i),i}_withDefaultPrecision(e,...t){return e.style!==void 0||e.minimumFractionDigits!==void 0||e.maximumFractionDigits!==void 0||e.minimumSignificantDigits!==void 0||e.maximumSignificantDigits!==void 0?e:{...e,maximumFractionDigits:Math.min(20,Math.max(...t.map(e=>b(e))))}}_createNumberFormatter(e,t){try{let n=new h(e,t);return n.format(1),n}catch{let{style:n,unit:r,...i}=t;return new h(e,i)}}_clearNumberFormatterCache(){this._formatterCache.clear(),this._formatterCacheLanguage=void 0}_formatValueList(e){if(e.length<2)return e[0]??``;try{return new Intl.ListFormat(this._languageResolver.language,{style:`short`,type:`unit`}).format(e)}catch{return e.join(`, `)}}get _formattedValues(){return new Map(this._handleController.models.map((e,t)=>[e.name,this._handleController.formatValue(t)]))}get _combinedValueText(){return this.getAriaValueText(this._formattedValues)}handleSlotChange(){this._handleController.draggingIndex>=0&&this._endDrag(),this._handleController.activeIndex=0,this._focusedIndex=-1,this._handleController.invalidate(),this.requestUpdate()}_normalizedPointerValue(e){let t=e.currentTarget.getBoundingClientRect(),n=t.width?(e.clientX-t.left)/t.width:0,r=this.isLTR?n:1-n;return Math.min(1,Math.max(0,r))}_capturePointer(e,t){try{e.setPointerCapture(t),this._capturedPointer={target:e,pointerId:t}}catch{this._capturedPointer=void 0}}_releaseCapturedPointer(){let e=this._capturedPointer;this._capturedPointer=void 0,e&&e.target.hasPointerCapture(e.pointerId)&&e.target.releasePointerCapture(e.pointerId)}_endDrag(){let e=this._handleController.draggingIndex;return this._releaseCapturedPointer(),this._handleController.draggingIndex=-1,this._dragStartValue=void 0,this.toggleAttribute(`dragging`,!1),e}handlePointerDown(e){if(this.disabled||this.readonly||e.button!==0)return;let t=e.currentTarget,n=e.target.closest(`[data-handle-index]`),r=this._normalizedPointerValue(e),i=n?Number(n.dataset.handleIndex):this._handleController.nearestIndex(r);this._handleController.activeIndex=i,this._handleController.draggingIndex=i,this._dragStartValue=this._handleController.models[i]?.value,this.toggleAttribute(`dragging`,!0),this._capturePointer(t,e.pointerId),this.indeterminate=!1,this._handleController.setNormalizedValue(i,r)&&this._handleController.dispatchInput(i),this.requestUpdate()}handlePointerMove(e){let t=this._handleController.draggingIndex;t<0||this.disabled||this.readonly||this._handleController.setNormalizedValue(t,this._normalizedPointerValue(e))&&(this._handleController.dispatchInput(t),this.requestUpdate())}handlePointerUp(){if(this._handleController.draggingIndex<0)return;let e=this._dragStartValue,t=this._endDrag();!this.disabled&&!this.readonly&&(this._handleController.models[t]?.value!==e&&this._handleController.dispatchChange(t),this.rangeInputs[t]?.focus({preventScroll:!0})),this.requestUpdate()}handleLostPointerCapture(){this.handlePointerCancel()}handlePointerCancel(){if(this._handleController.draggingIndex<0)return;let e=this._dragStartValue,t=this._endDrag();e!==void 0&&this._handleController.setValue(t,e)&&this._handleController.dispatchInput(t),this.requestUpdate()}_applyInputValue(e,t){Number.isFinite(t)&&(this.indeterminate=!1,this._handleController.setValue(e,t)&&(this._pendingCommits.add(e),this._handleController.dispatchInput(e)))}_commitValue(e,t){let n=Number.isFinite(t)&&this._handleController.setValue(e,t),r=this._pendingCommits.delete(e);(n||r)&&(this.indeterminate=!1,this._handleController.dispatchChange(e))}handleNativeInput(e,t){e.stopPropagation();let n=e.target;this.readonly?n.value=String(this._handleController.models[t]?.value):this._applyInputValue(t,n.valueAsNumber)}handleNativeChange(e,t){e.stopPropagation();let n=e.target;this.readonly?n.value=String(this._handleController.models[t]?.value):this._commitValue(t,n.valueAsNumber)}handleKeyDown(e,t){let n=this._handleController.models[t];if(!n||this.disabled)return;if(this.readonly){[`ArrowUp`,`ArrowDown`,`ArrowRight`,`ArrowLeft`,`Home`,`End`,`PageUp`,`PageDown`].includes(e.key)&&e.preventDefault();return}if(e.key===`Escape`){this._handleController.reset(t)&&(e.preventDefault(),e.stopPropagation(),this.requestUpdate());return}let r=e=>n.value+n.step*e,i=this.isLTR?1:-1,a;switch(e.key){case`ArrowUp`:a=r(1);break;case`ArrowDown`:a=r(-1);break;case`ArrowRight`:a=r(i);break;case`ArrowLeft`:a=r(-i);break;case`Home`:a=n.effectiveMin;break;case`End`:a=n.effectiveMax;break;case`PageUp`:a=r(5);break;case`PageDown`:a=r(-5);break;default:return}e.preventDefault(),e.stopPropagation(),this.indeterminate=!1,this._handleController.setValue(t,a)&&(this._handleController.dispatchInput(t),this._handleController.dispatchChange(t),this.requestUpdate())}handleTrackInput(e){let t=e.target;this.handleNativeInput(e,Number(t.dataset.handleIndex))}handleTrackChange(e){let t=e.target;this.handleNativeChange(e,Number(t.dataset.handleIndex))}handleTrackKeyDown(e){let t=e.target;this.handleKeyDown(e,Number(t.dataset.handleIndex))}handleTrackFocusIn(e){let t=e.target,n=Number(t.dataset.handleIndex);this._handleController.activeIndex=n,this._focusedIndex=n}handleTrackFocusOut(e){let t=e.target;this._focusedIndex===Number(t.dataset.handleIndex)&&(this._focusedIndex=-1)}handleTrackDoubleClick(e){let t=e.target.closest(`[data-handle-index]`);!t||this.disabled||this.readonly||(e.preventDefault(),this._handleController.reset(Number(t.dataset.handleIndex)))}handleNumberInput(e){if(e.stopPropagation(),this.readonly)return;let t=e.currentTarget;this._applyInputValue(0,t.value)}handleNumberChange(e){if(e.stopPropagation(),this.readonly)return;let t=e.currentTarget;this._commitValue(0,t.value)}get _hasFill(){return this.variant!==`unfilled`}_renderTicks(){if(!this.ticks)return t;let e=this.tickStep||this.step,n=D(this.min,this.max,e),r=this._numberFormatter(this._withDefaultPrecision(this.formatOptions,e,this.min,this.max));return N(n,this.min,this.max,r,this.tickLabels)}_renderFill(e){return!this._hasFill||this.ramp?t:F(e,this.fillStart)}render(){let n=this._handleController.models,r=this.labelVisibility===`value`,i=this.editable&&n.length===1?n[0]:void 0,a=n.length>1||i!==void 0,s=_(n,({name:e})=>e,(e,t)=>j({model:e,index:t,total:n.length,grouped:a,label:this.label,appliedLabel:this._appliedLabel,helpTextId:this.helpTextId,labelVisibility:this.labelVisibility,formattedValue:this._handleController.formatValue(t),activeIndex:this._handleController.activeIndex,draggingIndex:this._handleController.draggingIndex,focusedIndex:this._focusedIndex,invalid:this.invalid,readonly:this.readonly,disabled:this.disabled}));return e`
+  `}var z=`:host{min-inline-size:var(--luzmo-slider-min-inline-size,var(--slider-min-inline-size));min-block-size:var(--luzmo-slider-item-height,var(--slider-item-height));color:var(--slider-label-color);font-family:var(--luzmo-slider-font-family,var(--slider-font-family));flex-grow:1;display:block}:host([disabled]){cursor:not-allowed}.handle-slot{display:none}.control-row{align-items:center;gap:var(--slider-label-gap);inline-size:100%;display:flex}.track{min-inline-size:0;block-size:var(--luzmo-slider-item-height,var(--slider-item-height));cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;flex:1;position:relative}.rail,.fill,.ramp{display:block;position:absolute;inset-block-start:calc(50% + var(--luzmo-slider-top-to-track,var(--slider-top-to-track)));transform:translateY(-50%)}.rail{block-size:var(--luzmo-slider-track-height,var(--slider-track-height));background:var(--highcontrast-slider-track-color,var(--slider-track-color));border-radius:var(--slider-track-radius);inset-inline:0}.fill{z-index:1;block-size:var(--luzmo-slider-track-height,var(--slider-track-height));background:var(--highcontrast-slider-fill-color,var(--luzmo-slider-fill-background,var(--slider-fill-background)));border-radius:var(--slider-track-radius);-webkit-mask-image:linear-gradient(to right, transparent 0, transparent var(--slider-fill-start), currentColor var(--slider-fill-start), currentColor var(--slider-fill-end), transparent var(--slider-fill-end), transparent 100%);mask-image:linear-gradient(to right, transparent 0, transparent var(--slider-fill-start), currentColor var(--slider-fill-start), currentColor var(--slider-fill-end), transparent var(--slider-fill-end), transparent 100%);inset-inline:0}.ramp{block-size:var(--slider-ramp-height);inset-inline:0}:host([ramp]) .rail{display:none}.ramp svg,.ramp-fill{block-size:100%;inline-size:100%;display:block;position:absolute;inset:0}.ramp-track{fill:var(--highcontrast-slider-track-color,var(--slider-track-color))}.ramp-fill{z-index:1;background:var(--highcontrast-slider-fill-color,var(--luzmo-slider-fill-background,var(--slider-fill-background)));clip-path:polygon(0 44%,100% 0,100% 100%,0 56%);-webkit-mask-image:linear-gradient(to right, transparent 0, transparent var(--slider-ramp-fill-start), currentColor var(--slider-ramp-fill-start), currentColor calc(100% - var(--slider-ramp-fill-end)), transparent calc(100% - var(--slider-ramp-fill-end)), transparent 100%);mask-image:linear-gradient(to right, transparent 0, transparent var(--slider-ramp-fill-start), currentColor var(--slider-ramp-fill-start), currentColor calc(100% - var(--slider-ramp-fill-end)), transparent calc(100% - var(--slider-ramp-fill-end)), transparent 100%)}:host(:dir(rtl)) .ramp svg{transform:scaleX(-1)}:host(:dir(rtl)) .fill{-webkit-mask-image:linear-gradient(to left, transparent 0, transparent var(--slider-fill-start), currentColor var(--slider-fill-start), currentColor var(--slider-fill-end), transparent var(--slider-fill-end), transparent 100%);mask-image:linear-gradient(to left, transparent 0, transparent var(--slider-fill-start), currentColor var(--slider-fill-start), currentColor var(--slider-fill-end), transparent var(--slider-fill-end), transparent 100%)}:host(:dir(rtl)) .ramp-fill{clip-path:polygon(0 0,100% 44%,100% 56%,0 100%);-webkit-mask-image:linear-gradient(to left, transparent 0, transparent var(--slider-ramp-fill-start), currentColor var(--slider-ramp-fill-start), currentColor calc(100% - var(--slider-ramp-fill-end)), transparent calc(100% - var(--slider-ramp-fill-end)), transparent 100%);mask-image:linear-gradient(to left, transparent 0, transparent var(--slider-ramp-fill-start), currentColor var(--slider-ramp-fill-start), currentColor calc(100% - var(--slider-ramp-fill-end)), transparent calc(100% - var(--slider-ramp-fill-end)), transparent 100%)}.handle{box-sizing:border-box;inline-size:var(--slider-hit-size);block-size:var(--slider-hit-size);cursor:grab;place-items:center;margin-inline-start:var(--luzmo-slider-edge-to-handle,var(--slider-edge-to-handle));display:grid;position:absolute;inset-block-start:calc(50% + var(--luzmo-slider-top-to-handle,var(--slider-top-to-handle)));transform:translate(-50%,-50%)}:host(:dir(rtl)) .handle{transform:translate(50%,-50%)}.handle:before{box-sizing:border-box;inline-size:var(--slider-handle-visual-size);block-size:var(--slider-handle-visual-size);background:var(--highcontrast-slider-handle-background,var(--slider-handle-color,var(--slider-handle-background)));border:var(--slider-handle-border-width) solid var(--highcontrast-slider-handle-border-color,var(--slider-handle-color,var(--slider-handle-border-color)));box-shadow:var(--slider-handle-shadow);content:"";transition:background-color var(--luzmo-animation-duration), border-color var(--luzmo-animation-duration);border-radius:50%}:host([ramp]) .handle:before,:host([variant=unfilled]) .handle:before{border-color:var(--highcontrast-slider-handle-border-color,var(--slider-handle-color,var(--slider-handle-border-color-unfilled)))}.handle:hover:before,:host([dragging]) .handle:before{background:var(--highcontrast-slider-handle-background,var(--slider-handle-color,var(--luzmo-slider-background-color-hover,var(--slider-handle-background-hover))))}:host([dragging]) .handle:before{border-color:var(--highcontrast-slider-focus-color,var(--slider-handle-color,var(--slider-handle-border-color-active)))}:host([dragging]) .handle{cursor:grabbing}.handle:has(input:focus-visible):before{border-color:var(--highcontrast-slider-focus-color,var(--slider-focus-color));outline:var(--slider-focus-width) solid var(--highcontrast-slider-focus-color,var(--slider-focus-color));outline-offset:var(--slider-focus-offset)}.handle input{block-size:100%;inline-size:100%;cursor:inherit;opacity:0;pointer-events:none;margin:0;position:absolute;inset:0}.ticks{z-index:1;pointer-events:none;position:absolute;inset:0}.tick{inline-size:var(--slider-tick-width);block-size:var(--slider-tick-height);background:var(--highcontrast-slider-tick-color,var(--slider-tick-color));position:absolute;inset-block-start:calc(50% + var(--luzmo-slider-top-to-track,var(--slider-top-to-track)) + var(--slider-tick-offset));transform:translate(-50%)}:host(:dir(rtl)) .tick{transform:translate(50%)}.tick-label{color:var(--slider-label-color);font-size:var(--slider-tick-label-font-size);white-space:nowrap;position:absolute;inset-block-start:calc(50% + var(--luzmo-slider-top-to-handle,var(--slider-top-to-handle)) + var(--slider-handle-visual-size) / 2 + var(--slider-tick-label-gap));transform:translate(-50%)}:host(:dir(rtl)) .tick-label{transform:translate(50%)}.value-label{min-inline-size:max-content;color:var(--slider-label-color);font-size:var(--slider-label-font-size);flex:none}.value-tooltip{z-index:1;box-sizing:border-box;padding:var(--slider-tooltip-padding);color:var(--highcontrast-slider-tooltip-color,var(--slider-tooltip-color));background:var(--highcontrast-slider-tooltip-background,var(--slider-tooltip-background));border:var(--slider-tooltip-border-width) solid var(--highcontrast-slider-tooltip-border-color,var(--slider-tooltip-border-color));border-radius:var(--slider-tooltip-border-radius);font-size:var(--luzmo-slider-tooltip-font-size,var(--slider-tooltip-font-size));white-space:nowrap;visibility:hidden;opacity:0;transition:opacity var(--luzmo-animation-duration), visibility 0s linear var(--luzmo-animation-duration);pointer-events:none;line-height:1;position:absolute;inset-block-end:calc(50% + var(--slider-handle-visual-size) / 2 + var(--slider-tooltip-gap));inset-inline-start:50%;transform:translate(-50%)}:host(:dir(rtl)) .value-tooltip{transform:translate(50%)}.handle:hover .value-tooltip,.handle.tooltip-open .value-tooltip{visibility:visible;opacity:1;transition-delay:0s}:host([disabled]) .value-tooltip{visibility:hidden;opacity:0}luzmo-number-field{inline-size:var(--slider-editable-width);flex:none}.visually-hidden{inline-size:calc(var(--luzmo-spacing-1) / 2);block-size:calc(var(--luzmo-spacing-1) / 2);clip-path:inset(50%);white-space:nowrap;position:absolute;overflow:hidden}:host([readonly]:not([disabled])) .track,:host([readonly]:not([disabled])) .handle{cursor:default}:host([disabled]) .track,:host([disabled]) .handle{cursor:not-allowed}:host([disabled]) .rail{background:var(--highcontrast-slider-track-color,var(--luzmo-slider-background-color-disabled,var(--slider-track-color-disabled)))}:host([disabled]) .ramp-track{fill:var(--highcontrast-slider-track-color,var(--luzmo-slider-background-color-disabled,var(--slider-track-color-disabled)))}:host([disabled]) .ramp-fill,:host([disabled]) .fill{background:var(--highcontrast-slider-fill-color,var(--slider-fill-color-disabled))}:host([disabled]) .handle:before,:host([disabled]) .handle:hover:before{background:var(--highcontrast-slider-handle-background,var(--luzmo-slider-background-color-disabled-hover,var(--slider-handle-background-disabled)));border-color:var(--highcontrast-slider-handle-border-color,var(--slider-handle-border-color-disabled));box-shadow:none}@media (forced-colors:active){.rail{--highcontrast-slider-track-color:ButtonFace;--highcontrast-slider-track-border-color:ButtonText;border:var(--slider-handle-border-width) solid var(--highcontrast-slider-track-border-color);forced-color-adjust:none}.ramp{--highcontrast-slider-track-color:ButtonText;--highcontrast-slider-fill-color:Highlight;forced-color-adjust:none}.fill{--highcontrast-slider-fill-color:Highlight;forced-color-adjust:none}.tick{--highcontrast-slider-tick-color:ButtonText;forced-color-adjust:none}.handle:before{--highcontrast-slider-handle-background:Canvas;--highcontrast-slider-handle-border-color:ButtonText;forced-color-adjust:none}:host([dragging]) .handle:before{--highcontrast-slider-focus-color:Highlight}.handle:has(input:focus-visible):before{--highcontrast-slider-focus-color:Highlight}.value-tooltip{--highcontrast-slider-tooltip-background:Canvas;--highcontrast-slider-tooltip-border-color:CanvasText;--highcontrast-slider-tooltip-color:CanvasText;forced-color-adjust:none}:host([disabled]) .rail,:host([disabled]) .ramp-track,:host([disabled]) .ramp-fill,:host([disabled]) .tick,:host([disabled]) .fill,:host([disabled]) .handle:before{--highcontrast-slider-disabled-color:GrayText;--highcontrast-slider-track-color:var(--highcontrast-slider-disabled-color);--highcontrast-slider-track-border-color:var(--highcontrast-slider-disabled-color);--highcontrast-slider-fill-color:var(--highcontrast-slider-disabled-color);--highcontrast-slider-tick-color:var(--highcontrast-slider-disabled-color);--highcontrast-slider-handle-background:Canvas;--highcontrast-slider-handle-border-color:var(--highcontrast-slider-disabled-color)}}@media (prefers-reduced-motion:reduce){.handle:before,.value-tooltip{transition:none}}:host{--slider-font-family:var(--luzmo-font-family);--slider-min-inline-size:calc(3 * var(--luzmo-component-height-l));--slider-item-height:var(--luzmo-component-height);--slider-track-height:var(--luzmo-spacing-2);--slider-handle-base-size:calc(var(--luzmo-component-height) + var(--luzmo-spacing-2));--slider-hit-size:var(--luzmo-component-height);--slider-top-to-track:0px;--slider-top-to-handle:0px;--slider-edge-to-handle:0px;--slider-handle-scale:.5;--slider-handle-visual-size:calc(var(--luzmo-slider-handle-size,var(--slider-handle-base-size)) * var(--luzmo-slider-handle-scale,var(--slider-handle-scale)));--slider-track-radius:var(--luzmo-border-radius-full);--slider-track-color:var(--luzmo-border-color);--slider-track-color-disabled:var(--luzmo-background-color-disabled);--slider-fill-color:var(--luzmo-primary);--slider-fill-background:var(--slider-fill-color);--slider-fill-color-disabled:var(--luzmo-disabled-color);--slider-handle-background:var(--luzmo-background-color);--slider-handle-background-hover:var(--luzmo-background-color-hover);--slider-handle-background-disabled:var(--luzmo-background-color);--slider-handle-border-color:var(--luzmo-border-color);--slider-handle-border-color-unfilled:var(--luzmo-primary);--slider-handle-border-color-active:var(--luzmo-primary);--slider-handle-border-color-disabled:var(--luzmo-border-color-disabled);--slider-handle-border-width:var(--luzmo-border-width);--slider-handle-shadow:0 var(--luzmo-spacing-1) var(--luzmo-spacing-2) var(--luzmo-shadow-color);--slider-focus-color:var(--luzmo-primary);--slider-focus-width:var(--luzmo-border-width);--slider-focus-offset:var(--luzmo-border-width);--slider-label-color:var(--luzmo-font-color);--slider-label-font-size:var(--luzmo-font-size-s);--slider-label-gap:var(--luzmo-spacing-3);--slider-ramp-height:var(--luzmo-spacing-4);--slider-tick-color:var(--luzmo-border-color-full);--slider-tick-width:var(--luzmo-border-width);--slider-tick-height:var(--luzmo-spacing-3);--slider-tick-offset:calc(-1 * var(--slider-tick-height) / 2);--slider-tick-label-gap:var(--luzmo-spacing-2);--slider-tick-label-font-size:var(--luzmo-font-size-xs);--slider-tooltip-padding:var(--luzmo-spacing-2);--slider-tooltip-border-radius:calc(var(--luzmo-spacing-2) - var(--luzmo-border-width));--slider-tooltip-background:var(--luzmo-background-color);--slider-tooltip-border-color:var(--luzmo-border-color);--slider-tooltip-border-width:var(--luzmo-border-width);--slider-tooltip-color:var(--luzmo-font-color);--slider-tooltip-font-size:var(--slider-label-font-size);--slider-tooltip-gap:var(--luzmo-spacing-2);--slider-editable-width:calc(3 * var(--luzmo-component-height))}:host([ramp]){--slider-tick-height:calc(var(--slider-ramp-height) + 2 * var(--luzmo-spacing-1))}:host([size=s]){--slider-item-height:var(--luzmo-component-height-s);--slider-track-height:calc(var(--luzmo-spacing-2) - var(--luzmo-border-width));--slider-handle-base-size:var(--luzmo-component-height-s);--slider-hit-size:var(--luzmo-component-height-s);--slider-label-font-size:var(--luzmo-font-size-xs);--slider-ramp-height:var(--luzmo-spacing-3)}:host([size=l]){--slider-item-height:var(--luzmo-component-height-l);--slider-track-height:calc(var(--luzmo-spacing-3) - var(--luzmo-spacing-1));--slider-handle-base-size:var(--luzmo-component-height-l);--slider-hit-size:var(--luzmo-component-height-l);--slider-label-font-size:var(--luzmo-font-size-m);--slider-ramp-height:var(--luzmo-spacing-5)}:host([size=xl]){--slider-item-height:var(--luzmo-component-height-xl);--slider-track-height:calc(var(--luzmo-spacing-3) - var(--luzmo-border-width));--slider-handle-base-size:calc(var(--luzmo-component-height-l) + var(--luzmo-spacing-2));--slider-hit-size:var(--luzmo-component-height-xl);--slider-label-font-size:var(--luzmo-font-size-m);--slider-ramp-height:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2))}`,B={handleName:`{label} {position}`},V=16,H=/* @__PURE__ */ new Set([`filled`,`unfilled`]),U=/* @__PURE__ */ new Set([`none`,`value`]),W={fromAttribute(e){if(e===null)return;if(e===``||e===`true`)return!0;let t=Number(e);return Number.isFinite(t)?t:void 0},toAttribute(e){return e===void 0?null:e===!0?``:String(e)}},G=class extends v(i(r),{mode:`internal`,live:`polite`}){constructor(...e){super(...e),this.label=``,this.labels={},this._appliedLabel=``,this.applyFocusElementLabel=e=>{this._appliedLabel=e},this.ramp=!1,this.ticks=!1,this.tickLabels=!1,this.editable=!1,this.hideStepper=!1,this.quiet=!1,this.indeterminate=!1,this.invalid=!1,this.readonly=!1,this.formatOptions={},this._languageResolver=new f(this),this._handleController=new M(this,e=>this._applySingleValue(e),e=>this._formatHandleValue(e),(e,t)=>this._formatHandleLabel(e,t)),this._interaction=new _(this,{value:e=>e?this.values[e]:void 0}),this._rawValue=NaN,this._rawMin=0,this._rawMax=100,this._rawStep=1,this._rawTickStep=0,this._rawVariant=`filled`,this._rawLabelVisibility=`none`,this._focusedIndex=-1,this._formatterCache=/* @__PURE__ */ new Map,this._pendingCommits=/* @__PURE__ */ new Set,this._defaultAriaHandleText=(e,t)=>t.format(e),this._defaultAriaValueText=e=>this._formatValueList([...e.values()])}static get styles(){let e=super.styles;return[...Array.isArray(e)?e:e?[e]:[],n(z)]}set value(e){let t=Number.isFinite(e)?e:NaN;if(Object.is(t,this._rawValue))return;let n=this.value;this._rawValue=t,this.requestUpdate(`value`,n)}get value(){return Number.isFinite(this._rawValue)?this._rawValue:this.min+(this.max-this.min)/2}set min(e){let t=Number.isFinite(e)?e:0;if(t===this._rawMin)return;let n=this._rawMin;this._rawMin=t,this.requestUpdate(`min`,n)}get min(){return this._rawMin}set max(e){let t=Number.isFinite(e)?e:NaN;if(Object.is(t,this._rawMax))return;let n=this.max;this._rawMax=t,this.requestUpdate(`max`,n)}get max(){return this._rawMax>this._rawMin?this._rawMax:this._rawMin+100}set step(e){let t=Number.isFinite(e)&&e>0?e:1;if(t===this._rawStep)return;let n=this._rawStep;this._rawStep=t,this.requestUpdate(`step`,n)}get step(){return this._rawStep}set variant(e){let t=H.has(e)?e:`filled`;if(t===this._rawVariant)return;let n=this._rawVariant;this._rawVariant=t,this.requestUpdate(`variant`,n)}get variant(){return this._rawVariant}set labelVisibility(e){let t=U.has(e)?e:`none`;if(t===this._rawLabelVisibility)return;let n=this._rawLabelVisibility;this._rawLabelVisibility=t,this.requestUpdate(`labelVisibility`,n)}get labelVisibility(){return this._rawLabelVisibility}set tickStep(e){let t=Number.isFinite(e)&&e>0?e:0;if(t===this._rawTickStep)return;let n=this._rawTickStep;this._rawTickStep=t,this.requestUpdate(`tickStep`,n)}get tickStep(){return this._rawTickStep}set normalization(e){let t=this.normalization;this._normalization=e,this.requestUpdate(`normalization`,t)}get normalization(){return this._normalization??b}set getAriaHandleText(e){let t=this.getAriaHandleText;this._getAriaHandleText=e,this.requestUpdate(`getAriaHandleText`,t)}get getAriaHandleText(){return this._getAriaHandleText??this._defaultAriaHandleText}set getAriaValueText(e){let t=this.getAriaValueText;this._getAriaValueText=e,this.requestUpdate(`getAriaValueText`,t)}get getAriaValueText(){return this._getAriaValueText??this._defaultAriaValueText}get values(){return this._handleController.values}get focusElement(){return this.rangeInputs?.[Math.min(Math.max(this._handleController.activeIndex,0),this.rangeInputs.length-1)]??this}_applySingleValue(e){this.value=e}_normalizeRawValue(){if(!Number.isFinite(this._rawValue))return;let e=this._rawValue,t=E(this._rawValue,this.min,this.max,this.step);Object.is(t,this._rawValue)||(this._rawValue=t,this.requestUpdate(`value`,e))}_formatHandleValue(e){let t=e.handle?.formatOptions??this.formatOptions;return(e.handle?.getAriaHandleText??this.getAriaHandleText)(e.value,this._numberFormatter(this._withDefaultPrecision(t,e.step,e.min,e.max)))}_formatHandleLabel(e,t){if(e.label)return e.label;if(e.name)return e.name;let n=this.label||this._appliedLabel,r=this._numberFormatter({useGrouping:!1}).format(t+1);return n?x(this.labels.handleName??B.handleName,{label:n,position:r}):r}disconnectedCallback(){this._endDrag(),this._focusedIndex=-1,this._pendingCommits.clear(),super.disconnectedCallback()}_numberFormatter(e=this.formatOptions){let t=this._languageResolver.language;this._formatterCacheLanguage!==t&&(this._formatterCache.clear(),this._formatterCacheLanguage=t);let n=JSON.stringify(e??{}),r=this._formatterCache.get(n);if(r)return r;let i=this._createNumberFormatter(t,e??{});return this._formatterCache.size>=V&&this._formatterCache.clear(),this._formatterCache.set(n,i),i}_withDefaultPrecision(e,...t){return e.style!==void 0||e.minimumFractionDigits!==void 0||e.maximumFractionDigits!==void 0||e.minimumSignificantDigits!==void 0||e.maximumSignificantDigits!==void 0?e:{...e,maximumFractionDigits:Math.min(20,Math.max(...t.map(e=>S(e))))}}_createNumberFormatter(e,t){try{let n=new h(e,t);return n.format(1),n}catch{let{style:n,unit:r,...i}=t;return new h(e,i)}}_clearNumberFormatterCache(){this._formatterCache.clear(),this._formatterCacheLanguage=void 0}_formatValueList(e){if(e.length<2)return e[0]??``;try{return new Intl.ListFormat(this._languageResolver.language,{style:`short`,type:`unit`}).format(e)}catch{return e.join(`, `)}}get _formattedValues(){return new Map(this._handleController.models.map((e,t)=>[e.name,this._handleController.formatValue(t)]))}get _combinedValueText(){return this.getAriaValueText(this._formattedValues)}handleSlotChange(){this._handleController.draggingIndex>=0&&this._endDrag(),this._interaction.end(),this._handleController.activeIndex=0,this._focusedIndex=-1,this._handleController.invalidate(),this.requestUpdate()}_normalizedPointerValue(e){let t=e.currentTarget.getBoundingClientRect(),n=t.width?(e.clientX-t.left)/t.width:0,r=this.isLTR?n:1-n;return Math.min(1,Math.max(0,r))}_capturePointer(e,t){try{e.setPointerCapture(t),this._capturedPointer={target:e,pointerId:t}}catch{this._capturedPointer=void 0}}_releaseCapturedPointer(){let e=this._capturedPointer;this._capturedPointer=void 0,e&&e.target.hasPointerCapture(e.pointerId)&&e.target.releasePointerCapture(e.pointerId)}_endDrag(){let e=this._handleController.draggingIndex;return this._releaseCapturedPointer(),this._handleController.draggingIndex=-1,this._dragPointerId=void 0,this._dragStartValue=void 0,this.toggleAttribute(`dragging`,!1),e}handlePointerDown(e){if(this.disabled||this.readonly||e.button!==0)return;this._finishDrag(!1);let t=e.currentTarget,n=e.target.closest(`[data-handle-index]`),r=this._normalizedPointerValue(e),i=n?Number(n.dataset.handleIndex):this._handleController.nearestIndex(r);this._interaction.start(g(e),this._handleController.models[i]?.name)&&(this.disabled||this.readonly?this._interaction.end():(this._handleController.activeIndex=i,this._handleController.draggingIndex=i,this._dragPointerId=e.pointerId,this._dragStartValue=this._handleController.models[i]?.value,this.toggleAttribute(`dragging`,!0),this._capturePointer(t,e.pointerId),this.indeterminate=!1,this._handleController.setNormalizedValue(i,r)&&this._handleController.dispatchInput(i),this.requestUpdate()))}_isDragPointer(e){return this._handleController.draggingIndex>=0&&e.pointerId===this._dragPointerId}handlePointerMove(e){let t=this._handleController.draggingIndex;!this._isDragPointer(e)||this.disabled||this.readonly||this._handleController.setNormalizedValue(t,this._normalizedPointerValue(e))&&(this._handleController.dispatchInput(t),this.requestUpdate())}handlePointerUp(e){this._isDragPointer(e)&&this._finishDrag(!0)}_finishDrag(e){if(this._handleController.draggingIndex<0)return;let t=this._dragStartValue,n=this._endDrag();!this.disabled&&!this.readonly&&(this._handleController.models[n]?.value!==t&&this._handleController.dispatchChange(n),e&&this.rangeInputs[n]?.focus({preventScroll:!0})),this.requestUpdate(),this._interaction.end()}endInteraction(){this._finishDrag(!1),this._interaction.end()}handleLostPointerCapture(e){this.handlePointerCancel(e)}handlePointerCancel(e){if(!this._isDragPointer(e))return;let t=this._dragStartValue,n=this._endDrag();t!==void 0&&this._handleController.setValue(n,t)&&this._handleController.dispatchInput(n),this.requestUpdate(),this._interaction.cancel()}_applyInputValue(e,t){Number.isFinite(t)&&(this.indeterminate=!1,this._handleController.setValue(e,t)&&(this._pendingCommits.add(e),this._handleController.dispatchInput(e)))}_commitValue(e,t){let n=Number.isFinite(t)&&this._handleController.setValue(e,t),r=this._pendingCommits.delete(e);(n||r)&&(this.indeterminate=!1,this._handleController.dispatchChange(e))}handleNativeInput(e,t){e.stopPropagation();let n=e.target;this.readonly?n.value=String(this._handleController.models[t]?.value):this._applyInputValue(t,n.valueAsNumber)}handleNativeChange(e,t){e.stopPropagation();let n=e.target;this.readonly?n.value=String(this._handleController.models[t]?.value):this._commitValue(t,n.valueAsNumber)}handleKeyDown(e,t){let n=this._handleController.models[t];if(!n||this.disabled)return;if(this.readonly){[`ArrowUp`,`ArrowDown`,`ArrowRight`,`ArrowLeft`,`Home`,`End`,`PageUp`,`PageDown`].includes(e.key)&&e.preventDefault();return}if(e.key===`Escape`){this._interaction.endKeyboard(),this._handleController.reset(t)&&(e.preventDefault(),e.stopPropagation(),this.requestUpdate());return}let r=e=>n.value+n.step*e,i=this.isLTR?1:-1,a;switch(e.key){case`ArrowUp`:a=r(1);break;case`ArrowDown`:a=r(-1);break;case`ArrowRight`:a=r(i);break;case`ArrowLeft`:a=r(-i);break;case`Home`:a=n.effectiveMin;break;case`End`:a=n.effectiveMax;break;case`PageUp`:a=r(5);break;case`PageDown`:a=r(-5);break;default:return}e.preventDefault(),e.stopPropagation(),this._interaction.keyDown(e.key,n.name)&&(this.disabled||this.readonly?this._interaction.end():(this.indeterminate=!1,this._handleController.setValue(t,a)&&(this._interaction.commit(()=>this._handleController.dispatchInput(t),()=>this._handleController.dispatchChange(t)),this.requestUpdate())))}handleTrackInput(e){let t=e.target;this.handleNativeInput(e,Number(t.dataset.handleIndex))}handleTrackChange(e){let t=e.target;this.handleNativeChange(e,Number(t.dataset.handleIndex))}handleTrackKeyDown(e){let t=e.target;this.handleKeyDown(e,Number(t.dataset.handleIndex))}handleTrackKeyUp(e){this._interaction.keyUp(e.key)}handleTrackFocusIn(e){let t=e.target,n=Number(t.dataset.handleIndex);this._handleController.activeIndex=n,this._focusedIndex=n}handleTrackFocusOut(e){this._interaction.endKeyboard();let t=e.target;this._focusedIndex===Number(t.dataset.handleIndex)&&(this._focusedIndex=-1)}handleTrackDoubleClick(e){let t=e.target.closest(`[data-handle-index]`);!t||this.disabled||this.readonly||(e.preventDefault(),this._handleController.reset(Number(t.dataset.handleIndex)))}handleNumberInput(e){if(e.stopPropagation(),this.readonly)return;let t=e.currentTarget;this._applyInputValue(0,t.value)}handleNumberChange(e){if(e.stopPropagation(),this.readonly)return;let t=e.currentTarget;this._commitValue(0,t.value)}get _hasFill(){return this.variant!==`unfilled`}_renderTicks(){if(!this.ticks)return t;let e=this.tickStep||this.step,n=k(this.min,this.max,e),r=this._numberFormatter(this._withDefaultPrecision(this.formatOptions,e,this.min,this.max));return F(n,this.min,this.max,r,this.tickLabels)}_renderFill(e){return!this._hasFill||this.ramp?t:L(e,this.fillStart)}render(){let n=this._handleController.models,r=this.labelVisibility===`value`,i=this.editable&&n.length===1?n[0]:void 0,a=n.length>1||i!==void 0,s=y(n,({name:e})=>e,(e,t)=>N({model:e,index:t,total:n.length,grouped:a,label:this.label,appliedLabel:this._appliedLabel,helpTextId:this.helpTextId,labelVisibility:this.labelVisibility,formattedValue:this._handleController.formatValue(t),activeIndex:this._handleController.activeIndex,draggingIndex:this._handleController.draggingIndex,focusedIndex:this._focusedIndex,invalid:this.invalid,readonly:this.readonly,disabled:this.disabled}));return e`
       <slot
         name="handle"
         class="handle-slot"
@@ -120,18 +120,19 @@ import"./tokens.js";import{c as e,i as t,y as n}from"./chunks/lit-DWANyjiY.js";i
           @input=${this.handleTrackInput}
           @change=${this.handleTrackChange}
           @keydown=${this.handleTrackKeyDown}
+          @keyup=${this.handleTrackKeyUp}
           @focusin=${this.handleTrackFocusIn}
           @focusout=${this.handleTrackFocusOut}
           @dblclick=${this.handleTrackDoubleClick}
         >
           <span class="rail"></span>
-          ${this.ramp?I(n,this.fillStart,this._hasFill):t}
+          ${this.ramp?R(n,this.fillStart,this._hasFill):t}
           ${this._renderFill(n)} ${this._renderTicks()} ${s}
         </div>
         ${r?e`<output class="value-label"
                 >${this._combinedValueText}</output
               >`:t}
-        ${i?M({model:i,label:this.label||this._appliedLabel,formatOptions:this.formatOptions,size:this.size,disabled:this.disabled,invalid:this.invalid,readonly:this.readonly,hideStepper:this.hideStepper,quiet:this.quiet,indeterminate:this.indeterminate,onInput:this.handleNumberInput,onChange:this.handleNumberChange}):t}
+        ${i?P({model:i,label:this.label||this._appliedLabel,formatOptions:this.formatOptions,size:this.size,disabled:this.disabled,invalid:this.invalid,readonly:this.readonly,hideStepper:this.hideStepper,quiet:this.quiet,indeterminate:this.indeterminate,onInput:this.handleNumberInput,onChange:this.handleNumberChange}):t}
       </div>
       ${this.renderHelpText(this.invalid)}
-    `}willUpdate(e){super.willUpdate(e),(e.has(`value`)||e.has(`min`)||e.has(`max`)||e.has(`step`))&&this._normalizeRawValue(),(e.has(d)||e.has(`formatOptions`))&&this._clearNumberFormatterCache()}updated(e){super.updated(e),(e.has(`disabled`)&&this.disabled||e.has(`readonly`)&&this.readonly)&&(this._endDrag(),this._pendingCommits.clear())}};s([u({type:String})],U.prototype,`label`,void 0),s([u({attribute:!1})],U.prototype,`labels`,void 0),s([l()],U.prototype,`_appliedLabel`,void 0),s([u({type:Number,reflect:!0})],U.prototype,`value`,null),s([u({type:Number,reflect:!0})],U.prototype,`min`,null),s([u({type:Number,reflect:!0})],U.prototype,`max`,null),s([u({type:Number,reflect:!0})],U.prototype,`step`,null),s([u({type:Number,reflect:!0,attribute:`default-value`})],U.prototype,`defaultValue`,void 0),s([u({type:String,reflect:!0})],U.prototype,`variant`,null),s([u({type:Boolean,reflect:!0})],U.prototype,`ramp`,void 0),s([u({type:Boolean,reflect:!0})],U.prototype,`ticks`,void 0),s([u({type:String,reflect:!0,attribute:`label-visibility`})],U.prototype,`labelVisibility`,null),s([u({reflect:!0,attribute:`fill-start`,converter:H})],U.prototype,`fillStart`,void 0),s([u({type:Number,reflect:!0,attribute:`tick-step`})],U.prototype,`tickStep`,null),s([u({type:Boolean,reflect:!0,attribute:`tick-labels`})],U.prototype,`tickLabels`,void 0),s([u({type:Boolean,reflect:!0})],U.prototype,`editable`,void 0),s([u({type:Boolean,reflect:!0,attribute:`hide-stepper`})],U.prototype,`hideStepper`,void 0),s([u({type:Boolean,reflect:!0})],U.prototype,`quiet`,void 0),s([u({type:Boolean,reflect:!0})],U.prototype,`indeterminate`,void 0),s([u({type:Boolean,reflect:!0})],U.prototype,`invalid`,void 0),s([u({type:Boolean,reflect:!0})],U.prototype,`readonly`,void 0),s([u({attribute:!1})],U.prototype,`formatOptions`,void 0),s([u({attribute:!1})],U.prototype,`normalization`,null),s([u({attribute:!1})],U.prototype,`getAriaHandleText`,null),s([u({attribute:!1})],U.prototype,`getAriaValueText`,null),s([a(`input[type="range"]`)],U.prototype,`rangeInputs`,void 0),s([l()],U.prototype,`_focusedIndex`,void 0);var W={fromAttribute(e){if(e===null)return;if(e===`previous`)return e;let t=Number(e);return Number.isFinite(t)?t:void 0},toAttribute(e){return e===void 0?null:String(e)}},G={fromAttribute(e){if(e===null)return;if(e===`next`)return e;let t=Number(e);return Number.isFinite(t)?t:void 0},toAttribute(e){return e===void 0?null:String(e)}},K=class extends c{constructor(...e){super(...e),this.name=``,this.label=``,this.value=NaN,this.color=``}set normalization(e){let t=this.normalization;this._normalization=e,this.requestUpdate(`normalization`,t)}get normalization(){return this._normalization??v}#e;attachController(e){this.#e=e}detachController(e){this.#e===e&&(this.#e=void 0)}get hasController(){return this.#e!==void 0}focus(e){this.#e?.inputForHandle(this)?.focus(e)}render(){return t}updated(e){super.updated(e),(e.has(`value`)||e.has(`min`)||e.has(`max`)||e.has(`step`)||e.has(`color`)||e.has(`name`)||e.has(`label`)||e.has(`defaultValue`)||e.has(`formatOptions`)||e.has(`normalization`)||e.has(`getAriaHandleText`))&&this.#e?.requestHostUpdate()}};s([u({type:String,reflect:!0})],K.prototype,`name`,void 0),s([u({type:String})],K.prototype,`label`,void 0),s([u({type:Number,reflect:!0})],K.prototype,`value`,void 0),s([u({type:Number,reflect:!0,attribute:`default-value`})],K.prototype,`defaultValue`,void 0),s([u({reflect:!0,converter:W})],K.prototype,`min`,void 0),s([u({reflect:!0,converter:G})],K.prototype,`max`,void 0),s([u({type:Number,reflect:!0})],K.prototype,`step`,void 0),s([u({type:String,reflect:!0})],K.prototype,`color`,void 0),s([u({attribute:!1})],K.prototype,`formatOptions`,void 0),s([u({attribute:!1})],K.prototype,`normalization`,null),s([u({attribute:!1})],K.prototype,`getAriaHandleText`,void 0),typeof customElements<`u`&&!customElements.get(`luzmo-slider-handle`)&&customElements.define(`luzmo-slider-handle`,K),typeof customElements<`u`&&!customElements.get(`luzmo-slider`)&&customElements.define(`luzmo-slider`,U);export{R as DEFAULT_SLIDER_LABELS,U as LuzmoSlider,K as LuzmoSliderHandle};
+    `}willUpdate(e){super.willUpdate(e),(e.has(`value`)||e.has(`min`)||e.has(`max`)||e.has(`step`))&&this._normalizeRawValue(),(e.has(d)||e.has(`formatOptions`))&&this._clearNumberFormatterCache()}updated(e){super.updated(e),(e.has(`disabled`)&&this.disabled||e.has(`readonly`)&&this.readonly)&&(this._endDrag(),this._pendingCommits.clear(),this._interaction.end())}};s([u({type:String})],G.prototype,`label`,void 0),s([u({attribute:!1})],G.prototype,`labels`,void 0),s([l()],G.prototype,`_appliedLabel`,void 0),s([u({type:Number,reflect:!0})],G.prototype,`value`,null),s([u({type:Number,reflect:!0})],G.prototype,`min`,null),s([u({type:Number,reflect:!0})],G.prototype,`max`,null),s([u({type:Number,reflect:!0})],G.prototype,`step`,null),s([u({type:Number,reflect:!0,attribute:`default-value`})],G.prototype,`defaultValue`,void 0),s([u({type:String,reflect:!0})],G.prototype,`variant`,null),s([u({type:Boolean,reflect:!0})],G.prototype,`ramp`,void 0),s([u({type:Boolean,reflect:!0})],G.prototype,`ticks`,void 0),s([u({type:String,reflect:!0,attribute:`label-visibility`})],G.prototype,`labelVisibility`,null),s([u({reflect:!0,attribute:`fill-start`,converter:W})],G.prototype,`fillStart`,void 0),s([u({type:Number,reflect:!0,attribute:`tick-step`})],G.prototype,`tickStep`,null),s([u({type:Boolean,reflect:!0,attribute:`tick-labels`})],G.prototype,`tickLabels`,void 0),s([u({type:Boolean,reflect:!0})],G.prototype,`editable`,void 0),s([u({type:Boolean,reflect:!0,attribute:`hide-stepper`})],G.prototype,`hideStepper`,void 0),s([u({type:Boolean,reflect:!0})],G.prototype,`quiet`,void 0),s([u({type:Boolean,reflect:!0})],G.prototype,`indeterminate`,void 0),s([u({type:Boolean,reflect:!0})],G.prototype,`invalid`,void 0),s([u({type:Boolean,reflect:!0})],G.prototype,`readonly`,void 0),s([u({attribute:!1})],G.prototype,`formatOptions`,void 0),s([u({attribute:!1})],G.prototype,`normalization`,null),s([u({attribute:!1})],G.prototype,`getAriaHandleText`,null),s([u({attribute:!1})],G.prototype,`getAriaValueText`,null),s([a(`input[type="range"]`)],G.prototype,`rangeInputs`,void 0),s([l()],G.prototype,`_focusedIndex`,void 0);var K={fromAttribute(e){if(e===null)return;if(e===`previous`)return e;let t=Number(e);return Number.isFinite(t)?t:void 0},toAttribute(e){return e===void 0?null:String(e)}},q={fromAttribute(e){if(e===null)return;if(e===`next`)return e;let t=Number(e);return Number.isFinite(t)?t:void 0},toAttribute(e){return e===void 0?null:String(e)}},J=class extends c{constructor(...e){super(...e),this.name=``,this.label=``,this.value=NaN,this.color=``}set normalization(e){let t=this.normalization;this._normalization=e,this.requestUpdate(`normalization`,t)}get normalization(){return this._normalization??b}#e;attachController(e){this.#e=e}detachController(e){this.#e===e&&(this.#e=void 0)}get hasController(){return this.#e!==void 0}focus(e){this.#e?.inputForHandle(this)?.focus(e)}render(){return t}updated(e){super.updated(e),(e.has(`value`)||e.has(`min`)||e.has(`max`)||e.has(`step`)||e.has(`color`)||e.has(`name`)||e.has(`label`)||e.has(`defaultValue`)||e.has(`formatOptions`)||e.has(`normalization`)||e.has(`getAriaHandleText`))&&this.#e?.requestHostUpdate()}};s([u({type:String,reflect:!0})],J.prototype,`name`,void 0),s([u({type:String})],J.prototype,`label`,void 0),s([u({type:Number,reflect:!0})],J.prototype,`value`,void 0),s([u({type:Number,reflect:!0,attribute:`default-value`})],J.prototype,`defaultValue`,void 0),s([u({reflect:!0,converter:K})],J.prototype,`min`,void 0),s([u({reflect:!0,converter:q})],J.prototype,`max`,void 0),s([u({type:Number,reflect:!0})],J.prototype,`step`,void 0),s([u({type:String,reflect:!0})],J.prototype,`color`,void 0),s([u({attribute:!1})],J.prototype,`formatOptions`,void 0),s([u({attribute:!1})],J.prototype,`normalization`,null),s([u({attribute:!1})],J.prototype,`getAriaHandleText`,void 0),typeof customElements<`u`&&!customElements.get(`luzmo-slider-handle`)&&customElements.define(`luzmo-slider-handle`,J),typeof customElements<`u`&&!customElements.get(`luzmo-slider`)&&customElements.define(`luzmo-slider`,G);export{B as DEFAULT_SLIDER_LABELS,G as LuzmoSlider,J as LuzmoSliderHandle};

package/standalone/utils.js

@@ -17,4 +17,4 @@
  *
  */
 
-import{a as e,c as t,d as n,o as r,s as i,u as a}from"./chunks/lucero-runtime-DMlHjBe_.js";import{a as o,c as s,i as c,l,n as u,o as d,r as f,s as p,t as m,u as h}from"./chunks/platform-wNs7qaiE.js";import{t as g}from"./chunks/streaming-listener-DbMoHlSj.js";import{t as _}from"./chunks/voice-recorder--d34tYNu.js";import{n as v,t as y}from"./chunks/template-property-CyrkVY0Q.js";export{i as ElementSizes,r as FocusVisiblePolyfillMixin,e as Focusable,a as LuzmoElement,n as LuzmoMixin,t as SizedMixin,_ as VoiceRecorder,y as createTemplateRenderer,m as isAndroid,u as isAppleDevice,f as isChrome,c as isFirefox,o as isIOS,d as isIPad,p as isIPhone,s as isMac,l as isSeamonkey,h as isWebKit,g as streamingListener,v as templateProperty};
+import{a as e,c as t,d as n,o as r,s as i,u as a}from"./chunks/lucero-runtime-DMlHjBe_.js";import{a as o,c as s,i as c,l,n as u,o as d,r as f,s as p,t as m,u as h}from"./chunks/platform-wNs7qaiE.js";import{t as g}from"./chunks/streaming-listener-0FSzb9QY.js";import{t as _}from"./chunks/voice-recorder--d34tYNu.js";import{n as v,t as y}from"./chunks/template-property-CyrkVY0Q.js";export{i as ElementSizes,r as FocusVisiblePolyfillMixin,e as Focusable,a as LuzmoElement,n as LuzmoMixin,t as SizedMixin,_ as VoiceRecorder,y as createTemplateRenderer,m as isAndroid,u as isAppleDevice,f as isChrome,c as isFirefox,o as isIOS,d as isIPad,p as isIPhone,s as isMac,l as isSeamonkey,h as isWebKit,g as streamingListener,v as templateProperty};

package/utils/reactive-controllers/interaction.d.ts

@@ -0,0 +1,85 @@
+import type { ReactiveController, ReactiveControllerHost } from 'lit';
+/** The input that drives an interaction. */
+export type InteractionSource = 'mouse' | 'touch' | 'pen' | 'keyboard';
+/**
+ * Detail of `luzmo-interaction-start`, `luzmo-interaction-end`, and
+ * `luzmo-interaction-cancel`.
+ */
+export interface InteractionEventDetail {
+    /** Shared by every event of one interaction, and unique to it. */
+    id: string;
+    source: InteractionSource;
+    /** The slider handle being adjusted, by its resolved `name`. */
+    handle?: string;
+    /**
+     * End and cancel only: whether the value accepted at the end differs from
+     * the value when the interaction started.
+     */
+    changed?: boolean;
+}
+export declare const interactionSourceFromPointer: (event: PointerEvent) => InteractionSource;
+interface InteractionControllerOptions<T> {
+    /** Reads the value an interaction is adjusting, for `changed`. */
+    value: (handle?: string) => T;
+    isEqual?: (a: T, b: T) => boolean;
+}
+/**
+ * Tracks one continuous interaction at a time (a pointer drag, or keys held
+ * down together) and announces its boundaries on the host, so a consumer can
+ * group the `input`/`change` events in between. State is dropped silently on
+ * disconnect, because a detached host can no longer reach its listeners.
+ */
+export declare class InteractionController<T> implements ReactiveController {
+    private readonly _options;
+    private readonly _host;
+    private readonly _prefix;
+    private _count;
+    private _id?;
+    private _source?;
+    private _handle?;
+    private _startValue?;
+    private readonly _keys;
+    private _pendingChange?;
+    constructor(host: ReactiveControllerHost & HTMLElement, _options: InteractionControllerOptions<T>);
+    hostDisconnected(): void;
+    get active(): boolean;
+    /**
+     * Ends any open interaction, then opens a new one. Call it before the value
+     * changes. Returns whether the interaction is still open after the start
+     * listeners ran; when it is not, the caller must not write a value.
+     */
+    start(source: InteractionSource, handle?: string): boolean;
+    /**
+     * Tracks a key press. The first key opens a keyboard interaction; keys
+     * pressed while one is open, including repeats, join it. Keys pressed during
+     * a pointer interaction belong to that interaction. Returns whether the
+     * caller may write a value.
+     */
+    keyDown(key: string, handle?: string): boolean;
+    /** Ends a keyboard interaction once its last held key is released. */
+    keyUp(key: string): void;
+    /** Ends a keyboard interaction whose keyup will not arrive, as on blur. */
+    endKeyboard(): void;
+    /**
+     * Dispatches one value edit as `input`, then `change`. A listener on the
+     * `input` may end the interaction; the `change` is then dispatched first,
+     * so both stay inside its boundaries.
+     */
+    commit(input: () => void, change: () => void): void;
+    /** Ends the open interaction, if any. Repeated calls do nothing. */
+    end(): void;
+    /** Ends the open interaction after the host reverted its value. */
+    cancel(): void;
+    private _finish;
+    private _flushPendingChange;
+    private _reset;
+    private _dispatch;
+}
+declare global {
+    interface GlobalEventHandlersEventMap {
+        'luzmo-interaction-start': CustomEvent<InteractionEventDetail>;
+        'luzmo-interaction-end': CustomEvent<InteractionEventDetail>;
+        'luzmo-interaction-cancel': CustomEvent<InteractionEventDetail>;
+    }
+}
+export {};

package/components/color-area-D1fRozE0.cjs

@@ -1,80 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2026 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- * */
-const e=require("./color-controller-BpdydwTO.cjs");require("./tokens.cjs");const t=require("./decorate-SO02l0A6.cjs"),n=require("./language-resolution-B7D3hQ6_.cjs"),r=require("./platform-BAjeJp2W.cjs");require("./color-handle-BE0Z1gTU.cjs");const i=require("./streaming-listener-Bfyk6Fsx.cjs");let a=require("lit"),o=require("lit/decorators.js"),s=require("lit/directives/if-defined.js");var c=`@media (forced-colors:active){:host{--highcontrast-color-area-border-color-disabled:GrayText;--highcontrast-color-area-border-color:Canvas;--highcontrast-color-area-fill-color-disabled:Canvas}.gradient,:host([disabled]){forced-color-adjust:none}}:host{cursor:default;-webkit-user-select:none;user-select:none;min-inline-size:var(--luzmo-color-area-min-width,64px);min-block-size:var(--luzmo-color-area-min-height,64px);inline-size:var(--luzmo-color-area-width,192px);block-size:var(--luzmo-color-area-height,192px);box-sizing:border-box;border-radius:var(--luzmo-color-area-border-radius,var(--luzmo-border-radius-s));display:inline-block;position:relative;border:var(--luzmo-color-area-border-width,var(--luzmo-border-width)) solid var(--highcontrast-color-area-border-color,var(--luzmo-color-area-border-color,var(--luzmo-border-color)))!important}:host([focused]){z-index:1}:host([disabled]){pointer-events:none;background:var(--highcontrast-color-area-fill-color-disabled,var(--luzmo-color-area-disabled-background-color,var(--luzmo-dimmed-color)));border:var(--luzmo-color-area-border-width,var(--luzmo-border-width)) solid var(--highcontrast-color-area-border-color-disabled)!important}:host([disabled]) .gradient{display:none}.handle{transform:translate(calc(var(--luzmo-color-area-width,192px) - var(--luzmo-border-width)));inset-block-start:0}:host([dir=rtl]) .handle{inset-inline-end:0}.handle:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){inset-inline-end:0}.gradient{border-radius:var(--luzmo-color-area-border-radius,var(--luzmo-border-radius-s));block-size:100%;inline-size:100%}.slider{opacity:0;z-index:0;pointer-events:none;block-size:100%;inline-size:100%;margin:0;position:absolute;inset-block-start:0;inset-inline-start:0}:host{touch-action:none}:host:before{pointer-events:none}.gradient{overflow:hidden}.handle{transform:translate(var(--luzmo-color-area-default-width), 0)}::slotted(*){width:100%;height:100%}:host([dir=rtl]) .gradient{transform:scaleX(-1)}.slider[orient=vertical]{appearance:slider-vertical}.slider:focus{z-index:1}.fieldset{border:0;margin:0;padding:0}`,l=class extends t.n{constructor(...t){super(...t),this.disabled=!1,this.focused=!1,this.labelX=`saturation`,this.labelY=`luminosity`,this.isLTR=!0,this.languageResolver=new n.t(this),this.colorController=new e.t(this,{manageAs:`hsv`}),this.activeAxis=`x`,this.step=.01,this.altered=0,this.activeKeys=new Set,this._valueChanged=!1,this._pointerDown=!1,this.resizeRafId=0,this.handleResize=e=>{let t=e.at(-1);t&&(this.resizeRafId&&cancelAnimationFrame(this.resizeRafId),this.resizeRafId=requestAnimationFrame(()=>{this.resizeRafId=0,this.boundingClientRect=t.contentRect,this.requestUpdate()}))}}static get styles(){return[(0,a.unsafeCSS)(c)]}get hue(){return this.colorController.hue}set hue(e){this.colorController.hue=e}get value(){return this.colorController.colorValue}get color(){return this.colorController.colorValue}set color(e){this.colorController.color=e}get x(){return this.colorController.color.hsv.s/100}set x(e){if(e===this.x)return;let t=this.x;this.inputX?(this.inputX.value=e.toString(),this.colorController.color.set(`s`,this.inputX.valueAsNumber*100)):this.colorController.color.set(`s`,e*100),this.requestUpdate(`x`,t)}get y(){return this.colorController.color.hsv.v/100}set y(e){if(e===this.y)return;let t=this.y;this.inputY&&(this.inputY.value=e.toString(),this.colorController.color.set(`v`,this.inputY.valueAsNumber*100)),this.requestUpdate(`y`,t)}focus(e={}){super.focus(e),this.forwardFocus()}forwardFocus(){this.activeAxis===`x`?this.inputX.focus():this.inputY.focus()}handleFocus(){this.focused=!0,this._valueChanged=!1}handleBlur(){this._pointerDown||(this.altered=0,this.focused=!1,this._valueChanged=!1)}handleKeydown(e){let{code:t}=e;this.focused=!0,this.altered=[e.shiftKey,e.ctrlKey,e.altKey].filter(e=>!!e).length,(t.search(`Arrow`)===0||t.search(`Page`)===0||t.search(`Home`)===0||t.search(`End`)===0)&&(e.preventDefault(),this.activeKeys.add(t),this.handleKeypress())}handleKeypress(){let e=0,t=0,n=Math.max(this.step,this.altered*5*this.step);this.activeKeys.forEach(r=>{switch(r){case`ArrowUp`:t=n;break;case`ArrowDown`:t=n*-1;break;case`ArrowLeft`:e=this.step*(this.isLTR?-1:1);break;case`ArrowRight`:e=this.step*(this.isLTR?1:-1);break;case`PageUp`:t=n*10;break;case`PageDown`:t=n*-10;break;case`Home`:e=n*(this.isLTR?-10:10);break;case`End`:e=n*(this.isLTR?10:-10)}}),e===0?t!==0&&(this.activeAxis=`y`,this.inputY.focus()):(this.activeAxis=`x`,this.inputX.focus()),this.x=Math.min(1,Math.max(this.x+e,0)),this.y=Math.min(1,Math.max(this.y+t,0)),this.colorController.savePreviousColor(),(e!==0||t!==0)&&(this._valueChanged=!0,this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0,cancelable:!0}))||this.colorController.restorePreviousColor())}handleKeyup(e){e.preventDefault();let{code:t}=e;this.activeKeys.delete(t)}handleInput(e){let{valueAsNumber:t,name:n}=e.target;this[n]=t}handleChange(e){this.handleInput(e),this.dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerdown(e){e.button===0?(this._pointerDown=!0,this.colorController.savePreviousColor(),this.boundingClientRect=this.getBoundingClientRect(),e.target.setPointerCapture(e.pointerId),e.pointerType===`mouse`&&(this.focused=!0)):e.preventDefault()}handlePointermove(e){let[t,n]=this.calculateHandlePosition(e);this._valueChanged=!1,this.x=t,this.y=n,this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerup(e){e.preventDefault(),this._pointerDown=!1,e.target.releasePointerCapture(e.pointerId);let t=this.dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0,cancelable:!0}));this.inputX.focus(),e.pointerType===`mouse`&&(this.focused=!1),t||this.colorController.restorePreviousColor()}calculateHandlePosition(e){if(!this.boundingClientRect)return[this.x,this.y];let t=this.boundingClientRect,n=t.left,r=t.top,i=e.clientX,a=e.clientY,o=t.width,s=t.height,c=Math.max(0,Math.min(1,(i-n)/o)),l=Math.max(0,Math.min(1,(a-r)/s));return[this.isLTR?c:1-c,1-l]}handleAreaPointerdown(e){e.button===0&&(e.stopPropagation(),e.preventDefault(),this.handle.dispatchEvent(new PointerEvent(`pointerdown`,e)),this.handlePointermove(e))}render(){let{width:e=0,height:t=0}=this.boundingClientRect||{},n=r.t()||r.a(),o=`Color Picker`,c=(0,s.ifDefined)(n?void 0:`2d slider`),l=this.labelX,u=this.labelY,d=new Intl.NumberFormat(this.languageResolver.language,{style:`percent`,unitDisplay:`narrow`}).format(this.x),f=new Intl.NumberFormat(this.languageResolver.language,{style:`percent`,unitDisplay:`narrow`}).format(this.y),p={background:`linear-gradient(to top, black 0%, hsla(${this.hue}, 100%, 0.01%, 0) 100%),linear-gradient(to right, white 0%, hsla(${this.hue}, 100%, 0.01%, 0) 100%), hsl(${this.hue}, 100%, 50%);`};return a.html`
-      <div
-        @pointerdown=${this.handleAreaPointerdown}
-        class="gradient"
-        style="background: ${p.background}"
-      >
-        <slot name="gradient"></slot>
-      </div>
-
-      <luzmo-color-handle
-        tabindex=${(0,s.ifDefined)(this.focused?void 0:`0`)}
-        @focus=${this.forwardFocus}
-        ?focused=${this.focused}
-        class="handle"
-        color=${this.colorController.getHslString()}
-        ?disabled=${this.disabled}
-        style=${`transform: translate(${(this.isLTR?this.x:1-this.x)*e}px, ${t-this.y*t}px);`}
-        ${i.t({start:[`pointerdown`,this.handlePointerdown],streamInside:[`pointermove`,this.handlePointermove],end:[[`pointerup`,`pointercancel`,`pointerleave`],this.handlePointerup]})}
-      ></luzmo-color-handle>
-
-      <fieldset
-        class="fieldset"
-        aria-label=${(0,s.ifDefined)(n?o:void 0)}
-      >
-        <div role="presentation">
-          <input
-            type="range"
-            class="slider"
-            name="x"
-            aria-label=${n?l:`${l} ${o}`}
-            aria-roledescription=${c}
-            aria-orientation="horizontal"
-            aria-valuetext=${n?d:`${d}, ${l}${this._valueChanged?``:`, ${f}, ${u}`}`}
-            min="0"
-            max="1"
-            step=${this.step}
-            tabindex="-1"
-            .value=${String(this.x)}
-            @input=${this.handleInput}
-            @change=${this.handleChange}
-          />
-        </div>
-        <div role="presentation">
-          <input
-            type="range"
-            class="slider"
-            name="y"
-            aria-label=${n?u:`${u} ${o}`}
-            aria-roledescription=${c}
-            aria-orientation="vertical"
-            aria-valuetext=${n?f:`${f}, ${u}${this._valueChanged?``:`, ${d}, ${l}`}`}
-            orient="vertical"
-            min="0"
-            max="1"
-            step=${this.step}
-            tabindex="-1"
-            .value=${String(this.y)}
-            @input=${this.handleInput}
-            @change=${this.handleChange}
-          />
-        </div>
-      </fieldset>
-    `}firstUpdated(e){super.firstUpdated(e),this.boundingClientRect=this.getBoundingClientRect(),this.addEventListener(`focus`,this.handleFocus),this.addEventListener(`blur`,this.handleBlur),this.addEventListener(`keyup`,this.handleKeyup),this.addEventListener(`keydown`,this.handleKeydown)}updated(e){if(super.updated(e),this.x!==this.inputX.valueAsNumber&&this.colorController.color.set(`s`,this.inputX.valueAsNumber*100),this.y!==this.inputY.valueAsNumber&&this.colorController.color.set(`v`,(1-this.inputY.valueAsNumber)*100),e.has(`focused`)&&this.focused){let e=this.inputX.parentElement,t=this.inputY.parentElement;if(!e.shadowRoot&&!t.shadowRoot){e.attachShadow({mode:`open`}),t.attachShadow({mode:`open`});let n=`<div tabindex="-1"><slot></slot></div>`;e.shadowRoot.innerHTML=n,t.shadowRoot.innerHTML=n}}}connectedCallback(){super.connectedCallback(),!this.observer&&window.ResizeObserver&&(this.observer=new window.ResizeObserver(this.handleResize)),this.observer?.observe(this)}disconnectedCallback(){this.resizeRafId&&=(cancelAnimationFrame(this.resizeRafId),0),this.observer?.disconnect(),this.observer=void 0,super.disconnectedCallback()}};t.t([(0,o.property)({type:String,reflect:!0})],l.prototype,`dir`,void 0),t.t([(0,o.property)({type:Boolean,reflect:!0})],l.prototype,`disabled`,void 0),t.t([(0,o.property)({type:Boolean,reflect:!0})],l.prototype,`focused`,void 0),t.t([(0,o.property)({type:String,attribute:`label-x`})],l.prototype,`labelX`,void 0),t.t([(0,o.property)({type:String,attribute:`label-y`})],l.prototype,`labelY`,void 0),t.t([(0,o.property)({type:Boolean,attribute:`is-ltr`})],l.prototype,`isLTR`,void 0),t.t([(0,o.query)(`.handle`)],l.prototype,`handle`,void 0),t.t([(0,o.property)({type:Number})],l.prototype,`hue`,null),t.t([(0,o.property)({type:String})],l.prototype,`value`,null),t.t([(0,o.property)({type:String})],l.prototype,`color`,null),t.t([(0,o.property)({attribute:!1})],l.prototype,`activeAxis`,void 0),t.t([(0,o.property)({type:Number})],l.prototype,`x`,null),t.t([(0,o.property)({type:Number})],l.prototype,`y`,null),t.t([(0,o.property)({type:Number})],l.prototype,`step`,void 0),t.t([(0,o.query)(`[name="x"]`)],l.prototype,`inputX`,void 0),t.t([(0,o.query)(`[name="y"]`)],l.prototype,`inputY`,void 0),customElements.get(`luzmo-color-area`)||customElements.define(`luzmo-color-area`,l),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return l}});

package/components/color-slider-9Ck28Qdk.cjs

@@ -1,57 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2026 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- * */
-require("./tokens.cjs");const e=require("./decorate-SO02l0A6.cjs"),t=require("./focusable-BIHTrJd6.cjs"),n=require("./language-resolution-B7D3hQ6_.cjs");require("./color-handle-BE0Z1gTU.cjs");const r=require("./streaming-listener-Bfyk6Fsx.cjs");let i=require("lit"),a=require("lit/decorators.js"),o=require("lit/directives/if-defined.js"),s=require("lit/directives/style-map.js"),c=require("@ctrl/tinycolor");var l=/^hs[v|l]a?\s?\((\d{1,3}\.?\d*?),?\s?(\d{1,3})/,u=/(^hs[v|l]a?\s?\()\d{1,3}\.?\d*?(,?\s?)\d{1,3}/,d=/(^hs[v|l]a?\()\d{1,3}/,f=(e,t)=>t?e.toHexString():e.toHex(),p=class{setColorProcess(e,t,n,r){this.maintains===`hue`?this.setColorMaintainHue(e,t,n,r):this.maintains===`saturation`&&this.setColorMaintainSaturation(e,t,n,r)}setColorMaintainHue(e,t,n,r){let{h:i,s:a,v:o,a:s}=this._color.toHsv(),c;if(r&&n.startsWith(`hs`)){let e=l.exec(t);if(e!==null){let[,t]=e;c=Number(t)}}else if(!r&&n.startsWith(`hs`)){let t=e.originalInput;c=Object.values(t)[0]}this.hue=c||i,this.opacity=s??1,this.applyColorToState({h:i,s:a,v:o,a:s})}setColorMaintainSaturation(e,t,n,r){let{a:i}=this._color.toHsv();if(r&&n.startsWith(`hs`)){let e=l.exec(t);if(e!==null){let[,t,n]=e;this.hue=Number(t),this.saturation=Number(n)}}else if(!r&&n.startsWith(`hs`)){let t=e.originalInput,n=Object.values(t);this.hue=n[0],this.saturation=n[1]}else{let{h:t}=e.toHsv();this.hue=t}this.opacity=i??1,this.applyColorToState(e.toHsv())}constructor(e,{applyColorToState:t,extractColorFromState:n,maintains:r}){this.maintains=`hue`,this._hue=0,this._opacity=1,this.getColorProcesses={rgb:(e,t)=>t?e.toRgbString():e.toRgb(),prgb:(e,t)=>t?e.toPercentageRgbString():e.toPercentageRgb(),hex8:(e,t)=>t?e.toHex8String():e.toHex8(),name:e=>e.toName()||e.toRgbString(),hsl:(e,t)=>{if(this.maintains===`hue`){if(t)return e.toHslString().replace(d,`$1${this.hue}`);let{s:n,l:r,a:i}=e.toHsl();return{h:this.hue,s:n,l:r,a:i}}if(t)return e.toHslString().replace(u,`$1${this.hue}$2${this.saturation}`);let{s:n,l:r,a:i}=e.toHsl();return{h:this.hue,s:n,l:r,a:i}},hsv:(e,t)=>{if(this.maintains===`hue`){if(t)return e.toHsvString().replace(d,`$1${this.hue}`);let{s:n,v:r,a:i}=e.toHsv();return{h:this.hue,s:n,v:r,a:i}}if(t)return e.toHsvString().replace(u,`$1${this.hue}$2${this.saturation}`);let{s:n,v:r,a:i}=e.toHsv();return{h:this.hue,s:n,v:r,a:i}},hex:f,hex3:f,hex4:f,hex6:f},this._color=new c.TinyColor({h:0,s:1,v:1}),this._previousColor=new c.TinyColor({h:0,s:1,v:1}),this._format={format:``,isString:!1},this.host=e,this.applyColorToState=t,this.extractColorFromState=n,this.maintains=r||this.maintains}applyColorFromState(){this._color=new c.TinyColor(this.extractColorFromState(this))}get hue(){return this._hue}set hue(e){let t=Math.min(360,Math.max(0,e));if(t===this.hue)return;let n=this.hue,{s:r,v:i,a}=this._color.toHsv();this._color=new c.TinyColor({h:t,s:r,v:i,a}),this._hue=t,this.host.requestUpdate(`hue`,n)}get opacity(){return this._opacity}set opacity(e){let t=Math.min(1,Math.max(0,e));if(t===this.opacity)return;let n=this.opacity,{h:r,s:i,v:a}=this._color.toHsv();this._color=new c.TinyColor({h:r,s:i,v:a,a:t}),this._opacity=t,this.host.requestUpdate(`opacity`,n)}get value(){return this.color}get color(){return this.getColorProcesses[this._format.format||`hex`](this._color,this._format.isString)}set color(e){if(e===this.color)return;let t=this._color;this._color=new c.TinyColor(e);let n=this._color.format,r=typeof e==`string`||e instanceof String;n.startsWith(`hex`)&&(r=e.startsWith(`#`)),this._format={format:n,isString:r},this.setColorProcess(this._color,e,n,r),this.host.requestUpdate(`color`,t)}getColor(e){return this._color[{hsl:`toHsl`}[e]]()}setColor(e){this._color=e;let t=typeof this._color.originalInput==`string`||this._color.originalInput instanceof String;this.setColorProcess(this._color,e,this._color.format,t)}getHslString(){return this._color.toHslString()}savePreviousColor(){this._previousColor=this._color.clone()}restorePreviousColor(){this.setColor(this._previousColor)}},m=`.opacity-checkerboard{background:repeating-conic-gradient(var(--luzmo-color-loupe-checkerboard-light,#fff) 0 25%, var(--luzmo-color-loupe-checkerboard-dark,#e6e6e6) 0 50%) var(--luzmo-color-loupe-checkerboard-position,left top)/calc(var(--luzmo-color-loupe-checkerboard-size,8px) * 2) calc(var(--luzmo-color-loupe-checkerboard-size,8px) * 2);block-size:100%;inline-size:100%;position:absolute}:host{--luzmo-color-slider-gradient-fallback:red 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red 100%;touch-action:none}:host([vertical]) .handle{inset-block-start:unset;inset-block-end:0}:host([vertical]) .slider{appearance:slider-vertical}:host(:focus){outline:none}.gradient{overflow:hidden}::slotted(*){width:100%;height:100%}@media (forced-colors:active){:host{--highcontrast-color-slider-border-color:CanvasText;--highcontrast-color-slider-border-color-disabled:GrayText;--highcontrast-color-slider-background-color-disabled:Canvas;forced-color-adjust:none}}:host{--luzmo-color-handle-hitarea-border-radius:var(--luzmo-color-slider-handle-hitarea-border-radius,0px);min-inline-size:var(--luzmo-color-slider-minimum-length,80px);inline-size:var(--luzmo-color-slider-length,192px);block-size:var(--luzmo-color-slider-control-track-width,24px);-webkit-user-select:none;user-select:none;cursor:default;display:block;position:relative}:host([focused]){z-index:2}:host([disabled]){pointer-events:none}:host([disabled]) .gradient{display:none}:host([vertical]){min-block-size:var(--luzmo-color-slider-vertical-minimum-height,var(--luzmo-color-slider-minimum-length,80px));block-size:var(--luzmo-color-slider-vertical-height,var(--luzmo-color-slider-length,192px));min-inline-size:0;inline-size:var(--luzmo-color-slider-vertical-control-track-width,var(--luzmo-color-slider-control-track-height,24px));display:inline-block}:host([vertical]) .handle{inset-inline-start:50%}.handle{inset-block-start:50%;inset-inline-start:0}.checkerboard{--luzmo-color-slider-border-color-local:var(--highcontrast-color-slider-border-color,var(--luzmo-color-slider-border-color,var(--luzmo-border-color)))}.checkerboard:before{content:"";z-index:1;box-shadow:inset 0 0 0 var(--luzmo-color-slider-border-width,var(--luzmo-border-width)) var(--luzmo-color-slider-border-color-local);border-radius:var(--luzmo-color-slider-border-rounding,var(--luzmo-border-radius-s));position:absolute;inset:0}:host([disabled]) .checkerboard{--luzmo-color-slider-border-color-local:var(--highcontrast-color-slider-border-color-disabled,var(--luzmo-color-slider-border-color-disabled,var(--luzmo-dimmed-color)));background:var(--highcontrast-color-slider-background-color-disabled,var(--luzmo-color-slider-background-color-disabled,var(--luzmo-dimmed-color)))}.checkerboard,.gradient{border-radius:var(--luzmo-color-slider-border-rounding,var(--luzmo-border-radius-s));block-size:100%;inline-size:100%}:host([dir=rtl]) .gradient{transform:scaleX(-1)}.gradient:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)){transform:scaleX(-1)}.slider{opacity:0;z-index:0;pointer-events:none;block-size:100%;inline-size:100%;margin:0;position:absolute;inset-block-start:0;inset-inline-start:0}`,h=class extends t.t{constructor(...e){super(...e),this.disabled=!1,this.focused=!1,this.label=`hue`,this.vertical=!1,this.languageResolver=new n.t(this),this.colorController=new p(this,{applyColorToState:()=>{if(this.mode===`opacity`){let e=new c.TinyColor(this.colorController.color);this.sliderHandlePosition=100*e.getAlpha()}else this.sliderHandlePosition=100*(this.colorController.hue/360)},extractColorFromState:e=>this.mode===`opacity`?{...e.getColor(`hsl`),a:this.value}:{...e.getColor(`hsl`),h:this.value},maintains:`saturation`}),this.sliderHandlePosition=0,this.step=1,this.isLTR=!0,this._altered=0,this._pointerDown=!1}static get styles(){return[(0,i.unsafeCSS)(m)]}get value(){return this.mode===`opacity`?this.colorController.opacity:this.colorController.hue}set value(e){this.mode===`opacity`?this.colorController.opacity=e:this.colorController.hue=e}get color(){return this.colorController.color}set color(e){this.colorController.color=e}get altered(){return this._altered}set altered(e){this._altered=e,this.step=Math.max(1,this.altered*10)}get focusElement(){return this.input}handleKeydown(e){let{key:t}=e;this.focused=!0,this.altered=[e.shiftKey,e.ctrlKey,e.altKey].filter(e=>!!e).length;let n=0;switch(t){case`ArrowUp`:n=this.step;break;case`ArrowDown`:n=-this.step;break;case`ArrowLeft`:n=this.step*(this.isLTR?-1:1);break;case`ArrowRight`:n=this.step*(this.isLTR?1:-1);break;default:return}e.preventDefault();let r=100/(this.mode===`opacity`?100:360);this.sliderHandlePosition=Math.min(100,Math.max(0,this.sliderHandlePosition+n*r)),this.value=this.mode===`opacity`?Math.min(1,Math.max(0,this.value+n/100)):Math.min(360,Math.max(0,this.value+n)),this.colorController.applyColorFromState(),n!==0&&(this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0})),this.dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0})))}handleInput(e){let{valueAsNumber:t}=e.target;this.value=t,this.sliderHandlePosition=100*(this.mode===`opacity`?this.value:this.value/360),this.colorController.applyColorFromState()}handleChange(e){this.handleInput(e),this.dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0}))}focus(e={}){super.focus(e),this.forwardFocus()}forwardFocus(){this.input.focus()}handleFocus(){this.focused=!0}handleBlur(){this._pointerDown||(this.altered=0,this.focused=!1)}handlePointerdown(e){e.button===0?(this._pointerDown=!0,this.colorController.savePreviousColor(),this.boundingClientRect=this.getBoundingClientRect(),e.target.setPointerCapture(e.pointerId),e.pointerType===`mouse`&&(this.focused=!0)):e.preventDefault()}handlePointermove(e){this.sliderHandlePosition=this.calculateHandlePosition(e),this.value=(this.mode===`opacity`?1:360)*(this.sliderHandlePosition/100),this.colorController.applyColorFromState(),this.dispatchEvent(new Event(`input`,{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerup(e){this._pointerDown=!1,e.target.releasePointerCapture(e.pointerId),this.dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0,cancelable:!0}))||this.colorController.restorePreviousColor(),this.focus(),e.pointerType===`mouse`&&(this.focused=!1)}calculateHandlePosition(e){if(!this.boundingClientRect)return this.sliderHandlePosition;let t=this.boundingClientRect,n=this.vertical?t.top:t.left,r=this.vertical?e.clientY:e.clientX,i=this.vertical?t.height:t.width,a=Math.max(0,Math.min(1,(r-n)/i));return this.vertical||!this.isLTR?100-100*a:100*a}handleGradientPointerdown(e){e.button===0&&(e.stopPropagation(),e.preventDefault(),this.handle.dispatchEvent(new PointerEvent(`pointerdown`,e)),this.handlePointermove(e))}get handlePositionStyles(){return`${this.vertical?`inset-block-end`:`inset-inline-start`}: ${this.sliderHandlePosition}%`}get getColorSliderStyle(){let e=this.vertical?`top`:`right`;return this.mode===`opacity`?{background:`linear-gradient(to ${e}, transparent, ${new c.TinyColor(this.colorController.color).setAlpha(1).toRgbString()})`}:{background:`linear-gradient(to ${e}, var(--luzmo-color-slider-gradient, var(--luzmo-color-slider-gradient-fallback)))`}}render(){return i.html`
-      <div
-        class="opacity-checkerboard checkerboard"
-        role="presentation"
-        @pointerdown=${this.handleGradientPointerdown}
-      >
-        <div
-          class="gradient"
-          role="presentation"
-          style=${(0,s.styleMap)(this.getColorSliderStyle)}
-        >
-          <slot name="gradient"></slot>
-        </div>
-      </div>
-      <luzmo-color-handle
-        tabindex=${(0,o.ifDefined)(this.focused?void 0:`0`)}
-        @focus=${this.forwardFocus}
-        ?focused=${this.focused}
-        class="handle"
-        color=${this.mode===`opacity`?this.color:`hsl(`+this.value+`, 100%, 50%)`}
-        ?disabled=${this.disabled}
-        style=${this.handlePositionStyles}
-        ${r.t({start:[`pointerdown`,this.handlePointerdown],streamInside:[`pointermove`,this.handlePointermove],end:[[`pointerup`,`pointercancel`,`pointerleave`],this.handlePointerup]})}
-      ></luzmo-color-handle>
-      <input
-        type="range"
-        class="slider"
-        min="0"
-        max=${this.mode===`opacity`?`100`:`360`}
-        aria-orientation=${(0,o.ifDefined)(this.vertical?`vertical`:void 0)}
-        orient=${(0,o.ifDefined)(this.vertical?`vertical`:void 0)}
-        step=${this.step}
-        aria-label=${this.label}
-        .value=${String(this.mode===`opacity`?this.value*100:this.value)}
-        aria-valuetext=${`${new Intl.NumberFormat(this.languageResolver.language,{maximumFractionDigits:0,minimumIntegerDigits:1,style:`unit`,unit:this.mode===`opacity`?`percent`:`degree`,unitDisplay:`narrow`}).format(this.mode===`opacity`?this.value*100:this.value)}`}
-        @input=${this.handleInput}
-        @change=${this.handleChange}
-        @keydown=${this.handleKeydown}
-      />
-    `}firstUpdated(e){super.firstUpdated(e),this.boundingClientRect=this.getBoundingClientRect(),this.addEventListener(`focus`,this.handleFocus),this.addEventListener(`blur`,this.handleBlur)}updated(e){e.has(`mode`)&&(this.handle.style.insetInlineStart=``,this.handle.style.insetBlockEnd=``,this.mode===`opacity`&&(this.colorController.color=new c.TinyColor(this.colorController.color).toRgbString(),this.handle.style.insetInlineStart=100*this.colorController.opacity+`%`))}};e.t([(0,a.property)({type:String,reflect:!0})],h.prototype,`dir`,void 0),e.t([(0,a.property)({type:String,reflect:!0})],h.prototype,`mode`,void 0),e.t([(0,a.property)({type:Boolean,reflect:!0})],h.prototype,`disabled`,void 0),e.t([(0,a.property)({type:Boolean,reflect:!0})],h.prototype,`focused`,void 0),e.t([(0,a.query)(`.handle`)],h.prototype,`handle`,void 0),e.t([(0,a.property)({type:String})],h.prototype,`label`,void 0),e.t([(0,a.property)({type:Boolean,reflect:!0})],h.prototype,`vertical`,void 0),e.t([(0,a.property)({type:Number})],h.prototype,`value`,null),e.t([(0,a.property)({type:Number,reflect:!0})],h.prototype,`sliderHandlePosition`,void 0),e.t([(0,a.property)({type:String})],h.prototype,`color`,null),e.t([(0,a.property)({type:Number})],h.prototype,`step`,void 0),e.t([(0,a.property)({type:Boolean,attribute:`is-ltr`})],h.prototype,`isLTR`,void 0),e.t([(0,a.query)(`input`)],h.prototype,`input`,void 0),customElements.get(`luzmo-color-slider`)||customElements.define(`luzmo-color-slider`,h),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return h}});