@warpgogol/forge 1.0.1 → 1.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,12 +1,24 @@
1
1
  {
2
2
  "name": "@warpgogol/forge",
3
- "version": "1.0.1",
3
+ "version": "1.2.2",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "license": "Apache-2.0",
7
7
  "description": "Framework for documenting and implementing ideas — RFC/ADR governance, skills, and project bootstrapping.",
8
- "keywords": ["rfc", "adr", "governance", "skills", "ai-agent", "documentation", "framework"],
8
+ "keywords": [
9
+ "rfc",
10
+ "adr",
11
+ "governance",
12
+ "skills",
13
+ "ai-agent",
14
+ "documentation",
15
+ "framework"
16
+ ],
9
17
  "homepage": "https://warpgogol.com",
18
+ "repository": {
19
+ "type": "git",
20
+ "url": "git+https://github.com/syrokomskyi/forge.git"
21
+ },
10
22
  "main": "./src/index.ts",
11
23
  "types": "./src/index.ts",
12
24
  "bin": {
@@ -291,5 +303,6 @@
291
303
  "default": "./dist/os/program/program.module.js"
292
304
  }
293
305
  }
294
- }
306
+ },
307
+ "packageManager": "pnpm@11.10.0"
295
308
  }
@@ -202,7 +202,7 @@ workspace:
202
202
 
203
203
  console.log(`Cleaned ${toDelete.length} directories.`);
204
204
  install:
205
- - pnpm add -D typescript turbo @warpgogol/forge prettier
205
+ - pnpm add -D typescript turbo @warpgogol/forge @warpgogol/werkstatt @warpgogol/werkstatt-shared @warpgogol/werkstatt-site prettier
206
206
  firstWorkspace:
207
207
  path: sites/my-site
208
208
  files:
@@ -326,7 +326,7 @@ workspace:
326
326
 
327
327
  console.log(`Cleaned ${toDelete.length} directories.`);
328
328
  install:
329
- - pnpm add -D typescript turbo @warpgogol/forge prettier
329
+ - pnpm add -D typescript turbo @warpgogol/forge @warpgogol/werkstatt @warpgogol/werkstatt-godot prettier
330
330
  firstWorkspace:
331
331
  path: games/my-game
332
332
  files:
@@ -202,7 +202,7 @@ workspace:
202
202
 
203
203
  console.log(`Cleaned ${toDelete.length} directories.`);
204
204
  install:
205
- - pnpm add -D typescript turbo @warpgogol/forge prettier
205
+ - pnpm add -D typescript turbo @warpgogol/forge @warpgogol/werkstatt @warpgogol/werkstatt-shared @warpgogol/werkstatt-game prettier
206
206
  firstWorkspace:
207
207
  path: games/my-game
208
208
  files:
@@ -22,7 +22,7 @@ Before starting, read `PREFERENCES.md` at the repository root. If the file is mi
22
22
 
23
23
  ### Ingest mode
24
24
 
25
- Invoked as `/fo-spec-ingest <path-to-package>` when the operator has an external specification package (e.g. a consultant deliverable, an Obsidian vault export).
25
+ Invoked as `/fo-spec-ingest <path-to-package>` when the operator has an external specification package (e.g. a consultant deliverable, a markdown vault export).
26
26
 
27
27
  ### Authoring mode
28
28
 
