@m3e/web 2.3.0 → 2.3.2

package/dist/slide-group.min.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import{__classPrivateFieldSet as t,__classPrivateFieldGet as e,__decorate as o}from"tslib";import{LitElement as i,html as l,nothing as s,css as r}from"lit";import{query as n,state as a,property as c}from"lit/decorators.js";import{ReconnectedCallback as h,ResizeController as d,debounce as p,customElement as u}from"@m3e/web/core";import{M3eDirectionality as v}from"@m3e/web/core/bidi";import"@m3e/web/icon-button";var g,b,m,C,f;let P=class extends(h(i)){constructor(){super(...arguments),g.add(this),b.set(this,void 0),m.set(this,new d(this,{target:null,callback:()=>this._updatePaging()})),this._canPage=!1,this._canPageStart=!1,this._canPageEnd=!1,this.disabled=!1,this.vertical=!1,this.threshold=0,this.previousPageLabel="Previous page",this.nextPageLabel="Next page"}connectedCallback(){super.connectedCallback(),t(this,b,v.observe(()=>this.requestUpdate()),"f")}disconnectedCallback(){super.disconnectedCallback(),e(this,b,"f")?.call(this)}reconnectedCallback(){super.reconnectedCallback(),e(this,m,"f").observe(this.scrollContainer)}firstUpdated(t){super.firstUpdated(t),e(this,m,"f").observe(this.scrollContainer)}render(){const t=l`<m3e-icon-button class="prev-button" tabindex="-1" aria-label="${this.previousPageLabel}" ?disabled="${!this._canPageStart}" @click="${e(this,g,"m",C)}"><slot name="prev-icon">${"ltr"===v.current||this.vertical?l`<svg class="icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M640-80 240-480l400-400 71 71-329 329 329 329-71 71Z"/></svg>`:l`<svg class="icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m321-80-71-71 329-329-329-329 71-71 400 400L321-80Z"/></svg>`}</slot></m3e-icon-button>`,o=l`<m3e-icon-button class="next-button" tabindex="-1" aria-label="${this.nextPageLabel}" ?disabled="${!this._canPageEnd}" @click="${e(this,g,"m",f)}"><slot name="next-icon">${"ltr"===v.current||this.vertical?l`<svg class="icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m321-80-71-71 329-329-329-329 71-71 400 400L321-80Z"/></svg>`:l`<svg class="icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M640-80 240-480l400-400 71 71-329 329 329 329-71 71Z"/></svg>`}</slot></m3e-icon-button>`;return l`${this._canPage?t:s}<div class="content" @scroll="${this._updatePaging}"><slot></slot></div>${this._canPage?o:s}`}_updatePaging(){this.disabled?this._canPage=!1:this.vertical?(this._canPage=Math.round(this.scrollContainer.scrollHeight)>Math.round(this.scrollContainer.clientHeight)+this.threshold,this._canPage&&(this._canPageStart=Math.round(this.scrollContainer.scrollTop)>this.threshold,this._canPageEnd=Math.round(this.scrollContainer.scrollTop)+ +this.threshold<Math.round(this.scrollContainer.scrollHeight-this.scrollContainer.clientHeight))):(this._canPage=Math.round(this.scrollContainer.scrollWidth)>Math.round(this.scrollContainer.clientWidth)+this.threshold,this._canPage&&(this._canPageStart=Math.round(this.scrollContainer.scrollLeft)>this.threshold,this._canPageEnd=Math.round(this.scrollContainer.scrollLeft)+this.threshold<Math.round(this.scrollContainer.scrollWidth-this.scrollContainer.clientWidth))),this._canPage||(this._canPageStart=this._canPageEnd=!1)}};b=new WeakMap,m=new WeakMap,g=new WeakSet,C=function(){if(this.vertical){let t=this.scrollContainer.scrollTop-this.scrollContainer.clientHeight;t<=this.threshold&&(t=0),this.scrollContainer.scrollTo({top:t,behavior:"smooth"})}else{let t=this.scrollContainer.scrollLeft-this.scrollContainer.clientWidth;t<=this.threshold&&(t=0),this.scrollContainer.scrollTo({left:t,behavior:"smooth"})}},f=function(){if(this.vertical){let t=this.scrollContainer.scrollTop+this.scrollContainer.clientHeight;t>=this.scrollContainer.scrollHeight-this.scrollContainer.clientHeight-this.threshold&&(t=this.scrollContainer.scrollHeight-this.scrollContainer.clientHeight),this.scrollContainer.scrollTo({top:t,behavior:"smooth"})}else{let t=this.scrollContainer.scrollLeft+this.scrollContainer.clientWidth;t>=this.scrollContainer.scrollWidth-this.scrollContainer.clientWidth-this.threshold&&(t=this.scrollContainer.scrollWidth-this.scrollContainer.clientWidth),this.scrollContainer.scrollTo({left:t,behavior:"smooth"})}},P.styles=r`:host { display: flex; flex-wrap: nowrap; overflow: hidden; } :host([vertical]) { flex-direction: column; } .prev-button, .next-button { flex: none; --m3e-icon-button-small-shape-round: 0px; --m3e-icon-button-small-shape-square: 0px; --m3e-icon-button-small-shape-pressed-morph: 0px; --m3e-focus-ring-visibility: hidden; } ::slotted(prev-icon), ::slotted(next-icon), .icon { width: 1em; font-size: var(--m3e-slide-group-button-icon-size, var(--m3e-icon-button-small-icon-size, 1.5rem)) !important; } :host(:not([vertical])) .prev-button, :host(:not([vertical])) .next-button { --m3e-icon-button-small-container-height: 100%; width: var(--m3e-slide-group-button-size, 2.5rem); } :host([vertical]) .prev-button, :host([vertical]) .next-button { width: unset; --m3e-icon-button-small-container-height: var(--m3e-slide-group-button-size, 2.5rem); } :host([vertical]) .prev-button .icon, :host([vertical]) .next-button .icon { transform: rotate(90deg); } .content { flex: 1 1 auto; display: inherit; flex-wrap: inherit; flex-direction: inherit; overflow: inherit; position: relative; border-top: var(--m3e-slide-group-divider-top); border-bottom: var(--m3e-slide-group-divider-bottom); }`,o([n(".content")],P.prototype,"scrollContainer",void 0),o([a()],P.prototype,"_canPage",void 0),o([a()],P.prototype,"_canPageStart",void 0),o([a()],P.prototype,"_canPageEnd",void 0),o([c({type:Boolean,reflect:!0})],P.prototype,"disabled",void 0),o([c({type:Boolean,reflect:!0})],P.prototype,"vertical",void 0),o([c({type:Number})],P.prototype,"threshold",void 0),o([c({attribute:"previous-page-label"})],P.prototype,"previousPageLabel",void 0),o([c({attribute:"next-page-label"})],P.prototype,"nextPageLabel",void 0),o([p(40)],P.prototype,"_updatePaging",null),P=o([u("m3e-slide-group")],P);export{P as M3eSlideGroupElement};

package/dist/slider.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import { __classPrivateFieldGet, __decorate, __classPrivateFieldSet } from 'tslib';

