@tma.js/sdk-solid 1.0.3 → 1.1.0

package/dist/dts/DisplayGate.d.ts

@@ -0,0 +1,24 @@
+import { type Component, type ParentProps, type JSX } from 'solid-js';
+export interface DisplayGateProps extends ParentProps {
+    /**
+     * Element or component, which will be displayed in case, SDK is not loading, didn't receive
+     * any error during initialization as well as the initialization result.
+     */
+    initial?: JSX.Element | Component;
+    /**
+     * Element or component which will be displayed in case, SDK initialization failed.
+     */
+    error?: JSX.Element | Component<{
+        error: unknown;
+    }>;
+    /**
+     * Element or component which will be displayed in case, SDK is currently loading.
+     */
+    loading?: JSX.Element | Component;
+}
+/**
+ * This component is the layer controlling the application display. It displays application in
+ * case, the SDK is initialized, displays an error if something went wrong, and a loader
+ * if the SDK is warming up.
+ */
+export declare function DisplayGate(props: DisplayGateProps): any;

package/dist/dts/index.d.ts

@@ -1,3 +1,4 @@
-export { useThemeParams, useInitData, useBackButton, useClosingBehavior, useInitDataRaw, useCloudStorage, useLaunchParams, useMainButton, useHapticFeedback, useInvoice, useMiniApp, usePopup, usePostEvent, useQRScanner, useUtils, useViewport, } from './tools/index.js';
+export { useThemeParams, useInitData, useBackButton, useClosingBehavior, useInitDataRaw, useCloudStorage, useLaunchParams, useMainButton, useHapticFeedback, useInvoice, useMiniApp, usePopup, usePostEvent, useQRScanner, useSettingsButton, useUtils, useViewport, } from './tools/index.js';
 export { useSDKContext, SDKProvider, type SDKProviderProps, type SDKContextType, } from './provider/index.js';
+export { DisplayGate, type DisplayGateProps } from './DisplayGate.js';
 export type { InitOptions, InitResult, } from './types.js';

package/dist/dts/tools/index.d.ts

@@ -11,6 +11,7 @@ export * from './mini-app.js';
 export * from './popup.js';
 export * from './post-event.js';
 export * from './qr-scanner.js';
+export * from './settings-button.js';
 export * from './theme-params.js';
 export * from './viewport.js';
 export * from './utils.js';

package/dist/dts/tools/settings-button.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Hook to retrieve SettingsButton component.
+ */
+export declare const useSettingsButton: import("../createHook.js").Hook<"settingsButton">;

