@mailstep/design-system 0.8.26-beta.0 → 0.8.26-beta.2

package/ui/packages/ui/Blocks/CommonGrid/components/DataRow.js

@@ -0,0 +1,48 @@
+import { require_jsx_runtime as e } from "../../../../../node_modules/react/jsx-runtime.js";
+import { rowClassSymbol as t } from "../types.js";
+import { StyledDataRow as n } from "./Table.js";
+import r from "./DataCell.js";
+import { useTimeMeasurement as i } from "./utils.js";
+import a from "react";
+//#region packages/ui/Blocks/CommonGrid/components/DataRow.tsx
+var o = e(), s = ({ columns: e, rowData: s, rowIndex: c, uxState: l, allowRowSelect: u, allowRowSelectOnAction: d, onUxChange: f, onRowClick: p, onRowAction: m, displayColumnsWidth: h, groups: g, isEven: _ }) => {
+	let v = !!l.checkedRows?.[s.id], y = a.useCallback((e, t, n, r) => {
+		m?.(e, t, n, r), d && f?.("selectedRow", e);
+	}, [
+		m,
+		d,
+		f
+	]), { handleMouseDown: b, handleMouseUp: x } = i({ handleRowClick: a.useCallback((e) => {
+		let t = Object.values(e.target.classList), n = e.target.closest(".cell"), r = e.target.dataset?.propagation === "true", i = e.target;
+		for (; i && i !== n && !r;) i = i.parentElement, r = i?.dataset?.propagation === "true";
+		!t.includes("dataRow") && !t.includes("cell") && !r || (f && u && f("selectedRow", s.id), p && p(s.id, s));
+	}, [
+		p,
+		f,
+		s
+	]) });
+	return /* @__PURE__ */ (0, o.jsx)(n, {
+		className: a.useMemo(() => {
+			let e = ["dataRow"];
+			return v && e.push("checked"), l.selectedRow === s.id && (u || d) && e.push("selected"), s[t] && e.push(s[t] || ""), e.join(" ");
+		}, [
+			v,
+			l,
+			s
+		]),
+		hasRowClick: !!p,
+		onMouseDown: b,
+		onMouseUp: x,
+		isEven: !!_,
+		children: e.map((e, t) => /* @__PURE__ */ (0, o.jsx)(r, {
+			column: e,
+			rowData: s,
+			rowIndex: c,
+			onRowAction: y,
+			displayColumnWidth: h[e.name],
+			group: g?.[t]
+		}, e.name))
+	});
+};
+//#endregion
+export { s as default };

package/ui/packages/ui/Blocks/CommonGrid/components/ExtraControlButtons/ExtraControlButtons.js

@@ -0,0 +1,48 @@
+import { styled as e, x as t } from "../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import { require_jsx_runtime as n } from "../../../../../../node_modules/react/jsx-runtime.js";
+import r from "../../../../Elements/Button/Button.js";
+import i from "../ButtonMore/ButtonMore.js";
+import a from "../../../../Elements/DropdownSelect/index.js";
+import "react";
+//#region packages/ui/Blocks/CommonGrid/components/ExtraControlButtons/ExtraControlButtons.tsx
+var o = n(), s = e.div`
+  display: flex;
+  & > * {
+    margin-right: 12px;
+  }
+  z-index: 2;
+`, c = ({ hide: e, node: t, label: n, appearance: i, variant: s, disabled: c, onClick: l, onSelect: u, options: d, hideChevron: f, iconLeft: p, buttonProps: m }) => e ? null : t ? /* @__PURE__ */ (0, o.jsx)(o.Fragment, { children: t }) : d ? /* @__PURE__ */ (0, o.jsx)(a, {
+	label: n || "",
+	appearance: i || "secondary",
+	variant: s || "default",
+	options: d,
+	showChevron: !f,
+	onSelect: u,
+	disabled: c
+}) : /* @__PURE__ */ (0, o.jsx)(r, {
+	type: "button",
+	onClick: l,
+	disabled: c,
+	variant: s || "default",
+	appearance: i || "primary",
+	iconLeft: p,
+	...m,
+	children: n
+}), l = ({ extraControlButtons: e, isMobile: n, targetPosition: r }) => {
+	let a = r ? (e || []).filter(({ position: e, hide: t }) => e === r && !t) : e ?? [];
+	if (n && a?.length > 0) {
+		let e = a.flatMap(({ onSelect: e, onClick: t, options: n, label: r }) => n && e ? n.map((t) => ({
+			title: typeof r == "string" && !t.label.startsWith(String(r)) ? `${r}: ${t.label}` : t.label,
+			onClick: () => {
+				e(t.value);
+			}
+		})) : r && t ? [{
+			title: r,
+			onClick: t
+		}] : []);
+		return e.length === 0 ? null : /* @__PURE__ */ (0, o.jsx)(i, { items: e });
+	}
+	return /* @__PURE__ */ (0, o.jsx)(s, { children: a?.map((e, n) => /* @__PURE__ */ (0, o.jsx)(t.div, { children: /* @__PURE__ */ (0, o.jsx)(c, { ...e }) }, n)) });
+};
+//#endregion
+export { l as default };

