@luzmo/lucero 0.0.26 → 0.0.28

package/components/number-field/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("../NumberFormatter-DewVDY5w.cjs"),g=require("../NumberParser-Dik4a0h-.cjs"),h=require("@luzmo/icons"),s=require("../base-CTSOJw6c.cjs"),x=require("../query-BL-TJj7K.cjs"),c=require("../platform-BiXhwqk3.cjs"),z=require("../language-resolution-DJzmyzZq.cjs"),y=require("../streaming-listener-Cm6s-WvF.cjs");require("../infield-button/index.cjs");const k=require("../text-field-CThL0T_y.cjs"),F='#text-field{--stepper-width: calc( var(--luzmo-stepper-height, var(--stepper-height)) * var( --luzmo-stepper-min-width-multiplier, var(--stepper-min-width-multiplier) ) + var(--luzmo-stepper-button-width, var(--stepper-button-width)) + var(--luzmo-stepper-border-width, var(--stepper-border-width)) * 2 );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color, var( --luzmo-stepper-buttons-border-color, var(--stepper-buttons-border-color) ) );--luzmo-infield-button-border-width: var( --luzmo-stepper-button-border-width, var(--stepper-button-border-width) );--luzmo-infield-button-border-radius-reset: var( --stepper-button-border-radius-reset );--luzmo-text-field-border-width: var( --luzmo-stepper-border-width, var(--stepper-border-width) );inline-size:var(--luzmo-stepper-width, var(--stepper-width));block-size:var(--luzmo-stepper-height, var(--stepper-height));border-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));border-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));flex-flow:row;display:inline-flex;position:relative}#text-field:after{content:"";inline-size:100%;block-size:var(--luzmo-stepper-focus-indicator-width, var(--stepper-focus-indicator-width));position:absolute;inset-block-end:calc((var(--luzmo-stepper-focus-indicator-gap, var(--stepper-focus-indicator-gap)) + var(--luzmo-stepper-focus-indicator-width, var(--stepper-focus-indicator-width))) * -1);inset-inline-start:0}:host([focused]) #text-field,#text-field:focus{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-focus, var(--luzmo-stepper-border-color-focus, var(--stepper-border-color-focus)) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus, var( --luzmo-stepper-buttons-border-color-focus, var(--stepper-buttons-border-color-focus) ) )}:host([focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus .input{outline:none}:host([focused]:not([disabled])) #text-field .buttons,:host([focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus .buttons,:host(:not([disabled])) #text-field:focus .input{border-color:var(--highcontrast-stepper-border-color-focus, var(--luzmo-stepper-border-color-focus, var(--stepper-border-color-focus)))}:host([keyboard-focused]) #text-field,#text-field:focus-visible{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-keyboard-focus, var( --luzmo-stepper-buttons-border-color-keyboard-focus, var(--stepper-buttons-border-color-keyboard-focus) ) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-keyboard-focus, var( --luzmo-stepper-buttons-border-color-keyboard-focus, var(--stepper-buttons-border-color-keyboard-focus) ) )}:host([keyboard-focused]:not([disabled])) #text-field,:host(:not([disabled])) #text-field:focus-visible{outline:var(--luzmo-stepper-focus-indicator-width, var(--stepper-focus-indicator-width)) solid;outline-color:var(--highcontrast-stepper-focus-indicator-color, var(--luzmo-stepper-focus-indicator-color, var(--stepper-focus-indicator-color)));outline-offset:var(--luzmo-stepper-focus-indicator-gap, var(--stepper-focus-indicator-gap))}:host([keyboard-focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus-visible .input{outline:none}:host([keyboard-focused]:not([disabled])) #text-field .buttons,:host([keyboard-focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus-visible .buttons,:host(:not([disabled])) #text-field:focus-visible .input{border-color:var(--highcontrast-stepper-border-color-keyboard-focus, var(--luzmo-stepper-border-color-keyboard-focus, var(--stepper-border-color-keyboard-focus)))}:host([invalid]:not([disabled])) #text-field{--luzmo-stepper-border-color: var( --luzmo-stepper-border-color-invalid, var(--stepper-border-color-invalid) );--luzmo-stepper-border-color-hover: var( --luzmo-stepper-border-color-hover-invalid, var(--stepper-border-color-hover-invalid) );--luzmo-stepper-border-color-focus: var( --luzmo-stepper-border-color-focus-invalid, var(--stepper-border-color-focus-invalid) );--luzmo-stepper-border-color-focus-hover: var( --luzmo-stepper-border-color-focus-hover-invalid, var(--stepper-border-color-focus-hover-invalid) );--luzmo-stepper-border-color-keyboard-focus: var( --luzmo-stepper-border-color-keyboard-focus-invalid, var(--stepper-border-color-keyboard-focus-invalid) );--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-invalid, var(--stepper-border-color-invalid) );--luzmo-text-field-icon-spacing-inline-start-invalid: 0}:host([invalid][focused]:not([disabled])) #text-field,:host([invalid]:not([disabled])) #text-field:focus{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-focus-invalid, var(--stepper-border-color-focus-invalid) )}:host([invalid][keyboard-focused]:not([disabled])) #text-field,:host([invalid]:not([disabled])) #text-field:focus-visible{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-keyboard-focus-invalid, var(--stepper-border-color-keyboard-focus-invalid) )}:host([disabled]) #text-field{--luzmo-stepper-border-color: var(--stepper-button-border-color-disabled);--luzmo-stepper-border-color-hover: var( --stepper-button-border-color-disabled );--luzmo-stepper-border-color-focus: var( --stepper-button-border-color-disabled );--luzmo-stepper-border-color-focus-hover: var( --stepper-button-border-color-disabled );--luzmo-stepper-border-color-keyboard-focus: var( --stepper-button-border-color-disabled );--luzmo-stepper-buttons-background-color: var( --stepper-buttons-background-color-disabled );--luzmo-infield-button-border-width: var( --stepper-button-border-width-disabled );--luzmo-infield-button-border-color: var( --stepper-button-border-color-disabled );--luzmo-text-field-border-color-disabled: var( --stepper-button-border-color-disabled )}#text-field .input{border-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));border-inline-end-width:0;border-start-end-radius:0;border-end-end-radius:0}#text-field.hide-stepper .input{border-inline-end-width:var(--luzmo-stepper-border-width, var(--stepper-border-width));border-start-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));border-end-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius))}#text-field .buttons{box-sizing:border-box;font-size:var(--luzmo-stepper-button-font-size, var(--stepper-button-font-size));block-size:var(--luzmo-stepper-height, var(--stepper-height));inline-size:var(--luzmo-stepper-button-width, var(--stepper-button-width));border-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));border-style:var(--luzmo-stepper-buttons-border-style, var(--stepper-buttons-border-style));border-width:var(--highcontrast-stepper-buttons-border-width, var(--luzmo-stepper-buttons-border-width, var(--stepper-buttons-border-width)));background-color:var(--highcontrast-stepper-buttons-background-color, var(--luzmo-stepper-buttons-background-color, var(--stepper-buttons-background-color)));transition:border-color var(--luzmo-stepper-animation-duration, var(--stepper-animation-duration)) ease-in-out;border-inline-start-width:0;border-start-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));border-end-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));flex-direction:column;justify-content:center;display:flex}:host([quiet]) #text-field{border-start-start-radius:0;border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:0}:host([quiet]) #text-field .input{--luzmo-text-field-focus-indicator-color: transparent}:host([quiet]) #text-field.hide-stepper .input{border-inline-end-width:0;border-end-end-radius:0}:host([quiet]) #text-field .buttons{--luzmo-infield-button-border-color: transparent;border-width:0;border-block-end-width:var(--luzmo-stepper-border-width, var(--stepper-border-width));border-block-end-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));border-block-end-style:solid;border-end-end-radius:0}:host([quiet]) #text-field .button{--luzmo-infield-button-width-stacked: var( --luzmo-stepper-button-width-quiet, var(--stepper-button-width) );--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-quiet, var(--stepper-button-border-color-quiet) );--luzmo-infield-button-stacked-bottom-border-block-end-width: var( --luzmo-stepper-border-width, var(--stepper-border-width) );--luzmo-infield-button-stacked-bottom-border-radius-end-end: 0;--luzmo-infield-button-stacked-bottom-border-radius-end-start: 0;--luzmo-infield-button-fill-justify-content: flex-end;padding:0}:host([quiet]) #text-field .buttons,:host([quiet]) #text-field .input{background-color:initial}:host([quiet][focused]) #text-field,:host([quiet]) #text-field:focus{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus, var(--luzmo-stepper-border-color-focus, var(--stepper-border-color-focus)) )}:host([quiet][keyboard-focused]:not([disabled])) #text-field{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-keyboard-focus, var( --luzmo-stepper-border-color-keyboard-focus, var(--stepper-border-color-keyboard-focus) ) );outline:none}:host([quiet][keyboard-focused]:not([disabled])) #text-field:after{background-color:var(--highcontrast-stepper-focus-indicator-color, var(--luzmo-stepper-focus-indicator-color, var(--stepper-focus-indicator-color)))}@media (hover: hover){:host(:hover:not([disabled])) #text-field{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-hover, var(--luzmo-stepper-border-color-hover, var(--stepper-border-color-hover)) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-hover, var( --luzmo-stepper-buttons-border-color-hover, var(--stepper-buttons-border-color-hover) ) )}:host([focused]:hover) #text-field,:host(:hover) #text-field:focus{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-focus-hover, var( --luzmo-stepper-buttons-border-color-focus-hover, var(--stepper-buttons-border-color-focus-hover) ) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus-hover, var( --luzmo-stepper-buttons-border-color-focus-hover, var(--stepper-buttons-border-color-focus-hover) ) )}:host([focused]:hover) #text-field .buttons,:host([focused]:hover) #text-field .input,:host(:hover) #text-field:focus .buttons,:host(:hover) #text-field:focus .input{border-color:var(--highcontrast-stepper-border-color-focus-hover, var(--luzmo-stepper-border-color-focus-hover, var(--stepper-border-color-focus-hover)))}:host([invalid]:not([disabled]):hover) #text-field{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-hover-invalid, var(--stepper-border-color-hover-invalid) )}:host([invalid][focused]:not([disabled]):hover) #text-field,:host([invalid]:not([disabled]):hover) #text-field:focus{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-focus-hover-invalid, var(--stepper-border-color-focus-hover-invalid) )}:host([quiet]:not([disabled]):hover) #text-field{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-hover, var(--luzmo-stepper-border-color-hover, var(--stepper-border-color-hover)) )}:host([quiet]:not([disabled]):hover) #text-field .buttons{background-color:initial}:host([quiet][focused]:hover) #text-field,:host([quiet]:hover) #text-field:focus{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus-hover, var( --luzmo-stepper-border-color-focus-hover, var(--stepper-border-color-focus-hover) ) )}:host([quiet][keyboard-focused]:not([disabled]):hover) #text-field{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-hover, var(--luzmo-stepper-border-color-hover, var(--stepper-border-color-hover)) )}}:host([invalid]) #text-field .icon,:host([valid]) #text-field .icon{inset-inline-end:calc(var(--stepper-button-width) + var(--luzmo-text-field-icon-spacing-inline-end-invalid, var(--text-field-icon-spacing-inline-end-invalid)))}@media (forced-colors: active){:host{--highcontrast-stepper-border-color: CanvasText;--highcontrast-stepper-border-color-hover: Highlight;--highcontrast-stepper-border-color-focus: Highlight;--highcontrast-stepper-border-color-focus-hover: Highlight;--highcontrast-stepper-border-color-keyboard-focus: CanvasText;--highcontrast-stepper-button-background-color-default: Canvas;--highcontrast-stepper-button-background-color-hover: Canvas;--highcontrast-stepper-button-background-color-focus: Canvas;--highcontrast-stepper-button-background-color-keyboard-focus: Canvas;--highcontrast-stepper-focus-indicator-color: Highlight}:host([invalid]) #text-field{--highcontrast-stepper-border-color: Highlight;--highcontrast-stepper-border-color-hover: Highlight;--highcontrast-stepper-border-color-focus: Highlight;--highcontrast-stepper-border-color-focus-hover: Highlight;--highcontrast-stepper-border-color-keyboard-focus: Highlight;--highcontrast-infield-button-border-color: Highlight}:host([disabled]) #text-field{--highcontrast-stepper-border-color: GrayText;--highcontrast-infield-button-border-color: GrayText;--highcontrast-stepper-buttons-border-width: var( --luzmo-stepper-border-width, var(--stepper-border-width) )}}:host{--text-field-minimum-width-multiplier: 1.75;--stepper-border-width: var(--luzmo-border-width);--stepper-border-color: var(--luzmo-border-color);--stepper-border-color-hover: var(--luzmo-border-color-full-hover);--stepper-border-color-focus: var(--luzmo-border-color-full-focus);--stepper-border-color-focus-hover: var(--luzmo-border-color-full-focus);--stepper-border-color-keyboard-focus: var(--luzmo-border-color-full-focus);--stepper-border-radius: var(--luzmo-border-radius);--stepper-min-width-multiplier: 1.5;--stepper-animation-duration: var(--luzmo-animation-duration);--stepper-buttons-background-color: var(--luzmo-background-color);--stepper-buttons-border-style: none;--stepper-buttons-border-width: 0;--stepper-buttons-border-color: var(--luzmo-border-color);--stepper-buttons-border-color-hover: var(--luzmo-border-color-full-hover);--stepper-buttons-border-color-focus: var(--luzmo-border-color-full-focus);--stepper-buttons-border-color-keyboard-focus: var( --luzmo-border-color-focus );--stepper-button-font-size: var(--luzmo-font-size);--stepper-button-padding: 0px;--stepper-button-border-radius-reset: 0;--stepper-button-border-width: var(--luzmo-border-width);--stepper-button-background-color-focus: var(--luzmo-background-color-focus);--stepper-button-background-color-keyboard-focus: var( --luzmo-background-color-focus );--stepper-border-color-invalid: var(--luzmo-negative-color);--stepper-border-color-hover-invalid: var(--luzmo-negative-color-hover);--stepper-border-color-focus-invalid: var(--luzmo-negative-color-focus);--stepper-border-color-focus-hover-invalid: var(--luzmo-negative-color-focus);--stepper-border-color-keyboard-focus-invalid: var( --luzmo-negative-color-focus );--stepper-focus-indicator-width: var(--luzmo-indicator-width);--stepper-focus-indicator-gap: calc(-1 * var(--luzmo-border-width));--stepper-focus-indicator-color: var(--luzmo-indicator-color);--stepper-button-border-color-quiet: transparent;--stepper-button-border-color-disabled: var(--luzmo-border-color-disabled);--stepper-button-border-width-disabled: var(--luzmo-border-width);--stepper-buttons-background-color-disabled: var( --luzmo-background-color-disabled );--stepper-button-width: 28px;--stepper-height: var(--luzmo-component-height)}:host([size=s]) #text-field{--stepper-button-width: 16px;--stepper-height: var(--luzmo-component-height-s)}:host([size=m]) #text-field{--stepper-button-width: 20px;--stepper-height: var(--luzmo-component-height)}:host([size=l]) #text-field{--stepper-button-width: 28px;--stepper-height: var(--luzmo-component-height-l)}:host([size=xl]) #text-field{--stepper-button-width: 36px;--stepper-height: var(--luzmo-component-height-xl)}:host{inline-size:var(--luzmo-stepper-width, var(--stepper-width));--swc-number-field-width: calc( var(--luzmo-stepper-height, var(--stepper-height)) * var( --luzmo-stepper-min-width-multiplier, var(--text-field-minimum-width-multiplier) ) + var(--luzmo-stepper-button-width, var(--stepper-button-width)) + var(--luzmo-stepper-border-width, var(--stepper-border-width)) * 2 );--luzmo-infield-button-border-width: var(--unset-value-resets-inheritance);--stepper-width: var(--swc-number-field-width)}:host([size=s]){--stepper-width: calc(var(--swc-number-field-width) / 5 * 4);--stepper-button-font-size: var(--luzmo-font-size-s)}:host([size=l]){--stepper-width: calc(var(--swc-number-field-width) * 1.25);--stepper-button-font-size: var(--luzmo-font-size-l)}:host([size=xl]){--stepper-width: calc(var(--swc-number-field-width) * 1.25 * 1.25);--stepper-button-font-size: var(--luzmo-font-size-xl)}#text-field{inline-size:100%}.input{font-variant-numeric:tabular-nums}:host([readonly]) .buttons{pointer-events:none;visibility:hidden}:host([readonly]:not([disabled],[invalid],[focused],[keyboard-focused])) #text-field:hover .input{border-color:transparent}:host([hide-stepper]:not([quiet])) #text-field input{border:var(--luzmo-stepper-border-width, var(--stepper-border-width)) solid var(--luzmo-stepper-border-color, var(--stepper-border-color));border-radius:var(--luzmo-border-radius)}:host([quiet]) #text-field .button{--luzmo-infield-button-border-color: var( --luzmo-infield-border-color-quiet, transparent );--luzmo-infield-button-edge-to-fill: 0;--luzmo-infield-button-border-width: var( --luzmo-infield-button-border-width-quiet, 0 )}';var C=Object.defineProperty,_=Object.getOwnPropertyDescriptor,d=(m,e,t,o)=>{for(var r=o>1?void 0:o?_(e,t):e,i=m.length-1,u;i>=0;i--)(u=m[i])&&(r=(o?u(e,t,r):u(r))||r);return o&&r&&C(e,t,r),r};const q=5,N=100,b="-",w={"１":"1","２":"2","３":"3","４":"4","５":"5","６":"6","７":"7","８":"8","９":"9","０":"0","、":",","，":",","。":".","．":".","％":"%","＋":"+",ー:"-",一:"1",二:"2",三:"3",四:"4",五:"5",六:"6",七:"7",八:"8",九:"9",零:"0"};class a extends k.LuzmoTextFieldBase{constructor(){super(...arguments),this.focused=!1,this._forcedUnit="",this.formatOptions={},this.hideStepper=!1,this.indeterminate=!1,this.keyboardFocused=!1,this.managedInput=!1,this.stepModifier=10,this._value=Number.NaN,this._trackingValue="",this.decimalsChars=new Set([".",","]),this.valueBeforeFocus="",this.isIntentDecimal=!1,this.changeCount=0,this.languageResolver=new z.LanguageResolutionController(this),this.wasIndeterminate=!1,this.hasRecentlyReceivedPointerDown=!1,this.applyFocusElementLabel=e=>{this.appliedLabel=e},this.isComposing=!1}static get styles(){return[...super.styles,s.r(F)]}set value(e){const t=this.validateInput(e);if(t===this.value)return;this.lastCommitedValue=t;const o=this._value;this._value=t,this.requestUpdate("value",o)}get value(){return this._value}get inputValue(){return this.indeterminate?this.formattedValue:this.inputElement.value}setValue(e=this.value){const t=this.lastCommitedValue;this.value=e,!(t===void 0||t===this.value)&&(this.lastCommitedValue=this.value,this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}get valueAsString(){return this._value.toString()}set valueAsString(e){this.value=this.numberParser.parse(e)}get formattedValue(){return Number.isNaN(this.value)?"":this.numberFormatter.format(this.value)+(this.focused?"":this._forcedUnit)}convertValueToNumber(e){let t=[...e].map(i=>w[i]||i).join("");const o=[...this.valueBeforeFocus].filter(i=>this.decimalsChars.has(i)),r=new Set(o);if(c.isIOS()&&this.inputElement.inputMode==="decimal"&&t!==this.valueBeforeFocus){const u=this.numberFormatter.formatToParts(1000.1).find(n=>n.type==="decimal").value;for(const n of r)!(n===u)&&!this.isIntentDecimal&&(t=t.replaceAll(new RegExp(n,"g"),""));let p=!1;const l=[...t];for(let n=l.length-1;n>=0;n--){const v=l[n];this.decimalsChars.has(v)&&(p?l[n]="":(l[n]=u,p=!0))}t=l.join("")}return this.numberParser.parse(t)}get _step(){var e;return this.step!==void 0?this.step:((e=this.formatOptions)==null?void 0:e.style)==="percent"?.01:1}handlePointerdown(e){if(e.button!==0){e.preventDefault();return}this.managedInput=!0,this.buttons.setPointerCapture(e.pointerId);const t=this.buttons.children[0].getBoundingClientRect(),o=this.buttons.children[1].getBoundingClientRect();this.findChange=r=>{r.clientX>=t.x&&r.clientY>=t.y&&r.clientX<=t.x+t.width&&r.clientY<=t.y+t.height?this.change=i=>this.increment(i.shiftKey?this.stepModifier:1):r.clientX>=o.x&&r.clientY>=o.y&&r.clientX<=o.x+o.width&&r.clientY<=o.y+o.height&&(this.change=i=>this.decrement(i.shiftKey?this.stepModifier:1))},this.findChange(e),this.startChange(e)}startChange(e){this.changeCount=0,this.doChange(e),this.safty=setTimeout(()=>{this.doNextChange(e)},400)}doChange(e){this.change(e)}handlePointermove(e){this.findChange(e)}handlePointerup(e){this.buttons.releasePointerCapture(e.pointerId),cancelAnimationFrame(this.nextChange),clearTimeout(this.safty),this.managedInput=!1,this.setValue()}doNextChange(e){return this.changeCount+=1,this.changeCount%q===0&&this.doChange(e),requestAnimationFrame(()=>{this.nextChange=this.doNextChange(e)})}stepBy(e){if(this.disabled||this.readonly)return;const t=this.min===void 0?0:this.min;let o=this.value;o+=e*this._step,Number.isNaN(this.value)&&(o=t),o=this.valueWithLimits(o),this.requestUpdate(),this._value=this.validateInput(o),this.inputElement.value=this.numberFormatter.format(o),this.inputElement.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.indeterminate=!1,this.focus()}increment(e=1){this.stepBy(1*e)}decrement(e=1){this.stepBy(-1*e)}handleKeydown(e){if(!this.isComposing)switch(e.code){case"ArrowUp":{e.preventDefault(),this.increment(e.shiftKey?this.stepModifier:1),this.setValue();break}case"ArrowDown":{e.preventDefault(),this.decrement(e.shiftKey?this.stepModifier:1),this.setValue();break}}}onScroll(e){e.preventDefault(),this.managedInput=!0;const t=e.shiftKey?e.deltaX/Math.abs(e.deltaX):e.deltaY/Math.abs(e.deltaY);t!==0&&!Number.isNaN(t)&&(this.stepBy(t*(e.shiftKey?this.stepModifier:1)),clearTimeout(this.queuedChangeEvent),this.queuedChangeEvent=setTimeout(()=>{this.setValue()},N)),this.managedInput=!1}onFocus(){super.onFocus(),this._trackingValue=this.inputValue,this.keyboardFocused=!this.readonly&&!0,this.addEventListener("wheel",this.onScroll,{passive:!1}),this.valueBeforeFocus=this.inputElement.value}onBlur(e){super.onBlur(e),this.keyboardFocused=!this.readonly&&!1,this.removeEventListener("wheel",this.onScroll),this.isIntentDecimal=!1}handleFocusin(){this.focused=!this.readonly&&!0,this.keyboardFocused=!this.readonly&&!0}handleFocusout(){this.focused=!this.readonly&&!1,this.keyboardFocused=!this.readonly&&!1}handleChange(){const e=this.convertValueToNumber(this.inputValue);if(this.wasIndeterminate&&(this.wasIndeterminate=!1,this.indeterminateValue=void 0,Number.isNaN(e))){this.indeterminate=!0;return}this.setValue(e),this.inputElement.value=this.formattedValue}handleCompositionStart(){this.isComposing=!0}handleCompositionEnd(){this.isComposing=!1,requestAnimationFrame(()=>{this.inputElement.dispatchEvent(new Event("input",{composed:!0,bubbles:!0}))})}handleInputElementPointerdown(){this.hasRecentlyReceivedPointerDown=!0,this.updateComplete.then(()=>{requestAnimationFrame(()=>{this.hasRecentlyReceivedPointerDown=!1})})}handleInput(e){if(this.isComposing){if(e.data){const l=this.convertValueToNumber(e.data);Number.isNaN(l)&&(this.inputElement.value=this.indeterminate?b:this._trackingValue,this.isComposing=!1)}e.stopPropagation();return}this.indeterminate&&(this.wasIndeterminate=!0,this.indeterminateValue=this.value,this.inputElement.value=this.inputElement.value.replace(b,"")),e.data&&this.decimalsChars.has(e.data)&&(this.isIntentDecimal=!0);const{value:t,selectionStart:o}=this.inputElement,r=[...t].map(l=>w[l]||l).join("");if(this.numberParser.isValidPartialNumber(r)){this.lastCommitedValue=this.lastCommitedValue??this.value;const l=this.convertValueToNumber(r);!r&&this.indeterminateValue?(this.indeterminate=!0,this._value=this.indeterminateValue):(this.indeterminate=!1,this._value=this.validateInput(l)),this._trackingValue=r,this.inputElement.value=r,this.inputElement.setSelectionRange(o,o);return}this.inputElement.value=this.indeterminate?b:this._trackingValue,e.stopPropagation();const i=r.length,u=this._trackingValue.length,p=(o||i)-(i-u);this.inputElement.setSelectionRange(p,p)}valueWithLimits(e){let t=e;return this.min!==void 0&&(t=Math.max(this.min,t)),this.max!==void 0&&(t=Math.min(this.max,t)),t}validateInput(e){e=this.valueWithLimits(e);const t=e<0?-1:1;if(e*=t,this.step){const o=this.min===void 0?0:this.min,r=Number.parseFloat(this.valueFormatter.format((e-o)%this.step));if(r===0||(Math.round(r/this.step)===1?e+=this.step-r:e-=r),this.max!==void 0)for(;e>this.max;)e-=this.step;e=Number.parseFloat(this.valueFormatter.format(e))}return e*=t,e}get displayValue(){const e=this.focused?"":b;return this.indeterminate?e:this.formattedValue}clearNumberFormatterCache(){this._numberFormatter=void 0,this._numberParser=void 0}get numberFormatter(){if(!this._numberFormatter||!this._numberFormatterFocused){const{style:e,unit:t,unitDisplay:o,...r}=this.formatOptions;e!=="unit"&&(r.style=e),this._numberFormatterFocused=new f.$488c6ddbf4ef74c2$export$cc77c4ff7e8673c5(this.languageResolver.language,r);try{this._numberFormatter=new f.$488c6ddbf4ef74c2$export$cc77c4ff7e8673c5(this.languageResolver.language,this.formatOptions),this._forcedUnit="",this._numberFormatter.format(1)}catch{e==="unit"&&(this._forcedUnit=t),this._numberFormatter=this._numberFormatterFocused}}return this.focused?this._numberFormatterFocused:this._numberFormatter}clearValueFormatterCache(){this._valueFormatter=void 0}get valueFormatter(){if(!this._valueFormatter){const e=this.step?this.step===Math.floor(this.step)?0:this.step.toString().split(".")[1].length:0;this._valueFormatter=new f.$488c6ddbf4ef74c2$export$cc77c4ff7e8673c5("en",{useGrouping:!1,maximumFractionDigits:e})}return this._valueFormatter}get numberParser(){if(!this._numberParser||!this._numberParserFocused){const{style:e,unit:t,unitDisplay:o,...r}=this.formatOptions;e!=="unit"&&(r.style=e),this._numberParserFocused=new g.$6c7bd7858deea686$export$cd11ab140839f11d(this.languageResolver.language,r);try{this._numberParser=new g.$6c7bd7858deea686$export$cd11ab140839f11d(this.languageResolver.language,this.formatOptions),this._forcedUnit="",this._numberParser.parse("0")}catch{e==="unit"&&(this._forcedUnit=t),this._numberParser=this._numberParserFocused}}return this.focused?this._numberParserFocused:this._numberParser}renderField(){return this.autocomplete="off",s.x`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("../NumberFormatter-DewVDY5w.cjs"),g=require("../NumberParser-Dik4a0h-.cjs"),h=require("../luzmo-icons-DletXGWU.cjs"),s=require("../base-CBCg3yyw.cjs"),x=require("../query-BL-TJj7K.cjs"),c=require("../platform-BiXhwqk3.cjs"),z=require("../language-resolution-DJzmyzZq.cjs"),y=require("../streaming-listener-B00MvALi.cjs");require("../infield-button/index.cjs");const k=require("../text-field-D5d_Gt0t.cjs"),F='#text-field{--stepper-width: calc( var(--luzmo-stepper-height, var(--stepper-height)) * var( --luzmo-stepper-min-width-multiplier, var(--stepper-min-width-multiplier) ) + var(--luzmo-stepper-button-width, var(--stepper-button-width)) + var(--luzmo-stepper-border-width, var(--stepper-border-width)) * 2 );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color, var( --luzmo-stepper-buttons-border-color, var(--stepper-buttons-border-color) ) );--luzmo-infield-button-border-width: var( --luzmo-stepper-button-border-width, var(--stepper-button-border-width) );--luzmo-infield-button-border-radius-reset: var( --stepper-button-border-radius-reset );--luzmo-text-field-border-width: var( --luzmo-stepper-border-width, var(--stepper-border-width) );inline-size:var(--luzmo-stepper-width, var(--stepper-width));block-size:var(--luzmo-stepper-height, var(--stepper-height));border-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));border-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));flex-flow:row;display:inline-flex;position:relative}#text-field:after{content:"";inline-size:100%;block-size:var(--luzmo-stepper-focus-indicator-width, var(--stepper-focus-indicator-width));position:absolute;inset-block-end:calc((var(--luzmo-stepper-focus-indicator-gap, var(--stepper-focus-indicator-gap)) + var(--luzmo-stepper-focus-indicator-width, var(--stepper-focus-indicator-width))) * -1);inset-inline-start:0}:host([focused]) #text-field,#text-field:focus{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-focus, var(--luzmo-stepper-border-color-focus, var(--stepper-border-color-focus)) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus, var( --luzmo-stepper-buttons-border-color-focus, var(--stepper-buttons-border-color-focus) ) )}:host([focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus .input{outline:none}:host([focused]:not([disabled])) #text-field .buttons,:host([focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus .buttons,:host(:not([disabled])) #text-field:focus .input{border-color:var(--highcontrast-stepper-border-color-focus, var(--luzmo-stepper-border-color-focus, var(--stepper-border-color-focus)))}:host([keyboard-focused]) #text-field,#text-field:focus-visible{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-keyboard-focus, var( --luzmo-stepper-buttons-border-color-keyboard-focus, var(--stepper-buttons-border-color-keyboard-focus) ) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-keyboard-focus, var( --luzmo-stepper-buttons-border-color-keyboard-focus, var(--stepper-buttons-border-color-keyboard-focus) ) )}:host([keyboard-focused]:not([disabled])) #text-field,:host(:not([disabled])) #text-field:focus-visible{outline:var(--luzmo-stepper-focus-indicator-width, var(--stepper-focus-indicator-width)) solid;outline-color:var(--highcontrast-stepper-focus-indicator-color, var(--luzmo-stepper-focus-indicator-color, var(--stepper-focus-indicator-color)));outline-offset:var(--luzmo-stepper-focus-indicator-gap, var(--stepper-focus-indicator-gap))}:host([keyboard-focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus-visible .input{outline:none}:host([keyboard-focused]:not([disabled])) #text-field .buttons,:host([keyboard-focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus-visible .buttons,:host(:not([disabled])) #text-field:focus-visible .input{border-color:var(--highcontrast-stepper-border-color-keyboard-focus, var(--luzmo-stepper-border-color-keyboard-focus, var(--stepper-border-color-keyboard-focus)))}:host([invalid]:not([disabled])) #text-field{--luzmo-stepper-border-color: var( --luzmo-stepper-border-color-invalid, var(--stepper-border-color-invalid) );--luzmo-stepper-border-color-hover: var( --luzmo-stepper-border-color-hover-invalid, var(--stepper-border-color-hover-invalid) );--luzmo-stepper-border-color-focus: var( --luzmo-stepper-border-color-focus-invalid, var(--stepper-border-color-focus-invalid) );--luzmo-stepper-border-color-focus-hover: var( --luzmo-stepper-border-color-focus-hover-invalid, var(--stepper-border-color-focus-hover-invalid) );--luzmo-stepper-border-color-keyboard-focus: var( --luzmo-stepper-border-color-keyboard-focus-invalid, var(--stepper-border-color-keyboard-focus-invalid) );--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-invalid, var(--stepper-border-color-invalid) );--luzmo-text-field-icon-spacing-inline-start-invalid: 0}:host([invalid][focused]:not([disabled])) #text-field,:host([invalid]:not([disabled])) #text-field:focus{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-focus-invalid, var(--stepper-border-color-focus-invalid) )}:host([invalid][keyboard-focused]:not([disabled])) #text-field,:host([invalid]:not([disabled])) #text-field:focus-visible{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-keyboard-focus-invalid, var(--stepper-border-color-keyboard-focus-invalid) )}:host([disabled]) #text-field{--luzmo-stepper-border-color: var(--stepper-button-border-color-disabled);--luzmo-stepper-border-color-hover: var( --stepper-button-border-color-disabled );--luzmo-stepper-border-color-focus: var( --stepper-button-border-color-disabled );--luzmo-stepper-border-color-focus-hover: var( --stepper-button-border-color-disabled );--luzmo-stepper-border-color-keyboard-focus: var( --stepper-button-border-color-disabled );--luzmo-stepper-buttons-background-color: var( --stepper-buttons-background-color-disabled );--luzmo-infield-button-border-width: var( --stepper-button-border-width-disabled );--luzmo-infield-button-border-color: var( --stepper-button-border-color-disabled );--luzmo-text-field-border-color-disabled: var( --stepper-button-border-color-disabled )}#text-field .input{border-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));border-inline-end-width:0;border-start-end-radius:0;border-end-end-radius:0}#text-field.hide-stepper .input{border-inline-end-width:var(--luzmo-stepper-border-width, var(--stepper-border-width));border-start-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));border-end-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius))}#text-field .buttons{box-sizing:border-box;font-size:var(--luzmo-stepper-button-font-size, var(--stepper-button-font-size));block-size:var(--luzmo-stepper-height, var(--stepper-height));inline-size:var(--luzmo-stepper-button-width, var(--stepper-button-width));border-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));border-style:var(--luzmo-stepper-buttons-border-style, var(--stepper-buttons-border-style));border-width:var(--highcontrast-stepper-buttons-border-width, var(--luzmo-stepper-buttons-border-width, var(--stepper-buttons-border-width)));background-color:var(--highcontrast-stepper-buttons-background-color, var(--luzmo-stepper-buttons-background-color, var(--stepper-buttons-background-color)));transition:border-color var(--luzmo-stepper-animation-duration, var(--stepper-animation-duration)) ease-in-out;border-inline-start-width:0;border-start-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));border-end-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));flex-direction:column;justify-content:center;display:flex}:host([quiet]) #text-field{border-start-start-radius:0;border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:0}:host([quiet]) #text-field .input{--luzmo-text-field-focus-indicator-color: transparent}:host([quiet]) #text-field.hide-stepper .input{border-inline-end-width:0;border-end-end-radius:0}:host([quiet]) #text-field .buttons{--luzmo-infield-button-border-color: transparent;border-width:0;border-block-end-width:var(--luzmo-stepper-border-width, var(--stepper-border-width));border-block-end-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));border-block-end-style:solid;border-end-end-radius:0}:host([quiet]) #text-field .button{--luzmo-infield-button-width-stacked: var( --luzmo-stepper-button-width-quiet, var(--stepper-button-width) );--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-quiet, var(--stepper-button-border-color-quiet) );--luzmo-infield-button-stacked-bottom-border-block-end-width: var( --luzmo-stepper-border-width, var(--stepper-border-width) );--luzmo-infield-button-stacked-bottom-border-radius-end-end: 0;--luzmo-infield-button-stacked-bottom-border-radius-end-start: 0;--luzmo-infield-button-fill-justify-content: flex-end;padding:0}:host([quiet]) #text-field .buttons,:host([quiet]) #text-field .input{background-color:initial}:host([quiet][focused]) #text-field,:host([quiet]) #text-field:focus{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus, var(--luzmo-stepper-border-color-focus, var(--stepper-border-color-focus)) )}:host([quiet][keyboard-focused]:not([disabled])) #text-field{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-keyboard-focus, var( --luzmo-stepper-border-color-keyboard-focus, var(--stepper-border-color-keyboard-focus) ) );outline:none}:host([quiet][keyboard-focused]:not([disabled])) #text-field:after{background-color:var(--highcontrast-stepper-focus-indicator-color, var(--luzmo-stepper-focus-indicator-color, var(--stepper-focus-indicator-color)))}@media (hover: hover){:host(:hover:not([disabled])) #text-field{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-hover, var(--luzmo-stepper-border-color-hover, var(--stepper-border-color-hover)) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-hover, var( --luzmo-stepper-buttons-border-color-hover, var(--stepper-buttons-border-color-hover) ) )}:host([focused]:hover) #text-field,:host(:hover) #text-field:focus{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-focus-hover, var( --luzmo-stepper-buttons-border-color-focus-hover, var(--stepper-buttons-border-color-focus-hover) ) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus-hover, var( --luzmo-stepper-buttons-border-color-focus-hover, var(--stepper-buttons-border-color-focus-hover) ) )}:host([focused]:hover) #text-field .buttons,:host([focused]:hover) #text-field .input,:host(:hover) #text-field:focus .buttons,:host(:hover) #text-field:focus .input{border-color:var(--highcontrast-stepper-border-color-focus-hover, var(--luzmo-stepper-border-color-focus-hover, var(--stepper-border-color-focus-hover)))}:host([invalid]:not([disabled]):hover) #text-field{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-hover-invalid, var(--stepper-border-color-hover-invalid) )}:host([invalid][focused]:not([disabled]):hover) #text-field,:host([invalid]:not([disabled]):hover) #text-field:focus{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-focus-hover-invalid, var(--stepper-border-color-focus-hover-invalid) )}:host([quiet]:not([disabled]):hover) #text-field{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-hover, var(--luzmo-stepper-border-color-hover, var(--stepper-border-color-hover)) )}:host([quiet]:not([disabled]):hover) #text-field .buttons{background-color:initial}:host([quiet][focused]:hover) #text-field,:host([quiet]:hover) #text-field:focus{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus-hover, var( --luzmo-stepper-border-color-focus-hover, var(--stepper-border-color-focus-hover) ) )}:host([quiet][keyboard-focused]:not([disabled]):hover) #text-field{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-hover, var(--luzmo-stepper-border-color-hover, var(--stepper-border-color-hover)) )}}:host([invalid]) #text-field .icon,:host([valid]) #text-field .icon{inset-inline-end:calc(var(--stepper-button-width) + var(--luzmo-text-field-icon-spacing-inline-end-invalid, var(--text-field-icon-spacing-inline-end-invalid)))}@media (forced-colors: active){:host{--highcontrast-stepper-border-color: CanvasText;--highcontrast-stepper-border-color-hover: Highlight;--highcontrast-stepper-border-color-focus: Highlight;--highcontrast-stepper-border-color-focus-hover: Highlight;--highcontrast-stepper-border-color-keyboard-focus: CanvasText;--highcontrast-stepper-button-background-color-default: Canvas;--highcontrast-stepper-button-background-color-hover: Canvas;--highcontrast-stepper-button-background-color-focus: Canvas;--highcontrast-stepper-button-background-color-keyboard-focus: Canvas;--highcontrast-stepper-focus-indicator-color: Highlight}:host([invalid]) #text-field{--highcontrast-stepper-border-color: Highlight;--highcontrast-stepper-border-color-hover: Highlight;--highcontrast-stepper-border-color-focus: Highlight;--highcontrast-stepper-border-color-focus-hover: Highlight;--highcontrast-stepper-border-color-keyboard-focus: Highlight;--highcontrast-infield-button-border-color: Highlight}:host([disabled]) #text-field{--highcontrast-stepper-border-color: GrayText;--highcontrast-infield-button-border-color: GrayText;--highcontrast-stepper-buttons-border-width: var( --luzmo-stepper-border-width, var(--stepper-border-width) )}}:host{--text-field-minimum-width-multiplier: 1.75;--stepper-border-width: var(--luzmo-border-width);--stepper-border-color: var(--luzmo-border-color);--stepper-border-color-hover: var(--luzmo-border-color-full-hover);--stepper-border-color-focus: var(--luzmo-border-color-full-focus);--stepper-border-color-focus-hover: var(--luzmo-border-color-full-focus);--stepper-border-color-keyboard-focus: var(--luzmo-border-color-full-focus);--stepper-border-radius: var(--luzmo-border-radius);--stepper-min-width-multiplier: 1.5;--stepper-animation-duration: var(--luzmo-animation-duration);--stepper-buttons-background-color: var(--luzmo-background-color);--stepper-buttons-border-style: none;--stepper-buttons-border-width: 0;--stepper-buttons-border-color: var(--luzmo-border-color);--stepper-buttons-border-color-hover: var(--luzmo-border-color-full-hover);--stepper-buttons-border-color-focus: var(--luzmo-border-color-full-focus);--stepper-buttons-border-color-keyboard-focus: var( --luzmo-border-color-focus );--stepper-button-font-size: var(--luzmo-font-size);--stepper-button-padding: 0px;--stepper-button-border-radius-reset: 0;--stepper-button-border-width: var(--luzmo-border-width);--stepper-button-background-color-focus: var(--luzmo-background-color-focus);--stepper-button-background-color-keyboard-focus: var( --luzmo-background-color-focus );--stepper-border-color-invalid: var(--luzmo-negative-color);--stepper-border-color-hover-invalid: var(--luzmo-negative-color-hover);--stepper-border-color-focus-invalid: var(--luzmo-negative-color-focus);--stepper-border-color-focus-hover-invalid: var(--luzmo-negative-color-focus);--stepper-border-color-keyboard-focus-invalid: var( --luzmo-negative-color-focus );--stepper-focus-indicator-width: var(--luzmo-indicator-width);--stepper-focus-indicator-gap: calc(-1 * var(--luzmo-border-width));--stepper-focus-indicator-color: var(--luzmo-indicator-color);--stepper-button-border-color-quiet: transparent;--stepper-button-border-color-disabled: var(--luzmo-border-color-disabled);--stepper-button-border-width-disabled: var(--luzmo-border-width);--stepper-buttons-background-color-disabled: var( --luzmo-background-color-disabled );--stepper-button-width: 28px;--stepper-height: var(--luzmo-component-height)}:host([size=s]) #text-field{--stepper-button-width: 16px;--stepper-height: var(--luzmo-component-height-s)}:host([size=m]) #text-field{--stepper-button-width: 20px;--stepper-height: var(--luzmo-component-height)}:host([size=l]) #text-field{--stepper-button-width: 28px;--stepper-height: var(--luzmo-component-height-l)}:host([size=xl]) #text-field{--stepper-button-width: 36px;--stepper-height: var(--luzmo-component-height-xl)}:host{inline-size:var(--luzmo-stepper-width, var(--stepper-width));--swc-number-field-width: calc( var(--luzmo-stepper-height, var(--stepper-height)) * var( --luzmo-stepper-min-width-multiplier, var(--text-field-minimum-width-multiplier) ) + var(--luzmo-stepper-button-width, var(--stepper-button-width)) + var(--luzmo-stepper-border-width, var(--stepper-border-width)) * 2 );--luzmo-infield-button-border-width: var(--unset-value-resets-inheritance);--stepper-width: var(--swc-number-field-width)}:host([size=s]){--stepper-width: calc(var(--swc-number-field-width) / 5 * 4);--stepper-button-font-size: var(--luzmo-font-size-s)}:host([size=l]){--stepper-width: calc(var(--swc-number-field-width) * 1.25);--stepper-button-font-size: var(--luzmo-font-size-l)}:host([size=xl]){--stepper-width: calc(var(--swc-number-field-width) * 1.25 * 1.25);--stepper-button-font-size: var(--luzmo-font-size-xl)}#text-field{inline-size:100%}.input{font-variant-numeric:tabular-nums}:host([readonly]) .buttons{pointer-events:none;visibility:hidden}:host([readonly]:not([disabled],[invalid],[focused],[keyboard-focused])) #text-field:hover .input{border-color:transparent}:host([hide-stepper]:not([quiet])) #text-field input{border:var(--luzmo-stepper-border-width, var(--stepper-border-width)) solid var(--luzmo-stepper-border-color, var(--stepper-border-color));border-radius:var(--luzmo-border-radius)}:host([quiet]) #text-field .button{--luzmo-infield-button-border-color: var( --luzmo-infield-border-color-quiet, transparent );--luzmo-infield-button-edge-to-fill: 0;--luzmo-infield-button-border-width: var( --luzmo-infield-button-border-width-quiet, 0 )}';var C=Object.defineProperty,_=Object.getOwnPropertyDescriptor,d=(f,e,t,o)=>{for(var r=o>1?void 0:o?_(e,t):e,i=f.length-1,u;i>=0;i--)(u=f[i])&&(r=(o?u(e,t,r):u(r))||r);return o&&r&&C(e,t,r),r};const q=5,N=100,b="-",w={"１":"1","２":"2","３":"3","４":"4","５":"5","６":"6","７":"7","８":"8","９":"9","０":"0","、":",","，":",","。":".","．":".","％":"%","＋":"+",ー:"-",一:"1",二:"2",三:"3",四:"4",五:"5",六:"6",七:"7",八:"8",九:"9",零:"0"};class a extends k.LuzmoTextFieldBase{constructor(){super(...arguments),this.focused=!1,this._forcedUnit="",this.formatOptions={},this.hideStepper=!1,this.indeterminate=!1,this.keyboardFocused=!1,this.managedInput=!1,this.stepModifier=10,this._value=Number.NaN,this._trackingValue="",this.decimalsChars=new Set([".",","]),this.valueBeforeFocus="",this.isIntentDecimal=!1,this.changeCount=0,this.languageResolver=new z.LanguageResolutionController(this),this.wasIndeterminate=!1,this.hasRecentlyReceivedPointerDown=!1,this.applyFocusElementLabel=e=>{this.appliedLabel=e},this.isComposing=!1}static get styles(){return[...super.styles,s.r(F)]}set value(e){const t=this.validateInput(e);if(t===this.value)return;this.lastCommitedValue=t;const o=this._value;this._value=t,this.requestUpdate("value",o)}get value(){return this._value}get inputValue(){return this.indeterminate?this.formattedValue:this.inputElement.value}setValue(e=this.value){const t=this.lastCommitedValue;this.value=e,!(t===void 0||t===this.value)&&(this.lastCommitedValue=this.value,this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}get valueAsString(){return this._value.toString()}set valueAsString(e){this.value=this.numberParser.parse(e)}get formattedValue(){return Number.isNaN(this.value)?"":this.numberFormatter.format(this.value)+(this.focused?"":this._forcedUnit)}convertValueToNumber(e){let t=[...e].map(i=>w[i]||i).join("");const o=[...this.valueBeforeFocus].filter(i=>this.decimalsChars.has(i)),r=new Set(o);if(c.isIOS()&&this.inputElement.inputMode==="decimal"&&t!==this.valueBeforeFocus){const u=this.numberFormatter.formatToParts(1000.1).find(n=>n.type==="decimal").value;for(const n of r)!(n===u)&&!this.isIntentDecimal&&(t=t.replaceAll(new RegExp(n,"g"),""));let p=!1;const l=[...t];for(let n=l.length-1;n>=0;n--){const v=l[n];this.decimalsChars.has(v)&&(p?l[n]="":(l[n]=u,p=!0))}t=l.join("")}return this.numberParser.parse(t)}get _step(){var e;return this.step!==void 0?this.step:((e=this.formatOptions)==null?void 0:e.style)==="percent"?.01:1}handlePointerdown(e){if(e.button!==0){e.preventDefault();return}this.managedInput=!0,this.buttons.setPointerCapture(e.pointerId);const t=this.buttons.children[0].getBoundingClientRect(),o=this.buttons.children[1].getBoundingClientRect();this.findChange=r=>{r.clientX>=t.x&&r.clientY>=t.y&&r.clientX<=t.x+t.width&&r.clientY<=t.y+t.height?this.change=i=>this.increment(i.shiftKey?this.stepModifier:1):r.clientX>=o.x&&r.clientY>=o.y&&r.clientX<=o.x+o.width&&r.clientY<=o.y+o.height&&(this.change=i=>this.decrement(i.shiftKey?this.stepModifier:1))},this.findChange(e),this.startChange(e)}startChange(e){this.changeCount=0,this.doChange(e),this.safty=setTimeout(()=>{this.doNextChange(e)},400)}doChange(e){this.change(e)}handlePointermove(e){this.findChange(e)}handlePointerup(e){this.buttons.releasePointerCapture(e.pointerId),cancelAnimationFrame(this.nextChange),clearTimeout(this.safty),this.managedInput=!1,this.setValue()}doNextChange(e){return this.changeCount+=1,this.changeCount%q===0&&this.doChange(e),requestAnimationFrame(()=>{this.nextChange=this.doNextChange(e)})}stepBy(e){if(this.disabled||this.readonly)return;const t=this.min===void 0?0:this.min;let o=this.value;o+=e*this._step,Number.isNaN(this.value)&&(o=t),o=this.valueWithLimits(o),this.requestUpdate(),this._value=this.validateInput(o),this.inputElement.value=this.numberFormatter.format(o),this.inputElement.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.indeterminate=!1,this.focus()}increment(e=1){this.stepBy(1*e)}decrement(e=1){this.stepBy(-1*e)}handleKeydown(e){if(!this.isComposing)switch(e.code){case"ArrowUp":{e.preventDefault(),this.increment(e.shiftKey?this.stepModifier:1),this.setValue();break}case"ArrowDown":{e.preventDefault(),this.decrement(e.shiftKey?this.stepModifier:1),this.setValue();break}}}onScroll(e){e.preventDefault(),this.managedInput=!0;const t=e.shiftKey?e.deltaX/Math.abs(e.deltaX):e.deltaY/Math.abs(e.deltaY);t!==0&&!Number.isNaN(t)&&(this.stepBy(t*(e.shiftKey?this.stepModifier:1)),clearTimeout(this.queuedChangeEvent),this.queuedChangeEvent=setTimeout(()=>{this.setValue()},N)),this.managedInput=!1}onFocus(){super.onFocus(),this._trackingValue=this.inputValue,this.keyboardFocused=!this.readonly&&!0,this.addEventListener("wheel",this.onScroll,{passive:!1}),this.valueBeforeFocus=this.inputElement.value}onBlur(e){super.onBlur(e),this.keyboardFocused=!this.readonly&&!1,this.removeEventListener("wheel",this.onScroll),this.isIntentDecimal=!1}handleFocusin(){this.focused=!this.readonly&&!0,this.keyboardFocused=!this.readonly&&!0}handleFocusout(){this.focused=!this.readonly&&!1,this.keyboardFocused=!this.readonly&&!1}handleChange(){const e=this.convertValueToNumber(this.inputValue);if(this.wasIndeterminate&&(this.wasIndeterminate=!1,this.indeterminateValue=void 0,Number.isNaN(e))){this.indeterminate=!0;return}this.setValue(e),this.inputElement.value=this.formattedValue}handleCompositionStart(){this.isComposing=!0}handleCompositionEnd(){this.isComposing=!1,requestAnimationFrame(()=>{this.inputElement.dispatchEvent(new Event("input",{composed:!0,bubbles:!0}))})}handleInputElementPointerdown(){this.hasRecentlyReceivedPointerDown=!0,this.updateComplete.then(()=>{requestAnimationFrame(()=>{this.hasRecentlyReceivedPointerDown=!1})})}handleInput(e){if(this.isComposing){if(e.data){const l=this.convertValueToNumber(e.data);Number.isNaN(l)&&(this.inputElement.value=this.indeterminate?b:this._trackingValue,this.isComposing=!1)}e.stopPropagation();return}this.indeterminate&&(this.wasIndeterminate=!0,this.indeterminateValue=this.value,this.inputElement.value=this.inputElement.value.replace(b,"")),e.data&&this.decimalsChars.has(e.data)&&(this.isIntentDecimal=!0);const{value:t,selectionStart:o}=this.inputElement,r=[...t].map(l=>w[l]||l).join("");if(this.numberParser.isValidPartialNumber(r)){this.lastCommitedValue=this.lastCommitedValue??this.value;const l=this.convertValueToNumber(r);!r&&this.indeterminateValue?(this.indeterminate=!0,this._value=this.indeterminateValue):(this.indeterminate=!1,this._value=this.validateInput(l)),this._trackingValue=r,this.inputElement.value=r,this.inputElement.setSelectionRange(o,o);return}this.inputElement.value=this.indeterminate?b:this._trackingValue,e.stopPropagation();const i=r.length,u=this._trackingValue.length,p=(o||i)-(i-u);this.inputElement.setSelectionRange(p,p)}valueWithLimits(e){let t=e;return this.min!==void 0&&(t=Math.max(this.min,t)),this.max!==void 0&&(t=Math.min(this.max,t)),t}validateInput(e){e=this.valueWithLimits(e);const t=e<0?-1:1;if(e*=t,this.step){const o=this.min===void 0?0:this.min,r=Number.parseFloat(this.valueFormatter.format((e-o)%this.step));if(r===0||(Math.round(r/this.step)===1?e+=this.step-r:e-=r),this.max!==void 0)for(;e>this.max;)e-=this.step;e=Number.parseFloat(this.valueFormatter.format(e))}return e*=t,e}get displayValue(){const e=this.focused?"":b;return this.indeterminate?e:this.formattedValue}clearNumberFormatterCache(){this._numberFormatter=void 0,this._numberParser=void 0}get numberFormatter(){if(!this._numberFormatter||!this._numberFormatterFocused){const{style:e,unit:t,unitDisplay:o,...r}=this.formatOptions;e!=="unit"&&(r.style=e),this._numberFormatterFocused=new m.$488c6ddbf4ef74c2$export$cc77c4ff7e8673c5(this.languageResolver.language,r);try{this._numberFormatter=new m.$488c6ddbf4ef74c2$export$cc77c4ff7e8673c5(this.languageResolver.language,this.formatOptions),this._forcedUnit="",this._numberFormatter.format(1)}catch{e==="unit"&&(this._forcedUnit=t),this._numberFormatter=this._numberFormatterFocused}}return this.focused?this._numberFormatterFocused:this._numberFormatter}clearValueFormatterCache(){this._valueFormatter=void 0}get valueFormatter(){if(!this._valueFormatter){const e=this.step?this.step===Math.floor(this.step)?0:this.step.toString().split(".")[1].length:0;this._valueFormatter=new m.$488c6ddbf4ef74c2$export$cc77c4ff7e8673c5("en",{useGrouping:!1,maximumFractionDigits:e})}return this._valueFormatter}get numberParser(){if(!this._numberParser||!this._numberParserFocused){const{style:e,unit:t,unitDisplay:o,...r}=this.formatOptions;e!=="unit"&&(r.style=e),this._numberParserFocused=new g.$6c7bd7858deea686$export$cd11ab140839f11d(this.languageResolver.language,r);try{this._numberParser=new g.$6c7bd7858deea686$export$cd11ab140839f11d(this.languageResolver.language,this.formatOptions),this._forcedUnit="",this._numberParser.parse("0")}catch{e==="unit"&&(this._forcedUnit=t),this._numberParser=this._numberParserFocused}}return this.focused?this._numberParserFocused:this._numberParser}renderField(){return this.autocomplete="off",s.x`
       ${super.renderField()}
       ${this.hideStepper?s.E:s.x`
             <span
@@ -36,7 +36,7 @@
                 ?disabled=${this.disabled||this.readonly||this.max!==void 0&&this.value===this.max}
                 ?quiet=${this.quiet}
               >
-                ${h.luzmoIcon(h.luzmoAngleUp)}
+                ${h.O2(h.b)}
               </luzmo-infield-button>
               <luzmo-infield-button
                 inline="end"
@@ -50,7 +50,7 @@
                 ?disabled=${this.disabled||this.readonly||this.min!==void 0&&this.value===this.min}
                 ?quiet=${this.quiet}
               >
-                ${h.luzmoIcon(h.luzmoAngleDown)}
+                ${h.O2(h.T)}
               </luzmo-infield-button>
             </span>
           `}

package/components/number-field/index.js

@@ -17,14 +17,14 @@
  * */
 import { $ as b } from "../NumberFormatter-DgOUVrge.js";
 import { $ as f } from "../NumberParser-ci9J5EKv.js";
-import { luzmoIcon as v, luzmoAngleUp as y, luzmoAngleDown as k } from "@luzmo/icons";
-import { r as C, E as F, x as z, n } from "../base-DroC2Znx.js";
+import { O as v, b as y, T as k } from "../luzmo-icons-DbwDQtuO.js";
+import { r as C, E as F, x as z, n } from "../base-WsynuqaS.js";
 import { e as _ } from "../query-D_KR_GUc.js";
 import { c as g, a as V, j as N } from "../platform-BM-uMWpX.js";
 import { L as P, l as E } from "../language-resolution-8yZa5r_P.js";
-import { s as q } from "../streaming-listener-Dxbr_Jiv.js";
+import { s as q } from "../streaming-listener-CP-JE6Fa.js";
 import "../infield-button/index.js";
-import { a as S } from "../text-field-DWC0tpq4.js";
+import { a as S } from "../text-field-BIADXoLC.js";
 const w = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const p = document.createElement("style");
@@ -33,12 +33,12 @@ const w = () => {
 };
 w();
 const D = '#text-field{--stepper-width: calc( var(--luzmo-stepper-height, var(--stepper-height)) * var( --luzmo-stepper-min-width-multiplier, var(--stepper-min-width-multiplier) ) + var(--luzmo-stepper-button-width, var(--stepper-button-width)) + var(--luzmo-stepper-border-width, var(--stepper-border-width)) * 2 );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color, var( --luzmo-stepper-buttons-border-color, var(--stepper-buttons-border-color) ) );--luzmo-infield-button-border-width: var( --luzmo-stepper-button-border-width, var(--stepper-button-border-width) );--luzmo-infield-button-border-radius-reset: var( --stepper-button-border-radius-reset );--luzmo-text-field-border-width: var( --luzmo-stepper-border-width, var(--stepper-border-width) );inline-size:var(--luzmo-stepper-width, var(--stepper-width));block-size:var(--luzmo-stepper-height, var(--stepper-height));border-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));border-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));flex-flow:row;display:inline-flex;position:relative}#text-field:after{content:"";inline-size:100%;block-size:var(--luzmo-stepper-focus-indicator-width, var(--stepper-focus-indicator-width));position:absolute;inset-block-end:calc((var(--luzmo-stepper-focus-indicator-gap, var(--stepper-focus-indicator-gap)) + var(--luzmo-stepper-focus-indicator-width, var(--stepper-focus-indicator-width))) * -1);inset-inline-start:0}:host([focused]) #text-field,#text-field:focus{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-focus, var(--luzmo-stepper-border-color-focus, var(--stepper-border-color-focus)) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus, var( --luzmo-stepper-buttons-border-color-focus, var(--stepper-buttons-border-color-focus) ) )}:host([focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus .input{outline:none}:host([focused]:not([disabled])) #text-field .buttons,:host([focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus .buttons,:host(:not([disabled])) #text-field:focus .input{border-color:var(--highcontrast-stepper-border-color-focus, var(--luzmo-stepper-border-color-focus, var(--stepper-border-color-focus)))}:host([keyboard-focused]) #text-field,#text-field:focus-visible{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-keyboard-focus, var( --luzmo-stepper-buttons-border-color-keyboard-focus, var(--stepper-buttons-border-color-keyboard-focus) ) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-keyboard-focus, var( --luzmo-stepper-buttons-border-color-keyboard-focus, var(--stepper-buttons-border-color-keyboard-focus) ) )}:host([keyboard-focused]:not([disabled])) #text-field,:host(:not([disabled])) #text-field:focus-visible{outline:var(--luzmo-stepper-focus-indicator-width, var(--stepper-focus-indicator-width)) solid;outline-color:var(--highcontrast-stepper-focus-indicator-color, var(--luzmo-stepper-focus-indicator-color, var(--stepper-focus-indicator-color)));outline-offset:var(--luzmo-stepper-focus-indicator-gap, var(--stepper-focus-indicator-gap))}:host([keyboard-focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus-visible .input{outline:none}:host([keyboard-focused]:not([disabled])) #text-field .buttons,:host([keyboard-focused]:not([disabled])) #text-field .input,:host(:not([disabled])) #text-field:focus-visible .buttons,:host(:not([disabled])) #text-field:focus-visible .input{border-color:var(--highcontrast-stepper-border-color-keyboard-focus, var(--luzmo-stepper-border-color-keyboard-focus, var(--stepper-border-color-keyboard-focus)))}:host([invalid]:not([disabled])) #text-field{--luzmo-stepper-border-color: var( --luzmo-stepper-border-color-invalid, var(--stepper-border-color-invalid) );--luzmo-stepper-border-color-hover: var( --luzmo-stepper-border-color-hover-invalid, var(--stepper-border-color-hover-invalid) );--luzmo-stepper-border-color-focus: var( --luzmo-stepper-border-color-focus-invalid, var(--stepper-border-color-focus-invalid) );--luzmo-stepper-border-color-focus-hover: var( --luzmo-stepper-border-color-focus-hover-invalid, var(--stepper-border-color-focus-hover-invalid) );--luzmo-stepper-border-color-keyboard-focus: var( --luzmo-stepper-border-color-keyboard-focus-invalid, var(--stepper-border-color-keyboard-focus-invalid) );--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-invalid, var(--stepper-border-color-invalid) );--luzmo-text-field-icon-spacing-inline-start-invalid: 0}:host([invalid][focused]:not([disabled])) #text-field,:host([invalid]:not([disabled])) #text-field:focus{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-focus-invalid, var(--stepper-border-color-focus-invalid) )}:host([invalid][keyboard-focused]:not([disabled])) #text-field,:host([invalid]:not([disabled])) #text-field:focus-visible{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-keyboard-focus-invalid, var(--stepper-border-color-keyboard-focus-invalid) )}:host([disabled]) #text-field{--luzmo-stepper-border-color: var(--stepper-button-border-color-disabled);--luzmo-stepper-border-color-hover: var( --stepper-button-border-color-disabled );--luzmo-stepper-border-color-focus: var( --stepper-button-border-color-disabled );--luzmo-stepper-border-color-focus-hover: var( --stepper-button-border-color-disabled );--luzmo-stepper-border-color-keyboard-focus: var( --stepper-button-border-color-disabled );--luzmo-stepper-buttons-background-color: var( --stepper-buttons-background-color-disabled );--luzmo-infield-button-border-width: var( --stepper-button-border-width-disabled );--luzmo-infield-button-border-color: var( --stepper-button-border-color-disabled );--luzmo-text-field-border-color-disabled: var( --stepper-button-border-color-disabled )}#text-field .input{border-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));border-inline-end-width:0;border-start-end-radius:0;border-end-end-radius:0}#text-field.hide-stepper .input{border-inline-end-width:var(--luzmo-stepper-border-width, var(--stepper-border-width));border-start-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));border-end-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius))}#text-field .buttons{box-sizing:border-box;font-size:var(--luzmo-stepper-button-font-size, var(--stepper-button-font-size));block-size:var(--luzmo-stepper-height, var(--stepper-height));inline-size:var(--luzmo-stepper-button-width, var(--stepper-button-width));border-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));border-style:var(--luzmo-stepper-buttons-border-style, var(--stepper-buttons-border-style));border-width:var(--highcontrast-stepper-buttons-border-width, var(--luzmo-stepper-buttons-border-width, var(--stepper-buttons-border-width)));background-color:var(--highcontrast-stepper-buttons-background-color, var(--luzmo-stepper-buttons-background-color, var(--stepper-buttons-background-color)));transition:border-color var(--luzmo-stepper-animation-duration, var(--stepper-animation-duration)) ease-in-out;border-inline-start-width:0;border-start-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));border-end-end-radius:var(--luzmo-stepper-border-radius, var(--stepper-border-radius));flex-direction:column;justify-content:center;display:flex}:host([quiet]) #text-field{border-start-start-radius:0;border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:0}:host([quiet]) #text-field .input{--luzmo-text-field-focus-indicator-color: transparent}:host([quiet]) #text-field.hide-stepper .input{border-inline-end-width:0;border-end-end-radius:0}:host([quiet]) #text-field .buttons{--luzmo-infield-button-border-color: transparent;border-width:0;border-block-end-width:var(--luzmo-stepper-border-width, var(--stepper-border-width));border-block-end-color:var(--highcontrast-stepper-border-color, var(--luzmo-stepper-border-color, var(--stepper-border-color)));border-block-end-style:solid;border-end-end-radius:0}:host([quiet]) #text-field .button{--luzmo-infield-button-width-stacked: var( --luzmo-stepper-button-width-quiet, var(--stepper-button-width) );--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-quiet, var(--stepper-button-border-color-quiet) );--luzmo-infield-button-stacked-bottom-border-block-end-width: var( --luzmo-stepper-border-width, var(--stepper-border-width) );--luzmo-infield-button-stacked-bottom-border-radius-end-end: 0;--luzmo-infield-button-stacked-bottom-border-radius-end-start: 0;--luzmo-infield-button-fill-justify-content: flex-end;padding:0}:host([quiet]) #text-field .buttons,:host([quiet]) #text-field .input{background-color:initial}:host([quiet][focused]) #text-field,:host([quiet]) #text-field:focus{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus, var(--luzmo-stepper-border-color-focus, var(--stepper-border-color-focus)) )}:host([quiet][keyboard-focused]:not([disabled])) #text-field{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-keyboard-focus, var( --luzmo-stepper-border-color-keyboard-focus, var(--stepper-border-color-keyboard-focus) ) );outline:none}:host([quiet][keyboard-focused]:not([disabled])) #text-field:after{background-color:var(--highcontrast-stepper-focus-indicator-color, var(--luzmo-stepper-focus-indicator-color, var(--stepper-focus-indicator-color)))}@media (hover: hover){:host(:hover:not([disabled])) #text-field{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-hover, var(--luzmo-stepper-border-color-hover, var(--stepper-border-color-hover)) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-hover, var( --luzmo-stepper-buttons-border-color-hover, var(--stepper-buttons-border-color-hover) ) )}:host([focused]:hover) #text-field,:host(:hover) #text-field:focus{--luzmo-stepper-border-color: var( --highcontrast-stepper-border-color-focus-hover, var( --luzmo-stepper-buttons-border-color-focus-hover, var(--stepper-buttons-border-color-focus-hover) ) );--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus-hover, var( --luzmo-stepper-buttons-border-color-focus-hover, var(--stepper-buttons-border-color-focus-hover) ) )}:host([focused]:hover) #text-field .buttons,:host([focused]:hover) #text-field .input,:host(:hover) #text-field:focus .buttons,:host(:hover) #text-field:focus .input{border-color:var(--highcontrast-stepper-border-color-focus-hover, var(--luzmo-stepper-border-color-focus-hover, var(--stepper-border-color-focus-hover)))}:host([invalid]:not([disabled]):hover) #text-field{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-hover-invalid, var(--stepper-border-color-hover-invalid) )}:host([invalid][focused]:not([disabled]):hover) #text-field,:host([invalid]:not([disabled]):hover) #text-field:focus{--luzmo-infield-button-border-color: var( --luzmo-stepper-border-color-focus-hover-invalid, var(--stepper-border-color-focus-hover-invalid) )}:host([quiet]:not([disabled]):hover) #text-field{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-hover, var(--luzmo-stepper-border-color-hover, var(--stepper-border-color-hover)) )}:host([quiet]:not([disabled]):hover) #text-field .buttons{background-color:initial}:host([quiet][focused]:hover) #text-field,:host([quiet]:hover) #text-field:focus{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-focus-hover, var( --luzmo-stepper-border-color-focus-hover, var(--stepper-border-color-focus-hover) ) )}:host([quiet][keyboard-focused]:not([disabled]):hover) #text-field{--luzmo-infield-button-border-color: var( --highcontrast-stepper-border-color-hover, var(--luzmo-stepper-border-color-hover, var(--stepper-border-color-hover)) )}}:host([invalid]) #text-field .icon,:host([valid]) #text-field .icon{inset-inline-end:calc(var(--stepper-button-width) + var(--luzmo-text-field-icon-spacing-inline-end-invalid, var(--text-field-icon-spacing-inline-end-invalid)))}@media (forced-colors: active){:host{--highcontrast-stepper-border-color: CanvasText;--highcontrast-stepper-border-color-hover: Highlight;--highcontrast-stepper-border-color-focus: Highlight;--highcontrast-stepper-border-color-focus-hover: Highlight;--highcontrast-stepper-border-color-keyboard-focus: CanvasText;--highcontrast-stepper-button-background-color-default: Canvas;--highcontrast-stepper-button-background-color-hover: Canvas;--highcontrast-stepper-button-background-color-focus: Canvas;--highcontrast-stepper-button-background-color-keyboard-focus: Canvas;--highcontrast-stepper-focus-indicator-color: Highlight}:host([invalid]) #text-field{--highcontrast-stepper-border-color: Highlight;--highcontrast-stepper-border-color-hover: Highlight;--highcontrast-stepper-border-color-focus: Highlight;--highcontrast-stepper-border-color-focus-hover: Highlight;--highcontrast-stepper-border-color-keyboard-focus: Highlight;--highcontrast-infield-button-border-color: Highlight}:host([disabled]) #text-field{--highcontrast-stepper-border-color: GrayText;--highcontrast-infield-button-border-color: GrayText;--highcontrast-stepper-buttons-border-width: var( --luzmo-stepper-border-width, var(--stepper-border-width) )}}:host{--text-field-minimum-width-multiplier: 1.75;--stepper-border-width: var(--luzmo-border-width);--stepper-border-color: var(--luzmo-border-color);--stepper-border-color-hover: var(--luzmo-border-color-full-hover);--stepper-border-color-focus: var(--luzmo-border-color-full-focus);--stepper-border-color-focus-hover: var(--luzmo-border-color-full-focus);--stepper-border-color-keyboard-focus: var(--luzmo-border-color-full-focus);--stepper-border-radius: var(--luzmo-border-radius);--stepper-min-width-multiplier: 1.5;--stepper-animation-duration: var(--luzmo-animation-duration);--stepper-buttons-background-color: var(--luzmo-background-color);--stepper-buttons-border-style: none;--stepper-buttons-border-width: 0;--stepper-buttons-border-color: var(--luzmo-border-color);--stepper-buttons-border-color-hover: var(--luzmo-border-color-full-hover);--stepper-buttons-border-color-focus: var(--luzmo-border-color-full-focus);--stepper-buttons-border-color-keyboard-focus: var( --luzmo-border-color-focus );--stepper-button-font-size: var(--luzmo-font-size);--stepper-button-padding: 0px;--stepper-button-border-radius-reset: 0;--stepper-button-border-width: var(--luzmo-border-width);--stepper-button-background-color-focus: var(--luzmo-background-color-focus);--stepper-button-background-color-keyboard-focus: var( --luzmo-background-color-focus );--stepper-border-color-invalid: var(--luzmo-negative-color);--stepper-border-color-hover-invalid: var(--luzmo-negative-color-hover);--stepper-border-color-focus-invalid: var(--luzmo-negative-color-focus);--stepper-border-color-focus-hover-invalid: var(--luzmo-negative-color-focus);--stepper-border-color-keyboard-focus-invalid: var( --luzmo-negative-color-focus );--stepper-focus-indicator-width: var(--luzmo-indicator-width);--stepper-focus-indicator-gap: calc(-1 * var(--luzmo-border-width));--stepper-focus-indicator-color: var(--luzmo-indicator-color);--stepper-button-border-color-quiet: transparent;--stepper-button-border-color-disabled: var(--luzmo-border-color-disabled);--stepper-button-border-width-disabled: var(--luzmo-border-width);--stepper-buttons-background-color-disabled: var( --luzmo-background-color-disabled );--stepper-button-width: 28px;--stepper-height: var(--luzmo-component-height)}:host([size=s]) #text-field{--stepper-button-width: 16px;--stepper-height: var(--luzmo-component-height-s)}:host([size=m]) #text-field{--stepper-button-width: 20px;--stepper-height: var(--luzmo-component-height)}:host([size=l]) #text-field{--stepper-button-width: 28px;--stepper-height: var(--luzmo-component-height-l)}:host([size=xl]) #text-field{--stepper-button-width: 36px;--stepper-height: var(--luzmo-component-height-xl)}:host{inline-size:var(--luzmo-stepper-width, var(--stepper-width));--swc-number-field-width: calc( var(--luzmo-stepper-height, var(--stepper-height)) * var( --luzmo-stepper-min-width-multiplier, var(--text-field-minimum-width-multiplier) ) + var(--luzmo-stepper-button-width, var(--stepper-button-width)) + var(--luzmo-stepper-border-width, var(--stepper-border-width)) * 2 );--luzmo-infield-button-border-width: var(--unset-value-resets-inheritance);--stepper-width: var(--swc-number-field-width)}:host([size=s]){--stepper-width: calc(var(--swc-number-field-width) / 5 * 4);--stepper-button-font-size: var(--luzmo-font-size-s)}:host([size=l]){--stepper-width: calc(var(--swc-number-field-width) * 1.25);--stepper-button-font-size: var(--luzmo-font-size-l)}:host([size=xl]){--stepper-width: calc(var(--swc-number-field-width) * 1.25 * 1.25);--stepper-button-font-size: var(--luzmo-font-size-xl)}#text-field{inline-size:100%}.input{font-variant-numeric:tabular-nums}:host([readonly]) .buttons{pointer-events:none;visibility:hidden}:host([readonly]:not([disabled],[invalid],[focused],[keyboard-focused])) #text-field:hover .input{border-color:transparent}:host([hide-stepper]:not([quiet])) #text-field input{border:var(--luzmo-stepper-border-width, var(--stepper-border-width)) solid var(--luzmo-stepper-border-color, var(--stepper-border-color));border-radius:var(--luzmo-border-radius)}:host([quiet]) #text-field .button{--luzmo-infield-button-border-color: var( --luzmo-infield-border-color-quiet, transparent );--luzmo-infield-button-edge-to-fill: 0;--luzmo-infield-button-border-width: var( --luzmo-infield-button-border-width-quiet, 0 )}';
-var I = Object.defineProperty, R = Object.getOwnPropertyDescriptor, a = (p, e, o, r) => {
-  for (var t = r > 1 ? void 0 : r ? R(e, o) : e, i = p.length - 1, u; i >= 0; i--)
+var R = Object.defineProperty, I = Object.getOwnPropertyDescriptor, a = (p, e, o, r) => {
+  for (var t = r > 1 ? void 0 : r ? I(e, o) : e, i = p.length - 1, u; i >= 0; i--)
     (u = p[i]) && (t = (r ? u(e, o, t) : u(t)) || t);
-  return r && t && I(e, o, t), t;
+  return r && t && R(e, o, t), t;
 };
-const $ = 5, O = 100, h = "-", x = {
+const O = 5, $ = 100, h = "-", x = {
   "１": "1",
   "２": "2",
   "３": "3",
@@ -160,7 +160,7 @@ class l extends S {
     this.buttons.releasePointerCapture(e.pointerId), cancelAnimationFrame(this.nextChange), clearTimeout(this.safty), this.managedInput = !1, this.setValue();
   }
   doNextChange(e) {
-    return this.changeCount += 1, this.changeCount % $ === 0 && this.doChange(e), requestAnimationFrame(() => {
+    return this.changeCount += 1, this.changeCount % O === 0 && this.doChange(e), requestAnimationFrame(() => {
       this.nextChange = this.doNextChange(e);
     });
   }
@@ -197,7 +197,7 @@ class l extends S {
     const o = e.shiftKey ? e.deltaX / Math.abs(e.deltaX) : e.deltaY / Math.abs(e.deltaY);
     o !== 0 && !Number.isNaN(o) && (this.stepBy(o * (e.shiftKey ? this.stepModifier : 1)), clearTimeout(this.queuedChangeEvent), this.queuedChangeEvent = setTimeout(() => {
       this.setValue();
-    }, O)), this.managedInput = !1;
+    }, $)), this.managedInput = !1;
   }
   onFocus() {
     super.onFocus(), this._trackingValue = this.inputValue, this.keyboardFocused = !this.readonly && !0, this.addEventListener("wheel", this.onScroll, { passive: !1 }), this.valueBeforeFocus = this.inputElement.value;

package/components/{observe-slot-text-BMloiRX5.js → observe-slot-text-BPfIQQtz.js}

@@ -16,7 +16,7 @@
  * SOFTWARE.
  * */
 import { s as m } from "./mutation-controller-DH7YOCyj.js";
-import { n as x } from "./base-DroC2Znx.js";
+import { n as x } from "./base-WsynuqaS.js";
 import { n as b } from "./query-assigned-nodes-C76XVPWY.js";
 var g = Object.defineProperty, p = (d, n, i, f) => {
   for (var t = void 0, o = d.length - 1, r; o >= 0; o--)

package/components/{observe-slot-text-BzdHQBH3.cjs → observe-slot-text-Ceb7SvYT.cjs}

@@ -15,4 +15,4 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";const b=require("./mutation-controller-DkOMCW-c.cjs"),g=require("./base-CTSOJw6c.cjs"),x=require("./query-assigned-nodes-BcKWmGzy.cjs");var m=Object.defineProperty,h=(d,n,i,u)=>{for(var t=void 0,r=d.length-1,o;r>=0;r--)(o=d[r])&&(t=o(n,i,t)||t);return t&&m(n,i,t),t};const c=Symbol("assignedNodes");function v(d,n,i=[]){var u,t;const r=f=>e=>f.matches(e);class o extends(t=d,u=c,t){constructor(...e){super(e),this.slotHasContent=!1,new b.s(this,{config:{characterData:!0,subtree:!0},callback:l=>{for(const s of l)if(s.type==="characterData"){this.manageTextObservedSlot();return}}})}manageTextObservedSlot(){if(!this[c])return;const e=[...this[c]].filter(l=>{const s=l;return s.tagName?!i.some(r(s)):s.textContent?s.textContent.trim():!1});this.slotHasContent=e.length>0}update(e){if(!this.hasUpdated){const{childNodes:l}=this,s=[...l].filter(p=>{const a=p;return a.tagName?i.some(r(a))?!1:n?a.getAttribute("slot")===n:!a.hasAttribute("slot"):a.textContent?a.textContent.trim():!1});this.slotHasContent=s.length>0}super.update(e)}firstUpdated(e){super.firstUpdated(e),this.updateComplete.then(()=>{this.manageTextObservedSlot()})}}return h([g.n({type:Boolean,attribute:!1})],o.prototype,"slotHasContent"),h([x.n({slot:n,flatten:!0})],o.prototype,u),o}exports.ObserveSlotText=v;
+"use strict";const b=require("./mutation-controller-DkOMCW-c.cjs"),g=require("./base-CBCg3yyw.cjs"),x=require("./query-assigned-nodes-BcKWmGzy.cjs");var m=Object.defineProperty,h=(d,n,i,u)=>{for(var t=void 0,r=d.length-1,o;r>=0;r--)(o=d[r])&&(t=o(n,i,t)||t);return t&&m(n,i,t),t};const c=Symbol("assignedNodes");function v(d,n,i=[]){var u,t;const r=f=>e=>f.matches(e);class o extends(t=d,u=c,t){constructor(...e){super(e),this.slotHasContent=!1,new b.s(this,{config:{characterData:!0,subtree:!0},callback:l=>{for(const s of l)if(s.type==="characterData"){this.manageTextObservedSlot();return}}})}manageTextObservedSlot(){if(!this[c])return;const e=[...this[c]].filter(l=>{const s=l;return s.tagName?!i.some(r(s)):s.textContent?s.textContent.trim():!1});this.slotHasContent=e.length>0}update(e){if(!this.hasUpdated){const{childNodes:l}=this,s=[...l].filter(p=>{const a=p;return a.tagName?i.some(r(a))?!1:n?a.getAttribute("slot")===n:!a.hasAttribute("slot"):a.textContent?a.textContent.trim():!1});this.slotHasContent=s.length>0}super.update(e)}firstUpdated(e){super.firstUpdated(e),this.updateComplete.then(()=>{this.manageTextObservedSlot()})}}return h([g.n({type:Boolean,attribute:!1})],o.prototype,"slotHasContent"),h([x.n({slot:n,flatten:!0})],o.prototype,u),o}exports.ObserveSlotText=v;

package/components/options/index.cjs

@@ -0,0 +1,104 @@
+/*! * Lucero - The design system for Luzmo.
+ * 
+ * Copyright © 2025 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.
+ * */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const W=require("../mutation-controller-DkOMCW-c.cjs"),a=require("../base-CBCg3yyw.cjs"),L=require("../query-BL-TJj7K.cjs"),K=require("../focusable-EbipgXRh.cjs"),Z=require("../like-anchor-sod1C1fR.cjs"),G=require("../observe-slot-presence-bc9chhsi.cjs"),J=require("../observe-slot-text-Ceb7SvYT.cjs"),X=require("../random-id-CqvckpWe.cjs"),x=require("../luzmo-icons-DletXGWU.cjs"),C=require("../directive-C7oCP5Bh.cjs"),Y=require("../async-directive-BX1T1e1_.cjs"),g=require("../directive-helpers-DyIRTWwA.cjs"),Q=require("../base-BjTwmyRF.cjs"),D=require("../sized-mixin-CPxE5C96.cjs"),tt=require("../divider.module-DDvBo9zo.cjs");/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */let ot;function et(s){return(t,o)=>Q.e(t,o,{get(){return(this.renderRoot??ot??(ot=document.createDocumentFragment())).querySelectorAll(s)}})}const it='#icon{grid-area:iconArea;align-self:start;height:var(--luzmo-option-icon-container-height, var(--option-icon-container-height));display:flex;align-items:center;justify-content:center;color:var(--highcontrast-option-color-default, var(--luzmo-option-label-icon-color-default, var(--option-label-icon-color-default)))}::slotted([slot=icon]){fill:var(--highcontrast-option-color-default, var(--luzmo-option-label-icon-color-default, var(--option-label-icon-color-default)));margin-inline-end:var(--luzmo-option-label-text-to-visual, var(--option-label-text-to-visual));block-size:var(--luzmo-option-icon-size, var(--option-icon-height));inline-size:var(--luzmo-option-icon-width, var(--option-icon-height));font-size:var(--luzmo-option-icon-size, var(--option-icon-height));text-align:center;--luzmo-icon-vertical-align: 0}:host{cursor:pointer;box-sizing:border-box;background-color:var(--highcontrast-option-background-color-default, var(--luzmo-option-background-color-default, var(--option-background-color-default)));line-height:var(--luzmo-option-label-line-height, var(--option-label-line-height));min-block-size:var(--luzmo-option-min-height, var(--option-min-height));padding-block-start:var(--luzmo-option-top-edge-to-text, var(--option-top-edge-to-text));padding-block-end:var(--luzmo-option-bottom-edge-to-text, var(--option-bottom-edge-to-text));padding-inline:var(--luzmo-option-label-inline-edge-to-content, var(--option-label-inline-edge-to-content));grid-template:". . headingIconArea sectionHeadingArea . ." "selectedArea checkArea iconArea labelArea valueArea actionsArea" 1fr ". . . descriptionArea . ." ". . . . . ."/auto auto auto 1fr auto auto;justify-content:start;margin:0;-webkit-text-decoration:none;text-decoration:none;display:grid;outline:none;align-items:center;position:relative;flex-shrink:0}:host:focus-visible{outline:none}#label{grid-area:submenuItemLabelArea}.checkmark,.checkbox{opacity:1;grid-area:checkArea;align-self:start;display:block}.checkmark{font-size:var(--luzmo-option-checkmark-size, var(--option-checkmark-size));fill:var(--highcontrast-options-checkmark-icon-color-default, var(--luzmo-options-checkmark-icon-color-default, var(--options-checkmark-icon-color-default)));color:var(--highcontrast-options-checkmark-icon-color-default, var(--luzmo-options-checkmark-icon-color-default, var(--options-checkmark-icon-color-default)));margin-block-start:calc(var(--luzmo-option-top-to-checkmark, var(--option-top-to-checkmark)) - var(--luzmo-option-top-edge-to-text, var(--option-top-edge-to-text)));margin-inline-end:var(--luzmo-option-text-to-control, var(--option-label-text-to-control))}.checkbox{font-size:var(--luzmo-option-checkbox-size, var(--option-checkbox-size));fill:var(--highcontrast-options-checkbox-icon-color-default, var(--luzmo-options-checkbox-icon-color-default, var(--options-checkbox-icon-color-default)));color:var(--highcontrast-options-checkbox-icon-color-default, var(--luzmo-options-checkbox-icon-color-default, var(--options-checkbox-icon-color-default)));margin-block-start:calc(var(--luzmo-option-top-to-checkbox, var(--option-top-to-checkbox)) - var(--luzmo-option-top-edge-to-text, var(--option-top-edge-to-text)));margin-inline-end:var(--luzmo-option-text-to-control, var(--option-label-text-to-control))}::slotted([slot=value]){grid-area:submenuItemValueArea}:host([focused]){background-color:var(--highcontrast-option-background-color-focus, var(--luzmo-option-background-color-key-focus, var(--option-background-color-key-focus)));outline:none}:host([focused])>#label,:host(:focus)>#label{color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-content-color-focus, var(--option-label-content-color-focus)))}:host([focused])>[name=description]::slotted(*),:host(:focus)>[name=description]::slotted(*){color:var(--highcontrast-option-color-focus, var(--luzmo-option-description-color-focus, var(--option-description-color-focus)))}:host([focused])>::slotted([slot=value]),:host(:focus)>::slotted([slot=value]){color:var(--highcontrast-option-color-focus, var(--luzmo-option-value-color-focus, var(--option-value-color-focus)))}:host([focused])>.icon:not(.checkmark,.checkbox),:host(:focus)>.icon:not(.checkmark,.checkbox){fill:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-focus, var(--option-label-icon-color-focus)));color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-focus, var(--option-label-icon-color-focus)))}:host([focused])>.checkmark,:host(:focus)>.checkmark{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-focus, var(--options-checkmark-icon-color-focus)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-focus, var(--options-checkmark-icon-color-focus)))}:host([focused])>.checkbox,:host(:focus)>.checkbox{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-focus, var(--options-checkbox-icon-color-focus)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-focus, var(--options-checkbox-icon-color-focus)))}:host:dir(rtl),:host([dir=rtl]){--option-focus-indicator-direction-scalar: -1}:host(:is(:active,[active])){background-color:var(--highcontrast-option-background-color-focus, var(--luzmo-option-background-color-down, var(--option-background-color-down)))}:host(:is(:active,[active]))>#label{color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-content-color-down, var(--option-label-content-color-down)))}:host(:is(:active,[active]))>[name=description]::slotted(*){color:var(--highcontrast-option-color-focus, var(--luzmo-option-description-color-down, var(--option-description-color-down)))}:host(:is(:active,[active]))>::slotted([slot=value]){color:var(--highcontrast-option-color-focus, var(--luzmo-option-value-color-down, var(--option-value-color-down)))}:host(:is(:active,[active]))>.icon:not(.checkmark,.checkbox){fill:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-down, var(--option-label-icon-color-down)));color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-down, var(--option-label-icon-color-down)))}:host(:is(:active,[active]))>.checkmark{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-down, var(--options-checkmark-icon-color-down)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-down, var(--options-checkmark-icon-color-down)))}:host(:is(:active,[active]))>.checkbox{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-down, var(--options-checkbox-icon-color-down)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-down, var(--options-checkbox-icon-color-down)))}:host([disabled]),:host([aria-disabled=true]){background-color:initial}:host([disabled]) #label,:host([disabled]) ::slotted([slot=value]),:host([aria-disabled=true]) #label,:host([aria-disabled=true]) ::slotted([slot=value]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-content-color-disabled, var(--option-label-content-color-disabled)))}:host([disabled]) [name=description]::slotted(*),:host([aria-disabled=true]) [name=description]::slotted(*){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-description-color-disabled, var(--option-description-color-disabled)))}:host([disabled]) ::slotted([slot=icon]),:host([aria-disabled=true]) ::slotted([slot=icon]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)));fill:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)))}:host([focused]){box-shadow:inset calc(var(--luzmo-option-focus-indicator-width, var(--option-focus-indicator-width)) * 1) 0 0 0 var(--highcontrast-option-focus-indicator-color, var(--luzmo-option-focus-indicator-color, var(--option-focus-indicator-color)));box-shadow:inset calc(var(--luzmo-option-focus-indicator-width, var(--option-focus-indicator-width)) * var(--option-focus-indicator-direction-scalar, 1)) 0 0 0 var(--highcontrast-option-focus-indicator-color, var(--luzmo-option-focus-indicator-color, var(--option-focus-indicator-color)))}#label{font-size:var(--luzmo-option-label-font-size, var(--option-label-font-size));color:var(--highcontrast-option-color-default, var(--luzmo-option-label-content-color-default, var(--option-label-content-color-default)));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;grid-area:labelArea}:host([variant=highlight][selected]){background-color:var(--luzmo-option-highlight-selected-label-background-color, var(--option-highlight-selected-label-background-color))}:host([variant=highlight][selected]) #label{color:var(--luzmo-option-highlight-selected-label-content-color, var(--option-highlight-selected-label-content-color))}:host([variant=highlight][selected]):hover #label{color:var(--luzmo-option-highlight-selected-label-content-color-hover, var(--option-highlight-selected-label-content-color-hover))}:host([variant=highlight][selected]):active #label{color:var(--luzmo-option-highlight-selected-label-content-color-down, var(--option-highlight-selected-label-content-color-down))}:host([variant=highlight][selected]):focus #label{color:var(--luzmo-option-highlight-selected-label-content-color-focus, var(--option-highlight-selected-label-content-color-focus))}:host([variant=highlight][selected]) ::slotted([slot=icon]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-highlight-selected-label-content-color, var(--option-highlight-selected-label-content-color)));fill:var(--highcontrast-option-color-disabled, var(--luzmo-option-highlight-selected-label-content-color, var(--option-highlight-selected-label-content-color)))}::slotted([slot=value]){color:var(--highcontrast-option-color-default, var(--luzmo-option-value-color-default, var(--option-value-color-default)));font-size:var(--luzmo-option-label-font-size, var(--option-label-font-size));grid-area:valueArea;justify-self:end}[name=description]::slotted(*){color:var(--highcontrast-option-color-default, var(--luzmo-option-description-color-default, var(--option-description-color-default)));font-size:var(--luzmo-option-description-font-size, var(--option-description-font-size));-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;line-height:var(--luzmo-option-description-line-height, var(--option-description-line-height));grid-area:descriptionArea;margin-block-start:var(--luzmo-option-label-to-description-spacing, var(--option-label-to-description-spacing))}:host([no-wrap]) #label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}@media (hover: hover){:host(:hover){background-color:var(--highcontrast-option-background-color-focus, var(--luzmo-option-background-color-hover, var(--option-background-color-hover)))}:host(:hover)>#label{color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-content-color-hover, var(--option-label-content-color-hover)))}:host([variant=highlight][selected]:hover)>#label{color:var(--luzmo-option-highlight-selected-label-content-color-hover, var(--option-highlight-selected-label-content-color-hover))}:host(:hover)>[name=description]::slotted(*){color:var(--highcontrast-option-color-focus, var(--luzmo-option-description-color-hover, var(--option-description-color-hover)))}:host(:hover)>::slotted([slot=value]){color:var(--highcontrast-option-color-focus, var(--luzmo-option-value-color-hover, var(--option-value-color-hover)))}:host(:hover)>.icon:not(.checkmark,.checkbox){fill:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-hover, var(--option-label-icon-color-hover)));color:var(--highcontrast-option-color-focus, var(--luzmo-option-label-icon-color-hover, var(--option-label-icon-color-hover)))}:host([variant=highlight][selected]:hover)>.icon:not(.checkmark,.checkbox){fill:var(--luzmo-option-highlight-selected-label-icon-color-hover, var(--option-highlight-selected-label-icon-color-hover))}:host(:hover)>.checkmark{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-hover, var(--options-checkmark-icon-color-hover)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkmark-icon-color-hover, var(--options-checkmark-icon-color-hover)))}:host(:hover)>.checkbox{fill:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-hover, var(--options-checkbox-icon-color-hover)));color:var(--highcontrast-option-color-focus, var(--luzmo-options-checkbox-icon-color-hover, var(--options-checkbox-icon-color-hover)))}:host([disabled]:hover),:host([aria-disabled=true]:hover){cursor:default;background-color:initial}:host([disabled]:hover) #label,:host([disabled]:hover) ::slotted([slot=value]),:host([aria-disabled=true]:hover) #label,:host([aria-disabled=true]:hover) ::slotted([slot=value]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-content-color-disabled, var(--option-label-content-color-disabled)))}:host([disabled]:hover) [name=description]::slotted(*),:host([aria-disabled=true]:hover) [name=description]::slotted(*){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-description-color-disabled, var(--option-description-color-disabled)))}:host([disabled]:hover) ::slotted([slot=icon]),:host([aria-disabled=true]:hover) ::slotted([slot=icon]){color:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)));fill:var(--highcontrast-option-color-disabled, var(--luzmo-option-label-icon-color-disabled, var(--option-label-icon-color-disabled)))}}:host([emphasized]){--options-checkmark-icon-color-default: var(--luzmo-primary);--options-checkmark-icon-color-hover: var(--luzmo-primary-hover);--options-checkmark-icon-color-down: var(--luzmo-primary-down);--options-checkmark-icon-color-focus: var(--luzmo-primary-focus);--options-checkbox-icon-color-default: var(--luzmo-primary);--options-checkbox-icon-color-hover: var(--luzmo-primary-hover);--options-checkbox-icon-color-down: var(--luzmo-primary-down);--options-checkbox-icon-color-focus: var(--luzmo-primary-focus)}:host{text-align:initial;font-family:var(--luzmo-option-font-family, var(--luzmo-font-family))}:host([hidden]){display:none}:host([disabled]){pointer-events:none}:host([disabled]) [name=value]::slotted(*){color:var(--luzmo-option-label-icon-color-disabled, var(--luzmo-disabled-color))}#button{position:absolute;top:0;right:0;bottom:0;left:0}.icon-container>svg{vertical-align:top}:host([dir=ltr]) [icon-only]::slotted(:last-of-type){margin-right:auto}:host([dir=rtl]) [icon-only]::slotted(:last-of-type){margin-left:auto}@media (forced-colors: active){:host{forced-color-adjust:none}}:host([no-wrap]) #label{display:block}';var nt=Object.defineProperty,lt=Object.getOwnPropertyDescriptor,z=(s,t,o,e)=>{for(var i=e>1?void 0:e?lt(t,o):t,n=s.length-1,l;n>=0;n--)(l=s[n])&&(i=(e?l(t,o,i):l(i))||i);return e&&i&&nt(t,o,i),i};const rt=s=>a.x`
+  <span class="icon-container icon checkmark ${s.join(" ")}">
+    ${x.O2(x.F)}
+  </span>
+`,st=s=>a.x`
+  <span class="icon-container icon checkbox ${s.join(" ")}">
+    ${x.O2(x.h0)}
+  </span>
+`,at=s=>a.x`
+  <span class="icon-container icon checkbox ${s.join(" ")}">
+    ${x.O2(x.C0)}
+  </span>
+`;class b extends Z.LikeAnchor(J.ObserveSlotText(G.ObserveSlotPresence(K.Focusable,'[slot="icon"]'))){constructor(){super(),this.active=!1,this.focused=!1,this.selected=!1,this.emphasized=!1,this.variant="checkmarks",this._value="",this.noWrap=!1,this.renderCheckIcon=(t,o)=>{const e=o?["check-icon--with-adjacent-icon"]:[];return this.variant==="checkboxes"?t?at(e):st(e):t&&this.variant!=="highlight"?rt(e):a.x``},this.proxyFocus=()=>{this.focus()},this.willDispatchUpdate=!1,this.addEventListener("click",this.handleClickCapture,{capture:!0}),new W.s(this,{config:{characterData:!0,childList:!0,subtree:!0},callback:()=>{this.breakItemChildrenCache()}})}static get styles(){return[a.r(it)]}get value(){return this._value||this.itemText}set value(t){t!==this._value&&(this._value=t||"",this._value?this.setAttribute("value",this._value):this.removeAttribute("value"))}get itemText(){return this.itemChildren.content.reduce((t,o)=>t+(o.textContent||"").trim(),"")}get focusElement(){return this}get hasIcon(){return this.slotContentIsPresent}get itemChildren(){if(!this.iconSlot||!this.contentSlot)return{icon:[],content:[]};if(this._itemChildren)return this._itemChildren;const t=this.iconSlot.assignedElements().map(e=>{const i=e.cloneNode(!0);return i.removeAttribute("slot"),i.classList.toggle("icon"),i}),o=this.contentSlot.assignedNodes().map(e=>e.cloneNode(!0));return this._itemChildren={icon:t,content:o},this._itemChildren}click(){this.disabled||this.shouldProxyClick()||super.click()}handleClickCapture(t){if(this.disabled)return t.preventDefault(),t.stopImmediatePropagation(),t.stopPropagation(),!1}shouldProxyClick(){let t=!1;return this.anchorElement&&(this.anchorElement.click(),t=!0),t}breakItemChildrenCache(){this._itemChildren=void 0,this.triggerUpdate()}render(){return a.x`
+      ${this.renderCheckIcon(this.selected,this.hasIcon)}
+      <div id="icon">
+        <slot name="icon"></slot>
+      </div>
+      <div id="label">
+        <slot id="slot"></slot>
+      </div>
+      <slot name="description"></slot>
+      <slot name="value"></slot>
+      ${this.href&&this.href.length>0?super.renderAnchor({id:"button",ariaHidden:!0,className:"button anchor hidden"}):a.E}
+    `}handlePointerdown(){}firstUpdated(t){super.firstUpdated(t),this.setAttribute("tabindex","-1"),this.addEventListener("pointerdown",this.handlePointerdown),this.hasAttribute("id")||(this.id=`luzmo-option-${X.randomID()}`)}updateAriaSelected(){const t=this.getAttribute("role");t==="option"?this.setAttribute("aria-selected",this.selected?"true":"false"):t==="optioncheckbox"&&this.setAttribute("aria-checked",this.selected?"true":"false")}setRole(t){this.setAttribute("role",t),this.updateAriaSelected()}updated(t){super.updated(t),t.has("label")&&(this.label||t.get("label")!==void 0)&&this.setAttribute("aria-label",this.label||""),this.anchorElement&&(this.anchorElement.addEventListener("focus",this.proxyFocus),this.anchorElement.tabIndex=-1),t.has("selected")&&this.updateAriaSelected()}connectedCallback(){super.connectedCallback(),this.triggerUpdate()}async triggerUpdate(){this.willDispatchUpdate||(this.willDispatchUpdate=!0,await new Promise(t=>requestAnimationFrame(t)),this.dispatchUpdate())}dispatchUpdate(){this.isConnected&&(this.willDispatchUpdate=!1)}}z([a.n({type:Boolean,reflect:!0})],b.prototype,"active",2);z([a.n({type:Boolean,reflect:!0})],b.prototype,"focused",2);z([a.n({type:Boolean,reflect:!0})],b.prototype,"selected",2);z([a.n({type:Boolean,reflect:!0})],b.prototype,"emphasized",2);z([a.n({type:String,reflect:!0})],b.prototype,"variant",2);z([a.n({type:String})],b.prototype,"value",1);z([L.e("slot:not([name])")],b.prototype,"contentSlot",2);z([L.e('slot[name="icon"]')],b.prototype,"iconSlot",2);z([a.n({type:Boolean,reflect:!0,attribute:"no-wrap",hasChanged(){return!1}})],b.prototype,"noWrap",2);z([L.e(".anchor")],b.prototype,"anchorElement",2);function S(s,t,o,e){var i=arguments.length,n=i<3?t:e===null?e=Object.getOwnPropertyDescriptor(t,o):e,l;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")n=Reflect.decorate(s,t,o,e);else for(var r=s.length-1;r>=0;r--)(l=s[r])&&(n=(i<3?l(n):i>3?l(t,o,n):l(t,o))||n);return i>3&&n&&Object.defineProperty(t,o,n),n}/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const F=(s,t,o)=>{const e=new Map;for(let i=t;i<=o;i++)e.set(s[i],i);return e},j=C.e(class extends C.i{constructor(s){if(super(s),s.type!==C.t.CHILD)throw Error("repeat() can only be used in text expressions")}dt(s,t,o){let e;o===void 0?o=t:t!==void 0&&(e=t);const i=[],n=[];let l=0;for(const r of s)i[l]=e?e(r,l):l,n[l]=o(r,l),l++;return{values:n,keys:i}}render(s,t,o){return this.dt(s,t,o).values}update(s,[t,o,e]){const i=g.p(s),{values:n,keys:l}=this.dt(t,o,e);if(!Array.isArray(i))return this.ut=l,n;const r=this.ut??(this.ut=[]),c=[];let h,f,u=0,p=i.length-1,d=0,v=n.length-1;for(;u<=p&&d<=v;)if(i[u]===null)u++;else if(i[p]===null)p--;else if(r[u]===l[d])c[d]=g.v(i[u],n[d]),u++,d++;else if(r[p]===l[v])c[v]=g.v(i[p],n[v]),p--,v--;else if(r[u]===l[v])c[v]=g.v(i[u],n[v]),g.r(s,c[v+1],i[u]),u++,v--;else if(r[p]===l[d])c[d]=g.v(i[p],n[d]),g.r(s,i[u],i[p]),p--,d++;else if(h===void 0&&(h=F(l,d,v),f=F(r,u,p)),h.has(r[u]))if(h.has(r[p])){const m=f.get(l[d]),E=m!==void 0?i[m]:null;if(E===null){const O=g.r(s,i[u]);g.v(O,n[d]),c[d]=O}else c[d]=g.v(E,n[d]),g.r(s,i[u],E),i[m]=null;d++}else g.M(i[p]),p--;else g.M(i[u]),u++;for(;d<=v;){const m=g.r(s,c[v+1]);g.v(m,n[d]),c[d++]=m}for(;u<=p;){const m=i[u++];m!==null&&g.M(m)}return this.ut=l,g.m(s,c),a.T}});/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class T extends Event{constructor(t){super(T.eventName,{bubbles:!1}),this.first=t.first,this.last=t.last}}T.eventName="rangeChanged";class V extends Event{constructor(t){super(V.eventName,{bubbles:!1}),this.first=t.first,this.last=t.last}}V.eventName="visibilityChanged";class M extends Event{constructor(){super(M.eventName,{bubbles:!1})}}M.eventName="unpinned";/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class ct{constructor(t){this._element=null;const o=t??window;this._node=o,t&&(this._element=t)}get element(){return this._element||document.scrollingElement||document.documentElement}get scrollTop(){return this.element.scrollTop||window.scrollY}get scrollLeft(){return this.element.scrollLeft||window.scrollX}get scrollHeight(){return this.element.scrollHeight}get scrollWidth(){return this.element.scrollWidth}get viewportHeight(){return this._element?this._element.getBoundingClientRect().height:window.innerHeight}get viewportWidth(){return this._element?this._element.getBoundingClientRect().width:window.innerWidth}get maxScrollTop(){return this.scrollHeight-this.viewportHeight}get maxScrollLeft(){return this.scrollWidth-this.viewportWidth}}class ht extends ct{constructor(t,o){super(o),this._clients=new Set,this._retarget=null,this._end=null,this.__destination=null,this.correctingScrollError=!1,this._checkForArrival=this._checkForArrival.bind(this),this._updateManagedScrollTo=this._updateManagedScrollTo.bind(this),this.scrollTo=this.scrollTo.bind(this),this.scrollBy=this.scrollBy.bind(this);const e=this._node;this._originalScrollTo=e.scrollTo,this._originalScrollBy=e.scrollBy,this._originalScroll=e.scroll,this._attach(t)}get _destination(){return this.__destination}get scrolling(){return this._destination!==null}scrollTo(t,o){const e=typeof t=="number"&&typeof o=="number"?{left:t,top:o}:t;this._scrollTo(e)}scrollBy(t,o){const e=typeof t=="number"&&typeof o=="number"?{left:t,top:o}:t;e.top!==void 0&&(e.top+=this.scrollTop),e.left!==void 0&&(e.left+=this.scrollLeft),this._scrollTo(e)}_nativeScrollTo(t){this._originalScrollTo.bind(this._element||window)(t)}_scrollTo(t,o=null,e=null){this._end!==null&&this._end(),t.behavior==="smooth"?(this._setDestination(t),this._retarget=o,this._end=e):this._resetScrollState(),this._nativeScrollTo(t)}_setDestination(t){let{top:o,left:e}=t;return o=o===void 0?void 0:Math.max(0,Math.min(o,this.maxScrollTop)),e=e===void 0?void 0:Math.max(0,Math.min(e,this.maxScrollLeft)),this._destination!==null&&e===this._destination.left&&o===this._destination.top?!1:(this.__destination={top:o,left:e,behavior:"smooth"},!0)}_resetScrollState(){this.__destination=null,this._retarget=null,this._end=null}_updateManagedScrollTo(t){this._destination&&this._setDestination(t)&&this._nativeScrollTo(this._destination)}managedScrollTo(t,o,e){return this._scrollTo(t,o,e),this._updateManagedScrollTo}correctScrollError(t){this.correctingScrollError=!0,requestAnimationFrame(()=>requestAnimationFrame(()=>this.correctingScrollError=!1)),this._nativeScrollTo(t),this._retarget&&this._setDestination(this._retarget()),this._destination&&this._nativeScrollTo(this._destination)}_checkForArrival(){if(this._destination!==null){const{scrollTop:t,scrollLeft:o}=this;let{top:e,left:i}=this._destination;e=Math.min(e||0,this.maxScrollTop),i=Math.min(i||0,this.maxScrollLeft);const n=Math.abs(e-t),l=Math.abs(i-o);n<1&&l<1&&(this._end&&this._end(),this._resetScrollState())}}detach(t){return this._clients.delete(t),this._clients.size===0&&(this._node.scrollTo=this._originalScrollTo,this._node.scrollBy=this._originalScrollBy,this._node.scroll=this._originalScroll,this._node.removeEventListener("scroll",this._checkForArrival)),null}_attach(t){this._clients.add(t),this._clients.size===1&&(this._node.scrollTo=this.scrollTo,this._node.scrollBy=this.scrollBy,this._node.scroll=this.scrollTo,this._node.addEventListener("scroll",this._checkForArrival))}}/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */let $=typeof window<"u"?window.ResizeObserver:void 0;const R=Symbol("virtualizerRef"),I="virtualizer-sizer";let P;class dt{constructor(t){if(this._benchmarkStart=null,this._layout=null,this._clippingAncestors=[],this._scrollSize=null,this._scrollError=null,this._childrenPos=null,this._childMeasurements=null,this._toBeMeasured=new Map,this._rangeChanged=!0,this._itemsChanged=!0,this._visibilityChanged=!0,this._scrollerController=null,this._isScroller=!1,this._sizer=null,this._hostElementRO=null,this._childrenRO=null,this._mutationObserver=null,this._scrollEventListeners=[],this._scrollEventListenerOptions={passive:!0},this._loadListener=this._childLoaded.bind(this),this._scrollIntoViewTarget=null,this._updateScrollIntoViewCoordinates=null,this._items=[],this._first=-1,this._last=-1,this._firstVisible=-1,this._lastVisible=-1,this._scheduled=new WeakSet,this._measureCallback=null,this._measureChildOverride=null,this._layoutCompletePromise=null,this._layoutCompleteResolver=null,this._layoutCompleteRejecter=null,this._pendingLayoutComplete=null,this._layoutInitialized=null,this._connected=!1,!t)throw new Error("Virtualizer constructor requires a configuration object");if(t.hostElement)this._init(t);else throw new Error('Virtualizer configuration requires the "hostElement" property')}set items(t){Array.isArray(t)&&t!==this._items&&(this._itemsChanged=!0,this._items=t,this._schedule(this._updateLayout))}_init(t){this._isScroller=!!t.scroller,this._initHostElement(t);const o=t.layout||{};this._layoutInitialized=this._initLayout(o)}_initObservers(){this._mutationObserver=new MutationObserver(this._finishDOMUpdate.bind(this)),this._hostElementRO=new $(()=>this._hostElementSizeChanged()),this._childrenRO=new $(this._childrenSizeChanged.bind(this))}_initHostElement(t){const o=this._hostElement=t.hostElement;this._applyVirtualizerStyles(),o[R]=this}connected(){this._initObservers();const t=this._isScroller;this._clippingAncestors=vt(this._hostElement,t),this._scrollerController=new ht(this,this._clippingAncestors[0]),this._schedule(this._updateLayout),this._observeAndListen(),this._connected=!0}_observeAndListen(){this._mutationObserver.observe(this._hostElement,{childList:!0}),this._hostElementRO.observe(this._hostElement),this._scrollEventListeners.push(window),window.addEventListener("scroll",this,this._scrollEventListenerOptions),this._clippingAncestors.forEach(t=>{t.addEventListener("scroll",this,this._scrollEventListenerOptions),this._scrollEventListeners.push(t),this._hostElementRO.observe(t)}),this._hostElementRO.observe(this._scrollerController.element),this._children.forEach(t=>this._childrenRO.observe(t)),this._scrollEventListeners.forEach(t=>t.addEventListener("scroll",this,this._scrollEventListenerOptions))}disconnected(){var t,o,e,i;this._scrollEventListeners.forEach(n=>n.removeEventListener("scroll",this,this._scrollEventListenerOptions)),this._scrollEventListeners=[],this._clippingAncestors=[],(t=this._scrollerController)==null||t.detach(this),this._scrollerController=null,(o=this._mutationObserver)==null||o.disconnect(),this._mutationObserver=null,(e=this._hostElementRO)==null||e.disconnect(),this._hostElementRO=null,(i=this._childrenRO)==null||i.disconnect(),this._childrenRO=null,this._rejectLayoutCompletePromise("disconnected"),this._connected=!1}_applyVirtualizerStyles(){const o=this._hostElement.style;o.display=o.display||"block",o.position=o.position||"relative",o.contain=o.contain||"size layout",this._isScroller&&(o.overflow=o.overflow||"auto",o.minHeight=o.minHeight||"150px")}_getSizer(){const t=this._hostElement;if(!this._sizer){let o=t.querySelector(`[${I}]`);o||(o=document.createElement("div"),o.setAttribute(I,""),t.appendChild(o)),Object.assign(o.style,{position:"absolute",margin:"-2px 0 0 0",padding:0,visibility:"hidden",fontSize:"2px"}),o.textContent="&nbsp;",o.setAttribute(I,""),this._sizer=o}return this._sizer}async updateLayoutConfig(t){await this._layoutInitialized;const o=t.type||P;if(typeof o=="function"&&this._layout instanceof o){const e={...t};return delete e.type,this._layout.config=e,!0}return!1}async _initLayout(t){let o,e;if(typeof t.type=="function"){e=t.type;const i={...t};delete i.type,o=i}else o=t;e===void 0&&(P=e=(await Promise.resolve().then(()=>require("../flow-DM3dNAKs.cjs"))).FlowLayout),this._layout=new e(i=>this._handleLayoutMessage(i),o),this._layout.measureChildren&&typeof this._layout.updateItemSizes=="function"&&(typeof this._layout.measureChildren=="function"&&(this._measureChildOverride=this._layout.measureChildren),this._measureCallback=this._layout.updateItemSizes.bind(this._layout)),this._layout.listenForChildLoadEvents&&this._hostElement.addEventListener("load",this._loadListener,!0),this._schedule(this._updateLayout)}startBenchmarking(){this._benchmarkStart===null&&(this._benchmarkStart=window.performance.now())}stopBenchmarking(){if(this._benchmarkStart!==null){const t=window.performance.now(),o=t-this._benchmarkStart,i=performance.getEntriesByName("uv-virtualizing","measure").filter(n=>n.startTime>=this._benchmarkStart&&n.startTime<t).reduce((n,l)=>n+l.duration,0);return this._benchmarkStart=null,{timeElapsed:o,virtualizationTime:i}}return null}_measureChildren(){const t={},o=this._children,e=this._measureChildOverride||this._measureChild;for(let i=0;i<o.length;i++){const n=o[i],l=this._first+i;(this._itemsChanged||this._toBeMeasured.has(n))&&(t[l]=e.call(this,n,this._items[l]))}this._childMeasurements=t,this._schedule(this._updateLayout),this._toBeMeasured.clear()}_measureChild(t){const{width:o,height:e}=t.getBoundingClientRect();return Object.assign({width:o,height:e},ut(t))}async _schedule(t){this._scheduled.has(t)||(this._scheduled.add(t),await Promise.resolve(),this._scheduled.delete(t),t.call(this))}async _updateDOM(t){this._scrollSize=t.scrollSize,this._adjustRange(t.range),this._childrenPos=t.childPositions,this._scrollError=t.scrollError||null;const{_rangeChanged:o,_itemsChanged:e}=this;this._visibilityChanged&&(this._notifyVisibility(),this._visibilityChanged=!1),(o||e)&&(this._notifyRange(),this._rangeChanged=!1),this._finishDOMUpdate()}_finishDOMUpdate(){this._connected&&(this._children.forEach(t=>this._childrenRO.observe(t)),this._checkScrollIntoViewTarget(this._childrenPos),this._positionChildren(this._childrenPos),this._sizeHostElement(this._scrollSize),this._correctScrollError(),this._benchmarkStart&&"mark"in window.performance&&window.performance.mark("uv-end"))}_updateLayout(){this._layout&&this._connected&&(this._layout.items=this._items,this._updateView(),this._childMeasurements!==null&&(this._measureCallback&&this._measureCallback(this._childMeasurements),this._childMeasurements=null),this._layout.reflowIfNeeded(),this._benchmarkStart&&"mark"in window.performance&&window.performance.mark("uv-end"))}_handleScrollEvent(){var t;if(this._benchmarkStart&&"mark"in window.performance){try{window.performance.measure("uv-virtualizing","uv-start","uv-end")}catch(o){console.warn("Error measuring performance data: ",o)}window.performance.mark("uv-start")}this._scrollerController.correctingScrollError===!1&&((t=this._layout)==null||t.unpin()),this._schedule(this._updateLayout)}handleEvent(t){switch(t.type){case"scroll":(t.currentTarget===window||this._clippingAncestors.includes(t.currentTarget))&&this._handleScrollEvent();break;default:console.warn("event not handled",t)}}_handleLayoutMessage(t){t.type==="stateChanged"?this._updateDOM(t):t.type==="visibilityChanged"?(this._firstVisible=t.firstVisible,this._lastVisible=t.lastVisible,this._notifyVisibility()):t.type==="unpinned"&&this._hostElement.dispatchEvent(new M)}get _children(){const t=[];let o=this._hostElement.firstElementChild;for(;o;)o.hasAttribute(I)||t.push(o),o=o.nextElementSibling;return t}_updateView(){var i;const t=this._hostElement,o=(i=this._scrollerController)==null?void 0:i.element,e=this._layout;if(t&&o&&e){let n,l,r,c;const h=t.getBoundingClientRect();n=0,l=0,r=window.innerHeight,c=window.innerWidth;const f=this._clippingAncestors.map(y=>y.getBoundingClientRect());f.unshift(h);for(const y of f)n=Math.max(n,y.top),l=Math.max(l,y.left),r=Math.min(r,y.bottom),c=Math.min(c,y.right);const u=o.getBoundingClientRect(),p={left:h.left-u.left,top:h.top-u.top},d={width:o.scrollWidth,height:o.scrollHeight},v=n-h.top+t.scrollTop,m=l-h.left+t.scrollLeft,E=Math.max(0,r-n),O=Math.max(0,c-l);e.viewportSize={width:O,height:E},e.viewportScroll={top:v,left:m},e.totalScrollSize=d,e.offsetWithinScroller=p}}_sizeHostElement(t){const e=t&&t.width!==null?Math.min(82e5,t.width):0,i=t&&t.height!==null?Math.min(82e5,t.height):0;if(this._isScroller)this._getSizer().style.transform=`translate(${e}px, ${i}px)`;else{const n=this._hostElement.style;n.minWidth=e?`${e}px`:"100%",n.minHeight=i?`${i}px`:"100%"}}_positionChildren(t){t&&t.forEach(({top:o,left:e,width:i,height:n,xOffset:l,yOffset:r},c)=>{const h=this._children[c-this._first];h&&(h.style.position="absolute",h.style.boxSizing="border-box",h.style.transform=`translate(${e}px, ${o}px)`,i!==void 0&&(h.style.width=i+"px"),n!==void 0&&(h.style.height=n+"px"),h.style.left=l===void 0?null:l+"px",h.style.top=r===void 0?null:r+"px")})}async _adjustRange(t){const{_first:o,_last:e,_firstVisible:i,_lastVisible:n}=this;this._first=t.first,this._last=t.last,this._firstVisible=t.firstVisible,this._lastVisible=t.lastVisible,this._rangeChanged=this._rangeChanged||this._first!==o||this._last!==e,this._visibilityChanged=this._visibilityChanged||this._firstVisible!==i||this._lastVisible!==n}_correctScrollError(){if(this._scrollError){const{scrollTop:t,scrollLeft:o}=this._scrollerController,{top:e,left:i}=this._scrollError;this._scrollError=null,this._scrollerController.correctScrollError({top:t-e,left:o-i})}}element(t){var o;return t===1/0&&(t=this._items.length-1),((o=this._items)==null?void 0:o[t])===void 0?void 0:{scrollIntoView:(e={})=>this._scrollElementIntoView({...e,index:t})}}_scrollElementIntoView(t){if(t.index>=this._first&&t.index<=this._last)this._children[t.index-this._first].scrollIntoView(t);else if(t.index=Math.min(t.index,this._items.length-1),t.behavior==="smooth"){const o=this._layout.getScrollIntoViewCoordinates(t),{behavior:e}=t;this._updateScrollIntoViewCoordinates=this._scrollerController.managedScrollTo(Object.assign(o,{behavior:e}),()=>this._layout.getScrollIntoViewCoordinates(t),()=>this._scrollIntoViewTarget=null),this._scrollIntoViewTarget=t}else this._layout.pin=t}_checkScrollIntoViewTarget(t){const{index:o}=this._scrollIntoViewTarget||{};o&&(t!=null&&t.has(o))&&this._updateScrollIntoViewCoordinates(this._layout.getScrollIntoViewCoordinates(this._scrollIntoViewTarget))}_notifyRange(){this._hostElement.dispatchEvent(new T({first:this._first,last:this._last}))}_notifyVisibility(){this._hostElement.dispatchEvent(new V({first:this._firstVisible,last:this._lastVisible}))}get layoutComplete(){return this._layoutCompletePromise||(this._layoutCompletePromise=new Promise((t,o)=>{this._layoutCompleteResolver=t,this._layoutCompleteRejecter=o})),this._layoutCompletePromise}_rejectLayoutCompletePromise(t){this._layoutCompleteRejecter!==null&&this._layoutCompleteRejecter(t),this._resetLayoutCompleteState()}_scheduleLayoutComplete(){this._layoutCompletePromise&&this._pendingLayoutComplete===null&&(this._pendingLayoutComplete=requestAnimationFrame(()=>requestAnimationFrame(()=>this._resolveLayoutCompletePromise())))}_resolveLayoutCompletePromise(){this._layoutCompleteResolver!==null&&this._layoutCompleteResolver(),this._resetLayoutCompleteState()}_resetLayoutCompleteState(){this._layoutCompletePromise=null,this._layoutCompleteResolver=null,this._layoutCompleteRejecter=null,this._pendingLayoutComplete=null}_hostElementSizeChanged(){this._schedule(this._updateLayout)}_childLoaded(){}_childrenSizeChanged(t){var o;if((o=this._layout)!=null&&o.measureChildren){for(const e of t)this._toBeMeasured.set(e.target,e.contentRect);this._measureChildren()}this._scheduleLayoutComplete(),this._itemsChanged=!1,this._rangeChanged=!1}}function ut(s){const t=window.getComputedStyle(s);return{marginTop:A(t.marginTop),marginRight:A(t.marginRight),marginBottom:A(t.marginBottom),marginLeft:A(t.marginLeft)}}function A(s){const t=s?parseFloat(s):NaN;return Number.isNaN(t)?0:t}function B(s){if(s.assignedSlot!==null)return s.assignedSlot;if(s.parentElement!==null)return s.parentElement;const t=s.parentNode;return t&&t.nodeType===Node.DOCUMENT_FRAGMENT_NODE&&t.host||null}function pt(s,t=!1){const o=[];let e=t?s:B(s);for(;e!==null;)o.push(e),e=B(e);return o}function vt(s,t=!1){let o=!1;return pt(s,t).filter(e=>{if(o)return!1;const i=getComputedStyle(e);return o=i.position==="fixed",i.overflow!=="visible"})}/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const U=s=>s,q=(s,t)=>a.x`${t}: ${JSON.stringify(s,null,2)}`;class mt extends Y.f{constructor(t){if(super(t),this._virtualizer=null,this._first=0,this._last=-1,this._renderItem=(o,e)=>q(o,e+this._first),this._keyFunction=(o,e)=>U(o,e+this._first),this._items=[],t.type!==C.t.CHILD)throw new Error("The virtualize directive can only be used in child expressions")}render(t){t&&this._setFunctions(t);const o=[];if(this._first>=0&&this._last>=this._first)for(let e=this._first;e<=this._last;e++)o.push(this._items[e]);return j(o,this._keyFunction,this._renderItem)}update(t,[o]){this._setFunctions(o);const e=this._items!==o.items;return this._items=o.items||[],this._virtualizer?this._updateVirtualizerConfig(t,o):this._initialize(t,o),e?a.T:this.render()}async _updateVirtualizerConfig(t,o){if(!await this._virtualizer.updateLayoutConfig(o.layout||{})){const i=t.parentNode;this._makeVirtualizer(i,o)}this._virtualizer.items=this._items}_setFunctions(t){const{renderItem:o,keyFunction:e}=t;o&&(this._renderItem=(i,n)=>o(i,n+this._first)),e&&(this._keyFunction=(i,n)=>e(i,n+this._first))}_makeVirtualizer(t,o){this._virtualizer&&this._virtualizer.disconnected();const{layout:e,scroller:i,items:n}=o;this._virtualizer=new dt({hostElement:t,layout:e,scroller:i}),this._virtualizer.items=n,this._virtualizer.connected()}_initialize(t,o){const e=t.parentNode;e&&e.nodeType===1&&(e.addEventListener("rangeChanged",i=>{this._first=i.first,this._last=i.last,this.setValue(this.render())}),this._makeVirtualizer(e,o))}disconnected(){var t;(t=this._virtualizer)==null||t.disconnected()}reconnected(){var t;(t=this._virtualizer)==null||t.connected()}}const ft=C.e(mt);/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class w extends a.r$1{constructor(){super(...arguments),this.items=[],this.renderItem=q,this.keyFunction=U,this.layout={},this.scroller=!1}createRenderRoot(){return this}render(){const{items:t,renderItem:o,keyFunction:e,layout:i,scroller:n}=this;return a.x`${ft({items:t,renderItem:o,keyFunction:e,layout:i,scroller:n})}`}element(t){var o;return(o=this[R])==null?void 0:o.element(t)}get layoutComplete(){var t;return(t=this[R])==null?void 0:t.layoutComplete}scrollToIndex(t,o="start"){var e;(e=this.element(t))==null||e.scrollIntoView({block:o})}}S([a.n({attribute:!1})],w.prototype,"items",void 0);S([a.n()],w.prototype,"renderItem",void 0);S([a.n()],w.prototype,"keyFunction",void 0);S([a.n({attribute:!1})],w.prototype,"layout",void 0);S([a.n({reflect:!0,type:Boolean})],w.prototype,"scroller",void 0);/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */customElements.define("lit-virtualizer",w);const gt=":host{--options-divider-thickness: var( --divider-thickness-medium, var(--luzmo-border-width) );inline-size:auto;margin-block:var(--luzmo-options-section-divider-margin-block, max(0px, (var(--option-section-divider-height) - var(--options-divider-thickness)) / 2));margin-inline:var(--luzmo-option-label-inline-edge-to-content, var(--option-label-inline-edge-to-content));overflow:visible}:host{display:block;flex-shrink:0}";class N extends D.SizedMixin(a.LuzmoElement,{validSizes:["s","m","l"]}){static get styles(){return[a.r(tt.dividerStyles),a.r(gt)]}firstUpdated(t){super.firstUpdated(t),this.setAttribute("role","separator")}}const bt=":host{--option-top-to-action: var(--luzmo-spacing-1);--option-top-to-checkbox: var(--luzmo-spacing-1);--option-label-line-height: var(--luzmo-line-height);--option-label-line-height-cjk: 1.5;--option-label-to-description-spacing: 1px;--option-focus-indicator-width: var(--luzmo-indicator-width);--option-focus-indicator-color: var(--luzmo-indicator-color);--option-label-to-value-area-min-spacing: var(--luzmo-spacing-3);--option-label-content-color-default: var(--luzmo-font-color);--option-label-content-color-hover: var(--luzmo-font-color-hover);--option-label-content-color-down: var(--luzmo-font-color-down);--option-label-content-color-focus: var(--luzmo-font-color-focus);--option-label-icon-color-default: var(--luzmo-font-color);--option-label-icon-color-hover: var(--luzmo-font-color-hover);--option-label-icon-color-down: var(--luzmo-font-color-down);--option-label-icon-color-focus: var(--luzmo-font-color-focus);--option-highlight-selected-label-background-color: var(--luzmo-primary);--option-highlight-selected-label-content-color: var( --luzmo-primary-inverse-color );--option-highlight-selected-label-content-color-hover: var( --luzmo-primary-inverse-color );--option-highlight-selected-label-content-color-down: var( --luzmo-primary-inverse-color );--option-highlight-selected-label-content-color-focus: var( --luzmo-primary-inverse-color );--option-label-content-color-disabled: var(--luzmo-font-color-disabled);--option-label-icon-color-disabled: var(--luzmo-font-color-disabled);--option-description-line-height: var(--luzmo-line-height);--option-description-line-height-cjk: 1.5;--option-description-color-default: var(--luzmo-font-color);--option-description-color-hover: var(--luzmo-font-color-hover);--option-description-color-down: var(--luzmo-font-color-down);--option-description-color-focus: var(--luzmo-font-color-focus);--option-description-color-disabled: var(--luzmo-disabled-color);--options-section-header-line-height: var(--luzmo-line-height);--options-section-header-line-height-cjk: 1.5;--options-section-header-font-weight: bold;--options-section-header-color: var(--luzmo-font-color-hard);--options-collapsible-icon-color: var(--luzmo-font-color-hard);--options-checkmark-icon-color-default: var(--luzmo-font-color);--options-checkmark-icon-color-hover: var(--luzmo-font-color-hover);--options-checkmark-icon-color-down: var(--luzmo-font-color-down);--options-checkmark-icon-color-focus: var(--luzmo-font-color-focus);--options-checkbox-icon-color-default: var(--luzmo-font-color);--options-checkbox-icon-color-hover: var(--luzmo-font-color-hover);--options-checkbox-icon-color-down: var(--luzmo-font-color-down);--options-checkbox-icon-color-focus: var(--luzmo-font-color-focus);--options-drillin-icon-color-default: var(--luzmo-font-color);--options-drillin-icon-color-hover: var(--luzmo-font-color-hover);--options-drillin-icon-color-down: var(--luzmo-font-color-down);--options-drillin-icon-color-focus: var(--luzmo-font-color-focus);--option-value-color-default: var(--luzmo-font-color);--option-value-color-hover: var(--luzmo-font-color-hover);--option-value-color-down: var(--luzmo-font-color-down);--option-value-color-focus: var(--luzmo-font-color-focus);--option-collapsible-no-icon-suboption-padding-x-start: 28px;--option-background-color-selected: var(--luzmo-background-color);--option-background-color-default: var(--luzmo-background-color);--option-background-color-hover: var(--luzmo-background-color-hover);--option-background-color-down: var(--luzmo-background-color-down);--option-background-color-key-focus: var(--luzmo-background-color-focus)}:host{--option-min-height: var(--luzmo-component-height);--option-icon-container-height: 18px;--pending-height: var(--option-min-height);--option-icon-height: var(--luzmo-font-size-l);--option-icon-width: var(--luzmo-font-size-l);--option-label-font-size: var(--luzmo-font-size-l);--option-label-text-to-visual: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-label-text-to-control: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-label-inline-edge-to-content: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--pending-inline-edge-to-content: var(--option-label-inline-edge-to-content);--option-top-edge-to-text: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--option-bottom-edge-to-text: var(--luzmo-spacing-3);--option-description-font-size: var(--luzmo-font-size-xs);--options-section-header-font-size: var(--luzmo-font-size);--options-section-header-min-width: var(--luzmo-component-height);--option-selectable-edge-to-text-not-selected: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-checkmark-size: var(--luzmo-font-size-xs);--option-checkbox-size: var(--luzmo-font-size-xs);--option-top-to-checkmark: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-top-to-checkbox: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) )}:host([size=s]){--option-min-height: var(--luzmo-component-height-s);--option-icon-container-height: 17px;--option-icon-height: var(--luzmo-font-size);--option-icon-width: var(--luzmo-font-size);--option-label-font-size: var(--luzmo-font-size-s);--option-label-text-to-visual: var(--luzmo-spacing-3);--option-label-text-to-control: var(--luzmo-spacing-3);--option-label-inline-edge-to-content: var(--luzmo-spacing-3);--option-top-edge-to-text: calc( var(--luzmo-spacing-1) + var(--luzmo-spacing-2) );--option-bottom-edge-to-text: var(--luzmo-spacing-2);--option-description-font-size: var(--luzmo-font-size-xs);--options-section-header-font-size: var(--luzmo-font-size-s);--options-section-header-min-width: var(--luzmo-component-height-s);--option-selectable-edge-to-text-not-selected: var(--luzmo-spacing-3);--option-checkmark-size: var(--luzmo-font-size-xs);--option-checkbox-size: var(--luzmo-font-size-xs);--option-top-to-checkmark: var(--luzmo-spacing-3);--option-top-to-checkbox: var(--luzmo-spacing-3)}:host([size=l]){--option-min-height: var(--luzmo-component-height-l);--option-icon-container-height: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--option-icon-height: var(--luzmo-font-size-l);--option-icon-width: var(--luzmo-font-size-l);--option-label-font-size: var(--luzmo-font-size-l);--option-label-text-to-visual: var(--luzmo-spacing-4);--option-label-text-to-control: var(--luzmo-spacing-4);--option-label-inline-edge-to-content: var(--luzmo-spacing-4);--option-top-edge-to-text: var(--luzmo-spacing-4);--option-bottom-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-description-font-size: var(--luzmo-font-size-s);--options-section-header-font-size: var(--luzmo-font-size-l);--options-section-header-min-width: var(--luzmo-component-height-l);--option-selectable-edge-to-text-not-selected: var(--luzmo-spacing-4);--option-checkmark-size: var(--luzmo-font-size-s);--option-checkbox-size: var(--luzmo-font-size-s);--option-top-to-checkmark: var(--luzmo-spacing-4);--option-top-to-checkbox: var(--luzmo-spacing-4)}:host([size=xl]){--option-min-height: var(--luzmo-component-height-xl);--option-icon-container-height: 26px;--option-icon-height: var(--luzmo-font-size-xl);--option-icon-width: var(--luzmo-font-size-xl);--option-label-font-size: var(--luzmo-font-size-xl);--option-label-text-to-visual: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-label-text-to-control: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-label-inline-edge-to-content: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-top-edge-to-text: var(--luzmo-spacing-4);--option-bottom-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--option-description-font-size: var(--luzmo-font-size);--options-section-header-font-size: var(--luzmo-font-size-xl);--options-section-header-min-width: var(--luzmo-component-height-xl);--option-selectable-edge-to-text-not-selected: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-checkmark-size: var(--luzmo-font-size);--option-checkbox-size: var(--luzmo-font-size);--option-top-to-checkmark: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--option-top-to-checkbox: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) )}@media (forced-colors: active){:host{--highcontrast-option-background-color-default: ButtonFace;--highcontrast-option-color-default: ButtonText;--highcontrast-option-background-color-focus: Highlight;--highcontrast-option-color-focus: HighlightText;--highcontrast-options-checkmark-icon-color-default: Highlight;--highcontrast-options-checkbox-icon-color-default: Highlight;--highcontrast-option-color-disabled: GrayText;--highcontrast-option-focus-indicator-color: Highlight;--highcontrast-option-selected-background-color: Highlight;--highcontrast-option-selected-color: HighlightText}@supports (color: SelectedItem){:host{--highcontrast-option-selected-background-color: SelectedItem;--highcontrast-option-selected-color: SelectedItemText}}}:host{inline-size:auto;inline-size:var(--luzmo-options-inline-size, auto);box-sizing:border-box;margin:0;padding:0;list-style-type:none;display:inline-block;overflow:auto}:host:lang(ja),:host:lang(ko),:host:lang(zh){--option-label-line-height: var( --luzmo-option-label-line-height-cjk, var(--option-label-line-height-cjk) );--option-description-line-height: var( --luzmo-option-description-line-height-cjk, var(--option-description-line-height-cjk) );--options-section-header-line-height: var( --luzmo-options-section-header-line-height-cjk, var(--options-section-header-line-height-cjk) )}luzmo-option{width:100%}#pending{display:flex;align-items:center;height:var(--pending-height);padding-inline:var(--pending-inline-edge-to-content)}:host{display:inline-flex;flex-direction:column;width:100%}:host(:focus){outline:none}::slotted(*){flex-shrink:0}";var _t=Object.defineProperty,k=(s,t,o,e)=>{for(var i=void 0,n=s.length-1,l;n>=0;n--)(l=s[n])&&(i=l(t,o,i)||i);return i&&_t(t,o,i),i};const H=25;function zt(s,t){return!!t&&(s===t||s.contains(t))}class _ extends D.SizedMixin(a.LuzmoElement,{noDefaultSize:!0}){constructor(){super(),this.label="",this.variant="highlight",this.selects="single",this.emphasized=!1,this.pending=!1,this.options=[],this.value=[],this.focusedOptionIndex=0,this._selectedOptions=[],this._firstVisibleIndex=0,this.addEventListener("focusin",this.handleFocusin),this.addEventListener("blur",this.handleBlur)}static get styles(){return[a.r(bt)]}get _virtualizeActive(){return this.options.length>H}firstUpdated(t){super.firstUpdated(t),this.hasAttribute("tabindex")||(this.tabIndex=0);const o=[new Promise(e=>requestAnimationFrame(()=>e(!0)))];[...this.children].forEach(e=>{e.localName==="luzmo-option"&&o.push(e.updateComplete)}),this.optionElementsUpdated=Promise.all(o)}willUpdate(t){var e;t.has("selects")&&this.selects==="single"&&((e=this.value)==null?void 0:e.length)>1&&(this.value=this.value.slice(0,1))}updated(t){super.updated(t),t.has("label")&&(this.label||t.get("label")!==void 0)&&(this.label?this.setAttribute("aria-label",this.label):this.removeAttribute("aria-label"))}async getUpdateComplete(){const t=await super.getUpdateComplete();return await this.optionElementsUpdated,t}focus({preventScroll:t}={}){super.focus({preventScroll:t}),this.focusOptionByOffset(0)}_removeFocusedPropertyOnOptions(){requestAnimationFrame(()=>{this.visibleOptionElements.forEach(t=>{t.focused=!1})})}scrollToTop(){this.scrollTop=0}handleFocusin(){this.startListeningToKeyboard()}handleBlur(t){zt(this,t.relatedTarget)||(this.stopListeningToKeyboard(),this._removeFocusedPropertyOnOptions(),this.removeAttribute("aria-activedescendant"))}startListeningToKeyboard(){this.addEventListener("keydown",this.handleKeydown)}stopListeningToKeyboard(){this.removeEventListener("keydown",this.handleKeydown)}handleKeydown(t){var n;if(t.defaultPrevented)return;const o=this.focusedOptionIndex,e=[...this.visibleOptionElements].find(l=>{var r,c,h,f;return((r=l.value)==null?void 0:r.toString())===((f=(h=(c=this.options)==null?void 0:c[o])==null?void 0:h.value)==null?void 0:f.toString())}),{key:i}=t;if(i==="Tab"){this.prepareToCleanUp();return}if(i===" "||i==="Enter"){t.preventDefault(),e&&this.toggleOption(t,(n=this.options)==null?void 0:n[o]);return}if(i==="ArrowDown"||i==="ArrowUp"){t.preventDefault(),this.navigateWithinOptions(t,e);return}}navigateWithinOptions(t,o){const{key:e}=t,i=e==="ArrowDown"?1:-1;t.preventDefault(),t.stopPropagation();const n=this.focusOptionByOffset(i,o,!0);n!==o&&(this._virtualizeActive||n==null||n.scrollIntoView({block:"nearest"}))}focusOptionByOffset(t,o,e){var u;const i=t||1;o&&(o.focused=!1);const n=this.focusedOptionIndex;this.focusedOptionIndex=this.options.length>0?(this.options.length+this.focusedOptionIndex+t)%this.options.length:0;let l=this.options[this.focusedOptionIndex],r=this.options.length;for(;(l!=null&&l.disabled||l!=null&&l.divider)&&r;)r-=1,this.focusedOptionIndex=(this.options.length+this.focusedOptionIndex+i)%this.options.length,l=this.options[this.focusedOptionIndex];const c=n<this.focusedOptionIndex&&t===-1,h=n>this.focusedOptionIndex&&t===1;(c||h)&&(this.focusedOptionIndex=n,this.dispatchEvent(new Event(`luzmo-exceeded-${c?"top":"bottom"}`,{bubbles:!0,composed:!0,cancelable:!0})));let f;return e&&this._virtualizeActive&&(f=[...this.visibleOptionElements].find(p=>{var d,v,m;return((d=p.value)==null?void 0:d.toString())===((m=(v=this.options[this.focusedOptionIndex])==null?void 0:v.value)==null?void 0:m.toString())}),f||(this.focusedOptionIndex=this._firstVisibleIndex)),this._virtualizeActive&&e&&((u=this.virtualizer.element(this.focusedOptionIndex))==null||u.scrollIntoView({behavior:"smooth",block:"nearest"})),f=f??[...this.visibleOptionElements].find(p=>{var d,v,m;return((d=p.value)==null?void 0:d.toString())===((m=(v=this.options[this.focusedOptionIndex])==null?void 0:v.value)==null?void 0:m.toString())}),l!=null&&l.disabled||this.setFocusedAndActiveDescendant(f),f}updateSelectedItemIndex(){this.focusedOptionIndex=this._virtualizeActive?this._firstVisibleIndex:0}setSelectedOptionsFromValue(){this._selectedOptions=this.options.filter(t=>{var o;return typeof(t==null?void 0:t.value)=="string"&&((o=this.value)==null?void 0:o.includes(t==null?void 0:t.value))})}visibilityChanged(t){this._firstVisibleIndex=(t==null?void 0:t.first)??0}rangeChange(t){t.stopPropagation(),t.preventDefault(),(t==null?void 0:t.first)!==-1&&(t==null?void 0:t.last)!==-1&&this.dispatchEvent(new CustomEvent("luzmo-scrolled",{bubbles:!0,composed:!0,cancelable:!0,detail:{first:t.first,last:t.last}}))}async toggleOption(t,o){const e=t instanceof KeyboardEvent,i=this.options.findIndex(l=>(l==null?void 0:l.value)===(o==null?void 0:o.value));this.focusedOptionIndex=i,this.visibleOptionElements.forEach(l=>{var r,c;if(e){const h=((r=l.value)==null?void 0:r.toString())===((c=o==null?void 0:o.value)==null?void 0:c.toString());l.focused=h,h&&this.setFocusedAndActiveDescendant(l)}else l.focused=!1});const n=(this.value??[]).includes(o==null?void 0:o.value);this.selects==="single"?(this.value=[o==null?void 0:o.value],this._selectedOptions=[o]):(this.value=n?this.value.filter(l=>l!==(o==null?void 0:o.value)):[...this.value??[],o==null?void 0:o.value],this._selectedOptions=n?this._selectedOptions.filter(l=>l.value!==o.value):[...this._selectedOptions,o]),await this.updateComplete,this.dispatchEvent(new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0,detail:{value:this.value??[]}})),this.prepareToCleanUp()}handleOptionClick(t,o){this.toggleOption(o,t)}render(){const t=r=>a.x`<luzmo-icon
+        slot="icon"
+        .icon=${r}
+        .size=${this.size}
+      ></luzmo-icon>`,o=r=>a.x`<span slot="description">${r}</span>`,e=r=>a.x`<luzmo-icon
+        slot="icon"
+        .src=${r}
+        .size=${this.size}
+      ></luzmo-icon>`,i=r=>{var m;const c=(r==null?void 0:r.value)??(r==null?void 0:r.label),h=(r==null?void 0:r.label)??(r==null?void 0:r.value),f=r==null?void 0:r.description,u=r==null?void 0:r.icon,p=r==null?void 0:r.imgSrc,d=r==null?void 0:r.divider,v=typeof r=="string"||r==null?void 0:r.disabled;return d?a.x`<luzmo-options-divider></luzmo-options-divider>`:a.x`<luzmo-option
+            .value=${c}
+            .size=${this.size}
+            .variant=${this.variant}
+            ?emphasized=${this.emphasized}
+            ?no-wrap=${this.noWrap}
+            ?disabled=${v}
+            .selected=${Array.isArray(this.value)?(m=this.value)==null?void 0:m.includes(c):!1}
+            .role=${this.selects==="single"?"option":"optioncheckbox"}
+            @click=${this.handleOptionClick.bind(this,r)}
+          >
+            ${u?t(u):p?e(p):a.E}
+            ${h} ${f?o(f):a.E}
+          </luzmo-option>`},n=this._virtualizeActive?a.x`<lit-virtualizer
+          .items=${this.options}
+          .renderItem=${i}
+          @rangeChanged=${this.rangeChange}
+          @visibilityChanged=${this.visibilityChanged}
+        ></lit-virtualizer>`:j(this.options,i),l=this.pending?a.x`<div id="pending">
+          <luzmo-progress-circle
+            indeterminate
+            .size=${this.size}
+          ></luzmo-progress-circle>
+        </div>`:a.E;return a.x`${n} ${l}`}connectedCallback(){super.connectedCallback(),this.setAttribute("role","listbox"),this.updateComplete.then(()=>this.updateItemFocus())}disconnectedCallback(){super.disconnectedCallback()}prepareToCleanUp(){document.addEventListener("focusout",()=>{requestAnimationFrame(()=>{this.updateSelectedItemIndex()})},{once:!0})}updateItemFocus(){if(this.visibleOptionElements.length===0)return;const t=this.focusedOptionIndex,o=[...this.visibleOptionElements].find(e=>{var i,n,l,r;return((i=e.value)==null?void 0:i.toString())===((r=(l=(n=this.options)==null?void 0:n[t])==null?void 0:l.value)==null?void 0:r.toString())});this.setFocusedAndActiveDescendant(o)}setFocusedAndActiveDescendant(t){var e,i;if(!t)return;const o=this.hasVisibleFocusInTree()||!!((e=this.visibleOptionElements)!=null&&e.some&&((i=this.visibleOptionElements)!=null&&i.some(n=>n.hasVisibleFocusInTree())));t.focused=o,o&&this.setAttribute("aria-activedescendant",t.id)}}k([a.n({type:String,reflect:!0})],_.prototype,"label");k([a.n({type:String,reflect:!0})],_.prototype,"variant");k([a.n({type:String,reflect:!0})],_.prototype,"selects");k([a.n({type:Boolean,reflect:!0})],_.prototype,"emphasized");k([a.n({type:Boolean,reflect:!0})],_.prototype,"pending");k([a.n({type:Array})],_.prototype,"options");k([a.n({type:Boolean,reflect:!0,attribute:"no-wrap"})],_.prototype,"noWrap");k([a.n({type:Array})],_.prototype,"value");k([L.e("lit-virtualizer")],_.prototype,"virtualizer");k([et("luzmo-option")],_.prototype,"visibleOptionElements");customElements.get("luzmo-options")||customElements.define("luzmo-options",_);customElements.get("luzmo-options-divider")||customElements.define("luzmo-options-divider",N);customElements.get("luzmo-option")||customElements.define("luzmo-option",b);exports.LuzmoOption=b;exports.LuzmoOptions=_;exports.LuzmoOptionsDivider=N;exports.VIRTUALIZE_AS_OF_NUM_ITEMS=H;

package/components/options/index.d.ts

@@ -0,0 +1,13 @@
+export * from './option';
+export * from './options';
+export * from './options-divider';
+import { LuzmoOption } from './option';
+import { LuzmoOptions } from './options';
+import { LuzmoOptionsDivider } from './options-divider';
+declare global {
+    interface HTMLElementTagNameMap {
+        'luzmo-options': LuzmoOptions;
+        'luzmo-options-divider': LuzmoOptionsDivider;
+        'luzmo-option': LuzmoOption;
+    }
+}