@vonage/vivid 5.25.0 → 5.27.0

package/range-slider/index.cjs

@@ -1,18 +1,18 @@
-const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.cjs`),n=require(`../bundled/ref.cjs`),r=require(`../bundled/when.cjs`),i=require(`../bundled/decorate.cjs`),a=require(`../bundled/aria.cjs`),o=require(`../bundled/class-names.cjs`),s=require(`../bundled/key-codes.cjs`),c=require(`../bundled/numbers.cjs`),l=require(`../bundled/form-associated.cjs`),u=require(`../bundled/definition8.cjs`),d=require(`../bundled/form-element.cjs`),f=require(`../bundled/slider.template.cjs`);var p=`:host{display:inline-block}:host(:not([orientation=vertical])){inline-size:100%}:host([orientation=vertical]){block-size:100%;min-block-size:calc(var(--_thumb-interaction-indicator-size) * 5)}:host([disabled]){cursor:not-allowed}.control.connotation-cta{--_connotation-color-primary:var(--vvd-slider-cta-primary,var(--vvd-color-cta-500))}.control:not(.connotation-cta){--_connotation-color-primary:var(--vvd-slider-accent-primary,var(--vvd-color-canvas-text))}.control{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent;--_thumb-size:12px;--_thumb-interaction-indicator-size:36px;--_track-start-inset-inline-start:0;--_track-start-inset-block-start:0;cursor:pointer;user-select:none;outline:none}.control .positioning-region{position:relative}.control .track{background:var(--_track-background-color);border-radius:4px;position:absolute}.control .track-start{border-radius:inherit;background:var(--_track-start-background-color);block-size:100%;position:absolute;inset-inline-start:var(--_track-start-inset-inline-start)}.control.horizontal{block-size:var(--_thumb-interaction-indicator-size);inline-size:calc(100% - var(--_thumb-size));min-inline-size:var(--_thumb-size);margin-inline-start:calc(var(--_thumb-size) / 2)}.control.horizontal .track{top:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:2px;left:0;right:0}:host([markers]) .control.horizontal .track-start{--_track-start-inset-inline-start:1px;border-top-left-radius:0;border-bottom-left-radius:0}.control.horizontal .track .mark{block-size:6px;inline-size:100%;position:absolute;inset-block-start:-2px;inset-inline-start:0}.control.vertical{margin-top:calc(var(--_thumb-interaction-indicator-size) / 2);block-size:calc(100% - var(--_thumb-interaction-indicator-size));inline-size:var(--_thumb-interaction-indicator-size);min-block-size:var(--_thumb-interaction-indicator-size)}.control.vertical .positioning-region{block-size:100%}.control.vertical .track{left:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:100%;inline-size:2px}.control.vertical .track .mark{block-size:100%;inline-size:6px;position:absolute;inset-block-start:0;inset-inline-start:-2px}.control.vertical .track-start{block-size:auto;inline-size:100%;inset-block-start:var(--_track-start-inset-block-start)}:host([markers]) .control.vertical .track-start{--_track-start-inset-block-start:1px;border-radius:0}.control.disabled{--_track-background-color:var(--vvd-color-neutral-100);--_track-start-background-color:var(--vvd-color-neutral-300);pointer-events:none}.control:not(.disabled){--_track-background-color:var(--vvd-color-neutral-300);--_track-start-background-color:var(--_appearance-color-fill)}.control:not(.disabled) .mark{color:var(--vvd-color-neutral-950)}.control.disabled .mark{color:var(--_track-start-background-color)}.thumb-container{block-size:var(--_thumb-interaction-indicator-size);cursor:inherit;inline-size:var(--_thumb-interaction-indicator-size);touch-action:none;border-radius:50%;outline:none;position:absolute}.thumb-container.focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent;--_thumb-interaction-indicator-alpha:.05;border-radius:50%}.control.horizontal .thumb-container{transform:translateX(calc(var(--_thumb-interaction-indicator-size) / 2))}.control.vertical .thumb-container{transform:translateY(calc(var(--_thumb-interaction-indicator-size) / 2))}@media (hover:hover){.control:not(.disabled) .thumb-container:hover{--_thumb-interaction-indicator-alpha:.12}}.control:not(.disabled) .thumb-container:active{--_thumb-interaction-indicator-alpha:.25}.thumb-container:before{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-interaction-indicator-size);content:"";inline-size:var(--_thumb-interaction-indicator-size);opacity:var(--_thumb-interaction-indicator-alpha,0);display:block;position:absolute}@media (prefers-reduced-motion:no-preference){.thumb-container:before{transition:opacity .2s ease-out}}.thumb-container:after{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-size);content:"";inline-size:var(--_thumb-size);inset:calc((var(--_thumb-interaction-indicator-size) - var(--_thumb-size)) / 2);display:block;position:absolute}.popup{pointer-events:none}.tooltip{width:auto;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);padding:8px 12px}:host([internal-part]) .thumb-container{opacity:0}@media (prefers-reduced-motion:no-preference){:host([internal-part]) .thumb-container{transition:opacity .2s}}:host([internal-part]) .control.horizontal .track{block-size:4px;top:16px;overflow:hidden}:host([internal-part]) .control:focus .thumb-container{opacity:1}@media (hover:hover){:host([internal-part]) .control:hover .thumb-container{opacity:1}}.control,:host([markers]) .control.horizontal .track-start,:host([markers]) .control.vertical .track-start{--_track-start-inset-inline-start:auto;--_track-start-inset-block-start:auto}`,m={Increment:1,Decrement:-1},h=class extends e.t(d.t(l.n(t.t))){constructor(...e){super(...e),this.#e=!1,this.start=``,this.end=``,this.min=0,this.max=10,this.step=1,this.orientation=a.t.horizontal,this.ariaStartLabel=null,this.ariaEndLabel=null,this.markers=!1,this.pin=!1,this.valueTextFormatter=e=>parseFloat(e).toLocaleString(this.locale.lang),this.proxy=document.createElement(`input`),this._trackEl=null,this._startThumbEl=null,this._endThumbEl=null,this._draggingThumb=!1,this._visiblyFocusedThumb=null,this._hoveredThumb=null,this._startThumbCss=``,this._endThumbCss=``,this._selectedRangeCss=``,this.#f=!1,this.#g=e=>{this.#f||(this._visiblyFocusedThumb=this.#s(e)),this.#f=!1},this.#_=()=>{this._visiblyFocusedThumb=null},this.#v=()=>{document.hidden&&(this.shadowRoot.activeElement===this._startThumbEl||this.shadowRoot.activeElement===this._endThumbEl)&&(this.#f=!0)},this.#y=e=>{this._hoveredThumb=this.#s(e)},this.#b=()=>{this._hoveredThumb=null},this.#x=e=>{if(this.disabled||e.defaultPrevented)return;let t=e.target;t===this._endThumbEl&&this.startAsNumber===this.max&&this.endAsNumber===this.max&&(t=this._startThumbEl),this.#p(t),this._draggingThumb=this.#o(t),this.#C()},this.#S=e=>{let t=this.#s(e);if(this._visiblyFocusedThumb=t,e.key===`Home`)e.preventDefault(),this.#t({[t]:`${this.#a[t].min}`});else if(e.key===`End`)e.preventDefault(),this.#t({[t]:`${this.#a[t].max}`});else{if(e.shiftKey)return;switch(e.key){case s.r:case s.t:e.preventDefault(),this.#n(t,m.Increment);break;case s.n:case s.i:e.preventDefault(),this.#n(t,m.Decrement);break}}},this.#T=e=>{if(this.disabled||e.defaultPrevented||!this._draggingThumb)return;let t=`TouchEvent`in window&&e instanceof TouchEvent?e.touches[0]:e,n=this.#u(t);this.#t({[this._draggingThumb]:`${this.#d(this._draggingThumb,n)}`})},this.#E=()=>{this._draggingThumb=!1,this.#w()}}#e;startChanged(){this.currentStart=this.start,this.#e||(this.dirtyValue=!0,this.#r()),this.$fastController.isConnected&&this.#c()}initialStartChanged(e,t){t&&!this.dirtyValue&&(this.start=t,this.dirtyValue=!1)}currentStartChanged(){this.start=this.currentStart}get startAsNumber(){return parseFloat(this.start)}set startAsNumber(e){this.start=e.toString()}endChanged(){this.currentEnd=this.end,this.#e||(this.dirtyValue=!0,this.#r()),this.$fastController.isConnected&&this.#c()}initialEndChanged(e,t){t&&!this.dirtyValue&&(this.end=t,this.dirtyValue=!1)}currentEndChanged(){this.end=this.currentEnd}get endAsNumber(){return parseFloat(this.end)}set endAsNumber(e){this.end=e.toString()}#t({start:e,end:t},n=!0){e===this.start&&(e=void 0),t===this.end&&(t=void 0),!(e===void 0&&t===void 0)&&(this.#e=!0,e!==void 0&&(this.start=e),t!==void 0&&(this.end=t),this.#e=!1,n&&(e!==void 0&&this.$emit(`input:start`),t!==void 0&&this.$emit(`input:end`),this.$emit(`input`),this.$emit(`change`),this.dirtyValue=!0),this.#r())}#n(e,t){this.#t({[e]:this.#d(e,Number(this[e])+t*this.step).toString()})}orientationChanged(){this.$fastController.isConnected&&this.#c()}nameChanged(e,t){super.nameChanged(e,t),this.#r()}#r(){if(!this.name)this.setFormValue(null);else{let e=new FormData;e.append(this.name,this.start),e.append(this.name,this.end),this.setFormValue(e)}}formResetCallback(){this.#t({start:this.initialStart??this.min.toString(),end:this.initialEnd??this.max.toString()}),super.formResetCallback()}get#i(){return{start:this._startThumbEl,end:this._endThumbEl}}get#a(){return{start:{min:this.min,max:this.endAsNumber},end:{min:this.startAsNumber,max:this.max}}}#o(e){return e===this._startThumbEl?`start`:`end`}#s(e){return this.#o(e.target)}#c(){let e=this.#l(this.startAsNumber),t=this.#l(this.endAsNumber),[n,r]=this.orientation===a.t.horizontal?[`right`,`width`]:[`bottom`,`height`],i=`transition: ${this._draggingThumb?`none`:`all 0.2s ease`};`;this._startThumbCss=`${n}: ${e}%; ${i}`,this._endThumbCss=`${n}: ${t}%; ${i}`,this._selectedRangeCss=`${n}: ${t}%; ${r}: ${e-t}%; ${i}`}#l(e){return(1-f.r(this.min,this.max,e))*100}#u(e){let t=this._trackEl.getBoundingClientRect(),[n,r,i]=this.orientation===a.t.horizontal?[this._trackEl.clientLeft,this._trackEl.clientWidth,e.pageX-document.documentElement.scrollLeft-this.getBoundingClientRect().left]:[t.top,t.bottom,e.pageY-document.documentElement.scrollTop];return f.i(this.min,this.max,f.r(n,r,i))}#d(e,t){return c.n(this.#a[e].min,this.#a[e].max,f.o(t-this.min,this.step)+this.min)}#f;#p(e){this.#f=!0,e.focus(),this.#f=!1}_isThumbPopupOpen(e){return this._visiblyFocusedThumb===e||this._hoveredThumb===e||this._draggingThumb===e}connectedCallback(){super.connectedCallback(),this.#t({start:this.start||this.initialStart||this.min.toString(),end:this.end||this.initialEnd||this.max.toString()},!1),this.#m(),this.#c(),document.addEventListener(`visibilitychange`,this.#v)}disconnectedCallback(){super.disconnectedCallback(),this.#h(),this.#w(),document.removeEventListener(`visibilitychange`,this.#v)}#m(){for(let e of[`start`,`end`])this.#i[e].addEventListener(`keydown`,this.#S),this.#i[e].addEventListener(`mousedown`,this.#x,{passive:!0}),this.#i[e].addEventListener(`touchstart`,this.#x,{passive:!0}),this.#i[e].addEventListener(`mouseover`,this.#y,{passive:!0}),this.#i[e].addEventListener(`mouseout`,this.#b,{passive:!0}),this.#i[e].addEventListener(`focus`,this.#g),this.#i[e].addEventListener(`blur`,this.#_)}#h(){for(let e of[`start`,`end`])this.#i[e].removeEventListener(`keydown`,this.#S),this.#i[e].removeEventListener(`mousedown`,this.#x),this.#i[e].removeEventListener(`touchstart`,this.#x),this.#i[e].removeEventListener(`mouseover`,this.#y),this.#i[e].removeEventListener(`mouseout`,this.#b),this.#i[e].removeEventListener(`focus`,this.#g),this.#i[e].removeEventListener(`blur`,this.#_)}_onMouseDown(e){if(this.disabled||this._draggingThumb)return;let t=this.#u(e),n=Math.abs(t-Number(this.start)),r=Math.abs(t-Number(this.end)),i=n<r||n===r&&t<Number(this.start)?`start`:`end`;this.#t({[i]:`${this.#d(i,t)}`}),this._draggingThumb=i,this.#p(this.#i[i]),this.#C()}#g;#_;#v;#y;#b;#x;#S;#C(){window.addEventListener(`mousemove`,this.#T,{passive:!0}),window.addEventListener(`touchmove`,this.#T,{passive:!0}),window.addEventListener(`mouseup`,this.#E),window.addEventListener(`touchend`,this.#E),window.document.addEventListener(`mouseleave`,this.#E)}#w(){window.removeEventListener(`mouseup`,this.#E),window.document.removeEventListener(`mouseleave`,this.#E),window.removeEventListener(`mousemove`,this.#T),window.removeEventListener(`touchmove`,this.#T),window.removeEventListener(`touchend`,this.#E)}#T;#E};i.t([t.A],h.prototype,`start`,void 0),i.t([t.m({mode:`fromView`,attribute:`start`})],h.prototype,`initialStart`,void 0),i.t([t.m({attribute:`current-start`})],h.prototype,`currentStart`,void 0),i.t([t.A],h.prototype,`end`,void 0),i.t([t.m({mode:`fromView`,attribute:`end`})],h.prototype,`initialEnd`,void 0),i.t([t.m({attribute:`current-end`})],h.prototype,`currentEnd`,void 0),i.t([t.m({converter:t.h})],h.prototype,`min`,void 0),i.t([t.m({converter:t.h})],h.prototype,`max`,void 0),i.t([t.m({converter:f.a})],h.prototype,`step`,void 0),i.t([t.m],h.prototype,`orientation`,void 0),i.t([t.m({attribute:`aria-start-label`})],h.prototype,`ariaStartLabel`,void 0),i.t([t.m({attribute:`aria-end-label`})],h.prototype,`ariaEndLabel`,void 0),i.t([t.m({mode:`boolean`})],h.prototype,`markers`,void 0),i.t([t.m],h.prototype,`connotation`,void 0),i.t([t.m({mode:`boolean`})],h.prototype,`pin`,void 0),i.t([t.A],h.prototype,`valueTextFormatter`,void 0),i.t([t.A],h.prototype,`_draggingThumb`,void 0),i.t([t.A],h.prototype,`_visiblyFocusedThumb`,void 0),i.t([t.A],h.prototype,`_hoveredThumb`,void 0),i.t([t.A],h.prototype,`_startThumbCss`,void 0),i.t([t.A],h.prototype,`_endThumbCss`,void 0),i.t([t.A],h.prototype,`_selectedRangeCss`,void 0);var g=e=>({_visiblyFocusedThumb:t})=>o.t(`thumb-container`,[`focus-visible`,t===e]),_=t.u(`range-slider`,h,e=>{let i=e.tagFor(u.i);return t.p` <template
+const e=require("../bundled/localized.cjs"),t=require("../bundled/vivid-element.cjs"),n=require("../bundled/ref.cjs"),r=require("../bundled/when.cjs"),i=require("../bundled/decorate.cjs"),a=require("../bundled/aria.cjs"),o=require("../bundled/class-names.cjs"),s=require("../bundled/key-codes.cjs"),c=require("../bundled/slider.template.cjs"),l=require("../bundled/numbers.cjs"),u=require("../bundled/component-enum.cjs"),d=require("../bundled/form-associated.cjs"),f=require("../bundled/definition7.cjs"),p=require("../bundled/form-element.cjs");var m=`:host{display:inline-block}:host(:not([orientation=vertical])){inline-size:100%}:host([orientation=vertical]){block-size:100%;min-block-size:calc(var(--_thumb-interaction-indicator-size) * 5)}:host([disabled]){cursor:not-allowed}.control{--_thumb-size:12px;--_thumb-interaction-indicator-size:36px;--_track-start-inset-inline-start:0;--_track-start-inset-block-start:0;cursor:pointer;user-select:none;outline:none}.control .positioning-region{position:relative}.control .track{background:var(--_track-background-color);border-radius:4px;position:absolute}.control .track-start{border-radius:inherit;background:var(--_track-start-background-color);block-size:100%;position:absolute;inset-inline-start:var(--_track-start-inset-inline-start)}.control.horizontal{block-size:var(--_thumb-interaction-indicator-size);inline-size:calc(100% - var(--_thumb-size));min-inline-size:var(--_thumb-size);margin-inline-start:calc(var(--_thumb-size) / 2)}.control.horizontal .track{top:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:2px;left:0;right:0}:host([markers]) .control.horizontal .track-start{--_track-start-inset-inline-start:1px;border-top-left-radius:0;border-bottom-left-radius:0}.control.horizontal .track .mark{block-size:6px;inline-size:100%;position:absolute;inset-block-start:-2px;inset-inline-start:0}.control.vertical{margin-top:calc(var(--_thumb-interaction-indicator-size) / 2);block-size:calc(100% - var(--_thumb-interaction-indicator-size));inline-size:var(--_thumb-interaction-indicator-size);min-block-size:var(--_thumb-interaction-indicator-size)}.control.vertical .positioning-region{block-size:100%}.control.vertical .track{left:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:100%;inline-size:2px}.control.vertical .track .mark{block-size:100%;inline-size:6px;position:absolute;inset-block-start:0;inset-inline-start:-2px}.control.vertical .track-start{block-size:auto;inline-size:100%;inset-block-start:var(--_track-start-inset-block-start)}:host([markers]) .control.vertical .track-start{--_track-start-inset-block-start:1px;border-radius:0}.control.disabled{--_track-background-color:var(--vvd-color-neutral-100);--_track-start-background-color:var(--vvd-color-neutral-300);pointer-events:none}.control:not(.disabled){--_track-background-color:var(--vvd-color-neutral-300);--_track-start-background-color:var(--_appearance-color-fill)}.control:not(.disabled) .mark{color:var(--vvd-color-neutral-950)}.control.disabled .mark{color:var(--_track-start-background-color)}.thumb-container{block-size:var(--_thumb-interaction-indicator-size);cursor:inherit;inline-size:var(--_thumb-interaction-indicator-size);touch-action:none;border-radius:50%;outline:none;position:absolute}.thumb-container.focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent;--_thumb-interaction-indicator-alpha:.05;border-radius:50%}.control.horizontal .thumb-container{transform:translateX(calc(var(--_thumb-interaction-indicator-size) / 2))}.control.vertical .thumb-container{transform:translateY(calc(var(--_thumb-interaction-indicator-size) / 2))}@media (hover:hover){.control:not(.disabled) .thumb-container:hover{--_thumb-interaction-indicator-alpha:.12}}.control:not(.disabled) .thumb-container:active{--_thumb-interaction-indicator-alpha:.25}.thumb-container:before{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-interaction-indicator-size);content:"";inline-size:var(--_thumb-interaction-indicator-size);opacity:var(--_thumb-interaction-indicator-alpha,0);display:block;position:absolute}@media (prefers-reduced-motion:no-preference){.thumb-container:before{transition:opacity .2s ease-out}}.thumb-container:after{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-size);content:"";inline-size:var(--_thumb-size);inset:calc((var(--_thumb-interaction-indicator-size) - var(--_thumb-size)) / 2);display:block;position:absolute}.popup{pointer-events:none}.tooltip{width:auto;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);padding:8px 12px}:host([internal-part]) .thumb-container{opacity:0}@media (prefers-reduced-motion:no-preference){:host([internal-part]) .thumb-container{transition:opacity .2s}}:host([internal-part]) .control.horizontal .track{block-size:4px;top:16px;overflow:hidden}:host([internal-part]) .control:focus .thumb-container{opacity:1}@media (hover:hover){:host([internal-part]) .control:hover .thumb-container{opacity:1}}.control,:host([markers]) .control.horizontal .track-start,:host([markers]) .control.vertical .track-start{--_track-start-inset-inline-start:auto;--_track-start-inset-block-start:auto}`,h=u.t([`accent`,`cta`],`accent`),g={Increment:1,Decrement:-1},_=class extends e.t(p.t(d.n(t.t))){constructor(...e){super(...e),this.#e=!1,this.start=``,this.end=``,this.min=0,this.max=10,this.step=1,this.orientation=a.t.horizontal,this.ariaStartLabel=null,this.ariaEndLabel=null,this.markers=!1,this.pin=!1,this.valueTextFormatter=e=>parseFloat(e).toLocaleString(this.locale.lang),this.proxy=document.createElement(`input`),this._trackEl=null,this._startThumbEl=null,this._endThumbEl=null,this._draggingThumb=!1,this._visiblyFocusedThumb=null,this._hoveredThumb=null,this._startThumbCss=``,this._endThumbCss=``,this._selectedRangeCss=``,this.#f=!1,this.#g=e=>{this.#f||(this._visiblyFocusedThumb=this.#s(e)),this.#f=!1},this.#_=()=>{this._visiblyFocusedThumb=null},this.#v=()=>{document.hidden&&(this.shadowRoot.activeElement===this._startThumbEl||this.shadowRoot.activeElement===this._endThumbEl)&&(this.#f=!0)},this.#y=e=>{this._hoveredThumb=this.#s(e)},this.#b=()=>{this._hoveredThumb=null},this.#x=e=>{if(this.disabled||e.defaultPrevented)return;let t=e.target;t===this._endThumbEl&&this.startAsNumber===this.max&&this.endAsNumber===this.max&&(t=this._startThumbEl),this.#p(t),this._draggingThumb=this.#o(t),this.#C()},this.#S=e=>{let t=this.#s(e);if(this._visiblyFocusedThumb=t,e.key===`Home`)e.preventDefault(),this.#t({[t]:`${this.#a[t].min}`});else if(e.key===`End`)e.preventDefault(),this.#t({[t]:`${this.#a[t].max}`});else{if(e.shiftKey)return;switch(e.key){case s.r:case s.t:e.preventDefault(),this.#n(t,g.Increment);break;case s.n:case s.i:e.preventDefault(),this.#n(t,g.Decrement)}}},this.#T=e=>{if(this.disabled||e.defaultPrevented||!this._draggingThumb)return;let t=`TouchEvent`in window&&e instanceof TouchEvent?e.touches[0]:e,n=this.#u(t);this.#t({[this._draggingThumb]:`${this.#d(this._draggingThumb,n)}`})},this.#E=()=>{this._draggingThumb=!1,this.#w()}}#e;startChanged(){this.currentStart=this.start,this.#e||(this.dirtyValue=!0,this.#r()),this.$fastController.isConnected&&this.#c()}initialStartChanged(e,t){t&&!this.dirtyValue&&(this.start=t,this.dirtyValue=!1)}currentStartChanged(){this.start=this.currentStart}get startAsNumber(){return parseFloat(this.start)}set startAsNumber(e){this.start=e.toString()}endChanged(){this.currentEnd=this.end,this.#e||(this.dirtyValue=!0,this.#r()),this.$fastController.isConnected&&this.#c()}initialEndChanged(e,t){t&&!this.dirtyValue&&(this.end=t,this.dirtyValue=!1)}currentEndChanged(){this.end=this.currentEnd}get endAsNumber(){return parseFloat(this.end)}set endAsNumber(e){this.end=e.toString()}#t({start:e,end:t},n=!0){e===this.start&&(e=void 0),t===this.end&&(t=void 0),(e!==void 0||t!==void 0)&&(this.#e=!0,e!==void 0&&(this.start=e),t!==void 0&&(this.end=t),this.#e=!1,n&&(e!==void 0&&this.$emit(`input:start`),t!==void 0&&this.$emit(`input:end`),this.$emit(`input`),this.$emit(`change`),this.dirtyValue=!0),this.#r())}#n(e,t){this.#t({[e]:this.#d(e,Number(this[e])+t*this.step).toString()})}orientationChanged(){this.$fastController.isConnected&&this.#c()}nameChanged(e,t){super.nameChanged(e,t),this.#r()}#r(){if(!this.name)this.setFormValue(null);else{let e=new FormData;e.append(this.name,this.start),e.append(this.name,this.end),this.setFormValue(e)}}formResetCallback(){this.#t({start:this.initialStart??this.min.toString(),end:this.initialEnd??this.max.toString()}),super.formResetCallback()}get#i(){return{start:this._startThumbEl,end:this._endThumbEl}}get#a(){return{start:{min:this.min,max:this.endAsNumber},end:{min:this.startAsNumber,max:this.max}}}#o(e){return e===this._startThumbEl?`start`:`end`}#s(e){return this.#o(e.target)}#c(){let e=this.#l(this.startAsNumber),t=this.#l(this.endAsNumber),[n,r]=this.orientation===a.t.horizontal?[`right`,`width`]:[`bottom`,`height`],i=`transition: ${this._draggingThumb?`none`:`all 0.2s ease`};`;this._startThumbCss=`${n}: ${e}%; ${i}`,this._endThumbCss=`${n}: ${t}%; ${i}`,this._selectedRangeCss=`${n}: ${t}%; ${r}: ${e-t}%; ${i}`}#l(e){return(1-c.i(this.min,this.max,e))*100}#u(e){let t=this._trackEl.getBoundingClientRect(),[n,r,i]=this.orientation===a.t.horizontal?[this._trackEl.clientLeft,this._trackEl.clientWidth,e.pageX-document.documentElement.scrollLeft-this.getBoundingClientRect().left]:[t.top,t.bottom,e.pageY-document.documentElement.scrollTop];return c.a(this.min,this.max,c.i(n,r,i))}#d(e,t){return l.n(this.#a[e].min,this.#a[e].max,c.s(t-this.min,this.step)+this.min)}#f;#p(e){this.#f=!0,e.focus(),this.#f=!1}_isThumbPopupOpen(e){return this._visiblyFocusedThumb===e||this._hoveredThumb===e||this._draggingThumb===e}connectedCallback(){super.connectedCallback(),this.#t({start:this.start||this.initialStart||this.min.toString(),end:this.end||this.initialEnd||this.max.toString()},!1),this.#m(),this.#c(),document.addEventListener(`visibilitychange`,this.#v)}disconnectedCallback(){super.disconnectedCallback(),this.#h(),this.#w(),document.removeEventListener(`visibilitychange`,this.#v)}#m(){for(let e of[`start`,`end`])this.#i[e].addEventListener(`keydown`,this.#S),this.#i[e].addEventListener(`mousedown`,this.#x,{passive:!0}),this.#i[e].addEventListener(`touchstart`,this.#x,{passive:!0}),this.#i[e].addEventListener(`mouseover`,this.#y,{passive:!0}),this.#i[e].addEventListener(`mouseout`,this.#b,{passive:!0}),this.#i[e].addEventListener(`focus`,this.#g),this.#i[e].addEventListener(`blur`,this.#_)}#h(){for(let e of[`start`,`end`])this.#i[e].removeEventListener(`keydown`,this.#S),this.#i[e].removeEventListener(`mousedown`,this.#x),this.#i[e].removeEventListener(`touchstart`,this.#x),this.#i[e].removeEventListener(`mouseover`,this.#y),this.#i[e].removeEventListener(`mouseout`,this.#b),this.#i[e].removeEventListener(`focus`,this.#g),this.#i[e].removeEventListener(`blur`,this.#_)}_onMouseDown(e){if(this.disabled||this._draggingThumb)return;let t=this.#u(e),n=Math.abs(t-Number(this.start)),r=Math.abs(t-Number(this.end)),i=n<r||n===r&&t<Number(this.start)?`start`:`end`;this.#t({[i]:`${this.#d(i,t)}`}),this._draggingThumb=i,this.#p(this.#i[i]),this.#C()}#g;#_;#v;#y;#b;#x;#S;#C(){window.addEventListener(`mousemove`,this.#T,{passive:!0}),window.addEventListener(`touchmove`,this.#T,{passive:!0}),window.addEventListener(`mouseup`,this.#E),window.addEventListener(`touchend`,this.#E),window.document.addEventListener(`mouseleave`,this.#E)}#w(){window.removeEventListener(`mouseup`,this.#E),window.document.removeEventListener(`mouseleave`,this.#E),window.removeEventListener(`mousemove`,this.#T),window.removeEventListener(`touchmove`,this.#T),window.removeEventListener(`touchend`,this.#E)}#T;#E};i.t([t.A],_.prototype,`start`,void 0),i.t([t.m({mode:`fromView`,attribute:`start`})],_.prototype,`initialStart`,void 0),i.t([t.m({attribute:`current-start`})],_.prototype,`currentStart`,void 0),i.t([t.A],_.prototype,`end`,void 0),i.t([t.m({mode:`fromView`,attribute:`end`})],_.prototype,`initialEnd`,void 0),i.t([t.m({attribute:`current-end`})],_.prototype,`currentEnd`,void 0),i.t([t.m({converter:t.h})],_.prototype,`min`,void 0),i.t([t.m({converter:t.h})],_.prototype,`max`,void 0),i.t([t.m({converter:c.o})],_.prototype,`step`,void 0),i.t([t.m],_.prototype,`orientation`,void 0),i.t([t.m({attribute:`aria-start-label`})],_.prototype,`ariaStartLabel`,void 0),i.t([t.m({attribute:`aria-end-label`})],_.prototype,`ariaEndLabel`,void 0),i.t([t.m({mode:`boolean`})],_.prototype,`markers`,void 0),i.t([t.m],_.prototype,`connotation`,void 0),i.t([t.m({mode:`boolean`})],_.prototype,`pin`,void 0),i.t([t.A],_.prototype,`valueTextFormatter`,void 0),i.t([t.A],_.prototype,`_draggingThumb`,void 0),i.t([t.A],_.prototype,`_visiblyFocusedThumb`,void 0),i.t([t.A],_.prototype,`_hoveredThumb`,void 0),i.t([t.A],_.prototype,`_startThumbCss`,void 0),i.t([t.A],_.prototype,`_endThumbCss`,void 0),i.t([t.A],_.prototype,`_selectedRangeCss`,void 0);var v=e=>({_visiblyFocusedThumb:t})=>o.t(`thumb-container`,[`focus-visible`,t===e]),y=t.u(`range-slider`,_,e=>{let i=e.tagFor(f.i);return t.p` <template
 		@mousedown="${(e,t)=>e._onMouseDown(t.event)}"
 	>
 		<div
-			class="${e=>o.t(`control`,[`disabled`,e.disabled],[`connotation-${e.connotation}`,!!e.connotation])} ${e=>e.orientation}"
+			class="${e=>o.t(`control`,[`disabled`,e.disabled],`connotation-${h.parse(e.connotation)}`,`appearance-filled`,`with-idle`)} ${e=>e.orientation}"
 		>
 			<div class="positioning-region">
 				<div ${n.t(`_trackEl`)} class="track">
 					<div class="track-start" style="${e=>e._selectedRangeCss}"></div>
-					${r.t(e=>e.markers,t.p`${e=>f.n(e.orientation===a.t.horizontal,Math.floor((e.max-e.min)/e.step))}`)}
+					${r.t(e=>e.markers,t.p`${e=>c.n(e.orientation===a.t.horizontal,Math.floor((e.max-e.min)/e.step))}`)}
 				</div>
 				<div
 					id="start-thumb"
 					${n.t(`_startThumbEl`)}
-					class="${g(`start`)}"
+					class="${v(`start`)}"
 					style="${e=>e._startThumbCss}"
 					role="slider"
 					tabindex="${e=>e.disabled?null:0}"
@@ -30,7 +30,7 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 					alternate
 					:anchor="${e=>e._startThumbEl}"
 					:open=${e=>e._isThumbPopupOpen(`start`)}
-					:placementStrategy=${e=>e.orientation===a.t.horizontal?u.r.AutoPlacementHorizontal:u.r.AutoPlacementVertical}
+					:placementStrategy=${e=>e.orientation===a.t.horizontal?f.r.AutoPlacementHorizontal:f.r.AutoPlacementVertical}
 					animation-frame
 					exportparts="vvd-theme-alternate"
 					aria-hidden="true"
@@ -40,7 +40,7 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 				<div
 					id="end-thumb"
 					${n.t(`_endThumbEl`)}
-					class="${g(`end`)}"
+					class="${v(`end`)}"
 					style="${e=>e._endThumbCss}"
 					role="slider"
 					tabindex="${e=>e.disabled?null:0}"
@@ -58,7 +58,7 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 					alternate
 					:anchor="${e=>e._endThumbEl}"
 					:open=${e=>e._isThumbPopupOpen(`end`)}
-					:placementStrategy=${e=>e.orientation===a.t.horizontal?u.r.AutoPlacementHorizontal:u.r.AutoPlacementVertical}
+					:placementStrategy=${e=>e.orientation===a.t.horizontal?f.r.AutoPlacementHorizontal:f.r.AutoPlacementVertical}
 					animation-frame
 					exportparts="vvd-theme-alternate"
 					aria-hidden="true"
@@ -67,4 +67,4 @@ const e=require(`../bundled/localized.cjs`),t=require(`../bundled/vivid-element.
 				</${i}>`)}
 			</div>
 		</div>
-	</template>`},[u.t],{styles:p,shadowOptions:{delegatesFocus:!0}});t.d(_)();
+	</template>`},[f.t],{styles:m,shadowOptions:{delegatesFocus:!0}});t.d(y)();

