@kayord/ui 0.12.21 → 0.12.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/custom/data-table/DataTable.svelte +10 -4
- package/dist/components/custom/data-table/DataTable.svelte.d.ts +2 -0
- package/dist/components/custom/data-table/DataTableHeader.svelte +3 -2
- package/dist/components/custom/data-table/DataTableHeader.svelte.d.ts +1 -0
- package/dist/components/custom/data-table/Pagination.svelte +1 -1
- package/package.json +4 -4
|
@@ -26,6 +26,8 @@
|
|
|
26
26
|
hideHeader?: boolean;
|
|
27
27
|
enableVisibility?: boolean;
|
|
28
28
|
enableFullscreen?: boolean;
|
|
29
|
+
class?: string;
|
|
30
|
+
disableUISorting?: boolean;
|
|
29
31
|
}
|
|
30
32
|
|
|
31
33
|
let {
|
|
@@ -41,6 +43,8 @@
|
|
|
41
43
|
hideHeader = false,
|
|
42
44
|
enableVisibility = false,
|
|
43
45
|
enableFullscreen = false,
|
|
46
|
+
class: className,
|
|
47
|
+
disableUISorting = false,
|
|
44
48
|
}: Props<T> = $props();
|
|
45
49
|
|
|
46
50
|
const isPaginationEnabled = table.options.getPaginationRowModel !== undefined;
|
|
@@ -72,11 +76,11 @@
|
|
|
72
76
|
tableStore.isFullscreen ? "absolute left-0 top-0 z-10 h-screen bg-background transition-all" : "w-full"
|
|
73
77
|
)}
|
|
74
78
|
>
|
|
75
|
-
<div class=
|
|
79
|
+
<div class={cn(className)}>
|
|
76
80
|
{#if header}
|
|
77
81
|
{@render header()}
|
|
78
82
|
{:else}
|
|
79
|
-
<div class="flex items-center justify-between gap-2">
|
|
83
|
+
<div class="flex items-center justify-between gap-2 pb-2">
|
|
80
84
|
<div>
|
|
81
85
|
{#if leftToolbar}
|
|
82
86
|
{@render leftToolbar()}
|
|
@@ -119,7 +123,7 @@
|
|
|
119
123
|
{#each table.getHeaderGroups() as headerGroup}
|
|
120
124
|
<Table.Row>
|
|
121
125
|
{#each headerGroup.headers as header}
|
|
122
|
-
<DataTableHeader {header} {table} />
|
|
126
|
+
<DataTableHeader {header} {table} {disableUISorting} />
|
|
123
127
|
{/each}
|
|
124
128
|
</Table.Row>
|
|
125
129
|
{/each}
|
|
@@ -148,7 +152,9 @@
|
|
|
148
152
|
{#each table.getRowModel().rows as row}
|
|
149
153
|
<Table.Row data-state={row.getIsSelected() && "selected"}>
|
|
150
154
|
{#each row.getVisibleCells() as cell}
|
|
151
|
-
<Table.Cell
|
|
155
|
+
<Table.Cell
|
|
156
|
+
style={`width: ${cell.column.getSize()}px; min-width:${cell.column.columnDef.minSize}px; max-width:${cell.column.columnDef.maxSize}px`}
|
|
157
|
+
>
|
|
152
158
|
<FlexRender content={cell.column.columnDef.cell} context={cell.getContext()} />
|
|
153
159
|
</Table.Cell>
|
|
154
160
|
{/each}
|
|
@@ -6,11 +6,12 @@
|
|
|
6
6
|
interface Props<T> {
|
|
7
7
|
header: Header<T, unknown>;
|
|
8
8
|
table: TypeType<T>;
|
|
9
|
+
disableUISorting?: boolean;
|
|
9
10
|
}
|
|
10
11
|
|
|
11
|
-
let { header, table }: Props<T> = $props();
|
|
12
|
+
let { header, table, disableUISorting = false }: Props<T> = $props();
|
|
12
13
|
|
|
13
|
-
const isSortingEnabled = $derived(table.options.getSortedRowModel !== undefined);
|
|
14
|
+
const isSortingEnabled = $derived(table.options.getSortedRowModel !== undefined && disableUISorting !== true);
|
|
14
15
|
</script>
|
|
15
16
|
|
|
16
17
|
<Table.Head
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
let value = $state(table.getState().pagination.pageSize.toString());
|
|
17
17
|
</script>
|
|
18
18
|
|
|
19
|
-
<div class="flex items-center justify-between
|
|
19
|
+
<div class="flex items-center justify-between py-2">
|
|
20
20
|
<div class="flex-1 text-sm text-muted-foreground">
|
|
21
21
|
{#if table.options.enableRowSelection}
|
|
22
22
|
{table.getFilteredSelectedRowModel().rows.length} of
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kayord/ui",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "0.12.
|
|
4
|
+
"version": "0.12.22",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
7
7
|
"types": "./dist/index.d.ts",
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
36
|
"@internationalized/date": "^3.5.6",
|
|
37
|
-
"bits-ui": "1.0.0-next.
|
|
37
|
+
"bits-ui": "1.0.0-next.52",
|
|
38
38
|
"clsx": "^2.1.1",
|
|
39
39
|
"embla-carousel-svelte": "8.3.1",
|
|
40
40
|
"formsnap": "2.0.0-next.1",
|
|
@@ -59,14 +59,14 @@
|
|
|
59
59
|
"eslint": "^9.14.0",
|
|
60
60
|
"eslint-config-prettier": "^9.1.0",
|
|
61
61
|
"eslint-plugin-svelte": "^2.46.0",
|
|
62
|
-
"happy-dom": "^15.11.
|
|
62
|
+
"happy-dom": "^15.11.4",
|
|
63
63
|
"lucide-svelte": "^0.456.0",
|
|
64
64
|
"postcss": "^8.4.49",
|
|
65
65
|
"prettier": "^3.3.3",
|
|
66
66
|
"prettier-plugin-svelte": "^3.2.8",
|
|
67
67
|
"prettier-plugin-tailwindcss": "^0.6.8",
|
|
68
68
|
"publint": "^0.2.12",
|
|
69
|
-
"svelte": "^5.1.
|
|
69
|
+
"svelte": "^5.1.16",
|
|
70
70
|
"svelte-check": "^4.0.7",
|
|
71
71
|
"tailwindcss": "^3.4.14",
|
|
72
72
|
"tailwindcss-animate": "^1.0.7",
|