@synopackageland/ui 0.25.15 → 0.25.16

package/dist/lib/nativeShell.d.ts

@@ -1,8 +1,40 @@
-/** Whether this page runs in the phone app and may go back to its App list. */
-export declare function canCloseToShell(): boolean;
 /**
- * Asks the phone app to go back to its App list. Call it from a tap: the app
+ * The Package Land launcher (the "shell") as seen from an App page in it. Its
+ * Home request, `{ v: 1, type: 'close' }`, takes the user back to the
+ * launcher's home. Two shells offer it:
+ *
+ * - The phone app injects `window.SynoPkgNative` (SynoPkgNative v1) into a
+ *   registered App's main frame only; its optional `features` lists the
+ *   requests it understands beyond the v1 baseline, `close` among them. The
+ *   request goes through the bridge's `post`.
+ * - The browser launcher opens each App in a same-origin frame named
+ *   `synopkg-shell:1:<features>` (comma-separated, e.g. `synopkg-shell:1:close`).
+ *   The request is posted to the parent window at this page's own origin.
+ *
+ * In a plain browser tab, a DSM window or any other frame there is no shell
+ * and nothing here offers anything. The shell honors a request only right
+ * after a tap, so call it from a click.
+ */
+type CloseMessage = {
+    v: 1;
+    type: 'close';
+};
+type ShellBridge = {
+    protocol: number;
+    features?: readonly unknown[];
+    post(message: CloseMessage): void;
+};
+type ShellWindow = Pick<Window, 'name' | 'parent' | 'top' | 'location'> & {
+    SynoPkgNative?: Partial<ShellBridge>;
+};
+/** The name the browser launcher gives an App's frame, and the features it lists. */
+export declare const SHELL_FRAME_PREFIX = "synopkg-shell:1:";
+/** Whether this page runs in the launcher (phone app or browser) and may go back to its home. */
+export declare function canCloseToShell(view?: ShellWindow | undefined): boolean;
+/**
+ * Asks the launcher to go back to its home. Call it from a tap: the launcher
  * ignores a request without a recent user gesture. Returns false when there is
- * no phone app to ask.
+ * no launcher to ask.
  */
-export declare function closeToShell(): boolean;
+export declare function closeToShell(view?: ShellWindow | undefined): boolean;
+export {};

package/dist/reka-runtime.json

@@ -3,7 +3,7 @@
   "version": "2.11.0",
   "delivery": "bundled-patched-esm",
   "patchManifestSha256": "9c5b9c9a162fa584b4695a683368a4484b3ac6e70177fd063b77aa618c051627",
-  "bundleSha256": "abe34cf2578a7517d653b2d5efb3338ecce0562d845477aefc6158a18df763b1",
+  "bundleSha256": "0613c4649ba3a597c7c6d972e93541034089c6176d953a0a7d2426dc0fe6165a",
   "sourceHashes": {
     "shared/useBodyScrollLock.js": "287bfb604318c4202769e4b5191896eaf0e52a952e1de898967cbe09467fcfda",
     "DismissableLayer/DismissableLayer.js": "3c8d248f0a32e01f89ca1f6202b1bb691bf5d0e4012a92535e161c35e69cdc32",

package/docs/adaptive-layout.md

@@ -141,16 +141,46 @@ state keys are copied through). The Android back button or the iOS edge swipe
 calls `close` for the top surface only; closing by code removes the entry.
 Pass `enabled: false` where the surface is a popover or inside a DSM window.
 
