@oliasoft-open-source/react-ui-library 5.13.6 → 5.13.7-beta-2

package/dist/index.js

@@ -22,10 +22,11 @@ import { useVirtualizer } from "@tanstack/react-virtual";
 import { SimplifyAP } from "simplify-ts";
 import Papa from "papaparse";
 import { Slide, ToastContainer as Toaster, toast as toast$1 } from "react-toastify";
-import { isNullOrUndefined } from "remirror";
-import { BoldExtension, BulletListExtension, CodeExtension, ItalicExtension, MarkdownExtension, OrderedListExtension, PlaceholderExtension } from "remirror/extensions";
-import { EditorComponent, Remirror, useActive, useCommands, useRemirror } from "@remirror/react";
-import "remirror/styles/all.css";
+import { isNil as isNil$1 } from "es-toolkit";
+import { EditorContent, useEditor } from "@tiptap/react";
+import StarterKit from "@tiptap/starter-kit";
+import Placeholder from "@tiptap/extension-placeholder";
+import { Markdown } from "@tiptap/markdown";
 import { DndProvider } from "react-dnd";
 import { MultiBackend, Tree as Tree$1, getBackendOptions } from "@minoru/react-dnd-treeview";
 import ReactDiffViewer, { DiffMethod } from "react-diff-viewer-continued";
