intelicoreact 2.0.18 → 2.0.20

package/dist/es/Atomic/FormElements/NumericInput/NumericInput.js

@@ -0,0 +1,204 @@
+import '../../../styles/base.css';
+import { KEYBOARD_SERVICE_KEYS } from "../../../Constants/index.constants.js";
+import { filterNumeric, formatToAddBitDepthPoints, formatToRemoveComa } from "../../../Functions/fieldValueFormatters.js";
+import Spinner from "../../Layout/Spinner/Spinner.js";
+import './NumericInput.styles.css';/* empty css                  */
+import cn from "classnames";
+import { useEffect, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Minus, Plus } from "react-feather";
+//#region src/Atomic/FormElements/NumericInput/NumericInput.js
+var NumericInput = ({ disabled, withDelete, numStep = 1, min = 0, max, value, placeholder, className, testId = "numeric-input", name, fieldKey, id, onChange = () => {}, onBlur = () => {}, onFocus = () => {}, onKeyUp = () => {}, onKeyDown = () => {}, maskChar, formatChars, error, icon, isNotBlinkErrors, blinkTime, isPriceInput, isFocusDefault = false, isNotRenderButtons = false, isUseAutoSelect = true, isLoading = false, isAllowNullValue = false, onlyNumbers = { type: "int" }, attributesOfNativeInput = {} }) => {
+	const DEFAULT_BLINK_TIME = 200;
+	const inputRef = useRef(null);
+	const decRef = useRef(null);
+	const incRef = useRef(null);
+	const wrapRef = useRef(null);
+	const initialMin = isAllowNullValue ? "" : min;
+	const [inputValue, setInputValue] = useState(value || initialMin);
+	const [inputValueFormated, setInputValueFormated] = useState(inputValue);
+	const [intMemoVal, setIntMemoVal] = useState(0);
+	const [isFocused, setIsFocused] = useState(false);
+	const [isAttemptToChange, setIsAttemptToChange] = useState(false);
+	const [isToHighlightError, setIsToHighlightError] = useState(false);
+	const [prevValue, setPreviousValue] = useState(value || initialMin);
+	const setCursorToEnd = () => {
+		const input = inputRef.current;
+		const cursor = input?.value?.length;
+		if (input) setTimeout(() => input.setSelectionRange(cursor, cursor), 10);
+	};
+	const handle = {
+		change: (e) => {
+			const inputValue2 = e.target ? filterNumeric(e.target.value, onlyNumbers) : filterNumeric(e, onlyNumbers);
+			setInputValue(inputValue2.toString());
+		},
+		clear: () => {
+			handle.change(initialMin || "");
+		},
+		focus: (e) => {
+			setIsFocused(true);
+			if (onFocus) onFocus(e);
+		},
+		blur: (e) => {
+			setIsFocused(false);
+			if (Number.isNaN(inputValue) || inputValue < min) setInputValue(initialMin);
+			if (max && Number(max) < inputValue) setInputValue(max);
+			if (onBlur) onBlur(e);
+		},
+		keyDown: (e) => {
+			setPreviousValue(e?.target?.value);
+			onKeyDown(e.keyCode, e);
+		},
+		keyUp: (e) => {
+			if (!isNotBlinkErrors) {
+				const changedValue = String(value ?? "");
+				const previousValue = String(prevValue);
+				const short = previousValue.length <= changedValue.length ? previousValue : changedValue;
+				const long = previousValue.length > changedValue.length ? previousValue : changedValue;
+				const infoAboutDifferencesSameness = short.split("").reduce((acc, symbol, idx) => {
+					if (acc.countOn && symbol === long[idx]) acc.same.push(symbol);
+					else {
+						acc.countOn = false;
+						acc.differences.push([idx, symbol]);
+					}
+					return acc;
+				}, {
+					same: [],
+					countOn: true,
+					differences: []
+				});
+				const samePart = infoAboutDifferencesSameness.same.join("");
+				const differencesLength = infoAboutDifferencesSameness.differences.length;
+				const currentSet = changedValue?.replace(samePart, "");
+				if (!KEYBOARD_SERVICE_KEYS.includes(e.key) && changedValue === previousValue) setIsAttemptToChange(!(!differencesLength && e.key === currentSet));
+			}
+			if (onKeyUp) onKeyUp(e.keyCode, e.target.value);
+		},
+		decrement: (e) => {
+			let newValue = Number(intMemoVal) - Number(numStep);
+			if (newValue < min) newValue = min;
+			else if (newValue > max) newValue = max;
+			handle.change(newValue);
+			setTimeout(() => {
+				inputRef?.current?.focus();
+				setCursorToEnd();
+			}, 100);
+		},
+		increment: (e) => {
+			let newValue = Number(intMemoVal) + Number(numStep);
+			if (newValue < min) newValue = min;
+			else if (newValue > max) newValue = max;
+			handle.change(newValue);
+			setTimeout(() => {
+				inputRef?.current?.focus();
+				setCursorToEnd();
+			}, 100);
+		}
+	};
+	useEffect(() => {
+		const handleClickOutside = (event) => {
+			if (!wrapRef.current.contains(event.target)) setIsFocused(false);
+		};
+		document.addEventListener("mousedown", handleClickOutside, true);
+		return () => document.removeEventListener("mousedown", handleClickOutside, true);
+	}, []);
+	useEffect(() => {
+		if (!isNotBlinkErrors && isAttemptToChange) {
+			setIsAttemptToChange(false);
+			setIsToHighlightError(true);
+			setTimeout(() => {
+				setIsToHighlightError(false);
+			}, blinkTime || DEFAULT_BLINK_TIME);
+		}
+	}, [isAttemptToChange]);
+	useEffect(() => {
+		if (value && value !== inputValue) setInputValue(value);
+	}, [value]);
+	useEffect(() => {
+		if (inputValue !== value) setIsFocused(true);
+		setInputValueFormated(isPriceInput && inputValue?.length > 0 ? isFocused ? formatToRemoveComa(inputValue) : formatToAddBitDepthPoints(inputValue) : inputValue);
+		setIntMemoVal(formatToRemoveComa(inputValue));
+		if (typeof onChange === "function" && value !== void 0 && +inputValue !== +value) onChange(inputValue?.toString());
+	}, [inputValue]);
+	useEffect(() => {
+		if (isNaN(intMemoVal)) setIntMemoVal(min || 0);
+	}, [intMemoVal]);
+	useEffect(() => {
+		let formatedValue = inputValue;
+		if (isPriceInput) formatedValue = isFocused ? formatToRemoveComa(inputValue) : formatToAddBitDepthPoints(inputValue);
+		setInputValueFormated(formatedValue);
+		if (isFocused) {
+			if (typeof onFocus === "function") onFocus({ target: inputRef?.current });
+			inputRef?.current?.focus();
+		} else {
+			if (typeof onBlur === "function") onBlur({ target: inputRef?.current });
+			inputRef?.current?.blur();
+		}
+	}, [isFocused]);
+	useEffect(() => {
+		if (inputRef?.current && typeof isFocusDefault === "boolean") setIsFocused(isFocusDefault);
+	}, [inputRef, isFocusDefault]);
+	function renderInput() {
+		const uniProps = {
+			name: name || fieldKey || id || testId || "",
+			className: `input ${className || ""}`,
+			placeholder,
+			value: inputValueFormated,
+			disabled,
+			onChange: handle.change,
+			onFocus: handle.focus,
+			onBlur: handle.blur,
+			onKeyDown: handle.keyDown,
+			onKeyUp: handle.keyUp,
+			min,
+			max,
+			...maskChar ? { maskChar } : {},
+			...formatChars ? { formatChars } : {}
+		};
+		return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("input", {
+			...uniProps,
+			"data-testid": `${testId}-input`,
+			value: value?.length > 0 ? formatToAddBitDepthPoints(formatToRemoveComa(value)) : value,
+			ref: inputRef,
+			type: "text",
+			onFocus: (...params) => {
+				if (isUseAutoSelect) inputRef.current.select();
+				if (uniProps.onFocus) uniProps.onFocus(...params);
+			},
+			...attributesOfNativeInput
+		}), !isNotRenderButtons ? /* @__PURE__ */ jsxs("div", {
+			className: "input__nums",
+			children: [/* @__PURE__ */ jsx("button", {
+				"data-testid": `${testId}-minus-btn`,
+				ref: decRef,
+				className: cn("input__num-btn", { "events-none": Number(value) <= min }),
+				onMouseDown: (e) => handle.decrement(e),
+				children: /* @__PURE__ */ jsx(Minus, { className: cn({ disabled: Number(value) <= min }) })
+			}), /* @__PURE__ */ jsx("button", {
+				"data-testid": `-${testId}-plus-btn`,
+				ref: incRef,
+				className: cn("input__num-btn", { "events-none": Number(value) >= max }),
+				onMouseDown: (e) => handle.increment(e),
+				children: /* @__PURE__ */ jsx(Plus, { className: cn({ disabled: Number(value) >= max }) })
+			})]
+		}) : null] });
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		"data-testid": testId,
+		ref: wrapRef,
+		className: cn(`input__wrap`, { [`input__wrap_focus`]: isFocused }, { [`input__wrap_error`]: error || isToHighlightError }, { [`input__wrap--disabled`]: disabled || isLoading }),
+		children: [
+			renderInput(),
+			icon,
+			withDelete && /* @__PURE__ */ jsx("span", {
+				className: cn(`input__close`, { hidden: !inputValue }),
+				onClick: () => handle.clear()
+			}),
+			isLoading && /* @__PURE__ */ jsx(Spinner, { size: "small" })
+		]
+	});
+};
+//#endregion
+export { NumericInput as default };
+
+//# sourceMappingURL=NumericInput.js.map

