torgbox-ui 1.0.11 → 1.0.13

package/dist/cjs/Inputs/TextField/TextField.js

@@ -1,92 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextField = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const classnames_1 = __importDefault(require("classnames"));
-const fp_1 = __importDefault(require("lodash/fp"));
-const react_1 = require("react");
-const check_svg_1 = __importDefault(require("../../assets/img/check.svg"));
-const cross_svg_1 = __importDefault(require("../../assets/img/cross.svg"));
-const eye_close_svg_1 = __importDefault(require("../../assets/img/eye-close.svg"));
-const eye_open_svg_1 = __importDefault(require("../../assets/img/eye-open.svg"));
-const search_svg_1 = __importDefault(require("../../assets/img/search.svg"));
-const textField_module_scss_1 = __importDefault(require("./textField.module.scss"));
-const TextField = (props) => {
-    const { label, value, description, className, placeholder, type = 'text', size = 'large', state = 'idle', tabIndex, maxLength, errorMessage, onChange = fp_1.default.noop, onClear = fp_1.default.noop, onVisibilityToggle = fp_1.default.noop, onTouched = fp_1.default.noop, required = false, autoFocus = false, checkIcon = false, clearIcon = false, eyeIcon = false, searchIcon = false, alwaysShowError = false, } = props;
-    const ref = (0, react_1.useRef)(null);
-    const [focused, setFocused] = (0, react_1.useState)(false);
-    const [inputType, setInputType] = (0, react_1.useState)(type);
-    (0, react_1.useEffect)(() => {
-        setInputType(type);
-    }, [type]);
-    (0, react_1.useEffect)(() => {
-        if (autoFocus) {
-            setFocused(true);
-            ref.current?.focus();
-        }
-    }, [autoFocus]);
-    const onChangeHandler = (e) => {
-        onChange(e.target.value, e);
-    };
-    const toggleVisibility = () => {
-        const newType = inputType === 'password' ? 'text' : 'password';
-        setInputType(newType);
-        onVisibilityToggle();
-    };
-    const onBlur = () => {
-        setFocused(false);
-    };
-    const onFocus = () => {
-        setFocused(true);
-        onTouched(true);
-    };
-    const disabledState = state === 'disabled';
-    const wrapperSizeClassBySize = {
-        medium: textField_module_scss_1.default.textFieldWrapperMedium,
-        large: textField_module_scss_1.default.textFieldWrapperLarge,
-    };
-    const labelSizeClassBySize = {
-        medium: textField_module_scss_1.default.textFieldWrapperLabelMedium,
-        large: textField_module_scss_1.default.textFieldWrapperLabelLarge,
-    };
-    const inputSizeClassBySize = {
-        medium: textField_module_scss_1.default.textFieldInputMedium,
-        large: textField_module_scss_1.default.textFieldInputLarge,
-    };
-    const iconsSizeClassBySize = {
-        medium: textField_module_scss_1.default.textFieldIconsMedium,
-        large: textField_module_scss_1.default.textFieldIconsLarge,
-    };
-    const fieldSizeClassBySize = {
-        medium: textField_module_scss_1.default.textFieldMedium,
-        large: textField_module_scss_1.default.textFieldLarge,
-    };
-    const stateClassByState = {
-        idle: textField_module_scss_1.default.textFieldIdle,
-        error: textField_module_scss_1.default.textFieldError,
-        disabled: textField_module_scss_1.default.textFieldDisabled,
-    };
-    const textFieldWrapperClassName = (0, classnames_1.default)(textField_module_scss_1.default.textFieldWrapper, wrapperSizeClassBySize[size]);
-    const textFieldClassName = (0, classnames_1.default)(textField_module_scss_1.default.textField, fieldSizeClassBySize[size], stateClassByState[state], {
-        [textField_module_scss_1.default.textFieldFocused]: !alwaysShowError ? focused : state !== 'error',
-    }, className);
-    const inputClassName = (0, classnames_1.default)(textField_module_scss_1.default.textFieldInput, inputSizeClassBySize[size]);
-    const iconsClassName = (0, classnames_1.default)(textField_module_scss_1.default.textFieldIcons, iconsSizeClassBySize[size]);
-    const labelClassName = (0, classnames_1.default)(textField_module_scss_1.default.textFieldWrapperLabel, labelSizeClassBySize[size], { [textField_module_scss_1.default.textFieldWrapperLabelDisabled]: disabledState });
-    const bottomText = () => {
-        const showError = !!errorMessage && (alwaysShowError || !focused);
-        if (!showError && !description) {
-            return;
-        }
-        return ((0, jsx_runtime_1.jsx)("span", { className: (0, classnames_1.default)(textField_module_scss_1.default.textFieldWrapperBottomText, {
-                [textField_module_scss_1.default.textFieldWrapperBottomTextDescription]: !!description,
-                [textField_module_scss_1.default.textFieldWrapperBottomTextError]: showError,
-            }), children: showError ? errorMessage : description }));
-    };
-    const input = ((0, jsx_runtime_1.jsxs)("div", { className: textFieldClassName, children: [searchIcon && ((0, jsx_runtime_1.jsx)("div", { className: iconsClassName, children: (0, jsx_runtime_1.jsx)(search_svg_1.default, {}) })), (0, jsx_runtime_1.jsx)("input", { ref: ref, type: inputType, value: value, onChange: onChangeHandler, className: inputClassName, onFocus: onFocus, onBlur: onBlur, placeholder: disabledState ? '' : placeholder, disabled: disabledState, onClick: onFocus, tabIndex: tabIndex, maxLength: maxLength }), (checkIcon && value && !errorMessage && !disabledState) && ((0, jsx_runtime_1.jsx)("div", { id: 'check-icon', className: iconsClassName, children: (0, jsx_runtime_1.jsx)(check_svg_1.default, {}) })), clearIcon && value && !disabledState && ((0, jsx_runtime_1.jsx)("div", { className: [iconsClassName, 'cursor-pointer'].join(' '), onClick: onClear, children: (0, jsx_runtime_1.jsx)(cross_svg_1.default, {}) })), eyeIcon && !disabledState && ((0, jsx_runtime_1.jsx)("div", { id: 'eye-icon', className: [iconsClassName, 'cursor-pointer'].join(' '), onClick: toggleVisibility, children: inputType === 'password' ? (0, jsx_runtime_1.jsx)(eye_open_svg_1.default, {}) : (0, jsx_runtime_1.jsx)(eye_close_svg_1.default, {}) }))] }));
-    return ((0, jsx_runtime_1.jsxs)("div", { className: textFieldWrapperClassName, children: [label && ((0, jsx_runtime_1.jsxs)("div", { className: labelClassName, children: [label, required && ((0, jsx_runtime_1.jsx)("span", { className: 'text-field-wrapper__label--required', children: "*" }))] })), input, bottomText()] }));
-};
-exports.TextField = TextField;

