@netless/fastboard-ui 1.0.5-beta.1 → 1.0.6-beta.1

package/dist/full.d.ts

@@ -121,6 +121,14 @@ declare interface FastboardProps {
    */
   containerRef?: (container: HTMLDivElement | null) => void;
   config?: FastboardUIConfig;
+  /** Whether to forcibly display the toolbar */
+  force_show_toolbar?: boolean;
+  /** Whether to force the display of the redo undo button */
+  force_show_redo_undo?: boolean;
+  /** Whether to force the display of the zoom control button */
+  force_show_zoom_control?: boolean;
+  /** Whether to forcibly display the page control button */
+  force_show_page_control?: boolean;
 }
 
 declare class Fastboard extends SvelteComponentTyped<FastboardProps> {}
@@ -132,6 +140,30 @@ interface UI {
     update(props?: FastboardProps): void;
     /** remove UI */
     destroy(): void;
+    /** force show toolbar */
+    forceShowToolbar(): void;
+    /** force hide toolbar */
+    forceHideToolbar(): void;
+    /** recover show toolbar */
+    recoverToolbar(): void;
+    /** force show redo undo */
+    forceShowRedoUndo(): void;
+    /** force hide redo undo */
+    forceHideRedoUndo(): void;
+    /** recover show redo undo */
+    recoverRedoUndo(): void;
+    /** force show zoom control */
+    forceShowZoomControl(): void;
+    /** force hide zoom control */
+    forceHideZoomControl(): void;
+    /** recover show zoom control */
+    recoverZoomControl(): void;
+    /** force show page control */
+    forceShowPageControl(): void;
+    /** force hide page control */
+    forceHidePageControl(): void;
+    /** recover show page control */
+    recoverPageControl(): void;
 }
 /**
  * @example

package/dist/index.d.ts

@@ -121,6 +121,14 @@ declare interface FastboardProps {
    */
   containerRef?: (container: HTMLDivElement | null) => void;
   config?: FastboardUIConfig;
+  /** Whether to forcibly display the toolbar */
+  force_show_toolbar?: boolean;
+  /** Whether to force the display of the redo undo button */
+  force_show_redo_undo?: boolean;
+  /** Whether to force the display of the zoom control button */
+  force_show_zoom_control?: boolean;
+  /** Whether to forcibly display the page control button */
+  force_show_page_control?: boolean;
 }
 
 declare class Fastboard extends SvelteComponentTyped<FastboardProps> {}
@@ -132,6 +140,30 @@ interface UI {
     update(props?: FastboardProps): void;
     /** remove UI */
     destroy(): void;
+    /** force show toolbar */
+    forceShowToolbar(): void;
+    /** force hide toolbar */
+    forceHideToolbar(): void;
+    /** recover show toolbar */
+    recoverToolbar(): void;
+    /** force show redo undo */
+    forceShowRedoUndo(): void;
+    /** force hide redo undo */
+    forceHideRedoUndo(): void;
+    /** recover show redo undo */
+    recoverRedoUndo(): void;
+    /** force show zoom control */
+    forceShowZoomControl(): void;
+    /** force hide zoom control */
+    forceHideZoomControl(): void;
+    /** recover show zoom control */
+    recoverZoomControl(): void;
+    /** force show page control */
+    forceShowPageControl(): void;
+    /** force hide page control */
+    forceHidePageControl(): void;
+    /** recover show page control */
+    recoverPageControl(): void;
 }
 /**
  * @example

package/dist/index.js

@@ -18034,11 +18034,13 @@ function create_fragment78(ctx) {
   );
   let if_block1 = (
     /*config*/