package/dist/es/Atomic/FormElements/NumericInput/NumericInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumericInput.js","names":["inputValue"],"sources":["../../../../../src/Atomic/FormElements/NumericInput/NumericInput.js"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\n\nimport cn from \"classnames\";\nimport { Minus, Plus } from \"react-feather\";\n\nimport { KEYBOARD_SERVICE_KEYS } from \"../../../Constants/index.constants\";\nimport {\n  formatToAddBitDepthPoints as addCommas,\n  filterNumeric,\n  formatToRemoveComa as removeCommas,\n} from \"../../../Functions/fieldValueFormatters\";\nimport { getCorrectTestId } from \"../../../Functions/utils\";\nimport Spinner from \"../../Layout/Spinner/Spinner\";\n\nimport \"./NumericInput.scss\";\n\nconst NumericInput = ({\n  disabled,\n  withDelete,\n  numStep = 1,\n  min = 0,\n  max,\n  value,\n  placeholder,\n  className,\n  testId = \"numeric-input\",\n  name,\n  fieldKey,\n  id,\n\n  onChange = () => {},\n  onBlur = () => {},\n  onFocus = () => {},\n  onKeyUp = () => {},\n  onKeyDown = () => {},\n\n  maskChar,\n  formatChars,\n  error,\n  icon,\n  isNotBlinkErrors,\n  blinkTime,\n  isPriceInput,\n  isFocusDefault = false,\n  isNotRenderButtons = false,\n  isUseAutoSelect = true,\n  isLoading = false,\n  isAllowNullValue = false,\n  onlyNumbers = {\n    type: \"int\",\n  },\n\n  attributesOfNativeInput = {},\n}) => {\n  const DEFAULT_BLINK_TIME = 200;\n\n  //REFS\n  const inputRef = useRef(null);\n  const decRef = useRef(null);\n  const incRef = useRef(null);\n  const wrapRef = useRef(null);\n\n  // STATES\n  const initialMin = isAllowNullValue ? \"\" : min;\n  const [inputValue, setInputValue] = useState(value || initialMin);\n  const [inputValueFormated, setInputValueFormated] = useState(inputValue);\n  const [intMemoVal, setIntMemoVal] = useState(0);\n\n  const [isFocused, setIsFocused] = useState(false);\n\n  const [isAttemptToChange, setIsAttemptToChange] = useState(false);\n  const [isToHighlightError, setIsToHighlightError] = useState(false);\n\n  const [prevValue, setPreviousValue] = useState(value || initialMin);\n\n  const setCursorToEnd = () => {\n    const input = inputRef.current;\n    const cursor = input?.value?.length;\n    if (input) setTimeout(() => input.setSelectionRange(cursor, cursor), 10);\n  };\n\n  // HANDLES\n  const handle = {\n    change: (e) => {\n      const inputValue = e.target\n        ? filterNumeric(e.target.value, onlyNumbers)\n        : filterNumeric(e, onlyNumbers);\n      setInputValue(inputValue.toString());\n    },\n    clear: () => {\n      handle.change(initialMin || \"\");\n    },\n    focus: (e) => {\n      setIsFocused(true);\n      if (onFocus) onFocus(e);\n    },\n    blur: (e) => {\n      setIsFocused(false);\n\n      if (Number.isNaN(inputValue) || inputValue < min)\n        setInputValue(initialMin);\n      if (max && Number(max) < inputValue) setInputValue(max);\n\n      if (onBlur) onBlur(e);\n    },\n    keyDown: (e) => {\n      setPreviousValue(e?.target?.value);\n      onKeyDown(e.keyCode, e);\n    },\n\n    keyUp: (e) => {\n      if (!isNotBlinkErrors) {\n        const changedValue = String(value ?? \"\");\n        const previousValue = String(prevValue);\n\n        const short =\n          previousValue.length <= changedValue.length\n            ? previousValue\n            : changedValue;\n        const long =\n          previousValue.length > changedValue.length\n            ? previousValue\n            : changedValue;\n\n        const infoAboutDifferencesSameness = short.split(\"\").reduce(\n          (acc, symbol, idx) => {\n            if (acc.countOn && symbol === long[idx]) acc.same.push(symbol);\n            else {\n              acc.countOn = false;\n              acc.differences.push([idx, symbol]);\n            }\n            return acc;\n          },\n          { same: [], countOn: true, differences: [] },\n        );\n\n        const samePart = infoAboutDifferencesSameness.same.join(\"\");\n        const differencesLength =\n          infoAboutDifferencesSameness.differences.length;\n        const currentSet = changedValue?.replace(samePart, \"\");\n\n        if (\n          !KEYBOARD_SERVICE_KEYS.includes(e.key) &&\n          changedValue === previousValue\n        )\n          setIsAttemptToChange(!(!differencesLength && e.key === currentSet));\n      }\n\n      if (onKeyUp) onKeyUp(e.keyCode, e.target.value);\n    },\n    decrement: (e) => {\n      let newValue = Number(intMemoVal) - Number(numStep);\n      if (newValue < min) newValue = min;\n      else if (newValue > max) newValue = max;\n\n      handle.change(newValue);\n\n      setTimeout(() => {\n        inputRef?.current?.focus();\n        setCursorToEnd();\n      }, 100);\n    },\n    increment: (e) => {\n      let newValue = Number(intMemoVal) + Number(numStep);\n      if (newValue < min) newValue = min;\n      else if (newValue > max) newValue = max;\n\n      handle.change(newValue);\n\n      setTimeout(() => {\n        inputRef?.current?.focus();\n        setCursorToEnd();\n      }, 100);\n    },\n  };\n\n  //Check Outside Click\n  useEffect(() => {\n    const handleClickOutside = (event) => {\n      if (!wrapRef.current.contains(event.target)) setIsFocused(false);\n    };\n\n    document.addEventListener(\"mousedown\", handleClickOutside, true);\n    return () =>\n      document.removeEventListener(\"mousedown\", handleClickOutside, true);\n  }, []);\n\n  useEffect(() => {\n    if (!isNotBlinkErrors && isAttemptToChange) {\n      setIsAttemptToChange(false);\n      setIsToHighlightError(true);\n      setTimeout(() => {\n        setIsToHighlightError(false);\n      }, blinkTime || DEFAULT_BLINK_TIME);\n    }\n  }, [isAttemptToChange]);\n\n  useEffect(() => {\n    if (value && value !== inputValue) setInputValue(value);\n  }, [value]);\n\n  //On Input Value Change\n  useEffect(() => {\n    if (inputValue !== value) setIsFocused(true);\n\n    setInputValueFormated(\n      isPriceInput && inputValue?.length > 0\n        ? isFocused\n          ? removeCommas(inputValue)\n          : addCommas(inputValue)\n        : inputValue,\n    );\n    setIntMemoVal(removeCommas(inputValue));\n\n    if (typeof onChange === \"function\" && value !== undefined && +inputValue !== +value) onChange(inputValue?.toString());\n  }, [inputValue]);\n\n  //On Integer Value Change\n  useEffect(() => {\n    if (isNaN(intMemoVal)) setIntMemoVal(min || 0);\n  }, [intMemoVal]);\n\n  //On Focuse Change\n  useEffect(() => {\n    let formatedValue = inputValue;\n    if (isPriceInput)\n      formatedValue = isFocused\n        ? removeCommas(inputValue)\n        : addCommas(inputValue);\n    setInputValueFormated(formatedValue);\n\n    if (isFocused) {\n      if (typeof onFocus === \"function\") onFocus({ target: inputRef?.current });\n      inputRef?.current?.focus();\n    } else {\n      if (typeof onBlur === \"function\") onBlur({ target: inputRef?.current });\n      inputRef?.current?.blur();\n    }\n  }, [isFocused]);\n\n  useEffect(() => {\n    if (inputRef?.current && typeof isFocusDefault === \"boolean\")\n      setIsFocused(isFocusDefault);\n  }, [inputRef, isFocusDefault]);\n\n  function renderInput() {\n    const uniProps = {\n      name: name || fieldKey || id || testId || \"\",\n      className: `input ${className || \"\"}`,\n      placeholder,\n      value: inputValueFormated,\n      disabled,\n      onChange: handle.change,\n      onFocus: handle.focus,\n      onBlur: handle.blur,\n      onKeyDown: handle.keyDown,\n      onKeyUp: handle.keyUp,\n      min,\n      max,\n      ...(maskChar ? { maskChar } : {}),\n      ...(formatChars ? { formatChars } : {}),\n    };\n\n    return (\n      <>\n        <input\n          {...uniProps}\n          data-testid={`${testId}-input`}\n          value={value?.length > 0 ? addCommas(removeCommas(value)) : value}\n          ref={inputRef}\n          type=\"text\"\n          onFocus={(...params) => {\n            if (isUseAutoSelect) inputRef.current.select();\n            if (uniProps.onFocus) uniProps.onFocus(...params);\n          }}\n          {...attributesOfNativeInput}\n        />\n\n        {!isNotRenderButtons ? (\n          <div className=\"input__nums\">\n            <button\n              data-testid={`${testId}-minus-btn`}\n              ref={decRef}\n              className={cn(\"input__num-btn\", {\n                \"events-none\": Number(value) <= min,\n              })}\n              onMouseDown={(e) => handle.decrement(e)}\n            >\n              <Minus className={cn({ disabled: Number(value) <= min })} />\n            </button>\n            <button\n              data-testid={`-${testId}-plus-btn`}\n              ref={incRef}\n              className={cn(\"input__num-btn\", {\n                \"events-none\": Number(value) >= max,\n              })}\n              onMouseDown={(e) => handle.increment(e)}\n            >\n              <Plus className={cn({ disabled: Number(value) >= max })} />\n            </button>\n          </div>\n        ) : null}\n      </>\n    );\n  }\n\n  return (\n    <div\n      data-testid={testId}\n      ref={wrapRef}\n      className={cn(\n        `input__wrap`,\n        { [`input__wrap_focus`]: isFocused },\n        { [`input__wrap_error`]: error || isToHighlightError },\n        { [`input__wrap--disabled`]: disabled || isLoading },\n      )}\n    >\n      {renderInput()}\n      {icon}\n      {withDelete && (\n        <span\n          className={cn(`input__close`, { hidden: !inputValue })}\n          onClick={() => handle.clear()}\n        />\n      )}\n      {isLoading && <Spinner size=\"small\" />}\n    </div>\n  );\n};\n\nexport default NumericInput;\n"],"mappings":"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"}