package/ui/packages/ui/Blocks/CommonGrid/components/ExtraControlButtons/index.js

@@ -0,0 +1,5 @@
+import e from "./ExtraControlButtons.js";
+//#region packages/ui/Blocks/CommonGrid/components/ExtraControlButtons/index.tsx
+var t = e;
+//#endregion
+export { t as default };

package/ui/packages/ui/Blocks/CommonGrid/components/FilterDropdown.js

@@ -0,0 +1,23 @@
+import { styled as e } from "../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import { require_jsx_runtime as t } from "../../../../../node_modules/react/jsx-runtime.js";
+import n from "react";
+//#region packages/ui/Blocks/CommonGrid/components/FilterDropdown.tsx
+var r = t(), i = e.div`
+  position: absolute;
+  z-index: 1;
+  visibility: hidden;
+`, a = ({ children: e }) => {
+	let t = n.useRef(null);
+	return n.useEffect(() => {
+		let e = t.current;
+		if (!e) return;
+		let n = e.closest(".cell"), r = n?.closest(".gridWrapper"), i = (n?.offsetLeft ?? 0) - (n?.parentElement?.offsetLeft ?? 0), a = (r?.clientWidth ?? 0) + (r?.scrollLeft ?? 0) - i - (e.clientWidth ?? 0), o = a > 0 ? n?.offsetLeft ?? 0 : (n?.offsetLeft ?? 0) + a, s = (n?.offsetTop ?? 0) + (n?.clientHeight ?? 0);
+		e.style.left = `${o}px`, e.style.top = `${s}px`, e.style.visibility = "initial";
+	}), /* @__PURE__ */ (0, r.jsx)(i, {
+		ref: t,
+		className: "filterOverlay",
+		children: e
+	});
+};
+//#endregion
+export { a as default };

package/ui/packages/ui/Blocks/CommonGrid/components/FilterRow.js

