@m3e/web 2.3.1 → 2.3.2

package/dist/datepicker.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/datepicker.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 a}from"tslib";import{LitElement as i,nothing as o,html as r,unsafeCSS as n,css as s}from"lit";import{state as l,query as d,property as c}from"lit/decorators.js";import{ifDefined as h}from"lit/directives/if-defined.js";import{SuppressInitialAnimation as p,ReconnectedCallback as m,AttachInternals as u,Role as v,ScrollLockController as g,InertController as b,deleteCustomState as f,addCustomState as k,setCustomState as y,DesignToken as $,dateConverter as w,customElement as x,HtmlFor as E,ActionElementBase as S}from"@m3e/web/core";import{positionAnchor as _}from"@m3e/web/core/anchoring";import{M3eDirectionality as L}from"@m3e/web/core/bidi";import{M3eBreakpointObserver as M,Breakpoint as C}from"@m3e/web/core/layout";import"@m3e/web/core/a11y";import"@m3e/web/button";import"@m3e/web/calendar";var D,V,W,Y,P,O,z,A,H,I,U,K,N,T,j,X,q,B,F,G,J,Q,R;let Z=R=class extends(p(m(u(v(i,"dialog"))))){constructor(){super(...arguments),D.add(this),V.set(this,void 0),W.set(this,void 0),Y.set(this,void 0),P.set(this,void 0),O.set(this,new g(this)),z.set(this,new b(this)),A.set(this,e=>t(this,D,"m",K).call(this,e)),H.set(this,e=>t(this,D,"m",q).call(this,e)),I.set(this,a=>{"closed"===a.newState&&(t(this,D,"m",Q).call(this),t(this,P,"f")?.call(this),e(this,P,void 0,"f"))}),this.variant="docked",this.startView="month",this.date=null,this.startAt=null,this.minDate=null,this.maxDate=null,this.rangeStart=null,this.rangeEnd=null,this.blackoutDates=null,this.specialDates=null,this.previousMonthLabel="Previous month",this.previousYearLabel="Previous year",this.previousMultiYearLabel="Previous 24 years",this.nextMonthLabel="Next month",this.nextYearLabel="Next year",this.nextMultiYearLabel="Next 24 years",this.clearable=!1,this.clearLabel="Clear",this.confirmLabel="OK",this.dismissLabel="Cancel",this.label="Select date"}get isOpen(){return void 0!==t(this,W,"f")}get currentVariant(){return this._variant??("modal"!==this.variant?"docked":"modal")}connectedCallback(){super.connectedCallback(),this.setAttribute("popover","manual"),this.addEventListener("toggle",t(this,I,"f")),document.addEventListener("click",t(this,A,"f")),document.addEventListener("keydown",t(this,H,"f"))}disconnectedCallback(){super.disconnectedCallback(),this._variant=void 0,t(this,V,"f")?.call(this),t(this,D,"m",J).call(this),f(this,"-docked"),f(this,"-modal"),this.removeEventListener("toggle",t(this,I,"f")),document.removeEventListener("click",t(this,A,"f")),document.removeEventListener("keydown",t(this,H,"f"))}reconnectedCallback(){super.reconnectedCallback(),"auto"===this.variant&&t(this,D,"m",B).call(this)}async show(a,i){t(this,W,"f")&&t(this,W,"f")!==a&&this.hide(),"modal"===this.currentVariant&&(t(this,O,"f").lock(),t(this,z,"f").lock());const o=this._calendar;o.date=this.date,o.rangeStart=this.rangeStart,o.rangeEnd=this.rangeEnd,o.requestUpdate("startView"),o.isUpdatePending&&await o.updateComplete,e(this,W,a,"f"),t(this,W,"f").ariaExpanded="true",e(this,Y,i,"f"),await t(this,D,"m",G).call(this),this.showPopover(),await this._calendar.focusActiveCell()}hide(a=!1){"modal"===this.currentVariant&&(t(this,O,"f").unlock(),t(this,z,"f").unlock()),this.hidePopover(),t(this,W,"f")&&(t(this,W,"f").ariaExpanded="false",a&&t(this,W,"f").focus(),e(this,W,void 0,"f"))}async toggle(e,a){t(this,W,"f")?this.hide():await this.show(e,a)}render(){return r`<m3e-focus-trap>${t(this,D,"m",U).call(this)}<m3e-calendar class="calendar" start-view="${this.startView}" start-at="${h(this.startAt?.toISOString())}" min-date="${h(this.minDate?.toISOString())}" max-date="${h(this.maxDate?.toISOString())}" @change="${t(this,D,"m",N)}"></m3e-calendar><div class="actions">${this.clearable?r`<m3e-button @click="${t(this,D,"m",T)}">${this.clearLabel}</m3e-button>`:o}<div class="spacer" aria-hidden="true"></div><m3e-button @click="${t(this,D,"m",j)}">${this.dismissLabel}</m3e-button><m3e-button @click="${t(this,D,"m",X)}">${this.confirmLabel}</m3e-button></div></m3e-focus-trap>`}willUpdate(e){super.willUpdate(e),["date","rangeStart","rangeEnd"].some(t=>e.has(t))&&t(this,D,"m",Q).call(this),e.has("variant")&&(t(this,V,"f")?.call(this),"auto"===this.variant?t(this,D,"m",B).call(this):(this._variant=void 0,t(this,D,"m",F).call(this)))}updated(t){super.updated(t),(t.has("specialDates")||t.has("blackoutDates"))&&(this._calendar.specialDates=this.specialDates,this._calendar.blackoutDates=this.blackoutDates)}};V=new WeakMap,W=new WeakMap,Y=new WeakMap,P=new WeakMap,O=new WeakMap,z=new WeakMap,A=new WeakMap,H=new WeakMap,I=new WeakMap,D=new WeakSet,U=function(){if("docked"===this.currentVariant)return o;const t=this._date??this.date;return r`<div class="supporting-text">${this.label}</div><div class="headline">${t?new Intl.DateTimeFormat(navigator.language,{weekday:"short",month:"short",day:"numeric"}).format(t):"––"}</div><div class="divider"></div>`},K=function(e){e.composedPath().some(e=>e instanceof R||e===t(this,W,"f")||e===t(this,Y,"f"))||this.hide()},N=function(){this._date=this._calendar.date,this._rangeStart=this._calendar.rangeStart,this._rangeEnd=this._calendar.rangeEnd},T=function(){this.date=null,this.rangeStart=null,this.rangeEnd=null,this.hide(!0),this.dispatchEvent(new Event("change",{bubbles:!0}))},j=function(){this.hide(!0)},X=function(){this.date=this._date??this.date,this.rangeStart=void 0===this._rangeStart?this.rangeStart:this._rangeStart,this.rangeEnd=void 0===this._rangeEnd?this.rangeEnd:this._rangeEnd,this.hide(!0),this.dispatchEvent(new Event("change",{bubbles:!0}))},q=function(t){!this.isOpen||"modal"!==this.currentVariant||"Escape"!==t.key||t.shiftKey||t.ctrlKey||(t.preventDefault(),this.hide(!0))},B=function(){e(this,V,M.observe([C.XSmall,C.Small],e=>{this._variant=e.get(C.XSmall)||e.get(C.Small)?"modal":"docked",t(this,D,"m",F).call(this)}),"f")},F=function(){switch(this.currentVariant){case"docked":this.ariaModal=null,f(this,"-modal"),k(this,"-docked"),t(this,O,"f").unlock(),t(this,z,"f").unlock();break;case"modal":this.ariaModal="true",f(this,"-docked"),k(this,"-modal"),this.isOpen&&(t(this,O,"f").lock(),t(this,z,"f").lock())}this.isOpen&&t(this,D,"m",G).call(this)},G=async function(){"docked"===this.currentVariant&&t(this,W,"f")?(t(this,P,"f")?.call(this),e(this,P,await _(this,t(this,Y,"f")??t(this,W,"f"),{position:"bottom-start",inline:!0,flip:!0,shift:"both"},(t,e,a)=>{y(this,"-top",a.includes("top")),y(this,"-bottom",a.includes("bottom")),"rtl"===L.current?(this.style.right=window.innerWidth-t-this.clientWidth+"px",this.style.left=""):(this.style.left=`${t}px`,this.style.right=""),this.style.top=`${e}px`}),"f")):t(this,D,"m",J).call(this)},J=function(){t(this,P,"f")?.call(this),e(this,P,void 0,"f"),this.style.left="",this.style.right="",this.style.top=""},Q=function(){this._date=this._rangeStart=this._rangeEnd=void 0},Z.styles=s`:host { flex-direction: column; margin: unset; border: unset; padding-block: var(--m3e-datepicker-container-padding-block, 0.75rem); padding-inline: var(--m3e-datepicker-container-padding-inline, 0.25rem); background-color: var(--m3e-datepicker-container-color, ${$.color.surfaceContainer}); box-shadow: var(--m3e-datepicker-container-elevation, ${$.elevation.level3}); opacity: 0; display: none; } .calendar { --m3e-calendar-container-color: transparent; --m3e-calendar-container-elevation: ${$.elevation.level0}; --m3e-calendar-container-shape: ${$.shape.corner.none}; } .headline { color: var(--m3e-datepicker-modal-headline-color, ${$.color.onSurfaceVariant}); font-size: var( --m3e-datepicker-modal-headline-font-size, ${$.typescale.standard.headline.large.fontSize} ); font-weight: var( --m3e-datepicker-modal-headline-font-weight, ${$.typescale.standard.headline.large.fontWeight} ); line-height: var( --m3e-datepicker-modal-headline-line-height, ${$.typescale.standard.headline.large.lineHeight} ); letter-spacing: var( --m3e-datepicker-modal-headline-tracking, ${$.typescale.standard.headline.large.tracking} ); margin-block-start: 2.25rem; margin-block-end: 0.75rem; margin-inline: 1.5rem; } .supporting-text { color: var(--m3e-datepicker-modal-supporting-text-color, ${$.color.onSurfaceVariant}); font-size: var( --m3e-datepicker-modal-supporting-text-font-size, ${$.typescale.standard.label.large.fontSize} ); font-weight: var( --m3e-datepicker-modal-supporting-text-font-weight, ${$.typescale.standard.label.large.fontWeight} ); line-height: var( --m3e-datepicker-modal-supporting-text-line-height, ${$.typescale.standard.label.large.lineHeight} ); letter-spacing: var( --m3e-datepicker-modal-supporting-text-tracking, ${$.typescale.standard.label.large.tracking} ); margin-block-start: 1rem; margin-inline: 1.5rem; } .divider { height: var(--m3e-divider-thickness, 1px); width: 100%; position: relative; } .divider::before { content: ""; box-sizing: border-box; position: absolute; border-bottom: var(--m3e-divider-thickness, 1px) solid var(--m3e-divider-color, ${$.color.outlineVariant}); height: inherit; left: -0.25rem; right: -0.25rem; } .actions { display: flex; align-items: center; column-gap: 0.5rem; padding-inline: var(--m3e-datepicker-actions-padding-inline, 0.5rem); } .spacer { flex: 1 1 auto; } :host(:state(-docked)) { position: absolute; background-color: var(--m3e-datepicker-docked-container-color, ${$.color.surfaceContainer}); border-radius: var(--m3e-datepicker-docked-container-shape, ${$.shape.corner.large}); } :host(:state(-modal)) { position: fixed; inset: 0; margin: auto; transform-origin: top; background-color: var(--m3e-datepicker-modal-container-color, ${$.color.surfaceContainerHigh}); border-radius: var(--m3e-datepicker-modal-container-shape, ${$.shape.corner.extraLarge}); } :host(:not(:state(-no-animate))) { transition: ${n(`opacity ${$.motion.duration.short2} ${$.motion.easing.standard}, \n        transform ${$.motion.duration.short2} ${$.motion.easing.standard},\n        overlay ${$.motion.duration.short2} ${$.motion.easing.standard} allow-discrete,\n        display ${$.motion.duration.short2} ${$.motion.easing.standard} allow-discrete`)}; } :host { transform: scaleY(0.8); } :host(:popover-open) { transform: scaleY(1); display: inline-flex; opacity: 1; } :host(:state(-docked))::backdrop { background-color: transparent; } :host(:state(-modal))::backdrop { background-color: color-mix(in srgb, var(--m3e-dialog-scrim-color, ${$.color.scrim}) 0%, transparent); margin-inline-end: -20px; } :host(:state(-modal):not(:popover-open))::backdrop { transition: ${n(`background-color ${$.motion.duration.short3} ${$.motion.easing.standard}, \n        overlay ${$.motion.duration.short3} ${$.motion.easing.standard} allow-discrete,\n        visibility ${$.motion.duration.short3} ${$.motion.easing.standard} allow-discrete`)}; } :host(:state(-modal):popover-open)::backdrop { background-color: color-mix( in srgb, var(--m3e-dialog-scrim-color, ${$.color.scrim}) var(--m3e-dialog-scrim-opacity, 32%), transparent ); transition: ${n(`background-color ${$.motion.duration.long2} ${$.motion.easing.standard}, \n        overlay ${$.motion.duration.long2} ${$.motion.easing.standard} allow-discrete,\n        visibility ${$.motion.duration.long2} ${$.motion.easing.standard} allow-discrete`)}; } :host(:state(-bottom)) { transform-origin: top; } :host(:state(-top)) { transform-origin: bottom; } @starting-style { :host(:popover-open) { transform: scaleY(0.8); } :host(:state(-modal):popover-open)::backdrop { background-color: color-mix(in srgb, var(--m3e-dialog-scrim-color, ${$.color.scrim}) 0%, transparent); } } @media (prefers-reduced-motion) { :host(:not(:state(-no-animate))) { transition: none; } } @media (forced-colors: active) { :host { background-color: Menu; color: MenuText; border: 1px solid CanvasText; } }`,a([l()],Z.prototype,"_date",void 0),a([l()],Z.prototype,"_rangeStart",void 0),a([l()],Z.prototype,"_rangeEnd",void 0),a([d("m3e-calendar")],Z.prototype,"_calendar",void 0),a([l()],Z.prototype,"_variant",void 0),a([c()],Z.prototype,"variant",void 0),a([c({attribute:"start-view"})],Z.prototype,"startView",void 0),a([c({converter:w})],Z.prototype,"date",void 0),a([c({attribute:"start-at",converter:w})],Z.prototype,"startAt",void 0),a([c({attribute:"min-date",converter:w})],Z.prototype,"minDate",void 0),a([c({attribute:"max-date",converter:w})],Z.prototype,"maxDate",void 0),a([c({attribute:"range-start",converter:w})],Z.prototype,"rangeStart",void 0),a([c({attribute:"range-end",converter:w})],Z.prototype,"rangeEnd",void 0),a([c({attribute:!1})],Z.prototype,"blackoutDates",void 0),a([c({attribute:!1})],Z.prototype,"specialDates",void 0),a([c({attribute:"previous-month-label"})],Z.prototype,"previousMonthLabel",void 0),a([c({attribute:"previous-year-label"})],Z.prototype,"previousYearLabel",void 0),a([c({attribute:"previous-multi-year-label"})],Z.prototype,"previousMultiYearLabel",void 0),a([c({attribute:"next-month-label"})],Z.prototype,"nextMonthLabel",void 0),a([c({attribute:"next-year-label"})],Z.prototype,"nextYearLabel",void 0),a([c({attribute:"next-multi-year-label"})],Z.prototype,"nextMultiYearLabel",void 0),a([c({type:Boolean})],Z.prototype,"clearable",void 0),a([c({attribute:"clear-label"})],Z.prototype,"clearLabel",void 0),a([c({attribute:"confirm-label"})],Z.prototype,"confirmLabel",void 0),a([c({attribute:"dismiss-label"})],Z.prototype,"dismissLabel",void 0),a([c()],Z.prototype,"label",void 0),Z=R=a([x("m3e-datepicker")],Z);let tt=class extends(E(S)){connectedCallback(){super.connectedCallback(),this.parentElement&&(this.parentElement.ariaHasPopup="dialog")}disconnectedCallback(){super.disconnectedCallback(),this.parentElement&&(this.parentElement.ariaHasPopup=null)}_onClick(){this.control instanceof Z&&this.parentElement&&this.control.toggle(this.parentElement,this.closest("m3e-form-field")??void 0)}};tt=a([x("m3e-datepicker-toggle")],tt);export{Z as M3eDatepickerElement,tt as M3eDatepickerToggleElement};

