scb-wc-test 0.1.227 → 0.1.229
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.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as g,n as s,i as
|
|
1
|
+
import{a as g,n as s,i as v,E as p,x as l,t as b}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(a,r,n){try{customElements.get(a)||i(a,r,n)}catch(d){var c=String(d||"");if(c.indexOf("already been used")===-1&&c.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var m=Object.defineProperty,h=Object.getOwnPropertyDescriptor,o=(t,i,a,r)=>{for(var n=r>1?void 0:r?h(i,a):i,c=t.length-1,d;c>=0;c--)(d=t[c])&&(n=(r?d(i,a,n):d(n))||n);return r&&n&&m(i,a,n),n};let e=class extends v{constructor(){super(...arguments),this.open=!1,this.title="",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._ignoreNextNativeTitleAttrChange=!1,this._onToggle=t=>{const i=t.currentTarget;this.open=!!i.open;const a=this.closest("scb-accordion");this.open&&a&&a.hasAttribute("single-open")&&a.querySelectorAll("scb-accordion-item").forEach(n=>{n!==this&&n.setOpen(!1)}),this._applyInertByOpen()}}static _uid(){return globalThis.crypto?.randomUUID?.()??`${e._uidPrefix}-${++e._uidSeq}`}static get observedAttributes(){const t=super.observedAttributes||[];return t.includes("title")?t:[...t,"title"]}attributeChangedCallback(t,i,a){if(t==="title"&&this._ignoreNextNativeTitleAttrChange){this._ignoreNextNativeTitleAttrChange=!1;return}super.attributeChangedCallback(t,i,a),t==="title"&&a!==null&&(this._ignoreNextNativeTitleAttrChange=!0,this.removeAttribute("title"))}firstUpdated(){this._applyInertByOpen()}_applyInertByOpen(){const t=this.renderRoot.querySelector(".scb-accordion-bottom"),i=this.renderRoot.querySelector("details");!t||!i||(i.open?(t.removeAttribute("inert"),t.setAttribute("aria-hidden","false")):(t.setAttribute("inert",""),t.setAttribute("aria-hidden","true")))}_onKeyDown(t){const i=this.closest("scb-accordion"),r=Array.from(i?.querySelectorAll("scb-accordion-item")||[]).map(d=>d.renderRoot.querySelector("details")?.querySelector(".scb-accordion-top")||null).filter(d=>!!d),n=t.currentTarget,c=r.indexOf(n);switch(t.key){case"ArrowDown":t.preventDefault(),c<r.length-1&&r[c+1].focus();break;case"ArrowUp":t.preventDefault(),c>0&&r[c-1].focus();break;case"Home":t.preventDefault(),r.length&&r[0].focus();break;case"End":t.preventDefault(),r.length&&r[r.length-1].focus();break}}setOpen(t){this.open=!!t;const i=this.renderRoot.querySelector("details");i&&(i.open=this.open),this._applyInertByOpen()}updated(t){if(t.has("open")){const i=this.renderRoot.querySelector("details");i&&i.open!==this.open&&(i.open=this.open),this._applyInertByOpen(),this.dispatchEvent(new CustomEvent("open-changed",{detail:{open:this.open,title:this.title},bubbles:!0,composed:!0}))}}render(){const t=`bottom-${this._unique}`,i=`header-${this._unique}`,a=this.leading?this.leadingVariant==="image"&&this.imgHrefImage?l`<img part="leading-image" class="img" src="${this.imgHrefImage}" alt="" />`:this.leadingVariant==="avatar"?l`
|
|
2
2
|
<scb-avatar
|
|
3
3
|
label=${this.avatarLabel}
|
|
4
4
|
alt=${this.avatarAlt}
|
|
@@ -10,9 +10,9 @@ import{a as g,n as s,i as b,E as p,x as l,t as v}from"../../vendor/vendor.js";im
|
|
|
10
10
|
`:this.leadingVariant==="icon"?l`<md-icon>${this.leadingIcon}</md-icon>`:p:p;return l`
|
|
11
11
|
<details class="scb-accordion-item" ?open=${this.open} @toggle=${this._onToggle}>
|
|
12
12
|
<summary
|
|
13
|
-
id=${
|
|
13
|
+
id=${i}
|
|
14
14
|
class="scb-accordion-top"
|
|
15
|
-
aria-controls=${
|
|
15
|
+
aria-controls=${t}
|
|
16
16
|
@keydown=${this._onKeyDown}
|
|
17
17
|
>
|
|
18
18
|
<md-ripple></md-ripple>
|
|
@@ -28,14 +28,14 @@ import{a as g,n as s,i as b,E as p,x as l,t as v}from"../../vendor/vendor.js";im
|
|
|
28
28
|
<md-icon class="chevron">keyboard_arrow_down</md-icon>
|
|
29
29
|
</summary>
|
|
30
30
|
|
|
31
|
-
<div id=${
|
|
31
|
+
<div id=${t} class="scb-accordion-bottom" role="region" aria-labelledby=${i}>
|
|
32
32
|
<div class="bottom-inner">
|
|
33
33
|
<slot>${this.content}</slot>
|
|
34
34
|
</div>
|
|
35
35
|
</div>
|
|
36
36
|
</details>
|
|
37
37
|
|
|
38
|
-
<md-focus-ring for=${
|
|
38
|
+
<md-focus-ring for=${i} inward></md-focus-ring>
|
|
39
39
|
`}};e._uidPrefix=`uid-${Math.random().toString(36).slice(2)}`;e._uidSeq=0;e.styles=[g`
|
|
40
40
|
:host {
|
|
41
41
|
display: block;
|
|
@@ -45,8 +45,6 @@ import{a as g,n as s,i as b,E as p,x as l,t as v}from"../../vendor/vendor.js";im
|
|
|
45
45
|
--scb-accordion-transition-duration: var(--motion-duration-short, 150ms);
|
|
46
46
|
--scb-accordion-transition-easing: var(--motion-easing-emphasized-accelerate, var(--motion-easing-emphasized, cubic-bezier(.69,.16,.2,.98)));
|
|
47
47
|
--scb-accordion-panel-padding-closed: var(--spacing-0, 0px);
|
|
48
|
-
--scb-accordion-panel-safe-area-inline: var(--spacing-0, 0px);
|
|
49
|
-
--scb-accordion-panel-safe-area-block: var(--spacing-0, 0px);
|
|
50
48
|
|
|
51
49
|
--scb-accordion-item-padding-inline: var(--spacing-5, 16px);
|
|
52
50
|
--scb-accordion-item-padding-block: var(--spacing-7, 24px);
|
|
@@ -80,9 +78,6 @@ import{a as g,n as s,i as b,E as p,x as l,t as v}from"../../vendor/vendor.js";im
|
|
|
80
78
|
--scb-accordion-item-padding-block: var(--spacing-5, 16px);
|
|
81
79
|
--scb-accordion-item-gap: var(--spacing-3, 8px);
|
|
82
80
|
|
|
83
|
-
--scb-accordion-panel-safe-area-inline: var(--spacing-4, 12px);
|
|
84
|
-
--scb-accordion-panel-safe-area-block: var(--spacing-2, 4px);
|
|
85
|
-
|
|
86
81
|
--scb-accordion-title-font-size: var(--md-sys-typescale-title-small-size);
|
|
87
82
|
--scb-accordion-title-line-height: var(--md-sys-typescale-title-small-line-height);
|
|
88
83
|
--scb-accordion-title-letter-spacing: var(--md-sys-typescale-title-small-tracking);
|
|
@@ -157,10 +152,10 @@ import{a as g,n as s,i as b,E as p,x as l,t as v}from"../../vendor/vendor.js";im
|
|
|
157
152
|
grid-template-rows: 1fr;
|
|
158
153
|
opacity: 1;
|
|
159
154
|
overflow: visible;
|
|
160
|
-
padding-top:
|
|
161
|
-
padding-right:
|
|
162
|
-
padding-bottom:
|
|
163
|
-
padding-left:
|
|
155
|
+
padding-top: var(--spacing-2, 4px);
|
|
156
|
+
padding-right: var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px));
|
|
157
|
+
padding-bottom: var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px));
|
|
158
|
+
padding-left: var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px));
|
|
164
159
|
}
|
|
165
160
|
.bottom-inner { overflow: hidden; }
|
|
166
161
|
details[open] .bottom-inner { overflow: visible; }
|
|
@@ -251,4 +246,4 @@ import{a as g,n as s,i as b,E as p,x as l,t as v}from"../../vendor/vendor.js";im
|
|
|
251
246
|
@media (prefers-reduced-motion: reduce) {
|
|
252
247
|
md-ripple { display: none; }
|
|
253
248
|
}
|
|
254
|
-
`];o([s({type:Boolean,reflect:!0})],e.prototype,"open",2);o([s({type:String})],e.prototype,"title",2);o([s({type:String})],e.prototype,"content",2);o([s({type:String,attribute:"overline"})],e.prototype,"overline",2);o([s({type:String,attribute:"supporting-text"})],e.prototype,"supportingText",2);o([s({type:Boolean})],e.prototype,"leading",2);o([s({type:String,attribute:"leading-variant",reflect:!0})],e.prototype,"leadingVariant",2);o([s({type:String,attribute:"leading-icon"})],e.prototype,"leadingIcon",2);o([s({type:String,attribute:"img-href-image",reflect:!0})],e.prototype,"imgHrefImage",2);o([s({type:String,attribute:"avatar-label"})],e.prototype,"avatarLabel",2);o([s({type:String,attribute:"avatar-alt"})],e.prototype,"avatarAlt",2);o([s({type:String,attribute:"avatar-variant"})],e.prototype,"avatarVariant",2);o([s({type:String,attribute:"avatar-src"})],e.prototype,"avatarSrc",2);o([s({type:Number,reflect:!0})],e.prototype,"density",2);e=o([
|
|
249
|
+
`];o([s({type:Boolean,reflect:!0})],e.prototype,"open",2);o([s({type:String})],e.prototype,"title",2);o([s({type:String})],e.prototype,"content",2);o([s({type:String,attribute:"overline"})],e.prototype,"overline",2);o([s({type:String,attribute:"supporting-text"})],e.prototype,"supportingText",2);o([s({type:Boolean})],e.prototype,"leading",2);o([s({type:String,attribute:"leading-variant",reflect:!0})],e.prototype,"leadingVariant",2);o([s({type:String,attribute:"leading-icon"})],e.prototype,"leadingIcon",2);o([s({type:String,attribute:"img-href-image",reflect:!0})],e.prototype,"imgHrefImage",2);o([s({type:String,attribute:"avatar-label"})],e.prototype,"avatarLabel",2);o([s({type:String,attribute:"avatar-alt"})],e.prototype,"avatarAlt",2);o([s({type:String,attribute:"avatar-variant"})],e.prototype,"avatarVariant",2);o([s({type:String,attribute:"avatar-src"})],e.prototype,"avatarSrc",2);o([s({type:Number,reflect:!0})],e.prototype,"density",2);e=o([b("scb-accordion-item")],e);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as
|
|
1
|
+
import{a as _,n as o,i as w,x as e,l as f,t as z}from"../../vendor/vendor.js";import"../scb-chip/scb-chip.js";import"../scb-segmented-button/scb-segmented-button.js";import"../scb-segmented-button/scb-segmented-item.js";import"../scb-accordion/scb-accordion.js";import"../scb-divider/scb-divider.js";import"../scb-horizontal-scroller/scb-horizontal-scroller.js";import"../../vendor/preload-helper.js";import"../../vendor/vendor-material.js";import"../scb-accordion/scb-accordion-item.js";import"../scb-button/scb-button.js";import"../scb-icon-button/scb-icon-button.js";(function(){try{var t=typeof globalThis<"u"?globalThis:window;if(!t.__scb_ce_guard_installed__){t.__scb_ce_guard_installed__=!0;var s=customElements.define.bind(customElements);customElements.define=function(c,r,i){try{customElements.get(c)||s(c,r,i)}catch(p){var h=String(p||"");if(h.indexOf("already been used")===-1&&h.indexOf("NotSupportedError")===-1)throw p}}}}catch{}})();var L=Object.defineProperty,x=Object.getOwnPropertyDescriptor,S=t=>{throw TypeError(t)},l=(t,s,c,r)=>{for(var i=r>1?void 0:r?x(s,c):s,h=t.length-1,p;h>=0;h--)(p=t[h])&&(i=(r?p(s,c,i):p(i))||i);return r&&i&&L(s,c,i),i},M=(t,s,c)=>s.has(t)||S("Cannot "+c),C=(t,s,c)=>s.has(t)?S("Cannot add the same private member more than once"):s instanceof WeakSet?s.add(t):s.set(t,c),v=(t,s,c)=>(M(t,s,"access private method"),c),n,y,g;const u=`<svg version="1.1" id="Lager_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
|
2
2
|
viewBox="0 0 727.3 87.3" style="enable-background:new 0 0 727.3 87.3;" xml:space="preserve" fill="currentColor">
|
|
3
3
|
<style type="text/css">
|
|
4
4
|
.st0{clip-path:url(#SVGID_00000118375311472882578510000008414848687067442345_);}
|
|
@@ -113,11 +113,11 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
113
113
|
<path d="M688.2,24.4h5.8v6h-5.8V24.4z M688.2,36.6h5.8v30.1h-5.8V36.6z"/>
|
|
114
114
|
<path d="M701.8,24.4h5.8v26.3h0.1l11.2-14.1h7l-10,11.7l11.4,18.3H720l-7.7-14l-4.6,5.4v8.7h-5.8V24.4H701.8z"/>
|
|
115
115
|
</svg>
|
|
116
|
-
`;let a=class extends
|
|
116
|
+
`;let a=class extends w{constructor(){super(...arguments),C(this,n),this.variant="Standard",this.selectedChip="Diagram",this.title="",this.subtitle="",this.description="",this.comment="",this.source="",this.footnote="",this.lang="sv",this.imageHref="",this.officialStatistics=!1,this.disableToggle=!1,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0}get descriptionLabel(){return this.lang==="en"?"Description of the chart":"Beskrivning av diagrammet"}get moreAboutStatsLabel(){return this.lang==="en"?"More about the statistics":"Mer om statistiken"}get commentLabel(){return this.lang==="en"?"Comments":"Kommentar"}get sourceLabel(){return this.lang==="en"?"Source":"Källa"}get footnoteLabel(){return this.lang==="en"?"Footnotes":"Fotnot"}get officialStatisticsLabel(){return this.lang==="en"?"Official statistics of Sweden":"Sveriges officiella statistik"}get officialStatisticsTitle(){return this.lang==="en"?"Part of Official statistics of Sweden":"Tillhör Sveriges officiella statistik"}get officialStatisticsAlt(){return this.lang==="en"?"Read more about Official statistics of Sweden":"Läs mer om Sveriges officiella statistik"}firstUpdated(t){const s=this.shadowRoot?.querySelector('slot[name="table"]');s&&(s.addEventListener("slotchange",()=>this._styleSlottedTable()),this._styleSlottedTable()),v(this,n,y).call(this),this._syncChipClass()}updated(t){super.updated(t),this._styleSlottedTable(),(t.has("selectedChip")||t.has("variant"))&&this._syncChipClass(),t.has("selectedChip")&&this._dispatchSelectedChipChanged(),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&v(this,n,y).call(this)}_styleSlottedTable(){const t=this.shadowRoot?.querySelector('slot[name="table"]');if(!t)return;t.assignedElements({flatten:!0}).forEach(c=>{const r=[];c.tagName==="TABLE"?r.push(c):c.querySelectorAll("table").forEach(i=>r.push(i)),r.forEach(i=>{i.style.borderCollapse="collapse",!i.style.width&&!i.getAttribute("width")&&(i.style.width="100%");const h="1px solid var(--md-sys-color-shadow)";i.querySelectorAll("th, td").forEach(d=>{const b=d;b.style.border=h,b.style.padding="8px",b.style.backgroundColor="inherit"}),i.querySelectorAll("thead th").forEach(d=>{d.style.fontWeight="var(--weight-bold)"}),i.querySelectorAll("tbody th").forEach(d=>{d.style.fontWeight="var(--weight-regular)"}),Array.from(i.querySelectorAll("tr")).forEach((d,b)=>{d.style.background=b%2===0?"var(--md-sys-color-surface-container)":"var(--md-sys-color-surface)",Array.from(d.children).filter(m=>m.tagName==="TD"||m.tagName==="TH").forEach((m,$)=>{m.style.textAlign=$===0?"left":"right"})})})})}render(){switch(this.variant){case"Table":return e`
|
|
117
117
|
<div part="container">
|
|
118
118
|
<div class="header">
|
|
119
|
-
${this.title?
|
|
120
|
-
${this.subtitle?
|
|
119
|
+
${this.title?e` <div class="label">${this.title}</div> `:""}
|
|
120
|
+
${this.subtitle?e` <div class="subtitle">${this.subtitle}</div> `:""}
|
|
121
121
|
</div>
|
|
122
122
|
<div class="content">
|
|
123
123
|
<scb-horizontal-scroller
|
|
@@ -130,36 +130,36 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
130
130
|
</scb-horizontal-scroller>
|
|
131
131
|
</div>
|
|
132
132
|
<div class="footer">
|
|
133
|
-
${this.description?
|
|
133
|
+
${this.description?e`
|
|
134
134
|
<div class="description section">
|
|
135
135
|
<div class="secondary-label">${this.descriptionLabel}</div>
|
|
136
136
|
<div>${this.description}</div>
|
|
137
137
|
</div>
|
|
138
138
|
`:""}
|
|
139
|
-
${this.comment||this.source||this.footnote||this.officialStatistics?
|
|
139
|
+
${this.comment||this.source||this.footnote||this.officialStatistics?e`
|
|
140
140
|
<scb-divider></scb-divider>
|
|
141
141
|
<scb-accordion>
|
|
142
142
|
<scb-accordion-item title="${this.moreAboutStatsLabel}">
|
|
143
143
|
<div class="more-about-stats-content">
|
|
144
|
-
${this.comment?
|
|
144
|
+
${this.comment?e`
|
|
145
145
|
<div class="section">
|
|
146
146
|
<div class="secondary-label">${this.commentLabel}</div>
|
|
147
147
|
<div>${this.comment}</div>
|
|
148
148
|
</div>
|
|
149
149
|
`:""}
|
|
150
|
-
${this.source?
|
|
150
|
+
${this.source?e`
|
|
151
151
|
<div class="section">
|
|
152
152
|
<div class="secondary-label">${this.sourceLabel}</div>
|
|
153
153
|
<div>${this.source}</div>
|
|
154
154
|
</div>
|
|
155
155
|
`:""}
|
|
156
|
-
${this.footnote?
|
|
156
|
+
${this.footnote?e`
|
|
157
157
|
<div class="section">
|
|
158
158
|
<div class="secondary-label">${this.footnoteLabel}</div>
|
|
159
159
|
<div>${this.footnote}</div>
|
|
160
160
|
</div>
|
|
161
161
|
`:""}
|
|
162
|
-
${this.officialStatistics?
|
|
162
|
+
${this.officialStatistics?e`
|
|
163
163
|
<a
|
|
164
164
|
class="sos-logotype-link"
|
|
165
165
|
href="https://www.scb.se/sos"
|
|
@@ -169,7 +169,7 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
169
169
|
aria-label="${this.officialStatisticsAlt}"
|
|
170
170
|
>
|
|
171
171
|
<span class="sos-logotype-small" aria-hidden="true">
|
|
172
|
-
${
|
|
172
|
+
${f(u)}
|
|
173
173
|
</span>
|
|
174
174
|
</a>
|
|
175
175
|
`:""}
|
|
@@ -180,46 +180,46 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
180
180
|
</div>
|
|
181
181
|
<slot></slot>
|
|
182
182
|
</div>
|
|
183
|
-
`;case"Image":return
|
|
183
|
+
`;case"Image":return e`
|
|
184
184
|
<div part="container">
|
|
185
185
|
<div class="header">
|
|
186
|
-
${this.title?
|
|
187
|
-
${this.subtitle?
|
|
186
|
+
${this.title?e` <div class="label">${this.title}</div> `:""}
|
|
187
|
+
${this.subtitle?e` <div class="subtitle">${this.subtitle}</div> `:""}
|
|
188
188
|
</div>
|
|
189
189
|
<div class="content image-content">
|
|
190
190
|
<img src="${this.imageHref}" alt="Image figure" />
|
|
191
191
|
</div>
|
|
192
192
|
<div class="footer">
|
|
193
|
-
${this.description?
|
|
193
|
+
${this.description?e`
|
|
194
194
|
<div class="description section">
|
|
195
195
|
<div class="secondary-label">${this.descriptionLabel}</div>
|
|
196
196
|
<div>${this.description}</div>
|
|
197
197
|
</div>
|
|
198
198
|
`:""}
|
|
199
|
-
${this.comment||this.source||this.footnote||this.officialStatistics?
|
|
199
|
+
${this.comment||this.source||this.footnote||this.officialStatistics?e`
|
|
200
200
|
<scb-divider></scb-divider>
|
|
201
201
|
<scb-accordion>
|
|
202
202
|
<scb-accordion-item title="${this.moreAboutStatsLabel}">
|
|
203
203
|
<div class="more-about-stats-content">
|
|
204
|
-
${this.comment?
|
|
204
|
+
${this.comment?e`
|
|
205
205
|
<div class="section">
|
|
206
206
|
<div class="secondary-label">${this.commentLabel}</div>
|
|
207
207
|
<div>${this.comment}</div>
|
|
208
208
|
</div>
|
|
209
209
|
`:""}
|
|
210
|
-
${this.source?
|
|
210
|
+
${this.source?e`
|
|
211
211
|
<div class="section">
|
|
212
212
|
<div class="secondary-label">${this.sourceLabel}</div>
|
|
213
213
|
<div>${this.source}</div>
|
|
214
214
|
</div>
|
|
215
215
|
`:""}
|
|
216
|
-
${this.footnote?
|
|
216
|
+
${this.footnote?e`
|
|
217
217
|
<div class="section">
|
|
218
218
|
<div class="secondary-label">${this.footnoteLabel}</div>
|
|
219
219
|
<div>${this.footnote}</div>
|
|
220
220
|
</div>
|
|
221
221
|
`:""}
|
|
222
|
-
${this.officialStatistics?
|
|
222
|
+
${this.officialStatistics?e`
|
|
223
223
|
<a
|
|
224
224
|
class="sos-logotype-link"
|
|
225
225
|
href="https://www.scb.se/sos"
|
|
@@ -229,7 +229,7 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
229
229
|
aria-label="${this.officialStatisticsAlt}"
|
|
230
230
|
>
|
|
231
231
|
<span class="sos-logotype-small" aria-hidden="true">
|
|
232
|
-
${
|
|
232
|
+
${f(u)}
|
|
233
233
|
</span>
|
|
234
234
|
</a>
|
|
235
235
|
`:""}
|
|
@@ -240,13 +240,13 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
240
240
|
</div>
|
|
241
241
|
<slot></slot>
|
|
242
242
|
</div>
|
|
243
|
-
`;default:return
|
|
243
|
+
`;default:return e`
|
|
244
244
|
<div part="container">
|
|
245
245
|
<div class="header">
|
|
246
|
-
${this.title?
|
|
247
|
-
${this.subtitle?
|
|
246
|
+
${this.title?e` <div class="label">${this.title}</div> `:""}
|
|
247
|
+
${this.subtitle?e` <div class="subtitle">${this.subtitle}</div> `:""}
|
|
248
248
|
</div>
|
|
249
|
-
${this.variant==="Standard"&&!this.disableToggle?
|
|
249
|
+
${this.variant==="Standard"&&!this.disableToggle?e`
|
|
250
250
|
<div class="flipp-wrapper">
|
|
251
251
|
<scb-segmented-button
|
|
252
252
|
.value=${this.selectedChip||""}
|
|
@@ -284,36 +284,36 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
284
284
|
</scb-horizontal-scroller>
|
|
285
285
|
</div>
|
|
286
286
|
<div class="footer">
|
|
287
|
-
${this.description?
|
|
287
|
+
${this.description?e`
|
|
288
288
|
<div class="description section">
|
|
289
289
|
<div class="secondary-label">${this.descriptionLabel}</div>
|
|
290
290
|
<div>${this.description}</div>
|
|
291
291
|
</div>
|
|
292
292
|
`:""}
|
|
293
|
-
${this.comment||this.source||this.footnote||this.officialStatistics?
|
|
293
|
+
${this.comment||this.source||this.footnote||this.officialStatistics?e`
|
|
294
294
|
<scb-divider></scb-divider>
|
|
295
295
|
<scb-accordion>
|
|
296
296
|
<scb-accordion-item title="${this.moreAboutStatsLabel}">
|
|
297
297
|
<div class="more-about-stats-content">
|
|
298
|
-
${this.comment?
|
|
298
|
+
${this.comment?e`
|
|
299
299
|
<div class="section">
|
|
300
300
|
<div class="secondary-label">${this.commentLabel}</div>
|
|
301
301
|
<div>${this.comment}</div>
|
|
302
302
|
</div>
|
|
303
303
|
`:""}
|
|
304
|
-
${this.source?
|
|
304
|
+
${this.source?e`
|
|
305
305
|
<div class="section">
|
|
306
306
|
<div class="secondary-label">${this.sourceLabel}</div>
|
|
307
307
|
<div>${this.source}</div>
|
|
308
308
|
</div>
|
|
309
309
|
`:""}
|
|
310
|
-
${this.footnote?
|
|
310
|
+
${this.footnote?e`
|
|
311
311
|
<div class="section">
|
|
312
312
|
<div class="secondary-label">${this.footnoteLabel}</div>
|
|
313
313
|
<div>${this.footnote}</div>
|
|
314
314
|
</div>
|
|
315
315
|
`:""}
|
|
316
|
-
${this.officialStatistics?
|
|
316
|
+
${this.officialStatistics?e`
|
|
317
317
|
<a
|
|
318
318
|
class="sos-logotype-link"
|
|
319
319
|
href="https://www.scb.se/sos"
|
|
@@ -323,7 +323,7 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
323
323
|
aria-label="${this.officialStatisticsAlt}"
|
|
324
324
|
>
|
|
325
325
|
<span class="sos-logotype-small" aria-hidden="true">
|
|
326
|
-
${
|
|
326
|
+
${f(u)}
|
|
327
327
|
</span>
|
|
328
328
|
</a>
|
|
329
329
|
`:""}
|
|
@@ -334,7 +334,7 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
334
334
|
</div>
|
|
335
335
|
<slot></slot>
|
|
336
336
|
</div>
|
|
337
|
-
`}}_syncChipClass(){const t=this.variant==="Standard";this.classList.toggle("chip-diagram",t&&this.selectedChip==="Diagram"),this.classList.toggle("chip-table",t&&this.selectedChip==="Table")}_dispatchSelectedChipChanged(){const t={selectedChip:this.selectedChip};this.dispatchEvent(new CustomEvent("selected-chip-changed",{detail:t,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("selectedchipchanged",{detail:t,bubbles:!0,composed:!0}))}_onSegmentedChange(t){const
|
|
337
|
+
`}}_syncChipClass(){const t=this.variant==="Standard";this.classList.toggle("chip-diagram",t&&this.selectedChip==="Diagram"),this.classList.toggle("chip-table",t&&this.selectedChip==="Table")}_dispatchSelectedChipChanged(){const t={selectedChip:this.selectedChip};this.dispatchEvent(new CustomEvent("selected-chip-changed",{detail:t,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("selectedchipchanged",{detail:t,bubbles:!0,composed:!0}))}_onSegmentedChange(t){const s=t.detail?.value;this.selectedChip===s?this.selectedChip=null:this.selectedChip=s}};n=new WeakSet;y=function(){const t=v(this,n,g).call(this,this.spacing),s=v(this,n,g).call(this,this.spacingTop)??t,c=v(this,n,g).call(this,this.spacingBottom)??t,r=v(this,n,g).call(this,this.spacingLeft),i=v(this,n,g).call(this,this.spacingRight);s?this.style.setProperty("--scb-viz-spacing-block-start",s):this.style.removeProperty("--scb-viz-spacing-block-start"),c?this.style.setProperty("--scb-viz-spacing-block-end",c):this.style.removeProperty("--scb-viz-spacing-block-end"),r?this.style.setProperty("--scb-viz-spacing-inline-start",r):this.style.removeProperty("--scb-viz-spacing-inline-start"),i?this.style.setProperty("--scb-viz-spacing-inline-end",i):this.style.removeProperty("--scb-viz-spacing-inline-end")};g=function(t){if(!t)return;const s=String(t).trim();if(s)return/^\d+$/.test(s)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(s,10)))})`:s};a.styles=_`
|
|
338
338
|
:host {
|
|
339
339
|
display: block;
|
|
340
340
|
font-family: var(--brand-font);
|
|
@@ -493,4 +493,4 @@ import{a as u,n as r,i as y,x as s,l as g,t as S}from"../../vendor/vendor.js";im
|
|
|
493
493
|
:host([variant='Standard'].chip-diagram) slot[name='diagram'] {
|
|
494
494
|
display: block;
|
|
495
495
|
}
|
|
496
|
-
`;l([
|
|
496
|
+
`;l([o({type:String,reflect:!0})],a.prototype,"variant",2);l([o({type:String,reflect:!0,attribute:"selected-chip"})],a.prototype,"selectedChip",2);l([o({type:String,reflect:!0})],a.prototype,"title",2);l([o({type:String,reflect:!0})],a.prototype,"subtitle",2);l([o({type:String,reflect:!0})],a.prototype,"description",2);l([o({type:String,reflect:!0})],a.prototype,"comment",2);l([o({type:String,reflect:!0})],a.prototype,"source",2);l([o({type:String,reflect:!0})],a.prototype,"footnote",2);l([o({type:String,reflect:!0,attribute:"lang"})],a.prototype,"lang",2);l([o({type:String,reflect:!0,attribute:"image-href"})],a.prototype,"imageHref",2);l([o({type:Boolean,reflect:!0,attribute:"official-statistics"})],a.prototype,"officialStatistics",2);l([o({type:Boolean,reflect:!0,attribute:"disable-toggle"})],a.prototype,"disableToggle",2);l([o({type:String,reflect:!0})],a.prototype,"spacing",2);l([o({type:String,attribute:"spacing-top",reflect:!0})],a.prototype,"spacingTop",2);l([o({type:String,attribute:"spacing-bottom",reflect:!0})],a.prototype,"spacingBottom",2);l([o({type:String,attribute:"spacing-left",reflect:!0})],a.prototype,"spacingLeft",2);l([o({type:String,attribute:"spacing-right",reflect:!0})],a.prototype,"spacingRight",2);a=l([z("scb-viz")],a);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "scb-wc-test",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.229",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "index.js",
|
|
@@ -378,5 +378,5 @@
|
|
|
378
378
|
},
|
|
379
379
|
"./mvc/*": "./mvc/*"
|
|
380
380
|
},
|
|
381
|
-
"buildHash": "
|
|
381
|
+
"buildHash": "A7E411C439AA53EA95E6D067767BF3980735C8F13B46FE83BE75BC3CF9C2E03C"
|
|
382
382
|
}
|
|
@@ -3,16 +3,16 @@ import { property as o, customElement as m } from "lit/decorators.js";
|
|
|
3
3
|
import "@material/web/focus/md-focus-ring.js";
|
|
4
4
|
import "@material/web/icon/icon.js";
|
|
5
5
|
import "@material/web/ripple/ripple.js";
|
|
6
|
-
var h = Object.defineProperty, u = Object.getOwnPropertyDescriptor, r = (
|
|
7
|
-
for (var s = a > 1 ? void 0 : a ? u(
|
|
8
|
-
(d =
|
|
9
|
-
return a && s && h(
|
|
6
|
+
var h = Object.defineProperty, u = Object.getOwnPropertyDescriptor, r = (t, i, n, a) => {
|
|
7
|
+
for (var s = a > 1 ? void 0 : a ? u(i, n) : i, c = t.length - 1, d; c >= 0; c--)
|
|
8
|
+
(d = t[c]) && (s = (a ? d(i, n, s) : d(s)) || s);
|
|
9
|
+
return a && s && h(i, n, s), s;
|
|
10
10
|
};
|
|
11
11
|
let e = class extends b {
|
|
12
12
|
constructor() {
|
|
13
|
-
super(...arguments), this.open = !1, this.title = "", 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._ignoreNextNativeTitleAttrChange = !1, this._onToggle = (
|
|
14
|
-
const
|
|
15
|
-
this.open = !!
|
|
13
|
+
super(...arguments), this.open = !1, this.title = "", 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._ignoreNextNativeTitleAttrChange = !1, this._onToggle = (t) => {
|
|
14
|
+
const i = t.currentTarget;
|
|
15
|
+
this.open = !!i.open;
|
|
16
16
|
const n = this.closest("scb-accordion");
|
|
17
17
|
this.open && n && n.hasAttribute("single-open") && n.querySelectorAll("scb-accordion-item").forEach((s) => {
|
|
18
18
|
s !== this && s.setOpen(!1);
|
|
@@ -20,57 +20,57 @@ let e = class extends b {
|
|
|
20
20
|
};
|
|
21
21
|
}
|
|
22
22
|
static _uid() {
|
|
23
|
-
var
|
|
24
|
-
return ((
|
|
23
|
+
var t, i;
|
|
24
|
+
return ((i = (t = globalThis.crypto) == null ? void 0 : t.randomUUID) == null ? void 0 : i.call(t)) ?? `${e._uidPrefix}-${++e._uidSeq}`;
|
|
25
25
|
}
|
|
26
26
|
static get observedAttributes() {
|
|
27
|
-
const
|
|
28
|
-
return
|
|
27
|
+
const t = super.observedAttributes || [];
|
|
28
|
+
return t.includes("title") ? t : [...t, "title"];
|
|
29
29
|
}
|
|
30
|
-
attributeChangedCallback(
|
|
31
|
-
if (
|
|
30
|
+
attributeChangedCallback(t, i, n) {
|
|
31
|
+
if (t === "title" && this._ignoreNextNativeTitleAttrChange) {
|
|
32
32
|
this._ignoreNextNativeTitleAttrChange = !1;
|
|
33
33
|
return;
|
|
34
34
|
}
|
|
35
|
-
super.attributeChangedCallback(
|
|
35
|
+
super.attributeChangedCallback(t, i, n), t === "title" && n !== null && (this._ignoreNextNativeTitleAttrChange = !0, this.removeAttribute("title"));
|
|
36
36
|
}
|
|
37
37
|
firstUpdated() {
|
|
38
38
|
this._applyInertByOpen();
|
|
39
39
|
}
|
|
40
40
|
_applyInertByOpen() {
|
|
41
|
-
const
|
|
42
|
-
!
|
|
41
|
+
const t = this.renderRoot.querySelector(".scb-accordion-bottom"), i = this.renderRoot.querySelector("details");
|
|
42
|
+
!t || !i || (i.open ? (t.removeAttribute("inert"), t.setAttribute("aria-hidden", "false")) : (t.setAttribute("inert", ""), t.setAttribute("aria-hidden", "true")));
|
|
43
43
|
}
|
|
44
|
-
_onKeyDown(
|
|
45
|
-
const
|
|
44
|
+
_onKeyDown(t) {
|
|
45
|
+
const i = this.closest("scb-accordion"), a = Array.from((i == null ? void 0 : i.querySelectorAll("scb-accordion-item")) || []).map((d) => {
|
|
46
46
|
var g;
|
|
47
47
|
return ((g = d.renderRoot.querySelector("details")) == null ? void 0 : g.querySelector(".scb-accordion-top")) || null;
|
|
48
|
-
}).filter((d) => !!d), s =
|
|
49
|
-
switch (
|
|
48
|
+
}).filter((d) => !!d), s = t.currentTarget, c = a.indexOf(s);
|
|
49
|
+
switch (t.key) {
|
|
50
50
|
case "ArrowDown":
|
|
51
|
-
|
|
51
|
+
t.preventDefault(), c < a.length - 1 && a[c + 1].focus();
|
|
52
52
|
break;
|
|
53
53
|
case "ArrowUp":
|
|
54
|
-
|
|
54
|
+
t.preventDefault(), c > 0 && a[c - 1].focus();
|
|
55
55
|
break;
|
|
56
56
|
case "Home":
|
|
57
|
-
|
|
57
|
+
t.preventDefault(), a.length && a[0].focus();
|
|
58
58
|
break;
|
|
59
59
|
case "End":
|
|
60
|
-
|
|
60
|
+
t.preventDefault(), a.length && a[a.length - 1].focus();
|
|
61
61
|
break;
|
|
62
62
|
}
|
|
63
63
|
}
|
|
64
64
|
/** Programmatisk uppdatering som även speglar <details>. */
|
|
65
|
-
setOpen(
|
|
66
|
-
this.open = !!
|
|
67
|
-
const
|
|
68
|
-
|
|
65
|
+
setOpen(t) {
|
|
66
|
+
this.open = !!t;
|
|
67
|
+
const i = this.renderRoot.querySelector("details");
|
|
68
|
+
i && (i.open = this.open), this._applyInertByOpen();
|
|
69
69
|
}
|
|
70
|
-
updated(
|
|
71
|
-
if (
|
|
72
|
-
const
|
|
73
|
-
|
|
70
|
+
updated(t) {
|
|
71
|
+
if (t.has("open")) {
|
|
72
|
+
const i = this.renderRoot.querySelector("details");
|
|
73
|
+
i && i.open !== this.open && (i.open = this.open), this._applyInertByOpen(), this.dispatchEvent(new CustomEvent("open-changed", {
|
|
74
74
|
detail: { open: this.open, title: this.title },
|
|
75
75
|
bubbles: !0,
|
|
76
76
|
composed: !0
|
|
@@ -78,7 +78,7 @@ let e = class extends b {
|
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
80
|
render() {
|
|
81
|
-
const
|
|
81
|
+
const t = `bottom-${this._unique}`, i = `header-${this._unique}`, n = this.leading ? this.leadingVariant === "image" && this.imgHrefImage ? l`<img part="leading-image" class="img" src="${this.imgHrefImage}" alt="" />` : this.leadingVariant === "avatar" ? l`
|
|
82
82
|
<scb-avatar
|
|
83
83
|
label=${this.avatarLabel}
|
|
84
84
|
alt=${this.avatarAlt}
|
|
@@ -91,9 +91,9 @@ let e = class extends b {
|
|
|
91
91
|
return l`
|
|
92
92
|
<details class="scb-accordion-item" ?open=${this.open} @toggle=${this._onToggle}>
|
|
93
93
|
<summary
|
|
94
|
-
id=${
|
|
94
|
+
id=${i}
|
|
95
95
|
class="scb-accordion-top"
|
|
96
|
-
aria-controls=${
|
|
96
|
+
aria-controls=${t}
|
|
97
97
|
@keydown=${this._onKeyDown}
|
|
98
98
|
>
|
|
99
99
|
<md-ripple></md-ripple>
|
|
@@ -109,14 +109,14 @@ let e = class extends b {
|
|
|
109
109
|
<md-icon class="chevron">keyboard_arrow_down</md-icon>
|
|
110
110
|
</summary>
|
|
111
111
|
|
|
112
|
-
<div id=${
|
|
112
|
+
<div id=${t} class="scb-accordion-bottom" role="region" aria-labelledby=${i}>
|
|
113
113
|
<div class="bottom-inner">
|
|
114
114
|
<slot>${this.content}</slot>
|
|
115
115
|
</div>
|
|
116
116
|
</div>
|
|
117
117
|
</details>
|
|
118
118
|
|
|
119
|
-
<md-focus-ring for=${
|
|
119
|
+
<md-focus-ring for=${i} inward></md-focus-ring>
|
|
120
120
|
`;
|
|
121
121
|
}
|
|
122
122
|
};
|
|
@@ -132,8 +132,6 @@ e.styles = [
|
|
|
132
132
|
--scb-accordion-transition-duration: var(--motion-duration-short, 150ms);
|
|
133
133
|
--scb-accordion-transition-easing: var(--motion-easing-emphasized-accelerate, var(--motion-easing-emphasized, cubic-bezier(.69,.16,.2,.98)));
|
|
134
134
|
--scb-accordion-panel-padding-closed: var(--spacing-0, 0px);
|
|
135
|
-
--scb-accordion-panel-safe-area-inline: var(--spacing-0, 0px);
|
|
136
|
-
--scb-accordion-panel-safe-area-block: var(--spacing-0, 0px);
|
|
137
135
|
|
|
138
136
|
--scb-accordion-item-padding-inline: var(--spacing-5, 16px);
|
|
139
137
|
--scb-accordion-item-padding-block: var(--spacing-7, 24px);
|
|
@@ -167,9 +165,6 @@ e.styles = [
|
|
|
167
165
|
--scb-accordion-item-padding-block: var(--spacing-5, 16px);
|
|
168
166
|
--scb-accordion-item-gap: var(--spacing-3, 8px);
|
|
169
167
|
|
|
170
|
-
--scb-accordion-panel-safe-area-inline: var(--spacing-4, 12px);
|
|
171
|
-
--scb-accordion-panel-safe-area-block: var(--spacing-2, 4px);
|
|
172
|
-
|
|
173
168
|
--scb-accordion-title-font-size: var(--md-sys-typescale-title-small-size);
|
|
174
169
|
--scb-accordion-title-line-height: var(--md-sys-typescale-title-small-line-height);
|
|
175
170
|
--scb-accordion-title-letter-spacing: var(--md-sys-typescale-title-small-tracking);
|
|
@@ -244,10 +239,10 @@ e.styles = [
|
|
|
244
239
|
grid-template-rows: 1fr;
|
|
245
240
|
opacity: 1;
|
|
246
241
|
overflow: visible;
|
|
247
|
-
padding-top:
|
|
248
|
-
padding-right:
|
|
249
|
-
padding-bottom:
|
|
250
|
-
padding-left:
|
|
242
|
+
padding-top: var(--spacing-2, 4px);
|
|
243
|
+
padding-right: var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px));
|
|
244
|
+
padding-bottom: var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px));
|
|
245
|
+
padding-left: var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px));
|
|
251
246
|
}
|
|
252
247
|
.bottom-inner { overflow: hidden; }
|
|
253
248
|
details[open] .bottom-inner { overflow: visible; }
|