@vkontakte/vkui 5.5.2 → 5.5.3

package/dist/cssm/hooks/useAutoDetectAppearance.js

@@ -4,23 +4,23 @@ import { noop } from '@vkontakte/vkjs';
 import { resolveAppearance } from '../helpers/appearance';
 import { useDOM } from '../lib/dom';
 import { matchMediaListAddListener, matchMediaListRemoveListener } from '../lib/matchMedia';
-let initialAppearance = null;
-vkBridge.send('VKWebAppGetConfig').then((data)=>{
-    initialAppearance = resolveAppearance(data);
-}).catch(console.error);
 function autoDetectAppearanceByBridge(setAppearance, onDetectAppearanceByBridge) {
+    function updateAppearance(data) {
+        const initialAppearance = resolveAppearance(data);
+        if (initialAppearance) {
+            onDetectAppearanceByBridge();
+            setAppearance(initialAppearance);
+        }
+    }
     function bridgeListener(e) {
         const { type , data  } = e.detail;
         if (type !== 'VKWebAppUpdateConfig') {
             return;
         }
-        initialAppearance = resolveAppearance(data);
-        if (initialAppearance) {
-            onDetectAppearanceByBridge();
-            setAppearance(initialAppearance);
-        }
+        updateAppearance(data);
     }
     vkBridge.subscribe(bridgeListener);
+    vkBridge.send('VKWebAppGetConfig').then(updateAppearance).catch(console.error);
     return ()=>vkBridge.unsubscribe(bridgeListener);
 }
 function autoDetectAppearance(window, setAppearance) {
@@ -46,10 +46,6 @@ export const useAutoDetectAppearance = (appearanceProp, onDetectAppearanceByBrid
         if (appearanceProp) {
             return appearanceProp;
         }
-        if (initialAppearance) {
-            onceDetectAppearanceByBridge.current();
-            return initialAppearance;
-        }
         const mediaQuery = window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');
         // eslint-disable-next-line no-restricted-properties
         return mediaQuery?.matches ? 'dark' : 'light';

package/dist/cssm/hooks/useAutoDetectAppearance.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/hooks/useAutoDetectAppearance.tsx"],"sourcesContent":["import * as React from 'react';\nimport vkBridge, {\n  AnyReceiveMethodName,\n  AppearanceType,\n  VKBridgeEvent,\n} from '@vkontakte/vk-bridge';\nimport { noop } from '@vkontakte/vkjs';\nimport { resolveAppearance, VKBridgeConfigData } from '../helpers/appearance';\nimport { useDOM } from '../lib/dom';\nimport { matchMediaListAddListener, matchMediaListRemoveListener } from '../lib/matchMedia';\n\nlet initialAppearance: AppearanceType | null = null;\n\nvkBridge\n  .send('VKWebAppGetConfig')\n  .then((data) => {\n    initialAppearance = resolveAppearance(data);\n  })\n  .catch(console.error);\n\nfunction autoDetectAppearanceByBridge(\n  setAppearance: (value: AppearanceType) => void,\n  onDetectAppearanceByBridge: () => void,\n) {\n  function bridgeListener(e: VKBridgeEvent<AnyReceiveMethodName>) {\n    const { type, data } = e.detail;\n\n    if (type !== 'VKWebAppUpdateConfig') {\n      return;\n    }\n\n    initialAppearance = resolveAppearance(data as VKBridgeConfigData);\n\n    if (initialAppearance) {\n      onDetectAppearanceByBridge();\n      setAppearance(initialAppearance);\n    }\n  }\n\n  vkBridge.subscribe(bridgeListener);\n\n  return () => vkBridge.unsubscribe(bridgeListener);\n}\n\nfunction autoDetectAppearance(\n  window: Window | undefined,\n  setAppearance: (value: AppearanceType) => void,\n): () => void {\n  const mediaQuery =\n    window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');\n\n  if (mediaQuery === undefined) {\n    return noop;\n  }\n\n  const check = (event: MediaQueryList | MediaQueryListEvent) => {\n    // eslint-disable-next-line no-restricted-properties\n    setAppearance(event.matches ? 'dark' : 'light');\n  };\n\n  check(mediaQuery);\n  matchMediaListAddListener(mediaQuery, check);\n\n  return () => matchMediaListRemoveListener(mediaQuery, check);\n}\n\nexport const useAutoDetectAppearance = (\n  appearanceProp?: AppearanceType,\n  onDetectAppearanceByBridge?: () => void,\n): AppearanceType => {\n  const { window } = useDOM();\n  const onceDetectAppearanceByBridge = React.useRef(() => {\n    onDetectAppearanceByBridge && onDetectAppearanceByBridge();\n    onceDetectAppearanceByBridge.current = noop;\n  });\n\n  const [appearance, setAppearance] = React.useState<AppearanceType>(() => {\n    if (appearanceProp) {\n      return appearanceProp;\n    }\n\n    if (initialAppearance) {\n      onceDetectAppearanceByBridge.current();\n      return initialAppearance;\n    }\n\n    const mediaQuery =\n      window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');\n\n    // eslint-disable-next-line no-restricted-properties\n    return mediaQuery?.matches ? 'dark' : 'light';\n  });\n\n  React.useEffect(() => {\n    if (appearanceProp) {\n      setAppearance(appearanceProp);\n      return noop;\n    }\n\n    if (vkBridge.isEmbedded()) {\n      return autoDetectAppearanceByBridge(setAppearance, onceDetectAppearanceByBridge.current);\n    }\n\n    return autoDetectAppearance(window, setAppearance);\n  }, [window, appearanceProp]);\n\n  return appearance;\n};\n"],"names":["React","vkBridge","noop","resolveAppearance","useDOM","matchMediaListAddListener","matchMediaListRemoveListener","initialAppearance","send","then","data","catch","console","error","autoDetectAppearanceByBridge","setAppearance","onDetectAppearanceByBridge","bridgeListener","e","type","detail","subscribe","unsubscribe","autoDetectAppearance","window","mediaQuery","matchMedia","undefined","check","event","matches","useAutoDetectAppearance","appearanceProp","onceDetectAppearanceByBridge","useRef","current","appearance","useState","useEffect","isEmbedded"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,OAAOC,cAIA,uBAAuB;AAC9B,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,iBAAiB,QAA4B,wBAAwB;AAC9E,SAASC,MAAM,QAAQ,aAAa;AACpC,SAASC,yBAAyB,EAAEC,4BAA4B,QAAQ,oBAAoB;AAE5F,IAAIC,oBAA2C;AAE/CN,SACGO,KAAK,qBACLC,KAAK,CAACC;IACLH,oBAAoBJ,kBAAkBO;AACxC,GACCC,MAAMC,QAAQC;AAEjB,SAASC,6BACPC,aAA8C,EAC9CC,0BAAsC;IAEtC,SAASC,eAAeC,CAAsC;QAC5D,MAAM,EAAEC,KAAI,EAAET,KAAI,EAAE,GAAGQ,EAAEE;QAEzB,IAAID,SAAS,wBAAwB;YACnC;QACF;QAEAZ,oBAAoBJ,kBAAkBO;QAEtC,IAAIH,mBAAmB;YACrBS;YACAD,cAAcR;QAChB;IACF;IAEAN,SAASoB,UAAUJ;IAEnB,OAAO,IAAMhB,SAASqB,YAAYL;AACpC;AAEA,SAASM,qBACPC,MAA0B,EAC1BT,aAA8C;IAE9C,MAAMU,aACJD,UAAUA,OAAOE,cAAcF,OAAOE,WAAW;IAEnD,IAAID,eAAeE,WAAW;QAC5B,OAAOzB;IACT;IAEA,MAAM0B,QAAQ,CAACC;QACb,oDAAoD;QACpDd,cAAcc,MAAMC,UAAU,SAAS;IACzC;IAEAF,MAAMH;IACNpB,0BAA0BoB,YAAYG;IAEtC,OAAO,IAAMtB,6BAA6BmB,YAAYG;AACxD;AAEA,OAAO,MAAMG,0BAA0B,CACrCC,gBACAhB;IAEA,MAAM,EAAEQ,OAAM,EAAE,GAAGpB;IACnB,MAAM6B,+BAA+BjC,MAAMkC,OAAO;QAChDlB,8BAA8BA;QAC9BiB,6BAA6BE,UAAUjC;IACzC;IAEA,MAAM,CAACkC,YAAYrB,cAAc,GAAGf,MAAMqC,SAAyB;QACjE,IAAIL,gBAAgB;YAClB,OAAOA;QACT;QAEA,IAAIzB,mBAAmB;YACrB0B,6BAA6BE;YAC7B,OAAO5B;QACT;QAEA,MAAMkB,aACJD,UAAUA,OAAOE,cAAcF,OAAOE,WAAW;QAEnD,oDAAoD;QACpD,OAAOD,YAAYK,UAAU,SAAS;IACxC;IAEA9B,MAAMsC,UAAU;QACd,IAAIN,gBAAgB;YAClBjB,cAAciB;YACd,OAAO9B;QACT;QAEA,IAAID,SAASsC,cAAc;YACzB,OAAOzB,6BAA6BC,eAAekB,6BAA6BE;QAClF;QAEA,OAAOZ,qBAAqBC,QAAQT;IACtC,GAAG;QAACS;QAAQQ;KAAe;IAE3B,OAAOI;AACT,EAAE"}
+{"version":3,"sources":["../../../src/hooks/useAutoDetectAppearance.tsx"],"sourcesContent":["import * as React from 'react';\nimport vkBridge, {\n  AnyReceiveMethodName,\n  AppearanceType,\n  VKBridgeEvent,\n} from '@vkontakte/vk-bridge';\nimport { noop } from '@vkontakte/vkjs';\nimport { resolveAppearance, VKBridgeConfigData } from '../helpers/appearance';\nimport { useDOM } from '../lib/dom';\nimport { matchMediaListAddListener, matchMediaListRemoveListener } from '../lib/matchMedia';\n\nfunction autoDetectAppearanceByBridge(\n  setAppearance: (value: AppearanceType) => void,\n  onDetectAppearanceByBridge: () => void,\n) {\n  function updateAppearance(data: VKBridgeConfigData) {\n    const initialAppearance = resolveAppearance(data);\n\n    if (initialAppearance) {\n      onDetectAppearanceByBridge();\n      setAppearance(initialAppearance);\n    }\n  }\n\n  function bridgeListener(e: VKBridgeEvent<AnyReceiveMethodName>) {\n    const { type, data } = e.detail;\n\n    if (type !== 'VKWebAppUpdateConfig') {\n      return;\n    }\n\n    updateAppearance(data as VKBridgeConfigData);\n  }\n\n  vkBridge.subscribe(bridgeListener);\n  vkBridge.send('VKWebAppGetConfig').then(updateAppearance).catch(console.error);\n\n  return () => vkBridge.unsubscribe(bridgeListener);\n}\n\nfunction autoDetectAppearance(\n  window: Window | undefined,\n  setAppearance: (value: AppearanceType) => void,\n): () => void {\n  const mediaQuery =\n    window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');\n\n  if (mediaQuery === undefined) {\n    return noop;\n  }\n\n  const check = (event: MediaQueryList | MediaQueryListEvent) => {\n    // eslint-disable-next-line no-restricted-properties\n    setAppearance(event.matches ? 'dark' : 'light');\n  };\n\n  check(mediaQuery);\n  matchMediaListAddListener(mediaQuery, check);\n\n  return () => matchMediaListRemoveListener(mediaQuery, check);\n}\n\nexport const useAutoDetectAppearance = (\n  appearanceProp?: AppearanceType,\n  onDetectAppearanceByBridge?: () => void,\n): AppearanceType => {\n  const { window } = useDOM();\n  const onceDetectAppearanceByBridge = React.useRef(() => {\n    onDetectAppearanceByBridge && onDetectAppearanceByBridge();\n    onceDetectAppearanceByBridge.current = noop;\n  });\n\n  const [appearance, setAppearance] = React.useState<AppearanceType>(() => {\n    if (appearanceProp) {\n      return appearanceProp;\n    }\n\n    const mediaQuery =\n      window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');\n\n    // eslint-disable-next-line no-restricted-properties\n    return mediaQuery?.matches ? 'dark' : 'light';\n  });\n\n  React.useEffect(() => {\n    if (appearanceProp) {\n      setAppearance(appearanceProp);\n      return noop;\n    }\n\n    if (vkBridge.isEmbedded()) {\n      return autoDetectAppearanceByBridge(setAppearance, onceDetectAppearanceByBridge.current);\n    }\n\n    return autoDetectAppearance(window, setAppearance);\n  }, [window, appearanceProp]);\n\n  return appearance;\n};\n"],"names":["React","vkBridge","noop","resolveAppearance","useDOM","matchMediaListAddListener","matchMediaListRemoveListener","autoDetectAppearanceByBridge","setAppearance","onDetectAppearanceByBridge","updateAppearance","data","initialAppearance","bridgeListener","e","type","detail","subscribe","send","then","catch","console","error","unsubscribe","autoDetectAppearance","window","mediaQuery","matchMedia","undefined","check","event","matches","useAutoDetectAppearance","appearanceProp","onceDetectAppearanceByBridge","useRef","current","appearance","useState","useEffect","isEmbedded"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,OAAOC,cAIA,uBAAuB;AAC9B,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,iBAAiB,QAA4B,wBAAwB;AAC9E,SAASC,MAAM,QAAQ,aAAa;AACpC,SAASC,yBAAyB,EAAEC,4BAA4B,QAAQ,oBAAoB;AAE5F,SAASC,6BACPC,aAA8C,EAC9CC,0BAAsC;IAEtC,SAASC,iBAAiBC,IAAwB;QAChD,MAAMC,oBAAoBT,kBAAkBQ;QAE5C,IAAIC,mBAAmB;YACrBH;YACAD,cAAcI;QAChB;IACF;IAEA,SAASC,eAAeC,CAAsC;QAC5D,MAAM,EAAEC,KAAI,EAAEJ,KAAI,EAAE,GAAGG,EAAEE;QAEzB,IAAID,SAAS,wBAAwB;YACnC;QACF;QAEAL,iBAAiBC;IACnB;IAEAV,SAASgB,UAAUJ;IACnBZ,SAASiB,KAAK,qBAAqBC,KAAKT,kBAAkBU,MAAMC,QAAQC;IAExE,OAAO,IAAMrB,SAASsB,YAAYV;AACpC;AAEA,SAASW,qBACPC,MAA0B,EAC1BjB,aAA8C;IAE9C,MAAMkB,aACJD,UAAUA,OAAOE,cAAcF,OAAOE,WAAW;IAEnD,IAAID,eAAeE,WAAW;QAC5B,OAAO1B;IACT;IAEA,MAAM2B,QAAQ,CAACC;QACb,oDAAoD;QACpDtB,cAAcsB,MAAMC,UAAU,SAAS;IACzC;IAEAF,MAAMH;IACNrB,0BAA0BqB,YAAYG;IAEtC,OAAO,IAAMvB,6BAA6BoB,YAAYG;AACxD;AAEA,OAAO,MAAMG,0BAA0B,CACrCC,gBACAxB;IAEA,MAAM,EAAEgB,OAAM,EAAE,GAAGrB;IACnB,MAAM8B,+BAA+BlC,MAAMmC,OAAO;QAChD1B,8BAA8BA;QAC9ByB,6BAA6BE,UAAUlC;IACzC;IAEA,MAAM,CAACmC,YAAY7B,cAAc,GAAGR,MAAMsC,SAAyB;QACjE,IAAIL,gBAAgB;YAClB,OAAOA;QACT;QAEA,MAAMP,aACJD,UAAUA,OAAOE,cAAcF,OAAOE,WAAW;QAEnD,oDAAoD;QACpD,OAAOD,YAAYK,UAAU,SAAS;IACxC;IAEA/B,MAAMuC,UAAU;QACd,IAAIN,gBAAgB;YAClBzB,cAAcyB;YACd,OAAO/B;QACT;QAEA,IAAID,SAASuC,cAAc;YACzB,OAAOjC,6BAA6BC,eAAe0B,6BAA6BE;QAClF;QAEA,OAAOZ,qBAAqBC,QAAQjB;IACtC,GAAG;QAACiB;QAAQQ;KAAe;IAE3B,OAAOI;AACT,EAAE"}

package/dist/cssm/lib/platform.d.ts

@@ -1,8 +1,9 @@
+import { LiteralUnion } from '../types';
 import { BrowserInfo } from './browser';
 export declare enum Platform {
     ANDROID = "android",
     IOS = "ios",
     VKCOM = "vkcom"
 }
-export type PlatformType = Platform.ANDROID | Platform.IOS | Platform.VKCOM | string;
+export type PlatformType = LiteralUnion<'android' | 'ios' | 'vkcom', string>;
 export declare function platform(browserInfo?: BrowserInfo): PlatformType;

package/dist/cssm/lib/platform.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/lib/platform.ts"],"sourcesContent":["import { querystring } from '@vkontakte/vkjs';\nimport { BrowserInfo, computeBrowserInfo } from './browser';\nimport { canUseDOM } from './dom';\n\nexport enum Platform {\n  ANDROID = 'android',\n  IOS = 'ios',\n  VKCOM = 'vkcom',\n}\n\nconst PLATFORM_ALIAS = {\n  desktop_web: Platform.VKCOM,\n};\n\nfunction isPlatformAlias(platformAlias: string): platformAlias is keyof typeof PLATFORM_ALIAS {\n  return platformAlias in PLATFORM_ALIAS;\n}\n\n/**\n * Значение, которое передаётся в качестве query-параметра при открытии VK Mini Apps\n * @see {@link https://dev.vk.com/mini-apps/development/launch-params#vk_platform vk_platform}\n */\nfunction getPlatformByQueryString(queryString: string): Platform | undefined {\n  try {\n    const parsedQuery = querystring.parse(queryString);\n    const platformAliasByQuery = parsedQuery['vk_platform'];\n\n    return typeof platformAliasByQuery === 'string' && isPlatformAlias(platformAliasByQuery)\n      ? PLATFORM_ALIAS[platformAliasByQuery]\n      : undefined;\n  } catch (e) {\n    console.warn(e);\n\n    return undefined;\n  }\n}\n\nconst platformByQueryString = canUseDOM ? getPlatformByQueryString(location.search) : undefined;\n\nexport type PlatformType = Platform.ANDROID | Platform.IOS | Platform.VKCOM | string;\n\nexport function platform(browserInfo?: BrowserInfo): PlatformType {\n  if (platformByQueryString) {\n    return platformByQueryString;\n  }\n\n  if (!browserInfo) {\n    browserInfo = computeBrowserInfo();\n  }\n\n  return browserInfo.system === 'ios' ? Platform.IOS : Platform.ANDROID;\n}\n"],"names":["querystring","computeBrowserInfo","canUseDOM","Platform","ANDROID","IOS","VKCOM","PLATFORM_ALIAS","desktop_web","isPlatformAlias","platformAlias","getPlatformByQueryString","queryString","parsedQuery","parse","platformAliasByQuery","undefined","e","console","warn","platformByQueryString","location","search","platform","browserInfo","system"],"mappings":"AAAA,SAASA,WAAW,QAAQ,kBAAkB;AAC9C,SAAsBC,kBAAkB,QAAQ,YAAY;AAC5D,SAASC,SAAS,QAAQ,QAAQ;WAE3B;UAAKC,QAAQ;IAARA,SACVC,aAAU;IADAD,SAEVE,SAAM;IAFIF,SAGVG,WAAQ;GAHEH,aAAAA;AAMZ,MAAMI,iBAAiB;IACrBC,aAAaL,SAASG;AACxB;AAEA,SAASG,gBAAgBC,aAAqB;IAC5C,OAAOA,iBAAiBH;AAC1B;AAEA;;;CAGC,GACD,SAASI,yBAAyBC,WAAmB;IACnD,IAAI;QACF,MAAMC,cAAcb,YAAYc,MAAMF;QACtC,MAAMG,uBAAuBF,WAAW,CAAC,cAAc;QAEvD,OAAO,OAAOE,yBAAyB,YAAYN,gBAAgBM,wBAC/DR,cAAc,CAACQ,qBAAqB,GACpCC;IACN,EAAE,OAAOC,GAAG;QACVC,QAAQC,KAAKF;QAEb,OAAOD;IACT;AACF;AAEA,MAAMI,wBAAwBlB,YAAYS,yBAAyBU,SAASC,UAAUN;AAItF,OAAO,SAASO,SAASC,WAAyB;IAChD,IAAIJ,uBAAuB;QACzB,OAAOA;IACT;IAEA,IAAI,CAACI,aAAa;QAChBA,cAAcvB;IAChB;IAEA,OAAOuB,YAAYC,WAAW,QAAQtB,SAASE,MAAMF,SAASC;AAChE"}
+{"version":3,"sources":["../../../src/lib/platform.ts"],"sourcesContent":["import { querystring } from '@vkontakte/vkjs';\nimport { LiteralUnion } from '../types';\nimport { BrowserInfo, computeBrowserInfo } from './browser';\nimport { canUseDOM } from './dom';\n\nexport enum Platform {\n  ANDROID = 'android',\n  IOS = 'ios',\n  VKCOM = 'vkcom',\n}\n\nconst PLATFORM_ALIAS = {\n  desktop_web: Platform.VKCOM,\n};\n\nfunction isPlatformAlias(platformAlias: string): platformAlias is keyof typeof PLATFORM_ALIAS {\n  return platformAlias in PLATFORM_ALIAS;\n}\n\n/**\n * Значение, которое передаётся в качестве query-параметра при открытии VK Mini Apps\n * @see {@link https://dev.vk.com/mini-apps/development/launch-params#vk_platform vk_platform}\n */\nfunction getPlatformByQueryString(queryString: string): Platform | undefined {\n  try {\n    const parsedQuery = querystring.parse(queryString);\n    const platformAliasByQuery = parsedQuery['vk_platform'];\n\n    return typeof platformAliasByQuery === 'string' && isPlatformAlias(platformAliasByQuery)\n      ? PLATFORM_ALIAS[platformAliasByQuery]\n      : undefined;\n  } catch (e) {\n    console.warn(e);\n\n    return undefined;\n  }\n}\n\nconst platformByQueryString = canUseDOM ? getPlatformByQueryString(location.search) : undefined;\n\nexport type PlatformType = LiteralUnion<'android' | 'ios' | 'vkcom', string>;\n\nexport function platform(browserInfo?: BrowserInfo): PlatformType {\n  if (platformByQueryString) {\n    return platformByQueryString;\n  }\n\n  if (!browserInfo) {\n    browserInfo = computeBrowserInfo();\n  }\n\n  return browserInfo.system === 'ios' ? Platform.IOS : Platform.ANDROID;\n}\n"],"names":["querystring","computeBrowserInfo","canUseDOM","Platform","ANDROID","IOS","VKCOM","PLATFORM_ALIAS","desktop_web","isPlatformAlias","platformAlias","getPlatformByQueryString","queryString","parsedQuery","parse","platformAliasByQuery","undefined","e","console","warn","platformByQueryString","location","search","platform","browserInfo","system"],"mappings":"AAAA,SAASA,WAAW,QAAQ,kBAAkB;AAE9C,SAAsBC,kBAAkB,QAAQ,YAAY;AAC5D,SAASC,SAAS,QAAQ,QAAQ;WAE3B;UAAKC,QAAQ;IAARA,SACVC,aAAU;IADAD,SAEVE,SAAM;IAFIF,SAGVG,WAAQ;GAHEH,aAAAA;AAMZ,MAAMI,iBAAiB;IACrBC,aAAaL,SAASG;AACxB;AAEA,SAASG,gBAAgBC,aAAqB;IAC5C,OAAOA,iBAAiBH;AAC1B;AAEA;;;CAGC,GACD,SAASI,yBAAyBC,WAAmB;IACnD,IAAI;QACF,MAAMC,cAAcb,YAAYc,MAAMF;QACtC,MAAMG,uBAAuBF,WAAW,CAAC,cAAc;QAEvD,OAAO,OAAOE,yBAAyB,YAAYN,gBAAgBM,wBAC/DR,cAAc,CAACQ,qBAAqB,GACpCC;IACN,EAAE,OAAOC,GAAG;QACVC,QAAQC,KAAKF;QAEb,OAAOD;IACT;AACF;AAEA,MAAMI,wBAAwBlB,YAAYS,yBAAyBU,SAASC,UAAUN;AAItF,OAAO,SAASO,SAASC,WAAyB;IAChD,IAAIJ,uBAAuB;QACzB,OAAOA;IACT;IAEA,IAAI,CAACI,aAAa;QAChBA,cAAcvB;IAChB;IAEA,OAAOuB,YAAYC,WAAW,QAAQtB,SAASE,MAAMF,SAASC;AAChE"}

package/dist/cssm/styles/constants.css

@@ -58,6 +58,9 @@
   --vkui_internal--z_index_image_base_overlay: 0;
   --vkui_internal--z_index_image_base_border: 1;
   --vkui_internal--z_index_image_base_badge: 2;
+
+  /* z_index HorizontalScroll isolate */
+  --vkui_internal--z_index_horizontal_scroll_arrow: 1;
 }
 @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
   /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */

package/dist/cssm/types.d.ts

@@ -54,3 +54,15 @@ export type Exact<A, B> = A extends B ? B : never;
  * Для возможности указывать css custom properties
  */
 export type CSSCustomProperties<T extends string | undefined = string> = Record<`--${string}`, T>;
+interface Nothing {
+}
+/**
+ * Автозаполнение для типов
+ *
+ * @example
+ * LiteralUnion<'foo' | 'bar', string>
+ *
+ * @see {@link https://github.com/microsoft/TypeScript/issues/29729}
+ */
+export type LiteralUnion<Union, Type> = Union | (Type & Nothing);
+export {};

package/dist/cssm/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Insets } from '@vkontakte/vk-bridge';\nimport { PlatformType } from './lib/platform';\n\nexport type AnyFunction = (...args: any[]) => any;\n\nexport type AlignType = 'left' | 'center' | 'right';\n\nexport interface HasChildren {\n  children?: React.ReactNode;\n}\n\nexport type HasDataAttribute = Record<\n  `data-${string}`,\n  string | number | boolean | undefined | null\n>;\n\nexport interface HasRootRef<T> {\n  getRootRef?: React.Ref<T>;\n}\n\nexport interface HasRef<T> {\n  getRef?: React.Ref<T>;\n}\n\nexport interface HasComponent {\n  Component?: React.ElementType;\n}\n\nexport interface HasAlign {\n  align?: AlignType;\n}\n\nexport interface HasPlatform {\n  /**\n   * @ignore\n   */\n  platform?: PlatformType;\n}\n\nexport interface HasInsets {\n  /**\n   * @ignore\n   */\n  insets?: Partial<Insets>;\n}\n\nexport interface Version {\n  major: number;\n  minor?: number;\n  patch?: number;\n}\n\n/**\n * Тип содержит атрибуты, которые применяются только для `<a>`\n *\n * @see {@link https://developer.mozilla.org/ru/docs/Web/HTML/Element/A &lt;a&gt; - HTML | MDN}\n */\nexport type AnchorHTMLAttributesOnly = Omit<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  keyof React.HTMLAttributes<HTMLAnchorElement>\n>;\n\n/**\n * Проверяет, является ли тип подтипом другого.\n *\n * В TS не реализовано.\n *\n * @see {@link https://github.com/microsoft/TypeScript/issues/12936}\n */\nexport type Exact<A, B> = A extends B ? B : never;\n\n/**\n * Для возможности указывать css custom properties\n */\nexport type CSSCustomProperties<T extends string | undefined = string> = Record<`--${string}`, T>;\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["../../src/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Insets } from '@vkontakte/vk-bridge';\nimport { PlatformType } from './lib/platform';\n\nexport type AnyFunction = (...args: any[]) => any;\n\nexport type AlignType = 'left' | 'center' | 'right';\n\nexport interface HasChildren {\n  children?: React.ReactNode;\n}\n\nexport type HasDataAttribute = Record<\n  `data-${string}`,\n  string | number | boolean | undefined | null\n>;\n\nexport interface HasRootRef<T> {\n  getRootRef?: React.Ref<T>;\n}\n\nexport interface HasRef<T> {\n  getRef?: React.Ref<T>;\n}\n\nexport interface HasComponent {\n  Component?: React.ElementType;\n}\n\nexport interface HasAlign {\n  align?: AlignType;\n}\n\nexport interface HasPlatform {\n  /**\n   * @ignore\n   */\n  platform?: PlatformType;\n}\n\nexport interface HasInsets {\n  /**\n   * @ignore\n   */\n  insets?: Partial<Insets>;\n}\n\nexport interface Version {\n  major: number;\n  minor?: number;\n  patch?: number;\n}\n\n/**\n * Тип содержит атрибуты, которые применяются только для `<a>`\n *\n * @see {@link https://developer.mozilla.org/ru/docs/Web/HTML/Element/A &lt;a&gt; - HTML | MDN}\n */\nexport type AnchorHTMLAttributesOnly = Omit<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  keyof React.HTMLAttributes<HTMLAnchorElement>\n>;\n\n/**\n * Проверяет, является ли тип подтипом другого.\n *\n * В TS не реализовано.\n *\n * @see {@link https://github.com/microsoft/TypeScript/issues/12936}\n */\nexport type Exact<A, B> = A extends B ? B : never;\n\n/**\n * Для возможности указывать css custom properties\n */\nexport type CSSCustomProperties<T extends string | undefined = string> = Record<`--${string}`, T>;\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface Nothing {}\n\n/**\n * Автозаполнение для типов\n *\n * @example\n * LiteralUnion<'foo' | 'bar', string>\n *\n * @see {@link https://github.com/microsoft/TypeScript/issues/29729}\n */\nexport type LiteralUnion<Union, Type> = Union | (Type & Nothing);\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

package/dist/hooks/useAutoDetectAppearance.js

@@ -5,23 +5,23 @@ import { noop } from "@vkontakte/vkjs";
 import { resolveAppearance } from "../helpers/appearance";
 import { useDOM } from "../lib/dom";
 import { matchMediaListAddListener, matchMediaListRemoveListener } from "../lib/matchMedia";
-var initialAppearance = null;
-vkBridge.send("VKWebAppGetConfig").then(function(data) {
-    initialAppearance = resolveAppearance(data);
-}).catch(console.error);
 function autoDetectAppearanceByBridge(setAppearance, onDetectAppearanceByBridge) {
+    var updateAppearance = function updateAppearance(data) {
+        var initialAppearance = resolveAppearance(data);
+        if (initialAppearance) {
+            onDetectAppearanceByBridge();
+            setAppearance(initialAppearance);
+        }
+    };
     var bridgeListener = function bridgeListener(e) {
         var _e_detail = e.detail, type = _e_detail.type, data = _e_detail.data;
         if (type !== "VKWebAppUpdateConfig") {
             return;
         }
-        initialAppearance = resolveAppearance(data);
-        if (initialAppearance) {
-            onDetectAppearanceByBridge();
-            setAppearance(initialAppearance);
-        }
+        updateAppearance(data);
     };
     vkBridge.subscribe(bridgeListener);
+    vkBridge.send("VKWebAppGetConfig").then(updateAppearance).catch(console.error);
     return function() {
         return vkBridge.unsubscribe(bridgeListener);
     };
@@ -51,10 +51,6 @@ export var useAutoDetectAppearance = function(appearanceProp, onDetectAppearance
         if (appearanceProp) {
             return appearanceProp;
         }
-        if (initialAppearance) {
-            onceDetectAppearanceByBridge.current();
-            return initialAppearance;
-        }
         var mediaQuery = window && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)");
         // eslint-disable-next-line no-restricted-properties
         return (mediaQuery === null || mediaQuery === void 0 ? void 0 : mediaQuery.matches) ? "dark" : "light";

package/dist/hooks/useAutoDetectAppearance.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useAutoDetectAppearance.tsx"],"sourcesContent":["import * as React from 'react';\nimport vkBridge, {\n  AnyReceiveMethodName,\n  AppearanceType,\n  VKBridgeEvent,\n} from '@vkontakte/vk-bridge';\nimport { noop } from '@vkontakte/vkjs';\nimport { resolveAppearance, VKBridgeConfigData } from '../helpers/appearance';\nimport { useDOM } from '../lib/dom';\nimport { matchMediaListAddListener, matchMediaListRemoveListener } from '../lib/matchMedia';\n\nlet initialAppearance: AppearanceType | null = null;\n\nvkBridge\n  .send('VKWebAppGetConfig')\n  .then((data) => {\n    initialAppearance = resolveAppearance(data);\n  })\n  .catch(console.error);\n\nfunction autoDetectAppearanceByBridge(\n  setAppearance: (value: AppearanceType) => void,\n  onDetectAppearanceByBridge: () => void,\n) {\n  function bridgeListener(e: VKBridgeEvent<AnyReceiveMethodName>) {\n    const { type, data } = e.detail;\n\n    if (type !== 'VKWebAppUpdateConfig') {\n      return;\n    }\n\n    initialAppearance = resolveAppearance(data as VKBridgeConfigData);\n\n    if (initialAppearance) {\n      onDetectAppearanceByBridge();\n      setAppearance(initialAppearance);\n    }\n  }\n\n  vkBridge.subscribe(bridgeListener);\n\n  return () => vkBridge.unsubscribe(bridgeListener);\n}\n\nfunction autoDetectAppearance(\n  window: Window | undefined,\n  setAppearance: (value: AppearanceType) => void,\n): () => void {\n  const mediaQuery =\n    window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');\n\n  if (mediaQuery === undefined) {\n    return noop;\n  }\n\n  const check = (event: MediaQueryList | MediaQueryListEvent) => {\n    // eslint-disable-next-line no-restricted-properties\n    setAppearance(event.matches ? 'dark' : 'light');\n  };\n\n  check(mediaQuery);\n  matchMediaListAddListener(mediaQuery, check);\n\n  return () => matchMediaListRemoveListener(mediaQuery, check);\n}\n\nexport const useAutoDetectAppearance = (\n  appearanceProp?: AppearanceType,\n  onDetectAppearanceByBridge?: () => void,\n): AppearanceType => {\n  const { window } = useDOM();\n  const onceDetectAppearanceByBridge = React.useRef(() => {\n    onDetectAppearanceByBridge && onDetectAppearanceByBridge();\n    onceDetectAppearanceByBridge.current = noop;\n  });\n\n  const [appearance, setAppearance] = React.useState<AppearanceType>(() => {\n    if (appearanceProp) {\n      return appearanceProp;\n    }\n\n    if (initialAppearance) {\n      onceDetectAppearanceByBridge.current();\n      return initialAppearance;\n    }\n\n    const mediaQuery =\n      window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');\n\n    // eslint-disable-next-line no-restricted-properties\n    return mediaQuery?.matches ? 'dark' : 'light';\n  });\n\n  React.useEffect(() => {\n    if (appearanceProp) {\n      setAppearance(appearanceProp);\n      return noop;\n    }\n\n    if (vkBridge.isEmbedded()) {\n      return autoDetectAppearanceByBridge(setAppearance, onceDetectAppearanceByBridge.current);\n    }\n\n    return autoDetectAppearance(window, setAppearance);\n  }, [window, appearanceProp]);\n\n  return appearance;\n};\n"],"names":["React","vkBridge","noop","resolveAppearance","useDOM","matchMediaListAddListener","matchMediaListRemoveListener","initialAppearance","send","then","data","catch","console","error","autoDetectAppearanceByBridge","setAppearance","onDetectAppearanceByBridge","bridgeListener","e","detail","type","subscribe","unsubscribe","autoDetectAppearance","window","mediaQuery","matchMedia","undefined","check","event","matches","useAutoDetectAppearance","appearanceProp","onceDetectAppearanceByBridge","useRef","current","useState","appearance","useEffect","isEmbedded"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,OAAOC,cAIA,uBAAuB;AAC9B,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,iBAAiB,QAA4B,wBAAwB;AAC9E,SAASC,MAAM,QAAQ,aAAa;AACpC,SAASC,yBAAyB,EAAEC,4BAA4B,QAAQ,oBAAoB;AAE5F,IAAIC,oBAA2C;AAE/CN,SACGO,KAAK,qBACLC,KAAK,SAACC;IACLH,oBAAoBJ,kBAAkBO;AACxC,GACCC,MAAMC,QAAQC;AAEjB,SAASC,6BACPC,aAA8C,EAC9CC,0BAAsC;QAE7BC,iBAAT,SAASA,eAAeC,CAAsC;QAC5D,IAAuBA,YAAAA,EAAEC,QAAjBC,OAAeF,UAAfE,MAAMV,OAASQ,UAATR;QAEd,IAAIU,SAAS,wBAAwB;YACnC;QACF;QAEAb,oBAAoBJ,kBAAkBO;QAEtC,IAAIH,mBAAmB;YACrBS;YACAD,cAAcR;QAChB;IACF;IAEAN,SAASoB,UAAUJ;IAEnB,OAAO;eAAMhB,SAASqB,YAAYL;;AACpC;AAEA,SAASM,qBACPC,MAA0B,EAC1BT,aAA8C;IAE9C,IAAMU,aACJD,UAAUA,OAAOE,cAAcF,OAAOE,WAAW;IAEnD,IAAID,eAAeE,WAAW;QAC5B,OAAOzB;IACT;IAEA,IAAM0B,QAAQ,SAACC;QACb,oDAAoD;QACpDd,cAAcc,MAAMC,UAAU,SAAS;IACzC;IAEAF,MAAMH;IACNpB,0BAA0BoB,YAAYG;IAEtC,OAAO;eAAMtB,6BAA6BmB,YAAYG;;AACxD;AAEA,OAAO,IAAMG,0BAA0B,SACrCC,gBACAhB;IAEA,IAAM,AAAEQ,SAAWpB,SAAXoB;IACR,IAAMS,+BAA+BjC,MAAMkC,OAAO;QAChDlB,8BAA8BA;QAC9BiB,6BAA6BE,UAAUjC;IACzC;IAEA,IAAoCF,mCAAAA,MAAMoC,SAAyB;QACjE,IAAIJ,gBAAgB;YAClB,OAAOA;QACT;QAEA,IAAIzB,mBAAmB;YACrB0B,6BAA6BE;YAC7B,OAAO5B;QACT;QAEA,IAAMkB,aACJD,UAAUA,OAAOE,cAAcF,OAAOE,WAAW;QAEnD,oDAAoD;QACpD,OAAOD,CAAAA,uBAAAA,wBAAAA,KAAAA,IAAAA,WAAYK,OAAM,IAAI,SAAS;IACxC,QAfOO,aAA6BrC,oBAAjBe,gBAAiBf;IAiBpCA,MAAMsC,UAAU;QACd,IAAIN,gBAAgB;YAClBjB,cAAciB;YACd,OAAO9B;QACT;QAEA,IAAID,SAASsC,cAAc;YACzB,OAAOzB,6BAA6BC,eAAekB,6BAA6BE;QAClF;QAEA,OAAOZ,qBAAqBC,QAAQT;IACtC,GAAG;QAACS;QAAQQ;KAAe;IAE3B,OAAOK;AACT,EAAE"}
+{"version":3,"sources":["../../src/hooks/useAutoDetectAppearance.tsx"],"sourcesContent":["import * as React from 'react';\nimport vkBridge, {\n  AnyReceiveMethodName,\n  AppearanceType,\n  VKBridgeEvent,\n} from '@vkontakte/vk-bridge';\nimport { noop } from '@vkontakte/vkjs';\nimport { resolveAppearance, VKBridgeConfigData } from '../helpers/appearance';\nimport { useDOM } from '../lib/dom';\nimport { matchMediaListAddListener, matchMediaListRemoveListener } from '../lib/matchMedia';\n\nfunction autoDetectAppearanceByBridge(\n  setAppearance: (value: AppearanceType) => void,\n  onDetectAppearanceByBridge: () => void,\n) {\n  function updateAppearance(data: VKBridgeConfigData) {\n    const initialAppearance = resolveAppearance(data);\n\n    if (initialAppearance) {\n      onDetectAppearanceByBridge();\n      setAppearance(initialAppearance);\n    }\n  }\n\n  function bridgeListener(e: VKBridgeEvent<AnyReceiveMethodName>) {\n    const { type, data } = e.detail;\n\n    if (type !== 'VKWebAppUpdateConfig') {\n      return;\n    }\n\n    updateAppearance(data as VKBridgeConfigData);\n  }\n\n  vkBridge.subscribe(bridgeListener);\n  vkBridge.send('VKWebAppGetConfig').then(updateAppearance).catch(console.error);\n\n  return () => vkBridge.unsubscribe(bridgeListener);\n}\n\nfunction autoDetectAppearance(\n  window: Window | undefined,\n  setAppearance: (value: AppearanceType) => void,\n): () => void {\n  const mediaQuery =\n    window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');\n\n  if (mediaQuery === undefined) {\n    return noop;\n  }\n\n  const check = (event: MediaQueryList | MediaQueryListEvent) => {\n    // eslint-disable-next-line no-restricted-properties\n    setAppearance(event.matches ? 'dark' : 'light');\n  };\n\n  check(mediaQuery);\n  matchMediaListAddListener(mediaQuery, check);\n\n  return () => matchMediaListRemoveListener(mediaQuery, check);\n}\n\nexport const useAutoDetectAppearance = (\n  appearanceProp?: AppearanceType,\n  onDetectAppearanceByBridge?: () => void,\n): AppearanceType => {\n  const { window } = useDOM();\n  const onceDetectAppearanceByBridge = React.useRef(() => {\n    onDetectAppearanceByBridge && onDetectAppearanceByBridge();\n    onceDetectAppearanceByBridge.current = noop;\n  });\n\n  const [appearance, setAppearance] = React.useState<AppearanceType>(() => {\n    if (appearanceProp) {\n      return appearanceProp;\n    }\n\n    const mediaQuery =\n      window && window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)');\n\n    // eslint-disable-next-line no-restricted-properties\n    return mediaQuery?.matches ? 'dark' : 'light';\n  });\n\n  React.useEffect(() => {\n    if (appearanceProp) {\n      setAppearance(appearanceProp);\n      return noop;\n    }\n\n    if (vkBridge.isEmbedded()) {\n      return autoDetectAppearanceByBridge(setAppearance, onceDetectAppearanceByBridge.current);\n    }\n\n    return autoDetectAppearance(window, setAppearance);\n  }, [window, appearanceProp]);\n\n  return appearance;\n};\n"],"names":["React","vkBridge","noop","resolveAppearance","useDOM","matchMediaListAddListener","matchMediaListRemoveListener","autoDetectAppearanceByBridge","setAppearance","onDetectAppearanceByBridge","updateAppearance","data","initialAppearance","bridgeListener","e","detail","type","subscribe","send","then","catch","console","error","unsubscribe","autoDetectAppearance","window","mediaQuery","matchMedia","undefined","check","event","matches","useAutoDetectAppearance","appearanceProp","onceDetectAppearanceByBridge","useRef","current","useState","appearance","useEffect","isEmbedded"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,OAAOC,cAIA,uBAAuB;AAC9B,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,iBAAiB,QAA4B,wBAAwB;AAC9E,SAASC,MAAM,QAAQ,aAAa;AACpC,SAASC,yBAAyB,EAAEC,4BAA4B,QAAQ,oBAAoB;AAE5F,SAASC,6BACPC,aAA8C,EAC9CC,0BAAsC;QAE7BC,mBAAT,SAASA,iBAAiBC,IAAwB;QAChD,IAAMC,oBAAoBT,kBAAkBQ;QAE5C,IAAIC,mBAAmB;YACrBH;YACAD,cAAcI;QAChB;IACF;QAESC,iBAAT,SAASA,eAAeC,CAAsC;QAC5D,IAAuBA,YAAAA,EAAEC,QAAjBC,OAAeF,UAAfE,MAAML,OAASG,UAATH;QAEd,IAAIK,SAAS,wBAAwB;YACnC;QACF;QAEAN,iBAAiBC;IACnB;IAEAV,SAASgB,UAAUJ;IACnBZ,SAASiB,KAAK,qBAAqBC,KAAKT,kBAAkBU,MAAMC,QAAQC;IAExE,OAAO;eAAMrB,SAASsB,YAAYV;;AACpC;AAEA,SAASW,qBACPC,MAA0B,EAC1BjB,aAA8C;IAE9C,IAAMkB,aACJD,UAAUA,OAAOE,cAAcF,OAAOE,WAAW;IAEnD,IAAID,eAAeE,WAAW;QAC5B,OAAO1B;IACT;IAEA,IAAM2B,QAAQ,SAACC;QACb,oDAAoD;QACpDtB,cAAcsB,MAAMC,UAAU,SAAS;IACzC;IAEAF,MAAMH;IACNrB,0BAA0BqB,YAAYG;IAEtC,OAAO;eAAMvB,6BAA6BoB,YAAYG;;AACxD;AAEA,OAAO,IAAMG,0BAA0B,SACrCC,gBACAxB;IAEA,IAAM,AAAEgB,SAAWrB,SAAXqB;IACR,IAAMS,+BAA+BlC,MAAMmC,OAAO;QAChD1B,8BAA8BA;QAC9ByB,6BAA6BE,UAAUlC;IACzC;IAEA,IAAoCF,mCAAAA,MAAMqC,SAAyB;QACjE,IAAIJ,gBAAgB;YAClB,OAAOA;QACT;QAEA,IAAMP,aACJD,UAAUA,OAAOE,cAAcF,OAAOE,WAAW;QAEnD,oDAAoD;QACpD,OAAOD,CAAAA,uBAAAA,wBAAAA,KAAAA,IAAAA,WAAYK,OAAM,IAAI,SAAS;IACxC,QAVOO,aAA6BtC,oBAAjBQ,gBAAiBR;IAYpCA,MAAMuC,UAAU;QACd,IAAIN,gBAAgB;YAClBzB,cAAcyB;YACd,OAAO/B;QACT;QAEA,IAAID,SAASuC,cAAc;YACzB,OAAOjC,6BAA6BC,eAAe0B,6BAA6BE;QAClF;QAEA,OAAOZ,qBAAqBC,QAAQjB;IACtC,GAAG;QAACiB;QAAQQ;KAAe;IAE3B,OAAOK;AACT,EAAE"}

package/dist/lib/platform.d.ts

@@ -1,8 +1,9 @@
+import { LiteralUnion } from '../types';
 import { BrowserInfo } from './browser';
 export declare enum Platform {
     ANDROID = "android",
     IOS = "ios",
     VKCOM = "vkcom"
 }
-export type PlatformType = Platform.ANDROID | Platform.IOS | Platform.VKCOM | string;
+export type PlatformType = LiteralUnion<'android' | 'ios' | 'vkcom', string>;
 export declare function platform(browserInfo?: BrowserInfo): PlatformType;

package/dist/lib/platform.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/lib/platform.ts"],"sourcesContent":["import { querystring } from '@vkontakte/vkjs';\nimport { BrowserInfo, computeBrowserInfo } from './browser';\nimport { canUseDOM } from './dom';\n\nexport enum Platform {\n  ANDROID = 'android',\n  IOS = 'ios',\n  VKCOM = 'vkcom',\n}\n\nconst PLATFORM_ALIAS = {\n  desktop_web: Platform.VKCOM,\n};\n\nfunction isPlatformAlias(platformAlias: string): platformAlias is keyof typeof PLATFORM_ALIAS {\n  return platformAlias in PLATFORM_ALIAS;\n}\n\n/**\n * Значение, которое передаётся в качестве query-параметра при открытии VK Mini Apps\n * @see {@link https://dev.vk.com/mini-apps/development/launch-params#vk_platform vk_platform}\n */\nfunction getPlatformByQueryString(queryString: string): Platform | undefined {\n  try {\n    const parsedQuery = querystring.parse(queryString);\n    const platformAliasByQuery = parsedQuery['vk_platform'];\n\n    return typeof platformAliasByQuery === 'string' && isPlatformAlias(platformAliasByQuery)\n      ? PLATFORM_ALIAS[platformAliasByQuery]\n      : undefined;\n  } catch (e) {\n    console.warn(e);\n\n    return undefined;\n  }\n}\n\nconst platformByQueryString = canUseDOM ? getPlatformByQueryString(location.search) : undefined;\n\nexport type PlatformType = Platform.ANDROID | Platform.IOS | Platform.VKCOM | string;\n\nexport function platform(browserInfo?: BrowserInfo): PlatformType {\n  if (platformByQueryString) {\n    return platformByQueryString;\n  }\n\n  if (!browserInfo) {\n    browserInfo = computeBrowserInfo();\n  }\n\n  return browserInfo.system === 'ios' ? Platform.IOS : Platform.ANDROID;\n}\n"],"names":["querystring","computeBrowserInfo","canUseDOM","Platform","ANDROID","IOS","VKCOM","PLATFORM_ALIAS","desktop_web","isPlatformAlias","platformAlias","getPlatformByQueryString","queryString","parsedQuery","parse","platformAliasByQuery","undefined","e","console","warn","platformByQueryString","location","search","platform","browserInfo","system"],"mappings":"AAAA,SAASA,WAAW,QAAQ,kBAAkB;AAC9C,SAAsBC,kBAAkB,QAAQ,YAAY;AAC5D,SAASC,SAAS,QAAQ,QAAQ;WAE3B;UAAKC,QAAQ;IAARA,SACVC,aAAU;IADAD,SAEVE,SAAM;IAFIF,SAGVG,WAAQ;GAHEH,aAAAA;AAMZ,IAAMI,iBAAiB;IACrBC,aAAaL,SAASG;AACxB;AAEA,SAASG,gBAAgBC,aAAqB;IAC5C,OAAOA,iBAAiBH;AAC1B;AAEA;;;CAGC,GACD,SAASI,yBAAyBC,WAAmB;IACnD,IAAI;QACF,IAAMC,cAAcb,YAAYc,MAAMF;QACtC,IAAMG,uBAAuBF,WAAW,CAAC,cAAc;QAEvD,OAAO,OAAOE,yBAAyB,YAAYN,gBAAgBM,wBAC/DR,cAAc,CAACQ,qBAAqB,GACpCC;IACN,EAAE,OAAOC,GAAG;QACVC,QAAQC,KAAKF;QAEb,OAAOD;IACT;AACF;AAEA,IAAMI,wBAAwBlB,YAAYS,yBAAyBU,SAASC,UAAUN;AAItF,OAAO,SAASO,SAASC,WAAyB;IAChD,IAAIJ,uBAAuB;QACzB,OAAOA;IACT;IAEA,IAAI,CAACI,aAAa;QAChBA,cAAcvB;IAChB;IAEA,OAAOuB,YAAYC,WAAW,QAAQtB,SAASE,MAAMF,SAASC;AAChE"}
+{"version":3,"sources":["../../src/lib/platform.ts"],"sourcesContent":["import { querystring } from '@vkontakte/vkjs';\nimport { LiteralUnion } from '../types';\nimport { BrowserInfo, computeBrowserInfo } from './browser';\nimport { canUseDOM } from './dom';\n\nexport enum Platform {\n  ANDROID = 'android',\n  IOS = 'ios',\n  VKCOM = 'vkcom',\n}\n\nconst PLATFORM_ALIAS = {\n  desktop_web: Platform.VKCOM,\n};\n\nfunction isPlatformAlias(platformAlias: string): platformAlias is keyof typeof PLATFORM_ALIAS {\n  return platformAlias in PLATFORM_ALIAS;\n}\n\n/**\n * Значение, которое передаётся в качестве query-параметра при открытии VK Mini Apps\n * @see {@link https://dev.vk.com/mini-apps/development/launch-params#vk_platform vk_platform}\n */\nfunction getPlatformByQueryString(queryString: string): Platform | undefined {\n  try {\n    const parsedQuery = querystring.parse(queryString);\n    const platformAliasByQuery = parsedQuery['vk_platform'];\n\n    return typeof platformAliasByQuery === 'string' && isPlatformAlias(platformAliasByQuery)\n      ? PLATFORM_ALIAS[platformAliasByQuery]\n      : undefined;\n  } catch (e) {\n    console.warn(e);\n\n    return undefined;\n  }\n}\n\nconst platformByQueryString = canUseDOM ? getPlatformByQueryString(location.search) : undefined;\n\nexport type PlatformType = LiteralUnion<'android' | 'ios' | 'vkcom', string>;\n\nexport function platform(browserInfo?: BrowserInfo): PlatformType {\n  if (platformByQueryString) {\n    return platformByQueryString;\n  }\n\n  if (!browserInfo) {\n    browserInfo = computeBrowserInfo();\n  }\n\n  return browserInfo.system === 'ios' ? Platform.IOS : Platform.ANDROID;\n}\n"],"names":["querystring","computeBrowserInfo","canUseDOM","Platform","ANDROID","IOS","VKCOM","PLATFORM_ALIAS","desktop_web","isPlatformAlias","platformAlias","getPlatformByQueryString","queryString","parsedQuery","parse","platformAliasByQuery","undefined","e","console","warn","platformByQueryString","location","search","platform","browserInfo","system"],"mappings":"AAAA,SAASA,WAAW,QAAQ,kBAAkB;AAE9C,SAAsBC,kBAAkB,QAAQ,YAAY;AAC5D,SAASC,SAAS,QAAQ,QAAQ;WAE3B;UAAKC,QAAQ;IAARA,SACVC,aAAU;IADAD,SAEVE,SAAM;IAFIF,SAGVG,WAAQ;GAHEH,aAAAA;AAMZ,IAAMI,iBAAiB;IACrBC,aAAaL,SAASG;AACxB;AAEA,SAASG,gBAAgBC,aAAqB;IAC5C,OAAOA,iBAAiBH;AAC1B;AAEA;;;CAGC,GACD,SAASI,yBAAyBC,WAAmB;IACnD,IAAI;QACF,IAAMC,cAAcb,YAAYc,MAAMF;QACtC,IAAMG,uBAAuBF,WAAW,CAAC,cAAc;QAEvD,OAAO,OAAOE,yBAAyB,YAAYN,gBAAgBM,wBAC/DR,cAAc,CAACQ,qBAAqB,GACpCC;IACN,EAAE,OAAOC,GAAG;QACVC,QAAQC,KAAKF;QAEb,OAAOD;IACT;AACF;AAEA,IAAMI,wBAAwBlB,YAAYS,yBAAyBU,SAASC,UAAUN;AAItF,OAAO,SAASO,SAASC,WAAyB;IAChD,IAAIJ,uBAAuB;QACzB,OAAOA;IACT;IAEA,IAAI,CAACI,aAAa;QAChBA,cAAcvB;IAChB;IAEA,OAAOuB,YAAYC,WAAW,QAAQtB,SAASE,MAAMF,SAASC;AAChE"}

package/dist/types.d.ts

@@ -54,3 +54,15 @@ export type Exact<A, B> = A extends B ? B : never;
  * Для возможности указывать css custom properties
  */
 export type CSSCustomProperties<T extends string | undefined = string> = Record<`--${string}`, T>;
+interface Nothing {
+}
+/**
+ * Автозаполнение для типов
+ *
+ * @example
+ * LiteralUnion<'foo' | 'bar', string>
+ *
+ * @see {@link https://github.com/microsoft/TypeScript/issues/29729}
+ */
+export type LiteralUnion<Union, Type> = Union | (Type & Nothing);
+export {};

package/dist/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Insets } from '@vkontakte/vk-bridge';\nimport { PlatformType } from './lib/platform';\n\nexport type AnyFunction = (...args: any[]) => any;\n\nexport type AlignType = 'left' | 'center' | 'right';\n\nexport interface HasChildren {\n  children?: React.ReactNode;\n}\n\nexport type HasDataAttribute = Record<\n  `data-${string}`,\n  string | number | boolean | undefined | null\n>;\n\nexport interface HasRootRef<T> {\n  getRootRef?: React.Ref<T>;\n}\n\nexport interface HasRef<T> {\n  getRef?: React.Ref<T>;\n}\n\nexport interface HasComponent {\n  Component?: React.ElementType;\n}\n\nexport interface HasAlign {\n  align?: AlignType;\n}\n\nexport interface HasPlatform {\n  /**\n   * @ignore\n   */\n  platform?: PlatformType;\n}\n\nexport interface HasInsets {\n  /**\n   * @ignore\n   */\n  insets?: Partial<Insets>;\n}\n\nexport interface Version {\n  major: number;\n  minor?: number;\n  patch?: number;\n}\n\n/**\n * Тип содержит атрибуты, которые применяются только для `<a>`\n *\n * @see {@link https://developer.mozilla.org/ru/docs/Web/HTML/Element/A &lt;a&gt; - HTML | MDN}\n */\nexport type AnchorHTMLAttributesOnly = Omit<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  keyof React.HTMLAttributes<HTMLAnchorElement>\n>;\n\n/**\n * Проверяет, является ли тип подтипом другого.\n *\n * В TS не реализовано.\n *\n * @see {@link https://github.com/microsoft/TypeScript/issues/12936}\n */\nexport type Exact<A, B> = A extends B ? B : never;\n\n/**\n * Для возможности указывать css custom properties\n */\nexport type CSSCustomProperties<T extends string | undefined = string> = Record<`--${string}`, T>;\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["../src/types.ts"],"sourcesContent":["import * as React from 'react';\nimport { Insets } from '@vkontakte/vk-bridge';\nimport { PlatformType } from './lib/platform';\n\nexport type AnyFunction = (...args: any[]) => any;\n\nexport type AlignType = 'left' | 'center' | 'right';\n\nexport interface HasChildren {\n  children?: React.ReactNode;\n}\n\nexport type HasDataAttribute = Record<\n  `data-${string}`,\n  string | number | boolean | undefined | null\n>;\n\nexport interface HasRootRef<T> {\n  getRootRef?: React.Ref<T>;\n}\n\nexport interface HasRef<T> {\n  getRef?: React.Ref<T>;\n}\n\nexport interface HasComponent {\n  Component?: React.ElementType;\n}\n\nexport interface HasAlign {\n  align?: AlignType;\n}\n\nexport interface HasPlatform {\n  /**\n   * @ignore\n   */\n  platform?: PlatformType;\n}\n\nexport interface HasInsets {\n  /**\n   * @ignore\n   */\n  insets?: Partial<Insets>;\n}\n\nexport interface Version {\n  major: number;\n  minor?: number;\n  patch?: number;\n}\n\n/**\n * Тип содержит атрибуты, которые применяются только для `<a>`\n *\n * @see {@link https://developer.mozilla.org/ru/docs/Web/HTML/Element/A &lt;a&gt; - HTML | MDN}\n */\nexport type AnchorHTMLAttributesOnly = Omit<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  keyof React.HTMLAttributes<HTMLAnchorElement>\n>;\n\n/**\n * Проверяет, является ли тип подтипом другого.\n *\n * В TS не реализовано.\n *\n * @see {@link https://github.com/microsoft/TypeScript/issues/12936}\n */\nexport type Exact<A, B> = A extends B ? B : never;\n\n/**\n * Для возможности указывать css custom properties\n */\nexport type CSSCustomProperties<T extends string | undefined = string> = Record<`--${string}`, T>;\n\n// eslint-disable-next-line @typescript-eslint/no-empty-interface\ninterface Nothing {}\n\n/**\n * Автозаполнение для типов\n *\n * @example\n * LiteralUnion<'foo' | 'bar', string>\n *\n * @see {@link https://github.com/microsoft/TypeScript/issues/29729}\n */\nexport type LiteralUnion<Union, Type> = Union | (Type & Nothing);\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}