@dataloop-ai/components 0.19.185 → 0.19.186

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
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dataloop-ai/components",
3
- "version": "0.19.185",
3
+ "version": "0.19.186",
4
4
  "exports": {
5
5
  ".": "./index.ts",
6
6
  "./models": "./models.ts",
@@ -1,20 +1,8 @@
1
1
  <template>
2
- <div
3
- ref="dlDoughnutChartWidgetRef"
4
- class="dl_doughnut"
5
- >
6
- <dl-empty-state
7
- v-if="isEmpty"
8
- v-bind="emptyStateProps"
9
- >
10
- <template
11
- v-for="(_, slot) in $slots"
12
- #[slot]="props"
13
- >
14
- <slot
15
- :name="slot"
16
- v-bind="props"
17
- />
2
+ <div ref="dlDoughnutChartWidgetRef" class="dl_doughnut">
3
+ <dl-empty-state v-if="isEmpty" v-bind="emptyStateProps">
4
+ <template v-for="(_, slot) in $slots" #[slot]="props">
5
+ <slot :name="slot" v-bind="props" />
18
6
  </template>
19
7
  </dl-empty-state>
20
8
  <div
@@ -44,9 +32,7 @@
44
32
  ref="dlDoughnutChartSummaryRef"
45
33
  class="dl_doughnut__wrapper__container__chart__summary text-center"
46
34
  >
47
- <div :class="classSummaryLabel">
48
- Total items
49
- </div>
35
+ <div :class="classSummaryLabel">Total items</div>
50
36
  <div :class="classSummaryCount">
51
37
  {{ itemsCount }}
52
38
  </div>
@@ -61,14 +47,16 @@
61
47
  @hide="hideData"
62
48
  @mouseOverLegend="darkHighlight"
63
49
  @mouseLeaveLegend="resetColors"
64
- />
50
+ >
51
+ <template #default="{ item }">
52
+ <slot :item="item" />
53
+ </template>
54
+ </dl-doughnut-chart-legend>
65
55
  </div>
66
56
  </div>
67
57
  </div>
68
58
  </div>
69
- <div v-else-if="!itemsCount && !isEmpty">
70
- No data
71
- </div>
59
+ <div v-else-if="!itemsCount && !isEmpty">No data</div>
72
60
  </div>
73
61
  </template>
74
62
 
@@ -1,12 +1,6 @@
1
1
  <template>
2
- <div
3
- ref="dlDoughnutChartLegendMainRef"
4
- :class="legendMainClass"
5
- >
6
- <div
7
- v-if="itemsCount"
8
- class="wrapper__legend"
9
- >
2
+ <div ref="dlDoughnutChartLegendMainRef" :class="legendMainClass">
3
+ <div v-if="itemsCount" class="wrapper__legend">
10
4
  <div
11
5
  v-for="(item, index) in data.datasets[0].data"
12
6
  :key="index"
@@ -33,7 +27,9 @@
33
27
  class="wrapper__legend__item__counter truncate"
34
28
  :style="{ color: getColor(index, text) }"
35
29
  >
36
- {{ data.datasets[0].data[index] }}
30
+ <slot :item="item">
31
+ {{ item }}
32
+ </slot>
37
33
  </div>
38
34
  </div>
39
35
  </div>
@@ -5,16 +5,19 @@
5
5
  <DlDoughnutChart
6
6
  :data="doughnutLessData"
7
7
  :animation="doughnutAnimation"
8
- />
8
+ >
9
+ <template #default="{ item }">
10
+ <span style="color: tomato; font-size: large">
11
+ {{ item }} 🍅
12
+ </span>
13
+ </template>
14
+ </DlDoughnutChart>
9
15
  </div>
10
16
  <div>
11
17
  <DlDoughnutChart :data="doughnutData" />
12
18
  </div>
13
19
  <div>
14
- <DlDoughnutChart
15
- :data="doughnutData"
16
- :has-summary="true"
17
- />
20
+ <DlDoughnutChart :data="doughnutData" :has-summary="true" />
18
21
  </div>
19
22
  <div class="grid grid-cols-3">
20
23
  <div>
@@ -40,10 +43,7 @@
40
43
  </div>
41
44
  <div class="grid grid-cols-2">
42
45
  <div>
43
- <DlDoughnutChart
44
- :data="doughnutData"
45
- :is-small="true"
46
- />
46
+ <DlDoughnutChart :data="doughnutData" :is-small="true" />
47
47
  </div>
48
48
  <div>
49
49
  <DlDoughnutChart