intelicoreact 1.5.41 → 1.6.1

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

@@ -1,45 +1,97 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _momentTimezone = _interopRequireDefault(require("moment-timezone"));
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _momenttimezone = /*#__PURE__*/ _interop_require_default(require("moment-timezone"));
 require("./DateTime.scss");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
 const RC = "date-time";
 const DEFAULT_DATE_FORMAT = "DD.MM.YYYY";
 const DEFAULT_TIME_FORMAT = "HH:mm:ss";
-const DateTime = _ref => {
-  let {
-    className,
-    value,
-    valueFormat,
-    dateFormat: inputDateFormat,
-    timeFormat: inputTimeFormat,
-    isNoDate,
-    isNoTime,
-    testId = "date-time"
-  } = _ref;
-  const dateFormat = inputDateFormat ? inputDateFormat : DEFAULT_DATE_FORMAT;
-  const timeFormat = inputTimeFormat ? inputTimeFormat : DEFAULT_TIME_FORMAT;
-  const date = (0, _react.useMemo)(() => (valueFormat ? (0, _momentTimezone.default)(value, valueFormat) : (0, _momentTimezone.default)(value)).format(dateFormat), [value, valueFormat, dateFormat]);
-  const time = (0, _react.useMemo)(() => (valueFormat ? (0, _momentTimezone.default)(value, valueFormat) : (0, _momentTimezone.default)(value)).format(timeFormat), [value, valueFormat, timeFormat]);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    "data-testid": testId,
-    className: (0, _classnames.default)(RC, className)
-  }, !isNoDate && /*#__PURE__*/_react.default.createElement("span", {
-    "data-testid": `${testId}-date`,
-    className: (0, _classnames.default)(`${RC}__date`)
-  }, date), !isNoTime && /*#__PURE__*/_react.default.createElement("span", {
-    "data-testid": `${testId}-time`,
-    className: (0, _classnames.default)(`${RC}__time`, {
-      [`${RC}_color--pause`]: !isNoDate
-    })
-  }, time));
+const DateTime = ({ className, value, valueFormat, dateFormat: inputDateFormat, timeFormat: inputTimeFormat, isNoDate, isNoTime, testId = "date-time" })=>{
+    const dateFormat = inputDateFormat ? inputDateFormat : DEFAULT_DATE_FORMAT;
+    const timeFormat = inputTimeFormat ? inputTimeFormat : DEFAULT_TIME_FORMAT;
+    const date = (0, _react.useMemo)(()=>(valueFormat ? (0, _momenttimezone.default)(value, valueFormat) : (0, _momenttimezone.default)(value)).format(dateFormat), [
+        value,
+        valueFormat,
+        dateFormat
+    ]);
+    const time = (0, _react.useMemo)(()=>(valueFormat ? (0, _momenttimezone.default)(value, valueFormat) : (0, _momenttimezone.default)(value)).format(timeFormat), [
+        value,
+        valueFormat,
+        timeFormat
+    ]);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        "data-testid": testId,
+        className: (0, _classnames.default)(RC, className),
+        children: [
+            !isNoDate && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                "data-testid": `${testId}-date`,
+                className: (0, _classnames.default)(`${RC}__date`),
+                children: date
+            }),
+            !isNoTime && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                "data-testid": `${testId}-time`,
+                className: (0, _classnames.default)(`${RC}__time`, {
+                    [`${RC}_color--pause`]: !isNoDate
+                }),
+                children: time
+            })
+        ]
+    });
 };
-var _default = exports.default = DateTime;
+const _default = DateTime;

package/dist/Atomic/UI/DateTime/DateTime.scss

