v2.5.0

API users were inadvertently sending documents without signature fields,
causing confusion for recipients and breaking their signing flows.

- Add getRecipientsWithMissingFields helper in recipients.ts
- Add server-side validation in sendDocument to block distribution
- Fix v1 API to return 400 instead of 500 for validation errors
- Consolidate UI signature field checks to use isSignatureFieldType
- Add E2E tests for both v1 and v2 APIs

.agents/plans/clear-amber-light-validate-signer-fields-on-distribute.md

@@ -0,0 +1,76 @@
+---
+date: 2026-01-26
+title: Validate Signer Fields On Distribute
+---
+
+## Summary
+
+Validate that signers have at least one signature field before allowing document/envelope distribution via API, matching the existing UI behavior.
+
+## Background
+
+The API originally allowed distributing documents/envelopes without validating that signers had signature fields assigned. This was intentional - we thought API users might have specific flows where this flexibility was needed.
+
+However, after running it this way for a while, we've observed that more often than not, API users inadvertently send documents without fields assigned. This causes confusion for their recipients (who receive a document with nothing to sign) and breaks their own systems expecting a completed signing flow.
+
+## Problem
+
+The API allowed distributing documents/envelopes even when signers had no signature fields assigned. This was inconsistent with the UI which validates this condition before allowing distribution.
+
+## Solution
+
+### 1. Create centralized validation helper
+
+**File**: `packages/lib/utils/recipients.ts`
+
+- Added `RECIPIENT_ROLES_THAT_REQUIRE_FIELDS` constant (currently only `SIGNER`)
+- Added `getRecipientsWithMissingFields()` function that returns recipients missing required fields
+- Uses existing `isSignatureFieldType` guard from `packages/prisma/guards/is-signature-field.ts`
+
+### 2. Add server-side validation
+
+**File**: `packages/lib/server-only/document/send-document.ts`
+
+- Added validation check that throws `AppError` with `INVALID_REQUEST` code when signers are missing signature fields
+- This blocks both v1 and v2 API distribution endpoints since they both use `sendDocument()`
+
+### 3. Fix v1 API error handling
+
+**File**: `packages/api/v1/implementation.ts`
+
+- Changed `sendDocument` endpoint to use `AppError.toRestAPIError(err)` instead of always returning 500
+- Now returns 400 for validation errors
+
+### 4. Update UI to use shared helper
+
+**Files**:
+
+- `apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx`
+- `packages/ui/primitives/document-flow/add-fields.tsx`
+
+### 5. Consolidate `hasSignatureField` checks
+
+Updated to use `isSignatureFieldType` guard (checks both `SIGNATURE` and `FREE_SIGNATURE`):
+
+- `apps/remix/app/components/general/document-signing/document-signing-form.tsx`
+- `apps/remix/app/components/general/envelope-signing/envelope-signer-form.tsx`
+- `apps/remix/app/components/embed/multisign/multi-sign-document-signing-view.tsx`
+- `apps/remix/app/components/embed/embed-direct-template-client-page.tsx`
+- `apps/remix/app/components/embed/embed-document-signing-page-v1.tsx`
+
+### 6. Add E2E tests
+
+**Files**:
+
+- `packages/app-tests/e2e/api/v1/document-sending.spec.ts` - 5 new tests
+- `packages/app-tests/e2e/api/v2/distribute-validation.spec.ts` - 8 new tests
+
+## Test Coverage
+
+- Distribution fails when signer has no fields
+- Distribution fails when signer has only non-signature fields
+- Distribution succeeds with SIGNATURE field
+- Distribution succeeds with FREE_SIGNATURE field (v1 only via Prisma)
+- Distribution succeeds when VIEWER/CC/APPROVER have no fields
+- Distribution fails when one of multiple signers is missing signature field
+- Distribution succeeds when all signers have signature fields

.agents/plans/swift-pink-sky-simplewebauthn-v13-upgrade.md

@@ -0,0 +1,186 @@
+---
+date: 2026-01-14
+title: Simplewebauthn V13 Upgrade
+---
+
+## Overview
+
+Upgrade SimpleWebAuthn packages from v9.x to v13.x to address the deprecation of `@simplewebauthn/types` and take advantage of new features and improvements.
+
+## Current State
+
+The codebase currently uses:
+- `@simplewebauthn/browser@9.x`
+- `@simplewebauthn/server@9.x`
+- `@simplewebauthn/types@9.x`
+
+## Breaking Changes Summary (v9 → v13)
+
+### v10.0.0 Breaking Changes
+1. **Minimum Node version raised to Node v20**
+2. **`generateRegistrationOptions()` now expects `Base64URLString` for `excludeCredentials` IDs** (no more `type: 'public-key'` needed)
+3. **`generateAuthenticationOptions()` now expects `Base64URLString` for `allowCredentials` IDs**
+4. **`credentialID` returned from verification methods is now `Base64URLString`** instead of `Uint8Array`
+5. **`AuthenticatorDevice.credentialID` is now `Base64URLString`**
+6. **`rpID` is now required when calling `generateAuthenticationOptions()`**
+7. **`generateRegistrationOptions()` will generate random user IDs** if not provided
+8. **`user.id` is treated as base64url string in `startRegistration()`**
+9. **`userHandle` is treated as base64url string in `startAuthentication()`**
+
+### v11.0.0 Breaking Changes
+1. **Positional arguments in `startRegistration()` and `startAuthentication()` replaced by object**
+   - Before: `startRegistration(options)`
+   - After: `startRegistration({ optionsJSON: options })`
+   - Before: `startAuthentication(options)`
+   - After: `startAuthentication({ optionsJSON: options })`
+2. **`AuthenticatorDevice` type renamed to `WebAuthnCredential`**
+   - `credentialID` → `credential.id`
+   - `credentialPublicKey` → `credential.publicKey`
+3. **`verifyRegistrationResponse()` returns `registrationInfo.credential` instead of individual properties**
+   - `credentialID` → `credential.id`
+   - `credentialPublicKey` → `credential.publicKey`
+   - `counter` → `credential.counter`
+   - `transports` are now in `credential.transports`
+4. **`verifyAuthenticationResponse()` uses `credential` argument instead of `authenticator`**
+
+### v13.0.0 Breaking Changes
+1. **`@simplewebauthn/types` package is retired**
+   - Types are now exported from `@simplewebauthn/browser` and `@simplewebauthn/server`
+   - Import types from `@simplewebauthn/server` instead
+
+## Files to Update
+
+### Package Changes
+1. Remove `@simplewebauthn/types` dependency
+2. Update `@simplewebauthn/browser` to `^13.2.2`
+3. Update `@simplewebauthn/server` to `^13.2.2`
+
+### Server-side Files
+
+#### 1. `packages/lib/server-only/auth/create-passkey-registration-options.ts`
+- Change import from `@simplewebauthn/types` to `@simplewebauthn/server`
+- Remove `type: 'public-key'` from `excludeCredentials` items
+- Update `userID` to use `isoUint8Array.fromUTF8String()` for proper encoding
+
+#### 2. `packages/lib/server-only/auth/create-passkey-authentication-options.ts`
+- Change import from `@simplewebauthn/types` to `@simplewebauthn/server`
+- Remove `type: 'public-key'` from `allowCredentials` items
+
+#### 3. `packages/lib/server-only/auth/create-passkey-signin-options.ts`
+- No changes needed (already using correct options)
+
+#### 4. `packages/lib/server-only/auth/create-passkey.ts`
+- Change import from `@simplewebauthn/types` to `@simplewebauthn/server`
+- Update to use new `registrationInfo.credential` structure:
+  - `credentialID` → `credential.id`
+  - `credentialPublicKey` → `credential.publicKey`
+  - `counter` → `credential.counter`
+- Note: `credential.id` is now a `Base64URLString`, so `Buffer.from(credentialID)` needs updating
+
+#### 5. `packages/lib/server-only/document/is-recipient-authorized.ts`
+- Update `verifyAuthenticationResponse()` to use `credential` instead of `authenticator`:
+  - Change `authenticator: { credentialID, credentialPublicKey, counter }` to `credential: { id, publicKey, counter }`
+- Since `credential.id` is now base64url string, convert stored `credentialId` buffer to base64url
+
+#### 6. `packages/auth/server/routes/passkey.ts`
+- Update `verifyAuthenticationResponse()` to use `credential` instead of `authenticator`
+- Same changes as `is-recipient-authorized.ts`
+
+#### 7. `packages/trpc/server/auth-router/create-passkey.ts`
+- Change import from `@simplewebauthn/types` to `@simplewebauthn/server`
+
+### Browser-side Files
+
+#### 8. `apps/remix/app/components/dialogs/passkey-create-dialog.tsx`
+- Update `startRegistration()` call:
+  - Before: `startRegistration(passkeyRegistrationOptions)`
+  - After: `startRegistration({ optionsJSON: passkeyRegistrationOptions })`
+
+#### 9. `apps/remix/app/components/forms/signin.tsx`
+- Update `startAuthentication()` call:
+  - Before: `startAuthentication(options)`
+  - After: `startAuthentication({ optionsJSON: options })`
+
+#### 10. `apps/remix/app/components/general/document-signing/document-signing-auth-passkey.tsx`
+- Update `startAuthentication()` call:
+  - Before: `startAuthentication(options)`
+  - After: `startAuthentication({ optionsJSON: options })`
+
+### Database/Schema Considerations
+
+The database stores `credentialId` as `Bytes`. The new API returns `credential.id` as `Base64URLString`. We need to:
+1. When **storing** a new passkey: Convert from `Base64URLString` to `Buffer`
+2. When **passing to verification**: Convert from `Buffer` to `Base64URLString`
+
+Use `isoBase64URL` helper from `@simplewebauthn/server/helpers` for these conversions.
+
+## Implementation Steps
+
+### Step 1: Update package.json dependencies
+```bash
+npm uninstall @simplewebauthn/types
+npm install @simplewebauthn/browser@^13.2.2 @simplewebauthn/server@^13.2.2
+```
+
+### Step 2: Update type imports
+Replace all `@simplewebauthn/types` imports with `@simplewebauthn/server`
+
+### Step 3: Update browser-side API calls
+- `startRegistration(options)` → `startRegistration({ optionsJSON: options })`
+- `startAuthentication(options)` → `startAuthentication({ optionsJSON: options })`
+
+### Step 4: Update server-side registration
+- Update `excludeCredentials` format (remove `type: 'public-key'`)
+- Update `userID` encoding if needed
+- Update `verifyRegistrationResponse()` result handling for new `credential` structure
+
+### Step 5: Update server-side authentication
+- Update `allowCredentials` format (remove `type: 'public-key'`)
+- Update `verifyAuthenticationResponse()` to use `credential` instead of `authenticator`
+- Handle `Base64URLString` for `credential.id`
+
+### Step 6: Update credential storage/retrieval
+- When storing: Convert `Base64URLString` to `Buffer`
+- When reading: Convert `Buffer` to `Base64URLString`
+
+### Step 7: Test passkey flows
+1. Test passkey creation
+2. Test passkey sign-in
+3. Test passkey authentication for document signing
+4. Test passkey deletion
+
+## Code Examples
+
+### Converting stored Buffer to Base64URLString for verification
+```typescript
+import { isoBase64URL } from '@simplewebauthn/server/helpers';
+
+// When reading from database (Buffer) and passing to verification
+const credential = {
+  id: isoBase64URL.fromBuffer(passkey.credentialId),
+  publicKey: new Uint8Array(passkey.credentialPublicKey),
+  counter: Number(passkey.counter),
+  transports: passkey.transports,
+};
+```
+
+### Converting Base64URLString to Buffer for storage
+```typescript
+import { isoBase64URL } from '@simplewebauthn/server/helpers';
+
+// When storing from registration response
+const credentialIdBuffer = Buffer.from(
+  isoBase64URL.toBuffer(registrationInfo.credential.id)
+);
+```
+
+## Risks and Mitigations
+
+1. **Database compatibility**: The `credentialId` is stored as `Bytes` in the database. The new API uses `Base64URLString`. We need proper conversion functions.
+   - **Mitigation**: Use `isoBase64URL.fromBuffer()` and `isoBase64URL.toBuffer()` for conversions
+
+2. **Existing passkeys**: Existing passkeys should continue to work as long as conversion is done correctly.
+   - **Mitigation**: Test with existing passkeys after upgrade
+
+3. **Browser compatibility**: v10+ requires newer browser APIs.
+   - **Mitigation**: `browserSupportsWebAuthn()` already handles this check

.env.example

@@ -59,6 +59,18 @@ NEXT_PRIVATE_SIGNING_GCLOUD_HSM_PUBLIC_CRT_FILE_PATH=
 NEXT_PRIVATE_SIGNING_GCLOUD_HSM_PUBLIC_CRT_FILE_CONTENTS=
 # OPTIONAL: The path to the Google Cloud Credentials file to use for the gcloud-hsm signing transport.
 NEXT_PRIVATE_SIGNING_GCLOUD_APPLICATION_CREDENTIALS_CONTENTS=
+# OPTIONAL: The path to the certificate chain file for the gcloud-hsm signing transport.
+NEXT_PRIVATE_SIGNING_GCLOUD_HSM_CERT_CHAIN_FILE_PATH=
+# OPTIONAL: The base64-encoded contents of the certificate chain for the gcloud-hsm signing transport.
+NEXT_PRIVATE_SIGNING_GCLOUD_HSM_CERT_CHAIN_CONTENTS=
+# OPTIONAL: The Google Secret Manager path to retrieve the certificate for the gcloud-hsm signing transport.
+NEXT_PRIVATE_SIGNING_GCLOUD_HSM_SECRET_MANAGER_CERT_PATH=
+# OPTIONAL: Comma-separated list of timestamp authority URLs for PDF signing (enables LTV and archival timestamps).
+NEXT_PRIVATE_SIGNING_TIMESTAMP_AUTHORITY=
+# OPTIONAL: Contact info to embed in PDF signatures. Defaults to the webapp URL.
+NEXT_PUBLIC_SIGNING_CONTACT_INFO=
+# OPTIONAL: Set to "true" to use the legacy adbe.pkcs7.detached subfilter instead of ETSI.CAdES.detached.
+NEXT_PRIVATE_USE_LEGACY_SIGNING_SUBFILTER=
 
 # [[STORAGE]]
 # OPTIONAL: Defines the storage transport to use. Available options: database (default) | s3

.opencode/commands/commit.md

@@ -0,0 +1,80 @@
+---
+description: Add and commit changes using conventional commits
+allowed-tools: Bash, Read, Glob, Grep
+---
+
+Create a git commit for the current changes using the Conventional Commits standard.
+
+## Process
+
+1. **Analyze the changes** by running:
+   - `git status` to see all modified/untracked files
+   - `git diff` to see unstaged changes
+   - `git diff --staged` to see already-staged changes
+   - `git log --oneline -5` to see recent commit style
+
+2. **Stage appropriate files**:
+   - Stage all related changes with `git add`
+   - Do NOT stage files that appear to contain secrets (.env, credentials, API keys, tokens)
+   - If you detect potential secrets, warn the user and skip those files
+
+3. **Determine the commit type** based on the changes:
+   - `feat`: New feature or capability
+   - `fix`: Bug fix
+   - `docs`: Documentation only
+   - `style`: Formatting, whitespace (not CSS)
+   - `refactor`: Code restructuring without behavior change
+   - `perf`: Performance improvement
+   - `test`: Adding or updating tests
+   - `build`: Build system or dependencies
+   - `ci`: CI/CD configuration
+   - `chore`: Maintenance tasks, tooling, config
+
+   NOTE: Do not use a scope for commits
+
+4. **Write the commit message**:
+   - **Subject line**: `<type>: <description>`
+     - Use imperative mood ("add" not "added")
+     - Lowercase, no period at end
+     - Max 50 characters if possible, 72 hard limit
+   - **Body** (if needed): Explain _why_, not _what_
+     - Wrap at 72 characters
+     - Separate from subject with blank line
+
+## Commit Format
+
+```
+<type>[scope]: <subject>
+
+[optional body explaining WHY this change was made]
+```
+
+## Examples
+
+Simple change:
+
+```
+fix: handle empty input in parser without throwing
+```
+
+With body:
+
+```
+feat: add streaming response support
+
+Large responses were causing memory issues in production.
+Streaming allows processing chunks incrementally.
+```
+
+## Rules
+
+- NEVER commit files that may contain secrets
+- NEVER use `git commit --amend` unless the user explicitly requests it
+- NEVER use `--no-verify` to skip hooks
+- If the pre-commit hook fails, fix the issues and create a NEW commit
+- If there are no changes to commit, inform the user and stop
+- Use a HEREDOC to pass the commit message to ensure proper formatting
+
+## Execute
+
+Run the git commands to analyze, stage, and commit the changes now.

.opencode/commands/continue.md

@@ -0,0 +1,112 @@
+---
+description: Continue implementing a spec from a previous session
+argument-hint: <spec-file-path>
+---
+
+You are continuing implementation of a specification that was started in a previous session. Work autonomously until the feature is complete and tests pass.
+
+## Your Task
+
+1. **Read the spec** at `$ARGUMENTS`
+2. **Read CODE_STYLE.md** for formatting conventions
+3. **Assess current state**:
+   - Check git status for uncommitted changes
+   - Run tests to see what's passing/failing (if E2E tests exist)
+   - Review any existing implementation
+4. **Determine what remains** by comparing the spec to the current state
+5. **Plan remaining work** using TodoWrite
+6. **Continue implementing** until complete
+
+## Assessing Current State
+
+Run these commands to understand where the previous session left off:
+
+```bash
+git status                                    # See uncommitted changes
+git log --oneline -10                         # See recent commits
+npm run typecheck -w @documenso/remix         # Check for type errors
+npm run lint:fix                              # Check for linting issues
+```
+
+Review the code that's already been written to understand:
+
+- What's already implemented
+- What's partially done
+- What's not started yet
+
+## Implementation Guidelines
+
+### During Implementation
+
+- Follow CODE_STYLE.md strictly (2-space indent, double quotes, braces always, etc.)
+- Follow workspace rules for TypeScript, React, TRPC patterns, and Remix conventions
+- Mark todos complete as you finish each task
+- Commit logical chunks of work
+
+### Code Quality
+
+- No stubbed implementations
+- Handle edge cases and error conditions
+- Include descriptive error messages with context
+- Use async/await for all I/O operations
+- Use AppError class when throwing errors
+- Use Zod for validation and react-hook-form for forms
+
+### Testing
+
+**Important**: E2E tests are time-consuming. Only write tests for non-trivial functionality.
+
+- Write E2E tests in `packages/app-tests/e2e/` using Playwright
+- Test critical user flows and edge cases
+- Follow existing E2E test patterns in the codebase
+- Use descriptive test names that explain what is being tested
+- Skip tests for trivial changes (simple UI tweaks, minor refactors, etc.)
+
+## Autonomous Workflow
+
+Work continuously through these steps:
+
+1. **Implement** - Write the code for the current task
+2. **Typecheck** - Run `npm run typecheck -w @documenso/remix` to verify types
+3. **Lint** - Run `npm run lint:fix` to fix linting issues
+4. **Test** - If non-trivial, run E2E tests: `npm run test:dev -w @documenso/app-tests`
+5. **Fix** - If tests fail, fix and re-run
+6. **Repeat** - Move to next task
+
+## Stopping Conditions
+
+**Stop and report success when:**
+
+- All spec requirements are implemented
+- Typecheck passes
+- Lint passes
+- E2E tests pass (if written for non-trivial functionality)
+
+**Stop and ask for help when:**
+
+- The spec is ambiguous and you need clarification
+- You encounter a blocking issue you cannot resolve
+- You need to make a decision that significantly deviates from the spec
+- External dependencies are missing
+
+## Commands
+
+```bash
+# Type checking
+npm run typecheck -w @documenso/remix
+
+# Linting
+npm run lint:fix
+
+# E2E Tests (only for non-trivial work)
+npm run test:dev -w @documenso/app-tests              # Run E2E tests in dev mode
+npm run test-ui:dev -w @documenso/app-tests            # Run E2E tests with UI
+npm run test:e2e                                       # Run full E2E test suite
+
+# Development
+npm run dev                                            # Start dev server
+```
+
+## Begin
+
+Read the spec file and CODE_STYLE.md, assess the current implementation state, then continue where the previous session left off. Use TodoWrite to track your progress throughout.

.opencode/commands/create-justification.md

@@ -0,0 +1,75 @@
+---
+description: Create a new justification file in .agents/justifications/
+argument-hint: <justification-slug> [content]
+---
+
+You are creating a new justification file in the `.agents/justifications/` directory.
+
+## Your Task
+
+1. **Determine the slug** - Use `$ARGUMENTS` as the file slug (kebab-case recommended)
+2. **Gather content** - Collect or generate the justification content
+3. **Create the file** - Use the create-justification script to generate the file
+
+## Usage
+
+The script will automatically:
+- Generate a unique three-word ID (e.g., `swift-emerald-river`)
+- Create frontmatter with current date and formatted title
+- Save the file as `{id}-{slug}.md` in `.agents/justifications/`
+
+## Creating the File
+
+### Option 1: Direct Content
+
+If you have the content ready, run:
+
+```bash
+npx tsx scripts/create-justification.ts "$ARGUMENTS" "Your justification content here"
+```
+
+### Option 2: Multi-line Content (Heredoc)
+
+For multi-line content, use heredoc:
+
+```bash
+npx tsx scripts/create-justification.ts "$ARGUMENTS" << HEREDOC
+Your multi-line
+justification content
+goes here
+HEREDOC
+```
+
+### Option 3: Pipe Content
+
+You can also pipe content:
+
+```bash
+echo "Your content" | npx tsx scripts/create-justification.ts "$ARGUMENTS"
+```
+
+## File Format
+
+The created file will have:
+
+```markdown
+---
+date: 2026-01-13
+title: Justification Title
+---
+
+Your content here
+```
+
+The title is automatically formatted from the slug (e.g., `architecture-decision` → `Architecture Decision`).
+
+## Guidelines
+
+- Use descriptive slugs in kebab-case (e.g., `tech-stack-choice`, `api-design-rationale`)
+- Include clear reasoning and context for the decision
+- The unique ID ensures no filename conflicts
+- Files are automatically dated for organization
+
+## Begin
+
+Create a justification file using the slug from `$ARGUMENTS` and appropriate content documenting the reasoning or justification.

.opencode/commands/create-plan.md

@@ -0,0 +1,76 @@
+---
+description: Create a new plan file in .agents/plans/
+argument-hint: <plan-slug> [content]
+---
+
+You are creating a new plan file in the `.agents/plans/` directory.
+
+## Your Task
+
+1. **Determine the slug** - Use `$ARGUMENTS` as the file slug (kebab-case recommended)
+2. **Gather content** - Collect or generate the plan content
+3. **Create the file** - Use the create-plan script to generate the file
+
+## Usage
+
+The script will automatically:
+
+- Generate a unique three-word ID (e.g., `happy-blue-moon`)
+- Create frontmatter with current date and formatted title
+- Save the file as `{id}-{slug}.md` in `.agents/plans/`
+
+## Creating the File
+
+### Option 1: Direct Content
+
+If you have the content ready, run:
+
+```bash
+npx tsx scripts/create-plan.ts "$ARGUMENTS" "Your plan content here"
+```
+
+### Option 2: Multi-line Content (Heredoc)
+
+For multi-line content, use heredoc:
+
+```bash
+npx tsx scripts/create-plan.ts "$ARGUMENTS" << HEREDOC
+Your multi-line
+plan content
+goes here
+HEREDOC
+```
+
+### Option 3: Pipe Content
+
+You can also pipe content:
+
+```bash
+echo "Your content" | npx tsx scripts/create-plan.ts "$ARGUMENTS"
+```
+
+## File Format
+
+The created file will have:
+
+```markdown
+---
+date: 2026-01-13
+title: Plan Title
+---
+
+Your content here
+```
+
+The title is automatically formatted from the slug (e.g., `my-feature` → `My Feature`).
+
+## Guidelines
+
+- Use descriptive slugs in kebab-case (e.g., `user-authentication`, `api-integration`)
+- Include clear, actionable plan content
+- The unique ID ensures no filename conflicts
+- Files are automatically dated for organization
+
+## Begin
+
+Create a plan file using the slug from `$ARGUMENTS` and appropriate content for the planning task.

.opencode/commands/create-scratch.md

@@ -0,0 +1,75 @@
+---
+description: Create a new scratch file in .agents/scratches/
+argument-hint: <scratch-slug> [content]
+---
+
+You are creating a new scratch file in the `.agents/scratches/` directory.
+
+## Your Task
+
+1. **Determine the slug** - Use `$ARGUMENTS` as the file slug (kebab-case recommended)
+2. **Gather content** - Collect or generate the scratch content
+3. **Create the file** - Use the create-scratch script to generate the file
+
+## Usage
+
+The script will automatically:
+- Generate a unique three-word ID (e.g., `calm-teal-cloud`)
+- Create frontmatter with current date and formatted title
+- Save the file as `{id}-{slug}.md` in `.agents/scratches/`
+
+## Creating the File
+
+### Option 1: Direct Content
+
+If you have the content ready, run:
+
+```bash
+npx tsx scripts/create-scratch.ts "$ARGUMENTS" "Your scratch content here"
+```
+
+### Option 2: Multi-line Content (Heredoc)
+
+For multi-line content, use heredoc:
+
+```bash
+npx tsx scripts/create-scratch.ts "$ARGUMENTS" << HEREDOC
+Your multi-line
+scratch content
+goes here
+HEREDOC
+```
+
+### Option 3: Pipe Content
+
+You can also pipe content:
+
+```bash
+echo "Your content" | npx tsx scripts/create-scratch.ts "$ARGUMENTS"
+```
+
+## File Format
+
+The created file will have:
+
+```markdown
+---
+date: 2026-01-13
+title: Scratch Title
+---
+
+Your content here
+```
+
+The title is automatically formatted from the slug (e.g., `quick-notes` → `Quick Notes`).
+
+## Guidelines
+
+- Use descriptive slugs in kebab-case (e.g., `exploration-ideas`, `temporary-notes`)
+- Scratch files are for temporary notes, explorations, or ideas
+- The unique ID ensures no filename conflicts
+- Files are automatically dated for organization
+
+## Begin
+
+Create a scratch file using the slug from `$ARGUMENTS` and appropriate content for notes or exploration.

.opencode/commands/document.md

@@ -0,0 +1,201 @@
+---
+description: Generate MDX documentation for a module or feature
+argument-hint: <module-path-or-feature>
+---
+
+You are creating proper MDX documentation for a module or feature in Documenso using Nextra.
+
+## Your Task
+
+1. **Identify the scope** - What does `$ARGUMENTS` refer to? (file, directory, or feature name)
+2. **Read the source code** - Understand the public API, types, and behavior
+3. **Read existing docs** - Check if there's documentation to update or reference
+4. **Write comprehensive documentation** - Create or update MDX docs in the appropriate location
+5. **Update navigation** - Add entry to `_meta.js` if creating a new page
+
+## Documentation Structure
+
+Create documentation in the appropriate location:
+
+- **Developer docs**: `apps/documentation/pages/developers/`
+- **User docs**: `apps/documentation/pages/users/`
+
+### File Format
+
+All documentation files must be `.mdx` files with frontmatter:
+
+```mdx
+---
+title: Page Title
+description: Brief description for SEO and meta tags
+---
+
+# Page Title
+
+Content starts here...
+```
+
+### Navigation
+
+Each directory should have a `_meta.js` file that defines the navigation structure:
+
+```javascript
+export default {
+  index: 'Introduction',
+  'feature-name': 'Feature Name',
+  'another-feature': 'Another Feature',
+};
+```
+
+If creating a new page, add it to the appropriate `_meta.js` file.
+
+### Documentation Format
+
+````mdx
+---
+title: <Module|Feature Name>
+description: Brief description of what this does and when to use it
+---
+
+# <Module|Feature Name>
+
+Brief description of what this module/feature does and when to use it.
+
+## Installation
+
+If there are specific packages or imports needed:
+
+```bash
+npm install @documenso/package-name
+```
+
+## Quick Start
+
+```jsx
+// Minimal working example
+import { Component } from '@documenso/package';
+
+const Example = () => {
+  return <Component />;
+};
+```
+
+## API Reference
+
+### Component/Function Name
+
+Description of what it does.
+
+#### Props/Parameters
+
+| Prop/Param | Type                 | Description               |
+| ---------- | -------------------- | ------------------------- |
+| prop       | `string`             | Description of the prop   |
+| optional   | `boolean` (optional) | Optional prop description |
+
+#### Example
+
+```jsx
+import { Component } from '@documenso/package';
+
+<Component prop="value" optional={true} />;
+```
+
+### Types
+
+#### `TypeName`
+
+```typescript
+type TypeName = {
+  property: string;
+  optional?: boolean;
+};
+```
+
+## Examples
+
+### Common Use Case
+
+```jsx
+// Full working example
+```
+
+### Advanced Usage
+
+```jsx
+// More complex example
+```
+
+## Related
+
+- [Link to related documentation](/developers/path)
+- [Another related page](/users/path)
+````
+
+## Guidelines
+
+### Content Quality
+
+- **Be accurate** - Verify behavior by reading the code
+- **Be complete** - Document all public API surface
+- **Be practical** - Include real, working examples
+- **Be concise** - Don't over-explain obvious things
+- **Be user-focused** - Write for the target audience (developers or users)
+
+### Code Examples
+
+- Use appropriate language tags: `jsx`, `tsx`, `typescript`, `bash`, `json`
+- Show imports when not obvious
+- Include expected output in comments where helpful
+- Progress from simple to complex
+- Use real examples from the codebase when possible
+
+### Formatting
+
+- Always include frontmatter with `title` and `description`
+- Use proper markdown headers (h1 for title, h2 for sections)
+- Use tables for props/parameters documentation (matching existing style)
+- Use code fences with appropriate language tags
+- Use Nextra components when appropriate:
+  - `<Callout type="info">` for notes
+  - `<Steps>` for step-by-step instructions
+- Use relative links for internal documentation (e.g., `/developers/embedding/react`)
+
+### Nextra Components
+
+You can import and use Nextra components:
+
+```jsx
+import { Callout, Steps } from 'nextra/components';
+
+<Callout type="info">
+  This is an informational note.
+</Callout>
+
+<Steps>
+  <Steps.Step>First step</Steps.Step>
+  <Steps.Step>Second step</Steps.Step>
+</Steps>
+```
+
+### Maintenance
+
+- Include types inline so docs don't get stale
+- Reference source file locations for complex behavior
+- Keep examples up-to-date with the codebase
+- Update `_meta.js` when adding new pages
+
+## Process
+
+1. **Explore the code** - Read source files to understand the API
+2. **Identify the audience** - Is this for developers or users?
+3. **Check existing docs** - Look for similar pages to match style
+4. **Draft the structure** - Outline sections before writing
+5. **Write content** - Fill in each section with frontmatter
+6. **Add examples** - Create working code samples
+7. **Update navigation** - Add to `_meta.js` if needed
+8. **Review** - Read through for clarity and accuracy
+
+## Begin
+
+Analyze `$ARGUMENTS`, read the relevant source code, check existing documentation patterns, and create comprehensive MDX documentation following the Documenso documentation style.

.opencode/commands/implement.md

