chop-logic-components 4.2.0 → 4.3.0

package/dist/components/hocs/with-figure-caption/Figure.css

@@ -1 +1 @@
-.cl-figure{margin:0;display:block}.cl-figure__caption{text-align:center;font-family:var(--cl-core-font);padding-top:var(--cl-s-gap);color:var(--cl-base-font-color);font-size:var(--cl-typography-small-mobile)}@media (width>=640px){.cl-figure__caption{font-size:var(--cl-typography-small-tablet)}}@media (width>=1024px){.cl-figure__caption{font-size:var(--cl-typography-small-desktop)}}
+.cl-figure{border-radius:var(--cl-border-radius);margin:0;display:block}.cl-figure__caption{text-align:center;font-family:var(--cl-core-font);padding-top:var(--cl-s-gap);color:var(--cl-base-font-color);font-size:var(--cl-typography-small-mobile)}@media (width>=640px){.cl-figure__caption{font-size:var(--cl-typography-small-tablet)}}@media (width>=1024px){.cl-figure__caption{font-size:var(--cl-typography-small-desktop)}}

package/dist/components/molecules/alert/Alert2.js

@@ -1,8 +1,8 @@
-import { getClassName as e } from "../../../utils/get-class-name.js";
-import { AlertMode as t } from "../../../enums/alert-mode.js";
-import { ButtonView as n } from "../../../enums/button-view.js";
-import { ElementSize as r } from "../../../enums/element-size.js";
-import { IconName as i } from "../../../enums/icon-name.js";
+import { AlertMode as e } from "../../../enums/alert-mode.js";
+import { ButtonView as t } from "../../../enums/button-view.js";
+import { ElementSize as n } from "../../../enums/element-size.js";
+import { IconName as r } from "../../../enums/icon-name.js";
+import { getClassName as i } from "../../../utils/get-class-name.js";
 import a from "../../atoms/button/Button2.js";
 import o from "../../atoms/header/Header2.js";
 import s from "../../atoms/portal/Portal.js";
@@ -12,11 +12,11 @@ import { useRemainingTimer as u } from "../../../hooks/use-remaining-timer/use-r
 import './Alert.css';/* empty css      */
 import { getAlertIcon as d, getAlertTitle as f } from "./Alert.helpers.js";
 import { AlertProgressBar as p } from "./AlertProgressBar.js";