-    ((_b = ctx[3].redo_undo) == null ? void 0 : _b.enable) !== false && create_if_block_26(ctx)
+    ((_b = ctx[3].redo_undo) == null ? void 0 : _b.enable) !== false && !/*hidden_redo_undo*/
+    ctx[6] && create_if_block_26(ctx)
   );
   let if_block2 = (
     /*config*/
-    ((_c = ctx[3].zoom_control) == null ? void 0 : _c.enable) !== false && create_if_block_112(ctx)
+    ((_c = ctx[3].zoom_control) == null ? void 0 : _c.enable) !== false && !/*hidden_zoom_control*/
+    ctx[7] && create_if_block_112(ctx)
   );
   let if_block3 = (
     /*config*/
@@ -18067,23 +18069,26 @@ function create_fragment78(ctx) {
       attr(div0, "class", name9 + "-view");
       attr(div1, "class", div1_class_value = name9 + "-" + /*config*/
       (((_a2 = ctx[3].toolbar) == null ? void 0 : _a2.placement) || "left"));
-      toggle_class(div1, "hidden", !/*toolbar_has_items*/
-      ctx[6] || !/*layout*/
-      (ctx[5] === "visible" || /*layout*/
-      ctx[5] === "toolbar-only"));
+      toggle_class(
+        div1,
+        "hidden",
+        /*hidden_toolbar*/
+        ctx[5]
+      );
       attr(div2, "class", name9 + "-bottom-left");
       toggle_class(
         div2,
         "hidden",
-        /*layout*/
-        ctx[5] !== "visible"
+        /*hidden_toolbar*/
+        ctx[5] && /*hidden_redo_undo*/
+        ctx[6]
       );
       attr(div3, "class", name9 + "-bottom-right");
       toggle_class(
         div3,
         "hidden",
-        /*layout*/
-        ctx[5] !== "visible"
+        /*hidden_page_control*/
+        ctx[8]
       );
       attr(div4, "class", name9 + "-root");
       toggle_class(div4, "loading", !/*app*/
@@ -18092,7 +18097,7 @@ function create_fragment78(ctx) {
     m(target, anchor) {
       insert(target, div4, anchor);
       append(div4, div0);
-      ctx[16](div0);
+      ctx[26](div0);
       append(div4, t0);
       append(div4, div1);
       if (if_block0)
@@ -18114,7 +18119,7 @@ function create_fragment78(ctx) {
           div0,
           "touchstart",
           /*focus_me*/
-          ctx[10],
+          ctx[13],
           { passive: true, capture: true }
         );
         mounted = true;
@@ -18150,21 +18155,24 @@ function create_fragment78(ctx) {
       (((_b2 = ctx2[3].toolbar) == null ? void 0 : _b2.placement) || "left"))) {
         attr(div1, "class", div1_class_value);
       }
-      if (!current || dirty & /*config, toolbar_has_items, layout*/
-      104) {
-        toggle_class(div1, "hidden", !/*toolbar_has_items*/
-        ctx2[6] || !/*layout*/
-        (ctx2[5] === "visible" || /*layout*/
-        ctx2[5] === "toolbar-only"));
+      if (!current || dirty & /*config, hidden_toolbar*/
+      40) {
+        toggle_class(
+          div1,
+          "hidden",
+          /*hidden_toolbar*/
+          ctx2[5]
+        );
       }
       if (
         /*config*/
-        ((_c2 = ctx2[3].redo_undo) == null ? void 0 : _c2.enable) !== false
+        ((_c2 = ctx2[3].redo_undo) == null ? void 0 : _c2.enable) !== false && !/*hidden_redo_undo*/
+        ctx2[6]
       ) {
         if (if_block1) {
           if_block1.p(ctx2, dirty);
-          if (dirty & /*config*/
-          8) {
+          if (dirty & /*config, hidden_redo_undo*/
+          72) {
             transition_in(if_block1, 1);
           }
         } else {
@@ -18182,12 +18190,13 @@ function create_fragment78(ctx) {
       }
       if (
         /*config*/
-        ((_d2 = ctx2[3].zoom_control) == null ? void 0 : _d2.enable) !== false
+        ((_d2 = ctx2[3].zoom_control) == null ? void 0 : _d2.enable) !== false && !/*hidden_zoom_control*/
+        ctx2[7]
       ) {
         if (if_block2) {
           if_block2.p(ctx2, dirty);
-          if (dirty & /*config*/
-          8) {
+          if (dirty & /*config, hidden_zoom_control*/
+          136) {
             transition_in(if_block2, 1);
           }
         } else {
@@ -18203,13 +18212,14 @@ function create_fragment78(ctx) {
         });
         check_outros();
       }
-      if (!current || dirty & /*layout*/
-      32) {
+      if (!current || dirty & /*hidden_toolbar, hidden_redo_undo*/
+      96) {
         toggle_class(
           div2,
           "hidden",
-          /*layout*/
-          ctx2[5] !== "visible"
+          /*hidden_toolbar*/
+          ctx2[5] && /*hidden_redo_undo*/
+          ctx2[6]
         );
       }
       if (
@@ -18235,13 +18245,13 @@ function create_fragment78(ctx) {
         });
         check_outros();
       }
-      if (!current || dirty & /*layout*/
-      32) {
+      if (!current || dirty & /*hidden_page_control*/
+      256) {
         toggle_class(
           div3,
           "hidden",
-          /*layout*/
-          ctx2[5] !== "visible"
+          /*hidden_page_control*/
+          ctx2[8]
         );
       }
       if (!current || dirty & /*app*/
@@ -18269,7 +18279,7 @@ function create_fragment78(ctx) {
     d(detaching) {
       if (detaching)
         detach(div4);
-      ctx[16](null);
+      ctx[26](null);
       if (if_block0)
         if_block0.d();
       if (if_block1)
@@ -18288,22 +18298,33 @@ function instance78($$self, $$props, $$invalidate) {
   let writable2;
   let boxState;
   let focusedApp;
+  let visibleApps;
   let toolbar_has_items;
-  let $focusedApp, $$unsubscribe_focusedApp = noop, $$subscribe_focusedApp = () => ($$unsubscribe_focusedApp(), $$unsubscribe_focusedApp = subscribe(focusedApp, ($$value) => $$invalidate(13, $focusedApp = $$value)), focusedApp);
-  let $boxState, $$unsubscribe_boxState = noop, $$subscribe_boxState = () => ($$unsubscribe_boxState(), $$unsubscribe_boxState = subscribe(boxState, ($$value) => $$invalidate(14, $boxState = $$value)), boxState);
-  let $writable, $$unsubscribe_writable = noop, $$subscribe_writable = () => ($$unsubscribe_writable(), $$unsubscribe_writable = subscribe(writable2, ($$value) => $$invalidate(15, $writable = $$value)), writable2);
+  let $focusedApp, $$unsubscribe_focusedApp = noop, $$subscribe_focusedApp = () => ($$unsubscribe_focusedApp(), $$unsubscribe_focusedApp = subscribe(focusedApp, ($$value) => $$invalidate(22, $focusedApp = $$value)), focusedApp);
+  let $boxState, $$unsubscribe_boxState = noop, $$subscribe_boxState = () => ($$unsubscribe_boxState(), $$unsubscribe_boxState = subscribe(boxState, ($$value) => $$invalidate(23, $boxState = $$value)), boxState);
+  let $visibleApps, $$unsubscribe_visibleApps = noop, $$subscribe_visibleApps = () => ($$unsubscribe_visibleApps(), $$unsubscribe_visibleApps = subscribe(visibleApps, ($$value) => $$invalidate(24, $visibleApps = $$value)), visibleApps);
+  let $writable, $$unsubscribe_writable = noop, $$subscribe_writable = () => ($$unsubscribe_writable(), $$unsubscribe_writable = subscribe(writable2, ($$value) => $$invalidate(25, $writable = $$value)), writable2);
   $$self.$$.on_destroy.push(() => $$unsubscribe_focusedApp());
   $$self.$$.on_destroy.push(() => $$unsubscribe_boxState());
+  $$self.$$.on_destroy.push(() => $$unsubscribe_visibleApps());
   $$self.$$.on_destroy.push(() => $$unsubscribe_writable());
   let { app = null } = $$props;
   let { theme = "light" } = $$props;
   let { language = "en" } = $$props;
   let { containerRef = void 0 } = $$props;
   let { config = {} } = $$props;
-  const AppsShowToolbar = ["DocsViewer", "Slide"];
+  let { force_show_toolbar = void 0 } = $$props;
+  let { force_show_redo_undo = void 0 } = $$props;
+  let { force_show_zoom_control = void 0 } = $$props;
+  let { force_show_page_control = void 0 } = $$props;
+  const AppsShowToolbar = ["DocsViewer", "Slide", "PDFjs"];
   let container;
   let layout = "hidden";
   let mounted = false;
+  let hidden_toolbar = false;
+  let hidden_redo_undo = false;
+  let hidden_zoom_control = false;
+  let hidden_page_control = false;
   onMount(() => {
     if (containerRef) {
       containerRef(container);
@@ -18332,47 +18353,73 @@ function instance78($$self, $$props, $$invalidate) {
     if ("language" in $$props2)
       $$invalidate(2, language = $$props2.language);
     if ("containerRef" in $$props2)
-      $$invalidate(11, containerRef = $$props2.containerRef);
+      $$invalidate(14, containerRef = $$props2.containerRef);
     if ("config" in $$props2)
       $$invalidate(3, config = $$props2.config);
+    if ("force_show_toolbar" in $$props2)
+      $$invalidate(15, force_show_toolbar = $$props2.force_show_toolbar);
+    if ("force_show_redo_undo" in $$props2)
+      $$invalidate(16, force_show_redo_undo = $$props2.force_show_redo_undo);
+    if ("force_show_zoom_control" in $$props2)
+      $$invalidate(17, force_show_zoom_control = $$props2.force_show_zoom_control);
+    if ("force_show_page_control" in $$props2)
+      $$invalidate(18, force_show_page_control = $$props2.force_show_page_control);
   };
   $$self.$$.update = () => {
     if ($$self.$$.dirty & /*app*/
     1) {
-      $$subscribe_writable($$invalidate(9, writable2 = app == null ? void 0 : app.writable));
+      $$subscribe_writable($$invalidate(12, writable2 = app == null ? void 0 : app.writable));
+    }
+    if ($$self.$$.dirty & /*app*/
+    1) {
+      $$subscribe_boxState($$invalidate(11, boxState = app == null ? void 0 : app.boxState));
     }
     if ($$self.$$.dirty & /*app*/
     1) {
-      $$subscribe_boxState($$invalidate(8, boxState = app == null ? void 0 : app.boxState));
+      $$subscribe_focusedApp($$invalidate(10, focusedApp = app == null ? void 0 : app.focusedApp));
     }
     if ($$self.$$.dirty & /*app*/
     1) {
-      $$subscribe_focusedApp($$invalidate(7, focusedApp = app == null ? void 0 : app.focusedApp));
+      $$subscribe_visibleApps($$invalidate(9, visibleApps = app == null ? void 0 : app.visibleApps));
     }
-    if ($$self.$$.dirty & /*$writable, $boxState, $focusedApp*/
-    57344) {
+    if ($$self.$$.dirty & /*$writable, app, $visibleApps, $boxState, $focusedApp*/
+    62914561) {
       if (!$writable) {
-          $$invalidate(5, layout = "hidden");
+          $$invalidate(19, layout = "hidden");
+        } else if (app == null ? void 0 : app.appInMainViewPlugin) {
+          if ($visibleApps && $visibleApps.size > 0) {
+            if ($boxState === "maximized") {
+              if (AppsShowToolbar.some((kind) => ($focusedApp || "").includes(kind))) {
+                $$invalidate(19, layout = "toolbar-only");
+              } else {
+                $$invalidate(19, layout = "hidden");
+              }
+            } else {
+              $$invalidate(19, layout = "visible");
+            }
+          } else {
+            $$invalidate(19, layout = "visible");
+          }
         } else if ($boxState === "maximized") {
           if ($focusedApp && AppsShowToolbar.some((kind) => ($focusedApp || "").includes(kind))) {
-            $$invalidate(5, layout = "toolbar-only");
+            $$invalidate(19, layout = "toolbar-only");
           } else {
-            $$invalidate(5, layout = "hidden");
+            $$invalidate(19, layout = "hidden");
           }
         } else {
-          $$invalidate(5, layout = "visible");
+          $$invalidate(19, layout = "visible");
         }
     }
     if ($$self.$$.dirty & /*config*/
     8) {
-      $$invalidate(6, toolbar_has_items = !config.toolbar || !config.toolbar.items || !config.toolbar.apps || config.toolbar.items.length > 0 || config.toolbar.apps.enable !== false);
+      $$invalidate(21, toolbar_has_items = !config.toolbar || !config.toolbar.items || !config.toolbar.apps || config.toolbar.items.length > 0 || config.toolbar.apps.enable !== false);
     }
     if ($$self.$$.dirty & /*app, container*/
     17) {
       try {
           if (app && container) {
             app.bindContainer(container);
-            $$invalidate(12, mounted = true);
+            $$invalidate(20, mounted = true);
           }
         } catch (err) {
           console.error("[fastboard] An error occurred while binding container");
@@ -18380,11 +18427,51 @@ function instance78($$self, $$props, $$invalidate) {
         }
     }
     if ($$self.$$.dirty & /*app, theme, mounted*/
-    4099) {
+    1048579) {
       if (app && theme && mounted) {
           app.manager.setPrefersColorScheme(theme);
         }
     }
+    if ($$self.$$.dirty & /*force_show_toolbar, toolbar_has_items, layout*/
+    2654208) {
+      if (force_show_toolbar === false) {
+          $$invalidate(5, hidden_toolbar = true);
+        } else if (force_show_toolbar === true) {
+          $$invalidate(5, hidden_toolbar = false);
+        } else {
+          $$invalidate(5, hidden_toolbar = !toolbar_has_items || !(layout === "visible" || layout === "toolbar-only"));
+        }
+    }
+    if ($$self.$$.dirty & /*force_show_redo_undo, layout*/
+    589824) {
+      if (force_show_redo_undo === false) {
+          $$invalidate(6, hidden_redo_undo = true);
+        } else if (force_show_redo_undo === true) {
+          $$invalidate(6, hidden_redo_undo = false);
+        } else {
+          $$invalidate(6, hidden_redo_undo = layout !== "visible");
+        }
+    }
+    if ($$self.$$.dirty & /*force_show_zoom_control, layout*/
+    655360) {
+      if (force_show_zoom_control === false) {
+          $$invalidate(7, hidden_zoom_control = true);
+        } else if (force_show_zoom_control === true) {
+          $$invalidate(7, hidden_zoom_control = false);
+        } else {
+          $$invalidate(7, hidden_zoom_control = layout !== "visible");
+        }
+    }
+    if ($$self.$$.dirty & /*force_show_page_control, layout*/
+    786432) {
+      if (force_show_page_control === false) {
+          $$invalidate(8, hidden_page_control = true);
+        } else if (force_show_page_control === true) {
+          $$invalidate(8, hidden_page_control = false);
+        } else {
+          $$invalidate(8, hidden_page_control = layout !== "visible");
+        }
+    }
   };
   return [
     app,
@@ -18392,16 +18479,26 @@ function instance78($$self, $$props, $$invalidate) {
     language,
     config,
     container,
-    layout,
-    toolbar_has_items,
+    hidden_toolbar,
+    hidden_redo_undo,
+    hidden_zoom_control,
+    hidden_page_control,
+    visibleApps,
     focusedApp,
     boxState,
     writable2,
     focus_me,
     containerRef,
+    force_show_toolbar,
+    force_show_redo_undo,
+    force_show_zoom_control,
+    force_show_page_control,
+    layout,
     mounted,
+    toolbar_has_items,
     $focusedApp,
     $boxState,
+    $visibleApps,
     $writable,
     div0_binding
   ];
@@ -18413,8 +18510,12 @@ var Fastboard = class extends SvelteComponent {
       app: 0,
       theme: 1,
       language: 2,
-      containerRef: 11,
-      config: 3
+      containerRef: 14,
+      config: 3,
+      force_show_toolbar: 15,
+      force_show_redo_undo: 16,
+      force_show_zoom_control: 17,
+      force_show_page_control: 18
     });
   }
 };
@@ -18462,6 +18563,66 @@ function createUI(app, div) {
         fastboard.$destroy();
       }
       fastboard = void 0;
+    },
+    forceShowToolbar() {
+      if (fastboard) {
+        fastboard.$set({ force_show_toolbar: true });
+      }
+    },
+    forceHideToolbar() {
+      if (fastboard) {
+        fastboard.$set({ force_show_toolbar: false });
+      }
+    },
+    recoverToolbar() {
+      if (fastboard) {
+        fastboard.$set({ force_show_toolbar: void 0 });
+      }
+    },
+    forceShowPageControl() {
+      if (fastboard) {
+        fastboard.$set({ force_show_page_control: true });
+      }
+    },
+    forceHidePageControl() {
+      if (fastboard) {
+        fastboard.$set({ force_show_page_control: false });
+      }
+    },
+    recoverPageControl() {
+      if (fastboard) {
+        fastboard.$set({ force_show_page_control: void 0 });
+      }
+    },
+    forceShowRedoUndo() {
+      if (fastboard) {
+        fastboard.$set({ force_show_redo_undo: true });
+      }
+    },
+    forceHideRedoUndo() {
+      if (fastboard) {
+        fastboard.$set({ force_show_redo_undo: false });
+      }
+    },
+    recoverRedoUndo() {
+      if (fastboard) {
+        fastboard.$set({ force_show_redo_undo: void 0 });
+      }
+    },
+    forceShowZoomControl() {
+      if (fastboard) {
+        fastboard.$set({ force_show_zoom_control: true });
+      }
+    },
+    forceHideZoomControl() {
+      if (fastboard) {
+        fastboard.$set({ force_show_zoom_control: false });
+      }
+    },
+    recoverZoomControl() {
+      if (fastboard) {
+        fastboard.$set({ force_show_zoom_control: void 0 });
+      }
     }
   };
   if (div) {