@ton/appkit-react 0.0.1-alpha.2 → 0.0.2

package/dist/esm/providers/i18n-provider.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useState, useRef, useEffect } from 'react';
+import { i18n, defaultLanguage } from '../libs/i18n';
+export const I18nContext = createContext(null);
+export const I18nProvider = ({ children, locale, lngDicts }) => {
+    const activeLocaleRef = useRef(locale || defaultLanguage);
+    const [, setTick] = useState(0);
+    const firstRender = useRef(true);
+    const i18nWrapper = {
+        activeLocale: activeLocaleRef.current,
+        t: (...args) => i18n.t(...args),
+        locale: (l, dict) => {
+            i18n.locale(l);
+            activeLocaleRef.current = l;
+            if (dict) {
+                i18n.set(l, dict);
+            }
+            // force rerender to update view
+            setTick((tick) => tick + 1);
+        },
+        addDict: (l, dict) => {
+            i18n.set(l, dict);
+            // force rerender to update view
+            setTick((tick) => tick + 1);
+        },
+    };
+    // for initial SSR render
+    if (locale && firstRender.current === true) {
+        firstRender.current = false;
+        const dict = lngDicts?.[locale];
+        i18nWrapper.locale(locale, dict);
+        const restDicts = Object.entries(lngDicts || {}).filter(([l]) => l !== locale);
+        restDicts.forEach(([l, dict]) => {
+            i18nWrapper.addDict(l, dict);
+        });
+    }
+    useEffect(() => {
+        if (lngDicts) {
+            Object.entries(lngDicts).forEach(([l, dict]) => {
+                i18nWrapper.addDict(l, dict);
+            });
+        }
+    }, [lngDicts]);
+    useEffect(() => {
+        if (locale) {
+            i18nWrapper.locale(locale);
+        }
+    }, [locale]);
+    return _jsx(I18nContext.Provider, { value: i18nWrapper, children: children });
+};
+//# sourceMappingURL=i18n-provider.js.map

package/dist/esm/providers/i18n-provider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"i18n-provider.js","sourceRoot":"","sources":["../../../src/providers/i18n-provider.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGnE,OAAO,EAAE,IAAI,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AASrD,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAyB,IAAI,CAAC,CAAC;AAOvE,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAqB,EAAE,EAAE;IAC9E,MAAM,eAAe,GAAG,MAAM,CAAC,MAAM,IAAI,eAAe,CAAC,CAAC;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAChC,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAEjC,MAAM,WAAW,GAAoB;QACjC,YAAY,EAAE,eAAe,CAAC,OAAO;QACrC,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;QAC/B,MAAM,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE;YAChB,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;YACf,eAAe,CAAC,OAAO,GAAG,CAAC,CAAC;YAE5B,IAAI,IAAI,EAAE,CAAC;gBACP,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;YACtB,CAAC;YAED,gCAAgC;YAChC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC;QAChC,CAAC;QACD,OAAO,EAAE,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE;YACjB,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;YAElB,gCAAgC;YAChC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC;QAChC,CAAC;KACJ,CAAC;IAEF,yBAAyB;IACzB,IAAI,MAAM,IAAI,WAAW,CAAC,OAAO,KAAK,IAAI,EAAE,CAAC;QACzC,WAAW,CAAC,OAAO,GAAG,KAAK,CAAC;QAC5B,MAAM,IAAI,GAAG,QAAQ,EAAE,CAAC,MAAM,CAAC,CAAC;QAChC,WAAW,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QAEjC,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,CAAC,QAAQ,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,MAAM,CAAC,CAAC;QAC/E,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE;YAC5B,WAAW,CAAC,OAAO,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;QACjC,CAAC,CAAC,CAAC;IACP,CAAC;IAED,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,QAAQ,EAAE,CAAC;YACX,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE;gBAC3C,WAAW,CAAC,OAAO,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;YACjC,CAAC,CAAC,CAAC;QACP,CAAC;IACL,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,MAAM,EAAE,CAAC;YACT,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QAC/B,CAAC;IACL,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,KAAC,WAAW,CAAC,QAAQ,IAAC,KAAK,EAAE,WAAW,YAAG,QAAQ,GAAwB,CAAC;AACvF,CAAC,CAAC"}

