Merge pull request #39 from vkruglikov/rc

useWebApp hook

Author: vkruglikov

.changeset/modern-wolves-dream.md

@@ -0,0 +1,5 @@
+---
+'@vkruglikov/react-telegram-web-app': minor
+---
+
+useWebApp hook

README.md

@@ -85,6 +85,8 @@ const Content = () => {
   This hook provides `CloudStorage` object as Promise functions
 - [useInitData](./docs/README.md#useinitdata) -
   This hook provides `InitDataUnsafe` and `InitData` object
+- [useWebApp](./docs/README.md#usewebapp) -
+  This hook just provides native `WebApp` object
 
 ## 🛣 Roadmap
 

global.d.ts

@@ -1,4 +1,4 @@
-import { WebApp } from './src/core';
+import { WebApp } from './twa-types';
 
 declare global {
   interface Window {

package.json

@@ -22,7 +22,7 @@
   "unpkg": "lib/react-telegram-web-app.umd.js",
   "types": "lib/index.d.ts",
   "scripts": {
-    "build": "rm -rf ./lib/*; microbundle build --sourcemap=false && cp -R src/core/twa-types lib/core/twa-types",
+    "build": "rm -rf ./lib/*; microbundle build --sourcemap=false",
     "dev": "npm run build && microbundle watch --compress=false",
     "prepare": "husky install",
     "changeset": "changeset",

src/core/context.ts

@@ -1,12 +1,12 @@
 import { createContext, MutableRefObject } from 'react';
-import { WebApp } from './twa-types';
 
 export const DEFAULT_WEBAPP =
   typeof window !== 'undefined' && window?.Telegram?.WebApp
     ? window.Telegram.WebApp
     : null;
 
-export const webAppContext = createContext<WebApp | null>(DEFAULT_WEBAPP);
+export const webAppContext =
+  createContext<typeof DEFAULT_WEBAPP>(DEFAULT_WEBAPP);
 
 /**
  * This object describe options be able to set through WebAppProvider

src/core/index.ts

@@ -1,4 +1,3 @@
-export { WebApp } from './twa-types';
 export { default as useSmoothButtonsTransition } from './useSmoothButtonsTransition';
 export { default as useWebApp } from './useWebApp';
 export * from './context';

src/index.ts

@@ -54,3 +54,4 @@ export {
   InitDataUnsafe,
 } from './useInitData';
 export type { Options } from './core';
+export { default as useWebApp } from './useWebApp';

src/useWebApp.ts

@@ -0,0 +1,17 @@
+import { useWebApp as _useWebApp } from './core';
+
+/**
+ * This hook just provides native {@link telegram!WebApp} object
+ *
+ * ```tsx
+ * import { useWebApp } from "@vkruglikov/react-telegram-web-app";
+ *
+ * const WebApp = useWebApp();
+ *
+ * console.log(WebApp.version);
+ * ```
+ * @group Hooks
+ */
+const useWebApp = () => _useWebApp();
+
+export default useWebApp;

tests/__snapshots__/package.test.ts.snap

@@ -8,15 +8,6 @@ exports[`Package /lib should have correct /lib structure 1`] = `
   [
     "/core/context.d.ts",
     "/core/index.d.ts",
-    [
-      "/core/twa-types/WebApp.d.ts",
-      "/core/twa-types/WebAppVersion_6.1.d.ts",
-      "/core/twa-types/WebAppVersion_6.2.d.ts",
-      "/core/twa-types/WebAppVersion_6.4.d.ts",
-      "/core/twa-types/WebAppVersion_6.7.d.ts",
-      "/core/twa-types/WebAppVersion_6.9.d.ts",
-      "/core/twa-types/index.d.ts",
-    ],
     "/core/useSmoothButtonsTransition.d.ts",
     "/core/useWebApp.d.ts",
   ],
@@ -34,6 +25,7 @@ exports[`Package /lib should have correct /lib structure 1`] = `
   "/useShowPopup.d.ts",
   "/useSwitchInlineQuery.d.ts",
   "/useThemeParams.d.ts",
+  "/useWebApp.d.ts",
 ]
 `;
 
@@ -51,5 +43,6 @@ exports[`Package /lib should have exports from modules 1`] = `
   "useShowPopup": [Function],
   "useSwitchInlineQuery": [Function],
   "useThemeParams": [Function],
+  "useWebApp": [Function],
 }
 `;

tests/useExpand.test.tsx

@@ -1,6 +1,7 @@
 import { act, renderHook } from '@testing-library/react';
 
-import { useWebApp, WebApp } from '../src/core';
+import { useWebApp } from '../src/core';
+import { WebApp } from '../twa-types';
 import useExpand from '../src/useExpand';
 
 describe('useExpand', () => {

tests/useReadTextFromClipboard.test.ts

@@ -1,6 +1,7 @@
 import { renderHook } from '@testing-library/react';
 import useReadTextFromClipboard from '../src/useReadTextFromClipboard';
-import { useWebApp, WebApp } from '../src/core';
+import { useWebApp } from '../src/core';
+import { WebApp } from '../twa-types';
 
 describe('useReadTextFromClipboard', () => {
   it('checks correct call WebApp.readTextFromClipboard api', async () => {

tests/useShowPopup.test.ts

@@ -1,6 +1,7 @@
 import { renderHook } from '@testing-library/react';
 import useShowPopup from '../src/useShowPopup';
-import { useWebApp, WebApp } from '../src/core';
+import { useWebApp } from '../src/core';
+import { WebApp } from '../twa-types';
 
 describe('useShowPopup', () => {
   it('checks correct call WebApp.showPopup api', async () => {

tests/useThemeParams.test.ts

@@ -1,6 +1,7 @@
 import { act, renderHook } from '@testing-library/react';
 
-import { useWebApp, WebApp } from '../src/core';
+import { useWebApp } from '../src/core';
+import { WebApp } from '../twa-types';
 import useThemeParams from '../src/useThemeParams';
 
 describe('useThemeParams', () => {