package/dist/cjs/Inputs/TextField/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextField = void 0;
-var TextField_1 = require("./TextField");
-Object.defineProperty(exports, "TextField", { enumerable: true, get: function () { return TextField_1.TextField; } });

package/dist/cjs/Inputs/TextField/textField.module.scss

@@ -1,157 +0,0 @@
-@use 'sass:color';
-@use '@/assets/scss' as *;
-
-$border-inactive:    $neutral-border-low;
-$border-hover:       $neutral-border-middle;
-$border-focus:       $primary-border-high;
-$border-disabled:    $neutral-border-low;
-$border-error:       $error-border-high;
-$border-error-hover: $error-border-middle;
-
-$label:              $neutral-middle;
-$label-disabled:     $neutral-A48;
-$label-required:     $primary-high;
-
-$placeholder:        $neutral-low;
-$value:              $neutral-high;
-$value-disabled:     $neutral-A48;
-
-$icons:              $neutral-middle;
-
-$description:        $neutral-middle;
-$description-error:  $error-high;
-
-.text-field-wrapper {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  font-family: 'Roboto Regular', sans-serif;
-
-  &__label {
-    line-height: 20px;
-    color: $label;
-
-    &--medium {
-      font-size: 12px;
-    }
-
-    &--large {
-      font-size: 14px;
-    }
-
-    &--required {
-      padding-left: 4px;
-      color: $label-required;
-    }
-
-    &--disabled {
-      color: $label-disabled;
-    }
-  }
-
-  &__bottom-text {
-    position: absolute;
-    bottom: -16px;
-    left: 0;
-    font-size: 12px;
-    line-height: 16px;
-    
-
-    &--description {
-      color: $description;
-    }
-
-    &--error {
-      color: $description-error;
-    }
-  }
-}
-
-.text-field {
-  display: flex;
-  align-items: center;
-
-  max-width: 400px;
-  padding: 0 12px;
-
-  border: 1px solid $border-inactive;
-  border-radius: 4px;
-
-  &--medium {
-    height: 36px;
-  }
-
-  &--large {
-    height: 44px;
-  }
-
-  &--idle {
-    &:hover {
-      border: 1px solid $border-hover;
-    }
-  }
-
-  &--error {
-    border: 1px solid $border-error;
-
-    &:hover {
-      border: 1px solid $border-error-hover;
-    }
-  }
-
-  &--disabled {
-    border: 1px solid $border-disabled;
-  }
-
-  &--focused {
-    border: 1px solid $border-focus;
-
-    &:hover {
-      border: 1px solid $border-focus;
-    }
-  }
-
-  &__input {
-    width: 100%;
-    height: 100%;
-    padding: 0 4px;
-
-    font-weight: 400;
-
-    background: none;
-    border: none;
-    outline: none;
-
-    &::placeholder {
-      color: $placeholder;
-    }
-
-    &--medium {
-      font-size: 14px;
-      line-height: 20px;
-    }
-
-    &--large {
-      font-size: 16px;
-      line-height: 24px;
-    }
-
-    &:disabled {
-      color: $value-disabled;
-    }
-  }
-
-  &__icons {
-    display: flex;
-    align-items: center;
-    fill: $icons;
-
-    &--medium {
-      width: 20px;
-    }
-
-    &--large {
-      width: 24px;
-    }
-  }
-}

