feat(embed): add `@meowdown/embed` package by ocavue · Pull Request #590 · prosekit/meowdown

ocavue · 2026-09-18T18:31:31Z

Moves the X post and YouTube video card elements into this repo as @meowdown/embed, so a card change and its editor change land in one PR. The elements are now <meowdown-embed-x> and <meowdown-embed-youtube>, themed by --meowdown-embed-* variables; core and react render through the new package, and the playground gets one embed story file with an X and a YouTube gallery.

Summary by CodeRabbit

New Features
- Added reusable embed components for displaying X posts and YouTube videos.
- Supports media, quoted posts, replies, edits, truncated content, loading states, and unavailable-content fallbacks.
- YouTube embeds support watch-link and optional inline playback modes.
- Added URL validation to prevent unsafe links and media destinations.
- Added an interactive embed gallery showcasing common X and YouTube scenarios.
Documentation
- Added installation and usage documentation for the new embed components.
Chores
- Updated Markdown and React integrations to use the new embed components.

vercel · 2026-09-18T18:31:33Z

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

1 Skipped Deployment

Project	Deployment	Actions	Updated
meowdown	Ignored		Sep 18, 2026 6:31pm UTC

coderabbitai · 2026-09-18T18:31:38Z

Note

Currently processing new changes in this PR. This may take a few minutes, please wait...

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Advanced

Run ID: dc5562d8-637f-40cb-89eb-b6f0008af711

📥 Commits

Reviewing files that changed from the base of the PR and between 3d36899 and 03b6a75.

⛔ Files ignored due to path filters (23)

packages/embed/src/x/testing/image.svg is excluded by !**/*.svg
packages/embed/src/youtube/testing/poster.svg is excluded by !**/*.svg
pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
website/public/embed/media/motion.mp4 is excluded by !**/*.mp4
website/public/embed/media/photo-1.svg is excluded by !**/*.svg
website/public/embed/media/photo-2.svg is excluded by !**/*.svg
website/public/embed/media/photo-3.svg is excluded by !**/*.svg
website/public/embed/media/photo-4.svg is excluded by !**/*.svg
website/public/embed/media/poster.svg is excluded by !**/*.svg
website/public/embed/samples/avatar-a.svg is excluded by !**/*.svg
website/public/embed/samples/avatar-b.svg is excluded by !**/*.svg
website/public/embed/samples/avatar-c.svg is excluded by !**/*.svg
website/public/embed/samples/avatar-d.svg is excluded by !**/*.svg
website/public/embed/samples/chart.svg is excluded by !**/*.svg
website/public/embed/samples/landscape-1.svg is excluded by !**/*.svg
website/public/embed/samples/landscape-2.svg is excluded by !**/*.svg
website/public/embed/samples/landscape-3.svg is excluded by !**/*.svg
website/public/embed/samples/landscape-4.svg is excluded by !**/*.svg
website/public/embed/samples/phone.svg is excluded by !**/*.svg
website/public/embed/samples/portrait-1.svg is excluded by !**/*.svg
website/public/embed/samples/portrait-video.svg is excluded by !**/*.svg
website/public/embed/samples/square-1.svg is excluded by !**/*.svg
website/public/embed/samples/strip.svg is excluded by !**/*.svg

📒 Files selected for processing (55)

.changeset/meowdown-embed.md
package.json
packages/core/package.json
packages/core/src/extensions/image.ts
packages/core/src/extensions/post-embed-view.test.tsx
packages/core/src/extensions/post-embed.ts
packages/core/src/style.css
packages/core/tsconfig.json
packages/embed/README.md
packages/embed/package.json
packages/embed/src/fetch.ts
packages/embed/src/render-link.ts
packages/embed/src/root.ts
packages/embed/src/safe-url.test.ts
packages/embed/src/safe-url.ts
packages/embed/src/x/features.test.tsx
packages/embed/src/x/index.ts
packages/embed/src/x/register.ts
packages/embed/src/x/render-author.ts
packages/embed/src/x/render-media.ts
packages/embed/src/x/render-post.ts
packages/embed/src/x/render-shared.ts
packages/embed/src/x/testing/fixtures.ts
packages/embed/src/x/theme.css
packages/embed/src/x/x-post.test.tsx
packages/embed/src/x/x-post.ts
packages/embed/src/youtube/index.ts
packages/embed/src/youtube/parse-url.test.ts
packages/embed/src/youtube/parse-url.ts
packages/embed/src/youtube/register.ts
packages/embed/src/youtube/render-video.ts
packages/embed/src/youtube/testing/fixtures.ts
packages/embed/src/youtube/theme.css
packages/embed/src/youtube/youtube-video.test.tsx
packages/embed/src/youtube/youtube-video.ts
packages/embed/tsconfig.json
packages/embed/tsdown.config.ts
packages/embed/vitest.browser.config.ts
packages/embed/vitest.node.config.ts
packages/react/package.json
packages/react/src/components/editor.test.tsx
packages/react/src/components/editor.tsx
packages/react/src/components/markdown-view.test.tsx
packages/react/src/components/markdown-view.tsx
packages/react/tsconfig.json
pnpm-workspace.yaml
tsconfig.json
website/package.json
website/src/stories/embed-gallery.tsx
website/src/stories/embed-samples/media-snapshots.ts
website/src/stories/embed-samples/snapshots.ts
website/src/stories/embed-samples/x-samples.ts
website/src/stories/embed-samples/youtube-snapshots.ts
website/src/stories/embed.stories.ts
website/tsconfig.json

 ______________________________________________________________________________________________________________________________________
