tsquare 0.1.0 → 0.2.0

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 CHANGED
@@ -29,14 +29,14 @@ Requires Node 20 or newer. To work on tsquare itself, clone the repo, run `npm i
29
29
  ## Playground
30
30
 
31
31
  ```bash
32
- npm run playground # http://localhost:4321
32
+ npx tsquare playground # http://localhost:4321
33
33
  ```
34
34
 
35
35
  - **Editor:** live render as you type, problems listed by line (click one to jump there), and SVG/PNG export. Paste a whole model reply and it keeps just the code block.
36
36
  - **Components:** every component with its props and a rendered example you can open in the editor. It's generated from the catalog, so it can't drift from what the renderer accepts.
37
37
  - **Prompt:** the system prompt for models, with a copy button.
38
38
 
39
- It renders on a local Node server using the same code as the CLI.
39
+ It runs on a local server with the same renderer as the CLI. In this repo, `npm run playground` runs it from source.
40
40
 
41
41
  ## The language
42
42
 
@@ -95,13 +95,25 @@ tsquare render <file.tsq|-> [-o out.svg|out.png] [--scale 2]
95
95
  tsquare check <file.tsq|-> # problems by line number
96
96
  tsquare fmt <file.tsq|-> [-w] # canonical formatting (drops comments)
97
97
  tsquare prompt # system prompt for models
98
+ tsquare playground [--port 4321] # live editor, component reference, prompt
98
99
  ```
99
100
 
100
101
  Use `-` to read from stdin. In this repo, run them through npm: `npm run check -- file.tsq`. Files use the `.tsq` extension; the CLI reads any text file.
101
102
 
103
+ ## Library
104
+
105
+ ```ts
106
+ import { renderWireframe, compileWireframe, formatIssues } from "tsquare";
107
+
108
+ const { issues } = compileWireframe(source); // problems by line, empty when valid
109
+ const png = await renderWireframe(source, { format: "png", scale: 2 });
110
+ ```
111
+
112
+ `tsquare/playground` exports the playground's request handler, for hosting it inside your own Node server. See [Using it with AI](docs/ai.md) for the prompt and the repair loop.
113
+
102
114
  ## Using it with Claude (skill)
103
115
 
104
- `skill/tsquare/` is a Claude skill: the syntax, the component reference, and a workflow of write → `tsquare check` → `tsquare render` → look at the PNG and fix. Copy it to `~/.claude/skills/tsquare` (all projects) or `<project>/.claude/skills/tsquare`, and make the `tsquare` command available (`npm link` in this repo). Rebuild it after catalog changes with `npm run skill`.
116
+ `skill/tsquare/` is a Claude skill: the syntax, the component reference, and a workflow of write → `tsquare check` → `tsquare render` → look at the PNG and fix. Copy it to `~/.claude/skills/tsquare` (all projects) or `<project>/.claude/skills/tsquare`, and make sure `npx tsquare` runs where Claude works. Rebuild it after catalog changes with `npm run skill`.
105
117
 
106
118
  ## How it works
107
119
 
Binary file
package/bin/tsquare.js CHANGED
@@ -1,7 +1,3 @@
1
1
  #!/usr/bin/env node
2
- // The CLI is TypeScript (with JSX components); tsx loads it at runtime so
3
- // `npm link` and `npx tsquare` work without a build step.
4
- import { register } from "tsx/esm/api";
5
-
6
- register();
7
- await import("../src/cli.ts");
2
+ // Runs the built CLI (npm run build writes dist/).
3
+ import "../dist/cli.js";