package/dist/slider.min.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import{__classPrivateFieldGet as e,__decorate as t,__classPrivateFieldSet as i}from"tslib";import{LitElement as a,html as s,unsafeCSS as r,css as l}from"lit";import{query as h,property as n,state as c}from"lit/decorators.js";import{ifDefined as o}from"lit/directives/if-defined.js";import{Dirty as d,Touched as m,FormAssociated as p,Focusable as v,Disabled as u,AttachInternals as b,Role as f,formValue as k,DesignToken as g,customElement as x,ResizeController as y,safeStyleMap as $,hasCustomState as _,deleteCustomState as w,prefersReducedMotion as T,addCustomState as z}from"@m3e/web/core";import{M3eDirectionality as E}from"@m3e/web/core/bidi";var M,S;let P=class extends(d(m(p(v(u(b(f(a,"slider")))))))){constructor(){super(...arguments),M.add(this),this.value=null}get[(M=new WeakSet,k)](){return this.value?.toString()??null}focus(e){this._focusRing&&(this._focusRing.disabled=!0),super.focus(e),this._focusRing&&(this._focusRing.disabled=this.disabled)}firstUpdated(e){super.firstUpdated(e),this._focusRing?.attach(this)}update(e){super.update(e),e.has("value")&&this.dispatchEvent(new Event("value-change",{bubbles:!0}))}render(){return s`<div class="label" aria-hidden="true">${e(this,M,"a",S)}</div><div class="base"><m3e-focus-ring class="focus-ring" ?disabled="${this.disabled}"></m3e-focus-ring><div class="touch" aria-hidden="true"></div><div class="wrapper"><div class="handle"></div></div></div>`}};var C,L,W,D,R,A,j,U,H,N,B,G,I,V,O,X,q,F,J,K,Q;S=function(){return this.closest("m3e-slider")?.displayWith?.(this.value)??this.value?.toString()??""},P.styles=l`:host { display: block; box-sizing: border-box; position: absolute; outline: none; top: 0; bottom: 0; border-radius: var(--m3e-slider-thumb-shape, ${g.shape.corner.full}); user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { box-sizing: border-box; vertical-align: middle; display: inline-flex; align-items: center; justify-content: center; position: relative; width: 100%; height: 100%; border-radius: inherit; } .touch { position: absolute; height: 3rem; left: 0; right: 0; touch-action: none; } .wrapper { display: inline-flex; justify-content: center; height: 100%; border-radius: inherit; width: calc(var(--m3e-slider-thumb-width, 0.25rem) + calc(var(--m3e-slider-thumb-padding, 0.375em) * 2)); } .focus-ring { top: calc(0px - var(--m3e-focus-ring-thickness, 3px)); bottom: calc(0px - var(--m3e-focus-ring-thickness, 3px)); left: var(--m3e-focus-ring-thickness, 3px); right: var(--m3e-focus-ring-thickness, 3px); } .label { user-select: none; position: absolute; display: flex; align-items: center; justify-content: center; visibility: var(--_slider-label-visibility, hidden); opacity: var(--_slider-label-opacity, 0); transform: var(--_slider-label-transform, scale(0)); transition: ${r(`opacity ${g.motion.duration.short3} ${g.motion.easing.standard}, \n          transform ${g.motion.duration.short3} ${g.motion.easing.standard},\n          visibility ${g.motion.duration.short3} ${g.motion.easing.standard} allow-discrete`)}; width: var(--m3e-slider-label-width, 3rem); height: var(--_m3e-slider-label-height, 2.75rem); top: calc(0px - var(--_m3e-slider-label-height, 2.75rem) - var(--_m3e-slider-label-margin, 0.25rem)); inset-inline-start: calc(0px - 100%); border-radius: var(--m3e-slider-label-shape, ${g.shape.corner.full}); background-color: var(--m3e-slider-label-container-color, ${g.color.inverseSurface}); color: var(--m3e-slider-label-color, ${g.color.inverseOnSurface}); font-size: var(--m3e-slider-label-font-size, ${g.typescale.standard.label.medium.fontSize}); font-weight: var(--m3e-slider-label-font-weight, ${g.typescale.standard.label.medium.fontWeight}); line-height: var(--m3e-slider-label-line-height, ${g.typescale.standard.label.medium.lineHeight}); letter-spacing: var(--m3e-slider-label-tracking, ${g.typescale.standard.label.medium.tracking}); } @starting-style { .label { opacity: 0; transform: scale(0); } } .handle { height: 100%; width: var(--m3e-slider-thumb-width, 0.25rem); border-radius: inherit; transition: ${r(`width ${g.motion.duration.short2} ${g.motion.easing.standard}`)}; } :host(:active:not([aria-disabled="true"])) .handle { width: var(--m3e-slider-thumb-pressed-width, 2px); } :host(:not([aria-disabled="true"])) .handle { background-color: var(--m3e-slider-thumb-color, ${g.color.primary}); } :host([aria-disabled="true"]) .handle { opacity: var(--m3e-slider-thumb-disabled-opacity, 38%); background-color: var(--m3e-slider-thumb-disabled-color, ${g.color.onSurface}); } @media (prefers-reduced-motion) { .label { transition: none; } } @media (forced-colors: active) { .label { forced-color-adjust: none; background-color: CanvasText; color: Canvas; } :host(:not([aria-disabled="true"])) .handle { background-color: CanvasText; } :host([aria-disabled="true"]) .handle { opacity: unset; background-color: GrayText; } }`,t([h(".focus-ring")],P.prototype,"_focusRing",void 0),t([n({type:Number,reflect:!0})],P.prototype,"value",void 0),P=t([x("m3e-slider-thumb")],P);let Y=class extends(b(a)){constructor(){super(),C.add(this),L.set(this,void 0),this._ticks=new Array,W.set(this,new Array),D.set(this,void 0),R.set(this,0),A.set(this,0),j.set(this,0),this.size="extra-small",this.disabled=!1,this.discrete=!1,this.min=0,this.max=100,this.step=1,this.labelled=!1,this.displayWith=null,new y(this,{callback:()=>e(this,C,"m",V).call(this,!0)})}get thumbs(){return e(this,W,"f")}get isRange(){return e(this,W,"f").length>1}get thumb(){return e(this,W,"f")[0]??null}get lowerThumb(){return this.thumb}get upperThumb(){return e(this,W,"f")[1]??null}connectedCallback(){super.connectedCallback(),i(this,L,E.observe(()=>{e(this,C,"m",V).call(this,!0),this.requestUpdate()}),"f")}disconnectedCallback(){super.disconnectedCallback(),e(this,L,"f")?.call(this)}updated(t){super.updated(t),t.has("disabled")&&e(this,W,"f").forEach(e=>e.disabled=this.disabled)}render(){return s`<div class="base" tabindex="${o(this.disabled?void 0:"-1")}" @pointerdown="${e(this,C,"m",X)}" @pointermove="${e(this,C,"m",q)}" @pointerup="${e(this,C,"m",F)}" @keydown="${e(this,C,"m",J)}" @value-change="${e(this,C,"m",K)}"><div class="track" aria-hidden="true"><div class="track-inactive start"></div><div class="track-active"></div><div class="track-inactive end"></div></div><div class="ticks" aria-hidden="true">${this._ticks.map(t=>e(this,C,"m",U).call(this,t))}</div><slot @slotchange="${e(this,C,"m",H)}"></slot></div>`}};L=new WeakMap,W=new WeakMap,D=new WeakMap,R=new WeakMap,A=new WeakMap,j=new WeakMap,C=new WeakSet,U=function(t){return s`<div class="tick ${t.active?"active":"inactive"}" style="${$({transform:`translate(${"rtl"===E.current?-e(this,C,"m",B).call(this,t.value):e(this,C,"m",B).call(this,t.value)}px, 0)`})}"></div>`},H=function(t){i(this,W,t.target.assignedElements({flatten:!0}).filter(e=>e instanceof P),"f"),e(this,W,"f").length>2&&(e(this,W,"f").length=2),this.isRange?this._base?.style.setProperty("--_slider-active-track-middle-shape","0"):this._base?.style.removeProperty("--_slider-active-track-middle-shape"),e(this,C,"m",N).call(this)},N=function(){e(this,W,"f").forEach((t,i)=>{this.disabled&&(t.disabled=!0),t.ariaValueMin=`${e(this,W,"f")[i-1]?.value??this.min}`,t.ariaValueMax=`${e(this,W,"f")[i+1]?.value??this.max}`,t.ariaValueNow=`${t.value??e(this,W,"f")[i-1]?.value??this.min}`})},B=function(t){return(e(this,R,"f")-e(this,A,"f"))*((t-this.min)/(this.max-this.min))},G=function(t){const i="rtl"===E.current?e(this,j,"f")+e(this,R,"f")-t.clientX:t.clientX-e(this,j,"f"),a=0===this.step?1:this.step,s=Math.floor((this.max-this.min)/a),r=i/e(this,R,"f"),l=Math.round(r*s)/s*(this.max-this.min)+this.min;return Math.round(l/a)*a},I=function(t=!1){this.lowerThumb&&(i(this,R,!t&&e(this,R,"f")>0?e(this,R,"f"):this.clientWidth,"f"),i(this,A,!t&&e(this,A,"f")>0?e(this,A,"f"):this.lowerThumb.clientWidth,"f"),i(this,j,!t&&e(this,j,"f")>0?e(this,j,"f"):this.getBoundingClientRect().left,"f"))},V=function(t=!1){if(e(this,C,"m",I).call(this,t),!this.lowerThumb)return;const i=this.lowerThumb.value??this.min,a=e(this,C,"m",B).call(this,i);if(this.lowerThumb.style.transform=`translate(${"rtl"===E.current?-a:a}px, 0)`,this.upperThumb){const t=this.upperThumb.value??i,s=e(this,C,"m",B).call(this,t);this.upperThumb.style.transform=`translate(${"rtl"===E.current?-s:s}px, 0)`,this._base?.classList.toggle("range",!0),this._base?.style.setProperty("--_slider-inactive-track-before-size",`${a}px`),this._base?.style.setProperty("--_slider-active-track-offset",`${a+e(this,A,"f")}px`),this._base?.style.setProperty("--_slider-active-track-size",s-a-e(this,A,"f")+"px"),this._base?.style.setProperty("--_slider-inactive-track-after-offset",`${s+e(this,A,"f")}px`),this._base?.style.setProperty("--_slider-inactive-track-after-size",e(this,R,"f")-e(this,A,"f")-s+"px"),e(this,C,"m",O).call(this,e=>e>i&&e<t)}else this._base?.classList.toggle("range",!1),this._base?.style.setProperty("--_slider-active-track-size",`${a}px`),this._base?.style.setProperty("--_slider-inactive-track-after-offset",`${a+e(this,A,"f")}px`),this._base?.style.setProperty("--_slider-inactive-track-after-size",e(this,R,"f")-a-e(this,A,"f")+"px"),e(this,C,"m",O).call(this,e=>e<i)},O=function(e){if(this._ticks=[],this.discrete&&this.step>1)for(let t=this.min;t<=this.max;t+=this.step)this._ticks.push({value:t,active:e(t)});else this._ticks.push({value:this.min,active:e(this.min)}),this.min<0&&this.max>0&&this._ticks.push({value:0,active:e(0)}),this._ticks.push({value:this.max,active:e(this.max)})},X=function(t){if("mouse"===t.pointerType&&t.button>1)return;if(!this.lowerThumb||this.disabled)return;if(t.target instanceof HTMLElement&&t.target.setPointerCapture(t.pointerId),i(this,D,t.composedPath().find(e=>e instanceof P),"f"),e(this,D,"f"))return;const a=e(this,C,"m",G).call(this,t);if(this.upperThumb){const t=this.lowerThumb.value??this.min,s=this.upperThumb.value??t;if(a<t)this.lowerThumb.disabled||(e(this,C,"m",Q).call(this,this.lowerThumb,a,!0),i(this,D,this.lowerThumb,"f"));else if(a>s)this.upperThumb.disabled||(e(this,C,"m",Q).call(this,this.upperThumb,a,!0),i(this,D,this.upperThumb,"f"));else{a<(t+s)/2&&!this.lowerThumb.disabled?(e(this,C,"m",Q).call(this,this.lowerThumb,a,!0),i(this,D,this.lowerThumb,"f")):this.upperThumb.disabled||(e(this,C,"m",Q).call(this,this.upperThumb,a,!0),i(this,D,this.upperThumb,"f"))}}else this.lowerThumb.disabled||(e(this,C,"m",Q).call(this,this.lowerThumb,a,!0),i(this,D,this.lowerThumb,"f"))},q=function(t){if(!(t.target instanceof HTMLElement)||!t.target.hasPointerCapture(t.pointerId)||!e(this,D,"f")||e(this,D,"f").disabled)return;const i=e(this,C,"m",G).call(this,t);let a=this.min,s=this.max;e(this,D,"f")===this.upperThumb?a=Math.max(a,this.lowerThumb?.value??0):this.upperThumb&&(s=Math.min(s,this.upperThumb.value??this.max)),_(this,"-animating")&&(w(this,"-animating"),e(this,D,"f").style.transition=""),e(this,C,"m",Q).call(this,e(this,D,"f"),Math.min(s,Math.max(a,i)))},F=function(t){"mouse"===t.pointerType&&t.button>1||this.lowerThumb&&!this.disabled&&(t.target instanceof HTMLElement&&t.target.releasePointerCapture(t.pointerId),e(this,D,"f")&&!e(this,D,"f").disabled&&e(this,D,"f").focus())},J=function(t){if(i(this,D,t.composedPath().find(e=>e instanceof P),"f"),!e(this,D,"f"))return;const a=e(this,D,"f").value??0;let s=this.min,r=this.max;switch(e(this,D,"f")===this.upperThumb?s=Math.max(s,this.lowerThumb?.value??0):this.upperThumb&&(r=Math.max(r,this.upperThumb.value??this.max)),t.key){case"Home":e(this,C,"m",Q).call(this,e(this,D,"f"),s),t.preventDefault();break;case"End":e(this,C,"m",Q).call(this,e(this,D,"f"),r),t.preventDefault();break;case"PageUp":"ltr"===E.current?e(this,C,"m",Q).call(this,e(this,D,"f"),Math.min(r,a+(this.step>1?this.step:10))):e(this,C,"m",Q).call(this,e(this,D,"f"),Math.max(s,a-(this.step>1?this.step:10))),t.preventDefault();break;case"PageDown":"ltr"===E.current?e(this,C,"m",Q).call(this,e(this,D,"f"),Math.max(s,a-(this.step>1?this.step:10))):e(this,C,"m",Q).call(this,e(this,D,"f"),Math.min(r,a+(this.step>1?this.step:10))),t.preventDefault();break;case"Down":case"ArrowDown":case"Left":case"ArrowLeft":"ltr"===E.current?e(this,C,"m",Q).call(this,e(this,D,"f"),Math.max(s,a-this.step)):e(this,C,"m",Q).call(this,e(this,D,"f"),Math.min(r,a+this.step)),t.preventDefault();break;case"Up":case"ArrowUp":case"Right":case"ArrowRight":"ltr"===E.current?e(this,C,"m",Q).call(this,e(this,D,"f"),Math.min(r,a+this.step)):e(this,C,"m",Q).call(this,e(this,D,"f"),Math.max(s,a-this.step)),t.preventDefault();break;case" ":t.preventDefault()}},K=function(t){t.stopPropagation(),e(this,C,"m",N).call(this),e(this,C,"m",V).call(this)},Q=function(e,t,i=!1){if(e.value===t)return;const a=e.value;i&&!T()&&(z(this,"-animating"),e.addEventListener("transitionend",()=>{e.style.transition="",w(this,"-animating")},{once:!0}),e.style.transition=`transform ${g.motion.spring.fastEffects}`),e.value=t,e.markAsDirty(),e.markAsTouched(),e.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))?e.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})):e.value=a},Y.styles=l`:host { display: inline-block; vertical-align: middle; min-inline-size: var(--m3e-slider-min-width, 12.5rem); user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } :host(:not([disabled])) { cursor: pointer; } :host([size="extra-small"]), :host([size="small"]) { height: var(--m3e-slider-small-height, 2.75rem); } :host(:not(:dir(rtl))[size="extra-small"]) .base, :host(:not(:dir(rtl))[size="small"]) .base { --_slider-active-track-shape: var(--m3e-slider-small-active-track-shape, ${g.shape.corner.smallStart}); --_slider-inactive-track-start-shape: var( --m3e-slider-small-inactive-active-track-start-shape, ${g.shape.corner.smallStart} ); --_slider-inactive-track-end-shape: var( --m3e-slider-small-inactive-track-end-shape, ${g.shape.corner.smallEnd} ); } :host(:dir(rtl)[size="extra-small"]) .base, :host(:dir(rtl)[size="small"]) .base { --_slider-active-track-shape: var(--m3e-slider-small-active-track-shape, ${g.shape.corner.smallEnd}); --_slider-inactive-track-start-shape: var( --m3e-slider-small-inactive-active-track-start-shape, ${g.shape.corner.smallEnd} ); --_slider-inactive-track-end-shape: var( --m3e-slider-small-inactive-track-end-shape, ${g.shape.corner.smallStart} ); } :host([size="extra-small"]) .track { height: calc(var(--m3e-slider-extra-small-track-height, 1rem)); } :host([size="small"]) .track { height: calc(var(--m3e-slider-small-track-height, 1.5rem)); } :host([size="medium"]) { height: var(--m3e-slider-medium-height, 3.25rem); } :host(:not(:dir(rtl))[size="medium"]) .base { --_slider-active-track-shape: var( --m3e-slider-medium-active-track-shape, ${g.shape.corner.mediumStart} ); --_slider-inactive-track-start-shape: var( --m3e-slider-medium-inactive-active-track-start-shape, ${g.shape.corner.mediumStart} ); --_slider-inactive-track-end-shape: var( --m3e-slider-medium-inactive-track-end-shape, ${g.shape.corner.mediumEnd} ); } :host(:dir(rtl)[size="medium"]) .base { --_slider-active-track-shape: var(--m3e-slider-medium-active-track-shape, ${g.shape.corner.mediumEnd}); --_slider-inactive-track-start-shape: var( --m3e-slider-medium-inactive-active-track-start-shape, ${g.shape.corner.mediumEnd} ); --_slider-inactive-track-end-shape: var( --m3e-slider-medium-inactive-track-end-shape, ${g.shape.corner.mediumStart} ); } :host([size="medium"]) .track { height: var(--m3e-slider-medium-track-height, 2.5rem); } :host([size="large"]) { height: var(--m3e-slider-large-height, 4.25rem); } :host(:not(:dir(rtl))[size="large"]) .base { --_slider-active-track-shape: var(--m3e-slider-large-active-track-shape, ${g.shape.corner.largeStart}); --_slider-inactive-track-start-shape: var( --m3e-slider-large-inactive-active-track-start-shape, ${g.shape.corner.largeStart} ); --_slider-inactive-track-end-shape: var( --m3e-slider-large-inactive-track-end-shape, ${g.shape.corner.largeEnd} ); } :host(:dir(rtl)[size="large"]) .base { --_slider-active-track-shape: var(--m3e-slider-large-active-track-shape, ${g.shape.corner.largeEnd}); --_slider-inactive-track-start-shape: var( --m3e-slider-large-inactive-active-track-start-shape, ${g.shape.corner.largeEnd} ); --_slider-inactive-track-end-shape: var( --m3e-slider-large-inactive-track-end-shape, ${g.shape.corner.largeStart} ); } :host([size="large"]) .track { height: var(--m3e-slider-large-track-height, 3.5rem); } :host([size="extra-large"]) { height: var(--m3e-slider-extra-large-height, 6.75rem); } :host(:not(:dir(rtl))[size="extra-large"]) .base { --_slider-active-track-shape: var( --m3e-slider-extra-large-active-track-shape, ${g.shape.corner.extraLargeStart} ); --_slider-inactive-track-start-shape: var( --m3e-slider-extra-large-inactive-active-track-start-shape, ${g.shape.corner.extraLargeStart} ); --_slider-inactive-track-end-shape: var( --m3e-slider-extra-large-inactive-track-end-shape, ${g.shape.corner.extraLargeEnd} ); } :host(:dir(rtl)[size="extra-large"]) .base { --_slider-active-track-shape: var( --m3e-slider-extra-large-active-track-shape, ${g.shape.corner.extraLargeEnd} ); --_slider-inactive-track-start-shape: var( --m3e-slider-extra-large-inactive-active-track-start-shape, ${g.shape.corner.extraLargeEnd} ); --_slider-inactive-track-end-shape: var( --m3e-slider-extra-large-inactive-track-end-shape, ${g.shape.corner.extraLargeStart} ); } :host([size="extra-large"]) .track { height: var(--m3e-slider-extra-large-track-height, 6rem); } :host(:state(-animating)) .track-active, :host(:state(-animating)) .track-inactive.start, :host(:state(-animating)) .track-inactive.end { transition: ${r(`margin-inline-start ${g.motion.spring.fastEffects},\n        width ${g.motion.spring.fastEffects}`)}; } .base { display: inline-flex; align-items: center; position: relative; width: 100%; height: 100%; border-radius: inherit; outline: none; touch-action: none; } .track { position: relative; flex: 1 1 auto; touch-action: none; } .track-inactive, .track-active { position: absolute; height: 100%; touch-action: none; } .track-active { margin-inline-start: var(--_slider-active-track-offset, 0px); width: var(--_slider-active-track-size, 0px); border-radius: var(--_slider-active-track-middle-shape, var(--_slider-active-track-shape)); } .track-inactive.start { width: var(--_slider-inactive-track-before-size, 0px); border-radius: var(--_slider-inactive-track-start-shape); } .track-inactive.end { margin-inline-start: var(--_slider-inactive-track-after-offset, 0px); width: var(--_slider-inactive-track-after-size, 0px); border-radius: var(--_slider-inactive-track-end-shape); } .ticks { position: absolute; width: 100%; height: var(--m3e-slider-tick-size, 0.25rem); overflow: visible; touch-action: none; } .tick { position: absolute; top: 0; touch-action: none; inset-inline-start: calc(var(--m3e-slider-tick-size, 0.25rem) + calc(var(--m3e-slider-tick-size, 0.25rem) / 2)); width: var(--m3e-slider-tick-size, 0.25rem); height: var(--m3e-slider-tick-size, 0.25rem); border-radius: var(--m3e-slider-tick-shape, ${g.shape.corner.full}); } :host(:not([disabled])) .track-inactive { background-color: var(--m3e-slider-inactive-track-color, ${g.color.secondaryContainer}); } :host([disabled]) .track-inactive { background-color: color-mix( in srgb, var(--m3e-slider-disabled-inactive-track-color, ${g.color.onSurface}) var(--m3e-slider-disabled-inactive-track-opacity, 12%), transparent ); } :host(:not([disabled])) .track-active { background-color: var(--m3e-slider-active-track-color, ${g.color.primary}); } :host([disabled]) .track-active { background-color: color-mix( in srgb, var(--m3e-slider-disabled-active-track-color, ${g.color.onSurface}) var(--m3e-slider-disabled-active-track-opacity, 38%), transparent ); } :host(:not([disabled])) .tick.active { background-color: var(--m3e-slider-tick-active-color, ${g.color.onPrimary}); } :host([disabled]) .tick.active { background-color: var(--m3e-slider-disabled-tick-active-color, ${g.color.inverseOnSurface}); } :host(:not([disabled])) .tick.inactive { background-color: var(--m3e-slider-tick-inactive-color, ${g.color.onSecondaryContainer}); } :host([disabled]) .tick.inactive { background-color: var(--m3e-slider-disabled-tick-inactive-color, ${g.color.onSurface}); } :host(:not([discrete])) .tick.active { display: none; } :host(:hover[labelled]) .base, :host(:focus-within[labelled]) .base { --_slider-label-visibility: visible; --_slider-label-opacity: 1; --_slider-label-transform: scale(1); } @media (forced-colors: active) { :host(:not([disabled])) .track-inactive { background-color: unset; } :host(:not([disabled])) .base.range .track-inactive.start, :host(:not([disabled])) .track-inactive.end { border: 1px solid CanvasText; box-sizing: border-box; } :host(:not([disabled])) .tick.inactive { background-color: CanvasText; } :host(:not([disabled])) .tick.active { background-color: Canvas; } :host(:not([disabled])) .track-active { background-color: CanvasText; } :host([disabled]) .base.range .track-inactive.start, :host([disabled]) .track-inactive.end { border: 1px solid GrayText; box-sizing: border-box; } :host([disabled]) .track-active { background-color: GrayText; } :host([disabled]) .tick.inactive { background-color: GrayText; } :host([disabled]) .tick.active { background-color: Canvas; } }`,t([h(".base")],Y.prototype,"_base",void 0),t([c()],Y.prototype,"_ticks",void 0),t([n({reflect:!0})],Y.prototype,"size",void 0),t([n({type:Boolean,reflect:!0})],Y.prototype,"disabled",void 0),t([n({type:Boolean,reflect:!0})],Y.prototype,"discrete",void 0),t([n({type:Number})],Y.prototype,"min",void 0),t([n({type:Number})],Y.prototype,"max",void 0),t([n({type:Number})],Y.prototype,"step",void 0),t([n({type:Boolean})],Y.prototype,"labelled",void 0),t([n({attribute:!1})],Y.prototype,"displayWith",void 0),Y=t([x("m3e-slider")],Y);export{Y as M3eSliderElement,P as M3eSliderThumbElement};

package/dist/snackbar.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import { LitElement, html, nothing, css, unsafeCSS, isServer } from 'lit';

