intelicoreact 2.0.17 → 2.0.19

package/dist/es/Atomic/UI/DateTime/DateTime.js

@@ -0,0 +1,45 @@
+import '../../../styles/base.css';
+import './DateTime.styles.css';/* empty css              */
+import cn from "classnames";
+import { useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import moment from "moment-timezone";
+//#region src/Atomic/UI/DateTime/DateTime.tsx
+var RC = "date-time";
+var DEFAULT_DATE_FORMAT = "DD.MM.YYYY";
+var DEFAULT_TIME_FORMAT = "HH:mm:ss";
+var DateTime = ({ className, value, valueFormat, dateFormat: inputDateFormat, timeFormat: inputTimeFormat, isNoDate, isNoTime, testId = "date-time" }) => {
+	const dateFormat = inputDateFormat ?? DEFAULT_DATE_FORMAT;
+	const timeFormat = inputTimeFormat ?? DEFAULT_TIME_FORMAT;
+	const date = useMemo(() => {
+		return (valueFormat ? moment(value, valueFormat) : moment(value)).format(dateFormat);
+	}, [
+		value,
+		valueFormat,
+		dateFormat
+	]);
+	const time = useMemo(() => {
+		return (valueFormat ? moment(value, valueFormat) : moment(value)).format(timeFormat);
+	}, [
+		value,
+		valueFormat,
+		timeFormat
+	]);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-testid": testId,
+		className: cn(RC, className),
+		children: [!isNoDate && /* @__PURE__ */ jsx("span", {
+			"data-testid": `${testId}-date`,
+			className: `${RC}__date`,
+			children: date
+		}), !isNoTime && /* @__PURE__ */ jsx("span", {
+			"data-testid": `${testId}-time`,
+			className: cn(`${RC}__time`, { [`${RC}_color--pause`]: !isNoDate }),
+			children: time
+		})]
+	});
+};
+//#endregion
+export { DateTime as default };
+
+//# sourceMappingURL=DateTime.js.map

package/dist/es/Atomic/UI/DateTime/DateTime.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateTime.js","names":[],"sources":["../../../../../src/Atomic/UI/DateTime/DateTime.tsx"],"sourcesContent":["import type { IDateTimeProps } from './DateTime.interface';\nimport cn from 'classnames';\nimport moment from 'moment-timezone';\nimport React, { useMemo } from 'react';\nimport './DateTime.scss';\n\nconst RC = 'date-time';\n\nconst DEFAULT_DATE_FORMAT = 'DD.MM.YYYY';\nconst DEFAULT_TIME_FORMAT = 'HH:mm:ss';\n\nconst DateTime: React.FC<IDateTimeProps> = ({\n  className,\n  value,\n  valueFormat,\n  dateFormat: inputDateFormat,\n  timeFormat: inputTimeFormat,\n  isNoDate,\n  isNoTime,\n  testId = 'date-time',\n}) => {\n  const dateFormat = inputDateFormat ?? DEFAULT_DATE_FORMAT;\n  const timeFormat = inputTimeFormat ?? DEFAULT_TIME_FORMAT;\n\n  const date = useMemo(() => {\n    return (valueFormat ? moment(value, valueFormat) : moment(value)).format(\n      dateFormat,\n    );\n  }, [value, valueFormat, dateFormat]);\n\n  const time = useMemo(() => {\n    return (valueFormat ? moment(value, valueFormat) : moment(value)).format(\n      timeFormat,\n    );\n  }, [value, valueFormat, timeFormat]);\n\n  return (\n    <div data-testid={testId} className={cn(RC, className)}>\n      {!isNoDate && (\n        <span data-testid={`${testId}-date`} className={`${RC}__date`}>\n          {date}\n        </span>\n      )}\n      {!isNoTime && (\n        <span\n          data-testid={`${testId}-time`}\n          className={cn(`${RC}__time`, {\n            [`${RC}_color--pause`]: !isNoDate,\n          })}\n        >\n          {time}\n        </span>\n      )}\n    </div>\n  );\n};\n\nexport default DateTime;\n"],"mappings":";;;;;;AAMA,IAAM,KAAK;AAEX,IAAM,sBAAsB;AAC5B,IAAM,sBAAsB;AAE5B,IAAM,YAAsC,EAC1C,WACA,OACA,aACA,YAAY,iBACZ,YAAY,iBACZ,UACA,UACA,SAAS,kBACL;CACJ,MAAM,aAAa,mBAAmB;CACtC,MAAM,aAAa,mBAAmB;CAEtC,MAAM,OAAO,cAAc;EACzB,QAAQ,cAAc,OAAO,OAAO,WAAW,IAAI,OAAO,KAAK,EAAA,CAAG,OAChE,UACF;CACF,GAAG;EAAC;EAAO;EAAa;CAAU,CAAC;CAEnC,MAAM,OAAO,cAAc;EACzB,QAAQ,cAAc,OAAO,OAAO,WAAW,IAAI,OAAO,KAAK,EAAA,CAAG,OAChE,UACF;CACF,GAAG;EAAC;EAAO;EAAa;CAAU,CAAC;CAEnC,OACE,qBAAC,OAAD;EAAK,eAAa;EAAQ,WAAW,GAAG,IAAI,SAAS;YAArD,CACG,CAAC,YACA,oBAAC,QAAD;GAAM,eAAa,GAAG,OAAO;GAAQ,WAAW,GAAG,GAAG;aACnD;EACG,CAAA,GAEP,CAAC,YACA,oBAAC,QAAD;GACE,eAAa,GAAG,OAAO;GACvB,WAAW,GAAG,GAAG,GAAG,SAAS,GAC1B,GAAG,GAAG,iBAAiB,CAAC,SAC3B,CAAC;aAEA;EACG,CAAA,CAEL;;AAET"}

package/dist/es/Atomic/UI/DateTime/DateTime.styles.css

