intelicoreact 1.5.32 → 1.5.34

package/dist/src/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/src/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/src/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/src/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
+    }
+};

package/dist/src/Atomic/UI/WizardStepper/constructor.js

@@ -0,0 +1,132 @@
+"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, {
+    WIZARD_STEP_VARIANTS: function() {
+        return WIZARD_STEP_VARIANTS;
+    },
+    mockData: function() {
+        return mockData;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _Status = /*#__PURE__*/ _interop_require_default(require("../Status/Status"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const WIZARD_STEP_VARIANTS = Object.freeze({
+    DEFAULT: 'default',
+    DONE: 'done',
+    ACTIVE: 'active'
+});
+const JSXMockComponent = ()=>{
+    const arr = [
+        {
+            title: 'Requested Amont',
+            value: '$15,000'
+        },
+        {
+            title: 'Repayment Amount',
+            value: '$15,001'
+        },
+        {
+            title: 'Repayment Date',
+            value: '12/12/2021'
+        }
+    ];
+    const textStyles = {
+        fontSize: '14px',
+        fontWeight: 400,
+        lineHeight: '20px',
+        letterSpacing: '0.2px'
+    };
+    return arr.map((row)=>{
+        return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+            style: {
+                display: 'flex',
+                justifyContent: 'space-between',
+                maxWidth: '250px'
+            },
+            children: [
+                /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                    style: textStyles,
+                    children: row.title
+                }),
+                /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                    style: textStyles,
+                    children: row.value
+                })
+            ]
+        });
+    });
+};
+const mockData = [
+    {
+        key: 'businessInfo',
+        label: 'Provide Business Info',
+        description: 'This information will help us to evaluate your application',
+        isFinished: true
+    },
+    {
+        key: 'principal',
+        label: 'Add Principal Information',
+        description: 'A principal is essentially another name for a company owner. At some corporations, the principal is also the founder, CEO, or even the chief investor',
+        isFinished: true,
+        isOptional: true
+    },
+    {
+        key: 'coOwners',
+        label: 'Add Co-Owners',
+        description: '{merchantName} will receive that amount from {lenderNmae}',
+        isActive: true,
+        titleSlot: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+            className: "custom-title-slot",
+            children: "$15,001"
+        }),
+        contentSlot: /*#__PURE__*/ (0, _jsxruntime.jsx)(JSXMockComponent, {})
+    },
+    {
+        key: 'bankAccount',
+        label: 'Add a Bank Account',
+        description: 'Your bank account information will be used to securely and automatically transfer the funds',
+        titleSlot: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Status.default, {
+            label: "Some JSX",
+            status: "draft"
+        })
+    },
+    {
+        key: 'documents',
+        label: 'Upload Documents',
+        description: 'Please upload the required documents'
+    },
+    {
+        key: 'review',
+        label: 'Review & Submit',
+        description: 'Please review the information and submit your application'
+    },
+    {
+        key: 'success',
+        label: 'Success',
+        description: 'Your application has been submitted successfully'
+    },
+    {
+        key: 'failure',
+        label: 'Failure',
+        description: 'Your application has been failed'
+    },
+    {
+        key: 'pending',
+        label: 'Pending',
+        description: 'Your application is under review'
+    }
+];