package/dist/es/Atomic/FormElements/NumericInput/NumericInput.styles.css

@@ -0,0 +1,129 @@
+.input {
+  position: relative;
+  width: 100%;
+  padding: 0 10px;
+  word-break: break-all;
+  border: none;
+  background: none;
+}
+.input::-webkit-outer-spin-button, .input::-webkit-inner-spin-button {
+  appearance: none;
+}
+.input__wrap {
+  position: relative;
+  display: flex;
+  align-items: center;
+  box-sizing: border-box;
+  height: 28px;
+  border: 1px solid #e2e5ec;
+  border-radius: 4px;
+  background-color: #fff;
+}
+.input__wrap_focus {
+  border-color: #6b81dd;
+  filter: drop-shadow(0 0 4px rgba(93, 120, 255, 0.5));
+}
+.input__wrap_disabled {
+  pointer-events: none;
+  opacity: 0.5;
+  border-color: #a6acb1;
+  background: #f7f8fa;
+}
+.input__wrap_error {
+  border-color: #f06d8d;
+}
+.input__wrap .lds-ring.lds-ring_small {
+  top: calc(50% - 18px);
+}
+.input_disabled {
+  pointer-events: none;
+  opacity: 0.5;
+  border-color: #a6acb1;
+  background: #f7f8fa;
+}
+.input_error {
+  border-color: #f06d8d;
+}
+.input svg {
+  margin-right: 4px;
+}
+.input__input {
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  padding: 0 5px;
+  font-size: 13px;
+  font-weight: 400;
+  color: #1e1e2d;
+  border: none;
+  border-radius: 4px;
+}
+.input__close {
+  position: relative;
+  visibility: hidden;
+  width: 14px;
+  height: 14px;
+  margin-right: 4px;
+  cursor: pointer;
+  pointer-events: none;
+  opacity: 0.6;
+  background: none;
+}
+.input__close:hover {
+  opacity: 1;
+}
+.input__close::before, .input__close::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  width: 2px;
+  height: 14px;
+  margin: auto;
+  content: "";
+  background-color: #9aa0b9;
+}
+.input__close::before {
+  transform: rotate(45deg);
+}
+.input__close::after {
+  transform: rotate(-45deg);
+}
+.input__nums {
+  display: flex;
+  align-items: center;
+  height: 100%;
+}
+.input__num-btn {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 24px;
+  height: 100%;
+  font-size: 20px;
+  cursor: pointer;
+  user-select: none;
+  border-left: 1px solid #e2e5ec;
+  background: none;
+}
+.input__num-btn.disabled {
+  opacity: 0.3;
+}
+.input__num-btn svg {
+  margin-right: 0;
+}
+.input-label {
+  margin-bottom: 5px;
+}
+.input--with-icon {
+  padding: 0 40px 0 10px;
+}
+
+.input__wrap:hover .input__close {
+  visibility: visible;
+  pointer-events: all;
+}
+
+.events-none {
+  pointer-events: none;
+}

