intelicoreact 1.5.41 → 1.6.0

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

@@ -1,62 +1,86 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    value: true
 });
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _utils = require("../../../Functions/utils");
-var _Label = _interopRequireDefault(require("../../FormElements/Label/Label"));
-var _Button = _interopRequireDefault(require("../Button/Button"));
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _utils = require("@/Functions/utils");
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _Label = /*#__PURE__*/ _interop_require_default(require("../../FormElements/Label/Label"));
+const _Button = /*#__PURE__*/ _interop_require_default(require("../Button/Button"));
 require("./UserBox.scss");
-const UserBox = _ref => {
-  let {
-    name = "Username",
-    role,
-    id,
-    onClick,
-    isModal,
-    className,
-    colors,
-    testId = "userbox"
-  } = _ref;
-  const getNameFirstLetter = name.charAt(0).toUpperCase();
-  const renderUser = () => {
-    if (isModal) {
-      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+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__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+                children: [
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        style: {
+                            backgroundColor: (0, _utils.getColorById)(id, colors)
+                        },
+                        className: "td-user-box__avatar",
+                        children: getNameFirstLetter
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                        className: "td-user-box__user-data",
+                        children: [
+                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_Button.default, {
+                                className: "p0 no-shadow",
+                                onClick: onClick,
+                                label: name,
+                                variant: "link"
+                            }),
+                            role && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                                children: role
+                            })
+                        ]
+                    })
+                ]
+            });
+        } else {
+            return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+                children: [
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        style: {
+                            backgroundColor: (0, _utils.getColorById)(id)
+                        },
+                        className: "td-user-box__avatar",
+                        children: getNameFirstLetter
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                        className: "td-user-box__user-data",
+                        children: [
+                            /*#__PURE__*/ (0, _jsxruntime.jsx)(_Label.default, {
+                                label: name
+                            }),
+                            role && /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                                "aria-label": `User role: ${role}`,
+                                children: role
+                            })
+                        ]
+                    })
+                ]
+            });
+        }
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
         "data-testid": testId,
-        style: {
-          backgroundColor: (0, _utils.getColorById)(id, colors)
-        },
-        className: "td-user-box__avatar"
-      }, getNameFirstLetter), /*#__PURE__*/_react.default.createElement("div", {
-        className: "td-user-box__user-data",
-        "data-testid": `${testId}-data`
-      }, /*#__PURE__*/_react.default.createElement(_Button.default, {
-        className: "p0 no-shadow",
-        onClick: onClick,
-        label: name,
-        variant: "link"
-      }), role && /*#__PURE__*/_react.default.createElement("span", null, role)));
-    } else {
-      return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-        "data-testid": testId,
-        style: {
-          backgroundColor: (0, _utils.getColorById)(id)
-        },
-        className: "td-user-box__avatar"
-      }, getNameFirstLetter), /*#__PURE__*/_react.default.createElement("div", {
-        className: "td-user-box__user-data",
-        "data-testid": `${testId}-data`
-      }, /*#__PURE__*/_react.default.createElement(_Label.default, {
-        label: name
-      }), role && /*#__PURE__*/_react.default.createElement("span", null, role)));
-    }
-  };
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)("td-user-box", className)
-  }, renderUser());
+        className: (0, _classnames.default)('td-user-box', className),
+        role: "region",
+        "aria-label": `User box for ${name}`,
+        children: renderUser()
+    });
 };
-var _default = exports.default = UserBox;
+const _default = UserBox;

package/dist/Atomic/UI/UserBox/UserBox.scss

