0.9.7 • Published 4 years ago
@benjibuiltit/pwainstall v0.9.7
pwa-install
pwa-install is a web component from the PWABuilder team that brings an awesome "install" experience to your Progressive Web App!
Built with lit-element
What does it look like?
Using this component
Install
There are two ways to use this component. For simple projects or just to get started fast, we recommend using the component by script tag. If your project is using npm then we recommend using the npm package.
Script tag
- Put this script tag in the head of your index.html:
<script
type="module"
src="https://cdn.jsdelivr.net/npm/@pwabuilder/pwainstall"
></script>NPM
- Run
npm install @pwabuilder/pwainstall - import with
import '@pwabuilder/pwainstall
Then you can use the element <pwa-install></pwa-install> anywhere in your template, JSX, html etc. An example of using this component can be found here: https://glitch.com/~pwainstall
API
Properties
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
showopen | showopen | Will always show install button | boolean | false |
manifestpath | manifestpath | path to your web manifest | string | manifest.json |
featuresheader | featuresheader | Controls the text of the features header | string | Key Features |
descriptionheader | descriptionheader | Controls the text of the description header | string | Description |
Methods
| name | Description |
|---|---|
openPrompt() | Opens the install modal |
CSS Variables
We recommend using our CSS variables to easliy tweak the style of this component to fit your project. Here are our current supported CSS variables.
| name | Description |
|---|---|
--install-button-color | Changes the color of the install button |
--modal-z-index | Changes the z-index of the install modal |