package/dist/es/Atomic/FormElements/RadioGroup/RadioGroup.js

@@ -0,0 +1,44 @@
+import '../../../styles/base.css';
+import RadioInput from "../RadioInput/RadioInput.js";
+import './RadioGroup.styles.css';/* empty css                */
+import cn from "classnames";
+import { useLayoutEffect, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Atomic/FormElements/RadioGroup/RadioGroup.tsx
+function RadioGroup({ className, disabled, value, onChange = () => {}, direction = "row", options = [] }) {
+	const [values, setValues] = useState(options);
+	useLayoutEffect(() => setValues(options.map((item) => item.value === value ? {
+		...item,
+		checked: value
+	} : item)), [options, value]);
+	const handle = { change: (value) => {
+		const newValues = values.map((item) => {
+			if (item.value === value) return {
+				...item,
+				checked: value
+			};
+			return {
+				id: item.id,
+				label: item.label,
+				value: item.value
+			};
+		});
+		setValues(newValues);
+		onChange(value);
+	} };
+	return /* @__PURE__ */ jsx("div", {
+		"data-testid": "radio-group",
+		className: cn("radio-group", className, `radio-group--${direction}`, { "radio-group--disabled": disabled }),
+		children: values.map((item) => /* @__PURE__ */ jsx(RadioInput, {
+			...item,
+			value: item.value,
+			onChange: handle.change,
+			testId: `radio-input-${item.id}`,
+			checked: item.checked
+		}, item.id))
+	});
+}
+//#endregion
+export { RadioGroup as default };
+
+//# sourceMappingURL=RadioGroup.js.map

package/dist/es/Atomic/FormElements/RadioGroup/RadioGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.js","names":[],"sources":["../../../../../src/Atomic/FormElements/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\n\nimport type { IRadioGroupProps } from './RadioGroup.interface';\n\nimport cn from 'classnames';\nimport { useLayoutEffect, useState } from 'react';\n\nimport RadioInput from '../RadioInput/RadioInput';\nimport './RadioGroup.scss';\n\nfunction RadioGroup({\n  className,\n  disabled,\n  value,\n  onChange = () => {},\n  direction = 'row',\n  options = [],\n}: IRadioGroupProps): ReactElement {\n  const [values, setValues] = useState(options);\n\n  useLayoutEffect(\n    () =>\n      setValues(\n        options.map(item =>\n          item.value === value ? { ...item, checked: value } : item,\n        ),\n      ),\n    [options, value],\n  );\n\n  const handle = {\n    change: (value: string | number | boolean) => {\n      const newValues = values.map((item) => {\n        if (item.value === value) {\n          return {\n            ...item,\n            checked: value,\n          };\n        }\n        return {\n          id: item.id,\n          label: item.label,\n          value: item.value,\n        };\n      });\n      setValues(newValues);\n      onChange(value);\n    },\n  };\n  return (\n    <div\n      data-testid=\"radio-group\"\n      className={cn('radio-group', className, `radio-group--${direction}`, {\n        'radio-group--disabled': disabled,\n      })}\n    >\n      {values.map(item => (\n        <RadioInput\n          key={item.id}\n          {...item}\n          value={item.value}\n          onChange={handle.change}\n          testId={`radio-input-${item.id}`}\n          checked={item.checked}\n        />\n      ))}\n    </div>\n  );\n}\n\nexport default RadioGroup;\n"],"mappings":";;;;;;AAUA,SAAS,WAAW,EAClB,WACA,UACA,OACA,iBAAiB,CAAC,GAClB,YAAY,OACZ,UAAU,CAAC,KACsB;CACjC,MAAM,CAAC,QAAQ,aAAa,SAAS,OAAO;CAE5C,sBAEI,UACE,QAAQ,KAAI,SACV,KAAK,UAAU,QAAQ;EAAE,GAAG;EAAM,SAAS;CAAM,IAAI,IACvD,CACF,GACF,CAAC,SAAS,KAAK,CACjB;CAEA,MAAM,SAAS,EACb,SAAS,UAAqC;EAC5C,MAAM,YAAY,OAAO,KAAK,SAAS;GACrC,IAAI,KAAK,UAAU,OACjB,OAAO;IACL,GAAG;IACH,SAAS;GACX;GAEF,OAAO;IACL,IAAI,KAAK;IACT,OAAO,KAAK;IACZ,OAAO,KAAK;GACd;EACF,CAAC;EACD,UAAU,SAAS;EACnB,SAAS,KAAK;CAChB,EACF;CACA,OACE,oBAAC,OAAD;EACE,eAAY;EACZ,WAAW,GAAG,eAAe,WAAW,gBAAgB,aAAa,EACnE,yBAAyB,SAC3B,CAAC;YAEA,OAAO,KAAI,SACV,oBAAC,YAAD;GAEE,GAAI;GACJ,OAAO,KAAK;GACZ,UAAU,OAAO;GACjB,QAAQ,eAAe,KAAK;GAC5B,SAAS,KAAK;EACf,GANM,KAAK,EAMX,CACF;CACE,CAAA;AAET"}

package/dist/es/Atomic/FormElements/RadioGroup/RadioGroup.styles.css

@@ -0,0 +1,20 @@
+.radio-group {
+  display: flex;
+}
+.radio-group--col {
+  flex-direction: column;
+}
+.radio-group--col .radio-input:not(:last-child) {
+  margin-bottom: 10px;
+}
+.radio-group--row {
+  align-items: center;
+  min-height: 28px;
+}
+.radio-group--row .radio-input:not(:last-child) {
+  margin-right: 10px;
+}
+.radio-group--disabled {
+  pointer-events: none;
+  opacity: 0.5;
+}

package/dist/es/Atomic/FormElements/RadioGroupWithInput/RadioGroupWithInput.js

@@ -0,0 +1,57 @@
+import '../../../styles/base.css';
+import Input from "../Input/Input.js";
+import RadioInput from "../RadioInput/RadioInput.js";
+import Alert from "../../UI/Alert/Alert.js";
+import FormElement from "../../../Molecular/FormElement/FormElement.js";
+import './RadioGroupWithInput.styles.css';/* empty css                         */
+import cn from "classnames";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/Atomic/FormElements/RadioGroupWithInput/RadioGroupWithInput.tsx
+function RadioGroupWithInput({ alert, className, disabled, onChange = () => {}, direction = "row", options = [] }) {
+	const handle = {
+		changeRadio: (_, el) => {
+			onChange(options.map((item) => {
+				return {
+					...item,
+					checked: el.value === item.value ? item.value : ""
+				};
+			}));
+		},
+		changeInput: (value, el) => {
+			if (el.input) el.input.value = value;
+			onChange(options);
+		}
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: "radio-group-input-box",
+		children: [alert && /* @__PURE__ */ jsx(Alert, {
+			className: "mb10",
+			...alert
+		}), /* @__PURE__ */ jsx("div", {
+			className: cn("radio-group-input", className, `radio-group-input--${direction}`, { "radio-group-input--disabled": disabled }),
+			children: options?.map((item) => {
+				return /* @__PURE__ */ jsxs("div", {
+					className: cn("radio-group-input-item", `radio-group-input-item-${item.id}`),
+					children: [/* @__PURE__ */ jsx(RadioInput, {
+						...item,
+						id: String(item.id),
+						onChange: (value) => handle.changeRadio(String(value), item),
+						checked: item.checked
+					}), item.input && item.checked && /* @__PURE__ */ jsx(FormElement, {
+						...item.input,
+						children: /* @__PURE__ */ jsx(Input, {
+							onChange: (value) => handle.changeInput(value, item),
+							...item.input,
+							testId: `${item.id}-input`
+						})
+					})]
+				}, item.id);
+			})
+		})]
+	});
+}
+//#endregion
+export { RadioGroupWithInput as default };
+
+//# sourceMappingURL=RadioGroupWithInput.js.map

