intelicoreact 1.6.2 → 1.6.3

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

@@ -1,10 +1,33 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
-import Tag from './Tag';
-import '../../../../../scss/main.scss';
-export default {
+"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, {
+    TagTemplate: function() {
+        return TagTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = require("react");
+const _Tag = /*#__PURE__*/ _interop_require_default(require("./Tag"));
+require("../../../../../scss/main.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const _default = {
     title: 'UI/Tag',
-    component: Tag,
+    component: _Tag.default,
     args: {
         value: 'check',
         label: 'Label test',
@@ -20,7 +43,7 @@ export default {
     }
 };
 function Template(args) {
-    const [tags, setTags] = useState([
+    const [tags, setTags] = (0, _react.useState)([
         {
             id: '1',
             label: 'Label test 1',
@@ -51,29 +74,29 @@ function Template(args) {
         const newArray = tags.filter((item)=>item.value !== value);
         setTags(newArray);
     };
-    return /*#__PURE__*/ _jsxs("div", {
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
         style: {
             display: 'flex',
             flexDirection: 'column',
             rowGap: '2rem'
         },
         children: [
-            /*#__PURE__*/ _jsxs("div", {
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                 children: [
-                    /*#__PURE__*/ _jsx("div", {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                         children: "single"
                     }),
-                    /*#__PURE__*/ _jsx(Tag, {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
                         ...args
                     })
                 ]
             }),
-            /*#__PURE__*/ _jsxs("div", {
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                 children: [
-                    /*#__PURE__*/ _jsx("div", {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                         children: "multiple"
                     }),
-                    tags.map((item)=>/*#__PURE__*/ _jsx(Tag, {
+                    tags.map((item)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
                             ...item,
                             removeItem: (value)=>removeTagHandler(value)
                         }, item.id))
@@ -82,4 +105,4 @@ function Template(args) {
         ]
     });
 }
-export const TagTemplate = Template.bind({});
+const TagTemplate = Template.bind({});

package/dist/Atomic/UI/Tag/Tag.test.js

@@ -1,6 +1,15 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { fireEvent, render, screen } from '@testing-library/react';
-import Tag from './Tag';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = require("@testing-library/react");
+const _Tag = /*#__PURE__*/ _interop_require_default(require("./Tag"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
 describe('tag', ()=>{
     const defaultProps = {
         value: 'test',
@@ -9,58 +18,58 @@ describe('tag', ()=>{
         onClick: jest.fn()
     };
     it('renders with default props', ()=>{
-        render(/*#__PURE__*/ _jsx(Tag, {
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
             ...defaultProps
         }));
-        expect(screen.getByTestId('tag')).toBeInTheDocument();
-        expect(screen.getByText('Test Label')).toBeInTheDocument();
+        expect(_react.screen.getByTestId('tag')).toBeInTheDocument();
+        expect(_react.screen.getByText('Test Label')).toBeInTheDocument();
     });
     it('renders with warning', ()=>{
-        render(/*#__PURE__*/ _jsx(Tag, {
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
             ...defaultProps,
             warning: "Warning message"
         }));
-        fireEvent.mouseEnter(screen.getByTestId('tag'));
-        expect(screen.getByText('Warning message')).toBeInTheDocument();
+        _react.fireEvent.mouseEnter(_react.screen.getByTestId('tag'));
+        expect(_react.screen.getByText('Warning message')).toBeInTheDocument();
     });
     it('calls onClick when tag is clicked', ()=>{
-        render(/*#__PURE__*/ _jsx(Tag, {
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
             ...defaultProps
         }));
-        fireEvent.click(screen.getByTestId('tag'));
+        _react.fireEvent.click(_react.screen.getByTestId('tag'));
         expect(defaultProps.onClick).toHaveBeenCalledWith('1');
     });
     it('renders remove button and calls removeItem when clicked', ()=>{
         const removeItem = jest.fn();
-        render(/*#__PURE__*/ _jsx(Tag, {
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
             ...defaultProps,
             removeItem: removeItem,
             isNoDismiss: false
         }));
-        fireEvent.click(screen.getByRole('button'));
+        _react.fireEvent.click(_react.screen.getByRole('button'));
         expect(removeItem).toHaveBeenCalledWith('test');
     });
     it('opens and closes popup on click', ()=>{
         const appDiv = document.createElement('div');
         appDiv.setAttribute('id', 'app');
         document.body.appendChild(appDiv);
-        render(/*#__PURE__*/ _jsx(Tag, {
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
             ...defaultProps,
             isPopup: true,
-            popupInfoContent: /*#__PURE__*/ _jsx("div", {
+            popupInfoContent: /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                 children: "Popup Content"
             })
         }));
-        fireEvent.click(screen.getByTestId('tag'));
-        expect(screen.getByText('Popup Content')).toBeInTheDocument();
-        fireEvent.click(document);
-        expect(screen.queryByText('Popup Content')).not.toBeInTheDocument();
+        _react.fireEvent.click(_react.screen.getByTestId('tag'));
+        expect(_react.screen.getByText('Popup Content')).toBeInTheDocument();
+        _react.fireEvent.click(document);
+        expect(_react.screen.queryByText('Popup Content')).not.toBeInTheDocument();
     });
     it('applies custom className', ()=>{
-        render(/*#__PURE__*/ _jsx(Tag, {
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
             ...defaultProps,
             className: "custom-class"
         }));
-        expect(screen.getByTestId('tag')).toHaveClass('custom-class');
+        expect(_react.screen.getByTestId('tag')).toHaveClass('custom-class');
     });
 });

package/dist/Atomic/UI/Tag/index.js

@@ -1,2 +1,17 @@
-import Tag from './Tag';
-export default Tag;
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _Tag = /*#__PURE__*/ _interop_require_default(require("./Tag"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const _default = _Tag.default;

package/dist/Atomic/UI/TagList/TagList.js

@@ -1,17 +1,73 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { createRef, useEffect, useLayoutEffect, useRef, useState } from "react";
-import cn from "classnames";
-import { Edit3 } from "react-feather";
-import { checkedRef } from "../../../Functions/utils";
-import Tag from "../Tag/Tag";
-import "./TagList.scss";
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+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 _reactfeather = require("react-feather");
+const _utils = require("../../../Functions/utils");
+const _Tag = /*#__PURE__*/ _interop_require_default(require("../Tag/Tag"));
+require("./TagList.scss");
+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 TagList = ({ disabled, className, onTagClick, removeItem = null, items = [], withToggle = true, disableShowMore = false, shownItemsCount = "auto", testId = "test-taglist", refProp, renderOrder, onEditClick, onToggleRenderAll })=>{
     var _wrapperRef_current_getBoundingClientRect, _wrapperRef_current;
-    const wrapperRef = useRef(null);
-    const [tagList, setTagList] = useState([]);
-    const [staticTagsCount, setStaticTagsCount] = useState(-1);
-    const [renderItemsCount, setRenderItemsCount] = useState(-1);
-    const [renderAll, setRenderAll] = useState(!withToggle);
+    const wrapperRef = (0, _react.useRef)(null);
+    const [tagList, setTagList] = (0, _react.useState)([]);
+    const [staticTagsCount, setStaticTagsCount] = (0, _react.useState)(-1);
+    const [renderItemsCount, setRenderItemsCount] = (0, _react.useState)(-1);
+    const [renderAll, setRenderAll] = (0, _react.useState)(!withToggle);
     var _wrapperRef_current_getBoundingClientRect_width;
     const wrapperWidth = (_wrapperRef_current_getBoundingClientRect_width = wrapperRef === null || wrapperRef === void 0 ? void 0 : (_wrapperRef_current = wrapperRef.current) === null || _wrapperRef_current === void 0 ? void 0 : (_wrapperRef_current_getBoundingClientRect = _wrapperRef_current.getBoundingClientRect()) === null || _wrapperRef_current_getBoundingClientRect === void 0 ? void 0 : _wrapperRef_current_getBoundingClientRect.width) !== null && _wrapperRef_current_getBoundingClientRect_width !== void 0 ? _wrapperRef_current_getBoundingClientRect_width : -1;
     const setRenderAllInterceptor = (v)=>{
@@ -73,10 +129,10 @@ const TagList = ({ disabled, className, onTagClick, removeItem = null, items = [
             if (!item) return null;
             const isHidden = renderItemsCount !== -1 && staticTagsCount !== -1 ? i >= renderItemsCount : false;
             var _item_id, _item_id1;
-            return /*#__PURE__*/ _jsx("div", {
+            return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                 className: `tag-list_wrapper_item ${isHidden ? "tag-list_wrapper_item--hidden" : ""}`,
-                ref: checkedRef(item === null || item === void 0 ? void 0 : item.itemRef),
-                children: /*#__PURE__*/ _jsx(Tag, {
+                ref: (0, _utils.checkedRef)(item === null || item === void 0 ? void 0 : item.itemRef),
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
                     testId: `test-taglist-item-${(_item_id = item === null || item === void 0 ? void 0 : item.id) !== null && _item_id !== void 0 ? _item_id : item === null || item === void 0 ? void 0 : item.value}`,
                     ...item,
                     onClick: onTagClick,
@@ -89,7 +145,7 @@ const TagList = ({ disabled, className, onTagClick, removeItem = null, items = [
         if ((tagList === null || tagList === void 0 ? void 0 : tagList.length) < shownItemsCount || !(tagList === null || tagList === void 0 ? void 0 : tagList.length) || disableShowMore) return null;
         const restItems = tagList.length - renderItemsCount;
         if (restItems === 0 || !withToggle || staticTagsCount === -1) return null;
-        return /*#__PURE__*/ _jsx(Tag, {
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
             label: `+${restItems}`,
             className: "tag-list_wrapper_render-more",
             onClick: disableShowMore ? ()=>{} : (e)=>cancelDefault(e, ()=>setRenderAllInterceptor(true))
@@ -97,26 +153,26 @@ const TagList = ({ disabled, className, onTagClick, removeItem = null, items = [
     };
     const renderHideTags = ()=>{
         if (renderItemsCount !== (tagList === null || tagList === void 0 ? void 0 : tagList.length) || !withToggle || staticTagsCount === -1 || staticTagsCount === (tagList === null || tagList === void 0 ? void 0 : tagList.length)) return null;
-        return /*#__PURE__*/ _jsx(Tag, {
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_Tag.default, {
             label: "...",
             className: "tag-list_wrapper_hide-more",
             onClick: (e)=>cancelDefault(e, ()=>setRenderAllInterceptor(false))
         });
     };
     // Set TagList Items
-    useEffect(()=>{
+    (0, _react.useEffect)(()=>{
         setStaticTagsCount(-1);
         setRenderItemsCount(-1);
         setRenderAllInterceptor(false);
         setTagList(items.map((item)=>({
                 ...item,
-                itemRef: /*#__PURE__*/ createRef()
+                itemRef: /*#__PURE__*/ (0, _react.createRef)()
             })));
     }, [
         items
     ]);
     // Count Row Tags
-    useLayoutEffect(()=>{
+    (0, _react.useLayoutEffect)(()=>{
         if (withToggle && wrapperWidth !== -1 && staticTagsCount === -1) {
             let computedWidth = wrapperWidth;
             if (computedWidth === 0) {
@@ -133,25 +189,25 @@ const TagList = ({ disabled, className, onTagClick, removeItem = null, items = [
         wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current
     ]);
     //
-    useLayoutEffect(()=>{
+    (0, _react.useLayoutEffect)(()=>{
         setRenderItemsCount(staticTagsCount);
     }, [
         staticTagsCount
     ]);
     // Toggle Show/Hide More Tags
-    useEffect(()=>{
+    (0, _react.useEffect)(()=>{
         setRenderItemsCount(renderAll ? tagList === null || tagList === void 0 ? void 0 : tagList.length : staticTagsCount);
     }, [
         renderAll
     ]);
-    useEffect(()=>{
+    (0, _react.useEffect)(()=>{
         // eslint-disable-next-line react-hooks/exhaustive-deps
         if ((wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current) && refProp) refProp.current = wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current;
     }, [
         wrapperRef === null || wrapperRef === void 0 ? void 0 : wrapperRef.current
     ]);
-    return /*#__PURE__*/ _jsxs("div", {
-        className: cn("tag-list_wrapper", `${renderItemsCount !== (tagList === null || tagList === void 0 ? void 0 : tagList.length) || !withToggle || staticTagsCount === -1 || staticTagsCount === (tagList === null || tagList === void 0 ? void 0 : tagList.length) ? "tag-list_wrapper--only-static-items" : "tag-list_wrapper--all-items"}`, className, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        className: (0, _classnames.default)("tag-list_wrapper", `${renderItemsCount !== (tagList === null || tagList === void 0 ? void 0 : tagList.length) || !withToggle || staticTagsCount === -1 || staticTagsCount === (tagList === null || tagList === void 0 ? void 0 : tagList.length) ? "tag-list_wrapper--only-static-items" : "tag-list_wrapper--all-items"}`, className, {
             "tag-list_wrapper--disabled": disabled
         }),
         style: {
@@ -163,13 +219,13 @@ const TagList = ({ disabled, className, onTagClick, removeItem = null, items = [
             renderTags(),
             renderMoreTags(),
             renderHideTags(),
-            typeof onEditClick === "function" && /*#__PURE__*/ _jsx("div", {
+            typeof onEditClick === "function" && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                 className: "tag-list__edit-trigger",
-                children: /*#__PURE__*/ _jsx(Edit3, {
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.Edit3, {
                     onClick: onEditClick
                 })
             })
         ]
     });
 };
-export default TagList;
+const _default = TagList;

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

@@ -1,28 +1,92 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState } from "react";
-import "../../../../../scss/main.scss";
-import TagList from "./TagList";
-import "./TagListStories.scss";
+"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, {
+    TagListTemplate: function() {
+        return TagListTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+require("../../../../../scss/main.scss");
+const _TagList = /*#__PURE__*/ _interop_require_default(require("./TagList"));
+require("./TagListStories.scss");
+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;
+}
 global.lng = "en";
-export default {
+const _default = {
     title: "UI/TagList",
-    component: TagList
+    component: _TagList.default
 };
 const renderPopupContent = ()=>{
-    return /*#__PURE__*/ _jsxs("div", {
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
         children: [
-            /*#__PURE__*/ _jsx("span", {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                 children: '"ADDED"'
             }),
-            /*#__PURE__*/ _jsxs("div", {
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                 children: [
-                    /*#__PURE__*/ _jsx("span", {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                         children: '"FL Name" '
                     }),
-                    /*#__PURE__*/ _jsx("span", {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                         children: '"Admin" '
                     }),
-                    /*#__PURE__*/ _jsx("span", {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                         children: '"date"'
                     })
                 ]
@@ -32,17 +96,17 @@ const renderPopupContent = ()=>{
 };
 const Template = (args)=>{
     const { options } = args;
-    const [tags, setTags] = useState(options);
+    const [tags, setTags] = (0, _react.useState)(options);
     const removeTagHandler = (value)=>{
         const newArray = tags.filter((item)=>item.value !== value);
         setTags(newArray);
     };
-    return /*#__PURE__*/ _jsx(TagList, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TagList.default, {
         ...args,
         items: tags
     });
 };
-export const TagListTemplate = Template.bind({});
+const TagListTemplate = Template.bind({});
 TagListTemplate.args = {
     options: [
         {

package/dist/Atomic/UI/UserBox/UserBox.interface.js

@@ -1 +1,4 @@
-export { };
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

package/dist/Atomic/UI/UserBox/UserBox.js

@@ -1,33 +1,48 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import cn from 'classnames';
-import React from 'react';
-import { getColorById } from '../../../Functions/utils';
-import Label from '../../FormElements/Label/Label';
-import Button from '../Button/Button';
-import './UserBox.scss';
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _utils = require("../../../Functions/utils");
+const _Label = /*#__PURE__*/ _interop_require_default(require("../../FormElements/Label/Label"));
+const _Button = /*#__PURE__*/ _interop_require_default(require("../Button/Button"));
+require("./UserBox.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
 const UserBox = ({ name = 'Username', role, id, onClick, isModal, className, colors, testId = 'userbox' })=>{
     const getNameFirstLetter = name.charAt(0).toUpperCase();
     const renderUser = ()=>{
         if (isModal) {
-            return /*#__PURE__*/ _jsxs(_Fragment, {
+            return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
                 children: [
-                    /*#__PURE__*/ _jsx("div", {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                         style: {
-                            backgroundColor: getColorById(id, colors)
+                            backgroundColor: (0, _utils.getColorById)(id, colors)
                         },
                         className: "td-user-box__avatar",
                         children: getNameFirstLetter
                     }),
-                    /*#__PURE__*/ _jsxs("div", {
+                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                         className: "td-user-box__user-data",
                         children: [
-                            /*#__PURE__*/ _jsx(Button, {
+                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_Button.default, {
                                 className: "p0 no-shadow",
                                 onClick: onClick,
                                 label: name,
                                 variant: "link"
                             }),
-                            role && /*#__PURE__*/ _jsx("span", {
+                            role && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                 children: role
                             })
                         ]
@@ -35,22 +50,22 @@ const UserBox = ({ name = 'Username', role, id, onClick, isModal, className, col
                 ]
             });
         } else {
-            return /*#__PURE__*/ _jsxs(_Fragment, {
+            return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
                 children: [
-                    /*#__PURE__*/ _jsx("div", {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                         style: {
-                            backgroundColor: getColorById(id)
+                            backgroundColor: (0, _utils.getColorById)(id)
                         },
                         className: "td-user-box__avatar",
                         children: getNameFirstLetter
                     }),
-                    /*#__PURE__*/ _jsxs("div", {
+                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                         className: "td-user-box__user-data",
                         children: [
-                            /*#__PURE__*/ _jsx(Label, {
+                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_Label.default, {
                                 label: name
                             }),
-                            role && /*#__PURE__*/ _jsx("span", {
+                            role && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                 "aria-label": `User role: ${role}`,
                                 children: role
                             })
@@ -60,12 +75,12 @@ const UserBox = ({ name = 'Username', role, id, onClick, isModal, className, col
             });
         }
     };
-    return /*#__PURE__*/ _jsx("div", {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
         "data-testid": testId,
-        className: cn('td-user-box', className),
+        className: (0, _classnames.default)('td-user-box', className),
         role: "region",
         "aria-label": `User box for ${name}`,
         children: renderUser()
     });
 };
-export default UserBox;
+const _default = UserBox;