@mr-m/telegram-webapp-kit 1.0.1 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +1 -144
- package/dist/index.d.ts +1 -144
- package/dist/index.js +3 -163
- package/dist/index.mjs +4 -160
- package/package.json +11 -2
package/dist/index.d.mts
CHANGED
|
@@ -333,117 +333,6 @@ declare global {
|
|
|
333
333
|
declare function getWebApp(): TgWebApp | null;
|
|
334
334
|
declare function isInTelegram(): boolean;
|
|
335
335
|
declare function isVersionAtLeast(version: string): boolean;
|
|
336
|
-
declare function tgLangToTmdb(code?: string): string;
|
|
337
|
-
declare function tgLangToUi(code?: string): string;
|
|
338
|
-
declare const RTL_LANGS: Set<string>;
|
|
339
|
-
declare function isRtlLang(lang?: string): boolean;
|
|
340
|
-
declare const SUPPORTED_LANGS: readonly [{
|
|
341
|
-
readonly code: "en";
|
|
342
|
-
readonly countryCode: "us";
|
|
343
|
-
readonly name: "English";
|
|
344
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/us.svg";
|
|
345
|
-
}, {
|
|
346
|
-
readonly code: "ar";
|
|
347
|
-
readonly countryCode: "sa";
|
|
348
|
-
readonly name: "العربية";
|
|
349
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/sa.svg";
|
|
350
|
-
}, {
|
|
351
|
-
readonly code: "es";
|
|
352
|
-
readonly countryCode: "es";
|
|
353
|
-
readonly name: "Español";
|
|
354
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/es.svg";
|
|
355
|
-
}, {
|
|
356
|
-
readonly code: "fr";
|
|
357
|
-
readonly countryCode: "fr";
|
|
358
|
-
readonly name: "Français";
|
|
359
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/fr.svg";
|
|
360
|
-
}, {
|
|
361
|
-
readonly code: "de";
|
|
362
|
-
readonly countryCode: "de";
|
|
363
|
-
readonly name: "Deutsch";
|
|
364
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/de.svg";
|
|
365
|
-
}, {
|
|
366
|
-
readonly code: "it";
|
|
367
|
-
readonly countryCode: "it";
|
|
368
|
-
readonly name: "Italiano";
|
|
369
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/it.svg";
|
|
370
|
-
}, {
|
|
371
|
-
readonly code: "pt";
|
|
372
|
-
readonly countryCode: "pt";
|
|
373
|
-
readonly name: "Português";
|
|
374
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/pt.svg";
|
|
375
|
-
}, {
|
|
376
|
-
readonly code: "ru";
|
|
377
|
-
readonly countryCode: "ru";
|
|
378
|
-
readonly name: "Русский";
|
|
379
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ru.svg";
|
|
380
|
-
}, {
|
|
381
|
-
readonly code: "zh";
|
|
382
|
-
readonly countryCode: "cn";
|
|
383
|
-
readonly name: "中文";
|
|
384
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/cn.svg";
|
|
385
|
-
}, {
|
|
386
|
-
readonly code: "ja";
|
|
387
|
-
readonly countryCode: "jp";
|
|
388
|
-
readonly name: "日本語";
|
|
389
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/jp.svg";
|
|
390
|
-
}, {
|
|
391
|
-
readonly code: "ko";
|
|
392
|
-
readonly countryCode: "kr";
|
|
393
|
-
readonly name: "한국어";
|
|
394
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/kr.svg";
|
|
395
|
-
}, {
|
|
396
|
-
readonly code: "tr";
|
|
397
|
-
readonly countryCode: "tr";
|
|
398
|
-
readonly name: "Türkçe";
|
|
399
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/tr.svg";
|
|
400
|
-
}, {
|
|
401
|
-
readonly code: "hi";
|
|
402
|
-
readonly countryCode: "in";
|
|
403
|
-
readonly name: "हिन्दी";
|
|
404
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/in.svg";
|
|
405
|
-
}, {
|
|
406
|
-
readonly code: "id";
|
|
407
|
-
readonly countryCode: "id";
|
|
408
|
-
readonly name: "Indonesia";
|
|
409
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/id.svg";
|
|
410
|
-
}, {
|
|
411
|
-
readonly code: "nl";
|
|
412
|
-
readonly countryCode: "nl";
|
|
413
|
-
readonly name: "Nederlands";
|
|
414
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/nl.svg";
|
|
415
|
-
}, {
|
|
416
|
-
readonly code: "pl";
|
|
417
|
-
readonly countryCode: "pl";
|
|
418
|
-
readonly name: "Polski";
|
|
419
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/pl.svg";
|
|
420
|
-
}, {
|
|
421
|
-
readonly code: "sv";
|
|
422
|
-
readonly countryCode: "se";
|
|
423
|
-
readonly name: "Svenska";
|
|
424
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/se.svg";
|
|
425
|
-
}, {
|
|
426
|
-
readonly code: "uk";
|
|
427
|
-
readonly countryCode: "ua";
|
|
428
|
-
readonly name: "Українська";
|
|
429
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ua.svg";
|
|
430
|
-
}, {
|
|
431
|
-
readonly code: "vi";
|
|
432
|
-
readonly countryCode: "vn";
|
|
433
|
-
readonly name: "Tiếng Việt";
|
|
434
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/vn.svg";
|
|
435
|
-
}, {
|
|
436
|
-
readonly code: "fa";
|
|
437
|
-
readonly countryCode: "ir";
|
|
438
|
-
readonly name: "فارسی";
|
|
439
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ir.svg";
|
|
440
|
-
}, {
|
|
441
|
-
readonly code: "he";
|
|
442
|
-
readonly countryCode: "il";
|
|
443
|
-
readonly name: "עברית";
|
|
444
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/il.svg";
|
|
445
|
-
}];
|
|
446
|
-
type Language = (typeof SUPPORTED_LANGS)[number];
|
|
447
336
|
declare function openExternalLink(url: string, tryInstantView?: boolean): void;
|
|
448
337
|
declare function openTelegramLink(url: string): void;
|
|
449
338
|
declare function getUserAvatarUrl(user?: TgUser, defaultAvatarUrl?: string): string;
|
|
@@ -495,28 +384,14 @@ declare const location: {
|
|
|
495
384
|
getLocation: () => Promise<LocationData | null>;
|
|
496
385
|
};
|
|
497
386
|
|
|
498
|
-
/**
|
|
499
|
-
* Returns the raw Telegram WebApp instance.
|
|
500
|
-
* Null on server or outside Telegram.
|
|
501
|
-
*/
|
|
502
387
|
declare function useTelegramWebApp(): TgWebApp | null;
|
|
503
388
|
declare function useTelegramUser(): TgUser | null;
|
|
504
|
-
/**
|
|
505
|
-
* Subscribe to any Telegram WebApp event.
|
|
506
|
-
*/
|
|
507
389
|
declare function useTelegramEvent(eventType: WebAppEventType | string, handler: (...args: unknown[]) => void): void;
|
|
508
|
-
/**
|
|
509
|
-
* Automatically shows/hides the Telegram Back Button based on pathname.
|
|
510
|
-
* Pass `onBack` to override default browser history back behavior.
|
|
511
|
-
*/
|
|
512
390
|
declare function useTelegramBackButton(options?: {
|
|
513
391
|
pathname?: string;
|
|
514
392
|
onBack?: () => void;
|
|
515
393
|
hideOnRoot?: boolean;
|
|
516
394
|
}): void;
|
|
517
|
-
/**
|
|
518
|
-
* Control the Telegram Main Button declaratively.
|
|
519
|
-
*/
|
|
520
395
|
declare function useTelegramMainButton(options: {
|
|
521
396
|
text: string;
|
|
522
397
|
onClick: () => void;
|
|
@@ -636,33 +511,17 @@ declare function useTelegramStartParam(): string | null;
|
|
|
636
511
|
interface TelegramContextValue {
|
|
637
512
|
ready: boolean;
|
|
638
513
|
inTelegram: boolean;
|
|
639
|
-
/** true in dev mode when bypass=true in URL or NODE_ENV === 'development' */
|
|
640
514
|
bypass: boolean;
|
|
641
515
|
webApp: TgWebApp | null;
|
|
642
516
|
user: TgUser | null;
|
|
643
|
-
/** TMDB-style locale e.g. 'en-US' */
|
|
644
|
-
language: string;
|
|
645
|
-
/** Short UI lang code e.g. 'en' */
|
|
646
|
-
uiLang: string;
|
|
647
517
|
colorScheme: 'light' | 'dark';
|
|
648
518
|
startParam: string | null;
|
|
649
|
-
isRtl: boolean;
|
|
650
|
-
changeLanguage: (lang: string) => void;
|
|
651
519
|
}
|
|
652
520
|
interface TelegramProviderOptions {
|
|
653
|
-
/** localStorage key for saved language */
|
|
654
|
-
langStorageKey?: string;
|
|
655
|
-
/** Called when a user is found; use to sync to your backend */
|
|
656
521
|
onUserReady?: (user: TgUser) => void;
|
|
657
|
-
/** Called when the WebApp is initialized */
|
|
658
522
|
onReady?: (wa: TgWebApp) => void;
|
|
659
|
-
/** Custom i18n change function */
|
|
660
|
-
onLanguageChange?: (lang: string) => void;
|
|
661
|
-
/** Component shown while initializing */
|
|
662
523
|
loadingComponent?: ReactNode;
|
|
663
|
-
/** Component shown when not in Telegram (outside dev bypass) */
|
|
664
524
|
notInTelegramComponent?: ReactNode;
|
|
665
|
-
/** Allow rendering outside Telegram in all envs (not just dev) */
|
|
666
525
|
allowOutsideTelegram?: boolean;
|
|
667
526
|
}
|
|
668
527
|
declare function useTelegram(): TelegramContextValue;
|
|
@@ -688,9 +547,7 @@ interface FullscreenContextValue {
|
|
|
688
547
|
}
|
|
689
548
|
declare function useFullscreen(): FullscreenContextValue;
|
|
690
549
|
interface FullscreenProviderOptions {
|
|
691
|
-
/** localStorage key to persist user preference */
|
|
692
550
|
storageKey?: string;
|
|
693
|
-
/** Auto-restore fullscreen preference on mount */
|
|
694
551
|
persistPreference?: boolean;
|
|
695
552
|
}
|
|
696
553
|
declare function FullscreenProvider({ children, options, }: {
|
|
@@ -698,4 +555,4 @@ declare function FullscreenProvider({ children, options, }: {
|
|
|
698
555
|
options?: FullscreenProviderOptions;
|
|
699
556
|
}): react.JSX.Element;
|
|
700
557
|
|
|
701
|
-
export { type Accelerometer, type BackButton, type BiometricAuthenticateParams, type BiometricManager, type BiometricRequestAccessParams, type BottomButton, type BottomButtonParams, type ChatAdministratorRights, type CloudStorage, type DeviceOrientation, type DownloadFileParams, type EmojiStatusParams, FullscreenProvider, type FullscreenProviderOptions, type Gyroscope, type HapticFeedback, type
|
|
558
|
+
export { type Accelerometer, type BackButton, type BiometricAuthenticateParams, type BiometricManager, type BiometricRequestAccessParams, type BottomButton, type BottomButtonParams, type ChatAdministratorRights, type CloudStorage, type DeviceOrientation, type DownloadFileParams, type EmojiStatusParams, FullscreenProvider, type FullscreenProviderOptions, type Gyroscope, type HapticFeedback, type LocationData, type LocationManager, type MainButton, type PopupButton, type PopupParams, type RequestChatParams, type SafeAreaInset, type ScanQrPopupParams, type SecondaryButton, type SettingsButton, type StoryShareParams, type TelegramContextValue, TelegramProvider, type TelegramProviderOptions, type TgThemeParams, type TgUser, type TgWebApp, type WebAppEventType, biometric, cloudStorage, dialog, getRawUserData, getUserAvatarUrl, getUserDisplayName, getUserIdentifier, getUserInfoWithAvatar, getWebApp, haptic, isInTelegram, isVersionAtLeast, location, openExternalLink, openInvoice, openTelegramLink, readClipboard, scanQr, useAccelerometer, useBiometric, useCloudStorage, useDeviceOrientation, useFullscreen, useGyroscope, useHapticFeedback, useHomeScreen, useIsActive, useLocation, useSafeArea, useTelegram, useTelegramBackButton, useTelegramEvent, useTelegramFullscreen, useTelegramMainButton, useTelegramSecondaryButton, useTelegramSettingsButton, useTelegramStartParam, useTelegramTheme, useTelegramUser, useTelegramViewport, useTelegramWebApp };
|
package/dist/index.d.ts
CHANGED
|
@@ -333,117 +333,6 @@ declare global {
|
|
|
333
333
|
declare function getWebApp(): TgWebApp | null;
|
|
334
334
|
declare function isInTelegram(): boolean;
|
|
335
335
|
declare function isVersionAtLeast(version: string): boolean;
|
|
336
|
-
declare function tgLangToTmdb(code?: string): string;
|
|
337
|
-
declare function tgLangToUi(code?: string): string;
|
|
338
|
-
declare const RTL_LANGS: Set<string>;
|
|
339
|
-
declare function isRtlLang(lang?: string): boolean;
|
|
340
|
-
declare const SUPPORTED_LANGS: readonly [{
|
|
341
|
-
readonly code: "en";
|
|
342
|
-
readonly countryCode: "us";
|
|
343
|
-
readonly name: "English";
|
|
344
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/us.svg";
|
|
345
|
-
}, {
|
|
346
|
-
readonly code: "ar";
|
|
347
|
-
readonly countryCode: "sa";
|
|
348
|
-
readonly name: "العربية";
|
|
349
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/sa.svg";
|
|
350
|
-
}, {
|
|
351
|
-
readonly code: "es";
|
|
352
|
-
readonly countryCode: "es";
|
|
353
|
-
readonly name: "Español";
|
|
354
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/es.svg";
|
|
355
|
-
}, {
|
|
356
|
-
readonly code: "fr";
|
|
357
|
-
readonly countryCode: "fr";
|
|
358
|
-
readonly name: "Français";
|
|
359
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/fr.svg";
|
|
360
|
-
}, {
|
|
361
|
-
readonly code: "de";
|
|
362
|
-
readonly countryCode: "de";
|
|
363
|
-
readonly name: "Deutsch";
|
|
364
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/de.svg";
|
|
365
|
-
}, {
|
|
366
|
-
readonly code: "it";
|
|
367
|
-
readonly countryCode: "it";
|
|
368
|
-
readonly name: "Italiano";
|
|
369
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/it.svg";
|
|
370
|
-
}, {
|
|
371
|
-
readonly code: "pt";
|
|
372
|
-
readonly countryCode: "pt";
|
|
373
|
-
readonly name: "Português";
|
|
374
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/pt.svg";
|
|
375
|
-
}, {
|
|
376
|
-
readonly code: "ru";
|
|
377
|
-
readonly countryCode: "ru";
|
|
378
|
-
readonly name: "Русский";
|
|
379
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ru.svg";
|
|
380
|
-
}, {
|
|
381
|
-
readonly code: "zh";
|
|
382
|
-
readonly countryCode: "cn";
|
|
383
|
-
readonly name: "中文";
|
|
384
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/cn.svg";
|
|
385
|
-
}, {
|
|
386
|
-
readonly code: "ja";
|
|
387
|
-
readonly countryCode: "jp";
|
|
388
|
-
readonly name: "日本語";
|
|
389
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/jp.svg";
|
|
390
|
-
}, {
|
|
391
|
-
readonly code: "ko";
|
|
392
|
-
readonly countryCode: "kr";
|
|
393
|
-
readonly name: "한국어";
|
|
394
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/kr.svg";
|
|
395
|
-
}, {
|
|
396
|
-
readonly code: "tr";
|
|
397
|
-
readonly countryCode: "tr";
|
|
398
|
-
readonly name: "Türkçe";
|
|
399
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/tr.svg";
|
|
400
|
-
}, {
|
|
401
|
-
readonly code: "hi";
|
|
402
|
-
readonly countryCode: "in";
|
|
403
|
-
readonly name: "हिन्दी";
|
|
404
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/in.svg";
|
|
405
|
-
}, {
|
|
406
|
-
readonly code: "id";
|
|
407
|
-
readonly countryCode: "id";
|
|
408
|
-
readonly name: "Indonesia";
|
|
409
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/id.svg";
|
|
410
|
-
}, {
|
|
411
|
-
readonly code: "nl";
|
|
412
|
-
readonly countryCode: "nl";
|
|
413
|
-
readonly name: "Nederlands";
|
|
414
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/nl.svg";
|
|
415
|
-
}, {
|
|
416
|
-
readonly code: "pl";
|
|
417
|
-
readonly countryCode: "pl";
|
|
418
|
-
readonly name: "Polski";
|
|
419
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/pl.svg";
|
|
420
|
-
}, {
|
|
421
|
-
readonly code: "sv";
|
|
422
|
-
readonly countryCode: "se";
|
|
423
|
-
readonly name: "Svenska";
|
|
424
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/se.svg";
|
|
425
|
-
}, {
|
|
426
|
-
readonly code: "uk";
|
|
427
|
-
readonly countryCode: "ua";
|
|
428
|
-
readonly name: "Українська";
|
|
429
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ua.svg";
|
|
430
|
-
}, {
|
|
431
|
-
readonly code: "vi";
|
|
432
|
-
readonly countryCode: "vn";
|
|
433
|
-
readonly name: "Tiếng Việt";
|
|
434
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/vn.svg";
|
|
435
|
-
}, {
|
|
436
|
-
readonly code: "fa";
|
|
437
|
-
readonly countryCode: "ir";
|
|
438
|
-
readonly name: "فارسی";
|
|
439
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ir.svg";
|
|
440
|
-
}, {
|
|
441
|
-
readonly code: "he";
|
|
442
|
-
readonly countryCode: "il";
|
|
443
|
-
readonly name: "עברית";
|
|
444
|
-
readonly flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/il.svg";
|
|
445
|
-
}];
|
|
446
|
-
type Language = (typeof SUPPORTED_LANGS)[number];
|
|
447
336
|
declare function openExternalLink(url: string, tryInstantView?: boolean): void;
|
|
448
337
|
declare function openTelegramLink(url: string): void;
|
|
449
338
|
declare function getUserAvatarUrl(user?: TgUser, defaultAvatarUrl?: string): string;
|
|
@@ -495,28 +384,14 @@ declare const location: {
|
|
|
495
384
|
getLocation: () => Promise<LocationData | null>;
|
|
496
385
|
};
|
|
497
386
|
|
|
498
|
-
/**
|
|
499
|
-
* Returns the raw Telegram WebApp instance.
|
|
500
|
-
* Null on server or outside Telegram.
|
|
501
|
-
*/
|
|
502
387
|
declare function useTelegramWebApp(): TgWebApp | null;
|
|
503
388
|
declare function useTelegramUser(): TgUser | null;
|
|
504
|
-
/**
|
|
505
|
-
* Subscribe to any Telegram WebApp event.
|
|
506
|
-
*/
|
|
507
389
|
declare function useTelegramEvent(eventType: WebAppEventType | string, handler: (...args: unknown[]) => void): void;
|
|
508
|
-
/**
|
|
509
|
-
* Automatically shows/hides the Telegram Back Button based on pathname.
|
|
510
|
-
* Pass `onBack` to override default browser history back behavior.
|
|
511
|
-
*/
|
|
512
390
|
declare function useTelegramBackButton(options?: {
|
|
513
391
|
pathname?: string;
|
|
514
392
|
onBack?: () => void;
|
|
515
393
|
hideOnRoot?: boolean;
|
|
516
394
|
}): void;
|
|
517
|
-
/**
|
|
518
|
-
* Control the Telegram Main Button declaratively.
|
|
519
|
-
*/
|
|
520
395
|
declare function useTelegramMainButton(options: {
|
|
521
396
|
text: string;
|
|
522
397
|
onClick: () => void;
|
|
@@ -636,33 +511,17 @@ declare function useTelegramStartParam(): string | null;
|
|
|
636
511
|
interface TelegramContextValue {
|
|
637
512
|
ready: boolean;
|
|
638
513
|
inTelegram: boolean;
|
|
639
|
-
/** true in dev mode when bypass=true in URL or NODE_ENV === 'development' */
|
|
640
514
|
bypass: boolean;
|
|
641
515
|
webApp: TgWebApp | null;
|
|
642
516
|
user: TgUser | null;
|
|
643
|
-
/** TMDB-style locale e.g. 'en-US' */
|
|
644
|
-
language: string;
|
|
645
|
-
/** Short UI lang code e.g. 'en' */
|
|
646
|
-
uiLang: string;
|
|
647
517
|
colorScheme: 'light' | 'dark';
|
|
648
518
|
startParam: string | null;
|
|
649
|
-
isRtl: boolean;
|
|
650
|
-
changeLanguage: (lang: string) => void;
|
|
651
519
|
}
|
|
652
520
|
interface TelegramProviderOptions {
|
|
653
|
-
/** localStorage key for saved language */
|
|
654
|
-
langStorageKey?: string;
|
|
655
|
-
/** Called when a user is found; use to sync to your backend */
|
|
656
521
|
onUserReady?: (user: TgUser) => void;
|
|
657
|
-
/** Called when the WebApp is initialized */
|
|
658
522
|
onReady?: (wa: TgWebApp) => void;
|
|
659
|
-
/** Custom i18n change function */
|
|
660
|
-
onLanguageChange?: (lang: string) => void;
|
|
661
|
-
/** Component shown while initializing */
|
|
662
523
|
loadingComponent?: ReactNode;
|
|
663
|
-
/** Component shown when not in Telegram (outside dev bypass) */
|
|
664
524
|
notInTelegramComponent?: ReactNode;
|
|
665
|
-
/** Allow rendering outside Telegram in all envs (not just dev) */
|
|
666
525
|
allowOutsideTelegram?: boolean;
|
|
667
526
|
}
|
|
668
527
|
declare function useTelegram(): TelegramContextValue;
|
|
@@ -688,9 +547,7 @@ interface FullscreenContextValue {
|
|
|
688
547
|
}
|
|
689
548
|
declare function useFullscreen(): FullscreenContextValue;
|
|
690
549
|
interface FullscreenProviderOptions {
|
|
691
|
-
/** localStorage key to persist user preference */
|
|
692
550
|
storageKey?: string;
|
|
693
|
-
/** Auto-restore fullscreen preference on mount */
|
|
694
551
|
persistPreference?: boolean;
|
|
695
552
|
}
|
|
696
553
|
declare function FullscreenProvider({ children, options, }: {
|
|
@@ -698,4 +555,4 @@ declare function FullscreenProvider({ children, options, }: {
|
|
|
698
555
|
options?: FullscreenProviderOptions;
|
|
699
556
|
}): react.JSX.Element;
|
|
700
557
|
|
|
701
|
-
export { type Accelerometer, type BackButton, type BiometricAuthenticateParams, type BiometricManager, type BiometricRequestAccessParams, type BottomButton, type BottomButtonParams, type ChatAdministratorRights, type CloudStorage, type DeviceOrientation, type DownloadFileParams, type EmojiStatusParams, FullscreenProvider, type FullscreenProviderOptions, type Gyroscope, type HapticFeedback, type
|
|
558
|
+
export { type Accelerometer, type BackButton, type BiometricAuthenticateParams, type BiometricManager, type BiometricRequestAccessParams, type BottomButton, type BottomButtonParams, type ChatAdministratorRights, type CloudStorage, type DeviceOrientation, type DownloadFileParams, type EmojiStatusParams, FullscreenProvider, type FullscreenProviderOptions, type Gyroscope, type HapticFeedback, type LocationData, type LocationManager, type MainButton, type PopupButton, type PopupParams, type RequestChatParams, type SafeAreaInset, type ScanQrPopupParams, type SecondaryButton, type SettingsButton, type StoryShareParams, type TelegramContextValue, TelegramProvider, type TelegramProviderOptions, type TgThemeParams, type TgUser, type TgWebApp, type WebAppEventType, biometric, cloudStorage, dialog, getRawUserData, getUserAvatarUrl, getUserDisplayName, getUserIdentifier, getUserInfoWithAvatar, getWebApp, haptic, isInTelegram, isVersionAtLeast, location, openExternalLink, openInvoice, openTelegramLink, readClipboard, scanQr, useAccelerometer, useBiometric, useCloudStorage, useDeviceOrientation, useFullscreen, useGyroscope, useHapticFeedback, useHomeScreen, useIsActive, useLocation, useSafeArea, useTelegram, useTelegramBackButton, useTelegramEvent, useTelegramFullscreen, useTelegramMainButton, useTelegramSecondaryButton, useTelegramSettingsButton, useTelegramStartParam, useTelegramTheme, useTelegramUser, useTelegramViewport, useTelegramWebApp };
|
package/dist/index.js
CHANGED
|
@@ -38,8 +38,6 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
38
38
|
var index_exports = {};
|
|
39
39
|
__export(index_exports, {
|
|
40
40
|
FullscreenProvider: () => FullscreenProvider,
|
|
41
|
-
RTL_LANGS: () => RTL_LANGS,
|
|
42
|
-
SUPPORTED_LANGS: () => SUPPORTED_LANGS,
|
|
43
41
|
TelegramProvider: () => TelegramProvider,
|
|
44
42
|
biometric: () => biometric,
|
|
45
43
|
cloudStorage: () => cloudStorage,
|
|
@@ -52,7 +50,6 @@ __export(index_exports, {
|
|
|
52
50
|
getWebApp: () => getWebApp,
|
|
53
51
|
haptic: () => haptic,
|
|
54
52
|
isInTelegram: () => isInTelegram,
|
|
55
|
-
isRtlLang: () => isRtlLang,
|
|
56
53
|
isVersionAtLeast: () => isVersionAtLeast,
|
|
57
54
|
location: () => location,
|
|
58
55
|
openExternalLink: () => openExternalLink,
|
|
@@ -60,8 +57,6 @@ __export(index_exports, {
|
|
|
60
57
|
openTelegramLink: () => openTelegramLink,
|
|
61
58
|
readClipboard: () => readClipboard,
|
|
62
59
|
scanQr: () => scanQr,
|
|
63
|
-
tgLangToTmdb: () => tgLangToTmdb,
|
|
64
|
-
tgLangToUi: () => tgLangToUi,
|
|
65
60
|
useAccelerometer: () => useAccelerometer,
|
|
66
61
|
useBiometric: () => useBiometric,
|
|
67
62
|
useCloudStorage: () => useCloudStorage,
|
|
@@ -102,109 +97,6 @@ function isVersionAtLeast(version) {
|
|
|
102
97
|
var _a, _b;
|
|
103
98
|
return (_b = (_a = getWebApp()) == null ? void 0 : _a.isVersionAtLeast(version)) != null ? _b : false;
|
|
104
99
|
}
|
|
105
|
-
function tgLangToTmdb(code) {
|
|
106
|
-
var _a;
|
|
107
|
-
if (!code) return "en-US";
|
|
108
|
-
const base = code.toLowerCase().split("-")[0];
|
|
109
|
-
const map = {
|
|
110
|
-
en: "en-US",
|
|
111
|
-
ar: "ar-SA",
|
|
112
|
-
es: "es-ES",
|
|
113
|
-
fr: "fr-FR",
|
|
114
|
-
de: "de-DE",
|
|
115
|
-
it: "it-IT",
|
|
116
|
-
pt: "pt-BR",
|
|
117
|
-
ru: "ru-RU",
|
|
118
|
-
zh: "zh-CN",
|
|
119
|
-
ja: "ja-JP",
|
|
120
|
-
ko: "ko-KR",
|
|
121
|
-
tr: "tr-TR",
|
|
122
|
-
hi: "hi-IN",
|
|
123
|
-
id: "id-ID",
|
|
124
|
-
nl: "nl-NL",
|
|
125
|
-
pl: "pl-PL",
|
|
126
|
-
sv: "sv-SE",
|
|
127
|
-
uk: "uk-UA",
|
|
128
|
-
vi: "vi-VN",
|
|
129
|
-
fa: "fa-IR",
|
|
130
|
-
he: "he-IL",
|
|
131
|
-
cs: "cs-CZ",
|
|
132
|
-
da: "da-DK",
|
|
133
|
-
fi: "fi-FI",
|
|
134
|
-
hu: "hu-HU",
|
|
135
|
-
nb: "nb-NO",
|
|
136
|
-
ro: "ro-RO",
|
|
137
|
-
sk: "sk-SK",
|
|
138
|
-
th: "th-TH",
|
|
139
|
-
ms: "ms-MY"
|
|
140
|
-
};
|
|
141
|
-
return (_a = map[base]) != null ? _a : "en-US";
|
|
142
|
-
}
|
|
143
|
-
function tgLangToUi(code) {
|
|
144
|
-
if (!code) return "en";
|
|
145
|
-
const base = code.toLowerCase().split("-")[0];
|
|
146
|
-
const supported = [
|
|
147
|
-
"en",
|
|
148
|
-
"ar",
|
|
149
|
-
"es",
|
|
150
|
-
"fr",
|
|
151
|
-
"de",
|
|
152
|
-
"it",
|
|
153
|
-
"pt",
|
|
154
|
-
"ru",
|
|
155
|
-
"zh",
|
|
156
|
-
"ja",
|
|
157
|
-
"ko",
|
|
158
|
-
"tr",
|
|
159
|
-
"hi",
|
|
160
|
-
"id",
|
|
161
|
-
"nl",
|
|
162
|
-
"pl",
|
|
163
|
-
"sv",
|
|
164
|
-
"uk",
|
|
165
|
-
"vi",
|
|
166
|
-
"fa",
|
|
167
|
-
"he",
|
|
168
|
-
"cs",
|
|
169
|
-
"da",
|
|
170
|
-
"fi",
|
|
171
|
-
"hu",
|
|
172
|
-
"nb",
|
|
173
|
-
"ro",
|
|
174
|
-
"sk",
|
|
175
|
-
"th",
|
|
176
|
-
"ms"
|
|
177
|
-
];
|
|
178
|
-
return supported.includes(base) ? base : "en";
|
|
179
|
-
}
|
|
180
|
-
var RTL_LANGS = /* @__PURE__ */ new Set(["ar", "fa", "he", "ur", "yi", "ug", "ku"]);
|
|
181
|
-
function isRtlLang(lang) {
|
|
182
|
-
if (!lang) return false;
|
|
183
|
-
return RTL_LANGS.has(lang.toLowerCase().split("-")[0]);
|
|
184
|
-
}
|
|
185
|
-
var SUPPORTED_LANGS = [
|
|
186
|
-
{ code: "en", countryCode: "us", name: "English", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/us.svg" },
|
|
187
|
-
{ code: "ar", countryCode: "sa", name: "\u0627\u0644\u0639\u0631\u0628\u064A\u0629", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/sa.svg" },
|
|
188
|
-
{ code: "es", countryCode: "es", name: "Espa\xF1ol", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/es.svg" },
|
|
189
|
-
{ code: "fr", countryCode: "fr", name: "Fran\xE7ais", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/fr.svg" },
|
|
190
|
-
{ code: "de", countryCode: "de", name: "Deutsch", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/de.svg" },
|
|
191
|
-
{ code: "it", countryCode: "it", name: "Italiano", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/it.svg" },
|
|
192
|
-
{ code: "pt", countryCode: "pt", name: "Portugu\xEAs", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/pt.svg" },
|
|
193
|
-
{ code: "ru", countryCode: "ru", name: "\u0420\u0443\u0441\u0441\u043A\u0438\u0439", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ru.svg" },
|
|
194
|
-
{ code: "zh", countryCode: "cn", name: "\u4E2D\u6587", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/cn.svg" },
|
|
195
|
-
{ code: "ja", countryCode: "jp", name: "\u65E5\u672C\u8A9E", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/jp.svg" },
|
|
196
|
-
{ code: "ko", countryCode: "kr", name: "\uD55C\uAD6D\uC5B4", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/kr.svg" },
|
|
197
|
-
{ code: "tr", countryCode: "tr", name: "T\xFCrk\xE7e", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/tr.svg" },
|
|
198
|
-
{ code: "hi", countryCode: "in", name: "\u0939\u093F\u0928\u094D\u0926\u0940", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/in.svg" },
|
|
199
|
-
{ code: "id", countryCode: "id", name: "Indonesia", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/id.svg" },
|
|
200
|
-
{ code: "nl", countryCode: "nl", name: "Nederlands", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/nl.svg" },
|
|
201
|
-
{ code: "pl", countryCode: "pl", name: "Polski", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/pl.svg" },
|
|
202
|
-
{ code: "sv", countryCode: "se", name: "Svenska", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/se.svg" },
|
|
203
|
-
{ code: "uk", countryCode: "ua", name: "\u0423\u043A\u0440\u0430\u0457\u043D\u0441\u044C\u043A\u0430", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ua.svg" },
|
|
204
|
-
{ code: "vi", countryCode: "vn", name: "Ti\u1EBFng Vi\u1EC7t", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/vn.svg" },
|
|
205
|
-
{ code: "fa", countryCode: "ir", name: "\u0641\u0627\u0631\u0633\u06CC", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ir.svg" },
|
|
206
|
-
{ code: "he", countryCode: "il", name: "\u05E2\u05D1\u05E8\u05D9\u05EA", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/il.svg" }
|
|
207
|
-
];
|
|
208
100
|
function openExternalLink(url, tryInstantView = false) {
|
|
209
101
|
const wa = getWebApp();
|
|
210
102
|
if (wa == null ? void 0 : wa.openLink) {
|
|
@@ -898,23 +790,13 @@ var defaultCtx = {
|
|
|
898
790
|
bypass: false,
|
|
899
791
|
webApp: null,
|
|
900
792
|
user: null,
|
|
901
|
-
language: "en-US",
|
|
902
|
-
uiLang: "en",
|
|
903
793
|
colorScheme: "dark",
|
|
904
|
-
startParam: null
|
|
905
|
-
isRtl: false,
|
|
906
|
-
changeLanguage: () => {
|
|
907
|
-
}
|
|
794
|
+
startParam: null
|
|
908
795
|
};
|
|
909
796
|
var TelegramContext = (0, import_react2.createContext)(defaultCtx);
|
|
910
797
|
function useTelegram() {
|
|
911
798
|
return (0, import_react2.useContext)(TelegramContext);
|
|
912
799
|
}
|
|
913
|
-
function applyLangToDOM(lang) {
|
|
914
|
-
const rtl = isRtlLang(lang);
|
|
915
|
-
document.documentElement.setAttribute("dir", rtl ? "rtl" : "ltr");
|
|
916
|
-
document.documentElement.setAttribute("lang", lang);
|
|
917
|
-
}
|
|
918
800
|
function applyColorSchemeToDOM(scheme) {
|
|
919
801
|
if (scheme === "dark") {
|
|
920
802
|
document.documentElement.classList.add("dark");
|
|
@@ -927,39 +809,14 @@ function TelegramProvider({
|
|
|
927
809
|
options = {}
|
|
928
810
|
}) {
|
|
929
811
|
const {
|
|
930
|
-
langStorageKey = "tg-kit-ui-lang",
|
|
931
812
|
onUserReady,
|
|
932
813
|
onReady,
|
|
933
|
-
onLanguageChange,
|
|
934
814
|
loadingComponent = null,
|
|
935
815
|
notInTelegramComponent = null,
|
|
936
816
|
allowOutsideTelegram = false
|
|
937
817
|
} = options;
|
|
938
818
|
const [isInitialized, setIsInitialized] = (0, import_react2.useState)(false);
|
|
939
819
|
const [ctx, setCtx] = (0, import_react2.useState)(defaultCtx);
|
|
940
|
-
const getSavedLang = (0, import_react2.useCallback)(() => {
|
|
941
|
-
try {
|
|
942
|
-
return localStorage.getItem(langStorageKey);
|
|
943
|
-
} catch (e) {
|
|
944
|
-
return null;
|
|
945
|
-
}
|
|
946
|
-
}, [langStorageKey]);
|
|
947
|
-
const saveLang = (0, import_react2.useCallback)((lang) => {
|
|
948
|
-
try {
|
|
949
|
-
localStorage.setItem(langStorageKey, lang);
|
|
950
|
-
} catch (e) {
|
|
951
|
-
}
|
|
952
|
-
}, [langStorageKey]);
|
|
953
|
-
const changeLanguage = (0, import_react2.useCallback)((lang) => {
|
|
954
|
-
saveLang(lang);
|
|
955
|
-
applyLangToDOM(lang);
|
|
956
|
-
onLanguageChange == null ? void 0 : onLanguageChange(lang);
|
|
957
|
-
setCtx((prev) => __spreadProps(__spreadValues({}, prev), {
|
|
958
|
-
uiLang: lang,
|
|
959
|
-
language: tgLangToTmdb(lang),
|
|
960
|
-
isRtl: isRtlLang(lang)
|
|
961
|
-
}));
|
|
962
|
-
}, [saveLang, onLanguageChange]);
|
|
963
820
|
(0, import_react2.useLayoutEffect)(() => {
|
|
964
821
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
965
822
|
const wa = getWebApp();
|
|
@@ -988,34 +845,22 @@ function TelegramProvider({
|
|
|
988
845
|
if (user) onUserReady == null ? void 0 : onUserReady(user);
|
|
989
846
|
onReady == null ? void 0 : onReady(wa);
|
|
990
847
|
}
|
|
991
|
-
const tgLangCode = user == null ? void 0 : user.language_code;
|
|
992
|
-
const tgUiLang = tgLangToUi(tgLangCode);
|
|
993
|
-
const savedLang = getSavedLang();
|
|
994
|
-
const finalUiLang = savedLang != null ? savedLang : tgUiLang;
|
|
995
|
-
const finalLanguage = tgLangToTmdb(finalUiLang);
|
|
996
|
-
if (!savedLang) saveLang(finalUiLang);
|
|
997
|
-
applyLangToDOM(finalUiLang);
|
|
998
848
|
applyColorSchemeToDOM(colorScheme);
|
|
999
|
-
onLanguageChange == null ? void 0 : onLanguageChange(finalUiLang);
|
|
1000
849
|
setCtx({
|
|
1001
850
|
ready: true,
|
|
1002
851
|
inTelegram: inTg,
|
|
1003
852
|
bypass,
|
|
1004
853
|
webApp: wa,
|
|
1005
854
|
user,
|
|
1006
|
-
language: finalLanguage,
|
|
1007
|
-
uiLang: finalUiLang,
|
|
1008
855
|
colorScheme,
|
|
1009
|
-
startParam
|
|
1010
|
-
isRtl: isRtlLang(finalUiLang),
|
|
1011
|
-
changeLanguage
|
|
856
|
+
startParam
|
|
1012
857
|
});
|
|
1013
858
|
setIsInitialized(true);
|
|
1014
859
|
try {
|
|
1015
860
|
wa == null ? void 0 : wa.ready();
|
|
1016
861
|
} catch (e) {
|
|
1017
862
|
}
|
|
1018
|
-
}, [
|
|
863
|
+
}, [onUserReady, onReady]);
|
|
1019
864
|
if (!isInitialized) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: loadingComponent });
|
|
1020
865
|
if (ctx.ready && !ctx.inTelegram && !ctx.bypass && !allowOutsideTelegram) {
|
|
1021
866
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: notInTelegramComponent });
|
|
@@ -1182,8 +1027,6 @@ function FullscreenProvider({
|
|
|
1182
1027
|
// Annotate the CommonJS export names for ESM import in node:
|
|
1183
1028
|
0 && (module.exports = {
|
|
1184
1029
|
FullscreenProvider,
|
|
1185
|
-
RTL_LANGS,
|
|
1186
|
-
SUPPORTED_LANGS,
|
|
1187
1030
|
TelegramProvider,
|
|
1188
1031
|
biometric,
|
|
1189
1032
|
cloudStorage,
|
|
@@ -1196,7 +1039,6 @@ function FullscreenProvider({
|
|
|
1196
1039
|
getWebApp,
|
|
1197
1040
|
haptic,
|
|
1198
1041
|
isInTelegram,
|
|
1199
|
-
isRtlLang,
|
|
1200
1042
|
isVersionAtLeast,
|
|
1201
1043
|
location,
|
|
1202
1044
|
openExternalLink,
|
|
@@ -1204,8 +1046,6 @@ function FullscreenProvider({
|
|
|
1204
1046
|
openTelegramLink,
|
|
1205
1047
|
readClipboard,
|
|
1206
1048
|
scanQr,
|
|
1207
|
-
tgLangToTmdb,
|
|
1208
|
-
tgLangToUi,
|
|
1209
1049
|
useAccelerometer,
|
|
1210
1050
|
useBiometric,
|
|
1211
1051
|
useCloudStorage,
|
package/dist/index.mjs
CHANGED
|
@@ -32,109 +32,6 @@ function isVersionAtLeast(version) {
|
|
|
32
32
|
var _a, _b;
|
|
33
33
|
return (_b = (_a = getWebApp()) == null ? void 0 : _a.isVersionAtLeast(version)) != null ? _b : false;
|
|
34
34
|
}
|
|
35
|
-
function tgLangToTmdb(code) {
|
|
36
|
-
var _a;
|
|
37
|
-
if (!code) return "en-US";
|
|
38
|
-
const base = code.toLowerCase().split("-")[0];
|
|
39
|
-
const map = {
|
|
40
|
-
en: "en-US",
|
|
41
|
-
ar: "ar-SA",
|
|
42
|
-
es: "es-ES",
|
|
43
|
-
fr: "fr-FR",
|
|
44
|
-
de: "de-DE",
|
|
45
|
-
it: "it-IT",
|
|
46
|
-
pt: "pt-BR",
|
|
47
|
-
ru: "ru-RU",
|
|
48
|
-
zh: "zh-CN",
|
|
49
|
-
ja: "ja-JP",
|
|
50
|
-
ko: "ko-KR",
|
|
51
|
-
tr: "tr-TR",
|
|
52
|
-
hi: "hi-IN",
|
|
53
|
-
id: "id-ID",
|
|
54
|
-
nl: "nl-NL",
|
|
55
|
-
pl: "pl-PL",
|
|
56
|
-
sv: "sv-SE",
|
|
57
|
-
uk: "uk-UA",
|
|
58
|
-
vi: "vi-VN",
|
|
59
|
-
fa: "fa-IR",
|
|
60
|
-
he: "he-IL",
|
|
61
|
-
cs: "cs-CZ",
|
|
62
|
-
da: "da-DK",
|
|
63
|
-
fi: "fi-FI",
|
|
64
|
-
hu: "hu-HU",
|
|
65
|
-
nb: "nb-NO",
|
|
66
|
-
ro: "ro-RO",
|
|
67
|
-
sk: "sk-SK",
|
|
68
|
-
th: "th-TH",
|
|
69
|
-
ms: "ms-MY"
|
|
70
|
-
};
|
|
71
|
-
return (_a = map[base]) != null ? _a : "en-US";
|
|
72
|
-
}
|
|
73
|
-
function tgLangToUi(code) {
|
|
74
|
-
if (!code) return "en";
|
|
75
|
-
const base = code.toLowerCase().split("-")[0];
|
|
76
|
-
const supported = [
|
|
77
|
-
"en",
|
|
78
|
-
"ar",
|
|
79
|
-
"es",
|
|
80
|
-
"fr",
|
|
81
|
-
"de",
|
|
82
|
-
"it",
|
|
83
|
-
"pt",
|
|
84
|
-
"ru",
|
|
85
|
-
"zh",
|
|
86
|
-
"ja",
|
|
87
|
-
"ko",
|
|
88
|
-
"tr",
|
|
89
|
-
"hi",
|
|
90
|
-
"id",
|
|
91
|
-
"nl",
|
|
92
|
-
"pl",
|
|
93
|
-
"sv",
|
|
94
|
-
"uk",
|
|
95
|
-
"vi",
|
|
96
|
-
"fa",
|
|
97
|
-
"he",
|
|
98
|
-
"cs",
|
|
99
|
-
"da",
|
|
100
|
-
"fi",
|
|
101
|
-
"hu",
|
|
102
|
-
"nb",
|
|
103
|
-
"ro",
|
|
104
|
-
"sk",
|
|
105
|
-
"th",
|
|
106
|
-
"ms"
|
|
107
|
-
];
|
|
108
|
-
return supported.includes(base) ? base : "en";
|
|
109
|
-
}
|
|
110
|
-
var RTL_LANGS = /* @__PURE__ */ new Set(["ar", "fa", "he", "ur", "yi", "ug", "ku"]);
|
|
111
|
-
function isRtlLang(lang) {
|
|
112
|
-
if (!lang) return false;
|
|
113
|
-
return RTL_LANGS.has(lang.toLowerCase().split("-")[0]);
|
|
114
|
-
}
|
|
115
|
-
var SUPPORTED_LANGS = [
|
|
116
|
-
{ code: "en", countryCode: "us", name: "English", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/us.svg" },
|
|
117
|
-
{ code: "ar", countryCode: "sa", name: "\u0627\u0644\u0639\u0631\u0628\u064A\u0629", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/sa.svg" },
|
|
118
|
-
{ code: "es", countryCode: "es", name: "Espa\xF1ol", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/es.svg" },
|
|
119
|
-
{ code: "fr", countryCode: "fr", name: "Fran\xE7ais", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/fr.svg" },
|
|
120
|
-
{ code: "de", countryCode: "de", name: "Deutsch", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/de.svg" },
|
|
121
|
-
{ code: "it", countryCode: "it", name: "Italiano", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/it.svg" },
|
|
122
|
-
{ code: "pt", countryCode: "pt", name: "Portugu\xEAs", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/pt.svg" },
|
|
123
|
-
{ code: "ru", countryCode: "ru", name: "\u0420\u0443\u0441\u0441\u043A\u0438\u0439", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ru.svg" },
|
|
124
|
-
{ code: "zh", countryCode: "cn", name: "\u4E2D\u6587", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/cn.svg" },
|
|
125
|
-
{ code: "ja", countryCode: "jp", name: "\u65E5\u672C\u8A9E", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/jp.svg" },
|
|
126
|
-
{ code: "ko", countryCode: "kr", name: "\uD55C\uAD6D\uC5B4", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/kr.svg" },
|
|
127
|
-
{ code: "tr", countryCode: "tr", name: "T\xFCrk\xE7e", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/tr.svg" },
|
|
128
|
-
{ code: "hi", countryCode: "in", name: "\u0939\u093F\u0928\u094D\u0926\u0940", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/in.svg" },
|
|
129
|
-
{ code: "id", countryCode: "id", name: "Indonesia", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/id.svg" },
|
|
130
|
-
{ code: "nl", countryCode: "nl", name: "Nederlands", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/nl.svg" },
|
|
131
|
-
{ code: "pl", countryCode: "pl", name: "Polski", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/pl.svg" },
|
|
132
|
-
{ code: "sv", countryCode: "se", name: "Svenska", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/se.svg" },
|
|
133
|
-
{ code: "uk", countryCode: "ua", name: "\u0423\u043A\u0440\u0430\u0457\u043D\u0441\u044C\u043A\u0430", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ua.svg" },
|
|
134
|
-
{ code: "vi", countryCode: "vn", name: "Ti\u1EBFng Vi\u1EC7t", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/vn.svg" },
|
|
135
|
-
{ code: "fa", countryCode: "ir", name: "\u0641\u0627\u0631\u0633\u06CC", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/ir.svg" },
|
|
136
|
-
{ code: "he", countryCode: "il", name: "\u05E2\u05D1\u05E8\u05D9\u05EA", flag: "https://raw.githubusercontent.com/mr-m-apps/icons/refs/heads/main/flags/il.svg" }
|
|
137
|
-
];
|
|
138
35
|
function openExternalLink(url, tryInstantView = false) {
|
|
139
36
|
const wa = getWebApp();
|
|
140
37
|
if (wa == null ? void 0 : wa.openLink) {
|
|
@@ -824,8 +721,7 @@ import {
|
|
|
824
721
|
createContext,
|
|
825
722
|
useContext,
|
|
826
723
|
useState as useState2,
|
|
827
|
-
useLayoutEffect
|
|
828
|
-
useCallback as useCallback2
|
|
724
|
+
useLayoutEffect
|
|
829
725
|
} from "react";
|
|
830
726
|
import { Fragment, jsx } from "react/jsx-runtime";
|
|
831
727
|
var defaultCtx = {
|
|
@@ -834,23 +730,13 @@ var defaultCtx = {
|
|
|
834
730
|
bypass: false,
|
|
835
731
|
webApp: null,
|
|
836
732
|
user: null,
|
|
837
|
-
language: "en-US",
|
|
838
|
-
uiLang: "en",
|
|
839
733
|
colorScheme: "dark",
|
|
840
|
-
startParam: null
|
|
841
|
-
isRtl: false,
|
|
842
|
-
changeLanguage: () => {
|
|
843
|
-
}
|
|
734
|
+
startParam: null
|
|
844
735
|
};
|
|
845
736
|
var TelegramContext = createContext(defaultCtx);
|
|
846
737
|
function useTelegram() {
|
|
847
738
|
return useContext(TelegramContext);
|
|
848
739
|
}
|
|
849
|
-
function applyLangToDOM(lang) {
|
|
850
|
-
const rtl = isRtlLang(lang);
|
|
851
|
-
document.documentElement.setAttribute("dir", rtl ? "rtl" : "ltr");
|
|
852
|
-
document.documentElement.setAttribute("lang", lang);
|
|
853
|
-
}
|
|
854
740
|
function applyColorSchemeToDOM(scheme) {
|
|
855
741
|
if (scheme === "dark") {
|
|
856
742
|
document.documentElement.classList.add("dark");
|
|
@@ -863,39 +749,14 @@ function TelegramProvider({
|
|
|
863
749
|
options = {}
|
|
864
750
|
}) {
|
|
865
751
|
const {
|
|
866
|
-
langStorageKey = "tg-kit-ui-lang",
|
|
867
752
|
onUserReady,
|
|
868
753
|
onReady,
|
|
869
|
-
onLanguageChange,
|
|
870
754
|
loadingComponent = null,
|
|
871
755
|
notInTelegramComponent = null,
|
|
872
756
|
allowOutsideTelegram = false
|
|
873
757
|
} = options;
|
|
874
758
|
const [isInitialized, setIsInitialized] = useState2(false);
|
|
875
759
|
const [ctx, setCtx] = useState2(defaultCtx);
|
|
876
|
-
const getSavedLang = useCallback2(() => {
|
|
877
|
-
try {
|
|
878
|
-
return localStorage.getItem(langStorageKey);
|
|
879
|
-
} catch (e) {
|
|
880
|
-
return null;
|
|
881
|
-
}
|
|
882
|
-
}, [langStorageKey]);
|
|
883
|
-
const saveLang = useCallback2((lang) => {
|
|
884
|
-
try {
|
|
885
|
-
localStorage.setItem(langStorageKey, lang);
|
|
886
|
-
} catch (e) {
|
|
887
|
-
}
|
|
888
|
-
}, [langStorageKey]);
|
|
889
|
-
const changeLanguage = useCallback2((lang) => {
|
|
890
|
-
saveLang(lang);
|
|
891
|
-
applyLangToDOM(lang);
|
|
892
|
-
onLanguageChange == null ? void 0 : onLanguageChange(lang);
|
|
893
|
-
setCtx((prev) => __spreadProps(__spreadValues({}, prev), {
|
|
894
|
-
uiLang: lang,
|
|
895
|
-
language: tgLangToTmdb(lang),
|
|
896
|
-
isRtl: isRtlLang(lang)
|
|
897
|
-
}));
|
|
898
|
-
}, [saveLang, onLanguageChange]);
|
|
899
760
|
useLayoutEffect(() => {
|
|
900
761
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
901
762
|
const wa = getWebApp();
|
|
@@ -924,34 +785,22 @@ function TelegramProvider({
|
|
|
924
785
|
if (user) onUserReady == null ? void 0 : onUserReady(user);
|
|
925
786
|
onReady == null ? void 0 : onReady(wa);
|
|
926
787
|
}
|
|
927
|
-
const tgLangCode = user == null ? void 0 : user.language_code;
|
|
928
|
-
const tgUiLang = tgLangToUi(tgLangCode);
|
|
929
|
-
const savedLang = getSavedLang();
|
|
930
|
-
const finalUiLang = savedLang != null ? savedLang : tgUiLang;
|
|
931
|
-
const finalLanguage = tgLangToTmdb(finalUiLang);
|
|
932
|
-
if (!savedLang) saveLang(finalUiLang);
|
|
933
|
-
applyLangToDOM(finalUiLang);
|
|
934
788
|
applyColorSchemeToDOM(colorScheme);
|
|
935
|
-
onLanguageChange == null ? void 0 : onLanguageChange(finalUiLang);
|
|
936
789
|
setCtx({
|
|
937
790
|
ready: true,
|
|
938
791
|
inTelegram: inTg,
|
|
939
792
|
bypass,
|
|
940
793
|
webApp: wa,
|
|
941
794
|
user,
|
|
942
|
-
language: finalLanguage,
|
|
943
|
-
uiLang: finalUiLang,
|
|
944
795
|
colorScheme,
|
|
945
|
-
startParam
|
|
946
|
-
isRtl: isRtlLang(finalUiLang),
|
|
947
|
-
changeLanguage
|
|
796
|
+
startParam
|
|
948
797
|
});
|
|
949
798
|
setIsInitialized(true);
|
|
950
799
|
try {
|
|
951
800
|
wa == null ? void 0 : wa.ready();
|
|
952
801
|
} catch (e) {
|
|
953
802
|
}
|
|
954
|
-
}, [
|
|
803
|
+
}, [onUserReady, onReady]);
|
|
955
804
|
if (!isInitialized) return /* @__PURE__ */ jsx(Fragment, { children: loadingComponent });
|
|
956
805
|
if (ctx.ready && !ctx.inTelegram && !ctx.bypass && !allowOutsideTelegram) {
|
|
957
806
|
return /* @__PURE__ */ jsx(Fragment, { children: notInTelegramComponent });
|
|
@@ -1124,8 +973,6 @@ function FullscreenProvider({
|
|
|
1124
973
|
}
|
|
1125
974
|
export {
|
|
1126
975
|
FullscreenProvider,
|
|
1127
|
-
RTL_LANGS,
|
|
1128
|
-
SUPPORTED_LANGS,
|
|
1129
976
|
TelegramProvider,
|
|
1130
977
|
biometric,
|
|
1131
978
|
cloudStorage,
|
|
@@ -1138,7 +985,6 @@ export {
|
|
|
1138
985
|
getWebApp,
|
|
1139
986
|
haptic,
|
|
1140
987
|
isInTelegram,
|
|
1141
|
-
isRtlLang,
|
|
1142
988
|
isVersionAtLeast,
|
|
1143
989
|
location,
|
|
1144
990
|
openExternalLink,
|
|
@@ -1146,8 +992,6 @@ export {
|
|
|
1146
992
|
openTelegramLink,
|
|
1147
993
|
readClipboard,
|
|
1148
994
|
scanQr,
|
|
1149
|
-
tgLangToTmdb,
|
|
1150
|
-
tgLangToUi,
|
|
1151
995
|
useAccelerometer,
|
|
1152
996
|
useBiometric,
|
|
1153
997
|
useCloudStorage,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mr-m/telegram-webapp-kit",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"description": "Full-featured Telegram Web App SDK for React / Next.js — types, hooks, providers, and utilities",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.mjs",
|
|
@@ -29,7 +29,15 @@
|
|
|
29
29
|
"nextjs",
|
|
30
30
|
"hooks"
|
|
31
31
|
],
|
|
32
|
-
"author": "",
|
|
32
|
+
"author": "mr-m-apps",
|
|
33
|
+
"repository": {
|
|
34
|
+
"type": "git",
|
|
35
|
+
"url": "git+https://github.com/mr-m-apps/telegram-webapp-kit.git"
|
|
36
|
+
},
|
|
37
|
+
"bugs": {
|
|
38
|
+
"url": "https://github.com/mr-m-apps/telegram-webapp-kit/issues"
|
|
39
|
+
},
|
|
40
|
+
"homepage": "https://github.com/mr-m-apps/telegram-webapp-kit#readme",
|
|
33
41
|
"license": "MIT",
|
|
34
42
|
"peerDependencies": {
|
|
35
43
|
"react": ">=18.0.0",
|
|
@@ -37,6 +45,7 @@
|
|
|
37
45
|
},
|
|
38
46
|
"devDependencies": {
|
|
39
47
|
"@types/react": "^18.0.0",
|
|
48
|
+
"@types/node": "^20.0.0",
|
|
40
49
|
"tsup": "^8.0.0",
|
|
41
50
|
"typescript": "^5.0.0"
|
|
42
51
|
},
|