package/dist/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("solid-js"),a=require("@tma.js/sdk"),i=n.createContext({loading:()=>!1,error:()=>{},initResult:()=>{}},{name:"SDKContext"});function d(o){const[t]=n.createResource(()=>o.options,a.init),s=n.createMemo(()=>t.state==="ready"?t():void 0),u=n.createMemo(()=>t.loading),r=n.createMemo(()=>t.error===void 0?null:t.error);return n.createComponent(i.Provider,{value:{initResult:s,loading:u,error:r},get children(){return o.children}})}function c(){return n.useContext(i)}function l(o){const{initResult:t}=c();return n.createMemo(()=>{const s=t();if(!s)throw new Error(`Unable to get init result key "${o}" as long as SDK is not initialized`);return s[o]})}function p(o){const t=l(o),[s,u]=n.createSignal(t(),{equals:!1});return n.createEffect(()=>{n.onCleanup(t().on("change",()=>{u(r=>r)}))}),s}function e(o,t){return t?()=>p(o):()=>l(o)}const m=e("backButton",!0),g=e("closingBehavior",!0),v=e("cloudStorage"),S=e("hapticFeedback"),h=e("initData"),D=e("initDataRaw"),f=e("invoice",!0);function P(){return a.retrieveLaunchData().launchParams}const C=e("mainButton",!0),B=e("miniApp",!0),R=e("popup",!0),M=e("postEvent"),k=e("qrScanner",!0),w=e("themeParams",!0),I=e("viewport",!0),b=e("utils");exports.SDKProvider=d;exports.useBackButton=m;exports.useClosingBehavior=g;exports.useCloudStorage=v;exports.useHapticFeedback=S;exports.useInitData=h;exports.useInitDataRaw=D;exports.useInvoice=f;exports.useLaunchParams=P;exports.useMainButton=C;exports.useMiniApp=B;exports.usePopup=R;exports.usePostEvent=M;exports.useQRScanner=k;exports.useSDKContext=c;exports.useThemeParams=w;exports.useUtils=b;exports.useViewport=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("solid-js"),c=require("@tma.js/sdk"),l=e.createContext({loading:()=>!1,error:()=>{},initResult:()=>{}},{name:"SDKContext"});function g(t){const[n]=e.createResource(()=>t.options,c.init),o=e.createMemo(()=>n.state==="ready"?n():void 0),u=e.createMemo(()=>n.loading),a=e.createMemo(()=>n.error===void 0?null:n.error);return e.createComponent(l.Provider,{value:{initResult:o,loading:u,error:a},get children(){return t.children}})}function i(){return e.useContext(l)}function d(t){const{initResult:n}=i();return e.createMemo(()=>{const o=n();if(!o)throw new Error(`Unable to get init result key "${t}" as long as SDK is not initialized`);return o[t]})}function h(t){const n=d(t),[o,u]=e.createSignal(n(),{equals:!1});return e.createEffect(()=>{e.onCleanup(n().on("change",()=>{u(a=>a)}))}),o}function r(t,n){return n?()=>h(t):()=>d(t)}const m=r("backButton",!0),p=r("closingBehavior",!0),S=r("cloudStorage"),f=r("hapticFeedback"),v=r("initData"),D=r("initDataRaw"),C=r("invoice",!0);function B(){return c.retrieveLaunchData().launchParams}const P=r("mainButton",!0),w=r("miniApp",!0),M=r("popup",!0),R=r("postEvent"),k=r("qrScanner",!0),b=r("settingsButton",!0),I=r("themeParams",!0),x=r("viewport",!0),y=r("utils");function s(t,n={}){return typeof t=="function"?e.createComponent(t,n):t}function K(t){const{loading:n,error:o,initResult:u}=i();return e.createComponent(e.Switch,{get fallback(){return s(t.initial)},get children(){return[e.createComponent(e.Match,{get when(){return u()},get children(){return t.children}}),e.createComponent(e.Match,{get when(){return o()},get children(){return s(t.error,{error:o()})}}),e.createComponent(e.Match,{get when(){return n()},get children(){return s(t.loading)}})]}})}exports.DisplayGate=K;exports.SDKProvider=g;exports.useBackButton=m;exports.useClosingBehavior=p;exports.useCloudStorage=S;exports.useHapticFeedback=f;exports.useInitData=v;exports.useInitDataRaw=D;exports.useInvoice=C;exports.useLaunchParams=B;exports.useMainButton=P;exports.useMiniApp=w;exports.usePopup=M;exports.usePostEvent=R;exports.useQRScanner=k;exports.useSDKContext=i;exports.useSettingsButton=b;exports.useThemeParams=I;exports.useUtils=y;exports.useViewport=x;
 //# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../src/provider/SDKContext.ts","../src/provider/SDKProvider.tsx","../src/provider/useSDKContext.ts","../src/provider/useInitResultValue.ts","../src/provider/useInitResultDynamicValue.ts","../src/createHook.ts","../src/tools/back-button.ts","../src/tools/closing-behavior.ts","../src/tools/cloud-storage.ts","../src/tools/haptic-feedback.ts","../src/tools/init-data.ts","../src/tools/init-data-raw.ts","../src/tools/invoice.ts","../src/tools/launch-params.tsx","../src/tools/main-button.ts","../src/tools/mini-app.ts","../src/tools/popup.ts","../src/tools/post-event.ts","../src/tools/qr-scanner.ts","../src/tools/theme-params.ts","../src/tools/viewport.ts","../src/tools/utils.ts"],"sourcesContent":["import { createContext } from 'solid-js';\n\nimport type { SDKContextType } from './types.js';\n\nexport const SDKContext = createContext<SDKContextType>({\n  loading: () => false,\n  error: () => undefined,\n  initResult: () => undefined,\n}, { name: 'SDKContext' });\n","import { init } from '@tma.js/sdk';\nimport { createMemo, createResource } from 'solid-js';\n\nimport { SDKContext } from './SDKContext.js';\nimport type { SDKProviderProps } from './types.js';\n\nexport function SDKProvider(props: SDKProviderProps) {\n  const [data] = createResource(() => props.options, init);\n\n  const initResult = createMemo(() => {\n    return data.state === 'ready' ? data() : undefined;\n  });\n  const loading = createMemo(() => data.loading);\n  const error = createMemo(() => (data.error === undefined ? null : data.error));\n\n  return (\n    <SDKContext.Provider value={{ initResult, loading, error }}>\n      {props.children}\n    </SDKContext.Provider>\n  );\n}\n","import { useContext } from 'solid-js';\n\nimport { SDKContext } from './SDKContext.js';\nimport type { SDKContextType } from './types.js';\n\n/**\n * Returns current SDK information.\n */\nexport function useSDKContext(): SDKContextType {\n  return useContext(SDKContext);\n}\n","import { type Accessor, createMemo } from 'solid-js';\n\nimport { useSDKContext } from './useSDKContext.js';\nimport type { InitResultKey, InitResultValue } from '../types.js';\n\n/**\n * Returns value by its field name from SDK init result.\n * @param key - init result key.\n * @throws {Error} SDK is not initialized.\n */\nexport function useInitResultValue<K extends InitResultKey>(key: K): Accessor<InitResultValue<K>> {\n  const { initResult } = useSDKContext();\n\n  // eslint-disable-next-line solid/reactivity\n  return createMemo<InitResultValue<K>>(() => {\n    const result = initResult();\n\n    if (!result) {\n      throw new Error(`Unable to get init result key \"${key}\" as long as SDK is not initialized`);\n    }\n    return result[key];\n  });\n}\n","import {\n  type Accessor,\n  createEffect,\n  createSignal,\n  onCleanup,\n} from 'solid-js';\n\nimport { useInitResultValue } from './useInitResultValue.js';\nimport type {\n  DynamicInitResultKey,\n  InitResultValue,\n  Trackable,\n} from '../types.js';\n\nexport function useInitResultDynamicValue<K extends DynamicInitResultKey>(\n  initResultKey: K,\n): Accessor<InitResultValue<K>> {\n  // Extract init result value.\n  const initial = useInitResultValue(initResultKey);\n\n  // Create value which will be returned to the external environment.\n  const [signal, setSignal] = createSignal(initial(), { equals: false });\n\n  // Effect which listens to change event and calls update.\n  createEffect(() => {\n    onCleanup(\n      (initial() as Trackable).on('change', () => {\n        setSignal((prev) => prev);\n      }),\n    );\n  });\n\n  return signal;\n}\n","import type { Accessor } from 'solid-js';\n\nimport { useInitResultDynamicValue, useInitResultValue } from './provider/index.js';\nimport type {\n  DynamicInitResultKey,\n  InitResultKey,\n  InitResultValue,\n  StaticInitResultKey,\n} from './types.js';\n\nexport type Hook<K extends InitResultKey> = () => Accessor<InitResultValue<K>>;\n\n/**\n * Creates hook to retrieve static init result value.\n * @param initResultKey - init result key.\n */\nexport function createHook<K extends StaticInitResultKey>(initResultKey: K): Hook<K>;\n\n/**\n * Creates hook to retrieve dynamic init result value.\n * @param initResultKey - init result key.\n * @param dynamic - flag to let function know this init result value is dynamic.\n */\nexport function createHook<K extends DynamicInitResultKey>(\n  initResultKey: K,\n  dynamic: true,\n): Hook<K>;\n\nexport function createHook(initResultKey: InitResultKey, dynamic?: true): Hook<any> {\n  return dynamic\n    ? () => useInitResultDynamicValue(initResultKey as DynamicInitResultKey)\n    : () => useInitResultValue(initResultKey);\n}\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve BackButton component.\n */\nexport const useBackButton = createHook('backButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve ClosingBehavior component.\n */\nexport const useClosingBehavior = createHook('closingBehavior', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve CloudStorage component.\n */\nexport const useCloudStorage = createHook('cloudStorage');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve HapticFeedback component.\n */\nexport const useHapticFeedback = createHook('hapticFeedback');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve InitData component.\n */\nexport const useInitData = createHook('initData');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve init data raw representation.\n */\nexport const useInitDataRaw = createHook('initDataRaw');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Invoice component.\n */\nexport const useInvoice = createHook('invoice', true);\n","import { type LaunchParams, retrieveLaunchData } from '@tma.js/sdk';\n\n/**\n * Hooks to retrieve launch parameters.\n */\nexport function useLaunchParams(): LaunchParams {\n  return retrieveLaunchData().launchParams;\n}\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve MainButton component.\n */\nexport const useMainButton = createHook('mainButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve MiniApp component.\n */\nexport const useMiniApp = createHook('miniApp', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Popup component.\n */\nexport const usePopup = createHook('popup', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve postEvent function.\n */\nexport const usePostEvent = createHook('postEvent');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve QRScanner component.\n */\nexport const useQRScanner = createHook('qrScanner', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve ThemeParams component.\n */\nexport const useThemeParams = createHook('themeParams', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Viewport component.\n */\nexport const useViewport = createHook('viewport', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Utils component.\n */\nexport const useUtils = createHook('utils');\n"],"names":["SDKContext","createContext","SDKProvider","props","data","createResource","options","init","initResult","createMemo","state","undefined","loading","error","_$createComponent","Provider","value","children","useSDKContext","useContext","useInitResultValue","key","result","useInitResultDynamicValue","initResultKey","initial","signal","setSignal","createSignal","createEffect","onCleanup","prev","createHook","dynamic","useBackButton","useClosingBehavior","useCloudStorage","useHapticFeedback","useInitData","useInitDataRaw","useInvoice","useLaunchParams","retrieveLaunchData","launchParams","useMainButton","useMiniApp","usePopup","usePostEvent","useQRScanner","useThemeParams","useViewport","useUtils"],"mappings":"qIAIaA,EAAaC,EAAAA,cAA8B,CACtD,QAAS,IAAM,GACf,MAAO,IAAM,GACb,WAAY,IAAM,EACpB,EAAG,CAAE,KAAM,aAAc,ECFlB,SAASC,EAAYC,EAAyB,CACnD,KAAM,CAACC,CAAI,EAAIC,EAAc,eAAC,IAAMF,EAAMG,QAASC,EAAAA,IAAI,EAEjDC,EAAaC,EAAAA,WAAW,IACrBL,EAAKM,QAAU,QAAUN,EAAI,EAAKO,MAC1C,EACKC,EAAUH,EAAU,WAAC,IAAML,EAAKQ,OAAO,EACvCC,EAAQJ,aAAW,IAAOL,EAAKS,QAAUF,OAAY,KAAOP,EAAKS,KAAM,EAE7E,OAAAC,EAAA,gBACGd,EAAWe,SAAQ,CAACC,MAAO,CAAER,WAAAA,EAAYI,QAAAA,EAASC,MAAAA,CAAO,EAAA,IAAAI,UAAA,CAAA,OACvDd,EAAMc,QAAQ,CAAA,CAAA,CAGrB,CCZO,SAASC,GAAgC,CAC9C,OAAOC,EAAAA,WAAWnB,CAAU,CAC9B,CCAO,SAASoB,EAA4CC,EAAsC,CAC1F,KAAA,CAAE,WAAAb,GAAeU,IAGvB,OAAOT,aAA+B,IAAM,CAC1C,MAAMa,EAASd,IAEf,GAAI,CAACc,EACH,MAAM,IAAI,MAAM,kCAAkCD,CAAG,qCAAqC,EAE5F,OAAOC,EAAOD,CAAG,CAAA,CAClB,CACH,CCRO,SAASE,EACdC,EAC8B,CAExB,MAAAC,EAAUL,EAAmBI,CAAa,EAG1C,CAACE,EAAQC,CAAS,EAAIC,EAAA,aAAaH,IAAW,CAAE,OAAQ,EAAA,CAAO,EAGrEI,OAAAA,EAAAA,aAAa,IAAM,CACjBC,EAAA,UACGL,EAAQ,EAAgB,GAAG,SAAU,IAAM,CAChCE,EAACI,GAASA,CAAI,CAAA,CACzB,CAAA,CACH,CACD,EAEML,CACT,CCLgB,SAAAM,EAAWR,EAA8BS,EAA2B,CAClF,OAAOA,EACH,IAAMV,EAA0BC,CAAqC,EACrE,IAAMJ,EAAmBI,CAAa,CAC5C,CC3Ba,MAAAU,EAAgBF,EAAW,aAAc,EAAI,ECA7CG,EAAqBH,EAAW,kBAAmB,EAAI,ECAvDI,EAAkBJ,EAAW,cAAc,ECA3CK,EAAoBL,EAAW,gBAAgB,ECA/CM,EAAcN,EAAW,UAAU,ECAnCO,EAAiBP,EAAW,aAAa,ECAzCQ,EAAaR,EAAW,UAAW,EAAI,ECA7C,SAASS,GAAgC,CAC9C,OAAOC,EAAAA,mBAAoB,EAACC,YAC9B,CCFa,MAAAC,EAAgBZ,EAAW,aAAc,EAAI,ECA7Ca,EAAab,EAAW,UAAW,EAAI,ECAvCc,EAAWd,EAAW,QAAS,EAAI,ECAnCe,EAAef,EAAW,WAAW,ECArCgB,EAAehB,EAAW,YAAa,EAAI,ECA3CiB,EAAiBjB,EAAW,cAAe,EAAI,ECA/CkB,EAAclB,EAAW,WAAY,EAAI,ECAzCmB,EAAWnB,EAAW,OAAO"}
