Case study
BaoCut Design: porting reconstructed canvas and design-system editors
Documents BaoCut’s design-canvas and design-system editors, which the project says it ported 1:1 from TypeScript reconstructions of Claude Design’s editors and hosts in agent sessions with annotation and export. Its runtime notes record identifier fixes checked against the original scripts and a structural comparison matching 19,111 of 20,463 canvas main-page functions. Unreviewed differences, the unpublished reconstruction record and reuse rights remain open; no hosted-backend recovery is claimed.
Requirements and limitations
- This entry covers the design-canvas and design-system editors added in the pinned commit, not the whole BaoCut product or its separately curated Slides editor. The runtime READMEs say both are ported 1:1 from separate TypeScript reconstructions of the original editor types (src/design-type, src/design-system-type), keeping file formats, UI, behavior and module structure, with BaoCut hosting changes marked by BaoCut: comments. Those reconstruction projects, their notes and evidence are not in this repository, and the sources name no exact original release.
- Hosting changes replace the original globalThis.claude host interface with BaoCut shims, empty the parent-origin allowlist, disable analytics, and drop rooms, sampling and hosted design-system installs. The port omits Anthropic Sans in favor of system fonts but still inlines the original Anthropicons icon font, whose distribution license the READMEs call unconfirmed and slated for replacement. Use independently authorized design content and assets.
- Building the editors needs Node.js >=22.12.0, npm workspace dependencies and the apps/design-editor and apps/design-system-editor builds. The canvas runtime keeps React 18.3.1 for artboards beside the workspace’s React 19, with Babel standalone 7.29.0, happy-dom, jQuery and dom-to-svg; full BaoCut source builds also need Rust, CMake and platform build tools. Agent-made designs use BaoCut’s built-in design and design-system skills through a configured local agent CLI such as Codex, under its own account and service terms.
- The design-runtime README reports identifier fixes checked against the original scripts, then Babel-based structural fingerprints matching 19,111 of the original canvas main page’s 20,463 functions exactly; remaining binding-only differences fall in dependencies, while 1,019 structurally different innermost functions and renamed property-scrubber internals remain unreviewed residual risk. Published tests cover canvas checks, file routes and grants, downloads and annotation targets, and acceptance cases UI-11–UI-13 describe manual Web/desktop flows. None is a behavioral oracle against the original service; this collection did not run them.
- The root BaoCut Community License 1.0 is source-available: personal, internal and content-creation uses are permitted, while commercializing BaoCut or its code needs a separate license. Third-party notices cover bundled npm packages but do not establish reuse rights in the reconstructed Claude Design code or the icon font. The author’s post does not name REA for this port, and a later third-party post’s REA claim is not confirmed by the author or the repository. This review read pinned sources without running the editors, agents or tests.
About this entry
- Type
- Case study
- Category
- Independent reconstruction cases
- Relationship
- Independent reconstruction project
- Targets
- App · Website
Sources reviewed
The description was reviewed against primary sources. This does not establish runtime testing, security auditing or verified compatibility.
Primary sources
- packages/design-runtime/README.md GitHub · JimLiu/baocut · Revision 7aa049e
- packages/design-system-runtime/README.md GitHub · JimLiu/baocut · Revision 7aa049e
- docs/design/canvas/README.md GitHub · JimLiu/baocut · Revision 7aa049e
- docs/acceptance/acceptance-spec.md GitHub · JimLiu/baocut · Revision 7aa049e
- skills/baocut/built-in-skills/design/SKILL.md GitHub · JimLiu/baocut · Revision 7aa049e
- package.json GitHub · JimLiu/baocut · Revision 7aa049e
- packages/design-runtime/package.json GitHub · JimLiu/baocut · Revision 7aa049e
- apps/design-editor/package.json GitHub · JimLiu/baocut · Revision 7aa049e
- packages/design/src/canvas-check.test.ts GitHub · JimLiu/baocut · Revision 7aa049e
- packages/design/src/canvas-routes.test.ts GitHub · JimLiu/baocut · Revision 7aa049e
- packages/design/src/editor/downloads-bridge.test.ts GitHub · JimLiu/baocut · Revision 7aa049e
- packages/design-system/src/routes.test.ts GitHub · JimLiu/baocut · Revision 7aa049e
- packages/design-system/src/editor/comment-targets.test.ts GitHub · JimLiu/baocut · Revision 7aa049e
- LICENSE GitHub · JimLiu/baocut · Revision 7aa049e
- THIRD_PARTY_NOTICES.md GitHub · JimLiu/baocut · Revision 7aa049e
- https://github.com/JimLiu/baocut/commit/7aa049e82e1367da013b7aba80f0b79033fa04ad