@pablozaiden/webapp 0.5.6 → 0.5.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/docs/getting-started.md
CHANGED
|
@@ -41,7 +41,7 @@ const app = createWebAppServer({
|
|
|
41
41
|
await app.runFromCli();
|
|
42
42
|
```
|
|
43
43
|
|
|
44
|
-
The framework generates the HTML document, React mount point, viewport metadata, PWA manifest, default SVG icons, and the theme prepaint script. By default it uses `./web/main.tsx` relative to the Bun entry file as the frontend entrypoint, so apps only need to create that file. Override document defaults only when the app needs different metadata:
|
|
44
|
+
The framework generates the HTML document, React mount point, fixed-scale viewport metadata, PWA manifest, default SVG icons, and the theme prepaint script. On iPhone, iPad, and other mobile browsers that honor viewport scaling tokens, the generated viewport prevents pinch-to-zoom while preserving normal scrolling; clients that ignore those tokens are unaffected. By default it uses `./web/main.tsx` relative to the Bun entry file as the frontend entrypoint, so apps only need to create that file. Override document defaults only when the app needs different metadata:
|
|
45
45
|
|
|
46
46
|
```ts
|
|
47
47
|
createWebAppServer({
|
|
@@ -67,6 +67,8 @@ createWebAppServer({
|
|
|
67
67
|
});
|
|
68
68
|
```
|
|
69
69
|
|
|
70
|
+
Do not create an app-owned `index.html` or add global touch handlers to control zoom. The framework owns the viewport policy so the same metadata is emitted for development, compiled clients, and installed PWAs without disabling scrolling.
|
|
71
|
+
|
|
70
72
|
PWA support is on by default, with generated initials icons unless the app provides `web.icons`. Icon paths are relative to the app package root; production apps should provide at least 192x192 and 512x512 PNG manifest icons plus an Apple touch icon. Set `web.pwa: false` only for apps that deliberately should not be installable. The standard theme preference key is `webapp.theme`; apps should not use app-specific theme storage keys.
|
|
71
73
|
|
|
72
74
|
Apps should stay one app and one binary. Use subcommands for different modes:
|
package/docs/server.md
CHANGED
|
@@ -96,7 +96,9 @@ Built-in endpoints include:
|
|
|
96
96
|
|
|
97
97
|
## Framework-owned web document and PWA metadata
|
|
98
98
|
|
|
99
|
-
`createWebAppServer` owns the browser document. Apps do not provide `index.html`; the framework generates a Bun `HTMLBundle` internally so Bun hot reload and asset rewriting keep working. By default the frontend entrypoint is `./web/main.tsx` relative to the Bun entry file.
|
|
99
|
+
`createWebAppServer` owns the browser document. Apps do not provide `index.html`; the framework generates a Bun `HTMLBundle` internally so Bun hot reload and asset rewriting keep working. By default the frontend entrypoint is `./web/main.tsx` relative to the Bun entry file. The generated viewport keeps the app at `initial-scale=1` with `maximum-scale=1` and `user-scalable=no`; clients and mobile browsers that honor those viewport scaling tokens, including iPhone and iPad, cannot change the app scale with pinch-to-zoom while normal scrolling remains enabled. Clients that ignore the tokens are unaffected.
|
|
100
|
+
|
|
101
|
+
Do not replace this behavior with global touch event handlers, `preventDefault()` calls, or `touch-action: none`: those approaches can disable scrolling and other touch interactions. Applications should keep the document framework-owned rather than adding an app-owned `index.html`.
|
|
100
102
|
|
|
101
103
|
```ts
|
|
102
104
|
createWebAppServer({
|
package/package.json
CHANGED
|
@@ -510,7 +510,7 @@ function generatedHtml(
|
|
|
510
510
|
<html lang="${escapeAttribute(web.lang ?? "en")}">
|
|
511
511
|
<head>
|
|
512
512
|
<meta charset="utf-8" />
|
|
513
|
-
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
513
|
+
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover" />
|
|
514
514
|
${themeMetaTag}\
|
|
515
515
|
${manifestTags} <title>${title}</title>
|
|
516
516
|
<script>${themeBootScript(themeColor)}</script>
|