@mailstep/design-system 0.8.26-beta.3 → 0.8.26-beta.5

package/ui/packages/ui/Elements/Select/Select.js

@@ -1,81 +0,0 @@
-import { useTheme 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 { i18n as n } from "../../../../node_modules/@lingui/core/dist/index.js";
-import r from "../ErrorMessage/ErrorMessage.js";
-import "../ErrorMessage/index.js";
-import { FieldLabel as i } from "../Label/Label.js";
-import "../Label/index.js";
-import a from "../SpaceAround/index.js";
-import { StyledAsyncSelect as o, StyledReactSelect as s, Wrapper as c } from "./styles.js";
-import { useStylesAndComponents as l } from "./themes/index.js";
-import { useCallback as u, useMemo as d } from "react";
-//#region packages/ui/Elements/Select/Select.tsx
-var f = t(), p = [], m = () => n._({
-	id: "select.noOptions",
-	message: "no options"
-}), ee = () => n._({
-	id: "components.dropdown.loading",
-	message: "Loading..."
-}), h = ({ label: t, name: h, value: g = "", options: _ = p, defaultOptions: v, loadOptions: y, onChange: b, onBlur: x, error: S, isInvalid: C, isLoading: w, isDarkPlaceholderText: te, spaceAround: T = !1, disabled: E, onInputChange: D, isSearchable: O, isMulti: k, className: A, useSimplifiedOptions: j = !1, showSelectAllButton: M = !1, shortValues: N = !0, shortVariant: P = "block", style: F, optionVariant: I, multiLabelVariant: L, containerVariant: R, placeholder: z, placeholderIcon: B, innerRef: ne, maxMenuHeight: V, getOptionValue: H, onIconClick: U, ...W }) => {
-	let G = !!y;
-	M && !k && console.error("CheckboxSelect incompatible props");
-	let K = u(({ options: e }) => {
-		b?.(e || []);
-	}, [b, _]), q = u(() => {
-		typeof b == "function" && b?.(p);
-	}, [b]), J = R === "search" && !B && B !== null ? "search" : B || void 0, Y = M && V ? V - 30 : V, [X, Z, re] = l(F, I, L, R, j, M), ie = G ? o : s, Q, $ = d(() => H || ((e) => e?.value), [H]);
-	Array.isArray(g) ? (Q = (v || _).filter((e) => g.includes($(e))), Q = Q?.length ? Q : null) : g !== void 0 && (Q = (v || _).find((e) => $(e) === g) || null);
-	let ae = e(), oe = d(() => y ? async (e) => await y(e) : void 0, [y]);
-	return /* @__PURE__ */ (0, f.jsxs)(a, {
-		spaceAround: T,
-		className: A,
-		children: [/* @__PURE__ */ (0, f.jsxs)(c, { children: [t && /* @__PURE__ */ (0, f.jsx)(i, {
-			htmlFor: h,
-			children: t
-		}), /* @__PURE__ */ (0, f.jsx)(ie, {
-			id: h,
-			name: h,
-			options: _,
-			loadOptions: oe,
-			defaultOptions: v,
-			value: Q,
-			onChange: b,
-			onBlur: x,
-			isDisabled: E || w,
-			isLoading: w,
-			isInvalid: C === void 0 ? !!S : C,
-			isDarkPlaceholderText: te,
-			placeholder: z || n._({
-				id: "components.dropdown.placeholder",
-				message: "Select..."
-			}),
-			styles: re,
-			theme: Z,
-			icon: J,
-			onIconClick: U,
-			hideSelectedOptions: !!(k && L !== "count"),
-			onInputChange: D,
-			isSearchable: G || O,
-			isMulti: k,
-			classNamePrefix: "react-select",
-			components: X,
-			closeMenuOnSelect: k ? !1 : void 0,
-			noOptionsMessage: m,
-			...W,
-			ref: ne,
-			tabIndex: null,
-			systemTheme: ae,
-			onCustomSelectAll: K,
-			onCustomDeselectAll: q,
-			selectAllButton: M,
-			maxMenuHeight: Y,
-			getOptionValue: H,
-			loadingMessage: ee,
-			shortValues: N,
-			shortVariant: P,
-			containerVariant: R
-		})] }), S && /* @__PURE__ */ (0, f.jsx)(r, { children: S })]
-	});
-};
-//#endregion
-export { h as default };

package/ui/packages/ui/Elements/Select/components/ChevronOption.js

@@ -1,29 +0,0 @@
-import { require_jsx_runtime as e } from "../../../../../node_modules/react/jsx-runtime.js";
-import t from "../../../Forms/Checkbox/Checkbox.js";
-import n from "../../Toggle/Toggle.js";
-import r from "./SelectedIndicator.js";
-import { components as i } from "react-select";
-//#region packages/ui/Elements/Select/components/ChevronOption.tsx
-var a = e(), o = (e) => {
-	let { theme: o, isSelected: s, selectOption: c, children: l, data: u } = e, d = o.optionVariant == "checkbox", f = o.optionVariant == "toggle";
-	return /* @__PURE__ */ (0, a.jsxs)(i.Option, {
-		...e,
-		children: [(d || f) && /* @__PURE__ */ (0, a.jsxs)(r, { children: [d && /* @__PURE__ */ (0, a.jsx)(t, {
-			checked: s,
-			size: 2,
-			readOnly: !0
-		}), f && /* @__PURE__ */ (0, a.jsx)(n, {
-			name: "",
-			onChange: c,
-			checked: s,
-			spaceAround: !1,
-			variant: "grid"
-		})] }), /* @__PURE__ */ (0, a.jsx)("span", {
-			className: "label",
-			"data-cy": `dropdownModalOption${u.index}`,
-			children: l
-		})]
-	});
-};
-//#endregion
-export { o as default };

package/ui/packages/ui/Elements/Select/components/ConnectedMenu.js

@@ -1,24 +0,0 @@
-import { require_jsx_runtime as e } from "../../../../../node_modules/react/jsx-runtime.js";
-import t from "./SelectAll.js";
-import { useMemo as n } from "react";
-import { components as r } from "react-select";
-//#region packages/ui/Elements/Select/components/ConnectedMenu.tsx
-var i = e(), a = (e) => {
-	let { theme: a } = e, { onCustomSelectAll: o, onCustomDeselectAll: s, value: c, selectAllButton: l, maxMenuHeight: u, isLoading: d } = e.selectProps, f = n(() => e.children?.map?.(({ props: { value: e, label: t } }) => ({
-		label: t,
-		value: e
-	})), [e.children]);
-	return /* @__PURE__ */ (0, i.jsxs)(r.MenuList, {
-		...e,
-		children: [l && !d && /* @__PURE__ */ (0, i.jsx)(t, {
-			theme: a,
-			onCustomSelectAll: o,
-			onCustomDeselectAll: s,
-			value: c,
-			options: f,
-			maxMenuHeight: u
-		}), e.children]
-	});
-};
-//#endregion
-export { a as default };

package/ui/packages/ui/Elements/Select/components/CountMultiValue.js

@@ -1,33 +0,0 @@
-import { th as e } from "../../../../../node_modules/@xstyled/system/dist/index.js";
-import { 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 { components as r } from "react-select";
-//#region packages/ui/Elements/Select/components/CountMultiValue.tsx
-var i = n(), a = t.div`
-  background: ${e.color("lightGray7")};
-  height: 25px;
-  justify-content: center;
-  align-items: center;
-  display: flex;
-  border-radius: md;
-  padding: 2px 6px;
-`, o = t.div`
-  white-space: nowrap;
-  position: absolute;
-  color: gray3;
-  padding-left: ${({ isFocused: e }) => e ? "8px" : "0"};
-`, s = (e) => {
-	let t = e.selectProps.shortValues, n = e.selectProps.value, s = e.selectProps.inputValue, c = e.selectProps.shortVariant, l = e.data?.value === n[0]?.value, u = e.selectProps.menuIsOpen;
-	return t ? !l || s ? null : c === "join" ? /* @__PURE__ */ (0, i.jsxs)(o, {
-		isFocused: u,
-		children: [n.length > 1 ? `(${Number(n.length)}) ` : "", n.map((e) => e.label).join(", ")]
-	}) : /* @__PURE__ */ (0, i.jsxs)(i.Fragment, { children: [/* @__PURE__ */ (0, i.jsx)(r.MultiValue, {
-		...e,
-		children: e.children
-	}), n.length > 1 ? /* @__PURE__ */ (0, i.jsxs)(a, { children: ["+", n.length - 1] }) : null] }) : /* @__PURE__ */ (0, i.jsx)(r.MultiValue, {
-		...e,
-		children: e.children
-	});
-};
-//#endregion
-export { s as default };

package/ui/packages/ui/Elements/Select/components/CustomInput.js

@@ -1,12 +0,0 @@
-import { require_jsx_runtime as e } from "../../../../../node_modules/react/jsx-runtime.js";
-import { components as t } from "react-select";
-//#region packages/ui/Elements/Select/components/CustomInput.tsx
-var n = e(), r = (e) => {
-	let { name: r } = e.selectProps, i = r ? `${r}Inp` : e.id;
-	return /* @__PURE__ */ (0, n.jsx)(t.Input, {
-		...e,
-		"data-cy": i
-	});
-};
-//#endregion
-export { r as default };

package/ui/packages/ui/Elements/Select/components/DropdownIndicator.js

@@ -1,28 +0,0 @@
-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 { ArrowDown as n } from "../../Icon/icons/ArrowDown.js";
-import { ArrowUp as r } from "../../Icon/icons/ArrowUp.js";
-import { components as i } from "react-select";
-//#region packages/ui/Elements/Select/components/DropdownIndicator.tsx
-var a = t(), o = e.div`
-  align-self: center;
-  display: flex;
-`, s = (e) => {
-	let { menuIsOpen: t, name: s } = e.selectProps, c = e.theme.colors.placeholderTextColor;
-	return /* @__PURE__ */ (0, a.jsx)(i.DropdownIndicator, {
-		...e,
-		children: /* @__PURE__ */ (0, a.jsx)(o, {
-			className: "chevron",
-			"data-cy": `${s || ""}ChevronBtn`,
-			children: t ? /* @__PURE__ */ (0, a.jsx)(r, {
-				width: "16px",
-				stroke: c
-			}) : /* @__PURE__ */ (0, a.jsx)(n, {
-				width: "16px",
-				stroke: c
-			})
-		})
-	});
-};
-//#endregion
-export { s as default };

package/ui/packages/ui/Elements/Select/components/IconValueContainer.js

@@ -1,26 +0,0 @@
-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 "../../Icon/Icon.js";
-import { components as r } from "react-select";
-//#region packages/ui/Elements/Select/components/IconValueContainer.tsx
-var i = t(), a = e.div`
-  padding-left: 7px;
-  margin-right: -3px;
-  align-self: center;
-  & > * {
-    color: ${({ hasValue: e }) => e ? "black" : "#a3b3c1"};
-  }
-`, o = (e) => {
-	let { children: t, ...o } = e, s = o.selectProps?.icon, c = o.hasValue, l = o.selectProps?.onIconClick;
-	return /* @__PURE__ */ (0, i.jsxs)(i.Fragment, { children: [s && /* @__PURE__ */ (0, i.jsx)(a, {
-		className: "inputIcon",
-		hasValue: c,
-		onMouseDown: l,
-		children: /* @__PURE__ */ (0, i.jsx)(n, { icon: s })
-	}), /* @__PURE__ */ (0, i.jsx)(r.ValueContainer, {
-		...o,
-		children: t
-	})] });
-};
-//#endregion
-export { o as default };

package/ui/packages/ui/Elements/Select/components/SelectAll.js

@@ -1,73 +0,0 @@
-import { th as e } from "../../../../../node_modules/@xstyled/system/dist/index.js";
-import { 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 { Trans as r } from "../../../../../node_modules/@lingui/react/dist/index.js";
-import i from "../../../Forms/Checkbox/Checkbox.js";
-import a from "../../Toggle/Toggle.js";
-import o from "./SelectedIndicator.js";
-import { useCallback as s, useEffect as c, useRef as l, useState as u } from "react";
-//#region packages/ui/Elements/Select/components/SelectAll.tsx
-var d = n(), f = t.div`
-  display: flex;
-  margin: 0px 2px 1px 0px;
-  padding: ${({ additionalPadding: e }) => e ? "8px 27px 8px 10px" : "10px 10px"};
-  font-weight: 400;
-  background-color: ${({ isSelected: t }) => t ? e.color("red20") : "transparent"};
-  color: ${({ isSelected: t }) => t ? e.color("red1") : e.color("textPrimary")};
-  border-radius: 6px;
-  height: 36px;
-  cursor: pointer;
-
-  :hover {
-    background-color: ${({ isSelected: t }) => t ? e.color("red30") : e.color("bgLightGray1")};
-  }
-`, p = ({ onCustomSelectAll: e, onCustomDeselectAll: t, value: n, options: p, maxMenuHeight: m, theme: h }) => {
-	let g = h.optionVariant === "checkbox", _ = h.optionVariant === "toggle", v = l(null), [y, b] = u(!1), [x, S] = u(!1), C = s(() => {
-		x ? x && (S(!1), t()) : (S(!0), e({ options: p }));
-	}, [
-		x,
-		t,
-		e,
-		p
-	]);
-	return c(() => {
-		v?.current?.offsetHeight && b(v.current.offsetHeight * (p?.length || 0) > m);
-	}, [
-		y,
-		m,
-		p?.length,
-		n
-	]), c(() => {
-		n && Array.isArray(n) && (p?.length === n.length && S(!0), p?.length !== n.length && S(!1));
-	}, [
-		m,
-		p?.length,
-		n
-	]), p?.length ? /* @__PURE__ */ (0, d.jsxs)(f, {
-		isSelected: x,
-		onClick: C,
-		ref: v,
-		additionalPadding: y,
-		children: [
-			(g || _) && /* @__PURE__ */ (0, d.jsxs)(o, { children: [g && /* @__PURE__ */ (0, d.jsx)(i, {
-				checked: x,
-				size: 2,
-				readOnly: !0
-			}), _ && /* @__PURE__ */ (0, d.jsx)(a, {
-				name: "",
-				checked: x,
-				spaceAround: !1,
-				variant: "grid"
-			})] }),
-			/* @__PURE__ */ (0, d.jsx)(r, {
-				id: "datagrid.filterCell.selectAllLabel",
-				message: "select all"
-			}),
-			" (",
-			p?.length,
-			")"
-		]
-	}) : null;
-};
-//#endregion
-export { p as default };

package/ui/packages/ui/Elements/Select/components/SelectedIndicator.js

@@ -1,7 +0,0 @@
-import { styled as e } from "../../../../../node_modules/@xstyled/styled-components/dist/index.js";
-//#region packages/ui/Elements/Select/components/SelectedIndicator.tsx
-var t = e.div`
-  padding-right: 12px;
-`;
-//#endregion
-export { t as default };

package/ui/packages/ui/Elements/Select/components/SimplifiedOption.js

@@ -1,15 +0,0 @@
-import { require_jsx_runtime as e } from "../../../../../node_modules/react/jsx-runtime.js";
-import { memo as t, useCallback as n } from "react";
-//#region packages/ui/Elements/Select/components/SimplifiedOption.tsx
-var r = e(), i = t((e) => {
-	let t = e.getStyles("option", e), { data: i, selectOption: a, innerProps: o } = e;
-	return /* @__PURE__ */ (0, r.jsx)("div", {
-		style: t,
-		onClick: n(() => a(i), [i, a]),
-		onMouseOver: o.onMouseOver,
-		onMouseMove: o.onMouseMove,
-		children: e.label
-	});
-}, (e, t) => e.isFocused === t.isFocused && e.data?.label === t.data?.label);
-//#endregion
-export { i as default };

package/ui/packages/ui/Elements/Select/index.js

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

package/ui/packages/ui/Elements/Select/styles.js

@@ -1,17 +0,0 @@
-import { system as e } from "../../../../node_modules/@xstyled/system/dist/index.js";
-import { styled as t } from "../../../../node_modules/@xstyled/styled-components/dist/index.js";
-import { AsyncSelect$1 as n } from "../../../../node_modules/react-select/async/dist/react-select-async.esm.js";
-import r from "react-select";
-//#region packages/ui/Elements/Select/styles.ts
-var i = t.div`
-  display: flex;
-  flex-direction: column;
-`, a = t(r)`
-  ${e};
-  font-size: 14px;
-`, o = t(n)`
-  ${e};
-  font-size: 14px;
-`;
-//#endregion
-export { o as StyledAsyncSelect, a as StyledReactSelect, i as Wrapper };

package/ui/packages/ui/Elements/Select/themes/index.js

@@ -1,34 +0,0 @@
-import { useTheme as e } from "../../../../../node_modules/@xstyled/styled-components/dist/index.js";
-import t from "../components/ChevronOption.js";
-import n from "../components/ConnectedMenu.js";
-import r from "../components/CountMultiValue.js";
-import i from "../components/CustomInput.js";
-import a from "../components/DropdownIndicator.js";
-import o from "../components/IconValueContainer.js";
-import s from "../components/SimplifiedOption.js";
-import { CustomStyles as c, getCustomTheme as l } from "./selectStyles.js";
-import { useMemo as u } from "react";
-//#region packages/ui/Elements/Select/themes/index.ts
-var d = (d = "form", f = "default", p = "default", m = "default", h = !1, g = !1) => {
-	let _ = e();
-	return u(() => {
-		let e = { ValueContainer: o };
-		e.DropdownIndicator = a, p === "count" && (e.MultiValue = r), m === "search" && (e.DropdownIndicator = null), g && (e.MenuList = n), e.Input = i;
-		let u = l(_, f, d === "gridFilter"), v = c;
-		return e.Option = t, h && (e.Option = s), [
-			e,
-			u,
-			v
-		];
-	}, [
-		p,
-		m,
-		g,
-		d,
-		h,
-		_,
-		f
-	]);
-};
-//#endregion
-export { d as useStylesAndComponents };

package/ui/packages/ui/Elements/Select/themes/selectStyles.js

@@ -1,185 +0,0 @@
-import { th as e } from "../../../../../node_modules/@xstyled/system/dist/index.js";
-//#region packages/ui/Elements/Select/themes/selectStyles.ts
-var t = {
-	control: (e, { selectProps: t, theme: n, isFocused: r, isDisabled: i }) => {
-		let a = n.colors;
-		return {
-			...e,
-			borderColor: t.isInvalid ? a.primary : r ? a.inputTextColor : a.inputBorderColor,
-			backgroundColor: i ? a.menuHoverBackgroundColor : a.whiteBackgroundColor,
-			boxShadow: n.focusBoxShadow,
-			borderRadius: n.borderRadius,
-			"& input": {
-				fontWeight: n.textWeightNormal,
-				fontFamily: n.font
-			},
-			"&:hover": {
-				...e["&:hover"] ?? {},
-				borderColor: a.inputBorderHoverColor
-			},
-			fontSize: "14px",
-			minWidth: "min-content",
-			".inputIcon": { color: i ? a.defaultControlColor : t.value ? a.inputTextColor : a.defaultControlColor }
-		};
-	},
-	valueContainer: (e, { theme: t }) => ({
-		...e,
-		width: "50px",
-		paddingLeft: "7px",
-		flexWrap: t.flexWrap
-	}),
-	singleValue: (e, { selectProps: t, theme: n, isDisabled: r }) => ({
-		...e,
-		position: "absolute",
-		top: "50%",
-		transform: "translateY(-50%)",
-		color: t.isInvalid ? n.colors.primary : r ? n.colors.disabledTextColor : n.colors.inputTextColor,
-		fontSize: "14px",
-		fontWeight: n.textWeightNormal
-	}),
-	multiValue: (e, t) => {
-		let { theme: n } = t;
-		return {
-			...e,
-			color: n.colors.inputTextColor,
-			fontWeight: n.textWeightNormal,
-			backgroundColor: "#E7EBEF",
-			borderRadius: "4px",
-			"& svg": { color: n.colors.inputTextColor },
-			" > div": { fontSize: "12px" }
-		};
-	},
-	multiValueLabel: (e) => ({
-		...e,
-		fontSize: "unset",
-		padding: "5px"
-	}),
-	multiValueRemove: (e, { theme: t }) => ({
-		...e,
-		color: t.colors.inputBorderColor
-	}),
-	placeholder: (e, t) => {
-		let { theme: n, selectProps: r } = t;
-		return {
-			...e,
-			fontSize: "14px",
-			fontWeight: n.textWeightNormal,
-			textOverflow: "ellipsis",
-			whiteSpace: "nowrap",
-			overflow: "hidden",
-			maxWidth: "calc(100% - 8px)",
-			color: r.isDarkPlaceholderText ? n.colors.inputTextColor : n.colors.placeholderTextColor
-		};
-	},
-	loadingMessage: (e, { theme: t }) => ({
-		...e,
-		color: t.colors.optionTextColor
-	}),
-	noOptionsMessage: (e, { theme: t }) => ({
-		...e,
-		color: t.colors.optionTextColor
-	}),
-	input: (e, { theme: t }) => ({
-		...e,
-		color: t.colors.inputTextColor
-	}),
-	option: (t, { isSelected: n, theme: r, isDisabled: i, selectProps: a }) => {
-		let o = r.colors.optionTextColor;
-		return {
-			color: n ? r.colors.primary : o,
-			backgroundColor: n ? r.colors.activeOptionBackground : void 0,
-			fontWeight: r.textWeightNormal,
-			fontSize: "14px",
-			cursor: i ? "default" : "pointer",
-			display: "flex",
-			flexDirection: "row",
-			alignItems: "center",
-			padding: "7px 10px",
-			minHeight: "36px",
-			marginRight: "4px",
-			marginBottom: "2px",
-			lineHeight: "22px",
-			borderRadius: e.radius("ml")({ theme: a?.systemTheme }),
-			"&:hover": { backgroundColor: n ? r.colors.hoverToActiveOptionBackground : i ? void 0 : r.colors.menuHoverBackgroundColor }
-		};
-	},
-	menu: (e, t) => {
-		let { theme: n } = t;
-		return {
-			...e,
-			boxShadow: "0 2px 20px 0 rgba(0, 0, 0, 0.10);",
-			marginTop: "4px",
-			paddingTop: "0",
-			borderRadius: "10px",
-			zIndex: 3,
-			minWidth: "max-content",
-			backgroundColor: n.colors.whiteBackgroundColor
-		};
-	},
-	menuList: (e, { theme: t }) => ({
-		...e,
-		margin: "8px 4px 8px 8px",
-		"::-webkit-scrollbar-thumb": {
-			border: "none",
-			borderRadius: "4px",
-			height: "47px",
-			backgroundColor: t.colors.defaultControlColor,
-			"&:hover": { backgroundColor: t.colors.dropdownIndicatorColor }
-		},
-		"::-webkit-scrollbar": { width: "10px" },
-		"::-webkit-scrollbar-track": {
-			backgroundColor: t.colors.menuHoverBackgroundColor,
-			borderRadius: "6px"
-		}
-	}),
-	dropdownIndicator: (e) => ({
-		...e,
-		justifyContent: "center",
-		alignItems: "center",
-		padding: "0px 7px 0px 0px"
-	}),
-	clearIndicator: (e, t) => {
-		let { theme: n, selectProps: r } = t;
-		return {
-			...e,
-			justifyContent: "center",
-			alignItems: "center",
-			padding: n.narrowIndicators && r.containerVariant !== "search" ? "0px" : "0px 4px",
-			color: n.colors.clearIndicatorColor,
-			cursor: "pointer"
-		};
-	},
-	indicatorSeparator: () => ({ display: "none" })
-}, n = (t, n, r) => {
-	let i = e.color("blue2")({ theme: t }), a = {
-		primary: e.color("red1")({ theme: t }),
-		inputTextColor: i,
-		whiteBackgroundColor: e.color("white")({ theme: t }),
-		optionTextColor: e.color("blue2")({ theme: t }),
-		menuHoverBackgroundColor: e.color("bgLightGray1")({ theme: t }),
-		inputDisabledColor: e.color("lightGray1")({ theme: t }),
-		inputBorderColor: e.color("lightGray3")({ theme: t }),
-		placeholderTextColor: e.color("lightGray3")({ theme: t }),
-		clearIndicatorColor: e.color("lightGray4")({ theme: t }),
-		defaultControlColor: e.color("lightGray5")({ theme: t }),
-		disabledTextColor: e.color("lightGray6")({ theme: t }),
-		dropdownIndicatorColor: e.color("gray1")({ theme: t }),
-		inputBorderHoverColor: e.color("gray5")({ theme: t }),
-		activeOptionBackground: e.color("red20")({ theme: t }),
-		hoverToActiveOptionBackground: e.color("red30")({ theme: t })
-	};
-	return (i) => ({
-		...i,
-		colors: a,
-		focusBoxShadow: null,
-		height: "38px",
-		flexWrap: r ? "nowrap" : "wrap",
-		textWeightNormal: e.fontWeight("normal")({ theme: t }),
-		optionVariant: n,
-		borderRadius: e.radius("lg")({ theme: t }),
-		font: e.font("primary")({ theme: t }),
-		narrowIndicators: !!r
-	});
-};
-//#endregion
-export { t as CustomStyles, n as getCustomTheme };

package/ui/packages/ui/Elements/SimpleLink/SimpleLink.js

@@ -1,35 +0,0 @@
-import { css as e, styled as t } from "../../../../node_modules/@xstyled/styled-components/dist/index.js";
-import { Link as n } from "../../../../node_modules/react-router-dom/esm/react-router-dom.js";
-//#region packages/ui/Elements/SimpleLink/SimpleLink.tsx
-var r = t(n)`
-  color: inherit;
-  cursor: pointer;
-
-  :visited {
-    color: inherit;
-  }
-  :hover {
-    color: inherit;
-  }
-  :active {
-    color: inherit;
-  }
-  :focus {
-    outline: none;
-  }
-
-  ${({ disabled: t }) => t ? e`
-          pointer-events: none;
-          opacity: 0.5;
-        ` : null}
-
-  ${({ $decorate: t }) => t ? e`
-          text-decoration: underline;
-        ` : null}
-
-  ${({ variant: t }) => t ? e`
-          font-weight: ${t};
-        ` : null}
-`;
-//#endregion
-export { r as default };

package/ui/packages/ui/Elements/SimpleLink/index.js

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