@mailstep/design-system 0.8.25 → 0.8.26-beta.1

package/ui/index735.es.js

@@ -0,0 +1,316 @@
+import { CSS as e, isKeyboardEvent as t, useCombinedRefs as n, useIsomorphicLayoutEffect as r, useUniqueId as i } from "./index732.es.js";
+import { KeyboardCode as a, getClientRect as o, useDndContext as s, useDraggable as c, useDroppable as l } from "./index734.es.js";
+import u, { useContext as d, useEffect as f, useMemo as p, useRef as m, useState as h } from "react";
+//#region node_modules/@dnd-kit/sortable/dist/sortable.esm.js
+function g(e, t, n) {
+	let r = e.slice();
+	return r.splice(n < 0 ? r.length + n : n, 0, r.splice(t, 1)[0]), r;
+}
+function _(e, t) {
+	return e.reduce((e, n, r) => {
+		let i = t.get(n);
+		return i && (e[r] = i), e;
+	}, Array(e.length));
+}
+function v(e) {
+	return e !== null && e >= 0;
+}
+function y(e, t) {
+	if (e === t) return !0;
+	if (e.length !== t.length) return !1;
+	for (let n = 0; n < e.length; n++) if (e[n] !== t[n]) return !1;
+	return !0;
+}
+function b(e) {
+	return typeof e == "boolean" ? {
+		draggable: e,
+		droppable: e
+	} : e;
+}
+var x = {
+	scaleX: 1,
+	scaleY: 1
+}, S = (e) => {
+	let { rects: t, activeNodeRect: n, activeIndex: r, overIndex: i, index: a } = e, o = t[r] ?? n;
+	if (!o) return null;
+	let s = C(t, a, r);
+	if (a === r) {
+		let e = t[i];
+		return e ? {
+			x: r < i ? e.left + e.width - (o.left + o.width) : e.left - o.left,
+			y: 0,
+			...x
+		} : null;
+	}
+	return a > r && a <= i ? {
+		x: -o.width - s,
+		y: 0,
+		...x
+	} : a < r && a >= i ? {
+		x: o.width + s,
+		y: 0,
+		...x
+	} : {
+		x: 0,
+		y: 0,
+		...x
+	};
+};
+function C(e, t, n) {
+	let r = e[t], i = e[t - 1], a = e[t + 1];
+	return !r || !i && !a ? 0 : n < t ? i ? r.left - (i.left + i.width) : a.left - (r.left + r.width) : a ? a.left - (r.left + r.width) : r.left - (i.left + i.width);
+}
+var w = (e) => {
+	let { rects: t, activeIndex: n, overIndex: r, index: i } = e, a = g(t, r, n), o = t[i], s = a[i];
+	return !s || !o ? null : {
+		x: s.left - o.left,
+		y: s.top - o.top,
+		scaleX: s.width / o.width,
+		scaleY: s.height / o.height
+	};
+}, T = {
+	scaleX: 1,
+	scaleY: 1
+}, E = (e) => {
+	let { activeIndex: t, activeNodeRect: n, index: r, rects: i, overIndex: a } = e, o = i[t] ?? n;
+	if (!o) return null;
+	if (r === t) {
+		let e = i[a];
+		return e ? {
+			x: 0,
+			y: t < a ? e.top + e.height - (o.top + o.height) : e.top - o.top,
+			...T
+		} : null;
+	}
+	let s = D(i, r, t);
+	return r > t && r <= a ? {
+		x: 0,
+		y: -o.height - s,
+		...T
+	} : r < t && r >= a ? {
+		x: 0,
+		y: o.height + s,
+		...T
+	} : {
+		x: 0,
+		y: 0,
+		...T
+	};
+};
+function D(e, t, n) {
+	let r = e[t], i = e[t - 1], a = e[t + 1];
+	return r ? n < t ? i ? r.top - (i.top + i.height) : a ? a.top - (r.top + r.height) : 0 : a ? a.top - (r.top + r.height) : i ? r.top - (i.top + i.height) : 0 : 0;
+}
+var O = "Sortable", k = /* @__PURE__ */ u.createContext({
+	activeIndex: -1,
+	containerId: O,
+	disableTransforms: !1,
+	items: [],
+	overIndex: -1,
+	useDragOverlay: !1,
+	sortedRects: [],
+	strategy: w,
+	disabled: {
+		draggable: !1,
+		droppable: !1
+	}
+});
+function A(e) {
+	let { children: t, id: n, items: a, strategy: o = w, disabled: c = !1 } = e, { active: l, dragOverlay: d, droppableRects: h, over: g, measureDroppableContainers: v } = s(), x = i(O, n), S = d.rect !== null, C = p(() => a.map((e) => typeof e == "object" && "id" in e ? e.id : e), [a]), T = l != null, E = l ? C.indexOf(l.id) : -1, D = g ? C.indexOf(g.id) : -1, A = m(C), j = !y(C, A.current), M = D !== -1 && E === -1 || j, N = b(c);
+	r(() => {
+		j && T && v(C);
+	}, [
+		j,
+		C,
+		T,
+		v
+	]), f(() => {
+		A.current = C;
+	}, [C]);
+	let P = p(() => ({
+		activeIndex: E,
+		containerId: x,
+		disabled: N,
+		disableTransforms: M,
+		items: C,
+		overIndex: D,
+		useDragOverlay: S,
+		sortedRects: _(C, h),
+		strategy: o
+	}), [
+		E,
+		x,
+		N.draggable,
+		N.droppable,
+		M,
+		C,
+		D,
+		h,
+		S,
+		o
+	]);
+	return u.createElement(k.Provider, { value: P }, t);
+}
+var j = (e) => {
+	let { id: t, items: n, activeIndex: r, overIndex: i } = e;
+	return g(n, r, i).indexOf(t);
+}, M = (e) => {
+	let { containerId: t, isSorting: n, wasDragging: r, index: i, items: a, newIndex: o, previousItems: s, previousContainerId: c, transition: l } = e;
+	return !l || !r || s !== a && i === o ? !1 : n ? !0 : o !== i && t === c;
+}, N = {
+	duration: 200,
+	easing: "ease"
+}, P = "transform", ee = /* @__PURE__ */ e.Transition.toString({
+	property: P,
+	duration: 0,
+	easing: "linear"
+}), te = { roleDescription: "sortable" };
+function F(e) {
+	let { disabled: t, index: n, node: i, rect: a } = e, [s, c] = h(null), l = m(n);
+	return r(() => {
+		if (!t && n !== l.current && i.current) {
+			let e = a.current;
+			if (e) {
+				let t = o(i.current, { ignoreTransform: !0 }), n = {
+					x: e.left - t.left,
+					y: e.top - t.top,
+					scaleX: e.width / t.width,
+					scaleY: e.height / t.height
+				};
+				(n.x || n.y) && c(n);
+			}
+		}
+		n !== l.current && (l.current = n);
+	}, [
+		t,
+		n,
+		i,
+		a
+	]), f(() => {
+		s && c(null);
+	}, [s]), s;
+}
+function I(r) {
+	let { animateLayoutChanges: i = M, attributes: a, disabled: o, data: s, getNewIndex: u = j, id: h, strategy: g, resizeObserverConfig: _, transition: y = N } = r, { items: b, containerId: x, activeIndex: S, disabled: C, disableTransforms: w, sortedRects: T, overIndex: E, useDragOverlay: D, strategy: O } = d(k), A = ne(o, C), I = b.indexOf(h), L = p(() => ({
+		sortable: {
+			containerId: x,
+			index: I,
+			items: b
+		},
+		...s
+	}), [
+		x,
+		s,
+		I,
+		b
+	]), re = p(() => b.slice(b.indexOf(h)), [b, h]), { rect: R, node: z, isOver: ie, setNodeRef: B } = l({
+		id: h,
+		data: L,
+		disabled: A.droppable,
+		resizeObserverConfig: {
+			updateMeasurementsFor: re,
+			..._
+		}
+	}), { active: V, activatorEvent: ae, activeNodeRect: oe, attributes: se, setNodeRef: H, listeners: ce, isDragging: U, over: W, setActivatorNodeRef: le, transform: ue } = c({
+		id: h,
+		data: L,
+		attributes: {
+			...te,
+			...a
+		},
+		disabled: A.draggable
+	}), de = n(B, H), G = !!V, K = G && !w && v(S) && v(E), q = !D && U, J = K ? (q && K ? ue : null) ?? (g ?? O)({
+		rects: T,
+		activeNodeRect: oe,
+		activeIndex: S,
+		overIndex: E,
+		index: I
+	}) : null, Y = v(S) && v(E) ? u({
+		id: h,
+		items: b,
+		activeIndex: S,
+		overIndex: E
+	}) : I, X = V?.id, Z = m({
+		activeId: X,
+		items: b,
+		newIndex: Y,
+		containerId: x
+	}), fe = b !== Z.current.items, Q = i({
+		active: V,
+		containerId: x,
+		isDragging: U,
+		isSorting: G,
+		id: h,
+		index: I,
+		items: b,
+		newIndex: Z.current.newIndex,
+		previousItems: Z.current.items,
+		previousContainerId: Z.current.containerId,
+		transition: y,
+		wasDragging: Z.current.activeId != null
+	}), $ = F({
+		disabled: !Q,
+		index: I,
+		node: z,
+		rect: R
+	});
+	return f(() => {
+		G && Z.current.newIndex !== Y && (Z.current.newIndex = Y), x !== Z.current.containerId && (Z.current.containerId = x), b !== Z.current.items && (Z.current.items = b);
+	}, [
+		G,
+		Y,
+		x,
+		b
+	]), f(() => {
+		if (X === Z.current.activeId) return;
+		if (X != null && Z.current.activeId == null) {
+			Z.current.activeId = X;
+			return;
+		}
+		let e = setTimeout(() => {
+			Z.current.activeId = X;
+		}, 50);
+		return () => clearTimeout(e);
+	}, [X]), {
+		active: V,
+		activeIndex: S,
+		attributes: se,
+		data: L,
+		rect: R,
+		index: I,
+		newIndex: Y,
+		items: b,
+		isOver: ie,
+		isSorting: G,
+		isDragging: U,
+		listeners: ce,
+		node: z,
+		overIndex: E,
+		over: W,
+		setNodeRef: de,
+		setActivatorNodeRef: le,
+		setDroppableNodeRef: B,
+		setDraggableNodeRef: H,
+		transform: $ ?? J,
+		transition: pe()
+	};
+	function pe() {
+		if ($ || fe && Z.current.newIndex === I) return ee;
+		if (!(q && !t(ae) || !y) && (G || Q)) return e.Transition.toString({
+			...y,
+			property: P
+		});
+	}
+}
+function ne(e, t) {
+	return typeof e == "boolean" ? {
+		draggable: e,
+		droppable: !1
+	} : {
+		draggable: e?.draggable ?? t.draggable,
+		droppable: e?.droppable ?? t.droppable
+	};
+}
+a.Down, a.Right, a.Up, a.Left;
+//#endregion
+export { A as SortableContext, S as horizontalListSortingStrategy, I as useSortable, E as verticalListSortingStrategy };

