@oliasoft-open-source/react-ui-library 5.7.0-beta-16 → 5.7.0-beta-18

package/dist/index.d.ts

@@ -35,7 +35,7 @@ export declare enum Align {
     CENTER = "center"
 }
 
-export declare function AuditLog({ logs, data, total, loading, selectedPage, rowsPerPage, filterToggles, onChangeRowsPerPage, onSelectPage, }: IAuditLogProps): JSX_2.Element;
+export declare const AuditLog: React.FC<IAuditLogProps>;
 
 export declare interface AuditLogItem {
     id: string;
@@ -43,13 +43,13 @@ export declare interface AuditLogItem {
     operation: AuditLogOperation;
     source: AuditLogSource;
     createdAt: string;
-    diffs: JsonDelta | JsonDelta[];
+    diffs: JsonDelta | JsonDelta[] | null;
     operationMetaData?: string;
 }
 
-declare type AuditLogOperation = 'Created' | 'Cloned' | 'Reverted' | 'Imported' | 'Updated';
+export declare type AuditLogOperation = 'Created' | 'Cloned' | 'Reverted' | 'Imported' | 'Updated';
 
-declare type AuditLogSource = 'System' | 'Application' | 'API';
+export declare type AuditLogSource = 'System' | 'Application' | 'API';
 
 export declare const Badge: ({ children, color, title, dot, margin, small, }: IBadgeProps) => JSX_2.Element;
 
@@ -200,6 +200,7 @@ declare interface IAuditLogProps {
     selectedPage: number;
     rowsPerPage: number;
     filterToggles?: FilterToggle[];
+    sectionNames: ISectionName[];
     onSelectPage: (page: number) => void;
     onChangeRowsPerPage: (n: number) => void;
     data: any;
@@ -1253,6 +1254,11 @@ declare interface IScrollDetails {
     infiniteScroll?: boolean;
 }
 
+declare interface ISectionName {
+    sectionKey: string;
+    sectionLabel: string;
+}
+
 declare interface ISelectCell extends TCommonCell {
     type: TCellType;
     name?: string;

package/dist/index.js

@@ -6569,7 +6569,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 	} : {
 		value: G,
 		unit: U
-	}), Ad = k || K?.value === void 0, [J, jd] = useState(w ? PredefinedOptionsMenuState.PREDEFINED : PredefinedOptionsMenuState.CUSTOM), Md = !!(O || n), Y = C && C.find((e) => {
+	}), Od = k || K?.value === void 0, [J, kd] = useState(w ? PredefinedOptionsMenuState.PREDEFINED : PredefinedOptionsMenuState.CUSTOM), Ad = !!(O || n), Y = C && C.find((e) => {
 		if (!e?.value) return;
 		if (E) return E === e.valueKey;
 		let t = isValueWithUnit(e.value) ? getUnit(e.value) : "", { value: n = l } = convertUnit({
@@ -6578,7 +6578,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 			toUnit: t
 		});
 		return withUnit(n, t) === e.value;
-	}), Nd = () => {
+	}), jd = () => {
 		let e = l ?? "", t = K.unit;
 		if (checkConversion({
 			value: e,
@@ -6592,7 +6592,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 				return null;
 			}
 		} else return getAltUnitsListByQuantity(u)?.map((e) => ["", e?.unit]);
-	}, Pd = (t) => {
+	}, Md = (t) => {
 		let n = getStringName(e), r = t.target, { value: i, selectionStart: a } = r, o = withUnit(i, K?.unit || ""), s = A ? withUnit(convertAndGetValue(o, B), B) : o;
 		h({ target: {
 			value: s,
@@ -6605,7 +6605,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 		}), R(() => {
 			r.selectionStart = a, r.selectionEnd = a;
 		});
-	}, Fd = (e, t) => {
+	}, Nd = (e, t) => {
 		t === K.unit || isNaN(Number(e)) || (q({
 			value: e,
 			unit: t
@@ -6636,7 +6636,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 			e !== void 0 && q({
 				value: e,
 				unit: t
-			}), C && jd(Y && T ? PredefinedOptionsMenuState.PREDEFINED : PredefinedOptionsMenuState.CUSTOM);
+			}), C && kd(Y && T ? PredefinedOptionsMenuState.PREDEFINED : PredefinedOptionsMenuState.CUSTOM);
 		}
 	}, [
 		U,
@@ -6644,7 +6644,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 		i,
 		T
 	]);
-	let X = Nd(), Z = label(K.unit) || K.unit || "", Id = p || !X || X && X.length === 1, Q = getStringName(e), $, Ld = (t) => {
+	let X = jd(), Z = label(K.unit) || K.unit || "", Pd = p || !X || X && X.length === 1, Q = getStringName(e), $, Fd = (t) => {
 		let r = t?.value ? t.value : "", [i = "", a = ""] = isValueWithUnit(r) ? split(r) : [r], o = withPrettyUnitLabel(r);
 		if (checkConversion({
 			value: r,
@@ -6664,7 +6664,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 			type: MenuType.OPTION,
 			inline: !0,
 			onClick: () => {
-				validateNumber(i).valid && !n && (jd(PredefinedOptionsMenuState.PREDEFINED), h({ target: {
+				validateNumber(i).valid && !n && (kd(PredefinedOptionsMenuState.PREDEFINED), h({ target: {
 					value: r,
 					name: typeof e == "string" ? e : e?.fieldName || "",
 					predefinedSelected: !0,
@@ -6691,10 +6691,10 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 		label: "Custom",
 		selected: J === PredefinedOptionsMenuState.CUSTOM
 	}], C?.length) {
-		let e = C.map(Ld);
+		let e = C.map(Fd);
 		$ = [...$, ...e];
 	}
-	let Rd = (e) => {
+	let Id = (e) => {
 		if (isValueWithUnit(e)) {
 			let t = getUnit(e), { value: n } = safeConvertValue({
 				value: e,
@@ -6706,7 +6706,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 			return n;
 		}
 		return e;
-	}, zd = !C && (!F || F === GroupOrder.FIRST) ? GroupOrder.FIRST : GroupOrder.MIDDLE, Bd = !F || F === GroupOrder.LAST ? GroupOrder.LAST : GroupOrder.MIDDLE;
+	}, Ld = !C && (!F || F === GroupOrder.FIRST) ? GroupOrder.FIRST : GroupOrder.MIDDLE, Rd = !F || F === GroupOrder.LAST ? GroupOrder.LAST : GroupOrder.MIDDLE;
 	return /* @__PURE__ */ jsx("div", {
 		className: J === PredefinedOptionsMenuState.PREDEFINED ? cx(unit_input_module_default.predefinedMenuActive) : "",
 		children: /* @__PURE__ */ jsxs(InputGroup, {
@@ -6738,31 +6738,31 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 						name: Q,
 						testId: x,
 						disabled: n,
-						placeholder: Rd(t),
+						placeholder: Id(t),
 						value: K.value,
-						onChange: Pd,
+						onChange: Md,
 						onFocus: v,
 						error: i === null ? void 0 : i,
 						warning: S === null ? void 0 : S,
 						left: a,
-						allowEmpty: Ad,
+						allowEmpty: Od,
 						validationCallback: (e, t) => D(Q, t),
 						enableCosmeticRounding: j,
 						enableDisplayRounding: M,
 						roundDisplayValue: N,
-						groupOrder: zd,
-						disableInternalErrorValidationMessages: Md,
+						groupOrder: Ld,
+						disableInternalErrorValidationMessages: Ad,
 						small: o,
 						selectOnFocus: P,
 						tooltip: I
 					}, Q)
 				}),
-				Z && (Id || !H ? /* @__PURE__ */ jsx(InputGroupAddon, {
-					groupOrder: Bd,
+				Z && (Pd || !H ? /* @__PURE__ */ jsx(InputGroupAddon, {
+					groupOrder: Rd,
 					small: o,
 					children: Z
 				}) : /* @__PURE__ */ jsx(Menu, {
-					groupOrder: Bd,
+					groupOrder: Rd,
 					maxHeight: 380,
 					disabled: r,
 					testId: x && `${x}-menu`,
@@ -6778,7 +6778,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 								label: j ? safeRoundNumbers(i) : i,
 								inline: !0,
 								onClick: (n) => {
-									n.stopPropagation(), Fd(e, t);
+									n.stopPropagation(), Nd(e, t);
 								},
 								description: r,
 								selected: r === Z,
@@ -7040,8 +7040,8 @@ const DiffViewer = ({ oldJson: e, newJson: t, viewType: n = SPLIT_VIEW }) => {
 	}, [n]);
 	let s = ({ target: { value: e } }) => {
 		a(e);
-	}, { added: l, removed: u } = renderLinesCount(e, t), d = l + u, f = d > 3500;
-	return console.log("typeof ReactDiffViewer:", typeof ReactDiffViewer), console.log(typeof e, typeof t), console.log("logs", n, l, u, d, f, DiffMethod.WORDS), /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(Card, {
+	}, { added: l, removed: u } = renderLinesCount(e, t), d = l + u > 3500;
+	return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(Card, {
 		bordered: !0,
 		heading: /* @__PURE__ */ jsxs(Flex, {
 			gap: !0,
@@ -7055,7 +7055,7 @@ const DiffViewer = ({ oldJson: e, newJson: t, viewType: n = SPLIT_VIEW }) => {
 			}), /* @__PURE__ */ jsxs(Text, {
 				error: !0,
 				children: ["-", u]
-			})] }) }), !f && /* @__PURE__ */ jsx(RadioButton, {
+			})] }) }), !d && /* @__PURE__ */ jsx(RadioButton, {
 				name: "viewType",
 				options: o,
 				value: i,
@@ -7064,7 +7064,7 @@ const DiffViewer = ({ oldJson: e, newJson: t, viewType: n = SPLIT_VIEW }) => {
 			})]
 		}),
 		padding: !1,
-		children: f ? /* @__PURE__ */ jsx("div", {
+		children: d ? /* @__PURE__ */ jsx("div", {
 			style: { padding: "5px" },
 			children: /* @__PURE__ */ jsx(Text, {
 				muted: !0,
@@ -8329,80 +8329,77 @@ diff_match_patch.Diff = function(e, t) {
 	}
 	return n.join("").replace(/%20/g, " ");
 };
-const createDiffPatcher = (e = {}) => create({
+var jsondiffpatcher = ((e = {}) => create({
 	...e,
 	textDiff: {
 		diffMatchPatch: diff_match_patch,
 		minLength: 120
 	},
 	cloneDiffValues: !0
-});
-var sectionMap = Object.fromEntries([
-	{
-		sectionKey: "hierarchy",
-		sectionLabel: "Hierarchy"
-	},
-	{
-		sectionKey: "hierarchyPermissions",
-		sectionLabel: "Hierarchy Permissions"
-	},
-	{
-		sectionKey: "hierarchyOptionalParameters",
-		sectionLabel: "Hierarchy Optional Parameters"
-	},
-	{
-		sectionKey: "appearance",
-		sectionLabel: "General"
-	},
-	{
-		sectionKey: "generalUnitPrecision",
-		sectionLabel: "General — Unit Precision"
-	},
-	{
-		sectionKey: "trajectory",
-		sectionLabel: "Trajectory"
-	},
-	{
-		sectionKey: "antiCollision",
-		sectionLabel: "Anti-Collision"
-	},
-	{
-		sectionKey: "casingDesign",
-		sectionLabel: "Casing Design"
-	},
-	{
-		sectionKey: "annularFluidExpansion",
-		sectionLabel: "Annular Fluid Expansion"
-	},
-	{
-		sectionKey: "drillingMechanics",
-		sectionLabel: "Drilling Mechanics"
-	},
-	{
-		sectionKey: "wear",
-		sectionLabel: "Drilling Mechanics"
-	},
-	{
-		sectionKey: "tempsim",
-		sectionLabel: "Temperature Simulation"
-	},
-	{
-		sectionKey: "libraries",
-		sectionLabel: "Libraries"
-	},
-	{
-		sectionKey: "automaticDesign",
-		sectionLabel: "Automatic Design"
-	},
-	{
-		sectionKey: "webhooks",
-		sectionLabel: "Webhooks"
-	}
-].map((e) => [e.sectionKey, e.sectionLabel]));
-const getSectionName = (e) => {
-	for (let t = e.length - 1; t >= 0; t--) {
-		let n = e[t], r = sectionMap[n];
-		if (r) return r;
+}))(), isObj = (e) => isObject(e) && !Array.isArray(e), countOne = (e) => {
+	let t = {
+		total: 0,
+		added: 0,
+		removed: 0,
+		modified: 0,
+		moved: 0,
+		text: 0
+	}, n = (e) => {
+		if (Array.isArray(e)) {
+			let n = e[0];
+			if (typeof n == "string" && n.startsWith("@@")) {
+				t.text++, t.total++;
+				return;
+			}
+			if (e.length === 1) {
+				t.added++, t.total++;
+				return;
+			}
+			if (e.length === 2) {
+				t.modified++, t.total++;
+				return;
+			}
+			if (e.length === 3) {
+				let n = e[2];
+				if (n === 0) {
+					t.removed++, t.total++;
+					return;
+				}
+				if (n === 3) {
+					t.moved++, t.total++;
+					return;
+				}
+				t.modified++, t.total++;
+				return;
+			}
+			t.modified++, t.total++;
+			return;
+		}
+		if (isObj(e)) {
+			if (e._t === "a") {
+				for (let t in e) t !== "_t" && n(e[t]);
+				return;
+			}
+			for (let t in e) n(e[t]);
+		}
+	};
+	return n(e), t;
+};
+const countDeltas = (e) => (Array.isArray(e) ? e : e ? [e] : []).reduce((e, t) => {
+	let n = countOne(t);
+	return e.total += n.total, e.added += n.added, e.removed += n.removed, e.modified += n.modified, e.moved += n.moved, e.text += n.text, e;
+}, {
+	total: 0,
+	added: 0,
+	removed: 0,
+	modified: 0,
+	moved: 0,
+	text: 0
+}), getSectionName = (e, t) => {
+	let n = Object.fromEntries(e.map((e) => [e.sectionKey, e.sectionLabel]));
+	for (let e = t.length - 1; e >= 0; e--) {
+		let r = t[e], i = n[r];
+		if (i) return i;
 	}
 	return "";
 }, defaultMessage = (e) => {
@@ -8437,25 +8434,49 @@ const getSectionName = (e) => {
 			after: ""
 		};
 	}
-}, ChangesOverview = ({ diffs: e }) => {
-	let t = {
+};
+var isDeltaArray = (e) => Array.isArray(e), unpatchWith = (e, t) => t ? isDeltaArray(t) ? t.length === 0 ? e : t.reduce((e, t) => jsondiffpatcher.unpatch(cloneDeep(e), cloneDeep(t)), cloneDeep(e)) : jsondiffpatcher.unpatch(cloneDeep(e), cloneDeep(t)) : e;
+const createDiffJson = (e, t, n) => {
+	let r = t.filter((t) => !!t.diffs && t.createdAt >= e.createdAt), i = Array(r.length + 1);
+	i[0] = cloneDeep(n);
+	let a = "", o = "";
+	try {
+		for (let e = 0; e < r.length; e++) {
+			let t = r[e]?.diffs ?? null;
+			if (!t) {
+				i[e + 1] = i[e];
+				continue;
+			}
+			i[e + 1] = unpatchWith(i[e], t);
+		}
+		let e = r.length > 0 ? i[r.length - 1] : n, t = r.length > 0 ? i[r.length] : n;
+		a = JSON.stringify(t ?? "", null, 2), o = JSON.stringify(e ?? "", null, 2);
+	} catch (e) {
+		console.error("err", e);
+	}
+	return {
+		oldJson: a,
+		newJson: o
+	};
+}, ChangesOverview = ({ sectionNames: e, diffs: t }) => {
+	let n = {
 		headers: [{ cells: [
 			{ value: "Type" },
 			{ value: "Before" },
 			{ value: "After" },
 			{ value: "" }
 		] }],
-		rows: e.map((e) => {
-			let { deltaFormat: t, path: n } = e, r = getSectionName(n), { type: i, before: a, after: o } = defaultMessage(t);
+		rows: t.map((t) => {
+			let { deltaFormat: n, path: r } = t, i = getSectionName(e, r), { type: a, before: o, after: s } = defaultMessage(n);
 			return { cells: [
-				{ value: i },
 				{ value: a },
 				{ value: o },
-				{ value: r }
+				{ value: s },
+				{ value: i }
 			] };
 		})
 	};
-	return /* @__PURE__ */ jsx(Table, { table: t });
+	return /* @__PURE__ */ jsx(Table, { table: n });
 }, viewTypes = Object.freeze({
 	summary: {
 		label: "Summary",
@@ -8466,7 +8487,7 @@ const getSectionName = (e) => {
 		value: "compare"
 	}
 });
-var jsondiffpatcher = createDiffPatcher(), isDeltaArray = (e) => Array.isArray(e), unpatchWith = (e, t) => t ? isDeltaArray(t) ? t.length === 0 ? e : t.reduce((e, t) => jsondiffpatcher.unpatch(cloneDeep(e), cloneDeep(t)), cloneDeep(e)) : jsondiffpatcher.unpatch(cloneDeep(e), cloneDeep(t)) : e, transformDiffs = (e) => {
+var transformDiffs = (e) => {
 	let t = ["user", "unittemplate"], n = [], r = [], i = (e) => {
 		e && Object.keys(e).forEach((a) => {
 			t.includes(a) || (r.push(a), isArray(e[a]) ? n.push({
@@ -8477,37 +8498,14 @@ var jsondiffpatcher = createDiffPatcher(), isDeltaArray = (e) => Array.isArray(e
 	};
 	return e ? (i(e), n) : [];
 };
-const createDiffJson = (e, t, n) => {
-	let r = t.filter((t) => !!t.diffs && t.createdAt >= e.createdAt), i = Array(r.length + 1);
-	i[0] = cloneDeep(n);
-	let a = "", o = "";
-	try {
-		for (let e = 0; e < r.length; e++) {
-			let t = r[e]?.diffs ?? null;
-			if (!t) {
-				i[e + 1] = i[e];
-				continue;
-			}
-			i[e + 1] = unpatchWith(i[e], t);
-		}
-		let e = r.length > 0 ? i[r.length - 1] : n, t = r.length > 0 ? i[r.length] : n;
-		a = JSON.stringify(t ?? "", null, 2), o = JSON.stringify(e ?? "", null, 2);
-	} catch (e) {
-		console.error("err", e);
-	}
-	return {
-		oldJson: a,
-		newJson: o
-	};
-};
-var comparison_view_modal_default = ({ auditLog: e, auditLogs: t, data: n, isOpen: r, onClose: i }) => {
-	let { diffs: a = void 0 } = e || {};
-	if (!a) return null;
-	let o = [viewTypes.summary, viewTypes.compare].map(({ label: e, value: t }) => ({
+const ComparisonViewModal = ({ auditLog: e, auditLogs: t, data: n, isOpen: r, sectionNames: i, onClose: a }) => {
+	let { diffs: o = void 0 } = e || {};
+	if (!o) return null;
+	let s = [viewTypes.summary, viewTypes.compare].map(({ label: e, value: t }) => ({
 		label: e,
 		value: t
-	})), [s, c] = useState(o[0]), { oldJson: l, newJson: u } = createDiffJson(e, t, n);
-	return console.log(typeof l, typeof u), console.log("React gui library:", l, u), /* @__PURE__ */ jsx(Modal, {
+	})), [c, l] = useState(s[0]), { oldJson: u, newJson: d } = createDiffJson(e, t, n);
+	return /* @__PURE__ */ jsx(Modal, {
 		visible: r,
 		centered: !0,
 		children: /* @__PURE__ */ jsx(Dialog, { dialog: {
@@ -8515,86 +8513,27 @@ var comparison_view_modal_default = ({ auditLog: e, auditLogs: t, data: n, isOpe
 			heading: "Comparison view",
 			content: /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Tabs, {
 				name: "ViewTab",
-				onChange: (e) => c(o.find((t) => t.value === e.target.value)),
-				options: o,
-				value: s
-			}), s.value === "summary" ? /* @__PURE__ */ jsx(ChangesOverview, { diffs: transformDiffs(a) }) : /* @__PURE__ */ jsx(DiffViewer, {
-				oldJson: l,
-				newJson: u
+				onChange: (e) => l(s.find((t) => t.value === e.target.value)),
+				options: s,
+				value: c
+			}), c.value === "summary" ? /* @__PURE__ */ jsx(ChangesOverview, {
+				sectionNames: i,
+				diffs: transformDiffs(o)
+			}) : /* @__PURE__ */ jsx(DiffViewer, {
+				oldJson: u,
+				newJson: d
 			})] }),
 			footer: /* @__PURE__ */ jsx(Button, {
 				label: "Cancel",
-				onClick: i
+				onClick: a
 			}),
-			onClose: i,
+			onClose: a,
 			width: "90vw",
 			height: "90vh"
 		} })
 	});
-}, isObj = (e) => !!e && typeof e == "object" && !Array.isArray(e), countOne = (e) => {
-	let t = {
-		total: 0,
-		added: 0,
-		removed: 0,
-		modified: 0,
-		moved: 0,
-		text: 0
-	}, n = (e) => {
-		if (Array.isArray(e)) {
-			let n = e[0];
-			if (typeof n == "string" && n.startsWith("@@")) {
-				t.text++, t.total++;
-				return;
-			}
-			if (e.length === 1) {
-				t.added++, t.total++;
-				return;
-			}
-			if (e.length === 2) {
-				t.modified++, t.total++;
-				return;
-			}
-			if (e.length === 3) {
-				let n = e[2];
-				if (n === 0) {
-					t.removed++, t.total++;
-					return;
-				}
-				if (n === 3) {
-					t.moved++, t.total++;
-					return;
-				}
-				t.modified++, t.total++;
-				return;
-			}
-			t.modified++, t.total++;
-			return;
-		}
-		if (isObj(e)) {
-			if (e._t === "a") {
-				for (let t in e) t !== "_t" && n(e[t]);
-				return;
-			}
-			for (let t in e) n(e[t]);
-		}
-	};
-	return n(e), t;
-};
-function countDeltas(e) {
-	return (Array.isArray(e) ? e : e ? [e] : []).reduce((e, t) => {
-		let n = countOne(t);
-		return e.total += n.total, e.added += n.added, e.removed += n.removed, e.modified += n.modified, e.moved += n.moved, e.text += n.text, e;
-	}, {
-		total: 0,
-		added: 0,
-		removed: 0,
-		modified: 0,
-		moved: 0,
-		text: 0
-	});
-}
-function AuditLog({ logs: e, data: t, total: n, loading: r, selectedPage: i, rowsPerPage: a, filterToggles: o = [], onChangeRowsPerPage: s, onSelectPage: c }) {
-	let [l, u] = useState(!1), [d, f] = useState(null), p = [
+}, AuditLog = ({ logs: e, data: t, total: n, loading: r, selectedPage: i, rowsPerPage: a, sectionNames: o, filterToggles: s = [], onChangeRowsPerPage: c, onSelectPage: l }) => {
+	let [u, d] = useState(!1), [f, p] = useState(null), h = [
 		{
 			label: "10 / page",
 			value: 10
@@ -8611,7 +8550,7 @@ function AuditLog({ logs: e, data: t, total: n, loading: r, selectedPage: i, row
 			label: "Show all",
 			value: 0
 		}
-	], h = ({ diffs: e, userName: t, source: n, operation: r, operationMetaData: i }) => {
+	], g = ({ diffs: e, userName: t, source: n, operation: r, operationMetaData: i }) => {
 		let a = countDeltas(e), o = a.total ? `${a.total} change${a.total === 1 ? "" : "s"}` : "no field changes";
 		if (n === "API") return r === "Created" ? `Created through API by ${t || "Unknown user"}` : `Changed through API by ${t || "Unknown user"}`;
 		switch (r) {
@@ -8622,18 +8561,18 @@ function AuditLog({ logs: e, data: t, total: n, loading: r, selectedPage: i, row
 			case "Updated": return `Updated by ${t} (${o})`;
 			default: return `Change by ${t}`;
 		}
-	}, g = [{ cells: [
+	}, _ = [{ cells: [
 		{ value: "Change" },
 		{ value: "Modified by" },
 		{ value: "Using" },
 		{ value: "Operation" },
 		{ value: "Date" }
-	] }], _ = e.map((e) => ({ cells: [
+	] }], v = e.map((e) => ({ cells: [
 		{
-			value: h(e),
+			value: g(e),
 			type: "Link",
 			onClick: () => {
-				u(!0), f(e);
+				d(!0), p(e);
 			},
 			breakWord: !0
 		},
@@ -8661,7 +8600,7 @@ function AuditLog({ logs: e, data: t, total: n, loading: r, selectedPage: i, row
 		heading: /* @__PURE__ */ jsxs(Flex, {
 			gap: !0,
 			wrap: !0,
-			children: [/* @__PURE__ */ jsx(Heading, { children: "CHANGES" }), o?.map((e) => /* @__PURE__ */ jsx(Toggle, {
+			children: [/* @__PURE__ */ jsx(Heading, { children: "CHANGES" }), s?.map((e) => /* @__PURE__ */ jsx(Toggle, {
 				small: e.small ?? !0,
 				checked: e.checked,
 				onChange: e.onChange,
@@ -8675,8 +8614,8 @@ function AuditLog({ logs: e, data: t, total: n, loading: r, selectedPage: i, row
 			theme: Theme.WHITE,
 			children: /* @__PURE__ */ jsx(Spinner, { dark: !0 })
 		}) : /* @__PURE__ */ jsx(Table, { table: {
-			headers: g,
-			rows: _,
+			headers: _,
+			rows: v,
 			fixedWidth: "100%",
 			bordered: !1,
 			actionsRight: !0,
@@ -8686,24 +8625,24 @@ function AuditLog({ logs: e, data: t, total: n, loading: r, selectedPage: i, row
 				rowsPerPage: {
 					onChange: (e) => {
 						let { value: t } = e.target;
-						s(Number(t));
+						c(Number(t));
 					},
-					options: p,
+					options: h,
 					value: a
 				},
-				onSelectPage: (e) => c(e),
+				onSelectPage: (e) => l(e),
 				small: !0
 			} }
 		} })
-	}), l && d && /* @__PURE__ */ jsx(comparison_view_modal_default, {
-		isOpen: l,
-		onClose: () => u(!1),
+	}), u && f && /* @__PURE__ */ jsx(ComparisonViewModal, {
+		sectionNames: o,
+		isOpen: u,
+		onClose: () => d(!1),
 		auditLogs: e,
-		auditLog: d,
+		auditLog: f,
 		data: t
 	})] });
-}
-const isPrimitiveValue = (e) => typeof e == "string" || typeof e == "number" || typeof e == "boolean" || e === null, initializeGuiLibrary = (e) => {
+}, isPrimitiveValue = (e) => typeof e == "string" || typeof e == "number" || typeof e == "boolean" || e === null, initializeGuiLibrary = (e) => {
 	setConfig(ConfigKeyType.LanguageKey, e.languageKey), Object.entries(e).forEach(([e, t]) => {
 		if (e === ConfigKeyType.Translations) setConfig(e, getTranslations(t));
 		else {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oliasoft-open-source/react-ui-library",
-  "version": "5.7.0-beta-16",
+  "version": "5.7.0-beta-18",
   "description": "Reusable UI components for React projects",
   "homepage": "https://oliasoft-open-source.gitlab.io/react-ui-library",
   "bugs": {