@dataloop-ai/components 0.16.44 → 0.16.46

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.
Files changed (146) hide show
  1. package/.eslintrc.js +2 -2
  2. package/package.json +10 -9
  3. package/src/App.vue +116 -57
  4. package/src/assets/globals.scss +2 -0
  5. package/src/components/basic/DlAlert/DlAlert.vue +1 -1
  6. package/src/components/basic/DlButton/DlButton.vue +22 -10
  7. package/src/components/basic/DlCard/DlCard.vue +217 -0
  8. package/src/components/basic/DlCard/index.ts +3 -0
  9. package/src/components/basic/DlCard/types.ts +20 -0
  10. package/src/components/basic/DlChip/DlChip.vue +1 -0
  11. package/src/components/basic/DlEllipsis/DlEllipsis.vue +90 -0
  12. package/src/components/basic/DlEllipsis/index.ts +2 -0
  13. package/src/components/basic/DlListItem/DlListItem.vue +11 -5
  14. package/src/components/basic/index.ts +2 -0
  15. package/src/components/compound/DlCharts/charts/DlBarChart/DlBarChart.vue +8 -1
  16. package/src/components/compound/DlCharts/charts/DlColumnChart/DlColumnChart.vue +22 -6
  17. package/src/components/compound/DlCharts/charts/DlConfusionMatrix/DlConfusionMatrix.vue +526 -0
  18. package/src/components/compound/DlCharts/charts/DlConfusionMatrix/index.ts +2 -0
  19. package/src/components/compound/DlCharts/charts/DlConfusionMatrix/utils.ts +96 -0
  20. package/src/components/compound/DlCharts/charts/DlDoughnutChart/DlDoughnutChart.vue +2 -2
  21. package/src/components/compound/DlCharts/charts/DlLineChart/DlLineChart.vue +22 -6
  22. package/src/components/compound/DlCharts/charts/index.ts +1 -0
  23. package/src/components/compound/DlCharts/components/DlBrush.vue +8 -1
  24. package/src/components/compound/DlCharts/components/DlChartScrollBar.vue +34 -21
  25. package/src/components/compound/DlCharts/types/DlConfusionMatrix.types.ts +19 -0
  26. package/src/components/compound/DlCharts/types/index.ts +2 -1
  27. package/src/components/compound/DlCharts/types/props.ts +14 -0
  28. package/src/components/compound/DlDialogBox/DlDialogBox.vue +1 -1
  29. package/src/components/compound/DlDialogBox/components/DlDialogBoxFooter.vue +1 -0
  30. package/src/components/compound/DlDropdownButton/DlDropdownButton.vue +58 -12
  31. package/src/components/compound/DlInput/DlInput.vue +45 -23
  32. package/src/components/compound/DlJsonEditor/DlJsonEditor.vue +13 -29
  33. package/src/components/compound/DlPagination/DlPagination.vue +14 -4
  34. package/src/components/compound/DlPagination/components/PageNavigation.vue +24 -25
  35. package/src/components/compound/DlPagination/components/PaginationLegend.vue +2 -1
  36. package/src/components/compound/DlPagination/components/QuickNavigation.vue +1 -0
  37. package/src/components/compound/DlSearches/DlSmartSearch/DlSmartSearch.vue +86 -49
  38. package/src/components/compound/DlSearches/DlSmartSearch/components/DlSmartSearchInput.vue +20 -13
  39. package/src/components/compound/DlSearches/DlSmartSearch/components/DlSuggestionsDropdown.vue +43 -4
  40. package/src/components/compound/DlSearches/DlSmartSearch/utils/highlightSyntax.ts +1 -55
  41. package/src/components/compound/DlSearches/DlSmartSearch/utils/index.ts +42 -10
  42. package/src/components/compound/DlSearches/DlSmartSearch/utils/utils.ts +107 -0
  43. package/src/components/compound/DlSelect/DlSelect.vue +41 -8
  44. package/src/components/compound/DlTable/DlTable.vue +13 -10
  45. package/src/components/compound/DlTable/styles/dl-table-styles.scss +16 -4
  46. package/src/components/compound/DlToggleButton/DlToggleButton.vue +109 -0
  47. package/src/components/compound/DlToggleButton/config.ts +27 -0
  48. package/src/components/compound/DlToggleButton/index.ts +3 -0
  49. package/src/components/compound/DlToggleButton/types.ts +4 -0
  50. package/src/components/compound/index.ts +1 -0
  51. package/src/components/compound/types.ts +1 -0
  52. package/src/components/essential/DlColorPicker/DlColorPicker.vue +4 -1
  53. package/src/components/essential/DlColorPicker/components/DlColors.vue +2 -6
  54. package/src/components/essential/DlIcon/DlIcon.vue +5 -1
  55. package/src/components/essential/DlMenu/DlMenu.vue +30 -2
  56. package/src/components/essential/DlSeparator/DlSeparator.vue +62 -0
  57. package/src/components/essential/DlSeparator/index.ts +2 -0
  58. package/src/components/essential/DlSpinner/DlSpinner.vue +53 -217
  59. package/src/components/essential/DlSpinner/components/DlSpinnerCircle.vue +44 -0
  60. package/src/components/essential/DlSpinner/components/DlSpinnerClock.vue +79 -0
  61. package/src/components/essential/DlSpinner/components/DlSpinnerDots.vue +113 -0
  62. package/src/components/essential/DlSpinner/components/DlSpinnerGrid.vue +166 -0
  63. package/src/components/essential/DlSpinner/components/DlSpinnerLogo.vue +152 -0
  64. package/src/components/essential/DlSpinner/index.ts +14 -1
  65. package/src/components/essential/DlSpinner/styles/spinnerStyles.scss +111 -0
  66. package/src/components/essential/DlSpinner/types.ts +7 -0
  67. package/src/components/essential/index.ts +1 -0
  68. package/src/components/essential/types.ts +1 -0
  69. package/src/components/shared/DlItemSection/DlItemSection.vue +21 -15
  70. package/src/components/shared/DlVirtualScroll/DlVirtualScroll.vue +36 -21
  71. package/src/components/shared/DlVirtualScroll/useVirtualScroll.ts +8 -10
  72. package/src/{demo → demos}/DlButtonDemo.vue +36 -1
  73. package/src/demos/DlCardDemo.vue +47 -0
  74. package/src/{demo → demos}/DlColorPickerDemo.vue +16 -1
  75. package/src/demos/DlConfusionMatrixDemo.vue +53 -0
  76. package/src/{demo → demos}/DlDialogBoxDemo.vue +4 -1
  77. package/src/demos/DlDropdownButtonDemo.vue +386 -0
  78. package/src/demos/DlEllipsisDemo.vue +30 -0
  79. package/src/{demo → demos}/DlLineChartDemo.vue +8 -8
  80. package/src/{demo → demos}/DlMenuDemo.vue +61 -2
  81. package/src/{demo → demos}/DlSearchDemo.vue +3 -2
  82. package/src/demos/DlSeparatorDemo.vue +44 -0
  83. package/src/demos/DlSpinnerDemo.vue +59 -0
  84. package/src/{demo → demos}/DlTableDemo.vue +117 -29
  85. package/src/demos/DlToggleButtonDemo.vue +57 -0
  86. package/src/{demo → demos}/DlTooltipDemo.vue +43 -2
  87. package/src/{demo → demos}/DlWidgetDemo.vue +34 -19
  88. package/src/{demo → demos}/SmartSearchDemo/DlSmartSearchDemo.vue +2 -50
  89. package/src/{demo → demos}/index.ts +14 -56
  90. package/src/hooks/use-arrow-navigation.ts +58 -0
  91. package/src/hooks/use-suggestions.ts +97 -74
  92. package/src/utils/colors.ts +1 -1
  93. package/src/utils/draggable-table.ts +2 -2
  94. package/src/utils/index.ts +1 -0
  95. package/src/utils/parse-smart-query.ts +87 -0
  96. package/src/components/compound/DlCharts/types.ts +0 -1
  97. package/src/demo/DlDropdownButtonDemo.vue +0 -260
  98. package/src/demo/DlSpinnerDemo.vue +0 -20
  99. /package/src/{demo → demos}/BarChartDemo.vue +0 -0
  100. /package/src/{demo → demos}/ColumnChartDemo.vue +0 -0
  101. /package/src/{demo → demos}/DlAccordionDemo.vue +0 -0
  102. /package/src/{demo → demos}/DlAlertDemo.vue +0 -0
  103. /package/src/{demo → demos}/DlAvatarDemo.vue +0 -0
  104. /package/src/{demo → demos}/DlBadgeDemo.vue +0 -0
  105. /package/src/{demo → demos}/DlChartDoughnutDemo.vue +0 -0
  106. /package/src/{demo → demos}/DlCheckboxDemo.vue +0 -0
  107. /package/src/{demo → demos}/DlChipDemo.vue +0 -0
  108. /package/src/{demo → demos}/DlCounterDemo.vue +0 -0
  109. /package/src/{demo → demos}/DlDateTimeRangeDemo.vue +0 -0
  110. /package/src/{demo → demos}/DlIconDemo.vue +0 -0
  111. /package/src/{demo → demos}/DlInputDemo.vue +0 -0
  112. /package/src/{demo → demos}/DlKpiDemo.vue +0 -0
  113. /package/src/{demo → demos}/DlLinkDemo.vue +0 -0
  114. /package/src/{demo → demos}/DlListDemo.vue +0 -0
  115. /package/src/{demo → demos}/DlOptionGroupDemo.vue +0 -0
  116. /package/src/{demo → demos}/DlPaginationDemo.vue +0 -0
  117. /package/src/{demo → demos}/DlPanelContainerDemo.vue +0 -0
  118. /package/src/{demo → demos}/DlPopupDemo.vue +0 -0
  119. /package/src/{demo → demos}/DlProgressBarDemo.vue +0 -0
  120. /package/src/{demo → demos}/DlProgressChartDemo.vue +0 -0
  121. /package/src/{demo → demos}/DlRadioDemo.vue +0 -0
  122. /package/src/{demo → demos}/DlRangeDemo.vue +0 -0
  123. /package/src/{demo → demos}/DlSelectDemo.vue +0 -0
  124. /package/src/{demo → demos}/DlSkeletonDemo.vue +0 -0
  125. /package/src/{demo → demos}/DlSliderDemo.vue +0 -0
  126. /package/src/{demo → demos}/DlStepperDemo/CenteredStepperInDialogBox.vue +0 -0
  127. /package/src/{demo → demos}/DlStepperDemo/DlStepperDemo.vue +0 -0
  128. /package/src/{demo → demos}/DlStepperDemo/SimpleStepper.vue +0 -0
  129. /package/src/{demo → demos}/DlStepperDemo/StepperInDialogBox.vue +0 -0
  130. /package/src/{demo → demos}/DlStepperDemo/index.ts +0 -0
  131. /package/src/{demo → demos}/DlStepperDemo/steps/AssignmentsStep.vue +0 -0
  132. /package/src/{demo → demos}/DlStepperDemo/steps/DataStep.vue +0 -0
  133. /package/src/{demo → demos}/DlStepperDemo/steps/GeneralStep.vue +0 -0
  134. /package/src/{demo → demos}/DlStepperDemo/steps/InstructionStep.vue +0 -0
  135. /package/src/{demo → demos}/DlStepperDemo/steps/QualityStep.vue +0 -0
  136. /package/src/{demo → demos}/DlSwitchDemo.vue +0 -0
  137. /package/src/{demo → demos}/DlTabsDemo.vue +0 -0
  138. /package/src/{demo → demos}/DlTdDemo.vue +0 -0
  139. /package/src/{demo → demos}/DlTextAreaDemo.vue +0 -0
  140. /package/src/{demo → demos}/DlTextHolderDemo.vue +0 -0
  141. /package/src/{demo → demos}/DlThDemo.vue +0 -0
  142. /package/src/{demo → demos}/DlToastDemo.vue +0 -0
  143. /package/src/{demo → demos}/DlTrDemo.vue +0 -0
  144. /package/src/{demo → demos}/DlTrendDemo.vue +0 -0
  145. /package/src/{demo → demos}/DlTypographyDemo.vue +0 -0
  146. /package/src/{demo → demos}/SmartSearchDemo/schema.ts +0 -0
