[READ-ONLY] Mirror of https://github.com/graphieros/vue-data-ui. An open source user-empowering data visualization Vue 3 components library for eloquent data storytelling vue-data-ui.graphieros.com/
charts components-library dashboard data-storytelling data-visualization donut gauge heatmap quadrant radar rating-stars scatter screenshot skeleton-loader sparkline table vue-data-ui vue3 vuejs vuejs3
3

Configure Feed

Select the types of activity you want to include in your feed.

chore(VueUiOnion): add type defs for emits

graphieros (May 22, 2026, 2:53 PM +0200) e5e11e6b 61d9e207

+56 -5
+2 -2
manual-testing/backend/database.json
··· 1471 1471 "VueUiMolecule": true, 1472 1472 "VueUiMoodRadar": true, 1473 1473 "VueUiNestedDonuts": true, 1474 - "VueUiOnion": false, 1474 + "VueUiOnion": true, 1475 1475 "VueUiParallelCoordinatePlot": false, 1476 1476 "VueUiQuadrant": false, 1477 1477 "VueUiQuickChart": false, ··· 1509 1509 "customCheckList": {}, 1510 1510 "id": "4b423dba-9fc5-45b8-9dca-20e1f2678b9e", 1511 1511 "createdAt": 1779169675598, 1512 - "updatedAt": 1779453176804 1512 + "updatedAt": 1779454343320 1513 1513 } 1514 1514 ] 1515 1515 }
+16 -1
ts-playground/src/components/charts/ts-vue-ui-onion.vue
··· 7 7 VueUiOnion, 8 8 type VueUiOnionConfig, 9 9 type VueUiOnionDatasetItem, 10 + type VueUiOnionEmitCopyAlt, 11 + type VueUiOnionEmitSelectLegend, 10 12 } from 'vue-data-ui/vue-ui-onion'; 11 13 import { mergeConfigs } from 'vue-data-ui/utils'; 12 14 import 'vue-data-ui/style.css'; ··· 282 284 function log(n: unknown) { 283 285 console.log(n); 284 286 } 287 + 288 + function selectLegend(payload: VueUiOnionEmitSelectLegend) { 289 + console.log('@selectLegend', payload); 290 + } 291 + 292 + function copyAlt(payload: VueUiOnionEmitCopyAlt) { 293 + console.log('@copyAlt', payload); 294 + } 285 295 </script> 286 296 287 297 <template> 288 298 <div> 289 - <VueUiOnion :dataset :config> 299 + <VueUiOnion 300 + :dataset 301 + :config 302 + @selectLegend="selectLegend" 303 + @copyAlt="copyAlt" 304 + > 290 305 <template #annotator-action-close> 291 306 <span style="color: chocolate">X</span> 292 307 </template>
+22 -1
types/vue-data-ui.d.ts
··· 8495 8495 dataset: VueUiOnionDatasetItem[]; 8496 8496 }; 8497 8497 8498 - const VueUiOnionBase: DefineComponent<VueUiOnionProps>; 8498 + export type VueUiOnionEmitSelectLegend = VueUiOnionDatapoint[]; 8499 + 8500 + export type VueUiOnionEmitCopyAlt = { 8501 + config: VueUiOnionConfig; 8502 + dataset: VueUiOnionDatapoint[]; 8503 + }; 8504 + 8505 + export type VueUiOnionEmits = { 8506 + selectLegend: (payload: VueUiOnionEmitSelectLegend) => void; 8507 + copyAlt: (payload: VueUiOnionEmitCopyAlt) => void; 8508 + }; 8509 + 8510 + const VueUiOnionBase: DefineComponent< 8511 + VueUiOnionProps, 8512 + {}, 8513 + {}, 8514 + {}, 8515 + {}, 8516 + {}, 8517 + {}, 8518 + VueUiOnionEmits 8519 + >; 8499 8520 8500 8521 export const VueUiOnion: typeof VueUiOnionBase & { 8501 8522 new (): VueUiOnionExpose & {
+16 -1
types/vue-ui-onion.d.ts
··· 22 22 VueUiOnionLegendSlotProps, 23 23 VueUiOnionTooltipSlotProps, 24 24 CommonAnnotatorSlots, 25 + VueUiOnionEmits, 26 + VueUiOnionEmitSelectLegend, 27 + VueUiOnionEmitCopyAlt, 25 28 } from 'vue-data-ui'; 26 29 27 30 export type { ··· 46 49 VueUiOnionLegendSlotProps, 47 50 VueUiOnionTooltipSlotProps, 48 51 CommonAnnotatorSlots, 52 + VueUiOnionEmits, 53 + VueUiOnionEmitSelectLegend, 54 + VueUiOnionEmitCopyAlt, 49 55 }; 50 56 51 - declare const VueUiOnionBase: DefineComponent<VueUiOnionProps>; 57 + declare const VueUiOnionBase: DefineComponent< 58 + VueUiOnionProps, 59 + {}, 60 + {}, 61 + {}, 62 + {}, 63 + {}, 64 + {}, 65 + VueUiOnionEmits 66 + >; 52 67 53 68 export const VueUiOnion: typeof VueUiOnionBase & { 54 69 new (): VueUiOnionExpose & {