package/range-slider/index.js

@@ -6,16 +6,17 @@ import { t as u } from "../bundled/decorate.js";
 import { t as d } from "../bundled/aria.js";
 import { t as f } from "../bundled/class-names.js";
 import { i as p, n as m, r as h, t as g } from "../bundled/key-codes.js";
-import { n as _ } from "../bundled/numbers.js";
-import { n as v } from "../bundled/form-associated.js";
-import { i as y, r as b, t as x } from "../bundled/definition8.js";
-import { t as S } from "../bundled/form-element.js";
-import { a as C, i as w, n as T, o as E, r as D } from "../bundled/slider.template.js";
+import { a as _, i as v, n as y, o as b, s as x } from "../bundled/slider.template.js";
+import { n as S } from "../bundled/numbers.js";
+import { t as C } from "../bundled/component-enum.js";
+import { n as w } from "../bundled/form-associated.js";
+import { i as T, r as E, t as D } from "../bundled/definition7.js";
+import { t as O } from "../bundled/form-element.js";
 //#region src/lib/range-slider/range-slider.scss?inline
-var O = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-size:100%}:host([orientation=vertical]){block-size:100%;min-block-size:calc(var(--_thumb-interaction-indicator-size) * 5)}:host([disabled]){cursor:not-allowed}.control.connotation-cta{--_connotation-color-primary:var(--vvd-slider-cta-primary,var(--vvd-color-cta-500))}.control:not(.connotation-cta){--_connotation-color-primary:var(--vvd-slider-accent-primary,var(--vvd-color-canvas-text))}.control{--_appearance-color-text:var(--_connotation-color-primary-text);--_appearance-color-fill:var(--_connotation-color-primary);--_appearance-color-outline:transparent;--_thumb-size:12px;--_thumb-interaction-indicator-size:36px;--_track-start-inset-inline-start:0;--_track-start-inset-block-start:0;cursor:pointer;user-select:none;outline:none}.control .positioning-region{position:relative}.control .track{background:var(--_track-background-color);border-radius:4px;position:absolute}.control .track-start{border-radius:inherit;background:var(--_track-start-background-color);block-size:100%;position:absolute;inset-inline-start:var(--_track-start-inset-inline-start)}.control.horizontal{block-size:var(--_thumb-interaction-indicator-size);inline-size:calc(100% - var(--_thumb-size));min-inline-size:var(--_thumb-size);margin-inline-start:calc(var(--_thumb-size) / 2)}.control.horizontal .track{top:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:2px;left:0;right:0}:host([markers]) .control.horizontal .track-start{--_track-start-inset-inline-start:1px;border-top-left-radius:0;border-bottom-left-radius:0}.control.horizontal .track .mark{block-size:6px;inline-size:100%;position:absolute;inset-block-start:-2px;inset-inline-start:0}.control.vertical{margin-top:calc(var(--_thumb-interaction-indicator-size) / 2);block-size:calc(100% - var(--_thumb-interaction-indicator-size));inline-size:var(--_thumb-interaction-indicator-size);min-block-size:var(--_thumb-interaction-indicator-size)}.control.vertical .positioning-region{block-size:100%}.control.vertical .track{left:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:100%;inline-size:2px}.control.vertical .track .mark{block-size:100%;inline-size:6px;position:absolute;inset-block-start:0;inset-inline-start:-2px}.control.vertical .track-start{block-size:auto;inline-size:100%;inset-block-start:var(--_track-start-inset-block-start)}:host([markers]) .control.vertical .track-start{--_track-start-inset-block-start:1px;border-radius:0}.control.disabled{--_track-background-color:var(--vvd-color-neutral-100);--_track-start-background-color:var(--vvd-color-neutral-300);pointer-events:none}.control:not(.disabled){--_track-background-color:var(--vvd-color-neutral-300);--_track-start-background-color:var(--_appearance-color-fill)}.control:not(.disabled) .mark{color:var(--vvd-color-neutral-950)}.control.disabled .mark{color:var(--_track-start-background-color)}.thumb-container{block-size:var(--_thumb-interaction-indicator-size);cursor:inherit;inline-size:var(--_thumb-interaction-indicator-size);touch-action:none;border-radius:50%;outline:none;position:absolute}.thumb-container.focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent;--_thumb-interaction-indicator-alpha:.05;border-radius:50%}.control.horizontal .thumb-container{transform:translateX(calc(var(--_thumb-interaction-indicator-size) / 2))}.control.vertical .thumb-container{transform:translateY(calc(var(--_thumb-interaction-indicator-size) / 2))}@media (hover:hover){.control:not(.disabled) .thumb-container:hover{--_thumb-interaction-indicator-alpha:.12}}.control:not(.disabled) .thumb-container:active{--_thumb-interaction-indicator-alpha:.25}.thumb-container:before{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-interaction-indicator-size);content:\"\";inline-size:var(--_thumb-interaction-indicator-size);opacity:var(--_thumb-interaction-indicator-alpha,0);display:block;position:absolute}@media (prefers-reduced-motion:no-preference){.thumb-container:before{transition:opacity .2s ease-out}}.thumb-container:after{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-size);content:\"\";inline-size:var(--_thumb-size);inset:calc((var(--_thumb-interaction-indicator-size) - var(--_thumb-size)) / 2);display:block;position:absolute}.popup{pointer-events:none}.tooltip{width:auto;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);padding:8px 12px}:host([internal-part]) .thumb-container{opacity:0}@media (prefers-reduced-motion:no-preference){:host([internal-part]) .thumb-container{transition:opacity .2s}}:host([internal-part]) .control.horizontal .track{block-size:4px;top:16px;overflow:hidden}:host([internal-part]) .control:focus .thumb-container{opacity:1}@media (hover:hover){:host([internal-part]) .control:hover .thumb-container{opacity:1}}.control,:host([markers]) .control.horizontal .track-start,:host([markers]) .control.vertical .track-start{--_track-start-inset-inline-start:auto;--_track-start-inset-block-start:auto}", k = {
+var k = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-size:100%}:host([orientation=vertical]){block-size:100%;min-block-size:calc(var(--_thumb-interaction-indicator-size) * 5)}:host([disabled]){cursor:not-allowed}.control{--_thumb-size:12px;--_thumb-interaction-indicator-size:36px;--_track-start-inset-inline-start:0;--_track-start-inset-block-start:0;cursor:pointer;user-select:none;outline:none}.control .positioning-region{position:relative}.control .track{background:var(--_track-background-color);border-radius:4px;position:absolute}.control .track-start{border-radius:inherit;background:var(--_track-start-background-color);block-size:100%;position:absolute;inset-inline-start:var(--_track-start-inset-inline-start)}.control.horizontal{block-size:var(--_thumb-interaction-indicator-size);inline-size:calc(100% - var(--_thumb-size));min-inline-size:var(--_thumb-size);margin-inline-start:calc(var(--_thumb-size) / 2)}.control.horizontal .track{top:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:2px;left:0;right:0}:host([markers]) .control.horizontal .track-start{--_track-start-inset-inline-start:1px;border-top-left-radius:0;border-bottom-left-radius:0}.control.horizontal .track .mark{block-size:6px;inline-size:100%;position:absolute;inset-block-start:-2px;inset-inline-start:0}.control.vertical{margin-top:calc(var(--_thumb-interaction-indicator-size) / 2);block-size:calc(100% - var(--_thumb-interaction-indicator-size));inline-size:var(--_thumb-interaction-indicator-size);min-block-size:var(--_thumb-interaction-indicator-size)}.control.vertical .positioning-region{block-size:100%}.control.vertical .track{left:calc((var(--_thumb-interaction-indicator-size) - 2px) / 2);block-size:100%;inline-size:2px}.control.vertical .track .mark{block-size:100%;inline-size:6px;position:absolute;inset-block-start:0;inset-inline-start:-2px}.control.vertical .track-start{block-size:auto;inline-size:100%;inset-block-start:var(--_track-start-inset-block-start)}:host([markers]) .control.vertical .track-start{--_track-start-inset-block-start:1px;border-radius:0}.control.disabled{--_track-background-color:var(--vvd-color-neutral-100);--_track-start-background-color:var(--vvd-color-neutral-300);pointer-events:none}.control:not(.disabled){--_track-background-color:var(--vvd-color-neutral-300);--_track-start-background-color:var(--_appearance-color-fill)}.control:not(.disabled) .mark{color:var(--vvd-color-neutral-950)}.control.disabled .mark{color:var(--_track-start-background-color)}.thumb-container{block-size:var(--_thumb-interaction-indicator-size);cursor:inherit;inline-size:var(--_thumb-interaction-indicator-size);touch-action:none;border-radius:50%;outline:none;position:absolute}.thumb-container.focus-visible{box-shadow:0 0 0 4px color-mix(in sRGB, var(--focus-stroke-color,var(--vvd-color-cta-500)), transparent 85%), inset 0 0 0 3px var(--focus-stroke-gap-color,currentColor);outline:1px solid var(--focus-stroke-color,var(--vvd-color-cta-500));outline-offset:calc(-1px - var(--focus-inset,0px));--focus-stroke-gap-color:transparent;--_thumb-interaction-indicator-alpha:.05;border-radius:50%}.control.horizontal .thumb-container{transform:translateX(calc(var(--_thumb-interaction-indicator-size) / 2))}.control.vertical .thumb-container{transform:translateY(calc(var(--_thumb-interaction-indicator-size) / 2))}@media (hover:hover){.control:not(.disabled) .thumb-container:hover{--_thumb-interaction-indicator-alpha:.12}}.control:not(.disabled) .thumb-container:active{--_thumb-interaction-indicator-alpha:.25}.thumb-container:before{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-interaction-indicator-size);content:\"\";inline-size:var(--_thumb-interaction-indicator-size);opacity:var(--_thumb-interaction-indicator-alpha,0);display:block;position:absolute}@media (prefers-reduced-motion:no-preference){.thumb-container:before{transition:opacity .2s ease-out}}.thumb-container:after{border-radius:inherit;background-color:var(--_track-start-background-color);block-size:var(--_thumb-size);content:\"\";inline-size:var(--_thumb-size);inset:calc((var(--_thumb-interaction-indicator-size) - var(--_thumb-size)) / 2);display:block;position:absolute}.popup{pointer-events:none}.tooltip{width:auto;color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold);padding:8px 12px}:host([internal-part]) .thumb-container{opacity:0}@media (prefers-reduced-motion:no-preference){:host([internal-part]) .thumb-container{transition:opacity .2s}}:host([internal-part]) .control.horizontal .track{block-size:4px;top:16px;overflow:hidden}:host([internal-part]) .control:focus .thumb-container{opacity:1}@media (hover:hover){:host([internal-part]) .control:hover .thumb-container{opacity:1}}.control,:host([markers]) .control.horizontal .track-start,:host([markers]) .control.vertical .track-start{--_track-start-inset-inline-start:auto;--_track-start-inset-block-start:auto}", A = C(["accent", "cta"], "accent"), j = {
 	Increment: 1,
 	Decrement: -1
-}, A = class extends e(S(v(o))) {
+}, M = class extends e(O(w(o))) {
 	constructor(...e) {
 		super(...e), this.#e = !1, this.start = "", this.end = "", this.min = 0, this.max = 10, this.step = 1, this.orientation = d.horizontal, this.ariaStartLabel = null, this.ariaEndLabel = null, this.markers = !1, this.pin = !1, this.valueTextFormatter = (e) => parseFloat(e).toLocaleString(this.locale.lang), this.proxy = document.createElement("input"), this._trackEl = null, this._startThumbEl = null, this._endThumbEl = null, this._draggingThumb = !1, this._visiblyFocusedThumb = null, this._hoveredThumb = null, this._startThumbCss = "", this._endThumbCss = "", this._selectedRangeCss = "", this.#f = !1, this.#g = (e) => {
 			this.#f || (this._visiblyFocusedThumb = this.#s(e)), this.#f = !1;
@@ -40,12 +41,10 @@ var O = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-s
 				switch (e.key) {
 					case h:
 					case g:
-						e.preventDefault(), this.#n(t, k.Increment);
+						e.preventDefault(), this.#n(t, j.Increment);
 						break;
 					case m:
-					case p:
-						e.preventDefault(), this.#n(t, k.Decrement);
-						break;
+					case p: e.preventDefault(), this.#n(t, j.Decrement);
 				}
 			}
 		}, this.#T = (e) => {
