fix: Remove deprecated error getters from ComfyApp (app.ts) (#9066)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

.agents/checks/accessibility.md

@@ -0,0 +1,28 @@
+---
+name: accessibility
+description: Reviews UI code for WCAG 2.2 AA accessibility violations
+severity-default: medium
+tools: [Read, Grep]
+---
+
+You are an accessibility auditor reviewing a code diff for WCAG 2.2 AA compliance. Focus on UI changes that affect users with disabilities.
+
+Check for:
+
+1. **Missing form labels** - inputs, selects, textareas without associated `<label>` or `aria-label`/`aria-labelledby`
+2. **Missing alt text** - images without `alt` attributes, or decorative images missing `alt=""`
+3. **Keyboard navigation** - interactive elements not focusable, custom widgets missing keyboard handlers (Enter, Space, Escape, Arrow keys), focus traps without escape
+4. **Focus management** - modals/dialogs that don't trap focus, dynamic content that doesn't move focus appropriately, removed elements without focus recovery
+5. **ARIA misuse** - invalid `aria-*` attributes, roles without required children/properties, `aria-hidden` on focusable elements
+6. **Color as sole indicator** - using color alone to convey meaning (errors, status) without text/icon alternative
+7. **Touch targets** - interactive elements smaller than 24x24 CSS pixels (WCAG 2.2 SC 2.5.8)
+8. **Screen reader support** - dynamic content changes without `aria-live` announcements, unlabeled icon buttons, links with only "click here"
+9. **Heading hierarchy** - skipped heading levels (h1 → h3), missing page landmarks
+
+Rules:
+
+- Focus on NEW or CHANGED UI in the diff — do not audit the entire existing codebase
+- Only flag issues in .vue, .tsx, .jsx, .html, or template-containing files
+- Skip non-UI files entirely (stores, services, utils)
+- Skip canvas-based content: the LiteGraph node editor renders on `<canvas>` elements, not DOM-based UI. WCAG rules don't fully apply to canvas rendering internals — only audit the DOM-based controls around it (toolbars, panels, dialogs)
+- "Critical" for completely inaccessible interactive elements, "major" for missing labels/ARIA, "minor" for enhancement opportunities

.agents/checks/api-contract.md

@@ -0,0 +1,35 @@
+---
+name: api-contract
+description: Catches breaking changes to public interfaces, window-exposed APIs, event contracts, and exported symbols
+severity-default: high
+tools: [Grep, Read, glob]
+---
+
+You are an API contract reviewer. Your job is to catch breaking changes and contract violations in public-facing interfaces.
+
+## What to Check
+
+1. **Breaking changes to globally exposed APIs** — anything on `window` or other global objects that consumers depend on. Renamed properties, removed methods, changed signatures, changed return types.
+2. **Event contract changes** — renamed events, changed event payloads, removed events that listeners may depend on.
+3. **Changed function signatures** — parameters reordered, required params added, return type changed on exported functions.
+4. **Removed or renamed exports** — any `export` that was previously available and is now gone or renamed without a re-export alias.
+5. **REST API changes** — changed endpoints, added required fields, removed response fields, changed status codes.
+6. **Type contract narrowing** — a function that used to accept `string | number` now only accepts `string`, or a return type that narrows unexpectedly.
+7. **Default value changes** — changing defaults on optional parameters that consumers may rely on.
+8. **Store/state shape changes** — renamed store properties, changed state structure that computed properties or watchers may depend on.
+
+## How to Identify the Public API
+
+- Check `package.json` for `"exports"` or `"main"` fields.
+- **Window globals**: This repo exposes LiteGraph classes on `window` (e.g., `window['LiteGraph']`, `window['LGraphNode']`, `window['LGraphCanvas']`) and `window['__COMFYUI_FRONTEND_VERSION__']`. These are consumed by custom node extensions and must not be renamed or removed.
+- **Extension hooks**: The `app` object and its extension registration system (`app.registerExtension`) is a public contract for third-party custom nodes. Changes to `ComfyApp`, `ComfyApi`, or the extension lifecycle are breaking changes.
+- Check AGENTS.md for project-specific API surface definitions.
+- Any exported symbol from common entry points (e.g., `src/types/index.ts`) should be treated as potentially public.
+
+## Rules
+
+- ONLY flag changes that break existing consumers.
+- Do NOT flag additions (new methods, new exports, new endpoints).
+- Do NOT flag internal/private API changes.
+- Always check if a re-export or compatibility shim was added before flagging.
+- Critical for removed/renamed globals, high for changed export signatures, medium for changed defaults.

.agents/checks/architecture-reviewer.md

@@ -0,0 +1,27 @@
+---
+name: architecture-reviewer
+description: Reviews code for architectural issues like over-engineering, SOLID violations, coupling, and API design
+severity-default: medium
+tools: [Grep, Read, glob]
+---
+
+You are a software architect reviewing a code diff. Focus on structural and design issues.
+
+## What to Check
+
+1. **Over-engineering** — abstractions for single-use cases, premature generalization, unnecessary indirection layers
+2. **SOLID violations** — god classes, mixed responsibilities, rigid coupling, interface segregation issues
+3. **Separation of concerns** — business logic in UI components, data access in controllers, mixed layers
+4. **API design** — inconsistent interfaces, leaky abstractions, unclear contracts
+5. **Coupling** — tight coupling between modules, circular dependencies, feature envy
+6. **Consistency** — breaking established patterns without justification, inconsistent approaches to similar problems
+7. **Dependency direction** — imports going the wrong way in the architecture, lower layers depending on higher
+8. **Change amplification** — designs requiring changes in many places for simple feature additions
+
+## Rules
+
+- Focus on structural issues that affect maintainability and evolution.
+- Do NOT report bugs, security, or performance issues (other checks handle those).
+- Consider whether the code is proportional to the problem it solves.
+- "Under-engineering" (missing useful abstractions) is as valid as over-engineering.
+- Rate severity by impact on future maintainability.

.agents/checks/bug-hunter.md

@@ -0,0 +1,34 @@
+---
+name: bug-hunter
+description: Finds logic errors, off-by-ones, null safety issues, race conditions, and edge cases
+severity-default: high
+tools: [Read, Grep]
+---
+
+You are a bug hunter reviewing a code diff. Your ONLY job is to find bugs - logic errors that will cause incorrect behavior at runtime.
+
+Focus areas:
+
+1. **Off-by-one errors** in loops, slices, and indices
+2. **Null/undefined dereferences** - any path where a value could be null but isn't checked
+3. **Race conditions** - shared mutable state, async ordering assumptions
+4. **Edge cases** - empty arrays, zero values, empty strings, boundary conditions
+5. **Type coercion bugs** - loose equality, implicit conversions
+6. **Error handling gaps** - unhandled promise rejections, swallowed errors
+7. **State mutation bugs** - mutating props, shared references, stale closures
+8. **Incorrect boolean logic** - flipped conditions, missing negation, wrong operator precedence
+
+Rules:
+
+- ONLY report actual bugs that will cause wrong behavior
+- Do NOT report style issues, naming, or performance
+- Do NOT report hypothetical bugs that require implausible inputs
+- Each finding must explain the specific runtime failure scenario
+
+## Repo-Specific Bug Patterns
+
+- `z.any()` in Zod schemas disables validation and propagates `any` into TypeScript types — always flag
+- Destructuring reactive objects (props, reactive()) without `toRefs()` loses reactivity — flag outside of `defineProps` destructuring
+- `ComputedRef<T>` exposed via `defineExpose` or public API should be unwrapped first
+- LiteGraph node operations: check for missing null guards on `node.graph` (can be null when node is removed)
+- Watch/watchEffect without cleanup for side effects (timers, listeners) — leak on component unmount

.agents/checks/coderabbit.md

@@ -0,0 +1,50 @@
+---
+name: coderabbit
+description: Runs CodeRabbit CLI for AST-aware code quality review
+severity-default: medium
+tools: [Bash, Read]
+---
+
+Run CodeRabbit CLI review on the current changes.
+
+## Steps
+
+1. Check if CodeRabbit CLI is installed:
+
+   ```bash
+   which coderabbit
+   ```
+
+   If not installed, skip this check and report:
+   "Skipped: CodeRabbit CLI not installed. Install and authenticate:
+
+   ```
+   npm install -g coderabbit
+   coderabbit auth login
+   ```
+
+   See https://docs.coderabbit.ai/guides/cli for setup."
+
+2. Run review:
+
+   ```bash
+   coderabbit --prompt-only --type uncommitted
+   ```
+
+   If there are committed but unpushed changes, use `--type committed` instead.
+
+3. Parse CodeRabbit's output. Each finding should include:
+   - File path and line number
+   - Severity mapped from CodeRabbit's own levels
+   - Category (logic, security, performance, style, test, architecture, dx)
+   - Description and suggested fix
+
+## Rate Limiting
+
+If a rate limit is hit, skip and note it. Prefer reading the current quota from CLI/API output rather than assuming a fixed reviews/hour limit.
+
+## Error Handling
+
+- Auth expired: skip and report "CodeRabbit auth expired, run: coderabbit auth login"
+- CLI timeout (>120s): skip and note
+- Parse error: return raw output with a warning

.agents/checks/complexity.md

@@ -0,0 +1,28 @@
+---
+name: complexity
+description: Reviews code for excessive complexity and suggests refactoring opportunities
+severity-default: medium
+tools: [Grep, Read, glob]
+---
+
+You are a complexity and refactoring advisor reviewing a code diff. Focus on code that is unnecessarily complex and will be hard to maintain.
+
+## What to Check
+
+1. **High cyclomatic complexity** — functions with many branching paths (if/else chains, switch statements with >7 cases, nested ternaries). Threshold: complexity >10 is high severity, >15 is critical.
+2. **Deep nesting** — code nested >4 levels deep (nested if/for/try blocks). Suggest guard clauses, early returns, or extraction.
+3. **Oversized functions** — functions >50 lines that do multiple things. Suggest extraction of cohesive sub-functions.
+4. **God classes/modules** — files >500 lines mixing multiple responsibilities. Suggest splitting by concern.
+5. **Long parameter lists** — functions with >5 parameters. Suggest parameter objects or builder patterns.
+6. **Complex boolean expressions** — conditions with >3 clauses that are hard to parse. Suggest extracting to named boolean variables.
+7. **Feature envy** — methods that use data from another class more than their own, suggesting the method belongs elsewhere.
+8. **Duplicate logic** — two or more code blocks in the diff doing essentially the same thing with minor variations.
+9. **Unnecessary indirection** — wrapper functions that add no value, abstractions for single-use cases, premature generalization.
+
+## Rules
+
+- Only flag complexity in NEW or SIGNIFICANTLY CHANGED code.
+- Do NOT suggest refactoring stable, well-tested code that happens to be complex.
+- Do NOT flag complexity that is inherent to the problem domain (e.g., state machines, protocol handlers).
+- Provide a concrete refactoring approach, not just "this is too complex".
+- High severity for code that will likely cause bugs during future modifications, medium for readability improvements, low for optional simplifications.

.agents/checks/ddd-structure.md

@@ -0,0 +1,86 @@
+---
+name: ddd-structure
+description: Reviews whether new code is placed in the right domain/layer and follows domain-driven structure principles
+severity-default: medium
+tools: [Grep, Read, glob]
+---
+
+You are a domain-driven design reviewer. Your job is to check whether new or moved code is placed in the correct architectural layer and domain folder.
+
+## Principles
+
+1. **Domain over Technical Layer** — code should be organized by what it does (domain/feature), not by what it is (component/service/store). New files in flat technical folders like `src/components/`, `src/services/`, `src/stores/`, `src/utils/` are a smell if the repo already has domain folders.
+
+2. **Cohesion** — files that change together should live together. A component, its store, its service, and its types for a single feature should be co-located.
+
+3. **Import Direction** — lower layers must not import from higher layers. Check that imports flow in the allowed direction (see Layer Architecture below).
+
+4. **Bounded Contexts** — each domain/feature should have clear boundaries. Cross-domain imports should go through public interfaces, not reach into internal files.
+
+5. **Naming** — folders and files should reflect domain concepts, not technical roles. `workflowExecution.ts` > `service.ts`.
+
+## Layer Architecture
+
+This repo uses a VSCode-style layered architecture with strict unidirectional imports:
+
+```
+base → platform → workbench → renderer
+```
+
+| Layer        | Purpose                                | Can Import From                    |
+| ------------ | -------------------------------------- | ---------------------------------- |
+| `base/`      | Pure utilities, no framework deps      | Nothing                            |
+| `platform/`  | Core domain services, business logic   | `base/`                            |
+| `workbench/` | Features, workspace orchestration      | `base/`, `platform/`               |
+| `renderer/`  | UI layer (Vue components, composables) | `base/`, `platform/`, `workbench/` |
+
+### Import Direction Violations to Check
+
+```bash
+# platform must NOT import from workbench or renderer
+grep -r "from '@/renderer'" src/platform/ --include="*.ts" --include="*.vue"
+grep -r "from '@/workbench'" src/platform/ --include="*.ts" --include="*.vue"
+# base must NOT import from platform, workbench, or renderer
+grep -r "from '@/platform'" src/base/ --include="*.ts" --include="*.vue"
+grep -r "from '@/workbench'" src/base/ --include="*.ts" --include="*.vue"
+grep -r "from '@/renderer'" src/base/ --include="*.ts" --include="*.vue"
+# workbench must NOT import from renderer
+grep -r "from '@/renderer'" src/workbench/ --include="*.ts" --include="*.vue"
+```
+
+### Legacy Flat Folders
+
+Flag NEW files added to these legacy flat folders (they should go in a domain folder under the appropriate layer instead):
+
+- `src/components/` → should be in `src/renderer/` or `src/workbench/extensions/{feature}/components/`
+- `src/stores/` → should be in `src/platform/{domain}/` or `src/workbench/extensions/{feature}/stores/`
+- `src/services/` → should be in `src/platform/{domain}/`
+- `src/composables/` → should be in `src/renderer/` or `src/platform/{domain}/ui/`
+
+Do NOT flag modifications to existing files in legacy folders — only flag NEW files.
+
+## How to Review
+
+1. Look at the diff to see where new files are created or where code is added.
+2. Check if the repo has an established domain folder structure (look for domain-organized directories like `src/platform/`, `src/workbench/`, `src/renderer/`, `src/base/`, or similar).
+3. If domain folders exist but new code was placed in a flat technical folder, flag it.
+4. Run import direction checks:
+   - Use `Grep` or `Read` to check if new imports violate layer boundaries.
+   - Flag any imports from a higher layer to a lower one using the rules above.
+5. Check for new files in legacy flat folders and flag them per the Legacy Flat Folders section.
+
+## Generic Checks (when no domain structure is detected)
+
+- God files (>500 lines mixing concerns)
+- Circular imports between modules
+- Business logic in UI components
+
+## Severity Guidelines
+
+| Issue                                                         | Severity |
+| ------------------------------------------------------------- | -------- |
+| Import direction violation (lower layer imports higher layer) | high     |
+| New file in legacy flat folder when domain folders exist      | medium   |
+| Business logic in UI component                                | medium   |
+| Missing domain boundary (cross-cutting import into internals) | low      |
+| Naming uses technical role instead of domain concept          | low      |

.agents/checks/dep-secrets-scan.md

@@ -0,0 +1,66 @@
+---
+name: dep-secrets-scan
+description: Runs dependency vulnerability audit and secrets detection
+severity-default: critical
+tools: [Bash, Read]
+---
+
+Run dependency audit and secrets scan to detect known CVEs in dependencies and leaked secrets in code.
+
+## Steps
+
+1. Check which tools are available:
+
+   ```bash
+   pnpm --version
+   gitleaks version
+   ```
+
+   - If **neither** is installed, skip this check and report: "Skipped: neither pnpm nor gitleaks installed. Install pnpm: `npm i -g pnpm`. Install gitleaks: `brew install gitleaks` or see https://github.com/gitleaks/gitleaks#installing"
+   - If only one is available, run that one and note the other was skipped.
+
+2. **Dependency audit** (if pnpm is available):
+
+   ```bash
+   pnpm audit --json 2>/dev/null || true
+   ```
+
+   Parse the JSON output. Map advisory severity:
+   - `critical` advisory → `critical`
+   - `high` advisory → `major`
+   - `moderate` advisory → `minor`
+   - `low` advisory → `nitpick`
+
+   Report each finding with: package name, version, advisory title, CVE, and suggested patched version.
+
+3. **Secrets detection** (if gitleaks is available):
+
+   ```bash
+   gitleaks detect --no-banner --report-format json --source . 2>/dev/null || true
+   ```
+
+   Parse the JSON output. All secret findings are `critical` severity.
+
+   Report each finding with: file and line, rule description, and a redacted match. Always suggest removing the secret and rotating credentials.
+
+## What This Catches
+
+### Dependency Audit
+
+- Known CVEs in direct and transitive dependencies
+- Vulnerable packages from the npm advisory database
+
+### Secrets Detection
+
+- API keys and tokens in code
+- AWS credentials, GCP service account keys
+- Database connection strings with passwords
+- Private keys and certificates
+- Generic high-entropy secrets
+
+## Error Handling
+
+- If pnpm audit fails, log the error and continue with gitleaks.
+- If gitleaks fails, log the error and continue with audit results.
+- If JSON parsing fails for either tool, include raw output with a warning.
+- If both tools produce no findings, report "No issues found."

.agents/checks/doc-freshness.md

@@ -0,0 +1,40 @@
+---
+name: doc-freshness
+description: Reviews whether code changes are reflected in documentation
+severity-default: medium
+tools: [Read, Grep]
+---
+
+You are a documentation freshness reviewer. Your job is to check whether code changes are properly reflected in documentation, and whether new features need documentation.
+
+Check for:
+
+1. **Stale README sections** - code changes that invalidate setup instructions, API examples, or architecture descriptions in README.md
+2. **Outdated code comments** - comments referencing removed functions, old parameter names, previous behavior, or TODO items that are now done
+3. **Missing JSDoc on public APIs** - exported functions, classes, or interfaces without JSDoc descriptions, especially those used by consumers of the library
+4. **Changed behavior without changelog** - user-facing behavior changes that should be noted in a changelog or release notes
+5. **Dead documentation links** - links in markdown files pointing to moved or deleted files
+6. **Missing migration guidance** - breaking changes without upgrade instructions
+
+Rules:
+
+- Focus on documentation that needs to CHANGE due to the diff — don't audit all existing docs
+- Do NOT flag missing comments on internal/private functions
+- Do NOT flag missing changelog entries for purely internal refactors
+- "Major" for stale docs that will mislead users, "minor" for missing JSDoc on public APIs, "nitpick" for minor doc improvements
+
+## ComfyUI_frontend Documentation
+
+This repository's public APIs are used by custom node and extension authors. Documentation lives at [docs.comfy.org](https://docs.comfy.org) (repo: Comfy-Org/docs).
+
+For any NEW API, event, hook, or configuration that extensions or custom nodes can use:
+
+- Flag with a suggestion to open a PR to Comfy-Org/docs to document the new API
+- Example: "This new extension API should be documented at docs.comfy.org — consider opening a PR to Comfy-Org/docs"
+
+For changes to existing extension-facing APIs:
+
+- Check if the existing docs at docs.comfy.org may need updating
+- Flag stale references in CONTRIBUTING.md or developer guides
+
+Anything relevant to custom extension authors should trigger a documentation suggestion.

.agents/checks/dx-readability.md

@@ -0,0 +1,25 @@
+---
+name: dx-readability
+description: Reviews code for developer experience issues including naming clarity, cognitive complexity, dead code, and confusing patterns
+severity-default: low
+tools: [Read, Grep]
+---
+
+You are a developer experience reviewer. Focus on code that will confuse the next developer who reads it.
+
+Check for:
+
+1. **Unclear naming** - variables/functions that don't communicate intent, abbreviations, misleading names
+2. **Cognitive complexity** - deeply nested conditions, long functions doing multiple things, complex boolean expressions
+3. **Dead code** - unreachable branches, unused variables, commented-out code, vestigial parameters
+4. **Confusing patterns** - clever tricks over simple code, implicit behavior, action-at-a-distance, surprising side effects
+5. **Missing context** - complex business logic without explaining why, non-obvious algorithms without comments
+6. **Inconsistent abstractions** - mixing raw and wrapped APIs, different error handling styles in same module
+7. **Implicit knowledge** - code that only works because of undocumented assumptions or conventions
+
+Rules:
+
+- Only flag things that would genuinely confuse a competent developer
+- Do NOT flag established project conventions even if you'd prefer different ones
+- "Minor" for things that slow comprehension, "nitpick" for pure style preferences
+- Major is reserved for genuinely misleading code (names that lie, silent behavior changes)

.agents/checks/ecosystem-compat.md

@@ -0,0 +1,58 @@
+---
+name: ecosystem-compat
+description: Checks whether changes break exported symbols that downstream consumers may depend on
+severity-default: high
+tools: [Grep, Read, glob, mcp__comfy_codesearch__search_code]
+---
+
+Check whether this PR introduces breaking changes to exported symbols that downstream consumers may depend on.
+
+## What to Check
+
+- Renamed or removed exported functions/classes/types
+- Changed function signatures (parameters added/removed/reordered)
+- Changed return types
+- Removed or renamed CSS classes used for selectors
+- Changed event names or event payload shapes
+- Changed global registrations or extension hooks
+- Modified integration points with external systems
+
+## Method
+
+1. Read the diff and identify any changes to exported symbols.
+2. For each potentially breaking change, try to determine if downstream consumers exist:
+   - If `mcp__comfy_codesearch__search_code` is available, search for usages of the changed symbol across downstream repositories.
+   - Otherwise, use `Grep` to search for usages within the current repository and note that external usage could not be verified.
+3. If consumers are found using the changed API, report it as a finding.
+
+## Severity Guidelines
+
+| Ecosystem Usage | Severity | Guidance                                                     |
+| --------------- | -------- | ------------------------------------------------------------ |
+| 5+ consumers    | critical | Must address before merge                                    |
+| 2-4 consumers   | high     | Should address or document                                   |
+| 1 consumer      | medium   | Note in PR, author decides                                   |
+| 0 consumers     | low      | Note potential risk only                                     |
+| Unknown usage   | medium   | Require explicit note that external usage was not verifiable |
+
+## Suggestion Template
+
+When a breaking change is found, suggest:
+
+- Keeping the old export alongside the new one
+- Adding a deprecation wrapper
+- Explicitly noting this as a breaking change in the PR description so consumers can update
+
+## ComfyUI Code Search MCP
+
+This check works best with the ComfyUI code search MCP tool, which searches across all custom node repositories for usage of changed symbols.
+
+If the `mcp__comfy_codesearch__search_code` tool is not available, install it:
+
+```
+amp mcp add comfy-codesearch https://comfy-codesearch.vercel.app/api/mcp
+# OR for Claude Code:
+claude mcp add -t http comfy-codesearch https://comfy-codesearch.vercel.app/api/mcp
+```
+
+Without this MCP, the check will fall back to searching within the current repository only, and cannot verify external ecosystem usage.

.agents/checks/error-handling.md

@@ -0,0 +1,38 @@
+---
+name: error-handling
+description: Reviews error handling patterns for empty catches, swallowed errors, missing async error handling, and generic error UX
+severity-default: high
+tools: [Read, Grep]
+---
+
+You are an error handling auditor reviewing a code diff. Focus exclusively on how errors are handled, propagated, and surfaced.
+
+Check for:
+
+1. **Empty catch blocks** - errors caught and silently swallowed with no logging or re-throw
+2. **Generic catches** - catching all errors without distinguishing types, losing context
+3. **Missing async error handling** - unhandled promise rejections, async functions without try/catch or .catch()
+4. **Swallowed errors** - errors caught and replaced with a return value that hides the failure
+5. **Missing error boundaries** - Vue/React component trees without error boundaries around risky subtrees
+6. **No retry or fallback** - network calls, file I/O, or external service calls with no retry logic or graceful degradation
+7. **Generic error UX** - user-facing code showing "Something went wrong" without actionable guidance or error codes
+8. **Missing cleanup on error** - resources (connections, file handles, timers) not cleaned up in error paths
+9. **Error propagation breaks** - catching errors mid-chain and not re-throwing, breaking caller's ability to handle
+
+Rules:
+
+- Focus on NEW or CHANGED error handling in the diff
+- Do NOT flag existing error handling patterns in untouched code
+- Do NOT suggest adding error handling to code that legitimately cannot fail (pure functions, type-safe internal calls)
+- "Critical" for swallowed errors in data-mutation paths, "major" for missing error handling on external calls, "minor" for missing logging
+
+## Repo-Specific Error Handling
+
+- User-facing error messages must be actionable and friendly (per AGENTS.md)
+- Use the shared `useErrorHandling` composable (`src/composables/useErrorHandling.ts`) for centralized error handling:
+  - `wrapWithErrorHandling` / `wrapWithErrorHandlingAsync` automatically catch errors and surface them as toast notifications via `useToastStore`
+  - `toastErrorHandler` can be used directly for custom error handling flows
+  - Supports `ErrorRecoveryStrategy` for retry/fallback patterns (e.g., reauthentication, network reconnect)
+- API errors from `api.get()`/`api.post()` should be caught and surfaced to the user via `useToastStore` (`src/platform/updates/common/toastStore.ts`)
+- Electron/desktop code paths: IPC errors should be caught and not crash the renderer process
+- Workflow execution errors should be displayed in the UI status bar, not silently swallowed

.agents/checks/eslint.strict.config.js

@@ -0,0 +1,60 @@
+/**
+ * Strict ESLint config for the sonarjs-lint review check.
+ *
+ * Uses eslint-plugin-sonarjs to get SonarQube-grade analysis without a server.
+ * This config is NOT used for regular development linting — only for the
+ * code review checks' static analysis pass.
+ *
+ * Install: pnpm add -D eslint eslint-plugin-sonarjs
+ * Run:     pnpm dlx eslint --no-config-lookup --config .agents/checks/eslint.strict.config.js --ext .ts,.js,.vue {files}
+ */
+
+import sonarjs from 'eslint-plugin-sonarjs'
+
+export default [
+  sonarjs.configs.recommended,
+  {
+    plugins: {
+      sonarjs
+    },
+    rules: {
+      // Bug detection
+      'sonarjs/no-all-duplicated-branches': 'error',
+      'sonarjs/no-element-overwrite': 'error',
+      'sonarjs/no-identical-conditions': 'error',
+      'sonarjs/no-identical-expressions': 'error',
+      'sonarjs/no-one-iteration-loop': 'error',
+      'sonarjs/no-use-of-empty-return-value': 'error',
+      'sonarjs/no-collection-size-mischeck': 'error',
+      'sonarjs/no-duplicated-branches': 'error',
+      'sonarjs/no-identical-functions': 'error',
+      'sonarjs/no-redundant-jump': 'error',
+      'sonarjs/no-unused-collection': 'error',
+      'sonarjs/no-gratuitous-expressions': 'error',
+
+      // Code smell detection
+      'sonarjs/cognitive-complexity': ['error', 15],
+      'sonarjs/no-duplicate-string': ['error', { threshold: 3 }],
+      'sonarjs/no-redundant-boolean': 'error',
+      'sonarjs/no-small-switch': 'error',
+      'sonarjs/prefer-immediate-return': 'error',
+      'sonarjs/prefer-single-boolean-return': 'error',
+      'sonarjs/no-inverted-boolean-check': 'error',
+      'sonarjs/no-nested-template-literals': 'error'
+    },
+    languageOptions: {
+      ecmaVersion: 2024,
+      sourceType: 'module'
+    }
+  },
+  {
+    ignores: [
+      '**/node_modules/**',
+      '**/dist/**',
+      '**/build/**',
+      '**/*.config.*',
+      '**/*.test.*',
+      '**/*.spec.*'
+    ]
+  }
+]

.agents/checks/import-graph.md

@@ -0,0 +1,72 @@
+---
+name: import-graph
+description: Validates import rules, detects circular dependencies, and enforces layer boundaries using dependency-cruiser
+severity-default: high
+tools: [Bash, Read]
+---
+
+Run dependency-cruiser import graph analysis on changed files to detect circular dependencies, orphan modules, and import rule violations.
+
+> **Note:** The circular dependency scan in step 4 targets `src/` specifically, since this is a frontend app with source code under `src/`.
+
+## Steps
+
+1. Check if dependency-cruiser is available:
+   ```bash
+   pnpm dlx dependency-cruiser --version
+   ```
+   If not available, skip this check and report: "Skipped: dependency-cruiser not available. Install with: `pnpm add -D dependency-cruiser`"
+
+> **Install:** `pnpm add -D dependency-cruiser`
+
+2. Identify changed directories from the diff.
+
+3. Determine config to use:
+   - If `.dependency-cruiser.js` or `.dependency-cruiser.cjs` exists in the repo root, use it (dependency-cruiser auto-detects it). This config may enforce layer architecture rules (e.g., base → platform → workbench → renderer import direction):
+     ```bash
+     pnpm dlx dependency-cruiser --output-type json <changed_directories> 2>/dev/null
+     ```
+   - If no config exists, run with built-in defaults:
+     ```bash
+     pnpm dlx dependency-cruiser --no-config --output-type json <changed_directories> 2>/dev/null
+     ```
+
+4. Also check for circular dependencies specifically across `src/`:
+
+   ```bash
+   pnpm dlx dependency-cruiser --no-config --output-type json --do-not-follow "node_modules" --include-only "^src" src 2>/dev/null
+   ```
+
+   Look for modules where `.circular == true` in the output.
+
+5. Parse the JSON output. Each violation has:
+   - `rule.name`: the violated rule
+   - `rule.severity`: error, warn, info
+   - `from`: importing module
+   - `to`: imported module
+
+6. Map violation severity:
+   - `error` → `major`
+   - `warn` → `minor`
+   - `info` → `nitpick`
+   - Circular dependencies → `major` (category: architecture)
+   - Orphan modules → `nitpick` (category: dx)
+
+7. Report each violation with: the rule name, source and target modules, file path, and a suggestion (usually move the import or extract an interface).
+
+## What It Catches
+
+| Rule                     | What It Detects                                      |
+| ------------------------ | ---------------------------------------------------- |
+| `no-circular`            | Circular dependency chains (A → B → C → A)           |
+| `no-orphans`             | Modules with no incoming or outgoing dependencies    |
+| `not-to-dev-dep`         | Production code importing devDependencies            |
+| `no-duplicate-dep-types` | Same dependency in multiple sections of package.json |
+| Custom layer rules       | Import direction violations (e.g., base → platform)  |
+
+## Error Handling
+
+- If pnpm dlx is not available, skip and report the error.
+- If the config file fails to parse, fall back to `--no-config`.
+- If there are more than 50 violations, report the first 20 and note the total count.
+- If no violations are found, report "No issues found."

.agents/checks/memory-leak.md

@@ -0,0 +1,27 @@
+---
+name: memory-leak
+description: Scans for memory leak patterns including event listeners without cleanup, timers not cleared, and unbounded caches
+severity-default: high
+tools: [Read, Grep]
+---
+
+You are a memory leak specialist reviewing a code diff. Focus exclusively on patterns that cause memory to grow unboundedly over time.
+
+Check for:
+
+1. **Event listeners without cleanup** - addEventListener without corresponding removeEventListener, especially in Vue onMounted without onBeforeUnmount cleanup
+2. **Timers not cleared** - setInterval/setTimeout started in component lifecycle without clearInterval/clearTimeout on unmount
+3. **Observer patterns without disconnect** - MutationObserver, IntersectionObserver, ResizeObserver created without .disconnect() on cleanup
+4. **WebSocket/Worker connections** - opened connections never closed on component unmount or route change
+5. **Unbounded caches** - Maps, Sets, or arrays that grow with usage but never evict entries, especially keyed by user input or dynamic IDs
+6. **Stale closures holding references** - closures in event handlers or callbacks that capture large objects or DOM nodes and prevent garbage collection
+7. **RequestAnimationFrame without cancel** - rAF loops started without cancelAnimationFrame on cleanup
+8. **Vue-specific leaks** - watch/watchEffect without stop(), computed that captures reactive dependencies it shouldn't, provide/inject holding stale references
+9. **Global state accumulation** - pushing to global arrays/maps without ever removing entries, console.log keeping object references in dev
+
+Rules:
+
+- Focus on NEW leak patterns introduced in the diff
+- Do NOT flag existing cleanup patterns that are correct
+- Every finding must explain the specific lifecycle scenario where the leak occurs (e.g., "when user navigates away from this view, the interval keeps running")
+- "Critical" for leaks in hot paths or long-lived pages, "major" for component-level leaks, "minor" for dev-only or cold-path leaks

.agents/checks/pattern-compliance.md

@@ -0,0 +1,60 @@
+---
+name: pattern-compliance
+description: Checks code against repository conventions from AGENTS.md and established patterns
+severity-default: medium
+tools: [Read, Grep]
+---
+
+Check code against repository conventions and framework patterns.
+
+Steps:
+
+1. Read AGENTS.md (and any directory-specific guidance files) for project-specific conventions
+2. Read each changed file
+3. Check against the conventions found in AGENTS.md and these standard patterns:
+
+### TypeScript
+
+- No `any` types or `as any` assertions
+- No `@ts-ignore` without explanatory comment
+- Separate type imports (`import type { ... }`)
+- Use `import type { ... }` for type-only imports
+- Explicit return types on exported functions
+- Use `es-toolkit` for utility functions, NOT lodash. Flag any new `import ... from 'lodash'` or `import ... from 'lodash/*'`
+- Never use `z.any()` in Zod schemas — use `z.unknown()` and narrow
+
+### Vue (if applicable)
+
+- Composition API with `<script setup lang="ts">`
+- Reactive props destructuring (not `withDefaults` pattern)
+- New components must use `<script setup lang="ts">` with reactive props destructuring (Vue 3.5 style): `const { color = 'blue' } = defineProps<Props>()`
+- Separate type imports from value imports
+- All user-facing strings must use `vue-i18n` (`$t()` in templates, `t()` in script). Flag hardcoded English strings in templates that should be translated. The locale file is `src/locales/en/main.json`
+
+### Tailwind (if applicable)
+
+- No `dark:` variants (use semantic theme tokens)
+- Use `cn()` utility for conditional classes
+- No `!important` in utility classes
+- Tailwind 4: CSS variable references use parentheses syntax: `h-(--my-var)` NOT `h-[--my-var]`
+- Use design tokens: `bg-secondary-background`, `text-muted-foreground`, `border-border-default`
+- No `<style>` blocks in Vue SFCs — use inline Tailwind only
+
+### Testing
+
+- Behavioral tests, not change detectors
+- No mock-heavy tests that don't test real behavior
+- Test names describe behavior, not implementation
+
+### General
+
+- No commented-out code
+- No `console.log` in production code (unless intentional logging)
+- No hardcoded URLs, credentials, or environment-specific values
+- Package manager is `pnpm`. Never use `npm`, `npx`, or `yarn`. Use `pnpm dlx` for one-off package execution
+- Sanitize HTML with `DOMPurify.sanitize()`, never raw `innerHTML` or `v-html` without it
+
+Rules:
+
+- Only flag ACTUAL violations, not hypothetical ones
+- AGENTS.md conventions take priority over default patterns if they conflict

.agents/checks/performance-profiler.md

@@ -0,0 +1,35 @@
+---
+name: performance-profiler
+description: Reviews code for performance issues including algorithmic complexity, unnecessary work, and bundle size impact
+severity-default: medium
+tools: [Read, Grep]
+---
+
+You are a performance engineer reviewing a code diff. Focus exclusively on performance issues.
+
+Check for:
+
+1. **Algorithmic complexity** - O(n²) or worse in loops, nested iterations over large collections
+2. **Unnecessary re-computation** - repeated work in render cycles, missing memoization for expensive ops
+3. **Memory leaks** - event listeners not cleaned up, growing caches without eviction, closures holding references
+4. **N+1 queries** - database/API calls inside loops
+5. **Bundle size** - large imports that could be tree-shaken, dynamic imports for heavy modules
+6. **Rendering performance** - unnecessary re-renders, layout thrashing, expensive computed properties
+7. **Data structures** - using arrays for lookups instead of maps/sets, unnecessary copying of large objects
+8. **Async patterns** - sequential awaits that could be parallel, missing abort controllers
+
+Rules:
+
+- ONLY report actual performance issues, not premature optimization suggestions
+- Distinguish between hot paths (major) and cold paths (minor)
+- Include Big-O analysis when relevant
+- Do NOT suggest micro-optimizations that a JIT compiler handles
+- Quantify the impact when possible: "This is O(n²) where n = number of users"
+
+## Repo-Specific Performance Concerns
+
+- **LiteGraph canvas rendering** is the primary hot path. Operations inside `LGraphNode.onDrawForeground`, `onDrawBackground`, `processMouseMove` run every frame at 60fps. Any O(n) or worse operation here on the node/link collections is critical.
+- **Node definition lookups** happen frequently — these should use Maps, not array.find()
+- **Workflow serialization/deserialization** can involve large JSON objects (1000+ nodes). Watch for deep copies or unnecessary re-parsing.
+- **Vue reactivity in canvas code** — reactive getters triggered during canvas render cause performance issues. Canvas-facing code should read raw values, not reactive refs.
+- **Bundle size** — check for large imports that could be dynamically imported. The build uses Vite with `build:analyze` for bundle visualization.

.agents/checks/regression-risk.md

@@ -0,0 +1,44 @@
+---
+name: regression-risk
+description: Detects potential regressions by analyzing git blame history of modified lines
+severity-default: high
+tools: [Bash, Read, Grep]
+---
+
+Perform regression risk analysis on the current changes using git blame.
+
+## Method
+
+1. Determine the base branch by examining git context (e.g., `git merge-base origin/main HEAD`, or check the PR's target branch). Never use `HEAD~1` as the base — it compares against the PR's own prior commit and causes false positives.
+2. Get the PR's own commits: `git log --format=%H <base>..HEAD`
+3. For each changed file, run: `git diff <base>...HEAD -- <file>`
+4. Extract the modified line ranges from the diff (lines removed or changed in the base version).
+5. For each modified line range, check git blame in the base version:
+   `git blame <base> -L <start>,<end> -- <file>`
+6. Look for blame commits whose messages match bugfix patterns:
+   - Contains: fix, bug, patch, hotfix, revert, regression, CVE
+   - Ignore: "fix lint", "fix typo", "fix format", "fix style"
+7. **Filter out false positives.** If the blamed commit SHA is in the PR's own commits, skip it.
+8. For each verified bugfix line being modified, report as a finding.
+
+## What to Report
+
+For each finding, include:
+
+- The file and line number
+- The original bugfix commit (short SHA and subject)
+- The date of the original fix
+- A suggestion to verify the original bug scenario still works and to add a regression test if one doesn't exist
+
+## Shallow Clone Limitations
+
+When working with shallow clones, `git blame` may not have full history. If blame fails with "no such path in revision" or shows truncated history, report only findings where blame succeeds and note the limitation.
+
+## Edge Cases
+
+| Situation                | Action                           |
+| ------------------------ | -------------------------------- |
+| Shallow clone (no blame) | Report what succeeds, note limit |
+| Blame shows PR's own SHA | Skip finding (false positive)    |
+| File renamed             | Try blame with `--follow`        |
+| Binary file              | Skip file                        |

.agents/checks/security-auditor.md

@@ -0,0 +1,34 @@
+---
+name: security-auditor
+description: Reviews code for security vulnerabilities aligned with OWASP Top 10
+severity-default: critical
+tools: [Read, Grep]
+---
+
+You are a security auditor reviewing a code diff. Focus exclusively on security vulnerabilities.
+
+Check for:
+
+1. **Injection** - SQL injection, command injection, template injection, XSS (stored/reflected/DOM)
+2. **Authentication/Authorization** - auth bypass, privilege escalation, missing access checks
+3. **Data exposure** - secrets in code, PII in logs, sensitive data in error messages, overly broad API responses
+4. **Cryptography** - weak algorithms, hardcoded keys, predictable tokens, missing encryption
+5. **Input validation** - missing sanitization, path traversal, SSRF, open redirects
+6. **Dependency risks** - known vulnerable patterns, unsafe deserialization
+7. **Configuration** - CORS misconfiguration, missing security headers, debug mode in production
+8. **Race conditions with security impact** - TOCTOU, double-spend, auth state races
+
+Rules:
+
+- ONLY report security issues, not general bugs or style
+- All findings must be severity "critical" or "major"
+- Explain the attack vector: who can exploit this and how
+- Do NOT report theoretical issues without a plausible attack scenario
+- Reference OWASP category when applicable
+
+## Repo-Specific Patterns
+
+- HTML sanitization must use `DOMPurify.sanitize()` — flag any `v-html` or `innerHTML` without DOMPurify
+- API calls should use `api.get(api.apiURL(...))` helpers, not raw `fetch('/api/...')` — direct URL construction can bypass auth
+- Firebase/Sentry credentials are configured via environment — flag any hardcoded Firebase config objects
+- Electron IPC: check for unsafe `ipcRenderer.send` patterns in desktop code paths

.agents/checks/semgrep-sast.md

@@ -0,0 +1,54 @@
+---
+name: semgrep-sast
+description: Runs Semgrep SAST with auto-configured rules for JS/TS/Vue
+severity-default: high
+tools: [Bash, Read]
+---
+
+Run Semgrep static analysis on changed files to detect security vulnerabilities, dangerous patterns, and framework-specific issues.
+
+## Steps
+
+1. Check if semgrep is installed:
+
+   ```bash
+   semgrep --version
+   ```
+
+   If not installed, skip this check and report: "Skipped: semgrep not installed. Install with: `pip3 install semgrep`"
+
+2. Identify changed files (`.ts`, `.js`, `.vue`) from the diff.
+   If none are found, skip and report: "Skipped: no changed JS/TS/Vue files."
+
+3. Run semgrep against changed files:
+
+   ```bash
+   semgrep --config=auto --json --quiet <changed_files>
+   ```
+
+4. Parse the JSON output (`.results[]` array). For each finding, map severity:
+   - Semgrep `ERROR` → `critical`
+   - Semgrep `WARNING` → `major`
+   - Semgrep `INFO` → `minor`
+
+5. Report each finding with:
+   - The semgrep rule ID (`check_id`)
+   - File path and line number (`path`, `start.line`)
+   - The message from `extra.message`
+   - A fix suggestion from `extra.fix` if available, otherwise general remediation advice
+
+## What Semgrep Catches
+
+With `--config=auto`, Semgrep loads community-maintained rules for:
+
+- **Security vulnerabilities:** injection, XSS, SSRF, path traversal, open redirect
+- **Dangerous patterns:** eval(), innerHTML, dangerouslySetInnerHTML, exec()
+- **Crypto issues:** weak hashing, hardcoded secrets, insecure random
+- **Best practices:** missing security headers, unsafe deserialization
+- **Framework-specific:** Express, React, Vue security patterns
+
+## Error Handling
+
+- If semgrep config download fails, skip and report the error.
+- If semgrep fails to parse a specific file, skip that file and continue with others.
+- If semgrep produces no findings, report "No issues found."

.agents/checks/sonarjs-lint.md

@@ -0,0 +1,59 @@
+---
+name: sonarjs-lint
+description: Runs SonarQube-grade static analysis using eslint-plugin-sonarjs
+severity-default: high
+tools: [Bash, Read]
+---
+
+Run eslint-plugin-sonarjs analysis on changed files to detect bugs, code smells, and security patterns without needing a SonarQube server.
+
+## Steps
+
+1. Check if eslint is available:
+
+   ```bash
+   pnpm dlx eslint --version
+   ```
+
+   If pnpm dlx or eslint is unavailable, skip this check and report: "Skipped: eslint not available. Ensure Node.js and pnpm dlx are installed."
+
+2. Identify changed files (`.ts`, `.js`, `.vue`) from the diff.
+
+3. Determine eslint config to use. This check uses a **strict sonarjs-specific config** (not the project's own eslint config, which is less strict):
+   - Look for the colocated strict config at `.agents/checks/eslint.strict.config.js`
+   - If found, run with `--config .agents/checks/eslint.strict.config.js`
+   - **Fallback:** if the strict config cannot be found or fails to load, skip this check and report: "Skipped: .agents/checks/eslint.strict.config.js missing; SonarJS rules require explicit config."
+
+4. Run eslint against changed files:
+
+   ```bash
+   # Use the strict config
+   pnpm dlx --yes --package eslint-plugin-sonarjs eslint --no-config-lookup --config .agents/checks/eslint.strict.config.js --format json <changed_files> 2>/dev/null || true
+   ```
+
+5. Parse the JSON array of file results. For each eslint message, map severity:
+   - `severity 2` (error) → `major`
+   - `severity 1` (warning) → `minor`
+
+6. Categorize findings by rule ID:
+   - Rule IDs starting with `sonarjs/no-` → category: `logic`
+   - Rule IDs containing `cognitive-complexity` → category: `dx`
+   - Other sonarjs rules → category: `style`
+
+7. Report each finding with:
+   - The rule ID
+   - File path and line number
+   - The message from eslint
+   - A fix suggestion based on the rule
+
+## What This Catches
+
+- **Bug detection:** duplicated branches, element overwrite, identical conditions/expressions, one-iteration loops, empty return values
+- **Code smells:** cognitive complexity (threshold: 15), duplicate strings, redundant booleans, small switches
+- **Security patterns:** via sonarjs recommended ruleset
+
+## Error Handling
+
+- If eslint fails to parse a Vue file, skip that file and continue with others.
+- If the plugin fails to install, skip and report the error.
+- If eslint produces no output or errors, report "No issues found."

.agents/checks/test-quality.md

@@ -0,0 +1,37 @@
+---
+name: test-quality
+description: Reviews test code for quality issues and coverage gaps
+severity-default: medium
+tools: [Read, Grep]
+---
+
+You are a test quality reviewer. Evaluate the tests included with (or missing from) this code change.
+
+Check for:
+
+1. **Missing tests** - new behavior without test coverage, modified logic without updated tests
+2. **Change-detector tests** - tests that assert implementation details instead of behavior (testing that a function was called, not what it produces)
+3. **Mock-heavy tests** - tests with so many mocks they don't test real behavior
+4. **Snapshot abuse** - large snapshots that no one reviews, snapshots of implementation details
+5. **Fragile assertions** - tests that break on unrelated changes, order-dependent tests
+6. **Missing edge cases** - happy path only, no empty/null/error scenarios tested
+7. **Test readability** - unclear test names, complex setup that obscures intent, shared mutable state between tests
+8. **Test isolation** - tests depending on execution order, shared state, external services without mocking
+
+Rules:
+
+- Focus on test quality and coverage gaps, not production code bugs
+- "Major" for missing tests on critical logic, "minor" for missing edge case tests
+- A change that adds no tests is only an issue if the change adds behavior
+- Refactors without behavior changes don't need new tests
+- Prefer behavioral tests: test inputs and outputs, not internal implementation
+- This repo uses **colocated tests**: `.test.ts` files live next to their source files (e.g., `MyComponent.test.ts` beside `MyComponent.vue`). When checking for missing tests, look for a colocated `.test.ts` file, not a separate `tests/` directory
+
+## Repo-Specific Testing Conventions
+
+- Tests use **Vitest** (not Jest) — run with `pnpm test:unit`
+- Test files are **colocated**: `MyComponent.test.ts` next to `MyComponent.vue`
+- Use `@vue/test-utils` for component testing, `@pinia/testing` (`createTestingPinia`) for store tests
+- Browser/E2E tests use **Playwright** in `browser_tests/` — run with `pnpm test:browser:local`
+- Mock composables using the singleton factory pattern inside `vi.mock()` — see `docs/testing/unit-testing.md` for the pattern
+- Never use `any` in test code either — proper typing applies to tests too

.agents/checks/vue-patterns.md

@@ -0,0 +1,47 @@
+---
+name: vue-patterns
+description: Reviews Vue 3.5+ code for framework-specific anti-patterns
+severity-default: medium
+tools: [Read, Grep]
+---
+
+You are a Vue 3.5 framework specialist reviewing a code diff. Focus on Vue-specific patterns, anti-patterns, and missed framework features.
+
+Check for:
+
+1. **Options API in new files** - new .vue files using Options API instead of Composition API with `<script setup>`. Modifications to existing Options API files are fine.
+2. **Reactivity anti-patterns** - destructuring reactive objects losing reactivity, using `ref()` for objects that should be `reactive()`, accessing `.value` inside templates, incorrectly using `toRefs`/`toRef`
+3. **Watch/watchEffect cleanup** - watchers without cleanup functions when they set up side effects (timers, listeners, subscriptions)
+4. **Flush timing issues** - DOM access in watch callbacks without `{ flush: 'post' }`, `nextTick` misuse, accessing template refs before mount
+5. **defineEmits typing** - using array syntax `defineEmits(['event'])` instead of TypeScript syntax `defineEmits<{...}>()`
+6. **defineExpose misuse** - exposing internal state via `defineExpose` when events would be more appropriate (expose is for imperative methods: validate, focus, open)
+7. **Prop drilling** - passing props through 3+ component levels where provide/inject would be cleaner
+8. **VueUse opportunities** - manual implementations of common composables that VueUse already provides (useLocalStorage, useEventListener, useDebounceFn, useIntersectionObserver, etc.)
+9. **Computed vs method** - methods used in templates for derived state that should be computed properties, or computed properties that have side effects
+10. **PrimeVue usage in new code** - New components must NOT use PrimeVue. This project is migrating to shadcn-vue (Reka UI primitives). If new code imports from `primevue/*`, flag it and suggest the shadcn-vue equivalent.
+
+Available shadcn-vue replacements in `src/components/ui/`:
+
+- `button/` — Button, variants
+- `select/` — Select, SelectTrigger, SelectContent, SelectItem
+- `textarea/` — Textarea
+- `toggle-group/` — ToggleGroup, ToggleGroupItem
+- `slider/` — Slider
+- `skeleton/` — Skeleton
+- `stepper/` — Stepper
+- `tags-input/` — TagsInput
+- `search-input/` — SearchInput
+- `Popover.vue` — Popover
+
+For Reka UI primitives not yet wrapped, create a new component in `src/components/ui/` following the pattern in existing components (see `src/components/ui/AGENTS.md`): use `useForwardProps`, `cn()`, design tokens.
+
+Modifications to existing PrimeVue-based components are acceptable but should note the migration opportunity.
+
+Rules:
+
+- Only review .vue and composable .ts files — skip stores, services, utils
+- Do NOT flag existing Options API files being modified (only flag NEW files)
+- Flag new PrimeVue imports — the project is migrating to shadcn-vue/Reka UI
+- When suggesting shadcn-vue alternatives, reference `src/components/ui/AGENTS.md` for the component creation pattern
+- Use Iconify icons (`<i class="icon-[lucide--check]" />`) not PrimeIcons
+- "Major" for reactivity bugs and flush timing, "minor" for API style and VueUse opportunities, "nitpick" for preference-level patterns

.claude/skills/regenerating-screenshots/SKILL.md

@@ -0,0 +1,83 @@
+---
+name: regenerating-screenshots
+description: 'Creates a PR to regenerate Playwright screenshot expectations. Use when screenshot tests are failing on main or PRs due to stale golden images. Triggers on: regen screenshots, regenerate screenshots, update expectations, fix screenshot tests.'
+---
+
+# Regenerating Playwright Screenshot Expectations
+
+Automates the process of triggering the `PR: Update Playwright Expectations`
+GitHub Action by creating a labeled PR from `origin/main`.
+
+## Steps
+
+1. **Fetch latest main**
+
+   ```bash
+   git fetch origin main
+   ```
+
+2. **Create a timestamped branch** from `origin/main`
+
+   Format: `regen-screenshots/YYYY-MM-DDTHH` (hour resolution, local time)
+
+   ```bash
+   git checkout -b regen-screenshots/<datetime> origin/main
+   ```
+
+3. **Create an empty commit**
+
+   ```bash
+   git commit --allow-empty -m "test: regenerate screenshot expectations"
+   ```
+
+4. **Push the branch**
+
+   ```bash
+   git push origin regen-screenshots/<datetime>
+   ```
+
+5. **Generate a poem** about regenerating screenshots. Be creative — a
+   new, unique poem every time. Short (4–8 lines). Can be funny, wistful,
+   epic, haiku-style, limerick, sonnet fragment — vary the form.
+
+6. **Create the PR** with the poem as the body (no label yet).
+
+   Write the poem to a temp file and use `--body-file`:
+
+   ```bash
+   # Write poem to temp file
+   # Create PR:
+   gh pr create \
+     --base main \
+     --head regen-screenshots/<datetime> \
+     --title "test: regenerate screenshot expectations" \
+     --body-file <temp-file>
+   ```
+
+7. **Add the label** as a separate step to trigger the GitHub Action.
+
+   The `labeled` event only fires when a label is added after PR
+   creation, not when applied during creation via `--label`.
+
+   Use the GitHub API directly (`gh pr edit --add-label` fails due to
+   deprecated Projects Classic GraphQL errors):
+
+   ```bash
+   gh api repos/{owner}/{repo}/issues/<pr-number>/labels \
+     -f "labels[]=New Browser Test Expectations" --method POST
+   ```
+
+8. **Report the result** to the user:
+   - PR URL
+   - Branch name
+   - Note that the GitHub Action will run automatically and commit
+     updated screenshots to the branch.
+
+## Notes
+
+- The `New Browser Test Expectations` label triggers the
+  `pr-update-playwright-expectations.yaml` workflow.
+- The workflow runs Playwright with `--update-snapshots`, commits results
+  back to the PR branch, then removes the label.
+- This is fire-and-forget — no need to wait for or monitor the Action.
+- Always return to the original branch/worktree state after pushing.

.coderabbit.yaml

@@ -5,3 +5,10 @@ reviews:
   high_level_summary: false
   auto_review:
     drafts: true
+    ignore_title_keywords:
+      - '[release]'
+      - '[backport'
+    ignore_usernames:
+      - comfy-pr-bot
+      - github-actions
+      - github-actions[bot]

.github/AGENTS.md

@@ -13,3 +13,11 @@ This automated review performs comprehensive analysis:
 - Integration concerns
 
 For implementation details, see `.claude/commands/comprehensive-pr-review.md`.
+
+## GitHub Actions: Fork PR Permissions
+
+Fork PRs get a **read-only `GITHUB_TOKEN`** — no PR comments, no secret access, no pushing.
+
+Any workflow that needs write access must use the **two-workflow split**: a `pull_request`-triggered `ci-*.yaml` uploads artifacts (including PR metadata), then a `workflow_run`-triggered `pr-*.yaml` downloads them and posts comments with write permissions. See `ci-size-data` → `pr-size-report` or `ci-perf-report` → `pr-perf-report`. Use `.github/actions/post-pr-report-comment` for the comment step.
+
+Never write PR comments directly from `pull_request` workflows or use `pull_request_target` to run untrusted code.

.github/actions/post-pr-report-comment/action.yaml

@@ -0,0 +1,35 @@
+name: Post PR Report Comment
+description: Reads a markdown report file and posts/updates a single idempotent comment on a PR.
+
+inputs:
+  pr-number:
+    description: PR number to comment on
+    required: true
+  report-file:
+    description: Path to the markdown report file
+    required: true
+  comment-marker:
+    description: HTML comment marker for idempotent matching
+    required: true
+  token:
+    description: GitHub token with pull-requests write permission
+    required: true
+
+runs:
+  using: composite
+  steps:
+    - name: Read report
+      id: report
+      uses: juliangruber/read-file-action@b549046febe0fe86f8cb4f93c24e284433f9ab58 # v1.1.7
+      with:
+        path: ${{ inputs.report-file }}
+
+    - name: Create or update PR comment
+      uses: actions-cool/maintain-one-comment@4b2dbf086015f892dcb5e8c1106f5fccd6c1476b # v3.2.0
+      with:
+        token: ${{ inputs.token }}
+        number: ${{ inputs.pr-number }}
+        body: |
+          ${{ steps.report.outputs.content }}
+          ${{ inputs.comment-marker }}
+        body-include: ${{ inputs.comment-marker }}

.github/license-clarifications.json

@@ -0,0 +1,3 @@
+{
+  "posthog-js@*": { "licenses": "Apache-2.0" }
+}

.github/workflows/ci-dist-telemetry-scan.yaml

@@ -79,3 +79,22 @@ jobs:
             exit 1
           fi
           echo '✅ No Mixpanel references found'
+
+      - name: Scan dist for PostHog telemetry references
+        run: |
+          set -euo pipefail
+          echo '🔍 Scanning for PostHog references...'
+          if rg --no-ignore -n \
+            -g '*.html' \
+            -g '*.js' \
+            -e '(?i)posthog\.init' \
+            -e '(?i)posthog\.capture' \
+            -e 'PostHogTelemetryProvider' \
+            -e 'ph\.comfy\.org' \
+            -e 'posthog-js' \
+            dist; then
+            echo '❌ ERROR: PostHog references found in dist assets!'
+            echo 'PostHog must be properly tree-shaken from OSS builds.'
+            exit 1
+          fi
+          echo '✅ No PostHog references found'

.github/workflows/ci-oss-assets-validation.yaml

@@ -100,6 +100,7 @@ jobs:
             --production \
             --summary \
             --excludePackages '@comfyorg/comfyui-frontend;@comfyorg/design-system;@comfyorg/registry-types;@comfyorg/shared-frontend-utils;@comfyorg/tailwind-utils;@comfyorg/comfyui-electron-types' \
+            --clarificationsFile .github/license-clarifications.json \
             --onlyAllow 'MIT;MIT*;Apache-2.0;BSD-2-Clause;BSD-3-Clause;ISC;0BSD;BlueOak-1.0.0;Python-2.0;CC0-1.0;Unlicense;(MIT OR Apache-2.0);(MIT OR GPL-3.0);(Apache-2.0 OR MIT);(MPL-2.0 OR Apache-2.0);CC-BY-4.0;CC-BY-3.0;GPL-3.0-only'; then
             echo ''
             echo '✅ All production dependency licenses are approved!'

.github/workflows/ci-perf-report.yaml

@@ -0,0 +1,70 @@
+name: 'CI: Performance Report'
+
+on:
+  push:
+    branches: [main, core/*]
+    paths-ignore: ['**/*.md']
+  pull_request:
+    branches-ignore: [wip/*, draft/*, temp/*]
+    paths-ignore: ['**/*.md']
+
+concurrency:
+  group: perf-${{ github.ref }}
+  cancel-in-progress: true
+
+permissions:
+  contents: read
+
+jobs:
+  perf-tests:
+    if: github.repository == 'Comfy-Org/ComfyUI_frontend'
+    runs-on: ubuntu-latest
+    timeout-minutes: 30
+    container:
+      image: ghcr.io/comfy-org/comfyui-ci-container:0.0.12
+      credentials:
+        username: ${{ github.actor }}
+        password: ${{ secrets.GITHUB_TOKEN }}
+    permissions:
+      contents: read
+      packages: read
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v6
+
+      - name: Setup frontend
+        uses: ./.github/actions/setup-frontend
+        with:
+          include_build_step: true
+
+      - name: Start ComfyUI server
+        uses: ./.github/actions/start-comfyui-server
+
+      - name: Run performance tests
+        id: perf
+        continue-on-error: true
+        run: pnpm exec playwright test --project=performance --workers=1 --repeat-each=3
+
+      - name: Upload perf metrics
+        if: always()
+        uses: actions/upload-artifact@v6
+        with:
+          name: perf-metrics
+          path: test-results/perf-metrics.json
+          retention-days: 30
+          if-no-files-found: warn
+
+      - name: Save PR metadata
+        if: github.event_name == 'pull_request'
+        run: |
+          mkdir -p temp/perf-meta
+          echo "${{ github.event.number }}" > temp/perf-meta/number.txt
+          echo "${{ github.event.pull_request.base.ref }}" > temp/perf-meta/base.txt
+
+      - name: Upload PR metadata
+        if: github.event_name == 'pull_request'
+        uses: actions/upload-artifact@v6
+        with:
+          name: perf-meta
+          path: temp/perf-meta/

.github/workflows/ci-tests-e2e.yaml

@@ -39,7 +39,7 @@ jobs:
     runs-on: ubuntu-latest
     timeout-minutes: 60
     container:
-      image: ghcr.io/comfy-org/comfyui-ci-container:0.0.12
+      image: ghcr.io/comfy-org/comfyui-ci-container:0.0.13
       credentials:
         username: ${{ github.actor }}
         password: ${{ secrets.GITHUB_TOKEN }}
@@ -87,7 +87,7 @@ jobs:
     needs: setup
     runs-on: ubuntu-latest
     container:
-      image: ghcr.io/comfy-org/comfyui-ci-container:0.0.12
+      image: ghcr.io/comfy-org/comfyui-ci-container:0.0.13
       credentials:
         username: ${{ github.actor }}
         password: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/cloud-dispatch-build.yaml

@@ -0,0 +1,45 @@
+---
+# Dispatches a frontend-asset-build event to the cloud repo on push to
+# cloud/* branches and main. The cloud repo handles the actual build,
+# GCS upload, and secret management (Sentry, Algolia, GCS creds).
+#
+# This is fire-and-forget — it does NOT wait for the cloud workflow to
+# complete. Status is visible in the cloud repo's Actions tab.
+
+name: Cloud Frontend Build Dispatch
+
+on:
+  push:
+    branches:
+      - 'cloud/*'
+      - 'main'
+  workflow_dispatch:
+
+permissions: {}
+
+concurrency:
+  group: cloud-dispatch-${{ github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  dispatch:
+    # Fork guard: prevent forks from dispatching to the cloud repo
+    if: github.repository == 'Comfy-Org/ComfyUI_frontend'
+    runs-on: ubuntu-latest
+    steps:
+      - name: Build client payload
+        id: payload
+        run: |
+          payload="$(jq -nc \
+            --arg ref "${GITHUB_SHA}" \
+            --arg branch "${GITHUB_REF_NAME}" \
+            '{ref: $ref, branch: $branch}')"
+          echo "json=${payload}" >> "${GITHUB_OUTPUT}"
+
+      - name: Dispatch to cloud repo
+        uses: peter-evans/repository-dispatch@28959ce8df70de7be546dd1250a005dd32156697 # v4.0.1
+        with:
+          token: ${{ secrets.CLOUD_DISPATCH_TOKEN }}
+          repository: Comfy-Org/cloud
+          event-type: frontend-asset-build
+          client-payload: ${{ steps.payload.outputs.json }}

.github/workflows/pr-perf-report.yaml

@@ -0,0 +1,102 @@
+name: 'PR: Performance Report'
+
+on:
+  workflow_run:
+    workflows: ['CI: Performance Report']
+    types:
+      - completed
+
+permissions:
+  contents: read
+  pull-requests: write
+  issues: write
+
+jobs:
+  comment:
+    runs-on: ubuntu-latest
+    if: >
+      github.repository == 'Comfy-Org/ComfyUI_frontend' &&
+      github.event.workflow_run.event == 'pull_request' &&
+      github.event.workflow_run.conclusion == 'success'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v6
+
+      - name: Setup Node
+        uses: actions/setup-node@v6
+        with:
+          node-version: 22
+
+      - name: Download PR metadata
+        uses: dawidd6/action-download-artifact@0bd50d53a6d7fb5cb921e607957e9cc12b4ce392 # v12
+        with:
+          name: perf-meta
+          run_id: ${{ github.event.workflow_run.id }}
+          path: temp/perf-meta/
+
+      - name: Resolve and validate PR metadata
+        id: pr-meta
+        uses: actions/github-script@v8
+        with:
+          script: |
+            const fs = require('fs');
+            const artifactPr = Number(fs.readFileSync('temp/perf-meta/number.txt', 'utf8').trim());
+            const artifactBase = fs.readFileSync('temp/perf-meta/base.txt', 'utf8').trim();
+
+            // Resolve PR from trusted workflow context
+            let pr = context.payload.workflow_run.pull_requests?.[0];
+            if (!pr) {
+              const { data: prs } = await github.rest.repos.listPullRequestsAssociatedWithCommit({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                commit_sha: context.payload.workflow_run.head_sha,
+              });
+              pr = prs.find(p => p.state === 'open');
+            }
+
+            if (!pr) {
+              core.setFailed('Unable to resolve PR from workflow_run context.');
+              return;
+            }
+
+            if (Number(pr.number) !== artifactPr) {
+              core.setFailed(`Artifact PR number (${artifactPr}) does not match trusted context (${pr.number}).`);
+              return;
+            }
+
+            const trustedBase = pr.base?.ref;
+            if (!trustedBase || artifactBase !== trustedBase) {
+              core.setFailed(`Artifact base (${artifactBase}) does not match trusted context (${trustedBase}).`);
+              return;
+            }
+
+            core.setOutput('number', String(pr.number));
+            core.setOutput('base', trustedBase);
+
+      - name: Download PR perf metrics
+        uses: dawidd6/action-download-artifact@0bd50d53a6d7fb5cb921e607957e9cc12b4ce392 # v12
+        with:
+          name: perf-metrics
+          run_id: ${{ github.event.workflow_run.id }}
+          path: test-results/
+
+      - name: Download baseline perf metrics
+        uses: dawidd6/action-download-artifact@0bd50d53a6d7fb5cb921e607957e9cc12b4ce392 # v12
+        with:
+          branch: ${{ steps.pr-meta.outputs.base }}
+          workflow: ci-perf-report.yaml
+          event: push
+          name: perf-metrics
+          path: temp/perf-baseline/
+          if_no_artifact_found: warn
+
+      - name: Generate perf report
+        run: npx --yes tsx scripts/perf-report.ts > perf-report.md
+
+      - name: Post PR comment
+        uses: ./.github/actions/post-pr-report-comment
+        with:
+          pr-number: ${{ steps.pr-meta.outputs.number }}
+          report-file: ./perf-report.md
+          comment-marker: '<!-- COMFYUI_FRONTEND_PERF -->'
+          token: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/pr-size-report.yaml

@@ -45,28 +45,76 @@ jobs:
           run_id: ${{ github.event_name == 'workflow_dispatch' && inputs.run_id || github.event.workflow_run.id }}
           path: temp/size
 
-      - name: Set PR number
-        id: pr-number
-        run: |
-          if [ "${{ github.event_name }}" == "workflow_dispatch" ]; then
-            echo "content=${{ inputs.pr_number }}" >> $GITHUB_OUTPUT
-          else
-            echo "content=$(cat temp/size/number.txt)" >> $GITHUB_OUTPUT
-          fi
+      - name: Resolve and validate PR metadata
+        id: pr-meta
+        uses: actions/github-script@v8
+        with:
+          script: |
+            const fs = require('fs');
 
-      - name: Set base branch
-        id: pr-base
-        run: |
-          if [ "${{ github.event_name }}" == "workflow_dispatch" ]; then
-            echo "content=main" >> $GITHUB_OUTPUT
-          else
-            echo "content=$(cat temp/size/base.txt)" >> $GITHUB_OUTPUT
-          fi
+            // workflow_dispatch: validate artifact metadata against API-resolved PR
+            if (context.eventName === 'workflow_dispatch') {
+              const pullNumber = Number('${{ inputs.pr_number }}');
+              const { data: dispatchPr } = await github.rest.pulls.get({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                pull_number: pullNumber,
+              });
+
+              const artifactPr = Number(fs.readFileSync('temp/size/number.txt', 'utf8').trim());
+              const artifactBase = fs.readFileSync('temp/size/base.txt', 'utf8').trim();
+
+              if (artifactPr !== dispatchPr.number) {
+                core.setFailed(`Artifact PR number (${artifactPr}) does not match dispatch PR (${dispatchPr.number}).`);
+                return;
+              }
+              if (artifactBase !== dispatchPr.base.ref) {
+                core.setFailed(`Artifact base (${artifactBase}) does not match dispatch PR base (${dispatchPr.base.ref}).`);
+                return;
+              }
+
+              core.setOutput('number', String(dispatchPr.number));
+              core.setOutput('base', dispatchPr.base.ref);
+              return;
+            }
+
+            // workflow_run: validate artifact metadata against trusted context
+            const artifactPr = Number(fs.readFileSync('temp/size/number.txt', 'utf8').trim());
+            const artifactBase = fs.readFileSync('temp/size/base.txt', 'utf8').trim();
+
+            let pr = context.payload.workflow_run.pull_requests?.[0];
+            if (!pr) {
+              const { data: prs } = await github.rest.repos.listPullRequestsAssociatedWithCommit({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                commit_sha: context.payload.workflow_run.head_sha,
+              });
+              pr = prs.find(p => p.state === 'open');
+            }
+
+            if (!pr) {
+              core.setFailed('Unable to resolve PR from workflow_run context.');
+              return;
+            }
+
+            if (Number(pr.number) !== artifactPr) {
+              core.setFailed(`Artifact PR number (${artifactPr}) does not match trusted context (${pr.number}).`);
+              return;
+            }
+
+            const trustedBase = pr.base?.ref;
+            if (!trustedBase || artifactBase !== trustedBase) {
+              core.setFailed(`Artifact base (${artifactBase}) does not match trusted context (${trustedBase}).`);
+              return;
+            }
+
+            core.setOutput('number', String(pr.number));
+            core.setOutput('base', trustedBase);
 
       - name: Download previous size data
         uses: dawidd6/action-download-artifact@0bd50d53a6d7fb5cb921e607957e9cc12b4ce392 # v12
         with:
-          branch: ${{ steps.pr-base.outputs.content }}
+          branch: ${{ steps.pr-meta.outputs.base }}
           workflow: ci-size-data.yaml
           event: push
           name: size-data
@@ -76,18 +124,10 @@ jobs:
       - name: Generate size report
         run: node scripts/size-report.js > size-report.md
 
-      - name: Read size report
-        id: size-report
-        uses: juliangruber/read-file-action@b549046febe0fe86f8cb4f93c24e284433f9ab58 # v1.1.7
-        with:
-          path: ./size-report.md
-
-      - name: Create or update PR comment
-        uses: actions-cool/maintain-one-comment@4b2dbf086015f892dcb5e8c1106f5fccd6c1476b # v3.2.0
+      - name: Post PR comment
+        uses: ./.github/actions/post-pr-report-comment
         with:
+          pr-number: ${{ steps.pr-meta.outputs.number }}
+          report-file: ./size-report.md
+          comment-marker: '<!-- COMFYUI_FRONTEND_SIZE -->'
           token: ${{ secrets.GITHUB_TOKEN }}
-          number: ${{ steps.pr-number.outputs.content }}
-          body: |
-            ${{ steps.size-report.outputs.content }}
-            <!-- COMFYUI_FRONTEND_SIZE -->
-          body-include: '<!-- COMFYUI_FRONTEND_SIZE -->'

.github/workflows/pr-update-playwright-expectations.yaml

@@ -77,7 +77,7 @@ jobs:
     needs: setup
     runs-on: ubuntu-latest
     container:
-      image: ghcr.io/comfy-org/comfyui-ci-container:0.0.12
+      image: ghcr.io/comfy-org/comfyui-ci-container:0.0.13
       credentials:
         username: ${{ github.actor }}
         password: ${{ secrets.GITHUB_TOKEN }}

.oxlintrc.json

@@ -35,7 +35,7 @@
       }
     ],
     "no-control-regex": "off",
-    "no-eval": "off",
+    "no-eval": "error",
     "no-redeclare": "error",
     "no-restricted-imports": [
       "error",

browser_tests/assets/subgraphs/subgraph-nested-promotion.json

@@ -0,0 +1,760 @@
+{
+  "id": "9a37f747-e96b-4304-9212-7abcaad7bdac",
+  "revision": 0,
+  "last_node_id": 11,
+  "last_link_id": 18,
+  "nodes": [
+    {
+      "id": 2,
+      "type": "PreviewAny",
+      "pos": [1031, 434],
+      "size": [250, 178],
+      "flags": {},
+      "order": 2,
+      "mode": 0,
+      "inputs": [
+        {
+          "name": "source",
+          "type": "*",
+          "link": 5
+        }
+      ],
+      "outputs": [],
+      "properties": {
+        "Node name for S&R": "PreviewAny"
+      },
+      "widgets_values": [null, null, null]
+    },
+    {
+      "id": 5,
+      "type": "1e38d8ea-45e1-48a5-aa20-966584201867",
+      "pos": [788, 433.5],
+      "size": [225, 380],
+      "flags": {},
+      "order": 1,
+      "mode": 0,
+      "inputs": [
+        {
+          "name": "string_a",
+          "type": "STRING",
+          "widget": {
+            "name": "string_a"
+          },
+          "link": 4
+        }
+      ],
+      "outputs": [
+        {
+          "name": "STRING",
+          "type": "STRING",
+          "links": [5]
+        }
+      ],
+      "properties": {
+        "proxyWidgets": [
+          ["3", "string_a"],
+          ["4", "value"],
+          ["6", "value"],
+          ["6", "value_1"]
+        ]
+      },
+      "widgets_values": []
+    },
+    {
+      "id": 1,
+      "type": "PrimitiveStringMultiline",
+      "pos": [548, 451],
+      "size": [225, 142],
+      "flags": {},
+      "order": 0,
+      "mode": 0,
+      "inputs": [],
+      "outputs": [
+        {
+          "name": "STRING",
+          "type": "STRING",
+          "links": [4]
+        }
+      ],
+      "title": "Outer",
+      "properties": {
+        "Node name for S&R": "PrimitiveStringMultiline"
+      },
+      "widgets_values": ["Outer\n"]
+    }
+  ],
+  "links": [
+    [4, 1, 0, 5, 0, "STRING"],
+    [5, 5, 0, 2, 0, "STRING"]
+  ],
+  "groups": [],
+  "definitions": {
+    "subgraphs": [
+      {
+        "id": "1e38d8ea-45e1-48a5-aa20-966584201867",
+        "version": 1,
+        "state": {
+          "lastGroupId": 0,
+          "lastNodeId": 11,
+          "lastLinkId": 18,
+          "lastRerouteId": 0
+        },
+        "revision": 0,
+        "config": {},
+        "name": "Sub 0",
+        "inputNode": {
+          "id": -10,
+          "bounding": [351, 432.5, 120, 120]
+        },
+        "outputNode": {
+          "id": -20,
+          "bounding": [1352, 294.5, 120, 60]
+        },
+        "inputs": [
+          {
+            "id": "7bf3e1d4-0521-4b5c-92f5-47ca598b7eb4",
+            "name": "string_a",
+            "type": "STRING",
+            "linkIds": [1],
+            "localized_name": "string_a",
+            "pos": [451, 452.5]
+          },
+          {
+            "id": "5fb3dcf7-9bfd-4b3c-a1b9-750b4f3edf19",
+            "name": "value",
+            "type": "STRING",
+            "linkIds": [13],
+            "pos": [451, 472.5]
+          },
+          {
+            "id": "55d24b8a-7c82-4b02-8e3d-ff31ffb8aa13",
+            "name": "value_1",
+            "type": "STRING",
+            "linkIds": [16],
+            "pos": [451, 492.5]
+          },
+          {
+            "id": "c1fe7cc3-547e-4fb0-b763-61888558d4bd",
+            "name": "value_1_1",
+            "type": "STRING",
+            "linkIds": [18],
+            "pos": [451, 512.5]
+          }
+        ],
+        "outputs": [
+          {
+            "id": "fbe975ba-d7c2-471e-a99a-a1e2c6ab466d",
+            "name": "STRING",
+            "type": "STRING",
+            "linkIds": [9],
+            "localized_name": "STRING",
+            "pos": [1372, 314.5]
+          }
+        ],
+        "widgets": [],
+        "nodes": [
+          {
+            "id": 4,
+            "type": "PrimitiveStringMultiline",
+            "pos": [504, 437],
+            "size": [210, 88],
+            "flags": {},
+            "order": 1,
+            "mode": 0,
+            "inputs": [
+              {
+                "localized_name": "value",
+                "name": "value",
+                "type": "STRING",
+                "widget": {
+                  "name": "value"
+                },
+                "link": 13
+              }
+            ],
+            "outputs": [
+              {
+                "localized_name": "STRING",
+                "name": "STRING",
+                "type": "STRING",
+                "links": [2]
+              }
+            ],
+            "title": "Inner 1",
+            "properties": {
+              "Node name for S&R": "PrimitiveStringMultiline"
+            },
+            "widgets_values": ["Inner 1\n"]
+          },
+          {
+            "id": 3,
+            "type": "StringConcatenate",
+            "pos": [743, 325],
+            "size": [347, 231],
+            "flags": {},
+            "order": 0,
+            "mode": 0,
+            "inputs": [
+              {
+                "localized_name": "string_a",
+                "name": "string_a",
+                "type": "STRING",
+                "widget": {
+                  "name": "string_a"
+                },
+                "link": 1
+              },
+              {
+                "localized_name": "string_b",
+                "name": "string_b",
+                "type": "STRING",
+                "widget": {
+                  "name": "string_b"
+                },
+                "link": 2
+              }
+            ],
+            "outputs": [
+              {
+                "localized_name": "STRING",
+                "name": "STRING",
+                "type": "STRING",
+                "links": [7]
+              }
+            ],
+            "properties": {
+              "Node name for S&R": "StringConcatenate"
+            },
+            "widgets_values": ["", "", ""]
+          },
+          {
+            "id": 6,
+            "type": "9be42452-056b-4c99-9f9f-7381d11c4454",
+            "pos": [1115, 301],
+            "size": [210, 196],
+            "flags": {},
+            "order": 2,
+            "mode": 0,
+            "inputs": [
+              {
+                "localized_name": "string_a",
+                "name": "string_a",
+                "type": "STRING",
+                "widget": {
+                  "name": "string_a"
+                },
+                "link": 7
+              },
+              {
+                "name": "value",
+                "type": "STRING",
+                "widget": {
+                  "name": "value"
+                },
+                "link": 16
+              },
+              {
+                "name": "value_1",
+                "type": "STRING",
+                "widget": {
+                  "name": "value_1"
+                },
+                "link": 18
+              }
+            ],
+            "outputs": [
+              {
+                "localized_name": "STRING",
+                "name": "STRING",
+                "type": "STRING",
+                "links": [9]
+              }
+            ],
+            "properties": {
+              "proxyWidgets": [
+                ["5", "string_a"],
+                ["11", "value"],
+                ["9", "value"],
+                ["10", "string_a"]
+              ]
+            },
+            "widgets_values": []
+          }
+        ],
+        "groups": [],
+        "links": [
+          {
+            "id": 2,
+            "origin_id": 4,
+            "origin_slot": 0,
+            "target_id": 3,
+            "target_slot": 1,
+            "type": "STRING"
+          },
+          {
+            "id": 1,
+            "origin_id": -10,
+            "origin_slot": 0,
+            "target_id": 3,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 7,
+            "origin_id": 3,
+            "origin_slot": 0,
+            "target_id": 6,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 6,
+            "origin_id": 6,
+            "origin_slot": 0,
+            "target_id": -20,
+            "target_slot": 1,
+            "type": "STRING"
+          },
+          {
+            "id": 9,
+            "origin_id": 6,
+            "origin_slot": 0,
+            "target_id": -20,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 13,
+            "origin_id": -10,
+            "origin_slot": 1,
+            "target_id": 4,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 16,
+            "origin_id": -10,
+            "origin_slot": 2,
+            "target_id": 6,
+            "target_slot": 1,
+            "type": "STRING"
+          },
+          {
+            "id": 18,
+            "origin_id": -10,
+            "origin_slot": 3,
+            "target_id": 6,
+            "target_slot": 2,
+            "type": "STRING"
+          }
+        ],
+        "extra": {}
+      },
+      {
+        "id": "9be42452-056b-4c99-9f9f-7381d11c4454",
+        "version": 1,
+        "state": {
+          "lastGroupId": 0,
+          "lastNodeId": 11,
+          "lastLinkId": 18,
+          "lastRerouteId": 0
+        },
+        "revision": 0,
+        "config": {},
+        "name": "Sub 1",
+        "inputNode": {
+          "id": -10,
+          "bounding": [180, 739, 120, 100]
+        },
+        "outputNode": {
+          "id": -20,
+          "bounding": [1246, 612, 120, 60]
+        },
+        "inputs": [
+          {
+            "id": "01c05c51-86b5-4bad-b32f-9c911683a13d",
+            "name": "string_a",
+            "type": "STRING",
+            "linkIds": [4],
+            "localized_name": "string_a",
+            "pos": [280, 759]
+          },
+          {
+            "id": "d50f6a62-0185-43d4-a174-a8a94bd8f6e7",
+            "name": "value",
+            "type": "STRING",
+            "linkIds": [14],
+            "pos": [280, 779]
+          },
+          {
+            "id": "6b78450e-5986-49cd-b743-c933e5a34a69",
+            "name": "value_1",
+            "type": "STRING",
+            "linkIds": [17],
+            "pos": [280, 799]
+          }
+        ],
+        "outputs": [
+          {
+            "id": "a8bcf3bf-a66a-4c71-8d92-17a2a4d03686",
+            "name": "STRING",
+            "type": "STRING",
+            "linkIds": [12],
+            "localized_name": "STRING",
+            "pos": [1266, 632]
+          }
+        ],
+        "widgets": [],
+        "nodes": [
+          {
+            "id": 11,
+            "type": "PrimitiveStringMultiline",
+            "pos": [334, 742],
+            "size": [210, 88],
+            "flags": {},
+            "order": 2,
+            "mode": 0,
+            "inputs": [
+              {
+                "localized_name": "value",
+                "name": "value",
+                "type": "STRING",
+                "widget": {
+                  "name": "value"
+                },
+                "link": 14
+              }
+            ],
+            "outputs": [
+              {
+                "localized_name": "STRING",
+                "name": "STRING",
+                "type": "STRING",
+                "links": [7]
+              }
+            ],
+            "title": "Inner 2",
+            "properties": {
+              "Node name for S&R": "PrimitiveStringMultiline"
+            },
+            "widgets_values": ["Inner 2\n"]
+          },
+          {
+            "id": 10,
+            "type": "StringConcatenate",
+            "pos": [581, 637],
+            "size": [400, 200],
+            "flags": {},
+            "order": 1,
+            "mode": 0,
+            "inputs": [
+              {
+                "localized_name": "string_a",
+                "name": "string_a",
+                "type": "STRING",
+                "widget": {
+                  "name": "string_a"
+                },
+                "link": 4
+              },
+              {
+                "localized_name": "string_b",
+                "name": "string_b",
+                "type": "STRING",
+                "widget": {
+                  "name": "string_b"
+                },
+                "link": 7
+              }
+            ],
+            "outputs": [
+              {
+                "localized_name": "STRING",
+                "name": "STRING",
+                "type": "STRING",
+                "links": [11]
+              }
+            ],
+            "properties": {
+              "Node name for S&R": "StringConcatenate"
+            },
+            "widgets_values": ["", "", ""]
+          },
+          {
+            "id": 9,
+            "type": "7c2915a5-5eb8-4958-a8fd-4beb30f370ce",
+            "pos": [1004, 613],
+            "size": [210, 142],
+            "flags": {},
+            "order": 0,
+            "mode": 0,
+            "inputs": [
+              {
+                "localized_name": "string_a",
+                "name": "string_a",
+                "type": "STRING",
+                "widget": {
+                  "name": "string_a"
+                },
+                "link": 11
+              },
+              {
+                "name": "value",
+                "type": "STRING",
+                "widget": {
+                  "name": "value"
+                },
+                "link": 17
+              }
+            ],
+            "outputs": [
+              {
+                "localized_name": "STRING",
+                "name": "STRING",
+                "type": "STRING",
+                "links": [12]
+              }
+            ],
+            "properties": {
+              "proxyWidgets": [
+                ["7", "string_a"],
+                ["8", "value"]
+              ]
+            },
+            "widgets_values": []
+          }
+        ],
+        "groups": [],
+        "links": [
+          {
+            "id": 4,
+            "origin_id": -10,
+            "origin_slot": 0,
+            "target_id": 10,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 7,
+            "origin_id": 11,
+            "origin_slot": 0,
+            "target_id": 10,
+            "target_slot": 1,
+            "type": "STRING"
+          },
+          {
+            "id": 11,
+            "origin_id": 10,
+            "origin_slot": 0,
+            "target_id": 9,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 10,
+            "origin_id": 9,
+            "origin_slot": 0,
+            "target_id": -20,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 12,
+            "origin_id": 9,
+            "origin_slot": 0,
+            "target_id": -20,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 14,
+            "origin_id": -10,
+            "origin_slot": 1,
+            "target_id": 11,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 17,
+            "origin_id": -10,
+            "origin_slot": 2,
+            "target_id": 9,
+            "target_slot": 1,
+            "type": "STRING"
+          }
+        ],
+        "extra": {}
+      },
+      {
+        "id": "7c2915a5-5eb8-4958-a8fd-4beb30f370ce",
+        "version": 1,
+        "state": {
+          "lastGroupId": 0,
+          "lastNodeId": 11,
+          "lastLinkId": 18,
+          "lastRerouteId": 0
+        },
+        "revision": 0,
+        "config": {},
+        "name": "Sub 2",
+        "inputNode": {
+          "id": -10,
+          "bounding": [262, 1222, 120, 80]
+        },
+        "outputNode": {
+          "id": -20,
+          "bounding": [1123.089999999999, 1125.1999999999998, 120, 60]
+        },
+        "inputs": [
+          {
+            "id": "934a8baa-d79c-428c-8ec9-814ad437d7c7",
+            "name": "string_a",
+            "type": "STRING",
+            "linkIds": [9],
+            "localized_name": "string_a",
+            "pos": [362, 1242]
+          },
+          {
+            "id": "3a545207-7202-42a9-a82f-3b62e1b0f459",
+            "name": "value",
+            "type": "STRING",
+            "linkIds": [15],
+            "pos": [362, 1262]
+          }
+        ],
+        "outputs": [
+          {
+            "id": "4c3d243b-9ff6-4dcd-9dbf-e4ec8e1fc879",
+            "name": "STRING",
+            "type": "STRING",
+            "linkIds": [10],
+            "localized_name": "STRING",
+            "pos": [1143.089999999999, 1145.1999999999998]
+          }
+        ],
+        "widgets": [],
+        "nodes": [
+          {
+            "id": 8,
+            "type": "PrimitiveStringMultiline",
+            "pos": [412.96000000000004, 1228.2399999999996],
+            "size": [210, 88],
+            "flags": {},
+            "order": 1,
+            "mode": 0,
+            "inputs": [
+              {
+                "localized_name": "value",
+                "name": "value",
+                "type": "STRING",
+                "widget": {
+                  "name": "value"
+                },
+                "link": 15
+              }
+            ],
+            "outputs": [
+              {
+                "localized_name": "STRING",
+                "name": "STRING",
+                "type": "STRING",
+                "links": [8]
+              }
+            ],
+            "title": "Inner 3",
+            "properties": {
+              "Node name for S&R": "PrimitiveStringMultiline"
+            },
+            "widgets_values": ["Inner 3\n"]
+          },
+          {
+            "id": 7,
+            "type": "StringConcatenate",
+            "pos": [686.08, 1132.38],
+            "size": [400, 200],
+            "flags": {},
+            "order": 0,
+            "mode": 0,
+            "inputs": [
+              {
+                "localized_name": "string_a",
+                "name": "string_a",
+                "type": "STRING",
+                "widget": {
+                  "name": "string_a"
+                },
+                "link": 9
+              },
+              {
+                "localized_name": "string_b",
+                "name": "string_b",
+                "type": "STRING",
+                "widget": {
+                  "name": "string_b"
+                },
+                "link": 8
+              }
+            ],
+            "outputs": [
+              {
+                "localized_name": "STRING",
+                "name": "STRING",
+                "type": "STRING",
+                "links": [10]
+              }
+            ],
+            "properties": {
+              "Node name for S&R": "StringConcatenate"
+            },
+            "widgets_values": ["", "", ""]
+          }
+        ],
+        "groups": [],
+        "links": [
+          {
+            "id": 8,
+            "origin_id": 8,
+            "origin_slot": 0,
+            "target_id": 7,
+            "target_slot": 1,
+            "type": "STRING"
+          },
+          {
+            "id": 9,
+            "origin_id": -10,
+            "origin_slot": 0,
+            "target_id": 7,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 10,
+            "origin_id": 7,
+            "origin_slot": 0,
+            "target_id": -20,
+            "target_slot": 0,
+            "type": "STRING"
+          },
+          {
+            "id": 15,
+            "origin_id": -10,
+            "origin_slot": 1,
+            "target_id": 8,
+            "target_slot": 0,
+            "type": "STRING"
+          }
+        ],
+        "extra": {}
+      }
+    ]
+  },
+  "config": {},
+  "extra": {
+    "ds": {
+      "scale": 1,
+      "offset": [-412, 11]
+    },
+    "frontendVersion": "1.41.7"
+  },
+  "version": 0.4
+}

browser_tests/fixtures/ComfyPage.ts

@@ -24,6 +24,7 @@ import {
 } from './components/SidebarTab'
 import { Topbar } from './components/Topbar'
 import { CanvasHelper } from './helpers/CanvasHelper'
+import { PerformanceHelper } from './helpers/PerformanceHelper'
 import { ClipboardHelper } from './helpers/ClipboardHelper'
 import { CommandHelper } from './helpers/CommandHelper'
 import { DragDropHelper } from './helpers/DragDropHelper'
@@ -185,6 +186,7 @@ export class ComfyPage {
   public readonly dragDrop: DragDropHelper
   public readonly command: CommandHelper
   public readonly bottomPanel: BottomPanel
+  public readonly perf: PerformanceHelper
 
   /** Worker index to test user ID */
   public readonly userIds: string[] = []
@@ -229,6 +231,7 @@ export class ComfyPage {
     this.dragDrop = new DragDropHelper(page, this.assetPath.bind(this))
     this.command = new CommandHelper(page)
     this.bottomPanel = new BottomPanel(page)
+    this.perf = new PerformanceHelper(page)
   }
 
   get visibleToasts() {
@@ -436,7 +439,13 @@ export const comfyPageFixture = base.extend<{
     }
 
     await comfyPage.setup()
+
+    const isPerf = testInfo.tags.includes('@perf')
+    if (isPerf) await comfyPage.perf.init()
+
     await use(comfyPage)
+
+    if (isPerf) await comfyPage.perf.dispose()
   },
   comfyMouse: async ({ comfyPage }, use) => {
     const comfyMouse = new ComfyMouse(comfyPage)

browser_tests/fixtures/components/ComfyNodeSearchBox.ts

@@ -55,15 +55,22 @@ export class ComfyNodeSearchBox {
 
   async fillAndSelectFirstNode(
     nodeName: string,
-    options?: { suggestionIndex: number }
+    options?: { suggestionIndex?: number; exact?: boolean }
   ) {
     await this.input.waitFor({ state: 'visible' })
     await this.input.fill(nodeName)
     await this.dropdown.waitFor({ state: 'visible' })
-    await this.dropdown
-      .locator('li')
-      .nth(options?.suggestionIndex || 0)
-      .click()
+    if (options?.exact) {
+      await this.dropdown
+        .locator(`li[aria-label="${nodeName}"]`)
+        .first()
+        .click()
+    } else {
+      await this.dropdown
+        .locator('li')
+        .nth(options?.suggestionIndex || 0)
+        .click()
+    }
   }
 
   async addFilter(filterValue: string, filterType: string) {

browser_tests/fixtures/helpers/PerformanceHelper.ts

@@ -0,0 +1,96 @@
+import type { CDPSession, Page } from '@playwright/test'
+
+interface PerfSnapshot {
+  RecalcStyleCount: number
+  RecalcStyleDuration: number
+  LayoutCount: number
+  LayoutDuration: number
+  TaskDuration: number
+  JSHeapUsedSize: number
+  Timestamp: number
+}
+
+export interface PerfMeasurement {
+  name: string
+  durationMs: number
+  styleRecalcs: number
+  styleRecalcDurationMs: number
+  layouts: number
+  layoutDurationMs: number
+  taskDurationMs: number
+  heapDeltaBytes: number
+}
+
+export class PerformanceHelper {
+  private cdp: CDPSession | null = null
+  private snapshot: PerfSnapshot | null = null
+
+  constructor(private readonly page: Page) {}
+
+  async init(): Promise<void> {
+    this.cdp = await this.page.context().newCDPSession(this.page)
+    await this.cdp.send('Performance.enable')
+  }
+
+  async dispose(): Promise<void> {
+    this.snapshot = null
+    if (this.cdp) {
+      try {
+        await this.cdp.send('Performance.disable')
+      } finally {
+        await this.cdp.detach()
+        this.cdp = null
+      }
+    }
+  }
+
+  private async getSnapshot(): Promise<PerfSnapshot> {
+    if (!this.cdp) throw new Error('PerformanceHelper not initialized')
+    const { metrics } = (await this.cdp.send('Performance.getMetrics')) as {
+      metrics: { name: string; value: number }[]
+    }
+    function get(name: string): number {
+      return metrics.find((m) => m.name === name)?.value ?? 0
+    }
+    return {
+      RecalcStyleCount: get('RecalcStyleCount'),
+      RecalcStyleDuration: get('RecalcStyleDuration'),
+      LayoutCount: get('LayoutCount'),
+      LayoutDuration: get('LayoutDuration'),
+      TaskDuration: get('TaskDuration'),
+      JSHeapUsedSize: get('JSHeapUsedSize'),
+      Timestamp: get('Timestamp')
+    }
+  }
+
+  async startMeasuring(): Promise<void> {
+    if (this.snapshot) {
+      throw new Error(
+        'Measurement already in progress — call stopMeasuring() first'
+      )
+    }
+    this.snapshot = await this.getSnapshot()
+  }
+
+  async stopMeasuring(name: string): Promise<PerfMeasurement> {
+    if (!this.snapshot) throw new Error('Call startMeasuring() first')
+    const after = await this.getSnapshot()
+    const before = this.snapshot
+    this.snapshot = null
+
+    function delta(key: keyof PerfSnapshot): number {
+      return after[key] - before[key]
+    }
+
+    return {
+      name,
+      durationMs: delta('Timestamp') * 1000,
+      styleRecalcs: delta('RecalcStyleCount'),
+      styleRecalcDurationMs: delta('RecalcStyleDuration') * 1000,
+      layouts: delta('LayoutCount'),
+      layoutDurationMs: delta('LayoutDuration') * 1000,
+      taskDurationMs: delta('TaskDuration') * 1000,
+      heapDeltaBytes: delta('JSHeapUsedSize')
+    }
+  }
+}

browser_tests/globalTeardown.ts

@@ -1,11 +1,14 @@
 import type { FullConfig } from '@playwright/test'
 import dotenv from 'dotenv'
 
+import { writePerfReport } from './helpers/perfReporter'
 import { restorePath } from './utils/backupUtils'
 
 dotenv.config()
 
 export default function globalTeardown(_config: FullConfig) {
+  writePerfReport()
+
   if (!process.env.CI && process.env.TEST_COMFYUI_DIR) {
     restorePath([process.env.TEST_COMFYUI_DIR, 'user'])
     restorePath([process.env.TEST_COMFYUI_DIR, 'models'])

browser_tests/helpers/perfReporter.ts

@@ -0,0 +1,49 @@
+import { mkdirSync, readdirSync, readFileSync, writeFileSync } from 'fs'
+import { join } from 'path'
+
+import type { PerfMeasurement } from '../fixtures/helpers/PerformanceHelper'
+
+export interface PerfReport {
+  timestamp: string
+  gitSha: string
+  branch: string
+  measurements: PerfMeasurement[]
+}
+
+const TEMP_DIR = join('test-results', 'perf-temp')
+
+export function recordMeasurement(m: PerfMeasurement) {
+  mkdirSync(TEMP_DIR, { recursive: true })
+  const filename = `${m.name}-${Date.now()}.json`
+  writeFileSync(join(TEMP_DIR, filename), JSON.stringify(m))
+}
+
+export function writePerfReport(
+  gitSha = process.env.GITHUB_SHA ?? 'local',
+  branch = process.env.GITHUB_HEAD_REF ?? 'local'
+) {
+  if (!readdirSync('test-results', { withFileTypes: true }).length) return
+
+  let tempFiles: string[]
+  try {
+    tempFiles = readdirSync(TEMP_DIR).filter((f) => f.endsWith('.json'))
+  } catch {
+    return
+  }
+  if (tempFiles.length === 0) return
+
+  const measurements: PerfMeasurement[] = tempFiles.map((f) =>
+    JSON.parse(readFileSync(join(TEMP_DIR, f), 'utf-8'))
+  )
+
+  const report: PerfReport = {
+    timestamp: new Date().toISOString(),
+    gitSha,
+    branch,
+    measurements
+  }
+  writeFileSync(
+    join('test-results', 'perf-metrics.json'),
+    JSON.stringify(report, null, 2)
+  )
+}

browser_tests/tests/interaction.spec.ts

@@ -171,6 +171,9 @@ test.describe('Node Interaction', () => {
 
   test('Can drag node', { tag: '@screenshot' }, async ({ comfyPage }) => {
     await comfyPage.nodeOps.dragTextEncodeNode2()
+    // Move mouse away to avoid hover highlight on the node at the drop position.
+    await comfyPage.canvasOps.moveMouseToEmptyArea()
+    await comfyPage.nextFrame()
     await expect(comfyPage.canvas).toHaveScreenshot('dragged-node1.png')
   })
 

browser_tests/tests/loadWorkflowInMedia.spec.ts

@@ -29,11 +29,23 @@ test.describe(
       // Currently opens missing nodes dialog which is outside scope of AVIF loading functionality
       // 'workflow.avif'
     ]
+    const filesWithUpload = new Set(['no_workflow.webp'])
+
     fileNames.forEach(async (fileName) => {
       test(`Load workflow in ${fileName} (drop from filesystem)`, async ({
         comfyPage
       }) => {
-        await comfyPage.dragDrop.dragAndDropFile(`workflowInMedia/${fileName}`)
+        const waitForUpload = filesWithUpload.has(fileName)
+        await comfyPage.dragDrop.dragAndDropFile(
+          `workflowInMedia/${fileName}`,
+          { waitForUpload }
+        )
+        if (waitForUpload) {
+          await comfyPage.page.waitForResponse(
+            (resp) => resp.url().includes('/view') && resp.status() !== 0,
+            { timeout: 10000 }
+          )
+        }
         await expect(comfyPage.canvas).toHaveScreenshot(`${fileName}.png`)
       })
     })

browser_tests/tests/nodeSearchBox.spec.ts

@@ -110,7 +110,9 @@ test.describe('Node search box', { tag: '@node' }, () => {
       await comfyPage.canvasOps.disconnectEdge()
       await expect(comfyPage.searchBox.input).toHaveCount(1)
       await comfyPage.page.locator('.p-chip-remove-icon').click()
-      await comfyPage.searchBox.fillAndSelectFirstNode('KSampler')
+      await comfyPage.searchBox.fillAndSelectFirstNode('KSampler', {
+        exact: true
+      })
       await expect(comfyPage.canvas).toHaveScreenshot(
         'added-node-no-connection.png'
       )

browser_tests/tests/performance.spec.ts

@@ -0,0 +1,132 @@
+import { comfyPageFixture as test } from '../fixtures/ComfyPage'
+import { recordMeasurement } from '../helpers/perfReporter'
+
+test.describe('Performance', { tag: ['@perf'] }, () => {
+  test('canvas idle style recalculations', async ({ comfyPage }) => {
+    await comfyPage.workflow.loadWorkflow('default')
+    await comfyPage.perf.startMeasuring()
+
+    // Let the canvas idle for 2 seconds — no user interaction.
+    // Measures baseline style recalcs from reactive state + render loop.
+    for (let i = 0; i < 120; i++) {
+      await comfyPage.nextFrame()
+    }
+
+    const m = await comfyPage.perf.stopMeasuring('canvas-idle')
+    recordMeasurement(m)
+    console.log(
+      `Canvas idle: ${m.styleRecalcs} style recalcs, ${m.layouts} layouts`
+    )
+  })
+
+  test('canvas mouse interaction style recalculations', async ({
+    comfyPage
+  }) => {
+    await comfyPage.workflow.loadWorkflow('default')
+    await comfyPage.perf.startMeasuring()
+
+    const canvas = comfyPage.canvas
+    const box = await canvas.boundingBox()
+    if (!box) throw new Error('Canvas bounding box not available')
+
+    // Sweep mouse across the canvas — crosses nodes, empty space, slots
+    for (let i = 0; i < 100; i++) {
+      await comfyPage.page.mouse.move(
+        box.x + (box.width * i) / 100,
+        box.y + (box.height * (i % 3)) / 3
+      )
+    }
+
+    const m = await comfyPage.perf.stopMeasuring('canvas-mouse-sweep')
+    recordMeasurement(m)
+    console.log(
+      `Mouse sweep: ${m.styleRecalcs} style recalcs, ${m.layouts} layouts`
+    )
+  })
+
+  test('DOM widget clipping during node selection', async ({ comfyPage }) => {
+    // Load default workflow which has DOM widgets (text inputs, combos)
+    await comfyPage.workflow.loadWorkflow('default')
+    await comfyPage.perf.startMeasuring()
+
+    // Select and deselect nodes rapidly to trigger clipping recalculation
+    const canvas = comfyPage.canvas
+    const box = await canvas.boundingBox()
+    if (!box) throw new Error('Canvas bounding box not available')
+
+    for (let i = 0; i < 20; i++) {
+      // Click on canvas area (nodes occupy various positions)
+      await comfyPage.page.mouse.click(
+        box.x + box.width / 3 + (i % 5) * 30,
+        box.y + box.height / 3 + (i % 4) * 30
+      )
+      await comfyPage.nextFrame()
+    }
+
+    const m = await comfyPage.perf.stopMeasuring('dom-widget-clipping')
+    recordMeasurement(m)
+    console.log(`Clipping: ${m.layouts} forced layouts`)
+  })
+
+  test('subgraph idle style recalculations', async ({ comfyPage }) => {
+    await comfyPage.workflow.loadWorkflow('subgraphs/nested-subgraph')
+    await comfyPage.perf.startMeasuring()
+
+    for (let i = 0; i < 120; i++) {
+      await comfyPage.nextFrame()
+    }
+
+    const m = await comfyPage.perf.stopMeasuring('subgraph-idle')
+    recordMeasurement(m)
+    console.log(
+      `Subgraph idle: ${m.styleRecalcs} style recalcs, ${m.layouts} layouts`
+    )
+  })
+
+  test('subgraph mouse interaction style recalculations', async ({
+    comfyPage
+  }) => {
+    await comfyPage.workflow.loadWorkflow('subgraphs/nested-subgraph')
+    await comfyPage.perf.startMeasuring()
+
+    const canvas = comfyPage.canvas
+    const box = await canvas.boundingBox()
+    if (!box) throw new Error('Canvas bounding box not available')
+
+    for (let i = 0; i < 100; i++) {
+      await comfyPage.page.mouse.move(
+        box.x + (box.width * i) / 100,
+        box.y + (box.height * (i % 3)) / 3
+      )
+    }
+
+    const m = await comfyPage.perf.stopMeasuring('subgraph-mouse-sweep')
+    recordMeasurement(m)
+    console.log(
+      `Subgraph mouse sweep: ${m.styleRecalcs} style recalcs, ${m.layouts} layouts`
+    )
+  })
+
+  test('subgraph DOM widget clipping during node selection', async ({
+    comfyPage
+  }) => {
+    await comfyPage.workflow.loadWorkflow('subgraphs/nested-subgraph')
+    await comfyPage.perf.startMeasuring()
+
+    const canvas = comfyPage.canvas
+    const box = await canvas.boundingBox()
+    if (!box) throw new Error('Canvas bounding box not available')
+
+    for (let i = 0; i < 20; i++) {
+      await comfyPage.page.mouse.click(
+        box.x + box.width / 3 + (i % 5) * 30,
+        box.y + box.height / 3 + (i % 4) * 30
+      )
+      await comfyPage.nextFrame()
+    }
+
+    const m = await comfyPage.perf.stopMeasuring('subgraph-dom-widget-clipping')
+    recordMeasurement(m)
+    console.log(`Subgraph clipping: ${m.layouts} forced layouts`)
+  })
+})

browser_tests/tests/sidebar/workflows.spec.ts

@@ -330,12 +330,9 @@ test.describe('Workflows sidebar', () => {
       .getPersistedItem('workflow1.json')
       .click({ button: 'right' })
     await comfyPage.contextMenu.clickMenuItem('Duplicate')
-    await comfyPage.nextFrame()
-
-    expect(await workflowsTab.getOpenedWorkflowNames()).toEqual([
-      '*Unsaved Workflow.json',
-      '*workflow1 (Copy).json'
-    ])
+    await expect
+      .poll(() => workflowsTab.getOpenedWorkflowNames())
+      .toEqual(['*Unsaved Workflow.json', '*workflow1 (Copy).json'])
   })
 
   test('Can drop workflow from workflows sidebar', async ({ comfyPage }) => {

browser_tests/tests/subgraphPromotion.spec.ts

@@ -555,6 +555,74 @@ test.describe(
       })
     })
 
+    test.describe('Nested Promoted Widget Disabled State', () => {
+      test('Externally linked promoted widget is disabled, unlinked ones are not', async ({
+        comfyPage
+      }) => {
+        await comfyPage.workflow.loadWorkflow(
+          'subgraphs/subgraph-nested-promotion'
+        )
+        await comfyPage.nextFrame()
+
+        // Node 5 (Sub 0) has 4 promoted widgets. The first (string_a) has its
+        // slot connected externally from the Outer node, so it should be
+        // disabled. The remaining promoted textarea widgets (value, value_1)
+        // are unlinked and should be enabled.
+        const promotedNames = await getPromotedWidgetNames(comfyPage, '5')
+        expect(promotedNames).toContain('string_a')
+        expect(promotedNames).toContain('value')
+
+        const disabledState = await comfyPage.page.evaluate(() => {
+          const node = window.app!.canvas.graph!.getNodeById('5')
+          return (node?.widgets ?? []).map((w) => ({
+            name: w.name,
+            disabled: !!w.computedDisabled
+          }))
+        })
+
+        const linkedWidget = disabledState.find((w) => w.name === 'string_a')
+        expect(linkedWidget?.disabled).toBe(true)
+
+        const unlinkedWidgets = disabledState.filter(
+          (w) => w.name !== 'string_a'
+        )
+        for (const w of unlinkedWidgets) {
+          expect(w.disabled).toBe(false)
+        }
+      })
+
+      test('Unlinked promoted textarea widgets are editable on the subgraph exterior', async ({
+        comfyPage
+      }) => {
+        await comfyPage.workflow.loadWorkflow(
+          'subgraphs/subgraph-nested-promotion'
+        )
+        await comfyPage.nextFrame()
+
+        // The promoted textareas that are NOT externally linked should be
+        // fully opaque and interactive.
+        const textareas = comfyPage.page.getByTestId(
+          TestIds.widgets.domWidgetTextarea
+        )
+        await expect(textareas.first()).toBeVisible()
+
+        const count = await textareas.count()
+        for (let i = 0; i < count; i++) {
+          const textarea = textareas.nth(i)
+          const wrapper = textarea.locator('..')
+          const opacity = await wrapper.evaluate(
+            (el) => getComputedStyle(el).opacity
+          )
+
+          if (opacity === '1' && (await textarea.isEditable())) {
+            const testContent = `nested-promotion-edit-${i}`
+            await textarea.fill(testContent)
+            await expect(textarea).toHaveValue(testContent)
+          }
+        }
+      })
+    })
+
     test.describe('Promotion Cleanup', () => {
       test('Removing subgraph node clears promotion store entries', async ({
         comfyPage

eslint.config.ts

@@ -1,6 +1,7 @@
 // For more info, see https://github.com/storybookjs/eslint-plugin-storybook#configuration-flat-config-format
 import pluginJs from '@eslint/js'
 import pluginI18n from '@intlify/eslint-plugin-vue-i18n'
+import betterTailwindcss from 'eslint-plugin-better-tailwindcss'
 import { createTypeScriptImportResolver } from 'eslint-import-resolver-typescript'
 import { importX } from 'eslint-plugin-import-x'
 import oxlint from 'eslint-plugin-oxlint'
@@ -22,7 +23,9 @@ const extraFileExtensions = ['.vue']
 
 const commonGlobals = {
   ...globals.browser,
-  __COMFYUI_FRONTEND_VERSION__: 'readonly'
+  __COMFYUI_FRONTEND_VERSION__: 'readonly',
+  __DISTRIBUTION__: 'readonly',
+  __IS_NIGHTLY__: 'readonly'
 } as const
 
 const settings = {
@@ -75,6 +78,7 @@ export default defineConfig([
       'src/scripts/*',
       'src/types/generatedManagerTypes.ts',
       'src/types/vue-shim.d.ts',
+      'packages/design-system/src/css/lucideStrokePlugin.js',
       'test-results/*',
       'vitest.setup.ts'
     ]
@@ -109,6 +113,25 @@ export default defineConfig([
   tseslintConfigs.recommended,
   // Difference in typecheck on CI vs Local
   pluginVue.configs['flat/recommended'],
+  // Tailwind CSS v4 linting (class ordering, duplicates, conflicts, etc.)
+  betterTailwindcss.configs.recommended,
+  {
+    settings: {
+      'better-tailwindcss': {
+        entryPoint: 'packages/design-system/src/css/style.css'
+      }
+    },
+    rules: {
+      // Off: requires whitelisting non-Tailwind classes (PrimeIcons, custom CSS)
+      'better-tailwindcss/no-unknown-classes': 'off',
+      // Off: may conflict with oxfmt formatting
+      'better-tailwindcss/enforce-consistent-line-wrapping': 'off',
+      // Off: large batch change, enable and apply with `eslint --fix`
+      'better-tailwindcss/enforce-consistent-class-order': 'error',
+      'better-tailwindcss/enforce-canonical-classes': 'error',
+      'better-tailwindcss/no-deprecated-classes': 'error'
+    }
+  },
   // Disables ESLint rules that conflict with formatters
   eslintConfigPrettier,
   // @ts-expect-error Type incompatibility between storybook plugin and ESLint config types

global.d.ts

@@ -33,6 +33,8 @@ interface Window {
     gtm_container_id?: string
     ga_measurement_id?: string
     mixpanel_token?: string
+    posthog_project_token?: string
+    posthog_api_host?: string
     require_whitelist?: boolean
     subscription_required?: boolean
     max_upload_size?: number

knip.config.ts

@@ -40,8 +40,14 @@ const config: KnipConfig = {
     'packages/registry-types/src/comfyRegistryTypes.ts',
     // Used by a custom node (that should move off of this)
     'src/scripts/ui/components/splitButton.ts',
+    // Used by stacked PR (feat/glsl-live-preview)
+    'src/renderer/glsl/useGLSLRenderer.ts',
     // Workflow files contain license names that knip misinterprets as binaries
-    '.github/workflows/ci-oss-assets-validation.yaml'
+    '.github/workflows/ci-oss-assets-validation.yaml',
+    // Pending integration in stacked PR
+    'src/components/sidebar/tabs/nodeLibrary/CustomNodesPanel.vue',
+    // Agent review check config, not part of the build
+    '.agents/checks/eslint.strict.config.js'
   ],
   compilers: {
     // https://github.com/webpro-nl/knip/issues/1008#issuecomment-3207756199

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@comfyorg/comfyui-frontend",
-  "version": "1.41.5",
+  "version": "1.41.13",
   "private": true,
   "description": "Official front-end implementation of ComfyUI",
   "homepage": "https://comfy.org",
@@ -60,6 +60,7 @@
     "@comfyorg/registry-types": "workspace:*",
     "@comfyorg/shared-frontend-utils": "workspace:*",
     "@comfyorg/tailwind-utils": "workspace:*",
+    "@formkit/auto-animate": "catalog:",
     "@iconify/json": "catalog:",
     "@primeuix/forms": "catalog:",
     "@primeuix/styled": "catalog:",
@@ -100,6 +101,7 @@
     "loglevel": "^1.9.2",
     "marked": "^15.0.11",
     "pinia": "catalog:",
+    "posthog-js": "catalog:",
     "primeicons": "catalog:",
     "primevue": "catalog:",
     "reka-ui": "catalog:",
@@ -146,6 +148,7 @@
     "eslint": "catalog:",
     "eslint-config-prettier": "catalog:",
     "eslint-import-resolver-typescript": "catalog:",
+    "eslint-plugin-better-tailwindcss": "catalog:",
     "eslint-plugin-import-x": "catalog:",
     "eslint-plugin-oxlint": "catalog:",
     "eslint-plugin-storybook": "catalog:",

packages/design-system/package.json

@@ -11,7 +11,8 @@
   },
   "dependencies": {
     "@iconify-json/lucide": "catalog:",
-    "@iconify/tailwind4": "catalog:"
+    "@iconify/tailwind4": "catalog:",
+    "@iconify/utils": "catalog:"
   },
   "devDependencies": {
     "tailwindcss": "catalog:",

packages/design-system/src/css/lucideStrokePlugin.js

@@ -0,0 +1,71 @@
+import plugin from 'tailwindcss/plugin'
+import { getIconsCSSData } from '@iconify/utils/lib/css/icons'
+import { loadIconSet } from '@iconify/tailwind4/lib/helpers/loader.js'
+import { matchIconName } from '@iconify/utils/lib/icon/name'
+
+/**
+ * Tailwind 4 plugin that provides lucide icon variants with configurable
+ * stroke-width via class prefix.
+ *
+ * Usage in CSS:
+ *   @plugin "./lucideStrokePlugin.js";
+ *
+ * Usage in templates:
+ *   <i class="icon-s1-[lucide--settings]" />     <!-- stroke-width: 1 -->
+ *   <i class="icon-s1.5-[lucide--settings]" />   <!-- stroke-width: 1.5 -->
+ *   <i class="icon-s2.5-[lucide--settings]" />   <!-- stroke-width: 2.5 -->
+ *
+ * The default class remains stroke-width: 2.
+ */
+
+const STROKE_WIDTHS = ['1', '1.3', '1.5', '2', '2.5']
+
+const SCALE = 1.2
+
+function getDynamicCSSRulesWithStroke(icon, strokeWidth) {
+  const nameParts = icon.split(/--|:/)
+  if (nameParts.length !== 2) {
+    throw new Error(`Invalid icon name: "${icon}"`)
+  }
+  const [prefix, name] = nameParts
+  if (!(prefix.match(matchIconName) && name.match(matchIconName))) {
+    throw new Error(`Invalid icon name: "${icon}"`)
+  }
+  const iconSet = loadIconSet(prefix)
+  if (!iconSet) {
+    throw new Error(
+      `Cannot load icon set for "${prefix}". Install "@iconify-json/${prefix}" as dev dependency?`
+    )
+  }
+  const generated = getIconsCSSData(iconSet, [name], {
+    iconSelector: '.icon',
+    customise: (content) =>
+      content.replaceAll('stroke-width="2"', `stroke-width="${strokeWidth}"`)
+  })
+  if (generated.css.length !== 1) {
+    throw new Error(`Cannot find "${icon}". Bad icon name?`)
+  }
+  if (SCALE && generated.common?.rules) {
+    generated.common.rules.height = SCALE + 'em'
+    generated.common.rules.width = SCALE + 'em'
+  }
+  return {
+    ...generated.common?.rules,
+    ...generated.css[0].rules
+  }
+}
+
+export default plugin(({ matchComponents }) => {
+  for (const sw of STROKE_WIDTHS) {
+    matchComponents({
+      [`icon-s${sw}`]: (icon) => {
+        try {
+          return getDynamicCSSRulesWithStroke(icon, sw)
+        } catch (err) {
+          console.warn(err.message)
+          return {}
+        }
+      }
+    })
+  }
+})

packages/design-system/src/css/style.css

@@ -12,11 +12,13 @@
   icon-sets: from-folder(comfy, './packages/design-system/src/icons');
 }
 
+@plugin "./lucideStrokePlugin.js";
+
 /* Safelist dynamic comfy icons for node library folders */
 @source inline("icon-[comfy--{ai-model,bfl,bria,bytedance,credits,extensions-blocks,file-output,gemini,grok,hitpaw,ideogram,image-ai-edit,kling,ltxv,luma,magnific,mask,meshy,minimax,moonvalley-marey,node,openai,pin,pixverse,play,recraft,rodin,runway,sora,stability-ai,template,tencent,topaz,tripo,veo,vidu,wan,wavespeed,workflow}]");
 
 /* Safelist dynamic comfy icons for essential nodes (kebab-case of node names) */
-@source inline("icon-[comfy--{load-image,save-image,load-video,save-video,load-3-d,save-glb,image-batch,image-crop,image-scale,image-rotate,image-blur,image-invert,canny,recraft-remove-background-node,kling-lip-sync-audio-to-video-node,load-audio,save-audio,stability-text-to-audio,lora-loader,clip-text-encode,get-video-components,tencent-text-to-model-node,tencent-image-to-model-node,open-ai-chat-node,subgraph-blueprint-canny-to-video-ltx-2-0,subgraph-blueprint-pose-to-video-ltx-2-0}]");
+@source inline("icon-[comfy--{save-image,load-video,save-video,load-3-d,save-glb,image-batch,batch-images-node,image-crop,image-scale,image-rotate,image-blur,image-invert,canny,recraft-remove-background-node,kling-lip-sync-audio-to-video-node,load-audio,save-audio,stability-text-to-audio,lora-loader,lora-loader-model-only,primitive-string-multiline,get-video-components,video-slice,tencent-text-to-model-node,tencent-image-to-model-node,open-ai-chat-node,subgraph-blueprint-canny-to-video-ltx-2-0,subgraph-blueprint-pose-to-video-ltx-2-0,preview-image,image-and-mask-preview,layer-mask-mask-preview,mask-preview,image-preview-from-latent}]");
 
 @custom-variant touch (@media (hover: none));
 
@@ -199,7 +201,7 @@
       #3e1ffc 65.17%,
       #009dff 103.86%
     ),
-    var(--color-button-surface, #2d2e32);
+    linear-gradient(var(--color-button-surface, #2d2e32));
 
   /* Code styling colors for help menu*/
   --code-text-color: rgb(0 122 255 / 1);
@@ -358,26 +360,6 @@
   --button-active-surface: var(--color-charcoal-600);
   --button-icon: var(--color-smoke-800);
 
-  --subscription-button-gradient:
-    linear-gradient(
-      315deg,
-      rgb(105 230 255 / 0.15) 0%,
-      rgb(99 73 233 / 0.5) 100%
-    ),
-    radial-gradient(
-      70.71% 70.71% at 50% 50%,
-      rgb(62 99 222 / 0.15) 0.01%,
-      rgb(66 0 123 / 0.5) 100%
-    ),
-    linear-gradient(
-      92deg,
-      #d000ff 0.38%,
-      #b009fe 37.07%,
-      #3e1ffc 65.17%,
-      #009dff 103.86%
-    ),
-    var(--color-button-surface, #2d2e32);
-
   --dialog-surface: var(--color-neutral-700);
 
   --interface-menu-component-surface-hovered: var(--color-charcoal-400);
@@ -490,7 +472,6 @@
   --color-button-icon: var(--button-icon);
   --color-button-surface: var(--button-surface);
   --color-button-surface-contrast: var(--button-surface-contrast);
-  --color-subscription-button-gradient: var(--subscription-button-gradient);
 
   --color-modal-card-background: var(--modal-card-background);
   --color-modal-card-background-hovered: var(--modal-card-background-hovered);
@@ -634,6 +615,14 @@
   }
 }
 
+@utility highlight {
+  background-color: color-mix(in srgb, currentColor 20%, transparent);
+  font-weight: 700;
+  border-radius: 0.25rem;
+  padding: 0 0.125rem;
+  margin: -0.125rem 0.125rem;
+}
+
 @utility scrollbar-hide {
   scrollbar-width: none;
   &::-webkit-scrollbar {

packages/design-system/src/icons/batch-images-node.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M15 17L12.9427 14.9426C12.6926 14.6927 12.3536 14.5522 12 14.5522C11.6464 14.5522 11.3074 14.6927 11.0573 14.9426L5 21M20 15C20.5523 15 21 14.5523 21 14V5C21 4.46957 20.7893 3.96086 20.4142 3.58579C20.0391 3.21071 19.5304 3 19 3H10C9.44772 3 9 3.44772 9 4M17 18C17.5523 18 18 17.5523 18 17V8C18 7.46957 17.7893 6.96086 17.4142 6.58579C17.0391 6.21071 16.5304 6 16 6H7C6.44772 6 6 6.44772 6 7M4.33333 9H13.6667C14.403 9 15 9.59695 15 10.3333V19.6667C15 20.403 14.403 21 13.6667 21H4.33333C3.59695 21 3 20.403 3 19.6667V10.3333C3 9.59695 3.59695 9 4.33333 9ZM8.33333 13C8.33333 13.7364 7.73638 14.3333 7 14.3333C6.26362 14.3333 5.66667 13.7364 5.66667 13C5.66667 12.2636 6.26362 11.6667 7 11.6667C7.73638 11.6667 8.33333 12.2636 8.33333 13Z" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

packages/design-system/src/icons/compare_images.svg

@@ -1,5 +0,0 @@
-<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M29.9316 2.13269H25.2057V3.57269H29.9316C31.1241 3.57269 32.0916 4.54018 32.0916 5.73269V18.0646C32.0916 19.2571 31.1241 20.2246 29.9316 20.2246H25.2057V21.6646H29.9316C30.8859 21.6646 31.8019 21.2849 32.4768 20.6099C33.1516 19.9349 33.5314 19.019 33.5314 18.0647V5.73281C33.5314 4.77843 33.1518 3.86249 32.4768 3.18761C31.8018 2.51273 30.8858 2.13293 29.9316 2.13293V2.13269Z" fill="#8A8A8A"/>
-<path d="M30.2025 15.7602C30.5531 15.7602 30.8738 15.5652 31.0341 15.2539C31.1953 14.9427 31.1691 14.5677 30.9656 14.2817L29.0269 11.5601L26.7994 8.44014C26.6231 8.19359 26.3391 8.04733 26.0363 8.04733C25.7335 8.04733 25.4494 8.19358 25.2731 8.44014L25.2056 8.53389V15.7601L30.2025 15.7602Z" fill="#8A8A8A"/>
-<path d="M23.0457 1.00018C22.6482 1.00018 22.3257 1.32269 22.3257 1.72018V2.13269H17.5999C16.6455 2.13269 15.7296 2.51237 15.0547 3.18737C14.3798 3.86237 14 4.77831 14 5.73257V18.0645C14 19.0189 14.3797 19.9348 15.0547 20.6097C15.7297 21.2846 16.6456 21.6644 17.5999 21.6644H22.3257V21.88C22.3257 22.2775 22.6482 22.6 23.0457 22.6C23.4432 22.6 23.7657 22.2775 23.7657 21.88V1.72C23.7657 1.32251 23.4432 1.00018 23.0457 1.00018ZM22.3257 15.7602H17.3289C16.9783 15.7602 16.6577 15.5652 16.4974 15.2539C16.3361 14.9427 16.3624 14.5677 16.5658 14.2817L17.4471 13.0433L18.6208 11.397H18.6199C18.7961 11.1495 19.0802 11.0033 19.383 11.0033C19.6867 11.0033 19.9708 11.1495 20.1471 11.397L21.318 13.0433L21.6517 13.5233L22.3258 12.568L22.3257 15.7602Z" fill="#8A8A8A"/>
-</svg>

packages/design-system/src/icons/compare_videos.svg

@@ -1,5 +0,0 @@
-<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M29.9316 2.13269H25.2057V3.57269H29.9316C31.1241 3.57269 32.0916 4.54018 32.0916 5.73269V18.0646C32.0916 19.2571 31.1241 20.2246 29.9316 20.2246H25.2057V21.6646H29.9316C30.8859 21.6646 31.8019 21.2849 32.4768 20.6099C33.1516 19.9349 33.5314 19.019 33.5314 18.0647V5.73281C33.5314 4.77843 33.1518 3.86249 32.4768 3.18761C31.8018 2.51273 30.8858 2.13293 29.9316 2.13293V2.13269Z" fill="#8A8A8A"/>
-<path d="M29.0586 10.918C29.5299 11.2086 29.703 11.7469 29.7031 12.1836C29.7031 12.6202 29.5288 13.1584 29.0576 13.4492L25 16.0273V12.4717L25.6396 12.0801L25 11.6865V8.33887L29.0586 10.918Z" fill="#8A8A8A"/>
-<path d="M23.0459 1C23.4433 1.0001 23.7656 1.32234 23.7656 1.71973V21.8799C23.7656 22.2773 23.4433 22.5995 23.0459 22.5996C22.6484 22.5996 22.3262 22.2774 22.3262 21.8799V21.6641H17.5996C16.6454 21.664 15.7296 21.2842 15.0547 20.6094C14.3798 19.9345 14 19.0188 14 18.0645V5.73242C14 4.77822 14.3799 3.86249 15.0547 3.1875C15.7295 2.51256 16.6453 2.13288 17.5996 2.13281H22.3262V1.71973C22.3263 1.32236 22.6485 1 23.0459 1ZM19.3008 5.00195C18.5469 5.04101 17.991 5.7594 18.001 6.48438V17.8672C17.9877 18.3783 18.241 18.8887 18.667 19.1621L18.6709 19.165C19.1025 19.4368 19.6599 19.4326 20.0879 19.1494L22 17.9336V14.3105L20.7266 15.0918V9.06055L22 9.84277V6.43359L20.0869 5.21875C19.8834 5.08395 19.6474 5.00777 19.4072 5L19.3008 5.00195Z" fill="#8A8A8A"/>
-</svg>

packages/design-system/src/icons/crop_video.svg

@@ -1,4 +0,0 @@
-<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M22.3697 9.5C22.4578 9.50289 22.5441 9.53066 22.6187 9.58008L25.9107 11.6699C26.0837 11.7765 26.1471 11.9746 26.1471 12.1348C26.147 12.2949 26.0827 12.4921 25.9098 12.5986L22.6187 14.6895C22.4617 14.7931 22.2574 14.7941 22.0992 14.6943L22.0982 14.6934C21.9419 14.5931 21.8483 14.4063 21.8531 14.2188V10.0439C21.8496 9.77812 22.0541 9.51424 22.3307 9.5H22.3697ZM22.8619 13.2754L24.6646 12.1338L22.8619 10.9893V13.2754Z" fill="#8A8A8A"/>
-<path d="M18 1.2002C18.4418 1.2002 18.7998 1.55817 18.7998 2V5.2002H29C29.9941 5.2002 30.7998 6.00589 30.7998 7V17.7002H34C34.4418 17.7002 34.7998 18.0582 34.7998 18.5C34.7998 18.9418 34.4418 19.2998 34 19.2998H30.7998V22.5C30.7998 22.9418 30.4418 23.2998 30 23.2998C29.5582 23.2998 29.2002 22.9418 29.2002 22.5V19.2998H19C18.0059 19.2998 17.2002 18.4941 17.2002 17.5V6.7998H14C13.5582 6.7998 13.2002 6.44183 13.2002 6C13.2002 5.55817 13.5582 5.2002 14 5.2002H17.2002V2C17.2002 1.55817 17.5582 1.2002 18 1.2002ZM18.7998 17.5C18.7998 17.6105 18.8895 17.7002 19 17.7002H29.2002V7C29.2002 6.88954 29.1105 6.79981 29 6.7998H18.7998V17.5Z" fill="#8A8A8A"/>
-</svg>

packages/design-system/src/icons/depth_to_image.svg

@@ -1,12 +0,0 @@
-<svg width="49" height="24" viewBox="0 0 49 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M47.2461 5C47.9942 5.00009 48.6152 5.59922 48.6152 6.32031V16.8799C48.6152 17.601 47.9942 18.2001 47.2461 18.2002H31.9844C31.2363 18.2 30.6152 17.6009 30.6152 16.8799V6.32031C30.6152 5.59931 31.2363 5.00024 31.9844 5H47.2461ZM31.7891 14.918V16.8799C31.7891 16.9939 31.8661 17.0682 31.9844 17.0684H47.2461C47.3644 17.0682 47.4414 16.994 47.4414 16.8799V15.2656L44.085 12.6787L41.3154 14.5166C41.1091 14.6507 40.8115 14.6383 40.6182 14.4873L36.8516 11.5527L31.7891 14.918ZM31.9844 6.13184C31.8662 6.13202 31.7891 6.20628 31.7891 6.32031V13.5391L36.54 10.3799C36.6194 10.3255 36.7125 10.2913 36.8086 10.2803C36.9629 10.2641 37.1232 10.3091 37.2432 10.4033L41.0098 13.3447L43.7852 11.5059C43.9915 11.3718 44.2891 11.3841 44.4824 11.5352L47.4414 13.8154V6.32031C47.4414 6.20619 47.3645 6.13191 47.2461 6.13184H31.9844ZM40.9854 7.63965C41.9503 7.63986 42.7459 8.40684 42.7461 9.33691C42.7461 10.2671 41.9505 11.034 40.9854 11.0342C40.0201 11.0342 39.2236 10.2673 39.2236 9.33691C39.2238 8.40671 40.0202 7.63965 40.9854 7.63965ZM40.9854 8.77148C40.6545 8.77148 40.3986 9.01812 40.3984 9.33691C40.3984 9.65587 40.6544 9.90332 40.9854 9.90332C41.3161 9.90312 41.5723 9.65574 41.5723 9.33691C41.5721 9.01825 41.316 8.77168 40.9854 8.77148Z" fill="#8A8A8A"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M27.6398 11.7209C27.8739 11.9552 27.874 12.3353 27.6398 12.5695L25.0948 15.1154C24.8607 15.3496 24.4805 15.3492 24.2462 15.1154C24.0119 14.8811 24.0119 14.5011 24.2462 14.2668L25.7638 12.7492L18.2159 12.7492C17.8845 12.7492 17.6153 12.481 17.6153 12.1496C17.6153 11.8182 17.8846 11.55 18.2159 11.55L25.7726 11.55L24.2462 10.0236C24.0119 9.78931 24.0119 9.40931 24.2462 9.175C24.4805 8.94094 24.8606 8.94077 25.0948 9.175L27.6398 11.7209Z" fill="#8A8A8A"/>
-<rect x="0.5" y="4.5" width="14" height="14" rx="2.5" fill="#1C1C24" stroke="#8A8A8A"/>
-<circle cx="9.04375" cy="10.6062" r="3.98125" fill="url(#paint0_radial_1684_13636)"/>
-<defs>
-<radialGradient id="paint0_radial_1684_13636" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(9.53125 10.7687) rotate(-139.289) scale(4.6091)">
-<stop offset="0.00961538" stop-color="white"/>
-<stop offset="1" stop-color="#686868"/>
-</radialGradient>
-</defs>
-</svg>

packages/design-system/src/icons/depth_to_video.svg

@@ -1,12 +0,0 @@
-<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M28.0245 11.721C28.2587 11.9553 28.2588 12.3354 28.0245 12.5696L25.4796 15.1155C25.2454 15.3497 24.8653 15.3494 24.631 15.1155C24.3967 14.8812 24.3967 14.5012 24.631 14.2669L26.1485 12.7493L18.6007 12.7493C18.2693 12.7493 18.0001 12.4811 18.0001 12.1497C18.0001 11.8184 18.2693 11.5501 18.6007 11.5501L26.1573 11.5501L24.631 10.0238C24.3966 9.78943 24.3966 9.40944 24.631 9.17512C24.8653 8.94106 25.2454 8.94089 25.4796 9.17512L28.0245 11.721Z" fill="#8A8A8A"/>
-<rect x="0.5" y="4.61523" width="14" height="14" rx="2.5" fill="#1C1C24" stroke="#8A8A8A"/>
-<circle cx="9.04375" cy="10.7215" r="3.98125" fill="url(#paint0_radial_1694_13931)"/>
-<path d="M44.203 5C46.2974 5 48.01 6.71671 48.01 8.84956V14.3804C48.01 16.5133 46.2974 18.23 44.203 18.23H34.807C32.7125 18.23 31 16.5133 31 14.3804V8.84956C31 6.71671 32.7125 5 34.807 5H44.203ZM34.807 6.37812C33.4315 6.37812 32.3499 7.48086 32.3499 8.84956V14.3804C32.3499 15.7491 33.4315 16.8519 34.807 16.8519H44.203C45.5785 16.8519 46.6601 15.7491 46.6601 14.3804V8.84956C46.6601 7.48086 45.5785 6.37812 44.203 6.37812H34.807ZM37.5598 8.12949C37.6752 8.13322 37.7884 8.16994 37.8862 8.23544L42.193 11.0009C42.4194 11.1419 42.5025 11.403 42.5025 11.615C42.5025 11.8269 42.419 12.0878 42.1927 12.2288L37.8865 14.9946C37.6809 15.132 37.4135 15.1341 37.2063 15.002L37.2046 15.0009C37 14.8683 36.8785 14.6208 36.8848 14.3727V8.84956C36.88 8.49772 37.1469 8.14891 37.5089 8.13007L37.5598 8.12949ZM38.2041 13.1249L40.5626 11.6144L38.2041 10.0996V13.1249ZM42.1753 11.8255C42.1606 11.8574 42.1424 11.887 42.1205 11.913L42.1506 11.8717C42.1598 11.8571 42.168 11.8414 42.1753 11.8255Z" fill="#8A8A8A"/>
-<defs>
-<radialGradient id="paint0_radial_1694_13931" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(9.53125 10.884) rotate(-139.289) scale(4.6091)">
-<stop offset="0.00961538" stop-color="white"/>
-<stop offset="1" stop-color="#686868"/>
-</radialGradient>
-</defs>
-</svg>

packages/design-system/src/icons/edit_image.svg

@@ -1,3 +0,0 @@
-<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M32.2435 1.33301C33.4808 1.33312 34.4935 2.34575 34.4935 3.58301V11.2422C35.9784 11.809 36.5649 13.8317 35.3109 15.0859C28.4415 21.9551 28.9659 21.498 28.681 21.5654C25.4267 22.3753 25.6288 22.3379 25.5013 22.3379L25.4935 22.3301C25.0063 22.3298 24.647 21.8727 24.767 21.4004C25.5693 18.2061 25.5088 18.2582 25.7113 18.0557L30.7767 12.9893C30.2817 12.6244 29.582 12.1127 28.6029 11.4082L24.5423 14.8135C24.2463 15.0618 23.7681 15.0618 23.472 14.8135L17.1341 9.49805L13.4955 12.042V17.0811C13.4955 17.4933 13.8322 17.8308 14.2445 17.8311H23.2445C23.6568 17.8313 23.9945 18.1687 23.9945 18.5811C23.9943 18.9933 23.6567 19.3309 23.2445 19.3311H14.2445C13.0073 19.3308 11.9955 18.3182 11.9955 17.0811V3.58301C11.9955 2.34583 13.0073 1.33325 14.2445 1.33301H32.2435ZM26.9183 18.9629L26.5209 20.5459L28.1039 20.1484L32.2982 15.9521C32.0571 15.7222 31.6993 15.3563 31.1127 14.7676L26.9183 18.9629ZM34.4857 13.4219C34.4857 12.672 33.5781 12.3043 33.0531 12.8291L32.7962 13.085C32.7438 13.1746 32.6636 13.2544 32.5629 13.3184L32.1712 13.71L33.3558 14.8945L34.2377 14.0137C34.3951 13.8562 34.4856 13.6468 34.4857 13.4219ZM14.2445 2.83301C13.8322 2.83325 13.4955 3.1707 13.4955 3.58301V10.4395L16.6937 8.14844C16.9973 7.93835 17.4383 7.951 17.7191 8.18652L24.0111 13.4639L28.0267 10.0967C28.3076 9.86126 28.7554 9.84805 29.0589 10.0645L31.8558 11.9102L31.9955 11.7715C32.2782 11.4887 32.6198 11.2892 32.9935 11.1816V3.58301C32.9935 3.17062 32.6559 2.83312 32.2435 2.83301H14.2445ZM24.2494 4.33301C25.4866 4.33301 26.4991 5.3449 26.4994 6.58203C26.4994 7.81936 25.4868 8.83203 24.2494 8.83203C23.0122 8.8318 22.0004 7.81922 22.0004 6.58203C22.0006 5.34504 23.0123 4.33323 24.2494 4.33301ZM24.2494 5.83301C23.8372 5.83323 23.4996 6.16991 23.4994 6.58203C23.4994 6.99435 23.8371 7.3318 24.2494 7.33203C24.6618 7.33203 24.9994 6.99449 24.9994 6.58203C24.9991 6.16977 24.6617 5.83301 24.2494 5.83301Z" fill="#8A8A8A"/>
-</svg>

packages/design-system/src/icons/edit_video.svg

@@ -1,4 +0,0 @@
-<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M27.6289 0C30.5839 0.000217009 32.9999 2.46547 33 5.52832V11.666L31.0957 13.3594V5.52832C31.0956 3.56289 29.5694 1.9797 27.6289 1.97949H14.3711C12.4306 1.9797 10.9044 3.56289 10.9043 5.52832V13.4717C10.9044 15.4371 12.4306 17.0203 14.3711 17.0205H27V19H14.3711C11.4161 18.9998 9.00008 16.5345 9 13.4717V5.52832C9.00008 2.46547 11.4161 0.000217423 14.3711 0H27.6289ZM18.2559 4.49414C18.4185 4.49956 18.578 4.55256 18.7158 4.64648L24.793 8.61816C25.1122 8.82076 25.2295 9.19571 25.2295 9.5C25.2295 9.80434 25.1113 10.1792 24.792 10.3818L18.7168 14.3535C18.4268 14.5509 18.0492 14.5538 17.7568 14.3643L17.7539 14.3623C17.4655 14.1718 17.2938 13.8161 17.3027 13.46V5.52832C17.296 5.02308 17.6729 4.52218 18.1836 4.49512L18.2559 4.49414ZM19.1641 11.668L22.4922 9.49902L19.1641 7.32422V11.668Z" fill="#8A8A8A"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M39.784 8.33301C40.5601 8.37159 41.2873 8.69547 41.8368 9.24316L41.8407 9.24707C42.4245 9.83307 42.7546 10.6211 42.7547 11.4551C42.7547 11.8685 42.6746 12.2762 42.5155 12.6572C42.3585 13.0341 42.1305 13.3744 41.8446 13.6631L41.8397 13.667L41.1717 14.3369C41.0982 14.4106 41.0176 14.4759 40.9325 14.5332C40.8753 14.6183 40.8098 14.6989 40.7362 14.7725L33.4803 22.0264C33.2633 22.2432 32.9882 22.3939 32.6883 22.459L29.9276 23.0576C29.396 23.1727 28.8415 23.0106 28.4569 22.626C28.0723 22.2413 27.91 21.6869 28.0252 21.1553L28.6239 18.3945L28.6522 18.2832C28.7275 18.0268 28.8667 17.7924 29.0565 17.6025L36.3124 10.3477L36.4335 10.2383C36.4711 10.2075 36.51 10.1782 36.5497 10.1514C36.6059 10.0679 36.6713 9.98891 36.745 9.91504L37.4139 9.24609L37.4188 9.24023C38.0053 8.65788 38.7927 8.3291 39.6278 8.3291L39.784 8.33301ZM30.1874 18.7344L29.5887 21.4941L32.3485 20.8955L38.9071 14.3369L36.745 12.1758L30.1874 18.7344ZM39.6278 9.92871C39.2325 9.92871 38.8609 10.078 38.5751 10.3477L40.7333 12.5059C40.863 12.3681 40.9676 12.2125 41.0389 12.041C41.0962 11.9038 41.1326 11.758 41.1473 11.6074L41.1551 11.4551C41.155 11.0484 40.9947 10.6649 40.7069 10.376C40.418 10.0883 40.0349 9.92882 39.6278 9.92871Z" fill="#8A8A8A"/>
-</svg>

packages/design-system/src/icons/enhance.svg

@@ -1,3 +0,0 @@
-<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M27.6635 4.83333L30.6632 7.83286M16.9985 5.49937V9.49874M30.9971 13.4981V17.4975M21.998 1.5V3.49969M18.9983 7.49906H14.9987M32.9969 15.4978H28.9973M22.9979 2.49984H20.9981M33.6369 3.13979L32.3571 1.85999C32.2446 1.74632 32.1106 1.65609 31.963 1.59451C31.8154 1.53293 31.6571 1.50122 31.4971 1.50122C31.3372 1.50122 31.1789 1.53293 31.0313 1.59451C30.8837 1.65609 30.7497 1.74632 30.6372 1.85999L14.3588 18.1374C14.2451 18.2499 14.1549 18.3838 14.0933 18.5314C14.0317 18.679 14 18.8374 14 18.9973C14 19.1572 14.0317 19.3156 14.0933 19.4631C14.1549 19.6107 14.2451 19.7447 14.3588 19.8572L15.6387 21.137C15.7505 21.2518 15.8842 21.3432 16.0319 21.4055C16.1796 21.4679 16.3383 21.5 16.4986 21.5C16.6589 21.5 16.8176 21.4679 16.9653 21.4055C17.113 21.3432 17.2467 21.2518 17.3585 21.137L33.6369 4.85952C33.7518 4.74771 33.8432 4.61402 33.9055 4.46633C33.9679 4.31865 34 4.15996 34 3.99965C34 3.83934 33.9679 3.68066 33.9055 3.53297C33.8432 3.38528 33.7518 3.25159 33.6369 3.13979Z" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

packages/design-system/src/icons/enhance_3dmodel.svg

@@ -1,4 +0,0 @@
-<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M31.7844 13.8522L29.9803 15.6814M24.2027 8.42231V10.8612M26.6082 16.2013V18.6402M31.7844 8V9.21945M23 9.64176H25.4055M25.4055 17.4207H27.8109M31.183 8.60973H32.3857M27.1899 11.8036L27.9597 11.0231C28.0273 10.9538 28.1079 10.8988 28.1966 10.8612C28.2854 10.8237 28.3807 10.8043 28.4768 10.8043C28.573 10.8043 28.6683 10.8237 28.757 10.8612C28.8458 10.8988 28.9263 10.9538 28.994 11.0231L38.7842 20.9494C38.8526 21.018 38.9069 21.0997 38.9439 21.1897C38.9809 21.2797 39 21.3763 39 21.4738C39 21.5713 38.9809 21.6679 38.9439 21.7579C38.9069 21.8479 38.8526 21.9296 38.7842 21.9982L38.0145 22.7786C37.9472 22.8487 37.8668 22.9044 37.778 22.9424C37.6892 22.9804 37.5937 23 37.4973 23C37.4009 23 37.3054 22.9804 37.2166 22.9424C37.1278 22.9044 37.0474 22.8487 36.9801 22.7786L27.1899 12.8523C27.1208 12.7841 27.0659 12.7026 27.0284 12.6125C26.9909 12.5225 26.9716 12.4257 26.9716 12.3279C26.9716 12.2302 26.9909 12.1334 27.0284 12.0433C27.0659 11.9533 27.1208 11.8717 27.1899 11.8036Z" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
-<path d="M18.5908 0.00488281C18.644 0.010556 18.6968 0.0211124 18.748 0.0361328L18.8496 0.0732422L27.4863 3.82031C27.7975 3.956 27.9999 4.25977 27.999 4.59668V4.88281L25.2773 6.32324L19.3633 8.8916V17.8164L24 15.8018V15.959L19.2197 18.0361V18.0381L24 15.9609V17.6523L18.8496 19.8877C18.6546 19.9719 18.4361 19.982 18.2353 19.9189L18.1504 19.8877L9.51367 16.1396L9.40332 16.082C9.15808 15.9302 9.00203 15.6645 9 15.3721V4.59668C8.99911 4.25968 9.20241 3.95595 9.51367 3.82031L18.1494 0.0732422L18.2852 0.0263672C18.3319 0.0145036 18.3802 0.00679393 18.4287 0.00292969L18.5908 0.00488281ZM10.583 14.9121L17.7803 18.0381V18.0361L10.583 14.9102V14.9121ZM10.7266 14.8154L17.6357 17.8164V8.8916L10.7266 5.8916V14.8154ZM18.5 7.57617L11.6348 4.59668L11.6328 4.59863L18.5 7.57812L25.3672 4.59863L25.3643 4.59668L18.5 7.57617ZM11.9932 4.59668L18.5 7.41895L25.0059 4.59668L18.5 1.76758L11.9932 4.59668ZM18.4394 0.146484C18.359 0.152931 18.28 0.173119 18.207 0.205078L9.57129 3.95215C9.39972 4.0269 9.26947 4.16303 9.20019 4.32617C9.2698 4.16409 9.4004 4.02953 9.57129 3.95508L18.207 0.207031C18.28 0.175072 18.359 0.154884 18.4394 0.148438C18.5602 0.139301 18.6815 0.159598 18.792 0.207031L27.4287 3.95508C27.5993 4.02948 27.7311 4.16342 27.8008 4.3252C27.7314 4.16231 27.6 4.02684 27.4287 3.95215L18.792 0.205078C18.6815 0.157614 18.5602 0.137346 18.4394 0.146484Z" fill="#8A8A8A"/>
-</svg>

packages/design-system/src/icons/enhance_video.svg

@@ -1,4 +0,0 @@
-<svg width="48" height="24" viewBox="0 0 48 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M24.6289 0C27.5839 0.000217454 29.9999 2.46547 30 5.52832V12.7998L27.8828 14.7041C28.0196 14.3204 28.0957 13.9056 28.0957 13.4717V5.52832C28.0956 3.56289 26.5694 1.9797 24.6289 1.97949H11.3711C9.4306 1.9797 7.90438 3.56289 7.9043 5.52832V13.4717C7.90437 15.4371 9.4306 17.0203 11.3711 17.0205H24.6289C24.8981 17.0205 25.1589 16.9884 25.4092 16.9307L23.1113 19H11.3711C8.41613 18.9998 6.00008 16.5345 6 13.4717V5.52832C6.00008 2.46547 8.41613 0.000217456 11.3711 0H24.6289ZM15.2559 4.49414C15.4185 4.49956 15.578 4.55256 15.7158 4.64648L21.793 8.61816C22.1122 8.82076 22.2295 9.19571 22.2295 9.5C22.2295 9.80434 22.1113 10.1792 21.792 10.3818L15.7168 14.3535C15.4268 14.5509 15.0492 14.5538 14.7568 14.3643L14.7539 14.3623C14.4655 14.1718 14.2938 13.8161 14.3027 13.46V5.52832C14.296 5.02308 14.6729 4.52218 15.1836 4.49512L15.2559 4.49414ZM16.1641 11.668L19.4922 9.49902L16.1641 7.32422V11.668Z" fill="#8A8A8A"/>
-<path d="M32.6395 13.0655L34.6395 15.0655M38.5 4.66675V7.33341M35.9728 17.7322V20.3988M32.6395 6.66675V8.00008M39.8333 6.00008H37.1667M37.3062 19.0655H34.6395M33.3062 7.33341H31.9728M37.7329 10.8255L36.8795 9.97218C36.8045 9.89639 36.7152 9.83623 36.6168 9.79517C36.5184 9.75411 36.4128 9.73297 36.3062 9.73297C36.1996 9.73297 36.094 9.75411 35.9956 9.79517C35.8972 9.83623 35.8079 9.89639 35.7329 9.97218L24.8795 20.8255C24.8037 20.9005 24.7436 20.9898 24.7025 21.0882C24.6615 21.1866 24.6403 21.2922 24.6403 21.3988C24.6403 21.5055 24.6615 21.6111 24.7025 21.7095C24.7436 21.8079 24.8037 21.8972 24.8795 21.9722L25.7329 22.8255C25.8074 22.9021 25.8965 22.963 25.995 23.0046C26.0935 23.0462 26.1993 23.0676 26.3062 23.0676C26.4131 23.0676 26.5189 23.0462 26.6174 23.0046C26.7158 22.963 26.805 22.9021 26.8795 22.8255L37.7329 11.9722C37.8095 11.8976 37.8704 11.8085 37.9119 11.71C37.9535 11.6115 37.9749 11.5057 37.9749 11.3988C37.9749 11.292 37.9535 11.1862 37.9119 11.0877C37.8704 10.9892 37.8095 10.9001 37.7329 10.8255Z" stroke="#8A8A8A" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>

packages/design-system/src/icons/image-and-mask-preview.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.03125 18.6735L1.42188 18.8997C1.42457 18.907 1.4274 18.9142 1.43035 18.9213L2.03125 18.6735ZM2.03125 18.3255L1.43035 18.0777C1.4274 18.0849 1.42457 18.0921 1.42188 18.0993L2.03125 18.3255ZM11.9687 18.3255L12.5781 18.0993C12.5754 18.0921 12.5726 18.0849 12.5697 18.0777L11.9687 18.3255ZM11.9687 18.6735L12.5697 18.9213C12.5726 18.9142 12.5754 18.907 12.5781 18.8997L11.9687 18.6735ZM9.54038 7.54038C9.28654 7.79422 9.28654 8.20578 9.54038 8.45962C9.79422 8.71346 10.2058 8.71346 10.4596 8.45962L10 8L9.54038 7.54038ZM15.4596 3.45962C15.7135 3.20578 15.7135 2.79422 15.4596 2.54038C15.2058 2.28654 14.7942 2.28654 14.5404 2.54038L15 3L15.4596 3.45962ZM12.5404 10.5404L12.0808 11L13 11.9192L13.4596 11.4596L13 11L12.5404 10.5404ZM20.4596 4.45962C20.7135 4.20578 20.7135 3.79422 20.4596 3.54038C20.2058 3.28654 19.7942 3.28654 19.5404 3.54038L20 4L20.4596 4.45962ZM15.5404 13.5404C15.2865 13.7942 15.2865 14.2058 15.5404 14.4596C15.7942 14.7135 16.2058 14.7135 16.4596 14.4596L16 14L15.5404 13.5404ZM21.4596 9.45962C21.7135 9.20578 21.7135 8.79422 21.4596 8.54038C21.2058 8.28654 20.7942 8.28654 20.5404 8.54038L21 9L21.4596 9.45962ZM14.5 20.35C14.141 20.35 13.85 20.641 13.85 21C13.85 21.359 14.141 21.65 14.5 21.65V21V20.35ZM2.35 13C2.35 13.359 2.64101 13.65 3 13.65C3.35899 13.65 3.65 13.359 3.65 13H3H2.35ZM2.03125 18.6735L2.64062 18.4473C2.65313 18.481 2.65313 18.518 2.64062 18.5517L2.03125 18.3255L1.42188 18.0993C1.32604 18.3575 1.32604 18.6415 1.42188 18.8997L2.03125 18.6735ZM2.03125 18.3255L2.63215 18.5733C2.9889 17.7083 3.59447 16.9687 4.37207 16.4483L4.01054 15.9081L3.649 15.3679C2.65744 16.0316 1.88526 16.9747 1.43035 18.0777L2.03125 18.3255ZM4.01054 15.9081L4.37207 16.4483C5.14968 15.9278 6.0643 15.65 7 15.65V15V14.35C5.80685 14.35 4.64056 14.7043 3.649 15.3679L4.01054 15.9081ZM7 15V15.65C7.9357 15.65 8.85032 15.9278 9.62793 16.4483L9.98946 15.9081L10.351 15.3679C9.35944 14.7043 8.19315 14.35 7 14.35V15ZM9.98946 15.9081L9.62793 16.4483C10.4055 16.9687 11.0111 17.7083 11.3678 18.5733L11.9687 18.3255L12.5697 18.0777C12.1147 16.9747 11.3426 16.0316 10.351 15.3679L9.98946 15.9081ZM11.9687 18.3255L11.3594 18.5517C11.3469 18.518 11.3469 18.481 11.3594 18.4473L11.9687 18.6735L12.5781 18.8997C12.674 18.6415 12.674 18.3575 12.5781 18.0993L11.9687 18.3255ZM11.9687 18.6735L11.3678 18.4257C11.0111 19.2907 10.4055 20.0303 9.62793 20.5508L9.98946 21.0909L10.351 21.6311C11.3426 20.9675 12.1147 20.0244 12.5697 18.9213L11.9687 18.6735ZM9.98946 21.0909L9.62793 20.5508C8.85032 21.0712 7.9357 21.349 7 21.349V21.999V22.649C8.19315 22.649 9.35944 22.2948 10.351 21.6311L9.98946 21.0909ZM7 21.999V21.349C6.0643 21.349 5.14968 21.0712 4.37207 20.5508L4.01054 21.0909L3.649 21.6311C4.64056 22.2948 5.80685 22.649 7 22.649V21.999ZM4.01054 21.0909L4.37207 20.5508C3.59447 20.0303 2.9889 19.2907 2.63215 18.4257L2.03125 18.6735L1.43035 18.9213C1.88526 20.0244 2.65744 20.9675 3.649 21.6311L4.01054 21.0909ZM8.49992 18.4995H7.84992C7.84992 18.9689 7.46939 19.3494 6.99999 19.3494V19.9994V20.6494C8.18736 20.6494 9.14992 19.6868 9.14992 18.4995H8.49992ZM6.99999 19.9994V19.3494C6.53059 19.3494 6.15007 18.9689 6.15007 18.4995H5.50007H4.85007C4.85007 19.6868 5.81262 20.6494 6.99999 20.6494V19.9994ZM5.50007 18.4995H6.15007C6.15007 18.0301 6.53059 17.6495 6.99999 17.6495V16.9995V16.3495C5.81262 16.3495 4.85007 17.3121 4.85007 18.4995H5.50007ZM6.99999 16.9995V17.6495C7.46939 17.6495 7.84992 18.0301 7.84992 18.4995H8.49992H9.14992C9.14992 17.3121 8.18736 16.3495 6.99999 16.3495V16.9995ZM10 8L10.4596 8.45962L15.4596 3.45962L15 3L14.5404 2.54038L9.54038 7.54038L10 8ZM13 11L13.4596 11.4596L20.4596 4.45962L20 4L19.5404 3.54038L12.5404 10.5404L13 11ZM16 14L16.4596 14.4596L21.4596 9.45962L21 9L20.5404 8.54038L15.5404 13.5404L16 14ZM5 3V3.65H19V3V2.35H5V3ZM19 3V3.65C19.7456 3.65 20.35 4.25442 20.35 5H21H21.65C21.65 3.53645 20.4636 2.35 19 2.35V3ZM21 5H20.35V19H21H21.65V5H21ZM21 19H20.35C20.35 19.7456 19.7456 20.35 19 20.35V21V21.65C20.4636 21.65 21.65 20.4636 21.65 19H21ZM3 5H3.65C3.65 4.25442 4.25442 3.65 5 3.65V3V2.35C3.53645 2.35 2.35 3.53645 2.35 5H3ZM19 21V20.35H14.5V21V21.65H19V21ZM3 13H3.65V5H3H2.35V13H3ZM5 3L4.54038 3.45962L20.5404 19.4596L21 19L21.4596 18.5404L5.45962 2.54038L5 3Z" fill="#8A8A8A"/>
+</svg>