Nuxt Smart App Banner [nuxt ^3.0.0]

Based on\ 'jQuery Smart Banner' by Arnold Daniels arnold@jasny.net https://github.com/jasny/jquery.smartbanner ,\ 'Smart App Banner' by Vitaly Glibin glibin.v@gmail.com https://github.com/kudago/smart-app-banner

Smart App Banner for Nuxt

• ✨  Release Notes

Features

• Smart App Banner for Anroid/IOS
• Nuxt 3 compatible
• Support native IOS banner
• Callbacks available

Quick Setup

1. Add nuxt-smart-app-banner dependency to your project

# Using pnpm
pnpm add -D nuxt-smart-app-banner

# Using yarn
yarn add --dev nuxt-smart-app-banner

# Using npm
npm install --save-dev nuxt-smart-app-banner

1. Add nuxt-smart-app-banner to the modules section of nuxt.config.ts and provide module config

import { defineNuxtConfig } from 'nuxt/config'

export default defineNuxtConfig({
    modules: ['nuxt-smart-app-banner'],
    "nuxt-smart-app-banner": {
      bannerOptions: {
        title: "Title",
        androidAppId: "",
        icon: "https://icon-library.com/images/play-store-icon/play-store-icon-9.jpg",
        iosAppId: "",
        appStoreLanguage: "us",
      }
    }
})

1. Place smart banner component into desired component, page or layout\ ⚠️ Note: if you set overrideComponentNameWith, use custom name instead of SmartAppBanner ⚠️

   <template>
   <div>
   🔥<SmartAppBanner/>🔥
    <NuxtWelcome />
   </div>
   </template>

2. Using emits(callbacks) `js

   <template>
   Nuxt module playground!
   <SmartAppBanner @on-dismiss="handleOnDismiss" // callback fired on clicking close button @on-install="handleOnInstall" // callback fired on clicking install button @on-not-shown="handleOnNotShown" // callback fired on banner not shown because it was previously either clicked or dismissed @on-shown="handleOnShown" // callback fired on banner shown /> </template>

That's it! You can now use Nuxt Smart App Banner in your Nuxt app ✨

## Config overview
```js
export interface ModuleOptions {
  overrideComponentNameWith?: string; // Use to override default component name
  bannerOptions: {
    useNativeIosBannerForSafari: boolean; // use native ios banner if available instead of custom (default: true)
    daysHidden: number;  // days to banner appear again after close button is clicked (defaults to 15)
    daysReminder: number;  // days to banner appear again after "VIEW" button is clicked (defaults to 90)
    appStoreLanguage: string; // ios app store language
    title: string;  // title text shown on banner
    author: string;  // author text shown on banner
    button: string;  // button text shown on banner
    androidAppId: string;  // android app id
    iosAppId: string; // ios app id
    store: {
        ios: string; // Instore text shown on banner for ios
        android: string; // Instore text shown on banner for android
    },
    price: {
        ios: string; // Price text shown on banner for ios
        android: string; // Price text shown on banner for ios
    },
    icons?: {
        ios: string; // Url for app icon shown on banner for ios
        android: string; // Url for app icon shown on banner for android
    },
    icon: string; // fallback icon url for all platforms
    theme?: SmartAppBannerTheme; // put platform type here to force single theme on all device
    force?: SmartAppBannerPlatform, // put platform type here for force banner platform for debug 
    }
}

Development

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

..............................................................................................

0.2.0

❗Breaking changes

• removed windows mobile support
• module config changed

Features

• added useNativeIosBannerForSafari config prop (default:true), if set use native ios banner when available
• added icons config prop used for separate icons by platform
• added onInstall, onDismiss, onShown, onNotShown callbacks
• added tests, lint
• optimise bundle size
• fix bugs

..............................................................................................

0.1.0

Inital release