@elucim/dsl 0.1.0 → 0.1.1
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/README.md +40 -3
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
# @elucim/dsl
|
|
2
2
|
|
|
3
|
-
> JSON
|
|
3
|
+
> Declarative JSON DSL for animated visualizations — perfect for AI agents.
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
[](https://www.npmjs.com/package/@elucim/dsl)
|
|
6
|
+
[](https://github.com/sethjuarez/elucim/blob/main/LICENSE)
|
|
6
7
|
|
|
7
|
-
`@elucim/dsl` lets you describe animated diagrams as JSON documents. An AI agent (or any code) produces a JSON object conforming to the schema, and the `<DslRenderer>` component renders it as a fully interactive Elucim visualization.
|
|
8
|
+
`@elucim/dsl` lets you describe animated diagrams as JSON documents. An AI agent (or any code) produces a JSON object conforming to the schema, and the `<DslRenderer>` component renders it as a fully interactive [Elucim](https://www.npmjs.com/package/@elucim/core) visualization — no React knowledge required.
|
|
9
|
+
|
|
10
|
+
## Install
|
|
11
|
+
|
|
12
|
+
```bash
|
|
13
|
+
npm install @elucim/dsl @elucim/core react react-dom
|
|
14
|
+
# or
|
|
15
|
+
pnpm add @elucim/dsl @elucim/core react react-dom
|
|
16
|
+
```
|
|
8
17
|
|
|
9
18
|
## Quick Start
|
|
10
19
|
|
|
@@ -206,3 +215,31 @@ Example prompt:
|
|
|
206
215
|
> "Create an Elucim DSL JSON document that shows a coordinate system with sin(x) and cos(x) plotted,
|
|
207
216
|
> with the sin curve drawing first, then the cos curve drawing 30 frames later,
|
|
208
217
|
> and a LaTeX label fading in at the end."
|
|
218
|
+
|
|
219
|
+
## Fluent Builder API
|
|
220
|
+
|
|
221
|
+
Build presentations programmatically with a chainable TypeScript API:
|
|
222
|
+
|
|
223
|
+
```tsx
|
|
224
|
+
import { presentation, darkTheme } from '@elucim/dsl';
|
|
225
|
+
|
|
226
|
+
const doc = presentation(darkTheme)
|
|
227
|
+
.size(1920, 1080)
|
|
228
|
+
.transition('fade', 500)
|
|
229
|
+
.slide('Welcome', (s) => {
|
|
230
|
+
s.title('Hello World');
|
|
231
|
+
})
|
|
232
|
+
.slide('Math', (s) => {
|
|
233
|
+
s.latex('e^{i\\pi} + 1 = 0', { x: 960, y: 500, fontSize: 48, color: '#fdcb6e' });
|
|
234
|
+
})
|
|
235
|
+
.build();
|
|
236
|
+
```
|
|
237
|
+
|
|
238
|
+
## Related
|
|
239
|
+
|
|
240
|
+
- **[@elucim/core](https://www.npmjs.com/package/@elucim/core)** — The React rendering engine (peer dependency)
|
|
241
|
+
- **[Elucim on GitHub](https://github.com/sethjuarez/elucim)** — Full docs with live interactive examples
|
|
242
|
+
|
|
243
|
+
## License
|
|
244
|
+
|
|
245
|
+
[MIT](https://github.com/sethjuarez/elucim/blob/main/LICENSE)
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elucim/dsl",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"description": "JSON/YAML DSL for declarative Elucim animations — define visualizations without writing React code",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "MIT",
|
|
@@ -49,7 +49,7 @@
|
|
|
49
49
|
"react-dom": "^18.0.0 || ^19.0.0"
|
|
50
50
|
},
|
|
51
51
|
"dependencies": {
|
|
52
|
-
"@elucim/core": "^0.1.
|
|
52
|
+
"@elucim/core": "^0.1.1"
|
|
53
53
|
},
|
|
54
54
|
"devDependencies": {
|
|
55
55
|
"@types/react": "^18.3.0",
|