@monolith-forensics/monolith-ui 1.1.46 → 1.1.47

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

@@ -0,0 +1,21 @@
+import { Editor } from "@tiptap/react";
+interface ControlProps {
+    editor: Editor | null;
+}
+export declare const UndoControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const RedoControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BoldControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ItalicControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const UnderlineControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const StrikeThroughControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Heading1Control: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Heading2Control: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Heading3Control: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Heading4Control: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const BulletListControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const OrderedListControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AlignLeftControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AlignRightControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AlignCenterControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export declare const AlignJustifiedControl: ({ editor }: ControlProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/RichTextEditor/Toolbar/Controls.js

@@ -0,0 +1,120 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { IconBold, IconItalic, IconUnderline, IconStrikethrough, IconH1, IconH2, IconH3, IconH4, IconList, IconListNumbers, IconAlignLeft, IconAlignRight, IconAlignCenter, IconAlignJustified, IconCornerUpLeft, IconCornerUpRight, } from "@tabler/icons-react";
+import Control from "./Control";
+export const UndoControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "undoControlLabel", operation: {
+            name: "undo",
+        }, icon: IconCornerUpLeft }));
+};
+export const RedoControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "redoControlLabel", operation: {
+            name: "redo",
+        }, icon: IconCornerUpRight }));
+};
+export const BoldControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "boldControlLabel", isActive: {
+            name: "bold",
+        }, operation: {
+            name: "toggleBold",
+        }, icon: IconBold }));
+};
+export const ItalicControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "italicControlLabel", isActive: {
+            name: "italic",
+        }, operation: {
+            name: "toggleItalic",
+        }, icon: IconItalic }));
+};
+export const UnderlineControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "underlineControlLabel", isActive: {
+            name: "underline",
+        }, operation: {
+            name: "toggleUnderline",
+        }, icon: IconUnderline }));
+};
+export const StrikeThroughControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "strikeControlLabel", isActive: {
+            name: "strike",
+        }, operation: {
+            name: "toggleStrike",
+        }, icon: IconStrikethrough }));
+};
+export const Heading1Control = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "h1ControlLabel", isActive: {
+            name: "heading",
+            attributes: { level: 1 },
+        }, operation: {
+            name: "toggleHeading",
+            attributes: { level: 1 },
+        }, icon: IconH1 }));
+};
+export const Heading2Control = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "h2ControlLabel", isActive: {
+            name: "heading",
+            attributes: { level: 2 },
+        }, operation: {
+            name: "toggleHeading",
+            attributes: { level: 2 },
+        }, icon: IconH2 }));
+};
+export const Heading3Control = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "h3ControlLabel", isActive: {
+            name: "heading",
+            attributes: { level: 3 },
+        }, operation: {
+            name: "toggleHeading",
+            attributes: { level: 3 },
+        }, icon: IconH3 }));
+};
+export const Heading4Control = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "h4ControlLabel", isActive: {
+            name: "heading",
+            attributes: { level: 4 },
+        }, operation: {
+            name: "toggleHeading",
+            attributes: { level: 4 },
+        }, icon: IconH4 }));
+};
+export const BulletListControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "bulletListControlLabel", isActive: {
+            name: "bulletList",
+        }, operation: {
+            name: "toggleBulletList",
+        }, icon: IconList }));
+};
+export const OrderedListControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "orderedListControlLabel", isActive: {
+            name: "orderedList",
+        }, operation: {
+            name: "toggleOrderedList",
+        }, icon: IconListNumbers }));
+};
+export const AlignLeftControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "alignLeftControlLabel", isActive: {
+            name: { textAlign: "left" },
+        }, operation: {
+            name: "setTextAlign",
+            attributes: "left",
+        }, icon: IconAlignLeft }));
+};
+export const AlignRightControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "alignRightControlLabel", isActive: {
+            name: { textAlign: "right" },
+        }, operation: {
+            name: "setTextAlign",
+            attributes: "right",
+        }, icon: IconAlignRight }));
+};
+export const AlignCenterControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "alignCenterControlLabel", isActive: {
+            name: { textAlign: "center" },
+        }, operation: {
+            name: "setTextAlign",
+            attributes: "center",
+        }, icon: IconAlignCenter }));
+};
+export const AlignJustifiedControl = ({ editor }) => {
+    return (_jsx(Control, { editor: editor, label: "alignJustifiedControlLabel", isActive: {
+            name: { textAlign: "justify" },
+        }, operation: { name: "setTextAlign", attributes: "justify" }, icon: IconAlignJustified }));
+};

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