package/src/demo/DlDropdownButtonDemo.vue DELETED
@@ -1,260 +0,0 @@
1
- <template>
2
- <div>
3
- <div style="display: flex; gap: 20px; flex-direction: column">
4
- <h2>Splitted</h2>
5
- <dl-dropdown-button
6
- auto-close
7
- outlined
8
- split
9
- label="Dropdown Button Outlined"
10
- >
11
- <dl-list>
12
- <dl-list-item clickable>
13
- <dl-item-section> Photos </dl-item-section>
14
- </dl-list-item>
15
-
16
- <dl-list-item clickable>
17
- <dl-item-section> Videos </dl-item-section>
18
- </dl-list-item>
19
-
20
- <dl-list-item clickable>
21
- <dl-item-section> Articles </dl-item-section>
22
- </dl-list-item>
23
- </dl-list>
24
- </dl-dropdown-button>
25
-
26
- <dl-dropdown-button
27
- disabled
28
- auto-close
29
- outlined
30
- split
31
- label="Dropdown Button Outlined"
32
- >
33
- <dl-list>
34
- <dl-list-item clickable>
35
- <dl-item-section> Photos </dl-item-section>
36
- </dl-list-item>
37
-
38
- <dl-list-item clickable>
39
- <dl-item-section> Videos </dl-item-section>
40
- </dl-list-item>
41
-
42
- <dl-list-item clickable>
43
- <dl-item-section> Articles </dl-item-section>
44
- </dl-list-item>
45
- </dl-list>
46
- </dl-dropdown-button>
47
-
48
- <dl-dropdown-button
49
- split
50
- label="Dropdown Button Contained"
51
- >
52
- <dl-list>
53
- <dl-list-item clickable>
54
- <dl-item-section> Photos </dl-item-section>
55
- </dl-list-item>
56
-
57
- <dl-list-item clickable>
58
- <dl-item-section> Videos </dl-item-section>
59
- </dl-list-item>
60
-
61
- <dl-list-item clickable>
62
- <dl-item-section> Articles </dl-item-section>
63
- </dl-list-item>
64
- </dl-list>
65
- </dl-dropdown-button>
66
-
67
- <dl-dropdown-button
68
- v-model="showing"
69
- auto-close
70
- split
71
- :label="name"
72
- main-btn-style="width: 120px"
73
- @click="onClick"
74
- >
75
- <dl-list>
76
- <dl-list-item
77
- clickable
78
- @click="() => onClose('Photos')"
79
- >
80
- <dl-item-section> Photos </dl-item-section>
81
- </dl-list-item>
82
-
83
- <dl-list-item
84
- clickable
85
- @click="() => onClose('Videos and long text')"
86
- >
87
- <dl-item-section>
88
- Videos and long text
89
- </dl-item-section>
90
- </dl-list-item>
91
-
92
- <dl-list-item
93
- clickable
94
- @click="() => onClose('Articles')"
95
- >
96
- <dl-item-section> Articles </dl-item-section>
97
- </dl-list-item>
98
- </dl-list>
99
- </dl-dropdown-button>
100
- </div>
101
-
102
- <div style="display: flex; gap: 20px; flex-direction: column">
103
- <h2>One Button</h2>
104
- <dl-dropdown-button
105
- auto-close
106
- outlined
107
- label="Dropdown Button Outlined"
108
- >
109
- <dl-list>
110
- <dl-list-item clickable>
111
- <dl-item-section> Photos </dl-item-section>
112
- </dl-list-item>
113
-
114
- <dl-list-item clickable>
115
- <dl-item-section> Videos </dl-item-section>
116
- </dl-list-item>
117
-
118
- <dl-list-item clickable>
119
- <dl-item-section> Articles </dl-item-section>
120
- </dl-list-item>
121
- </dl-list>
122
- </dl-dropdown-button>
123
-
124
- <dl-dropdown-button
125
- disabled
126
- auto-close
127
- outlined
128
- label="Dropdown Button Outlined"
129
- >
130
- <dl-list>
131
- <dl-list-item clickable>
132
- <dl-item-section> Photos </dl-item-section>
133
- </dl-list-item>
134
-
135
- <dl-list-item clickable>
136
- <dl-item-section> Videos </dl-item-section>
137
- </dl-list-item>
138
-
139
- <dl-list-item clickable>
140
- <dl-item-section> Articles </dl-item-section>
141
- </dl-list-item>
142
- </dl-list>
143
- </dl-dropdown-button>
144
-
145
- <dl-dropdown-button
146
- auto-close
147
- label="Dropdown Button Contained"
148
- max-height="210px"
149
- >
150
- <dl-list>
151
- <dl-list-item clickable>
152
- <dl-item-section> Photos </dl-item-section>
153
- </dl-list-item>
154
-
155
- <dl-list-item clickable>
156
- <dl-item-section> Videos </dl-item-section>
157
- </dl-list-item>
158
-
159
- <dl-list-item clickable>
160
- <dl-item-section> Articles </dl-item-section>
161
- </dl-list-item>
162
- <dl-list-item clickable>
163
- <dl-item-section> Photos </dl-item-section>
164
- </dl-list-item>
165
-
166
- <dl-list-item clickable>
167
- <dl-item-section> Videos </dl-item-section>
168
- </dl-list-item>
169
-
170
- <dl-list-item clickable>
171
- <dl-item-section> Articles </dl-item-section>
172
- </dl-list-item>
173
- <dl-list-item clickable>
174
- <dl-item-section> Photos </dl-item-section>
175
- </dl-list-item>
176
-
177
- <dl-list-item clickable>
178
- <dl-item-section> Videos </dl-item-section>
179
- </dl-list-item>
180
-
181
- <dl-list-item clickable>
182
- <dl-item-section> Articles </dl-item-section>
183
- </dl-list-item>
184
- </dl-list>
185
- </dl-dropdown-button>
186
-
187
- <dl-dropdown-button
188
- auto-close
189
- :model-value="showing"
190
- :label="name"
191
- main-btn-style="width: 150px;"
192
- @show="onOpen"
193
- >
194
- <dl-list>
195
- <dl-list-item
196
- clickable
197
- @click="() => onClose('Photos')"
198
- >
199
- <dl-item-section> Photos </dl-item-section>
200
- </dl-list-item>
201
-
202
- <dl-list-item
203
- clickable
204
- @click="() => onClose('Videos and long text')"
205
- >
206
- <dl-item-section>
207
- Videos and long text Videos and long text
208
- </dl-item-section>
209
- </dl-list-item>
210
-
211
- <dl-list-item
212
- clickable
213
- @click="() => onClose('Articles')"
214
- >
215
- <dl-item-section> Articles </dl-item-section>
216
- </dl-list-item>
217
- </dl-list>
218
- </dl-dropdown-button>
219
- </div>
220
- </div>
221
- </template>
222
-
223
- <script lang="ts">
224
- import { defineComponent } from 'vue-demi'
225
- import {
226
- DlListItem,
227
- DlItemSection,
228
- DlList,
229
- DlDropdownButton
230
- } from '../components'
231
-
232
- export default defineComponent({
233
- name: 'DlDropdownButtonDemo',
234
- components: {
235
- DlListItem,
236
- DlItemSection,
237
- DlList,
238
- DlDropdownButton
239
- },
240
- data() {
241
- return {
242
- name: 'Dropdown Button Controlled',
243
- showing: false
244
- }
245
- },
246
- methods: {
247
- onClose(name: string) {
248
- this.name = name
249
- this.showing = false
250
- alert(this.name)
251
- },
252
- onOpen() {
253
- this.showing = true
254
- },
255
- onClick() {
256
- alert(this.name)
257
- }
258
- }
259
- })
260
- </script>
package/src/demo/DlSpinnerDemo.vue DELETED
@@ -1,20 +0,0 @@
1
- <template>
2
- <dl-spinner
3
- text="Loading data, please wait..."
4
- :text-styles="{
5
- marginLeft: '10px',
6
- color: 'var(--dl-color-tooltip-background)'
7
- }"
8
- />
9
- </template>
10
-
11
- <script>
12
- import { defineComponent } from 'vue-demi'
13
- import { DlSpinner } from '../components'
14
-
15
- export default defineComponent({
16
- components: {
17
- DlSpinner
18
- }
19
- })
20
- </script>
/package/src/{demo → demos}/BarChartDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/ColumnChartDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlAccordionDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlAlertDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlAvatarDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlBadgeDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlChartDoughnutDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlCheckboxDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlChipDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlCounterDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlDateTimeRangeDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlIconDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlInputDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlKpiDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlLinkDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlListDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlOptionGroupDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlPaginationDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlPanelContainerDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlPopupDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlProgressBarDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlProgressChartDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlRadioDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlRangeDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlSelectDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlSkeletonDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlSliderDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlStepperDemo/index.ts RENAMED
File without changes
/package/src/{demo → demos}/DlSwitchDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlTabsDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlTdDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlTextAreaDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlTextHolderDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlThDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlToastDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlTrDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlTrendDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/DlTypographyDemo.vue RENAMED
File without changes
/package/src/{demo → demos}/SmartSearchDemo/schema.ts RENAMED
File without changes