package/dist/es/Atomic/FormElements/RadioGroupWithInput/RadioGroupWithInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroupWithInput.js","names":[],"sources":["../../../../../src/Atomic/FormElements/RadioGroupWithInput/RadioGroupWithInput.tsx"],"sourcesContent":["import type { IOption, IRadioGroupWithInputProps } from './RadioGroupWithInput.interface';\n\nimport cn from 'classnames';\n\nimport React from 'react';\nimport FormElement from '../../../Molecular/FormElement/FormElement';\n\nimport Alert from '../../UI/Alert/Alert';\nimport Input from '../Input/Input';\n\nimport RadioInput from '../RadioInput/RadioInput';\nimport './RadioGroupWithInput.scss';\n\nfunction RadioGroupWithInput({\n  alert,\n  className,\n  disabled,\n  onChange = () => {},\n  direction = 'row',\n  options = [],\n}: IRadioGroupWithInputProps): React.ReactElement {\n  const handle = {\n    changeRadio: (_: string, el: { value: string }) => {\n      const newOptions = options.map((item) => {\n        return {\n          ...item,\n          checked: el.value === item.value ? item.value : '',\n        };\n      });\n      onChange(newOptions);\n    },\n    changeInput: (value: string, el: IOption) => {\n      if (el.input) {\n        el.input.value = value;\n      }\n      onChange(options);\n    },\n  };\n\n  return (\n    <div className=\"radio-group-input-box\">\n      {alert && <Alert className=\"mb10\" {...alert} />}\n      <div\n        className={cn(\n          'radio-group-input',\n          className,\n          `radio-group-input--${direction}`,\n          {\n            'radio-group-input--disabled': disabled,\n          },\n        )}\n      >\n        {options?.map((item) => {\n          return (\n            <div\n              key={item.id}\n              className={cn(\n                'radio-group-input-item',\n                `radio-group-input-item-${item.id}`,\n              )}\n            >\n              <RadioInput\n                {...item}\n                id={String(item.id)}\n                onChange={value => handle.changeRadio(String(value), item)}\n                checked={item.checked}\n              />\n              {item.input && item.checked && (\n                <FormElement {...item.input}>\n                  <Input\n                    onChange={value => handle.changeInput(value, item)}\n                    {...item.input}\n                    testId={`${item.id}-input`}\n                  />\n                </FormElement>\n              )}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\nexport default RadioGroupWithInput;\n"],"mappings":";;;;;;;;;AAaA,SAAS,oBAAoB,EAC3B,OACA,WACA,UACA,iBAAiB,CAAC,GAClB,YAAY,OACZ,UAAU,CAAC,KACqC;CAChD,MAAM,SAAS;EACb,cAAc,GAAW,OAA0B;GAOjD,SANmB,QAAQ,KAAK,SAAS;IACvC,OAAO;KACL,GAAG;KACH,SAAS,GAAG,UAAU,KAAK,QAAQ,KAAK,QAAQ;IAClD;GACF,CACS,CAAU;EACrB;EACA,cAAc,OAAe,OAAgB;GAC3C,IAAI,GAAG,OACL,GAAG,MAAM,QAAQ;GAEnB,SAAS,OAAO;EAClB;CACF;CAEA,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACG,SAAS,oBAAC,OAAD;GAAO,WAAU;GAAO,GAAI;EAAQ,CAAA,GAC9C,oBAAC,OAAD;GACE,WAAW,GACT,qBACA,WACA,sBAAsB,aACtB,EACE,+BAA+B,SACjC,CACF;aAEC,SAAS,KAAK,SAAS;IACtB,OACE,qBAAC,OAAD;KAEE,WAAW,GACT,0BACA,0BAA0B,KAAK,IACjC;eALF,CAOE,oBAAC,YAAD;MACE,GAAI;MACJ,IAAI,OAAO,KAAK,EAAE;MAClB,WAAU,UAAS,OAAO,YAAY,OAAO,KAAK,GAAG,IAAI;MACzD,SAAS,KAAK;KACf,CAAA,GACA,KAAK,SAAS,KAAK,WAClB,oBAAC,aAAD;MAAa,GAAI,KAAK;gBACpB,oBAAC,OAAD;OACE,WAAU,UAAS,OAAO,YAAY,OAAO,IAAI;OACjD,GAAI,KAAK;OACT,QAAQ,GAAG,KAAK,GAAG;MACpB,CAAA;KACU,CAAA,CAEZ;OArBE,KAAK,EAqBP;GAET,CAAC;EACE,CAAA,CACF;;AAET"}

