├── .github
├── renovate.json
└── workflows
│ └── main.yml
├── .gitignore
├── .vscode
├── extensions.json
└── settings.json
├── LICENSE
├── README.md
├── demo
├── App.vue
├── index.html
├── main.ts
└── vite.config.ts
├── docs
├── .vitepress
│ ├── config.mts
│ └── theme
│ │ └── index.ts
├── index.md
├── installation.md
├── mini-apps.md
├── mini-apps
│ ├── components
│ │ ├── alert.md
│ │ ├── back-button.md
│ │ ├── biometric-manager.md
│ │ ├── closing-confirmation.md
│ │ ├── confirm.md
│ │ ├── expanded-viewport.md
│ │ ├── fullscreen-viewport.md
│ │ ├── main-button.md
│ │ ├── popup.md
│ │ ├── scan-qr.md
│ │ ├── secondary-button.md
│ │ └── settings-button.md
│ ├── composables-legacy
│ │ ├── use-web-app-back-button.md
│ │ ├── use-web-app-biometric-manager.md
│ │ ├── use-web-app-clipboard.md
│ │ ├── use-web-app-closing-confirmation.md
│ │ ├── use-web-app-cloud-storage.md
│ │ ├── use-web-app-haptic-feedback.md
│ │ ├── use-web-app-main-button.md
│ │ ├── use-web-app-navigation.md
│ │ ├── use-web-app-popup.md
│ │ ├── use-web-app-qr-scanner.md
│ │ ├── use-web-app-requests.md
│ │ ├── use-web-app-settings-button.md
│ │ ├── use-web-app-share.md
│ │ ├── use-web-app-theme.md
│ │ ├── use-web-app-viewport.md
│ │ └── use-web-app.md
│ └── composables
│ │ ├── use-accelerometer.md
│ │ ├── use-back-button.md
│ │ ├── use-biometric-manager.md
│ │ ├── use-clipboard.md
│ │ ├── use-cloud-storage.md
│ │ ├── use-device-orientation.md
│ │ ├── use-device-storage.md
│ │ ├── use-emoji-status.md
│ │ ├── use-gyroscope.md
│ │ ├── use-haptic-feedback.md
│ │ ├── use-home-screen.md
│ │ ├── use-location-manager.md
│ │ ├── use-main-button.md
│ │ ├── use-mini-app.md
│ │ ├── use-popup.md
│ │ ├── use-qr-scanner.md
│ │ ├── use-secondary-button.md
│ │ ├── use-secure-storage.md
│ │ ├── use-settings-button.md
│ │ ├── use-theme.md
│ │ └── use-viewport.md
├── widgets.md
└── widgets
│ ├── discussion-widget.md
│ ├── login-widget.md
│ ├── post-widget.md
│ └── share-widget.md
├── eslint.config.mjs
├── package-lock.json
├── package.json
├── scripts
└── generate-webapps-docs-snippets.ts
├── src
├── components
│ ├── Alert.vue
│ ├── BackButton.vue
│ ├── BiometricManager.vue
│ ├── ClosingConfirmation.vue
│ ├── Confirm.vue
│ ├── ExpandedViewport.vue
│ ├── FullscreenViewport.vue
│ ├── MainButton.vue
│ ├── Popup.vue
│ ├── ScanQr.vue
│ ├── SecondaryButton.vue
│ └── SettingsButton.vue
├── composables-legacy
│ ├── index.ts
│ ├── useWebApp.ts
│ ├── useWebAppBackButton.ts
│ ├── useWebAppBiometricManager.ts
│ ├── useWebAppClipboard.ts
│ ├── useWebAppClosingConfirmation.ts
│ ├── useWebAppCloudStorage.ts
│ ├── useWebAppHapticFeedback.ts
│ ├── useWebAppMainButton.ts
│ ├── useWebAppNavigation.ts
│ ├── useWebAppPopup.ts
│ ├── useWebAppQrScanner.ts
│ ├── useWebAppRequests.ts
│ ├── useWebAppSendData.ts
│ ├── useWebAppSettingsButton.ts
│ ├── useWebAppShare.ts
│ ├── useWebAppTheme.ts
│ └── useWebAppViewport.ts
├── composables
│ ├── useAccelerometer.ts
│ ├── useBackButton.ts
│ ├── useBiometricManager.ts
│ ├── useClipboard.ts
│ ├── useCloudStorage.ts
│ ├── useDeviceOrientation.ts
│ ├── useDeviceStorage.ts
│ ├── useEmojiStatus.ts
│ ├── useGyroscope.ts
│ ├── useHapticFeedback.ts
│ ├── useHomeScreen.ts
│ ├── useLocationManager.ts
│ ├── useMainButton.ts
│ ├── useMiniApp.ts
│ ├── usePopup.ts
│ ├── useQrScanner.ts
│ ├── useSecondaryButton.ts
│ ├── useSecureStorage.ts
│ ├── useSettingsButton.ts
│ ├── useTheme.ts
│ └── useViewport.ts
├── events.ts
├── index.ts
├── sdk
│ ├── accelerometer.ts
│ ├── back-button.ts
│ ├── biometric-manager.ts
│ ├── bottom-button.ts
│ ├── cloud-storage.ts
│ ├── device-orientation.ts
│ ├── device-storage.ts
│ ├── events.ts
│ ├── gyroscope.ts
│ ├── haptic-feedback.ts
│ ├── index.ts
│ ├── location-manager.ts
│ ├── popup.ts
│ ├── qr-scanner.ts
│ ├── secure-storage.ts
│ ├── settings-button.ts
│ ├── theme.ts
│ ├── viewport.ts
│ └── webapp.ts
├── shims.d.ts
├── types.ts
├── utils
│ ├── functions.ts
│ ├── index.ts
│ ├── lifecycle.ts
│ ├── store.ts
│ └── version.ts
├── versions
│ ├── 6.0.ts
│ ├── 6.1.ts
│ ├── 6.2.ts
│ ├── 6.4.ts
│ ├── 6.7.ts
│ ├── 6.9.ts
│ ├── 7.0.ts
│ ├── 7.10.ts
│ ├── 7.2.ts
│ ├── 7.6.ts
│ ├── 7.7.ts
│ ├── 7.8.ts
│ ├── 8.0.ts
│ ├── 9.0.ts
│ ├── 9.1.ts
│ └── latest.ts
└── widgets
│ ├── DiscussionWidget.vue
│ ├── LoginWidget.vue
│ ├── PostWidget.vue
│ └── ShareWidget.vue
├── test
└── basic.test.ts
├── tsconfig.json
├── vite.config.mts
└── vitest.config.ts
/.github/renovate.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": [
3 | "config:base"
4 | ]
5 | }
6 |
--------------------------------------------------------------------------------
/.github/workflows/main.yml:
--------------------------------------------------------------------------------
1 | name: Build
2 |
3 | on:
4 | push:
5 | branches: [main]
6 | pull_request:
7 | branches: [main]
8 |
9 | jobs:
10 | build-and-test:
11 | runs-on: ubuntu-latest
12 | strategy:
13 | matrix:
14 | node-version: [22.x]
15 | steps:
16 | - uses: actions/checkout@v3
17 | - name: Use Node.js ${{ matrix.node-version }}
18 | uses: actions/setup-node@v3
19 | with:
20 | node-version: ${{ matrix.node-version }}
21 | - run: npm ci
22 | - run: npm run lint
23 | - run: npm run build
24 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # Logs
2 | logs
3 | *.log
4 | npm-debug.log*
5 | yarn-debug.log*
6 | yarn-error.log*
7 | lerna-debug.log*
8 | .pnpm-debug.log*
9 |
10 | # Diagnostic reports (https://nodejs.org/api/report.html)
11 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
12 |
13 | # Runtime data
14 | pids
15 | *.pid
16 | *.seed
17 | *.pid.lock
18 |
19 | # Directory for instrumented libs generated by jscoverage/JSCover
20 | lib-cov
21 |
22 | # Coverage directory used by tools like istanbul
23 | coverage
24 | *.lcov
25 |
26 | # nyc test coverage
27 | .nyc_output
28 |
29 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
30 | .grunt
31 |
32 | # Bower dependency directory (https://bower.io/)
33 | bower_components
34 |
35 | # node-waf configuration
36 | .lock-wscript
37 |
38 | # Compiled binary addons (https://nodejs.org/api/addons.html)
39 | build/Release
40 |
41 | # Dependency directories
42 | node_modules/
43 | jspm_packages/
44 |
45 | # Snowpack dependency directory (https://snowpack.dev/)
46 | web_modules/
47 |
48 | # TypeScript cache
49 | *.tsbuildinfo
50 |
51 | # Optional npm cache directory
52 | .npm
53 |
54 | # Optional eslint cache
55 | .eslintcache
56 |
57 | # Optional stylelint cache
58 | .stylelintcache
59 |
60 | # Microbundle cache
61 | .rpt2_cache/
62 | .rts2_cache_cjs/
63 | .rts2_cache_es/
64 | .rts2_cache_umd/
65 |
66 | # Optional REPL history
67 | .node_repl_history
68 |
69 | # Output of 'npm pack'
70 | *.tgz
71 |
72 | # Yarn Integrity file
73 | .yarn-integrity
74 |
75 | # dotenv environment variable files
76 | .env
77 | .env.development.local
78 | .env.test.local
79 | .env.production.local
80 | .env.local
81 |
82 | # parcel-bundler cache (https://parceljs.org/)
83 | .cache
84 | .parcel-cache
85 |
86 | # Next.js build output
87 | .next
88 | out
89 |
90 | # Nuxt.js build / generate output
91 | .nuxt
92 | dist
93 |
94 | # Gatsby files
95 | .cache/
96 | # Comment in the public line in if your project uses Gatsby and not Next.js
97 | # https://nextjs.org/blog/next-9-1#public-directory-support
98 | # public
99 |
100 | # vuepress build output
101 | .vuepress/dist
102 |
103 | # vuepress v2.x temp and cache directory
104 | .temp
105 | .cache
106 |
107 | # Serverless directories
108 | .serverless/
109 |
110 | # FuseBox cache
111 | .fusebox/
112 |
113 | # DynamoDB Local files
114 | .dynamodb/
115 |
116 | # TernJS port file
117 | .tern-port
118 |
119 | # Stores VSCode versions used for testing VSCode extensions
120 | .vscode-test
121 |
122 | # yarn v2
123 | .yarn/cache
124 | .yarn/unplugged
125 | .yarn/build-state.yml
126 | .yarn/install-state.gz
127 | .pnp.*
128 |
129 | # Data
130 | data/
131 |
132 | *.env
133 |
134 | docs/.vitepress/dist
135 | docs/.vitepress/cache
136 | docs/generated
137 |
--------------------------------------------------------------------------------
/.vscode/extensions.json:
--------------------------------------------------------------------------------
1 | {
2 | "recommendations": [
3 | "dbaeumer.vscode-eslint",
4 | "misterj.vue-volar-extention-pack"
5 | ]
6 | }
7 |
--------------------------------------------------------------------------------
/.vscode/settings.json:
--------------------------------------------------------------------------------
1 | {
2 | // Disable the default formatter, use eslint instead
3 | "prettier.enable": false,
4 | "editor.formatOnSave": false,
5 |
6 | // Auto fix
7 | "editor.codeActionsOnSave": {
8 | "source.fixAll.eslint": "explicit",
9 | "source.organizeImports": "never"
10 | },
11 |
12 | // Silent the stylistic rules in you IDE, but still auto fix them
13 | "eslint.rules.customizations": [
14 | { "rule": "style/*", "severity": "off", "fixable": true },
15 | { "rule": "format/*", "severity": "off", "fixable": true },
16 | { "rule": "*-indent", "severity": "off", "fixable": true },
17 | { "rule": "*-spacing", "severity": "off", "fixable": true },
18 | { "rule": "*-spaces", "severity": "off", "fixable": true },
19 | { "rule": "*-order", "severity": "off", "fixable": true },
20 | { "rule": "*-dangle", "severity": "off", "fixable": true },
21 | { "rule": "*-newline", "severity": "off", "fixable": true },
22 | { "rule": "*quotes", "severity": "off", "fixable": true },
23 | { "rule": "*semi", "severity": "off", "fixable": true }
24 | ],
25 |
26 | // Enable eslint for all supported languages
27 | "eslint.validate": [
28 | "javascript",
29 | "javascriptreact",
30 | "typescript",
31 | "typescriptreact",
32 | "vue",
33 | "html",
34 | "markdown",
35 | "json",
36 | "jsonc",
37 | "yaml",
38 | "toml",
39 | "xml",
40 | "gql",
41 | "graphql",
42 | "astro",
43 | "svelte",
44 | "css",
45 | "less",
46 | "scss",
47 | "pcss",
48 | "postcss"
49 | ],
50 | "typescript.tsdk": "node_modules/typescript/lib"
51 | }
52 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2023 deptyped
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/demo/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 | vue-tg
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/demo/main.ts:
--------------------------------------------------------------------------------
1 | import { createApp } from 'vue'
2 | import { VueTelegramPlugin } from '../src'
3 | import App from './App.vue'
4 |
5 | createApp(App).use(VueTelegramPlugin).mount('#app')
6 |
--------------------------------------------------------------------------------
/demo/vite.config.ts:
--------------------------------------------------------------------------------
1 | import vue from '@vitejs/plugin-vue'
2 | import { defineConfig } from 'vite'
3 |
4 | export default defineConfig({
5 | plugins: [vue()],
6 | })
7 |
--------------------------------------------------------------------------------
/docs/.vitepress/config.mts:
--------------------------------------------------------------------------------
1 | import { transformerTwoslash } from '@shikijs/vitepress-twoslash'
2 | import { defineConfig } from 'vitepress'
3 |
4 | // https://vitepress.dev/reference/site-config
5 | export default defineConfig({
6 | title: 'vue-tg',
7 | description: 'Vue-Telegram Documentation',
8 | markdown: {
9 | codeTransformers: [
10 | transformerTwoslash({
11 | twoslashOptions: {
12 | compilerOptions: {
13 | noErrorTruncation: true,
14 | paths: {
15 | 'vue-tg': [
16 | './dist',
17 | ],
18 | 'vue-tg/7.8': [
19 | './dist/versions/7.8',
20 | ],
21 | 'vue-tg/8.0': [
22 | './dist/versions/8.0',
23 | ],
24 | 'vue-tg/latest': [
25 | './dist/versions/latest',
26 | ],
27 | },
28 | },
29 | },
30 | }),
31 | ],
32 | },
33 | themeConfig: {
34 | search: {
35 | provider: 'local',
36 | options: {
37 | detailedView: true,
38 | _render(src, env, md) {
39 | if (env.relativePath.startsWith('mini-apps/components'))
40 | return ''
41 | if (env.relativePath.startsWith('mini-apps/composables'))
42 | return ''
43 | if (env.relativePath.startsWith('widgets/'))
44 | return ''
45 |
46 | return md.render(src, env)
47 | },
48 | },
49 | },
50 |
51 | // https://vitepress.dev/reference/default-theme-config
52 | nav: [
53 | {
54 | text: 'Installation',
55 | link: '/installation',
56 | },
57 | {
58 | text: 'Mini Apps',
59 | link: '/mini-apps',
60 | },
61 | {
62 | text: 'Widgets',
63 | link: '/widgets',
64 | },
65 | ],
66 |
67 | socialLinks: [
68 | { icon: 'github', link: 'https://github.com/deptyped/vue-telegram' },
69 | ],
70 | },
71 | })
72 |
--------------------------------------------------------------------------------
/docs/.vitepress/theme/index.ts:
--------------------------------------------------------------------------------
1 | import Theme from 'vitepress/theme'
2 | import TwoslashFloatingVue from '@shikijs/vitepress-twoslash/client'
3 | import '@shikijs/vitepress-twoslash/style.css'
4 | import type { EnhanceAppContext } from 'vitepress'
5 |
6 | export default {
7 | extends: Theme,
8 | enhanceApp({ app }: EnhanceAppContext) {
9 | app.use(TwoslashFloatingVue)
10 | },
11 | }
--------------------------------------------------------------------------------
/docs/index.md:
--------------------------------------------------------------------------------
1 | ---
2 | # https://vitepress.dev/reference/default-theme-home-page
3 | layout: home
4 |
5 | hero:
6 | name: vue-tg
7 | tagline: Telegram integration for Vue
8 | actions:
9 | - theme: brand
10 | text: Installation
11 | link: /installation
12 | - theme: alt
13 | text: Telegram Mini Apps
14 | link: /mini-apps
15 | - theme: alt
16 | text: Telegram Widgets
17 | link: /widgets
18 | - theme: alt
19 | text: View on GitHub
20 | link: https://github.com/deptyped/vue-telegram
21 | ---
22 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/alert.md:
--------------------------------------------------------------------------------
1 | ### Alert
2 |
3 | A component that shows message in a simple alert with a 'Close' button when is
4 | rendered.
5 |
6 | ```vue
7 |
14 |
15 |
16 |
17 |
18 | ```
19 |
20 | #### Props
21 |
22 | | Name | Type | Required | Description |
23 | | ------- | ------ | -------- | ----------------------------------------------------------- |
24 | | message | string | true | The message to be displayed in the body of the alert popup. |
25 |
26 | #### Events
27 |
28 | | Name | Type | Description |
29 | | ----- | ------------ | -------------------------------------- |
30 | | close | `() => void` | Emits when the opened popup is closed. |
31 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/back-button.md:
--------------------------------------------------------------------------------
1 | ### BackButton
2 |
3 | A component that enables the back button when is rendered.
4 |
5 | ```vue
6 |
13 |
14 |
15 |
16 |
17 | ```
18 |
19 | #### Props
20 |
21 | | Name | Type | Required | Description |
22 | | ------- | ------- | -------- | ------------------------------------------------------------ |
23 | | visible | boolean | false | Shows whether the button is visible. Set to true by default. |
24 |
25 | #### Events
26 |
27 | | Name | Type | Description |
28 | | ----- | ------------ | -------------------------------------- |
29 | | click | `() => void` | Emits when the back button is pressed. |
30 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/biometric-manager.md:
--------------------------------------------------------------------------------
1 | ### BiometricManager
2 |
3 | A component that init the biometric manager when is rendered.
4 |
5 | ```vue
6 |
13 |
14 |
15 |
16 |
17 | ```
18 |
19 | #### Events
20 |
21 | | Name | Type | Description |
22 | | ---- | ------------ | ----------------------------------------- |
23 | | init | `() => void` | Emits when the biometric manager is init. |
24 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/closing-confirmation.md:
--------------------------------------------------------------------------------
1 | ### ClosingConfirmation
2 |
3 | A component that enables the confirmation dialog while the user is trying to close the Mini App.
4 |
5 | ```vue
6 |
9 |
10 |
11 |
12 |
13 | ```
14 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/confirm.md:
--------------------------------------------------------------------------------
1 | ### Confirm
2 |
3 | A component that shows message in a simple confirmation window with 'OK' and
4 | 'Cancel' buttons when is rendered.
5 |
6 | ```vue
7 |
14 |
15 |
16 |
17 |
18 | ```
19 |
20 | #### Props
21 |
22 | | Name | Type | Required | Description |
23 | | ------- | ------ | -------- | ------------------------------------------------------------- |
24 | | message | string | true | The message to be displayed in the body of the confirm popup. |
25 |
26 | #### Events
27 |
28 | | Name | Type | Description |
29 | | ----- | ----------------------- | -------------------------------------- |
30 | | close | `(ok: boolean) => void` | Emits when the opened popup is closed. |
31 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/expanded-viewport.md:
--------------------------------------------------------------------------------
1 | ### ExpandedViewport
2 |
3 | A component that expands the Mini App to the maximum available height and disable vertical swipes when is rendered.
4 |
5 | ```vue
6 |
9 |
10 |
11 |
12 |
13 | ```
14 |
15 | #### Props
16 |
17 | | Name | Type | Required | Description |
18 | | ----- | ------- | -------- | -------------------------------------------------------------------------------------------------------------- |
19 | | force | boolean | false | Expands the viewport despite user interaction. Disables vertical swipes if supported. Set to false by default. |
20 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/fullscreen-viewport.md:
--------------------------------------------------------------------------------
1 | ### FullscreenViewport
2 |
3 | A component that expands the Mini App to the entire screen when is rendered.
4 |
5 | ```vue
6 |
9 |
10 |
11 |
12 |
13 | ```
14 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/main-button.md:
--------------------------------------------------------------------------------
1 | ### MainButton
2 |
3 | A component that enables the main button when is rendered.
4 |
5 | ```vue
6 |
13 |
14 |
15 |
16 |
17 | ```
18 |
19 | #### Props
20 |
21 | | Name | Type | Required | Description |
22 | | -------------- | ------- | -------- | ------------------------------------------------------------ |
23 | | visible | boolean | false | Shows whether the button is visible. Set to true by default. |
24 | | disabled | boolean | false | Shows whether the button is disable. |
25 | | progress | boolean | false | Shows whether the button is displaying a loading indicator. |
26 | | text | string | false | |
27 | | color | string | false | |
28 | | textColor | string | false | |
29 | | hasShineEffect | boolean | false | |
30 |
31 | #### Events
32 |
33 | | Name | Type | Description |
34 | | ----- | ------------ | -------------------------------------- |
35 | | click | `() => void` | Emits when the main button is pressed. |
36 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/popup.md:
--------------------------------------------------------------------------------
1 | ### Popup
2 |
3 | A component that shows a native popup when is rendered.
4 |
5 | ```vue
6 |
13 |
14 |
15 |
16 |
17 | ```
18 |
19 | #### Props
20 |
21 | | Name | Type | Required | Description |
22 | | ------- | --------------------------------------------------------------------- | -------- | ----------------------------------------------------- |
23 | | message | string | true | The message to be displayed in the body of the popup. |
24 | | title | string | false | The text to be displayed in the popup title. |
25 | | buttons | [PopupButton[] ↗](https://core.telegram.org/bots/webapps#popupbutton) | false | List of buttons to be displayed in the popup. |
26 |
27 | #### Events
28 |
29 | | Name | Type | Description |
30 | | ----- | ---------------------------- | -------------------------------------- |
31 | | close | `(buttonId: string) => void` | Emits when the opened popup is closed. |
32 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/scan-qr.md:
--------------------------------------------------------------------------------
1 | ### ScanQr
2 |
3 | A component that shows a native popup for scanning a QR code when is rendered.
4 |
5 | ```vue
6 |
13 |
14 |
15 |
16 |
17 | ```
18 |
19 | #### Props
20 |
21 | | Name | Type | Required | Description |
22 | | ---- | ------ | -------- | ----------------------------------------------------- |
23 | | text | string | false | The text to be displayed under the 'Scan QR' heading. |
24 |
25 | #### Events
26 |
27 | | Name | Type | Description |
28 | | ------ | ------------------------ | ------------------------------------------------------------- |
29 | | result | `(data: string) => void` | Emits when the QR code scanner catches a code with text data. |
30 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/secondary-button.md:
--------------------------------------------------------------------------------
1 | ### SecondaryButton
2 |
3 | A component that enables the secondary button when is rendered.
4 |
5 | ```vue
6 |
13 |
14 |
15 |
16 |
17 | ```
18 |
19 | #### Props
20 |
21 | | Name | Type | Required | Description |
22 | | -------------- | ------- | -------- | ------------------------------------------------------------ |
23 | | visible | boolean | false | Shows whether the button is visible. Set to true by default. |
24 | | disabled | boolean | false | Shows whether the button is disable. |
25 | | progress | boolean | false | Shows whether the button is displaying a loading indicator. |
26 | | text | string | false | |
27 | | color | string | false | |
28 | | textColor | string | false | |
29 | | hasShineEffect | boolean | false | |
30 | | position | string | false | |
31 |
32 | #### Events
33 |
34 | | Name | Type | Description |
35 | | ----- | ------------ | -------------------------------------- |
36 | | click | `() => void` | Emits when the main button is pressed. |
37 |
--------------------------------------------------------------------------------
/docs/mini-apps/components/settings-button.md:
--------------------------------------------------------------------------------
1 | ### SettingsButton
2 |
3 | A component that enables the settings button when is rendered.
4 |
5 | ```vue
6 |
13 |
14 |
15 |
16 |
17 | ```
18 |
19 | #### Props
20 |
21 | | Name | Type | Required | Description |
22 | | ------- | ------- | -------- | ------------------------------------------------------------ |
23 | | visible | boolean | false | Shows whether the button is visible. Set to true by default. |
24 |
25 | #### Events
26 |
27 | | Name | Type | Description |
28 | | ----- | ------------ | ------------------------------------------ |
29 | | click | `() => void` | Emits when the settings button is pressed. |
30 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-back-button.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppBackButton~~
2 |
3 | ::: danger Deprecated
4 | Use [useBackButton](#usebackbutton) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppBackButton } from 'vue-tg'
10 | ```
11 |
12 | | Name | Description |
13 | | :-------------------- | :-------------------------------------------------------------------------------------------------- |
14 | | `isBackButtonVisible` |
|
15 | | `showBackButton` | |
16 | | `hideBackButton` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-biometric-manager.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppBiometricManager~~
2 |
3 | ::: danger Deprecated
4 | Use [useBiometricManager](#usebiometricmanager) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppBiometricManager } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :--------------------------- | :---------------------------------------------------------------------------------------------------------------------------- |
14 | | `isBiometricInited` |
|
15 | | `isBiometricAvailable` |
|
16 | | `biometricType` |
|
17 | | `isBiometricAccessRequested` |
|
18 | | `isBiometricAccessGranted` |
|
19 | | `isBiometricTokenSaved` |
|
20 | | `biometricDeviceId` |
|
21 | | `initBiometric` | |
22 | | `requestBiometricAccess` | |
23 | | `authenticateBiometric` | |
24 | | `updateBiometricToken` | |
25 | | `openBiometricSettings` | |
26 | | `onManagerUpdated` | A method that sets the `biometricManagerUpdated` [event handler](#event-handling). |
27 | | `onAuthRequested` | A method that sets the `biometricAuthRequested` [event handler](#event-handling). |
28 | | `onTokenUpdated` | A method that sets the `biometricTokenUpdated` [event handler](#event-handling). |
29 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-clipboard.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppClipboard~~
2 |
3 | ::: danger Deprecated
4 | Use [useClipboard](#useclipboard) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppClipboard } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :---------------------- | :------------------------------------------------------------ |
14 | | `readTextFromClipboard` | |
15 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-closing-confirmation.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppClosingConfirmation~~
2 |
3 | ::: danger Deprecated
4 | Use [useMiniApp](#useminiapp) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppClosingConfirmation } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :----------------------------- | :----------------------------------------------------------------------------------------------------------------- |
14 | | `isClosingConfirmationEnabled` |
|
15 | | `enableClosingConfirmation` | |
16 | | `disableClosingConfirmation` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-cloud-storage.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppCloudStorage~~
2 |
3 | ::: danger Deprecated
4 | Use [useCloudStorage](#usecloudstorage) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppCloudStorage } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :------------------- | :-------------------------------------------------------- |
14 | | `setStorageItem` | |
15 | | `getStorageItem` | |
16 | | `getStorageItems` | |
17 | | `removeStorageItem` | |
18 | | `removeStorageItems` | |
19 | | `getStorageKeys` | |
20 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-haptic-feedback.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppHapticFeedback~~
2 |
3 | ::: danger Deprecated
4 | Use [useHapticFeedback](#usehapticfeedback) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppHapticFeedback } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :--------------------- | :------------------------------------------------------------------- |
14 | | `impactOccurred` | |
15 | | `notificationOccurred` | |
16 | | `selectionChanged` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-main-button.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppMainButton~~
2 |
3 | ::: danger Deprecated
4 | Use [useMainButton](#usemainbutton) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppMainButton } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :---------------------------- | :--------------------------------------------------------------------------------------------------------- |
14 | | `mainButtonText` |
|
15 | | `mainButtonColor` |
|
16 | | `mainButtonTextColor` |
|
17 | | `isMainButtonVisible` |
|
18 | | `isMainButtonActive` |
|
19 | | `isMainButtonProgressVisible` |
|
20 | | `setMainButtonText` | |
21 | | `showMainButton` | |
22 | | `hideMainButton` | |
23 | | `enableMainButton` | |
24 | | `disableMainButton` | |
25 | | `showMainButtonProgress` | |
26 | | `hideMainButtonProgress` | |
27 | | `setMainButtonParams` | |
28 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-navigation.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppNavigation~~
2 |
3 | ::: danger Deprecated
4 | Use [useMiniApp](#useminiapp) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppNavigation } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :------------------ | :-------------------------------------------------------- |
14 | | `openInvoice` | |
15 | | `openLink` | |
16 | | `openTelegramLink` | |
17 | | `switchInlineQuery` | |
18 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-popup.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppPopup~~
2 |
3 | ::: danger Deprecated
4 | Use [usePopup](#usepopup) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppPopup } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :------------ | :-------------------------------------------------- |
14 | | `showAlert` | |
15 | | `showConfirm` | |
16 | | `showPopup` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-qr-scanner.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppQrScanner~~
2 |
3 | ::: danger Deprecated
4 | Use [useQrScanner](#useqrscanner) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppQrScanner } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :----------------- | :------------------------------------------------------- |
14 | | `showScanQrPopup` | |
15 | | `closeScanQrPopup` | |
16 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-requests.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppRequests~~
2 |
3 | ::: danger Deprecated
4 | Use [useMiniApp](#useminiapp) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppRequests } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :------------------- | :--------------------------------------------------------- |
14 | | `requestContact` | |
15 | | `requestWriteAccess` | |
16 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-settings-button.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppSettingsButton~~
2 |
3 | ::: danger Deprecated
4 | Use [useSettingsButton](#usesettingsbutton) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppSettingsButton } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :------------------------ | :----------------------------------------------------------------------------------------------------- |
14 | | `isSettingsButtonVisible` |
|
15 | | `showSettingsButton` | |
16 | | `hideSettingsButton` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-share.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppShare~~
2 |
3 | ::: danger Deprecated
4 | Use [useMiniApp](#useminiapp) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppShare } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :------------- | :--------------------------------------------------- |
14 | | `shareToStory` | |
15 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-theme.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppTheme~~
2 |
3 | ::: danger Deprecated
4 | Use [useTheme](#usetheme) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppTheme } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :------------------- | :------------------------------------------------------------------------------------------------------- |
14 | | `colorScheme` |
|
15 | | `themeParams` |
|
16 | | `headerColor` |
|
17 | | `backgroundColor` |
|
18 | | `setHeaderColor` | |
19 | | `setBackgroundColor` | |
20 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app-viewport.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebAppViewport~~
2 |
3 | ::: danger Deprecated
4 | Use [useViewport](#useviewport) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebAppViewport } from 'vue-tg'
10 | ```
11 |
12 | | Name | Type |
13 | | :------------------------ | :----------------------------------------------------------------------------------------------------------------- |
14 | | `isExpanded` |
|
15 | | `viewportHeight` |
|
16 | | `viewportStableHeight` |
|
17 | | `isVerticalSwipesEnabled` |
|
18 | | `expand` | |
19 | | `enableVerticalSwipes` | |
20 | | `disableVerticalSwipes` | |
21 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables-legacy/use-web-app.md:
--------------------------------------------------------------------------------
1 | ### ~~useWebApp~~
2 |
3 | ::: danger Deprecated
4 | Use [useMiniApp](#useminiapp) instead.
5 | :::
6 |
7 | ```ts twoslash
8 | // Hover to inspect type
9 | import { useWebApp } from 'vue-tg'
10 | ```
11 |
12 | | Name | Description |
13 | | :------------------- | :--------------------------------------------------------------------------------------------------------------------------------- |
14 | | `initData` | |
15 | | `initDataUnsafe` | |
16 | | `version` | |
17 | | `platform` | |
18 | | `isVersionAtLeast` | |
19 | | `sendData` | |
20 | | `ready` | |
21 | | `close` | |
22 | | `isReady` | Boolean indicating if the app is ready.
|
23 | | `isPlatform` | Function to check if the app is running on a specified platform.
|
24 | | `isPlatformUnknown` | Boolean indicating if the platform is unknown.
|
25 | | `isFeatureSupported` | Function to check if a specified feature is supported.
|
26 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-accelerometer.md:
--------------------------------------------------------------------------------
1 | ### useAccelerometer
2 |
3 | ```ts
4 | import { useAccelerometer } from 'vue-tg'
5 |
6 | const accelerometer = useAccelerometer()
7 | ```
8 |
9 | | Name | Description |
10 | | :----------------- | :--------------------------------------------------------------------------------------------------------------------------- |
11 | | `isStarted` |
|
12 | | `x` |
|
13 | | `y` |
|
14 | | `z` |
|
15 | | `start` |
|
16 | | `onStart` | A method that sets event handler. An alias for onAccelerometerStarted
. |
17 | | `onChange` | A method that sets event handler. An alias for onAccelerometerChanged
. |
18 | | `onFail` | A method that sets event handler. An alias for onAccelerometerFailed
. |
19 | | `stop` |
|
20 | | `onStop` | A method that sets event handler. An alias for onAccelerometerStopped
. |
21 | | `version` | |
22 | | `isVersionAtLeast` | |
23 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-back-button.md:
--------------------------------------------------------------------------------
1 | ### useBackButton
2 |
3 | ```ts
4 | import { useBackButton } from 'vue-tg'
5 |
6 | const backButton = useBackButton()
7 | ```
8 |
9 | | Name | Description |
10 | | :----------------- | :-------------------------------------------------------------------------------------------------- |
11 | | `isVisible` |
|
12 | | `show` | |
13 | | `hide` | |
14 | | `onClick` | |
15 | | `version` | |
16 | | `isVersionAtLeast` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-biometric-manager.md:
--------------------------------------------------------------------------------
1 | ### useBiometricManager
2 |
3 | ```ts
4 | import { useBiometricManager } from 'vue-tg'
5 |
6 | const biometricManager = useBiometricManager()
7 | ```
8 |
9 | | Name | Type |
10 | | :---------------------- | :------------------------------------------------------------------------------------------------------------------------------ |
11 | | `isInited` |
|
12 | | `isBiometricAvailable` |
|
13 | | `biometricType` |
|
14 | | `isAccessRequested` |
|
15 | | `isAccessGranted` |
|
16 | | `isBiometricTokenSaved` |
|
17 | | `deviceId` |
|
18 | | `init` |
|
19 | | `requestAccess` |
|
20 | | `onManagerUpdate` | A method that sets event handler. An alias for onBiometricManagerUpdated
. |
21 | | `authenticate` |
|
22 | | `onAuthRequest` | A method that sets event handler. An alias for onBiometricAuthRequested
. |
23 | | `updateToken` |
|
24 | | `onTokenUpdate` | A method that sets event handler. An alias for onBiometricTokenUpdated
. |
25 | | `openSettings` | |
26 | | `version` | |
27 | | `isVersionAtLeast` | |
28 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-clipboard.md:
--------------------------------------------------------------------------------
1 | ### useClipboard
2 |
3 | ```ts
4 | import { useClipboard } from 'vue-tg'
5 |
6 | const clipboard = useClipboard()
7 | ```
8 |
9 | | Name | Description |
10 | | :----------------- | :---------------------------------------------------------------------------------------------------------------------------- |
11 | | `readText` |
|
12 | | `onReadText` | A method that sets event handler. An alias for onClipboardTextReceived
. |
13 | | `version` | |
14 | | `isVersionAtLeast` | |
15 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-cloud-storage.md:
--------------------------------------------------------------------------------
1 | ### useCloudStorage
2 |
3 | ```ts
4 | import { useCloudStorage } from 'vue-tg'
5 |
6 | const cloudStorage = useCloudStorage()
7 | ```
8 |
9 | | Name | Type |
10 | | :----------------- | :------------------------------------------------------------------------------------------------- |
11 | | `setItem` |
|
12 | | `getItem` |
|
13 | | `getItems` |
|
14 | | `removeItem` |
|
15 | | `removeItems` |
|
16 | | `getKeys` |
|
17 | | `version` | |
18 | | `isVersionAtLeast` | |
19 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-device-orientation.md:
--------------------------------------------------------------------------------
1 | ### useDeviceOrientation
2 |
3 | ```ts
4 | import { useDeviceOrientation } from 'vue-tg'
5 |
6 | const deviceOrientation = useDeviceOrientation()
7 | ```
8 |
9 | | Name | Description |
10 | | :----------------- | :------------------------------------------------------------------------------------------------------------------------------- |
11 | | `isStarted` |
|
12 | | `absolute` |
|
13 | | `alpha` |
|
14 | | `beta` |
|
15 | | `gamma` |
|
16 | | `start` |
|
17 | | `onStart` | A method that sets event handler. An alias for onDeviceOrientationStarted
. |
18 | | `onChange` | A method that sets event handler. An alias for onDeviceOrientationChanged
. |
19 | | `onFail` | A method that sets event handler. An alias for onDeviceOrientationFailed
. |
20 | | `stop` |
|
21 | | `onStop` | A method that sets event handler. An alias for onDeviceOrientationStopped
. |
22 | | `version` | |
23 | | `isVersionAtLeast` | |
24 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-device-storage.md:
--------------------------------------------------------------------------------
1 | ### useDeviceStorage
2 |
3 | ```ts
4 | import { useDeviceStorage } from 'vue-tg'
5 |
6 | const deviceStorage = useDeviceStorage()
7 | ```
8 |
9 | | Name | Type |
10 | | :----------------- | :------------------------------------------------------------------------------------------------- |
11 | | `setItem` |
|
12 | | `getItem` |
|
13 | | `removeItem` |
|
14 | | `clear` |
|
15 | | `version` | |
16 | | `isVersionAtLeast` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-emoji-status.md:
--------------------------------------------------------------------------------
1 | ### useEmojiStatus
2 |
3 | ```ts
4 | import { useEmojiStatus } from 'vue-tg'
5 |
6 | const emojiStatus = useEmojiStatus()
7 | ```
8 |
9 | | Name | Description |
10 | | :----------------- | :--------------------------------------------------------------------------------------------------------------------------------- |
11 | | `set` |
|
12 | | `onSet` | A method that sets event handler. An alias for onEmojiStatusSet
. |
13 | | `onFail` | A method that sets event handler. An alias for onEmojiStatusFailed
. |
14 | | `requestAccess` |
|
15 | | `onAccessRequest` | A method that sets event handler. An alias for onEmojiStatusAccessRequested
. |
16 | | `version` | |
17 | | `isVersionAtLeast` | |
18 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-gyroscope.md:
--------------------------------------------------------------------------------
1 | ### useGyroscope
2 |
3 | ```ts
4 | import { useGyroscope } from 'vue-tg'
5 |
6 | const gyroscope = useGyroscope()
7 | ```
8 |
9 | | Name | Description |
10 | | :----------------- | :----------------------------------------------------------------------------------------------------------------------- |
11 | | `isStarted` |
|
12 | | `x` |
|
13 | | `y` |
|
14 | | `z` |
|
15 | | `start` |
|
16 | | `onStart` | A method that sets event handler. An alias for onGyroscopeStarted
. |
17 | | `onChange` | A method that sets event handler. An alias for onGyroscopeChanged
. |
18 | | `onFail` | A method that sets event handler. An alias for onGyroscopeFailed
. |
19 | | `stop` |
|
20 | | `onStop` | A method that sets event handler. An alias for onGyroscopeStopped
. |
21 | | `version` | |
22 | | `isVersionAtLeast` | |
23 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-haptic-feedback.md:
--------------------------------------------------------------------------------
1 | ### useHapticFeedback
2 |
3 | ```ts
4 | import { useHapticFeedback } from 'vue-tg'
5 |
6 | const hapticFeedback = useHapticFeedback()
7 | ```
8 |
9 | | Name | Description |
10 | | :--------------------- | :------------------------------------------------------------------- |
11 | | `impactOccurred` | |
12 | | `notificationOccurred` | |
13 | | `selectionChanged` | |
14 | | `version` | |
15 | | `isVersionAtLeast` | |
16 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-home-screen.md:
--------------------------------------------------------------------------------
1 | ### useHomeScreen
2 |
3 | ```ts
4 | import { useHomeScreen } from 'vue-tg'
5 |
6 | const homeScreen = useHomeScreen()
7 | ```
8 |
9 | | Name | Type |
10 | | :-------------------- | :------------------------------------------------------------------------------------------------------------------------ |
11 | | `addShortcut` | |
12 | | `onShortcutAdd` | A method that sets event handler. An alias for onHomeScreenAdded
. |
13 | | `checkShortcutStatus` |
|
14 | | `onShortcutCheck` | A method that sets event handler. An alias for onHomeScreenChecked
. |
15 | | `version` | |
16 | | `isVersionAtLeast` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-location-manager.md:
--------------------------------------------------------------------------------
1 | ### useLocationManager
2 |
3 | ```ts
4 | import { useLocationManager } from 'vue-tg'
5 |
6 | const locationManager = useLocationManager()
7 | ```
8 |
9 | | Name | Description |
10 | | :-------------------- | :----------------------------------------------------------------------------------------------------------------------------- |
11 | | `isInited` |
|
12 | | `isLocationAvailable` |
|
13 | | `isAccessRequested` |
|
14 | | `isAccessGranted` |
|
15 | | `init` |
|
16 | | `onManagerUpdate` | A method that sets event handler. An alias for onLocationManagerUpdated
. |
17 | | `getLocation` |
|
18 | | `onRequest` | A method that sets event handler. An alias for onLocationRequested
. |
19 | | `openSettings` | |
20 | | `version` | |
21 | | `isVersionAtLeast` | |
22 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-main-button.md:
--------------------------------------------------------------------------------
1 | ### useMainButton
2 |
3 | ```ts
4 | import { useMainButton } from 'vue-tg'
5 |
6 | const mainButton = useMainButton()
7 | ```
8 |
9 | | Name | Description |
10 | | :------------------ | :-------------------------------------------------------------------------------------------------------- |
11 | | `text` |
|
12 | | `color` |
|
13 | | `textColor` |
|
14 | | `isVisible` |
|
15 | | `isActive` |
|
16 | | `isProgressVisible` |
|
17 | | `hasShineEffect` |
|
18 | | `show` | |
19 | | `hide` | |
20 | | `enable` | |
21 | | `disable` | |
22 | | `showProgress` | |
23 | | `hideProgress` | |
24 | | `setParams` | |
25 | | `onClick` | |
26 | | `version` | |
27 | | `isVersionAtLeast` | |
28 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-popup.md:
--------------------------------------------------------------------------------
1 | ### usePopup
2 |
3 | ```ts
4 | import { usePopup } from 'vue-tg'
5 |
6 | const popup = usePopup()
7 | ```
8 |
9 | | Name | Type |
10 | | :----------------- | :------------------------------------------------------------------------------------------------------------------ |
11 | | `showConfirm` |
|
12 | | `showAlert` |
|
13 | | `showPopup` |
|
14 | | `onClose` | A method that sets event handler. An alias for onPopupClosed
. |
15 | | `version` | |
16 | | `isVersionAtLeast` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-qr-scanner.md:
--------------------------------------------------------------------------------
1 | ### useQrScanner
2 |
3 | ```ts
4 | import { useQrScanner } from 'vue-tg'
5 |
6 | const qrScanner = useQrScanner()
7 | ```
8 |
9 | | Name | Description |
10 | | :----------------- | :------------------------------------------------------------------------------------------------------------------------ |
11 | | `show` |
|
12 | | `close` | |
13 | | `onScan` | A method that sets event handler. An alias for onQrTextReceived
. |
14 | | `onClose` | A method that sets event handler. An alias for onScanQrPopupClosed
. |
15 | | `version` | |
16 | | `isVersionAtLeast` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-secondary-button.md:
--------------------------------------------------------------------------------
1 | ### useSecondaryButton
2 |
3 | ```ts
4 | import { useSecondaryButton } from 'vue-tg'
5 |
6 | const secondaryButton = useSecondaryButton()
7 | ```
8 |
9 | | Name | Description |
10 | | :------------------ | :-------------------------------------------------------------------------------------------------------- |
11 | | `text` |
|
12 | | `color` |
|
13 | | `textColor` |
|
14 | | `isVisible` |
|
15 | | `isActive` |
|
16 | | `isProgressVisible` |
|
17 | | `hasShineEffect` |
|
18 | | `position` |
|
19 | | `show` | |
20 | | `hide` | |
21 | | `enable` | |
22 | | `disable` | |
23 | | `showProgress` | |
24 | | `hideProgress` | |
25 | | `setParams` | |
26 | | `onClick` | |
27 | | `version` | |
28 | | `isVersionAtLeast` | |
29 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-secure-storage.md:
--------------------------------------------------------------------------------
1 | ### useSecureStorage
2 |
3 | ```ts
4 | import { useSecureStorage } from 'vue-tg'
5 |
6 | const secureStorage = useSecureStorage()
7 | ```
8 |
9 | | Name | Type |
10 | | :----------------- | :------------------------------------------------------------------------------------------------- |
11 | | `setItem` |
|
12 | | `getItem` |
|
13 | | `restoreItem` |
|
14 | | `removeItem` |
|
15 | | `clear` |
|
16 | | `version` | |
17 | | `isVersionAtLeast` | |
18 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-settings-button.md:
--------------------------------------------------------------------------------
1 | ### useSettingsButton
2 |
3 | ```ts
4 | import { useSettingsButton } from 'vue-tg'
5 |
6 | const settingsButton = useSettingsButton()
7 | ```
8 |
9 | | Name | Description |
10 | | :----------------- | :---------------------------------------------------------------------------------------------------- |
11 | | `isVisible` |
|
12 | | `show` | |
13 | | `hide` | |
14 | | `onClick` | |
15 | | `version` | |
16 | | `isVersionAtLeast` | |
17 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-theme.md:
--------------------------------------------------------------------------------
1 | ### useTheme
2 |
3 | ```ts
4 | import { useTheme } from 'vue-tg'
5 |
6 | const theme = useTheme()
7 | ```
8 |
9 | | Name | Description |
10 | | :----------------- | :------------------------------------------------------------------------------------------------------- |
11 | | `colorScheme` |
|
12 | | `themeParams` |
|
13 | | `headerColor` |
|
14 | | `backgroundColor` |
|
15 | | `bottomBarColor` |
|
16 | | `onChange` | A method that sets event handler. An alias for onThemeChanged
. |
17 | | `version` | |
18 | | `isVersionAtLeast` | |
19 |
--------------------------------------------------------------------------------
/docs/mini-apps/composables/use-viewport.md:
--------------------------------------------------------------------------------
1 | ### useViewport
2 |
3 | ```ts
4 | import { useViewport } from 'vue-tg'
5 |
6 | const viewport = useViewport()
7 | ```
8 |
9 | | Name | Description |
10 | | :------------------------ | :----------------------------------------------------------------------------------------------------------------------------- |
11 | | `isExpanded` |
|
12 | | `expand` | |
13 | | `viewportHeight` |
|
14 | | `viewportStableHeight` |
|
15 | | `onChange` | A method that sets event handler. An alias for onViewportChanged
. |
16 | | `isFullscreen` |
|
17 | | `onFullscreenChange` | A method that sets event handler. An alias for onFullscreenChanged
. |
18 | | `onFullscreenFail` | A method that sets event handler. An alias for onFullscreenFailed
. |
19 | | `isOrientationLocked` |
|
20 | | `isVerticalSwipesEnabled` |
|
21 | | `safeAreaInset` |
|
22 | | `onSafeAreaChange` | A method that sets event handler. An alias for onSafeAreaChanged
. |
23 | | `contentSafeAreaInset` |
|
24 | | `onContentSafeAreaChange` | A method that sets event handler. An alias for onContentSafeAreaChanged
. |
25 | | `version` | |
26 | | `isVersionAtLeast` | |
27 |
--------------------------------------------------------------------------------
/docs/widgets.md:
--------------------------------------------------------------------------------
1 | ---
2 | next: false
3 | outline: [2, 3]
4 | ---
5 |
6 | # Widgets
7 |
8 | [Official Telegram Widgets Documentation](https://core.telegram.org/widgets)
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
--------------------------------------------------------------------------------
/docs/widgets/discussion-widget.md:
--------------------------------------------------------------------------------
1 | ## Discussion Widget
2 |
3 |
4 |
5 |
6 | [Official documentation](https://core.telegram.org/widgets/discussion)
7 |
8 | A widget to embed discussions from any public channel on your website.
9 |
10 | ```vue
11 |
14 |
15 |
16 |
17 |
18 | ```
19 |
20 | #### Props
21 |
22 | | Name | Type | Description |
23 | | -------------- | ------- | --------------------------------------------------------------------------------- |
24 | | url | string | URL of the discussion. |
25 | | comments-limit | number | _Optional._ Limit on the number of comments. |
26 | | height | string | _Optional._ Height of the widget. |
27 | | color | string | _Optional._ Accent color. |
28 | | dark-color | string | _Optional._ Accent color in dark mode. |
29 | | dark | boolean | _Optional._ Indicates whether to use dark mode. |
30 | | colorful | boolean | _Optional._ Indicates whether to use different colors for names. |
31 | | tag | string | _Optional._ Specify a custom HTML-tag to wrap the widget.
Default is "div". |
32 |
--------------------------------------------------------------------------------
/docs/widgets/login-widget.md:
--------------------------------------------------------------------------------
1 | ## Login Widget
2 |
3 |
4 |
5 |
6 | [Official documentation](https://core.telegram.org/widgets/login)
7 |
8 | A widget to authorize users on your website.
9 |
10 | ```vue
11 |
19 |
20 |
21 |
25 |
26 | ```
27 |
28 | #### Props
29 |
30 | | Name | Type | Description |
31 | | ------------- | ------- | -------------------------------------------------------------------------------------- |
32 | | bot-username | string | Username of the bot. |
33 | | redirect-url | string | _Optional._ URL to redirect to after authentication. |
34 | | size | string | _Optional._ Size of the widget ("large", "medium", "small").
Default is "large". |
35 | | corner-radius | number | _Optional._ Corner radius of the button. |
36 | | user-photo | boolean | _Optional._ Display the user's profile photo. |
37 | | request-write | boolean | _Optional._ Request access to send messages from the bot. |
38 | | tag | string | _Optional._ Specify a custom HTML-tag to wrap the widget.
Default is "div". |
39 |
40 | #### Events
41 |
42 | | Name | Type | Description |
43 | | ---- | --------------------------------- | --------------------------------------------------------------------------------------------------------------- |
44 | | auth | `(user: LoginWidgetUser) => void` | Emits when the user is successfully authorized.
**Note:** does not emit when a redirect URL is specified. |
45 |
--------------------------------------------------------------------------------
/docs/widgets/post-widget.md:
--------------------------------------------------------------------------------
1 | ## Post Widget
2 |
3 |
4 |
5 |
6 | [Official documentation](https://core.telegram.org/widgets/post)
7 |
8 | A widget to embed messages from public groups and channels on your website.
9 |
10 | ```vue
11 |
14 |
15 |
16 |
17 |
18 | ```
19 |
20 | #### Props
21 |
22 | | Name | Type | Description |
23 | | ------------ | ------- | --------------------------------------------------------------------------------- |
24 | | url | string | URL of the post. |
25 | | width | string | _Optional._ Width of the widget. |
26 | | author-photo | boolean | _Optional._ Display the author's photo. |
27 | | color | string | _Optional._ Accent color. |
28 | | dark-color | string | _Optional._ Accent color in dark mode. |
29 | | dark | boolean | _Optional._ Indicates whether to use dark mode. |
30 | | tag | string | _Optional._ Specify a custom HTML-tag to wrap the widget.
Default is "div". |
31 |
--------------------------------------------------------------------------------
/docs/widgets/share-widget.md:
--------------------------------------------------------------------------------
1 | ## Share Widget
2 |
3 |
4 |
5 |
6 | [Official documentation](https://core.telegram.org/widgets/share)
7 |
8 | A widget to let users forward content from your website or app to their friends, channels or Saved Messages on Telegram.
9 |
10 | ```vue
11 |
14 |
15 |
16 |
20 |
21 | ```
22 |
23 | #### Props
24 |
25 | | Name | Type | Description |
26 | | -------- | ------- | --------------------------------------------------------------------------------- |
27 | | url | string | URL to share. |
28 | | comment | string | _Optional._ Additional comment to be included with the shared URL. |
29 | | size | string | _Optional._ Size of the widget ("large", "medium").
Default is "medium". |
30 | | no-label | boolean | _Optional._ If set to true, hides the label text on the widget button. |
31 | | tag | string | _Optional._ Specify a custom HTML-tag to wrap the widget.
Default is "div". |
32 |
--------------------------------------------------------------------------------
/eslint.config.mjs:
--------------------------------------------------------------------------------
1 | import antfu from '@antfu/eslint-config'
2 |
3 | export default antfu({
4 | rules: {
5 | 'ts/consistent-type-definitions': 'off',
6 | 'vue/valid-template-root': 'off',
7 | 'vue/require-component-is': 'off',
8 | 'vue/block-order': ['error', {
9 | order: ['template', 'script', 'style'],
10 | }],
11 | },
12 | ignores: [
13 | 'docs/**/*',
14 | ],
15 | })
16 |
--------------------------------------------------------------------------------
/src/components/Alert.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
25 |
--------------------------------------------------------------------------------
/src/components/BackButton.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
41 |
--------------------------------------------------------------------------------
/src/components/BiometricManager.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
17 |
--------------------------------------------------------------------------------
/src/components/ClosingConfirmation.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
19 |
--------------------------------------------------------------------------------
/src/components/Confirm.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
20 |
--------------------------------------------------------------------------------
/src/components/ExpandedViewport.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
37 |
--------------------------------------------------------------------------------
/src/components/FullscreenViewport.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
19 |
--------------------------------------------------------------------------------
/src/components/MainButton.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
111 |
--------------------------------------------------------------------------------
/src/components/Popup.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
33 |
--------------------------------------------------------------------------------
/src/components/ScanQr.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
31 |
--------------------------------------------------------------------------------
/src/components/SecondaryButton.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
121 |
--------------------------------------------------------------------------------
/src/components/SettingsButton.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
43 |
--------------------------------------------------------------------------------
/src/composables-legacy/index.ts:
--------------------------------------------------------------------------------
1 | export { useWebApp } from './useWebApp'
2 | export { useWebAppBackButton } from './useWebAppBackButton'
3 | export { useWebAppBiometricManager } from './useWebAppBiometricManager'
4 | export { useWebAppClipboard } from './useWebAppClipboard'
5 | export { useWebAppClosingConfirmation } from './useWebAppClosingConfirmation'
6 | export { useWebAppCloudStorage } from './useWebAppCloudStorage'
7 | export { useWebAppHapticFeedback } from './useWebAppHapticFeedback'
8 | export { useWebAppMainButton } from './useWebAppMainButton'
9 | export { useWebAppNavigation } from './useWebAppNavigation'
10 | export { useWebAppPopup } from './useWebAppPopup'
11 | export { useWebAppQrScanner } from './useWebAppQrScanner'
12 | export { useWebAppRequests } from './useWebAppRequests'
13 | export { useWebAppSendData } from './useWebAppSendData'
14 | export { useWebAppSettingsButton } from './useWebAppSettingsButton'
15 | export { useWebAppShare } from './useWebAppShare'
16 | export { useWebAppTheme } from './useWebAppTheme'
17 | export { useWebAppViewport } from './useWebAppViewport'
18 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebApp.ts:
--------------------------------------------------------------------------------
1 | import { useMiniApp } from '../composables/useMiniApp'
2 | import { onEvent } from '../events'
3 | import { getWebApp } from '../sdk'
4 |
5 | const featureSupportVersion = {
6 | ClosingConfirmation: '6.2',
7 | CloudStorage: '6.9',
8 | RequestWriteAccess: '6.9',
9 | RequestContact: '6.9',
10 | SettingsButton: '7.0',
11 | BiometricManager: '7.2',
12 | DisableVerticalSwipes: '7.7',
13 | }
14 | function isFeatureSupported(name: keyof typeof featureSupportVersion) {
15 | return getWebApp().isVersionAtLeast(featureSupportVersion[name])
16 | }
17 |
18 | /**
19 | * @deprecated Use [`useMiniApp`](https://vue-tg.deptyped.com/mini-apps.html#useminiapp) instead
20 | */
21 | export function useWebApp() {
22 | const webApp = getWebApp()
23 | const {
24 | initData,
25 | initDataUnsafe,
26 | version,
27 | isReady,
28 | platform,
29 | isPlatform,
30 | sendData,
31 | ready,
32 | close,
33 | } = useMiniApp('8.0')
34 |
35 | const isPlatformUnknown = isPlatform('unknown')
36 |
37 | const canSendData = !isPlatformUnknown && initData === ''
38 |
39 | return {
40 | initData,
41 | initDataUnsafe,
42 | version,
43 | platform,
44 | isVersionAtLeast: webApp.isVersionAtLeast,
45 | sendData,
46 | ready,
47 | close,
48 | isReady,
49 | isPlatform,
50 | isPlatformUnknown,
51 | isFeatureSupported,
52 | /**
53 | * @deprecated import directly from `vue-tg` instead.
54 | */
55 | onEvent,
56 | /**
57 | * @deprecated
58 | */
59 | canSendData,
60 | }
61 | }
62 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppBackButton.ts:
--------------------------------------------------------------------------------
1 | import { useBackButton } from '../composables/useBackButton'
2 | import { onBackButtonClicked } from '../events'
3 |
4 | /**
5 | * @deprecated Use [`useBackButton`](https://vue-tg.deptyped.com/mini-apps.html#usebackbutton) instead
6 | */
7 | export function useWebAppBackButton() {
8 | const backButton = useBackButton('8.0')
9 |
10 | return {
11 | isBackButtonVisible: backButton.isVisible,
12 | showBackButton: backButton.show,
13 | hideBackButton: backButton.hide,
14 | /**
15 | * @deprecated import directly from `vue-tg` instead.
16 | */
17 | onBackButtonClicked,
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppBiometricManager.ts:
--------------------------------------------------------------------------------
1 | import { useBiometricManager } from '../composables/useBiometricManager'
2 | import { onBiometricAuthRequested, onBiometricManagerUpdated, onBiometricTokenUpdated } from '../events'
3 |
4 | /**
5 | * @deprecated Use [`useBiometricManager`](https://vue-tg.deptyped.com/mini-apps.html#usebiometricmanager) instead
6 | */
7 | export function useWebAppBiometricManager() {
8 | const {
9 | isInited,
10 | isBiometricAvailable,
11 | biometricType,
12 | isAccessRequested,
13 | isAccessGranted,
14 | deviceId,
15 | isBiometricTokenSaved,
16 | init,
17 | authenticate,
18 | requestAccess,
19 | openSettings,
20 | updateToken,
21 | } = useBiometricManager('8.0')
22 |
23 | return {
24 | isBiometricInited: isInited,
25 | isBiometricAvailable,
26 | biometricType,
27 | isBiometricAccessRequested: isAccessRequested,
28 | isBiometricAccessGranted: isAccessGranted,
29 | isBiometricTokenSaved,
30 | biometricDeviceId: deviceId,
31 | initBiometric: init,
32 | requestBiometricAccess: requestAccess,
33 | authenticateBiometric: authenticate,
34 | updateBiometricToken: updateToken,
35 | openBiometricSettings: openSettings,
36 | /**
37 | * @deprecated import directly from `vue-tg` instead.
38 | */
39 | onBiometricManagerUpdated,
40 | /**
41 | * @deprecated import directly from `vue-tg` instead.
42 | */
43 | onBiometricAuthRequested,
44 | /**
45 | * @deprecated import directly from `vue-tg` instead.
46 | */
47 | onBiometricTokenUpdated,
48 | }
49 | }
50 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppClipboard.ts:
--------------------------------------------------------------------------------
1 | import { useClipboard } from '../composables/useClipboard'
2 | import { onClipboardTextReceived } from '../events'
3 |
4 | /**
5 | * @deprecated Use [`useClipboard`](https://vue-tg.deptyped.com/mini-apps.html#useclipboard) instead
6 | */
7 | export function useWebAppClipboard() {
8 | const { readText } = useClipboard('8.0')
9 |
10 | return {
11 | readTextFromClipboard: readText,
12 | /**
13 | * @deprecated import directly from `vue-tg` instead.
14 | */
15 | onClipboardTextReceived,
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppClosingConfirmation.ts:
--------------------------------------------------------------------------------
1 | import { useMiniApp } from '../composables/useMiniApp'
2 |
3 | /**
4 | * @deprecated Use [`useClosingConfirmation`](https://vue-tg.deptyped.com/mini-apps.html#useclosingconfirmation) instead
5 | */
6 | export function useWebAppClosingConfirmation() {
7 | const { isClosingConfirmationEnabled } = useMiniApp('8.0')
8 |
9 | return {
10 | isClosingConfirmationEnabled,
11 | enableClosingConfirmation() {
12 | isClosingConfirmationEnabled.value = true
13 | },
14 | disableClosingConfirmation() {
15 | isClosingConfirmationEnabled.value = false
16 | },
17 | }
18 | }
19 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppCloudStorage.ts:
--------------------------------------------------------------------------------
1 | import { useCloudStorage } from '../composables/useCloudStorage'
2 |
3 | /**
4 | * @deprecated Use [`useCloudStorage`](https://vue-tg.deptyped.com/mini-apps.html#usecloudstorage) instead
5 | */
6 | export function useWebAppCloudStorage() {
7 | const cloudStorage = useCloudStorage('8.0')
8 |
9 | return {
10 | setStorageItem: cloudStorage.setItem,
11 | getStorageItem: cloudStorage.getItem,
12 | getStorageItems: cloudStorage.getItems,
13 | removeStorageItem: cloudStorage.removeItem,
14 | removeStorageItems: cloudStorage.removeItems,
15 | getStorageKeys: cloudStorage.getKeys,
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppHapticFeedback.ts:
--------------------------------------------------------------------------------
1 | import { useHapticFeedback } from '../composables/useHapticFeedback'
2 |
3 | /**
4 | * @deprecated Use [`useHapticFeedback`](https://vue-tg.deptyped.com/mini-apps.html#usehapticfeedback) instead
5 | */
6 | export function useWebAppHapticFeedback() {
7 | const { impactOccurred, notificationOccurred, selectionChanged } = useHapticFeedback('8.0')
8 |
9 | return {
10 | impactOccurred,
11 | notificationOccurred,
12 | selectionChanged,
13 | }
14 | }
15 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppMainButton.ts:
--------------------------------------------------------------------------------
1 | import type { WebApp } from '../sdk'
2 | import { useMainButton } from '../composables/useMainButton'
3 | import { onMainButtonClicked } from '../events'
4 |
5 | /**
6 | * @deprecated Use [`useMainButton`](https://vue-tg.deptyped.com/mini-apps.html#usemainbutton) instead
7 | */
8 | export function useWebAppMainButton() {
9 | const mainButton = useMainButton('8.0')
10 |
11 | return {
12 | mainButtonText: mainButton.text,
13 | mainButtonColor: mainButton.color,
14 | mainButtonTextColor: mainButton.textColor,
15 | isMainButtonVisible: mainButton.isVisible,
16 | isMainButtonActive: mainButton.isActive,
17 | isMainButtonProgressVisible: mainButton.isProgressVisible,
18 | setMainButtonText(text: Parameters[0]) {
19 | mainButton.text.value = text
20 | },
21 | showMainButton: mainButton.show,
22 | hideMainButton: mainButton.hide,
23 | enableMainButton: mainButton.enable,
24 | disableMainButton: mainButton.disable,
25 | showMainButtonProgress: mainButton.showProgress,
26 | hideMainButtonProgress: mainButton.hideProgress,
27 | setMainButtonParams: mainButton.setParams,
28 | /**
29 | * @deprecated import directly from `vue-tg` instead.
30 | */
31 | onMainButtonClicked,
32 | }
33 | }
34 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppNavigation.ts:
--------------------------------------------------------------------------------
1 | import { useMiniApp } from '../composables/useMiniApp'
2 | import { onInvoiceClosed } from '../events'
3 |
4 | /**
5 | * @deprecated Use [`useMiniApp`](https://vue-tg.deptyped.com/mini-apps.html#useminiapp) instead
6 | */
7 | export function useWebAppNavigation() {
8 | const { switchInlineQuery, openLink, openTelegramLink, openInvoice } = useMiniApp('8.0')
9 |
10 | return {
11 | switchInlineQuery,
12 | openLink,
13 | openTelegramLink,
14 | openInvoice,
15 | /**
16 | * @deprecated import directly from `vue-tg` instead.
17 | */
18 | onInvoiceClosed,
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppPopup.ts:
--------------------------------------------------------------------------------
1 | import { usePopup } from '../composables/usePopup'
2 | import { onPopupClosed } from '../events'
3 |
4 | /**
5 | * @deprecated Use [`usePopup`](https://vue-tg.deptyped.com/mini-apps.html#usepopup) instead
6 | */
7 | export function useWebAppPopup() {
8 | const { showPopup, showAlert, showConfirm } = usePopup('8.0')
9 |
10 | return {
11 | showPopup,
12 | showAlert,
13 | showConfirm,
14 | /**
15 | * @deprecated import directly from `vue-tg` instead.
16 | */
17 | onPopupClosed,
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppQrScanner.ts:
--------------------------------------------------------------------------------
1 | import { useQrScanner } from '../composables/useQrScanner'
2 | import { onQrTextReceived, onScanQrPopupClosed } from '../events'
3 |
4 | /**
5 | * @deprecated Use [`useQrScanner`](https://vue-tg.deptyped.com/mini-apps.html#useqrscanner) instead
6 | */
7 | export function useWebAppQrScanner() {
8 | const qrScanner = useQrScanner('8.0')
9 |
10 | return {
11 | showScanQrPopup: qrScanner.show,
12 | closeScanQrPopup: qrScanner.close,
13 | /**
14 | * @deprecated import directly from `vue-tg` instead.
15 | */
16 | onQrTextReceived,
17 | /**
18 | * @deprecated import directly from `vue-tg` instead.
19 | */
20 | onScanQrPopupClosed,
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppRequests.ts:
--------------------------------------------------------------------------------
1 | import { useMiniApp } from '../composables/useMiniApp'
2 | import { onContactRequested, onWriteAccessRequested } from '../events'
3 |
4 | /**
5 | * @deprecated Use [`useMiniApp`](https://vue-tg.deptyped.com/mini-apps.html#useminiapp) instead
6 | */
7 | export function useWebAppRequests() {
8 | const { requestContact, requestWriteAccess } = useMiniApp('8.0')
9 |
10 | return {
11 | requestContact,
12 | requestWriteAccess,
13 | /**
14 | * @deprecated import directly from `vue-tg` instead.
15 | */
16 | onContactRequested,
17 | /**
18 | * @deprecated import directly from `vue-tg` instead.
19 | */
20 | onWriteAccessRequested,
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppSendData.ts:
--------------------------------------------------------------------------------
1 | import { ref } from 'vue'
2 | import { useMiniApp } from '../composables/useMiniApp'
3 |
4 | /**
5 | * @deprecated
6 | */
7 | export function useWebAppSendData(
8 | data: D,
9 | options: {
10 | serialize?: (data: D) => string
11 | },
12 | ) {
13 | const serialize = options.serialize ?? JSON.stringify
14 |
15 | const error = ref('')
16 | const setError = (errorMessage: string) => {
17 | error.value = errorMessage
18 | console.error(errorMessage)
19 | }
20 |
21 | const isLoading = ref(false)
22 |
23 | const { initData, initDataUnsafe, sendData, close } = useMiniApp('8.0')
24 |
25 | return {
26 | error,
27 | isLoading,
28 | execute: () => {
29 | sendData(serialize(data))
30 |
31 | setTimeout(
32 | () =>
33 | setError(
34 | 'Telegram.WebApp.sendData is only available for custom keyboards.',
35 | ),
36 | 1_000,
37 | )
38 | },
39 | executeHttp: async (
40 | callbackUrl: string,
41 | options: { closeAfter?: boolean } = {},
42 | ) => {
43 | const closeAfter = options.closeAfter ?? true
44 | isLoading.value = true
45 | try {
46 | const response = await fetch(callbackUrl, {
47 | method: 'POST',
48 | body: JSON.stringify({
49 | initData,
50 | initDataUnsafe,
51 | data: serialize(data),
52 | }),
53 | })
54 |
55 | if (!response.ok)
56 | setError(`${response.status} ${response.statusText}`)
57 |
58 | if (response.ok && closeAfter)
59 | close()
60 |
61 | return response
62 | }
63 | catch (err) {
64 | setError(String(err))
65 | }
66 | finally {
67 | isLoading.value = false
68 | }
69 | },
70 | }
71 | }
72 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppSettingsButton.ts:
--------------------------------------------------------------------------------
1 | import { useSettingsButton } from '../composables/useSettingsButton'
2 | import { onSettingsButtonClicked } from '../events'
3 |
4 | /**
5 | * @deprecated Use [`useSettingsButton`](https://vue-tg.deptyped.com/mini-apps.html#usesettingsbutton) instead
6 | */
7 | export function useWebAppSettingsButton() {
8 | const settingsButton = useSettingsButton('8.0')
9 |
10 | return {
11 | isSettingsButtonVisible: settingsButton.isVisible,
12 | showSettingsButton: settingsButton.show,
13 | hideSettingsButton: settingsButton.hide,
14 | /**
15 | * @deprecated import directly from `vue-tg` instead.
16 | */
17 | onSettingsButtonClicked,
18 | }
19 | }
20 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppShare.ts:
--------------------------------------------------------------------------------
1 | import { useMiniApp } from '../composables/useMiniApp'
2 |
3 | /**
4 | * @deprecated Use [`useMiniApp`](https://vue-tg.deptyped.com/mini-apps.html#useminiapp) instead
5 | */
6 | export function useWebAppShare() {
7 | const { shareToStory } = useMiniApp('8.0')
8 |
9 | return {
10 | shareToStory,
11 | }
12 | }
13 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppTheme.ts:
--------------------------------------------------------------------------------
1 | import type { WebApp } from '../sdk'
2 | import { useTheme } from '../composables/useTheme'
3 | import { onThemeChanged } from '../events'
4 |
5 | /**
6 | * @deprecated Use [`useTheme`](https://vue-tg.deptyped.com/mini-apps.html#usetheme) instead
7 | */
8 | export function useWebAppTheme() {
9 | const {
10 | colorScheme,
11 | themeParams,
12 | headerColor,
13 | backgroundColor,
14 | } = useTheme('8.0')
15 |
16 | return {
17 | colorScheme,
18 | themeParams,
19 | headerColor,
20 | backgroundColor,
21 | setHeaderColor(color: Parameters[0] | undefined) {
22 | if (color)
23 | headerColor.value = color
24 | },
25 | setBackgroundColor(color: Parameters[0] | undefined) {
26 | if (color)
27 | backgroundColor.value = color
28 | },
29 | /**
30 | * @deprecated import directly from `vue-tg` instead.
31 | */
32 | onThemeChanged,
33 | }
34 | }
35 |
--------------------------------------------------------------------------------
/src/composables-legacy/useWebAppViewport.ts:
--------------------------------------------------------------------------------
1 | import { useViewport } from '../composables/useViewport'
2 | import { onViewportChanged } from '../events'
3 |
4 | /**
5 | * @deprecated Use [`useViewport`](https://vue-tg.deptyped.com/mini-apps.html#useviewport) instead
6 | */
7 | export function useWebAppViewport() {
8 | const {
9 | isExpanded,
10 | expand,
11 | viewportHeight,
12 | viewportStableHeight,
13 | isVerticalSwipesEnabled,
14 | } = useViewport('8.0')
15 |
16 | return {
17 | isExpanded,
18 | viewportHeight,
19 | viewportStableHeight,
20 | expand,
21 | isVerticalSwipesEnabled,
22 | enableVerticalSwipes() {
23 | isVerticalSwipesEnabled.value = true
24 | },
25 | disableVerticalSwipes() {
26 | isVerticalSwipesEnabled.value = false
27 | },
28 | /**
29 | * @deprecated import directly from `vue-tg` instead.
30 | */
31 | onViewportChanged,
32 | }
33 | }
34 |
--------------------------------------------------------------------------------
/src/composables/useBackButton.ts:
--------------------------------------------------------------------------------
1 | import type { BotApiPrevVersion, BotApiVersion, BotApiVersionRange, LATEST_VERSION, Merge, VersionedReturnType } from '../types'
2 | import { computed, readonly, ref } from 'vue'
3 | import { onBackButtonClicked } from '../events'
4 | import { getWebApp } from '../sdk'
5 | import { defineStore, getHighestVersion, isVersionGreaterOrEqual, wrapFunction } from '../utils'
6 |
7 | type v60 = ReturnType
8 | type v61 = ReturnType
9 |
10 | export type Schema = {
11 | '6.0': Merge, v60>
12 | '6.1': Merge
13 | }
14 |
15 | export type BackButton =
16 | | (Schema['6.0'] & { version: BotApiVersionRange<'6.0', BotApiPrevVersion<'6.1'>> })
17 | | (Schema['6.1'] & { version: BotApiVersionRange<'6.1', LATEST_VERSION> })
18 |
19 | const useStore = defineStore(() => {
20 | const webApp = getWebApp()
21 | const isVisible = ref(webApp.BackButton.isVisible)
22 |
23 | const updateState = () => {
24 | isVisible.value = webApp.BackButton.isVisible
25 | }
26 |
27 | return {
28 | webApp,
29 | isVisible,
30 | updateState,
31 | }
32 | })
33 |
34 | function useBackButton60() {
35 | const {
36 | isVisible,
37 | } = useStore()
38 |
39 | return {
40 | isVisible: readonly(isVisible),
41 | }
42 | }
43 |
44 | function useBackButton61() {
45 | const {
46 | webApp,
47 | isVisible,
48 | updateState,
49 | } = useStore()
50 |
51 | const show = wrapFunction(webApp.BackButton.show, {
52 | hooks: {
53 | after: updateState,
54 | },
55 | omitReturn: true,
56 | })
57 | const hide = wrapFunction(webApp.BackButton.hide, {
58 | hooks: {
59 | after: updateState,
60 | },
61 | omitReturn: true,
62 | })
63 |
64 | return {
65 | isVisible: computed({
66 | get() {
67 | return isVisible.value
68 | },
69 | set(isVisible) {
70 | if (isVisible)
71 | show()
72 | else
73 | hide()
74 | },
75 | }),
76 | show,
77 | hide,
78 | onClick: onBackButtonClicked,
79 | }
80 | }
81 |
82 | export function useBackButton(baseVersion: Version) {
83 | const { webApp } = useStore()
84 | const version = getHighestVersion(baseVersion, webApp.version)
85 |
86 | return {
87 | version: webApp.version,
88 | isVersionAtLeast: webApp.isVersionAtLeast,
89 | ...useBackButton60(),
90 | ...(isVersionGreaterOrEqual(version, '6.1') && useBackButton61()),
91 | } as VersionedReturnType
92 | }
93 |
--------------------------------------------------------------------------------
/src/composables/useClipboard.ts:
--------------------------------------------------------------------------------
1 | import type { WebAppCallback } from '../sdk'
2 | import type { BotApiPrevVersion, BotApiVersion, BotApiVersionRange, LATEST_VERSION, Merge, VersionedReturnType } from '../types'
3 | import { onClipboardTextReceived } from '../events'
4 | import { getWebApp } from '../sdk'
5 | import { defineStore, getHighestVersion, isVersionGreaterOrEqual, promisify } from '../utils'
6 |
7 | type v64 = ReturnType
8 |
9 | export type Schema = {
10 | '6.0': Merge, object>
11 | '6.4': Merge
12 | }
13 |
14 | export type Clipboard =
15 | | (Schema['6.0'] & { version: BotApiVersionRange<'6.0', BotApiPrevVersion<'6.4'>> })
16 | | (Schema['6.4'] & { version: BotApiVersionRange<'6.4', LATEST_VERSION> })
17 |
18 | const useStore = defineStore(() => {
19 | const webApp = getWebApp()
20 |
21 | return {
22 | webApp,
23 | }
24 | })
25 |
26 | function useClipboard64() {
27 | const {
28 | webApp,
29 | } = useStore()
30 |
31 | const readTextFromClipboardAsync = promisify(webApp.readTextFromClipboard)
32 |
33 | function readTextFromClipboard(): ReturnType
34 | function readTextFromClipboard(callback?: WebAppCallback['readTextFromClipboard']): void
35 | function readTextFromClipboard(callback?: WebAppCallback['readTextFromClipboard']): ReturnType | void {
36 | if (callback)
37 | webApp.readTextFromClipboard(callback)
38 | else
39 | return readTextFromClipboardAsync()
40 | }
41 |
42 | return {
43 | readText: readTextFromClipboard,
44 | onReadText: onClipboardTextReceived,
45 | }
46 | }
47 |
48 | export function useClipboard(baseVersion: Version) {
49 | const { webApp } = useStore()
50 | const version = getHighestVersion(baseVersion, webApp.version)
51 |
52 | return {
53 | version: webApp.version,
54 | isVersionAtLeast: webApp.isVersionAtLeast,
55 | ...(isVersionGreaterOrEqual(version, '6.4') && useClipboard64()),
56 | } as VersionedReturnType
57 | }
58 |
--------------------------------------------------------------------------------
/src/composables/useDeviceStorage.ts:
--------------------------------------------------------------------------------
1 | import type { DeviceStorageCallback } from '../sdk/device-storage'
2 | import type { BotApiPrevVersion, BotApiVersion, BotApiVersionRange, LATEST_VERSION, Merge, VersionedReturnType } from '../types'
3 | import { getWebApp } from '../sdk'
4 | import { defineStore, getHighestVersion, isVersionGreaterOrEqual, promisify, promisifyWithError } from '../utils'
5 |
6 | type v90 = ReturnType
7 |
8 | export type Schema = {
9 | '6.0': Merge, object>
10 | '9.0': Merge
11 | }
12 |
13 | export type DeviceStorage =
14 | | (Schema['6.0'] & { version: BotApiVersionRange<'6.0', BotApiPrevVersion<'9.0'>> })
15 | | (Schema['9.0'] & { version: BotApiVersionRange<'9.0', LATEST_VERSION> })
16 |
17 | const useStore = defineStore(() => {
18 | const webApp = getWebApp()
19 |
20 | return {
21 | webApp,
22 | }
23 | })
24 |
25 | function useDeviceStorage90() {
26 | const {
27 | webApp,
28 | } = useStore()
29 |
30 | const setItemAsync = promisifyWithError(webApp.DeviceStorage.setItem)
31 |
32 | function setItem(key: string, value: string): ReturnType
33 | function setItem(key: string, value: string, callback?: DeviceStorageCallback['setItem']): void
34 | function setItem(key: string, value: string, callback?: DeviceStorageCallback['setItem']): ReturnType | void {
35 | if (callback)
36 | webApp.DeviceStorage.setItem(key, value, callback)
37 | else
38 | return setItemAsync(key, value)
39 | }
40 |
41 | const getItemAsync = promisifyWithError(webApp.DeviceStorage.getItem)
42 |
43 | function getItem(key: string): ReturnType
44 | function getItem(key: string, callback?: DeviceStorageCallback['getItem']): void
45 | function getItem(key: string, callback?: DeviceStorageCallback['getItem']): ReturnType | void {
46 | if (callback)
47 | webApp.DeviceStorage.getItem(key, callback)
48 | else
49 | return getItemAsync(key)
50 | }
51 |
52 | const removeItemAsync = promisifyWithError(webApp.DeviceStorage.removeItem)
53 |
54 | function removeItem(key: string): ReturnType
55 | function removeItem(key: string, callback?: DeviceStorageCallback['removeItem']): void
56 | function removeItem(key: string, callback?: DeviceStorageCallback['removeItem']): ReturnType | void {
57 | if (callback)
58 | webApp.DeviceStorage.removeItem(key, callback)
59 | else
60 | return removeItemAsync(key)
61 | }
62 |
63 | const clearAsync = promisify(webApp.DeviceStorage.clear)
64 |
65 | function clear(): ReturnType
66 | function clear(callback?: DeviceStorageCallback['clear']): void
67 | function clear(callback?: DeviceStorageCallback['clear']): ReturnType | void {
68 | if (callback)
69 | webApp.DeviceStorage.clear(callback)
70 | else
71 | return clearAsync()
72 | }
73 |
74 | return {
75 | setItem,
76 | getItem,
77 | removeItem,
78 | clear,
79 | }
80 | }
81 |
82 | export function useDeviceStorage(baseVersion: Version) {
83 | const { webApp } = useStore()
84 | const version = getHighestVersion(baseVersion, webApp.version)
85 |
86 | return {
87 | version: webApp.version,
88 | isVersionAtLeast: webApp.isVersionAtLeast,
89 | ...(isVersionGreaterOrEqual(version, '9.0') && useDeviceStorage90()),
90 | } as VersionedReturnType
91 | }
92 |
--------------------------------------------------------------------------------
/src/composables/useEmojiStatus.ts:
--------------------------------------------------------------------------------
1 | import type { EmojiStatusParams, WebAppCallback } from '../sdk'
2 | import type {
3 | BotApiPrevVersion,
4 | BotApiVersion,
5 | BotApiVersionRange,
6 | LATEST_VERSION,
7 | Merge,
8 | VersionedReturnType,
9 | } from '../types'
10 | import { onEmojiStatusAccessRequested, onEmojiStatusFailed, onEmojiStatusSet } from '../events'
11 | import { getWebApp } from '../sdk'
12 | import { defineStore, getHighestVersion, isVersionGreaterOrEqual, promisify } from '../utils'
13 |
14 | type v80 = ReturnType
15 |
16 | export type Schema = {
17 | '6.0': Merge, object>
18 | '8.0': Merge
19 | }
20 |
21 | export type EmojiStatus =
22 | | (Schema['6.0'] & { version: BotApiVersionRange<'6.0', BotApiPrevVersion<'8.0'>> })
23 | | (Schema['8.0'] & { version: BotApiVersionRange<'8.0', LATEST_VERSION> })
24 |
25 | const useStore = defineStore(() => {
26 | const webApp = getWebApp()
27 |
28 | return {
29 | webApp,
30 | }
31 | })
32 |
33 | function useEmojiStatus80() {
34 | const {
35 | webApp,
36 | } = useStore()
37 |
38 | const setEmojiStatusAsync = promisify(webApp.setEmojiStatus)
39 |
40 | function setEmojiStatus(custom_emoji_id: string, params: EmojiStatusParams): ReturnType
41 | function setEmojiStatus(custom_emoji_id: string, params: EmojiStatusParams, callback?: WebAppCallback['setEmojiStatus']): void
42 | function setEmojiStatus(custom_emoji_id: string, params: EmojiStatusParams, callback?: WebAppCallback['setEmojiStatus']): ReturnType | void {
43 | if (callback)
44 | webApp.setEmojiStatus(custom_emoji_id, params, callback)
45 | else
46 | return setEmojiStatusAsync(custom_emoji_id, params)
47 | }
48 |
49 | const requestEmojiStatusAccessAsync = promisify(webApp.requestEmojiStatusAccess)
50 |
51 | function requestEmojiStatusAccess(): ReturnType
52 | function requestEmojiStatusAccess(callback?: WebAppCallback['requestEmojiStatusAccess']): void
53 | function requestEmojiStatusAccess(callback?: WebAppCallback['requestEmojiStatusAccess']): ReturnType | void {
54 | if (callback)
55 | webApp.requestEmojiStatusAccess(callback)
56 | else
57 | return requestEmojiStatusAccessAsync()
58 | }
59 |
60 | return {
61 | set: setEmojiStatus,
62 | requestAccess: requestEmojiStatusAccess,
63 | onSet: onEmojiStatusSet,
64 | onFail: onEmojiStatusFailed,
65 | onAccessRequest: onEmojiStatusAccessRequested,
66 | }
67 | }
68 |
69 | export function useEmojiStatus(baseVersion: Version) {
70 | const { webApp } = useStore()
71 | const version = getHighestVersion(baseVersion, webApp.version)
72 |
73 | return {
74 | version: webApp.version,
75 | isVersionAtLeast: webApp.isVersionAtLeast,
76 | ...(isVersionGreaterOrEqual(version, '8.0') && useEmojiStatus80()),
77 | } as VersionedReturnType
78 | }
79 |
--------------------------------------------------------------------------------
/src/composables/useHapticFeedback.ts:
--------------------------------------------------------------------------------
1 | import type { BotApiPrevVersion, BotApiVersion, BotApiVersionRange, LATEST_VERSION, Merge, VersionedReturnType } from '../types'
2 | import { getWebApp } from '../sdk'
3 | import { defineStore, getHighestVersion, isVersionGreaterOrEqual, wrapFunction } from '../utils'
4 |
5 | export type v61 = ReturnType
6 |
7 | export type Schema = {
8 | '6.0': Merge, object>
9 | '6.1': Merge
10 | }
11 |
12 | export type HapticFeedback =
13 | | (Schema['6.0'] & { version: BotApiVersionRange<'6.0', BotApiPrevVersion<'6.1'>> })
14 | | (Schema['6.1'] & { version: BotApiVersionRange<'6.1', LATEST_VERSION> })
15 |
16 | const useStore = defineStore(() => {
17 | const webApp = getWebApp()
18 |
19 | return {
20 | webApp,
21 | }
22 | })
23 |
24 | function useHapticFeedback61() {
25 | const {
26 | webApp,
27 | } = useStore()
28 |
29 | const impactOccurred = wrapFunction(webApp.HapticFeedback.impactOccurred, {
30 | omitReturn: true,
31 | })
32 | const notificationOccurred = wrapFunction(webApp.HapticFeedback.notificationOccurred, {
33 | omitReturn: true,
34 | })
35 | const selectionChanged = wrapFunction(webApp.HapticFeedback.selectionChanged, {
36 | omitReturn: true,
37 | })
38 |
39 | return {
40 | impactOccurred,
41 | notificationOccurred,
42 | selectionChanged,
43 | }
44 | }
45 |
46 | export function useHapticFeedback(baseVersion: Version) {
47 | const { webApp } = useStore()
48 | const version = getHighestVersion(baseVersion, webApp.version)
49 |
50 | return {
51 | version: webApp.version,
52 | isVersionAtLeast: webApp.isVersionAtLeast,
53 | ...(isVersionGreaterOrEqual(version, '6.1') && useHapticFeedback61()),
54 | } as VersionedReturnType
55 | }
56 |
--------------------------------------------------------------------------------
/src/composables/useHomeScreen.ts:
--------------------------------------------------------------------------------
1 | import type { WebAppCallback } from '../sdk'
2 | import type {
3 | BotApiPrevVersion,
4 | BotApiVersion,
5 | BotApiVersionRange,
6 | LATEST_VERSION,
7 | Merge,
8 | VersionedReturnType,
9 | } from '../types'
10 | import { onHomeScreenAdded, onHomeScreenChecked } from '../events'
11 | import { getWebApp } from '../sdk'
12 | import { defineStore, getHighestVersion, isVersionGreaterOrEqual, promisify } from '../utils'
13 |
14 | type v80 = ReturnType
15 |
16 | export type Schema = {
17 | '6.0': Merge, object>
18 | '8.0': Merge
19 | }
20 |
21 | export type HomeScreen =
22 | | (Schema['6.0'] & { version: BotApiVersionRange<'6.0', BotApiPrevVersion<'8.0'>> })
23 | | (Schema['8.0'] & { version: BotApiVersionRange<'8.0', LATEST_VERSION> })
24 |
25 | const useStore = defineStore(() => {
26 | const webApp = getWebApp()
27 |
28 | return {
29 | webApp,
30 | }
31 | })
32 |
33 | function useHomeScreen80() {
34 | const {
35 | webApp,
36 | } = useStore()
37 |
38 | const checkHomeScreenStatusAsync = promisify(webApp.checkHomeScreenStatus)
39 |
40 | function checkHomeScreenStatus(): ReturnType
41 | function checkHomeScreenStatus(callback?: WebAppCallback['checkHomeScreenStatus']): void
42 | function checkHomeScreenStatus(callback?: WebAppCallback['checkHomeScreenStatus']): ReturnType | void {
43 | if (callback)
44 | webApp.checkHomeScreenStatus(callback)
45 | else
46 | return checkHomeScreenStatusAsync()
47 | }
48 |
49 | return {
50 | addShortcut: webApp.addToHomeScreen,
51 | checkShortcutStatus: checkHomeScreenStatus,
52 | onShortcutAdd: onHomeScreenAdded,
53 | onShortcutCheck: onHomeScreenChecked,
54 | }
55 | }
56 |
57 | export function useHomeScreen(baseVersion: Version) {
58 | const { webApp } = useStore()
59 | const version = getHighestVersion(baseVersion, webApp.version)
60 |
61 | return {
62 | version: webApp.version,
63 | isVersionAtLeast: webApp.isVersionAtLeast,
64 | ...(isVersionGreaterOrEqual(version, '8.0') && useHomeScreen80()),
65 | } as VersionedReturnType
66 | }
67 |
--------------------------------------------------------------------------------
/src/composables/usePopup.ts:
--------------------------------------------------------------------------------
1 | import type { PopupParams, WebAppCallback } from '../sdk'
2 | import type {
3 | BotApiPrevVersion,
4 | BotApiVersion,
5 | BotApiVersionRange,
6 | LATEST_VERSION,
7 | Merge,
8 | VersionedReturnType,
9 | } from '../types'
10 | import { onPopupClosed } from '../events'
11 | import { getWebApp } from '../sdk'
12 | import { defineStore, getHighestVersion, isVersionGreaterOrEqual, promisify, promisifyWithNoData } from '../utils'
13 |
14 | type v62 = ReturnType
15 |
16 | export type Schema = {
17 | '6.0': Merge, object>
18 | '6.2': Merge
19 | }
20 |
21 | export type Popup =
22 | | (Schema['6.0'] & { version: BotApiVersionRange<'6.0', BotApiPrevVersion<'6.2'>> })
23 | | (Schema['6.2'] & { version: BotApiVersionRange<'6.2', LATEST_VERSION> })
24 |
25 | const useStore = defineStore(() => {
26 | const webApp = getWebApp()
27 |
28 | return {
29 | webApp,
30 | }
31 | })
32 |
33 | function usePopup62() {
34 | const {
35 | webApp,
36 | } = useStore()
37 |
38 | const showConfirmAsync = promisify(webApp.showConfirm)
39 |
40 | function showConfirm(message: string): ReturnType
41 | function showConfirm(message: string, callback?: WebAppCallback['showConfirm']): void
42 | function showConfirm(message: string, callback?: WebAppCallback['showConfirm']): ReturnType | void {
43 | if (callback)
44 | webApp.showConfirm(message, callback)
45 | else
46 | return showConfirmAsync(message)
47 | }
48 |
49 | const showAlertAsync = promisifyWithNoData(webApp.showAlert)
50 |
51 | function showAlert(message: string): ReturnType
52 | function showAlert(message: string, callback?: WebAppCallback['showAlert']): void
53 | function showAlert(message: string, callback?: WebAppCallback['showAlert']): ReturnType | void {
54 | if (callback)
55 | webApp.showAlert(message, callback)
56 | else
57 | return showAlertAsync(message)
58 | }
59 |
60 | const showPopupAsync = promisify(webApp.showPopup)
61 |
62 | function showPopup(params: PopupParams): ReturnType
63 | function showPopup(params: PopupParams, callback?: WebAppCallback['showPopup']): void
64 | function showPopup(params: PopupParams, callback?: WebAppCallback['showPopup']): ReturnType | void {
65 | if (callback)
66 | webApp.showPopup(params, callback)
67 | else
68 | return showPopupAsync(params)
69 | }
70 |
71 | return {
72 | showConfirm,
73 | showAlert,
74 | showPopup,
75 | onClose: onPopupClosed,
76 | }
77 | }
78 |
79 | export function usePopup(baseVersion: Version) {
80 | const { webApp } = useStore()
81 | const version = getHighestVersion(baseVersion, webApp.version)
82 |
83 | return {
84 | version: webApp.version,
85 | isVersionAtLeast: webApp.isVersionAtLeast,
86 | ...(isVersionGreaterOrEqual(version, '6.2') && usePopup62()),
87 | } as VersionedReturnType
88 | }
89 |
--------------------------------------------------------------------------------
/src/composables/useQrScanner.ts:
--------------------------------------------------------------------------------
1 | import type { ScanQrPopupParams, WebAppCallback } from '../sdk'
2 | import type { BotApiPrevVersion, BotApiVersion, BotApiVersionRange, LATEST_VERSION, Merge, VersionedReturnType } from '../types'
3 | import { onQrTextReceived, onScanQrPopupClosed } from '../events'
4 | import { getWebApp } from '../sdk'
5 | import { defineStore, getHighestVersion, isVersionGreaterOrEqual, promisify } from '../utils'
6 |
7 | type v64 = ReturnType
8 | type v77 = ReturnType
9 |
10 | export type Schema = {
11 | '6.0': Merge, object>
12 | '6.4': Merge
13 | '7.7': Merge
14 | }
15 |
16 | export type QrScanner =
17 | | (Schema['6.0'] & { version: BotApiVersionRange<'6.0', BotApiPrevVersion<'6.4'>> })
18 | | (Schema['6.4'] & { version: BotApiVersionRange<'6.4', BotApiPrevVersion<'7.7'>> })
19 | | (Schema['7.7'] & { version: BotApiVersionRange<'7.7', LATEST_VERSION> })
20 |
21 | const useStore = defineStore(() => {
22 | const webApp = getWebApp()
23 |
24 | return {
25 | webApp,
26 | }
27 | })
28 |
29 | function useQrScanner64() {
30 | const {
31 | webApp,
32 | } = useStore()
33 |
34 | const showScanQrPopupAsync = promisify(webApp.showScanQrPopup)
35 |
36 | function showScanQrPopup(params: ScanQrPopupParams): ReturnType
37 | function showScanQrPopup(params: ScanQrPopupParams, callback?: WebAppCallback['showScanQrPopup']): void
38 | function showScanQrPopup(params: ScanQrPopupParams, callback?: WebAppCallback['showScanQrPopup']): ReturnType | void {
39 | if (callback)
40 | webApp.showScanQrPopup(params, callback)
41 | else
42 | return showScanQrPopupAsync(params)
43 | }
44 |
45 | return {
46 | show: showScanQrPopup,
47 | close: webApp.closeScanQrPopup,
48 | onScan: onQrTextReceived,
49 | }
50 | }
51 |
52 | function useQrScanner77() {
53 | return {
54 | onClose: onScanQrPopupClosed,
55 | }
56 | }
57 |
58 | export function useQrScanner(baseVersion: Version) {
59 | const { webApp } = useStore()
60 | const version = getHighestVersion(baseVersion, webApp.version)
61 |
62 | return {
63 | version: webApp.version,
64 | isVersionAtLeast: webApp.isVersionAtLeast,
65 | ...(isVersionGreaterOrEqual(version, '6.4') && useQrScanner64()),
66 | ...(isVersionGreaterOrEqual(version, '7.7') && useQrScanner77()),
67 | } as VersionedReturnType
68 | }
69 |
--------------------------------------------------------------------------------
/src/composables/useSettingsButton.ts:
--------------------------------------------------------------------------------
1 | import type {
2 | BotApiPrevVersion,
3 | BotApiVersion,
4 | BotApiVersionRange,
5 | LATEST_VERSION,
6 | Merge,
7 | VersionedReturnType,
8 | } from '../types'
9 | import { computed, readonly, ref } from 'vue'
10 | import { onSettingsButtonClicked } from '../events'
11 | import { getWebApp } from '../sdk'
12 | import { defineStore, getHighestVersion, isVersionGreaterOrEqual, wrapFunction } from '../utils'
13 |
14 | type v60 = ReturnType
15 | type v70 = ReturnType
16 |
17 | export type Schema = {
18 | '6.0': Merge, v60>
19 | '7.0': Merge
20 | }
21 |
22 | export type SettingsButton =
23 | | (Schema['6.0'] & { version: BotApiVersionRange<'6.0', BotApiPrevVersion<'7.0'>> })
24 | | (Schema['7.0'] & { version: BotApiVersionRange<'7.0', LATEST_VERSION> })
25 |
26 | const useStore = defineStore(() => {
27 | const webApp = getWebApp()
28 | const isVisible = ref(webApp.SettingsButton.isVisible)
29 |
30 | const updateState = () => {
31 | isVisible.value = webApp.SettingsButton.isVisible
32 | }
33 |
34 | return {
35 | webApp,
36 | isVisible,
37 | updateState,
38 | }
39 | })
40 |
41 | function useSettingsButton60() {
42 | const {
43 | isVisible,
44 | } = useStore()
45 |
46 | return {
47 | isVisible: readonly(isVisible),
48 | }
49 | }
50 |
51 | function useSettingsButton70() {
52 | const {
53 | webApp,
54 | isVisible,
55 | updateState,
56 | } = useStore()
57 |
58 | const show = wrapFunction(webApp.SettingsButton.show, {
59 | hooks: {
60 | after: updateState,
61 | },
62 | omitReturn: true,
63 | })
64 | const hide = wrapFunction(webApp.SettingsButton.hide, {
65 | hooks: {
66 | after: updateState,
67 | },
68 | omitReturn: true,
69 | })
70 |
71 | return {
72 | isVisible: computed({
73 | get() {
74 | return isVisible.value
75 | },
76 | set(isVisible) {
77 | if (isVisible)
78 | show()
79 | else
80 | hide()
81 | },
82 | }),
83 | show,
84 | hide,
85 | onClick: onSettingsButtonClicked,
86 | }
87 | }
88 |
89 | export function useSettingsButton(baseVersion: Version) {
90 | const { webApp } = useStore()
91 | const version = getHighestVersion(baseVersion, webApp.version)
92 |
93 | return {
94 | version: webApp.version,
95 | isVersionAtLeast: webApp.isVersionAtLeast,
96 | ...useSettingsButton60(),
97 | ...(isVersionGreaterOrEqual(version, '7.0') && useSettingsButton70()),
98 | } as VersionedReturnType
99 | }
100 |
--------------------------------------------------------------------------------
/src/index.ts:
--------------------------------------------------------------------------------
1 | import type { App } from 'vue'
2 |
3 | import Alert from './components/Alert.vue'
4 | import BackButton from './components/BackButton.vue'
5 | import BiometricManager from './components/BiometricManager.vue'
6 | import ClosingConfirmation from './components/ClosingConfirmation.vue'
7 | import Confirm from './components/Confirm.vue'
8 | import ExpandedViewport from './components/ExpandedViewport.vue'
9 | import FullscreenViewport from './components/FullscreenViewport.vue'
10 | import MainButton from './components/MainButton.vue'
11 | import Popup from './components/Popup.vue'
12 | import ScanQr from './components/ScanQr.vue'
13 | import SecondaryButton from './components/SecondaryButton.vue'
14 | import SettingsButton from './components/SettingsButton.vue'
15 | import DiscussionWidget from './widgets/DiscussionWidget.vue'
16 | import LoginWidget from './widgets/LoginWidget.vue'
17 | import PostWidget from './widgets/PostWidget.vue'
18 | import ShareWidget from './widgets/ShareWidget.vue'
19 |
20 | export * from './composables-legacy'
21 | export { isVersionAtLeast } from './composables/useMiniApp'
22 | export * from './events'
23 | export type { LoginWidgetUser } from './types'
24 |
25 | export * from './versions/6.0'
26 |
27 | export {
28 | Alert,
29 | BackButton,
30 | BiometricManager,
31 | ClosingConfirmation,
32 | Confirm,
33 | DiscussionWidget,
34 | ExpandedViewport,
35 | FullscreenViewport,
36 | LoginWidget,
37 | MainButton,
38 | Popup,
39 | PostWidget,
40 | ScanQr,
41 | SecondaryButton,
42 | SettingsButton,
43 | ShareWidget,
44 | }
45 |
46 | const plugin = {
47 | install(Vue: App) {
48 | Vue.component('TgAlert', Alert)
49 | Vue.component('TgBackButton', BackButton)
50 | Vue.component('TgBiometricManager', BiometricManager)
51 | Vue.component('TgClosingConfirmation', ClosingConfirmation)
52 | Vue.component('TgConfirm', Confirm)
53 | Vue.component('TgExpandedViewport', ExpandedViewport)
54 | Vue.component('TgFullscreenViewport', FullscreenViewport)
55 | Vue.component('TgMainButton', MainButton)
56 | Vue.component('TgPopup', Popup)
57 | Vue.component('TgScanQr', ScanQr)
58 | Vue.component('TgSecondaryButton', SecondaryButton)
59 | Vue.component('TgSettingsButton', SettingsButton)
60 | Vue.component('TgShareWidget', ShareWidget)
61 | Vue.component('TgPostWidget', PostWidget)
62 | Vue.component('TgLoginWidget', LoginWidget)
63 | Vue.component('TgDiscussionWidget', DiscussionWidget)
64 | },
65 | }
66 |
67 | declare module '@vue/runtime-core' {
68 | export interface GlobalComponents {
69 | TgAlert: typeof Alert
70 | TgBackButton: typeof BackButton
71 | TgBiometricManager: typeof BiometricManager
72 | TgClosingConfirmation: typeof ClosingConfirmation
73 | TgConfirm: typeof Confirm
74 | TgExpandedViewport: typeof ExpandedViewport
75 | TgFullscreenViewport: typeof FullscreenViewport
76 | TgMainButton: typeof MainButton
77 | TgPopup: typeof Popup
78 | TgScanQr: typeof ScanQr
79 | TgSecondaryButton: typeof SecondaryButton
80 | TgSettingsButton: typeof SettingsButton
81 | TgShareWidget: typeof ShareWidget
82 | TgPostWidget: typeof PostWidget
83 | TgLoginWidget: typeof LoginWidget
84 | TgDiscussionWidget: typeof DiscussionWidget
85 | }
86 | }
87 |
88 | export { plugin as VueTelegramPlugin }
89 |
--------------------------------------------------------------------------------
/src/sdk/accelerometer.ts:
--------------------------------------------------------------------------------
1 | export type Accelerometer = {
2 | isStarted: boolean
3 | x: number
4 | y: number
5 | z: number
6 | start: (
7 | params: AccelerometerStartParams,
8 | callback?: AccelerometerCallback['start']
9 | ) => Accelerometer
10 | stop: (callback?: AccelerometerCallback['stop']) => Accelerometer
11 | }
12 |
13 | export type AccelerometerStartParams = {
14 | refresh_rate?: number
15 | }
16 |
17 | export type AccelerometerCallback = {
18 | start: (success: boolean) => void
19 | stop: (success: boolean) => void
20 | }
21 |
--------------------------------------------------------------------------------
/src/sdk/back-button.ts:
--------------------------------------------------------------------------------
1 | import type { EventCallback } from './events'
2 |
3 | export type BackButton = {
4 | isVisible: boolean
5 | onClick: (callback: EventCallback['backButtonClicked']) => BackButton
6 | offClick: (callback: EventCallback['backButtonClicked']) => BackButton
7 | show: () => BackButton
8 | hide: () => BackButton
9 | }
10 |
--------------------------------------------------------------------------------
/src/sdk/biometric-manager.ts:
--------------------------------------------------------------------------------
1 | export type BiometricManager = {
2 | isInited: boolean
3 | isBiometricAvailable: boolean
4 | biometricType: 'finger' | 'face' | 'unknown'
5 | isAccessRequested: boolean
6 | isAccessGranted: boolean
7 | isBiometricTokenSaved: boolean
8 | deviceId: string
9 | init: (callback?: BiometricManagerCallback['init']) => BiometricManager
10 | requestAccess: (
11 | params: BiometricRequestAccessParams,
12 | callback?: BiometricManagerCallback['requestAccess']
13 | ) => BiometricManager
14 | authenticate: (
15 | params: BiometricAuthenticateParams,
16 | callback?: BiometricManagerCallback['authenticate']
17 | ) => BiometricManager
18 | updateBiometricToken: (
19 | token: string,
20 | callback?: BiometricManagerCallback['updateBiometricToken']
21 | ) => BiometricManager
22 | openSettings: () => BiometricManager
23 | }
24 |
25 | export type BiometricManagerCallback = {
26 | init: () => void
27 | requestAccess: (isGranted: boolean) => void
28 | authenticate: (isAuthenticated: boolean, token?: string) => void
29 | updateBiometricToken: (isUpdated: boolean) => void
30 | }
31 |
32 | export type BiometricRequestAccessParams = {
33 | reason?: string
34 | }
35 |
36 | export type BiometricAuthenticateParams = {
37 | reason?: string
38 | }
39 |
--------------------------------------------------------------------------------
/src/sdk/bottom-button.ts:
--------------------------------------------------------------------------------
1 | import type { EventCallback } from './events'
2 |
3 | export type BottomButton = {
4 | readonly type: 'main' | 'secondary'
5 | text: string
6 | color: string
7 | textColor: string
8 | isVisible: boolean
9 | isActive: boolean
10 | hasShineEffect: boolean
11 | position?: 'left' | 'right' | 'top' | 'bottom'
12 | readonly isProgressVisible: boolean
13 | setText: (text: string) => BottomButton
14 | onClick: (callback: EventCallback['mainButtonClicked']) => BottomButton
15 | offClick: (callback: EventCallback['mainButtonClicked']) => BottomButton
16 | show: () => BottomButton
17 | hide: () => BottomButton
18 | enable: () => BottomButton
19 | disable: () => BottomButton
20 | showProgress: (leaveActive?: boolean) => BottomButton
21 | hideProgress: () => BottomButton
22 | setParams: (params: {
23 | text?: string
24 | color?: string
25 | text_color?: string
26 | has_shine_effect?: boolean
27 | position?: 'left' | 'right' | 'top' | 'bottom'
28 | is_active?: boolean
29 | is_visible?: boolean
30 | }) => BottomButton
31 | }
32 |
--------------------------------------------------------------------------------
/src/sdk/cloud-storage.ts:
--------------------------------------------------------------------------------
1 | export type CloudStorage = {
2 | setItem: (key: string, value: string, callback?: CloudStorageCallback['setItem']) => CloudStorage
3 | getItem: (key: string, callback: CloudStorageCallback['getItem']) => CloudStorage
4 | getItems: (keys: string[], callback: CloudStorageCallback['getItems']) => CloudStorage
5 | removeItem: (key: string, callback?: CloudStorageCallback['removeItem']) => CloudStorage
6 | removeItems: (keys: string[], callback?: CloudStorageCallback['removeItems']) => CloudStorage
7 | getKeys: (callback: CloudStorageCallback['getKeys']) => CloudStorage
8 | }
9 |
10 | export type CloudStorageCallback = {
11 | setItem: (error: string | null, success: null | true) => void
12 | getItem: (error: string | null, value: null | string) => void
13 | getItems: (error: string | null, values: null | Record) => void
14 | removeItem: (error: string | null, success: null | true) => void
15 | removeItems: (error: string | null, success: null | true) => void
16 | getKeys: (error: string | null, keys: null | string[]) => void
17 | }
18 |
--------------------------------------------------------------------------------
/src/sdk/device-orientation.ts:
--------------------------------------------------------------------------------
1 | export type DeviceOrientation = {
2 | isStarted: boolean
3 | absolute: boolean
4 | alpha: number
5 | beta: number
6 | gamma: number
7 | start: (
8 | params: DeviceOrientationStartParams,
9 | callback?: DeviceOrientationCallback['start']
10 | ) => DeviceOrientation
11 | stop: (callback?: DeviceOrientationCallback['stop']) => DeviceOrientation
12 | }
13 |
14 | export type DeviceOrientationCallback = {
15 | start: (success: boolean) => void
16 | stop: (success: boolean) => void
17 | }
18 |
19 | export type DeviceOrientationStartParams = {
20 | refresh_rate?: number
21 | need_absolute?: boolean
22 | }
23 |
--------------------------------------------------------------------------------
/src/sdk/device-storage.ts:
--------------------------------------------------------------------------------
1 | export type DeviceStorage = {
2 | setItem: (key: string, value: string, callback?: DeviceStorageCallback['setItem']) => DeviceStorage
3 | getItem: (key: string, callback: DeviceStorageCallback['getItem']) => DeviceStorage
4 | removeItem: (key: string, callback?: DeviceStorageCallback['removeItem']) => DeviceStorage
5 | clear: (callback: DeviceStorageCallback['clear']) => DeviceStorage
6 | }
7 |
8 | export type DeviceStorageCallback = {
9 | setItem: (error: string | null, success: null | true) => void
10 | getItem: (error: string | null, value: null | string) => void
11 | removeItem: (error: string | null, success: null | true) => void
12 | clear: (error: string | null) => void
13 | }
14 |
--------------------------------------------------------------------------------
/src/sdk/gyroscope.ts:
--------------------------------------------------------------------------------
1 | export type Gyroscope = {
2 | isStarted: boolean
3 | x: number
4 | y: number
5 | z: number
6 | start: (
7 | params: GyroscopeStartParams,
8 | callback?: GyroscopeCallback['start']
9 | ) => Gyroscope
10 | stop: (callback?: GyroscopeCallback['stop']) => Gyroscope
11 | }
12 |
13 | export type GyroscopeCallback = {
14 | start: (success: boolean) => void
15 | stop: (success: boolean) => void
16 | }
17 |
18 | export type GyroscopeStartParams = {
19 | refresh_rate?: number
20 | }
21 |
--------------------------------------------------------------------------------
/src/sdk/haptic-feedback.ts:
--------------------------------------------------------------------------------
1 | export type HapticFeedback = {
2 | impactOccurred: (
3 | style: 'light' | 'medium' | 'heavy' | 'rigid' | 'soft'
4 | ) => HapticFeedback
5 | notificationOccurred: (
6 | type: 'error' | 'success' | 'warning'
7 | ) => HapticFeedback
8 | selectionChanged: () => HapticFeedback
9 | }
10 |
--------------------------------------------------------------------------------
/src/sdk/index.ts:
--------------------------------------------------------------------------------
1 | import type { WebApp } from './webapp'
2 |
3 | export * from './accelerometer'
4 | export * from './back-button'
5 | export * from './biometric-manager'
6 | export * from './bottom-button'
7 | export * from './cloud-storage'
8 | export * from './device-orientation'
9 | export * from './events'
10 | export * from './gyroscope'
11 | export * from './haptic-feedback'
12 | export * from './location-manager'
13 | export * from './popup'
14 | export * from './qr-scanner'
15 | export * from './settings-button'
16 | export * from './theme'
17 | export * from './viewport'
18 | export * from './webapp'
19 |
20 | export function getWebApp() {
21 | if (!('Telegram' in window))
22 | throw new Error('Telegram SDK not found. Make sure https://telegram.org/js/telegram-web-app.js script is installed.')
23 | // @ts-expect-error not typed
24 | return window?.Telegram?.WebApp as WebApp
25 | }
26 |
--------------------------------------------------------------------------------
/src/sdk/location-manager.ts:
--------------------------------------------------------------------------------
1 | export type LocationManager = {
2 | isInited: boolean
3 | isLocationAvailable: boolean
4 | isAccessRequested: boolean
5 | isAccessGranted: boolean
6 | init: (callback?: LocationManagerCallback['init']) => LocationManager
7 | getLocation: (callback: LocationManagerCallback['getLocation']) => LocationManager
8 | openSettings: () => LocationManager
9 | }
10 |
11 | export type LocationManagerCallback = {
12 | init: () => void
13 | getLocation: (data: LocationData | null) => void
14 | }
15 |
16 | export type LocationData = {
17 | latitude: number
18 | longitude: number
19 | altitude: number | null
20 | course: number | null
21 | speed: number | null
22 | horizontal_accuracy: number | null
23 | vertical_accuracy: number | null
24 | course_accuracy: number | null
25 | speed_accuracy: number | null
26 | }
27 |
--------------------------------------------------------------------------------
/src/sdk/popup.ts:
--------------------------------------------------------------------------------
1 | export type PopupButton = {
2 | id?: string
3 | type?: 'default' | 'ok' | 'close' | 'cancel' | 'destructive'
4 | text?: string
5 | }
6 |
7 | export type PopupParams = {
8 | title?: string
9 | message: string
10 | buttons?: PopupButton[]
11 | }
12 |
--------------------------------------------------------------------------------
/src/sdk/qr-scanner.ts:
--------------------------------------------------------------------------------
1 | export type ScanQrPopupParams = {
2 | text?: string
3 | }
4 |
--------------------------------------------------------------------------------
/src/sdk/secure-storage.ts:
--------------------------------------------------------------------------------
1 | export type SecureStorage = {
2 | setItem: (key: string, value: string, callback?: SecureStorageCallback['setItem']) => SecureStorage
3 | getItem: (key: string, callback: SecureStorageCallback['getItem']) => SecureStorage
4 | restoreItem: (key: string, callback?: SecureStorageCallback['restoreItem']) => SecureStorage
5 | removeItem: (key: string, callback?: SecureStorageCallback['removeItem']) => SecureStorage
6 | clear: (callback: SecureStorageCallback['clear']) => SecureStorage
7 | }
8 |
9 | export type SecureStorageCallback = {
10 | setItem: (error: string | null, success: null | true) => void
11 | getItem: (error: string | null, value: null | string) => void
12 | restoreItem: (error: string | null, value: null | string) => void
13 | removeItem: (error: string | null, success: null | true) => void
14 | clear: (error: string | null) => void
15 | }
16 |
--------------------------------------------------------------------------------
/src/sdk/settings-button.ts:
--------------------------------------------------------------------------------
1 | import type { EventCallback } from './events'
2 |
3 | export type SettingsButton = {
4 | isVisible: boolean
5 | onClick: (callback: EventCallback['settingsButtonClicked']) => SettingsButton
6 | offClick: (callback: EventCallback['settingsButtonClicked']) => SettingsButton
7 | show: () => SettingsButton
8 | hide: () => SettingsButton
9 | }
10 |
--------------------------------------------------------------------------------
/src/sdk/theme.ts:
--------------------------------------------------------------------------------
1 | export type ThemeParams = {
2 | bg_color?: string
3 | text_color?: string
4 | hint_color?: string
5 | link_color?: string
6 | button_color?: string
7 | button_text_color?: string
8 | secondary_bg_color?: string
9 | header_bg_color?: string
10 | bottom_bar_bg_color?: string
11 | accent_text_color?: string
12 | section_bg_color?: string
13 | section_header_text_color?: string
14 | section_separator_color?: string
15 | subtitle_text_color?: string
16 | destructive_text_color?: string
17 | }
18 |
--------------------------------------------------------------------------------
/src/sdk/viewport.ts:
--------------------------------------------------------------------------------
1 | export type SafeAreaInset = {
2 | top: number
3 | bottom: number
4 | left: number
5 | right: number
6 | }
7 |
8 | export type ContentSafeAreaInset = {
9 | top: number
10 | bottom: number
11 | left: number
12 | right: number
13 | }
14 |
--------------------------------------------------------------------------------
/src/shims.d.ts:
--------------------------------------------------------------------------------
1 | declare module '*.vue' {
2 | import type { ComponentOptions } from 'vue'
3 |
4 | const componentOptions: ComponentOptions
5 | export default componentOptions
6 | }
7 |
--------------------------------------------------------------------------------
/src/types.ts:
--------------------------------------------------------------------------------
1 | import type { EventCallback, WebAppInitData, WebAppUser } from './sdk'
2 |
3 | type BOT_API_VERSIONS = [
4 | '6.0',
5 | '6.1',
6 | '6.2',
7 | '6.4',
8 | '6.7',
9 | '6.9',
10 | '7.0',
11 | '7.2',
12 | '7.6',
13 | '7.7',
14 | '7.8',
15 | '7.10',
16 | '8.0',
17 | '9.0',
18 | '9.1',
19 | ]
20 |
21 | export type LATEST_VERSION = '9.1'
22 |
23 | type Reverse = T extends [infer First, ...infer Rest]
24 | ? [...Reverse, First]
25 | : []
26 |
27 | type Equals = X extends Y ? (Y extends X ? true : false) : false
28 |
29 | export type Merge = Omit & U
30 |
31 | export type BotApiVersion = BOT_API_VERSIONS[number]
32 |
33 | type VersionMap =
34 | T extends readonly [infer First extends BotApiVersion, infer Second extends BotApiVersion, ...infer Rest extends BotApiVersion[]]
35 | ? VersionMap<[Second, ...Rest], R & { [K in First]: Second }>
36 | : R
37 |
38 | type BotApiNextVersionMap = VersionMap
39 | export type BotApiNextVersion = V extends keyof BotApiNextVersionMap
40 | ? BotApiNextVersionMap[V]
41 | : never
42 |
43 | type BotApiPrevVersionMap = VersionMap>
44 | export type BotApiPrevVersion = V extends keyof BotApiPrevVersionMap
45 | ? BotApiPrevVersionMap[V]
46 | : never
47 |
48 | export type BotApiVersionRange =
49 | Equals extends true
50 | ? Start
51 | : Start | BotApiVersionRange, End>
52 |
53 | export type VersionedReturnType<
54 | Schema extends { version: BotApiVersion },
55 | Version extends BotApiVersion,
56 | SuggestedVersions extends BotApiVersion,
57 | > =
58 | & Omit> }>, 'isVersionAtLeast'>
59 | & {
60 | isVersionAtLeast: >>(version: V) => this is VersionedReturnType
61 | }
62 |
63 | /**
64 | * Mini Apps
65 | */
66 |
67 | export type OnEventReturn = {
68 | off: () => void
69 | }
70 |
71 | export type OnEventOptions = {
72 | /**
73 | * Disables automatic subscription management; you need to call the returned function `off` to unsubscribe.
74 | *
75 | * Set to `false` by default.
76 | */
77 | manual?: boolean
78 | }
79 |
80 | export type OnEventWithOptions = {
81 | (
82 | eventType: T,
83 | eventHandler: EventCallback[T],
84 | options?: O
85 | ): OnEventReturn
86 | }
87 |
88 | /**
89 | * Widgets
90 | */
91 |
92 | export type LoginWidgetUser =
93 | & Pick
94 | & Pick
95 |
--------------------------------------------------------------------------------
/src/utils/functions.ts:
--------------------------------------------------------------------------------
1 | interface HookObject {
2 | before?: (args: TArgs) => void
3 | after?: (args: TArgs, result: TResult) => void
4 | }
5 |
6 | export function wrapFunction<
7 | TFunction extends (...args: any[]) => any,
8 | TOmitReturn extends boolean = false,
9 | >(
10 | fn: TFunction,
11 | options?: {
12 | hooks?: HookObject, ReturnType>
13 | omitReturn?: TOmitReturn
14 | },
15 | ): (...args: Parameters) => TOmitReturn extends true ? void : ReturnType {
16 | return (...args: Parameters) => {
17 | const { hooks, omitReturn } = options || {}
18 | if (hooks?.before)
19 | hooks.before(args)
20 |
21 | const result = fn(...args)
22 |
23 | if (hooks?.after)
24 | hooks.after(args, result)
25 |
26 | if (!omitReturn)
27 | return result
28 | }
29 | }
30 |
31 | type Callback = (data: T) => void
32 |
33 | export function promisify(
34 | func: (...args: [...A, Callback]) => void,
35 | ): (...args: A) => Promise {
36 | return (...args: A) =>
37 | new Promise(resolve => func(...args, resolve))
38 | }
39 |
40 | type CallbackWithNoData = () => void
41 |
42 | export function promisifyWithNoData(
43 | func: (...args: [...A, CallbackWithNoData]) => void,
44 | ): (...args: A) => Promise {
45 | return (...args: A) =>
46 | new Promise(resolve => func(...args, resolve))
47 | }
48 |
49 | type CallbackWithError = (err: string | null, data: T | null) => void
50 |
51 | export function promisifyWithError(
52 | func: (...args: [...A, CallbackWithError]) => void,
53 | ): (...args: A) => Promise {
54 | return (...args: A) =>
55 | new Promise((resolve, reject) =>
56 | func(...args, (err, data) => (err ? reject(err) : resolve(data as T))),
57 | )
58 | }
59 |
60 | type CallbackWithMultipleData = (...data: T) => void
61 |
62 | export function promisifyWithDataObject<
63 | T extends any[],
64 | R extends Record,
65 | A extends any[],
66 | >(
67 | func: (...args: [...A, CallbackWithMultipleData]) => void,
68 | mapToObject: (...data: T) => R,
69 | ): (...args: A) => Promise {
70 | return (...args: A) =>
71 | new Promise(resolve =>
72 | func(...args, (...data: T) => resolve(mapToObject(...data))),
73 | )
74 | }
75 |
--------------------------------------------------------------------------------
/src/utils/index.ts:
--------------------------------------------------------------------------------
1 | export * from './functions'
2 | export * from './store'
3 | export * from './version'
4 |
--------------------------------------------------------------------------------
/src/utils/lifecycle.ts:
--------------------------------------------------------------------------------
1 | import { getCurrentInstance, onMounted, onUnmounted } from 'vue'
2 |
3 | export function tryOnMounted(fn: () => void) {
4 | const instance = getCurrentInstance()
5 | if (instance)
6 | onMounted(fn)
7 | }
8 |
9 | export function tryOnUnmounted(fn: () => void) {
10 | const instance = getCurrentInstance()
11 | if (instance)
12 | onUnmounted(fn)
13 | }
14 |
--------------------------------------------------------------------------------
/src/utils/store.ts:
--------------------------------------------------------------------------------
1 | import { effectScope } from 'vue'
2 |
3 | /**
4 | * Create a composable that returns a lazily initialized store.
5 | */
6 | export function defineStore(initialValue: () => T) {
7 | let initialized = false
8 | let value: T
9 |
10 | return function useStore(): T {
11 | if (!initialized) {
12 | // Init store in detached scope, so that watchers are not disposed on component unmount.
13 | effectScope(true).run(() => {
14 | value = initialValue()
15 | })
16 | initialized = true
17 | }
18 | return value
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/src/utils/version.ts:
--------------------------------------------------------------------------------
1 | function compareVersions(version1: string, version2: string) {
2 | const parts1 = (version1 || '').trim().split('.').map(Number)
3 | const parts2 = (version2 || '').trim().split('.').map(Number)
4 | const maxLength = Math.max(parts1.length, parts2.length)
5 |
6 | for (let i = 0; i < maxLength; i++) {
7 | const p1 = parts1[i] || 0
8 | const p2 = parts2[i] || 0
9 | if (p1 !== p2)
10 | return p1 > p2 ? 1 : -1
11 | }
12 |
13 | return 0
14 | }
15 |
16 | export function isVersionGreaterOrEqual(version1: string, version2: string) {
17 | return compareVersions(version1, version2) >= 0
18 | }
19 |
20 | export function getHighestVersion(version1: string, version2: string): string {
21 | const comparisonResult = compareVersions(version1, version2)
22 | return comparisonResult >= 0 ? version1 : version2
23 | }
24 |
--------------------------------------------------------------------------------
/src/versions/6.0.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('6.0')
24 | export const useBackButton = () => _useBackButton('6.0')
25 | export const useBiometricManager = () => _useBiometricManager('6.0')
26 | export const useClipboard = () => _useClipboard('6.0')
27 | export const useCloudStorage = () => _useCloudStorage('6.0')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('6.0')
29 | export const useDeviceStorage = () => _useDeviceStorage('6.0')
30 | export const useEmojiStatus = () => _useEmojiStatus('6.0')
31 | export const useGyroscope = () => _useGyroscope('6.0')
32 | export const useHapticFeedback = () => _useHapticFeedback('6.0')
33 | export const useHomeScreen = () => _useHomeScreen('6.0')
34 | export const useLocationManager = () => _useLocationManager('6.0')
35 | export const useMainButton = () => _useMainButton('6.0')
36 | export const useMiniApp = () => _useMiniApp('6.0')
37 | export const usePopup = () => _usePopup('6.0')
38 | export const useQrScanner = () => _useQrScanner('6.0')
39 | export const useSecondaryButton = () => _useSecondaryButton('6.0')
40 | export const useSecureStorage = () => _useSecureStorage('6.0')
41 | export const useSettingsButton = () => _useSettingsButton('6.0')
42 | export const useTheme = () => _useTheme('6.0')
43 | export const useViewport = () => _useViewport('6.0')
44 |
--------------------------------------------------------------------------------
/src/versions/6.1.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('6.1')
24 | export const useBackButton = () => _useBackButton('6.1')
25 | export const useBiometricManager = () => _useBiometricManager('6.1')
26 | export const useClipboard = () => _useClipboard('6.1')
27 | export const useCloudStorage = () => _useCloudStorage('6.1')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('6.1')
29 | export const useDeviceStorage = () => _useDeviceStorage('6.1')
30 | export const useEmojiStatus = () => _useEmojiStatus('6.1')
31 | export const useGyroscope = () => _useGyroscope('6.1')
32 | export const useHapticFeedback = () => _useHapticFeedback('6.1')
33 | export const useHomeScreen = () => _useHomeScreen('6.1')
34 | export const useLocationManager = () => _useLocationManager('6.1')
35 | export const useMainButton = () => _useMainButton('6.1')
36 | export const useMiniApp = () => _useMiniApp('6.1')
37 | export const usePopup = () => _usePopup('6.1')
38 | export const useQrScanner = () => _useQrScanner('6.1')
39 | export const useSecondaryButton = () => _useSecondaryButton('6.1')
40 | export const useSecureStorage = () => _useSecureStorage('6.1')
41 | export const useSettingsButton = () => _useSettingsButton('6.1')
42 | export const useTheme = () => _useTheme('6.1')
43 | export const useViewport = () => _useViewport('6.1')
44 |
--------------------------------------------------------------------------------
/src/versions/6.2.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('6.2')
24 | export const useBackButton = () => _useBackButton('6.2')
25 | export const useBiometricManager = () => _useBiometricManager('6.2')
26 | export const useClipboard = () => _useClipboard('6.2')
27 | export const useCloudStorage = () => _useCloudStorage('6.2')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('6.2')
29 | export const useDeviceStorage = () => _useDeviceStorage('6.2')
30 | export const useEmojiStatus = () => _useEmojiStatus('6.2')
31 | export const useGyroscope = () => _useGyroscope('6.2')
32 | export const useHapticFeedback = () => _useHapticFeedback('6.2')
33 | export const useHomeScreen = () => _useHomeScreen('6.2')
34 | export const useLocationManager = () => _useLocationManager('6.2')
35 | export const useMainButton = () => _useMainButton('6.2')
36 | export const useMiniApp = () => _useMiniApp('6.2')
37 | export const usePopup = () => _usePopup('6.2')
38 | export const useQrScanner = () => _useQrScanner('6.2')
39 | export const useSecondaryButton = () => _useSecondaryButton('6.2')
40 | export const useSecureStorage = () => _useSecureStorage('6.2')
41 | export const useSettingsButton = () => _useSettingsButton('6.2')
42 | export const useTheme = () => _useTheme('6.2')
43 | export const useViewport = () => _useViewport('6.2')
44 |
--------------------------------------------------------------------------------
/src/versions/6.4.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('6.4')
24 | export const useBackButton = () => _useBackButton('6.4')
25 | export const useBiometricManager = () => _useBiometricManager('6.4')
26 | export const useClipboard = () => _useClipboard('6.4')
27 | export const useCloudStorage = () => _useCloudStorage('6.4')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('6.4')
29 | export const useDeviceStorage = () => _useDeviceStorage('6.4')
30 | export const useEmojiStatus = () => _useEmojiStatus('6.4')
31 | export const useGyroscope = () => _useGyroscope('6.4')
32 | export const useHapticFeedback = () => _useHapticFeedback('6.4')
33 | export const useHomeScreen = () => _useHomeScreen('6.4')
34 | export const useLocationManager = () => _useLocationManager('6.4')
35 | export const useMainButton = () => _useMainButton('6.4')
36 | export const useMiniApp = () => _useMiniApp('6.4')
37 | export const usePopup = () => _usePopup('6.4')
38 | export const useQrScanner = () => _useQrScanner('6.4')
39 | export const useSecondaryButton = () => _useSecondaryButton('6.4')
40 | export const useSecureStorage = () => _useSecureStorage('6.4')
41 | export const useSettingsButton = () => _useSettingsButton('6.4')
42 | export const useTheme = () => _useTheme('6.4')
43 | export const useViewport = () => _useViewport('6.4')
44 |
--------------------------------------------------------------------------------
/src/versions/6.7.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('6.7')
24 | export const useBackButton = () => _useBackButton('6.7')
25 | export const useBiometricManager = () => _useBiometricManager('6.7')
26 | export const useClipboard = () => _useClipboard('6.7')
27 | export const useCloudStorage = () => _useCloudStorage('6.7')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('6.7')
29 | export const useDeviceStorage = () => _useDeviceStorage('6.7')
30 | export const useEmojiStatus = () => _useEmojiStatus('6.7')
31 | export const useGyroscope = () => _useGyroscope('6.7')
32 | export const useHapticFeedback = () => _useHapticFeedback('6.7')
33 | export const useHomeScreen = () => _useHomeScreen('6.7')
34 | export const useLocationManager = () => _useLocationManager('6.7')
35 | export const useMainButton = () => _useMainButton('6.7')
36 | export const useMiniApp = () => _useMiniApp('6.7')
37 | export const usePopup = () => _usePopup('6.7')
38 | export const useQrScanner = () => _useQrScanner('6.7')
39 | export const useSecondaryButton = () => _useSecondaryButton('6.7')
40 | export const useSecureStorage = () => _useSecureStorage('6.7')
41 | export const useSettingsButton = () => _useSettingsButton('6.7')
42 | export const useTheme = () => _useTheme('6.7')
43 | export const useViewport = () => _useViewport('6.7')
44 |
--------------------------------------------------------------------------------
/src/versions/6.9.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('6.9')
24 | export const useBackButton = () => _useBackButton('6.9')
25 | export const useBiometricManager = () => _useBiometricManager('6.9')
26 | export const useClipboard = () => _useClipboard('6.9')
27 | export const useCloudStorage = () => _useCloudStorage('6.9')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('6.9')
29 | export const useDeviceStorage = () => _useDeviceStorage('6.9')
30 | export const useEmojiStatus = () => _useEmojiStatus('6.9')
31 | export const useGyroscope = () => _useGyroscope('6.9')
32 | export const useHapticFeedback = () => _useHapticFeedback('6.9')
33 | export const useHomeScreen = () => _useHomeScreen('6.9')
34 | export const useLocationManager = () => _useLocationManager('6.9')
35 | export const useMainButton = () => _useMainButton('6.9')
36 | export const useMiniApp = () => _useMiniApp('6.9')
37 | export const usePopup = () => _usePopup('6.9')
38 | export const useQrScanner = () => _useQrScanner('6.9')
39 | export const useSecondaryButton = () => _useSecondaryButton('6.9')
40 | export const useSecureStorage = () => _useSecureStorage('6.9')
41 | export const useSettingsButton = () => _useSettingsButton('6.9')
42 | export const useTheme = () => _useTheme('6.9')
43 | export const useViewport = () => _useViewport('6.9')
44 |
--------------------------------------------------------------------------------
/src/versions/7.0.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('7.0')
24 | export const useBackButton = () => _useBackButton('7.0')
25 | export const useBiometricManager = () => _useBiometricManager('7.0')
26 | export const useClipboard = () => _useClipboard('7.0')
27 | export const useCloudStorage = () => _useCloudStorage('7.0')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('7.0')
29 | export const useDeviceStorage = () => _useDeviceStorage('7.0')
30 | export const useEmojiStatus = () => _useEmojiStatus('7.0')
31 | export const useGyroscope = () => _useGyroscope('7.0')
32 | export const useHapticFeedback = () => _useHapticFeedback('7.0')
33 | export const useHomeScreen = () => _useHomeScreen('7.0')
34 | export const useLocationManager = () => _useLocationManager('7.0')
35 | export const useMainButton = () => _useMainButton('7.0')
36 | export const useMiniApp = () => _useMiniApp('7.0')
37 | export const usePopup = () => _usePopup('7.0')
38 | export const useQrScanner = () => _useQrScanner('7.0')
39 | export const useSecondaryButton = () => _useSecondaryButton('7.0')
40 | export const useSecureStorage = () => _useSecureStorage('7.0')
41 | export const useSettingsButton = () => _useSettingsButton('7.0')
42 | export const useTheme = () => _useTheme('7.0')
43 | export const useViewport = () => _useViewport('7.0')
44 |
--------------------------------------------------------------------------------
/src/versions/7.10.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('7.10')
24 | export const useBackButton = () => _useBackButton('7.10')
25 | export const useBiometricManager = () => _useBiometricManager('7.10')
26 | export const useClipboard = () => _useClipboard('7.10')
27 | export const useCloudStorage = () => _useCloudStorage('7.10')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('7.10')
29 | export const useDeviceStorage = () => _useDeviceStorage('7.10')
30 | export const useEmojiStatus = () => _useEmojiStatus('7.10')
31 | export const useGyroscope = () => _useGyroscope('7.10')
32 | export const useHapticFeedback = () => _useHapticFeedback('7.10')
33 | export const useHomeScreen = () => _useHomeScreen('7.10')
34 | export const useLocationManager = () => _useLocationManager('7.10')
35 | export const useMainButton = () => _useMainButton('7.10')
36 | export const useMiniApp = () => _useMiniApp('7.10')
37 | export const usePopup = () => _usePopup('7.10')
38 | export const useQrScanner = () => _useQrScanner('7.10')
39 | export const useSecondaryButton = () => _useSecondaryButton('7.10')
40 | export const useSecureStorage = () => _useSecureStorage('7.10')
41 | export const useSettingsButton = () => _useSettingsButton('7.10')
42 | export const useTheme = () => _useTheme('7.10')
43 | export const useViewport = () => _useViewport('7.10')
44 |
--------------------------------------------------------------------------------
/src/versions/7.2.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('7.2')
24 | export const useBackButton = () => _useBackButton('7.2')
25 | export const useBiometricManager = () => _useBiometricManager('7.2')
26 | export const useClipboard = () => _useClipboard('7.2')
27 | export const useCloudStorage = () => _useCloudStorage('7.2')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('7.2')
29 | export const useDeviceStorage = () => _useDeviceStorage('7.2')
30 | export const useEmojiStatus = () => _useEmojiStatus('7.2')
31 | export const useGyroscope = () => _useGyroscope('7.2')
32 | export const useHapticFeedback = () => _useHapticFeedback('7.2')
33 | export const useHomeScreen = () => _useHomeScreen('7.2')
34 | export const useLocationManager = () => _useLocationManager('7.2')
35 | export const useMainButton = () => _useMainButton('7.2')
36 | export const useMiniApp = () => _useMiniApp('7.2')
37 | export const usePopup = () => _usePopup('7.2')
38 | export const useQrScanner = () => _useQrScanner('7.2')
39 | export const useSecondaryButton = () => _useSecondaryButton('7.2')
40 | export const useSecureStorage = () => _useSecureStorage('7.2')
41 | export const useSettingsButton = () => _useSettingsButton('7.2')
42 | export const useTheme = () => _useTheme('7.2')
43 | export const useViewport = () => _useViewport('7.2')
44 |
--------------------------------------------------------------------------------
/src/versions/7.6.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('7.6')
24 | export const useBackButton = () => _useBackButton('7.6')
25 | export const useBiometricManager = () => _useBiometricManager('7.6')
26 | export const useClipboard = () => _useClipboard('7.6')
27 | export const useCloudStorage = () => _useCloudStorage('7.6')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('7.6')
29 | export const useDeviceStorage = () => _useDeviceStorage('7.6')
30 | export const useEmojiStatus = () => _useEmojiStatus('7.6')
31 | export const useGyroscope = () => _useGyroscope('7.6')
32 | export const useHapticFeedback = () => _useHapticFeedback('7.6')
33 | export const useHomeScreen = () => _useHomeScreen('7.6')
34 | export const useLocationManager = () => _useLocationManager('7.6')
35 | export const useMainButton = () => _useMainButton('7.6')
36 | export const useMiniApp = () => _useMiniApp('7.6')
37 | export const usePopup = () => _usePopup('7.6')
38 | export const useQrScanner = () => _useQrScanner('7.6')
39 | export const useSecondaryButton = () => _useSecondaryButton('7.6')
40 | export const useSecureStorage = () => _useSecureStorage('7.6')
41 | export const useSettingsButton = () => _useSettingsButton('7.6')
42 | export const useTheme = () => _useTheme('7.6')
43 | export const useViewport = () => _useViewport('7.6')
44 |
--------------------------------------------------------------------------------
/src/versions/7.7.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('7.7')
24 | export const useBackButton = () => _useBackButton('7.7')
25 | export const useBiometricManager = () => _useBiometricManager('7.7')
26 | export const useClipboard = () => _useClipboard('7.7')
27 | export const useCloudStorage = () => _useCloudStorage('7.7')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('7.7')
29 | export const useDeviceStorage = () => _useDeviceStorage('7.7')
30 | export const useEmojiStatus = () => _useEmojiStatus('7.7')
31 | export const useGyroscope = () => _useGyroscope('7.7')
32 | export const useHapticFeedback = () => _useHapticFeedback('7.7')
33 | export const useHomeScreen = () => _useHomeScreen('7.7')
34 | export const useLocationManager = () => _useLocationManager('7.7')
35 | export const useMainButton = () => _useMainButton('7.7')
36 | export const useMiniApp = () => _useMiniApp('7.7')
37 | export const usePopup = () => _usePopup('7.7')
38 | export const useQrScanner = () => _useQrScanner('7.7')
39 | export const useSecondaryButton = () => _useSecondaryButton('7.7')
40 | export const useSecureStorage = () => _useSecureStorage('7.7')
41 | export const useSettingsButton = () => _useSettingsButton('7.7')
42 | export const useTheme = () => _useTheme('7.7')
43 | export const useViewport = () => _useViewport('7.7')
44 |
--------------------------------------------------------------------------------
/src/versions/7.8.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('7.8')
24 | export const useBackButton = () => _useBackButton('7.8')
25 | export const useBiometricManager = () => _useBiometricManager('7.8')
26 | export const useClipboard = () => _useClipboard('7.8')
27 | export const useCloudStorage = () => _useCloudStorage('7.8')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('7.8')
29 | export const useDeviceStorage = () => _useDeviceStorage('7.8')
30 | export const useEmojiStatus = () => _useEmojiStatus('7.8')
31 | export const useGyroscope = () => _useGyroscope('7.8')
32 | export const useHapticFeedback = () => _useHapticFeedback('7.8')
33 | export const useHomeScreen = () => _useHomeScreen('7.8')
34 | export const useLocationManager = () => _useLocationManager('7.8')
35 | export const useMainButton = () => _useMainButton('7.8')
36 | export const useMiniApp = () => _useMiniApp('7.8')
37 | export const usePopup = () => _usePopup('7.8')
38 | export const useQrScanner = () => _useQrScanner('7.8')
39 | export const useSecondaryButton = () => _useSecondaryButton('7.8')
40 | export const useSecureStorage = () => _useSecureStorage('7.8')
41 | export const useSettingsButton = () => _useSettingsButton('7.8')
42 | export const useTheme = () => _useTheme('7.8')
43 | export const useViewport = () => _useViewport('7.8')
44 |
--------------------------------------------------------------------------------
/src/versions/8.0.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('8.0')
24 | export const useBackButton = () => _useBackButton('8.0')
25 | export const useBiometricManager = () => _useBiometricManager('8.0')
26 | export const useClipboard = () => _useClipboard('8.0')
27 | export const useCloudStorage = () => _useCloudStorage('8.0')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('8.0')
29 | export const useDeviceStorage = () => _useDeviceStorage('8.0')
30 | export const useEmojiStatus = () => _useEmojiStatus('8.0')
31 | export const useGyroscope = () => _useGyroscope('8.0')
32 | export const useHapticFeedback = () => _useHapticFeedback('8.0')
33 | export const useHomeScreen = () => _useHomeScreen('8.0')
34 | export const useLocationManager = () => _useLocationManager('8.0')
35 | export const useMainButton = () => _useMainButton('8.0')
36 | export const useMiniApp = () => _useMiniApp('8.0')
37 | export const usePopup = () => _usePopup('8.0')
38 | export const useQrScanner = () => _useQrScanner('8.0')
39 | export const useSecondaryButton = () => _useSecondaryButton('8.0')
40 | export const useSecureStorage = () => _useSecureStorage('8.0')
41 | export const useSettingsButton = () => _useSettingsButton('8.0')
42 | export const useTheme = () => _useTheme('8.0')
43 | export const useViewport = () => _useViewport('8.0')
44 |
--------------------------------------------------------------------------------
/src/versions/9.0.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('9.0')
24 | export const useBackButton = () => _useBackButton('9.0')
25 | export const useBiometricManager = () => _useBiometricManager('9.0')
26 | export const useClipboard = () => _useClipboard('9.0')
27 | export const useCloudStorage = () => _useCloudStorage('9.0')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('9.0')
29 | export const useDeviceStorage = () => _useDeviceStorage('9.0')
30 | export const useEmojiStatus = () => _useEmojiStatus('9.0')
31 | export const useGyroscope = () => _useGyroscope('9.0')
32 | export const useHapticFeedback = () => _useHapticFeedback('9.0')
33 | export const useHomeScreen = () => _useHomeScreen('9.0')
34 | export const useLocationManager = () => _useLocationManager('9.0')
35 | export const useMainButton = () => _useMainButton('9.0')
36 | export const useMiniApp = () => _useMiniApp('9.0')
37 | export const usePopup = () => _usePopup('9.0')
38 | export const useQrScanner = () => _useQrScanner('9.0')
39 | export const useSecondaryButton = () => _useSecondaryButton('9.0')
40 | export const useSecureStorage = () => _useSecureStorage('9.0')
41 | export const useSettingsButton = () => _useSettingsButton('9.0')
42 | export const useTheme = () => _useTheme('9.0')
43 | export const useViewport = () => _useViewport('9.0')
44 |
--------------------------------------------------------------------------------
/src/versions/9.1.ts:
--------------------------------------------------------------------------------
1 | import { useAccelerometer as _useAccelerometer } from '../composables/useAccelerometer'
2 | import { useBackButton as _useBackButton } from '../composables/useBackButton'
3 | import { useBiometricManager as _useBiometricManager } from '../composables/useBiometricManager'
4 | import { useClipboard as _useClipboard } from '../composables/useClipboard'
5 | import { useCloudStorage as _useCloudStorage } from '../composables/useCloudStorage'
6 | import { useDeviceOrientation as _useDeviceOrientation } from '../composables/useDeviceOrientation'
7 | import { useDeviceStorage as _useDeviceStorage } from '../composables/useDeviceStorage'
8 | import { useEmojiStatus as _useEmojiStatus } from '../composables/useEmojiStatus'
9 | import { useGyroscope as _useGyroscope } from '../composables/useGyroscope'
10 | import { useHapticFeedback as _useHapticFeedback } from '../composables/useHapticFeedback'
11 | import { useHomeScreen as _useHomeScreen } from '../composables/useHomeScreen'
12 | import { useLocationManager as _useLocationManager } from '../composables/useLocationManager'
13 | import { useMainButton as _useMainButton } from '../composables/useMainButton'
14 | import { useMiniApp as _useMiniApp } from '../composables/useMiniApp'
15 | import { usePopup as _usePopup } from '../composables/usePopup'
16 | import { useQrScanner as _useQrScanner } from '../composables/useQrScanner'
17 | import { useSecondaryButton as _useSecondaryButton } from '../composables/useSecondaryButton'
18 | import { useSecureStorage as _useSecureStorage } from '../composables/useSecureStorage'
19 | import { useSettingsButton as _useSettingsButton } from '../composables/useSettingsButton'
20 | import { useTheme as _useTheme } from '../composables/useTheme'
21 | import { useViewport as _useViewport } from '../composables/useViewport'
22 |
23 | export const useAccelerometer = () => _useAccelerometer('9.1')
24 | export const useBackButton = () => _useBackButton('9.1')
25 | export const useBiometricManager = () => _useBiometricManager('9.1')
26 | export const useClipboard = () => _useClipboard('9.1')
27 | export const useCloudStorage = () => _useCloudStorage('9.1')
28 | export const useDeviceOrientation = () => _useDeviceOrientation('9.1')
29 | export const useDeviceStorage = () => _useDeviceStorage('9.1')
30 | export const useEmojiStatus = () => _useEmojiStatus('9.1')
31 | export const useGyroscope = () => _useGyroscope('9.1')
32 | export const useHapticFeedback = () => _useHapticFeedback('9.1')
33 | export const useHomeScreen = () => _useHomeScreen('9.1')
34 | export const useLocationManager = () => _useLocationManager('9.1')
35 | export const useMainButton = () => _useMainButton('9.1')
36 | export const useMiniApp = () => _useMiniApp('9.1')
37 | export const usePopup = () => _usePopup('9.1')
38 | export const useQrScanner = () => _useQrScanner('9.1')
39 | export const useSecondaryButton = () => _useSecondaryButton('9.1')
40 | export const useSecureStorage = () => _useSecureStorage('9.1')
41 | export const useSettingsButton = () => _useSettingsButton('9.1')
42 | export const useTheme = () => _useTheme('9.1')
43 | export const useViewport = () => _useViewport('9.1')
44 |
--------------------------------------------------------------------------------
/src/versions/latest.ts:
--------------------------------------------------------------------------------
1 | export * from './9.1'
2 |
--------------------------------------------------------------------------------
/src/widgets/DiscussionWidget.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
15 |
16 |
17 |
18 |
57 |
--------------------------------------------------------------------------------
/src/widgets/LoginWidget.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
15 |
16 |
17 |
18 |
62 |
--------------------------------------------------------------------------------
/src/widgets/PostWidget.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
14 |
15 |
16 |
17 |
52 |
--------------------------------------------------------------------------------
/src/widgets/ShareWidget.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
12 |
13 |
14 |
15 |
43 |
--------------------------------------------------------------------------------
/test/basic.test.ts:
--------------------------------------------------------------------------------
1 | import { describe, expect, it } from 'vitest'
2 |
3 | describe('tests', () => {
4 | it('should works', () => {
5 | expect(1 + 1).toEqual(2)
6 | })
7 | })
8 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "incremental": false,
4 | "target": "ESNext",
5 | "lib": ["DOM", "ESNext"],
6 | "module": "ESNext",
7 | "moduleResolution": "bundler",
8 | "resolveJsonModule": true,
9 | "strict": true,
10 | "strictNullChecks": true,
11 | "noUnusedLocals": true,
12 | "esModuleInterop": true,
13 | "forceConsistentCasingInFileNames": true,
14 | "skipLibCheck": true
15 | },
16 | "include": [
17 | "src/**/*.ts",
18 | "src/**/*.d.ts",
19 | "src/**/*.vue"
20 | ]
21 | }
22 |
--------------------------------------------------------------------------------
/vite.config.mts:
--------------------------------------------------------------------------------
1 | import { resolve } from 'node:path'
2 | import vue from '@vitejs/plugin-vue'
3 | import { defineConfig } from 'vite'
4 | import dts from 'vite-plugin-dts'
5 | import pkg from './package.json'
6 |
7 | export default defineConfig({
8 | plugins: [
9 | vue(),
10 | dts({
11 | cleanVueFileName: true,
12 | }),
13 | ],
14 | build: {
15 | lib: {
16 | entry: [
17 | resolve(__dirname, 'src/index.ts'),
18 | resolve(__dirname, 'src/versions/6.0.ts'),
19 | resolve(__dirname, 'src/versions/6.1.ts'),
20 | resolve(__dirname, 'src/versions/6.2.ts'),
21 | resolve(__dirname, 'src/versions/6.4.ts'),
22 | resolve(__dirname, 'src/versions/6.7.ts'),
23 | resolve(__dirname, 'src/versions/6.9.ts'),
24 | resolve(__dirname, 'src/versions/7.0.ts'),
25 | resolve(__dirname, 'src/versions/7.2.ts'),
26 | resolve(__dirname, 'src/versions/7.6.ts'),
27 | resolve(__dirname, 'src/versions/7.7.ts'),
28 | resolve(__dirname, 'src/versions/7.8.ts'),
29 | resolve(__dirname, 'src/versions/7.10.ts'),
30 | resolve(__dirname, 'src/versions/8.0.ts'),
31 | resolve(__dirname, 'src/versions/9.0.ts'),
32 | resolve(__dirname, 'src/versions/9.1.ts'),
33 | resolve(__dirname, 'src/versions/latest.ts'),
34 | ],
35 | name: pkg.name,
36 | fileName(format, name) {
37 | if (format === 'es') {
38 | return `${name}.js`
39 | }
40 | return `${name}.${format}`
41 | },
42 | },
43 | rollupOptions: {
44 | external: ['vue'],
45 | output: {
46 | globals: {
47 | vue: 'Vue',
48 | },
49 | },
50 | },
51 | },
52 | })
53 |
--------------------------------------------------------------------------------
/vitest.config.ts:
--------------------------------------------------------------------------------
1 | import { defineConfig } from 'vitest/config'
2 |
3 | export default defineConfig({
4 | test: {
5 | environment: 'happy-dom',
6 | },
7 | })
8 |
--------------------------------------------------------------------------------