SemianiakaVY/openpencil
1
0
Fork 0
Code Issues Pull requests Actions 1 Packages Projects Releases Wiki Activity
openpencil/packages/dom-css/AGENTS.md
Danila Poyarkov 00361313d1
refactor(dom-css): group sources into import, export, and runtime (#789) 
* refactor(dom-css): group sources into import, export, and runtime

dom-css kept both conversion directions in one flat folder: HTML and CSS
import next to SceneGraph export, a JSX runtime next to the Tailwind JSX
printer, and CSS parsing and formatting in one file.

Sources now live in `import/`, `export/`, and `runtime/`, with the CSS
value helpers split by direction and `export/index.ts` as the `./export`
entry. Tests mirror the new folders. Public entry points are unchanged.

* docs(dom-css): add a package guide for the import, export, and runtime layout

dom-css had no AGENTS.md. The guide records the source layout, the
scene-graph-only dependency, the browser-safe `./export` entry, printed
code generation, and Base64 validation for imported documents, and the
root map links to it.
2026-09-30 09:44:52 +04:00

1.1 KiB
Raw Blame History

DOM/CSS

DOM, CSS, HTML, JSX, and Tailwind projection between documents and SceneGraph, with browser and headless CSS runtimes. Sources are grouped by direction:

  • src/import/ — HTML, CSS, JSX, and Tailwind to SceneGraph, including the jsx-runtime entries and CSS value parsing.
  • src/export/ — SceneGraph to HTML, Tailwind JSX, and Storybook: projection, CSS formatting, the HTML bundle, and printers. src/export/index.ts is the ./export entry.
  • src/runtime/ — browser and headless CSS runtimes.

Rules:

  • Depend only on @open-pencil/scene-graph. Engine services such as web-font resolution come in as options; Core registers the HTML and Tailwind JSX formats (packages/core/AGENTS.md).
  • Keep the ./export entry browser-safe: load node:* modules and the headless CSS object model lazily inside the functions that need them, so the app never bundles them.
  • Build generated code as syntax trees printed with esrap, not string fragments; values JSX or TypeScript would reinterpret go through string literals.
  • Imported documents are untrusted: check Base64 with js-base64's isValid before decoding.