enso/app/gui2/stories/TableVisualization.story.vue
somebody1234 f2651d58e4
[gui2] Component demos (#7945)
- Closes #7916

# Important Notes
None
2023-10-29 19:02:07 +00:00

32 lines
740 B
Vue

<script setup lang="ts">
import { ref } from 'vue'
import TableVisualization from '@/components/visualizations/TableVisualization.vue'
const data = ref<any>({
type: 'Matrix',
// eslint-disable-next-line camelcase
column_count: 5,
// eslint-disable-next-line camelcase
all_rows_count: 10,
json: Array.from({ length: 10 }, (_, i) => Array.from({ length: 5 }, (_, j) => `${i},${j}`)),
})
</script>
<template>
<Story
title="Table"
group="visualizations"
:layout="{ type: 'grid', width: 400 }"
autoPropsDisabled
>
<div style="height: 322px">
<TableVisualization :data="data" />
</div>
<template #controls>
<HstJson v-model="data" title="data" />
</template>
</Story>
</template>