scb-wc-test 0.1.233 → 0.1.235
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-stepper/scb-step.js +8 -13
- package/mvc/components/scb-stepper/scb-stepper.js +4 -24
- package/mvc/components/scb-viz/scb-viz.js +30 -30
- package/package.json +2 -2
- package/scb-stepper/scb-step.js +5 -10
- package/scb-stepper/scb-stepper.js +79 -125
- package/scb-viz/scb-viz.js +1 -1
- package/scb-wc-test.bundle.js +579 -604
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as
|
|
1
|
+
import{a as m,n as s,i as b,x as n,t as p}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 i=customElements.define.bind(customElements);customElements.define=function(o,r,l){try{customElements.get(o)||i(o,r,l)}catch(d){var c=String(d||"");if(c.indexOf("already been used")===-1&&c.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var h=Object.defineProperty,u=Object.getOwnPropertyDescriptor,a=(e,i,o,r)=>{for(var l=r>1?void 0:r?u(i,o):i,c=e.length-1,d;c>=0;c--)(d=e[c])&&(l=(r?d(i,o,l):d(l))||l);return r&&l&&h(i,o,l),l};let t=class extends b{constructor(){super(...arguments),this.label="",this.subLabel="",this.symbolVariant="number",this.number=0,this.active=!1,this.completed=!1,this.changeOnCompleted=!1,this.islast=!1,this.variant="horizontal",this.icon=""}updated(){!this.subLabel||this.subLabel.trim()===""?this.setAttribute("no-content",""):this.removeAttribute("no-content")}handleKeyDown(e){e.key==="Enter"||e.key===" "?(e.preventDefault(),this.dispatchEvent(new MouseEvent("click",{bubbles:!0,composed:!0}))):(e.key==="ArrowRight"||e.key==="ArrowLeft")&&(this.dispatchEvent(new CustomEvent("scb-stepper-keynav",{detail:{key:e.key},bubbles:!0,composed:!0})),e.preventDefault())}render(){const e=this.active?"step":void 0,i=this.label?`${this.label}${this.subLabel?": "+this.subLabel:""}`:void 0;switch(this.symbolVariant){case"icon":return n`
|
|
2
2
|
<div
|
|
3
3
|
class="scb-step-content"
|
|
4
4
|
tabindex="0"
|
|
@@ -9,7 +9,7 @@ import{a as b,n as s,i as m,x as l,t as p}from"../../vendor/vendor.js";import"..
|
|
|
9
9
|
>
|
|
10
10
|
<md-ripple></md-ripple>
|
|
11
11
|
<div class="symbol">
|
|
12
|
-
${this.completed&&this.changeOnCompleted?
|
|
12
|
+
${this.completed&&this.changeOnCompleted?n`<md-icon>check</md-icon>`:n`<md-icon>${this.icon}</md-icon>`}
|
|
13
13
|
</div>
|
|
14
14
|
<div class="content">
|
|
15
15
|
<div class="label" data-label="${this.label}"><span class="label-text">${this.label}</span></div>
|
|
@@ -17,7 +17,7 @@ import{a as b,n as s,i as m,x as l,t as p}from"../../vendor/vendor.js";import"..
|
|
|
17
17
|
</div>
|
|
18
18
|
<md-focus-ring></md-focus-ring>
|
|
19
19
|
</div>
|
|
20
|
-
`;case"marker":return
|
|
20
|
+
`;case"marker":return n`
|
|
21
21
|
<div
|
|
22
22
|
class="scb-step-content"
|
|
23
23
|
tabindex="0"
|
|
@@ -28,7 +28,7 @@ import{a as b,n as s,i as m,x as l,t as p}from"../../vendor/vendor.js";import"..
|
|
|
28
28
|
>
|
|
29
29
|
<md-ripple></md-ripple>
|
|
30
30
|
<div class="symbol">
|
|
31
|
-
${this.completed&&this.changeOnCompleted?
|
|
31
|
+
${this.completed&&this.changeOnCompleted?n`<md-icon>check</md-icon>`:n``}
|
|
32
32
|
</div>
|
|
33
33
|
<div class="content">
|
|
34
34
|
<div class="label" data-label="${this.label}"><span class="label-text">${this.label}</span></div>
|
|
@@ -36,7 +36,7 @@ import{a as b,n as s,i as m,x as l,t as p}from"../../vendor/vendor.js";import"..
|
|
|
36
36
|
</div>
|
|
37
37
|
<md-focus-ring></md-focus-ring>
|
|
38
38
|
</div>
|
|
39
|
-
`;default:return
|
|
39
|
+
`;default:return n`
|
|
40
40
|
<div
|
|
41
41
|
class="scb-step-content"
|
|
42
42
|
tabindex="0"
|
|
@@ -47,7 +47,7 @@ import{a as b,n as s,i as m,x as l,t as p}from"../../vendor/vendor.js";import"..
|
|
|
47
47
|
>
|
|
48
48
|
<md-ripple></md-ripple>
|
|
49
49
|
<div class="symbol">
|
|
50
|
-
${this.completed&&this.changeOnCompleted?
|
|
50
|
+
${this.completed&&this.changeOnCompleted?n`<md-icon>check</md-icon>`:n`<span>${this.number}</span>`}
|
|
51
51
|
</div>
|
|
52
52
|
<div class="content">
|
|
53
53
|
<div class="label" data-label="${this.label}"><span class="label-text">${this.label}</span></div>
|
|
@@ -55,7 +55,7 @@ import{a as b,n as s,i as m,x as l,t as p}from"../../vendor/vendor.js";import"..
|
|
|
55
55
|
</div>
|
|
56
56
|
<md-focus-ring></md-focus-ring>
|
|
57
57
|
</div>
|
|
58
|
-
`}}};t.styles=
|
|
58
|
+
`}}};t.styles=m`
|
|
59
59
|
:host {
|
|
60
60
|
font-family: var(--brand-font);
|
|
61
61
|
--scb-step-slide-from-x: 0px;
|
|
@@ -75,9 +75,7 @@ import{a as b,n as s,i as m,x as l,t as p}from"../../vendor/vendor.js";import"..
|
|
|
75
75
|
background: none;
|
|
76
76
|
box-sizing: border-box;
|
|
77
77
|
user-select: none;
|
|
78
|
-
padding
|
|
79
|
-
padding-block-start: var(--scb-stepper-step-padding-block-start, var(--spacing-4));
|
|
80
|
-
padding-block-end: var(--spacing-4);
|
|
78
|
+
padding: var(--spacing-4);
|
|
81
79
|
}
|
|
82
80
|
.scb-step-content:focus,
|
|
83
81
|
.scb-step-content:focus-visible {
|
|
@@ -171,9 +169,6 @@ import{a as b,n as s,i as m,x as l,t as p}from"../../vendor/vendor.js";import"..
|
|
|
171
169
|
min-width: 0;
|
|
172
170
|
will-change: transform, opacity;
|
|
173
171
|
}
|
|
174
|
-
:host([labels-hidden]) .content{
|
|
175
|
-
display: none;
|
|
176
|
-
}
|
|
177
172
|
:host([variant="vertical"]) {
|
|
178
173
|
.scb-step-content {
|
|
179
174
|
flex-direction: row;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as
|
|
1
|
+
import{a as w,n as p,i as k,x as C,t as I}from"../../vendor/vendor.js";import"./scb-step.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 e=customElements.define.bind(customElements);customElements.define=function(s,i,r){try{customElements.get(s)||e(s,i,r)}catch(d){var l=String(d||"");if(l.indexOf("already been used")===-1&&l.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var z=Object.defineProperty,E=Object.getOwnPropertyDescriptor,S=t=>{throw TypeError(t)},c=(t,e,s,i)=>{for(var r=i>1?void 0:i?E(e,s):e,l=t.length-1,d;l>=0;l--)(d=t[l])&&(r=(i?d(e,s,r):d(r))||r);return i&&r&&z(e,s,r),r},_=(t,e,s)=>e.has(t)||S("Cannot "+s),b=(t,e,s)=>(_(t,e,"read from private field"),s?s.call(t):e.get(t)),m=(t,e,s)=>e.has(t)?S("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(t):e.set(t,s),u=(t,e,s,i)=>(_(t,e,"write to private field"),e.set(t,s),s),o=(t,e,s)=>(_(t,e,"access private method"),s),v,h,a,y,g,f,x;let n=class extends k{constructor(){super(...arguments),m(this,a),this.type="",this.label="",this.changeOnCompleted=!1,this.variant="horizontal",this.symbolVariant="number",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this.activeIndex=0,m(this,v),m(this,h,0),this._onKeyNav=t=>{const e=this._getSteps(),s=this.activeIndex;let i=s;t.detail.key==="ArrowRight"?s<e.length-1?i=s+1:i=0:t.detail.key==="ArrowLeft"&&(s>0?i=s-1:i=e.length-1),i!==s&&(this._onStepClick(i),setTimeout(()=>{const r=e[i].shadowRoot?.querySelector(".scb-step-content");r&&"focus"in r&&typeof r.focus=="function"&&r.focus()},0))},this._onStepContainerClick=t=>{const e=this._getSteps(),s=t.composedPath(),i=e.findIndex(r=>s.includes(r));i!==-1&&this._onStepClick(i)},this._onSlotChange=()=>{const t=this._getSteps();if(t.length===0){this.activeIndex=0;return}this.activeIndex>t.length-1?this.activeIndex=t.length-1:this.activeIndex<0&&(this.activeIndex=0),this._updateSteps(),o(this,a,f).call(this)}}_onStepClick(t){const e=this.activeIndex;this.activeIndex=t,this._updateSteps(),this.dispatchEvent(new CustomEvent("step-change",{detail:{index:this.activeIndex,step:this._getSteps()[this.activeIndex]},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepchange",{detail:{index:this.activeIndex,step:this._getSteps()[this.activeIndex]},bubbles:!0,composed:!0})),t>e?(this.dispatchEvent(new CustomEvent("step-next",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepnext",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0}))):t<e&&(this.dispatchEvent(new CustomEvent("step-prev",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepprev",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0})))}nextStep(){const t=this._getSteps();this.activeIndex<t.length-1&&this._onStepClick(this.activeIndex+1)}prevStep(){this.activeIndex>0&&this._onStepClick(this.activeIndex-1)}getActiveIndex(){return this.activeIndex}_updateSteps(){const t=this._getSteps();this.style.setProperty("--scb-stepper-step-count",String(Math.max(1,t.length))),t.forEach((e,s)=>{e.active=s===this.activeIndex,e.completed=s<this.activeIndex,e.islast=!1,e.changeOnCompleted=this.changeOnCompleted,e.number=s+1,e.variant=this.variant,e.symbolVariant=this.symbolVariant}),t.length>0&&(t[t.length-1].islast=!0)}_getSteps(){return Array.from(this.querySelectorAll("scb-step"))}firstUpdated(t){this._updateSteps(),o(this,a,y).call(this),o(this,a,f).call(this)}updated(t){this._updateSteps(),(t.has("variant")||t.has("symbolVariant"))&&o(this,a,f).call(this),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&o(this,a,y).call(this)}render(){return C`
|
|
2
2
|
<div
|
|
3
3
|
class="steps"
|
|
4
4
|
role="list"
|
|
@@ -8,16 +8,13 @@ import{a as L,n as h,i as A,x as O,t as R}from"../../vendor/vendor.js";import"./
|
|
|
8
8
|
>
|
|
9
9
|
<slot @slotchange=${this._onSlotChange}></slot>
|
|
10
10
|
</div>
|
|
11
|
-
|
|
12
|
-
`}connectedCallback(){super.connectedCallback(),typeof ResizeObserver<"u"&&(m(this,b,new ResizeObserver(()=>{o(this,n,f).call(this)})),v(this,b).observe(this))}disconnectedCallback(){v(this,b)&&(v(this,b).disconnect(),m(this,b,void 0)),v(this,d)&&(cancelAnimationFrame(v(this,d)),m(this,d,0)),super.disconnectedCallback()}};b=new WeakMap;d=new WeakMap;n=new WeakSet;S=function(){const t=o(this,n,u).call(this,this.spacing),e=o(this,n,u).call(this,this.spacingTop)??t,s=o(this,n,u).call(this,this.spacingBottom)??t,i=o(this,n,u).call(this,this.spacingLeft),a=o(this,n,u).call(this,this.spacingRight);e?this.style.setProperty("--scb-stepper-spacing-block-start",e):this.style.removeProperty("--scb-stepper-spacing-block-start"),s?this.style.setProperty("--scb-stepper-spacing-block-end",s):this.style.removeProperty("--scb-stepper-spacing-block-end"),i?this.style.setProperty("--scb-stepper-spacing-inline-start",i):this.style.removeProperty("--scb-stepper-spacing-inline-start"),a?this.style.setProperty("--scb-stepper-spacing-inline-end",a):this.style.removeProperty("--scb-stepper-spacing-inline-end")};u=function(t){if(!t)return;const e=String(t).trim();if(e)return/^\d+$/.test(e)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(e,10)))})`:e};f=function(){v(this,d)||m(this,d,requestAnimationFrame(()=>{m(this,d,0),o(this,n,I).call(this)}))};E=function(){const t=getComputedStyle(this).getPropertyValue("--scb-stepper-label-max-lines").trim(),e=parseInt(t,10);return Number.isFinite(e)&&e>0?e:2};x=function(t){const e=this.renderRoot?.querySelector(".label-measure");return e?(e.textContent=t,e.scrollWidth):0};I=function(){const t=this._getSteps();if(t.length===0)return;if(this.variant!=="horizontal"){this.removeAttribute("labels-hidden"),t.forEach(i=>i.removeAttribute("labels-hidden")),t.forEach(i=>{const a=i.shadowRoot;if(!a)return;const r=a.querySelector(".label");r&&(r.style.removeProperty("max-width"),r.style.removeProperty("white-space"),r.style.removeProperty("word-break"),r.style.removeProperty("overflow-wrap"))});return}const e=o(this,n,E).call(this);let s=!1;for(const i of t){const c=i.shadowRoot?.querySelector(".scb-step-content")?.clientWidth??i.clientWidth;if(!c)continue;const g=String(i.label??i.getAttribute("label")??"").trim(),y=String(i.subLabel??i.getAttribute("sub-label")??"").trim(),k=g?o(this,n,x).call(this,g):0,C=y?o(this,n,x).call(this,y):0,W=k?Math.ceil(k/c):1,P=C?Math.ceil(C/c):1;if(Math.max(W,P)>e){s=!0;break}}this.toggleAttribute("labels-hidden",s),t.forEach(i=>i.toggleAttribute("labels-hidden",s)),!s&&t.forEach(i=>{const a=i.shadowRoot;if(!a)return;const r=a.querySelector(".label"),c=a.querySelector(".scb-step-content");if(!r)return;r.style.maxWidth="none",r.style.whiteSpace="nowrap",r.style.wordBreak="normal",r.style.overflowWrap="normal";const g=c?.clientWidth??i.clientWidth;g>0&&r.scrollWidth>g&&(r.style.maxWidth="100%",r.style.whiteSpace="normal",r.style.wordBreak="break-word",r.style.overflowWrap="anywhere")})};l.styles=L`
|
|
11
|
+
`}connectedCallback(){super.connectedCallback(),typeof ResizeObserver<"u"&&(u(this,v,new ResizeObserver(()=>{o(this,a,f).call(this)})),b(this,v).observe(this))}disconnectedCallback(){b(this,v)&&(b(this,v).disconnect(),u(this,v,void 0)),b(this,h)&&(cancelAnimationFrame(b(this,h)),u(this,h,0)),super.disconnectedCallback()}};v=new WeakMap;h=new WeakMap;a=new WeakSet;y=function(){const t=o(this,a,g).call(this,this.spacing),e=o(this,a,g).call(this,this.spacingTop)??t,s=o(this,a,g).call(this,this.spacingBottom)??t,i=o(this,a,g).call(this,this.spacingLeft),r=o(this,a,g).call(this,this.spacingRight);e?this.style.setProperty("--scb-stepper-spacing-block-start",e):this.style.removeProperty("--scb-stepper-spacing-block-start"),s?this.style.setProperty("--scb-stepper-spacing-block-end",s):this.style.removeProperty("--scb-stepper-spacing-block-end"),i?this.style.setProperty("--scb-stepper-spacing-inline-start",i):this.style.removeProperty("--scb-stepper-spacing-inline-start"),r?this.style.setProperty("--scb-stepper-spacing-inline-end",r):this.style.removeProperty("--scb-stepper-spacing-inline-end")};g=function(t){if(!t)return;const e=String(t).trim();if(e)return/^\d+$/.test(e)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(e,10)))})`:e};f=function(){b(this,h)||u(this,h,requestAnimationFrame(()=>{u(this,h,0),o(this,a,x).call(this)}))};x=function(){const t=this._getSteps();t.length!==0&&t.forEach(e=>{const s=e.shadowRoot;if(!s)return;const i=s.querySelector(".label"),r=s.querySelector(".scb-step-content");if(!i)return;if(this.variant!=="horizontal"){i.style.removeProperty("max-width"),i.style.removeProperty("white-space"),i.style.removeProperty("word-break"),i.style.removeProperty("overflow-wrap");return}i.style.maxWidth="none",i.style.whiteSpace="nowrap",i.style.wordBreak="normal",i.style.overflowWrap="normal";const l=r?.clientWidth??e.clientWidth;l>0&&i.scrollWidth>l&&(i.style.maxWidth="100%",i.style.whiteSpace="normal",i.style.wordBreak="break-word",i.style.overflowWrap="anywhere")})};n.styles=w`
|
|
13
12
|
:host {
|
|
14
13
|
--scb-stepper-width: 100%;
|
|
15
14
|
--scb-stepper-height: 100%;
|
|
16
15
|
--scb-stepper-step-count: 1;
|
|
17
16
|
--scb-stepper-connector-gap: var(--spacing-2);
|
|
18
17
|
--scb-stepper-symbol-size: var(--icon-size-medium);
|
|
19
|
-
--scb-stepper-label-max-lines: 2;
|
|
20
|
-
--scb-stepper-step-padding-block-start: var(--spacing-4);
|
|
21
18
|
display: block;
|
|
22
19
|
padding: var(--spacing-5) 0;
|
|
23
20
|
width: 100%;
|
|
@@ -31,9 +28,6 @@ import{a as L,n as h,i as A,x as O,t as R}from"../../vendor/vendor.js";import"./
|
|
|
31
28
|
margin-inline-start: var(--scb-stepper-spacing-inline-start, 0);
|
|
32
29
|
margin-inline-end: var(--scb-stepper-spacing-inline-end, 0);
|
|
33
30
|
}
|
|
34
|
-
:host([labels-hidden]) {
|
|
35
|
-
--scb-stepper-step-padding-block-start: calc(var(--spacing-4) + var(--scb-stepper-symbol-size) + var(--spacing-3));
|
|
36
|
-
}
|
|
37
31
|
.steps {
|
|
38
32
|
display: flex;
|
|
39
33
|
flex-direction: row;
|
|
@@ -60,20 +54,6 @@ import{a as L,n as h,i as A,x as O,t as R}from"../../vendor/vendor.js";import"./
|
|
|
60
54
|
min-width: 0;
|
|
61
55
|
}
|
|
62
56
|
|
|
63
|
-
.label-measure {
|
|
64
|
-
position: absolute;
|
|
65
|
-
left: -9999px;
|
|
66
|
-
top: 0;
|
|
67
|
-
white-space: nowrap;
|
|
68
|
-
visibility: hidden;
|
|
69
|
-
pointer-events: none;
|
|
70
|
-
font-family: var(--brand-font);
|
|
71
|
-
font-size: var(--md-sys-typescale-label-medium-size);
|
|
72
|
-
line-height: var(--md-sys-typescale-label-medium-line-height);
|
|
73
|
-
letter-spacing: var(--md-sys-typescale-label-medium-tracking);
|
|
74
|
-
font-weight: var(--md-sys-typescale-label-medium-weight, 400);
|
|
75
|
-
}
|
|
76
|
-
|
|
77
57
|
/* Horisontell connector
|
|
78
58
|
Bygger upp en linje per steg, med glapp både före och efter varje symbol.
|
|
79
59
|
Första steget ritar bara sin högra del och sista steget ritar bara sin vänstra del.
|
|
@@ -82,7 +62,7 @@ import{a as L,n as h,i as A,x as O,t as R}from"../../vendor/vendor.js";import"./
|
|
|
82
62
|
:host([variant='horizontal']) ::slotted(scb-step)::after {
|
|
83
63
|
content: '';
|
|
84
64
|
position: absolute;
|
|
85
|
-
top: calc(var(--
|
|
65
|
+
top: calc(var(--spacing-4) + (var(--scb-stepper-symbol-size) / 2));
|
|
86
66
|
height: 1px;
|
|
87
67
|
background-color: var(--n-70);
|
|
88
68
|
transition: background-color var(--motion-duration-medium) var(--motion-easing-standard);
|
|
@@ -153,4 +133,4 @@ import{a as L,n as h,i as A,x as O,t as R}from"../../vendor/vendor.js";import"./
|
|
|
153
133
|
::slotted(scb-step[symbol-variant='marker']:not(:first-child))::before {
|
|
154
134
|
top: 20px;
|
|
155
135
|
}
|
|
156
|
-
`;
|
|
136
|
+
`;c([p({type:String,reflect:!0})],n.prototype,"type",2);c([p({type:String,reflect:!0})],n.prototype,"label",2);c([p({type:Boolean,reflect:!0,attribute:"change-on-completed"})],n.prototype,"changeOnCompleted",2);c([p({type:String})],n.prototype,"variant",2);c([p({type:String,reflect:!0,attribute:"symbol-variant"})],n.prototype,"symbolVariant",2);c([p({type:String,reflect:!0})],n.prototype,"spacing",2);c([p({type:String,attribute:"spacing-top",reflect:!0})],n.prototype,"spacingTop",2);c([p({type:String,attribute:"spacing-bottom",reflect:!0})],n.prototype,"spacingBottom",2);c([p({type:String,attribute:"spacing-left",reflect:!0})],n.prototype,"spacingLeft",2);c([p({type:String,attribute:"spacing-right",reflect:!0})],n.prototype,"spacingRight",2);c([p({type:Number,reflect:!0,attribute:"active-index"})],n.prototype,"activeIndex",2);n=c([I("scb-stepper")],n);
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{a as _,n as o,i as w,x as
|
|
1
|
+
import{a as _,n as o,i as w,x as s,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 e=customElements.define.bind(customElements);customElements.define=function(c,r,i){try{customElements.get(c)||e(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,e,c,r)=>{for(var i=r>1?void 0:r?x(e,c):e,h=t.length-1,p;h>=0;h--)(p=t[h])&&(i=(r?p(e,c,i):p(i))||i);return r&&i&&L(e,c,i),i},M=(t,e,c)=>e.has(t)||S("Cannot "+c),C=(t,e,c)=>e.has(t)?S("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(t):e.set(t,c),v=(t,e,c)=>(M(t,e,"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 _,n as o,i as w,x as e,l as f,t as z}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 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
|
|
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 e=this.shadowRoot?.querySelector('slot[name="table"]');e&&(e.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-outline-variant)";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 s`
|
|
117
117
|
<div part="container">
|
|
118
118
|
<div class="header">
|
|
119
|
-
${this.title?
|
|
120
|
-
${this.subtitle?
|
|
119
|
+
${this.title?s` <div class="label">${this.title}</div> `:""}
|
|
120
|
+
${this.subtitle?s` <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 _,n as o,i as w,x as e,l as f,t as z}from"../../vendor/vendor.js";im
|
|
|
130
130
|
</scb-horizontal-scroller>
|
|
131
131
|
</div>
|
|
132
132
|
<div class="footer">
|
|
133
|
-
${this.description?
|
|
133
|
+
${this.description?s`
|
|
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?s`
|
|
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?s`
|
|
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?s`
|
|
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?s`
|
|
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?s`
|
|
163
163
|
<a
|
|
164
164
|
class="sos-logotype-link"
|
|
165
165
|
href="https://www.scb.se/sos"
|
|
@@ -180,46 +180,46 @@ import{a as _,n as o,i as w,x as e,l as f,t as z}from"../../vendor/vendor.js";im
|
|
|
180
180
|
</div>
|
|
181
181
|
<slot></slot>
|
|
182
182
|
</div>
|
|
183
|
-
`;case"Image":return
|
|
183
|
+
`;case"Image":return s`
|
|
184
184
|
<div part="container">
|
|
185
185
|
<div class="header">
|
|
186
|
-
${this.title?
|
|
187
|
-
${this.subtitle?
|
|
186
|
+
${this.title?s` <div class="label">${this.title}</div> `:""}
|
|
187
|
+
${this.subtitle?s` <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?s`
|
|
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?s`
|
|
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?s`
|
|
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?s`
|
|
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?s`
|
|
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?s`
|
|
223
223
|
<a
|
|
224
224
|
class="sos-logotype-link"
|
|
225
225
|
href="https://www.scb.se/sos"
|
|
@@ -240,13 +240,13 @@ import{a as _,n as o,i as w,x as e,l as f,t as z}from"../../vendor/vendor.js";im
|
|
|
240
240
|
</div>
|
|
241
241
|
<slot></slot>
|
|
242
242
|
</div>
|
|
243
|
-
`;default:return
|
|
243
|
+
`;default:return s`
|
|
244
244
|
<div part="container">
|
|
245
245
|
<div class="header">
|
|
246
|
-
${this.title?
|
|
247
|
-
${this.subtitle?
|
|
246
|
+
${this.title?s` <div class="label">${this.title}</div> `:""}
|
|
247
|
+
${this.subtitle?s` <div class="subtitle">${this.subtitle}</div> `:""}
|
|
248
248
|
</div>
|
|
249
|
-
${this.variant==="Standard"&&!this.disableToggle?
|
|
249
|
+
${this.variant==="Standard"&&!this.disableToggle?s`
|
|
250
250
|
<div class="flipp-wrapper">
|
|
251
251
|
<scb-segmented-button
|
|
252
252
|
.value=${this.selectedChip||""}
|
|
@@ -284,36 +284,36 @@ import{a as _,n as o,i as w,x as e,l as f,t as z}from"../../vendor/vendor.js";im
|
|
|
284
284
|
</scb-horizontal-scroller>
|
|
285
285
|
</div>
|
|
286
286
|
<div class="footer">
|
|
287
|
-
${this.description?
|
|
287
|
+
${this.description?s`
|
|
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?s`
|
|
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?s`
|
|
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?s`
|
|
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?s`
|
|
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?s`
|
|
317
317
|
<a
|
|
318
318
|
class="sos-logotype-link"
|
|
319
319
|
href="https://www.scb.se/sos"
|
|
@@ -334,7 +334,7 @@ import{a as _,n as o,i as w,x as e,l as f,t as z}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 e=t.detail?.value;this.selectedChip===e?this.selectedChip=null:this.selectedChip=e}};n=new WeakSet;y=function(){const t=v(this,n,g).call(this,this.spacing),e=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);e?this.style.setProperty("--scb-viz-spacing-block-start",e):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 e=String(t).trim();if(e)return/^\d+$/.test(e)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(e,10)))})`:e};a.styles=_`
|
|
338
338
|
:host {
|
|
339
339
|
display: block;
|
|
340
340
|
font-family: var(--brand-font);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "scb-wc-test",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.235",
|
|
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": "AB241668169F36DF3E4E73769AD322D89978B5342DF9C2DA3548B52F8AC22A98"
|
|
382
382
|
}
|
package/scb-stepper/scb-step.js
CHANGED
|
@@ -3,10 +3,10 @@ import { property as i, customElement as p } from "lit/decorators.js";
|
|
|
3
3
|
import "@material/web/icon/icon.js";
|
|
4
4
|
import "@material/web/ripple/ripple.js";
|
|
5
5
|
import "@material/web/focus/md-focus-ring.js";
|
|
6
|
-
var h = Object.defineProperty,
|
|
7
|
-
for (var
|
|
8
|
-
(d = e[c]) && (
|
|
9
|
-
return
|
|
6
|
+
var h = Object.defineProperty, u = Object.getOwnPropertyDescriptor, a = (e, l, r, n) => {
|
|
7
|
+
for (var o = n > 1 ? void 0 : n ? u(l, r) : l, c = e.length - 1, d; c >= 0; c--)
|
|
8
|
+
(d = e[c]) && (o = (n ? d(l, r, o) : d(o)) || o);
|
|
9
|
+
return n && o && h(l, r, o), o;
|
|
10
10
|
};
|
|
11
11
|
let t = class extends b {
|
|
12
12
|
constructor() {
|
|
@@ -111,9 +111,7 @@ t.styles = m`
|
|
|
111
111
|
background: none;
|
|
112
112
|
box-sizing: border-box;
|
|
113
113
|
user-select: none;
|
|
114
|
-
padding
|
|
115
|
-
padding-block-start: var(--scb-stepper-step-padding-block-start, var(--spacing-4));
|
|
116
|
-
padding-block-end: var(--spacing-4);
|
|
114
|
+
padding: var(--spacing-4);
|
|
117
115
|
}
|
|
118
116
|
.scb-step-content:focus,
|
|
119
117
|
.scb-step-content:focus-visible {
|
|
@@ -207,9 +205,6 @@ t.styles = m`
|
|
|
207
205
|
min-width: 0;
|
|
208
206
|
will-change: transform, opacity;
|
|
209
207
|
}
|
|
210
|
-
:host([labels-hidden]) .content{
|
|
211
|
-
display: none;
|
|
212
|
-
}
|
|
213
208
|
:host([variant="vertical"]) {
|
|
214
209
|
.scb-step-content {
|
|
215
210
|
flex-direction: row;
|