Merge pull request #3402 from hamza-hadj-aissa/fix/more-dropdown-menu

fix: corrected toggle calls for Superscript and Subscript
udecode · Jul 31, 2024 · 4d993e7 · 4d993e7
2 parents 81c0bc7 + f31b4c3
commit 4d993e7
Show file tree

Hide file tree

Showing 9 changed files with 45 additions and 25 deletions.
diff --git a/.changeset/dull-dryers-sip.md b/.changeset/dull-dryers-sip.md
@@ -0,0 +1,9 @@
+---
+'@udecode/plate-normalizers': patch
+'@udecode/plate-utils': patch
+'@udecode/plate-selection': patch
+'@udecode/plate-combobox': patch
+'@udecode/plate-table': patch
+---
+
+fix: corrected toggle calls for Superscript and Subscript
diff --git a/apps/www/src/components/plate-ui/playground-more-dropdown-menu.tsx b/apps/www/src/components/plate-ui/playground-more-dropdown-menu.tsx
@@ -67,7 +67,7 @@ export function PlaygroundMoreDropdownMenu(props: DropdownMenuProps) {
         <DropdownMenuItem
           onSelect={() => {
             toggleMark(editor, {
-              clear: MARK_SUBSCRIPT,
+              clear: [MARK_SUBSCRIPT, MARK_SUPERSCRIPT],
               key: MARK_SUPERSCRIPT,
             });
             focusEditor(editor);
@@ -80,7 +80,7 @@ export function PlaygroundMoreDropdownMenu(props: DropdownMenuProps) {
         <DropdownMenuItem
           onSelect={() => {
             toggleMark(editor, {
-              clear: MARK_SUPERSCRIPT,
+              clear: [MARK_SUPERSCRIPT, MARK_SUBSCRIPT],
               key: MARK_SUBSCRIPT,
             });
             focusEditor(editor);

diff --git a/apps/www/src/registry/default/plate-ui/more-dropdown-menu.tsx b/apps/www/src/registry/default/plate-ui/more-dropdown-menu.tsx
@@ -35,8 +35,8 @@ export function MoreDropdownMenu(props: DropdownMenuProps) {
         <DropdownMenuItem
           onSelect={() => {
             toggleMark(editor, {
-              clear: MARK_SUPERSCRIPT,
-              key: MARK_SUBSCRIPT,
+              clear: [MARK_SUBSCRIPT, MARK_SUPERSCRIPT],
+              key: MARK_SUPERSCRIPT,
             });
             focusEditor(editor);
           }}
@@ -48,8 +48,8 @@ export function MoreDropdownMenu(props: DropdownMenuProps) {
         <DropdownMenuItem
           onSelect={() => {
             toggleMark(editor, {
-              clear: MARK_SUBSCRIPT,
-              key: MARK_SUPERSCRIPT,
+              clear: [MARK_SUPERSCRIPT, MARK_SUBSCRIPT],
+              key: MARK_SUBSCRIPT,
             });
             focusEditor(editor);
           }}

diff --git a/packages/combobox/src/hooks/useHTMLInputCursorState.ts b/packages/combobox/src/hooks/useHTMLInputCursorState.ts
@@ -1,4 +1,10 @@
-import { type RefObject, useCallback, useEffect, useState, useMemo } from 'react';
+import {
+  type RefObject,
+  useCallback,
+  useEffect,
+  useMemo,
+  useState,
+} from 'react';
 
 import type { ComboboxInputCursorState } from '../types';
 
@@ -12,6 +18,7 @@ export const useHTMLInputCursorState = (
     // Wait for events to finish processing
     setTimeout(() => {
       if (!ref.current) return;
+
       const { selectionEnd, selectionStart, value } = ref.current;
       setAtStart(selectionStart === 0);
       setAtEnd(selectionEnd === value.length);
@@ -45,8 +52,11 @@ export const useHTMLInputCursorState = (
     };
   }, [recomputeCursorState, ref]);
 
-  return useMemo(() => ({
-    atStart,
-    atEnd,
-  }), [atStart, atEnd]);
+  return useMemo(
+    () => ({
+      atEnd,
+      atStart,
+    }),
+    [atStart, atEnd]
+  );
 };
diff --git a/packages/normalizers/src/createRemoveEmptyNodesPlugin.ts b/packages/normalizers/src/createRemoveEmptyNodesPlugin.ts
@@ -6,7 +6,7 @@ export interface RemoveEmptyNodesPlugin {
   types?: string | string[];
 }
 
-export const KEY_REMOVE_EMPTY_NODES = 'removeEmptyNodes'
+export const KEY_REMOVE_EMPTY_NODES = 'removeEmptyNodes';
 
 /** @see {@link withRemoveEmptyNodes} */
 export const createRemoveEmptyNodesPlugin =

diff --git a/packages/plate-utils/src/useFormInputProps.ts b/packages/plate-utils/src/useFormInputProps.ts
@@ -1,7 +1,7 @@
 interface InputProps {
   /**
-   * Should we activate the onKeyDownCapture handler to preventDefault when
-   * the user presses enter?
+   * Should we activate the onKeyDownCapture handler to preventDefault when the
+   * user presses enter?
    */
   preventDefaultOnEnterKeydown?: boolean;
 }
@@ -10,8 +10,9 @@ interface InputProps {
  * Hook to allow the user to spread a set of predefined props to the Div wrapper
  * of an Input element
  *
- * @param param0 an options object which can be expanded to add further functionality
- * @returns a props object which can be spread onto the element
+ * @param param0 An options object which can be expanded to add further
+ *   functionality
+ * @returns A props object which can be spread onto the element
  */
 export const useFormInputProps = (options?: InputProps) => {
   // Nothing provided to just return an empty object which can still be spread.
@@ -33,8 +34,8 @@ export const useFormInputProps = (options?: InputProps) => {
    * By calling preventDefault we short circuit the form's submission thus
    * allowing the user to continue filling in the other fields
    *
-   * @param e The original event which was provided by the VDOM
-   * implement their own behaviour on this event
+   * @param e The original event which was provided by the VDOM implement their
+   *   own behaviour on this event
    */
   const handleEnterKeydownCapture = (
     e: React.KeyboardEvent<HTMLDivElement>

diff --git a/packages/selection/src/queries/index.ts b/packages/selection/src/queries/index.ts
@@ -3,4 +3,4 @@
  */
 
 export * from './getSelectedBlocks';
-export * from "./isNodeBlockSelected";
+export * from './isNodeBlockSelected';
diff --git a/packages/table/src/queries/getTableColumnCount.spec.tsx b/packages/table/src/queries/getTableColumnCount.spec.tsx
@@ -1,6 +1,6 @@
+import type { TElement } from '@udecode/slate';
 
 import { getTableColumnCount } from './getTableColumnCount';
-import { TElement } from '@udecode/slate';
 
 describe('getTableColumnCount', () => {
   it('should return 0 if tableNode has no children', () => {
@@ -54,4 +54,4 @@ describe('getTableColumnCount', () => {
     const result = getTableColumnCount(tableNode);
     expect(result).toBe(3);
   });
-});
+});
diff --git a/templates/plate-playground-template/src/components/plate-ui/more-dropdown-menu.tsx b/templates/plate-playground-template/src/components/plate-ui/more-dropdown-menu.tsx
@@ -33,8 +33,8 @@ export function MoreDropdownMenu(props: DropdownMenuProps) {
         <DropdownMenuItem
           onSelect={() => {
             toggleMark(editor, {
-              key: MARK_SUBSCRIPT,
-              clear: MARK_SUPERSCRIPT,
+              clear: [MARK_SUBSCRIPT, MARK_SUPERSCRIPT],
+              key: MARK_SUPERSCRIPT,
             });
             focusEditor(editor);
           }}
@@ -46,8 +46,8 @@ export function MoreDropdownMenu(props: DropdownMenuProps) {
         <DropdownMenuItem
           onSelect={() => {
             toggleMark(editor, {
-              key: MARK_SUPERSCRIPT,
-              clear: MARK_SUBSCRIPT,
+              clear: [MARK_SUPERSCRIPT, MARK_SUBSCRIPT],
+              key: MARK_SUBSCRIPT,
             });
             focusEditor(editor);
           }}