@m3e/segmented-button 1.0.6 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.min.js CHANGED
@@ -3,29 +3,29 @@
3
3
  * Copyright (c) 2025 matraic
4
4
  * See LICENSE file in the project root for full license text.
5
5
  */
6
- import{LitElement as e,html as t,unsafeCSS as o,css as s}from"lit";import{Dirty as i,Touched as n,Checked as r,Disabled as a,AttachInternals as l,Role as c,DesignToken as d,hasAssignedNodes as h,Labelled as u,FormAssociated as p,formValue as m}from"@m3e/core";import{selectionManager as b,SelectionManager as g}from"@m3e/core/a11y";function f(e,t,o,s){var i,n=arguments.length,r=n<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,o):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,o,s);else for(var a=e.length-1;a>=0;a--)(i=e[a])&&(r=(n<3?i(r):n>3?i(t,o,r):i(t,o))||r);return n>3&&r&&Object.defineProperty(t,o,r),r}function y(e,t,o,s){if("a"===o&&!s)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!s:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===o?s:"a"===o?s.call(e):s?s.value:t.get(e)}"function"==typeof SuppressedError&&SuppressedError;
6
+ import{LitElement as e,html as t,unsafeCSS as o,css as s}from"lit";import{Dirty as i,Touched as n,Checked as r,Disabled as a,AttachInternals as l,Role as c,DesignToken as d,hasAssignedNodes as h,Labelled as u,FormAssociated as p,formValue as m}from"@m3e/core";import{selectionManager as b,SelectionManager as g}from"@m3e/core/a11y";import{M3eDirectionality as f}from"@m3e/core/bidi";function v(e,t,o,s){var i,n=arguments.length,r=n<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,o):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,o,s);else for(var a=e.length-1;a>=0;a--)(i=e[a])&&(r=(n<3?i(r):n>3?i(t,o,r):i(t,o))||r);return n>3&&r&&Object.defineProperty(t,o,r),r}function y(e,t,o,s){if("a"===o&&!s)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!s:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===o?s:"a"===o?s.call(e):s?s.value:t.get(e)}"function"==typeof SuppressedError&&SuppressedError;
7
7
  /**
8
8
  * @license
9
9
  * Copyright 2017 Google LLC
10
10
  * SPDX-License-Identifier: BSD-3-Clause
11
11
  */
