@dataloop-ai/components 0.20.65 → 0.20.67
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/package.json
CHANGED
|
@@ -6,10 +6,7 @@
|
|
|
6
6
|
@mouseleave="onCardMouseleave"
|
|
7
7
|
@click="onCardClick"
|
|
8
8
|
>
|
|
9
|
-
<div
|
|
10
|
-
v-if="icon && !isEmpty"
|
|
11
|
-
class="card--icon"
|
|
12
|
-
>
|
|
9
|
+
<div v-if="icon && !isEmpty" class="card--icon">
|
|
13
10
|
<dl-icon
|
|
14
11
|
:icon="icon.icon"
|
|
15
12
|
:styles="iconStyles"
|
|
@@ -17,20 +14,13 @@
|
|
|
17
14
|
:color="iconColor"
|
|
18
15
|
/>
|
|
19
16
|
</div>
|
|
20
|
-
<div
|
|
21
|
-
v-else-if="image && !isEmpty"
|
|
22
|
-
class="card--image"
|
|
23
|
-
>
|
|
17
|
+
<div v-else-if="image && !isEmpty" class="card--image">
|
|
24
18
|
<div
|
|
25
19
|
v-if="interactive && hasImageLink"
|
|
26
20
|
class="card--image__link-icon"
|
|
27
21
|
@click="stopPropagationEvent"
|
|
28
22
|
>
|
|
29
|
-
<DlLink
|
|
30
|
-
newtab
|
|
31
|
-
external
|
|
32
|
-
:href="imageLink"
|
|
33
|
-
>
|
|
23
|
+
<DlLink newtab external :href="imageLink">
|
|
34
24
|
<dl-icon
|
|
35
25
|
:icon="image.link.icon"
|
|
36
26
|
:size="image.link.size"
|
|
@@ -51,9 +41,9 @@
|
|
|
51
41
|
:style="imageStyles"
|
|
52
42
|
:alt="imageAlt"
|
|
53
43
|
class="card--image__image-holder__image"
|
|
54
|
-
|
|
44
|
+
@onload="onImageLoad"
|
|
55
45
|
@mousemove="movePreview"
|
|
56
|
-
|
|
46
|
+
/>
|
|
57
47
|
<div
|
|
58
48
|
v-if="hasMagnifyingGlass"
|
|
59
49
|
ref="magnifyingGlass"
|
|
@@ -77,14 +67,11 @@
|
|
|
77
67
|
:src="image.src"
|
|
78
68
|
:alt="imageAlt"
|
|
79
69
|
class="card--image__image-preview__image"
|
|
80
|
-
|
|
70
|
+
/>
|
|
81
71
|
</figure>
|
|
82
72
|
</dl-tooltip>
|
|
83
73
|
</div>
|
|
84
|
-
<div
|
|
85
|
-
v-if="!isEmpty"
|
|
86
|
-
class="card--content"
|
|
87
|
-
>
|
|
74
|
+
<div v-if="!isEmpty" class="card--content">
|
|
88
75
|
<div>
|
|
89
76
|
<slot name="header">
|
|
90
77
|
<div v-if="interactive">
|
|
@@ -117,10 +104,7 @@
|
|
|
117
104
|
</div>
|
|
118
105
|
</div>
|
|
119
106
|
</div>
|
|
120
|
-
<div
|
|
121
|
-
v-else
|
|
122
|
-
class="card--header"
|
|
123
|
-
>
|
|
107
|
+
<div v-else class="card--header">
|
|
124
108
|
<span class="card--header_title">{{ title }}</span>
|
|
125
109
|
</div>
|
|
126
110
|
</slot>
|
|
@@ -168,20 +152,14 @@
|
|
|
168
152
|
</dl-ellipsis>
|
|
169
153
|
</div>
|
|
170
154
|
</div>
|
|
171
|
-
<span
|
|
172
|
-
v-else
|
|
173
|
-
class="card--content_text"
|
|
174
|
-
>{{ text }}</span>
|
|
155
|
+
<span v-else class="card--content_text">{{ text }}</span>
|
|
175
156
|
</slot>
|
|
176
157
|
</div>
|
|
177
158
|
<slot name="footer">
|
|
178
159
|
<div v-if="interactive">
|
|
179
160
|
<div class="card__interactive-description">
|
|
180
161
|
<div class="flex full-width items-center">
|
|
181
|
-
<dl-typography
|
|
182
|
-
size="10px"
|
|
183
|
-
color="dl-color-medium"
|
|
184
|
-
>
|
|
162
|
+
<dl-typography size="10px" color="dl-color-medium">
|
|
185
163
|
Description
|
|
186
164
|
</dl-typography>
|
|
187
165
|
</div>
|
|
@@ -193,10 +171,7 @@
|
|
|
193
171
|
</div>
|
|
194
172
|
</div>
|
|
195
173
|
<div class="card__interactive-description__text">
|
|
196
|
-
<dl-ellipsis
|
|
197
|
-
v-if="description"
|
|
198
|
-
:text="description"
|
|
199
|
-
/>
|
|
174
|
+
<dl-ellipsis v-if="description" :text="description" />
|
|
200
175
|
<dl-typography
|
|
201
176
|
v-else
|
|
202
177
|
size="12px"
|
|
@@ -206,10 +181,7 @@
|
|
|
206
181
|
</dl-typography>
|
|
207
182
|
</div>
|
|
208
183
|
</div>
|
|
209
|
-
<div
|
|
210
|
-
v-else
|
|
211
|
-
class="card--links"
|
|
212
|
-
>
|
|
184
|
+
<div v-else class="card--links">
|
|
213
185
|
<div
|
|
214
186
|
v-for="(link, idx) in links"
|
|
215
187
|
:key="idx"
|
|
@@ -239,14 +211,8 @@
|
|
|
239
211
|
v-if="isEmpty && emptyStateProps"
|
|
240
212
|
v-bind="emptyStateProps"
|
|
241
213
|
>
|
|
242
|
-
<template
|
|
243
|
-
v-
|
|
244
|
-
#[slot]="props"
|
|
245
|
-
>
|
|
246
|
-
<slot
|
|
247
|
-
:name="slot"
|
|
248
|
-
v-bind="props"
|
|
249
|
-
/>
|
|
214
|
+
<template v-for="(_, slot) in $slots" #[slot]="props">
|
|
215
|
+
<slot :name="slot" v-bind="props" />
|
|
250
216
|
</template>
|
|
251
217
|
</dl-empty-state>
|
|
252
218
|
</div>
|
|
@@ -1,15 +1,12 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div
|
|
3
|
-
:style="legendStyles"
|
|
4
|
-
class="dl-chart-legend"
|
|
5
|
-
>
|
|
2
|
+
<div :style="legendStyles" class="dl-chart-legend">
|
|
6
3
|
<div
|
|
7
4
|
v-for="(item, index) in datasets"
|
|
8
5
|
:key="index"
|
|
9
6
|
class="dl-chart-legend--item"
|
|
10
7
|
:style="{
|
|
11
8
|
'--dl-chart-badge-color': getColor(
|
|
12
|
-
item.backgroundColor.replace('--', '')
|
|
9
|
+
(item.backgroundColor || '').replace('--', '')
|
|
13
10
|
)
|
|
14
11
|
}"
|
|
15
12
|
@click="hideData($event, item, index)"
|
|
@@ -20,7 +17,9 @@
|
|
|
20
17
|
:color="
|
|
21
18
|
item.hidden
|
|
22
19
|
? 'var(--dl-color-disabled)'
|
|
23
|
-
: getColor(
|
|
20
|
+
: getColor(
|
|
21
|
+
(item.backgroundColor || '').replace('--', '')
|
|
22
|
+
)
|
|
24
23
|
"
|
|
25
24
|
/>
|
|
26
25
|
<dl-typography
|