@@ -1,4 +1,4 @@
-@import "./../../../scss/vars";
+@use "./../../../scss/vars";
 
 .date-time {
   display: flex;
@@ -12,6 +12,6 @@
   }
 
   &_color--pause {
-    color: $color--pause;
+    color: vars.$color--pause;
   }
 }

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

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    DateTimeTemplate: function() {
+        return DateTimeTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _DateTime = /*#__PURE__*/ _interop_require_default(require("./DateTime"));
+require("../../../../../scss/main.scss");
+require("./partial/AnyOuterClass.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+global.lng = 'en';
+const _default = {
+    title: 'UI/DateTime',
+    component: _DateTime.default
+};
+const Template = (args)=>{
+    const { isIncludeOuterStyles, ...restArgs } = args;
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_DateTime.default, {
+        ...restArgs,
+        className: isIncludeOuterStyles ? 'any-outer-class__date-time' : null
+    });
+};
+const DateTimeTemplate = Template.bind({});
+DateTimeTemplate.args = {
+    isIncludeOuterStyles: false,
+    value: '2021-05-12T23:54:25+0300',
+    valueFormat: '',
+    dateFormat: '',
+    timeFormat: '',
+    isNoDate: false,
+    isNoTime: false
+};

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

@@ -1,36 +1,98 @@
 "use strict";
-
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactFeather = require("react-feather");
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _reactfeather = require("react-feather");
 require("./DebugContainer.scss");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const DebugContainer = _ref => {
-  let {
-    data,
-    children
-  } = _ref;
-  const [isVisible, setIsVisible] = (0, _react.useState)(true);
-  const renderData = () => {
-    return /*#__PURE__*/_react.default.createElement("pre", null, "{\n", Object.keys(data)?.map(key => {
-      return `  ${key}: ${data?.[key]},\n`;
-    }), "}");
-  };
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "debug-container"
-  }, isVisible && /*#__PURE__*/_react.default.createElement("div", {
-    className: "debug-container__body"
-  }, /*#__PURE__*/_react.default.createElement("h5", null, "Debug:"), data && Boolean(Object?.keys(data)?.length) && /*#__PURE__*/_react.default.createElement("div", {
-    className: "debug-container__body-row"
-  }, renderData()), children && /*#__PURE__*/_react.default.createElement("div", {
-    className: "debug-container__body-row"
-  }, children)), /*#__PURE__*/_react.default.createElement("div", {
-    className: "debug-container__toggler",
-    onClick: () => setIsVisible(v => !v)
-  }, isVisible ? /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronUp, null) : /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronDown, null)));
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const DebugContainer = ({ data, children })=>{
+    var _Object_keys, _Object;
+    const [isVisible, setIsVisible] = (0, _react.useState)(true);
+    const renderData = ()=>{
+        var _Object_keys;
+        return /*#__PURE__*/ (0, _jsxruntime.jsxs)("pre", {
+            children: [
+                "{\n",
+                (_Object_keys = Object.keys(data)) === null || _Object_keys === void 0 ? void 0 : _Object_keys.map((key)=>{
+                    return `  ${key}: ${data === null || data === void 0 ? void 0 : data[key]},\n`;
+                }),
+                "}"
+            ]
+        });
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        className: "debug-container",
+        children: [
+            isVisible && /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                className: "debug-container__body",
+                children: [
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("h5", {
+                        children: "Debug:"
+                    }),
+                    data && Boolean((_Object = Object) === null || _Object === void 0 ? void 0 : (_Object_keys = _Object.keys(data)) === null || _Object_keys === void 0 ? void 0 : _Object_keys.length) && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: "debug-container__body-row",
+                        children: renderData()
+                    }),
+                    children && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: "debug-container__body-row",
+                        children: children
+                    })
+                ]
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                className: "debug-container__toggler",
+                onClick: ()=>setIsVisible((v)=>!v),
+                children: isVisible ? /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronUp, {}) : /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronDown, {})
+            })
+        ]
+    });
 };
-var _default = exports.default = DebugContainer;
+const _default = DebugContainer;

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

