scb-wc-test 0.1.14 → 0.1.16

package/mvc/components/scb-accordion/scb-accordion-item.js

@@ -1,5 +1,5 @@
 const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["../../vendor/vendor-material.js","../../vendor/vendor.js"])))=>i.map(i=>d[i]);
-import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p,x as l,t as v}from"../../vendor/vendor.js";(function(){try{var t=typeof globalThis<"u"?globalThis:window;if(!t.__scb_ce_guard_installed__){t.__scb_ce_guard_installed__=!0;var a=customElements.define.bind(customElements);customElements.define=function(o,i,s){try{customElements.get(o)||a(o,i,s)}catch(c){var d=String(c||"");if(d.indexOf("already been used")===-1&&d.indexOf("NotSupportedError")===-1)throw c}}}}catch{}})();var m=Object.defineProperty,b=Object.getOwnPropertyDescriptor,r=(t,a,o,i)=>{for(var s=i>1?void 0:i?b(a,o):a,d=t.length-1,c;d>=0;d--)(c=t[d])&&(s=(i?c(a,o,s):c(s))||s);return i&&s&&m(a,o,s),s};let e=class extends u{constructor(){super(...arguments),this.expanded=!1,this.label="",this.content="",this.overline="",this.supportingText="",this.leading=!1,this.leadingVariant="",this.leadingIcon="",this.imgHrefImage="",this.avatarLabel="",this.avatarAlt="",this.avatarVariant="icon",this.avatarSrc="",this.density=0,this._unique=e._uid(),this.toggleAccordion=()=>{const t=this.closest("scb-accordion");t?.hasAttribute("detached")||t.querySelectorAll("scb-accordion-item").forEach(o=>{o!==this&&(o.expanded=!1,o._applyInert(),o._setBottomMaxHeight(o))}),this.expanded=!this.expanded,this._applyInert(),this._setBottomMaxHeight(this)},this._onSlotChange=()=>{this.expanded&&this._setBottomMaxHeight(this)},this._onContentLoad=()=>{this.expanded&&this._setBottomMaxHeight(this)}}static _uid(){return globalThis.crypto?.randomUUID?.()??`${e._uidPrefix}-${++e._uidSeq}`}async firstUpdated(){e._mdIconLoaded||(await h(()=>import("../../vendor/vendor-material.js").then(t=>t.i),__vite__mapDeps([0,1]),import.meta.url),e._mdIconLoaded=!0),e._mdRippleLoaded||(await h(()=>import("../../vendor/vendor-material.js").then(t=>t.r),__vite__mapDeps([0,1]),import.meta.url),e._mdRippleLoaded=!0),this._applyInert(),this._bottomEl()?.addEventListener("load",this._onContentLoad,!0)}disconnectedCallback(){this._bottomEl()?.removeEventListener("load",this._onContentLoad,!0),super.disconnectedCallback()}_setBottomMaxHeight(t){const a=t._bottomEl();a&&(t.expanded?(a.style.maxHeight=`${a.scrollHeight}px`,setTimeout(()=>a.style.maxHeight="unset",160)):(a.style.maxHeight=`${a.scrollHeight}px`,requestAnimationFrame(()=>a.style.maxHeight="0")))}_onKeyDown(t){const a=this.closest("scb-accordion"),i=Array.from(a?.querySelectorAll("scb-accordion-item")||[]).map(c=>c.renderRoot.querySelector(".scb-accordion-top")).filter(c=>!!c),s=t.currentTarget,d=i.indexOf(s);switch(t.key){case"Enter":case" ":t.preventDefault(),this.toggleAccordion();break;case"ArrowDown":t.preventDefault(),d<i.length-1&&i[d+1].focus();break;case"ArrowUp":t.preventDefault(),d>0&&i[d-1].focus();break;case"Home":t.preventDefault(),i.length&&i[0].focus();break;case"End":t.preventDefault(),i.length&&i[i.length-1].focus();break}}_renderLeading(){if(!this.leading)return p;switch(this.leadingVariant){case"icon":return l`<md-icon>${this.leadingIcon}</md-icon>`;case"avatar":return l`
+import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p,x as l,t as m}from"../../vendor/vendor.js";import"../../vendor/vendor-material.js";(function(){try{var t=typeof globalThis<"u"?globalThis:window;if(!t.__scb_ce_guard_installed__){t.__scb_ce_guard_installed__=!0;var i=customElements.define.bind(customElements);customElements.define=function(o,a,s){try{customElements.get(o)||i(o,a,s)}catch(c){var d=String(c||"");if(d.indexOf("already been used")===-1&&d.indexOf("NotSupportedError")===-1)throw c}}}}catch{}})();var v=Object.defineProperty,b=Object.getOwnPropertyDescriptor,r=(t,i,o,a)=>{for(var s=a>1?void 0:a?b(i,o):i,d=t.length-1,c;d>=0;d--)(c=t[d])&&(s=(a?c(i,o,s):c(s))||s);return a&&s&&v(i,o,s),s};let e=class extends u{constructor(){super(...arguments),this.expanded=!1,this.label="",this.content="",this.overline="",this.supportingText="",this.leading=!1,this.leadingVariant="",this.leadingIcon="",this.imgHrefImage="",this.avatarLabel="",this.avatarAlt="",this.avatarVariant="icon",this.avatarSrc="",this.density=0,this._unique=e._uid(),this.toggleAccordion=()=>{const t=this.closest("scb-accordion");t?.hasAttribute("detached")||t.querySelectorAll("scb-accordion-item").forEach(o=>{o!==this&&(o.expanded=!1,o._applyInert(),o._setBottomMaxHeight(o))}),this.expanded=!this.expanded,this._applyInert(),this._setBottomMaxHeight(this)},this._onSlotChange=()=>{this.expanded&&this._setBottomMaxHeight(this)},this._onContentLoad=()=>{this.expanded&&this._setBottomMaxHeight(this)}}static _uid(){return globalThis.crypto?.randomUUID?.()??`${e._uidPrefix}-${++e._uidSeq}`}async firstUpdated(){e._mdIconLoaded||(await h(()=>import("../../vendor/vendor-material.js").then(t=>t.i),__vite__mapDeps([0,1]),import.meta.url),e._mdIconLoaded=!0),e._mdRippleLoaded||(await h(()=>import("../../vendor/vendor-material.js").then(t=>t.r),__vite__mapDeps([0,1]),import.meta.url),e._mdRippleLoaded=!0),this._applyInert(),this._bottomEl()?.addEventListener("load",this._onContentLoad,!0)}disconnectedCallback(){this._bottomEl()?.removeEventListener("load",this._onContentLoad,!0),super.disconnectedCallback()}_setBottomMaxHeight(t){const i=t._bottomEl();i&&(t.expanded?(i.style.maxHeight=`${i.scrollHeight}px`,setTimeout(()=>i.style.maxHeight="unset",160)):(i.style.maxHeight=`${i.scrollHeight}px`,requestAnimationFrame(()=>i.style.maxHeight="0")))}_onKeyDown(t){const i=this.closest("scb-accordion"),a=Array.from(i?.querySelectorAll("scb-accordion-item")||[]).map(c=>c.renderRoot.querySelector(".scb-accordion-top")).filter(c=>!!c),s=t.currentTarget,d=a.indexOf(s);switch(t.key){case"Enter":case" ":t.preventDefault(),this.toggleAccordion();break;case"ArrowDown":t.preventDefault(),d<a.length-1&&a[d+1].focus();break;case"ArrowUp":t.preventDefault(),d>0&&a[d-1].focus();break;case"Home":t.preventDefault(),a.length&&a[0].focus();break;case"End":t.preventDefault(),a.length&&a[a.length-1].focus();break}}_renderLeading(){if(!this.leading)return p;switch(this.leadingVariant){case"icon":return l`<md-icon>${this.leadingIcon}</md-icon>`;case"avatar":return l`
           <scb-avatar
             label=${this.avatarLabel}
             alt=${this.avatarAlt}
@@ -8,10 +8,10 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
             shape="circular"
             variant=${this.avatarVariant}
           ></scb-avatar>
-        `;case"image":return this.imgHrefImage?l`<img part="leading-image" class="img" src="${this.imgHrefImage}" alt="" />`:p;default:return p}}_bottomEl(){return this.renderRoot.querySelector(".scb-accordion-bottom")}_applyInert(){const t=this._bottomEl();t&&(this.expanded?(t.removeAttribute("inert"),t.setAttribute("aria-hidden","false")):(t.setAttribute("inert",""),t.setAttribute("aria-hidden","true")))}updated(t){t.has("expanded")&&(this._applyInert(),this._setBottomMaxHeight(this))}render(){const t=`bottom-${this._unique}`,a=`header-${this._unique}`;return l`
+        `;case"image":return this.imgHrefImage?l`<img part="leading-image" class="img" src="${this.imgHrefImage}" alt="" />`:p;default:return p}}_bottomEl(){return this.renderRoot.querySelector(".scb-accordion-bottom")}_applyInert(){const t=this._bottomEl();t&&(this.expanded?(t.removeAttribute("inert"),t.setAttribute("aria-hidden","false")):(t.setAttribute("inert",""),t.setAttribute("aria-hidden","true")))}_emitExpandedChanged(){this.dispatchEvent(new CustomEvent("expanded-changed",{detail:{expanded:this.expanded,label:this.label},bubbles:!0,composed:!0}))}updated(t){t.has("expanded")&&(this._applyInert(),this._setBottomMaxHeight(this),t.get("expanded")!==void 0&&this._emitExpandedChanged())}render(){const t=`bottom-${this._unique}`,i=`header-${this._unique}`;return l`
       <div part="scb-accordion-item" class="scb-accordion-item">
         <div
-          id=${a}
+          id=${i}
           class="scb-accordion-top"
           tabindex="0"
           role="button"
@@ -37,18 +37,18 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
           id=${t}
           class="scb-accordion-bottom ${this.expanded?"expanded":""}"
           role="region"
-          aria-labelledby=${a}
+          aria-labelledby=${i}
           aria-hidden=${this.expanded?"false":"true"}
         >
           <slot @slotchange=${this._onSlotChange}>${this.content}</slot>
         </div>
       </div>
-    `}};e._uidPrefix=`uid-${Math.random().toString(36).slice(2)}`;e._uidSeq=0;e._mdIconLoaded=!1;e._mdRippleLoaded=!1;e.styles=[g`
-      :host { 
-        display: block; 
-        --_focus-width: var(--md-focus-ring-width, var(--stroke-focus-ring, 2px));
-        --_focus-radius: var(--md-sys-shape-corner-small, var(--radius-s, 8px));
 
+      <md-focus-ring></md-focus-ring>
+    `}};e._uidPrefix=`uid-${Math.random().toString(36).slice(2)}`;e._uidSeq=0;e._mdIconLoaded=!1;e._mdRippleLoaded=!1;e.styles=[g`
+      :host {
+        display: block;
+        position: relative;
         --scb-accordion-hover-radius: var(--radius-none, 0px);
         --scb-accordion-chevron-nudge-y: 3px;
         --scb-accordion-transition-duration: 150ms;
@@ -56,7 +56,16 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
         --scb-accordion-panel-padding-closed: var(--spacing-0, 0px);
       }
 
-      .scb-accordion-item{
+      md-focus-ring {
+        position: absolute;
+        inset: 0;
+        pointer-events: none;
+        display: none;
+        border-radius: var(--scb-accordion-focus-ring-radius, var(--md-sys-shape-corner-small, 8px));
+      }
+      :host(:focus-within) md-focus-ring { display: block; }
+
+      .scb-accordion-item {
         border-bottom: var(--stroke-border, 1px) solid var(--md-sys-color-outline-variant);
         margin-bottom: calc(var(--stroke-border, 1px) * -1);
         display: flex;
@@ -77,15 +86,10 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
         gap: var(--spacing-5, 16px);
         color: var(--md-sys-color-on-surface);
         position: relative;
-        overflow: hidden;
+        overflow: visible;
         -webkit-tap-highlight-color: transparent;
       }
       .scb-accordion-top:hover { border-radius: var(--scb-accordion-hover-radius); }
-      .scb-accordion-top:focus-visible {
-        outline: var(--_focus-width) solid var(--md-focus-ring-color, var(--p-40));
-        outline-offset: var(--spacing-1, 2px);
-        border-radius: var(--_focus-radius);
-      }
 
       :host([density="-2"]) .scb-accordion-top,
       :host-context([data-density="-2"]) .scb-accordion-top {
@@ -149,6 +153,12 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
       .texts { display: grid; gap: var(--spacing-1, 2px); }
       .chevron { margin-left: auto; padding-top: var(--scb-accordion-chevron-nudge-y, 3px); font-size: var(--icon-size-small, 24px); }
 
-      md-ripple { border-radius: inherit; inset: 0; position: absolute; pointer-events: none; }
+      md-ripple {
+        border-radius: inherit;
+        inset: 0;
+        position: absolute;
+        pointer-events: none;
+        overflow: hidden;
+      }
       @media (prefers-reduced-motion: reduce) { md-ripple { display: none; } }
-    `];r([n({type:Boolean})],e.prototype,"expanded",2);r([n({type:String,reflect:!0})],e.prototype,"label",2);r([n({type:String})],e.prototype,"content",2);r([n({type:String,attribute:"overline"})],e.prototype,"overline",2);r([n({type:String,attribute:"supporting-text"})],e.prototype,"supportingText",2);r([n({type:Boolean})],e.prototype,"leading",2);r([n({type:String,attribute:"leading-variant",reflect:!0})],e.prototype,"leadingVariant",2);r([n({type:String,attribute:"leading-icon"})],e.prototype,"leadingIcon",2);r([n({type:String,attribute:"img-href-image",reflect:!0})],e.prototype,"imgHrefImage",2);r([n({type:String,attribute:"avatar-label"})],e.prototype,"avatarLabel",2);r([n({type:String,attribute:"avatar-alt"})],e.prototype,"avatarAlt",2);r([n({type:String,attribute:"avatar-variant"})],e.prototype,"avatarVariant",2);r([n({type:String,attribute:"avatar-src"})],e.prototype,"avatarSrc",2);r([n({type:Number,reflect:!0})],e.prototype,"density",2);e=r([v("scb-accordion-item")],e);
+    `];r([n({type:Boolean})],e.prototype,"expanded",2);r([n({type:String,reflect:!0})],e.prototype,"label",2);r([n({type:String})],e.prototype,"content",2);r([n({type:String,attribute:"overline"})],e.prototype,"overline",2);r([n({type:String,attribute:"supporting-text"})],e.prototype,"supportingText",2);r([n({type:Boolean})],e.prototype,"leading",2);r([n({type:String,attribute:"leading-variant",reflect:!0})],e.prototype,"leadingVariant",2);r([n({type:String,attribute:"leading-icon"})],e.prototype,"leadingIcon",2);r([n({type:String,attribute:"img-href-image",reflect:!0})],e.prototype,"imgHrefImage",2);r([n({type:String,attribute:"avatar-label"})],e.prototype,"avatarLabel",2);r([n({type:String,attribute:"avatar-alt"})],e.prototype,"avatarAlt",2);r([n({type:String,attribute:"avatar-variant"})],e.prototype,"avatarVariant",2);r([n({type:String,attribute:"avatar-src"})],e.prototype,"avatarSrc",2);r([n({type:Number,reflect:!0})],e.prototype,"density",2);e=r([m("scb-accordion-item")],e);

package/mvc/components/scb-accordion/scb-accordion.js

@@ -1,5 +1,5 @@
-import{n as a,t as l,i as _,x as f}from"../../vendor/vendor.js";import"./scb-accordion-item.js";import"../../vendor/preload-helper.js";(function(){try{var n=typeof globalThis<"u"?globalThis:window;if(!n.__scb_ce_guard_installed__){n.__scb_ce_guard_installed__=!0;var r=customElements.define.bind(customElements);customElements.define=function(t,c,e){try{customElements.get(t)||r(t,c,e)}catch(s){var o=String(s||"");if(o.indexOf("already been used")===-1&&o.indexOf("NotSupportedError")===-1)throw s}}}}catch{}})();var u=Object.defineProperty,p=Object.getOwnPropertyDescriptor,i=(n,r,t,c)=>{for(var e=c>1?void 0:c?p(r,t):r,o=n.length-1,s;o>=0;o--)(s=n[o])&&(e=(c?s(r,t,e):s(e))||e);return c&&e&&u(r,t,e),e};let d=class extends _{constructor(){super(...arguments),this.detached=!1}render(){return f`
+import{n as a,t as l,i as _,x as f}from"../../vendor/vendor.js";import"./scb-accordion-item.js";import"../../vendor/preload-helper.js";import"../../vendor/vendor-material.js";(function(){try{var n=typeof globalThis<"u"?globalThis:window;if(!n.__scb_ce_guard_installed__){n.__scb_ce_guard_installed__=!0;var r=customElements.define.bind(customElements);customElements.define=function(t,o,e){try{customElements.get(t)||r(t,o,e)}catch(s){var c=String(s||"");if(c.indexOf("already been used")===-1&&c.indexOf("NotSupportedError")===-1)throw s}}}}catch{}})();var u=Object.defineProperty,p=Object.getOwnPropertyDescriptor,d=(n,r,t,o)=>{for(var e=o>1?void 0:o?p(r,t):r,c=n.length-1,s;c>=0;c--)(s=n[c])&&(e=(o?s(r,t,e):s(e))||e);return o&&e&&u(r,t,e),e};let i=class extends _{constructor(){super(...arguments),this.detached=!1}render(){return f`
       <div class="scb-accordion" ?detached=${this.detached}>
         <slot></slot>
       </div>
-    `}};i([a({type:Boolean,reflect:!0})],d.prototype,"detached",2);d=i([l("scb-accordion")],d);
+    `}};d([a({type:Boolean,reflect:!0})],i.prototype,"detached",2);i=d([l("scb-accordion")],i);

package/mvc/components/scb-button/scb-button.js

@@ -1,5 +1,5 @@
 const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["../../vendor/vendor-material.js","../../vendor/vendor.js"])))=>i.map(i=>d[i]);
-import{_ as h}from"../../vendor/preload-helper.js";import{i as b,a as m,x as u,E as e,n as c,t as f}from"../../vendor/vendor.js";(function(){try{var t=typeof globalThis<"u"?globalThis:window;if(!t.__scb_ce_guard_installed__){t.__scb_ce_guard_installed__=!0;var r=customElements.define.bind(customElements);customElements.define=function(i,n,a){try{customElements.get(i)||r(i,n,a)}catch(d){var o=String(d||"");if(o.indexOf("already been used")===-1&&o.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var p=Object.defineProperty,_=Object.getOwnPropertyDescriptor,s=(t,r,i,n)=>{for(var a=n>1?void 0:n?_(r,i):r,o=t.length-1,d;o>=0;o--)(d=t[o])&&(a=(n?d(r,i,a):d(a))||a);return n&&a&&p(r,i,a),a};let l=class extends b{constructor(){super(...arguments),this.variant="filled",this.type="button",this.label="Button",this.trailingIcon=!1,this.icon="",this.disabled=!1,this.href="",this.target="",this.rel="",this.__loadedButtons=new Set,this.__iconLoaded=!1}async __ensureDepsLoaded(){if(!this.__loadedButtons.has(this.variant)){switch(this.variant){case"filled":await h(()=>import("../../vendor/vendor-material.js").then(t=>t.f),__vite__mapDeps([0,1]),import.meta.url);break;case"outlined":await h(()=>import("../../vendor/vendor-material.js").then(t=>t.o),__vite__mapDeps([0,1]),import.meta.url);break;case"filled-tonal":await h(()=>import("../../vendor/vendor-material.js").then(t=>t.c),__vite__mapDeps([0,1]),import.meta.url);break;case"text":await h(()=>import("../../vendor/vendor-material.js").then(t=>t.t),__vite__mapDeps([0,1]),import.meta.url);break}this.__loadedButtons.add(this.variant)}this.icon&&!this.__iconLoaded&&(await h(()=>import("../../vendor/vendor-material.js").then(t=>t.i),__vite__mapDeps([0,1]),import.meta.url),this.__iconLoaded=!0)}__getInnerButton(){return this.renderRoot.querySelector("md-filled-button, md-outlined-button, md-filled-tonal-button, md-text-button")}__syncAriaToInner(){const t=this.__getInnerButton();if(!t)return;const r=this.getAttribute("aria-controls");r&&t.setAttribute("aria-controls",r);const i=this.getAttribute("aria-expanded");i!==null&&(t.setAttribute("aria-expanded",i),this.removeAttribute("aria-expanded")),this.__ariaObserver?.disconnect(),this.__ariaObserver=new MutationObserver(n=>{const a=this.__getInnerButton();if(a){for(const o of n)if(!(o.type!=="attributes"||!o.attributeName)&&(o.attributeName==="aria-controls"||o.attributeName==="aria-expanded")){const d=this.getAttribute(o.attributeName);d===null?a.removeAttribute(o.attributeName):a.setAttribute(o.attributeName,d),o.attributeName==="aria-expanded"&&this.removeAttribute("aria-expanded")}}}),this.__ariaObserver.observe(this,{attributes:!0,attributeFilter:["aria-controls","aria-expanded"]})}firstUpdated(){(this.type==="submit"||this.type==="reset")&&this.addEventListener("click",()=>{if(!this.disabled){const t=this.closest("form");t&&(this.type==="submit"&&t.requestSubmit(),this.type==="reset"&&t.reset())}}),this.__ensureDepsLoaded(),this.__syncAriaToInner()}updated(t){(t.has("variant")||t.has("icon")&&this.icon)&&this.__ensureDepsLoaded(),t.has("variant")&&this.__syncAriaToInner()}disconnectedCallback(){this.__ariaObserver?.disconnect(),super.disconnectedCallback()}static get styles(){return m`
+import{_ as f}from"../../vendor/preload-helper.js";import{i as A,a as x,x as h,E as r,n as c,t as I}from"../../vendor/vendor.js";(function(){try{var t=typeof globalThis<"u"?globalThis:window;if(!t.__scb_ce_guard_installed__){t.__scb_ce_guard_installed__=!0;var e=customElements.define.bind(customElements);customElements.define=function(i,o,a){try{customElements.get(i)||e(i,o,a)}catch(d){var s=String(d||"");if(s.indexOf("already been used")===-1&&s.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var E=Object.defineProperty,L=Object.getOwnPropertyDescriptor,l=(t,e,i,o)=>{for(var a=o>1?void 0:o?L(e,i):e,s=t.length-1,d;s>=0;s--)(d=t[s])&&(a=(o?d(e,i,a):d(a))||a);return o&&a&&E(e,i,a),a};let n=class extends A{constructor(){super(...arguments),this.variant="filled",this.type="button",this.label="Button",this.trailingIcon=!1,this.icon="",this.disabled=!1,this.href="",this.target="",this.rel="",this.__loadedButtons=new Set,this.__iconLoaded=!1}async __ensureDepsLoaded(){if(!this.__loadedButtons.has(this.variant)){switch(this.variant){case"filled":await f(()=>import("../../vendor/vendor-material.js").then(t=>t.f),__vite__mapDeps([0,1]),import.meta.url);break;case"outlined":await f(()=>import("../../vendor/vendor-material.js").then(t=>t.o),__vite__mapDeps([0,1]),import.meta.url);break;case"filled-tonal":await f(()=>import("../../vendor/vendor-material.js").then(t=>t.c),__vite__mapDeps([0,1]),import.meta.url);break;case"text":await f(()=>import("../../vendor/vendor-material.js").then(t=>t.t),__vite__mapDeps([0,1]),import.meta.url);break}this.__loadedButtons.add(this.variant)}this.icon&&!this.__iconLoaded&&(await f(()=>import("../../vendor/vendor-material.js").then(t=>t.i),__vite__mapDeps([0,1]),import.meta.url),this.__iconLoaded=!0)}__getMdHost(){return this.renderRoot.querySelector("md-filled-button, md-outlined-button, md-filled-tonal-button, md-text-button")}__getInnerNativeButton(t){return t?.shadowRoot?.querySelector("button")??null}__syncAriaToInner(){const t=this.__getMdHost(),e=this.__getInnerNativeButton(t);if(!t||!e)return;const i=(this.getAttribute("aria-label")||"").trim(),o=(t.getAttribute("aria-label")||"").trim(),a=this.label.trim()===""?(this.icon||"").trim():"",s=i||o||a;s?e.setAttribute("aria-label",s):e.removeAttribute("aria-label");const d=this.getAttribute("aria-controls");d!==null?e.setAttribute("aria-controls",d):e.removeAttribute("aria-controls");const v=this.getAttribute("aria-expanded");v!==null?e.setAttribute("aria-expanded",v):e.removeAttribute("aria-expanded"),t.removeAttribute("aria-label"),t.removeAttribute("aria-controls"),t.removeAttribute("aria-expanded"),this.removeAttribute("aria-expanded"),this.__ariaObserver?.disconnect(),this.__ariaObserver=new MutationObserver(g=>{const u=this.__getMdHost(),m=this.__getInnerNativeButton(u);if(!(!u||!m)){for(const _ of g){if(_.type!=="attributes"||!_.attributeName)continue;const b=_.attributeName,p=this.getAttribute(b);if(b==="aria-label"){const $=(u.getAttribute("aria-label")||"").trim(),y=(p||$||(this.label.trim()===""?(this.icon||"").trim():"")).trim();y?m.setAttribute("aria-label",y):m.removeAttribute("aria-label"),u.removeAttribute("aria-label")}else(b==="aria-controls"||b==="aria-expanded")&&(p===null?m.removeAttribute(b):m.setAttribute(b,p),b==="aria-expanded"&&this.removeAttribute("aria-expanded"))}u.removeAttribute("aria-label"),u.removeAttribute("aria-controls"),u.removeAttribute("aria-expanded")}}),this.__ariaObserver.observe(this,{attributes:!0,attributeFilter:["aria-label","aria-controls","aria-expanded"]})}firstUpdated(){(this.type==="submit"||this.type==="reset")&&this.addEventListener("click",()=>{if(!this.disabled){const t=this.closest("form");t&&(this.type==="submit"&&t.requestSubmit(),this.type==="reset"&&t.reset())}}),this.__ensureDepsLoaded(),this.__syncAriaToInner()}updated(t){(t.has("variant")||t.has("icon")&&this.icon)&&this.__ensureDepsLoaded(),t.has("variant")&&this.__syncAriaToInner()}disconnectedCallback(){this.__ariaObserver?.disconnect(),super.disconnectedCallback()}static get styles(){return x`
       /* Gör hosten stretchbar i t.ex. flex/grid */
       :host {
         display: inline-flex;
@@ -58,64 +58,64 @@ import{_ as h}from"../../vendor/preload-helper.js";import{i as b,a as m,x as u,E
         }
       }
       */
-    `}render(){const t=!!this.icon?.trim(),r=t?u`<md-icon slot="icon">${this.icon}</md-icon>`:e,i=e,n=this.label.trim()===""?this.icon:void 0;switch(this.variant){case"filled":return u`
+    `}render(){const t=!!this.icon?.trim(),e=t?h`<md-icon slot="icon">${this.icon}</md-icon>`:r,i=r,o=this.label.trim()===""?this.icon:void 0;switch(this.variant){case"filled":return h`
           <md-filled-button
             type=${this.type}
             variant=${i}
             ?trailing-icon=${this.trailingIcon}
             ?disabled=${this.disabled}
-            aria-label=${n}
-            href=${this.href||e}
-            target=${this.target||e}
-            rel=${this.rel||e}
+            aria-label=${o}
+            href=${this.href||r}
+            target=${this.target||r}
+            rel=${this.rel||r}
           >
-            ${t&&!this.trailingIcon?r:e}
+            ${t&&!this.trailingIcon?e:r}
             ${this.label}
-            ${t&&this.trailingIcon?r:e}
+            ${t&&this.trailingIcon?e:r}
           </md-filled-button>
-        `;case"outlined":return u`
+        `;case"outlined":return h`
           <md-outlined-button
             type=${this.type}
             variant=${i}
             ?trailing-icon=${this.trailingIcon}
             ?disabled=${this.disabled}
-            aria-label=${n}
-            href=${this.href||e}
-            target=${this.target||e}
-            rel=${this.rel||e}
+            aria-label=${o}
+            href=${this.href||r}
+            target=${this.target||r}
+            rel=${this.rel||r}
           >
-            ${t&&!this.trailingIcon?r:e}
+            ${t&&!this.trailingIcon?e:r}
             ${this.label}
-            ${t&&this.trailingIcon?r:e}
+            ${t&&this.trailingIcon?e:r}
           </md-outlined-button>
-        `;case"filled-tonal":return u`
+        `;case"filled-tonal":return h`
           <md-filled-tonal-button
             type=${this.type}
             variant=${i}
             ?trailing-icon=${this.trailingIcon}
             ?disabled=${this.disabled}
-            aria-label=${n}
-            href=${this.href||e}
-            target=${this.target||e}
-            rel=${this.rel||e}
+            aria-label=${o}
+            href=${this.href||r}
+            target=${this.target||r}
+            rel=${this.rel||r}
           >
-            ${t&&!this.trailingIcon?r:e}
+            ${t&&!this.trailingIcon?e:r}
             ${this.label}
-            ${t&&this.trailingIcon?r:e}
+            ${t&&this.trailingIcon?e:r}
           </md-filled-tonal-button>
-        `;case"text":return u`
+        `;case"text":return h`
           <md-text-button
             type=${this.type}
             variant=${i}
             ?trailing-icon=${this.trailingIcon}
             ?disabled=${this.disabled}
-            aria-label=${n}
-            href=${this.href||e}
-            target=${this.target||e}
-            rel=${this.rel||e}
+            aria-label=${o}
+            href=${this.href||r}
+            target=${this.target||r}
+            rel=${this.rel||r}
           >
-            ${t&&!this.trailingIcon?r:e}
+            ${t&&!this.trailingIcon?e:r}
             ${this.label}
-            ${t&&this.trailingIcon?r:e}
+            ${t&&this.trailingIcon?e:r}
           </md-text-button>
-        `;default:return u``}}};s([c({type:String,reflect:!0})],l.prototype,"variant",2);s([c({type:String,reflect:!0})],l.prototype,"type",2);s([c({type:String})],l.prototype,"label",2);s([c({type:Boolean,attribute:"trailing-icon"})],l.prototype,"trailingIcon",2);s([c({type:String})],l.prototype,"icon",2);s([c({type:Boolean,reflect:!0})],l.prototype,"disabled",2);s([c({type:String})],l.prototype,"href",2);s([c({type:String})],l.prototype,"target",2);s([c({type:String})],l.prototype,"rel",2);l=s([f("scb-button")],l);export{l as ScbButton};
+        `;default:return h``}}};l([c({type:String,reflect:!0})],n.prototype,"variant",2);l([c({type:String,reflect:!0})],n.prototype,"type",2);l([c({type:String})],n.prototype,"label",2);l([c({type:Boolean,attribute:"trailing-icon"})],n.prototype,"trailingIcon",2);l([c({type:String})],n.prototype,"icon",2);l([c({type:Boolean,reflect:!0})],n.prototype,"disabled",2);l([c({type:String})],n.prototype,"href",2);l([c({type:String})],n.prototype,"target",2);l([c({type:String})],n.prototype,"rel",2);n=l([I("scb-button")],n);export{n as ScbButton};

package/mvc/components/scb-chips/scb-chip.js

@@ -1,5 +1,5 @@
 const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["../../vendor/vendor-material.js","../../vendor/vendor.js"])))=>i.map(i=>d[i]);
-import{_ as h}from"../../vendor/preload-helper.js";import{a as p,n as a,i as _,x as n,t as u}from"../../vendor/vendor.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var o=customElements.define.bind(customElements);customElements.define=function(r,l,s){try{customElements.get(r)||o(r,l,s)}catch(c){var d=String(c||"");if(d.indexOf("already been used")===-1&&d.indexOf("NotSupportedError")===-1)throw c}}}}catch{}})();var m=Object.defineProperty,f=Object.getOwnPropertyDescriptor,i=(e,o,r,l)=>{for(var s=l>1?void 0:l?f(o,r):o,d=e.length-1,c;d>=0;d--)(c=e[d])&&(s=(l?c(o,r,s):c(s))||s);return l&&s&&m(o,r,s),s};let t=class extends _{constructor(){super(...arguments),this.variant="assist",this.label="",this.icon="",this.disabled=!1,this.elevated=!1,this.removable=!1,this.selected=!1,this.__loadedVariants=new Set,this.__chipSetLoaded=!1,this.__iconLoaded=!1}updated(e){super.updated(e),(e.has("variant")||e.has("icon"))&&this.__ensureDepsLoaded()}firstUpdated(){this.__ensureDepsLoaded()}async __ensureDepsLoaded(){if(!this.__loadedVariants.has(this.variant)){switch(this.variant){case"assist":await h(()=>import("../../vendor/vendor-material.js").then(e=>e.j),__vite__mapDeps([0,1]),import.meta.url);break;case"filter":await h(()=>import("../../vendor/vendor-material.js").then(e=>e.k),__vite__mapDeps([0,1]),import.meta.url);break}this.__loadedVariants.add(this.variant)}!this._insideChipSet&&!this.__chipSetLoaded&&(await h(()=>import("../../vendor/vendor-material.js").then(e=>e.m),__vite__mapDeps([0,1]),import.meta.url),this.__chipSetLoaded=!0),this.icon&&!this.__iconLoaded&&(await h(()=>import("../../vendor/vendor-material.js").then(e=>e.i),__vite__mapDeps([0,1]),import.meta.url),this.__iconLoaded=!0)}get _insideChipSet(){return!!this.closest("md-chip-set")}render(){const e=this._renderChip();return this._insideChipSet?e:n`<md-chip-set>${e}</md-chip-set>`}_renderChip(){const e=this.icon?n`<md-icon slot="icon">${this.icon}</md-icon>`:null;switch(this.variant){case"assist":return n`
+import{_ as h}from"../../vendor/preload-helper.js";import{a as p,n as a,i as _,x as n,t as u}from"../../vendor/vendor.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var o=customElements.define.bind(customElements);customElements.define=function(r,l,s){try{customElements.get(r)||o(r,l,s)}catch(c){var d=String(c||"");if(d.indexOf("already been used")===-1&&d.indexOf("NotSupportedError")===-1)throw c}}}}catch{}})();var m=Object.defineProperty,f=Object.getOwnPropertyDescriptor,i=(e,o,r,l)=>{for(var s=l>1?void 0:l?f(o,r):o,d=e.length-1,c;d>=0;d--)(c=e[d])&&(s=(l?c(o,r,s):c(s))||s);return l&&s&&m(o,r,s),s};let t=class extends _{constructor(){super(...arguments),this.variant="assist",this.label="",this.icon="",this.disabled=!1,this.elevated=!1,this.removable=!1,this.selected=!1,this.__loadedVariants=new Set,this.__chipSetLoaded=!1,this.__iconLoaded=!1}updated(e){super.updated(e),(e.has("variant")||e.has("icon"))&&this.__ensureDepsLoaded()}firstUpdated(){this.__ensureDepsLoaded()}async __ensureDepsLoaded(){if(!this.__loadedVariants.has(this.variant)){switch(this.variant){case"assist":await h(()=>import("../../vendor/vendor-material.js").then(e=>e.j),__vite__mapDeps([0,1]),import.meta.url);break;case"filter":await h(()=>import("../../vendor/vendor-material.js").then(e=>e.k),__vite__mapDeps([0,1]),import.meta.url);break}this.__loadedVariants.add(this.variant)}!this._insideChipSet&&!this.__chipSetLoaded&&(await h(()=>import("../../vendor/vendor-material.js").then(e=>e.n),__vite__mapDeps([0,1]),import.meta.url),this.__chipSetLoaded=!0),this.icon&&!this.__iconLoaded&&(await h(()=>import("../../vendor/vendor-material.js").then(e=>e.i),__vite__mapDeps([0,1]),import.meta.url),this.__iconLoaded=!0)}get _insideChipSet(){return!!this.closest("md-chip-set")}render(){const e=this._renderChip();return this._insideChipSet?e:n`<md-chip-set>${e}</md-chip-set>`}_renderChip(){const e=this.icon?n`<md-icon slot="icon">${this.icon}</md-icon>`:null;switch(this.variant){case"assist":return n`
           <md-assist-chip
             label=${this.label}
             ?disabled=${this.disabled}

package/mvc/components/scb-drawer/scb-drawer-item.js

@@ -1,9 +1,10 @@
 const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["../../vendor/vendor-material.js","../../vendor/vendor.js","../scb-icon-button/scb-icon-button.js","../../vendor/preload-helper.js","../scb-tooltip/scb-tooltip.js","../scb-button/scb-button.js"])))=>i.map(i=>d[i]);
-import{_ as p}from"../../vendor/preload-helper.js";import{a as u,n as c,r as h,i as b,x as d,t as _}from"../../vendor/vendor.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(s,a,n){try{customElements.get(s)||t(s,a,n)}catch(l){var r=String(l||"");if(r.indexOf("already been used")===-1&&r.indexOf("NotSupportedError")===-1)throw l}}}}catch{}})();var f=Object.defineProperty,m=Object.getOwnPropertyDescriptor,i=(e,t,s,a)=>{for(var n=a>1?void 0:a?m(t,s):t,r=e.length-1,l;r>=0;r--)(l=e[r])&&(n=(a?l(t,s,n):l(n))||n);return a&&n&&f(t,s,n),n};let o=class extends b{constructor(){super(...arguments),this.label="",this.selected=!1,this.leadingIcon="",this.itemHref="",this.hasSlotContent=!1,this.expanded=!1,this.__submenuId=`sub-${Math.random().toString(36).slice(2)}`,this._toggleExpand=e=>{e&&e.stopPropagation(),this.hasSlotContent&&(this.expanded=!this.expanded)},this._onButtonClick=e=>{e.stopPropagation(),this._dispatchSelect(),this._toggleExpand()},this._onLinkClick=()=>{this._dispatchSelect()},this._onKeyDown=e=>{const t=Array.from(this.parentElement?.querySelectorAll("scb-drawer-item")||[]),s=t.indexOf(this);switch(e.key){case"ArrowDown":{e.preventDefault(),(t[s+1]||t[0]).shadowRoot?.querySelector(".scb-drawer-label-text")?.focus();break}case"ArrowUp":{e.preventDefault(),(t[s-1]||t[t.length-1]).shadowRoot?.querySelector(".scb-drawer-label-text")?.focus();break}case"Home":{e.preventDefault(),t[0].shadowRoot?.querySelector(".scb-drawer-label-text")?.focus();break}case"End":{e.preventDefault(),t[t.length-1].shadowRoot?.querySelector(".scb-drawer-label-text")?.focus();break}}}}async __ensureDepsLoaded(){o.__rippleLoaded||(await p(()=>import("../../vendor/vendor-material.js").then(e=>e.r),__vite__mapDeps([0,1]),import.meta.url),o.__rippleLoaded=!0),this.leadingIcon&&!o.__iconLoaded&&(await p(()=>import("../../vendor/vendor-material.js").then(e=>e.i),__vite__mapDeps([0,1]),import.meta.url),o.__iconLoaded=!0),this.hasSlotContent&&!o.__iconButtonLoaded&&(await p(()=>import("../scb-icon-button/scb-icon-button.js"),__vite__mapDeps([2,3,1,0,4,5]),import.meta.url),o.__iconButtonLoaded=!0)}_onSlotChange(e){const s=e.target.assignedElements({flatten:!0});this.hasSlotContent=s.length>0&&s.every(a=>a.tagName==="SCB-SUB-DRAWER")}_dispatchSelect(){this.dispatchEvent(new CustomEvent("scb-drawer-select",{bubbles:!0,composed:!0,detail:{item:this}}))}async firstUpdated(){const e=this.renderRoot.querySelector("slot");if(e){const t=e.assignedElements({flatten:!0});this.hasSlotContent=t.length>0&&t.every(s=>s.tagName==="SCB-SUB-DRAWER")}await this.__ensureDepsLoaded()}updated(e){e.has("leadingIcon")&&this.leadingIcon&&this.__ensureDepsLoaded(),e.has("hasSlotContent")&&this.hasSlotContent&&this.__ensureDepsLoaded()}render(){const e=!!this.leadingIcon,t=!!this.itemHref,s=this.hasSlotContent;return d`
+import{_ as l}from"../../vendor/preload-helper.js";import{a as h,n as u,r as p,i as _,x as c,t as b}from"../../vendor/vendor.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(i,n,a){try{customElements.get(i)||t(i,n,a)}catch(d){var o=String(d||"");if(o.indexOf("already been used")===-1&&o.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var m=Object.defineProperty,g=Object.getOwnPropertyDescriptor,r=(e,t,i,n)=>{for(var a=n>1?void 0:n?g(t,i):t,o=e.length-1,d;o>=0;o--)(d=e[o])&&(a=(n?d(t,i,a):d(a))||a);return n&&a&&m(t,i,a),a};let s=class extends _{constructor(){super(...arguments),this.label="",this.selected=!1,this.leadingIcon="",this.itemHref="",this.hasSlotContent=!1,this.expanded=!1,this.__submenuId=`sub-${Math.random().toString(36).slice(2)}`,this.__focusId=`f-${Math.random().toString(36).slice(2)}`,this._toggleExpand=e=>{e&&e.stopPropagation(),this.hasSlotContent&&this.__setExpanded(!this.expanded)},this._onButtonClick=e=>{e.stopPropagation(),this._dispatchSelect(),this._toggleExpand()},this._onLinkClick=()=>{this._dispatchSelect()},this.__onContentLoad=()=>{this.expanded&&this.__setSubmenuHeightForOpen()},this._onKeyDown=e=>{const t=Array.from(this.parentElement?.querySelectorAll("scb-drawer-item")||[]),i=t.indexOf(this);switch(e.key){case"ArrowDown":{e.preventDefault(),(t[i+1]||t[0]).shadowRoot?.querySelector(".scb-drawer-label-text")?.focus();break}case"ArrowUp":{e.preventDefault(),(t[i-1]||t[t.length-1]).shadowRoot?.querySelector(".scb-drawer-label-text")?.focus();break}case"Home":{e.preventDefault(),t[0].shadowRoot?.querySelector(".scb-drawer-label-text")?.focus();break}case"End":{e.preventDefault(),t[t.length-1].shadowRoot?.querySelector(".scb-drawer-label-text")?.focus();break}}}}get __submenuEl(){return this.renderRoot.querySelector(`#${this.__submenuId}`)}async __ensureDepsLoaded(){s.__rippleLoaded||(await l(()=>import("../../vendor/vendor-material.js").then(e=>e.r),__vite__mapDeps([0,1]),import.meta.url),s.__rippleLoaded=!0),s.__focusRingLoaded||(await l(()=>import("../../vendor/vendor-material.js").then(e=>e.m),__vite__mapDeps([0,1]),import.meta.url),s.__focusRingLoaded=!0),this.leadingIcon&&!s.__iconLoaded&&(await l(()=>import("../../vendor/vendor-material.js").then(e=>e.i),__vite__mapDeps([0,1]),import.meta.url),s.__iconLoaded=!0),this.hasSlotContent&&!s.__iconButtonLoaded&&(await l(()=>import("../scb-icon-button/scb-icon-button.js"),__vite__mapDeps([2,3,1,0,4,5]),import.meta.url),s.__iconButtonLoaded=!0)}_onSlotChange(e){const i=e.target.assignedElements({flatten:!0});this.hasSlotContent=i.length>0&&i.every(n=>n.tagName==="SCB-SUB-DRAWER"),this.expanded&&this.__setSubmenuHeightForOpen()}__setExpanded(e){this.hasSlotContent&&(this.expanded=e,this.dispatchEvent(new CustomEvent("scb-drawer-expand",{bubbles:!0,composed:!0,detail:{item:this,expanded:e}})))}_dispatchSelect(){this.dispatchEvent(new CustomEvent("scb-drawer-select",{bubbles:!0,composed:!0,detail:{item:this}}))}async firstUpdated(){const e=this.renderRoot.querySelector("slot");if(e){const i=e.assignedElements({flatten:!0});this.hasSlotContent=i.length>0&&i.every(n=>n.tagName==="SCB-SUB-DRAWER")}await this.__ensureDepsLoaded();const t=this.__submenuEl;t&&("ResizeObserver"in window&&(this.__ro=new ResizeObserver(()=>{this.expanded&&this.__setSubmenuHeightForOpen()}),this.__ro.observe(t)),t.addEventListener("load",this.__onContentLoad,!0))}disconnectedCallback(){this.__submenuEl?.removeEventListener("load",this.__onContentLoad,!0),this.__ro?.disconnect(),super.disconnectedCallback()}updated(e){if(e.has("leadingIcon")&&this.leadingIcon&&this.__ensureDepsLoaded(),e.has("hasSlotContent")&&this.hasSlotContent&&this.__ensureDepsLoaded(),e.has("expanded")){const t=e.get("expanded");this.__applyInert(),this.__animateSubmenu(t,this.expanded)}}__applyInert(){const e=this.__submenuEl;e&&(this.expanded?(e.removeAttribute("inert"),e.setAttribute("aria-hidden","false")):(e.setAttribute("inert",""),e.setAttribute("aria-hidden","true")))}__setSubmenuHeightForOpen(){const e=this.__submenuEl;e&&(e.style.maxHeight=`${e.scrollHeight}px`,setTimeout(()=>{this.expanded&&(e.style.maxHeight="unset")},160))}__animateSubmenu(e,t){const i=this.__submenuEl;if(!(!i||e===t))if(t)i.classList.add("expanded"),i.style.maxHeight="0px",requestAnimationFrame(()=>this.__setSubmenuHeightForOpen());else{const n=i.scrollHeight;i.style.maxHeight=`${n}px`,requestAnimationFrame(()=>{i.classList.remove("expanded"),i.style.maxHeight="0px"})}}render(){const e=!!this.leadingIcon,t=!!this.itemHref,i=this.hasSlotContent;return c`
       <div class="scb-drawer-item">
         <div class="scb-drawer-item-label" ?selected=${this.selected}>
-          ${t?d`
+          ${t?c`
                 <a
+                  id=${this.__focusId}
                   class="scb-drawer-label-text"
                   aria-label="${this.label}"
                   href="${this.itemHref}"
@@ -13,102 +14,129 @@ import{_ as p}from"../../vendor/preload-helper.js";import{a as u,n as c,r as h,i
                 >
                   <span class="scb-drawer-click ${e?"has-icon":""}">
                     <md-ripple></md-ripple>
-                    ${e?d`<md-icon>${this.leadingIcon}</md-icon>`:""}
+                    ${e?c`<md-icon>${this.leadingIcon}</md-icon>`:""}
                     ${this.label}
                   </span>
                 </a>
-              `:d`
+                <md-focus-ring for=${this.__focusId} inward></md-focus-ring>
+              `:c`
                 <button
+                  id=${this.__focusId}
                   type="button"
                   class="scb-drawer-label-text"
                   @click=${this._onButtonClick}
                   @keydown=${this._onKeyDown}
-                  ${s?"aria-expanded="+String(this.expanded):""}
-                  ${s?"aria-controls="+this.__submenuId:""}
+                  ${i?"aria-expanded="+String(this.expanded):""}
+                  ${i?"aria-controls="+this.__submenuId:""}
                 >
                   <span class="scb-drawer-click ${e?"has-icon":""}">
                     <md-ripple></md-ripple>
-                    ${e?d`<md-icon>${this.leadingIcon}</md-icon>`:""}
+                    ${e?c`<md-icon>${this.leadingIcon}</md-icon>`:""}
                     ${this.label}
                   </span>
                 </button>
+                <md-focus-ring for=${this.__focusId} inward></md-focus-ring>
               `}
-
-          ${s?d`
-                <!-- Separat ikonknapp: presentational + ej tabbbar, ingen ARIA-state -->
+          ${i?c`
                 <scb-icon-button
                   icon="${this.expanded?"expand_less":"expand_more"}"
                   role="presentation"
                   tabindex="-1"
-                  @click=${a=>{a.stopPropagation(),this._toggleExpand(a)}}
+                  @click=${n=>{n.stopPropagation(),this._toggleExpand(n)}}
                 ></scb-icon-button>
               `:""}
         </div>
 
-        <div id="${this.__submenuId}" class="submenu ${this.expanded?"expanded":""}">
+        <div
+          id="${this.__submenuId}"
+          class="submenu ${this.expanded?"expanded":""}"
+          role="region"
+          aria-hidden=${this.expanded?"false":"true"}
+        >
           <slot @slotchange=${this._onSlotChange}></slot>
         </div>
       </div>
-    `}};o.__rippleLoaded=!1;o.__iconLoaded=!1;o.__iconButtonLoaded=!1;o.styles=u`
-    .scb-drawer-item-label {
-      display: flex;
-      align-items: center;
-      position: relative;
-    }
+    `}};s.__rippleLoaded=!1;s.__iconLoaded=!1;s.__iconButtonLoaded=!1;s.__focusRingLoaded=!1;s.styles=h`
+  :host {
+    /* Animation tokens */
+    --scb-drawer-sub-transition-duration: var(--scb-motion-duration-quick, 150ms);
+    --scb-drawer-sub-transition-easing: var(--scb-motion-easing-standard, cubic-bezier(.69,.16,.2,.98));
+
+    --scb-drawer-item-padding-y: 14px;   
+    --scb-drawer-item-padding-x: 20px;  
+    --scb-drawer-item-padding-x-has-icon: var(--spacing-4, 12px); 
+    --scb-drawer-item-radius: 28px; 
+    --scb-drawer-item-gap: var(--spacing-4, 12px);
+  }
+
+  .scb-drawer-item-label {
+    display: flex;
+    align-items: center;
+    position: relative;
+  }
+
+  .scb-drawer-label-text {
+    width: 100%;
+    display: block;
+    background: transparent;
+    border: 0;
+    text-align: left;
+    font: inherit;                   
+    color: inherit;
+    text-decoration: none;
+    cursor: pointer;
+    padding: 0;
+    margin: 0;
+    appearance: none;
+    -webkit-appearance: none;
+    box-sizing: border-box;
+    /* UA-outline av – vi visar md-focus-ring istället */
+    outline: none;
+    -webkit-tap-highlight-color: transparent;
+  }
+  .scb-drawer-label-text:focus,
+  .scb-drawer-label-text:focus-visible { outline: none; }
+  .scb-drawer-label-text:-moz-focusring { outline: none; }
 
-    .scb-drawer-label-text {
-      width: 100%;
-      display: block;
-      background: transparent;
-      border: 0;
-      text-align: left;
-      font: inherit;
-      color: inherit;
-      text-decoration: none;
-      cursor: pointer;
-      padding: 0;
-      margin: 0;
-      appearance: none;
-      -webkit-appearance: none;
-      box-sizing: border-box;
-    }
+  .scb-drawer-click {
+    display: flex;
+    align-items: center;
+    gap: var(--scb-drawer-item-gap);
+    padding-block: var(--scb-drawer-item-padding-y);
+    padding-inline: var(--scb-drawer-item-padding-x);
+    border-radius: var(--scb-drawer-item-radius);
+    position: relative;
+    overflow: hidden;
+    color: var(--md-sys-color-on-surface);
+  }
+  .scb-drawer-click.has-icon {
+    /* När leading icon finns minskar inline-padding till 12px (spacing-4) */
+    padding-inline: var(--scb-drawer-item-padding-x-has-icon);
+    padding-block: var(--scb-drawer-item-padding-y);
+  }
 
-    .scb-drawer-label-text:focus-visible {
-      outline: 2px solid var(--md-focus-ring-color, var(--p-40));
-      outline-offset: 2px;
-      border-radius: 28px;
-      box-shadow: none;
-    }
+  /* Släck ripple-fokuslagret */
+  .scb-drawer-click md-ripple { --md-ripple-focus-opacity: 0; }
 
-    .scb-drawer-click {
-      display: flex;
-      align-items: center;
-      gap: 12px;
-      padding: 14px 20px;
-      border-radius: 28px;
-      position: relative;
-      overflow: hidden;
-      color: var(--md-sys-color-on-surface);
-    }
-    .scb-drawer-click.has-icon { padding: 14px 12px; }
+  .scb-drawer-item-label[selected] .scb-drawer-click,
+  :host([selected]) .scb-drawer-click {
+    color: var(--md-sys-color-on-secondary-container);
+    background: var(--md-sys-color-secondary-container);
+    font-weight: 600;
+  }
 
-    .scb-drawer-item-label[selected] .scb-drawer-click,
-    :host([selected]) .scb-drawer-click {
-      color: var(--md-sys-color-on-secondary-container);
-      background: var(--md-sys-color-secondary-container);
-      font-weight: 600;
-    }
+  scb-icon-button {
+    margin-left: auto;
+    flex: 0 0 auto;
+  }
 
-    scb-icon-button {
-      margin-left: auto;
-      flex: 0 0 auto;
-    }
-    .submenu {
-      display: none;
-      padding-left: 16px;
-    }
-    .submenu.expanded {
-      display: block;
-      padding-left: 16px;
-    }
-  `;i([c({type:String})],o.prototype,"label",2);i([c({type:Boolean,reflect:!0})],o.prototype,"selected",2);i([c({type:String,attribute:"leading-icon"})],o.prototype,"leadingIcon",2);i([c({type:String,attribute:"item-href"})],o.prototype,"itemHref",2);i([h()],o.prototype,"hasSlotContent",2);i([h()],o.prototype,"expanded",2);o=i([_("scb-drawer-item")],o);
+  .submenu {
+    padding-left: var(--spacing-5, 16px);
+    overflow: hidden;
+    max-height: 0;
+    opacity: 0;
+    transition: var(--scb-drawer-sub-transition-duration) var(--scb-drawer-sub-transition-easing);
+    will-change: max-height, opacity;
+  }
+  .submenu.expanded { opacity: 1; }
+`;r([u({type:String})],s.prototype,"label",2);r([u({type:Boolean,reflect:!0})],s.prototype,"selected",2);r([u({type:String,attribute:"leading-icon"})],s.prototype,"leadingIcon",2);r([u({type:String,attribute:"item-href"})],s.prototype,"itemHref",2);r([p()],s.prototype,"hasSlotContent",2);r([p()],s.prototype,"expanded",2);s=r([b("scb-drawer-item")],s);

package/mvc/components/scb-drawer/scb-drawer-section.js

@@ -1,19 +1,37 @@
-import{a as o,n as b,i as _,x as l,t as p}from"../../vendor/vendor.js";import"../scb-divider/scb-divider.js";(function(){try{var n=typeof globalThis<"u"?globalThis:window;if(!n.__scb_ce_guard_installed__){n.__scb_ce_guard_installed__=!0;var s=customElements.define.bind(customElements);customElements.define=function(r,t,e){try{customElements.get(r)||s(r,t,e)}catch(c){var i=String(c||"");if(i.indexOf("already been used")===-1&&i.indexOf("NotSupportedError")===-1)throw c}}}}catch{}})();var f=Object.defineProperty,u=Object.getOwnPropertyDescriptor,d=(n,s,r,t)=>{for(var e=t>1?void 0:t?u(s,r):s,i=n.length-1,c;i>=0;i--)(c=n[i])&&(e=(t?c(s,r,e):c(e))||e);return t&&e&&f(s,r,e),e};let a=class extends _{constructor(){super(...arguments),this.label=""}render(){return l`
-        
-        <scb-divider></scb-divider>
-        ${this.label?l`
-        <div class="scb-drawer-section">
-            <div class="scb-drawer-label">${this.label}</div>
-        </div>`:""}
-    `}};a.styles=o`
+import{a as d,n as b,i as m,x as c,t as v}from"../../vendor/vendor.js";import"../scb-divider/scb-divider.js";(function(){try{var l=typeof globalThis<"u"?globalThis:window;if(!l.__scb_ce_guard_installed__){l.__scb_ce_guard_installed__=!0;var s=customElements.define.bind(customElements);customElements.define=function(r,i,e){try{customElements.get(r)||s(r,i,e)}catch(t){var a=String(t||"");if(a.indexOf("already been used")===-1&&a.indexOf("NotSupportedError")===-1)throw t}}}}catch{}})();var p=Object.defineProperty,f=Object.getOwnPropertyDescriptor,o=(l,s,r,i)=>{for(var e=i>1?void 0:i?f(s,r):s,a=l.length-1,t;a>=0;a--)(t=l[a])&&(e=(i?t(s,r,e):t(e))||e);return i&&e&&p(s,r,e),e};let n=class extends m{constructor(){super(...arguments),this.label=""}render(){return c`
+      <scb-divider></scb-divider>
+      ${this.label?c`
+            <div class="scb-drawer-section">
+              <div class="scb-drawer-label">${this.label}</div>
+            </div>
+          `:""}
+    `}};n.styles=d`
+    :host {
+      color: var(--md-sys-color-on-surface);
+      font-family: var(--brand-font);
+    }
+
     .scb-drawer-section {
       display: block;
       width: 100%;
-      padding: 14px 12px; 
+
+      padding-block: var(--scb-drawer-section-padding-block, 14px);
+      padding-inline: var(--spacing-4, 12px);
+      color: var(--md-sys-color-on-surface);
+      font-weight: var(--weight-semibold, 600);
+    }
+
+    .scb-drawer-label {
+      font-family: var(--brand-font);
+      font-size: var(--md-sys-typescale-label-medium-size);
+      line-height: var(--md-sys-typescale-label-medium-line-height);
+      font-weight: var(--md-sys-typescale-label-medium-weight, var(--weight-semibold));
+      letter-spacing: var(--md-sys-typescale-label-medium-tracking);
       color: var(--md-sys-color-on-surface);
-      font-weight: 600;
     }
+
     scb-divider {
-      margin: 4px 12px;
+      margin-block: var(--spacing-2, 4px);
+      margin-inline: var(--spacing-4, 12px);
     }
-  `;d([b({type:String})],a.prototype,"label",2);a=d([p("scb-drawer-section")],a);
+  `;o([b({type:String})],n.prototype,"label",2);n=o([v("scb-drawer-section")],n);