package/dist/cjs/Inputs/TextField/textField.scss

@@ -1,156 +0,0 @@
-@use 'sass:color';
-
-$border-inactive:    $neutral-border-low;
-$border-hover:       $neutral-border-middle;
-$border-focus:       $primary-border-high;
-$border-disabled:    $neutral-border-low;
-$border-error:       $error-border-high;
-$border-error-hover: $error-border-middle;
-
-$label:              $neutral-middle;
-$label-disabled:     $neutral-A48;
-$label-required:     $primary-high;
-
-$placeholder:        $neutral-low;
-$value:              $neutral-high;
-$value-disabled:     $neutral-A48;
-
-$icons:              $neutral-middle;
-
-$description:        $neutral-middle;
-$description-error:  $error-high;
-
-.text-field-wrapper {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  font-family: 'Roboto Regular', sans-serif;
-
-  &__label {
-    line-height: 20px;
-    color: $label;
-
-    &--medium {
-      font-size: 12px;
-    }
-
-    &--large {
-      font-size: 14px;
-    }
-
-    &--required {
-      padding-left: 4px;
-      color: $label-required;
-    }
-
-    &--disabled {
-      color: $label-disabled;
-    }
-  }
-
-  &__bottom-text {
-    position: absolute;
-    bottom: -16px;
-    left: 0;
-    font-size: 12px;
-    line-height: 16px;
-    
-
-    &--description {
-      color: $description;
-    }
-
-    &--error {
-      color: $description-error;
-    }
-  }
-}
-
-.text-field {
-  display: flex;
-  align-items: center;
-
-  max-width: 400px;
-  padding: 0 12px;
-
-  border: 1px solid $border-inactive;
-  border-radius: 4px;
-
-  &--medium {
-    height: 36px;
-  }
-
-  &--large {
-    height: 44px;
-  }
-
-  &--idle {
-    &:hover {
-      border: 1px solid $border-hover;
-    }
-  }
-
-  &--error {
-    border: 1px solid $border-error;
-
-    &:hover {
-      border: 1px solid $border-error-hover;
-    }
-  }
-
-  &--disabled {
-    border: 1px solid $border-disabled;
-  }
-
-  &--focused {
-    border: 1px solid $border-focus;
-
-    &:hover {
-      border: 1px solid $border-focus;
-    }
-  }
-
-  &__input {
-    width: 100%;
-    height: 100%;
-    padding: 0 4px;
-
-    font-weight: 400;
-
-    background: none;
-    border: none;
-    outline: none;
-
-    &::placeholder {
-      color: $placeholder;
-    }
-
-    &--medium {
-      font-size: 14px;
-      line-height: 20px;
-    }
-
-    &--large {
-      font-size: 16px;
-      line-height: 24px;
-    }
-
-    &:disabled {
-      color: $value-disabled;
-    }
-  }
-
-  &__icons {
-    display: flex;
-    align-items: center;
-    fill: $icons;
-
-    &--medium {
-      width: 20px;
-    }
-
-    &--large {
-      width: 24px;
-    }
-  }
-}

