Stil Ant Design Table but more...
Antd v4
yarn add @cubetiq/enhance-antd-table@^1.0.10
Antd v5
yarn add @cubetiq/enhance-antd-table@^2.0.0
import React, { Component } from 'react'
import EnhanceAntdTable from '@cubetiq/enhance-antd-table'
const Example = () => {
return (
<EnhanceAntdTable
createButtonProps={{
onClick: () => setModal(true)
}}
printButton={true}
actionDelete={{
onClick: () => console.log('render from action delete')
}}
actionDetails={{
onClick: () => console.log('render from action details')
}}
renderOwnActionMenu={
<Menu>
<Menu.Item key={uuid()} icon={<DeleteOutlined />}>
Delete
</Menu.Item>
</Menu>
}
bordered={true}
newColumns={columns}
newSources={data}
/>
)
}
import { props } from 'antd/es/table'
import { newColumnsInterface } from '@cubetiq/enhance-antd-table'
const columns: Array<newColumnsInterface> = [
{
title: 'name',
dataIndex: 'name',
key: 'name'
}
]
const data = [
{
key: '1',
name: 'John Brown',
age: 32,
address: 'New York No. 1 Lake Park',
tags: ['nice', 'developer']
}
]
<EnhanceAntdTable
createButtonProps={{
onClick: () => setModal(true)
}}
/>
printButton={true}
searchBy={"name"}
actionDetails={{
onClick: () => console.log('render from action delete')
}}
actionDetails={{
onClick: () => console.log('render from action delete')
}}
renderOwnActionMenu: Render own action menu but will be overriden the default action menu.
Should use Menu and Menu. Item from ant-design.
renderOwnActionMenu={
<Menu>
<Menu.Item key={uuid()} icon={<DeleteOutlined/>}>
Delete
</Menu.Item>
</Menu>
}
MIT © 2023