npm install @juanddd/motion-canvas-tableimport {Table, TableData, TableStyle} from '@cromasome/motion-canvas-table';const table = createRef<Table>();
const data: TableData = {
headers: [
{ id:'name', label: 'Name'},
{ id:'color', label: 'Color'},
{ id:'age', label: 'Age'}],
rows: [
[
{group: 'name', label: 'Milo'},
{group: 'color', label: <Circle width={100} height={100} fill="#2D8597"/>},
{group: 'age', label: 3}
],
[
{group: 'name', label: 'Spot'},
{group: 'color', label: <Circle width={100} height={100} fill="#ECA0E6"/>},
{group: 'age', label: 2}
],
[
{group: 'name', label: 'Rover'},
{group: 'color', label:<Circle width={100} height={100} fill="#CBB95B"/> },
{group: 'age', label: <Latex tex="{\Huge\color{white} {y^2} = {x^3} + 7}"></Latex>}
],
]
};const style: TableStyle = {
background: '#555',
gap: 5,
headerStyle: {
fill: '#111',
},
rowStyle: {
fill: '#1a1a12',
padding: 15,
},
};view.add(
<Table
ref={table}
data={data}
style={style}
/>
);yield* table().addRow(
[
{ group: 'name', label: 'Aldi'},
{group: 'color', label: <Circle width={100} height={100} fill="#E16616"/>},
{group: 'age', label: 10 }
], 0.5
)// TODO:
// TODO:
// TODO:
// TODO:
// TODO:
// TODO: