@yusufalperendumlu/component-library 0.0.5 → 0.0.7

package/src/tests/Table.test.tsx

@@ -0,0 +1,55 @@
+import React from 'react';
+import { render, screen, fireEvent } from '@testing-library/react';
+import Table from '../components/Table/Table';
+import { TableColumn } from '../components/Table/Table.types';
+
+interface TestData {
+  id: number;
+  name: string;
+  age: number;
+}
+
+const columns: TableColumn<TestData>[] = [
+  { key: 'id', label: 'ID', sortable: true },
+  { key: 'name', label: 'Name', sortable: true },
+  { key: 'age', label: 'Age' },
+];
+
+const data: TestData[] = [
+  { id: 1, name: 'Alice', age: 28 },
+  { id: 2, name: 'Bob', age: 34 },
+  { id: 3, name: 'Charlie', age: 22 },
+];
+
+describe('Table Component', () => {
+  it('renders table headers correctly', () => {
+    render(<Table columns={columns} data={data} />);
+    columns.forEach(col => {
+      expect(screen.getByText(col.label)).toBeInTheDocument();
+    });
+  });
+
+  it('renders table rows and cells', () => {
+    render(<Table columns={columns} data={data} />);
+    data.forEach(item => {
+      expect(screen.getByText(item.name)).toBeInTheDocument();
+      expect(screen.getByText(item.age.toString())).toBeInTheDocument();
+    });
+  });
+
+  it('calls onRowClick when a row is clicked', () => {
+    const handleRowClick = jest.fn();
+    render(<Table columns={columns} data={data} onRowClick={handleRowClick} />);
+    const row = screen.getByText('Alice').closest('tr');
+    if (row) fireEvent.click(row);
+    expect(handleRowClick).toHaveBeenCalledWith(data[0]);
+  });
+
+  it('toggles sort order when header is clicked', () => {
+    render(<Table columns={columns} data={data} />);
+    const idHeader = screen.getByText('ID');
+    fireEvent.click(idHeader); // sort asc
+    fireEvent.click(idHeader); // sort desc
+    expect(screen.getByText('3')).toBeInTheDocument(); // highest id
+  });
+});

package/src/tests/styleMock.ts

@@ -1 +1 @@
-module.exports = {}
+module.exports = {};

package/tailwind.config.js

@@ -1,9 +1,10 @@
 module.exports = {
-  content: ["./src/**/*.{js,ts,jsx,tsx}"],
+  content: ['./src/**/*.{js,ts,jsx,tsx}'],
+  darkMode: 'class',
   theme: {
     extend: {
       fontFamily: {
-        inter: ["Inter", "sans-serif"],
+        inter: ['Inter', 'sans-serif'],
       },
     },
   },

package/tsconfig.json

@@ -1,30 +1,20 @@
-{
-  "compilerOptions": {
-    "target": "esnext",
-    "jsx": "react-jsx",
-    "module": "ESNext",
-    "moduleResolution": "Node",
-    "declaration": true,
-    "emitDeclarationOnly": false,
-    "sourceMap": true,
-    "outDir": "dist",
-    "allowSyntheticDefaultImports": true,
-    "esModuleInterop": true,
-    "forceConsistentCasingInFileNames": true,
-    "strict": true,
-    "skipLibCheck": true,
-    "types": ["node", "jest"]
-  },
-  "include": [
-    "src/**/*",
-    "tests",
-    "**/*.test.ts",
-    "**/*.test.tsx",
-  ],
-  "exclude": [
-    "node_modules",
-    "dist",
-    "**/*.test.*",
-    "**/*.stories.*"
-  ]
-}
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "Node",
+    "declaration": true,
+    "emitDeclarationOnly": false,
+    "sourceMap": true,
+    "outDir": "dist",
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "skipLibCheck": true,
+    "types": ["node", "jest"]
+  },
+  "include": ["src/**/*", "tests", "**/*.test.ts", "**/*.test.tsx"],
+  "exclude": ["node_modules", "dist", "**/*.test.*", "**/*.stories.*"]
+}

package/src/components/Input/index.tsx

@@ -1,3 +0,0 @@
-import Input from "./Input";
-
-export default Input;