@@ -1,4 +1,28 @@
 .td-user-box {
+  --userbox-avatar-width: 24px;
+  --userbox-avatar-height: 24px;
+  --userbox-avatar-font-size: 16px;
+  --userbox-avatar-font-weight: 400;
+  --userbox-avatar-color: #fff;
+  --userbox-avatar-border-radius: 30px;
+
+  --userbox-user-data-padding-left: 8px;
+  --userbox-user-data-font-family: sarabun;
+  --userbox-user-data-font-size: 12px;
+  --userbox-user-data-font-weight: 400;
+  --userbox-user-data-line-height: 18px;
+  --userbox-user-data-letter-spacing: 0.2px;
+
+  --userbox-button-link-height: unset;
+  --userbox-button-link-padding-left: 8px;
+  --userbox-button-link-font-size: 14px;
+  --userbox-button-link-font-weight: 400;
+
+  --userbox-label-margin-bottom: 0;
+  --userbox-label-margin-left: 8px;
+  --userbox-label-font-size: 14px;
+  --userbox-label-font-weight: 400;
+  --userbox-label-color: #171d33;
   display: flex;
   justify-content: flex-start;
   align-items: center;
@@ -8,15 +32,15 @@
     justify-content: center;
     align-items: center;
 
-    width: 24px;
-    height: 24px;
+    width: var(--userbox-avatar-width, 24px);
+    height: var(--userbox-avatar-height, 24px);
 
-    font-size: 16px;
-    font-weight: 400;
+    font-size: var(--userbox-avatar-font-size, 16px);
+    font-weight: var(--userbox-avatar-font-weight, 400);
     user-select: none;
 
-    color: #fff;
-    border-radius: 30px;
+    color: var(--userbox-avatar-color, #fff);
+    border-radius: var(--userbox-avatar-border-radius, 30px);
   }
 
   &__user-data {
@@ -24,32 +48,32 @@
     flex-direction: column;
 
     span {
-      padding-left: 8px;
+      padding-left: var(--userbox-user-data-padding-left, 8px);
 
-      font-family: Sarabun;
-      font-size: 12px;
-      font-weight: 400;
+      font-family: var(--userbox-user-data-font-family, sarabun);
+      font-size: var(--userbox-user-data-font-size, 12px);
+      font-weight: var(--userbox-user-data-font-weight, 400);
       font-style: normal;
-      line-height: 18px; /* 150% */
-      letter-spacing: 0.2px;
+      line-height: var(--userbox-user-data-line-height, 18px);
+      letter-spacing: var(--userbox-user-data-letter-spacing, 0.2px);
     }
   }
 
   .button_link {
-    height: unset;
-    padding-left: 8px;
+    height: var(--userbox-button-link-height, unset);
+    padding-left: var(--userbox-button-link-padding-left, 8px);
 
-    font-size: 14px;
-    font-weight: 400;
+    font-size: var(--userbox-button-link-font-size, 14px);
+    font-weight: var(--userbox-button-link-font-weight, 400);
   }
 
   .label {
-    margin-bottom: 0;
-    margin-left: 8px;
+    margin-bottom: var(--userbox-label-margin-bottom, 0);
+    margin-left: var(--userbox-label-margin-left, 8px);
 
-    font-size: 14px;
-    font-weight: 400;
+    font-size: var(--userbox-label-font-size, 14px);
+    font-weight: var(--userbox-label-font-weight, 400);
 
-    color: #171d33;
+    color: var(--userbox-label-color, #171d33);
   }
 }

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

@@ -0,0 +1,57 @@
+"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, {
+    UserBoxTemplate: function() {
+        return UserBoxTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _UserBox = /*#__PURE__*/ _interop_require_default(require("./UserBox"));
+require("../../../../../scss/main.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const _default = {
+    title: 'UI/UserBox',
+    component: _UserBox.default,
+    argTypes: {
+        id: {
+            description: 'string',
+            control: {
+                type: 'select',
+                options: [
+                    'dd499a40-4a02-4597-8353-0fd0fb49b8ec',
+                    '407dcedf-7713-4e2b-ba29-6989968c70c4',
+                    '7e034243-426f-40a6-8e85-71b719385404',
+                    '3f03007a-4cf0-4a23-8774-c232ad922d7a'
+                ]
+            }
+        }
+    },
+    args: {
+        name: 'Username',
+        id: 'dd499a40-4a02-4597-8353-0fd0fb49b8ec',
+        onClick: ()=>{},
+        isModal: true,
+        className: '',
+        colors: [],
+        role: 'Admin'
+    }
+};
+const Template = (args)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_UserBox.default, {
+        ...args
+    });
+const UserBoxTemplate = Template.bind({});

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

@@ -0,0 +1,136 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = require("@testing-library/react");
+const _utils = /*#__PURE__*/ _interop_require_wildcard(require("@/Functions/utils"));
+const _UserBox = /*#__PURE__*/ _interop_require_default(require("./UserBox"));
+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;
+}
+jest.mock('@/Functions/utils', ()=>({
+        getColorById: jest.fn()
+    }));
+describe('userBox', ()=>{
+    const defaultProps = {
+        name: 'Test User',
+        id: '1',
+        onClick: jest.fn(),
+        isModal: false
+    };
+    it('renders with default props', ()=>{
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_UserBox.default, {
+            ...defaultProps
+        }));
+        expect(_react.screen.getByTestId('userbox')).toBeInTheDocument();
+        expect(_react.screen.getByText('Test User')).toBeInTheDocument();
+    });
+    it('renders with role', ()=>{
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_UserBox.default, {
+            ...defaultProps,
+            role: "Admin"
+        }));
+        expect(_react.screen.getByText('Admin')).toBeInTheDocument();
+    });
+    it('calls onClick when button is clicked in modal mode', ()=>{
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_UserBox.default, {
+            ...defaultProps,
+            isModal: true
+        }));
+        _react.fireEvent.click(_react.screen.getByText('Test User'));
+        expect(defaultProps.onClick).toHaveBeenCalled();
+    });
+    it('renders with custom className', ()=>{
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_UserBox.default, {
+            ...defaultProps,
+            className: "custom-class"
+        }));
+        // Updated: Now checking directly on the element with testId
+        expect(_react.screen.getByTestId('userbox')).toHaveClass('custom-class');
+    });
+    it('renders with colors', ()=>{
+        const colors = [
+            '#ff0000',
+            '#00ff00',
+            '#0000ff'
+        ];
+        _utils.getColorById.mockReturnValue('#00ff00');
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_UserBox.default, {
+            ...defaultProps,
+            colors: colors
+        }));
+        expect(_react.screen.getByTestId('userbox').querySelector('.td-user-box__avatar')).toHaveStyle({
+            backgroundColor: '#00ff00'
+        });
+    });
+    it('renders modal content correctly', ()=>{
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_UserBox.default, {
+            ...defaultProps,
+            isModal: true
+        }));
+        expect(_react.screen.getByTestId('userbox')).toBeInTheDocument();
+        expect(_react.screen.getByText('Test User')).toBeInTheDocument();
+    });
+    // Adding new tests for accessibility attributes
+    it('renders with correct ARIA attributes', ()=>{
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_UserBox.default, {
+            ...defaultProps,
+            role: "Admin"
+        }));
+        const userBox = _react.screen.getByTestId('userbox');
+        expect(userBox).toHaveAttribute('role', 'region');
+        expect(userBox).toHaveAttribute('aria-label', 'User box for Test User');
+        expect(_react.screen.getByText('Admin')).toHaveAttribute('aria-label', 'User role: Admin');
+    });
+    it('renders with custom testId', ()=>{
+        (0, _react.render)(/*#__PURE__*/ (0, _jsxruntime.jsx)(_UserBox.default, {
+            ...defaultProps,
+            testId: "custom-testid"
+        }));
+        expect(_react.screen.getByTestId('custom-testid')).toBeInTheDocument();
+    });
+});

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

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _UserBox = /*#__PURE__*/ _interop_require_default(require("./UserBox"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const _default = _UserBox.default;

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

@@ -0,0 +1,70 @@
+"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, {
+    Default: function() {
+        return Default;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _index = /*#__PURE__*/ _interop_require_default(require("./index"));
+require("../../../../../scss/main.scss");
+const _constructor = require("./constructor");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+global.lng = 'en';
+const _default = {
+    title: 'UI/WizardStepper',
+    component: _index.default,
+    argTypes: {
+        steps: {
+            array: true
+        },
+        variant: {
+            options: [
+                'default',
+                'cardActive',
+                'ghost'
+            ],
+            control: {
+                type: 'radio'
+            }
+        }
+    }
+};
+//  - BASE VARIANT -
+const Template = (args)=>/*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        children: [
+            " ",
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_index.default, {
+                ...args
+            }),
+            " "
+        ]
+    });
+const Default = Template.bind({});
+Default.args = {
+    steps: _constructor.mockData,
+    // вариант ghost и cardActive активирует пресет других иконок сами по себе
+    variant: undefined,
+    // опционально
+    customIcons: {
+        activeIcon: undefined,
+        doneIcon: undefined,
+        defaultIcon: undefined
+    }
+};