[dreamwasp]

Overview

Breaking change: Video and VideoProps are no longer on the root export, and <Markdown> no longer renders <iframe> and <video> through Video by default. This PR has the codemod for both, plus the Gamut-side Video and Markdown fixes.

Stack (split from #28, merge in order):

1. feat(gamut-codemods): add the codemods CLI and an empty scope-swap preset #38 Scaffold, based on main
2. feat(gamut-codemods): rename packages and replace gamut-kit in scope-swap #39 Package scope rename and gamut-kit removal, based on feat(gamut-codemods): add the codemods CLI and an empty scope-swap preset #38
3. feat(gamut-codemods): move Video imports and add Markdown video overrides #40 Video and Markdown, based on feat(gamut-codemods): rename packages and replace gamut-kit in scope-swap #39 👈 this PR
4. feat(gamut)!: promote deep imports to the root, renaming Menu and SelectDropdown elements #41 Deep imports and Menu/SelectDropdown renames, based on feat(gamut-codemods): rename packages and replace gamut-kit in scope-swap #39
5. feat(gamut-codemods): rename the ESLint plugin prefix in scope-swap #42 ESLint plugin prefix, based on feat(gamut-codemods): rename packages and replace gamut-kit in scope-swap #39
6. feat(gamut-codemods): warn about esmExternals: false in next.config #43 Next.js esmExternals warning, based on feat(gamut-codemods): rename packages and replace gamut-kit in scope-swap #39
7. build(deps): make @skillsoft packages easier to install #44 Simpler dependencies (independent), based on main
8. feat(gamut-agent-tools): add the gamut-scope-swap skill #45 gamut-scope-swap skill (open last), based on feat(gamut-codemods): rename packages and replace gamut-kit in scope-swap #39, includes feat(gamut-codemods): move Video imports and add Markdown video overrides #40–feat(gamut-codemods): warn about esmExternals: false in next.config #43

Codemod

• moved-exports moves Video/VideoProps imports to @skillsoft/gamut/Video. It splits mixed imports and merges into an existing /Video import. Namespace imports, export *, and mocks that stub Video get a warning instead.
• markdown-video-overrides adds iframeOverride / videoOverride, with Iframe and MarkdownVideo imported from /Video, to each <Markdown> that didn't opt out, so output stays the same.
  • It replaces the removed skipDefaultOverrides.iframe / .video keys, writing iframeOverride={undefined} where a skip was true.
  • It skips itself when every @codecademy/gamut range in the repo is already 74.0.0 or newer.
• tsconfig-dom (report only) warns about tsconfigs whose lib has no "dom". Video used to supply the DOM types through the root import.
• Checklist: the run ends with the @vidstack/react and react-player peers to install.

@skillsoft/gamut

• Video stub: a Video/package.json stub makes @skillsoft/gamut/Video resolve under moduleResolution: "node". The attw no-resolution ignore that was hiding this is removed.
• MarkdownVideo: no longer passes NaN width or height when the <video> has none.
• One-line <video>: <video>...</video> on one line is no longer wrapped in a <p>.
• Docs: Video's requirements (a bundler that handles CSS imports, and the /Video import path).

PR Checklist

• Related to designs: N/A
• Related to JIRA ticket: GMT-1790
• Changeset added
• I have run this code to verify it works
• This PR includes unit tests for the code change
• This PR includes testing instructions for the code change
• Package previews from this PR are passing end-to-end tests in all relevant consuming repositories

Testing Instructions

1. yarn nx test gamut-codemods. Expect 83 tests to pass.

2. yarn nx test gamut. That includes the two new Markdown tests.

3. yarn nx run gamut:verify-package. attw now runs without the no-resolution ignore.

4. Build and run on a throwaway repo:

   yarn nx build gamut-codemods
   mkdir -p /tmp/swap && cd /tmp/swap && git init -q
   printf "import { Box, Markdown, Video } from '@codecademy/gamut';\nexport const P = () => <Box><Markdown text=\"x\" /><Video videoUrl=\"y\" /></Box>;\n" > a.tsx
   echo '{ "compilerOptions": { "lib": ["es2020"] } }' > tsconfig.json
   git add -A && git commit -qm init
   node <repo>/packages/gamut-codemods/dist/bin.js scope-swap .

   a.tsx should import Video, Iframe, and MarkdownVideo from @skillsoft/gamut/Video, and <Markdown> should have both overrides. The next steps should list the Video peers and the tsconfig dom item.

5. Storybook: the Markdown stories with video still render, and a one-line <video> isn't inside a <p>.

Stacked PRs don't publish pkg.pr.new previews, because preview.yml only runs for PRs into main.

PR Links and Envs

Repository	PR Link
Mono	N/A

🤖 Generated with Claude Code

[LinKCoding]

Looking good!

I also ran scope-swap on this and got these in next steps:
— next steps —

1. Video needs two peer dependencies that Gamut no longer installs for you: @vidstack/react and react-player. Gamut supports @vidstack/react 1.12.x only (its npm latest tag is 0.6.x). Install them: yarn add @vidstack/react@~1.12.12 react-player@^3.4.0.
2. Some tsconfig files set "lib" without "dom" (see the tsconfig-dom warnings). Video no longer loads with the root import, and it was supplying the DOM types. Add "dom" to those files if type-checking fails on document, HTMLElement, ResizeObserver, and so on.
3. Run your formatter and lint autofix (prettier --write, then eslint --fix). Split imports come out in recast style, @skillsoft sorts differently from @codecademy for import-order rules like simple-import-sort, and the shorter scope lets some wrapped imports fit on one line.
4. Reinstall (yarn), then type-check and run your tests.
5. Work through the warnings above and the leftovers list.

---

^ steps 1 + 2 is 👍

The video + markdown pages in SB loads and works - I didn't see any <video> elements in <p> elements

[pkg-pr-new]

Open in StackBlitz

@skillsoft/eslint-plugin-gamut

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/eslint-plugin-gamut@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/eslint-plugin-gamut@40.tgz

@skillsoft/gamut

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut@40.tgz

@skillsoft/gamut-agent-tools

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-agent-tools@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-agent-tools@40.tgz

@skillsoft/gamut-codemods

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-codemods@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-codemods@40.tgz

@skillsoft/gamut-icons

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-icons@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-icons@40.tgz

@skillsoft/gamut-illustrations

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-illustrations@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-illustrations@40.tgz

@skillsoft/gamut-patterns

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-patterns@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-patterns@40.tgz

@skillsoft/gamut-styles

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-styles@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-styles@40.tgz

@skillsoft/gamut-tests

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-tests@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/gamut-tests@40.tgz

@skillsoft/variance

npm i https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/variance@40

yarn add https://pkg.pr.new/Codecademy/skillsoft-gamut/@skillsoft/variance@40.tgz

commit: 1d479cc

[codecov]

Codecov Report

❌ Patch coverage is 98.91697% with 3 lines in your changes missing coverage. Please review.
✅ Project coverage is 90.22%. Comparing base (5de7194) to head (1d479cc).
⚠️ Report is 2 commits behind head on main.
✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
...mut-codemods/src/migrations/moved-exports/index.ts	98.09%	2 Missing ⚠️
packages/gamut-codemods/src/lib/package-ranges.ts	95.83%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main      #40      +/-   ##
==========================================
+ Coverage   89.54%   90.22%   +0.68%     
==========================================
  Files         426      296     -130     
  Lines        7497     6732     -765     
  Branches     2406     2250     -156     
==========================================
- Hits         6713     6074     -639     
+ Misses        774      648     -126     
  Partials       10       10              

Flag	Coverage Δ
main	?
pull-request	90.22% <98.91%> (?)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.