< DRY - Don't Repeat Yourself. Every piece of knowledge must have a single, unambiguous, authoritative representation within a system. >
 --------------------------------------------------------------------------------------------------------------------------------------
  \
   \   (\__/)
       (•ㅅ•)
       / 　 づ

✨ Finishing Touches

📝 Generate docstrings

Commit to this branch
Create a new PR

🧪 Generate unit tests (beta)

Commit to this branch
Create a new PR

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands.}

github-actions · 2026-09-18T18:32:27Z

Preview: https://pr-590-meowdown.ocavue.workers.dev

pkg-pr-new · 2026-09-18T18:33:19Z

Open in StackBlitz

npm i https://pkg.pr.new/prosekit/meowdown/@meowdown/core@590

npm i https://pkg.pr.new/prosekit/meowdown/@meowdown/embed@590

npm i https://pkg.pr.new/prosekit/meowdown/@meowdown/markdown@590

npm i https://pkg.pr.new/prosekit/meowdown/@meowdown/react@590

commit: 03b6a75

github-actions · 2026-09-18T18:35:05Z

Coverage Report

Status	Category	Percentage	Covered / Total
🔵	Lines	94.45%	5466 / 5787
🔵	Statements	92.19%	6162 / 6684
🔵	Functions	92.19%	1311 / 1422
🔵	Branches	88.44%	4101 / 4637

File Coverage

File	Stmts	Branches	Functions	Lines	Uncovered Lines
Changed Files
packages/core/src/style.css	0%	0%	0%	0%
packages/core/src/extensions/image.ts	94.08%	85.05%	89.65%	100%	136, 139, 154, 160, 181, 203, 205, 210, 378, 418, 432
packages/core/src/extensions/post-embed.ts	86.66%	80%	85.71%	92.3%	27-28, 42, 55
packages/embed/src/fetch.ts	90.62%	93.75%	100%	93.1%	67, 76-77
packages/embed/src/render-link.ts	100%	100%	100%	100%
packages/embed/src/root.ts	100%	100%	100%	100%
packages/embed/src/safe-url.ts	100%	100%	100%	100%
packages/embed/src/x/index.ts	0%	0%	0%	0%
packages/embed/src/x/register.ts	100%	100%	100%	100%
packages/embed/src/x/render-author.ts	100%	81.25%	100%	100%
packages/embed/src/x/render-media.ts	97.87%	81.81%	100%	100%	24
packages/embed/src/x/render-post.ts	100%	100%	100%	100%
packages/embed/src/x/render-shared.ts	100%	100%	100%	100%
packages/embed/src/x/theme.css	0%	0%	0%	0%
packages/embed/src/x/x-post.ts	100%	100%	100%	100%
packages/embed/src/x/testing/fixtures.ts	100%	100%	100%	100%
packages/embed/src/x/testing/image.svg	0%	0%	0%	0%
packages/embed/src/youtube/index.ts	0%	0%	0%	0%
packages/embed/src/youtube/parse-url.ts	100%	91.66%	100%	100%
packages/embed/src/youtube/register.ts	100%	100%	100%	100%
packages/embed/src/youtube/render-video.ts	100%	71.42%	100%	100%
packages/embed/src/youtube/theme.css	0%	0%	0%	0%
packages/embed/src/youtube/youtube-video.ts	100%	100%	100%	100%
packages/embed/src/youtube/testing/fixtures.ts	100%	100%	100%	100%
packages/embed/src/youtube/testing/poster.svg	0%	0%	0%	0%
packages/react/src/components/editor.tsx	76.92%	73.91%	72.72%	76.92%	442, 478-490
packages/react/src/components/markdown-view.tsx	96.05%	90.3%	97.72%	99.02%	248, 252, 393, 396-401, 468, 471, 542, 693, 742

Generated in workflow #2359 for commit 03b6a75 by the Vitest Coverage Report Action

ocavue added 3 commits September 19, 2026 04:26

feat(embed): add @meowdown/embed package

3a323d1

refactor: render embeds with @meowdown/embed

e14086e

docs(website): add embed stories

03b6a75

ocavue marked this pull request as ready for review September 18, 2026 18:38

github-actions Bot approved these changes Sep 18, 2026

View reviewed changes

ocavue merged commit 42a1c14 into master Sep 18, 2026
13 of 14 checks passed

ocavue deleted the embed-package branch September 18, 2026 18:44

ocavuebot mentioned this pull request Sep 18, 2026

chore: version packages #589

Open

Navigation Menu

Uh oh!

feat(embed): add `@meowdown/embed` package - #590

feat(embed): add `@meowdown/embed` package#590
ocavue merged 3 commits into
masterfrom
embed-package

ocavue commented Sep 18, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

vercel Bot commented Sep 18, 2026 •

edited

Loading

Uh oh!

coderabbitai Bot commented Sep 18, 2026 •

edited

Loading

Uh oh!

github-actions Bot commented Sep 18, 2026

Uh oh!

pkg-pr-new Bot commented Sep 18, 2026

Uh oh!

github-actions Bot commented Sep 18, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Uh oh!

Conversation

ocavue commented Sep 18, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

vercel Bot commented Sep 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot commented Sep 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Sep 18, 2026

Uh oh!

pkg-pr-new Bot commented Sep 18, 2026

Uh oh!

github-actions Bot commented Sep 18, 2026

Coverage Report

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

ocavue commented Sep 18, 2026 •

edited by coderabbitai Bot

Loading

vercel Bot commented Sep 18, 2026 •

edited

Loading

coderabbitai Bot commented Sep 18, 2026 •

edited

Loading