package/dist/dialog.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/dialog.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 o}from"tslib";import{property as i,state as n,query as a}from"lit/decorators.js";import{customElement as s,ActionElementBase as r,EventAttribute as l,AttachInternals as c,ScrollLockController as d,focusWhenReady as h,setCustomState as m,DesignToken as p,HtmlFor as g}from"@m3e/web/core";import{LitElement as u,html as b,nothing as v,unsafeCSS as f,css as y}from"lit";import{ifDefined as $}from"lit/directives/if-defined.js";import"@m3e/web/core/a11y";import"@m3e/web/icon-button";let w=class extends r{constructor(){super(...arguments),this.returnValue=""}_onClick(){this.closest("m3e-dialog")?.hide(this.returnValue)}};var k,x,_,C,E,z,V,Y,W,B,S,A;e([i({attribute:"return-value"})],w.prototype,"returnValue",void 0),w=e([s("m3e-dialog-action")],w);let H=A=class extends(l(c(u),"opening","opened","cancel","closing","closed")){constructor(){super(...arguments),k.add(this),x.set(this,A.__nextId++),_.set(this,!1),C.set(this,!1),this._withActions=!1,E.set(this,new d(this)),this.alert=!1,this.dismissible=!1,this.disableClose=!1,this.noFocusTrap=!1,this.closeLabel="Close",this.returnValue=""}get open(){return t(this,_,"f")}set open(e){e!==t(this,_,"f")&&(o(this,_,e,"f"),t(this,_,"f")?this.show():this.hide())}async show(){if(await this.updateComplete,this._base.open)return;if(!this.dispatchEvent(new Event("opening",{cancelable:!0})))return void(this.open=!1);t(this,E,"f").lock(),this._base.showModal(),this._content.scrollTop=0;const e=this.querySelector("[autofocus]");e&&h(e),this.dispatchEvent(new Event("opened"))}async hide(e=this.returnValue){if(!this.isConnected)return void(this.open=!1);if(await this.updateComplete,t(this,E,"f").unlock(),!this._base.open)return void(this.open=!1);const o=this.returnValue;this.returnValue=e,this.dispatchEvent(new Event("closing",{cancelable:!0}))?(this.open=!1,this._base.close(e),this.dispatchEvent(new Event("closed"))):this.returnValue=o}render(){return b`<dialog class="base" role="${$(this.alert?"alertdialog":void 0)}" aria-labelledby="m3e-dialog-${t(this,x,"f")}-header" .returnvalue="${this.returnValue}" @close="${t(this,k,"m",V)}" @cancel="${t(this,k,"m",Y)}" @click="${t(this,k,"m",W)}" @keydown="${t(this,k,"m",B)}"><m3e-elevation level="3"></m3e-elevation><m3e-focus-trap ?disabled="${this.noFocusTrap}"><div class="header"><slot name="header" id="m3e-dialog-${t(this,x,"f")}-header"></slot>${t(this,k,"m",z).call(this)}</div><m3e-scroll-container class="content" dividers="${this._withActions?"above-below":"above"}"><slot></slot></m3e-scroll-container><div class="actions"><slot name="actions" @slotchange="${t(this,k,"m",S)}"></slot></div></m3e-focus-trap></dialog>`}};x=new WeakMap,_=new WeakMap,C=new WeakMap,E=new WeakMap,k=new WeakSet,z=function(){return this.dismissible?b`<m3e-icon-button aria-label="${this.closeLabel}" class="close" @click="${this.hide}"><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>`:v},V=function(){t(this,C,"f")&&(o(this,C,!0,"f"),this._base?.dispatchEvent(new Event("cancel",{cancelable:!0})))},Y=function(e){e.target===this._base&&(o(this,C,!1,"f"),e.preventDefault(),this.dispatchEvent(new Event("cancel",{cancelable:!0}))&&this.hide())},W=function(e){this.disableClose||e.target!==this._base||this.hide()},B=function(e){"Escape"!==e.key||e.shiftKey||e.ctrlKey||(e.preventDefault(),this.disableClose||this.hide())},S=function(e){this._withActions=e.target.assignedNodes({flatten:!0}).length>0,m(this,"-with-actions",this._withActions)},H.styles=y`:host { display: contents; } .base { font: inherit; border: unset; outline: unset; padding: unset; display: flex; flex-direction: column; position: fixed; overflow: visible; border-radius: var(--m3e-dialog-shape, ${p.shape.corner.extraLarge}); min-width: var(--m3e-dialog-min-width, 17.5rem); max-width: var(--m3e-dialog-max-width, 35rem); color: var(--m3e-dialog-color, ${p.color.onSurface}); background-color: var(--m3e-dialog-container-color, ${p.color.surfaceContainerHigh}); visibility: hidden; opacity: 0; transform-origin: top; transform: translateY(-3.125rem) scaleY(0.8); } .base::backdrop { background-color: color-mix(in srgb, var(--m3e-dialog-scrim-color, ${p.color.scrim}) 0%, transparent); margin-inline-end: -20px; } .base:not([open]) { visibility: hidden; opacity: 0; transform: translateY(-3.125rem) scaleY(0.8); transition: ${f(`opacity ${p.motion.duration.short3} ${p.motion.easing.emphasized}, \n        transform ${p.motion.duration.short3} ${p.motion.easing.emphasized},\n        overlay ${p.motion.duration.short3} ${p.motion.easing.emphasized} allow-discrete,\n        visibility ${p.motion.duration.short3} ${p.motion.easing.emphasized} allow-discrete`)}; } .base[open] { visibility: visible; opacity: 1; transform: translateY(0) scaleY(1); transition: ${f(`opacity ${p.motion.duration.long2} ${p.motion.easing.emphasized}, \n        transform ${p.motion.duration.long2} ${p.motion.easing.emphasized},\n        overlay ${p.motion.duration.long2} ${p.motion.easing.emphasized} allow-discrete,\n        visibility ${p.motion.duration.long2} ${p.motion.easing.emphasized} allow-discrete`)}; } .base:not([open])::backdrop { transition: ${f(`background-color ${p.motion.duration.short3} ${p.motion.easing.standard}, \n        overlay ${p.motion.duration.short3} ${p.motion.easing.standard} allow-discrete,\n        visibility ${p.motion.duration.short3} ${p.motion.easing.standard} allow-discrete`)}; } .base[open]::backdrop { background-color: color-mix( in srgb, var(--m3e-dialog-scrim-color, ${p.color.scrim}) var(--m3e-dialog-scrim-opacity, 32%), transparent ); transition: ${f(`background-color ${p.motion.duration.long2} ${p.motion.easing.standard}, \n        overlay ${p.motion.duration.long2} ${p.motion.easing.standard} allow-discrete,\n        visibility ${p.motion.duration.long2} ${p.motion.easing.standard} allow-discrete`)}; } @starting-style { .base[open] { opacity: 0; transform: translateY(-3.125rem) scaleY(0.8); } .base[open]::backdrop { background-color: color-mix(in srgb, var(--m3e-dialog-scrim-color, ${p.color.scrim}) 0%, transparent); } } .header { flex: none; display: flex; align-items: center; padding: 1.5rem 1.5rem 1rem 1.5rem; background-color: var(--m3e-dialog-header-container-color, transparent); } ::slotted([slot="header"]) { margin: unset; flex: 1 1 auto; color: var(--m3e-dialog-header-color, inherit); font-size: var(--m3e-dialog-header-font-size, ${p.typescale.standard.headline.small.fontSize}); font-weight: var(--m3e-dialog-header-font-weight, ${p.typescale.standard.headline.small.fontWeight}); line-height: var(--m3e-dialog-header-line-height, ${p.typescale.standard.headline.small.lineHeight}); letter-spacing: var(--m3e-dialog-header-tracking, ${p.typescale.standard.headline.small.tracking}); } .content { padding-inline: 1.5rem; color: var(--m3e-dialog-content-color, ${p.color.onSurfaceVariant}); font-size: var(--m3e-dialog-content-font-size, ${p.typescale.standard.body.medium.fontSize}); font-weight: var(--m3e-dialog-content-font-weight, ${p.typescale.standard.body.medium.fontWeight}); line-height: var(--m3e-dialog-content-line-height, ${p.typescale.standard.body.medium.lineHeight}); letter-spacing: var(--m3e-dialog-content-tracking, ${p.typescale.standard.body.medium.tracking}); } .actions { padding: 1.5rem; } ::slotted([slot="actions"]) { flex: none; display: flex; align-items: center; min-height: 1.5rem; column-gap: 0.5rem; } ::slotted([slot="actions"][end]) { justify-content: flex-end; } :host(:not(:state(-with-actions))) .content { margin-bottom: 1.5rem; } :host(:not(:state(-with-actions))) .actions { display: none; } .close { margin-inline-start: 0.5rem; } ::slotted([slot="close-icon"]), .close-icon { width: 1em; font-size: var(--m3e-icon-button-icon-size, 1.5rem) !important; } @media (forced-colors: active) { .base:not([open])::backdrop, .base[open]::backdrop { transition: none; } .base { border-style: solid; border-width: 1px; border-color: CanvasText; } } @media (prefers-reduced-motion) { .base:not([open]), .base[open], .base:not([open])::backdrop, .base[open]::backdrop { transition: none; } }`,H.__nextId=0,e([n()],H.prototype,"_withActions",void 0),e([a(".base")],H.prototype,"_base",void 0),e([a(".content")],H.prototype,"_content",void 0),e([i({type:Boolean})],H.prototype,"alert",void 0),e([i({type:Boolean,reflect:!0})],H.prototype,"open",null),e([i({type:Boolean})],H.prototype,"dismissible",void 0),e([i({attribute:"disable-close",type:Boolean})],H.prototype,"disableClose",void 0),e([i({attribute:"no-focus-trap",type:Boolean})],H.prototype,"noFocusTrap",void 0),e([i({attribute:"close-label"})],H.prototype,"closeLabel",void 0),H=A=e([s("m3e-dialog")],H);let M=class extends(g(r)){connectedCallback(){super.connectedCallback(),this.parentElement&&(this.parentElement.ariaHasPopup="dialog")}disconnectedCallback(){super.disconnectedCallback(),this.parentElement&&(this.parentElement.ariaHasPopup=null)}_onClick(){this.control instanceof H&&this.control.show()}};M=e([s("m3e-dialog-trigger")],M);export{w as M3eDialogActionElement,H as M3eDialogElement,M as M3eDialogTriggerElement};

package/dist/divider.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 } from 'tslib';

package/dist/divider.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 t}from"tslib";import{LitElement as e,html as i,css as r}from"lit";import{property as o}from"lit/decorators.js";import{Role as s,DesignToken as n,customElement as l}from"@m3e/web/core";let a=class extends(s(e,"separator")){constructor(){super(...arguments),this.vertical=!1,this.inset=!1,this.insetStart=!1,this.insetEnd=!1}render(){return i`<div class="line"></div>`}};a.styles=r`:host { display: block; position: relative; } :host(:not([vertical])) { height: var(--m3e-divider-thickness, 1px); width: 100%; } :host([vertical]) { width: var(--m3e-divider-thickness, 1px); height: 100%; } .line { box-sizing: border-box; position: absolute; } :host(:not([vertical])) .line { border-bottom: var(--m3e-divider-thickness, 1px) solid var(--m3e-divider-color, ${n.color.outlineVariant}); height: inherit; } :host([vertical]) .line { border-right: var(--m3e-divider-thickness, 1px) solid var(--m3e-divider-color, ${n.color.outlineVariant}); width: inherit; } :host([vertical][inset]) .line, :host([vertical][inset-start]) .line { top: var(--m3e-divider-inset-start-size, var(--m3e-divider-inset-size, 1rem)); } :host(:not([vertical])[inset]) .line, :host(:not([vertical])[inset-start]) .line { left: var(--m3e-divider-inset-start-size, var(--m3e-divider-inset-size, 1rem)); } :host([vertical][inset]) .line, :host([vertical][inset-end]) .line { bottom: var(--m3e-divider-inset-end-size, var(--m3e-divider-inset-size, 1rem)); } :host(:not([vertical])[inset]) .line, :host(:not([vertical])[inset-end]) .line { right: var(--m3e-divider-inset-end-size, var(--m3e-divider-inset-size, 1rem)); } :host([vertical]:not([inset]):not([inset-start])) .line { top: 0; } :host(:not([vertical]):not([inset]):not([inset-start])) .line { left: 0; } :host([vertical]:not([inset]):not([inset-end])) .line { bottom: 0; } :host(:not([vertical]):not([inset]):not([inset-end])) .line { right: 0; } @media (forced-colors: active) { .line { border-color: GrayText; } }`,t([o({type:Boolean,reflect:!0})],a.prototype,"vertical",void 0),t([o({type:Boolean,reflect:!0})],a.prototype,"inset",void 0),t([o({attribute:"inset-start",type:Boolean,reflect:!0})],a.prototype,"insetStart",void 0),t([o({attribute:"inset-end",type:Boolean,reflect:!0})],a.prototype,"insetEnd",void 0),a=t([l("m3e-divider")],a);export{a as M3eDividerElement};

