@monolith-forensics/monolith-ui 1.3.3 → 1.3.6

package/dist/RichTextEditor/Enums/Controls.d.ts

@@ -16,6 +16,5 @@ export declare enum Controls {
     TEXT_ALIGN_RIGHT = "textAlignRight",
     TEXT_ALIGN_JUSTIFIED = "textAlignJustified",
     FONT = "font",
-    COLOR = "color",
-    TABLE = "table"
+    COLOR = "color"
 }

package/dist/RichTextEditor/Enums/Controls.js

@@ -18,5 +18,4 @@ export var Controls;
     Controls["TEXT_ALIGN_JUSTIFIED"] = "textAlignJustified";
     Controls["FONT"] = "font";
     Controls["COLOR"] = "color";
-    Controls["TABLE"] = "table";
 })(Controls || (Controls = {}));

package/dist/RichTextEditor/Enums/SlashCommands.d.ts

@@ -6,7 +6,6 @@ export declare enum SlashCommands {
     Heading4 = "Heading 4",
     BulletList = "Bullet List",
     NumberedList = "Numbered List",
-    Table = "Table",
     CurrentDate = "Current Date",
     CurrentTimestamp = "Current Timestamp",
     Image = "Image"

package/dist/RichTextEditor/Enums/SlashCommands.js

@@ -7,7 +7,6 @@ export var SlashCommands;
     SlashCommands["Heading4"] = "Heading 4";
     SlashCommands["BulletList"] = "Bullet List";
     SlashCommands["NumberedList"] = "Numbered List";
-    SlashCommands["Table"] = "Table";
     SlashCommands["CurrentDate"] = "Current Date";
     SlashCommands["CurrentTimestamp"] = "Current Timestamp";
     SlashCommands["Image"] = "Image";

package/dist/RichTextEditor/Extensions/SlashCommandList.d.ts

@@ -1,11 +1,9 @@
-import { SuggestionItem } from "./getSlashCommand";
-import { Editor, Range } from "@tiptap/react";
 interface SlashCommandListProps {
     className?: string;
-    items: SuggestionItem[];
-    command: (item: SuggestionItem) => void;
-    editor: Editor;
-    range: Range;
+    items: any[];
+    command: (item: any) => void;
+    editor: any;
+    range: any;
 }
 declare const SlashCommandList: ({ items, command, editor, range, }: SlashCommandListProps) => import("react/jsx-runtime").JSX.Element | null;
 export default SlashCommandList;

package/dist/RichTextEditor/Extensions/SlashCommandList.js

@@ -1,8 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useLayoutEffect, useRef, useState, } from "react";
 import styled from "styled-components";
-import { useToolbarState } from "../Toolbar/useToolbarState";
-import { SlashCommands } from "../Enums";
 const SlashCommandListContainer = styled.div `
   display: flex;
   flex-direction: column;
@@ -40,11 +38,6 @@ const SlashCommandItem = styled.button `
   &.selected {
     background-color: ${({ theme }) => theme.palette.action.hover};
   }
-
-  &:disabled {
-    opacity: 0.5;
-    cursor: not-allowed;
-  }
 `;
 const CommandIcon = styled.div `
   display: flex;