@@ -0,0 +1,33 @@
+/* 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;
+}
+
+.date-time {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+}
+.date-time__date, .date-time__time {
+  font-weight: normal;
+}
+.date-time_color--pause {
+  color: #999999;
+}

package/dist/es/Atomic/UI/DebugContainer/DebugContainer.js

@@ -0,0 +1,45 @@
+import '../../../styles/base.css';
+import './DebugContainer.styles.css';/* empty css                    */
+import cn from "classnames";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ChevronDown, ChevronUp } from "react-feather";
+//#region src/Atomic/UI/DebugContainer/DebugContainer.tsx
+var defaultData = {};
+var DebugContainer = ({ data = defaultData, children, className }) => {
+	const [isVisible, setIsVisible] = useState(true);
+	const renderData = () => /* @__PURE__ */ jsxs("pre", { children: [
+		"{\n",
+		Object.keys(data).map((key) => `  ${key}: ${String(data[key])},\n`),
+		"}"
+	] });
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("debug-container", className),
+		"data-testid": "debug-container",
+		children: [isVisible && /* @__PURE__ */ jsxs("div", {
+			className: "debug-container__body",
+			children: [
+				/* @__PURE__ */ jsx("h5", { children: "Debug:" }),
+				data && Object.keys(data).length > 0 && /* @__PURE__ */ jsx("div", {
+					className: "debug-container__body-row",
+					"data-testid": "debug-data",
+					children: renderData()
+				}),
+				children && /* @__PURE__ */ jsx("div", {
+					className: "debug-container__body-row",
+					"data-testid": "debug-children",
+					children
+				})
+			]
+		}), /* @__PURE__ */ jsx("div", {
+			className: "debug-container__toggler",
+			onClick: () => setIsVisible((v) => !v),
+			"data-testid": "debug-toggler",
+			children: isVisible ? /* @__PURE__ */ jsx(ChevronUp, {}) : /* @__PURE__ */ jsx(ChevronDown, {})
+		})]
+	});
+};
+//#endregion
+export { DebugContainer as default };
+
+//# sourceMappingURL=DebugContainer.js.map

package/dist/es/Atomic/UI/DebugContainer/DebugContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugContainer.js","names":[],"sources":["../../../../../src/Atomic/UI/DebugContainer/DebugContainer.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport cn from 'classnames';\nimport React, { useState } from 'react';\nimport { ChevronDown, ChevronUp } from 'react-feather';\nimport './DebugContainer.scss';\n\nexport interface DebugContainerProps {\n  data?: Record<string, any>;\n  children?: ReactNode;\n  className?: string;\n}\n\nconst defaultData: Record<string, any> = {};\nconst DebugContainer: React.FC<DebugContainerProps> = ({ data = defaultData, children, className }) => {\n  const [isVisible, setIsVisible] = useState<boolean>(true);\n\n  const renderData = (): JSX.Element => (\n    <pre>\n      {'{\\n'}\n      {Object.keys(data).map(key => `  ${key}: ${String(data[key])},\\n`)}\n      {'}'}\n    </pre>\n  );\n\n  return (\n    <div className={cn('debug-container', className)} data-testid=\"debug-container\">\n      {isVisible && (\n        <div className=\"debug-container__body\">\n          <h5>Debug:</h5>\n          {data && Object.keys(data).length > 0 && (\n            <div className=\"debug-container__body-row\" data-testid=\"debug-data\">{renderData()}</div>\n          )}\n          {children && (\n            <div className=\"debug-container__body-row\" data-testid=\"debug-children\">{children}</div>\n          )}\n        </div>\n      )}\n      <div\n        className=\"debug-container__toggler\"\n        onClick={() => setIsVisible(v => !v)}\n        data-testid=\"debug-toggler\"\n      >\n        {isVisible ? <ChevronUp /> : <ChevronDown />}\n      </div>\n    </div>\n  );\n};\n\nexport default DebugContainer;\n"],"mappings":";;;;;;AAYA,IAAM,cAAmC,CAAC;AAC1C,IAAM,kBAAiD,EAAE,OAAO,aAAa,UAAU,gBAAgB;CACrG,MAAM,CAAC,WAAW,gBAAgB,SAAkB,IAAI;CAExD,MAAM,mBACJ,qBAAC,OAAD,EAAA,UAAA;EACG;EACA,OAAO,KAAK,IAAI,CAAC,CAAC,KAAI,QAAO,KAAK,IAAI,IAAI,OAAO,KAAK,IAAI,EAAE,IAAI;EAChE;CACE,EAAA,CAAA;CAGP,OACE,qBAAC,OAAD;EAAK,WAAW,GAAG,mBAAmB,SAAS;EAAG,eAAY;YAA9D,CACG,aACC,qBAAC,OAAD;GAAK,WAAU;aAAf;IACE,oBAAC,MAAD,EAAA,UAAI,SAAU,CAAA;IACb,QAAQ,OAAO,KAAK,IAAI,CAAC,CAAC,SAAS,KAClC,oBAAC,OAAD;KAAK,WAAU;KAA4B,eAAY;eAAc,WAAW;IAAO,CAAA;IAExF,YACC,oBAAC,OAAD;KAAK,WAAU;KAA4B,eAAY;KAAkB;IAAc,CAAA;GAEtF;MAEP,oBAAC,OAAD;GACE,WAAU;GACV,eAAe,cAAa,MAAK,CAAC,CAAC;GACnC,eAAY;aAEX,YAAY,oBAAC,WAAD,CAAY,CAAA,IAAI,oBAAC,aAAD,CAAc,CAAA;EACxC,CAAA,CACF;;AAET"}

package/dist/es/Atomic/UI/DebugContainer/DebugContainer.styles.css

@@ -0,0 +1,32 @@
+.debug-container {
+  position: fixed;
+  z-index: 999;
+  top: 0;
+  left: 0;
+  box-sizing: border-box;
+  width: 100%;
+  color: #fff;
+  background-color: rgba(0, 0, 0, 0.8);
+}
+.debug-container__body {
+  padding: 8px 16px;
+}
+.debug-container__toggler {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  padding: 4px 16px;
+  border-radius: 0 0 4px;
+  background-color: rgba(0, 0, 0, 0.8);
+  transform: translateY(100%);
+}
+.debug-container__toggler svg {
+  width: 16px;
+  height: 16px;
+  color: #fff;
+}
+.debug-container h5,
+.debug-container pre {
+  margin: 0;
+  margin-bottom: 8px;
+}

package/dist/es/Atomic/UI/DebugContainer/useDebugContainer.js

