@getflip/swirl-components 0.365.0 → 0.365.1
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/components.json +1 -1
- package/dist/cjs/swirl-avatar.cjs.entry.js +1 -1
- package/dist/collection/components/swirl-avatar/swirl-avatar.css +35 -11
- package/dist/components/assets/pdfjs/pdf.worker.min.mjs +1 -1
- package/dist/components/swirl-avatar.js +1 -1
- package/dist/esm/swirl-avatar.entry.js +1 -1
- package/dist/swirl-components/p-e7744a13.entry.js +1 -0
- package/dist/swirl-components/swirl-components.esm.js +1 -1
- package/package.json +1 -1
- package/dist/swirl-components/p-abda2e7e.entry.js +0 -1
package/components.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var index = require('./index-DM-IG6w2.js');
|
|
4
4
|
var index$1 = require('./index-DcAhLZUH.js');
|
|
5
5
|
|
|
6
|
-
const swirlAvatarCss = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direction:column}:host *{box-sizing:border-box}.avatar{position:relative;display:inline-flex;justify-content:center;align-items:center;border-radius:50%}.avatar--has-icon{color:var(--s-icon-default);background-color:var(--swirl-avatar-background-color)}.avatar--has-initials{padding-right:0;padding-left:0;color:#fff}.avatar--interactive{cursor:pointer}.avatar--interactive:focus:not(:focus-visible){outline:none}.avatar--interactive:focus-visible{outline-color:var(--s-focus-default)}.avatar--size-3xs{width:1.25rem;height:1.25rem
|
|
6
|
+
const swirlAvatarCss = ":host{display:inline-flex;flex-shrink:0;align-items:center;flex-direction:column}:host *{box-sizing:border-box}.avatar{position:relative;display:inline-flex;justify-content:center;align-items:center;border-radius:50%}.avatar--has-icon{color:var(--s-icon-default);background-color:var(--swirl-avatar-background-color)}.avatar--has-initials{padding-right:0;padding-left:0;color:#fff}.avatar--interactive{cursor:pointer}.avatar--interactive:focus:not(:focus-visible){outline:none}.avatar--interactive:focus-visible{outline-color:var(--s-focus-default)}.avatar--size-3xs{width:1.25rem;height:1.25rem}.avatar--size-3xs .avatar__initials{font-size:0.625rem}.avatar--size-3xs.avatar--has-icon{padding-right:0.125rem;padding-left:0.125rem}.avatar--size-3xs.avatar--variant-square,.avatar--size-3xs.avatar--variant-square .avatar__image,.avatar--size-3xs.avatar--variant-square .avatar__initials{border-radius:0.25rem}.avatar--size-2xs{width:1.5rem;height:1.5rem}.avatar--size-2xs .avatar__initials{font-size:0.625rem}.avatar--size-2xs.avatar--has-icon{padding-right:0.125rem;padding-left:0.125rem}.avatar--size-2xs.avatar--variant-square,.avatar--size-2xs.avatar--variant-square .avatar__image,.avatar--size-2xs.avatar--variant-square .avatar__initials{border-radius:0.25rem}.avatar--size-xs{width:1.75rem;height:1.75rem}.avatar--size-xs .avatar__initials{font-size:0.75rem}.avatar--size-xs.avatar--has-icon{padding-right:0.4375rem;padding-left:0.4375rem}.avatar--size-xs.avatar--variant-square,.avatar--size-xs.avatar--variant-square .avatar__image,.avatar--size-xs.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-s{width:2rem;height:2rem}.avatar--size-s .avatar__initials{font-size:0.75rem}.avatar--size-s.avatar--has-icon{padding-right:var(--s-space-8);padding-left:var(--s-space-8)}.avatar--size-s.avatar--variant-square,.avatar--size-s.avatar--variant-square .avatar__image,.avatar--size-s.avatar--variant-square .avatar__initials{border-radius:0.5rem}.avatar--size-m{width:2.5rem;height:2.5rem}.avatar--size-m .avatar__initials{font-size:var(--s-font-size-base)}.avatar--size-m.avatar--has-icon{padding-right:0.625rem;padding-left:0.625rem}.avatar--size-m.avatar--variant-square,.avatar--size-m.avatar--variant-square .avatar__image,.avatar--size-m.avatar--variant-square .avatar__initials{border-radius:0.625rem}.avatar--size-l{width:3rem;height:3rem}.avatar--size-l .avatar__initials{font-size:var(--s-font-size-lg)}.avatar--size-l.avatar--has-icon{padding-right:var(--s-space-12);padding-left:var(--s-space-12)}.avatar--size-l.avatar--variant-square,.avatar--size-l.avatar--variant-square .avatar__image,.avatar--size-l.avatar--variant-square .avatar__initials{border-radius:0.75rem}.avatar--size-xl{width:4rem;height:4rem}.avatar--size-xl .avatar__initials{font-size:var(--s-font-size-xl)}.avatar--size-xl.avatar--has-icon{padding-right:var(--s-space-16);padding-left:var(--s-space-16)}.avatar--size-xl.avatar--variant-square,.avatar--size-xl.avatar--variant-square .avatar__image,.avatar--size-xl.avatar--variant-square .avatar__initials{border-radius:1rem}.avatar--size-2xl{width:9rem;height:9rem}.avatar--size-2xl .avatar__initials{font-size:3.375rem}.avatar--size-2xl.avatar--has-icon{padding-right:var(--s-space-32);padding-left:var(--s-space-32)}.avatar--size-2xl.avatar--variant-square,.avatar--size-2xl.avatar--variant-square .avatar__image,.avatar--size-2xl.avatar--variant-square .avatar__initials{border-radius:1.25rem}.avatar--size-2xl .avatar__tool{transform:translate3d(-25%, -25%, 0px)}.avatar--size-2xl .avatar__tool--position-top{transform:translate3d(-25%, 25%, 0px)}.avatar--color-banana .avatar__initials{color:var(--s-decorative-banana-text);background-color:var(--s-decorative-banana-surface-subdued)}.avatar--color-blueberry .avatar__initials{color:var(--s-decorative-blueberry-text);background-color:var(--s-decorative-blueberry-surface-subdued)}.avatar--color-chilli .avatar__initials{color:var(--s-decorative-chilli-text);background-color:var(--s-decorative-chilli-surface-subdued)}.avatar--color-grape .avatar__initials{color:var(--s-decorative-grape-text);background-color:var(--s-decorative-grape-surface-subdued)}.avatar--color-kiwi .avatar__initials{color:var(--s-decorative-kiwi-text);background-color:var(--s-decorative-kiwi-surface-subdued)}.avatar--color-pumpkin .avatar__initials{color:var(--s-decorative-pumpkin-text);background-color:var(--s-decorative-pumpkin-surface-subdued)}.avatar--color-radish .avatar__initials{color:var(--s-decorative-radish-text);background-color:var(--s-decorative-radish-surface-subdued)}.avatar__image{overflow:hidden;width:100%;height:100%;border-radius:50%}.avatar__image>img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}.avatar__icon{display:inline-flex}.avatar__icon>*{width:100%;height:100%}.avatar__icon>*::part(icon){width:100%;height:100%}.avatar__initials{position:absolute;display:inline-flex;min-width:0;padding-right:0.0625rem;padding-left:0.0625rem;justify-content:center;align-items:center;border-radius:50%;font-weight:var(--s-font-weight-medium);inset:0}.avatar__initials>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.avatar__badge{position:absolute;bottom:0;left:55%;display:inline-flex;min-width:1.5rem;height:1.5rem;transform:translate3d(0, 25%, 0)}.avatar__badge--position-top{top:0;bottom:auto;transform:translate3d(0, -25%, 0)}.avatar__label{margin-top:var(--s-space-4);color:var(--s-icon-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);text-align:center}.avatar__tool{position:absolute;right:0;bottom:0;display:inline-flex;transform:translate3d(25%, 25%, 0)}.avatar__tool--position-top{top:0;bottom:auto;transform:translate3d(25%, -25%, 0)}";
|
|
7
7
|
|
|
8
8
|
const swirlAvatarSizeMappings = {
|
|
9
9
|
"3xs": 20,
|
|
@@ -43,9 +43,12 @@
|
|
|
43
43
|
.avatar--size-3xs {
|
|
44
44
|
width: 1.25rem;
|
|
45
45
|
height: 1.25rem;
|
|
46
|
-
font-size: 0.625rem;
|
|
47
46
|
}
|
|
48
47
|
|
|
48
|
+
.avatar--size-3xs .avatar__initials {
|
|
49
|
+
font-size: 0.625rem;
|
|
50
|
+
}
|
|
51
|
+
|
|
49
52
|
.avatar--size-3xs.avatar--has-icon {
|
|
50
53
|
padding-right: 0.125rem;
|
|
51
54
|
padding-left: 0.125rem;
|
|
@@ -60,9 +63,12 @@
|
|
|
60
63
|
.avatar--size-2xs {
|
|
61
64
|
width: 1.5rem;
|
|
62
65
|
height: 1.5rem;
|
|
63
|
-
font-size: 0.625rem;
|
|
64
66
|
}
|
|
65
67
|
|
|
68
|
+
.avatar--size-2xs .avatar__initials {
|
|
69
|
+
font-size: 0.625rem;
|
|
70
|
+
}
|
|
71
|
+
|
|
66
72
|
.avatar--size-2xs.avatar--has-icon {
|
|
67
73
|
padding-right: 0.125rem;
|
|
68
74
|
padding-left: 0.125rem;
|
|
@@ -77,9 +83,12 @@
|
|
|
77
83
|
.avatar--size-xs {
|
|
78
84
|
width: 1.75rem;
|
|
79
85
|
height: 1.75rem;
|
|
80
|
-
font-size: 0.75rem;
|
|
81
86
|
}
|
|
82
87
|
|
|
88
|
+
.avatar--size-xs .avatar__initials {
|
|
89
|
+
font-size: 0.75rem;
|
|
90
|
+
}
|
|
91
|
+
|
|
83
92
|
.avatar--size-xs.avatar--has-icon {
|
|
84
93
|
padding-right: 0.4375rem;
|
|
85
94
|
padding-left: 0.4375rem;
|
|
@@ -94,9 +103,12 @@
|
|
|
94
103
|
.avatar--size-s {
|
|
95
104
|
width: 2rem;
|
|
96
105
|
height: 2rem;
|
|
97
|
-
font-size: 0.75rem;
|
|
98
106
|
}
|
|
99
107
|
|
|
108
|
+
.avatar--size-s .avatar__initials {
|
|
109
|
+
font-size: 0.75rem;
|
|
110
|
+
}
|
|
111
|
+
|
|
100
112
|
.avatar--size-s.avatar--has-icon {
|
|
101
113
|
padding-right: var(--s-space-8);
|
|
102
114
|
padding-left: var(--s-space-8);
|
|
@@ -111,9 +123,12 @@
|
|
|
111
123
|
.avatar--size-m {
|
|
112
124
|
width: 2.5rem;
|
|
113
125
|
height: 2.5rem;
|
|
114
|
-
font-size: var(--s-font-size-base);
|
|
115
126
|
}
|
|
116
127
|
|
|
128
|
+
.avatar--size-m .avatar__initials {
|
|
129
|
+
font-size: var(--s-font-size-base);
|
|
130
|
+
}
|
|
131
|
+
|
|
117
132
|
.avatar--size-m.avatar--has-icon {
|
|
118
133
|
padding-right: 0.625rem;
|
|
119
134
|
padding-left: 0.625rem;
|
|
@@ -128,9 +143,12 @@
|
|
|
128
143
|
.avatar--size-l {
|
|
129
144
|
width: 3rem;
|
|
130
145
|
height: 3rem;
|
|
131
|
-
font-size: var(--s-font-size-lg);
|
|
132
146
|
}
|
|
133
147
|
|
|
148
|
+
.avatar--size-l .avatar__initials {
|
|
149
|
+
font-size: var(--s-font-size-lg);
|
|
150
|
+
}
|
|
151
|
+
|
|
134
152
|
.avatar--size-l.avatar--has-icon {
|
|
135
153
|
padding-right: var(--s-space-12);
|
|
136
154
|
padding-left: var(--s-space-12);
|
|
@@ -145,9 +163,12 @@
|
|
|
145
163
|
.avatar--size-xl {
|
|
146
164
|
width: 4rem;
|
|
147
165
|
height: 4rem;
|
|
148
|
-
font-size: var(--s-font-size-xl);
|
|
149
166
|
}
|
|
150
167
|
|
|
168
|
+
.avatar--size-xl .avatar__initials {
|
|
169
|
+
font-size: var(--s-font-size-xl);
|
|
170
|
+
}
|
|
171
|
+
|
|
151
172
|
.avatar--size-xl.avatar--has-icon {
|
|
152
173
|
padding-right: var(--s-space-16);
|
|
153
174
|
padding-left: var(--s-space-16);
|
|
@@ -162,9 +183,12 @@
|
|
|
162
183
|
.avatar--size-2xl {
|
|
163
184
|
width: 9rem;
|
|
164
185
|
height: 9rem;
|
|
165
|
-
font-size: 3.375rem;
|
|
166
186
|
}
|
|
167
187
|
|
|
188
|
+
.avatar--size-2xl .avatar__initials {
|
|
189
|
+
font-size: 3.375rem;
|
|
190
|
+
}
|
|
191
|
+
|
|
168
192
|
.avatar--size-2xl.avatar--has-icon {
|
|
169
193
|
padding-right: var(--s-space-32);
|
|
170
194
|
padding-left: var(--s-space-32);
|
|
@@ -173,15 +197,15 @@
|
|
|
173
197
|
.avatar--size-2xl.avatar--variant-square,
|
|
174
198
|
.avatar--size-2xl.avatar--variant-square .avatar__image,
|
|
175
199
|
.avatar--size-2xl.avatar--variant-square .avatar__initials {
|
|
176
|
-
border-radius:
|
|
200
|
+
border-radius: 1.25rem;
|
|
177
201
|
}
|
|
178
202
|
|
|
179
203
|
.avatar--size-2xl .avatar__tool {
|
|
180
|
-
transform:
|
|
204
|
+
transform: translate3d(-25%, -25%, 0px);
|
|
181
205
|
}
|
|
182
206
|
|
|
183
207
|
.avatar--size-2xl .avatar__tool--position-top {
|
|
184
|
-
transform:
|
|
208
|
+
transform: translate3d(-25%, 25%, 0px);
|
|
185
209
|
}
|
|
186
210
|
|
|
187
211
|
.avatar--color-banana .avatar__initials {
|