package/dist/cjs/Inputs/index.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.InnField = exports.Checkbox = exports.OtpInput = exports.RepeatPasswordField = exports.PasswordField = exports.PhoneField = exports.NameField = exports.EmailField = exports.Option = exports.Collapse = exports.Dropdown = exports.TextField = exports.Button = void 0;
-var Button_1 = require("./Button");
-Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return Button_1.Button; } });
-var TextField_1 = require("./TextField");
-Object.defineProperty(exports, "TextField", { enumerable: true, get: function () { return TextField_1.TextField; } });
-var Selector_1 = require("./Selector");
-Object.defineProperty(exports, "Dropdown", { enumerable: true, get: function () { return Selector_1.Dropdown; } });
-Object.defineProperty(exports, "Collapse", { enumerable: true, get: function () { return Selector_1.Collapse; } });
-Object.defineProperty(exports, "Option", { enumerable: true, get: function () { return Selector_1.Option; } });
-var EmailField_1 = require("./EmailField");
-Object.defineProperty(exports, "EmailField", { enumerable: true, get: function () { return EmailField_1.EmailField; } });
-var NameField_1 = require("./NameField");
-Object.defineProperty(exports, "NameField", { enumerable: true, get: function () { return NameField_1.NameField; } });
-var PhoneField_1 = require("./PhoneField");
-Object.defineProperty(exports, "PhoneField", { enumerable: true, get: function () { return PhoneField_1.PhoneField; } });
-var PasswordField_1 = require("./PasswordField");
-Object.defineProperty(exports, "PasswordField", { enumerable: true, get: function () { return PasswordField_1.PasswordField; } });
-var RepeatPasswordField_1 = require("./RepeatPasswordField");
-Object.defineProperty(exports, "RepeatPasswordField", { enumerable: true, get: function () { return RepeatPasswordField_1.RepeatPasswordField; } });
-var OtpInput_1 = require("./OtpInput");
-Object.defineProperty(exports, "OtpInput", { enumerable: true, get: function () { return OtpInput_1.OtpInput; } });
-var Checkbox_1 = require("./Checkbox");
-Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return Checkbox_1.Checkbox; } });
-var InnField_1 = require("./InnField");
-Object.defineProperty(exports, "InnField", { enumerable: true, get: function () { return InnField_1.InnField; } });

package/dist/cjs/Inputs/index.scss

@@ -1,6 +0,0 @@
-@import './Button/button';
-@import './TextField/textField';
-@import './Selector/selector';
-@import './Selector/Option/option';
-@import './OtpInput/otpInput';
-@import './Checkbox/checkbox';

package/dist/cjs/Pages/ContentPage/ContentPage.d.ts

@@ -1,6 +0,0 @@
-import { type ReactNode } from 'react';
-interface ContentPageProps {
-    children?: ReactNode;
-}
-export declare const ContentPage: ({ children }: ContentPageProps) => JSX.Element;
-export {};

