Add a way to disable sort and filter features with properties.

demo/RemoveDemoTable.tsx

@@ -90,6 +90,6 @@ export function RemoveDemoTable()
 					)
 				},
 			},
-		}))} />
+		}))} disableFilter={true} disableSort={true} />
 	);
 }

package.json

@@ -1,5 +1,5 @@
 {
-	"version": "1.0.6",
+	"version": "1.1.0",
 	"name": "@kernelui/smartable",
 	"description": "Kernel UI Smartable.",
 	"scripts": {
@@ -17,7 +17,7 @@
 		"@kernelui:registry": "https://code.zeptotech.net/api/packages/UIKernel/npm/"
 	},
 	"devDependencies": {
-		"@kernelui/core": "^1.5.0",
+		"@kernelui/core": "^1.6.0",
 		"@phosphor-icons/react": "^2.1.7",
 		"@types/node": "^22.0.0",
 		"@types/react": "^18.3.3",

src/Smartable/Instance.tsx

@@ -5,7 +5,7 @@ import {RowInstance, RowLoader} from "./Row";
 import {useAsyncManager} from "./AsyncManager";
 import {ColumnHeading} from "./Columns/ColumnHeading";
 import {sortRows} from "./Sort";
-import {AutoPaginate} from "@kernelui/core";
+import {AutoPaginate, classes} from "@kernelui/core";
 
 /**
  * Smartable instance component properties.
@@ -85,9 +85,12 @@ export function Table<CK extends ColumnKey>({columns, children}: React.PropsWith
  */
 export function ColumnsHeadings<CK extends ColumnKey>({columns}: {columns: Columns<CK>})
 {
+	// Get feature disable options.
+	const {disableSort, disableFilter} = useTable<CK>();
+
 	return (
 		<>
-			<tr className={"headings"}>
+			<tr className={classes("headings", disableSort === true ? "disable-sort" : undefined)}>
 				{ // Showing title of each column.
 					Object.keys(columns).map((key) => (
 						<AutoColumnContextProvider key={key} columnKey={key}>
@@ -96,6 +99,8 @@ export function ColumnsHeadings<CK extends ColumnKey>({columns}: {columns: Colum
 					))
 				}
 			</tr>
+			{ // Add filters if filter feature is not disabled.
+				disableFilter !== true && (
 					<tr className={"filters"}>
 						{ // Add columns filters, if there are some.
 							(Object.entries(columns) as [CK, Column][]).map(([columnKey, column]) => (
@@ -107,6 +112,8 @@ export function ColumnsHeadings<CK extends ColumnKey>({columns}: {columns: Colum
 							))
 						}
 					</tr>
+				)
+			}
 		</>
 	);
 }

src/Smartable/Smartable.tsx

@@ -44,6 +44,16 @@ export interface SmartableProperties<CK extends ColumnKey>
 		 */
 		pageSize: number;
 	};
+
+	/**
+	 * Disable sort feature.
+	 */
+	disableSort?: boolean;
+
+	/**
+	 * Disable filter feature.
+	 */
+	disableFilter?: boolean;
 }
 
 /**

src/styles/_headings.less

@@ -1,5 +1,12 @@
 tr.headings
 {
+	&.disable-sort
+	{
+		th { pointer-events: none; }
+	}
+
+	&:not(.disable-sort)
+	{
 		th
 		{
 			position: relative;
@@ -78,4 +85,5 @@ tr.headings
 				float: right;
 			}
 		}
+	}
 }

yarn.lock

@@ -197,6 +197,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@babel/runtime@npm:^7.12.5":
+  version: 7.25.6
+  resolution: "@babel/runtime@npm:7.25.6"
+  dependencies:
+    regenerator-runtime: "npm:^0.14.0"
+  checksum: 10c0/d6143adf5aa1ce79ed374e33fdfd74fa975055a80bc6e479672ab1eadc4e4bfd7484444e17dd063a1d180e051f3ec62b357c7a2b817e7657687b47313158c3d2
+  languageName: node
+  linkType: hard
+
 "@babel/template@npm:^7.25.0":
   version: 7.25.0
   resolution: "@babel/template@npm:7.25.0"
@@ -524,14 +533,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@kernelui/core@npm:^1.5.0":
-  version: 1.5.0
-  resolution: "@kernelui/core@npm:1.5.0::__archiveUrl=https%3A%2F%2Fcode.zeptotech.net%2Fapi%2Fpackages%2FUIKernel%2Fnpm%2F%2540kernelui%252Fcore%2F-%2F1.5.0%2Fcore-1.5.0.tgz"
+"@kernelui/core@npm:^1.6.0":
+  version: 1.6.0
+  resolution: "@kernelui/core@npm:1.6.0::__archiveUrl=https%3A%2F%2Fcode.zeptotech.net%2Fapi%2Fpackages%2FUIKernel%2Fnpm%2F%2540kernelui%252Fcore%2F-%2F1.6.0%2Fcore-1.6.0.tgz"
   dependencies:
     "@floating-ui/react": "npm:^0.26.17"
     "@fontsource-variable/jetbrains-mono": "npm:^5.0.21"
     "@fontsource-variable/manrope": "npm:^5.0.20"
     "@fontsource-variable/source-serif-4": "npm:^5.0.19"
+    react-error-boundary: "npm:^4.0.13"
     react-merge-refs: "npm:^2.1.1"
     uuid: "npm:^10.0.0"
   peerDependencies:
@@ -539,7 +549,7 @@ __metadata:
     react: ^18.3.1
     react-dom: ^18.3.1
     react-router-dom: ^6.24.1
-  checksum: 10c0/ee9aa82a04ead71bb774cb971507e69c3c74f665fb3a7dd0d778ff5eb2feddf1a3d4396f8781c795e3f2554af14f09fffa11b5e44095d785c6f45c7d23034549
+  checksum: 10c0/2058d66788ade5476e0f63a15f1d4e8164a7c77e1a227d9f8ba15a4fefed13161496dbbdd02b55748b145e27bf81b21eda89e10f1f3217abb4565ecf2110fcb2
   languageName: node
   linkType: hard
 
@@ -547,7 +557,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@kernelui/smartable@workspace:."
   dependencies:
-    "@kernelui/core": "npm:^1.5.0"
+    "@kernelui/core": "npm:^1.6.0"
     "@phosphor-icons/react": "npm:^2.1.7"
     "@types/node": "npm:^22.0.0"
     "@types/react": "npm:^18.3.3"
@@ -2307,6 +2317,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-error-boundary@npm:^4.0.13":
+  version: 4.0.13
+  resolution: "react-error-boundary@npm:4.0.13"
+  dependencies:
+    "@babel/runtime": "npm:^7.12.5"
+  peerDependencies:
+    react: ">=16.13.1"
+  checksum: 10c0/6f3e0e4d7669f680ccf49c08c9571519c6e31f04dcfc30a765a7136c7e6fbbbe93423dd5a9fce12107f8166e54133e9dd5c2079a00c7a38201ac811f7a28b8e7
+  languageName: node
+  linkType: hard
+
 "react-merge-refs@npm:^2.1.1":
   version: 2.1.1
   resolution: "react-merge-refs@npm:2.1.1"
@@ -2354,6 +2375,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"regenerator-runtime@npm:^0.14.0":
+  version: 0.14.1
+  resolution: "regenerator-runtime@npm:0.14.1"
+  checksum: 10c0/1b16eb2c4bceb1665c89de70dcb64126a22bc8eb958feef3cd68fe11ac6d2a4899b5cd1b80b0774c7c03591dc57d16631a7f69d2daa2ec98100e2f29f7ec4cc4
+  languageName: node
+  linkType: hard
+
 "resolve@npm:~1.19.0":
   version: 1.19.0
   resolution: "resolve@npm:1.19.0"