package/dist/src/Atomic/UI/WizardStepper/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 _ui = /*#__PURE__*/ _interop_require_default(require("./ui"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const _default = _ui.default;

package/dist/src/Atomic/UI/WizardStepper/ui/StateIcon/StateIcon.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "StateIcon", {
+    enumerable: true,
+    get: function() {
+        return StateIcon;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+require("./StateIcon.scss");
+const _constructor = require("../../constructor");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const DefaultPoint = ()=>{
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)("svg", {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 16 16",
+        fill: "none",
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("circle", {
+            cx: "8",
+            cy: "8",
+            r: "4"
+        })
+    });
+};
+const DonePoint = ()=>{
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)("svg", {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 16 16",
+        fill: "none",
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("path", {
+            d: "M12.5 5L7 10.5L4 7.5",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+        })
+    });
+};
+const RC = 'state-icon';
+const { ACTIVE, DEFAULT, DONE } = _constructor.WIZARD_STEP_VARIANTS;
+const StateIcon = ({ variant = DEFAULT, className })=>{
+    const computedState = variant === ACTIVE || variant === DONE ? variant : DEFAULT;
+    const Inner = {
+        [DEFAULT]: /*#__PURE__*/ (0, _jsxruntime.jsx)(DefaultPoint, {}),
+        [ACTIVE]: /*#__PURE__*/ (0, _jsxruntime.jsx)(DefaultPoint, {}),
+        [DONE]: /*#__PURE__*/ (0, _jsxruntime.jsx)(DonePoint, {})
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+        className: (0, _classnames.default)(RC, `${RC}--${computedState}`, className),
+        children: Inner[computedState]
+    });
+};

package/dist/src/Atomic/UI/WizardStepper/ui/StateIcon/StateIcon.scss

@@ -0,0 +1,37 @@
+.state-icon {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  width: 20px;
+  height: 20px;
+
+  border-radius: 16px;
+
+  svg {
+    stroke: #656e7a;
+
+    fill: #656e7a;
+  }
+
+  &--done,
+  &--active {
+    background-color: #eaf2ff;
+  }
+
+  &--done {
+    svg {
+      stroke: #1f7499;
+
+      fill: none;
+    }
+  }
+
+  &--active {
+    svg {
+      stroke: #000;
+
+      fill: #000;
+    }
+  }
+}

package/dist/src/Atomic/UI/WizardStepper/ui/StateIcon/index.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "default", {
+    enumerable: true,
+    get: function() {
+        return _default;
+    }
+});
+const _StateIcon = require("./StateIcon");
+const _default = _StateIcon.StateIcon;

package/dist/src/Atomic/UI/WizardStepper/ui/StepRow/StepRow.js

@@ -0,0 +1,90 @@
+"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_default(require("react"));
+const _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _StateIcon = /*#__PURE__*/ _interop_require_default(require("../StateIcon"));
+require("./StepRow.scss");
+const _constructor = require("../../constructor");
+const _Status = /*#__PURE__*/ _interop_require_default(require("../../../Status/Status"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const RC = 'step-row';
+const { DEFAULT, ACTIVE, DONE } = _constructor.WIZARD_STEP_VARIANTS;
+const StepRow = ({ label, description, className, isOptional, isFinished, isActive, titleSlot, contentSlot, customIcons })=>{
+    const title = label;
+    const rowVariant = (()=>{
+        if (isActive) return ACTIVE;
+        if (isFinished) return DONE;
+        return DEFAULT;
+    })();
+    const alternaviteIconFromProps = (()=>{
+        if (isActive) return customIcons === null || customIcons === void 0 ? void 0 : customIcons.activeIcon;
+        if (isFinished) return customIcons === null || customIcons === void 0 ? void 0 : customIcons.doneIcon;
+        return customIcons === null || customIcons === void 0 ? void 0 : customIcons.defaultIcon;
+    })();
+    const CorrectIcon = ()=>{
+        var _Object_values, _Object;
+        return !customIcons || ((_Object = Object) === null || _Object === void 0 ? void 0 : (_Object_values = _Object.values(customIcons)) === null || _Object_values === void 0 ? void 0 : _Object_values.every((icon)=>!icon)) ? /*#__PURE__*/ (0, _jsxruntime.jsx)(_StateIcon.default, {
+            variant: rowVariant
+        }) : alternaviteIconFromProps;
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        className: (0, _classnames.default)(RC, `${RC}--${rowVariant}`),
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                className: (0, _classnames.default)(`${RC}__state-point ${RC}__state-point--${rowVariant}`),
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(CorrectIcon, {})
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                className: `${RC}__content`,
+                children: [
+                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                        className: `${RC}__title`,
+                        children: [
+                            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                                className: `${RC}__title-left`,
+                                children: [
+                                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                                        className: (0, _classnames.default)(`${RC}__title-text`, {
+                                            'text-muted': rowVariant === DEFAULT
+                                        }),
+                                        children: title
+                                    }),
+                                    isOptional && /*#__PURE__*/ (0, _jsxruntime.jsx)(_Status.default, {
+                                        label: 'Optional',
+                                        status: "draft"
+                                    })
+                                ]
+                            }),
+                            titleSlot && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                                className: `${RC}__title-right`,
+                                children: titleSlot
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: `${RC}__description`,
+                        children: description
+                    }),
+                    contentSlot && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: `${RC}__body`,
+                        children: contentSlot
+                    })
+                ]
+            })
+        ]
+    });
+};
+const _default = StepRow;