package/dist/cjs/Pages/ContentPage/ContentPage.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ContentPage = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const Utils_1 = require("../../Utils");
-const Widgets_1 = require("../../Widgets");
-const ContentPage = ({ children }) => {
-    const [sidebarOpened, setSidebarOpened] = (0, react_1.useState)(false);
-    const [sidebarPinned, setSidebarPinned] = (0, react_1.useState)(false);
-    const onShowSidebar = () => {
-        setSidebarOpened(true);
-    };
-    const onCloseSidebar = (0, react_1.useCallback)(() => {
-        setSidebarOpened(false);
-    }, []);
-    const onPinSidebar = () => {
-        setSidebarPinned(true);
-    };
-    const onUnpinSidebar = () => {
-        setSidebarPinned(false);
-        onCloseSidebar();
-    };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Widgets_1.Header, { onShowSidebar: onShowSidebar, onCloseSidebar: onCloseSidebar, sidebarOpened: sidebarOpened, sidebarPinned: sidebarPinned }), (0, jsx_runtime_1.jsxs)("div", { className: 'content-page__content', children: [sidebarOpened && ((0, jsx_runtime_1.jsx)(Widgets_1.Sidebar, { pinned: sidebarPinned, onPinSidebar: onPinSidebar, onUnpinSidebar: onUnpinSidebar })), (0, jsx_runtime_1.jsx)("main", { className: 'content-page__main', children: children || (0, jsx_runtime_1.jsx)(Utils_1.SectionPlaceholder, {}) })] })] }));
-};
-exports.ContentPage = ContentPage;

package/dist/cjs/Pages/ContentPage/contentPage.scss

@@ -1,10 +0,0 @@
-.content-page {
-  &__content {
-    display: flex;
-    overflow: hidden;
-  }
-
-  &__main {
-    width: 100%;
-  }
-}

package/dist/cjs/Pages/ContentPage/index.d.ts

@@ -1 +0,0 @@
-export { ContentPage } from './ContentPage';

package/dist/cjs/Pages/ContentPage/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ContentPage = void 0;
-var ContentPage_1 = require("./ContentPage");
-Object.defineProperty(exports, "ContentPage", { enumerable: true, get: function () { return ContentPage_1.ContentPage; } });

package/dist/cjs/Pages/CreatePasswordPage/CreatePasswordPage.d.ts

@@ -1 +0,0 @@
-export declare const CreatePasswordPage: () => JSX.Element;

package/dist/cjs/Pages/CreatePasswordPage/CreatePasswordPage.js

