nuxt-convex-module 0.0.1 → 0.9.0

package/dist/runtime/nuxt/composables/use-async-paginated-query.js

@@ -0,0 +1,90 @@
+import { useAsyncData } from "#app";
+import { computed, toValue } from "vue";
+import { getFunctionName } from "convex/server";
+import { convexToJson, jsonToConvex } from "convex/values";
+import {
+  usePaginatedQuery
+} from "../../vue/composables/use-paginated-query.js";
+import { fetchQuery } from "../index.js";
+import { useAsyncQueryContext } from "./use-async-query.js";
+export function useAsyncPaginatedQuery(query, args, options) {
+  const { initialNumItems, server = true, lazy = false, token } = options;
+  const queryName = getFunctionName(query);
+  const initialArgs = toValue(args);
+  const key = options.key ?? defaultAsyncPaginatedQueryKey(queryName, initialArgs, initialNumItems);
+  const { client, deploymentUrl, resolveToken } = useAsyncQueryContext(token);
+  const asyncData = useAsyncData(
+    key,
+    async () => {
+      const currentArgs = toValue(args);
+      if (currentArgs === "skip" || !import.meta.server) {
+        return null;
+      }
+      if (!deploymentUrl) {
+        throw new Error(
+          "`useAsyncPaginatedQuery` could not fetch during SSR: no Convex deployment URL is configured. Set NUXT_PUBLIC_CONVEX_URL or `convex.url` in nuxt.config."
+        );
+      }
+      const result2 = await fetchQuery(
+        query,
+        { ...currentArgs, paginationOpts: { numItems: initialNumItems, cursor: null } },
+        { token: await resolveToken(), url: deploymentUrl }
+      );
+      return { page: convexToJson(result2.page), isDone: result2.isDone };
+    },
+    { server, lazy, deep: false, immediate: initialArgs !== "skip" }
+  );
+  const payloadPage = computed(() => {
+    const entry = asyncData.data.value;
+    return entry ? jsonToConvex(entry.page) : void 0;
+  });
+  const live = !import.meta.server && client ? usePaginatedQuery(query, args, { initialNumItems }) : void 0;
+  const liveState = computed(() => {
+    if (!live) return void 0;
+    try {
+      return { results: live.results.value, status: live.status.value, error: null };
+    } catch (thrown) {
+      return { results: [], status: "LoadingFirstPage", error: thrown };
+    }
+  });
+  const liveHasPage = computed(() => liveState.value !== void 0 && liveState.value.status !== "LoadingFirstPage");
+  const clientError = computed(() => {
+    if (import.meta.server || client || toValue(args) === "skip") return null;
+    return new Error(
+      "`useAsyncPaginatedQuery` could not start on the client: no Convex client is available. Set NUXT_PUBLIC_CONVEX_URL or `convex.url` in nuxt.config."
+    );
+  });
+  const initialArgsJson = argsJson(initialArgs);
+  let payloadRetired = false;
+  const payloadApplies = computed(() => {
+    if (liveHasPage.value || argsJson(toValue(args)) !== initialArgsJson) payloadRetired = true;
+    return !payloadRetired && payloadPage.value !== void 0;
+  });
+  const results = computed(() => {
+    if (liveHasPage.value) return liveState.value.results;
+    return payloadApplies.value ? payloadPage.value : [];
+  });
+  const status = computed(() => {
+    if (liveHasPage.value) return liveState.value.status;
+    if (payloadApplies.value) return asyncData.data.value.isDone ? "Exhausted" : "CanLoadMore";
+    return "LoadingFirstPage";
+  });
+  const isLoading = computed(() => status.value === "LoadingFirstPage" || status.value === "LoadingMore");
+  const error = computed(
+    () => liveState.value?.error ?? clientError.value ?? asyncData.error.value ?? null
+  );
+  const loadMore = (numItems) => {
+    live?.loadMore(numItems);
+  };
+  const refresh = (opts) => asyncData.refresh(opts);
+  const result = { results, status, isLoading, error, loadMore, refresh };
+  const promise = Promise.resolve(asyncData).then(() => result);
+  return Object.assign(promise, result);
+}
+function argsJson(args) {
+  return args === "skip" ? '"skip"' : JSON.stringify(convexToJson(args ?? {}));
+}
+export function defaultAsyncPaginatedQueryKey(queryName, initialArgs, initialNumItems) {
+  return `convex:paginated:${queryName}:${argsJson(initialArgs)}:${initialNumItems}`;
+}
+export const useConvexAsyncPaginatedQuery = useAsyncPaginatedQuery;