@@ -1,22 +1,70 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _DebugContainer = _interopRequireDefault(require("./DebugContainer"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const useDebugContainer = () => {
-  const [data, setData] = (0, _react.useState)({});
-  return {
-    debugData: data,
-    setDebugData: setData,
-    renderDebugContainer: /*#__PURE__*/_react.default.createElement(_DebugContainer.default, {
-      data: data
-    })
-  };
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _DebugContainer = /*#__PURE__*/ _interop_require_default(require("./DebugContainer"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const useDebugContainer = ()=>{
+    const [data, setData] = (0, _react.useState)({});
+    return {
+        debugData: data,
+        setDebugData: setData,
+        renderDebugContainer: /*#__PURE__*/ (0, _jsxruntime.jsx)(_DebugContainer.default, {
+            data: data
+        })
+    };
 };
-var _default = exports.default = useDebugContainer;
+const _default = useDebugContainer;

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

@@ -1,84 +1,141 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _moment = _interopRequireDefault(require("moment"));
-var _reactFeather = require("react-feather");
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _moment = /*#__PURE__*/ _interop_require_default(require("moment"));
+const _reactfeather = require("react-feather");
 require("./DoubleString.scss");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const RC = "double-string";
-const DoubleString = _ref => {
-  let {
-    value,
-    description,
-    valuePostfix,
-    className,
-    testId = "double-string",
-    isFormatValueToDate,
-    isUseOnClick,
-    dateFormatSettings: {
-      parseFormat = "MM.DD.YYYY",
-      displayFormat = "MM.DD.YYYY"
-    } = {},
-    revert = false,
-    noTitle,
-    isUseHideMode = false,
-    isShowHiddenValueAvailable = false
-  } = _ref;
-  const [isValueHidden, setIsValueHidden] = (0, _react.useState)(isUseHideMode);
-  const computedValue = isFormatValueToDate ? (0, _moment.default)(value, parseFormat).format(displayFormat) : value;
-  const valueRef = (0, _react.useRef)(null);
-  const descriptionRef = (0, _react.useRef)(null);
-  const [elemsWidth, setElemsWidth] = (0, _react.useState)({
-    valueWidth: 0,
-    descriptionWidth: 0
-  });
-  const [isOnClickON, setIsOnClickON] = (0, _react.useState)(false);
-  const handle = {
-    click: () => {
-      setIsOnClickON(!isOnClickON);
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
     }
-  };
-  (0, _react.useEffect)(() => {
-    const valueWidth = valueRef?.current?.clientWidth;
-    const descriptionWidth = descriptionRef?.current?.clientWidth;
-    setElemsWidth({
-      valueWidth,
-      descriptionWidth
+    var newObj = {
+        __proto__: null
+    };
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const RC = "double-string";
+const DoubleString = ({ value, description, 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] = (0, _react.useState)(isUseHideMode);
+    const computedValue = isFormatValueToDate ? (0, _moment.default)(value, parseFormat).format(displayFormat) : value;
+    const valueRef = (0, _react.useRef)(null);
+    const descriptionRef = (0, _react.useRef)(null);
+    const [elemsWidth, setElemsWidth] = (0, _react.useState)({
+        valueWidth: 0,
+        descriptionWidth: 0
+    });
+    const [isOnClickON, setIsOnClickON] = (0, _react.useState)(false);
+    const handle = {
+        click: ()=>{
+            setIsOnClickON(!isOnClickON);
+        }
+    };
+    (0, _react.useEffect)(()=>{
+        var _valueRef_current, _descriptionRef_current;
+        const valueWidth = valueRef === null || valueRef === void 0 ? void 0 : (_valueRef_current = valueRef.current) === null || _valueRef_current === void 0 ? void 0 : _valueRef_current.clientWidth;
+        const descriptionWidth = descriptionRef === null || descriptionRef === void 0 ? void 0 : (_descriptionRef_current = descriptionRef.current) === null || _descriptionRef_current === void 0 ? void 0 : _descriptionRef_current.clientWidth;
+        setElemsWidth({
+            valueWidth,
+            descriptionWidth
+        });
+    }, [
+        descriptionRef,
+        valueRef
+    ]);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        "data-testid": testId,
+        className: (0, _classnames.default)(RC, className),
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("p", {
+                onClick: ()=>handle.click(),
+                ref: valueRef,
+                className: (0, _classnames.default)(`${RC}__value`, {
+                    "double-string--value-opened": isOnClickON && isUseOnClick
+                }, {
+                    pointer: isUseOnClick
+                }),
+                title: !noTitle && elemsWidth.valueWidth > 99 ? computedValue : "",
+                children: !revert ? /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+                    children: [
+                        isUseHideMode ? /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                            children: !isValueHidden ? computedValue : '*********'
+                        }) : computedValue,
+                        isUseHideMode && isShowHiddenValueAvailable && isValueHidden && /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.Eye, {
+                            className: `${RC}__hide-mode-icon`,
+                            onClick: ()=>setIsValueHidden(false)
+                        }),
+                        isUseHideMode && isShowHiddenValueAvailable && !isValueHidden && /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.EyeOff, {
+                            className: `${RC}__hide-mode-icon`,
+                            onClick: ()=>setIsValueHidden(true)
+                        }),
+                        valuePostfix && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                            className: (0, _classnames.default)(`${RC}__value-postfix`),
+                            children: valuePostfix
+                        })
+                    ]
+                }) : description
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("p", {
+                ref: descriptionRef,
+                className: (0, _classnames.default)(`${RC}__description`),
+                title: !noTitle && elemsWidth.descriptionWidth > 99 ? computedValue : "",
+                children: !revert ? description : /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+                    children: [
+                        computedValue,
+                        valuePostfix && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                            className: (0, _classnames.default)(`${RC}__value-postfix`),
+                            children: valuePostfix
+                        })
+                    ]
+                })
+            })
+        ]
     });
