@yusufalperendumlu/component-library 0.1.3 → 0.1.5

package/dist/index.d.ts

@@ -65,13 +65,15 @@ type InputProps = React.InputHTMLAttributes<HTMLInputElement> & {
 
 declare const Input: React$1.FC<InputProps>;
 
+interface TableColumn<T> {
+    key: keyof T;
+    label: string;
+    sortable?: boolean;
+    render?: (value: any, row: T) => React.ReactNode;
+    sortFn?: (a: T, b: T) => number;
+}
 interface TableProps<T> {
-    columns: {
-        key: keyof T;
-        label: string;
-        sortable: boolean;
-        render?: (value: any, row: T) => React.ReactNode;
-    }[];
+    columns: TableColumn<T>[];
     data: T[];
     onRowClick?: (row: T) => void;
     className?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yusufalperendumlu/component-library",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/index.d.ts",

package/src/components/Table/Table.tsx

@@ -19,13 +19,21 @@ function Table<T extends Record<string, any>>({
   const sortedData = useMemo(() => {
     if (!sortKey) return data;
 
+    const column = columns.find(col => col.key === sortKey);
+
     const sorted = [...data].sort((a, b) => {
+      if (column?.sortFn) {
+        const result = column.sortFn(a, b);
+        return sortOrder === 'asc' ? result : -result;
+      }
+
       if (a[sortKey] < b[sortKey]) return sortOrder === 'asc' ? -1 : 1;
       if (a[sortKey] > b[sortKey]) return sortOrder === 'asc' ? 1 : -1;
       return 0;
     });
+
     return sorted;
-  }, [data, sortKey, sortOrder]);
+  }, [data, sortKey, sortOrder, columns]);
 
   const handleSort = (key: keyof T, sortable?: boolean) => {
     if (!sortable) return;

package/src/components/Table/Table.types.ts

@@ -3,18 +3,15 @@ export interface TableColumn<T> {
   label: string;
   sortable?: boolean;
   render?: (value: any, row: T) => React.ReactNode;
+  sortFn?: (a: T, b: T) => number;
 }
 
 export interface TableProps<T> {
-  columns: {
-    key: keyof T;
-    label: string;
-    sortable: boolean;
-    render?: (value: any, row: T) => React.ReactNode;
-  }[];
+  columns: TableColumn<T>[];
   data: T[];
   onRowClick?: (row: T) => void;
   className?: string;
   selectedRowId?: string | number | null;
-  rowIdKey?: keyof T; 
+  rowIdKey?: keyof T;
 }
+