@@ -88,7 +87,7 @@ var O = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-s
 		this.end = e.toString();
 	}
 	#t({ start: e, end: t }, n = !0) {
-		e === this.start && (e = void 0), t === this.end && (t = void 0), !(e === void 0 && t === void 0) && (this.#e = !0, e !== void 0 && (this.start = e), t !== void 0 && (this.end = t), this.#e = !1, n && (e !== void 0 && this.$emit("input:start"), t !== void 0 && this.$emit("input:end"), this.$emit("input"), this.$emit("change"), this.dirtyValue = !0), this.#r());
+		e === this.start && (e = void 0), t === this.end && (t = void 0), (e !== void 0 || t !== void 0) && (this.#e = !0, e !== void 0 && (this.start = e), t !== void 0 && (this.end = t), this.#e = !1, n && (e !== void 0 && this.$emit("input:start"), t !== void 0 && this.$emit("input:end"), this.$emit("input"), this.$emit("change"), this.dirtyValue = !0), this.#r());
 	}
 	#n(e, t) {
 		this.#t({ [e]: this.#d(e, Number(this[e]) + t * this.step).toString() });
@@ -141,7 +140,7 @@ var O = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-s
 		this._startThumbCss = `${n}: ${e}%; ${i}`, this._endThumbCss = `${n}: ${t}%; ${i}`, this._selectedRangeCss = `${n}: ${t}%; ${r}: ${e - t}%; ${i}`;
 	}
 	#l(e) {
