@astrato-io/visualizations 0.6.4 → 0.6.5

package/chunks/Radio-Ciu-F4CU.js

@@ -1,957 +0,0 @@
-import { o as e } from "./rolldown-runtime-DleVn1XH.js";
-import { Oa as t, n, t as r } from "./interfaces-VUY4_yVO.js";
-import { G as i, Ki as a, Nn as o, Nr as s, V as c, bi as l, gi as u, pi as d, pr as f, r as p, wi as m, xr as h, yi as g } from "./utils-Ba9T0TqC.js";
-import { C as _, D as v, E as y, O as b, T as x, V as S, Z as C, ct as w, dt as T, l as E, st as D, v as ee, w as O } from "./_baseFlatten-DPXPOrea.js";
-import "./coloring-C16AUZEi.js";
-var k = /* @__PURE__ */ e(a()), A = m();
-function j(e) {
-	return e.substring(2).toLowerCase();
-}
-function te(e, t) {
-	return t.documentElement.clientWidth < e.clientX || t.documentElement.clientHeight < e.clientY;
-}
-function ne(e) {
-	let { children: t, disableReactTree: n = !1, mouseEvent: r = "onClick", onClickAway: i, touchEvent: a = "onTouchEnd" } = e, o = k.useRef(!1), s = k.useRef(null), c = k.useRef(!1), l = k.useRef(!1);
-	k.useEffect(() => (setTimeout(() => {
-		c.current = !0;
-	}, 0), () => {
-		c.current = !1;
-	}), []);
-	let u = D(C(t), s), d = w((e) => {
-		let t = l.current;
-		l.current = !1;
-		let r = T(s.current);
-		if (!c.current || !s.current || "clientX" in e && te(e, r)) return;
-		if (o.current) {
-			o.current = !1;
-			return;
-		}
-		let a;
-		a = e.composedPath ? e.composedPath().indexOf(s.current) > -1 : !r.documentElement.contains(e.target) || s.current.contains(e.target), !a && (n || !t) && i(e);
-	}), f = (e) => (n) => {
-		l.current = !0;
-		let r = t.props[e];
-		r && r(n);
-	}, p = { ref: u };
-	return a !== !1 && (p[a] = f(a)), k.useEffect(() => {
-		if (a !== !1) {
-			let e = j(a), t = T(s.current), n = () => {
-				o.current = !0;
-			};
-			return t.addEventListener(e, d), t.addEventListener("touchmove", n), () => {
-				t.removeEventListener(e, d), t.removeEventListener("touchmove", n);
-			};
-		}
-	}, [d, a]), r !== !1 && (p[r] = f(r)), k.useEffect(() => {
-		if (r !== !1) {
-			let e = j(r), t = T(s.current);
-			return t.addEventListener(e, d), () => {
-				t.removeEventListener(e, d);
-			};
-		}
-	}, [d, r]), /*#__PURE__*/ (0, A.jsx)(k.Fragment, { children: /*#__PURE__*/ k.cloneElement(t, p) });
-}
-var M = {
-	"--background-color": t.white,
-	"--color": t.mainDarkNavy,
-	"--font-family": "Roboto",
-	"--font-weight": "normal",
-	"--font-style": "normal",
-	"--text-decoration": "none",
-	"--text-align": "left"
-}, N = (e) => {
-	let t = e["--background-color"], n = e["--color"], r = ie(t), { searchFontColor: i, searchBorderColor: a } = re(t, n);
-	return {
-		"--background-color-hover": r,
-		"--search-font-color": i,
-		"--search-border-color": a
-	};
-}, re = (e, n) => n ? {
-	searchFontColor: n,
-	searchBorderColor: n
-} : !e || e === "transparent" ? {
-	searchFontColor: t.grey2,
-	searchBorderColor: t.grey3
-} : new E(e).luminanceWithAlpha() < .5 ? {
-	searchFontColor: t.white,
-	searchBorderColor: t.white
-} : {
-	searchFontColor: t.grey2,
-	searchBorderColor: t.grey3
-}, ie = (e) => {
-	if (!e || e === "transparent") return t.grey3;
-	let n = new E(e);
-	return n.luminanceWithAlpha() < .5 ? n.addTint(.2).hex() : n.addShade(.1).hex();
-}, P = {
-	[O.md]: {
-		fontSize: "11px",
-		lineHeight: "12px"
-	},
-	[O.sm]: {
-		fontSize: "9px",
-		lineHeight: "10px"
-	},
-	[O.xs]: {
-		fontSize: "8px",
-		lineHeight: "8px"
-	}
-}, ae = i({
-	container: (e) => ({
-		backgroundColor: "var(--background-color)",
-		fontFamily: "var(--font-family)",
-		padding: "8px 0",
-		...e && {
-			[O.md]: { padding: "6px 0" },
-			[O.sm]: { padding: "4px 0" },
-			[O.xs]: { padding: "2px 0" }
-		}
-	}),
-	divActions: {
-		boxShadow: `0 0 8px ${t.grey4}`,
-		display: "flex",
-		flexWrap: "wrap",
-		gap: 8,
-		marginBottom: -8,
-		marginTop: 8,
-		padding: 8
-	},
-	divActionsAction: {
-		...n.normal14,
-		borderRadius: 4,
-		cursor: "pointer",
-		textAlign: "center",
-		width: "100%",
-		"&[aria-disabled=\"true\"]": {
-			cursor: "not-allowed",
-			opacity: .6
-		}
-	},
-	divActionsAction__primary: {
-		background: t.mainDarkNavy,
-		color: t.white,
-		padding: "2px 1px"
-	},
-	divActionsAction__secondary: {
-		border: `1px solid ${t.grey3}`,
-		color: t.mainDarkNavy,
-		padding: "1px 0"
-	},
-	divOptions: (e) => ({
-		...r.propertiesPanel,
-		scrollbarGutter: "initial",
-		maxHeight: 400,
-		padding: "0 8px",
-		...e && {
-			[O.md]: { padding: "0 6px" },
-			[O.sm]: { padding: "0 4px" },
-			[O.xs]: { padding: "0 2px" }
-		}
-	}),
-	header: (e) => ({
-		...n.bold13,
-		gap: 8,
-		padding: "10px 16px",
-		display: "flex",
-		textAlign: "var(--text-align)",
-		color: "var(--color)",
-		...e && P
-	}),
-	divOptionsOption: (e) => ({
-		alignItems: "center",
-		borderRadius: 4,
-		color: "var(--color)",
-		cursor: "pointer",
-		display: "flex",
-		textAlign: "var(--text-align)",
-		gap: 8,
-		padding: "0px 8px",
-		height: 32,
-		"&:hover": { background: "var(--background-color-hover)" },
-		"&[aria-disabled=\"true\"]": { color: t.grey3 },
-		"& > div": { display: "flex" },
-		...e && {
-			..._,
-			[O.md]: {
-				padding: "0px 8px",
-				height: 24,
-				gap: 4
-			},
-			[O.sm]: {
-				padding: "0px 6px",
-				height: 20,
-				gap: 2
-			},
-			[O.xs]: {
-				padding: "0px 4px",
-				height: 16,
-				gap: 1
-			}
-		}
-	}),
-	divOptionsOptionCategory: (e) => ({
-		...n.bold13,
-		fontStyle: "var(--font-style)",
-		textDecoration: "var(--text-decoration)",
-		background: "var(--background-color)",
-		position: "sticky",
-		top: 0,
-		zIndex: 1,
-		...e && P
-	}),
-	divOptionsOptionDivider: (e) => ({
-		borderRadius: "0px",
-		cursor: "initial",
-		padding: "0px",
-		margin: "10px 8px",
-		borderBottom: `1px solid ${t.grey4}`,
-		height: 0,
-		"&:hover": { background: "initial" },
-		...e && {
-			[O.md]: { margin: "8px" },
-			[O.sm]: { margin: "6px" },
-			[O.xs]: { margin: "4px" }
-		}
-	}),
-	divOptionsOptionOption: (e) => ({
-		...n.normal13,
-		fontStyle: "var(--font-style)",
-		lineHeight: n.normal13.lineHeight,
-		textDecoration: "var(--text-decoration)",
-		"&[aria-disabled=\"true\"]": { cursor: "not-allowed" },
-		"&[aria-expanded=\"true\"]": { background: t.grey5 },
-		...e && P
-	}),
-	divOptionsOptionOptionLabel: {
-		...n.overflowEllipsis,
-		display: "initial !important",
-		height: "100%",
-		alignContent: "center",
-		flexGrow: 1
-	},
-	divSearch: {
-		padding: "8px",
-		display: "flex",
-		"& > div": { flexGrow: 1 }
-	}
-}), F = (0, k.createContext)({
-	onClose: () => null,
-	onOpen: () => null
-}), I = (e) => {
-	let t = (0, k.useContext)(F), [n, r] = (0, k.useState)(!1), [i, a] = (0, k.useState)(!1), o = (0, k.useMemo)(() => ({
-		onClose: () => a(!1),
-		onOpen: () => a(!0)
-	}), []);
-	return /* @__PURE__ */ (0, A.jsx)(F.Provider, {
-		value: o,
-		children: /* @__PURE__ */ (0, A.jsx)(v, {
-			onClose: () => {
-				t.onClose(), r(!1);
-			},
-			onOpen: () => {
-				t.onOpen(), r(!0);
-			},
-			open: !i && n,
-			...e
-		})
-	});
-}, oe = ({ tooltip: e, children: t }) => e ? /* @__PURE__ */ (0, A.jsx)(I, {
-	title: e,
-	children: t
-}) : t, se = ({ action: e, classNames: t }) => {
-	let { color: n = "primary", disabled: r = !1, key: i, label: a, onClick: s, style: c = {} } = e;
-	return /* @__PURE__ */ (0, A.jsx)(oe, {
-		tooltip: e.tooltip,
-		children: /* @__PURE__ */ (0, A.jsx)("div", {
-			"aria-disabled": r,
-			className: o({
-				[t.divActionsAction]: !0,
-				[t.divActionsAction__primary]: n === "primary",
-				[t.divActionsAction__secondary]: n === "secondary"
-			}),
-			onClick: r ? void 0 : s,
-			onKeyDown: y,
-			role: "button",
-			style: c,
-			tabIndex: r ? void 0 : 0,
-			children: a
-		}, i)
-	});
-}, ce = ({ actions: e, classNames: t }) => e.length ? /* @__PURE__ */ (0, A.jsx)("div", {
-	className: t.divActions,
-	children: e.map((e) => /* @__PURE__ */ (0, A.jsx)(se, {
-		classNames: t,
-		action: e
-	}, e.key))
-}) : null, L = (e) => {
-	let t = (0, k.useContext)(F), n = (0, k.useRef)(null), [r, i] = (0, k.useState)(!1), [a, o] = (0, k.useState)(!1), s = (0, k.useMemo)(() => ({
-		onClose: () => o(!1),
-		onOpen: () => o(!0)
-	}), []);
-	return /* @__PURE__ */ (0, A.jsx)(F.Provider, {
-		value: s,
-		children: /* @__PURE__ */ (0, A.jsx)(v, {
-			disableFocusListener: !0,
-			disableInteractive: !0,
-			enterDelay: 500,
-			enterNextDelay: 500,
-			onClose: () => {
-				t.onClose(), i(!1);
-			},
-			onOpen: () => {
-				if (n.current) {
-					let e = n.current.hasAttribute("data-ellipsis") ? n.current : n.current.querySelector("[data-ellipsis]");
-					if (e && e.clientWidth >= e.scrollWidth && e.clientHeight >= e.scrollHeight) return;
-				}
-				t.onOpen(), i(!0);
-			},
-			open: !a && r,
-			ref: n,
-			...e
-		})
-	});
-}, le = (e, t) => {
-	let { type: n } = e;
-	return n === "category" ? {
-		...e,
-		children: e.children.filter((e) => t(e))
-	} : e;
-}, ue = (e, t) => {
-	let { type: n } = e;
-	switch (n) {
-		case "category": {
-			let { children: t } = e;
-			return t.length > 0;
-		}
-		case "divider": return !0;
-		default: {
-			let { label: n, description: r } = e;
-			if (!n || typeof n != "string") return !0;
-			let i = n.toLocaleLowerCase(), a = r?.toLocaleLowerCase();
-			return i.includes(t) || !!a?.includes(t);
-		}
-	}
-}, de = (e, t) => {
-	let n = (e) => ue(e, t);
-	return e.map((e) => le(e, n)).filter(n);
-}, fe = (e) => {
-	let t = e.reduce((e, t) => e + Number("isChecked" in t && t.isChecked === !0), 0);
-	switch (!0) {
-		case t === e.length: return "full";
-		case t > 0: return "partial";
-		default: return "none";
-	}
-}, pe = ({ classNames: e, option: t, openedElement: n, setOpenedElement: r, collapsed: i, setCollapsed: a, searchPhrase: s, onCloseClick: c, responsive: l, checkboxSize: d }) => {
-	let { children: f, disabled: p = !1, label: m, tooltip: h, onCheck: _, key: v } = t, b = fe(f);
-	return /* @__PURE__ */ (0, A.jsxs)(k.Fragment, { children: [/* @__PURE__ */ (0, A.jsx)(L, {
-		title: m,
-		children: /* @__PURE__ */ (0, A.jsxs)("div", {
-			"aria-disabled": p,
-			"aria-expanded": !i[v],
-			className: o({
-				[e.divOptionsOption]: !0,
-				[e.divOptionsOptionCategory]: !0
-			}),
-			onClick: () => {
-				a({
-					...i,
-					[v]: !i[v]
-				}), r({});
-			},
-			onKeyDown: y,
-			role: "menuitem",
-			tabIndex: p ? void 0 : 0,
-			children: [
-				/* @__PURE__ */ (0, A.jsx)(B, {
-					onCheck: _,
-					checked: b,
-					disabled: p,
-					size: d
-				}),
-				/* @__PURE__ */ (0, A.jsx)(U, {
-					label: m,
-					searchPhrase: s,
-					classNames: e
-				}),
-				/* @__PURE__ */ (0, A.jsx)(q, { tooltipTitle: h }),
-				/* @__PURE__ */ (0, A.jsx)(V, { icon: i[v] ? /* @__PURE__ */ (0, A.jsx)(g, {}) : /* @__PURE__ */ (0, A.jsx)(u, {}) })
-			]
-		})
-	}), i[v] ? null : f.map((t) => /* @__PURE__ */ (0, A.jsx)(J, {
-		classNames: e,
-		option: t,
-		openedElement: n,
-		setOpenedElement: r,
-		collapsed: i,
-		setCollapsed: a,
-		searchPhrase: s,
-		onCloseClick: c,
-		responsive: l,
-		checkboxSize: d
-	}, t.key))] }, v);
-}, me = i({
-	container: {
-		position: "relative",
-		display: "flex",
-		justifyContent: "center"
-	},
-	checkbox: {
-		WebkitAppearance: "none",
-		appearance: "none",
-		margin: 0,
-		backgroundColor: t.white,
-		border: `1px solid ${t.grey3}`,
-		borderRadius: 4,
-		cursor: "pointer",
-		"&[aria-disabled=\"true\"]": { cursor: "default" },
-		"&[aria-readonly=\"true\"]": { cursor: "default" },
-		"&:focus": { boxShadow: `0px 0px 1px 1px ${t.mainDarkNavy}40` }
-	},
-	checkboxChecked: { border: `1px solid ${t.grey2} !important` },
-	checkboxUnchecked: { border: `1px solid ${t.grey3}` },
-	checkmark: {
-		top: 0,
-		position: "absolute",
-		cursor: "pointer"
-	}
-}), R = {
-	onClick: null,
-	checkedType: "none",
-	checkMarkColor: t.mainBrightPink,
-	disabled: !1,
-	readOnly: !1,
-	size: 16,
-	styles: {},
-	tabIndex: 0
-}, he = ({ checkedType: e, size: n, fill: r = t.mainBrightPink }) => {
-	switch (e) {
-		case "full": return /* @__PURE__ */ (0, A.jsx)(l, {
-			fill: r,
-			size: n
-		});
-		case "partial": return /* @__PURE__ */ (0, A.jsx)(h, {
-			fill: r,
-			size: n
-		});
-		default: return null;
-	}
-}, z = (e) => {
-	let { onClick: t, checkedType: n, checkMarkColor: r, disabled: i, readOnly: a, size: s, styles: c, tabIndex: l } = {
-		...R,
-		...e
-	}, u = n !== "none", d = (e) => {
-		t && (e.stopPropagation(), !i && !a && t(e));
-	}, f = (e) => {
-		e.key === "Enter" && (e.preventDefault(), d(e));
-	}, p = me(), m = c?.borderWidth !== void 0 && !!c?.borderColor && !!c?.borderStyle;
-	return /* @__PURE__ */ (0, A.jsxs)("div", {
-		className: p.container,
-		style: { height: s },
-		onClick: d,
-		children: [/* @__PURE__ */ (0, A.jsx)("input", {
-			type: "checkbox",
-			"aria-disabled": i,
-			"aria-readonly": a,
-			"aria-checked": u,
-			style: {
-				...c,
-				height: s,
-				width: s
-			},
-			tabIndex: l,
-			onKeyDown: f,
-			className: o({
-				[p.checkbox]: !0,
-				[p.checkboxUnchecked]: !u,
-				[p.checkboxChecked]: !m && u
-			})
-		}), /* @__PURE__ */ (0, A.jsx)("div", {
-			className: p.checkmark,
-			children: /* @__PURE__ */ (0, A.jsx)(he, {
-				checkedType: n,
-				size: s,
-				fill: r
-			})
-		})]
-	});
-}, B = ({ onCheck: e, checked: t, disabled: n, size: r }) => e ? /* @__PURE__ */ (0, A.jsx)(z, {
-	onClick: e,
-	checkedType: t,
-	disabled: n,
-	size: r
-}) : null, ge = ({ classNames: e, option: t }) => /* @__PURE__ */ (0, A.jsx)("div", {
-	className: o({
-		[e.divOptionsOption]: !0,
-		[e.divOptionsOptionDivider]: !0
-	}),
-	role: "separator"
-}, t.key), V = ({ icon: e }) => e ? /* @__PURE__ */ (0, A.jsx)("div", { children: e }) : null, _e = i({ span: { fontWeight: "bold" } }), ve = (e, t) => {
-	let n = _e();
-	if (!e) return [{ children: t }];
-	let r = e.toLocaleLowerCase(), i = t.toLocaleLowerCase(), a = [], o = 0;
-	for (; o < t.length;) {
-		let s = i.indexOf(r, o);
-		switch (s) {
-			case -1:
-				a.push({ children: t.substring(o) }), o = t.length;
-				break;
-			default: a.push({ children: t.substring(o, s) }), a.push({
-				children: t.substring(s, s + e.length),
-				className: n.span
-			}), o = s + e.length;
-		}
-	}
-	return a;
-}, H = ({ children: e, phrase: t }) => /* @__PURE__ */ (0, A.jsx)(A.Fragment, { children: ve(t, e).map((e, t) => /* @__PURE__ */ (0, A.jsx)("span", { ...e }, t)) }), U = ({ classNames: e, label: t, searchPhrase: n }) => /* @__PURE__ */ (0, A.jsx)("div", {
-	"data-ellipsis": !0,
-	className: e.divOptionsOptionOptionLabel,
-	children: typeof t == "string" ? /* @__PURE__ */ (0, A.jsx)(H, {
-		phrase: n,
-		children: t
-	}) : t
-}), W = /* @__PURE__ */ function(e) {
-	return e.left = "left", e.right = "right", e;
-}({}), G = ({ actions: e = [], anchorEl: t, anchorPosition: n, cssVariables: r, onClose: i, onCloseClick: a, options: o, searchEnabled: s = !1, style: c = {}, pickedOptionsIds: l, header: u, menuStyle: d, responsive: f, ...p }) => /* @__PURE__ */ (0, A.jsx)(b, {
-	...p,
-	anchorEl: t,
-	anchorPosition: n,
-	MenuListProps: {
-		role: void 0,
-		tabIndex: void 0
-	},
-	onClose: i,
-	open: !!t || !!n,
-	style: d,
-	children: /* @__PURE__ */ (0, A.jsx)($, {
-		header: u,
-		actions: e,
-		onClose: i,
-		onCloseClick: a,
-		options: o,
-		pickedOptionsIds: l,
-		searchEnabled: s,
-		style: c,
-		cssVariables: r,
-		responsive: f
-	})
-}), K = ({ children: e, classNames: t, option: n, onClick: r }) => {
-	let { disabled: i = !1, label: a, key: s } = n;
-	return /* @__PURE__ */ (0, A.jsx)(L, {
-		title: a,
-		children: /* @__PURE__ */ (0, A.jsx)("div", {
-			"aria-disabled": i,
-			className: o({
-				[t.divOptionsOption]: !0,
-				[t.divOptionsOptionOption]: !0
-			}),
-			onClick: r,
-			onKeyDown: y,
-			role: "menuitem",
-			tabIndex: i ? void 0 : 0,
-			children: e
-		})
-	}, s);
-}, ye = (e) => {
-	let { openedElement: t, setOpenedElement: n, onCloseClick: r, multiSelect: i, classNames: a, option: o, checkboxSize: s } = e, { children: c = [], disabled: l = !1, label: u, onCheck: d, onClick: f, onMultiClick: p, isChecked: m, tooltip: h, key: g } = o, [_, v] = (0, k.useState)({ icon: o.icon || {} }), { icon: y } = _, b;
-	return c.length ? (b = (e) => {
-		l || n({ [g]: e.currentTarget });
-	}, /* @__PURE__ */ (0, A.jsxs)(k.Fragment, { children: [/* @__PURE__ */ (0, A.jsxs)(K, {
-		...e,
-		onClick: b,
-		children: [
-			/* @__PURE__ */ (0, A.jsx)(V, { icon: y?.left }),
-			/* @__PURE__ */ (0, A.jsx)(U, {
-				label: u,
-				classNames: a
-			}),
-			/* @__PURE__ */ (0, A.jsx)(q, { tooltipTitle: h }),
-			/* @__PURE__ */ (0, A.jsx)(V, { icon: y?.right })
-		]
-	}), /* @__PURE__ */ (0, A.jsx)(G, {
-		anchorEl: t[g],
-		anchorOrigin: {
-			horizontal: "left",
-			vertical: "top"
-		},
-		onClose: () => {
-			n({});
-		},
-		onCloseClick: (e) => {
-			r(e), n({});
-		},
-		options: c,
-		transformOrigin: {
-			horizontal: "right",
-			vertical: "top"
-		}
-	})] }, g)) : (b = (e) => {
-		if (!l) {
-			if (f?.(e), i) {
-				let e = p?.();
-				e && v((t) => ({
-					...t,
-					...e
-				}));
-				return;
-			}
-			d || r(e);
-		}
-	}, /* @__PURE__ */ (0, A.jsxs)(K, {
-		...e,
-		onClick: b,
-		children: [
-			e.option.checkboxPosition !== W.right && /* @__PURE__ */ (0, A.jsx)(B, {
-				onCheck: d,
-				checked: m ? "full" : "none",
-				disabled: l,
-				size: s
-			}),
-			/* @__PURE__ */ (0, A.jsx)(V, { icon: y?.left }),
-			/* @__PURE__ */ (0, A.jsx)(U, {
-				label: u,
-				classNames: a
-			}),
-			/* @__PURE__ */ (0, A.jsx)(q, { tooltipTitle: h }),
-			/* @__PURE__ */ (0, A.jsx)(V, { icon: y?.right }),
-			e.option.checkboxPosition === W.right && /* @__PURE__ */ (0, A.jsx)(B, {
-				onCheck: d,
-				checked: m ? "full" : "none",
-				disabled: l,
-				size: s
-			})
-		]
-	}));
-}, q = ({ tooltipTitle: e }) => e ? /* @__PURE__ */ (0, A.jsx)(I, {
-	title: e,
-	children: /* @__PURE__ */ (0, A.jsx)("div", { children: /* @__PURE__ */ (0, A.jsx)(s, {}) })
-}) : null, J = (e) => {
-	let { type: t } = e.option;
-	switch (t) {
-		case "category": return /* @__PURE__ */ (0, A.jsx)(pe, { ...e });
-		case "divider": return /* @__PURE__ */ (0, A.jsx)(ge, { ...e });
-		case "option": return /* @__PURE__ */ (0, A.jsx)(ye, { ...e });
-		default: return null;
-	}
-}, Y = ({ classNames: e, options: t, searchPhrase: n, autoFocus: r, openedElement: i, setOpenedElement: a, collapsed: o, setCollapsed: s, onCloseClick: c, multiSelect: l = !1, responsive: u, checkboxSize: d }) => {
-	let f = n.toLocaleLowerCase(), p = de(t, f);
-	return /* @__PURE__ */ (0, A.jsx)("div", {
-		className: e.divOptions,
-		onKeyDown: x,
-		ref: r,
-		role: "menu",
-		children: p.map((t) => /* @__PURE__ */ (0, A.jsx)(J, {
-			classNames: e,
-			option: t,
-			openedElement: i,
-			setOpenedElement: a,
-			collapsed: o,
-			setCollapsed: s,
-			searchPhrase: f,
-			onCloseClick: c,
-			multiSelect: l,
-			responsive: u,
-			checkboxSize: d
-		}, t.key))
-	});
-}, be = i({ button: {
-	background: "initial",
-	border: "initial",
-	padding: "initial",
-	borderRadius: 4,
-	cursor: "pointer",
-	display: "block"
-} }), X = (0, k.forwardRef)(function({ children: e, className: t, ...n }, r) {
-	let i = be();
-	return /* @__PURE__ */ (0, A.jsx)("button", {
-		...n,
-		className: o({
-			[String(t)]: !0,
-			[i.button]: !0
-		}),
-		ref: r,
-		children: e
-	});
-}), xe = i({
-	button: (e) => ({
-		position: "absolute",
-		right: 4,
-		top: 4,
-		...e && {
-			[O.md]: { top: 2 },
-			"& svg": {
-				[O.sm]: {
-					width: 12,
-					height: 12
-				},
-				[O.xs]: {
-					width: 8,
-					height: 8
-				}
-			}
-		}
-	}),
-	div: {
-		display: "flex",
-		position: "relative"
-	},
-	input: (e) => ({
-		...n.normal13,
-		background: "initial",
-		border: `1px solid ${t.grey3}`,
-		borderRadius: 4,
-		boxSizing: "border-box",
-		color: t.mainDarkNavy,
-		flexGrow: 1,
-		height: 24,
-		padding: "3px 23px",
-		...e && {
-			[O.md]: {
-				height: 20,
-				...n.normal12
-			},
-			[O.sm]: {
-				height: 16,
-				...n.normal11,
-				padding: "3px 16px"
-			},
-			[O.xs]: {
-				height: 12,
-				...n.normal10,
-				padding: "0px 12px"
-			}
-		},
-		"&::placeholder": { color: "inherit" }
-	}),
-	svg: (e) => ({
-		left: 4,
-		pointerEvents: "none",
-		position: "absolute",
-		top: 4,
-		...e && {
-			[O.md]: { top: 2 },
-			[O.sm]: {
-				width: 12,
-				height: 12,
-				top: 2
-			},
-			[O.xs]: {
-				width: 8,
-				height: 8,
-				top: 2
-			}
-		}
-	})
-}), Z = (0, k.forwardRef)(function({ autoFocus: e, className: t, onChange: n, value: r, placeholder: i, style: a, responsive: s, ...c }, l) {
-	let u = (0, k.useRef)(null), p = S(u, l), m = xe(s);
-	return (0, k.useEffect)(() => {
-		e && u.current?.focus();
-	}, [e]), /* @__PURE__ */ (0, A.jsxs)("div", {
-		className: o({
-			[String(t)]: !0,
-			[m.div]: !0
-		}),
-		children: [
-			/* @__PURE__ */ (0, A.jsx)(f, {
-				className: m.svg,
-				fill: a?.color
-			}),
-			/* @__PURE__ */ (0, A.jsx)("input", {
-				...c,
-				style: { ...a },
-				className: m.input,
-				onChange: n,
-				placeholder: i ?? "Search...",
-				ref: p,
-				size: 1,
-				value: r
-			}),
-			/* @__PURE__ */ (0, A.jsx)(X, {
-				className: m.button,
-				"data-testid": "input-search-clear",
-				onClick: () => {
-					u.current?.focus(), n?.({ target: { value: "" } });
-				},
-				style: { display: r ? void 0 : "none" },
-				children: /* @__PURE__ */ (0, A.jsx)(d, { fill: a?.color })
-			})
-		]
-	});
-}), Q = i({ button: {
-	paddingLeft: 4,
-	paddingRight: 4
-} }), Se = ({ isAllCollapsed: e, clickCallback: t }) => {
-	let n = Q(), r = e ? g : u;
-	return /* @__PURE__ */ (0, A.jsx)(L, {
-		title: e ? "Expand all" : "Collapse all",
-		children: /* @__PURE__ */ (0, A.jsx)(X, {
-			onClick: () => t?.(!e),
-			className: n.button,
-			children: /* @__PURE__ */ (0, A.jsx)(r, {})
-		})
-	});
-}, Ce = ({ classNames: e, searchEnabled: t, searchPhrase: n, onChange: r, options: i, collapsed: a, onCollapseChange: o, responsive: s }) => {
-	if (!t) return null;
-	let c = i.filter((e) => e.type === "category"), l = c.length > 0, u = c.every((e) => a[e.key]);
-	return /* @__PURE__ */ (0, A.jsxs)("div", {
-		className: e.divSearch,
-		children: [/* @__PURE__ */ (0, A.jsx)(Z, {
-			onChange: (e) => r(e.target.value),
-			value: n,
-			responsive: s,
-			style: {
-				borderColor: "var(--search-border-color)",
-				color: "var(--search-font-color)"
-			}
-		}), l && /* @__PURE__ */ (0, A.jsx)(Se, {
-			isAllCollapsed: u,
-			clickCallback: o
-		})]
-	});
-}, $ = ({ actions: e = [], onClose: t, onCloseClick: n = t, options: r, stickyOptions: i, searchEnabled: a = !1, multiSelect: o = !1, style: s = {}, cssVariables: l, header: u, responsive: d }) => {
-	let f = c(), m = p(), h = ae(d), g = d ? ee(16, m.height, m.width) : 16, [_, v] = (0, k.useState)({}), [y, b] = (0, k.useState)({}), [x, S] = (0, k.useState)(""), C = (e) => {
-		S(e), b({});
-	}, w = {
-		...M,
-		...l
-	}, T = N(w), E = {
-		...w,
-		...T
-	}, D = (e) => {
-		let t = r.map((e) => e.key).reduce((t, n) => (t[n] = e, t), {});
-		v(t);
-	}, O = (e) => {
-		switch (e.stopPropagation(), e.key) {
-			case "ArrowDown":
-				e.target.tagName === "INPUT" && (e.preventDefault(), e.currentTarget.querySelector("[role=\"menuitem\"][tabindex]")?.focus());
-				break;
-			case "Escape":
-				t(e);
-				break;
-			case "Shift":
-			case "Tab": break;
-			default: e.currentTarget.querySelector("input")?.focus();
-		}
-	};
-	return /* @__PURE__ */ (0, A.jsxs)("div", {
-		style: {
-			...E,
-			...s
-		},
-		className: h.container,
-		onClick: (e) => {
-			e.stopPropagation();
-		},
-		onKeyDown: O,
-		children: [
-			u ? /* @__PURE__ */ (0, A.jsxs)("div", {
-				className: h.header,
-				children: [
-					" ",
-					u,
-					" "
-				]
-			}) : null,
-			i?.length ? /* @__PURE__ */ (0, A.jsx)(Y, {
-				classNames: h,
-				options: i,
-				searchPhrase: "",
-				collapsed: _,
-				setCollapsed: v,
-				openedElement: y,
-				setOpenedElement: b,
-				onCloseClick: n,
-				autoFocus: f,
-				responsive: d,
-				checkboxSize: g
-			}) : null,
-			/* @__PURE__ */ (0, A.jsx)(Ce, {
-				searchEnabled: a,
-				searchPhrase: x,
-				onChange: C,
-				classNames: h,
-				cssVariables: E,
-				options: r,
-				collapsed: _,
-				onCollapseChange: D,
-				responsive: d
-			}),
-			/* @__PURE__ */ (0, A.jsx)(Y, {
-				classNames: h,
-				options: r,
-				autoFocus: f,
-				searchPhrase: x,
-				collapsed: _,
-				setCollapsed: v,
-				openedElement: y,
-				setOpenedElement: b,
-				onCloseClick: n,
-				multiSelect: o,
-				responsive: d,
-				checkboxSize: g
-			}),
-			/* @__PURE__ */ (0, A.jsx)(ce, {
-				actions: e,
-				classNames: h
-			})
-		]
-	});
-}, we = i({
-	radioWrapper: { position: "relative" },
-	radio: (e) => ({
-		display: "none",
-		"& + label": {
-			...n.normal13,
-			color: t.grey1,
-			cursor: "inherit",
-			"&::before": {
-				content: "\"\"",
-				display: "block",
-				position: "relative",
-				width: 16,
-				height: 16,
-				borderRadius: 8,
-				border: `1px solid ${t.grey3}`,
-				backgroundColor: t.white,
-				...e && { [O.sm]: {
-					width: 12,
-					height: 12
-				} }
-			},
-			...e && { [O.sm]: {
-				lineHeight: "8px",
-				fontSize: "10px"
-			} }
-		},
-		"&:checked + label::after": {
-			content: "\"\"",
-			width: 8,
-			height: 8,
-			background: t.white,
-			position: "absolute",
-			top: 4,
-			left: 4,
-			borderRadius: 4,
-			...e && { [O.sm]: {
-				width: 6,
-				height: 6,
-				top: 3,
-				left: 3
-			} }
-		},
-		"&:checked + label::before": { backgroundColor: t.mainBrightPink }
-	})
-}), Te = ({ name: e = "", value: t, checked: n, onChange: r = () => {}, responsive: i = !1 }) => {
-	let a = we(i);
-	return /* @__PURE__ */ (0, A.jsxs)("div", {
-		className: a.radioWrapper,
-		children: [/* @__PURE__ */ (0, A.jsx)("input", {
-			className: a.radio,
-			id: `${e}-radio-button-${t}`,
-			type: "radio",
-			name: e,
-			value: t,
-			checked: !!n,
-			onChange: (e) => r?.(e.target.value)
-		}), /* @__PURE__ */ (0, A.jsx)("label", { htmlFor: `${e}-radio-button-${t}` })]
-	});
-};
-export { G as a, L as c, N as d, M as f, X as i, I as l, $ as n, H as o, ne as p, Z as r, z as s, Te as t, F as u };