@dataloop-ai/components 0.19.210 → 0.19.212

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.210",
3
+ "version": "0.19.212",
4
4
  "exports": {
5
5
  ".": "./index.ts",
6
6
  "./models": "./models.ts",
@@ -48,8 +48,8 @@
48
48
  @mouseOverLegend="darkHighlight"
49
49
  @mouseLeaveLegend="resetColors"
50
50
  >
51
- <template #default="{ item }">
52
- <slot :item="item" />
51
+ <template #default="{ item, index }">
52
+ <slot :item="item" :index="index" />
53
53
  </template>
54
54
  </dl-doughnut-chart-legend>
55
55
  </div>
@@ -27,7 +27,7 @@
27
27
  class="wrapper__legend__item__counter truncate"
28
28
  :style="{ color: getColor(index, text) }"
29
29
  >
30
- <slot :item="item">
30
+ <slot :item="item" :index="index">
31
31
  {{ item }}
32
32
  </slot>
33
33
  </div>
@@ -17,7 +17,7 @@
17
17
  ? defaultIconColor
18
18
  : statusIconColor || defaultIconColor
19
19
  "
20
- size="16px"
20
+ size="12px"
21
21
  :inline="false"
22
22
  />
23
23
  </div>
@@ -52,25 +52,24 @@
52
52
  </div>
53
53
  <dl-tooltip
54
54
  v-if="!focused"
55
- :style="`
56
- background-color: var(--dl-color-panel-background);
57
- border: 1px solid var(--dl-color-separator);
58
- color: var(--dl-color-darker);
59
- padding: 16px;
60
- `"
55
+ border="1px solid var(--dl-color-separator)"
56
+ background-color="dl-color-panel-background"
57
+ color="dl-color-darker"
61
58
  max-width="340px"
62
59
  anchor="bottom left"
63
60
  self="top left"
64
61
  >
65
- <div class="tooltip-title">
66
- <dl-icon :icon="defaultIcon" />
67
- Smart Search Query
68
- </div>
69
- <div class="tooltip-subtitle">
70
- A powerful and flexible search. Allows users to
71
- construct queries based on specific field selection
72
- following schema rules. Does not enable free text
73
- search.
62
+ <div style="padding: 10px">
63
+ <div class="tooltip-title">
64
+ <dl-icon :icon="defaultIcon" />
65
+ Smart Search Query
66
+ </div>
67
+ <div class="tooltip-subtitle">
68
+ A powerful and flexible search. Allows users to
69
+ construct queries based on specific field selection
70
+ following schema rules. Does not enable free text
71
+ search.
72
+ </div>
74
73
  </div>
75
74
  </dl-tooltip>
76
75
  </div>
@@ -1161,8 +1160,8 @@ export default defineComponent({
1161
1160
  &__status-icon-wrapper {
1162
1161
  display: flex;
1163
1162
  line-height: 15px;
1164
- margin: 6px 8px 0px 0px;
1165
- align-items: flex-start;
1163
+ margin: 3px 8px 0px 0px;
1164
+ align-items: center;
1166
1165
  div:first-child {
1167
1166
  display: flex;
1168
1167
  align-items: center;
@@ -1,12 +1,6 @@
1
1
  <template>
2
- <dl-teleport
3
- v-if="portalIsActive"
4
- :to="portalEl"
5
- >
6
- <transition
7
- name="fade"
8
- appear
9
- >
2
+ <dl-teleport v-if="portalIsActive" :to="portalEl">
3
+ <transition name="fade" appear>
10
4
  <div
11
5
  v-if="showing"
12
6
  :id="uuid"
@@ -141,6 +135,10 @@ export default defineComponent({
141
135
  triggerPercentage: {
142
136
  type: Number,
143
137
  default: 1
138
+ },
139
+ border: {
140
+ type: String,
141
+ default: null
144
142
  }
145
143
  },
146
144
  setup(props, { emit, attrs }) {
@@ -360,7 +358,7 @@ export default defineComponent({
360
358
 
361
359
  function configureScrollTarget() {
362
360
  if (anchorEl.value !== null || props.scrollTarget) {
363
- (localScrollTarget as Ref<any>).value = getScrollTarget(
361
+ ;(localScrollTarget as Ref<any>).value = getScrollTarget(
364
362
  anchorEl.value as HTMLElement,
365
363
  props.scrollTarget as Element
366
364
  )
@@ -414,7 +412,8 @@ export default defineComponent({
414
412
  '--dl-tooltip-text-align': props.textAlignment,
415
413
  '--dl-tooltip-text-transform': props.capitalized
416
414
  ? 'capitalize'
417
- : 'none'
415
+ : 'none',
416
+ '--dl-tooltip-border': props.border
418
417
  }
419
418
  ] as any
420
419
  }
@@ -435,6 +434,7 @@ export default defineComponent({
435
434
  line-height: 16px;
436
435
  color: var(--dl-tooltip-color);
437
436
  background: var(--dl-tooltip-background);
437
+ border: var(--dl-tooltip-border);
438
438
  border-radius: 2px;
439
439
  text-transform: none;
440
440
  font-family: 'Roboto', sans-serif;
@@ -6,9 +6,9 @@
6
6
  :data="doughnutLessData"
7
7
  :animation="doughnutAnimation"
8
8
  >
9
- <template #default="{ item }">
10
- <span style="color: tomato; font-size: large">
11
- {{ item }} 🍅
9
+ <template #default="{ item, index }">
10
+ <span style="color: tomato">
11
+ [{{ index }}] :{{ item }} 🍅
12
12
  </span>
13
13
  </template>
14
14
  </DlDoughnutChart>