Add GitHub code permalink embeds

[JiatangDong]

Summary:

• add a GitHub Code auto-embed option for blob, blame, raw, and gist URLs
• render fetched snippets with Lexical CodeNode highlighting, file header, line numbers, refresh, and expand/collapse controls
• register the playground GitHub code node/extension and add focused unit coverage

Verification:

• pnpm exec eslint packages/lexical-playground/src/nodes/GitHubCodeNode.tsx packages/lexical-playground/src/plugins/AutoEmbedPlugin/index.tsx packages/lexical-playground/src/plugins/GitHubCodeExtension/index.ts packages/lexical-playground/src/plugins/AutoEmbedPlugin/tests/unit/GitHubCodeEmbedConfig.test.ts
• pnpm run tsc
• pnpm exec vitest run packages/lexical-playground/src/plugins/AutoEmbedPlugin/tests/unit/GitHubCodeEmbedConfig.test.ts packages/lexical-playground/src/nodes/tests/unit/GitHubCodeNode.test.ts --project unit
• Chromium browser e2e smoke test with mocked GitHub raw responses for paste menu, embed rendering, and expand/collapse

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
lexical	Ready	Preview, Comment	Jun 12, 2026 12:12am
lexical-playground	Ready	Preview, Comment	Jun 12, 2026 12:12am

[potatowagon]

Reviewed by Navi (Tater Thoughts Bobblehead) on behalf of @potatowagon.

Assessment: LGTM ✅ — Playground-only feature (GitHub code permalink embeds). No core library changes, no www impact.

What I checked:

1. Node implementation (GitHubCodeNode.tsx, 502 lines): Well-structured DecoratorBlockNode subclass. Proper importJSON/exportJSON round-trip with updateFromJSON. exportDOM uses data attributes. getTextContent() returns the URL (good for copy-paste). Uses LexicalNestedComposer with createEditor for syntax highlighting via @lexical/code-prism — readonly nested editor, non-editable. Clean React component with AbortController cleanup, progressive line reveal (show more/collapse), refresh button. All state management is local.

2. URL parsing (AutoEmbedPlugin/index.tsx): Supports blob, blame, gist, and raw.githubusercontent.com patterns. Language detection from file extension via LANGUAGE_BY_EXTENSION map. Regex patterns are well-scoped and tested. The isGitHubCodeMatchResult type guard is clean.

3. Extension registration (GitHubCodeExtension/index.ts): Uses defineExtension + $insertNodeToNearestRoot + COMMAND_PRIORITY_EDITOR. Standard pattern consistent with FigmaExtension, TwitterExtension, etc.

4. Test coverage: 272-line unit test (creation, type checking, serialization round-trip, DOM export, cloning) + 185-line URL parsing test (blob, blame, gist, raw, invalid URLs). Comprehensive edge case coverage.

5. CSS (155 lines): GitHub-style embed UI. No global selector leaks — all scoped under .github-code-*. Responsive grid layout for line numbers + code.

6. www compat: No impact — purely additive playground feature with no core library API changes, no removed/renamed exports.

Minor observations (non-blocking):

• The fetchCode function makes unauthenticated GitHub API requests, which are rate-limited to 60/hour. This is fine for a playground demo but worth noting in docs if it ever becomes a core feature.
• The gist regex uses [a-f0-9]+ which is correct for gist IDs.
• Missing a DOMImportConversion (no importDOM static) — pasting an exported GitHub embed div won't reconstitute the node. Acceptable for a playground-only feature.

CI: CLA ✅, Vercel deploys ✅. Full test matrix not yet triggered (likely awaiting PR age/label). No blocking failures.

Ready to approve.

[etrepum]

I haven't done a close review of the react code yet but the line numbers aren't set up properly, they overflow and scroll separately from the content

This PR's title and description also doesn't follow the pull request template

[etrepum]

Suggested change

	export type GitHubCodePayload = {
	url: string;
	owner: string;
	repo: string;
	path: string;
	branch: string;
	startLine?: number;
	endLine?: number;
	language?: string;
	};
	export interface GitHubCodePayload {
	url: string;
	owner: string;
	repo: string;
	path: string;
	branch: string;
	startLine?: number;
	endLine?: number;
	language?: string;
	}

[etrepum]

Using $config and NodeState will make a lot of this boilerplate go away

[etrepum]

This is a legacy file that you don't need to update, the extension takes care of configuring the node

[etrepum]

@JiatangDong Why do you keep opening and closing PRs here? It's a waste of maintainer time if you don't intend for them to be reviewed and merged. This is the fourth time.