package/ui/index736.es.js

@@ -0,0 +1,63 @@
+import { x as e } from "./index6.es.js";
+import { require_jsx_runtime as t } from "./index143.es.js";
+import { Group as n } from "./index197.es.js";
+import { H6 as r } from "./index511.es.js";
+import { getTranslatedValue as i } from "./index513.es.js";
+import a from "./index577.es.js";
+import { RowLayout as o } from "./index731.es.js";
+import { CSS as s } from "./index732.es.js";
+import { useSortable as c } from "./index735.es.js";
+import { useCallback as l, useState as u } from "react";
+//#region packages/ui/Blocks/CommonGrid/components/ManageColumnForm/components/ManageColumnRow.tsx
+var d = t(), f = ({ column: t, columnsConfigValues: f, setColumnsConfigOptions: p, searchedValue: m }) => {
+	let [h, g] = u(f?.includes(t.name) ?? !1), _ = l(() => {
+		p((e) => ({
+			...e,
+			[t.name]: h ? { isHidden: !0 } : {}
+		})), g(!h);
+	}, [
+		p,
+		h,
+		t.name
+	]), v = i(t), y = v?.toLocaleLowerCase()?.includes(m.toLocaleLowerCase()) && !t.alwaysOn, { attributes: b, listeners: x, setNodeRef: S, transform: C, transition: w } = c({
+		id: t.name,
+		disabled: !!m || !!t.sticky,
+		animateLayoutChanges: () => !1
+	});
+	return /* @__PURE__ */ (0, d.jsx)(o, {
+		$isVisible: y,
+		transition: w,
+		transform: s.Transform.toString(C),
+		ref: S,
+		children: /* @__PURE__ */ (0, d.jsxs)(e.div, {
+			display: "flex",
+			alignItems: "center",
+			w: "100%",
+			children: [/* @__PURE__ */ (0, d.jsx)(e.div, {
+				w: "28px",
+				children: /* @__PURE__ */ (0, d.jsx)(a, {
+					name: "",
+					variant: "grid",
+					onChange: _,
+					spaceAround: !1,
+					checked: h
+				})
+			}), /* @__PURE__ */ (0, d.jsxs)(r, {
+				variant: "medium",
+				ml: "8px",
+				m: "0",
+				w: "100%",
+				p: "8px",
+				cursor: "grab",
+				...b,
+				...x,
+				display: "flex",
+				alignItems: "center",
+				justifyContent: "space-between",
+				children: [v, /* @__PURE__ */ (0, d.jsx)(n, {})]
+			})]
+		})
+	});
+};
+//#endregion
+export { f as ManageColumnRow };