@@ -85,7 +78,6 @@ const updateScrollView = (container, item) => {
 };
 const SlashCommandList = ({ items, command, editor, range, }) => {
     const [selectedIndex, setSelectedIndex] = useState(0);
-    const { isInsideTable } = useToolbarState(editor);
     const selectItem = useCallback((index) => {
         const item = items[index];
         if (item) {
@@ -113,9 +105,6 @@ const SlashCommandList = ({ items, command, editor, range, }) => {
                     return true;
                 }
                 if (e.key === "Enter") {
-                    if (items[selectedIndex].disabled) {
-                        return true;
-                    }
                     selectItem(selectedIndex);
                     return true;
                 }
@@ -138,10 +127,7 @@ const SlashCommandList = ({ items, command, editor, range, }) => {
             updateScrollView(container, item);
     }, [selectedIndex]);
     return items.length > 0 ? (_jsx(SlashCommandListContainer, { ref: commandListContainer, className: "slash-command", children: items.map((item, index) => {
-            if (item.title === SlashCommands.Table && isInsideTable) {
-                item.disabled = true;
-            }
-            return (_jsxs(SlashCommandItem, { className: `slash-command-item ${index === selectedIndex ? "selected" : ""}`, onClick: () => selectItem(index), disabled: item.disabled, children: [_jsx(CommandIcon, { className: "item-icon", children: _jsx(item.icon, { size: 18 }) }), _jsxs("div", { children: [_jsx(CommandTitle, { className: "item-title", children: item.title }), _jsx(CommandDescription, { className: "item-description", children: item.description })] })] }, index));
+            return (_jsxs(SlashCommandItem, { className: `slash-command-item ${index === selectedIndex ? "selected" : ""}`, onClick: () => selectItem(index), children: [_jsx(CommandIcon, { className: "item-icon", children: _jsx(item.icon, { size: 18 }) }), _jsxs("div", { children: [_jsx(CommandTitle, { className: "item-title", children: item.title }), _jsx(CommandDescription, { className: "item-description", children: item.description })] })] }, index));
         }) })) : null;
 };
 export default SlashCommandList;

package/dist/RichTextEditor/Extensions/getSlashCommand.d.ts

@@ -1,18 +1,7 @@
-import { Extension, Editor } from "@tiptap/core";
+import { Extension } from "@tiptap/core";
 import { HandleImageUpload } from "../Plugins/UploadImagesPlugin.js";
 import { SlashCommands } from "../Enums";
 type CommandName = keyof typeof SlashCommands;
-export type SuggestionItem = {
-    title: CommandName;
-    description: string;
-    searchTerms?: string[];
-    icon: any;
-    disabled?: boolean;
-    command: (props: {
-        editor: Editor;
-        range: any;
-    }) => void;
-};
 interface SlashCommandOptions {
     handleImageUpload?: HandleImageUpload;
     commands?: CommandName[];

package/dist/RichTextEditor/Extensions/getSlashCommand.js

@@ -11,7 +11,7 @@ import { Extension } from "@tiptap/core";
 import Suggestion from "@tiptap/suggestion";
 import { ReactRenderer } from "@tiptap/react";
 import tippy from "tippy.js";
-import { Heading1, Heading2, Heading3, Heading4, List, ListOrdered, Text, Image as ImageIcon, Calendar, ClockIcon, Table, } from "lucide-react";
+import { Heading1, Heading2, Heading3, Heading4, List, ListOrdered, Text, Image as ImageIcon, Calendar, ClockIcon, } from "lucide-react";
 import { startImageUpload, } from "../Plugins/UploadImagesPlugin.js";
 import { PluginKey } from "@tiptap/pm/state";
 import SlashCommandList from "./SlashCommandList";
@@ -115,15 +115,6 @@ const getCommandItems = (values, options) => {
                 editor.chain().focus().deleteRange(range).toggleOrderedList().run();
             },
         },
-        {
-            title: SlashCommands.Table,
-            description: "Create a table.",
-            searchTerms: ["table"],
-            icon: Table,
-            command: ({ editor, range }) => {
-                editor.chain().focus().deleteRange(range).insertTable().run();
-            },
-        },
         {
             title: SlashCommands.CurrentDate,
             description: "Insert the current date.",

package/dist/RichTextEditor/Extensions/getTiptapExtensions.js

@@ -3,10 +3,13 @@ import StarterKit from "@tiptap/starter-kit";
 import HorizontalRule from "@tiptap/extension-horizontal-rule";
 import Underline from "@tiptap/extension-underline";
 import TextAlign from "@tiptap/extension-text-align";
-import { TableKit } from "@tiptap/extension-table";
+import Table from "@tiptap/extension-table";
+import TableCell from "@tiptap/extension-table-cell";
+import TableHeader from "@tiptap/extension-table-header";
+import TableRow from "@tiptap/extension-table-row";
 import Placeholder from "@tiptap/extension-placeholder";
 import { Color } from "@tiptap/extension-color";
-import { TextStyle } from "@tiptap/extension-text-style";
+import TextStyle from "@tiptap/extension-text-style";
 import { InputRule, Extension } from "@tiptap/core";
 import Focus from "@tiptap/extension-focus";
 import { UploadImagesPlugin } from "../Plugins";
@@ -118,13 +121,22 @@ const getTipTapExtensions = ({ extensions = [], slashCommands = [], bubbleMenuOp
         },
         {
             name: Extensions.Table,
-            extension: TableKit.configure({
-                table: {
-                    resizable: true,
-                    // View: CustomTableView,
-                },
+            extension: Table.configure({
+                resizable: true,
             }),
         },
+        {
+            name: Extensions.TableRow,
+            extension: TableRow,
+        },
+        {
+            name: Extensions.TableHeader,
+            extension: TableHeader,
+        },
+        {
+            name: Extensions.TableCell,
+            extension: TableCell,
+        },
         {
             name: Extensions.Image,
             extension: CustomImage.configure({

package/dist/RichTextEditor/Plugins/UploadImagesPlugin.js

@@ -107,8 +107,7 @@ export const UploadImagesPlugin = () => new Plugin({
     },
     props: {
         decorations(state) {
-            const decos = this.getState(state);
-            return decos !== null && decos !== void 0 ? decos : null;
+            return this.getState(state);
         },
     },
 });

package/dist/RichTextEditor/RichTextEditor.js

@@ -59,120 +59,23 @@ const StyledContent = styled.div `
     word-break: break-word;
     text-rendering: optimizeLegibility;
 
-    .tableWrapper {
-      position: relative;
-
-      .tiptap-table-menu-container {
-        position: absolute;
-        left: -20px;
-        top: 0;
-
-        display: flex;
-        flex-direction: column;
-      }
-
-      .tiptap-table-menu {
-        display: none;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        background-color: ${({ theme }) => theme.palette.background.default};
-        border-radius: 4px;
-        border: 1px solid ${({ theme }) => theme.palette.divider};
-        padding: 10px;
-        width: 100px;
-        height: 100px;
-
-        z-index: 1000;
-        position: absolute;
-        top: 30px;
-        left: 0px;
-
-        &.show {
-          display: flex;
-        }
-      }
-
-      .tiptap-table-menu-btn {
-        display: none;
-        align-items: center;
-        justify-content: center;
-        flex-direction: column;
-        cursor: pointer;
-
-        padding: 3px;
-        border-radius: 4px;
-        color: ${({ theme }) => theme.palette.text.secondary};
-        font-weight: 500;
-        font-size: 1.25rem;
-
-        &:hover {
-          background-color: ${({ theme }) => theme.palette.action.hover};
-          color: ${({ theme }) => theme.palette.text.primary};
-        }
-      }
-
-      .tiptap-table-addcol-btn {
-        display: none;
-        align-items: center;
-        justify-content: center;
-        flex-direction: column;
-        cursor: pointer;
-        position: absolute;
-        right: -20px;
-        top: 0;
-        width: 20px;
-        height: 100%;
-        background-color: transparent;
-        font-weight: 500;
-        border-radius: 0 4px 4px 0;
-        border-top: 1px solid ${({ theme }) => theme.palette.action.hover};
-        border-bottom: 1px solid ${({ theme }) => theme.palette.action.hover};
-        border-right: 1px solid ${({ theme }) => theme.palette.action.hover};
-        color: ${({ theme }) => theme.palette.text.secondary};
-
-        &:hover {
-          background-color: ${({ theme }) => theme.palette.action.hover};
-          color: ${({ theme }) => theme.palette.text.primary};
-        }
-      }
-    }
-
     table {
-      position: relative;
       border-collapse: collapse;
       width: 100%;
-      table-layout: fixed;
-
-      tr.is-empty::before {
-        display: none;
-      }
 
       th,
       td {
         border: 1px solid ${({ theme }) => theme.palette.divider};
-        padding: 5px;
+        padding: 0.5rem;
         min-width: 100px;
-        white-space: normal;
-        word-break: break-word;
-        overflow-wrap: anywhere;
-        vertical-align: baseline;
-      }
-
-      th.is-empty p::before {
-        display: none;
-      }
-
-      td.is-empty p::before {
-        display: none;
       }
 
       // for table header
       th {
-        background-color: ${({ theme }) => theme.palette.background.alt};
         border: 1px solid ${({ theme }) => theme.palette.divider};
-        padding: 5px;
+        padding: 0.5rem;
         min-width: 100px;
+        background-color: ${({ theme }) => theme.palette.action.hover};
         font-weight: 500;
       }
     }
@@ -236,7 +139,6 @@ const StyledContent = styled.div `
     color: #888;
     pointer-events: none;
     height: 0;
-    white-space: nowrap;
   }
   .ProseMirror .is-empty::before {
     content: attr(data-placeholder);
@@ -244,7 +146,6 @@ const StyledContent = styled.div `
     color: #888;
     pointer-events: none;
     height: 0;
-    white-space: nowrap;
   }
 
   .ProseMirror .monolith-image.uploading {

package/dist/RichTextEditor/Toolbar/Toolbar.d.ts

@@ -18,7 +18,7 @@ export type ToolbarOptions = {
 };
 export type ToolbarProps = {
     className?: string;
-    editor: Editor;
+    editor: Editor | null;
     toolbarOptions?: ToolbarOptions;
 };
-export declare const Toolbar: React.FC<ToolbarProps>;
+export declare const Toolbar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<ToolbarProps, never>> & string & Omit<({ className, editor, toolbarOptions }: ToolbarProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;

package/dist/RichTextEditor/Toolbar/Toolbar.js

@@ -10,27 +10,14 @@ import RichTextEditorContext from "../Contexts/RichTextEditorContext";
 import { Button } from "../../Button";
 import TextColors from "../Enums/TextColors";
 import { SquircleIcon } from "lucide-react";
-import { useToolbarState } from "./useToolbarState";
-const ToolbarContainer = styled.div `
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  justify-content: center;
-  align-items: center;
-  gap: 5px;
-  margin-bottom: 10px;
-  border-radius: 5px 5px 0 0;
-  border: 1px solid transparent;
-`;
-export const Toolbar = ({ className, editor, toolbarOptions, }) => {
+export const Toolbar = styled(({ className, editor, toolbarOptions }) => {
     var _a;
     const theme = useTheme();
     const { controls } = toolbarOptions || {};
     const customItems = controls === null || controls === void 0 ? void 0 : controls.filter((control) => typeof control !== "string" &&
         (control.type === "menu" || control.type === "button"));
     const { font, setFont } = useContext(RichTextEditorContext);
-    const { isInsideTable } = useToolbarState(editor);
-    return (_jsxs(ToolbarContainer, { className: className, children: [(_a = customItems === null || customItems === void 0 ? void 0 : customItems.map) === null || _a === void 0 ? void 0 : _a.call(customItems, (item, index) => {
+    return (_jsxs("div", { className: className, children: [(_a = customItems === null || customItems === void 0 ? void 0 : customItems.map) === null || _a === void 0 ? void 0 : _a.call(customItems, (item, index) => {
                 var _a, _b;
                 if (item.type === "button") {
                     return (_jsx(Button, Object.assign({}, item.options, { children: (_a = item === null || item === void 0 ? void 0 : item.options) === null || _a === void 0 ? void 0 : _a.label }), index));
@@ -73,80 +60,14 @@ export const Toolbar = ({ className, editor, toolbarOptions, }) => {
                                 borderRadius: "3px",
                             } }), item.label] })), size: "xxs", variant: "outlined", arrow: true, buttonProps: {
                     title: "Select Color",
-                }, children: "Color" })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TABLE)) && (_jsx(DropDownMenu, { data: [
-                    {
-                        label: "Insert Table",
-                        value: "insert-table",
-                        onClick: () => {
-                            editor === null || editor === void 0 ? void 0 : editor.chain().focus().insertTable().run();
-                        },
-                        disabled: isInsideTable,
-                    },
-                    {
-                        label: "Insert Column Before",
-                        value: "insert-column-before",
-                        onClick: () => {
-                            editor === null || editor === void 0 ? void 0 : editor.chain().focus().addColumnBefore().run();
-                        },
-                        disabled: !isInsideTable,
-                    },
-                    {
-                        label: "Insert Column After",
-                        value: "insert-column-after",
-                        onClick: () => {
-                            editor === null || editor === void 0 ? void 0 : editor.chain().focus().addColumnAfter().run();
-                        },
-                        disabled: !isInsideTable,
-                    },
-                    {
-                        label: "Delete Column",
-                        value: "delete-column",
-                        onClick: () => {
-                            editor === null || editor === void 0 ? void 0 : editor.chain().focus().deleteColumn().run();
-                        },
-                        disabled: !isInsideTable,
-                    },
-                    {
-                        label: "Insert Row Before",
-                        value: "insert-row-before",
-                        onClick: () => {
-                            editor === null || editor === void 0 ? void 0 : editor.chain().focus().addRowBefore().run();
-                        },
-                        disabled: !isInsideTable,
-                    },
-                    {
-                        label: "Insert Row After",
-                        value: "insert-row-after",
-                        onClick: () => {
-                            editor === null || editor === void 0 ? void 0 : editor.chain().focus().addRowAfter().run();
-                        },
-                        disabled: !isInsideTable,
-                    },
-                    {
-                        label: "Delete Row",
-                        value: "delete-row",
-                        onClick: () => {
-                            editor === null || editor === void 0 ? void 0 : editor.chain().focus().deleteRow().run();
-                        },
-                        disabled: !isInsideTable,
-                    },
-                    {
-                        label: "Toggle Header Row",
-                        value: "toggle-header-row",
-                        onClick: () => {
-                            editor === null || editor === void 0 ? void 0 : editor.chain().focus().toggleHeaderRow().run();
-                        },
-                        disabled: !isInsideTable,
-                    },
-                    {
-                        label: "Delete Table",
-                        value: "delete-table",
-                        onClick: () => {
-                            editor === null || editor === void 0 ? void 0 : editor.chain().focus().deleteTable().run();
-                        },
-                        disabled: !isInsideTable,
-                    },
-                ], size: "xxs", variant: "outlined", arrow: true, buttonProps: {
-                    title: "Select Color",
-                }, children: "Table" })), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.BOLD)) && _jsx(BoldControl, { editor: editor }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.ITALIC)) && (_jsx(ItalicControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.UNDERLINE)) && (_jsx(UnderlineControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.STRIKE)) && (_jsx(StrikeThroughControl, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_1)) && (_jsx(Heading1Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_2)) && (_jsx(Heading2Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_3)) && (_jsx(Heading3Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_4)) && (_jsx(Heading4Control, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.BULLET_LIST)) && (_jsx(BulletListControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.ORDERED_LIST)) && (_jsx(OrderedListControl, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_LEFT)) && (_jsx(AlignLeftControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_CENTER)) && (_jsx(AlignCenterControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_RIGHT)) && (_jsx(AlignRightControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_JUSTIFIED)) && (_jsx(AlignJustifiedControl, { editor: editor }))] })] }));
-};
+                }, children: "Color" })), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.BOLD)) && _jsx(BoldControl, { editor: editor }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.ITALIC)) && (_jsx(ItalicControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.UNDERLINE)) && (_jsx(UnderlineControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.STRIKE)) && (_jsx(StrikeThroughControl, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_1)) && (_jsx(Heading1Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_2)) && (_jsx(Heading2Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_3)) && (_jsx(Heading3Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_4)) && (_jsx(Heading4Control, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.BULLET_LIST)) && (_jsx(BulletListControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.ORDERED_LIST)) && (_jsx(OrderedListControl, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_LEFT)) && (_jsx(AlignLeftControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_CENTER)) && (_jsx(AlignCenterControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_RIGHT)) && (_jsx(AlignRightControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_JUSTIFIED)) && (_jsx(AlignJustifiedControl, { editor: editor }))] })] }));
+}) `
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  gap: 5px;
+  margin-bottom: 10px;
+  border-radius: 5px 5px 0 0;
+  border: 1px solid transparent;
+`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@monolith-forensics/monolith-ui",
-  "version": "1.3.3",
+  "version": "1.3.6",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "author": "Matt Danner (Monolith Forensics LLC)",
@@ -33,23 +33,22 @@
     "@radix-ui/react-switch": "^1.0.7",
     "@radix-ui/react-tooltip": "^1.0.7",
     "@tabler/icons-react": "^3.11.0",
-    "@tiptap/extension-color": "^3.0.9",
-    "@tiptap/extension-focus": "^3.0.9",
-    "@tiptap/extension-horizontal-rule": "^3.0.9",
-    "@tiptap/extension-image": "^3.0.9",
-    "@tiptap/extension-placeholder": "^3.0.9",
-    "@tiptap/extension-table": "^3.0.9",
-    "@tiptap/extension-table-cell": "^3.0.9",
-    "@tiptap/extension-table-header": "^3.0.9",
-    "@tiptap/extension-table-row": "^3.0.9",
-    "@tiptap/extension-text-align": "^3.0.9",
-    "@tiptap/extension-text-style": "^3.0.9",
-    "@tiptap/extension-underline": "^3.0.9",
-    "@tiptap/extensions": "^3.0.9",
-    "@tiptap/pm": "^3.0.9",
-    "@tiptap/react": "^3.0.9",
-    "@tiptap/starter-kit": "^3.0.9",
-    "@tiptap/suggestion": "^3.0.9",
+    "@tiptap/extension-color": "^2.9.1",
+    "@tiptap/extension-focus": "^2.5.9",
+    "@tiptap/extension-horizontal-rule": "^2.5.9",
+    "@tiptap/extension-image": "^2.5.9",
+    "@tiptap/extension-placeholder": "^2.5.9",
+    "@tiptap/extension-table": "^2.5.8",
+    "@tiptap/extension-table-cell": "^2.5.8",
+    "@tiptap/extension-table-header": "^2.5.8",
+    "@tiptap/extension-table-row": "^2.5.8",
+    "@tiptap/extension-text-align": "^2.5.8",
+    "@tiptap/extension-text-style": "^2.9.1",
+    "@tiptap/extension-underline": "^2.5.8",
+    "@tiptap/pm": "^2.5.8",
+    "@tiptap/react": "^2.5.8",
+    "@tiptap/starter-kit": "^2.5.8",
+    "@tiptap/suggestion": "^2.5.9",
     "@uiw/codemirror-theme-vscode": "^4.23.6",
     "@uiw/react-codemirror": "^4.23.6",
     "deepmerge": "^4.3.1",

package/dist/RichTextEditor/Extensions/CustomTableView.d.ts

@@ -1,22 +0,0 @@
-import { TableView as DefaultTableView } from "@tiptap/extension-table";
-import { EditorView } from "@tiptap/pm/view";
-import type { Node as PMNode } from "prosemirror-model";
-export declare class CustomTableView extends DefaultTableView {
-    private addColumnBtn;
-    private tableMenuBtn;
-    private tableMenu;
-    private isOpen;
-    private selectionHandler;
-    private clickOutsideHandler;
-    private view;
-    constructor(node: PMNode, cellMinWidth: number, view: EditorView);
-    update(node: PMNode): boolean;
-    destroy(): void;
-    private renderTableMenu;
-    private renderAddColumnBtn;
-    private updateColumnButtonVisibility;
-    private updateTableMenuVisibility;
-    private toggleMenu;
-    private openMenu;
-    private closeMenu;
-}

package/dist/RichTextEditor/Extensions/CustomTableView.js

@@ -1,137 +0,0 @@
-import { TableView as DefaultTableView } from "@tiptap/extension-table";
-import { addColumnAfter, } from "prosemirror-tables";
-/** Walk up from $pos to find the nearest ancestor table. */
-function findTable(state) {
-    const { $from } = state.selection;
-    return findAncestorOfType($from, "table");
-}
-/** Generic ancestor finder by node.type.name */
-function findAncestorOfType($pos, typeName) {
-    var _a;
-    for (let depth = $pos.depth; depth >= 0; depth--) {
-        const node = $pos.node(depth);
-        if (((_a = node.type) === null || _a === void 0 ? void 0 : _a.name) === typeName) {
-            const pos = depth === 0 ? 0 : $pos.before(depth);
-            return { node, pos };
-        }
-    }
-    return null;
-}
-export class CustomTableView extends DefaultTableView {
-    // NOTE: signature has NO getPos
-    constructor(node, cellMinWidth, view) {
-        // keep default resizing/DOM from the base TableView
-        super(node, cellMinWidth);
-        this.isOpen = true;
-        this.view = view;
-        this.addColumnBtn = null;
-        this.tableMenuBtn = null;
-        this.tableMenu = null;
-        this.selectionHandler = null;
-        this.clickOutsideHandler = () => { };
-        // this.renderTableMenu();
-        this.renderAddColumnBtn();
-    }
-    update(node) {
-        const ok = super.update(node);
-        if (ok)
-            this.updateColumnButtonVisibility();
-        // if (ok) this.updateTableMenuVisibility();
-        return ok;
-    }
-    destroy() {
-        if (this.selectionHandler) {
-            this.view.dom.ownerDocument.removeEventListener("selectionchange", this.selectionHandler);
-        }
-    }
-    renderTableMenu() {
-        var _a;
-        const tableMenuContainer = document.createElement("div");
-        tableMenuContainer.className = "tiptap-table-menu-container";
-        this.tableMenuBtn = document.createElement("div");
-        this.tableMenuBtn.textContent = "⋮";
-        this.tableMenuBtn.title = "Table menu";
-        this.tableMenuBtn.className = "tiptap-table-menu-btn";
-        tableMenuContainer.appendChild(this.tableMenuBtn);
-        this.tableMenu = document.createElement("div");
-        this.tableMenu.className = "tiptap-table-menu";
-        this.tableMenu.style.display = this.isOpen ? "block" : "none";
-        tableMenuContainer.appendChild(this.tableMenu);
-        this.tableMenuBtn.addEventListener("mousedown", (e) => e.preventDefault());
-        this.tableMenuBtn.addEventListener("click", () => {
-            this.toggleMenu();
-        });
-        (_a = this.table.parentElement) === null || _a === void 0 ? void 0 : _a.appendChild(tableMenuContainer);
-        // Visibility & lifecycle
-        this.selectionHandler = () => this.updateTableMenuVisibility();
-        this.view.dom.ownerDocument.addEventListener("selectionchange", this.selectionHandler);
-        this.updateTableMenuVisibility();
-        this.clickOutsideHandler = (e) => {
-            var _a;
-            if (!this.isOpen)
-                return;
-            const target = e.target;
-            if (!((_a = this.tableMenu) === null || _a === void 0 ? void 0 : _a.contains(target)) && target !== this.tableMenuBtn) {
-                this.closeMenu();
-            }
-        };
-        this.view.dom.ownerDocument.addEventListener("mousedown", this.clickOutsideHandler);
-    }
-    renderAddColumnBtn() {
-        var _a;
-        // Create the left-side button
-        this.addColumnBtn = document.createElement("div");
-        this.addColumnBtn.textContent = "+";
-        this.addColumnBtn.title = "Add column";
-        this.addColumnBtn.className = "tiptap-table-addcol-btn";
-        this.addColumnBtn.addEventListener("mousedown", (e) => e.preventDefault());
-        this.addColumnBtn.addEventListener("click", () => {
-            addColumnAfter(this.view.state, this.view.dispatch);
-            this.view.focus();
-        });
-        // The default TableView sets up a wrapper div at this.dom
-        if (getComputedStyle(this.dom).position === "static") {
-            this.dom.style.position = "relative";
-        }
-        (_a = this.table.parentElement) === null || _a === void 0 ? void 0 : _a.appendChild(this.addColumnBtn);
-        // Toggle visibility on selection changes
-        const doc = this.view.dom.ownerDocument;
-        this.selectionHandler = () => this.updateColumnButtonVisibility();
-        doc.addEventListener("selectionchange", this.selectionHandler);
-        this.updateColumnButtonVisibility();
-    }
-    updateColumnButtonVisibility() {
-        const found = findTable(this.view.state);
-        const isInsideThisTable = !!found && found.node === this.node;
-        if (this.addColumnBtn) {
-            this.addColumnBtn.style.display = isInsideThisTable ? "flex" : "none";
-        }
-        if (this.tableMenuBtn) {
-            this.tableMenuBtn.style.display = isInsideThisTable ? "flex" : "none";
-        }
-    }
-    updateTableMenuVisibility() {
-        const found = findTable(this.view.state);
-        const inside = !!found && found.node === this.node;
-        if (!inside)
-            this.closeMenu();
-        // Optional: update position relative to table (e.g., snap left/top)
-        // You can also use the selected cell rect for context-sensitive placement.
-    }
-    toggleMenu() {
-        this.isOpen ? this.closeMenu() : this.openMenu();
-    }
-    openMenu() {
-        this.isOpen = true;
-        if (this.tableMenu) {
-            this.tableMenu.style.display = "block";
-            this.tableMenu.focus();
-        }
-    }
-    closeMenu() {
-        this.isOpen = false;
-        if (this.tableMenu) {
-            this.tableMenu.style.display = "none";
-        }
-    }
-}

package/dist/RichTextEditor/Toolbar/useToolbarState.d.ts

@@ -1,30 +0,0 @@
-import { Editor } from "@tiptap/react";
-export declare const useToolbarState: (editor: Editor) => {
-    isBold: boolean;
-    canBold: boolean;
-    isItalic: boolean;
-    canItalic: boolean;
-    isStrike: boolean;
-    canStrike: boolean;
-    isCode: boolean;
-    canCode: boolean;
-    canClearMarks: boolean;
-    isParagraph: boolean;
-    isHeading1: boolean;
-    isHeading2: boolean;
-    isHeading3: boolean;
-    isHeading4: boolean;
-    isHeading5: boolean;
-    isHeading6: boolean;
-    isBulletList: boolean;
-    isOrderedList: boolean;
-    isCodeBlock: boolean;
-    isBlockquote: boolean;
-    canUndo: boolean;
-    canRedo: boolean;
-    isTable: boolean;
-    isTableRow: boolean;
-    isTableCell: boolean;
-    isTableHeader: boolean;
-    isInsideTable: boolean;
-};

package/dist/RichTextEditor/Toolbar/useToolbarState.js

@@ -1,44 +0,0 @@
-import { useEditorState } from "@tiptap/react";
-export const useToolbarState = (editor) => {
-    const editorState = useEditorState({
-        editor,
-        selector: (ctx) => {
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
-            const isTable = (_a = ctx.editor.isActive("table")) !== null && _a !== void 0 ? _a : false;
-            const isTableRow = (_b = ctx.editor.isActive("tableRow")) !== null && _b !== void 0 ? _b : false;
-            const isTableCell = (_c = ctx.editor.isActive("tableCell")) !== null && _c !== void 0 ? _c : false;
-            const isTableHeader = (_d = ctx.editor.isActive("tableHeader")) !== null && _d !== void 0 ? _d : false;
-            const isInsideTable = isTable || isTableRow || isTableCell || isTableHeader;
-            return {
-                isBold: (_e = ctx.editor.isActive("bold")) !== null && _e !== void 0 ? _e : false,
-                canBold: (_f = ctx.editor.can().chain().toggleBold().run()) !== null && _f !== void 0 ? _f : false,
-                isItalic: (_g = ctx.editor.isActive("italic")) !== null && _g !== void 0 ? _g : false,
-                canItalic: (_h = ctx.editor.can().chain().toggleItalic().run()) !== null && _h !== void 0 ? _h : false,
-                isStrike: (_j = ctx.editor.isActive("strike")) !== null && _j !== void 0 ? _j : false,
-                canStrike: (_k = ctx.editor.can().chain().toggleStrike().run()) !== null && _k !== void 0 ? _k : false,
-                isCode: (_l = ctx.editor.isActive("code")) !== null && _l !== void 0 ? _l : false,
-                canCode: (_m = ctx.editor.can().chain().toggleCode().run()) !== null && _m !== void 0 ? _m : false,
-                canClearMarks: (_o = ctx.editor.can().chain().unsetAllMarks().run()) !== null && _o !== void 0 ? _o : false,
-                isParagraph: (_p = ctx.editor.isActive("paragraph")) !== null && _p !== void 0 ? _p : false,
-                isHeading1: (_q = ctx.editor.isActive("heading", { level: 1 })) !== null && _q !== void 0 ? _q : false,
-                isHeading2: (_r = ctx.editor.isActive("heading", { level: 2 })) !== null && _r !== void 0 ? _r : false,
-                isHeading3: (_s = ctx.editor.isActive("heading", { level: 3 })) !== null && _s !== void 0 ? _s : false,
-                isHeading4: (_t = ctx.editor.isActive("heading", { level: 4 })) !== null && _t !== void 0 ? _t : false,
-                isHeading5: (_u = ctx.editor.isActive("heading", { level: 5 })) !== null && _u !== void 0 ? _u : false,
-                isHeading6: (_v = ctx.editor.isActive("heading", { level: 6 })) !== null && _v !== void 0 ? _v : false,
-                isBulletList: (_w = ctx.editor.isActive("bulletList")) !== null && _w !== void 0 ? _w : false,
-                isOrderedList: (_x = ctx.editor.isActive("orderedList")) !== null && _x !== void 0 ? _x : false,
-                isCodeBlock: (_y = ctx.editor.isActive("codeBlock")) !== null && _y !== void 0 ? _y : false,
-                isBlockquote: (_z = ctx.editor.isActive("blockquote")) !== null && _z !== void 0 ? _z : false,
-                canUndo: (_0 = ctx.editor.can().chain().undo().run()) !== null && _0 !== void 0 ? _0 : false,
-                canRedo: (_1 = ctx.editor.can().chain().redo().run()) !== null && _1 !== void 0 ? _1 : false,
-                isTable,
-                isTableRow,
-                isTableCell,
-                isTableHeader,
-                isInsideTable,
-            };
-        },
-    });
-    return editorState;
-};