@ims360/svelte-ivory 0.0.45 → 0.0.46
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/table/ColumnHead.svelte +2 -2
- package/dist/components/table/ColumnHead.svelte.d.ts +1 -1
- package/dist/components/table/ColumnHead.svelte.d.ts.map +1 -1
- package/dist/components/table/Table.svelte +12 -3
- package/dist/components/table/Table.svelte.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/lib/components/table/ColumnHead.svelte +2 -2
- package/src/lib/components/table/Table.svelte +12 -3
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
<script lang="ts">
|
|
17
17
|
type Props = {
|
|
18
18
|
column: ColumnController;
|
|
19
|
-
children
|
|
19
|
+
children?: Snippet;
|
|
20
20
|
};
|
|
21
21
|
|
|
22
22
|
let { column, children }: Props = $props();
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
bind:this={target}
|
|
51
51
|
style="width: {column.width}px;"
|
|
52
52
|
>
|
|
53
|
-
{@render children()}
|
|
53
|
+
{@render children?.()}
|
|
54
54
|
{#if column.resizable}
|
|
55
55
|
<button
|
|
56
56
|
type="button"
|
|
@@ -3,7 +3,7 @@ import type { ColumnController } from './columnController.svelte';
|
|
|
3
3
|
export declare function getColumnHeadContext(): ColumnController;
|
|
4
4
|
type Props = {
|
|
5
5
|
column: ColumnController;
|
|
6
|
-
children
|
|
6
|
+
children?: Snippet;
|
|
7
7
|
};
|
|
8
8
|
declare const ColumnHead: import("svelte").Component<Props, {}, "">;
|
|
9
9
|
type ColumnHead = ReturnType<typeof ColumnHead>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColumnHead.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/table/ColumnHead.svelte.ts"],"names":[],"mappings":"AAGI,OAAO,EAA0B,KAAK,OAAO,EAAE,MAAM,QAAQ,CAAC;AAE9D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAOlE,wBAAgB,oBAAoB,IAAI,gBAAgB,CAEvD;AAED,KAAK,KAAK,GAAG;IACT,MAAM,EAAE,gBAAgB,CAAC;IACzB,QAAQ,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ColumnHead.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/table/ColumnHead.svelte.ts"],"names":[],"mappings":"AAGI,OAAO,EAA0B,KAAK,OAAO,EAAE,MAAM,QAAQ,CAAC;AAE9D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAOlE,wBAAgB,oBAAoB,IAAI,gBAAgB,CAEvD;AAED,KAAK,KAAK,GAAG;IACT,MAAM,EAAE,gBAAgB,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AA+CN,QAAA,MAAM,UAAU,2CAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
<script lang="ts" module>
|
|
2
|
-
import { pseudoRandomId } from '../../utils/functions';
|
|
3
2
|
import { ChevronRight } from '@lucide/svelte';
|
|
4
3
|
import clsx from 'clsx';
|
|
5
4
|
import { getContext, setContext, type Snippet } from 'svelte';
|
|
@@ -53,6 +52,8 @@
|
|
|
53
52
|
export function getTableContext<T extends TableRow<T>>(): TableContext<T> {
|
|
54
53
|
return getContext<TableContext<T>>(TABLE_CONTEXT);
|
|
55
54
|
}
|
|
55
|
+
|
|
56
|
+
const treeIndicatorId = 'tree-chevron';
|
|
56
57
|
</script>
|
|
57
58
|
|
|
58
59
|
<script lang="ts" generics="T extends TableRow<T>">
|
|
@@ -75,6 +76,7 @@
|
|
|
75
76
|
|
|
76
77
|
let columns = $state<ColumnController[]>(externalColumns ?? []);
|
|
77
78
|
const results = $derived(computeResults(data, expanded, plugins));
|
|
79
|
+
let treeIndicatorColumn = $state<ColumnController>();
|
|
78
80
|
|
|
79
81
|
function toggleExpansion(id: string) {
|
|
80
82
|
if (expanded.has(id)) expanded.delete(id);
|
|
@@ -85,6 +87,12 @@
|
|
|
85
87
|
toggleExpansion,
|
|
86
88
|
registerColumn(config: ColumnConfig) {
|
|
87
89
|
let existingColumn: ColumnController | undefined = undefined;
|
|
90
|
+
|
|
91
|
+
if (config.id === treeIndicatorId) {
|
|
92
|
+
if (!treeIndicatorColumn) treeIndicatorColumn = new ColumnController(config);
|
|
93
|
+
return treeIndicatorColumn;
|
|
94
|
+
}
|
|
95
|
+
|
|
88
96
|
for (const column of existingColumn || columns) {
|
|
89
97
|
if (column.id !== config.id) continue;
|
|
90
98
|
existingColumn = column;
|
|
@@ -110,8 +118,6 @@
|
|
|
110
118
|
}
|
|
111
119
|
return treeWalker(state);
|
|
112
120
|
}
|
|
113
|
-
|
|
114
|
-
const treeIndicatorId = pseudoRandomId('tree-indicator-');
|
|
115
121
|
</script>
|
|
116
122
|
|
|
117
123
|
<VirtualList
|
|
@@ -129,6 +135,9 @@
|
|
|
129
135
|
)
|
|
130
136
|
)}
|
|
131
137
|
>
|
|
138
|
+
{#if treeIndicatorColumn}
|
|
139
|
+
<ColumnHead column={treeIndicatorColumn}></ColumnHead>
|
|
140
|
+
{/if}
|
|
132
141
|
{#each externalColumns || columns as column (column.id)}
|
|
133
142
|
<ColumnHead {column}>
|
|
134
143
|
{#if typeof column.header === 'function'}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/table/Table.svelte.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Table.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/components/table/Table.svelte.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
<script lang="ts">
|
|
17
17
|
type Props = {
|
|
18
18
|
column: ColumnController;
|
|
19
|
-
children
|
|
19
|
+
children?: Snippet;
|
|
20
20
|
};
|
|
21
21
|
|
|
22
22
|
let { column, children }: Props = $props();
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
bind:this={target}
|
|
51
51
|
style="width: {column.width}px;"
|
|
52
52
|
>
|
|
53
|
-
{@render children()}
|
|
53
|
+
{@render children?.()}
|
|
54
54
|
{#if column.resizable}
|
|
55
55
|
<button
|
|
56
56
|
type="button"
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
<script lang="ts" module>
|
|
2
|
-
import { pseudoRandomId } from '$lib/utils/functions';
|
|
3
2
|
import { ChevronRight } from '@lucide/svelte';
|
|
4
3
|
import clsx from 'clsx';
|
|
5
4
|
import { getContext, setContext, type Snippet } from 'svelte';
|
|
@@ -53,6 +52,8 @@
|
|
|
53
52
|
export function getTableContext<T extends TableRow<T>>(): TableContext<T> {
|
|
54
53
|
return getContext<TableContext<T>>(TABLE_CONTEXT);
|
|
55
54
|
}
|
|
55
|
+
|
|
56
|
+
const treeIndicatorId = 'tree-chevron';
|
|
56
57
|
</script>
|
|
57
58
|
|
|
58
59
|
<script lang="ts" generics="T extends TableRow<T>">
|
|
@@ -75,6 +76,7 @@
|
|
|
75
76
|
|
|
76
77
|
let columns = $state<ColumnController[]>(externalColumns ?? []);
|
|
77
78
|
const results = $derived(computeResults(data, expanded, plugins));
|
|
79
|
+
let treeIndicatorColumn = $state<ColumnController>();
|
|
78
80
|
|
|
79
81
|
function toggleExpansion(id: string) {
|
|
80
82
|
if (expanded.has(id)) expanded.delete(id);
|
|
@@ -85,6 +87,12 @@
|
|
|
85
87
|
toggleExpansion,
|
|
86
88
|
registerColumn(config: ColumnConfig) {
|
|
87
89
|
let existingColumn: ColumnController | undefined = undefined;
|
|
90
|
+
|
|
91
|
+
if (config.id === treeIndicatorId) {
|
|
92
|
+
if (!treeIndicatorColumn) treeIndicatorColumn = new ColumnController(config);
|
|
93
|
+
return treeIndicatorColumn;
|
|
94
|
+
}
|
|
95
|
+
|
|
88
96
|
for (const column of existingColumn || columns) {
|
|
89
97
|
if (column.id !== config.id) continue;
|
|
90
98
|
existingColumn = column;
|
|
@@ -110,8 +118,6 @@
|
|
|
110
118
|
}
|
|
111
119
|
return treeWalker(state);
|
|
112
120
|
}
|
|
113
|
-
|
|
114
|
-
const treeIndicatorId = pseudoRandomId('tree-indicator-');
|
|
115
121
|
</script>
|
|
116
122
|
|
|
117
123
|
<VirtualList
|
|
@@ -129,6 +135,9 @@
|
|
|
129
135
|
)
|
|
130
136
|
)}
|
|
131
137
|
>
|
|
138
|
+
{#if treeIndicatorColumn}
|
|
139
|
+
<ColumnHead column={treeIndicatorColumn}></ColumnHead>
|
|
140
|
+
{/if}
|
|
132
141
|
{#each externalColumns || columns as column (column.id)}
|
|
133
142
|
<ColumnHead {column}>
|
|
134
143
|
{#if typeof column.header === 'function'}
|