package/ui/index737.es.js

@@ -0,0 +1,11 @@
+import "./index732.es.js";
+//#region node_modules/@dnd-kit/modifiers/dist/modifiers.esm.js
+var e = (e) => {
+	let { transform: t } = e;
+	return {
+		...t,
+		x: 0
+	};
+};
+//#endregion
+export { e as restrictToVerticalAxis };

package/ui/index738.es.js

@@ -0,0 +1,51 @@
+import { x as e } from "./index6.es.js";
+import { require_jsx_runtime as t } from "./index143.es.js";
+import { i18n as n } from "./index502.es.js";
+import { Input as r } from "./index613.es.js";
+import { DndContext as i, PointerSensor as a, closestCenter as o, useSensor as s, useSensors as c } from "./index734.es.js";
+import { SortableContext as l, verticalListSortingStrategy as u } from "./index735.es.js";
+import { ManageColumnRow as d } from "./index736.es.js";
+import { restrictToVerticalAxis as f } from "./index737.es.js";
+import { useCallback as p, useState as m } from "react";
+//#region packages/ui/Blocks/CommonGrid/components/ManageColumnForm/ManageColumnForm.tsx
+var h = t(), g = [f], _ = ({ columns: t, columnsConfigValues: f, setColumnsConfigOptions: _, handleDragEnd: v }) => {
+	let [y, b] = m(""), x = p((e) => {
+		b(e.target.value);
+	}, [b]), S = p(() => {
+		b("");
+	}, [b]), C = c(s(a));
+	return /* @__PURE__ */ (0, h.jsxs)(e.div, { children: [/* @__PURE__ */ (0, h.jsx)(r, {
+		icon: "search",
+		type: "text",
+		value: y,
+		placeholder: n._({
+			id: "manageColumn.searchPlaceholder",
+			message: "Find column..."
+		}),
+		onChange: x,
+		onClear: S,
+		variant: "gray"
+	}), /* @__PURE__ */ (0, h.jsx)(i, {
+		sensors: C,
+		collisionDetection: o,
+		onDragEnd: v,
+		modifiers: g,
+		children: /* @__PURE__ */ (0, h.jsx)(l, {
+			items: t.map(({ name: e }) => e),
+			strategy: u,
+			children: /* @__PURE__ */ (0, h.jsx)(e.div, {
+				h: "400px",
+				overflowY: "scroll",
+				mt: "20px",
+				children: t.map((e) => /* @__PURE__ */ (0, h.jsx)(d, {
+					column: e,
+					columnsConfigValues: f,
+					setColumnsConfigOptions: _,
+					searchedValue: y
+				}, e.name))
+			})
+		})
+	})] });
+};
+//#endregion
+export { _ as default };