package/dist/es/Atomic/FormElements/RadioGroupWithInput/RadioGroupWithInput.styles.css

@@ -0,0 +1,23 @@
+.radio-group-input {
+  display: flex;
+}
+.radio-group-input--col {
+  flex-direction: column;
+}
+.radio-group-input--col .radio-input:not(:last-child) {
+  margin-bottom: 10px;
+}
+.radio-group-input--row {
+  align-items: center;
+  min-height: 28px;
+}
+.radio-group-input--row .radio-input:not(:last-child) {
+  margin-right: 10px;
+}
+.radio-group-input--disabled {
+  pointer-events: none;
+  opacity: 0.5;
+}
+.radio-group-input .input__wrap {
+  margin-bottom: 5px;
+}

package/dist/es/Atomic/FormElements/RadioInput/RadioInput.js

@@ -0,0 +1,35 @@
+import '../../../styles/base.css';
+import './RadioInput.styles.css';/* empty css                */
+import cn from "classnames";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/Atomic/FormElements/RadioInput/RadioInput.tsx
+var RC = "radio-input";
+var RadioInput = ({ label, id, checked, name, disabled, className, value, testId = "radio-input", onChange, attributesOfNativeInput }) => {
+	return /* @__PURE__ */ jsxs("label", {
+		"data-testid": testId,
+		className: cn(RC, className, { [`${RC}_disabled`]: disabled }),
+		htmlFor: id,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: cn(`${RC}__input`, { [`${RC}__input--checked`]: checked === value }),
+			children: [/* @__PURE__ */ jsx("input", {
+				id,
+				"data-testid": `${testId}-input`,
+				type: "radio",
+				checked: checked === value,
+				className: `${RC}__radio`,
+				onChange: () => onChange?.(value),
+				name,
+				disabled,
+				...attributesOfNativeInput
+			}), /* @__PURE__ */ jsx("div", { className: `${RC}__mark` })]
+		}), label && /* @__PURE__ */ jsx("div", {
+			className: `${RC}__label`,
+			children: label
+		})]
+	});
+};
+//#endregion
+export { RadioInput as default };
+
+//# sourceMappingURL=RadioInput.js.map

