@m3e/nav-menu 1.1.1 → 1.1.3
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
|
@@ -41,7 +41,7 @@ function V(e,t){return(t,s,i)=>((e,t,s)=>(s.configurable=!0,s.enumerable=!0,Refl
|
|
|
41
41
|
* @license
|
|
42
42
|
* Copyright 2017 Google LLC
|
|
43
43
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
44
|
-
*/const K=globalThis,Z=K.trustedTypes,F=Z?Z.createPolicy("lit-html",{createHTML:e=>e}):void 0,J="$lit$",G=`lit$${Math.random().toFixed(9).slice(2)}$`,Q="?"+G,X=`<${Q}>`,Y=document,ee=()=>Y.createComment(""),te=e=>null===e||"object"!=typeof e&&"function"!=typeof e,se=Array.isArray,ie="[ \t\n\f\r]",ne=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,oe=/-->/g,re=/>/g,ae=RegExp(`>|${ie}(?:([^\\s"'>=/]+)(${ie}*=${ie}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),le=/'/g,he=/"/g,ce=/^(?:script|style|textarea|title)$/i,de=Symbol.for("lit-noChange"),me=Symbol.for("lit-nothing"),pe=new WeakMap,ue=Y.createTreeWalker(Y,129);function fe(e,t){if(!se(e)||!e.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==F?F.createHTML(t):t}const ve=(e,t)=>{const s=e.length-1,i=[];let n,o=2===t?"<svg>":3===t?"<math>":"",r=ne;for(let t=0;t<s;t++){const s=e[t];let a,l,h=-1,c=0;for(;c<s.length&&(r.lastIndex=c,l=r.exec(s),null!==l);)c=r.lastIndex,r===ne?"!--"===l[1]?r=oe:void 0!==l[1]?r=re:void 0!==l[2]?(ce.test(l[2])&&(n=RegExp("</"+l[2],"g")),r=ae):void 0!==l[3]&&(r=ae):r===ae?">"===l[0]?(r=n??ne,h=-1):void 0===l[1]?h=-2:(h=r.lastIndex-l[2].length,a=l[1],r=void 0===l[3]?ae:'"'===l[3]?he:le):r===he||r===le?r=ae:r===oe||r===re?r=ne:(r=ae,n=void 0);const d=r===ae&&e[t+1].startsWith("/>")?" ":"";o+=r===ne?s+X:h>=0?(i.push(a),s.slice(0,h)+J+s.slice(h)+G+d):s+G+(-2===h?t:d)}return[fe(e,o+(e[s]||"<?>")+(2===t?"</svg>":3===t?"</math>":"")),i]};class ge{constructor({strings:e,_$litType$:t},s){let i;this.parts=[];let n=0,o=0;const r=e.length-1,a=this.parts,[l,h]=ve(e,t);if(this.el=ge.createElement(l,s),ue.currentNode=this.el.content,2===t||3===t){const e=this.el.content.firstChild;e.replaceWith(...e.childNodes)}for(;null!==(i=ue.nextNode())&&a.length<r;){if(1===i.nodeType){if(i.hasAttributes())for(const e of i.getAttributeNames())if(e.endsWith(J)){const t=h[o++],s=i.getAttribute(e).split(G),r=/([.?@])?(.*)/.exec(t);a.push({type:1,index:n,name:r[2],strings:s,ctor:"."===r[1]?Ae:"?"===r[1]?we:"@"===r[1]?Ee:_e}),i.removeAttribute(e)}else e.startsWith(G)&&(a.push({type:6,index:n}),i.removeAttribute(e));if(ce.test(i.tagName)){const e=i.textContent.split(G),t=e.length-1;if(t>0){i.textContent=Z?Z.emptyScript:"";for(let s=0;s<t;s++)i.append(e[s],ee()),ue.nextNode(),a.push({type:2,index:++n});i.append(e[t],ee())}}}else if(8===i.nodeType)if(i.data===Q)a.push({type:2,index:n});else{let e=-1;for(;-1!==(e=i.data.indexOf(G,e+1));)a.push({type:7,index:n}),e+=G.length-1}n++}}static createElement(e,t){const s=Y.createElement("template");return s.innerHTML=e,s}}function be(e,t,s=e,i){if(t===de)return t;let n=void 0!==i?s._$Co?.[i]:s._$Cl;const o=te(t)?void 0:t._$litDirective$;return n?.constructor!==o&&(n?._$AO?.(!1),void 0===o?n=void 0:(n=new o(e),n._$AT(e,s,i)),void 0!==i?(s._$Co??=[])[i]=n:s._$Cl=n),void 0!==n&&(t=be(e,n._$AS(e,t.values),n,i)),t}class $e{constructor(e,t){this._$AV=[],this._$AN=void 0,this._$AD=e,this._$AM=t}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(e){const{el:{content:t},parts:s}=this._$AD,i=(e?.creationScope??Y).importNode(t,!0);ue.currentNode=i;let n=ue.nextNode(),o=0,r=0,a=s[0];for(;void 0!==a;){if(o===a.index){let t;2===a.type?t=new ye(n,n.nextSibling,this,e):1===a.type?t=new a.ctor(n,a.name,a.strings,this,e):6===a.type&&(t=new Se(n,this,e)),this._$AV.push(t),a=s[++r]}o!==a?.index&&(n=ue.nextNode(),o++)}return ue.currentNode=Y,i}p(e){let t=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(e,s,t),t+=s.strings.length-2):s._$AI(e[t])),t++}}class ye{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(e,t,s,i){this.type=2,this._$AH=me,this._$AN=void 0,this._$AA=e,this._$AB=t,this._$AM=s,this.options=i,this._$Cv=i?.isConnected??!0}get parentNode(){let e=this._$AA.parentNode;const t=this._$AM;return void 0!==t&&11===e?.nodeType&&(e=t.parentNode),e}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(e,t=this){e=be(this,e,t),te(e)?e===me||null==e||""===e?(this._$AH!==me&&this._$AR(),this._$AH=me):e!==this._$AH&&e!==de&&this._(e):void 0!==e._$litType$?this.$(e):void 0!==e.nodeType?this.T(e):(e=>se(e)||"function"==typeof e?.[Symbol.iterator])(e)?this.k(e):this._(e)}O(e){return this._$AA.parentNode.insertBefore(e,this._$AB)}T(e){this._$AH!==e&&(this._$AR(),this._$AH=this.O(e))}_(e){this._$AH!==me&&te(this._$AH)?this._$AA.nextSibling.data=e:this.T(Y.createTextNode(e)),this._$AH=e}$(e){const{values:t,_$litType$:s}=e,i="number"==typeof s?this._$AC(e):(void 0===s.el&&(s.el=ge.createElement(fe(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===i)this._$AH.p(t);else{const e=new $e(i,this),s=e.u(this.options);e.p(t),this.T(s),this._$AH=e}}_$AC(e){let t=pe.get(e.strings);return void 0===t&&pe.set(e.strings,t=new ge(e)),t}k(e){se(this._$AH)||(this._$AH=[],this._$AR());const t=this._$AH;let s,i=0;for(const n of e)i===t.length?t.push(s=new ye(this.O(ee()),this.O(ee()),this,this.options)):s=t[i],s._$AI(n),i++;i<t.length&&(this._$AR(s&&s._$AB.nextSibling,i),t.length=i)}_$AR(e=this._$AA.nextSibling,t){for(this._$AP?.(!1,!0,t);e!==this._$AB;){const t=e.nextSibling;e.remove(),e=t}}setConnected(e){void 0===this._$AM&&(this._$Cv=e,this._$AP?.(e))}}class _e{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(e,t,s,i,n){this.type=1,this._$AH=me,this._$AN=void 0,this.element=e,this.name=t,this._$AM=i,this.options=n,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=me}_$AI(e,t=this,s,i){const n=this.strings;let o=!1;if(void 0===n)e=be(this,e,t,0),o=!te(e)||e!==this._$AH&&e!==de,o&&(this._$AH=e);else{const i=e;let r,a;for(e=n[0],r=0;r<n.length-1;r++)a=be(this,i[s+r],t,r),a===de&&(a=this._$AH[r]),o||=!te(a)||a!==this._$AH[r],a===me?e=me:e!==me&&(e+=(a??"")+n[r+1]),this._$AH[r]=a}o&&!i&&this.j(e)}j(e){e===me?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,e??"")}}class Ae extends _e{constructor(){super(...arguments),this.type=3}j(e){this.element[this.name]=e===me?void 0:e}}class we extends _e{constructor(){super(...arguments),this.type=4}j(e){this.element.toggleAttribute(this.name,!!e&&e!==me)}}class Ee extends _e{constructor(e,t,s,i,n){super(e,t,s,i,n),this.type=5}_$AI(e,t=this){if((e=be(this,e,t,0)??me)===de)return;const s=this._$AH,i=e===me&&s!==me||e.capture!==s.capture||e.once!==s.once||e.passive!==s.passive,n=e!==me&&(s===me||i);i&&this.element.removeEventListener(this.name,this,s),n&&this.element.addEventListener(this.name,this,e),this._$AH=e}handleEvent(e){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,e):this._$AH.handleEvent(e)}}class Se{constructor(e,t,s){this.element=e,this.type=6,this._$AN=void 0,this._$AM=t,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(e){be(this,e)}}const Ce=K.litHtmlPolyfillSupport;Ce?.(ge,ye),(K.litHtmlVersions??=[]).push("3.3.1");var ke,xe,Ie,Pe,Me,Te,Ue,Oe,He,Re,Le,Ne;let je=Ne=class extends(n(o(r(a(l(e,"treeitem"),!0),"opening","opened","closing","closed")))){constructor(){super(...arguments),ke.add(this),this._hasChildItems=!1,xe.set(this,[]),Ie.set(this,null),Pe.set(this,new Array),Me.set(this,null),this.open=!1}get link(){return b(this,Me,"f")}get label(){return this._base??null}get visible(){return!b(this,Pe,"f").some(e=>!e.open)}get path(){return[...b(this,Pe,"f"),this]}get hasChildItems(){return this._hasChildItems}get parentItem(){return b(this,Pe,"f")[b(this,Pe,"f").length-1]??null}get childItems(){return b(this,xe,"f")}get level(){return b(this,Pe,"f").length+1}expand(e=!1){this.hasChildItems&&(this.open=!0,e&&this.childItems.forEach(e=>e.expand(!0)))}collapse(e=!1){this.hasChildItems&&(this.open=!1,e&&this.childItems.forEach(e=>e.collapse(!0)))}toggle(){this.hasChildItems&&(this.open=!this.open)}connectedCallback(){super.connectedCallback(),b(this,Pe,"f").length=0;for(let e=this.parentElement?.closest("m3e-nav-menu-item");e;e=e.parentElement?.closest("m3e-nav-menu-item"))b(this,Pe,"f").push(e);b(this,Pe,"f").reverse(),this.style.setProperty("--_nav-menu-item-level",`${this.level}`),$(this,Ie,this.closest("m3e-nav-menu"),"f")}disconnectedCallback(){super.disconnectedCallback(),b(this,Pe,"f").length=0}update(e){if(super.update(e),e.has("selected")){this.ariaSelected=null,this.ariaCurrent=this.hasChildItems?null:`${this.selected}`;for(const e of this.querySelectorAll(":scope > m3e-icon[slot]"))e.toggleAttribute("filled",this.selected);b(this,Pe,"f").forEach(e=>e.selected=this.selected),this.selected&&!this.hasChildItems&&this.closest("m3e-nav-menu")?.[u].notifySelectionChange(this)}(e.has("open")||e.has("_hasChildItems"))&&(this.ariaExpanded=this._hasChildItems?`${this.open}`:null),(e.has("_hasChildItems")&&this.disabled||e.has("disabled"))&&b(this,xe,"f").forEach(e=>e.disabled=this.disabled)}firstUpdated(e){super.firstUpdated(e);const t=this._base;t&&[this.focusRing,this.stateLayer,this.ripple].forEach(e=>e?.attach(t))}render(){return t`<div class="base" @click="${b(this,ke,"m",Re)}"><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="icon" aria-hidden="true">${b(this,ke,"m",Te).call(this)}</div><div class="label"><slot name="label" @slotchange="${b(this,ke,"m",Oe)}"></slot></div><slot name="badge"></slot><div aria-hidden="true" class="toggle"><slot name="toggle-icon"><svg class="toggle-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M480-360 280-560h400L480-360Z"/></svg></slot></div></div><m3e-collapsible class="group" role="group" aria-hidden="${(e=>e??me)(this._hasChildItems?void 0:"true")}" ?open="${this._hasChildItems&&this.open}" @opening="${b(this,ke,"m",Le)}" @opened="${b(this,ke,"m",Le)}" @closing="${b(this,ke,"m",Le)}" @closed="${b(this,ke,"m",Le)}"><slot @slotchange="${b(this,ke,"m",He)}"></slot></m3e-collapsible>`}};var We,ze,De,Be,qe,Ve,Ke,Ze,Fe,Je,Ge,Qe,Xe,Ye,et;xe=new WeakMap,Ie=new WeakMap,Pe=new WeakMap,Me=new WeakMap,ke=new WeakSet,Te=function(){const e=t`<slot name="icon" @slotchange="${b(this,ke,"m",Ue)}"></slot>`;return this.selected&&!this.hasChildItems?t`<slot name="selected-icon" @slotchange="${b(this,ke,"m",Ue)}">${e}</slot>`:e},Ue=function(e){this.classList.toggle("-with-icon",c(e.target))},Oe=function(e){$(this,Me,e.target.assignedElements({flatten:!0}).find(e=>e instanceof HTMLAnchorElement)??null,"f"),b(this,Me,"f")?.setAttribute("tabindex","-1")},He=function(e){$(this,xe,e.target.assignedElements({flatten:!0}).filter(e=>e instanceof Ne),"f");const t=this._hasChildItems;this._hasChildItems=b(this,xe,"f").length>0,this.classList.toggle("-has-items",this._hasChildItems),(t||this._hasChildItems)&&(this.selected=b(this,xe,"f").some(e=>e.selected))},Re=function(){if(!this.disabled)if(b(this,Ie,"f")?.[u].setActiveItem(this),this._hasChildItems)this.toggle();else{b(this,Ie,"f")?.[u].select(this),b(this,Pe,"f").forEach(e=>e.selected=this.selected),b(this,Me,"f")?.click();const e=this.closest("m3e-drawer-container");if(e){const t=this.closest("[slot='start']")??this.closest("[slot='end')");t&&(e.classList.contains(`-${t.slot}-push`)||e.classList.contains(`-${t.slot}-over`))&&setTimeout(()=>e.removeAttribute(t.slot),300)}}},Le=function(e){e.stopPropagation(),this.dispatchEvent(new Event(e.type,{bubbles:!0}))},je.styles=i`:host { display: block; flex: none; outline: none; user-select: none; position: relative; font-size: var(--m3e-nav-menu-item-font-size, ${h.typescale.standard.label.large.fontSize}); font-weight: var(--m3e-nav-menu-item-font-weight, ${h.typescale.standard.label.large.fontWeight}); line-height: var(--m3e-nav-menu-item-line-height, ${h.typescale.standard.label.large.lineHeight}); letter-spacing: var(--m3e-nav-menu-item-tracking, ${h.typescale.standard.label.large.tracking}); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { display: flex; align-items: center; position: relative; padding-inline: var(--m3e-nav-menu-item-padding, 1.5rem); height: calc(var(--m3e-nav-menu-item-height, 3.5rem) + ${h.density.calc(-3)}); column-gap: var(--m3e-nav-menu-item-spacing, 0.75rem); transition: ${s(`color ${h.motion.duration.short4} ${h.motion.easing.standard},\n background-color ${h.motion.duration.short4} ${h.motion.easing.standard}`)}; } .base, .focus-ring { border-radius: var(--m3e-nav-menu-item-shape, ${h.shape.corner.full}); } .label { flex: 1 1 auto; display: flex; align-items: center; position: relative; overflow: hidden; vertical-align: middle; } .icon, .toggle { flex: none; display: flex; align-items: center; justify-content: center; position: relative; vertical-align: middle; } ::slotted([slot="badge"]) { flex: none; position: relative; font-size: var(--m3e-nav-menu-item-badge-font-size, ${h.typescale.standard.label.large.fontSize}); font-weight: var(--m3e-nav-menu-item-badge-font-weight, ${h.typescale.standard.label.large.fontWeight}); line-height: var(--m3e-nav-menu-item-badge-line-height, ${h.typescale.standard.label.large.lineHeight}); letter-spacing: var(--m3e-nav-menu-item-badge-tracking, ${h.typescale.standard.label.large.tracking}); } .toggle { transition: ${s(`transform var(--m3e-collapsible-animation-duration, ${h.motion.duration.medium1})\n ${h.motion.easing.standard}`)}; } :host(:not(.-with-icon)) .icon { display: none; } .icon { margin-inline-start: -0.5rem; } .toggle { margin-inline-end: -0.5rem; } .group { padding-inline-start: var(--m3e-nav-menu-item-inset, 1rem); } :host([open]) .toggle { transform: rotate(180deg); } :host(:not(.-has-items)) .toggle, :host(:not(.-has-items)) .group { display: none; } ::slotted([slot="selected-icon"]), ::slotted([slot="icon"]), ::slotted([slot="toggle-icon"]), .toggle-icon { vertical-align: middle; width: 1em; height: 1em; font-size: var(--m3e-nav-menu-item-icon-size, 1.5rem); } :host(:not(:disabled)) .base { cursor: pointer; } :host(:not(:disabled)) .base { color: var(--m3e-nav-menu-item-label-color, ${h.color.onSurfaceVariant}); } :host(:disabled) .base { color: color-mix( in srgb, var(--m3e-nav-menu-item-disabled-color, ${h.color.onSurface}) var(--m3e-nav-menu-item-disabled-color-opacity, 38%), transparent ); } :host([selected]:not(.-has-items):not(:disabled)) .base { color: var(--m3e-nav-menu-item-selected-label-color, ${h.color.onSecondaryContainer}); background-color: var(--m3e-nav-menu-item-selected-container-color, ${h.color.secondaryContainer}); --m3e-state-layer-focus-color: var( --m3e-nav-menu-item-selected-container-focus-color, ${h.color.onSecondaryContainer} ); --m3e-state-layer-hover-color: var( --m3e-nav-menu-item-selected-container-hover-color, ${h.color.onSecondaryContainer} ); --m3e-ripple-color: var(--m3e-nav-menu-item-selected-ripple-color, ${h.color.onSecondaryContainer}); } :host(:not([selected]):not(.-has-items):not(:disabled)) .base { --m3e-state-layer-focus-color: var( --m3e-nav-menu-item-unselected-container-focus-color, ${h.color.onSurface} ); --m3e-state-layer-hover-color: var( --m3e-nav-menu-item-unselected-container-hover-color, ${h.color.onSurface} ); --m3e-ripple-color: var(--m3e-nav-menu-item-unselected-ripple-color, ${h.color.onSurface}); } .state-layer { margin-inline: auto; } :host([selected].-has-items:not(:disabled)) .base { background-color: var(--m3e-nav-menu-item-open-container-color, ${h.color.surfaceContainerHighest}); --m3e-state-layer-focus-color: var( --m3e-nav-menu-item-open-container-focus-color, ${h.color.onSurface} ); --m3e-state-layer-hover-color: var( --m3e-nav-menu-item-open-container-hover-color, ${h.color.onSurface} ); --m3e-ripple-color: var(--m3e-nav-menu-item-open-ripple-color, ${h.color.onSurface}); } ::slotted(a[slot="label"]) { all: unset; } ::slotted(m3e-divider) { margin-block: var(--m3e-nav-menu-divider-margin, 0.25rem); } ::slotted(m3e-nav-menu-item:first-of-type) { margin-block-start: var(--m3e-nav-menu-item-vertical-inset, 0.25rem); } ::slotted(m3e-nav-menu-item:last-of-type) { margin-block-end: var(--m3e-nav-menu-item-vertical-inset, 0.25rem); } @media (prefers-reduced-motion) { .base, .toggle, .state-layer { transition: none !important; } } @media (forced-colors: active) { .base, .state-layer { transition: none !important; } :host(:disabled) .base { color: GrayText; } :host(:not([selected]):not(:disabled)) .base { color: ButtonText; } :host([selected]:not(.-has-items):not(:disabled)) .base { forced-color-adjust: none; color: ButtonFace; background-color: ButtonText; } :host([selected].-has-items:not(:disabled)) .base { background-color: unset; color: ButtonText; } }`,g([V(".state-layer")],je.prototype,"stateLayer",void 0),g([V(".focus-ring")],je.prototype,"focusRing",void 0),g([V(".ripple")],je.prototype,"ripple",void 0),g([V(".base")],je.prototype,"_base",void 0),g([function(e){return q({...e,state:!0,attribute:!1})}
|
|
44
|
+
*/const K=globalThis,Z=K.trustedTypes,F=Z?Z.createPolicy("lit-html",{createHTML:e=>e}):void 0,J="$lit$",G=`lit$${Math.random().toFixed(9).slice(2)}$`,Q="?"+G,X=`<${Q}>`,Y=document,ee=()=>Y.createComment(""),te=e=>null===e||"object"!=typeof e&&"function"!=typeof e,se=Array.isArray,ie="[ \t\n\f\r]",ne=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,oe=/-->/g,re=/>/g,ae=RegExp(`>|${ie}(?:([^\\s"'>=/]+)(${ie}*=${ie}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),le=/'/g,he=/"/g,ce=/^(?:script|style|textarea|title)$/i,de=Symbol.for("lit-noChange"),me=Symbol.for("lit-nothing"),pe=new WeakMap,ue=Y.createTreeWalker(Y,129);function fe(e,t){if(!se(e)||!e.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==F?F.createHTML(t):t}const ve=(e,t)=>{const s=e.length-1,i=[];let n,o=2===t?"<svg>":3===t?"<math>":"",r=ne;for(let t=0;t<s;t++){const s=e[t];let a,l,h=-1,c=0;for(;c<s.length&&(r.lastIndex=c,l=r.exec(s),null!==l);)c=r.lastIndex,r===ne?"!--"===l[1]?r=oe:void 0!==l[1]?r=re:void 0!==l[2]?(ce.test(l[2])&&(n=RegExp("</"+l[2],"g")),r=ae):void 0!==l[3]&&(r=ae):r===ae?">"===l[0]?(r=n??ne,h=-1):void 0===l[1]?h=-2:(h=r.lastIndex-l[2].length,a=l[1],r=void 0===l[3]?ae:'"'===l[3]?he:le):r===he||r===le?r=ae:r===oe||r===re?r=ne:(r=ae,n=void 0);const d=r===ae&&e[t+1].startsWith("/>")?" ":"";o+=r===ne?s+X:h>=0?(i.push(a),s.slice(0,h)+J+s.slice(h)+G+d):s+G+(-2===h?t:d)}return[fe(e,o+(e[s]||"<?>")+(2===t?"</svg>":3===t?"</math>":"")),i]};class ge{constructor({strings:e,_$litType$:t},s){let i;this.parts=[];let n=0,o=0;const r=e.length-1,a=this.parts,[l,h]=ve(e,t);if(this.el=ge.createElement(l,s),ue.currentNode=this.el.content,2===t||3===t){const e=this.el.content.firstChild;e.replaceWith(...e.childNodes)}for(;null!==(i=ue.nextNode())&&a.length<r;){if(1===i.nodeType){if(i.hasAttributes())for(const e of i.getAttributeNames())if(e.endsWith(J)){const t=h[o++],s=i.getAttribute(e).split(G),r=/([.?@])?(.*)/.exec(t);a.push({type:1,index:n,name:r[2],strings:s,ctor:"."===r[1]?Ae:"?"===r[1]?we:"@"===r[1]?Ee:_e}),i.removeAttribute(e)}else e.startsWith(G)&&(a.push({type:6,index:n}),i.removeAttribute(e));if(ce.test(i.tagName)){const e=i.textContent.split(G),t=e.length-1;if(t>0){i.textContent=Z?Z.emptyScript:"";for(let s=0;s<t;s++)i.append(e[s],ee()),ue.nextNode(),a.push({type:2,index:++n});i.append(e[t],ee())}}}else if(8===i.nodeType)if(i.data===Q)a.push({type:2,index:n});else{let e=-1;for(;-1!==(e=i.data.indexOf(G,e+1));)a.push({type:7,index:n}),e+=G.length-1}n++}}static createElement(e,t){const s=Y.createElement("template");return s.innerHTML=e,s}}function be(e,t,s=e,i){if(t===de)return t;let n=void 0!==i?s._$Co?.[i]:s._$Cl;const o=te(t)?void 0:t._$litDirective$;return n?.constructor!==o&&(n?._$AO?.(!1),void 0===o?n=void 0:(n=new o(e),n._$AT(e,s,i)),void 0!==i?(s._$Co??=[])[i]=n:s._$Cl=n),void 0!==n&&(t=be(e,n._$AS(e,t.values),n,i)),t}class $e{constructor(e,t){this._$AV=[],this._$AN=void 0,this._$AD=e,this._$AM=t}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(e){const{el:{content:t},parts:s}=this._$AD,i=(e?.creationScope??Y).importNode(t,!0);ue.currentNode=i;let n=ue.nextNode(),o=0,r=0,a=s[0];for(;void 0!==a;){if(o===a.index){let t;2===a.type?t=new ye(n,n.nextSibling,this,e):1===a.type?t=new a.ctor(n,a.name,a.strings,this,e):6===a.type&&(t=new Se(n,this,e)),this._$AV.push(t),a=s[++r]}o!==a?.index&&(n=ue.nextNode(),o++)}return ue.currentNode=Y,i}p(e){let t=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(e,s,t),t+=s.strings.length-2):s._$AI(e[t])),t++}}class ye{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(e,t,s,i){this.type=2,this._$AH=me,this._$AN=void 0,this._$AA=e,this._$AB=t,this._$AM=s,this.options=i,this._$Cv=i?.isConnected??!0}get parentNode(){let e=this._$AA.parentNode;const t=this._$AM;return void 0!==t&&11===e?.nodeType&&(e=t.parentNode),e}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(e,t=this){e=be(this,e,t),te(e)?e===me||null==e||""===e?(this._$AH!==me&&this._$AR(),this._$AH=me):e!==this._$AH&&e!==de&&this._(e):void 0!==e._$litType$?this.$(e):void 0!==e.nodeType?this.T(e):(e=>se(e)||"function"==typeof e?.[Symbol.iterator])(e)?this.k(e):this._(e)}O(e){return this._$AA.parentNode.insertBefore(e,this._$AB)}T(e){this._$AH!==e&&(this._$AR(),this._$AH=this.O(e))}_(e){this._$AH!==me&&te(this._$AH)?this._$AA.nextSibling.data=e:this.T(Y.createTextNode(e)),this._$AH=e}$(e){const{values:t,_$litType$:s}=e,i="number"==typeof s?this._$AC(e):(void 0===s.el&&(s.el=ge.createElement(fe(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===i)this._$AH.p(t);else{const e=new $e(i,this),s=e.u(this.options);e.p(t),this.T(s),this._$AH=e}}_$AC(e){let t=pe.get(e.strings);return void 0===t&&pe.set(e.strings,t=new ge(e)),t}k(e){se(this._$AH)||(this._$AH=[],this._$AR());const t=this._$AH;let s,i=0;for(const n of e)i===t.length?t.push(s=new ye(this.O(ee()),this.O(ee()),this,this.options)):s=t[i],s._$AI(n),i++;i<t.length&&(this._$AR(s&&s._$AB.nextSibling,i),t.length=i)}_$AR(e=this._$AA.nextSibling,t){for(this._$AP?.(!1,!0,t);e!==this._$AB;){const t=e.nextSibling;e.remove(),e=t}}setConnected(e){void 0===this._$AM&&(this._$Cv=e,this._$AP?.(e))}}class _e{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(e,t,s,i,n){this.type=1,this._$AH=me,this._$AN=void 0,this.element=e,this.name=t,this._$AM=i,this.options=n,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=me}_$AI(e,t=this,s,i){const n=this.strings;let o=!1;if(void 0===n)e=be(this,e,t,0),o=!te(e)||e!==this._$AH&&e!==de,o&&(this._$AH=e);else{const i=e;let r,a;for(e=n[0],r=0;r<n.length-1;r++)a=be(this,i[s+r],t,r),a===de&&(a=this._$AH[r]),o||=!te(a)||a!==this._$AH[r],a===me?e=me:e!==me&&(e+=(a??"")+n[r+1]),this._$AH[r]=a}o&&!i&&this.j(e)}j(e){e===me?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,e??"")}}class Ae extends _e{constructor(){super(...arguments),this.type=3}j(e){this.element[this.name]=e===me?void 0:e}}class we extends _e{constructor(){super(...arguments),this.type=4}j(e){this.element.toggleAttribute(this.name,!!e&&e!==me)}}class Ee extends _e{constructor(e,t,s,i,n){super(e,t,s,i,n),this.type=5}_$AI(e,t=this){if((e=be(this,e,t,0)??me)===de)return;const s=this._$AH,i=e===me&&s!==me||e.capture!==s.capture||e.once!==s.once||e.passive!==s.passive,n=e!==me&&(s===me||i);i&&this.element.removeEventListener(this.name,this,s),n&&this.element.addEventListener(this.name,this,e),this._$AH=e}handleEvent(e){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,e):this._$AH.handleEvent(e)}}class Se{constructor(e,t,s){this.element=e,this.type=6,this._$AN=void 0,this._$AM=t,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(e){be(this,e)}}const Ce=K.litHtmlPolyfillSupport;Ce?.(ge,ye),(K.litHtmlVersions??=[]).push("3.3.1");var ke,xe,Ie,Pe,Me,Te,Ue,Oe,He,Re,Le,Ne;let je=Ne=class extends(n(o(r(a(l(e,"treeitem"),!0),"opening","opened","closing","closed")))){constructor(){super(...arguments),ke.add(this),this._hasChildItems=!1,xe.set(this,[]),Ie.set(this,null),Pe.set(this,new Array),Me.set(this,null),this.open=!1}get link(){return b(this,Me,"f")}get label(){return this._base??null}get visible(){return!b(this,Pe,"f").some(e=>!e.open)}get path(){return[...b(this,Pe,"f"),this]}get hasChildItems(){return this._hasChildItems}get parentItem(){return b(this,Pe,"f")[b(this,Pe,"f").length-1]??null}get childItems(){return b(this,xe,"f")}get level(){return b(this,Pe,"f").length+1}expand(e=!1){this.hasChildItems&&(this.open=!0,e&&this.childItems.forEach(e=>e.expand(!0)))}collapse(e=!1){this.hasChildItems&&(this.open=!1,e&&this.childItems.forEach(e=>e.collapse(!0)))}toggle(){this.hasChildItems&&(this.open=!this.open)}connectedCallback(){super.connectedCallback(),b(this,Pe,"f").length=0;for(let e=this.parentElement?.closest("m3e-nav-menu-item");e;e=e.parentElement?.closest("m3e-nav-menu-item"))b(this,Pe,"f").push(e);b(this,Pe,"f").reverse(),this.style.setProperty("--_nav-menu-item-level",`${this.level}`),$(this,Ie,this.closest("m3e-nav-menu"),"f")}disconnectedCallback(){super.disconnectedCallback(),b(this,Pe,"f").length=0}update(e){if(super.update(e),e.has("selected")){this.ariaSelected=null,this.ariaCurrent=this.hasChildItems?null:`${this.selected}`;for(const e of this.querySelectorAll(":scope > m3e-icon[slot]"))e.toggleAttribute("filled",this.selected);b(this,Pe,"f").forEach(e=>e.selected=this.selected),this.selected&&!this.hasChildItems&&this.closest("m3e-nav-menu")?.[u].notifySelectionChange(this)}(e.has("open")||e.has("_hasChildItems"))&&(this.ariaExpanded=this._hasChildItems?`${this.open}`:null),(e.has("_hasChildItems")&&this.disabled||e.has("disabled"))&&b(this,xe,"f").forEach(e=>e.disabled=this.disabled)}firstUpdated(e){super.firstUpdated(e);const t=this._base;t&&[this.focusRing,this.stateLayer,this.ripple].forEach(e=>e?.attach(t))}render(){return t`<div class="base" @click="${b(this,ke,"m",Re)}"><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="icon" aria-hidden="true">${b(this,ke,"m",Te).call(this)}</div><div class="label"><slot name="label" @slotchange="${b(this,ke,"m",Oe)}"></slot></div><slot name="badge"></slot><div aria-hidden="true" class="toggle"><slot name="toggle-icon"><svg class="toggle-icon" viewBox="0 -960 960 960" fill="currentColor"><path d="M480-360 280-560h400L480-360Z"/></svg></slot></div></div><m3e-collapsible class="group" role="group" aria-hidden="${(e=>e??me)(this._hasChildItems?void 0:"true")}" ?open="${this._hasChildItems&&this.open}" @opening="${b(this,ke,"m",Le)}" @opened="${b(this,ke,"m",Le)}" @closing="${b(this,ke,"m",Le)}" @closed="${b(this,ke,"m",Le)}"><slot @slotchange="${b(this,ke,"m",He)}"></slot></m3e-collapsible>`}};var We,ze,De,Be,qe,Ve,Ke,Ze,Fe,Je,Ge,Qe,Xe,Ye,et;xe=new WeakMap,Ie=new WeakMap,Pe=new WeakMap,Me=new WeakMap,ke=new WeakSet,Te=function(){const e=t`<slot name="icon" @slotchange="${b(this,ke,"m",Ue)}"></slot>`;return this.selected&&!this.hasChildItems?t`<slot name="selected-icon" @slotchange="${b(this,ke,"m",Ue)}">${e}</slot>`:e},Ue=function(e){this.classList.toggle("-with-icon",c(e.target))},Oe=function(e){$(this,Me,e.target.assignedElements({flatten:!0}).find(e=>e instanceof HTMLAnchorElement)??null,"f"),b(this,Me,"f")?.setAttribute("tabindex","-1")},He=function(e){$(this,xe,e.target.assignedElements({flatten:!0}).filter(e=>e instanceof Ne),"f");const t=this._hasChildItems;this._hasChildItems=b(this,xe,"f").length>0,this.classList.toggle("-has-items",this._hasChildItems),(t||this._hasChildItems)&&(this.selected=b(this,xe,"f").some(e=>e.selected))},Re=function(){if(!this.disabled)if(b(this,Ie,"f")?.[u].setActiveItem(this),this._hasChildItems)this.toggle();else{b(this,Ie,"f")?.[u].select(this),b(this,Pe,"f").forEach(e=>e.selected=this.selected),b(this,Me,"f")?.click();const e=this.closest("m3e-drawer-container");if(e){const t=this.closest("[slot='start']")??this.closest("[slot='end')");t&&(e.classList.contains(`-${t.slot}-push`)||e.classList.contains(`-${t.slot}-over`))&&setTimeout(()=>{e.removeAttribute(t.slot),e.dispatchEvent(new Event("change",{bubbles:!0}))},300)}}},Le=function(e){e.stopPropagation(),this.dispatchEvent(new Event(e.type,{bubbles:!0}))},je.styles=i`:host { display: block; flex: none; outline: none; user-select: none; position: relative; font-size: var(--m3e-nav-menu-item-font-size, ${h.typescale.standard.label.large.fontSize}); font-weight: var(--m3e-nav-menu-item-font-weight, ${h.typescale.standard.label.large.fontWeight}); line-height: var(--m3e-nav-menu-item-line-height, ${h.typescale.standard.label.large.lineHeight}); letter-spacing: var(--m3e-nav-menu-item-tracking, ${h.typescale.standard.label.large.tracking}); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .base { display: flex; align-items: center; position: relative; padding-inline: var(--m3e-nav-menu-item-padding, 1.5rem); height: calc(var(--m3e-nav-menu-item-height, 3.5rem) + ${h.density.calc(-3)}); column-gap: var(--m3e-nav-menu-item-spacing, 0.75rem); transition: ${s(`color ${h.motion.duration.short4} ${h.motion.easing.standard},\n background-color ${h.motion.duration.short4} ${h.motion.easing.standard}`)}; } .base, .focus-ring { border-radius: var(--m3e-nav-menu-item-shape, ${h.shape.corner.full}); } .label { flex: 1 1 auto; display: flex; align-items: center; position: relative; overflow: hidden; vertical-align: middle; } .icon, .toggle { flex: none; display: flex; align-items: center; justify-content: center; position: relative; vertical-align: middle; } ::slotted([slot="badge"]) { flex: none; position: relative; font-size: var(--m3e-nav-menu-item-badge-font-size, ${h.typescale.standard.label.large.fontSize}); font-weight: var(--m3e-nav-menu-item-badge-font-weight, ${h.typescale.standard.label.large.fontWeight}); line-height: var(--m3e-nav-menu-item-badge-line-height, ${h.typescale.standard.label.large.lineHeight}); letter-spacing: var(--m3e-nav-menu-item-badge-tracking, ${h.typescale.standard.label.large.tracking}); } .toggle { transition: ${s(`transform var(--m3e-collapsible-animation-duration, ${h.motion.duration.medium1})\n ${h.motion.easing.standard}`)}; } :host(:not(.-with-icon)) .icon { display: none; } .icon { margin-inline-start: -0.5rem; } .toggle { margin-inline-end: -0.5rem; } .group { padding-inline-start: var(--m3e-nav-menu-item-inset, 1rem); } :host([open]) .toggle { transform: rotate(180deg); } :host(:not(.-has-items)) .toggle, :host(:not(.-has-items)) .group { display: none; } ::slotted([slot="selected-icon"]), ::slotted([slot="icon"]), ::slotted([slot="toggle-icon"]), .toggle-icon { vertical-align: middle; width: 1em; height: 1em; font-size: var(--m3e-nav-menu-item-icon-size, 1.5rem); } :host(:not(:disabled)) .base { cursor: pointer; } :host(:not(:disabled)) .base { color: var(--m3e-nav-menu-item-label-color, ${h.color.onSurfaceVariant}); } :host(:disabled) .base { color: color-mix( in srgb, var(--m3e-nav-menu-item-disabled-color, ${h.color.onSurface}) var(--m3e-nav-menu-item-disabled-color-opacity, 38%), transparent ); } :host([selected]:not(.-has-items):not(:disabled)) .base { color: var(--m3e-nav-menu-item-selected-label-color, ${h.color.onSecondaryContainer}); background-color: var(--m3e-nav-menu-item-selected-container-color, ${h.color.secondaryContainer}); --m3e-state-layer-focus-color: var( --m3e-nav-menu-item-selected-container-focus-color, ${h.color.onSecondaryContainer} ); --m3e-state-layer-hover-color: var( --m3e-nav-menu-item-selected-container-hover-color, ${h.color.onSecondaryContainer} ); --m3e-ripple-color: var(--m3e-nav-menu-item-selected-ripple-color, ${h.color.onSecondaryContainer}); } :host(:not([selected]):not(.-has-items):not(:disabled)) .base { --m3e-state-layer-focus-color: var( --m3e-nav-menu-item-unselected-container-focus-color, ${h.color.onSurface} ); --m3e-state-layer-hover-color: var( --m3e-nav-menu-item-unselected-container-hover-color, ${h.color.onSurface} ); --m3e-ripple-color: var(--m3e-nav-menu-item-unselected-ripple-color, ${h.color.onSurface}); } .state-layer { margin-inline: auto; } :host([selected].-has-items:not(:disabled)) .base { background-color: var(--m3e-nav-menu-item-open-container-color, ${h.color.surfaceContainerHighest}); --m3e-state-layer-focus-color: var( --m3e-nav-menu-item-open-container-focus-color, ${h.color.onSurface} ); --m3e-state-layer-hover-color: var( --m3e-nav-menu-item-open-container-hover-color, ${h.color.onSurface} ); --m3e-ripple-color: var(--m3e-nav-menu-item-open-ripple-color, ${h.color.onSurface}); } ::slotted(a[slot="label"]) { all: unset; } ::slotted(m3e-divider) { margin-block: var(--m3e-nav-menu-divider-margin, 0.25rem); } ::slotted(m3e-nav-menu-item:first-of-type) { margin-block-start: var(--m3e-nav-menu-item-vertical-inset, 0.25rem); } ::slotted(m3e-nav-menu-item:last-of-type) { margin-block-end: var(--m3e-nav-menu-item-vertical-inset, 0.25rem); } @media (prefers-reduced-motion) { .base, .toggle, .state-layer { transition: none !important; } } @media (forced-colors: active) { .base, .state-layer { transition: none !important; } :host(:disabled) .base { color: GrayText; } :host(:not([selected]):not(:disabled)) .base { color: ButtonText; } :host([selected]:not(.-has-items):not(:disabled)) .base { forced-color-adjust: none; color: ButtonFace; background-color: ButtonText; } :host([selected].-has-items:not(:disabled)) .base { background-color: unset; color: ButtonText; } }`,g([V(".state-layer")],je.prototype,"stateLayer",void 0),g([V(".focus-ring")],je.prototype,"focusRing",void 0),g([V(".ripple")],je.prototype,"ripple",void 0),g([V(".base")],je.prototype,"_base",void 0),g([function(e){return q({...e,state:!0,attribute:!1})}
|
|
45
45
|
/**
|
|
46
46
|
* @license
|
|
47
47
|
* Copyright 2017 Google LLC
|