editor: remove useIsKeyboardOpen

packages/editor/src/extensions/task-item/component.tsx

@@ -26,10 +26,7 @@ import { Transaction } from "prosemirror-state";
 import { findChildren, findChildrenInRange } from "@tiptap/core";
 import { useCallback } from "react";
 import { TaskItemNode, TaskItemAttributes } from "./task-item";
-import {
-  useIsKeyboardOpen,
-  useIsMobile
-} from "../../toolbar/stores/toolbar-store";
+import { useIsMobile } from "../../toolbar/stores/toolbar-store";
 import { isiOS } from "../../utils/platform";
 import { DesktopOnly } from "../../components/responsive";
 
@@ -120,13 +117,13 @@ export function TaskItemComponent(
           }
         }}
         onMouseDown={(e) => {
-          if (useIsKeyboardOpen.current) {
+          if (globalThis["keyboardShown"]) {
             e.preventDefault();
           }
           toggle();
         }}
         onTouchEnd={(e) => {
-          if (useIsKeyboardOpen.current || isiOS()) {
+          if (globalThis["keyboardShown"] || isiOS()) {
             e.preventDefault();
             toggle();
           }

packages/editor/src/index.ts

@@ -77,6 +77,12 @@ import Toolbar from "./toolbar";
 import { useToolbarStore } from "./toolbar/stores/toolbar-store";
 import { DownloadOptions } from "./utils/downloader";
 
+declare global {
+  // eslint-disable-next-line no-var
+  var keyboardShown: boolean;
+}
+
+globalThis["keyboardShown"] = true;
 const CoreExtensions = Object.entries(TiptapCoreExtensions)
   // we will implement our own customized clipboard serializer
   .filter(([name]) => name !== "ClipboardTextSerializer")
@@ -90,7 +96,6 @@ type TiptapOptions = EditorOptions &
     downloadOptions?: DownloadOptions;
     theme: Theme;
     isMobile?: boolean;
-    isKeyboardOpen?: boolean;
     doubleSpacedLines?: boolean;
   };
 
@@ -102,7 +107,6 @@ const useTiptap = (
     theme,
     doubleSpacedLines = true,
     isMobile,
-    isKeyboardOpen,
     onDownloadAttachment,
     onOpenAttachmentPicker,
     onPreviewAttachment,
@@ -115,7 +119,6 @@ const useTiptap = (
   const setIsMobile = useToolbarStore((store) => store.setIsMobile);
   const setTheme = useToolbarStore((store) => store.setTheme);
   const closeAllPopups = useToolbarStore((store) => store.closeAllPopups);
-  const setIsKeyboardOpen = useToolbarStore((store) => store.setIsKeyboardOpen);
   const setDownloadOptions = useToolbarStore(
     (store) => store.setDownloadOptions
   );
@@ -123,9 +126,8 @@ const useTiptap = (
   useEffect(() => {
     setIsMobile(isMobile || false);
     setTheme(theme);
-    setIsKeyboardOpen(isKeyboardOpen || false);
     setDownloadOptions(downloadOptions);
-  }, [isMobile, theme, isKeyboardOpen, downloadOptions]);
+  }, [isMobile, theme, downloadOptions]);
 
   useEffect(() => {
     closeAllPopups();

packages/editor/src/toolbar/stores/toolbar-store.ts

@@ -29,8 +29,6 @@ interface ToolbarState {
   setTheme: (theme?: Theme) => void;
   downloadOptions?: DownloadOptions;
   setDownloadOptions: (options?: DownloadOptions) => void;
-  isKeyboardOpen: boolean;
-  setIsKeyboardOpen: (isKeyboardOpen: boolean) => void;
   isMobile: boolean;
   openedPopups: Record<string, PopupRef | false | undefined>;
   setIsMobile: (isMobile: boolean) => void;
@@ -47,16 +45,11 @@ export const useToolbarStore = create<ToolbarState>((set, get) => ({
   theme: undefined,
   downloadOptions: undefined,
   isMobile: false,
-  isKeyboardOpen: true,
   openedPopups: {},
   setDownloadOptions: (options) =>
     set((state) => {
       state.downloadOptions = options;
     }),
-  setIsKeyboardOpen: (isKeyboardOpen) =>
-    set((state) => {
-      state.isKeyboardOpen = isKeyboardOpen;
-    }),
   setIsMobile: (isMobile) =>
     set((state) => {
       state.isMobile = isMobile;
@@ -119,13 +112,3 @@ export const useTheme = Object.defineProperty(
     get: () => useToolbarStore.getState().theme
   }
 ) as (() => Theme | undefined) & { current: Theme | undefined };
-
-export const useIsKeyboardOpen = Object.defineProperty(
-  () => {
-    return useToolbarStore((store) => store.isKeyboardOpen);
-  },
-  "current",
-  {
-    get: () => useToolbarStore.getState().isKeyboardOpen
-  }
-) as (() => boolean) & { current: boolean };