@wagmi/vue 0.0.0-canary-20240515232917

package/src/types/properties.ts

@@ -0,0 +1,27 @@
+import type { DefaultError, QueryKey } from '@tanstack/vue-query'
+import type { Config } from '@wagmi/core'
+import type { MaybeRef } from 'vue'
+import type { UseQueryParameters } from '../utils/query.js'
+import type { DeepUnwrapRef } from './ref.js'
+
+export type ConfigParameter<config extends Config = Config> = {
+  config?: Config | config | undefined
+}
+
+export type EnabledParameter = {
+  enabled?: MaybeRef<boolean> | undefined
+}
+
+export type QueryParameter<
+  queryFnData = unknown,
+  error = DefaultError,
+  data = queryFnData,
+  queryKey extends QueryKey = QueryKey,
+> = {
+  query?:
+    | Omit<
+        DeepUnwrapRef<UseQueryParameters<queryFnData, error, data, queryKey>>,
+        'queryFn' | 'queryHash' | 'queryKey' | 'queryKeyHashFn' | 'throwOnError'
+      >
+    | undefined
+}

package/src/types/ref.ts

@@ -0,0 +1,36 @@
+// Credit: https://github.com/TanStack/query/blob/01ce023826b81e6c41e354f27691f65c9725af67/packages/vue-query/src/types.ts
+
+import type { Config, Connector } from '@wagmi/core'
+import type { MaybeRef, Ref, UnwrapRef } from 'vue'
+
+type Primitive = string | number | boolean | bigint | symbol | undefined | null
+type UnwrapLeaf =
+  | Primitive
+  | Function
+  | Date
+  | Error
+  | RegExp
+  | Map<any, any>
+  | WeakMap<any, any>
+  | Set<any>
+  | WeakSet<any>
+
+export type DeepMaybeRef<value> = MaybeRef<
+  value extends Function | Config | Connector
+    ? value
+    : value extends object | any[]
+    ? {
+        [key in keyof value]: DeepMaybeRef<value[key]>
+      }
+    : value
+>
+
+export type DeepUnwrapRef<T> = T extends UnwrapLeaf
+  ? T
+  : T extends Ref<infer U>
+  ? DeepUnwrapRef<U>
+  : T extends {}
+  ? {
+      [Property in keyof T]: DeepUnwrapRef<T[Property]>
+    }
+  : UnwrapRef<T>

package/src/utils/cloneDeep.ts

@@ -0,0 +1,43 @@
+// Credit: https://github.com/TanStack/query/blob/01ce023826b81e6c41e354f27691f65c9725af67/packages/vue-query/src/utils.ts
+
+import { isRef, unref } from 'vue'
+
+import type { DeepMaybeRef, DeepUnwrapRef } from '../types/ref.js'
+
+function cloneDeep<value>(
+  value: DeepMaybeRef<value>,
+  customize?: (val: DeepMaybeRef<value>) => value | undefined,
+): value {
+  if (customize) {
+    const result = customize(value)
+    // If it's a ref of undefined, return undefined
+    if (result === undefined && isRef(value)) return result as value
+    if (result !== undefined) return result
+  }
+
+  if (Array.isArray(value))
+    return value.map((val) => cloneDeep(val, customize)) as unknown as value
+
+  if (typeof value === 'object' && isPlainObject(value)) {
+    const entries = Object.entries(value).map(([key, val]) => [
+      key,
+      cloneDeep(val, customize),
+    ])
+    return Object.fromEntries(entries)
+  }
+
+  return value as value
+}
+
+export function deepUnref<value>(value: value): DeepUnwrapRef<value> {
+  return cloneDeep(value as any, (val) => {
+    if (isRef(val)) return deepUnref(unref(val))
+    return undefined
+  })
+}
+
+function isPlainObject(value: unknown): value is Object {
+  if (Object.prototype.toString.call(value) !== '[object Object]') return false
+  const prototype = Object.getPrototypeOf(value)
+  return prototype === null || prototype === Object.prototype
+}

package/src/utils/getVersion.ts

@@ -0,0 +1,3 @@
+import { version } from '../version.js'
+
+export const getVersion = () => `@wagmi/vue@${version}`

package/src/utils/query.ts

