fix: reviewed

fix: increase global API rate limits to 1000/min (#3081 )
2026-08-15 11:01:47 +10:00 · 2026-07-28 22:10:37 +09:00 · 2026-07-28 21:50:18 +09:00 · 2026-07-21 15:58:36 +10:00 · 2026-07-21 15:06:36 +10:00 · 2026-07-20 16:40:25 +09:00
166 changed files with 8306 additions and 3110 deletions
@@ -1,3 +1,3 @@
 legacy-peer-deps = true
 prefer-dedupe = true
-min-release-age = 7
+# min-release-age = 7
@@ -11,9 +11,14 @@ Documenso enforces rate limits on all API endpoints to ensure service stability.

 ## HTTP Rate Limits

-**Limit:** 100 requests per minute per IP address  
+**Limit:** 1000 requests per minute per IP address  
 **Response:** 429 Too Many Requests

+<Callout type="info">
+  This is the global per-IP ceiling. Your organisation may have its own rate limits configured below
+  this value, in which case you can be rate-limited before reaching the global limit.
+</Callout>
+
 ### Rate Limit Response

 ```json
@@ -65,3 +70,4 @@ When you exceed a resource limit:
 - [Authentication](/docs/developers/getting-started/authentication) - API authentication guide
 - [API Versioning](/docs/developers/api/versioning) - API version management
 - [First API Call](/docs/developers/getting-started/first-api-call) - Getting started with the API
+- [Organisation Limits](/docs/self-hosting/configuration/organisation-limits) - Admins: set per-organisation resource quotas and rate limits (the HTTP rate limit above is separate and not admin-settable)
@@ -463,6 +463,7 @@ const response = await fetch(`${BASE_URL}/template/use`, {
      typedSignatureEnabled: true,
      uploadSignatureEnabled: false,
      drawSignatureEnabled: true,
+      qrSignatureEnabled: true,
    },
    distributeDocument: true,
  }),
@@ -483,6 +484,7 @@ const response = await fetch(`${BASE_URL}/template/use`, {
 | `typedSignatureEnabled`  | boolean | Allow typed signatures          |
 | `uploadSignatureEnabled` | boolean | Allow uploaded signature images |
 | `drawSignatureEnabled`   | boolean | Allow drawn signatures          |
+| `qrSignatureEnabled`     | boolean | Allow QR code handoff to a mobile device |

 ---

@@ -390,6 +390,7 @@ const response = await fetch(`${BASE_URL}/template/update`, {
      typedSignatureEnabled: true, // Allow typed signatures
      drawSignatureEnabled: true, // Allow drawn signatures
      uploadSignatureEnabled: false, // Disable uploaded signatures
+      qrSignatureEnabled: true, // Allow QR code handoff to a mobile device
    },
  }),
 });
@@ -472,7 +472,7 @@ Send the same document to multiple recipients in parallel. Useful for policy ack
    <code>distributeDocument: true</code>
  </Step>
  <Step>
-    Process in batches with a short delay to respect rate limits (e.g. 100 requests/minute)
+    Process in batches with a short delay to respect rate limits (e.g. 1000 requests/minute)
  </Step>
 </Steps>

@@ -638,8 +638,8 @@ done
 </Tabs>

 <Callout type="info">
-  The API allows 100 requests per minute. For large batches, implement rate limiting with delays
-  between requests to avoid hitting limits.
+  The API allows 1000 requests per minute (your organisation may have its own lower limit). For large
+  batches, implement rate limiting with delays between requests to avoid hitting limits.
 </Callout>

 ---
@@ -483,7 +483,7 @@ The API returns standard HTTP status codes and JSON error responses:

 ### Handling Rate Limits

-The API allows 100 requests per minute per IP address. When rate limited, wait at least 60 seconds before retrying:
+The API allows 1000 requests per minute per IP address. Your organisation may have its own lower rate limits. When rate limited, wait at least 60 seconds before retrying:

 ```javascript
 async function fetchWithRetry(url, options, maxRetries = 3) {
@@ -68,6 +68,7 @@ All webhook events share a common structure:
 | `typedSignatureEnabled`    | boolean | Whether typed signatures are allowed    |
 | `uploadSignatureEnabled`   | boolean | Whether uploaded signatures are allowed |
 | `drawSignatureEnabled`     | boolean | Whether drawn signatures are allowed    |
+| `qrSignatureEnabled`       | boolean | Whether QR code handoff to a mobile device is allowed |
 | `language`                 | string  | Document language code                  |
 | `distributionMethod`       | string  | How document is distributed             |
 | `emailSettings`            | object? | Custom email settings for this document |
@@ -138,6 +139,7 @@ Triggered when a new document is created.
      "typedSignatureEnabled": true,
      "uploadSignatureEnabled": true,
      "drawSignatureEnabled": true,
+      "qrSignatureEnabled": true,
      "language": "en",
      "distributionMethod": "EMAIL",
      "emailSettings": null
@@ -230,6 +232,7 @@ The document status changes to `PENDING` and recipients have `sendStatus: "SENT"
      "typedSignatureEnabled": true,
      "uploadSignatureEnabled": true,
      "drawSignatureEnabled": true,
+      "qrSignatureEnabled": true,
      "language": "en",
      "distributionMethod": "EMAIL",
      "emailSettings": null
@@ -422,6 +425,7 @@ The document status changes to `COMPLETED` and `completedAt` is set.
      "typedSignatureEnabled": true,
      "uploadSignatureEnabled": true,
      "drawSignatureEnabled": true,
+      "qrSignatureEnabled": true,
      "language": "en",
      "distributionMethod": "EMAIL",
      "emailSettings": null
@@ -599,6 +603,7 @@ This event is **not** triggered when a recipient hides a document from their inb
      "typedSignatureEnabled": true,
      "uploadSignatureEnabled": true,
      "drawSignatureEnabled": true,
+      "qrSignatureEnabled": true,
      "language": "en",
      "distributionMethod": "EMAIL",
      "emailSettings": null
@@ -76,6 +76,8 @@ The Enterprise Edition is required when you:
    4. Restart your Documenso instance
    5. Verify the license is active in the **Admin Panel** under the **Stats** section

+    See [Apply Your License Key](/docs/self-hosting/configuration/license) for the full walkthrough, including how to enable individual features once licensed.
+
  </Accordion>
 </Accordions>

@@ -197,7 +199,7 @@ See [Support](/docs/policies/support) for complete support options.
    1. Sign the Enterprise license agreement
    2. Receive license key and access credentials
    3. Deploy using [self-hosting guides](/docs/self-hosting) or access Documenso Cloud
-    4. Configure Enterprise features with support assistance
+    4. Apply the key — see [Apply Your License Key](/docs/self-hosting/configuration/license) — and configure Enterprise features with support assistance

  </Step>
  <Step>
@@ -238,6 +240,7 @@ See [Support](/docs/policies/support) for complete support options.

 ## Related

+- [Apply Your License Key](/docs/self-hosting/configuration/license) - Step-by-step license activation
 - [Community Edition](/docs/policies/community-edition) - AGPL-3.0 open-source license
 - [Licenses](/docs/policies/licenses) - Complete licensing overview and FAQ
 - [Support](/docs/policies/support) - Support channels and response times
@@ -41,12 +41,17 @@ When a limit is reached, requests return a `429 Too Many Requests` response with

 | Action | Limit | Window |
 | --- | --- | --- |
-| API requests (v1 and v2) | 100 requests | 1 minute |
+| API requests (v1 and v2) | 1000 requests | 1 minute |
 | File uploads | 20 requests | 1 minute |
 | AI features | 3 requests | 1 minute |

 Authentication endpoints (login, signup, password reset, etc.) are also rate-limited to protect against abuse.

+<Callout type="info">
+  The API request limit above is the global per-IP ceiling. Individual organisations also have their
+  own rate limits, which may be configured below this value.
+</Callout>
+
 <Callout type="info">
  Rate limits may vary by plan. Enterprise plans can include higher or custom limits. Contact
  [sales](https://documen.so/sales) for details.
@@ -443,11 +443,11 @@ Telemetry collects only: app version, installation ID, and node ID. No personal

 ## Enterprise Features

-These variables require an active [Enterprise Edition](/docs/policies/enterprise-edition) license. Obtain a license key from [license.documenso.com](https://license.documenso.com) and set it below to unlock enterprise features such as SSO, embed editor, and 21 CFR Part 11 compliance.
+These variables require an active [Enterprise Edition](/docs/policies/enterprise-edition) license. Obtain a license key from [license.documenso.com](https://license.documenso.com) and set it below to unlock enterprise features such as SSO, embed editor, and 21 CFR Part 11 compliance. See [Apply Your License Key](/docs/self-hosting/configuration/license) for step-by-step setup.

 | Variable                             | Description                                      |
 | ------------------------------------ | ------------------------------------------------ |
-| `NEXT_PRIVATE_DOCUMENSO_LICENSE_KEY` | License key for enterprise features              |
+| `NEXT_PRIVATE_DOCUMENSO_LICENSE_KEY` | License key for enterprise features — see [Apply Your License Key](/docs/self-hosting/configuration/license) for how to apply it |
 | `NEXT_PRIVATE_STRIPE_API_KEY`        | Stripe API key for billing                       |
 | `NEXT_PRIVATE_STRIPE_WEBHOOK_SECRET` | Stripe webhook secret                            |
 | `NEXT_PRIVATE_SES_ACCESS_KEY_ID`     | AWS SES access key for email domain verification |
@@ -510,4 +510,5 @@ NEXT_PRIVATE_SIGNING_PASSPHRASE="your-certificate-password"
 - [Email Configuration](/docs/self-hosting/configuration/email) - Configure email delivery
 - [Storage Configuration](/docs/self-hosting/configuration/storage) - Set up S3 storage
 - [Signing Certificate](/docs/self-hosting/configuration/signing-certificate) - Configure document signing
+- [Organisation Limits](/docs/self-hosting/configuration/organisation-limits) - Set per-organisation document, email, and API limits from the admin panel
 - [Troubleshooting](/docs/self-hosting/maintenance/troubleshooting) - Common configuration issues
@@ -29,6 +29,11 @@ description: Configure your self-hosted Documenso instance with environment vari
    description="Digital signature certificate setup."
    href="/docs/self-hosting/configuration/signing-certificate"
  />
+  <Card
+    title="Organisation Limits"
+    description="Set per-organisation document, email, and API limits via the admin panel."
+    href="/docs/self-hosting/configuration/organisation-limits"
+  />
 </Cards>

 ## Required Configuration
@@ -0,0 +1,107 @@
+---
+title: Apply Your License Key
+description: Activate your Enterprise license key to unlock enterprise features on your self-hosted instance.
+---
+
+import { Accordion, Accordions } from 'fumadocs-ui/components/accordion';
+import { Callout } from 'fumadocs-ui/components/callout';
+import { Tab, Tabs } from 'fumadocs-ui/components/tabs';
+
+A license key activates the Enterprise features available to your self-hosted instance, such as CSC signing, SSO, embed white-labelling, and 21 CFR Part 11 compliance.
+
+<Callout type="info">
+  The license key applies to your **whole instance**, not an individual user account. There's one
+  key per deployment.
+</Callout>
+
+## Prerequisites
+
+- An active Enterprise license key — contact [sales](https://documen.so/enterprise) to set up an
+  Enterprise subscription, then copy your key from [license.documenso.com](https://license.documenso.com).
+  See [Enterprise Edition](/docs/policies/enterprise-edition) for details.
+- A running self-hosted Documenso instance that you're able to restart
+
+## Step 1: Set the environment variable
+
+Set `NEXT_PRIVATE_DOCUMENSO_LICENSE_KEY` to your license key.
+
+<Tabs items={['Docker Compose', 'docker run', '.env']}>
+<Tab value="Docker Compose">
+
+Add the variable to your `.env` file (or directly under `environment:` in `compose.yml`):
+
+```bash
+NEXT_PRIVATE_DOCUMENSO_LICENSE_KEY=your-license-key-here
+```
+
+Then apply it:
+
+```bash
+docker compose up -d
+```
+
+</Tab>
+<Tab value="docker run">
+
+```bash
+docker run -d \
+  --name documenso \
+  -e NEXT_PRIVATE_DOCUMENSO_LICENSE_KEY=your-license-key-here \
+  documenso/documenso:latest
+```
+
+</Tab>
+<Tab value=".env">
+
+If you're running Documenso directly (not in a container), add the variable to your `.env` file:
+
+```bash
+NEXT_PRIVATE_DOCUMENSO_LICENSE_KEY=your-license-key-here
+```
+
+</Tab>
+</Tabs>
+
+## Step 2: Restart the instance
+
+The license key is only read once, at process startup. Setting the variable in a running container or shell has no effect until the process restarts.
+
+```bash
+# Docker Compose
+docker compose restart documenso
+
+# Docker
+docker restart documenso
+```
+
+On startup, Documenso validates the key against the Documenso license server and caches the result locally for future startups, so a brief license-server outage won't lock you out.
+
+## What the license enables
+
+A valid license doesn't turn every enterprise feature on everywhere — activation depends on the feature:
+
+- **CSC signing** activates instance-wide automatically once the license is active and CSC transport is configured. See [CSC / QES Signing](/docs/self-hosting/configuration/signing-certificate/csc-qes) for the full setup.
+- **SSO, embed white-labelling, 21 CFR Part 11, and similar** are provisioned per organisation. Follow each feature's own guide to configure it once the license is active.
+
+## Troubleshooting
+
+<Accordions type="multiple">
+  <Accordion title="Enterprise features are still unavailable after applying the key">
+    - Confirm the key is present in the environment the running process actually reads — `docker
+      exec` into the container and check `env | grep LICENSE` if unsure.
+    - Confirm the instance was fully restarted after the variable was set, not just reloaded.
+    - Re-copy the key to rule out truncation or accidental whitespace.
+  </Accordion>
+  <Accordion title="A specific feature still isn't working">
+    Instance-wide features (like CSC signing) also need their own configuration — an active license
+    alone isn't enough. Check that feature's guide to confirm the required settings are in place.
+    Per-organisation features additionally need to be provisioned for the organisation that's using
+    them.
+  </Accordion>
+</Accordions>
+
+## See Also
+
+- [Environment Variables](/docs/self-hosting/configuration/environment) - Complete configuration reference
+- [Enterprise Edition](/docs/policies/enterprise-edition) - What's included and how to purchase a license
+- [CSC / QES Signing](/docs/self-hosting/configuration/signing-certificate/csc-qes) - Enable CSC-based signing
@@ -2,12 +2,14 @@
  "title": "Configuration",
  "pages": [
    "environment",
+    "license",
    "database",
    "email",
    "storage",
    "background-jobs",
    "signing-certificate",
    "telemetry",
+    "organisation-limits",
    "advanced"
  ]
 }
@@ -0,0 +1,111 @@
+---
+title: Organisation Limits
+description: View and set per-organisation document, email, and API limits on a self-hosted Documenso instance using the admin panel's subscription claims.
+---
+
+import { Callout } from 'fumadocs-ui/components/callout';
+
+Per-organisation limits — document, email, and API usage, plus feature toggles and team/member caps — are controlled by **subscription claims**. You configure them in the admin panel, not through environment variables.
+
+There are three distinct kinds of limit:
+
+| Limit                  | Caps                                              | Admin-settable          |
+| ---------------------- | ------------------------------------------------- | ----------------------- |
+| Resource quota         | Documents, emails, and API requests **per month** | Yes — per claim and org |
+| Resource rate limit    | The same resources over a short window (e.g. `1h`) | Yes — per claim and org |
+| Global HTTP rate limit | API requests per IP (1000/min, hardcoded)         | No — see [Limitations](#limitations) |
+
+## Prerequisites
+
+- A running self-hosted Documenso instance.
+- An account with the **`ADMIN`** role — an account-level role, separate from organisation and team roles. New accounts are created with the `USER` role only. Grant the first admin by adding `ADMIN` to that user's `roles` directly in the database; after that, an existing admin can grant the role to others under **Admin Panel > Users > _(user)_ > Roles > Update user**.
+
+Open the admin panel at `/admin`. The sidebar sections used below are **Claims**, **Organisations**, and **Organisation Stats**.
+
+## Viewing usage
+
+**One organisation:** open **Admin Panel > Organisations** and select it. The **Organisation usage** section shows the current period's document, email, and API usage against its quotas.
+
+**All organisations:** open **Admin Panel > Organisation Stats** to sort and filter monthly usage. Filter by **claim** and by **period** (a UTC calendar month, shown as `YYYY-MM`), and switch between **Show usage**, **Show usage with quotas**, and **Show daily averages**.
+
+<Callout type="warn">
+  Usage counts **attempts**, not only successful actions. A request that exceeds a quota is still counted before it is rejected, so displayed usage can read higher than the number of actions that succeeded.
+</Callout>
+
+## Subscription claims
+
+A subscription claim is a named bundle of limits and feature flags (for example `Free`, `Individual`, `Teams`, `Platform`, or `Enterprise`). Claims are **templates**: when an organisation is created it receives a private copy of its claim and reads from that copy afterwards. Editing a claim template therefore affects organisations created later, not existing ones — to change an existing organisation, [edit it directly](#change-limits-for-one-organisation).
+
+### Claim fields
+
+Under **Admin Panel > Claims** (`/admin/claims`), each claim has:
+
+| Field                   | Controls                                                                          |
+| ----------------------- | --------------------------------------------------------------------------------- |
+| **Name**                | The claim's display name.                                                         |
+| **Team Count**          | Teams allowed. `0` = unlimited.                                                   |
+| **Member Count**        | Members allowed. `0` = unlimited.                                                 |
+| **Envelope Item Count** | Uploaded files allowed per envelope. Minimum `1`.                                |
+| **Recipient Count**     | Recipients allowed per document. `0` = unlimited.                                |
+| **Feature Flags**       | Feature toggles (see [Feature flags](#feature-flags)).                            |
+| **Limits**              | Monthly quota and rate-limit windows for Documents, Emails, and API.              |
+| **Email transport**     | Transport the claim uses. *Default (system mailer)* uses the instance default.    |
+
+### Quotas and rate limits
+
+The **Limits** section has a column for **Documents**, **Emails**, and **API**, each with two controls:
+
+- **Monthly quota** — how many of that resource are allowed per calendar month. An **empty** field is unlimited; **`0`** blocks the resource entirely.
+- **Rate limit windows** — optional short-window caps, each a duration and a maximum. A window is a number and a unit (`s`, `m`, `h`, `d`), such as `5m`, `1h`, or `24h`, and must be unique within the resource.
+
+<Callout type="warn">
+  Quotas and counts use opposite conventions for "unlimited": an **empty** quota is unlimited (and `0` blocks the resource), whereas `0` in the **Team**, **Member**, and **Recipient Count** fields means unlimited.
+</Callout>
+
+### Feature flags
+
+The **Feature Flags** section toggles capabilities such as Unlimited documents, Branding, Hide Documenso branding, Email domains, Embed authoring, Embed signing, White label for embed authoring/signing, 21 CFR, HIPAA, Authentication portal, Allow Legacy Envelopes, Signing reminders, QES signing, and Disable emails.
+
+Some flags are Enterprise features. If your license does not include one, it is marked and cannot be enabled (you can still turn it off). See [Enterprise Edition](/docs/policies/enterprise-edition).
+
+### Create or edit a claim template
+
+1. Go to **Admin Panel > Claims**.
+2. Select **New claim**, or select an existing claim to edit it.
+3. Set the counts, feature flags, and the **Limits** section.
+4. Save. Changes apply to organisations created afterwards, not existing ones.
+
+### Change limits for one organisation
+
+To change limits for an existing organisation, edit it directly rather than its claim template.
+
+1. Go to **Admin Panel > Organisations** and open the organisation.
+2. Adjust its quota, rate-limit, feature-flag, or email-transport fields.
+3. Save. Changes take effect immediately.
+
+The organisation also shows the **Inherited subscription claim** it was created from.
+
+## Usage reset
+
+Monthly quota usage is keyed to the **UTC calendar month**. There is no scheduled reset job — when the month rolls over, the new period's counter starts at `0`.
+
+## Limitations
+
+The **global HTTP rate limit is not configurable.** Documenso enforces a hardcoded **1000 requests per minute per IP address** on its API endpoint groups (`/api/v1`, `/api/v2`, and the tRPC API are limited separately), returning `429 Too Many Requests`. It is a per-IP safeguard applied at the HTTP layer — not per-organisation, not stored on any claim, and not adjustable from the admin panel. See [Rate Limits](/docs/developers/api/rate-limits).
+
+## Troubleshooting
+
+| Symptom                                          | Cause and fix                                                                                                                    |
+| ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------- |
+| An organisation hit its limit unexpectedly       | Usage counts rejected over-quota attempts. Compare usage against the quota under **Organisation Stats > Show usage with quotas**. |
+| A resource is blocked entirely, not just capped  | The **Monthly quota** is `0`, which blocks the resource. Leave it empty for unlimited.                                           |
+| Emails are not sending for an organisation        | Check whether the **Disable emails** flag is enabled on the organisation's claim — it blocks all emails regardless of quota.     |
+| A claim template edit had no effect              | Template edits are not retroactive. Edit the organisation directly under **Admin Panel > Organisations**.                        |
+
+---
+
+## See Also
+
+- [Environment Variables](/docs/self-hosting/configuration/environment) - All configuration options
+- [Rate Limits](/docs/developers/api/rate-limits) - The global HTTP API rate limit (separate from claims)
+- [Enterprise Edition](/docs/policies/enterprise-edition) - Features unlocked by license flags
@@ -49,7 +49,7 @@ The callback URL is fixed — Documenso derives it from `NEXT_PUBLIC_WEBAPP_URL`

 ### Enterprise Edition license

-CSC mode is gated by the `instanceCscSigning` license flag. Without a valid Enterprise license, the transport refuses to start (`CSC_UNLICENSED`).
+CSC mode is gated by the `instanceCscSigning` license flag. Without a valid Enterprise license, the transport refuses to start (`CSC_UNLICENSED`). See [Apply Your License Key](/docs/self-hosting/configuration/license) to activate one.

 </Step>
 <Step>
@@ -141,7 +141,7 @@ See the [Quick Start guide](/docs/self-hosting/getting-started/quick-start) for

 Self-hosted Documenso includes full core functionality under the AGPL-3.0 license. If you need enterprise features such as SSO, embed editor white label, or 21 CFR Part 11 compliance, you can activate them with a license key.

-See [Enterprise Edition](/docs/policies/enterprise-edition) for details and [Licenses](/docs/policies/licenses) for a comparison.
+See [Enterprise Edition](/docs/policies/enterprise-edition) for details and [Licenses](/docs/policies/licenses) for a comparison. Already have a key? See [Apply Your License Key](/docs/self-hosting/configuration/license).

 ---

@@ -3,7 +3,7 @@
  "version": "0.0.0",
  "private": true,
  "scripts": {
-    "build": "next build",
+    "build": "NEXT_IGNORE_INCORRECT_LOCKFILE=true next build",
    "dev": "next dev",
    "start": "next start",
    "types:check": "fumadocs-mdx && next typegen && tsc --noEmit",
@@ -29,7 +29,7 @@
    "@types/node": "^25.1.0",
    "@types/react": "^19.2.10",
    "@types/react-dom": "^19.2.3",
-    "postcss": "^8.5.14",
+    "postcss": "^8.5.19",
    "tailwindcss": "^4.1.18",
    "typescript": "^5.9.3"
  }
@@ -83,7 +83,7 @@
  --accent: hsl(0 0% 27.8431%);
  --accent-foreground: hsl(95.0847 71.0843% 67.451%);
  --destructive: hsl(0 86.5979% 61.9608%);
-  --destructive-foreground: hsl(0 87.6289% 19.0196%);
+  --destructive-foreground: hsl(0 0% 98.0392%);
  --border: hsl(0 0% 27.8431%);
  --input: hsl(0 0% 27.8431%);
  --ring: hsl(95.0847 71.0843% 67.451%);
@@ -0,0 +1,119 @@
+import { Alert, AlertDescription } from '@documenso/ui/primitives/alert';
+import { Button } from '@documenso/ui/primitives/button';
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@documenso/ui/primitives/dialog';
+import { Trans } from '@lingui/react/macro';
+import { useState } from 'react';
+
+export type BrandingPreferencesResetDialogProps = {
+  hasAdvancedBranding: boolean;
+  isSubmitting: boolean;
+  onReset: () => Promise<void>;
+  trigger?: React.ReactNode;
+};
+
+export const BrandingPreferencesResetDialog = ({
+  hasAdvancedBranding,
+  isSubmitting,
+  onReset,
+  trigger,
+}: BrandingPreferencesResetDialogProps) => {
+  const [open, setOpen] = useState(false);
+  const [isResetting, setIsResetting] = useState(false);
+
+  const isLoading = isSubmitting || isResetting;
+
+  const handleResetToDefaults = async () => {
+    setIsResetting(true);
+
+    try {
+      await onReset();
+      setOpen(false);
+    } catch {
+      // The submit handler surfaces its own error toast. Keep the dialog open
+      // so the user can retry.
+    } finally {
+      setIsResetting(false);
+    }
+  };
+
+  return (
+    <Dialog open={open} onOpenChange={(value) => !isLoading && setOpen(value)}>
+      <DialogTrigger asChild>
+        {trigger ?? (
+          <Button variant="destructive" type="button" size="sm" disabled={isLoading}>
+            <Trans>Reset to defaults</Trans>
+          </Button>
+        )}
+      </DialogTrigger>
+
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>
+            <Trans>Reset branding preferences</Trans>
+          </DialogTitle>
+
+          <DialogDescription>
+            <Trans>
+              This will reset all branding preferences to their default values and save the changes immediately.
+            </Trans>
+          </DialogDescription>
+        </DialogHeader>
+
+        <Alert variant="warning">
+          <AlertDescription>
+            <p>
+              <Trans>Once confirmed, the following will be reset:</Trans>
+            </p>
+
+            <ul className="mt-0.5 list-inside list-disc">
+              <li>
+                <Trans>Custom branding enabled setting</Trans>
+              </li>
+              <li>
+                <Trans>Branding logo</Trans>
+              </li>
+              <li>
+                <Trans>Brand website and brand details</Trans>
+              </li>
+              <li>
+                <Trans>Brand colours, including background, foreground, primary, and border colours</Trans>
+              </li>
+
+              {hasAdvancedBranding && (
+                <>
+                  <li>
+                    <Trans>Border radius</Trans>
+                  </li>
+                  <li>
+                    <Trans>Custom CSS</Trans>
+                  </li>
+                </>
+              )}
+            </ul>
+          </AlertDescription>
+        </Alert>
+
+        <DialogFooter>
+          <DialogClose asChild>
+            <Button type="button" variant="secondary" disabled={isLoading}>
+              <Trans>Cancel</Trans>
+            </Button>
+          </DialogClose>
+
+          <Button type="button" variant="destructive" loading={isLoading} onClick={() => void handleResetToDefaults()}>
+            <Trans>Reset to defaults</Trans>
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
@@ -0,0 +1,141 @@
+import { Alert, AlertDescription } from '@documenso/ui/primitives/alert';
+import { Button } from '@documenso/ui/primitives/button';
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@documenso/ui/primitives/dialog';
+import { Trans } from '@lingui/react/macro';
+import { useState } from 'react';
+
+export type DocumentPreferencesResetDialogProps = {
+  isSubmitting: boolean;
+  onReset: () => Promise<void>;
+  showAiFeatures?: boolean;
+  showDocumentVisibility?: boolean;
+  showIncludeSenderDetails?: boolean;
+};
+
+export const DocumentPreferencesResetDialog = ({
+  isSubmitting,
+  onReset,
+  showAiFeatures = false,
+  showDocumentVisibility = false,
+  showIncludeSenderDetails = false,
+}: DocumentPreferencesResetDialogProps) => {
+  const [open, setOpen] = useState(false);
+  const [isResetting, setIsResetting] = useState(false);
+
+  const isLoading = isSubmitting || isResetting;
+
+  const handleResetToDefaults = async () => {
+    setIsResetting(true);
+
+    try {
+      await onReset();
+      setOpen(false);
+    } catch {
+      // The submit handler surfaces its own error toast. Keep the dialog open
+      // so the user can retry.
+    } finally {
+      setIsResetting(false);
+    }
+  };
+
+  return (
+    <Dialog open={open} onOpenChange={(value) => !isLoading && setOpen(value)}>
+      <DialogTrigger asChild>
+        <Button variant="destructive" type="button" size="sm" disabled={isLoading}>
+          <Trans>Reset to defaults</Trans>
+        </Button>
+      </DialogTrigger>
+
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>
+            <Trans>Reset document preferences</Trans>
+          </DialogTitle>
+
+          <DialogDescription>
+            <Trans>
+              This will reset all document preferences to their default values and save the changes immediately.
+            </Trans>
+          </DialogDescription>
+        </DialogHeader>
+
+        <Alert variant="warning">
+          <AlertDescription>
+            <p>
+              <Trans>Once confirmed, the following will be reset:</Trans>
+            </p>
+
+            <ul className="mt-0.5 list-inside list-disc">
+              {showDocumentVisibility && (
+                <li>
+                  <Trans>Default document visibility</Trans>
+                </li>
+              )}
+              <li>
+                <Trans>Default document language</Trans>
+              </li>
+              <li>
+                <Trans>Default date format</Trans>
+              </li>
+              <li>
+                <Trans>Default time zone</Trans>
+              </li>
+              <li>
+                <Trans>Default signature settings</Trans>
+              </li>
+              {showIncludeSenderDetails && (
+                <li>
+                  <Trans>Send on behalf of team</Trans>
+                </li>
+              )}
+              <li>
+                <Trans>Include the signing certificate in the document</Trans>
+              </li>
+              <li>
+                <Trans>Include the audit logs in the document</Trans>
+              </li>
+              <li>
+                <Trans>Default recipients</Trans>
+              </li>
+              <li>
+                <Trans>Delegate document ownership</Trans>
+              </li>
+              <li>
+                <Trans>Default envelope expiration</Trans>
+              </li>
+              <li>
+                <Trans>Default signing reminders</Trans>
+              </li>
+              {showAiFeatures && (
+                <li>
+                  <Trans>AI features</Trans>
+                </li>
+              )}
+            </ul>
+          </AlertDescription>
+        </Alert>
+
+        <DialogFooter>
+          <DialogClose asChild>
+            <Button type="button" variant="secondary" disabled={isLoading}>
+              <Trans>Cancel</Trans>
+            </Button>
+          </DialogClose>
+
+          <Button type="button" variant="destructive" loading={isLoading} onClick={() => void handleResetToDefaults()}>
+            <Trans>Reset to defaults</Trans>
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
@@ -122,7 +122,7 @@ export const FolderDeleteDialog = ({ folder, isOpen, onOpenChange }: FolderDelet
                    <FormLabel>
                      <Trans>
                        Confirm by typing:{' '}
-                        <span className="font-semibold font-sm text-destructive">{deleteMessage}</span>
+                        <span className="font-semibold text-destructive text-sm">{deleteMessage}</span>
                      </Trans>
                    </FormLabel>
                    <FormControl>
@@ -336,7 +336,7 @@ const BillingPlanForm = ({ value, onChange, plans, canCreateFreeOrganisation }:
        >
          <div className="w-full text-left">
            <div className="flex items-center justify-between">
-              <p className="text-medium">
+              <p className="font-medium">
                <Trans context="Plan price">Free</Trans>
              </p>

@@ -115,7 +115,7 @@ export const OrganisationEmailDomainDeleteDialog = ({
                    <FormLabel>
                      <Trans>
                        Confirm by typing{' '}
-                        <span className="font-semibold font-sm text-destructive">{deleteMessage}</span>
+                        <span className="font-semibold text-destructive text-sm">{deleteMessage}</span>
                      </Trans>
                    </FormLabel>
                    <FormControl>
@@ -370,7 +370,7 @@ export const OrganisationMemberInviteDialog = ({ trigger, ...props }: Organisati
                          <button
                            type="button"
                            className={cn(
-                              'justify-left inline-flex h-10 w-10 items-center text-slate-500 hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50',
+                              'inline-flex h-10 w-10 items-center justify-start text-slate-500 hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50',
                              index === 0 ? 'mt-8' : 'mt-0',
                            )}
                            disabled={organisationMemberInvites.length === 1}
@@ -13,10 +13,19 @@ export type SignFieldSignatureDialogProps = {
  typedSignatureEnabled?: boolean;
  uploadSignatureEnabled?: boolean;
  drawSignatureEnabled?: boolean;
+  qrSignatureEnabled?: boolean;
 };

 export const SignFieldSignatureDialog = createCallable<SignFieldSignatureDialogProps, string | null>(
-  ({ call, fullName, typedSignatureEnabled, uploadSignatureEnabled, drawSignatureEnabled, initialSignature }) => {
+  ({
+    call,
+    fullName,
+    typedSignatureEnabled,
+    uploadSignatureEnabled,
+    drawSignatureEnabled,
+    qrSignatureEnabled,
+    initialSignature,
+  }) => {
    const [localSignature, setLocalSignature] = useState(initialSignature);

    return (
@@ -36,6 +45,7 @@ export const SignFieldSignatureDialog = createCallable<SignFieldSignatureDialogP
              typedSignatureEnabled={typedSignatureEnabled}
              uploadSignatureEnabled={uploadSignatureEnabled}
              drawSignatureEnabled={drawSignatureEnabled}
+              qrSignatureEnabled={qrSignatureEnabled}
            />
          </div>

@@ -0,0 +1,250 @@
+import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import { trpc } from '@documenso/trpc/react';
+import { ZCreateApiTokenRequestSchema } from '@documenso/trpc/server/api-token-router/create-api-token.types';
+import { CopyTextButton } from '@documenso/ui/components/common/copy-text-button';
+import { Button } from '@documenso/ui/primitives/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@documenso/ui/primitives/dialog';
+import {
+  Form,
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@documenso/ui/primitives/form/form';
+import { Input } from '@documenso/ui/primitives/input';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@documenso/ui/primitives/select';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { msg } from '@lingui/core/macro';
+import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';
+import type * as DialogPrimitive from '@radix-ui/react-dialog';
+import { useEffect, useState } from 'react';
+import { useForm } from 'react-hook-form';
+import { match } from 'ts-pattern';
+import type { z } from 'zod';
+
+import { useCurrentTeam } from '~/providers/team';
+
+const NEVER_EXPIRE = 'NEVER' as const;
+
+export const EXPIRATION_DATES = {
+  ONE_WEEK: msg`7 days`,
+  ONE_MONTH: msg`1 month`,
+  THREE_MONTHS: msg`3 months`,
+  SIX_MONTHS: msg`6 months`,
+  ONE_YEAR: msg`12 months`,
+  [NEVER_EXPIRE]: msg`Never`,
+} as const;
+
+const ZCreateTokenFormSchema = ZCreateApiTokenRequestSchema.pick({
+  tokenName: true,
+  expirationDate: true,
+});
+
+type TCreateTokenFormSchema = z.infer<typeof ZCreateTokenFormSchema>;
+
+export type TokenCreateDialogProps = {
+  trigger?: React.ReactNode;
+} & Omit<DialogPrimitive.DialogProps, 'children'>;
+
+export const TokenCreateDialog = ({ trigger, ...props }: TokenCreateDialogProps) => {
+  const { _ } = useLingui();
+  const { toast } = useToast();
+
+  const team = useCurrentTeam();
+
+  const [open, setOpen] = useState(false);
+  const [createdToken, setCreatedToken] = useState<string | null>(null);
+
+  const form = useForm<TCreateTokenFormSchema>({
+    resolver: zodResolver(ZCreateTokenFormSchema),
+    defaultValues: {
+      tokenName: '',
+      expirationDate: 'THREE_MONTHS',
+    },
+  });
+
+  const { mutateAsync: createToken } = trpc.apiToken.create.useMutation();
+
+  const onSubmit = async ({ tokenName, expirationDate }: TCreateTokenFormSchema) => {
+    try {
+      const { token } = await createToken({
+        teamId: team.id,
+        tokenName,
+        expirationDate: expirationDate === NEVER_EXPIRE ? null : expirationDate,
+      });
+
+      setCreatedToken(token);
+    } catch (err) {
+      const error = AppError.parseError(err);
+
+      const errorMessage = match(error.code)
+        .with(AppErrorCode.UNAUTHORIZED, () => msg`You do not have permission to create a token for this team.`)
+        .otherwise(() => msg`Something went wrong. Please try again later.`);
+
+      toast({
+        title: _(msg`An error occurred`),
+        description: _(errorMessage),
+        variant: 'destructive',
+        duration: 5000,
+      });
+    }
+  };
+
+  useEffect(() => {
+    if (open) {
+      form.reset();
+      setCreatedToken(null);
+    }
+  }, [open, form]);
+
+  return (
+    <Dialog open={open} onOpenChange={(value) => !form.formState.isSubmitting && setOpen(value)} {...props}>
+      <DialogTrigger onClick={(e) => e.stopPropagation()} asChild>
+        {trigger ?? (
+          <Button className="flex-shrink-0">
+            <Trans>Create token</Trans>
+          </Button>
+        )}
+      </DialogTrigger>
+
+      <DialogContent
+        className="max-w-lg"
+        position="center"
+        onInteractOutside={(event) => {
+          // Prevent losing the created token by accidentally clicking outside the dialog.
+          if (createdToken) {
+            event.preventDefault();
+          }
+        }}
+      >
+        {createdToken ? (
+          <>
+            <DialogHeader>
+              <DialogTitle>
+                <Trans>Token created</Trans>
+              </DialogTitle>
+
+              <DialogDescription>
+                <Trans>Copy your token now. For security reasons you will not be able to see it again.</Trans>
+              </DialogDescription>
+            </DialogHeader>
+
+            <div className="relative">
+              <Input
+                className="pr-12 font-mono text-sm"
+                aria-label={_(msg`Your new API token`)}
+                name="createdToken"
+                readOnly
+                value={createdToken}
+              />
+              <div className="absolute top-0 right-2 bottom-0 flex items-center justify-center">
+                <CopyTextButton
+                  value={createdToken}
+                  onCopySuccess={() => toast({ title: _(msg`Token copied to clipboard`) })}
+                />
+              </div>
+            </div>
+
+            <DialogFooter>
+              <Button type="button" onClick={() => setOpen(false)}>
+                <Trans>Done</Trans>
+              </Button>
+            </DialogFooter>
+          </>
+        ) : (
+          <>
+            <DialogHeader>
+              <DialogTitle>
+                <Trans>Create API token</Trans>
+              </DialogTitle>
+
+              <DialogDescription>
+                <Trans>Use API tokens to authenticate with the Documenso API.</Trans>
+              </DialogDescription>
+            </DialogHeader>
+
+            <Form {...form}>
+              <form onSubmit={form.handleSubmit(onSubmit)}>
+                <fieldset className="flex h-full flex-col space-y-4" disabled={form.formState.isSubmitting}>
+                  <FormField
+                    control={form.control}
+                    name="tokenName"
+                    render={({ field }) => (
+                      <FormItem>
+                        <FormLabel required>
+                          <Trans>Name</Trans>
+                        </FormLabel>
+
+                        <FormControl>
+                          <Input className="bg-background" {...field} />
+                        </FormControl>
+
+                        <FormDescription>
+                          <Trans>A name to help you identify this token later.</Trans>
+                        </FormDescription>
+
+                        <FormMessage />
+                      </FormItem>
+                    )}
+                  />
+
+                  <FormField
+                    control={form.control}
+                    name="expirationDate"
+                    render={({ field }) => (
+                      <FormItem>
+                        <FormLabel>
+                          <Trans>Expires in</Trans>
+                        </FormLabel>
+
+                        <FormControl>
+                          <Select value={field.value ?? NEVER_EXPIRE} onValueChange={field.onChange}>
+                            <SelectTrigger className="bg-background">
+                              <SelectValue />
+                            </SelectTrigger>
+
+                            <SelectContent>
+                              {Object.entries(EXPIRATION_DATES).map(([key, date]) => (
+                                <SelectItem key={key} value={key}>
+                                  {_(date)}
+                                </SelectItem>
+                              ))}
+                            </SelectContent>
+                          </Select>
+                        </FormControl>
+
+                        <FormMessage />
+                      </FormItem>
+                    )}
+                  />
+
+                  <DialogFooter>
+                    <Button type="button" variant="secondary" onClick={() => setOpen(false)}>
+                      <Trans>Cancel</Trans>
+                    </Button>
+
+                    <Button type="submit" loading={form.formState.isSubmitting}>
+                      <Trans>Create token</Trans>
+                    </Button>
+                  </DialogFooter>
+                </fieldset>
+              </form>
+            </Form>
+          </>
+        )}
+      </DialogContent>
+    </Dialog>
+  );
+};
@@ -105,7 +105,7 @@ export default function TokenDeleteDialog({ token, onDelete, children }: TokenDe
      <DialogContent>
        <DialogHeader>
          <DialogTitle>
-            <Trans>Are you sure you want to delete this token?</Trans>
+            <Trans>Delete token</Trans>
          </DialogTitle>

          <DialogDescription>
@@ -126,7 +126,7 @@ export default function TokenDeleteDialog({ token, onDelete, children }: TokenDe
                    <FormLabel>
                      <Trans>
                        Confirm by typing:{' '}
-                        <span className="font-semibold font-sm text-destructive">{deleteMessage}</span>
+                        <span className="font-semibold text-destructive text-sm">{deleteMessage}</span>
                      </Trans>
                    </FormLabel>

@@ -139,21 +139,18 @@ export default function TokenDeleteDialog({ token, onDelete, children }: TokenDe
              />

              <DialogFooter>
-                <div className="flex w-full flex-nowrap gap-4">
-                  <Button type="button" variant="secondary" className="flex-1" onClick={() => setIsOpen(false)}>
-                    <Trans>Cancel</Trans>
-                  </Button>
+                <Button type="button" variant="secondary" onClick={() => setIsOpen(false)}>
+                  <Trans>Cancel</Trans>
+                </Button>

-                  <Button
-                    type="submit"
-                    variant="destructive"
-                    className="flex-1"
-                    disabled={!form.formState.isValid}
-                    loading={form.formState.isSubmitting}
-                  >
-                    <Trans>I'm sure! Delete it</Trans>
-                  </Button>
-                </div>
+                <Button
+                  type="submit"
+                  variant="destructive"
+                  disabled={!form.formState.isValid}
+                  loading={form.formState.isSubmitting}
+                >
+                  <Trans>Delete</Trans>
+                </Button>
              </DialogFooter>
            </fieldset>
          </form>
@@ -117,7 +117,7 @@ export const WebhookDeleteDialog = ({ webhook, children }: WebhookDeleteDialogPr
                    <FormLabel>
                      <Trans>
                        Confirm by typing:{' '}
-                        <span className="font-semibold font-sm text-destructive">{deleteMessage}</span>
+                        <span className="font-semibold text-destructive text-sm">{deleteMessage}</span>
                      </Trans>
                    </FormLabel>
                    <FormControl>
@@ -503,7 +503,7 @@ export const ConfigureFieldsView = ({
            {selectedField && (
              <div
                className={cn(
-                  'pointer-events-none fixed z-50 flex cursor-pointer flex-col items-center justify-center bg-white text-muted-foreground transition duration-200 [container-type:size] dark:text-muted-background',
+                  'pointer-events-none fixed z-50 flex cursor-pointer flex-col items-center justify-center bg-white text-muted-foreground transition duration-200 [container-type:size] dark:text-muted',
                  selectedRecipientStyles.base,
                  {
                    '-rotate-6 scale-90 opacity-50 dark:bg-black/20': !isFieldWithinBounds,
@@ -470,6 +470,7 @@ export const EmbedDirectTemplateClientPage = ({
                      typedSignatureEnabled={metadata?.typedSignatureEnabled}
                      uploadSignatureEnabled={metadata?.uploadSignatureEnabled}
                      drawSignatureEnabled={metadata?.drawSignatureEnabled}
+                      qrSignatureEnabled={metadata?.qrSignatureEnabled}
                    />
                  </div>
                )}
@@ -33,7 +33,12 @@ export type EmbedDocumentFieldsProps = {
  fields: Field[];
  metadata?: Pick<
    DocumentMeta,
-    'timezone' | 'dateFormat' | 'typedSignatureEnabled' | 'uploadSignatureEnabled' | 'drawSignatureEnabled'
+    | 'timezone'
+    | 'dateFormat'
+    | 'typedSignatureEnabled'
+    | 'uploadSignatureEnabled'
+    | 'drawSignatureEnabled'
+    | 'qrSignatureEnabled'
  > | null;
  onSignField?: (value: TSignFieldWithTokenMutationSchema) => Promise<void> | void;
  onUnsignField?: (value: TRemovedSignedFieldWithTokenMutationSchema) => Promise<void> | void;
@@ -53,6 +58,7 @@ export const EmbedDocumentFields = ({ fields, metadata, onSignField, onUnsignFie
              typedSignatureEnabled={metadata?.typedSignatureEnabled}
              uploadSignatureEnabled={metadata?.uploadSignatureEnabled}
              drawSignatureEnabled={metadata?.drawSignatureEnabled}
+              qrSignatureEnabled={metadata?.qrSignatureEnabled}
            />
          ))
          .with(FieldType.INITIALS, () => (
@@ -461,6 +461,7 @@ export const EmbedSignDocumentV1ClientPage = ({
                            typedSignatureEnabled={metadata?.typedSignatureEnabled}
                            uploadSignatureEnabled={metadata?.uploadSignatureEnabled}
                            drawSignatureEnabled={metadata?.drawSignatureEnabled}
+                            qrSignatureEnabled={metadata?.qrSignatureEnabled}
                          />
                        </div>
                      )}
@@ -313,6 +313,7 @@ export const MultiSignDocumentSigningView = ({
                                    typedSignatureEnabled={document.documentMeta?.typedSignatureEnabled}
                                    uploadSignatureEnabled={document.documentMeta?.uploadSignatureEnabled}
                                    drawSignatureEnabled={document.documentMeta?.drawSignatureEnabled}
+                                    qrSignatureEnabled={document.documentMeta?.qrSignatureEnabled}
                                  />
                                </div>
                              )}
@@ -7,6 +7,7 @@ import {
 } from '@documenso/lib/constants/branding';
 import { DEFAULT_BRAND_COLORS, DEFAULT_BRAND_RADIUS } from '@documenso/lib/constants/theme';
 import { ZCssVarsSchema } from '@documenso/lib/types/css-vars';
+import { normalizeBrandingColors } from '@documenso/lib/utils/normalize-branding-colors';
 import { cn } from '@documenso/ui/lib/utils';
 import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@documenso/ui/primitives/accordion';
 import { Button } from '@documenso/ui/primitives/button';
@@ -23,6 +24,7 @@ import { useEffect, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';

+import { BrandingPreferencesResetDialog } from '~/components/dialogs/branding-preferences-reset-dialog';
 import { useOptionalCurrentTeam } from '~/providers/team';
 import { useCspNonce } from '~/utils/nonce';

@@ -74,6 +76,7 @@ export function BrandingPreferencesForm({

  const [previewUrl, setPreviewUrl] = useState<string>('');
  const [hasLoadedPreview, setHasLoadedPreview] = useState(false);
+  const [colorPickerKey, setColorPickerKey] = useState(0);

  const parsedColors = ZCssVarsSchema.safeParse(settings.brandingColors);
  const initialColors = parsedColors.success ? parsedColors.data : {};
@@ -96,6 +99,42 @@ export function BrandingPreferencesForm({

  const isBrandingEnabled = form.watch('brandingEnabled');

+  const hasResetBrandingColors =
+    settings.brandingColors === null ||
+    settings.brandingColors === undefined ||
+    (parsedColors.success && normalizeBrandingColors(parsedColors.data) === null);
+
+  // Only show the reset action when the saved settings actually differ from the
+  // defaults, so it never renders as a pointless disabled button.
+  const isResetToDefaultsVisible =
+    settings.brandingEnabled !== (canInherit ? null : false) ||
+    !!settings.brandingLogo ||
+    !!settings.brandingUrl ||
+    !!settings.brandingCompanyDetails ||
+    !!settings.brandingCss ||
+    !hasResetBrandingColors;
+
+  const handleResetToDefaults = async () => {
+    const data: TBrandingPreferencesFormSchema = {
+      brandingEnabled: canInherit ? null : false,
+      brandingLogo: null,
+      brandingUrl: '',
+      brandingCompanyDetails: '',
+      brandingColors: {},
+      brandingCss: '',
+    };
+
+    await onFormSubmit(data);
+
+    if (previewUrl.startsWith('blob:')) {
+      URL.revokeObjectURL(previewUrl);
+    }
+
+    setPreviewUrl('');
+    setColorPickerKey((key) => key + 1);
+    form.reset(data);
+  };
+
  const getSavedLogoPreviewUrl = () => {
    if (!settings.brandingLogo) {
      return '';
@@ -397,6 +436,7 @@ export function BrandingPreferencesForm({
                        </FormDescription>
                        <FormControl>
                          <ColorPicker
+                            key={`background-${colorPickerKey}`}
                            nonce={nonce}
                            value={field.value ?? ''}
                            defaultValue={DEFAULT_BRAND_COLORS.background}
@@ -420,6 +460,7 @@ export function BrandingPreferencesForm({
                        </FormDescription>
                        <FormControl>
                          <ColorPicker
+                            key={`foreground-${colorPickerKey}`}
                            nonce={nonce}
                            value={field.value ?? ''}
                            defaultValue={DEFAULT_BRAND_COLORS.foreground}
@@ -443,6 +484,7 @@ export function BrandingPreferencesForm({
                        </FormDescription>
                        <FormControl>
                          <ColorPicker
+                            key={`primary-${colorPickerKey}`}
                            nonce={nonce}
                            value={field.value ?? ''}
                            defaultValue={DEFAULT_BRAND_COLORS.primary}
@@ -466,6 +508,7 @@ export function BrandingPreferencesForm({
                        </FormDescription>
                        <FormControl>
                          <ColorPicker
+                            key={`primary-foreground-${colorPickerKey}`}
                            nonce={nonce}
                            value={field.value ?? ''}
                            defaultValue={DEFAULT_BRAND_COLORS.primaryForeground}
@@ -489,6 +532,7 @@ export function BrandingPreferencesForm({
                        </FormDescription>
                        <FormControl>
                          <ColorPicker
+                            key={`border-${colorPickerKey}`}
                            nonce={nonce}
                            value={field.value ?? ''}
                            defaultValue={DEFAULT_BRAND_COLORS.border}
@@ -512,6 +556,7 @@ export function BrandingPreferencesForm({
                        </FormDescription>
                        <FormControl>
                          <ColorPicker
+                            key={`ring-${colorPickerKey}`}
                            nonce={nonce}
                            value={field.value ?? ''}
                            defaultValue={DEFAULT_BRAND_COLORS.ring}
@@ -593,6 +638,15 @@ export function BrandingPreferencesForm({
            isDirty={hasUnsavedChanges}
            isSubmitting={form.formState.isSubmitting}
            onReset={handleReset}
+            resetToDefaults={
+              isResetToDefaultsVisible ? (
+                <BrandingPreferencesResetDialog
+                  hasAdvancedBranding={hasAdvancedBranding}
+                  isSubmitting={form.formState.isSubmitting}
+                  onReset={handleResetToDefaults}
+                />
+              ) : undefined
+            }
          />
        </fieldset>
      </form>
@@ -11,10 +11,10 @@ import { isValidLanguageCode, SUPPORTED_LANGUAGE_CODES, SUPPORTED_LANGUAGES } fr
 import { TIME_ZONES } from '@documenso/lib/constants/time-zones';
 import type { TDefaultRecipients } from '@documenso/lib/types/default-recipients';
 import { ZDefaultRecipientsSchema } from '@documenso/lib/types/default-recipients';
-import { type TDocumentMetaDateFormat, ZDocumentMetaTimezoneSchema } from '@documenso/lib/types/document-meta';
-import { isPersonalLayout } from '@documenso/lib/utils/organisations';
+import { type TDocumentMetaDateFormat, ZDocumentMetaDateFormatSchema } from '@documenso/lib/types/document-meta';
+import { generateDefaultOrganisationSettings, isPersonalLayout } from '@documenso/lib/utils/organisations';
 import { recipientAbbreviation } from '@documenso/lib/utils/recipient-formatter';
-import { extractTeamSignatureSettings } from '@documenso/lib/utils/teams';
+import { extractTeamSignatureSettings, generateDefaultTeamSettings } from '@documenso/lib/utils/teams';
 import { DocumentSignatureSettingsTooltip } from '@documenso/ui/components/document/document-signature-settings-tooltip';
 import { ExpirationPeriodPicker } from '@documenso/ui/components/document/expiration-period-picker';
 import { ReminderSettingsPicker } from '@documenso/ui/components/document/reminder-settings-picker';
@@ -37,11 +37,11 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { msg, t } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import type { TeamGlobalSettings } from '@prisma/client';
-import { DocumentVisibility, OrganisationType, type RecipientRole } from '@prisma/client';
+import { DocumentVisibility, OrganisationType, type RecipientRole, type TeamGlobalSettings } from '@prisma/client';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';

+import { DocumentPreferencesResetDialog } from '~/components/dialogs/document-preferences-reset-dialog';
 import { useOptionalCurrentTeam } from '~/providers/team';

 import { DefaultRecipientsMultiSelectCombobox } from '../general/default-recipients-multiselect-combobox';
@@ -79,6 +79,7 @@ type SettingsSubset = Pick<
  | 'typedSignatureEnabled'
  | 'uploadSignatureEnabled'
  | 'drawSignatureEnabled'
+  | 'qrSignatureEnabled'
  | 'defaultRecipients'
  | 'delegateDocumentOwnership'
  | 'aiFeaturesEnabled'
@@ -93,6 +94,26 @@ export type DocumentPreferencesFormProps = {
  onFormSubmit: (data: TDocumentPreferencesFormSchema) => Promise<void>;
 };

+const getDocumentPreferencesFormValues = (settings: SettingsSubset): TDocumentPreferencesFormSchema => {
+  const parsedDocumentDateFormat = ZDocumentMetaDateFormatSchema.safeParse(settings.documentDateFormat);
+
+  return {
+    documentVisibility: settings.documentVisibility,
+    documentLanguage: isValidLanguageCode(settings.documentLanguage) ? settings.documentLanguage : null,
+    documentTimezone: settings.documentTimezone,
+    documentDateFormat: parsedDocumentDateFormat.success ? parsedDocumentDateFormat.data : null,
+    includeSenderDetails: settings.includeSenderDetails,
+    includeSigningCertificate: settings.includeSigningCertificate,
+    includeAuditLog: settings.includeAuditLog,
+    signatureTypes: extractTeamSignatureSettings({ ...settings }),
+    defaultRecipients: settings.defaultRecipients ? ZDefaultRecipientsSchema.parse(settings.defaultRecipients) : null,
+    delegateDocumentOwnership: settings.delegateDocumentOwnership,
+    aiFeaturesEnabled: settings.aiFeaturesEnabled,
+    envelopeExpirationPeriod: settings.envelopeExpirationPeriod ?? null,
+    reminderSettings: settings.reminderSettings ?? null,
+  };
+};
+
 export const DocumentPreferencesForm = ({
  settings,
  onFormSubmit,
@@ -113,7 +134,7 @@ export const DocumentPreferencesForm = ({
    documentVisibility: z.nativeEnum(DocumentVisibility).nullable(),
    documentLanguage: z.enum(SUPPORTED_LANGUAGE_CODES).nullable(),
    documentTimezone: z.string().nullable(),
-    documentDateFormat: ZDocumentMetaTimezoneSchema.nullable(),
+    documentDateFormat: ZDocumentMetaDateFormatSchema.nullable(),
    includeSenderDetails: z.boolean().nullable(),
    includeSigningCertificate: z.boolean().nullable(),
    includeAuditLog: z.boolean().nullable(),
@@ -127,26 +148,33 @@ export const DocumentPreferencesForm = ({
    reminderSettings: ZEnvelopeReminderSettings.nullable(),
  });

+  const defaultValues = getDocumentPreferencesFormValues(settings);
+  const defaultSettings = canInherit ? generateDefaultTeamSettings() : generateDefaultOrganisationSettings();
+  const baseResetValues = getDocumentPreferencesFormValues(defaultSettings);
+  const resetValues = {
+    ...baseResetValues,
+    aiFeaturesEnabled: isAiFeaturesConfigured ? baseResetValues.aiFeaturesEnabled : defaultValues.aiFeaturesEnabled,
+  };
+
  const form = useForm<TDocumentPreferencesFormSchema>({
-    defaultValues: {
-      documentVisibility: settings.documentVisibility,
-      documentLanguage: isValidLanguageCode(settings.documentLanguage) ? settings.documentLanguage : null,
-      documentTimezone: settings.documentTimezone,
-      // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-      documentDateFormat: settings.documentDateFormat as TDocumentMetaDateFormat | null,
-      includeSenderDetails: settings.includeSenderDetails,
-      includeSigningCertificate: settings.includeSigningCertificate,
-      includeAuditLog: settings.includeAuditLog,
-      signatureTypes: extractTeamSignatureSettings({ ...settings }),
-      defaultRecipients: settings.defaultRecipients ? ZDefaultRecipientsSchema.parse(settings.defaultRecipients) : null,
-      delegateDocumentOwnership: settings.delegateDocumentOwnership,
-      aiFeaturesEnabled: settings.aiFeaturesEnabled,
-      envelopeExpirationPeriod: settings.envelopeExpirationPeriod ?? null,
-      reminderSettings: settings.reminderSettings ?? null,
-    },
+    defaultValues,
    resolver: zodResolver(ZDocumentPreferencesFormSchema),
  });

+  // Parse both sides through the schema so we compare canonical representations
+  const parsedCurrentValues = ZDocumentPreferencesFormSchema.safeParse(defaultValues);
+  const parsedResetValues = ZDocumentPreferencesFormSchema.safeParse(resetValues);
+
+  const isResetToDefaultsVisible =
+    !parsedCurrentValues.success ||
+    !parsedResetValues.success ||
+    JSON.stringify(parsedCurrentValues.data) !== JSON.stringify(parsedResetValues.data);
+
+  const handleResetToDefaults = async () => {
+    await onFormSubmit(resetValues);
+    form.reset(resetValues);
+  };
+
  const handleFormSubmit = form.handleSubmit(async (data) => {
    try {
      await onFormSubmit(data);
@@ -772,6 +800,17 @@ export const DocumentPreferencesForm = ({
            isDirty={form.formState.isDirty}
            isSubmitting={form.formState.isSubmitting}
            onReset={() => form.reset()}
+            resetToDefaults={
+              isResetToDefaultsVisible ? (
+                <DocumentPreferencesResetDialog
+                  isSubmitting={form.formState.isSubmitting}
+                  onReset={handleResetToDefaults}
+                  showAiFeatures={isAiFeaturesConfigured}
+                  showDocumentVisibility={!isPersonalLayoutMode}
+                  showIncludeSenderDetails={!isPersonalLayoutMode && !isPersonalOrganisation}
+                />
+              ) : undefined
+            }
          />
        </fieldset>
      </form>
@@ -3,12 +3,17 @@ import { Button } from '@documenso/ui/primitives/button';
 import { Trans, useLingui } from '@lingui/react/macro';
 import { AnimatePresence, motion } from 'framer-motion';
 import { AlertTriangleIcon } from 'lucide-react';
-import { useEffect, useRef, useState } from 'react';
+import { type ReactNode, useEffect, useRef, useState } from 'react';

 export type FormStickySaveBarProps = {
  isDirty: boolean;
  isSubmitting: boolean;
  onReset: () => void;
+  /**
+   * Slot for a "reset to defaults" action, rendered before the Undo button. Hidden while
+   * the bar is floating so it never appears in the unsaved-changes island.
+   */
+  resetToDefaults?: ReactNode;
 };

 /**
@@ -24,7 +29,7 @@ export type FormStickySaveBarProps = {
 * shared-layout morph). A 1px sentinel below it detects the stuck state so we can toggle
 * the pill chrome.
 */
-export const FormStickySaveBar = ({ isDirty, isSubmitting, onReset }: FormStickySaveBarProps) => {
+export const FormStickySaveBar = ({ isDirty, isSubmitting, onReset, resetToDefaults }: FormStickySaveBarProps) => {
  const { t } = useLingui();

  const sentinelRef = useRef<HTMLDivElement>(null);
@@ -100,6 +105,8 @@ export const FormStickySaveBar = ({ isDirty, isSubmitting, onReset }: FormSticky
        </AnimatePresence>

        <div className="ml-auto flex flex-shrink-0 items-center gap-x-2">
+          {!isFloating && resetToDefaults}
+
          {isDirty && (
            <Button type="button" variant="secondary" size="sm" onClick={onReset} disabled={isSubmitting}>
              <Trans>Undo</Trans>
@@ -96,7 +96,7 @@ export const SignUpForm = ({
      password: '',
      signature: '',
    },
-    mode: 'onBlur',
+    mode: 'onChange',
    resolver: zodResolver(ZSignUpFormSchema),
  });

@@ -1,254 +0,0 @@
-import { useCopyToClipboard } from '@documenso/lib/client-only/hooks/use-copy-to-clipboard';
-import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
-import { trpc } from '@documenso/trpc/react';
-import { ZCreateApiTokenRequestSchema } from '@documenso/trpc/server/api-token-router/create-api-token.types';
-import { cn } from '@documenso/ui/lib/utils';
-import { Button } from '@documenso/ui/primitives/button';
-import { Card, CardContent } from '@documenso/ui/primitives/card';
-import {
-  Form,
-  FormControl,
-  FormDescription,
-  FormField,
-  FormItem,
-  FormLabel,
-  FormMessage,
-} from '@documenso/ui/primitives/form/form';
-import { Input } from '@documenso/ui/primitives/input';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@documenso/ui/primitives/select';
-import { Switch } from '@documenso/ui/primitives/switch';
-import { useToast } from '@documenso/ui/primitives/use-toast';
-import { zodResolver } from '@hookform/resolvers/zod';
-import { msg } from '@lingui/core/macro';
-import { useLingui } from '@lingui/react';
-import { Trans } from '@lingui/react/macro';
-import type { ApiToken } from '@prisma/client';
-import { AnimatePresence, motion } from 'framer-motion';
-import { useState } from 'react';
-import { useForm } from 'react-hook-form';
-import { match } from 'ts-pattern';
-import type { z } from 'zod';
-
-import { useCurrentTeam } from '~/providers/team';
-
-export const EXPIRATION_DATES = {
-  ONE_WEEK: msg`7 days`,
-  ONE_MONTH: msg`1 month`,
-  THREE_MONTHS: msg`3 months`,
-  SIX_MONTHS: msg`6 months`,
-  ONE_YEAR: msg`12 months`,
-} as const;
-
-const ZCreateTokenFormSchema = ZCreateApiTokenRequestSchema.pick({
-  tokenName: true,
-  expirationDate: true,
-});
-
-type TCreateTokenFormSchema = z.infer<typeof ZCreateTokenFormSchema>;
-
-type NewlyCreatedToken = {
-  id: number;
-  token: string;
-};
-
-export type ApiTokenFormProps = {
-  className?: string;
-  tokens?: Pick<ApiToken, 'id'>[];
-};
-
-export const ApiTokenForm = ({ className, tokens }: ApiTokenFormProps) => {
-  const [, copy] = useCopyToClipboard();
-
-  const team = useCurrentTeam();
-
-  const { _ } = useLingui();
-  const { toast } = useToast();
-
-  const [newlyCreatedToken, setNewlyCreatedToken] = useState<NewlyCreatedToken | null>();
-  const [noExpirationDate, setNoExpirationDate] = useState(false);
-
-  const { mutateAsync: createTokenMutation } = trpc.apiToken.create.useMutation({
-    onSuccess(data) {
-      setNewlyCreatedToken(data);
-    },
-  });
-
-  const form = useForm<TCreateTokenFormSchema>({
-    resolver: zodResolver(ZCreateTokenFormSchema),
-    defaultValues: {
-      tokenName: '',
-      expirationDate: '',
-    },
-  });
-
-  const copyToken = async (token: string) => {
-    try {
-      const copied = await copy(token);
-
-      if (!copied) {
-        throw new Error('Unable to copy the token');
-      }
-
-      toast({
-        title: _(msg`Token copied to clipboard`),
-        description: _(msg`The token was copied to your clipboard.`),
-      });
-    } catch (error) {
-      toast({
-        title: _(msg`Unable to copy token`),
-        description: _(msg`We were unable to copy the token to your clipboard. Please try again.`),
-        variant: 'destructive',
-      });
-    }
-  };
-
-  const onSubmit = async ({ tokenName, expirationDate }: TCreateTokenFormSchema) => {
-    try {
-      await createTokenMutation({
-        teamId: team.id,
-        tokenName,
-        expirationDate: noExpirationDate ? null : expirationDate,
-      });
-
-      toast({
-        title: _(msg`Token created`),
-        description: _(msg`A new token was created successfully.`),
-        duration: 5000,
-      });
-
-      form.reset();
-    } catch (err) {
-      const error = AppError.parseError(err);
-
-      const errorMessage = match(error.code)
-        .with(AppErrorCode.UNAUTHORIZED, () => msg`You do not have permission to create a token for this team.`)
-        .otherwise(() => msg`Something went wrong. Please try again later.`);
-
-      toast({
-        title: _(msg`An error occurred`),
-        description: _(errorMessage),
-        variant: 'destructive',
-        duration: 5000,
-      });
-    }
-  };
-
-  return (
-    <div className={cn(className)}>
-      <Form {...form}>
-        <form onSubmit={form.handleSubmit(onSubmit)}>
-          <fieldset className="mt-6 flex w-full flex-col gap-4" disabled={form.formState.isSubmitting}>
-            <FormField
-              control={form.control}
-              name="tokenName"
-              render={({ field }) => (
-                <FormItem className="flex-1">
-                  <FormLabel className="text-muted-foreground">
-                    <Trans>Token name</Trans>
-                  </FormLabel>
-
-                  <div className="flex items-center gap-x-4">
-                    <FormControl className="flex-1">
-                      <Input type="text" {...field} />
-                    </FormControl>
-                  </div>
-
-                  <FormDescription className="text-xs italic">
-                    <Trans>Please enter a meaningful name for your token. This will help you identify it later.</Trans>
-                  </FormDescription>
-
-                  <FormMessage />
-                </FormItem>
-              )}
-            />
-
-            <div className="flex flex-col gap-4 md:flex-row">
-              <FormField
-                control={form.control}
-                name="expirationDate"
-                render={({ field }) => (
-                  <FormItem className="flex-1">
-                    <FormLabel className="text-muted-foreground">
-                      <Trans>Token expiration date</Trans>
-                    </FormLabel>
-
-                    <div className="flex items-center gap-x-4">
-                      <FormControl className="flex-1">
-                        <Select onValueChange={field.onChange} disabled={noExpirationDate}>
-                          <SelectTrigger className="w-full">
-                            <SelectValue placeholder={_(msg`Choose...`)} />
-                          </SelectTrigger>
-                          <SelectContent>
-                            {Object.entries(EXPIRATION_DATES).map(([key, date]) => (
-                              <SelectItem key={key} value={key}>
-                                {_(date)}
-                              </SelectItem>
-                            ))}
-                          </SelectContent>
-                        </Select>
-                      </FormControl>
-                    </div>
-
-                    <FormMessage />
-                  </FormItem>
-                )}
-              />
-
-              <div>
-                <FormLabel className="mt-2 text-muted-foreground">
-                  <Trans>Never expire</Trans>
-                </FormLabel>
-                <div className="block md:py-1.5">
-                  <Switch
-                    className="mt-2 bg-background"
-                    checked={noExpirationDate}
-                    onCheckedChange={setNoExpirationDate}
-                  />
-                </div>
-              </div>
-            </div>
-
-            <Button type="submit" className="hidden md:inline-flex" loading={form.formState.isSubmitting}>
-              <Trans>Create token</Trans>
-            </Button>
-
-            <div className="md:hidden">
-              <Button type="submit" loading={form.formState.isSubmitting}>
-                <Trans>Create token</Trans>
-              </Button>
-            </div>
-          </fieldset>
-        </form>
-      </Form>
-
-      <AnimatePresence>
-        {newlyCreatedToken && tokens && tokens.find((token) => token.id === newlyCreatedToken.id) && (
-          <motion.div
-            className="mt-8"
-            initial={{ opacity: 0, y: -40 }}
-            animate={{ opacity: 1, y: 0 }}
-            exit={{ opacity: 0, y: 40 }}
-          >
-            <Card gradient>
-              <CardContent className="p-4">
-                <p className="mt-2 text-muted-foreground text-sm">
-                  <Trans>
-                    Your token was created successfully! Make sure to copy it because you won't be able to see it again!
-                  </Trans>
-                </p>
-
-                <p className="my-4 rounded-md bg-muted-foreground/10 px-2.5 py-1 font-mono text-sm">
-                  {newlyCreatedToken.token}
-                </p>
-
-                <Button variant="outline" onClick={() => void copyToken(newlyCreatedToken.token)}>
-                  <Trans>Copy token</Trans>
-                </Button>
-              </CardContent>
-            </Card>
-          </motion.div>
-        )}
-      </AnimatePresence>
-    </div>
-  );
-};
@@ -156,6 +156,10 @@ export const AdminGlobalSettingsSection = ({
        </DetailsValue>
      </DetailsCard>

+      <DetailsCard label={<Trans>QR signature</Trans>}>
+        <DetailsValue>{booleanValue(settings.qrSignatureEnabled, inheritedSettings?.qrSignatureEnabled)}</DetailsValue>
+      </DetailsCard>
+
      <DetailsCard label={<Trans>Branding</Trans>}>
        <DetailsValue>{booleanValue(settings.brandingEnabled, inheritedSettings?.brandingEnabled)}</DetailsValue>
      </DetailsCard>
@@ -87,7 +87,7 @@ export const AdminLicenseCard = ({ licenseData }: AdminLicenseCardProps) => {
          <KeyRoundIcon className="h-4 w-4 text-muted-foreground" />
        </div>

-        <h3 className="mb-2 flex items-end font-medium text-primary-forground text-sm leading-tight">
+        <h3 className="mb-2 flex items-end font-medium text-foreground text-sm leading-tight">
          <Trans>Documenso License</Trans>
        </h3>

@@ -0,0 +1,23 @@
+import { Trans } from '@lingui/react/macro';
+import { AlertTriangleIcon } from 'lucide-react';
+
+export const DirectTemplateInvalidPageView = () => {
+  return (
+    <div className="mx-auto flex h-[70vh] w-full max-w-md flex-col items-center justify-center">
+      <div>
+        <AlertTriangleIcon className="h-10 w-10 text-destructive" />
+
+        <h1 className="mt-4 font-semibold text-3xl">
+          <Trans>Invalid direct link template</Trans>
+        </h1>
+
+        <p className="mt-2 text-muted-foreground text-sm">
+          <Trans>
+            This direct link template cannot be used because one or more signers do not have a signature field assigned.
+            Please contact the sender to update the template.
+          </Trans>
+        </p>
+      </div>
+    </div>
+  );
+};
@@ -269,6 +269,7 @@ export const DirectTemplateSigningForm = ({
                  typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
                  uploadSignatureEnabled={template.templateMeta?.uploadSignatureEnabled}
                  drawSignatureEnabled={template.templateMeta?.drawSignatureEnabled}
+                  qrSignatureEnabled={template.templateMeta?.qrSignatureEnabled}
                />
              ))
              .with(FieldType.INITIALS, () => (
@@ -408,6 +409,7 @@ export const DirectTemplateSigningForm = ({
                typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
                uploadSignatureEnabled={template.templateMeta?.uploadSignatureEnabled}
                drawSignatureEnabled={template.templateMeta?.drawSignatureEnabled}
+                qrSignatureEnabled={template.templateMeta?.qrSignatureEnabled}
              />
            </div>
          </div>
@@ -254,6 +254,7 @@ export const DocumentSigningForm = ({
                        typedSignatureEnabled={document.documentMeta?.typedSignatureEnabled}
                        uploadSignatureEnabled={document.documentMeta?.uploadSignatureEnabled}
                        drawSignatureEnabled={document.documentMeta?.drawSignatureEnabled}
+                        qrSignatureEnabled={document.documentMeta?.qrSignatureEnabled}
                      />
                    </div>
                  )}
@@ -408,6 +408,7 @@ export const DocumentSigningPageViewV1 = ({
                    typedSignatureEnabled={documentMeta?.typedSignatureEnabled}
                    uploadSignatureEnabled={documentMeta?.uploadSignatureEnabled}
                    drawSignatureEnabled={documentMeta?.drawSignatureEnabled}
+                    qrSignatureEnabled={documentMeta?.qrSignatureEnabled}
                  />
                ))
                .with(FieldType.INITIALS, () => <DocumentSigningInitialsField key={field.id} field={field} />)
@@ -33,6 +33,7 @@ export interface DocumentSigningProviderProps {
  typedSignatureEnabled?: boolean;
  uploadSignatureEnabled?: boolean;
  drawSignatureEnabled?: boolean;
+  qrSignatureEnabled?: boolean;
  children: React.ReactNode;
 }

@@ -43,6 +44,7 @@ export const DocumentSigningProvider = ({
  typedSignatureEnabled = true,
  uploadSignatureEnabled = true,
  drawSignatureEnabled = true,
+  qrSignatureEnabled = true,
  children,
 }: DocumentSigningProviderProps) => {
  const [fullName, setFullName] = useState(initialFullName || '');
@@ -54,7 +56,7 @@ export const DocumentSigningProvider = ({
      const sig = initialSignature || '';
      const isBase64 = isBase64Image(sig);

-      if (isBase64 && (uploadSignatureEnabled || drawSignatureEnabled)) {
+      if (isBase64 && (uploadSignatureEnabled || drawSignatureEnabled || qrSignatureEnabled)) {
        return sig;
      }

@@ -34,6 +34,7 @@ export type DocumentSigningSignatureFieldProps = {
  typedSignatureEnabled?: boolean;
  uploadSignatureEnabled?: boolean;
  drawSignatureEnabled?: boolean;
+  qrSignatureEnabled?: boolean;
 };

 export const DocumentSigningSignatureField = ({
@@ -43,6 +44,7 @@ export const DocumentSigningSignatureField = ({
  typedSignatureEnabled,
  uploadSignatureEnabled,
  drawSignatureEnabled,
+  qrSignatureEnabled,
 }: DocumentSigningSignatureFieldProps) => {
  const { _ } = useLingui();
  const { toast } = useToast();
@@ -279,6 +281,7 @@ export const DocumentSigningSignatureField = ({
            typedSignatureEnabled={typedSignatureEnabled}
            uploadSignatureEnabled={uploadSignatureEnabled}
            drawSignatureEnabled={drawSignatureEnabled}
+            qrSignatureEnabled={qrSignatureEnabled}
          />

          <DocumentSigningDisclosure />
@@ -172,7 +172,9 @@ export const EnvelopeSigningProvider = ({

      if (
        !sig &&
-        (envelope.documentMeta.uploadSignatureEnabled || envelope.documentMeta.drawSignatureEnabled) &&
+        (envelope.documentMeta.uploadSignatureEnabled ||
+          envelope.documentMeta.drawSignatureEnabled ||
+          envelope.documentMeta.qrSignatureEnabled) &&
        envelopeData.recipientSignature?.signatureImageAsBase64
      ) {
        return envelopeData.recipientSignature.signatureImageAsBase64;
@@ -182,7 +184,12 @@ export const EnvelopeSigningProvider = ({
        return envelopeData.recipientSignature.typedSignature;
      }

-      if (isBase64 && (envelope.documentMeta.uploadSignatureEnabled || envelope.documentMeta.drawSignatureEnabled)) {
+      if (
+        isBase64 &&
+        (envelope.documentMeta.uploadSignatureEnabled ||
+          envelope.documentMeta.drawSignatureEnabled ||
+          envelope.documentMeta.qrSignatureEnabled)
+      ) {
        return sig;
      }

@@ -174,6 +174,7 @@ export const DocumentEditForm = ({ className, initialDocument, documentRootPath
        typedSignatureEnabled: signatureTypes.includes(DocumentSignatureType.TYPE),
        uploadSignatureEnabled: signatureTypes.includes(DocumentSignatureType.UPLOAD),
        drawSignatureEnabled: signatureTypes.includes(DocumentSignatureType.DRAW),
+        qrSignatureEnabled: signatureTypes.includes(DocumentSignatureType.QR),
      },
    });
  };
@@ -270,7 +270,7 @@ export const EnvelopeEditorFieldDragDrop = ({
      {selectedField && (
        <div
          className={cn(
-            'pointer-events-none fixed z-50 flex cursor-pointer flex-col items-center justify-center rounded-[2px] bg-white font-noto text-muted-foreground ring-2 transition duration-200 [container-type:size] dark:text-muted-background',
+            'pointer-events-none fixed z-50 flex cursor-pointer flex-col items-center justify-center rounded-[2px] bg-white font-noto text-muted-foreground ring-2 transition duration-200 [container-type:size] dark:text-muted',
            selectedRecipientStyles.base,
            selectedField === FieldType.SIGNATURE && 'font-signature',
            {
@@ -54,6 +54,7 @@ import { useCurrentTeam } from '~/providers/team';

 import { EnvelopeEditorFieldDragDrop } from './envelope-editor-fields-drag-drop';
 import { EnvelopeEditorFieldsPageRenderer } from './envelope-editor-fields-page-renderer';
+import { EnvelopeEditorInvalidDirectTemplateAlert } from './envelope-editor-invalid-direct-template-alert';
 import { EnvelopeRendererFileSelector } from './envelope-file-selector';
 import { EnvelopeRecipientSelector } from './envelope-recipient-selector';

@@ -238,6 +239,8 @@ export const EnvelopeEditorFieldsPage = () => {
          }
        />

+        <EnvelopeEditorInvalidDirectTemplateAlert />
+
        {/* Document View */}
        <div className="mt-4 flex h-full flex-col items-center justify-center">
          {envelope.recipients.length === 0 && (
@@ -0,0 +1,55 @@
+import { useCurrentEnvelopeEditor } from '@documenso/lib/client-only/providers/envelope-editor-provider';
+import { getRecipientsWithMissingFields } from '@documenso/lib/utils/recipients';
+import { cn } from '@documenso/ui/lib/utils';
+import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
+import { Trans } from '@lingui/react/macro';
+import { useMemo } from 'react';
+
+export type EnvelopeEditorInvalidDirectTemplateAlertProps = {
+  className?: string;
+};
+
+/**
+ * Warns that a direct link template cannot be used because one or more signers
+ * are missing a signature field.
+ */
+export const EnvelopeEditorInvalidDirectTemplateAlert = ({
+  className,
+}: EnvelopeEditorInvalidDirectTemplateAlertProps) => {
+  const { envelope, isTemplate } = useCurrentEnvelopeEditor();
+
+  const signersMissingSignatureFields = useMemo(() => {
+    if (!isTemplate || !envelope.directLink?.enabled) {
+      return [];
+    }
+
+    return getRecipientsWithMissingFields(envelope.recipients, envelope.fields);
+  }, [isTemplate, envelope.directLink, envelope.recipients, envelope.fields]);
+
+  if (signersMissingSignatureFields.length === 0) {
+    return null;
+  }
+
+  return (
+    <Alert
+      variant="destructive"
+      className={cn('mx-auto w-full max-w-[800px] flex-row items-start gap-3 rounded-sm', className)}
+    >
+      <AlertTitle>
+        <Trans>Invalid direct link template</Trans>
+      </AlertTitle>
+
+      <AlertDescription>
+        <Trans>
+          Recipients cannot use this direct link template because the following signers are missing a signature field
+        </Trans>
+
+        <ul className="list-disc pl-5">
+          {signersMissingSignatureFields.map((recipient, i) => (
+            <li key={recipient.id}>{recipient.email || recipient.name || `Recipient ${i + 1}`}</li>
+          ))}
+        </ul>
+      </AlertDescription>
+    </Alert>
+  );
+};
@@ -22,6 +22,7 @@ import { match } from 'ts-pattern';
 import { EnvelopeGenericPageRenderer } from '~/components/general/envelope-editor/envelope-generic-page-renderer';
 import { EnvelopePdfViewer } from '~/components/general/pdf-viewer/envelope-pdf-viewer';

+import { EnvelopeEditorInvalidDirectTemplateAlert } from './envelope-editor-invalid-direct-template-alert';
 import { EnvelopeRendererFileSelector } from './envelope-file-selector';

 export const EnvelopeEditorPreviewPage = () => {
@@ -228,6 +229,8 @@ export const EnvelopeEditorPreviewPage = () => {
          {/* Horizontal envelope item selector */}
          <EnvelopeRendererFileSelector className="px-0" fields={editorFields.localFields} />

+          <EnvelopeEditorInvalidDirectTemplateAlert className="mb-4" />
+
          <Alert variant="warning" className="mx-auto max-w-[800px]">
            <AlertTitle>
              <Trans>Preview Mode</Trans>
@@ -278,6 +278,7 @@ export const EnvelopeEditorSettingsDialog = ({ trigger, ...props }: EnvelopeEdit
          drawSignatureEnabled: signatureTypes.includes(DocumentSignatureType.DRAW),
          typedSignatureEnabled: signatureTypes.includes(DocumentSignatureType.TYPE),
          uploadSignatureEnabled: signatureTypes.includes(DocumentSignatureType.UPLOAD),
+          qrSignatureEnabled: signatureTypes.includes(DocumentSignatureType.QR),
          envelopeExpirationPeriod,
          reminderSettings,
        },
@@ -26,6 +26,7 @@ import { ErrorCode as DropzoneErrorCode, type FileRejection, useDropzone } from

 import { EnvelopeItemDeleteDialog } from '~/components/dialogs/envelope-item-delete-dialog';

+import { EnvelopeEditorInvalidDirectTemplateAlert } from './envelope-editor-invalid-direct-template-alert';
 import { EnvelopeEditorRecipientForm } from './envelope-editor-recipient-form';
 import { EnvelopeItemTitleInput } from './envelope-editor-title-input';

@@ -449,6 +450,9 @@ export const EnvelopeEditorUploadPage = () => {
  return (
    <div className="mx-auto max-w-4xl space-y-6 p-8">
      <input {...getReplaceInputProps()} />
+
+      <EnvelopeEditorInvalidDirectTemplateAlert className="max-w-none" />
+
      <Card backdropBlur={false} className="border">
        <CardHeader className="pb-3">
          <CardTitle>
@@ -121,6 +121,7 @@ export default function EnvelopeSignerForm() {
              typedSignatureEnabled={envelope.documentMeta.typedSignatureEnabled}
              uploadSignatureEnabled={envelope.documentMeta.uploadSignatureEnabled}
              drawSignatureEnabled={envelope.documentMeta.drawSignatureEnabled}
+              qrSignatureEnabled={envelope.documentMeta.qrSignatureEnabled}
            />
          </div>
        )}
@@ -384,6 +384,7 @@ export const EnvelopeSignerPageRenderer = ({ pageData }: { pageData: PageRenderD
            typedSignatureEnabled: envelope.documentMeta.typedSignatureEnabled,
            uploadSignatureEnabled: envelope.documentMeta.uploadSignatureEnabled,
            drawSignatureEnabled: envelope.documentMeta.drawSignatureEnabled,
+            qrSignatureEnabled: envelope.documentMeta.qrSignatureEnabled,
          })
            .then(async (payload) => {
              if (!payload) {
@@ -174,7 +174,7 @@ export const EnvelopeDropZoneWrapper = ({ children, type, className }: EnvelopeD
              {type === EnvelopeType.DOCUMENT ? <Trans>Upload Document</Trans> : <Trans>Upload Template</Trans>}
            </h2>

-            <p className="mt-4 text-md text-muted-foreground">
+            <p className="mt-4 text-base text-muted-foreground">
              <Trans>Drag and drop your document here</Trans>
            </p>

@@ -137,6 +137,7 @@ export const TemplateEditForm = ({ initialTemplate, className, templateRootPath
        typedSignatureEnabled: signatureTypes.includes(DocumentSignatureType.TYPE),
        uploadSignatureEnabled: signatureTypes.includes(DocumentSignatureType.UPLOAD),
        drawSignatureEnabled: signatureTypes.includes(DocumentSignatureType.DRAW),
+        qrSignatureEnabled: signatureTypes.includes(DocumentSignatureType.QR),
        language: isValidLanguageCode(data.meta.language) ? data.meta.language : undefined,
      },
    });
@@ -3,27 +3,32 @@ import { dynamicActivate } from '@documenso/lib/utils/i18n';
 import { i18n } from '@lingui/core';
 import { detect, fromHtmlTag } from '@lingui/detect-locale';
 import { I18nProvider } from '@lingui/react';
-import { StrictMode, startTransition, useEffect } from 'react';
+import { StrictMode, startTransition } from 'react';
 import { hydrateRoot } from 'react-dom/client';
 import { HydratedRouter } from 'react-router/dom';

 import './utils/polyfills/promise-with-resolvers';

-function PosthogInit() {
+/**
+ * Initialised imperatively (not as a component inside `hydrateRoot`) because
+ * rendering extra client-only siblings changes the React tree structure
+ * relative to the server render in `entry.server.tsx`. That shifts every
+ * `useId` value (used by Radix for `id`/`htmlFor`/`aria-*`), causing hydration
+ * mismatches which can abort hydration entirely when the user interacts with
+ * the page early, leaving dead event handlers (broken dropdowns, native form
+ * submits).
+ */
+function initPosthog() {
  const postHogConfig = extractPostHogConfig();

-  useEffect(() => {
-    if (postHogConfig) {
-      void import('posthog-js').then(({ default: posthog }) => {
-        posthog.init(postHogConfig.key, {
-          api_host: postHogConfig.host,
-          capture_exceptions: true,
-        });
+  if (postHogConfig) {
+    void import('posthog-js').then(({ default: posthog }) => {
+      posthog.init(postHogConfig.key, {
+        api_host: postHogConfig.host,
+        capture_exceptions: true,
      });
-    }
-  }, []);
-
-  return null;
+    });
+  }
 }

 async function main() {
@@ -38,11 +43,11 @@ async function main() {
        <I18nProvider i18n={i18n}>
          <HydratedRouter />
        </I18nProvider>
-
-        <PosthogInit />
      </StrictMode>,
    );
  });
+
+  void initPosthog();
 }

 // eslint-disable-next-line @typescript-eslint/no-floating-promises
@@ -119,7 +119,11 @@ export function LayoutContent({ children }: { children: React.ReactNode }) {
  const isRecipientRoute = matches.some((m) => m.id?.startsWith('routes/_recipient+'));

  return (
-    <html translate="no" lang={lang} data-theme={theme} className={theme ?? ''}>
+    // `suppressHydrationWarning` because `remix-themes` intentionally mutates
+    // `data-theme`/`class` on <html> before hydration (PreventFlashOnWrongTheme),
+    // so the server-rendered attributes never match the client render when the
+    // theme is resolved from the system preference. Attribute-only, one level deep.
+    <html translate="no" lang={lang} data-theme={theme} className={theme ?? ''} suppressHydrationWarning>
      <head>
        <meta charSet="utf-8" />
        <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
@@ -173,7 +177,11 @@ export function LayoutContent({ children }: { children: React.ReactNode }) {
        <script
          nonce={nonce(cspNonce)}
          dangerouslySetInnerHTML={{
-            __html: `window.__ENV__ = ${JSON.stringify(publicEnv)}`,
+            // `__webpack_nonce__` is read by `get-nonce` (used by
+            // react-remove-scroll / react-style-singleton inside Radix menus and
+            // dialogs) to stamp runtime-injected <style> elements. Without it the
+            // strict `style-src-elem` CSP blocks the scroll-lock styles.
+            __html: `window.__ENV__ = ${JSON.stringify(publicEnv)}; window.__webpack_nonce__ = ${JSON.stringify(cspNonce ?? '')}`,
          }}
        />

@@ -88,7 +88,8 @@ export default function OrganisationSettingsDocumentPage() {
          typedSignatureEnabled: signatureTypes.includes(DocumentSignatureType.TYPE),
          uploadSignatureEnabled: signatureTypes.includes(DocumentSignatureType.UPLOAD),
          drawSignatureEnabled: signatureTypes.includes(DocumentSignatureType.DRAW),
-          delegateDocumentOwnership: delegateDocumentOwnership,
+          qrSignatureEnabled: signatureTypes.includes(DocumentSignatureType.QR),
+          delegateDocumentOwnership,
          aiFeaturesEnabled,
          envelopeExpirationPeriod: envelopeExpirationPeriod ?? undefined,
          reminderSettings: reminderSettings ?? undefined,
@@ -76,13 +76,15 @@ export default function TeamsSettingsPage() {
                typedSignatureEnabled: null,
                uploadSignatureEnabled: null,
                drawSignatureEnabled: null,
+                qrSignatureEnabled: null,
              }
            : {
                typedSignatureEnabled: signatureTypes.includes(DocumentSignatureType.TYPE),
                uploadSignatureEnabled: signatureTypes.includes(DocumentSignatureType.UPLOAD),
                drawSignatureEnabled: signatureTypes.includes(DocumentSignatureType.DRAW),
+                qrSignatureEnabled: signatureTypes.includes(DocumentSignatureType.QR),
              }),
-          delegateDocumentOwnership: delegateDocumentOwnership,
+          delegateDocumentOwnership,
        },
      });

@@ -1,14 +1,18 @@
 import { trpc } from '@documenso/trpc/react';
+import type { TGetApiTokensResponse } from '@documenso/trpc/server/api-token-router/get-api-tokens.types';
 import { Alert, AlertDescription, AlertTitle } from '@documenso/ui/primitives/alert';
+import { Badge } from '@documenso/ui/primitives/badge';
 import { Button } from '@documenso/ui/primitives/button';
+import { DataTable, type DataTableColumnDef } from '@documenso/ui/primitives/data-table';
+import { Skeleton } from '@documenso/ui/primitives/skeleton';
+import { TableCell } from '@documenso/ui/primitives/table';
 import { msg } from '@lingui/core/macro';
-import { useLingui } from '@lingui/react';
-import { Trans } from '@lingui/react/macro';
+import { Trans, useLingui } from '@lingui/react/macro';
 import { TeamMemberRole } from '@prisma/client';
-import { DateTime } from 'luxon';
+import { useMemo } from 'react';

+import { TokenCreateDialog } from '~/components/dialogs/token-create-dialog';
 import TokenDeleteDialog from '~/components/dialogs/token-delete-dialog';
-import { ApiTokenForm } from '~/components/forms/token';
 import { SettingsHeader } from '~/components/general/settings-header';
 import { useOptionalCurrentTeam } from '~/providers/team';
 import { appMetaTags } from '~/utils/meta';
@@ -18,33 +22,88 @@ export function meta() {
 }

 export default function ApiTokensPage() {
-  const { i18n } = useLingui();
-
-  const { data: tokens } = trpc.apiToken.getMany.useQuery();
+  const { t, i18n } = useLingui();

  const team = useOptionalCurrentTeam();

+  const isUnauthorized = !!team && team.currentTeamRole !== TeamMemberRole.ADMIN;
+
+  const {
+    data: tokens,
+    isLoading,
+    isError,
+  } = trpc.apiToken.getMany.useQuery(undefined, {
+    enabled: !isUnauthorized,
+  });
+
+  const columns = useMemo(() => {
+    return [
+      {
+        header: t`Name`,
+        cell: ({ row }) => <span className="font-medium text-foreground">{row.original.name}</span>,
+      },
+      {
+        header: t`Created`,
+        cell: ({ row }) => i18n.date(row.original.createdAt),
+      },
+      {
+        header: t`Expires`,
+        cell: ({ row }) => {
+          if (!row.original.expires) {
+            return (
+              <span className="text-muted-foreground">
+                <Trans>Never</Trans>
+              </span>
+            );
+          }
+
+          if (row.original.expires < new Date()) {
+            return (
+              <Badge variant="destructive" size="small">
+                <Trans>Expired</Trans>
+              </Badge>
+            );
+          }
+
+          return i18n.date(row.original.expires);
+        },
+      },
+      {
+        header: t`Actions`,
+        cell: ({ row }) => (
+          <TokenDeleteDialog token={row.original}>
+            <Button variant="destructive">
+              <Trans>Delete</Trans>
+            </Button>
+          </TokenDeleteDialog>
+        ),
+      },
+    ] satisfies DataTableColumnDef<TGetApiTokensResponse[number]>[];
+  }, []);
+
  return (
    <div>
      <SettingsHeader
        title={<Trans>API Tokens</Trans>}
        subtitle={
          <Trans>
-            On this page, you can create and manage API tokens. See our{' '}
+            Create and manage API tokens. See our{' '}
            <a
              className="text-primary underline"
              href={'https://docs.documenso.com/developers/public-api'}
              target="_blank"
              rel="noopener"
            >
-              Documentation
+              documentation
            </a>{' '}
            for more information.
          </Trans>
        }
-      />
+      >
+        {!isUnauthorized && <TokenCreateDialog />}
+      </SettingsHeader>

-      {team && team?.currentTeamRole !== TeamMemberRole.ADMIN ? (
+      {isUnauthorized ? (
        <Alert className="flex flex-col items-center justify-between gap-4 p-6 md:flex-row" variant="warning">
          <div>
            <AlertTitle>
@@ -56,58 +115,43 @@ export default function ApiTokensPage() {
          </div>
        </Alert>
      ) : (
-        <>
-          <ApiTokenForm className="max-w-xl" tokens={tokens} />
-
-          <hr className="mt-8 mb-4" />
-
-          <h4 className="font-medium text-xl">
-            <Trans>Your existing tokens</Trans>
-          </h4>
-
-          {tokens && tokens.length === 0 && (
-            <div className="mb-4">
-              <p className="mt-2 text-muted-foreground text-sm italic">
-                <Trans>Your tokens will be shown here once you create them.</Trans>
+        <DataTable
+          columns={columns}
+          data={tokens ?? []}
+          perPage={0}
+          currentPage={0}
+          totalPages={0}
+          error={{
+            enable: isError,
+          }}
+          emptyState={
+            <div className="flex h-60 flex-col items-center justify-center gap-y-4 text-muted-foreground/60">
+              <p>
+                <Trans>You have no API tokens yet. Your tokens will be shown here once you create them.</Trans>
              </p>
            </div>
-          )}
-
-          {tokens && tokens.length > 0 && (
-            <div className="mt-4 flex max-w-xl flex-col gap-y-4">
-              {tokens.map((token) => (
-                <div key={token.id} className="rounded-lg border border-border p-4">
-                  <div className="flex items-center justify-between gap-x-4">
-                    <div>
-                      <h5 className="text-base">{token.name}</h5>
-
-                      <p className="mt-2 text-muted-foreground text-xs">
-                        <Trans>Created on {i18n.date(token.createdAt, DateTime.DATETIME_FULL)}</Trans>
-                      </p>
-                      {token.expires ? (
-                        <p className="mt-1 text-muted-foreground text-xs">
-                          <Trans>Expires on {i18n.date(token.expires, DateTime.DATETIME_FULL)}</Trans>
-                        </p>
-                      ) : (
-                        <p className="mt-1 text-muted-foreground text-xs">
-                          <Trans>Token doesn't have an expiration date</Trans>
-                        </p>
-                      )}
-                    </div>
-
-                    <div>
-                      <TokenDeleteDialog token={token}>
-                        <Button variant="destructive">
-                          <Trans>Delete</Trans>
-                        </Button>
-                      </TokenDeleteDialog>
-                    </div>
-                  </div>
-                </div>
-              ))}
-            </div>
-          )}
-        </>
+          }
+          skeleton={{
+            enable: isLoading,
+            rows: 3,
+            component: (
+              <>
+                <TableCell>
+                  <Skeleton className="h-4 w-24 rounded-full" />
+                </TableCell>
+                <TableCell>
+                  <Skeleton className="h-4 w-16 rounded-full" />
+                </TableCell>
+                <TableCell>
+                  <Skeleton className="h-4 w-16 rounded-full" />
+                </TableCell>
+                <TableCell>
+                  <Skeleton className="h-4 w-12 rounded-full" />
+                </TableCell>
+              </>
+            ),
+          }}
+        />
      )}
    </div>
  );
@@ -7,6 +7,7 @@ import { getEnvelopeForDirectTemplateSigning } from '@documenso/lib/server-only/
 import { getTemplateByDirectLinkToken } from '@documenso/lib/server-only/template/get-template-by-direct-link-token';
 import { DocumentAccessAuth } from '@documenso/lib/types/document-auth';
 import { extractDocumentAuthMethods } from '@documenso/lib/utils/document-auth';
+import { getRecipientsWithMissingFields } from '@documenso/lib/utils/recipients';
 import { prisma } from '@documenso/prisma';
 import { Plural } from '@lingui/react/macro';
 import { UsersIcon } from 'lucide-react';
@@ -14,6 +15,7 @@ import { redirect } from 'react-router';
 import { match } from 'ts-pattern';

 import { Header as AuthenticatedHeader } from '~/components/general/app-header';
+import { DirectTemplateInvalidPageView } from '~/components/general/direct-template/direct-template-invalid-page';
 import { DirectTemplatePageView } from '~/components/general/direct-template/direct-template-page';
 import { DirectTemplateAuthPageView } from '~/components/general/direct-template/direct-template-signing-auth-page';
 import { DocumentSigningAuthPageView } from '~/components/general/document-signing/document-signing-auth-page';
@@ -70,8 +72,18 @@ const handleV1Loader = async ({ params, request }: Route.LoaderArgs) => {
    };
  }

+  const recipientsWithMissingFields = getRecipientsWithMissingFields(template.recipients, template.fields);
+
+  if (recipientsWithMissingFields.length > 0) {
+    return {
+      isAccessAuthValid: true,
+      isTemplateMissingSignatures: true,
+    } as const;
+  }
+
  return {
    isAccessAuthValid: true,
+    isTemplateMissingSignatures: false,
    template: {
      ...template,
      folder: null,
@@ -96,6 +108,7 @@ const handleV2Loader = async ({ params, request }: Route.LoaderArgs) => {
    .then((envelopeForSigning) => {
      return {
        isDocumentAccessValid: true,
+        isTemplateMissingSignatures: false,
        envelopeForSigning,
      } as const;
    })
@@ -108,6 +121,13 @@ const handleV2Loader = async ({ params, request }: Route.LoaderArgs) => {
        } as const;
      }

+      if (error.code === AppErrorCode.MISSING_SIGNATURE_FIELD) {
+        return {
+          isDocumentAccessValid: true,
+          isTemplateMissingSignatures: true,
+        } as const;
+      }
+
      throw new Response('Not Found', { status: 404 });
    });
 };
@@ -181,6 +201,10 @@ const DirectSigningPageV1 = ({ data }: { data: Awaited<ReturnType<typeof handleV
    return <DirectTemplateAuthPageView />;
  }

+  if (data.isTemplateMissingSignatures) {
+    return <DirectTemplateInvalidPageView />;
+  }
+
  const { template, directTemplateRecipient } = data;

  return (
@@ -191,6 +215,7 @@ const DirectSigningPageV1 = ({ data }: { data: Awaited<ReturnType<typeof handleV
      typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
      uploadSignatureEnabled={template.templateMeta?.uploadSignatureEnabled}
      drawSignatureEnabled={template.templateMeta?.drawSignatureEnabled}
+      qrSignatureEnabled={template.templateMeta?.qrSignatureEnabled}
    >
      <DocumentSigningAuthProvider
        documentAuthOptions={template.authOptions}
@@ -235,6 +260,10 @@ const DirectSigningPageV2 = ({ data }: { data: Awaited<ReturnType<typeof handleV
    return <DocumentSigningAuthPageView email={''} emailHasAccount={true} />;
  }

+  if (data.isTemplateMissingSignatures) {
+    return <DirectTemplateInvalidPageView />;
+  }
+
  const { envelope, recipient } = data.envelopeForSigning;

  const { derivedRecipientAccessAuth } = extractDocumentAuthMethods({
@@ -474,6 +474,7 @@ const SigningPageV1 = ({ data }: { data: Awaited<ReturnType<typeof handleV1Loade
      typedSignatureEnabled={document.documentMeta?.typedSignatureEnabled}
      uploadSignatureEnabled={document.documentMeta?.uploadSignatureEnabled}
      drawSignatureEnabled={document.documentMeta?.drawSignatureEnabled}
+      qrSignatureEnabled={document.documentMeta?.qrSignatureEnabled}
    >
      <DocumentSigningAuthProvider documentAuthOptions={document.authOptions} recipient={recipient} user={user}>
        {sessionData?.user && <AuthenticatedHeader />}
@@ -82,7 +82,7 @@ export default function WaitingForTurnToSignPage({ loaderData }: Route.Component
      <RecipientBranding branding={branding} cspNonce={cspNonce} />
      <div className="relative flex flex-col items-center justify-center px-4 py-12 sm:px-6 lg:px-8">
        <div className="w-full max-w-md text-center">
-          <h2 className="font-bold text-3xl tracking-tigh">
+          <h2 className="font-bold text-3xl tracking-tight">
            <Trans>Waiting for Your Turn</Trans>
          </h2>

@@ -266,6 +266,7 @@ const EmbedDirectTemplatePageV1 = ({ data }: { data: Awaited<ReturnType<typeof h
      typedSignatureEnabled={template.templateMeta?.typedSignatureEnabled}
      uploadSignatureEnabled={template.templateMeta?.uploadSignatureEnabled}
      drawSignatureEnabled={template.templateMeta?.drawSignatureEnabled}
+      qrSignatureEnabled={template.templateMeta?.qrSignatureEnabled}
    >
      <DocumentSigningAuthProvider documentAuthOptions={template.authOptions} recipient={recipient} user={user}>
        <DocumentSigningRecipientProvider recipient={recipient}>
@@ -354,6 +354,7 @@ const EmbedSignDocumentPageV1 = ({ data }: { data: Awaited<ReturnType<typeof han
      typedSignatureEnabled={document.documentMeta?.typedSignatureEnabled}
      uploadSignatureEnabled={document.documentMeta?.uploadSignatureEnabled}
      drawSignatureEnabled={document.documentMeta?.drawSignatureEnabled}
+      qrSignatureEnabled={document.documentMeta?.qrSignatureEnabled}
    >
      <DocumentSigningAuthProvider documentAuthOptions={document.authOptions} recipient={recipient} user={user}>
        <EmbedSignDocumentV1ClientPage
@@ -83,6 +83,7 @@ export default function EmbeddingAuthoringDocumentCreatePage() {
          drawSignatureEnabled: signatureTypes.length === 0 || signatureTypes.includes(DocumentSignatureType.DRAW),
          typedSignatureEnabled: signatureTypes.length === 0 || signatureTypes.includes(DocumentSignatureType.TYPE),
          uploadSignatureEnabled: signatureTypes.length === 0 || signatureTypes.includes(DocumentSignatureType.UPLOAD),
+          qrSignatureEnabled: signatureTypes.length === 0 || signatureTypes.includes(DocumentSignatureType.QR),
        },
        recipients: configuration.signers.map((signer) => ({
          name: signer.name,
@@ -101,6 +101,10 @@ export default function EmbeddingAuthoringDocumentEditPage() {
      types.push(DocumentSignatureType.UPLOAD);
    }

+    if (document.documentMeta?.qrSignatureEnabled) {
+      types.push(DocumentSignatureType.QR);
+    }
+
    return types;
  }, [document.documentMeta]);

@@ -216,6 +220,10 @@ export default function EmbeddingAuthoringDocumentEditPage() {
            ? configuration.meta.signatureTypes.length === 0 ||
              configuration.meta.signatureTypes.includes(DocumentSignatureType.UPLOAD)
            : undefined,
+          qrSignatureEnabled: configuration.meta.signatureTypes
+            ? configuration.meta.signatureTypes.length === 0 ||
+              configuration.meta.signatureTypes.includes(DocumentSignatureType.QR)
+            : undefined,
        },
        recipients: configuration.signers.map((signer) => ({
          id: signer.nativeId,
@@ -101,6 +101,10 @@ export default function EmbeddingAuthoringTemplateEditPage() {
      types.push(DocumentSignatureType.UPLOAD);
    }

+    if (template.templateMeta?.qrSignatureEnabled) {
+      types.push(DocumentSignatureType.QR);
+    }
+
    return types;
  }, [template.templateMeta]);

@@ -215,6 +219,10 @@ export default function EmbeddingAuthoringTemplateEditPage() {
            ? configuration.meta.signatureTypes.length === 0 ||
              configuration.meta.signatureTypes.includes(DocumentSignatureType.UPLOAD)
            : undefined,
+          qrSignatureEnabled: configuration.meta.signatureTypes
+            ? configuration.meta.signatureTypes.length === 0 ||
+              configuration.meta.signatureTypes.includes(DocumentSignatureType.QR)
+            : undefined,
        },
        recipients: configuration.signers.map((signer) => ({
          id: signer.nativeId,
@@ -238,6 +238,7 @@ export default function MultisignPage() {
          typedSignatureEnabled={selectedDocument.documentMeta?.typedSignatureEnabled}
          uploadSignatureEnabled={selectedDocument.documentMeta?.uploadSignatureEnabled}
          drawSignatureEnabled={selectedDocument.documentMeta?.drawSignatureEnabled}
+          qrSignatureEnabled={selectedDocument.documentMeta?.qrSignatureEnabled}
        >
          <DocumentSigningAuthProvider
            documentAuthOptions={selectedDocument.authOptions}
@@ -224,6 +224,7 @@ const EnvelopeCreatePage = ({ embedAuthoringOptions }: EnvelopeCreatePageProps)
        typedSignatureEnabled: envelope.documentMeta.typedSignatureEnabled ?? undefined,
        uploadSignatureEnabled: envelope.documentMeta.uploadSignatureEnabled ?? undefined,
        drawSignatureEnabled: envelope.documentMeta.drawSignatureEnabled ?? undefined,
+        qrSignatureEnabled: envelope.documentMeta.qrSignatureEnabled ?? undefined,
        dateFormat: (envelope.documentMeta.dateFormat as TDocumentMetaDateFormat) ?? undefined,
        language: envelope.documentMeta.language as SupportedLanguageCodes,
      },
@@ -239,6 +239,7 @@ const EnvelopeEditPage = ({ embedAuthoringOptions }: EnvelopeEditPageProps) => {
        typedSignatureEnabled: envelope.documentMeta.typedSignatureEnabled, //
        uploadSignatureEnabled: envelope.documentMeta.uploadSignatureEnabled, //
        drawSignatureEnabled: envelope.documentMeta.drawSignatureEnabled, //
+        qrSignatureEnabled: envelope.documentMeta.qrSignatureEnabled, //
        dateFormat: (envelope.documentMeta.dateFormat as TDocumentMetaDateFormat) ?? undefined,
        language: envelope.documentMeta.language as SupportedLanguageCodes,
      },
@@ -12,12 +12,21 @@ type HandleSignatureFieldClickOptions = {
  typedSignatureEnabled?: boolean;
  uploadSignatureEnabled?: boolean;
  drawSignatureEnabled?: boolean;
+  qrSignatureEnabled?: boolean;
 };

 export const handleSignatureFieldClick = async (
  options: HandleSignatureFieldClickOptions,
 ): Promise<Extract<TSignEnvelopeFieldValue, { type: typeof FieldType.SIGNATURE }> | null> => {
-  const { field, fullName, signature, typedSignatureEnabled, uploadSignatureEnabled, drawSignatureEnabled } = options;
+  const {
+    field,
+    fullName,
+    signature,
+    typedSignatureEnabled,
+    uploadSignatureEnabled,
+    drawSignatureEnabled,
+    qrSignatureEnabled,
+  } = options;

  if (field.type !== FieldType.SIGNATURE) {
    throw new AppError(AppErrorCode.INVALID_REQUEST, {
@@ -40,6 +49,7 @@ export const handleSignatureFieldClick = async (
      typedSignatureEnabled,
      uploadSignatureEnabled,
      drawSignatureEnabled,
+      qrSignatureEnabled,
    });
  }

@@ -32,6 +32,10 @@ export const getDirectTemplateErrorMessage = (code: string): ToastMessageDescrip
  return match(code)
    .with('RECIPIENT_LIMIT_EXCEEDED', () => RECIPIENT_LIMIT_EXCEEDED_ERROR_MESSAGE)
    .with(AppErrorCode.TOO_MANY_REQUESTS, () => FAIR_USE_LIMIT_EXCEEDED_ERROR_MESSAGE)
+    .with(AppErrorCode.MISSING_SIGNATURE_FIELD, () => ({
+      title: msg`Missing signature fields`,
+      description: msg`This direct link template cannot be used because one or more signers do not have a signature field assigned.`,
+    }))
    .otherwise(() => ({
      title: msg`Something went wrong`,
      description: msg`We were unable to submit this document at this time. Please try again later.`,
@@ -77,6 +81,10 @@ export const getTemplateUseErrorMessage = (code: string): ToastMessageDescriptor
      title: msg`Error`,
      description: msg`The document was created but could not be sent to recipients.`,
    }))
+    .with(AppErrorCode.MISSING_SIGNATURE_FIELD, () => ({
+      title: msg`Missing signature fields`,
+      description: msg`The document could not be sent because some signers do not have a signature field. Please edit the template and add a signature field for each signer.`,
+    }))
    .with(AppErrorCode.INVALID_BODY, AppErrorCode.INVALID_REQUEST, () => ({
      title: msg`Error`,
      description: msg`The document could not be created because of missing or invalid information. Please review the template's recipients and fields.`,
@@ -36,8 +36,8 @@
    "@lingui/react": "^5.6.0",
    "@oslojs/crypto": "^1.0.1",
    "@oslojs/encoding": "^1.1.0",
-    "@react-router/node": "^7.12.0",
-    "@react-router/serve": "^7.12.0",
+    "@react-router/node": "^7.18.1",
+    "@react-router/serve": "^7.18.1",
    "@simplewebauthn/browser": "^13.2.2",
    "@simplewebauthn/server": "^13.2.2",
    "@tanstack/react-query": "5.90.10",
@@ -81,8 +81,8 @@
    "@babel/preset-typescript": "^7.28.5",
    "@lingui/babel-plugin-lingui-macro": "^5.6.0",
    "@lingui/vite-plugin": "^5.6.0",
-    "@react-router/dev": "^7.12.0",
-    "@react-router/remix-routes-option-adapter": "^7.12.0",
+    "@react-router/dev": "^7.18.1",
+    "@react-router/remix-routes-option-adapter": "^7.18.1",
    "@rollup/plugin-babel": "^6.1.0",
    "@rollup/plugin-commonjs": "^28.0.9",
    "@rollup/plugin-json": "^6.1.0",
@@ -100,11 +100,11 @@
    "esbuild": "^0.27.0",
    "remix-flat-routes": "^0.8.5",
    "rollup": "^4.53.3",
-    "tsx": "^4.20.6",
+    "tsx": "^4.23.1",
    "typescript": "5.6.2",
    "vite": "^7.2.4",
    "vite-plugin-babel-macros": "^1.0.6",
    "vite-tsconfig-paths": "^5.1.4"
  },
-  "version": "2.14.0"
+  "version": "2.16.0"
 }