package/dist/drawer-container.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/drawer-container.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 s}from"tslib";import{unsafeCSS as r,css as i,LitElement as o,html as a}from"lit";import{state as n,property as d}from"lit/decorators.js";import{DesignToken as l,ReconnectedCallback as h,AttachInternals as c,ResizeController as m,addCustomState as p,hasAssignedNodes as u,hasCustomState as v,deleteCustomState as b,customElement as g,HtmlFor as f,ActionElementBase as w}from"@m3e/web/core";import{M3eBreakpointObserver as $,Breakpoint as y}from"@m3e/web/core/layout";import{addAriaReferencedId as M,removeAriaReferencedId as _}from"@m3e/web/core/a11y";const x=r(`var(--m3e-drawer-container-color, ${l.color.surface})`),k=r(`var(--m3e-drawer-container-elevation, ${l.elevation.level0})`),E=r("var(--m3e-drawer-container-width, 22.5rem)"),z=r("var(--m3e-drawer-container-scrim-opacity, 32%)"),S=r(`var(--m3e-modal-drawer-corner-shape, ${l.shape.corner.large})`),C=r(`var(--m3e-modal-drawer-container-color, ${l.color.surfaceContainerLow})`),W=r(`var(--m3e-modal-drawer-elevation, ${l.elevation.level1})`),B=r(`var(--m3e-drawer-divider-color, ${l.color.outline})`),L=r("var(--m3e-drawer-divider-thickness, 1px)"),U=i`:host { display: block; position: relative; overflow: hidden; flex: 1 1 auto; } .start, .end { position: absolute; top: 0; bottom: 0; z-index: 3; outline: none; overflow-x: hidden; overflow-y: auto; scrollbar-width: ${l.scrollbar.thinWidth}; scrollbar-color: ${l.scrollbar.color}; box-sizing: border-box; background-color: ${x}; box-shadow: ${k}; transition: ${r(`margin ${l.motion.duration.medium4} ${l.motion.easing.standard},\n      visibility ${l.motion.duration.medium4} ${l.motion.easing.standard} allow-discrete,\n      background-color ${l.motion.duration.medium4} ${l.motion.easing.standard},\n      box-shadow ${l.motion.duration.medium4} ${l.motion.easing.standard}`)}; } .start { inset-inline-start: 0; } .end { inset-inline-end: 0; } :host(:not([start])) .start { visibility: hidden; } :host(:not([start]):not(:dir(rtl))) .start { margin-left: calc(0px - var(--_start-drawer-size, ${E})); } :host(:not([start]):dir(rtl)) .start { margin-right: calc(0px - var(--_start-drawer-size, ${E})); } :host([start]:not(:dir(rtl))) .start { margin-left: 0; } :host([start]:dir(rtl)) .start { margin-right: 0; } :host(:not([end])) .end { visibility: hidden; } :host(:not([end]):not(:dir(rtl))) .end { margin-right: calc(0px - var(--_end-drawer-size, ${E})); } :host(:not([end]):dir(rtl)) .end { margin-left: calc(0px - var(--_end-drawer-size, ${E})); } :host([end]:not(:dir(rtl))) .end { margin-right: 0; } :host([end]:dir(rtl)) .end { margin-left: 0; } ::slotted([slot="start"]), ::slotted([slot="end"]) { height: 100%; width: ${E}; box-sizing: border-box; } .content { position: relative; height: 100%; overflow: auto; margin-left: 0; margin-right: 0; transition: ${r(`margin ${l.motion.duration.medium4} ${l.motion.easing.standard}`)}; } :host(:state(-start-push)[start]:not(:dir(rtl))) .content, :host(:state(-start-side)[start]:not(:dir(rtl))) .content { margin-left: var(--_start-drawer-size, ${E}); } :host(:state(-start-push)[start]:dir(rtl)) .content, :host(:state(-start-side)[start]:dir(rtl)) .content { margin-right: var(--_start-drawer-size, ${E}); } :host(:state(-end-push)[end]:not(:dir(rtl))) .content, :host(:state(-end-side)[end]:not(:dir(rtl))) .content { margin-right: var(--_end-drawer-size, ${E}); } :host(:state(-end-push)[end]:dir(rtl)) .content, :host(:state(-end-side)[end]:dir(rtl)) .content { margin-left: var(--_end-drawer-size, ${E}); } .scrim { display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; background-color: ${l.color.scrim}; opacity: 0; visibility: hidden; transition: ${r(`opacity ${l.motion.duration.medium4} ${l.motion.easing.standard}, \n        visibility ${l.motion.duration.medium4} ${l.motion.easing.standard} allow-discrete`)}; } @starting-style { .scrim { opacity: 0; } } :host(:state(-start-push)[start]) .scrim, :host(:state(-end-push)[end]) .scrim, :host(:state(-start-over)[start]) .scrim, :host(:state(-end-over)[end]) .scrim { visibility: visible; opacity: ${z}; } :host(:state(-start-push)) .start, :host(:state(-start-over)) .start { border-start-end-radius: ${S}; border-end-end-radius: ${S}; } :host(:state(-end-push)) .end, :host(:state(-end-over)) .end { border-start-start-radius: ${S}; border-end-start-radius: ${S}; } :host(:state(-start-push)) .start, :host(:state(-end-push)) .end, :host(:state(-start-over)) .start, :host(:state(-end-over)) .end { background-color: ${C}; box-shadow: ${W}; } :host([start-divider]) .start { border-inline-end-color: transparent; border-inline-end-width: ${L}; border-inline-end-style: solid; box-sizing: border-box; } :host([start-divider]:state(-start-side)[start]:not(:state(-end-push)[end]):not(:state(-end-over)[end])) .start { border-inline-end-color: ${B}; } :host([end-divider]) .end { border-inline-start-color: transparent; border-inline-start-width: ${L}; border-inline-start-style: solid; box-sizing: border-box; } :host([end-divider]:state(-end-side)[end]:not(:state(-start-push)[start]):not(:state(-start-over)[start])) .end { border-inline-start-color: ${B}; } :host(:state(-no-animate)) .start, :host(:state(-no-animate)) .end, :host(:state(-no-animate)) .content { transition: none; } @media (forced-colors: active) { .start, .end { background-color: Canvas; box-shadow: unset; transition: ${r(`margin ${l.motion.duration.medium4} ${l.motion.easing.standard},\n      visibility ${l.motion.duration.medium4} ${l.motion.easing.standard} allow-discrete`)}; } :host(:state(-start-push)) .start, :host(:state(-end-push)) .end, :host(:state(-start-over)) .start, :host(:state(-end-over)) .end { background-color: Canvas; box-shadow: unset; border-color: CanvasText; } .start, .end { border-style: solid; border-color: Canvas; border-width: 1px; } .start { border-inline-start-style: none; } .end { border-inline-end-style: none; } :host([start-divider]:state(-start-side)[start]:not(:state(-end-push)[end]):not(:state(-end-over)[end])) .start { border-inline-end-color: GrayText; } :host([end-divider]:state(-end-side)[end]:not(:state(-start-push)[start]):not(:state(-start-over)[start])) .end { border-inline-start-color: GrayText; } } @media (prefers-reduced-motion) { .start, .end, .content, .scrim { transition: none; } }`;var A,D,F,P,T,X,q,G,R,j,I,H,J;let K=class extends(h(c(o))){constructor(){super(...arguments),A.add(this),this._startMode="side",this._endMode="side",D.set(this,void 0),F.set(this,!1),P.set(this,!1),T.set(this,new m(this,{target:null,skipInitial:!0,callback:e=>t(this,A,"m",j).call(this,e)})),this.start=!1,this.startMode="side",this.startDivider=!1,this.end=!1,this.endMode="side",this.endDivider=!1}connectedCallback(){super.connectedCallback(),p(this,"-no-animate")}disconnectedCallback(){super.disconnectedCallback(),t(this,D,"f")?.call(this),t(this,A,"m",H).call(this)}willUpdate(e){super.willUpdate(e),(e.has("startMode")||e.has("endMode"))&&(t(this,D,"f")?.call(this),"auto"===this.startMode||"auto"===this.endMode?t(this,A,"m",I).call(this):t(this,A,"m",J).call(this)),e.has("start")?this.start&&this.end&&"side"!==this._endMode&&(this.end=!1,this.dispatchEvent(new Event("change",{bubbles:!0}))):e.has("end")&&this.end&&this.start&&"side"!==this._startMode&&(this.start=!1,this.dispatchEvent(new Event("change",{bubbles:!0})))}reconnectedCallback(){super.reconnectedCallback(),t(this,A,"m",X).call(this),"auto"!==this.startMode&&"auto"!==this.endMode||t(this,A,"m",I).call(this)}firstUpdated(e){super.firstUpdated(e),t(this,A,"m",X).call(this)}render(){return a`<div class="start"><m3e-focus-trap ?disabled="${!this.start||"side"===this._startMode||t(this,F,"f")}"><slot name="start" @slotchange="${t(this,A,"m",G)}"></slot></m3e-focus-trap></div><div class="content" .inert="${("side"!==this._startMode||"side"!==this._endMode)&&(this.start||this.end)}"><slot></slot></div><div class="scrim" @click="${t(this,A,"m",q)}"></div><div class="end"><m3e-focus-trap ?disabled="${!this.end||"side"===this._endMode||t(this,P,"f")}"><slot name="end" @slotchange="${t(this,A,"m",R)}"></slot></m3e-focus-trap></div>`}};var N,O,Q,V,Y,Z;D=new WeakMap,F=new WeakMap,P=new WeakMap,T=new WeakMap,A=new WeakSet,X=function(){let e=this.shadowRoot?.querySelector(".start");e&&t(this,T,"f").observe(e),e=this.shadowRoot?.querySelector(".end"),e&&t(this,T,"f").observe(e)},q=function(){"side"!==this._startMode&&(this.start=!1),"side"!==this._endMode&&(this.end=!1),this.dispatchEvent(new Event("change",{bubbles:!0}))},G=function(t){e(this,F,!u(t.target),"f")},R=function(t){e(this,P,!u(t.target),"f")},j=function(t){for(const e of t){const t=Array.isArray(e.borderBoxSize)?e.borderBoxSize[0]:e.borderBoxSize;e.target.classList.contains("start")?this.style.setProperty("--_start-drawer-size",`${t.inlineSize}px`):e.target.classList.contains("end")&&this.style.setProperty("--_end-drawer-size",`${t.inlineSize}px`)}v(this,"-no-animate")&&(this.offsetTop,b(this,"-no-animate"))},I=function(){e(this,D,$.observe([y.XSmall,y.Small],e=>t(this,A,"m",J).call(this,e,!0)),"f")},H=function(){b(this,"-start-over"),b(this,"-start-push"),b(this,"-start-side"),b(this,"-end-over"),b(this,"-end-push"),b(this,"-end-side")},J=function(e,s=!1){let r=!1,i=!1;"auto"===this.startMode?e?.get(y.Medium)?this._startMode="side":e?.get(y.Small)?(r="side"===this._startMode&&this.start,this._startMode="push"):e?.get(y.XSmall)?(r="over"!==this._startMode&&this.start,this._startMode="over"):this._startMode="side":this._startMode=this.startMode,"auto"===this.endMode?e?.get(y.Medium)?this._endMode="side":e?.get(y.Small)?(i="side"===this._endMode&&this.end,this._endMode="push"):e?.get(y.XSmall)?(i="over"!==this._endMode&&this.end,this._endMode="over"):this._endMode="side":this._endMode=this.endMode,t(this,A,"m",H).call(this),p(this,`-start-${this._startMode}`),p(this,`-end-${this._endMode}`),s&&(r||i)&&(r&&(this.start=!1),i&&(this.end=!1),this.dispatchEvent(new Event("change",{bubbles:!0})))},K.styles=U,s([n()],K.prototype,"_startMode",void 0),s([n()],K.prototype,"_endMode",void 0),s([d({type:Boolean,reflect:!0})],K.prototype,"start",void 0),s([d({attribute:"start-mode",reflect:!0})],K.prototype,"startMode",void 0),s([d({attribute:"start-divider",type:Boolean,reflect:!0})],K.prototype,"startDivider",void 0),s([d({type:Boolean,reflect:!0})],K.prototype,"end",void 0),s([d({attribute:"end-mode",reflect:!0})],K.prototype,"endMode",void 0),s([d({attribute:"end-divider",type:Boolean,reflect:!0})],K.prototype,"endDivider",void 0),K=s([g("m3e-drawer-container")],K);let tt=class extends(f(w)){constructor(){super(...arguments),N.add(this),O.set(this,()=>t(this,N,"m",V).call(this)),Q.set(this,!1)}attach(e){super.attach(e),this.htmlFor&&this.parentElement&&M(this.parentElement,"aria-controls",this.htmlFor);const s=e.closest("m3e-drawer-container");s&&(s.addEventListener("change",t(this,O,"f")),t(this,N,"m",Z).call(this,s,!0))}detach(){this.parentElement&&(this.htmlFor&&_(this.parentElement,"aria-controls",this.htmlFor),this.parentElement.ariaExpanded=null),this.control?.closest("m3e-drawer-container")?.removeEventListener("change",t(this,O,"f")),super.detach()}_onClick(){t(this,N,"m",Y).call(this)}};O=new WeakMap,Q=new WeakMap,N=new WeakSet,V=function(){if(this.control&&!t(this,Q,"f")){const e=this.control.closest("m3e-drawer-container");e&&t(this,N,"m",Z).call(this,e,!0)}},Y=async function(){if(!this.parentElement||!this.control)return;const s=this.control.closest("m3e-drawer-container");if(s){e(this,Q,!0,"f");try{"start"===this.control.slot?s.start=!s.start:"end"===this.control.slot&&(s.end=!s.end),s.isUpdatePending&&await s.updateComplete,await t(this,N,"m",Z).call(this,s,!1)}finally{e(this,Q,!1,"f")}}},Z=async function(t,e){if(!this.parentElement||!this.control)return;let s=!1;"start"===this.control.slot?s=t.start:"end"===this.control.slot&&(s=t.end),this.parentElement.ariaExpanded=`${s}`,e&&this.parentElement.hasAttribute("toggle")&&this.parentElement.toggleAttribute("selected",s),this.parentElement instanceof o&&(await this.parentElement.updateComplete,this.parentElement.ariaPressed=null)},tt=s([g("m3e-drawer-toggle")],tt);export{K as M3eDrawerContainerElement,tt as M3eDrawerToggleElement};