-		return (1 - D(this.min, this.max, e)) * 100;
+		return (1 - v(this.min, this.max, e)) * 100;
 	}
 	#u(e) {
 		let t = this._trackEl.getBoundingClientRect(), [n, r, i] = this.orientation === d.horizontal ? [
@@ -153,10 +152,10 @@ var O = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-s
 			t.bottom,
 			e.pageY - document.documentElement.scrollTop
 		];
-		return w(this.min, this.max, D(n, r, i));
+		return _(this.min, this.max, v(n, r, i));
 	}
 	#d(e, t) {
-		return _(this.#a[e].min, this.#a[e].max, E(t - this.min, this.step) + this.min);
+		return S(this.#a[e].min, this.#a[e].max, x(t - this.min, this.step) + this.min);
 	}
 	#f;
 	#p(e) {
@@ -201,35 +200,32 @@ var O = ":host{display:inline-block}:host(:not([orientation=vertical])){inline-s
 	#T;
 	#E;
 };
-u([t], A.prototype, "start", void 0), u([i({
+u([t], M.prototype, "start", void 0), u([i({
 	mode: "fromView",
 	attribute: "start"
-})], A.prototype, "initialStart", void 0), u([i({ attribute: "current-start" })], A.prototype, "currentStart", void 0), u([t], A.prototype, "end", void 0), u([i({
+})], M.prototype, "initialStart", void 0), u([i({ attribute: "current-start" })], M.prototype, "currentStart", void 0), u([t], M.prototype, "end", void 0), u([i({
 	mode: "fromView",
 	attribute: "end"
-})], A.prototype, "initialEnd", void 0), u([i({ attribute: "current-end" })], A.prototype, "currentEnd", void 0), u([i({ converter: r })], A.prototype, "min", void 0), u([i({ converter: r })], A.prototype, "max", void 0), u([i({ converter: C })], A.prototype, "step", void 0), u([i], A.prototype, "orientation", void 0), u([i({ attribute: "aria-start-label" })], A.prototype, "ariaStartLabel", void 0), u([i({ attribute: "aria-end-label" })], A.prototype, "ariaEndLabel", void 0), u([i({ mode: "boolean" })], A.prototype, "markers", void 0), u([i], A.prototype, "connotation", void 0), u([i({ mode: "boolean" })], A.prototype, "pin", void 0), u([t], A.prototype, "valueTextFormatter", void 0), u([t], A.prototype, "_draggingThumb", void 0), u([t], A.prototype, "_visiblyFocusedThumb", void 0), u([t], A.prototype, "_hoveredThumb", void 0), u([t], A.prototype, "_startThumbCss", void 0), u([t], A.prototype, "_endThumbCss", void 0), u([t], A.prototype, "_selectedRangeCss", void 0);
+})], M.prototype, "initialEnd", void 0), u([i({ attribute: "current-end" })], M.prototype, "currentEnd", void 0), u([i({ converter: r })], M.prototype, "min", void 0), u([i({ converter: r })], M.prototype, "max", void 0), u([i({ converter: b })], M.prototype, "step", void 0), u([i], M.prototype, "orientation", void 0), u([i({ attribute: "aria-start-label" })], M.prototype, "ariaStartLabel", void 0), u([i({ attribute: "aria-end-label" })], M.prototype, "ariaEndLabel", void 0), u([i({ mode: "boolean" })], M.prototype, "markers", void 0), u([i], M.prototype, "connotation", void 0), u([i({ mode: "boolean" })], M.prototype, "pin", void 0), u([t], M.prototype, "valueTextFormatter", void 0), u([t], M.prototype, "_draggingThumb", void 0), u([t], M.prototype, "_visiblyFocusedThumb", void 0), u([t], M.prototype, "_hoveredThumb", void 0), u([t], M.prototype, "_startThumbCss", void 0), u([t], M.prototype, "_endThumbCss", void 0), u([t], M.prototype, "_selectedRangeCss", void 0);
 //#endregion
 //#region src/lib/range-slider/range-slider.template.ts
