@oliasoft-open-source/react-ui-library 5.13.3 → 5.13.5-beta-1

package/dist/index.d.ts

@@ -55,7 +55,7 @@ export declare type AuditLogOperation = 'Created' | 'Cloned' | 'Reverted' | 'Imp
 
 export declare type AuditLogSource = 'System' | 'Application' | 'API';
 
-export declare const Badge: ({ children, color, title, dot, margin, small, }: IBadgeProps) => JSX_2.Element;
+export declare const Badge: ({ children, color, textColor: textColorProp, title, dot, margin, small, }: IBadgeProps) => JSX_2.Element;
 
 export declare const Breadcrumb: ({ links, small }: IBreadcrumbProps) => JSX_2.Element;
 
@@ -215,6 +215,7 @@ declare interface IAuditLogProps {
 export declare interface IBadgeProps {
     children?: ReactNode;
     color?: string;
+    textColor?: string;
     title?: TStringOrNumber | ReactNode | null;
     dot?: boolean;
     margin?: TStringOrNumber | null;

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";
@@ -827,29 +828,28 @@ const Section$1 = ({ section: e, closeOnOptionClick: t, close: n, tree: r, path:
 	placement: e || (t ? "right-start" : "bottom-start")
 }), isStringNumberOrNode = (e) => isString(e) || isNumber(e) || isValidElement(e), getType = (e) => Array.isArray(e) ? "array" : typeof e;
 var badge_module_default = {
-	wrapper: "_wrapper_nwprz_1",
-	badge: "_badge_nwprz_5",
-	label: "_label_nwprz_11",
-	dark: "_dark_nwprz_23",
-	light: "_light_nwprz_26",
-	small: "_small_nwprz_29",
-	dot: "_dot_nwprz_33",
-	hasChildren: "_hasChildren_nwprz_39"
+	wrapper: "_wrapper_14vly_1",
+	badge: "_badge_14vly_5",
+	label: "_label_14vly_11",
+	small: "_small_14vly_23",
+	dot: "_dot_14vly_27",
+	hasChildren: "_hasChildren_14vly_33"
 }, isDark = (e) => {
 	let t = e.substring(1), n = parseInt(t, 16), r = n >> 16 & 255, i = n >> 8 & 255, a = n >> 0 & 255;
 	return .2126 * r + .7152 * i + .0722 * a < 128;
 };
-const Badge = ({ children: e, color: t = "", title: n = null, dot: r = !1, margin: i = null, small: a = !1 }) => {
-	let o = !(n === null && r === !1);
+const Badge = ({ children: e, color: t = "", textColor: n = "", title: r = null, dot: i = !1, margin: a = null, small: o = !1 }) => {
+	let s = !(r === null && i === !1), c = n || (isDark(t) ? "#fff" : "rgba(0, 0, 0, 0.6)");
 	return /* @__PURE__ */ jsxs("div", {
 		className: badge_module_default.wrapper,
-		children: [o && /* @__PURE__ */ jsx("sup", {
-			className: cx(badge_module_default.badge, isDark(t) ? badge_module_default.dark : badge_module_default.light, n === null ? badge_module_default.dot : badge_module_default.label, a ? badge_module_default.small : "", e ? badge_module_default.hasChildren : ""),
+		children: [s && /* @__PURE__ */ jsx("sup", {
+			className: cx(badge_module_default.badge, r === null ? badge_module_default.dot : badge_module_default.label, o ? badge_module_default.small : "", e ? badge_module_default.hasChildren : ""),
 			style: {
 				background: t || void 0,
-				margin: i || void 0
+				margin: a || void 0,
+				color: c
 			},
-			children: n
+			children: r
 		}), e]
 	});
 }, Button$1 = ({ trigger: e, label: t, colored: n, small: r, width: i, disabled: a, groupOrder: o, loading: c, error: l, warning: u, active: d, tabIndex: f }) => {
@@ -5003,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",
@@ -6004,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(!0),
+		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.3",
+  "version": "5.13.5-beta-1",
   "description": "Reusable UI components for React projects",
   "homepage": "https://oliasoft-open-source.gitlab.io/react-ui-library",
   "bugs": {
@@ -39,9 +39,10 @@
   "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/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,10 +65,10 @@
     "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"
+    "styled-components": "^6.1.15",
+    "@tiptap/markdown": "^3.20.0"
   },
   "devDependencies": {
     "@dmsnell/diff-match-patch": "^1.1.0",