microboard-ui-temp 0.1.74 → 0.1.75

package/dist/index.css

@@ -2871,6 +2871,12 @@ a.link_jFMnzg {
   background-color: #f7f7f8;
 }
 
+.quaternary_Lhh5GA {
+  color: #fff;
+  background-color: #924fe8;
+  border: 1px solid #924fe8;
+}
+
 .quaternary_Lhh5GA:hover {
   background-color: #b799f5;
   border: 1px solid #924fe8;

package/dist/index.js

@@ -330907,15 +330907,15 @@ function useAppContext() {
 
 // src/App/useAccount.ts
 function useAccount2() {
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const forceUpdate = useForceUpdate2();
   import_react110.useLayoutEffect(() => {
-    app2.account.subject.subscribe(forceUpdate);
+    app.account.subject.subscribe(forceUpdate);
     return () => {
-      app2.account.subject.unsubscribe(forceUpdate);
+      app.account.subject.unsubscribe(forceUpdate);
     };
   }, []);
-  return app2.account;
+  return app.account;
 }
 
 // src/features/WalletLoginButton/WalletLoginButton.tsx
@@ -339632,7 +339632,7 @@ var MIRO_IMG_AUTH_CLIPBOARD = Symbol("imgAuthClipboardNotification");
 var ImgAuthClipboardModal = () => {
   const { t: t10 } = useTranslation();
   const { closeModal: closeModal2 } = useUiModalContext();
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const onAuthClick = () => {
     closeModal2();
     const clientId = import.meta.env.MIRO_CLIENT_ID;
@@ -339642,7 +339642,7 @@ var ImgAuthClipboardModal = () => {
   };
   const onContinueClick = () => {
     closeModal2();
-    useCopyBoardItems(app2.getBoard(), app2.account.accessToken, undefined, true);
+    useCopyBoardItems(app.getBoard(), app.account.accessToken, undefined, true);
   };
   return /* @__PURE__ */ import_react141.default.createElement(UiModal, {
     modalId: MIRO_IMG_AUTH_CLIPBOARD,
@@ -345098,14 +345098,14 @@ var AIContextProvider = ({
   children
 }) => {
   const { t: t10 } = useTranslation();
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const [model, setModel] = import_react176.useState("gpt-4o-mini");
   const [responseNodeId, setResponseNodeId] = import_react176.useState();
   const [quotedText, setQuotedText] = import_react176.useState();
   const account = useAccount2();
   const { openModal: openModal2 } = useUiModalContext();
   const stopStream = async (boardId, itemId, account2) => {
-    const connection = app2.getConnection();
+    const connection = app.getConnection();
     const stopMessage = {
       type: "AiChat",
       boardId,
@@ -345118,7 +345118,7 @@ var AIContextProvider = ({
     await account2.fetchBillingInfo();
   };
   function createNodesWithConnectors(idea, itemToContinueThread, contextItems = [], isIdeaFromInput = true) {
-    const board = app2.getBoard();
+    const board = app.getBoard();
     const reverseIndexMap = { 0: 1, 1: 0, 2: 3, 3: 2 };
     let requestAdded;
     if (itemToContinueThread && itemToContinueThread.itemType === "AINode" && itemToContinueThread.getIsUserRequest() && !isIdeaFromInput) {
@@ -345169,7 +345169,7 @@ var AIContextProvider = ({
     return { responseAdded, requestAdded };
   }
   const tryToSendGenerationRequest = async (fallback3, startGenerationCb) => {
-    const board = app2.getBoard();
+    const board = app.getBoard();
     if (!account.isLoggedIn) {
       return openModal2(AI_UNAVAILABLE_MODAL_ID);
     }
@@ -345206,8 +345206,8 @@ var AIContextProvider = ({
     }
   };
   const startGeneration = async () => {
-    const connection = app2.getConnection();
-    const board = app2.getBoard();
+    const connection = app.getConnection();
+    const board = app.getBoard();
     const ideaFromSelection = getIdeaFromSelection(board.selection.items.list());
     if (!connection) {
       console.error("Ws no open");
@@ -345297,26 +345297,14 @@ var import_react178 = __toESM(require_react(), 1);
 // src/App/useBoardSubscription.ts
 var import_react177 = __toESM(require_react(), 1);
 function useAppSubscription(subscription) {
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   import_react177.useLayoutEffect(() => {
-    app2.subscriptions.add(subscription);
+    app.subscriptions.add(subscription);
     return () => {
-      app2.subscriptions.remove(subscription);
+      app.subscriptions.remove(subscription);
     };
   }, []);
 }
-function useTools() {
-  const { board } = useAppContext();
-  const [tools, setTools] = import_react177.default.useState(board.tools);
-  useAppSubscription({
-    subjects: ["tools"],
-    observer: () => {
-      setTools(board.tools);
-    }
-  });
-  import_react177.useEffect(() => {}, [tools]);
-  return tools;
-}
 
 // src/entities/AIInput/AIGenerationButton.tsx
 var AiGenerationButton = () => {
@@ -345795,7 +345783,7 @@ var getCorrectEnding = (number3) => {
 var sessionStorage5 = new SessionStorage2;
 var AIInput = () => {
   const { t: t10 } = useTranslation();
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const [inputValue, setInputValue] = import_react183.useState("");
   const disabledRef = import_react183.useRef(!!board.aiGeneratingOnItem);
   const inputRef = import_react183.useRef(null);
@@ -345879,7 +345867,7 @@ var AIInput = () => {
     }
   };
   const sendInputData = async () => {
-    const connection = app2.getConnection();
+    const connection = app.getConnection();
     if (!connection) {
       console.error("Ws no open");
       return;
@@ -345977,7 +345965,7 @@ var AIInput = () => {
     }
   };
   const handleStopClick = async () => {
-    const boardId2 = app2.getBoard().getBoardId();
+    const boardId2 = app.getBoard().getBoardId();
     if (responseNodeId) {
       await stopStream(boardId2, responseNodeId, account);
       board.aiGeneratingOnItem = undefined;
@@ -346319,7 +346307,7 @@ class CanvasBase extends React146.Component {
 var Canvas = withRouter(CanvasBase);
 // src/entities/Canvas/CanvasNoRouter.tsx
 var import_react186 = __toESM(require_react(), 1);
-var CanvasNoRouter = ({ app: app2, board, children }) => {
+var CanvasNoRouter = ({ app, board, children }) => {
   const stageRef = import_react186.useRef(null);
   const canvasRef = import_react186.useRef(null);
   const cursorsCanvasRef = import_react186.useRef(null);
@@ -346351,13 +346339,13 @@ var CanvasNoRouter = ({ app: app2, board, children }) => {
   }, [board]);
   const initCanvasRendering = import_react186.useCallback(() => {
     renderToContext();
-    app2.subscriptions.add(drawingContextSubscription);
-    app2.subscriptions.add(cursorSubscription);
-    app2.subscriptions.add(resizeSubscription);
-  }, [app2, renderToContext]);
+    app.subscriptions.add(drawingContextSubscription);
+    app.subscriptions.add(cursorSubscription);
+    app.subscriptions.add(resizeSubscription);
+  }, [app, renderToContext]);
   import_react186.useEffect(() => {
     const stage = stageRef.current;
-    const controller16 = app2.controller;
+    const controller16 = app.controller;
     if (stage) {
       const handlePointerDown = (event) => {
         controller16.onPointerDown(event);
@@ -346391,13 +346379,13 @@ var CanvasNoRouter = ({ app: app2, board, children }) => {
         });
         stage.removeEventListener("dblclick", controller16.onClick);
         stage.removeEventListener("pointermove", controller16.onPointerMove);
-        app2.subscriptions.remove(drawingContextSubscription);
-        app2.subscriptions.remove(cursorSubscription);
-        app2.subscriptions.remove(resizeSubscription);
+        app.subscriptions.remove(drawingContextSubscription);
+        app.subscriptions.remove(cursorSubscription);
+        app.subscriptions.remove(resizeSubscription);
       };
     }
     return () => {};
-  }, [app2, initCanvasRendering]);
+  }, [app, initCanvasRendering]);
   const drawingContextSubscription = {
     observer: renderToContext,
     subjects: ["camera", "items", "tools", "selection", "presence"]
@@ -346549,15 +346537,15 @@ function AccessDeniedModal() {
 // src/App/useBoardsList.ts
 var import_react188 = __toESM(require_react(), 1);
 function useBoardsList() {
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const forceUpdate = useForceUpdate2();
   import_react188.useEffect(() => {
-    app2.boardsList.subject.subscribe(forceUpdate);
+    app.boardsList.subject.subscribe(forceUpdate);
     return () => {
-      app2.boardsList.subject.unsubscribe(forceUpdate);
+      app.boardsList.subject.unsubscribe(forceUpdate);
     };
   }, []);
-  return app2.boardsList;
+  return app.boardsList;
 }
 
 // src/features/ContextMenu/ContextMenu.tsx
@@ -352187,15 +352175,15 @@ function SidePanelContextProvider({
   const [isOpen, setIsOpen] = import_react206.useState(false);
   const [stamp, setStamp] = import_react206.useState(null);
   const [highlighted, setHighlighted] = import_react206.useState(false);
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const navigate = useNavigate();
   const boardsList = useBoardsList();
   const timeoutRef = import_react206.useRef();
   const { close } = useContextMenuContext();
   const forceUpdate = useForceUpdate2();
   import_react206.useEffect(() => {
-    app2.boardSubject.subscribe(forceUpdate);
-    return () => app2.boardSubject.unsubscribe(forceUpdate);
+    app.boardSubject.subscribe(forceUpdate);
+    return () => app.boardSubject.unsubscribe(forceUpdate);
   }, []);
   const toggleSideMenu = () => {
     setIsOpen((prev) => {
@@ -352226,7 +352214,7 @@ function SidePanelContextProvider({
   }, [isOpen]);
   const handleAddNew = async (cb) => {
     const boardId = await boardsList.createBoard();
-    await app2.openBoard(boardId);
+    await app.openBoard(boardId);
     navigate(`/boards/${boardId}`, {
       replace: true
     });
@@ -352526,7 +352514,7 @@ var FolderItem_module_default = {
 
 // src/entities/Folder/FolderItem.tsx
 var FolderItem = import_react211.forwardRef(({ board, folder, handleOpenBoard }, ref4) => {
-  const { app: app2, board: currentBoard } = useAppContext();
+  const { app, board: currentBoard } = useAppContext();
   const navigate = useNavigate();
   const { open } = useContextMenuContext();
   const { setRenamingId, setNewName, renamingId } = useRenameContext();
@@ -352550,7 +352538,7 @@ var FolderItem = import_react211.forwardRef(({ board, folder, handleOpenBoard },
     if (handleOpenBoard) {
       return handleOpenBoard(board);
     }
-    await app2.openBoard(board.id);
+    await app.openBoard(board.id);
     navigate(`/boards/${board.id}`);
   }, (ev) => {
     ev.preventDefault();
@@ -352917,7 +352905,7 @@ function ContextMenu() {
   const { setNewName, setRenamingId } = useRenameContext();
   const boardsList = useBoardsList();
   const account = useAccount2();
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const { t: t10 } = useTranslation();
   const { openModalConfirm } = useConfirmModalContext();
   const { openModal: openModal2 } = useUiModalContext();
@@ -352951,34 +352939,34 @@ function ContextMenu() {
     setRenamingId(boardId2);
     setNewName(boardInfo2?.title ?? "");
     setId(boardId2);
-    app2.openBoard(boardId2).then(() => navigate(`/boards/${boardId2}`));
+    app.openBoard(boardId2).then(() => navigate(`/boards/${boardId2}`));
   };
   const deserializeBoard = (stringedHTML, emit5 = false) => {
     if (emit5) {
-      app2.getBoard().deserializeHTMLAndEmit(stringedHTML);
+      app.getBoard().deserializeHTMLAndEmit(stringedHTML);
     } else {
-      app2.getBoard().deserializeHTML(stringedHTML);
+      app.getBoard().deserializeHTML(stringedHTML);
     }
-    app2.render();
-    const sumMbr = app2.getBoard().items.listAll().reduce((acc, item) => {
+    app.render();
+    const sumMbr = app.getBoard().items.listAll().reduce((acc, item) => {
       if (!acc) {
         return item.getMbr();
       }
       return acc.combine(item.getMbr());
     }, undefined);
     if (sumMbr) {
-      app2.getBoard().camera.zoomToFit(sumMbr);
+      app.getBoard().camera.zoomToFit(sumMbr);
     }
   };
   const handleEditLocalFile = async (ev) => {
     ev.preventDefault();
     ev.stopPropagation();
     setIsEditingLocalFile(true);
-    const stringedHTML = await app2.openAndEditFile();
+    const stringedHTML = await app.openAndEditFile();
     if (stringedHTML) {
       close();
       setId(boardId);
-      app2.openBoardFromFile();
+      app.openBoardFromFile();
       navigate(`/boards/local`);
       deserializeBoard(stringedHTML);
     }
@@ -353023,7 +353011,7 @@ function ContextMenu() {
       const boardId2 = await boardsList.createBoard(boardName, folderInfo?.type === exports_folders.FolderType.DRAFTS, folderId ?? undefined);
       close();
       setId(boardId2);
-      await app2.openBoard(boardId2);
+      await app.openBoard(boardId2);
       navigate(`/boards/${boardId2}`);
       deserializeBoard(htmlContent, true);
     }
@@ -353068,7 +353056,7 @@ function ContextMenu() {
       }
       if (boardId === currentBoardId) {
         navigate("/boards/blank");
-        await app2.openBoard("blank");
+        await app.openBoard("blank");
         board.disconnect();
       }
       setIsDeletingBoard(true);
@@ -353096,7 +353084,7 @@ function ContextMenu() {
         return;
       }
       if (boardsList.isFolderContainsBoard(folderId, board.getBoardId())) {
-        app2.openBoard("blank");
+        app.openBoard("blank");
         navigate("/boards/blank");
       }
       boardsList.removeFolder(folderId);
@@ -353243,7 +353231,7 @@ function ContextMenuItem({
 // src/App/useDomMbr.ts
 var import_react216 = __toESM(require_react(), 1);
 function useDomMbr({
-  app: app2,
+  app,
   board,
   ref: ref4,
   subjects = ["camera", "selection"],
@@ -353588,7 +353576,7 @@ var ConnectorType_module_default = {
 var MENU_NAME = "ConnectorType";
 function ConnectorType() {
   const { toggleMenu, openedMenu, panelMbr, windowHeight } = usePanelContext();
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const { t: t10 } = useTranslation();
   const connectorType = board.selection.getConnectorLineStyle();
   const connectorLineWidth = board.selection.getConnectorLineWidth();
@@ -353598,17 +353586,17 @@ function ConnectorType() {
   };
   const handlePick = (type) => {
     board.selection.setConnectorLineStyle(type);
-    app2.sessionStorage.setConnectorLineStyle(type);
+    app.sessionStorage.setConnectorLineStyle(type);
     toggleMenu("None");
   };
   const handleStrokeStylePick = (style2) => {
     board.selection.setStrokeStyle(style2);
-    app2.sessionStorage.setConnectorStrokeStyle(style2);
+    app.sessionStorage.setConnectorStrokeStyle(style2);
     toggleMenu("None");
   };
   const handleSliderChange = (width2) => {
     board.selection.setStrokeWidth(width2);
-    app2.sessionStorage.setConnectorLineWidth(width2);
+    app.sessionStorage.setConnectorLineWidth(width2);
   };
   return /* @__PURE__ */ import_react223.default.createElement(ButtonWithMenu, {
     menuName: MENU_NAME,
@@ -354078,7 +354066,7 @@ var EndPointer_module_default = {
 var MENU_NAME3 = "EndPointer";
 function EndPointer() {
   const { toggleMenu, openedMenu, panelMbr, windowHeight } = usePanelContext();
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const { t: t10 } = useTranslation();
   const pointerStartStyle = board.selection.getEndPointerStyle();
   const handleClick = () => {
@@ -354086,7 +354074,7 @@ function EndPointer() {
   };
   const handlePick = (type) => {
     board.selection.setEndPointerStyle(type);
-    app2.sessionStorage.setConnectorPointer(type, "end");
+    app.sessionStorage.setConnectorPointer(type, "end");
     toggleMenu("None");
   };
   return /* @__PURE__ */ import_react236.default.createElement(ButtonWithMenu, {
@@ -354971,7 +354959,7 @@ var StartPointer_module_default = {
 var MENU_NAME11 = "StartPointer";
 function StartPointer() {
   const { toggleMenu, openedMenu, panelMbr, windowHeight } = usePanelContext();
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const { t: t10 } = useTranslation();
   const pointerStartStyle = board.selection.getStartPointerStyle();
   const handleClick = () => {
@@ -354979,7 +354967,7 @@ function StartPointer() {
   };
   const handlePick = (type) => {
     board.selection.setStartPointerStyle(type);
-    app2.sessionStorage.setConnectorPointer(type, "start");
+    app.sessionStorage.setConnectorPointer(type, "start");
     toggleMenu("None");
   };
   return /* @__PURE__ */ import_react255.default.createElement(ButtonWithMenu, {
@@ -355535,7 +355523,7 @@ var import_react266 = __toESM(require_react(), 1);
 var MENU_NAME17 = "ConnectorLineColor";
 function ConnectorLineColor() {
   const { toggleMenu, openedMenu, panelMbr, windowHeight } = usePanelContext();
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const { t: t10 } = useTranslation();
   const connectorLineColor = board.selection.getConnectorLineColor();
   const handleClick = () => {
@@ -355543,11 +355531,11 @@ function ConnectorLineColor() {
   };
   const handlePick = (color2) => {
     board.selection.setStrokeColor(color2);
-    app2.sessionStorage.setConnectorFillColor(color2);
+    app.sessionStorage.setConnectorFillColor(color2);
     toggleMenu("None");
   };
   const handleCustomPick = (color2) => {
-    app2.sessionStorage.setConnectorFillColor(color2);
+    app.sessionStorage.setConnectorFillColor(color2);
     board.selection.setStrokeColor(color2);
   };
   const isPredefinedColor = conf.SHAPE_STROKE_COLORS.some((color2) => color2 === connectorLineColor);
@@ -356431,11 +356419,11 @@ function FlipDeck({ rounded = "none" }) {
 
 // src/features/ContextPanel/ContextPanel.tsx
 function ContextPanel() {
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const [openedMenu, setOpenedMenu] = import_react289.useState("None");
   const panelRef = import_react289.useRef(null);
   const mbr = useDomMbr({
-    app: app2,
+    app,
     board,
     ref: panelRef
   });
@@ -356769,7 +356757,7 @@ var HyperLink_module_default = {
 var HyperLink = () => {
   const [currentLink, setCurrentLink] = import_react292.useState(null);
   const [isTooltipUnderPointer, setIsTooltipUnderPointer] = import_react292.useState(false);
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const forceUpdate = useForceUpdate2();
   const link2 = board.items.getUnderPointer().pop()?.getRichText()?.getHyperLinkByPointerCoordinates(board.pointer.point);
   if (link2 && !isTooltipUnderPointer && link2.hyperLink !== currentLink?.hyperLink) {
@@ -356784,7 +356772,7 @@ var HyperLink = () => {
   });
   const linkContainerRef = import_react292.useRef(null);
   const mbr = useDomMbr({
-    app: app2,
+    app,
     board,
     ref: linkContainerRef,
     targetMbr: currentLink?.linkMbr,
@@ -356827,7 +356815,7 @@ var HyperLinkInput_module_default = {
 var HyperLinkInput = () => {
   const [inputValue, setInputValue] = import_react293.useState("");
   const { isEditingLink, setIsEditingLink, hyperLinkData, setHyperLinkData } = useHyperLinkContext();
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const { t: t10 } = useTranslation();
   const containerRef = useClickOutside(() => {
     if (isEditingLink) {
@@ -356835,7 +356823,7 @@ var HyperLinkInput = () => {
     }
   }, [], true);
   const mbr = useDomMbr({
-    app: app2,
+    app,
     board,
     ref: containerRef,
     targetMbr: board.selection.items.getSingle()?.getRichText()?.getMbr(),
@@ -356970,7 +356958,7 @@ var HyperLinkInput = () => {
 // src/features/ImportMiro/ImportMiroBoards/ImportMiro.tsx
 var import_react294 = __toESM(require_react(), 1);
 function ImportMiro() {
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const navigate = useNavigate();
   const location3 = useLocation();
   const searchParams = new URLSearchParams(location3.search);
@@ -357000,19 +356988,19 @@ function ImportMiro() {
     }
   };
   const openSeenLastBoard = async () => {
-    const lastSeenBoardId = app2.getLastBoardId();
+    const lastSeenBoardId = app.getLastBoardId();
     if (!lastSeenBoardId) {
       console.error("Last seen board is undefined");
       return;
     }
-    await app2.openBoard(lastSeenBoardId).then(() => {
+    await app.openBoard(lastSeenBoardId).then(() => {
       navigate(`/boards/${lastSeenBoardId}?clipboard=true`, {
         replace: true
       });
-      app2.render();
+      app.render();
     });
-    const lastSeenBoard = app2.getBoard();
-    useCopyBoardItems(lastSeenBoard, app2.account.accessToken);
+    const lastSeenBoard = app.getBoard();
+    useCopyBoardItems(lastSeenBoard, app.account.accessToken);
   };
   import_react294.useEffect(() => {
     const token = api10.get("miro_accessToken");
@@ -357031,14 +357019,14 @@ function ImportMiro() {
 // src/features/ItemTooltip/ItemTooltip.tsx
 var import_react295 = __toESM(require_react(), 1);
 function ItemTooltip() {
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const { t: t10 } = useTranslation();
   const { items, camera } = board;
   const [openedMenu, setOpenedMenu] = import_react295.useState("HoverUnderPointer");
   const panelRef = import_react295.useRef(null);
   const placeholders = items.getUnderPointer().filter((item) => item.itemType === "Placeholder" && item.getMiroData()?.type !== "image" /* IMAGE */);
   const mbr = useDomMbr({
-    app: app2,
+    app,
     board,
     ref: panelRef,
     subjects: undefined,
@@ -357321,18 +357309,18 @@ var LocalFileSaveProgress_module_default = {
 
 // src/features/LocalFileSavingProgress/LocalFileSaveProgress.tsx
 var LocalFileSaveProgress = () => {
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const forceUpdate = useForceUpdate2();
   useAppSubscription({
     subjects: ["board"],
     observer: forceUpdate
   });
-  if (!app2.getBoard().getBoardId().includes("local") || !app2.getLocalEditFileHandler()) {
+  if (!app.getBoard().getBoardId().includes("local") || !app.getLocalEditFileHandler()) {
     return null;
   }
   return /* @__PURE__ */ import_react299.default.createElement(UiPanel, {
     className: LocalFileSaveProgress_module_default.unauthText
-  }, app2.getBoard().events?.log.saveFileTimeout ? "Saving..." : "Saved");
+  }, app.getBoard().events?.log.saveFileTimeout ? "Saving..." : "Saved");
 };
 var LocalFileSaveProgress_default = LocalFileSaveProgress;
 // src/features/Modal/CookiesModal.tsx
@@ -357469,8 +357457,8 @@ var import_react302 = __toESM(require_react(), 1);
 function InactiveBoardHidder({
   children
 }) {
-  const { app: app2 } = useAppContext();
-  const appBoardId = app2.getBoard().getBoardId();
+  const { app } = useAppContext();
+  const appBoardId = app.getBoard().getBoardId();
   if (appBoardId === "blank") {
     return /* @__PURE__ */ import_react302.default.createElement(import_react302.default.Fragment, null);
   }
@@ -418448,7 +418436,7 @@ ButtonWithMenu2.displayName = "ButtonWithMenu";
 
 // src/features/ToolsPanel/Buttons/AddConnector.tsx
 function AddConnector2() {
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const { t: t11 } = useTranslation();
   const [isActive, setIsActive] = import_react318.useState(Boolean(board.tools.getAddConnector()));
   const addTool = board.tools.getAddConnector();
@@ -418467,7 +418455,7 @@ function AddConnector2() {
     const tool = board.tools.getAddConnector();
     if (tool) {
       tool.applyLineStyle(lineStyle);
-      app2.sessionStorage.setConnectorLineStyle(lineStyle);
+      app.sessionStorage.setConnectorLineStyle(lineStyle);
       setIsActive(false);
     }
   };
@@ -419905,7 +419893,7 @@ function getOperationAppendix(operation) {
   }
   if (operation.method === "transformMany") {
     const appendixes = Object.values(operation.items).map((op2) => getOperationAppendix(op2));
-    if (appendixes.every((app2) => app2 === appendixes[0])) {
+    if (appendixes.every((app) => app === appendixes[0])) {
       appendix.push(appendixes[0]);
     }
   }
@@ -420632,7 +420620,12 @@ function AddGameItem() {
 function ToolsPanel() {
   const [openedMenu, setOpenedMenu] = import_react354.useState("None");
   const toggleMenu = (menu) => setOpenedMenu((prev2) => prev2 === menu ? "None" : menu);
-  useTools();
+  const { app } = useAppContext();
+  const forceUpdate = useForceUpdate2();
+  useAppSubscription({
+    subjects: ["tools"],
+    observer: forceUpdate
+  });
   import_react354.useEffect(() => {}, [window.showDebug]);
   return /* @__PURE__ */ import_react354.default.createElement(PanelContext2.Provider, {
     value: { toggleMenu, openedMenu }
@@ -421975,7 +421968,7 @@ var TogglePresenceRender_module_default = {
 var TogglePresenceRender = () => {
   const { t: t11 } = useTranslation();
   const [cursorsActive, setCursorsActive] = import_react370.useState(true);
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   return /* @__PURE__ */ import_react370.default.createElement(UiButton, {
     id: "tool-cursors-toggle",
     tooltipPosition: "bottom",
@@ -421985,7 +421978,7 @@ var TogglePresenceRender = () => {
     variant: "secondary",
     rounded: "none",
     onClick: () => {
-      const cursorsEnabled = app2.getBoard().presence.toggleCursorsRendering();
+      const cursorsEnabled = app.getBoard().presence.toggleCursorsRendering();
       setCursorsActive(cursorsEnabled);
     }
   }, /* @__PURE__ */ import_react370.default.createElement(Icon, {
@@ -422827,13 +422820,13 @@ var CommentContainer = ({ comment: comment3 }) => {
   const commentRef = import_react384.useRef(null);
   const [isPreviewOpen, setIsPreviewOpen] = import_react384.useState(false);
   const initialCommentPosition = import_react384.useRef(comment3.getAnchorPoint());
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const { openedThreadId, setOpenedThreadId, setMovingComment, movingComment } = useCommentsContext();
   const movingCommentRef = import_react384.useRef(movingComment);
   const isThreadOpen = openedThreadId === comment3.getId();
   const account = useAccount2();
   const mbr = useDomMbr({
-    app: app2,
+    app,
     board,
     ref: isThreadOpen ? threadPanelRef : commentContainerRef,
     targetMbr: comment3.getAnchorMbr(),
@@ -422859,14 +422852,14 @@ var CommentContainer = ({ comment: comment3 }) => {
   const width3 = 12 + 24 + 18 * (commentators.length > 3 ? 2 : commentators.length - 1);
   import_react384.useEffect(() => {
     if (commentRef.current) {
-      commentRef.current.addEventListener("wheel", app2.controller.onWheel, {
+      commentRef.current.addEventListener("wheel", app.controller.onWheel, {
         capture: true,
         passive: false
       });
     }
     return () => {
       if (commentRef.current) {
-        commentRef.current.removeEventListener("wheel", app2.controller.onWheel);
+        commentRef.current.removeEventListener("wheel", app.controller.onWheel);
       }
     };
   }, [isThreadOpen]);
@@ -422985,10 +422978,10 @@ var CreateComment = ({
 }) => {
   const formRef = import_react385.useRef(null);
   const [value2, setValue] = import_react385.useState("");
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const account = useAccount2();
   const mbr = useDomMbr({
-    app: app2,
+    app,
     board,
     ref: formRef,
     targetMbr: comment3.getMbr(),
@@ -423041,10 +423034,10 @@ var Cluster_module_default = {
 // src/entities/comments/Cluster/Cluster.tsx
 var Cluster = ({ comments }) => {
   const clusterRef = import_react386.useRef(null);
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const account = useAccount2();
   const mbr = useDomMbr({
-    app: app2,
+    app,
     board,
     ref: clusterRef,
     targetMbr: comments[0].getAnchorMbr(),
@@ -423053,14 +423046,14 @@ var Cluster = ({ comments }) => {
   });
   import_react386.useEffect(() => {
     if (clusterRef.current) {
-      clusterRef.current.addEventListener("wheel", app2.controller.onWheel, {
+      clusterRef.current.addEventListener("wheel", app.controller.onWheel, {
         capture: true,
         passive: false
       });
     }
     return () => {
       if (clusterRef.current) {
-        clusterRef.current.removeEventListener("wheel", app2.controller.onWheel);
+        clusterRef.current.removeEventListener("wheel", app.controller.onWheel);
       }
     };
   }, []);
@@ -423540,7 +423533,7 @@ var CommentsPanel = () => {
 var UserPanel = () => {
   const { t: t11 } = useTranslation();
   const navigate = useNavigate();
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const account = useAccount2();
   const insideOfMicroboard = document.referrer.includes("https://microboard.io/") || document.referrer.includes("https://microboard.ru/");
   if (!account.isLoggedIn) {
@@ -423578,7 +423571,7 @@ var UserPanel = () => {
     padding: 0,
     className: UserPanel_module_default.wrapper
   }, /* @__PURE__ */ import_react393.default.createElement(ActionButtons, null), /* @__PURE__ */ import_react393.default.createElement(PresenceUsers, {
-    app: app2
+    app
   }), board.getBoardId() !== "blank" && /* @__PURE__ */ import_react393.default.createElement("div", {
     className: UserPanel_module_default.container
   }, /* @__PURE__ */ import_react393.default.createElement(ShareBtn, null))), /* @__PURE__ */ import_react393.default.createElement(CommentsPanel, null));
@@ -423757,10 +423750,10 @@ var LinkToButton = ({
   const [iconUrl, setIconUrl] = import_react397.useState(undefined);
   const imgRef = import_react397.useRef(null);
   const [isTooltipOpen, setIsTooltipOpen] = import_react397.useState(false);
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const closeTooltipTimeoutId = import_react397.useRef();
   const mbr = useDomMbr({
-    app: app2,
+    app,
     board,
     ref: linkToButtonRef,
     targetMbr: item instanceof Connector2 ? item.endPointer.path.getMbr() : item.getMbr(),
@@ -423992,7 +423985,7 @@ var QuickAddPanel_module_default = {
 
 // src/features/AppView/QuickAddPanel/QuickAddPanel.tsx
 function QuickAddPanel() {
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const { t: t11 } = useTranslation();
   const forceUpdate = useForceUpdate2();
   useAppSubscription({
@@ -424001,7 +423994,7 @@ function QuickAddPanel() {
       forceUpdate();
     }
   });
-  const appBoard = app2.getBoard();
+  const appBoard = app.getBoard();
   const single = appBoard.selection.items.getSingle();
   if (!appBoard.selection.showQuickAddPanel || !single || single.itemType !== "Connector") {
     return null;
@@ -424290,8 +424283,8 @@ var MouseOrTracpadModal_module_default = {
 var MOUSE_OR_TRACKPAD_MODAL = Symbol("mouseOrTrackpadModal");
 var modes = ["mouse", "trackpad", "auto"];
 var MouseOrTrackpadModal = () => {
-  const { app: app2 } = useAppContext();
-  const [selectedMode, setSelectedMode] = import_react404.useState(app2.getSettings().controlMode);
+  const { app } = useAppContext();
+  const [selectedMode, setSelectedMode] = import_react404.useState(app.getSettings().controlMode);
   const { closeModal: closeModal2 } = useUiModalContext();
   const { t: t11 } = useTranslation();
   const mouseCards = [
@@ -424325,7 +424318,7 @@ var MouseOrTrackpadModal = () => {
     }
   };
   const setControlMode = () => {
-    app2.setControlMode(selectedMode);
+    app.setControlMode(selectedMode);
     closeModal2();
   };
   return /* @__PURE__ */ import_react404.default.createElement(UiModal, {
@@ -424379,16 +424372,16 @@ var Card6 = ({ iconName, style: style3, text: text5 }) => {
 // src/entities/BoardMenu/sections/MouseOrTrackpad.tsx
 var MouseOrTrackpad = () => {
   const [isSetControlModeOpen, setIsSetControlModeOpen] = import_react405.useState(false);
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const { t: t11 } = useTranslation();
   const forceUpdate = useForceUpdate2();
   const { openModal: openModal2 } = useUiModalContext();
   const setControlMode = (mode) => {
-    app2.setControlMode(mode);
+    app.setControlMode(mode);
     forceUpdate();
   };
   const getIsActive = (mode) => {
-    return app2.getSettings().controlMode === mode;
+    return app.getSettings().controlMode === mode;
   };
   return /* @__PURE__ */ import_react405.default.createElement(ButtonWithMenu2, {
     className: BoardMenu_module_default.buttonWithMenu,
@@ -424463,7 +424456,7 @@ var MouseOrTrackpad = () => {
 // src/entities/BoardMenu/BoardMenu.tsx
 var BoardMenu = () => {
   const menuRef = import_react406.useRef(null);
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const cursorPosition2 = board.pointer.point;
   const [isOpen, setIsOpen] = import_react406.useState(false);
   const position5 = import_react406.useRef(new Mbr);
@@ -424482,7 +424475,7 @@ var BoardMenu = () => {
     }
   });
   const mbr = useDomMbr({
-    app: app2,
+    app,
     board,
     ref: menuRef,
     targetMbr: new Mbr(cursorPosition2.x, cursorPosition2.y, cursorPosition2.x, cursorPosition2.y),
@@ -424889,14 +424882,14 @@ var YouTube_default = YouTube;
 
 // src/features/VideoPlayer/VideoPlayer.tsx
 var VideoPlayer = ({ item }) => {
-  const { board, app: app2 } = useAppContext();
+  const { board, app } = useAppContext();
   const videoId = conf.getYouTubeId(item.getUrl());
   const videoRef = import_react410.useRef(null);
   const containerRef = import_react410.useRef(null);
   const stopTimeoutRef = import_react410.useRef(null);
   const timeoutDuration = videoId ? 300 : 10;
   import_react410.useEffect(() => {
-    containerRef.current?.addEventListener("wheel", app2.controller.onWheel, {
+    containerRef.current?.addEventListener("wheel", app.controller.onWheel, {
       capture: true,
       passive: false
     });
@@ -424915,7 +424908,7 @@ var VideoPlayer = ({ item }) => {
       if (videoRef.current) {
         videoRef.current.removeEventListener("loadedmetadata", handleLoadedMetadata);
       }
-      containerRef.current?.removeEventListener("wheel", app2.controller.onWheel);
+      containerRef.current?.removeEventListener("wheel", app.controller.onWheel);
     };
   }, []);
   const stopVideo = () => {
@@ -427261,7 +427254,7 @@ function Sprite() {
 
 // src/features/AppView/AppView.tsx
 function AppView() {
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const { setQuotedText, tryToSendGenerationRequest } = useAIContext();
   const { setHyperLinkData, hyperLinkData } = useHyperLinkContext();
   const location3 = useLocation();
@@ -427304,9 +427297,9 @@ function AppView() {
       controller16.onPaste(event);
       canPasteAgain = false;
     };
-    app2.boardSubject.subscribe(update);
+    app.boardSubject.subscribe(update);
     const container = containerRef.current;
-    const controller16 = app2.controller;
+    const controller16 = app.controller;
     const abortController2 = new AbortController;
     if (container) {
       container.addEventListener("touchmove", preventDefault2, {
@@ -427352,11 +427345,11 @@ function AppView() {
       });
     }
     return () => {
-      app2.boardSubject.unsubscribe(update);
+      app.boardSubject.unsubscribe(update);
       abortController2.abort();
     };
   }, [containerRef.current]);
-  const appBoard = app2.getBoard();
+  const appBoard = app.getBoard();
   return /* @__PURE__ */ import_react414.default.createElement(ErrorBoundary, null, /* @__PURE__ */ import_react414.default.createElement("div", {
     className: AppView_module_default.wrapper
   }, shouldShow("titlePanel") && /* @__PURE__ */ import_react414.default.createElement(LandingMenu, null), shouldShow("titlePanel") && /* @__PURE__ */ import_react414.default.createElement(MobileLandingMenu, null), /* @__PURE__ */ import_react414.default.createElement(InactiveBoardHidder, null, /* @__PURE__ */ import_react414.default.createElement("div", {
@@ -427369,12 +427362,12 @@ function AppView() {
     }, /* @__PURE__ */ import_react414.default.createElement(UIMainLoader, null))
   }), /* @__PURE__ */ import_react414.default.createElement(Canvas, {
     router: { location: location3, navigate, params },
-    app: app2,
+    app,
     board
   }, /* @__PURE__ */ import_react414.default.createElement(LinksProvider, null), /* @__PURE__ */ import_react414.default.createElement(ItemsProvider, {
     itemsComponents
   })), /* @__PURE__ */ import_react414.default.createElement(TextEditors, {
-    app: app2,
+    app,
     board,
     setQuotedText,
     setHyperLinkData,
@@ -427390,7 +427383,7 @@ function AppView() {
     }
     return null;
   })), /* @__PURE__ */ import_react414.default.createElement(ExportVisible, null, /* @__PURE__ */ import_react414.default.createElement(UserPanelLayout, {
-    app: app2
+    app
   }), /* @__PURE__ */ import_react414.default.createElement(CommentsProvider, null)), /* @__PURE__ */ import_react414.default.createElement(ExportVisible, null, /* @__PURE__ */ import_react414.default.createElement(UserTracking, {
     board
   })), /* @__PURE__ */ import_react414.default.createElement(InactiveBoardHidder, null, /* @__PURE__ */ import_react414.default.createElement(ZoomPanel, null)), /* @__PURE__ */ import_react414.default.createElement(ViewModeGuard, null, /* @__PURE__ */ import_react414.default.createElement(ContextPanel, null), /* @__PURE__ */ import_react414.default.createElement(QuickAddPanel, null), /* @__PURE__ */ import_react414.default.createElement(ExportPanel, null), /* @__PURE__ */ import_react414.default.createElement(BoardMenu, null)), /* @__PURE__ */ import_react414.default.createElement(HyperLink, null), /* @__PURE__ */ import_react414.default.createElement(AiGenerationButton, null), /* @__PURE__ */ import_react414.default.createElement(HyperLinkInput, null), /* @__PURE__ */ import_react414.default.createElement(ToastProvider, null), authCode && teamIdSearch ? /* @__PURE__ */ import_react414.default.createElement(ImportMiro, null) : null, /* @__PURE__ */ import_react414.default.createElement(CookiesModal, null), /* @__PURE__ */ import_react414.default.createElement(UiModalBackground, null, /* @__PURE__ */ import_react414.default.createElement(ImportMiroStartModal, null), /* @__PURE__ */ import_react414.default.createElement(SelectPaymentModal, null), /* @__PURE__ */ import_react414.default.createElement(UserPlanModal, null), /* @__PURE__ */ import_react414.default.createElement(LimitsModal, null), /* @__PURE__ */ import_react414.default.createElement(HistoryModal, null), /* @__PURE__ */ import_react414.default.createElement(ShareModal, null), /* @__PURE__ */ import_react414.default.createElement(ShareSnapshotModal, null), /* @__PURE__ */ import_react414.default.createElement(ProfileSettingsModal, null), /* @__PURE__ */ import_react414.default.createElement(ChangePasswordModal, null), /* @__PURE__ */ import_react414.default.createElement(AccessDeniedModal, null), /* @__PURE__ */ import_react414.default.createElement(AiUnavailableModal, null), /* @__PURE__ */ import_react414.default.createElement(MediaUnavailableModal, null), /* @__PURE__ */ import_react414.default.createElement(SelectTemplateModal, null), /* @__PURE__ */ import_react414.default.createElement(AuthClipboardModal, null), /* @__PURE__ */ import_react414.default.createElement(ImgAuthClipboardModal, null), /* @__PURE__ */ import_react414.default.createElement(LoadingNotification, null), /* @__PURE__ */ import_react414.default.createElement(ErrorNotification, null), /* @__PURE__ */ import_react414.default.createElement(SuccessNotification, null), /* @__PURE__ */ import_react414.default.createElement(WarnClipboardNotification, null), /* @__PURE__ */ import_react414.default.createElement(WarnNotification, null), /* @__PURE__ */ import_react414.default.createElement(SetLinkToModal, null), /* @__PURE__ */ import_react414.default.createElement(CreateTemplateModal, null), /* @__PURE__ */ import_react414.default.createElement(MouseOrTrackpadModal, null), /* @__PURE__ */ import_react414.default.createElement(CreateCardsModal, null), /* @__PURE__ */ import_react414.default.createElement(CreateDiceModal, null)), /* @__PURE__ */ import_react414.default.createElement(LocalFileSaveProgress_default, null)), /* @__PURE__ */ import_react414.default.createElement(Sprite, null));
@@ -427401,7 +427394,7 @@ function preventDefault2(event) {
 // src/features/AppView/LocalAppView.tsx
 var import_react415 = __toESM(require_react(), 1);
 function LocalAppView() {
-  const { app: app2, board } = useAppContext();
+  const { app, board } = useAppContext();
   const forceUpdate = useForceUpdate2();
   const animationId = import_react415.useRef(null);
   const containerRef = import_react415.useRef(null);
@@ -427438,9 +427431,9 @@ function LocalAppView() {
       controller16.onPaste(event);
       canPasteAgain = false;
     };
-    app2.boardSubject.subscribe(update);
+    app.boardSubject.subscribe(update);
     const container = containerRef.current;
-    const controller16 = app2.controller;
+    const controller16 = app.controller;
     if (container) {
       document.addEventListener("touchmove", preventDefault3, {
         passive: false
@@ -427468,7 +427461,7 @@ function LocalAppView() {
       window.addEventListener("dragover", (event) => event.preventDefault());
     }
     return () => {
-      app2.boardSubject.unsubscribe(update);
+      app.boardSubject.unsubscribe(update);
       if (container) {
         document.removeEventListener("touchmove", preventDefault3);
         container.removeEventListener("wheel", controller16.onWheel);
@@ -427489,10 +427482,10 @@ function LocalAppView() {
   }, /* @__PURE__ */ import_react415.default.createElement(InactiveBoardHidder, null, /* @__PURE__ */ import_react415.default.createElement("div", {
     ref: containerRef
   }, /* @__PURE__ */ import_react415.default.createElement(CanvasNoRouter, {
-    app: app2,
+    app,
     board
   }, /* @__PURE__ */ import_react415.default.createElement(LinksProvider, null)), /* @__PURE__ */ import_react415.default.createElement(TextEditors, {
-    app: app2,
+    app,
     board,
     setQuotedText,
     setHyperLinkData,
@@ -446310,30 +446303,30 @@ var pasteWelcomeBoardData = (board, lang) => {
   board.camera.zoomToFit(mbr);
 };
 function WelcomePage() {
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const navigate = useNavigate();
   const { i18n: i18n7, t: t11 } = useTranslation();
   const boardsList = useBoardsList();
-  const createPublicBoard = async (app3) => {
-    const lastBoardId = app3.getLastBoardId();
+  const createPublicBoard = async (app2) => {
+    const lastBoardId = app2.getLastBoardId();
     if (lastBoardId) {
-      await app3.openBoard(lastBoardId);
+      await app2.openBoard(lastBoardId);
       return lastBoardId;
     }
     return "welcome";
   };
   import_react419.default.useEffect(() => {
-    createPublicBoard(app2).then((boardId) => {
+    createPublicBoard(app).then((boardId) => {
       navigate(`/boards/${boardId}`);
     }).catch(console.error);
-  }, [app2]);
+  }, [app]);
   return null;
 }
 
 // src/pages/BoardPage.tsx
 var BoardPage = () => {
-  const { app: app2 } = useAppContext();
-  const board = app2.getBoard();
+  const { app } = useAppContext();
+  const board = app.getBoard();
   const params = useParams();
   const { t: t11, i18n: i18n7 } = useTranslation();
   const navigate = useNavigate();
@@ -446345,10 +446338,10 @@ var BoardPage = () => {
   const boardsList = useBoardsList();
   const account = useAccount2();
   const { openModal: openModal2 } = useUiModalContext();
-  app2.connection.onAccessDenied = async (deniedBoardId, forceUpdate = false) => {
+  app.connection.onAccessDenied = async (deniedBoardId, forceUpdate = false) => {
     if (forceUpdate || deniedBoardId === board.getBoardId() && !isOpenMiroBoards) {
       openModal2(ACCESS_DENIED_MODAL);
-      const deniedBoard = app2.getConnectedBoard(deniedBoardId);
+      const deniedBoard = app.getConnectedBoard(deniedBoardId);
       if (deniedBoard) {
         deniedBoard.disconnect();
       }
@@ -446356,54 +446349,54 @@ var BoardPage = () => {
         await boardsList.removeBoard(board.getBoardId());
       }
       navigate("/boards/blank");
-      await app2.openBoard("blank");
-      app2.render();
+      await app.openBoard("blank");
+      app.render();
     }
   };
   import_react420.useLayoutEffect(() => {
     boardsList.loadBoards().then(() => {
       if (params.boardId?.includes("local")) {
-        app2.openBoardFromFile().then(() => {
+        app.openBoardFromFile().then(() => {
           navigate(`/boards/${params.boardId}${search3}`, {
             replace: true
           });
-          app2.render();
+          app.render();
         });
       } else if (params.boardId && params.boardId !== "blank") {
-        app2.openBoard(params.boardId, searchParams.get("accessKey") || undefined).then(() => {
+        app.openBoard(params.boardId, searchParams.get("accessKey") || undefined).then(() => {
           navigate(`/boards/${params.boardId}${search3}`, {
             replace: true
           });
-          app2.render();
+          app.render();
         });
       } else {
         const lastSeenBoard = localStorage.getItem(LAST_BOARD_KEY);
         const isFirstVisit = !api10.get("first_visit");
         if (lastSeenBoard) {
-          app2.openBoard(lastSeenBoard).then(() => {
+          app.openBoard(lastSeenBoard).then(() => {
             navigate(`/boards/${lastSeenBoard}${search3}`, {
               replace: true
             });
-            app2.render();
+            app.render();
           });
         } else if (isFirstVisit) {
           boardsList.createBoard(t11("board.welcomeBoardTitle"), true).then((boardId) => {
-            app2.openBoard(boardId).then(() => {
+            app.openBoard(boardId).then(() => {
               navigate(`/boards/${boardId}`, {
                 replace: true
               });
-              app2.render();
-              const board2 = app2.getBoard();
+              app.render();
+              const board2 = app.getBoard();
               pasteWelcomeBoardData(board2, i18n7.language);
             });
           });
         } else {
           boardsList.createBoard().then((boardId) => {
-            app2.openBoard(boardId).then(() => {
+            app.openBoard(boardId).then(() => {
               navigate(`/boards/${boardId}`, {
                 replace: true
               });
-              app2.render();
+              app.render();
             });
           });
         }
@@ -446442,7 +446435,7 @@ var BoardPage = () => {
     return /* @__PURE__ */ import_react420.default.createElement("div", null);
   }
   return /* @__PURE__ */ import_react420.default.createElement(AppContext2.Provider, {
-    value: { app: app2, board }
+    value: { app, board }
   }, /* @__PURE__ */ import_react420.default.createElement(AppView, null));
 };
 
@@ -446815,19 +446808,19 @@ var LOCAL_PROVIDERS = [
 ];
 var Provider = compose2(PROVIDERS);
 var LocalProvider = compose2(LOCAL_PROVIDERS);
-function AppLayout({ app: app2 }) {
-  const board = app2.getBoard();
+function AppLayout({ app }) {
+  const board = app.getBoard();
   return /* @__PURE__ */ import_react427.default.createElement(AppContext2.Provider, {
-    value: { app: app2, board }
+    value: { app, board }
   }, /* @__PURE__ */ import_react427.default.createElement(Provider, null, /* @__PURE__ */ import_react427.default.createElement(Outlet, null), /* @__PURE__ */ import_react427.default.createElement(ToastProvider, null)));
 }
 function LocalAppLayout({
-  app: app2,
+  app,
   children
 }) {
-  const board = app2.getBoard();
+  const board = app.getBoard();
   return /* @__PURE__ */ import_react427.default.createElement(AppContext2.Provider, {
-    value: { app: app2, board }
+    value: { app, board }
   }, /* @__PURE__ */ import_react427.default.createElement(LocalProvider, null, children, /* @__PURE__ */ import_react427.default.createElement(Outlet, null)));
 }
 
@@ -446836,8 +446829,8 @@ var import_react428 = __toESM(require_react(), 1);
 var QuickAddButtonsClear = ({
   children
 }) => {
-  const { app: app2 } = useAppContext();
-  app2.getBoard()?.selection.quickAddButtons.clear();
+  const { app } = useAppContext();
+  app.getBoard()?.selection.quickAddButtons.clear();
   return /* @__PURE__ */ import_react428.default.createElement(import_react428.default.Fragment, null, children);
 };
 var QuickAddButtonsClear_default = QuickAddButtonsClear;
@@ -447171,7 +447164,7 @@ var SelectBoardPage_module_default = {
 // src/pages/SelectBoardPage/SelectBoardPage.tsx
 var getName = (i18t, name3) => name3 || i18t("board.untitled");
 var SelectBoardPage = () => {
-  const { app: app2 } = useAppContext();
+  const { app } = useAppContext();
   const { t: t11 } = useTranslation();
   const navigate = useNavigate();
   const forceUpdate = useForceUpdate2();
@@ -447220,7 +447213,7 @@ var SelectBoardPage = () => {
   }, [selected]);
   import_react433.useEffect(() => {
     const fetchBoards = async () => {
-      await app2.boardsList.loadBoards();
+      await app.boardsList.loadBoards();
     };
     fetchBoards();
   }, []);
@@ -447228,7 +447221,7 @@ var SelectBoardPage = () => {
     try {
       if (selected === "addNew") {
         const createdId = await boardsList.createBoard(newBoardRef.current?.value, true);
-        const unauthedData = app2.storage.getCreatedBoard(createdId);
+        const unauthedData = app.storage.getCreatedBoard(createdId);
         if (unauthedData) {
           handleSuccess(unauthedData.id, unauthedData.title, unauthedData.authorKey ?? undefined);
         } else {
@@ -448143,8 +448136,8 @@ var WheelLogger_module_default = {
 
 // src/pages/WheelLogger/WheelLogger.tsx
 var WheelEventLoggerPage = () => {
-  const { app: app2 } = useAppContext();
-  const board = app2.getBoard();
+  const { app } = useAppContext();
+  const board = app.getBoard();
   const boardsList = useBoardsList();
   const [events4, setEvents] = import_react439.useState([]);
   const [mousePosition, setMousePosition] = import_react439.useState({ x: 0, y: 0 });
@@ -448154,8 +448147,8 @@ var WheelEventLoggerPage = () => {
       try {
         await boardsList.loadBoards();
         const boardId = await boardsList.createBoard();
-        await app2.openBoard(boardId);
-        app2.render();
+        await app.openBoard(boardId);
+        app.render();
         loggerRef.current = new WheelEventLogger(setEvents, setMousePosition);
         console.log("Logger initialized successfully");
       } catch (error3) {
@@ -448183,7 +448176,7 @@ var WheelEventLoggerPage = () => {
     return /* @__PURE__ */ import_react439.default.createElement("div", null);
   }
   return /* @__PURE__ */ import_react439.default.createElement(import_react439.default.Fragment, null, /* @__PURE__ */ import_react439.default.createElement(AppContext2.Provider, {
-    value: { app: app2, board }
+    value: { app, board }
   }, /* @__PURE__ */ import_react439.default.createElement(AppView, null)), /* @__PURE__ */ import_react439.default.createElement("div", {
     className: WheelLogger_module_default.loggerContainer
   }, /* @__PURE__ */ import_react439.default.createElement("div", {
@@ -448205,11 +448198,11 @@ var WheelEventLoggerPage = () => {
 // src/App/router.tsx
 var import_react440 = __toESM(require_react(), 1);
 var import_react_dom19 = __toESM(require_react_dom(), 1);
-function getRender(app2) {
+function getRender(app) {
   const router = createBrowserRouter([
     {
       element: /* @__PURE__ */ import_react440.default.createElement(AppLayout, {
-        app: app2
+        app
       }),
       children: [
         {
@@ -448297,10 +448290,10 @@ function getRender(app2) {
     router
   };
 }
-function getLocalRender(app2, customId) {
+function getLocalRender(app, customId) {
   return () => {
     import_react_dom19.default.render(/* @__PURE__ */ import_react440.default.createElement(LocalAppLayout, {
-      app: app2
+      app
     }, /* @__PURE__ */ import_react440.default.createElement(LocalSidePanelContextProvider, null, /* @__PURE__ */ import_react440.default.createElement(LocalAppView, null))), document.getElementById(customId));
   };
 }
@@ -448729,7 +448722,7 @@ function createApp(isHistory = true) {
       await connectBoard(board);
       return;
     }
-    const appBoard = app2.getBoard();
+    const appBoard = app.getBoard();
     if (id3 === "boards" || appBoard?.getBoardId() === id3) {
       return;
     }
@@ -448761,7 +448754,7 @@ function createApp(isHistory = true) {
       board.setName(boardsList.getBoardInfo(id3)?.title);
     }
     appBoard?.setIsOpen(false);
-    const newBoard = app2.getBoard();
+    const newBoard = app.getBoard();
     if (!newBoard.camera.useSavedSnapshot(newBoard.getCameraSnapshot())) {
       if (newBoard.items.listAll().length > 0) {
         const itemsMbr = newBoard.items.getMbr();
@@ -448801,9 +448794,9 @@ function createApp(isHistory = true) {
     }, 1000);
   }
   async function openBoardFromFile() {
-    app2.getBoard()?.cleanup();
+    app.getBoard()?.cleanup();
     const id3 = "local";
-    const currentBoard = new Board(id3, undefined, saveEditingFile.bind(app2));
+    const currentBoard = new Board(id3, undefined, saveEditingFile.bind(app));
     connectBoard(currentBoard);
     subscriptions.setBoard(currentBoard);
     boardSubject.publish(currentBoard);
@@ -448864,13 +448857,13 @@ function createApp(isHistory = true) {
         const snapshotId = window.parent.location.href.split("/snapshots/")[1];
         const snapshot2 = document.documentElement.outerHTML;
         const boardId = await boardsList.createBoard(snapshotId.split("?")[0] + " copy", !account.isLoggedIn);
-        await app2.connection.connect();
+        await app.connection.connect();
         window.parent.history.pushState({}, "", `/boards/${boardId}`);
-        await app2.openBoard(boardId);
-        const addedIds = app2.getBoard().deserializeHTMLAndEmit(snapshot2);
+        await app.openBoard(boardId);
+        const addedIds = app.getBoard().deserializeHTMLAndEmit(snapshot2);
         const promise = new Promise((resolve2) => {
           const reloadInterval = setInterval(() => {
-            const confirmedEvents = app2.getBoard().events?.getRaw().confirmedEvents;
+            const confirmedEvents = app.getBoard().events?.getRaw().confirmedEvents;
             const flatOperations = confirmedEvents?.flatMap((ev) => ("operations" in ev.body) ? ev.body.operations : ev.body.operation) || [];
             const confirmedAddedIds = flatOperations.filter((op2) => op2.method === "add").flatMap((op2) => op2.item);
             if (confirmedAddedIds.length >= addedIds.length) {
@@ -448926,7 +448919,7 @@ function createApp(isHistory = true) {
     await writable.write(data);
     await writable.close();
   }
-  const app2 = {
+  const app = {
     connection,
     clipboard,
     location: location3,
@@ -448961,7 +448954,7 @@ function createApp(isHistory = true) {
     storage2.softClean();
   });
   function render2() {
-    const { render: render3, router } = getRender(app2);
+    const { render: render3, router } = getRender(app);
     boardSubject.subscribe(() => {
       boardsList.subject.publish();
     });
@@ -448992,10 +448985,10 @@ function createApp(isHistory = true) {
     render3();
   }
   function localRender(id3) {
-    const render3 = getLocalRender(app2, id3);
+    const render3 = getLocalRender(app, id3);
     render3();
   }
-  return app2;
+  return app;
 }
 // src/features/Cursors/pencil.svg
 var pencil_default = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">

package/dist/types/App/useBoardSubscription.d.ts

@@ -1,3 +1,2 @@
 import { Subscription } from "./getSubscriptions";
 export declare function useAppSubscription(subscription: Subscription): void;
-export declare function useTools(): import("microboard-temp").Tools;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "microboard-ui-temp",
-  "version": "0.1.74",
+  "version": "0.1.75",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "type": "module",