@tanstack/vue-table 9.0.0-beta.52 → 9.0.0-beta.54

package/src/merge-proxy.ts

@@ -1,132 +0,0 @@
-function trueFn() {
-  return true
-}
-
-const $PROXY = Symbol('merge-proxy')
-const $SOURCES = Symbol('merge-proxy-sources')
-
-// https://github.com/solidjs/solid/blob/c20ca4fd8c36bc0522fedb2c7f38a110b7ee2663/packages/solid/src/render/component.ts#L51-L118
-const propTraps: ProxyHandler<{
-  get: (k: string | number | symbol) => any
-  has: (k: string | number | symbol) => boolean
-  keys: () => Array<string>
-  sources: Array<any>
-}> = {
-  get(_, property, receiver) {
-    if (property === $PROXY) return receiver
-    if (property === $SOURCES) return _.sources
-    return _.get(property)
-  },
-  has(_, property) {
-    return _.has(property)
-  },
-  set: trueFn,
-  deleteProperty: trueFn,
-  getOwnPropertyDescriptor(_, property) {
-    return {
-      configurable: true,
-      enumerable: true,
-      get() {
-        return _.get(property)
-      },
-      set: trueFn,
-      deleteProperty: trueFn,
-    }
-  },
-  ownKeys(_) {
-    return _.keys()
-  },
-}
-
-type UnboxLazy<T> = T extends () => infer U ? U : T
-type BoxedTupleTypes<T extends Array<any>> = {
-  [P in keyof T]: [UnboxLazy<T[P]>]
-}[Exclude<keyof T, keyof Array<any>>]
-type UnionToIntersection<T> = (T extends any ? (k: T) => void : never) extends (
-  k: infer I,
-) => void
-  ? I
-  : never
-type UnboxIntersection<T> = T extends { 0: infer U } ? U : never
-type MergeProxy<T extends Array<any>> = UnboxIntersection<
-  UnionToIntersection<BoxedTupleTypes<T>>
->
-
-function resolveSource(s: any) {
-  return s && typeof s === 'object' && 'value' in s ? s.value : s
-}
-
-export function mergeProxy<T extends Array<any>>(...sources: T): MergeProxy<T>
-export function mergeProxy(...sources: any): any {
-  const flattenedSources = sources.flatMap((source: any) => {
-    if (
-      typeof source === 'object' &&
-      source !== null &&
-      $SOURCES in source &&
-      Array.isArray(source[$SOURCES])
-    ) {
-      return source[$SOURCES]
-    }
-
-    return [source]
-  })
-
-  return new Proxy(
-    {
-      sources: flattenedSources,
-      get(property: string | number | symbol) {
-        for (let i = flattenedSources.length - 1; i >= 0; i--) {
-          const v = resolveSource(flattenedSources[i])[property]
-          if (v !== undefined) return v
-        }
-      },
-      has(property: string | number | symbol) {
-        for (let i = flattenedSources.length - 1; i >= 0; i--) {
-          if (property in resolveSource(flattenedSources[i])) return true
-        }
-        return false
-      },
-      keys() {
-        const keys = []
-        for (const source of flattenedSources)
-          keys.push(...Object.keys(resolveSource(source)))
-        return [...Array.from(new Set(keys))]
-      },
-    },
-    propTraps,
-  )
-}
-
-/**
- * Merges objects together by eagerly resolving all values into a flat object.
- *
- * Unlike `mergeProxy`, this does not preserve lazy proxy getters. Use this for
- * repeated option update paths so each merge produces a plain object instead
- * of accumulating a longer source list over time.
- */
-export function flatMerge<T>(source: T): T
-export function flatMerge<T, U>(source: T, source1: U): T & U
-export function flatMerge<T, U, V>(source: T, source1: U, source2: V): T & U & V
-export function flatMerge<T, U, V, W>(
-  source: T,
-  source1: U,
-  source2: V,
-  source3: W,
-): T & U & V & W
-export function flatMerge(...sources: any): any {
-  const result: Record<PropertyKey, unknown> = {}
-
-  for (let source of sources) {
-    source = resolveSource(source)
-    if (!source) continue
-
-    for (const key of Reflect.ownKeys(source)) {
-      const value = (source as Record<PropertyKey, unknown>)[key]
-      if (value !== undefined) {
-        result[key] = value
-      }
-    }
-  }
-
-  return result
-}