package/dist/runtime/nuxt/composables/use-async-query.d.ts

@@ -1,15 +1,3 @@
-/**
- * Nuxt-idiomatic data fetching for Convex queries.
- *
- * {@link useAsyncQuery} is a Vue/Nuxt-only addition (no `convex/react`
- * counterpart — see PARITY.md): it marries Nuxt's `useAsyncData` model with
- * Convex's live queries. During SSR the query runs over HTTP and the result is
- * embedded in the Nuxt payload; after hydration the composable upgrades to the
- * WebSocket subscription, so the page paints with server data and stays live —
- * no loading flash, no client refetch.
- *
- * @module
- */
 import { type ComputedRef, type MaybeRefOrGetter } from 'vue';
 import type { FunctionArgs, FunctionReference, FunctionReturnType } from 'convex/server';
 /**
@@ -94,7 +82,13 @@ export interface AsyncQueryReturn<T> extends PromiseLike<AsyncQueryData<T>> {
         dedupe?: 'cancel' | 'defer';
     }) => Promise<void>;
 }
-type AsyncQueryData<T> = Pick<AsyncQueryReturn<T>, 'data' | 'error' | 'status' | 'refresh'>;
+/**
+ * The reactive half of {@link AsyncQueryReturn} — what `await useAsyncQuery(...)`
+ * resolves to, and the shape to annotate a value passed on from the call site.
+ *
+ * @public
+ */
+export type AsyncQueryData<T> = Pick<AsyncQueryReturn<T>, 'data' | 'error' | 'status' | 'refresh'>;
 /**
  * Load a Convex query the Nuxt way: fetched on the server during SSR,
  * hydrated through the Nuxt payload, then seamlessly upgraded to a live
@@ -137,8 +131,5 @@ type AsyncQueryData<T> = Pick<AsyncQueryReturn<T>, 'data' | 'error' | 'status' |
  * @public
  */
 export declare function useAsyncQuery<Query extends FunctionReference<'query'>>(query: Query, args?: MaybeRefOrGetter<FunctionArgs<Query> | 'skip'>, options?: AsyncQueryOptions): AsyncQueryReturn<FunctionReturnType<Query>>;
-/** Payload key for a query + initial args. Exported for tests. @internal */
-export declare function defaultAsyncQueryKey(queryName: string, initialArgs: unknown): string;
 /** @public */
 export declare const useConvexAsyncQuery: typeof useAsyncQuery;
-export {};

package/dist/runtime/nuxt/composables/use-async-query.js

@@ -4,6 +4,7 @@ import { getFunctionName, makeFunctionReference } from "convex/server";
 import { convexToJson, jsonToConvex } from "convex/values";
 import { useConvex } from "../../vue/client.js";
 import { useConvexQueries } from "../../vue/composables/use-queries.js";