-var j = (e) => ({ _visiblyFocusedThumb: t }) => f("thumb-container", ["focus-visible", t === e]);
-//#endregion
-//#region src/lib/range-slider/index.ts
-n(s("range-slider", A, (e) => {
-	let t = e.tagFor(y);
+var N = (e) => ({ _visiblyFocusedThumb: t }) => f("thumb-container", ["focus-visible", t === e]), P = s("range-slider", M, (e) => {
+	let t = e.tagFor(T);
 	return a` <template
 		@mousedown="${(e, t) => e._onMouseDown(t.event)}"
 	>
 		<div
-			class="${(e) => f("control", ["disabled", e.disabled], [`connotation-${e.connotation}`, !!e.connotation])} ${(e) => e.orientation}"
+			class="${(e) => f("control", ["disabled", e.disabled], `connotation-${A.parse(e.connotation)}`, "appearance-filled", "with-idle")} ${(e) => e.orientation}"
 		>
 			<div class="positioning-region">
 				<div ${c("_trackEl")} class="track">
 					<div class="track-start" style="${(e) => e._selectedRangeCss}"></div>
-					${l((e) => e.markers, a`${(e) => T(e.orientation === d.horizontal, Math.floor((e.max - e.min) / e.step))}`)}
+					${l((e) => e.markers, a`${(e) => y(e.orientation === d.horizontal, Math.floor((e.max - e.min) / e.step))}`)}
 				</div>
 				<div
 					id="start-thumb"
 					${c("_startThumbEl")}
-					class="${j("start")}"
+					class="${N("start")}"
 					style="${(e) => e._startThumbCss}"
 					role="slider"
 					tabindex="${(e) => e.disabled ? null : 0}"
@@ -247,7 +243,7 @@ n(s("range-slider", A, (e) => {
 					alternate
 					:anchor="${(e) => e._startThumbEl}"
 					:open=${(e) => e._isThumbPopupOpen("start")}
-					:placementStrategy=${(e) => e.orientation === d.horizontal ? b.AutoPlacementHorizontal : b.AutoPlacementVertical}
+					:placementStrategy=${(e) => e.orientation === d.horizontal ? E.AutoPlacementHorizontal : E.AutoPlacementVertical}
 					animation-frame
 					exportparts="vvd-theme-alternate"
 					aria-hidden="true"
@@ -257,7 +253,7 @@ n(s("range-slider", A, (e) => {
 				<div
 					id="end-thumb"
 					${c("_endThumbEl")}
-					class="${j("end")}"
+					class="${N("end")}"
 					style="${(e) => e._endThumbCss}"
 					role="slider"
 					tabindex="${(e) => e.disabled ? null : 0}"
@@ -275,7 +271,7 @@ n(s("range-slider", A, (e) => {
 					alternate
 					:anchor="${(e) => e._endThumbEl}"
 					:open=${(e) => e._isThumbPopupOpen("end")}
-					:placementStrategy=${(e) => e.orientation === d.horizontal ? b.AutoPlacementHorizontal : b.AutoPlacementVertical}
+					:placementStrategy=${(e) => e.orientation === d.horizontal ? E.AutoPlacementHorizontal : E.AutoPlacementVertical}
 					animation-frame
 					exportparts="vvd-theme-alternate"
 					aria-hidden="true"
@@ -285,8 +281,11 @@ n(s("range-slider", A, (e) => {
 			</div>
 		</div>
 	</template>`;
-}, [x], {
-	styles: O,
+}, [D], {
+	styles: k,
 	shadowOptions: { delegatesFocus: !0 }
-}))();
+});
+//#endregion
+//#region src/lib/range-slider/index.ts
+n(P)();
 //#endregion