package/src/reactivity.ts

@@ -1,88 +0,0 @@
-import { computed, shallowRef, watch } from 'vue'
-import type {
-  TableAtomOptions,
-  TableReactivityBindings,
-} from '@tanstack/table-core/reactivity'
-import type {
-  Atom,
-  Observer,
-  ReadonlyAtom,
-  Subscription,
-} from '@tanstack/store'
-import type { ComputedRef, ShallowRef } from 'vue'
-
-function observerToCallback<T>(
-  observerOrNext: Observer<T> | ((value: T) => void),
-): (value: T) => void {
-  return typeof observerOrNext === 'function'
-    ? observerOrNext
-    : (value) => observerOrNext.next?.(value)
-}
-
-function refToReadonlyAtom<T>(
-  source: ComputedRef<T> | ShallowRef<T>,
-): ReadonlyAtom<T> {
-  return Object.assign(source, {
-    get: () => source.value,
-    subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {
-      const stop = watch(source, observerToCallback(observerOrNext), {
-        flush: 'sync',
-      })
-      return { unsubscribe: stop }
-    }) as ReadonlyAtom<T>['subscribe'],
-  })
-}
-
-function refToWritableAtom<T>(source: ShallowRef<T>): Atom<T> {
-  return Object.assign(source, {
-    set: (updater: T | ((prevVal: T) => T)) => {
-      source.value =
-        typeof updater === 'function'
-          ? (updater as (prevVal: T) => T)(source.value)
-          : updater
-    },
-    get: () => source.value,
-    subscribe: ((observerOrNext: Observer<T> | ((value: T) => void)) => {
-      const stop = watch(source, observerToCallback(observerOrNext), {
-        flush: 'sync',
-      })
-      return { unsubscribe: stop }
-    }) as Atom<T>['subscribe'],
-  })
-}
-
-/**
- * Creates the table-core reactivity bindings used by the Vue adapter.
- *
- * Table state atoms are backed by TanStack Store atoms. The options store stays
- * framework-native because row-model APIs read `table.options` directly during
- * render. Readonly table atoms bridge Store dependency tracking into Vue computed
- * refs.
- */
-export function vueReactivity(): TableReactivityBindings {
-  const subscriptions = new Set<Subscription>()
-
-  return {
-    createOptionsStore: true,
-    wrapExternalAtoms: true,
-    addSubscription: (subscription) => {
-      subscriptions.add(subscription)
-    },
-    unmount: () => {
-      subscriptions.forEach((s) => s.unsubscribe())
-      subscriptions.clear()
-    },
-    schedule: (fn) => queueMicrotask(() => fn()),
-    createReadonlyAtom: <T>(fn: () => T, _options?: TableAtomOptions<T>) => {
-      return refToReadonlyAtom(computed(() => fn()))
-    },
-    createWritableAtom: <T>(
-      value: T,
-      _options?: TableAtomOptions<T>,
-    ): Atom<T> => {
-      return refToWritableAtom(shallowRef(value) as ShallowRef<T>)
-    },
-    untrack: (fn) => fn(),
-    batch: (fn) => fn(),
-  }
-}

package/src/static-functions.ts

@@ -1 +0,0 @@
-export * from '@tanstack/table-core/static-functions'

package/src/useTable.ts

