Bot API 7.10 (#22)

* Upgrade dev dependencies * Bot API 7.10 - Added the field *SecondaryButton* to the class WebApp. - Added the event *secondaryButtonClicked*. - Renamed the class *MainButton* to the class BottomButton. - Added the field *bottomBarColor* and the method *setBottomBarColor* to the class WebApp. - Added the field *bottom_bar_bg_color* to the class ThemeParams.
DavisDmitry · Sep 6, 2024 · d935b6a · d935b6a
1 parent 69da206
commit d935b6a
Show file tree

Hide file tree

Showing 4 changed files with 95 additions and 37 deletions.
diff --git a/README.md b/README.md
@@ -6,7 +6,7 @@
 <a href="https://npmjs.com/package/telegram-webapps"><img alt="npm" src="https://img.shields.io/npm/dt/telegram-webapps"/></a>
 </p>
 <p align="center">
-<a href="https://core.telegram.org/bots/webapps"><img alt="Telegram Bot API Version 7.8" src="https://img.shields.io/badge/Telegram%20Bot%20API-7.8-blue.svg?logo=telegram"/></a>
+<a href="https://core.telegram.org/bots/webapps"><img alt="Telegram Bot API Version 7.10" src="https://img.shields.io/badge/Telegram%20Bot%20API-7.10-blue.svg?logo=telegram"/></a>
 </p>
 <p align="center">
 <a href="https://github.com/DavisDmitry/telegram-webapps/actions/workflows/lint.yml"><img alt="CI Lint" src="https://github.com/DavisDmitry/telegram-webapps/actions/workflows/lint.yml/badge.svg"/></a>

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "telegram-webapps",
-  "version": "7.8.0",
+  "version": "7.10.0",
   "description": "Typings for Telegram Mini Apps",
   "keywords": [
     "telegram",
@@ -29,7 +29,7 @@
     "format": "prettier -w src"
   },
   "devDependencies": {
-    "prettier": "^3.2.5",
-    "typescript": "^5.4.4"
+    "prettier": "^3.3.3",
+    "typescript": "^5.5.4"
   }
 }
