,
+ name?: string,
+ codeType?: CodeType,
+ addCss = false,
+) {
+ if (data.generateFWComponent) {
+ const { behavior, warnsUser, periodicSWUpdates, typescript } = data
+ generators.push(['prompt-component', () => {
+ fwComponentData.codeType = codeType ?? (typescript ? 'tsx' : 'jsx')
+ let template: string
+ if (behavior === 'autoUpdate') {
+ template = periodicSWUpdates ? 'sfc-warn-updates' : 'sfc-warn'
+ }
+ else {
+ template = warnsUser
+ ? (periodicSWUpdates ? 'sfc-prompt-warn-updates' : 'sfc-prompt-warn')
+ : (periodicSWUpdates ? 'sfc-prompt-updates' : 'sfc-prompt')
+ }
+
+ const useName = name ?? `PWAPrompt.${typescript ? 't' : 'j'}sx`
+
+ if (addCss) {
+ fwComponentData.code = `
+/* ${useName} */
+${assetsMap.get(template)}
+${assetsMap.get('sfc-style')}
+`
+ }
+ else {
+ fwComponentData.code = `
+/* ${useName} */
+${assetsMap.get(template)}
+`
+ }
+
+ if (data.typescript) {
+ switch (data.framework) {
+ case 'vue':
+ fwComponentData.code = fwComponentData.code!.replace('
+
+{#if toast}
+
+
+
+ New content available, click on reload button to update.
+
+
+
+
+
+{/if}
diff --git a/docs/src/assets/svelte-sfc-prompt-warn-updates.txt b/docs/src/assets/svelte-sfc-prompt-warn-updates.txt
new file mode 100644
index 00000000..9729c5e5
--- /dev/null
+++ b/docs/src/assets/svelte-sfc-prompt-warn-updates.txt
@@ -0,0 +1,53 @@
+
+
+{#if toast}
+
+
+ {#if $offlineReady}
+
+ App ready to work offline.
+
+ {:else}
+
+ New content available, click on reload button to update.
+
+ {/if}
+
+ {#if $needRefresh}
+
+ {/if}
+
+
+{/if}
diff --git a/docs/src/assets/svelte-sfc-prompt-warn.txt b/docs/src/assets/svelte-sfc-prompt-warn.txt
new file mode 100644
index 00000000..6bb0cedd
--- /dev/null
+++ b/docs/src/assets/svelte-sfc-prompt-warn.txt
@@ -0,0 +1,50 @@
+
+
+{#if toast}
+
+
+ {#if $offlineReady}
+
+ App ready to work offline.
+
+ {:else}
+
+ New content available, click on reload button to update.
+
+ {/if}
+
+ {#if $needRefresh}
+
+ {/if}
+
+
+{/if}
diff --git a/docs/src/assets/svelte-sfc-prompt.txt b/docs/src/assets/svelte-sfc-prompt.txt
new file mode 100644
index 00000000..d488fa7a
--- /dev/null
+++ b/docs/src/assets/svelte-sfc-prompt.txt
@@ -0,0 +1,40 @@
+
+
+{#if toast}
+
+
+
+ New content available, click on reload button to update.
+
+
+
+
+
+{/if}
diff --git a/docs/src/assets/svelte-sfc-style.txt b/docs/src/assets/svelte-sfc-style.txt
new file mode 100644
index 00000000..9942650d
--- /dev/null
+++ b/docs/src/assets/svelte-sfc-style.txt
@@ -0,0 +1,25 @@
+
diff --git a/docs/src/assets/svelte-sfc-warn-updates.txt b/docs/src/assets/svelte-sfc-warn-updates.txt
new file mode 100644
index 00000000..ba351715
--- /dev/null
+++ b/docs/src/assets/svelte-sfc-warn-updates.txt
@@ -0,0 +1,39 @@
+
+
+{#if toast}
+
+
+
+ App ready to work offline.
+
+
+
+
+{/if}
diff --git a/docs/src/assets/svelte-sfc-warn.txt b/docs/src/assets/svelte-sfc-warn.txt
new file mode 100644
index 00000000..e6c88255
--- /dev/null
+++ b/docs/src/assets/svelte-sfc-warn.txt
@@ -0,0 +1,36 @@
+
+
+{#if toast}
+
+
+
+ App ready to work offline.
+
+
+
+
+{/if}
diff --git a/docs/src/assets/vue-sfc-prompt-updates.txt b/docs/src/assets/vue-sfc-prompt-updates.txt
new file mode 100644
index 00000000..03744558
--- /dev/null
+++ b/docs/src/assets/vue-sfc-prompt-updates.txt
@@ -0,0 +1,41 @@
+
+
+
+
+
+
+ New content available, click on reload button to update.
+
+
+
+
+
+
diff --git a/docs/src/assets/vue-sfc-prompt-warn-updates.txt b/docs/src/assets/vue-sfc-prompt-warn-updates.txt
new file mode 100644
index 00000000..4806e153
--- /dev/null
+++ b/docs/src/assets/vue-sfc-prompt-warn-updates.txt
@@ -0,0 +1,45 @@
+
+
+
+
+
+
+ App ready to work offline.
+
+
+ New content available, click on reload button to update.
+
+
+
+
+
+
diff --git a/docs/src/assets/vue-sfc-prompt-warn.txt b/docs/src/assets/vue-sfc-prompt-warn.txt
new file mode 100644
index 00000000..4a206975
--- /dev/null
+++ b/docs/src/assets/vue-sfc-prompt-warn.txt
@@ -0,0 +1,42 @@
+
+
+
+
+
+
+ App ready to work offline.
+
+
+ New content available, click on reload button to update.
+
+
+
+
+
+
diff --git a/docs/src/assets/vue-sfc-prompt.txt b/docs/src/assets/vue-sfc-prompt.txt
new file mode 100644
index 00000000..ca39fd5a
--- /dev/null
+++ b/docs/src/assets/vue-sfc-prompt.txt
@@ -0,0 +1,38 @@
+
+
+
+
+
+
+ New content available, click on reload button to update.
+
+
+
+
+
+
diff --git a/docs/src/assets/vue-sfc-style.txt b/docs/src/assets/vue-sfc-style.txt
new file mode 100644
index 00000000..1be9e1f0
--- /dev/null
+++ b/docs/src/assets/vue-sfc-style.txt
@@ -0,0 +1,24 @@
+
diff --git a/docs/src/assets/vue-sfc-warn-updates.txt b/docs/src/assets/vue-sfc-warn-updates.txt
new file mode 100644
index 00000000..c4e6428e
--- /dev/null
+++ b/docs/src/assets/vue-sfc-warn-updates.txt
@@ -0,0 +1,38 @@
+
+
+
+
+
+
+ App ready to work offline.
+
+
+
+
+
diff --git a/docs/src/assets/vue-sfc-warn.txt b/docs/src/assets/vue-sfc-warn.txt
new file mode 100644
index 00000000..caa80a9c
--- /dev/null
+++ b/docs/src/assets/vue-sfc-warn.txt
@@ -0,0 +1,35 @@
+
+
+
+
+
+
+ App ready to work offline.
+
+
+
+
+
diff --git a/docs/vite.config.ts b/docs/vite.config.ts
index 188bc66b..8213a62e 100644
--- a/docs/vite.config.ts
+++ b/docs/vite.config.ts
@@ -1,6 +1,6 @@
import { defineConfig } from 'vite'
import Components from 'unplugin-vue-components/vite'
-import { presetAttributify, presetUno } from 'unocss'
+import { presetAttributify, presetIcons, presetUno } from 'unocss'
import Unocss from 'unocss/vite'
import { VitePWA } from '../dist'
import NavbarFix from './plugins/navbar'
@@ -42,7 +42,29 @@ export default defineConfig({
// https://github.com/unocss/unocss
Unocss({
- presets: [presetUno(), presetAttributify()],
+ theme: {
+ breakpoints: {
+ 'xs': '468px',
+ 'sm': '640px',
+ 'md': '768px',
+ 'lg': '1024px',
+ 'xl': '1280px',
+ '2xl': '1536px',
+ },
+ },
+ shortcuts: [
+ { 'pb-input': 'grid grid-cols-[150px_1fr] gap-x-1rem items-baseline lt-sm:grid-cols-[1fr]' },
+ { 'pb-error': 'animate-shake-x animate-count-1 animate-delay-0.5s animate-duration-1s' },
+ { 'pb-input-enter': 'animate-zoom-in animate-count-1 animate-duration-0.5s' },
+ { 'pb-input-leave': 'animate-zoom-out animate-count-1 animate-duration-0.3s' },
+ { 'pb-errors-enter': 'animate-zoom-in animate-count-1 animate-duration-0.5s' },
+ { 'pb-errors-leave': 'animate-zoom-out animate-count-1 animate-duration-0.3s' },
+ ],
+ presets: [
+ presetIcons(),
+ presetUno(),
+ presetAttributify(),
+ ],
}),
// https://github.com/antfu/vite-plugin-pwa
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f06a0c88..a8026c08 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -61,6 +61,7 @@ importers:
docs:
specifiers:
+ '@iconify-json/line-md': ^1.1.13
'@types/fs-extra': ^9.0.13
'@vitejs/plugin-vue': ^2.3.3
'@vueuse/core': ^8.7.5
@@ -83,6 +84,7 @@ importers:
'@vueuse/shared': 8.7.5_vue@3.2.37
vue: 3.2.37
devDependencies:
+ '@iconify-json/line-md': 1.1.13
'@types/fs-extra': 9.0.13
'@vitejs/plugin-vue': 2.3.3_vite@2.9.13+vue@3.2.37
esbuild-register: 3.3.3
@@ -2318,6 +2320,12 @@ packages:
resolution: {integrity: sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==}
dev: true
+ /@iconify-json/line-md/1.1.13:
+ resolution: {integrity: sha512-LEyIQBAb4wdSnWayI+RuX9aIDZcpnlak4Zz9sBUR59u7Tcz7aVQcNpIzlS1YbZlufWgh84cs+0F9PfNYOacoZg==}
+ dependencies:
+ '@iconify/types': 1.1.0
+ dev: true
+
/@iconify/types/1.1.0:
resolution: {integrity: sha512-Jh0llaK2LRXQoYsorIH8maClebsnzTcve+7U3rQUSnC11X4jtPnFuyatqFLvMxZ8MLG8dB4zfHsbPfuvxluONw==}
dev: true