-  }, [descriptionRef, valueRef]);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    "data-testid": testId,
-    className: (0, _classnames.default)(RC, className)
-  }, /*#__PURE__*/_react.default.createElement("p", {
-    onClick: () => handle.click(),
-    ref: valueRef,
-    className: (0, _classnames.default)(`${RC}__value`, {
-      "double-string--value-opened": isOnClickON && isUseOnClick
-    }, {
-      pointer: isUseOnClick
-    }),
-    title: !noTitle && elemsWidth.valueWidth > 99 ? computedValue : ""
-  }, !revert ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, isUseHideMode ? /*#__PURE__*/_react.default.createElement("span", null, !isValueHidden ? computedValue : '*********') : computedValue, isUseHideMode && isShowHiddenValueAvailable && isValueHidden && /*#__PURE__*/_react.default.createElement(_reactFeather.Eye, {
-    className: `${RC}__hide-mode-icon`,
-    onClick: () => setIsValueHidden(false)
-  }), isUseHideMode && isShowHiddenValueAvailable && !isValueHidden && /*#__PURE__*/_react.default.createElement(_reactFeather.EyeOff, {
-    className: `${RC}__hide-mode-icon`,
-    onClick: () => setIsValueHidden(true)
-  }), valuePostfix && /*#__PURE__*/_react.default.createElement("span", {
-    className: (0, _classnames.default)(`${RC}__value-postfix`)
-  }, valuePostfix)) : description), /*#__PURE__*/_react.default.createElement("p", {
-    ref: descriptionRef,
-    className: (0, _classnames.default)(`${RC}__description`),
-    title: !noTitle && elemsWidth.descriptionWidth > 99 ? computedValue : ""
-  }, !revert ? description : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, computedValue, valuePostfix && /*#__PURE__*/_react.default.createElement("span", {
-    className: (0, _classnames.default)(`${RC}__value-postfix`)
-  }, valuePostfix))));
 };
-var _default = exports.default = DoubleString;
+const _default = DoubleString;