+{"version":3,"file":"index.cjs","sources":["../src/provider/SDKContext.ts","../src/provider/SDKProvider.tsx","../src/provider/useSDKContext.ts","../src/provider/useInitResultValue.ts","../src/provider/useInitResultDynamicValue.ts","../src/createHook.ts","../src/tools/back-button.ts","../src/tools/closing-behavior.ts","../src/tools/cloud-storage.ts","../src/tools/haptic-feedback.ts","../src/tools/init-data.ts","../src/tools/init-data-raw.ts","../src/tools/invoice.ts","../src/tools/launch-params.tsx","../src/tools/main-button.ts","../src/tools/mini-app.ts","../src/tools/popup.ts","../src/tools/post-event.ts","../src/tools/qr-scanner.ts","../src/tools/settings-button.ts","../src/tools/theme-params.ts","../src/tools/viewport.ts","../src/tools/utils.ts","../src/DisplayGate.tsx"],"sourcesContent":["import { createContext } from 'solid-js';\n\nimport type { SDKContextType } from './types.js';\n\nexport const SDKContext = createContext<SDKContextType>({\n  loading: () => false,\n  error: () => undefined,\n  initResult: () => undefined,\n}, { name: 'SDKContext' });\n","import { init } from '@tma.js/sdk';\nimport { createMemo, createResource } from 'solid-js';\n\nimport { SDKContext } from './SDKContext.js';\nimport type { SDKProviderProps } from './types.js';\n\nexport function SDKProvider(props: SDKProviderProps) {\n  const [data] = createResource(() => props.options, init);\n\n  const initResult = createMemo(() => {\n    return data.state === 'ready' ? data() : undefined;\n  });\n  const loading = createMemo(() => data.loading);\n  const error = createMemo(() => (data.error === undefined ? null : data.error));\n\n  return (\n    <SDKContext.Provider value={{ initResult, loading, error }}>\n      {props.children}\n    </SDKContext.Provider>\n  );\n}\n","import { useContext } from 'solid-js';\n\nimport { SDKContext } from './SDKContext.js';\nimport type { SDKContextType } from './types.js';\n\n/**\n * Returns current SDK information.\n */\nexport function useSDKContext(): SDKContextType {\n  return useContext(SDKContext);\n}\n","import { type Accessor, createMemo } from 'solid-js';\n\nimport { useSDKContext } from './useSDKContext.js';\nimport type { InitResultKey, InitResultValue } from '../types.js';\n\n/**\n * Returns value by its field name from SDK init result.\n * @param key - init result key.\n * @throws {Error} SDK is not initialized.\n */\nexport function useInitResultValue<K extends InitResultKey>(key: K): Accessor<InitResultValue<K>> {\n  const { initResult } = useSDKContext();\n\n  // eslint-disable-next-line solid/reactivity\n  return createMemo<InitResultValue<K>>(() => {\n    const result = initResult();\n\n    if (!result) {\n      throw new Error(`Unable to get init result key \"${key}\" as long as SDK is not initialized`);\n    }\n    return result[key];\n  });\n}\n","import {\n  type Accessor,\n  createEffect,\n  createSignal,\n  onCleanup,\n} from 'solid-js';\n\nimport { useInitResultValue } from './useInitResultValue.js';\nimport type {\n  DynamicInitResultKey,\n  InitResultValue,\n  Trackable,\n} from '../types.js';\n\nexport function useInitResultDynamicValue<K extends DynamicInitResultKey>(\n  initResultKey: K,\n): Accessor<InitResultValue<K>> {\n  // Extract init result value.\n  const initial = useInitResultValue(initResultKey);\n\n  // Create value which will be returned to the external environment.\n  const [signal, setSignal] = createSignal(initial(), { equals: false });\n\n  // Effect which listens to change event and calls update.\n  createEffect(() => {\n    onCleanup(\n      (initial() as Trackable).on('change', () => {\n        setSignal((prev) => prev);\n      }),\n    );\n  });\n\n  return signal;\n}\n","import type { Accessor } from 'solid-js';\n\nimport { useInitResultDynamicValue, useInitResultValue } from './provider/index.js';\nimport type {\n  DynamicInitResultKey,\n  InitResultKey,\n  InitResultValue,\n  StaticInitResultKey,\n} from './types.js';\n\nexport type Hook<K extends InitResultKey> = () => Accessor<InitResultValue<K>>;\n\n/**\n * Creates hook to retrieve static init result value.\n * @param initResultKey - init result key.\n */\nexport function createHook<K extends StaticInitResultKey>(initResultKey: K): Hook<K>;\n\n/**\n * Creates hook to retrieve dynamic init result value.\n * @param initResultKey - init result key.\n * @param dynamic - flag to let function know this init result value is dynamic.\n */\nexport function createHook<K extends DynamicInitResultKey>(\n  initResultKey: K,\n  dynamic: true,\n): Hook<K>;\n\nexport function createHook(initResultKey: InitResultKey, dynamic?: true): Hook<any> {\n  return dynamic\n    ? () => useInitResultDynamicValue(initResultKey as DynamicInitResultKey)\n    : () => useInitResultValue(initResultKey);\n}\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve BackButton component.\n */\nexport const useBackButton = createHook('backButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve ClosingBehavior component.\n */\nexport const useClosingBehavior = createHook('closingBehavior', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve CloudStorage component.\n */\nexport const useCloudStorage = createHook('cloudStorage');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve HapticFeedback component.\n */\nexport const useHapticFeedback = createHook('hapticFeedback');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve InitData component.\n */\nexport const useInitData = createHook('initData');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve init data raw representation.\n */\nexport const useInitDataRaw = createHook('initDataRaw');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Invoice component.\n */\nexport const useInvoice = createHook('invoice', true);\n","import { type LaunchParams, retrieveLaunchData } from '@tma.js/sdk';\n\n/**\n * Hooks to retrieve launch parameters.\n */\nexport function useLaunchParams(): LaunchParams {\n  return retrieveLaunchData().launchParams;\n}\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve MainButton component.\n */\nexport const useMainButton = createHook('mainButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve MiniApp component.\n */\nexport const useMiniApp = createHook('miniApp', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Popup component.\n */\nexport const usePopup = createHook('popup', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve postEvent function.\n */\nexport const usePostEvent = createHook('postEvent');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve QRScanner component.\n */\nexport const useQRScanner = createHook('qrScanner', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve SettingsButton component.\n */\nexport const useSettingsButton = createHook('settingsButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve ThemeParams component.\n */\nexport const useThemeParams = createHook('themeParams', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Viewport component.\n */\nexport const useViewport = createHook('viewport', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Utils component.\n */\nexport const useUtils = createHook('utils');\n","import {\n  Match,\n  Switch,\n  type Component,\n  type ParentProps,\n  type JSX,\n} from 'solid-js';\n\nimport { useSDKContext } from './provider/index.js';\n\nexport interface DisplayGateProps extends ParentProps {\n  /**\n   * Element or component, which will be displayed in case, SDK is not loading, didn't receive\n   * any error during initialization as well as the initialization result.\n   */\n  initial?: JSX.Element | Component;\n\n  /**\n   * Element or component which will be displayed in case, SDK initialization failed.\n   */\n  error?: JSX.Element | Component<{ error: unknown }>;\n\n  /**\n   * Element or component which will be displayed in case, SDK is currently loading.\n   */\n  loading?: JSX.Element | Component;\n}\n\nfunction render(Component: JSX.Element | Component): JSX.Element;\nfunction render<T extends object>(Component: JSX.Element | Component<T>, props: T): JSX.Element;\nfunction render(Component: JSX.Element | Component, props = {}): JSX.Element {\n  return typeof Component === 'function' ? <Component {...props}/> : Component;\n}\n\n/**\n * This component is the layer controlling the application display. It displays application in\n * case, the SDK is initialized, displays an error if something went wrong, and a loader\n * if the SDK is warming up.\n */\nexport function DisplayGate(props: DisplayGateProps) {\n  const { loading, error, initResult } = useSDKContext();\n\n  return (\n    <Switch fallback={render(props.initial)}>\n      <Match when={initResult()}>\n        {props.children}\n      </Match>\n      <Match when={error()}>\n        {render(props.error, { error: error() })}\n      </Match>\n      <Match when={loading()}>\n        {render(props.loading)}\n      </Match>\n    </Switch>\n  );\n}"],"names":["SDKContext","createContext","SDKProvider","props","data","createResource","options","init","initResult","createMemo","state","undefined","loading","error","_$createComponent","Provider","value","children","useSDKContext","useContext","useInitResultValue","key","result","useInitResultDynamicValue","initResultKey","initial","signal","setSignal","createSignal","createEffect","onCleanup","prev","createHook","dynamic","useBackButton","useClosingBehavior","useCloudStorage","useHapticFeedback","useInitData","useInitDataRaw","useInvoice","useLaunchParams","retrieveLaunchData","launchParams","useMainButton","useMiniApp","usePopup","usePostEvent","useQRScanner","useSettingsButton","useThemeParams","useViewport","useUtils","render","Component","DisplayGate","Switch","fallback","Match","when"],"mappings":"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"}