@@ -0,0 +1,100 @@
+---
+description: Implement a spec from the plans directory
+argument-hint: <spec-file-path>
+---
+
+You are implementing a specification from the `.agents/plans/` directory. Work autonomously until the feature is complete and tests pass.
+
+## Your Task
+
+1. **Read the spec** at `$ARGUMENTS`
+2. **Read CODE_STYLE.md** for formatting conventions
+3. **Plan the implementation** using the TodoWrite tool to break down the work
+4. **Implement the feature** following the spec and code style
+5. **Write E2E tests** only for non-trivial functionality (E2E tests are time-consuming)
+6. **Run tests** and fix any failures
+7. **Run typecheck and lint** and fix any issues
+
+## Implementation Guidelines
+
+### Before Coding
+
+- Understand the spec's goals and scope
+- Identify the desired API from usage examples in the spec
+- Review related existing code to understand patterns
+- Break the work into discrete tasks using TodoWrite
+
+### During Implementation
+
+- Follow CODE_STYLE.md strictly (2-space indent, double quotes, braces always, etc.)
+- Follow workspace rules for TypeScript, React, TRPC patterns, and Remix conventions
+- Mark todos complete as you finish each task
+- Commit logical chunks of work
+
+### Code Quality
+
+- No stubbed implementations
+- Handle edge cases and error conditions
+- Include descriptive error messages with context
+- Use async/await for all I/O operations
+- Use AppError class when throwing errors
+- Use Zod for validation and react-hook-form for forms
+
+### Testing
+
+**Important**: E2E tests are time-consuming. Only write tests for non-trivial functionality.
+
+- Write E2E tests in `packages/app-tests/e2e/` using Playwright
+- Test critical user flows and edge cases
+- Follow existing E2E test patterns in the codebase
+- Use descriptive test names that explain what is being tested
+- Skip tests for trivial changes (simple UI tweaks, minor refactors, etc.)
+
+## Autonomous Workflow
+
+Work continuously through these steps:
+
+1. **Implement** - Write the code for the current task
+2. **Typecheck** - Run `npm run typecheck -w @documenso/remix` to verify types
+3. **Lint** - Run `npm run lint:fix` to fix linting issues
+4. **Test** - If non-trivial, run E2E tests: `npm run test:dev -w @documenso/app-tests`
+5. **Fix** - If tests fail, fix and re-run
+6. **Repeat** - Move to next task
+
+## Stopping Conditions
+
+**Stop and report success when:**
+
+- All spec requirements are implemented
+- Typecheck passes
+- Lint passes
+- E2E tests pass (if written for non-trivial functionality)
+
+**Stop and ask for help when:**
+
+- The spec is ambiguous and you need clarification
+- You encounter a blocking issue you cannot resolve
+- You need to make a decision that significantly deviates from the spec
+- External dependencies are missing
+
+## Commands
+
+```bash
+# Type checking
+npm run typecheck -w @documenso/remix
+
+# Linting
+npm run lint:fix
+
+# E2E Tests (only for non-trivial work)
+npm run test:dev -w @documenso/app-tests              # Run E2E tests in dev mode
+npm run test-ui:dev -w @documenso/app-tests            # Run E2E tests with UI
+npm run test:e2e                                       # Run full E2E test suite
+
+# Development
+npm run dev                                            # Start dev server
+```
+
+## Begin
+
+Read the spec file and CODE_STYLE.md, then start implementing. Use TodoWrite to track your progress throughout.

.opencode/commands/interview.md