package/dist/es/Atomic/FormElements/RadioInput/RadioInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioInput.js","names":[],"sources":["../../../../../src/Atomic/FormElements/RadioInput/RadioInput.tsx"],"sourcesContent":["import type { IRadioInputProps } from './RadioInput.interface';\nimport cn from 'classnames';\n\nimport React from 'react';\n\nimport './RadioInput.scss';\n\nconst RC = 'radio-input';\n\nconst RadioInput: React.FC<IRadioInputProps> = ({\n  label,\n  id,\n  checked,\n  name,\n  disabled,\n  className,\n  value,\n  testId = 'radio-input',\n  onChange,\n  attributesOfNativeInput,\n}) => {\n  return (\n    <label\n      data-testid={testId}\n      className={cn(RC, className, { [`${RC}_disabled`]: disabled })}\n      htmlFor={id}\n    >\n      <div\n        className={cn(`${RC}__input`, {\n          [`${RC}__input--checked`]: checked === value,\n        })}\n      >\n        <input\n          id={id}\n          data-testid={`${testId}-input`}\n          type=\"radio\"\n          checked={checked === value}\n          className={`${RC}__radio`}\n          onChange={() => onChange?.(value)}\n          name={name}\n          disabled={disabled}\n          {...attributesOfNativeInput}\n        />\n        <div className={`${RC}__mark`} />\n      </div>\n      {label && <div className={`${RC}__label`}>{label}</div>}\n    </label>\n  );\n};\n\nexport default RadioInput;\n"],"mappings":";;;;;AAOA,IAAM,KAAK;AAEX,IAAM,cAA0C,EAC9C,OACA,IACA,SACA,MACA,UACA,WACA,OACA,SAAS,eACT,UACA,8BACI;CACJ,OACE,qBAAC,SAAD;EACE,eAAa;EACb,WAAW,GAAG,IAAI,WAAW,GAAG,GAAG,GAAG,aAAa,SAAS,CAAC;EAC7D,SAAS;YAHX,CAKE,qBAAC,OAAD;GACE,WAAW,GAAG,GAAG,GAAG,UAAU,GAC3B,GAAG,GAAG,oBAAoB,YAAY,MACzC,CAAC;aAHH,CAKE,oBAAC,SAAD;IACM;IACJ,eAAa,GAAG,OAAO;IACvB,MAAK;IACL,SAAS,YAAY;IACrB,WAAW,GAAG,GAAG;IACjB,gBAAgB,WAAW,KAAK;IAC1B;IACI;IACV,GAAI;GACL,CAAA,GACD,oBAAC,OAAD,EAAK,WAAW,GAAG,GAAG,QAAU,CAAA,CAC7B;MACJ,SAAS,oBAAC,OAAD;GAAK,WAAW,GAAG,GAAG;aAAW;EAAW,CAAA,CACjD;;AAEX"}