package/rich-text-editor/definition.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_definition = require("../unbundled/definition62.cjs");
+const require_definition = require("../unbundled/definition63.cjs");
 exports.RteAlignmentFeature = require_definition.RteAlignmentFeature;
 exports.RteAtomFeature = require_definition.RteAtomFeature;
 exports.RteBase = require_definition.RteBase;

package/rich-text-editor/definition.js

@@ -1,2 +1,2 @@
-import { A as RichTextEditor, C as RtePlaceholderFeature, D as RteConfig, E as RteBase, O as RteHtmlSerializer, S as RteHardBreakFeature, T as RteTextBlockPickerFeature, _ as RteStrikethroughFeature, a as RteKeyboardShortcutsFeature, b as RteBoldFeature, c as RteToolbarButtonFeature, d as RteInlineImageFeature, f as RteLinkFeature, g as RteMonospaceFeature, h as RteTextColorPickerFeature, i as RteSuggestFeature, k as RteHtmlParser, l as RteDropHandlerFeature, m as RteListFeature, n as richTextEditorDefinition, o as RteInputRuleFeature, p as RteAlignmentFeature, r as RteCharacterCountFeature, s as RteAtomFeature, t as registerRichTextEditor, u as RteFileHandlerFeature, v as RteUnderlineFeature, w as RteToolbarFeature, x as RteFontSizePickerFeature, y as RteItalicFeature } from "../unbundled/definition62.js";
+import { A as RichTextEditor, C as RtePlaceholderFeature, D as RteConfig, E as RteBase, O as RteHtmlSerializer, S as RteHardBreakFeature, T as RteTextBlockPickerFeature, _ as RteStrikethroughFeature, a as RteKeyboardShortcutsFeature, b as RteBoldFeature, c as RteToolbarButtonFeature, d as RteInlineImageFeature, f as RteLinkFeature, g as RteMonospaceFeature, h as RteTextColorPickerFeature, i as RteSuggestFeature, k as RteHtmlParser, l as RteDropHandlerFeature, m as RteListFeature, n as richTextEditorDefinition, o as RteInputRuleFeature, p as RteAlignmentFeature, r as RteCharacterCountFeature, s as RteAtomFeature, t as registerRichTextEditor, u as RteFileHandlerFeature, v as RteUnderlineFeature, w as RteToolbarFeature, x as RteFontSizePickerFeature, y as RteItalicFeature } from "../unbundled/definition63.js";
 export { RteAlignmentFeature, RteAtomFeature, RteBase, RteBoldFeature, RteCharacterCountFeature, RteConfig, RteDropHandlerFeature, RteFileHandlerFeature, RteFontSizePickerFeature, RteHardBreakFeature, RteHtmlParser, RteHtmlSerializer, RteInlineImageFeature, RteInputRuleFeature, RteItalicFeature, RteKeyboardShortcutsFeature, RteLinkFeature, RteListFeature, RteMonospaceFeature, RtePlaceholderFeature, RteStrikethroughFeature, RteSuggestFeature, RteTextBlockPickerFeature, RteTextColorPickerFeature, RteToolbarButtonFeature, RteToolbarFeature, RteUnderlineFeature, RichTextEditor as VwcRichTextEditorElement, registerRichTextEditor, richTextEditorDefinition };