@@ -0,0 +1,31 @@
+import { __toESM as e } from "../../../../../_virtual/_rolldown/runtime.js";
+import { require_jsx_runtime as t } from "../../../../../node_modules/react/jsx-runtime.js";
+import { getFilterName as n } from "../utils/index.js";
+import { require_get as r } from "../../../../../node_modules/lodash/fp/get.js";
+import { Row as i } from "./Table.js";
+import { require_throttle as a } from "../../../../../node_modules/lodash/throttle.js";
+import o from "./ColumnFilterCell.js";
+//#region packages/ui/Blocks/CommonGrid/components/FilterRow.tsx
+var s = /* @__PURE__ */ e(r(), 1), c = /* @__PURE__ */ e(a(), 1), l = t(), u = ({ columns: e, groups: t, actionColumn: r, onChange: a, filterValues: u = {}, displayColumnsWidth: d, filters: f, comparators: p, handleUxChange: m, onAsyncLoadFilterOptions: h, rowsData: g, uxState: _ }) => {
+	let v = (0, c.default)(a, 500);
+	return /* @__PURE__ */ (0, l.jsx)(i, {
+		className: "filterRow",
+		children: e.map((e, i) => /* @__PURE__ */ (0, l.jsx)(o, {
+			column: e,
+			actionColumn: r,
+			rowsData: g,
+			uxState: _,
+			handleUxChange: m,
+			onChange: v,
+			value: (0, s.default)([n(e), "value"], u),
+			others: (0, s.default)([n(e), "others"], u),
+			displayColumnWidth: d[e.name],
+			filters: f,
+			comparators: p,
+			group: t?.[i],
+			onAsyncLoadFilterOptions: h
+		}, i))
+	});
+};
+//#endregion
+export { u as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/ActionsFilter/ActionsFilter.js

@@ -0,0 +1,31 @@
+import { x as e } from "../../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import { require_jsx_runtime as t } from "../../../../../../../node_modules/react/jsx-runtime.js";
+import { useToggleAllCheckbox as n } from "../../../hooks/useToggleAllCheckbox.js";
+import r from "../../../../../Forms/Checkbox/index.js";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/ActionsFilter/ActionsFilter.tsx
+var i = t(), a = ({ actionColumn: t, rowsData: a, uxState: o, handleUxChange: s }) => {
+	let [c, l] = n(a, o, s), u = t?.addRowNumbers, d = t?.addRowNumbersLabel ?? "#", f = t?.actionOptions?.length || t?.forceCheckboxes;
+	return /* @__PURE__ */ (0, i.jsxs)(e.div, {
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "space-between",
+		gap: "16px",
+		pl: "4px",
+		children: [f && /* @__PURE__ */ (0, i.jsx)(e.div, {
+			w: "100%",
+			children: /* @__PURE__ */ (0, i.jsx)(r, {
+				checked: c,
+				onChange: l,
+				label: ""
+			}, "check-all")
+		}), u && /* @__PURE__ */ (0, i.jsx)(e.div, {
+			w: "100%",
+			pr: "12px",
+			display: "flex",
+			justifyContent: "center",
+			children: d
+		})]
+	});
+};
+//#endregion
+export { a as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/ActionsFilter/index.js

@@ -0,0 +1,5 @@
+import e from "./ActionsFilter.js";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/ActionsFilter/index.ts
+var t = e;
+//#endregion
+export { t as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/BooleanSelect/BooleanSelect.js

@@ -0,0 +1,34 @@
+import { require_jsx_runtime as e } from "../../../../../../../node_modules/react/jsx-runtime.js";
+import { i18n as t } from "../../../../../../../node_modules/@lingui/core/dist/index.js";
+import n from "../GridSelect/index.js";
+import { useMemo as r } from "react";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/BooleanSelect/BooleanSelect.tsx
+var i = e(), a = () => [
+	{
+		value: "",
+		label: t._({
+			id: "dataGrid.columnActive.filterOptions.all",
+			message: "All"
+		})
+	},
+	{
+		value: "1",
+		label: t._({
+			id: "dataGrid.columnActive.filterOptions.yes",
+			message: "Yes"
+		})
+	},
+	{
+		value: "0",
+		label: t._({
+			id: "dataGrid.columnActive.filterOptions.no",
+			message: "No"
+		})
+	}
+], o = (e) => /* @__PURE__ */ (0, i.jsx)(n, {
+	options: r(() => a(), []),
+	...e,
+	isClearable: !1
+});
+//#endregion
+export { o as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/BooleanSelect/index.js

@@ -0,0 +1,5 @@
+import e from "./BooleanSelect.js";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/BooleanSelect/index.tsx
+var t = e;
+//#endregion
+export { t as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/DatePickerRange.js

@@ -0,0 +1,127 @@
+import { css as e, styled as t } from "../../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import { require_jsx_runtime as n } from "../../../../../../../node_modules/react/jsx-runtime.js";
+import { useClickOutside as r } from "../../../../Modal/hooks/useClickOutside.js";
+import { i18n as i } from "../../../../../../../node_modules/@lingui/core/dist/index.js";
+import { DateTime as a } from "../../../../../../../node_modules/luxon/build/es6/luxon.js";
+import o from "../../../../../Forms/Input/index.js";
+import s from "../../../../../Elements/DatePicker/index.js";
+import { getCleanValues as c } from "./utils/getCleanValues.js";
+import { pickerRangeToString as l } from "./utils/pickerRangeToString.js";
+import u, { useCallback as d, useMemo as f, useState as p } from "react";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/DatePickerRange.tsx
+var m = n(), h = t.div`
+  display: ${({ $compact: e }) => e ? "flex" : "inline-flex"};
+  flex-direction: ${({ $compact: e }) => e ? "column" : "row"};
+  margin-right: ${({ $compact: e }) => e ? "0" : "20px"};
+
+  ${({ $compact: t }) => t && e`
+      .rdtPicker {
+        min-width: unset;
+        width: 100%;
+        box-sizing: border-box;
+        padding: 0.5rem 0.5rem;
+      }
+      .rdtPicker .rdtDays {
+        min-width: unset;
+      }
+      .rdtPicker td {
+        padding: 0 0.2rem;
+      }
+    `}
+`, g = ({ children: e }) => /* @__PURE__ */ (0, m.jsx)("div", { children: e }), _ = (e) => {
+	let { onChange: t, error: n, label: _, value: v, others: y, filterTime: b, initialView: x, compact: S, OverlayComponent: C = g, ...w } = e, [T, E] = p(v?.[0] ?? void 0), [D, O] = p(v?.[1] ?? void 0), k = b ? "HH:mm" : !1, A = u.useMemo(() => c(v), [v]), j = f(() => {
+		if (A[0] && A[1]) return A;
+		let e = /* @__PURE__ */ new Date();
+		e.setHours(0, 0, 0, 0);
+		let t = /* @__PURE__ */ new Date();
+		return t.setHours(23, 59, 59, 0), x === "future" ? t.setMonth(t.getMonth() + 1) : e.setMonth(e.getMonth()), [A[0] || e, A[1] || t];
+	}, [A, x]), [M, N] = p(!1), P = d((e) => {
+		E(e), t([e, A[1]], y);
+	}, [
+		t,
+		y,
+		A
+	]), F = d((e) => {
+		O(e), t([A[0], e], y);
+	}, [
+		t,
+		y,
+		A
+	]), I = d((e) => {
+		t(A, [e, y?.[1]]);
+	}, [
+		t,
+		A,
+		y
+	]), L = d((e) => {
+		t(A, [y?.[0], e]);
+	}, [
+		t,
+		A,
+		y
+	]), R = d(() => {
+		N(!0);
+	}, [N]), z = d(() => {
+		t([], []), E(void 0), O(void 0);
+	}, [t]), B = d((e) => !A[1] || a.fromJSDate(A[1]) >= a.fromJSDate(e), [A]), V = d((e) => !A[0] || a.fromJSDate(e) >= a.fromJSDate(A[0]), [A]), H = d(() => {
+		N(!1);
+	}, []), U = A[1] === null ? A[0] : A[1];
+	return /* @__PURE__ */ (0, m.jsxs)("div", {
+		ref: r({ onClose: H }),
+		children: [/* @__PURE__ */ (0, m.jsx)(o, {
+			name: e.name,
+			type: "text",
+			icon: "calendar",
+			value: l(A, y),
+			label: e.label,
+			onFocus: R,
+			iconOnClick: R,
+			onClear: z,
+			error: n,
+			readOnly: !0
+		}), /* @__PURE__ */ (0, m.jsx)(C, { children: /* @__PURE__ */ (0, m.jsx)(m.Fragment, { children: M && /* @__PURE__ */ (0, m.jsxs)(h, {
+			$compact: S,
+			className: "ignore-element-for-closing-hook",
+			children: [/* @__PURE__ */ (0, m.jsx)(s, {
+				...w,
+				timeFormat: k,
+				value: A[0] ?? "",
+				initialViewDate: j[0],
+				secondValue: D,
+				onChange: P,
+				others: y?.[0],
+				onChangeOthers: I,
+				icon: !1,
+				label: M && i._({
+					id: "dataGrid.filterCell.from",
+					message: "From"
+				}),
+				isValidDate: B,
+				input: !1,
+				spaceAround: !S,
+				open: !0
+			}), /* @__PURE__ */ (0, m.jsx)(s, {
+				...w,
+				timeFormat: k,
+				value: U,
+				initialViewDate: j[1],
+				secondValue: T,
+				onChange: F,
+				others: y?.[1],
+				onChangeOthers: L,
+				icon: !1,
+				label: M && i._({
+					id: "dataGrid.filterCell.to",
+					message: "To"
+				}),
+				isValidDate: V,
+				input: !1,
+				spaceAround: !S,
+				open: !0,
+				isSecondDatePicker: !0
+			})]
+		}) }) })]
+	});
+};
+//#endregion
+export { _ as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/index.js

@@ -0,0 +1,5 @@
+import e from "./DatePickerRange.js";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/index.tsx
+var t = e;
+//#endregion
+export { t as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/utils/pickerRangeToString.js

@@ -0,0 +1,11 @@
+import { DateTime as e } from "../../../../../../../../node_modules/luxon/build/es6/luxon.js";
+import { DatePickerRepeatTrans as t, TimePickerRepeatTrans as n } from "../../../../../../Elements/DatePicker/utils/constants.js";
+import { sameDate as r } from "./sameDate.js";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/DatePickerRange/utils/pickerRangeToString.ts
+var i = (i = [], a) => a?.[0]?.dateTypeRepeater || a?.[1]?.dateTypeRepeater ? a.map((r, a) => {
+	if (!r?.dateTypeRepeater) return i[a] && e.fromJSDate(i[a]).toFormat("dd.LL.yyyy HH:mm");
+	let o = t[r?.dateTypeRepeater];
+	return `${a === 0 ? n.from : n.to} ${o} ${r?.time ? `${String(r?.time.h).padStart(2, "0")}:${String(r?.time.m).padStart(2, "0")}` : ""}`.trim();
+}).filter(Boolean).join(" - ") : !i[0] && !i[1] ? "" : i[0] && !i[1] || r(i[0], i[1]) ? e.fromJSDate(i[0]).toFormat("dd.LL.yyyy") : i.map((t) => t && e.fromJSDate(t).toFormat("dd.LL.yyyy HH:mm")).join(" - ");
+//#endregion
+export { i as pickerRangeToString };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/GridSelect/GridSelect.js

@@ -0,0 +1,80 @@
+import { __toESM as e } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { require_jsx_runtime as t } from "../../../../../../../node_modules/react/jsx-runtime.js";
+import { require_isArray as n } from "../../../../../../../node_modules/lodash/isArray.js";
+import { i18n as r } from "../../../../../../../node_modules/@lingui/core/dist/index.js";
+import i from "../../../../../Elements/Select/index.js";
+import a from "../../../../../Elements/SingleSelect/index.js";
+import { require_uniqBy as o } from "../../../../../../../node_modules/lodash/uniqBy.js";
+import { isOptionArray as s } from "./guards.js";
+import { useCallback as c, useMemo as l, useState as u } from "react";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/GridSelect/GridSelect.tsx
+var d = /* @__PURE__ */ e(n(), 1), f = /* @__PURE__ */ e(o(), 1), p = t(), m = 120, h = () => null, g = ({ onChange: e, isClearable: t = !0, disabled: n, placeholder: o, showValue: g = !0, columnWidth: _, isMulti: v, value: y, options: b, checkAllButton: x, asyncLoadKey: S, onAsyncLoadFilterOptions: C, withNotEqComparator: w = !0 }) => {
+	let [T, E] = u([]), [D, O] = u(!1), k = !!S, A = l(() => s(y) ? y.some((e) => e.isNotEq) : D, [y, D]), j = c((t) => {
+		e?.(!(0, d.default)(t) || !t?.length ? null : t?.map((e) => ({
+			...e,
+			isNotEq: A
+		})));
+	}, [e, A]), M = c(async (e) => {
+		let t = [];
+		return S && (t = await C?.(S, e) || []), E(t), t;
+	}, [S, C]), N = c((t) => {
+		if (t.preventDefault(), t.stopPropagation(), !y || !s(y)) {
+			O((e) => !e);
+			return;
+		}
+		let n = y?.map((e) => ({
+			...e,
+			isNotEq: !A
+		}));
+		e(n);
+	}, [
+		y,
+		A,
+		e
+	]), P = l(() => v && k && s(y) ? (0, f.default)([...T, ...y], "value") : void 0, [
+		k,
+		y,
+		T
+	]), F = _ && _ > m, I = F ? t : !1, L = o || (k ? r._({
+		id: "dataGrid.filterCell",
+		message: "Type to filter"
+	}) : void 0);
+	if (v) {
+		let e = F && w ? A ? "notEqual" : "equals" : null;
+		return /* @__PURE__ */ (0, p.jsx)(i, {
+			maxMenuHeight: 250,
+			onChange: j,
+			value: g ? s(y) ? y.map((e) => String(e.value)) : y : void 0,
+			options: P || b,
+			showSelectAllButton: x,
+			style: "gridFilter",
+			loadOptions: k ? M : void 0,
+			defaultOptions: P,
+			placeholder: L,
+			noOptionsMessage: h,
+			containerVariant: k ? "search" : void 0,
+			placeholderIcon: e,
+			onIconClick: w ? N : void 0,
+			optionVariant: "checkbox",
+			multiLabelVariant: "count",
+			shortVariant: "join",
+			isMulti: !0,
+			disabled: n,
+			isClearable: I
+		});
+	}
+	return /* @__PURE__ */ (0, p.jsx)(a, {
+		maxMenuHeight: 250,
+		onChange: e,
+		value: g ? y : void 0,
+		options: b,
+		style: "gridFilter",
+		loadOptions: k ? M : void 0,
+		placeholder: L,
+		placeholderIcon: F ? void 0 : null,
+		isClearable: I,
+		disabled: n
+	});
+};
+//#endregion
+export { g as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/GridSelect/index.js

@@ -0,0 +1,5 @@
+import e from "./GridSelect.js";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/GridSelect/index.tsx
+var t = e;
+//#endregion
+export { t as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/NumberRange/NumberRange.js

@@ -0,0 +1,132 @@
+import { require_jsx_runtime as e } from "../../../../../../../node_modules/react/jsx-runtime.js";
+import { useClickOutside as t } from "../../../../Modal/hooks/useClickOutside.js";
+import { i18n as n } from "../../../../../../../node_modules/@lingui/core/dist/index.js";
+import { Input as r } from "../../../../../Forms/Input/Input.js";
+import { useEvent as i } from "../../../hooks/useEvent.js";
+import a from "../../IconList/index.js";
+import { useCallback as o, useState as s } from "react";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/NumberRange/NumberRange.tsx
+var c = e(), l = ({ children: e }) => /* @__PURE__ */ (0, c.jsx)("div", { children: e }), u = () => [
+	{
+		label: n._({
+			id: "dataGrid.comparator.equals",
+			message: "Equals"
+		}),
+		value: "eq",
+		icon: "equals"
+	},
+	{
+		label: n._({
+			id: "dataGrid.comparator.notEquals",
+			message: "Not equal"
+		}),
+		value: "neq",
+		icon: "notEqual"
+	},
+	{
+		label: n._({
+			id: "dataGrid.comparator.lessThan",
+			message: "Less than"
+		}),
+		value: "lt",
+		icon: "lessThen"
+	},
+	{
+		label: n._({
+			id: "dataGrid.comparator.lessThanOrEquals",
+			message: "Less than or equals"
+		}),
+		value: "lte",
+		icon: "lessThanEqual"
+	},
+	{
+		label: n._({
+			id: "dataGrid.comparator.greaterThan",
+			message: "Greater than"
+		}),
+		value: "gt",
+		icon: "greaterThan"
+	},
+	{
+		label: n._({
+			id: "dataGrid.comparator.greaterThanOrEquals",
+			message: "Greater than or equal"
+		}),
+		value: "gte",
+		icon: "greaterThanEqual"
+	}
+], d = [{
+	label: n._({
+		id: "dataGrid.comparator.equals",
+		message: "Equals"
+	}),
+	value: "eq",
+	icon: "equals"
+}, {
+	label: n._({
+		id: "dataGrid.comparator.notEquals",
+		message: "Not equal"
+	}),
+	value: "neq",
+	icon: "notEqual"
+}], f = (e, t, n) => {
+	let r = String(e).replace(",", ".").replace(/(?!^)-/g, "").replace(/[^0-9.-]/g, "");
+	return t || !r ? r : r === "-" ? "-" : n ? (parseFloat(r) || 0).toFixed(n).substr(0, String(e).length) : parseInt(r, 10);
+}, p = (e) => {
+	let n = u(), { name: p, value: m = {}, label: h, onChange: g, decimals: _, isFloat: v, className: y, OverlayComponent: b = l, comparators: x, defaultComparator: S, isEqual: C, ...w } = e, [T, E] = s(!1), D = m?.comparator || S || x?.[0]?.value || n[0].value, O = x || (C ? d : n), k = m?.value || m?.value === 0 ? m.value : "", A = t({ onClose: o(() => {
+		E(!1);
+	}, []) }), j = o(() => {
+		E(!T);
+	}, [T, E]), M = i((e) => {
+		if (D === "between") {
+			let t = String(e.target.value).split(",");
+			if (t.length > 2) {
+				g({
+					comparator: D,
+					value: ""
+				});
+				return;
+			}
+			if (t.length === 2) {
+				g({
+					comparator: D,
+					value: t.map((e) => f(e, !1, 0)).join(",")
+				});
+				return;
+			}
+		}
+		let t = f(e.target.value, v, _);
+		g({
+			comparator: D,
+			value: t || t === 0 ? t : ""
+		});
+	}), N = i((e) => {
+		g({
+			comparator: e.value,
+			value: k
+		});
+	});
+	return /* @__PURE__ */ (0, c.jsxs)("div", {
+		ref: A,
+		children: [/* @__PURE__ */ (0, c.jsx)(r, {
+			name: p,
+			value: k,
+			label: h,
+			"data-cy": `${p}Inp`,
+			onChange: M,
+			iconOnClick: j,
+			icon: "ellipsisVertical",
+			iconPlacement: "right",
+			type: "text",
+			className: y,
+			autoComplete: "off",
+			...w
+		}), T && /* @__PURE__ */ (0, c.jsx)(b, { children: /* @__PURE__ */ (0, c.jsx)(a, {
+			list: O,
+			selected: D,
+			onClick: N
+		}) })]
+	});
+};
+//#endregion
+export { p as default };

package/ui/packages/ui/Blocks/CommonGrid/components/Filters/NumberRange/index.js

@@ -0,0 +1,5 @@
+import e from "./NumberRange.js";
+//#region packages/ui/Blocks/CommonGrid/components/Filters/NumberRange/index.ts
+var t = e;
+//#endregion
+export { t as default };