@tanstack/preact-table 9.0.0-alpha.43 → 9.0.0-alpha.44
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/Subscribe.cjs +2 -1
- package/dist/Subscribe.cjs.map +1 -1
- package/dist/Subscribe.d.cts +15 -16
- package/dist/Subscribe.d.ts +15 -16
- package/dist/Subscribe.js +2 -1
- package/dist/Subscribe.js.map +1 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/useTable.cjs +2 -1
- package/dist/useTable.cjs.map +1 -1
- package/dist/useTable.d.cts +4 -5
- package/dist/useTable.d.ts +4 -5
- package/dist/useTable.js +2 -1
- package/dist/useTable.js.map +1 -1
- package/package.json +1 -1
- package/src/Subscribe.ts +32 -75
- package/src/useTable.ts +7 -9
package/dist/Subscribe.cjs
CHANGED
|
@@ -2,7 +2,8 @@ let _tanstack_preact_store = require("@tanstack/preact-store");
|
|
|
2
2
|
|
|
3
3
|
//#region src/Subscribe.ts
|
|
4
4
|
function Subscribe(props) {
|
|
5
|
-
const
|
|
5
|
+
const selectFn = props.selector ?? ((x) => x);
|
|
6
|
+
const selected = (0, _tanstack_preact_store.useSelector)(props.source, selectFn, { compare: _tanstack_preact_store.shallow });
|
|
6
7
|
return typeof props.children === "function" ? props.children(selected) : props.children;
|
|
7
8
|
}
|
|
8
9
|
|
package/dist/Subscribe.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Subscribe.cjs","names":["shallow"],"sources":["../src/Subscribe.ts"],"sourcesContent":["import { shallow, useSelector } from '@tanstack/preact-store'\nimport type {
|
|
1
|
+
{"version":3,"file":"Subscribe.cjs","names":["shallow"],"sources":["../src/Subscribe.ts"],"sourcesContent":["import { shallow, useSelector } from '@tanstack/preact-store'\nimport type {\n Atom,\n ReadonlyAtom,\n ReadonlyStore,\n Store,\n} from '@tanstack/preact-store'\nimport type { TableFeatures, TableState } from '@tanstack/table-core'\nimport type { ComponentChildren } from 'preact'\n\nexport type SubscribeSource<TValue> =\n | Atom<TValue>\n | ReadonlyAtom<TValue>\n | Store<TValue>\n | ReadonlyStore<TValue>\n\n/**\n * Subscribe to `table.store` (full table state). The selector receives the full\n * {@link TableState}.\n */\nexport type SubscribePropsWithStore<\n TFeatures extends TableFeatures,\n TSelected,\n> = {\n source: SubscribeSource<TableState<TFeatures>>\n /**\n * Select from full table state. Re-renders when the selected value changes\n * (shallow compare).\n *\n * Required in store mode so you never accidentally subscribe to the whole\n * store without an explicit projection.\n */\n selector: (state: TableState<TFeatures>) => TSelected\n children: ((state: TSelected) => ComponentChildren) | ComponentChildren\n}\n\n/**\n * Subscribe to the full value of a source (e.g. `table.atoms.rowSelection` or\n * `table.optionsStore`). Omitting `selector` is equivalent to the identity\n * selector — children receive `TSourceValue`.\n */\nexport type SubscribePropsWithSourceIdentity<TSourceValue> = {\n source: SubscribeSource<TSourceValue>\n selector?: undefined\n children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren\n}\n\n/**\n * Subscribe to a projected value from a source (atom or store).\n */\nexport type SubscribePropsWithSourceWithSelector<TSourceValue, TSelected> = {\n source: SubscribeSource<TSourceValue>\n selector: (state: TSourceValue) => TSelected\n children: ((state: TSelected) => ComponentChildren) | ComponentChildren\n}\n\n/**\n * Subscribe to a single source — atom or store (identity or projected).\n */\nexport type SubscribePropsWithSource<TSourceValue, TSelected = TSourceValue> =\n | SubscribePropsWithSourceIdentity<TSourceValue>\n | SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>\n\nexport type SubscribeProps<\n TFeatures extends TableFeatures,\n TSelected = unknown,\n TSourceValue = unknown,\n> =\n | SubscribePropsWithStore<TFeatures, TSelected>\n | SubscribePropsWithSourceIdentity<TSourceValue>\n | SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>\n\n/**\n * A Preact component that allows you to subscribe to the table state.\n *\n * For `table.Subscribe` from `useTable`, prefer that API — it uses overloads so\n * JSX contextual typing works. This standalone component uses a union `props` type.\n */\nexport function Subscribe<TSourceValue>(\n props: SubscribePropsWithSourceIdentity<TSourceValue>,\n): ComponentChildren\nexport function Subscribe<TSourceValue, TSelected>(\n props: SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>,\n): ComponentChildren\nexport function Subscribe<TFeatures extends TableFeatures, TSelected>(\n props: SubscribePropsWithStore<TFeatures, TSelected>,\n): ComponentChildren\nexport function Subscribe<\n TFeatures extends TableFeatures,\n TSelected,\n TSourceValue,\n>(\n props: SubscribeProps<TFeatures, TSelected, TSourceValue>,\n): ComponentChildren {\n const selectFn = props.selector ?? ((x: unknown) => x)\n\n const selected = useSelector(\n props.source as never,\n selectFn as Parameters<typeof useSelector>[1],\n {\n compare: shallow,\n },\n ) as TSelected\n\n return typeof props.children === 'function'\n ? (props.children as (state: TSelected) => ComponentChildren)(selected)\n : props.children\n}\n"],"mappings":";;;AAuFA,SAAgB,UAKd,OACmB;CACnB,MAAM,WAAW,MAAM,cAAc,MAAe;CAEpD,MAAM,mDACJ,MAAM,QACN,UACA,EACE,SAASA,gCACV,CACF;AAED,QAAO,OAAO,MAAM,aAAa,aAC5B,MAAM,SAAqD,SAAS,GACrE,MAAM"}
|
package/dist/Subscribe.d.cts
CHANGED
|
@@ -1,14 +1,15 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { TableFeatures, TableState } from "@tanstack/table-core";
|
|
2
2
|
import { ComponentChildren } from "preact";
|
|
3
|
-
import { Atom, ReadonlyAtom } from "@tanstack/preact-store";
|
|
3
|
+
import { Atom, ReadonlyAtom, ReadonlyStore, Store } from "@tanstack/preact-store";
|
|
4
4
|
|
|
5
5
|
//#region src/Subscribe.d.ts
|
|
6
|
+
type SubscribeSource<TValue> = Atom<TValue> | ReadonlyAtom<TValue> | Store<TValue> | ReadonlyStore<TValue>;
|
|
6
7
|
/**
|
|
7
8
|
* Subscribe to `table.store` (full table state). The selector receives the full
|
|
8
9
|
* {@link TableState}.
|
|
9
10
|
*/
|
|
10
|
-
type SubscribePropsWithStore<TFeatures extends TableFeatures,
|
|
11
|
-
|
|
11
|
+
type SubscribePropsWithStore<TFeatures extends TableFeatures, TSelected> = {
|
|
12
|
+
source: SubscribeSource<TableState<TFeatures>>;
|
|
12
13
|
/**
|
|
13
14
|
* Select from full table state. Re-renders when the selected value changes
|
|
14
15
|
* (shallow compare).
|
|
@@ -24,35 +25,33 @@ type SubscribePropsWithStore<TFeatures extends TableFeatures, TData extends RowD
|
|
|
24
25
|
* `table.optionsStore`). Omitting `selector` is equivalent to the identity
|
|
25
26
|
* selector — children receive `TSourceValue`.
|
|
26
27
|
*/
|
|
27
|
-
type SubscribePropsWithSourceIdentity<
|
|
28
|
-
|
|
29
|
-
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
28
|
+
type SubscribePropsWithSourceIdentity<TSourceValue> = {
|
|
29
|
+
source: SubscribeSource<TSourceValue>;
|
|
30
30
|
selector?: undefined;
|
|
31
31
|
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren;
|
|
32
32
|
};
|
|
33
33
|
/**
|
|
34
34
|
* Subscribe to a projected value from a source (atom or store).
|
|
35
35
|
*/
|
|
36
|
-
type SubscribePropsWithSourceWithSelector<
|
|
37
|
-
|
|
38
|
-
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
36
|
+
type SubscribePropsWithSourceWithSelector<TSourceValue, TSelected> = {
|
|
37
|
+
source: SubscribeSource<TSourceValue>;
|
|
39
38
|
selector: (state: TSourceValue) => TSelected;
|
|
40
39
|
children: ((state: TSelected) => ComponentChildren) | ComponentChildren;
|
|
41
40
|
};
|
|
42
41
|
/**
|
|
43
42
|
* Subscribe to a single source — atom or store (identity or projected).
|
|
44
43
|
*/
|
|
45
|
-
type SubscribePropsWithSource<
|
|
46
|
-
type SubscribeProps<TFeatures extends TableFeatures,
|
|
44
|
+
type SubscribePropsWithSource<TSourceValue, TSelected = TSourceValue> = SubscribePropsWithSourceIdentity<TSourceValue> | SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>;
|
|
45
|
+
type SubscribeProps<TFeatures extends TableFeatures, TSelected = unknown, TSourceValue = unknown> = SubscribePropsWithStore<TFeatures, TSelected> | SubscribePropsWithSourceIdentity<TSourceValue> | SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>;
|
|
47
46
|
/**
|
|
48
47
|
* A Preact component that allows you to subscribe to the table state.
|
|
49
48
|
*
|
|
50
49
|
* For `table.Subscribe` from `useTable`, prefer that API — it uses overloads so
|
|
51
50
|
* JSX contextual typing works. This standalone component uses a union `props` type.
|
|
52
51
|
*/
|
|
53
|
-
declare function Subscribe<
|
|
54
|
-
declare function Subscribe<
|
|
55
|
-
declare function Subscribe<TFeatures extends TableFeatures,
|
|
52
|
+
declare function Subscribe<TSourceValue>(props: SubscribePropsWithSourceIdentity<TSourceValue>): ComponentChildren;
|
|
53
|
+
declare function Subscribe<TSourceValue, TSelected>(props: SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>): ComponentChildren;
|
|
54
|
+
declare function Subscribe<TFeatures extends TableFeatures, TSelected>(props: SubscribePropsWithStore<TFeatures, TSelected>): ComponentChildren;
|
|
56
55
|
//#endregion
|
|
57
|
-
export { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore };
|
|
56
|
+
export { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, SubscribeSource };
|
|
58
57
|
//# sourceMappingURL=Subscribe.d.cts.map
|
package/dist/Subscribe.d.ts
CHANGED
|
@@ -1,14 +1,15 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { Atom, ReadonlyAtom } from "@tanstack/preact-store";
|
|
1
|
+
import { TableFeatures, TableState } from "@tanstack/table-core";
|
|
2
|
+
import { Atom, ReadonlyAtom, ReadonlyStore, Store } from "@tanstack/preact-store";
|
|
3
3
|
import { ComponentChildren } from "preact";
|
|
4
4
|
|
|
5
5
|
//#region src/Subscribe.d.ts
|
|
6
|
+
type SubscribeSource<TValue> = Atom<TValue> | ReadonlyAtom<TValue> | Store<TValue> | ReadonlyStore<TValue>;
|
|
6
7
|
/**
|
|
7
8
|
* Subscribe to `table.store` (full table state). The selector receives the full
|
|
8
9
|
* {@link TableState}.
|
|
9
10
|
*/
|
|
10
|
-
type SubscribePropsWithStore<TFeatures extends TableFeatures,
|
|
11
|
-
|
|
11
|
+
type SubscribePropsWithStore<TFeatures extends TableFeatures, TSelected> = {
|
|
12
|
+
source: SubscribeSource<TableState<TFeatures>>;
|
|
12
13
|
/**
|
|
13
14
|
* Select from full table state. Re-renders when the selected value changes
|
|
14
15
|
* (shallow compare).
|
|
@@ -24,35 +25,33 @@ type SubscribePropsWithStore<TFeatures extends TableFeatures, TData extends RowD
|
|
|
24
25
|
* `table.optionsStore`). Omitting `selector` is equivalent to the identity
|
|
25
26
|
* selector — children receive `TSourceValue`.
|
|
26
27
|
*/
|
|
27
|
-
type SubscribePropsWithSourceIdentity<
|
|
28
|
-
|
|
29
|
-
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
28
|
+
type SubscribePropsWithSourceIdentity<TSourceValue> = {
|
|
29
|
+
source: SubscribeSource<TSourceValue>;
|
|
30
30
|
selector?: undefined;
|
|
31
31
|
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren;
|
|
32
32
|
};
|
|
33
33
|
/**
|
|
34
34
|
* Subscribe to a projected value from a source (atom or store).
|
|
35
35
|
*/
|
|
36
|
-
type SubscribePropsWithSourceWithSelector<
|
|
37
|
-
|
|
38
|
-
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
36
|
+
type SubscribePropsWithSourceWithSelector<TSourceValue, TSelected> = {
|
|
37
|
+
source: SubscribeSource<TSourceValue>;
|
|
39
38
|
selector: (state: TSourceValue) => TSelected;
|
|
40
39
|
children: ((state: TSelected) => ComponentChildren) | ComponentChildren;
|
|
41
40
|
};
|
|
42
41
|
/**
|
|
43
42
|
* Subscribe to a single source — atom or store (identity or projected).
|
|
44
43
|
*/
|
|
45
|
-
type SubscribePropsWithSource<
|
|
46
|
-
type SubscribeProps<TFeatures extends TableFeatures,
|
|
44
|
+
type SubscribePropsWithSource<TSourceValue, TSelected = TSourceValue> = SubscribePropsWithSourceIdentity<TSourceValue> | SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>;
|
|
45
|
+
type SubscribeProps<TFeatures extends TableFeatures, TSelected = unknown, TSourceValue = unknown> = SubscribePropsWithStore<TFeatures, TSelected> | SubscribePropsWithSourceIdentity<TSourceValue> | SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>;
|
|
47
46
|
/**
|
|
48
47
|
* A Preact component that allows you to subscribe to the table state.
|
|
49
48
|
*
|
|
50
49
|
* For `table.Subscribe` from `useTable`, prefer that API — it uses overloads so
|
|
51
50
|
* JSX contextual typing works. This standalone component uses a union `props` type.
|
|
52
51
|
*/
|
|
53
|
-
declare function Subscribe<
|
|
54
|
-
declare function Subscribe<
|
|
55
|
-
declare function Subscribe<TFeatures extends TableFeatures,
|
|
52
|
+
declare function Subscribe<TSourceValue>(props: SubscribePropsWithSourceIdentity<TSourceValue>): ComponentChildren;
|
|
53
|
+
declare function Subscribe<TSourceValue, TSelected>(props: SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>): ComponentChildren;
|
|
54
|
+
declare function Subscribe<TFeatures extends TableFeatures, TSelected>(props: SubscribePropsWithStore<TFeatures, TSelected>): ComponentChildren;
|
|
56
55
|
//#endregion
|
|
57
|
-
export { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore };
|
|
56
|
+
export { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, SubscribeSource };
|
|
58
57
|
//# sourceMappingURL=Subscribe.d.ts.map
|
package/dist/Subscribe.js
CHANGED
|
@@ -2,7 +2,8 @@ import { shallow, useSelector } from "@tanstack/preact-store";
|
|
|
2
2
|
|
|
3
3
|
//#region src/Subscribe.ts
|
|
4
4
|
function Subscribe(props) {
|
|
5
|
-
const
|
|
5
|
+
const selectFn = props.selector ?? ((x) => x);
|
|
6
|
+
const selected = useSelector(props.source, selectFn, { compare: shallow });
|
|
6
7
|
return typeof props.children === "function" ? props.children(selected) : props.children;
|
|
7
8
|
}
|
|
8
9
|
|
package/dist/Subscribe.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Subscribe.js","names":[],"sources":["../src/Subscribe.ts"],"sourcesContent":["import { shallow, useSelector } from '@tanstack/preact-store'\nimport type {
|
|
1
|
+
{"version":3,"file":"Subscribe.js","names":[],"sources":["../src/Subscribe.ts"],"sourcesContent":["import { shallow, useSelector } from '@tanstack/preact-store'\nimport type {\n Atom,\n ReadonlyAtom,\n ReadonlyStore,\n Store,\n} from '@tanstack/preact-store'\nimport type { TableFeatures, TableState } from '@tanstack/table-core'\nimport type { ComponentChildren } from 'preact'\n\nexport type SubscribeSource<TValue> =\n | Atom<TValue>\n | ReadonlyAtom<TValue>\n | Store<TValue>\n | ReadonlyStore<TValue>\n\n/**\n * Subscribe to `table.store` (full table state). The selector receives the full\n * {@link TableState}.\n */\nexport type SubscribePropsWithStore<\n TFeatures extends TableFeatures,\n TSelected,\n> = {\n source: SubscribeSource<TableState<TFeatures>>\n /**\n * Select from full table state. Re-renders when the selected value changes\n * (shallow compare).\n *\n * Required in store mode so you never accidentally subscribe to the whole\n * store without an explicit projection.\n */\n selector: (state: TableState<TFeatures>) => TSelected\n children: ((state: TSelected) => ComponentChildren) | ComponentChildren\n}\n\n/**\n * Subscribe to the full value of a source (e.g. `table.atoms.rowSelection` or\n * `table.optionsStore`). Omitting `selector` is equivalent to the identity\n * selector — children receive `TSourceValue`.\n */\nexport type SubscribePropsWithSourceIdentity<TSourceValue> = {\n source: SubscribeSource<TSourceValue>\n selector?: undefined\n children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren\n}\n\n/**\n * Subscribe to a projected value from a source (atom or store).\n */\nexport type SubscribePropsWithSourceWithSelector<TSourceValue, TSelected> = {\n source: SubscribeSource<TSourceValue>\n selector: (state: TSourceValue) => TSelected\n children: ((state: TSelected) => ComponentChildren) | ComponentChildren\n}\n\n/**\n * Subscribe to a single source — atom or store (identity or projected).\n */\nexport type SubscribePropsWithSource<TSourceValue, TSelected = TSourceValue> =\n | SubscribePropsWithSourceIdentity<TSourceValue>\n | SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>\n\nexport type SubscribeProps<\n TFeatures extends TableFeatures,\n TSelected = unknown,\n TSourceValue = unknown,\n> =\n | SubscribePropsWithStore<TFeatures, TSelected>\n | SubscribePropsWithSourceIdentity<TSourceValue>\n | SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>\n\n/**\n * A Preact component that allows you to subscribe to the table state.\n *\n * For `table.Subscribe` from `useTable`, prefer that API — it uses overloads so\n * JSX contextual typing works. This standalone component uses a union `props` type.\n */\nexport function Subscribe<TSourceValue>(\n props: SubscribePropsWithSourceIdentity<TSourceValue>,\n): ComponentChildren\nexport function Subscribe<TSourceValue, TSelected>(\n props: SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>,\n): ComponentChildren\nexport function Subscribe<TFeatures extends TableFeatures, TSelected>(\n props: SubscribePropsWithStore<TFeatures, TSelected>,\n): ComponentChildren\nexport function Subscribe<\n TFeatures extends TableFeatures,\n TSelected,\n TSourceValue,\n>(\n props: SubscribeProps<TFeatures, TSelected, TSourceValue>,\n): ComponentChildren {\n const selectFn = props.selector ?? ((x: unknown) => x)\n\n const selected = useSelector(\n props.source as never,\n selectFn as Parameters<typeof useSelector>[1],\n {\n compare: shallow,\n },\n ) as TSelected\n\n return typeof props.children === 'function'\n ? (props.children as (state: TSelected) => ComponentChildren)(selected)\n : props.children\n}\n"],"mappings":";;;AAuFA,SAAgB,UAKd,OACmB;CACnB,MAAM,WAAW,MAAM,cAAc,MAAe;CAEpD,MAAM,WAAW,YACf,MAAM,QACN,UACA,EACE,SAAS,SACV,CACF;AAED,QAAO,OAAO,MAAM,aAAa,aAC5B,MAAM,SAAqD,SAAS,GACrE,MAAM"}
|
package/dist/index.d.cts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { FlexRender, FlexRenderProps, Renderable, flexRender } from "./FlexRender.cjs";
|
|
2
|
-
import { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore } from "./Subscribe.cjs";
|
|
2
|
+
import { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, SubscribeSource } from "./Subscribe.cjs";
|
|
3
3
|
import { PreactTable, useTable } from "./useTable.cjs";
|
|
4
4
|
import { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppGroupColumnDef, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, createTableHook } from "./createTableHook.cjs";
|
|
5
5
|
export * from "@tanstack/table-core";
|
|
6
|
-
export { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppGroupColumnDef, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, FlexRender, FlexRenderProps, PreactTable, Renderable, Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, createTableHook, flexRender, useTable };
|
|
6
|
+
export { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppGroupColumnDef, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, FlexRender, FlexRenderProps, PreactTable, Renderable, Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, SubscribeSource, createTableHook, flexRender, useTable };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { FlexRender, FlexRenderProps, Renderable, flexRender } from "./FlexRender.js";
|
|
2
|
-
import { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore } from "./Subscribe.js";
|
|
2
|
+
import { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, SubscribeSource } from "./Subscribe.js";
|
|
3
3
|
import { PreactTable, useTable } from "./useTable.js";
|
|
4
4
|
import { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppGroupColumnDef, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, createTableHook } from "./createTableHook.js";
|
|
5
5
|
export * from "@tanstack/table-core";
|
|
6
|
-
export { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppGroupColumnDef, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, FlexRender, FlexRenderProps, PreactTable, Renderable, Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, createTableHook, flexRender, useTable };
|
|
6
|
+
export { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppGroupColumnDef, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, FlexRender, FlexRenderProps, PreactTable, Renderable, Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, SubscribeSource, createTableHook, flexRender, useTable };
|
package/dist/useTable.cjs
CHANGED
|
@@ -16,9 +16,10 @@ function useTable(tableOptions, selector = () => ({})) {
|
|
|
16
16
|
}
|
|
17
17
|
});
|
|
18
18
|
tableInstance.Subscribe = ((props) => {
|
|
19
|
+
const source = props.source ?? tableInstance.store;
|
|
19
20
|
return require_Subscribe.Subscribe({
|
|
20
21
|
...props,
|
|
21
|
-
|
|
22
|
+
source
|
|
22
23
|
});
|
|
23
24
|
});
|
|
24
25
|
tableInstance.FlexRender = require_FlexRender.FlexRender;
|
package/dist/useTable.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTable.cjs","names":["preactReactivity","Subscribe","FlexRender","shallow"],"sources":["../src/useTable.ts"],"sourcesContent":["import { useMemo, useState } from 'preact/hooks'\nimport { constructTable } from '@tanstack/table-core'\nimport { shallow, useSelector } from '@tanstack/preact-store'\nimport { preactReactivity } from './reactivity'\nimport { FlexRender } from './FlexRender'\nimport { Subscribe } from './Subscribe'\nimport type {\n CellData,\n RowData,\n Table,\n TableFeatures,\n TableOptions,\n TableState,\n} from '@tanstack/table-core'\nimport type {
|
|
1
|
+
{"version":3,"file":"useTable.cjs","names":["preactReactivity","Subscribe","FlexRender","shallow"],"sources":["../src/useTable.ts"],"sourcesContent":["import { useMemo, useState } from 'preact/hooks'\nimport { constructTable } from '@tanstack/table-core'\nimport { shallow, useSelector } from '@tanstack/preact-store'\nimport { preactReactivity } from './reactivity'\nimport { FlexRender } from './FlexRender'\nimport { Subscribe } from './Subscribe'\nimport type {\n CellData,\n RowData,\n Table,\n TableFeatures,\n TableOptions,\n TableState,\n} from '@tanstack/table-core'\nimport type { ComponentChildren } from 'preact'\nimport type { FlexRenderProps } from './FlexRender'\nimport type { SubscribePropsWithStore, SubscribeSource } from './Subscribe'\n\nexport type PreactTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = {},\n> = Table<TFeatures, TData> & {\n /**\n * A Preact HOC (Higher Order Component) that allows you to subscribe to the table state.\n *\n * Pass `source` to subscribe to a single atom or store (e.g. `table.atoms.rowSelection`\n * or `table.optionsStore`) instead of the full `table.store`.\n *\n * @example\n * <table.Subscribe selector={(state) => ({ rowSelection: state.rowSelection })}>\n * {({ rowSelection }) => (\n * <tr key={row.id}>...</tr>\n * )}\n * </table.Subscribe>\n *\n * @example\n * <table.Subscribe source={table.atoms.rowSelection}>\n * {(rowSelection) => <div>...</div>}\n * </table.Subscribe>\n *\n * @example\n * <table.Subscribe source={table.atoms.rowSelection} selector={(s) => s?.[row.id]}>\n * {() => <tr key={row.id}>...</tr>}\n * </table.Subscribe>\n */\n /**\n * Overloads (source first, then store) so JSX contextual typing works for both modes.\n * Source without `selector` is separate so children infer `TSourceValue` (identity projection).\n */\n Subscribe: {\n <TSourceValue>(props: {\n source: SubscribeSource<TSourceValue>\n selector?: undefined\n children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren\n }): ComponentChildren\n <TSourceValue, TSubSelected>(props: {\n source: SubscribeSource<TSourceValue>\n selector: (state: TSourceValue) => TSubSelected\n children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren\n }): ComponentChildren\n <TSubSelected>(\n props: Omit<SubscribePropsWithStore<TFeatures, TSubSelected>, 'source'>,\n ): ComponentChildren\n }\n /**\n * A Preact component that renders headers, cells, or footers with custom markup.\n * Use this utility component instead of manually calling flexRender.\n */\n FlexRender: <TValue extends CellData = CellData>(\n props: FlexRenderProps<TFeatures, TData, TValue>,\n ) => ComponentChildren\n /**\n * The selected state of the table. This state may not match the structure of `table.store.state` because it is selected by the `selector` function that you pass as the 2nd argument to `useTable`.\n */\n readonly state: Readonly<TSelected>\n}\n\nexport function useTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = {},\n>(\n tableOptions: TableOptions<TFeatures, TData>,\n selector: (state: TableState<TFeatures>) => TSelected = () =>\n ({}) as TSelected,\n): PreactTable<TFeatures, TData, TSelected> {\n const [table] = useState(() => {\n const tableInstance = constructTable({\n ...tableOptions,\n _features: {\n coreReativityFeature: preactReactivity(),\n ...tableOptions._features,\n },\n }) as PreactTable<TFeatures, TData, TSelected>\n\n tableInstance.Subscribe = ((props: any) => {\n const source = props.source ?? tableInstance.store\n\n return Subscribe({\n ...props,\n source,\n })\n }) as PreactTable<TFeatures, TData, TSelected>['Subscribe']\n\n tableInstance.FlexRender = FlexRender\n\n return tableInstance\n })\n\n // sync options on every render\n table.setOptions((prev) => ({\n ...prev,\n ...tableOptions,\n }))\n\n const state = useSelector(table.store, selector, { compare: shallow })\n\n return useMemo(\n () => ({\n ...table,\n options: tableOptions,\n state,\n }),\n [table, tableOptions, state],\n )\n}\n"],"mappings":";;;;;;;;AA8EA,SAAgB,SAKd,cACA,kBACG,EAAE,GACqC;CAC1C,MAAM,CAAC,0CAAwB;EAC7B,MAAM,yDAA+B;GACnC,GAAG;GACH,WAAW;IACT,sBAAsBA,qCAAkB;IACxC,GAAG,aAAa;IACjB;GACF,CAAC;AAEF,gBAAc,cAAc,UAAe;GACzC,MAAM,SAAS,MAAM,UAAU,cAAc;AAE7C,UAAOC,4BAAU;IACf,GAAG;IACH;IACD,CAAC;;AAGJ,gBAAc,aAAaC;AAE3B,SAAO;GACP;AAGF,OAAM,YAAY,UAAU;EAC1B,GAAG;EACH,GAAG;EACJ,EAAE;CAEH,MAAM,gDAAoB,MAAM,OAAO,UAAU,EAAE,SAASC,gCAAS,CAAC;AAEtE,yCACS;EACL,GAAG;EACH,SAAS;EACT;EACD,GACD;EAAC;EAAO;EAAc;EAAM,CAC7B"}
|
package/dist/useTable.d.cts
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { FlexRenderProps } from "./FlexRender.cjs";
|
|
2
|
-
import { SubscribePropsWithStore } from "./Subscribe.cjs";
|
|
2
|
+
import { SubscribePropsWithStore, SubscribeSource } from "./Subscribe.cjs";
|
|
3
3
|
import { CellData, RowData, Table, TableFeatures, TableOptions, TableState } from "@tanstack/table-core";
|
|
4
4
|
import { ComponentChildren } from "preact";
|
|
5
|
-
import { Atom, ReadonlyAtom } from "@tanstack/preact-store";
|
|
6
5
|
|
|
7
6
|
//#region src/useTable.d.ts
|
|
8
7
|
type PreactTable<TFeatures extends TableFeatures, TData extends RowData, TSelected = {}> = Table<TFeatures, TData> & {
|
|
@@ -35,16 +34,16 @@ type PreactTable<TFeatures extends TableFeatures, TData extends RowData, TSelect
|
|
|
35
34
|
*/
|
|
36
35
|
Subscribe: {
|
|
37
36
|
<TSourceValue>(props: {
|
|
38
|
-
source:
|
|
37
|
+
source: SubscribeSource<TSourceValue>;
|
|
39
38
|
selector?: undefined;
|
|
40
39
|
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren;
|
|
41
40
|
}): ComponentChildren;
|
|
42
41
|
<TSourceValue, TSubSelected>(props: {
|
|
43
|
-
source:
|
|
42
|
+
source: SubscribeSource<TSourceValue>;
|
|
44
43
|
selector: (state: TSourceValue) => TSubSelected;
|
|
45
44
|
children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren;
|
|
46
45
|
}): ComponentChildren;
|
|
47
|
-
<TSubSelected>(props: Omit<SubscribePropsWithStore<TFeatures,
|
|
46
|
+
<TSubSelected>(props: Omit<SubscribePropsWithStore<TFeatures, TSubSelected>, 'source'>): ComponentChildren;
|
|
48
47
|
};
|
|
49
48
|
/**
|
|
50
49
|
* A Preact component that renders headers, cells, or footers with custom markup.
|
package/dist/useTable.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { FlexRenderProps } from "./FlexRender.js";
|
|
2
|
-
import { SubscribePropsWithStore } from "./Subscribe.js";
|
|
2
|
+
import { SubscribePropsWithStore, SubscribeSource } from "./Subscribe.js";
|
|
3
3
|
import { CellData, RowData, Table, TableFeatures, TableOptions, TableState } from "@tanstack/table-core";
|
|
4
|
-
import { Atom, ReadonlyAtom } from "@tanstack/preact-store";
|
|
5
4
|
import { ComponentChildren } from "preact";
|
|
6
5
|
|
|
7
6
|
//#region src/useTable.d.ts
|
|
@@ -35,16 +34,16 @@ type PreactTable<TFeatures extends TableFeatures, TData extends RowData, TSelect
|
|
|
35
34
|
*/
|
|
36
35
|
Subscribe: {
|
|
37
36
|
<TSourceValue>(props: {
|
|
38
|
-
source:
|
|
37
|
+
source: SubscribeSource<TSourceValue>;
|
|
39
38
|
selector?: undefined;
|
|
40
39
|
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren;
|
|
41
40
|
}): ComponentChildren;
|
|
42
41
|
<TSourceValue, TSubSelected>(props: {
|
|
43
|
-
source:
|
|
42
|
+
source: SubscribeSource<TSourceValue>;
|
|
44
43
|
selector: (state: TSourceValue) => TSubSelected;
|
|
45
44
|
children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren;
|
|
46
45
|
}): ComponentChildren;
|
|
47
|
-
<TSubSelected>(props: Omit<SubscribePropsWithStore<TFeatures,
|
|
46
|
+
<TSubSelected>(props: Omit<SubscribePropsWithStore<TFeatures, TSubSelected>, 'source'>): ComponentChildren;
|
|
48
47
|
};
|
|
49
48
|
/**
|
|
50
49
|
* A Preact component that renders headers, cells, or footers with custom markup.
|
package/dist/useTable.js
CHANGED
|
@@ -16,9 +16,10 @@ function useTable(tableOptions, selector = () => ({})) {
|
|
|
16
16
|
}
|
|
17
17
|
});
|
|
18
18
|
tableInstance.Subscribe = ((props) => {
|
|
19
|
+
const source = props.source ?? tableInstance.store;
|
|
19
20
|
return Subscribe({
|
|
20
21
|
...props,
|
|
21
|
-
|
|
22
|
+
source
|
|
22
23
|
});
|
|
23
24
|
});
|
|
24
25
|
tableInstance.FlexRender = FlexRender;
|
package/dist/useTable.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTable.js","names":[],"sources":["../src/useTable.ts"],"sourcesContent":["import { useMemo, useState } from 'preact/hooks'\nimport { constructTable } from '@tanstack/table-core'\nimport { shallow, useSelector } from '@tanstack/preact-store'\nimport { preactReactivity } from './reactivity'\nimport { FlexRender } from './FlexRender'\nimport { Subscribe } from './Subscribe'\nimport type {\n CellData,\n RowData,\n Table,\n TableFeatures,\n TableOptions,\n TableState,\n} from '@tanstack/table-core'\nimport type {
|
|
1
|
+
{"version":3,"file":"useTable.js","names":[],"sources":["../src/useTable.ts"],"sourcesContent":["import { useMemo, useState } from 'preact/hooks'\nimport { constructTable } from '@tanstack/table-core'\nimport { shallow, useSelector } from '@tanstack/preact-store'\nimport { preactReactivity } from './reactivity'\nimport { FlexRender } from './FlexRender'\nimport { Subscribe } from './Subscribe'\nimport type {\n CellData,\n RowData,\n Table,\n TableFeatures,\n TableOptions,\n TableState,\n} from '@tanstack/table-core'\nimport type { ComponentChildren } from 'preact'\nimport type { FlexRenderProps } from './FlexRender'\nimport type { SubscribePropsWithStore, SubscribeSource } from './Subscribe'\n\nexport type PreactTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = {},\n> = Table<TFeatures, TData> & {\n /**\n * A Preact HOC (Higher Order Component) that allows you to subscribe to the table state.\n *\n * Pass `source` to subscribe to a single atom or store (e.g. `table.atoms.rowSelection`\n * or `table.optionsStore`) instead of the full `table.store`.\n *\n * @example\n * <table.Subscribe selector={(state) => ({ rowSelection: state.rowSelection })}>\n * {({ rowSelection }) => (\n * <tr key={row.id}>...</tr>\n * )}\n * </table.Subscribe>\n *\n * @example\n * <table.Subscribe source={table.atoms.rowSelection}>\n * {(rowSelection) => <div>...</div>}\n * </table.Subscribe>\n *\n * @example\n * <table.Subscribe source={table.atoms.rowSelection} selector={(s) => s?.[row.id]}>\n * {() => <tr key={row.id}>...</tr>}\n * </table.Subscribe>\n */\n /**\n * Overloads (source first, then store) so JSX contextual typing works for both modes.\n * Source without `selector` is separate so children infer `TSourceValue` (identity projection).\n */\n Subscribe: {\n <TSourceValue>(props: {\n source: SubscribeSource<TSourceValue>\n selector?: undefined\n children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren\n }): ComponentChildren\n <TSourceValue, TSubSelected>(props: {\n source: SubscribeSource<TSourceValue>\n selector: (state: TSourceValue) => TSubSelected\n children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren\n }): ComponentChildren\n <TSubSelected>(\n props: Omit<SubscribePropsWithStore<TFeatures, TSubSelected>, 'source'>,\n ): ComponentChildren\n }\n /**\n * A Preact component that renders headers, cells, or footers with custom markup.\n * Use this utility component instead of manually calling flexRender.\n */\n FlexRender: <TValue extends CellData = CellData>(\n props: FlexRenderProps<TFeatures, TData, TValue>,\n ) => ComponentChildren\n /**\n * The selected state of the table. This state may not match the structure of `table.store.state` because it is selected by the `selector` function that you pass as the 2nd argument to `useTable`.\n */\n readonly state: Readonly<TSelected>\n}\n\nexport function useTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = {},\n>(\n tableOptions: TableOptions<TFeatures, TData>,\n selector: (state: TableState<TFeatures>) => TSelected = () =>\n ({}) as TSelected,\n): PreactTable<TFeatures, TData, TSelected> {\n const [table] = useState(() => {\n const tableInstance = constructTable({\n ...tableOptions,\n _features: {\n coreReativityFeature: preactReactivity(),\n ...tableOptions._features,\n },\n }) as PreactTable<TFeatures, TData, TSelected>\n\n tableInstance.Subscribe = ((props: any) => {\n const source = props.source ?? tableInstance.store\n\n return Subscribe({\n ...props,\n source,\n })\n }) as PreactTable<TFeatures, TData, TSelected>['Subscribe']\n\n tableInstance.FlexRender = FlexRender\n\n return tableInstance\n })\n\n // sync options on every render\n table.setOptions((prev) => ({\n ...prev,\n ...tableOptions,\n }))\n\n const state = useSelector(table.store, selector, { compare: shallow })\n\n return useMemo(\n () => ({\n ...table,\n options: tableOptions,\n state,\n }),\n [table, tableOptions, state],\n )\n}\n"],"mappings":";;;;;;;;AA8EA,SAAgB,SAKd,cACA,kBACG,EAAE,GACqC;CAC1C,MAAM,CAAC,SAAS,eAAe;EAC7B,MAAM,gBAAgB,eAAe;GACnC,GAAG;GACH,WAAW;IACT,sBAAsB,kBAAkB;IACxC,GAAG,aAAa;IACjB;GACF,CAAC;AAEF,gBAAc,cAAc,UAAe;GACzC,MAAM,SAAS,MAAM,UAAU,cAAc;AAE7C,UAAO,UAAU;IACf,GAAG;IACH;IACD,CAAC;;AAGJ,gBAAc,aAAa;AAE3B,SAAO;GACP;AAGF,OAAM,YAAY,UAAU;EAC1B,GAAG;EACH,GAAG;EACJ,EAAE;CAEH,MAAM,QAAQ,YAAY,MAAM,OAAO,UAAU,EAAE,SAAS,SAAS,CAAC;AAEtE,QAAO,eACE;EACL,GAAG;EACH,SAAS;EACT;EACD,GACD;EAAC;EAAO;EAAc;EAAM,CAC7B"}
|
package/package.json
CHANGED
package/src/Subscribe.ts
CHANGED
|
@@ -1,23 +1,28 @@
|
|
|
1
1
|
import { shallow, useSelector } from '@tanstack/preact-store'
|
|
2
|
-
import type { Atom, ReadonlyAtom } from '@tanstack/preact-store'
|
|
3
2
|
import type {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
} from '@tanstack/
|
|
3
|
+
Atom,
|
|
4
|
+
ReadonlyAtom,
|
|
5
|
+
ReadonlyStore,
|
|
6
|
+
Store,
|
|
7
|
+
} from '@tanstack/preact-store'
|
|
8
|
+
import type { TableFeatures, TableState } from '@tanstack/table-core'
|
|
9
9
|
import type { ComponentChildren } from 'preact'
|
|
10
10
|
|
|
11
|
+
export type SubscribeSource<TValue> =
|
|
12
|
+
| Atom<TValue>
|
|
13
|
+
| ReadonlyAtom<TValue>
|
|
14
|
+
| Store<TValue>
|
|
15
|
+
| ReadonlyStore<TValue>
|
|
16
|
+
|
|
11
17
|
/**
|
|
12
18
|
* Subscribe to `table.store` (full table state). The selector receives the full
|
|
13
19
|
* {@link TableState}.
|
|
14
20
|
*/
|
|
15
21
|
export type SubscribePropsWithStore<
|
|
16
22
|
TFeatures extends TableFeatures,
|
|
17
|
-
TData extends RowData,
|
|
18
23
|
TSelected,
|
|
19
24
|
> = {
|
|
20
|
-
|
|
25
|
+
source: SubscribeSource<TableState<TFeatures>>
|
|
21
26
|
/**
|
|
22
27
|
* Select from full table state. Re-renders when the selected value changes
|
|
23
28
|
* (shallow compare).
|
|
@@ -34,13 +39,8 @@ export type SubscribePropsWithStore<
|
|
|
34
39
|
* `table.optionsStore`). Omitting `selector` is equivalent to the identity
|
|
35
40
|
* selector — children receive `TSourceValue`.
|
|
36
41
|
*/
|
|
37
|
-
export type SubscribePropsWithSourceIdentity<
|
|
38
|
-
|
|
39
|
-
TData extends RowData,
|
|
40
|
-
TSourceValue,
|
|
41
|
-
> = {
|
|
42
|
-
table: Table<TFeatures, TData>
|
|
43
|
-
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>
|
|
42
|
+
export type SubscribePropsWithSourceIdentity<TSourceValue> = {
|
|
43
|
+
source: SubscribeSource<TSourceValue>
|
|
44
44
|
selector?: undefined
|
|
45
45
|
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren
|
|
46
46
|
}
|
|
@@ -48,14 +48,8 @@ export type SubscribePropsWithSourceIdentity<
|
|
|
48
48
|
/**
|
|
49
49
|
* Subscribe to a projected value from a source (atom or store).
|
|
50
50
|
*/
|
|
51
|
-
export type SubscribePropsWithSourceWithSelector<
|
|
52
|
-
|
|
53
|
-
TData extends RowData,
|
|
54
|
-
TSourceValue,
|
|
55
|
-
TSelected,
|
|
56
|
-
> = {
|
|
57
|
-
table: Table<TFeatures, TData>
|
|
58
|
-
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>
|
|
51
|
+
export type SubscribePropsWithSourceWithSelector<TSourceValue, TSelected> = {
|
|
52
|
+
source: SubscribeSource<TSourceValue>
|
|
59
53
|
selector: (state: TSourceValue) => TSelected
|
|
60
54
|
children: ((state: TSelected) => ComponentChildren) | ComponentChildren
|
|
61
55
|
}
|
|
@@ -63,34 +57,18 @@ export type SubscribePropsWithSourceWithSelector<
|
|
|
63
57
|
/**
|
|
64
58
|
* Subscribe to a single source — atom or store (identity or projected).
|
|
65
59
|
*/
|
|
66
|
-
export type SubscribePropsWithSource<
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
TSourceValue,
|
|
70
|
-
TSelected = TSourceValue,
|
|
71
|
-
> =
|
|
72
|
-
| SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>
|
|
73
|
-
| SubscribePropsWithSourceWithSelector<
|
|
74
|
-
TFeatures,
|
|
75
|
-
TData,
|
|
76
|
-
TSourceValue,
|
|
77
|
-
TSelected
|
|
78
|
-
>
|
|
60
|
+
export type SubscribePropsWithSource<TSourceValue, TSelected = TSourceValue> =
|
|
61
|
+
| SubscribePropsWithSourceIdentity<TSourceValue>
|
|
62
|
+
| SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>
|
|
79
63
|
|
|
80
64
|
export type SubscribeProps<
|
|
81
65
|
TFeatures extends TableFeatures,
|
|
82
|
-
TData extends RowData,
|
|
83
66
|
TSelected = unknown,
|
|
84
67
|
TSourceValue = unknown,
|
|
85
68
|
> =
|
|
86
|
-
| SubscribePropsWithStore<TFeatures,
|
|
87
|
-
| SubscribePropsWithSourceIdentity<
|
|
88
|
-
| SubscribePropsWithSourceWithSelector<
|
|
89
|
-
TFeatures,
|
|
90
|
-
TData,
|
|
91
|
-
TSourceValue,
|
|
92
|
-
TSelected
|
|
93
|
-
>
|
|
69
|
+
| SubscribePropsWithStore<TFeatures, TSelected>
|
|
70
|
+
| SubscribePropsWithSourceIdentity<TSourceValue>
|
|
71
|
+
| SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>
|
|
94
72
|
|
|
95
73
|
/**
|
|
96
74
|
* A Preact component that allows you to subscribe to the table state.
|
|
@@ -98,47 +76,26 @@ export type SubscribeProps<
|
|
|
98
76
|
* For `table.Subscribe` from `useTable`, prefer that API — it uses overloads so
|
|
99
77
|
* JSX contextual typing works. This standalone component uses a union `props` type.
|
|
100
78
|
*/
|
|
101
|
-
export function Subscribe<
|
|
102
|
-
|
|
103
|
-
TData extends RowData,
|
|
104
|
-
TSourceValue,
|
|
105
|
-
>(
|
|
106
|
-
props: SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>,
|
|
79
|
+
export function Subscribe<TSourceValue>(
|
|
80
|
+
props: SubscribePropsWithSourceIdentity<TSourceValue>,
|
|
107
81
|
): ComponentChildren
|
|
108
|
-
export function Subscribe<
|
|
109
|
-
|
|
110
|
-
TData extends RowData,
|
|
111
|
-
TSourceValue,
|
|
112
|
-
TSelected,
|
|
113
|
-
>(
|
|
114
|
-
props: SubscribePropsWithSourceWithSelector<
|
|
115
|
-
TFeatures,
|
|
116
|
-
TData,
|
|
117
|
-
TSourceValue,
|
|
118
|
-
TSelected
|
|
119
|
-
>,
|
|
82
|
+
export function Subscribe<TSourceValue, TSelected>(
|
|
83
|
+
props: SubscribePropsWithSourceWithSelector<TSourceValue, TSelected>,
|
|
120
84
|
): ComponentChildren
|
|
121
|
-
export function Subscribe<
|
|
122
|
-
TFeatures
|
|
123
|
-
TData extends RowData,
|
|
124
|
-
TSelected,
|
|
125
|
-
>(
|
|
126
|
-
props: SubscribePropsWithStore<TFeatures, TData, TSelected>,
|
|
85
|
+
export function Subscribe<TFeatures extends TableFeatures, TSelected>(
|
|
86
|
+
props: SubscribePropsWithStore<TFeatures, TSelected>,
|
|
127
87
|
): ComponentChildren
|
|
128
88
|
export function Subscribe<
|
|
129
89
|
TFeatures extends TableFeatures,
|
|
130
|
-
TData extends RowData,
|
|
131
90
|
TSelected,
|
|
132
91
|
TSourceValue,
|
|
133
92
|
>(
|
|
134
|
-
props: SubscribeProps<TFeatures,
|
|
93
|
+
props: SubscribeProps<TFeatures, TSelected, TSourceValue>,
|
|
135
94
|
): ComponentChildren {
|
|
136
|
-
const
|
|
137
|
-
const selectFn =
|
|
138
|
-
'source' in props ? (props.selector ?? ((x: unknown) => x)) : props.selector
|
|
95
|
+
const selectFn = props.selector ?? ((x: unknown) => x)
|
|
139
96
|
|
|
140
97
|
const selected = useSelector(
|
|
141
|
-
source as never,
|
|
98
|
+
props.source as never,
|
|
142
99
|
selectFn as Parameters<typeof useSelector>[1],
|
|
143
100
|
{
|
|
144
101
|
compare: shallow,
|
package/src/useTable.ts
CHANGED
|
@@ -12,10 +12,9 @@ import type {
|
|
|
12
12
|
TableOptions,
|
|
13
13
|
TableState,
|
|
14
14
|
} from '@tanstack/table-core'
|
|
15
|
-
import type { Atom, ReadonlyAtom } from '@tanstack/preact-store'
|
|
16
15
|
import type { ComponentChildren } from 'preact'
|
|
17
16
|
import type { FlexRenderProps } from './FlexRender'
|
|
18
|
-
import type { SubscribePropsWithStore } from './Subscribe'
|
|
17
|
+
import type { SubscribePropsWithStore, SubscribeSource } from './Subscribe'
|
|
19
18
|
|
|
20
19
|
export type PreactTable<
|
|
21
20
|
TFeatures extends TableFeatures,
|
|
@@ -51,20 +50,17 @@ export type PreactTable<
|
|
|
51
50
|
*/
|
|
52
51
|
Subscribe: {
|
|
53
52
|
<TSourceValue>(props: {
|
|
54
|
-
source:
|
|
53
|
+
source: SubscribeSource<TSourceValue>
|
|
55
54
|
selector?: undefined
|
|
56
55
|
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren
|
|
57
56
|
}): ComponentChildren
|
|
58
57
|
<TSourceValue, TSubSelected>(props: {
|
|
59
|
-
source:
|
|
58
|
+
source: SubscribeSource<TSourceValue>
|
|
60
59
|
selector: (state: TSourceValue) => TSubSelected
|
|
61
60
|
children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren
|
|
62
61
|
}): ComponentChildren
|
|
63
62
|
<TSubSelected>(
|
|
64
|
-
props: Omit<
|
|
65
|
-
SubscribePropsWithStore<TFeatures, TData, TSubSelected>,
|
|
66
|
-
'table'
|
|
67
|
-
>,
|
|
63
|
+
props: Omit<SubscribePropsWithStore<TFeatures, TSubSelected>, 'source'>,
|
|
68
64
|
): ComponentChildren
|
|
69
65
|
}
|
|
70
66
|
/**
|
|
@@ -99,9 +95,11 @@ export function useTable<
|
|
|
99
95
|
}) as PreactTable<TFeatures, TData, TSelected>
|
|
100
96
|
|
|
101
97
|
tableInstance.Subscribe = ((props: any) => {
|
|
98
|
+
const source = props.source ?? tableInstance.store
|
|
99
|
+
|
|
102
100
|
return Subscribe({
|
|
103
101
|
...props,
|
|
104
|
-
|
|
102
|
+
source,
|
|
105
103
|
})
|
|
106
104
|
}) as PreactTable<TFeatures, TData, TSelected>['Subscribe']
|
|
107
105
|
|