@oliasoft-open-source/react-ui-library 5.15.4 → 5.16.1-beta-1

package/dist/index.d.ts

@@ -1550,6 +1550,7 @@ export declare interface ITableImportExportConfig {
     copyFromClipBoard?: boolean;
     showDeleteOptions?: boolean;
     showHelpOption?: boolean;
+    showUploadFileOption?: boolean;
     onDeleteRows?: (type: 'all') => void;
     onImportComplete?: (data: IImportData) => void;
 }
@@ -1799,6 +1800,7 @@ export declare interface ITreeProps {
         isOpen: boolean;
         onToggle: (id: TStringOrNumber) => void;
     }) => ReactElement;
+    placeholderIndent?: TStringOrNumber;
 }
 
 declare interface ITreeRowItem extends TRowType_2 {
@@ -1811,7 +1813,7 @@ declare interface ITreeRowItem extends TRowType_2 {
 
 export declare interface ITreeTableProps extends ITreeProps {
     table: {
-        columnAlignment?: (Align.LEFT | Align.RIGHT)[];
+        columnAlignment?: (Align.LEFT | Align.RIGHT | null)[];
         columnWidths?: string[];
         fixedWidth?: string;
         headers?: TRowType_2[];
@@ -2211,7 +2213,7 @@ declare const TRANSLATION_FALLBACK: {
     unknown: string;
 };
 
-export declare const Tree: ({ list, canDrop, draggable, onListReorder, onChangeOpen, testId, isInitialOpen, autoOpenActiveItems, treeRef: treeRefProp, itemHasChild, onItemToggle, icons, allowParentReassignment, stickyHeader, height, render, }: ITreeProps) => JSX_2.Element;
+export declare const Tree: ({ list, canDrop, draggable, onListReorder, onChangeOpen, testId, isInitialOpen, autoOpenActiveItems, treeRef: treeRefProp, itemHasChild, onItemToggle, icons, allowParentReassignment, stickyHeader, height, render, placeholderIndent, }: ITreeProps) => JSX_2.Element;
 
 export declare const TreeTable: ({ allowParentReassignment, autoOpenActiveItems, canDrop, draggable, icons, isInitialOpen, itemHasChild, onItemToggle, onListReorder, onChangeOpen, table, testId, treeRef, }: ITreeTableProps) => JSX_2.Element;
 

package/dist/index.js

@@ -5200,158 +5200,158 @@ var initialState = {
 };
 const TableImportExport = ({ config: e, smartUploadConfig: t, testId: n }) => {
 	var r, i, a, o;
-	let { exportData: s, beforeExportData: c, prevalidationConfig: l, validationRules: u, title: d, translations: f, textOnly: p = !1, showImportOptions: g = !0, copyFromClipBoard: _ = !0, showDeleteOptions: v = !0, showHelpOption: y = !0, modals: b = [], dynamicOptions: x, onImportComplete: S } = e == null ? {} : e, [C, w] = useState(initialState), { modalVisibility: { smartUploadModal: T = !1, reviewPasteModal: E = !1, helpModal: D = !1 } } = C, { enabled: O, prompt: k = "", onClose: A, onError: j, service: M = () => Promise.resolve() } = t == null ? {} : t, N = useTranslationMap(f), P = useExportData(N, s, c), [F, I] = useTransition(), L = useDataImportActions({
+	let { exportData: s, beforeExportData: c, prevalidationConfig: l, validationRules: u, title: d, translations: f, textOnly: p = !1, showImportOptions: g = !0, copyFromClipBoard: _ = !0, showDeleteOptions: v = !0, showHelpOption: y = !0, showUploadFileOption: b = !0, modals: x = [], dynamicOptions: S, onImportComplete: C } = e == null ? {} : e, [w, T] = useState(initialState), { modalVisibility: { smartUploadModal: E = !1, reviewPasteModal: D = !1, helpModal: O = !1 } } = w, { enabled: k, prompt: A = "", onClose: j, onError: M, service: N = () => Promise.resolve() } = t == null ? {} : t, P = useTranslationMap(f), F = useExportData(P, s, c), [I, L] = useTransition(), R = useDataImportActions({
 		config: e,
-		state: C,
-		setState: w,
+		state: w,
+		setState: T,
 		smartUploadConfig: t,
-		startTransition: I
-	}), { readAndParseInput: R, updateState: z, closeModals: B, setModalVisibility: V, onFileChange: H, onClickQuickPasteFromClipBoard: U, onClickCopyClipboard: W, onSmartUploadResult: G, deleteAllRows: K } = L == null ? {} : L;
-	useKeyboardEvent("Escape", () => B());
-	let q = g ? [
-		{
+		startTransition: L
+	}), { readAndParseInput: z, updateState: B, closeModals: V, setModalVisibility: H, onFileChange: U, onClickQuickPasteFromClipBoard: W, onClickCopyClipboard: G, onSmartUploadResult: K, deleteAllRows: q } = R == null ? {} : R;
+	useKeyboardEvent("Escape", () => V());
+	let J = g ? [
+		...b ? [{
 			type: "Option",
-			label: N("uploadFile"),
+			label: P("uploadFile"),
 			upload: !0,
 			uploadType: ".csv,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
-			onChange: H,
+			onChange: U,
 			testId: `${n}-option-upload-file`
-		},
+		}] : [],
 		..._ ? [{
 			type: "Option",
-			label: N("quickPasteFromClipboard"),
-			onClick: U,
+			label: P("quickPasteFromClipboard"),
+			onClick: W,
 			testId: `${n}-option-quick-paste-from-clipboard`
 		}] : [],
 		..._ ? [{
 			type: "Option",
-			label: N("pasteWithReview"),
-			onClick: () => V("reviewPasteModal", !E),
+			label: P("pasteWithReview"),
+			onClick: () => H("reviewPasteModal", !D),
 			testId: `${n}-paste-with-review`
 		}] : [],
-		...k && O && t ? [{
+		...A && k && t ? [{
 			type: "Option",
-			label: N("smartUpload_smartUpload"),
-			onClick: () => V("smartUploadModal", !T),
+			label: P("smartUpload_smartUpload"),
+			onClick: () => H("smartUploadModal", !E),
 			testId: `${n}-smart-upload`
 		}] : [],
-		...applyModalHandlers((r = x == null ? void 0 : x.importOptions) == null ? [] : r, C, V)
-	] : [], J = [
+		...applyModalHandlers((r = S == null ? void 0 : S.importOptions) == null ? [] : r, w, H)
+	] : [], Y = [
 		{
 			type: "Option",
-			label: N("downloadFile"),
+			label: P("downloadFile"),
 			onClick: async () => {
-				let e = await P();
+				let e = await F();
 				e && e && onClickDownLoad(e, d);
 			}
 		},
 		...p ? [{
 			type: "Option",
-			label: N("copyToClipboard"),
-			onClick: () => W("dot")
+			label: P("copyToClipboard"),
+			onClick: () => G("dot")
 		}] : [{
 			type: "Menu",
 			testId: `${n}-menu-copy-to-clipboard`,
 			menu: {
 				trigger: "Text",
-				label: N("copyToClipboard"),
+				label: P("copyToClipboard"),
 				sections: [{
 					type: "Option",
-					label: N("copyDecimalDot"),
-					onClick: () => W("dot"),
+					label: P("copyDecimalDot"),
+					onClick: () => G("dot"),
 					testId: `${n}-option-copy-decimal-dot`
 				}, {
 					type: "Option",
-					label: N("copyDecimalComma"),
-					onClick: () => W("comma")
+					label: P("copyDecimalComma"),
+					onClick: () => G("comma")
 				}]
 			}
 		}],
-		...applyModalHandlers((i = x == null ? void 0 : x.exportOptions) == null ? [] : i, C, V)
-	], Y = v ? [{
+		...applyModalHandlers((i = S == null ? void 0 : S.exportOptions) == null ? [] : i, w, H)
+	], X = v ? [{
 		type: "Option",
-		label: N("deleteAllRows"),
-		onClick: () => K(),
+		label: P("deleteAllRows"),
+		onClick: () => q(),
 		testId: `${n}-delete-all-rows`
-	}, ...applyModalHandlers((a = x == null ? void 0 : x.deleteOptions) == null ? [] : a, C, V)] : [], ee = y ? [
+	}, ...applyModalHandlers((a = S == null ? void 0 : S.deleteOptions) == null ? [] : a, w, H)] : [], ee = y ? [
 		{ type: "Divider" },
 		{
 			type: "Option",
-			label: N("help"),
-			onClick: () => V("helpModal", !D)
+			label: P("help"),
+			onClick: () => H("helpModal", !O)
 		},
-		...applyModalHandlers((o = x == null ? void 0 : x.helpOptions) == null ? [] : o, C, V)
-	] : [], te = [
-		...q.length ? [{
-			section: [...q, ...ee],
+		...applyModalHandlers((o = S == null ? void 0 : S.helpOptions) == null ? [] : o, w, H)
+	] : [], Z = [
+		...J.length ? [{
+			section: [...J, ...ee],
 			name: "import-options",
 			iconName: "import",
-			tooltip: N("import")
+			tooltip: P("import")
 		}] : [],
-		...J.length ? [{
-			section: J,
+		...Y.length ? [{
+			section: Y,
 			name: "export-options",
 			iconName: "export",
-			tooltip: N("export")
+			tooltip: P("export")
 		}] : [],
-		...Y.length ? [{
-			section: Y,
+		...X.length ? [{
+			section: X,
 			name: "delete-options",
 			iconName: "delete",
-			tooltip: N("deleteAllRows")
+			tooltip: P("deleteAllRows")
 		}] : []
 	];
 	return /* @__PURE__ */ jsxs("span", { children: [
-		F && /* @__PURE__ */ jsx(Spinner, {
+		I && /* @__PURE__ */ jsx(Spinner, {
 			small: !0,
 			dark: !0
 		}),
-		te.map((e, t) => /* @__PURE__ */ jsx(MenuComponent, {
+		Z.map((e, t) => /* @__PURE__ */ jsx(MenuComponent, {
 			sections: e.section,
 			iconName: e.iconName,
 			tooltip: e.tooltip,
 			testId: `data-${e == null ? void 0 : e.name}-menu`
 		}, t)),
-		E && /* @__PURE__ */ jsx(PasteWithReviewModal, {
+		D && /* @__PURE__ */ jsx(PasteWithReviewModal, {
 			config: e,
-			state: C,
-			updateState: z,
-			setModalVisibility: V,
-			readAndParseInput: R,
-			onCloseModal: B,
+			state: w,
+			updateState: B,
+			setModalVisibility: H,
+			readAndParseInput: z,
+			onCloseModal: V,
 			validationRules: u,
-			onCompleteImport: S,
+			onCompleteImport: C,
 			prevalidationConfig: l,
-			t: N,
-			loading: F,
-			startTransition: I,
+			t: P,
+			loading: I,
+			startTransition: L,
 			testId: n
 		}),
-		D && /* @__PURE__ */ jsx(HelpModal, {
-			visible: D,
-			setModalVisibility: V,
+		O && /* @__PURE__ */ jsx(HelpModal, {
+			visible: O,
+			setModalVisibility: H,
 			validationRules: u,
-			t: N
+			t: P
 		}),
-		O && t && /* @__PURE__ */ jsx(SmartUploadModal, {
-			visible: T,
-			prompt: k,
-			onUpload: M,
-			onCloseModal: () => B({ callback: A }),
-			onComplete: G,
-			onError: j,
-			heading: N("smartUpload_smartUpload"),
-			dialogText: N("smartUpload_description"),
-			fileInputText: N("chooseFile"),
-			fileInputPlaceholder: N("noFileSelected"),
-			uploadText: N("uploadCapitalized"),
-			cancelText: N("cancel"),
+		k && t && /* @__PURE__ */ jsx(SmartUploadModal, {
+			visible: E,
+			prompt: A,
+			onUpload: N,
+			onCloseModal: () => V({ callback: j }),
+			onComplete: K,
+			onError: M,
+			heading: P("smartUpload_smartUpload"),
+			dialogText: P("smartUpload_description"),
+			fileInputText: P("chooseFile"),
+			fileInputPlaceholder: P("noFileSelected"),
+			uploadText: P("uploadCapitalized"),
+			cancelText: P("cancel"),
 			testId: n
 		}),
 		/* @__PURE__ */ jsx(ModalsRenderer, {
-			modals: b,
-			modalVisibility: C == null ? void 0 : C.modalVisibility,
-			onCloseModal: B,
+			modals: x,
+			modalVisibility: w == null ? void 0 : w.modalVisibility,
+			onCloseModal: V,
 			testId: n
 		})
 	] });
@@ -6680,32 +6680,32 @@ const TreeItem = ({ node: t, depth: n, isOpen: r, onToggle: i, hasChild: a, drag
 			]
 		})
 	});
-}, TreePlaceholder = ({ depth: e }) => /* @__PURE__ */ jsx("div", {
+}, TreePlaceholder = ({ depth: e, indent: t = "var(--size-sm)" }) => /* @__PURE__ */ jsx("div", {
 	className: tree_module_default.placeholder,
-	style: { left: e * 24 }
-}), Tree = ({ list: e, canDrop: t, draggable: n = !1, onListReorder: r, onChangeOpen: i, testId: a, isInitialOpen: o = !1, autoOpenActiveItems: s = !1, treeRef: l, itemHasChild: u, onItemToggle: d, icons: f, allowParentReassignment: m, stickyHeader: h, height: g, render: _ }) => {
-	var v;
-	let y = l == null ? useRef(null) : l, b = (e) => {
+	style: { left: `calc(${t} * ${e})` }
+}), Tree = ({ list: e, canDrop: t, draggable: n = !1, onListReorder: r, onChangeOpen: i, testId: a, isInitialOpen: o = !1, autoOpenActiveItems: s = !1, treeRef: l, itemHasChild: u, onItemToggle: d, icons: f, allowParentReassignment: m, stickyHeader: h, height: g, render: _, placeholderIndent: v }) => {
+	var y;
+	let b = l == null ? useRef(null) : l, x = (e) => {
 		i && i(e);
-	}, x = (t) => {
+	}, S = (t) => {
 		let n = e.items.find((e) => e.id === t);
-		return n && n.parent ? [n.parent, ...x(n.parent)] : [];
+		return n && n.parent ? [n.parent, ...S(n.parent)] : [];
 	};
 	useEffect(() => {
 		if (s) {
 			let n = e.items.find((e) => e.active);
 			if (n) {
 				var t;
-				let e = x(n.id);
-				(t = y.current) == null || t.open(e);
+				let e = S(n.id);
+				(t = b.current) == null || t.open(e);
 			}
 		}
 	}, [s, e.items]);
-	let S = (e, t) => {
+	let C = (e, t) => {
 		var n;
 		return (n = e == null ? void 0 : e.findIndex((e) => (e == null ? void 0 : e.id) === t)) == null ? -1 : n;
-	}, C = (e, t) => {
-		let n = S(t, e == null ? void 0 : e.parent);
+	}, w = (e, t) => {
+		let n = C(t, e == null ? void 0 : e.parent);
 		if (n >= 0) {
 			let r = t == null ? void 0 : t.find((e) => {
 				var r;
@@ -6713,20 +6713,20 @@ const TreeItem = ({ node: t, depth: n, isOpen: r, onToggle: i, hasChild: a, drag
 			});
 			e.parent = r ? r.id : 0;
 		}
-	}, w = (e, t) => {
+	}, T = (e, t) => {
 		var n;
 		return (n = t == null ? void 0 : t.filter((t) => (t == null ? void 0 : t.id) !== (e == null ? void 0 : e.id))) == null ? [] : n;
-	}, T = (e, t, n) => (n == null || n.splice(t, 0, e), n), E = (e) => e.map(({ id: e, parent: t, droppable: n, data: r }) => ({
+	}, E = (e, t, n) => (n == null || n.splice(t, 0, e), n), D = (e) => e.map(({ id: e, parent: t, droppable: n, data: r }) => ({
 		id: e,
 		parent: t,
 		droppable: n,
 		...r
-	})), D = (e, t) => {
+	})), O = (e, t) => {
 		let { dragSource: n, dropTarget: i } = t, a = [...e];
 		if (!r) return;
-		let o = S(a, n == null ? void 0 : n.id), s = S(a, n == null ? void 0 : n.parent), c = [];
-		(n == null ? void 0 : n.parent) === (i == null ? void 0 : i.id) && o === 0 && m && (C(n, a), a = w(n, a), a = T(n, s, a)), c = E(a), r(c);
-	}, O = e == null || (v = e.items) == null ? void 0 : v.map(({ id: e, droppable: t, parent: n, name: r, onDrop: i, ...a }) => ({
+		let o = C(a, n == null ? void 0 : n.id), s = C(a, n == null ? void 0 : n.parent), c = [];
+		(n == null ? void 0 : n.parent) === (i == null ? void 0 : i.id) && o === 0 && m && (w(n, a), a = T(n, a), a = E(n, s, a)), c = D(a), r(c);
+	}, k = e == null || (y = e.items) == null ? void 0 : y.map(({ id: e, droppable: t, parent: n, name: r, onDrop: i, ...a }) => ({
 		id: e,
 		text: r,
 		droppable: t,
@@ -6750,8 +6750,8 @@ const TreeItem = ({ node: t, depth: n, isOpen: r, onToggle: i, hasChild: a, drag
 			options: getBackendOptions(),
 			context: window,
 			children: /* @__PURE__ */ jsx(Tree$1, {
-				ref: y,
-				tree: O,
+				ref: b,
+				tree: k,
 				sort: !1,
 				insertDroppableFirst: !1,
 				canDrag: () => n,
@@ -6781,10 +6781,13 @@ const TreeItem = ({ node: t, depth: n, isOpen: r, onToggle: i, hasChild: a, drag
 						onDrop: (s = e.data) == null ? void 0 : s.onDrop
 					});
 				},
-				onDrop: D,
-				onChangeOpen: b,
+				onDrop: O,
+				onChangeOpen: x,
 				dropTargetOffset: 10,
-				placeholderRender: (e, { depth: t }) => /* @__PURE__ */ jsx(TreePlaceholder, { depth: t }),
+				placeholderRender: (e, { depth: t }) => /* @__PURE__ */ jsx(TreePlaceholder, {
+					depth: t,
+					indent: v
+				}),
 				placeholderComponent: "div",
 				listComponent: "div",
 				listItemComponent: "div",
@@ -6801,17 +6804,19 @@ const TreeItem = ({ node: t, depth: n, isOpen: r, onToggle: i, hasChild: a, drag
 	});
 };
 var tree_table_module_default = {
-	treeTable: "_treeTable_3rlrs_1",
-	treeTableHeader: "_treeTableHeader_3rlrs_21",
-	folderCell: "_folderCell_3rlrs_29",
-	dragCell: "_dragCell_3rlrs_30",
-	drag: "_drag_3rlrs_30",
-	folder: "_folder_3rlrs_29",
-	treeTableRow: "_treeTableRow_3rlrs_60",
-	nested: "_nested_3rlrs_63"
+	treeTable: "_treeTable_1ywvy_1",
+	treeTableHeader: "_treeTableHeader_1ywvy_22",
+	folderCell: "_folderCell_1ywvy_30",
+	dragCell: "_dragCell_1ywvy_31",
+	drag: "_drag_1ywvy_31",
+	folder: "_folder_1ywvy_30",
+	active: "_active_1ywvy_61"
 };
 const TreeTableRow = ({ columnAlignment: e, columnWidths: t, depth: n, draggable: r, handleRef: i, hasChild: a, hasRowActions: o, icons: s, isOpen: c, node: l, onDragEnter: u, onDragOver: d, onDragLeave: f, onDrop: p, onToggle: m }) => {
-	let { data: h, droppable: _ } = l, { id: v, cells: y, testId: b, actions: x = [] } = h, S = `max(calc(var(--size) * ${a ? n + 1 : n}), var(--size))`;
+	let { data: h, droppable: _ } = l, { id: v, cells: y, testId: b, actions: x = [], active: S, onRowClick: C } = h, w = _ || a, T = (e) => {
+		let r = t ? t[e] : void 0;
+		return e === 0 ? `calc(${r} - ${`calc(var(--size) * ${w ? n + 1 : n})`})` : r;
+	};
 	return /* @__PURE__ */ jsx("table", {
 		className: table_module_default.table,
 		"data-testid": b,
@@ -6820,7 +6825,8 @@ const TreeTableRow = ({ columnAlignment: e, columnWidths: t, depth: n, draggable
 		onDragOver: d,
 		onDragLeave: f,
 		children: /* @__PURE__ */ jsx("tbody", { children: /* @__PURE__ */ jsxs("tr", {
-			className: cx(tree_table_module_default.treeTableRow, n > 0 && tree_table_module_default.nested),
+			onClick: C,
+			className: cx(tree_table_module_default.treeTableRow, S ? tree_table_module_default.active : void 0),
 			children: [
 				r && /* @__PURE__ */ jsx("td", {
 					className: tree_table_module_default.dragCell,
@@ -6831,14 +6837,10 @@ const TreeTableRow = ({ columnAlignment: e, columnWidths: t, depth: n, draggable
 						children: /* @__PURE__ */ jsx(Icon, { icon: IconType.DRAG })
 					})
 				}),
-				/* @__PURE__ */ jsx("td", {
+				Array.from({ length: n }).map((e, t) => /* @__PURE__ */ jsx("td", { className: tree_table_module_default.folderCell }, t)),
+				w && /* @__PURE__ */ jsx("td", {
 					className: tree_table_module_default.folderCell,
-					style: {
-						width: S,
-						minWidth: S,
-						maxWidth: S
-					},
-					children: (_ || a) && /* @__PURE__ */ jsx("div", {
+					children: /* @__PURE__ */ jsx("div", {
 						className: tree_table_module_default.folder,
 						onClick: () => m(v),
 						onMouseDown: (e) => e.stopPropagation(),
@@ -6852,15 +6854,12 @@ const TreeTableRow = ({ columnAlignment: e, columnWidths: t, depth: n, draggable
 						})
 					})
 				}),
-				y.map((n, r) => {
-					let i = t ? t[r] : void 0;
-					return /* @__PURE__ */ jsx(Cell, {
-						isHeader: !1,
-						cell: n,
-						width: r === 0 ? `calc(${i} - ${S} + var(--size))` : i,
-						columnAlignment: e ? e[r] : null
-					}, r);
-				}),
+				y.map((t, n) => /* @__PURE__ */ jsx(Cell, {
+					isHeader: !1,
+					cell: t,
+					width: T(n),
+					columnAlignment: e ? e[n] : null
+				}, n)),
 				o && /* @__PURE__ */ jsx(Cell, {
 					isHeader: !1,
 					cell: {
@@ -6875,7 +6874,6 @@ const TreeTableRow = ({ columnAlignment: e, columnWidths: t, depth: n, draggable
 	className: cx(table_module_default.table, tree_table_module_default.treeTableHeader),
 	children: /* @__PURE__ */ jsx("thead", { children: i.map((i, a) => /* @__PURE__ */ jsxs("tr", { children: [
 		n && /* @__PURE__ */ jsx("th", { className: tree_table_module_default.dragCell }),
-		/* @__PURE__ */ jsx("th", { className: tree_table_module_default.folderCell }),
 		i.cells.map((n, r) => /* @__PURE__ */ jsx(Cell, {
 			isHeader: !0,
 			cell: n,
@@ -6918,6 +6916,7 @@ const TreeTableRow = ({ columnAlignment: e, columnWidths: t, depth: n, draggable
 			onChangeOpen: l,
 			onItemToggle: s,
 			onListReorder: c,
+			placeholderIndent: "var(--size)",
 			render: (e, { depth: t, draggable: n, handleRef: r, hasChild: a, isOpen: o, onToggle: s }) => /* @__PURE__ */ jsx(TreeTableRow, {
 				node: e,
 				columnAlignment: p,
@@ -7062,7 +7061,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 	} : {
 		value: G,
 		unit: U
-	}), J = k || (K == null ? void 0 : K.value) === void 0, [Y, ee] = useState(w ? PredefinedOptionsMenuState.PREDEFINED : PredefinedOptionsMenuState.CUSTOM), te = !!(O || n), X = C && C.find((e) => {
+	}), J = k || (K == null ? void 0 : K.value) === void 0, [Y, X] = useState(w ? PredefinedOptionsMenuState.PREDEFINED : PredefinedOptionsMenuState.CUSTOM), ee = !!(O || n), Z = C && C.find((e) => {
 		if (!(e != null && e.value)) return;
 		if (E) return E === e.valueKey;
 		let t = isValueWithUnit(e.value) ? getUnit(e.value) : "", { value: n = l } = convertUnit({
@@ -7071,7 +7070,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 			toUnit: t
 		});
 		return withUnit(n, t) === e.value;
-	}), ne = () => {
+	}), te = () => {
 		var e;
 		let t = (e = l) == null ? "" : e, n = K.unit;
 		if (!checkConversion({
@@ -7087,7 +7086,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 		} catch {
 			return null;
 		}
-	}, re = (t) => {
+	}, ne = (t) => {
 		let n = getStringName(e), r = t.target, { value: i, selectionStart: a } = r, o = withUnit(i, (K == null ? void 0 : K.unit) || "");
 		h({ target: {
 			value: A ? withUnit(convertAndGetValue(o, B), B) : o,
@@ -7100,7 +7099,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 		}), R(() => {
 			r.selectionStart = a, r.selectionEnd = a;
 		});
-	}, ie = (e, t) => {
+	}, re = (e, t) => {
 		t === K.unit || isNaN(Number(e)) || (q({
 			value: e,
 			unit: t
@@ -7131,7 +7130,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 			e !== void 0 && q({
 				value: e,
 				unit: t
-			}), ee(C && X && T ? PredefinedOptionsMenuState.PREDEFINED : PredefinedOptionsMenuState.CUSTOM);
+			}), X(C && Z && T ? PredefinedOptionsMenuState.PREDEFINED : PredefinedOptionsMenuState.CUSTOM);
 		}
 	}, [
 		U,
@@ -7139,7 +7138,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 		i,
 		T
 	]);
-	let Z = ne(), Q = label(K.unit) || K.unit || "", ae = p || !Z || Z && Z.length === 1, oe = getStringName(e), $, se = (t) => {
+	let Q = te(), $ = label(K.unit) || K.unit || "", ie = p || !Q || Q && Q.length === 1, ae = getStringName(e), oe, se = (t) => {
 		let r = t != null && t.value ? t.value : "", [i = "", a = ""] = isValueWithUnit(r) ? split(r) : [r], o = withPrettyUnitLabel(r);
 		if (checkConversion({
 			value: r,
@@ -7159,7 +7158,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 			type: MenuType.OPTION,
 			inline: !0,
 			onClick: () => {
-				validateNumber(i).valid && !n && (ee(PredefinedOptionsMenuState.PREDEFINED), h({ target: {
+				validateNumber(i).valid && !n && (X(PredefinedOptionsMenuState.PREDEFINED), h({ target: {
 					value: r,
 					name: typeof e == "string" ? e : (e == null ? void 0 : e.fieldName) || "",
 					predefinedSelected: !0,
@@ -7171,10 +7170,10 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 				height: "0"
 			})] }),
 			description: o,
-			selected: X === t && Y === PredefinedOptionsMenuState.PREDEFINED
+			selected: Z === t && Y === PredefinedOptionsMenuState.PREDEFINED
 		};
 	};
-	if ($ = [{
+	if (oe = [{
 		type: MenuType.OPTION,
 		inline: !0,
 		onClick: () => {
@@ -7187,7 +7186,7 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 		selected: Y === PredefinedOptionsMenuState.CUSTOM
 	}], C != null && C.length) {
 		let e = C.map(se);
-		$ = [...$, ...e];
+		oe = [...oe, ...e];
 	}
 	let ce = (e) => {
 		if (isValueWithUnit(e)) {
@@ -7223,39 +7222,39 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 							small: o
 						}),
 						small: o,
-						sections: $
+						sections: oe
 					},
-					tooltip: Y === PredefinedOptionsMenuState.PREDEFINED ? X == null ? void 0 : X.label : ""
+					tooltip: Y === PredefinedOptionsMenuState.PREDEFINED ? Z == null ? void 0 : Z.label : ""
 				}),
 				/* @__PURE__ */ jsx("div", {
 					className: unit_input_module_default.inputWrapper,
 					children: /* @__PURE__ */ jsx(NumberInput, {
-						name: oe,
+						name: ae,
 						testId: x,
 						disabled: n,
 						placeholder: ce(t),
 						value: K.value,
-						onChange: re,
+						onChange: ne,
 						onFocus: v,
 						error: i === null ? void 0 : i,
 						warning: S === null ? void 0 : S,
 						left: a,
 						allowEmpty: J,
-						validationCallback: (e, t) => D(oe, t),
+						validationCallback: (e, t) => D(ae, t),
 						enableCosmeticRounding: j,
 						enableDisplayRounding: M,
 						roundDisplayValue: N,
 						groupOrder: le,
-						disableInternalErrorValidationMessages: te,
+						disableInternalErrorValidationMessages: ee,
 						small: o,
 						selectOnFocus: P,
 						tooltip: I
-					}, oe)
+					}, ae)
 				}),
-				Q && (ae || !H ? /* @__PURE__ */ jsx(InputGroupAddon, {
+				$ && (ie || !H ? /* @__PURE__ */ jsx(InputGroupAddon, {
 					groupOrder: ue,
 					small: o,
-					children: Q
+					children: $
 				}) : /* @__PURE__ */ jsx(Menu, {
 					groupOrder: ue,
 					maxHeight: 380,
@@ -7263,20 +7262,20 @@ const UnitInput = ({ name: e, placeholder: t = "", disabled: n = !1, disabledUni
 					testId: x && `${x}-menu`,
 					tabIndex: -1,
 					menu: {
-						label: Q,
+						label: $,
 						trigger: "DropDownButton",
 						small: o,
-						sections: Z.map(([e = "", t = "", n]) => {
+						sections: Q.map(([e = "", t = "", n]) => {
 							let r = n || t || "", i = isValidNum(e) ? e : "";
 							return {
 								type: "Option",
 								label: j ? safeRoundNumbers(i) : i,
 								inline: !0,
 								onClick: (n) => {
-									n.stopPropagation(), ie(e, t);
+									n.stopPropagation(), re(e, t);
 								},
 								description: r,
-								selected: r === Q,
+								selected: r === $,
 								testId: `${x}-unit-${r}`
 							};
 						})

package/package.json

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