-Inside the Package Land phone app, a root page also gets Back to the App list.
-The app's bridge (`window.SynoPkgNative`, protocol 1) lists `close` in its
-`features`; AppLayout then leads the phone bar with the shared back arrow, and
-a tap posts `{ v: 1, type: 'close' }`, which the app honors only right after a
-tap. A browser, a sub-page (which has its own Back) and anything wider than a
-phone never show it. When the page hides the bar (`phone-bar-title="none"`
-without a menu), the first `PageToolbar` or `SectionTabs` row on the page holds
-the button at its start, so it costs no row; with no such row the bar is drawn
-for it. The arrow is `app-layout/back-arrow.json`, a byte copy of the phone
-app's drawing; `tests/ShellBack.test.ts` pins its SHA-256, as the phone app
+Inside the Package Land launcher, every page leads with Home, sub-pages
+included: Home goes back to the launcher's home, as the launcher's own bars do.
+Stepping back is the system Back's job (Android's back button, the browser's
+back or swipe). The page finds the launcher in one of two ways:
+
+- **Phone app.** Its bridge (`window.SynoPkgNative`, protocol 1) lists `close`
+  in its `features`. A tap posts `{ v: 1, type: 'close' }` through the bridge.
+- **Browser launcher.** It opens the App in a same-origin frame named
+  `synopkg-shell:1:close` (`SHELL_FRAME_PREFIX` followed by its features,
+  comma-separated). A tap posts the same message to the parent window, at the
+  page's own origin.
+
+Either launcher honors the request only right after a tap. A plain browser
+tab, a DSM window and anything wider than a phone never show Home; there a
+sub-page keeps its Back arrow.
+
+In the launcher, a sub-page has no Back button, so each one is a history entry
+of the App (`useBackDismiss`):
+- the layout's `back`, or a `PageHeader` with `back`, takes one entry while it
+  is shown;
+- a `PushTransition` page already owns one.
+
+The system Back pops that entry and runs the sub-page's back (`back`, or
+`pop`). The launcher goes through an App's own entries before it leaves the
+App: in the browser, the frame's entries come first in the tab's history; on
+Android, the WebView's history comes first. A sub-page the App closes itself
+takes its entry back off.
+
+An App whose sub-pages are router addresses still works: the Back pops the
+layout's entry, and the App's back handler then goes back through the
+router.
+
+AppLayout leads the phone bar with a 44px home icon; on a sub-page it comes
+before the sub-page's title. When a root page hides the
+bar (`phone-bar-title="none"` without a menu), the first `PageToolbar` or
+`SectionTabs` row on the page holds the button at its start, so it costs no
+row. With no such row the bar is drawn for it.
+
+A sub-page's Back draws `app-layout/back-arrow.json`, a byte copy of the phone
+app's drawing. `tests/ShellBack.test.ts` pins its SHA-256, as the phone app
 does, so change both copies together.
 
 `node scripts/check-keyboard.mjs [out-dir]` (after `pnpm build`) checks all of

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synopackageland/ui",
-  "version": "0.25.15",
+  "version": "0.25.16",
   "description": "Shared Vue 3 UI component library with a DSM 7 inspired application theme",
   "license": "MIT",
   "type": "module",
@@ -60,6 +60,67 @@
     "./themes/dsm7-embedded-reset.css": "./dist/themes/dsm7-embedded-reset.css",
     "./themes/dsm7-embedded-theme.css": "./dist/themes/dsm7-embedded-theme.css"
   },
