Compare commits
No commits in common. "main" and "v1.0.6" have entirely different histories.
7 changed files with 732 additions and 867 deletions
|
@ -90,6 +90,6 @@ export function RemoveDemoTable()
|
||||||
)
|
)
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
}))} disableFilter={true} disableSort={true} />
|
}))} />
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import "@kernelui/core/lib/index.css";
|
import "@kernelui/core/lib/style.css";
|
||||||
import "../src/styles/smartable.less";
|
import "../src/styles/smartable.less";
|
||||||
|
|
||||||
import React from "react";
|
import React from "react";
|
||||||
|
|
18
package.json
18
package.json
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"version": "1.1.2",
|
"version": "1.0.6",
|
||||||
"name": "@kernelui/smartable",
|
"name": "@kernelui/smartable",
|
||||||
"description": "Kernel UI Smartable.",
|
"description": "Kernel UI Smartable.",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
@ -17,22 +17,22 @@
|
||||||
"@kernelui:registry": "https://code.zeptotech.net/api/packages/UIKernel/npm/"
|
"@kernelui:registry": "https://code.zeptotech.net/api/packages/UIKernel/npm/"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@kernelui/core": "^1.8.2",
|
"@kernelui/core": "^1.5.0",
|
||||||
"@phosphor-icons/react": "^2.1.7",
|
"@phosphor-icons/react": "^2.1.7",
|
||||||
"@types/node": "^22.0.0",
|
"@types/node": "^22.0.0",
|
||||||
"@types/react": "^18.3.12",
|
"@types/react": "^18.3.3",
|
||||||
"@types/react-dom": "^18.3.1",
|
"@types/react-dom": "^18.3.0",
|
||||||
"@vitejs/plugin-react": "^4.3.4",
|
"@vitejs/plugin-react": "^4.3.0",
|
||||||
"less": "^4.2.0",
|
"less": "^4.2.0",
|
||||||
"react": "^18.3.1",
|
"react": "^18.3.1",
|
||||||
"react-dom": "^18.3.1",
|
"react-dom": "^18.3.1",
|
||||||
"react-router-dom": "^7.0.1",
|
"react-router-dom": "^6.26.2",
|
||||||
"typescript": "^5.4.5",
|
"typescript": "^5.4.5",
|
||||||
"vite": "^6.0.1",
|
"vite": "^5.2.11",
|
||||||
"vite-plugin-dts": "^4.3.0"
|
"vite-plugin-dts": "^3.9.1"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@kernelui/core": "^1.8.2"
|
"@kernelui/core": "^1.1.2"
|
||||||
},
|
},
|
||||||
"packageManager": "yarn@4.5.0"
|
"packageManager": "yarn@4.5.0"
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,7 +5,7 @@ import {RowInstance, RowLoader} from "./Row";
|
||||||
import {useAsyncManager} from "./AsyncManager";
|
import {useAsyncManager} from "./AsyncManager";
|
||||||
import {ColumnHeading} from "./Columns/ColumnHeading";
|
import {ColumnHeading} from "./Columns/ColumnHeading";
|
||||||
import {sortRows} from "./Sort";
|
import {sortRows} from "./Sort";
|
||||||
import {AutoPaginate, classes} from "@kernelui/core";
|
import {AutoPaginate} from "@kernelui/core";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Smartable instance component properties.
|
* Smartable instance component properties.
|
||||||
|
@ -66,10 +66,10 @@ export function PaginatedInstance<CK extends ColumnKey>(props: InstancePropertie
|
||||||
/**
|
/**
|
||||||
* Base component for a Smartable table.
|
* Base component for a Smartable table.
|
||||||
*/
|
*/
|
||||||
export function Table<CK extends ColumnKey>({className, columns, children}: React.PropsWithChildren<InstanceProperties<CK>>)
|
export function Table<CK extends ColumnKey>({columns, children}: React.PropsWithChildren<InstanceProperties<CK>>)
|
||||||
{
|
{
|
||||||
return (
|
return (
|
||||||
<table className={classes("smartable", className)}>
|
<table className={"smartable"}>
|
||||||
<thead>
|
<thead>
|
||||||
<ColumnsHeadings columns={columns} />
|
<ColumnsHeadings columns={columns} />
|
||||||
</thead>
|
</thead>
|
||||||
|
@ -85,12 +85,9 @@ export function Table<CK extends ColumnKey>({className, columns, children}: Reac
|
||||||
*/
|
*/
|
||||||
export function ColumnsHeadings<CK extends ColumnKey>({columns}: {columns: Columns<CK>})
|
export function ColumnsHeadings<CK extends ColumnKey>({columns}: {columns: Columns<CK>})
|
||||||
{
|
{
|
||||||
// Get feature disable options.
|
|
||||||
const {disableSort, disableFilter} = useTable<CK>();
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<tr className={classes("headings", disableSort === true ? "disable-sort" : undefined)}>
|
<tr className={"headings"}>
|
||||||
{ // Showing title of each column.
|
{ // Showing title of each column.
|
||||||
Object.keys(columns).map((key) => (
|
Object.keys(columns).map((key) => (
|
||||||
<AutoColumnContextProvider key={key} columnKey={key}>
|
<AutoColumnContextProvider key={key} columnKey={key}>
|
||||||
|
@ -99,8 +96,6 @@ export function ColumnsHeadings<CK extends ColumnKey>({columns}: {columns: Colum
|
||||||
))
|
))
|
||||||
}
|
}
|
||||||
</tr>
|
</tr>
|
||||||
{ // Add filters if filter feature is not disabled.
|
|
||||||
disableFilter !== true && (
|
|
||||||
<tr className={"filters"}>
|
<tr className={"filters"}>
|
||||||
{ // Add columns filters, if there are some.
|
{ // Add columns filters, if there are some.
|
||||||
(Object.entries(columns) as [CK, Column][]).map(([columnKey, column]) => (
|
(Object.entries(columns) as [CK, Column][]).map(([columnKey, column]) => (
|
||||||
|
@ -112,8 +107,6 @@ export function ColumnsHeadings<CK extends ColumnKey>({columns}: {columns: Colum
|
||||||
))
|
))
|
||||||
}
|
}
|
||||||
</tr>
|
</tr>
|
||||||
)
|
|
||||||
}
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -15,11 +15,6 @@ export type SmartableData<CK extends ColumnKey> = Promisable<(Promisable<RowDefi
|
||||||
*/
|
*/
|
||||||
export interface SmartableProperties<CK extends ColumnKey>
|
export interface SmartableProperties<CK extends ColumnKey>
|
||||||
{
|
{
|
||||||
/**
|
|
||||||
* Table custom class name.
|
|
||||||
*/
|
|
||||||
className?: string;
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Table data.
|
* Table data.
|
||||||
*/
|
*/
|
||||||
|
@ -49,16 +44,6 @@ export interface SmartableProperties<CK extends ColumnKey>
|
||||||
*/
|
*/
|
||||||
pageSize: number;
|
pageSize: number;
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
|
||||||
* Disable sort feature.
|
|
||||||
*/
|
|
||||||
disableSort?: boolean;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Disable filter feature.
|
|
||||||
*/
|
|
||||||
disableFilter?: boolean;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
@ -1,11 +1,4 @@
|
||||||
tr.headings
|
tr.headings
|
||||||
{
|
|
||||||
&.disable-sort
|
|
||||||
{
|
|
||||||
th { pointer-events: none; }
|
|
||||||
}
|
|
||||||
|
|
||||||
&:not(.disable-sort)
|
|
||||||
{
|
{
|
||||||
th
|
th
|
||||||
{
|
{
|
||||||
|
@ -86,4 +79,3 @@ tr.headings
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
Loading…
Add table
Reference in a new issue