@@ -0,0 +1,161 @@
+import {
+  type DefaultError,
+  type MutationObserverOptions,
+  type QueryKey,
+  type UseMutationReturnType as tanstack_UseMutationReturnType,
+  type UseQueryOptions,
+  type UseQueryReturnType as tanstack_UseQueryReturnType,
+  useMutation,
+  useQuery as tanstack_useQuery,
+} from '@tanstack/vue-query'
+import {
+  type Evaluate,
+  type ExactPartial,
+  type Omit,
+  type UnionOmit,
+} from '@wagmi/core/internal'
+import { hashFn } from '@wagmi/core/query'
+import { type MaybeRef, computed, unref } from 'vue'
+
+import type { DeepMaybeRef, DeepUnwrapRef } from '../types/ref.js'
+
+export type UseMutationParameters<
+  data = unknown,
+  error = Error,
+  variables = void,
+  context = unknown,
+> = Evaluate<
+  DeepMaybeRef<
+    Omit<
+      DeepUnwrapRef<
+        MutationObserverOptions<data, error, Evaluate<variables>, context>
+      >,
+      'mutationFn' | 'mutationKey' | 'throwOnError'
+    >
+  >
+>
+
+export type UseMutationReturnType<
+  data = unknown,
+  error = Error,
+  variables = void,
+  context = unknown,
+> = Evaluate<
+  UnionOmit<
+    tanstack_UseMutationReturnType<data, error, variables, context>,
+    'mutate' | 'mutateAsync'
+  >
+>
+
+export { useMutation }
+
+////////////////////////////////////////////////////////////////////////////////
+
+export type UseQueryParameters<
+  queryFnData = unknown,
+  error = DefaultError,
+  data = queryFnData,
+  queryKey extends QueryKey = QueryKey,
+> = Evaluate<
+  DeepMaybeRef<
+    ExactPartial<
+      Omit<
+        DeepUnwrapRef<
+          UseQueryOptions<queryFnData, error, data, queryFnData, queryKey>
+        >,
+        'initialData'
+      >
+    > & {
+      // Fix `initialData` type
+      initialData?:
+        | DeepUnwrapRef<
+            UseQueryOptions<queryFnData, error, data, queryFnData, queryKey>
+          >['initialData']
+        | undefined
+    }
+  >
+>
+
+export type UseQueryReturnType<data = unknown, error = DefaultError> = Evaluate<
+  tanstack_UseQueryReturnType<data, error> & {
+    queryKey: QueryKey
+  }
+>
+
+// Adding some basic customization.
+// Ideally we don't have this function, but `import('@tanstack/vue-query').useQuery` currently has some quirks where it is super hard to
+// pass down the inferred `initialData` type because of it's discriminated overload in the on `useQuery`.
+export function useQuery<queryFnData, error, data, queryKey extends QueryKey>(
+  parameters: MaybeRef<
+    UseQueryParameters<queryFnData, error, data, queryKey> & {
+      queryKey: QueryKey
+    }
+  >,
+): UseQueryReturnType<data, error> {
+  const options = computed(() => ({
+    ...(unref(parameters) as any),
+    queryKeyHashFn: hashFn,
+  }))
+  const result = tanstack_useQuery(options) as UseQueryReturnType<data, error>
+  result.queryKey = unref(options).queryKey as QueryKey
+  return result
+}
+
+////////////////////////////////////////////////////////////////////////////////
+
+// export type UseInfiniteQueryParameters<
+//   queryFnData = unknown,
+//   error = DefaultError,
+//   data = queryFnData,
+//   queryData = queryFnData,
+//   queryKey extends QueryKey = QueryKey,
+//   pageParam = unknown,
+// > = Evaluate<
+//   Omit<
+//     UseInfiniteQueryOptions<
+//       queryFnData,
+//       error,
+//       data,
+//       queryData,
+//       queryKey,
+//       pageParam
+//     >,
+//     'initialData'
+//   > & {
+//     // Fix `initialData` type
+//     initialData?:
+//       | UseInfiniteQueryOptions<
+//           queryFnData,
+//           error,
+//           data,
+//           queryKey
+//         >['initialData']
+//       | undefined
+//   }
+// >
+
+// export type UseInfiniteQueryReturnType<
+//   data = unknown,
+//   error = DefaultError,
+// > = import('@tanstack/vue-query').UseInfiniteQueryReturnType<data, error> & {
+//   queryKey: QueryKey
+// }
+
+// // Adding some basic customization.
+// export function useInfiniteQuery<
+//   queryFnData,
+//   error,
+//   data,
+//   queryKey extends QueryKey,
+// >(
+//   parameters: UseInfiniteQueryParameters<queryFnData, error, data, queryKey> & {
+//     queryKey: QueryKey
+//   },
+// ): UseInfiniteQueryReturnType<data, error> {
+//   const result = tanstack_useInfiniteQuery({
+//     ...(parameters as any),
+//     queryKeyHashFn: hashFn, // for bigint support
+//   }) as UseInfiniteQueryReturnType<data, error>
+//   result.queryKey = parameters.queryKey
+//   return result
+// }

package/src/utils/updateState.ts

@@ -0,0 +1,10 @@
+// Credit: https://github.com/TanStack/query/blob/01ce023826b81e6c41e354f27691f65c9725af67/packages/vue-query/src/utils.ts#L11-L18
+
+export function updateState(
+  state: Record<string, unknown>,
+  update: Record<string, any>,
+): void {
+  Object.keys(state).forEach((key) => {
+    state[key] = update[key]
+  })
+}

package/src/version.ts

@@ -0,0 +1 @@
+export const version = '0.0.0-canary-20240515232917'