-import { jsx as m, jsxs as h } from "react/jsx-runtime";
-import { useRef as g } from "react";
+import { useRef as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
 //#region src/components/molecules/alert/Alert.tsx
-var _ = ({ isOpened: _, onClose: v, title: y, message: b, mode: x = t.Info, icon: S, autoClose: C = !1, autoCloseDelay: w = 3e3, ...T }) => {
-	let E = l(_), D = E && !_, O = g(null), k = c(O, E), A = !C, j = u({
+var _ = ({ isOpened: _, onClose: v, title: y, message: b, mode: x = e.Info, icon: S, autoClose: C = !1, autoCloseDelay: w = 3e3, ...T }) => {
+	let E = l(_), D = E && !_, O = m(null), k = c(O, E), A = !C, j = u({
 		isOpened: E,
 		isHovered: k,
 		onClose: v,
@@ -25,36 +25,36 @@ var _ = ({ isOpened: _, onClose: v, title: y, message: b, mode: x = t.Info, icon
 	});
 	if (!E) return null;
 	let M = f(x, y), N = d(x, S);
-	return /* @__PURE__ */ m(s, { children: /* @__PURE__ */ m("div", {
+	return /* @__PURE__ */ h(s, { children: /* @__PURE__ */ h("div", {
 		ref: O,
-		className: e([
+		className: i([
 			"cl-alert",
 			`cl-alert_${x.toLowerCase()}`,
 			{ "cl-alert_closing": D }
 		]),
-		children: /* @__PURE__ */ h("div", {
+		children: /* @__PURE__ */ g("div", {
 			...T,
 			className: "cl-alert__content",
 			children: [
-				A && /* @__PURE__ */ m(a, {
-					icon: i.X,
-					view: n.Icon,
-					iconSize: r.Medium,
+				A && /* @__PURE__ */ h(a, {
+					icon: r.X,
+					view: t.Icon,
+					iconSize: n.Medium,
 					label: "Close alert",
 					onClick: v,
 					className: "cl-alert__button"
 				}),
-				/* @__PURE__ */ m("header", { children: /* @__PURE__ */ m(o, {
+				/* @__PURE__ */ h("header", { children: /* @__PURE__ */ h(o, {
 					icon: N,
 					as: "h3",
 					className: "cl-alert__header",
 					children: M
 				}) }),
-				/* @__PURE__ */ m("p", {
+				/* @__PURE__ */ h("p", {
 					className: "cl-alert__message",
 					children: b
 				}),
-				C && /* @__PURE__ */ m(p, { remainingPercentage: j })
+				C && /* @__PURE__ */ h(p, { remainingPercentage: j })
 			]
 		})
 	}) });

package/dist/components/molecules/checkbox/CheckboxStateful.js

@@ -1,6 +1,6 @@
-import { getClassName as e } from "../../../utils/get-class-name.js";
-import { ElementSize as t } from "../../../enums/element-size.js";
-import { IconName as n } from "../../../enums/icon-name.js";
+import { ElementSize as e } from "../../../enums/element-size.js";
+import { IconName as t } from "../../../enums/icon-name.js";
+import { getClassName as n } from "../../../utils/get-class-name.js";
 import r from "../../atoms/label/Label2.js";
 import { useElementIds as i } from "../../../hooks/use-element-ids/use-element-ids.js";
 import { useCheckboxController as a } from "./Checkbox.controller.js";
@@ -16,7 +16,7 @@ var c = ({ name: c, label: l, disabled: u, noLabel: d, required: f = !1, iconPos
 	return /* @__PURE__ */ s("div", {
 		style: v,
 		tabIndex: y,
-		className: e([
+		className: n([
 			"cl-checkbox",
 			_,
 			{
@@ -38,9 +38,9 @@ var c = ({ name: c, label: l, disabled: u, noLabel: d, required: f = !1, iconPos
 			required: f,
 			inputId: S,
 			isTextHidden: d,
-			icon: x ? n.CheckSquare : n.Square,
+			icon: x ? t.CheckSquare : t.Square,
 			iconPosition: p,
-			iconSize: t.Medium
+			iconSize: e.Medium
 		})]
 	});
 };

package/dist/components/molecules/checkbox/CheckboxStateless.js

@@ -1,6 +1,6 @@
-import { getClassName as e } from "../../../utils/get-class-name.js";
-import { ElementSize as t } from "../../../enums/element-size.js";
-import { IconName as n } from "../../../enums/icon-name.js";
+import { ElementSize as e } from "../../../enums/element-size.js";
+import { IconName as t } from "../../../enums/icon-name.js";
+import { getClassName as n } from "../../../utils/get-class-name.js";
 import r from "../../atoms/label/Label2.js";
 import './Checkbox.css';/* empty css         */
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
@@ -10,7 +10,7 @@ var o = ({ name: o, label: s, disabled: c, noLabel: l, required: u = !1, iconPos
 	return /* @__PURE__ */ a("div", {
 		style: g,
 		tabIndex: _,
-		className: e([
+		className: n([
 			"cl-checkbox",
 			h,
 			{
@@ -32,9 +32,9 @@ var o = ({ name: o, label: s, disabled: c, noLabel: l, required: u = !1, iconPos
 			required: u,
 			inputId: v,
 			isTextHidden: l,
-			icon: f ? n.CheckSquare : n.Square,
+			icon: f ? t.CheckSquare : t.Square,
 			iconPosition: d,
-			iconSize: t.Medium
+			iconSize: e.Medium
 		})]
 	});
 };

package/dist/components/molecules/multi-select/MultiSelect.Combobox.js

@@ -1,13 +1,13 @@
-import { getClassName as e } from "../../../utils/get-class-name.js";
-import { ElementSize as t } from "../../../enums/element-size.js";
-import { IconName as n } from "../../../enums/icon-name.js";
+import { ElementSize as e } from "../../../enums/element-size.js";
+import { IconName as t } from "../../../enums/icon-name.js";
+import { getClassName as n } from "../../../utils/get-class-name.js";
 import r from "../../atoms/icon/Icon2.js";
 import '../select/combobox/Combobox.css';/* empty css                          */
 import { MultiSelectComboboxSelectedValues as i } from "./MultiSelectComboboxSelectedValues.js";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
 //#region src/components/molecules/multi-select/MultiSelect.Combobox.tsx
 var s = ({ opened: s, onClick: c, comboboxId: l, dropdownId: u, name: d, placeholder: f, disabled: p, required: m, values: h }) => {
-	let g = h?.filter((e) => e.selected).map((e) => e.id), _ = e(["cl-select-combobox__icon", { "cl-select-combobox__icon_opened": s }]);
+	let g = h?.filter((e) => e.selected).map((e) => e.id), _ = n(["cl-select-combobox__icon", { "cl-select-combobox__icon_opened": s }]);
 	return /* @__PURE__ */ o("button", {
 		type: "button",
 		name: d,
@@ -25,9 +25,9 @@ var s = ({ opened: s, onClick: c, comboboxId: l, dropdownId: u, name: d, placeho
 			values: h,
 			placeholder: f
 		}), /* @__PURE__ */ a(r, {
-			name: n.ChevronDown,
+			name: t.ChevronDown,
 			className: _,
-			size: t.Small
+			size: e.Small
 		})]
 	});
 };

package/dist/components/molecules/multi-select/MultiSelect.js

@@ -7,11 +7,11 @@ import '../select/Select.css';/* empty css               */
 import { MultiSelectCombobox as a } from "./MultiSelect.Combobox.js";
 import { useMultiSelectController as o } from "./MultiSelect.controller.js";
 import { MultiSelectDropdown as s } from "./MultiSelect.Dropdown.js";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { useRef as u } from "react";
+import { useRef as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/components/molecules/multi-select/MultiSelect.tsx
 var d = ({ options: d, name: f, label: p, required: m = !1, placeholder: h = "Not selected", disabled: g = !1, onChange: _, defaultValue: v, id: y, className: b, ...x }) => {
-	let S = u(null), { elementId: C, dropdownId: w } = r(y), { handleClose: T, handleSelect: E, handleToggle: D, opened: O, values: k } = o({
+	let S = c(null), { elementId: C, dropdownId: w } = r(y), { handleClose: T, handleSelect: E, handleToggle: D, opened: O, values: k } = o({
 		name: f,
 		options: d,
 		defaultValue: v,
@@ -24,18 +24,18 @@ var d = ({ options: d, name: f, label: p, required: m = !1, placeholder: h = "No
 		keyCode: "Escape",
 		ref: S,
 		onKeyPress: T
-	}), /* @__PURE__ */ l("div", {
+	}), /* @__PURE__ */ u("div", {
 		ref: S,
 		...x,
 		className: A,
 		children: [
-			/* @__PURE__ */ c(t, {
+			/* @__PURE__ */ l(t, {
 				label: p,
 				required: m,
 				inputId: C,
 				disabled: g
 			}),
-			/* @__PURE__ */ c(a, {
+			/* @__PURE__ */ l(a, {
 				name: f,
 				opened: O,
 				comboboxId: C,
@@ -46,7 +46,7 @@ var d = ({ options: d, name: f, label: p, required: m = !1, placeholder: h = "No
 				disabled: g,
 				required: m
 			}),
-			/* @__PURE__ */ c(s, {
+			/* @__PURE__ */ l(s, {
 				options: k,
 				opened: O,
 				onClose: T,

package/dist/components/molecules/multi-select/Option.js

@@ -1,12 +1,12 @@
-import { getClassName as e } from "../../../utils/get-class-name.js";
-import { ElementSize as t } from "../../../enums/element-size.js";
-import { IconName as n } from "../../../enums/icon-name.js";
+import { ElementSize as e } from "../../../enums/element-size.js";
+import { IconName as t } from "../../../enums/icon-name.js";
+import { getClassName as n } from "../../../utils/get-class-name.js";
 import r from "../../atoms/icon/Icon2.js";
 import '../select/option/Option.css';/* empty css                      */
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/molecules/multi-select/Option.tsx
 var o = ({ value: o, onSelect: s }) => {
-	let { id: c, label: l, selected: u } = o, d = e([
+	let { id: c, label: l, selected: u } = o, d = n([
 		"cl-select-option",
 		"cl-select-option_multi",
 		{ "cl-select-option_selected": u }
@@ -29,11 +29,11 @@ var o = ({ value: o, onSelect: s }) => {
 		onClick: () => s(c),
 		className: d,
 		children: [u ? /* @__PURE__ */ i(r, {
-			name: n.CheckSquare,
-			size: t.Small
+			name: t.CheckSquare,
+			size: e.Small
 		}) : /* @__PURE__ */ i(r, {
-			name: n.Square,
-			size: t.Small
+			name: t.Square,
+			size: e.Small
 		}), /* @__PURE__ */ i("span", { children: l })]
 	});
 };

package/dist/components/molecules/numeric-input/NumericInputStateful.js

@@ -1,6 +1,6 @@
-import { getClassName as e } from "../../../utils/get-class-name.js";
-import { ButtonView as t } from "../../../enums/button-view.js";
-import { IconName as n } from "../../../enums/icon-name.js";
+import { ButtonView as e } from "../../../enums/button-view.js";
+import { IconName as t } from "../../../enums/icon-name.js";
+import { getClassName as n } from "../../../utils/get-class-name.js";
 import r from "../../atoms/button/Button2.js";
 import i from "../../atoms/error-message/ErrorMessage2.js";
 import a from "../../atoms/input/Input2.js";
@@ -25,7 +25,7 @@ var d = ({ name: d, label: f, errorMessage: p, onChange: m, onBlur: h, onFocus:
 	});
 	return /* @__PURE__ */ u("div", {
 		style: j,
-		className: e(["cl-numeric-input", A]),
+		className: n(["cl-numeric-input", A]),
 		children: [/* @__PURE__ */ l(o, {
 			label: f,
 			required: T,
@@ -50,15 +50,15 @@ var d = ({ name: d, label: f, errorMessage: p, onChange: m, onBlur: h, onFocus:
 			tabIndex: C,
 			children: [D && /* @__PURE__ */ u("span", { children: [/* @__PURE__ */ l(r, {
 				onClick: L,
-				view: t.Inner,
+				view: e.Inner,
 				label: `Decrement value for ${f}`,
-				icon: n.ChevronLeft,
+				icon: t.ChevronLeft,
 				disabled: w
 			}), /* @__PURE__ */ l(r, {
 				onClick: R,
-				view: t.Inner,
+				view: e.Inner,
 				label: `Increment value for ${f}`,
-				icon: n.ChevronRight,
+				icon: t.ChevronRight,
 				disabled: w
 			})] }), /* @__PURE__ */ l(i, {
 				errorId: N,

package/dist/components/molecules/numeric-input/NumericInputStateless.js

@@ -1,6 +1,6 @@
-import { getClassName as e } from "../../../utils/get-class-name.js";
-import { ButtonView as t } from "../../../enums/button-view.js";
-import { IconName as n } from "../../../enums/icon-name.js";
+import { ButtonView as e } from "../../../enums/button-view.js";
+import { IconName as t } from "../../../enums/icon-name.js";
+import { getClassName as n } from "../../../utils/get-class-name.js";
 import r from "../../atoms/button/Button2.js";
 import i from "../../atoms/error-message/ErrorMessage2.js";
 import a from "../../atoms/input/Input2.js";
@@ -12,7 +12,7 @@ var l = ({ name: l, label: u, errorMessage: d, onChange: f, onBlur: p, onFocus:
 	let A = y ?? `numeric-input-${l}`, j = `${l}-error`;
 	return /* @__PURE__ */ c("div", {
 		style: k,
-		className: e(["cl-numeric-input", E]),
+		className: n(["cl-numeric-input", E]),
 		children: [/* @__PURE__ */ s(o, {
 			label: u,
 			required: S,
@@ -38,15 +38,15 @@ var l = ({ name: l, label: u, errorMessage: d, onChange: f, onBlur: p, onFocus:
 			tabIndex: b,
 			children: [w && /* @__PURE__ */ c("span", { children: [/* @__PURE__ */ s(r, {
 				onClick: g,
-				view: t.Inner,
+				view: e.Inner,
 				label: `Decrement value for ${u}`,
-				icon: n.ChevronLeft,
+				icon: t.ChevronLeft,
 				disabled: x
 			}), /* @__PURE__ */ s(r, {
 				onClick: h,
-				view: t.Inner,
+				view: e.Inner,
 				label: `Increment value for ${u}`,
-				icon: n.ChevronRight,
+				icon: t.ChevronRight,
 				disabled: x
 			})] }), /* @__PURE__ */ s(i, {
 				errorId: j,

package/dist/components/molecules/search/Search2.js

@@ -1,17 +1,17 @@
-import { getClassName as e } from "../../../utils/get-class-name.js";
-import { ButtonView as t } from "../../../enums/button-view.js";
-import { IconName as n } from "../../../enums/icon-name.js";
+import { ButtonView as e } from "../../../enums/button-view.js";
+import { IconName as t } from "../../../enums/icon-name.js";
+import { getClassName as n } from "../../../utils/get-class-name.js";
 import r from "../../atoms/button/Button2.js";
 import i from "../../atoms/input/Input2.js";
 import a from "../../atoms/label/Label2.js";
 import { useElementIds as o } from "../../../hooks/use-element-ids/use-element-ids.js";
 import './Search.css';/* empty css       */
 import { useSearchController as s } from "./Search.controller.js";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { useRef as u } from "react";
+import { useRef as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/components/molecules/search/Search.tsx
 var d = ({ label: d, onSearch: f, onBlur: p, onFocus: m, onClear: h, id: g, tabIndex: _, className: v, maxLength: y = 50, minLength: b = 1, searchMode: x = "automatic", name: S = "q", placeholder: C = "Type to search...", disabled: w = !1, clearable: T = !0, spellCheck: E = !1, autoComplete: D = "off", debounceDelay: O = 500, required: k, ...A }) => {
-	let { elementId: j } = o(g), M = u(null), N = e(["cl-search", v]), { searchValue: P, isSearchButtonVisible: F, isLabelIconVisible: I, isClearButtonVisible: L, isSearchValueValid: R, handleChange: z, handleClear: B, handleSearchClick: V, handleKeyDown: H } = s({
+	let { elementId: j } = o(g), M = c(null), N = n(["cl-search", v]), { searchValue: P, isSearchButtonVisible: F, isLabelIconVisible: I, isClearButtonVisible: L, isSearchValueValid: R, handleChange: z, handleClear: B, handleSearchClick: V, handleKeyDown: H } = s({
 		onSearch: f,
 		onClear: h,
 		maxLength: y,
@@ -21,16 +21,16 @@ var d = ({ label: d, onSearch: f, onBlur: p, onFocus: m, onClear: h, id: g, tabI
 	}), U = () => {
 		B(), M.current && M.current.focus();
 	};
-	return /* @__PURE__ */ l("div", {
+	return /* @__PURE__ */ u("div", {
 		...A,
 		className: N,
-		children: [/* @__PURE__ */ c(a, {
+		children: [/* @__PURE__ */ l(a, {
 			label: d,
 			required: !!k,
 			inputId: j,
-			icon: I ? n.Search : void 0,
+			icon: I ? t.Search : void 0,
 			iconPosition: I ? "left" : void 0
-		}), /* @__PURE__ */ c(i, {
+		}), /* @__PURE__ */ l(i, {
 			ref: M,
 			id: j,
 			name: S,
@@ -48,16 +48,16 @@ var d = ({ label: d, onSearch: f, onBlur: p, onFocus: m, onClear: h, id: g, tabI
 			spellCheck: E,
 			tabIndex: _,
 			required: k,
-			children: /* @__PURE__ */ l("span", { children: [T && L && /* @__PURE__ */ c(r, {
-				view: t.Inner,
+			children: /* @__PURE__ */ u("span", { children: [T && L && /* @__PURE__ */ l(r, {
+				view: e.Inner,
 				onClick: U,
 				label: `Clear search input for ${d}`,
-				icon: n.Delete
-			}), F && /* @__PURE__ */ c(r, {
-				view: t.Inner,
+				icon: t.Delete
+			}), F && /* @__PURE__ */ l(r, {
+				view: e.Inner,
 				onClick: V,
 				label: "Perform search",
-				icon: n.Search,
+				icon: t.Search,
 				disabled: w || !R
 			})] })
 		})]

package/dist/components/molecules/select/Select2.js

@@ -7,11 +7,11 @@ import './Select.css';/* empty css       */
 import { SelectCombobox as a } from "./combobox/Combobox2.js";
 import { SelectDropdown as o } from "./dropdown/Dropdown2.js";
 import { useSelectController as s } from "./Select.controller.js";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
-import { useRef as u } from "react";
+import { useRef as c } from "react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region src/components/molecules/select/Select.tsx
 var d = ({ options: d, onChange: f, name: p, label: m, defaultValue: h, id: g, placeholder: _ = "Not selected", required: v = !1, disabled: y = !1, className: b, ...x }) => {
-	let S = u(null), { elementId: C, dropdownId: w } = r(g), { handleClear: T, handleClose: E, handleSelect: D, handleToggle: O, selected: k, opened: A } = s({
+	let S = c(null), { elementId: C, dropdownId: w } = r(g), { handleClear: T, handleClose: E, handleSelect: D, handleToggle: O, selected: k, opened: A } = s({
 		options: d,
 		onChange: f,
 		defaultValue: h,
@@ -24,17 +24,17 @@ var d = ({ options: d, onChange: f, name: p, label: m, defaultValue: h, id: g, p
 		keyCode: "Escape",
 		ref: S,
 		onKeyPress: E
-	}), /* @__PURE__ */ l("div", {
+	}), /* @__PURE__ */ u("div", {
 		ref: S,
 		...x,
 		className: j,
 		children: [
-			/* @__PURE__ */ c(t, {
+			/* @__PURE__ */ l(t, {
 				label: m,
 				required: v,
 				inputId: C
 			}),
-			/* @__PURE__ */ c(a, {
+			/* @__PURE__ */ l(a, {
 				name: p,
 				opened: A,
 				comboboxId: C,
@@ -45,7 +45,7 @@ var d = ({ options: d, onChange: f, name: p, label: m, defaultValue: h, id: g, p
 				disabled: y,
 				required: v
 			}),
-			/* @__PURE__ */ c(o, {
+			/* @__PURE__ */ l(o, {
 				options: d,
 				selected: k,
 				opened: A,

package/dist/components/molecules/select/combobox/Combobox2.js

@@ -1,12 +1,12 @@
-import { getClassName as e } from "../../../../utils/get-class-name.js";
-import { ElementSize as t } from "../../../../enums/element-size.js";
-import { IconName as n } from "../../../../enums/icon-name.js";
+import { ElementSize as e } from "../../../../enums/element-size.js";
+import { IconName as t } from "../../../../enums/icon-name.js";
+import { getClassName as n } from "../../../../utils/get-class-name.js";
 import r from "../../../atoms/icon/Icon2.js";
 import './Combobox.css';/* empty css         */
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/molecules/select/combobox/Combobox.tsx
 var o = ({ opened: o, onClick: s, comboboxId: c, dropdownId: l, selected: u, name: d, placeholder: f, disabled: p, required: m }) => {
-	let h = e(["cl-select-combobox__icon", { "cl-select-combobox__icon_opened": o }]);
+	let h = n(["cl-select-combobox__icon", { "cl-select-combobox__icon_opened": o }]);
 	return /* @__PURE__ */ a("button", {
 		type: "button",
 		name: d,
@@ -21,9 +21,9 @@ var o = ({ opened: o, onClick: s, comboboxId: c, dropdownId: l, selected: u, nam
 		"aria-required": m,
 		className: "cl-select-combobox",
 		children: [u?.label ? /* @__PURE__ */ i("span", { children: u?.label }) : /* @__PURE__ */ i("span", { children: f }), /* @__PURE__ */ i(r, {
-			name: n.ChevronDown,
+			name: t.ChevronDown,
 			className: h,
-			size: t.Small
+			size: e.Small
 		})]
 	});
 };

package/dist/components/molecules/select/option/Option2.js

@@ -1,12 +1,12 @@
-import { getClassName as e } from "../../../../utils/get-class-name.js";
-import { ElementSize as t } from "../../../../enums/element-size.js";
-import { IconName as n } from "../../../../enums/icon-name.js";
+import { ElementSize as e } from "../../../../enums/element-size.js";
+import { IconName as t } from "../../../../enums/icon-name.js";
+import { getClassName as n } from "../../../../utils/get-class-name.js";
 import r from "../../../atoms/icon/Icon2.js";
 import './Option.css';/* empty css       */
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/molecules/select/option/Option.tsx
 var o = ({ value: o, selected: s, onSelect: c, onClear: l }) => {
-	let { id: u, label: d } = o, f = e(["cl-select-option", { "cl-select-option_selected": s }]), p = (e) => {
+	let { id: u, label: d } = o, f = n(["cl-select-option", { "cl-select-option_selected": s }]), p = (e) => {
 		s ? l() : c(e);
 	};
 	return /* @__PURE__ */ a("li", {
@@ -27,8 +27,8 @@ var o = ({ value: o, selected: s, onSelect: c, onClear: l }) => {
 		onClick: () => p(u),
 		className: f,
 		children: [/* @__PURE__ */ i("span", { children: d }), s && /* @__PURE__ */ i(r, {
-			name: n.Check,
-			size: t.Small
+			name: t.Check,
+			size: e.Small
 		})]
 	});
 };

package/dist/components/molecules/text-input/TextInputStateless.js

@@ -4,19 +4,19 @@ import n from "../../atoms/input/Input2.js";
 import r from "../../atoms/label/Label2.js";
 import './TextInput.css';/* empty css          */
 import i from "./TextInputButtons.js";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { useState as s } from "react";
+import { useState as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
 //#region src/components/molecules/text-input/TextInputStateless.tsx
 var c = ({ name: c, label: l, errorMessage: u, value: d, onChange: f, onBlur: p, onFocus: m, onClear: h, maxLength: g, id: _, tabIndex: v, placeholder: y = "Type here...", disabled: b = !1, required: x = !1, clearable: S = !0, readOnly: C = !1, autoComplete: w = "off", type: T = "text", className: E, style: D, defaultValue: O }) => {
-	let k = _ ?? `text-input-${c}`, A = `${c}-error`, [j, M] = s(!1), N = T === "password";
-	return /* @__PURE__ */ o("div", {
+	let k = _ ?? `text-input-${c}`, A = `${c}-error`, [j, M] = a(!1), N = T === "password";
+	return /* @__PURE__ */ s("div", {
 		style: D,
 		className: e(["cl-text-input", E]),
-		children: [/* @__PURE__ */ a(r, {
+		children: [/* @__PURE__ */ o(r, {
 			label: l,
 			required: x,
 			inputId: k
-		}), /* @__PURE__ */ o(n, {
+		}), /* @__PURE__ */ s(n, {
 			id: k,
 			name: c,
 			type: j ? "text" : T,
@@ -35,7 +35,7 @@ var c = ({ name: c, label: l, errorMessage: u, value: d, onChange: f, onBlur: p,
 			onBlur: p,
 			onFocus: m,
 			tabIndex: v,
-			children: [/* @__PURE__ */ a(i, {
+			children: [/* @__PURE__ */ o(i, {
 				clearable: S,
 				isPasswordButtonVisible: N,
 				handleClear: () => {
@@ -47,7 +47,7 @@ var c = ({ name: c, label: l, errorMessage: u, value: d, onChange: f, onBlur: p,
 				passwordShown: j,
 				label: l,
 				disabled: b
-			}), /* @__PURE__ */ a(t, {
+			}), /* @__PURE__ */ o(t, {
 				errorId: A,
 				message: u,
 				visible: !!u,

package/dist/components/organisms/dialog/Dialog2.js

@@ -1,6 +1,6 @@
-import { getClassName as e } from "../../../utils/get-class-name.js";
-import { ButtonView as t } from "../../../enums/button-view.js";
-import { IconName as n } from "../../../enums/icon-name.js";
+import { ButtonView as e } from "../../../enums/button-view.js";
+import { IconName as t } from "../../../enums/icon-name.js";
+import { getClassName as n } from "../../../utils/get-class-name.js";
 import r from "../../atoms/button/Button2.js";
 import i from "../../atoms/header/Header2.js";
 import a from "../../atoms/portal/Portal.js";
@@ -8,11 +8,11 @@ import { useIsMounted as o } from "../../../hooks/use-is-mounted/use-is-mounted.
 import { useKeyPress as s } from "../../../hooks/use-key-press/use-key-press.js";
 import { useModalFocusTrap as c } from "../../../hooks/use-modal-focus-trap/use-modal-focus-trap.js";
 import './Dialog.css';/* empty css       */
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import { useRef as d } from "react";
+import { useRef as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
 //#region src/components/organisms/dialog/Dialog.tsx
 var f = ({ isOpened: f, onClose: p, title: m, children: h, icon: g, ..._ }) => {
-	let v = o(f), y = v && !f, b = d(null);
+	let v = o(f), y = v && !f, b = l(null);
 	return c({
 		modalRef: b,
 		isOpened: f
@@ -20,28 +20,28 @@ var f = ({ isOpened: f, onClose: p, title: m, children: h, icon: g, ..._ }) => {
 		keyCode: "Escape",
 		ref: b,
 		onKeyPress: p
-	}), v ? /* @__PURE__ */ l(a, { children: /* @__PURE__ */ l("div", {
-		className: e(["cl-dialog", { "cl-dialog_closing": y }]),
-		children: /* @__PURE__ */ u("div", {
+	}), v ? /* @__PURE__ */ u(a, { children: /* @__PURE__ */ u("div", {
+		className: n(["cl-dialog", { "cl-dialog_closing": y }]),
+		children: /* @__PURE__ */ d("div", {
 			ref: b,
 			role: "dialog",
 			"aria-modal": "true",
 			..._,
 			className: "cl-dialog__layout",
 			children: [
-				/* @__PURE__ */ l(r, {
-					icon: n.X,
-					view: t.Icon,
+				/* @__PURE__ */ u(r, {
+					icon: t.X,
+					view: e.Icon,
 					label: "Close modal window",
 					onClick: p,
 					className: "cl-dialog__button"
 				}),
-				/* @__PURE__ */ l("header", { children: /* @__PURE__ */ l(i, {
+				/* @__PURE__ */ u("header", { children: /* @__PURE__ */ u(i, {
 					as: "h3",
 					icon: g,
 					children: m
 				}) }),
-				/* @__PURE__ */ l("div", { children: h })
+				/* @__PURE__ */ u("div", { children: h })
 			]
 		})
 	}) }) : null;