@@ -0,0 +1,16 @@
+import DebugContainer from "./DebugContainer.js";
+import { useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Atomic/UI/DebugContainer/useDebugContainer.tsx
+function useDebugContainer() {
+	const [data, setData] = useState({});
+	return {
+		debugData: data,
+		setDebugData: setData,
+		renderDebugContainer: /* @__PURE__ */ jsx(DebugContainer, { data })
+	};
+}
+//#endregion
+export { useDebugContainer as default };
+
+//# sourceMappingURL=useDebugContainer.js.map

package/dist/es/Atomic/UI/DebugContainer/useDebugContainer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebugContainer.js","names":[],"sources":["../../../../../src/Atomic/UI/DebugContainer/useDebugContainer.tsx"],"sourcesContent":["import { useState } from 'react';\nimport DebugContainer from './DebugContainer';\n\nexport interface UseDebugContainer {\n  debugData: Record<string, any>;\n  setDebugData: React.Dispatch<React.SetStateAction<Record<string, any>>>;\n  renderDebugContainer: JSX.Element;\n}\n\nfunction useDebugContainer(): UseDebugContainer {\n  const [data, setData] = useState<Record<string, any>>({});\n\n  return {\n    debugData: data,\n    setDebugData: setData,\n    renderDebugContainer: <DebugContainer data={data} />,\n  };\n}\n\nexport default useDebugContainer;\n"],"mappings":";;;;AASA,SAAS,oBAAuC;CAC9C,MAAM,CAAC,MAAM,WAAW,SAA8B,CAAC,CAAC;CAExD,OAAO;EACL,WAAW;EACX,cAAc;EACd,sBAAsB,oBAAC,gBAAD,EAAsB,KAAO,CAAA;CACrD;AACF"}

package/dist/es/Atomic/UI/DoubleString/DoubleString.js

@@ -0,0 +1,77 @@
+import '../../../styles/base.css';
+import './DoubleString.styles.css';/* empty css                  */
+import cn from "classnames";
+import { useEffect, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import moment from "moment";
+import { Eye, EyeOff } from "react-feather";
+//#region src/Atomic/UI/DoubleString/DoubleString.tsx
+var RC = "double-string";
+var DoubleString = ({ value, description, subDescription, valuePostfix, className, testId = "double-string", isFormatValueToDate, isUseOnClick, dateFormatSettings: { parseFormat = "MM.DD.YYYY", displayFormat = "MM.DD.YYYY" } = {}, revert = false, noTitle, isUseHideMode = false, isShowHiddenValueAvailable = false }) => {
+	const [isValueHidden, setIsValueHidden] = useState(isUseHideMode);
+	const computedValue = isFormatValueToDate ? moment(value, parseFormat).format(displayFormat) : value;
+	const valueRef = useRef(null);
+	const descriptionRef = useRef(null);
+	const [elemsWidth, setElemsWidth] = useState({
+		valueWidth: 0,
+		descriptionWidth: 0
+	});
+	const [isOnClickON, setIsOnClickON] = useState(false);
+	const handle = { click: () => {
+		setIsOnClickON(!isOnClickON);
+	} };
+	useEffect(() => {
+		const valueWidth = valueRef?.current?.clientWidth ?? 0;
+		const descriptionWidth = descriptionRef?.current?.clientWidth ?? 0;
+		setElemsWidth({
+			valueWidth,
+			descriptionWidth
+		});
+	}, [descriptionRef, valueRef]);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-testid": testId,
+		className: cn(RC, className),
+		children: [
+			/* @__PURE__ */ jsx("p", {
+				onClick: () => handle.click(),
+				ref: valueRef,
+				className: cn(`${RC}__value`, { "double-string--value-opened": isOnClickON && isUseOnClick }, { pointer: isUseOnClick }),
+				title: !noTitle && elemsWidth.valueWidth > 99 ? computedValue : "",
+				children: !revert ? /* @__PURE__ */ jsxs(Fragment, { children: [
+					isUseHideMode ? /* @__PURE__ */ jsx("span", { children: !isValueHidden ? computedValue : "*********" }) : computedValue,
+					isUseHideMode && isShowHiddenValueAvailable && isValueHidden && /* @__PURE__ */ jsx(Eye, {
+						"data-testid": "double-string-eye",
+						className: `${RC}__hide-mode-icon`,
+						onClick: () => setIsValueHidden(false)
+					}),
+					isUseHideMode && isShowHiddenValueAvailable && !isValueHidden && /* @__PURE__ */ jsx(EyeOff, {
+						"data-testid": "double-string-eyeoff",
+						className: `${RC}__hide-mode-icon`,
+						onClick: () => setIsValueHidden(true)
+					}),
+					valuePostfix && /* @__PURE__ */ jsx("span", {
+						className: cn(`${RC}__value-postfix`),
+						children: valuePostfix
+					})
+				] }) : description
+			}),
+			/* @__PURE__ */ jsx("p", {
+				ref: descriptionRef,
+				className: cn(`${RC}__description`),
+				title: !noTitle && elemsWidth.descriptionWidth > 99 ? computedValue : "",
+				children: !revert ? description : /* @__PURE__ */ jsxs(Fragment, { children: [computedValue, valuePostfix && /* @__PURE__ */ jsx("span", {
+					className: cn(`${RC}__value-postfix`),
+					children: valuePostfix
+				})] })
+			}),
+			subDescription && /* @__PURE__ */ jsx("p", {
+				className: cn(`${RC}__sub-description`),
+				children: subDescription
+			})
+		]
+	});
+};
+//#endregion
+export { DoubleString as default };
+
+//# sourceMappingURL=DoubleString.js.map