@@ -19,7 +19,7 @@ WORKDIR /app

 COPY . .

-RUN npm install -g "turbo@^1.9.3"
+RUN npm install -g "turbo@^2.10.0"

 # Outputs to the /out folder
 # source: https://turbo.build/repo/docs/reference/command-line-reference/prune#--docker
@@ -79,7 +79,7 @@ COPY --from=builder /app/out/full/ .
 # Finally copy the turbo.json file so that we can run turbo commands
 COPY turbo.json turbo.json

-RUN npm install -g "turbo@^1.9.3"
+RUN npm install -g "turbo@^2.10.0"

 RUN turbo run build --filter=@documenso/remix...

@@ -5,7 +5,7 @@
    "apps/*",
    "packages/*"
  ],
-  "version": "2.14.0",
+  "version": "2.16.0",
  "scripts": {
    "postinstall": "patch-package",
    "build": "turbo run build",
@@ -61,12 +61,13 @@
    "@ts-rest/serverless": "^3.52.1",
    "dotenv": "^17.2.3",
    "dotenv-cli": "^11.0.0",
+    "esbuild": "^0.27.0",
    "husky": "^9.1.7",
    "inngest": "^3.54.0",
    "inngest-cli": "^1.17.9",
    "lint-staged": "^16.2.7",
    "nanoid": "^5.1.6",
-    "nodemailer": "^8.0.5",
+    "nodemailer": "^9.0.0",
    "pdfjs-dist": "5.4.296",
    "pino": "^9.14.0",
    "pino-pretty": "^13.1.2",
@@ -78,7 +79,7 @@
    "rimraf": "^6.1.2",
    "superjson": "^2.2.5",
    "syncpack": "^14.0.0-alpha.27",
-    "turbo": "^1.13.4",
+    "turbo": "^2.10.0",
    "vite": "^7.2.4",
    "vite-plugin-static-copy": "^3.1.4",
    "zod-openapi": "^4.2.4",
@@ -104,6 +105,7 @@
  "overrides": {
    "lodash": "4.18.1",
    "pdfjs-dist": "5.4.296",
+    "postcss": "^8.5.19",
    "typescript": "5.6.2",
    "zod": "$zod",
    "fumadocs-mdx": {
@@ -438,6 +438,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
          typedSignatureEnabled: body.meta.typedSignatureEnabled,
          uploadSignatureEnabled: body.meta.uploadSignatureEnabled,
          drawSignatureEnabled: body.meta.drawSignatureEnabled,
+          qrSignatureEnabled: body.meta.qrSignatureEnabled,
          distributionMethod: body.meta.distributionMethod,
          emailSettings: body.meta.emailSettings,
        },
@@ -50,7 +50,7 @@ import type { Organisation, Team, User } from '@prisma/client';
 *
 * --- GLOBAL LIMIT AWARENESS ---
 * apps/remix/server/router.ts applies a GLOBAL per-IP limiter to /api/v1/*:
- *   apiV1RateLimit = 100 requests / 1 minute (action `api.v1`, see rate-limits.ts).
+ *   apiV1RateLimit = 1000 requests / 1 minute (action `api.v1`, see rate-limits.ts).
 * Every per-org limit/quota configured here is kept FAR below that ceiling (single
 * digits) and the suite runs serially so the shared-IP global bucket is never the
 * thing that trips. A global-limit 429 is shaped `{ error }` whereas an org-limit
@@ -62,7 +62,7 @@ const WEBAPP_BASE_URL = NEXT_PUBLIC_WEBAPP_URL();
 const baseUrl = `${WEBAPP_BASE_URL}/api/v1`;

 // Run serially: all workers share one IP, and the global /api/v1 limiter is
-// per-IP. Serial execution keeps the shared global bucket well under 100/min.
+// per-IP. Serial execution keeps the shared global bucket well under 1000/min.
 test.describe.configure({ mode: 'serial' });

 // This suite is only meaningful with real rate limiting enabled. CI sets the
@@ -125,7 +125,7 @@ const setClaimLimits = async (team: Team, limits: ClaimLimits) => {
 * GLOBAL /api/v1 IP bucket so a fresh scenario starts from zero.
 *
 * - The org windowed limiter keys its rows `ip:org:<id>`.
- * - The GLOBAL limiter (apps/remix/server/router.ts -> apiV1RateLimit, 100/min
+ * - The GLOBAL limiter (apps/remix/server/router.ts -> apiV1RateLimit, 1000/min
 *   per IP, action `api.v1`) is shared by EVERY v1 request from this test client.
 *   Across the suite (and especially across repeated local runs within the same
 *   minute) that shared bucket would otherwise fill up and trip BEFORE the org
@@ -196,6 +196,7 @@ test.describe('API V2 Envelopes', () => {
          typedSignatureEnabled: true,
          uploadSignatureEnabled: false,
          drawSignatureEnabled: false,
+          qrSignatureEnabled: false,
          emailReplyTo: userA.email,
          emailSettings: {
            recipientSigningRequest: false,
@@ -295,6 +296,7 @@ test.describe('API V2 Envelopes', () => {
      expect(envelope.documentMeta.typedSignatureEnabled).toBe(payload.meta.typedSignatureEnabled);
      expect(envelope.documentMeta.uploadSignatureEnabled).toBe(payload.meta.uploadSignatureEnabled);
      expect(envelope.documentMeta.drawSignatureEnabled).toBe(payload.meta.drawSignatureEnabled);
+      expect(envelope.documentMeta.qrSignatureEnabled).toBe(payload.meta.qrSignatureEnabled);
      expect(envelope.documentMeta.emailReplyTo).toBe(payload.meta.emailReplyTo);
      expect(envelope.documentMeta.emailSettings).toEqual(payload.meta.emailSettings);

@@ -37,7 +37,7 @@ import type { Organisation, Team, User } from '@prisma/client';
 *
 * --- GLOBAL LIMIT AWARENESS ---
 * apps/remix/server/router.ts applies a GLOBAL per-IP limiter to /api/v2/*:
- *   apiV2RateLimit = 100 requests / 1 minute (see rate-limits.ts).
+ *   apiV2RateLimit = 1000 requests / 1 minute (see rate-limits.ts).
 * Every per-org limit/quota configured here is kept FAR below that ceiling (single
 * digits) and the suite runs serially so the shared-IP global bucket is never the
 * thing that trips. A global-limit 429 is shaped `{ error }` whereas an org-limit
@@ -49,7 +49,7 @@ const WEBAPP_BASE_URL = NEXT_PUBLIC_WEBAPP_URL();
 const baseUrl = `${WEBAPP_BASE_URL}/api/v2-beta`;

 // Run serially: all workers share one IP, and the global /api/v2 limiter is
-// per-IP. Serial execution keeps the shared global bucket well under 100/min.
+// per-IP. Serial execution keeps the shared global bucket well under 1000/min.
 test.describe.configure({ mode: 'serial' });

 // This suite is only meaningful with real rate limiting enabled. CI sets the
@@ -158,6 +158,7 @@ test.describe('AutoSave Settings Step', () => {
      expect(retrieved.documentMeta?.drawSignatureEnabled).toBe(false);
      expect(retrieved.documentMeta?.typedSignatureEnabled).toBe(false);
      expect(retrieved.documentMeta?.uploadSignatureEnabled).toBe(true);
+      expect(retrieved.documentMeta?.qrSignatureEnabled).toBe(true);
    }).toPass();
  });

@@ -0,0 +1,76 @@
+import { seedDirectTemplate } from '@documenso/prisma/seed/templates';
+import { seedUser } from '@documenso/prisma/seed/users';
+import { expect, type Page, test } from '@playwright/test';
+
+import { apiSignin } from '../fixtures/authentication';
+import { clickEnvelopeEditorStep } from '../fixtures/envelope-editor';
+
+const INVALID_DIRECT_TEMPLATE_ALERT_TITLE = 'Invalid direct link template';
+
+/**
+ * Place a field on the PDF canvas in the envelope editor.
+ */
+const placeFieldOnPdf = async (root: Page, fieldName: 'Signature' | 'Text', position: { x: number; y: number }) => {
+  await root.getByRole('button', { name: fieldName, exact: true }).click();
+
+  const canvas = root.locator('.konva-container canvas').first();
+  await expect(canvas).toBeVisible();
+  await canvas.click({ position });
+};
+
+/**
+ * Seed a V2 direct template and open it in the native template editor.
+ *
+ * Only the native template editor is covered here: direct links only exist
+ * for templates and are not part of the embedded editor surfaces.
+ */
+const openDirectTemplateEditor = async (page: Page, options: { createDirectRecipientSignatureField: boolean }) => {
+  const { user, team } = await seedUser();
+
+  const template = await seedDirectTemplate({
+    title: `E2E Direct Template Validation ${Date.now()}`,
+    userId: user.id,
+    teamId: team.id,
+    internalVersion: 2,
+    createDirectRecipientSignatureField: options.createDirectRecipientSignatureField,
+  });
+
+  await apiSignin({
+    page,
+    email: user.email,
+    redirectPath: `/t/${team.url}/templates/${template.id}/edit`,
+  });
+
+  return { user, team, template };
+};
+
+test.describe('template editor', () => {
+  test('shows invalid direct template warning when a signer has no signature field', async ({ page }) => {
+    await openDirectTemplateEditor(page, { createDirectRecipientSignatureField: false });
+
+    await expect(page.getByText(INVALID_DIRECT_TEMPLATE_ALERT_TITLE)).toBeVisible();
+    await expect(page.getByText('are missing a signature field')).toBeVisible();
+  });
+
+  test('does not show the warning when all signers have signature fields', async ({ page }) => {
+    await openDirectTemplateEditor(page, { createDirectRecipientSignatureField: true });
+
+    // Wait for the editor to render before asserting the banner is absent.
+    await expect(page.getByTestId('envelope-editor-step-upload')).toBeVisible();
+    await expect(page.getByText(INVALID_DIRECT_TEMPLATE_ALERT_TITLE)).not.toBeVisible();
+  });
+
+  test('warning disappears after placing a signature field', async ({ page }) => {
+    await openDirectTemplateEditor(page, { createDirectRecipientSignatureField: false });
+
+    await expect(page.getByText(INVALID_DIRECT_TEMPLATE_ALERT_TITLE)).toBeVisible();
+
+    // Place a signature field for the direct recipient (auto-selected single recipient).
+    await clickEnvelopeEditorStep(page, 'addFields');
+    await expect(page.locator('.konva-container canvas').first()).toBeVisible();
+    await placeFieldOnPdf(page, 'Signature', { x: 120, y: 140 });
+
+    // The banner clears once the field is autosaved and the envelope state updates.
+    await expect(page.getByText(INVALID_DIRECT_TEMPLATE_ALERT_TITLE)).not.toBeVisible({ timeout: 15_000 });
+  });
+});
@@ -0,0 +1,199 @@
+import { prisma } from '@documenso/prisma';
+import { expect, type Page, test } from '@playwright/test';
+
+import {
+  clickAddSignerButton,
+  clickEnvelopeEditorStep,
+  getRecipientEmailInputs,
+  openDocumentEnvelopeEditor,
+  setRecipientEmail,
+  setRecipientName,
+  type TEnvelopeEditorSurface,
+} from '../fixtures/envelope-editor';
+
+/**
+ * Reproduction for the recipient autosave race condition.
+ *
+ * Symptom (production only, where there is real network lag):
+ *   1. The author adds a recipient and types its name/email.
+ *   2. They navigate to the "Add Fields" step.
+ *   3. The recipient selector shows the default "Recipient 1" placeholder
+ *      instead of the recipient they just typed, and the typed name/email is
+ *      silently lost.
+ *
+ * Theory (see packages/lib/client-only/hooks/use-envelope-autosave.ts):
+ *   When the author navigates, `flushAutosave()` is awaited before the Add
+ *   Fields page renders. If an *earlier* (empty) recipient save is still
+ *   in-flight at that moment, `flush()` awaits that in-flight save and returns
+ *   WITHOUT committing the newer typed data sitting in `lastArgsRef` (whose
+ *   debounce timer it just cleared). The typed data is dropped, the empty
+ *   recipient persists, and the selector renders "Recipient 1".
+ *
+ * This only happens when a save is still in-flight at navigation time, which is
+ * why it never reproduces locally (fast saves) but does on a laggy network.
+ *
+ * The test below simulates that lag by holding the first `envelope.recipient.set`
+ * request open. It asserts the CORRECT behaviour (typed recipient survives), so
+ * it is RED while the bug exists and GREEN once the autosave hook is fixed.
+ */
+
+const RECIPIENT_SET_PROCEDURE = 'envelope.recipient.set';
+
+// How long to hold the first recipient autosave "in-flight" to emulate prod lag.
+const SIMULATED_NETWORK_LAG_MS = 5000;
+
+const FIRST_RECIPIENT = {
+  name: 'Alice Author',
+  email: 'alice-autosave-race@example.com',
+};
+
+const SECOND_RECIPIENT = {
+  name: 'Bob Builder',
+  email: 'bob-autosave-race@example.com',
+};
+
+type RecipientSetLagHandle = {
+  /** Resolves the instant the first recipient.set request is in-flight on the client. */
+  firstRecipientSetInFlight: Promise<void>;
+  /** Raw request bodies of every recipient.set call we intercepted. */
+  recipientSetRequestBodies: string[];
+};
+
+/**
+ * Installs a fake "production network lag" on the recipient autosave mutation.
+ *
+ * Only the FIRST recipient.set request is held open for `lagMs` (this is the save
+ * that must still be in-flight at navigation time for the race to occur). It
+ * resolves `firstRecipientSetInFlight` the instant it is intercepted so the test
+ * can keep typing while that save is pending. Subsequent recipient.set requests
+ * (e.g. the follow-up save the fixed hook issues) are forwarded immediately so the
+ * test does not pay the lag twice.
+ */
+const installRecipientSetLag = async (page: Page, lagMs: number): Promise<RecipientSetLagHandle> => {
+  let markFirstInFlight: () => void = () => {};
+
+  const firstRecipientSetInFlight = new Promise<void>((resolve) => {
+    markFirstInFlight = resolve;
+  });
+
+  const recipientSetRequestBodies: string[] = [];
+
+  await page.route('**/api/trpc/**', async (route) => {
+    const request = route.request();
+
+    if (request.method() !== 'POST' || !request.url().includes(RECIPIENT_SET_PROCEDURE)) {
+      await route.continue();
+      return;
+    }
+
+    const callIndex = recipientSetRequestBodies.length + 1;
+    recipientSetRequestBodies.push(request.postData() ?? '');
+
+    if (callIndex === 1) {
+      // eslint-disable-next-line no-console
+      console.log(`[test] holding first ${RECIPIENT_SET_PROCEDURE} for ${lagMs}ms (simulated network lag)`);
+
+      // The empty save is now in-flight from the client's perspective.
+      markFirstInFlight();
+
+      await new Promise((resolve) => setTimeout(resolve, lagMs));
+    } else {
+      // eslint-disable-next-line no-console
+      console.log(`[test] forwarding ${RECIPIENT_SET_PROCEDURE} #${callIndex} (no lag)`);
+    }
+
+    await route.continue();
+  });
+
+  return { firstRecipientSetInFlight, recipientSetRequestBodies };
+};
+
+const assertEnvelopeRecipientsPersisted = async (surface: TEnvelopeEditorSurface) => {
+  if (!surface.envelopeId) {
+    throw new Error('Expected the document editor surface to have an envelopeId');
+  }
+
+  const envelope = await prisma.envelope.findFirstOrThrow({
+    where: { id: surface.envelopeId },
+    include: {
+      recipients: {
+        orderBy: { signingOrder: 'asc' },
+      },
+    },
+  });
+
+  const persistedEmails = envelope.recipients.map((recipient) => recipient.email).filter(Boolean);
+
+  // eslint-disable-next-line no-console
+  console.log(
+    '[test] persisted recipients:',
+    JSON.stringify(
+      envelope.recipients.map((recipient) => ({ name: recipient.name, email: recipient.email })),
+      null,
+      2,
+    ),
+  );
+
+  expect(persistedEmails).toContain(FIRST_RECIPIENT.email);
+  expect(persistedEmails).toContain(SECOND_RECIPIENT.email);
+};
+
+test.describe('envelope editor recipient autosave race (network lag)', () => {
+  test('document editor: typed recipient survives navigation to Add Fields', async ({ page }) => {
+    const surface = await openDocumentEnvelopeEditor(page);
+
+    const { firstRecipientSetInFlight, recipientSetRequestBodies } = await installRecipientSetLag(
+      page,
+      SIMULATED_NETWORK_LAG_MS,
+    );
+
+    // 1. Add a second signer row. A blank document already has one empty default
+    //    signer, so this schedules an autosave of TWO empty recipients
+    //    (name='' / email='') - this is the save that will be in-flight.
+    await clickAddSignerButton(surface.root);
+    await expect(getRecipientEmailInputs(surface.root)).toHaveCount(2);
+
+    // 2. Wait until that empty autosave is actually in-flight on the client. This
+    //    is the precondition the bug needs: a slow save holding the autosave lock.
+    await firstRecipientSetInFlight;
+
+    // 3. The author now fills in the recipients they are adding.
+    await setRecipientName(surface.root, 0, FIRST_RECIPIENT.name);
+    await setRecipientEmail(surface.root, 0, FIRST_RECIPIENT.email);
+    await setRecipientName(surface.root, 1, SECOND_RECIPIENT.name);
+    await setRecipientEmail(surface.root, 1, SECOND_RECIPIENT.email);
+
+    // 4. Immediately navigate to Add Fields (before the typed data's debounce
+    //    fires). flushAutosave() awaits the in-flight EMPTY save; with the bug
+    //    present it returns without ever committing the typed data.
+    await clickEnvelopeEditorStep(surface.root, 'addFields');
+
+    // 5. Wait for the Add Fields page to render (after the lagged flush resolves).
+    await expect(surface.root.getByText('Selected Recipient')).toBeVisible({
+      timeout: SIMULATED_NETWORK_LAG_MS + 15000,
+    });
+
+    // Diagnostics - the request bodies show what actually reached the server.
+    // Buggy: only the first (empty) save is ever sent. Fixed: a follow-up save
+    // carrying the typed recipients is sent too.
+    // eslint-disable-next-line no-console
+    console.log('\n===== AUTOSAVE RACE DIAGNOSTICS =====');
+    // eslint-disable-next-line no-console
+    console.log(`recipient.set requests sent to server: ${recipientSetRequestBodies.length}`);
+    // eslint-disable-next-line no-console
+    console.log(
+      `server ever received "${FIRST_RECIPIENT.email}": ${recipientSetRequestBodies.some((body) => body.includes(FIRST_RECIPIENT.email))}`,
+    );
+    // eslint-disable-next-line no-console
+    console.log('=====================================\n');
+
+    // 6. THE USER-VISIBLE BUG: the selected recipient must be the one we typed
+    //    (Alice), not the default "Recipient 1" placeholder.
+    const selectedRecipientSection = surface.root.locator('section').filter({ hasText: 'Selected Recipient' });
+
+    await expect(selectedRecipientSection.getByRole('combobox')).toContainText(FIRST_RECIPIENT.name);
+
+    // 7. THE DATA LOSS: the typed recipients must actually be persisted.
+    await assertEnvelopeRecipientsPersisted(surface);
+  });
+});
@@ -384,6 +384,7 @@ const assertEnvelopeSettingsPersistedInDatabase = async ({
  expect(envelope.documentMeta.drawSignatureEnabled).toBe(true);
  expect(envelope.documentMeta.typedSignatureEnabled).toBe(true);
  expect(envelope.documentMeta.uploadSignatureEnabled).toBe(false);
+  expect(envelope.documentMeta.qrSignatureEnabled).toBe(true);
  expect(envelope.documentMeta.emailSettings).toMatchObject(DB_EXPECTED_VALUES.emailSettings);

  const authOptions = parseAuthOptions(envelope.authOptions);
@@ -56,6 +56,7 @@ test('[ORGANISATIONS]: manage document preferences', async ({ page }) => {
  expect(teamSettings.typedSignatureEnabled).toEqual(true);
  expect(teamSettings.uploadSignatureEnabled).toEqual(false);
  expect(teamSettings.drawSignatureEnabled).toEqual(false);
+  expect(teamSettings.qrSignatureEnabled).toEqual(true);

  // Edit the team settings
  await page.goto(`/t/${team.url}/settings/document`);
@@ -90,6 +91,7 @@ test('[ORGANISATIONS]: manage document preferences', async ({ page }) => {
  expect(updatedTeamSettings.typedSignatureEnabled).toEqual(true);
  expect(updatedTeamSettings.uploadSignatureEnabled).toEqual(false);
  expect(updatedTeamSettings.drawSignatureEnabled).toEqual(false);
+  expect(updatedTeamSettings.qrSignatureEnabled).toEqual(true);

  const document = await seedTeamDocumentWithMeta(team);

@@ -105,6 +107,7 @@ test('[ORGANISATIONS]: manage document preferences', async ({ page }) => {
  expect(documentMeta.typedSignatureEnabled).toEqual(true);
  expect(documentMeta.uploadSignatureEnabled).toEqual(false);
  expect(documentMeta.drawSignatureEnabled).toEqual(false);
+  expect(documentMeta.qrSignatureEnabled).toEqual(true);
  expect(documentMeta.language).toEqual('pl');
  expect(documentMeta.timezone).toEqual('Europe/London');
  expect(documentMeta.dateFormat).toEqual('MM/dd/yyyy');
@@ -6,6 +6,7 @@ import { expect, test } from '@playwright/test';

 import { apiSignin } from '../fixtures/authentication';
 import { expectToastTextToBeVisible } from '../fixtures/generic';
+import { signSignaturePad } from '../fixtures/signature';

 test('[PUBLIC_PROFILE]: create team profile', async ({ page }) => {
  const { user, team } = await seedUser();
@@ -73,8 +74,19 @@ test('[PUBLIC_PROFILE]: create team profile', async ({ page }) => {
  await expect(page.locator('body')).toContainText('public-direct-template-title');
  await expect(page.locator('body')).toContainText('public-direct-template-description');

+  const directSignatureField = directTemplate.fields[0];
+
+  if (!directSignatureField) {
+    throw new Error('Expected seeded direct template signature field to exist');
+  }
+
  await page.getByRole('link', { name: 'Sign' }).click();
  await page.getByRole('button', { name: 'Continue' }).click();
+
+  await signSignaturePad(page);
+  await page.locator(`#field-${directSignatureField.id}`).getByRole('button').click();
+  await expect(page.locator(`#field-${directSignatureField.id}`)).toHaveAttribute('data-inserted', 'true');
+
  await page.getByRole('button', { name: 'Complete' }).click();
  await page.getByRole('button', { name: 'Sign' }).click();

@@ -0,0 +1,213 @@
+import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
+import { prisma } from '@documenso/prisma';
+import { AnonymousVerificationTokenType, FieldType } from '@documenso/prisma/client';
+import { seedPendingDocumentWithFullFields } from '@documenso/prisma/seed/documents';
+import { seedUser } from '@documenso/prisma/seed/users';
+import type { Page } from '@playwright/test';
+import { expect, test } from '@playwright/test';
+
+test.describe.configure({ mode: 'parallel' });
+
+/**
+ * Draw a zig-zag onto the drawing canvas so that it passes the minimum
+ * signature coverage threshold.
+ */
+const drawOnSignaturePad = async (page: Page) => {
+  const canvas = page.getByTestId('signature-pad-draw');
+
+  await canvas.waitFor({ state: 'visible' });
+
+  let capturedBox: { x: number; y: number; width: number; height: number } | null = null;
+
+  // `boundingBox()` can return null if the canvas is replaced mid-hydration,
+  // so poll until a measurable element is attached, capturing the box inside
+  // the retry closure so it is never re-fetched (and re-raced) afterwards.
+  await expect(async () => {
+    capturedBox = await canvas.boundingBox();
+
+    expect(capturedBox).not.toBeNull();
+    expect(capturedBox?.width ?? 0).toBeGreaterThan(0);
+  }).toPass({ timeout: 5_000 });
+
+  // TS cannot see the closure assignment above, so widen the type back out.
+  const box = capturedBox as { x: number; y: number; width: number; height: number } | null;
+
+  if (!box) {
+    throw new Error('Signature pad canvas not found');
+  }
+
+  await page.mouse.move(box.x + box.width * 0.15, box.y + box.height * 0.5);
+  await page.mouse.down();
+
+  for (let i = 0; i < 8; i++) {
+    await page.mouse.move(box.x + box.width * (0.15 + i * 0.09), box.y + box.height * (i % 2 === 0 ? 0.25 : 0.75), {
+      steps: 10,
+    });
+  }
+
+  await page.mouse.up();
+};
+
+test('[QR_SIGNATURE]: complete signing via mobile qr handoff', async ({ page, browser }) => {
+  const { user, team } = await seedUser();
+
+  const { recipients } = await seedPendingDocumentWithFullFields({
+    owner: user,
+    recipients: ['qr-signer@test.documenso.com'],
+    teamId: team.id,
+    fields: [FieldType.SIGNATURE],
+  });
+
+  const recipient = recipients[0];
+
+  await page.goto(`/sign/${recipient.token}`);
+
+  // Wait for the client-side PDF render so we know the page has hydrated
+  // before interacting with the signature pad.
+  await page.waitForSelector(PDF_VIEWER_PAGE_SELECTOR);
+
+  // Open the signature dialog and switch to the Mobile tab.
+  await page.getByTestId('signature-pad-dialog-button').click();
+  await page.getByRole('tab', { name: 'Mobile' }).click();
+
+  // Read the handoff URL rendered beneath the QR code.
+  await expect(page.getByTestId('signature-pad-qr-url')).toBeVisible();
+  const handoffUrl = await page.getByTestId('signature-pad-qr-url').textContent();
+
+  expect(handoffUrl).toContain('/mobile-signature/');
+
+  // Open the mobile page in a fully isolated browser context (no shared
+  // cookies or session) to prove the handoff requires no authentication.
+  const mobileContext = await browser.newContext();
+  const mobilePage = await mobileContext.newPage();
+
+  await mobilePage.goto(handoffUrl ?? '');
+
+  await expect(mobilePage.getByRole('heading', { name: 'Draw your signature' })).toBeVisible();
+
+  await drawOnSignaturePad(mobilePage);
+
+  await mobilePage.getByRole('button', { name: 'Submit' }).click();
+
+  await expect(mobilePage.getByText('Signature sent')).toBeVisible();
+
+  await mobileContext.close();
+
+  // The desktop pad should receive the signature within a poll interval.
+  await expect(page.getByTestId('signature-pad-qr-preview')).toBeVisible({ timeout: 10_000 });
+
+  // The session is single-use: the desktop pickup deletes the row on read, and
+  // a missing row is indistinguishable from an expired one by design. So a
+  // revisit must show the expired page (not "Signature already sent"), which
+  // proves the deletion happened.
+  const revisitContext = await browser.newContext();
+  const revisitPage = await revisitContext.newPage();
+
+  await revisitPage.goto(handoffUrl ?? '');
+
+  await expect(revisitPage.getByRole('heading', { name: 'This link has expired' })).toBeVisible();
+
+  await revisitContext.close();
+
+  // Direct proof of consumption: the token row must be gone from the database.
+  const consumedToken = (handoffUrl ?? '').split('/mobile-signature/')[1];
+
+  const consumedRow = await prisma.anonymousVerificationToken.findFirst({
+    where: { token: consumedToken },
+  });
+
+  expect(consumedRow).toBeNull();
+
+  // Confirm and finish signing the document.
+  await page.getByRole('button', { name: 'Next' }).click();
+
+  await page.locator('[data-field-type="SIGNATURE"]:not([data-readonly="true"])').first().click();
+
+  await page.getByRole('button', { name: 'Complete' }).click();
+  await page.getByRole('button', { name: 'Sign' }).click();
+
+  await page.waitForURL(`/sign/${recipient.token}/complete`);
+  await expect(page.getByText('Document Signed')).toBeVisible();
+});
+
+test('[QR_SIGNATURE]: mobile tab hidden when qr disabled', async ({ page }) => {
+  const { user, team } = await seedUser();
+
+  const { document, recipients } = await seedPendingDocumentWithFullFields({
+    owner: user,
+    recipients: ['qr-disabled-signer@test.documenso.com'],
+    teamId: team.id,
+    fields: [FieldType.SIGNATURE],
+  });
+
+  // Seeded documents create their meta row with bare column defaults, which
+  // leave qrSignatureEnabled true, so disable it directly on the meta row.
+  await prisma.documentMeta.update({
+    where: { id: document.documentMetaId },
+    data: { qrSignatureEnabled: false },
+  });
+
+  const recipient = recipients[0];
+
+  await page.goto(`/sign/${recipient.token}`);
+
+  await page.waitForSelector(PDF_VIEWER_PAGE_SELECTOR);
+
+  await page.getByTestId('signature-pad-dialog-button').click();
+
+  // Waiting on the Draw tab first guarantees the tab list has rendered before
+  // asserting the Mobile tab is absent.
+  await expect(page.getByRole('tab', { name: 'Draw' })).toBeVisible();
+  await expect(page.getByRole('tab', { name: 'Mobile' })).not.toBeVisible();
+});
+
+test('[QR_SIGNATURE]: mobile tab shown when draw disabled but qr enabled', async ({ page }) => {
+  const { user, team } = await seedUser();
+
+  const { document, recipients } = await seedPendingDocumentWithFullFields({
+    owner: user,
+    recipients: ['qr-only-signer@test.documenso.com'],
+    teamId: team.id,
+    fields: [FieldType.SIGNATURE],
+  });
+
+  // qrSignatureEnabled already defaults to true on seeded metas, but set it
+  // explicitly so the test still documents the required state if defaults change.
+  await prisma.documentMeta.update({
+    where: { id: document.documentMetaId },
+    data: { drawSignatureEnabled: false, qrSignatureEnabled: true },
+  });
+
+  const recipient = recipients[0];
+
+  await page.goto(`/sign/${recipient.token}`);
+
+  await page.waitForSelector(PDF_VIEWER_PAGE_SELECTOR);
+
+  await page.getByTestId('signature-pad-dialog-button').click();
+
+  await expect(page.getByRole('tab', { name: 'Mobile' })).toBeVisible();
+  await expect(page.getByRole('tab', { name: 'Draw' })).not.toBeVisible();
+});
+
+test('[QR_SIGNATURE]: unknown token shows expired page', async ({ page }) => {
+  await page.goto('/mobile-signature/this-token-does-not-exist');
+
+  await expect(page.getByRole('heading', { name: 'This link has expired' })).toBeVisible();
+});
+
+test('[QR_SIGNATURE]: expired token shows expired page', async ({ page }) => {
+  const expiredToken = `qr-e2e-expired-${Date.now()}-${Math.floor(Math.random() * 100000)}`;
+
+  await prisma.anonymousVerificationToken.create({
+    data: {
+      type: AnonymousVerificationTokenType.QR_SIGNATURE,
+      token: expiredToken,
+      expiresAt: new Date(Date.now() - 60_000),
+    },
+  });
+
+  await page.goto(`/mobile-signature/${expiredToken}`);
+
+  await expect(page.getByRole('heading', { name: 'This link has expired' })).toBeVisible();
+});
@@ -25,6 +25,7 @@ test('[TEAMS]: check that default team signature settings are all enabled', asyn
  await expect(page.getByRole('combobox').filter({ hasText: 'Type' })).toBeVisible();
  await expect(page.getByRole('combobox').filter({ hasText: 'Upload' })).toBeVisible();
  await expect(page.getByRole('combobox').filter({ hasText: 'Draw' })).toBeVisible();
+  await expect(page.getByRole('combobox').filter({ hasText: 'QR code' })).toBeVisible();

  // Go to document and check that the signatured tabs are correct.
  await page.goto(`/sign/${document.recipients[0].token}`);
@@ -34,6 +35,7 @@ test('[TEAMS]: check that default team signature settings are all enabled', asyn
  await expect(page.getByRole('tab', { name: 'Type' })).toBeVisible();
  await expect(page.getByRole('tab', { name: 'Upload' })).toBeVisible();
  await expect(page.getByRole('tab', { name: 'Draw' })).toBeVisible();
+  await expect(page.getByRole('tab', { name: 'Mobile' })).toBeVisible();
 });

 test('[TEAMS]: check signature modes can be disabled', async ({ page }) => {
@@ -45,8 +47,11 @@ test('[TEAMS]: check signature modes can be disabled', async ({ page }) => {
    redirectPath: `/t/${team.url}/settings/document`,
  });

-  const allTabs = ['Type', 'Upload', 'Draw'];
-  const tabTest = [['Type', 'Upload', 'Draw'], ['Type', 'Upload'], ['Type']];
+  // The 'QR code' signature type is surfaced as the 'Mobile' tab on the signing dialog.
+  const allSignatureOptions = ['Type', 'Upload', 'Draw', 'QR code'];
+  const tabNameForOption = (option: string) => (option === 'QR code' ? 'Mobile' : option);
+
+  const tabTest = [['Type', 'Upload', 'Draw', 'QR code'], ['Type', 'Upload'], ['Type']];

  for (const tabs of tabTest) {
    await page.goto(`/t/${team.url}/settings/document`);
@@ -57,9 +62,10 @@ test('[TEAMS]: check signature modes can be disabled', async ({ page }) => {
    await expect(page.getByRole('option', { name: 'Type' })).toBeVisible();
    await expect(page.getByRole('option', { name: 'Upload' })).toBeVisible();
    await expect(page.getByRole('option', { name: 'Draw' })).toBeVisible();
+    await expect(page.getByRole('option', { name: 'QR code' })).toBeVisible();

    // Clear all selected items.
-    for (const tab of allTabs) {
+    for (const tab of allSignatureOptions) {
      const item = page.getByRole('option', { name: tab });

      const isSelected = (await item.innerHTML()).includes('opacity-100');
@@ -90,12 +96,13 @@ test('[TEAMS]: check signature modes can be disabled', async ({ page }) => {
    await page.waitForSelector('[role="dialog"]');

    // Check the tab values
-    for (const tab of allTabs) {
-      if (tabs.includes(tab)) {
-        await expect(page.getByRole('tab', { name: tab })).toBeVisible();
+    for (const option of allSignatureOptions) {
+      const tabName = tabNameForOption(option);
+
+      if (tabs.includes(option)) {
+        await expect(page.getByRole('tab', { name: tabName })).toBeVisible();
      } else {
-        // await expect(page.getByRole('tab', { name: tab })).not.toBeVisible();
-        await expect(page.getByRole('tab', { name: tab })).toHaveCount(0);
+        await expect(page.getByRole('tab', { name: tabName })).toHaveCount(0);
      }
    }
  }
@@ -110,8 +117,8 @@ test('[TEAMS]: check signature modes work for templates', async ({ page }) => {
    redirectPath: `/t/${team.url}/settings/document`,
  });

-  const allTabs = ['Type', 'Upload', 'Draw'];
-  const tabTest = [['Type', 'Upload', 'Draw'], ['Type', 'Upload'], ['Type']];
+  const allSignatureOptions = ['Type', 'Upload', 'Draw', 'QR code'];
+  const tabTest = [['Type', 'Upload', 'Draw', 'QR code'], ['Type', 'Upload'], ['Type']];

  for (const tabs of tabTest) {
    await page.goto(`/t/${team.url}/settings/document`);
@@ -122,9 +129,10 @@ test('[TEAMS]: check signature modes work for templates', async ({ page }) => {
    await expect(page.getByRole('option', { name: 'Type' })).toBeVisible();
    await expect(page.getByRole('option', { name: 'Upload' })).toBeVisible();
    await expect(page.getByRole('option', { name: 'Draw' })).toBeVisible();
+    await expect(page.getByRole('option', { name: 'QR code' })).toBeVisible();

    // Clear all selected items.
-    for (const tab of allTabs) {
+    for (const tab of allSignatureOptions) {
      const item = page.getByRole('option', { name: tab });

      const isSelected = (await item.innerHTML()).includes('opacity-100');
@@ -176,5 +184,6 @@ test('[TEAMS]: check signature modes work for templates', async ({ page }) => {
    expect(document?.documentMeta?.typedSignatureEnabled).toEqual(tabs.includes('Type'));
    expect(document?.documentMeta?.uploadSignatureEnabled).toEqual(tabs.includes('Upload'));
    expect(document?.documentMeta?.drawSignatureEnabled).toEqual(tabs.includes('Draw'));
+    expect(document?.documentMeta?.qrSignatureEnabled).toEqual(tabs.includes('QR code'));
  }
 });
@@ -152,6 +152,7 @@ test.describe('AutoSave Settings Step - Templates', () => {
      expect(retrievedTemplate.templateMeta?.drawSignatureEnabled).toBe(false);
      expect(retrievedTemplate.templateMeta?.typedSignatureEnabled).toBe(false);
      expect(retrievedTemplate.templateMeta?.uploadSignatureEnabled).toBe(true);
+      expect(retrievedTemplate.templateMeta?.qrSignatureEnabled).toBe(true);
    }).toPass();
  });

@@ -197,7 +197,18 @@ test('[DIRECT_TEMPLATES]: V1 direct template link auth access', async ({ page })
  await expect(page.getByRole('heading', { name: 'General' })).toBeVisible();
  await expect(page.getByLabel('Email')).toBeDisabled();

+  const directSignatureField = directTemplateWithAuth.fields[0];
+
+  if (!directSignatureField) {
+    throw new Error('Expected seeded direct template signature field to exist');
+  }
+
  await page.getByRole('button', { name: 'Continue' }).click();
+
+  await signSignaturePad(page);
+  await page.locator(`#field-${directSignatureField.id}`).getByRole('button').click();
+  await expect(page.locator(`#field-${directSignatureField.id}`)).toHaveAttribute('data-inserted', 'true');
+
  await page.getByRole('button', { name: 'Complete' }).click();

  await page.getByRole('button', { name: 'Sign' }).click();
@@ -235,6 +246,37 @@ test('[DIRECT_TEMPLATES]: V2 direct template link auth access', async ({ page })
  await page.goto(directTemplatePath);

  await expect(page.getByRole('heading', { name: 'Personal direct template link' })).toBeVisible();
+
+  const directSignatureField = directTemplateWithAuth.fields[0];
+
+  if (!directSignatureField) {
+    throw new Error('Expected seeded direct template signature field to exist');
+  }
+
+  // Wait for the PDF and the Konva canvas overlay to be ready.
+  await expect(page.locator('img[data-page-number]').first()).toBeVisible({ timeout: 30_000 });
+  const canvas = page.locator('.konva-container canvas').first();
+  await expect(canvas).toBeVisible({ timeout: 30_000 });
+
+  // Sign the direct template recipient's signature field via the canvas-based V2 UI.
+  await signSignaturePad(page);
+
+  const canvasBox = await canvas.boundingBox();
+
+  if (!canvasBox) {
+    throw new Error('Canvas bounding box not found');
+  }
+
+  const x =
+    (Number(directSignatureField.positionX) / 100) * canvasBox.width +
+    ((Number(directSignatureField.width) / 100) * canvasBox.width) / 2;
+  const y =
+    (Number(directSignatureField.positionY) / 100) * canvasBox.height +
+    ((Number(directSignatureField.height) / 100) * canvasBox.height) / 2;
+
+  await canvas.click({ position: { x, y } });
+  await expect(page.getByText('0 Fields Remaining').first()).toBeVisible({ timeout: 10_000 });
+
  await page.getByRole('button', { name: 'Complete' }).click();
  await expect(page.getByLabel('Your Email')).not.toBeVisible();

@@ -266,6 +308,16 @@ test('[DIRECT_TEMPLATES]: use direct template link with 1 recipient', async ({ p

  await expect(page.getByText('Next Recipient Name')).not.toBeVisible();

+  const directSignatureField = template.fields[0];
+
+  if (!directSignatureField) {
+    throw new Error('Expected seeded direct template signature field to exist');
+  }
+
+  await signSignaturePad(page);
+  await page.locator(`#field-${directSignatureField.id}`).getByRole('button').click();
+  await expect(page.locator(`#field-${directSignatureField.id}`)).toHaveAttribute('data-inserted', 'true');
+
  await page.getByRole('button', { name: 'Complete' }).click();
  await page.getByRole('button', { name: 'Sign' }).click();
  await page.waitForURL(/\/sign/);
@@ -299,19 +351,13 @@ test('[DIRECT_TEMPLATES]: V1 use direct template link with 2 recipients with nex
    },
  });

-  const directTemplateRecipient = template.recipients[0];
+  // The seeded direct template already includes a signature field for the direct recipient.
+  const directSignatureField = template.fields[0];

-  if (!directTemplateRecipient) {
-    throw new Error('Expected direct template recipient to exist');
+  if (!directSignatureField) {
+    throw new Error('Expected seeded direct template signature field to exist');
  }

-  // All SIGNER recipients need a signature field for sendDocument to dispatch emails.
-  const directSignatureField = await seedSignatureFieldForRecipient({
-    envelopeId: template.id,
-    recipientId: directTemplateRecipient.id,
-    positionY: 10,
-  });
-
  const originalName = 'Signer 2';
  const originalSecondSignerEmail = seedTestEmail();

@@ -413,19 +459,13 @@ test('[DIRECT_TEMPLATES]: V2 use direct template link with 2 recipients with nex
    },
  });

-  const directTemplateRecipient = template.recipients[0];
+  // The seeded direct template already includes a signature field for the direct recipient.
+  const directSignatureField = template.fields[0];

-  if (!directTemplateRecipient) {
-    throw new Error('Expected direct template recipient to exist');
+  if (!directSignatureField) {
+    throw new Error('Expected seeded direct template signature field to exist');
  }

-  // All SIGNER recipients need a signature field for sendDocument to dispatch emails.
-  const directSignatureField = await seedSignatureFieldForRecipient({
-    envelopeId: template.id,
-    recipientId: directTemplateRecipient.id,
-    positionY: 10,
-  });
-
  const originalName = 'Signer 2';
  const originalSecondSignerEmail = seedTestEmail();

@@ -521,3 +561,48 @@ test('[DIRECT_TEMPLATES]: V2 use direct template link with 2 recipients with nex
  expect(updatedSecondRecipient.email).toBe(newSecondSignerEmail);
  await expectSigningRequestJobForRecipient(updatedSecondRecipient.id);
 });
+
+test('[DIRECT_TEMPLATES]: V1 direct template without signature fields shows invalid template page', async ({
+  page,
+}) => {
+  const { user, team } = await seedUser();
+
+  const template = await seedDirectTemplate({
+    title: 'V1 invalid direct template',
+    userId: user.id,
+    teamId: team.id,
+    createDirectRecipientSignatureField: false,
+  });
+
+  await page.goto(formatDirectTemplatePath(template.directLink?.token || ''));
+
+  await expect(page.getByRole('heading', { name: 'Invalid direct link template' })).toBeVisible();
+  await expect(page.getByText('This direct link template cannot be used because one or more signers')).toBeVisible();
+
+  // The signing flow must not render.
+  await expect(page.getByRole('heading', { name: 'General' })).not.toBeVisible();
+  await expect(page.getByRole('button', { name: 'Continue' })).not.toBeVisible();
+});
+
+test('[DIRECT_TEMPLATES]: V2 direct template without signature fields shows invalid template page', async ({
+  page,
+}) => {
+  const { user, team } = await seedUser();
+
+  const template = await seedDirectTemplate({
+    title: 'V2 invalid direct template',
+    userId: user.id,
+    teamId: team.id,
+    internalVersion: 2,
+    createDirectRecipientSignatureField: false,
+  });
+
+  await page.goto(formatDirectTemplatePath(template.directLink?.token || ''));
+
+  await expect(page.getByRole('heading', { name: 'Invalid direct link template' })).toBeVisible();
+  await expect(page.getByText('This direct link template cannot be used because one or more signers')).toBeVisible();
+
+  // The signing flow (PDF canvas) must not render.
+  await expect(page.locator('.konva-container canvas')).toHaveCount(0);
+  await expect(page.getByRole('button', { name: 'Complete' })).not.toBeVisible();
+});
@@ -0,0 +1,101 @@
+import { FIELD_SIGNATURE_META_DEFAULT_VALUES } from '@documenso/lib/types/field-meta';
+import { prisma } from '@documenso/prisma';
+import { seedTemplate } from '@documenso/prisma/seed/templates';
+import { seedUser } from '@documenso/prisma/seed/users';
+import { expect, test } from '@playwright/test';
+import { DocumentStatus, FieldType } from '@prisma/client';
+
+import { apiSignin } from '../fixtures/authentication';
+import { expectToastTextToBeVisible } from '../fixtures/generic';
+
+const seedSignatureFieldForRecipient = async (options: { envelopeId: string; recipientId: number }) => {
+  const envelopeItem = await prisma.envelopeItem.findFirstOrThrow({
+    where: { envelopeId: options.envelopeId },
+  });
+
+  return await prisma.field.create({
+    data: {
+      envelopeId: options.envelopeId,
+      envelopeItemId: envelopeItem.id,
+      recipientId: options.recipientId,
+      type: FieldType.SIGNATURE,
+      page: 1,
+      positionX: 5,
+      positionY: 10,
+      width: 20,
+      height: 5,
+      customText: '',
+      inserted: false,
+      fieldMeta: FIELD_SIGNATURE_META_DEFAULT_VALUES,
+    },
+  });
+};
+
+test('[TEMPLATE_USE]: shows missing signature fields error when sending a template without signature fields', async ({
+  page,
+}) => {
+  const { user, team } = await seedUser();
+
+  // seedTemplate creates one SIGNER recipient and no fields.
+  await seedTemplate({
+    title: 'Template missing signature fields',
+    userId: user.id,
+    teamId: team.id,
+  });
+
+  await apiSignin({
+    page,
+    email: user.email,
+    redirectPath: `/t/${team.url}/templates`,
+  });
+
+  await page.getByRole('button', { name: 'Use Template' }).click();
+  await expect(page.getByRole('heading', { name: 'Create document from template' })).toBeVisible();
+
+  // Enable distribution so the document is sent on creation.
+  await page.locator('#distributeDocument').click();
+  await page.getByRole('button', { name: 'Create and send' }).click();
+
+  await expectToastTextToBeVisible(page, 'Missing signature fields');
+  await expectToastTextToBeVisible(
+    page,
+    'The document could not be sent because some signers do not have a signature field',
+  );
+});
+
+test('[TEMPLATE_USE]: creates and sends a document when signers have signature fields', async ({ page }) => {
+  const { user, team } = await seedUser();
+
+  const template = await seedTemplate({
+    title: 'Template with signature fields',
+    userId: user.id,
+    teamId: team.id,
+  });
+
+  await seedSignatureFieldForRecipient({
+    envelopeId: template.id,
+    recipientId: template.recipients[0].id,
+  });
+
+  await apiSignin({
+    page,
+    email: user.email,
+    redirectPath: `/t/${team.url}/templates`,
+  });
+
+  await page.getByRole('button', { name: 'Use Template' }).click();
+  await expect(page.getByRole('heading', { name: 'Create document from template' })).toBeVisible();
+
+  await page.locator('#distributeDocument').click();
+  await page.getByRole('button', { name: 'Create and send' }).click();
+
+  await page.waitForURL(new RegExp(`/t/${team.url}/documents/envelope_.*`));
+
+  const envelopeId = page.url().split('/').pop()?.split('?')[0];
+
+  const envelope = await prisma.envelope.findFirstOrThrow({
+    where: { id: envelopeId },
+  });
+
+  expect(envelope.status).toBe(DocumentStatus.PENDING);
+});
@@ -18,7 +18,7 @@
    "@playwright/test": "1.56.1",
    "@types/node": "^20",
    "@types/pngjs": "^6.0.5",
-    "tsx": "^4.20.6",
+    "tsx": "^4.23.1",
    "pixelmatch": "^7.1.0",
    "pngjs": "^7.0.0"
  },
@@ -17,7 +17,7 @@
    "clean": "rimraf node_modules"
  },
  "dependencies": {
-    "@documenso/nodemailer-resend": "4.0.0",
+    "@documenso/nodemailer-resend": "5.0.0",
    "@documenso/tailwind-config": "*",
    "@react-email/body": "0.2.0",
    "@react-email/button": "0.2.0",
@@ -38,12 +38,12 @@
    "@react-email/section": "0.0.16",
    "@react-email/tailwind": "^2.0.1",
    "@react-email/text": "0.1.5",
-    "nodemailer": "^8.0.5",
+    "nodemailer": "^9.0.0",
    "react-email": "^5.0.6",
    "resend": "^6.5.2"
  },
  "devDependencies": {
    "@documenso/tsconfig": "*",
-    "@types/nodemailer": "^8.0.0"
+    "@types/nodemailer": "^8.0.1"
  }
 }
@@ -87,7 +87,7 @@ export const TemplateDocumentInvite = ({

        <Section className="mt-8 mb-6 text-center">
          <Button
-            className="inline-flex items-center justify-center rounded-lg bg-primary px-6 py-3 text-center font-medium text-primary-foreground text-sbase no-underline"
+            className="inline-flex items-center justify-center rounded-lg bg-primary px-6 py-3 text-center font-medium text-base text-primary-foreground no-underline"
            href={signDocumentLink}
          >
            {match(role)
@@ -3,6 +3,8 @@ import type { SentMessageInfo, Transport } from 'nodemailer';
 import type { Address } from 'nodemailer/lib/mailer';
 import type MailMessage from 'nodemailer/lib/mailer/mail-message';

+import { normalizeMailHeaders } from './normalize-headers';
+
 const VERSION = '1.0.0';

 type NodeMailerAddress = string | Address | Array<string | Address> | undefined;
@@ -54,6 +56,7 @@ export class MailChannelsTransport implements Transport<SentMessageInfo> {
    const mailBcc = this.toMailChannelsAddresses(mail.data.bcc);

    const [from] = this.toMailChannelsAddresses(mail.data.from);
+    const [replyTo] = this.toMailChannelsAddresses(mail.data.replyTo);

    if (!from) {
      return callback(new Error('Missing required field "from"'), null);
@@ -72,6 +75,8 @@ export class MailChannelsTransport implements Transport<SentMessageInfo> {
      headers: requestHeaders,
      body: JSON.stringify({
        from: from,
+        reply_to: replyTo,
+        headers: normalizeMailHeaders(mail.data.headers),
        subject: mail.data.subject,
        personalizations: [
          {
@@ -0,0 +1,55 @@
+import type Mail from 'nodemailer/lib/mailer';
+
+/**
+ * Normalizes nodemailer mail headers into the flat `Record<string, string>`
+ * shape accepted by HTTP email APIs such as Resend and MailChannels.
+ *
+ * Kept in sync with `toResendHeaders` in the `@documenso/nodemailer-resend`
+ * package, which applies the same normalization for the Resend transport.
+ */
+export const normalizeMailHeaders = (headers: Mail.Options['headers']): Record<string, string> | undefined => {
+  if (!headers) {
+    return undefined;
+  }
+
+  const normalized: Record<string, string> = {};
+
+  const appendHeader = (key: string, value: unknown) => {
+    if (value === null || value === undefined) {
+      return;
+    }
+
+    const stringValue = String(value);
+
+    normalized[key] = normalized[key] ? `${normalized[key]}, ${stringValue}` : stringValue;
+  };
+
+  if (Array.isArray(headers)) {
+    for (const { key, value } of headers) {
+      appendHeader(key, value);
+    }
+  } else {
+    for (const [key, value] of Object.entries(headers)) {
+      if (Array.isArray(value)) {
+        for (const item of value) {
+          appendHeader(key, item);
+        }
+
+        continue;
+      }
+
+      if (typeof value === 'object' && value !== null) {
+        appendHeader(key, value.value);
+        continue;
+      }
+
+      appendHeader(key, value);
+    }
+  }
+
+  if (Object.keys(normalized).length === 0) {
+    return undefined;
+  }
+
+  return normalized;
+};
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
David Nguyen	c872c6f9be	fix: reviewed	2026-07-28 22:10:37 +09:00
David Nguyen	c767ec9fd9	fix: reviewed	2026-07-28 21:50:18 +09:00
Lucas Smith	7f85388eb7	fix: increase global API rate limits to 1000/min (#3081 )	2026-07-21 15:58:36 +10:00
Lucas Smith	3cf2963cd0	v2.16.0	2026-07-21 15:06:36 +10:00
Catalin Pit	cc5ef3df16	feat: add branding preferences reset dialog (#3032 )	2026-07-20 16:40:25 +09:00
Catalin Pit	4b72e7d546	feat: add document preferences reset dialog (#3039 )	2026-07-20 16:02:39 +09:00
David Nguyen	ba0dead96f	fix: render error messages for invalid templates (#3088 ) Currently direct templates can be created without the required signatures fields for signers. This means that the document can be fully signed by everyone but will ultimately fail the sealing step which leaves the document in an unrecoverable state.	2026-07-20 16:57:38 +10:00
Lucas Smith	40472bc26c	fix: react hydration errors (#3099 ) Move PostHog init out of the React tree so the client tree matches the server render (mismatched useIds could abort hydration, leaving dead event handlers). Also expose the CSP nonce so Radix scroll-lock styles aren't blocked.	2026-07-16 12:21:43 +10:00
Ephraim Duncan	3ff7f70a7d	feat: redesign api tokens settings page (#3076 )	2026-07-15 12:42:13 +09:00
Lucas Smith	5c41740859	chore: deps upgrade 2026-07-14 (#3095 )	2026-07-14 23:15:45 +10:00
David Nguyen	d6268b1d7d	fix: missing noreply email for resend (#3094 )	2026-07-14 20:13:40 +09:00
Ephraim Duncan	12223c79cb	fix(ui): improve destructive button contrast in dark mode (#3071 )	2026-07-14 18:40:40 +09:00
David Nguyen	b16f979eb3	fix: improve editor autosave (#3057 )	2026-07-14 17:44:22 +09:00
Ephraim Duncan	db031e2865	fix: replace tailwind class typos	2026-07-14 17:21:30 +09:00
github-actions[bot]	4e0038f2e8	chore: extract translations (#3060 )	2026-07-14 17:16:21 +09:00
Lucas Smith	c5efd34e95	v2.15.0	2026-07-13 12:43:22 +10:00
roshboi	21cff7a727	docs: update rate limit doc for organisation limit for self hosters (#3089 )	2026-07-12 14:13:23 +08:00
Tanushree AhirandCatalin Pit	400b6a24f1	feat: enable real-time validation for email and password fields (#2204 ) ## Description This MR improves the real-time validation experience on the signup page. Currently, both the email and password fields validate only on blur, causing users to continue seeing error messages even after correcting their input until they click outside the field. This update switches the React Hook Form configuration from mode: 'onBlur' to mode: 'onChange', ensuring validations update immediately as the user types. This results in a smoother and less confusing signup experience. ## Related Issue Fixes #2200 ## Changes Made - Updated React Hook Form configuration in the signup form from: - mode: 'onBlur' ➜ mode: 'onChange' - Ensures real-time validation for email and password fields - No schema or logic changes — only validation trigger updated ## Testing Performed - Manually tested the signup page for: - Real-time password rule updates - Real-time email validation feedback - Error disappearance immediately after correcting input ## Checklist - [x] I have tested these changes locally and they work as expected. - [ ] I have added/updated tests that prove the effectiveness of these changes. - [x] I have updated the documentation to reflect these changes, if applicable. - [x] I have followed the project's coding style guidelines. - [x] I have addressed the code review feedback from the previous submission, if applicable. ## Additional Notes This is a small UX-focused improvement; the validation schema remains unchanged. Co-authored-by: Catalin Pit <catalinpit@gmail.com>	2026-07-10 13:41:31 +03:00
roshboi	1b1e3d197b	Add "Apply Your License Key" self-hosting guide (#3077 ) Adds a dedicated self-hosting page documenting how to apply an Enterprise license key, and cross-links it from the related docs. New page: self-hosting/configuration/license.mdx — "Apply Your License Key" Set NEXT_PRIVATE_DOCUMENSO_LICENSE_KEY (Docker Compose / docker run / .env tabs)	2026-07-08 16:11:49 +10:00
Lucas Smith	a276e18e1f	chore: upgrade deps (#3065 )	2026-07-08 16:11:00 +10:00