package/dist/snackbar.min.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import{LitElement as e,html as t,nothing as o,css as r,unsafeCSS as a,isServer as n}from"lit";import{Role as i,registerStyleSheet as s,DesignToken as c,customElement as l,prefersReducedMotion as d}from"@m3e/web/core";import{__classPrivateFieldGet as m,__classPrivateFieldSet as b,__decorate as p}from"tslib";import{property as u}from"lit/decorators.js";import"@m3e/web/button";import"@m3e/web/icon-button";var v,h,g,k,f,x,y,$,w;let S=w=class extends(i(e,"status")){constructor(){super(...arguments),v.add(this),h.set(this,-1),g.set(this,!1),k.set(this,e=>m(this,v,"m",$).call(this,e)),this.duration=3e3,this.action="",this.dismissible=!1,this.closeLabel="Close"}static get current(){return w.__current}get isActionTaken(){return m(this,g,"f")}connectedCallback(){super.connectedCallback(),this.addEventListener("beforetoggle",m(this,k,"f")),this.setAttribute("popover","manual"),this.ariaLive="polite"}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("beforetoggle",m(this,k,"f"))}render(){return t`<div class="base"><span class="supporting-text"><slot></slot></span>${m(this,v,"m",f).call(this)} ${m(this,v,"m",x).call(this)}</div>`}updated(e){super.updated(e),this.style.setProperty("--_snackbar-height",this.getBoundingClientRect().height/.8+"px")}};h=new WeakMap,g=new WeakMap,k=new WeakMap,v=new WeakSet,f=function(){return this.action?t`<m3e-button @click="${m(this,v,"m",y)}">${this.action}</m3e-button>`:o},x=function(){return this.dismissible?t`<m3e-icon-button aria-label="${this.closeLabel}" @click="${this.hidePopover}"><slot name="close-icon"><svg class="close-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg></slot></m3e-icon-button>`:o},y=function(){b(this,g,!0,"f"),this.hidePopover()},$=function(e){"open"==e.newState?(w.__current?.hidePopover(),w.__current=this,this.duration>0&&b(this,h,setTimeout(()=>this.hidePopover(),this.duration),"f")):(w.__current===this&&(w.__current=null),clearTimeout(m(this,h,"f")))},s(r`m3e-snackbar { margin-inline: auto; }`),S.styles=r`:host { position: fixed; top: calc(100vh - var(--_snackbar-height, 0px) - var(--m3e-snackbar-margin, 1rem)); display: inline-flex; align-items: center; min-width: var(--m3e-snackbar-min-width, 21.5rem); max-width: var(--m3e-snackbar-max-width, 42rem); visibility: hidden; border: none; margin: 0; padding: 0; opacity: 0; transform: scale(0.8); transition: ${a(`opacity ${c.motion.duration.short3} ${c.motion.easing.standard}, \n        transform ${c.motion.duration.short3} ${c.motion.easing.standard}, \n        overlay ${c.motion.duration.short3} ${c.motion.easing.standard} allow-discrete,\n        visibility ${c.motion.duration.short3} ${c.motion.easing.standard} allow-discrete`)}; } :host::backdrop { background-color: transparent; } :host(:popover-open) { visibility: visible; opacity: 1; transform: scale(1); } @starting-style { :host(:popover-open) { opacity: 0; transform: scale(0.8); } } .base { display: inline-flex; align-items: center; flex: 1 1 auto; box-sizing: border-box; padding: var(--m3e-snackbar-padding, 0 1rem 0 1rem); border-radius: var(--m3e-snackbar-container-shape, ${c.shape.corner.extraSmall}); background-color: var(--m3e-snackbar-container-color, ${c.color.inverseSurface}); font-size: var(--m3e-snackbar-supporting-text-font-size, ${c.typescale.standard.label.large.fontSize}); font-weight: var( --m3e-snackbar-supporting-text-font-weight, ${c.typescale.standard.label.large.fontWeight} ); line-height: var( --m3e-snackbar-supporting-text-line-height, ${c.typescale.standard.label.large.lineHeight} ); letter-spacing: var( --m3e-snackbar-supporting-text-tracking, ${c.typescale.standard.label.large.tracking} ); color: var(--m3e-snackbar-supporting-text-color, ${c.color.inverseOnSurface}); --m3e-text-button-label-text-color: var(--m3e-snackbar-action-text-color, ${c.color.inversePrimary}); --m3e-text-button-hover-label-text-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-hover-state-layer-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-focus-label-text-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-focus-state-layer-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-pressed-label-text-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-text-button-pressed-state-layer-color: var( --m3e-snackbar-action-text-color, ${c.color.inversePrimary} ); --m3e-standard-icon-button-icon-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-icon-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-hover-state-layer-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-icon-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-focus-state-layer-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-icon-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); --m3e-standard-icon-button-pressed-state-layer-color: var( --m3e-snackbar-close-icon-color, ${c.color.inverseOnSurface} ); } :host([dismissible]) .base { padding-inline-end: 0.5rem; } .supporting-text { flex: 1 1 auto; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-clamp: 2; margin-block: var(--m3e-snackbar-supporting-text-margin-block, 0.875rem); } ::slotted([slot="close-icon"]), .close-icon { width: 1em; font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important; } @media (forced-colors: active) { :host { background-color: Canvas; color: CanvasText; border-radius: ${c.shape.corner.small}; box-sizing: border-box; outline: 1px solid CanvasText; } }`,S.__current=null,p([u({type:Number})],S.prototype,"duration",void 0),p([u()],S.prototype,"action",void 0),p([u({type:Boolean,reflect:!0})],S.prototype,"dismissible",void 0),p([u({attribute:"close-label"})],S.prototype,"closeLabel",void 0),S=w=p([l("m3e-snackbar")],S);class P{static open(e,t,o,r){if(n)return;const a=document.createElement("m3e-snackbar");let i;a.append(document.createTextNode(e)),"string"==typeof t?a.action=t:"boolean"==typeof t?a.dismissible=t:i=t,"boolean"==typeof o?a.dismissible=o:i=o,r&&(i=r),void 0!==i?.duration&&(a.duration=i.duration),i?.closeLabel&&(a.closeLabel=i.closeLabel),a.addEventListener("toggle",e=>{"closed"===e.newState&&(d()?a.remove():a.addEventListener("transitionend",()=>a.remove(),{once:!0}),a.isActionTaken&&i?.actionCallback?.())}),(document.querySelector("m3e-theme")??document.body).append(a),a.showPopover()}static dismiss(){S.current?.hidePopover()}}globalThis.M3eSnackbar=P;export{P as M3eSnackbar,S as M3eSnackbarElement};

package/dist/split-button.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import { __classPrivateFieldGet, __classPrivateFieldSet, __decorate } from 'tslib';

package/dist/split-button.min.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import{__classPrivateFieldGet as e,__classPrivateFieldSet as t,__decorate as n}from"tslib";import{LitElement as a,html as i,css as r}from"lit";import{query as s,property as l}from"lit/decorators.js";import{Role as o,PressedController as c,HoverController as m,DesignToken as u,customElement as p}from"@m3e/web/core";import{M3eButtonElement as d}from"@m3e/web/button";import{M3eIconButtonElement as b}from"@m3e/web/icon-button";import"@m3e/web/button-group";var g,h,v,f,x,z,$,y,w,_,k,S;let W=class extends(o(a,"group")){constructor(){super(...arguments),g.add(this),h.set(this,void 0),v.set(this,void 0),f.set(this,!1),x.set(this,new c(this,{target:null,capture:!0,minPressedDuration:150,isPressedKey:e=>" "===e,callback:(t,n,a)=>{switch(a){case e(this,h,"f"):e(this,g,"m",_).call(this,t);break;case e(this,v,"f"):e(this,g,"m",k).call(this,t||e(this,f,"f"))}}})),z.set(this,new m(this,{target:null,callback:(n,a)=>{if(a===e(this,v,"f"))e(this,v,"f")?.disabled||e(this,v,"f")?.disabledInteractive||(t(this,f,n,"f"),e(this,g,"m",k).call(this,n))}})),this.variant="filled",this.size="small"}update(t){super.update(t),t.has("variant")&&e(this,g,"m",w).call(this)}render(){return i`<m3e-button-group class="base" disable-role variant="connected" size="${this.size}"><slot name="leading-button" @slotchange="${e(this,g,"m",$)}"></slot><slot name="trailing-button" @slotchange="${e(this,g,"m",y)}"></slot></m3e-button-group>`}};h=new WeakMap,v=new WeakMap,f=new WeakMap,x=new WeakMap,z=new WeakMap,g=new WeakSet,$=function(n){e(this,h,"f")&&e(this,x,"f").unobserve(e(this,h,"f")),t(this,h,n.target.assignedElements({flatten:!0}).find(e=>e instanceof d),"f"),e(this,h,"f")&&e(this,x,"f").observe(e(this,h,"f")),e(this,g,"m",w).call(this)},y=function(n){e(this,v,"f")&&(e(this,x,"f").unobserve(e(this,v,"f")),e(this,z,"f").unobserve(e(this,v,"f"))),t(this,v,n.target.assignedElements({flatten:!0}).find(e=>e instanceof b),"f"),e(this,v,"f")&&(e(this,x,"f").observe(e(this,v,"f")),e(this,z,"f").observe(e(this,v,"f"))),e(this,g,"m",w).call(this)},w=function(){e(this,h,"f")&&(e(this,h,"f").variant=this.variant,e(this,h,"f").size=this.size,e(this,h,"f").shape="rounded"),e(this,v,"f")&&(e(this,v,"f").width="default",e(this,v,"f").shape="rounded",e(this,v,"f").setAttribute("variant",this.variant),e(this,v,"f").size=this.size)},_=function(t){t&&e(this,h,"f")?e(this,g,"m",S).call(this,e(this,h,"f"),"--_leading-button-shape"):this._base?.style.removeProperty("--_leading-button-shape")},k=function(t){t&&e(this,v,"f")?e(this,g,"m",S).call(this,e(this,v,"f"),"--_trailing-button-shape"):this._base?.style.removeProperty("--_trailing-button-shape")},S=function(e,t){const n=e.clientHeight/2;n&&this._base?.style.setProperty(t,`${n}px`)},W.styles=r`:host { display: inline-flex; vertical-align: middle; } ::slotted([slot="leading-button"]) { flex: 1 1 auto; min-width: 0; --_button-start-shape-pressed-morph: var(--_leading-button-shape, ${u.shape.corner.full}); } ::slotted([slot="trailing-button"]:not([aria-expanded="true"])) { --m3e-icon-button-extra-small-default-leading-space: var( --m3e-split-button-extra-small-trailing-button-unselected-leading-space, 0.75rem ); --m3e-icon-button-extra-small-default-trailing-space: var( --m3e-split-button-extra-small-trailing-button-unselected-trailing-space, 0.875rem ); --m3e-icon-button-small-default-leading-space: var( --m3e-split-button-small-trailing-button-unselected-leading-space, 0.75rem ); --m3e-icon-button-small-default-trailing-space: var( --m3e-split-button-small-trailing-button-unselected-trailing-space, 0.875rem ); --m3e-icon-button-medium-default-leading-space: var( --m3e-split-button-medium-trailing-button-unselected-leading-space, 0.8125rem ); --m3e-icon-button-medium-default-trailing-space: var( --m3e-split-button-medium-trailing-button-unselected-trailing-space, 1.0625rem ); --m3e-icon-button-large-default-leading-space: var( --m3e-split-button-large-trailing-button-unselected-leading-space, 1.625rem ); --m3e-icon-button-large-default-trailing-space: var( --m3e-split-button-large-trailing-button-unselected-trailing-space, 2rem ); --m3e-icon-button-extra-large-default-leading-space: var( --m3e-split-button-extra-large-trailing-button-unselected-leading-space, 2.3125rem ); --m3e-icon-button-extra-large-default-trailing-space: var( --m3e-split-button-extra-large-trailing-button-unselected-trailing-space, 3.0625rem ); } ::slotted([slot="trailing-button"][aria-expanded="true"]) { --m3e-icon-button-extra-small-default-leading-space: var( --m3e-split-button-extra-small-trailing-button-selected-leading-space, 0.8125rem ); --m3e-icon-button-extra-small-default-trailing-space: var( --m3e-split-button-extra-small-trailing-button-selected-trailing-space, 0.8125rem ); --m3e-icon-button-small-default-leading-space: var( --m3e-split-button-small-trailing-button-selected-leading-space, 0.8125rem ); --m3e-icon-button-small-default-trailing-space: var( --m3e-split-button-small-trailing-button-selected-trailing-space, 0.8125rem ); --m3e-icon-button-medium-default-leading-space: var( --m3e-split-button-medium-trailing-button-selected-leading-space, 0.9375rem ); --m3e-icon-button-medium-default-trailing-space: var( --m3e-split-button-medium-trailing-button-selected-trailing-space, 0.9375rem ); --m3e-icon-button-large-default-leading-space: var( --m3e-split-button-large-trailing-button-selected-leading-space, 1.8125rem ); --m3e-icon-button-large-default-trailing-space: var( --m3e-split-button-large-trailing-button-selected-trailing-space, 1.8125rem ); --m3e-icon-button-extra-large-default-leading-space: var( --m3e-split-button-extra-large-trailing-button-selected-leading-space, 2.6875rem ); --m3e-icon-button-extra-large-default-trailing-space: var( --m3e-split-button-extra-large-trailing-button-selected-trailing-space, 2.6875rem ); } ::slotted([slot="leading-button"]:not(:hover)), ::slotted([slot="leading-button"]:disabled), ::slotted([slot="leading-button"][disabled-interactive]) { --m3e-connected-button-group-extra-small-inner-shape: var( --m3e-split-button-extra-small-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-small-inner-shape: var( --m3e-split-button-small-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-medium-inner-shape: var( --m3e-split-button-medium-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-large-inner-shape: var( --m3e-split-button-large-inner-corner-size, ${u.shape.corner.small} ); --m3e-connected-button-group-extra-large-inner-shape: var( --m3e-split-button-extra-large-inner-corner-size, ${u.shape.corner.medium} ); } ::slotted([slot="leading-button"]:hover:not(:disabled):not([disabled-interactive])), ::slotted([slot="trailing-button"]:not([aria-expanded="true"]):hover:not(:disabled):not([disabled-interactive])) { --m3e-connected-button-group-extra-small-inner-shape: var( --m3e-split-button-extra-small-inner-corner-hover-size, ${u.shape.corner.small} ); --m3e-connected-button-group-small-inner-shape: var( --m3e-split-button-small-inner-corner-hover-size, ${u.shape.corner.medium} ); --m3e-connected-button-group-medium-inner-shape: var( --m3e-split-button-medium-inner-corner-hover-size, ${u.shape.corner.medium} ); --m3e-connected-button-group-large-inner-shape: var( --m3e-split-button-large-inner-corner-hover-size, ${u.shape.corner.largeIncreased} ); --m3e-connected-button-group-extra-large-inner-shape: var( --m3e-split-button-extra-large-inner-corner-hover-size, ${u.shape.corner.largeIncreased} ); } ::slotted([slot="leading-button"]), ::slotted([slot="trailing-button"]) { --m3e-connected-button-group-extra-small-inner-pressed-shape: var( --m3e-split-button-extra-small-inner-corner-pressed-size, ${u.shape.corner.small} ); --m3e-connected-button-group-small-inner-pressed-shape: var( --m3e-split-button-small-inner-corner-pressed-size, ${u.shape.corner.medium} ); --m3e-connected-button-group-medium-inner-pressed-shape: var( --m3e-split-button-medium-inner-corner-pressed-size, ${u.shape.corner.medium} ); --m3e-connected-button-group-large-inner-pressed-shape: var( --m3e-split-button-large-inner-corner-pressed-size, ${u.shape.corner.largeIncreased} ); --m3e-connected-button-group-extra-large-inner-pressed-shape: var( --m3e-split-button-extra-large-inner-corner-pressed-size, ${u.shape.corner.largeIncreased} ); } ::slotted([slot="trailing-button"]:not([aria-expanded="true"]):not(:hover)), ::slotted([slot="trailing-button"]:disabled), ::slotted([slot="trailing-button"][disabled-interactive]) { --m3e-connected-button-group-extra-small-inner-shape: var( --m3e-split-button-extra-small-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-small-inner-shape: var( --m3e-split-button-small-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-medium-inner-shape: var( --m3e-split-button-medium-inner-corner-size, ${u.shape.corner.extraSmall} ); --m3e-connected-button-group-large-inner-shape: var( --m3e-split-button-large-inner-corner-size, ${u.shape.corner.small} ); --m3e-connected-button-group-extra-large-inner-shape: var( --m3e-split-button-extra-large-inner-corner-size, ${u.shape.corner.medium} ); } ::slotted([slot="trailing-button"][aria-expanded="true"]) { --_icon-button-icon-transform: rotate(180deg); --_button-rounded-start-shape: var(--_trailing-button-shape, ${u.shape.corner.full}); --_button-rounded-end-shape: var(--_trailing-button-shape, ${u.shape.corner.full}); } ::slotted([slot="trailing-button"]) { --_button-end-shape-pressed-morph: var(--_trailing-button-shape, ${u.shape.corner.full}); } .base { --m3e-icon-button-extra-small-icon-size: calc( var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${u.density.calc(0)} ); --m3e-button-extra-small-icon-size: calc( var(--m3e-spit-button-extra-small-trailing-button-icon-size, 1.375rem) + ${u.density.calc(0)} ); --m3e-icon-button-small-icon-size: calc( var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${u.density.calc(-1)} ); --m3e-button-small-icon-size: calc( var(--m3e-spit-button-small-trailing-button-icon-size, 1.375rem) + ${u.density.calc(-1)} ); --m3e-icon-button-medium-icon-size: calc( var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${u.density.calc(-2)} ); --m3e-button-medium-icon-size: calc( var(--m3e-spit-button-medium-trailing-button-icon-size, 1.625rem) + ${u.density.calc(-2)} ); --m3e-icon-button-large-icon-size: calc( var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${u.density.calc(-3)} ); --m3e-button-large-icon-size: calc( var(--m3e-spit-button-large-trailing-button-icon-size, 2.375rem) + ${u.density.calc(-3)} ); --m3e-icon-button-extra-large-icon-size: calc( var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${u.density.calc(-3)} ); --m3e-button-extra-large-icon-size: calc( var(--m3e-spit-button-extra-large-trailing-button-icon-size, 3.125rem) + ${u.density.calc(-3)} ); } :host([size="extra-small"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-small-between-spacing, 0.125rem); } :host([size="small"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-small-between-spacing, 0.125rem); } :host([size="medium"]).base { --m3e-connected-button-group-spacing: var(--m3e-split-button-medium-between-spacing, 0.125rem); } :host([size="large"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-large-between-spacing, 0.125rem); } :host([size="extra-large"]) .base { --m3e-connected-button-group-spacing: var(--m3e-split-button-extra-large-between-spacing, 0.125rem); }`,n([s(".base")],W.prototype,"_base",void 0),n([l({reflect:!0})],W.prototype,"variant",void 0),n([l({reflect:!0})],W.prototype,"size",void 0),W=n([p("m3e-split-button")],W);export{W as M3eSplitButtonElement};