@@ -1,51 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CreatePasswordPage = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const react_router_dom_1 = require("react-router-dom");
-const store_1 = require("../../app/store");
-const user_1 = require("../../entities/user");
-const Inputs_1 = require("../../Inputs");
-const Utils_1 = require("../../Utils");
-const CreatePasswordPage = () => {
-    const [password, setPassword] = (0, react_1.useState)('');
-    const [passwordValid, setPasswordValid] = (0, react_1.useState)(false);
-    const [passwordEqual, setPasswordEqual] = (0, react_1.useState)(false);
-    const [formValid, setFormValid] = (0, react_1.useState)(false);
-    const [hidePassword, setHidePassword] = (0, react_1.useState)(true);
-    const [createPassword, { isSuccess, isError, isLoading }] = (0, user_1.useCreatePasswordMutation)();
-    const navigate = (0, react_router_dom_1.useNavigate)();
-    const email = (0, store_1.useAppSelector)(user_1.selectEmail);
-    (0, react_1.useEffect)(() => {
-        if (!hidePassword) {
-            setFormValid(passwordValid);
-            return;
-        }
-        setFormValid([passwordValid, passwordEqual].every(Boolean));
-    }, [passwordValid, passwordEqual, hidePassword]);
-    (0, react_1.useEffect)(() => {
-        if (isSuccess) {
-            void navigate('/');
-        }
-    }, [isSuccess, navigate]);
-    const getBtnState = () => {
-        if (isLoading)
-            return 'loading';
-        return formValid ? 'idle' : 'disabled';
-    };
-    const handleSendPassword = () => {
-        if (formValid && email) {
-            void createPassword({ email, password });
-        }
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: 'create-password-page', children: [isLoading && (0, jsx_runtime_1.jsx)("div", { className: 'email-confirmation-page__overlay' }), (0, jsx_runtime_1.jsx)("h1", { className: 'create-password-page__title', children: "\u0421\u043E\u0437\u0434\u0430\u043D\u0438\u0435 \u043F\u0430\u0440\u043E\u043B\u044F" }), isError && ((0, jsx_runtime_1.jsx)(Utils_1.ErrorBanner, { error: '\u041E\u0448\u0438\u0431\u043A\u0430 \u0441\u043E\u0437\u0434\u0430\u043D\u0438\u044F \u043F\u0430\u0440\u043E\u043B\u044F' })), (0, jsx_runtime_1.jsxs)("form", { className: 'create-password-page__form', children: [(0, jsx_runtime_1.jsx)(Inputs_1.PasswordField, { onValidated: setPasswordValid, onPasswordInput: (password) => {
-                            setPassword(password);
-                        }, hidePassword: hidePassword, tabIndex: 1, onVisibilityToggle: () => {
-                            setHidePassword(!hidePassword);
-                        } }), hidePassword &&
-                        (0, jsx_runtime_1.jsx)(Inputs_1.RepeatPasswordField, { comparedValue: password, equalHandler: setPasswordEqual, tabIndex: 2, onVisibilityToggle: () => {
-                                setHidePassword(!hidePassword);
-                            } }), (0, jsx_runtime_1.jsx)(Inputs_1.Button, { label: '\u0412\u043E\u0439\u0442\u0438 \u0432 CRM', size: 'large', state: getBtnState(), tabIndex: 3, fullWidth: true, onClick: handleSendPassword })] })] }));
-};
-exports.CreatePasswordPage = CreatePasswordPage;

package/dist/cjs/Pages/CreatePasswordPage/createPasswordPage.scss

@@ -1,42 +0,0 @@
-$page-background: $surface-bright;
-$title:           $neutral-high;
-
-.create-password-page {
-  background-color: $page-background;
-
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-
-  box-sizing: border-box;
-  max-width: 400px;
-  margin: 0 auto;
-  padding: 24px 40px;
-
-  &__title {
-    margin-bottom: 32px;
-    font-size: 28px;
-    line-height: 36px;
-    color: $title;
-  }
-
-  &__form {
-    width: 100%;
-    padding-bottom: 16px;
-    display: flex;
-    flex-direction: column;
-    gap: 28px;
-  }
-}
-
-@media screen and (max-width: $sm) {
-  .register-page {
-    max-width: 320px;
-    padding: 24px 16px;
-
-    &__title {
-      font-size: 24px;
-      line-height: 32px;
-    }
-  }
-}

package/dist/cjs/Pages/CreatePasswordPage/index.d.ts

@@ -1 +0,0 @@
-export { CreatePasswordPage } from './CreatePasswordPage';

package/dist/cjs/Pages/CreatePasswordPage/index.js

@@ -1,5 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CreatePasswordPage = void 0;
-var CreatePasswordPage_1 = require("./CreatePasswordPage");
-Object.defineProperty(exports, "CreatePasswordPage", { enumerable: true, get: function () { return CreatePasswordPage_1.CreatePasswordPage; } });

package/dist/cjs/Pages/CreateTeamPage/CreateTeamPage.d.ts

@@ -1,4 +0,0 @@
-export interface ICreateTeamPage {
-    email: string;
-}
-export declare const CreateTeamPage: (props: ICreateTeamPage) => JSX.Element;

package/dist/cjs/Pages/CreateTeamPage/CreateTeamPage.js

