improvement(workflow): add compact code hover previews

[icecrasher321]

Summary

• add compact syntax-highlighted code previews for code fields on workflow canvases
• keep previews interactive and scrollable while reusing the platform tooltip appearance
• add shared compact Code.Viewer density and focused hover behavior tests

Type of Change

• Improvement

Testing

• bun run lint
• bun run lint:check
• bun run check:audits (33 audits)
• 115 workflow-renderer tests
• 6 tooltip tests
• 4 code-preview resolver tests
• @sim/emcn and @sim/workflow-renderer type-checks
• tested manually in the workflow canvas

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
docs	Ready	Preview	Aug 25, 2026 8:01pm

[greptile-apps]

Greptile Summary

The PR adds compact, syntax-highlighted previews for clipped workflow code values and extends the shared code viewer and popover styling to support them.

• Resolves preview language metadata for code fields in editor and read-only workflow canvases.
• Adds accessible keyboard, pointer, touch, and pen interactions for opening and navigating previews.
• Introduces compact Code.Viewer density and shared tooltip-style popover appearance.
• Adds focused resolver, rendering, accessibility, and interaction tests.

Confidence Score: 5/5

The PR appears safe to merge.

No blocking failure remains; the previously reported keyboard and touch accessibility gap is addressed by focusable dialog semantics, explicit activation controls, focus retention, and regression coverage.

Important Files Changed

Filename	Overview
packages/workflow-renderer/src/lib/code-hover-card.tsx	Implements the interactive preview with clipped-content gating, keyboard and touch activation, focus retention, delayed pointer transitions, and Escape handling.
packages/workflow-renderer/src/lib/overflow-span.tsx	Routes code values to the new rich hover card while preserving the existing tooltip path for ordinary clipped text.
packages/emcn/src/components/code/code.tsx	Adds compact read-only viewer density while keeping virtualized and non-virtualized line sizing aligned.
apps/sim/lib/workflows/blocks/code-preview.ts	Produces previews only for non-password, non-empty string code fields and normalizes supported syntax languages.
packages/workflow-renderer/src/lib/overflow-span-mount.test.tsx	Covers delayed pointer opening, pointer transfer into the preview, keyboard focus and Escape behavior, and touch toggling.

_{Reviews (2): Last reviewed commit: "fix(workflow): address code preview revi..." | Re-trigger Greptile}

[cubic-dev-ai]

All reported issues were addressed across 14 files

<sub>Reply with feedback, questions, or to request a fix.

Re-trigger cubic</sub>

[icecrasher321]

@greptile