package/dist/split-pane.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import { __classPrivateFieldGet, __classPrivateFieldSet, __decorate } from 'tslib';

package/dist/split-pane.min.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import{__classPrivateFieldGet as t,__classPrivateFieldSet as e,__decorate as i}from"tslib";import{LitElement as s,html as a,css as n,unsafeCSS as h}from"lit";import{state as l,query as r,property as o}from"lit/decorators.js";import{ifDefined as c}from"lit/directives/if-defined.js";import{FormAssociated as d,Disabled as p,ReconnectedCallback as m,AttachInternals as u,PressedController as v,setCustomState as f,MutationController as g,formValue as b,deleteCustomState as w,prefersReducedMotion as y,addCustomState as $,registerStyleSheet as k,DesignToken as x,spaceSeparatedStringConverter as _,customElement as M}from"@m3e/web/core";import{M3eBreakpointObserver as D,Breakpoint as z}from"@m3e/web/core/layout";import{M3eDirectionality as E}from"@m3e/web/core/bidi";var W,P,H,O,T,C,S,F,L,U,A,N,R,I,X,j,B,V,q,Y,K,G,J,Q,Z,tt,et,it,st,at,nt;let ht=class extends(d(p(m(u(s))))){constructor(){super(...arguments),W.add(this),P.set(this,void 0),H.set(this,0),O.set(this,!1),T.set(this,0),C.set(this,void 0),S.set(this,new v(this,{target:null,isPressedKey:t=>" "===t,minPressedDuration:150,callback:t=>f(this,"-pressed",t&&!this.disabled)})),F.set(this,new g(this,{target:null,config:{attributeFilter:["hidden"]},callback:()=>t(this,W,"m",I).call(this,"start")})),L.set(this,new g(this,{target:null,config:{attributeFilter:["hidden"]},callback:()=>t(this,W,"m",I).call(this,"end")})),this.value=50,this.min=0,this.max=100,this.step=1,this.detents=[],this.wrapDetents=!1,this.orientation="horizontal",this.label="Resize panes",this.valueFormatter=(t,e,i)=>{if((t=Math.round(t))>=48&&t<=52)return"Panes equally sized";switch(t){case 0:return"horizontal"===e?"ltr"===i?"Left pane collapsed":"Right pane collapsed":"Top pane collapsed";case 100:return"horizontal"===e?"ltr"===i?"Right pane collapsed":"Left pane collapsed":"Bottom pane collapsed";default:return"horizontal"===e?"ltr"===i?`Left pane ${t}%, right pane ${100-t}%`:`Left pane ${100-t}%, right pane ${t}%`:`Top pane ${t}%, bottom pane ${100-t}%`}}}get currentOrientation(){return this._orientation??("vertical"!==this.orientation?"horizontal":"vertical")}get[(P=new WeakMap,H=new WeakMap,O=new WeakMap,T=new WeakMap,C=new WeakMap,S=new WeakMap,F=new WeakMap,L=new WeakMap,W=new WeakSet,b)](){return this.value?.toString()??null}collapse(){this.snapToValue(this.min)}expand(){this.snapToValue(this.max)}snapToValue(e){const i=t(this,W,"m",Z).call(this,e);e=i>-1?t(this,W,"m",it).call(this,this.detents[i]):e,t(this,C,"f")?t(this,W,"m",Q).call(this,e):t(this,W,"m",at).call(this,e)}disconnectedCallback(){super.disconnectedCallback(),t(this,W,"m",q).call(this),t(this,S,"f").unobserve(this._dragHandle)}reconnectedCallback(){super.reconnectedCallback(),t(this,W,"m",j).call(this),"auto"===this.orientation&&t(this,W,"m",B).call(this)}willUpdate(e){super.willUpdate(e),e.has("orientation")&&(t(this,P,"f")?.call(this),"auto"===this.orientation?t(this,W,"m",B).call(this):(this._orientation=void 0,t(this,W,"m",V).call(this)))}updated(t){super.updated(t),t.has("value")&&this._base.style.setProperty("--_split-pane-value",`${this.value}%`)}firstUpdated(e){super.firstUpdated(e),t(this,W,"m",j).call(this)}render(){return a`<div class="base"><div class="start" id="start" ?inert="${this.value<=0}"><slot name="start" @slotchange="${t(this,W,"m",A)}"></slot></div>${t(this,W,"m",U).call(this)}<div class="end" ?inert="${this.value>=100}"><slot name="end" @slotchange="${t(this,W,"m",N)}"></slot></div></div>`}};U=function(){return a`<div id="drag-handle" class="drag-handle" role="separator" ?hidden="${this.disabled}" tabindex="0" aria-label="${this.label}" aria-controls="start" aria-orientation="${"horizontal"===this.currentOrientation?"vertical":"horizontal"}" aria-valuemin="${this.min}" aria-valuemax="${this.max}" aria-valuenow="${this.value}" aria-valuetext="${c(this.valueFormatter?.(this.value,this.currentOrientation,E.current))}" @pointerdown="${t(this,W,"m",Y)}" @pointerup="${t(this,W,"m",G)}" @pointermove="${t(this,W,"m",K)}" @keydown="${t(this,W,"m",J)}" @dblclick="${t(this,W,"m",nt)}"><div class="handle"><m3e-focus-ring for="drag-handle"></m3e-focus-ring><m3e-state-layer for="drag-handle"></m3e-state-layer></div><div class="touch"></div></div>`},A=function(e){t(this,W,"m",R).call(this,e.target,t(this,F,"f"),"-with-start")},N=function(e){t(this,W,"m",R).call(this,e.target,t(this,L,"f"),"-with-end")},R=function(e,i,s){for(const t of i.targets)i.unobserve(t);const a=new Array;f(this,s,t(this,W,"m",X).call(this,e,a));for(const t of a)t instanceof HTMLElement&&i.observe(t)},I=function(e){f(this,`-with-${e}`,t(this,W,"m",X).call(this,this.shadowRoot?.querySelector(`slot[name='${e}']`)))},X=function(t,e){return(e=e??[]).push(...t?.assignedElements({flatten:!0})??[]),e.length>0&&!e.every(t=>t.hasAttribute("hidden"))},j=function(){t(this,S,"f").observe(this._dragHandle)},B=function(){e(this,P,D.observe([z.XSmall],e=>{this._orientation=e.get(z.XSmall)?"vertical":"horizontal",t(this,W,"m",V).call(this)}),"f")},V=function(){f(this,"-vertical","vertical"===this.currentOrientation)},q=function(){w(this,"-vertical"),this._orientation=void 0,t(this,P,"f")?.call(this),e(this,P,void 0,"f")},Y=function(t){"mouse"===t.pointerType&&t.button>1||this.disabled||(this._dragHandle.setPointerCapture(t.pointerId),e(this,O,!1,"f"),e(this,H,"vertical"===this.currentOrientation?t.clientY:t.clientX,"f"),e(this,T,"vertical"===this.currentOrientation?this.clientHeight:this.clientWidth,"f"))},K=function(i){if(!this._dragHandle.hasPointerCapture(i.pointerId))return;const s="vertical"===this.currentOrientation?i.clientY:i.clientX;let a=t(this,T,"f")>0?(s-t(this,H,"f"))/t(this,T,"f")*100:0;"rtl"===E.current&&"vertical"!==this.currentOrientation&&(a=-a),t(this,W,"m",Q).call(this,this.value+a,!1)&&(e(this,H,s,"f"),e(this,O,!0,"f"))},G=function(i){if(!("mouse"===i.pointerType&&i.button>1)&&this._dragHandle.hasPointerCapture(i.pointerId)){this._dragHandle.releasePointerCapture(i.pointerId),e(this,H,0,"f"),e(this,T,0,"f");const s=t(this,W,"m",Z).call(this,this.value);if(s>=0){const e=t(this,W,"m",it).call(this,this.detents[s]);void 0!==e&&t(this,W,"m",at).call(this,e,!1)}t(this,O,"f")&&(this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})),e(this,O,!1,"f"))}},J=function(e){const i="ltr"===E.current||"vertical"===this.currentOrientation;switch(e.key){case"Up":case"ArrowUp":case"Left":case"ArrowLeft":{e.preventDefault();const s=t(this,W,"m",Z).call(this,this.value);if(s>=0){const e=i?t(this,W,"m",et).call(this,s):t(this,W,"m",tt).call(this,s);if(e!==s&&!t(this,C,"f")){const i=t(this,W,"m",it).call(this,this.detents[e]);void 0!==i&&t(this,W,"m",at).call(this,i)}}else this.step>1?t(this,C,"f")||t(this,W,"m",at).call(this,this.value+(i?-this.step:this.step)):t(this,W,"m",Q).call(this,this.value+(i?-this.step:this.step));break}case"Down":case"ArrowDown":case"Right":case"ArrowRight":{e.preventDefault();const s=t(this,W,"m",Z).call(this,this.value);if(s>=0){const e=i?t(this,W,"m",tt).call(this,s):t(this,W,"m",et).call(this,s);if(e!==s&&!t(this,C,"f")){const i=t(this,W,"m",it).call(this,this.detents[e]);void 0!==i&&t(this,W,"m",at).call(this,i)}}else this.step>1?t(this,C,"f")||t(this,W,"m",at).call(this,this.value+(i?this.step:-this.step)):t(this,W,"m",Q).call(this,this.value+(i?this.step:-this.step));break}case"Home":if(e.preventDefault(),!t(this,C,"f")){const e=t(this,W,"m",Z).call(this,this.min);e>-1?t(this,W,"m",at).call(this,t(this,W,"m",it).call(this,this.detents[e])):t(this,W,"m",at).call(this,this.min)}break;case"End":if(e.preventDefault(),!t(this,C,"f")){const e=t(this,W,"m",Z).call(this,this.max);e>-1?t(this,W,"m",at).call(this,t(this,W,"m",it).call(this,this.detents[e])):t(this,W,"m",at).call(this,this.max)}break;case"PageUp":if(e.preventDefault(),!t(this,C,"f")){const e=t(this,W,"m",Z).call(this,this.value);if(e>=0){const i=t(this,W,"m",et).call(this,e);if(i!==e){const e=t(this,W,"m",it).call(this,this.detents[i]);void 0!==e&&t(this,W,"m",at).call(this,e)}}else t(this,W,"m",at).call(this,this.value-Math.max(10,this.step))}break;case"PageDown":if(e.preventDefault(),!t(this,C,"f")){const e=t(this,W,"m",Z).call(this,this.value);if(e>=0){const i=t(this,W,"m",tt).call(this,e);if(i!==e){const e=t(this,W,"m",it).call(this,this.detents[i]);void 0!==e&&t(this,W,"m",at).call(this,e)}}else t(this,W,"m",at).call(this,this.value+Math.max(10,this.step))}break;case"Enter":t(this,C,"f")||t(this,W,"m",nt).call(this);break;case" ":e.preventDefault(),t(this,C,"f")||t(this,W,"m",nt).call(this)}},Q=function(e,i=!0){if(t(this,W,"m",st).call(this),(e=Math.max(this.min,Math.min(this.max,e)))!=this.value){const t=this.value;if(this.value=e,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0})))return this._base.style.setProperty("--_split-pane-value",`${this.value}%`),i&&this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})),!0;this.value=t}return!1},Z=function(e){let i=-1,s=1/0;for(let a=0;a<this.detents.length;a++){const n=t(this,W,"m",it).call(this,this.detents[a]);if(void 0===n)continue;const h=Math.abs(e-n);h<s&&(s=h,i=a)}return i},tt=function(e){const i=t(this,W,"m",it).call(this,this.detents[e]);if(void 0===i)return e;let s=1/0,a=e;for(let n=0;n<this.detents.length;n++){if(n===e)continue;const h=t(this,W,"m",it).call(this,this.detents[n]);void 0!==h&&(h>i&&h<s&&(s=h,a=n))}return a},et=function(e){const i=t(this,W,"m",it).call(this,this.detents[e]);if(void 0===i)return e;let s=-1/0,a=e;for(let n=0;n<this.detents.length;n++){if(n===e)continue;const h=t(this,W,"m",it).call(this,this.detents[n]);void 0!==h&&(h<i&&h>s&&(s=h,a=n))}return a},it=function(t){const e=t.endsWith("px")?this.clientWidth/parseFloat(t):parseFloat(t);return isNaN(e)?void 0:e},st=function(){t(this,C,"f")?.cancel(),e(this,C,void 0,"f")},at=function(i,s=!0){t(this,W,"m",st).call(this),(i=Math.max(this.min,Math.min(this.max,i)))!==this.value&&(y()?t(this,W,"m",Q).call(this,i,s):($(this,"-animating"),e(this,C,this._base.animate([{"--_split-pane-value":`${this.value}%`},{"--_split-pane-value":`${i}%`}],{duration:250,easing:"cubic-bezier(0.2, 0.0, 0, 1.0)"}),"f"),t(this,C,"f").onfinish=()=>{t(this,W,"m",Q).call(this,i,s),e(this,C,void 0,"f"),w(this,"-animating")}))},nt=function(){if(0===this.detents.length)return;const e=t(this,W,"m",Z).call(this,this.value);if(-1===e)return;let i=t(this,W,"m",tt).call(this,e);if(i===e&&this.wrapDetents&&(i=t(this,W,"m",Z).call(this,0),-1===i))return;const s=t(this,W,"m",it).call(this,this.detents[i]);void 0!==s&&t(this,W,"m",at).call(this,s)},k(n`@property --_split-pane-value { syntax: "<length-percentage>"; inherits: true; initial-value: 50%; }</length-percentage>`),ht.styles=n`:host { display: block; } .base { display: flex; width: 100%; height: 100%; overflow: hidden; } :host(:not(:state(-vertical))) .base { flex-direction: row; } :host(:state(-vertical)) .base { flex-direction: column; } :host(:state(-with-start):state(-with-end)) .base:not(:has(.drag-handle[hidden])) .start { flex: 0 1 calc(var(--_split-pane-value) - calc(var(--m3e-split-pane-drag-handle-container-width, 1.5rem) / 2)); } :host(:state(-with-start):state(-with-end)) .base:has(.drag-handle[hidden]) .start { flex: 0 1 var(--_split-pane-value); } :host(:not(:state(-with-end))) .start { flex: 1 1 auto; } :host(:state(-with-end)) .end { flex: 1 1 auto; } :host(:not(:state(-with-end))) .end { display: none; } :host(:not(:state(-animating))) .start[inert], :host(:not(:state(-animating))) .end[inert] { visibility: hidden; } .drag-handle { flex: none; display: flex; align-items: center; justify-content: center; outline: none; touch-action: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); --m3e-state-layer-hover-color: var(--m3e-split-pane-drag-handle-hover-color, ${x.color.onSurface}); --m3e-state-layer-hover-opacity: var(--m3e-split-pane-drag-handle-hover-opacity, 8%); --m3e-state-layer-focus-color: var(--m3e-split-pane-drag-handle-focus-color, ${x.color.onSurface}); --m3e-state-layer-focus-opacity: var(--m3e-split-pane-drag-handle-focus-opacity, 10%); } :host(:is(:not(:state(-with-start)), :not(:state(-with-end)))) .drag-handle, .drag-handle[hidden] { display: none; } :host(:not(:state(-pressed))) .drag-handle:not([aria-disabled]) { cursor: grab; } :host(:state(-pressed)) .drag-handle:not([aria-disabled]) { cursor: grabbing; } .handle { position: relative; transition: ${h(`background-color ${x.motion.duration.short4} ${x.motion.easing.standard},\n        width ${x.motion.spring.fastEffects}, height ${x.motion.spring.fastEffects}`)}; } .touch { z-index: 1; position: absolute; height: 3rem; width: 3rem; margin: auto; touch-action: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } :host(:not(:state(-pressed))) .handle { background-color: var(--m3e-split-pane-drag-handle-color, ${x.color.outline}); border-radius: var(--m3e-split-pane-drag-handle-shape, ${x.shape.corner.full}); } :host(:state(-pressed)) .handle { background-color: var(--m3e-split-pane-drag-handle-pressed-color, ${x.color.onSurface}); border-radius: var(--m3e-split-pane-drag-handle-pressed-shape, ${x.shape.corner.medium}); } :host(:not(:state(-vertical))) .drag-handle { flex-direction: column; width: var(--m3e-split-pane-drag-handle-container-width, 1.5rem); } :host(:not(:state(-vertical)):not(:state(-pressed))) .handle { width: var(--m3e-split-pane-drag-handle-width, 0.25rem); height: var(--m3e-split-pane-drag-handle-height, 3rem); } :host(:not(:state(-vertical)):state(-pressed)) .handle { width: var(--m3e-split-pane-drag-handle-pressed-width, 0.75rem); height: var(--m3e-split-pane-drag-handle-pressed-height, 3.25rem); } :host(:state(-vertical)) .drag-handle { height: var(--m3e-split-pane-drag-handle-container-width, 1.5rem); } :host(:state(-vertical):not(:state(-pressed))) .handle { width: var(--m3e-split-pane-drag-handle-height, 3rem); height: var(--m3e-split-pane-drag-handle-width, 0.25rem); } :host(:state(-vertical):state(-pressed)) .handle { width: var(--m3e-split-pane-drag-handle-pressed-height, 3.25rem); height: var(--m3e-split-pane-drag-handle-pressed-width, 0.75rem); } @media (prefers-reduced-motion) { .handle { transition: none; } } @media (forced-colors: active) { :host(:state(-pressed)) .handle, :host(:not(:state(-pressed))) .handle { background-color: ButtonText; } }`,i([l()],ht.prototype,"_orientation",void 0),i([r(".base")],ht.prototype,"_base",void 0),i([r(".drag-handle")],ht.prototype,"_dragHandle",void 0),i([o({type:Number})],ht.prototype,"value",void 0),i([o({type:Number})],ht.prototype,"min",void 0),i([o({type:Number})],ht.prototype,"max",void 0),i([o({type:Number})],ht.prototype,"step",void 0),i([o({attribute:"detents",converter:_})],ht.prototype,"detents",void 0),i([o({attribute:"wrap-detents",type:Boolean})],ht.prototype,"wrapDetents",void 0),i([o()],ht.prototype,"orientation",void 0),i([o()],ht.prototype,"label",void 0),i([o()],ht.prototype,"valueFormatter",void 0),ht=i([M("m3e-split-pane")],ht);export{ht as M3eSplitPaneElement};