diff --git a/src/index.d.ts b/src/index.d.ts
@@ -136,6 +136,10 @@ export declare namespace TelegramWebApps {
      * Current background color in the `#RRGGBB` format.
      */
     readonly backgroundColor: string
+    /**
+     * Current bottom bar color in the `#RRGGBB` format.
+     */
+    readonly bottomBarColor: string
     /**
      * *True*, if the confirmation dialog is enabled while the user is trying to close the
      * Web App. *False*, if the confirmation dialog is disabled.
@@ -150,7 +154,12 @@ export declare namespace TelegramWebApps {
      * An object for controlling the main button, which is displayed at the bottom of the
      * Web App in the Telegram interface.
      */
-    readonly MainButton: MainButton
+    readonly MainButton: BottomButton
+    /**
+     * An object for controlling the secondary button, which is displayed at the bottom of
+     * the Mini App in the Telegram interface.
+     */
+    readonly SecondaryButton: BottomButton
     /**
      * An object for controlling the Settings item in the context menu of the Mini App in
      * the Telegram interface.
@@ -187,6 +196,12 @@ export declare namespace TelegramWebApps {
      * or you can use keywords *bg_color*, *secondary_bg_color* instead.
      */
     setBackgroundColor(color: string): void
+    /**
+     * `Bot API 7.10+` A method that sets the app's bottom bar color in the `#RRGGBB`
+     * format. You can also use the keywords *bg_color*, *secondary_bg_color* and
+     * *bottom_bar_bg_color*.
+     */
+    setBottomBarColor(color: string): void
     /**
      * `Bot API 6.2+` A method that enables a confirmation dialog while the user is trying
      * to close the Web App.
@@ -228,6 +243,12 @@ export declare namespace TelegramWebApps {
      * Event occurs when the main button is pressed.
      */
     onEvent(eventType: 'mainButtonClicked', eventHandler: () => void): void
+    /**
+     * A method that sets the app event handler.
+     *
+     * `Bot API 7.10+` Occurs when the secondary button is pressed.
+     */
+    onEvent(eventType: 'secondaryButtonClicked', eventHandler: () => void): void
     /**
      * A method that sets the app event handler.
      *
@@ -356,6 +377,7 @@ export declare namespace TelegramWebApps {
       eventType:
         | 'themeChanged'
         | 'mainButtonClicked'
+        | 'secondaryButtonClicked'
         | 'backButtonClicked'
         | 'settingsButtonClicked'
         | 'biometricManagerUpdated',
@@ -609,6 +631,12 @@ export declare namespace TelegramWebApps {
      * Also available as the CSS variable `var(--tg-theme-header-bg-color)`.
      */
     header_bg_color?: string
+    /**
+     * `Bot API 7.10+` Bottom background color in the `#RRGGBB` format.
+     *
+     * Also available as the CSS variable `var(--tg-theme-bottom-bar-bg-color)`.
+     */
+    bottom_bar_bg_color?: string
     /**
      * `Bot API 7.0+` Accent text color in the `#RRGGBB` format.
      *
@@ -743,20 +771,28 @@ export declare namespace TelegramWebApps {
   }
 
   /**
-   * This object controls the main button, which is displayed at the bottom of the Web App
-   * in the Telegram interface.
+   * This object controls the button that is displayed at the bottom of the Mini App in
+   * the Telegram interface.
    */
-  interface MainButton {
+  interface BottomButton {
     /**
-     * Current button text. Set to *CONTINUE* by default.
+     * Type of the button. It can be either *main* for the main button or *secondary* for
+     * the secondary button.
+     */
+    readonly type: 'main' | 'secondary'
+    /**
+     * Current button text. Set to *Continue* for the main button and *Cancel* for the
+     * secondary button by default.
      */
     text: string
     /**
-     * Current button color. Set to *themeParams.button_color* by default.
+     * Current button color. Set to *themeParams.button_color* for the main button and
+     * *themeParams.bottom_bar_bg_color* for the secondary button by default.
      */
     color: string
     /**
-     * Current button text color. Set to *themeParams.button_text_color* by default.
+     * Current button text color. Set to *themeParams.button_text_color* for the main
+     * button and *themeParams.button_color* for the secondary button by default.
      */
     textColor: string
     /**
@@ -767,43 +803,59 @@ export declare namespace TelegramWebApps {
      * 	Shows whether the button is active. Set to *true* by default.
      */
     isActive: boolean
+    /**
+     * `Bot API 7.10+` Shows whether the button has a shine effect. Set to *false* by
+     * default.
+     */
+    hasShineEffect: boolean
+    /**
+     * `Bot API 7.10+` Position of the secondary button. Not defined for the main button.
+     * It applies only if both the main and secondary buttons are visible. Set to *left*
+     * by default.
+     * Supported values:
+     * - *left*, displayed to the left of the main button,
+     * - *right*, displayed to the right of the main button.
+     * - *top*, displayed above the main button,
+     * - *bottom*, displayed below the main button.
+     */
+    position: 'left' | 'right' | 'top' | 'bottom'
     /**
      * Shows whether the button is displaying a loading indicator.
      */
     readonly isProgressVisible: boolean
     /**
      * A method to set the button text.
      */
-    setText(text: string): MainButton
+    setText(text: string): BottomButton
     /**
      * A method that sets the button press event handler. An alias for
      * `Telegram.WebApp.onEvent('mainButtonClicked', callback)`
      */
-    onClick(callback: () => void): MainButton
+    onClick(callback: () => void): BottomButton
     /**
      * A method that removes the button press event handler. An alias for
      * `Telegram.WebApp.offEvent('mainButtonClicked', callback)`
      */
-    offClick(callback: () => void): MainButton
+    offClick(callback: () => void): BottomButton
     /**
      * A method to make the button visible.
      *
      * *Note that opening the Web App from the attachment menu hides the main button until
      * the user interacts with the Web App interface.*
      */
-    show(): MainButton
+    show(): BottomButton
     /**
      * A method to hide the button.
      */
-    hide(): MainButton
+    hide(): BottomButton
     /**
      * A method to enable the button.
      */
-    enable(): MainButton
+    enable(): BottomButton
     /**
      * A method to disable the button.
      */
-    disable(): MainButton
+    disable(): BottomButton
     /**
      * A method to show a loading indicator on the button.
      *
@@ -812,21 +864,25 @@ export declare namespace TelegramWebApps {
      * progress. If the parameter `leaveActive=true` is passed, the button remains
      * enabled.
      */
-    showProgress(leaveActive?: boolean): MainButton
+    showProgress(leaveActive?: boolean): BottomButton
     /**
      * A method to hide the loading indicator.
      */
-    hideProgress(): MainButton
+    hideProgress(): BottomButton
     /**
-     * A method to set the button parameters. The params parameter is an object containing
-     * one or several fields that need to be changed:
+     * A method to set the button parameters. The *params* parameter is an object
+     * containing one or several fields that need to be changed:
      *
      * **text** - button text;
      *
      * **color** - button color;
      *
      * **text_color** - button text color;
      *
+     * **has_shine_effect** - `Bot API 7.10+` enable shine effect;
+     *
+     * **position** - `Bot API 7.10+` position of the secondary button;
+     *
      * **is_active** - enable the button;
      *
      * **is_visible** - show the button.
@@ -835,9 +891,11 @@ export declare namespace TelegramWebApps {
       text?: string
       color?: string
       text_color?: string
+      has_shine_effect?: boolean
+      position?: 'left' | 'right' | 'top' | 'bottom'
       is_active?: boolean
       is_visible?: boolean
-    }): MainButton
+    }): BottomButton
   }
 
   /**

diff --git a/yarn.lock b/yarn.lock
@@ -5,40 +5,40 @@ __metadata:
   version: 6
   cacheKey: 8
 
-"prettier@npm:^3.2.5":
-  version: 3.2.5
-  resolution: "prettier@npm:3.2.5"
+"prettier@npm:^3.3.3":
+  version: 3.3.3
+  resolution: "prettier@npm:3.3.3"
   bin:
     prettier: bin/prettier.cjs
-  checksum: 2ee4e1417572372afb7a13bb446b34f20f1bf1747db77cf6ccaf57a9be005f2f15c40f903d41a6b79eec3f57fff14d32a20fb6dee1f126da48908926fe43c311
+  checksum: bc8604354805acfdde6106852d14b045bb20827ad76a5ffc2455b71a8257f94de93f17f14e463fe844808d2ccc87248364a5691488a3304f1031326e62d9276e
   languageName: node
   linkType: hard
 
 "telegram-webapps@workspace:.":
   version: 0.0.0-use.local
   resolution: "telegram-webapps@workspace:."
   dependencies:
-    prettier: ^3.2.5
-    typescript: ^5.4.4
+    prettier: ^3.3.3
+    typescript: ^5.5.4
   languageName: unknown
   linkType: soft
 
-"typescript@npm:^5.4.4":
-  version: 5.4.4
-  resolution: "typescript@npm:5.4.4"
+"typescript@npm:^5.5.4":
+  version: 5.5.4
+  resolution: "typescript@npm:5.5.4"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: a7b54515d2adfc75c8d14188af0216b6b9ae3c192c9732797c24b1d14608eac1c83be7b1c65ce6f4ced0f2c40583f11b495fe1ba3d982afadbcc523517d183c8
+  checksum: b309040f3a1cd91c68a5a58af6b9fdd4e849b8c42d837b2c2e73f9a4f96a98c4f1ed398a9aab576ee0a4748f5690cf594e6b99dbe61de7839da748c41e6d6ca8
   languageName: node
   linkType: hard
 
-"typescript@patch:typescript@^5.4.4#~builtin<compat/typescript>":
-  version: 5.4.4
-  resolution: "typescript@patch:typescript@npm%3A5.4.4#~builtin<compat/typescript>::version=5.4.4&hash=f3b441"
+"typescript@patch:typescript@^5.5.4#~builtin<compat/typescript>":
+  version: 5.5.4
+  resolution: "typescript@patch:typescript@npm%3A5.5.4#~builtin<compat/typescript>::version=5.5.4&hash=f3b441"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: 34e8fe6b892736204c6c72ae9e3027fb37f23e34cf748340712101cbe9c55527c379c4d275c407e5c66ff73eca56c7425b1fb4ac5b23dc7a62413cf6a8af98e8
+  checksum: fc52962f31a5bcb716d4213bef516885e4f01f30cea797a831205fc9ef12b405a40561c40eae3127ab85ba1548e7df49df2bcdee6b84a94bfbe3a0d7eff16b14
   languageName: node
   linkType: hard