@tanstack/vue-table 9.0.0-beta.3 → 9.0.0-beta.5

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.
@@ -3,7 +3,6 @@ import { mergeProxy } from "./merge-proxy.js";
3
3
  import { useTable } from "./useTable.js";
4
4
  import { defineComponent, h, inject, provide } from "vue";
5
5
  import { createColumnHelper } from "@tanstack/table-core";
6
- import { useSelector } from "@tanstack/vue-store";
7
6
 
8
7
  //#region src/createTableHook.ts
9
8
  const AppFlexRender = defineComponent({
@@ -101,111 +100,72 @@ function createTableHook({ tableComponents, cellComponents, headerComponents, ..
101
100
  return () => h(AppFlexRender, { footer: header });
102
101
  }
103
102
  });
104
- function useAppTable(tableOptions, selector) {
105
- const table = useTable(mergeProxy(defaultTableOptions, tableOptions), selector);
103
+ function useAppTable(tableOptions) {
104
+ const table = useTable(mergeProxy(defaultTableOptions, tableOptions));
106
105
  const AppTable = defineComponent({
107
106
  name: "AppTable",
108
- props: { selector: {
109
- type: Function,
110
- default: void 0
111
- } },
112
- setup(props, { slots }) {
107
+ setup(_, { slots }) {
113
108
  provide(TableContext, table);
114
- const selected = props.selector ? useSelector(table.store, props.selector) : void 0;
115
109
  return () => {
116
- var _slots$default2;
117
- if (!props.selector) {
118
- var _slots$default;
119
- return (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
120
- }
121
- return (_slots$default2 = slots.default) === null || _slots$default2 === void 0 ? void 0 : _slots$default2.call(slots, { state: selected === null || selected === void 0 ? void 0 : selected.value });
110
+ var _slots$default;
111
+ return (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
122
112
  };
123
113
  }
124
114
  });
125
115
  const AppCell = defineComponent({
126
116
  name: "AppCell",
127
- props: {
128
- cell: {
129
- type: Object,
130
- required: true
131
- },
132
- selector: {
133
- type: Function,
134
- default: void 0
135
- }
136
- },
117
+ props: { cell: {
118
+ type: Object,
119
+ required: true
120
+ } },
137
121
  setup(props, { slots }) {
138
122
  const cell = props.cell;
139
123
  provide(CellContext, cell);
140
- const selected = props.selector ? useSelector(table.store, props.selector) : void 0;
141
124
  const extendedCell = Object.assign(cell, {
142
125
  FlexRender: CellFlexRender,
143
126
  ...cellComponents ?? {}
144
127
  });
145
128
  return () => {
146
- var _slots$default3;
147
- return (_slots$default3 = slots.default) === null || _slots$default3 === void 0 ? void 0 : _slots$default3.call(slots, props.selector ? {
148
- cell: extendedCell,
149
- state: selected === null || selected === void 0 ? void 0 : selected.value
150
- } : { cell: extendedCell });
129
+ var _slots$default2;
130
+ return (_slots$default2 = slots.default) === null || _slots$default2 === void 0 ? void 0 : _slots$default2.call(slots, { cell: extendedCell });
151
131
  };
152
132
  }
153
133
  });
154
134
  const AppHeader = defineComponent({
155
135
  name: "AppHeader",
156
- props: {
157
- header: {
158
- type: Object,
159
- required: true
160
- },
161
- selector: {
162
- type: Function,
163
- default: void 0
164
- }
165
- },
136
+ props: { header: {
137
+ type: Object,
138
+ required: true
139
+ } },
166
140
  setup(props, { slots }) {
167
141
  const header = props.header;
168
142
  provide(HeaderContext, header);
169
- const selected = props.selector ? useSelector(table.store, props.selector) : void 0;
170
143
  const extendedHeader = Object.assign(header, {
171
144
  FlexRender: HeaderFlexRender,
172
145
  ...headerComponents ?? {}
173
146
  });
174
147
  return () => {
175
- var _slots$default4;
176
- return (_slots$default4 = slots.default) === null || _slots$default4 === void 0 ? void 0 : _slots$default4.call(slots, props.selector ? {
177
- header: extendedHeader,
178
- state: selected === null || selected === void 0 ? void 0 : selected.value
179
- } : { header: extendedHeader });
148
+ var _slots$default3;
149
+ return (_slots$default3 = slots.default) === null || _slots$default3 === void 0 ? void 0 : _slots$default3.call(slots, { header: extendedHeader });
180
150
  };
181
151
  }
182
152
  });
183
153
  const AppFooter = defineComponent({
184
154
  name: "AppFooter",
185
- props: {
186
- header: {
187
- type: Object,
188
- required: true
189
- },
190
- selector: {
191
- type: Function,
192
- default: void 0
193
- }
194
- },
155
+ props: { header: {
156
+ type: Object,
157
+ required: true
158
+ } },
195
159
  setup(props, { slots }) {
196
160
  const header = props.header;
197
161
  provide(HeaderContext, header);
198
- const selected = props.selector ? useSelector(table.store, props.selector) : void 0;
199
162
  const extendedHeader = Object.assign(header, {
200
163
  FlexRender: FooterFlexRender,
201
164
  ...headerComponents ?? {}
202
165
  });
203
166
  return () => {
204
- var _slots$default5;
205
- return (_slots$default5 = slots.default) === null || _slots$default5 === void 0 ? void 0 : _slots$default5.call(slots, props.selector ? {
206
- header: extendedHeader,
207
- state: selected === null || selected === void 0 ? void 0 : selected.value
208
- } : { header: extendedHeader });
167
+ var _slots$default4;
168
+ return (_slots$default4 = slots.default) === null || _slots$default4 === void 0 ? void 0 : _slots$default4.call(slots, { header: extendedHeader });
209
169
  };
210
170
  }
211
171
  });
@@ -1 +1 @@
1
- {"version":3,"file":"createTableHook.js","names":["coreCreateColumnHelper"],"sources":["../src/createTableHook.ts"],"sourcesContent":["import { createColumnHelper as coreCreateColumnHelper } from '@tanstack/table-core'\nimport { useSelector } from '@tanstack/vue-store'\nimport { defineComponent, h, inject, provide } from 'vue'\nimport { FlexRender } from './FlexRender'\nimport { mergeProxy } from './merge-proxy'\nimport { useTable } from './useTable'\nimport type { TableOptionsWithReactiveData, VueTable } from './useTable'\nimport type { Component, InjectionKey, PropType, VNodeChild } from 'vue'\nimport type {\n AccessorFn,\n AccessorFnColumnDef,\n AccessorKeyColumnDef,\n Cell,\n CellContext,\n CellData,\n Column,\n ColumnDef,\n DeepKeys,\n DeepValue,\n DisplayColumnDef,\n GroupColumnDef,\n Header,\n IdentifiedColumnDef,\n NoInfer,\n Row,\n RowData,\n Table,\n TableFeatures,\n TableState,\n} from '@tanstack/table-core'\n\nexport type ComponentType<T extends Record<string, any>> = Component<T>\n\nexport type AppCellContext<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData,\n TCellComponents extends Record<string, ComponentType<any>>,\n> = {\n cell: Cell<TFeatures, TData, TValue> &\n TCellComponents & { FlexRender: Component }\n column: Column<TFeatures, TData, TValue>\n getValue: CellContext<TFeatures, TData, TValue>['getValue']\n renderValue: CellContext<TFeatures, TData, TValue>['renderValue']\n row: Row<TFeatures, TData>\n table: Table<TFeatures, TData>\n}\n\nexport type AppHeaderContext<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = {\n column: Column<TFeatures, TData, TValue>\n header: Header<TFeatures, TData, TValue> &\n THeaderComponents & { FlexRender: Component }\n table: Table<TFeatures, TData>\n}\n\nexport type AppColumnDefTemplate<TProps extends object> =\n | string\n | ((props: TProps) => any)\n\nexport type AppColumnDefBase<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = Omit<\n IdentifiedColumnDef<TFeatures, TData, TValue>,\n 'cell' | 'header' | 'footer'\n> & {\n cell?: AppColumnDefTemplate<\n AppCellContext<TFeatures, TData, TValue, TCellComponents>\n >\n header?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, TValue, THeaderComponents>\n >\n footer?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, TValue, THeaderComponents>\n >\n}\n\nexport type AppDisplayColumnDef<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = Omit<\n DisplayColumnDef<TFeatures, TData, unknown>,\n 'cell' | 'header' | 'footer'\n> & {\n cell?: AppColumnDefTemplate<\n AppCellContext<TFeatures, TData, unknown, TCellComponents>\n >\n header?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, unknown, THeaderComponents>\n >\n footer?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, unknown, THeaderComponents>\n >\n}\n\nexport type AppGroupColumnDef<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = Omit<\n GroupColumnDef<TFeatures, TData, unknown>,\n 'cell' | 'header' | 'footer' | 'columns'\n> & {\n cell?: AppColumnDefTemplate<\n AppCellContext<TFeatures, TData, unknown, TCellComponents>\n >\n header?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, unknown, THeaderComponents>\n >\n footer?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, unknown, THeaderComponents>\n >\n columns?: Array<ColumnDef<TFeatures, TData, unknown>>\n}\n\nexport type AppColumnHelper<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = {\n accessor: <\n TAccessor extends AccessorFn<TData> | DeepKeys<TData>,\n TValue extends TAccessor extends AccessorFn<TData, infer TReturn>\n ? TReturn\n : TAccessor extends DeepKeys<TData>\n ? DeepValue<TData, TAccessor>\n : never,\n >(\n accessor: TAccessor,\n column: TAccessor extends AccessorFn<TData>\n ? AppColumnDefBase<\n TFeatures,\n TData,\n TValue,\n TCellComponents,\n THeaderComponents\n > & { id: string }\n : AppColumnDefBase<\n TFeatures,\n TData,\n TValue,\n TCellComponents,\n THeaderComponents\n >,\n ) => TAccessor extends AccessorFn<TData>\n ? AccessorFnColumnDef<TFeatures, TData, TValue>\n : AccessorKeyColumnDef<TFeatures, TData, TValue>\n columns: <TColumns extends ReadonlyArray<ColumnDef<TFeatures, TData, any>>>(\n columns: [...TColumns],\n ) => Array<ColumnDef<TFeatures, TData, any>> & [...TColumns]\n display: (\n column: AppDisplayColumnDef<\n TFeatures,\n TData,\n TCellComponents,\n THeaderComponents\n >,\n ) => DisplayColumnDef<TFeatures, TData, unknown>\n group: (\n column: AppGroupColumnDef<\n TFeatures,\n TData,\n TCellComponents,\n THeaderComponents\n >,\n ) => GroupColumnDef<TFeatures, TData, unknown>\n}\n\nexport type CreateTableHookOptions<\n TFeatures extends TableFeatures,\n TTableComponents extends Record<string, ComponentType<any>>,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = Omit<\n TableOptionsWithReactiveData<TFeatures, any>,\n 'columns' | 'data' | 'store' | 'state' | 'initialState'\n> & {\n tableComponents?: TTableComponents\n cellComponents?: TCellComponents\n headerComponents?: THeaderComponents\n}\n\nexport interface AppTableProps<\n TFeatures extends TableFeatures,\n TSelected = unknown,\n> {\n selector?: (state: TableState<TFeatures>) => TSelected\n}\n\nexport interface AppCellProps<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData = CellData,\n TSelected = unknown,\n> {\n cell: Cell<TFeatures, TData, TValue>\n selector?: (state: TableState<TFeatures>) => TSelected\n}\n\nexport interface AppHeaderProps<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData = CellData,\n TSelected = unknown,\n> {\n header: Header<TFeatures, TData, TValue>\n selector?: (state: TableState<TFeatures>) => TSelected\n}\n\nexport type AppVueTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected,\n TTableComponents extends Record<string, ComponentType<any>>,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = VueTable<TFeatures, TData, TSelected> &\n NoInfer<TTableComponents> & {\n AppTable: Component<AppTableProps<TFeatures>>\n AppCell: Component<AppCellProps<TFeatures, TData>>\n AppHeader: Component<AppHeaderProps<TFeatures, TData>>\n AppFooter: Component<AppHeaderProps<TFeatures, TData>>\n FlexRender: typeof AppFlexRender\n }\n\nexport const AppFlexRender = defineComponent({\n name: 'TableFlexRender',\n props: {\n cell: {\n type: Object as PropType<Cell<any, any, any>>,\n default: undefined,\n },\n header: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n footer: {\n type: Object as PropType<Header<any, any, any>>,\n default: undefined,\n },\n },\n setup(props) {\n return () => {\n if (props.cell) {\n return h(FlexRender, {\n render: props.cell.column.columnDef.cell,\n props: props.cell.getContext(),\n })\n }\n\n if (props.header) {\n return h(FlexRender, {\n render: props.header.column.columnDef.header,\n props: props.header.getContext(),\n })\n }\n\n if (props.footer) {\n return h(FlexRender, {\n render: props.footer.column.columnDef.footer,\n props: props.footer.getContext(),\n })\n }\n\n return null\n }\n },\n})\n\n/**\n * Creates app-scoped Vue table helpers with features, row models, and\n * renderable component maps pre-bound.\n *\n * Use this when an app or design system wants typed `useAppTable`, a pre-bound\n * column helper, and context helpers for table, cell, and header components.\n *\n * @example\n * ```ts\n * const { useAppTable, createAppColumnHelper } = createTableHook({\n * features,\n * rowModels: {},\n * tableComponents: {},\n * cellComponents: {},\n * headerComponents: {},\n * })\n * ```\n */\nexport function createTableHook<\n TFeatures extends TableFeatures,\n const TTableComponents extends Record<string, ComponentType<any>>,\n const TCellComponents extends Record<string, ComponentType<any>>,\n const THeaderComponents extends Record<string, ComponentType<any>>,\n>({\n tableComponents,\n cellComponents,\n headerComponents,\n ...defaultTableOptions\n}: CreateTableHookOptions<\n TFeatures,\n TTableComponents,\n TCellComponents,\n THeaderComponents\n>) {\n const TableContext = Symbol('TableContext') as InjectionKey<\n VueTable<TFeatures, any, any>\n >\n const CellContext = Symbol('CellContext') as InjectionKey<\n Cell<TFeatures, any, any>\n >\n const HeaderContext = Symbol('HeaderContext') as InjectionKey<\n Header<TFeatures, any, any>\n >\n\n function createAppColumnHelper<TData extends RowData>(): AppColumnHelper<\n TFeatures,\n TData,\n TCellComponents,\n THeaderComponents\n > {\n return coreCreateColumnHelper<TFeatures, TData>() as AppColumnHelper<\n TFeatures,\n TData,\n TCellComponents,\n THeaderComponents\n >\n }\n\n function useTableContext<TData extends RowData = RowData>(): VueTable<\n TFeatures,\n TData\n > {\n const table = inject(TableContext)\n\n if (!table) {\n throw new Error(\n '`useTableContext` must be used within an `AppTable` component. ' +\n 'Make sure your component is wrapped with `<table.AppTable>...</table.AppTable>`.',\n )\n }\n\n return table as VueTable<TFeatures, TData>\n }\n\n function useCellContext<TValue extends CellData = CellData>(): Cell<\n TFeatures,\n any,\n TValue\n > {\n const cell = inject(CellContext)\n\n if (!cell) {\n throw new Error(\n '`useCellContext` must be used within an `AppCell` component. ' +\n 'Make sure your component is wrapped with `<table.AppCell :cell=\"cell\">...</table.AppCell>`.',\n )\n }\n\n return cell as Cell<TFeatures, any, TValue>\n }\n\n function useHeaderContext<TValue extends CellData = CellData>(): Header<\n TFeatures,\n any,\n TValue\n > {\n const header = inject(HeaderContext)\n\n if (!header) {\n throw new Error(\n '`useHeaderContext` must be used within an `AppHeader` or `AppFooter` component.',\n )\n }\n\n return header as Header<TFeatures, any, TValue>\n }\n\n const CellFlexRender = defineComponent({\n name: 'AppCellFlexRender',\n setup() {\n const cell = useCellContext()\n return () => h(AppFlexRender, { cell })\n },\n })\n\n const HeaderFlexRender = defineComponent({\n name: 'AppHeaderFlexRender',\n setup() {\n const header = useHeaderContext()\n return () => h(AppFlexRender, { header })\n },\n })\n\n const FooterFlexRender = defineComponent({\n name: 'AppFooterFlexRender',\n setup() {\n const header = useHeaderContext()\n return () => h(AppFlexRender, { footer: header })\n },\n })\n\n function useAppTable<\n TData extends RowData,\n TSelected = TableState<TFeatures>,\n >(\n tableOptions: Omit<\n TableOptionsWithReactiveData<TFeatures, TData>,\n 'features' | 'rowModels'\n >,\n selector?: (state: TableState<TFeatures>) => TSelected,\n ): AppVueTable<\n TFeatures,\n TData,\n TSelected,\n TTableComponents,\n TCellComponents,\n THeaderComponents\n > {\n const mergedOptions = mergeProxy(\n defaultTableOptions,\n tableOptions,\n ) as TableOptionsWithReactiveData<TFeatures, TData>\n\n const table = useTable<TFeatures, TData, TSelected>(mergedOptions, selector)\n\n const AppTable = defineComponent({\n name: 'AppTable',\n props: {\n selector: {\n type: Function as PropType<(state: TableState<TFeatures>) => unknown>,\n default: undefined,\n },\n },\n setup(props, { slots }) {\n provide(TableContext, table)\n const selected = props.selector\n ? useSelector(table.store, props.selector)\n : undefined\n\n return () => {\n if (!props.selector) {\n return slots.default?.()\n }\n\n return slots.default?.({ state: selected?.value })\n }\n },\n })\n\n const AppCell = defineComponent({\n name: 'AppCell',\n props: {\n cell: {\n type: Object as PropType<object>,\n required: true,\n },\n selector: {\n type: Function as PropType<(state: TableState<TFeatures>) => unknown>,\n default: undefined,\n },\n },\n setup(props, { slots }) {\n const cell = props.cell as Cell<TFeatures, TData, any>\n\n provide(CellContext, cell)\n\n const selected = props.selector\n ? useSelector(table.store, props.selector)\n : undefined\n\n const extendedCell = Object.assign(cell, {\n FlexRender: CellFlexRender,\n ...(cellComponents ?? {}),\n }) as Cell<TFeatures, TData, any> &\n TCellComponents & { FlexRender: Component }\n\n return () => {\n return slots.default?.(\n props.selector\n ? { cell: extendedCell, state: selected?.value }\n : { cell: extendedCell },\n )\n }\n },\n })\n\n const AppHeader = defineComponent({\n name: 'AppHeader',\n props: {\n header: {\n type: Object as PropType<object>,\n required: true,\n },\n selector: {\n type: Function as PropType<(state: TableState<TFeatures>) => unknown>,\n default: undefined,\n },\n },\n setup(props, { slots }) {\n const header = props.header as Header<TFeatures, TData, any>\n\n provide(HeaderContext, header)\n\n const selected = props.selector\n ? useSelector(table.store, props.selector)\n : undefined\n\n const extendedHeader = Object.assign(header, {\n FlexRender: HeaderFlexRender,\n ...(headerComponents ?? {}),\n }) as Header<TFeatures, TData, any> &\n THeaderComponents & { FlexRender: Component }\n\n return () => {\n return slots.default?.(\n props.selector\n ? { header: extendedHeader, state: selected?.value }\n : { header: extendedHeader },\n )\n }\n },\n })\n\n const AppFooter = defineComponent({\n name: 'AppFooter',\n props: {\n header: {\n type: Object as PropType<object>,\n required: true,\n },\n selector: {\n type: Function as PropType<(state: TableState<TFeatures>) => unknown>,\n default: undefined,\n },\n },\n setup(props, { slots }) {\n const header = props.header as Header<TFeatures, TData, any>\n\n provide(HeaderContext, header)\n\n const selected = props.selector\n ? useSelector(table.store, props.selector)\n : undefined\n\n const extendedHeader = Object.assign(header, {\n FlexRender: FooterFlexRender,\n ...(headerComponents ?? {}),\n }) as Header<TFeatures, TData, any> &\n THeaderComponents & { FlexRender: Component }\n\n return () => {\n return slots.default?.(\n props.selector\n ? { header: extendedHeader, state: selected?.value }\n : { header: extendedHeader },\n )\n }\n },\n })\n\n return Object.assign(table, {\n AppTable,\n AppCell,\n AppHeader,\n AppFooter,\n FlexRender: AppFlexRender,\n ...(tableComponents ?? {}),\n }) as AppVueTable<\n TFeatures,\n TData,\n TSelected,\n TTableComponents,\n TCellComponents,\n THeaderComponents\n >\n }\n\n return {\n appFeatures: defaultTableOptions.features as TFeatures,\n createAppColumnHelper,\n useAppTable,\n useTableContext,\n useCellContext,\n useHeaderContext,\n }\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"createTableHook.js","names":["coreCreateColumnHelper"],"sources":["../src/createTableHook.ts"],"sourcesContent":["import { createColumnHelper as coreCreateColumnHelper } from '@tanstack/table-core'\nimport { defineComponent, h, inject, provide } from 'vue'\nimport { FlexRender } from './FlexRender'\nimport { mergeProxy } from './merge-proxy'\nimport { useTable } from './useTable'\nimport type { TableOptionsWithReactiveData, VueTable } from './useTable'\nimport type { FlexRenderCell, FlexRenderHeader } from './FlexRender'\nimport type { Component, InjectionKey, PropType, VNodeChild } from 'vue'\nimport type {\n AccessorFn,\n AccessorFnColumnDef,\n AccessorKeyColumnDef,\n Cell,\n CellContext,\n CellData,\n Column,\n ColumnDef,\n DeepKeys,\n DeepValue,\n DisplayColumnDef,\n GroupColumnDef,\n Header,\n IdentifiedColumnDef,\n NoInfer,\n Row,\n RowData,\n Table,\n TableFeatures,\n TableState,\n} from '@tanstack/table-core'\n\nexport type ComponentType<T extends Record<string, any>> = Component<T>\n\nexport type AppCellContext<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData,\n TCellComponents extends Record<string, ComponentType<any>>,\n> = {\n cell: Cell<TFeatures, TData, TValue> &\n TCellComponents & { FlexRender: Component }\n column: Column<TFeatures, TData, TValue>\n getValue: CellContext<TFeatures, TData, TValue>['getValue']\n renderValue: CellContext<TFeatures, TData, TValue>['renderValue']\n row: Row<TFeatures, TData>\n table: Table<TFeatures, TData>\n}\n\nexport type AppHeaderContext<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = {\n column: Column<TFeatures, TData, TValue>\n header: Header<TFeatures, TData, TValue> &\n THeaderComponents & { FlexRender: Component }\n table: Table<TFeatures, TData>\n}\n\nexport type AppColumnDefTemplate<TProps extends object> =\n | string\n | ((props: TProps) => any)\n\nexport type AppColumnDefBase<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = Omit<\n IdentifiedColumnDef<TFeatures, TData, TValue>,\n 'cell' | 'header' | 'footer'\n> & {\n cell?: AppColumnDefTemplate<\n AppCellContext<TFeatures, TData, TValue, TCellComponents>\n >\n header?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, TValue, THeaderComponents>\n >\n footer?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, TValue, THeaderComponents>\n >\n}\n\nexport type AppDisplayColumnDef<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = Omit<\n DisplayColumnDef<TFeatures, TData, unknown>,\n 'cell' | 'header' | 'footer'\n> & {\n cell?: AppColumnDefTemplate<\n AppCellContext<TFeatures, TData, unknown, TCellComponents>\n >\n header?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, unknown, THeaderComponents>\n >\n footer?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, unknown, THeaderComponents>\n >\n}\n\nexport type AppGroupColumnDef<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = Omit<\n GroupColumnDef<TFeatures, TData, unknown>,\n 'cell' | 'header' | 'footer' | 'columns'\n> & {\n cell?: AppColumnDefTemplate<\n AppCellContext<TFeatures, TData, unknown, TCellComponents>\n >\n header?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, unknown, THeaderComponents>\n >\n footer?: AppColumnDefTemplate<\n AppHeaderContext<TFeatures, TData, unknown, THeaderComponents>\n >\n columns?: Array<ColumnDef<TFeatures, TData, unknown>>\n}\n\nexport type AppColumnHelper<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = {\n accessor: <\n TAccessor extends AccessorFn<TData> | DeepKeys<TData>,\n TValue extends TAccessor extends AccessorFn<TData, infer TReturn>\n ? TReturn\n : TAccessor extends DeepKeys<TData>\n ? DeepValue<TData, TAccessor>\n : never,\n >(\n accessor: TAccessor,\n column: TAccessor extends AccessorFn<TData>\n ? AppColumnDefBase<\n TFeatures,\n TData,\n TValue,\n TCellComponents,\n THeaderComponents\n > & { id: string }\n : AppColumnDefBase<\n TFeatures,\n TData,\n TValue,\n TCellComponents,\n THeaderComponents\n >,\n ) => TAccessor extends AccessorFn<TData>\n ? AccessorFnColumnDef<TFeatures, TData, TValue>\n : AccessorKeyColumnDef<TFeatures, TData, TValue>\n columns: <TColumns extends ReadonlyArray<ColumnDef<TFeatures, TData, any>>>(\n columns: [...TColumns],\n ) => Array<ColumnDef<TFeatures, TData, any>> & [...TColumns]\n display: (\n column: AppDisplayColumnDef<\n TFeatures,\n TData,\n TCellComponents,\n THeaderComponents\n >,\n ) => DisplayColumnDef<TFeatures, TData, unknown>\n group: (\n column: AppGroupColumnDef<\n TFeatures,\n TData,\n TCellComponents,\n THeaderComponents\n >,\n ) => GroupColumnDef<TFeatures, TData, unknown>\n}\n\nexport type CreateTableHookOptions<\n TFeatures extends TableFeatures,\n TTableComponents extends Record<string, ComponentType<any>>,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = Omit<\n TableOptionsWithReactiveData<TFeatures, any>,\n 'columns' | 'data' | 'store' | 'state' | 'initialState'\n> & {\n tableComponents?: TTableComponents\n cellComponents?: TCellComponents\n headerComponents?: THeaderComponents\n}\n\nexport interface AppTableProps {}\n\nexport interface AppCellProps<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData = CellData,\n> {\n cell: Cell<TFeatures, TData, TValue>\n}\n\nexport interface AppHeaderProps<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TValue extends CellData = CellData,\n> {\n header: Header<TFeatures, TData, TValue>\n}\n\nexport type AppVueTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected,\n TTableComponents extends Record<string, ComponentType<any>>,\n TCellComponents extends Record<string, ComponentType<any>>,\n THeaderComponents extends Record<string, ComponentType<any>>,\n> = VueTable<TFeatures, TData> &\n NoInfer<TTableComponents> & {\n AppTable: Component<AppTableProps>\n AppCell: Component<AppCellProps<TFeatures, TData>>\n AppHeader: Component<AppHeaderProps<TFeatures, TData>>\n AppFooter: Component<AppHeaderProps<TFeatures, TData>>\n FlexRender: typeof AppFlexRender\n }\n\nexport const AppFlexRender = defineComponent({\n name: 'TableFlexRender',\n props: {\n cell: {\n type: Object as PropType<FlexRenderCell>,\n default: undefined,\n },\n header: {\n type: Object as PropType<FlexRenderHeader>,\n default: undefined,\n },\n footer: {\n type: Object as PropType<FlexRenderHeader>,\n default: undefined,\n },\n },\n setup(props) {\n return () => {\n if (props.cell) {\n return h(FlexRender, {\n render: props.cell.column.columnDef.cell,\n props: props.cell.getContext(),\n })\n }\n\n if (props.header) {\n return h(FlexRender, {\n render: props.header.column.columnDef.header,\n props: props.header.getContext(),\n })\n }\n\n if (props.footer) {\n return h(FlexRender, {\n render: props.footer.column.columnDef.footer,\n props: props.footer.getContext(),\n })\n }\n\n return null\n }\n },\n})\n\n/**\n * Creates app-scoped Vue table helpers with features, row models, and\n * renderable component maps pre-bound.\n *\n * Use this when an app or design system wants typed `useAppTable`, a pre-bound\n * column helper, and context helpers for table, cell, and header components.\n *\n * @example\n * ```ts\n * const { useAppTable, createAppColumnHelper } = createTableHook({\n * features,\n * rowModels: {},\n * tableComponents: {},\n * cellComponents: {},\n * headerComponents: {},\n * })\n * ```\n */\nexport function createTableHook<\n TFeatures extends TableFeatures,\n const TTableComponents extends Record<string, ComponentType<any>>,\n const TCellComponents extends Record<string, ComponentType<any>>,\n const THeaderComponents extends Record<string, ComponentType<any>>,\n>({\n tableComponents,\n cellComponents,\n headerComponents,\n ...defaultTableOptions\n}: CreateTableHookOptions<\n TFeatures,\n TTableComponents,\n TCellComponents,\n THeaderComponents\n>) {\n const TableContext = Symbol('TableContext') as InjectionKey<\n VueTable<TFeatures, any>\n >\n const CellContext = Symbol('CellContext') as InjectionKey<\n Cell<TFeatures, any, any>\n >\n const HeaderContext = Symbol('HeaderContext') as InjectionKey<\n Header<TFeatures, any, any>\n >\n\n function createAppColumnHelper<TData extends RowData>(): AppColumnHelper<\n TFeatures,\n TData,\n TCellComponents,\n THeaderComponents\n > {\n return coreCreateColumnHelper<TFeatures, TData>() as AppColumnHelper<\n TFeatures,\n TData,\n TCellComponents,\n THeaderComponents\n >\n }\n\n function useTableContext<TData extends RowData = RowData>(): VueTable<\n TFeatures,\n TData\n > {\n const table = inject(TableContext)\n\n if (!table) {\n throw new Error(\n '`useTableContext` must be used within an `AppTable` component. ' +\n 'Make sure your component is wrapped with `<table.AppTable>...</table.AppTable>`.',\n )\n }\n\n return table as VueTable<TFeatures, TData>\n }\n\n function useCellContext<TValue extends CellData = CellData>(): Cell<\n TFeatures,\n any,\n TValue\n > {\n const cell = inject(CellContext)\n\n if (!cell) {\n throw new Error(\n '`useCellContext` must be used within an `AppCell` component. ' +\n 'Make sure your component is wrapped with `<table.AppCell :cell=\"cell\">...</table.AppCell>`.',\n )\n }\n\n return cell as Cell<TFeatures, any, TValue>\n }\n\n function useHeaderContext<TValue extends CellData = CellData>(): Header<\n TFeatures,\n any,\n TValue\n > {\n const header = inject(HeaderContext)\n\n if (!header) {\n throw new Error(\n '`useHeaderContext` must be used within an `AppHeader` or `AppFooter` component.',\n )\n }\n\n return header as Header<TFeatures, any, TValue>\n }\n\n const CellFlexRender = defineComponent({\n name: 'AppCellFlexRender',\n setup() {\n const cell = useCellContext()\n return () => h(AppFlexRender, { cell })\n },\n })\n\n const HeaderFlexRender = defineComponent({\n name: 'AppHeaderFlexRender',\n setup() {\n const header = useHeaderContext()\n return () => h(AppFlexRender, { header })\n },\n })\n\n const FooterFlexRender = defineComponent({\n name: 'AppFooterFlexRender',\n setup() {\n const header = useHeaderContext()\n return () => h(AppFlexRender, { footer: header })\n },\n })\n\n function useAppTable<TData extends RowData>(\n tableOptions: Omit<\n TableOptionsWithReactiveData<TFeatures, TData>,\n 'features' | 'rowModels'\n >,\n ): AppVueTable<\n TFeatures,\n TData,\n TableState<TFeatures>,\n TTableComponents,\n TCellComponents,\n THeaderComponents\n > {\n const mergedOptions = mergeProxy(\n defaultTableOptions,\n tableOptions,\n ) as TableOptionsWithReactiveData<TFeatures, TData>\n\n const table = useTable<TFeatures, TData>(mergedOptions)\n\n const AppTable = defineComponent({\n name: 'AppTable',\n setup(_, { slots }) {\n provide(TableContext, table)\n return () => {\n return slots.default?.()\n }\n },\n })\n\n const AppCell = defineComponent({\n name: 'AppCell',\n props: {\n cell: {\n type: Object as PropType<object>,\n required: true,\n },\n },\n setup(props, { slots }) {\n const cell = props.cell as Cell<TFeatures, TData, any>\n\n provide(CellContext, cell)\n\n const extendedCell = Object.assign(cell, {\n FlexRender: CellFlexRender,\n ...(cellComponents ?? {}),\n }) as Cell<TFeatures, TData, any> &\n TCellComponents & { FlexRender: Component }\n\n return () => {\n return slots.default?.({ cell: extendedCell })\n }\n },\n })\n\n const AppHeader = defineComponent({\n name: 'AppHeader',\n props: {\n header: {\n type: Object as PropType<object>,\n required: true,\n },\n },\n setup(props, { slots }) {\n const header = props.header as Header<TFeatures, TData, any>\n\n provide(HeaderContext, header)\n\n const extendedHeader = Object.assign(header, {\n FlexRender: HeaderFlexRender,\n ...(headerComponents ?? {}),\n }) as Header<TFeatures, TData, any> &\n THeaderComponents & { FlexRender: Component }\n\n return () => {\n return slots.default?.({ header: extendedHeader })\n }\n },\n })\n\n const AppFooter = defineComponent({\n name: 'AppFooter',\n props: {\n header: {\n type: Object as PropType<object>,\n required: true,\n },\n },\n setup(props, { slots }) {\n const header = props.header as Header<TFeatures, TData, any>\n\n provide(HeaderContext, header)\n\n const extendedHeader = Object.assign(header, {\n FlexRender: FooterFlexRender,\n ...(headerComponents ?? {}),\n }) as Header<TFeatures, TData, any> &\n THeaderComponents & { FlexRender: Component }\n\n return () => {\n return slots.default?.({ header: extendedHeader })\n }\n },\n })\n\n return Object.assign(table, {\n AppTable,\n AppCell,\n AppHeader,\n AppFooter,\n FlexRender: AppFlexRender,\n ...(tableComponents ?? {}),\n }) as AppVueTable<\n TFeatures,\n TData,\n TableState<TFeatures>,\n TTableComponents,\n TCellComponents,\n THeaderComponents\n >\n }\n\n return {\n appFeatures: defaultTableOptions.features as TFeatures,\n createAppColumnHelper,\n useAppTable,\n useTableContext,\n useCellContext,\n useHeaderContext,\n }\n}\n"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import { FlexRender, flexRender } from "./FlexRender.cjs";
2
- export { FlexRender, flexRender };
1
+ import { FlexRender, FlexRenderCell, FlexRenderHeader, flexRender } from "./FlexRender.cjs";
2
+ export { FlexRender, FlexRenderCell, FlexRenderHeader, flexRender };
@@ -1,2 +1,2 @@
1
- import { FlexRender, flexRender } from "./FlexRender.js";
2
- export { FlexRender, flexRender };
1
+ import { FlexRender, FlexRenderCell, FlexRenderHeader, flexRender } from "./FlexRender.js";
2
+ export { FlexRender, FlexRenderCell, FlexRenderHeader, flexRender };
package/dist/index.d.cts CHANGED
@@ -1,5 +1,5 @@
1
- import { FlexRender, flexRender } from "./FlexRender.cjs";
2
- import { SubscribeSource, TableOptionsWithReactiveData, VueTable, useTable } from "./useTable.cjs";
1
+ import { FlexRender, FlexRenderCell, FlexRenderHeader, flexRender } from "./FlexRender.cjs";
2
+ import { TableOptionsWithReactiveData, VueTable, useTable } from "./useTable.cjs";
3
3
  import { AppCellContext, AppCellProps, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppFlexRender, AppGroupColumnDef, AppHeaderContext, AppHeaderProps, AppTableProps, AppVueTable, ComponentType, CreateTableHookOptions, createTableHook } from "./createTableHook.cjs";
4
4
  export * from "@tanstack/table-core";
5
- export { AppCellContext, AppCellProps, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppFlexRender, AppGroupColumnDef, AppHeaderContext, AppHeaderProps, AppTableProps, AppVueTable, ComponentType, CreateTableHookOptions, FlexRender, SubscribeSource, TableOptionsWithReactiveData, VueTable, createTableHook, flexRender, useTable };
5
+ export { AppCellContext, AppCellProps, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppFlexRender, AppGroupColumnDef, AppHeaderContext, AppHeaderProps, AppTableProps, AppVueTable, ComponentType, CreateTableHookOptions, FlexRender, FlexRenderCell, FlexRenderHeader, TableOptionsWithReactiveData, VueTable, createTableHook, flexRender, useTable };
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { FlexRender, flexRender } from "./FlexRender.js";
2
- import { SubscribeSource, TableOptionsWithReactiveData, VueTable, useTable } from "./useTable.js";
1
+ import { FlexRender, FlexRenderCell, FlexRenderHeader, flexRender } from "./FlexRender.js";
2
+ import { TableOptionsWithReactiveData, VueTable, useTable } from "./useTable.js";
3
3
  import { AppCellContext, AppCellProps, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppFlexRender, AppGroupColumnDef, AppHeaderContext, AppHeaderProps, AppTableProps, AppVueTable, ComponentType, CreateTableHookOptions, createTableHook } from "./createTableHook.js";
4
4
  export * from "@tanstack/table-core";
5
- export { AppCellContext, AppCellProps, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppFlexRender, AppGroupColumnDef, AppHeaderContext, AppHeaderProps, AppTableProps, AppVueTable, ComponentType, CreateTableHookOptions, FlexRender, SubscribeSource, TableOptionsWithReactiveData, VueTable, createTableHook, flexRender, useTable };
5
+ export { AppCellContext, AppCellProps, AppColumnDefBase, AppColumnDefTemplate, AppColumnHelper, AppDisplayColumnDef, AppFlexRender, AppGroupColumnDef, AppHeaderContext, AppHeaderProps, AppTableProps, AppVueTable, ComponentType, CreateTableHookOptions, FlexRender, FlexRenderCell, FlexRenderHeader, TableOptionsWithReactiveData, VueTable, createTableHook, flexRender, useTable };
@@ -1,8 +1,7 @@
1
1
  let vue = require("vue");
2
- let _tanstack_vue_store = require("@tanstack/vue-store");
2
+ let _tanstack_store = require("@tanstack/store");
3
3
 
4
4
  //#region src/reactivity.ts
5
- const optionsStoreDebugName = "table/optionsStore";
6
5
  function observerToCallback(observerOrNext) {
7
6
  return typeof observerOrNext === "function" ? observerOrNext : (value) => {
8
7
  var _observerOrNext$next;
@@ -37,34 +36,26 @@ function refToWritableAtom(source) {
37
36
  * refs.
38
37
  */
39
38
  function vueReactivity() {
39
+ const subscriptions = /* @__PURE__ */ new Set();
40
40
  return {
41
41
  createOptionsStore: true,
42
- wrapExternalAtoms: false,
43
- addSubscription: () => {
44
- throw new Error("Feature not supported in current reactivity implementation");
42
+ wrapExternalAtoms: true,
43
+ addSubscription: (subscription) => {
44
+ subscriptions.add(subscription);
45
45
  },
46
46
  unmount: () => {
47
- throw new Error("Feature not supported in current reactivity implementation");
47
+ subscriptions.forEach((s) => s.unsubscribe());
48
+ subscriptions.clear();
48
49
  },
49
50
  schedule: (fn) => queueMicrotask(() => fn()),
50
51
  createReadonlyAtom: (fn, _options) => {
51
- const storeAtom = (0, _tanstack_vue_store.createAtom)(() => fn(), { compare: _options === null || _options === void 0 ? void 0 : _options.compare });
52
- const version = (0, vue.shallowRef)(0);
53
- const subscription = storeAtom.subscribe(() => {
54
- version.value += 1;
55
- });
56
- if ((0, vue.getCurrentScope)()) (0, vue.onScopeDispose)(() => subscription.unsubscribe());
57
- return refToReadonlyAtom((0, vue.computed)(() => {
58
- version.value;
59
- return storeAtom.get();
60
- }));
52
+ return refToReadonlyAtom((0, vue.computed)(() => fn()));
61
53
  },
62
54
  createWritableAtom: (value, _options) => {
63
- if ((_options === null || _options === void 0 ? void 0 : _options.debugName) === optionsStoreDebugName) return refToWritableAtom((0, vue.shallowRef)(value));
64
- return (0, _tanstack_vue_store.createAtom)(value, { compare: _options === null || _options === void 0 ? void 0 : _options.compare });
55
+ return refToWritableAtom((0, vue.shallowRef)(value));
65
56
  },
66
57
  untrack: (fn) => fn(),
67
- batch: _tanstack_vue_store.batch
58
+ batch: _tanstack_store.batch
68
59
  };
69
60
  }
70
61
 
@@ -1 +1 @@
1
- {"version":3,"file":"reactivity.cjs","names":[],"sources":["../src/reactivity.ts"],"sourcesContent":["import {\n computed,\n getCurrentScope,\n onScopeDispose,\n shallowRef,\n watch,\n} from 'vue'\nimport { batch, createAtom } from '@tanstack/vue-store'\nimport type {\n TableAtomOptions,\n TableReactivityBindings,\n} from '@tanstack/table-core/reactivity'\nimport type { Atom, Observer, ReadonlyAtom } from '@tanstack/vue-store'\nimport type { ComputedRef, ShallowRef } from 'vue'\n\nconst optionsStoreDebugName = 'table/optionsStore'\n\nfunction observerToCallback<T>(\n observerOrNext: Observer<T> | ((value: T) => void),\n): (value: T) => void {\n return typeof observerOrNext === 'function'\n ? observerOrNext\n : (value) => observerOrNext.next?.(value)\n}\n\nfunction refToReadonlyAtom<T>(\n source: ComputedRef<T> | ShallowRef<T>,\n): ReadonlyAtom<T> {\n return Object.assign(source, {\n get: () => source.value,\n subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {\n const stop = watch(source, observerToCallback(observerOrNext), {\n flush: 'sync',\n })\n return { unsubscribe: stop }\n }) as ReadonlyAtom<T>['subscribe'],\n })\n}\n\nfunction refToWritableAtom<T>(source: ShallowRef<T>): Atom<T> {\n return Object.assign(source, {\n set: (updater: T | ((prevVal: T) => T)) => {\n source.value =\n typeof updater === 'function'\n ? (updater as (prevVal: T) => T)(source.value)\n : updater\n },\n get: () => source.value,\n subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {\n const stop = watch(source, observerToCallback(observerOrNext), {\n flush: 'sync',\n })\n return { unsubscribe: stop }\n }) as Atom<T>['subscribe'],\n })\n}\n\n/**\n * Creates the table-core reactivity bindings used by the Vue adapter.\n *\n * Table state atoms are backed by TanStack Store atoms. The options store stays\n * framework-native because row-model APIs read `table.options` directly during\n * render. Readonly table atoms bridge Store dependency tracking into Vue computed\n * refs.\n */\nexport function vueReactivity(): TableReactivityBindings {\n return {\n createOptionsStore: true,\n wrapExternalAtoms: false,\n addSubscription: () => {\n throw new Error(\n 'Feature not supported in current reactivity implementation',\n )\n },\n unmount: () => {\n throw new Error(\n 'Feature not supported in current reactivity implementation',\n )\n },\n schedule: (fn) => queueMicrotask(() => fn()),\n createReadonlyAtom: <T>(fn: () => T, _options?: TableAtomOptions<T>) => {\n const storeAtom = createAtom(() => fn(), {\n compare: _options?.compare,\n })\n const version = shallowRef(0)\n const subscription = storeAtom.subscribe(() => {\n version.value += 1\n })\n if (getCurrentScope()) {\n onScopeDispose(() => subscription.unsubscribe())\n }\n\n return refToReadonlyAtom(\n computed(() => {\n version.value\n return storeAtom.get()\n }),\n )\n },\n createWritableAtom: <T>(\n value: T,\n _options?: TableAtomOptions<T>,\n ): Atom<T> => {\n if (_options?.debugName === optionsStoreDebugName) {\n return refToWritableAtom(shallowRef(value) as ShallowRef<T>)\n }\n\n return createAtom(value, {\n compare: _options?.compare,\n })\n },\n untrack: (fn) => fn(),\n batch,\n }\n}\n"],"mappings":";;;;AAeA,MAAM,wBAAwB;AAE9B,SAAS,mBACP,gBACoB;CACpB,OAAO,OAAO,mBAAmB,aAC7B,kBACC,UAAU;;gDAAe,uGAAO,KAAK;;AAC5C;AAEA,SAAS,kBACP,QACiB;CACjB,OAAO,OAAO,OAAO,QAAQ;EAC3B,WAAW,OAAO;EAClB,aAAa,mBAAuD;GAIlE,OAAO,EAAE,4BAHU,QAAQ,mBAAmB,cAAc,GAAG,EAC7D,OAAO,OACT,CACyB,EAAE;EAC7B;CACF,CAAC;AACH;AAEA,SAAS,kBAAqB,QAAgC;CAC5D,OAAO,OAAO,OAAO,QAAQ;EAC3B,MAAM,YAAqC;GACzC,OAAO,QACL,OAAO,YAAY,aACd,QAA8B,OAAO,KAAK,IAC3C;EACR;EACA,WAAW,OAAO;EAClB,aAAa,mBAAuD;GAIlE,OAAO,EAAE,4BAHU,QAAQ,mBAAmB,cAAc,GAAG,EAC7D,OAAO,OACT,CACyB,EAAE;EAC7B;CACF,CAAC;AACH;;;;;;;;;AAUA,SAAgB,gBAAyC;CACvD,OAAO;EACL,oBAAoB;EACpB,mBAAmB;EACnB,uBAAuB;GACrB,MAAM,IAAI,MACR,4DACF;EACF;EACA,eAAe;GACb,MAAM,IAAI,MACR,4DACF;EACF;EACA,WAAW,OAAO,qBAAqB,GAAG,CAAC;EAC3C,qBAAwB,IAAa,aAAmC;GACtE,MAAM,sDAA6B,GAAG,GAAG,EACvC,6DAAS,SAAU,QACrB,CAAC;GACD,MAAM,8BAAqB,CAAC;GAC5B,MAAM,eAAe,UAAU,gBAAgB;IAC7C,QAAQ,SAAS;GACnB,CAAC;GACD,6BAAoB,GAClB,8BAAqB,aAAa,YAAY,CAAC;GAGjD,OAAO,0CACU;IACb,QAAQ;IACR,OAAO,UAAU,IAAI;GACvB,CAAC,CACH;EACF;EACA,qBACE,OACA,aACY;GACZ,yDAAI,SAAU,eAAc,uBAC1B,OAAO,sCAA6B,KAAK,CAAkB;GAG7D,2CAAkB,OAAO,EACvB,6DAAS,SAAU,QACrB,CAAC;EACH;EACA,UAAU,OAAO,GAAG;EACpB;CACF;AACF"}
1
+ {"version":3,"file":"reactivity.cjs","names":[],"sources":["../src/reactivity.ts"],"sourcesContent":["import { computed, shallowRef, watch } from 'vue'\nimport { batch } from '@tanstack/store'\nimport type {\n TableAtomOptions,\n TableReactivityBindings,\n} from '@tanstack/table-core/reactivity'\nimport type {\n Atom,\n Observer,\n ReadonlyAtom,\n Subscription,\n} from '@tanstack/store'\nimport type { ComputedRef, ShallowRef } from 'vue'\n\nfunction observerToCallback<T>(\n observerOrNext: Observer<T> | ((value: T) => void),\n): (value: T) => void {\n return typeof observerOrNext === 'function'\n ? observerOrNext\n : (value) => observerOrNext.next?.(value)\n}\n\nfunction refToReadonlyAtom<T>(\n source: ComputedRef<T> | ShallowRef<T>,\n): ReadonlyAtom<T> {\n return Object.assign(source, {\n get: () => source.value,\n subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {\n const stop = watch(source, observerToCallback(observerOrNext), {\n flush: 'sync',\n })\n return { unsubscribe: stop }\n }) as ReadonlyAtom<T>['subscribe'],\n })\n}\n\nfunction refToWritableAtom<T>(source: ShallowRef<T>): Atom<T> {\n return Object.assign(source, {\n set: (updater: T | ((prevVal: T) => T)) => {\n source.value =\n typeof updater === 'function'\n ? (updater as (prevVal: T) => T)(source.value)\n : updater\n },\n get: () => source.value,\n subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {\n const stop = watch(source, observerToCallback(observerOrNext), {\n flush: 'sync',\n })\n return { unsubscribe: stop }\n }) as Atom<T>['subscribe'],\n })\n}\n\n/**\n * Creates the table-core reactivity bindings used by the Vue adapter.\n *\n * Table state atoms are backed by TanStack Store atoms. The options store stays\n * framework-native because row-model APIs read `table.options` directly during\n * render. Readonly table atoms bridge Store dependency tracking into Vue computed\n * refs.\n */\nexport function vueReactivity(): TableReactivityBindings {\n const subscriptions = new Set<Subscription>()\n\n return {\n createOptionsStore: true,\n wrapExternalAtoms: true,\n addSubscription: (subscription) => {\n subscriptions.add(subscription)\n },\n unmount: () => {\n subscriptions.forEach((s) => s.unsubscribe())\n subscriptions.clear()\n },\n schedule: (fn) => queueMicrotask(() => fn()),\n createReadonlyAtom: <T>(fn: () => T, _options?: TableAtomOptions<T>) => {\n return refToReadonlyAtom(computed(() => fn()))\n },\n createWritableAtom: <T>(\n value: T,\n _options?: TableAtomOptions<T>,\n ): Atom<T> => {\n return refToWritableAtom(shallowRef(value) as ShallowRef<T>)\n },\n untrack: (fn) => fn(),\n batch,\n }\n}\n"],"mappings":";;;;AAcA,SAAS,mBACP,gBACoB;CACpB,OAAO,OAAO,mBAAmB,aAC7B,kBACC,UAAU;;gDAAe,uGAAO,KAAK;;AAC5C;AAEA,SAAS,kBACP,QACiB;CACjB,OAAO,OAAO,OAAO,QAAQ;EAC3B,WAAW,OAAO;EAClB,aAAa,mBAAuD;GAIlE,OAAO,EAAE,4BAHU,QAAQ,mBAAmB,cAAc,GAAG,EAC7D,OAAO,OACT,CACyB,EAAE;EAC7B;CACF,CAAC;AACH;AAEA,SAAS,kBAAqB,QAAgC;CAC5D,OAAO,OAAO,OAAO,QAAQ;EAC3B,MAAM,YAAqC;GACzC,OAAO,QACL,OAAO,YAAY,aACd,QAA8B,OAAO,KAAK,IAC3C;EACR;EACA,WAAW,OAAO;EAClB,aAAa,mBAAuD;GAIlE,OAAO,EAAE,4BAHU,QAAQ,mBAAmB,cAAc,GAAG,EAC7D,OAAO,OACT,CACyB,EAAE;EAC7B;CACF,CAAC;AACH;;;;;;;;;AAUA,SAAgB,gBAAyC;CACvD,MAAM,gCAAgB,IAAI,IAAkB;CAE5C,OAAO;EACL,oBAAoB;EACpB,mBAAmB;EACnB,kBAAkB,iBAAiB;GACjC,cAAc,IAAI,YAAY;EAChC;EACA,eAAe;GACb,cAAc,SAAS,MAAM,EAAE,YAAY,CAAC;GAC5C,cAAc,MAAM;EACtB;EACA,WAAW,OAAO,qBAAqB,GAAG,CAAC;EAC3C,qBAAwB,IAAa,aAAmC;GACtE,OAAO,0CAAiC,GAAG,CAAC,CAAC;EAC/C;EACA,qBACE,OACA,aACY;GACZ,OAAO,sCAA6B,KAAK,CAAkB;EAC7D;EACA,UAAU,OAAO,GAAG;EACpB;CACF;AACF"}
@@ -1,8 +1,7 @@
1
- import { computed, getCurrentScope, onScopeDispose, shallowRef, watch } from "vue";
2
- import { batch, createAtom } from "@tanstack/vue-store";
1
+ import { computed, shallowRef, watch } from "vue";
2
+ import { batch } from "@tanstack/store";
3
3
 
4
4
  //#region src/reactivity.ts
5
- const optionsStoreDebugName = "table/optionsStore";
6
5
  function observerToCallback(observerOrNext) {
7
6
  return typeof observerOrNext === "function" ? observerOrNext : (value) => {
8
7
  var _observerOrNext$next;
@@ -37,31 +36,23 @@ function refToWritableAtom(source) {
37
36
  * refs.
38
37
  */
39
38
  function vueReactivity() {
39
+ const subscriptions = /* @__PURE__ */ new Set();
40
40
  return {
41
41
  createOptionsStore: true,
42
- wrapExternalAtoms: false,
43
- addSubscription: () => {
44
- throw new Error("Feature not supported in current reactivity implementation");
42
+ wrapExternalAtoms: true,
43
+ addSubscription: (subscription) => {
44
+ subscriptions.add(subscription);
45
45
  },
46
46
  unmount: () => {
47
- throw new Error("Feature not supported in current reactivity implementation");
47
+ subscriptions.forEach((s) => s.unsubscribe());
48
+ subscriptions.clear();
48
49
  },
49
50
  schedule: (fn) => queueMicrotask(() => fn()),
50
51
  createReadonlyAtom: (fn, _options) => {
51
- const storeAtom = createAtom(() => fn(), { compare: _options === null || _options === void 0 ? void 0 : _options.compare });
52
- const version = shallowRef(0);
53
- const subscription = storeAtom.subscribe(() => {
54
- version.value += 1;
55
- });
56
- if (getCurrentScope()) onScopeDispose(() => subscription.unsubscribe());
57
- return refToReadonlyAtom(computed(() => {
58
- version.value;
59
- return storeAtom.get();
60
- }));
52
+ return refToReadonlyAtom(computed(() => fn()));
61
53
  },
62
54
  createWritableAtom: (value, _options) => {
63
- if ((_options === null || _options === void 0 ? void 0 : _options.debugName) === optionsStoreDebugName) return refToWritableAtom(shallowRef(value));
64
- return createAtom(value, { compare: _options === null || _options === void 0 ? void 0 : _options.compare });
55
+ return refToWritableAtom(shallowRef(value));
65
56
  },
66
57
  untrack: (fn) => fn(),
67
58
  batch
@@ -1 +1 @@
1
- {"version":3,"file":"reactivity.js","names":[],"sources":["../src/reactivity.ts"],"sourcesContent":["import {\n computed,\n getCurrentScope,\n onScopeDispose,\n shallowRef,\n watch,\n} from 'vue'\nimport { batch, createAtom } from '@tanstack/vue-store'\nimport type {\n TableAtomOptions,\n TableReactivityBindings,\n} from '@tanstack/table-core/reactivity'\nimport type { Atom, Observer, ReadonlyAtom } from '@tanstack/vue-store'\nimport type { ComputedRef, ShallowRef } from 'vue'\n\nconst optionsStoreDebugName = 'table/optionsStore'\n\nfunction observerToCallback<T>(\n observerOrNext: Observer<T> | ((value: T) => void),\n): (value: T) => void {\n return typeof observerOrNext === 'function'\n ? observerOrNext\n : (value) => observerOrNext.next?.(value)\n}\n\nfunction refToReadonlyAtom<T>(\n source: ComputedRef<T> | ShallowRef<T>,\n): ReadonlyAtom<T> {\n return Object.assign(source, {\n get: () => source.value,\n subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {\n const stop = watch(source, observerToCallback(observerOrNext), {\n flush: 'sync',\n })\n return { unsubscribe: stop }\n }) as ReadonlyAtom<T>['subscribe'],\n })\n}\n\nfunction refToWritableAtom<T>(source: ShallowRef<T>): Atom<T> {\n return Object.assign(source, {\n set: (updater: T | ((prevVal: T) => T)) => {\n source.value =\n typeof updater === 'function'\n ? (updater as (prevVal: T) => T)(source.value)\n : updater\n },\n get: () => source.value,\n subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {\n const stop = watch(source, observerToCallback(observerOrNext), {\n flush: 'sync',\n })\n return { unsubscribe: stop }\n }) as Atom<T>['subscribe'],\n })\n}\n\n/**\n * Creates the table-core reactivity bindings used by the Vue adapter.\n *\n * Table state atoms are backed by TanStack Store atoms. The options store stays\n * framework-native because row-model APIs read `table.options` directly during\n * render. Readonly table atoms bridge Store dependency tracking into Vue computed\n * refs.\n */\nexport function vueReactivity(): TableReactivityBindings {\n return {\n createOptionsStore: true,\n wrapExternalAtoms: false,\n addSubscription: () => {\n throw new Error(\n 'Feature not supported in current reactivity implementation',\n )\n },\n unmount: () => {\n throw new Error(\n 'Feature not supported in current reactivity implementation',\n )\n },\n schedule: (fn) => queueMicrotask(() => fn()),\n createReadonlyAtom: <T>(fn: () => T, _options?: TableAtomOptions<T>) => {\n const storeAtom = createAtom(() => fn(), {\n compare: _options?.compare,\n })\n const version = shallowRef(0)\n const subscription = storeAtom.subscribe(() => {\n version.value += 1\n })\n if (getCurrentScope()) {\n onScopeDispose(() => subscription.unsubscribe())\n }\n\n return refToReadonlyAtom(\n computed(() => {\n version.value\n return storeAtom.get()\n }),\n )\n },\n createWritableAtom: <T>(\n value: T,\n _options?: TableAtomOptions<T>,\n ): Atom<T> => {\n if (_options?.debugName === optionsStoreDebugName) {\n return refToWritableAtom(shallowRef(value) as ShallowRef<T>)\n }\n\n return createAtom(value, {\n compare: _options?.compare,\n })\n },\n untrack: (fn) => fn(),\n batch,\n }\n}\n"],"mappings":";;;;AAeA,MAAM,wBAAwB;AAE9B,SAAS,mBACP,gBACoB;CACpB,OAAO,OAAO,mBAAmB,aAC7B,kBACC,UAAU;;gDAAe,uGAAO,KAAK;;AAC5C;AAEA,SAAS,kBACP,QACiB;CACjB,OAAO,OAAO,OAAO,QAAQ;EAC3B,WAAW,OAAO;EAClB,aAAa,mBAAuD;GAIlE,OAAO,EAAE,aAHI,MAAM,QAAQ,mBAAmB,cAAc,GAAG,EAC7D,OAAO,OACT,CACyB,EAAE;EAC7B;CACF,CAAC;AACH;AAEA,SAAS,kBAAqB,QAAgC;CAC5D,OAAO,OAAO,OAAO,QAAQ;EAC3B,MAAM,YAAqC;GACzC,OAAO,QACL,OAAO,YAAY,aACd,QAA8B,OAAO,KAAK,IAC3C;EACR;EACA,WAAW,OAAO;EAClB,aAAa,mBAAuD;GAIlE,OAAO,EAAE,aAHI,MAAM,QAAQ,mBAAmB,cAAc,GAAG,EAC7D,OAAO,OACT,CACyB,EAAE;EAC7B;CACF,CAAC;AACH;;;;;;;;;AAUA,SAAgB,gBAAyC;CACvD,OAAO;EACL,oBAAoB;EACpB,mBAAmB;EACnB,uBAAuB;GACrB,MAAM,IAAI,MACR,4DACF;EACF;EACA,eAAe;GACb,MAAM,IAAI,MACR,4DACF;EACF;EACA,WAAW,OAAO,qBAAqB,GAAG,CAAC;EAC3C,qBAAwB,IAAa,aAAmC;GACtE,MAAM,YAAY,iBAAiB,GAAG,GAAG,EACvC,6DAAS,SAAU,QACrB,CAAC;GACD,MAAM,UAAU,WAAW,CAAC;GAC5B,MAAM,eAAe,UAAU,gBAAgB;IAC7C,QAAQ,SAAS;GACnB,CAAC;GACD,IAAI,gBAAgB,GAClB,qBAAqB,aAAa,YAAY,CAAC;GAGjD,OAAO,kBACL,eAAe;IACb,QAAQ;IACR,OAAO,UAAU,IAAI;GACvB,CAAC,CACH;EACF;EACA,qBACE,OACA,aACY;GACZ,yDAAI,SAAU,eAAc,uBAC1B,OAAO,kBAAkB,WAAW,KAAK,CAAkB;GAG7D,OAAO,WAAW,OAAO,EACvB,6DAAS,SAAU,QACrB,CAAC;EACH;EACA,UAAU,OAAO,GAAG;EACpB;CACF;AACF"}
1
+ {"version":3,"file":"reactivity.js","names":[],"sources":["../src/reactivity.ts"],"sourcesContent":["import { computed, shallowRef, watch } from 'vue'\nimport { batch } from '@tanstack/store'\nimport type {\n TableAtomOptions,\n TableReactivityBindings,\n} from '@tanstack/table-core/reactivity'\nimport type {\n Atom,\n Observer,\n ReadonlyAtom,\n Subscription,\n} from '@tanstack/store'\nimport type { ComputedRef, ShallowRef } from 'vue'\n\nfunction observerToCallback<T>(\n observerOrNext: Observer<T> | ((value: T) => void),\n): (value: T) => void {\n return typeof observerOrNext === 'function'\n ? observerOrNext\n : (value) => observerOrNext.next?.(value)\n}\n\nfunction refToReadonlyAtom<T>(\n source: ComputedRef<T> | ShallowRef<T>,\n): ReadonlyAtom<T> {\n return Object.assign(source, {\n get: () => source.value,\n subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {\n const stop = watch(source, observerToCallback(observerOrNext), {\n flush: 'sync',\n })\n return { unsubscribe: stop }\n }) as ReadonlyAtom<T>['subscribe'],\n })\n}\n\nfunction refToWritableAtom<T>(source: ShallowRef<T>): Atom<T> {\n return Object.assign(source, {\n set: (updater: T | ((prevVal: T) => T)) => {\n source.value =\n typeof updater === 'function'\n ? (updater as (prevVal: T) => T)(source.value)\n : updater\n },\n get: () => source.value,\n subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {\n const stop = watch(source, observerToCallback(observerOrNext), {\n flush: 'sync',\n })\n return { unsubscribe: stop }\n }) as Atom<T>['subscribe'],\n })\n}\n\n/**\n * Creates the table-core reactivity bindings used by the Vue adapter.\n *\n * Table state atoms are backed by TanStack Store atoms. The options store stays\n * framework-native because row-model APIs read `table.options` directly during\n * render. Readonly table atoms bridge Store dependency tracking into Vue computed\n * refs.\n */\nexport function vueReactivity(): TableReactivityBindings {\n const subscriptions = new Set<Subscription>()\n\n return {\n createOptionsStore: true,\n wrapExternalAtoms: true,\n addSubscription: (subscription) => {\n subscriptions.add(subscription)\n },\n unmount: () => {\n subscriptions.forEach((s) => s.unsubscribe())\n subscriptions.clear()\n },\n schedule: (fn) => queueMicrotask(() => fn()),\n createReadonlyAtom: <T>(fn: () => T, _options?: TableAtomOptions<T>) => {\n return refToReadonlyAtom(computed(() => fn()))\n },\n createWritableAtom: <T>(\n value: T,\n _options?: TableAtomOptions<T>,\n ): Atom<T> => {\n return refToWritableAtom(shallowRef(value) as ShallowRef<T>)\n },\n untrack: (fn) => fn(),\n batch,\n }\n}\n"],"mappings":";;;;AAcA,SAAS,mBACP,gBACoB;CACpB,OAAO,OAAO,mBAAmB,aAC7B,kBACC,UAAU;;gDAAe,uGAAO,KAAK;;AAC5C;AAEA,SAAS,kBACP,QACiB;CACjB,OAAO,OAAO,OAAO,QAAQ;EAC3B,WAAW,OAAO;EAClB,aAAa,mBAAuD;GAIlE,OAAO,EAAE,aAHI,MAAM,QAAQ,mBAAmB,cAAc,GAAG,EAC7D,OAAO,OACT,CACyB,EAAE;EAC7B;CACF,CAAC;AACH;AAEA,SAAS,kBAAqB,QAAgC;CAC5D,OAAO,OAAO,OAAO,QAAQ;EAC3B,MAAM,YAAqC;GACzC,OAAO,QACL,OAAO,YAAY,aACd,QAA8B,OAAO,KAAK,IAC3C;EACR;EACA,WAAW,OAAO;EAClB,aAAa,mBAAuD;GAIlE,OAAO,EAAE,aAHI,MAAM,QAAQ,mBAAmB,cAAc,GAAG,EAC7D,OAAO,OACT,CACyB,EAAE;EAC7B;CACF,CAAC;AACH;;;;;;;;;AAUA,SAAgB,gBAAyC;CACvD,MAAM,gCAAgB,IAAI,IAAkB;CAE5C,OAAO;EACL,oBAAoB;EACpB,mBAAmB;EACnB,kBAAkB,iBAAiB;GACjC,cAAc,IAAI,YAAY;EAChC;EACA,eAAe;GACb,cAAc,SAAS,MAAM,EAAE,YAAY,CAAC;GAC5C,cAAc,MAAM;EACtB;EACA,WAAW,OAAO,qBAAqB,GAAG,CAAC;EAC3C,qBAAwB,IAAa,aAAmC;GACtE,OAAO,kBAAkB,eAAe,GAAG,CAAC,CAAC;EAC/C;EACA,qBACE,OACA,aACY;GACZ,OAAO,kBAAkB,WAAW,KAAK,CAAkB;EAC7D;EACA,UAAU,OAAO,GAAG;EACpB;CACF;AACF"}
package/dist/useTable.cjs CHANGED
@@ -2,7 +2,6 @@ const require_merge_proxy = require('./merge-proxy.cjs');
2
2
  const require_reactivity = require('./reactivity.cjs');
3
3
  let vue = require("vue");
4
4
  let _tanstack_table_core = require("@tanstack/table-core");
5
- let _tanstack_vue_store = require("@tanstack/vue-store");
6
5
 
7
6
  //#region src/useTable.ts
8
7
  function getOptionsWithReactiveValues(options) {
@@ -18,8 +17,8 @@ function getReactiveOptionDeps(options) {
18
17
  *
19
18
  * Table options may contain Vue refs or computed values. The adapter unwraps
20
19
  * those reactive inputs, watches them with synchronous flushing, and keeps the
21
- * table options in sync. The optional selector projects from `table.store` and
22
- * exposes the selected value on `table.state`.
20
+ * table options in sync. Use `table.Subscribe` or native Vue computed values
21
+ * around `table.atoms.<slice>.get()` for selected reactive reads.
23
22
  *
24
23
  * @example
25
24
  * ```ts
@@ -30,24 +29,26 @@ function getReactiveOptionDeps(options) {
30
29
  * columns,
31
30
  * data,
32
31
  * },
33
- * (state) => ({ pagination: state.pagination }),
34
32
  * )
35
- *
36
- * table.state.pagination
37
33
  * ```
38
34
  */
39
- function useTable(tableOptions, selector) {
35
+ function useTable(tableOptions) {
40
36
  const syncTableOptions = (table, options) => {
41
37
  table.setOptions((prev) => require_merge_proxy.flatMerge(prev, getOptionsWithReactiveValues(options)));
42
38
  };
39
+ const reactivity = require_reactivity.vueReactivity();
43
40
  const mergedOptions = require_merge_proxy.mergeProxy(tableOptions, { features: {
44
- coreReativityFeature: require_reactivity.vueReactivity(),
41
+ coreReativityFeature: reactivity,
45
42
  ...(0, vue.unref)(tableOptions.features) ?? {}
46
43
  } });
47
44
  const coreTable = (0, _tanstack_table_core.constructTable)(require_merge_proxy.mergeProxy(getOptionsWithReactiveValues(mergedOptions), { mergeOptions: (defaultOptions, newOptions) => {
48
45
  return require_merge_proxy.flatMerge(defaultOptions, newOptions);
49
46
  } }));
50
47
  const table = coreTable;
48
+ if ((0, vue.getCurrentScope)()) (0, vue.onScopeDispose)(() => {
49
+ var _reactivity$unmount;
50
+ return (_reactivity$unmount = reactivity.unmount) === null || _reactivity$unmount === void 0 ? void 0 : _reactivity$unmount.call(reactivity);
51
+ });
51
52
  (0, vue.watch)(() => getReactiveOptionDeps(mergedOptions), () => {
52
53
  syncTableOptions(coreTable, mergedOptions);
53
54
  }, { immediate: true });
@@ -64,18 +65,10 @@ function useTable(tableOptions, selector) {
64
65
  }, (controlledValues) => {
65
66
  if (controlledValues.length > 0) syncTableOptions(coreTable, mergedOptions);
66
67
  }, { immediate: true });
67
- table.Subscribe = ((props) => {
68
- const selected = (0, _tanstack_vue_store.useSelector)(props.source ?? table.store, props.selector, { compare: _tanstack_vue_store.shallow });
69
- if (typeof props.children === "function") return props.children(selected.value);
70
- return props.children;
71
- });
72
- const stateStore = (0, _tanstack_vue_store.useSelector)(table.store, selector);
73
- return {
74
- ...table,
75
- get state() {
76
- return stateStore.value;
77
- }
68
+ table.Subscribe = (props) => {
69
+ return props.children(table.atoms);
78
70
  };
71
+ return table;
79
72
  }
80
73
 
81
74
  //#endregion
@@ -1 +1 @@
1
- {"version":3,"file":"useTable.cjs","names":["mergeProxy","flatMerge","vueReactivity","shallow"],"sources":["../src/useTable.ts"],"sourcesContent":["import { unref, watch } from 'vue'\nimport { constructTable } from '@tanstack/table-core'\nimport { shallow, useSelector } from '@tanstack/vue-store'\nimport { flatMerge, mergeProxy } from './merge-proxy'\nimport { vueReactivity } from './reactivity'\nimport type {\n Atom,\n ReadonlyAtom,\n ReadonlyStore,\n Store,\n} from '@tanstack/vue-store'\nimport type {\n NoInfer,\n RowData,\n Table,\n TableFeatures,\n TableOptions,\n TableState,\n} from '@tanstack/table-core'\nimport type { MaybeRef, VNode } from 'vue'\n\nexport type SubscribeSource<TValue> =\n | Atom<TValue>\n | ReadonlyAtom<TValue>\n | Store<TValue>\n | ReadonlyStore<TValue>\n\nexport type TableOptionsWithReactiveData<\n TFeatures extends TableFeatures,\n TData extends RowData,\n> = {\n [K in keyof TableOptions<TFeatures, TData>]: K extends 'data'\n ? MaybeRef<ReadonlyArray<TData>>\n : MaybeRef<TableOptions<TFeatures, TData>[K]>\n}\n\nfunction getOptionsWithReactiveValues<\n TFeatures extends TableFeatures,\n TData extends RowData,\n>(options: TableOptionsWithReactiveData<TFeatures, TData>) {\n const resolvedOptions: Record<string, unknown> = {}\n\n for (const key of Object.keys(options)) {\n resolvedOptions[key] = unref(\n options[key as keyof TableOptionsWithReactiveData<TFeatures, TData>],\n )\n }\n\n return mergeProxy(options, resolvedOptions)\n}\n\nfunction getReactiveOptionDeps<\n TFeatures extends TableFeatures,\n TData extends RowData,\n>(options: TableOptionsWithReactiveData<TFeatures, TData>) {\n return Object.keys(options).map((key) =>\n unref(options[key as keyof TableOptionsWithReactiveData<TFeatures, TData>]),\n )\n}\n\nexport type VueTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = TableState<TFeatures>,\n> = Omit<Table<TFeatures, TData>, 'store'> & {\n /**\n * @deprecated Prefer `table.state` for render reads,\n * `table.atoms.<slice>.get()` for slice snapshots, or\n * `table.Subscribe` / `useSelector(table.store, selector)` for explicit\n * subscriptions. `table.store.state` is a current-value snapshot and is easy\n * to misuse in render code.\n */\n readonly store: Table<TFeatures, TData>['store']\n /**\n * Store mode: `selector` required. Source mode: pass `source` (atom or store); omit\n * `selector` for the whole value (identity), or pass `selector` to project. Split\n * overloads so source-only infers `TSourceValue` for `children` (see React `Subscribe`).\n */\n Subscribe: {\n <TSourceValue>(props: {\n source: SubscribeSource<TSourceValue>\n selector?: undefined\n children:\n | ((state: Readonly<TSourceValue>) => VNode | Array<VNode>)\n | VNode\n | Array<VNode>\n }): VNode | Array<VNode>\n <TSourceValue, TSubSelected>(props: {\n source: SubscribeSource<TSourceValue>\n selector: (state: TSourceValue) => TSubSelected\n children:\n | ((state: Readonly<TSubSelected>) => VNode | Array<VNode>)\n | VNode\n | Array<VNode>\n }): VNode | Array<VNode>\n <TSubSelected>(props: {\n selector: (state: NoInfer<TableState<TFeatures>>) => TSubSelected\n children:\n | ((state: Readonly<TSubSelected>) => VNode | Array<VNode>)\n | VNode\n | Array<VNode>\n }): VNode | Array<VNode>\n }\n /**\n * The selected state of the table. This state may not match the structure of\n * the full table state because it is selected by the selector function that\n * you pass as the 2nd argument to `useTable`.\n *\n * @example\n * const table = useTable(options, (state) => ({ globalFilter: state.globalFilter })) // only globalFilter is part of the selected state\n *\n * console.log(table.state.globalFilter)\n */\n readonly state: Readonly<TSelected>\n}\n\n/**\n * Creates a Vue table instance backed by Vue-aware TanStack Store atoms.\n *\n * Table options may contain Vue refs or computed values. The adapter unwraps\n * those reactive inputs, watches them with synchronous flushing, and keeps the\n * table options in sync. The optional selector projects from `table.store` and\n * exposes the selected value on `table.state`.\n *\n * @example\n * ```ts\n * const table = useTable(\n * {\n * features,\n * rowModels: {},\n * columns,\n * data,\n * },\n * (state) => ({ pagination: state.pagination }),\n * )\n *\n * table.state.pagination\n * ```\n */\nexport function useTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = TableState<TFeatures>,\n>(\n tableOptions:\n | TableOptions<TFeatures, TData>\n | TableOptionsWithReactiveData<TFeatures, TData>,\n selector?: (state: TableState<TFeatures>) => TSelected,\n): VueTable<TFeatures, TData, TSelected> {\n const syncTableOptions = (\n table: Table<TFeatures, TData>,\n options: TableOptionsWithReactiveData<TFeatures, TData>,\n ) => {\n table.setOptions((prev) =>\n flatMerge(prev, getOptionsWithReactiveValues(options)),\n )\n }\n\n const mergedOptions = mergeProxy(tableOptions, {\n features: {\n coreReativityFeature: vueReactivity(),\n ...(unref(tableOptions.features) ?? {}),\n },\n }) as TableOptionsWithReactiveData<TFeatures, TData>\n\n const resolvedOptions = mergeProxy(\n getOptionsWithReactiveValues(mergedOptions),\n {\n // Remove state and onStateChange - store handles it internally\n mergeOptions: (\n defaultOptions: TableOptions<TFeatures, TData>,\n newOptions: Partial<TableOptions<TFeatures, TData>>,\n ) => {\n return flatMerge(defaultOptions, newOptions)\n },\n },\n ) as TableOptions<TFeatures, TData>\n\n const coreTable = constructTable(resolvedOptions)\n const table = coreTable as unknown as VueTable<TFeatures, TData, TSelected>\n\n watch(\n () => getReactiveOptionDeps(mergedOptions),\n () => {\n syncTableOptions(coreTable, mergedOptions)\n },\n { immediate: true },\n )\n\n watch(\n () => {\n const controlledState = unref(tableOptions.state) as\n | Record<string, unknown>\n | undefined\n const controlledAtoms = unref(tableOptions.atoms) as\n | Record<string, unknown>\n | undefined\n\n if (!controlledState) {\n return []\n }\n\n const controlledValues: Array<unknown> = []\n\n for (const key of Object.keys(table.initialState)) {\n if (!(key in controlledState) || controlledAtoms?.[key] !== undefined) {\n continue\n }\n\n // Reading only controlled state slices here lets Vue subscribe to\n // getters/computed values that are passed through `options.state`.\n controlledValues.push(controlledState[key])\n }\n\n return controlledValues\n },\n (controlledValues) => {\n if (controlledValues.length > 0) {\n syncTableOptions(coreTable, mergedOptions)\n }\n },\n { immediate: true },\n )\n\n table.Subscribe = ((props: {\n source?: SubscribeSource<unknown>\n selector?: ((state: unknown) => unknown) | undefined\n children:\n | ((state: Readonly<unknown>) => VNode | Array<VNode>)\n | VNode\n | Array<VNode>\n }) => {\n const source = props.source ?? table.store\n const selected = useSelector(source as never, props.selector as never, {\n compare: shallow,\n })\n if (typeof props.children === 'function') {\n return props.children(selected.value as Readonly<unknown>)\n }\n return props.children\n }) as VueTable<TFeatures, TData, TSelected>['Subscribe']\n\n const stateStore = useSelector(table.store, selector)\n\n return {\n ...table,\n get state() {\n return stateStore.value\n },\n }\n}\n"],"mappings":";;;;;;;AAoCA,SAAS,6BAGP,SAAyD;CACzD,MAAM,kBAA2C,CAAC;CAElD,KAAK,MAAM,OAAO,OAAO,KAAK,OAAO,GACnC,gBAAgB,sBACd,QAAQ,IACV;CAGF,OAAOA,+BAAW,SAAS,eAAe;AAC5C;AAEA,SAAS,sBAGP,SAAyD;CACzD,OAAO,OAAO,KAAK,OAAO,CAAC,CAAC,KAAK,uBACzB,QAAQ,IAA4D,CAC5E;AACF;;;;;;;;;;;;;;;;;;;;;;;;AAiFA,SAAgB,SAKd,cAGA,UACuC;CACvC,MAAM,oBACJ,OACA,YACG;EACH,MAAM,YAAY,SAChBC,8BAAU,MAAM,6BAA6B,OAAO,CAAC,CACvD;CACF;CAEA,MAAM,gBAAgBD,+BAAW,cAAc,EAC7C,UAAU;EACR,sBAAsBE,iCAAc;EACpC,kBAAU,aAAa,QAAQ,KAAK,CAAC;CACvC,EACF,CAAC;CAeD,MAAM,qDAbkBF,+BACtB,6BAA6B,aAAa,GAC1C,EAEE,eACE,gBACA,eACG;EACH,OAAOC,8BAAU,gBAAgB,UAAU;CAC7C,EACF,CAG6C,CAAC;CAChD,MAAM,QAAQ;CAEd,qBACQ,sBAAsB,aAAa,SACnC;EACJ,iBAAiB,WAAW,aAAa;CAC3C,GACA,EAAE,WAAW,KAAK,CACpB;CAEA,qBACQ;EACJ,MAAM,iCAAwB,aAAa,KAAK;EAGhD,MAAM,iCAAwB,aAAa,KAAK;EAIhD,IAAI,CAAC,iBACH,OAAO,CAAC;EAGV,MAAM,mBAAmC,CAAC;EAE1C,KAAK,MAAM,OAAO,OAAO,KAAK,MAAM,YAAY,GAAG;GACjD,IAAI,EAAE,OAAO,uFAAoB,gBAAkB,UAAS,QAC1D;GAKF,iBAAiB,KAAK,gBAAgB,IAAI;EAC5C;EAEA,OAAO;CACT,IACC,qBAAqB;EACpB,IAAI,iBAAiB,SAAS,GAC5B,iBAAiB,WAAW,aAAa;CAE7C,GACA,EAAE,WAAW,KAAK,CACpB;CAEA,MAAM,cAAc,UAOd;EAEJ,MAAM,gDADS,MAAM,UAAU,MAAM,OACS,MAAM,UAAmB,EACrE,SAASE,4BACX,CAAC;EACD,IAAI,OAAO,MAAM,aAAa,YAC5B,OAAO,MAAM,SAAS,SAAS,KAA0B;EAE3D,OAAO,MAAM;CACf;CAEA,MAAM,kDAAyB,MAAM,OAAO,QAAQ;CAEpD,OAAO;EACL,GAAG;EACH,IAAI,QAAQ;GACV,OAAO,WAAW;EACpB;CACF;AACF"}
1
+ {"version":3,"file":"useTable.cjs","names":["mergeProxy","flatMerge","vueReactivity"],"sources":["../src/useTable.ts"],"sourcesContent":["import { getCurrentScope, onScopeDispose, unref, watch } from 'vue'\nimport { constructTable } from '@tanstack/table-core'\nimport { flatMerge, mergeProxy } from './merge-proxy'\nimport { vueReactivity } from './reactivity'\nimport type {\n RowData,\n Table,\n TableFeatures,\n TableOptions,\n TableState,\n} from '@tanstack/table-core'\nimport type { MaybeRef, VNode } from 'vue'\n\nexport type TableOptionsWithReactiveData<\n TFeatures extends TableFeatures,\n TData extends RowData,\n> = {\n [K in keyof TableOptions<TFeatures, TData>]: K extends 'data'\n ? MaybeRef<ReadonlyArray<TData>>\n : MaybeRef<TableOptions<TFeatures, TData>[K]>\n}\n\nfunction getOptionsWithReactiveValues<\n TFeatures extends TableFeatures,\n TData extends RowData,\n>(options: TableOptionsWithReactiveData<TFeatures, TData>) {\n const resolvedOptions: Record<string, unknown> = {}\n\n for (const key of Object.keys(options)) {\n resolvedOptions[key] = unref(\n options[key as keyof TableOptionsWithReactiveData<TFeatures, TData>],\n )\n }\n\n return mergeProxy(options, resolvedOptions)\n}\n\nfunction getReactiveOptionDeps<\n TFeatures extends TableFeatures,\n TData extends RowData,\n>(options: TableOptionsWithReactiveData<TFeatures, TData>) {\n return Object.keys(options).map((key) =>\n unref(options[key as keyof TableOptionsWithReactiveData<TFeatures, TData>]),\n )\n}\n\nexport type VueTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n> = Omit<Table<TFeatures, TData>, 'store'> & {\n /**\n * @deprecated Prefer `table.atoms.<slice>.get()` for slice snapshots, or\n * `table.Subscribe` for explicit subscriptions. `table.store.state` is a\n * current-value snapshot and is easy to misuse in render code.\n */\n readonly store: Table<TFeatures, TData>['store']\n /** Creates a reactive render boundary. The child function reads the table\n * atoms it needs, so Vue only tracks those atom reads.\n */\n Subscribe: (props: {\n children: (atoms: Table<TFeatures, TData>['atoms']) => VNode | Array<VNode>\n }) => VNode | Array<VNode>\n}\n\n/**\n * Creates a Vue table instance backed by Vue-aware TanStack Store atoms.\n *\n * Table options may contain Vue refs or computed values. The adapter unwraps\n * those reactive inputs, watches them with synchronous flushing, and keeps the\n * table options in sync. Use `table.Subscribe` or native Vue computed values\n * around `table.atoms.<slice>.get()` for selected reactive reads.\n *\n * @example\n * ```ts\n * const table = useTable(\n * {\n * features,\n * rowModels: {},\n * columns,\n * data,\n * },\n * )\n * ```\n */\nexport function useTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n>(\n tableOptions:\n | TableOptions<TFeatures, TData>\n | TableOptionsWithReactiveData<TFeatures, TData>,\n): VueTable<TFeatures, TData> {\n const syncTableOptions = (\n table: Table<TFeatures, TData>,\n options: TableOptionsWithReactiveData<TFeatures, TData>,\n ) => {\n table.setOptions((prev) =>\n flatMerge(prev, getOptionsWithReactiveValues(options)),\n )\n }\n\n const reactivity = vueReactivity()\n\n const mergedOptions = mergeProxy(tableOptions, {\n features: {\n coreReativityFeature: reactivity,\n ...(unref(tableOptions.features) ?? {}),\n },\n }) as TableOptionsWithReactiveData<TFeatures, TData>\n\n const resolvedOptions = mergeProxy(\n getOptionsWithReactiveValues(mergedOptions),\n {\n // Remove state and onStateChange - store handles it internally\n mergeOptions: (\n defaultOptions: TableOptions<TFeatures, TData>,\n newOptions: Partial<TableOptions<TFeatures, TData>>,\n ) => {\n return flatMerge(defaultOptions, newOptions)\n },\n },\n ) as TableOptions<TFeatures, TData>\n\n const coreTable = constructTable(resolvedOptions)\n const table = coreTable as unknown as VueTable<TFeatures, TData>\n\n if (getCurrentScope()) {\n onScopeDispose(() => reactivity.unmount?.())\n }\n\n watch(\n () => getReactiveOptionDeps(mergedOptions),\n () => {\n syncTableOptions(coreTable, mergedOptions)\n },\n { immediate: true },\n )\n\n watch(\n () => {\n const controlledState = unref(tableOptions.state) as\n | Record<string, unknown>\n | undefined\n const controlledAtoms = unref(tableOptions.atoms) as\n | Record<string, unknown>\n | undefined\n\n if (!controlledState) {\n return []\n }\n\n const controlledValues: Array<unknown> = []\n\n for (const key of Object.keys(table.initialState)) {\n if (!(key in controlledState) || controlledAtoms?.[key] !== undefined) {\n continue\n }\n\n // Reading only controlled state slices here lets Vue subscribe to\n // getters/computed values that are passed through `options.state`.\n controlledValues.push(controlledState[key])\n }\n\n return controlledValues\n },\n (controlledValues) => {\n if (controlledValues.length > 0) {\n syncTableOptions(coreTable, mergedOptions)\n }\n },\n { immediate: true },\n )\n\n table.Subscribe = (props: {\n children: (atoms: Table<TFeatures, TData>['atoms']) => VNode | Array<VNode>\n }) => {\n return props.children(table.atoms)\n }\n\n return table\n}\n"],"mappings":";;;;;;AAsBA,SAAS,6BAGP,SAAyD;CACzD,MAAM,kBAA2C,CAAC;CAElD,KAAK,MAAM,OAAO,OAAO,KAAK,OAAO,GACnC,gBAAgB,sBACd,QAAQ,IACV;CAGF,OAAOA,+BAAW,SAAS,eAAe;AAC5C;AAEA,SAAS,sBAGP,SAAyD;CACzD,OAAO,OAAO,KAAK,OAAO,CAAC,CAAC,KAAK,uBACzB,QAAQ,IAA4D,CAC5E;AACF;;;;;;;;;;;;;;;;;;;;;AAwCA,SAAgB,SAId,cAG4B;CAC5B,MAAM,oBACJ,OACA,YACG;EACH,MAAM,YAAY,SAChBC,8BAAU,MAAM,6BAA6B,OAAO,CAAC,CACvD;CACF;CAEA,MAAM,aAAaC,iCAAc;CAEjC,MAAM,gBAAgBF,+BAAW,cAAc,EAC7C,UAAU;EACR,sBAAsB;EACtB,kBAAU,aAAa,QAAQ,KAAK,CAAC;CACvC,EACF,CAAC;CAeD,MAAM,qDAbkBA,+BACtB,6BAA6B,aAAa,GAC1C,EAEE,eACE,gBACA,eACG;EACH,OAAOC,8BAAU,gBAAgB,UAAU;CAC7C,EACF,CAG6C,CAAC;CAChD,MAAM,QAAQ;CAEd,6BAAoB,GAClB,8BAAqB;;2CAAW,kGAAU;EAAC;CAG7C,qBACQ,sBAAsB,aAAa,SACnC;EACJ,iBAAiB,WAAW,aAAa;CAC3C,GACA,EAAE,WAAW,KAAK,CACpB;CAEA,qBACQ;EACJ,MAAM,iCAAwB,aAAa,KAAK;EAGhD,MAAM,iCAAwB,aAAa,KAAK;EAIhD,IAAI,CAAC,iBACH,OAAO,CAAC;EAGV,MAAM,mBAAmC,CAAC;EAE1C,KAAK,MAAM,OAAO,OAAO,KAAK,MAAM,YAAY,GAAG;GACjD,IAAI,EAAE,OAAO,uFAAoB,gBAAkB,UAAS,QAC1D;GAKF,iBAAiB,KAAK,gBAAgB,IAAI;EAC5C;EAEA,OAAO;CACT,IACC,qBAAqB;EACpB,IAAI,iBAAiB,SAAS,GAC5B,iBAAiB,WAAW,aAAa;CAE7C,GACA,EAAE,WAAW,KAAK,CACpB;CAEA,MAAM,aAAa,UAEb;EACJ,OAAO,MAAM,SAAS,MAAM,KAAK;CACnC;CAEA,OAAO;AACT"}