package/dist/es/Atomic/UI/DoubleString/DoubleString.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DoubleString.js","names":[],"sources":["../../../../../src/Atomic/UI/DoubleString/DoubleString.tsx"],"sourcesContent":["import type { IDoubleStringProps } from './DoubleString.interface';\n\nimport cn from 'classnames';\nimport moment from 'moment';\nimport React, { useEffect, useRef, useState } from 'react';\n\nimport { Eye, EyeOff } from 'react-feather';\n\nimport './DoubleString.scss';\n\nconst RC = 'double-string';\n\nconst DoubleString: React.FC<IDoubleStringProps> = ({\n  value,\n  description,\n  subDescription,\n  valuePostfix,\n  className,\n  testId = 'double-string',\n  isFormatValueToDate,\n  isUseOnClick,\n  dateFormatSettings: {\n    parseFormat = 'MM.DD.YYYY',\n    displayFormat = 'MM.DD.YYYY',\n  } = {},\n  revert = false,\n  noTitle,\n  isUseHideMode = false,\n  isShowHiddenValueAvailable = false,\n}) => {\n  const [isValueHidden, setIsValueHidden] = useState(isUseHideMode);\n\n  const computedValue = isFormatValueToDate ? moment(value, parseFormat).format(displayFormat) : value;\n\n  const valueRef = useRef<HTMLParagraphElement | null>(null); ;\n  const descriptionRef = useRef<HTMLParagraphElement | null>(null);\n\n  const [elemsWidth, setElemsWidth] = useState({\n    valueWidth: 0,\n    descriptionWidth: 0,\n  });\n  const [isOnClickON, setIsOnClickON] = useState(false);\n\n  const handle = {\n    click: () => {\n      setIsOnClickON(!isOnClickON);\n    },\n  };\n\n  useEffect(() => {\n    const valueWidth = valueRef?.current?.clientWidth ?? 0;\n    const descriptionWidth = descriptionRef?.current?.clientWidth ?? 0;\n\n    setElemsWidth({ valueWidth, descriptionWidth });\n  }, [descriptionRef, valueRef]);\n\n  return (\n    <div data-testid={testId} className={cn(RC, className)}>\n      <p\n        onClick={() => handle.click()}\n        ref={valueRef}\n        className={cn(\n          `${RC}__value`,\n          {\n            'double-string--value-opened': isOnClickON && isUseOnClick,\n          },\n          { pointer: isUseOnClick },\n        )}\n        title={!noTitle && elemsWidth.valueWidth > 99 ? computedValue : ''}\n      >\n        {!revert\n          ? (\n              <>\n                {isUseHideMode ? <span>{!isValueHidden ? computedValue : '*********'}</span> : computedValue}\n                {isUseHideMode && isShowHiddenValueAvailable && isValueHidden && <Eye data-testid=\"double-string-eye\" className={`${RC}__hide-mode-icon`} onClick={() => setIsValueHidden(false)} />}\n                {isUseHideMode && isShowHiddenValueAvailable && !isValueHidden && <EyeOff data-testid=\"double-string-eyeoff\" className={`${RC}__hide-mode-icon`} onClick={() => setIsValueHidden(true)} />}\n                {valuePostfix && (\n                  <span className={cn(`${RC}__value-postfix`)}>{valuePostfix}</span>\n                )}\n              </>\n            )\n          : (\n              description\n            )}\n      </p>\n\n      <p\n        ref={descriptionRef}\n        className={cn(`${RC}__description`)}\n        title={!noTitle && elemsWidth.descriptionWidth > 99 ? computedValue : ''}\n      >\n        {!revert\n          ? (\n              description\n            )\n          : (\n              <>\n                {computedValue}\n                {valuePostfix && (\n                  <span className={cn(`${RC}__value-postfix`)}>{valuePostfix}</span>\n                )}\n              </>\n            )}\n      </p>\n      {subDescription && (\n        <p className={cn(`${RC}__sub-description`)}>\n          {subDescription}\n        </p>\n      )}\n    </div>\n  );\n};\n\nexport default DoubleString;\n"],"mappings":";;;;;;;AAUA,IAAM,KAAK;AAEX,IAAM,gBAA8C,EAClD,OACA,aACA,gBACA,cACA,WACA,SAAS,iBACT,qBACA,cACA,oBAAoB,EAClB,cAAc,cACd,gBAAgB,iBACd,CAAC,GACL,SAAS,OACT,SACA,gBAAgB,OAChB,6BAA6B,YACzB;CACJ,MAAM,CAAC,eAAe,oBAAoB,SAAS,aAAa;CAEhE,MAAM,gBAAgB,sBAAsB,OAAO,OAAO,WAAW,CAAC,CAAC,OAAO,aAAa,IAAI;CAE/F,MAAM,WAAW,OAAoC,IAAI;CACzD,MAAM,iBAAiB,OAAoC,IAAI;CAE/D,MAAM,CAAC,YAAY,iBAAiB,SAAS;EAC3C,YAAY;EACZ,kBAAkB;CACpB,CAAC;CACD,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CAEpD,MAAM,SAAS,EACb,aAAa;EACX,eAAe,CAAC,WAAW;CAC7B,EACF;CAEA,gBAAgB;EACd,MAAM,aAAa,UAAU,SAAS,eAAe;EACrD,MAAM,mBAAmB,gBAAgB,SAAS,eAAe;EAEjE,cAAc;GAAE;GAAY;EAAiB,CAAC;CAChD,GAAG,CAAC,gBAAgB,QAAQ,CAAC;CAE7B,OACE,qBAAC,OAAD;EAAK,eAAa;EAAQ,WAAW,GAAG,IAAI,SAAS;YAArD;GACE,oBAAC,KAAD;IACE,eAAe,OAAO,MAAM;IAC5B,KAAK;IACL,WAAW,GACT,GAAG,GAAG,UACN,EACE,+BAA+B,eAAe,aAChD,GACA,EAAE,SAAS,aAAa,CAC1B;IACA,OAAO,CAAC,WAAW,WAAW,aAAa,KAAK,gBAAgB;cAE/D,CAAC,SAEI,qBAAA,UAAA,EAAA,UAAA;KACG,gBAAgB,oBAAC,QAAD,EAAA,UAAO,CAAC,gBAAgB,gBAAgB,YAAkB,CAAA,IAAI;KAC9E,iBAAiB,8BAA8B,iBAAiB,oBAAC,KAAD;MAAK,eAAY;MAAoB,WAAW,GAAG,GAAG;MAAmB,eAAe,iBAAiB,KAAK;KAAI,CAAA;KAClL,iBAAiB,8BAA8B,CAAC,iBAAiB,oBAAC,QAAD;MAAQ,eAAY;MAAuB,WAAW,GAAG,GAAG;MAAmB,eAAe,iBAAiB,IAAI;KAAI,CAAA;KACxL,gBACC,oBAAC,QAAD;MAAM,WAAW,GAAG,GAAG,GAAG,gBAAgB;gBAAI;KAAmB,CAAA;IAEnE,EAAA,CAAA,IAGF;GAEL,CAAA;GAEH,oBAAC,KAAD;IACE,KAAK;IACL,WAAW,GAAG,GAAG,GAAG,cAAc;IAClC,OAAO,CAAC,WAAW,WAAW,mBAAmB,KAAK,gBAAgB;cAErE,CAAC,SAEI,cAGA,qBAAA,UAAA,EAAA,UAAA,CACG,eACA,gBACC,oBAAC,QAAD;KAAM,WAAW,GAAG,GAAG,GAAG,gBAAgB;eAAI;IAAmB,CAAA,CAEnE,EAAA,CAAA;GAEP,CAAA;GACF,kBACC,oBAAC,KAAD;IAAG,WAAW,GAAG,GAAG,GAAG,kBAAkB;cACtC;GACA,CAAA;EAEF;;AAET"}

package/dist/es/Atomic/UI/DoubleString/DoubleString.styles.css

@@ -0,0 +1,42 @@
+.double-string {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
+  min-width: 0;
+}
+.double-string__value, .double-string__description, .double-string__sub-description {
+  font-family: inherit;
+  font-size: inherit;
+  font-weight: inherit;
+  font-style: inherit;
+  color: inherit;
+}
+.double-string__value {
+  overflow: hidden;
+  max-width: 100%;
+  margin: 0 0 4px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.double-string__description {
+  margin: 0;
+  color: #9aa0b9;
+}
+.double-string__sub-description {
+  margin: 0;
+  color: #9aa0b9;
+}
+.double-string--value-opened {
+  white-space: unset;
+  text-overflow: unset;
+}
+.double-string__hide-mode-icon {
+  width: 16px;
+  height: 16px;
+  margin-left: 4px;
+  cursor: pointer;
+  pointer-events: all;
+  color: #6b81dd;
+}

package/dist/es/Atomic/UI/DoubleString/index.js

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

package/dist/es/Atomic/UI/DoubleString/index.js.map

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

package/dist/es/Atomic/UI/Hint/Hint.js

@@ -0,0 +1,218 @@
+import '../../../styles/base.css';
+import { capitalized } from "../../../Functions/utils.js";
+import Spinner from "../../Layout/Spinner/Spinner.js";
+import { HelpCircleFilled } from "../../../Molecular/CustomIcons/components/HelpCircleFilled.js";
+import { I_AM_OPENED_EVENT_NAME, I_AM_OPENED_EVENT_OPTIONS } from "./partials/_constants.js";
+import { HandleClickOutsideObj, HandleScrollObj, getHintContainer, initHintContainer } from "./partials/_utils.js";
+import './Hint.styles.css';/* empty css          */
+import cn from "classnames";
+import { useEffect, useRef, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { AlertTriangle, HelpCircle } from "react-feather";
+import { createPortal } from "react-dom";
+//#region src/Atomic/UI/Hint/Hint.tsx
+var hintTimeoutMap = /* @__PURE__ */ new Map();
+var isContentHoveredOuter = false;
+var DEFAULT_EMPTY_OBJ = {};
+function DEFAULT_VOID_FN() {}
+var Hint = ({ hint, side = "right", className, hintContainer = DEFAULT_EMPTY_OBJ, label = "", variant = "filled", handleOpenType = "click", onClickCallback, onOpenChange = DEFAULT_VOID_FN, key, id, children, icon, isAccessability = false, testId = "hint", isHoverableContent = false, isLoading, isCloseOnChildrenClick = false }) => {
+	const hintRef = useRef(null);
+	const [hintId] = useState(id ?? key ?? Math.random().toString(16).slice(2));
+	const [iAmOpenedOptions] = useState({
+		...I_AM_OPENED_EVENT_OPTIONS,
+		detail: { hintId }
+	});
+	const [isOpen, setIsOpen] = useState(false);
+	const [isStyleComputed, setIsStyleComputed] = useState(false);
+	const [handleScroll] = useState(new HandleScrollObj(setIsOpen));
+	const [handleClickOutside] = useState(new HandleClickOutsideObj(hintId, setIsOpen));
+	const isCallbackExist = typeof onClickCallback === "function";
+	const handle = {
+		onMouseEnter: () => {
+			const existing = hintTimeoutMap.get(hintId);
+			if (existing) clearTimeout(existing);
+			if (handleOpenType === "hover") {
+				const timer = setTimeout(() => {
+					setIsOpen(true);
+					!isOpen && onClickCallback?.();
+					hintRef.current?.dispatchEvent?.(new CustomEvent(I_AM_OPENED_EVENT_NAME, iAmOpenedOptions));
+				}, 350);
+				hintTimeoutMap.set(hintId, timer);
+			}
+		},
+		onMouseLeave: () => {
+			const existing = hintTimeoutMap.get(hintId);
+			if (existing) clearTimeout(existing);
+			if (!isHoverableContent && handleOpenType === "hover") {
+				const timer = setTimeout(() => {
+					setIsOpen(false);
+					hintTimeoutMap.delete(hintId);
+				}, 1e3);
+				hintTimeoutMap.set(hintId, timer);
+			} else if (isHoverableContent && handleOpenType === "hover") {
+				const timer = setTimeout(() => {
+					if (!isContentHoveredOuter) setIsOpen(false);
+					hintTimeoutMap.delete(hintId);
+				}, 100);
+				hintTimeoutMap.set(hintId, timer);
+			}
+		},
+		onMouseLeaveHoverableContent: () => {
+			const existing = hintTimeoutMap.get(hintId);
+			if (existing) clearTimeout(existing);
+			if (isHoverableContent && handleOpenType === "hover") {
+				const timer = setTimeout(() => {
+					setIsOpen(false);
+					isContentHoveredOuter = false;
+					hintTimeoutMap.delete(hintId);
+				}, 100);
+				hintTimeoutMap.set(hintId, timer);
+			}
+		},
+		onClick: isCloseOnChildrenClick ? () => setIsOpen(false) : () => {}
+	};
+	const getHintMarkUp = (className) => {
+		return /* @__PURE__ */ jsxs("div", {
+			"data-testid": "test-hint-text",
+			className: cn("hint__text", `hint__text_${side}`, `hint--${className}__text`),
+			onMouseEnter: () => {
+				if (isHoverableContent) isContentHoveredOuter = true;
+			},
+			onMouseLeave: isHoverableContent ? handle.onMouseLeaveHoverableContent : void 0,
+			onClick: handle.onClick,
+			style: { visibility: isStyleComputed ? "visible" : "hidden" },
+			children: [
+				isLoading && /* @__PURE__ */ jsx(Spinner, { size: "small" }),
+				hint,
+				children
+			]
+		});
+	};
+	const setHintContainerStyles = () => {
+		const hc = getHintContainer(hintId);
+		if (!hc || !isOpen) return false;
+		const { width = 0, top = 0, left = 0 } = hintRef?.current !== null ? (hintRef?.current)?.getBoundingClientRect() : {};
+		const { addWidth, addLeft, addTop } = hintContainer ?? {};
+		const windowInnerWidth = document.documentElement.clientWidth;
+		const windowInnerHeight = document.documentElement.clientHeight;
+		const sw = hc.getElementsByClassName("hint__text")[0];
+		const { width: swWidth, height: swHeight } = sw?.getBoundingClientRect() || {};
+		hc.style.width = isOpen ? ((addWidth && !Number.isNaN(+addWidth) ? +addWidth : 0) + width)?.toString().concat("px") : "0";
+		hc.style.left = isOpen ? ((addLeft && !Number.isNaN(+addLeft) ? +addLeft : 0) + left)?.toString().concat("px") : "0";
+		hc.style.top = isOpen ? ((addTop && !Number.isNaN(+addTop) ? +addTop : 0) + top)?.toString().concat("px") : "0";
+		hc.style.maxHeight = isOpen ? swHeight?.toString().concat("px") : "0";
+		const INACCURACY = 20;
+		switch (side) {
+			case "top":
+			case "centeredTop":
+				if (top - swHeight - INACCURACY / 2 < 0) {
+					sw.classList.remove(`hint__text_${side}`);
+					sw.classList.add(`hint__text_${side === "top" ? "bottom" : "centeredBottom"}`);
+				}
+				break;
+			case "bottom":
+			case "centeredBottom":
+				if (top + swHeight + INACCURACY > windowInnerHeight) {
+					sw.classList.remove(`hint__text_${side}`);
+					sw.classList.add(`hint__text_${side === "bottom" ? "top" : "centeredTop"}`);
+				}
+				break;
+			case "left":
+				if (left - swWidth - INACCURACY / 2 < 0) {
+					sw.classList.remove(`hint__text_${side}`);
+					sw.classList.add("hint__text_right");
+				}
+				break;
+			default:
+				if (left + width + swWidth + INACCURACY / 2 > windowInnerWidth) {
+					sw.classList.remove(`hint__text_${side}`);
+					sw.classList.add("hint__text_left");
+				}
+				break;
+		}
+		setIsStyleComputed(true);
+	};
+	const renderHintContainer = (className) => {
+		const hc = getHintContainer(hintId);
+		if (!hc) return null;
+		return createPortal(getHintMarkUp(className), hc);
+	};
+	useEffect(() => {
+		initHintContainer(hintId, hintContainer);
+		const iAmOpenedCallback = (ev) => {
+			const event = ev;
+			if (event?.detail?.hintId !== hintId) {
+				setIsOpen(false);
+				const timer = hintTimeoutMap.get(hintId);
+				if (timer) {
+					clearTimeout(timer);
+					hintTimeoutMap.delete(hintId);
+				}
+			}
+			return event;
+		};
+		if (hintRef.current) document.addEventListener(I_AM_OPENED_EVENT_NAME, iAmOpenedCallback);
+		return () => {
+			document.removeEventListener(I_AM_OPENED_EVENT_NAME, iAmOpenedCallback);
+			const timer = hintTimeoutMap.get(hintId);
+			if (timer) {
+				clearTimeout(timer);
+				hintTimeoutMap.delete(hintId);
+			}
+		};
+	}, []);
+	useEffect(() => {
+		setIsStyleComputed(false);
+		setHintContainerStyles();
+		onOpenChange?.(isOpen);
+		if (isOpen) {
+			document.addEventListener("scroll", handleScroll, true);
+			document.addEventListener("click", handleClickOutside, true);
+		} else {
+			document.removeEventListener("scroll", handleScroll, true);
+			document.removeEventListener("click", handleClickOutside, true);
+		}
+		return () => {
+			const timer = hintTimeoutMap.get(hintId);
+			if (timer) {
+				clearTimeout(timer);
+				hintTimeoutMap.delete(hintId);
+			}
+		};
+	}, [isOpen]);
+	return /* @__PURE__ */ jsxs("div", {
+		"data-testid": testId,
+		className: cn("hint", className),
+		ref: hintRef,
+		children: [/* @__PURE__ */ jsxs("button", {
+			tabIndex: isAccessability ? 0 : -1,
+			"data-testid": typeof label === "string" && label.length ? label.replace?.(/\s/g, "-") : `${testId}--button`,
+			"aria-label": isAccessability && typeof label === "string" ? label : "",
+			onClick: () => handleOpenType === "click" && (isCallbackExist ? onClickCallback?.() : setIsOpen(!isOpen)),
+			onMouseEnter: handle.onMouseEnter,
+			onMouseLeave: handle.onMouseLeave,
+			className: cn("hint__button", { hint__button_active: isOpen }),
+			children: [icon || icon === null || /* @__PURE__ */ jsxs(Fragment, { children: [
+				variant === "outlined" && /* @__PURE__ */ jsx(HelpCircle, {
+					width: 16,
+					height: 16,
+					className: "hint__icon outlined"
+				}),
+				variant === "filled" && /* @__PURE__ */ jsx(HelpCircleFilled, { className: "hint__icon filled" }),
+				variant === "warning" && /* @__PURE__ */ jsx(AlertTriangle, {
+					className: "hint__icon",
+					color: "#F06D8D",
+					width: 16,
+					height: 16
+				})
+			] }), label && /* @__PURE__ */ jsx("span", {
+				className: cn("hint__label", { "color--primary": isOpen }),
+				children: typeof label === "string" ? capitalized(label) : label
+			})]
+		}), isOpen && renderHintContainer(className)]
+	});
+};
+//#endregion
+export { Hint as default };
+
+//# sourceMappingURL=Hint.js.map

package/dist/es/Atomic/UI/Hint/Hint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Hint.js","names":[],"sources":["../../../../../src/Atomic/UI/Hint/Hint.tsx"],"sourcesContent":["/* eslint-disable react-web-api/no-leaked-event-listener */\n/* eslint-disable react-dom/no-missing-button-type */\nimport type { ReactNode } from 'react';\nimport type { IHintProps } from './Hint.interface';\n\nimport cn from 'classnames';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { AlertTriangle, HelpCircle } from 'react-feather';\n\nimport { capitalized } from '../../../Functions/utils';\nimport { HelpCircleFilled } from '../../../Molecular/CustomIcons';\n\nimport Spinner from '../../Layout/Spinner/Spinner';\n\nimport { I_AM_OPENED_EVENT_NAME, I_AM_OPENED_EVENT_OPTIONS } from './partials/_constants';\nimport { getHintContainer, HandleClickOutsideObj, HandleScrollObj, initHintContainer } from './partials/_utils';\n\nimport './Hint.scss';\n\n// Глобальный мап для хранения таймеров по hintId\nconst hintTimeoutMap = new Map<string, NodeJS.Timeout>();\n\nlet isContentHoveredOuter = false;\n\nconst DEFAULT_EMPTY_OBJ = {} as IHintProps['hintContainer'];\n\nfunction DEFAULT_VOID_FN(): void {}\n\ninterface IIAmOpenedDetails {\n  hintId: string;\n}\n\nconst Hint: React.FC<IHintProps> = ({\n  hint,\n  side = 'right',\n  className,\n  hintContainer = DEFAULT_EMPTY_OBJ,\n  label = '',\n  variant = 'filled',\n  handleOpenType = 'click',\n  onClickCallback,\n  onOpenChange = DEFAULT_VOID_FN,\n  key,\n  id,\n  children,\n  icon,\n  isAccessability = false,\n  testId = 'hint',\n  isHoverableContent = false,\n  isLoading,\n  isCloseOnChildrenClick = false,\n}) => {\n  const hintRef = useRef(null);\n  const [hintId] = useState<string>(id ?? key ?? Math.random().toString(16).slice(2));\n  const [iAmOpenedOptions] = useState<Record<string, any>>({ ...I_AM_OPENED_EVENT_OPTIONS, detail: { hintId } });\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n  const [isStyleComputed, setIsStyleComputed] = useState<boolean>(false);\n\n  // ? Определяем handleScroll-стейт, чтобы никогда не менять ссылку тем самым гарантировать корректную работу removeEventListener.\n  // ? Инициализируем стейт вызовом конструктора HandleScrollObj, передаем setIsOpen для записи в объект.\n  const [handleScroll] = useState(new (HandleScrollObj as any)(setIsOpen));\n  // ? По аналогии определяем handleClickOutside\n  const [handleClickOutside] = useState(new (HandleClickOutsideObj as any)(hintId, setIsOpen));\n\n  const isCallbackExist: boolean = typeof onClickCallback === 'function';\n\n  const handle = {\n    onMouseEnter: (): void => {\n      const existing = hintTimeoutMap.get(hintId);\n      if (existing) clearTimeout(existing);\n\n      if (handleOpenType === 'hover') {\n        const timer = setTimeout(() => {\n          setIsOpen(true);\n          !isOpen && onClickCallback?.();\n\n          // ? (FIN-10491) Идея следующая:\n          // ? Любой hint как только он открывается \"широковещательно орёт\" - \"я открыт!\"\n          // ? И, в свою очередь, любой hint слушает \"широковещательный ор\" и как услышит \"думает\" - \"а это не я ли случайно открыт?\".\n          // ? Если НЕ он, то тогда он принудительно закрывается\n\n          // ? В качестве \"широковещательного ора\" используем систему:\n          // ?  - диспатчим на \"себе\" ВСПЛЫВАЮЩИЙ кастомный ивент\n          // ?  - но чтобы \"слышать голоса\" всех хинтов \"слушаем\" на начальной точке всплытия (т.е. на document)\n          // @ts-ignore\n          hintRef.current?.dispatchEvent?.(new CustomEvent(I_AM_OPENED_EVENT_NAME, iAmOpenedOptions));\n        }, 350);\n        hintTimeoutMap.set(hintId, timer);\n      }\n    },\n    onMouseLeave: (): void => {\n      const existing = hintTimeoutMap.get(hintId);\n      if (existing) clearTimeout(existing);\n\n      if (!isHoverableContent && handleOpenType === 'hover') {\n        const timer = setTimeout(() => {\n          setIsOpen(false);\n          hintTimeoutMap.delete(hintId);\n        }, 1000);\n        hintTimeoutMap.set(hintId, timer);\n      }\n      else if (isHoverableContent && handleOpenType === 'hover') {\n        const timer = setTimeout(() => {\n          if (!isContentHoveredOuter) {\n            setIsOpen(false);\n          }\n          hintTimeoutMap.delete(hintId);\n        }, 100);\n        hintTimeoutMap.set(hintId, timer);\n      }\n    },\n    onMouseLeaveHoverableContent: (): void => {\n      const existing = hintTimeoutMap.get(hintId);\n      if (existing) clearTimeout(existing);\n\n      if (isHoverableContent && handleOpenType === 'hover') {\n        const timer = setTimeout(() => {\n          setIsOpen(false);\n          isContentHoveredOuter = false;\n          hintTimeoutMap.delete(hintId);\n        }, 100);\n        hintTimeoutMap.set(hintId, timer);\n      }\n    },\n    onClick: isCloseOnChildrenClick ? (): void => setIsOpen(false) : (): void => {},\n  };\n\n  const getHintMarkUp = (className: string | undefined): ReactNode => {\n    return (\n      <div\n        data-testid=\"test-hint-text\"\n        className={cn('hint__text', `hint__text_${side}`, `hint--${className}__text`)}\n        onMouseEnter={(): void => {\n          if (isHoverableContent) isContentHoveredOuter = true;\n        }}\n        onMouseLeave={isHoverableContent ? handle.onMouseLeaveHoverableContent : undefined}\n        onClick={handle.onClick}\n        style={{ visibility: isStyleComputed ? 'visible' : 'hidden' }}\n      >\n        {isLoading && <Spinner size=\"small\" />}\n        {hint}\n        {children}\n      </div>\n    );\n  };\n\n  const setHintContainerStyles = (): void | boolean => {\n    const hc = getHintContainer(hintId);\n\n    if (!hc || !isOpen) return false;\n\n    const { width = 0, top = 0, left = 0 } = hintRef?.current !== null ? (hintRef?.current as HTMLElement)?.getBoundingClientRect() : {};\n    const { addWidth, addLeft, addTop } = hintContainer ?? {};\n    const windowInnerWidth = document.documentElement.clientWidth;\n    const windowInnerHeight = document.documentElement.clientHeight;\n\n    const sw = hc.getElementsByClassName('hint__text')[0];\n    const { width: swWidth, height: swHeight } = sw?.getBoundingClientRect() || {};\n\n    hc.style.width = isOpen ? ((addWidth && !Number.isNaN(+addWidth) ? +addWidth : 0) + width)?.toString().concat('px') : '0';\n    hc.style.left = isOpen ? ((addLeft && !Number.isNaN(+addLeft) ? +addLeft : 0) + left)?.toString().concat('px') : '0';\n    hc.style.top = isOpen ? ((addTop && !Number.isNaN(+addTop) ? +addTop : 0) + top)?.toString().concat('px') : '0';\n    hc.style.maxHeight = isOpen ? swHeight?.toString().concat('px') : '0';\n\n    // ? Базовое значение погрешности\n    // ? В разных свитч-кейсах может использоваться по разному (вся или частично). Определял \"на глазок\"\n    const INACCURACY = 20;\n    switch (side) {\n      case 'top':\n      case 'centeredTop':\n        if (top - swHeight - (INACCURACY / 2) < 0) {\n          sw.classList.remove(`hint__text_${side}`);\n          sw.classList.add(`hint__text_${side === 'top' ? 'bottom' : 'centeredBottom'}`);\n        }\n        break;\n\n      case 'bottom':\n      case 'centeredBottom':\n        if (top + swHeight + INACCURACY > windowInnerHeight) {\n          sw.classList.remove(`hint__text_${side}`);\n          sw.classList.add(`hint__text_${side === 'bottom' ? 'top' : 'centeredTop'}`);\n        }\n        break;\n\n      case 'left':\n        if (left - swWidth - (INACCURACY / 2) < 0) {\n          sw.classList.remove(`hint__text_${side}`);\n          sw.classList.add('hint__text_right');\n        }\n        break;\n\n      case 'right':\n      default:\n        if (left + width + swWidth + (INACCURACY / 2) > windowInnerWidth) {\n          sw.classList.remove(`hint__text_${side}`);\n          sw.classList.add('hint__text_left');\n        }\n        break;\n    }\n\n    setIsStyleComputed(true);\n  };\n\n  const renderHintContainer = (className: string | undefined): React.ReactPortal | null => {\n    const hc = getHintContainer(hintId);\n    if (!hc) return null;\n    return createPortal(getHintMarkUp(className), hc);\n  }\n\n  useEffect(() => {\n    initHintContainer(hintId, hintContainer);\n\n    // ? useEffect по нулевой зависимости запускается 1 раз, поэтому ссылка на колбек не изменится\n    const iAmOpenedCallback = (ev: Event): CustomEvent<IIAmOpenedDetails> => {\n      const event = ev as CustomEvent<IIAmOpenedDetails>;\n      if (event?.detail?.hintId !== hintId) {\n        setIsOpen(false);\n        const timer = hintTimeoutMap.get(hintId);\n        if (timer) {\n          clearTimeout(timer);\n          hintTimeoutMap.delete(hintId);\n        }\n      }\n      return event;\n    };\n\n    if (hintRef.current) {\n      // ? Устанавливаем прослушку на начальной точке всплытия\n      document.addEventListener(I_AM_OPENED_EVENT_NAME, iAmOpenedCallback);\n    }\n\n    return () => {\n      document.removeEventListener(I_AM_OPENED_EVENT_NAME, iAmOpenedCallback);\n      const timer = hintTimeoutMap.get(hintId);\n      if (timer) {\n        clearTimeout(timer);\n        hintTimeoutMap.delete(hintId);\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    setIsStyleComputed(false);\n    setHintContainerStyles();\n    onOpenChange?.(isOpen);\n\n    if (isOpen) {\n      document.addEventListener('scroll', handleScroll, true);\n      document.addEventListener('click', handleClickOutside, true);\n    }\n    else {\n      document.removeEventListener('scroll', handleScroll, true);\n      document.removeEventListener('click', handleClickOutside, true);\n    }\n\n    return () => {\n      const timer = hintTimeoutMap.get(hintId);\n      if (timer) {\n        clearTimeout(timer);\n        hintTimeoutMap.delete(hintId);\n      }\n    };\n  }, [isOpen]);\n\n  return (\n    <div data-testid={testId} className={cn('hint', className)} ref={hintRef}>\n      <button\n        tabIndex={isAccessability ? 0 : -1}\n        data-testid={typeof label === 'string' && label.length ? label.replace?.(/\\s/g, '-') : `${testId}--button`}\n        aria-label={isAccessability && typeof label === 'string' ? label : ''}\n        onClick={() =>\n          handleOpenType === 'click'\n          && (isCallbackExist ? onClickCallback?.() : setIsOpen(!isOpen))}\n        onMouseEnter={handle.onMouseEnter}\n        onMouseLeave={handle.onMouseLeave}\n        className={cn('hint__button', { hint__button_active: isOpen })}\n      >\n        {icon || icon === null || (\n          <>\n            {variant === 'outlined' && <HelpCircle width={16} height={16} className=\"hint__icon outlined\" />}\n            {variant === 'filled' && <HelpCircleFilled className=\"hint__icon filled\" />}\n            {variant === 'warning' && (\n              <AlertTriangle className=\"hint__icon\" color=\"#F06D8D\" width={16} height={16} />\n            )}\n          </>\n        )}\n\n        {label && (\n          <span className={cn('hint__label', { 'color--primary': isOpen })}>\n            {typeof label === 'string' ? capitalized(label) : label}\n          </span>\n        )}\n      </button>\n\n      {isOpen && renderHintContainer(className)}\n    </div>\n  );\n}\n\nexport default Hint;\n"],"mappings":"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"}