package/dist/esm/styles/index.css

@@ -0,0 +1,88 @@
+:root {
+  /* Font */
+  --ta-font-family: -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', Arial, Tahoma, Verdana, sans-serif;
+  
+  /* Typography */
+  /* Headings */
+  --ta-heading1-font-size: 32px;
+  --ta-heading1-font-weight: 700;
+  --ta-heading1-line-height: normal;
+
+  --ta-heading2-font-size: 28px;
+  --ta-heading2-font-weight: 700;
+  --ta-heading2-line-height: normal;
+
+  --ta-heading3-font-size: 24px;
+  --ta-heading3-font-weight: 700;
+  --ta-heading3-line-height: normal;
+
+  --ta-heading4-font-size: 20px;
+  --ta-heading4-font-weight: 700;
+  --ta-heading4-line-height: normal;
+
+  --ta-heading5-font-size: 18px;
+  --ta-heading5-font-weight: 700;
+  --ta-heading5-line-height: normal;
+
+  /* Body */
+  --ta-body-large-font-size: 16px;
+  --ta-body-large-line-height: 24px;
+  --ta-body-large-font-weight: 400;
+  --ta-body-large-medium-font-weight: 500;
+  
+  --ta-body-font-size: 14px;
+  --ta-body-line-height: 20px;
+  --ta-body-font-weight: 400;
+  --ta-body-medium-font-weight: 500;
+  --ta-body-bold-font-weight: 700;
+
+  --ta-body-small-font-size: 12px;
+  --ta-body-small-line-height: 16px;
+  --ta-body-small-font-weight: 400;
+
+  /* Caption */
+  --ta-caption1-font-size: 12px;
+  --ta-caption1-line-height: 16px;
+  --ta-caption1-font-weight: 400;
+
+  --ta-caption2-font-size: 10px;
+  --ta-caption2-line-height: 12px;
+  --ta-caption2-font-weight: 400;
+
+  /* Colors */
+  --ta-color-primary: #0098EB;
+  --ta-color-primary-foreground: #ffffff;
+  --ta-color-text: #000000;
+  --ta-color-text-secondary: #8e8e93;
+  --ta-color-background: #ffffff;
+  --ta-color-background-secondary: #f2f2f7;
+  --ta-color-block: #ffffff;
+  --ta-color-block-foreground: #000000;
+
+  /* Static Colors */
+  --ta-color-white: #ffffff;
+  --ta-color-black: #000000;
+  --ta-color-ton: #0098EB;
+
+  /* Border Radius */
+  --ta-border-radius-s: 4px;
+  --ta-border-radius-m: 8px;
+  --ta-border-radius-l: 12px;
+  --ta-border-radius-xl: 16px;
+  --ta-border-radius-full: 9999px;
+
+  /* Border Width */
+  --ta-border-width-s: 1px;
+  --ta-border-width-m: 2px;
+}
+
+[data-ta-theme='dark'] {
+  --ta-color-primary: #0098EB;
+  --ta-color-primary-foreground: #ffffff;
+  --ta-color-text: #ffffff;
+  --ta-color-text-secondary: #8e8e93;
+  --ta-color-background: #000000;
+  --ta-color-background-secondary: #1c1c1e;
+  --ta-color-block: #121214;
+  --ta-color-block-foreground: #ffffff;
+}

package/dist/esm/styles/typography.module.css

