InstallPrompt

The card that offers to install the app, and remembers being turned down.

Import it from rei-kit/pwa: import { InstallPrompt } from 'rei-kit/pwa'

Open InstallPrompt in the live documentation, where every prop below is a control you can change, in four materials and ten palettes.

Usage

<script setup lang="ts">
import { InstallPrompt } from 'rei-kit/pwa'
</script>

<template>
  <InstallPrompt
    storage-key="my-app-install"
    title="Install My app"
    body="Open it from your home screen, even offline."
    action="Install"
    later="Not now"
  />
</template>

Props

Props
Prop	Type	Required or default	What it is for
`storageKey`	`string`	yes	Where the dismissal is remembered. Namespace it: `hibi-install-nudge`.
`title`	`string`	yes
`body`	`string`	yes
`action`	`string`	yes	The install button. Not shown on iOS, which has no API to call.
`later`	`string`	yes
`iosTitle`	`string`	''	Shown instead of `title` where the user has to use the Share menu.
`iosBody`	`string`	''
`snoozeDays`	`number`	7

About rei-kit

rei-kit is an accessible Vue 3 and Tailwind CSS 4 component library: 106 components, themed by role rather than by colour on three independent axes — ten WCAG-checked palettes, four materials and light or dark, each switched with one attribute. Typed, tested, SSR-safe, no runtime dependencies, MIT.

pnpm add rei-kit · npm · GitHub