forma-diagrams 0.5.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/Dockerfile +16 -0
- package/LICENSE +21 -0
- package/README.md +113 -0
- package/THIRD_PARTY_NOTICES.md +20 -0
- package/bin/forma +3 -0
- package/deploy/.env.example +11 -0
- package/deploy/Caddyfile +4 -0
- package/deploy/compose.yml +38 -0
- package/dist/assets/IBMPlexSans-Regular-Bl2SjS7V.ttf +0 -0
- package/dist/assets/IBMPlexSans-SemiBold-B9auKknr.ttf +0 -0
- package/dist/assets/elk.bundled-Y7ymokgr.js +24 -0
- package/dist/assets/index-_kg9cdik.css +1 -0
- package/dist/assets/index-al0xDdTG.js +452 -0
- package/dist/fonts/IBMPlexSans-Regular.ttf +0 -0
- package/dist/fonts/IBMPlexSans-SemiBold.ttf +0 -0
- package/dist/fonts/OFL.txt +93 -0
- package/dist/index.html +14 -0
- package/dist/licenses/FORMA_LICENSE.txt +21 -0
- package/dist/licenses/THIRD_PARTY_LICENSES.txt +11601 -0
- package/docs/api.md +41 -0
- package/docs/decisions/001-foundation.md +57 -0
- package/docs/decisions/002-composition-and-human-edits.md +47 -0
- package/docs/decisions/003-general-composition.md +30 -0
- package/docs/decisions/004-library-and-distribution.md +33 -0
- package/docs/decisions/005-organizational-hosting.md +33 -0
- package/docs/decisions/006-hosted-agent-access.md +25 -0
- package/docs/format.md +132 -0
- package/docs/gallery.md +73 -0
- package/docs/images/architecture.png +0 -0
- package/docs/images/editor.png +0 -0
- package/docs/images/gallery/architecture.png +0 -0
- package/docs/images/gallery/decision.png +0 -0
- package/docs/images/gallery/development-signal.png +0 -0
- package/docs/images/gallery/development.png +0 -0
- package/docs/images/gallery/editor-roundtrip.png +0 -0
- package/docs/images/gallery/entities.png +0 -0
- package/docs/images/gallery/mindmap.png +0 -0
- package/docs/images/gallery/organization.png +0 -0
- package/docs/images/gallery/timeline.png +0 -0
- package/docs/images/release.png +0 -0
- package/docs/install.md +50 -0
- package/docs/plans/mvp.md +24 -0
- package/docs/self-hosting.md +167 -0
- package/docs/verification-v2.md +41 -0
- package/docs/verification-v3.md +16 -0
- package/docs/verification-v4.1.md +35 -0
- package/docs/verification-v4.2.md +20 -0
- package/docs/verification-v4.3.md +5 -0
- package/docs/verification-v4.md +31 -0
- package/docs/verification-v5.1.md +7 -0
- package/docs/verification-v5.2.md +7 -0
- package/docs/verification-v5.md +7 -0
- package/docs/verification.md +91 -0
- package/examples/design-systems/atelier.json +53 -0
- package/examples/design-systems/signal.json +53 -0
- package/examples/gallery/architecture.forma.json +178 -0
- package/examples/gallery/decision.forma.json +182 -0
- package/examples/gallery/development-signal.forma.json +299 -0
- package/examples/gallery/development.forma.json +299 -0
- package/examples/gallery/entities.forma.json +123 -0
- package/examples/gallery/mindmap.forma.json +158 -0
- package/examples/gallery/organization.forma.json +151 -0
- package/examples/gallery/timeline.forma.json +138 -0
- package/examples/platform.forma.json +116 -0
- package/examples/release.forma.json +58 -0
- package/examples/roundtrip/agent-continued.forma.json +310 -0
- package/examples/roundtrip/agent-patch.json +7 -0
- package/examples/roundtrip/human-edited.forma.json +309 -0
- package/package.json +81 -0
- package/packages/cli/bin.mjs +3 -0
- package/packages/cli/src/agent-access.ts +232 -0
- package/packages/cli/src/blob-store.ts +241 -0
- package/packages/cli/src/file-library.ts +179 -0
- package/packages/cli/src/google.ts +51 -0
- package/packages/cli/src/hosted.ts +498 -0
- package/packages/cli/src/http.ts +67 -0
- package/packages/cli/src/index.ts +397 -0
- package/packages/cli/src/mcp.ts +114 -0
- package/packages/cli/src/remote.ts +228 -0
- package/packages/cli/src/server.ts +69 -0
- package/packages/cli/src/signed-cookie.ts +42 -0
- package/packages/core/src/align.ts +237 -0
- package/packages/core/src/document.ts +408 -0
- package/packages/core/src/font-metrics.json +1 -0
- package/packages/core/src/geometry.ts +463 -0
- package/packages/core/src/index.ts +12 -0
- package/packages/core/src/inspect.ts +230 -0
- package/packages/core/src/layout.ts +450 -0
- package/packages/core/src/render.ts +182 -0
- package/packages/core/src/resolve-style.ts +29 -0
- package/packages/core/src/scene.ts +40 -0
- package/packages/core/src/styles.ts +122 -0
- package/packages/core/src/text.ts +81 -0
- package/packages/core/src/theme.ts +33 -0
- package/public/fonts/IBMPlexSans-Regular.ttf +0 -0
- package/public/fonts/IBMPlexSans-SemiBold.ttf +0 -0
- package/public/fonts/OFL.txt +93 -0
- package/schema/design-system.v1.schema.json +734 -0
- package/schema/forma.v1.schema.json +273 -0
- package/schema/forma.v2.schema.json +1756 -0
- package/skills/forma/SKILL.md +20 -0
- package/skills/forma/references/composition.md +11 -0
- package/skills/forma/references/hosted.md +28 -0
- package/skills/forma-architecture/SKILL.md +14 -0
- package/skills/forma-entities/SKILL.md +14 -0
- package/skills/forma-flow/SKILL.md +14 -0
- package/skills/forma-mindmap/SKILL.md +14 -0
- package/skills/forma-organization/SKILL.md +14 -0
- package/skills/forma-timeline/SKILL.md +14 -0
package/Dockerfile
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
FROM node:22-bookworm-slim AS build
|
|
2
|
+
WORKDIR /app
|
|
3
|
+
COPY package.json package-lock.json ./
|
|
4
|
+
RUN npm ci
|
|
5
|
+
COPY . .
|
|
6
|
+
RUN npm run build && npm prune --omit=dev
|
|
7
|
+
|
|
8
|
+
FROM node:22-bookworm-slim
|
|
9
|
+
WORKDIR /app
|
|
10
|
+
COPY --from=build --chown=node:node /app /app
|
|
11
|
+
RUN mkdir /data && chown node:node /data
|
|
12
|
+
USER node
|
|
13
|
+
ENV NODE_ENV=production FORMA_DATA_DIR=/data FORMA_BIND_HOST=0.0.0.0 FORMA_PORT=4242
|
|
14
|
+
EXPOSE 4242
|
|
15
|
+
ENTRYPOINT ["node", "packages/cli/bin.mjs"]
|
|
16
|
+
CMD ["host"]
|
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Forma contributors
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
# Forma
|
|
2
|
+
|
|
3
|
+
Professional diagrams, shared by people and agents.
|
|
4
|
+
|
|
5
|
+
Forma is an open-source, local-first diagramming tool. Describe components, relationships, groups, and emphasis in a versioned JSON document; Forma composes the diagram. Open that same document in the graphical editor, move a component or change its appearance, then let an agent update its meaning without discarding your adjustments.
|
|
6
|
+
|
|
7
|
+
The engine uses general nodes, shapes, groups, relationships, and content-sized composition grids. Conventional diagram types live in agent skills; no category is required. Versioned organizational design systems control geometry, typography, connectors, spacing, and visual roles, with element-level and human overrides. ELK supplies layered layout, React Flow supplies editor interactions, and a shared composition/SVG layer keeps both interfaces consistent.
|
|
8
|
+
|
|
9
|
+