+import { CONVEX_INITIAL_TOKEN_KEY } from "../config.js";
 import { fetchQuery } from "../index.js";
 export function useAsyncQuery(query, args, options = {}) {
   const { server = true, lazy = false, live = true, token } = options;
@@ -11,13 +12,7 @@ export function useAsyncQuery(query, args, options = {}) {
   const queryName = getFunctionName(queryReference);
   const initialArgs = toValue(args) ?? {};
   const key = options.key ?? defaultAsyncQueryKey(queryName, initialArgs);
-  const initialToken = useState("convex:initialToken", () => null);
-  const client = useConvex();
-  const deploymentUrl = import.meta.server ? useRuntimeConfig().public.convex.url : "";
-  const resolveToken = async () => {
-    const resolved = typeof token === "function" ? await token() : token ?? initialToken.value;
-    return resolved ?? void 0;
-  };
+  const { client, deploymentUrl, resolveToken } = useAsyncQueryContext(token);
   const asyncData = useAsyncData(
     key,
     async () => {
@@ -28,7 +23,7 @@ export function useAsyncQuery(query, args, options = {}) {
       if (import.meta.server) {
         if (!deploymentUrl) {
           throw new Error(
-            "`useAsyncQuery` could not fetch during SSR: no Convex deployment URL is configured. Set the `convex.url` module option or NUXT_PUBLIC_CONVEX_URL."
+            "`useAsyncQuery` could not fetch during SSR: no Convex deployment URL is configured. Set NUXT_PUBLIC_CONVEX_URL or `convex.url` in nuxt.config."
           );
         }
         const value2 = await fetchQuery(queryReference, currentArgs, {
@@ -39,7 +34,7 @@ export function useAsyncQuery(query, args, options = {}) {
       }
       if (!client) {
         throw new Error(
-          "`useAsyncQuery` could not fetch on the client: no Convex client is available. Is the `convex.url` module option (or NUXT_PUBLIC_CONVEX_URL) configured?"
+          "`useAsyncQuery` could not fetch on the client: no Convex client is available. Set NUXT_PUBLIC_CONVEX_URL or `convex.url` in nuxt.config."
         );
       }
       const value = await client.query(queryReference, currentArgs);
@@ -97,6 +92,16 @@ export function useAsyncQuery(query, args, options = {}) {
   const promise = Promise.resolve(asyncData).then(() => result);
   return Object.assign(promise, result);
 }
+export function useAsyncQueryContext(token) {
+  const initialToken = useState(CONVEX_INITIAL_TOKEN_KEY, () => null);
+  const client = useConvex();
+  const deploymentUrl = import.meta.server ? useRuntimeConfig().public.convex.url : "";
+  const resolveToken = async () => {
+    const resolved = typeof token === "function" ? await token() : token ?? initialToken.value;
+    return resolved ?? void 0;
+  };
+  return { client, deploymentUrl, resolveToken };
+}
 export function defaultAsyncQueryKey(queryName, initialArgs) {
   const argsJson = initialArgs === "skip" ? '"skip"' : JSON.stringify(convexToJson(initialArgs ?? {}));
   return `convex:${queryName}:${argsJson}`;

package/dist/runtime/nuxt/config.d.ts

@@ -1,3 +1,14 @@
+/**
+ * Nuxt `useState` key the Better Auth server plugin stashes the SSR-prefetched
+ * Convex JWT under, read back by the client plugin and `useAsyncQuery`. Lives
+ * here, dependency-free, so the core composable can read the token without
+ * importing the integration.
+ */
+export declare const CONVEX_INITIAL_TOKEN_KEY = "convex:initialToken";
+/**
+ * The module's runtime config, tolerating a missing Nuxt context (a plain
+ * server import outside a request) by returning an empty object.
+ */
 export declare function getConvexRuntimeConfig(): {
     url: string | undefined;
     siteUrl: string | undefined;

package/dist/runtime/nuxt/config.js

@@ -1,4 +1,5 @@
 import { useRuntimeConfig } from "#imports";
+export const CONVEX_INITIAL_TOKEN_KEY = "convex:initialToken";
 export function getConvexRuntimeConfig() {
   try {
     const config = useRuntimeConfig();

package/dist/runtime/nuxt/index.d.ts

@@ -54,15 +54,12 @@ export type NuxtOptions = {
     token?: string;
     /**
      * The URL of the Convex deployment to use for the function call.
-     * Defaults to `process.env.NUXT_PUBLIC_CONVEX_URL` if not provided.
+     * Defaults to `runtimeConfig.public.convex.url`, then to
+     * `process.env.NUXT_PUBLIC_CONVEX_URL`, if not provided.
      *
      * Explicitly passing undefined here (such as from missing ENV variables) will throw an error in the future.
      */
     url?: string;
-    /**
-     * @internal
-     */
-    adminToken?: string;
     /**
      * Skip validating that the Convex deployment URL looks like
      * `https://happy-animal-123.convex.cloud` or localhost.

package/dist/runtime/polar/vue/components.d.ts

@@ -48,10 +48,15 @@ export interface PolarComponentApi {
     }>;
 }
 /**
+ * Renders a link to the Polar customer portal for the signed-in user, where
+ * they manage their subscription.
+ *
  * @example
  * ```vue
  * <CustomerPortalLink>Manage subscription</CustomerPortalLink>
  * ```
+ *
+ * @public
  */
 export declare const CustomerPortalLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     polarApi: {
@@ -86,6 +91,8 @@ export declare const CustomerPortalLink: import("vue").DefineComponent<import("v
  *   Start free trial
  * </CheckoutLink>
  * ```
+ *
+ * @public
  */
 export declare const CheckoutLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     polarApi: {
@@ -172,9 +179,9 @@ export declare const CheckoutLink: import("vue").DefineComponent<import("vue").E
         default: boolean;
     };
 }>> & Readonly<{}>, {
+    embed: boolean;
     lazy: boolean;
     metadata: Record<string, string>;
-    embed: boolean;
     subscriptionId: string;
     trialInterval: "day" | "week" | "month" | "year" | null;
     trialIntervalCount: number | null;

package/dist/runtime/polar/vue/components.js

@@ -13,7 +13,7 @@ export const CustomerPortalLink = defineComponent({
     const polarApi = props.polarApi ?? useConvexNamespace("billing");
     const generateCustomerPortalUrl = polarApi?.generateCustomerPortalUrl ? useAction(polarApi.generateCustomerPortalUrl) : void 0;
     const portalUrl = ref();
-    if (import.meta.client && generateCustomerPortalUrl) {
+    if (!import.meta.server && generateCustomerPortalUrl) {
       watch(
         () => props.returnUrl,
         (returnUrl) => {
@@ -55,7 +55,7 @@ export const CheckoutLink = defineComponent({
     const generateCheckoutLink = polarApi?.generateCheckoutLink ? useAction(polarApi.generateCheckoutLink) : void 0;
     const checkoutLink = ref();
     const isLoading = ref(false);
-    if (import.meta.client && generateCheckoutLink) {
+    if (!import.meta.server && generateCheckoutLink) {
       watch(
         () => [props.lazy, props.productIds, props.subscriptionId, props.metadata, props.embed, props.trialInterval, props.trialIntervalCount, props.locale],
         async () => {

package/dist/runtime/vue/auth/index.d.ts

@@ -89,9 +89,9 @@ export interface ConvexAuthProviderOptions {
  * @example
  * ```vue
  * <script setup lang="ts">
- * import { useAuth } from '~/composables/useAuth'  // your auth provider
+ * import { useAuth } from '~/composables/useMyAuthProvider'  // your auth provider
  *
- * const { client } = useNuxtApp().$convex
+ * const client = useConvex()
  * const authState = provideConvexAuth({ client, useAuth })
  * </script>
  * ```
@@ -112,11 +112,11 @@ export declare function provideConvexAuth(options: ConvexAuthProviderOptions): C
  * (`nuxtApp.vueApp.provide`) rather than from a component's setup function.
  *
  * When `scope` is provided, all watchers are created inside that
- * {@link EffectScope} so callers can dispose them later.
+ * `EffectScope` so callers can dispose them later.
  */
 export declare function createConvexAuthState(options: ConvexAuthProviderOptions, scope?: EffectScope): ConvexAuthState;
 /**
- * Create a fresh {@link EffectScope} and build a Convex auth state inside it.
+ * Create a fresh `EffectScope` and build a Convex auth state inside it.
  * The scope is returned so the caller can `.stop()` it on teardown.
  */
 export declare function createScopedConvexAuthState(options: ConvexAuthProviderOptions): {

package/dist/runtime/vue/client.d.ts

@@ -1,24 +1,19 @@
 import type { InjectionKey } from 'vue';
-import { BaseConvexClient } from 'convex/browser';
 import type { AuthTokenFetcher, BaseConvexClientOptions, ConnectionState, OptimisticUpdate, PaginationStatus, QueryJournal, QueryOptions } from 'convex/browser';
 import type { Watch as ConvexWatch } from 'convex/react';
-import type { ArgsAndOptions, FunctionArgs, FunctionReference, FunctionReturnType, OptionalRestArgs, UserIdentityAttributes } from 'convex/server';
+import type { ArgsAndOptions, FunctionArgs, FunctionReference, FunctionReturnType, OptionalRestArgs } from 'convex/server';
 import type { Value } from 'convex/values';
 export type { AuthTokenFetcher, ConnectionState, OptimisticUpdate };
 /**
  * A watch on the output of a Convex query function.
  *
  * Derived from upstream's `Watch` (per-member docs live there), extended with
- * the `@internal` `localQueryLogs`, which is stripped from the published
+ * the internal `localQueryLogs`, which is stripped from the published
  * `convex/react` types but present at runtime.
  *
  * @public
  */
 export interface Watch<T> extends ConvexWatch<T> {
-    /**
-     * @internal
-     */
-    localQueryLogs(): string[] | undefined;
 }
 /**
  * A watch on the output of a paginated Convex query function.
@@ -61,10 +56,6 @@ export interface WatchQueryOptions {
      * name and arguments, this journal will have no effect.
      */
     journal?: QueryJournal;
-    /**
-     * @internal
-     */
-    componentPath?: string;
 }
 /**
  * Options for {@link ConvexVueClient.mutation}.
@@ -101,7 +92,7 @@ export type ConvexLogger = Exclude<BaseConvexClientOptions['logger'], boolean |
  * This loads reactive queries and executes mutations over a WebSocket.
  *
  * In a Nuxt app the client is provided automatically by the plugin and
- * available via the {@link useConvex} composable or `useNuxtApp().$convex`.
+ * available via the {@link useConvex} composable.
  *
  * @public
  */
@@ -127,13 +118,6 @@ export declare class ConvexVueClient {
      * it may be canonicalized.
      */
     get url(): string;
-    /**
-     * Lazily instantiate the `BaseConvexClient` so we don't create the WebSocket
-     * when server-side rendering.
-     *
-     * @internal
-     */
-    get sync(): BaseConvexClient;
     /**
      * Set the authentication token to be used for subsequent queries and mutations.
      * `fetchToken` will be called automatically again if a token expires.
@@ -148,10 +132,6 @@ export declare class ConvexVueClient {
      * Clear the current authentication token if set.
      */
     clearAuth(): void;
-    /**
-     * @internal
-     */
-    setAdminAuth(token: string, identity?: UserIdentityAttributes): void;
     /**
      * Construct a new {@link Watch} on a Convex query function.
      *
@@ -183,32 +163,6 @@ export declare class ConvexVueClient {
     prewarmQuery<Query extends FunctionReference<'query'>>(queryOptions: QueryOptions<Query> & {
         extendSubscriptionFor?: number;
     }): void;
-    /**
-     * Construct a new {@link PaginatedWatch} on a Convex paginated query function.
-     *
-     * **Not supported in the Vue port — use the {@link usePaginatedQuery}
-     * composable instead.** Convex's paginated-subscription engine
-     * (`PaginatedQueryClient`) is not part of the public `convex` exports, so a
-     * third-party package cannot instantiate it; pagination is handled entirely
-     * in the composable layer via ordinary {@link watchQuery} subscriptions.
-     *
-     * The method is retained for structural parity with
-     * `ConvexReactClient.watchPaginatedQuery`. It is reachable only if a caller
-     * passes `paginationOptions` to {@link useConvexQueries} (the React-shaped
-     * escape hatch); doing so throws this error to fail loudly rather than
-     * silently mis-subscribe.
-     *
-     * Upstream wires {@link usePaginatedQuery_experimental} to this method's
-     * `PaginatedQueryClient`; the port re-bases that hook on the same manual
-     * page-management engine as {@link usePaginatedQuery}, so both hooks work
-     * without ever calling this method (only the experimental single-request
-     * network path is not reproduced).
-     *
-     * PARITY: D-05
-     *
-     * @internal
-     */
-    watchPaginatedQuery<Query extends FunctionReference<'query'>>(_query: Query, _args: Query['_args'], _options: unknown): PaginatedWatch<FunctionReturnType<Query>>;
     /**
      * Execute a mutation function.
      *
@@ -248,6 +202,7 @@ export declare class ConvexVueClient {
      * deployment.
      *
      * @returns The {@link ConnectionState} with the Convex deployment.
+     * @experimental May change in a minor release — see STABILITY.md.
      */
     connectionState(): ConnectionState;
     /**
@@ -261,6 +216,7 @@ export declare class ConvexVueClient {
      * out what information is most useful. As such this API is considered unstable.
      *
      * @returns An unsubscribe function to stop listening.
+     * @experimental May change in a minor release — see STABILITY.md.
      */
     subscribeToConnectionState(cb: (connectionState: ConnectionState) => void): () => void;
     /**
@@ -297,11 +253,3 @@ export declare const ConvexClientKey: InjectionKey<ConvexVueClient>;
  * @public
  */
 export declare function useConvex(): ConvexVueClient;
-/**
- * Inject the Convex client for a composable, throwing the per-composable
- * missing-client error when absent — mirrors the checks at the top of
- * upstream's `useQuery`/`useMutation`/`useAction`/`useConvexConnectionState`.
- *
- * @internal
- */
-export declare function useConvexOrThrow(composableName: string): ConvexVueClient;

package/dist/runtime/vue/client.js

@@ -314,6 +314,7 @@ export class ConvexVueClient {
    * deployment.
    *
    * @returns The {@link ConnectionState} with the Convex deployment.
+   * @experimental May change in a minor release — see STABILITY.md.
    */
   connectionState() {
     return this.sync.connectionState();
@@ -329,6 +330,7 @@ export class ConvexVueClient {
    * out what information is most useful. As such this API is considered unstable.
    *
    * @returns An unsubscribe function to stop listening.
+   * @experimental May change in a minor release — see STABILITY.md.
    */
   subscribeToConnectionState(cb) {
     return this.sync.subscribeToConnectionState(cb);

package/dist/runtime/vue/components/convex-image.d.ts

@@ -0,0 +1,50 @@
+import { type PropType } from 'vue';
+import { type GetStorageUrl } from '../composables/use-storage-url.js';
+import type { StorageId } from '../composables/use-upload.js';
+/**
+ * An `<img>` for a file in Convex storage. Resolves the served URL through
+ * {@link useStorageUrl} and renders the image once it is known; every other
+ * attribute (`alt`, `class`, `loading`, `width`, …) goes onto the `<img>`.
+ *
+ * - default slot — rendered while the URL is loading or `storageId` is empty
+ * - `missing` slot — rendered when the file no longer exists (the query returned `null`)
+ *
+ * @example
+ * ```vue
+ * <ConvexImage :get-url="api.files.url" :storage-id="doc.imageId" alt="Cover" class="rounded">
+ *   <div class="skeleton" />
+ *   <template #missing><div class="placeholder" /></template>
+ * </ConvexImage>
+ * ```
+ *
+ * @public
+ */
+export declare const ConvexImage: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /** The public `getUrl` query: `{ storageId }` → served URL or `null`. Read once, at setup. */
+    getUrl: {
+        type: PropType<GetStorageUrl>;
+        required: true;
+    };
+    /** The file to show; `null`/`undefined` renders the default slot. */
+    storageId: {
+        type: PropType<StorageId | string | null | undefined>;
+        default: undefined;
+    };
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /** The public `getUrl` query: `{ storageId }` → served URL or `null`. Read once, at setup. */
+    getUrl: {
+        type: PropType<GetStorageUrl>;
+        required: true;
+    };
+    /** The file to show; `null`/`undefined` renders the default slot. */
+    storageId: {
+        type: PropType<StorageId | string | null | undefined>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    storageId: string | StorageId | null | undefined;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/vue/components/convex-image.js

@@ -0,0 +1,21 @@
+import { defineComponent, h } from "vue";
+import { useStorageUrl } from "../composables/use-storage-url.js";
+export const ConvexImage = defineComponent({
+  name: "ConvexImage",
+  inheritAttrs: false,
+  props: {
+    /** The public `getUrl` query: `{ storageId }` → served URL or `null`. Read once, at setup. */
+    getUrl: { type: Object, required: true },
+    /** The file to show; `null`/`undefined` renders the default slot. */
+    storageId: { type: String, default: void 0 }
+  },
+  setup(props, { attrs, slots }) {
+    const url = useStorageUrl(props.getUrl, () => props.storageId);
+    return () => {
+      const value = url.value;
+      if (value) return h("img", { ...attrs, src: value });
+      if (value === null) return slots.missing?.() ?? null;
+      return slots.default?.() ?? null;
+    };
+  }
+});

package/dist/runtime/vue/composables/use-connection-state.d.ts

@@ -26,5 +26,6 @@ import type { ShallowRef } from 'vue';
  * @returns The current {@link ConnectionState} with the Convex deployment.
  *
  * @public
+ * @experimental May change in a minor release — see STABILITY.md.
  */
 export declare function useConvexConnectionState(): ShallowRef<ConnectionState>;

package/dist/runtime/vue/composables/use-paginated-query.d.ts

@@ -32,7 +32,10 @@ export type { PaginatedQueryReference, PaginatedQueryArgs, PaginatedQueryItem, U
 export declare function usePaginatedQuery<Query extends PaginatedQueryReference>(query: Query, args: MaybeRefOrGetter<PaginatedQueryArgs<Query> | 'skip'>, options: {
     initialNumItems: number;
 }): UsePaginatedQueryReturnType<Query>;
-/** @internal */
+/**
+ * Reset pagination id for tests only, so tests know what it is.
+ * @experimental May change in a minor release — see STABILITY.md.
+ */
 export declare function resetPaginationId(): void;
 /**
  * Return shape of {@link usePaginatedQuery} — the fields of upstream's
@@ -125,6 +128,7 @@ export declare function insertAtPosition<Query extends PaginatedQueryReference>(
  * identical observable results (`results`/`data`, `status`, `loadMore`).
  *
  * @public
+ * @experimental May change in a minor release — see STABILITY.md.
  */
 export declare function usePaginatedQuery_experimental<Query extends PaginatedQueryReference>(query: Query, args: MaybeRefOrGetter<PaginatedQueryArgs<Query> | 'skip'>, options: {
     initialNumItems: number;

package/dist/runtime/vue/composables/use-paginated-query.js

@@ -1,7 +1,7 @@
 import { getFunctionName } from "convex/server";
 import { ConvexError, compareValues, convexToJson } from "convex/values";
 import { computed, shallowRef, toValue } from "vue";
-import { useConvex } from "../client.js";
+import { useConvexOrThrow } from "../client.js";
 import { useConvexQueries } from "./use-queries.js";
 const splitQuery = (key, splitCursor, continueCursor) => (prevState) => {
   const queries = { ...prevState.queries };
@@ -98,7 +98,7 @@ function usePaginatedQueryInternal(query, args, options) {
       `\`options.initialNumItems\` must be a positive number. Received \`${initialOptions?.initialNumItems}\`.`
     );
   }
-  const convex = useConvex();
+  const convex = useConvexOrThrow("usePaginatedQuery");
   const logger = convex.logger;
   function createInitialState(q, currentArgs, skip, initialNumItems) {
     const id = nextPaginationId();

package/dist/runtime/vue/composables/use-query.d.ts

@@ -6,6 +6,7 @@ export type OptionalRestArgsOrSkip<FuncRef extends FunctionReference<any>> = Fun
  * Result returned by object-form {@link useQuery_experimental}.
  *
  * @public
+ * @experimental May change in a minor release — see STABILITY.md.
  */
 export type UseQueryResult<QueryResult, ThrowOnError extends boolean = false> = ConvexUseQueryResult<QueryResult, ThrowOnError>;
 type UseQueryOptions<Query extends FunctionReference<'query'>, ThrowOnError extends boolean> = {
@@ -80,6 +81,7 @@ export declare function useQuery<Query extends FunctionReference<'query'>>(query
  * {@link UseQueryResult} object.
  *
  * @public
+ * @experimental May change in a minor release — see STABILITY.md.
  */
 export declare function useQuery_experimental<Query extends FunctionReference<'query'>, ThrowOnError extends boolean = false>(options: UseQueryOptions<Query, ThrowOnError>): ComputedRef<UseQueryResult<Query['_returnType'], ThrowOnError>>;
 /** @public */

package/dist/runtime/vue/composables/use-subscription.d.ts

@@ -1,15 +1 @@
-import { type ShallowRef } from 'vue';
-/**
- * Composable used for safely managing subscriptions in concurrent mode.
- *
- * In order to avoid removing and re-adding subscriptions each time this composable is called,
- * the parameters passed to this composable should be memoized in some way–
- * either by wrapping the entire params object with useMemo()
- * or by wrapping the individual callbacks with useCallback().
- *
- * @internal
- */
-export declare function useSubscription<Value>({ getCurrentValue, subscribe, }: {
-    getCurrentValue: () => Value;
-    subscribe: (callback: () => void) => () => void;
-}): ShallowRef<Value>;
+export {};

package/dist/runtime/vue/composables/use-upload-queue.d.ts

@@ -40,8 +40,8 @@ export interface UseUploadQueueOptions {
     /** Called once every queued item has settled (succeeded or failed). */
     onComplete?: (items: UploadQueueItem[]) => void;
 }
-/** Accepted inputs to {@link VueUploadQueue.enqueue}. */
-type EnqueueInput = Blob | Blob[] | FileList | null | undefined;
+/** Accepted inputs to {@link VueUploadQueue.enqueue}. @public */
+export type EnqueueInput = Blob | Blob[] | FileList | null | undefined;
 /**
  * The reactive queue returned by {@link useUploadQueue}.
  *
@@ -114,4 +114,3 @@ export interface VueUploadQueue {
 export declare function useUploadQueue(generateUploadUrl: GenerateUploadUrl, options?: UseUploadQueueOptions): VueUploadQueue;
 /** @public */
 export declare const useConvexUploadQueue: typeof useUploadQueue;
-export {};