@@ -0,0 +1,8 @@
+interface ControlsGroupProps {
+    className?: string;
+    children?: React.ReactNode;
+}
+declare const ControlsGroup: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<ControlsGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string & Omit<import("react").ForwardRefExoticComponent<ControlsGroupProps & import("react").RefAttributes<HTMLDivElement>>, keyof import("react").Component<any, {}, any>>;
+export default ControlsGroup;

package/dist/RichTextEditor/Toolbar/ControlsGroup.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import styled from "styled-components";
+const ControlsGroup = styled(forwardRef(({ className, children }, ref) => {
+    return (_jsx("div", { className: className + " controls-group", ref: ref, children: children }));
+})) `
+  & {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+  }
+  & button {
+    border-radius: 0;
+    border: 1px solid ${({ theme }) => theme.palette.divider};
+    border-right: none;
+  }
+  & button:first-child {
+    border-radius: 5px 0 0 5px;
+  }
+  & button:last-child {
+    border-radius: 0 5px 5px 0;
+    border-right: 1px solid ${({ theme }) => theme.palette.divider};
+  }
+`;
+ControlsGroup.displayName = "ControlsGroup";
+export default ControlsGroup;

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

@@ -0,0 +1,41 @@
+declare const Labels: {
+    linkControlLabel: string;
+    colorPickerControlLabel: string;
+    highlightControlLabel: string;
+    boldControlLabel: string;
+    italicControlLabel: string;
+    underlineControlLabel: string;
+    strikeControlLabel: string;
+    clearFormattingControlLabel: string;
+    unlinkControlLabel: string;
+    bulletListControlLabel: string;
+    orderedListControlLabel: string;
+    h1ControlLabel: string;
+    h2ControlLabel: string;
+    h3ControlLabel: string;
+    h4ControlLabel: string;
+    h5ControlLabel: string;
+    h6ControlLabel: string;
+    blockquoteControlLabel: string;
+    alignLeftControlLabel: string;
+    alignCenterControlLabel: string;
+    alignRightControlLabel: string;
+    alignJustifyControlLabel: string;
+    codeControlLabel: string;
+    codeBlockControlLabel: string;
+    subscriptControlLabel: string;
+    superscriptControlLabel: string;
+    unsetColorControlLabel: string;
+    hrControlLabel: string;
+    linkEditorInputLabel: string;
+    linkEditorInputPlaceholder: string;
+    linkEditorExternalLink: string;
+    linkEditorInternalLink: string;
+    linkEditorSave: string;
+    colorPickerCancel: string;
+    colorPickerClear: string;
+    colorPickerColorPicker: string;
+    colorPickerPalette: string;
+    colorPickerSave: string;
+};
+export default Labels;

package/dist/RichTextEditor/Toolbar/Labels.js

