@mr-m/telegram-webapp-kit 1.0.1 → 2.0.1
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/LICENSE +21 -0
- package/README.md +706 -137
- 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.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.1",
|
|
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
|
},
|