@netless/fastboard-react 1.0.0-canary.3 → 1.0.0-canary.4

package/dist/index.js

@@ -46,25 +46,14 @@ function registerDefaultApps() {
     windowManager.WindowManager.register({ kind, ...DefaultApps[kind] });
   });
 }
-var injected = false;
-function ensureNetlessUA() {
-  if (typeof window !== "undefined" && !injected) {
-    injected = true;
-    let str = window.__netlessUA || "";
-    str += ` ${fastboardCore.name}/${fastboardCore.version} `;
-    window.__netlessUA = str;
-  }
-}
 
 // src/create.ts
 async function createFastboard(options) {
-  ensureNetlessUA();
   registerSlide();
   registerDefaultApps();
   return fastboardCore.createFastboardCore(options);
 }
 async function replayFastboard(options) {
-  ensureNetlessUA();
   registerSlide();
   registerDefaultApps();
   return fastboardCore.replayFastboardCore(options);
@@ -80,7 +69,7 @@ function useUpdateEffect(effect, deps) {
     return effect();
   }, deps);
 }
-function wrapReactComponent(SvelteComponent, name2) {
+function wrapReactComponent(SvelteComponent, name) {
   function ReactComponent(props) {
     const [container, setContainer] = React.useState(null);
     const component = React.useRef(null);
@@ -104,7 +93,7 @@ function wrapReactComponent(SvelteComponent, name2) {
       ref: setContainer
     });
   }
-  ReactComponent.displayName = name2;
+  ReactComponent.displayName = name;
   return ReactComponent;
 }
 function useFastboard(config) {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.tsx","../src/RedoUndo.tsx","../src/create.ts","../src/behaviors/netless-app.ts","../src/behaviors/netless-ua.ts","../src/replay.ts","../src/hooks.tsx","../src/ZoomControl.tsx","../src/PageControl.tsx","../src/Toolbar.tsx","../src/Fastboard.tsx"],"names":["name","fastboard"],"mappings":"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","sourcesContent":["import \"./style.scss\";\n\nexport * from \"@netless/fastboard-core\";\nexport { apps } from \"@netless/fastboard-ui\";\nexport type {\n  Theme,\n  Language,\n  GenericIcon,\n  AppInToolbar,\n  AppsInToolbar,\n  FastboardUIConfig,\n} from \"@netless/fastboard-ui\";\nexport * from \"./RedoUndo\";\nexport * from \"./ZoomControl\";\nexport * from \"./PageControl\";\nexport * from \"./Toolbar\";\nexport * from \"./Fastboard\";\nexport * from \"./behaviors\";\nexport * from \"./create\";\nexport * from \"./replay\";\nexport { useFastboard, useReplayFastboard } from \"./hooks\";\n\n// Caution about Export Namespace (Star)\n// esbuild can not handle nested `export *`, i.e. given two files:\n//\n// foo: export * from './bar'\n// bar: export * from 'baz' (external: baz)\n//\n// the result of bundling foo will be broken.\n// `export * from external-module` works and only works at the entry points.\n// ref: https://github.com/evanw/esbuild/issues/1737\n","import type { RedoUndoProps } from \"@netless/fastboard-ui\";\n\nimport { RedoUndo as RedoUndoImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { RedoUndoProps };\n\nexport const RedoUndo = /* @__PURE__ */ wrapReactComponent<RedoUndoProps>(RedoUndoImpl, \"RedoUndo\");\n","import type { FastboardApp, FastboardOptions } from \"@netless/fastboard-core\";\n\nimport { createFastboardCore } from \"@netless/fastboard-core\";\nimport { registerDefaultApps, registerSlide } from \"./behaviors/netless-app\";\nimport { ensureNetlessUA } from \"./behaviors/netless-ua\";\n\n/**\n * Create a FastboardApp instance.\n * @example\n * let app = await createFastboard({\n *   sdkConfig: {\n *     appIdentifier: import.meta.env.VITE_APPID,\n *     region: 'cn-hz',\n *   },\n *   joinRoom: {\n *     uid: unique_id,\n *     uuid: import.meta.env.VITE_ROOM_UUID,\n *     roomToken: import.meta.env.VITE_ROOM_TOKEN,\n *   },\n * })\n */\nexport async function createFastboard<TEventData = any>(\n  options: FastboardOptions\n): Promise<FastboardApp<TEventData>> {\n  ensureNetlessUA();\n  registerSlide();\n  registerDefaultApps();\n  return createFastboardCore<TEventData>(options);\n}\n","import type {\n  AppOptions as NetlessAppSlideAppOptions,\n  Attributes as NetlessAppSlideAttributes,\n  SlideState,\n  SlideViewerOptions,\n} from \"@netless/app-slide\";\nimport type { RegisterParams } from \"@netless/window-manager\";\n\nimport { WindowManager } from \"@netless/window-manager\";\n\nimport NetlessAppSlide, { addHooks, previewSlide, Slide, SlideViewer } from \"@netless/app-slide\";\n\nexport { Slide, SlideViewer, previewSlide };\nexport type { NetlessAppSlideAttributes, SlideState, SlideViewerOptions };\n\nexport function registerSlide() {\n  if (WindowManager.registered.has(NetlessAppSlide.kind)) return;\n  WindowManager.register({\n    kind: NetlessAppSlide.kind,\n    appOptions: { debug: false } as NetlessAppSlideAppOptions,\n    src: NetlessAppSlide,\n    addHooks,\n  });\n}\n\nconst DefaultApps: {\n  [kind: string]: Omit<RegisterParams, \"kind\">;\n} = {};\n\nexport function registerDefaultApps() {\n  Object.keys(DefaultApps).forEach(kind => {\n    if (WindowManager.registered.has(kind)) return;\n    WindowManager.register({ kind, ...DefaultApps[kind] });\n  });\n}\n","import { name, version } from \"@netless/fastboard-core\";\n\ninterface InjectTarget {\n  __netlessUA?: string;\n}\n\nlet injected = false;\nexport function ensureNetlessUA() {\n  if (typeof window !== \"undefined\" && !injected) {\n    injected = true;\n    let str = (window as InjectTarget).__netlessUA || \"\";\n    str += ` ${name}/${version} `;\n    (window as InjectTarget).__netlessUA = str;\n  }\n}\n","import type { FastboardPlayer, FastboardReplayOptions } from \"@netless/fastboard-core\";\n\nimport { replayFastboardCore } from \"@netless/fastboard-core\";\nimport { registerDefaultApps, registerSlide } from \"./behaviors/netless-app\";\nimport { ensureNetlessUA } from \"./behaviors/netless-ua\";\n\n/**\n * Create a FastboardPlayer instance.\n * @example\n * let player = await replayFastboard({\n *   sdkConfig: {\n *     appIdentifier: import.meta.env.VITE_APPID,\n *     region: 'cn-hz',\n *   },\n *   replayRoom: {\n *     room: \"room uuid\",\n *     roomToken: \"NETLESSROOM_...\",\n *     beginTimestamp: 1646619090394,\n *     duration: 70448,\n *   },\n * })\n */\nexport async function replayFastboard<TEventData = any>(\n  options: FastboardReplayOptions\n): Promise<FastboardPlayer<TEventData>> {\n  ensureNetlessUA();\n  registerSlide();\n  registerDefaultApps();\n  return replayFastboardCore<TEventData>(options);\n}\n","/* eslint-disable react-hooks/exhaustive-deps */\nimport type {\n  FastboardApp,\n  FastboardOptions,\n  FastboardPlayer,\n  FastboardReplayOptions,\n} from \"@netless/fastboard-core\";\nimport type { DependencyList, EffectCallback, FunctionComponent } from \"react\";\nimport type { SvelteComponent as SvelteComponentType } from \"svelte\";\n\nimport { createFastboard } from \"./create\";\nimport { replayFastboard } from \"./replay\";\nimport React, { useEffect, useLayoutEffect, useRef, useState } from \"react\";\n\nexport const useIsomorphicLayoutEffect = typeof document !== \"undefined\" ? useLayoutEffect : useEffect;\n\nexport function useUpdateEffect(effect: EffectCallback, deps?: DependencyList) {\n  const isFirst = useRef(true);\n\n  useIsomorphicLayoutEffect(() => {\n    if (isFirst.current) {\n      isFirst.current = false;\n      return;\n    }\n\n    return effect();\n  }, deps);\n}\n\nexport function wrapReactComponent<Props>(\n  SvelteComponent: typeof SvelteComponentType,\n  name: string\n): FunctionComponent<Props> {\n  function ReactComponent(props: Props) {\n    const [container, setContainer] = useState<HTMLDivElement | null>(null);\n    const component = useRef<SvelteComponentType | null>(null);\n\n    useIsomorphicLayoutEffect(() => {\n      if (container) {\n        component.current = new SvelteComponent({ target: container, props });\n\n        return () => {\n          if (component.current) {\n            component.current.$destroy();\n          }\n        };\n      }\n    }, [container]);\n\n    useUpdateEffect(() => {\n      if (component.current) {\n        component.current.$set(props);\n      }\n    }, [props]);\n\n    return <div className=\"fastboard-react-div\" ref={setContainer} />;\n  }\n\n  ReactComponent.displayName = name;\n\n  return ReactComponent;\n}\n\nexport function useFastboard(config: () => FastboardOptions): FastboardApp | null {\n  const unmountRef = useRef(false);\n  const [fastboard, setFastboard] = useState<FastboardApp | null>(null);\n\n  useEffect(() => {\n    let fastboard: FastboardApp | null = null;\n\n    createFastboard(config()).then(app => {\n      if (!unmountRef.current) {\n        setFastboard((fastboard = app));\n      } else {\n        app.destroy();\n      }\n    });\n\n    return () => {\n      unmountRef.current = true;\n      fastboard && fastboard.destroy();\n    };\n  }, []);\n\n  return fastboard;\n}\n\nexport function useReplayFastboard(config: () => FastboardReplayOptions): FastboardPlayer | null {\n  const unmountRef = useRef(false);\n  const [fastboard, setFastboard] = useState<FastboardPlayer | null>(null);\n\n  useEffect(() => {\n    let fastboard: FastboardPlayer | null = null;\n\n    replayFastboard(config()).then(app => {\n      if (!unmountRef.current) {\n        setFastboard((fastboard = app));\n      } else {\n        app.destroy();\n      }\n    });\n\n    return () => {\n      unmountRef.current = true;\n      fastboard && fastboard.destroy();\n    };\n  }, []);\n\n  return fastboard;\n}\n","import type { ZoomControlProps } from \"@netless/fastboard-ui\";\n\nimport { ZoomControl as ZoomControlImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { ZoomControlProps };\n\nexport const ZoomControl = /* @__PURE__ */ wrapReactComponent<ZoomControlProps>(\n  ZoomControlImpl,\n  \"ZoomControl\"\n);\n","import type { PageControlProps } from \"@netless/fastboard-ui\";\n\nimport { PageControl as PageControlImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { PageControlProps };\n\nexport const PageControl = /* @__PURE__ */ wrapReactComponent<PageControlProps>(\n  PageControlImpl,\n  \"PageControl\"\n);\n","import type { ToolbarProps } from \"@netless/fastboard-ui\";\n\nimport { Toolbar as ToolbarImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { ToolbarProps };\n\nexport const Toolbar = /* @__PURE__ */ wrapReactComponent<ToolbarProps>(ToolbarImpl, \"Toolbar\");\n","import type { FastboardProps, ReplayFastboardProps } from \"@netless/fastboard-ui\";\n\nimport { Fastboard as FastboardImpl, ReplayFastboard as ReplayFastboardImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { FastboardProps, ReplayFastboardProps };\n\nexport const Fastboard = /* @__PURE__ */ wrapReactComponent<FastboardProps>(FastboardImpl, \"Fastboard\");\nexport const ReplayFastboard = /* @__PURE__ */ wrapReactComponent<ReplayFastboardProps>(\n  ReplayFastboardImpl,\n  \"ReplayFastboard\"\n);\n"]}
