1.5.12 ā€¢ Published 7 months ago

chakra-paginated-table v1.5.12

Weekly downloads
-
License
MIT*
Repository
-
Last release
7 months ago

Sure, here's a styled version of your readme.md:


šŸ“Š Chakra Paginated Table

Chakra Paginated Table is a customizable and feature-rich table component built with Chakra UI, inspired by the pagination functionality of Ant Design (antd). It allows you to easily render a paginated table by providing data and column configurations.

šŸ“¦ Installation

Can be installed using npm or yarn:

npm install chakra-paginated-table

or

yarn add chakra-paginated-table

šŸš€ Usage

To use Chakra Paginated Table in your project, follow these steps:

  1. Import the necessary components:
import { ChakraPaginatedTable } from "chakra-paginated-table";
  1. Define your columns and data source:
const columns = [
  { title: "Name", dataKey: "name", key: "name" },
  { title: "Age", dataKey: "age", key: "age" },
  { title: "Address", dataKey: "address", key: "address" },
];

const dataSource = [
  { key: "1", name: "John Doe", age: 30, address: "123 Main St" },
  { key: "2", name: "Jane Smith", age: 25, address: "456 Elm St" },
  // Add more data...
];
  1. Render the Chakra Paginated Table component:
const MyTableComponent = () => {
  return <ChakraPaginatedTable columns={columns} dataSource={dataSource} />;
};

šŸ¤ Contributing

If you want to contribute to this project, feel free to submit a pull request.

šŸ”— GitHub Repository

šŸ“œ Props

The Chakra Paginated Table component accepts the following props:

  • columns (Array): An array of column configurations. Each column object should have title, dataKey, and key properties.
  • dataSource (Array): An array of objects representing the data source for the table. Each object should have keys matching the dataKey defined in the columns.

šŸŽØ Customization

Chakra Paginated Table provides various customization options:

  • Pagination Options: You can customize the number of rows displayed per page and the positioning of the pagination controls.
  • Styling: Chakra UI offers a wide range of styling options. You can easily apply custom styles to the table, columns, and pagination controls to match your design requirements.
  • Localization: You can customize the text displayed for the pagination controls to support different languages.

šŸ–‹ About the Author

Hi, I'm Umar Bunu. I'm a software developer passionate about open-source projects.

šŸ“œ License

Chakra Paginated Table is open-source software licensed under the MIT License.

šŸ™ Acknowledgments

Chakra Paginated Table was inspired by the pagination functionality of Ant Design (antd) and aims to provide a similar experience using Chakra UI. We extend our gratitude to the Ant Design team for their great work.


1.5.12

7 months ago

1.5.11

7 months ago

1.5.10

7 months ago

1.5.8

9 months ago

1.5.7

9 months ago

1.5.6

9 months ago

1.5.5

9 months ago

1.5.4

9 months ago

1.5.3

9 months ago

1.5.2

9 months ago

1.5.1

9 months ago

1.5.0

9 months ago

1.4.0

9 months ago

1.3.0

9 months ago

1.2.0

9 months ago

1.1.0

9 months ago