@synopackageland/ui 0.25.0 → 0.25.2

package/docs/layout-rules.md

@@ -30,7 +30,7 @@ These rules keep pages built from `@synopackageland/ui` consistent. The componen
 - In a dialog or a side `Sheet`, keep the default `direction="auto"`: as in DSM, the labels sit in a left column whenever the form is at least 400px wide (a 420–480px sheet) and stack above their controls only below that (a phone). Size the column with `Form label-width` (about 120px for short labels); a long label wraps inside it and stays level with its control's first line, whether that is a field, a select, a switch, a toggle group or a segment control.
 - Size a field by its content: number fields are 128px; text fields use `fieldWidth`; in a narrow row that stacks its label (a phone), `md` and `lg` fill the column. Put two short fields side by side rather than stretching one across the page.
 - A checkbox's text sits on the same line as its box. Do not apply `display: grid` to `label` in App CSS; `Checkbox` renders its own label.
-- For 2–4 mutually exclusive settings, use `RadioGroup` (vertical by default, `orientation="horizontal"` when labels fit). In a wizard step, `variant="card"` draws the options as choice cards with an optional `icon` each. A checkbox enables an independent option; a switch turns a feature on or off immediately. Keep the circular radio with a dot, square checkbox with a tick, and pill switch with a moving thumb.
+- For 2–4 mutually exclusive settings, use `RadioGroup` (vertical by default, `orientation="horizontal"` when labels fit). In a wizard step, `variant="card"` draws the options as choice cards with an optional `icon` each. The 2–4 count is a guide, not a limit: the cards wrap, but five or more short options (or longer ones, even three) read better as a vertical radio list. A checkbox enables an independent option; a switch turns a feature on or off immediately. Keep the circular radio with a dot, square checkbox with a tick, and pill switch with a moving thumb.
 - Reserve `SegmentControl` for toolbar view switching: its selected item is a primary-filled capsule. `variant="sheet"` and `SectionTabs` are navigation tabs. Do not use either as a form value selector.
 - Choices side by side are 34px apart (`--ui-choice-inline-gap`, DSM's Task Scheduler) and share one top whether checked or not. For a set of checkboxes use `CheckboxGroup` (`orientation="horizontal"` for a row, `v-model` an array of values), as `RadioGroup` for one choice; Checkboxes written one after another get the same gap. Do not add margins between them.
 - A password field has a show/hide toggle; `Input type="password"` adds it.

package/docs/mobile-native.md

@@ -42,9 +42,9 @@ the commit footer behave as before.
 | `--ui-radius-md` / `-lg` (and the 0.23.9 roles on them) | 4 / 6 | 12 / 14: md rounds the control, container and popover roles (fields, tool buttons, inset blocks, menus), lg the panel and nav roles |
 | `--ui-radius-dialog` / `-window` / `-sheet` | 8 / 8 / 12 | 24 |
 | Primary, danger and secondary buttons | capsule (action) or 4px (tool) | capsule; a primary's fill is accent step 10 (`#0075db`, 4.6:1 with white) |
-| Segmented control | accent pill on a framed track, equal columns | ink pill (`--ui-phone-ink`, `#1f2421`; dark `#e3e8e4`) on a frameless mist track; 6px sides; up to three segments stay equal columns but one whose label is wider than its share grows to it, so a label is not cut (four ellipsize as before) (`check:phone-layout` checks it) |
+| Segmented control | accent pill on a framed track, equal columns | a pill in the primary button's fill (accent step 10, `#0075db`, with the accent's contrast colour, white: 4.6:1, light and dark) on a frameless mist track; 6px sides; up to three segments stay equal columns but one whose label is wider than its share grows to it, so a label is not cut (four ellipsize as before) (`check:phone-layout` checks it) |
 | Phone bar | white with a hairline | the page's colour, no hairline, 17px bold title, round pressed tint |
-| Tab bar | full-width white row with a top rule | a floating white pill inset 16px, 8px above the bottom (`--ui-tab-bar-float`); the current tab is ink on a round pad |
+| Tab bar | full-width white row with a top rule | a floating white pill inset 16px, 8px above the bottom (`--ui-tab-bar-float`); the current tab's icon is white on a round pad in the primary's fill (accent step 10); a tab with a label and no icon takes accent step 10 on its label over the mist pad |
 | `--ui-text-muted` | 40% grey (2:1) | 80% (4.8:1 on the mist; dark 62%) |
 | Separators | `--ui-border-subtle` | `--ui-phone-separator` |
 