package/dist/src/autocomplete/AutocompleteElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteElement.d.ts","sourceRoot":"","sources":["../../../src/autocomplete/AutocompleteElement.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"AutocompleteElement.d.ts","sourceRoot":"","sources":["../../../src/autocomplete/AutocompleteElement.ts"],"names":[],"mappings":"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"}

package/dist/src/core/a11y/list-key/ListKeyManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListKeyManager.d.ts","sourceRoot":"","sources":["../../../../../src/core/a11y/list-key/ListKeyManager.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,OAAO,EAAqC,WAAW,EAAE,MAAM,aAAa,CAAC;AAE7E,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAa,aAAa,EAAE,MAAM,aAAa,CAAC;AAEvD;;;GAGG;AACH,qBAAa,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,aAAa,CAAE,SAAQ,WAAW,CAAC,CAAC,CAAC;;IAGvF;;;;OAIG;IACI,IAAI,UAAS;IAEpB;;;;OAIG;IACI,UAAU,UAAS;IAE1B;;;;OAIG;IACI,aAAa,UAAS;IAE7B;;;OAGG;IACI,SAAS,SAAM;IAEtB;;;OAGG;IACI,QAAQ,UAAS;IAExB;;OAEG;IACI,gBAAgB,EAAE,WAAW,EAAE,CAAM;IAE5C;;;;OAIG;IACI,aAAa,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAoD;IAE9F;;;OAGG;IACI,cAAc,EAAE,KAAK,GAAG,KAAK,CAAS;IAE7C,kBAAkB;IACT,QAAQ,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG;QAAE,KAAK,EAAE,SAAS,CAAC,EAAE,CAAC;QAAC,OAAO,EAAE,SAAS,CAAC,EAAE,CAAA;KAAE;IAK7E,kBAAkB;IACT,gBAAgB,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI;IAO3D;;;;;OAKG;IACH,cAAc,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAK7C;;;;;OAKG;IACH,iBAAiB,CAAC,OAAO,GAAE,OAAc,EAAE,SAAS,GAAE,MAAW,GAAG,IAAI;IAMxE;;;;;OAKG;IACH,QAAQ,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAKvC;;;;OAIG;IACH,uBAAuB,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAKtD;;;;OAIG;IACH,oBAAoB,CAAC,GAAG,SAAS,EAAE,WAAW,EAAE,GAAG,IAAI;IAKvD;;;;OAIG;IACH,aAAa,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAS5C;;;;OAIG;IACH,iBAAiB,CAAC,aAAa,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,GAAG,IAAI;IAK5D;;;;OAIG;IACH,kBAAkB,CAAC,cAAc,EAAE,KAAK,GAAG,KAAK,GAAG,IAAI;IAKvD;;;OAGG;IACH,SAAS,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;CA0LlC"}
+{"version":3,"file":"ListKeyManager.d.ts","sourceRoot":"","sources":["../../../../../src/core/a11y/list-key/ListKeyManager.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,OAAO,EAAqC,WAAW,EAAE,MAAM,aAAa,CAAC;AAE7E,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAa,aAAa,EAAE,MAAM,aAAa,CAAC;AAEvD;;;GAGG;AACH,qBAAa,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,aAAa,CAAE,SAAQ,WAAW,CAAC,CAAC,CAAC;;IAGvF;;;;OAIG;IACI,IAAI,UAAS;IAEpB;;;;OAIG;IACI,UAAU,UAAS;IAE1B;;;;OAIG;IACI,aAAa,UAAS;IAE7B;;;OAGG;IACI,SAAS,SAAM;IAEtB;;;OAGG;IACI,QAAQ,UAAS;IAExB;;OAEG;IACI,gBAAgB,EAAE,WAAW,EAAE,CAAM;IAE5C;;;;OAIG;IACI,aAAa,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAoD;IAE9F;;;OAGG;IACI,cAAc,EAAE,KAAK,GAAG,KAAK,CAAS;IAE7C,kBAAkB;IACT,QAAQ,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG;QAAE,KAAK,EAAE,SAAS,CAAC,EAAE,CAAC;QAAC,OAAO,EAAE,SAAS,CAAC,EAAE,CAAA;KAAE;IAK7E,kBAAkB;IACT,gBAAgB,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,GAAG,SAAS,GAAG,IAAI;IAO3D;;;;;OAKG;IACH,cAAc,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAK7C;;;;;OAKG;IACH,iBAAiB,CAAC,OAAO,GAAE,OAAc,EAAE,SAAS,GAAE,MAAW,GAAG,IAAI;IAMxE;;;;;OAKG;IACH,QAAQ,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAKvC;;;;OAIG;IACH,uBAAuB,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAKtD;;;;OAIG;IACH,oBAAoB,CAAC,GAAG,SAAS,EAAE,WAAW,EAAE,GAAG,IAAI;IAKvD;;;;OAIG;IACH,aAAa,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAS5C;;;;OAIG;IACH,iBAAiB,CAAC,aAAa,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,GAAG,IAAI;IAK5D;;;;OAIG;IACH,kBAAkB,CAAC,cAAc,EAAE,KAAK,GAAG,KAAK,GAAG,IAAI;IAKvD;;;OAGG;IACH,SAAS,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;CAwLlC"}

package/dist/src/core/shared/primitives/ElevationElement.d.ts

@@ -12,7 +12,7 @@ declare const M3eElevationElement_base: import("../mixins/Constructor").Construc
  * The component can also be attached to another element using the `for` attribute.  When attached, elevation will
  * be lifted by 1 level on hover. This can be disabled using the `disabled` attribute.
  *
- * Alternately, use the `attach` and `detach` methods to programmatically attach and detach this element to another.
+ * Alternatively, use the `attach` and `detach` methods to programmatically attach and detach this element to another.
  *
  * @example
  * The following example illustrates basic markup. Note how the parenting element's position is `relative`. A parenting

package/dist/src/core/shared/primitives/FocusRingElement.d.ts

@@ -11,7 +11,7 @@ declare const M3eFocusRingElement_base: import("../mixins/Constructor").Construc
  * The focus ring is displayed when the interactive element receives visible focus and hidden when focus is lost.
  * This can be disabled using the `disabled` attribute.
  *
- * Alternately, you can use the `show` and `hide` methods to programmatically control the focus ring.
+ * Alternatively, you can use the `show` and `hide` methods to programmatically control the focus ring.
  *
  * @example
  * The following example illustrates attaching a focus ring to an interactive element. In this example, the parenting div

package/dist/src/core/shared/primitives/RippleElement.d.ts

@@ -12,7 +12,7 @@ declare const M3eRippleElement_base: import("../mixins/Constructor").Constructor
  *
  * The pressed state actives either using both pointer and keyboard events. For keyboard events, `SPACE` activate a ripple.
  *
- * Alternately, you can use the `show` and `hide` methods to programmatically control the ripple.
+ * Alternatively, you can use the `show` and `hide` methods to programmatically control the ripple.
  *
  * @example
  * The following example illustrates attaching a ripple to an interactive element. In this example, the parenting div

package/dist/src/icon/IconElement.d.ts

@@ -1,6 +1,7 @@
 import { CSSResultGroup, LitElement, PropertyValues } from "lit";
 import { IconVariant } from "./IconVariant";
 import { IconGrade } from "./IconGrade";
+import { IconWeight } from "./IconWeight";
 declare const M3eIconElement_base: import("../core/shared/mixins/Constructor").Constructor & typeof LitElement;
 /**
  * A small symbol used to easily identify an action or category.
@@ -37,6 +38,7 @@ declare const M3eIconElement_base: import("../core/shared/mixins/Constructor").C
  * @attr weight - A value from 100 to 700 indicating the weight of the icon.
  */
 export declare class M3eIconElement extends M3eIconElement_base {
+    #private;
     /** The styles of the element. */
     static styles: CSSResultGroup;
     /** @private */ private readonly _icon?;
@@ -61,7 +63,7 @@ export declare class M3eIconElement extends M3eIconElement_base {
      * A value from 100 to 700 indicating the weight of the icon.
      * @default 400
      */
-    weight: number;
+    weight: IconWeight;
     /**
      * A value from 20 to 48 indicating the optical size of the icon.
      * @default 24
@@ -70,6 +72,10 @@ export declare class M3eIconElement extends M3eIconElement_base {
     /** @inheritdoc */
     connectedCallback(): void;
     /** @inheritdoc */
+    disconnectedCallback(): void;
+    /** @inheritdoc */
+    protected willUpdate(_changedProperties: PropertyValues<this>): void;
+    /** @inheritdoc */
     protected updated(_changedProperties: PropertyValues<this>): void;
     /** @inheritdoc */
     protected render(): unknown;

package/dist/src/icon/IconElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconElement.d.ts","sourceRoot":"","sources":["../../../src/icon/IconElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAK5E,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;;AAExC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,qBACa,cAAe,SAAQ,mBAAuB;IACzD,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAsCpC;IAEF,eAAe,CAAiB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAkB;IAEzE,4BAA4B;IAChB,IAAI,EAAE,MAAM,CAAM;IAE9B;;;OAGG;IAC0B,OAAO,EAAE,WAAW,CAAc;IAE/D;;;OAGG;IACyC,MAAM,UAAS;IAE3D;;;OAGG;IACS,KAAK,EAAE,SAAS,CAAY;IAExC;;;OAGG;IACyB,MAAM,SAAO;IAEzC;;;OAGG;IACoD,WAAW,SAAM;IAExE,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAYlC,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAoB1E,kBAAkB;cACC,MAAM,IAAI,OAAO;CAGrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF"}
+{"version":3,"file":"IconElement.d.ts","sourceRoot":"","sources":["../../../src/icon/IconElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAM5E,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;;AAE1C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,qBACa,cAAe,SAAQ,mBAAuB;;IACzD,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CA4CpC;IAEF,eAAe,CAAiB,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAkB;IAGzE,4BAA4B;IAChB,IAAI,EAAE,MAAM,CAAM;IAE9B;;;OAGG;IAC0B,OAAO,EAAE,WAAW,CAAc;IAE/D;;;OAGG;IACyC,MAAM,UAAS;IAE3D;;;OAGG;IACS,KAAK,EAAE,SAAS,CAAY;IAExC;;;OAGG;IACyB,MAAM,EAAE,UAAU,CAAO;IAErD;;;OAGG;IACoD,WAAW,SAAM;IAExE,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAYlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAMrC,kBAAkB;cACC,UAAU,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAY7E,kBAAkB;cACC,OAAO,CAAC,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAoB1E,kBAAkB;cACC,MAAM,IAAI,OAAO;CAKrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF"}

package/dist/src/icon/IconRegistry.d.ts

@@ -0,0 +1,54 @@
+import { SVGTemplateResult } from "lit";
+import { IconVariant } from "./IconVariant";
+/** Encapsulates information used to construct an SVG. */
+export type SvgIconInfo = {
+    /** The viewbox of the SVG. */
+    viewBox: string;
+    /** The path of the SVG. */
+    path: string;
+};
+/** Represents the fill-axis SVG data for a single icon. */
+export type SvgIconFillSet = {
+    /** The unfilled (FILL=0) SVG representation (or path assuming viewBox="0 -960 960 960") of the icon. */
+    outlined: SvgIconInfo | string;
+    /** The filled (FILL=1) SVG representation (or path assuming viewBox="0 -960 960 960") of the icon. */
+    filled: SvgIconInfo | string;
+};
+/**
+ * Service to register and display icons used by the `m3e-icon` component.
+ * @internal
+ */
+export declare class IconRegistry {
+    #private;
+    /**
+     * Adds an icon to the registry for the given variant and weight.
+     * @param {string} name The name of the icon.
+     * @param {IconVariant} variant The variant of the icon.
+     * @param {SvgIconFillSet} fillSet The SVG data for both fill states (outlined and filled) of the icon.
+     */
+    static addIcon(name: string, variant: IconVariant, fillSet: SvgIconFillSet): void;
+    /**
+     * Determines whether an icon is registered for the given variant.
+     * @param {string} name The name of the icon.
+     * @param {IconVariant} variant The variant of the icon.
+     * @returns {boolean} Whether `icon` is registered for the given `variant`.
+     */
+    static isIconRegistered(name: string, variant: IconVariant): boolean;
+    /**
+     * Renders an icon from the registry.
+     * @param {string} name The name of the icon.
+     * @param {IconVariant} variant The variant of the icon.
+     * @param {boolean} filled Whether to render a filled variant of the icon.
+     * @returns {SVGTemplateResult | undefined} A `SVGTemplateResult` used to render the icon.
+     */
+    static renderIcon(name: string, variant: IconVariant, filled: boolean): SVGTemplateResult | undefined;
+    /**
+     * Begins observing registration for the specified icon.
+     * @param {string} name The name of the icon to observe.
+     * @param {IconVariant} variant The variant of the icon to observe.
+     * @param {() => void} callback Callback invoked when the specified icon is registered for the given variant.
+     * @returns {() => void} Function used to stop observing.
+     */
+    static observe(name: string, variant: IconVariant, callback: () => void): () => void;
+}
+//# sourceMappingURL=IconRegistry.d.ts.map

package/dist/src/icon/IconRegistry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconRegistry.d.ts","sourceRoot":"","sources":["../../../src/icon/IconRegistry.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,iBAAiB,EAAE,MAAM,KAAK,CAAC;AAE7C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAK5C,yDAAyD;AACzD,MAAM,MAAM,WAAW,GAAG;IACxB,8BAA8B;IAC9B,OAAO,EAAE,MAAM,CAAC;IAEhB,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,2DAA2D;AAC3D,MAAM,MAAM,cAAc,GAAG;IAC3B,wGAAwG;IACxG,QAAQ,EAAE,WAAW,GAAG,MAAM,CAAC;IAE/B,sGAAsG;IACtG,MAAM,EAAE,WAAW,GAAG,MAAM,CAAC;CAC9B,CAAC;AAEF;;;GAGG;AACH,qBAAa,YAAY;;IAMvB;;;;;OAKG;IACH,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,cAAc,GAAG,IAAI;IA+BjF;;;;;OAKG;IACH,MAAM,CAAC,gBAAgB,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,GAAG,OAAO;IAIpE;;;;;;OAMG;IACH,MAAM,CAAC,UAAU,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,OAAO,GAAG,iBAAiB,GAAG,SAAS;IAKrG;;;;;;OAMG;IACH,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI;CAsCrF"}

package/dist/src/icon/IconWeight.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the weights of an icon. */
+export type IconWeight = 100 | 200 | 300 | 400 | 500 | 600 | 700;
+//# sourceMappingURL=IconWeight.d.ts.map

package/dist/src/icon/IconWeight.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconWeight.d.ts","sourceRoot":"","sources":["../../../src/icon/IconWeight.ts"],"names":[],"mappings":"AAAA,wCAAwC;AACxC,MAAM,MAAM,UAAU,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC"}

package/dist/src/icon/index.d.ts

@@ -1,4 +1,5 @@
 export * from "./IconElement";
 export * from "./IconGrade";
 export * from "./IconVariant";
+export * from "./registerIcon";
 //# sourceMappingURL=index.d.ts.map

package/dist/src/icon/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/icon/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/icon/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC"}

package/dist/src/icon/registerIcon.d.ts

@@ -0,0 +1,14 @@
+import { SvgIconInfo } from "./IconRegistry";
+import { IconVariant } from "./IconVariant";
+export type { SvgIconInfo } from "./IconRegistry";
+/**
+ * Registers an SVG icon to the internal icon registry used by `m3e-icon`.
+ * @param {string} name The name of the icon.
+ * @param {IconVariant} variant The variant of the icon.
+ * @param data The outlined and filled SVG information of the icon.
+ */
+export declare function registerIcon(name: string, variant: IconVariant, data: {
+    outlined: SvgIconInfo;
+    filled: SvgIconInfo;
+}): void;
+//# sourceMappingURL=registerIcon.d.ts.map

package/dist/src/icon/registerIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"registerIcon.d.ts","sourceRoot":"","sources":["../../../src/icon/registerIcon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC3D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD;;;;;GAKG;AACH,wBAAgB,YAAY,CAC1B,IAAI,EAAE,MAAM,EACZ,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE;IAAE,QAAQ,EAAE,WAAW,CAAC;IAAC,MAAM,EAAE,WAAW,CAAA;CAAE,GACnD,IAAI,CAEN"}

package/dist/src/select/SelectElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectElement.d.ts","sourceRoot":"","sources":["../../../src/select/SelectElement.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"SelectElement.d.ts","sourceRoot":"","sources":["../../../src/select/SelectElement.ts"],"names":[],"mappings":"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"}

package/dist/src/skeleton/SkeletonElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonElement.d.ts","sourceRoot":"","sources":["../../../src/skeleton/SkeletonElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAa,MAAM,KAAK,CAAC;AAMvE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;;AAExD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,qBACa,kBAAmB,SAAQ,uBAA+B;;IACrE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAwGpC;IAIF;;;OAGG;IAC0B,KAAK,EAAE,aAAa,CAAU;IAE3D;;;OAGG;IAC0B,SAAS,EAAE,iBAAiB,CAAU;IAEnE;;;OAGG;IACyC,MAAM,UAAS;IAE3D,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAKrC,kBAAkB;IACT,mBAAmB,IAAI,IAAI;IAKpC,kBAAkB;cACC,MAAM,IAAI,OAAO;CAoErC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,kBAAkB,CAAC;KACpC;CACF"}
+{"version":3,"file":"SkeletonElement.d.ts","sourceRoot":"","sources":["../../../src/skeleton/SkeletonElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAa,MAAM,KAAK,CAAC;AAMvE,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;;AAExD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,qBACa,kBAAmB,SAAQ,uBAA+B;;IAoErE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CA+FpC;IAIF;;;OAGG;IAC0B,KAAK,EAAE,aAAa,CAAU;IAE3D;;;OAGG;IAC0B,SAAS,EAAE,iBAAiB,CAAU;IAEnE;;;OAGG;IACyC,MAAM,UAAS;IAE3D,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAKrC,kBAAkB;IACT,mBAAmB,IAAI,IAAI;IAKpC,kBAAkB;cACC,MAAM,IAAI,OAAO;CAoErC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,kBAAkB,CAAC;KACpC;CACF"}

package/dist/stepper.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import { __decorate, __classPrivateFieldGet, __classPrivateFieldSet } from 'tslib';

package/dist/stepper.min.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import{__decorate as e,__classPrivateFieldGet as t,__classPrivateFieldSet as s}from"tslib";import{LitElement as i,html as o,css as r,nothing as l}from"lit";import{state as a,query as n,property as d}from"lit/decorators.js";import{Role as c,customElement as p,Selected as h,KeyboardClick as m,Focusable as v,HtmlFor as f,Disabled as b,AttachInternals as u,DesignToken as g,ActionElementBase as y,ReconnectedCallback as x,addCustomState as w,hasCustomState as $,deleteCustomState as k,setCustomState as _,registerStyleSheet as S}from"@m3e/web/core";import{addAriaReferencedId as E,removeAriaReferencedId as I,selectionManager as z,SelectionManager as C}from"@m3e/web/core/a11y";import{ifDefined as q}from"lit/directives/if-defined.js";import{M3eBreakpointObserver as P,Breakpoint as Z}from"@m3e/web/core/layout";let T=class extends(c(i,"tabpanel")){constructor(){super(...arguments),this.active=!1}connectedCallback(){this.slot="panel",super.connectedCallback()}render(){return o`<m3e-collapsible ?open="${this.active}"><div class="content"><div><slot></slot></div><slot name="actions"></slot></div></m3e-collapsible>`}};var B,W,L,j,A;T.styles=r`:host { display: block; } .content { display: flex; flex-direction: column; padding: var(--m3e-step-panel-padding, 1rem 1.5rem 1.5rem 1.5rem); row-gap: var(--m3e-step-panel-spacing, 0.5rem); } ::slotted([slot="actions"]) { flex: none; display: flex; align-items: center; min-height: var(--m3e-step-panel-actions-height, 3rem); } ::slotted([slot="actions"][end]) { justify-content: flex-end; }`,e([a()],T.prototype,"active",void 0),T=e([p("m3e-step-panel")],T);let H=A=class extends(h(m(v(f(b(u(c(i,"tab")))))))){constructor(){super(...arguments),B.add(this),W.set(this,e=>t(this,B,"m",j).call(this,e)),this.optional=!1,this.editable=!1,this.completed=!1,this.invalid=!1,this.index=-1}get panel(){return this.control instanceof T?this.control:null}get stepper(){return this.closest("m3e-stepper")}reset(){this.invalid=!1,this.completed=!1,this.panel?.querySelector("form")?.reset()}attach(e){e instanceof T&&(e.id=e.id||"m3e-step-panel-"+A.__nextId++,E(this,"aria-controls",e.id),e.style.order=this.style.order),super.attach(e)}detach(){this.control&&(this.control.style.order="",this.control.id&&I(this,"aria-controls",this.control.id)),super.detach()}connectedCallback(){this.slot="step",super.connectedCallback(),this.addEventListener("click",t(this,W,"f"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",t(this,W,"f"))}update(e){super.update(e),e.has("selected")&&this.closest("m3e-stepper")?.[z].notifySelectionChange(this)}firstUpdated(e){super.firstUpdated(e),[this._focusRing,this._stateLayer,this._ripple].forEach(e=>e?.attach(this))}render(){const e=o`<slot name="hint">${this.optional?o`<span class="hint">(Optional)</span>`:l}</slot>`,s=o`<slot name="error">${e}</slot>`;return o`<div class="base"><m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer><m3e-focus-ring class="focus-ring" ?disabled="${this.disabled}"></m3e-focus-ring><m3e-ripple class="ripple" ?disabled="${this.disabled}"></m3e-ripple><div class="wrapper"><div class="icon" aria-hidden="true">${t(this,B,"m",L).call(this)}</div><div class="label"><slot></slot>${this.invalid?s:e}</div></div></div>`}};var M,O,U,D,N,R,V,X,F,K,G,J;W=new WeakMap,B=new WeakSet,L=function(){if(!this.selected){if(this.invalid)return o`<slot name="error-icon"><svg viewBox="0 -960 960 960" fill="currentColor"><path d="m40-120 440-760 440 760H40Zm138-80h604L480-720 178-200Zm302-40q17 0 28.5-11.5T520-280q0-17-11.5-28.5T480-320q-17 0-28.5 11.5T440-280q0 17 11.5 28.5T480-240Zm-40-120h80v-200h-80v200Zm40-100Z"/></svg></slot>`;if(this.completed)return this.editable?o`<slot name="edit-icon"><svg viewBox="0 -960 960 960" fill="currentColor"><path d="M200-200h57l391-391-57-57-391 391v57Zm-80 80v-170l528-527q12-11 26.5-17t30.5-6q16 0 31 6t26 18l55 56q12 11 17.5 26t5.5 30q0 16-5.5 30.5T817-647L290-120H120Zm640-584-56-56 56 56Zm-141 85-28-29 57 57-29-28Z"/></svg></slot>`:o`<slot name="done-icon"><svg viewBox="0 -960 960 960" fill="currentColor"><path d="M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z"/></svg></slot>`}return o`<slot name="icon">${this.index+1}</slot>`},j=function(e){this.disabled&&(e.preventDefault(),e.stopImmediatePropagation()),e.defaultPrevented||this.selected||(this.selected=!0,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))&&this.closest("m3e-stepper")?.moveTo(this.index)?this.dispatchEvent(new Event("change",{bubbles:!0})):this.selected=!1)},H.styles=r`:host { display: block; outline: none; min-width: 0px; position: relative; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { min-width: inherit; position: relative; border-radius: var(--m3e-step-shape, ${g.shape.corner.medium}); padding: var(--m3e-step-padding, 1.5rem); } :host(:not([aria-disabled="true"])) { cursor: pointer; } .icon { flex: none; display: flex; align-items: center; justify-content: center; border-radius: var(--m3e-step-icon-shape, 50%); width: var(--m3e-step-icon-size, 1.5rem); height: var(--m3e-step-icon-size, 1.5rem); } .icon svg, ::slotted([slot="icon"]), ::slotted([slot="edit-icon"]), ::slotted([slot="done-icon"]), ::slotted([slot="error-icon"]) { width: 1em; font-size: var(--m3e-step-icon-size, 1.5rem) !important; } :host(:not([aria-disabled="true"])[selected]) .icon { background-color: var(--m3e-step-selected-icon-container-color, ${g.color.primary}); color: var(--m3e-step-selected-icon-color, ${g.color.onPrimary}); } :host(:not([aria-disabled="true"])[completed]:not([invalid])) .icon { background-color: var(--m3e-step-completed-icon-container-color, ${g.color.primary}); color: var(--m3e-step-completed-icon-color, ${g.color.onPrimary}); } :host(:not([aria-disabled="true"]):not([selected]):not([completed]):not([invalid])) .icon { background-color: var(--m3e-step-unselected-icon-container-color, ${g.color.inverseSurface}); color: var(--m3e-step-unselected-icon-color, ${g.color.inverseOnSurface}); } :host(:not([aria-disabled="true"]):not([selected])[invalid]) .icon { color: var(--m3e-step-icon-error-color, ${g.color.error}); } :host([aria-disabled="true"]) .icon { background-color: color-mix( in srgb, var(--m3e-step-disabled-icon-container-color, ${g.color.onSurface}) 10%, transparent ); color: color-mix(in srgb, var(--m3e-step-disabled-icon-color, ${g.color.onSurface}) 38%, transparent); } :host(:not([aria-disabled="true"])) .label { color: var(--m3e-step-label-color, ${g.color.onSurface}); } :host(:not([aria-disabled="true"]):not([selected])[invalid]) .label { color: var(--m3e-step-label-error-color, ${g.color.error}); } :host([aria-disabled="true"]) .label { color: color-mix(in srgb, var(--m3e-step-disabled-label-color, ${g.color.onSurface}) 38%, transparent); } .wrapper { display: flex; align-items: center; height: 100%; border-radius: inherit; font-size: var(--m3e-step-font-size, ${g.typescale.standard.title.small.fontSize}); font-weight: var(--m3e-step-font-weight, ${g.typescale.standard.title.small.fontWeight}); line-height: var(--m3e-step-line-height, ${g.typescale.standard.title.small.lineHeight}); letter-spacing: var(--m3e-step-tracking, ${g.typescale.standard.title.small.tracking}); flex-direction: var(--_step-direction, row); gap: var(--m3e-step-icon-label-space, 0.5rem); justify-content: flex-start; } .label { display: flex; flex-direction: column; align-items: var(--_step-label-align-items, flex-start); } ::slotted([slot="hint"]), .hint, ::slotted([slot="error"]) { font-size: var(--m3e-step-hint-font-size, ${g.typescale.standard.body.small.fontSize}); font-weight: var(--m3e-step-hint-font-weight, ${g.typescale.standard.body.small.fontWeight}); line-height: var(--m3e-step-hint-line-height, ${g.typescale.standard.body.small.lineHeight}); letter-spacing: var(--m3e-step-hint-tracking, ${g.typescale.standard.body.small.tracking}); } :host(:not([aria-disabled="true"]):not([invalid])) ::slotted([slot="hint"]), :host(:not([aria-disabled="true"]):not([invalid])) .hint { color: var(--m3e-step-hint-color, ${g.color.onSurfaceVariant}); } :host([aria-disabled="true"]) ::slotted([slot="hint"]), :host([aria-disabled="true"]) .hint { color: color-mix(in srgb, var(--m3e-step-disabled-hint-color, ${g.color.onSurface}) 38%, transparent); }`,H.__nextId=0,e([n(".focus-ring")],H.prototype,"_focusRing",void 0),e([n(".state-layer")],H.prototype,"_stateLayer",void 0),e([n(".ripple")],H.prototype,"_ripple",void 0),e([d({type:Boolean,reflect:!0})],H.prototype,"optional",void 0),e([d({type:Boolean,reflect:!0})],H.prototype,"editable",void 0),e([d({type:Boolean,reflect:!0})],H.prototype,"completed",void 0),e([d({type:Boolean,reflect:!0})],H.prototype,"invalid",void 0),e([a()],H.prototype,"index",void 0),H=A=e([p("m3e-step")],H);class Q extends y{constructor(e){super(),M.set(this,void 0),s(this,M,e,"f")}_onClick(){switch(t(this,M,"f")){case"next":this.closest("m3e-stepper")?.moveNext();break;case"previous":this.closest("m3e-stepper")?.movePrevious();break;case"reset":this.closest("m3e-stepper")?.reset()}}}M=new WeakMap;let Y=class extends(x(u(i))){constructor(){super(...arguments),O.add(this),U.set(this,void 0),this._selectedIndex=null,this[J]=(new C).withHomeAndEnd().withWrap().onSelectedItemsChange(()=>t(this,O,"m",X).call(this)),this.headerPosition="above",this.labelPosition="end",this.linear=!1,this.orientation="horizontal"}get steps(){return this[z]?.items??[]}get selectedStep(){return null!==this._selectedIndex?this.steps[this._selectedIndex]??null:null}get selectedIndex(){return this._selectedIndex??-1}movePrevious(){return this.moveTo((this._selectedIndex??1)-1)}moveNext(){return this.moveTo((this._selectedIndex??-1)+1)}moveTo(e){const s=this.selectedStep;if(s&&s.index===e)return!0;if(this.steps[e]?.disabled)return!1;if(e>=0&&e<this.steps.length){if(s){const i=t(this,O,"m",F).call(this);if(this.linear)if(e<s.index){const t=this[z].items[e];if(!t||t.completed&&!t.editable)return!1}else if(e>s.index+1){const t=this[z].items[e];if(!t||!t.completed)return!1}else if(!i&&!s.optional)return!1;s.completed=!0}return this._selectedIndex=e,this[z].select(this.selectedStep),this.dispatchEvent(new Event("change",{bubbles:!0})),!0}return s&&(this[z].deselect(s),this.dispatchEvent(new Event("change",{bubbles:!0}))),!1}reset(){this.steps.forEach(e=>e.reset());const e=this.steps.findIndex(e=>!e.disabled);e!==this._selectedIndex&&(this._selectedIndex=e,this[z].select(this.selectedStep),this.dispatchEvent(new Event("change",{bubbles:!0})))}connectedCallback(){super.connectedCallback(),w(this,"-no-animate")}disconnectedCallback(){super.disconnectedCallback(),this._orientation=void 0,t(this,U,"f")?.call(this)}reconnectedCallback(){super.reconnectedCallback(),"auto"===this.orientation&&t(this,O,"m",K).call(this)}willUpdate(e){super.willUpdate(e),e.has("orientation")&&(t(this,U,"f")?.call(this),"auto"===this.orientation?t(this,O,"m",K).call(this):(this._orientation=void 0,t(this,O,"m",G).call(this))),e.has("_orientation")&&t(this,O,"m",G).call(this)}render(){let e;return this.selectedStep?.panel&&(e=[...this.querySelectorAll("[slot='panel']")].indexOf(this.selectedStep.panel),-1===e&&(e=void 0)),this[z].vertical?o`${t(this,O,"m",D).call(this)}<slot name="panel"></slot>`:o`${"above"===this.headerPosition?t(this,O,"m",D).call(this):l}<m3e-slide class="steps" selected-index="${q(e)}"><slot name="panel"></slot></m3e-slide>${"below"===this.headerPosition?t(this,O,"m",D).call(this):l}`}};U=new WeakMap,O=new WeakSet,J=z,D=function(){return o`<div class="header" role="tablist" aria-orientation="${q(this[z].vertical?"vertical":void 0)}" @change="${t(this,O,"m",N)}"><slot name="step" @slotchange="${t(this,O,"m",R)}" @keydown="${t(this,O,"m",V)}"></slot></div>`},N=function(e){e.stopPropagation()},R=function(){const{added:e,removed:s}=this[z].setItems([...this.querySelectorAll("m3e-step")]);if(e.length>0||s.length>0){this.querySelectorAll(".-m3e-step-divider").forEach(e=>e.remove());for(let e=0;e<this[z].items.length;e++){const t=this[z].items[e];if(t.index=e,e>0){const e=document.createElement("div");e.ariaHidden="true",e.classList.add("-m3e-step-divider"),e.slot="step",t.insertAdjacentElement("beforebegin",e)}}t(this,O,"m",G).call(this),0==this[z].selectedItems.length&&this[z].select(this[z].items.find(e=>!e.disabled))}},V=function(e){this[z].onKeyDown(e)},X=function(){const e=this[z].selectedItems[0];let t=e?this.steps.indexOf(e):null;-1===t&&(t=null),this._selectedIndex=t;for(const e of this[z].items)e.panel&&(e.panel.active=e.index===t);e&&this.matches(":focus-within")&&!e.matches(":focus")&&e.focus(),$(this,"-no-animate")&&requestAnimationFrame(()=>k(this,"-no-animate"))},F=function(){let e=!1;return this.selectedStep&&(e=this.selectedStep.panel?.querySelector("form")?.checkValidity()??!0,this.selectedStep.optional&&(e=!0),this.selectedStep.invalid=!e),e},K=function(){s(this,U,P.observe([Z.XSmall],e=>{this._orientation=e.get(Z.XSmall)?"vertical":"horizontal",t(this,O,"m",G).call(this)}),"f")},G=function(){this[z].vertical="vertical"===(this._orientation??this.orientation),_(this,"-vertical",this[z].vertical),this[z].vertical?this.steps.forEach((e,t)=>{e.style.order=`${t}`,e.panel&&(e.panel.style.order=`${t}`)}):this.steps.forEach(e=>{e.style.order="",e.panel&&(e.panel.style.order="")})},S(r`m3e-stepper:not(:state(-vertical)) > .-m3e-step-divider::before { border-bottom-width: var(--m3e-step-divider-thickness, 1px); border-bottom-style: solid; border-bottom-color: var(--m3e-step-divider-color, ${g.color.outline}); } m3e-stepper:not(:state(-vertical)) > [slot="step"]:not(.-m3e-step-divider):not(:first-of-type)::before, m3e-stepper:not(:state(-vertical)) > [slot="step"]:not(.-m3e-step-divider):not(:last-of-type)::after { border-bottom-width: var(--m3e-step-divider-thickness, 1px); border-bottom-style: solid; border-bottom-color: var(--m3e-step-divider-color, ${g.color.outline}); } m3e-stepper:not(:state(-vertical))[label-position="end"] > .-m3e-step-divider { margin-block: auto; } m3e-stepper:not(:state(-vertical))[label-position="below"] > .-m3e-step-divider::before, m3e-stepper:not(:state(-vertical))[label-position="below"] > [slot="step"]:not(.-m3e-step-divider):not(:first-of-type)::before, m3e-stepper:not(:state(-vertical))[label-position="below"] > [slot="step"]:not(.-m3e-step-divider):not(:last-of-type)::after { margin-block-start: calc(var(--m3e-step-padding, 1.5rem) + calc(var(--m3e-step-icon-size, 1.5rem) / 2)); } m3e-stepper:state(-vertical) > [slot="panel"] { margin-inline-start: calc(var(--m3e-step-padding, 1.5rem) + calc(var(--m3e-step-icon-size, 1.5rem) / 2)); } m3e-stepper:state(-vertical) > [slot="panel"]:not(:last-of-type) { border-inline-start-width: var(--m3e-step-divider-thickness, 1px); border-inline-start-style: solid; border-inline-start-color: var(--m3e-step-divider-color, ${g.color.outline}); } m3e-stepper:state(-vertical) > [slot="step"]:not(.-m3e-step-divider):not(:first-of-type)::before, m3e-stepper:state(-vertical) > [slot="step"]:not(.-m3e-step-divider):not(:last-of-type)::after { margin-inline-start: calc(var(--m3e-step-padding, 1.5rem) + calc(var(--m3e-step-icon-size, 1.5rem) / 2)); border-inline-start-width: var(--m3e-step-divider-thickness, 1px); border-inline-start-style: solid; border-inline-start-color: var(--m3e-step-divider-color, ${g.color.outline}); }`),Y.styles=r`:host { display: flex; flex-direction: column; position: relative; } :host(:not(:state(-vertical))) .header { display: flex; align-items: flex-start; flex-wrap: nowrap; } :host(:not(:state(-vertical))) ::slotted(.-m3e-step-divider) { flex: 1 1 auto; position: relative; min-width: 2rem; } :host(:not(:state(-vertical))) ::slotted(.-m3e-step-divider)::before { content: ""; position: absolute; left: 0; right: 0; } :host(:not(:state(-vertical)):not([label-position="below"])) ::slotted(.-m3e-step-divider)::before { top: 50%; } :host(:not(:state(-vertical))) ::slotted([slot="step"]) { align-self: stretch; } :host(:not(:state(-vertical))) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:first-of-type))::before, :host(:not(:state(-vertical))) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:last-of-type))::after { content: ""; display: block; position: absolute; top: 0; } :host(:not(:state(-vertical))[label-position="end"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:first-of-type))::before, :host(:not(:state(-vertical))[label-position="end"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:last-of-type))::after { top: 50%; } :host(:not(:dir(rtl)):not(:state(-vertical))[label-position="end"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:first-of-type))::before { left: 0; right: calc(100% - var(--m3e-step-padding, 1.5rem) + var(--m3e-step-divider-inset, 0.5rem)); } :host(:dir(rtl):not(:state(-vertical))[label-position="end"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:first-of-type))::before { right: 0; left: calc(100% - var(--m3e-step-padding, 1.5rem) + var(--m3e-step-divider-inset, 0.5rem)); } :host(:not(:dir(rtl)):not(:state(-vertical))[label-position="end"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:last-of-type))::after { left: calc(100% - var(--m3e-step-padding, 1.5rem) + var(--m3e-step-divider-inset, 0.5rem)); right: 0; } :host(:dir(rtl):not(:state(-vertical))[label-position="end"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:last-of-type))::after { right: calc(100% - var(--m3e-step-padding, 1.5rem) + var(--m3e-step-divider-inset, 0.5rem)); left: 0; } :host(:not(:dir(rtl)):not(:state(-vertical))[label-position="below"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:first-of-type))::before { left: 0; right: calc(50% + calc(var(--m3e-step-icon-size, 1.5rem) / 2) + var(--m3e-step-divider-inset, 0.5rem)); } :host(:dir(rtl):not(:state(-vertical))[label-position="below"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:first-of-type))::before { right: 0; left: calc(50% + calc(var(--m3e-step-icon-size, 1.5rem) / 2) + var(--m3e-step-divider-inset, 0.5rem)); } :host(:not(:dir(rtl)):not(:state(-vertical))[label-position="below"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:last-of-type))::after { left: calc(50% + calc(var(--m3e-step-icon-size, 1.5rem) / 2) + var(--m3e-step-divider-inset, 0.5rem)); right: 0; } :host(:dir(rtl):not(:state(-vertical))[label-position="below"]) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:last-of-type))::after { right: calc(50% + calc(var(--m3e-step-icon-size, 1.5rem) / 2) + var(--m3e-step-divider-inset, 0.5rem)); left: 0; } :host(:not(:state(-vertical))[label-position="below"]) { --_step-direction: column; --_step-label-align-items: center; } :host(:state(-vertical)) .header { display: contents; } :host(:state(-vertical)) ::slotted([slot="step"]:not(.-m3e-step-divider)) { flex: none; } :host(:state(-vertical)) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:first-of-type))::before, :host(:state(-vertical)) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:last-of-type))::after { content: ""; display: block; position: absolute; left: 0; } :host(:state(-vertical)) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:first-of-type))::before { top: 0; bottom: calc(100% - var(--m3e-step-padding, 1.5rem) + var(--m3e-step-divider-inset, 0.5rem)); } :host(:state(-vertical)) ::slotted([slot="step"]:not(.-m3e-step-divider):not(:last-of-type))::after { top: calc(100% - var(--m3e-step-padding, 1.5rem) + var(--m3e-step-divider-inset, 0.5rem)); bottom: 0; } :host(:not(:state(-vertical))) { --m3e-collapsible-animation-duration: 0ms; } :host(:state(-no-animate)) { --m3e-collapsible-animation-duration: 0ms; }`,e([a()],Y.prototype,"_orientation",void 0),e([a()],Y.prototype,"_selectedIndex",void 0),e([d({attribute:"header-position",reflect:!0})],Y.prototype,"headerPosition",void 0),e([d({attribute:"label-position",reflect:!0})],Y.prototype,"labelPosition",void 0),e([d({type:Boolean,reflect:!0})],Y.prototype,"linear",void 0),e([d({reflect:!0})],Y.prototype,"orientation",void 0),Y=e([p("m3e-stepper")],Y);let ee=class extends Q{constructor(){super("next")}};ee=e([p("m3e-stepper-next")],ee);let te=class extends Q{constructor(){super("previous")}};te=e([p("m3e-stepper-previous")],te);let se=class extends Q{constructor(){super("reset")}};se=e([p("m3e-stepper-reset")],se);export{H as M3eStepElement,T as M3eStepPanelElement,Y as M3eStepperElement,ee as M3eStepperNextElement,te as M3eStepperPreviousElement,se as M3eStepperResetElement,Q as StepperButtonElementBase};

package/dist/switch.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import { __classPrivateFieldGet, __decorate } from 'tslib';

package/dist/switch.min.js

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * Copyright (c) 2025 matraic
+ * Copyright (c) 2025–2026 matraic
  * See LICENSE file in the project root for full license text.
  */
 import{__classPrivateFieldGet as e,__decorate as t}from"tslib";import{unsafeCSS as o,css as r,LitElement as c,html as a}from"lit";import{query as s,property as n}from"lit/decorators.js";import{DesignToken as i,Labelled as d,Dirty as l,Touched as h,ConstraintValidation as u,Checked as k,FormAssociated as p,KeyboardClick as b,Focusable as $,Disabled as m,AttachInternals as f,Role as v,HoverController as w,PressedController as g,formValue as y,customElement as x}from"@m3e/web/core";const C=o(`var(--m3e-switch-selected-icon-color, ${i.color.onPrimaryContainer})`),E=o("var(--m3e-switch-selected-icon-size, 1rem)"),_=o(`var(--m3e-switch-unselected-icon-color, ${i.color.surfaceContainerHighest})`),L=o("var(--m3e-switch-unselected-icon-size, 1rem)"),S=o("var(--m3e-switch-track-height, 2rem)"),H=o("var(--m3e-switch-track-width, 3.25rem)"),T=o(`var(--m3e-switch-track-outline-color, ${i.color.outline})`),X=o("var(--m3e-switch-track-outline-width, 2px)"),z=o(`var(--m3e-switch-track-shape, ${i.shape.corner.full})`),P=o(`var(--m3e-switch-selected-track-color, ${i.color.primary})`),B=o(`var(--m3e-switch-unselected-track-color, ${i.color.surfaceContainerHighest})`),G=o("var(--m3e-switch-unselected-handle-height, 1rem)"),M=o("var(--m3e-switch-unselected-handle-width, 1rem)"),W=o("var(--m3e-switch-with-icon-handle-height, 1.5rem)"),j=o("var(--m3e-switch-with-icon-handle-width, 1.5rem)"),V=o("var(--m3e-switch-selected-handle-height, 1.5rem)"),R=o("var(--m3e-switch-selected-handle-width, 1.5rem)"),U=o("var(--m3e-switch-pressed-handle-height, 1.75rem)"),D=o("var(--m3e-switch-pressed-handle-width, 1.75rem)"),K=o(`var(--m3e-switch-handle-shape, ${i.shape.corner.full})`),Z=o(`var(--m3e-switch-selected-handle-color, ${i.color.onPrimary})`),q=o(`var(--m3e-switch-unselected-handle-color, ${i.color.outline})`),A=o("var(--m3e-switch-state-layer-size, 2.5rem)"),F=o(`var(--m3e-switch-state-layer-shape, ${i.shape.corner.full})`),I=o(`var(--m3e-switch-disabled-selected-icon-color, ${i.color.onSurface})`),J=o("var(--m3e-switch-disabled-selected-icon-opacity, 38%)"),N=o(`var(--m3e-switch-disabled-unselected-icon-color, ${i.color.surfaceContainerHighest})`),O=o("var(--m3e-switch-disabled-unselected-icon-opacity, 38%)"),Q=o("var(--m3e-switch-disabled-track-opacity, 12%)"),Y=o(`var(--m3e-switch-disabled-selected-track-color, ${i.color.onSurface})`),ee=o(`var(--m3e-switch-disabled-unselected-track-color, ${i.color.surfaceContainerHighest})`),te=o(`var(--m3e-switch-disabled-unselected-track-outline-color, ${i.color.onSurface})`),oe=o("var(--m3e-switch-disabled-unselected-handle-opacity, 38%)"),re=o("var(--m3e-switch-disabled-selected-handle-opacity, 100%)"),ce=o(`var(--m3e-switch-disabled-selected-handle-color, ${i.color.surface})`),ae=o(`var(--m3e-switch-disabled-unselected-handle-color, ${i.color.onSurface})`),se=o(`var(--m3e-switch-selected-hover-icon-color, ${i.color.onPrimaryContainer})`),ne=o(`var(--m3e-switch-unselected-hover-icon-color, ${i.color.surfaceContainerHighest})`),ie=o(`var(--m3e-switch-selected-hover-track-color, ${i.color.primary})`),de=o(`var(--m3e-switch-selected-hover-state-layer-color, ${i.color.primary})`),le=o("var(--m3e-switch-selected-hover-state-layer-opacity, 8%)"),he=o(`var(--m3e-switch-unselected-hover-track-color, ${i.color.surfaceContainerHighest})`),ue=o(`var(--m3e-switch-unselected-hover-track-outline-color, ${i.color.outline})`),ke=o(`var(--m3e-switch-unselected-hover-state-layer-color, ${i.color.onSurface})`),pe=o("var(--m3e-switch-unselected-hover-state-layer-opacity, 8%)"),be=o(`var(--m3e-switch-selected-hover-handle-color, ${i.color.surfaceContainerHighest})`),$e=o(`var(--m3e-switch-unselected-hover-handle-color, ${i.color.onSurfaceVariant})`),me=o(`var(--m3e-switch-selected-focus-icon-color, ${i.color.onPrimaryContainer})`),fe=o(`var(--m3e-switch-unselected-focus-icon-color, ${i.color.surfaceContainerHighest})`),ve=o(`var(--m3e-switch-selected-focus-track-color, ${i.color.primary})`),we=o(`var(--m3e-switch-selected-focus-state-layer-color, ${i.color.primary})`),ge=o("var(--m3e-switch-selected-focus-state-layer-opacity, 10%)"),ye=o(`var(--m3e-switch-unselected-focus-track-color, ${i.color.surfaceContainerHighest})`),xe=o(`var(--m3e-switch-unselected-focus-track-outline-color, ${i.color.outline})`),Ce=o(`var(--m3e-switch-unselected-focus-state-layer-color, ${i.color.onSurface})`),Ee=o("var(--m3e-switch-unselected-focus-state-layer-opacity, 10%)"),_e=o(`var(--m3e-switch-selected-focus-handle-color, ${i.color.primaryContainer})`),Le=o(`var(--m3e-switch-unselected-focus-handle-color, ${i.color.onSurfaceVariant})`),Se=o(`var(--m3e-switch-selected-pressed-icon-color, ${i.color.onPrimaryContainer})`),He=o(`var(--m3e-switch-unselected-pressed-icon-color, ${i.color.surfaceContainerHighest})`),Te=o(`var(--m3e-switch-selected-pressed-track-color, ${i.color.primary})`),Xe=(o(`var(--m3e-switch-selected-pressed-state-layer-color, ${i.color.primary})`),o("var(--m3e-switch-selected-pressed-state-layer-opacity, 10%)"),o(`var(--m3e-switch-unselected-pressed-track-color, ${i.color.surfaceContainerHighest})`)),ze=o(`var(--m3e-switch-unselected-pressed-track-outline-color, ${i.color.outline})`),Pe=(o(`var(--m3e-switch-unselected-pressed-state-layer-color, ${i.color.onSurface})`),o("var(--m3e-switch-unselected-pressed-state-layer-opacity, 10%)"),o(`var(--m3e-switch-selected-pressed-handle-color, ${i.color.primaryContainer})`)),Be=o(`var(--m3e-switch-unselected-pressed-handle-color, ${i.color.onSurfaceVariant})`),Ge=r`.handle { position: relative; display: flex; align-items: center; justify-content: center; pointer-events: none; transform-origin: center center; border-radius: ${K}; transition: ${o(`background-color ${i.motion.duration.short4} ${i.motion.easing.standard},\n      transform var(--_switch-handle-effect),\n      width ${i.motion.spring.fastEffects},\n      height ${i.motion.spring.fastEffects}`)}; } .track:not(.pressed) .handle { --_switch-handle-effect: ${i.motion.spring.fastSpatial}; } .track.pressed .handle { --_switch-handle-effect: ${i.motion.spring.fastEffects}; } :host(:not([aria-disabled="true"]):not([checked])[icons="both"]) .track:not(.pressed) .handle { width: ${j}; height: ${W}; } :host(:not([checked]):not([icons="both"])) .track:not(.pressed) .handle, :host([aria-disabled="true"]:not([checked])) .handle { width: ${M}; height: ${G}; } :host([checked]) .track:not(.pressed) .handle { width: ${R}; height: ${V}; } .track.pressed .handle { width: ${D}; height: ${U}; } :host(:not([aria-disabled="true"]):not([checked]):not(:focus):not(:hover)) .track:not(.pressed) .handle { background-color: ${q}; } :host(:not([aria-disabled="true"]):not([checked]):not(:focus):hover) .track:not(.pressed) .handle { background-color: ${$e}; } :host(:not([aria-disabled="true"]):not([checked]):focus) .track:not(.pressed) .handle { background-color: ${Le}; } :host(:not([aria-disabled="true"]):not([checked])) .track.pressed .handle { background-color: ${Be}; } :host(:not([aria-disabled="true"])[checked]:not(:focus):not(:hover)) .track:not(.pressed) .handle { background-color: ${Z}; } :host(:not([aria-disabled="true"])[checked]:not(:focus):hover) .track:not(.pressed) .handle { background-color: ${be}; } :host(:not([aria-disabled="true"])[checked]:focus) .track:not(.pressed) .handle { background-color: ${_e}; } :host(:not([aria-disabled="true"])[checked]) .track.pressed .handle { background-color: ${Pe}; } :host([aria-disabled="true"]:not([checked])) .handle { background-color: color-mix( in srgb, ${ae} ${oe}, transparent ); } :host([aria-disabled="true"][checked]) .handle { background-color: color-mix( in srgb, ${ce} ${re}, transparent ); } :host(:not(:dir(rtl))[checked]) .track:not(.pressed) .handle { transform: translateX( calc(${H} - ${R} - calc(${X} * 2)) ); } :host(:dir(rtl)[checked]) .track:not(.pressed) .handle { transform: translateX( calc( 0px - calc( ${H} - ${R} - calc(${X} * 2) ) ) ); } :host(:not(:dir(rtl))[checked]) .track.pressed .handle { transform: translateX( calc(${H} - ${D} - ${X}) ); } :host(:dir(rtl)[checked]) .track.pressed .handle { transform: translateX( calc(0px - calc(${H} - ${D} - ${X})) ); } :host(:not(:dir(rtl)):not([checked]):not([icons="both"])) .track:not(.pressed) .handle, :host(:not(:dir(rtl))[aria-disabled="true"]:not([checked])) .handle { transform: translateX( calc( ${X} + calc(${D} - ${j}) ) ); } :host(:dir(rtl):not([checked]):not([icons="both"])) .track:not(.pressed) .handle, :host(:dir(rtl)[aria-disabled="true"]:not([checked])) .handle { transform: translateX( calc( 0px - calc( ${X} + calc(${D} - ${j}) ) ) ); } :host(:not(:dir(rtl)):not([aria-disabled="true"]):not([checked])[icons="both"]) .track:not(.pressed) .handle { transform: translateX(${X}); } :host(:dir(rtl):not([aria-disabled="true"]):not([checked])[icons="both"]) .track:not(.pressed) .handle { transform: translateX(calc(0px - ${X})); } @media (forced-colors: active) { .handle { transition: ${o(`transform var(--_switch-handle-effect),\n      width ${i.motion.spring.fastEffects},\n      height ${i.motion.spring.fastEffects}`)}; } :host(:not([aria-disabled="true"]):not([checked]):not(:focus):not(:hover)) .track:not(.pressed) .handle, :host(:not([aria-disabled="true"]):not([checked]):not(:focus):hover) .track:not(.pressed) .handle, :host(:not([aria-disabled="true"]):not([checked]):focus) .track:not(.pressed) .handle, :host(:not([aria-disabled="true"]):not([checked])) .track.pressed .handle { background-color: ButtonText; } :host([aria-disabled="true"]:not([checked])) .handle { background-color: GrayText; } :host(:not([aria-disabled="true"])[checked]:not(:focus):not(:hover)) .track:not(.pressed) .handle, :host(:not([aria-disabled="true"])[checked]:not(:focus):hover) .track:not(.pressed) .handle, :host(:not([aria-disabled="true"])[checked]:focus) .track:not(.pressed) .handle, :host(:not([aria-disabled="true"])[checked]) .track.pressed .handle { background-color: Canvas; } :host([aria-disabled="true"][checked]) .handle { background-color: Canvas; } } @media (prefers-reduced-motion) { .handle { transition: none; } }`,Me=r`:host([icons="none"]) .icon, :host([icons="selected"]:not([checked])) .icon, :host([aria-disabled="true"]:not([checked])) .icon { display: none; } .icon { width: 1em; transition: ${o(`color ${i.motion.duration.short4} ${i.motion.easing.standard}`)}; } :host(:not([checked])) .icon { font-size: ${L}; } :host([checked]) .icon { font-size: ${E}; } :host(:not([aria-disabled="true"]):not([checked]):not(:focus):not(:hover)) .track:not(.pressed) .icon { color: ${_}; } :host(:not([aria-disabled="true"]):not([checked]):not(:focus):hover) .track:not(.pressed) .icon { color: ${ne}; } :host(:not([aria-disabled="true"]):not([checked]):focus) .track:not(.pressed) .icon { color: ${fe}; } :host(:not([aria-disabled="true"]):not([checked])) .track.pressed .icon { color: ${He}; } :host(:not([aria-disabled="true"])[checked]:not(:focus):not(:hover)) .track:not(.pressed) .icon { color: ${C}; } :host(:not([aria-disabled="true"])[checked]:not(:focus):hover) .track:not(.pressed) .icon { color: ${se}; } :host(:not([aria-disabled="true"])[checked]:focus) .track:not(.pressed) .icon { color: ${me}; } :host(:not([aria-disabled="true"])[checked]) .track.pressed .icon { color: ${Se}; } :host([aria-disabled="true"]:not([checked])) .icon { color: color-mix( in srgb, ${N} ${O}, transparent ); } :host([aria-disabled="true"][checked]) .icon { color: color-mix( in srgb, ${I} ${J}, transparent ); } @media (forced-colors: active) { :host(:not([aria-disabled="true"]):not([checked]):not(:focus):not(:hover)) .track:not(.pressed) .icon, :host(:not([aria-disabled="true"]):not([checked]):not(:focus):hover) .track:not(.pressed) .icon, :host(:not([aria-disabled="true"]):not([checked]):focus) .track:not(.pressed) .icon, :host(:not([aria-disabled="true"]):not([checked])) .track.pressed .icon { color: Canvas; } :host(:not([aria-disabled="true"])[checked]:not(:focus):not(:hover)) .track:not(.pressed) .icon, :host(:not([aria-disabled="true"])[checked]:not(:focus):hover) .track:not(.pressed) .icon, :host(:not([aria-disabled="true"])[checked]:focus) .track:not(.pressed) .icon, :host(:not([aria-disabled="true"])[checked]) .track.pressed .icon { color: CanvasText; } :host([aria-disabled="true"]:not([checked])) .icon { color: Canvas; } :host([aria-disabled="true"][checked]) .icon { color: GrayText; } } @media (prefers-reduced-motion) { .icon { transition: none; } }`,We=r`.state-layer { width: ${A}; height: ${A}; border-radius: ${F}; transition: ${o(`top ${i.motion.spring.fastEffects},\n          left ${i.motion.spring.fastEffects},\n          right ${i.motion.spring.fastEffects}`)}; } :host(:not([checked])[icons="both"]) .track:not(.pressed) .state-layer { inset-inline-start: calc(0px - calc(calc(${A} - ${j}) / 2)); top: calc(0px - calc(calc(${A} - ${W}) / 2)); } :host(:not([checked]):not([icons="both"])) .track:not(.pressed) .state-layer { inset-inline-start: calc( 0px - calc(calc(${A} - ${M}) / 2) ); top: calc(0px - calc(calc(${A} - ${G}) / 2)); } :host([checked]) .track:not(.pressed) .state-layer { inset-inline-start: calc(0px - calc(calc(${A} - ${R}) / 2)); top: calc(0px - calc(calc(${A} - ${V}) / 2)); } .track.pressed .state-layer { inset-inline-start: calc(0px - calc(calc(${A} - ${D}) / 2)); top: calc(0px - calc(calc(${A} - ${D}) / 2)); } :host(:not([checked])) .state-layer { --m3e-state-layer-hover-color: ${ke}; --m3e-state-layer-hover-opacity: ${pe}; --m3e-state-layer-focus-color: ${Ce}; --m3e-state-layer-focus-opacity: ${Ee}; } :host([checked]) .state-layer { --m3e-state-layer-hover-color: ${de}; --m3e-state-layer-hover-opacity: ${le}; --m3e-state-layer-focus-color: ${we}; --m3e-state-layer-focus-opacity: ${ge}; }`,je=r`:host { display: inline-block; position: relative; outline: none; height: fit-content; width: fit-content; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } :host(:not([aria-disabled="true"])) { cursor: pointer; } .focus-ring { border-radius: ${z}; } .touch { position: absolute; height: 3rem; left: 0; right: 0; } .base { display: flex; align-items: center; justify-content: center; }`,Ve=r`.track { display: flex; align-items: center; position: relative; box-sizing: border-box; border-radius: ${z}; width: ${H}; height: ${S}; transition: ${o(`background-color ${i.motion.duration.short4} ${i.motion.easing.standard}`)}; } :host(:not([checked])) .track { border-width: ${X}; border-style: solid; } :host(:not([aria-disabled="true"]):not([checked]):not(:focus):not(:hover)) .track:not(.pressed) { border-color: ${T}; background-color: ${B}; } :host(:not([aria-disabled="true"]):not([checked]):not(:focus):hover) .track:not(.pressed) { border-color: ${ue}; background-color: ${he}; } :host(:not([aria-disabled="true"]):not([checked]):focus) .track:not(.pressed) { border-color: ${xe}; background-color: ${ye}; } :host(:not([aria-disabled="true"]):not([checked])) .track.pressed { border-color: ${ze}; background-color: ${Xe}; } :host([aria-disabled="true"]:not([checked])) .track { border-color: color-mix( in srgb, ${te} ${Q}, transparent ); background-color: color-mix( in srgb, ${ee} ${Q}, transparent ); } :host(:not([aria-disabled="true"])[checked]:not(:focus):not(:hover)) .track:not(.pressed) { background-color: ${P}; } :host(:not([aria-disabled="true"])[checked]:not(:focus):hover) .track:not(.pressed) { background-color: ${ie}; } :host(:not([aria-disabled="true"])[checked]:focus) .track:not(.pressed) { background-color: ${ve}; } :host(:not([aria-disabled="true"])[checked]) .track.pressed { background-color: ${Te}; } :host([aria-disabled="true"][checked]) .track { background-color: color-mix( in srgb, ${Y} ${Q}, transparent ); } @media (forced-colors: active) { .track { transition: none; } :host(:not([aria-disabled="true"]):not([checked]):not(:focus):not(:hover)) .track:not(.pressed), :host(:not([aria-disabled="true"]):not([checked]):not(:focus):hover) .track:not(.pressed), :host(:not([aria-disabled="true"]):not([checked]):focus) .track:not(.pressed), :host(:not([aria-disabled="true"]):not([checked])) .track.pressed { border-color: ButtonText; background-color: Canvas; } :host([aria-disabled="true"]:not([checked])) .track { border-color: GrayText; background-color: Canvas; } :host(:not([aria-disabled="true"])[checked]:not(:focus):not(:hover)) .track:not(.pressed), :host(:not([aria-disabled="true"])[checked]:not(:focus):hover) .track:not(.pressed), :host(:not([aria-disabled="true"])[checked]:focus) .track:not(.pressed), :host(:not([aria-disabled="true"])[checked]) .track.pressed { background-color: ButtonText; } :host([aria-disabled="true"][checked]) .track { background-color: GrayText; } } @media (prefers-reduced-motion) { .track { transition: none; } }`;var Re,Ue,De,Ke,Ze,qe;let Ae=class extends(d(l(h(u(k(p(b($(m(f(v(c,"switch")))))))))))){constructor(){super(),Re.add(this),Ue.set(this,t=>e(this,Re,"m",qe).call(this,t)),De.set(this,new w(this,{target:null,callback:e=>{this.disabled||(e?this._stateLayer?.show("hover"):this._stateLayer?.hide("hover"))}})),Ke.set(this,new g(this,{target:null,callback:e=>this._track?.classList.toggle("pressed",e&&!this.disabled)})),this.icons="none",this.value="on",new g(this,{isPressedKey:e=>" "===e,callback:e=>this._track?.classList.toggle("pressed",e&&!this.disabled)})}get[(Ue=new WeakMap,De=new WeakMap,Ke=new WeakMap,Re=new WeakSet,y)](){return this.checked&&!this.disabled?this.value:null}connectedCallback(){super.connectedCallback(),this.addEventListener("click",e(this,Ue,"f"));for(const t of this.labels)e(this,De,"f").observe(t),e(this,Ke,"f").observe(t)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",e(this,Ue,"f"));for(const t of this.labels)e(this,De,"f").unobserve(t),e(this,Ke,"f").unobserve(t)}firstUpdated(e){super.firstUpdated(e),[this._focusRing,this._stateLayer].forEach(e=>e?.attach(this))}render(){return a`<m3e-focus-ring class="focus-ring"></m3e-focus-ring><div class="track" aria-hidden="true"><div class="touch" aria-hidden="true"></div><div class="handle"><m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer><div class="base">${e(this,Re,"m",Ze).call(this)}</div></div></div>`}};Ze=function(){return this.checked?a`<svg class="icon" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M19.69,5.23L8.96,15.96l-4.23-4.23L2.96,13.5l6,6L21.46,7L19.69,5.23z"></path></svg>`:a`<svg class="icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z"/></svg>`},qe=function(e){e.defaultPrevented||(this.checked=!this.checked,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))?this.dispatchEvent(new Event("change",{bubbles:!0})):this.checked=!this.checked,this.closest("label")&&e.preventDefault())},Ae.styles=[je,We,Ve,Ge,Me],t([s(".track")],Ae.prototype,"_track",void 0),t([s(".focus-ring")],Ae.prototype,"_focusRing",void 0),t([s(".state-layer")],Ae.prototype,"_stateLayer",void 0),t([n({reflect:!0})],Ae.prototype,"icons",void 0),t([n()],Ae.prototype,"value",void 0),Ae=t([x("m3e-switch")],Ae);export{Ae as M3eSwitchElement};