@@ -1,53 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CreateTeamPage = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const fp_1 = require("lodash/fp");
-const react_1 = require("react");
-const chevron_left_svg_1 = __importDefault(require("../../assets/img/chevron-left.svg"));
-const Inputs_1 = require("../../Inputs");
-const Utils_1 = require("../../Utils");
-const CreateTeamPage = (props) => {
-    const { email } = props;
-    const [loading, setLoading] = (0, react_1.useState)(false);
-    const [innValid, setInnValid] = (0, react_1.useState)(false);
-    const [searchResult, setSearchResult] = (0, react_1.useState)('');
-    const [startWorkLoading, setStartWorkLoading] = (0, react_1.useState)(false);
-    const innRef = (0, react_1.useRef)('');
-    const getOrganization = () => {
-        setLoading(true);
-        setTimeout(() => {
-            setLoading(false);
-            setSearchResult('ООО “Сокращенное наименование”');
-        }, 1000);
-    };
-    const handleInnCheck = (0, react_1.useCallback)((0, fp_1.debounce)(500, getOrganization), []);
-    (0, react_1.useEffect)(() => {
-        if (innValid) {
-            handleInnCheck();
-            return;
-        }
-        handleInnCheck.cancel();
-        setLoading(false);
-        setSearchResult('');
-    }, [handleInnCheck, innValid]);
-    (0, react_1.useEffect)(() => {
-        if (startWorkLoading) {
-            setTimeout(() => {
-                setStartWorkLoading(false);
-            }, 1000);
-        }
-    }, [startWorkLoading]);
-    const getBtnState = () => {
-        if (startWorkLoading)
-            return 'loading';
-        return innValid ? 'idle' : 'disabled';
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: 'create-team-page', children: [startWorkLoading && (0, jsx_runtime_1.jsx)("div", { className: 'create-team-page__overlay' }), (0, jsx_runtime_1.jsxs)("h1", { className: 'create-team-page__title', children: ["\u0421\u043E\u0437\u0434\u0430\u0442\u044C \u043A\u043E\u043C\u0430\u043D\u0434\u0443 \u0434\u043B\u044F ", (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("span", { className: 'create-team-page__email', children: email })] }), (0, jsx_runtime_1.jsx)("p", { className: 'create-team-page__text', children: "\u0420\u044B\u0431\u0430\u0442\u0435\u043A\u0441\u0442 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442\u0441\u044F \u0434\u0438\u0437\u0430\u0439\u043D\u0435\u0440\u0430\u043C\u0438, \u043F\u0440\u043E\u0435\u043A\u0442\u0438\u0440\u043E\u0432\u0449\u0438\u043A\u0430\u043C\u0438 \u0438 \u0444\u0440\u043E\u043D\u0442\u0435\u043D\u0434\u0435\u0440\u0430\u043C\u0438, \u043A\u043E\u0433\u0434\u0430 \u043D\u0443\u0436\u043D\u043E \u0431\u044B\u0441\u0442\u0440\u043E \u0437\u0430\u043F\u043E\u043B\u043D\u0438\u0442\u044C \u043C\u0430\u043A\u0435\u0442\u044B \u0438\u043B\u0438 \u043F\u0440\u043E\u0442\u043E\u0442\u0438\u043F\u044B." }), (0, jsx_runtime_1.jsxs)("form", { className: 'create-team-page__form', children: [(0, jsx_runtime_1.jsx)(Inputs_1.InnField, { onValidated: setInnValid, onTextValid: (inn) => innRef.current = inn }), loading && (0, jsx_runtime_1.jsx)(Utils_1.Spinner, { className: 'create-team-page__spinner' }), searchResult && (0, jsx_runtime_1.jsx)("p", { className: 'create-team-page__organization', children: searchResult }), (0, jsx_runtime_1.jsx)(Inputs_1.Button, { label: '\u041D\u0430\u0447\u0430\u0442\u044C \u0440\u0430\u0431\u043E\u0442\u0443', size: 'large', state: getBtnState(), tabIndex: 1, onClick: () => {
-                            setStartWorkLoading(true);
-                        }, fullWidth: true })] }), (0, jsx_runtime_1.jsx)(Utils_1.Link, { label: '\u041D\u0430\u0437\u0430\u0434', iconComponent: (0, jsx_runtime_1.jsx)(chevron_left_svg_1.default, {}) })] }));
-};
-exports.CreateTeamPage = CreateTeamPage;