package/dist/es/Atomic/FormElements/RadioInput/RadioInput.styles.css

@@ -0,0 +1,70 @@
+/* COLORS*/
+/*GRID*/
+/*FONTS*/
+/*Z-INDEX*/
+/*OTHER*/
+/* THEME COLORS */
+/* COLORS */
+/* GRID */
+/* FONTS */
+:export {
+  primaryColor: #3f51b5;
+  secondaryColor: #f50057;
+  successColor: #4caf50;
+  warningColor: #ff9800;
+  errorColor: #f44336;
+  infoColor: #2196f3;
+  backgroundColor: #ffffff;
+  textColor: #212121;
+  textSecondaryColor: #757575;
+}
+
+.radio-input {
+  display: inline-flex;
+  align-items: center;
+  cursor: pointer;
+}
+.radio-input_disabled .radio-input__input {
+  cursor: auto;
+  pointer-events: none;
+  opacity: 0.3;
+}
+.radio-input:hover .radio-input__input {
+  background-color: #e2e5ec;
+}
+.radio-input__input {
+  position: relative;
+  width: 14px;
+  min-width: 14px;
+  height: 14px;
+  min-height: 14px;
+  border: 1px solid #a6acb1;
+  border-radius: 50%;
+  background-color: white;
+}
+.radio-input__mark {
+  position: absolute;
+  z-index: 1;
+  inset: 0;
+  display: none;
+  width: 10px;
+  height: 10px;
+  margin: auto;
+  border-radius: 50%;
+  background-color: #6b81dd;
+}
+.radio-input .radio-input__radio:checked ~ .radio-input__mark {
+  display: block;
+}
+.radio-input__radio {
+  position: absolute;
+  width: 0;
+  height: 0;
+  opacity: 0;
+}
+.radio-input__label {
+  margin-left: 5px;
+  font-size: 13px;
+  font-weight: 400;
+  user-select: none;
+}

package/dist/es/Atomic/FormElements/RadioInput/index.js

@@ -0,0 +1,7 @@
+import RadioInput from "./RadioInput.js";
+//#region src/Atomic/FormElements/RadioInput/index.ts
+var RadioInput_default = RadioInput;
+//#endregion
+export { RadioInput_default as default };
+
+//# sourceMappingURL=index.js.map

package/dist/es/Atomic/FormElements/RadioInput/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/Atomic/FormElements/RadioInput/index.ts"],"sourcesContent":["import type { IRadioInputProps } from './RadioInput.interface';\nimport RadioInput from './RadioInput';\n\nexport type { IRadioInputProps };\nexport default RadioInput;\n"],"mappings":";;AAIA,IAAA,qBAAe"}