|
|
10
|
+
|
|
11
|
+
[Browse the rendered gallery](docs/gallery.md): architecture, decisions, organization, entities, timelines, mind maps, and a custom parallel-streams explanation. The same content is also rendered with a substantially different visual identity.
|
|
12
|
+
|
|
13
|
+
## Install
|
|
14
|
+
|
|
15
|
+
Requires Node.js 22+. No build step is needed for a release install:
|
|
16
|
+
|
|
17
|
+
```sh
|
|
18
|
+
npm install -g https://github.com/joeycast/forma/releases/download/v0.5.2/forma-diagrams-0.5.2.tgz
|
|
19
|
+
forma serve --directory ~/Forma
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
Open the printed URL. **Library** browses your folder and subfolders; **Save** writes back to the same files your agents edit. **Agent guide** provides a complete copyable setup prompt. **Create or edit design system** defines reusable visual identities. See [installation and everyday use](docs/install.md).
|
|
23
|
+
|
|
24
|
+
## Host for your organization
|
|
25
|
+
|
|
26
|
+
Forma also supports Google sign-in and private server-backed libraries. Your organization supplies its own Google OAuth client, server, and durable disk. The authenticated `forma host` command is separate from the local `forma serve` adapter. A Docker Compose/Caddy recipe provides HTTPS hosting without a database or Forma-operated service. Signed-in users can issue scoped agent tokens from **Agent access** and connect `forma remote` or `forma mcp` without sharing Google credentials. See the [self-hosting guide](docs/self-hosting.md) for setup, admission allowlists, backups, agent tokens, [updates](docs/self-hosting.md#updating-a-hosted-instance), and limits.
|
|
27
|
+
|
|
28
|
+
## Develop locally
|
|
29
|
+
|
|
30
|
+
Requires Node.js 22 or newer.
|
|
31
|
+
|
|
32
|
+
```sh
|
|
33
|
+
npm install
|
|
34
|
+
npm run dev
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
Open the Vite URL in your terminal. No account, API key, database, or backend is needed. The editor runs in your browser; explicitly save the native document to keep a portable copy. Browser storage is local convenience, not a backup. For shared local files, build and run `node packages/cli/bin.mjs serve --directory ~/Forma`.
|
|
38
|
+
|
|
39
|
+
```sh
|
|
40
|
+
npm run build
|
|
41
|
+
npm run preview
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
Deploy the generated `dist/` folder to any static host. Runtime rendering, editing, and export happen on the client. Package installation is the only required network step for local development. A Vercel project can also run hosted Google sign-in with Blob-backed private libraries; see [self-hosting](docs/self-hosting.md#vercel-personal-hosted-editor).
|
|
45
|
+
|
|
46
|
+
## Agent workflow
|
|
47
|
+
|
|
48
|
+
Run from this checkout. `node packages/cli/bin.mjs` invokes the same CLI without npm's banner, useful when parsing stdout.
|
|
49
|
+
|
|
50
|
+
```sh
|
|
51
|
+
npm run forma -- create --template architecture --output platform.forma.json
|
|
52
|
+
npm run forma -- validate platform.forma.json
|
|
53
|
+
npm run forma -- inspect platform.forma.json
|
|
54
|
+
npm run forma -- render platform.forma.json --output platform.svg
|
|
55
|
+
npm run forma -- export platform.forma.json --output platform.png
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
Open `platform.forma.json` in the web editor, edit it, and save it. Then create `changes.json`:
|
|
59
|
+
|
|
60
|
+
```json
|
|
61
|
+
{ "nodes": [{ "id": "web", "label": "Customer portal" }] }
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
```sh
|
|
65
|
+
npm run forma -- patch platform.forma.json --patch changes.json
|
|
66
|
+
npm run forma -- inspect platform.forma.json
|
|
67
|
+
npm run forma -- render platform.forma.json --output platform.svg
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
The patch merges by stable ID and preserves existing human positions and styles. Invalid patches never replace the document. `layout --output scene.json` emits resolved geometry separately from the native file. `inspect --strict` returns exit code 2 for warnings as well as errors. Successful commands write JSON to stdout; failures write JSON to stderr and exit 1.
|
|
71
|
+
|
|
72
|
+
Read the concise [agent skill](skills/forma/SKILL.md), [document and patch format](docs/format.md), and [core API](docs/api.md).
|
|
73
|
+
|
|
74
|
+
## Architecture
|
|
75
|
+
|
|
76
|
+
- `packages/core`: validation, semantic patching, composition, inspection, SVG rendering. No browser or CLI dependency.
|
|
77
|
+
- `packages/cli`: file operations and SVG/PNG exports, using the shared engine.
|
|
78
|
+
- `apps/editor`: static React application using the same native document and engine.
|
|
79
|
+
- `examples`: v1 compatibility examples, v2 gallery, and reusable organizational design systems.
|
|
80
|
+
- `skills`: concise diagram-specific composition guidance over the same general engine.
|
|
81
|
+
|
|
82
|
+
The native document is authoritative. A scene is derived geometry, and an SVG or PNG is an export. Keep the `.forma.json` file in Git. Versions 1 and 2 reject unknown fields and unsupported versions rather than silently losing data. Existing v1 files remain readable; `migrate` explicitly upgrades them, and patches using v2 capabilities upgrade automatically. See [the general composition decision](docs/decisions/003-general-composition.md).
|
|
83
|
+
|
|
84
|
+
## Scope and limits
|
|
85
|
+
|
|
86
|
+
This is a focused MVP, not a general drawing canvas. It supports up to 200 nodes, 600 edges, and 40 groups; smaller diagrams receive the most design attention. Human positions are absolute pins. Adding content around pins can create conflicts: inspect the result, adjust pins, or clear them explicitly to return control to automatic layout. Inspection is heuristic and does not certify aesthetic quality.
|
|
87
|
+
|
|
88
|
+
SVG and PNG are implemented. CLI PNG exports use 2× scale and reject output above 32 million pixels before rasterization; use SVG or reduce diagram spread for larger documents. Editable draw.io, VSDX, PDF, and PowerPoint are future exporters; no promise of those formats is implied. They should consume the common scene and semantic document rather than rasterizing native objects by default. Shared team folders, raw illustration paths, and image imports are outside this phase. The optional local file server is loopback-only; a separate authenticated hosted mode adds Google sign-in, private user libraries, and optional agent tokens with a CLI/MCP adapter. Custom font names are preserved, but only bundled IBM Plex Sans has portable measured rendering. ER examples use explicit text cardinality rather than native crow's-foot markers.
|
|
89
|
+
|
|
90
|
+
```sh
|
|
91
|
+
npm test
|
|
92
|
+
npm run build
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
MIT licensed. See [third-party notices](THIRD_PARTY_NOTICES.md) for dependency and font licenses.
|
|
96
|
+
|
|
97
|
+
## Contributing and verification
|
|
98
|
+
|
|
99
|
+
See [CONTRIBUTING.md](CONTRIBUTING.md) and the [verified MVP walkthrough](docs/verification.md).
|
|
100
|
+
The [JSON Schema](schema/forma.v2.schema.json) supports editor tooling; the core validator
|
|
101
|
+
also checks cross-object references and hierarchy. The build includes third-party
|
|
102
|
+
license texts in `dist/licenses/` and the font license in `dist/fonts/`.
|
|
103
|
+
|
|
104
|
+
## Start without a category
|
|
105
|
+
|
|
106
|
+
```sh
|
|
107
|
+
node packages/cli/bin.mjs create --output idea.forma.json
|
|
108
|
+
node packages/cli/bin.mjs style idea.forma.json --system examples/design-systems/atelier.json
|
|
109
|
+
```
|
|
110
|
+
|
|
111
|
+
Write or patch content into the blank artifact; use the [format reference](docs/format.md). To try a finished custom composition, open `examples/gallery/development.forma.json` in the editor. `examples/gallery/development-signal.forma.json` has identical structure and element overrides with a different organizational identity.
|
|
112
|
+
|
|
113
|
+
Reproduce the visual gallery with `node --import tsx scripts/gallery.ts` and `node --import tsx scripts/render-gallery.ts`. See [phase-two verification](docs/verification-v2.md) for the human/agent round trip and limits.
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
# Third-party notices
|
|
2
|
+
|
|
3
|
+
Forma's original code is MIT licensed. Third-party code and assets retain their licenses. The lockfile identifies exact installed versions; source distributions in `node_modules` contain applicable notices. Preserve their license notices when redistributing bundled software.
|
|
4
|
+
|
|
5
|
+
| Component | Purpose | License / upstream |
|
|
6
|
+
| -------------------------- | ----------------------------------- | ---------------------------------------------------------------------------------------------------------------- |
|
|
7
|
+
| ELK / elkjs | Layered graph layout | [EPL-2.0](https://github.com/kieler/elkjs/blob/master/LICENSE.md) |
|
|
8
|
+
| React Flow / @xyflow/react | Graphical interaction | [MIT](https://github.com/xyflow/xyflow/blob/main/LICENSE) |
|
|
9
|
+
| React and React DOM | Editor UI | [MIT](https://github.com/facebook/react/blob/main/LICENSE) |
|
|
10
|
+
| Zod | Native document validation | [MIT](https://github.com/colinhacks/zod/blob/main/LICENSE) |
|
|
11
|
+
| Lucide | Interface icons | [ISC](https://github.com/lucide-icons/lucide/blob/main/LICENSE) |
|
|
12
|
+
| resvg-js | CLI PNG rasterization | [MPL-2.0](https://github.com/yisibl/resvg-js/blob/main/LICENSE) |
|
|
13
|
+
| IBM Plex Sans | Bundled typography | [SIL OFL 1.1](public/fonts/OFL.txt) |
|
|
14
|
+
| Vite | Development and static build | [MIT](https://github.com/vitejs/vite/blob/main/LICENSE) |
|
|
15
|
+
| TypeScript | Type checking | [Apache-2.0](https://github.com/microsoft/TypeScript/blob/main/LICENSE.txt) |
|
|
16
|
+
| Google Auth Library | Hosted Google identity verification | [Apache-2.0](https://github.com/googleapis/google-cloud-node/tree/main/core/packages/google-auth-library-nodejs) |
|
|
17
|
+
| MCP TypeScript SDK | Optional hosted agent adapter | [MIT](https://github.com/modelcontextprotocol/typescript-sdk/blob/main/LICENSE) |
|
|
18
|
+
| tsx | TypeScript CLI runtime | [MIT](https://github.com/privatenumber/tsx/blob/master/LICENSE) |
|
|
19
|
+
|
|
20
|
+
ELK and resvg remain separate third-party components under their upstream terms. There are no proprietary runtime dependencies. Local/static modes need no operated service; optional hosted sign-in uses Google identity through the organization’s own OAuth client. This table covers principal direct dependencies, not every transitive package; use installed package licenses and the lockfile for a complete redistribution inventory.
|
package/bin/forma
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
FORMA_PUBLIC_URL=https://diagrams.example.com
|
|
2
|
+
FORMA_GOOGLE_CLIENT_ID=replace-with-google-web-client-id
|
|
3
|
+
FORMA_GOOGLE_CLIENT_SECRET=replace-with-google-client-secret
|
|
4
|
+
# At least one allowlist is required. Domain checks use Google's verified hd claim.
|
|
5
|
+
FORMA_ALLOWED_DOMAINS=example.com
|
|
6
|
+
FORMA_ALLOWED_EMAILS=
|
|
7
|
+
FORMA_USER_BYTES=100000000
|
|
8
|
+
FORMA_USER_FILES=1000
|
|
9
|
+
FORMA_MAX_USERS=500
|
|
10
|
+
# Optional Streamable HTTP MCP endpoint at /mcp. The stdio bridge `forma mcp` does not need this.
|
|
11
|
+
# FORMA_ENABLE_MCP=true
|
package/deploy/Caddyfile
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
services:
|
|
2
|
+
forma:
|
|
3
|
+
build:
|
|
4
|
+
context: ..
|
|
5
|
+
init: true
|
|
6
|
+
stop_grace_period: 45s
|
|
7
|
+
restart: unless-stopped
|
|
8
|
+
env_file: .env
|
|
9
|
+
environment:
|
|
10
|
+
FORMA_DATA_DIR: /data
|
|
11
|
+
FORMA_BIND_HOST: 0.0.0.0
|
|
12
|
+
FORMA_PORT: 4242
|
|
13
|
+
volumes:
|
|
14
|
+
- forma-data:/data
|
|
15
|
+
expose:
|
|
16
|
+
- '4242'
|
|
17
|
+
security_opt:
|
|
18
|
+
- no-new-privileges:true
|
|
19
|
+
cap_drop:
|
|
20
|
+
- ALL
|
|
21
|
+
caddy:
|
|
22
|
+
image: caddy:2
|
|
23
|
+
restart: unless-stopped
|
|
24
|
+
environment:
|
|
25
|
+
FORMA_PUBLIC_URL: ${FORMA_PUBLIC_URL:?Set FORMA_PUBLIC_URL in .env}
|
|
26
|
+
ports:
|
|
27
|
+
- '80:80'
|
|
28
|
+
- '443:443'
|
|
29
|
+
volumes:
|
|
30
|
+
- ./Caddyfile:/etc/caddy/Caddyfile:ro
|
|
31
|
+
- caddy-data:/data
|
|
32
|
+
- caddy-config:/config
|
|
33
|
+
depends_on:
|
|
34
|
+
- forma
|
|
35
|
+
volumes:
|
|
36
|
+
forma-data:
|
|
37
|
+
caddy-data:
|
|
38
|
+
caddy-config:
|
|
Binary file
|
|
Binary file
|