package/ui/index739.es.js

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

package/ui/index74.es.js

@@ -0,0 +1,20 @@
+import { __commonJSMin as e } from "./index2.es.js";
+//#region node_modules/@fortawesome/pro-solid-svg-icons/faCheck.js
+var t = /* @__PURE__ */ e(((e) => {
+	Object.defineProperty(e, "__esModule", { value: !0 });
+	var t = "fas", n = "check", r = 448, i = 512, a = [10003, 10004], o = "f00c", s = "M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z";
+	e.definition = {
+		prefix: t,
+		iconName: n,
+		icon: [
+			r,
+			i,
+			a,
+			o,
+			s
+		]
+	}, e.faCheck = e.definition, e.prefix = t, e.iconName = n, e.width = r, e.height = i, e.ligatures = a, e.unicode = o, e.svgPathData = s, e.aliases = a;
+}));
+//#endregion
+export default t();
+export { t as require_faCheck };

package/ui/index740.es.js

@@ -0,0 +1,19 @@
+import { styled as e } from "./index6.es.js";
+//#region packages/ui/Blocks/CommonGrid/components/PresetsModalBody/components/TagRemove.tsx
+var t = e.div`
+  cursor: pointer;
+  margin-left: 6px;
+  height: fit-content;
+  width: 17px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+
+  &:hover {
+    svg {
+      fill: black;
+    }
+  }
+`;
+//#endregion
+export { t as TagRemove };