@@ -0,0 +1,92 @@
+.heading1 {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-heading1-font-size);
+  font-weight: var(--ta-heading1-font-weight);
+  line-height: var(--ta-heading1-line-height);
+}
+
+.heading2 {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-heading2-font-size);
+  font-weight: var(--ta-heading2-font-weight);
+  line-height: var(--ta-heading2-line-height);
+}
+
+.heading3 {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-heading3-font-size);
+  font-weight: var(--ta-heading3-font-weight);
+  line-height: var(--ta-heading3-line-height);
+}
+
+.heading4 {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-heading4-font-size);
+  font-weight: var(--ta-heading4-font-weight);
+  line-height: var(--ta-heading4-line-height);
+}
+
+.heading5 {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-heading5-font-size);
+  font-weight: var(--ta-heading5-font-weight);
+  line-height: var(--ta-heading5-line-height);
+}
+
+/* Body */
+.bodyLarge {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-body-large-font-size);
+  line-height: var(--ta-body-large-line-height);
+  font-weight: var(--ta-body-large-font-weight);
+}
+
+.bodyLargeMedium {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-body-large-font-size);
+  line-height: var(--ta-body-large-line-height);
+  font-weight: var(--ta-body-large-medium-font-weight);
+}
+
+.body {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-body-font-size);
+  line-height: var(--ta-body-line-height);
+  font-weight: var(--ta-body-font-weight);
+}
+
+.bodyMedium {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-body-font-size);
+  line-height: var(--ta-body-line-height);
+  font-weight: var(--ta-body-medium-font-weight);
+}
+
+.bodyBold {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-body-font-size);
+  line-height: var(--ta-body-line-height);
+  font-weight: var(--ta-body-bold-font-weight);
+}
+
+.bodySmall {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-body-small-font-size);
+  line-height: var(--ta-body-small-line-height);
+  font-weight: var(--ta-body-small-font-weight);
+}
+
+/* Caption */
+.caption1 {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-caption1-font-size);
+  line-height: var(--ta-caption1-line-height);
+  font-weight: var(--ta-caption1-font-weight);
+}
+
+.caption2 {
+  font-family: var(--ta-font-family);
+  font-size: var(--ta-caption2-font-size);
+  line-height: var(--ta-caption2-line-height);
+  font-weight: var(--ta-caption2-font-weight);
+}

package/dist/esm/tonconnect/tonconnect-bridge.js

@@ -0,0 +1,27 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Copyright (c) TonTech.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { useMemo } from 'react';
+import { TonConnectUIProvider } from '@tonconnect/ui-react';
+import { TONCONNECT_DEFAULT_CONNECTOR_ID } from '@ton/appkit';
+import { useConnectorById } from '../features/wallets/hooks/use-connector-by-id';
+/**
+ * Automatically creates TonConnectUIProvider if TonConnectConnector is found
+ * @param children - The children to render
+ * @param connectorId - The connector ID to use
+ * @returns The TonConnectUIProvider or the children
+ */
+export const TonConnectBridge = ({ children, connectorId = TONCONNECT_DEFAULT_CONNECTOR_ID, }) => {
+    const connector = useConnectorById(connectorId);
+    const tonConnectUI = useMemo(() => connector?.tonConnectUI, [connector]);
+    if (!tonConnectUI) {
+        return _jsx(_Fragment, { children: children });
+    }
+    return _jsx(TonConnectUIProvider, { instance: tonConnectUI, children: children });
+};
+//# sourceMappingURL=tonconnect-bridge.js.map

package/dist/esm/tonconnect/tonconnect-bridge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tonconnect-bridge.js","sourceRoot":"","sources":["../../../src/tonconnect/tonconnect-bridge.tsx"],"names":[],"mappings":";AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE5D,OAAO,EAAE,+BAA+B,EAAE,MAAM,aAAa,CAAC;AAE9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,+CAA+C,CAAC;AAMjF;;;;;GAKG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAA8B,CAAC,EACxD,QAAQ,EACR,WAAW,GAAG,+BAA+B,GAChD,EAAE,EAAE;IACD,MAAM,SAAS,GAAG,gBAAgB,CAAC,WAAW,CAAoC,CAAC;IACnF,MAAM,YAAY,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,SAAS,EAAE,YAAY,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEzE,IAAI,CAAC,YAAY,EAAE,CAAC;QAChB,OAAO,4BAAG,QAAQ,GAAI,CAAC;IAC3B,CAAC;IAED,OAAO,KAAC,oBAAoB,IAAC,QAAQ,EAAE,YAAY,YAAG,QAAQ,GAAwB,CAAC;AAC3F,CAAC,CAAC"}