@@ -1,69 +0,0 @@
1
- # Composition Workspace
2
-
3
- This workspace contains an Editframe video composition.
4
-
5
- ## Domain terminology
6
-
7
- - **Composition** — the artifact this workspace produces (a `.tsx` file using `@editframe/react` components).
8
- - **Scene** — a structural module within a composition (a `Timegroup` block).
9
- - **Director** — the operator who creates and renders the composition.
10
-
11
- ## Quality invariants
12
-
13
- | ID | Description | Severity |
14
- | --- | --- | --- |
15
- | VIDEO-01 | Composition filenames must use kebab-case (lowercase letters, digits, hyphens only). | error |
16
- | VIDEO-02 | Scene durations must use `contain` fit mode by default to avoid unexpected cropping. Use `cover` or `fill` only when intentionally overriding. | warning |
17
- | VIDEO-03 | All speech audio elements (`Audio` with speech content) must have corresponding `Captions` components for accessibility. | error |
18
-
19
- Additional time model invariants (VIDEO-04 through VIDEO-09) may be available. Run `forge doctor` to check the full invariant set enforced by the active profile.
20
-
21
- ## Time model concepts
22
-
23
- Editframe compositions use a time model based on `Timegroup` components from `@editframe/react`:
24
-
25
- - **`Timegroup`** — a container that groups scenes and controls timing. The root Timegroup defines the composition's total duration. Inside a `Workbench`, use `Timegroup` directly as the root temporal element — do NOT wrap it in `TimelineRoot`, which renders a `<div style="display: contents">` wrapper that breaks Workbench's DOM structure.
26
- - **`mode`** — timing behavior for children: `sequence` (play one after another), `fixed` (play at absolute offset), `contain` (fit within parent duration), `fit` (scale to fit).
27
- - **`duration`** — CSS time string (e.g. `5s`, `300ms`, `2.5s`) defining how long the element plays.
28
- - **`offset`** — CSS time string defining when the element starts relative to its parent.
29
- - **`fps`** — positive integer defining frames per second (e.g. `30`, `60`).
30
- - **`loop`** — boolean, only on the root Timegroup. Nested Timegroups should not loop.
31
-
32
- ## Workflow
33
-
34
- 1. Create a `.tsx` file with `@editframe/react` components (`Workbench`, `Configuration`, `Timegroup`, `Video`, `Audio`, `Text`, `Captions`). Use `Timegroup` as the root temporal element inside `Workbench > Configuration` — do NOT use `TimelineRoot` inside `Workbench`.
35
- 2. Run `editframe preview` to preview the composition in the browser.
36
- 3. Run `ef-composition-review` to review the composition for time model correctness, accessibility, and best practices.
37
- 4. Run `editframe check` to validate the composition structure.
38
- 5. Run `editframe render -o dist/<name>.mp4` to produce the final video output.
39
- 6. Run `ef-render-verify` to verify the render — validation, build, determinism, output inspection.
40
-
41
- ## Skills
42
-
43
- - **ef-onboard** — onboard a new project: prerequisites, discovery, scaffold, preview. Trigger: "create a new video project".
44
- - **ef-composition-review** — review a composition for time model correctness, accessibility, and best practices before rendering. Trigger: "review this composition".
45
- - **ef-render-verify** — verify a render: validate, build, check determinism, inspect output. Trigger: "render and verify".
46
- - **ef-composition** — guide creating a new video composition with Editframe React components. Trigger: "create a video composition".
47
- - **ef-dev-server** — set up and manage the Editframe dev server for live preview. Trigger: "set up editframe dev server".
48
- - **ef-editor-gui** — configure the Editframe editor GUI for visual composition editing. Trigger: "open editframe editor".
49
- - **ef-webhooks** — configure Editframe webhooks for render status notifications. Trigger: "set up editframe webhooks".
50
- - **ef-brand-video-generator** — generate brand video compositions from templates. Trigger: "generate a brand video".
51
- - **ef-motion-design** — apply motion design patterns to compositions. Trigger: "add motion design".
52
-
53
- ## External resources
54
-
55
- - [Editframe llms.txt](https://editframe.com/llms.txt) — machine-readable index of Editframe domain skills
56
- - [Editframe composition skill](https://editframe.com/skills/composition.md) — full reference for time model, elements, and rendering
57
- - [Editframe getting started](https://editframe.com/getting-started) — step-by-step guide and agent prompt
58
-
59
- ## Reference template
60
-
61
- A sample composition template is available at `editframe-templates/composition.tsx` in the forge profiles directory. Copy it to start a new composition:
62
-
63
- ```sh
64
- cp node_modules/@warpgogol/forge/profiles/editframe-templates/composition.tsx compositions/my-new-video/composition.tsx
65
- ```
66
-
67
- ## File naming
68
-
69
- Composition files use kebab-case: `my-video.tsx`, `product-demo.tsx`, `intro-clip.tsx`.
@@ -1,81 +0,0 @@
1
- /*
2
- Editframe React composition template
3
- Copy this file to start a new composition. @editframe/react components:
4
- - Workbench: preview canvas with toolbar and timeline (requires resolution)
5
- - Configuration: Editframe configuration wrapper
6
- - Timegroup: groups elements into a timed sequence (use as root inside Workbench)
7
- - Video: video source with fit mode (contain, cover, fill)
8
- - Audio: audio source
9
- - Text: text overlay — pass text as children, style via style prop
10
- - Captions: accessibility captions for speech audio
11
- Run `editframe preview` to preview, `editframe render` to produce output.
12
- */
13
- import { useEffect, useRef } from "react";
14
- import { Configuration, Timegroup, Text, Workbench } from "@editframe/react";
15
-
16
- const EFWorkbench = Workbench as any;
17
- const EFConfiguration = Configuration as any;
18
- const EFTimegroup = Timegroup as any;
19
- const EFText = Text as any;
20
-
21
- export default function Composition() {
22
- const workbenchRef = useRef<HTMLElement>(null);
23
-
24
- useEffect(() => {
25
- const wb = workbenchRef.current;
26
- if (!wb) return;
27
-
28
- const fixReplay = () => {
29
- const config = wb.querySelector("ef-configuration");
30
- const controller = (config as any)?.playback;
31
- if (!controller) return;
32
-
33
- const originalPlay = controller.play.bind(controller);
34
- controller.play = (opts?: any) => {
35
- if (!opts?.from && controller.currentTime >= controller.duration) {
36
- originalPlay({ from: 0, to: opts?.to });
37
- return;
38
- }
39
- originalPlay(opts);
40
- };
41
- };
42
-
43
- fixReplay();
44
- wb.addEventListener("playback-attached", fixReplay);
45
- return () => wb.removeEventListener("playback-attached", fixReplay);
46
- }, []);
47
-
48
- return (
49
- <EFWorkbench ref={workbenchRef} resolution="1920x1080">
50
- <EFConfiguration>
51
- <EFTimegroup
52
- id="root"
53
- duration="10s"
54
- mode="contain"
55
- style={{
56
- width: "1920px",
57
- height: "1080px",
58
- background: "#000",
59
- display: "flex",
60
- alignItems: "center",
61
- justifyContent: "center",
62
- }}
63
- >
64
- <EFText
65
- duration="10s"
66
- style={{
67
- color: "white",
68
- fontSize: "72px",
69
- textAlign: "center",
70
- fontFamily: "ui-sans-serif, system-ui, sans-serif",
71
- opacity: "min(1, var(--ef-progress, 0) * 5)",
72
- transform: "scale(min(1, 0.8 + var(--ef-progress, 0) * 0.2))",
73
- }}
74
- >
75
- Hello, Editframe!
76
- </EFText>
77
- </EFTimegroup>
78
- </EFConfiguration>
79
- </EFWorkbench>
80
- );
81
- }
@@ -1,62 +0,0 @@
1
- # HTML Composition Workspace
2
-
3
- This workspace contains an Editframe video composition using HTML web components.
4
-
5
- ## Domain terminology
6
-
7
- - **Composition** — the artifact this workspace produces (an `.html` file using Editframe web components).
8
- - **Scene** — a structural module within a composition (an `ef-timegroup` block).
9
- - **Director** — the operator who creates and renders the composition.
10
-
11
- ## Quality invariants
12
-
13
- | ID | Description | Severity |
14
- | --- | --- | --- |
15
- | VIDEO-01 | Composition filenames must use kebab-case (lowercase letters, digits, hyphens only). | error |
16
- | VIDEO-02 | Scene durations must use `contain` fit mode by default to avoid unexpected cropping. Use `cover` or `fill` only when intentionally overriding. | warning |
17
- | VIDEO-03 | All speech audio elements (`ef-audio` with speech content) must have corresponding `ef-captions` components for accessibility. | error |
18
-
19
- Additional time model invariants (VIDEO-04 through VIDEO-09) may be available. Run `forge doctor` to check the full invariant set enforced by the active profile.
20
-
21
- ## Time model concepts
22
-
23
- Editframe HTML compositions use a time model based on web components:
24
-
25
- - **`ef-timeline`** — the root container for the composition.
26
- - **`ef-timegroup`** — a container that groups scenes and controls timing. The root ef-timegroup defines the composition's total duration.
27
- - **`mode`** — timing behavior for children: `sequence` (play one after another), `fixed` (play at absolute offset), `contain` (fit within parent duration), `fit` (scale to fit).
28
- - **`duration`** — CSS time string (e.g. `5s`, `300ms`, `2.5s`) defining how long the element plays.
29
- - **`offset`** — CSS time string defining when the element starts relative to its parent.
30
- - **`fps`** — positive integer defining frames per second (e.g. `30`, `60`).
31
- - **`loop`** — boolean, only on the root ef-timegroup. Nested ef-timegroups should not loop.
32
-
33
- ## Workflow
34
-
35
- 1. Create an `.html` file with Editframe web components (`ef-timeline`, `ef-timegroup`, `ef-video`, `ef-audio`, `ef-text`, `ef-captions`).
36
- 2. Run `editframe preview` to preview the composition in the browser.
37
- 3. Run `ef-composition-review` to review the composition for time model correctness, accessibility, and best practices.
38
- 4. Run `editframe check` to validate the composition structure.
39
- 5. Run `editframe render -o dist/<name>.mp4` to produce the final video output.
40
- 6. Run `ef-render-verify` to verify the render — validation, build, determinism, output inspection.
41
-
42
- ## Skills
43
-
44
- - **ef-onboard** — onboard a new project: prerequisites, discovery, scaffold, preview. Trigger: "create a new video project".
45
- - **ef-composition-review** — review a composition for time model correctness, accessibility, and best practices before rendering. Trigger: "review this composition".
46
- - **ef-render-verify** — verify a render: validate, build, check determinism, inspect output. Trigger: "render and verify".
47
- - **ef-composition** — guide creating a new video composition with Editframe HTML components. Trigger: "create a video composition".
48
- - **ef-dev-server** — set up and manage the Editframe dev server for live preview. Trigger: "set up editframe dev server".
49
- - **ef-editor-gui** — configure the Editframe editor GUI for visual composition editing. Trigger: "open editframe editor".
50
- - **ef-webhooks** — configure Editframe webhooks for render status notifications. Trigger: "set up editframe webhooks".
51
- - **ef-brand-video-generator** — generate brand video compositions from templates. Trigger: "generate a brand video".
52
- - **ef-motion-design** — apply motion design patterns to compositions. Trigger: "add motion design".
53
-
54
- ## External resources
55
-
56
- - [Editframe llms.txt](https://editframe.com/llms.txt) — machine-readable index of Editframe domain skills
57
- - [Editframe composition skill](https://editframe.com/skills/composition.md) — full reference for time model, elements, and rendering
58
- - [Editframe getting started](https://editframe.com/getting-started) — step-by-step guide and agent prompt
59
-
60
- ## File naming
61
-
62
- Composition files use kebab-case: `my-video.html`, `product-demo.html`, `intro-clip.html`.