scb-wc-test 0.1.249 → 0.1.251
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-card/scb-card.js +91 -140
- package/mvc/components/scb-list/scb-list-item.js +10 -4
- package/package.json +2 -2
- package/scb-card/scb-card.d.ts +0 -5
- package/scb-card/scb-card.js +116 -195
- package/scb-list/scb-list-item.js +7 -1
- package/scb-wc-test.bundle.js +438 -481
|
@@ -1,12 +1,12 @@
|
|
|
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 x}from"../../vendor/preload-helper.js";import{a as _,n as a,i as z,x as o,t as w}from"../../vendor/vendor.js";import"../../vendor/vendor-material.js";import"../scb-list/scb-list.js";import"../scb-button/scb-button.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-link/scb-link.js";import"../scb-avatar/scb-avatar.js";import"../scb-tooltip/scb-tooltip.js";import"../scb-list/scb-list-item.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,c,n){try{customElements.get(r)||t(r,c,n)}catch(p){var l=String(p||"");if(l.indexOf("already been used")===-1&&l.indexOf("NotSupportedError")===-1)throw p}}}}catch{}})();var S=Object.defineProperty,T=Object.getOwnPropertyDescriptor,$=e=>{throw TypeError(e)},s=(e,t,r,c)=>{for(var n=c>1?void 0:c?T(t,r):t,l=e.length-1,p;l>=0;l--)(p=e[l])&&(n=(c?p(t,r,n):p(n))||n);return c&&n&&S(t,r,n),n},L=(e,t,r)=>t.has(e)||$("Cannot "+r),F=(e,t,r)=>t.has(e)?$("Cannot add the same private member more than once"):t instanceof WeakSet?t.add(e):t.set(e,r),k=(e,t,r)=>(L(e,t,"access private method"),r),v,g;let i=class extends z{constructor(){super(...arguments),F(this,v),this.type="",this.variant="",this.direction="",this.mediaType="",this.mediaHref="",this.mediaAlt="",this.mediaSrcset="",this.mediaSizes="",this.mediaLoading="auto",this.mediaDecoding="async",this.mediaFetchPriority="auto",this.mediaFit="cover",this.mediaPosition="center",this.mediaWidth="",this.mediaHeight="",this.mediaAspect="",this.mediaPlaceholder=!1,this.cardHref="",this.href="",this.title="",this.subtitle="",this.supportingText="",this.commentsText="",this.comments=0,this.commentsHref="",this.likesText="",this.likes=0,this.likesHoverContent="",this.hasLiked=!1,this.likesInteractive=!1,this.author=!1,this.authorText="",this.authorHref="",this.sizing="stretch",this.width="",this.maxWidth="",this.height="",this.maxHeight="",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this.__onImgLoad=e=>{const t=e.currentTarget.closest(".media");t&&t.classList.add("is-loaded")},this.__onKeyDown=e=>{const t=this.__effectiveHref();(e.key==="Enter"||e.key===" ")&&t&&(e.preventDefault(),this.__navigate(t,e))},this.__handleHrefNavigation=e=>{const t=this.__effectiveHref();t&&(e.target.closest("a")||this.__navigate(t,e))}}get likeButton(){return this.type!=="social"?null:this.renderRoot.querySelector(".likes scb-icon-button")}__calcAspectWH(e){const t=(e||"").trim();if(!t)return{w:640,h:360};const r=t.includes("/")?t.split("/"):t.includes(":")?t.split(":"):t.includes("x")?t.split("x"):null;if(r&&r.length===2){const n=Number(r[0]),l=Number(r[1]);if(n>0&&l>0)return{w:n,h:l}}const c=Number(t);return isFinite(c)&&c>0?{w:1e3,h:Math.round(1e3/c)}:{w:640,h:360}}__noWrapText(e){return(e??"").replace(/ /g," ").replace(/-/g,"‑")}__dispatchLikeEvent(e,t){this.dispatchEvent(new CustomEvent(e,{bubbles:!0,composed:!0,detail:t})),this.dispatchEvent(new CustomEvent(e.replace("-",""),{bubbles:!0,composed:!0,detail:t}))}__dispatchCardNavigate(e,t){const r={href:e,originalEvent:t},c=new CustomEvent("card-navigate",{bubbles:!0,composed:!0,cancelable:!0,detail:r});if(this.dispatchEvent(c),c.defaultPrevented)return!1;const n=new CustomEvent("cardnavigate",{bubbles:!0,composed:!0,cancelable:!0,detail:r});return this.dispatchEvent(n),!n.defaultPrevented}__effectiveHref(){return this.cardHref||this.href}__navigate(e,t){e&&this.__dispatchCardNavigate(e,t)&&window.open(e,"_self")}__mediaTemplate(){if((this.mediaType||"").toLowerCase()==="avatar")return o`
|
|
3
3
|
<div class="media">
|
|
4
4
|
<slot name="media">
|
|
5
5
|
<scb-avatar variant="icon" label="${this.title}" icon-name="person"></scb-avatar>
|
|
6
6
|
</slot>
|
|
7
7
|
</div>
|
|
8
|
-
`;if(this.mediaHref||this.mediaSrcset){let
|
|
9
|
-
<div class="media ${l}" style="${
|
|
8
|
+
`;if(this.mediaHref||this.mediaSrcset){let t=Number(this.mediaWidth)||0,r=Number(this.mediaHeight)||0;const c=(this.mediaAspect||"").trim();if(!t||!r){const h=this.__calcAspectWH(c||"16/9");t||(t=h.w),r||(r=h.h)}const n=`aspect-ratio:${c||`${t}/${r}`};`,l=this.mediaPlaceholder?"has-ph":"",p=this.mediaFit||"cover",m=this.mediaPosition||"center";return o`
|
|
9
|
+
<div class="media ${l}" style="${n}">
|
|
10
10
|
<slot name="media-sources"></slot>
|
|
11
11
|
<img
|
|
12
12
|
src="${this.mediaHref||""}"
|
|
@@ -16,164 +16,140 @@ import{_ as $}from"../../vendor/preload-helper.js";import{a as S,n as a,i as w,x
|
|
|
16
16
|
loading="${this.mediaLoading}"
|
|
17
17
|
decoding="${this.mediaDecoding}"
|
|
18
18
|
fetchpriority="${this.mediaFetchPriority}"
|
|
19
|
-
style="object-fit:${p};object-position:${
|
|
20
|
-
width="${
|
|
21
|
-
height="${
|
|
19
|
+
style="object-fit:${p};object-position:${m};"
|
|
20
|
+
width="${t}"
|
|
21
|
+
height="${r}"
|
|
22
22
|
@load=${this.__onImgLoad}
|
|
23
23
|
/>
|
|
24
24
|
</div>
|
|
25
|
-
`}return null}mapSpacingToken(
|
|
25
|
+
`}return null}mapSpacingToken(e){if(!e)return;const t=String(e).trim();if(t)return/^\d+$/.test(t)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(t,10)))})`:t}render(){const e=this.variant?`${this.variant.toLowerCase()}`:"",t=this.type==="list"?"vertical":this.direction?this.direction.toLowerCase():"",r=this.__effectiveHref(),c=r?"clickable":"",n=this.date instanceof Date?this.date.toISOString().slice(0,10):this.date||"",l=(h=!1)=>h?o`<a class="title" href="${r}" tabindex="-1"
|
|
26
26
|
>${this.title}</a
|
|
27
|
-
><md-icon>arrow_forward</md-icon>`:
|
|
27
|
+
><md-icon>arrow_forward</md-icon>`:o`<span class="title">${this.title}</span>`,p=()=>this.__mediaTemplate(),m=h=>o`
|
|
28
28
|
<div
|
|
29
|
-
class="scb-card ${
|
|
30
|
-
@click=${
|
|
31
|
-
@keydown=${
|
|
32
|
-
style="cursor:${
|
|
33
|
-
role=${
|
|
34
|
-
tabindex=${
|
|
35
|
-
aria-label=${this.title||
|
|
29
|
+
class="scb-card ${e} ${t} ${c}"
|
|
30
|
+
@click=${r?this.__handleHrefNavigation:null}
|
|
31
|
+
@keydown=${r?this.__onKeyDown:null}
|
|
32
|
+
style="cursor:${r?"pointer":"default"};"
|
|
33
|
+
role=${r?"link":"group"}
|
|
34
|
+
tabindex=${r?"0":"-1"}
|
|
35
|
+
aria-label=${this.title||"Kort"}
|
|
36
36
|
>
|
|
37
|
-
${o
|
|
38
|
-
${
|
|
39
|
-
${
|
|
37
|
+
${r?o`<md-ripple></md-ripple>`:""}
|
|
38
|
+
${p()}
|
|
39
|
+
${h}
|
|
40
40
|
</div>
|
|
41
41
|
<md-focus-ring></md-focus-ring>
|
|
42
|
-
`;switch(this.type){case"standard":return
|
|
42
|
+
`;switch(this.type){case"standard":return m(o`
|
|
43
43
|
<div class="full-content">
|
|
44
44
|
<div class="top-content">
|
|
45
|
-
${this.title?
|
|
46
|
-
${this.subtitle?
|
|
47
|
-
${this.supportingText?
|
|
48
|
-
${
|
|
45
|
+
${this.title?o`<div class="header">${l(!!r)}</div>`:""}
|
|
46
|
+
${this.subtitle?o`<div class="sub-label">${this.subtitle}</div>`:""}
|
|
47
|
+
${this.supportingText?o`<div class="supporting-text">${this.supportingText}</div>`:""}
|
|
48
|
+
${n?o`<div class="date">${n}</div>`:""}
|
|
49
49
|
</div>
|
|
50
50
|
</div>
|
|
51
|
-
`);case"list":return
|
|
51
|
+
`);case"list":return m(o`
|
|
52
52
|
<div class="full-content">
|
|
53
53
|
<div class="top-content">
|
|
54
|
-
${this.title?
|
|
55
|
-
${this.subtitle?
|
|
56
|
-
${this.supportingText?
|
|
57
|
-
${
|
|
54
|
+
${this.title?o`<div class="header"><span class="title">${this.title}</span></div>`:""}
|
|
55
|
+
${this.subtitle?o`<div class="sub-label">${this.subtitle}</div>`:""}
|
|
56
|
+
${this.supportingText?o`<div class="supporting-text">${this.supportingText}</div>`:""}
|
|
57
|
+
${n?o`<div class="date">${n}</div>`:""}
|
|
58
58
|
</div>
|
|
59
59
|
<div class="content list">
|
|
60
60
|
<slot></slot>
|
|
61
61
|
</div>
|
|
62
62
|
</div>
|
|
63
|
-
`);case"social":const
|
|
63
|
+
`);case"social":const h=this.commentsHref,f=d=>{d.stopPropagation()},u=d=>{const b=this.renderRoot?.querySelector(".scb-card");b&&(d?b.classList.add("no-hover"):b.classList.remove("no-hover"))},y=o`
|
|
64
|
+
<span class="likes" title=""
|
|
65
|
+
@mouseenter=${()=>u(!0)}
|
|
66
|
+
@mouseleave=${()=>u(!1)}
|
|
67
|
+
>
|
|
68
|
+
<scb-icon-button
|
|
69
|
+
id="like-button"
|
|
70
|
+
variant="standard"
|
|
71
|
+
icon="thumb_up"
|
|
72
|
+
?icon-filled=${this.hasLiked} // boolean attribute binding
|
|
73
|
+
aria-label="${this.likesText||"Gilla"}"
|
|
74
|
+
@click=${d=>{d.stopPropagation(),this.hasLiked=!this.hasLiked,this.__dispatchLikeEvent("like-click",{hasLiked:this.hasLiked,likes:this.likes})}}
|
|
75
|
+
@keydown=${d=>{(d.key==="Enter"||d.key===" ")&&(d.preventDefault(),d.stopPropagation(),this.hasLiked=!this.hasLiked,this.__dispatchLikeEvent("like-click",{hasLiked:this.hasLiked,likes:this.likes}))}}
|
|
76
|
+
@hover=${d=>{d.preventDefault(),d.stopPropagation(),this.__dispatchLikeEvent("like-hover",{hasLiked:this.hasLiked,likes:this.likes})}}
|
|
77
|
+
></scb-icon-button>
|
|
78
|
+
<span class="social-text">${this.likesText?`${this.likesText}: `:""}${this.likes}</span>
|
|
79
|
+
</span>
|
|
80
|
+
`;return m(o`
|
|
64
81
|
<div class="full-content">
|
|
65
82
|
<div class="top-content">
|
|
66
|
-
${this.title?
|
|
67
|
-
${this.subtitle?
|
|
68
|
-
${this.supportingText?
|
|
69
|
-
${
|
|
83
|
+
${this.title?o`<div class="header">${l(!!r)}</div>`:""}
|
|
84
|
+
${this.subtitle?o`<div class="sub-label">${this.subtitle}</div>`:""}
|
|
85
|
+
${this.supportingText?o`<div class="supporting-text">${this.supportingText}</div>`:""}
|
|
86
|
+
${n?o`<div class="date">${n}</div>`:""}
|
|
70
87
|
</div>
|
|
71
88
|
<div class="content">
|
|
72
89
|
<div class="social-metrics">
|
|
73
|
-
${this.author?
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
<span
|
|
85
|
-
class="comments"
|
|
86
|
-
@mouseenter=${()=>u(!0)}
|
|
87
|
-
@mouseleave=${()=>u(!1)}
|
|
88
|
-
>
|
|
89
|
-
${m!==""?r`
|
|
90
|
-
<scb-icon-button
|
|
91
|
-
href="${m}"
|
|
92
|
-
tabindex="0"
|
|
93
|
-
@click=${k}
|
|
94
|
-
variant="standard"
|
|
95
|
-
icon="comment"
|
|
96
|
-
aria-label="Gå till kommentarer"
|
|
97
|
-
></scb-icon-button>
|
|
98
|
-
`:r`
|
|
99
|
-
<md-icon>comment</md-icon>
|
|
100
|
-
`}
|
|
101
|
-
<span class="social-text">${this.commentsText}: ${this.comments}</span>
|
|
102
|
-
</span>
|
|
103
|
-
<span
|
|
104
|
-
class="likes"
|
|
90
|
+
${this.author?o`
|
|
91
|
+
<a
|
|
92
|
+
class="author social-text"
|
|
93
|
+
href="${this.authorHref||"#"}"
|
|
94
|
+
tabindex="0"
|
|
95
|
+
@click=${f}
|
|
96
|
+
@mouseenter=${()=>u(!0)}
|
|
97
|
+
@mouseleave=${()=>u(!1)}
|
|
98
|
+
>${this.authorText}</a>
|
|
99
|
+
`:""}
|
|
100
|
+
<span class="comments"
|
|
105
101
|
@mouseenter=${()=>u(!0)}
|
|
106
102
|
@mouseleave=${()=>u(!1)}
|
|
107
103
|
>
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
icon
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
@click=${d=>{d.stopPropagation(),this.hasLiked=!this.hasLiked,this.__dispatchLikeEvent("like-click",{hasLiked:this.hasLiked,likes:this.likes})}}
|
|
115
|
-
@keydown=${d=>{(d.key==="Enter"||d.key===" ")&&(d.preventDefault(),d.stopPropagation(),this.hasLiked=!this.hasLiked,this.__dispatchLikeEvent("like-click",{hasLiked:this.hasLiked,likes:this.likes}))}}
|
|
116
|
-
@hover=${d=>{d.preventDefault(),d.stopPropagation(),this.__dispatchLikeEvent("like-hover",{hasLiked:this.hasLiked,likes:this.likes})}}
|
|
117
|
-
></scb-icon-button>
|
|
118
|
-
${this.likesHoverContent?r`
|
|
119
|
-
<scb-tooltip
|
|
120
|
-
variant="rich"
|
|
121
|
-
for="like-button"
|
|
122
|
-
supporting-text=${this.__noWrapText(this.likesHoverContent)}
|
|
123
|
-
trigger="hover"
|
|
124
|
-
position="right"
|
|
125
|
-
>
|
|
126
|
-
<span class="social-text">${this.likesText}: ${this.likes}</span>
|
|
127
|
-
</scb-tooltip>
|
|
128
|
-
`:r`<span class="social-text">${this.likesText}: ${this.likes}</span>`}
|
|
104
|
+
${h!==""?o`
|
|
105
|
+
<scb-icon-button href="${h}" tabindex="0" @click=${f} variant="standard" icon="comment" aria-label="Gå till kommentarer"></scb-icon-button>
|
|
106
|
+
`:o`
|
|
107
|
+
<md-icon>comment</md-icon>
|
|
108
|
+
`}
|
|
109
|
+
<span class="social-text">${this.commentsText?`${this.commentsText}: `:""}${this.comments}</span>
|
|
129
110
|
</span>
|
|
111
|
+
${this.likesHoverContent?o`
|
|
112
|
+
<scb-tooltip variant="rich" for="like-button" supporting-text=${this.__noWrapText(this.likesHoverContent)} trigger="hover" position="right">
|
|
113
|
+
${y}
|
|
114
|
+
</scb-tooltip>
|
|
115
|
+
`:y}
|
|
130
116
|
</div>
|
|
131
117
|
</div>
|
|
132
118
|
</div>
|
|
133
|
-
`);case"link":return
|
|
119
|
+
`);case"link":return m(o`
|
|
134
120
|
<div class="full-content">
|
|
135
121
|
<div class="top-content">
|
|
136
|
-
${this.title?
|
|
137
|
-
${this.subtitle?
|
|
138
|
-
${this.supportingText?
|
|
139
|
-
${
|
|
122
|
+
${this.title?o`<div class="header"><span class="title">${this.title}</span></div>`:""}
|
|
123
|
+
${this.subtitle?o`<div class="sub-label">${this.subtitle}</div>`:""}
|
|
124
|
+
${this.supportingText?o`<div class="supporting-text">${this.supportingText}</div>`:""}
|
|
125
|
+
${n?o`<div class="date">${n}</div>`:""}
|
|
140
126
|
</div>
|
|
141
127
|
<div class="content links">
|
|
142
128
|
<slot></slot>
|
|
143
129
|
</div>
|
|
144
130
|
</div>
|
|
145
|
-
`);case"action":return
|
|
131
|
+
`);case"action":return m(o`
|
|
146
132
|
<div class="full-content">
|
|
147
133
|
<div class="top-content">
|
|
148
|
-
${this.title?
|
|
149
|
-
${this.subtitle?
|
|
150
|
-
${this.supportingText?
|
|
151
|
-
${
|
|
134
|
+
${this.title?o`<div class="header"><span class="title">${this.title}</span></div>`:""}
|
|
135
|
+
${this.subtitle?o`<div class="sub-label">${this.subtitle}</div>`:""}
|
|
136
|
+
${this.supportingText?o`<div class="supporting-text">${this.supportingText}</div>`:""}
|
|
137
|
+
${n?o`<div class="date">${n}</div>`:""}
|
|
152
138
|
</div>
|
|
153
139
|
<div class="content actions">
|
|
154
140
|
<slot></slot>
|
|
155
141
|
</div>
|
|
156
142
|
</div>
|
|
157
|
-
`);
|
|
158
|
-
<div class="container-content ${this.title||this.subtitle?"has-header":""}">
|
|
159
|
-
${this.title||this.subtitle?r`
|
|
160
|
-
<div class="top-content">
|
|
161
|
-
${this.title?r`<div class="header"><span class="title">${this.title}</span></div>`:""}
|
|
162
|
-
${this.subtitle?r`<div class="sub-label">${this.subtitle}</div>`:""}
|
|
163
|
-
</div>
|
|
164
|
-
`:""}
|
|
165
|
-
<slot></slot>
|
|
166
|
-
</div>
|
|
167
|
-
`);default:return h(r`
|
|
143
|
+
`);default:return m(o`
|
|
168
144
|
<div class="full-content">
|
|
169
145
|
<div class="top-content">
|
|
170
|
-
${this.title?
|
|
171
|
-
${this.subtitle?
|
|
172
|
-
${this.supportingText?
|
|
173
|
-
${
|
|
146
|
+
${this.title?o`<div class="header">${l(!!r)}</div>`:""}
|
|
147
|
+
${this.subtitle?o`<div class="sub-label">${this.subtitle}</div>`:""}
|
|
148
|
+
${this.supportingText?o`<div class="supporting-text">${this.supportingText}</div>`:""}
|
|
149
|
+
${n?o`<div class="date">${n}</div>`:""}
|
|
174
150
|
</div>
|
|
175
151
|
</div>
|
|
176
|
-
`)}}updated(
|
|
152
|
+
`)}}updated(e){super.updated(e),e.has("width")&&(this.width?this.style.inlineSize=this.width:this.style.removeProperty("inline-size")),e.has("maxWidth")&&(this.maxWidth?this.style.maxInlineSize=this.maxWidth:this.style.removeProperty("max-inline-size")),e.has("height")&&(this.height?this.style.blockSize=this.height:this.style.removeProperty("block-size")),e.has("maxHeight")&&(this.maxHeight?this.style.maxBlockSize=this.maxHeight:this.style.removeProperty("max-block-size")),e.has("type")&&(this.type==="list"?this.setAttribute("data-density","-2"):this.removeAttribute("data-density")),this.style.setProperty("--scb-card-media-fit",this.mediaFit||"cover"),this.style.setProperty("--scb-card-media-position",this.mediaPosition||"center"),(e.has("spacing")||e.has("spacingTop")||e.has("spacingBottom")||e.has("spacingLeft")||e.has("spacingRight"))&&k(this,v,g).call(this)}async firstUpdated(e){i.__iconLoaded||(await x(()=>import("../../vendor/vendor-material.js").then(t=>t.i),__vite__mapDeps([0,1]),import.meta.url),i.__iconLoaded=!0),i.__rippleLoaded||(await x(()=>import("../../vendor/vendor-material.js").then(t=>t.r),__vite__mapDeps([0,1]),import.meta.url),i.__rippleLoaded=!0),k(this,v,g).call(this)}};v=new WeakSet;g=function(){const e=this.mapSpacingToken(this.spacing),t=this.mapSpacingToken(this.spacingTop)??e,r=this.mapSpacingToken(this.spacingBottom)??e,c=this.mapSpacingToken(this.spacingLeft),n=this.mapSpacingToken(this.spacingRight);t?this.style.setProperty("--scb-card-spacing-block-start",t):this.style.removeProperty("--scb-card-spacing-block-start"),r?this.style.setProperty("--scb-card-spacing-block-end",r):this.style.removeProperty("--scb-card-spacing-block-end"),c?this.style.setProperty("--scb-card-spacing-inline-start",c):this.style.removeProperty("--scb-card-spacing-inline-start"),n?this.style.setProperty("--scb-card-spacing-inline-end",n):this.style.removeProperty("--scb-card-spacing-inline-end")};i.__iconLoaded=!1;i.__rippleLoaded=!1;i.styles=_`
|
|
177
153
|
:host {
|
|
178
154
|
display: block;
|
|
179
155
|
box-sizing: border-box;
|
|
@@ -221,9 +197,6 @@ import{_ as $}from"../../vendor/preload-helper.js";import{a as S,n as a,i as w,x
|
|
|
221
197
|
:host([type='action']) {
|
|
222
198
|
--scb-card-max-w: var(--scb-card-action-max-w, none);
|
|
223
199
|
}
|
|
224
|
-
:host([type='container']) {
|
|
225
|
-
--scb-card-max-w: var(--scb-card-container-max-w, none);
|
|
226
|
-
}
|
|
227
200
|
|
|
228
201
|
:host([height]) .scb-card,
|
|
229
202
|
:host([max-height]) .scb-card,
|
|
@@ -296,9 +269,6 @@ import{_ as $}from"../../vendor/preload-helper.js";import{a as S,n as a,i as w,x
|
|
|
296
269
|
.scb-card.filled {
|
|
297
270
|
background: var(--md-sys-color-surface-dim, #F9F8EF);
|
|
298
271
|
}
|
|
299
|
-
.scb-card.filled-alternative {
|
|
300
|
-
background: var(--md-sys-color-surface-container, #EEF3FF);
|
|
301
|
-
}
|
|
302
272
|
.scb-card.vertical {
|
|
303
273
|
flex-direction: column;
|
|
304
274
|
}
|
|
@@ -373,23 +343,7 @@ import{_ as $}from"../../vendor/preload-helper.js";import{a as S,n as a,i as w,x
|
|
|
373
343
|
}
|
|
374
344
|
|
|
375
345
|
.full-content {
|
|
376
|
-
padding
|
|
377
|
-
padding-block-end: var(--scb-card-content-padding-block-end, var(--spacing-7, 24px));
|
|
378
|
-
padding-inline-start: var(--scb-card-content-padding-inline-start, var(--spacing-6, 20px));
|
|
379
|
-
padding-inline-end: var(--scb-card-content-padding-inline-end, var(--spacing-6, 20px));
|
|
380
|
-
}
|
|
381
|
-
.container-content {
|
|
382
|
-
display: flex;
|
|
383
|
-
flex-direction: column;
|
|
384
|
-
gap: var(--scb-card-container-gap, var(--spacing-4, 12px));
|
|
385
|
-
padding-block-start: var(--scb-card-container-padding-block-start, var(--scb-card-content-padding-block-start, var(--spacing-7, 24px)));
|
|
386
|
-
padding-block-end: var(--scb-card-container-padding-block-end, var(--scb-card-content-padding-block-end, var(--spacing-7, 24px)));
|
|
387
|
-
padding-inline-start: var(--scb-card-container-padding-inline-start, var(--scb-card-content-padding-inline-start, var(--spacing-6, 20px)));
|
|
388
|
-
padding-inline-end: var(--scb-card-container-padding-inline-end, var(--scb-card-content-padding-inline-end, var(--spacing-6, 20px)));
|
|
389
|
-
min-inline-size: 0;
|
|
390
|
-
}
|
|
391
|
-
.container-content.has-header {
|
|
392
|
-
gap: var(--scb-card-container-gap-with-header, var(--spacing-5, 16px));
|
|
346
|
+
padding: var(--spacing-7, 24px) var(--spacing-6, 20px);
|
|
393
347
|
}
|
|
394
348
|
.top-content {
|
|
395
349
|
display: flex;
|
|
@@ -535,13 +489,10 @@ import{_ as $}from"../../vendor/preload-helper.js";import{a as S,n as a,i as w,x
|
|
|
535
489
|
margin-block-start: var(--spacing-3, 8px);
|
|
536
490
|
}
|
|
537
491
|
|
|
538
|
-
.scb-card:not(.filled)
|
|
492
|
+
.scb-card:not(.filled) .content.list ::slotted(scb-list) {
|
|
539
493
|
--scb-list-bg: var(--md-sys-color-surface, #FFFFFF);
|
|
540
494
|
}
|
|
541
495
|
.scb-card.filled .content.list ::slotted(scb-list) {
|
|
542
496
|
--scb-list-bg: var(--md-sys-color-surface-dim, #F9F8EF);
|
|
543
497
|
}
|
|
544
|
-
|
|
545
|
-
--scb-list-bg: var(--md-sys-color-surface-container, #EEF3FF);
|
|
546
|
-
}
|
|
547
|
-
`;s([a({type:String,reflect:!0})],i.prototype,"type",2);s([a({type:String,reflect:!0})],i.prototype,"variant",2);s([a({type:String,reflect:!0})],i.prototype,"direction",2);s([a({type:String,attribute:"media-type"})],i.prototype,"mediaType",2);s([a({type:String,attribute:"media-href"})],i.prototype,"mediaHref",2);s([a({type:String,attribute:"media-alt"})],i.prototype,"mediaAlt",2);s([a({type:String,attribute:"media-srcset"})],i.prototype,"mediaSrcset",2);s([a({type:String,attribute:"media-sizes"})],i.prototype,"mediaSizes",2);s([a({type:String,attribute:"media-loading"})],i.prototype,"mediaLoading",2);s([a({type:String,attribute:"media-decoding"})],i.prototype,"mediaDecoding",2);s([a({type:String,attribute:"media-fetchpriority"})],i.prototype,"mediaFetchPriority",2);s([a({type:String,attribute:"media-fit"})],i.prototype,"mediaFit",2);s([a({type:String,attribute:"media-position"})],i.prototype,"mediaPosition",2);s([a({type:String,attribute:"media-width"})],i.prototype,"mediaWidth",2);s([a({type:String,attribute:"media-height"})],i.prototype,"mediaHeight",2);s([a({type:String,attribute:"media-aspect"})],i.prototype,"mediaAspect",2);s([a({type:Boolean,attribute:"media-placeholder"})],i.prototype,"mediaPlaceholder",2);s([a({type:String,attribute:"card-href",reflect:!0})],i.prototype,"cardHref",2);s([a({type:String,reflect:!0})],i.prototype,"href",2);s([a({type:String,reflect:!0})],i.prototype,"title",2);s([a({type:String,reflect:!0})],i.prototype,"subtitle",2);s([a({type:String,attribute:"supporting-text",reflect:!0})],i.prototype,"supportingText",2);s([a({type:Date,reflect:!0})],i.prototype,"date",2);s([a({type:String,attribute:"social-comments-text",reflect:!0})],i.prototype,"commentsText",2);s([a({type:Number,attribute:"social-comments",reflect:!0})],i.prototype,"comments",2);s([a({type:String,attribute:"social-comments-href",reflect:!0})],i.prototype,"commentsHref",2);s([a({type:String,attribute:"social-likes-text",reflect:!0})],i.prototype,"likesText",2);s([a({type:Number,attribute:"social-likes",reflect:!0})],i.prototype,"likes",2);s([a({type:String,attribute:"social-likes-hover-content",reflect:!0})],i.prototype,"likesHoverContent",2);s([a({type:Boolean,attribute:"social-has-liked",reflect:!0})],i.prototype,"hasLiked",2);s([a({type:Boolean,attribute:"social-likes-interactive",reflect:!0})],i.prototype,"likesInteractive",2);s([a({type:Boolean,attribute:"social-author",reflect:!0})],i.prototype,"author",2);s([a({type:String,attribute:"social-author-text",reflect:!0})],i.prototype,"authorText",2);s([a({type:String,attribute:"social-author-href",reflect:!0})],i.prototype,"authorHref",2);s([a({type:String,reflect:!0})],i.prototype,"sizing",2);s([a({type:String,reflect:!0})],i.prototype,"width",2);s([a({type:String,reflect:!0,attribute:"max-width"})],i.prototype,"maxWidth",2);s([a({type:String,reflect:!0})],i.prototype,"height",2);s([a({type:String,reflect:!0,attribute:"max-height"})],i.prototype,"maxHeight",2);s([a({type:String,reflect:!0})],i.prototype,"spacing",2);s([a({type:String,attribute:"spacing-top",reflect:!0})],i.prototype,"spacingTop",2);s([a({type:String,attribute:"spacing-bottom",reflect:!0})],i.prototype,"spacingBottom",2);s([a({type:String,attribute:"spacing-left",reflect:!0})],i.prototype,"spacingLeft",2);s([a({type:String,attribute:"spacing-right",reflect:!0})],i.prototype,"spacingRight",2);s([a({type:String,attribute:"padding",reflect:!0})],i.prototype,"innerPadding",2);s([a({type:String,attribute:"padding-top",reflect:!0})],i.prototype,"paddingTop",2);s([a({type:String,attribute:"padding-bottom",reflect:!0})],i.prototype,"paddingBottom",2);s([a({type:String,attribute:"padding-left",reflect:!0})],i.prototype,"paddingLeft",2);s([a({type:String,attribute:"padding-right",reflect:!0})],i.prototype,"paddingRight",2);i=s([T("scb-card")],i);
|
|
498
|
+
`;s([a({type:String,reflect:!0})],i.prototype,"type",2);s([a({type:String,reflect:!0})],i.prototype,"variant",2);s([a({type:String,reflect:!0})],i.prototype,"direction",2);s([a({type:String,attribute:"media-type"})],i.prototype,"mediaType",2);s([a({type:String,attribute:"media-href"})],i.prototype,"mediaHref",2);s([a({type:String,attribute:"media-alt"})],i.prototype,"mediaAlt",2);s([a({type:String,attribute:"media-srcset"})],i.prototype,"mediaSrcset",2);s([a({type:String,attribute:"media-sizes"})],i.prototype,"mediaSizes",2);s([a({type:String,attribute:"media-loading"})],i.prototype,"mediaLoading",2);s([a({type:String,attribute:"media-decoding"})],i.prototype,"mediaDecoding",2);s([a({type:String,attribute:"media-fetchpriority"})],i.prototype,"mediaFetchPriority",2);s([a({type:String,attribute:"media-fit"})],i.prototype,"mediaFit",2);s([a({type:String,attribute:"media-position"})],i.prototype,"mediaPosition",2);s([a({type:String,attribute:"media-width"})],i.prototype,"mediaWidth",2);s([a({type:String,attribute:"media-height"})],i.prototype,"mediaHeight",2);s([a({type:String,attribute:"media-aspect"})],i.prototype,"mediaAspect",2);s([a({type:Boolean,attribute:"media-placeholder"})],i.prototype,"mediaPlaceholder",2);s([a({type:String,attribute:"card-href",reflect:!0})],i.prototype,"cardHref",2);s([a({type:String,reflect:!0})],i.prototype,"href",2);s([a({type:String,reflect:!0})],i.prototype,"title",2);s([a({type:String,reflect:!0})],i.prototype,"subtitle",2);s([a({type:String,attribute:"supporting-text",reflect:!0})],i.prototype,"supportingText",2);s([a({type:Date,reflect:!0})],i.prototype,"date",2);s([a({type:String,attribute:"social-comments-text",reflect:!0})],i.prototype,"commentsText",2);s([a({type:Number,attribute:"social-comments",reflect:!0})],i.prototype,"comments",2);s([a({type:String,attribute:"social-comments-href",reflect:!0})],i.prototype,"commentsHref",2);s([a({type:String,attribute:"social-likes-text",reflect:!0})],i.prototype,"likesText",2);s([a({type:Number,attribute:"social-likes",reflect:!0})],i.prototype,"likes",2);s([a({type:String,attribute:"social-likes-hover-content",reflect:!0})],i.prototype,"likesHoverContent",2);s([a({type:Boolean,attribute:"social-has-liked",reflect:!0})],i.prototype,"hasLiked",2);s([a({type:Boolean,attribute:"social-likes-interactive",reflect:!0})],i.prototype,"likesInteractive",2);s([a({type:Boolean,attribute:"social-author",reflect:!0})],i.prototype,"author",2);s([a({type:String,attribute:"social-author-text",reflect:!0})],i.prototype,"authorText",2);s([a({type:String,attribute:"social-author-href",reflect:!0})],i.prototype,"authorHref",2);s([a({type:String,reflect:!0})],i.prototype,"sizing",2);s([a({type:String,reflect:!0})],i.prototype,"width",2);s([a({type:String,reflect:!0,attribute:"max-width"})],i.prototype,"maxWidth",2);s([a({type:String,reflect:!0})],i.prototype,"height",2);s([a({type:String,reflect:!0,attribute:"max-height"})],i.prototype,"maxHeight",2);s([a({type:String,reflect:!0})],i.prototype,"spacing",2);s([a({type:String,attribute:"spacing-top",reflect:!0})],i.prototype,"spacingTop",2);s([a({type:String,attribute:"spacing-bottom",reflect:!0})],i.prototype,"spacingBottom",2);s([a({type:String,attribute:"spacing-left",reflect:!0})],i.prototype,"spacingLeft",2);s([a({type:String,attribute:"spacing-right",reflect:!0})],i.prototype,"spacingRight",2);i=s([w("scb-card")],i);
|
|
@@ -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-checkbox/scb-checkbox.js","../scb-checkbox/scb-checkbox-group.js","../scb-switch/scb-switch.js"])))=>i.map(i=>d[i]);
|
|
2
|
-
import{_ as b}from"../../vendor/preload-helper.js";import{n as s,t as I,i as E,a as L,E as c,x as n}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(e,d,l){try{customElements.get(e)||i(e,d,l)}catch(p){var o=String(p||"");if(o.indexOf("already been used")===-1&&o.indexOf("NotSupportedError")===-1)throw p}}}}catch{}})();var T=Object.defineProperty,P=Object.getOwnPropertyDescriptor,V=t=>{throw TypeError(t)},r=(t,i,e,d)=>{for(var l=d>1?void 0:d?P(i,e):i,o=t.length-1,p;o>=0;o--)(p=t[o])&&(l=(d?p(i,e,l):p(l))||l);return d&&l&&T(i,e,l),l},
|
|
2
|
+
import{_ as b}from"../../vendor/preload-helper.js";import{n as s,t as I,i as E,a as L,E as c,x as n}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(e,d,l){try{customElements.get(e)||i(e,d,l)}catch(p){var o=String(p||"");if(o.indexOf("already been used")===-1&&o.indexOf("NotSupportedError")===-1)throw p}}}}catch{}})();var T=Object.defineProperty,P=Object.getOwnPropertyDescriptor,V=t=>{throw TypeError(t)},r=(t,i,e,d)=>{for(var l=d>1?void 0:d?P(i,e):i,o=t.length-1,p;o>=0;o--)(p=t[o])&&(l=(d?p(i,e,l):p(l))||l);return d&&l&&T(i,e,l),l},k=(t,i,e)=>i.has(t)||V("Cannot "+e),v=(t,i,e)=>(k(t,i,"read from private field"),e?e.call(t):i.get(t)),g=(t,i,e)=>i.has(t)?V("Cannot add the same private member more than once"):i instanceof WeakSet?i.add(t):i.set(t,e),_=(t,i,e,d)=>(k(t,i,"write to private field"),i.set(t,e),e),$=(t,i,e)=>(k(t,i,"access private method"),e),f,y,m,u,w,x;let a=class extends E{constructor(){super(...arguments),g(this,u),this.type="text",this.href="",this.itemHref="",this.target="",this.disabled=!1,this.label="",this.supportingText="",this.overline="",this.leading=!1,this.leadingVariant="",this.leadingIcon="",this.avatarLabel="",this.avatarAlt="",this.avatarVariant="icon",this.avatarSrc="",this.imgHrefImage="",this.trailing=!1,this.trailingVariant="",this.trailingIcon="",this.density=0,this.noDivider=!1,g(this,f,!1),g(this,y,!1),g(this,m,!1),this.onRowClick=()=>{if(this.type==="link"&&(this.href||this.itemHref))return;const t=this.shadowRoot?.querySelector("scb-checkbox"),i=this.shadowRoot?.querySelector("scb-switch");t&&(t.checked=!t.checked),i&&(i.selected=!i.selected)},g(this,x,t=>{if(!t.defaultPrevented&&(t.key==="Enter"||t.key===" ")){if(this.type==="link"){const i=this.shadowRoot?.querySelector("a[href]");if(i){t.preventDefault(),i.click();return}}t.preventDefault(),this.onRowClick()}})}static get styles(){return L`
|
|
3
3
|
:host {
|
|
4
4
|
border-bottom: var(--stroke-border, 1px) solid var(--md-sys-color-outline-variant);
|
|
5
5
|
margin-bottom: calc(var(--stroke-border, 1px) * -1);
|
|
@@ -99,8 +99,14 @@ import{_ as b}from"../../vendor/preload-helper.js";import{n as s,t as I,i as E,a
|
|
|
99
99
|
cursor: default;
|
|
100
100
|
}
|
|
101
101
|
|
|
102
|
-
.link {
|
|
103
|
-
|
|
102
|
+
.link {
|
|
103
|
+
text-decoration: none;
|
|
104
|
+
color: inherit;
|
|
105
|
+
display: flex;
|
|
106
|
+
width: 100%;
|
|
107
|
+
gap: 12px;
|
|
108
|
+
}
|
|
109
|
+
`}async firstUpdated(){await $(this,u,w).call(this),this.addEventListener("keydown",v(this,x))}updated(t){super.updated(t),(t.has("leading")||t.has("leadingVariant")||t.has("trailing")||t.has("trailingVariant")||t.has("type")||t.has("target"))&&$(this,u,w).call(this)}render(){const t=this.leading?(()=>{switch(this.leadingVariant){case"icon":return this.leadingIcon?n`<div class="leading"><md-icon>${this.leadingIcon}</md-icon></div>`:c;case"avatar":return n`
|
|
104
110
|
<div class="leading">
|
|
105
111
|
<scb-avatar
|
|
106
112
|
label=${this.avatarLabel}
|
|
@@ -138,4 +144,4 @@ import{_ as b}from"../../vendor/preload-helper.js";import{n as s,t as I,i as E,a
|
|
|
138
144
|
</div>
|
|
139
145
|
|
|
140
146
|
<md-focus-ring></md-focus-ring>
|
|
141
|
-
`}};f=new WeakMap;y=new WeakMap;m=new WeakMap;u=new WeakSet;w=async function(){const t=this.type==="link"&&(!this.trailing||this.trailingVariant==="icon");(this.leading&&this.leadingVariant==="icon"||this.trailing&&this.trailingVariant==="icon"||t)&&!v(this,f)&&(await b(()=>import("../../vendor/vendor-material.js").then(e=>e.i),__vite__mapDeps([0,1]),import.meta.url),_(this,f,!0)),this.trailing&&this.trailingVariant==="checkbox"&&!v(this,y)&&(await b(()=>import("../scb-checkbox/scb-checkbox.js"),__vite__mapDeps([2,1,0,3]),import.meta.url),_(this,y,!0)),this.trailing&&this.trailingVariant==="switch"&&!v(this,m)&&(await b(()=>import("../scb-switch/scb-switch.js"),__vite__mapDeps([4,1,0]),import.meta.url),_(this,m,!0))};
|
|
147
|
+
`}};f=new WeakMap;y=new WeakMap;m=new WeakMap;u=new WeakSet;w=async function(){const t=this.type==="link"&&(!this.trailing||this.trailingVariant==="icon");(this.leading&&this.leadingVariant==="icon"||this.trailing&&this.trailingVariant==="icon"||t)&&!v(this,f)&&(await b(()=>import("../../vendor/vendor-material.js").then(e=>e.i),__vite__mapDeps([0,1]),import.meta.url),_(this,f,!0)),this.trailing&&this.trailingVariant==="checkbox"&&!v(this,y)&&(await b(()=>import("../scb-checkbox/scb-checkbox.js"),__vite__mapDeps([2,1,0,3]),import.meta.url),_(this,y,!0)),this.trailing&&this.trailingVariant==="switch"&&!v(this,m)&&(await b(()=>import("../scb-switch/scb-switch.js"),__vite__mapDeps([4,1,0]),import.meta.url),_(this,m,!0))};x=new WeakMap;r([s({type:String,reflect:!0,attribute:"type"})],a.prototype,"type",2);r([s({type:String})],a.prototype,"href",2);r([s({type:String,attribute:"item-href"})],a.prototype,"itemHref",2);r([s({type:String,attribute:"target"})],a.prototype,"target",2);r([s({type:Boolean,attribute:"disabled"})],a.prototype,"disabled",2);r([s({type:String,reflect:!0})],a.prototype,"label",2);r([s({type:String,attribute:"supporting-text"})],a.prototype,"supportingText",2);r([s({type:String,attribute:"overline"})],a.prototype,"overline",2);r([s({type:Boolean})],a.prototype,"leading",2);r([s({type:String,attribute:"leading-variant",reflect:!0})],a.prototype,"leadingVariant",2);r([s({type:String,attribute:"leading-icon"})],a.prototype,"leadingIcon",2);r([s({type:String,attribute:"avatar-label"})],a.prototype,"avatarLabel",2);r([s({type:String,attribute:"avatar-alt"})],a.prototype,"avatarAlt",2);r([s({type:String,attribute:"avatar-variant"})],a.prototype,"avatarVariant",2);r([s({type:String,attribute:"avatar-src"})],a.prototype,"avatarSrc",2);r([s({type:String,reflect:!0,attribute:"img-href-image"})],a.prototype,"imgHrefImage",2);r([s({type:Boolean})],a.prototype,"trailing",2);r([s({type:String,attribute:"trailing-variant",reflect:!0})],a.prototype,"trailingVariant",2);r([s({type:String,attribute:"trailing-icon"})],a.prototype,"trailingIcon",2);r([s({type:Number,reflect:!0})],a.prototype,"density",2);r([s({type:Boolean,attribute:"no-divider",reflect:!0})],a.prototype,"noDivider",2);a=r([I("scb-list-item")],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.251",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "index.js",
|
|
@@ -382,5 +382,5 @@
|
|
|
382
382
|
},
|
|
383
383
|
"./mvc/*": "./mvc/*"
|
|
384
384
|
},
|
|
385
|
-
"buildHash": "
|
|
385
|
+
"buildHash": "60FCB2565A90E9D37AB3ECA3F041272FCECB22D12C127E04C05F368889EC7C01"
|
|
386
386
|
}
|
package/scb-card/scb-card.d.ts
CHANGED
|
@@ -47,11 +47,6 @@ export declare class ScbCard extends LitElement {
|
|
|
47
47
|
spacingBottom: undefined;
|
|
48
48
|
spacingLeft: undefined;
|
|
49
49
|
spacingRight: undefined;
|
|
50
|
-
innerPadding: undefined;
|
|
51
|
-
paddingTop: undefined;
|
|
52
|
-
paddingBottom: undefined;
|
|
53
|
-
paddingLeft: undefined;
|
|
54
|
-
paddingRight: undefined;
|
|
55
50
|
static styles: import('lit').CSSResult;
|
|
56
51
|
/**
|
|
57
52
|
* Returnerar like-knappen (scb-icon-button) om kortet är av typen 'social'.
|