+{"version":3,"sources":["../src/index.tsx","../src/RedoUndo.tsx","../src/create.ts","../src/behaviors/netless-app.ts","../src/replay.ts","../src/hooks.tsx","../src/ZoomControl.tsx","../src/PageControl.tsx","../src/Toolbar.tsx","../src/Fastboard.tsx"],"names":["fastboard"],"mappings":"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","sourcesContent":["import \"./style.scss\";\n\nexport * from \"@netless/fastboard-core\";\nexport { apps } from \"@netless/fastboard-ui\";\nexport type {\n  Theme,\n  Language,\n  GenericIcon,\n  AppInToolbar,\n  AppsInToolbar,\n  FastboardUIConfig,\n} from \"@netless/fastboard-ui\";\nexport * from \"./RedoUndo\";\nexport * from \"./ZoomControl\";\nexport * from \"./PageControl\";\nexport * from \"./Toolbar\";\nexport * from \"./Fastboard\";\nexport * from \"./behaviors\";\nexport * from \"./create\";\nexport * from \"./replay\";\nexport { useFastboard, useReplayFastboard } from \"./hooks\";\n\n// Caution about Export Namespace (Star)\n// esbuild can not handle nested `export *`, i.e. given two files:\n//\n// foo: export * from './bar'\n// bar: export * from 'baz' (external: baz)\n//\n// the result of bundling foo will be broken.\n// `export * from external-module` works and only works at the entry points.\n// ref: https://github.com/evanw/esbuild/issues/1737\n","import type { RedoUndoProps } from \"@netless/fastboard-ui\";\n\nimport { RedoUndo as RedoUndoImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { RedoUndoProps };\n\nexport const RedoUndo = /* @__PURE__ */ wrapReactComponent<RedoUndoProps>(RedoUndoImpl, \"RedoUndo\");\n","import type { FastboardApp, FastboardOptions } from \"@netless/fastboard-core\";\n\nimport { createFastboardCore } from \"@netless/fastboard-core\";\nimport { registerDefaultApps, registerSlide } from \"./behaviors/netless-app\";\n\n/**\n * Create a FastboardApp instance.\n * @example\n * let app = await createFastboard({\n *   sdkConfig: {\n *     appIdentifier: import.meta.env.VITE_APPID,\n *     region: 'cn-hz',\n *   },\n *   joinRoom: {\n *     uid: unique_id,\n *     uuid: import.meta.env.VITE_ROOM_UUID,\n *     roomToken: import.meta.env.VITE_ROOM_TOKEN,\n *   },\n * })\n */\nexport async function createFastboard<TEventData = any>(\n  options: FastboardOptions\n): Promise<FastboardApp<TEventData>> {\n  registerSlide();\n  registerDefaultApps();\n  return createFastboardCore<TEventData>(options);\n}\n","import type {\n  AppOptions as NetlessAppSlideAppOptions,\n  Attributes as NetlessAppSlideAttributes,\n  SlideState,\n  SlideViewerOptions,\n} from \"@netless/app-slide\";\nimport type { RegisterParams } from \"@netless/window-manager\";\n\nimport { WindowManager } from \"@netless/window-manager\";\n\nimport NetlessAppSlide, { addHooks, previewSlide, Slide, SlideViewer } from \"@netless/app-slide\";\n\nexport { Slide, SlideViewer, previewSlide };\nexport type { NetlessAppSlideAttributes, SlideState, SlideViewerOptions };\n\nexport function registerSlide() {\n  if (WindowManager.registered.has(NetlessAppSlide.kind)) return;\n  WindowManager.register({\n    kind: NetlessAppSlide.kind,\n    appOptions: { debug: false } as NetlessAppSlideAppOptions,\n    src: NetlessAppSlide,\n    addHooks,\n  });\n}\n\nconst DefaultApps: {\n  [kind: string]: Omit<RegisterParams, \"kind\">;\n} = {};\n\nexport function registerDefaultApps() {\n  Object.keys(DefaultApps).forEach(kind => {\n    if (WindowManager.registered.has(kind)) return;\n    WindowManager.register({ kind, ...DefaultApps[kind] });\n  });\n}\n","import type { FastboardPlayer, FastboardReplayOptions } from \"@netless/fastboard-core\";\n\nimport { replayFastboardCore } from \"@netless/fastboard-core\";\nimport { registerDefaultApps, registerSlide } from \"./behaviors/netless-app\";\n\n/**\n * Create a FastboardPlayer instance.\n * @example\n * let player = await replayFastboard({\n *   sdkConfig: {\n *     appIdentifier: import.meta.env.VITE_APPID,\n *     region: 'cn-hz',\n *   },\n *   replayRoom: {\n *     room: \"room uuid\",\n *     roomToken: \"NETLESSROOM_...\",\n *     beginTimestamp: 1646619090394,\n *     duration: 70448,\n *   },\n * })\n */\nexport async function replayFastboard<TEventData = any>(\n  options: FastboardReplayOptions\n): Promise<FastboardPlayer<TEventData>> {\n  registerSlide();\n  registerDefaultApps();\n  return replayFastboardCore<TEventData>(options);\n}\n","/* eslint-disable react-hooks/exhaustive-deps */\nimport type {\n  FastboardApp,\n  FastboardOptions,\n  FastboardPlayer,\n  FastboardReplayOptions,\n} from \"@netless/fastboard-core\";\nimport type { DependencyList, EffectCallback, FunctionComponent } from \"react\";\nimport type { SvelteComponent as SvelteComponentType } from \"svelte\";\n\nimport { createFastboard } from \"./create\";\nimport { replayFastboard } from \"./replay\";\nimport React, { useEffect, useLayoutEffect, useRef, useState } from \"react\";\n\nexport const useIsomorphicLayoutEffect = typeof document !== \"undefined\" ? useLayoutEffect : useEffect;\n\nexport function useUpdateEffect(effect: EffectCallback, deps?: DependencyList) {\n  const isFirst = useRef(true);\n\n  useIsomorphicLayoutEffect(() => {\n    if (isFirst.current) {\n      isFirst.current = false;\n      return;\n    }\n\n    return effect();\n  }, deps);\n}\n\nexport function wrapReactComponent<Props>(\n  SvelteComponent: typeof SvelteComponentType,\n  name: string\n): FunctionComponent<Props> {\n  function ReactComponent(props: Props) {\n    const [container, setContainer] = useState<HTMLDivElement | null>(null);\n    const component = useRef<SvelteComponentType | null>(null);\n\n    useIsomorphicLayoutEffect(() => {\n      if (container) {\n        component.current = new SvelteComponent({ target: container, props });\n\n        return () => {\n          if (component.current) {\n            component.current.$destroy();\n          }\n        };\n      }\n    }, [container]);\n\n    useUpdateEffect(() => {\n      if (component.current) {\n        component.current.$set(props);\n      }\n    }, [props]);\n\n    return <div className=\"fastboard-react-div\" ref={setContainer} />;\n  }\n\n  ReactComponent.displayName = name;\n\n  return ReactComponent;\n}\n\nexport function useFastboard(config: () => FastboardOptions): FastboardApp | null {\n  const unmountRef = useRef(false);\n  const [fastboard, setFastboard] = useState<FastboardApp | null>(null);\n\n  useEffect(() => {\n    let fastboard: FastboardApp | null = null;\n\n    createFastboard(config()).then(app => {\n      if (!unmountRef.current) {\n        setFastboard((fastboard = app));\n      } else {\n        app.destroy();\n      }\n    });\n\n    return () => {\n      unmountRef.current = true;\n      fastboard && fastboard.destroy();\n    };\n  }, []);\n\n  return fastboard;\n}\n\nexport function useReplayFastboard(config: () => FastboardReplayOptions): FastboardPlayer | null {\n  const unmountRef = useRef(false);\n  const [fastboard, setFastboard] = useState<FastboardPlayer | null>(null);\n\n  useEffect(() => {\n    let fastboard: FastboardPlayer | null = null;\n\n    replayFastboard(config()).then(app => {\n      if (!unmountRef.current) {\n        setFastboard((fastboard = app));\n      } else {\n        app.destroy();\n      }\n    });\n\n    return () => {\n      unmountRef.current = true;\n      fastboard && fastboard.destroy();\n    };\n  }, []);\n\n  return fastboard;\n}\n","import type { ZoomControlProps } from \"@netless/fastboard-ui\";\n\nimport { ZoomControl as ZoomControlImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { ZoomControlProps };\n\nexport const ZoomControl = /* @__PURE__ */ wrapReactComponent<ZoomControlProps>(\n  ZoomControlImpl,\n  \"ZoomControl\"\n);\n","import type { PageControlProps } from \"@netless/fastboard-ui\";\n\nimport { PageControl as PageControlImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { PageControlProps };\n\nexport const PageControl = /* @__PURE__ */ wrapReactComponent<PageControlProps>(\n  PageControlImpl,\n  \"PageControl\"\n);\n","import type { ToolbarProps } from \"@netless/fastboard-ui\";\n\nimport { Toolbar as ToolbarImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { ToolbarProps };\n\nexport const Toolbar = /* @__PURE__ */ wrapReactComponent<ToolbarProps>(ToolbarImpl, \"Toolbar\");\n","import type { FastboardProps, ReplayFastboardProps } from \"@netless/fastboard-ui\";\n\nimport { Fastboard as FastboardImpl, ReplayFastboard as ReplayFastboardImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { FastboardProps, ReplayFastboardProps };\n\nexport const Fastboard = /* @__PURE__ */ wrapReactComponent<FastboardProps>(FastboardImpl, \"Fastboard\");\nexport const ReplayFastboard = /* @__PURE__ */ wrapReactComponent<ReplayFastboardProps>(\n  ReplayFastboardImpl,\n  \"ReplayFastboard\"\n);\n"]}

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { createFastboardCore, replayFastboardCore, name, version } from '@netless/fastboard-core';
+import { createFastboardCore, replayFastboardCore } from '@netless/fastboard-core';
 export * from '@netless/fastboard-core';
 import { RedoUndo as RedoUndo$1, ZoomControl as ZoomControl$1, PageControl as PageControl$1, Toolbar as Toolbar$1, Fastboard as Fastboard$1, ReplayFastboard as ReplayFastboard$1 } from '@netless/fastboard-ui';
 export { apps } from '@netless/fastboard-ui';
