@netless/fastboard-ui 0.3.2-canary.2 → 0.3.2-canary.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netless/fastboard-ui",
-  "version": "0.3.2-canary.2",
+  "version": "0.3.2-canary.3",
   "description": "The front-end of @netless/fastboard-core.",
   "main": "dist/index.js",
   "svelte": "dist/index.svelte.mjs",
@@ -10,14 +10,14 @@
   ],
   "repository": "netless-io/fastboard",
   "peerDependencies": {
-    "@netless/fastboard-core": "0.3.2-canary.2"
+    "@netless/fastboard-core": "0.3.2-canary.3"
   },
   "dependencies": {
     "tippy.js": "^6.3.7"
   },
   "devDependencies": {
     "@netless/esbuild-plugin-inline-sass": "0.1.0",
-    "@netless/fastboard-core": "0.3.2-canary.2"
+    "@netless/fastboard-core": "0.3.2-canary.3"
   },
   "scripts": {
     "cleanup": "rimraf dist",

package/src/components/Fastboard/Fastboard.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import type { FastboardApp } from "@netless/fastboard-core";
-  import type { Language, Theme } from "../../typings";
+  import type { Language, Theme, FastboardUIConfig } from "../../typings";
   import { onMount } from "svelte";
   import { tippy_hide_all } from "../../actions/tippy";
   import RedoUndo from "../RedoUndo";
@@ -12,6 +12,7 @@
   export let theme: Theme = "light";
   export let language: Language = "en";
   export let containerRef: ((element: HTMLDivElement | null) => void) | undefined = undefined;
+  export let config: FastboardUIConfig = {};
 
   const name = "fastboard";
   const AppsShowToolbar = ["DocsViewer", "Slide"];
@@ -59,13 +60,21 @@
 <div class="{name}-root" class:loading={!app}>
   <div class="{name}-view" bind:this={container} on:touchstart|capture={tippy_hide_all} />
   <div class="{name}-left" class:hidden={!(layout === "visible" || layout === "toolbar-only")}>
-    <Toolbar {app} {theme} {language} />
+    {#if config.toolbar?.enable !== false}
+      <Toolbar {app} {theme} {language} />
+    {/if}
   </div>
   <div class="{name}-bottom-left" class:hidden={layout !== "visible"}>
-    <RedoUndo {app} {theme} {language} />
-    <ZoomControl {app} {theme} {language} />
+    {#if config.redo_undo?.enable !== false}
+      <RedoUndo {app} {theme} {language} />
+    {/if}
+    {#if config.zoom_control?.enable !== false}
+      <ZoomControl {app} {theme} {language} />
+    {/if}
   </div>
   <div class="{name}-bottom-right" class:hidden={layout !== "visible"}>
-    <PageControl {app} {theme} {language} />
+    {#if config.page_control?.enable !== false}
+      <PageControl {app} {theme} {language} />
+    {/if}
   </div>
 </div>

package/src/components/Fastboard/Fastboard.svelte.ts

@@ -1,5 +1,5 @@
 import type { FastboardApp } from "@netless/fastboard-core";
-import type { Theme, Language } from "../../typings";
+import type { Theme, Language, FastboardUIConfig } from "../../typings";
 import { SvelteComponentTyped } from "svelte";
 
 export declare interface FastboardProps {
@@ -7,6 +7,7 @@ export declare interface FastboardProps {
   theme?: Theme;
   language?: Language;
   containerRef?: (container: HTMLDivElement | null) => void;
+  config?: FastboardUIConfig;
 }
 
 declare class Fastboard extends SvelteComponentTyped<FastboardProps> {}

package/src/index.ts

@@ -1,4 +1,4 @@
-export type { GenericIcon, Language, Theme } from "./typings";
+export * from "./typings";
 
 export { default as RedoUndo, type RedoUndoProps } from "./components/RedoUndo";
 export { default as PageControl, type PageControlProps } from "./components/PageControl";

package/src/typings.ts

@@ -15,3 +15,18 @@ export type GenericIcon<K extends string, E extends string = IconType> = {
 };
 
 export type I18nData<T extends string> = Record<Language, Record<T, string>>;
+
+export interface FastboardUIConfig {
+  toolbar?: {
+    enable?: boolean;
+  };
+  redo_undo?: {
+    enable?: boolean;
+  };
+  zoom_control?: {
+    enable?: boolean;
+  };
+  page_control?: {
+    enable?: boolean;
+  };
+}