@@ -1,173 +0,0 @@
-import { getCurrentScope, onScopeDispose, unref, watch } from 'vue'
-import { constructTable } from '@tanstack/table-core'
-import { flatMerge, mergeProxy } from './merge-proxy'
-import { vueReactivity } from './reactivity'
-import type {
-  RowData,
-  Table,
-  TableFeatures,
-  TableOptions,
-} from '@tanstack/table-core'
-import type { MaybeRef, VNode } from 'vue'
-
-export 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]>
-}
-
-function getOptionsWithReactiveValues<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
->(options: TableOptionsWithReactiveData<TFeatures, TData>) {
-  const resolvedOptions: Record<string, unknown> = {}
-
-  for (const key of Object.keys(options)) {
-    resolvedOptions[key] = unref(
-      options[key as keyof TableOptionsWithReactiveData<TFeatures, TData>],
-    )
-  }
-
-  return mergeProxy(options, resolvedOptions)
-}
-
-function getReactiveOptionDeps<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
->(options: TableOptionsWithReactiveData<TFeatures, TData>) {
-  return Object.keys(options).map((key) =>
-    unref(options[key as keyof TableOptionsWithReactiveData<TFeatures, TData>]),
-  )
-}
-
-export type VueTable<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
-> = Table<TFeatures, TData> & {
-  /** Creates a reactive render boundary. The child function reads the table
-   * atoms it needs, so Vue only tracks those atom reads.
-   */
-  Subscribe: (props: {
-    children: (atoms: Table<TFeatures, TData>['atoms']) => VNode | Array<VNode>
-  }) => VNode | Array<VNode>
-}
-
-/**
- * Creates a Vue table instance backed by Vue-aware TanStack Store atoms.
- *
- * Table options may contain Vue refs or computed values. The adapter unwraps
- * those reactive inputs, watches them with synchronous flushing, and keeps the
- * table options in sync. Use `table.Subscribe` or native Vue computed values
- * around `table.atoms.<slice>.get()` for selected reactive reads.
- *
- * @example
- * ```ts
- * const table = useTable(
- *   {
- *     features,
- *     columns,
- *     data,
- *   },
- * )
- * ```
- */
-export function useTable<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
->(
-  tableOptions:
-    | TableOptions<TFeatures, TData>
-    | TableOptionsWithReactiveData<TFeatures, TData>,
-): VueTable<TFeatures, TData> {
-  const syncTableOptions = (
-    table: Table<TFeatures, TData>,
-    options: TableOptionsWithReactiveData<TFeatures, TData>,
-  ) => {
-    table.setOptions((prev) =>
-      flatMerge(prev, getOptionsWithReactiveValues(options)),
-    )
-  }
-
-  const reactivity = vueReactivity()
-
-  const mergedOptions = mergeProxy(tableOptions, {
-    features: {
-      coreReactivityFeature: reactivity,
-      ...(unref(tableOptions.features) ?? {}),
-    },
-  }) as TableOptionsWithReactiveData<TFeatures, TData>
-
-  const resolvedOptions = mergeProxy(
-    getOptionsWithReactiveValues(mergedOptions),
-    {
-      // Remove state and onStateChange - store handles it internally
-      mergeOptions: (
-        defaultOptions: TableOptions<TFeatures, TData>,
-        newOptions: Partial<TableOptions<TFeatures, TData>>,
-      ) => {
-        return flatMerge(defaultOptions, newOptions)
-      },
-    },
-  ) as TableOptions<TFeatures, TData>
-
-  const coreTable = constructTable(resolvedOptions)
-  const table = coreTable as unknown as VueTable<TFeatures, TData>
-
-  if (getCurrentScope()) {
-    onScopeDispose(() => reactivity.unmount?.())
-  }
-
-  watch(
-    () => getReactiveOptionDeps(mergedOptions),
-    () => {
-      syncTableOptions(coreTable, mergedOptions)
-    },
-    { immediate: true },
-  )
-
-  watch(
-    () => {
-      const controlledState = unref(tableOptions.state) as
-        | Record<string, unknown>
-        | undefined
-      const controlledAtoms = unref(tableOptions.atoms) as
-        | Record<string, unknown>
-        | undefined
-
-      if (!controlledState) {
-        return []
-      }
-
-      const controlledValues: Array<unknown> = []
-
-      for (const key of Object.keys(table.initialState)) {
-        if (!(key in controlledState) || controlledAtoms?.[key] !== undefined) {
-          continue
-        }
-
-        // Reading only controlled state slices here lets Vue subscribe to
-        // getters/computed values that are passed through `options.state`.
-        controlledValues.push(controlledState[key])
-      }
-
-      return controlledValues
-    },
-    (controlledValues) => {
-      if (controlledValues.length > 0) {
-        syncTableOptions(coreTable, mergedOptions)
-      }
-    },
-    { immediate: true },
-  )
-
-  table.Subscribe = (props: {
-    children: (atoms: Table<TFeatures, TData>['atoms']) => VNode | Array<VNode>
-  }) => {
-    return props.children(table.atoms as Table<TFeatures, TData>['atoms'])
-  }
-
-  return table
-}