package/dist/expansion-panel.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/expansion-panel.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 o}from"tslib";import{css as i,LitElement as n,html as a,unsafeCSS as s,nothing as r}from"lit";import{property as l,query as d}from"lit/decorators.js";import{DesignToken as p,customElement as c,KeyboardClick as h,Focusable as g,Disabled as m,AttachInternals as f,Role as u,EventAttribute as v,ReconnectedCallback as x,setCustomState as b,hasAssignedNodes as $}from"@m3e/web/core";import{M3eDirectionality as y}from"@m3e/web/core/bidi";var k,w,_,z;let C=class extends n{constructor(){super(...arguments),k.add(this),w.set(this,[]),this.multi=!1}get panels(){return t(this,w,"f")}render(){return a`<slot @slotchange="${t(this,k,"m",_)}" @opening="${t(this,k,"m",z)}"></slot>`}};w=new WeakMap,k=new WeakSet,_=function(){if(o(this,w,[...this.querySelectorAll("m3e-expansion-panel")],"f"),this.multi)return;let e=!1;for(const o of t(this,w,"f").filter(e=>!e.open))e&&(o.open=!1),e=!0},z=function(e){if(!this.multi)for(const o of t(this,w,"f").filter(t=>t!==e.target&&t.open))o.open=!1},C.styles=i`:host { display: block; } ::slotted(m3e-expansion-panel) { --m3e-expansion-panel-container-color: ${p.color.surface}; --m3e-expansion-panel-elevation: ${p.elevation.level2}; --m3e-expansion-panel-open-shape: ${p.shape.corner.medium}; --_expansion-panel-open-spacing: 1rem; } ::slotted(m3e-expansion-panel:first-of-type:last-of-type) { --m3e-expansion-panel-shape: ${p.shape.corner.medium}; } ::slotted(m3e-expansion-panel:first-of-type:not(:last-of-type)) { --m3e-expansion-panel-shape: ${p.shape.corner.value.medium} ${p.shape.corner.value.medium} ${p.shape.corner.value.none} ${p.shape.corner.value.none}; } ::slotted(m3e-expansion-panel:last-of-type:not(:first-of-type)) { --m3e-expansion-panel-shape: ${p.shape.corner.value.none} ${p.shape.corner.value.none} ${p.shape.corner.value.medium} ${p.shape.corner.value.medium}; }`,e([l({type:Boolean})],C.prototype,"multi",void 0),C=e([c("m3e-accordion")],C);const P=s("var(--m3e-expansion-header-collapsed-height, 3rem)"),D=s("var(--m3e-expansion-header-expanded-height, 4rem)"),W=s("var(--m3e-expansion-header-padding-left, 1.5rem)"),M=s("var(--m3e-expansion-header-padding-right, 1.5rem)"),T=s("var(--m3e-expansion-header-spacing, 0.5rem)"),B=s("var(--m3e-expansion-header-toggle-icon-size, 1.5rem)"),S=s(`var(--m3e-expansion-header-font-size, ${p.typescale.standard.title.medium.fontSize})`),U=s(`var(--m3e-expansion-header-font-weight, ${p.typescale.standard.title.medium.fontWeight})`),j=s(`var(--m3e-expansion-header-line-height, ${p.typescale.standard.title.medium.lineHeight})`),A=s(`var(--m3e-expansion-header-tracking, ${p.typescale.standard.title.medium.tracking})`),E=i`:host { display: block; border-radius: inherit; outline: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: ${s(`height var(--m3e-collapsible-animation-duration, ${p.motion.duration.medium1})\n        ${p.motion.easing.standard}`)}; } .base { box-sizing: border-box; width: 100%; height: 100%; display: flex; border-radius: inherit; outline: none; position: relative; padding-inline-start: ${W}; padding-inline-end: ${M}; font-size: ${S}; font-weight: ${U}; line-height: ${j}; letter-spacing: ${A}; column-gap: ${T}; } :host(:not(:disabled)) { cursor: pointer; } :host(:not([aria-expanded="true"])) { height: ${P}; } :host([aria-expanded="true"]) { height: ${D}; } :host(:not(:focus-visible)) .state-layer { --m3e-state-layer-focus-color: transparent; } :host([aria-expanded="true"]) .state-layer { --m3e-state-layer-hover-color: transparent; } :host([aria-expanded="true"]) [part="background"], .content { flex: 1 1 auto; display: flex; align-items: center; } .toggle { display: flex; align-items: center; justify-content: center; vertical-align: middle; font-size: ${B}; transition: ${s(`transform var(--m3e-collapsible-animation-duration, ${p.motion.duration.medium1})\n        ${p.motion.easing.standard}`)}; } :host([toggle-direction="vertical"][aria-expanded="true"]) .toggle { transform: rotate(180deg); } :host([toggle-direction="horizontal"][aria-expanded="true"]) .toggle { transform: rotate(var(--_expansion-header-horizontal-expanded-toggle-rotation, 90deg)); } :host([toggle-position="before"]) .toggle { margin-inline-start: calc(0px - ${T}); } :host([toggle-position="after"]) .toggle { margin-inline-end: calc(0px - ${T}); } :host([hide-toggle]) .toggle { display: none; } ::slotted([slot="toggle-icon"]) { font-size: inherit !important; flex: none; } ::slotted(svg[slot="toggle-icon"]) { width: 1em; height: 1em; } @media (prefers-reduced-motion) { :host, .toggle { transition: none; } }`,Z=s(`var(--m3e-expansion-panel-text-color, ${p.color.onSurface})`),q=s(`var(--m3e-expansion-panel-disabled-text-color, ${p.color.onSurface})`),G=s("var(--m3e-expansion-panel-disabled-text-opacity, 38%)"),I=s("var(--m3e-expansion-panel-container-color)"),L=s("var(--m3e-expansion-panel-elevation)"),O=s("var(--m3e-expansion-panel-shape)"),R=s("var(--m3e-expansion-panel-open-elevation, var(--m3e-expansion-panel-elevation))"),H=s("var(--m3e-expansion-panel-open-shape, var(--m3e-expansion-panel-shape))"),V=s("var(--_expansion-panel-open-spacing)"),F=s("var(--m3e-expansion-panel-content-padding, 0 1.5rem 1rem 1.5rem)"),J=s("var(--m3e-expansion-panel-actions-spacing, 0.5rem)"),K=s("var(--m3e-expansion-panel-actions-padding, 1rem 1.5rem 1rem 1.5rem)"),N=s("var(--m3e-expansion-panel-actions-divider-thickness, var(--m3e-divider-thickness, 1px))"),Q=s(`var(--m3e-expansion-panel-actions-divider-color, var(--m3e-divider-color, ${p.color.outlineVariant}))`),X=i`:host { display: block; } .base { background-color: ${I}; transition: ${s(`box-shadow var(--m3e-collapsible-animation-duration, ${p.motion.duration.medium1})\n        ${p.motion.easing.standard}`)}; } :host(:not(:disabled)) .base { color: ${Z}; } :host(:disabled) .base { color: color-mix( in srgb, ${q} ${G}, transparent ); } :host(:not([open])) .base { box-shadow: ${L}; border-radius: ${O}; } :host([open]) .base { box-shadow: ${R}; border-radius: ${H}; margin-block: ${V}; } .toggle { display: flex; align-items: center; justify-content: center; font-size: ${B}; } ::slotted([slot="toggle-icon"]) { font-size: inherit !important; flex: none; } .toggle svg, ::slotted(svg[slot="toggle-icon"]) { width: 1em; height: 1em; } .content { padding: ${F}; } :host(:not(:state(-with-actions))) .actions { display: none; } .actions { padding: ${K}; border-top-style: solid; border-top-width: ${N}; border-top-color: ${Q}; } ::slotted([slot="actions"]) { flex: none; display: flex; align-items: center; column-gap: ${J}; } ::slotted([slot="actions"][end]) { justify-content: flex-end; } @media (prefers-reduced-motion) { .base { transition: none; } } @media (forced-colors: active) { .base { border: 1px solid CanvasText; } :host(:disabled) .base { color: GrayText; } .actions { border-top-color: GrayText; } }`;var Y,ee;let te=class extends(h(g(m(f(u(n,"button"),!0))))){constructor(){super(...arguments),Y.add(this),this.toggleDirection="vertical",this.togglePosition="after",this.hideToggle=!1}firstUpdated(e){super.firstUpdated(e),[this._focusRing,this._stateLayer].forEach(e=>e?.attach(this))}render(){return a`<div class="base"><m3e-focus-ring class="focus-ring" ?disabled="${this.disabled}"></m3e-focus-ring><m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer>${"before"===this.togglePosition?t(this,Y,"m",ee).call(this):r}<div class="content"><slot></slot></div>${"after"===this.togglePosition?t(this,Y,"m",ee).call(this):r}</div>`}};var oe,ie,ne,ae,se,re,le,de,pe,ce,he,ge;Y=new WeakSet,ee=function(){return a`<div class="toggle" aria-hidden="true"><slot name="toggle-icon"></slot></div>`},te.styles=E,e([d(".focus-ring")],te.prototype,"_focusRing",void 0),e([d(".state-layer")],te.prototype,"_stateLayer",void 0),e([l({attribute:"toggle-direction",reflect:!0})],te.prototype,"toggleDirection",void 0),e([l({attribute:"toggle-position",reflect:!0})],te.prototype,"togglePosition",void 0),e([l({attribute:"hide-toggle",type:Boolean,reflect:!0})],te.prototype,"hideToggle",void 0),te=e([c("m3e-expansion-header")],te);let me=ge=class extends(v(m(x(f(n,!0))),"opening","opened","closing","closed")){constructor(){super(...arguments),oe.add(this),ie.set(this,ge.__nextId++),ne.set(this,`m3e-expansion-panel-${t(this,ie,"f")}-content`),ae.set(this,`m3e-expansion-panel-${t(this,ie,"f")}-header`),se.set(this,void 0),this.open=!1,this.toggleDirection="vertical",this.togglePosition="after",this.hideToggle=!1}focus(e){this._header?.focus(e)}blur(){this._header?.blur()}click(){this._header?.click()}connectedCallback(){super.connectedCallback(),o(this,se,y.observe(()=>{this.requestUpdate(),t(this,oe,"m",he).call(this)}),"f")}disconnectedCallback(){super.disconnectedCallback(),t(this,se,"f")?.call(this)}reconnectedCallback(){super.reconnectedCallback(),t(this,oe,"m",he).call(this)}firstUpdated(e){super.firstUpdated(e),t(this,oe,"m",he).call(this)}render(){return a`<div class="base"><m3e-expansion-header id="${t(this,ae,"f")}" toggle-direction="${this.toggleDirection}" toggle-position="${this.togglePosition}" ?hide-toggle="${this.hideToggle}" ?disabled="${this.disabled}" aria-expanded="${this.open}" aria-controls="${t(this,ne,"f")}" @click="${t(this,oe,"m",le)}" @keydown="${t(this,oe,"m",de)}"><div slot="toggle-icon" class="toggle"><slot name="toggle-icon">${t(this,oe,"m",re).call(this)}</slot></div><slot name="header"></slot></m3e-expansion-header><m3e-collapsible id="${t(this,ne,"f")}" role="region" aria-labelledby="${t(this,ae,"f")}" ?open="${this.open}" @opening="${t(this,oe,"m",pe)}" @opened="${t(this,oe,"m",pe)}" @closing="${t(this,oe,"m",pe)}" @closed="${t(this,oe,"m",pe)}"><div class="content"><slot></slot></div><div class="actions"><slot name="actions" @slotchange="${t(this,oe,"m",ce)}"></slot></div></m3e-collapsible></div>`}};ie=new WeakMap,ne=new WeakMap,ae=new WeakMap,se=new WeakMap,oe=new WeakSet,re=function(){return"vertical"===this.toggleDirection?a`<svg viewBox="0 -960 960 960" fill="currentColor"><path d="M480-344 240-584l56-56 184 184 184-184 56 56-240 240Z"/></svg>`:"ltr"===y.current?a`<svg viewBox="0 -960 960 960" fill="currentColor"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>`:a`<svg viewBox="0 -960 960 960" fill="currentColor"><path d="M560-240 320-480l240-240 56 56-184 184 184 184-56 56Z"/></svg>`},le=function(){this.open=!this.open},de=function(e){switch(e.key){case"ArrowUp":{e.preventDefault();const t=this.closest("m3e-accordion");if(t){const e=[...t.panels].reverse(),o=e.indexOf(this);(e.find((e,t)=>!e.disabled&&t>o)??e.find((e,t)=>!e.disabled&&t<o))?._header?.focus()}else this.open=!1}break;case"ArrowDown":{e.preventDefault();const t=this.closest("m3e-accordion");if(t){const e=t.panels.indexOf(this);(t.panels.find((t,o)=>!t.disabled&&o>e)??t.panels.find((t,o)=>!t.disabled&&o<e))?._header?.focus()}else this.open=!0}}},pe=function(e){e.stopPropagation(),this.dispatchEvent(new Event(e.type,{bubbles:!0}))},ce=function(e){b(this,"-with-actions",$(e.target))},he=function(){"rtl"===y.current?this._header?.style.setProperty("--_expansion-header-horizontal-expanded-toggle-rotation","-90deg"):this._header?.style.removeProperty("--_expansion-header-horizontal-expanded-toggle-rotation")},me.styles=X,me.__nextId=0,e([d("m3e-expansion-header")],me.prototype,"_header",void 0),e([l({type:Boolean,reflect:!0})],me.prototype,"open",void 0),e([l({attribute:"toggle-direction",reflect:!0})],me.prototype,"toggleDirection",void 0),e([l({attribute:"toggle-position",reflect:!0})],me.prototype,"togglePosition",void 0),e([l({attribute:"hide-toggle",type:Boolean,reflect:!0})],me.prototype,"hideToggle",void 0),me=ge=e([c("m3e-expansion-panel")],me);export{C as M3eAccordionElement,te as M3eExpansionHeaderElement,me as M3eExpansionPanelElement};