@@ -5002,7 +5003,7 @@ const normalizeParsedResult = (e) => {
 		onClickCopyClipboard: useCallback(async (e) => {
 			let t = await v();
 			if (!t) return;
-			let { fields: n = [], units: r = [], rows: a = [] } = t, o = (r == null ? [] : r).map((e) => e != null && e.length ? e : placeholder$1).slice(0, n.length), s = (e, t) => t === "comma" ? e.replace(/\./g, ",") : e, c = unParse(n, o, a.map((t) => t.map((t) => isNullOrUndefined(t) ? "" : s(t.toString(), e))), { delimiter: "	" });
+			let { fields: n = [], units: r = [], rows: a = [] } = t, o = (r == null ? [] : r).map((e) => e != null && e.length ? e : placeholder$1).slice(0, n.length), s = (e, t) => t === "comma" ? e.replace(/\./g, ",") : e, c = unParse(n, o, a.map((t) => t.map((t) => isNil$1(t) ? "" : s(t.toString(), e))), { delimiter: "	" });
 			try {
 				await navigator.clipboard.writeText(c), transitionToast({ message: {
 					type: "Success",
@@ -6003,94 +6004,95 @@ var rich_text_toolbar_module_default = {
 let RichTextIcon = /* @__PURE__ */ function(e) {
 	return e.BOLD = "bold", e.ITALIC = "italic", e.CODE = "code", e.UL = "ul", e.OL = "ol", e;
 }({});
-const RichTextToolbar = ({ disabled: e = !1, toolbarComponent: t = null }) => {
-	let { focus: n, toggleBold: r, toggleBulletList: i, toggleCode: a, toggleItalic: o, toggleOrderedList: s } = useCommands(), c = useActive(), l = [
+const RichTextToolbar = ({ editor: e, disabled: t = !1, toolbarComponent: n = null }) => {
+	var r, i, a, o, s;
+	let c = [
 		{
 			icon: RichTextIcon.BOLD,
-			onClick: r,
-			active: c.bold()
+			onClick: () => e == null ? void 0 : e.chain().focus().toggleBold().run(),
+			active: (r = e == null ? void 0 : e.isActive("bold")) == null ? !1 : r
 		},
 		{
 			icon: RichTextIcon.ITALIC,
-			onClick: o,
-			active: c.italic()
+			onClick: () => e == null ? void 0 : e.chain().focus().toggleItalic().run(),
+			active: (i = e == null ? void 0 : e.isActive("italic")) == null ? !1 : i
 		},
 		{
 			icon: RichTextIcon.CODE,
-			onClick: a,
-			active: c.code()
+			onClick: () => e == null ? void 0 : e.chain().focus().toggleCode().run(),
+			active: (a = e == null ? void 0 : e.isActive("code")) == null ? !1 : a
 		},
 		{
 			icon: RichTextIcon.UL,
-			onClick: i,
-			active: c.bulletList()
+			onClick: () => e == null ? void 0 : e.chain().focus().toggleBulletList().run(),
+			active: (o = e == null ? void 0 : e.isActive("bulletList")) == null ? !1 : o
 		},
 		{
 			icon: RichTextIcon.OL,
-			onClick: s,
-			active: c.orderedList()
+			onClick: () => e == null ? void 0 : e.chain().focus().toggleOrderedList().run(),
+			active: (s = e == null ? void 0 : e.isActive("orderedList")) == null ? !1 : s
 		}
 	];
 	return /* @__PURE__ */ jsxs("div", {
 		className: rich_text_toolbar_module_default.richTextToolbarContainer,
 		children: [/* @__PURE__ */ jsx("div", {
 			className: rich_text_toolbar_module_default.richTextToolbar,
-			children: l.map((t, r) => /* @__PURE__ */ jsx(Button, {
+			children: c.map((e, n) => /* @__PURE__ */ jsx(Button, {
 				small: !0,
 				round: !0,
 				basic: !0,
-				icon: t.icon,
+				icon: e.icon,
 				colored: Color.MUTED,
-				onClick: () => {
-					t.onClick(), n();
-				},
-				active: t.active,
-				disabled: e
-			}, r))
-		}), t]
+				onClick: e.onClick,
+				active: e.active,
+				disabled: t
+			}, n))
+		}), n]
 	});
 };
 var rich_text_input_module_default = {
-	inputInTable: "_inputInTable_1fb4l_1",
-	inputHover: "_inputHover_1fb4l_13",
-	inputFocus: "_inputFocus_1fb4l_18",
-	inputError: "_inputError_1fb4l_25",
-	inputWarning: "_inputWarning_1fb4l_26",
-	inputDisabled: "_inputDisabled_1fb4l_61",
-	hideScrollbars: "_hideScrollbars_1fb4l_67",
-	richTextInput: "_richTextInput_1fb4l_77"
+	inputInTable: "_inputInTable_gb097_1",
+	inputHover: "_inputHover_gb097_13",
+	inputFocus: "_inputFocus_gb097_18",
+	inputError: "_inputError_gb097_25",
+	inputWarning: "_inputWarning_gb097_26",
+	inputDisabled: "_inputDisabled_gb097_61",
+	hideScrollbars: "_hideScrollbars_gb097_67",
+	richTextInput: "_richTextInput_gb097_77"
 };
 const RichTextInput = memo(forwardRef(({ placeholder: e, onChange: t, value: n, disabled: r, toolbarComponent: i }, a) => {
-	let c = useContext(DisabledContext), u = r || c, { manager: d, state: f, setState: p, getContext: m } = useRemirror({
-		extensions: useCallback(() => [
-			new BoldExtension({}),
-			new BulletListExtension({}),
-			new CodeExtension(),
-			new ItalicExtension(),
-			new MarkdownExtension({}),
-			new OrderedListExtension(),
-			new PlaceholderExtension({ placeholder: e })
-		], [e]),
-		content: n,
-		selection: "start",
-		stringHandler: "markdown"
+	let o = useContext(DisabledContext), u = r || o, d = useEditor({
+		extensions: [
+			StarterKit,
+			Placeholder.configure({ placeholder: e }),
+			Markdown
+		],
+		content: n == null ? "" : n,
+		contentType: "markdown",
+		editable: !u,
+		onUpdate: ({ editor: e }) => {
+			t == null || t(e.getMarkdown());
+		}
 	});
-	return useImperativeHandle(a, () => m(), [m]), /* @__PURE__ */ jsx("div", {
+	return useEffect(() => {
+		if (!d) return;
+		let e = d.getMarkdown();
+		n !== void 0 && n !== e && d.commands.setContent(n, {
+			emitUpdate: !1,
+			contentType: "markdown"
+		});
+	}, [n, d]), useEffect(() => {
+		d && d.setEditable(!u);
+	}, [u, d]), useImperativeHandle(a, () => ({
+		clearContent: () => d == null ? void 0 : d.commands.clearContent(!1),
+		editor: d
+	}), [d]), /* @__PURE__ */ jsxs("div", {
 		className: rich_text_input_module_default.richTextInput,
-		children: /* @__PURE__ */ jsxs(Remirror, {
-			manager: d,
-			state: f,
-			placeholder: e,
-			onChange: ({ helpers: e, state: n }) => {
-				let r = e.getMarkdown(n);
-				t && t(r), p(n);
-			},
-			editable: !u,
-			children: [/* @__PURE__ */ jsx(RichTextToolbar, {
-				disabled: u,
-				toolbarComponent: i
-			}), /* @__PURE__ */ jsx(EditorComponent, {})]
-		})
+		children: [/* @__PURE__ */ jsx(RichTextToolbar, {
+			editor: d,
+			disabled: u,
+			toolbarComponent: i
+		}), /* @__PURE__ */ jsx(EditorContent, { editor: d })]
 	});
 }));
 var row_module_default = { row: "_row_n16je_1" };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oliasoft-open-source/react-ui-library",
-  "version": "5.13.6",
+  "version": "5.13.7-beta-2",
   "description": "Reusable UI components for React projects",
   "homepage": "https://oliasoft-open-source.gitlab.io/react-ui-library",
   "bugs": {
@@ -39,9 +39,11 @@
   "dependencies": {
     "@fontsource/noto-sans": "^5.2.5",
     "@minoru/react-dnd-treeview": "^3.5.0",
-    "@remirror/pm": "^3.0.1",
-    "@remirror/react": "^3.0.3",
     "@tanstack/react-virtual": "^3.13.2",
+    "@tiptap/extension-placeholder": "^3.20.0",
+    "@tiptap/markdown": "^3.20.0",
+    "@tiptap/react": "^3.20.0",
+    "@tiptap/starter-kit": "^3.20.0",
     "@types/rc-slider": "^9.3.1",
     "@types/react-resizable": "^3.0.8",
     "@types/react-window": "^1.8.8",
@@ -64,7 +66,6 @@
     "react-toastify": "^9.1.3",
     "react-transition-group": "^4.4.5",
     "react-window": "^1.8.11",
-    "remirror": "^3.0.3",
     "resize-observer-polyfill": "^1.5.1",
     "simplify-ts": "^1.0.2",
     "styled-components": "^6.1.15"