@tscaps/engine 0.1.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Franco Zanardi
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,349 @@
+# @tscaps/engine
+
+> Burn subtitles into video in the browser. No server, no editor.
+
+`@tscaps/engine` is a TypeScript engine that takes a video file, sources its captions (in-browser Whisper transcription, an existing `.srt`, or a hand-built `Document`), lays them out through CSS, and exports the result frame-by-frame to a new video — all client-side, with no backend involved.
+
+The defining technical bet: **CSS is the rendering engine**. Subtitle preview is a DOM overlay above a `<video>` element. Final export samples that same CSS-styled DOM into bitmaps per frame, composited by a browser-side video pipeline. One visual artifact, two rendering paths.
+
+## Install
+
+```bash
+npm install @tscaps/engine
+```
+
+The engine targets modern browsers (Chrome 94+, Edge 94+, Safari 16.4+, Firefox 130+) and requires WebCodecs, Web Audio, and Canvas APIs. Node ≥20 is needed only for development tooling; the engine itself does not run in Node.
+
+## Quick start
+
+The minimum-viable consumer: feed a video in, get back a captioned `Blob`. With no transcriber supplied, the engine downloads a Whisper model on first run (~80MB, cached after) and transcribes the audio itself.
+
+```ts
+import { RenderPipelineBuilder } from '@tscaps/engine';
+
+const inputVideo: Blob = /* from a file input, fetch, etc. */;
+
+const pipeline = new RenderPipelineBuilder()
+  .withInputVideo(inputVideo)
+  .build();
+
+const { blob } = await pipeline.run();
+// `blob` is a Blob containing the captioned mp4
+```
+
+## Examples
+
+The examples below build on each other and share two fixtures so each variation is easy to compare side by side:
+
+**The clip** — a short demo video the engine renders captions onto:
+
+![Input clip](https://raw.githubusercontent.com/francozanardi/tscaps/main/packages/engine/docs/demo.gif)
+
+**The SRT** — caption text and cue timings used as input to `SrtTranscriber` throughout:
+
+```srt
+1
+00:00:00,500 --> 00:00:02,500
+Welcome to the engine.
+
+2
+00:00:02,500 --> 00:00:05,500
+Captions burned in the browser.
+
+3
+00:00:05,500 --> 00:00:08,000
+No server, no editor.
+```
+
+### 1. From an SRT file
+
+Feed the engine a hand-authored `.srt`. `SrtTranscriber` parses cues into a `Document` and skips the Whisper model entirely. Default styling: bold white text, bottom-center, with a soft shadow.
+
+```ts
+import { RenderPipelineBuilder, SrtTranscriber } from '@tscaps/engine';
+
+const srt = await (await fetch('/captions.srt')).text();
+
+const pipeline = new RenderPipelineBuilder()
+  .withInputVideo(inputVideo)
+  .withTranscriber(new SrtTranscriber(srt))
+  .build();
+
+const { blob } = await pipeline.run();
+```
+
+![Default styling](https://raw.githubusercontent.com/francozanardi/tscaps/main/packages/engine/docs/readme-from-srt.gif)
+
+### 2. Custom caption style
+
+Hand the pipeline a CSS string. The default selectors are `.segment`, `.line`, and `.word`; the engine attaches those classes to the rendered DOM. Container units (`cqh`, `cqw`) scale sizes against the video frame. `-webkit-text-stroke` paired with `paint-order: stroke fill` paints the outline outside the glyph instead of bleeding into it.
+
+```ts
+const captionCss = `
+  .segment {
+    font-family: system-ui, -apple-system, sans-serif;
+    font-weight: 800;
+    font-size: 6cqh;
+    color: #ffd400;
+    -webkit-text-stroke: 0.06em #000;
+    paint-order: stroke fill;
+    text-shadow: 0 0.1em 0.3em rgba(0, 0, 0, 0.6);
+    text-align: center;
+    line-height: 1.2;
+  }
+  .line { display: block; text-align: center; }
+  .word { display: inline-block; margin: 0 0.15em; }
+`;
+
+const pipeline = new RenderPipelineBuilder()
+  .withInputVideo(inputVideo)
+  .withTranscriber(new SrtTranscriber(srt))
+  .withCss(captionCss)
+  .build();
+
+const { blob } = await pipeline.run();
+```
+
+![Custom CSS](https://raw.githubusercontent.com/francozanardi/tscaps/main/packages/engine/docs/readme-custom-css.gif)
+
+### 3. Caption position
+
+Captions default to bottom-center. To move them, pass an `AlignmentConfig` — fractions of the video's width and height as the anchor point, plus which edge of the caption box lands on that point.
+
+```ts
+const pipeline = new RenderPipelineBuilder()
+  .withInputVideo(inputVideo)
+  .withTranscriber(new SrtTranscriber(srt))
+  .withCss(captionCss)
+  .withAlignment({
+    verticalAlign: 'top',
+    verticalOffset: 0.12,
+    horizontalAlign: 'center',
+    horizontalOffset: 0.5,
+  })
+  .build();
+
+const { blob } = await pipeline.run();
+```
+
+![CSS + top alignment](https://raw.githubusercontent.com/francozanardi/tscaps/main/packages/engine/docs/readme-css-alignment.gif)
+
+### 4. One word at a time (splitters)
+
+The engine pipes the `Document` through a `SegmentSplitter` and a `LineSplitter` before rendering. Override them to force exactly one word per segment and one line per segment, then style each word as a large standalone caption.
+
+```ts
+import {
+  RenderPipelineBuilder,
+  SrtTranscriber,
+  LimitByWordsSegmentSplitter,
+} from '@tscaps/engine';
+
+const singleWordCss = `
+  .segment {
+    font-family: system-ui, -apple-system, sans-serif;
+    font-weight: 900;
+    font-size: 11cqh;
+    color: #ffffff;
+    -webkit-text-stroke: 0.05em #000;
+    paint-order: stroke fill;
+    text-shadow: 0 0.12em 0.3em rgba(0, 0, 0, 0.6);
+    text-align: center;
+    line-height: 1.1;
+  }
+  .line { display: block; text-align: center; }
+  .word { display: inline-block; }
+`;
+
+const pipeline = new RenderPipelineBuilder()
+  .withInputVideo(inputVideo)
+  .withTranscriber(new SrtTranscriber(srt))
+  .withSegmentSplitter(new LimitByWordsSegmentSplitter({ maxWords: 1 }))
+  .withDefaultLineSplitterConfig({ maxLines: 1 })
+  .withCss(singleWordCss)
+  .build();
+
+const { blob } = await pipeline.run();
+```
+
+![One word at a time](https://raw.githubusercontent.com/francozanardi/tscaps/main/packages/engine/docs/readme-single-word.gif)
+
+### 5. Karaoke highlight (state classes)
+
+Every word carries a state class that reflects the current playback time: `word-not-narrated-yet`, `word-being-narrated`, or `word-already-narrated`. Target those classes in CSS to recolour each word as it plays.
+
+```ts
+const karaokeCss = `
+  .segment {
+    font-family: system-ui, -apple-system, sans-serif;
+    font-weight: 800;
+    font-size: 6cqh;
+    -webkit-text-stroke: 0.06em #000;
+    paint-order: stroke fill;
+    text-shadow: 0 0.1em 0.3em rgba(0, 0, 0, 0.6);
+    text-align: center;
+    line-height: 1.2;
+  }
+  .line { display: block; text-align: center; }
+  .word {
+    display: inline-block;
+    margin: 0 0.15em;
+    color: #ffffff;
+  }
+  .word.word-being-narrated  { color: #ffd400; }
+  .word.word-already-narrated { color: #b0b0b0; }
+`;
+
+const pipeline = new RenderPipelineBuilder()
+  .withInputVideo(inputVideo)
+  .withTranscriber(new SrtTranscriber(srt))
+  .withCss(karaokeCss)
+  .build();
+
+const { blob } = await pipeline.run();
+```
+
+![Karaoke highlight](https://raw.githubusercontent.com/francozanardi/tscaps/main/packages/engine/docs/readme-karaoke.gif)
+
+### 6. Animation driven by playback timing
+
+The engine also exposes CSS custom properties that encode timing relative to the current frame — `--on-segment-starts`, `--on-line-being-narrated-starts`, `--word-being-narrated-duration`, and so on. Use them as `animation-delay` (or `animation-duration`) so a single keyframe rule plays in sync with the narration, frame after frame.
+
+```ts
+const slideInCss = `
+  @keyframes segment-slide-in {
+    from { transform: translateY(0.5em); opacity: 0; }
+    to   { transform: translateY(0); opacity: 1; }
+  }
+  .segment {
+    font-family: system-ui, -apple-system, sans-serif;
+    font-weight: 800;
+    font-size: 6cqh;
+    text-align: center;
+    line-height: 1.2;
+    padding: 0.2em 0.6em;
+    border-radius: 0.25em;
+    background: rgba(255, 212, 0, 0.92);
+    color: #111;
+    animation: segment-slide-in 0.35s var(--on-segment-starts) ease-out both;
+  }
+  .line { display: block; text-align: center; }
+  .word { display: inline-block; margin: 0 0.1em; }
+`;
+
+const pipeline = new RenderPipelineBuilder()
+  .withInputVideo(inputVideo)
+  .withTranscriber(new SrtTranscriber(srt))
+  .withCss(slideInCss)
+  .build();
+
+const { blob } = await pipeline.run();
+```
+
+![Slide-in animation](https://raw.githubusercontent.com/francozanardi/tscaps/main/packages/engine/docs/readme-slide-in.gif)
+
+## Document model
+
+Every transcriber produces a `Document` whose hierarchy is:
+
+```
+Document
+└── Section[]   contiguous run, processed by one splitter + tagger chain
+    └── Segment[]   one screen-sized caption block, carries a time range
+        └── Line[]   one visible line of text within a segment
+            └── Word[]   a word with text, time range, and tag set
+```
+
+The pipeline restructures the same `Word`s into different `Segment`s and `Line`s through `SegmentSplitter` and `LineSplitter`; the underlying word data (`text`, `time`, `tags`) does not change.
+
+The render layer exposes that document to CSS through three surfaces: a flat set of CSS classes per element, a flat set of CSS custom properties per element, and a tag system that adds more classes via taggers. Everything the examples above target — `.word`, `.word-being-narrated`, `--on-segment-starts`, `var(--on-line-being-narrated-starts)` — comes from these surfaces.
+
+### CSS classes the engine emits
+
+Every rendered element carries its element class:
+
+- `.section` — the root of the active Section
+- `.segment` — a caption block
+- `.line` — a visible line within a segment
+- `.word` — a single word within a line
+- `.letter` — a single letter within a word, emitted only when `rendering.splitWordsIntoLetters` is `true`
+
+State classes — computed per frame from the current playback time and attached to the matching `.word` / `.line`:
+
+- `word-not-narrated-yet`, `word-being-narrated`, `word-already-narrated`
+- `line-not-narrated-yet`, `line-being-narrated`, `line-already-narrated`
+
+Positional tags from `StructureTagger`, assigned once after splitting:
+
+- `first-word-in-line`, `last-word-in-line`
+- `first-word-in-segment`, `last-word-in-segment`
+- `first-word-in-section`, `last-word-in-section`
+- `first-line-in-segment`, `last-line-in-segment`
+- `first-line-in-section`, `last-line-in-section`
+- `first-segment-in-section`, `last-segment-in-section`
+- `first-section-in-document`, `last-section-in-document`
+
+Semantic tag classes come from `Tagger` implementations you add to the pipeline (see *Tags and taggers* below) and are entirely consumer-defined.
+
+### CSS custom properties
+
+Each rendered element exposes timing values relative to the current frame, so you can drive `animation-delay`, `animation-duration`, or any other CSS value from the narration timeline. `--on-…-starts` and `--on-…-ends` are seconds until the event; they go negative once the event is in the past. `--…-duration` is a span.
+
+Element-level timing:
+
+- `--on-section-starts`, `--on-section-ends`, `--section-duration`
+- `--on-segment-starts`, `--on-segment-ends`, `--segment-duration`
+
+Per-state timing, for both `.line` and `.word` (substitute `<elem>` with `line` or `word`):
+
+- `--on-<elem>-not-narrated-yet-starts`, `--on-<elem>-not-narrated-yet-ends`, `--<elem>-not-narrated-yet-duration`
+- `--on-<elem>-being-narrated-starts`, `--on-<elem>-being-narrated-ends`, `--<elem>-being-narrated-duration`
+- `--on-<elem>-already-narrated-starts`, `--on-<elem>-already-narrated-ends`, `--<elem>-already-narrated-duration`
+
+Letter-level, when splitting into letters:
+
+- `--letter-index`, `--letter-count`
+
+Layout and frame:
+
+- `--subtitle-region-width`, `--subtitle-region-height`, `--subtitle-region-x`, `--subtitle-region-y` — the caption region's box, useful when positioning relative to the video frame
+- `--video-frame` — the underlying video frame as `url("data:image/jpeg;base64,…")`, only set when `rendering.videoFrame.required` is `true` (see [docs/RENDERING_INTERNALS.md](docs/RENDERING_INTERNALS.md))
+
+### Tags and taggers
+
+A `Tag` is a CSS class the engine attaches to an element of the document. The engine recognises three sources:
+
+- **Structural tags** are assigned by `StructureTagger`, which runs once after splitting and encodes each element's positional role within its container (the list above under *CSS classes*). The structural tagger is part of every default pipeline; you can target these classes without writing any tagger yourself.
+- **Semantic tags** are assigned by `Tagger` implementations that pattern-match against word data. Built-ins: `RegexTagger` (matches a regex against the word text), `WordlistTagger` (membership in a set of strings), `SpanTagger` (a contiguous range of words by index). Build your own by extending the `Tagger` abstract class. Attach them through `.addTagger(...)` or `.withTaggers([...])` on the builder.
+- **State tags** — `word-being-narrated`, `line-already-narrated`, etc. — are computed at render time from the current playback timestamp. They are never stored on the `Word` or `Line`; the engine just derives them per frame.
+
+Tags map one-to-one onto CSS classes through `Tag.toCssClass()`. Unknown tag classes are silently ignored by CSS, so adding a new tag category is additive — it never breaks existing stylesheets.
+
+## What else the engine can do
+
+The examples above cover the common cases. The pipeline exposes more knobs you'll reach for as your needs grow:
+
+- **Built-in transcribers**: `WhisperTranscriber` (the default, in-browser Whisper), `SrtTranscriber` (parses SubRip), `PassthroughTranscriber` (wraps a pre-built `Document`). Or implement your own by satisfying the `Transcriber` interface.
+- **Segment splitters**: the default `CompositeSegmentSplitter` chains a sentence-boundary cut with a scaled-character budget. Individual strategies are exposed for custom chains — `BoundarySegmentSplitter`, `LimitByWordsSegmentSplitter`, `LimitByScaledCharsSegmentSplitter`, `PauseBasedSegmentSplitter`, `SpeakerChangeSegmentSplitter`.
+- **Line splitters**: `BalancedLineSplitter` (char-balanced, no measurer needed) and `BalancedPixelWidthLineSplitter` (pixel-balanced, backed by a `TextMeasurer` — `DomProbeCanvasTextMeasurer` is the default measurer).
+- **Replace any stage**: `withTranscriber`, `withSegmentSplitter`, `withLineSplitter`, `withVideoRenderer`, `withSubtitleFrameRenderer`, `withOverlayFrameRenderer`. Defaults stay in place until explicitly replaced.
+- **Tweak default-stage configs without rebuilding them**: `withDefaultSegmentSplitterConfig({ maxChars, minChars, ... })`, `withDefaultLineSplitterConfig({ maxLines, maxWidthRatio, ... })`.
+- **Output control**: `withOutputFormat('mp4' | 'webm')`, `withOutputResolution(width, height)`, `withQuality(...)`, `withOutputStream(...)` for streaming the encoded bytes as they're produced.
+- **Per-step execution**: `runTranscriptionStep`, `runSplittingStep`, `runStructuralTaggingStep`, `runSemanticTaggingStep`, `runEffectsStep`, `runRenderingStep`. Useful when you want to inspect or hand-edit the `Document` between stages — `getDocument()` and `setDocument(doc)` give you read/replace access.
+- **Progress reporting**: `run` accepts a callback that fires through every pipeline stage — Whisper model download, transcription, splitting, tagging, effects, and per-frame rendering progress.
+- **Effects and semantic taggers**: pure document-transforming stages (smart punctuation, lowercase, regex/wordlist taggers, etc.) added via `addEffect` and `addTagger`.
+- **Multi-style captions**: `withSubtitleStyles({ kindA: ..., kindB: ... })` for documents with multiple `Section.kind` groups, each carrying its own visual rule.
+
+Full type definitions and inline JSDoc ship in `dist/index.d.ts`. Runnable browser and CLI consumers live in [`examples/`](examples) in the source repository.
+
+## Going deeper
+
+For the parts of the engine that sit below the public pipeline API — how each output frame is sampled into a bitmap via SVG `<foreignObject>`, how MediaBunny powers the encode, the browser caveats that come with that approach, how to feed the underlying video frame into your caption styles, and how SVG filters are authored — see [docs/RENDERING_INTERNALS.md](docs/RENDERING_INTERNALS.md).
+
+## Project status
+
+Pre-1.0. The public API surface is stabilising but may shift between minor versions until `1.0`. Pin to an exact version in production and review the changelog before upgrading.
+
+## License
+
+MIT — see [LICENSE](LICENSE).

package/dist/index.d.ts

@@ -0,0 +1,12 @@
+export * from './modules/document/index';
+export * from './modules/transcription/index';
+export * from './modules/video/index';
+export * from './modules/rendering/index';
+export * from './modules/css/index';
+export * from './modules/svg-filter/index';
+export * from './modules/splitting/index';
+export * from './modules/tagging/index';
+export * from './modules/effect/index';
+export * from './modules/profiling/index';
+export * from './modules/pipeline/index';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC;AACnC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC"}

package/dist/index.js

@@ -0,0 +1,12 @@
+export * from './modules/document/index';
+export * from './modules/transcription/index';
+export * from './modules/video/index';
+export * from './modules/rendering/index';
+export * from './modules/css/index';
+export * from './modules/svg-filter/index';
+export * from './modules/splitting/index';
+export * from './modules/tagging/index';
+export * from './modules/effect/index';
+export * from './modules/profiling/index';
+export * from './modules/pipeline/index';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,yBAAyB,CAAC;AACxC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC;AACnC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC"}

package/dist/modules/css/BrowserCssResourceEmbedder.d.ts

@@ -0,0 +1,5 @@
+import type { CssResourceEmbedder } from '../css/CssResourceEmbedder';
+export declare class BrowserCssResourceEmbedder implements CssResourceEmbedder {
+    embed(css: string): Promise<string>;
+}
+//# sourceMappingURL=BrowserCssResourceEmbedder.d.ts.map

package/dist/modules/css/BrowserCssResourceEmbedder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrowserCssResourceEmbedder.d.ts","sourceRoot":"","sources":["../../../src/modules/css/BrowserCssResourceEmbedder.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAE5E,qBAAa,0BAA2B,YAAW,mBAAmB;IAC9D,KAAK,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC;CAyC1C"}

package/dist/modules/css/BrowserCssResourceEmbedder.js

@@ -0,0 +1,41 @@
+export class BrowserCssResourceEmbedder {
+    async embed(css) {
+        const urlRegex = /url\(\s*(['"]?)(.*?)\1\s*\)/g;
+        const matches = [...css.matchAll(urlRegex)];
+        // Extract unique URLs, ignoring those already embedded as data: URIs
+        // and same-document fragment refs like url(#filter-id), which point
+        // at sibling <defs> inside the host SVG and must be left intact.
+        const allUrls = matches.map((m) => m[2]);
+        const validUrls = allUrls.filter((url) => Boolean(url) && !url.startsWith('data:') && !url.startsWith('#'));
+        const uniqueUrls = [...new Set(validUrls)];
+        const replacements = new Map();
+        await Promise.all(uniqueUrls.map(async (url) => {
+            try {
+                const response = await window.fetch(url);
+                if (!response.ok)
+                    throw new Error(`HTTP ${response.status}`);
+                const blob = await response.blob();
+                const dataUrl = await new Promise((resolve, reject) => {
+                    const reader = new FileReader();
+                    reader.onloadend = () => resolve(reader.result);
+                    reader.onerror = reject;
+                    reader.readAsDataURL(blob);
+                });
+                replacements.set(url, dataUrl);
+            }
+            catch (e) {
+                console.warn(`BrowserCssResourceEmbedder failed to embed resource: ${url}`, e);
+            }
+        }));
+        let result = css;
+        for (const match of matches) {
+            const url = match[2];
+            if (url && replacements.has(url)) {
+                const newUrl = replacements.get(url);
+                result = result.replace(match[0], `url("${newUrl}")`);
+            }
+        }
+        return result;
+    }
+}
+//# sourceMappingURL=BrowserCssResourceEmbedder.js.map

package/dist/modules/css/BrowserCssResourceEmbedder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrowserCssResourceEmbedder.js","sourceRoot":"","sources":["../../../src/modules/css/BrowserCssResourceEmbedder.ts"],"names":[],"mappings":"AAEA,MAAM,OAAO,0BAA0B;IACrC,KAAK,CAAC,KAAK,CAAC,GAAW;QACrB,MAAM,QAAQ,GAAG,8BAA8B,CAAC;QAChD,MAAM,OAAO,GAAG,CAAC,GAAG,GAAG,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC;QAE5C,qEAAqE;QACrE,oEAAoE;QACpE,iEAAiE;QACjE,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACzC,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,EAAiB,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,GAAI,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,GAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC;QAC7H,MAAM,UAAU,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC;QAE3C,MAAM,YAAY,GAAG,IAAI,GAAG,EAAkB,CAAC;QAE/C,MAAM,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;YAC7C,IAAI,CAAC;gBACH,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;gBACzC,IAAI,CAAC,QAAQ,CAAC,EAAE;oBAAE,MAAM,IAAI,KAAK,CAAC,QAAQ,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC;gBAC7D,MAAM,IAAI,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;gBACnC,MAAM,OAAO,GAAG,MAAM,IAAI,OAAO,CAAS,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;oBAC3D,MAAM,MAAM,GAAG,IAAI,UAAU,EAAE,CAAC;oBAChC,MAAM,CAAC,SAAS,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,MAAgB,CAAC,CAAC;oBAC1D,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC;oBACxB,MAAM,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;gBAC9B,CAAC,CAAC,CAAC;gBACH,YAAY,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;YACjC,CAAC;YAAC,OAAO,CAAC,EAAE,CAAC;gBACX,OAAO,CAAC,IAAI,CAAC,wDAAwD,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC;YACjF,CAAC;QACH,CAAC,CAAC,CAAC,CAAC;QAEJ,IAAI,MAAM,GAAG,GAAG,CAAC;QACjB,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE,CAAC;YAC5B,MAAM,GAAG,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;YACrB,IAAI,GAAG,IAAI,YAAY,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC;gBACjC,MAAM,MAAM,GAAG,YAAY,CAAC,GAAG,CAAC,GAAG,CAAE,CAAC;gBACtC,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,QAAQ,MAAM,IAAI,CAAC,CAAC;YACxD,CAAC;QACH,CAAC;QAED,OAAO,MAAM,CAAC;IAChB,CAAC;CACF"}

package/dist/modules/css/CssMinifier.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Strips CSS block comments (`/* … *\/`) from a stylesheet, leaving
+ * whitespace and rule structure untouched.
+ *
+ * Comment-like sequences inside string literals are preserved. An
+ * unterminated comment drops everything from its opening to the end
+ * of the input — matching what browsers do when they encounter one.
+ */
+export declare class CssMinifier {
+    minify(css: string): string;
+}
+//# sourceMappingURL=CssMinifier.d.ts.map

package/dist/modules/css/CssMinifier.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssMinifier.d.ts","sourceRoot":"","sources":["../../../src/modules/css/CssMinifier.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,qBAAa,WAAW;IACtB,MAAM,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM;CAkC5B"}

package/dist/modules/css/CssMinifier.js

@@ -0,0 +1,47 @@
+/**
+ * Strips CSS block comments (`/* … *\/`) from a stylesheet, leaving
+ * whitespace and rule structure untouched.
+ *
+ * Comment-like sequences inside string literals are preserved. An
+ * unterminated comment drops everything from its opening to the end
+ * of the input — matching what browsers do when they encounter one.
+ */
+export class CssMinifier {
+    minify(css) {
+        let result = '';
+        let i = 0;
+        let stringDelim = null;
+        while (i < css.length) {
+            const ch = css[i];
+            if (stringDelim) {
+                result += ch;
+                if (ch === '\\' && i + 1 < css.length) {
+                    result += css[i + 1];
+                    i += 2;
+                    continue;
+                }
+                if (ch === stringDelim)
+                    stringDelim = null;
+                i++;
+                continue;
+            }
+            if (ch === '"' || ch === "'") {
+                stringDelim = ch;
+                result += ch;
+                i++;
+                continue;
+            }
+            if (ch === '/' && css[i + 1] === '*') {
+                const end = css.indexOf('*/', i + 2);
+                if (end === -1)
+                    break;
+                i = end + 2;
+                continue;
+            }
+            result += ch;
+            i++;
+        }
+        return result;
+    }
+}
+//# sourceMappingURL=CssMinifier.js.map

package/dist/modules/css/CssMinifier.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssMinifier.js","sourceRoot":"","sources":["../../../src/modules/css/CssMinifier.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,MAAM,OAAO,WAAW;IACtB,MAAM,CAAC,GAAW;QAChB,IAAI,MAAM,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,GAAG,CAAC,CAAC;QACV,IAAI,WAAW,GAAqB,IAAI,CAAC;QACzC,OAAO,CAAC,GAAG,GAAG,CAAC,MAAM,EAAE,CAAC;YACtB,MAAM,EAAE,GAAG,GAAG,CAAC,CAAC,CAAE,CAAC;YACnB,IAAI,WAAW,EAAE,CAAC;gBAChB,MAAM,IAAI,EAAE,CAAC;gBACb,IAAI,EAAE,KAAK,IAAI,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,MAAM,EAAE,CAAC;oBACtC,MAAM,IAAI,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;oBACrB,CAAC,IAAI,CAAC,CAAC;oBACP,SAAS;gBACX,CAAC;gBACD,IAAI,EAAE,KAAK,WAAW;oBAAE,WAAW,GAAG,IAAI,CAAC;gBAC3C,CAAC,EAAE,CAAC;gBACJ,SAAS;YACX,CAAC;YACD,IAAI,EAAE,KAAK,GAAG,IAAI,EAAE,KAAK,GAAG,EAAE,CAAC;gBAC7B,WAAW,GAAG,EAAE,CAAC;gBACjB,MAAM,IAAI,EAAE,CAAC;gBACb,CAAC,EAAE,CAAC;gBACJ,SAAS;YACX,CAAC;YACD,IAAI,EAAE,KAAK,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,GAAG,EAAE,CAAC;gBACrC,MAAM,GAAG,GAAG,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;gBACrC,IAAI,GAAG,KAAK,CAAC,CAAC;oBAAE,MAAM;gBACtB,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC;gBACZ,SAAS;YACX,CAAC;YACD,MAAM,IAAI,EAAE,CAAC;YACb,CAAC,EAAE,CAAC;QACN,CAAC;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;CACF"}

package/dist/modules/css/CssResourceEmbedder.d.ts

@@ -0,0 +1,4 @@
+export interface CssResourceEmbedder {
+    embed(css: string): Promise<string>;
+}
+//# sourceMappingURL=CssResourceEmbedder.d.ts.map

package/dist/modules/css/CssResourceEmbedder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssResourceEmbedder.d.ts","sourceRoot":"","sources":["../../../src/modules/css/CssResourceEmbedder.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,mBAAmB;IAClC,KAAK,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;CACrC"}

package/dist/modules/css/CssResourceEmbedder.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=CssResourceEmbedder.js.map

package/dist/modules/css/CssResourceEmbedder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssResourceEmbedder.js","sourceRoot":"","sources":["../../../src/modules/css/CssResourceEmbedder.ts"],"names":[],"mappings":""}

package/dist/modules/css/CssScoper.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Scopes a CSS string so it can coexist with sibling stylesheets in
+ * the same document. Top-level selectors get prefixed with
+ * `scopeSelector`; every `@keyframes` declaration is renamed to a
+ * scope-unique form and the matching `animation-name` / `animation`
+ * shorthand references in the same stylesheet are rewritten in step.
+ *
+ * `scopeSelector` is expected to be a simple class selector
+ * (e.g. `.my-scope`); its identifier portion seeds the keyframe rename.
+ */
+export declare class CssScoper {
+    scope(css: string, scopeSelector: string): string;
+    private scopeKeyframes;
+    private scopeSelectors;
+}
+//# sourceMappingURL=CssScoper.d.ts.map

package/dist/modules/css/CssScoper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CssScoper.d.ts","sourceRoot":"","sources":["../../../src/modules/css/CssScoper.ts"],"names":[],"mappings":"AAIA;;;;;;;;;GASG;AACH,qBAAa,SAAS;IACpB,KAAK,CAAC,GAAG,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,GAAG,MAAM;IAKjD,OAAO,CAAC,cAAc;IA2BtB,OAAO,CAAC,cAAc;CA0DvB"}