package/dist/fab-menu.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/fab-menu.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 o,html as a,unsafeCSS as r,css as n}from"lit";import{query as s,property as l}from"lit/decorators.js";import{KeyboardClick as c,LinkButton as d,Disabled as m,AttachInternals as h,Role as f,renderPseudoLink as p,DesignToken as b,customElement as u,SuppressInitialAnimation as v,ScrollController as g,setCustomState as y,HtmlFor as k,ActionElementBase as w}from"@m3e/web/core";import{RovingTabIndexManager as $,addAriaReferencedId as x,removeAriaReferencedId as E}from"@m3e/web/core/a11y";import{M3eDirectionality as _}from"@m3e/web/core/bidi";import{positionAnchor as C}from"@m3e/web/core/anchoring";var W,M,L;let S=class extends(c(d(m(h(f(o,"menuitem"),!0))))){constructor(){super(...arguments),W.add(this),M.set(this,t=>e(this,W,"m",L).call(this,t))}get menu(){return this.closest("m3e-fab-menu")}connectedCallback(){super.connectedCallback(),this.addEventListener("click",e(this,M,"f"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",e(this,M,"f"))}firstUpdated(e){super.firstUpdated(e),[this._elevation,this._focusRing,this._stateLayer,this._ripple].forEach(e=>e?.attach(this))}render(){return a`<div class="base"><m3e-elevation class="elevation" ?disabled="${this.disabled}"></m3e-elevation><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="touch" aria-hidden="true"></div>${this[p]()}<div class="wrapper"><slot class="icon" name="icon" aria-hidden="true"></slot><div class="label"><slot></slot></div></div></div>`}};var P,I,T,z,A,H,j,K,X,O,R,U,q,D;M=new WeakMap,W=new WeakSet,L=function(e){e.defaultPrevented||this.menu?.hide(!0)},S.styles=n`:host { display: inline-block; outline: none; 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%; transition: ${r(`background-color ${b.motion.duration.short4} ${b.motion.easing.standard}`)}; height: var(--m3e-fab-menu-item-height, 3.5rem); font-size: var(--m3e-fab-menu-item-font-size, ${b.typescale.standard.label.large.fontSize}); font-weight: var(--m3e-fab-menu-item-font-weight, ${b.typescale.standard.label.large.fontWeight}); line-height: var(--m3e-fab-menu-item-line-height, ${b.typescale.standard.label.large.lineHeight}); letter-spacing: var(--m3e-fab-menu-item-tracking, ${b.typescale.standard.label.large.tracking}); border-radius: var(--m3e-fab-menu-item-shape, ${b.shape.corner.full}); } :host(:not(:disabled)) .label, :host(:not(:disabled)) .icon { color: var(--_fab-menu-item-color); } :host(:not(:disabled)) .base { background-color: var(--_fab-menu-item-container-color); --m3e-state-layer-hover-color: var(--_fab-menu-background-hover-color); --m3e-state-layer-focus-color: var(--_fab-menu-background-focus-color); --m3e-ripple-color: var(--_fab-menu-ripple-color); } :host(:disabled) .base { background-color: color-mix( in srgb, var(--m3e-fab-menu-item-disabled-container-color, ${b.color.onSurface}) var(--m3e-fab-menu-item-disabled-container-opacity, 10%), transparent ); } :host(:disabled) .label, :host(:disabled) .icon { color: color-mix( in srgb, var(--m3e-fab-menu-item-disabled-color, ${b.color.onSurface}) var(--m3e-fab-menu-item-disabled-opacity, 38%), transparent ); } .touch { position: absolute; height: 3rem; left: 0; right: 0; } .wrapper { width: 100%; overflow: hidden; display: inline-flex; align-items: center; padding-inline-start: var(--m3e-fab-menu-item-leading-space, 1.5rem); padding-inline-end: var(--m3e-fab-menu-item-trailing-space, 1.5rem); column-gap: var(--m3e-fab-menu-item-spacing, 0.5rem); } .label { justify-self: center; flex: 1 1 auto; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: ${r(`color ${b.motion.duration.short4} ${b.motion.easing.standard}`)}; } .icon { font-size: var(--m3e-fab-menu-item-icon-size, 1.5rem); transition: ${r(`color ${b.motion.duration.short4} ${b.motion.easing.standard}`)}; } :host(:not(:disabled)) { cursor: pointer; } ::slotted([slot="icon"]) { font-size: inherit !important; flex: none; } ::slotted(svg[slot="icon"]) { width: 1em; height: 1em; } a { all: unset; display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1; } @media (prefers-reduced-motion) { .base, .label, .icon { transition: none; } } @media (forced-colors: active) { .base, .label, .icon { transition: none; } :host(:not(:disabled)) .base { background-color: Menu; } :host(:not(:disabled)) .label, :host(:not(:disabled)) .icon { color: MenuText; } :host(:disabled) .label, :host(:disabled) .icon { color: GrayText; } }`,t([s(".elevation")],S.prototype,"_elevation",void 0),t([s(".focus-ring")],S.prototype,"_focusRing",void 0),t([s(".state-layer")],S.prototype,"_stateLayer",void 0),t([s(".ripple")],S.prototype,"_ripple",void 0),S=t([u("m3e-fab-menu-item")],S);let G=class extends(v(h(f(o,"menu")))){constructor(){super(...arguments),P.add(this),I.set(this,void 0),T.set(this,void 0),z.set(this,void 0),A.set(this,(new $).withWrap().withHomeAndEnd().withVerticalOrientation()),H.set(this,t=>e(this,P,"m",R).call(this,t)),j.set(this,t=>e(this,P,"m",U).call(this,t)),K.set(this,new g(this,{target:null,callback:()=>this.hide()})),X.set(this,t=>{"closed"===t.newState?(e(this,z,"f")?.call(this),i(this,z,void 0,"f")):setTimeout(()=>{e(this,A,"f").setActiveItem(e(this,A,"f").items.find(e=>!e.disabled))},40)}),this.variant="primary"}get isOpen(){return void 0!==e(this,T,"f")}async show(t){e(this,T,"f")&&e(this,T,"f")!==t&&this.hide(),e(this,z,"f")?.call(this),i(this,z,await C(this,t,{position:"top-end",inline:!0,shift:"main",flip:!0,offset:8},(e,t,i)=>{y(this,"-right",i.includes("end")),y(this,"-left",i.includes("start")),"rtl"===_.current?(this.style.right=window.innerWidth-e-this.clientWidth+"px",this.style.left=""):(this.style.left=`${e}px`,this.style.right=""),this.style.top=`${t}px`}),"f"),this.showPopover(),i(this,T,t,"f"),e(this,T,"f").ariaExpanded="true",e(this,K,"f").observe(e(this,T,"f")),e(this,P,"m",q).call(this)}hide(t=!1){e(this,z,"f")?.call(this),i(this,z,void 0,"f"),e(this,T,"f")&&(e(this,T,"f").ariaExpanded="false",t&&e(this,T,"f").focus(),e(this,P,"m",D).call(this),e(this,K,"f").unobserve(e(this,T,"f")),i(this,T,void 0,"f")),this.hidePopover()}async toggle(t){e(this,T,"f")?this.hide():await this.show(t)}connectedCallback(){super.connectedCallback(),this.tabIndex=-1,this.setAttribute("popover","manual"),this.addEventListener("keydown",e(this,H,"f")),this.addEventListener("toggle",e(this,X,"f")),document.addEventListener("click",e(this,j,"f"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("keydown",e(this,H,"f")),this.removeEventListener("toggle",e(this,X,"f")),document.removeEventListener("click",e(this,j,"f"))}render(){return a`<div class="base"><slot @slotchange="${e(this,P,"m",O)}"></slot></div>`}};I=new WeakMap,T=new WeakMap,z=new WeakMap,A=new WeakMap,H=new WeakMap,j=new WeakMap,K=new WeakMap,X=new WeakMap,P=new WeakSet,O=function(){const{added:t}=e(this,A,"f").setItems([...this.querySelectorAll("m3e-fab-menu-item")]);e(this,A,"f").activeItem||e(this,A,"f").updateActiveItem(t.find(e=>!e.disabled))},R=function(t){switch(t.key){case"Tab":this.hide();break;case"Escape":t.shiftKey||t.ctrlKey||this.hide(!0);break;default:e(this,A,"f").onKeyDown(t)}},U=function(t){t.composedPath().some(t=>t instanceof S||t===e(this,T,"f"))||this.hide()},q=function(){const t=e(this,T,"f")?.closest("m3e-fab");t&&(i(this,I,t.tabIndex,"f"),t.addEventListener("keydown",e(this,H,"f")),e(this,A,"f").setItems([...e(this,A,"f").items,t]))},D=function(){const t=e(this,T,"f")?.closest("m3e-fab");t&&(void 0!==e(this,I,"f")&&(t.tabIndex=e(this,I,"f")),t.removeEventListener("keydown",e(this,H,"f")),e(this,A,"f").setItems([...e(this,A,"f").items.filter(e=>e!==t)]))},G.styles=n`:host { position: absolute; flex-direction: column; row-gap: var(--m3e-fab-menu-spacing, 0.25rem); padding: unset; margin: unset; border: unset; overflow: visible; max-width: var(--m3e-fab-menu-max-width, 17.5rem); opacity: 0; background-color: transparent; display: none; } :host(:not(:state(-no-animate))) { transition: ${r(`opacity ${b.motion.spring.fastEffects}, \n        transform ${b.motion.spring.fastSpatial},\n        overlay ${b.motion.spring.fastEffects} allow-discrete,\n        display ${b.motion.spring.fastEffects} allow-discrete`)}; } .base { display: contents; } :host([variant="primary"]) .base { --_fab-menu-item-color: var(--m3e-primary-fab-color, ${b.color.onPrimaryContainer}); --_fab-menu-item-container-color: var(--m3e-primary-fab-container-color, ${b.color.primaryContainer}); --_fab-menu-background-hover-color: var(--m3e-primary-fab-hover-color, ${b.color.onPrimaryContainer}); --_fab-menu-background-focus-color: var(--m3e-primary-fab-focus-color, ${b.color.onPrimaryContainer}); --_fab-menu-ripple-color: var(--m3e-primary-fab-ripple-color, ${b.color.onPrimaryContainer}); } :host([variant="secondary"]) .base { --_fab-menu-item-color: var(--m3e-secondary-fab-color, ${b.color.onSecondaryContainer}); --_fab-menu-item-container-color: var( --m3e-secondary-fab-container-color, ${b.color.secondaryContainer} ); --_fab-menu-background-hover-color: var( --m3e-secondary-fab-hover-color, ${b.color.onSecondaryContainer} ); --_fab-menu-background-focus-color: var( --m3e-secondary-fab-focus-color, ${b.color.onSecondaryContainer} ); --_fab-menu-ripple-color: var(--m3e-secondary-fab-ripple-color, ${b.color.onSecondaryContainer}); } :host([variant="tertiary"]) .base { --_fab-menu-item-color: var(--m3e-tertiary-fab-color, ${b.color.onTertiaryContainer}); --_fab-menu-item-container-color: var(--m3e-tertiary-fab-container-color, ${b.color.tertiaryContainer}); --_fab-menu-background-hover-color: var(--m3e-tertiary-fab-hover-color, ${b.color.onTertiaryContainer}); --_fab-menu-background-focus-color: var(--m3e-tertiary-fab-focus-color, ${b.color.onTertiaryContainer}); --_fab-menu-ripple-color: var(--m3e-tertiary-fab-ripple-color, ${b.color.onTertiaryContainer}); } :host { transform: scaleX(0.8); } :host(:state(-left)) { align-items: flex-start; transform-origin: left; } :host(:state(-right)) { align-items: flex-end; transform-origin: right; } :host(:popover-open) { transform: scaleX(1); display: inline-flex; opacity: 1; } :host::backdrop { background-color: transparent; } @starting-style { :host(:popover-open) { opacity: 0; } :host(:popover-open) { transform: scaleX(0.8); } } @media (prefers-reduced-motion) { :host(:not(:state(-no-animate))) { transition: none; } } @media (forced-colors: active) { :host { border-radius: ${b.shape.corner.medium}; outline: 1px solid MenuText; background-color: Menu; } }`,t([l({reflect:!0})],G.prototype,"variant",void 0),G=t([u("m3e-fab-menu")],G);let V=class extends(k(w)){get menu(){return this.control instanceof G?this.control:null}attach(e){super.attach(e),this.parentElement&&e instanceof G&&(this.parentElement.ariaHasPopup="menu",this.parentElement.ariaExpanded="false",e.id&&x(this.parentElement,"aria-controls",e.id))}detach(){this.parentElement&&(this.parentElement.ariaHasPopup=null,this.parentElement.ariaExpanded=null,this.control?.id&&E(this.parentElement,"aria-controls",this.control.id)),super.detach()}_onClick(){this.parentElement&&this.menu?.toggle(this.parentElement)}};V=t([u("m3e-fab-menu-trigger")],V);export{G as M3eFabMenuElement,S as M3eFabMenuItemElement,V as M3eFabMenuTriggerElement};

package/dist/fab.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/fab.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 a}from"tslib";import{unsafeCSS as o,css as r,LitElement as t,html as l}from"lit";import{query as i,property as n}from"lit/decorators.js";import{DesignToken as c,KeyboardClick as s,LinkButton as v,FormSubmitter as b,Focusable as d,DisabledInteractive as m,Disabled as f,AttachInternals as y,Role as p,PressedController as h,renderPseudoLink as $,customElement as u}from"@m3e/web/core";const x=r`:host { display: inline-block; outline: none; 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%; transition: ${o(`background-color ${c.motion.duration.short4} ${c.motion.easing.standard}`)}; } .touch { position: absolute; height: 3rem; left: 0; right: 0; } .wrapper { width: 100%; overflow: hidden; display: inline-flex; align-items: center; } .label { justify-self: center; flex: 1 1 auto; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: ${o(`color ${c.motion.duration.short4} ${c.motion.easing.standard}`)}; } .icon { transition: ${o(`color ${c.motion.duration.short4} ${c.motion.easing.standard}`)}; } :host(:not(:disabled):not([disabled-interactive])) { cursor: pointer; } :host([disabled-interactive]) { cursor: not-allowed; } .close-icon, ::slotted(:not([slot])), ::slotted([slot="close-icon"]) { font-size: inherit !important; flex: none; } .close-icon, ::slotted(svg:not([slot])), ::slotted(svg[slot="close-icon"]) { width: 1em; height: 1em; } :host(:not([extended])) ::slotted([slot="label"]), .base.with-menu ::slotted([slot="label"]), .base:not(.with-menu) ::slotted([slot="close-icon"]), .base:not(.with-menu) .close-icon, :host([aria-expanded="true"]) .base.with-menu ::slotted(:not([slot])), :host([aria-expanded="false"]) .base.with-menu ::slotted([slot="close-icon"]), :host([aria-expanded="false"]) .base.with-menu .close-icon { display: none; } :host([aria-expanded="true"]) .base.with-menu { border-radius: var(--m3e-fab-menu-close-button-container-shape, ${c.shape.corner.full}); height: calc(var(--m3e-fab-menu-close-button-container-height, 3.5rem) + ${c.density.calc(-3)}); } :host([aria-expanded="true"]) .base.with-menu .wrapper { padding-inline-start: calc(var(--m3e-fab-menu-close-button-leading-space, 1rem) + ${c.density.calc(-3)}); padding-inline-end: calc(var(--m3e-fab-menu-close-button-trailing-space, 1rem) + ${c.density.calc(-3)}); } :host([aria-expanded="true"]) .base.with-menu .icon { font-size: calc(var(--m3e-fab-menu-close-button-icon-size, 1.5rem) + ${c.density.calc(-3)}); --m3e-icon-size: calc(var(--m3e-fab-menu-close-button-icon-size, 1.5rem) + ${c.density.calc(-3)}); } .base.with-menu { transition: height ${c.motion.spring.fastSpatial}; } .base.with-menu .wrapper { transition: padding ${c.motion.spring.fastSpatial}; } a { all: unset; display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 1; } @media (forced-colors: active) { .base, .icon { transition: none; } .base { outline-style: solid; } :host([variant]:not(:disabled):not([disabled-interactive])) .base { background-color: ButtonFace; outline-color: ButtonText; } :host([variant]:not(:disabled):not([disabled-interactive])) .label, :host([variant]:not(:disabled):not([disabled-interactive])) .icon { color: ButtonText; } :host([variant]:disabled) .base, :host([variant][disabled-interactive]) .base { outline-color: GrayText; background-color: unset; } :host([variant]:disabled) .label, :host([variant][disabled-interactive]) .label, :host([variant]:disabled) .icon, :host([variant][disabled-interactive]) .icon { color: GrayText; } :host([size="small"]) .base { outline-offset: calc(0px - var(--m3e-button-small-outline-thickness, 1px)); outline-width: var(--m3e-button-small-outline-thickness, 1px); } :host([size="medium"]) .base { outline-offset: calc(0px - var(--m3e-button-medium-outline-thickness, 1px)); outline-width: var(--m3e-button-medium-outline-thickness, 1px); } :host([size="large"]) .base { outline-offset: calc(0px - var(--m3e-button-large-outline-thickness, 2px)); outline-width: var(--m3e-button-large-outline-thickness, 2px); } } @media (prefers-reduced-motion) { .base, .base.resting, .base.pressed, .label, .icon { transition: none; } }`,C={small:{containerHeight:o(`calc(var(--m3e-fab-small-container-height, var(--m3e-fab-container-height, 3.5rem)) + ${c.density.calc(-3)})`),labelTextFontSize:o(`var(--m3e-fab-small-label-text-font-size, var(--m3e-fab-label-text-font-size, ${c.typescale.standard.title.medium.fontSize}))`),labelTextFontWeight:o(`var(--m3e-fab-small-label-text-font-weight, var(--m3e-fab-label-text-font-weight, ${c.typescale.standard.title.medium.fontWeight}))`),labelTextLineHeight:o(`var(--m3e-fab-small-label-text-line-height, var(--m3e-fab-label-text-line-height, ${c.typescale.standard.title.medium.lineHeight}))`),labelTextTracking:o(`var(--m3e-fab-small-label-text-tracking, var(--m3e-fab-label-text-tracking, ${c.typescale.standard.title.medium.tracking}))`),iconSize:o(`calc(var(--m3e-fab-small-icon-size, var(--m3e-fab-icon-size, 1.5rem)) + ${c.density.calc(-3)})`),extendedIconSize:o("var(--m3e-fab-small-icon-size, var(--m3e-fab-icon-size, 1.5rem))"),shape:o(`var(--m3e-fab-small-shape, var(--m3e-fab-shape, ${c.shape.corner.large}))`),leadingSpace:o(`calc(var(--m3e-fab-small-leading-space, var(--m3e-fab-leading-space, 1rem)) + ${c.density.calc(-3)})`),trailingSpace:o(`calc(var(--m3e-fab-small-trailing-space, var(--m3e-fab-trailing-space, 1rem)) + ${c.density.calc(-3)})`),iconLabelSpace:o("var(--m3e-fab-small-icon-label-space, var(--m3e-fab-icon-label-space, 0.5rem))"),extendedLeadingSpace:o("var(--m3e-fab-small-leading-space, var(--m3e-fab-leading-space, 1rem))"),extendedTrailingSpace:o("var(--m3e-fab-small-trailing-space, var(--m3e-fab-trailing-space, 1rem))")},medium:{containerHeight:o(`calc(var(--m3e-fab-medium-container-height, var(--m3e-fab-container-height, 5rem)) + ${c.density.calc(-3)})`),labelTextFontSize:o(`var(--m3e-fab-medium-label-text-font-size, var(--m3e-fab-label-text-font-size, ${c.typescale.standard.title.large.fontSize}))`),labelTextFontWeight:o(`var(--m3e-fab-medium-label-text-font-weight, var(--m3e-fab-label-text-font-weight, ${c.typescale.standard.title.large.fontWeight}))`),labelTextLineHeight:o(`var(--m3e-fab-medium-label-text-line-height, var(--m3e-fab-label-text-line-height, ${c.typescale.standard.title.large.lineHeight}))`),labelTextTracking:o(`var(--m3e-fab-medium-label-text-tracking, var(--m3e-fab-label-text-tracking, ${c.typescale.standard.title.large.tracking}))`),iconSize:o(`calc(var(--m3e-fab-medium-icon-size, var(--m3e-fab-icon-size, 1.75rem)) + ${c.density.calc(-3)})`),extendedIconSize:o("var(--m3e-fab-medium-icon-size, var(--m3e-fab-icon-size, 1.75rem))"),shape:o(`var(--m3e-fab-medium-shape, var(--m3e-fab-shape, ${c.shape.corner.largeIncreased}))`),leadingSpace:o(`calc(var(--m3e-fab-medium-leading-space, var(--m3e-fab-leading-space, 1.625rem)) + ${c.density.calc(-3)})`),trailingSpace:o(`calc(var(--m3e-fab-medium-trailing-space, var(--m3e-fab-trailing-space, 1.625rem)) + ${c.density.calc(-3)})`),iconLabelSpace:o("var(--m3e-fab-medium-icon-label-space, var(--m3e-fab-icon-label-space, 0.75rem))"),extendedLeadingSpace:o("var(--m3e-fab-medium-leading-space, var(--m3e-fab-leading-space, 1.625rem))"),extendedTrailingSpace:o("var(--m3e-fab-medium-trailing-space, var(--m3e-fab-trailing-space, 1.625rem))")},large:{containerHeight:o(`calc(var(--m3e-fab-large-container-height, var(--m3e-fab-container-height, 6rem)) + ${c.density.calc(-3)})`),labelTextFontSize:o(`var(--m3e-fab-large-label-text-font-size, var(--m3e-fab-label-text-font-size, ${c.typescale.standard.headline.small.fontSize}))`),labelTextFontWeight:o(`var(--m3e-fab-large-label-text-font-weight, var(--m3e-fab-label-text-font-weight, ${c.typescale.standard.headline.small.fontWeight}))`),labelTextLineHeight:o(`var(--m3e-fab-large-label-text-line-height, var(--m3e-fab-label-text-line-height, ${c.typescale.standard.headline.small.lineHeight}))`),labelTextTracking:o(`var(--m3e-fab-large-label-text-tracking, var(--m3e-fab-label-text-tracking, ${c.typescale.standard.headline.small.tracking}))`),iconSize:o(`calc(var(--m3e-fab-large-icon-size, var(--m3e-fab-icon-size, 2.25rem)) + ${c.density.calc(-3)})`),extendedIconSize:o("var(--m3e-fab-large-icon-size, var(--m3e-fab-icon-size, 2.25rem))"),shape:o(`var(--m3e-fab-large-shape, var(--m3e-fab-shape, ${c.shape.corner.extraLarge}))`),leadingSpace:o(`calc(var(--m3e-fab-large-leading-space, var(--m3e-fab-leading-space, 1.75rem)) + ${c.density.calc(-3)})`),trailingSpace:o(`calc(var(--m3e-fab-large-trailing-space, var(--m3e-fab-trailing-space, 1.75rem)) + ${c.density.calc(-3)})`),iconLabelSpace:o("var(--m3e-fab-large-icon-label-space, var(--m3e-fab-icon-label-space, 1rem))"),extendedLeadingSpace:o("var(--m3e-fab-large-leading-space, var(--m3e-fab-leading-space, 1.75rem))"),extendedTrailingSpace:o("var(--m3e-fab-large-trailing-space, var(--m3e-fab-trailing-space, 1.75rem))")}};function g(e){return r`:host([size="${o(e)}"]) .base { height: ${C[e].containerHeight}; } :host([size="${o(e)}"]) .base { border-radius: ${C[e].shape}; } :host([size="${o(e)}"]) .label { font-size: ${C[e].labelTextFontSize}; font-weight: ${C[e].labelTextFontWeight}; line-height: ${C[e].labelTextLineHeight}; letter-spacing: ${C[e].labelTextTracking}; } :host([size="${o(e)}"]:not([extended])) .wrapper { padding-inline-start: ${C[e].leadingSpace}; padding-inline-end: ${C[e].trailingSpace}; } :host([size="${o(e)}"]:not([extended])) .icon { font-size: ${C[e].iconSize}; --m3e-icon-size: ${C[e].iconSize}; } :host([size="${o(e)}"][extended]) .wrapper { padding-inline-start: ${C[e].extendedLeadingSpace}; padding-inline-end: ${C[e].extendedTrailingSpace}; column-gap: ${C[e].iconLabelSpace}; } :host([size="${o(e)}"][extended]) .icon { font-size: ${C[e].extendedIconSize}; --m3e-icon-size: ${C[e].extendedIconSize}; }`}const w=[g("small"),g("medium"),g("large")],S={primary:{labelTextColor:o(`var(--m3e-primary-fab-label-text-color, var(--m3e-fab-label-text-color, ${c.color.onPrimary}))`),iconColor:o(`var(--m3e-primary-fab-icon-color, var(--m3e-fab-icon-color, ${c.color.onPrimary}))`),containerColor:o(`var(--m3e-primary-fab-container-color, var(--m3e-fab-container-color, ${c.color.primary}))`),containerElevation:o(`var(--m3e-primary-fab-container-elevation, var(--m3e-fab-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-primary-fab-lowered-container-elevation, var(--m3e-fab-lowered-container-elevation, ${c.elevation.level2}))`),disabled:{containerColor:o(`var(--m3e-primary-fab-disabled-container-color, var(--m3e-fab-disabled-container-color, ${c.color.onSurface}))`),containerOpacity:o("var(--m3e-primary-fab-disabled-container-opacity, var(--m3e-fab-disabled-container-opacity, 10%))"),iconColor:o(`var(--m3e-primary-fab-disabled-icon-color, var(--m3e-fab-disabled-icon-color, ${c.color.onSurface}))`),iconOpacity:o("var(--m3e-primary-fab-disabled-icon-opacity, var(--m3e-fab-disabled-icon-opacity, 38%))"),labelTextColor:o(`var(--m3e-primary-fab-disabled-label-text-color, var(--m3e-fab-disabled-label-text-color, ${c.color.onSurface}))`),labelTextOpacity:o("var(--m3e-primary-fab-disabled-label-text-opacity, var(--m3e-fab-disabled-label-text-opacity, 38%))"),containerElevation:o(`var(--m3e-primary-fab-disabled-container-elevation, var(--m3e-fab-disabled-container-elevation, ${c.elevation.level0}))`),loweredContainerElevation:o(`var(--m3e-primary-fab-lowered-disabled-container-elevation, var(--m3e-fab-lowered-disabled-container-elevation, ${c.elevation.level0}))`)},hover:{iconColor:o(`var(--m3e-primary-fab-hover-icon-color, var(--m3e-fab-hover-icon-color, ${c.color.onPrimary}))`),labelTextColor:o(`var(--m3e-primary-fab-hover-label-text-color, var(--m3e-fab-hover-label-text-color, ${c.color.onPrimary}))`),stateLayerColor:o(`var(--m3e-primary-fab-hover-state-layer-color, var(--m3e-fab-hover-state-layer-color, ${c.color.onPrimary}))`),stateLayerOpacity:o(`var(--m3e-primary-fab-hover-state-layer-opacity, var(--m3e-fab-hover-state-layer-opacity, ${c.state.hoverStateLayerOpacity}))`),containerElevation:o(`var(--m3e-primary-fab-hover-container-elevation, var(--m3e-fab-hover-container-elevation, ${c.elevation.level4}))`),loweredContainerElevation:o(`var(--m3e-primary-fab-lowered-hover-container-elevation, var(--m3e-fab-lowered-hover-container-elevation, ${c.elevation.level3}))`)},focus:{iconColor:o(`var(--m3e-primary-fab-focus-icon-color, var(--m3e-fab-focus-icon-color, ${c.color.onPrimary}))`),labelTextColor:o(`var(--m3e-primary-fab-focus-label-text-color, var(--m3e-fab-focus-label-text-color, ${c.color.onPrimary}))`),stateLayerColor:o(`var(--m3e-primary-fab-focus-state-layer-color, var(--m3e-fab-focus-state-layer-color, ${c.color.onPrimary}))`),stateLayerOpacity:o(`var(--m3e-primary-fab-focus-state-layer-opacity, var(--m3e-fab-focus-state-layer-opacity, ${c.state.focusStateLayerOpacity}))`),containerElevation:o(`var(--m3e-primary-fab-focus-container-elevation, var(--m3e-fab-focus-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-primary-fab-lowered-focus-container-elevation, var(--m3e-fab-lowered-focus-container-elevation, ${c.elevation.level2}))`)},pressed:{iconColor:o(`var(--m3e-primary-fab-pressed-icon-color, var(--m3e-fab-pressed-icon-color, ${c.color.onPrimary}))`),labelTextColor:o(`var(--m3e-primary-fab-pressed-label-text-color, var(--m3e-fab-pressed-label-text-color, ${c.color.onPrimary}))`),stateLayerColor:o(`var(--m3e-primary-fab-pressed-state-layer-color, var(--m3e-fab-pressed-state-layer-color, ${c.color.onPrimary}))`),stateLayerOpacity:o(`var(--m3e-primary-fab-pressed-state-layer-opacity, var(--m3e-fab-pressed-state-layer-opacity, ${c.state.pressedStateLayerOpacity}))`),containerElevation:o(`var(--m3e-primary-fab-pressed-container-elevation, var(--m3e-fab-pressed-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-primary-fab-lowered-pressed-container-elevation, var(--m3e-fab-lowered-pressed-container-elevation, ${c.elevation.level2}))`)}},secondary:{labelTextColor:o(`var(--m3e-secondary-fab-label-text-color, var(--m3e-fab-label-text-color, ${c.color.onSecondary}))`),iconColor:o(`var(--m3e-secondary-fab-icon-color, var(--m3e-fab-icon-color, ${c.color.onSecondary}))`),containerColor:o(`var(--m3e-secondary-fab-container-color, var(--m3e-fab-container-color, ${c.color.secondary}))`),containerElevation:o(`var(--m3e-secondary-fab-container-elevation, var(--m3e-fab-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-secondary-fab-lowered-container-elevation, var(--m3e-fab-lowered-container-elevation, ${c.elevation.level2}))`),disabled:{containerColor:o(`var(--m3e-secondary-fab-disabled-container-color, var(--m3e-fab-disabled-container-color, ${c.color.onSurface}))`),containerOpacity:o("var(--m3e-secondary-fab-disabled-container-opacity, var(--m3e-fab-disabled-container-opacity, 10%))"),iconColor:o(`var(--m3e-secondary-fab-disabled-icon-color, var(--m3e-fab-disabled-icon-color, ${c.color.onSurface}))`),iconOpacity:o("var(--m3e-secondary-fab-disabled-icon-opacity, var(--m3e-fab-disabled-icon-opacity, 38%))"),labelTextColor:o(`var(--m3e-secondary-fab-disabled-label-text-color, var(--m3e-fab-disabled-label-text-color, ${c.color.onSurface}))`),labelTextOpacity:o("var(--m3e-secondary-fab-disabled-label-text-opacity, var(--m3e-fab-disabled-label-text-opacity, 38%))"),containerElevation:o(`var(--m3e-secondary-fab-disabled-container-elevation, var(--m3e-fab-disabled-container-elevation, ${c.elevation.level0}))`),loweredContainerElevation:o(`var(--m3e-secondary-fab-lowered-disabled-container-elevation, var(--m3e-fab-lowered-disabled-container-elevation, ${c.elevation.level0}))`)},hover:{iconColor:o(`var(--m3e-secondary-fab-hover-icon-color, var(--m3e-fab-hover-icon-color, ${c.color.onSecondary}))`),labelTextColor:o(`var(--m3e-secondary-fab-hover-label-text-color, var(--m3e-fab-hover-label-text-color, ${c.color.onSecondary}))`),stateLayerColor:o(`var(--m3e-secondary-fab-hover-state-layer-color, var(--m3e-fab-hover-state-layer-color, ${c.color.onSecondary}))`),stateLayerOpacity:o(`var(--m3e-secondary-fab-hover-state-layer-opacity, var(--m3e-fab-hover-state-layer-opacity, ${c.state.hoverStateLayerOpacity}))`),containerElevation:o(`var(--m3e-secondary-fab-hover-container-elevation, var(--m3e-fab-hover-container-elevation, ${c.elevation.level4}))`),loweredContainerElevation:o(`var(--m3e-secondary-fab-lowered-hover-container-elevation, var(--m3e-fab-lowered-hover-container-elevation, ${c.elevation.level3}))`)},focus:{iconColor:o(`var(--m3e-secondary-fab-focus-icon-color, var(--m3e-fab-focus-icon-color, ${c.color.onSecondary}))`),labelTextColor:o(`var(--m3e-secondary-fab-focus-label-text-color, var(--m3e-fab-focus-label-text-color, ${c.color.onSecondary}))`),stateLayerColor:o(`var(--m3e-secondary-fab-focus-state-layer-color, var(--m3e-fab-focus-state-layer-color, ${c.color.onSecondary}))`),stateLayerOpacity:o(`var(--m3e-secondary-fab-focus-state-layer-opacity, var(--m3e-fab-focus-state-layer-opacity, ${c.state.focusStateLayerOpacity}))`),containerElevation:o(`var(--m3e-secondary-fab-focus-container-elevation, var(--m3e-fab-focus-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-secondary-fab-lowered-focus-container-elevation, var(--m3e-fab-lowered-focus-container-elevation, ${c.elevation.level2}))`)},pressed:{iconColor:o(`var(--m3e-secondary-fab-pressed-icon-color, var(--m3e-fab-pressed-icon-color, ${c.color.onSecondary}))`),labelTextColor:o(`var(--m3e-secondary-fab-pressed-label-text-color, var(--m3e-fab-pressed-label-text-color, ${c.color.onSecondary}))`),stateLayerColor:o(`var(--m3e-secondary-fab-pressed-state-layer-color, var(--m3e-fab-pressed-state-layer-color, ${c.color.onSecondary}))`),stateLayerOpacity:o(`var(--m3e-secondary-fab-pressed-state-layer-opacity, var(--m3e-fab-pressed-state-layer-opacity, ${c.state.pressedStateLayerOpacity}))`),containerElevation:o(`var(--m3e-secondary-fab-pressed-container-elevation, var(--m3e-fab-pressed-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-secondary-fab-lowered-pressed-container-elevation, var(--m3e-fab-lowered-pressed-container-elevation, ${c.elevation.level2}))`)}},tertiary:{labelTextColor:o(`var(--m3e-tertiary-fab-label-text-color, var(--m3e-fab-label-text-color, ${c.color.onTertiary}))`),iconColor:o(`var(--m3e-tertiary-fab-icon-color, var(--m3e-fab-icon-color, ${c.color.onTertiary}))`),containerColor:o(`var(--m3e-tertiary-fab-container-color, var(--m3e-fab-container-color, ${c.color.tertiary}))`),containerElevation:o(`var(--m3e-tertiary-fab-container-elevation, var(--m3e-fab-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-tertiary-fab-lowered-container-elevation, var(--m3e-fab-lowered-container-elevation, ${c.elevation.level2}))`),disabled:{containerColor:o(`var(--m3e-tertiary-fab-disabled-container-color, var(--m3e-fab-disabled-container-color, ${c.color.onSurface}))`),containerOpacity:o("var(--m3e-tertiary-fab-disabled-container-opacity, var(--m3e-fab-disabled-container-opacity, 10%))"),iconColor:o(`var(--m3e-tertiary-fab-disabled-icon-color, var(--m3e-fab-disabled-icon-color, ${c.color.onSurface}))`),iconOpacity:o("var(--m3e-tertiary-fab-disabled-icon-opacity, var(--m3e-fab-disabled-icon-opacity, 38%))"),labelTextColor:o(`var(--m3e-tertiary-fab-disabled-label-text-color, var(--m3e-fab-disabled-label-text-color, ${c.color.onSurface}))`),labelTextOpacity:o("var(--m3e-tertiary-fab-disabled-label-text-opacity, var(--m3e-fab-disabled-label-text-opacity, 38%))"),containerElevation:o(`var(--m3e-tertiary-fab-disabled-container-elevation, var(--m3e-fab-disabled-container-elevation, ${c.elevation.level0}))`),loweredContainerElevation:o(`var(--m3e-tertiary-fab-lowered-disabled-container-elevation, var(--m3e-fab-lowered-disabled-container-elevation, ${c.elevation.level0}))`)},hover:{iconColor:o(`var(--m3e-tertiary-fab-hover-icon-color, var(--m3e-fab-hover-icon-color, ${c.color.onTertiary}))`),labelTextColor:o(`var(--m3e-tertiary-fab-hover-label-text-color, var(--m3e-fab-hover-label-text-color, ${c.color.onTertiary}))`),stateLayerColor:o(`var(--m3e-tertiary-fab-hover-state-layer-color, var(--m3e-fab-hover-state-layer-color, ${c.color.onTertiary}))`),stateLayerOpacity:o(`var(--m3e-tertiary-fab-hover-state-layer-opacity, var(--m3e-fab-hover-state-layer-opacity, ${c.state.hoverStateLayerOpacity}))`),containerElevation:o(`var(--m3e-tertiary-fab-hover-container-elevation, var(--m3e-fab-hover-container-elevation, ${c.elevation.level4}))`),loweredContainerElevation:o(`var(--m3e-tertiary-fab-lowered-hover-container-elevation, var(--m3e-fab-lowered-hover-container-elevation, ${c.elevation.level3}))`)},focus:{iconColor:o(`var(--m3e-tertiary-fab-focus-icon-color, var(--m3e-fab-focus-icon-color, ${c.color.onTertiary}))`),labelTextColor:o(`var(--m3e-tertiary-fab-focus-label-text-color, var(--m3e-fab-focus-label-text-color, ${c.color.onTertiary}))`),stateLayerColor:o(`var(--m3e-tertiary-fab-focus-state-layer-color, var(--m3e-fab-focus-state-layer-color, ${c.color.onTertiary}))`),stateLayerOpacity:o(`var(--m3e-tertiary-fab-focus-state-layer-opacity, var(--m3e-fab-focus-state-layer-opacity, ${c.state.focusStateLayerOpacity}))`),containerElevation:o(`var(--m3e-tertiary-fab-focus-container-elevation, var(--m3e-fab-focus-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-tertiary-fab-lowered-focus-container-elevation, var(--m3e-fab-lowered-focus-container-elevation, ${c.elevation.level2}))`)},pressed:{iconColor:o(`var(--m3e-tertiary-fab-pressed-icon-color, var(--m3e-fab-pressed-icon-color, ${c.color.onTertiary}))`),labelTextColor:o(`var(--m3e-tertiary-fab-pressed-label-text-color, var(--m3e-fab-pressed-label-text-color, ${c.color.onTertiary}))`),stateLayerColor:o(`var(--m3e-tertiary-fab-pressed-state-layer-color, var(--m3e-fab-pressed-state-layer-color, ${c.color.onTertiary}))`),stateLayerOpacity:o(`var(--m3e-tertiary-fab-pressed-state-layer-opacity, var(--m3e-fab-pressed-state-layer-opacity, ${c.state.pressedStateLayerOpacity}))`),containerElevation:o(`var(--m3e-tertiary-fab-pressed-container-elevation, var(--m3e-fab-pressed-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-tertiary-fab-lowered-pressed-container-elevation, var(--m3e-fab-lowered-pressed-container-elevation, ${c.elevation.level2}))`)}},"primary-container":{labelTextColor:o(`var(--m3e-primary-container-fab-label-text-color, var(--m3e-primary-container-fab-label-text-color, ${c.color.onPrimaryContainer}))`),iconColor:o(`var(--m3e-primary-container-fab-icon-color, var(--m3e-primary-container-fab-icon-color, ${c.color.onPrimaryContainer}))`),containerColor:o(`var(--m3e-primary-container-fab-container-color, var(--m3e-fab-container-color, ${c.color.primaryContainer}))`),containerElevation:o(`var(--m3e-primary-container-fab-container-elevation, var(--m3e-fab-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-primary-container-fab-lowered-container-elevation, var(--m3e-fab-lowered-container-elevation, ${c.elevation.level2}))`),disabled:{containerColor:o(`var(--m3e-primary-container-fab-disabled-container-color, var(--m3e-fab-disabled-container-color, ${c.color.onSurface}))`),containerOpacity:o("var(--m3e-primary-container-fab-disabled-container-opacity, var(--m3e-fab-disabled-container-opacity, 10%))"),iconColor:o(`var(--m3e-primary-container-fab-disabled-icon-color, var(--m3e-fab-disabled-icon-color, ${c.color.onSurface}))`),iconOpacity:o("var(--m3e-primary-container-fab-disabled-icon-opacity, var(--m3e-fab-disabled-icon-opacity, 38%))"),labelTextColor:o(`var(--m3e-primary-container-fab-disabled-label-text-color, var(--m3e-fab-disabled-label-text-color, ${c.color.onSurface}))`),labelTextOpacity:o("var(--m3e-primary-container-fab-disabled-label-text-opacity, var(--m3e-fab-disabled-label-text-opacity, 38%))"),containerElevation:o(`var(--m3e-primary-container-fab-disabled-container-elevation, var(--m3e-fab-disabled-container-elevation, ${c.elevation.level0}))`),loweredContainerElevation:o(`var(--m3e-primary-container-fab-lowered-disabled-container-elevation, var(--m3e-fab-lowered-disabled-container-elevation, ${c.elevation.level0}))`)},hover:{iconColor:o(`var(--m3e-primary-container-fab-hover-icon-color, var(--m3e-fab-hover-icon-color, ${c.color.onPrimaryContainer}))`),labelTextColor:o(`var(--m3e-primary-container-fab-hover-label-text-color, var(--m3e-fab-hover-label-text-color, ${c.color.onPrimaryContainer}))`),stateLayerColor:o(`var(--m3e-primary-container-fab-hover-state-layer-color, var(--m3e-fab-hover-state-layer-color, ${c.color.onPrimaryContainer}))`),stateLayerOpacity:o(`var(--m3e-primary-container-fab-hover-state-layer-opacity, var(--m3e-fab-hover-state-layer-opacity, ${c.state.hoverStateLayerOpacity}))`),containerElevation:o(`var(--m3e-primary-container-fab-hover-container-elevation, var(--m3e-fab-hover-container-elevation, ${c.elevation.level4}))`),loweredContainerElevation:o(`var(--m3e-primary-container-fab-lowered-hover-container-elevation, var(--m3e-fab-lowered-hover-container-elevation, ${c.elevation.level3}))`)},focus:{iconColor:o(`var(--m3e-primary-container-fab-focus-icon-color, var(--m3e-fab-focus-icon-color, ${c.color.onPrimaryContainer}))`),labelTextColor:o(`var(--m3e-primary-container-fab-focus-label-text-color, var(--m3e-fab-focus-label-text-color, ${c.color.onPrimaryContainer}))`),stateLayerColor:o(`var(--m3e-primary-container-fab-focus-state-layer-color, var(--m3e-fab-focus-state-layer-color, ${c.color.onPrimaryContainer}))`),stateLayerOpacity:o(`var(--m3e-primary-container-fab-focus-state-layer-opacity, var(--m3e-fab-focus-state-layer-opacity, ${c.state.focusStateLayerOpacity}))`),containerElevation:o(`var(--m3e-primary-container-fab-focus-container-elevation, var(--m3e-fab-focus-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-primary-container-fab-lowered-focus-container-elevation, var(--m3e-fab-lowered-focus-container-elevation, ${c.elevation.level2}))`)},pressed:{iconColor:o(`var(--m3e-primary-container-fab-pressed-icon-color, var(--m3e-fab-pressed-icon-color, ${c.color.onPrimaryContainer}))`),labelTextColor:o(`var(--m3e-primary-container-fab-pressed-label-text-color, var(--m3e-fab-pressed-label-text-color, ${c.color.onPrimaryContainer}))`),stateLayerColor:o(`var(--m3e-primary-container-fab-pressed-state-layer-color, var(--m3e-fab-pressed-state-layer-color, ${c.color.onPrimaryContainer}))`),stateLayerOpacity:o(`var(--m3e-primary-container-fab-pressed-state-layer-opacity, var(--m3e-fab-pressed-state-layer-opacity, ${c.state.pressedStateLayerOpacity}))`),containerElevation:o(`var(--m3e-primary-container-fab-pressed-container-elevation, var(--m3e-fab-pressed-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-primary-container-fab-lowered-pressed-container-elevation, var(--m3e-fab-lowered-pressed-container-elevation, ${c.elevation.level2}))`)}},"secondary-container":{labelTextColor:o(`var(--m3e-secondary-container-fab-label-text-color, var(--m3e-fab-label-text-color, ${c.color.onSecondaryContainer}))`),iconColor:o(`var(--m3e-secondary-container-fab-icon-color, var(--m3e-fab-icon-color, ${c.color.onSecondaryContainer}))`),containerColor:o(`var(--m3e-secondary-container-fab-container-color, var(--m3e-fab-container-color, ${c.color.secondaryContainer}))`),containerElevation:o(`var(--m3e-secondary-container-fab-container-elevation, var(--m3e-fab-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-secondary-container-fab-lowered-container-elevation, var(--m3e-fab-lowered-container-elevation, ${c.elevation.level2}))`),disabled:{containerColor:o(`var(--m3e-secondary-container-fab-disabled-container-color, var(--m3e-fab-disabled-container-color, ${c.color.onSurface}))`),containerOpacity:o("var(--m3e-secondary-container-fab-disabled-container-opacity, var(--m3e-fab-disabled-container-opacity, 10%))"),iconColor:o(`var(--m3e-secondary-container-fab-disabled-icon-color, var(--m3e-fab-disabled-icon-color, ${c.color.onSurface}))`),iconOpacity:o("var(--m3e-secondary-container-fab-disabled-icon-opacity, var(--m3e-fab-disabled-icon-opacity, 38%))"),labelTextColor:o(`var(--m3e-secondary-container-fab-disabled-label-text-color, var(--m3e-fab-disabled-label-text-color, ${c.color.onSurface}))`),labelTextOpacity:o("var(--m3e-secondary-container-fab-disabled-label-text-opacity, var(--m3e-fab-disabled-label-text-opacity, 38%))"),containerElevation:o(`var(--m3e-secondary-container-fab-disabled-container-elevation, var(--m3e-fab-disabled-container-elevation, ${c.elevation.level0}))`),loweredContainerElevation:o(`var(--m3e-secondary-container-fab-lowered-disabled-container-elevation, var(--m3e-fab-lowered-disabled-container-elevation, ${c.elevation.level0}))`)},hover:{iconColor:o(`var(--m3e-secondary-container-fab-hover-icon-color, var(--m3e-fab-hover-icon-color, ${c.color.onSecondaryContainer}))`),labelTextColor:o(`var(--m3e-secondary-container-fab-hover-label-text-color, var(--m3e-fab-hover-label-text-color, ${c.color.onSecondaryContainer}))`),stateLayerColor:o(`var(--m3e-secondary-container-fab-hover-state-layer-color, var(--m3e-fab-hover-state-layer-color, ${c.color.onSecondaryContainer}))`),stateLayerOpacity:o(`var(--m3e-secondary-container-fab-hover-state-layer-opacity, var(--m3e-fab-hover-state-layer-opacity, ${c.state.hoverStateLayerOpacity}))`),containerElevation:o(`var(--m3e-secondary-container-fab-hover-container-elevation, var(--m3e-fab-hover-container-elevation, ${c.elevation.level4}))`),loweredContainerElevation:o(`var(--m3e-secondary-container-fab-lowered-hover-container-elevation, var(--m3e-fab-lowered-hover-container-elevation, ${c.elevation.level3}))`)},focus:{iconColor:o(`var(--m3e-secondary-container-fab-focus-icon-color, var(--m3e-fab-focus-icon-color, ${c.color.onSecondaryContainer}))`),labelTextColor:o(`var(--m3e-secondary-container-fab-focus-label-text-color, var(--m3e-fab-focus-label-text-color, ${c.color.onSecondaryContainer}))`),stateLayerColor:o(`var(--m3e-secondary-container-fab-focus-state-layer-color, var(--m3e-fab-focus-state-layer-color, ${c.color.onSecondaryContainer}))`),stateLayerOpacity:o(`var(--m3e-secondary-container-fab-focus-state-layer-opacity, var(--m3e-fab-focus-state-layer-opacity, ${c.state.focusStateLayerOpacity}))`),containerElevation:o(`var(--m3e-secondary-container-fab-focus-container-elevation, var(--m3e-fab-focus-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-secondary-container-fab-lowered-focus-container-elevation, var(--m3e-fab-lowered-focus-container-elevation, ${c.elevation.level2}))`)},pressed:{iconColor:o(`var(--m3e-secondary-container-fab-pressed-icon-color, var(--m3e-fab-pressed-icon-color, ${c.color.onSecondaryContainer}))`),labelTextColor:o(`var(--m3e-secondary-container-fab-pressed-label-text-color, var(--m3e-fab-pressed-label-text-color, ${c.color.onSecondaryContainer}))`),stateLayerColor:o(`var(--m3e-secondary-container-fab-pressed-state-layer-color, var(--m3e-fab-pressed-state-layer-color, ${c.color.onSecondaryContainer}))`),stateLayerOpacity:o(`var(--m3e-secondary-container-fab-pressed-state-layer-opacity, var(--m3e-fab-pressed-state-layer-opacity, ${c.state.pressedStateLayerOpacity}))`),containerElevation:o(`var(--m3e-secondary-container-fab-pressed-container-elevation, var(--m3e-fab-pressed-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-secondary-container-fab-lowered-pressed-container-elevation, var(--m3e-fab-lowered-pressed-container-elevation, ${c.elevation.level2}))`)}},"tertiary-container":{labelTextColor:o(`var(--m3e-tertiary-container-fab-label-text-color, var(--m3e-fab-label-text-color, ${c.color.onTertiaryContainer}))`),iconColor:o(`var(--m3e-tertiary-container-fab-icon-color, var(--m3e-fab-icon-color, ${c.color.onTertiaryContainer}))`),containerColor:o(`var(--m3e-tertiary-container-fab-container-color, var(--m3e-fab-container-color, ${c.color.tertiaryContainer}))`),containerElevation:o(`var(--m3e-tertiary-container-fab-container-elevation, var(--m3e-fab-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-tertiary-container-fab-lowered-container-elevation, var(--m3e-fab-lowered-container-elevation, ${c.elevation.level2}))`),disabled:{containerColor:o(`var(--m3e-tertiary-container-fab-disabled-container-color, var(--m3e-fab-disabled-container-color, ${c.color.onSurface}))`),containerOpacity:o("var(--m3e-tertiary-container-fab-disabled-container-opacity, var(--m3e-fab-disabled-container-opacity, 10%))"),iconColor:o(`var(--m3e-tertiary-container-fab-disabled-icon-color, var(--m3e-fab-disabled-icon-color, ${c.color.onSurface}))`),iconOpacity:o("var(--m3e-tertiary-container-fab-disabled-icon-opacity, var(--m3e-fab-disabled-icon-opacity, 38%))"),labelTextColor:o(`var(--m3e-tertiary-container-fab-disabled-label-text-color, var(--m3e-fab-disabled-label-text-color, ${c.color.onSurface}))`),labelTextOpacity:o("var(--m3e-tertiary-container-fab-disabled-label-text-opacity, var(--m3e-fab-disabled-label-text-opacity, 38%))"),containerElevation:o(`var(--m3e-tertiary-container-fab-disabled-container-elevation, var(--m3e-fab-disabled-container-elevation, ${c.elevation.level0}))`),loweredContainerElevation:o(`var(--m3e-tertiary-container-fab-lowered-disabled-container-elevation, var(--m3e-fab-lowered-disabled-container-elevation, ${c.elevation.level0}))`)},hover:{iconColor:o(`var(--m3e-tertiary-container-fab-hover-icon-color, var(--m3e-fab-hover-icon-color, ${c.color.onTertiaryContainer}))`),labelTextColor:o(`var(--m3e-tertiary-container-fab-hover-label-text-color, var(--m3e-fab-hover-label-text-color, ${c.color.onTertiaryContainer}))`),stateLayerColor:o(`var(--m3e-tertiary-container-fab-hover-state-layer-color, var(--m3e-fab-hover-state-layer-color, ${c.color.onTertiaryContainer}))`),stateLayerOpacity:o(`var(--m3e-tertiary-container-fab-hover-state-layer-opacity, var(--m3e-fab-hover-state-layer-opacity, ${c.state.hoverStateLayerOpacity}))`),containerElevation:o(`var(--m3e-tertiary-container-fab-hover-container-elevation, var(--m3e-fab-hover-container-elevation, ${c.elevation.level4}))`),loweredContainerElevation:o(`var(--m3e-tertiary-container-fab-lowered-hover-container-elevation, var(--m3e-fab-lowered-hover-container-elevation, ${c.elevation.level3}))`)},focus:{iconColor:o(`var(--m3e-tertiary-container-fab-focus-icon-color, var(--m3e-fab-focus-icon-color, ${c.color.onTertiaryContainer}))`),labelTextColor:o(`var(--m3e-tertiary-container-fab-focus-label-text-color, var(--m3e-fab-focus-label-text-color, ${c.color.onTertiaryContainer}))`),stateLayerColor:o(`var(--m3e-tertiary-container-fab-focus-state-layer-color, var(--m3e-fab-focus-state-layer-color, ${c.color.onTertiaryContainer}))`),stateLayerOpacity:o(`var(--m3e-tertiary-container-fab-focus-state-layer-opacity, var(--m3e-fab-focus-state-layer-opacity, ${c.state.focusStateLayerOpacity}))`),containerElevation:o(`var(--m3e-tertiary-container-fab-focus-container-elevation, var(--m3e-fab-focus-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-tertiary-container-fab-lowered-focus-container-elevation, var(--m3e-fab-lowered-focus-container-elevation, ${c.elevation.level2}))`)},pressed:{iconColor:o(`var(--m3e-tertiary-container-fab-pressed-icon-color, var(--m3e-fab-pressed-icon-color, ${c.color.onTertiaryContainer}))`),labelTextColor:o(`var(--m3e-tertiary-container-fab-pressed-label-text-color, var(--m3e-fab-pressed-label-text-color, ${c.color.onTertiaryContainer}))`),stateLayerColor:o(`var(--m3e-tertiary-container-fab-pressed-state-layer-color, var(--m3e-fab-pressed-state-layer-color, ${c.color.onTertiaryContainer}))`),stateLayerOpacity:o(`var(--m3e-tertiary-container-fab-pressed-state-layer-opacity, var(--m3e-fab-pressed-state-layer-opacity, ${c.state.pressedStateLayerOpacity}))`),containerElevation:o(`var(--m3e-tertiary-container-fab-pressed-container-elevation, var(--m3e-fab-pressed-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-tertiary-container-fab-lowered-pressed-container-elevation, var(--m3e-fab-lowered-pressed-container-elevation, ${c.elevation.level2}))`)}},surface:{labelTextColor:o(`var(--m3e-surface-fab-label-text-color, var(--m3e-fab-label-text-color, ${c.color.primary}))`),iconColor:o(`var(--m3e-surface-fab-icon-color, var(--m3e-fab-icon-color, ${c.color.primary}))`),containerColor:o(`var(--m3e-surface-fab-container-color, var(--m3e-fab-container-color, ${c.color.surfaceContainerHigh}))`),containerElevation:o(`var(--m3e-surface-fab-container-elevation, var(--m3e-fab-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-surface-fab-lowered-container-elevation, var(--m3e-fab-lowered-container-elevation, ${c.elevation.level2}))`),loweredContainerColor:o(`var(--m3e-surface-fab-lowered-container-color, var(--m3e-fab-lowered-container-color, ${c.color.surfaceContainerLow}))`),disabled:{containerColor:o(`var(--m3e-surface-fab-disabled-container-color, var(--m3e-fab-disabled-container-color, ${c.color.onSurface}))`),containerOpacity:o("var(--m3e-surface-fab-disabled-container-opacity, var(--m3e-fab-disabled-container-opacity, 10%))"),iconColor:o(`var(--m3e-surface-fab-disabled-icon-color, var(--m3e-fab-disabled-icon-color, ${c.color.onSurface}))`),iconOpacity:o("var(--m3e-surface-fab-disabled-icon-opacity, var(--m3e-fab-disabled-icon-opacity, 38%))"),labelTextColor:o(`var(--m3e-surface-fab-disabled-label-text-color, var(--m3e-fab-disabled-label-text-color, ${c.color.onSurface}))`),labelTextOpacity:o("var(--m3e-surface-fab-disabled-label-text-opacity, var(--m3e-fab-disabled-label-text-opacity, 38%))"),containerElevation:o(`var(--m3e-surface-fab-disabled-container-elevation, var(--m3e-fab-disabled-container-elevation, ${c.elevation.level0}))`),loweredContainerElevation:o(`var(--m3e-surface-fab-lowered-disabled-container-elevation, var(--m3e-fab-lowered-disabled-container-elevation, ${c.elevation.level0}))`)},hover:{iconColor:o(`var(--m3e-surface-fab-hover-icon-color, var(--m3e-fab-hover-icon-color, ${c.color.primary}))`),labelTextColor:o(`var(--m3e-surface-fab-hover-label-text-color, var(--m3e-fab-hover-label-text-color, ${c.color.primary}))`),stateLayerColor:o(`var(--m3e-surface-fab-hover-state-layer-color, var(--m3e-fab-hover-state-layer-color, ${c.color.primary}))`),stateLayerOpacity:o(`var(--m3e-surface-fab-hover-state-layer-opacity, var(--m3e-fab-hover-state-layer-opacity, ${c.state.hoverStateLayerOpacity}))`),containerElevation:o(`var(--m3e-surface-fab-hover-container-elevation, var(--m3e-fab-hover-container-elevation, ${c.elevation.level4}))`),loweredContainerElevation:o(`var(--m3e-surface-fab-lowered-hover-container-elevation, var(--m3e-fab-lowered-hover-container-elevation, ${c.elevation.level3}))`)},focus:{iconColor:o(`var(--m3e-surface-fab-focus-icon-color, var(--m3e-fab-focus-icon-color, ${c.color.primary}))`),labelTextColor:o(`var(--m3e-surface-fab-focus-label-text-color, var(--m3e-fab-focus-label-text-color, ${c.color.primary}))`),stateLayerColor:o(`var(--m3e-surface-fab-focus-state-layer-color, var(--m3e-fab-focus-state-layer-color, ${c.color.primary}))`),stateLayerOpacity:o(`var(--m3e-surface-fab-focus-state-layer-opacity, var(--m3e-fab-focus-state-layer-opacity, ${c.state.focusStateLayerOpacity}))`),containerElevation:o(`var(--m3e-surface-fab-focus-container-elevation, var(--m3e-fab-focus-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-surface-fab-lowered-focus-container-elevation, var(--m3e-fab-lowered-focus-container-elevation, ${c.elevation.level2}))`)},pressed:{iconColor:o(`var(--m3e-surface-fab-pressed-icon-color, var(--m3e-fab-pressed-icon-color, ${c.color.primary}))`),labelTextColor:o(`var(--m3e-surface-fab-pressed-label-text-color, var(--m3e-fab-pressed-label-text-color, ${c.color.primary}))`),stateLayerColor:o(`var(--m3e-surface-fab-pressed-state-layer-color, var(--m3e-fab-pressed-state-layer-color, ${c.color.primary}))`),stateLayerOpacity:o(`var(--m3e-surface-fab-pressed-state-layer-opacity, var(--m3e-fab-pressed-state-layer-opacity, ${c.state.pressedStateLayerOpacity}))`),containerElevation:o(`var(--m3e-surface-fab-pressed-container-elevation, var(--m3e-fab-pressed-container-elevation, ${c.elevation.level3}))`),loweredContainerElevation:o(`var(--m3e-surface-fab-lowered-pressed-container-elevation, var(--m3e-fab-lowered-pressed-container-elevation, ${c.elevation.level2}))`)}}};function T(e){return r`:host([variant="${o(e)}"]:not([lowered])) .base { background-color: ${S[e].containerColor}; --m3e-elevation-level: ${S[e].containerElevation}; --m3e-elevation-hover-level: ${S[e].hover.containerElevation}; --m3e-elevation-focus-level: ${S[e].focus.containerElevation}; --m3e-elevation-pressed-level: ${S[e].pressed.containerElevation}; } :host([variant="${o(e)}"][lowered]) .base { background-color: ${S[e].loweredContainerColor??S[e].containerColor}; --m3e-elevation-level: ${S[e].loweredContainerElevation}; --m3e-elevation-hover-level: ${S[e].hover.loweredContainerElevation}; --m3e-elevation-focus-level: ${S[e].focus.loweredContainerElevation}; --m3e-elevation-pressed-level: ${S[e].pressed.loweredContainerElevation}; } :host([variant="${o(e)}"]) .base { --m3e-state-layer-hover-color: ${S[e].hover.stateLayerColor}; --m3e-state-layer-hover-opacity: ${S[e].hover.stateLayerOpacity}; --m3e-state-layer-focus-color: ${S[e].focus.stateLayerColor}; --m3e-state-layer-focus-opacity: ${S[e].focus.stateLayerOpacity}; --m3e-ripple-color: ${S[e].pressed.stateLayerColor}; --m3e-ripple-opacity: ${S[e].pressed.stateLayerOpacity}; } :host([variant="${o(e)}"]) .label { color: ${S[e].labelTextColor}; } :host([variant="${o(e)}"]:focus) .label { color: ${S[e].focus.labelTextColor}; } :host([variant="${o(e)}"]:hover) .label { color: ${S[e].hover.labelTextColor}; } :host([variant="${o(e)}"]) .base.pressed .label { color: ${S[e].pressed.labelTextColor}; } :host([variant="${o(e)}"]) .icon { color: ${S[e].iconColor}; } :host([variant="${o(e)}"]:focus) .icon { color: ${S[e].focus.iconColor}; } :host([variant="${o(e)}"]:hover) .icon { color: ${S[e].hover.iconColor}; } :host([variant="${o(e)}"]) .base.pressed .icon { color: ${S[e].pressed.iconColor}; } :host([variant="${o(e)}"]:disabled) .base, :host([variant="${o(e)}"][disabled-interactive]) .base { --m3e-elevation-level: ${S[e].disabled.containerElevation}; background-color: color-mix( in srgb, ${S[e].disabled.containerColor} ${S[e].disabled.containerOpacity}, transparent ); } :host([variant="${o(e)}"]:disabled) .label, :host([variant="${o(e)}"][disabled-interactive]) .label { color: color-mix( in srgb, ${S[e].disabled.labelTextColor} ${S[e].disabled.labelTextOpacity}, transparent ); } :host([variant="${o(e)}"]:disabled) .icon, :host([variant="${o(e)}"][disabled-interactive]) .icon { color: color-mix( in srgb, ${S[e].disabled.iconColor} ${S[e].disabled.iconOpacity}, transparent ); }`}const L=[T("primary"),T("secondary"),T("tertiary"),T("primary-container"),T("secondary-container"),T("tertiary-container"),T("surface")];var E,O;let z=class extends(s(v(b(d(m(f(y(p(t,"button"),!0)))))))){constructor(){super(),E.add(this),this.variant="primary-container",this.lowered=!1,this.size="medium",this.extended=!1,new h(this,{isPressedKey:e=>" "===e,callback:e=>{this.disabled||this.disabledInteractive||(this._base?.classList.toggle("pressed",e),this._base?.classList.toggle("resting",!e))}})}disconnectedCallback(){super.disconnectedCallback(),this._base?.classList.toggle("pressed",!1),this._base?.classList.toggle("resting",!1)}firstUpdated(e){super.firstUpdated(e),[this._elevation,this._focusRing,this._stateLayer,this._ripple].forEach(e=>e?.attach(this))}updated(e){super.updated(e),(e.has("disabled")&&this.disabled||e.has("disabledInteractive")&&this.disabledInteractive)&&(this._base?.classList.toggle("pressed",!1),this._base?.classList.toggle("resting",!1))}render(){return l`<div class="base"><m3e-elevation class="elevation" ?disabled="${this.disabled||this.disabledInteractive}"></m3e-elevation><m3e-state-layer class="state-layer" ?disabled="${this.disabled||this.disabledInteractive}"></m3e-state-layer><m3e-focus-ring class="focus-ring" ?disabled="${this.disabled}"></m3e-focus-ring><m3e-ripple class="ripple" ?centered="${!this.extended}" ?disabled="${this.disabled||this.disabledInteractive}"></m3e-ripple><div class="touch" aria-hidden="true"></div>${this[$]()}<div class="wrapper"><slot class="icon" aria-hidden="true" @slotchange="${e(this,E,"m",O)}"></slot><slot class="icon" aria-hidden="true" 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><div class="label"><slot name="label" @slotchange="${e(this,E,"m",O)}"></slot></div></div></div>`}};E=new WeakSet,O=function(){this._base?.classList.toggle("with-menu",null!==this.querySelector("m3e-fab-menu-trigger"))},z.styles=[w,L,x],a([i(".base")],z.prototype,"_base",void 0),a([i(".elevation")],z.prototype,"_elevation",void 0),a([i(".focus-ring")],z.prototype,"_focusRing",void 0),a([i(".state-layer")],z.prototype,"_stateLayer",void 0),a([i(".ripple")],z.prototype,"_ripple",void 0),a([n({reflect:!0})],z.prototype,"variant",void 0),a([n({type:Boolean,reflect:!0})],z.prototype,"lowered",void 0),a([n({reflect:!0})],z.prototype,"size",void 0),a([n({type:Boolean,reflect:!0})],z.prototype,"extended",void 0),z=a([u("m3e-fab")],z);export{z as M3eFabElement};

package/dist/form-field.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/form-field.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 o,nothing as a,html as s,css as r,unsafeCSS as l}from"lit";import{query as n,state as d,property as f}from"lit/decorators.js";import{ReconnectedCallback as h,AttachInternals as c,MutationController as m,ResizeController as p,FocusController as u,setCustomState as b,PressedController as v,HoverController as g,isReadOnlyMixin as y,hasAssignedNodes as x,hasCustomState as w,interceptProperty as _,getTextContent as $,registerStyleSheet as k,DesignToken as z,customElement as C}from"@m3e/web/core";import{M3eAriaDescriber as S}from"@m3e/web/core/a11y";

package/dist/heading.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 } from 'tslib';

package/dist/heading.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}from"tslib";import{css as t,LitElement as a,html as i}from"lit";import{property as l}from"lit/decorators.js";import{DesignToken as s,customElement as n}from"@m3e/web/core";let d=class extends a{constructor(){super(...arguments),this.emphasized=!1,this.variant="display",this.size="medium"}update(e){super.update(e),e.has("level")&&(this.ariaLevel=void 0!==this.level?`${this.level}`:null,this.role=this.ariaLevel?"heading":null)}render(){return i`<slot></slot>`}};d.styles=t`:host { display: block; } :host([variant="display"][size="large"]:not([emphasized])) { font-size: ${s.typescale.standard.display.large.fontSize}; font-weight: ${s.typescale.standard.display.large.fontWeight}; line-height: ${s.typescale.standard.display.large.lineHeight}; letter-spacing: ${s.typescale.standard.display.large.tracking}; } :host([variant="display"][size="medium"]:not([emphasized])) { font-size: ${s.typescale.standard.display.medium.fontSize}; font-weight: ${s.typescale.standard.display.medium.fontWeight}; line-height: ${s.typescale.standard.display.medium.lineHeight}; letter-spacing: ${s.typescale.standard.display.medium.tracking}; } :host([variant="display"][size="small"]:not([emphasized])) { font-size: ${s.typescale.standard.display.small.fontSize}; font-weight: ${s.typescale.standard.display.small.fontWeight}; line-height: ${s.typescale.standard.display.small.lineHeight}; letter-spacing: ${s.typescale.standard.display.small.tracking}; } :host([variant="headline"][size="large"]:not([emphasized])) { font-size: ${s.typescale.standard.headline.large.fontSize}; font-weight: ${s.typescale.standard.headline.large.fontWeight}; line-height: ${s.typescale.standard.headline.large.lineHeight}; letter-spacing: ${s.typescale.standard.headline.large.tracking}; } :host([variant="headline"][size="medium"]:not([emphasized])) { font-size: ${s.typescale.standard.headline.medium.fontSize}; font-weight: ${s.typescale.standard.headline.medium.fontWeight}; line-height: ${s.typescale.standard.headline.medium.lineHeight}; letter-spacing: ${s.typescale.standard.headline.medium.tracking}; } :host([variant="headline"][size="small"]:not([emphasized])) { font-size: ${s.typescale.standard.headline.small.fontSize}; font-weight: ${s.typescale.standard.headline.small.fontWeight}; line-height: ${s.typescale.standard.headline.small.lineHeight}; letter-spacing: ${s.typescale.standard.headline.small.tracking}; } :host([variant="title"][size="large"]:not([emphasized])) { font-size: ${s.typescale.standard.title.large.fontSize}; font-weight: ${s.typescale.standard.title.large.fontWeight}; line-height: ${s.typescale.standard.title.large.lineHeight}; letter-spacing: ${s.typescale.standard.title.large.tracking}; } :host([variant="title"][size="medium"]:not([emphasized])) { font-size: ${s.typescale.standard.title.medium.fontSize}; font-weight: ${s.typescale.standard.title.medium.fontWeight}; line-height: ${s.typescale.standard.title.medium.lineHeight}; letter-spacing: ${s.typescale.standard.title.medium.tracking}; } :host([variant="title"][size="small"]:not([emphasized])) { font-size: ${s.typescale.standard.title.small.fontSize}; font-weight: ${s.typescale.standard.title.small.fontWeight}; line-height: ${s.typescale.standard.title.small.lineHeight}; letter-spacing: ${s.typescale.standard.title.small.tracking}; } :host([variant="label"][size="large"]:not([emphasized])) { font-size: ${s.typescale.standard.label.large.fontSize}; font-weight: ${s.typescale.standard.label.large.fontWeight}; line-height: ${s.typescale.standard.label.large.lineHeight}; letter-spacing: ${s.typescale.standard.label.large.tracking}; } :host([variant="label"][size="medium"]:not([emphasized])) { font-size: ${s.typescale.standard.label.medium.fontSize}; font-weight: ${s.typescale.standard.label.medium.fontWeight}; line-height: ${s.typescale.standard.label.medium.lineHeight}; letter-spacing: ${s.typescale.standard.label.medium.tracking}; } :host([variant="label"][size="small"]:not([emphasized])) { font-size: ${s.typescale.standard.label.small.fontSize}; font-weight: ${s.typescale.standard.label.small.fontWeight}; line-height: ${s.typescale.standard.label.small.lineHeight}; letter-spacing: ${s.typescale.standard.label.small.tracking}; } :host([variant="display"][size="large"][emphasized]) { font-size: ${s.typescale.emphasized.display.large.fontSize}; font-weight: ${s.typescale.emphasized.display.large.fontWeight}; line-height: ${s.typescale.emphasized.display.large.lineHeight}; letter-spacing: ${s.typescale.emphasized.display.large.tracking}; } :host([variant="display"][size="medium"][emphasized]) { font-size: ${s.typescale.emphasized.display.medium.fontSize}; font-weight: ${s.typescale.emphasized.display.medium.fontWeight}; line-height: ${s.typescale.emphasized.display.medium.lineHeight}; letter-spacing: ${s.typescale.emphasized.display.medium.tracking}; } :host([variant="display"][size="small"][emphasized]) { font-size: ${s.typescale.emphasized.display.small.fontSize}; font-weight: ${s.typescale.emphasized.display.small.fontWeight}; line-height: ${s.typescale.emphasized.display.small.lineHeight}; letter-spacing: ${s.typescale.emphasized.display.small.tracking}; } :host([variant="headline"][size="large"][emphasized]) { font-size: ${s.typescale.emphasized.headline.large.fontSize}; font-weight: ${s.typescale.emphasized.headline.large.fontWeight}; line-height: ${s.typescale.emphasized.headline.large.lineHeight}; letter-spacing: ${s.typescale.emphasized.headline.large.tracking}; } :host([variant="headline"][size="medium"][emphasized]) { font-size: ${s.typescale.emphasized.headline.medium.fontSize}; font-weight: ${s.typescale.emphasized.headline.medium.fontWeight}; line-height: ${s.typescale.emphasized.headline.medium.lineHeight}; letter-spacing: ${s.typescale.emphasized.headline.medium.tracking}; } :host([variant="headline"][size="small"][emphasized]) { font-size: ${s.typescale.emphasized.headline.small.fontSize}; font-weight: ${s.typescale.emphasized.headline.small.fontWeight}; line-height: ${s.typescale.emphasized.headline.small.lineHeight}; letter-spacing: ${s.typescale.emphasized.headline.small.tracking}; } :host([variant="title"][size="large"][emphasized]) { font-size: ${s.typescale.emphasized.title.large.fontSize}; font-weight: ${s.typescale.emphasized.title.large.fontWeight}; line-height: ${s.typescale.emphasized.title.large.lineHeight}; letter-spacing: ${s.typescale.emphasized.title.large.tracking}; } :host([variant="title"][size="medium"][emphasized]) { font-size: ${s.typescale.emphasized.title.medium.fontSize}; font-weight: ${s.typescale.emphasized.title.medium.fontWeight}; line-height: ${s.typescale.emphasized.title.medium.lineHeight}; letter-spacing: ${s.typescale.emphasized.title.medium.tracking}; } :host([variant="title"][size="small"][emphasized]) { font-size: ${s.typescale.emphasized.title.small.fontSize}; font-weight: ${s.typescale.emphasized.title.small.fontWeight}; line-height: ${s.typescale.emphasized.title.small.lineHeight}; letter-spacing: ${s.typescale.emphasized.title.small.tracking}; } :host([variant="label"][size="large"][emphasized]) { font-size: ${s.typescale.emphasized.label.large.fontSize}; font-weight: ${s.typescale.emphasized.label.large.fontWeight}; line-height: ${s.typescale.emphasized.label.large.lineHeight}; letter-spacing: ${s.typescale.emphasized.label.large.tracking}; } :host([variant="label"][size="medium"][emphasized]) { font-size: ${s.typescale.emphasized.label.medium.fontSize}; font-weight: ${s.typescale.emphasized.label.medium.fontWeight}; line-height: ${s.typescale.emphasized.label.medium.lineHeight}; letter-spacing: ${s.typescale.emphasized.label.medium.tracking}; } :host([variant="label"][size="small"][emphasized]) { font-size: ${s.typescale.emphasized.label.small.fontSize}; font-weight: ${s.typescale.emphasized.label.small.fontWeight}; line-height: ${s.typescale.emphasized.label.small.lineHeight}; letter-spacing: ${s.typescale.emphasized.label.small.tracking}; }`,e([l({type:Boolean,reflect:!0})],d.prototype,"emphasized",void 0),e([l({reflect:!0})],d.prototype,"variant",void 0),e([l({reflect:!0})],d.prototype,"size",void 0),e([l({type:Number})],d.prototype,"level",void 0),d=e([n("m3e-heading")],d);export{d as M3eHeadingElement};