@tanstack/preact-table 9.0.0-alpha.34 → 9.0.0-alpha.36
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 +1 -1
- package/dist/Subscribe.cjs.map +1 -1
- package/dist/Subscribe.d.cts +16 -16
- package/dist/Subscribe.d.ts +16 -16
- package/dist/Subscribe.js +1 -1
- package/dist/Subscribe.js.map +1 -1
- package/dist/flex-render.cjs +5 -0
- package/dist/flex-render.d.cts +2 -0
- package/dist/flex-render.d.ts +2 -0
- package/dist/flex-render.js +3 -0
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/useTable.cjs.map +1 -1
- package/dist/useTable.d.cts +12 -11
- package/dist/useTable.d.ts +12 -11
- package/dist/useTable.js.map +1 -1
- package/package.json +6 -2
- package/src/Subscribe.ts +40 -30
- package/src/flex-render.ts +1 -0
- package/src/useTable.ts +12 -11
package/dist/Subscribe.cjs
CHANGED
|
@@ -2,7 +2,7 @@ let _tanstack_preact_store = require("@tanstack/preact-store");
|
|
|
2
2
|
|
|
3
3
|
//#region src/Subscribe.ts
|
|
4
4
|
function Subscribe(props) {
|
|
5
|
-
const selected = (0, _tanstack_preact_store.useSelector)("
|
|
5
|
+
const selected = (0, _tanstack_preact_store.useSelector)("source" in props ? props.source : props.table.store, "source" in props ? props.selector ?? ((x) => x) : props.selector, { compare: _tanstack_preact_store.shallow });
|
|
6
6
|
return typeof props.children === "function" ? props.children(selected) : props.children;
|
|
7
7
|
}
|
|
8
8
|
|
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 { Atom, ReadonlyAtom } from '@tanstack/preact-store'\nimport type {\n RowData,\n Table,\n TableFeatures,\n TableState,\n} from '@tanstack/table-core'\nimport type { ComponentChildren } from 'preact'\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 TData extends RowData,\n TSelected,\n> = {\n table: Table<TFeatures, TData>\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
|
|
1
|
+
{"version":3,"file":"Subscribe.cjs","names":["shallow"],"sources":["../src/Subscribe.ts"],"sourcesContent":["import { shallow, useSelector } from '@tanstack/preact-store'\nimport type { Atom, ReadonlyAtom } from '@tanstack/preact-store'\nimport type {\n RowData,\n Table,\n TableFeatures,\n TableState,\n} from '@tanstack/table-core'\nimport type { ComponentChildren } from 'preact'\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 TData extends RowData,\n TSelected,\n> = {\n table: Table<TFeatures, TData>\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<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n> = {\n table: Table<TFeatures, TData>\n source: Atom<TSourceValue> | ReadonlyAtom<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<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n TSelected,\n> = {\n table: Table<TFeatures, TData>\n source: Atom<TSourceValue> | ReadonlyAtom<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<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n TSelected = TSourceValue,\n> =\n | SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>\n | SubscribePropsWithSourceWithSelector<\n TFeatures,\n TData,\n TSourceValue,\n TSelected\n >\n\nexport type SubscribeProps<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = unknown,\n TSourceValue = unknown,\n> =\n | SubscribePropsWithStore<TFeatures, TData, TSelected>\n | SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>\n | SubscribePropsWithSourceWithSelector<\n TFeatures,\n TData,\n TSourceValue,\n TSelected\n >\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<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n>(\n props: SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>,\n): ComponentChildren\nexport function Subscribe<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n TSelected,\n>(\n props: SubscribePropsWithSourceWithSelector<\n TFeatures,\n TData,\n TSourceValue,\n TSelected\n >,\n): ComponentChildren\nexport function Subscribe<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected,\n>(\n props: SubscribePropsWithStore<TFeatures, TData, TSelected>,\n): ComponentChildren\nexport function Subscribe<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected,\n TSourceValue,\n>(\n props: SubscribeProps<TFeatures, TData, TSelected, TSourceValue>,\n): ComponentChildren {\n const source = 'source' in props ? props.source : props.table.store\n const selectFn =\n 'source' in props ? (props.selector ?? ((x: unknown) => x)) : props.selector\n\n const selected = useSelector(\n 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":";;;AA+HA,SAAgB,UAMd,OACmB;CAKnB,MAAM,mDAJS,YAAY,QAAQ,MAAM,SAAS,MAAM,MAAM,OAE5D,YAAY,QAAS,MAAM,cAAc,MAAe,KAAM,MAAM,UAKpE,EACE,SAASA,gCACV,CACF;AAED,QAAO,OAAO,MAAM,aAAa,aAC5B,MAAM,SAAqD,SAAS,GACrE,MAAM"}
|
package/dist/Subscribe.d.cts
CHANGED
|
@@ -20,39 +20,39 @@ type SubscribePropsWithStore<TFeatures extends TableFeatures, TData extends RowD
|
|
|
20
20
|
children: ((state: TSelected) => ComponentChildren) | ComponentChildren;
|
|
21
21
|
};
|
|
22
22
|
/**
|
|
23
|
-
* Subscribe to the full value of a
|
|
24
|
-
* Omitting `selector` is equivalent to the identity
|
|
25
|
-
* `
|
|
23
|
+
* Subscribe to the full value of a source (e.g. `table.atoms.rowSelection` or
|
|
24
|
+
* `table.optionsStore`). Omitting `selector` is equivalent to the identity
|
|
25
|
+
* selector — children receive `TSourceValue`.
|
|
26
26
|
*/
|
|
27
|
-
type
|
|
27
|
+
type SubscribePropsWithSourceIdentity<TFeatures extends TableFeatures, TData extends RowData, TSourceValue> = {
|
|
28
28
|
table: Table<TFeatures, TData>;
|
|
29
|
-
|
|
29
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
30
30
|
selector?: undefined;
|
|
31
|
-
children: ((state:
|
|
31
|
+
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren;
|
|
32
32
|
};
|
|
33
33
|
/**
|
|
34
|
-
* Subscribe to a projected value from a
|
|
34
|
+
* Subscribe to a projected value from a source (atom or store).
|
|
35
35
|
*/
|
|
36
|
-
type
|
|
36
|
+
type SubscribePropsWithSourceWithSelector<TFeatures extends TableFeatures, TData extends RowData, TSourceValue, TSelected> = {
|
|
37
37
|
table: Table<TFeatures, TData>;
|
|
38
|
-
|
|
39
|
-
selector: (state:
|
|
38
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
39
|
+
selector: (state: TSourceValue) => TSelected;
|
|
40
40
|
children: ((state: TSelected) => ComponentChildren) | ComponentChildren;
|
|
41
41
|
};
|
|
42
42
|
/**
|
|
43
|
-
* Subscribe to a single
|
|
43
|
+
* Subscribe to a single source — atom or store (identity or projected).
|
|
44
44
|
*/
|
|
45
|
-
type
|
|
46
|
-
type SubscribeProps<TFeatures extends TableFeatures, TData extends RowData, TSelected = unknown,
|
|
45
|
+
type SubscribePropsWithSource<TFeatures extends TableFeatures, TData extends RowData, TSourceValue, TSelected = TSourceValue> = SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue> | SubscribePropsWithSourceWithSelector<TFeatures, TData, TSourceValue, TSelected>;
|
|
46
|
+
type SubscribeProps<TFeatures extends TableFeatures, TData extends RowData, TSelected = unknown, TSourceValue = unknown> = SubscribePropsWithStore<TFeatures, TData, TSelected> | SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue> | SubscribePropsWithSourceWithSelector<TFeatures, TData, TSourceValue, TSelected>;
|
|
47
47
|
/**
|
|
48
48
|
* A Preact component that allows you to subscribe to the table state.
|
|
49
49
|
*
|
|
50
50
|
* For `table.Subscribe` from `useTable`, prefer that API — it uses overloads so
|
|
51
51
|
* JSX contextual typing works. This standalone component uses a union `props` type.
|
|
52
52
|
*/
|
|
53
|
-
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData,
|
|
54
|
-
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData,
|
|
53
|
+
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData, TSourceValue>(props: SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>): ComponentChildren;
|
|
54
|
+
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData, TSourceValue, TSelected>(props: SubscribePropsWithSourceWithSelector<TFeatures, TData, TSourceValue, TSelected>): ComponentChildren;
|
|
55
55
|
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData, TSelected>(props: SubscribePropsWithStore<TFeatures, TData, TSelected>): ComponentChildren;
|
|
56
56
|
//#endregion
|
|
57
|
-
export { Subscribe, SubscribeProps,
|
|
57
|
+
export { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore };
|
|
58
58
|
//# sourceMappingURL=Subscribe.d.cts.map
|
package/dist/Subscribe.d.ts
CHANGED
|
@@ -20,39 +20,39 @@ type SubscribePropsWithStore<TFeatures extends TableFeatures, TData extends RowD
|
|
|
20
20
|
children: ((state: TSelected) => ComponentChildren) | ComponentChildren;
|
|
21
21
|
};
|
|
22
22
|
/**
|
|
23
|
-
* Subscribe to the full value of a
|
|
24
|
-
* Omitting `selector` is equivalent to the identity
|
|
25
|
-
* `
|
|
23
|
+
* Subscribe to the full value of a source (e.g. `table.atoms.rowSelection` or
|
|
24
|
+
* `table.optionsStore`). Omitting `selector` is equivalent to the identity
|
|
25
|
+
* selector — children receive `TSourceValue`.
|
|
26
26
|
*/
|
|
27
|
-
type
|
|
27
|
+
type SubscribePropsWithSourceIdentity<TFeatures extends TableFeatures, TData extends RowData, TSourceValue> = {
|
|
28
28
|
table: Table<TFeatures, TData>;
|
|
29
|
-
|
|
29
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
30
30
|
selector?: undefined;
|
|
31
|
-
children: ((state:
|
|
31
|
+
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren;
|
|
32
32
|
};
|
|
33
33
|
/**
|
|
34
|
-
* Subscribe to a projected value from a
|
|
34
|
+
* Subscribe to a projected value from a source (atom or store).
|
|
35
35
|
*/
|
|
36
|
-
type
|
|
36
|
+
type SubscribePropsWithSourceWithSelector<TFeatures extends TableFeatures, TData extends RowData, TSourceValue, TSelected> = {
|
|
37
37
|
table: Table<TFeatures, TData>;
|
|
38
|
-
|
|
39
|
-
selector: (state:
|
|
38
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
39
|
+
selector: (state: TSourceValue) => TSelected;
|
|
40
40
|
children: ((state: TSelected) => ComponentChildren) | ComponentChildren;
|
|
41
41
|
};
|
|
42
42
|
/**
|
|
43
|
-
* Subscribe to a single
|
|
43
|
+
* Subscribe to a single source — atom or store (identity or projected).
|
|
44
44
|
*/
|
|
45
|
-
type
|
|
46
|
-
type SubscribeProps<TFeatures extends TableFeatures, TData extends RowData, TSelected = unknown,
|
|
45
|
+
type SubscribePropsWithSource<TFeatures extends TableFeatures, TData extends RowData, TSourceValue, TSelected = TSourceValue> = SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue> | SubscribePropsWithSourceWithSelector<TFeatures, TData, TSourceValue, TSelected>;
|
|
46
|
+
type SubscribeProps<TFeatures extends TableFeatures, TData extends RowData, TSelected = unknown, TSourceValue = unknown> = SubscribePropsWithStore<TFeatures, TData, TSelected> | SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue> | SubscribePropsWithSourceWithSelector<TFeatures, TData, TSourceValue, TSelected>;
|
|
47
47
|
/**
|
|
48
48
|
* A Preact component that allows you to subscribe to the table state.
|
|
49
49
|
*
|
|
50
50
|
* For `table.Subscribe` from `useTable`, prefer that API — it uses overloads so
|
|
51
51
|
* JSX contextual typing works. This standalone component uses a union `props` type.
|
|
52
52
|
*/
|
|
53
|
-
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData,
|
|
54
|
-
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData,
|
|
53
|
+
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData, TSourceValue>(props: SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>): ComponentChildren;
|
|
54
|
+
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData, TSourceValue, TSelected>(props: SubscribePropsWithSourceWithSelector<TFeatures, TData, TSourceValue, TSelected>): ComponentChildren;
|
|
55
55
|
declare function Subscribe<TFeatures extends TableFeatures, TData extends RowData, TSelected>(props: SubscribePropsWithStore<TFeatures, TData, TSelected>): ComponentChildren;
|
|
56
56
|
//#endregion
|
|
57
|
-
export { Subscribe, SubscribeProps,
|
|
57
|
+
export { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore };
|
|
58
58
|
//# sourceMappingURL=Subscribe.d.ts.map
|
package/dist/Subscribe.js
CHANGED
|
@@ -2,7 +2,7 @@ import { shallow, useSelector } from "@tanstack/preact-store";
|
|
|
2
2
|
|
|
3
3
|
//#region src/Subscribe.ts
|
|
4
4
|
function Subscribe(props) {
|
|
5
|
-
const selected = useSelector("
|
|
5
|
+
const selected = useSelector("source" in props ? props.source : props.table.store, "source" in props ? props.selector ?? ((x) => x) : props.selector, { compare: shallow });
|
|
6
6
|
return typeof props.children === "function" ? props.children(selected) : props.children;
|
|
7
7
|
}
|
|
8
8
|
|
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 { Atom, ReadonlyAtom } from '@tanstack/preact-store'\nimport type {\n RowData,\n Table,\n TableFeatures,\n TableState,\n} from '@tanstack/table-core'\nimport type { ComponentChildren } from 'preact'\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 TData extends RowData,\n TSelected,\n> = {\n table: Table<TFeatures, TData>\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
|
|
1
|
+
{"version":3,"file":"Subscribe.js","names":[],"sources":["../src/Subscribe.ts"],"sourcesContent":["import { shallow, useSelector } from '@tanstack/preact-store'\nimport type { Atom, ReadonlyAtom } from '@tanstack/preact-store'\nimport type {\n RowData,\n Table,\n TableFeatures,\n TableState,\n} from '@tanstack/table-core'\nimport type { ComponentChildren } from 'preact'\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 TData extends RowData,\n TSelected,\n> = {\n table: Table<TFeatures, TData>\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<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n> = {\n table: Table<TFeatures, TData>\n source: Atom<TSourceValue> | ReadonlyAtom<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<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n TSelected,\n> = {\n table: Table<TFeatures, TData>\n source: Atom<TSourceValue> | ReadonlyAtom<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<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n TSelected = TSourceValue,\n> =\n | SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>\n | SubscribePropsWithSourceWithSelector<\n TFeatures,\n TData,\n TSourceValue,\n TSelected\n >\n\nexport type SubscribeProps<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = unknown,\n TSourceValue = unknown,\n> =\n | SubscribePropsWithStore<TFeatures, TData, TSelected>\n | SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>\n | SubscribePropsWithSourceWithSelector<\n TFeatures,\n TData,\n TSourceValue,\n TSelected\n >\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<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n>(\n props: SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>,\n): ComponentChildren\nexport function Subscribe<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSourceValue,\n TSelected,\n>(\n props: SubscribePropsWithSourceWithSelector<\n TFeatures,\n TData,\n TSourceValue,\n TSelected\n >,\n): ComponentChildren\nexport function Subscribe<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected,\n>(\n props: SubscribePropsWithStore<TFeatures, TData, TSelected>,\n): ComponentChildren\nexport function Subscribe<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected,\n TSourceValue,\n>(\n props: SubscribeProps<TFeatures, TData, TSelected, TSourceValue>,\n): ComponentChildren {\n const source = 'source' in props ? props.source : props.table.store\n const selectFn =\n 'source' in props ? (props.selector ?? ((x: unknown) => x)) : props.selector\n\n const selected = useSelector(\n 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":";;;AA+HA,SAAgB,UAMd,OACmB;CAKnB,MAAM,WAAW,YAJF,YAAY,QAAQ,MAAM,SAAS,MAAM,MAAM,OAE5D,YAAY,QAAS,MAAM,cAAc,MAAe,KAAM,MAAM,UAKpE,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,
|
|
2
|
+
import { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore } from "./Subscribe.cjs";
|
|
3
3
|
import { PreactTable, useTable } from "./useTable.cjs";
|
|
4
4
|
import { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnHelper, 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, AppColumnHelper, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, FlexRender, FlexRenderProps, PreactTable, Renderable, Subscribe, SubscribeProps,
|
|
6
|
+
export { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnHelper, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, FlexRender, FlexRenderProps, PreactTable, Renderable, Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, 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,
|
|
2
|
+
import { Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore } from "./Subscribe.js";
|
|
3
3
|
import { PreactTable, useTable } from "./useTable.js";
|
|
4
4
|
import { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnHelper, 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, AppColumnHelper, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, FlexRender, FlexRenderProps, PreactTable, Renderable, Subscribe, SubscribeProps,
|
|
6
|
+
export { AppCellComponent, AppCellContext, AppCellPropsWithSelector, AppCellPropsWithoutSelector, AppColumnHelper, AppHeaderComponent, AppHeaderContext, AppHeaderPropsWithSelector, AppHeaderPropsWithoutSelector, AppPreactTable, AppTableComponent, AppTablePropsWithSelector, AppTablePropsWithoutSelector, CreateTableHookOptions, FlexRender, FlexRenderProps, PreactTable, Renderable, Subscribe, SubscribeProps, SubscribePropsWithSource, SubscribePropsWithSourceIdentity, SubscribePropsWithSourceWithSelector, SubscribePropsWithStore, createTableHook, flexRender, useTable };
|
package/dist/useTable.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTable.cjs","names":["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 { 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 { Atom, ReadonlyAtom } from '@tanstack/preact-store'\nimport type { ComponentChildren } from 'preact'\nimport type { FlexRenderProps } from './FlexRender'\nimport type { SubscribePropsWithStore } 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 `
|
|
1
|
+
{"version":3,"file":"useTable.cjs","names":["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 { 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 { Atom, ReadonlyAtom } from '@tanstack/preact-store'\nimport type { ComponentChildren } from 'preact'\nimport type { FlexRenderProps } from './FlexRender'\nimport type { SubscribePropsWithStore } 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: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>\n selector?: undefined\n children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren\n }): ComponentChildren\n <TSourceValue, TSubSelected>(props: {\n source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>\n selector: (state: TSourceValue) => TSubSelected\n children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren\n }): ComponentChildren\n <TSubSelected>(\n props: Omit<\n SubscribePropsWithStore<TFeatures, TData, TSubSelected>,\n 'table'\n >,\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 columns: TableOptions<TFeatures, TData>['columns']\n data: TableOptions<TFeatures, TData>['data']\n }\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(tableOptions) as PreactTable<\n TFeatures,\n TData,\n TSelected\n >\n\n tableInstance.Subscribe = ((props: any) => {\n return Subscribe({\n ...props,\n table: tableInstance,\n })\n }) as PreactTable<TFeatures, TData, TSelected>['Subscribe']\n\n tableInstance.FlexRender = FlexRender\n\n return tableInstance\n })\n\n // sync table options on every render\n table.setOptions((prev) => ({\n ...prev,\n ...tableOptions,\n }))\n\n const selectorWithDataAndColumns = (state: TableState<TFeatures>) => ({\n columns: tableOptions.columns,\n data: tableOptions.data,\n ...selector(state),\n })\n\n const state = useSelector(table.store, selectorWithDataAndColumns, {\n compare: shallow,\n })\n\n return useMemo(\n () => ({\n ...table,\n state,\n }),\n [state, table],\n ) as PreactTable<TFeatures, TData, TSelected>\n}\n"],"mappings":";;;;;;;AAoFA,SAAgB,SAKd,cACA,kBACG,EAAE,GACqC;CAC1C,MAAM,CAAC,0CAAwB;EAC7B,MAAM,yDAA+B,aAAa;AAMlD,gBAAc,cAAc,UAAe;AACzC,UAAOA,4BAAU;IACf,GAAG;IACH,OAAO;IACR,CAAC;;AAGJ,gBAAc,aAAaC;AAE3B,SAAO;GACP;AAGF,OAAM,YAAY,UAAU;EAC1B,GAAG;EACH,GAAG;EACJ,EAAE;CAEH,MAAM,8BAA8B,WAAkC;EACpE,SAAS,aAAa;EACtB,MAAM,aAAa;EACnB,GAAG,SAAS,MAAM;EACnB;CAED,MAAM,gDAAoB,MAAM,OAAO,4BAA4B,EACjE,SAASC,gCACV,CAAC;AAEF,yCACS;EACL,GAAG;EACH;EACD,GACD,CAAC,OAAO,MAAM,CACf"}
|
package/dist/useTable.d.cts
CHANGED
|
@@ -9,7 +9,8 @@ type PreactTable<TFeatures extends TableFeatures, TData extends RowData, TSelect
|
|
|
9
9
|
/**
|
|
10
10
|
* A Preact HOC (Higher Order Component) that allows you to subscribe to the table state.
|
|
11
11
|
*
|
|
12
|
-
* Pass `
|
|
12
|
+
* Pass `source` to subscribe to a single atom or store (e.g. `table.atoms.rowSelection`
|
|
13
|
+
* or `table.optionsStore`) instead of the full `table.store`.
|
|
13
14
|
*
|
|
14
15
|
* @example
|
|
15
16
|
* <table.Subscribe selector={(state) => ({ rowSelection: state.rowSelection })}>
|
|
@@ -19,28 +20,28 @@ type PreactTable<TFeatures extends TableFeatures, TData extends RowData, TSelect
|
|
|
19
20
|
* </table.Subscribe>
|
|
20
21
|
*
|
|
21
22
|
* @example
|
|
22
|
-
* <table.Subscribe
|
|
23
|
+
* <table.Subscribe source={table.atoms.rowSelection}>
|
|
23
24
|
* {(rowSelection) => <div>...</div>}
|
|
24
25
|
* </table.Subscribe>
|
|
25
26
|
*
|
|
26
27
|
* @example
|
|
27
|
-
* <table.Subscribe
|
|
28
|
+
* <table.Subscribe source={table.atoms.rowSelection} selector={(s) => s?.[row.id]}>
|
|
28
29
|
* {() => <tr key={row.id}>...</tr>}
|
|
29
30
|
* </table.Subscribe>
|
|
30
31
|
*/
|
|
31
32
|
/**
|
|
32
|
-
* Overloads (
|
|
33
|
-
*
|
|
33
|
+
* Overloads (source first, then store) so JSX contextual typing works for both modes.
|
|
34
|
+
* Source without `selector` is separate so children infer `TSourceValue` (identity projection).
|
|
34
35
|
*/
|
|
35
36
|
Subscribe: {
|
|
36
|
-
<
|
|
37
|
-
|
|
37
|
+
<TSourceValue>(props: {
|
|
38
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
38
39
|
selector?: undefined;
|
|
39
|
-
children: ((state:
|
|
40
|
+
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren;
|
|
40
41
|
}): ComponentChildren;
|
|
41
|
-
<
|
|
42
|
-
|
|
43
|
-
selector: (state:
|
|
42
|
+
<TSourceValue, TSubSelected>(props: {
|
|
43
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
44
|
+
selector: (state: TSourceValue) => TSubSelected;
|
|
44
45
|
children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren;
|
|
45
46
|
}): ComponentChildren;
|
|
46
47
|
<TSubSelected>(props: Omit<SubscribePropsWithStore<TFeatures, TData, TSubSelected>, 'table'>): ComponentChildren;
|
package/dist/useTable.d.ts
CHANGED
|
@@ -9,7 +9,8 @@ type PreactTable<TFeatures extends TableFeatures, TData extends RowData, TSelect
|
|
|
9
9
|
/**
|
|
10
10
|
* A Preact HOC (Higher Order Component) that allows you to subscribe to the table state.
|
|
11
11
|
*
|
|
12
|
-
* Pass `
|
|
12
|
+
* Pass `source` to subscribe to a single atom or store (e.g. `table.atoms.rowSelection`
|
|
13
|
+
* or `table.optionsStore`) instead of the full `table.store`.
|
|
13
14
|
*
|
|
14
15
|
* @example
|
|
15
16
|
* <table.Subscribe selector={(state) => ({ rowSelection: state.rowSelection })}>
|
|
@@ -19,28 +20,28 @@ type PreactTable<TFeatures extends TableFeatures, TData extends RowData, TSelect
|
|
|
19
20
|
* </table.Subscribe>
|
|
20
21
|
*
|
|
21
22
|
* @example
|
|
22
|
-
* <table.Subscribe
|
|
23
|
+
* <table.Subscribe source={table.atoms.rowSelection}>
|
|
23
24
|
* {(rowSelection) => <div>...</div>}
|
|
24
25
|
* </table.Subscribe>
|
|
25
26
|
*
|
|
26
27
|
* @example
|
|
27
|
-
* <table.Subscribe
|
|
28
|
+
* <table.Subscribe source={table.atoms.rowSelection} selector={(s) => s?.[row.id]}>
|
|
28
29
|
* {() => <tr key={row.id}>...</tr>}
|
|
29
30
|
* </table.Subscribe>
|
|
30
31
|
*/
|
|
31
32
|
/**
|
|
32
|
-
* Overloads (
|
|
33
|
-
*
|
|
33
|
+
* Overloads (source first, then store) so JSX contextual typing works for both modes.
|
|
34
|
+
* Source without `selector` is separate so children infer `TSourceValue` (identity projection).
|
|
34
35
|
*/
|
|
35
36
|
Subscribe: {
|
|
36
|
-
<
|
|
37
|
-
|
|
37
|
+
<TSourceValue>(props: {
|
|
38
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
38
39
|
selector?: undefined;
|
|
39
|
-
children: ((state:
|
|
40
|
+
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren;
|
|
40
41
|
}): ComponentChildren;
|
|
41
|
-
<
|
|
42
|
-
|
|
43
|
-
selector: (state:
|
|
42
|
+
<TSourceValue, TSubSelected>(props: {
|
|
43
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>;
|
|
44
|
+
selector: (state: TSourceValue) => TSubSelected;
|
|
44
45
|
children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren;
|
|
45
46
|
}): ComponentChildren;
|
|
46
47
|
<TSubSelected>(props: Omit<SubscribePropsWithStore<TFeatures, TData, TSubSelected>, 'table'>): ComponentChildren;
|
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 { 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 { Atom, ReadonlyAtom } from '@tanstack/preact-store'\nimport type { ComponentChildren } from 'preact'\nimport type { FlexRenderProps } from './FlexRender'\nimport type { SubscribePropsWithStore } 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 `
|
|
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 { 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 { Atom, ReadonlyAtom } from '@tanstack/preact-store'\nimport type { ComponentChildren } from 'preact'\nimport type { FlexRenderProps } from './FlexRender'\nimport type { SubscribePropsWithStore } 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: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>\n selector?: undefined\n children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren\n }): ComponentChildren\n <TSourceValue, TSubSelected>(props: {\n source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>\n selector: (state: TSourceValue) => TSubSelected\n children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren\n }): ComponentChildren\n <TSubSelected>(\n props: Omit<\n SubscribePropsWithStore<TFeatures, TData, TSubSelected>,\n 'table'\n >,\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 columns: TableOptions<TFeatures, TData>['columns']\n data: TableOptions<TFeatures, TData>['data']\n }\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(tableOptions) as PreactTable<\n TFeatures,\n TData,\n TSelected\n >\n\n tableInstance.Subscribe = ((props: any) => {\n return Subscribe({\n ...props,\n table: tableInstance,\n })\n }) as PreactTable<TFeatures, TData, TSelected>['Subscribe']\n\n tableInstance.FlexRender = FlexRender\n\n return tableInstance\n })\n\n // sync table options on every render\n table.setOptions((prev) => ({\n ...prev,\n ...tableOptions,\n }))\n\n const selectorWithDataAndColumns = (state: TableState<TFeatures>) => ({\n columns: tableOptions.columns,\n data: tableOptions.data,\n ...selector(state),\n })\n\n const state = useSelector(table.store, selectorWithDataAndColumns, {\n compare: shallow,\n })\n\n return useMemo(\n () => ({\n ...table,\n state,\n }),\n [state, table],\n ) as PreactTable<TFeatures, TData, TSelected>\n}\n"],"mappings":";;;;;;;AAoFA,SAAgB,SAKd,cACA,kBACG,EAAE,GACqC;CAC1C,MAAM,CAAC,SAAS,eAAe;EAC7B,MAAM,gBAAgB,eAAe,aAAa;AAMlD,gBAAc,cAAc,UAAe;AACzC,UAAO,UAAU;IACf,GAAG;IACH,OAAO;IACR,CAAC;;AAGJ,gBAAc,aAAa;AAE3B,SAAO;GACP;AAGF,OAAM,YAAY,UAAU;EAC1B,GAAG;EACH,GAAG;EACJ,EAAE;CAEH,MAAM,8BAA8B,WAAkC;EACpE,SAAS,aAAa;EACtB,MAAM,aAAa;EACnB,GAAG,SAAS,MAAM;EACnB;CAED,MAAM,QAAQ,YAAY,MAAM,OAAO,4BAA4B,EACjE,SAAS,SACV,CAAC;AAEF,QAAO,eACE;EACL,GAAG;EACH;EACD,GACD,CAAC,OAAO,MAAM,CACf"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/preact-table",
|
|
3
|
-
"version": "9.0.0-alpha.
|
|
3
|
+
"version": "9.0.0-alpha.36",
|
|
4
4
|
"description": "Headless UI for building powerful tables & datagrids for Preact.",
|
|
5
5
|
"author": "Tanner Linsley",
|
|
6
6
|
"license": "MIT",
|
|
@@ -29,6 +29,10 @@
|
|
|
29
29
|
"import": "./dist/index.js",
|
|
30
30
|
"require": "./dist/index.cjs"
|
|
31
31
|
},
|
|
32
|
+
"./flex-render": {
|
|
33
|
+
"import": "./dist/flex-render.js",
|
|
34
|
+
"require": "./dist/flex-render.cjs"
|
|
35
|
+
},
|
|
32
36
|
"./static-functions": {
|
|
33
37
|
"import": "./dist/static-functions.js",
|
|
34
38
|
"require": "./dist/static-functions.cjs"
|
|
@@ -45,7 +49,7 @@
|
|
|
45
49
|
],
|
|
46
50
|
"dependencies": {
|
|
47
51
|
"@tanstack/preact-store": "^0.13.0",
|
|
48
|
-
"@tanstack/table-core": "9.0.0-alpha.
|
|
52
|
+
"@tanstack/table-core": "9.0.0-alpha.36"
|
|
49
53
|
},
|
|
50
54
|
"devDependencies": {
|
|
51
55
|
"@preact/preset-vite": "^2.10.5",
|
package/src/Subscribe.ts
CHANGED
|
@@ -30,57 +30,67 @@ export type SubscribePropsWithStore<
|
|
|
30
30
|
}
|
|
31
31
|
|
|
32
32
|
/**
|
|
33
|
-
* Subscribe to the full value of a
|
|
34
|
-
* Omitting `selector` is equivalent to the identity
|
|
35
|
-
* `
|
|
33
|
+
* Subscribe to the full value of a source (e.g. `table.atoms.rowSelection` or
|
|
34
|
+
* `table.optionsStore`). Omitting `selector` is equivalent to the identity
|
|
35
|
+
* selector — children receive `TSourceValue`.
|
|
36
36
|
*/
|
|
37
|
-
export type
|
|
37
|
+
export type SubscribePropsWithSourceIdentity<
|
|
38
38
|
TFeatures extends TableFeatures,
|
|
39
39
|
TData extends RowData,
|
|
40
|
-
|
|
40
|
+
TSourceValue,
|
|
41
41
|
> = {
|
|
42
42
|
table: Table<TFeatures, TData>
|
|
43
|
-
|
|
43
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>
|
|
44
44
|
selector?: undefined
|
|
45
|
-
children: ((state:
|
|
45
|
+
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren
|
|
46
46
|
}
|
|
47
47
|
|
|
48
48
|
/**
|
|
49
|
-
* Subscribe to a projected value from a
|
|
49
|
+
* Subscribe to a projected value from a source (atom or store).
|
|
50
50
|
*/
|
|
51
|
-
export type
|
|
51
|
+
export type SubscribePropsWithSourceWithSelector<
|
|
52
52
|
TFeatures extends TableFeatures,
|
|
53
53
|
TData extends RowData,
|
|
54
|
-
|
|
54
|
+
TSourceValue,
|
|
55
55
|
TSelected,
|
|
56
56
|
> = {
|
|
57
57
|
table: Table<TFeatures, TData>
|
|
58
|
-
|
|
59
|
-
selector: (state:
|
|
58
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>
|
|
59
|
+
selector: (state: TSourceValue) => TSelected
|
|
60
60
|
children: ((state: TSelected) => ComponentChildren) | ComponentChildren
|
|
61
61
|
}
|
|
62
62
|
|
|
63
63
|
/**
|
|
64
|
-
* Subscribe to a single
|
|
64
|
+
* Subscribe to a single source — atom or store (identity or projected).
|
|
65
65
|
*/
|
|
66
|
-
export type
|
|
66
|
+
export type SubscribePropsWithSource<
|
|
67
67
|
TFeatures extends TableFeatures,
|
|
68
68
|
TData extends RowData,
|
|
69
|
-
|
|
70
|
-
TSelected =
|
|
69
|
+
TSourceValue,
|
|
70
|
+
TSelected = TSourceValue,
|
|
71
71
|
> =
|
|
72
|
-
|
|
|
73
|
-
|
|
|
72
|
+
| SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>
|
|
73
|
+
| SubscribePropsWithSourceWithSelector<
|
|
74
|
+
TFeatures,
|
|
75
|
+
TData,
|
|
76
|
+
TSourceValue,
|
|
77
|
+
TSelected
|
|
78
|
+
>
|
|
74
79
|
|
|
75
80
|
export type SubscribeProps<
|
|
76
81
|
TFeatures extends TableFeatures,
|
|
77
82
|
TData extends RowData,
|
|
78
83
|
TSelected = unknown,
|
|
79
|
-
|
|
84
|
+
TSourceValue = unknown,
|
|
80
85
|
> =
|
|
81
86
|
| SubscribePropsWithStore<TFeatures, TData, TSelected>
|
|
82
|
-
|
|
|
83
|
-
|
|
|
87
|
+
| SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>
|
|
88
|
+
| SubscribePropsWithSourceWithSelector<
|
|
89
|
+
TFeatures,
|
|
90
|
+
TData,
|
|
91
|
+
TSourceValue,
|
|
92
|
+
TSelected
|
|
93
|
+
>
|
|
84
94
|
|
|
85
95
|
/**
|
|
86
96
|
* A Preact component that allows you to subscribe to the table state.
|
|
@@ -91,20 +101,20 @@ export type SubscribeProps<
|
|
|
91
101
|
export function Subscribe<
|
|
92
102
|
TFeatures extends TableFeatures,
|
|
93
103
|
TData extends RowData,
|
|
94
|
-
|
|
104
|
+
TSourceValue,
|
|
95
105
|
>(
|
|
96
|
-
props:
|
|
106
|
+
props: SubscribePropsWithSourceIdentity<TFeatures, TData, TSourceValue>,
|
|
97
107
|
): ComponentChildren
|
|
98
108
|
export function Subscribe<
|
|
99
109
|
TFeatures extends TableFeatures,
|
|
100
110
|
TData extends RowData,
|
|
101
|
-
|
|
111
|
+
TSourceValue,
|
|
102
112
|
TSelected,
|
|
103
113
|
>(
|
|
104
|
-
props:
|
|
114
|
+
props: SubscribePropsWithSourceWithSelector<
|
|
105
115
|
TFeatures,
|
|
106
116
|
TData,
|
|
107
|
-
|
|
117
|
+
TSourceValue,
|
|
108
118
|
TSelected
|
|
109
119
|
>,
|
|
110
120
|
): ComponentChildren
|
|
@@ -119,13 +129,13 @@ export function Subscribe<
|
|
|
119
129
|
TFeatures extends TableFeatures,
|
|
120
130
|
TData extends RowData,
|
|
121
131
|
TSelected,
|
|
122
|
-
|
|
132
|
+
TSourceValue,
|
|
123
133
|
>(
|
|
124
|
-
props: SubscribeProps<TFeatures, TData, TSelected,
|
|
134
|
+
props: SubscribeProps<TFeatures, TData, TSelected, TSourceValue>,
|
|
125
135
|
): ComponentChildren {
|
|
126
|
-
const source = '
|
|
136
|
+
const source = 'source' in props ? props.source : props.table.store
|
|
127
137
|
const selectFn =
|
|
128
|
-
'
|
|
138
|
+
'source' in props ? (props.selector ?? ((x: unknown) => x)) : props.selector
|
|
129
139
|
|
|
130
140
|
const selected = useSelector(
|
|
131
141
|
source as never,
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './FlexRender'
|
package/src/useTable.ts
CHANGED
|
@@ -24,7 +24,8 @@ export type PreactTable<
|
|
|
24
24
|
/**
|
|
25
25
|
* A Preact HOC (Higher Order Component) that allows you to subscribe to the table state.
|
|
26
26
|
*
|
|
27
|
-
* Pass `
|
|
27
|
+
* Pass `source` to subscribe to a single atom or store (e.g. `table.atoms.rowSelection`
|
|
28
|
+
* or `table.optionsStore`) instead of the full `table.store`.
|
|
28
29
|
*
|
|
29
30
|
* @example
|
|
30
31
|
* <table.Subscribe selector={(state) => ({ rowSelection: state.rowSelection })}>
|
|
@@ -34,28 +35,28 @@ export type PreactTable<
|
|
|
34
35
|
* </table.Subscribe>
|
|
35
36
|
*
|
|
36
37
|
* @example
|
|
37
|
-
* <table.Subscribe
|
|
38
|
+
* <table.Subscribe source={table.atoms.rowSelection}>
|
|
38
39
|
* {(rowSelection) => <div>...</div>}
|
|
39
40
|
* </table.Subscribe>
|
|
40
41
|
*
|
|
41
42
|
* @example
|
|
42
|
-
* <table.Subscribe
|
|
43
|
+
* <table.Subscribe source={table.atoms.rowSelection} selector={(s) => s?.[row.id]}>
|
|
43
44
|
* {() => <tr key={row.id}>...</tr>}
|
|
44
45
|
* </table.Subscribe>
|
|
45
46
|
*/
|
|
46
47
|
/**
|
|
47
|
-
* Overloads (
|
|
48
|
-
*
|
|
48
|
+
* Overloads (source first, then store) so JSX contextual typing works for both modes.
|
|
49
|
+
* Source without `selector` is separate so children infer `TSourceValue` (identity projection).
|
|
49
50
|
*/
|
|
50
51
|
Subscribe: {
|
|
51
|
-
<
|
|
52
|
-
|
|
52
|
+
<TSourceValue>(props: {
|
|
53
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>
|
|
53
54
|
selector?: undefined
|
|
54
|
-
children: ((state:
|
|
55
|
+
children: ((state: TSourceValue) => ComponentChildren) | ComponentChildren
|
|
55
56
|
}): ComponentChildren
|
|
56
|
-
<
|
|
57
|
-
|
|
58
|
-
selector: (state:
|
|
57
|
+
<TSourceValue, TSubSelected>(props: {
|
|
58
|
+
source: Atom<TSourceValue> | ReadonlyAtom<TSourceValue>
|
|
59
|
+
selector: (state: TSourceValue) => TSubSelected
|
|
59
60
|
children: ((state: TSubSelected) => ComponentChildren) | ComponentChildren
|
|
60
61
|
}): ComponentChildren
|
|
61
62
|
<TSubSelected>(
|