@@ -0,0 +1,46 @@
+const Labels = {
+    // Controls labels
+    linkControlLabel: "Link",
+    colorPickerControlLabel: "Text color",
+    highlightControlLabel: "Highlight text",
+    //   colorControlLabel: (color) => `Set text color ${color}`,
+    boldControlLabel: "Bold",
+    italicControlLabel: "Italic",
+    underlineControlLabel: "Underline",
+    strikeControlLabel: "Strikethrough",
+    clearFormattingControlLabel: "Clear formatting",
+    unlinkControlLabel: "Remove link",
+    bulletListControlLabel: "Bullet list",
+    orderedListControlLabel: "Ordered list",
+    h1ControlLabel: "Heading 1",
+    h2ControlLabel: "Heading 2",
+    h3ControlLabel: "Heading 3",
+    h4ControlLabel: "Heading 4",
+    h5ControlLabel: "Heading 5",
+    h6ControlLabel: "Heading 6",
+    blockquoteControlLabel: "Blockquote",
+    alignLeftControlLabel: "Align text: left",
+    alignCenterControlLabel: "Align text: center",
+    alignRightControlLabel: "Align text: right",
+    alignJustifyControlLabel: "Align text: justify",
+    codeControlLabel: "Code",
+    codeBlockControlLabel: "Code block",
+    subscriptControlLabel: "Subscript",
+    superscriptControlLabel: "Superscript",
+    unsetColorControlLabel: "Unset color",
+    hrControlLabel: "Horizontal line",
+    // Link editor
+    linkEditorInputLabel: "Enter URL",
+    linkEditorInputPlaceholder: "https://example.com/",
+    linkEditorExternalLink: "Open link in a new tab",
+    linkEditorInternalLink: "Open link in the same tab",
+    linkEditorSave: "Save",
+    // Color picker control
+    colorPickerCancel: "Cancel",
+    colorPickerClear: "Clear color",
+    colorPickerColorPicker: "Color picker",
+    colorPickerPalette: "Color palette",
+    colorPickerSave: "Save",
+    //   colorPickerColorLabel: (color) => `Set text color ${color}`,
+};
+export default Labels;

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

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