@@ -190,6 +190,17 @@ component rule overrides them.
   IconButton draw their own pressed state (`data-variant`), so they're
   skipped. A component that sets its own shadow or `active:` style also keeps
   its own.
+- Press feedback on a phone (`phone.css`, a coarse pointer in the mobile
+  presentation): a Button or an IconButton takes the `--ui-state-pressed`
+  layer over its own active colour and settles to `scale(0.98)` in 100ms
+  (`cubic-bezier(0.24, 1, 0.4, 1)`), springing back on release. The scale is
+  a transform, so nothing around the control moves. A ghost Button or
+  IconButton already fills with the layer and a link button fades, so neither
+  takes a second layer. A list row, a tab and a menu item keep the layer
+  alone: a row that shrank would pull away from its hairlines. A disabled
+  control takes nothing. Reduced motion and `data-ui-motion="off"` keep the
+  layer and drop the scale. A DSM window, a desktop page and a touch tablet
+  are unchanged.
 - Hover: every hand-written `:hover` rule in the theme sits inside
   `@media (hover: hover)`, so a tap leaves no stuck hover look. Tailwind's
   `hover:` utilities already do this.
@@ -468,7 +479,11 @@ contain`, a pinned footer and safe-area padding. The top corners use
   overrides that.
 
 `Dialog` on a phone (an app 640px or narrower) renders as a `BottomSheet`:
-`auto`, or `full` for `fullscreen` and for a form with more than 3 fields. The
+`auto`, or `full` for `fullscreen` and for a form with more than 3 fields.
+`presentation="modal"` keeps a centred window instead, with the phone's
+dialog corner and dim scrim, as tall as its content up to its `height` inside
+the safe area (only a longer body scrolls); `WizardDialog` uses it by default, as a DSM
+wizard opens, and `presentation="adaptive"` gives it the bottom sheet. The
 CSS-only dialog-as-sheet in `adaptive.css` is gone. `Sheet side="bottom"` is
 a `BottomSheet` everywhere; without `size` it fits its content. Left and right
 sheets are unchanged, and their footer keeps clear of the home indicator.

package/docs/release-checks.md

@@ -8,7 +8,7 @@ checks through the optional build-isolation wrapper.
 
 | Entry point | Default | Explicit full |
 | --- | --- | --- |
-| `npm run gates`, `scripts/gates.mjs` | Internal-content checks, build, lint, typecheck, unit tests, notices, isolated pack and tarball content audit | Adds Chromium and WebKit installation, responsive/adaptive/date-picker/JSON/host/switch/layout/InfoTip/motion/short-viewport/phone-layout/phone-bars (Chromium and WebKit)/focus-restore browser checks, Histoire build, exact-tarball registry consumer smoke |
+| `npm run gates`, `scripts/gates.mjs` | Internal-content checks, build, lint, typecheck, unit tests, notices, isolated pack and tarball content audit | Adds Chromium and WebKit installation, responsive/adaptive/date-picker/JSON/host/switch/layout/InfoTip/motion/short-viewport/phone-layout/phone-bars (Chromium and WebKit)/press/focus-restore browser checks, Histoire build, exact-tarball registry consumer smoke |
 | `pnpm check`, `check:fast` | Basic, with optional Docker host build isolation | `SPL_FULL_GATE=1` selects the same full plan |
 | `fast-ci.yml`, composite verify action | Basic | No automatic extended checks |
 | Disabled CI/release workflow templates | Basic, version/tag/ancestry checks, stage, pack and actual archive audit | No implicit browser or registry consumer smoke |

package/docs/wizard.md

@@ -57,15 +57,20 @@ const open = ref(false)
   does not stack its children with a gap. Several blocks go in one `Form`
   (fields one field gap apart) or a `<Space direction="column">`; a lone
   Callout, paragraph or card grid needs no wrapper.
-- **Choices.** A step's 2–4 options are choice cards:
+- **Choices.** Options that each need an icon and a line are choice cards:
   `<RadioGroup variant="card" orientation="horizontal" :options>`. Each card
   shows the option's `icon` in a tile, its label and one line, and keeps the
   radio dot; the whole card picks it and the chosen card takes the primary
   border and a soft fill. The cards share the row (180px at least) and wrap
-  in a narrow window.
+  in a narrow window. Cards usually suit 2–4 options; that is a guide, not a
+  limit, and nothing cuts a fifth. Five short options (symptoms, say) read
+  better as a vertical `RadioGroup` list, and long options do too even when
+  there are three. Pick by how the options read, not by their count.
 - **Types.** `welcome` offers only Start; `done` drops Back and Cancel, fills
-  the progress and turns the main action into Finish. The last step without
-  `next-step-key` turns it into Apply.
+  the progress and turns the main action into Finish; `result` ends the flow
+  with an outcome the app sets ([Result](#result)); `progress` shows work the
+  app runs ([Progress](#progress)). The last step without `next-step-key`
+  turns the main action into Apply.
 - **Main action.** `next-label`, `next-disabled` and `:show-next="false"` (a step
   that moves on by itself or through its own choices, such as a row of cards)
   change it for one step. `:show-back="false"` hides Back.
@@ -98,9 +103,12 @@ const open = ref(false)
 The `#footer` slot replaces the footer's buttons and receives `nextStep`,
 `previousStep`, `finish`, `cancel`, `canGoPrevious`, `isLastStep`, `busy` and
 `stepKey`. Events: `next-step`, `previous-step` (`{ from, to }`), `finished`,