package/dist/index.mjs

@@ -1,73 +1,116 @@
-import { createContext as c, createResource as l, createMemo as r, createComponent as d, useContext as p, createSignal as m, createEffect as f, onCleanup as g } from "solid-js";
-import { init as v, retrieveLaunchData as h } from "@tma.js/sdk";
-const a = c({
+import { createContext as h, createResource as f, createMemo as i, createComponent as o, useContext as m, createSignal as v, createEffect as S, onCleanup as p, Switch as D, Match as s } from "solid-js";
+import { init as w, retrieveLaunchData as B } from "@tma.js/sdk";
+const l = h({
   loading: () => !1,
   error: () => {
   },
   initResult: () => {
   }
 }, { name: "SDKContext" });
-function R(n) {
-  const [e] = l(() => n.options, v), o = r(() => e.state === "ready" ? e() : void 0), u = r(() => e.loading), s = r(() => e.error === void 0 ? null : e.error);
-  return d(a.Provider, {
+function k(t) {
+  const [e] = f(() => t.options, w), r = i(() => e.state === "ready" ? e() : void 0), u = i(() => e.loading), a = i(() => e.error === void 0 ? null : e.error);
+  return o(l.Provider, {
     value: {
-      initResult: o,
+      initResult: r,
       loading: u,
-      error: s
+      error: a
     },
     get children() {
-      return n.children;
+      return t.children;
     }
   });
 }
-function D() {
-  return p(a);
+function d() {
+  return m(l);
 }
-function i(n) {
-  const { initResult: e } = D();
-  return r(() => {
-    const o = e();
-    if (!o)
-      throw new Error(`Unable to get init result key "${n}" as long as SDK is not initialized`);
-    return o[n];
+function g(t) {
+  const { initResult: e } = d();
+  return i(() => {
+    const r = e();
+    if (!r)
+      throw new Error(`Unable to get init result key "${t}" as long as SDK is not initialized`);
+    return r[t];
   });
 }
-function S(n) {
-  const e = i(n), [o, u] = m(e(), { equals: !1 });
-  return f(() => {
-    g(
+function R(t) {
+  const e = g(t), [r, u] = v(e(), { equals: !1 });
+  return S(() => {
+    p(
       e().on("change", () => {
-        u((s) => s);
+        u((a) => a);
       })
     );
-  }), o;
+  }), r;
 }
-function t(n, e) {
-  return e ? () => S(n) : () => i(n);
+function n(t, e) {
+  return e ? () => R(t) : () => g(t);
 }
-const B = t("backButton", !0), w = t("closingBehavior", !0), x = t("cloudStorage"), k = t("hapticFeedback"), I = t("initData"), b = t("initDataRaw"), E = t("invoice", !0);
-function K() {
-  return h().launchParams;
+const x = n("backButton", !0), b = n("closingBehavior", !0), I = n("cloudStorage"), E = n("hapticFeedback"), K = n("initData"), M = n("initDataRaw"), y = n("invoice", !0);
+function V() {
+  return B().launchParams;
+}
+const q = n("mainButton", !0), A = n("miniApp", !0), F = n("popup", !0), H = n("postEvent"), L = n("qrScanner", !0), U = n("settingsButton", !0), z = n("themeParams", !0), G = n("viewport", !0), Q = n("utils");
+function c(t, e = {}) {
+  return typeof t == "function" ? o(t, e) : t;
+}
+function T(t) {
+  const {
+    loading: e,
+    error: r,
+    initResult: u
+  } = d();
+  return o(D, {
+    get fallback() {
+      return c(t.initial);
+    },
+    get children() {
+      return [o(s, {
+        get when() {
+          return u();
+        },
+        get children() {
+          return t.children;
+        }
+      }), o(s, {
+        get when() {
+          return r();
+        },
+        get children() {
+          return c(t.error, {
+            error: r()
+          });
+        }
+      }), o(s, {
+        get when() {
+          return e();
+        },
+        get children() {
+          return c(t.loading);
+        }
+      })];
+    }
+  });
 }
-const M = t("mainButton", !0), V = t("miniApp", !0), q = t("popup", !0), A = t("postEvent"), F = t("qrScanner", !0), H = t("themeParams", !0), L = t("viewport", !0), U = t("utils");
 export {
-  R as SDKProvider,
-  B as useBackButton,
-  w as useClosingBehavior,
-  x as useCloudStorage,
-  k as useHapticFeedback,
-  I as useInitData,
-  b as useInitDataRaw,
-  E as useInvoice,
-  K as useLaunchParams,
-  M as useMainButton,
-  V as useMiniApp,
-  q as usePopup,
-  A as usePostEvent,
-  F as useQRScanner,
-  D as useSDKContext,
-  H as useThemeParams,
-  U as useUtils,
-  L as useViewport
+  T as DisplayGate,
+  k as SDKProvider,
+  x as useBackButton,
+  b as useClosingBehavior,
+  I as useCloudStorage,
+  E as useHapticFeedback,
+  K as useInitData,
+  M as useInitDataRaw,
+  y as useInvoice,
+  V as useLaunchParams,
+  q as useMainButton,
+  A as useMiniApp,
+  F as usePopup,
+  H as usePostEvent,
+  L as useQRScanner,
+  d as useSDKContext,
+  U as useSettingsButton,
+  z as useThemeParams,
+  Q as useUtils,
+  G as useViewport
 };
 //# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../src/provider/SDKContext.ts","../src/provider/SDKProvider.tsx","../src/provider/useSDKContext.ts","../src/provider/useInitResultValue.ts","../src/provider/useInitResultDynamicValue.ts","../src/createHook.ts","../src/tools/back-button.ts","../src/tools/closing-behavior.ts","../src/tools/cloud-storage.ts","../src/tools/haptic-feedback.ts","../src/tools/init-data.ts","../src/tools/init-data-raw.ts","../src/tools/invoice.ts","../src/tools/launch-params.tsx","../src/tools/main-button.ts","../src/tools/mini-app.ts","../src/tools/popup.ts","../src/tools/post-event.ts","../src/tools/qr-scanner.ts","../src/tools/theme-params.ts","../src/tools/viewport.ts","../src/tools/utils.ts"],"sourcesContent":["import { createContext } from 'solid-js';\n\nimport type { SDKContextType } from './types.js';\n\nexport const SDKContext = createContext<SDKContextType>({\n  loading: () => false,\n  error: () => undefined,\n  initResult: () => undefined,\n}, { name: 'SDKContext' });\n","import { init } from '@tma.js/sdk';\nimport { createMemo, createResource } from 'solid-js';\n\nimport { SDKContext } from './SDKContext.js';\nimport type { SDKProviderProps } from './types.js';\n\nexport function SDKProvider(props: SDKProviderProps) {\n  const [data] = createResource(() => props.options, init);\n\n  const initResult = createMemo(() => {\n    return data.state === 'ready' ? data() : undefined;\n  });\n  const loading = createMemo(() => data.loading);\n  const error = createMemo(() => (data.error === undefined ? null : data.error));\n\n  return (\n    <SDKContext.Provider value={{ initResult, loading, error }}>\n      {props.children}\n    </SDKContext.Provider>\n  );\n}\n","import { useContext } from 'solid-js';\n\nimport { SDKContext } from './SDKContext.js';\nimport type { SDKContextType } from './types.js';\n\n/**\n * Returns current SDK information.\n */\nexport function useSDKContext(): SDKContextType {\n  return useContext(SDKContext);\n}\n","import { type Accessor, createMemo } from 'solid-js';\n\nimport { useSDKContext } from './useSDKContext.js';\nimport type { InitResultKey, InitResultValue } from '../types.js';\n\n/**\n * Returns value by its field name from SDK init result.\n * @param key - init result key.\n * @throws {Error} SDK is not initialized.\n */\nexport function useInitResultValue<K extends InitResultKey>(key: K): Accessor<InitResultValue<K>> {\n  const { initResult } = useSDKContext();\n\n  // eslint-disable-next-line solid/reactivity\n  return createMemo<InitResultValue<K>>(() => {\n    const result = initResult();\n\n    if (!result) {\n      throw new Error(`Unable to get init result key \"${key}\" as long as SDK is not initialized`);\n    }\n    return result[key];\n  });\n}\n","import {\n  type Accessor,\n  createEffect,\n  createSignal,\n  onCleanup,\n} from 'solid-js';\n\nimport { useInitResultValue } from './useInitResultValue.js';\nimport type {\n  DynamicInitResultKey,\n  InitResultValue,\n  Trackable,\n} from '../types.js';\n\nexport function useInitResultDynamicValue<K extends DynamicInitResultKey>(\n  initResultKey: K,\n): Accessor<InitResultValue<K>> {\n  // Extract init result value.\n  const initial = useInitResultValue(initResultKey);\n\n  // Create value which will be returned to the external environment.\n  const [signal, setSignal] = createSignal(initial(), { equals: false });\n\n  // Effect which listens to change event and calls update.\n  createEffect(() => {\n    onCleanup(\n      (initial() as Trackable).on('change', () => {\n        setSignal((prev) => prev);\n      }),\n    );\n  });\n\n  return signal;\n}\n","import type { Accessor } from 'solid-js';\n\nimport { useInitResultDynamicValue, useInitResultValue } from './provider/index.js';\nimport type {\n  DynamicInitResultKey,\n  InitResultKey,\n  InitResultValue,\n  StaticInitResultKey,\n} from './types.js';\n\nexport type Hook<K extends InitResultKey> = () => Accessor<InitResultValue<K>>;\n\n/**\n * Creates hook to retrieve static init result value.\n * @param initResultKey - init result key.\n */\nexport function createHook<K extends StaticInitResultKey>(initResultKey: K): Hook<K>;\n\n/**\n * Creates hook to retrieve dynamic init result value.\n * @param initResultKey - init result key.\n * @param dynamic - flag to let function know this init result value is dynamic.\n */\nexport function createHook<K extends DynamicInitResultKey>(\n  initResultKey: K,\n  dynamic: true,\n): Hook<K>;\n\nexport function createHook(initResultKey: InitResultKey, dynamic?: true): Hook<any> {\n  return dynamic\n    ? () => useInitResultDynamicValue(initResultKey as DynamicInitResultKey)\n    : () => useInitResultValue(initResultKey);\n}\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve BackButton component.\n */\nexport const useBackButton = createHook('backButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve ClosingBehavior component.\n */\nexport const useClosingBehavior = createHook('closingBehavior', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve CloudStorage component.\n */\nexport const useCloudStorage = createHook('cloudStorage');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve HapticFeedback component.\n */\nexport const useHapticFeedback = createHook('hapticFeedback');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve InitData component.\n */\nexport const useInitData = createHook('initData');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve init data raw representation.\n */\nexport const useInitDataRaw = createHook('initDataRaw');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Invoice component.\n */\nexport const useInvoice = createHook('invoice', true);\n","import { type LaunchParams, retrieveLaunchData } from '@tma.js/sdk';\n\n/**\n * Hooks to retrieve launch parameters.\n */\nexport function useLaunchParams(): LaunchParams {\n  return retrieveLaunchData().launchParams;\n}\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve MainButton component.\n */\nexport const useMainButton = createHook('mainButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve MiniApp component.\n */\nexport const useMiniApp = createHook('miniApp', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Popup component.\n */\nexport const usePopup = createHook('popup', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve postEvent function.\n */\nexport const usePostEvent = createHook('postEvent');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve QRScanner component.\n */\nexport const useQRScanner = createHook('qrScanner', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve ThemeParams component.\n */\nexport const useThemeParams = createHook('themeParams', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Viewport component.\n */\nexport const useViewport = createHook('viewport', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Utils component.\n */\nexport const useUtils = createHook('utils');\n"],"names":["SDKContext","createContext","SDKProvider","props","data","createResource","options","init","initResult","createMemo","state","undefined","loading","error","_$createComponent","Provider","value","children","useSDKContext","useContext","useInitResultValue","key","result","useInitResultDynamicValue","initResultKey","initial","signal","setSignal","createSignal","createEffect","onCleanup","prev","createHook","dynamic","useBackButton","useClosingBehavior","useCloudStorage","useHapticFeedback","useInitData","useInitDataRaw","useInvoice","useLaunchParams","retrieveLaunchData","launchParams","useMainButton","useMiniApp","usePopup","usePostEvent","useQRScanner","useThemeParams","useViewport","useUtils"],"mappings":";;AAIO,MAAMA,IAAaC,EAA8B;AAAA,EACtD,SAAS,MAAM;AAAA,EACf,OAAO,MAAM;AAAA;AAAA,EACb,YAAY,MAAM;AAAA;AACpB,GAAG,EAAE,MAAM,cAAc;ACFlB,SAASC,EAAYC,GAAyB;AACnD,QAAM,CAACC,CAAI,IAAIC,EAAe,MAAMF,EAAMG,SAASC,CAAI,GAEjDC,IAAaC,EAAW,MACrBL,EAAKM,UAAU,UAAUN,EAAI,IAAKO,MAC1C,GACKC,IAAUH,EAAW,MAAML,EAAKQ,OAAO,GACvCC,IAAQJ,EAAW,MAAOL,EAAKS,UAAUF,SAAY,OAAOP,EAAKS,KAAM;AAE7E,SAAAC,EACGd,EAAWe,UAAQ;AAAA,IAACC,OAAO;AAAA,MAAER,YAAAA;AAAAA,MAAYI,SAAAA;AAAAA,MAASC,OAAAA;AAAAA,IAAO;AAAA,IAAA,IAAAI,WAAA;AAAA,aACvDd,EAAMc;AAAAA,IAAQ;AAAA,EAAA,CAAA;AAGrB;ACZO,SAASC,IAAgC;AAC9C,SAAOC,EAAWnB,CAAU;AAC9B;ACAO,SAASoB,EAA4CC,GAAsC;AAC1F,QAAA,EAAE,YAAAb,MAAeU;AAGvB,SAAOT,EAA+B,MAAM;AAC1C,UAAMa,IAASd;AAEf,QAAI,CAACc;AACH,YAAM,IAAI,MAAM,kCAAkCD,CAAG,qCAAqC;AAE5F,WAAOC,EAAOD,CAAG;AAAA,EAAA,CAClB;AACH;ACRO,SAASE,EACdC,GAC8B;AAExB,QAAAC,IAAUL,EAAmBI,CAAa,GAG1C,CAACE,GAAQC,CAAS,IAAIC,EAAaH,KAAW,EAAE,QAAQ,GAAA,CAAO;AAGrE,SAAAI,EAAa,MAAM;AACjB,IAAAC;AAAA,MACGL,EAAQ,EAAgB,GAAG,UAAU,MAAM;AAChC,QAAAE,EAAA,CAACI,MAASA,CAAI;AAAA,MAAA,CACzB;AAAA,IAAA;AAAA,EACH,CACD,GAEML;AACT;ACLgB,SAAAM,EAAWR,GAA8BS,GAA2B;AAClF,SAAOA,IACH,MAAMV,EAA0BC,CAAqC,IACrE,MAAMJ,EAAmBI,CAAa;AAC5C;AC3Ba,MAAAU,IAAgBF,EAAW,cAAc,EAAI,GCA7CG,IAAqBH,EAAW,mBAAmB,EAAI,GCAvDI,IAAkBJ,EAAW,cAAc,GCA3CK,IAAoBL,EAAW,gBAAgB,GCA/CM,IAAcN,EAAW,UAAU,GCAnCO,IAAiBP,EAAW,aAAa,GCAzCQ,IAAaR,EAAW,WAAW,EAAI;ACA7C,SAASS,IAAgC;AAC9C,SAAOC,EAAoB,EAACC;AAC9B;ACFa,MAAAC,IAAgBZ,EAAW,cAAc,EAAI,GCA7Ca,IAAab,EAAW,WAAW,EAAI,GCAvCc,IAAWd,EAAW,SAAS,EAAI,GCAnCe,IAAef,EAAW,WAAW,GCArCgB,IAAehB,EAAW,aAAa,EAAI,GCA3CiB,IAAiBjB,EAAW,eAAe,EAAI,GCA/CkB,IAAclB,EAAW,YAAY,EAAI,GCAzCmB,IAAWnB,EAAW,OAAO;"}
+{"version":3,"file":"index.mjs","sources":["../src/provider/SDKContext.ts","../src/provider/SDKProvider.tsx","../src/provider/useSDKContext.ts","../src/provider/useInitResultValue.ts","../src/provider/useInitResultDynamicValue.ts","../src/createHook.ts","../src/tools/back-button.ts","../src/tools/closing-behavior.ts","../src/tools/cloud-storage.ts","../src/tools/haptic-feedback.ts","../src/tools/init-data.ts","../src/tools/init-data-raw.ts","../src/tools/invoice.ts","../src/tools/launch-params.tsx","../src/tools/main-button.ts","../src/tools/mini-app.ts","../src/tools/popup.ts","../src/tools/post-event.ts","../src/tools/qr-scanner.ts","../src/tools/settings-button.ts","../src/tools/theme-params.ts","../src/tools/viewport.ts","../src/tools/utils.ts","../src/DisplayGate.tsx"],"sourcesContent":["import { createContext } from 'solid-js';\n\nimport type { SDKContextType } from './types.js';\n\nexport const SDKContext = createContext<SDKContextType>({\n  loading: () => false,\n  error: () => undefined,\n  initResult: () => undefined,\n}, { name: 'SDKContext' });\n","import { init } from '@tma.js/sdk';\nimport { createMemo, createResource } from 'solid-js';\n\nimport { SDKContext } from './SDKContext.js';\nimport type { SDKProviderProps } from './types.js';\n\nexport function SDKProvider(props: SDKProviderProps) {\n  const [data] = createResource(() => props.options, init);\n\n  const initResult = createMemo(() => {\n    return data.state === 'ready' ? data() : undefined;\n  });\n  const loading = createMemo(() => data.loading);\n  const error = createMemo(() => (data.error === undefined ? null : data.error));\n\n  return (\n    <SDKContext.Provider value={{ initResult, loading, error }}>\n      {props.children}\n    </SDKContext.Provider>\n  );\n}\n","import { useContext } from 'solid-js';\n\nimport { SDKContext } from './SDKContext.js';\nimport type { SDKContextType } from './types.js';\n\n/**\n * Returns current SDK information.\n */\nexport function useSDKContext(): SDKContextType {\n  return useContext(SDKContext);\n}\n","import { type Accessor, createMemo } from 'solid-js';\n\nimport { useSDKContext } from './useSDKContext.js';\nimport type { InitResultKey, InitResultValue } from '../types.js';\n\n/**\n * Returns value by its field name from SDK init result.\n * @param key - init result key.\n * @throws {Error} SDK is not initialized.\n */\nexport function useInitResultValue<K extends InitResultKey>(key: K): Accessor<InitResultValue<K>> {\n  const { initResult } = useSDKContext();\n\n  // eslint-disable-next-line solid/reactivity\n  return createMemo<InitResultValue<K>>(() => {\n    const result = initResult();\n\n    if (!result) {\n      throw new Error(`Unable to get init result key \"${key}\" as long as SDK is not initialized`);\n    }\n    return result[key];\n  });\n}\n","import {\n  type Accessor,\n  createEffect,\n  createSignal,\n  onCleanup,\n} from 'solid-js';\n\nimport { useInitResultValue } from './useInitResultValue.js';\nimport type {\n  DynamicInitResultKey,\n  InitResultValue,\n  Trackable,\n} from '../types.js';\n\nexport function useInitResultDynamicValue<K extends DynamicInitResultKey>(\n  initResultKey: K,\n): Accessor<InitResultValue<K>> {\n  // Extract init result value.\n  const initial = useInitResultValue(initResultKey);\n\n  // Create value which will be returned to the external environment.\n  const [signal, setSignal] = createSignal(initial(), { equals: false });\n\n  // Effect which listens to change event and calls update.\n  createEffect(() => {\n    onCleanup(\n      (initial() as Trackable).on('change', () => {\n        setSignal((prev) => prev);\n      }),\n    );\n  });\n\n  return signal;\n}\n","import type { Accessor } from 'solid-js';\n\nimport { useInitResultDynamicValue, useInitResultValue } from './provider/index.js';\nimport type {\n  DynamicInitResultKey,\n  InitResultKey,\n  InitResultValue,\n  StaticInitResultKey,\n} from './types.js';\n\nexport type Hook<K extends InitResultKey> = () => Accessor<InitResultValue<K>>;\n\n/**\n * Creates hook to retrieve static init result value.\n * @param initResultKey - init result key.\n */\nexport function createHook<K extends StaticInitResultKey>(initResultKey: K): Hook<K>;\n\n/**\n * Creates hook to retrieve dynamic init result value.\n * @param initResultKey - init result key.\n * @param dynamic - flag to let function know this init result value is dynamic.\n */\nexport function createHook<K extends DynamicInitResultKey>(\n  initResultKey: K,\n  dynamic: true,\n): Hook<K>;\n\nexport function createHook(initResultKey: InitResultKey, dynamic?: true): Hook<any> {\n  return dynamic\n    ? () => useInitResultDynamicValue(initResultKey as DynamicInitResultKey)\n    : () => useInitResultValue(initResultKey);\n}\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve BackButton component.\n */\nexport const useBackButton = createHook('backButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve ClosingBehavior component.\n */\nexport const useClosingBehavior = createHook('closingBehavior', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve CloudStorage component.\n */\nexport const useCloudStorage = createHook('cloudStorage');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve HapticFeedback component.\n */\nexport const useHapticFeedback = createHook('hapticFeedback');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve InitData component.\n */\nexport const useInitData = createHook('initData');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve init data raw representation.\n */\nexport const useInitDataRaw = createHook('initDataRaw');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Invoice component.\n */\nexport const useInvoice = createHook('invoice', true);\n","import { type LaunchParams, retrieveLaunchData } from '@tma.js/sdk';\n\n/**\n * Hooks to retrieve launch parameters.\n */\nexport function useLaunchParams(): LaunchParams {\n  return retrieveLaunchData().launchParams;\n}\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve MainButton component.\n */\nexport const useMainButton = createHook('mainButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve MiniApp component.\n */\nexport const useMiniApp = createHook('miniApp', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Popup component.\n */\nexport const usePopup = createHook('popup', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve postEvent function.\n */\nexport const usePostEvent = createHook('postEvent');\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve QRScanner component.\n */\nexport const useQRScanner = createHook('qrScanner', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve SettingsButton component.\n */\nexport const useSettingsButton = createHook('settingsButton', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve ThemeParams component.\n */\nexport const useThemeParams = createHook('themeParams', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Viewport component.\n */\nexport const useViewport = createHook('viewport', true);\n","import { createHook } from '../createHook.js';\n\n/**\n * Hook to retrieve Utils component.\n */\nexport const useUtils = createHook('utils');\n","import {\n  Match,\n  Switch,\n  type Component,\n  type ParentProps,\n  type JSX,\n} from 'solid-js';\n\nimport { useSDKContext } from './provider/index.js';\n\nexport interface DisplayGateProps extends ParentProps {\n  /**\n   * Element or component, which will be displayed in case, SDK is not loading, didn't receive\n   * any error during initialization as well as the initialization result.\n   */\n  initial?: JSX.Element | Component;\n\n  /**\n   * Element or component which will be displayed in case, SDK initialization failed.\n   */\n  error?: JSX.Element | Component<{ error: unknown }>;\n\n  /**\n   * Element or component which will be displayed in case, SDK is currently loading.\n   */\n  loading?: JSX.Element | Component;\n}\n\nfunction render(Component: JSX.Element | Component): JSX.Element;\nfunction render<T extends object>(Component: JSX.Element | Component<T>, props: T): JSX.Element;\nfunction render(Component: JSX.Element | Component, props = {}): JSX.Element {\n  return typeof Component === 'function' ? <Component {...props}/> : Component;\n}\n\n/**\n * This component is the layer controlling the application display. It displays application in\n * case, the SDK is initialized, displays an error if something went wrong, and a loader\n * if the SDK is warming up.\n */\nexport function DisplayGate(props: DisplayGateProps) {\n  const { loading, error, initResult } = useSDKContext();\n\n  return (\n    <Switch fallback={render(props.initial)}>\n      <Match when={initResult()}>\n        {props.children}\n      </Match>\n      <Match when={error()}>\n        {render(props.error, { error: error() })}\n      </Match>\n      <Match when={loading()}>\n        {render(props.loading)}\n      </Match>\n    </Switch>\n  );\n}"],"names":["SDKContext","createContext","SDKProvider","props","data","createResource","options","init","initResult","createMemo","state","undefined","loading","error","_$createComponent","Provider","value","children","useSDKContext","useContext","useInitResultValue","key","result","useInitResultDynamicValue","initResultKey","initial","signal","setSignal","createSignal","createEffect","onCleanup","prev","createHook","dynamic","useBackButton","useClosingBehavior","useCloudStorage","useHapticFeedback","useInitData","useInitDataRaw","useInvoice","useLaunchParams","retrieveLaunchData","launchParams","useMainButton","useMiniApp","usePopup","usePostEvent","useQRScanner","useSettingsButton","useThemeParams","useViewport","useUtils","render","Component","DisplayGate","Switch","fallback","Match","when"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tma.js/sdk-solid",
-  "version": "1.0.3",
+  "version": "1.1.0",
   "description": "Solid JS bindings for Mini Apps client SDK.",
   "author": "Vladislav Kibenko <wolfram.deus@gmail.com>",
   "homepage": "https://github.com/Telegram-Mini-Apps/tma.js#readme",
@@ -37,7 +37,7 @@
     }
   },
   "dependencies": {
-    "@tma.js/sdk": "1.1.0"
+    "@tma.js/sdk": "1.2.0"
   },
   "peerDependencies": {
     "solid-js": "^1.0.0"

package/src/DisplayGate.tsx

@@ -0,0 +1,56 @@
+import {
+  Match,
+  Switch,
+  type Component,
+  type ParentProps,
+  type JSX,
+} from 'solid-js';
+
+import { useSDKContext } from './provider/index.js';
+
+export interface DisplayGateProps extends ParentProps {
+  /**
+   * Element or component, which will be displayed in case, SDK is not loading, didn't receive
+   * any error during initialization as well as the initialization result.
+   */
+  initial?: JSX.Element | Component;
+
+  /**
+   * Element or component which will be displayed in case, SDK initialization failed.
+   */
+  error?: JSX.Element | Component<{ error: unknown }>;
+
+  /**
+   * Element or component which will be displayed in case, SDK is currently loading.
+   */
+  loading?: JSX.Element | Component;
+}
+
+function render(Component: JSX.Element | Component): JSX.Element;
+function render<T extends object>(Component: JSX.Element | Component<T>, props: T): JSX.Element;
+function render(Component: JSX.Element | Component, props = {}): JSX.Element {
+  return typeof Component === 'function' ? <Component {...props}/> : Component;
+}
+
+/**
+ * This component is the layer controlling the application display. It displays application in
+ * case, the SDK is initialized, displays an error if something went wrong, and a loader
+ * if the SDK is warming up.
+ */
+export function DisplayGate(props: DisplayGateProps) {
+  const { loading, error, initResult } = useSDKContext();
+
+  return (
+    <Switch fallback={render(props.initial)}>
+      <Match when={initResult()}>
+        {props.children}
+      </Match>
+      <Match when={error()}>
+        {render(props.error, { error: error() })}
+      </Match>
+      <Match when={loading()}>
+        {render(props.loading)}
+      </Match>
+    </Switch>
+  );
+}

package/src/index.ts

@@ -13,6 +13,7 @@ export {
   usePopup,
   usePostEvent,
   useQRScanner,
+  useSettingsButton,
   useUtils,
   useViewport,
 } from './tools/index.js';
@@ -22,6 +23,10 @@ export {
   type SDKProviderProps,
   type SDKContextType,
 } from './provider/index.js';
+export {
+  DisplayGate,
+  type DisplayGateProps
+} from './DisplayGate.js';
 export type {
   InitOptions,
   InitResult,

package/src/tools/index.ts

@@ -11,6 +11,7 @@ export * from './mini-app.js';
 export * from './popup.js';
 export * from './post-event.js';
 export * from './qr-scanner.js';
+export * from './settings-button.js';
 export * from './theme-params.js';
 export * from './viewport.js';
 export * from './utils.js';

package/src/tools/settings-button.ts

@@ -0,0 +1,6 @@
+import { createHook } from '../createHook.js';
+
+/**
+ * Hook to retrieve SettingsButton component.
+ */
+export const useSettingsButton = createHook('settingsButton', true);