package/ui/index741.es.js

@@ -0,0 +1,92 @@
+import { __toESM as e } from "./index2.es.js";
+import { x as t } from "./index6.es.js";
+import { require_jsx_runtime as n } from "./index143.es.js";
+import { Cancel as r } from "./index144.es.js";
+import i from "./index248.es.js";
+import { Trans as a } from "./index504.es.js";
+import o from "./index507.es.js";
+import { palettes as s } from "./index508.es.js";
+import { H6 as c } from "./index511.es.js";
+import { require_isEmpty as l } from "./index725.es.js";
+import { TagRemove as u } from "./index740.es.js";
+import { useMemo as d } from "react";
+//#region packages/ui/Blocks/CommonGrid/components/PresetsModalBody/index.tsx
+var f = /* @__PURE__ */ e(l(), 1), p = n(), m = ({ onOpenCreatePresetModal: e, gridPresets: n, handleSelectPreset: l, handleOpenDeletePresetModal: m, selectedPresetName: h, handleExportPresets: g, handleImportButtonClick: _, handleImportPresets: v, fileInputRef: y, filters: b }) => {
+	let x = d(() => Object.entries(n || {}), [n]), S = !!x?.length;
+	return /* @__PURE__ */ (0, p.jsxs)(t.div, { children: [
+		/* @__PURE__ */ (0, p.jsx)(t.div, {
+			display: "flex",
+			rowGap: "12px",
+			flexWrap: "wrap",
+			children: S ? x?.map(([e, t], n) => {
+				let i = e === h;
+				return /* @__PURE__ */ (0, p.jsxs)(o, {
+					size: "big",
+					onClick: l(e, t),
+					...i ? s.redWhite : s.redRed,
+					pointer: !0,
+					children: [/* @__PURE__ */ (0, p.jsx)(c, {
+						mt: 0,
+						mb: 0,
+						variant: "semiBold",
+						children: e
+					}), /* @__PURE__ */ (0, p.jsx)(u, {
+						onClick: m(e),
+						children: /* @__PURE__ */ (0, p.jsx)(r, {
+							fill: i ? "white" : "#DB2B19",
+							width: "11px",
+							height: "11px"
+						})
+					})]
+				}, `${e}_${n}`);
+			}) : /* @__PURE__ */ (0, p.jsx)(a, {
+				id: "dataGrid.noPresets.title",
+				message: "No presets available"
+			})
+		}),
+		/* @__PURE__ */ (0, p.jsx)(t.input, {
+			type: "file",
+			accept: ".json",
+			onChange: v,
+			ref: y,
+			display: "none"
+		}),
+		/* @__PURE__ */ (0, p.jsxs)(t.div, {
+			display: "flex",
+			mt: "34px",
+			gap: "12px",
+			justifyContent: "space-between",
+			children: [/* @__PURE__ */ (0, p.jsxs)(t.div, {
+				display: "flex",
+				gap: "12px",
+				children: [S && /* @__PURE__ */ (0, p.jsx)(i, {
+					onClick: g,
+					type: "button",
+					appearance: "secondary",
+					children: /* @__PURE__ */ (0, p.jsx)(a, {
+						id: "dataGrid.exportPreset.title",
+						message: "Export presets"
+					})
+				}), /* @__PURE__ */ (0, p.jsx)(i, {
+					onClick: _,
+					type: "button",
+					appearance: "secondary",
+					children: /* @__PURE__ */ (0, p.jsx)(a, {
+						id: "dataGrid.importPreset.title",
+						message: "Import presets"
+					})
+				})]
+			}), /* @__PURE__ */ (0, p.jsx)(i, {
+				type: "button",
+				onClick: e,
+				disabled: (0, f.default)(b),
+				children: /* @__PURE__ */ (0, p.jsx)(a, {
+					id: "dataGrid.createNewPreset.title",
+					message: "Create new preset"
+				})
+			})]
+		})
+	] });
+};
+//#endregion
+export { m as PresetsModalBody };