scb-wc-test 0.1.16 → 0.1.17
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/mvc/components/scb-accordion/scb-accordion-item.js +22 -17
- package/mvc/components/scb-drawer/scb-drawer-item.js +95 -82
- package/package.json +2 -2
- package/scb-accordion/scb-accordion-item.d.ts +0 -4
- package/scb-accordion/scb-accordion-item.js +85 -93
- package/scb-drawer/scb-drawer-item.d.ts +7 -12
- package/scb-drawer/scb-drawer-item.js +143 -161
- package/scb-wc-test.bundle.js +311 -293
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["../../vendor/vendor-material.js","../../vendor/vendor.js"])))=>i.map(i=>d[i]);
|
|
2
|
-
import{_ as
|
|
2
|
+
import{_ as g}from"../../vendor/preload-helper.js";import{a as v,n as o,i as u,E as p,x as l,t as b}from"../../vendor/vendor.js";import"../../vendor/vendor-material.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var r=customElements.define.bind(customElements);customElements.define=function(n,a,s){try{customElements.get(n)||r(n,a,s)}catch(c){var d=String(c||"");if(d.indexOf("already been used")===-1&&d.indexOf("NotSupportedError")===-1)throw c}}}}catch{}})();var h=Object.defineProperty,m=Object.getOwnPropertyDescriptor,i=(e,r,n,a)=>{for(var s=a>1?void 0:a?m(r,n):r,d=e.length-1,c;d>=0;d--)(c=e[d])&&(s=(a?c(r,n,s):c(s))||s);return a&&s&&h(r,n,s),s};let t=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=t._uid(),this.toggleAccordion=()=>{const e=this.closest("scb-accordion");e?.hasAttribute("detached")||e.querySelectorAll("scb-accordion-item").forEach(n=>{n!==this&&(n.expanded=!1,n._applyInert())}),this.expanded=!this.expanded,this._applyInert()}}static _uid(){return globalThis.crypto?.randomUUID?.()??`${t._uidPrefix}-${++t._uidSeq}`}async firstUpdated(){t._mdIconLoaded||(await g(()=>import("../../vendor/vendor-material.js").then(e=>e.i),__vite__mapDeps([0,1]),import.meta.url),t._mdIconLoaded=!0),t._mdRippleLoaded||(await g(()=>import("../../vendor/vendor-material.js").then(e=>e.r),__vite__mapDeps([0,1]),import.meta.url),t._mdRippleLoaded=!0),this._applyInert()}disconnectedCallback(){super.disconnectedCallback()}_onKeyDown(e){const r=this.closest("scb-accordion"),a=Array.from(r?.querySelectorAll("scb-accordion-item")||[]).map(c=>c.renderRoot.querySelector(".scb-accordion-top")).filter(c=>!!c),s=e.currentTarget,d=a.indexOf(s);switch(e.key){case"Enter":case" ":e.preventDefault(),this.toggleAccordion();break;case"ArrowDown":e.preventDefault(),d<a.length-1&&a[d+1].focus();break;case"ArrowUp":e.preventDefault(),d>0&&a[d-1].focus();break;case"Home":e.preventDefault(),a.length&&a[0].focus();break;case"End":e.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`
|
|
3
3
|
<scb-avatar
|
|
4
4
|
label=${this.avatarLabel}
|
|
5
5
|
alt=${this.avatarAlt}
|
|
@@ -8,15 +8,15 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
|
|
|
8
8
|
shape="circular"
|
|
9
9
|
variant=${this.avatarVariant}
|
|
10
10
|
></scb-avatar>
|
|
11
|
-
`;case"image":return this.imgHrefImage?l`<img part="leading-image" class="img" src="${this.imgHrefImage}" alt="" />`:p;default:return p}}
|
|
11
|
+
`;case"image":return this.imgHrefImage?l`<img part="leading-image" class="img" src="${this.imgHrefImage}" alt="" />`:p;default:return p}}_applyInert(){const e=this.renderRoot.querySelector(".scb-accordion-bottom");e&&(this.expanded?(e.removeAttribute("inert"),e.setAttribute("aria-hidden","false")):(e.setAttribute("inert",""),e.setAttribute("aria-hidden","true")))}_emitExpandedChanged(){this.dispatchEvent(new CustomEvent("expanded-changed",{detail:{expanded:this.expanded,label:this.label},bubbles:!0,composed:!0}))}updated(e){e.has("expanded")&&(this._applyInert(),e.get("expanded")!==void 0&&this._emitExpandedChanged())}render(){const e=`bottom-${this._unique}`,r=`header-${this._unique}`;return l`
|
|
12
12
|
<div part="scb-accordion-item" class="scb-accordion-item">
|
|
13
13
|
<div
|
|
14
|
-
id=${
|
|
14
|
+
id=${r}
|
|
15
15
|
class="scb-accordion-top"
|
|
16
16
|
tabindex="0"
|
|
17
17
|
role="button"
|
|
18
18
|
aria-expanded=${this.expanded}
|
|
19
|
-
aria-controls=${
|
|
19
|
+
aria-controls=${e}
|
|
20
20
|
@click=${this.toggleAccordion}
|
|
21
21
|
@keydown=${this._onKeyDown}
|
|
22
22
|
>
|
|
@@ -34,18 +34,20 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
|
|
|
34
34
|
</div>
|
|
35
35
|
|
|
36
36
|
<div
|
|
37
|
-
id=${
|
|
37
|
+
id=${e}
|
|
38
38
|
class="scb-accordion-bottom ${this.expanded?"expanded":""}"
|
|
39
39
|
role="region"
|
|
40
|
-
aria-labelledby=${
|
|
40
|
+
aria-labelledby=${r}
|
|
41
41
|
aria-hidden=${this.expanded?"false":"true"}
|
|
42
42
|
>
|
|
43
|
-
<
|
|
43
|
+
<div class="bottom-inner">
|
|
44
|
+
<slot>${this.content}</slot>
|
|
45
|
+
</div>
|
|
44
46
|
</div>
|
|
45
47
|
</div>
|
|
46
48
|
|
|
47
|
-
<md-focus-ring></md-focus-ring>
|
|
48
|
-
`}};
|
|
49
|
+
<md-focus-ring for=${r} inward></md-focus-ring>
|
|
50
|
+
`}};t._uidPrefix=`uid-${Math.random().toString(36).slice(2)}`;t._uidSeq=0;t._mdIconLoaded=!1;t._mdRippleLoaded=!1;t.styles=[v`
|
|
49
51
|
:host {
|
|
50
52
|
display: block;
|
|
51
53
|
position: relative;
|
|
@@ -60,10 +62,8 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
|
|
|
60
62
|
position: absolute;
|
|
61
63
|
inset: 0;
|
|
62
64
|
pointer-events: none;
|
|
63
|
-
display: none;
|
|
64
65
|
border-radius: var(--scb-accordion-focus-ring-radius, var(--md-sys-shape-corner-small, 8px));
|
|
65
66
|
}
|
|
66
|
-
:host(:focus-within) md-focus-ring { display: block; }
|
|
67
67
|
|
|
68
68
|
.scb-accordion-item {
|
|
69
69
|
border-bottom: var(--stroke-border, 1px) solid var(--md-sys-color-outline-variant);
|
|
@@ -101,21 +101,26 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
|
|
|
101
101
|
}
|
|
102
102
|
|
|
103
103
|
.scb-accordion-bottom {
|
|
104
|
+
display: grid;
|
|
105
|
+
grid-template-rows: 0fr;
|
|
106
|
+
transition:
|
|
107
|
+
grid-template-rows var(--scb-accordion-transition-duration) var(--scb-accordion-transition-easing),
|
|
108
|
+
opacity var(--scb-accordion-transition-duration) var(--scb-accordion-transition-easing),
|
|
109
|
+
padding var(--scb-accordion-transition-duration) var(--scb-accordion-transition-easing);
|
|
110
|
+
opacity: 0;
|
|
111
|
+
overflow: hidden;
|
|
104
112
|
padding-block: var(--scb-accordion-panel-padding-closed);
|
|
105
113
|
padding-inline: var(--spacing-5, 16px);
|
|
106
|
-
max-height: 0;
|
|
107
|
-
overflow: hidden;
|
|
108
|
-
transition: var(--scb-accordion-transition-duration) var(--scb-accordion-transition-easing);
|
|
109
|
-
opacity: 0;
|
|
110
114
|
}
|
|
111
115
|
.scb-accordion-bottom.expanded {
|
|
116
|
+
grid-template-rows: 1fr;
|
|
112
117
|
opacity: 1;
|
|
113
118
|
padding-top: var(--spacing-2, 4px);
|
|
114
119
|
padding-right: var(--spacing-5, 16px);
|
|
115
120
|
padding-bottom: var(--spacing-5, 16px);
|
|
116
121
|
padding-left: var(--spacing-5, 16px);
|
|
117
|
-
max-height: 100%;
|
|
118
122
|
}
|
|
123
|
+
.bottom-inner { overflow: hidden; }
|
|
119
124
|
|
|
120
125
|
.label {
|
|
121
126
|
font-family: var(--brand-font);
|
|
@@ -161,4 +166,4 @@ import{_ as h}from"../../vendor/preload-helper.js";import{a as g,n,i as u,E as p
|
|
|
161
166
|
overflow: hidden;
|
|
162
167
|
}
|
|
163
168
|
@media (prefers-reduced-motion: reduce) { md-ripple { display: none; } }
|
|
164
|
-
`];
|
|
169
|
+
`];i([o({type:Boolean})],t.prototype,"expanded",2);i([o({type:String,reflect:!0})],t.prototype,"label",2);i([o({type:String})],t.prototype,"content",2);i([o({type:String,attribute:"overline"})],t.prototype,"overline",2);i([o({type:String,attribute:"supporting-text"})],t.prototype,"supportingText",2);i([o({type:Boolean})],t.prototype,"leading",2);i([o({type:String,attribute:"leading-variant",reflect:!0})],t.prototype,"leadingVariant",2);i([o({type:String,attribute:"leading-icon"})],t.prototype,"leadingIcon",2);i([o({type:String,attribute:"img-href-image",reflect:!0})],t.prototype,"imgHrefImage",2);i([o({type:String,attribute:"avatar-label"})],t.prototype,"avatarLabel",2);i([o({type:String,attribute:"avatar-alt"})],t.prototype,"avatarAlt",2);i([o({type:String,attribute:"avatar-variant"})],t.prototype,"avatarVariant",2);i([o({type:String,attribute:"avatar-src"})],t.prototype,"avatarSrc",2);i([o({type:Number,reflect:!0})],t.prototype,"density",2);t=i([b("scb-accordion-item")],t);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
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]);
|
|
2
|
-
import{_ as l}from"../../vendor/preload-helper.js";import{a as
|
|
2
|
+
import{_ as l}from"../../vendor/preload-helper.js";import{a as b,n as p,r as u,i as h,x as c,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(r,s,a){try{customElements.get(r)||t(r,s,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,f=Object.getOwnPropertyDescriptor,n=(e,t,r,s)=>{for(var a=s>1?void 0:s?f(t,r):t,o=e.length-1,d;o>=0;o--)(d=e[o])&&(a=(s?d(t,r,a):d(a))||a);return s&&a&&m(t,r,a),a};let i=class extends h{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._onKeyDown=e=>{const t=Array.from(this.parentElement?.querySelectorAll("scb-drawer-item")||[]),r=t.indexOf(this);switch(e.key){case"ArrowDown":{e.preventDefault(),(t[r+1]||t[0]).shadowRoot?.querySelector(".scb-drawer-label-text")?.focus();break}case"ArrowUp":{e.preventDefault(),(t[r-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(){i.__rippleLoaded||(await l(()=>import("../../vendor/vendor-material.js").then(e=>e.r),__vite__mapDeps([0,1]),import.meta.url),i.__rippleLoaded=!0),i.__focusRingLoaded||(await l(()=>import("../../vendor/vendor-material.js").then(e=>e.m),__vite__mapDeps([0,1]),import.meta.url),i.__focusRingLoaded=!0),this.leadingIcon&&!i.__iconLoaded&&(await l(()=>import("../../vendor/vendor-material.js").then(e=>e.i),__vite__mapDeps([0,1]),import.meta.url),i.__iconLoaded=!0),this.hasSlotContent&&!i.__iconButtonLoaded&&(await l(()=>import("../scb-icon-button/scb-icon-button.js"),__vite__mapDeps([2,3,1,0,4,5]),import.meta.url),i.__iconButtonLoaded=!0)}_onSlotChange(e){const r=e.target.assignedElements({flatten:!0});this.hasSlotContent=r.length>0&&r.every(s=>s.tagName==="SCB-SUB-DRAWER")}__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 t=e.assignedElements({flatten:!0});this.hasSlotContent=t.length>0&&t.every(r=>r.tagName==="SCB-SUB-DRAWER")}await this.__ensureDepsLoaded()}updated(e){e.has("leadingIcon")&&this.leadingIcon&&this.__ensureDepsLoaded(),e.has("hasSlotContent")&&this.hasSlotContent&&this.__ensureDepsLoaded(),e.has("expanded")&&this.__applyInert()}__applyInert(){const e=this.__submenuEl;e&&(this.expanded?(e.removeAttribute("inert"),e.setAttribute("aria-hidden","false")):(e.setAttribute("inert",""),e.setAttribute("aria-hidden","true")))}render(){const e=!!this.leadingIcon,t=!!this.itemHref,r=this.hasSlotContent;return c`
|
|
3
3
|
<div class="scb-drawer-item">
|
|
4
4
|
<div class="scb-drawer-item-label" ?selected=${this.selected}>
|
|
5
5
|
${t?c`
|
|
@@ -26,8 +26,8 @@ import{_ as l}from"../../vendor/preload-helper.js";import{a as h,n as u,r as p,i
|
|
|
26
26
|
class="scb-drawer-label-text"
|
|
27
27
|
@click=${this._onButtonClick}
|
|
28
28
|
@keydown=${this._onKeyDown}
|
|
29
|
-
${
|
|
30
|
-
${
|
|
29
|
+
${r?"aria-expanded="+String(this.expanded):""}
|
|
30
|
+
${r?"aria-controls="+this.__submenuId:""}
|
|
31
31
|
>
|
|
32
32
|
<span class="scb-drawer-click ${e?"has-icon":""}">
|
|
33
33
|
<md-ripple></md-ripple>
|
|
@@ -37,12 +37,12 @@ import{_ as l}from"../../vendor/preload-helper.js";import{a as h,n as u,r as p,i
|
|
|
37
37
|
</button>
|
|
38
38
|
<md-focus-ring for=${this.__focusId} inward></md-focus-ring>
|
|
39
39
|
`}
|
|
40
|
-
${
|
|
40
|
+
${r?c`
|
|
41
41
|
<scb-icon-button
|
|
42
42
|
icon="${this.expanded?"expand_less":"expand_more"}"
|
|
43
43
|
role="presentation"
|
|
44
44
|
tabindex="-1"
|
|
45
|
-
@click=${
|
|
45
|
+
@click=${s=>{s.stopPropagation(),this._toggleExpand(s)}}
|
|
46
46
|
></scb-icon-button>
|
|
47
47
|
`:""}
|
|
48
48
|
</div>
|
|
@@ -53,90 +53,103 @@ import{_ as l}from"../../vendor/preload-helper.js";import{a as h,n as u,r as p,i
|
|
|
53
53
|
role="region"
|
|
54
54
|
aria-hidden=${this.expanded?"false":"true"}
|
|
55
55
|
>
|
|
56
|
-
<
|
|
56
|
+
<div class="submenu__inner">
|
|
57
|
+
<slot @slotchange=${this._onSlotChange}></slot>
|
|
58
|
+
</div>
|
|
57
59
|
</div>
|
|
58
60
|
</div>
|
|
59
|
-
`}};
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
61
|
+
`}};i.__rippleLoaded=!1;i.__iconLoaded=!1;i.__iconButtonLoaded=!1;i.__focusRingLoaded=!1;i.styles=b`
|
|
62
|
+
:host {
|
|
63
|
+
/* Animationtokens */
|
|
64
|
+
--scb-drawer-sub-transition-duration: var(--scb-motion-duration-quick, 150ms);
|
|
65
|
+
--scb-drawer-sub-transition-easing: var(--scb-motion-easing-standard, cubic-bezier(.69,.16,.2,.98));
|
|
64
66
|
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
67
|
+
--scb-drawer-item-padding-y: 14px;
|
|
68
|
+
--scb-drawer-item-padding-x: 20px;
|
|
69
|
+
--scb-drawer-item-padding-x-has-icon: var(--spacing-4, 12px);
|
|
70
|
+
--scb-drawer-item-radius: 28px;
|
|
71
|
+
--scb-drawer-item-gap: var(--spacing-4, 12px);
|
|
72
|
+
}
|
|
71
73
|
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
74
|
+
.scb-drawer-item-label {
|
|
75
|
+
display: flex;
|
|
76
|
+
align-items: center;
|
|
77
|
+
position: relative;
|
|
78
|
+
}
|
|
77
79
|
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
.scb-drawer-label-text:-moz-focusring { outline: none; }
|
|
80
|
+
.scb-drawer-label-text {
|
|
81
|
+
width: 100%;
|
|
82
|
+
display: block;
|
|
83
|
+
background: transparent;
|
|
84
|
+
border: 0;
|
|
85
|
+
text-align: left;
|
|
86
|
+
font: inherit;
|
|
87
|
+
color: inherit;
|
|
88
|
+
text-decoration: none;
|
|
89
|
+
cursor: pointer;
|
|
90
|
+
padding: 0;
|
|
91
|
+
margin: 0;
|
|
92
|
+
appearance: none;
|
|
93
|
+
-webkit-appearance: none;
|
|
94
|
+
box-sizing: border-box;
|
|
95
|
+
outline: none;
|
|
96
|
+
-webkit-tap-highlight-color: transparent;
|
|
97
|
+
}
|
|
98
|
+
.scb-drawer-label-text:focus,
|
|
99
|
+
.scb-drawer-label-text:focus-visible { outline: none; }
|
|
100
|
+
.scb-drawer-label-text:-moz-focusring { outline: none; }
|
|
100
101
|
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
}
|
|
102
|
+
.scb-drawer-click {
|
|
103
|
+
display: flex;
|
|
104
|
+
align-items: center;
|
|
105
|
+
gap: var(--scb-drawer-item-gap);
|
|
106
|
+
padding-block: var(--scb-drawer-item-padding-y);
|
|
107
|
+
padding-inline: var(--scb-drawer-item-padding-x);
|
|
108
|
+
border-radius: var(--scb-drawer-item-radius);
|
|
109
|
+
position: relative;
|
|
110
|
+
overflow: hidden;
|
|
111
|
+
color: var(--md-sys-color-on-surface);
|
|
112
|
+
}
|
|
113
|
+
.scb-drawer-click.has-icon {
|
|
114
|
+
padding-inline: var(--scb-drawer-item-padding-x-has-icon);
|
|
115
|
+
padding-block: var(--scb-drawer-item-padding-y);
|
|
116
|
+
}
|
|
117
117
|
|
|
118
|
-
|
|
119
|
-
.scb-drawer-click md-ripple { --md-ripple-focus-opacity: 0; }
|
|
118
|
+
.scb-drawer-click md-ripple { --md-ripple-focus-opacity: 0; }
|
|
120
119
|
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
120
|
+
.scb-drawer-item-label[selected] .scb-drawer-click,
|
|
121
|
+
:host([selected]) .scb-drawer-click {
|
|
122
|
+
color: var(--md-sys-color-on-secondary-container);
|
|
123
|
+
background: var(--md-sys-color-secondary-container);
|
|
124
|
+
font-weight: 600;
|
|
125
|
+
}
|
|
127
126
|
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
127
|
+
scb-icon-button {
|
|
128
|
+
margin-left: auto;
|
|
129
|
+
flex: 0 0 auto;
|
|
130
|
+
}
|
|
132
131
|
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
132
|
+
/* Undermeny: CSS-grid 0fr → 1fr för höjd-animation utan JS-mätningar */
|
|
133
|
+
.submenu {
|
|
134
|
+
display: grid;
|
|
135
|
+
grid-template-rows: 0fr;
|
|
136
|
+
transition:
|
|
137
|
+
grid-template-rows var(--scb-drawer-sub-transition-duration) var(--scb-drawer-sub-transition-easing),
|
|
138
|
+
opacity var(--scb-drawer-sub-transition-duration) var(--scb-drawer-sub-transition-easing);
|
|
139
|
+
opacity: 0;
|
|
140
|
+
overflow: hidden;
|
|
141
|
+
padding-left: var(--spacing-5, 16px);
|
|
142
|
+
}
|
|
143
|
+
.submenu.expanded {
|
|
144
|
+
grid-template-rows: 1fr;
|
|
145
|
+
opacity: 1;
|
|
146
|
+
}
|
|
147
|
+
.submenu__inner {
|
|
148
|
+
overflow: hidden;
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
/* Minskar rörelse för användare som önskar det */
|
|
152
|
+
@media (prefers-reduced-motion: reduce) {
|
|
153
|
+
.submenu { transition: none; }
|
|
154
|
+
}
|
|
155
|
+
`;n([p({type:String})],i.prototype,"label",2);n([p({type:Boolean,reflect:!0})],i.prototype,"selected",2);n([p({type:String,attribute:"leading-icon"})],i.prototype,"leadingIcon",2);n([p({type:String,attribute:"item-href"})],i.prototype,"itemHref",2);n([u()],i.prototype,"hasSlotContent",2);n([u()],i.prototype,"expanded",2);i=n([_("scb-drawer-item")],i);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "scb-wc-test",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.17",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "index.js",
|
|
@@ -277,5 +277,5 @@
|
|
|
277
277
|
},
|
|
278
278
|
"./mvc/*": "./mvc/*"
|
|
279
279
|
},
|
|
280
|
-
"buildHash": "
|
|
280
|
+
"buildHash": "E7C2A3EF4CA13989FA4B253FEFC8AA0045EB5CA36AC88B45ADBF04E2B681817C"
|
|
281
281
|
}
|
|
@@ -24,13 +24,9 @@ export declare class ScbAccordionItem extends LitElement {
|
|
|
24
24
|
disconnectedCallback(): void;
|
|
25
25
|
static styles: import('lit').CSSResult[];
|
|
26
26
|
private toggleAccordion;
|
|
27
|
-
private _setBottomMaxHeight;
|
|
28
27
|
private _onKeyDown;
|
|
29
28
|
private _renderLeading;
|
|
30
|
-
private _bottomEl;
|
|
31
29
|
private _applyInert;
|
|
32
|
-
private _onSlotChange;
|
|
33
|
-
private _onContentLoad;
|
|
34
30
|
private _emitExpandedChanged;
|
|
35
31
|
protected updated(changed: Map<string, unknown>): void;
|
|
36
32
|
protected render(): TemplateResult;
|