package/dist/RichTextEditor/Toolbar/Toolbar.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from "styled-components";
+import ControlsGroup from "./ControlsGroup";
+import { UndoControl, RedoControl, BoldControl, ItalicControl, UnderlineControl, StrikeThroughControl, Heading1Control, Heading2Control, Heading3Control, Heading4Control, BulletListControl, OrderedListControl, AlignLeftControl, AlignCenterControl, AlignRightControl, AlignJustifiedControl, } from "./Controls";
+const Toolbar = styled(({ className, editor }) => {
+    return (_jsxs("div", { className: className, children: [_jsxs(ControlsGroup, { children: [_jsx(UndoControl, { editor: editor }), _jsx(RedoControl, { editor: editor })] }), _jsxs(ControlsGroup, { children: [_jsx(BoldControl, { editor: editor }), _jsx(ItalicControl, { editor: editor }), _jsx(UnderlineControl, { editor: editor }), _jsx(StrikeThroughControl, { editor: editor })] }), _jsxs(ControlsGroup, { children: [_jsx(Heading1Control, { editor: editor }), _jsx(Heading2Control, { editor: editor }), _jsx(Heading3Control, { editor: editor }), _jsx(Heading4Control, { editor: editor })] }), _jsxs(ControlsGroup, { children: [_jsx(BulletListControl, { editor: editor }), _jsx(OrderedListControl, { editor: editor })] }), _jsxs(ControlsGroup, { children: [_jsx(AlignLeftControl, { editor: editor }), _jsx(AlignCenterControl, { editor: editor }), _jsx(AlignRightControl, { editor: editor }), _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;
+`;
+export default Toolbar;

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

@@ -0,0 +1 @@
+export { default } from "./Toolbar";

package/dist/RichTextEditor/Toolbar/index.js

@@ -0,0 +1 @@
+export { default } from "./Toolbar";

package/dist/RichTextEditor/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from "./RichTextEditor";
+export { default as Extensions } from "./Enums/Extensions";
+export { default as SlashCommands } from "./Enums/SlashCommands";

package/dist/RichTextEditor/index.js

@@ -0,0 +1,3 @@
+export { default } from "./RichTextEditor";
+export { default as Extensions } from "./Enums/Extensions";
+export { default as SlashCommands } from "./Enums/SlashCommands";

package/dist/Utilities/calculateFileHash.d.ts

@@ -0,0 +1,8 @@
+export type Checksum = "MD5" | "SHA-1" | "SHA-256";
+export declare const Checksums: Record<any, Checksum>;
+declare const calculateFileHash: (file: File) => Promise<{
+    md5Hash: string;
+    sha1Hash: string;
+    sha256Hash: string;
+}>;
+export default calculateFileHash;

package/dist/Utilities/calculateFileHash.js

@@ -0,0 +1,38 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import readFileAsBuffer from "./readFileAsBuffer";
+export const Checksums = {
+    MD5: "MD5",
+    SHA1: "SHA-1",
+    SHA256: "SHA-256",
+};
+const hashData = (buffer, checksum) => __awaiter(void 0, void 0, void 0, function* () {
+    if (checksum === Checksums.MD5) {
+        const { default: SparkMD5 } = yield import("spark-md5");
+        const spark = new SparkMD5.ArrayBuffer();
+        spark.append(buffer);
+        return spark.end();
+    }
+    const crypto = window.crypto;
+    if (!crypto || !crypto.subtle) {
+        throw new Error("Web Crypto API not available");
+    }
+    const hash = yield crypto.subtle.digest(checksum, buffer);
+    const hashArray = Array.from(new Uint8Array(hash));
+    return hashArray.map((b) => b.toString(16).padStart(2, "0")).join("");
+});
+const calculateFileHash = (file) => __awaiter(void 0, void 0, void 0, function* () {
+    const buffer = yield readFileAsBuffer(file);
+    const md5Hash = yield hashData(buffer, Checksums.MD5);
+    const sha1Hash = yield hashData(buffer, Checksums.SHA1);
+    const sha256Hash = yield hashData(buffer, Checksums.SHA256);
+    return { md5Hash, sha1Hash, sha256Hash };
+});
+export default calculateFileHash;

package/dist/Utilities/readFileAsBuffer.d.ts

@@ -0,0 +1,2 @@
+declare const readFileAsBuffer: (file: File) => Promise<ArrayBuffer>;
+export default readFileAsBuffer;

package/dist/Utilities/readFileAsBuffer.js

@@ -0,0 +1,10 @@
+const readFileAsBuffer = (file) => {
+    return new Promise((resolve) => {
+        const reader = new FileReader();
+        reader.addEventListener("load", () => {
+            resolve(reader.result);
+        });
+        reader.readAsArrayBuffer(file);
+    });
+};
+export default readFileAsBuffer;

package/dist/index.d.ts

@@ -24,3 +24,4 @@ export { default as Table } from "./Table";
 export { Column } from "./Table";
 export { default as MonolithUIProvider } from "./MonolithUIProvider";
 export { useMonolithUITheme } from "./MonolithUIProvider";
+export { default as RichTextEditor, Extensions, SlashCommands, } from "./RichTextEditor";

package/dist/index.js

@@ -24,3 +24,4 @@ export { default as Table } from "./Table";
 export { Column } from "./Table";
 export { default as MonolithUIProvider } from "./MonolithUIProvider";
 export { useMonolithUITheme } from "./MonolithUIProvider";
+export { default as RichTextEditor, Extensions, SlashCommands, } from "./RichTextEditor";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@monolith-forensics/monolith-ui",
-  "version": "1.1.46",
+  "version": "1.1.47",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "author": "Matt Danner (Monolith Forensics LLC)",
@@ -24,6 +24,21 @@
     "@floating-ui/react": "^0.26.16",
     "@radix-ui/react-switch": "^1.0.7",
     "@radix-ui/react-tooltip": "^1.0.7",
+    "@tabler/icons-react": "^3.11.0",
+    "@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-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",
     "deepmerge": "^4.3.1",
     "lucide-react": "^0.378.0",
     "moment": "^2.29.1",
@@ -35,7 +50,9 @@
     "react-virtualized-auto-sizer": "^1.0.24",
     "react-window": "^1.8.10",
     "short-uuid": "^5.2.0",
+    "spark-md5": "^3.0.2",
     "styled-components": "^6.1.11",
+    "tippy.js": "^6.3.7",
     "use-debounce": "^10.0.0"
   },
   "peerDependencies": {
@@ -44,6 +61,7 @@
   "devDependencies": {
     "@types/overlayscrollbars": "^1.12.5",
     "@types/react-window": "^1.8.8",
+    "@types/spark-md5": "^3.0.4",
     "typescript": "^5.5.4"
   }
 }