12
- const v=e=>(t,o)=>{void 0!==o?o.addInitializer(()=>{customElements.define(e,t)}):customElements.define(e,t)},$=globalThis,S=$.ShadowRoot&&(void 0===$.ShadyCSS||$.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,E=Symbol(),w=new WeakMap;
12
+ const $=e=>(t,o)=>{void 0!==o?o.addInitializer(()=>{customElements.define(e,t)}):customElements.define(e,t)},w=globalThis,E=w.ShadowRoot&&(void 0===w.ShadyCSS||w.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,S=Symbol(),_=new WeakMap;
13
13
  /**
14
14
  * @license
15
15
  * Copyright 2019 Google LLC
16
16
  * SPDX-License-Identifier: BSD-3-Clause
17
- */let _=class{constructor(e,t,o){if(this._$cssResult$=!0,o!==E)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=e,this.t=t}get styleSheet(){let e=this.o;const t=this.t;if(S&&void 0===e){const o=void 0!==t&&1===t.length;o&&(e=w.get(t)),void 0===e&&((this.o=e=new CSSStyleSheet).replaceSync(this.cssText),o&&w.set(t,e))}return e}toString(){return this.cssText}};const P=(e,t)=>{if(S)e.adoptedStyleSheets=t.map(e=>e instanceof CSSStyleSheet?e:e.styleSheet);else for(const o of t){const t=document.createElement("style"),s=$.litNonce;void 0!==s&&t.setAttribute("nonce",s),t.textContent=o.cssText,e.appendChild(t)}},k=S?e=>e:e=>e instanceof CSSStyleSheet?(e=>{let t="";for(const o of e.cssRules)t+=o.cssText;return(e=>new _("string"==typeof e?e:e+"",void 0,E))(t)})(e):e,{is:C,defineProperty:x,getOwnPropertyDescriptor:U,getOwnPropertyNames:O,getOwnPropertySymbols:A,getPrototypeOf:R}=Object,M=globalThis,j=M.trustedTypes,T=j?j.emptyScript:"",z=M.reactiveElementPolyfillSupport,L=(e,t)=>e,D={toAttribute(e,t){switch(t){case Boolean:e=e?T:null;break;case Object:case Array:e=null==e?e:JSON.stringify(e)}return e},fromAttribute(e,t){let o=e;switch(t){case Boolean:o=null!==e;break;case Number:o=null===e?null:Number(e);break;case Object:case Array:try{o=JSON.parse(e)}catch(e){o=null}}return o}},I=(e,t)=>!C(e,t),q={attribute:!0,type:String,converter:D,reflect:!1,useDefault:!1,hasChanged:I};
17
+ */let P=class{constructor(e,t,o){if(this._$cssResult$=!0,o!==S)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=e,this.t=t}get styleSheet(){let e=this.o;const t=this.t;if(E&&void 0===e){const o=void 0!==t&&1===t.length;o&&(e=_.get(t)),void 0===e&&((this.o=e=new CSSStyleSheet).replaceSync(this.cssText),o&&_.set(t,e))}return e}toString(){return this.cssText}};const k=(e,t)=>{if(E)e.adoptedStyleSheets=t.map(e=>e instanceof CSSStyleSheet?e:e.styleSheet);else for(const o of t){const t=document.createElement("style"),s=w.litNonce;void 0!==s&&t.setAttribute("nonce",s),t.textContent=o.cssText,e.appendChild(t)}},C=E?e=>e:e=>e instanceof CSSStyleSheet?(e=>{let t="";for(const o of e.cssRules)t+=o.cssText;return(e=>new P("string"==typeof e?e:e+"",void 0,S))(t)})(e):e,{is:x,defineProperty:U,getOwnPropertyDescriptor:O,getOwnPropertyNames:A,getOwnPropertySymbols:R,getPrototypeOf:T}=Object,M=globalThis,j=M.trustedTypes,z=j?j.emptyScript:"",L=M.reactiveElementPolyfillSupport,D=(e,t)=>e,I={toAttribute(e,t){switch(t){case Boolean:e=e?z:null;break;case Object:case Array:e=null==e?e:JSON.stringify(e)}return e},fromAttribute(e,t){let o=e;switch(t){case Boolean:o=null!==e;break;case Number:o=null===e?null:Number(e);break;case Object:case Array:try{o=JSON.parse(e)}catch(e){o=null}}return o}},q=(e,t)=>!x(e,t),B={attribute:!0,type:String,converter:I,reflect:!1,useDefault:!1,hasChanged:q};
18
18
  /**
19
19
  * @license
20
20
  * Copyright 2017 Google LLC
21
21
  * SPDX-License-Identifier: BSD-3-Clause
22
- */Symbol.metadata??=Symbol("metadata"),M.litPropertyMetadata??=new WeakMap;class B extends HTMLElement{static addInitializer(e){this._$Ei(),(this.l??=[]).push(e)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(e,t=q){if(t.state&&(t.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(e)&&((t=Object.create(t)).wrapped=!0),this.elementProperties.set(e,t),!t.noAccessor){const o=Symbol(),s=this.getPropertyDescriptor(e,o,t);void 0!==s&&x(this.prototype,e,s)}}static getPropertyDescriptor(e,t,o){const{get:s,set:i}=U(this.prototype,e)??{get(){return this[t]},set(e){this[t]=e}};return{get:s,set(t){const n=s?.call(this);i?.call(this,t),this.requestUpdate(e,n,o)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this.elementProperties.get(e)??q}static _$Ei(){if(this.hasOwnProperty(L("elementProperties")))return;const e=R(this);e.finalize(),void 0!==e.l&&(this.l=[...e.l]),this.elementProperties=new Map(e.elementProperties)}static finalize(){if(this.hasOwnProperty(L("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(L("properties"))){const e=this.properties,t=[...O(e),...A(e)];for(const o of t)this.createProperty(o,e[o])}const e=this[Symbol.metadata];if(null!==e){const t=litPropertyMetadata.get(e);if(void 0!==t)for(const[e,o]of t)this.elementProperties.set(e,o)}this._$Eh=new Map;for(const[e,t]of this.elementProperties){const o=this._$Eu(e,t);void 0!==o&&this._$Eh.set(o,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(e){const t=[];if(Array.isArray(e)){const o=new Set(e.flat(1/0).reverse());for(const e of o)t.unshift(k(e))}else void 0!==e&&t.push(k(e));return t}static _$Eu(e,t){const o=t.attribute;return!1===o?void 0:"string"==typeof o?o:"string"==typeof e?e.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise(e=>this.enableUpdating=e),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(e=>e(this))}addController(e){(this._$EO??=new Set).add(e),void 0!==this.renderRoot&&this.isConnected&&e.hostConnected?.()}removeController(e){this._$EO?.delete(e)}_$E_(){const e=new Map,t=this.constructor.elementProperties;for(const o of t.keys())this.hasOwnProperty(o)&&(e.set(o,this[o]),delete this[o]);e.size>0&&(this._$Ep=e)}createRenderRoot(){const e=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return P(e,this.constructor.elementStyles),e}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach(e=>e.hostConnected?.())}enableUpdating(e){}disconnectedCallback(){this._$EO?.forEach(e=>e.hostDisconnected?.())}attributeChangedCallback(e,t,o){this._$AK(e,o)}_$ET(e,t){const o=this.constructor.elementProperties.get(e),s=this.constructor._$Eu(e,o);if(void 0!==s&&!0===o.reflect){const i=(void 0!==o.converter?.toAttribute?o.converter:D).toAttribute(t,o.type);this._$Em=e,null==i?this.removeAttribute(s):this.setAttribute(s,i),this._$Em=null}}_$AK(e,t){const o=this.constructor,s=o._$Eh.get(e);if(void 0!==s&&this._$Em!==s){const e=o.getPropertyOptions(s),i="function"==typeof e.converter?{fromAttribute:e.converter}:void 0!==e.converter?.fromAttribute?e.converter:D;this._$Em=s;const n=i.fromAttribute(t,e.type);this[s]=n??this._$Ej?.get(s)??n,this._$Em=null}}requestUpdate(e,t,o){if(void 0!==e){const s=this.constructor,i=this[e];if(o??=s.getPropertyOptions(e),!((o.hasChanged??I)(i,t)||o.useDefault&&o.reflect&&i===this._$Ej?.get(e)&&!this.hasAttribute(s._$Eu(e,o))))return;this.C(e,t,o)}!1===this.isUpdatePending&&(this._$ES=this._$EP())}C(e,t,{useDefault:o,reflect:s,wrapped:i},n){o&&!(this._$Ej??=new Map).has(e)&&(this._$Ej.set(e,n??t??this[e]),!0!==i||void 0!==n)||(this._$AL.has(e)||(this.hasUpdated||o||(t=void 0),this._$AL.set(e,t)),!0===s&&this._$Em!==e&&(this._$Eq??=new Set).add(e))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}const e=this.scheduleUpdate();return null!=e&&await e,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[e,t]of this._$Ep)this[e]=t;this._$Ep=void 0}const e=this.constructor.elementProperties;if(e.size>0)for(const[t,o]of e){const{wrapped:e}=o,s=this[t];!0!==e||this._$AL.has(t)||void 0===s||this.C(t,void 0,o,s)}}let e=!1;const t=this._$AL;try{e=this.shouldUpdate(t),e?(this.willUpdate(t),this._$EO?.forEach(e=>e.hostUpdate?.()),this.update(t)):this._$EM()}catch(t){throw e=!1,this._$EM(),t}e&&this._$AE(t)}willUpdate(e){}_$AE(e){this._$EO?.forEach(e=>e.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(e)),this.updated(e)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(e){return!0}update(e){this._$Eq&&=this._$Eq.forEach(e=>this._$ET(e,this[e])),this._$EM()}updated(e){}firstUpdated(e){}}B.elementStyles=[],B.shadowRootOptions={mode:"open"},B[L("elementProperties")]=new Map,B[L("finalized")]=new Map,z?.({ReactiveElement:B}),(M.reactiveElementVersions??=[]).push("2.1.1");
22
+ */Symbol.metadata??=Symbol("metadata"),M.litPropertyMetadata??=new WeakMap;class W extends HTMLElement{static addInitializer(e){this._$Ei(),(this.l??=[]).push(e)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(e,t=B){if(t.state&&(t.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(e)&&((t=Object.create(t)).wrapped=!0),this.elementProperties.set(e,t),!t.noAccessor){const o=Symbol(),s=this.getPropertyDescriptor(e,o,t);void 0!==s&&U(this.prototype,e,s)}}static getPropertyDescriptor(e,t,o){const{get:s,set:i}=O(this.prototype,e)??{get(){return this[t]},set(e){this[t]=e}};return{get:s,set(t){const n=s?.call(this);i?.call(this,t),this.requestUpdate(e,n,o)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this.elementProperties.get(e)??B}static _$Ei(){if(this.hasOwnProperty(D("elementProperties")))return;const e=T(this);e.finalize(),void 0!==e.l&&(this.l=[...e.l]),this.elementProperties=new Map(e.elementProperties)}static finalize(){if(this.hasOwnProperty(D("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(D("properties"))){const e=this.properties,t=[...A(e),...R(e)];for(const o of t)this.createProperty(o,e[o])}const e=this[Symbol.metadata];if(null!==e){const t=litPropertyMetadata.get(e);if(void 0!==t)for(const[e,o]of t)this.elementProperties.set(e,o)}this._$Eh=new Map;for(const[e,t]of this.elementProperties){const o=this._$Eu(e,t);void 0!==o&&this._$Eh.set(o,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(e){const t=[];if(Array.isArray(e)){const o=new Set(e.flat(1/0).reverse());for(const e of o)t.unshift(C(e))}else void 0!==e&&t.push(C(e));return t}static _$Eu(e,t){const o=t.attribute;return!1===o?void 0:"string"==typeof o?o:"string"==typeof e?e.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise(e=>this.enableUpdating=e),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(e=>e(this))}addController(e){(this._$EO??=new Set).add(e),void 0!==this.renderRoot&&this.isConnected&&e.hostConnected?.()}removeController(e){this._$EO?.delete(e)}_$E_(){const e=new Map,t=this.constructor.elementProperties;for(const o of t.keys())this.hasOwnProperty(o)&&(e.set(o,this[o]),delete this[o]);e.size>0&&(this._$Ep=e)}createRenderRoot(){const e=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return k(e,this.constructor.elementStyles),e}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach(e=>e.hostConnected?.())}enableUpdating(e){}disconnectedCallback(){this._$EO?.forEach(e=>e.hostDisconnected?.())}attributeChangedCallback(e,t,o){this._$AK(e,o)}_$ET(e,t){const o=this.constructor.elementProperties.get(e),s=this.constructor._$Eu(e,o);if(void 0!==s&&!0===o.reflect){const i=(void 0!==o.converter?.toAttribute?o.converter:I).toAttribute(t,o.type);this._$Em=e,null==i?this.removeAttribute(s):this.setAttribute(s,i),this._$Em=null}}_$AK(e,t){const o=this.constructor,s=o._$Eh.get(e);if(void 0!==s&&this._$Em!==s){const e=o.getPropertyOptions(s),i="function"==typeof e.converter?{fromAttribute:e.converter}:void 0!==e.converter?.fromAttribute?e.converter:I;this._$Em=s;const n=i.fromAttribute(t,e.type);this[s]=n??this._$Ej?.get(s)??n,this._$Em=null}}requestUpdate(e,t,o){if(void 0!==e){const s=this.constructor,i=this[e];if(o??=s.getPropertyOptions(e),!((o.hasChanged??q)(i,t)||o.useDefault&&o.reflect&&i===this._$Ej?.get(e)&&!this.hasAttribute(s._$Eu(e,o))))return;this.C(e,t,o)}!1===this.isUpdatePending&&(this._$ES=this._$EP())}C(e,t,{useDefault:o,reflect:s,wrapped:i},n){o&&!(this._$Ej??=new Map).has(e)&&(this._$Ej.set(e,n??t??this[e]),!0!==i||void 0!==n)||(this._$AL.has(e)||(this.hasUpdated||o||(t=void 0),this._$AL.set(e,t)),!0===s&&this._$Em!==e&&(this._$Eq??=new Set).add(e))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}const e=this.scheduleUpdate();return null!=e&&await e,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[e,t]of this._$Ep)this[e]=t;this._$Ep=void 0}const e=this.constructor.elementProperties;if(e.size>0)for(const[t,o]of e){const{wrapped:e}=o,s=this[t];!0!==e||this._$AL.has(t)||void 0===s||this.C(t,void 0,o,s)}}let e=!1;const t=this._$AL;try{e=this.shouldUpdate(t),e?(this.willUpdate(t),this._$EO?.forEach(e=>e.hostUpdate?.()),this.update(t)):this._$EM()}catch(t){throw e=!1,this._$EM(),t}e&&this._$AE(t)}willUpdate(e){}_$AE(e){this._$EO?.forEach(e=>e.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(e)),this.updated(e)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(e){return!0}update(e){this._$Eq&&=this._$Eq.forEach(e=>this._$ET(e,this[e])),this._$EM()}updated(e){}firstUpdated(e){}}W.elementStyles=[],W.shadowRootOptions={mode:"open"},W[D("elementProperties")]=new Map,W[D("finalized")]=new Map,L?.({ReactiveElement:W}),(M.reactiveElementVersions??=[]).push("2.1.1");
23
23
  /**
24
24
  * @license
25
25
  * Copyright 2017 Google LLC
26
26
  * SPDX-License-Identifier: BSD-3-Clause
27
27
  */
28
- const W={attribute:!0,type:String,converter:D,reflect:!1,hasChanged:I},N=(e=W,t,o)=>{const{kind:s,metadata:i}=o;let n=globalThis.litPropertyMetadata.get(i);if(void 0===n&&globalThis.litPropertyMetadata.set(i,n=new Map),"setter"===s&&((e=Object.create(e)).wrapped=!0),n.set(o.name,e),"accessor"===s){const{name:s}=o;return{set(o){const i=t.get.call(this);t.set.call(this,o),this.requestUpdate(s,i,e)},init(t){return void 0!==t&&this.C(s,void 0,e,t),t}}}if("setter"===s){const{name:s}=o;return function(o){const i=this[s];t.call(this,o),this.requestUpdate(s,i,e)}}throw Error("Unsupported decorator location: "+s)};function K(e){return(t,o)=>"object"==typeof o?N(e,t,o):((e,t,o)=>{const s=t.hasOwnProperty(o);return t.constructor.createProperty(o,e),s?Object.getOwnPropertyDescriptor(t,o):void 0})(e,t,o)}
28
+ const N={attribute:!0,type:String,converter:I,reflect:!1,hasChanged:q},K=(e=N,t,o)=>{const{kind:s,metadata:i}=o;let n=globalThis.litPropertyMetadata.get(i);if(void 0===n&&globalThis.litPropertyMetadata.set(i,n=new Map),"setter"===s&&((e=Object.create(e)).wrapped=!0),n.set(o.name,e),"accessor"===s){const{name:s}=o;return{set(o){const i=t.get.call(this);t.set.call(this,o),this.requestUpdate(s,i,e)},init(t){return void 0!==t&&this.C(s,void 0,e,t),t}}}if("setter"===s){const{name:s}=o;return function(o){const i=this[s];t.call(this,o),this.requestUpdate(s,i,e)}}throw Error("Unsupported decorator location: "+s)};function F(e){return(t,o)=>"object"==typeof o?K(e,t,o):((e,t,o)=>{const s=t.hasOwnProperty(o);return t.constructor.createProperty(o,e),s?Object.getOwnPropertyDescriptor(t,o):void 0})(e,t,o)}
29
29
  /**
30
30
  * @license
31
31
  * Copyright 2017 Google LLC
@@ -36,235 +36,5 @@ const W={attribute:!0,type:String,converter:D,reflect:!1,hasChanged:I},N=(e=W,t,
36
36
  * Copyright 2017 Google LLC
37
37
  * SPDX-License-Identifier: BSD-3-Clause
38
38
  */
39
- function F(e,t){return(t,o,s)=>((e,t,o)=>(o.configurable=!0,o.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,o),o))(t,o,{get(){return(t=>t.renderRoot?.querySelector(e)??null)(this)}})}var H,J,G,V,Z;let Q=Z=class extends(i(n(r(a(l(c(e,"radio"),!0)))))){constructor(){super(...arguments),H.add(this),J.set(this,e=>y(this,H,"m",V).call(this,e)),this.value="on"}connectedCallback(){super.connectedCallback(),this.addEventListener("click",y(this,J,"f"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",y(this,J,"f"))}firstUpdated(e){super.firstUpdated(e),[this._focusRing,this._stateLayer,this._ripple].forEach(e=>e?.attach(this))}update(e){const t=this.closest("m3e-segmented-button");t&&(this.role=t.multi?"button":"radio"),super.update(e),e.has("checked")&&t?.[b].notifySelectionChange(this),e.has("disabled")&&(this.disabled?this.nextElementSibling instanceof Z&&(this.nextElementSibling.disabled?this.style.removeProperty("--_segmented-button-disabled-outline-color"):this.style.setProperty("--_segmented-button-disabled-outline-color",`var(--m3e-segmented-button-outline-color, ${d.color.outline})`)):(this.style.removeProperty("--_segmented-button-disabled-outline-color"),this.previousElementSibling instanceof Z&&(this.previousElementSibling.disabled?this.previousElementSibling.style.setProperty("--_segmented-button-disabled-outline-color",`var(--m3e-segmented-button-outline-color, ${d.color.outline})`):this.previousElementSibling.style.removeProperty("--_segmented-button-disabled-outline-color"))))}render(){return t`<div class="base">
40
- <m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer>
41
- <m3e-focus-ring class="focus-ring" ?disabled="${this.disabled}"></m3e-focus-ring>
42
- <m3e-ripple class="ripple" ?disabled="${this.disabled}"></m3e-ripple>
43
- <div class="touch" aria-hidden="true"></div>
44
- <div class="wrapper">
45
- <div class="icon" aria-hidden="true">
46
- <svg class="check" viewBox="0 -960 960 960">
47
- <path fill="currentColor" d="M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z" />
48
- </svg>
49
- <slot name="icon" @slotchange="${y(this,H,"m",G)}"></slot>
50
- </div>
51
- <div class="label">
52
- <slot></slot>
53
- </div>
54
- </div>
55
- </div>`}};var X,Y,ee,te,oe;J=new WeakMap,H=new WeakSet,G=function(e){this.classList.toggle("-with-icon",h(e.target))},V=function(e){if(e.defaultPrevented)return;const t=this.closest("m3e-segmented-button");if(t&&(t.multi||!this.checked)){const e=this.checked;this.checked=!this.checked,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))?(this.closest("m3e-segmented-button")?.[b].notifySelectionChange(this),this.dispatchEvent(new Event("change",{bubbles:!0}))):this.checked=e}},Q.styles=s`
56
- :host {
57
- display: inline-block;
58
- position: relative;
59
- vertical-align: middle;
60
- outline: none;
61
- user-select: none;
62
- flex: 1 1 auto;
63
- min-width: 0;
64
- -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
65
- }
66
- .base {
67
- display: inline-flex;
68
- vertical-align: middle;
69
- align-items: center;
70
- width: 100%;
71
- height: calc(var(--m3e-segmented-button-height, 2.5rem) + ${d.density.calc(-3)});
72
- box-sizing: border-box;
73
- border-width: var(--m3e-segmented-button-outline-thickness, 1px);
74
- border-color: var(--m3e-segmented-button-outline-color, ${d.color.outline});
75
- border-style: solid;
76
- border-radius: inherit;
77
- border-left-style: var(--_segmented-button-left-border, solid);
78
- transition: ${o(`background-color ${d.motion.duration.short4} ${d.motion.easing.standard}`)};
79
- }
80
- .touch {
81
- position: absolute;
82
- height: 3rem;
83
- left: 0;
84
- right: 0;
85
- }
86
- .wrapper {
87
- width: 100%;
88
- overflow: hidden;
89
- display: inline-flex;
90
- align-items: center;
91
- padding-inline-start: var(--m3e-segmented-button-padding-start, 1rem);
92
- padding-inline-end: var(--m3e-segmented-button-padding-end, 1rem);
93
- column-gap: var(--m3e-segmented-button-spacing, 0.5rem);
94
- }
95
- .label {
96
- font-size: var(--m3e-segmented-button-font-size, ${d.typescale.standard.label.large.fontSize});
97
- font-weight: var(--m3e-segmented-button-font-weight, ${d.typescale.standard.label.large.fontWeight});
98
- line-height: var(--m3e-segmented-button-line-height, ${d.typescale.standard.label.large.lineHeight});
99
- letter-spacing: var(--m3e-segmented-button-tracking, ${d.typescale.standard.label.large.tracking});
100
- justify-self: center;
101
- flex: 1 1 auto;
102
- white-space: nowrap;
103
- overflow: hidden;
104
- text-overflow: ellipsis;
105
- transition: ${o(`color ${d.motion.duration.short4} ${d.motion.easing.standard}`)};
106
- }
107
- .icon {
108
- display: flex;
109
- align-items: center;
110
- justify-content: center;
111
- transition: ${o(`color ${d.motion.duration.short4} ${d.motion.easing.standard}`)};
112
- }
113
- :host(:not(:disabled)) {
114
- cursor: pointer;
115
- }
116
- :host([checked]:not(.-hide-selection)) .wrapper,
117
- :host(.-with-icon) .wrapper {
118
- padding-inline-start: var(--m3e-segmented-button-with-icon-padding-start, 0.75rem);
119
- }
120
- :host(:not(:disabled)[checked]) .base {
121
- background-color: var(--m3e-segmented-button-selected-container-color, ${d.color.secondaryContainer});
122
- --m3e-state-layer-hover-color: var(
123
- --m3e-segmented-button-selected-container-hover-color,
124
- ${d.color.onSecondaryContainer}
125
- );
126
- --m3e-state-layer-focus-color: var(
127
- --m3e-segmented-button-selected-container-focus-color,
128
- ${d.color.onSecondaryContainer}
129
- );
130
- --m3e-ripple-color: var(--m3e-segmented-button-selected-ripple-color, ${d.color.onSecondaryContainer});
131
- }
132
- :host(:not(:disabled)[checked]) .label {
133
- color: var(--m3e-segmented-button-selected-label-text-color, ${d.color.onSecondaryContainer});
134
- }
135
- :host(:not(:disabled)[checked]) .icon {
136
- color: var(--m3e-segmented-button-selected-icon-color, ${d.color.onSecondaryContainer});
137
- }
138
- :host(:not(:disabled):not([checked])) .base {
139
- --m3e-state-layer-hover-color: var(
140
- --m3e-segmented-button-unselected-container-hover-color,
141
- ${d.color.onSurface}
142
- );
143
- --m3e-state-layer-focus-color: var(
144
- --m3e-segmented-button-unselected-container-focus-color,
145
- ${d.color.onSurface}
146
- );
147
- --m3e-ripple-color: var(--m3e-segmented-button-unselected-ripple-color, ${d.color.onSurface});
148
- }
149
- :host(:not(:disabled):not([checked])) .label {
150
- color: var(--m3e-segmented-button-unselected-label-text-color, ${d.color.onSurface});
151
- }
152
- :host(:not(:disabled):not([checked])) .icon {
153
- color: var(--m3e-segmented-button-unselected-icon-color, ${d.color.onSurface});
154
- }
155
- :host(:not(.-with-icon)) .icon {
156
- margin-inline-start: calc(0px - var(--m3e-segmented-button-spacing, 0.5rem));
157
- transition: margin-inline-start ${d.motion.spring.fastEffects};
158
- }
159
- .check,
160
- ::slotted([slot="icon"]) {
161
- width: 1em;
162
- font-size: var(--m3e-segmented-button-icon-size, 1.125rem) !important;
163
- }
164
- :host(:not([checked])) .check,
165
- :host(.-hide-selection) .check,
166
- :host(.-hide-selection:not(.-with-icon)) .icon {
167
- display: none;
168
- }
169
- :host([checked]) .icon {
170
- margin-inline-start: 0;
171
- }
172
- :host([checked]:not(.-hide-selection)) ::slotted([slot="icon"]) {
173
- display: none !important;
174
- }
175
- :host(:disabled) .base {
176
- border-color: color-mix(
177
- in srgb,
178
- var(--m3e-segmented-button-disabled-outline-color, ${d.color.onSurface})
179
- var(--m3e-segmented-button-disabled-outline-opacity, 12%),
180
- transparent
181
- );
182
- border-right-color: var(
183
- --_segmented-button-disabled-outline-color,
184
- color-mix(
185
- in srgb,
186
- var(--m3e-segmented-button-disabled-outline-color, ${d.color.onSurface})
187
- var(--m3e-segmented-button-disabled-outline-opacity, 12%),
188
- transparent
189
- )
190
- );
191
- }
192
- :host(:disabled) .label {
193
- color: color-mix(
194
- in srgb,
195
- var(--m3e-segmented-button-disabled-label-text-color, ${d.color.onSurface})
196
- var(--m3e-segmented-button-disabled-label-text-opacity, 38%),
197
- transparent
198
- );
199
- }
200
- :host(:disabled) .icon {
201
- color: color-mix(
202
- in srgb,
203
- var(--m3e-segmented-button-disabled-icon-color, ${d.color.onSurface})
204
- var(--m3e-segmented-button-disabled-icon-opacity, 38%),
205
- transparent
206
- );
207
- }
208
- @media (prefers-reduced-motion) {
209
- .base,
210
- .icon,
211
- .label {
212
- transition: none;
213
- }
214
- }
215
- @media (forced-colors: active) {
216
- .base,
217
- .icon,
218
- .label {
219
- transition: none !important;
220
- }
221
-
222
- :host(:disabled) .label,
223
- :host(:disabled) .icon {
224
- color: GrayText;
225
- }
226
- :host(:not([selected]):not(:disabled)) .label,
227
- :host(:not([selected]):not(:disabled)) .icon {
228
- color: ButtonText;
229
- }
230
- :host(:not(:disabled)[checked]) .base {
231
- background-color: ButtonText;
232
- }
233
- :host(:not(:disabled)[checked]) .label,
234
- :host(:not(:disabled)[checked]) .icon {
235
- forced-color-adjust: none;
236
- color: ButtonFace;
237
- }
238
- :host {
239
- --m3e-segmented-button-outline-color: ButtonText;
240
- }
241
- }
242
- `,f([F(".focus-ring")],Q.prototype,"_focusRing",void 0),f([F(".state-layer")],Q.prototype,"_stateLayer",void 0),f([F(".ripple")],Q.prototype,"_ripple",void 0),f([K()],Q.prototype,"value",void 0),Q=Z=f([v("m3e-button-segment")],Q);let se=class extends(u(i(n(p(a(l(c(e,"radiogroup")))))))){constructor(){super(...arguments),X.add(this),this[oe]=(new g).withWrap().onActiveItemChange(()=>this[b].activeItem?.click()),this.multi=!1,this.hideSelectionIndicator=!1}get segments(){return this[b]?.items??[]}get selected(){return this[b]?.selectedItems??[]}get value(){const e=this.selected.map(e=>e.value);switch(e.length){case 0:return null;case 1:return e[0];default:return e}}get[(X=new WeakSet,oe=b,m)](){const e=this.value;if(Array.isArray(e)){const t=new FormData;for(const o of e)t.append(this.name,o);return t}return e}connectedCallback(){super.connectedCallback(),this[b].multi=this.multi,this[b].disableRovingTabIndex(this.multi)}update(e){super.update(e),e.has("disabled")&&(void 0!==e.get("disabled")||this.disabled)&&(this[b].disabled=this.disabled),e.has("multi")&&(this.role=this.multi?"group":"radiogroup",this[b].multi=this.multi,this[b].disableRovingTabIndex(this.multi)),(e.has("multi")||e.has("disabled"))&&(this.ariaDisabled=this.multi&&this.disabled?"true":null),e.has("hideSelectionIndicator")&&this.segments.forEach(e=>e.classList.toggle("-hide-selection",this.hideSelectionIndicator))}render(){return t`<slot
243
- @slotchange="${y(this,X,"m",Y)}"
244
- @keydown="${y(this,X,"m",ee)}"
245
- @change="${y(this,X,"m",te)}"
246
- ></slot>`}};Y=function(){const{added:e}=this[b].setItems([...this.querySelectorAll("m3e-button-segment")]);e.forEach(e=>e.classList.toggle("-hide-selection",this.hideSelectionIndicator))},ee=function(e){this.multi||this[b].onKeyDown(e)},te=function(e){e.stopPropagation(),this.dispatchEvent(new Event("change",{bubbles:!0}))},se.styles=s`
247
- :host {
248
- display: inline-flex;
249
- vertical-align: middle;
250
- align-items: center;
251
- }
252
- ::slotted(:first-child) {
253
- border-radius: var(
254
- --m3e-segmented-button-start-shape,
255
- ${d.shape.corner.full} ${d.shape.corner.none} ${d.shape.corner.none}
256
- ${d.shape.corner.full}
257
- );
258
- }
259
- ::slotted(:last-child) {
260
- border-radius: var(
261
- --m3e-segmented-button-end-shape,
262
- ${d.shape.corner.none} ${d.shape.corner.full} ${d.shape.corner.full}
263
- ${d.shape.corner.none}
264
- );
265
- }
266
- ::slotted(:not(:first-child)) {
267
- --_segmented-button-left-border: none;
268
- }
269
- `,f([K({type:Boolean})],se.prototype,"multi",void 0),f([K({attribute:"hide-selection-indicator",type:Boolean})],se.prototype,"hideSelectionIndicator",void 0),se=f([v("m3e-segmented-button")],se);export{Q as M3eButtonSegmentElement,se as M3eSegmentedButtonElement};
39
+ function H(e,t){return(t,o,s)=>((e,t,o)=>(o.configurable=!0,o.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,o),o))(t,o,{get(){return(t=>t.renderRoot?.querySelector(e)??null)(this)}})}var J,G,V,Z,Q;let X=Q=class extends(i(n(r(a(l(c(e,"radio"),!0)))))){constructor(){super(...arguments),J.add(this),G.set(this,e=>y(this,J,"m",Z).call(this,e)),this.value="on"}connectedCallback(){super.connectedCallback(),this.addEventListener("click",y(this,G,"f"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",y(this,G,"f"))}firstUpdated(e){super.firstUpdated(e),[this._focusRing,this._stateLayer,this._ripple].forEach(e=>e?.attach(this))}update(e){const t=this.closest("m3e-segmented-button");t&&(this.role=t.multi?"button":"radio"),super.update(e),e.has("checked")&&t?.[b].notifySelectionChange(this),e.has("disabled")&&(this.disabled?this.nextElementSibling instanceof Q&&(this.nextElementSibling.disabled?this.style.removeProperty("--_segmented-button-disabled-outline-color"):this.style.setProperty("--_segmented-button-disabled-outline-color",`var(--m3e-segmented-button-outline-color, ${d.color.outline})`)):(this.style.removeProperty("--_segmented-button-disabled-outline-color"),this.previousElementSibling instanceof Q&&(this.previousElementSibling.disabled?this.previousElementSibling.style.setProperty("--_segmented-button-disabled-outline-color",`var(--m3e-segmented-button-outline-color, ${d.color.outline})`):this.previousElementSibling.style.removeProperty("--_segmented-button-disabled-outline-color"))))}render(){return t`<div class="base"><m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer><m3e-focus-ring class="focus-ring" ?disabled="${this.disabled}"></m3e-focus-ring><m3e-ripple class="ripple" ?disabled="${this.disabled}"></m3e-ripple><div class="touch" aria-hidden="true"></div><div class="wrapper"><div class="icon" aria-hidden="true"><svg class="check" viewBox="0 -960 960 960"><path fill="currentColor" d="M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z"/></svg><slot name="icon" @slotchange="${y(this,J,"m",V)}"></slot></div><div class="label"><slot></slot></div></div></div>`}};var Y,ee,te,oe,se,ie;G=new WeakMap,J=new WeakSet,V=function(e){this.classList.toggle("-with-icon",h(e.target))},Z=function(e){if(e.defaultPrevented)return;const t=this.closest("m3e-segmented-button");if(t&&(t.multi||!this.checked)){const e=this.checked;this.checked=!this.checked,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))?(this.closest("m3e-segmented-button")?.[b].notifySelectionChange(this),this.dispatchEvent(new Event("change",{bubbles:!0}))):this.checked=e}},X.styles=s`:host { display: inline-block; position: relative; vertical-align: middle; outline: none; user-select: none; flex: 1 1 auto; min-width: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { display: inline-flex; vertical-align: middle; align-items: center; width: 100%; height: calc(var(--m3e-segmented-button-height, 2.5rem) + ${d.density.calc(-3)}); box-sizing: border-box; border-width: var(--m3e-segmented-button-outline-thickness, 1px); border-color: var(--m3e-segmented-button-outline-color, ${d.color.outline}); border-style: solid; border-radius: inherit; border-inline-start-style: var(--_segmented-button-left-border, solid); transition: ${o(`background-color ${d.motion.duration.short4} ${d.motion.easing.standard}`)}; } .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-segmented-button-padding-start, 1rem); padding-inline-end: var(--m3e-segmented-button-padding-end, 1rem); column-gap: var(--m3e-segmented-button-spacing, 0.5rem); } .label { font-size: var(--m3e-segmented-button-font-size, ${d.typescale.standard.label.large.fontSize}); font-weight: var(--m3e-segmented-button-font-weight, ${d.typescale.standard.label.large.fontWeight}); line-height: var(--m3e-segmented-button-line-height, ${d.typescale.standard.label.large.lineHeight}); letter-spacing: var(--m3e-segmented-button-tracking, ${d.typescale.standard.label.large.tracking}); justify-self: center; flex: 1 1 auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: ${o(`color ${d.motion.duration.short4} ${d.motion.easing.standard}`)}; } .icon { display: flex; align-items: center; justify-content: center; transition: ${o(`color ${d.motion.duration.short4} ${d.motion.easing.standard}`)}; } :host(:not(:disabled)) { cursor: pointer; } :host([checked]:not(.-hide-selection)) .wrapper, :host(.-with-icon) .wrapper { padding-inline-start: var(--m3e-segmented-button-with-icon-padding-start, 0.75rem); } :host(:not(:disabled)[checked]) .base { background-color: var(--m3e-segmented-button-selected-container-color, ${d.color.secondaryContainer}); --m3e-state-layer-hover-color: var( --m3e-segmented-button-selected-container-hover-color, ${d.color.onSecondaryContainer} ); --m3e-state-layer-focus-color: var( --m3e-segmented-button-selected-container-focus-color, ${d.color.onSecondaryContainer} ); --m3e-ripple-color: var(--m3e-segmented-button-selected-ripple-color, ${d.color.onSecondaryContainer}); } :host(:not(:disabled)[checked]) .label { color: var(--m3e-segmented-button-selected-label-text-color, ${d.color.onSecondaryContainer}); } :host(:not(:disabled)[checked]) .icon { color: var(--m3e-segmented-button-selected-icon-color, ${d.color.onSecondaryContainer}); } :host(:not(:disabled):not([checked])) .base { --m3e-state-layer-hover-color: var( --m3e-segmented-button-unselected-container-hover-color, ${d.color.onSurface} ); --m3e-state-layer-focus-color: var( --m3e-segmented-button-unselected-container-focus-color, ${d.color.onSurface} ); --m3e-ripple-color: var(--m3e-segmented-button-unselected-ripple-color, ${d.color.onSurface}); } :host(:not(:disabled):not([checked])) .label { color: var(--m3e-segmented-button-unselected-label-text-color, ${d.color.onSurface}); } :host(:not(:disabled):not([checked])) .icon { color: var(--m3e-segmented-button-unselected-icon-color, ${d.color.onSurface}); } :host(:not(.-with-icon)) .icon { margin-inline-start: calc(0px - var(--m3e-segmented-button-spacing, 0.5rem)); transition: margin-inline-start ${d.motion.spring.fastEffects}; } .check, ::slotted([slot="icon"]) { width: 1em; font-size: var(--m3e-segmented-button-icon-size, 1.125rem) !important; } :host(:not([checked])) .check, :host(.-hide-selection) .check, :host(.-hide-selection:not(.-with-icon)) .icon { display: none; } :host([checked]) .icon { margin-inline-start: 0; } :host([checked]:not(.-hide-selection)) ::slotted([slot="icon"]) { display: none !important; } :host(:disabled) .base { border-color: color-mix( in srgb, var(--m3e-segmented-button-disabled-outline-color, ${d.color.onSurface}) var(--m3e-segmented-button-disabled-outline-opacity, 12%), transparent ); border-inline-end-color: var( --_segmented-button-disabled-outline-color, color-mix( in srgb, var(--m3e-segmented-button-disabled-outline-color, ${d.color.onSurface}) var(--m3e-segmented-button-disabled-outline-opacity, 12%), transparent ) ); } :host(:disabled) .label { color: color-mix( in srgb, var(--m3e-segmented-button-disabled-label-text-color, ${d.color.onSurface}) var(--m3e-segmented-button-disabled-label-text-opacity, 38%), transparent ); } :host(:disabled) .icon { color: color-mix( in srgb, var(--m3e-segmented-button-disabled-icon-color, ${d.color.onSurface}) var(--m3e-segmented-button-disabled-icon-opacity, 38%), transparent ); } @media (prefers-reduced-motion) { .base, .icon, .label { transition: none; } } @media (forced-colors: active) { .base, .icon, .label { transition: none !important; } :host(:disabled) .label, :host(:disabled) .icon { color: GrayText; } :host(:not([selected]):not(:disabled)) .label, :host(:not([selected]):not(:disabled)) .icon { color: ButtonText; } :host(:not(:disabled)[checked]) .base { background-color: ButtonText; } :host(:not(:disabled)[checked]) .label, :host(:not(:disabled)[checked]) .icon { forced-color-adjust: none; color: ButtonFace; } :host { --m3e-segmented-button-outline-color: ButtonText; } }`,v([H(".focus-ring")],X.prototype,"_focusRing",void 0),v([H(".state-layer")],X.prototype,"_stateLayer",void 0),v([H(".ripple")],X.prototype,"_ripple",void 0),v([F()],X.prototype,"value",void 0),X=Q=v([$("m3e-button-segment")],X);let ne=class extends(u(i(n(p(a(l(c(e,"radiogroup")))))))){constructor(){super(...arguments),Y.add(this),ee.set(this,void 0),this[ie]=(new g).withWrap().withDirectionality(f.current).onActiveItemChange(()=>this[b].activeItem?.click()),this.multi=!1,this.hideSelectionIndicator=!1}get segments(){return this[b]?.items??[]}get selected(){return this[b]?.selectedItems??[]}get value(){const e=this.selected.map(e=>e.value);switch(e.length){case 0:return null;case 1:return e[0];default:return e}}get[(ee=new WeakMap,Y=new WeakSet,ie=b,m)](){const e=this.value;if(Array.isArray(e)){const t=new FormData;for(const o of e)t.append(this.name,o);return t}return e}connectedCallback(){super.connectedCallback(),this[b].multi=this.multi,this[b].disableRovingTabIndex(this.multi),function(e,t,o,s,i){if("m"===s)throw new TypeError("Private method is not writable");if("a"===s&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!i:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");"a"===s?i.call(e,o):i?i.value=o:t.set(e,o)}(this,ee,f.observe(()=>this[b].directionality=f.current),"f")}disconnectedCallback(){super.disconnectedCallback(),y(this,ee,"f")?.call(this)}update(e){super.update(e),e.has("disabled")&&(void 0!==e.get("disabled")||this.disabled)&&(this[b].disabled=this.disabled),e.has("multi")&&(this.role=this.multi?"group":"radiogroup",this[b].multi=this.multi,this[b].disableRovingTabIndex(this.multi)),(e.has("multi")||e.has("disabled"))&&(this.ariaDisabled=this.multi&&this.disabled?"true":null),e.has("hideSelectionIndicator")&&this.segments.forEach(e=>e.classList.toggle("-hide-selection",this.hideSelectionIndicator))}render(){return t`<slot @slotchange="${y(this,Y,"m",te)}" @keydown="${y(this,Y,"m",oe)}" @change="${y(this,Y,"m",se)}"></slot>`}};te=function(){const{added:e}=this[b].setItems([...this.querySelectorAll("m3e-button-segment")]);e.forEach(e=>e.classList.toggle("-hide-selection",this.hideSelectionIndicator))},oe=function(e){this.multi||this[b].onKeyDown(e)},se=function(e){e.stopPropagation(),this.dispatchEvent(new Event("change",{bubbles:!0}))},ne.styles=s`:host { display: inline-flex; vertical-align: middle; align-items: center; } ::slotted(:first-child) { border-start-start-radius: var(--m3e-segmented-button-start-shape, ${d.shape.corner.full}); border-end-start-radius: var(--m3e-segmented-button-start-shape, ${d.shape.corner.full}); } ::slotted(:last-child) { border-start-end-radius: var(--m3e-segmented-button-end-shape, ${d.shape.corner.full}); border-end-end-radius: var(--m3e-segmented-button-end-shape, ${d.shape.corner.full}); } ::slotted(:not(:first-child)) { --_segmented-button-left-border: none; }`,v([F({type:Boolean})],ne.prototype,"multi",void 0),v([F({attribute:"hide-selection-indicator",type:Boolean})],ne.prototype,"hideSelectionIndicator",void 0),ne=v([$("m3e-segmented-button")],ne);export{X as M3eButtonSegmentElement,ne as M3eSegmentedButtonElement};
270
40
  //# sourceMappingURL=index.min.js.map