tabulify 1.0.21 → 1.0.23

Sign up to get free protection for your applications and to get access to all the features.
package/dist/index.cjs.js CHANGED
@@ -8,7 +8,7 @@ var getUniqueId = function (prefix) {
8
8
 
9
9
  // Table Component
10
10
  var Table = function (_a) {
11
- var columns = _a.columns, dataSource = _a.dataSource, rowSelection = _a.rowSelection, pagination = _a.pagination, dataIndex = _a.dataIndex, className = _a.className, width = _a.width, onRowClick = _a.onRowClick;
11
+ var columns = _a.columns, dataSource = _a.dataSource, rowSelection = _a.rowSelection, pagination = _a.pagination, dataIndex = _a.dataIndex, className = _a.className, width = _a.width, testId = _a.testId, onRowClick = _a.onRowClick;
12
12
  var _b = React.useState((pagination === null || pagination === void 0 ? void 0 : pagination.current) || 1), currentPage = _b[0], setCurrentPage = _b[1];
13
13
  var pageSize = (pagination === null || pagination === void 0 ? void 0 : pagination.pageSize) || dataSource.length;
14
14
  // Handle pagination
@@ -21,7 +21,7 @@ var Table = function (_a) {
21
21
  var paginatedData = pagination
22
22
  ? dataSource.slice((currentPage - 1) * pageSize, currentPage * pageSize)
23
23
  : dataSource;
24
- return (React.createElement("div", { className: className },
24
+ return (React.createElement("div", { className: className, "data-testid": testId },
25
25
  React.createElement("div", { className: "tabulify-container", style: { width: width !== null && width !== void 0 ? width : '100%' } },
26
26
  React.createElement("table", { className: "tabulify-table" },
27
27
  React.createElement("thead", { className: "tabulify-head" },
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs.js","sources":["../src/utils/index.ts","../src/components/Table/index.tsx"],"sourcesContent":["export const getUniqueId = (prefix: unknown): string =>\n `${prefix ?? 'id'}-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;\n","import React, { useState } from 'react';\nimport { TableProps } from '../../types';\nimport { getUniqueId } from '../../utils';\n\n// Table Component\nconst Table = <T,>({\n columns,\n dataSource,\n rowSelection,\n pagination,\n dataIndex,\n className,\n width,\n onRowClick,\n}: TableProps<T>) => {\n const [currentPage, setCurrentPage] = useState(pagination?.current || 1);\n\n const pageSize = pagination?.pageSize || dataSource.length;\n\n // Handle pagination\n const handlePageChange = (page: number) => {\n setCurrentPage(page);\n pagination?.onChange?.(page);\n };\n\n // Paginate data\n const paginatedData = pagination\n ? dataSource.slice((currentPage - 1) * pageSize, currentPage * pageSize)\n : dataSource;\n\n return (\n <div className={className}>\n <div className=\"tabulify-container\" style={{ width: width ?? '100%' }}>\n <table className=\"tabulify-table\">\n <thead className=\"tabulify-head\">\n <tr>\n {rowSelection && <th></th>}\n {columns.map((column) => (\n <th className=\"tabulify-cell\" key={getUniqueId(column.key)}>\n {column.title}\n </th>\n ))}\n </tr>\n </thead>\n <tbody className=\"tabulify-body\">\n {paginatedData.map((record, index) => (\n <tr\n key={getUniqueId(record[dataIndex])}\n onClick={() => onRowClick?.(record[dataIndex])}\n className={Boolean(onRowClick) ? 'has-hover' : ''}\n >\n {columns.map((column) => (\n <td className=\"tabulify-cell\" key={getUniqueId(column.key)}>\n {column.render ? (\n column.render(record[column.key], record, index)\n ) : (\n <>{`${record[column.key]}`}</>\n )}\n </td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n </div>\n {pagination && (\n <div className=\"tabulify-pagination\">\n {Array.from(\n { length: Math.ceil(pagination.total / pageSize) },\n (_, i) => i + 1\n ).map((page) => (\n <button\n key={page}\n className={currentPage === page ? 'active' : ''}\n onClick={() => handlePageChange(page)}\n >\n {page}\n </button>\n ))}\n </div>\n )}\n </div>\n );\n};\n\nexport default Table;\n"],"names":["useState"],"mappings":"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"}
1
+ {"version":3,"file":"index.cjs.js","sources":["../src/utils/index.ts","../src/components/Table/index.tsx"],"sourcesContent":["export const getUniqueId = (prefix: unknown): string =>\n `${prefix ?? 'id'}-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;\n","import React, { useState } from 'react';\nimport { TableProps } from '../../types';\nimport { getUniqueId } from '../../utils';\n\n// Table Component\nconst Table = <T,>({\n columns,\n dataSource,\n rowSelection,\n pagination,\n dataIndex,\n className,\n width,\n testId,\n onRowClick,\n}: TableProps<T>) => {\n const [currentPage, setCurrentPage] = useState(pagination?.current || 1);\n\n const pageSize = pagination?.pageSize || dataSource.length;\n\n // Handle pagination\n const handlePageChange = (page: number) => {\n setCurrentPage(page);\n pagination?.onChange?.(page);\n };\n\n // Paginate data\n const paginatedData = pagination\n ? dataSource.slice((currentPage - 1) * pageSize, currentPage * pageSize)\n : dataSource;\n\n return (\n <div className={className} data-testid={testId}>\n <div className=\"tabulify-container\" style={{ width: width ?? '100%' }}>\n <table className=\"tabulify-table\">\n <thead className=\"tabulify-head\">\n <tr>\n {rowSelection && <th></th>}\n {columns.map((column) => (\n <th className=\"tabulify-cell\" key={getUniqueId(column.key)}>\n {column.title}\n </th>\n ))}\n </tr>\n </thead>\n <tbody className=\"tabulify-body\">\n {paginatedData.map((record, index) => (\n <tr\n key={getUniqueId(record[dataIndex])}\n onClick={() => onRowClick?.(record[dataIndex])}\n className={Boolean(onRowClick) ? 'has-hover' : ''}\n >\n {columns.map((column) => (\n <td className=\"tabulify-cell\" key={getUniqueId(column.key)}>\n {column.render ? (\n column.render(record[column.key], record, index)\n ) : (\n <>{`${record[column.key]}`}</>\n )}\n </td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n </div>\n {pagination && (\n <div className=\"tabulify-pagination\">\n {Array.from(\n { length: Math.ceil(pagination.total / pageSize) },\n (_, i) => i + 1\n ).map((page) => (\n <button\n key={page}\n className={currentPage === page ? 'active' : ''}\n onClick={() => handlePageChange(page)}\n >\n {page}\n </button>\n ))}\n </div>\n )}\n </div>\n );\n};\n\nexport default Table;\n"],"names":["useState"],"mappings":"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"}
package/dist/index.esm.js CHANGED
@@ -6,7 +6,7 @@ var getUniqueId = function (prefix) {
6
6
 
7
7
  // Table Component
8
8
  var Table = function (_a) {
9
- var columns = _a.columns, dataSource = _a.dataSource, rowSelection = _a.rowSelection, pagination = _a.pagination, dataIndex = _a.dataIndex, className = _a.className, width = _a.width, onRowClick = _a.onRowClick;
9
+ var columns = _a.columns, dataSource = _a.dataSource, rowSelection = _a.rowSelection, pagination = _a.pagination, dataIndex = _a.dataIndex, className = _a.className, width = _a.width, testId = _a.testId, onRowClick = _a.onRowClick;
10
10
  var _b = useState((pagination === null || pagination === void 0 ? void 0 : pagination.current) || 1), currentPage = _b[0], setCurrentPage = _b[1];
11
11
  var pageSize = (pagination === null || pagination === void 0 ? void 0 : pagination.pageSize) || dataSource.length;
12
12
  // Handle pagination
@@ -19,7 +19,7 @@ var Table = function (_a) {
19
19
  var paginatedData = pagination
20
20
  ? dataSource.slice((currentPage - 1) * pageSize, currentPage * pageSize)
21
21
  : dataSource;
22
- return (React.createElement("div", { className: className },
22
+ return (React.createElement("div", { className: className, "data-testid": testId },
23
23
  React.createElement("div", { className: "tabulify-container", style: { width: width !== null && width !== void 0 ? width : '100%' } },
24
24
  React.createElement("table", { className: "tabulify-table" },
25
25
  React.createElement("thead", { className: "tabulify-head" },
@@ -1 +1 @@
1
- {"version":3,"file":"index.esm.js","sources":["../src/utils/index.ts","../src/components/Table/index.tsx"],"sourcesContent":["export const getUniqueId = (prefix: unknown): string =>\n `${prefix ?? 'id'}-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;\n","import React, { useState } from 'react';\nimport { TableProps } from '../../types';\nimport { getUniqueId } from '../../utils';\n\n// Table Component\nconst Table = <T,>({\n columns,\n dataSource,\n rowSelection,\n pagination,\n dataIndex,\n className,\n width,\n onRowClick,\n}: TableProps<T>) => {\n const [currentPage, setCurrentPage] = useState(pagination?.current || 1);\n\n const pageSize = pagination?.pageSize || dataSource.length;\n\n // Handle pagination\n const handlePageChange = (page: number) => {\n setCurrentPage(page);\n pagination?.onChange?.(page);\n };\n\n // Paginate data\n const paginatedData = pagination\n ? dataSource.slice((currentPage - 1) * pageSize, currentPage * pageSize)\n : dataSource;\n\n return (\n <div className={className}>\n <div className=\"tabulify-container\" style={{ width: width ?? '100%' }}>\n <table className=\"tabulify-table\">\n <thead className=\"tabulify-head\">\n <tr>\n {rowSelection && <th></th>}\n {columns.map((column) => (\n <th className=\"tabulify-cell\" key={getUniqueId(column.key)}>\n {column.title}\n </th>\n ))}\n </tr>\n </thead>\n <tbody className=\"tabulify-body\">\n {paginatedData.map((record, index) => (\n <tr\n key={getUniqueId(record[dataIndex])}\n onClick={() => onRowClick?.(record[dataIndex])}\n className={Boolean(onRowClick) ? 'has-hover' : ''}\n >\n {columns.map((column) => (\n <td className=\"tabulify-cell\" key={getUniqueId(column.key)}>\n {column.render ? (\n column.render(record[column.key], record, index)\n ) : (\n <>{`${record[column.key]}`}</>\n )}\n </td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n </div>\n {pagination && (\n <div className=\"tabulify-pagination\">\n {Array.from(\n { length: Math.ceil(pagination.total / pageSize) },\n (_, i) => i + 1\n ).map((page) => (\n <button\n key={page}\n className={currentPage === page ? 'active' : ''}\n onClick={() => handlePageChange(page)}\n >\n {page}\n </button>\n ))}\n </div>\n )}\n </div>\n );\n};\n\nexport default Table;\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.esm.js","sources":["../src/utils/index.ts","../src/components/Table/index.tsx"],"sourcesContent":["export const getUniqueId = (prefix: unknown): string =>\n `${prefix ?? 'id'}-${Date.now()}-${Math.random().toString(36).substring(2, 9)}`;\n","import React, { useState } from 'react';\nimport { TableProps } from '../../types';\nimport { getUniqueId } from '../../utils';\n\n// Table Component\nconst Table = <T,>({\n columns,\n dataSource,\n rowSelection,\n pagination,\n dataIndex,\n className,\n width,\n testId,\n onRowClick,\n}: TableProps<T>) => {\n const [currentPage, setCurrentPage] = useState(pagination?.current || 1);\n\n const pageSize = pagination?.pageSize || dataSource.length;\n\n // Handle pagination\n const handlePageChange = (page: number) => {\n setCurrentPage(page);\n pagination?.onChange?.(page);\n };\n\n // Paginate data\n const paginatedData = pagination\n ? dataSource.slice((currentPage - 1) * pageSize, currentPage * pageSize)\n : dataSource;\n\n return (\n <div className={className} data-testid={testId}>\n <div className=\"tabulify-container\" style={{ width: width ?? '100%' }}>\n <table className=\"tabulify-table\">\n <thead className=\"tabulify-head\">\n <tr>\n {rowSelection && <th></th>}\n {columns.map((column) => (\n <th className=\"tabulify-cell\" key={getUniqueId(column.key)}>\n {column.title}\n </th>\n ))}\n </tr>\n </thead>\n <tbody className=\"tabulify-body\">\n {paginatedData.map((record, index) => (\n <tr\n key={getUniqueId(record[dataIndex])}\n onClick={() => onRowClick?.(record[dataIndex])}\n className={Boolean(onRowClick) ? 'has-hover' : ''}\n >\n {columns.map((column) => (\n <td className=\"tabulify-cell\" key={getUniqueId(column.key)}>\n {column.render ? (\n column.render(record[column.key], record, index)\n ) : (\n <>{`${record[column.key]}`}</>\n )}\n </td>\n ))}\n </tr>\n ))}\n </tbody>\n </table>\n </div>\n {pagination && (\n <div className=\"tabulify-pagination\">\n {Array.from(\n { length: Math.ceil(pagination.total / pageSize) },\n (_, i) => i + 1\n ).map((page) => (\n <button\n key={page}\n className={currentPage === page ? 'active' : ''}\n onClick={() => handlePageChange(page)}\n >\n {page}\n </button>\n ))}\n </div>\n )}\n </div>\n );\n};\n\nexport default Table;\n"],"names":[],"mappings":"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"}
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { TableProps } from '../../types';
3
- declare const Table: <T>({ columns, dataSource, rowSelection, pagination, dataIndex, className, width, onRowClick, }: TableProps<T>) => React.JSX.Element;
3
+ declare const Table: <T>({ columns, dataSource, rowSelection, pagination, dataIndex, className, width, testId, onRowClick, }: TableProps<T>) => React.JSX.Element;
4
4
  export default Table;
@@ -17,12 +17,13 @@ export interface Pagination {
17
17
  onChange?: (page: number) => void;
18
18
  }
19
19
  export interface TableProps<T> {
20
- className?: string;
21
- width?: string;
22
20
  columns: Column<T>[];
23
21
  dataSource: T[];
24
22
  dataIndex: keyof T;
25
23
  rowSelection?: RowSelection<T>;
26
24
  pagination?: Pagination;
25
+ className?: string;
26
+ width?: string;
27
+ testId?: string;
27
28
  onRowClick?: (id: T[keyof T]) => void;
28
29
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tabulify",
3
- "version": "1.0.21",
3
+ "version": "1.0.23",
4
4
  "type": "module",
5
5
  "description": "A lightweight and customizable React table component.",
6
6
  "scripts": {
@@ -1,9 +0,0 @@
1
- import React from "react";
2
- interface PaginationProps {
3
- pageSize: number;
4
- total: number;
5
- currentPage: number;
6
- onPageChange: (page: number) => void;
7
- }
8
- declare const Pagination: React.FC<PaginationProps>;
9
- export default Pagination;
@@ -1,5 +0,0 @@
1
- import './styles.css';
2
- import React from 'react';
3
- import { TableProps } from './Table.types';
4
- declare const Table: <T>({ columns, dataSource, rowSelection, pagination, dataIndex, className, onRowClick, }: TableProps<T>) => React.JSX.Element;
5
- export default Table;
@@ -1,27 +0,0 @@
1
- import React from 'react';
2
- export interface Column<T, K extends keyof T = keyof T> {
3
- title: string;
4
- key: K;
5
- sorter?: (a: T, b: T) => number;
6
- render?: (value: T[K], record: T, index: number) => React.ReactNode;
7
- }
8
- export interface RowSelection<T> {
9
- type: 'checkbox' | 'radio';
10
- selectedRowKeys?: (keyof T)[];
11
- onChange?: (selectedRowKeys: (keyof T)[], selectedRows: T[]) => void;
12
- }
13
- export interface Pagination {
14
- pageSize: number;
15
- total: number;
16
- current?: number;
17
- onChange?: (page: number) => void;
18
- }
19
- export interface TableProps<T> {
20
- className?: string;
21
- columns: Column<T>[];
22
- dataSource: T[];
23
- dataIndex: keyof T;
24
- rowSelection?: RowSelection<T>;
25
- pagination?: Pagination;
26
- onRowClick?: (id: T[keyof T]) => void;
27
- }
@@ -1,27 +0,0 @@
1
- import React from 'react';
2
- export interface Column<T> {
3
- title: string;
4
- dataIndex: keyof T;
5
- key: string;
6
- sorter?: (a: T, b: T) => number;
7
- render?: (value: T[keyof T], record: T, index: number) => React.ReactNode;
8
- }
9
- export interface RowSelection<T> {
10
- type: 'checkbox' | 'radio';
11
- selectedRowKeys?: (keyof T)[];
12
- onChange?: (selectedRowKeys: (keyof T)[], selectedRows: T[]) => void;
13
- }
14
- export interface Pagination {
15
- pageSize: number;
16
- total: number;
17
- current?: number;
18
- onChange?: (page: number) => void;
19
- }
20
- export interface TableProps<T extends {
21
- key: React.Key;
22
- }> {
23
- columns: Column<T>[];
24
- dataSource: T[];
25
- rowSelection?: RowSelection<T>;
26
- pagination?: Pagination;
27
- }
@@ -1 +0,0 @@
1
- export declare const getUniqueId: (prefix: unknown) => string;