@fingerru/vue 1.0.0-next.4 → 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Fingprint
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,25 +1,22 @@
 # @fingerru/vue
 
-Vue 3 SDK для идентификации посетителей сайта.
+Vue 3 SDK для получения идентификатора посетителя сайта.
 
 ## Установка
 
 ```bash
-npm i @fingerru/vue @fingerru/agent
+npm i @fingerru/vue
 # or
-yarn add @fingerru/vue @fingerru/agent
+yarn add @fingerru/vue
 # or
-pnpm add @fingerru/vue @fingerru/agent
+pnpm add @fingerru/vue
 # or
-bun add @fingerru/vue @fingerru/agent
+bun add @fingerru/vue
 ```
 
-## Быстрый старт
+## Подключение
 
-### 1. Подключите плагин
-
-Зарегистрируйте `createFingprint()` при создании приложения. Передайте публичный
-ключ проекта в `apiKey`:
+Зарегистрируйте плагин и передайте публичный ключ проекта:
 
 ```ts
 import { createApp } from 'vue'
@@ -27,143 +24,67 @@ import { createFingprint } from '@fingerru/vue'
 import App from './App.vue'
 
 createApp(App)
-  .use(
-    createFingprint({
-      apiKey: 'pk_live_example',
-    }),
-  )
+  .use(createFingprint({ apiKey: 'pk_live_example' }))
   .mount('#app')
 ```
 
-При необходимости укажите `endpoint` для своего API или proxy, `runtimeUrl` для
-своего CDN и `loadTimeout` для времени загрузки runtime.
-
-### 2. Используйте `useVisitorData`
+Для своего proxy передайте его origin в `endpoint`:
 
-Composable возвращает visitor-данные и состояние запроса:
-
-```vue
-<script setup lang="ts">
-import { useVisitorData } from '@fingerru/vue'
+```ts
+createFingprint({
+  apiKey: 'pk_live_example',
+  endpoint: 'https://metrics.example.com',
+})
+```
 
-const { data, error, isLoading } = useVisitorData({ immediate: true })
-</script>
+`loadTimeout` задаёт максимальное время ожидания загрузки в миллисекундах; по умолчанию — `10000`. Чтобы включить кеш, передайте `cache`:
 
-<template>
-  <p v-if="isLoading">Получаем данные…</p>
-  <p v-else-if="error">Не удалось получить данные: {{ error.message }}</p>
-  <p v-else>Visitor: {{ data?.user }}</p>
-</template>
+```ts
+createFingprint({
+  apiKey: 'pk_live_example',
+  cache: { storage: 'sessionStorage', duration: 3600 },
+})
 ```
 
-Передайте `{ immediate: true }`, чтобы выполнить запрос после монтирования
-компонента. По умолчанию запрос запускается только после вызова `getData()`.
+`storage` принимает `memory`, `sessionStorage` или `localStorage`; `duration` задаётся в секундах.
 
-## Запрос по действию пользователя
+## Composition API
 
-Используйте `getData()`, когда идентификатор нужен при конкретном действии,
-например при отправке формы:
+`useVisitorData()` возвращает реактивные данные и состояние запроса. Передайте `immediate: true`, чтобы выполнить запрос после монтирования:
 
 ```vue
 <script setup lang="ts">
 import { useVisitorData } from '@fingerru/vue'
 
-const { getData, isLoading } = useVisitorData()
-
-async function handleSubmit() {
-  const visitor = await getData()
-  console.log(visitor.user)
-}
+const { data, error, isLoading } = useVisitorData({ immediate: true })
 </script>
 
 <template>
-  <button :disabled="isLoading" @click="handleSubmit">Отправить</button>
+  <p v-if="isLoading">Получаем данные…</p>
+  <p v-else-if="error">Не удалось получить данные: {{ error.message }}</p>
+  <p v-else>Visitor: {{ data?.user }}</p>
 </template>
 ```
 
-Для `useVisitorData()` можно задать `timeout` и `ignoreCache`; эти же параметры
-можно передать непосредственно в `getData()`.
-
-## Кеширование
-
-Кеширование выключено по умолчанию. Чтобы включить его, добавьте `cache` в
-настройки плагина:
-
-```ts
-createFingprint({
-  apiKey: 'pk_live_example',
-  cache: {
-    storage: 'sessionStorage',
-    duration: 3600,
-  },
-})
-```
+Без `immediate` вызовите `getData()` при действии пользователя. Для `useVisitorData()` и `getData()` доступны параметры `timeout` и `ignoreCache`.
 
 ## Options API
 
-Плагин добавляет `$fingprint` в компоненты. Для получения данных вызовите
-`this.$fingprint.getVisitorData()`:
+После регистрации плагина вызовите `this.$fingprint.getVisitorData()`:
 
-```vue
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  methods: {
-    async getVisitorData() {
-      const visitor = await this.$fingprint.getVisitorData()
-      console.log(visitor.user)
-    },
-  },
-})
-</script>
+```ts
+const visitor = await this.$fingprint.getVisitorData({ timeout: 5_000 })
+console.log(visitor.user)
 ```
 
 ## Nuxt
 
-Fingerprinting работает только в браузере. Зарегистрируйте SDK в клиентском
-плагине `plugins/fingprint.client.ts`:
+SDK работает только в браузере. Зарегистрируйте его в клиентском плагине, например `plugins/fingprint.client.ts`:
 
 ```ts
 import { createFingprint } from '@fingerru/vue'
 
 export default defineNuxtPlugin((nuxtApp) => {
-  const config = useRuntimeConfig()
-
-  nuxtApp.vueApp.use(
-    createFingprint({
-      apiKey: config.public.fingprintApiKey,
-    }),
-  )
-})
-```
-
-Передайте публичный ключ через runtime-конфигурацию:
-
-```ts
-export default defineNuxtConfig({
-  runtimeConfig: {
-    public: {
-      fingprintApiKey: process.env.FINGPRINT_API_KEY,
-    },
-  },
+  nuxtApp.vueApp.use(createFingprint({ apiKey: 'pk_live_example' }))
 })
 ```
-
-Используйте `useVisitorData()` в клиентском компоненте, например в
-`components/VisitorData.client.vue`:
-
-```vue
-<script setup lang="ts">
-import { useVisitorData } from '@fingerru/vue'
-
-const { data, getData, isLoading } = useVisitorData()
-</script>
-
-<template>
-  <button :disabled="isLoading" @click="getData()">
-    Получить visitor
-  </button>
-  <p v-if="data">Visitor: {{ data.user }}</p>
-</template>
-```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fingerru/vue",
-  "version": "1.0.0-next.4",
+  "version": "1.0.0",
   "description": "Vue SDK for the Fingprint service.",
   "keywords": [
     "browser",
@@ -28,10 +28,11 @@
     }
   },
   "files": [
-    "dist"
+    "dist",
+    "LICENSE"
   ],
   "dependencies": {
-    "@fingerru/agent": "1.0.0-next.4"
+    "@fingerru/agent": "1.0.0"
   },
   "devDependencies": {
     "vue": "^3.0.0",