-`cancel`. A step guard (`pre-enter-next-step`, `pre-enter-previous-step`)
-returning `false` keeps the step; the main action shows a spinner while it
-runs. The step list does not navigate, so a guard cannot be skipped.
+`cancel` and `navigation-error` ([Guards](#guards)). The step list does not
+navigate, so a guard cannot be skipped.
+
+`finished` means the user took Finish (or Apply); it does not mean the work
+succeeded. Read the outcome from your own state, and do not run the work again
+in a `finished` callback.
 
 A wizard fills the height its container gives it (`WizardDialog` and
 `<Dialog flush height="…">` give it one); on a page, set a height on its
@@ -117,6 +125,220 @@ there is no Back and nothing shifts. A welcome step offers Start alone; a done
 step offers Finish (and its own `#actions`). There is no Close in the footer:
 a `WizardDialog` closes from its header.
 
+## Result
+
+A `type="result"` step ends the flow with an outcome: `result-tone` is
+`success`, `warning`, `danger` or `neutral` (the default, which claims neither
+success nor failure). A partial import, a failed connection test or a scan
+that finished with warnings is a result, never a `done` step: `done` always
+shows the success mark and its burst.
+
+```vue
+<WizardStep
+  step-key="result"
+  type="result"
+  :result-tone="tone"
+  headline="Some items were not imported"
+  description="The imported items are kept; check why the others failed and try again"
+>
+  <FindingList :items="findings" />
+  <template #actions>
+    <Button variant="ghost" kind="tool" @click="startAgain">Check again</Button>
+  </template>
+</WizardStep>
+```
+
+- The step shows its tone's mark (a tick, a warning sign, a cross or an info
+  mark) on its colour, read as "Succeeded", "Warning", "Failed" or "Done". It
+  pops in once, with no ring and no burst for any tone.
+- Finish is the one main action, blue for every tone: a red mark does not
+  make the button red. Back and Cancel are gone; the header's close button and
+  the step's `#actions` stay. `next-label` renames Finish.
+- The guide marks the step with the outcome: a warning or a failure is not
+  drawn or read as completed. The steps before it read as completed: that says
+  the user passed them, not that the backend did each part.
+- A result step never moves on: `next-step-key` is ignored (with a warning
+  in development).
+- Map the outcome in the app: a rollback that worked can be `neutral`, a
+  partial or unknown rollback `warning`, a failed one `danger`.
+
+## Progress
+
+A `type="progress"` step shows work the app runs: a progress bar and a status
+line. The wizard only draws them; the app starts, watches and ends the work,
+and moves the wizard on (`v-model:active-step-key`) when the backend says the
+work ended.
+
+```vue
+<WizardStep
+  step-key="scanning"
+  type="progress"
+  headline="Checking"
+  :progress="total > 0
+    ? { mode: 'determinate', label: 'Items checked', value: checked, max: total, status: statusText }
+    : { mode: 'indeterminate', label: 'Getting status', status: statusText }"
+  stop-label="Stop watching"
+  @stop="stopWatching"
+/>
+```
+
+- `progress` is `{ mode: 'indeterminate', label, status? }` while the total is
+  unknown, or `{ mode: 'determinate', label, value, max, valueLabel?, status? }`.
+  Without it the bar is indeterminate and named by the headline. `status` is
+  read politely when it changes.
+- The bar is on its own tinted track (never grey) and has no stripes or
+  pattern; reduced motion stills it.
+- Next and Back are hidden unless the step sets `:show-next="true"` or
+  `:show-back="true"` (for work that only reads). Back never undoes work that
+  changed data.
+- `stop-label` adds a secondary button that emits `stop`; `stop-disabled`
+  disables it while the app waits for the backend. "Stop watching" only stops
+  the app looking; "Cancel task" is for a backend that can cancel, and the app
+  shows a cancelled result only once the backend confirms it.
+- There is no timeout, retry count or auto-advance: time passing is not a
+  failure. `lazy` only mounts the step's content; it starts and stops nothing.
+
+## Guards
+
+`pre-enter-next-step` and `pre-enter-previous-step` run before a move. A guard
+gets `{ from, direction, signal }` and returns:
+
+| Return | Effect |
+| --- | --- |
+| nothing | the move goes on as the step says |
+| `false` | the step stays |
+| `{ goTo: 'key' }` | the move goes to that step instead, this time only |
+
+```ts
+async function checkAgain({ signal }: WizardGuardContext): Promise<WizardGuardResult> {
+  const status = await api.status({ signal })
+  if (status.needsAccess) return { goTo: 'access' }
+  return status.ready ? undefined : false
+}
+```
+
+- The main action shows a spinner while a guard runs; presses meanwhile are
+  ignored, so the guard runs once.
+- A `goTo` is checked once the app's update has rendered, so a step the
+  guard mounts with `v-if` can be its target. It moves through the usual
+  `next-step` or `previous-step` event, `update:active-step-key` and focus.
+  The target's own guard does not run.
+- A `goTo` that names no registered step (`unknown-step`) or the step itself
+  (`same-step`) keeps the step and emits `navigation-error`. A guard that
+  throws or rejects keeps the step and emits `navigation-error` with
+  `guard-rejected`, without the error's text: show your own message.
+- `signal` aborts when the move no longer matters: the wizard left the step,
+  the app reset `active-step-key`, the `WizardDialog` closed (not while "Keep
+  editing" is asked) or the wizard unmounted. The spinner stops at once, and
+  a reply that comes later moves nothing and emits nothing. Pass `signal` to
+  your requests so they stop too.
+- A step key is not a permission. The target step and the backend still check
+  what the user may do.
+
+A guard written as `() => false | void` still works as before.
+
+## Recipes
+
+These use the API above; none needs anything new.
+
+### Branches the backend decides
+
+Steps need not all be known up front. A guard loads the branch, and a
+`next-step-key` function reads it; the wizard reads `next-step-key` after the
+guard. A step only some branches need can be mounted with `v-if`; it takes its
+place in document order.
+
+```vue
+<WizardStep step-key="inspect" headline="Check the target"
+  :pre-enter-next-step="loadBranch"
+  :next-step-key="() => branch.needsAccess ? 'access' : 'preview'" />
+<WizardStep v-if="branch.needsAccess" step-key="access" headline="Allow access" next-step-key="preview" />
+<WizardStep step-key="preview" headline="Confirm" />
+```
+
+Map each backend kind to a step key in the app, and treat an unknown kind as
+"cannot continue": never use a backend string as a key. The progress counts
+the mounted steps, so mount the path the user takes, not every branch; when
+the total is unknown, `progress-text` can say so.
+
+### Two equal ways on
+
+Keep or roll back, replace or keep: put the choices in one `RadioGroup` (cards
+when they need an icon and a line) and let one main action confirm the chosen
+one. Its `next-label` follows the choice; a choice never acts by itself, so
+moving through the options with the arrow keys does nothing else. The footer
+keeps one blue button. A choice that destroys data asks in a confirmation
+dialog first, whose confirm button is the only red one.
+
+```vue
+<WizardStep step-key="decision" headline="Choose what to do"
+  :show-back="false" :next-disabled="!decision"
+  :next-label="decision === 'rollback' ? 'Roll back' : 'Keep changes'"
+  :next-step-key="() => decision === 'rollback' ? 'working' : 'result'"
+  :pre-enter-next-step="confirmDecision">
+  <RadioGroup v-model="decision" variant="card" orientation="horizontal" :options="allowedDecisions" />
+</WizardStep>
+```
+
+Offer only the choices the backend allows: an interrupted run has no "keep".
+
+### Handing over to another wizard
+
+The parent opens one wizard at a time. To hand over (a diagnosis opening a
+fix): check what the source passes, stop the source's pending work, close the
+source, then set the target's props and open it. Do not rely on two
+`v-model:open` flips in one tick; mount the two exclusively (`v-if` on one
+state) so only one dialog holds the focus. A handover is not the source's
+Finish and not a rollback, and secrets do not travel in its props.
+
+```ts
+type WizardRequest = { kind: 'diagnose' } | { kind: 'setup'; intent: 'send' | 'receive' } | undefined
+```
+
+### Watching work
+
+For a [progress](#progress) step the app watches the backend:
+
+1. Watch only while the wizard is open on that step. Leaving, closing,
+   unmounting or reopening ends the round: clear its timer and abort its
+   request.
+2. One request at a time: schedule the next when the last ends, not with
+   `setInterval`. Follow the backend's retry-after; on errors back off slowly
+   (from about a second to 15 or 30 seconds). These are a schedule, not a
+   deadline.
+3. After every `await`, check that the round, the open state and the step are
+   still the same before writing anything.
+4. A network error shows "Status not up to date" with a way to check again and
+   keeps the last progress. Only the backend's own failed or interrupted state
+   leads to a failure result.
+5. Reopening reads the run from the backend and resumes; it does not apply
+   again.
+
+### Opening another DSM app
+
+When a step needs the user to finish something in another app, open it with
+the platform SDK's app launcher (it knows the app's verified ID; a package
+name is not an app ID), and always show the path in words as well, for a host
+that cannot open it. A secondary button opens it; the step's main action is
+"Check again", whose guard reads the state again. Coming back to the wizard
+only triggers a check: it is never a success by itself.
+
+```vue
+<WizardStep step-key="external" headline="Finish in the other app"
+  next-label="Check again" :pre-enter-next-step="checkAgain">
+  <p>When you are done there, come back and check again</p>
+  <Button variant="secondary" kind="tool" @click="openApp">Open the app</Button>
+  <p v-if="launchUnavailable">Open it from the DSM main menu</p>
+</WizardStep>
+```
+
+### Not provided
+
+The wizard has no backend step schema or runner, no timeout or retry settings
+for work, no two-primary footer, no card count option, no cross-wizard
+navigation and no launcher of its own. These stay with the app (or the
+platform SDK) on purpose.
+
 ## Modal
 
 `WizardDialog` opens like a DSM modal window, in the app (app-local, see
@@ -131,8 +353,16 @@ a `WizardDialog` closes from its header.
   step title) shows a ring only after a key, never after a click.
 
 These are `Dialog` props (`scrim="light"`, `:close-on-outside="false"`,
-`:header-divider="false"`), so a dialog of your own around a `Wizard` can
-open the same way.
+`:header-divider="false"`, `presentation="modal"`), so a dialog of your own
+around a `Wizard` can open the same way.
+
+On a phone `WizardDialog` stays a centred window, as a DSM wizard does: the
+phone's dialog corner, the phone's dim scrim, the same fixed header and
+footer. It is as tall as its step, up to the wizard's height inside the
+phone's safe area; only a longer step scrolls, between the header and the
+footer. `presentation="adaptive"` keeps the bottom sheet instead, for an app
+that wants its earlier phone look; other dialogs are bottom sheets on a phone
+as before. The "Discard changes?" question is always a centred window.
 
 ## Leaving with input
 
@@ -164,6 +394,7 @@ in every built-in locale.
 - **Motion.** A step fades in from 10px on the side it comes from and its
   title fades in; the progress segments ease to their new state; the done mark
   pops with a ring and a short burst. Reduced motion turns all of it off.
-- **Size.** In a phone-width window the dialog is a bottom sheet.
+- **Size.** In a phone-width window the dialog stays a centred window with a
+  margin around it; `presentation="adaptive"` makes it a bottom sheet.
 - **Theme.** Colours are the theme's roles, so the wizard follows the accent
   and the dark theme.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synopackageland/ui",
-  "version": "0.25.0",
+  "version": "0.25.2",
   "description": "Shared Vue 3 UI component library with a DSM 7 inspired application theme",
   "license": "MIT",
   "type": "module",
@@ -79,34 +79,6 @@
     "@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"
   },
@@ -117,63 +89,5 @@
       "reka-ui": "2.11.0"
     }
   },
-  "homepage": "https://www.varvis.me/docs/",
-  "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: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: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",
-    "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"
-  }
-}
+  "homepage": "https://www.varvis.me/docs/"
+}