-
-
Notifications
You must be signed in to change notification settings - Fork 3k
/
index.ts
97 lines (86 loc) 路 2.12 KB
/
index.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
import {
Directive,
Input,
OnInit,
TemplateRef,
ViewContainerRef,
} from '@angular/core'
import {
RowData,
TableOptions,
TableOptionsResolved,
createTable,
} from '@tanstack/table-core'
export * from '@tanstack/table-core'
@Directive({
selector: '[flexRender]',
standalone: true,
})
export class FlexRenderDirective implements OnInit {
private _flexRender: any
/** properties to render */
private _flexRenderProps: any
@Input({ required: true })
set flexRender(render: any) {
this._flexRender = render
}
@Input({ required: true })
set flexRenderProps(props: any) {
this._flexRenderProps = props
}
constructor(
private vcr: ViewContainerRef,
private templateRef: TemplateRef<any>
) {}
ngOnInit(): void {
// This ensures that if the 'flexRender' input is set before the directive initializes,
// the component will be rendered when ngOnInit is called.
if (this._flexRender) {
this.renderComponent()
}
}
renderComponent() {
this.vcr.clear()
if (!this._flexRender) {
return null
}
if (typeof this._flexRender === 'string') {
return this.vcr.createEmbeddedView(this.templateRef, {
$implicit: this._flexRender,
})
} else if (typeof this._flexRender === 'function') {
const componentInstance = this._flexRender(this._flexRenderProps)
return this.vcr.createEmbeddedView(this.templateRef, {
$implicit: componentInstance,
})
}
return null
}
}
export function createAngularTable<TData extends RowData>(
options: TableOptions<TData>
) {
const resolvedOptions: TableOptionsResolved<TData> = {
state: {},
onStateChange: () => {},
renderFallbackValue: null,
...options,
}
let table = createTable<TData>(resolvedOptions)
let state = table.initialState
// Compose the default state above with any user state.
table.setOptions((prev: any) => {
return {
...prev,
...options,
state: {
...state,
...options.state,
},
onStateChange: (updater: any) => {
options.onStateChange?.(updater)
},
}
})
return table
}