npm - @tanstack/vue-table - Versions diffs - 9.0.0-alpha.44 → 9.0.0-alpha.45 - Mend

@tanstack/vue-table 9.0.0-alpha.44 → 9.0.0-alpha.45

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.

Files changed (13) hide show

package/dist/createTableHook.cjs.map +1 -1
package/dist/createTableHook.d.cts +1 -1
package/dist/createTableHook.d.ts +1 -1
package/dist/createTableHook.js.map +1 -1
package/dist/useTable.cjs +2 -2
package/dist/useTable.cjs.map +1 -1
package/dist/useTable.d.cts +2 -2
package/dist/useTable.d.ts +2 -2
package/dist/useTable.js +2 -2
package/dist/useTable.js.map +1 -1
package/package.json +1 -1
package/src/createTableHook.ts +4 -1
package/src/useTable.ts +4 -6

package/dist/createTableHook.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"createTableHook.cjs","names":["FlexRender","useTable","mergeProxy"],"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\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<TData extends RowData, TSelected = {}>(\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.cjs","names":["FlexRender","useTable","mergeProxy"],"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\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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"}

package/dist/createTableHook.d.cts CHANGED Viewed

@@ -111,7 +111,7 @@ declare function createTableHook<TFeatures extends TableFeatures, const TTableCo
 }: CreateTableHookOptions<TFeatures, TTableComponents, TCellComponents, THeaderComponents>): {
   appFeatures: TFeatures;
   createAppColumnHelper: <TData extends RowData>() => AppColumnHelper<TFeatures, TData, TCellComponents, THeaderComponents>;
-  useAppTable: <TData extends RowData, TSelected = {}>(tableOptions: Omit<TableOptionsWithReactiveData<TFeatures, TData>, "_features" | "_rowModels">, selector?: (state: TableState<TFeatures>) => TSelected) => AppVueTable<TFeatures, TData, TSelected, TTableComponents, TCellComponents, THeaderComponents>;
+  useAppTable: <TData extends RowData, TSelected = TableState<TFeatures>>(tableOptions: Omit<TableOptionsWithReactiveData<TFeatures, TData>, "_features" | "_rowModels">, selector?: (state: TableState<TFeatures>) => TSelected) => AppVueTable<TFeatures, TData, TSelected, TTableComponents, TCellComponents, THeaderComponents>;
   useTableContext: <TData extends RowData = RowData>() => VueTable<TFeatures, TData>;
   useCellContext: <TValue extends CellData = unknown>() => Cell<TFeatures, any, TValue>;
   useHeaderContext: <TValue extends CellData = unknown>() => Header<TFeatures, any, TValue>;

package/dist/createTableHook.d.ts CHANGED Viewed

@@ -111,7 +111,7 @@ declare function createTableHook<TFeatures extends TableFeatures, const TTableCo
 }: CreateTableHookOptions<TFeatures, TTableComponents, TCellComponents, THeaderComponents>): {
   appFeatures: TFeatures;
   createAppColumnHelper: <TData extends RowData>() => AppColumnHelper<TFeatures, TData, TCellComponents, THeaderComponents>;
-  useAppTable: <TData extends RowData, TSelected = {}>(tableOptions: Omit<TableOptionsWithReactiveData<TFeatures, TData>, "_features" | "_rowModels">, selector?: (state: TableState<TFeatures>) => TSelected) => AppVueTable<TFeatures, TData, TSelected, TTableComponents, TCellComponents, THeaderComponents>;
+  useAppTable: <TData extends RowData, TSelected = TableState<TFeatures>>(tableOptions: Omit<TableOptionsWithReactiveData<TFeatures, TData>, "_features" | "_rowModels">, selector?: (state: TableState<TFeatures>) => TSelected) => AppVueTable<TFeatures, TData, TSelected, TTableComponents, TCellComponents, THeaderComponents>;
   useTableContext: <TData extends RowData = RowData>() => VueTable<TFeatures, TData>;
   useCellContext: <TValue extends CellData = unknown>() => Cell<TFeatures, any, TValue>;
   useHeaderContext: <TValue extends CellData = unknown>() => Header<TFeatures, any, TValue>;

package/dist/createTableHook.js.map CHANGED Viewed

	@@ -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\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<TData extends RowData, TSelected = {}>(\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 { 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\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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"}

package/dist/useTable.cjs CHANGED Viewed

@@ -13,7 +13,7 @@ function getOptionsWithReactiveValues(options) {
 function getReactiveOptionDeps(options) {
 	return Object.keys(options).map((key) => (0, vue.unref)(options[key]));
 }
-function useTable(tableOptions, selector = () => ({})) {
+function useTable(tableOptions, selector) {
 	const syncTableOptions = (table, options) => {
 		table.setOptions(() => getOptionsWithReactiveValues(options));
 	};
@@ -44,7 +44,7 @@ function useTable(tableOptions, selector = () => ({})) {
 		if (controlledValues.length > 0) syncTableOptions(table, mergedOptions);
 	}, { immediate: true });
 	table.Subscribe = ((props) => {
-		const selected = (0, _tanstack_vue_store.useSelector)(props.source ?? table.store, props.selector ?? ((x) => x), { compare: _tanstack_vue_store.shallow });
+		const selected = (0, _tanstack_vue_store.useSelector)(props.source ?? table.store, props.selector, { compare: _tanstack_vue_store.shallow });
 		if (typeof props.children === "function") return props.children(selected.value);
 		return props.children;
 	});

package/dist/useTable.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useTable.cjs","names":["mergeProxy","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 { 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 = ~~{},\~~n> = Table<TFeatures, TData> & {\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 `table.store.state` because it is selected by the `selector` function that 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\nexport function useTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = ~~{},\~~n>(\n tableOptions:\n \| TableOptions<TFeatures, TData>\n \| TableOptionsWithReactiveData<TFeatures, TData>,\n selector: (state: TableState<TFeatures>) => TSelected ~~= () =>\n ({}) as TSelected~~,\n): VueTable<TFeatures, TData, TSelected> {\n const syncTableOptions = (\n table: Table<TFeatures, TData>,\n options: TableOptionsWithReactiveData<TFeatures, TData>,\n ) => {\n table.setOptions(\n () =>\n getOptionsWithReactiveValues(options) as TableOptions<TFeatures, TData>,\n )\n }\n\n const mergedOptions = {\n ...tableOptions,\n _features: {\n coreReativityFeature: vueReactivity(),\n ...tableOptions._features,\n },\n }\n\n const resolvedOptions = mergeProxy(\n getOptionsWithReactiveValues(\n mergedOptions as TableOptionsWithReactiveData<TFeatures, TData>,\n ),\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 mergeProxy(defaultOptions, newOptions)\n },\n },\n ) as TableOptions<TFeatures, TData>\n\n const table = constructTable(resolvedOptions) as VueTable<\n TFeatures,\n TData,\n TSelected\n >\n\n watch(\n () =>\n getReactiveOptionDeps(\n mergedOptions as TableOptionsWithReactiveData<TFeatures, TData>,\n ),\n () => {\n syncTableOptions(table, 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(table, 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 ~~selectFn = props.selector ?? ((x: unknown) => x)\n const~~ selected = useSelector(source as never, ~~selectFn~~ 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,EAAE;AAEnD,MAAK,MAAM,OAAO,OAAO,KAAK,QAAQ,CACpC,iBAAgB,sBACd,QAAQ,KACT;AAGH,QAAOA,+BAAW,SAAS,gBAAgB;;AAG7C,SAAS,sBAGP,SAAyD;AACzD,QAAO,OAAO,KAAK,QAAQ,CAAC,KAAK,uBACzB,QAAQ,KAA6D,CAC5E;;AAiDH,SAAgB,SAKd,cAGA,~~kBACG,EAAE,GACkC~~;CACvC,MAAM,oBACJ,OACA,YACG;AACH,QAAM,iBAEF,6BAA6B,QAAQ,CACxC;;CAGH,MAAM,gBAAgB;EACpB,GAAG;EACH,WAAW;GACT,sBAAsBC,kCAAe;GACrC,GAAG,aAAa;GACjB;EACF;CAiBD,MAAM,iDAfkBD,+BACtB,6BACE,cACD,EACD,EAEE,eACE,gBACA,eACG;AACH,SAAOA,+BAAW,gBAAgB,WAAW;IAEhD,CAGyC,CAAC;AAM7C,sBAEI,sBACE,cACD,QACG;AACJ,mBAAiB,OAAO,cAAc;IAExC,EAAE,WAAW,MAAM,CACpB;AAED,sBACQ;EACJ,MAAM,iCAAwB,aAAa,MAAM;EAGjD,MAAM,iCAAwB,aAAa,MAAM;AAIjD,MAAI,CAAC,gBACH,QAAO,EAAE;EAGX,MAAM,mBAAmC,EAAE;AAE3C,OAAK,MAAM,OAAO,OAAO,KAAK,MAAM,aAAa,EAAE;AACjD,OAAI,EAAE,OAAO,uFAAoB,gBAAkB,UAAS,OAC1D;AAKF,oBAAiB,KAAK,gBAAgB,KAAK;;AAG7C,SAAO;KAER,qBAAqB;AACpB,MAAI,iBAAiB,SAAS,EAC5B,kBAAiB,OAAO,cAAc;IAG1C,EAAE,WAAW,MAAM,CACpB;AAED,OAAM,cAAc,UAOd;~~EAGJ~~,MAAM,~~gDAFS~~,MAAM,UAAU,MAAM,~~OACpB~~,MAAM,~~cAAc~~,~~MAAe~~,~~IACa,EAC/D,~~SAASE,6BACV,CAAC;AACF,MAAI,OAAO,MAAM,aAAa,WAC5B,QAAO,MAAM,SAAS,SAAS,MAA2B;AAE5D,SAAO,MAAM;;CAGf,MAAM,kDAAyB,MAAM,OAAO,SAAS;AAErD,QAAO;EACL,GAAG;EACH,IAAI,QAAQ;AACV,UAAO,WAAW;;EAErB"}
1	+ {"version":3,"file":"useTable.cjs","names":["mergeProxy","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 { 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> = Table<TFeatures, TData> & {\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 `table.store.state` because it is selected by the `selector` function that 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\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(\n () =>\n getOptionsWithReactiveValues(options) as TableOptions<TFeatures, TData>,\n )\n }\n\n const mergedOptions = {\n ...tableOptions,\n _features: {\n coreReativityFeature: vueReactivity(),\n ...tableOptions._features,\n },\n }\n\n const resolvedOptions = mergeProxy(\n getOptionsWithReactiveValues(\n mergedOptions as TableOptionsWithReactiveData<TFeatures, TData>,\n ),\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 mergeProxy(defaultOptions, newOptions)\n },\n },\n ) as TableOptions<TFeatures, TData>\n\n const table = constructTable(resolvedOptions) as VueTable<\n TFeatures,\n TData,\n TSelected\n >\n\n watch(\n () =>\n getReactiveOptionDeps(\n mergedOptions as TableOptionsWithReactiveData<TFeatures, TData>,\n ),\n () => {\n syncTableOptions(table, 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(table, 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,EAAE;AAEnD,MAAK,MAAM,OAAO,OAAO,KAAK,QAAQ,CACpC,iBAAgB,sBACd,QAAQ,KACT;AAGH,QAAOA,+BAAW,SAAS,gBAAgB;;AAG7C,SAAS,sBAGP,SAAyD;AACzD,QAAO,OAAO,KAAK,QAAQ,CAAC,KAAK,uBACzB,QAAQ,KAA6D,CAC5E;;AAiDH,SAAgB,SAKd,cAGA,UACuC;CACvC,MAAM,oBACJ,OACA,YACG;AACH,QAAM,iBAEF,6BAA6B,QAAQ,CACxC;;CAGH,MAAM,gBAAgB;EACpB,GAAG;EACH,WAAW;GACT,sBAAsBC,kCAAe;GACrC,GAAG,aAAa;GACjB;EACF;CAiBD,MAAM,iDAfkBD,+BACtB,6BACE,cACD,EACD,EAEE,eACE,gBACA,eACG;AACH,SAAOA,+BAAW,gBAAgB,WAAW;IAEhD,CAGyC,CAAC;AAM7C,sBAEI,sBACE,cACD,QACG;AACJ,mBAAiB,OAAO,cAAc;IAExC,EAAE,WAAW,MAAM,CACpB;AAED,sBACQ;EACJ,MAAM,iCAAwB,aAAa,MAAM;EAGjD,MAAM,iCAAwB,aAAa,MAAM;AAIjD,MAAI,CAAC,gBACH,QAAO,EAAE;EAGX,MAAM,mBAAmC,EAAE;AAE3C,OAAK,MAAM,OAAO,OAAO,KAAK,MAAM,aAAa,EAAE;AACjD,OAAI,EAAE,OAAO,uFAAoB,gBAAkB,UAAS,OAC1D;AAKF,oBAAiB,KAAK,gBAAgB,KAAK;;AAG7C,SAAO;KAER,qBAAqB;AACpB,MAAI,iBAAiB,SAAS,EAC5B,kBAAiB,OAAO,cAAc;IAG1C,EAAE,WAAW,MAAM,CACpB;AAED,OAAM,cAAc,UAOd;EAEJ,MAAM,gDADS,MAAM,UAAU,MAAM,OACS,MAAM,UAAmB,EACrE,SAASE,6BACV,CAAC;AACF,MAAI,OAAO,MAAM,aAAa,WAC5B,QAAO,MAAM,SAAS,SAAS,MAA2B;AAE5D,SAAO,MAAM;;CAGf,MAAM,kDAAyB,MAAM,OAAO,SAAS;AAErD,QAAO;EACL,GAAG;EACH,IAAI,QAAQ;AACV,UAAO,WAAW;;EAErB"}

package/dist/useTable.d.cts CHANGED Viewed

@@ -5,7 +5,7 @@ import { Atom, ReadonlyAtom, ReadonlyStore, Store } from "@tanstack/vue-store";
 //#region src/useTable.d.ts
 type SubscribeSource<TValue> = Atom<TValue> | ReadonlyAtom<TValue> | Store<TValue> | ReadonlyStore<TValue>;
 type TableOptionsWithReactiveData<TFeatures extends TableFeatures, TData extends RowData> = { [K in keyof TableOptions<TFeatures, TData>]: K extends 'data' ? MaybeRef<ReadonlyArray<TData>> : MaybeRef<TableOptions<TFeatures, TData>[K]> };
-type VueTable<TFeatures extends TableFeatures, TData extends RowData, TSelected = {}> = Table<TFeatures, TData> & {
+type VueTable<TFeatures extends TableFeatures, TData extends RowData, TSelected = TableState<TFeatures>> = Table<TFeatures, TData> & {
   /**
    * Store mode: `selector` required. Source mode: pass `source` (atom or store); omit
    * `selector` for the whole value (identity), or pass `selector` to project. Split
@@ -37,7 +37,7 @@ type VueTable<TFeatures extends TableFeatures, TData extends RowData, TSelected
    */
   readonly state: Readonly<TSelected>;
 };
-declare function useTable<TFeatures extends TableFeatures, TData extends RowData, TSelected = {}>(tableOptions: TableOptions<TFeatures, TData> | TableOptionsWithReactiveData<TFeatures, TData>, selector?: (state: TableState<TFeatures>) => TSelected): VueTable<TFeatures, TData, TSelected>;
+declare function useTable<TFeatures extends TableFeatures, TData extends RowData, TSelected = TableState<TFeatures>>(tableOptions: TableOptions<TFeatures, TData> | TableOptionsWithReactiveData<TFeatures, TData>, selector?: (state: TableState<TFeatures>) => TSelected): VueTable<TFeatures, TData, TSelected>;
 //#endregion
 export { SubscribeSource, TableOptionsWithReactiveData, VueTable, useTable };
 //# sourceMappingURL=useTable.d.cts.map

package/dist/useTable.d.ts CHANGED Viewed

@@ -5,7 +5,7 @@ import { Atom, ReadonlyAtom, ReadonlyStore, Store } from "@tanstack/vue-store";
 //#region src/useTable.d.ts
 type SubscribeSource<TValue> = Atom<TValue> | ReadonlyAtom<TValue> | Store<TValue> | ReadonlyStore<TValue>;
 type TableOptionsWithReactiveData<TFeatures extends TableFeatures, TData extends RowData> = { [K in keyof TableOptions<TFeatures, TData>]: K extends 'data' ? MaybeRef<ReadonlyArray<TData>> : MaybeRef<TableOptions<TFeatures, TData>[K]> };
-type VueTable<TFeatures extends TableFeatures, TData extends RowData, TSelected = {}> = Table<TFeatures, TData> & {
+type VueTable<TFeatures extends TableFeatures, TData extends RowData, TSelected = TableState<TFeatures>> = Table<TFeatures, TData> & {
   /**
    * Store mode: `selector` required. Source mode: pass `source` (atom or store); omit
    * `selector` for the whole value (identity), or pass `selector` to project. Split
@@ -37,7 +37,7 @@ type VueTable<TFeatures extends TableFeatures, TData extends RowData, TSelected
    */
   readonly state: Readonly<TSelected>;
 };
-declare function useTable<TFeatures extends TableFeatures, TData extends RowData, TSelected = {}>(tableOptions: TableOptions<TFeatures, TData> | TableOptionsWithReactiveData<TFeatures, TData>, selector?: (state: TableState<TFeatures>) => TSelected): VueTable<TFeatures, TData, TSelected>;
+declare function useTable<TFeatures extends TableFeatures, TData extends RowData, TSelected = TableState<TFeatures>>(tableOptions: TableOptions<TFeatures, TData> | TableOptionsWithReactiveData<TFeatures, TData>, selector?: (state: TableState<TFeatures>) => TSelected): VueTable<TFeatures, TData, TSelected>;
 //#endregion
 export { SubscribeSource, TableOptionsWithReactiveData, VueTable, useTable };
 //# sourceMappingURL=useTable.d.ts.map

package/dist/useTable.js CHANGED Viewed

@@ -13,7 +13,7 @@ function getOptionsWithReactiveValues(options) {
 function getReactiveOptionDeps(options) {
 	return Object.keys(options).map((key) => unref(options[key]));
 }
-function useTable(tableOptions, selector = () => ({})) {
+function useTable(tableOptions, selector) {
 	const syncTableOptions = (table, options) => {
 		table.setOptions(() => getOptionsWithReactiveValues(options));
 	};
@@ -44,7 +44,7 @@ function useTable(tableOptions, selector = () => ({})) {
 		if (controlledValues.length > 0) syncTableOptions(table, mergedOptions);
 	}, { immediate: true });
 	table.Subscribe = ((props) => {
-		const selected = useSelector(props.source ?? table.store, props.selector ?? ((x) => x), { compare: shallow });
+		const selected = useSelector(props.source ?? table.store, props.selector, { compare: shallow });
 		if (typeof props.children === "function") return props.children(selected.value);
 		return props.children;
 	});

package/dist/useTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useTable.js","names":[],"sources":["../src/useTable.ts"],"sourcesContent":["import { unref, watch } from 'vue'\nimport { constructTable } from '@tanstack/table-core'\nimport { shallow, useSelector } from '@tanstack/vue-store'\nimport { 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 = ~~{},\~~n> = Table<TFeatures, TData> & {\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 `table.store.state` because it is selected by the `selector` function that 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\nexport function useTable<\n TFeatures extends TableFeatures,\n TData extends RowData,\n TSelected = ~~{},\~~n>(\n tableOptions:\n \| TableOptions<TFeatures, TData>\n \| TableOptionsWithReactiveData<TFeatures, TData>,\n selector: (state: TableState<TFeatures>) => TSelected ~~= () =>\n ({}) as TSelected~~,\n): VueTable<TFeatures, TData, TSelected> {\n const syncTableOptions = (\n table: Table<TFeatures, TData>,\n options: TableOptionsWithReactiveData<TFeatures, TData>,\n ) => {\n table.setOptions(\n () =>\n getOptionsWithReactiveValues(options) as TableOptions<TFeatures, TData>,\n )\n }\n\n const mergedOptions = {\n ...tableOptions,\n _features: {\n coreReativityFeature: vueReactivity(),\n ...tableOptions._features,\n },\n }\n\n const resolvedOptions = mergeProxy(\n getOptionsWithReactiveValues(\n mergedOptions as TableOptionsWithReactiveData<TFeatures, TData>,\n ),\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 mergeProxy(defaultOptions, newOptions)\n },\n },\n ) as TableOptions<TFeatures, TData>\n\n const table = constructTable(resolvedOptions) as VueTable<\n TFeatures,\n TData,\n TSelected\n >\n\n watch(\n () =>\n getReactiveOptionDeps(\n mergedOptions as TableOptionsWithReactiveData<TFeatures, TData>,\n ),\n () => {\n syncTableOptions(table, 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(table, 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 ~~selectFn = props.selector ?? ((x: unknown) => x)\n const~~ selected = useSelector(source as never, ~~selectFn~~ 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,EAAE;AAEnD,MAAK,MAAM,OAAO,OAAO,KAAK,QAAQ,CACpC,iBAAgB,OAAO,MACrB,QAAQ,KACT;AAGH,QAAO,WAAW,SAAS,gBAAgB;;AAG7C,SAAS,sBAGP,SAAyD;AACzD,QAAO,OAAO,KAAK,QAAQ,CAAC,KAAK,QAC/B,MAAM,QAAQ,KAA6D,CAC5E;;AAiDH,SAAgB,SAKd,cAGA,~~kBACG,EAAE,GACkC~~;CACvC,MAAM,oBACJ,OACA,YACG;AACH,QAAM,iBAEF,6BAA6B,QAAQ,CACxC;;CAGH,MAAM,gBAAgB;EACpB,GAAG;EACH,WAAW;GACT,sBAAsB,eAAe;GACrC,GAAG,aAAa;GACjB;EACF;CAiBD,MAAM,QAAQ,eAfU,WACtB,6BACE,cACD,EACD,EAEE,eACE,gBACA,eACG;AACH,SAAO,WAAW,gBAAgB,WAAW;IAEhD,CAGyC,CAAC;AAM7C,aAEI,sBACE,cACD,QACG;AACJ,mBAAiB,OAAO,cAAc;IAExC,EAAE,WAAW,MAAM,CACpB;AAED,aACQ;EACJ,MAAM,kBAAkB,MAAM,aAAa,MAAM;EAGjD,MAAM,kBAAkB,MAAM,aAAa,MAAM;AAIjD,MAAI,CAAC,gBACH,QAAO,EAAE;EAGX,MAAM,mBAAmC,EAAE;AAE3C,OAAK,MAAM,OAAO,OAAO,KAAK,MAAM,aAAa,EAAE;AACjD,OAAI,EAAE,OAAO,uFAAoB,gBAAkB,UAAS,OAC1D;AAKF,oBAAiB,KAAK,gBAAgB,KAAK;;AAG7C,SAAO;KAER,qBAAqB;AACpB,MAAI,iBAAiB,SAAS,EAC5B,kBAAiB,OAAO,cAAc;IAG1C,EAAE,WAAW,MAAM,CACpB;AAED,OAAM,cAAc,UAOd;~~EAGJ~~,MAAM,WAAW,~~YAFF~~,MAAM,UAAU,MAAM,~~OACpB~~,MAAM,~~cAAc~~,~~MAAe~~,~~IACa,EAC/D,~~SAAS,SACV,CAAC;AACF,MAAI,OAAO,MAAM,aAAa,WAC5B,QAAO,MAAM,SAAS,SAAS,MAA2B;AAE5D,SAAO,MAAM;;CAGf,MAAM,aAAa,YAAY,MAAM,OAAO,SAAS;AAErD,QAAO;EACL,GAAG;EACH,IAAI,QAAQ;AACV,UAAO,WAAW;;EAErB"}
1	+ {"version":3,"file":"useTable.js","names":[],"sources":["../src/useTable.ts"],"sourcesContent":["import { unref, watch } from 'vue'\nimport { constructTable } from '@tanstack/table-core'\nimport { shallow, useSelector } from '@tanstack/vue-store'\nimport { 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> = Table<TFeatures, TData> & {\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 `table.store.state` because it is selected by the `selector` function that 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\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(\n () =>\n getOptionsWithReactiveValues(options) as TableOptions<TFeatures, TData>,\n )\n }\n\n const mergedOptions = {\n ...tableOptions,\n _features: {\n coreReativityFeature: vueReactivity(),\n ...tableOptions._features,\n },\n }\n\n const resolvedOptions = mergeProxy(\n getOptionsWithReactiveValues(\n mergedOptions as TableOptionsWithReactiveData<TFeatures, TData>,\n ),\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 mergeProxy(defaultOptions, newOptions)\n },\n },\n ) as TableOptions<TFeatures, TData>\n\n const table = constructTable(resolvedOptions) as VueTable<\n TFeatures,\n TData,\n TSelected\n >\n\n watch(\n () =>\n getReactiveOptionDeps(\n mergedOptions as TableOptionsWithReactiveData<TFeatures, TData>,\n ),\n () => {\n syncTableOptions(table, 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(table, 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,EAAE;AAEnD,MAAK,MAAM,OAAO,OAAO,KAAK,QAAQ,CACpC,iBAAgB,OAAO,MACrB,QAAQ,KACT;AAGH,QAAO,WAAW,SAAS,gBAAgB;;AAG7C,SAAS,sBAGP,SAAyD;AACzD,QAAO,OAAO,KAAK,QAAQ,CAAC,KAAK,QAC/B,MAAM,QAAQ,KAA6D,CAC5E;;AAiDH,SAAgB,SAKd,cAGA,UACuC;CACvC,MAAM,oBACJ,OACA,YACG;AACH,QAAM,iBAEF,6BAA6B,QAAQ,CACxC;;CAGH,MAAM,gBAAgB;EACpB,GAAG;EACH,WAAW;GACT,sBAAsB,eAAe;GACrC,GAAG,aAAa;GACjB;EACF;CAiBD,MAAM,QAAQ,eAfU,WACtB,6BACE,cACD,EACD,EAEE,eACE,gBACA,eACG;AACH,SAAO,WAAW,gBAAgB,WAAW;IAEhD,CAGyC,CAAC;AAM7C,aAEI,sBACE,cACD,QACG;AACJ,mBAAiB,OAAO,cAAc;IAExC,EAAE,WAAW,MAAM,CACpB;AAED,aACQ;EACJ,MAAM,kBAAkB,MAAM,aAAa,MAAM;EAGjD,MAAM,kBAAkB,MAAM,aAAa,MAAM;AAIjD,MAAI,CAAC,gBACH,QAAO,EAAE;EAGX,MAAM,mBAAmC,EAAE;AAE3C,OAAK,MAAM,OAAO,OAAO,KAAK,MAAM,aAAa,EAAE;AACjD,OAAI,EAAE,OAAO,uFAAoB,gBAAkB,UAAS,OAC1D;AAKF,oBAAiB,KAAK,gBAAgB,KAAK;;AAG7C,SAAO;KAER,qBAAqB;AACpB,MAAI,iBAAiB,SAAS,EAC5B,kBAAiB,OAAO,cAAc;IAG1C,EAAE,WAAW,MAAM,CACpB;AAED,OAAM,cAAc,UAOd;EAEJ,MAAM,WAAW,YADF,MAAM,UAAU,MAAM,OACS,MAAM,UAAmB,EACrE,SAAS,SACV,CAAC;AACF,MAAI,OAAO,MAAM,aAAa,WAC5B,QAAO,MAAM,SAAS,SAAS,MAA2B;AAE5D,SAAO,MAAM;;CAGf,MAAM,aAAa,YAAY,MAAM,OAAO,SAAS;AAErD,QAAO;EACL,GAAG;EACH,IAAI,QAAQ;AACV,UAAO,WAAW;;EAErB"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/vue-table",
-  "version": "9.0.0-alpha.44",
+  "version": "9.0.0-alpha.45",
   "description": "Headless UI for building powerful tables & datagrids for Vue.",
   "author": "Tanner Linsley",
   "license": "MIT",

package/src/createTableHook.ts CHANGED Viewed

@@ -392,7 +392,10 @@ export function createTableHook<
     },
   })
-  function useAppTable<TData extends RowData, TSelected = {}>(
+  function useAppTable<
+    TData extends RowData,
+    TSelected = TableState<TFeatures>,
+  >(
     tableOptions: Omit<
       TableOptionsWithReactiveData<TFeatures, TData>,
       '_features' | '_rowModels'

package/src/useTable.ts CHANGED Viewed

@@ -61,7 +61,7 @@ function getReactiveOptionDeps<
 export type VueTable<
   TFeatures extends TableFeatures,
   TData extends RowData,
-  TSelected = {},
+  TSelected = TableState<TFeatures>,
 > = Table<TFeatures, TData> & {
   /**
    * Store mode: `selector` required. Source mode: pass `source` (atom or store); omit
@@ -107,13 +107,12 @@ export type VueTable<
 export function useTable<
   TFeatures extends TableFeatures,
   TData extends RowData,
-  TSelected = {},
+  TSelected = TableState<TFeatures>,
 >(
   tableOptions:
     | TableOptions<TFeatures, TData>
     | TableOptionsWithReactiveData<TFeatures, TData>,
-  selector: (state: TableState<TFeatures>) => TSelected = () =>
-    ({}) as TSelected,
+  selector?: (state: TableState<TFeatures>) => TSelected,
 ): VueTable<TFeatures, TData, TSelected> {
   const syncTableOptions = (
     table: Table<TFeatures, TData>,
@@ -209,8 +208,7 @@ export function useTable<
       | Array<VNode>
   }) => {
     const source = props.source ?? table.store
-    const selectFn = props.selector ?? ((x: unknown) => x)
-    const selected = useSelector(source as never, selectFn as never, {
+    const selected = useSelector(source as never, props.selector as never, {
       compare: shallow,
     })
     if (typeof props.children === 'function') {