torgbox-ui 1.0.11 → 1.0.13

package/dist/esm/Pages/ResetPasswordPage/index.js

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

package/dist/esm/Pages/ResetPasswordPage/resetPasswordPage.scss

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

package/dist/esm/Pages/StartPage/StartPage.d.ts

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

package/dist/esm/Pages/StartPage/StartPage.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import { useAppDispatch } from '../../app/store';
-import { logout } from '../../entities/user';
-import { Button } from '../../Inputs';
-export const StartPage = (props) => {
-    const { email } = props;
-    const dispatch = useAppDispatch();
-    const [createLoading, setCreateLoading] = useState(false);
-    const [joinLoading, setJoinLoading] = useState(false);
-    useEffect(() => {
-        setTimeout(() => {
-            setCreateLoading(false);
-            setJoinLoading(false);
-        }, 2000);
-    });
-    return (_jsxs("div", { className: 'start-page', children: [(createLoading || joinLoading) && _jsx("div", { className: 'start-page__overlay' }), _jsxs("h1", { className: 'start-page__title', children: ["\u0414\u043E\u0431\u0440\u043E \u043F\u043E\u0436\u0430\u043B\u043E\u0432\u0430\u0442\u044C!", _jsx("br", {}), "\u0427\u0442\u043E \u0436\u0435\u043B\u0430\u0435\u0442\u0435 \u0441\u0434\u0435\u043B\u0430\u0442\u044C?"] }), _jsxs("div", { className: 'start-page__text-wrapper', children: [_jsxs("p", { className: 'start-page__text', children: ["\u0412\u044B \u0432\u043E\u0448\u043B\u0438 \u043A\u0430\u043A ", _jsx("span", { className: 'start-page__email', children: email })] }), _jsx("p", { className: 'start-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." })] }), _jsx(Button, { label: '\u0421\u043E\u0437\u0434\u0430\u0442\u044C \u043A\u043E\u043C\u0430\u043D\u0434\u0443', size: 'large', state: createLoading ? 'loading' : 'idle', tabIndex: 1, onClick: () => {
-                    setCreateLoading(true);
-                }, fullWidth: true }), _jsx(Button, { label: '\u0412\u0441\u0442\u0443\u043F\u0438\u0442\u044C \u0432 \u043A\u043E\u043C\u0430\u043D\u0434\u0443', size: 'large', state: joinLoading ? 'loading' : 'idle', variant: 'outlined-color', tabIndex: 2, onClick: () => {
-                    setJoinLoading(true);
-                }, fullWidth: true }), _jsx(Button, { label: '\u0412\u044B\u0439\u0442\u0438 \u0438\u0437 \u0441\u0438\u0441\u0442\u0435\u043C\u044B', size: 'large', variant: 'clear-neutral', tabIndex: 3, onClick: () => dispatch(logout()), fullWidth: true })] }));
-};

package/dist/esm/Pages/StartPage/index.d.ts

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

package/dist/esm/Pages/StartPage/index.js

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

package/dist/esm/Pages/StartPage/startPage.scss

@@ -1,58 +0,0 @@
-$page-background:  $surface-bright;
-$bold-text:        $neutral-high;
-$text:             $neutral-middle;
-
-.start-page {
-  background-color: $page-background;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 16px;
-  box-sizing: border-box;
-  max-width: 400px;
-  margin: 0 auto;
-  padding: 24px 40px;
-
-  &__overlay {
-    position: fixed;
-    top: 0;
-    bottom: 0;
-    right: 0;
-    left: 0;
-    background-color: $page-background;
-    opacity: 0.6;
-    z-index: 1;
-  }
-
-  &__title {
-    text-align: center;
-    margin-bottom: 32px;
-    font-size: 28px;
-    line-height: 36px;
-    color: $bold-text;
-  }
-
-  &__text-wrapper {
-    display: flex;
-    flex-direction: column;
-    gap: 12px;
-    padding-bottom: 12px;
-  }
-
-  &__text {
-    text-align: center;
-    color: $text;
-  }
-
-  &__email {
-    color: $bold-text;
-    font-weight: 700;
-  }
-}
-
-@media screen and (max-width: $sm) {
-  .start-page {
-    max-width: 320px;
-    padding: 24px 16px;
-  }
-}

package/dist/esm/Pages/index.d.ts

@@ -1,6 +0,0 @@
-export { RegisterPage } from './RegisterPage';
-export { EmailConfirmationPage } from './EmailConfirmationPage';
-export { CreatePasswordPage } from './CreatePasswordPage';
-export { LoginPage } from './LoginPage';
-export { StartPage } from './StartPage';
-export { ContentPage } from './ContentPage';

package/dist/esm/Pages/index.js

@@ -1,6 +0,0 @@
-export { RegisterPage } from './RegisterPage';
-export { EmailConfirmationPage } from './EmailConfirmationPage';
-export { CreatePasswordPage } from './CreatePasswordPage';
-export { LoginPage } from './LoginPage';
-export { StartPage } from './StartPage';
-export { ContentPage } from './ContentPage';

package/dist/esm/Pages/index.scss

@@ -1,9 +0,0 @@
-@import './RegisterPage/registerPage';
-@import './CreatePasswordPage/createPasswordPage';
-@import './EmailConfirmationPage/emailConfirmationPage';
-@import './LoginPage/loginPage';
-@import './StartPage/startPage';
-@import './CreateTeamPage/createTeamPage';
-@import './JoinTeamPage/joinTeamPage';
-@import './ResetPasswordPage/resetPasswordPage';
-@import './ContentPage/contentPage';

package/dist/esm/Utils/Divider/Divider.d.ts

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

package/dist/esm/Utils/Divider/Divider.js

@@ -1,2 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export const Divider = () => _jsx("hr", { className: 'divider' });

package/dist/esm/Utils/Divider/divider.scss

@@ -1,11 +0,0 @@
-@use 'sass:color';
-
-$line-color: $global-color-neutral-80;
-
-.divider {
-  width: 100%;
-  height: 1px;
-  margin: 12px 0;
-  background-color: $line-color;
-  border: none;
-}

package/dist/esm/Utils/ErrorBanner/ErrorBanner.d.ts

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

package/dist/esm/Utils/ErrorBanner/ErrorBanner.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import WarningIcon from '../../assets/img/warning.svg';
-export const ErrorBanner = (props) => {
-    const { error } = props;
-    return (_jsxs("div", { className: 'error-banner', children: [_jsx("div", { className: 'error-banner__icon', children: _jsx(WarningIcon, {}) }), _jsx("p", { className: 'error-banner__text', children: error })] }));
-};

package/dist/esm/Utils/ErrorBanner/errorBanner.scss

@@ -1,24 +0,0 @@
-$error-content: $error-high;
-$error-background: $error-border-low;
-
-.error-banner {
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  background-color: $error-background;
-  border-radius: 4px;
-  padding: 14px;
-  box-sizing: border-box;
-  width: 100%;
-  margin-bottom: 16px;
-
-  &__icon {
-    fill: $error-content;
-    width: 16px;
-    height: 16px;
-  }
-
-  &__text {
-    color: $error-content;
-  }
-}

package/dist/esm/Utils/ErrorBanner/index.d.ts

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

package/dist/esm/Utils/ErrorBanner/index.js

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

package/dist/esm/Utils/Link/Link.d.ts

@@ -1,7 +0,0 @@
-import type { ReactNode, AnchorHTMLAttributes } from 'react';
-export interface ILink extends AnchorHTMLAttributes<HTMLAnchorElement> {
-    label: string;
-    iconComponent?: ReactNode;
-    iconClassName?: string;
-}
-export declare const Link: ({ iconComponent, label, iconClassName, ...props }: ILink) => JSX.Element;

package/dist/esm/Utils/Link/Link.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import cn from 'classnames';
-export const Link = ({ iconComponent, label, iconClassName, ...props }) => {
-    return (_jsxs("a", { href: '#', className: 'link', ...props, children: [iconComponent && (_jsx("div", { className: cn('link__icon', [iconClassName]), children: iconComponent })), label] }));
-};

package/dist/esm/Utils/Link/index.d.ts

@@ -1 +0,0 @@
-export { Link, type ILink } from './Link';

package/dist/esm/Utils/Link/index.js

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

package/dist/esm/Utils/Link/index.scss

@@ -1 +0,0 @@
-@import './Link/link';

package/dist/esm/Utils/Link/link.scss

@@ -1,21 +0,0 @@
-.link {
-  color: $primary-high;
-  font-size: 14px;
-  line-height: 20px;
-  display: flex;
-  gap: 4px;
-
-  &:hover,
-  &:focus {
-    cursor: pointer;
-    text-decoration: underline $primary-middle;
-  }
-
-  &__icon {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    fill: $primary-high;
-    width: 20px;
-  }
-}

package/dist/esm/Utils/Modal/Modal.d.ts

@@ -1,8 +0,0 @@
-import { type ReactNode } from 'react';
-export interface IModal {
-    opened: boolean;
-    onCloseModal: () => void;
-    children?: ReactNode;
-    className?: string;
-}
-export declare const Modal: (props: IModal) => JSX.Element;

package/dist/esm/Utils/Modal/Modal.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import cn from 'classnames';
-import { useCallback, useEffect, } from 'react';
-import { Portal } from '../Portal/Portal';
-export const Modal = (props) => {
-    const { opened, onCloseModal, children, className, } = props;
-    const onContentHandler = (e) => {
-        e.stopPropagation();
-    };
-    const onKeydownHandler = useCallback((e) => {
-        if (e.key === 'Escape') {
-            onCloseModal();
-        }
-    }, [onCloseModal]);
-    useEffect(() => {
-        if (opened) {
-            window.addEventListener('keydown', onKeydownHandler);
-        }
-        return () => {
-            window.removeEventListener('keydown', onKeydownHandler);
-        };
-    }, [opened, onKeydownHandler]);
-    return (_jsx(Portal, { children: _jsx("div", { className: cn('modal', className), children: _jsx("div", { className: 'modal__overlay', onClick: onCloseModal, children: _jsx("div", { className: 'modal__content', onClick: onContentHandler, children: children }) }) }) }));
-};

package/dist/esm/Utils/Modal/index.d.ts

@@ -1 +0,0 @@
-export { Modal, type IModal } from './Modal';

package/dist/esm/Utils/Modal/index.js

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

package/dist/esm/Utils/Modal/modal.scss

@@ -1,33 +0,0 @@
-@use 'sass:color';
-
-$modal-background-color: $global-color-neutral-100;
-$modal-overlay-color:    $neutral-A48;
-$modal-border-color:     $global-color-neutral-20;
-
-.modal {
-  width: 100%;
-  height: 100%;
-  position: fixed;
-  inset: 0;
-  z-index: 1001;
-
-  &__overlay {
-    width: 100%;
-    height: 100%;
-    background-color: $modal-overlay-color;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-
-  &__content {
-    width: 440px;
-    padding: 32px 32px 24px 32px;
-    display: flex;
-    flex-flow: column nowrap;
-    gap: 16px;
-    background-color: $modal-background-color;
-    border-radius: 8px;
-    border: 1px solid $modal-border-color;
-  }
-}

package/dist/esm/Utils/Portal/Portal.d.ts

@@ -1,7 +0,0 @@
-import { type ReactNode } from 'react';
-interface IPortal {
-    children?: ReactNode;
-    element?: HTMLElement;
-}
-export declare const Portal: (props: IPortal) => JSX.Element;
-export {};

package/dist/esm/Utils/Portal/Portal.js

@@ -1,5 +0,0 @@
-import { createPortal } from 'react-dom';
-export const Portal = (props) => {
-    const { children, element = document.body } = props;
-    return createPortal(children, element);
-};

package/dist/esm/Utils/SectionPlaceholder/SectionPlaceholder.d.ts

@@ -1,5 +0,0 @@
-interface SectionPlaceholderProps {
-    label?: string;
-}
-export declare const SectionPlaceholder: ({ label }: SectionPlaceholderProps) => JSX.Element;
-export {};

package/dist/esm/Utils/SectionPlaceholder/SectionPlaceholder.js

@@ -1,2 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export const SectionPlaceholder = ({ label = 'Placeholder' }) => (_jsx("section", { className: 'section-placeholder', children: _jsx("div", { className: 'placeholder', children: label }) }));

package/dist/esm/Utils/SectionPlaceholder/sectionPlaceholder.scss

@@ -1,22 +0,0 @@
-@use 'sass:color';
-
-$section-background-color: $global-color-neutral-80;
-$border-dash-color:        $global-color-neutral-40;
-
-.section-placeholder {
-  width: 100%;
-  height: calc(100vh - $header-height);
-  padding: 24px;
-  box-sizing: border-box;
-  background-color: $section-background-color;
-
-  .placeholder {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 8px;
-    border: 1px dashed $border-dash-color;
-  }
-}

package/dist/esm/Utils/Spinner/Spinner.d.ts

@@ -1,5 +0,0 @@
-interface ISpinner {
-    className?: string;
-}
-export declare const Spinner: ({ className }: ISpinner) => JSX.Element;
-export {};

package/dist/esm/Utils/Spinner/Spinner.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import cn from 'classnames';
-export const Spinner = ({ className }) => {
-    return (_jsx("div", { className: cn('spinner', className), children: _jsx("svg", { viewBox: '25 25 50 50', children: _jsx("circle", { cx: '50', cy: '50', r: '20' }) }) }));
-};

package/dist/esm/Utils/Spinner/spinner.scss

@@ -1,41 +0,0 @@
-.spinner {
-  display: flex;
-  align-items: center;
-}
-
-.spinner svg {
-  transform-origin: center;
-  animation: rotate 2s linear infinite;
-}
-
-.spinner circle {
-  fill: none;
-  stroke-dasharray: 1, 200;
-  stroke-dashoffset: 0;
-  stroke-linecap: round;
-  stroke-width: 4;
-
-  animation: dash 1.5s ease-in-out infinite;
-}
-
-@keyframes rotate {
-  100% {
-    transform: rotate(360deg);
-  }
-}
-
-@keyframes dash {
-  0% {
-    stroke-dasharray: 1, 200;
-    stroke-dashoffset: 0;
-  }
-
-  50% {
-    stroke-dasharray: 90, 200;
-    stroke-dashoffset: -35px;
-  }
-
-  100% {
-    stroke-dashoffset: -125px;
-  }
-}

package/dist/esm/Utils/api.d.ts

@@ -1 +0,0 @@
-export declare const baseApi: import("@reduxjs/toolkit/query").Api<import("@reduxjs/toolkit/query").BaseQueryFn<string | import("@reduxjs/toolkit/query").FetchArgs, unknown, import("@reduxjs/toolkit/query").FetchBaseQueryError, {}, import("@reduxjs/toolkit/query").FetchBaseQueryMeta>, {}, "baseApi", never, typeof import("@reduxjs/toolkit/query").coreModuleName | typeof import("@reduxjs/toolkit/query/react").reactHooksModuleName>;

package/dist/esm/Utils/api.js

@@ -1,7 +0,0 @@
-import { createApi, fetchBaseQuery, } from '@reduxjs/toolkit/query/react';
-import { BASE_URL } from '@/shared/model';
-export const baseApi = createApi({
-    reducerPath: 'baseApi',
-    baseQuery: fetchBaseQuery({ baseUrl: BASE_URL }),
-    endpoints: () => ({}),
-});

package/dist/esm/Utils/index.d.ts

@@ -1,7 +0,0 @@
-export { Spinner } from './Spinner/Spinner';
-export { Portal } from './Portal/Portal';
-export { Link } from './Link/Link';
-export { ErrorBanner } from './ErrorBanner';
-export { Modal } from './Modal/Modal';
-export { Divider } from './Divider/Divider';
-export { SectionPlaceholder } from './SectionPlaceholder/SectionPlaceholder';

package/dist/esm/Utils/index.js

@@ -1,7 +0,0 @@
-export { Spinner } from './Spinner/Spinner';
-export { Portal } from './Portal/Portal';
-export { Link } from './Link/Link';
-export { ErrorBanner } from './ErrorBanner';
-export { Modal } from './Modal/Modal';
-export { Divider } from './Divider/Divider';
-export { SectionPlaceholder } from './SectionPlaceholder/SectionPlaceholder';

package/dist/esm/Utils/index.scss

@@ -1,6 +0,0 @@
-@import './Spinner/spinner';
-@import './Link/link';
-@import './ErrorBanner/errorBanner';;
-@import './Modal/modal';
-@import './Divider/divider';
-@import './SectionPlaceholder/sectionPlaceholder';

package/dist/esm/Widgets/Header/Header.d.ts

@@ -1,7 +0,0 @@
-export interface IHeader {
-    onShowSidebar: () => void;
-    onCloseSidebar: () => void;
-    sidebarOpened: boolean;
-    sidebarPinned: boolean;
-}
-export declare const Header: (props: IHeader) => JSX.Element;

package/dist/esm/Widgets/Header/Header.js

@@ -1,18 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import cn from 'classnames';
-import { useState } from 'react';
-import BeltIcon from '../../assets/img/belt.svg';
-import BurgerMenuIcon from '../../assets/img/burger-menu.svg';
-import CrossIcon from '../../assets/img/cross.svg';
-import SampleLogoIcon from '../../assets/img/sample-logo.svg';
-import { Button, TextField } from '../../Inputs';
-import { Avatar } from '../../shared/ui';
-import { Link } from '../../Utils';
-export const Header = (props) => {
-    const { onShowSidebar, onCloseSidebar, sidebarOpened, sidebarPinned, } = props;
-    const [searchQuery, setSearchQuery] = useState('');
-    return (_jsxs("header", { className: 'header', children: [_jsxs("div", { className: 'header__logo-search-wrapper', children: [_jsxs("div", { className: cn('header__logo-search-wrapper__logo-box', {
-                            'header__logo-search-wrapper__logo-box--noButton': sidebarPinned,
-                        }), children: [!sidebarPinned &&
-                                (_jsx(Button, { size: 'large', variant: 'clear-neutral', iconComponent: sidebarOpened ? _jsx(CrossIcon, {}) : _jsx(BurgerMenuIcon, {}), onClick: sidebarOpened ? onCloseSidebar : onShowSidebar })), _jsx(Link, { label: '', iconComponent: _jsx(SampleLogoIcon, {}), iconClassName: 'link--wide' })] }), _jsx(TextField, { onChange: setSearchQuery, className: 'search-field', state: 'idle', type: 'text', value: searchQuery, placeholder: '\u0418\u0441\u043A\u0430\u0442\u044C \u0447\u0442\u043E \u0443\u0433\u043E\u0434\u043D\u043E...', searchIcon: true, ...props })] }), _jsxs("div", { className: 'header__user-controls', children: [_jsx(Button, { size: 'large', variant: 'clear-neutral', iconComponent: _jsx(BeltIcon, {}) }), _jsx(Avatar, { label: '\u0418\u0424', size: 'lg' })] })] }));
-};

package/dist/esm/Widgets/Header/header.scss

@@ -1,50 +0,0 @@
-@use 'sass:color';
-
-$border-color-neutral: $neutral-middle;
-
-.header {
-  width: 100%;
-  height: $header-height;
-  padding-right: 23px;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  border-bottom: 1px solid $border-color-neutral;
-
-  &__logo-search-wrapper {
-    height: 100%;
-    display: flex;
-    align-items: center;
-
-    &__logo-box {
-      height: 100%;
-      width: 260px;
-      padding: 0 16px;
-      box-sizing: border-box;
-      display: flex;
-      align-items: center;
-      gap: 17px;
-
-      &--noButton {
-        padding: 0;
-        justify-content: center;
-      }
-
-      .link--wide {
-        width: auto;
-      }
-    }
-
-    .search-field {
-      border: none;
-      gap: 10px;
-    }
-  }
-
-  &__user-controls {
-    display: flex;
-    align-items: center;
-    gap: 12px;
-  }
-}

package/dist/esm/Widgets/Header/index.d.ts

@@ -1 +0,0 @@
-export { Header, type IHeader } from './Header';

package/dist/esm/Widgets/Header/index.js

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

package/dist/esm/Widgets/Sidebar/Sidebar.d.ts

@@ -1,9 +0,0 @@
-import { type ReactNode } from 'react';
-export interface ISidebar {
-    pinned: boolean;
-    onPinSidebar: () => void;
-    onUnpinSidebar: () => void;
-    children?: ReactNode;
-    className?: string;
-}
-export declare const Sidebar: (props: ISidebar) => JSX.Element;

package/dist/esm/Widgets/Sidebar/Sidebar.js

@@ -1,25 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import cn from 'classnames';
-import { useEffect, useRef } from 'react';
-import LeftArrowIcon from '../../assets/img/left-arrow.svg';
-import RightArrowIcon from '../../assets/img/right-arrow.svg';
-import { Button } from '../../Inputs';
-import { Divider } from '../../Utils';
-export const Sidebar = (props) => {
-    const { children, className, pinned, onPinSidebar, onUnpinSidebar, } = props;
-    const sidebarRef = useRef(null);
-    useEffect(() => {
-        const handleClickOutside = (event) => {
-            if (sidebarRef.current &&
-                !sidebarRef.current.contains(event.target) &&
-                !pinned) {
-                onUnpinSidebar();
-            }
-        };
-        document.addEventListener('mousedown', handleClickOutside);
-        return () => {
-            document.removeEventListener('mousedown', handleClickOutside);
-        };
-    }, [onUnpinSidebar, pinned]);
-    return (_jsxs("aside", { className: cn('sidebar', className), ref: sidebarRef, children: [_jsx("div", { className: 'sidebar__content', children: children }), _jsx(Divider, {}), _jsx("div", { className: 'sidebar__control', children: _jsx(Button, { className: 'sidebar-button', size: 'large', variant: 'clear-neutral', label: pinned ? 'Скрыть меню' : 'Закрепить меню', iconComponent: pinned ? _jsx(LeftArrowIcon, {}) : _jsx(RightArrowIcon, {}), onClick: pinned ? onUnpinSidebar : onPinSidebar, fullWidth: true }) })] }));
-};

package/dist/esm/Widgets/Sidebar/index.d.ts

@@ -1 +0,0 @@
-export { Sidebar, type ISidebar } from './Sidebar';

package/dist/esm/Widgets/Sidebar/index.js

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