@@ -0,0 +1,57 @@
+---
+description: Deep-dive interview to flesh out a spec or design document
+agent: build
+argument-hint: <file-path>
+---
+
+You are conducting a thorough interview to help flesh out and complete a specification or design document.
+
+## Your Task
+
+1. **Read the document** at `$ARGUMENTS`
+2. **Analyze it deeply** - identify gaps, ambiguities, unexplored edge cases, and areas needing clarification
+3. **Interview the user** by providing a question with some pre-determined options
+4. **Write the completed spec** back to the file when the interview is complete
+
+## Interview Guidelines
+
+### Question Quality
+- Ask **non-obvious, insightful questions** - avoid surface-level queries
+- Focus on: technical implementation details, architectural decisions, edge cases, error handling, UX implications, security considerations, performance tradeoffs, integration points, migration strategies, rollback plans
+- Each question should reveal something that would otherwise be missed
+- Challenge assumptions embedded in the document
+- Explore second and third-order consequences of design decisions
+- Use the Web Search and other tools where required to ground questions (e.g. package recommendations)
+
+### Question Strategy
+- Start by identifying the 3-5 most critical unknowns or ambiguities
+- Use the AskUserQuestion tool with well-crafted options that represent real tradeoffs
+- When appropriate, offer multiple valid approaches with their pros/cons as options
+- Don't ask about things that are already clearly specified
+- Probe deeper when answers reveal new areas of uncertainty
+
+### Topics to Explore (as relevant)
+- **Technical**: Data models, API contracts, state management, concurrency, caching, validation
+- **UX**: Error states, loading states, empty states, edge cases, accessibility, mobile considerations
+- **Operations**: Deployment, monitoring, alerting, debugging, logging, feature flags
+- **Security**: Auth, authz, input validation, rate limiting, audit trails
+- **Scale**: Performance bottlenecks, data growth, traffic spikes, graceful degradation
+- **Integration**: Dependencies, backwards compatibility, versioning, migration path
+- **Failure modes**: What happens when X fails? How do we recover? What's the blast radius?
+
+### Interview Flow
+1. Ask 2-4 questions at a time (use multiple questions in one when they're related)
+2. After each round, incorporate answers and identify follow-up questions
+3. Continue until all critical areas are addressed
+4. Signal when you believe the interview is complete, but offer to go deeper
+
+## Output
+
+When the interview is complete:
+1. Synthesize all gathered information
+2. Rewrite/expand the original document with the new details
+3. Preserve the document's original structure where sensible, but reorganize if needed
+4. Add new sections for areas that weren't originally covered
+5. Write the completed spec back to `$ARGUMENTS`
+
+Begin by reading the file and identifying your first set of deep questions.

.opencode/skill/create-justification/SKILL.md

@@ -0,0 +1,56 @@
+---
+name: create-justification
+description: Create a new justification file in .agents/justifications/ with a unique three-word ID, frontmatter, and formatted title
+license: MIT
+compatibility: opencode
+metadata:
+  audience: agents
+  workflow: decision-making
+---
+
+## What I do
+
+I help you create new justification files in the `.agents/justifications/` directory. Each justification file gets:
+
+- A unique three-word identifier (e.g., `swift-emerald-river`)
+- Frontmatter with the current date and formatted title
+- Content you provide
+
+## How to use
+
+Run the script with a slug and content:
+
+```bash
+npx tsx scripts/create-justification.ts "decision-name" "Justification content here"
+```
+
+Or use heredoc for multi-line content:
+
+```bash
+npx tsx scripts/create-justification.ts "decision-name" << HEREDOC
+Multi-line
+justification content
+goes here
+HEREDOC
+```
+
+## File format
+
+Files are created as: `{three-word-id}-{slug}.md`
+
+Example: `swift-emerald-river-decision-name.md`
+
+The file includes frontmatter:
+
+```markdown
+---
+date: 2026-01-13
+title: Decision Name
+---
+
+Your content here
+```
+
+## When to use me
+
+Use this skill when you need to document the reasoning or justification for a decision, approach, or architectural choice. The unique ID ensures no filename conflicts, and the frontmatter provides metadata for organization.

.opencode/skill/create-plan/SKILL.md

@@ -0,0 +1,56 @@
+---
+name: create-plan
+description: Create a new plan file in .agents/plans/ with a unique three-word ID, frontmatter, and formatted title
+license: MIT
+compatibility: opencode
+metadata:
+  audience: agents
+  workflow: planning
+---
+
+## What I do
+
+I help you create new plan files in the `.agents/plans/` directory. Each plan file gets:
+
+- A unique three-word identifier (e.g., `happy-blue-moon`)
+- Frontmatter with the current date and formatted title
+- Content you provide
+
+## How to use
+
+Run the script with a slug and content:
+
+```bash
+npx tsx scripts/create-plan.ts "feature-name" "Plan content here"
+```
+
+Or use heredoc for multi-line content:
+
+```bash
+npx tsx scripts/create-plan.ts "feature-name" << HEREDOC
+Multi-line
+plan content
+goes here
+HEREDOC
+```
+
+## File format
+
+Files are created as: `{three-word-id}-{slug}.md`
+
+Example: `happy-blue-moon-feature-name.md`
+
+The file includes frontmatter:
+
+```markdown
+---
+date: 2026-01-13
+title: Feature Name
+---
+
+Your content here
+```
+
+## When to use me
+
+Use this skill when you need to create a new plan document for a feature, task, or project. The unique ID ensures no filename conflicts, and the frontmatter provides metadata for organization.

.opencode/skill/create-scratch/SKILL.md

@@ -0,0 +1,56 @@
+---
+name: create-scratch
+description: Create a new scratch file in .agents/scratches/ with a unique three-word ID, frontmatter, and formatted title
+license: MIT
+compatibility: opencode
+metadata:
+  audience: agents
+  workflow: exploration
+---
+
+## What I do
+
+I help you create new scratch files in the `.agents/scratches/` directory. Each scratch file gets:
+
+- A unique three-word identifier (e.g., `calm-teal-cloud`)
+- Frontmatter with the current date and formatted title
+- Content you provide
+
+## How to use
+
+Run the script with a slug and content:
+
+```bash
+npx tsx scripts/create-scratch.ts "note-name" "Scratch content here"
+```
+
+Or use heredoc for multi-line content:
+
+```bash
+npx tsx scripts/create-scratch.ts "note-name" << HEREDOC
+Multi-line
+scratch content
+goes here
+HEREDOC
+```
+
+## File format
+
+Files are created as: `{three-word-id}-{slug}.md`
+
+Example: `calm-teal-cloud-note-name.md`
+
+The file includes frontmatter:
+
+```markdown
+---
+date: 2026-01-13
+title: Note Name
+---
+
+Your content here
+```
+
+## When to use me
+
+Use this skill when you need to create a temporary note, exploration document, or scratch pad for ideas. The unique ID ensures no filename conflicts, and the frontmatter provides metadata for organization.

AGENTS.md

@@ -11,6 +11,8 @@
 - `npm run format` - Format code with Prettier
 - `npm run dev` - Start development server for Remix app
 
+**Important:** Do not run `npm run build` to verify changes unless explicitly asked. Builds take a long time (~2 minutes). Use `npx tsc --noEmit` for type checking specific packages if needed.
+
 ## Code Style Guidelines
 
 - Use TypeScript for all code; prefer `type` over `interface`

CONTRIBUTING.md

@@ -52,3 +52,53 @@ You can build the project with:
 ```bash
 npm run build
 ```
+
+## AI-Assisted Development with OpenCode
+
+We use [OpenCode](https://opencode.ai) for AI-assisted development. OpenCode provides custom commands and skills to help maintain consistency and streamline common workflows.
+
+OpenCode works with most major AI providers (Anthropic, OpenAI, Google, etc.) or you can use [Zen](https://opencode.ai/zen) for optimized coding models. Configure your preferred provider in the OpenCode settings.
+
+> **Important**: All AI-generated code must be thoroughly reviewed by the contributor before submitting a PR. You are responsible for understanding and validating every line of code you submit. If we detect that contributors are simply throwing AI-generated code over the wall without proper review, they will be blocked from the repository.
+
+### Getting Started
+
+1. Install OpenCode (see [opencode.ai](https://opencode.ai) for other install methods):
+   ```bash
+   curl -fsSL https://opencode.ai/install | bash
+   ```
+2. Configure your AI provider (or use Zen for optimized models)
+3. Run `opencode` in the project root
+
+### Available Commands
+
+Use these commands in OpenCode by typing the command name:
+
+| Command                        | Description                                              |
+| ------------------------------ | -------------------------------------------------------- |
+| `/implement <spec-path>`       | Implement a spec from `.agents/plans/` autonomously      |
+| `/continue <spec-path>`        | Continue implementing a spec from a previous session     |
+| `/interview <file-path>`       | Deep-dive interview to flesh out a spec or design        |
+| `/document <module-path>`      | Generate MDX documentation for a module or feature       |
+| `/commit`                      | Create a conventional commit for staged changes          |
+| `/create-plan <slug>`          | Create a new plan file in `.agents/plans/`               |
+| `/create-scratch <slug>`       | Create a scratch file for notes in `.agents/scratches/`  |
+| `/create-justification <slug>` | Create a justification file in `.agents/justifications/` |
+
+### Typical Workflow
+
+1. **Create a plan**: Use `/create-plan my-feature` to draft a spec for a new feature
+2. **Flesh out the spec**: Use `/interview .agents/plans/<file>.md` to refine requirements
+3. **Implement**: Use `/implement .agents/plans/<file>.md` to build the feature
+4. **Continue if needed**: Use `/continue .agents/plans/<file>.md` to pick up where you left off
+5. **Commit**: Use `/commit` to create a conventional commit
+
+### Agent Files
+
+The `.agents/` directory stores AI-generated artifacts:
+
+- **`.agents/plans/`** - Feature specs and implementation plans
+- **`.agents/scratches/`** - Temporary notes and explorations
+- **`.agents/justifications/`** - Decision rationale and technical justifications
+
+These files use a unique ID format (`{word}-{word}-{word}-{slug}.md`) to prevent conflicts.

apps/documentation/pages/developers/developer-mode/field-coordinates.mdx

@@ -5,14 +5,22 @@ description: Learn how to get the coordinates of a field in a document.
 
 ## Field Coordinates
 
-Field coordinates represent the position of a field in a document. They are returned in the `pageX` and `pageY` properties of the field.
+Field coordinates represent the position of a field in a document. They are returned in the `pageX`, `pageY`, `width` and `height` properties of the field.
 
 To enable field coordinates, you can use the `devmode` query parameter.
 
 ```bash
-https://app.documenso.com/documents/<document-id>/edit?devmode=true
+# Legacy editor
+
+https://app.documenso.com/t/<team-url>/documents/<envelope-id>/legacy_editor?devmode=true
 ```
 
-You should then see the coordinates on top of each field.
+![Field Coordinates Legacy Editor](/developer-mode/field-coordinates-legacy-editor.webp)
 
-![Field Coordinates](/developer-mode/field-coordinates.webp)
+```bash
+# New editor
+
+https://app.documenso.com/t/<team-url>/documents/<envelope-id>/edit?step=addFields&devmode=true
+```
+
+![Field Coordinates New Editor](/developer-mode/field-coordinates-new-editor.webp)

apps/documentation/pages/developers/self-hosting/how-to.mdx

@@ -148,6 +148,7 @@ This method avoids file permission issues by creating the certificate directly i
 
    # Generate certificate inside container using environment variable
    docker exec -e CERT_PASS="$CERT_PASS" -it documenso-production-documenso-1 bash -c "
+     mkdir -p /app/certs && \
      openssl req -x509 -nodes -days 365 -newkey rsa:2048 \
        -keyout /tmp/private.key \
        -out /tmp/certificate.crt \
@@ -290,10 +291,13 @@ For AI setup specifics, see the [AI Recipient & Field Detection (Self-hosting)](
 | `NEXT_PUBLIC_SUPPORT_EMAIL`                  | The support email address displayed to users (default `support@documenso.com`).                                                                         |
 | `NEXT_PRIVATE_DATABASE_URL`                  | The URL for the primary database connection (with connection pooling).                                                                                  |
 | `NEXT_PRIVATE_DIRECT_DATABASE_URL`           | The URL for the direct database connection (without connection pooling).                                                                                |
-| `NEXT_PRIVATE_SIGNING_TRANSPORT`             | The signing transport to use. Available options: local (default)                                                                                        |
+| `NEXT_PRIVATE_SIGNING_TRANSPORT`             | The signing transport to use. Available options: local (default), gcloud-hsm                                                                            |
 | `NEXT_PRIVATE_SIGNING_PASSPHRASE`            | The passphrase for the key file.                                                                                                                        |
 | `NEXT_PRIVATE_SIGNING_LOCAL_FILE_CONTENTS`   | The base64-encoded contents of the key file will be used instead of the file path.                                                                      |
 | `NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH`       | The path to the key file, default `/opt/documenso/cert.p12`.                                                                                            |
+| `NEXT_PRIVATE_SIGNING_TIMESTAMP_AUTHORITY`   | Comma-separated list of timestamp authority URLs for PDF signing. Enables LTV and archival timestamps.                                                  |
+| `NEXT_PUBLIC_SIGNING_CONTACT_INFO`           | Contact info to embed in PDF signatures. Defaults to the webapp URL.                                                                                    |
+| `NEXT_PRIVATE_USE_LEGACY_SIGNING_SUBFILTER`  | Set to "true" to use the legacy adbe.pkcs7.detached subfilter instead of ETSI.CAdES.detached.                                                           |
 | `NEXT_PUBLIC_UPLOAD_TRANSPORT`               | The transport for file uploads (database or s3).                                                                                                        |
 | `NEXT_PRIVATE_UPLOAD_ENDPOINT`               | The endpoint for the S3 storage transport (for third-party S3-compatible providers).                                                                    |
 | `NEXT_PRIVATE_UPLOAD_FORCE_PATH_STYLE`       | Whether to force path-style URLs for the S3 storage transport.                                                                                          |

apps/documentation/pages/developers/self-hosting/signing-certificate.mdx

@@ -53,15 +53,21 @@ Have the Certificate Authority sign the Certificate Signing Request.
 
 Configure your instance to use the new certificate by configuring the following environment variables in your `.env` file:
 
-| Environment Variable                                            | Description                                                                                                                               |
-| :-------------------------------------------------------------- | :---------------------------------------------------------------------------------------------------------------------------------------- |
-| `NEXT_PRIVATE_SIGNING_TRANSPORT`                                | The transport used for document signing. Available options: local (default), gcloud-hsm                                                   |
-| `NEXT_PRIVATE_SIGNING_PASSPHRASE`                               | The passphrase for the local file-based signing transport. This field is optional.                                                        |
-| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH`                          | The local file path to the .p12 file to use for the local signing transport. This field is optional.                                      |
-| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_CONTENTS`                      | The base64-encoded contents of the .p12 file to use for the local signing transport. This field is optional.                              |
-| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_KEY_PATH`                      | The Google Cloud HSM key path for the gcloud-hsm signing transport. This field is optional.                                               |
-| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM _PUBLIC_CRT_FILE_PATH`         | The path to the Google Cloud HSM public certificate file to use for the gcloud-hsm signing transport. This field is optional.             |
-| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM _PUBLIC_CRT_FILE_CONTENTS`     | The base64-encoded contents of the Google Cloud HSM public certificate file for the gcloud-hsm signing transport. This field is optional. |
-| `NEXT_PRIVATE_SIGNING_GCLOUD_ APPLICATION_CREDENTIALS_CONTENTS` | The Google Cloud Credentials file path for the gcloud-hsm signing transport. This field is optional.                                      |
+| Environment Variable                                           | Description                                                                                                                               |
+| :------------------------------------------------------------- | :---------------------------------------------------------------------------------------------------------------------------------------- |
+| `NEXT_PRIVATE_SIGNING_TRANSPORT`                               | The transport used for document signing. Available options: local (default), gcloud-hsm                                                   |
+| `NEXT_PRIVATE_SIGNING_PASSPHRASE`                              | The passphrase for the local file-based signing transport. This field is optional.                                                        |
+| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH`                         | The local file path to the .p12 file to use for the local signing transport. This field is optional.                                      |
+| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_CONTENTS`                     | The base64-encoded contents of the .p12 file to use for the local signing transport. This field is optional.                              |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_KEY_PATH`                     | The Google Cloud HSM key path for the gcloud-hsm signing transport. This field is optional.                                               |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_PUBLIC_CRT_FILE_PATH`         | The path to the Google Cloud HSM public certificate file to use for the gcloud-hsm signing transport. This field is optional.             |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_PUBLIC_CRT_FILE_CONTENTS`     | The base64-encoded contents of the Google Cloud HSM public certificate file for the gcloud-hsm signing transport. This field is optional. |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_APPLICATION_CREDENTIALS_CONTENTS` | The base64-encoded Google Cloud Credentials for the gcloud-hsm signing transport. This field is optional.                                 |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_CERT_CHAIN_FILE_PATH`         | The path to the certificate chain file for the gcloud-hsm signing transport. This field is optional.                                      |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_CERT_CHAIN_CONTENTS`          | The base64-encoded contents of the certificate chain for the gcloud-hsm signing transport. This field is optional.                        |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_SECRET_MANAGER_CERT_PATH`     | The Google Secret Manager path to retrieve the certificate for the gcloud-hsm signing transport. This field is optional.                  |
+| `NEXT_PRIVATE_SIGNING_TIMESTAMP_AUTHORITY`                     | Comma-separated list of timestamp authority URLs for PDF signing. Enables LTV and archival timestamps. This field is optional.            |
+| `NEXT_PUBLIC_SIGNING_CONTACT_INFO`                             | Contact info to embed in PDF signatures. Defaults to the webapp URL. This field is optional.                                              |
+| `NEXT_PRIVATE_USE_LEGACY_SIGNING_SUBFILTER`                    | Set to "true" to use the legacy adbe.pkcs7.detached subfilter instead of ETSI.CAdES.detached. This field is optional.                     |
 
 </Steps>

apps/documentation/pages/users/documents/_meta.js

@@ -5,4 +5,5 @@ export default {
   fields: 'Document Fields',
   'email-preferences': 'Email Preferences',
   'ai-detection': 'AI Recipient & Field Detection',
+  'default-recipients': 'Default Recipients',
 };

apps/documentation/pages/users/documents/default-recipients.mdx

@@ -0,0 +1,45 @@
+---
+title: Default Document Recipients
+description: Learn how to set default recipients with various roles for your documents.
+---
+
+import { Callout, Steps } from 'nextra/components';
+
+# Default Document Recipients
+
+Documenso allows you to set default recipients for your documents. This is useful when you require specific recipients to be added to every document you send.
+
+You can add default recipients with the same roles as the recipients you can add when sending a document:
+
+- **Signer** - The recipient will be required to sign the document.
+- **Approver** - The recipient will be required to approve the document.
+- **Viewer** - The recipient will be required to view the document.
+- **CC** - The recipient will receive a copy of the document.
+
+You can set default recipients at the organisation or team level.
+
+### Organisation level
+
+To set default recipients at the organisation level, navigate to the organisation settings page and click the "Document" tab under the "Preferences" section.
+
+Then scroll down to the "Default Recipients" section and add the recipients you want to be included in every document you send.
+
+![A screenshot of the organisation's default recipients page](/default-recipients/organisation-default-recipients-select-step.webp)
+
+The recipients are added with the "CC" role by default, but you can select a different role for each recipient.
+
+![A screenshot of the organisation's default recipients page when selecting the role of the recipient](/default-recipients/organisation-default-recipients-role-step.webp)
+
+### Team level
+
+Setting the default recipients at the team level follows the same process as setting them at the organisation level.
+
+<Callout type="info">
+  Setting the default recipients at the team level will override organisation-level defaults.
+</Callout>
+
+To set default recipients at the team level, navigate to the team settings page and click the "Document" tab under the "Preferences" section.
+
+Then scroll down to the "Default Recipients" section. By default, the team will inherit the default recipients from the organisation. You can override these defaults by adding the recipients you want to be added to every document you send.
+
+![A screenshot of the team's default recipients page](/default-recipients/team-default-recipients.webp)

apps/remix/app/components/dialogs/envelope-distribute-dialog.tsx

@@ -3,13 +3,7 @@ import { useEffect, useMemo, useState } from 'react';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useLingui } from '@lingui/react/macro';
 import { Trans } from '@lingui/react/macro';
-import {
-  DocumentDistributionMethod,
-  DocumentStatus,
-  EnvelopeType,
-  FieldType,
-  RecipientRole,
-} from '@prisma/client';
+import { DocumentDistributionMethod, DocumentStatus, EnvelopeType } from '@prisma/client';
 import { AnimatePresence, motion } from 'framer-motion';
 import { InfoIcon } from 'lucide-react';
 import { useForm } from 'react-hook-form';
@@ -20,6 +14,7 @@ import * as z from 'zod';
 import { useCurrentEnvelopeEditor } from '@documenso/lib/client-only/providers/envelope-editor-provider';
 import { useCurrentOrganisation } from '@documenso/lib/client-only/providers/organisation';
 import { extractDocumentAuthMethods } from '@documenso/lib/utils/document-auth';
+import { getRecipientsWithMissingFields } from '@documenso/lib/utils/recipients';
 import { trpc, trpc as trpcReact } from '@documenso/trpc/react';
 import { DocumentSendEmailMessageHelper } from '@documenso/ui/components/document/document-send-email-message-helper';
 import { cn } from '@documenso/ui/lib/utils';
@@ -140,14 +135,7 @@ export const EnvelopeDistributeDialog = ({
   );
 
   const recipientsMissingSignatureFields = useMemo(
-    () =>
-      recipientsWithIndex.filter(
-        (recipient) =>
-          recipient.role === RecipientRole.SIGNER &&
-          !envelope.fields.some(
-            (field) => field.type === FieldType.SIGNATURE && field.recipientId === recipient.id,
-          ),
-      ),
+    () => getRecipientsWithMissingFields(recipientsWithIndex, envelope.fields),
     [recipientsWithIndex, envelope.fields],
   );
 

apps/remix/app/components/dialogs/passkey-create-dialog.tsx

@@ -73,7 +73,9 @@ export const PasskeyCreateDialog = ({ trigger, onSuccess, ...props }: PasskeyCre
     try {
       const passkeyRegistrationOptions = await createPasskeyRegistrationOptions();
 
-      const registrationResult = await startRegistration(passkeyRegistrationOptions);
+      const registrationResult = await startRegistration({
+        optionsJSON: passkeyRegistrationOptions,
+      });
 
       await createPasskey({
         passkeyName,

apps/remix/app/components/dialogs/sign-field-checkbox-dialog.tsx

@@ -82,9 +82,7 @@ export const SignFieldCheckboxDialog = createCallable<
     <Dialog open={true} onOpenChange={(value) => (!value ? call.end(null) : null)}>
       <DialogContent position="center">
         <DialogHeader>
-          <DialogTitle>
-            <Trans>Sign Checkbox Field</Trans>
-          </DialogTitle>
+          <DialogTitle>{fieldMeta.label || <Trans>Select Options</Trans>}</DialogTitle>
 
           <DialogDescription
             className={cn('mt-4', {
@@ -143,7 +141,7 @@ export const SignFieldCheckboxDialog = createCallable<
                             <div className="flex items-center">
                               <Checkbox
                                 id={`checkbox-value-${index}`}
-                                className="data-[state=checked]:bg-primary border-foreground/30 h-5 w-5"
+                                className="h-5 w-5 border-foreground/30 data-[state=checked]:bg-primary"
                                 checked={field.value.checked}
                                 onCheckedChange={(checked) => {
                                   field.onChange({
@@ -154,7 +152,7 @@ export const SignFieldCheckboxDialog = createCallable<
                               />
 
                               <label
-                                className="text-muted-foreground ml-2 w-full text-sm"
+                                className="ml-2 w-full text-sm text-muted-foreground"
                                 htmlFor={`checkbox-value-${index}`}
                               >
                                 {value.value}
@@ -174,7 +172,7 @@ export const SignFieldCheckboxDialog = createCallable<
                 </Button>
 
                 <Button type="submit">
-                  <Trans>Sign</Trans>
+                  <Trans>Confirm</Trans>
                 </Button>
               </DialogFooter>
             </fieldset>

apps/remix/app/components/dialogs/sign-field-email-dialog.tsx

@@ -50,11 +50,11 @@ export const SignFieldEmailDialog = createCallable<SignFieldEmailDialogProps, st
         <DialogContent>
           <DialogHeader>
             <DialogTitle>
-              <Trans>Sign Email</Trans>
+              <Trans>Enter Email</Trans>
             </DialogTitle>
 
             <DialogDescription className="mt-4">
-              <Trans>Sign your email into the field</Trans>
+              <Trans>Please enter your email address</Trans>
             </DialogDescription>
           </DialogHeader>
 
@@ -83,7 +83,7 @@ export const SignFieldEmailDialog = createCallable<SignFieldEmailDialogProps, st
                   </Button>
 
                   <Button type="submit">
-                    <Trans>Sign</Trans>
+                    <Trans>Enter</Trans>
                   </Button>
                 </DialogFooter>
               </fieldset>

apps/remix/app/components/dialogs/sign-field-initials-dialog.tsx

@@ -48,11 +48,11 @@ export const SignFieldInitialsDialog = createCallable<SignFieldInitialsDialogPro
         <DialogContent>
           <DialogHeader>
             <DialogTitle>
-              <Trans>Sign Initials</Trans>
+              <Trans>Enter Initials</Trans>
             </DialogTitle>
 
             <DialogDescription className="mt-4">
-              <Trans>Sign your initials into the field</Trans>
+              <Trans>Please enter your initials</Trans>
             </DialogDescription>
           </DialogHeader>
 
@@ -84,7 +84,7 @@ export const SignFieldInitialsDialog = createCallable<SignFieldInitialsDialogPro
                   </Button>
 
                   <Button type="submit">
-                    <Trans>Sign</Trans>
+                    <Trans>Enter</Trans>
                   </Button>
                 </DialogFooter>
               </fieldset>

apps/remix/app/components/dialogs/sign-field-name-dialog.tsx

@@ -47,11 +47,11 @@ export const SignFieldNameDialog = createCallable<SignFieldNameDialogProps, stri
         <DialogContent>
           <DialogHeader>
             <DialogTitle>
-              <Trans>Sign Name</Trans>
+              <Trans>Enter Name</Trans>
             </DialogTitle>
 
             <DialogDescription className="mt-4">
-              <Trans>Sign your full name into the field</Trans>
+              <Trans>Please enter your full name</Trans>
             </DialogDescription>
           </DialogHeader>
 
@@ -80,7 +80,7 @@ export const SignFieldNameDialog = createCallable<SignFieldNameDialogProps, stri
                   </Button>
 
                   <Button type="submit">
-                    <Trans>Sign</Trans>
+                    <Trans>Enter</Trans>
                   </Button>
                 </DialogFooter>
               </fieldset>

apps/remix/app/components/dialogs/sign-field-number-dialog.tsx

@@ -22,7 +22,6 @@ import {
   FormControl,
   FormField,
   FormItem,
-  FormLabel,
   FormMessage,
 } from '@documenso/ui/primitives/form/form';
 import { Input } from '@documenso/ui/primitives/input';
@@ -107,12 +106,10 @@ export const SignFieldNumberDialog = createCallable<SignFieldNumberDialogProps,
       <Dialog open={true} onOpenChange={(value) => (!value ? call.end(null) : null)}>
         <DialogContent>
           <DialogHeader>
-            <DialogTitle>
-              <Trans>Sign Number Field</Trans>
-            </DialogTitle>
+            <DialogTitle>{fieldMeta.label || <Trans>Enter Number</Trans>}</DialogTitle>
 
             <DialogDescription className="mt-4">
-              <Trans>Insert a value into the number field</Trans>
+              <Trans>Please enter a number</Trans>
             </DialogDescription>
           </DialogHeader>
 
@@ -127,8 +124,6 @@ export const SignFieldNumberDialog = createCallable<SignFieldNumberDialogProps,
                   name="number"
                   render={({ field, fieldState }) => (
                     <FormItem>
-                      {fieldMeta.label && <FormLabel>{fieldMeta.label}</FormLabel>}
-
                       <FormControl>
                         <Input
                           placeholder={fieldMeta.placeholder ?? t`Enter your number here`}
@@ -150,7 +145,7 @@ export const SignFieldNumberDialog = createCallable<SignFieldNumberDialogProps,
                   </Button>
 
                   <Button type="submit">
-                    <Trans>Sign</Trans>
+                    <Trans>Enter</Trans>
                   </Button>
                 </DialogFooter>
               </fieldset>

apps/remix/app/components/dialogs/sign-field-text-dialog.tsx

@@ -22,7 +22,6 @@ import {
   FormControl,
   FormField,
   FormItem,
-  FormLabel,
   FormMessage,
 } from '@documenso/ui/primitives/form/form';
 import { Textarea } from '@documenso/ui/primitives/textarea';
@@ -52,12 +51,10 @@ export const SignFieldTextDialog = createCallable<SignFieldTextDialogProps, stri
       <Dialog open={true} onOpenChange={(value) => (!value ? call.end(null) : null)}>
         <DialogContent>
           <DialogHeader>
-            <DialogTitle>
-              <Trans>Sign Text Field</Trans>
-            </DialogTitle>
+            <DialogTitle>{fieldMeta?.label || <Trans>Enter Text</Trans>}</DialogTitle>
 
             <DialogDescription className="mt-4">
-              <Trans>Insert a value into the text field</Trans>
+              <Trans>Please enter a value</Trans>
             </DialogDescription>
           </DialogHeader>
 
@@ -72,8 +69,6 @@ export const SignFieldTextDialog = createCallable<SignFieldTextDialogProps, stri
                   name="text"
                   render={({ field, fieldState }) => (
                     <FormItem>
-                      {fieldMeta?.label && <FormLabel>{fieldMeta?.label}</FormLabel>}
-
                       <FormControl>
                         <Textarea
                           id="custom-text"
@@ -89,7 +84,7 @@ export const SignFieldTextDialog = createCallable<SignFieldTextDialogProps, stri
                       {fieldMeta?.characterLimit !== undefined &&
                         fieldMeta?.characterLimit > 0 &&
                         !fieldState.error && (
-                          <div className="text-muted-foreground text-sm">
+                          <div className="text-sm text-muted-foreground">
                             <Plural
                               value={fieldMeta?.characterLimit - (field.value?.length ?? 0)}
                               one="# character remaining"
@@ -107,7 +102,7 @@ export const SignFieldTextDialog = createCallable<SignFieldTextDialogProps, stri
                   </Button>
 
                   <Button type="submit">
-                    <Trans>Sign</Trans>
+                    <Trans>Enter</Trans>
                   </Button>
                 </DialogFooter>
               </fieldset>

apps/remix/app/components/dialogs/template-direct-link-dialog.tsx

@@ -54,6 +54,8 @@ type TemplateDirectLinkDialogProps = {
   directLink?: Pick<TemplateDirectLink, 'token' | 'enabled'> | null;
   recipients: Recipient[];
   trigger?: React.ReactNode;
+  onCreateSuccess?: () => Promise<void> | void;
+  onDeleteSuccess?: () => Promise<void> | void;
 };
 
 type TemplateDirectLinkStep = 'ONBOARD' | 'SELECT_RECIPIENT' | 'MANAGE' | 'CONFIRM_DELETE';
@@ -63,6 +65,8 @@ export const TemplateDirectLinkDialog = ({
   directLink,
   recipients,
   trigger,
+  onCreateSuccess,
+  onDeleteSuccess,
 }: TemplateDirectLinkDialogProps) => {
   const { toast } = useToast();
   const { quota, remaining } = useLimits();
@@ -97,6 +101,7 @@ export const TemplateDirectLinkDialog = ({
   } = trpcReact.template.createTemplateDirectLink.useMutation({
     onSuccess: async (data) => {
       await revalidate();
+      await onCreateSuccess?.();
 
       setToken(data.token);
       setIsEnabled(data.enabled);
@@ -142,6 +147,7 @@ export const TemplateDirectLinkDialog = ({
     trpcReact.template.deleteTemplateDirectLink.useMutation({
       onSuccess: async () => {
         await revalidate();
+        await onDeleteSuccess?.();
 
         setOpen(false);
         setToken(null);
@@ -234,7 +240,7 @@ export const TemplateDirectLinkDialog = ({
                         </div>
 
                         <h3 className="font-semibold">{_(step.title)}</h3>
-                        <p className="text-muted-foreground mt-1 text-sm">{_(step.description)}</p>
+                        <p className="mt-1 text-sm text-muted-foreground">{_(step.description)}</p>
                       </li>
                     ))}
                   </ul>
@@ -320,13 +326,13 @@ export const TemplateDirectLinkDialog = ({
                             onClick={async () => onRecipientTableRowClick(row.id)}
                           >
                             <TableCell>
-                              <div className="text-muted-foreground text-sm">
+                              <div className="text-sm text-muted-foreground">
                                 <p>{row.name}</p>
-                                <p className="text-muted-foreground/70 text-xs">{row.email}</p>
+                                <p className="text-xs text-muted-foreground/70">{row.email}</p>
                               </div>
                             </TableCell>
 
-                            <TableCell className="text-muted-foreground text-sm">
+                            <TableCell className="text-sm text-muted-foreground">
                               {_(RECIPIENT_ROLES_DESCRIPTION[row.role].roleName)}
                             </TableCell>
 
@@ -350,7 +356,7 @@ export const TemplateDirectLinkDialog = ({
                     <DialogFooter className="mx-auto">
                       <div className="flex flex-col items-center justify-center">
                         {validDirectTemplateRecipients.length !== 0 && (
-                          <p className="text-muted-foreground text-sm">
+                          <p className="text-sm text-muted-foreground">
                             <Trans>Or</Trans>
                           </p>
                         )}
@@ -392,7 +398,7 @@ export const TemplateDirectLinkDialog = ({
                           <TooltipTrigger tabIndex={-1} className="ml-2">
                             <InfoIcon className="h-4 w-4" />
                           </TooltipTrigger>
-                          <TooltipContent className="text-foreground z-9999 max-w-md p-4">
+                          <TooltipContent className="z-9999 max-w-md p-4 text-foreground">
                             <Trans>
                               Disabling direct link signing will prevent anyone from accessing the
                               link.

apps/remix/app/components/embed/embed-direct-template-client-page.tsx

@@ -3,8 +3,14 @@ import { useEffect, useLayoutEffect, useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import type { DocumentMeta, EnvelopeItem, Recipient, Signature } from '@prisma/client';
-import { type Field, FieldType } from '@prisma/client';
+import {
+  type DocumentMeta,
+  type EnvelopeItem,
+  type Field,
+  FieldType,
+  type Recipient,
+  type Signature,
+} from '@prisma/client';
 import { LucideChevronDown, LucideChevronUp } from 'lucide-react';
 import { DateTime } from 'luxon';
 import { useSearchParams } from 'react-router';
@@ -18,6 +24,7 @@ import {
   isRequiredField,
 } from '@documenso/lib/utils/advanced-fields-helpers';
 import { validateFieldsInserted } from '@documenso/lib/utils/fields';
+import { isSignatureFieldType } from '@documenso/prisma/guards/is-signature-field';
 import { trpc } from '@documenso/trpc/react';
 import type {
   TRemovedSignedFieldWithTokenMutationSchema,
@@ -96,7 +103,7 @@ export const EmbedDirectTemplateClientPage = ({
 
   const highestPendingPageNumber = Math.max(...pendingFields.map((field) => field.page));
 
-  const hasSignatureField = localFields.some((field) => field.type === FieldType.SIGNATURE);
+  const hasSignatureField = localFields.some((field) => isSignatureFieldType(field.type));
 
   const signatureValid = !hasSignatureField || (signature && signature.trim() !== '');
 

apps/remix/app/components/embed/embed-document-signing-page-v1.tsx

@@ -4,13 +4,14 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import type { DocumentMeta, EnvelopeItem } from '@prisma/client';
-import { type Field, FieldType, RecipientRole, SigningStatus } from '@prisma/client';
+import { type Field, RecipientRole, SigningStatus } from '@prisma/client';
 import { LucideChevronDown, LucideChevronUp } from 'lucide-react';
 
 import { useThrottleFn } from '@documenso/lib/client-only/hooks/use-throttle-fn';
 import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
 import { isFieldUnsignedAndRequired } from '@documenso/lib/utils/advanced-fields-helpers';
 import { validateFieldsInserted } from '@documenso/lib/utils/fields';
+import { isSignatureFieldType } from '@documenso/prisma/guards/is-signature-field';
 import type { RecipientWithFields } from '@documenso/prisma/types/recipient-with-fields';
 import { trpc } from '@documenso/trpc/react';
 import {
@@ -115,7 +116,7 @@ export const EmbedSignDocumentV1ClientPage = ({
     [fields],
   );
 
-  const hasSignatureField = fields.some((field) => field.type === FieldType.SIGNATURE);
+  const hasSignatureField = fields.some((field) => isSignatureFieldType(field.type));
 
   const signatureValid = !hasSignatureField || (signature && signature.trim() !== '');
 

apps/remix/app/components/embed/multisign/multi-sign-document-signing-view.tsx

@@ -3,12 +3,13 @@ import { useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import { DocumentStatus, FieldType, SigningStatus } from '@prisma/client';
+import { DocumentStatus, SigningStatus } from '@prisma/client';
 import { Loader, LucideChevronDown, LucideChevronUp, X } from 'lucide-react';
 import { P, match } from 'ts-pattern';
 
 import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
+import { isSignatureFieldType } from '@documenso/prisma/guards/is-signature-field';
 import { trpc } from '@documenso/trpc/react';
 import type {
   TRemovedSignedFieldWithTokenMutationSchema,
@@ -83,7 +84,7 @@ export const MultiSignDocumentSigningView = ({
   const { mutateAsync: completeDocumentWithToken } =
     trpc.recipient.completeDocumentWithToken.useMutation();
 
-  const hasSignatureField = document?.fields.some((field) => field.type === FieldType.SIGNATURE);
+  const hasSignatureField = document?.fields.some((field) => isSignatureFieldType(field.type));
 
   const [pendingFields, completedFields] = [
     document?.fields.filter((field) => field.recipient.signingStatus !== SigningStatus.SIGNED) ??

apps/remix/app/components/forms/document-preferences-form.tsx

@@ -3,7 +3,7 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react/macro';
 import { Trans } from '@lingui/react/macro';
 import type { TeamGlobalSettings } from '@prisma/client';
-import { DocumentVisibility, OrganisationType } from '@prisma/client';
+import { DocumentVisibility, OrganisationType, type RecipientRole } from '@prisma/client';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 
@@ -17,14 +17,19 @@ import {
   isValidLanguageCode,
 } from '@documenso/lib/constants/i18n';
 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 { recipientAbbreviation } from '@documenso/lib/utils/recipient-formatter';
 import { extractTeamSignatureSettings } from '@documenso/lib/utils/teams';
 import { DocumentSignatureSettingsTooltip } from '@documenso/ui/components/document/document-signature-settings-tooltip';
+import { RecipientRoleSelect } from '@documenso/ui/components/recipient/recipient-role-select';
 import { Alert } from '@documenso/ui/primitives/alert';
+import { AvatarWithText } from '@documenso/ui/primitives/avatar';
 import { Button } from '@documenso/ui/primitives/button';
 import { Combobox } from '@documenso/ui/primitives/combobox';
 import {
@@ -45,6 +50,10 @@ import {
   SelectValue,
 } from '@documenso/ui/primitives/select';
 
+import { useOptionalCurrentTeam } from '~/providers/team';
+
+import { DefaultRecipientsMultiSelectCombobox } from '../general/default-recipients-multiselect-combobox';
+
 /**
  * Can't infer this from the schema since we need to keep the schema inside the component to allow
  * it to be dynamic.
@@ -58,6 +67,7 @@ export type TDocumentPreferencesFormSchema = {
   includeSigningCertificate: boolean | null;
   includeAuditLog: boolean | null;
   signatureTypes: DocumentSignatureType[];
+  defaultRecipients: TDefaultRecipients | null;
   delegateDocumentOwnership: boolean | null;
   aiFeaturesEnabled: boolean | null;
 };
@@ -74,6 +84,7 @@ type SettingsSubset = Pick<
   | 'typedSignatureEnabled'
   | 'uploadSignatureEnabled'
   | 'drawSignatureEnabled'
+  | 'defaultRecipients'
   | 'delegateDocumentOwnership'
   | 'aiFeaturesEnabled'
 >;
@@ -94,6 +105,7 @@ export const DocumentPreferencesForm = ({
   const { t } = useLingui();
   const { user, organisations } = useSession();
   const currentOrganisation = useCurrentOrganisation();
+  const optionalTeam = useOptionalCurrentTeam();
 
   const isPersonalLayoutMode = isPersonalLayout(organisations);
   const isPersonalOrganisation = currentOrganisation.type === OrganisationType.PERSONAL;
@@ -111,6 +123,7 @@ export const DocumentPreferencesForm = ({
     signatureTypes: z.array(z.nativeEnum(DocumentSignatureType)).min(canInherit ? 0 : 1, {
       message: msg`At least one signature type must be enabled`.id,
     }),
+    defaultRecipients: ZDefaultRecipientsSchema.nullable(),
     delegateDocumentOwnership: z.boolean().nullable(),
     aiFeaturesEnabled: z.boolean().nullable(),
   });
@@ -128,6 +141,9 @@ export const DocumentPreferencesForm = ({
       includeSigningCertificate: settings.includeSigningCertificate,
       includeAuditLog: settings.includeAuditLog,
       signatureTypes: extractTeamSignatureSettings({ ...settings }),
+      defaultRecipients: settings.defaultRecipients
+        ? ZDefaultRecipientsSchema.parse(settings.defaultRecipients)
+        : null,
       delegateDocumentOwnership: settings.delegateDocumentOwnership,
       aiFeaturesEnabled: settings.aiFeaturesEnabled,
     },
@@ -519,6 +535,94 @@ export const DocumentPreferencesForm = ({
             )}
           />
 
+          <FormField
+            control={form.control}
+            name="defaultRecipients"
+            render={({ field }) => {
+              const recipients = field.value ?? [];
+
+              return (
+                <FormItem className="flex-1">
+                  <FormLabel>
+                    <Trans>Default Recipients</Trans>
+                  </FormLabel>
+
+                  {canInherit && (
+                    <Select
+                      value={field.value === null ? '-1' : '0'}
+                      onValueChange={(value) => field.onChange(value === '-1' ? null : [])}
+                    >
+                      <SelectTrigger>
+                        <SelectValue />
+                      </SelectTrigger>
+                      <SelectContent>
+                        <SelectItem value={'-1'}>
+                          <Trans>Inherit from organisation</Trans>
+                        </SelectItem>
+                        <SelectItem value={'0'}>
+                          <Trans>Override organisation settings</Trans>
+                        </SelectItem>
+                      </SelectContent>
+                    </Select>
+                  )}
+
+                  {(field.value !== null || !canInherit) && (
+                    <div className="space-y-4">
+                      <DefaultRecipientsMultiSelectCombobox
+                        listValues={recipients}
+                        onChange={field.onChange}
+                        organisationId={!canInherit ? currentOrganisation.id : undefined}
+                        teamId={canInherit ? optionalTeam?.id : undefined}
+                      />
+
+                      {recipients.map((recipient, index) => {
+                        return (
+                          <div
+                            key={recipient.email}
+                            className="flex items-center justify-between gap-3 rounded-lg border p-3"
+                          >
+                            <AvatarWithText
+                              avatarFallback={recipientAbbreviation(recipient)}
+                              primaryText={
+                                <span className="text-sm font-medium">
+                                  {recipient.name || recipient.email}
+                                </span>
+                              }
+                              secondaryText={
+                                recipient.name ? (
+                                  <span className="text-xs text-muted-foreground">
+                                    {recipient.email}
+                                  </span>
+                                ) : undefined
+                              }
+                              className="flex-1"
+                            />
+                            <div className="flex items-center gap-2">
+                              <RecipientRoleSelect
+                                value={recipient.role}
+                                onValueChange={(role: RecipientRole) => {
+                                  field.onChange(
+                                    recipients.map((recipient, idx) =>
+                                      idx === index ? { ...recipient, role } : recipient,
+                                    ),
+                                  );
+                                }}
+                              />
+                            </div>
+                          </div>
+                        );
+                      })}
+                    </div>
+                  )}
+
+                  <FormDescription>
+                    <Trans>Recipients that will be automatically added to new documents.</Trans>
+                  </FormDescription>
+                </FormItem>
+              );
+            }}
+          />
+
           <FormField
             control={form.control}
             name="delegateDocumentOwnership"

apps/remix/app/components/forms/signin.tsx

@@ -171,7 +171,7 @@ export const SignInForm = ({
 
       const { options, sessionId } = await createPasskeySigninOptions();
 
-      const credential = await startAuthentication(options);
+      const credential = await startAuthentication({ optionsJSON: options });
 
       await authClient.passkey.signIn({
         credential: JSON.stringify(credential),

apps/remix/app/components/forms/token.tsx

@@ -212,12 +212,12 @@ export const ApiTokenForm = ({ className, tokens }: ApiTokenFormProps) => {
               />
 
               <div>
-                <FormLabel className="text-muted-foreground mt-2">
+                <FormLabel className="mt-2 text-muted-foreground">
                   <Trans>Never expire</Trans>
                 </FormLabel>
                 <div className="block md:py-1.5">
                   <Switch
-                    className="bg-background mt-2"
+                    className="mt-2 bg-background"
                     checked={noExpirationDate}
                     onCheckedChange={setNoExpirationDate}
                   />
@@ -254,14 +254,14 @@ export const ApiTokenForm = ({ className, tokens }: ApiTokenFormProps) => {
             >
               <Card gradient>
                 <CardContent className="p-4">
-                  <p className="text-muted-foreground mt-2 text-sm">
+                  <p className="mt-2 text-sm text-muted-foreground">
                     <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="bg-muted-foreground/10 my-4 rounded-md px-2.5 py-1 font-mono text-sm">
+                  <p className="my-4 rounded-md bg-muted-foreground/10 px-2.5 py-1 font-mono text-sm">
                     {newlyCreatedToken.token}
                   </p>
 

apps/remix/app/components/general/default-recipients-multiselect-combobox.tsx

@@ -0,0 +1,90 @@
+import { msg } from '@lingui/core/macro';
+import { useLingui } from '@lingui/react';
+import { RecipientRole } from '@prisma/client';
+
+import type { TDefaultRecipient } from '@documenso/lib/types/default-recipients';
+import { trpc } from '@documenso/trpc/react';
+import { MultiSelect, type Option } from '@documenso/ui/primitives/multiselect';
+
+type DefaultRecipientsMultiSelectComboboxProps = {
+  listValues: TDefaultRecipient[];
+  onChange: (_values: TDefaultRecipient[]) => void;
+  teamId?: number;
+  organisationId?: string;
+};
+
+export const DefaultRecipientsMultiSelectCombobox = ({
+  listValues,
+  onChange,
+  teamId,
+  organisationId,
+}: DefaultRecipientsMultiSelectComboboxProps) => {
+  const { _ } = useLingui();
+
+  const { data: organisationData, isLoading: isLoadingOrganisation } =
+    trpc.organisation.member.find.useQuery(
+      {
+        organisationId: organisationId!,
+        query: '',
+        page: 1,
+        perPage: 100,
+      },
+      {
+        enabled: !!organisationId,
+      },
+    );
+
+  const { data: teamData, isLoading: isLoadingTeam } = trpc.team.member.find.useQuery(
+    {
+      teamId: teamId!,
+      query: '',
+      page: 1,
+      perPage: 100,
+    },
+    {
+      enabled: !!teamId,
+    },
+  );
+
+  const members = organisationId ? organisationData?.data : teamData?.data;
+  const isLoading = organisationId ? isLoadingOrganisation : isLoadingTeam;
+
+  const options = members?.map((member) => ({
+    value: member.email,
+    label: member.name ? `${member.name} (${member.email})` : member.email,
+  }));
+
+  const value = listValues.map((recipient) => ({
+    value: recipient.email,
+    label: recipient.name ? `${recipient.name} (${recipient.email})` : recipient.email,
+  }));
+
+  const onSelectionChange = (selected: Option[]) => {
+    const updatedRecipients = selected.map((option) => {
+      const existingRecipient = listValues.find((r) => r.email === option.value);
+      const member = members?.find((m) => m.email === option.value);
+
+      return {
+        email: option.value,
+        name: member?.name || option.value,
+        role: existingRecipient?.role ?? RecipientRole.CC,
+      };
+    });
+
+    onChange(updatedRecipients);
+  };
+
+  return (
+    <MultiSelect
+      commandProps={{ label: _(msg`Select recipients`) }}
+      options={options}
+      value={value}
+      onChange={onSelectionChange}
+      placeholder={_(msg`Select recipients`)}
+      hideClearAllButton
+      hidePlaceholderWhenSelected
+      loadingIndicator={isLoading ? <p className="text-center text-sm">Loading...</p> : undefined}
+      emptyIndicator={<p className="text-center text-sm">No members found</p>}
+    />
+  );
+};

apps/remix/app/components/general/direct-template/direct-template-configure-form.tsx

@@ -1,6 +1,4 @@
 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 { Recipient } from '@prisma/client';
 import type { Field } from '@prisma/client';
@@ -57,8 +55,6 @@ export const DirectTemplateConfigureForm = ({
   initialEmail,
   onSubmit,
 }: DirectTemplateConfigureFormProps) => {
-  const { _ } = useLingui();
-
   const { sessionData } = useOptionalSession();
   const user = sessionData?.user;
 
@@ -77,17 +73,7 @@ export const DirectTemplateConfigureForm = ({
   });
 
   const form = useForm<TDirectTemplateConfigureFormSchema>({
-    resolver: zodResolver(
-      ZDirectTemplateConfigureFormSchema.superRefine((items, ctx) => {
-        if (template.recipients.map((recipient) => recipient.email).includes(items.email)) {
-          ctx.addIssue({
-            code: z.ZodIssueCode.custom,
-            message: _(msg`Email cannot already exist in the template`),
-            path: ['email'],
-          });
-        }
-      }),
-    ),
+    resolver: zodResolver(ZDirectTemplateConfigureFormSchema),
     defaultValues: {
       email: initialEmail || '',
     },
@@ -138,7 +124,7 @@ export const DirectTemplateConfigureForm = ({
                   </FormControl>
 
                   {!fieldState.error && (
-                    <p className="text-muted-foreground text-xs">
+                    <p className="text-xs text-muted-foreground">
                       <Trans>Enter your email address to receive the completed document.</Trans>
                     </p>
                   )}

apps/remix/app/components/general/document-signing/document-signing-auth-passkey.tsx

@@ -90,7 +90,7 @@ export const DocumentSigningAuthPasskey = ({
         preferredPasskeyId: passkeyId,
       });
 
-      const authenticationResponse = await startAuthentication(options);
+      const authenticationResponse = await startAuthentication({ optionsJSON: options });
 
       await onReauthFormSubmit({
         type: DocumentAuth.PASSKEY,
@@ -146,7 +146,7 @@ export const DocumentSigningAuthPasskey = ({
   if (passkeyData.isInitialLoading || (passkeyData.isError && passkeyData.passkeys.length === 0)) {
     return (
       <div className="flex h-28 items-center justify-center">
-        <Loader className="text-muted-foreground h-6 w-6 animate-spin" />
+        <Loader className="h-6 w-6 animate-spin text-muted-foreground" />
       </div>
     );
   }

apps/remix/app/components/general/document-signing/document-signing-form.tsx

@@ -3,7 +3,7 @@ import { useId, useMemo, useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import { type Field, FieldType, type Recipient, RecipientRole } from '@prisma/client';
+import { type Field, type Recipient, RecipientRole } from '@prisma/client';
 import { Controller, useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router';
 
@@ -11,6 +11,7 @@ import type { DocumentAndSender } from '@documenso/lib/server-only/document/get-
 import type { TRecipientAccessAuth } from '@documenso/lib/types/document-auth';
 import { isFieldUnsignedAndRequired } from '@documenso/lib/utils/advanced-fields-helpers';
 import { sortFieldsByPosition } from '@documenso/lib/utils/fields';
+import { isSignatureFieldType } from '@documenso/prisma/guards/is-signature-field';
 import type { RecipientWithFields } from '@documenso/prisma/types/recipient-with-fields';
 import { FieldToolTip } from '@documenso/ui/components/field/field-tooltip';
 import { Button } from '@documenso/ui/primitives/button';
@@ -78,7 +79,7 @@ export const DocumentSigningForm = ({
     [fields],
   );
 
-  const hasSignatureField = fields.some((field) => field.type === FieldType.SIGNATURE);
+  const hasSignatureField = fields.some((field) => isSignatureFieldType(field.type));
 
   const uninsertedFields = useMemo(() => {
     return sortFieldsByPosition(fieldsRequiringValidation.filter((field) => !field.inserted));

apps/remix/app/components/general/document-signing/document-signing-mobile-widget.tsx

@@ -35,7 +35,7 @@ export const DocumentSigningMobileWidget = () => {
   return (
     <div className="pointer-events-none fixed bottom-0 left-0 right-0 z-50 flex justify-center px-2 pb-2 sm:px-4 sm:pb-6">
       <div className="pointer-events-auto w-full max-w-[760px]">
-        <div className="bg-card border-border overflow-hidden rounded-xl border shadow-2xl">
+        <div className="overflow-hidden rounded-xl border border-border bg-card shadow-2xl">
           {/* Main Header Bar */}
           <div className="flex items-center justify-between gap-4 p-4">
             <div className="flex-1">
@@ -48,15 +48,15 @@ export const DocumentSigningMobileWidget = () => {
                     aria-label={isExpanded ? 'Collapse' : 'Expand'}
                   >
                     {isExpanded ? (
-                      <LucideChevronDown className="text-muted-foreground h-5 w-5 flex-shrink-0" />
+                      <LucideChevronDown className="h-5 w-5 flex-shrink-0 text-muted-foreground" />
                     ) : (
-                      <LucideChevronUp className="text-muted-foreground h-5 w-5 flex-shrink-0" />
+                      <LucideChevronUp className="h-5 w-5 flex-shrink-0 text-muted-foreground" />
                     )}
                   </Button>
                 )}
 
                 <div>
-                  <h2 className="text-foreground text-lg font-semibold">
+                  <h2 className="text-lg font-semibold text-foreground">
                     {match(recipient.role)
                       .with(RecipientRole.VIEWER, () => <Trans>View Document</Trans>)
                       .with(RecipientRole.SIGNER, () => <Trans>Sign Document</Trans>)
@@ -65,7 +65,7 @@ export const DocumentSigningMobileWidget = () => {
                       .otherwise(() => null)}
                   </h2>
 
-                  <p className="text-muted-foreground -mt-0.5 text-sm">
+                  <p className="-mt-0.5 text-sm text-muted-foreground">
                     {recipientFieldsRemaining.length === 0 ? (
                       match(recipient.role)
                         .with(RecipientRole.VIEWER, () => (
@@ -102,11 +102,11 @@ export const DocumentSigningMobileWidget = () => {
           {recipient.role !== RecipientRole.VIEWER &&
             recipient.role !== RecipientRole.ASSISTANT && (
               <div className="px-4 pb-3">
-                <div className="bg-muted relative h-[4px] rounded-md">
+                <div className="relative h-[4px] rounded-md bg-muted">
                   <motion.div
                     layout="size"
                     layoutId="document-signing-mobile-widget-progress-bar"
-                    className="bg-primary absolute inset-y-0 left-0"
+                    className="absolute inset-y-0 left-0 bg-primary"
                     style={{
                       width: `${100 - (100 / requiredRecipientFields.length) * (recipientFieldsRemaining.length ?? 0)}%`,
                     }}
@@ -117,11 +117,11 @@ export const DocumentSigningMobileWidget = () => {
 
           {/* Expandable Content */}
           {isExpanded && (
-            <div className="border-border animate-in slide-in-from-bottom-2 border-t p-4 duration-200">
+            <div className="border-t border-border p-4 duration-200 animate-in slide-in-from-bottom-2">
               <EnvelopeSignerForm />
 
               {!hidePoweredBy && (
-                <div className="bg-primary text-primary-foreground mt-2 inline-block rounded px-2 py-1 text-xs font-medium opacity-60 hover:opacity-100 lg:hidden">
+                <div className="mt-2 inline-block rounded bg-primary px-2 py-1 text-xs font-medium text-primary-foreground opacity-60 hover:opacity-100 lg:hidden">
                   <span>Powered by</span>
                   <BrandingLogo className="ml-2 inline-block h-[14px]" />
                 </div>

apps/remix/app/components/general/document/document-page-view-recent-activity.tsx

@@ -22,7 +22,7 @@ export const DocumentPageViewRecentActivity = ({
   documentId,
   userId,
 }: DocumentPageViewRecentActivityProps) => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const {
     data,
@@ -48,9 +48,9 @@ export const DocumentPageViewRecentActivity = ({
   const documentAuditLogs = useMemo(() => (data?.pages ?? []).flatMap((page) => page.data), [data]);
 
   return (
-    <section className="dark:bg-background border-border bg-widget flex flex-col rounded-xl border">
+    <section className="flex flex-col rounded-xl border border-border bg-widget dark:bg-background">
       <div className="flex flex-row items-center justify-between border-b px-4 py-3">
-        <h1 className="text-foreground font-medium">
+        <h1 className="font-medium text-foreground">
           <Trans>Recent activity</Trans>
         </h1>
 
@@ -59,18 +59,18 @@ export const DocumentPageViewRecentActivity = ({
 
       {isLoading && (
         <div className="flex h-full items-center justify-center py-16">
-          <Loader className="text-muted-foreground h-6 w-6 animate-spin" />
+          <Loader className="h-6 w-6 animate-spin text-muted-foreground" />
         </div>
       )}
 
       {isLoadingError && (
         <div className="flex h-full flex-col items-center justify-center py-16">
-          <p className="text-foreground/80 text-sm">
+          <p className="text-sm text-foreground/80">
             <Trans>Unable to load document history</Trans>
           </p>
           <button
             onClick={async () => refetch()}
-            className="text-foreground/70 hover:text-muted-foreground mt-2 text-sm"
+            className="mt-2 text-sm text-foreground/70 hover:text-muted-foreground"
           >
             <Trans>Click here to retry</Trans>
           </button>
@@ -83,16 +83,16 @@ export const DocumentPageViewRecentActivity = ({
             {hasNextPage && (
               <li className="relative flex gap-x-4">
                 <div className="absolute -bottom-6 left-0 top-0 flex w-6 justify-center">
-                  <div className="bg-border w-px" />
+                  <div className="w-px bg-border" />
                 </div>
 
-                <div className="bg-widget relative flex h-6 w-6 flex-none items-center justify-center">
-                  <div className="bg-widget h-1.5 w-1.5 rounded-full ring-1 ring-gray-300 dark:ring-neutral-600" />
+                <div className="relative flex h-6 w-6 flex-none items-center justify-center bg-widget">
+                  <div className="h-1.5 w-1.5 rounded-full bg-widget ring-1 ring-gray-300 dark:ring-neutral-600" />
                 </div>
 
                 <button
                   onClick={async () => fetchNextPage()}
-                  className="text-foreground/70 hover:text-muted-foreground text-xs"
+                  className="text-xs text-foreground/70 hover:text-muted-foreground"
                 >
                   {isFetchingNextPage ? _(msg`Loading...`) : _(msg`Load older activity`)}
                 </button>
@@ -101,7 +101,7 @@ export const DocumentPageViewRecentActivity = ({
 
             {documentAuditLogs.length === 0 && (
               <div className="flex items-center justify-center py-4">
-                <p className="text-muted-foreground/70 text-sm">
+                <p className="text-sm text-muted-foreground/70">
                   <Trans>No recent activity</Trans>
                 </p>
               </div>
@@ -115,44 +115,44 @@ export const DocumentPageViewRecentActivity = ({
                     'absolute left-0 top-0 flex w-6 justify-center',
                   )}
                 >
-                  <div className="bg-border w-px" />
+                  <div className="w-px bg-border" />
                 </div>
 
-                <div className="bg-widget text-foreground/40 relative flex h-6 w-6 flex-none items-center justify-center">
+                <div className="relative flex h-6 w-6 flex-none items-center justify-center bg-widget text-foreground/40">
                   {match(auditLog.type)
                     .with(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_COMPLETED, () => (
-                      <div className="bg-widget rounded-full border border-gray-300 p-1 dark:border-neutral-600">
+                      <div className="rounded-full border border-gray-300 bg-widget p-1 dark:border-neutral-600">
                         <CheckCheckIcon className="h-3 w-3" aria-hidden="true" />
                       </div>
                     ))
                     .with(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_COMPLETED, () => (
-                      <div className="bg-widget rounded-full border border-gray-300 p-1 dark:border-neutral-600">
+                      <div className="rounded-full border border-gray-300 bg-widget p-1 dark:border-neutral-600">
                         <CheckIcon className="h-3 w-3" aria-hidden="true" />
                       </div>
                     ))
                     .with(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_RECIPIENT_REJECTED, () => (
-                      <div className="bg-widget rounded-full border border-gray-300 p-1 dark:border-neutral-600">
+                      <div className="rounded-full border border-gray-300 bg-widget p-1 dark:border-neutral-600">
                         <AlertTriangle className="h-3 w-3" aria-hidden="true" />
                       </div>
                     ))
                     .with(DOCUMENT_AUDIT_LOG_TYPE.DOCUMENT_OPENED, () => (
-                      <div className="bg-widget rounded-full border border-gray-300 p-1 dark:border-neutral-600">
+                      <div className="rounded-full border border-gray-300 bg-widget p-1 dark:border-neutral-600">
                         <MailOpen className="h-3 w-3" aria-hidden="true" />
                       </div>
                     ))
                     .otherwise(() => (
-                      <div className="bg-widget h-1.5 w-1.5 rounded-full ring-1 ring-gray-300 dark:ring-neutral-600" />
+                      <div className="h-1.5 w-1.5 rounded-full bg-widget ring-1 ring-gray-300 dark:ring-neutral-600" />
                     ))}
                 </div>
 
                 <p
-                  className="text-muted-foreground dark:text-muted-foreground/70 flex-auto truncate py-0.5 text-xs leading-5"
-                  title={formatDocumentAuditLogAction(_, auditLog, userId).description}
+                  className="flex-auto truncate py-0.5 text-xs leading-5 text-muted-foreground dark:text-muted-foreground/70"
+                  title={formatDocumentAuditLogAction(i18n, auditLog, userId).description}
                 >
-                  {formatDocumentAuditLogAction(_, auditLog, userId).description}
+                  {formatDocumentAuditLogAction(i18n, auditLog, userId).description}
                 </p>
 
-                <time className="text-muted-foreground dark:text-muted-foreground/70 flex-none py-0.5 text-xs leading-5">
+                <time className="flex-none py-0.5 text-xs leading-5 text-muted-foreground dark:text-muted-foreground/70">
                   {DateTime.fromJSDate(auditLog.createdAt).toRelative({ style: 'short' })}
                 </time>
               </li>

apps/remix/app/components/general/envelope-editor/envelope-editor-recipient-form.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
 import {
   DragDropContext,
@@ -7,28 +7,23 @@ import {
   Droppable,
   type SensorAPI,
 } from '@hello-pangea/dnd';
-import { zodResolver } from '@hookform/resolvers/zod';
 import { plural } from '@lingui/core/macro';
 import { Trans, useLingui } from '@lingui/react/macro';
 import { DocumentSigningOrder, EnvelopeType, RecipientRole, SendStatus } from '@prisma/client';
 import { motion } from 'framer-motion';
 import { GripVerticalIcon, HelpCircleIcon, PlusIcon, SparklesIcon, TrashIcon } from 'lucide-react';
-import { useFieldArray, useForm, useWatch } from 'react-hook-form';
+import { useFieldArray, useWatch } from 'react-hook-form';
 import { useRevalidator, useSearchParams } from 'react-router';
-import { isDeepEqual, prop, sortBy } from 'remeda';
-import { z } from 'zod';
+import { isDeepEqual } from 'remeda';
 
 import { useLimits } from '@documenso/ee/server-only/limits/provider/client';
 import { useDebouncedValue } from '@documenso/lib/client-only/hooks/use-debounced-value';
+import { ZEditorRecipientsFormSchema } from '@documenso/lib/client-only/hooks/use-editor-recipients';
 import { useCurrentEnvelopeEditor } from '@documenso/lib/client-only/providers/envelope-editor-provider';
 import { useCurrentOrganisation } from '@documenso/lib/client-only/providers/organisation';
 import { useSession } from '@documenso/lib/client-only/providers/session';
 import type { TDetectedRecipientSchema } from '@documenso/lib/server-only/ai/envelope/detect-recipients/schema';
-import {
-  ZRecipientActionAuthTypesSchema,
-  ZRecipientAuthOptionsSchema,
-} from '@documenso/lib/types/document-auth';
-import { ZRecipientEmailSchema } from '@documenso/lib/types/recipient';
+import { ZRecipientAuthOptionsSchema } from '@documenso/lib/types/document-auth';
 import { nanoid } from '@documenso/lib/universal/id';
 import { canRecipientBeModified as utilCanRecipientBeModified } from '@documenso/lib/utils/recipients';
 import { trpc } from '@documenso/trpc/react';
@@ -67,26 +62,9 @@ import { AiFeaturesEnableDialog } from '~/components/dialogs/ai-features-enable-
 import { AiRecipientDetectionDialog } from '~/components/dialogs/ai-recipient-detection-dialog';
 import { useCurrentTeam } from '~/providers/team';
 
-const ZEnvelopeRecipientsForm = z.object({
-  signers: z.array(
-    z.object({
-      formId: z.string().min(1),
-      id: z.number().optional(),
-      email: ZRecipientEmailSchema,
-      name: z.string(),
-      role: z.nativeEnum(RecipientRole),
-      signingOrder: z.number().optional(),
-      actionAuth: z.array(ZRecipientActionAuthTypesSchema).optional().default([]),
-    }),
-  ),
-  signingOrder: z.nativeEnum(DocumentSigningOrder),
-  allowDictateNextSigner: z.boolean().default(false),
-});
-
-type TEnvelopeRecipientsForm = z.infer<typeof ZEnvelopeRecipientsForm>;
-
 export const EnvelopeEditorRecipientForm = () => {
-  const { envelope, setRecipientsDebounced, updateEnvelope } = useCurrentEnvelopeEditor();
+  const { envelope, setRecipientsDebounced, updateEnvelope, editorRecipients } =
+    useCurrentEnvelopeEditor();
 
   const organisation = useCurrentOrganisation();
   const team = useCurrentTeam();
@@ -145,7 +123,6 @@ export const EnvelopeEditorRecipientForm = () => {
 
   const debouncedRecipientSearchQuery = useDebouncedValue(recipientSearchQuery, 500);
 
-  const initialId = useId();
   const $sensorApi = useRef<SensorAPI | null>(null);
   const isFirstRender = useRef(true);
   const { recipients, fields } = envelope;
@@ -161,42 +138,7 @@ export const EnvelopeEditorRecipientForm = () => {
 
   const recipientSuggestions = recipientSuggestionsData?.results || [];
 
-  const defaultRecipients = [
-    {
-      formId: initialId,
-      name: '',
-      email: '',
-      role: RecipientRole.SIGNER,
-      signingOrder: 1,
-      actionAuth: [],
-    },
-  ];
-
-  const form = useForm<TEnvelopeRecipientsForm>({
-    resolver: zodResolver(ZEnvelopeRecipientsForm),
-    mode: 'onChange', // Used for autosave purposes, maybe can try onBlur instead?
-    defaultValues: {
-      signers:
-        recipients.length > 0
-          ? sortBy(
-              recipients.map((recipient, index) => ({
-                id: recipient.id,
-                formId: String(recipient.id),
-                name: recipient.name,
-                email: recipient.email,
-                role: recipient.role,
-                signingOrder: recipient.signingOrder ?? index + 1,
-                actionAuth:
-                  ZRecipientAuthOptionsSchema.parse(recipient.authOptions)?.actionAuth ?? undefined,
-              })),
-              [prop('signingOrder'), 'asc'],
-              [prop('id'), 'asc'],
-            )
-          : defaultRecipients,
-      signingOrder: envelope.documentMeta.signingOrder,
-      allowDictateNextSigner: envelope.documentMeta.allowDictateNextSigner,
-    },
-  });
+  const { form } = editorRecipients;
 
   const recipientHasAuthSettings = useMemo(() => {
     const recipientHasAuthOptions = recipients.find((recipient) => {
@@ -588,7 +530,7 @@ export const EnvelopeEditorRecipientForm = () => {
       return;
     }
 
-    const validatedFormValues = ZEnvelopeRecipientsForm.safeParse(formValues);
+    const validatedFormValues = ZEditorRecipientsFormSchema.safeParse(formValues);
 
     if (!validatedFormValues.success) {
       return;
@@ -848,246 +790,205 @@ export const EnvelopeEditorRecipientForm = () => {
                     ref={provided.innerRef}
                     className="flex w-full flex-col gap-y-2"
                   >
-                    {signers.map((signer, index) => (
-                      <Draggable
-                        key={`${signer.nativeId}-${signer.signingOrder}`}
-                        draggableId={signer['nativeId']}
-                        index={index}
-                        isDragDisabled={
-                          !isSigningOrderSequential ||
-                          isSubmitting ||
-                          !canRecipientBeModified(signer.id) ||
-                          !signer.signingOrder
-                        }
-                      >
-                        {(provided, snapshot) => (
-                          <div
-                            ref={provided.innerRef}
-                            {...provided.draggableProps}
-                            {...provided.dragHandleProps}
-                            className={cn('py-1', {
-                              'pointer-events-none rounded-md bg-widget-foreground pt-2':
-                                snapshot.isDragging,
-                            })}
-                          >
-                            <motion.fieldset
-                              data-native-id={signer.id}
-                              disabled={isSubmitting || !canRecipientBeModified(signer.id)}
-                              className={cn('pb-2', {
-                                'border-b pb-4':
-                                  showAdvancedSettings && index !== signers.length - 1,
-                                'pt-2': showAdvancedSettings && index === 0,
-                                'pr-3': isSigningOrderSequential,
+                    {signers.map((signer, index) => {
+                      const isDirectRecipient =
+                        envelope.type === EnvelopeType.TEMPLATE &&
+                        envelope.directLink !== null &&
+                        signer.id === envelope.directLink.directTemplateRecipientId;
+
+                      return (
+                        <Draggable
+                          key={`${signer.nativeId}-${signer.signingOrder}`}
+                          draggableId={signer['nativeId']}
+                          index={index}
+                          isDragDisabled={
+                            !isSigningOrderSequential ||
+                            isSubmitting ||
+                            !canRecipientBeModified(signer.id) ||
+                            !signer.signingOrder
+                          }
+                        >
+                          {(provided, snapshot) => (
+                            <div
+                              ref={provided.innerRef}
+                              {...provided.draggableProps}
+                              {...provided.dragHandleProps}
+                              className={cn('py-1', {
+                                'pointer-events-none rounded-md bg-widget-foreground pt-2':
+                                  snapshot.isDragging,
                               })}
                             >
-                              <div className="flex flex-row items-center gap-x-2">
-                                {isSigningOrderSequential && (
+                              <motion.fieldset
+                                data-native-id={signer.id}
+                                disabled={isSubmitting || !canRecipientBeModified(signer.id)}
+                                className={cn('pb-2', {
+                                  'border-b pb-4':
+                                    showAdvancedSettings && index !== signers.length - 1,
+                                  'pt-2': showAdvancedSettings && index === 0,
+                                  'pr-3': isSigningOrderSequential,
+                                })}
+                              >
+                                <div className="flex flex-row items-center gap-x-2">
+                                  {isSigningOrderSequential && (
+                                    <FormField
+                                      control={form.control}
+                                      name={`signers.${index}.signingOrder`}
+                                      render={({ field }) => (
+                                        <FormItem
+                                          className={cn(
+                                            'mt-auto flex items-center gap-x-1 space-y-0',
+                                            {
+                                              'mb-6':
+                                                form.formState.errors.signers?.[index] &&
+                                                !form.formState.errors.signers[index]?.signingOrder,
+                                            },
+                                          )}
+                                        >
+                                          <GripVerticalIcon className="h-5 w-5 flex-shrink-0 opacity-40" />
+                                          <FormControl>
+                                            <Input
+                                              type="number"
+                                              max={signers.length}
+                                              data-testid="signing-order-input"
+                                              className={cn(
+                                                'w-10 text-center',
+                                                '[appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none',
+                                              )}
+                                              {...field}
+                                              onChange={(e) => {
+                                                field.onChange(e);
+                                                handleSigningOrderChange(index, e.target.value);
+                                              }}
+                                              onBlur={(e) => {
+                                                field.onBlur();
+                                                handleSigningOrderChange(index, e.target.value);
+                                              }}
+                                              disabled={
+                                                snapshot.isDragging ||
+                                                isSubmitting ||
+                                                !canRecipientBeModified(signer.id)
+                                              }
+                                            />
+                                          </FormControl>
+                                          <FormMessage />
+                                        </FormItem>
+                                      )}
+                                    />
+                                  )}
+
                                   <FormField
                                     control={form.control}
-                                    name={`signers.${index}.signingOrder`}
+                                    name={`signers.${index}.email`}
                                     render={({ field }) => (
                                       <FormItem
-                                        className={cn(
-                                          'mt-auto flex items-center gap-x-1 space-y-0',
-                                          {
-                                            'mb-6':
-                                              form.formState.errors.signers?.[index] &&
-                                              !form.formState.errors.signers[index]?.signingOrder,
-                                          },
-                                        )}
+                                        className={cn('relative w-full', {
+                                          'mb-6':
+                                            form.formState.errors.signers?.[index] &&
+                                            !form.formState.errors.signers[index]?.email,
+                                        })}
                                       >
-                                        <GripVerticalIcon className="h-5 w-5 flex-shrink-0 opacity-40" />
+                                        {!showAdvancedSettings && index === 0 && (
+                                          <FormLabel>
+                                            <Trans>Email</Trans>
+                                          </FormLabel>
+                                        )}
+
                                         <FormControl>
-                                          <Input
-                                            type="number"
-                                            max={signers.length}
-                                            data-testid="signing-order-input"
-                                            className={cn(
-                                              'w-10 text-center',
-                                              '[appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none',
-                                            )}
-                                            {...field}
-                                            onChange={(e) => {
-                                              field.onChange(e);
-                                              handleSigningOrderChange(index, e.target.value);
-                                            }}
-                                            onBlur={(e) => {
-                                              field.onBlur();
-                                              handleSigningOrderChange(index, e.target.value);
-                                            }}
+                                          <RecipientAutoCompleteInput
+                                            type="email"
+                                            placeholder={t`Email`}
+                                            value={field.value}
                                             disabled={
                                               snapshot.isDragging ||
                                               isSubmitting ||
-                                              !canRecipientBeModified(signer.id)
+                                              !canRecipientBeModified(signer.id) ||
+                                              isDirectRecipient
                                             }
+                                            options={recipientSuggestions}
+                                            onSelect={(suggestion) =>
+                                              handleRecipientAutoCompleteSelect(index, suggestion)
+                                            }
+                                            onSearchQueryChange={(query) => {
+                                              field.onChange(query);
+                                              setRecipientSearchQuery(query);
+                                            }}
+                                            loading={isLoading}
+                                            data-testid="signer-email-input"
+                                            maxLength={254}
                                           />
                                         </FormControl>
+
                                         <FormMessage />
                                       </FormItem>
                                     )}
                                   />
-                                )}
 
-                                <FormField
-                                  control={form.control}
-                                  name={`signers.${index}.email`}
-                                  render={({ field }) => (
-                                    <FormItem
-                                      className={cn('relative w-full', {
-                                        'mb-6':
-                                          form.formState.errors.signers?.[index] &&
-                                          !form.formState.errors.signers[index]?.email,
-                                      })}
-                                    >
-                                      {!showAdvancedSettings && index === 0 && (
-                                        <FormLabel>
-                                          <Trans>Email</Trans>
-                                        </FormLabel>
-                                      )}
-
-                                      <FormControl>
-                                        <RecipientAutoCompleteInput
-                                          type="email"
-                                          placeholder={t`Email`}
-                                          value={field.value}
-                                          disabled={
-                                            snapshot.isDragging ||
-                                            isSubmitting ||
-                                            !canRecipientBeModified(signer.id)
-                                          }
-                                          options={recipientSuggestions}
-                                          onSelect={(suggestion) =>
-                                            handleRecipientAutoCompleteSelect(index, suggestion)
-                                          }
-                                          onSearchQueryChange={(query) => {
-                                            field.onChange(query);
-                                            setRecipientSearchQuery(query);
-                                          }}
-                                          loading={isLoading}
-                                          data-testid="signer-email-input"
-                                          maxLength={254}
-                                        />
-                                      </FormControl>
-
-                                      <FormMessage />
-                                    </FormItem>
-                                  )}
-                                />
-
-                                <FormField
-                                  control={form.control}
-                                  name={`signers.${index}.name`}
-                                  render={({ field }) => (
-                                    <FormItem
-                                      className={cn('w-full', {
-                                        'mb-6':
-                                          form.formState.errors.signers?.[index] &&
-                                          !form.formState.errors.signers[index]?.name,
-                                      })}
-                                    >
-                                      {!showAdvancedSettings && index === 0 && (
-                                        <FormLabel>
-                                          <Trans>Name</Trans>
-                                        </FormLabel>
-                                      )}
-
-                                      <FormControl>
-                                        <RecipientAutoCompleteInput
-                                          type="text"
-                                          placeholder={t`Recipient ${index + 1}`}
-                                          {...field}
-                                          disabled={
-                                            snapshot.isDragging ||
-                                            isSubmitting ||
-                                            !canRecipientBeModified(signer.id)
-                                          }
-                                          options={recipientSuggestions}
-                                          onSelect={(suggestion) =>
-                                            handleRecipientAutoCompleteSelect(index, suggestion)
-                                          }
-                                          onSearchQueryChange={(query) => {
-                                            field.onChange(query);
-                                            setRecipientSearchQuery(query);
-                                          }}
-                                          loading={isLoading}
-                                          maxLength={255}
-                                        />
-                                      </FormControl>
-
-                                      <FormMessage />
-                                    </FormItem>
-                                  )}
-                                />
-
-                                <FormField
-                                  control={form.control}
-                                  name={`signers.${index}.role`}
-                                  render={({ field }) => (
-                                    <FormItem
-                                      className={cn('mt-auto w-fit', {
-                                        'mb-6':
-                                          form.formState.errors.signers?.[index] &&
-                                          !form.formState.errors.signers[index]?.role,
-                                      })}
-                                    >
-                                      <FormControl>
-                                        <RecipientRoleSelect
-                                          {...field}
-                                          isAssistantEnabled={isSigningOrderSequential}
-                                          onValueChange={(value) => {
-                                            // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-                                            handleRoleChange(index, value as RecipientRole);
-                                            field.onChange(value);
-                                          }}
-                                          disabled={
-                                            snapshot.isDragging ||
-                                            isSubmitting ||
-                                            !canRecipientBeModified(signer.id)
-                                          }
-                                        />
-                                      </FormControl>
-
-                                      <FormMessage />
-                                    </FormItem>
-                                  )}
-                                />
-
-                                <Button
-                                  variant="ghost"
-                                  className={cn('mt-auto px-2', {
-                                    'mb-6': form.formState.errors.signers?.[index],
-                                  })}
-                                  data-testid="remove-signer-button"
-                                  disabled={
-                                    snapshot.isDragging ||
-                                    isSubmitting ||
-                                    !canRecipientBeModified(signer.id) ||
-                                    signers.length === 1
-                                  }
-                                  onClick={() => onRemoveSigner(index)}
-                                >
-                                  <TrashIcon className="h-4 w-4" />
-                                </Button>
-                              </div>
-
-                              {showAdvancedSettings &&
-                                organisation.organisationClaim.flags.cfr21 && (
                                   <FormField
                                     control={form.control}
-                                    name={`signers.${index}.actionAuth`}
+                                    name={`signers.${index}.name`}
                                     render={({ field }) => (
                                       <FormItem
-                                        className={cn('mt-2 w-full', {
+                                        className={cn('w-full', {
                                           'mb-6':
                                             form.formState.errors.signers?.[index] &&
-                                            !form.formState.errors.signers[index]?.actionAuth,
-                                          'pl-6': isSigningOrderSequential,
+                                            !form.formState.errors.signers[index]?.name,
+                                        })}
+                                      >
+                                        {!showAdvancedSettings && index === 0 && (
+                                          <FormLabel>
+                                            <Trans>Name</Trans>
+                                          </FormLabel>
+                                        )}
+
+                                        <FormControl>
+                                          <RecipientAutoCompleteInput
+                                            type="text"
+                                            placeholder={t`Recipient ${index + 1}`}
+                                            {...field}
+                                            disabled={
+                                              snapshot.isDragging ||
+                                              isSubmitting ||
+                                              !canRecipientBeModified(signer.id) ||
+                                              isDirectRecipient
+                                            }
+                                            options={recipientSuggestions}
+                                            onSelect={(suggestion) =>
+                                              handleRecipientAutoCompleteSelect(index, suggestion)
+                                            }
+                                            onSearchQueryChange={(query) => {
+                                              field.onChange(query);
+                                              setRecipientSearchQuery(query);
+                                            }}
+                                            loading={isLoading}
+                                            maxLength={255}
+                                          />
+                                        </FormControl>
+
+                                        <FormMessage />
+                                      </FormItem>
+                                    )}
+                                  />
+
+                                  <FormField
+                                    control={form.control}
+                                    name={`signers.${index}.role`}
+                                    render={({ field }) => (
+                                      <FormItem
+                                        className={cn('mt-auto w-fit', {
+                                          'mb-6':
+                                            form.formState.errors.signers?.[index] &&
+                                            !form.formState.errors.signers[index]?.role,
                                         })}
                                       >
                                         <FormControl>
-                                          <RecipientActionAuthSelect
+                                          <RecipientRoleSelect
                                             {...field}
-                                            onValueChange={field.onChange}
+                                            isAssistantEnabled={isSigningOrderSequential}
+                                            onValueChange={(value) => {
+                                              // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+                                              handleRoleChange(index, value as RecipientRole);
+                                              field.onChange(value);
+                                            }}
                                             disabled={
                                               snapshot.isDragging ||
                                               isSubmitting ||
@@ -1100,12 +1001,63 @@ export const EnvelopeEditorRecipientForm = () => {
                                       </FormItem>
                                     )}
                                   />
-                                )}
-                            </motion.fieldset>
-                          </div>
-                        )}
-                      </Draggable>
-                    ))}
+
+                                  <Button
+                                    variant="ghost"
+                                    className={cn('mt-auto px-2', {
+                                      'mb-6': form.formState.errors.signers?.[index],
+                                    })}
+                                    data-testid="remove-signer-button"
+                                    disabled={
+                                      snapshot.isDragging ||
+                                      isSubmitting ||
+                                      !canRecipientBeModified(signer.id) ||
+                                      signers.length === 1 ||
+                                      isDirectRecipient
+                                    }
+                                    onClick={() => onRemoveSigner(index)}
+                                  >
+                                    <TrashIcon className="h-4 w-4" />
+                                  </Button>
+                                </div>
+
+                                {showAdvancedSettings &&
+                                  organisation.organisationClaim.flags.cfr21 && (
+                                    <FormField
+                                      control={form.control}
+                                      name={`signers.${index}.actionAuth`}
+                                      render={({ field }) => (
+                                        <FormItem
+                                          className={cn('mt-2 w-full', {
+                                            'mb-6':
+                                              form.formState.errors.signers?.[index] &&
+                                              !form.formState.errors.signers[index]?.actionAuth,
+                                            'pl-6': isSigningOrderSequential,
+                                          })}
+                                        >
+                                          <FormControl>
+                                            <RecipientActionAuthSelect
+                                              {...field}
+                                              onValueChange={field.onChange}
+                                              disabled={
+                                                snapshot.isDragging ||
+                                                isSubmitting ||
+                                                !canRecipientBeModified(signer.id)
+                                              }
+                                            />
+                                          </FormControl>
+
+                                          <FormMessage />
+                                        </FormItem>
+                                      )}
+                                    />
+                                  )}
+                              </motion.fieldset>
+                            </div>
+                          )}
+                        </Draggable>
+                      );
+                    })}
 
                     {provided.placeholder}
                   </div>

apps/remix/app/components/general/envelope-editor/envelope-editor-settings-dialog.tsx

@@ -339,9 +339,11 @@ export const EnvelopeEditorSettingsDialog = ({
 
       <DialogContent className="flex w-full !max-w-5xl flex-row gap-0 p-0">
         {/* Sidebar. */}
-        <div className="bg-accent/20 flex w-80 flex-col border-r">
+        <div className="flex w-80 flex-col border-r bg-accent/20">
           <DialogHeader className="p-6 pb-4">
-            <DialogTitle>Document Settings</DialogTitle>
+            <DialogTitle>
+              <Trans>Document Settings</Trans>
+            </DialogTitle>
           </DialogHeader>
 
           <nav className="col-span-12 mb-8 flex flex-wrap items-center justify-start gap-x-2 gap-y-4 px-4 md:col-span-3 md:w-full md:flex-col md:items-start md:gap-y-2">
@@ -390,7 +392,7 @@ export const EnvelopeEditorSettingsDialog = ({
                                   <InfoIcon className="mx-2 h-4 w-4" />
                                 </TooltipTrigger>
 
-                                <TooltipContent className="text-foreground max-w-md space-y-2 p-4">
+                                <TooltipContent className="max-w-md space-y-2 p-4 text-foreground">
                                   <Trans>
                                     Controls the language for the document, including the language
                                     to be used for email notifications, and the final certificate
@@ -441,7 +443,7 @@ export const EnvelopeEditorSettingsDialog = ({
                                 }))}
                                 selectedValues={field.value}
                                 onChange={field.onChange}
-                                className="bg-background w-full"
+                                className="w-full bg-background"
                                 emptySelectionPlaceholder="Select signature types"
                               />
                             </FormControl>
@@ -518,7 +520,7 @@ export const EnvelopeEditorSettingsDialog = ({
                                   <InfoIcon className="mx-2 h-4 w-4" />
                                 </TooltipTrigger>
 
-                                <TooltipContent className="text-muted-foreground max-w-xs">
+                                <TooltipContent className="max-w-xs text-muted-foreground">
                                   <Trans>
                                     Add an external ID to the document. This can be used to identify
                                     the document in external systems.
@@ -548,7 +550,7 @@ export const EnvelopeEditorSettingsDialog = ({
                                   <InfoIcon className="mx-2 h-4 w-4" />
                                 </TooltipTrigger>
 
-                                <TooltipContent className="text-muted-foreground max-w-xs">
+                                <TooltipContent className="max-w-xs text-muted-foreground">
                                   <Trans>
                                     Add a URL to redirect the user to once the document is signed
                                   </Trans>
@@ -576,7 +578,7 @@ export const EnvelopeEditorSettingsDialog = ({
                                   <InfoIcon className="mx-2 h-4 w-4" />
                                 </TooltipTrigger>
 
-                                <TooltipContent className="text-foreground max-w-md space-y-2 p-4">
+                                <TooltipContent className="max-w-md space-y-2 p-4 text-foreground">
                                   <h2>
                                     <strong>
                                       <Trans>Document Distribution Method</Trans>
@@ -735,14 +737,14 @@ export const EnvelopeEditorSettingsDialog = ({
                                 <TooltipTrigger>
                                   <InfoIcon className="mx-2 h-4 w-4" />
                                 </TooltipTrigger>
-                                <TooltipContent className="text-muted-foreground p-4">
+                                <TooltipContent className="p-4 text-muted-foreground">
                                   <DocumentSendEmailMessageHelper />
                                 </TooltipContent>
                               </Tooltip>
                             </FormLabel>
 
                             <FormControl>
-                              <Textarea className="bg-background h-16 resize-none" {...field} />
+                              <Textarea className="h-16 resize-none bg-background" {...field} />
                             </FormControl>
 
                             <FormMessage />

apps/remix/app/components/general/envelope-editor/envelope-editor-upload-page.tsx

@@ -306,7 +306,7 @@ export const EnvelopeEditorUploadPage = () => {
                             ref={provided.innerRef}
                             {...provided.draggableProps}
                             style={provided.draggableProps.style}
-                            className={`bg-accent/50 flex items-center justify-between rounded-lg p-3 transition-shadow ${
+                            className={`flex items-center justify-between rounded-lg bg-accent/50 p-3 transition-shadow ${
                               snapshot.isDragging ? 'shadow-md' : ''
                             }`}
                           >
@@ -332,7 +332,7 @@ export const EnvelopeEditorUploadPage = () => {
                                   <p className="text-sm font-medium">{localFile.title}</p>
                                 )}
 
-                                <div className="text-muted-foreground text-xs">
+                                <div className="text-xs text-muted-foreground">
                                   {localFile.isUploading ? (
                                     <Trans>Uploading</Trans>
                                   ) : localFile.isError ? (
@@ -345,13 +345,13 @@ export const EnvelopeEditorUploadPage = () => {
                             <div className="flex items-center space-x-2">
                               {localFile.isUploading && (
                                 <div className="flex h-6 w-10 items-center justify-center">
-                                  <Loader2 className="text-muted-foreground h-4 w-4 animate-spin" />
+                                  <Loader2 className="h-4 w-4 animate-spin text-muted-foreground" />
                                 </div>
                               )}
 
                               {localFile.isError && (
                                 <div className="flex h-6 w-10 items-center justify-center">
-                                  <FileWarningIcon className="text-destructive h-4 w-4" />
+                                  <FileWarningIcon className="h-4 w-4 text-destructive" />
                                 </div>
                               )}
 

apps/remix/app/components/general/envelope-editor/envelope-editor.tsx

@@ -81,7 +81,7 @@ export default function EnvelopeEditor() {
     isAutosaving,
     flushAutosave,
     relativePath,
-    editorFields,
+    syncEnvelope,
   } = useCurrentEnvelopeEditor();
 
   const [searchParams, setSearchParams] = useSearchParams();
@@ -278,6 +278,8 @@ export default function EnvelopeEditor() {
                 templateId={mapSecondaryIdToTemplateId(envelope.secondaryId)}
                 directLink={envelope.directLink}
                 recipients={envelope.recipients}
+                onCreateSuccess={async () => await syncEnvelope()}
+                onDeleteSuccess={async () => await syncEnvelope()}
                 trigger={
                   <Button variant="ghost" size="sm" className="w-full justify-start">
                     <LinkIcon className="mr-2 h-4 w-4" />

apps/remix/app/components/general/envelope-signing/envelope-signer-form.tsx

@@ -1,8 +1,9 @@
 import { useMemo } from 'react';
 
 import { Plural, Trans } from '@lingui/react/macro';
-import { FieldType, RecipientRole } from '@prisma/client';
+import { RecipientRole } from '@prisma/client';
 
+import { isSignatureFieldType } from '@documenso/prisma/guards/is-signature-field';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
 import { RadioGroup, RadioGroupItem } from '@documenso/ui/primitives/radio-group';
@@ -30,7 +31,7 @@ export default function EnvelopeSignerForm() {
   const { isNameLocked, isEmailLocked } = useEmbedSigningContext() || {};
 
   const hasSignatureField = useMemo(() => {
-    return recipientFields.some((field) => field.type === FieldType.SIGNATURE);
+    return recipientFields.some((field) => isSignatureFieldType(field.type));
   }, [recipientFields]);
 
   const isSubmitting = false;

apps/remix/app/components/general/envelope-signing/envelope-signer-header.tsx

@@ -28,36 +28,40 @@ export const EnvelopeSignerHeader = () => {
   const { envelopeData, envelope, recipientFieldsRemaining, recipient } =
     useRequiredEnvelopeSigningContext();
 
+  const isEmbedSigning = useEmbedSigningContext() !== null;
+
   return (
-    <nav className="embed--DocumentWidgetHeader bg-background border-border max-w-screen flex flex-row justify-between border-b px-4 py-3 md:px-6">
+    <nav className="embed--DocumentWidgetHeader max-w-screen flex flex-row justify-between border-b border-border bg-background px-4 py-3 md:px-6">
       {/* Left side - Logo and title */}
       <div className="flex min-w-0 flex-1 items-center space-x-2 md:w-auto md:flex-none">
-        <Link to="/" className="flex-shrink-0">
-          {envelopeData.settings.brandingEnabled && envelopeData.settings.brandingLogo ? (
-            <img
-              src={`/api/branding/logo/team/${envelope.teamId}`}
-              alt={`${envelope.team.name}'s Logo`}
-              className="h-6 w-auto"
-            />
-          ) : (
-            <>
-              <BrandingLogo className="hidden h-6 w-auto md:block" />
-              <BrandingLogoIcon className="h-6 w-auto md:hidden" />
-            </>
-          )}
-        </Link>
+        {!isEmbedSigning && (
+          <Link to="/" className="flex-shrink-0">
+            {envelopeData.settings.brandingEnabled && envelopeData.settings.brandingLogo ? (
+              <img
+                src={`/api/branding/logo/team/${envelope.teamId}`}
+                alt={`${envelope.team.name}'s Logo`}
+                className="h-6 w-auto"
+              />
+            ) : (
+              <>
+                <BrandingLogo className="hidden h-6 w-auto md:block" />
+                <BrandingLogoIcon className="h-6 w-auto md:hidden" />
+              </>
+            )}
+          </Link>
+        )}
 
         <h1
           title={envelope.title}
-          className="text-foreground min-w-0 truncate text-base font-semibold md:hidden"
+          className="min-w-0 truncate text-base font-semibold text-foreground md:hidden"
         >
           {envelope.title}
         </h1>
 
-        <Separator orientation="vertical" className="hidden h-6 md:block" />
+        {!isEmbedSigning && <Separator orientation="vertical" className="hidden h-6 md:block" />}
 
         <div className="hidden items-center space-x-2 md:flex">
-          <h1 className="text-foreground whitespace-nowrap text-sm font-medium">
+          <h1 className="whitespace-nowrap text-sm font-medium text-foreground">
             {envelope.title}
           </h1>
 
@@ -74,7 +78,7 @@ export const EnvelopeSignerHeader = () => {
 
       {/* Right side - Desktop content */}
       <div className="hidden items-center space-x-2 lg:flex">
-        <p className="text-muted-foreground mr-2 flex-shrink-0 text-sm">
+        <p className="mr-2 flex-shrink-0 text-sm text-muted-foreground">
           <Plural
             one="1 Field Remaining"
             other="# Fields Remaining"

apps/remix/app/components/general/skeletons/document-edit-skeleton.tsx

@@ -7,7 +7,7 @@ import { Skeleton } from '@documenso/ui/primitives/skeleton';
 export default function DocumentEditSkeleton() {
   return (
     <div className="mx-auto -mt-4 flex w-full max-w-screen-xl flex-col px-4 md:px-8">
-      <Link to="/" className="flex grow-0 items-center text-[#7AC455] hover:opacity-80">
+      <Link to="/" className="flex grow-0 items-center text-documenso-700 hover:opacity-80">
         <ChevronLeft className="mr-2 inline-block h-5 w-5" />
         <Trans>Documents</Trans>
       </Link>
@@ -21,17 +21,17 @@ export default function DocumentEditSkeleton() {
       </div>
 
       <div className="mt-4 grid h-[80vh] max-h-[60rem] w-full grid-cols-12 gap-x-8">
-        <div className="dark:bg-background border-border col-span-12 rounded-xl border-2 bg-white/50 p-2 before:rounded-xl lg:col-span-6 xl:col-span-7">
+        <div className="col-span-12 rounded-xl border-2 border-border bg-white/50 p-2 before:rounded-xl lg:col-span-6 xl:col-span-7 dark:bg-background">
           <div className="flex h-[80vh] max-h-[60rem] flex-col items-center justify-center">
-            <Loader className="text-documenso h-12 w-12 animate-spin" />
+            <Loader className="h-12 w-12 animate-spin text-documenso" />
 
-            <p className="text-muted-foreground mt-4">
+            <p className="mt-4 text-muted-foreground">
               <Trans>Loading document...</Trans>
             </p>
           </div>
         </div>
 
-        <div className="bg-background border-border col-span-12 rounded-xl border-2 before:rounded-xl lg:col-span-6 xl:col-span-5" />
+        <div className="col-span-12 rounded-xl border-2 border-border bg-background before:rounded-xl lg:col-span-6 xl:col-span-5" />
       </div>
     </div>
   );

apps/remix/app/components/tables/admin-document-logs-table.tsx

@@ -0,0 +1,210 @@
+import { useMemo, useState } from 'react';
+
+import { msg } from '@lingui/core/macro';
+import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';
+import { DateTime } from 'luxon';
+import type { DateTimeFormatOptions } from 'luxon';
+import { useSearchParams } from 'react-router';
+import { UAParser } from 'ua-parser-js';
+
+import { useUpdateSearchParams } from '@documenso/lib/client-only/hooks/use-update-search-params';
+import type { TDocumentAuditLog } from '@documenso/lib/types/document-audit-logs';
+import { ZUrlSearchParamsSchema } from '@documenso/lib/types/search-params';
+import { formatDocumentAuditLogAction } from '@documenso/lib/utils/document-audit-logs';
+import { trpc } from '@documenso/trpc/react';
+import { CopyTextButton } from '@documenso/ui/components/common/copy-text-button';
+import { Button } from '@documenso/ui/primitives/button';
+import type { DataTableColumnDef } from '@documenso/ui/primitives/data-table';
+import { DataTable } from '@documenso/ui/primitives/data-table';
+import { DataTablePagination } from '@documenso/ui/primitives/data-table-pagination';
+import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@documenso/ui/primitives/dialog';
+import { Skeleton } from '@documenso/ui/primitives/skeleton';
+import { TableCell } from '@documenso/ui/primitives/table';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+export type AdminDocumentLogsTableProps = {
+  envelopeId: string;
+};
+
+const dateFormat: DateTimeFormatOptions = {
+  ...DateTime.DATETIME_SHORT,
+  hourCycle: 'h12',
+};
+
+export const AdminDocumentLogsTable = ({ envelopeId }: AdminDocumentLogsTableProps) => {
+  const { _, i18n } = useLingui();
+  const { toast } = useToast();
+
+  const [searchParams] = useSearchParams();
+  const updateSearchParams = useUpdateSearchParams();
+
+  const [selectedAuditLog, setSelectedAuditLog] = useState<TDocumentAuditLog | null>(null);
+
+  const parsedSearchParams = ZUrlSearchParamsSchema.parse(Object.fromEntries(searchParams ?? []));
+
+  const { data, isLoading, isLoadingError } = trpc.admin.document.findAuditLogs.useQuery(
+    {
+      envelopeId,
+      page: parsedSearchParams.page,
+      perPage: parsedSearchParams.perPage,
+    },
+    {
+      placeholderData: (previousData) => previousData,
+    },
+  );
+
+  const onPaginationChange = (page: number, perPage: number) => {
+    updateSearchParams({
+      page,
+      perPage,
+    });
+  };
+
+  const results = data ?? {
+    data: [],
+    perPage: 10,
+    currentPage: 1,
+    totalPages: 1,
+  };
+
+  const columns = useMemo(() => {
+    const parser = new UAParser();
+
+    return [
+      {
+        header: _(msg`Time`),
+        accessorKey: 'createdAt',
+        cell: ({ row }) => i18n.date(row.original.createdAt, dateFormat),
+      },
+      {
+        header: _(msg`User`),
+        accessorKey: 'name',
+        cell: ({ row }) =>
+          row.original.name || row.original.email ? (
+            <div>
+              {row.original.name && (
+                <p className="truncate" title={row.original.name}>
+                  {row.original.name}
+                </p>
+              )}
+
+              {row.original.email && (
+                <p className="truncate" title={row.original.email}>
+                  {row.original.email}
+                </p>
+              )}
+            </div>
+          ) : (
+            <p>N/A</p>
+          ),
+      },
+      {
+        header: _(msg`Action`),
+        accessorKey: 'type',
+        cell: ({ row }) => (
+          <span>{formatDocumentAuditLogAction(i18n, row.original).description}</span>
+        ),
+      },
+      {
+        header: _(msg`IP Address`),
+        accessorKey: 'ipAddress',
+      },
+      {
+        header: _(msg`Browser`),
+        cell: ({ row }) => {
+          if (!row.original.userAgent) {
+            return 'N/A';
+          }
+
+          parser.setUA(row.original.userAgent);
+
+          const result = parser.getResult();
+
+          return result.browser.name ?? 'N/A';
+        },
+      },
+      {
+        header: '',
+        id: 'actions',
+        cell: ({ row }) => (
+          <Button variant="link" size="sm" onClick={() => setSelectedAuditLog(row.original)}>
+            <Trans>View JSON</Trans>
+          </Button>
+        ),
+      },
+    ] satisfies DataTableColumnDef<(typeof results)['data'][number]>[];
+  }, []);
+
+  return (
+    <>
+      <DataTable
+        columns={columns}
+        data={results.data}
+        perPage={results.perPage}
+        currentPage={results.currentPage}
+        totalPages={results.totalPages}
+        onPaginationChange={onPaginationChange}
+        error={{
+          enable: isLoadingError,
+        }}
+        skeleton={{
+          enable: isLoading,
+          rows: 3,
+          component: (
+            <>
+              <TableCell>
+                <Skeleton className="h-4 w-12 rounded-full" />
+              </TableCell>
+              <TableCell className="w-1/2 py-4 pr-4">
+                <div className="ml-2 flex flex-grow flex-col">
+                  <Skeleton className="h-4 w-1/3 max-w-[8rem]" />
+                  <Skeleton className="mt-1 h-4 w-1/2 max-w-[12rem]" />
+                </div>
+              </TableCell>
+              <TableCell>
+                <Skeleton className="h-4 w-12 rounded-full" />
+              </TableCell>
+              <TableCell>
+                <Skeleton className="h-4 w-10 rounded-full" />
+              </TableCell>
+              <TableCell>
+                <Skeleton className="h-4 w-10 rounded-full" />
+              </TableCell>
+              <TableCell>
+                <Skeleton className="h-4 w-8 rounded-full" />
+              </TableCell>
+            </>
+          ),
+        }}
+      >
+        {(table) => <DataTablePagination additionalInformation="VisibleCount" table={table} />}
+      </DataTable>
+
+      <Dialog open={selectedAuditLog !== null} onOpenChange={() => setSelectedAuditLog(null)}>
+        <DialogContent className="max-w-2xl">
+          <DialogHeader>
+            <DialogTitle>
+              <Trans>Audit Log Details</Trans>
+            </DialogTitle>
+          </DialogHeader>
+
+          {selectedAuditLog && (
+            <div className="group relative">
+              <div className="absolute right-2 top-2 opacity-0 transition-opacity group-hover:opacity-100">
+                <CopyTextButton
+                  value={JSON.stringify(selectedAuditLog, null, 2)}
+                  onCopySuccess={() => toast({ title: _(msg`Copied to clipboard`) })}
+                />
+              </div>
+
+              <pre className="max-h-[60vh] overflow-auto whitespace-pre-wrap break-all rounded-lg border border-border bg-muted/50 p-4 font-mono text-xs leading-relaxed text-foreground">
+                {JSON.stringify(selectedAuditLog, null, 2)}
+              </pre>
+            </div>
+          )}
+        </DialogContent>
+      </Dialog>
+    </>
+  );
+};

apps/remix/app/components/tables/document-logs-table.tsx

@@ -95,7 +95,7 @@ export const DocumentLogsTable = ({ documentId, userId }: DocumentLogsTableProps
         header: _(msg`Action`),
         accessorKey: 'type',
         cell: ({ row }) => (
-          <span>{formatDocumentAuditLogAction(_, row.original, userId).description}</span>
+          <span>{formatDocumentAuditLogAction(i18n, row.original, userId).description}</span>
         ),
       },
       {

apps/remix/app/components/tables/internal-audit-log-table.tsx

@@ -65,7 +65,7 @@ const formatUserAgent = (userAgent: string | null | undefined, userAgentInfo: UA
 };
 
 export const InternalAuditLogTable = ({ logs }: AuditLogDataTableProps) => {
-  const { _ } = useLingui();
+  const { _, i18n } = useLingui();
 
   const parser = new UAParser();
 
@@ -73,7 +73,7 @@ export const InternalAuditLogTable = ({ logs }: AuditLogDataTableProps) => {
     <div className="space-y-4">
       {logs.map((log, index) => {
         parser.setUA(log.userAgent || '');
-        const formattedAction = formatDocumentAuditLogAction(_, log);
+        const formattedAction = formatDocumentAuditLogAction(i18n, log);
         const userAgentInfo = parser.getResult();
 
         return (
@@ -95,17 +95,17 @@ export const InternalAuditLogTable = ({ logs }: AuditLogDataTableProps) => {
                   />
 
                   <div>
-                    <div className="text-muted-foreground text-sm font-medium uppercase tracking-wide print:text-[8pt]">
+                    <div className="text-sm font-medium uppercase tracking-wide text-muted-foreground print:text-[8pt]">
                       {log.type.replace(/_/g, ' ')}
                     </div>
 
-                    <div className="text-foreground text-sm font-medium print:text-[8pt]">
+                    <div className="text-sm font-medium text-foreground print:text-[8pt]">
                       {formattedAction.description}
                     </div>
                   </div>
                 </div>
 
-                <div className="text-muted-foreground text-sm print:text-[8pt]">
+                <div className="text-sm text-muted-foreground print:text-[8pt]">
                   {DateTime.fromJSDate(log.createdAt)
                     .setLocale(APP_I18N_OPTIONS.defaultLocale)
                     .toLocaleString(dateFormat)}
@@ -117,27 +117,27 @@ export const InternalAuditLogTable = ({ logs }: AuditLogDataTableProps) => {
               {/* Details Section - Two column layout */}
               <div className="grid grid-cols-2 gap-x-8 gap-y-2 text-xs print:text-[6pt]">
                 <div>
-                  <div className="text-muted-foreground/70 font-medium uppercase tracking-wide">
+                  <div className="font-medium uppercase tracking-wide text-muted-foreground/70">
                     {_(msg`User`)}
                   </div>
 
-                  <div className="text-foreground mt-1 font-mono">{log.email || 'N/A'}</div>
+                  <div className="mt-1 font-mono text-foreground">{log.email || 'N/A'}</div>
                 </div>
 
                 <div className="text-right">
-                  <div className="text-muted-foreground/70 font-medium uppercase tracking-wide">
+                  <div className="font-medium uppercase tracking-wide text-muted-foreground/70">
                     {_(msg`IP Address`)}
                   </div>
 
-                  <div className="text-foreground mt-1 font-mono">{log.ipAddress || 'N/A'}</div>
+                  <div className="mt-1 font-mono text-foreground">{log.ipAddress || 'N/A'}</div>
                 </div>
 
                 <div className="col-span-2">
-                  <div className="text-muted-foreground/70 font-medium uppercase tracking-wide">
+                  <div className="font-medium uppercase tracking-wide text-muted-foreground/70">
                     {_(msg`User Agent`)}
                   </div>
 
-                  <div className="text-foreground mt-1">
+                  <div className="mt-1 text-foreground">
                     {_(formatUserAgent(log.userAgent, userAgentInfo))}
                   </div>
                 </div>

apps/remix/app/routes/_authenticated+/admin+/documents.$id.tsx

@@ -6,6 +6,7 @@ import { DateTime } from 'luxon';
 import { Link, redirect } from 'react-router';
 
 import { unsafeGetEntireEnvelope } from '@documenso/lib/server-only/admin/get-entire-document';
+import { mapSecondaryIdToDocumentId } from '@documenso/lib/utils/envelope';
 import { trpc } from '@documenso/trpc/react';
 import {
   Accordion,
@@ -26,6 +27,7 @@ import { useToast } from '@documenso/ui/primitives/use-toast';
 import { AdminDocumentDeleteDialog } from '~/components/dialogs/admin-document-delete-dialog';
 import { DocumentStatus } from '~/components/general/document/document-status';
 import { AdminDocumentJobsTable } from '~/components/tables/admin-document-jobs-table';
+import { AdminDocumentLogsTable } from '~/components/tables/admin-document-logs-table';
 import { AdminDocumentRecipientItemTable } from '~/components/tables/admin-document-recipient-item-table';
 
 import type { Route } from './+types/documents.$id';
@@ -87,6 +89,10 @@ export default function AdminDocumentDetailsPage({ loaderData }: Route.Component
       </div>
 
       <div className="mt-4 text-sm text-muted-foreground">
+        <div>
+          <Trans>Document ID</Trans>: {mapSecondaryIdToDocumentId(envelope.secondaryId)}
+        </div>
+
         <div>
           <Trans>Created on</Trans>: {i18n.date(envelope.createdAt, DateTime.DATETIME_MED)}
         </div>
@@ -156,6 +162,9 @@ export default function AdminDocumentDetailsPage({ loaderData }: Route.Component
                   <Badge size="small" variant="neutral">
                     {recipient.email}
                   </Badge>
+                  <Badge size="small" variant="secondary">
+                    {recipient.role}
+                  </Badge>
                 </div>
               </AccordionTrigger>
 
@@ -175,6 +184,22 @@ export default function AdminDocumentDetailsPage({ loaderData }: Route.Component
 
       <hr className="my-4" />
 
+      <Accordion type="single" collapsible className="w-full">
+        <AccordionItem value="audit-logs" className="rounded-lg border">
+          <AccordionTrigger className="px-4">
+            <h2 className="text-lg font-semibold">
+              <Trans>Audit Logs</Trans>
+            </h2>
+          </AccordionTrigger>
+
+          <AccordionContent className="border-t px-4 pt-4">
+            <AdminDocumentLogsTable envelopeId={envelope.id} />
+          </AccordionContent>
+        </AccordionItem>
+      </Accordion>
+
+      <hr className="my-4" />
+
       {envelope && <AdminDocumentDeleteDialog envelopeId={envelope.id} />}
     </div>
   );

apps/remix/app/routes/_authenticated+/o.$orgUrl._index.tsx

@@ -40,8 +40,8 @@ export default function OrganisationSettingsTeamsPage() {
   if (organisation.teams.length === 0) {
     return (
       <div className="flex flex-col items-center justify-center px-4 py-16">
-        <div className="bg-muted mb-6 flex h-20 w-20 items-center justify-center rounded-full">
-          <UsersIcon className="text-muted-foreground h-10 w-10" />
+        <div className="mb-6 flex h-20 w-20 items-center justify-center rounded-full bg-muted">
+          <UsersIcon className="h-10 w-10 text-muted-foreground" />
         </div>
 
         <h2 className="mb-2 text-xl font-semibold">
@@ -53,7 +53,7 @@ export default function OrganisationSettingsTeamsPage() {
           organisation.currentOrganisationRole,
         ) ? (
           <>
-            <p className="text-muted-foreground mb-8 max-w-md text-center text-sm">
+            <p className="mb-8 max-w-md text-center text-sm text-muted-foreground">
               <Trans>
                 Teams help you organise your work and collaborate with others. Create your first
                 team to get started.
@@ -73,21 +73,21 @@ export default function OrganisationSettingsTeamsPage() {
               <h3 className="mb-2 font-medium">
                 <Trans>What you can do with teams:</Trans>
               </h3>
-              <ul className="text-muted-foreground space-y-2 text-sm">
+              <ul className="space-y-2 text-sm text-muted-foreground">
                 <li className="flex flex-row items-center gap-2">
-                  <div className="bg-muted mt-0.5 flex h-5 w-5 items-center justify-center rounded-full font-bold">
+                  <div className="mt-0.5 flex h-5 w-5 items-center justify-center rounded-full bg-muted font-bold">
                     <span className="text-xs">1</span>
                   </div>
                   <Trans>Organize your documents and templates</Trans>
                 </li>
                 <li className="flex flex-row items-center gap-2">
-                  <div className="bg-muted mt-0.5 flex h-5 w-5 items-center justify-center rounded-full font-bold">
+                  <div className="mt-0.5 flex h-5 w-5 items-center justify-center rounded-full bg-muted font-bold">
                     <span className="text-xs">2</span>
                   </div>
                   <Trans>Invite team members to collaborate</Trans>
                 </li>
                 <li className="flex flex-row items-center gap-2">
-                  <div className="bg-muted mt-0.5 flex h-5 w-5 items-center justify-center rounded-full font-bold">
+                  <div className="mt-0.5 flex h-5 w-5 items-center justify-center rounded-full bg-muted font-bold">
                     <span className="text-xs">3</span>
                   </div>
                   <Trans>Manage permissions and access controls</Trans>
@@ -96,7 +96,7 @@ export default function OrganisationSettingsTeamsPage() {
             </div>
           </>
         ) : (
-          <p className="text-muted-foreground mb-8 max-w-md text-center text-sm">
+          <p className="mb-8 max-w-md text-center text-sm text-muted-foreground">
             <Trans>
               You currently have no access to any teams within this organisation. Please contact
               your organisation to request access.
@@ -114,7 +114,7 @@ export default function OrganisationSettingsTeamsPage() {
           <h1 className="text-2xl font-semibold tracking-tight">
             <Trans>{organisation.name} Teams</Trans>
           </h1>
-          <p className="text-muted-foreground mt-1 text-sm">
+          <p className="mt-1 text-sm text-muted-foreground">
             <Trans>Select a team to view its dashboard</Trans>
           </p>
         </div>
@@ -129,7 +129,7 @@ export default function OrganisationSettingsTeamsPage() {
       <div className="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
         {organisation.teams.map((team) => (
           <Link to={`/t/${team.url}`} key={team.id}>
-            <Card className="hover:bg-muted/50 border-border h-full border transition-all">
+            <Card className="h-full border border-border transition-all hover:bg-muted/50">
               <CardContent className="p-4">
                 <div className="flex items-center gap-3">
                   <Avatar className="h-10 w-10 border-2 border-solid">
@@ -145,7 +145,7 @@ export default function OrganisationSettingsTeamsPage() {
                     <div className="flex items-center justify-between">
                       <div>
                         <h3 className="font-medium">{team.name}</h3>
-                        <div className="text-muted-foreground truncate text-xs">
+                        <div className="truncate text-xs text-muted-foreground">
                           {formatTeamUrl(team.url)}
                         </div>
                       </div>
@@ -154,11 +154,11 @@ export default function OrganisationSettingsTeamsPage() {
                     </div>
 
                     <div className="mt-2 flex items-center gap-4">
-                      <div className="text-muted-foreground flex items-center gap-1 text-xs">
+                      <div className="flex items-center gap-1 text-xs text-muted-foreground">
                         <CalendarIcon className="h-3 w-3" />
                         {i18n.date(team.createdAt, { dateStyle: 'short' })}
                       </div>
-                      <div className="text-muted-foreground flex items-center gap-1 text-xs">
+                      <div className="flex items-center gap-1 text-xs text-muted-foreground">
                         <UserIcon className="h-3 w-3" />
                         <span>{t(TEAM_MEMBER_ROLE_MAP[team.currentTeamRole])}</span>
                       </div>

apps/remix/app/routes/_authenticated+/o.$orgUrl.settings.branding.tsx

@@ -79,7 +79,7 @@ export default function OrganisationSettingsBrandingPage() {
   if (isLoadingOrganisation || !organisationWithSettings) {
     return (
       <div className="flex items-center justify-center rounded-lg py-32">
-        <Loader className="text-muted-foreground h-6 w-6 animate-spin" />
+        <Loader className="h-6 w-6 animate-spin text-muted-foreground" />
       </div>
     );
   }

apps/remix/app/routes/_authenticated+/o.$orgUrl.settings.document.tsx

@@ -57,6 +57,7 @@ export default function OrganisationSettingsDocumentPage() {
         includeSigningCertificate,
         includeAuditLog,
         signatureTypes,
+        defaultRecipients,
         delegateDocumentOwnership,
         aiFeaturesEnabled,
       } = data;
@@ -83,6 +84,7 @@ export default function OrganisationSettingsDocumentPage() {
           includeSenderDetails,
           includeSigningCertificate,
           includeAuditLog,
+          defaultRecipients,
           typedSignatureEnabled: signatureTypes.includes(DocumentSignatureType.TYPE),
           uploadSignatureEnabled: signatureTypes.includes(DocumentSignatureType.UPLOAD),
           drawSignatureEnabled: signatureTypes.includes(DocumentSignatureType.DRAW),

apps/remix/app/routes/_authenticated+/t.$teamUrl+/documents.$id._index.tsx

@@ -100,7 +100,7 @@ export default function DocumentPage({ params }: Route.ComponentProps) {
         <DocumentRecipientLinkCopyDialog recipients={envelope.recipients} />
       )}
 
-      <Link to={documentRootPath} className="flex items-center text-[#7AC455] hover:opacity-80">
+      <Link to={documentRootPath} className="flex items-center text-documenso-700 hover:opacity-80">
         <ChevronLeft className="mr-2 inline-block h-5 w-5" />
         <Trans>Documents</Trans>
       </Link>

apps/remix/app/routes/_authenticated+/t.$teamUrl+/documents.$id.legacy_editor.tsx

@@ -84,7 +84,7 @@ export default function DocumentEditPage() {
 
   return (
     <div className="mx-auto -mt-4 w-full max-w-screen-xl px-4 md:px-8">
-      <Link to={documentRootPath} className="flex items-center text-[#7AC455] hover:opacity-80">
+      <Link to={documentRootPath} className="flex items-center text-documenso-700 hover:opacity-80">
         <ChevronLeft className="mr-2 inline-block h-5 w-5" />
         <Trans>Documents</Trans>
       </Link>
@@ -106,7 +106,7 @@ export default function DocumentEditPage() {
             />
 
             {recipients.length > 0 && (
-              <div className="text-muted-foreground flex items-center">
+              <div className="flex items-center text-muted-foreground">
                 <Users2 className="mr-2 h-5 w-5" />
 
                 <StackAvatarsWithTooltip

apps/remix/app/routes/_authenticated+/t.$teamUrl+/documents.$id.logs.tsx

@@ -134,7 +134,7 @@ export default function DocumentsLogsPage({ loaderData }: Route.ComponentProps)
     <div className="mx-auto -mt-4 w-full max-w-screen-xl px-4 md:px-8">
       <Link
         to={`${documentRootPath}/${document.envelopeId}`}
-        className="flex items-center text-[#7AC455] hover:opacity-80"
+        className="flex items-center text-documenso-700 hover:opacity-80"
       >
         <ChevronLeft className="mr-2 inline-block h-5 w-5" />
         <Trans>Document</Trans>

apps/remix/app/routes/_authenticated+/t.$teamUrl+/settings.document.tsx

@@ -50,6 +50,7 @@ export default function TeamsSettingsPage() {
         includeSigningCertificate,
         includeAuditLog,
         signatureTypes,
+        defaultRecipients,
         delegateDocumentOwnership,
         aiFeaturesEnabled,
       } = data;
@@ -64,6 +65,7 @@ export default function TeamsSettingsPage() {
           includeSenderDetails,
           includeSigningCertificate,
           includeAuditLog,
+          defaultRecipients,
           aiFeaturesEnabled,
           ...(signatureTypes.length === 0
             ? {

apps/remix/app/routes/_authenticated+/t.$teamUrl+/templates.$id._index.tsx

@@ -117,7 +117,7 @@ export default function TemplatePage({ params }: Route.ComponentProps) {
 
   return (
     <div className="mx-auto -mt-4 w-full max-w-screen-xl px-4 md:px-8">
-      <Link to={templateRootPath} className="flex items-center text-[#7AC455] hover:opacity-80">
+      <Link to={templateRootPath} className="flex items-center text-documenso-700 hover:opacity-80">
         <ChevronLeft className="mr-2 inline-block h-5 w-5" />
         <Trans>Templates</Trans>
       </Link>

apps/remix/app/routes/_authenticated+/t.$teamUrl+/templates.$id.legacy_editor.tsx

@@ -61,7 +61,7 @@ export default function TemplateEditPage() {
         <div>
           <Link
             to={`${templateRootPath}/${template.envelopeId}`}
-            className="flex items-center text-[#7AC455] hover:opacity-80"
+            className="flex items-center text-documenso-700 hover:opacity-80"
           >
             <ChevronLeft className="mr-2 inline-block h-5 w-5" />
             <Trans>Template</Trans>

apps/remix/app/routes/_internal+/[__htmltopdf]+/audit-log.tsx

@@ -149,7 +149,7 @@ export default function AuditLog({ loaderData }: Route.ComponentProps) {
             <span className="mt-1 block">
               {DateTime.fromJSDate(document.createdAt)
                 .setLocale(APP_I18N_OPTIONS.defaultLocale)
-                .toFormat('yyyy-mm-dd hh:mm:ss a (ZZZZ)')}
+                .toFormat('yyyy-MM-dd hh:mm:ss a (ZZZZ)')}
             </span>
           </p>
 
@@ -159,7 +159,7 @@ export default function AuditLog({ loaderData }: Route.ComponentProps) {
             <span className="mt-1 block">
               {DateTime.fromJSDate(document.updatedAt)
                 .setLocale(APP_I18N_OPTIONS.defaultLocale)
-                .toFormat('yyyy-mm-dd hh:mm:ss a (ZZZZ)')}
+                .toFormat('yyyy-MM-dd hh:mm:ss a (ZZZZ)')}
             </span>
           </p>
 

apps/remix/app/routes/_recipient+/sign.$token+/_index.tsx

@@ -355,16 +355,16 @@ const SigningPageV1 = ({ data }: { data: Awaited<ReturnType<typeof handleV1Loade
             </Trans>
           </h2>
 
-          <p className="text-muted-foreground/60 mt-2.5 max-w-[60ch] text-center text-sm font-medium md:text-base">
+          <p className="mt-2.5 max-w-[60ch] text-center text-sm font-medium text-muted-foreground/60 md:text-base">
             <Trans>This document has been cancelled by the owner.</Trans>
           </p>
 
           {user ? (
-            <Link to="/" className="text-documenso-700 hover:text-documenso-600 mt-36">
+            <Link to="/" className="mt-36 text-documenso-700 hover:text-documenso-600">
               <Trans>Go Back Home</Trans>
             </Link>
           ) : (
-            <p className="text-muted-foreground/60 mt-36 text-sm">
+            <p className="mt-36 text-sm text-muted-foreground/60">
               <Trans>
                 Want to send slick signing links like this one?{' '}
                 <Link
@@ -455,16 +455,16 @@ const SigningPageV2 = ({ data }: { data: Awaited<ReturnType<typeof handleV2Loade
             </Trans>
           </h2>
 
-          <p className="text-muted-foreground/60 mt-2.5 max-w-[60ch] text-center text-sm font-medium md:text-base">
+          <p className="mt-2.5 max-w-[60ch] text-center text-sm font-medium text-muted-foreground/60 md:text-base">
             <Trans>This document has been cancelled by the owner.</Trans>
           </p>
 
           {user ? (
-            <Link to="/" className="text-documenso-700 hover:text-documenso-600 mt-36">
+            <Link to="/" className="mt-36 text-documenso-700 hover:text-documenso-600">
               <Trans>Go Back Home</Trans>
             </Link>
           ) : (
-            <p className="text-muted-foreground/60 mt-36 text-sm">
+            <p className="mt-36 text-sm text-muted-foreground/60">
               <Trans>
                 Want to send slick signing links like this one?{' '}
                 <Link

apps/remix/app/routes/_recipient+/sign.$token+/rejected.tsx

@@ -91,25 +91,25 @@ export default function RejectedSigningPage({ loaderData }: Route.ComponentProps
 
       <div className="flex flex-col items-center">
         <div className="flex items-center gap-x-4">
-          <XCircle className="text-destructive h-10 w-10" />
+          <XCircle className="h-10 w-10 text-destructive" />
 
           <h2 className="max-w-[35ch] text-center text-2xl font-semibold leading-normal md:text-3xl lg:text-4xl">
             <Trans>Document Rejected</Trans>
           </h2>
         </div>
 
-        <div className="text-destructive mt-4 flex items-center text-center text-sm">
+        <div className="mt-4 flex items-center text-center text-sm text-destructive">
           <Trans>You have rejected this document</Trans>
         </div>
 
-        <p className="text-muted-foreground mt-6 max-w-[60ch] text-center text-sm">
+        <p className="mt-6 max-w-[60ch] text-center text-sm text-muted-foreground">
           <Trans>
             The document owner has been notified of your decision. They may contact you with further
             instructions if necessary.
           </Trans>
         </p>
 
-        <p className="text-muted-foreground mt-2 max-w-[60ch] text-center text-sm">
+        <p className="mt-2 max-w-[60ch] text-center text-sm text-muted-foreground">
           <Trans>No further action is required from you at this time.</Trans>
         </p>
 

apps/remix/app/routes/_recipient+/sign.$token+/waiting.tsx

@@ -78,14 +78,14 @@ export default function WaitingForTurnToSignPage({ loaderData }: Route.Component
           <Trans>Waiting for Your Turn</Trans>
         </h2>
 
-        <p className="text-muted-foreground mt-2 text-sm">
+        <p className="mt-2 text-sm text-muted-foreground">
           <Trans>
             It's currently not your turn to sign. You will receive an email with instructions once
             it's your turn to sign the document.
           </Trans>
         </p>
 
-        <p className="text-muted-foreground mt-4 text-sm">
+        <p className="mt-4 text-sm text-muted-foreground">
           <Trans>Please check your email for updates.</Trans>
         </p>
 

apps/remix/package.json

@@ -36,16 +36,16 @@
     "@lingui/react": "^5.6.0",
     "@oslojs/crypto": "^1.0.1",
     "@oslojs/encoding": "^1.1.0",
-    "@react-router/node": "^7.9.6",
-    "@react-router/serve": "^7.9.6",
-    "@simplewebauthn/browser": "^9.0.1",
-    "@simplewebauthn/server": "^9.0.3",
+    "@react-router/node": "^7.12.0",
+    "@react-router/serve": "^7.12.0",
+    "@simplewebauthn/browser": "^13.2.2",
+    "@simplewebauthn/server": "^13.2.2",
     "@tanstack/react-query": "5.90.10",
     "autoprefixer": "^10.4.22",
     "colord": "^2.9.3",
     "content-disposition": "^1.0.1",
     "framer-motion": "^12.23.24",
-    "hono": "4.10.6",
+    "hono": "4.11.4",
     "hono-rate-limiter": "^0.4.2",
     "hono-react-router-adapter": "^0.6.5",
     "input-otp": "^1.4.2",
@@ -65,7 +65,7 @@
     "react-hotkeys-hook": "^4.6.2",
     "react-icons": "^5.5.0",
     "react-rnd": "^10.5.2",
-    "react-router": "^7.9.6",
+    "react-router": "^7.12.0",
     "recharts": "^2.15.4",
     "remeda": "^2.32.0",
     "remix-themes": "^2.0.4",
@@ -81,14 +81,13 @@
     "@babel/preset-typescript": "^7.28.5",
     "@lingui/babel-plugin-lingui-macro": "^5.6.0",
     "@lingui/vite-plugin": "^5.6.0",
-    "@react-router/dev": "^7.9.6",
-    "@react-router/remix-routes-option-adapter": "^7.9.6",
+    "@react-router/dev": "^7.12.0",
+    "@react-router/remix-routes-option-adapter": "^7.12.0",
     "@rollup/plugin-babel": "^6.1.0",
     "@rollup/plugin-commonjs": "^28.0.9",
     "@rollup/plugin-json": "^6.1.0",
     "@rollup/plugin-node-resolve": "^16.0.3",
     "@rollup/plugin-typescript": "^12.3.0",
-    "@simplewebauthn/types": "^9.0.1",
     "@types/content-disposition": "^0.5.9",
     "@types/formidable": "^3.4.6",
     "@types/luxon": "^3.7.1",
@@ -107,5 +106,5 @@
     "vite-plugin-babel-macros": "^1.0.6",
     "vite-tsconfig-paths": "^5.1.4"
   },
-  "version": "2.3.2"
+  "version": "2.5.0"
 }

apps/remix/vite.config.ts

@@ -67,7 +67,6 @@ export default defineConfig({
       'node_modules',
       '@napi-rs/canvas',
       '@node-rs/bcrypt',
-      '@documenso/pdf-sign',
       'sharp',
       'playwright',
       'playwright-core',
@@ -98,7 +97,6 @@ export default defineConfig({
       external: [
         '@napi-rs/canvas',
         '@node-rs/bcrypt',
-        '@documenso/pdf-sign',
         '@aws-sdk/cloudfront-signer',
         'nodemailer',
         /playwright/,

docker/Dockerfile

@@ -1,7 +1,7 @@
 ###########################
 #     BASE CONTAINER      #
 ###########################
-FROM node:22-alpine3.20 AS base
+FROM node:22-alpine3.22 AS base
 
 RUN apk add --no-cache openssl
 RUN apk add --no-cache font-freefont

docker/README.md

@@ -42,16 +42,17 @@ NEXT_PRIVATE_SIGNING_PASSPHRASE="<your-certificate-password>"
 4. Set up your signing certificate. You have three options:
 
    **Option A: Generate Certificate Inside Container (Recommended)**
-   
+
    Start your containers first, then generate a self-signed certificate:
+
    ```bash
    # Start containers
    docker-compose up -d
-   
+
    # Set certificate password securely (won't appear in command history)
    read -s -p "Enter certificate password: " CERT_PASS
    echo
-   
+
    # Generate certificate inside container using environment variable
    docker exec -e CERT_PASS="$CERT_PASS" -it documenso-production-documenso-1 bash -c "
      openssl req -x509 -nodes -days 365 -newkey rsa:2048 \
@@ -63,19 +64,19 @@ NEXT_PRIVATE_SIGNING_PASSPHRASE="<your-certificate-password>"
        -passout env:CERT_PASS && \
      rm /tmp/private.key /tmp/certificate.crt
    "
-   
+
    # Restart container
    docker-compose restart documenso
    ```
-   
+
    **Option B: Use Existing Certificate**
-   
+
    If you have an existing `.p12` certificate, update the volume binding in `compose.yml`:
+
    ```yaml
    volumes:
      - /path/to/your/cert.p12:/opt/documenso/cert.p12:ro
    ```
-   
 
 5. Run the following command to start the containers:
 
@@ -157,7 +158,6 @@ If you encounter errors related to certificate access, here are common solutions
    docker exec -it <container_name> ls -la /opt/documenso/cert.p12
    ```
 
-
 ### Container Logs
 
 Check application logs for detailed error information:
@@ -202,45 +202,55 @@ The environment variables listed above are a subset of those that are available
 
 Here's a markdown table documenting all the provided environment variables:
 
-| Variable                                     | Description                                                                                         |
-| -------------------------------------------- | --------------------------------------------------------------------------------------------------- |
-| `PORT`                                       | The port to run the Documenso application on, defaults to `3000`.                                   |
-| `NEXTAUTH_SECRET`                            | The secret key used by NextAuth.js for encryption and signing.                                      |
-| `NEXT_PRIVATE_ENCRYPTION_KEY`                | The primary encryption key for symmetric encryption and decryption (at least 32 characters).        |
-| `NEXT_PRIVATE_ENCRYPTION_SECONDARY_KEY`      | The secondary encryption key for symmetric encryption and decryption (at least 32 characters).      |
-| `NEXT_PRIVATE_GOOGLE_CLIENT_ID`              | The Google client ID for Google authentication (optional).                                          |
-| `NEXT_PRIVATE_GOOGLE_CLIENT_SECRET`          | The Google client secret for Google authentication (optional).                                      |
-| `NEXT_PUBLIC_WEBAPP_URL`                     | The URL for the web application.                                                                    |
-| `NEXT_PRIVATE_DATABASE_URL`                  | The URL for the primary database connection (with connection pooling).                              |
-| `NEXT_PRIVATE_DIRECT_DATABASE_URL`           | The URL for the direct database connection (without connection pooling).                            |
-| `NEXT_PRIVATE_SIGNING_TRANSPORT`             | The signing transport to use. Available options: local (default)                                    |
-| `NEXT_PRIVATE_SIGNING_PASSPHRASE`            | The passphrase for the key file.                                                                    |
-| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_CONTENTS`   | The base64-encoded contents of the key file, will be used instead of file path.                     |
-| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH`       | The path to the key file, default `/opt/documenso/cert.p12`.                                        |
-| `NEXT_PUBLIC_UPLOAD_TRANSPORT`               | The transport to use for file uploads (database or s3).                                             |
-| `NEXT_PRIVATE_UPLOAD_ENDPOINT`               | The endpoint for the S3 storage transport (for third-party S3-compatible providers).                |
-| `NEXT_PRIVATE_UPLOAD_FORCE_PATH_STYLE`       | Whether to force path-style URLs for the S3 storage transport.                                      |
-| `NEXT_PRIVATE_UPLOAD_REGION`                 | The region for the S3 storage transport (defaults to us-east-1).                                    |
-| `NEXT_PRIVATE_UPLOAD_BUCKET`                 | The bucket to use for the S3 storage transport.                                                     |
-| `NEXT_PRIVATE_UPLOAD_ACCESS_KEY_ID`          | The access key ID for the S3 storage transport.                                                     |
-| `NEXT_PRIVATE_UPLOAD_SECRET_ACCESS_KEY`      | The secret access key for the S3 storage transport.                                                 |
-| `NEXT_PRIVATE_SMTP_TRANSPORT`                | The transport to use for sending emails (smtp-auth, smtp-api, resend, or mailchannels).             |
-| `NEXT_PRIVATE_SMTP_HOST`                     | The host for the SMTP server for SMTP transports.                                                   |
-| `NEXT_PRIVATE_SMTP_PORT`                     | The port for the SMTP server for SMTP transports.                                                   |
-| `NEXT_PRIVATE_SMTP_USERNAME`                 | The username for the SMTP server for the `smtp-auth` transport.                                     |
-| `NEXT_PRIVATE_SMTP_PASSWORD`                 | The password for the SMTP server for the `smtp-auth` transport.                                     |
-| `NEXT_PRIVATE_SMTP_APIKEY_USER`              | The API key user for the SMTP server for the `smtp-api` transport.                                  |
-| `NEXT_PRIVATE_SMTP_APIKEY`                   | The API key for the SMTP server for the `smtp-api` transport.                                       |
-| `NEXT_PRIVATE_SMTP_SECURE`                   | Whether to force the use of TLS for the SMTP server for SMTP transports.                            |
-| `NEXT_PRIVATE_SMTP_UNSAFE_IGNORE_TLS`        | If true, then no TLS will be used (even if STARTTLS is supported)                                   |
-| `NEXT_PRIVATE_SMTP_FROM_ADDRESS`             | The email address for the "from" address.                                                           |
-| `NEXT_PRIVATE_SMTP_FROM_NAME`                | The sender name for the "from" address.                                                             |
-| `NEXT_PRIVATE_RESEND_API_KEY`                | The API key for Resend.com for the `resend` transport.                                              |
-| `NEXT_PRIVATE_MAILCHANNELS_API_KEY`          | The optional API key for MailChannels (if using a proxy) for the `mailchannels` transport.          |
-| `NEXT_PRIVATE_MAILCHANNELS_ENDPOINT`         | The optional endpoint for the MailChannels API (if using a proxy) for the `mailchannels` transport. |
-| `NEXT_PRIVATE_MAILCHANNELS_DKIM_DOMAIN`      | The domain for DKIM signing with MailChannels for the `mailchannels` transport.                     |
-| `NEXT_PRIVATE_MAILCHANNELS_DKIM_SELECTOR`    | The selector for DKIM signing with MailChannels for the `mailchannels` transport.                   |
-| `NEXT_PRIVATE_MAILCHANNELS_DKIM_PRIVATE_KEY` | The private key for DKIM signing with MailChannels for the `mailchannels` transport.                |
-| `NEXT_PUBLIC_DOCUMENT_SIZE_UPLOAD_LIMIT`     | The maximum document upload limit displayed to the user (in MB).                                    |
-| `NEXT_PUBLIC_POSTHOG_KEY`                    | The optional PostHog key for analytics and feature flags.                                           |
-| `NEXT_PUBLIC_DISABLE_SIGNUP`                 | Whether to disable user signups through the /signup page.                                           |
+| Variable                                                       | Description                                                                                         |
+| -------------------------------------------------------------- | --------------------------------------------------------------------------------------------------- |
+| `PORT`                                                         | The port to run the Documenso application on, defaults to `3000`.                                   |
+| `NEXTAUTH_SECRET`                                              | The secret key used by NextAuth.js for encryption and signing.                                      |
+| `NEXT_PRIVATE_ENCRYPTION_KEY`                                  | The primary encryption key for symmetric encryption and decryption (at least 32 characters).        |
+| `NEXT_PRIVATE_ENCRYPTION_SECONDARY_KEY`                        | The secondary encryption key for symmetric encryption and decryption (at least 32 characters).      |
+| `NEXT_PRIVATE_GOOGLE_CLIENT_ID`                                | The Google client ID for Google authentication (optional).                                          |
+| `NEXT_PRIVATE_GOOGLE_CLIENT_SECRET`                            | The Google client secret for Google authentication (optional).                                      |
+| `NEXT_PUBLIC_WEBAPP_URL`                                       | The URL for the web application.                                                                    |
+| `NEXT_PRIVATE_DATABASE_URL`                                    | The URL for the primary database connection (with connection pooling).                              |
+| `NEXT_PRIVATE_DIRECT_DATABASE_URL`                             | The URL for the direct database connection (without connection pooling).                            |
+| `NEXT_PRIVATE_SIGNING_TRANSPORT`                               | The signing transport to use. Available options: local (default), gcloud-hsm                        |
+| `NEXT_PRIVATE_SIGNING_PASSPHRASE`                              | The passphrase for the key file.                                                                    |
+| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_CONTENTS`                     | The base64-encoded contents of the key file, will be used instead of file path.                     |
+| `NEXT_PRIVATE_SIGNING_LOCAL_FILE_PATH`                         | The path to the key file, default `/opt/documenso/cert.p12`.                                        |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_KEY_PATH`                     | The Google Cloud HSM key path for the gcloud-hsm signing transport.                                 |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_PUBLIC_CRT_FILE_PATH`         | The path to the Google Cloud HSM public certificate file for the gcloud-hsm transport.              |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_PUBLIC_CRT_FILE_CONTENTS`     | The base64-encoded Google Cloud HSM public certificate for the gcloud-hsm transport.                |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_APPLICATION_CREDENTIALS_CONTENTS` | The base64-encoded Google Cloud Credentials for the gcloud-hsm transport.                           |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_CERT_CHAIN_FILE_PATH`         | The path to the certificate chain file for the gcloud-hsm transport.                                |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_CERT_CHAIN_CONTENTS`          | The base64-encoded certificate chain for the gcloud-hsm transport.                                  |
+| `NEXT_PRIVATE_SIGNING_GCLOUD_HSM_SECRET_MANAGER_CERT_PATH`     | The Google Secret Manager path to retrieve the certificate for the gcloud-hsm transport.            |
+| `NEXT_PRIVATE_SIGNING_TIMESTAMP_AUTHORITY`                     | Comma-separated list of timestamp authority URLs for PDF signing (enables LTV).                     |
+| `NEXT_PUBLIC_SIGNING_CONTACT_INFO`                             | Contact info to embed in PDF signatures. Defaults to the webapp URL.                                |
+| `NEXT_PRIVATE_USE_LEGACY_SIGNING_SUBFILTER`                    | Set to "true" to use legacy adbe.pkcs7.detached subfilter instead of ETSI.CAdES.detached.           |
+| `NEXT_PUBLIC_UPLOAD_TRANSPORT`                                 | The transport to use for file uploads (database or s3).                                             |
+| `NEXT_PRIVATE_UPLOAD_ENDPOINT`                                 | The endpoint for the S3 storage transport (for third-party S3-compatible providers).                |
+| `NEXT_PRIVATE_UPLOAD_FORCE_PATH_STYLE`                         | Whether to force path-style URLs for the S3 storage transport.                                      |
+| `NEXT_PRIVATE_UPLOAD_REGION`                                   | The region for the S3 storage transport (defaults to us-east-1).                                    |
+| `NEXT_PRIVATE_UPLOAD_BUCKET`                                   | The bucket to use for the S3 storage transport.                                                     |
+| `NEXT_PRIVATE_UPLOAD_ACCESS_KEY_ID`                            | The access key ID for the S3 storage transport.                                                     |
+| `NEXT_PRIVATE_UPLOAD_SECRET_ACCESS_KEY`                        | The secret access key for the S3 storage transport.                                                 |
+| `NEXT_PRIVATE_SMTP_TRANSPORT`                                  | The transport to use for sending emails (smtp-auth, smtp-api, resend, or mailchannels).             |
+| `NEXT_PRIVATE_SMTP_HOST`                                       | The host for the SMTP server for SMTP transports.                                                   |
+| `NEXT_PRIVATE_SMTP_PORT`                                       | The port for the SMTP server for SMTP transports.                                                   |
+| `NEXT_PRIVATE_SMTP_USERNAME`                                   | The username for the SMTP server for the `smtp-auth` transport.                                     |
+| `NEXT_PRIVATE_SMTP_PASSWORD`                                   | The password for the SMTP server for the `smtp-auth` transport.                                     |
+| `NEXT_PRIVATE_SMTP_APIKEY_USER`                                | The API key user for the SMTP server for the `smtp-api` transport.                                  |
+| `NEXT_PRIVATE_SMTP_APIKEY`                                     | The API key for the SMTP server for the `smtp-api` transport.                                       |
+| `NEXT_PRIVATE_SMTP_SECURE`                                     | Whether to force the use of TLS for the SMTP server for SMTP transports.                            |
+| `NEXT_PRIVATE_SMTP_UNSAFE_IGNORE_TLS`                          | If true, then no TLS will be used (even if STARTTLS is supported)                                   |
+| `NEXT_PRIVATE_SMTP_FROM_ADDRESS`                               | The email address for the "from" address.                                                           |
+| `NEXT_PRIVATE_SMTP_FROM_NAME`                                  | The sender name for the "from" address.                                                             |
+| `NEXT_PRIVATE_RESEND_API_KEY`                                  | The API key for Resend.com for the `resend` transport.                                              |
+| `NEXT_PRIVATE_MAILCHANNELS_API_KEY`                            | The optional API key for MailChannels (if using a proxy) for the `mailchannels` transport.          |
+| `NEXT_PRIVATE_MAILCHANNELS_ENDPOINT`                           | The optional endpoint for the MailChannels API (if using a proxy) for the `mailchannels` transport. |
+| `NEXT_PRIVATE_MAILCHANNELS_DKIM_DOMAIN`                        | The domain for DKIM signing with MailChannels for the `mailchannels` transport.                     |
+| `NEXT_PRIVATE_MAILCHANNELS_DKIM_SELECTOR`                      | The selector for DKIM signing with MailChannels for the `mailchannels` transport.                   |
+| `NEXT_PRIVATE_MAILCHANNELS_DKIM_PRIVATE_KEY`                   | The private key for DKIM signing with MailChannels for the `mailchannels` transport.                |
+| `NEXT_PUBLIC_DOCUMENT_SIZE_UPLOAD_LIMIT`                       | The maximum document upload limit displayed to the user (in MB).                                    |
+| `NEXT_PUBLIC_POSTHOG_KEY`                                      | The optional PostHog key for analytics and feature flags.                                           |
+| `NEXT_PUBLIC_DISABLE_SIGNUP`                                   | Whether to disable user signups through the /signup page.                                           |

package.json

@@ -5,7 +5,7 @@
     "apps/*",
     "packages/*"
   ],
-  "version": "2.3.2",
+  "version": "2.5.0",
   "scripts": {
     "postinstall": "patch-package",
     "build": "turbo run build",
@@ -64,7 +64,7 @@
     "lint-staged": "^16.2.7",
     "nanoid": "^5.1.6",
     "nodemailer": "^7.0.10",
-    "pdfjs-dist": "5.4.449",
+    "pdfjs-dist": "5.4.296",
     "pino": "^9.14.0",
     "pino-pretty": "^13.1.2",
     "playwright": "1.56.1",
@@ -85,8 +85,8 @@
   },
   "dependencies": {
     "@ai-sdk/google-vertex": "3.0.81",
-    "@documenso/pdf-sign": "^0.1.0",
     "@documenso/prisma": "*",
+    "@libpdf/core": "^0.2.2",
     "@lingui/conf": "^5.6.0",
     "@lingui/core": "^5.6.0",
     "ai": "^5.0.104",
@@ -99,7 +99,7 @@
     "zod": "^3.25.76"
   },
   "overrides": {
-    "pdfjs-dist": "5.4.449",
+    "pdfjs-dist": "5.4.296",
     "typescript": "5.6.2",
     "zod": "^3.25.76"
   }

packages/api/v1/implementation.ts

@@ -41,7 +41,7 @@ import {
   ZTextFieldMeta,
 } from '@documenso/lib/types/field-meta';
 import { getFileServerSide } from '@documenso/lib/universal/upload/get-file.server';
-import { putPdfFileServerSide } from '@documenso/lib/universal/upload/put-file.server';
+import { putNormalizedPdfFileServerSide } from '@documenso/lib/universal/upload/put-file.server';
 import {
   getPresignGetUrl,
   getPresignPostUrl,
@@ -822,7 +822,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
           formValues: body.formValues,
         });
 
-        const newDocumentData = await putPdfFileServerSide({
+        const newDocumentData = await putNormalizedPdfFileServerSide({
           name: fileName,
           type: 'application/pdf',
           arrayBuffer: async () => Promise.resolve(prefilled),
@@ -911,61 +911,13 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
             title: body.title,
             ...body.meta,
           },
+          formValues: body.formValues,
           requestMetadata: metadata,
         });
       } catch (err) {
         return AppError.toRestAPIError(err);
       }
 
-      if (envelope.envelopeItems.length !== 1) {
-        throw new Error('API V1 does not support envelopes');
-      }
-
-      const firstEnvelopeDocumentData = await prisma.envelopeItem.findFirstOrThrow({
-        where: {
-          envelopeId: envelope.id,
-        },
-        include: {
-          documentData: true,
-        },
-      });
-
-      if (body.formValues) {
-        const fileName = envelope.title.endsWith('.pdf') ? envelope.title : `${envelope.title}.pdf`;
-
-        const pdf = await getFileServerSide(firstEnvelopeDocumentData.documentData);
-
-        const prefilled = await insertFormValuesInPdf({
-          pdf: Buffer.from(pdf),
-          formValues: body.formValues,
-        });
-
-        const newDocumentData = await putPdfFileServerSide({
-          name: fileName,
-          type: 'application/pdf',
-          arrayBuffer: async () => Promise.resolve(prefilled),
-        });
-
-        await prisma.envelope.update({
-          where: {
-            id: envelope.id,
-          },
-          data: {
-            formValues: body.formValues,
-            envelopeItems: {
-              update: {
-                where: {
-                  id: firstEnvelopeDocumentData.id,
-                },
-                data: {
-                  documentDataId: newDocumentData.id,
-                },
-              },
-            },
-          },
-        });
-      }
-
       if (body.authOptions) {
         await prisma.envelope.update({
           where: {
@@ -1089,12 +1041,7 @@ export const ApiContractV1Implementation = tsr.router(ApiContractV1, {
         },
       };
     } catch (err) {
-      return {
-        status: 500,
-        body: {
-          message: 'An error has occured while sending the document for signing',
-        },
-      };
+      return AppError.toRestAPIError(err);
     }
   }),
 

packages/app-tests/e2e/api/v1/document-sending.spec.ts

@@ -4,7 +4,11 @@ import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
 import { createApiToken } from '@documenso/lib/server-only/public-api/create-api-token';
 import { mapSecondaryIdToDocumentId } from '@documenso/lib/utils/envelope';
 import { prisma } from '@documenso/prisma';
-import { seedPendingDocumentWithFullFields } from '@documenso/prisma/seed/documents';
+import { FieldType, RecipientRole } from '@documenso/prisma/client';
+import {
+  seedBlankDocument,
+  seedPendingDocumentWithFullFields,
+} from '@documenso/prisma/seed/documents';
 import { seedUser } from '@documenso/prisma/seed/users';
 
 test.describe('Document API', () => {
@@ -145,4 +149,293 @@ test.describe('Document API', () => {
       ownerDocumentCompleted: false,
     });
   });
+
+  test('sendDocument: should fail when signer has no signature field', async ({ request }) => {
+    const { user, team } = await seedUser();
+
+    // Create a blank document and get it with envelope items
+    const blankDocument = await seedBlankDocument(user, team.id);
+    const document = await prisma.envelope.findUniqueOrThrow({
+      where: { id: blankDocument.id },
+      include: { envelopeItems: true },
+    });
+
+    // Add a signer recipient without any fields
+    await prisma.recipient.create({
+      data: {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        token: 'test-token-1',
+        envelopeId: document.id,
+      },
+    });
+
+    const { token } = await createApiToken({
+      userId: user.id,
+      teamId: team.id,
+      tokenName: 'test',
+      expiresIn: null,
+    });
+
+    const response = await request.post(
+      `${NEXT_PUBLIC_WEBAPP_URL()}/api/v1/documents/${mapSecondaryIdToDocumentId(document.secondaryId)}/send`,
+      {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        data: {},
+      },
+    );
+
+    expect(response.ok()).toBeFalsy();
+    expect(response.status()).toBe(400);
+  });
+
+  test('sendDocument: should fail when signer has only non-signature fields', async ({
+    request,
+  }) => {
+    const { user, team } = await seedUser();
+
+    // Create a blank document and get it with envelope items
+    const blankDocument = await seedBlankDocument(user, team.id);
+    const document = await prisma.envelope.findUniqueOrThrow({
+      where: { id: blankDocument.id },
+      include: { envelopeItems: true },
+    });
+
+    // Add a signer recipient with only a TEXT field (not signature)
+    const recipient = await prisma.recipient.create({
+      data: {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        token: 'test-token-2',
+        envelopeId: document.id,
+      },
+    });
+
+    // Add a TEXT field (not a signature field)
+    await prisma.field.create({
+      data: {
+        type: FieldType.TEXT,
+        page: 1,
+        positionX: 100,
+        positionY: 100,
+        width: 50,
+        height: 50,
+        customText: '',
+        inserted: false,
+        recipientId: recipient.id,
+        envelopeId: document.id,
+        envelopeItemId: document.envelopeItems[0].id,
+      },
+    });
+
+    const { token } = await createApiToken({
+      userId: user.id,
+      teamId: team.id,
+      tokenName: 'test',
+      expiresIn: null,
+    });
+
+    const response = await request.post(
+      `${NEXT_PUBLIC_WEBAPP_URL()}/api/v1/documents/${mapSecondaryIdToDocumentId(document.secondaryId)}/send`,
+      {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        data: {},
+      },
+    );
+
+    expect(response.ok()).toBeFalsy();
+    expect(response.status()).toBe(400);
+  });
+
+  test('sendDocument: should succeed when signer has signature field', async ({ request }) => {
+    const { user, team } = await seedUser();
+
+    const { document } = await seedPendingDocumentWithFullFields({
+      owner: user,
+      recipients: ['signer@example.com'],
+      teamId: team.id,
+    });
+
+    const { token } = await createApiToken({
+      userId: user.id,
+      teamId: team.id,
+      tokenName: 'test',
+      expiresIn: null,
+    });
+
+    const response = await request.post(
+      `${NEXT_PUBLIC_WEBAPP_URL()}/api/v1/documents/${mapSecondaryIdToDocumentId(document.secondaryId)}/send`,
+      {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        data: {},
+      },
+    );
+
+    expect(response.ok()).toBeTruthy();
+    expect(response.status()).toBe(200);
+  });
+
+  test('sendDocument: should succeed when signer has FREE_SIGNATURE field', async ({ request }) => {
+    const { user, team } = await seedUser();
+
+    // Create a blank document and get it with envelope items
+    const blankDocument = await seedBlankDocument(user, team.id);
+    const document = await prisma.envelope.findUniqueOrThrow({
+      where: { id: blankDocument.id },
+      include: { envelopeItems: true },
+    });
+
+    // Add a signer recipient
+    const recipient = await prisma.recipient.create({
+      data: {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        token: 'test-token-3',
+        envelopeId: document.id,
+      },
+    });
+
+    // Add a FREE_SIGNATURE field
+    await prisma.field.create({
+      data: {
+        type: FieldType.FREE_SIGNATURE,
+        page: 1,
+        positionX: 100,
+        positionY: 100,
+        width: 50,
+        height: 50,
+        customText: '',
+        inserted: false,
+        recipientId: recipient.id,
+        envelopeId: document.id,
+        envelopeItemId: document.envelopeItems[0].id,
+      },
+    });
+
+    const { token } = await createApiToken({
+      userId: user.id,
+      teamId: team.id,
+      tokenName: 'test',
+      expiresIn: null,
+    });
+
+    const response = await request.post(
+      `${NEXT_PUBLIC_WEBAPP_URL()}/api/v1/documents/${mapSecondaryIdToDocumentId(document.secondaryId)}/send`,
+      {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        data: {},
+      },
+    );
+
+    expect(response.ok()).toBeTruthy();
+    expect(response.status()).toBe(200);
+  });
+
+  test('sendDocument: should succeed when non-signer roles have no fields', async ({ request }) => {
+    const { user, team } = await seedUser();
+
+    // Create a blank document and get it with envelope items
+    const blankDocument = await seedBlankDocument(user, team.id);
+    const document = await prisma.envelope.findUniqueOrThrow({
+      where: { id: blankDocument.id },
+      include: { envelopeItems: true },
+    });
+
+    // Add a signer with signature field
+    const signer = await prisma.recipient.create({
+      data: {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        token: 'test-token-4',
+        envelopeId: document.id,
+      },
+    });
+
+    await prisma.field.create({
+      data: {
+        type: FieldType.SIGNATURE,
+        page: 1,
+        positionX: 1,
+        positionY: 1,
+        width: 1,
+        height: 1,
+        customText: '',
+        inserted: false,
+        recipientId: signer.id,
+        envelopeId: document.id,
+        envelopeItemId: document.envelopeItems[0].id,
+        fieldMeta: { type: 'signature', fontSize: 14 },
+      },
+    });
+
+    // Add a viewer without any fields
+    await prisma.recipient.create({
+      data: {
+        email: 'viewer@example.com',
+        name: 'Test Viewer',
+        role: RecipientRole.VIEWER,
+        token: 'test-token-5',
+        envelopeId: document.id,
+      },
+    });
+
+    // Add an approver without any fields
+    await prisma.recipient.create({
+      data: {
+        email: 'approver@example.com',
+        name: 'Test Approver',
+        role: RecipientRole.APPROVER,
+        token: 'test-token-6',
+        envelopeId: document.id,
+      },
+    });
+
+    // Add a CC without any fields
+    await prisma.recipient.create({
+      data: {
+        email: 'cc@example.com',
+        name: 'Test CC',
+        role: RecipientRole.CC,
+        token: 'test-token-7',
+        envelopeId: document.id,
+      },
+    });
+
+    const { token } = await createApiToken({
+      userId: user.id,
+      teamId: team.id,
+      tokenName: 'test',
+      expiresIn: null,
+    });
+
+    const response = await request.post(
+      `${NEXT_PUBLIC_WEBAPP_URL()}/api/v1/documents/${mapSecondaryIdToDocumentId(document.secondaryId)}/send`,
+      {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        data: {},
+      },
+    );
+
+    expect(response.ok()).toBeTruthy();
+    expect(response.status()).toBe(200);
+  });
 });

packages/app-tests/e2e/api/v1/template-field-prefill.spec.ts

@@ -171,6 +171,24 @@ test.describe('Template Field Prefill API v1', () => {
       },
     });
 
+    // Add SIGNATURE field (required for distribution)
+    await prisma.field.create({
+      data: {
+        envelopeId: template.id,
+        envelopeItemId: firstEnvelopeItem.id,
+        recipientId: recipient.id,
+        type: FieldType.SIGNATURE,
+        page: 1,
+        positionX: 1,
+        positionY: 1,
+        width: 1,
+        height: 1,
+        customText: '',
+        inserted: false,
+        fieldMeta: { type: 'signature', fontSize: 14 },
+      },
+    });
+
     // 6. Sign in as the user
     await apiSignin({
       page,
@@ -444,6 +462,24 @@ test.describe('Template Field Prefill API v1', () => {
       },
     });
 
+    // Add SIGNATURE field (required for distribution)
+    await prisma.field.create({
+      data: {
+        envelopeId: template.id,
+        envelopeItemId: firstEnvelopeItem.id,
+        recipientId: recipient.id,
+        type: FieldType.SIGNATURE,
+        page: 1,
+        positionX: 1,
+        positionY: 1,
+        width: 1,
+        height: 1,
+        customText: '',
+        inserted: false,
+        fieldMeta: { type: 'signature', fontSize: 14 },
+      },
+    });
+
     // 6. Sign in as the user
     await apiSignin({
       page,

packages/app-tests/e2e/api/v1/test-unauthorized-api-access.spec.ts

@@ -221,7 +221,7 @@ test.describe('Document Access API V1', () => {
       );
 
       expect(resB.ok()).toBeFalsy();
-      expect(resB.status()).toBe(500);
+      expect(resB.status()).toBe(404);
     });
 
     test('should allow authorized access to document send endpoint', async ({ request }) => {

packages/app-tests/e2e/api/v2/distribute-validation.spec.ts

@@ -0,0 +1,403 @@
+import { type APIRequestContext, expect, test } from '@playwright/test';
+import type { Team, User } from '@prisma/client';
+import fs from 'node:fs';
+import path from 'node:path';
+
+import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
+import { createApiToken } from '@documenso/lib/server-only/public-api/create-api-token';
+import { EnvelopeType, FieldType, RecipientRole } from '@documenso/prisma/client';
+import { seedUser } from '@documenso/prisma/seed/users';
+import type {
+  TCreateEnvelopePayload,
+  TCreateEnvelopeResponse,
+} from '@documenso/trpc/server/envelope-router/create-envelope.types';
+import type { TCreateEnvelopeRecipientsRequest } from '@documenso/trpc/server/envelope-router/envelope-recipients/create-envelope-recipients.types';
+import type { TGetEnvelopeResponse } from '@documenso/trpc/server/envelope-router/get-envelope.types';
+
+const WEBAPP_BASE_URL = NEXT_PUBLIC_WEBAPP_URL();
+const baseUrl = `${WEBAPP_BASE_URL}/api/v2-beta`;
+
+test.describe.configure({
+  mode: 'parallel',
+});
+
+test.describe('Envelope distribute validation', () => {
+  let user: User, team: Team, token: string;
+
+  test.beforeEach(async () => {
+    ({ user, team } = await seedUser());
+    ({ token } = await createApiToken({
+      userId: user.id,
+      teamId: team.id,
+      tokenName: 'test',
+      expiresIn: null,
+    }));
+  });
+
+  const createEnvelope = async (request: APIRequestContext, authToken: string) => {
+    const payload: TCreateEnvelopePayload = {
+      type: EnvelopeType.DOCUMENT,
+      title: 'Test Document',
+    };
+
+    const formData = new FormData();
+    formData.append('payload', JSON.stringify(payload));
+
+    const pdfData = fs.readFileSync(path.join(__dirname, '../../../../../assets/example.pdf'));
+    formData.append('files', new File([pdfData], 'test.pdf', { type: 'application/pdf' }));
+
+    const res = await request.post(`${baseUrl}/envelope/create`, {
+      headers: { Authorization: `Bearer ${authToken}` },
+      multipart: formData,
+    });
+
+    expect(res.ok()).toBeTruthy();
+    return (await res.json()) as TCreateEnvelopeResponse;
+  };
+
+  const getEnvelope = async (request: APIRequestContext, authToken: string, envelopeId: string) => {
+    const res = await request.get(`${baseUrl}/envelope/${envelopeId}`, {
+      headers: { Authorization: `Bearer ${authToken}` },
+    });
+
+    expect(res.ok()).toBeTruthy();
+    return (await res.json()) as TGetEnvelopeResponse;
+  };
+
+  const createRecipients = async (
+    request: APIRequestContext,
+    authToken: string,
+    envelopeId: string,
+    recipients: TCreateEnvelopeRecipientsRequest['data'],
+  ) => {
+    const res = await request.post(`${baseUrl}/envelope/recipient/create-many`, {
+      headers: { Authorization: `Bearer ${authToken}` },
+      data: {
+        envelopeId,
+        data: recipients,
+      } satisfies TCreateEnvelopeRecipientsRequest,
+    });
+
+    expect(res.ok()).toBeTruthy();
+    return (await res.json()).data;
+  };
+
+  const createFields = async (
+    request: APIRequestContext,
+    authToken: string,
+    envelopeId: string,
+    envelopeItemId: string,
+    fields: Array<{ recipientId: number; type: FieldType }>,
+  ) => {
+    const res = await request.post(`${baseUrl}/envelope/field/create-many`, {
+      headers: { Authorization: `Bearer ${authToken}` },
+      data: {
+        envelopeId,
+        data: fields.map((field, index) => ({
+          recipientId: field.recipientId,
+          envelopeItemId,
+          type: field.type,
+          page: 1,
+          positionX: 10,
+          positionY: 10 + index * 10,
+          width: 10,
+          height: 10,
+        })),
+      },
+    });
+
+    expect(res.ok()).toBeTruthy();
+    return (await res.json()).data;
+  };
+
+  test('should fail to distribute when signer has no fields', async ({ request }) => {
+    const envelope = await createEnvelope(request, token);
+
+    // Create a signer without any fields
+    await createRecipients(request, token, envelope.id, [
+      {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+    ]);
+
+    // Try to distribute without adding any fields
+    const distributeRes = await request.post(`${baseUrl}/envelope/distribute`, {
+      headers: { Authorization: `Bearer ${token}` },
+      data: { envelopeId: envelope.id },
+    });
+
+    expect(distributeRes.ok()).toBeFalsy();
+    expect(distributeRes.status()).toBe(400);
+
+    const errorResponse = await distributeRes.json();
+    expect(errorResponse.message).toContain('missing required fields');
+    expect(errorResponse.message).toContain('Signers must have at least one signature field');
+  });
+
+  test('should fail to distribute when signer has non-signature fields only', async ({
+    request,
+  }) => {
+    const envelope = await createEnvelope(request, token);
+    const envelopeData = await getEnvelope(request, token, envelope.id);
+
+    // Create a signer
+    const recipients = await createRecipients(request, token, envelope.id, [
+      {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+    ]);
+
+    // Add only a TEXT field (not a signature field)
+    await createFields(request, token, envelope.id, envelopeData.envelopeItems[0].id, [
+      { recipientId: recipients[0].id, type: FieldType.TEXT },
+    ]);
+
+    // Try to distribute
+    const distributeRes = await request.post(`${baseUrl}/envelope/distribute`, {
+      headers: { Authorization: `Bearer ${token}` },
+      data: { envelopeId: envelope.id },
+    });
+
+    expect(distributeRes.ok()).toBeFalsy();
+    expect(distributeRes.status()).toBe(400);
+
+    const errorResponse = await distributeRes.json();
+    expect(errorResponse.message).toContain('missing required fields');
+  });
+
+  test('should succeed when signer has SIGNATURE field', async ({ request }) => {
+    const envelope = await createEnvelope(request, token);
+    const envelopeData = await getEnvelope(request, token, envelope.id);
+
+    // Create a signer
+    const recipients = await createRecipients(request, token, envelope.id, [
+      {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+    ]);
+
+    // Add a SIGNATURE field
+    await createFields(request, token, envelope.id, envelopeData.envelopeItems[0].id, [
+      { recipientId: recipients[0].id, type: FieldType.SIGNATURE },
+    ]);
+
+    // Distribute should succeed
+    const distributeRes = await request.post(`${baseUrl}/envelope/distribute`, {
+      headers: { Authorization: `Bearer ${token}` },
+      data: { envelopeId: envelope.id },
+    });
+
+    expect(distributeRes.ok()).toBeTruthy();
+    expect(distributeRes.status()).toBe(200);
+
+    const response = await distributeRes.json();
+    expect(response.success).toBe(true);
+  });
+
+  // Note: FREE_SIGNATURE field type is not supported via the v2 API for field creation,
+  // so we only test with SIGNATURE fields here. The v1 tests cover FREE_SIGNATURE
+  // using direct Prisma creation.
+
+  test('should succeed when VIEWER has no fields', async ({ request }) => {
+    const envelope = await createEnvelope(request, token);
+    const envelopeData = await getEnvelope(request, token, envelope.id);
+
+    // Create a signer and a viewer
+    const recipients = await createRecipients(request, token, envelope.id, [
+      {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+      {
+        email: 'viewer@example.com',
+        name: 'Test Viewer',
+        role: RecipientRole.VIEWER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+    ]);
+
+    // Add signature field only for the signer (viewer has no fields)
+    await createFields(request, token, envelope.id, envelopeData.envelopeItems[0].id, [
+      { recipientId: recipients[0].id, type: FieldType.SIGNATURE },
+    ]);
+
+    // Distribute should succeed
+    const distributeRes = await request.post(`${baseUrl}/envelope/distribute`, {
+      headers: { Authorization: `Bearer ${token}` },
+      data: { envelopeId: envelope.id },
+    });
+
+    expect(distributeRes.ok()).toBeTruthy();
+    expect(distributeRes.status()).toBe(200);
+  });
+
+  test('should succeed when CC has no fields', async ({ request }) => {
+    const envelope = await createEnvelope(request, token);
+    const envelopeData = await getEnvelope(request, token, envelope.id);
+
+    // Create a signer and a CC recipient
+    const recipients = await createRecipients(request, token, envelope.id, [
+      {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+      {
+        email: 'cc@example.com',
+        name: 'Test CC',
+        role: RecipientRole.CC,
+        accessAuth: [],
+        actionAuth: [],
+      },
+    ]);
+
+    // Add signature field only for the signer (CC has no fields)
+    await createFields(request, token, envelope.id, envelopeData.envelopeItems[0].id, [
+      { recipientId: recipients[0].id, type: FieldType.SIGNATURE },
+    ]);
+
+    // Distribute should succeed
+    const distributeRes = await request.post(`${baseUrl}/envelope/distribute`, {
+      headers: { Authorization: `Bearer ${token}` },
+      data: { envelopeId: envelope.id },
+    });
+
+    expect(distributeRes.ok()).toBeTruthy();
+    expect(distributeRes.status()).toBe(200);
+  });
+
+  test('should succeed when APPROVER has no fields', async ({ request }) => {
+    const envelope = await createEnvelope(request, token);
+    const envelopeData = await getEnvelope(request, token, envelope.id);
+
+    // Create a signer and an approver
+    const recipients = await createRecipients(request, token, envelope.id, [
+      {
+        email: 'signer@example.com',
+        name: 'Test Signer',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+      {
+        email: 'approver@example.com',
+        name: 'Test Approver',
+        role: RecipientRole.APPROVER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+    ]);
+
+    // Add signature field only for the signer (approver has no fields)
+    await createFields(request, token, envelope.id, envelopeData.envelopeItems[0].id, [
+      { recipientId: recipients[0].id, type: FieldType.SIGNATURE },
+    ]);
+
+    // Distribute should succeed
+    const distributeRes = await request.post(`${baseUrl}/envelope/distribute`, {
+      headers: { Authorization: `Bearer ${token}` },
+      data: { envelopeId: envelope.id },
+    });
+
+    expect(distributeRes.ok()).toBeTruthy();
+    expect(distributeRes.status()).toBe(200);
+  });
+
+  test('should fail when one of multiple signers is missing signature field', async ({
+    request,
+  }) => {
+    const envelope = await createEnvelope(request, token);
+    const envelopeData = await getEnvelope(request, token, envelope.id);
+
+    // Create two signers
+    const recipients = await createRecipients(request, token, envelope.id, [
+      {
+        email: 'signer1@example.com',
+        name: 'Test Signer 1',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+      {
+        email: 'signer2@example.com',
+        name: 'Test Signer 2',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+    ]);
+
+    // Add signature field only for the first signer
+    await createFields(request, token, envelope.id, envelopeData.envelopeItems[0].id, [
+      { recipientId: recipients[0].id, type: FieldType.SIGNATURE },
+    ]);
+
+    // Distribute should fail because second signer has no signature field
+    const distributeRes = await request.post(`${baseUrl}/envelope/distribute`, {
+      headers: { Authorization: `Bearer ${token}` },
+      data: { envelopeId: envelope.id },
+    });
+
+    expect(distributeRes.ok()).toBeFalsy();
+    expect(distributeRes.status()).toBe(400);
+
+    const errorResponse = await distributeRes.json();
+    expect(errorResponse.message).toContain('missing required fields');
+  });
+
+  test('should succeed when all signers have signature fields', async ({ request }) => {
+    const envelope = await createEnvelope(request, token);
+    const envelopeData = await getEnvelope(request, token, envelope.id);
+
+    // Create two signers
+    const recipients = await createRecipients(request, token, envelope.id, [
+      {
+        email: 'signer1@example.com',
+        name: 'Test Signer 1',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+      {
+        email: 'signer2@example.com',
+        name: 'Test Signer 2',
+        role: RecipientRole.SIGNER,
+        accessAuth: [],
+        actionAuth: [],
+      },
+    ]);
+
+    // Add signature fields for both signers
+    await createFields(request, token, envelope.id, envelopeData.envelopeItems[0].id, [
+      { recipientId: recipients[0].id, type: FieldType.SIGNATURE },
+      { recipientId: recipients[1].id, type: FieldType.SIGNATURE },
+    ]);
+
+    // Distribute should succeed
+    const distributeRes = await request.post(`${baseUrl}/envelope/distribute`, {
+      headers: { Authorization: `Bearer ${token}` },
+      data: { envelopeId: envelope.id },
+    });
+
+    expect(distributeRes.ok()).toBeTruthy();
+    expect(distributeRes.status()).toBe(200);
+  });
+});

packages/app-tests/e2e/api/v2/template-field-prefill.spec.ts

@@ -171,6 +171,24 @@ test.describe('Template Field Prefill API v2', () => {
       },
     });
 
+    // Add SIGNATURE field (required for distribution)
+    await prisma.field.create({
+      data: {
+        envelopeId: template.id,
+        envelopeItemId: firstEnvelopeItem.id,
+        recipientId: recipient.id,
+        type: FieldType.SIGNATURE,
+        page: 1,
+        positionX: 1,
+        positionY: 1,
+        width: 1,
+        height: 1,
+        customText: '',
+        inserted: false,
+        fieldMeta: { type: 'signature', fontSize: 14 },
+      },
+    });
+
     // 6. Sign in as the user
     await apiSignin({
       page,
@@ -441,6 +459,24 @@ test.describe('Template Field Prefill API v2', () => {
       },
     });
 
+    // Add SIGNATURE field (required for distribution)
+    await prisma.field.create({
+      data: {
+        envelopeId: template.id,
+        envelopeItemId: firstEnvelopeItem.id,
+        recipientId: recipient.id,
+        type: FieldType.SIGNATURE,
+        page: 1,
+        positionX: 1,
+        positionY: 1,
+        width: 1,
+        height: 1,
+        customText: '',
+        inserted: false,
+        fieldMeta: { type: 'signature', fontSize: 14 },
+      },
+    });
+
     // 6. Sign in as the user
     await apiSignin({
       page,

packages/app-tests/e2e/api/v2/test-unauthorized-api-access.spec.ts

@@ -195,6 +195,31 @@ test.describe('Document API V2', () => {
     }) => {
       const doc = await seedDraftDocument(userA, teamA.id, ['test@example.com']);
 
+      // Get the recipient created during seeding.
+      const recipient = await prisma.recipient.findFirstOrThrow({
+        where: {
+          envelopeId: doc.id,
+        },
+      });
+
+      // Create a signature field for the recipient so distribution validation can run.
+      await prisma.field.create({
+        data: {
+          envelopeId: doc.id,
+          envelopeItemId: doc.envelopeItems[0].id,
+          recipientId: recipient.id,
+          type: FieldType.SIGNATURE,
+          page: 1,
+          positionX: 1,
+          positionY: 1,
+          width: 1,
+          height: 1,
+          customText: '',
+          inserted: false,
+          fieldMeta: { type: 'signature', fontSize: 14 },
+        },
+      });
+
       const res = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/document/distribute`, {
         headers: { Authorization: `Bearer ${tokenB}` },
         data: { documentId: mapSecondaryIdToDocumentId(doc.secondaryId) },
@@ -207,6 +232,31 @@ test.describe('Document API V2', () => {
     test('should allow authorized access to document distribute endpoint', async ({ request }) => {
       const doc = await seedDraftDocument(userA, teamA.id, ['test@example.com']);
 
+      // Get the recipient created during seeding.
+      const recipient = await prisma.recipient.findFirstOrThrow({
+        where: {
+          envelopeId: doc.id,
+        },
+      });
+
+      // Create a signature field for the recipient so distribution validation can run.
+      await prisma.field.create({
+        data: {
+          envelopeId: doc.id,
+          envelopeItemId: doc.envelopeItems[0].id,
+          recipientId: recipient.id,
+          type: FieldType.SIGNATURE,
+          page: 1,
+          positionX: 1,
+          positionY: 1,
+          width: 1,
+          height: 1,
+          customText: '',
+          inserted: false,
+          fieldMeta: { type: 'signature', fontSize: 14 },
+        },
+      });
+
       const res = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/document/distribute`, {
         headers: { Authorization: `Bearer ${tokenA}` },
         data: { documentId: mapSecondaryIdToDocumentId(doc.secondaryId) },
@@ -3678,6 +3728,26 @@ test.describe('Document API V2', () => {
           internalVersion: 2,
         });
 
+        const [recipient] = doc.recipients;
+
+        // add signing field for recipient (fieldMeta required for v2 envelopes)
+        await prisma.field.create({
+          data: {
+            page: 1,
+            type: FieldType.SIGNATURE,
+            inserted: false,
+            customText: '',
+            positionX: 1,
+            positionY: 1,
+            width: 1,
+            height: 1,
+            envelopeId: doc.id,
+            envelopeItemId: doc.envelopeItems[0].id,
+            recipientId: recipient.id,
+            fieldMeta: { type: 'signature', fontSize: 14 },
+          },
+        });
+
         const payload: TUseEnvelopePayload = {
           envelopeId: doc.id,
           distributeDocument: true,
@@ -3741,6 +3811,31 @@ test.describe('Document API V2', () => {
       }) => {
         const doc = await seedDraftDocument(userA, teamA.id, ['test@example.com']);
 
+        // Get the recipient created during seeding.
+        const recipient = await prisma.recipient.findFirstOrThrow({
+          where: {
+            envelopeId: doc.id,
+          },
+        });
+
+        // Create a signature field for the recipient so distribution validation can pass.
+        await prisma.field.create({
+          data: {
+            envelopeId: doc.id,
+            envelopeItemId: doc.envelopeItems[0].id,
+            recipientId: recipient.id,
+            type: FieldType.SIGNATURE,
+            page: 1,
+            positionX: 1,
+            positionY: 1,
+            width: 1,
+            height: 1,
+            customText: '',
+            inserted: false,
+            fieldMeta: { type: 'signature', fontSize: 14 },
+          },
+        });
+
         const res = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/envelope/distribute`, {
           headers: { Authorization: `Bearer ${tokenA}` },
           data: { envelopeId: doc.id },

packages/app-tests/e2e/document-flow/duplicate-recipients.spec.ts

@@ -257,10 +257,12 @@ test.describe('[DOCUMENT_FLOW]: Duplicate Recipients', () => {
 
     // Change second recipient role if role selector is available
     const roleDropdown = page.getByLabel('Role').nth(1);
+    let secondRecipientIsApprover = false;
 
     if (await roleDropdown.isVisible()) {
       await roleDropdown.click();
       await page.getByText('Approver').click();
+      secondRecipientIsApprover = true;
     }
 
     // Step 3: Add different field types for each duplicate
@@ -281,6 +283,13 @@ test.describe('[DOCUMENT_FLOW]: Duplicate Recipients', () => {
     await page.getByRole('button', { name: 'Date' }).click();
     await page.locator('canvas').click({ position: { x: 200, y: 150 } });
 
+    // If second recipient is still a SIGNER (role change wasn't available),
+    // add a signature field for them to pass validation
+    if (!secondRecipientIsApprover) {
+      await page.getByRole('button', { name: 'Signature' }).click();
+      await page.locator('canvas').click({ position: { x: 200, y: 200 } });
+    }
+
     // Complete the document
     await page.getByRole('button', { name: 'Continue' }).click();
 

packages/app-tests/e2e/features/include-document-certificate.spec.ts

@@ -1,4 +1,4 @@
-import { PDFDocument } from '@cantoo/pdf-lib';
+import { PDF } from '@libpdf/core';
 import { expect, test } from '@playwright/test';
 import { DocumentStatus, FieldType } from '@prisma/client';
 
@@ -43,7 +43,7 @@ test.describe('Signing Certificate Tests', () => {
         return fetch(documentUrl).then(async (res) => await res.arrayBuffer());
       });
 
-    const originalPdf = await PDFDocument.load(documentData);
+    const originalPdf = await PDF.load(new Uint8Array(documentData));
 
     // Sign the document
     await page.goto(`/sign/${recipient.token}`);
@@ -101,7 +101,7 @@ test.describe('Signing Certificate Tests', () => {
     const completedDocumentData = new Uint8Array(pdfData);
 
     // Load the PDF and check number of pages
-    const pdfDoc = await PDFDocument.load(completedDocumentData);
+    const pdfDoc = await PDF.load(new Uint8Array(completedDocumentData));
 
     expect(pdfDoc.getPageCount()).toBe(originalPdf.getPageCount() + 1); // Original + Certificate
   });
@@ -153,7 +153,7 @@ test.describe('Signing Certificate Tests', () => {
         return fetch(documentUrl).then(async (res) => await res.arrayBuffer());
       });
 
-    const originalPdf = await PDFDocument.load(documentData);
+    const originalPdf = await PDF.load(new Uint8Array(documentData));
 
     // Sign the document
     await page.goto(`/sign/${recipient.token}`);
@@ -206,7 +206,7 @@ test.describe('Signing Certificate Tests', () => {
     const completedDocumentData = new Uint8Array(pdfData);
 
     // Load the PDF and check number of pages
-    const completedPdf = await PDFDocument.load(completedDocumentData);
+    const completedPdf = await PDF.load(new Uint8Array(completedDocumentData));
 
     expect(completedPdf.getPageCount()).toBe(originalPdf.getPageCount() + 1); // Original + Certificate
   });
@@ -258,7 +258,7 @@ test.describe('Signing Certificate Tests', () => {
         return fetch(documentUrl).then(async (res) => await res.arrayBuffer());
       });
 
-    const originalPdf = await PDFDocument.load(new Uint8Array(documentData));
+    const originalPdf = await PDF.load(new Uint8Array(documentData));
 
     // Sign the document
     await page.goto(`/sign/${recipient.token}`);
@@ -309,7 +309,7 @@ test.describe('Signing Certificate Tests', () => {
     );
 
     // Load the PDF and check number of pages
-    const completedPdf = await PDFDocument.load(completedDocumentData);
+    const completedPdf = await PDF.load(new Uint8Array(completedDocumentData));
 
     expect(completedPdf.getPageCount()).toBe(originalPdf.getPageCount());
   });

packages/app-tests/e2e/scenarios/form-flattening.spec.ts

@@ -0,0 +1,858 @@
+import { PDF } from '@libpdf/core';
+import { expect, test } from '@playwright/test';
+import fs from 'node:fs';
+import path from 'node:path';
+
+import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
+import { createApiToken } from '@documenso/lib/server-only/public-api/create-api-token';
+import { getFileServerSide } from '@documenso/lib/universal/upload/get-file.server';
+import { mapSecondaryIdToTemplateId } from '@documenso/lib/utils/envelope';
+import { prisma } from '@documenso/prisma';
+import { EnvelopeType, RecipientRole } from '@documenso/prisma/client';
+import { seedUser } from '@documenso/prisma/seed/users';
+import type {
+  TCreateEnvelopePayload,
+  TCreateEnvelopeResponse,
+} from '@documenso/trpc/server/envelope-router/create-envelope.types';
+
+const WEBAPP_BASE_URL = NEXT_PUBLIC_WEBAPP_URL();
+const baseUrl = `${WEBAPP_BASE_URL}/api/v2-beta`;
+
+// Form field names in the test PDF
+const FORM_FIELDS = {
+  TEXT_FIELD: 'test_text_field',
+  COMPANY_NAME: 'company_name',
+  CHECKBOX: 'accept_terms',
+  DROPDOWN: 'country',
+} as const;
+
+// Test values to insert into form fields
+const TEST_FORM_VALUES = {
+  [FORM_FIELDS.TEXT_FIELD]: 'Hello World',
+  [FORM_FIELDS.COMPANY_NAME]: 'Documenso Inc.',
+  [FORM_FIELDS.CHECKBOX]: true,
+  [FORM_FIELDS.DROPDOWN]: 'Germany',
+};
+
+/**
+ * Helper to check if a PDF has interactive form fields.
+ * Returns true if the PDF has form fields, false if they've been flattened.
+ */
+async function pdfHasFormFields(pdfBuffer: Uint8Array): Promise<boolean> {
+  const pdfDoc = await PDF.load(new Uint8Array(pdfBuffer));
+
+  const form = await pdfDoc.getForm();
+
+  if (!form) {
+    return false;
+  }
+
+  return form.fieldCount > 0;
+}
+
+/**
+ * Helper to get form field names from a PDF.
+ */
+async function getPdfFormFieldNames(pdfBuffer: Uint8Array): Promise<string[]> {
+  const pdfDoc = await PDF.load(new Uint8Array(pdfBuffer));
+
+  const form = await pdfDoc.getForm();
+
+  if (!form) {
+    return [];
+  }
+
+  return form.getFieldNames();
+}
+
+/**
+ * Helper to get the value of a text field in a PDF.
+ */
+async function getPdfTextFieldValue(
+  pdfBuffer: Uint8Array,
+  fieldName: string,
+): Promise<string | undefined> {
+  const pdfDoc = await PDF.load(new Uint8Array(pdfBuffer));
+
+  const form = await pdfDoc.getForm();
+
+  if (!form) {
+    return undefined;
+  }
+
+  const textField = form.getTextField(fieldName);
+
+  if (!textField) {
+    return undefined;
+  }
+
+  return textField.getValue();
+}
+
+test.describe.configure({
+  mode: 'parallel',
+});
+
+test.describe('Form Flattening', () => {
+  const formFieldsPdf = fs.readFileSync(
+    path.join(__dirname, '../../../../assets/form-fields-test.pdf'),
+  );
+
+  test.describe('Envelope Creation (DOCUMENT type)', () => {
+    test('should flatten form fields when creating a DOCUMENT envelope with formValues', async ({
+      request,
+    }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      const payload: TCreateEnvelopePayload = {
+        type: EnvelopeType.DOCUMENT,
+        title: 'Document with Form Values',
+        formValues: TEST_FORM_VALUES,
+      };
+
+      const formData = new FormData();
+
+      formData.append('payload', JSON.stringify(payload));
+      formData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const res = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: formData,
+      });
+
+      expect(res.ok()).toBeTruthy();
+      expect(res.status()).toBe(200);
+
+      const response = (await res.json()) as TCreateEnvelopeResponse;
+
+      // Verify the envelope was created with the correct formValues
+      const envelope = await prisma.envelope.findUniqueOrThrow({
+        where: { id: response.id },
+        include: {
+          envelopeItems: {
+            include: { documentData: true },
+          },
+        },
+      });
+
+      expect(envelope.formValues).toEqual(TEST_FORM_VALUES);
+      expect(envelope.type).toBe(EnvelopeType.DOCUMENT);
+
+      // Get the PDF and verify form fields are flattened
+      const documentData = envelope.envelopeItems[0].documentData;
+      const pdfBuffer = await getFileServerSide(documentData);
+
+      const hasFormFields = await pdfHasFormFields(pdfBuffer);
+
+      expect(hasFormFields).toBe(false);
+    });
+
+    test('should flatten form fields when creating a DOCUMENT envelope without formValues', async ({
+      request,
+    }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      const payload: TCreateEnvelopePayload = {
+        type: EnvelopeType.DOCUMENT,
+        title: 'Document without Form Values',
+        // No formValues - but form should still be flattened for DOCUMENT type
+      };
+
+      const formData = new FormData();
+
+      formData.append('payload', JSON.stringify(payload));
+      formData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const res = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: formData,
+      });
+
+      expect(res.ok()).toBeTruthy();
+      expect(res.status()).toBe(200);
+
+      const response = (await res.json()) as TCreateEnvelopeResponse;
+
+      const envelope = await prisma.envelope.findUniqueOrThrow({
+        where: { id: response.id },
+        include: {
+          envelopeItems: {
+            include: { documentData: true },
+          },
+        },
+      });
+
+      // Get the PDF and verify form fields are flattened
+      const documentData = envelope.envelopeItems[0].documentData;
+      const pdfBuffer = await getFileServerSide(documentData);
+
+      const hasFormFields = await pdfHasFormFields(pdfBuffer);
+
+      expect(hasFormFields).toBe(false);
+    });
+  });
+
+  test.describe('Template Creation (TEMPLATE type)', () => {
+    test('should NOT flatten form fields when creating a TEMPLATE envelope', async ({
+      request,
+    }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      const payload: TCreateEnvelopePayload = {
+        type: EnvelopeType.TEMPLATE,
+        title: 'Template with Form Fields',
+        // Note: formValues can be set but form should NOT be flattened for templates
+      };
+
+      const formData = new FormData();
+
+      formData.append('payload', JSON.stringify(payload));
+      formData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const res = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: formData,
+      });
+
+      expect(res.ok()).toBeTruthy();
+      expect(res.status()).toBe(200);
+
+      const response = (await res.json()) as TCreateEnvelopeResponse;
+
+      const envelope = await prisma.envelope.findUniqueOrThrow({
+        where: { id: response.id },
+        include: {
+          envelopeItems: {
+            include: { documentData: true },
+          },
+        },
+      });
+
+      expect(envelope.type).toBe(EnvelopeType.TEMPLATE);
+
+      // Get the PDF and verify form fields are NOT flattened
+      const documentData = envelope.envelopeItems[0].documentData;
+      const pdfBuffer = await getFileServerSide(documentData);
+
+      const hasFormFields = await pdfHasFormFields(pdfBuffer);
+
+      expect(hasFormFields).toBe(true);
+
+      // Verify the specific form fields still exist
+      const fieldNames = await getPdfFormFieldNames(pdfBuffer);
+
+      expect(fieldNames).toContain(FORM_FIELDS.TEXT_FIELD);
+      expect(fieldNames).toContain(FORM_FIELDS.COMPANY_NAME);
+      expect(fieldNames).toContain(FORM_FIELDS.CHECKBOX);
+      expect(fieldNames).toContain(FORM_FIELDS.DROPDOWN);
+    });
+
+    test('should preserve form fields in template even when formValues are provided', async ({
+      request,
+    }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      const payload: TCreateEnvelopePayload = {
+        type: EnvelopeType.TEMPLATE,
+        title: 'Template with Form Values',
+        formValues: TEST_FORM_VALUES,
+      };
+
+      const formData = new FormData();
+
+      formData.append('payload', JSON.stringify(payload));
+      formData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const res = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: formData,
+      });
+
+      expect(res.ok()).toBeTruthy();
+      expect(res.status()).toBe(200);
+
+      const response = (await res.json()) as TCreateEnvelopeResponse;
+
+      const envelope = await prisma.envelope.findUniqueOrThrow({
+        where: { id: response.id },
+        include: {
+          envelopeItems: {
+            include: { documentData: true },
+          },
+        },
+      });
+
+      // formValues should be stored in the database
+      expect(envelope.formValues).toEqual(TEST_FORM_VALUES);
+      expect(envelope.type).toBe(EnvelopeType.TEMPLATE);
+
+      // But the PDF should still have interactive form fields
+      const documentData = envelope.envelopeItems[0].documentData;
+      const pdfBuffer = await getFileServerSide(documentData);
+
+      const hasFormFields = await pdfHasFormFields(pdfBuffer);
+
+      expect(hasFormFields).toBe(true);
+      expect(await getPdfTextFieldValue(pdfBuffer, FORM_FIELDS.TEXT_FIELD)).toBe(
+        TEST_FORM_VALUES[FORM_FIELDS.TEXT_FIELD],
+      );
+    });
+  });
+
+  test.describe('Document from Template', () => {
+    test('should flatten form fields when creating document from template with formValues', async ({
+      request,
+    }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      // First, create a template via API
+      const templatePayload: TCreateEnvelopePayload = {
+        type: EnvelopeType.TEMPLATE,
+        title: 'Template for Document Creation',
+        recipients: [
+          {
+            email: 'recipient@example.com',
+            name: 'Test Recipient',
+            role: RecipientRole.SIGNER,
+          },
+        ],
+      };
+
+      const templateFormData = new FormData();
+      templateFormData.append('payload', JSON.stringify(templatePayload));
+      templateFormData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const templateRes = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: templateFormData,
+      });
+
+      expect(templateRes.ok()).toBeTruthy();
+      const templateResponse = (await templateRes.json()) as TCreateEnvelopeResponse;
+
+      // Verify template has form fields
+      const template = await prisma.envelope.findUniqueOrThrow({
+        where: { id: templateResponse.id },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+          recipients: true,
+        },
+      });
+
+      const templatePdfBuffer = await getFileServerSide(template.envelopeItems[0].documentData);
+
+      expect(await pdfHasFormFields(templatePdfBuffer)).toBe(true);
+
+      // Now create a document from the template with formValues
+      const useTemplateRes = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/template/use`, {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        data: {
+          templateId: mapSecondaryIdToTemplateId(template.secondaryId),
+          recipients: [
+            {
+              id: template.recipients[0].id,
+              email: 'recipient@example.com',
+              name: 'Test Recipient',
+            },
+          ],
+          formValues: TEST_FORM_VALUES,
+        },
+      });
+
+      expect(useTemplateRes.ok()).toBeTruthy();
+      expect(useTemplateRes.status()).toBe(200);
+
+      const documentResponse = await useTemplateRes.json();
+
+      // Get the created document
+      const document = await prisma.envelope.findFirstOrThrow({
+        where: {
+          id: documentResponse.envelopeId,
+        },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+        },
+      });
+
+      expect(document.type).toBe(EnvelopeType.DOCUMENT);
+
+      // Verify form fields are flattened in the created document
+      const documentPdfBuffer = await getFileServerSide(document.envelopeItems[0].documentData);
+      const hasFormFields = await pdfHasFormFields(documentPdfBuffer);
+
+      expect(hasFormFields).toBe(false);
+    });
+
+    test('should flatten form fields when creating document from template without formValues', async ({
+      request,
+    }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      // Create a template
+      const templatePayload: TCreateEnvelopePayload = {
+        type: EnvelopeType.TEMPLATE,
+        title: 'Template without Form Values',
+        recipients: [
+          {
+            email: 'recipient@example.com',
+            name: 'Test Recipient',
+            role: RecipientRole.SIGNER,
+          },
+        ],
+      };
+
+      const templateFormData = new FormData();
+      templateFormData.append('payload', JSON.stringify(templatePayload));
+      templateFormData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const templateRes = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: templateFormData,
+      });
+
+      expect(templateRes.ok()).toBeTruthy();
+      const templateResponse = (await templateRes.json()) as TCreateEnvelopeResponse;
+
+      const template = await prisma.envelope.findUniqueOrThrow({
+        where: { id: templateResponse.id },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+          recipients: true,
+        },
+      });
+
+      // Create document from template WITHOUT formValues
+      const useTemplateRes = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/template/use`, {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        data: {
+          templateId: mapSecondaryIdToTemplateId(template.secondaryId),
+          recipients: [
+            {
+              id: template.recipients[0].id,
+              email: 'recipient@example.com',
+              name: 'Test Recipient',
+            },
+          ],
+          // No formValues provided
+        },
+      });
+
+      expect(useTemplateRes.ok()).toBeTruthy();
+      const documentResponse = await useTemplateRes.json();
+
+      const document = await prisma.envelope.findFirstOrThrow({
+        where: { id: documentResponse.envelopeId },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+        },
+      });
+
+      expect(document.type).toBe(EnvelopeType.DOCUMENT);
+
+      // Form fields should still be flattened even without formValues
+      const documentPdfBuffer = await getFileServerSide(document.envelopeItems[0].documentData);
+      const hasFormFields = await pdfHasFormFields(documentPdfBuffer);
+
+      expect(hasFormFields).toBe(false);
+    });
+
+    test('should use template formValues when creating document without override', async ({
+      request,
+    }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      // Create a template with formValues
+      const templatePayload: TCreateEnvelopePayload = {
+        type: EnvelopeType.TEMPLATE,
+        title: 'Template with Default Form Values',
+        formValues: {
+          [FORM_FIELDS.TEXT_FIELD]: 'Default Value',
+          [FORM_FIELDS.COMPANY_NAME]: 'Default Company',
+        },
+        recipients: [
+          {
+            email: 'recipient@example.com',
+            name: 'Test Recipient',
+            role: RecipientRole.SIGNER,
+          },
+        ],
+      };
+
+      const templateFormData = new FormData();
+      templateFormData.append('payload', JSON.stringify(templatePayload));
+      templateFormData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const templateRes = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: templateFormData,
+      });
+
+      expect(templateRes.ok()).toBeTruthy();
+      const templateResponse = (await templateRes.json()) as TCreateEnvelopeResponse;
+
+      const template = await prisma.envelope.findUniqueOrThrow({
+        where: { id: templateResponse.id },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+          recipients: true,
+        },
+      });
+
+      // Verify template stored the formValues
+      expect(template.formValues).toEqual({
+        [FORM_FIELDS.TEXT_FIELD]: 'Default Value',
+        [FORM_FIELDS.COMPANY_NAME]: 'Default Company',
+      });
+
+      // Create document from template without providing new formValues
+      // The template's formValues should be used
+      const useTemplateRes = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/template/use`, {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        data: {
+          templateId: mapSecondaryIdToTemplateId(template.secondaryId),
+          recipients: [
+            {
+              id: template.recipients[0].id,
+              email: 'recipient@example.com',
+              name: 'Test Recipient',
+            },
+          ],
+          // No formValues - should inherit from template
+        },
+      });
+
+      expect(useTemplateRes.ok()).toBeTruthy();
+      const documentResponse = await useTemplateRes.json();
+
+      const document = await prisma.envelope.findFirstOrThrow({
+        where: { id: documentResponse.envelopeId },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+        },
+      });
+
+      // Form fields should be flattened
+      const documentPdfBuffer = await getFileServerSide(document.envelopeItems[0].documentData);
+
+      expect(await pdfHasFormFields(documentPdfBuffer)).toBe(false);
+    });
+  });
+
+  test.describe('Form Values Verification', () => {
+    test('should correctly insert form values into PDF before flattening', async ({ request }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      // Create a template first (form fields preserved)
+      const templatePayload: TCreateEnvelopePayload = {
+        type: EnvelopeType.TEMPLATE,
+        title: 'Template for Value Verification',
+        recipients: [
+          {
+            email: 'recipient@example.com',
+            name: 'Test Recipient',
+            role: RecipientRole.SIGNER,
+          },
+        ],
+      };
+
+      const templateFormData = new FormData();
+
+      templateFormData.append('payload', JSON.stringify(templatePayload));
+      templateFormData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const templateRes = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: templateFormData,
+      });
+
+      const templateResponse = (await templateRes.json()) as TCreateEnvelopeResponse;
+      const template = await prisma.envelope.findUniqueOrThrow({
+        where: { id: templateResponse.id },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+          recipients: true,
+        },
+      });
+
+      // Verify template PDF still has form fields
+      const templatePdfBuffer = await getFileServerSide(template.envelopeItems[0].documentData);
+      expect(await pdfHasFormFields(templatePdfBuffer)).toBe(true);
+
+      // Verify we can read a text field value (should be empty initially)
+      const initialValue = await getPdfTextFieldValue(templatePdfBuffer, FORM_FIELDS.TEXT_FIELD);
+      expect(initialValue).toBe('');
+
+      // Now create a document with form values
+      const testValues = {
+        [FORM_FIELDS.TEXT_FIELD]: 'Inserted Text Value',
+        [FORM_FIELDS.COMPANY_NAME]: 'Test Company Name',
+      };
+
+      const useTemplateRes = await request.post(`${WEBAPP_BASE_URL}/api/v2-beta/template/use`, {
+        headers: {
+          Authorization: `Bearer ${token}`,
+          'Content-Type': 'application/json',
+        },
+        data: {
+          templateId: mapSecondaryIdToTemplateId(template.secondaryId),
+          recipients: [
+            {
+              id: template.recipients[0].id,
+              email: 'recipient@example.com',
+              name: 'Test Recipient',
+            },
+          ],
+          formValues: testValues,
+        },
+      });
+
+      expect(useTemplateRes.ok()).toBeTruthy();
+      const documentResponse = await useTemplateRes.json();
+
+      const document = await prisma.envelope.findFirstOrThrow({
+        where: { id: documentResponse.envelopeId },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+        },
+      });
+
+      // The form should be flattened, so we can't read form fields
+      const documentPdfBuffer = await getFileServerSide(document.envelopeItems[0].documentData);
+      expect(await pdfHasFormFields(documentPdfBuffer)).toBe(false);
+
+      // The values should have been inserted before flattening
+      // We can't verify the actual text content easily without visual inspection,
+      // but we can verify the form fields are gone (flattened)
+      const fieldNames = await getPdfFormFieldNames(documentPdfBuffer);
+      expect(fieldNames.length).toBe(0);
+    });
+  });
+
+  test.describe('Edge Cases', () => {
+    test('should handle PDF without form fields gracefully', async ({ request }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      // Use a PDF without form fields
+      const examplePdf = fs.readFileSync(path.join(__dirname, '../../../../assets/example.pdf'));
+
+      const payload: TCreateEnvelopePayload = {
+        type: EnvelopeType.DOCUMENT,
+        title: 'Document with No Form Fields',
+        formValues: {
+          nonexistent_field: 'Some Value',
+        },
+      };
+
+      const formData = new FormData();
+
+      formData.append('payload', JSON.stringify(payload));
+      formData.append('files', new File([examplePdf], 'example.pdf', { type: 'application/pdf' }));
+
+      const res = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: formData,
+      });
+
+      // Should succeed even with formValues for non-existent fields
+      expect(res.ok()).toBeTruthy();
+      expect(res.status()).toBe(200);
+
+      const response = (await res.json()) as TCreateEnvelopeResponse;
+      const envelope = await prisma.envelope.findUniqueOrThrow({
+        where: { id: response.id },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+        },
+      });
+
+      expect(envelope.formValues).toEqual({ nonexistent_field: 'Some Value' });
+    });
+
+    test('should handle empty formValues object', async ({ request }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      const payload: TCreateEnvelopePayload = {
+        type: EnvelopeType.DOCUMENT,
+        title: 'Document with Empty Form Values',
+        formValues: {},
+      };
+
+      const formData = new FormData();
+
+      formData.append('payload', JSON.stringify(payload));
+      formData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const res = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: formData,
+      });
+
+      expect(res.ok()).toBeTruthy();
+      expect(res.status()).toBe(200);
+
+      const response = (await res.json()) as TCreateEnvelopeResponse;
+      const envelope = await prisma.envelope.findUniqueOrThrow({
+        where: { id: response.id },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+        },
+      });
+
+      // Form should still be flattened for DOCUMENT type
+      const documentData = envelope.envelopeItems[0].documentData;
+      const pdfBuffer = await getFileServerSide(documentData);
+
+      expect(await pdfHasFormFields(pdfBuffer)).toBe(false);
+    });
+
+    test('should handle partial formValues (only some fields)', async ({ request }) => {
+      const { user, team } = await seedUser();
+      const { token } = await createApiToken({
+        userId: user.id,
+        teamId: team.id,
+        tokenName: 'test',
+        expiresIn: null,
+      });
+
+      const payload: TCreateEnvelopePayload = {
+        type: EnvelopeType.DOCUMENT,
+        title: 'Document with Partial Form Values',
+        formValues: {
+          [FORM_FIELDS.TEXT_FIELD]: 'Only this field',
+          // Other fields not set
+        },
+      };
+
+      const formData = new FormData();
+
+      formData.append('payload', JSON.stringify(payload));
+      formData.append(
+        'files',
+        new File([formFieldsPdf], 'form-fields-test.pdf', { type: 'application/pdf' }),
+      );
+
+      const res = await request.post(`${baseUrl}/envelope/create`, {
+        headers: { Authorization: `Bearer ${token}` },
+        multipart: formData,
+      });
+
+      expect(res.ok()).toBeTruthy();
+      expect(res.status()).toBe(200);
+
+      const response = (await res.json()) as TCreateEnvelopeResponse;
+      const envelope = await prisma.envelope.findUniqueOrThrow({
+        where: { id: response.id },
+        include: {
+          envelopeItems: { include: { documentData: true } },
+        },
+      });
+
+      // Should store the partial formValues
+      expect(envelope.formValues).toEqual({
+        [FORM_FIELDS.TEXT_FIELD]: 'Only this field',
+      });
+
+      // Form should still be flattened
+      const documentData = envelope.envelopeItems[0].documentData;
+      const pdfBuffer = await getFileServerSide(documentData);
+
+      expect(await pdfHasFormFields(pdfBuffer)).toBe(false);
+    });
+  });
+});

packages/app-tests/e2e/teams/default-recipients.spec.ts

@@ -0,0 +1,427 @@
+import { expect, test } from '@playwright/test';
+import * as fs from 'node:fs';
+import * as path from 'node:path';
+
+import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
+import { createApiToken } from '@documenso/lib/server-only/public-api/create-api-token';
+import { prisma } from '@documenso/prisma';
+import { EnvelopeType, RecipientRole } from '@documenso/prisma/client';
+import { seedTeam } from '@documenso/prisma/seed/teams';
+import { seedBlankTemplate } from '@documenso/prisma/seed/templates';
+import type {
+  TCreateEnvelopePayload,
+  TCreateEnvelopeResponse,
+} from '@documenso/trpc/server/envelope-router/create-envelope.types';
+
+import { apiSignin } from '../fixtures/authentication';
+
+const WEBAPP_BASE_URL = NEXT_PUBLIC_WEBAPP_URL();
+const baseUrl = `${WEBAPP_BASE_URL}/api/v2-beta`;
+
+test.describe.configure({ mode: 'parallel' });
+
+/**
+ * Helper function to set default recipients for a team
+ */
+const setTeamDefaultRecipients = async (
+  teamId: number,
+  defaultRecipients: Array<{ email: string; name: string; role: RecipientRole }>,
+) => {
+  const teamSettings = await prisma.teamGlobalSettings.findFirstOrThrow({
+    where: {
+      team: {
+        id: teamId,
+      },
+    },
+  });
+
+  await prisma.teamGlobalSettings.update({
+    where: {
+      id: teamSettings.id,
+    },
+    data: {
+      defaultRecipients,
+    },
+  });
+};
+
+test.describe('Default Recipients', () => {
+  test('[DEFAULT_RECIPIENTS]: default recipients are added to documents created via UI', async ({
+    page,
+  }) => {
+    const { team, owner } = await seedTeam({
+      createTeamMembers: 2,
+    });
+
+    // Get a team member to set as default recipient
+    const teamMembers = await prisma.organisationMember.findMany({
+      where: {
+        organisationId: team.organisationId,
+        userId: {
+          not: owner.id,
+        },
+      },
+      include: {
+        user: true,
+      },
+    });
+
+    const defaultRecipientUser = teamMembers[0].user;
+
+    // Set up default recipients for the team
+    await setTeamDefaultRecipients(team.id, [
+      {
+        email: defaultRecipientUser.email,
+        name: defaultRecipientUser.name || defaultRecipientUser.email,
+        role: RecipientRole.CC,
+      },
+    ]);
+
+    await apiSignin({
+      page,
+      email: owner.email,
+      redirectPath: `/t/${team.url}/documents`,
+    });
+
+    // Upload document via UI - this triggers document creation with default recipients
+    const [fileChooser] = await Promise.all([
+      page.waitForEvent('filechooser'),
+      page
+        .locator('input[type=file]')
+        .nth(1)
+        .evaluate((e) => {
+          if (e instanceof HTMLInputElement) {
+            e.click();
+          }
+        }),
+    ]);
+
+    await fileChooser.setFiles(path.join(__dirname, '../../../../assets/example.pdf'));
+
+    // Wait to be redirected to the edit page (v2 envelope editor)
+    await page.waitForURL(new RegExp(`/t/${team.url}/documents/envelope_.*`));
+
+    // Extract document ID from URL
+    const urlParts = page.url().split('/');
+    const documentId = urlParts.find((part) => part.startsWith('envelope_'));
+
+    // Wait for the Recipients card to be visible (v2 envelope editor)
+    await expect(page.getByRole('heading', { name: 'Recipients' })).toBeVisible();
+
+    await expect(page.getByTestId('signer-email-input').first()).not.toBeEmpty();
+
+    await page.getByRole('button', { name: 'Add Signer' }).click();
+
+    // Add a regular signer using the v2 editor
+    await page.getByTestId('signer-email-input').last().fill('regular-signer@documenso.com');
+    await page
+      .getByPlaceholder(/Recipient/)
+      .first()
+      .fill('Regular Signer');
+
+    // Wait for autosave to complete
+    await page.waitForTimeout(3000);
+
+    // Verify that default recipient is present in the database
+    await expect(async () => {
+      const envelope = await prisma.envelope.findFirstOrThrow({
+        where: {
+          id: documentId,
+        },
+        include: {
+          recipients: true,
+        },
+      });
+
+      // Should have 2 recipients: the regular signer + the default recipient
+      expect(envelope.recipients.length).toBe(2);
+
+      const defaultRecipient = envelope.recipients.find(
+        (r) => r.email.toLowerCase() === defaultRecipientUser.email.toLowerCase(),
+      );
+      expect(defaultRecipient).toBeDefined();
+      expect(defaultRecipient?.role).toBe(RecipientRole.CC);
+
+      const regularSigner = envelope.recipients.find(
+        (r) => r.email === 'regular-signer@documenso.com',
+      );
+      expect(regularSigner).toBeDefined();
+    }).toPass();
+  });
+
+  // TODO: Are we intending to allow default recipients to be removed from a document?
+  test.skip('[DEFAULT_RECIPIENTS]: default recipients cannot be removed from a document', async ({
+    page,
+  }) => {
+    const { team, owner } = await seedTeam({
+      createTeamMembers: 2,
+    });
+
+    // Get a team member to set as default recipient
+    const teamMembers = await prisma.organisationMember.findMany({
+      where: {
+        organisationId: team.organisationId,
+        userId: {
+          not: owner.id,
+        },
+      },
+      include: {
+        user: true,
+      },
+    });
+
+    const defaultRecipientUser = teamMembers[0].user;
+
+    // Set up default recipients for the team
+    await setTeamDefaultRecipients(team.id, [
+      {
+        email: defaultRecipientUser.email,
+        name: defaultRecipientUser.name || defaultRecipientUser.email,
+        role: RecipientRole.CC,
+      },
+    ]);
+
+    await apiSignin({
+      page,
+      email: owner.email,
+      redirectPath: `/t/${team.url}/documents`,
+    });
+
+    // Upload document via UI - this triggers document creation with default recipients
+    const [fileChooser] = await Promise.all([
+      page.waitForEvent('filechooser'),
+      page
+        .locator('input[type=file]')
+        .nth(1)
+        .evaluate((e) => {
+          if (e instanceof HTMLInputElement) {
+            e.click();
+          }
+        }),
+    ]);
+
+    await fileChooser.setFiles(path.join(__dirname, '../../../../assets/example.pdf'));
+
+    // Wait to be redirected to the edit page (v2 envelope editor)
+    await page.waitForURL(new RegExp(`/t/${team.url}/documents/envelope_.*`));
+
+    // Extract document ID from URL
+    const urlParts = page.url().split('/');
+    const documentId = urlParts.find((part) => part.startsWith('envelope_'));
+
+    // Replace the default recipient with a regular signer
+    await page.getByTestId('signer-email-input').first().fill('regular-signer@documenso.com');
+    await page
+      .getByPlaceholder(/Recipient/)
+      .first()
+      .fill('Regular Signer');
+
+    // Wait for autosave to complete
+    await page.waitForTimeout(3000);
+
+    // Wait for recipients to be saved
+    await expect(async () => {
+      const envelope = await prisma.envelope.findFirstOrThrow({
+        where: {
+          id: documentId,
+        },
+        include: {
+          recipients: true,
+        },
+      });
+      expect(envelope.recipients.length).toBe(2);
+    }).toPass();
+
+    // Verify that the default recipient's remove button is disabled
+    // In the v2 editor, default recipients should have a disabled remove button
+    // Find the fieldset containing the default recipient's email and check if its remove button is disabled
+    const defaultRecipientRow = page.locator('fieldset').filter({
+      hasText: defaultRecipientUser.email,
+    });
+
+    // The default recipient row should exist and have a disabled remove button
+    await expect(defaultRecipientRow).toHaveCount(1);
+    const removeButton = defaultRecipientRow.getByTestId('remove-signer-button');
+    await expect(removeButton).toBeDisabled();
+  });
+
+  test('[DEFAULT_RECIPIENTS]: documents created via API have default recipients', async ({
+    request,
+  }) => {
+    const { team, owner } = await seedTeam({
+      createTeamMembers: 2,
+    });
+
+    // Get a team member to set as default recipient
+    const teamMembers = await prisma.organisationMember.findMany({
+      where: {
+        organisationId: team.organisationId,
+        userId: {
+          not: owner.id,
+        },
+      },
+      include: {
+        user: true,
+      },
+    });
+
+    const defaultRecipientUser = teamMembers[0].user;
+
+    // Set up default recipients for the team
+    await setTeamDefaultRecipients(team.id, [
+      {
+        email: defaultRecipientUser.email,
+        name: defaultRecipientUser.name || defaultRecipientUser.email,
+        role: RecipientRole.CC,
+      },
+    ]);
+
+    // Create API token
+    const { token } = await createApiToken({
+      userId: owner.id,
+      teamId: team.id,
+      tokenName: 'test-token',
+      expiresIn: null,
+    });
+
+    // Create envelope via API
+    const payload: TCreateEnvelopePayload = {
+      type: EnvelopeType.DOCUMENT,
+      title: 'Test Document with Default Recipients',
+      recipients: [
+        {
+          email: 'api-recipient@documenso.com',
+          name: 'API Recipient',
+          role: RecipientRole.SIGNER,
+        },
+      ],
+    };
+
+    const formData = new FormData();
+    formData.append('payload', JSON.stringify(payload));
+
+    const pdfData = fs.readFileSync(path.join(__dirname, '../../../../assets/example.pdf'));
+    formData.append('files', new File([pdfData], 'test.pdf', { type: 'application/pdf' }));
+
+    const res = await request.post(`${baseUrl}/envelope/create`, {
+      headers: { Authorization: `Bearer ${token}` },
+      multipart: formData,
+    });
+
+    expect(res.ok()).toBeTruthy();
+    expect(res.status()).toBe(200);
+
+    const response = (await res.json()) as TCreateEnvelopeResponse;
+
+    // Verify the envelope has both the API recipient and the default recipient
+    const envelope = await prisma.envelope.findUniqueOrThrow({
+      where: {
+        id: response.id,
+      },
+      include: {
+        recipients: true,
+      },
+    });
+
+    expect(envelope.recipients.length).toBe(2);
+
+    const apiRecipient = envelope.recipients.find((r) => r.email === 'api-recipient@documenso.com');
+    expect(apiRecipient).toBeDefined();
+    expect(apiRecipient?.role).toBe(RecipientRole.SIGNER);
+
+    const defaultRecipient = envelope.recipients.find(
+      (r) => r.email.toLowerCase() === defaultRecipientUser.email.toLowerCase(),
+    );
+    expect(defaultRecipient).toBeDefined();
+    expect(defaultRecipient?.role).toBe(RecipientRole.CC);
+  });
+
+  test('[DEFAULT_RECIPIENTS]: documents created from template have default recipients', async ({
+    page,
+  }) => {
+    const { team, owner } = await seedTeam({
+      createTeamMembers: 2,
+    });
+
+    // Get a team member to set as default recipient
+    const teamMembers = await prisma.organisationMember.findMany({
+      where: {
+        organisationId: team.organisationId,
+        userId: {
+          not: owner.id,
+        },
+      },
+      include: {
+        user: true,
+      },
+    });
+
+    const defaultRecipientUser = teamMembers[0].user;
+
+    // Set up default recipients for the team
+    await setTeamDefaultRecipients(team.id, [
+      {
+        email: defaultRecipientUser.email,
+        name: defaultRecipientUser.name || defaultRecipientUser.email,
+        role: RecipientRole.CC,
+      },
+    ]);
+
+    // Create a template
+    const template = await seedBlankTemplate(owner, team.id);
+
+    await apiSignin({
+      page,
+      email: owner.email,
+      redirectPath: `/t/${team.url}/templates/${template.id}/edit`,
+    });
+
+    // Set template title
+    await page.getByLabel('Title').fill('Template with Default Recipients');
+
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Placeholder' })).toBeVisible();
+
+    // Add a template recipient
+    await page.getByPlaceholder('Email').fill('template-recipient@documenso.com');
+    await page.getByPlaceholder('Name').fill('Template Recipient');
+
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+
+    await page.getByRole('button', { name: 'Save template' }).click();
+
+    // Use template to create document
+    await page.waitForURL(`/t/${team.url}/templates`);
+    await page.getByRole('button', { name: 'Use Template' }).click();
+    await page.getByRole('button', { name: 'Create as draft' }).click();
+
+    // Wait for document to be created
+    await page.waitForURL(new RegExp(`/t/${team.url}/documents/envelope_.*`));
+
+    const documentId = page.url().split('/').pop();
+
+    // Verify the document has both the template recipient and the default recipient
+    const document = await prisma.envelope.findFirstOrThrow({
+      where: {
+        id: documentId,
+      },
+      include: {
+        recipients: true,
+      },
+    });
+
+    expect(document.recipients.length).toBe(2);
+
+    const templateRecipient = document.recipients.find(
+      (r) => r.email === 'template-recipient@documenso.com',
+    );
+    expect(templateRecipient).toBeDefined();
+
+    const defaultRecipient = document.recipients.find(
+      (r) => r.email.toLowerCase() === defaultRecipientUser.email.toLowerCase(),
+    );
+    expect(defaultRecipient).toBeDefined();
+    expect(defaultRecipient?.role).toBe(RecipientRole.CC);
+  });
+});

packages/app-tests/e2e/templates-flow/duplicate-recipients.spec.ts

@@ -50,11 +50,13 @@ const completeTemplateFlowWithDuplicateRecipients = async (options: {
   await page.getByRole('button', { name: 'Signature' }).click();
   await page.locator('canvas').click({ position: { x: 200, y: 100 } });
 
-  // Switch to different recipient and add their field
+  // Switch to different recipient and add their fields
   await page.getByRole('combobox').first().click();
   await page.getByText('Different Recipient').first().click();
-  await page.getByRole('button', { name: 'Name' }).click();
+  await page.getByRole('button', { name: 'Signature' }).click();
   await page.locator('canvas').click({ position: { x: 300, y: 100 } });
+  await page.getByRole('button', { name: 'Name' }).click();
+  await page.locator('canvas').click({ position: { x: 300, y: 150 } });
 
   // Save template
   await page.getByRole('button', { name: 'Save Template' }).click();

packages/app-tests/e2e/templates/create-document-from-template.spec.ts

@@ -505,7 +505,9 @@ test('[TEMPLATE]: should create a document from a template using template docume
   });
 
   expect(document.title).toEqual('TEMPLATE_WITH_ORIGINAL_DOC');
-  expect(firstDocumentData.data).toEqual(templateWithData.envelopeItems[0].documentData.data);
+  expect(firstDocumentData.initialData).toEqual(
+    templateWithData.envelopeItems[0].documentData.data,
+  );
   expect(firstDocumentData.initialData).toEqual(
     templateWithData.envelopeItems[0].documentData.initialData,
   );

packages/auth/package.json

@@ -15,11 +15,12 @@
     "@hono/standard-validator": "^0.2.0",
     "@oslojs/crypto": "^1.0.1",
     "@oslojs/encoding": "^1.1.0",
+    "@simplewebauthn/server": "^13.2.2",
     "arctic": "^3.7.0",
-    "hono": "4.10.6",
+    "hono": "4.11.4",
     "luxon": "^3.7.2",
     "nanoid": "^5.1.6",
     "ts-pattern": "^5.9.0",
     "zod": "^3.25.76"
   }
-}
+}

packages/auth/server/routes/passkey.ts

@@ -1,6 +1,7 @@
 import { sValidator } from '@hono/standard-validator';
 import { UserSecurityAuditLogType } from '@prisma/client';
 import { verifyAuthenticationResponse } from '@simplewebauthn/server';
+import { isoBase64URL } from '@simplewebauthn/server/helpers';
 import { Hono } from 'hono';
 
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
@@ -80,9 +81,9 @@ export const passkeyRoute = new Hono<HonoAuthContext>()
       expectedChallenge: challengeToken.token,
       expectedOrigin: origin,
       expectedRPID: rpId,
-      authenticator: {
-        credentialID: new Uint8Array(Array.from(passkey.credentialId)),
-        credentialPublicKey: new Uint8Array(passkey.credentialPublicKey),
+      credential: {
+        id: isoBase64URL.fromBuffer(passkey.credentialId),
+        publicKey: new Uint8Array(passkey.credentialPublicKey),
         counter: Number(passkey.counter),
       },
     }).catch(() => null);

packages/email/templates/confirm-team-email.tsx

@@ -113,7 +113,7 @@ export const ConfirmTeamEmailTemplate = ({
 
               <Section className="mb-6 mt-8 text-center">
                 <Button
-                  className="bg-documenso-500 inline-flex items-center justify-center rounded-lg px-6 py-3 text-center text-sm font-medium text-black no-underline"
+                  className="inline-flex items-center justify-center rounded-lg bg-documenso-500 px-6 py-3 text-center text-sm font-medium text-black no-underline"
                   href={`${baseUrl}/team/verify/email/${token}`}
                 >
                   <Trans>Accept</Trans>