@withone/connect 0.10.0 → 0.12.0

package/dist/server/index.esm.js

@@ -4,7 +4,8 @@ import { randomBytes, createHash } from 'node:crypto';
  *  The SDK reads them off the page URL when the tab comes home, so
  *  there is no completion page to build. */
 const RETURN_STATUS_PARAM = "one_connect";
-const RETURN_MESSAGE_PARAM = "one_connect_message";
+/** Why the flow failed, as a code (see ConnectFailureCode). */
+const RETURN_ERROR_PARAM = "one_connect_error";
 
 /** One's production API. Point `oneApiUrl` elsewhere for development. */
 const DEFAULT_ONE_API_URL = "https://api.withone.ai";
@@ -70,6 +71,18 @@ function tenancyHeaders(accessToken) {
   }
 }
 
+/** When a refresh token stops working, in epoch milliseconds, from its
+ *  `exp` claim. Null when the token carries no readable expiry, in which
+ *  case only One can say whether it still works. */
+function refreshTokenExpiresAt(refreshToken) {
+  try {
+    const payload = JSON.parse(Buffer.from(refreshToken.split(".")[1], "base64url").toString());
+    return typeof payload.exp === "number" && Number.isFinite(payload.exp) ? payload.exp * 1000 : null;
+  } catch {
+    return null;
+  }
+}
+
 /** The scopes the token was granted, from its claims. Display only. */
 function tokenScopes(accessToken) {
   try {
@@ -89,8 +102,8 @@ function tokenScopes(accessToken) {
 
 /**
  * Where the app keeps each user's tokens: its database, a cache, an
- * encrypted cookie. The SDK never sees a token outside these three
- * calls. `userId` is the app's own id for its user.
+ * encrypted cookie. The SDK never sees a token outside these calls.
+ * `userId` is the app's own id for its user.
  */
 
 /** The transaction cookie the authorize leg sets and the callback reads. */
@@ -99,6 +112,14 @@ function tokenScopes(accessToken) {
 
 /** One catalog action for a platform. */
 
+/**
+ * - `not_connected`: no tokens are stored for this user.
+ * - `refresh_failed`: One declared the grant dead (revoked, expired or
+ *   reused). The tokens were cleared; ask the user to connect again.
+ * - `request_failed`: One answered with an error or could not be
+ *   reached. During a refresh the tokens are kept, so retry later.
+ */
+
 class OneConnectError extends Error {
   constructor(code, message, status) {
     super(message);
@@ -126,12 +147,26 @@ class OneConnectError extends Error {
  *   const reply = await oneConnect.runAction(userId, { connectionKey, actionId, method, path });
  *
  * The Next.js and Node adapters turn the first two into route handlers.
+ *
+ * Refresh. One's access token lives an hour by default, its refresh token 30
+ * days; every refresh rotates both, and One treats a second use of a
+ * rotated refresh token as theft and revokes the whole grant. So the
+ * client refreshes one user at a time (in this process always, across
+ * processes through `tokenStore.withLock`), re-reads the store before
+ * spending a refresh token, clears tokens only when One declares the
+ * grant dead, and never lets a failing old pair delete a newer one.
  */
 
 /** Refresh this long before expiry, so a call never races the clock. */
 const REFRESH_MARGIN_MS = 60_000;
 const CATALOG_PAGE_SIZE = 100;
 const CATALOG_MAX_PAGES = 20;
+
+/** What One's token endpoint answered. A network failure throws instead. */
+
+/** The one refusal that means the grant is gone for good: revoked by the
+ *  user, expired, or burned by a reused refresh token (RFC 6749 §5.2). */
+const isDeadGrant = answer => !answer.ok && answer.status === 400 && answer.error === "invalid_grant";
 function createOneConnect(config) {
   const oneApiUrl = (config.oneApiUrl ?? DEFAULT_ONE_API_URL).replace(/\/+$/, "");
   const authorizeUrl = `${oneApiUrl}/oauth/authorize`;
@@ -146,13 +181,13 @@ function createOneConnect(config) {
   /** One refresh in flight per user: two concurrent refreshes with the
    *  same refresh token trip One's reuse detection. */
   const refreshing = new Map();
-  const returnUrl = (status, message) => {
+  const returnUrl = (status, code) => {
     const url = new URL(returnTo, config.redirectUri);
     url.searchParams.set(RETURN_STATUS_PARAM, status);
-    if (message) url.searchParams.set(RETURN_MESSAGE_PARAM, message);
+    if (code) url.searchParams.set(RETURN_ERROR_PARAM, code);
     return url.toString();
   };
-  const exchange = async body => {
+  const postToken = async body => {
     const response = await fetch(tokenUrl, {
       method: "POST",
       headers: {
@@ -161,10 +196,40 @@ function createOneConnect(config) {
       },
       body
     });
-    if (!response.ok) {
-      throw new OneConnectError("request_failed", `One refused the token request (HTTP ${response.status}).`, response.status);
+    if (response.ok) return {
+      ok: true,
+      body: await response.json()
+    };
+    let error;
+    try {
+      const refusal = await response.json();
+      if (typeof refusal.error === "string") error = refusal.error;
+    } catch {
+      /* not an OAuth error body: a proxy page or a server error */
+    }
+    return {
+      ok: false,
+      status: response.status,
+      error
+    };
+  };
+  const exchange = async body => {
+    const answer = await postToken(body);
+    if (!answer.ok) {
+      throw new OneConnectError("request_failed", `One refused the token request (HTTP ${answer.status}).`, answer.status);
     }
-    return await response.json();
+    return answer.body;
+  };
+
+  /** Runs `run` under the app's cross-process lock for this user, when
+   *  the store has one. */
+  const locked = (userId, run) => tokenStore.withLock ? tokenStore.withLock(userId, run) : run();
+
+  /** Whether either token of the pair stops working within `withinMs`. */
+  const expiresWithin = (tokens, withinMs) => {
+    const horizon = Date.now() + withinMs;
+    const refreshExpiresAt = refreshTokenExpiresAt(tokens.refreshToken);
+    return tokens.expiresAt <= horizon || refreshExpiresAt !== null && refreshExpiresAt <= horizon;
   };
   const toTokens = response => ({
     accessToken: response.access_token,
@@ -196,17 +261,18 @@ function createOneConnect(config) {
     const oauthError = params.get("error");
     const cookieName = state ? txCookieName(state) : undefined;
     const verifier = cookieName ? input.getCookie(cookieName) : undefined;
-    const fail = (outcome, message) => ({
-      outcome,
+    const fail = (failure, message) => ({
+      outcome: failure === "declined" ? "declined" : "failed",
+      code: failure,
       message,
-      redirectUrl: returnUrl("error", message),
+      redirectUrl: returnUrl("error", failure),
       clearCookieName: cookieName
     });
-    if (oauthError === "access_denied") return fail("declined", "You cancelled the request.");
+    if (oauthError === "access_denied") return fail("declined", "The user cancelled on One's page.");
     if (oauthError) return fail("failed", `One reported an error: ${oauthError}.`);
-    // The returned state names its own cookie. No cookie means a forged
-    // or stale state; the code is never exchanged in that case.
-    if (!code || !state || !verifier) return fail("failed", "The sign-in attempt expired or was tampered with.");
+    // The returned state names its own cookie. No cookie means a stale,
+    // foreign or forged state; the code is never exchanged in that case.
+    if (!code || !state || !verifier) return fail("expired", "The attempt expired, or its state cookie was missing.");
     try {
       const tokens = toTokens(await exchange(new URLSearchParams({
         grant_type: "authorization_code",
@@ -214,7 +280,9 @@ function createOneConnect(config) {
         redirect_uri: config.redirectUri,
         code_verifier: verifier
       })));
-      await tokenStore.saveTokens(input.userId, tokens);
+      // Under the lock, so a refresh in flight on another server cannot
+      // interleave with this save.
+      await locked(input.userId, () => tokenStore.saveTokens(input.userId, tokens));
     } catch (error) {
       const status = error instanceof OneConnectError ? error.status : undefined;
       return fail("failed", status ? `One rejected the code exchange (HTTP ${status}).` : "One could not be reached to complete the connection.");
@@ -225,39 +293,81 @@ function createOneConnect(config) {
       clearCookieName: cookieName
     };
   };
-  const refreshTokens = userId => {
+  const notConnected = () => new OneConnectError("not_connected", "This user is not connected.");
+
+  /**
+   * The grant behind `failed` is dead. Clears it, unless a newer pair
+   * landed while it was failing (a reconnect's callback, another
+   * server's refresh): that pair is returned instead, because the user
+   * did nothing wrong and deleting it would disconnect them.
+   */
+  const retire = async (userId, failed, status) => {
+    const latest = await tokenStore.loadTokens(userId);
+    if (latest && latest.refreshToken !== failed.refreshToken) return latest;
+    await tokenStore.clearTokens(userId, failed);
+    throw new OneConnectError("refresh_failed", "The connection to One has expired or was revoked. Ask the user to connect again.", status);
+  };
+
+  /**
+   * The one place a refresh token is spent. Under the app's lock it
+   * re-reads the store, and refreshes only when `stillNeeded` says the
+   * stored pair still needs it: another process may have refreshed while
+   * this one waited, and spending the same refresh token twice makes One
+   * revoke the grant.
+   */
+  const refreshUnderLock = (userId, stillNeeded) => locked(userId, async () => {
+    const current = await tokenStore.loadTokens(userId);
+    if (!current) throw notConnected();
+    if (!stillNeeded(current)) return current;
+
+    // An expired refresh token cannot work, and One answers one with a
+    // server error rather than invalid_grant, so settle it here.
+    const refreshExpiresAt = refreshTokenExpiresAt(current.refreshToken);
+    if (refreshExpiresAt !== null && refreshExpiresAt <= Date.now()) return retire(userId, current);
+    let answer;
+    try {
+      answer = await postToken(new URLSearchParams({
+        grant_type: "refresh_token",
+        refresh_token: current.refreshToken
+      }));
+    } catch {
+      throw new OneConnectError("request_failed", "One could not be reached to refresh the connection. The tokens were kept; try again.");
+    }
+    if (answer.ok) {
+      // Both tokens: One rotates the pair on every refresh.
+      const next = toTokens(answer.body);
+      await tokenStore.saveTokens(userId, next);
+      return next;
+    }
+    if (isDeadGrant(answer)) return retire(userId, current, answer.status);
+    // A server error, a rate limit, a misconfigured secret: nothing says
+    // the grant is gone, so keep the tokens and let the caller retry.
+    throw new OneConnectError("request_failed", `One could not refresh the connection (HTTP ${answer.status}). The tokens were kept; try again.`, answer.status);
+  });
+
+  /** One refresh per user in this process; concurrent callers share it. */
+  const singleFlight = (userId, job) => {
     const inFlight = refreshing.get(userId);
     if (inFlight) return inFlight;
-    const job = (async () => {
-      const current = await tokenStore.loadTokens(userId);
-      if (!current) throw new OneConnectError("not_connected", "This user is not connected.");
-      try {
-        const next = toTokens(await exchange(new URLSearchParams({
-          grant_type: "refresh_token",
-          refresh_token: current.refreshToken
-        })));
-        // Both tokens: One rotates the pair on every refresh.
-        await tokenStore.saveTokens(userId, next);
-        return next;
-      } catch (error) {
-        // The family is dead: revoked, expired or reused. Keeping the
-        // pair would only fail again; the user has to reconnect.
-        await tokenStore.clearTokens(userId);
-        const status = error instanceof OneConnectError ? error.status : undefined;
-        throw new OneConnectError("refresh_failed", "The connection to One has expired or was revoked. Ask the user to connect again.", status);
-      } finally {
-        refreshing.delete(userId);
-      }
-    })();
-    refreshing.set(userId, job);
-    return job;
+    const running = job().finally(() => refreshing.delete(userId));
+    refreshing.set(userId, running);
+    return running;
   };
-  const getAccessToken = async userId => {
+  const refreshTokens = userId => singleFlight(userId, async () => {
+    const before = await tokenStore.loadTokens(userId);
+    if (!before) throw notConnected();
+    // Rotate the pair seen now; a pair someone else rotated since is
+    // already fresh.
+    return refreshUnderLock(userId, current => current.refreshToken === before.refreshToken);
+  });
+  const refreshIfExpiring = async (userId, options = {}) => {
+    const withinMs = options.withinMs ?? REFRESH_MARGIN_MS;
     const tokens = await tokenStore.loadTokens(userId);
-    if (!tokens) throw new OneConnectError("not_connected", "This user is not connected.");
-    if (Date.now() < tokens.expiresAt - REFRESH_MARGIN_MS) return tokens.accessToken;
-    return (await refreshTokens(userId)).accessToken;
+    if (!tokens) throw notConnected();
+    if (!expiresWithin(tokens, withinMs)) return tokens;
+    return singleFlight(userId, () => refreshUnderLock(userId, current => expiresWithin(current, withinMs)));
   };
+  const getAccessToken = async userId => (await refreshIfExpiring(userId)).accessToken;
   const oneFetch = async (userId, path, init = {}) => {
     const accessToken = await getAccessToken(userId);
     const headers = new Headers(init.headers);
@@ -333,6 +443,7 @@ function createOneConnect(config) {
     getAccessToken,
     getTokens: userId => tokenStore.loadTokens(userId),
     refreshTokens,
+    refreshIfExpiring,
     disconnect: userId => tokenStore.clearTokens(userId),
     listConnections,
     listActions,
@@ -341,4 +452,4 @@ function createOneConnect(config) {
   };
 }
 
-export { OneConnectError, createOneConnect, tenancyHeaders, tokenScopes };
+export { OneConnectError, createOneConnect, refreshTokenExpiresAt, tenancyHeaders, tokenScopes };

package/dist/server/oauth.d.ts

@@ -20,5 +20,9 @@ export declare function basicAuthorization(clientId: string, clientSecret: strin
  *  these headers, and without them the call runs in the user's personal
  *  space. The access token's claims name the tenant, so echo them. */
 export declare function tenancyHeaders(accessToken: string): Record<string, string>;
+/** When a refresh token stops working, in epoch milliseconds, from its
+ *  `exp` claim. Null when the token carries no readable expiry, in which
+ *  case only One can say whether it still works. */
+export declare function refreshTokenExpiresAt(refreshToken: string): number | null;
 /** The scopes the token was granted, from its claims. Display only. */
 export declare function tokenScopes(accessToken: string): string[];

package/dist/server/types.d.ts

@@ -11,13 +11,44 @@ export interface OneConnectTokens {
 }
 /**
  * Where the app keeps each user's tokens: its database, a cache, an
- * encrypted cookie. The SDK never sees a token outside these three
- * calls. `userId` is the app's own id for its user.
+ * encrypted cookie. The SDK never sees a token outside these calls.
+ * `userId` is the app's own id for its user.
  */
 export interface OneConnectTokenStore {
     saveTokens: (userId: string, tokens: OneConnectTokens) => Promise<void>;
     loadTokens: (userId: string) => Promise<OneConnectTokens | null>;
-    clearTokens: (userId: string) => Promise<void>;
+    /**
+     * Deletes the user's tokens.
+     *
+     * `failed` is set when the SDK clears because One declared that pair
+     * dead. Delete only when the stored refresh token is still
+     * `failed.refreshToken`: a newer pair saved in the meantime (a
+     * reconnect, another server's refresh) must survive. `failed` is
+     * undefined for `disconnect`, which always deletes.
+     */
+    clearTokens: (userId: string, failed?: OneConnectTokens) => Promise<void>;
+    /**
+     * Runs `run` while holding a lock on this user that every server and
+     * worker of the app shares: a Postgres advisory lock, a Redis lock, a
+     * row lock. The SDK loads, refreshes and saves the user's tokens
+     * inside it.
+     *
+     * Required when the app runs more than one process (serverless,
+     * several instances, a background worker). One rotates the refresh
+     * token on every use and treats a second use of the old one as theft,
+     * revoking the whole grant, so two processes refreshing the same user
+     * at once disconnect that user. Without a lock the SDK can only stop
+     * that inside a single process.
+     *
+     * Hold it for at least 60 seconds before any timeout: it spans one
+     * call to One's token endpoint.
+     */
+    withLock?: <T>(userId: string, run: () => Promise<T>) => Promise<T>;
+}
+export interface RefreshIfExpiringOptions {
+    /** Refresh when the access token or the refresh token expires within
+     *  this many milliseconds. One minute when omitted. */
+    withinMs?: number;
 }
 export interface OneConnectServerConfig {
     /** The app's client id from the dashboard. */
@@ -70,10 +101,15 @@ export interface CompleteAuthorizationInput {
     /** Reads a cookie by name from the incoming request. */
     getCookie: (name: string) => string | undefined;
 }
+import type { ConnectFailureCode } from "../types";
+export type { ConnectFailureCode };
 export type AuthorizationOutcome = "connected" | "declined" | "failed";
 export interface CompleteAuthorizationResult {
     outcome: AuthorizationOutcome;
-    /** Safe to show to the user when the outcome is not "connected". */
+    /** Why it failed, as the code the browser receives. Only the code goes
+     *  on the return URL; the browser shows fixed text for it. */
+    code?: ConnectFailureCode;
+    /** What happened, for your logs. Never put it in front of the user. */
     message?: string;
     /** Send the browser here with a 302; it carries `?one_connect=…`. */
     redirectUrl: string;
@@ -128,6 +164,13 @@ export interface RunActionResult {
     blockedByGrant: boolean;
     data: unknown;
 }
+/**
+ * - `not_connected`: no tokens are stored for this user.
+ * - `refresh_failed`: One declared the grant dead (revoked, expired or
+ *   reused). The tokens were cleared; ask the user to connect again.
+ * - `request_failed`: One answered with an error or could not be
+ *   reached. During a refresh the tokens are kept, so retry later.
+ */
 export type OneConnectErrorCode = "not_connected" | "refresh_failed" | "request_failed";
 export declare class OneConnectError extends Error {
     readonly code: OneConnectErrorCode;

package/dist/svelte.cjs.js

@@ -1 +1 @@
-"use strict";var t=require("@withone/connect");exports.connectButton=function(o,n){let e=t.mountConnectButton(o,t.optionsFromProps(n));return{update(n){e.destroy(),e=t.mountConnectButton(o,t.optionsFromProps(n))},destroy(){e.destroy()}}};
+"use strict";var t=require("@withone/connect");exports.connectButton=function(n,e){const o=t.mountConnectButton(n,e);return{update:t=>o.update(t),destroy:()=>o.destroy()}};

package/dist/svelte.d.ts

@@ -5,7 +5,7 @@
  * Svelte compiler or dependency is involved:
  *
  *   <div use:connectButton={{ authorizeUrl: "/api/one/authorize",
- *     platforms: ["stripe", "notion"],
+ *     platforms: ["stripe", "notion"], connected: data.hasOneGrant,
  *     onSuccess: () => { ... } }} />
  */
 import { type ConnectButtonProps } from "@withone/connect";

package/dist/svelte.esm.js

@@ -1 +1 @@
-import{mountConnectButton as t,optionsFromProps as e}from"@withone/connect";function o(o,r){let n=t(o,e(r));return{update(r){n.destroy(),n=t(o,e(r))},destroy(){n.destroy()}}}export{o as connectButton};
+import{mountConnectButton as t}from"@withone/connect";function o(o,e){const n=t(o,e);return{update:t=>n.update(t),destroy:()=>n.destroy()}}export{o as connectButton};

package/dist/types.d.ts

@@ -8,32 +8,55 @@
  */
 /** Theme of One's hosted connect page. */
 export type OneConnectTheme = "light" | "dark";
-export interface OneConnectOptions {
+/** Theme of the button: fixed, or following the visitor's setting. */
+export type ConnectButtonTheme = "light" | "dark" | "auto";
+/**
+ * Why a flow ended without a grant. The callback route puts only this
+ * code on the return URL; the text shown for it is fixed in the SDK, so
+ * a crafted link can never put its own words in front of the user.
+ *
+ * - `declined`: the user cancelled on One's page.
+ * - `expired`: the attempt took too long or was started elsewhere.
+ * - `failed`: One could not complete the connection.
+ */
+export type ConnectFailureCode = "declined" | "expired" | "failed";
+export interface OneConnectFlowOptions {
     /** The app's own backend authorize route. Relative paths such as
      *  "/api/one/authorize" resolve against the page's origin. */
     authorizeUrl: string;
     /** Theme for One's hosted page. Carried on the URL fragment, which
      *  survives the redirect chain, so the backend forwards nothing. */
+    connectTheme?: OneConnectTheme;
+    /** @deprecated Renamed to `connectTheme`; removed in the next minor. */
     appTheme?: OneConnectTheme;
-    /** The grant completed and the backend stored the tokens. */
+    /** The grant completed and the backend stored the tokens. Fires once
+     *  per page load, on the first flow still mounted when the tab
+     *  returns. Treat it as a hint to refetch: your server is the truth. */
     onSuccess?: () => void;
-    /** The flow ended without a grant: the user declined, the attempt
-     *  expired, or the exchange failed. `message` is safe to show. */
-    onError?: (message: string) => void;
+    /** The flow ended without a grant. `message` is fixed text for
+     *  `code`, safe to show. */
+    onError?: (message: string, code: ConnectFailureCode) => void;
+    /** The user came back with the browser's Back button before finishing
+     *  (the page was restored from the back-forward cache). */
+    onCancel?: () => void;
 }
-export interface OneConnectHandle {
+export interface OneConnectFlow {
     /** Navigates the tab to One's hosted connect flow. */
     open: () => void;
+    /** Swaps the options (callbacks, theme) without losing the flow. */
+    update: (options: OneConnectFlowOptions) => void;
+    /** Stops listening: callbacks no longer fire for this flow. */
+    destroy: () => void;
 }
-/** How the app's callback route reports the outcome on its final
- *  redirect, read off the page URL when the tab returns. */
+/** How the flow ended, read off the page URL when the tab returns. */
 export interface OneConnectReturn {
     status: "success" | "error";
+    code?: ConnectFailureCode;
     message?: string;
 }
 /**
  * A connector chip on the button. Pass One's connector slug ("stripe",
- * "google-calendar") and the SDK shows the logo and the name; pass an
+ * "google-calendar") and the SDK shows its logo and name; pass an
  * object to override either.
  */
 export type ConnectButtonPlatformInput = string | {
@@ -48,31 +71,50 @@ export interface ConnectButtonPlatform {
     imageUrl: string;
 }
 export type ConnectButtonVariant = "default" | "accent" | "block";
+export type ConnectButtonSize = "sm" | "md" | "lg";
 export type ConnectButtonState = "idle" | "connecting" | "connected";
-export interface ConnectButtonOptions {
-    /** Everything the flow needs; the button wires open() and the
-     *  Connecting and Connected states around your callbacks. */
-    connect: OneConnectOptions;
-    /** "Connect your apps" unless overridden. */
-    label?: string;
-    /** default = neutral pill; accent = brand-colored pill; block =
-     *  full-width card with a description and a "Secured by One" foot. */
-    variant?: ConnectButtonVariant;
-    /** Matches the host page, not One's page (that is connect.appTheme). */
-    theme?: OneConnectTheme;
-    /** Connector chips. The first three render; the rest fold into a "+N"
-     *  chip, so that count only ever describes this list. */
+/** One prop shape for every surface: React, Vue, Svelte, the custom
+ *  element and `mountConnectButton`. */
+export interface ConnectButtonProps {
+    /** The app's own backend authorize route; relative is fine. */
+    authorizeUrl: string;
+    /** Connector slugs, or objects that override the name or the logo.
+     *  The first three draw as logos; the rest fold into a "+N" chip. */
     platforms?: ConnectButtonPlatformInput[];
-    /** Sub-line on the block variant, shown while idle. */
-    description?: string;
-    /** Fill of the accent variant; One's lime when omitted. */
+    /** Whether this user has a live grant, from your server. When set, it
+     *  decides the Connected state. When omitted, the button shows
+     *  Connected only right after a successful return. */
+    connected?: boolean;
+    /** Not clickable, for example until terms are accepted. */
+    disabled?: boolean;
+    /** default = neutral, accent = your brand colour, block = a card with
+     *  a description and a "Secured by One" foot. */
+    variant?: ConnectButtonVariant;
+    size?: ConnectButtonSize;
+    /** Stretches to the width of its container. */
+    fullWidth?: boolean;
+    /** Matches the host page. "auto" follows the visitor's setting. */
+    theme?: ConnectButtonTheme;
+    /** Theme of One's hosted page. */
+    connectTheme?: OneConnectTheme;
+    /** @deprecated Renamed to `connectTheme`; removed in the next minor. */
+    appTheme?: OneConnectTheme;
+    /** Fill of the accent variant; One's lime when omitted. The label is
+     *  black or white, whichever reads better on it. */
     accentColor?: string;
-    /** Label for the connected state. */
+    /** "Connect your apps" unless set. */
+    label?: string;
+    /** "Connected" unless set. */
     connectedLabel?: string;
+    /** Sub-line on the block variant. */
+    description?: string;
+    onSuccess?: () => void;
+    onError?: (message: string, code: ConnectFailureCode) => void;
+    onCancel?: () => void;
 }
 export interface ConnectButtonHandle {
-    /** Override the visual state by hand. */
-    setState: (state: ConnectButtonState) => void;
-    /** Remove the button. */
+    /** Applies new props in place, keeping the button's state. */
+    update: (props: ConnectButtonProps) => void;
+    /** Removes the button and stops its callbacks. */
     destroy: () => void;
 }

package/dist/vue.cjs.js

@@ -1 +1 @@
-"use strict";var e=require("vue"),t=require("@withone/connect");const n=e.defineComponent({name:"OneConnectButton",props:{authorizeUrl:{type:String,required:!0},appTheme:{type:String,default:void 0},label:{type:String,default:void 0},variant:{type:String,default:void 0},theme:{type:String,default:void 0},platforms:{type:Array,default:void 0},description:{type:String,default:void 0},accentColor:{type:String,default:void 0},connectedLabel:{type:String,default:void 0}},emits:{success:()=>!0,error:e=>"string"==typeof e},setup(n,{emit:o}){const r=e.ref(null);let i=null;const u=()=>{var e;null===(e=i)||void 0===e||e.destroy(),i=null,r.value&&(i=t.mountConnectButton(r.value,t.optionsFromProps({...n},{onSuccess:()=>o("success"),onError:e=>o("error",e)})))};return e.onMounted(u),e.watch(()=>t.propsIdentity({...n}),u),e.onBeforeUnmount(()=>{var e;null===(e=i)||void 0===e||e.destroy(),i=null}),()=>e.h("div",{ref:r})}});exports.ConnectButton=n;
+"use strict";var e=require("vue"),t=require("@withone/connect");const n={type:Boolean,default:void 0},o=e.defineComponent({name:"OneConnectButton",props:{authorizeUrl:{type:String,required:!0},platforms:{type:Array,default:void 0},connected:n,disabled:n,variant:{type:String,default:void 0},size:{type:String,default:void 0},fullWidth:n,theme:{type:String,default:void 0},connectTheme:{type:String,default:void 0},appTheme:{type:String,default:void 0},accentColor:{type:String,default:void 0},label:{type:String,default:void 0},connectedLabel:{type:String,default:void 0},description:{type:String,default:void 0}},emits:{success:()=>!0,error:(e,t)=>"string"==typeof e&&"string"==typeof t,cancel:()=>!0},setup(n,{emit:o}){const r=e.ref(null);let i=null;const d=()=>({...n,onSuccess:()=>o("success"),onError:(e,t)=>o("error",e,t),onCancel:()=>o("cancel")});return e.onMounted(()=>{r.value&&(i=t.mountConnectButton(r.value,d()))}),e.watch(()=>({...n}),()=>{var e;return null===(e=i)||void 0===e?void 0:e.update(d())},{deep:!0}),e.onBeforeUnmount(()=>{var e;null===(e=i)||void 0===e||e.destroy(),i=null}),()=>e.h("div",{ref:r})}});exports.ConnectButton=o;