@swifttui/web 0.4.5 → 0.4.7
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 +52 -49
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -7,11 +7,11 @@ Swift-authored UI into a `<canvas>`, no terminal emulator.**
|
|
|
7
7
|

|
|
8
8
|
|
|
9
9
|
`@swifttui/web` is the browser host for SwiftTUI. A SwiftTUI app compiles to
|
|
10
|
-
`wasm32-wasi` and
|
|
11
|
-
loads the scene manifest
|
|
12
|
-
tree for accessibility
|
|
13
|
-
view code
|
|
14
|
-
emulator.
|
|
10
|
+
`wasm32-wasi` and sends a structured raster surface on stdout. This package
|
|
11
|
+
loads the scene manifest and renders that surface in a canvas. It mounts an
|
|
12
|
+
ARIA tree for accessibility and sends input to the running app. Thus, the same
|
|
13
|
+
view code runs in a terminal and on a web page. The package does not load a
|
|
14
|
+
terminal emulator.
|
|
15
15
|
|
|
16
16
|
The build side — compiling your Swift app to wasm and capturing its manifest —
|
|
17
17
|
lives in the sibling
|
|
@@ -25,14 +25,14 @@ lives in the sibling
|
|
|
25
25
|
## Installation
|
|
26
26
|
|
|
27
27
|
Published to npm as an ESM package with bundled TypeScript declarations — no
|
|
28
|
-
TypeScript toolchain
|
|
28
|
+
TypeScript toolchain is necessary to use it:
|
|
29
29
|
|
|
30
30
|
```bash
|
|
31
31
|
npm install @swifttui/web
|
|
32
32
|
```
|
|
33
33
|
|
|
34
|
-
The package
|
|
35
|
-
|
|
34
|
+
The package contains compiled JavaScript and declarations in `dist/`
|
|
35
|
+
(`.js` + `.d.ts`). You do **not** need Bun or a TypeScript build step. Subpath entry points
|
|
36
36
|
(`./wasi`, `./wasi-worker`, `./manifest`, `./websocket`, `./testing`) and the
|
|
37
37
|
`./style.css` asset are declared in `package.json` `exports`.
|
|
38
38
|
|
|
@@ -86,7 +86,8 @@ stdin works.
|
|
|
86
86
|
|
|
87
87
|
## Renderers
|
|
88
88
|
|
|
89
|
-
|
|
89
|
+
One option selects between two surface presenters. Both presenters consume the
|
|
90
|
+
same frames:
|
|
90
91
|
|
|
91
92
|
```ts
|
|
92
93
|
await createWebHostApp({
|
|
@@ -96,21 +97,21 @@ await createWebHostApp({
|
|
|
96
97
|
});
|
|
97
98
|
```
|
|
98
99
|
|
|
99
|
-
- **`"canvas"`** (default) paints cells
|
|
100
|
-
|
|
101
|
-
- **`"dom"`** renders cells as absolutely positioned text elements
|
|
102
|
-
browser
|
|
103
|
-
page zoom,
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
`
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
The
|
|
112
|
-
and
|
|
113
|
-
|
|
100
|
+
- **`"canvas"`** (default) paints cells on one 2D `<canvas>` DOM node. It draws
|
|
101
|
+
exact box seams and decoration patterns.
|
|
102
|
+
- **`"dom"`** renders cells as absolutely positioned text elements. It uses
|
|
103
|
+
browser font shaping and fallback for emoji and CJK. Text stays sharp at each
|
|
104
|
+
page zoom, and the element tree is inspectable. Hold Alt/Option and drag to
|
|
105
|
+
select and copy app text. A drag without Alt/Option remains pointer input for
|
|
106
|
+
the app. Box characters render as font glyphs. Underline and strikethrough
|
|
107
|
+
patterns use CSS `text-decoration`. Thus, thin details can differ from the
|
|
108
|
+
canvas painter. `letter-spacing` stretches each glyph advance to the cell
|
|
109
|
+
width and keeps the grid aligned.
|
|
110
|
+
|
|
111
|
+
The option is also available for each scene runtime through
|
|
112
|
+
`WebHostSceneRuntimeOptions.renderer`. The package exports both painters:
|
|
113
|
+
`CanvasSurfacePainter` and `DomSurfacePainter`. Hosts can use these painters in
|
|
114
|
+
custom runtimes.
|
|
114
115
|
|
|
115
116
|
## Surface transport
|
|
116
117
|
|
|
@@ -129,31 +130,32 @@ self-describing.
|
|
|
129
130
|
- Scene switching is controller-managed and retains existing scene runtimes.
|
|
130
131
|
- Terminal styling is host-owned through `WebHostTerminalStyle`, which carries
|
|
131
132
|
one active palette/theme pair plus the runtime payload sent into SwiftTUI.
|
|
132
|
-
- Hosts
|
|
133
|
-
|
|
133
|
+
- Hosts with multiple themes swap entire `WebHostTerminalStyle` objects. The
|
|
134
|
+
library does not provide a built-in mode switcher.
|
|
134
135
|
- `BrowserWASIBridge` sets `SWIFTTUI_TRANSPORT=surface` and decodes surface
|
|
135
136
|
frames before handing them to the canvas runtime.
|
|
136
|
-
- Hyperlink cells
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
`preferredGridSize`
|
|
137
|
+
- Hyperlink cells from the app use `links` and `linkTargets` on the frame. A
|
|
138
|
+
click opens an `http(s)` target in a new tab. The `onOpenHyperlink` runtime
|
|
139
|
+
option can open the target instead. A pointer cursor identifies linked
|
|
140
|
+
cells. Accessibility nodes that the app marks `hidden` do not enter the ARIA
|
|
141
|
+
tree. The runtime exposes the frame `focusPresentation` and
|
|
142
|
+
`preferredGridSize` values to hosts.
|
|
142
143
|
|
|
143
144
|
## Developing this package
|
|
144
145
|
|
|
145
|
-
>
|
|
146
|
-
> package
|
|
147
|
-
> toolchain.
|
|
146
|
+
> This section applies only to work **on** `@swifttui/web`. An app that uses the
|
|
147
|
+
> package needs only the `npm install` command above. It does not need Bun or
|
|
148
|
+
> the Swift toolchain.
|
|
148
149
|
|
|
149
|
-
Use Bun for
|
|
150
|
-
toolchain for
|
|
151
|
-
(`swiftly run swift --version`). Run `bun install` from the
|
|
152
|
-
workspace package directory
|
|
150
|
+
Use Bun for local development. Use the repository `swiftly` Swift 6.3.3
|
|
151
|
+
toolchain for each Swift command that the build pipeline starts
|
|
152
|
+
(`swiftly run swift --version`). Run `bun install` from the repository root or
|
|
153
|
+
a workspace package directory. Bun maintains one root `bun.lock`.
|
|
153
154
|
|
|
154
155
|
- `bun test`
|
|
155
|
-
- `bun run build` —
|
|
156
|
-
|
|
156
|
+
- `bun run build` — Compile the publishable package to `dist/` with tsdown.
|
|
157
|
+
The output contains ESM `.js` and `.d.ts` files. `prepublishOnly` runs this
|
|
158
|
+
command during publication.
|
|
157
159
|
- `bun run build:manifest -- --app <AppExecutable>`
|
|
158
160
|
- `bun run build:wasm -- --app <AppExecutable>`
|
|
159
161
|
- `bun run build:web`
|
|
@@ -161,18 +163,19 @@ workspace package directory; Bun maintains one root `bun.lock`.
|
|
|
161
163
|
- `bun run dev`
|
|
162
164
|
|
|
163
165
|
`build` produces the published library. `build:manifest`, `build:wasm`, and
|
|
164
|
-
`build:app` delegate manifest
|
|
165
|
-
and `build:app`
|
|
166
|
-
`--configuration debug` for local debug
|
|
167
|
-
|
|
166
|
+
`build:app` delegate manifest and WASI packaging to `@swifttui/build`.
|
|
167
|
+
`build:wasm` and `build:app` use `--configuration release` by default. Pass
|
|
168
|
+
`--configuration debug` for local debug wasm builds. The demo app pipeline
|
|
169
|
+
writes its artifacts to `dist-demo/`. Thus, they stay separate from the
|
|
168
170
|
published `dist/` library output.
|
|
169
171
|
|
|
170
172
|
The demo/app build flow is intentionally small:
|
|
171
173
|
|
|
172
|
-
1. `build:manifest`
|
|
173
|
-
2. `build:wasm` copies the app
|
|
174
|
-
|
|
175
|
-
artifact
|
|
174
|
+
1. `build:manifest` runs `swiftly run swift` and captures the Swift app output for `SWIFTTUI_MODE=manifest`.
|
|
175
|
+
2. `build:wasm` copies the app wasm artifact to
|
|
176
|
+
`dist-demo/assets/app.wasm`. The command makes sure that the browser
|
|
177
|
+
`WebAssembly` API accepts the artifact. Then it strips the artifact. It keeps
|
|
178
|
+
the stripped artifact only if the browser can parse it.
|
|
176
179
|
3. `build:web` bundles `index.html` and the browser entrypoint with Bun.
|
|
177
180
|
|
|
178
181
|
## License
|