@m3e/web 2.0.0 → 2.0.1
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/all.js +1161 -941
- package/dist/all.js.map +1 -1
- package/dist/all.min.js +59 -59
- package/dist/all.min.js.map +1 -1
- package/dist/bottom-sheet.js +1 -1
- package/dist/bottom-sheet.js.map +1 -1
- package/dist/bottom-sheet.min.js +1 -1
- package/dist/bottom-sheet.min.js.map +1 -1
- package/dist/button.js +387 -317
- package/dist/button.js.map +1 -1
- package/dist/button.min.js +2 -2
- package/dist/button.min.js.map +1 -1
- package/dist/card.js +73 -73
- package/dist/card.js.map +1 -1
- package/dist/card.min.js +5 -5
- package/dist/card.min.js.map +1 -1
- package/dist/checkbox.js +5 -1
- package/dist/checkbox.js.map +1 -1
- package/dist/checkbox.min.js +1 -1
- package/dist/checkbox.min.js.map +1 -1
- package/dist/core-a11y.js.map +1 -1
- package/dist/core-a11y.min.js.map +1 -1
- package/dist/core-bidi.js.map +1 -1
- package/dist/core-bidi.min.js.map +1 -1
- package/dist/core-layout.js.map +1 -1
- package/dist/core-layout.min.js.map +1 -1
- package/dist/core-platform.js.map +1 -1
- package/dist/core-platform.min.js.map +1 -1
- package/dist/core.js +42 -32
- package/dist/core.js.map +1 -1
- package/dist/core.min.js +2 -2
- package/dist/core.min.js.map +1 -1
- package/dist/css-custom-data.json +1356 -511
- package/dist/custom-elements.json +9890 -9217
- package/dist/fab.js +299 -258
- package/dist/fab.js.map +1 -1
- package/dist/fab.min.js +6 -6
- package/dist/fab.min.js.map +1 -1
- package/dist/form-field.js +10 -6
- package/dist/form-field.js.map +1 -1
- package/dist/form-field.min.js +4 -4
- package/dist/form-field.min.js.map +1 -1
- package/dist/html-custom-data.json +152 -152
- package/dist/icon-button.js +288 -232
- package/dist/icon-button.js.map +1 -1
- package/dist/icon-button.min.js +5 -5
- package/dist/icon-button.min.js.map +1 -1
- package/dist/list.js +18 -3
- package/dist/list.js.map +1 -1
- package/dist/list.min.js +8 -8
- package/dist/list.min.js.map +1 -1
- package/dist/menu.js +23 -12
- package/dist/menu.js.map +1 -1
- package/dist/menu.min.js +7 -7
- package/dist/menu.min.js.map +1 -1
- package/dist/nav-bar.js +1 -1
- package/dist/nav-bar.js.map +1 -1
- package/dist/nav-bar.min.js +1 -1
- package/dist/nav-bar.min.js.map +1 -1
- package/dist/nav-rail.js +1 -1
- package/dist/nav-rail.js.map +1 -1
- package/dist/nav-rail.min.js +4 -4
- package/dist/nav-rail.min.js.map +1 -1
- package/dist/option.js +1 -1
- package/dist/option.js.map +1 -1
- package/dist/option.min.js +1 -1
- package/dist/option.min.js.map +1 -1
- package/dist/radio-group.js +4 -0
- package/dist/radio-group.js.map +1 -1
- package/dist/radio-group.min.js +1 -1
- package/dist/radio-group.min.js.map +1 -1
- package/dist/slider.js +2 -2
- package/dist/slider.js.map +1 -1
- package/dist/slider.min.js +3 -3
- package/dist/slider.min.js.map +1 -1
- package/dist/snackbar.js.map +1 -1
- package/dist/snackbar.min.js.map +1 -1
- package/dist/split-button.js +1 -0
- package/dist/split-button.js.map +1 -1
- package/dist/split-button.min.js +1 -1
- package/dist/split-button.min.js.map +1 -1
- package/dist/src/bottom-sheet/BottomSheetElement.d.ts.map +1 -1
- package/dist/src/button/ButtonElement.d.ts +70 -0
- package/dist/src/button/ButtonElement.d.ts.map +1 -1
- package/dist/src/button/styles/ButtonSizeToken.d.ts.map +1 -1
- package/dist/src/button/styles/ButtonVariantToken.d.ts.map +1 -1
- package/dist/src/card/styles/CardVariantToken.d.ts.map +1 -1
- package/dist/src/checkbox/CheckboxElement.d.ts.map +1 -1
- package/dist/src/core/a11y/AriaDescriber.d.ts +3 -1
- package/dist/src/core/a11y/AriaDescriber.d.ts.map +1 -1
- package/dist/src/core/a11y/InteractivityChecker.d.ts +3 -1
- package/dist/src/core/a11y/InteractivityChecker.d.ts.map +1 -1
- package/dist/src/core/a11y/LiveAnnouncer.d.ts +3 -1
- package/dist/src/core/a11y/LiveAnnouncer.d.ts.map +1 -1
- package/dist/src/core/bidi/Directionality.d.ts +3 -1
- package/dist/src/core/bidi/Directionality.d.ts.map +1 -1
- package/dist/src/core/layout/BreakpointObserver.d.ts +3 -1
- package/dist/src/core/layout/BreakpointObserver.d.ts.map +1 -1
- package/dist/src/core/platform/Platform.d.ts +3 -1
- package/dist/src/core/platform/Platform.d.ts.map +1 -1
- package/dist/src/core/shared/controllers/PressedController.d.ts.map +1 -1
- package/dist/src/core/shared/primitives/FocusRingElement.d.ts +2 -0
- package/dist/src/core/shared/primitives/FocusRingElement.d.ts.map +1 -1
- package/dist/src/core/shared/primitives/FocusRingToken.d.ts +4 -0
- package/dist/src/core/shared/primitives/FocusRingToken.d.ts.map +1 -1
- package/dist/src/core/shared/primitives/ScrollContainerElement.d.ts.map +1 -1
- package/dist/src/fab/FabElement.d.ts +41 -0
- package/dist/src/fab/FabElement.d.ts.map +1 -1
- package/dist/src/fab/styles/FabSizeToken.d.ts.map +1 -1
- package/dist/src/fab/styles/FabVariantToken.d.ts.map +1 -1
- package/dist/src/form-field/FormFieldElement.d.ts.map +1 -1
- package/dist/src/icon-button/IconButtonElement.d.ts +56 -0
- package/dist/src/icon-button/IconButtonElement.d.ts.map +1 -1
- package/dist/src/icon-button/styles/IconButtonSizeToken.d.ts.map +1 -1
- package/dist/src/icon-button/styles/IconButtonVariantToken.d.ts.map +1 -1
- package/dist/src/list/ListItemButtonElement.d.ts +1 -0
- package/dist/src/list/ListItemButtonElement.d.ts.map +1 -1
- package/dist/src/list/ListItemElement.d.ts.map +1 -1
- package/dist/src/list/ListOptionElement.d.ts +1 -0
- package/dist/src/list/ListOptionElement.d.ts.map +1 -1
- package/dist/src/menu/MenuElement.d.ts +2 -0
- package/dist/src/menu/MenuElement.d.ts.map +1 -1
- package/dist/src/menu/MenuItemElementBase.d.ts +1 -0
- package/dist/src/menu/MenuItemElementBase.d.ts.map +1 -1
- package/dist/src/nav-rail/NavRailElement.d.ts.map +1 -1
- package/dist/src/option/OptionPanelElement.d.ts.map +1 -1
- package/dist/src/radio-group/RadioElement.d.ts.map +1 -1
- package/dist/src/slider/SliderThumbElement.d.ts.map +1 -1
- package/dist/src/snackbar/Snackbar.d.ts +3 -1
- package/dist/src/snackbar/Snackbar.d.ts.map +1 -1
- package/dist/src/split-button/SplitButtonElement.d.ts.map +1 -1
- package/dist/src/switch/SwitchElement.d.ts.map +1 -1
- package/dist/src/tabs/TabElement.d.ts.map +1 -1
- package/dist/src/tabs/TabsElement.d.ts.map +1 -1
- package/dist/switch.js +5 -1
- package/dist/switch.js.map +1 -1
- package/dist/switch.min.js +2 -2
- package/dist/switch.min.js.map +1 -1
- package/dist/tabs.js +2 -2
- package/dist/tabs.js.map +1 -1
- package/dist/tabs.min.js +3 -3
- package/dist/tabs.min.js.map +1 -1
- package/dist/tooltip.js +1 -1
- package/dist/tooltip.js.map +1 -1
- package/dist/tooltip.min.js +1 -1
- package/dist/tooltip.min.js.map +1 -1
- package/package.json +1 -1
package/dist/tabs.min.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
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 t,html as e,css as i,nothing as s,unsafeCSS as o}from"lit";import{Selected as r,HtmlFor as a,KeyboardClick as n,Focusable as l,Disabled as c,AttachInternals as h,Role as d,DesignToken as p,ResizeController as u}from"@m3e/web/core";import{addAriaReferencedId as b,removeAriaReferencedId as
|
|
6
|
+
import{LitElement as t,html as e,css as i,nothing as s,unsafeCSS as o}from"lit";import{Selected as r,HtmlFor as a,KeyboardClick as n,Focusable as l,Disabled as c,AttachInternals as h,Role as d,DesignToken as p,ResizeController as u}from"@m3e/web/core";import{addAriaReferencedId as b,removeAriaReferencedId as f,selectionManager as m,SelectionManager as v}from"@m3e/web/core/a11y";import{M3eDirectionality as g}from"@m3e/web/core/bidi";function $(t,e,i,s){var o,r=arguments.length,a=r<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,e,i,s);else for(var n=t.length-1;n>=0;n--)(o=t[n])&&(a=(r<3?o(a):r>3?o(e,i,a):o(e,i))||a);return r>3&&a&&Object.defineProperty(e,i,a),a}function _(t,e,i,s){if("a"===i&&!s)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?t!==e||!s:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===i?s:"a"===i?s.call(t):s?s.value:e.get(t)}"function"==typeof SuppressedError&&SuppressedError;
|
|
7
7
|
/**
|
|
8
8
|
* @license
|
|
9
9
|
* Copyright 2017 Google LLC
|
|
@@ -36,13 +36,13 @@ const W={attribute:!0,type:String,converter:z,reflect:!1,hasChanged:j},q=(t=W,e,
|
|
|
36
36
|
* Copyright 2017 Google LLC
|
|
37
37
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
38
38
|
*/
|
|
39
|
-
function Z(t,e){return(e,i,s)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Reflect.decorate&&"object"!=typeof e&&Object.defineProperty(t,e,i),i))(e,i,{get(){return(e=>e.renderRoot?.querySelector(t)??null)(this)}})}var K,G,J,F;let Q=F=class extends(r(a(n(l(c(h(d(t,"tab"),!0))))))){constructor(){super(...arguments),K.add(this),G.set(this,t=>_(this,K,"m",J).call(this,t))}attach(t){super.attach(t),t.id=t.id||"m3e-tab-panel-"+F.__nextId++,b(this,"aria-controls",t.id)}detach(){this.control&&this.control.id&&
|
|
39
|
+
function Z(t,e){return(e,i,s)=>((t,e,i)=>(i.configurable=!0,i.enumerable=!0,Reflect.decorate&&"object"!=typeof e&&Object.defineProperty(t,e,i),i))(e,i,{get(){return(e=>e.renderRoot?.querySelector(t)??null)(this)}})}var K,G,J,F;let Q=F=class extends(r(a(n(l(c(h(d(t,"tab"),!0))))))){constructor(){super(...arguments),K.add(this),G.set(this,t=>_(this,K,"m",J).call(this,t))}attach(t){super.attach(t),t.id=t.id||"m3e-tab-panel-"+F.__nextId++,b(this,"aria-controls",t.id)}detach(){this.control&&this.control.id&&f(this,"aria-controls",this.control.id),super.detach()}connectedCallback(){super.connectedCallback(),this.addEventListener("click",_(this,G,"f"))}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",_(this,G,"f"))}firstUpdated(t){super.firstUpdated(t),[this._focusRing,this._stateLayer,this._ripple].forEach(t=>t?.attach(this))}update(t){super.update(t),t.has("selected")&&this.closest("m3e-tabs")?.[m].notifySelectionChange(this)}render(){return e`<div class="base"><m3e-state-layer class="state-layer" ?disabled="${this.disabled}"></m3e-state-layer><m3e-focus-ring class="focus-ring" inward ?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"><slot name="icon" aria-hidden="true"></slot><span class="label"><slot></slot></span></div></div>`}};G=new WeakMap,K=new WeakSet,J=function(t){this.disabled&&(t.preventDefault(),t.stopImmediatePropagation()),t.defaultPrevented||this.selected||(this.selected=!0,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))?(this.closest("m3e-tabs")?.[m].notifySelectionChange(this),this.dispatchEvent(new Event("change",{bubbles:!0}))):this.selected=!1)},Q.styles=i`:host { display: inline-block; outline: none; user-select: none; height: calc(var(--_tab-height) + ${p.density.calc(-3)}); font-size: var(--m3e-tab-font-size, ${p.typescale.standard.title.small.fontSize}); font-weight: var(--m3e-tab-font-weight, ${p.typescale.standard.title.small.fontWeight}); line-height: var(--m3e-tab-line-height, ${p.typescale.standard.title.small.lineHeight}); letter-spacing: var(--m3e-tab-tracking, ${p.typescale.standard.title.small.tracking}); flex-grow: var(--_tab-grow); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } :host(:not(:disabled)) { cursor: pointer; } .base { box-sizing: border-box; vertical-align: middle; display: inline-flex; align-items: center; justify-content: center; position: relative; width: 100%; height: 100%; padding-inline-start: var(--m3e-tab-padding-start, 1.5rem); padding-inline-end: var(--m3e-tab-padding-end, 1.5rem); } .touch { position: absolute; height: 3rem; left: 0; right: 0; } .focus-ring { border-radius: var(--m3e-tab-focus-ring-shape, ${p.shape.corner.large}); } :host([selected]:focus-within) .focus-ring { top: var(--_tab-focus-ring-top-offset, 0); bottom: var(--_tab-focus-ring-bottom-offset, 0); } :host([selected]:not(:disabled)) .base { color: var(--m3e-tab-selected-color, var(--_tab-selected-color, ${p.color.primary})); --m3e-state-layer-hover-color: var( --m3e-tab-selected-container-hover-color, var(--_tab-selected-container-hover-color, ${p.color.primary}) ); --m3e-state-layer-focus-color: var( --_tab-selected-container-focus-color, var(--m3e-tab-selected-container-focus-color, ${p.color.primary}) ); --m3e-ripple-color: var( --_tab-selected-ripple-color, var(--m3e-tab-selected-ripple-color, ${p.color.primary}) ); } :host(:not([selected]):not(:disabled)) .base { color: var(--m3e-tab-unselected-color, ${p.color.onSurfaceVariant}); --m3e-state-layer-hover-color: var(--m3e-tab-unselected-container-hover-color, ${p.color.onSurface}); --m3e-state-layer-focus-color: var(--m3e-tab-unselected-container-focus-color, ${p.color.onSurface}); --m3e-ripple-color: var(--m3e-tab-unselected-ripple-color, ${p.color.onSurface}); } :host(:disabled) .base { color: color-mix( in srgb, var(--m3e-tab-disabled-color, ${p.color.onSurface}) var(--m3e-tab-disabled-opacity, 38%), transparent ); } .wrapper { display: inline-flex; align-items: center; white-space: nowrap; flex-direction: var(--_tab-direction); justify-content: center; column-gap: var(--m3e-tab-spacing, 0.5rem); } ::slotted([slot="icon"]) { width: 1em; font-size: var(--m3e-tab-icon-size, 1.5rem) !important; } @media (forced-colors: active) { :host([selected]:not(:disabled)) .base { color: ButtonText; } :host(:not([selected]):not(:disabled)) .base { color: ButtonText; } :host(:disabled) .base { color: GrayText; } }`,Q.__nextId=0,$([Z(".focus-ring")],Q.prototype,"_focusRing",void 0),$([Z(".state-layer")],Q.prototype,"_stateLayer",void 0),$([Z(".ripple")],Q.prototype,"_ripple",void 0),$([Z(".label")],Q.prototype,"label",void 0),Q=F=$([y("m3e-tab")],Q);let X=class extends(d(t,"tabpanel")){connectedCallback(){super.connectedCallback(),this.slot="panel"}render(){return e`<slot></slot>`}};X.styles=i`:host { display: block; overflow-y: auto; scrollbar-width: ${p.scrollbar.width}; scrollbar-color: ${p.scrollbar.color}; }`,X=$([y("m3e-tab-panel")],X);
|
|
40
40
|
/**
|
|
41
41
|
* @license
|
|
42
42
|
* Copyright 2017 Google LLC
|
|
43
43
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
44
44
|
*/
|
|
45
|
-
const Y=globalThis,tt=Y.trustedTypes,et=tt?tt.createPolicy("lit-html",{createHTML:t=>t}):void 0,it="$lit$",st=`lit$${Math.random().toFixed(9).slice(2)}$`,ot="?"+st,rt=`<${ot}>`,at=document,nt=()=>at.createComment(""),lt=t=>null===t||"object"!=typeof t&&"function"!=typeof t,ct=Array.isArray,ht="[ \t\n\f\r]",dt=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,pt=/-->/g,ut=/>/g,bt=RegExp(`>|${ht}(?:([^\\s"'>=/]+)(${ht}*=${ht}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),mt=/'/g,ft=/"/g,vt=/^(?:script|style|textarea|title)$/i,gt=Symbol.for("lit-noChange"),$t=Symbol.for("lit-nothing"),_t=new WeakMap,yt=at.createTreeWalker(at,129);function At(t,e){if(!ct(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==et?et.createHTML(e):e}const wt=(t,e)=>{const i=t.length-1,s=[];let o,r=2===e?"<svg>":3===e?"<math>":"",a=dt;for(let e=0;e<i;e++){const i=t[e];let n,l,c=-1,h=0;for(;h<i.length&&(a.lastIndex=h,l=a.exec(i),null!==l);)h=a.lastIndex,a===dt?"!--"===l[1]?a=pt:void 0!==l[1]?a=ut:void 0!==l[2]?(vt.test(l[2])&&(o=RegExp("</"+l[2],"g")),a=bt):void 0!==l[3]&&(a=bt):a===bt?">"===l[0]?(a=o??dt,c=-1):void 0===l[1]?c=-2:(c=a.lastIndex-l[2].length,n=l[1],a=void 0===l[3]?bt:'"'===l[3]?ft:mt):a===ft||a===mt?a=bt:a===pt||a===ut?a=dt:(a=bt,o=void 0);const d=a===bt&&t[e+1].startsWith("/>")?" ":"";r+=a===dt?i+rt:c>=0?(s.push(n),i.slice(0,c)+it+i.slice(c)+st+d):i+st+(-2===c?e:d)}return[At(t,r+(t[i]||"<?>")+(2===e?"</svg>":3===e?"</math>":"")),s]};class xt{constructor({strings:t,_$litType$:e},i){let s;this.parts=[];let o=0,r=0;const a=t.length-1,n=this.parts,[l,c]=wt(t,e);if(this.el=xt.createElement(l,i),yt.currentNode=this.el.content,2===e||3===e){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes)}for(;null!==(s=yt.nextNode())&&n.length<a;){if(1===s.nodeType){if(s.hasAttributes())for(const t of s.getAttributeNames())if(t.endsWith(it)){const e=c[r++],i=s.getAttribute(t).split(st),a=/([.?@])?(.*)/.exec(e);n.push({type:1,index:o,name:a[2],strings:i,ctor:"."===a[1]?kt:"?"===a[1]?Tt:"@"===a[1]?Ut:Ct}),s.removeAttribute(t)}else t.startsWith(st)&&(n.push({type:6,index:o}),s.removeAttribute(t));if(vt.test(s.tagName)){const t=s.textContent.split(st),e=t.length-1;if(e>0){s.textContent=tt?tt.emptyScript:"";for(let i=0;i<e;i++)s.append(t[i],nt()),yt.nextNode(),n.push({type:2,index:++o});s.append(t[e],nt())}}}else if(8===s.nodeType)if(s.data===ot)n.push({type:2,index:o});else{let t=-1;for(;-1!==(t=s.data.indexOf(st,t+1));)n.push({type:7,index:o}),t+=st.length-1}o++}}static createElement(t,e){const i=at.createElement("template");return i.innerHTML=t,i}}function Et(t,e,i=t,s){if(e===gt)return e;let o=void 0!==s?i._$Co?.[s]:i._$Cl;const r=lt(e)?void 0:e._$litDirective$;return o?.constructor!==r&&(o?._$AO?.(!1),void 0===r?o=void 0:(o=new r(t),o._$AT(t,i,s)),void 0!==s?(i._$Co??=[])[s]=o:i._$Cl=o),void 0!==o&&(e=Et(t,o._$AS(t,e.values),o,s)),e}class St{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:e},parts:i}=this._$AD,s=(t?.creationScope??at).importNode(e,!0);yt.currentNode=s;let o=yt.nextNode(),r=0,a=0,n=i[0];for(;void 0!==n;){if(r===n.index){let e;2===n.type?e=new Pt(o,o.nextSibling,this,t):1===n.type?e=new n.ctor(o,n.name,n.strings,this,t):6===n.type&&(e=new Ot(o,this,t)),this._$AV.push(e),n=i[++a]}r!==n?.index&&(o=yt.nextNode(),r++)}return yt.currentNode=at,s}p(t){let e=0;for(const i of this._$AV)void 0!==i&&(void 0!==i.strings?(i._$AI(t,i,e),e+=i.strings.length-2):i._$AI(t[e])),e++}}class Pt{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,e,i,s){this.type=2,this._$AH=$t,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=i,this.options=s,this._$Cv=s?.isConnected??!0}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return void 0!==e&&11===t?.nodeType&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=Et(this,t,e),lt(t)?t===$t||null==t||""===t?(this._$AH!==$t&&this._$AR(),this._$AH=$t):t!==this._$AH&&t!==gt&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):(t=>ct(t)||"function"==typeof t?.[Symbol.iterator])(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==$t&<(this._$AH)?this._$AA.nextSibling.data=t:this.T(at.createTextNode(t)),this._$AH=t}$(t){const{values:e,_$litType$:i}=t,s="number"==typeof i?this._$AC(t):(void 0===i.el&&(i.el=xt.createElement(At(i.h,i.h[0]),this.options)),i);if(this._$AH?._$AD===s)this._$AH.p(e);else{const t=new St(s,this),i=t.u(this.options);t.p(e),this.T(i),this._$AH=t}}_$AC(t){let e=_t.get(t.strings);return void 0===e&&_t.set(t.strings,e=new xt(t)),e}k(t){ct(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let i,s=0;for(const o of t)s===e.length?e.push(i=new Pt(this.O(nt()),this.O(nt()),this,this.options)):i=e[s],i._$AI(o),s++;s<e.length&&(this._$AR(i&&i._$AB.nextSibling,s),e.length=s)}_$AR(t=this._$AA.nextSibling,e){for(this._$AP?.(!1,!0,e);t!==this._$AB;){const e=t.nextSibling;t.remove(),t=e}}setConnected(t){void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t))}}class Ct{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,i,s,o){this.type=1,this._$AH=$t,this._$AN=void 0,this.element=t,this.name=e,this._$AM=s,this.options=o,i.length>2||""!==i[0]||""!==i[1]?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=$t}_$AI(t,e=this,i,s){const o=this.strings;let r=!1;if(void 0===o)t=Et(this,t,e,0),r=!lt(t)||t!==this._$AH&&t!==gt,r&&(this._$AH=t);else{const s=t;let a,n;for(t=o[0],a=0;a<o.length-1;a++)n=Et(this,s[i+a],e,a),n===gt&&(n=this._$AH[a]),r||=!lt(n)||n!==this._$AH[a],n===$t?t=$t:t!==$t&&(t+=(n??"")+o[a+1]),this._$AH[a]=n}r&&!s&&this.j(t)}j(t){t===$t?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class kt extends Ct{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===$t?void 0:t}}class Tt extends Ct{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==$t)}}class Ut extends Ct{constructor(t,e,i,s,o){super(t,e,i,s,o),this.type=5}_$AI(t,e=this){if((t=Et(this,t,e,0)??$t)===gt)return;const i=this._$AH,s=t===$t&&i!==$t||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,o=t!==$t&&(i===$t||s);s&&this.element.removeEventListener(this.name,this,i),o&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t)}}class Ot{constructor(t,e,i){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(t){Et(this,t)}}const Mt=Y.litHtmlPolyfillSupport;Mt?.(xt,Pt),(Y.litHtmlVersions??=[]).push("3.3.1");var Ht,Nt,It,Rt,Lt,zt,jt,Bt,Dt;let Wt=class extends(h(t)){constructor(){super(),Ht.add(this),Nt.set(this,void 0),this._selectedIndex=null,this[Dt]=(new v).onSelectedItemsChange(()=>_(this,Ht,"m",jt).call(this)).withHomeAndEnd().withWrap().withDirectionality(g.current),this.disablePagination=!1,this.headerPosition="before",this.variant="secondary",this.stretch=!1,this.previousPageLabel="Previous page",this.nextPageLabel="Next page",new u(this,{skipInitial:!0,callback:()=>{this.classList.toggle("-no-animate",!0),_(this,Ht,"m",Bt).call(this)}})}get tabs(){return this[f]?.items??[]}get selectedTab(){return null!==this._selectedIndex?this.tabs[this._selectedIndex]??null:null}get selectedIndex(){return this._selectedIndex??-1}set selectedIndex(t){if(t>=0&&t<this.tabs.length)this.tabs[t].selected=!0;else{const t=this.selectedTab;t&&(t.selected=!1)}}connectedCallback(){super.connectedCallback(),this.classList.toggle("-no-animate",!0),function(t,e,i,s,o){if("m"===s)throw new TypeError("Private method is not writable");if("a"===s&&!o)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e||!o:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");"a"===s?o.call(t,i):o?o.value=i:e.set(t,i)}(this,Nt,g.observe(()=>{this.requestUpdate(),this[f].directionality=g.current}),"f")}disconnectedCallback(){super.disconnectedCallback(),_(this,Nt,"f")?.call(this)}updated(t){super.updated(t),(t.has("variant")||t.has("stretch"))&&null!==this._selectedIndex&&_(this,Ht,"m",Bt).call(this)}render(){let t;return this.selectedTab?.control&&(t=[...this.querySelectorAll("[slot='panel']")].indexOf(this.selectedTab.control),-1===t&&(t=void 0)),e`${"before"===this.headerPosition?_(this,Ht,"m",It).call(this):s}<m3e-slide class="tabs" selected-index="${(t=>t??$t)(t)}"><slot name="panel"></slot></m3e-slide>${"after"===this.headerPosition?_(this,Ht,"m",It).call(this):s}`}};Nt=new WeakMap,Ht=new WeakSet,Dt=f,It=function(){return e`<m3e-slide-group class="tablist" threshold="8" previous-page-label="${this.previousPageLabel}" next-page-label="${this.nextPageLabel}" ?disabled="${this.disablePagination}"><slot name="prev-icon" slot="prev-icon">${"ltr"===g.current?e`<svg class="prev icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M640-80 240-480l400-400 71 71-329 329 329 329-71 71Z"/></svg>`:e`<svg class="next icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m321-80-71-71 329-329-329-329 71-71 400 400L321-80Z"/></svg>`}</slot><slot name="next-icon" slot="next-icon">${"ltr"===g.current?e`<svg class="next icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m321-80-71-71 329-329-329-329 71-71 400 400L321-80Z"/></svg>`:e`<svg class="prev icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M640-80 240-480l400-400 71 71-329 329 329 329-71 71Z"/></svg>`}</slot><div class="header" role="tablist"><div class="tabs"><slot @slotchange="${_(this,Ht,"m",Rt)}" @keydown="${_(this,Ht,"m",Lt)}" @change="${_(this,Ht,"m",zt)}"></slot></div><div class="ink-bar" aria-hidden="true"><div class="active-indicator"></div></div></div></m3e-slide-group>`},Rt=function(){this[f].setItems([...this.querySelectorAll("m3e-tab")])},Lt=function(t){this[f].onKeyDown(t)},zt=function(t){t.stopPropagation(),this.dispatchEvent(new Event("change",{bubbles:!0}))},jt=function(){const t=this[f].selectedItems[0];let e=t?this.tabs.indexOf(t):null;-1===e&&(e=null),this._selectedIndex=e,_(this,Ht,"m",Bt).call(this)},Bt=function(){if(!this._tablist)return;const t=this[f].selectedItems[0];let e=0,i=0;if(t&&null!==this._selectedIndex){for(let t=0;t<this._selectedIndex;t++)e+=this.tabs[t].clientWidth;i=t.clientWidth,"primary"===this.variant&&t.label&&(e+=t.label.offsetLeft,i=t.label.clientWidth,i<24&&(e-=(24-i)/2,i=24))}this._tablist.style.setProperty("--_tabs-active-tab-position",`${e}px`),this._tablist.style.setProperty("--_tabs-active-tab-size",`${i}px`),i>0&&this.classList.contains("-no-animate")&&setTimeout(()=>this.classList.toggle("-no-animate",!1))},Wt.styles=i`:host { display: flex; flex-direction: column; position: relative; } .tablist { position: relative; box-sizing: border-box; flex: none; } ::slotted(prev-icon), ::slotted(next-icon), .icon { width: 1em; font-size: var(--m3e-tabs-paginator-button-icon-size, var(--m3e-icon-button-icon-size, 1.5rem)) !important; } .header { display: flex; flex-direction: column; } .tabs { display: flex; flex-wrap: nowrap; align-items: center; } .ink-bar { box-sizing: border-box; height: var(--_tabs-active-indicator-thickness); } .active-indicator { position: relative; height: var(--_tabs-active-indicator-thickness); left: calc(var(--_tabs-active-tab-position) + var(--_tabs-activate-indicator-inset, 0px)); width: calc(var(--_tabs-active-tab-size) - calc(var(--_tabs-activate-indicator-inset, 0px) * 2)); background-color: var(--m3e-tabs-active-indicator-color, ${p.color.primary}); transition: ${o(`left var(--m3e-slide-animation-duration, ${p.motion.duration.long2}) ${p.motion.easing.standard},\n width var(--m3e-slide-animation-duration, ${p.motion.duration.long2}) ${p.motion.easing.standard}`)}; } :host([header-position="after"]) .header { flex-direction: column-reverse; } :host([header-position="before"]) .ink-bar { margin-top: calc(0px - var(--_tabs-active-indicator-thickness)); } :host([header-position="before"]) .tablist { --m3e-slide-group-divider-bottom: var(--m3e-divider-thickness, 1px) solid var(--m3e-divider-color, ${p.color.outlineVariant}); } :host([header-position="after"]) .ink-bar { margin-bottom: calc(0px - var(--_tabs-active-indicator-thickness)); } :host([header-position="after"]) .tablist { --m3e-slide-group-divider-top: var(--m3e-divider-thickness, 1px) solid var(--m3e-divider-color, ${p.color.outlineVariant}); } :host([header-position="before"][variant="primary"]) .active-indicator { border-radius: var(--m3e-tabs-primary-before-active-indicator-shape, ${p.shape.corner.extraSmallTop}); } :host([header-position="after"][variant="primary"]) .active-indicator { border-radius: var(--m3e-tabs-primary-after-active-indicator-shape, ${p.shape.corner.extraSmallBottom}); } .tabs { flex: 1 1 auto; } :host([variant="primary"]) .tablist { --_tabs-activate-indicator-inset: var(--m3e-tabs-primary-active-indicator-inset, 0.125rem); --_tabs-active-indicator-thickness: var(--m3e-tabs-primary-active-indicator-thickness, 0.1875rem); --_tab-height: 4rem; } :host([header-position="before"]) .tablist { --_tab-focus-ring-bottom-offset: calc(var(--_tabs-active-indicator-thickness) + 1px); } :host([header-position="after"]) .tablist { --_tab-focus-ring-top-offset: calc(var(--_tabs-active-indicator-thickness) + 2px); } :host([header-position="before"][variant="primary"]) .tablist { --_tab-direction: column; } :host([header-position="after"][variant="primary"]) .tablist { --_tab-direction: column-reverse; } :host([variant="secondary"]) .tablist { --_tabs-active-indicator-thickness: var(--m3e-tabs-secondary-active-indicator-thickness, 0.125rem); --_tab-height: 3rem; } :host([stretch]) .header { width: 100%; --_tab-grow: 1; } :host(.-no-animate) .active-indicator { transition: none; } @media (prefers-reduced-motion) { .active-indicator { transition: none; } } @media (forced-colors: active) { .active-indicator { background-color: ButtonText; --m3e-divider-color: GrayText; } }`,$([Z(".tablist")],Wt.prototype,"_tablist",void 0),$([function(t){return V({...t,state:!0,attribute:!1})}
|
|
45
|
+
const Y=globalThis,tt=Y.trustedTypes,et=tt?tt.createPolicy("lit-html",{createHTML:t=>t}):void 0,it="$lit$",st=`lit$${Math.random().toFixed(9).slice(2)}$`,ot="?"+st,rt=`<${ot}>`,at=document,nt=()=>at.createComment(""),lt=t=>null===t||"object"!=typeof t&&"function"!=typeof t,ct=Array.isArray,ht="[ \t\n\f\r]",dt=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,pt=/-->/g,ut=/>/g,bt=RegExp(`>|${ht}(?:([^\\s"'>=/]+)(${ht}*=${ht}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),ft=/'/g,mt=/"/g,vt=/^(?:script|style|textarea|title)$/i,gt=Symbol.for("lit-noChange"),$t=Symbol.for("lit-nothing"),_t=new WeakMap,yt=at.createTreeWalker(at,129);function At(t,e){if(!ct(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==et?et.createHTML(e):e}const wt=(t,e)=>{const i=t.length-1,s=[];let o,r=2===e?"<svg>":3===e?"<math>":"",a=dt;for(let e=0;e<i;e++){const i=t[e];let n,l,c=-1,h=0;for(;h<i.length&&(a.lastIndex=h,l=a.exec(i),null!==l);)h=a.lastIndex,a===dt?"!--"===l[1]?a=pt:void 0!==l[1]?a=ut:void 0!==l[2]?(vt.test(l[2])&&(o=RegExp("</"+l[2],"g")),a=bt):void 0!==l[3]&&(a=bt):a===bt?">"===l[0]?(a=o??dt,c=-1):void 0===l[1]?c=-2:(c=a.lastIndex-l[2].length,n=l[1],a=void 0===l[3]?bt:'"'===l[3]?mt:ft):a===mt||a===ft?a=bt:a===pt||a===ut?a=dt:(a=bt,o=void 0);const d=a===bt&&t[e+1].startsWith("/>")?" ":"";r+=a===dt?i+rt:c>=0?(s.push(n),i.slice(0,c)+it+i.slice(c)+st+d):i+st+(-2===c?e:d)}return[At(t,r+(t[i]||"<?>")+(2===e?"</svg>":3===e?"</math>":"")),s]};class xt{constructor({strings:t,_$litType$:e},i){let s;this.parts=[];let o=0,r=0;const a=t.length-1,n=this.parts,[l,c]=wt(t,e);if(this.el=xt.createElement(l,i),yt.currentNode=this.el.content,2===e||3===e){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes)}for(;null!==(s=yt.nextNode())&&n.length<a;){if(1===s.nodeType){if(s.hasAttributes())for(const t of s.getAttributeNames())if(t.endsWith(it)){const e=c[r++],i=s.getAttribute(t).split(st),a=/([.?@])?(.*)/.exec(e);n.push({type:1,index:o,name:a[2],strings:i,ctor:"."===a[1]?kt:"?"===a[1]?Tt:"@"===a[1]?Ut:Ct}),s.removeAttribute(t)}else t.startsWith(st)&&(n.push({type:6,index:o}),s.removeAttribute(t));if(vt.test(s.tagName)){const t=s.textContent.split(st),e=t.length-1;if(e>0){s.textContent=tt?tt.emptyScript:"";for(let i=0;i<e;i++)s.append(t[i],nt()),yt.nextNode(),n.push({type:2,index:++o});s.append(t[e],nt())}}}else if(8===s.nodeType)if(s.data===ot)n.push({type:2,index:o});else{let t=-1;for(;-1!==(t=s.data.indexOf(st,t+1));)n.push({type:7,index:o}),t+=st.length-1}o++}}static createElement(t,e){const i=at.createElement("template");return i.innerHTML=t,i}}function Et(t,e,i=t,s){if(e===gt)return e;let o=void 0!==s?i._$Co?.[s]:i._$Cl;const r=lt(e)?void 0:e._$litDirective$;return o?.constructor!==r&&(o?._$AO?.(!1),void 0===r?o=void 0:(o=new r(t),o._$AT(t,i,s)),void 0!==s?(i._$Co??=[])[s]=o:i._$Cl=o),void 0!==o&&(e=Et(t,o._$AS(t,e.values),o,s)),e}class St{constructor(t,e){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:e},parts:i}=this._$AD,s=(t?.creationScope??at).importNode(e,!0);yt.currentNode=s;let o=yt.nextNode(),r=0,a=0,n=i[0];for(;void 0!==n;){if(r===n.index){let e;2===n.type?e=new Pt(o,o.nextSibling,this,t):1===n.type?e=new n.ctor(o,n.name,n.strings,this,t):6===n.type&&(e=new Ot(o,this,t)),this._$AV.push(e),n=i[++a]}r!==n?.index&&(o=yt.nextNode(),r++)}return yt.currentNode=at,s}p(t){let e=0;for(const i of this._$AV)void 0!==i&&(void 0!==i.strings?(i._$AI(t,i,e),e+=i.strings.length-2):i._$AI(t[e])),e++}}class Pt{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,e,i,s){this.type=2,this._$AH=$t,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=i,this.options=s,this._$Cv=s?.isConnected??!0}get parentNode(){let t=this._$AA.parentNode;const e=this._$AM;return void 0!==e&&11===t?.nodeType&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=Et(this,t,e),lt(t)?t===$t||null==t||""===t?(this._$AH!==$t&&this._$AR(),this._$AH=$t):t!==this._$AH&&t!==gt&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):(t=>ct(t)||"function"==typeof t?.[Symbol.iterator])(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==$t&<(this._$AH)?this._$AA.nextSibling.data=t:this.T(at.createTextNode(t)),this._$AH=t}$(t){const{values:e,_$litType$:i}=t,s="number"==typeof i?this._$AC(t):(void 0===i.el&&(i.el=xt.createElement(At(i.h,i.h[0]),this.options)),i);if(this._$AH?._$AD===s)this._$AH.p(e);else{const t=new St(s,this),i=t.u(this.options);t.p(e),this.T(i),this._$AH=t}}_$AC(t){let e=_t.get(t.strings);return void 0===e&&_t.set(t.strings,e=new xt(t)),e}k(t){ct(this._$AH)||(this._$AH=[],this._$AR());const e=this._$AH;let i,s=0;for(const o of t)s===e.length?e.push(i=new Pt(this.O(nt()),this.O(nt()),this,this.options)):i=e[s],i._$AI(o),s++;s<e.length&&(this._$AR(i&&i._$AB.nextSibling,s),e.length=s)}_$AR(t=this._$AA.nextSibling,e){for(this._$AP?.(!1,!0,e);t!==this._$AB;){const e=t.nextSibling;t.remove(),t=e}}setConnected(t){void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t))}}class Ct{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,e,i,s,o){this.type=1,this._$AH=$t,this._$AN=void 0,this.element=t,this.name=e,this._$AM=s,this.options=o,i.length>2||""!==i[0]||""!==i[1]?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=$t}_$AI(t,e=this,i,s){const o=this.strings;let r=!1;if(void 0===o)t=Et(this,t,e,0),r=!lt(t)||t!==this._$AH&&t!==gt,r&&(this._$AH=t);else{const s=t;let a,n;for(t=o[0],a=0;a<o.length-1;a++)n=Et(this,s[i+a],e,a),n===gt&&(n=this._$AH[a]),r||=!lt(n)||n!==this._$AH[a],n===$t?t=$t:t!==$t&&(t+=(n??"")+o[a+1]),this._$AH[a]=n}r&&!s&&this.j(t)}j(t){t===$t?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class kt extends Ct{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===$t?void 0:t}}class Tt extends Ct{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==$t)}}class Ut extends Ct{constructor(t,e,i,s,o){super(t,e,i,s,o),this.type=5}_$AI(t,e=this){if((t=Et(this,t,e,0)??$t)===gt)return;const i=this._$AH,s=t===$t&&i!==$t||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,o=t!==$t&&(i===$t||s);s&&this.element.removeEventListener(this.name,this,i),o&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t)}}class Ot{constructor(t,e,i){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(t){Et(this,t)}}const Mt=Y.litHtmlPolyfillSupport;Mt?.(xt,Pt),(Y.litHtmlVersions??=[]).push("3.3.1");var Ht,Nt,It,Rt,Lt,zt,jt,Bt,Dt;let Wt=class extends(h(t)){constructor(){super(),Ht.add(this),Nt.set(this,void 0),this._selectedIndex=null,this[Dt]=(new v).onSelectedItemsChange(()=>_(this,Ht,"m",jt).call(this)).withHomeAndEnd().withWrap().withDirectionality(g.current),this.disablePagination=!1,this.headerPosition="before",this.variant="secondary",this.stretch=!1,this.previousPageLabel="Previous page",this.nextPageLabel="Next page",new u(this,{skipInitial:!0,callback:()=>{this.classList.toggle("-no-animate",!0),_(this,Ht,"m",Bt).call(this)}})}get tabs(){return this[m]?.items??[]}get selectedTab(){return null!==this._selectedIndex?this.tabs[this._selectedIndex]??null:null}get selectedIndex(){return this._selectedIndex??-1}set selectedIndex(t){if(t>=0&&t<this.tabs.length)this.tabs[t].selected=!0;else{const t=this.selectedTab;t&&(t.selected=!1)}}connectedCallback(){super.connectedCallback(),this.classList.toggle("-no-animate",!0),function(t,e,i,s,o){if("m"===s)throw new TypeError("Private method is not writable");if("a"===s&&!o)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof e?t!==e||!o:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");"a"===s?o.call(t,i):o?o.value=i:e.set(t,i)}(this,Nt,g.observe(()=>{this.requestUpdate(),this[m].directionality=g.current}),"f")}disconnectedCallback(){super.disconnectedCallback(),_(this,Nt,"f")?.call(this)}updated(t){super.updated(t),(t.has("variant")||t.has("stretch"))&&null!==this._selectedIndex&&_(this,Ht,"m",Bt).call(this)}render(){let t;return this.selectedTab?.control&&(t=[...this.querySelectorAll("[slot='panel']")].indexOf(this.selectedTab.control),-1===t&&(t=void 0)),e`${"before"===this.headerPosition?_(this,Ht,"m",It).call(this):s}<m3e-slide class="tabs" selected-index="${(t=>t??$t)(t)}"><slot name="panel"></slot></m3e-slide>${"after"===this.headerPosition?_(this,Ht,"m",It).call(this):s}`}};Nt=new WeakMap,Ht=new WeakSet,Dt=m,It=function(){return e`<m3e-slide-group class="tablist" threshold="8" previous-page-label="${this.previousPageLabel}" next-page-label="${this.nextPageLabel}" ?disabled="${this.disablePagination}"><slot name="prev-icon" slot="prev-icon">${"ltr"===g.current?e`<svg class="prev icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M640-80 240-480l400-400 71 71-329 329 329 329-71 71Z"/></svg>`:e`<svg class="next icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m321-80-71-71 329-329-329-329 71-71 400 400L321-80Z"/></svg>`}</slot><slot name="next-icon" slot="next-icon">${"ltr"===g.current?e`<svg class="next icon" viewBox="0 -960 960 960" fill="currentColor"><path d="m321-80-71-71 329-329-329-329 71-71 400 400L321-80Z"/></svg>`:e`<svg class="prev icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M640-80 240-480l400-400 71 71-329 329 329 329-71 71Z"/></svg>`}</slot><div class="header" role="tablist"><div class="tabs"><slot @slotchange="${_(this,Ht,"m",Rt)}" @keydown="${_(this,Ht,"m",Lt)}" @change="${_(this,Ht,"m",zt)}"></slot></div><div class="ink-bar" aria-hidden="true"><div class="active-indicator"></div></div></div></m3e-slide-group>`},Rt=function(){this[m].setItems([...this.querySelectorAll("m3e-tab")])},Lt=function(t){this[m].onKeyDown(t)},zt=function(t){t.stopPropagation(),this.dispatchEvent(new Event("change",{bubbles:!0}))},jt=function(){const t=this[m].selectedItems[0];let e=t?this.tabs.indexOf(t):null;-1===e&&(e=null),this._selectedIndex=e,_(this,Ht,"m",Bt).call(this)},Bt=function(){if(!this._tablist)return;const t=this[m].selectedItems[0];let e=0,i=0;if(t&&null!==this._selectedIndex){for(let t=0;t<this._selectedIndex;t++)e+=this.tabs[t].clientWidth;i=t.clientWidth,"primary"===this.variant&&t.label&&(e+=t.label.offsetLeft,i=t.label.clientWidth,i<24&&(e-=(24-i)/2,i=24))}this._tablist.style.setProperty("--_tabs-active-tab-position",`${e}px`),this._tablist.style.setProperty("--_tabs-active-tab-size",`${i}px`),i>0&&this.classList.contains("-no-animate")&&setTimeout(()=>this.classList.toggle("-no-animate",!1))},Wt.styles=i`:host { display: flex; flex-direction: column; position: relative; } .tablist { position: relative; box-sizing: border-box; flex: none; } ::slotted(prev-icon), ::slotted(next-icon), .icon { width: 1em; font-size: var(--m3e-tabs-paginator-button-icon-size, var(--m3e-icon-button-icon-size, 1.5rem)) !important; } .header { display: flex; flex-direction: column; } .tabs { display: flex; flex-wrap: nowrap; align-items: center; } .ink-bar { box-sizing: border-box; height: var(--_tabs-active-indicator-thickness); } .active-indicator { position: relative; height: var(--_tabs-active-indicator-thickness); left: calc(var(--_tabs-active-tab-position) + var(--_tabs-activate-indicator-inset, 0px)); width: calc(var(--_tabs-active-tab-size) - calc(var(--_tabs-activate-indicator-inset, 0px) * 2)); background-color: var(--m3e-tabs-active-indicator-color, ${p.color.primary}); transition: ${o(`left var(--m3e-slide-animation-duration, ${p.motion.duration.long2}) ${p.motion.easing.standard},\n width var(--m3e-slide-animation-duration, ${p.motion.duration.long2}) ${p.motion.easing.standard}`)}; } :host([header-position="after"]) .header { flex-direction: column-reverse; } :host([header-position="before"]) .ink-bar { margin-top: calc(0px - var(--_tabs-active-indicator-thickness)); } :host([header-position="before"]) .tablist { --m3e-slide-group-divider-bottom: var(--m3e-divider-thickness, 1px) solid var(--m3e-divider-color, ${p.color.outlineVariant}); } :host([header-position="after"]) .ink-bar { margin-bottom: calc(0px - var(--_tabs-active-indicator-thickness)); } :host([header-position="after"]) .tablist { --m3e-slide-group-divider-top: var(--m3e-divider-thickness, 1px) solid var(--m3e-divider-color, ${p.color.outlineVariant}); } :host([header-position="before"][variant="primary"]) .active-indicator { border-radius: var(--m3e-tabs-primary-before-active-indicator-shape, ${p.shape.corner.extraSmallTop}); } :host([header-position="after"][variant="primary"]) .active-indicator { border-radius: var(--m3e-tabs-primary-after-active-indicator-shape, ${p.shape.corner.extraSmallBottom}); } .tabs { flex: 1 1 auto; } :host([variant="primary"]) .tablist { --_tabs-activate-indicator-inset: var(--m3e-tabs-primary-active-indicator-inset, 0.125rem); --_tabs-active-indicator-thickness: var(--m3e-tabs-primary-active-indicator-thickness, 3px); --_tab-height: 4rem; } :host([header-position="before"]) .tablist { --_tab-focus-ring-bottom-offset: calc(var(--_tabs-active-indicator-thickness) + 1px); } :host([header-position="after"]) .tablist { --_tab-focus-ring-top-offset: calc(var(--_tabs-active-indicator-thickness) + 2px); } :host([header-position="before"][variant="primary"]) .tablist { --_tab-direction: column; } :host([header-position="after"][variant="primary"]) .tablist { --_tab-direction: column-reverse; } :host([variant="secondary"]) .tablist { --_tabs-active-indicator-thickness: var(--m3e-tabs-secondary-active-indicator-thickness, 2px); --_tab-height: 3rem; --_tab-selected-color: ${p.color.onSurface}; --_tab-selected-container-hover-color: ${p.color.onSurface}; --_tab-selected-container-focus-color: ${p.color.onSurface}; --_tab-selected-ripple-color: ${p.color.onSurface}; } :host([stretch]) .header { width: 100%; --_tab-grow: 1; } :host(.-no-animate) .active-indicator { transition: none; } @media (prefers-reduced-motion) { .active-indicator { transition: none; } } @media (forced-colors: active) { .active-indicator { background-color: ButtonText; --m3e-divider-color: GrayText; } }`,$([Z(".tablist")],Wt.prototype,"_tablist",void 0),$([function(t){return V({...t,state:!0,attribute:!1})}
|
|
46
46
|
/**
|
|
47
47
|
* @license
|
|
48
48
|
* Copyright 2017 Google LLC
|