@@ -40,25 +40,14 @@ function registerDefaultApps() {
     WindowManager.register({ kind, ...DefaultApps[kind] });
   });
 }
-var injected = false;
-function ensureNetlessUA() {
-  if (typeof window !== "undefined" && !injected) {
-    injected = true;
-    let str = window.__netlessUA || "";
-    str += ` ${name}/${version} `;
-    window.__netlessUA = str;
-  }
-}
 
 // src/create.ts
 async function createFastboard(options) {
-  ensureNetlessUA();
   registerSlide();
   registerDefaultApps();
   return createFastboardCore(options);
 }
 async function replayFastboard(options) {
-  ensureNetlessUA();
   registerSlide();
   registerDefaultApps();
   return replayFastboardCore(options);
@@ -74,7 +63,7 @@ function useUpdateEffect(effect, deps) {
     return effect();
   }, deps);
 }
-function wrapReactComponent(SvelteComponent, name2) {
+function wrapReactComponent(SvelteComponent, name) {
   function ReactComponent(props) {
     const [container, setContainer] = useState(null);
     const component = useRef(null);
@@ -98,7 +87,7 @@ function wrapReactComponent(SvelteComponent, name2) {
       ref: setContainer
     });
   }
-  ReactComponent.displayName = name2;
+  ReactComponent.displayName = name;
   return ReactComponent;
 }
 function useFastboard(config) {

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.tsx","../src/RedoUndo.tsx","../src/create.ts","../src/behaviors/netless-app.ts","../src/behaviors/netless-ua.ts","../src/replay.ts","../src/hooks.tsx","../src/ZoomControl.tsx","../src/PageControl.tsx","../src/Toolbar.tsx","../src/Fastboard.tsx"],"names":["name","fastboard"],"mappings":";;;;;;;;;;;;;;;;;AAEA,cAAc;AACd,SAAS,YAAY;;;ACDrB,SAAS,YAAY,oBAAoB;;;ACAzC,SAAS,2BAA2B;;;ACMpC,SAAS,qBAAqB;AAE9B,OAAO,mBAAmB,UAAU,cAAc,OAAO,mBAAmB;AAKrE,SAAS,gBAAgB;AAC9B,MAAI,cAAc,WAAW,IAAI,gBAAgB,IAAI;AAAG;AACxD,gBAAc,SAAS;AAAA,IACrB,MAAM,gBAAgB;AAAA,IACtB,YAAY,EAAE,OAAO,MAAM;AAAA,IAC3B,KAAK;AAAA,IACL;AAAA,EACF,CAAC;AACH;AAEA,IAAM,cAEF,CAAC;AAEE,SAAS,sBAAsB;AACpC,SAAO,KAAK,WAAW,EAAE,QAAQ,UAAQ;AACvC,QAAI,cAAc,WAAW,IAAI,IAAI;AAAG;AACxC,kBAAc,SAAS,EAAE,MAAM,GAAG,YAAY,MAAM,CAAC;AAAA,EACvD,CAAC;AACH;;;AClCA,SAAS,MAAM,eAAe;AAM9B,IAAI,WAAW;AACR,SAAS,kBAAkB;AAChC,MAAI,OAAO,WAAW,eAAe,CAAC,UAAU;AAC9C,eAAW;AACX,QAAI,MAAO,OAAwB,eAAe;AAClD,WAAO,IAAI,QAAQ;AACnB,IAAC,OAAwB,cAAc;AAAA,EACzC;AACF;;;AFOA,eAAsB,gBACpB,SACmC;AACnC,kBAAgB;AAChB,gBAAc;AACd,sBAAoB;AACpB,SAAO,oBAAgC,OAAO;AAChD;;;AG1BA,SAAS,2BAA2B;AAoBpC,eAAsB,gBACpB,SACsC;AACtC,kBAAgB;AAChB,gBAAc;AACd,sBAAoB;AACpB,SAAO,oBAAgC,OAAO;AAChD;;;ACjBA,OAAO,SAAS,WAAW,iBAAiB,QAAQ,gBAAgB;AAE7D,IAAM,4BAA4B,OAAO,aAAa,cAAc,kBAAkB;AAEtF,SAAS,gBAAgB,QAAwB,MAAuB;AAC7E,QAAM,UAAU,OAAO,IAAI;AAE3B,4BAA0B,MAAM;AAC9B,QAAI,QAAQ,SAAS;AACnB,cAAQ,UAAU;AAClB;AAAA,IACF;AAEA,WAAO,OAAO;AAAA,EAChB,GAAG,IAAI;AACT;AAEO,SAAS,mBACd,iBACAA,OAC0B;AAC1B,WAAS,eAAe,OAAc;AACpC,UAAM,CAAC,WAAW,YAAY,IAAI,SAAgC,IAAI;AACtE,UAAM,YAAY,OAAmC,IAAI;AAEzD,8BAA0B,MAAM;AAC9B,UAAI,WAAW;AACb,kBAAU,UAAU,IAAI,gBAAgB,EAAE,QAAQ,WAAW,MAAM,CAAC;AAEpE,eAAO,MAAM;AACX,cAAI,UAAU,SAAS;AACrB,sBAAU,QAAQ,SAAS;AAAA,UAC7B;AAAA,QACF;AAAA,MACF;AAAA,IACF,GAAG,CAAC,SAAS,CAAC;AAEd,oBAAgB,MAAM;AACpB,UAAI,UAAU,SAAS;AACrB,kBAAU,QAAQ,KAAK,KAAK;AAAA,MAC9B;AAAA,IACF,GAAG,CAAC,KAAK,CAAC;AAEV,WAAO,oCAAC;AAAA,MAAI,WAAU;AAAA,MAAsB,KAAK;AAAA,KAAc;AAAA,EACjE;AAEA,iBAAe,cAAcA;AAE7B,SAAO;AACT;AAEO,SAAS,aAAa,QAAqD;AAChF,QAAM,aAAa,OAAO,KAAK;AAC/B,QAAM,CAAC,WAAW,YAAY,IAAI,SAA8B,IAAI;AAEpE,YAAU,MAAM;AACd,QAAIC,aAAiC;AAErC,oBAAgB,OAAO,CAAC,EAAE,KAAK,SAAO;AACpC,UAAI,CAAC,WAAW,SAAS;AACvB,qBAAcA,aAAY,GAAI;AAAA,MAChC,OAAO;AACL,YAAI,QAAQ;AAAA,MACd;AAAA,IACF,CAAC;AAED,WAAO,MAAM;AACX,iBAAW,UAAU;AACrB,MAAAA,cAAaA,WAAU,QAAQ;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;AAEO,SAAS,mBAAmB,QAA8D;AAC/F,QAAM,aAAa,OAAO,KAAK;AAC/B,QAAM,CAAC,WAAW,YAAY,IAAI,SAAiC,IAAI;AAEvE,YAAU,MAAM;AACd,QAAIA,aAAoC;AAExC,oBAAgB,OAAO,CAAC,EAAE,KAAK,SAAO;AACpC,UAAI,CAAC,WAAW,SAAS;AACvB,qBAAcA,aAAY,GAAI;AAAA,MAChC,OAAO;AACL,YAAI,QAAQ;AAAA,MACd;AAAA,IACF,CAAC;AAED,WAAO,MAAM;AACX,iBAAW,UAAU;AACrB,MAAAA,cAAaA,WAAU,QAAQ;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,SAAO;AACT;;;ALtGO,IAAM,WAA2B,mCAAkC,cAAc,UAAU;;;AMLlG,SAAS,eAAe,uBAAuB;AAKxC,IAAM,cAA8B;AAAA,EACzC;AAAA,EACA;AACF;;;ACRA,SAAS,eAAe,uBAAuB;AAKxC,IAAM,cAA8B;AAAA,EACzC;AAAA,EACA;AACF;;;ACRA,SAAS,WAAW,mBAAmB;AAKhC,IAAM,UAA0B,mCAAiC,aAAa,SAAS;;;ACL9F,SAAS,aAAa,eAAe,mBAAmB,2BAA2B;AAK5E,IAAM,YAA4B,mCAAmC,eAAe,WAAW;AAC/F,IAAM,kBAAkC;AAAA,EAC7C;AAAA,EACA;AACF","sourcesContent":["import \"./style.scss\";\n\nexport * from \"@netless/fastboard-core\";\nexport { apps } from \"@netless/fastboard-ui\";\nexport type {\n  Theme,\n  Language,\n  GenericIcon,\n  AppInToolbar,\n  AppsInToolbar,\n  FastboardUIConfig,\n} from \"@netless/fastboard-ui\";\nexport * from \"./RedoUndo\";\nexport * from \"./ZoomControl\";\nexport * from \"./PageControl\";\nexport * from \"./Toolbar\";\nexport * from \"./Fastboard\";\nexport * from \"./behaviors\";\nexport * from \"./create\";\nexport * from \"./replay\";\nexport { useFastboard, useReplayFastboard } from \"./hooks\";\n\n// Caution about Export Namespace (Star)\n// esbuild can not handle nested `export *`, i.e. given two files:\n//\n// foo: export * from './bar'\n// bar: export * from 'baz' (external: baz)\n//\n// the result of bundling foo will be broken.\n// `export * from external-module` works and only works at the entry points.\n// ref: https://github.com/evanw/esbuild/issues/1737\n","import type { RedoUndoProps } from \"@netless/fastboard-ui\";\n\nimport { RedoUndo as RedoUndoImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { RedoUndoProps };\n\nexport const RedoUndo = /* @__PURE__ */ wrapReactComponent<RedoUndoProps>(RedoUndoImpl, \"RedoUndo\");\n","import type { FastboardApp, FastboardOptions } from \"@netless/fastboard-core\";\n\nimport { createFastboardCore } from \"@netless/fastboard-core\";\nimport { registerDefaultApps, registerSlide } from \"./behaviors/netless-app\";\nimport { ensureNetlessUA } from \"./behaviors/netless-ua\";\n\n/**\n * Create a FastboardApp instance.\n * @example\n * let app = await createFastboard({\n *   sdkConfig: {\n *     appIdentifier: import.meta.env.VITE_APPID,\n *     region: 'cn-hz',\n *   },\n *   joinRoom: {\n *     uid: unique_id,\n *     uuid: import.meta.env.VITE_ROOM_UUID,\n *     roomToken: import.meta.env.VITE_ROOM_TOKEN,\n *   },\n * })\n */\nexport async function createFastboard<TEventData = any>(\n  options: FastboardOptions\n): Promise<FastboardApp<TEventData>> {\n  ensureNetlessUA();\n  registerSlide();\n  registerDefaultApps();\n  return createFastboardCore<TEventData>(options);\n}\n","import type {\n  AppOptions as NetlessAppSlideAppOptions,\n  Attributes as NetlessAppSlideAttributes,\n  SlideState,\n  SlideViewerOptions,\n} from \"@netless/app-slide\";\nimport type { RegisterParams } from \"@netless/window-manager\";\n\nimport { WindowManager } from \"@netless/window-manager\";\n\nimport NetlessAppSlide, { addHooks, previewSlide, Slide, SlideViewer } from \"@netless/app-slide\";\n\nexport { Slide, SlideViewer, previewSlide };\nexport type { NetlessAppSlideAttributes, SlideState, SlideViewerOptions };\n\nexport function registerSlide() {\n  if (WindowManager.registered.has(NetlessAppSlide.kind)) return;\n  WindowManager.register({\n    kind: NetlessAppSlide.kind,\n    appOptions: { debug: false } as NetlessAppSlideAppOptions,\n    src: NetlessAppSlide,\n    addHooks,\n  });\n}\n\nconst DefaultApps: {\n  [kind: string]: Omit<RegisterParams, \"kind\">;\n} = {};\n\nexport function registerDefaultApps() {\n  Object.keys(DefaultApps).forEach(kind => {\n    if (WindowManager.registered.has(kind)) return;\n    WindowManager.register({ kind, ...DefaultApps[kind] });\n  });\n}\n","import { name, version } from \"@netless/fastboard-core\";\n\ninterface InjectTarget {\n  __netlessUA?: string;\n}\n\nlet injected = false;\nexport function ensureNetlessUA() {\n  if (typeof window !== \"undefined\" && !injected) {\n    injected = true;\n    let str = (window as InjectTarget).__netlessUA || \"\";\n    str += ` ${name}/${version} `;\n    (window as InjectTarget).__netlessUA = str;\n  }\n}\n","import type { FastboardPlayer, FastboardReplayOptions } from \"@netless/fastboard-core\";\n\nimport { replayFastboardCore } from \"@netless/fastboard-core\";\nimport { registerDefaultApps, registerSlide } from \"./behaviors/netless-app\";\nimport { ensureNetlessUA } from \"./behaviors/netless-ua\";\n\n/**\n * Create a FastboardPlayer instance.\n * @example\n * let player = await replayFastboard({\n *   sdkConfig: {\n *     appIdentifier: import.meta.env.VITE_APPID,\n *     region: 'cn-hz',\n *   },\n *   replayRoom: {\n *     room: \"room uuid\",\n *     roomToken: \"NETLESSROOM_...\",\n *     beginTimestamp: 1646619090394,\n *     duration: 70448,\n *   },\n * })\n */\nexport async function replayFastboard<TEventData = any>(\n  options: FastboardReplayOptions\n): Promise<FastboardPlayer<TEventData>> {\n  ensureNetlessUA();\n  registerSlide();\n  registerDefaultApps();\n  return replayFastboardCore<TEventData>(options);\n}\n","/* eslint-disable react-hooks/exhaustive-deps */\nimport type {\n  FastboardApp,\n  FastboardOptions,\n  FastboardPlayer,\n  FastboardReplayOptions,\n} from \"@netless/fastboard-core\";\nimport type { DependencyList, EffectCallback, FunctionComponent } from \"react\";\nimport type { SvelteComponent as SvelteComponentType } from \"svelte\";\n\nimport { createFastboard } from \"./create\";\nimport { replayFastboard } from \"./replay\";\nimport React, { useEffect, useLayoutEffect, useRef, useState } from \"react\";\n\nexport const useIsomorphicLayoutEffect = typeof document !== \"undefined\" ? useLayoutEffect : useEffect;\n\nexport function useUpdateEffect(effect: EffectCallback, deps?: DependencyList) {\n  const isFirst = useRef(true);\n\n  useIsomorphicLayoutEffect(() => {\n    if (isFirst.current) {\n      isFirst.current = false;\n      return;\n    }\n\n    return effect();\n  }, deps);\n}\n\nexport function wrapReactComponent<Props>(\n  SvelteComponent: typeof SvelteComponentType,\n  name: string\n): FunctionComponent<Props> {\n  function ReactComponent(props: Props) {\n    const [container, setContainer] = useState<HTMLDivElement | null>(null);\n    const component = useRef<SvelteComponentType | null>(null);\n\n    useIsomorphicLayoutEffect(() => {\n      if (container) {\n        component.current = new SvelteComponent({ target: container, props });\n\n        return () => {\n          if (component.current) {\n            component.current.$destroy();\n          }\n        };\n      }\n    }, [container]);\n\n    useUpdateEffect(() => {\n      if (component.current) {\n        component.current.$set(props);\n      }\n    }, [props]);\n\n    return <div className=\"fastboard-react-div\" ref={setContainer} />;\n  }\n\n  ReactComponent.displayName = name;\n\n  return ReactComponent;\n}\n\nexport function useFastboard(config: () => FastboardOptions): FastboardApp | null {\n  const unmountRef = useRef(false);\n  const [fastboard, setFastboard] = useState<FastboardApp | null>(null);\n\n  useEffect(() => {\n    let fastboard: FastboardApp | null = null;\n\n    createFastboard(config()).then(app => {\n      if (!unmountRef.current) {\n        setFastboard((fastboard = app));\n      } else {\n        app.destroy();\n      }\n    });\n\n    return () => {\n      unmountRef.current = true;\n      fastboard && fastboard.destroy();\n    };\n  }, []);\n\n  return fastboard;\n}\n\nexport function useReplayFastboard(config: () => FastboardReplayOptions): FastboardPlayer | null {\n  const unmountRef = useRef(false);\n  const [fastboard, setFastboard] = useState<FastboardPlayer | null>(null);\n\n  useEffect(() => {\n    let fastboard: FastboardPlayer | null = null;\n\n    replayFastboard(config()).then(app => {\n      if (!unmountRef.current) {\n        setFastboard((fastboard = app));\n      } else {\n        app.destroy();\n      }\n    });\n\n    return () => {\n      unmountRef.current = true;\n      fastboard && fastboard.destroy();\n    };\n  }, []);\n\n  return fastboard;\n}\n","import type { ZoomControlProps } from \"@netless/fastboard-ui\";\n\nimport { ZoomControl as ZoomControlImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { ZoomControlProps };\n\nexport const ZoomControl = /* @__PURE__ */ wrapReactComponent<ZoomControlProps>(\n  ZoomControlImpl,\n  \"ZoomControl\"\n);\n","import type { PageControlProps } from \"@netless/fastboard-ui\";\n\nimport { PageControl as PageControlImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { PageControlProps };\n\nexport const PageControl = /* @__PURE__ */ wrapReactComponent<PageControlProps>(\n  PageControlImpl,\n  \"PageControl\"\n);\n","import type { ToolbarProps } from \"@netless/fastboard-ui\";\n\nimport { Toolbar as ToolbarImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { ToolbarProps };\n\nexport const Toolbar = /* @__PURE__ */ wrapReactComponent<ToolbarProps>(ToolbarImpl, \"Toolbar\");\n","import type { FastboardProps, ReplayFastboardProps } from \"@netless/fastboard-ui\";\n\nimport { Fastboard as FastboardImpl, ReplayFastboard as ReplayFastboardImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { FastboardProps, ReplayFastboardProps };\n\nexport const Fastboard = /* @__PURE__ */ wrapReactComponent<FastboardProps>(FastboardImpl, \"Fastboard\");\nexport const ReplayFastboard = /* @__PURE__ */ wrapReactComponent<ReplayFastboardProps>(\n  ReplayFastboardImpl,\n  \"ReplayFastboard\"\n);\n"]}
+{"version":3,"sources":["../src/index.tsx","../src/RedoUndo.tsx","../src/create.ts","../src/behaviors/netless-app.ts","../src/replay.ts","../src/hooks.tsx","../src/ZoomControl.tsx","../src/PageControl.tsx","../src/Toolbar.tsx","../src/Fastboard.tsx"],"names":["fastboard"],"mappings":"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","sourcesContent":["import \"./style.scss\";\n\nexport * from \"@netless/fastboard-core\";\nexport { apps } from \"@netless/fastboard-ui\";\nexport type {\n  Theme,\n  Language,\n  GenericIcon,\n  AppInToolbar,\n  AppsInToolbar,\n  FastboardUIConfig,\n} from \"@netless/fastboard-ui\";\nexport * from \"./RedoUndo\";\nexport * from \"./ZoomControl\";\nexport * from \"./PageControl\";\nexport * from \"./Toolbar\";\nexport * from \"./Fastboard\";\nexport * from \"./behaviors\";\nexport * from \"./create\";\nexport * from \"./replay\";\nexport { useFastboard, useReplayFastboard } from \"./hooks\";\n\n// Caution about Export Namespace (Star)\n// esbuild can not handle nested `export *`, i.e. given two files:\n//\n// foo: export * from './bar'\n// bar: export * from 'baz' (external: baz)\n//\n// the result of bundling foo will be broken.\n// `export * from external-module` works and only works at the entry points.\n// ref: https://github.com/evanw/esbuild/issues/1737\n","import type { RedoUndoProps } from \"@netless/fastboard-ui\";\n\nimport { RedoUndo as RedoUndoImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { RedoUndoProps };\n\nexport const RedoUndo = /* @__PURE__ */ wrapReactComponent<RedoUndoProps>(RedoUndoImpl, \"RedoUndo\");\n","import type { FastboardApp, FastboardOptions } from \"@netless/fastboard-core\";\n\nimport { createFastboardCore } from \"@netless/fastboard-core\";\nimport { registerDefaultApps, registerSlide } from \"./behaviors/netless-app\";\n\n/**\n * Create a FastboardApp instance.\n * @example\n * let app = await createFastboard({\n *   sdkConfig: {\n *     appIdentifier: import.meta.env.VITE_APPID,\n *     region: 'cn-hz',\n *   },\n *   joinRoom: {\n *     uid: unique_id,\n *     uuid: import.meta.env.VITE_ROOM_UUID,\n *     roomToken: import.meta.env.VITE_ROOM_TOKEN,\n *   },\n * })\n */\nexport async function createFastboard<TEventData = any>(\n  options: FastboardOptions\n): Promise<FastboardApp<TEventData>> {\n  registerSlide();\n  registerDefaultApps();\n  return createFastboardCore<TEventData>(options);\n}\n","import type {\n  AppOptions as NetlessAppSlideAppOptions,\n  Attributes as NetlessAppSlideAttributes,\n  SlideState,\n  SlideViewerOptions,\n} from \"@netless/app-slide\";\nimport type { RegisterParams } from \"@netless/window-manager\";\n\nimport { WindowManager } from \"@netless/window-manager\";\n\nimport NetlessAppSlide, { addHooks, previewSlide, Slide, SlideViewer } from \"@netless/app-slide\";\n\nexport { Slide, SlideViewer, previewSlide };\nexport type { NetlessAppSlideAttributes, SlideState, SlideViewerOptions };\n\nexport function registerSlide() {\n  if (WindowManager.registered.has(NetlessAppSlide.kind)) return;\n  WindowManager.register({\n    kind: NetlessAppSlide.kind,\n    appOptions: { debug: false } as NetlessAppSlideAppOptions,\n    src: NetlessAppSlide,\n    addHooks,\n  });\n}\n\nconst DefaultApps: {\n  [kind: string]: Omit<RegisterParams, \"kind\">;\n} = {};\n\nexport function registerDefaultApps() {\n  Object.keys(DefaultApps).forEach(kind => {\n    if (WindowManager.registered.has(kind)) return;\n    WindowManager.register({ kind, ...DefaultApps[kind] });\n  });\n}\n","import type { FastboardPlayer, FastboardReplayOptions } from \"@netless/fastboard-core\";\n\nimport { replayFastboardCore } from \"@netless/fastboard-core\";\nimport { registerDefaultApps, registerSlide } from \"./behaviors/netless-app\";\n\n/**\n * Create a FastboardPlayer instance.\n * @example\n * let player = await replayFastboard({\n *   sdkConfig: {\n *     appIdentifier: import.meta.env.VITE_APPID,\n *     region: 'cn-hz',\n *   },\n *   replayRoom: {\n *     room: \"room uuid\",\n *     roomToken: \"NETLESSROOM_...\",\n *     beginTimestamp: 1646619090394,\n *     duration: 70448,\n *   },\n * })\n */\nexport async function replayFastboard<TEventData = any>(\n  options: FastboardReplayOptions\n): Promise<FastboardPlayer<TEventData>> {\n  registerSlide();\n  registerDefaultApps();\n  return replayFastboardCore<TEventData>(options);\n}\n","/* eslint-disable react-hooks/exhaustive-deps */\nimport type {\n  FastboardApp,\n  FastboardOptions,\n  FastboardPlayer,\n  FastboardReplayOptions,\n} from \"@netless/fastboard-core\";\nimport type { DependencyList, EffectCallback, FunctionComponent } from \"react\";\nimport type { SvelteComponent as SvelteComponentType } from \"svelte\";\n\nimport { createFastboard } from \"./create\";\nimport { replayFastboard } from \"./replay\";\nimport React, { useEffect, useLayoutEffect, useRef, useState } from \"react\";\n\nexport const useIsomorphicLayoutEffect = typeof document !== \"undefined\" ? useLayoutEffect : useEffect;\n\nexport function useUpdateEffect(effect: EffectCallback, deps?: DependencyList) {\n  const isFirst = useRef(true);\n\n  useIsomorphicLayoutEffect(() => {\n    if (isFirst.current) {\n      isFirst.current = false;\n      return;\n    }\n\n    return effect();\n  }, deps);\n}\n\nexport function wrapReactComponent<Props>(\n  SvelteComponent: typeof SvelteComponentType,\n  name: string\n): FunctionComponent<Props> {\n  function ReactComponent(props: Props) {\n    const [container, setContainer] = useState<HTMLDivElement | null>(null);\n    const component = useRef<SvelteComponentType | null>(null);\n\n    useIsomorphicLayoutEffect(() => {\n      if (container) {\n        component.current = new SvelteComponent({ target: container, props });\n\n        return () => {\n          if (component.current) {\n            component.current.$destroy();\n          }\n        };\n      }\n    }, [container]);\n\n    useUpdateEffect(() => {\n      if (component.current) {\n        component.current.$set(props);\n      }\n    }, [props]);\n\n    return <div className=\"fastboard-react-div\" ref={setContainer} />;\n  }\n\n  ReactComponent.displayName = name;\n\n  return ReactComponent;\n}\n\nexport function useFastboard(config: () => FastboardOptions): FastboardApp | null {\n  const unmountRef = useRef(false);\n  const [fastboard, setFastboard] = useState<FastboardApp | null>(null);\n\n  useEffect(() => {\n    let fastboard: FastboardApp | null = null;\n\n    createFastboard(config()).then(app => {\n      if (!unmountRef.current) {\n        setFastboard((fastboard = app));\n      } else {\n        app.destroy();\n      }\n    });\n\n    return () => {\n      unmountRef.current = true;\n      fastboard && fastboard.destroy();\n    };\n  }, []);\n\n  return fastboard;\n}\n\nexport function useReplayFastboard(config: () => FastboardReplayOptions): FastboardPlayer | null {\n  const unmountRef = useRef(false);\n  const [fastboard, setFastboard] = useState<FastboardPlayer | null>(null);\n\n  useEffect(() => {\n    let fastboard: FastboardPlayer | null = null;\n\n    replayFastboard(config()).then(app => {\n      if (!unmountRef.current) {\n        setFastboard((fastboard = app));\n      } else {\n        app.destroy();\n      }\n    });\n\n    return () => {\n      unmountRef.current = true;\n      fastboard && fastboard.destroy();\n    };\n  }, []);\n\n  return fastboard;\n}\n","import type { ZoomControlProps } from \"@netless/fastboard-ui\";\n\nimport { ZoomControl as ZoomControlImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { ZoomControlProps };\n\nexport const ZoomControl = /* @__PURE__ */ wrapReactComponent<ZoomControlProps>(\n  ZoomControlImpl,\n  \"ZoomControl\"\n);\n","import type { PageControlProps } from \"@netless/fastboard-ui\";\n\nimport { PageControl as PageControlImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { PageControlProps };\n\nexport const PageControl = /* @__PURE__ */ wrapReactComponent<PageControlProps>(\n  PageControlImpl,\n  \"PageControl\"\n);\n","import type { ToolbarProps } from \"@netless/fastboard-ui\";\n\nimport { Toolbar as ToolbarImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { ToolbarProps };\n\nexport const Toolbar = /* @__PURE__ */ wrapReactComponent<ToolbarProps>(ToolbarImpl, \"Toolbar\");\n","import type { FastboardProps, ReplayFastboardProps } from \"@netless/fastboard-ui\";\n\nimport { Fastboard as FastboardImpl, ReplayFastboard as ReplayFastboardImpl } from \"@netless/fastboard-ui\";\nimport { wrapReactComponent } from \"./hooks\";\n\nexport type { FastboardProps, ReplayFastboardProps };\n\nexport const Fastboard = /* @__PURE__ */ wrapReactComponent<FastboardProps>(FastboardImpl, \"Fastboard\");\nexport const ReplayFastboard = /* @__PURE__ */ wrapReactComponent<ReplayFastboardProps>(\n  ReplayFastboardImpl,\n  \"ReplayFastboard\"\n);\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/fastboard-react",
-  "version": "1.0.0-canary.3",
+  "version": "1.0.0-canary.4",
   "description": "React components of @netless/fastboard.",
   "main": "dist/index.js",
   "files": [
@@ -15,8 +15,8 @@
   },
   "dependencies": {
     "@netless/app-slide": "0.3.0-canary.7",
-    "@netless/fastboard-core": "1.0.0-canary.3",
-    "@netless/fastboard-ui": "1.0.0-canary.3"
+    "@netless/fastboard-core": "1.0.0-canary.4",
+    "@netless/fastboard-ui": "1.0.0-canary.4"
   },
   "devDependencies": {
     "@netless/esbuild-plugin-inline-sass": "0.1.0",

package/src/create.ts

@@ -2,7 +2,6 @@ import type { FastboardApp, FastboardOptions } from "@netless/fastboard-core";
 
 import { createFastboardCore } from "@netless/fastboard-core";
 import { registerDefaultApps, registerSlide } from "./behaviors/netless-app";
-import { ensureNetlessUA } from "./behaviors/netless-ua";
 
 /**
  * Create a FastboardApp instance.
@@ -22,7 +21,6 @@ import { ensureNetlessUA } from "./behaviors/netless-ua";
 export async function createFastboard<TEventData = any>(
   options: FastboardOptions
 ): Promise<FastboardApp<TEventData>> {
-  ensureNetlessUA();
   registerSlide();
   registerDefaultApps();
   return createFastboardCore<TEventData>(options);

package/src/replay.ts

@@ -2,7 +2,6 @@ import type { FastboardPlayer, FastboardReplayOptions } from "@netless/fastboard
 
 import { replayFastboardCore } from "@netless/fastboard-core";
 import { registerDefaultApps, registerSlide } from "./behaviors/netless-app";
-import { ensureNetlessUA } from "./behaviors/netless-ua";
 
 /**
  * Create a FastboardPlayer instance.
@@ -23,7 +22,6 @@ import { ensureNetlessUA } from "./behaviors/netless-ua";
 export async function replayFastboard<TEventData = any>(
   options: FastboardReplayOptions
 ): Promise<FastboardPlayer<TEventData>> {
-  ensureNetlessUA();
   registerSlide();
   registerDefaultApps();
   return replayFastboardCore<TEventData>(options);

package/src/behaviors/netless-ua.ts

@@ -1,15 +0,0 @@
-import { name, version } from "@netless/fastboard-core";
-
-interface InjectTarget {
-  __netlessUA?: string;
-}
-
-let injected = false;
-export function ensureNetlessUA() {
-  if (typeof window !== "undefined" && !injected) {
-    injected = true;
-    let str = (window as InjectTarget).__netlessUA || "";
-    str += ` ${name}/${version} `;
-    (window as InjectTarget).__netlessUA = str;
-  }
-}