+  "scripts": {
+    "check:docs": "node --test scripts/check-doc-versions.test.mjs && node scripts/check-doc-versions.mjs",
+    "dev": "vite build --watch",
+    "build": "vite build && vite build --mode json && vite build --mode rich-text && vite build --mode grid && vite build --mode cli && vite build --mode preview && vite build --mode embedded && node scripts/postbuild.mjs",
+    "lint": "eslint .",
+    "typecheck": "vue-tsc --noEmit -p tsconfig.json",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:changed": "echo \"test:changed skips the tests the changes since ${SYNOPKGLAND_GATE_BASE:-origin/master} do not reach (vitest --changed); pnpm check runs them all\" && vitest run --changed ${SYNOPKGLAND_GATE_BASE:-origin/master}",
+    "story": "histoire dev",
+    "story:build": "histoire build",
+    "check:host": "node scripts/dsm-host-shots.mjs",
+    "check:switch": "node scripts/check-switch.mjs",
+    "check:tabs": "node scripts/check-tabs.mjs",
+    "check:mobile": "node scripts/check-mobile-overflow.mjs",
+    "check:ui-patch": "node scripts/check-ui-patch.mjs",
+    "check:narrow": "node scripts/check-narrow-controls.mjs",
+    "check:drawer-form": "node scripts/check-drawer-form.mjs",
+    "check:responsive": "node scripts/check-responsive.mjs",
+    "check:adaptive": "node scripts/check-adaptive.mjs",
+    "check:sidebar-focus": "node scripts/check-sidebar-focus.mjs",
+    "check:json-render": "node scripts/check-json-render.mjs",
+    "check:motion": "node scripts/check-motion.mjs",
+    "check:topology": "node scripts/check-topology.mjs",
+    "check:wizard": "node scripts/check-wizard.mjs",
+    "check:press": "node scripts/check-press.mjs",
+    "check:edges": "node scripts/check-edges.mjs",
+    "check:data-grid": "node scripts/check-data-grid.mjs",
+    "check:truncation": "node scripts/check-truncation.mjs",
+    "check:link": "node scripts/check-link.mjs",
+    "check:text-select": "node scripts/check-text-select.mjs",
+    "check:date-picker": "node scripts/check-date-picker.mjs",
+    "check:full-page": "node scripts/check-full-page.mjs",
+    "check:short-viewport": "node scripts/check-short-viewport.mjs",
+    "check:phone-layout": "node scripts/check-phone-layout.mjs",
+    "check:phone-bars": "node scripts/check-phone-bars.mjs",
+    "check:phone-fill": "node scripts/check-phone-fill.mjs",
+    "check:text-zoom": "node scripts/check-text-zoom.mjs",
+    "check:focus-restore": "node scripts/check-focus-restore.mjs",
+    "check:detail-surface": "node scripts/check-detail-surface.mjs",
+    "check:internal": "node --test scripts/check-internal-content.test.mjs scripts/check-npm-metadata.test.mjs && node scripts/check-internal-content.mjs --repo .",
+    "check:npm-metadata": "node scripts/check-npm-metadata.mjs",
+    "check:package": "node scripts/check-package-content.mjs",
+    "trace:restyle": "node scripts/trace-restyle.mjs",
+    "check:public-api-consumer": "node scripts/check-public-api-consumer.mjs",
+    "notices:update": "node scripts/third-party-notices.mjs --write",
+    "notices:check": "node scripts/third-party-notices.mjs --check",
+    "check": "bash scripts/docker-check.sh \"npm run gates\"",
+    "check:fast": "bash scripts/docker-check.sh \"npm run gates\"",
+    "check:local-browser": "node scripts/app-local-browser.mjs",
+    "check:infotip": "node scripts/check-infotip.mjs",
+    "release:stage": "node scripts/stage-release.mjs",
+    "check:polish": "bash scripts/docker-check.sh --build --out .polish-shots 'node scripts/check-polish.mjs'",
+    "check:acceptance": "node scripts/check-acceptance.mjs",
+    "check:palette": "node scripts/check-palette.mjs",
+    "gates": "node scripts/gates.mjs",
+    "gates:full": "node scripts/gates.mjs --full",
+    "check:layout": "node scripts/check-layout.mjs",
+    "release:smoke": "node scripts/release-smoke.mjs",
+    "check:browser-install": "playwright install chromium webkit"
+  },
   "peerDependencies": {
     "vue": "^3.5.0"
   },
@@ -79,9 +140,44 @@
     "@tiptap/vue-3": "3.32.1",
     "zod": "^4.6.5"
   },
+  "devDependencies": {
+    "@eslint/js": "10.0.1",
+    "@histoire/plugin-vue": "1.0.0-beta.1",
+    "@tailwindcss/vite": "4.3.3",
+    "@tanstack/vue-virtual": "3.13.39",
+    "@vitejs/plugin-vue": "6.0.9",
+    "@vue/test-utils": "2.5.1",
+    "@vueuse/core": "14.4.0",
+    "eslint": "10.11.0",
+    "eslint-plugin-vue": "10.11.1",
+    "flexsearch": "0.8.212",
+    "globals": "17.12.0",
+    "histoire": "1.0.0-beta.1",
+    "jsdom": "30.1.1",
+    "playwright": "1.58.2",
+    "reka-ui": "2.11.0",
+    "tailwindcss": "4.3.3",
+    "typescript": "5.9.3",
+    "typescript-eslint": "8.71.0",
+    "vite": "7.3.6",
+    "vite-plugin-dts": "5.1.1",
+    "vitest": "5.0.2",
+    "vscode-oniguruma": "2.0.1",
+    "vscode-textmate": "9.3.2",
+    "vue": "3.5.43",
+    "vue-eslint-parser": "10.4.1",
+    "vue-tsc": "3.3.11"
+  },
   "engines": {
     "node": ">=20"
   },
+  "packageManager": "pnpm@10.33.2",
+  "pnpm": {
+    "onlyBuiltDependencies": [
+      "esbuild",
+      "vue-demi"
+    ]
+  },
   "config": {
     "bundledRuntime": {
       "@tanstack/vue-virtual": "3.13.39",