@megafon/ui-lk-vas 0.10.9 → 0.10.12

package/dist/es/components/Table/Table.js

@@ -0,0 +1,76 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import * as React from 'react';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import throttle from 'lodash.throttle';
+import TableContext from "./contexts/TableContext";
+import { calculateScrollPosition } from "./helpers";
+import "./Table.css";
+var cn = cnCreate('mfui-lkvas-table');
+var Table = function Table(_ref) {
+  var className = _ref.className,
+    height = _ref.height,
+    dataAttrs = _ref.dataAttrs,
+    children = _ref.children;
+  var rootRef = React.useRef(null);
+  var tableRef = React.useRef(null);
+  var _React$useState = React.useState({
+      horizontal: 'none',
+      vertical: 'none'
+    }),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    scrollPosition = _React$useState2[0],
+    setScrollPosition = _React$useState2[1];
+  var handleTableScroll = React.useCallback(function () {
+    var rootNode = rootRef.current;
+    if (!rootNode) {
+      return;
+    }
+    var scrollWidth = rootNode.scrollWidth,
+      scrollHeight = rootNode.scrollHeight,
+      clientWidth = rootNode.clientWidth,
+      clientHeight = rootNode.clientHeight,
+      scrollLeft = rootNode.scrollLeft,
+      scrollTop = rootNode.scrollTop;
+    var deltaWidth = scrollWidth - clientWidth;
+    var deltaHeight = scrollHeight - clientHeight;
+    setScrollPosition({
+      horizontal: calculateScrollPosition(scrollLeft, deltaWidth),
+      vertical: calculateScrollPosition(scrollTop, deltaHeight)
+    });
+  }, []);
+  React.useEffect(function () {
+    if (!tableRef.current) {
+      return undefined;
+    }
+    var tableNode = tableRef.current;
+    var handleResize = throttle(handleTableScroll, 300);
+    var observer = new ResizeObserver(handleResize);
+    observer.observe(tableNode);
+    handleTableScroll();
+    return function () {
+      observer.unobserve(tableNode);
+    };
+  }, [handleTableScroll]);
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn({
+      'v-scroll': scrollPosition.vertical,
+      'h-scroll': scrollPosition.horizontal
+    }, [className])
+  }), /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.inner), {
+    className: cn('inner'),
+    style: {
+      height: height
+    },
+    ref: rootRef,
+    onScroll: handleTableScroll
+  }), /*#__PURE__*/React.createElement(TableContext.Provider, {
+    value: {
+      scrollPosition: scrollPosition
+    }
+  }, /*#__PURE__*/React.createElement("table", {
+    className: cn('table'),
+    ref: tableRef
+  }, children))));
+};
+export default Table;

package/dist/es/components/Table/components/TableBody/TableBody.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+export interface ITableBody {
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
+}
+declare const TableBody: React.FC<React.PropsWithChildren<ITableBody>>;
+export default TableBody;

package/dist/es/components/Table/components/TableBody/TableBody.js

@@ -0,0 +1,13 @@
+import _extends from "@babel/runtime/helpers/extends";
+import * as React from 'react';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+var cn = cnCreate('mfui-lkvas-table-body');
+var TableBody = function TableBody(_ref) {
+  var className = _ref.className,
+    dataAttrs = _ref.dataAttrs,
+    children = _ref.children;
+  return /*#__PURE__*/React.createElement("tbody", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn([className])
+  }), children);
+};
+export default TableBody;

package/dist/es/components/Table/components/TableHead/TableHead.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+export interface ITableHead {
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
+}
+declare const TableHead: React.FC<React.PropsWithChildren<ITableHead>>;
+export default TableHead;

package/dist/es/components/Table/components/TableHead/TableHead.js

@@ -0,0 +1,13 @@
+import _extends from "@babel/runtime/helpers/extends";
+import * as React from 'react';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+var cn = cnCreate('mfui-lkvas-table-head');
+var TableHead = function TableHead(_ref) {
+  var className = _ref.className,
+    dataAttrs = _ref.dataAttrs,
+    children = _ref.children;
+  return /*#__PURE__*/React.createElement("thead", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn([className])
+  }), children);
+};
+export default TableHead;

package/dist/es/components/Table/components/TableSettings/TableSettings.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-lkvas-table-settings__dots,.mfui-lkvas-table-settings__dots-inner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.mfui-lkvas-table-settings__dots-inner{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:2px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;cursor:pointer;height:24px;width:24px}.mfui-lkvas-table-settings__dot{background-color:var(--content);border-radius:50%;height:4px;-webkit-transition:background-color .3s;transition:background-color .3s;width:4px}.mfui-lkvas-table-settings__dots:hover .mfui-lkvas-table-settings__dot{background-color:var(--brandGreen)}.mfui-lkvas-table-settings__tooltip{width:276px}

package/dist/es/components/Table/components/TableSettings/TableSettings.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { ItemType } from '../../../_DropdownItem/DropdownItem';
+import './TableSettings.scss';
+export interface ITableSettingsProps {
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Пункты всплывающего списка */
+    items: ItemType[];
+    /** Дополнительные классы для внутренних элементов */
+    classes?: {
+        root?: string;
+        tooltip?: string;
+    };
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        dots?: Record<string, string>;
+        tooltip?: Record<string, string>;
+        item?: Record<string, string>;
+    };
+}
+declare const TableSettings: React.FC<React.PropsWithChildren<ITableSettingsProps>>;
+export default TableSettings;

package/dist/es/components/Table/components/TableSettings/TableSettings.js

@@ -0,0 +1,50 @@
+import _extends from "@babel/runtime/helpers/extends";
+import "core-js/modules/es.array.map.js";
+import * as React from 'react';
+import { Tooltip } from '@megafon/ui-core';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import DropdownItem from "../../../_DropdownItem/DropdownItem";
+import "./TableSettings.css";
+var cn = cnCreate('mfui-lkvas-table-settings');
+var TableSettings = function TableSettings(_ref) {
+  var className = _ref.className,
+    items = _ref.items,
+    classes = _ref.classes,
+    dataAttrs = _ref.dataAttrs;
+  var triggerRef = React.useRef(null);
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn([className, classes === null || classes === void 0 ? void 0 : classes.root])
+  }), /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.dots), {
+    className: cn('dots'),
+    ref: triggerRef
+  }), /*#__PURE__*/React.createElement("div", {
+    className: cn('dots-inner')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: cn('dot')
+  }), /*#__PURE__*/React.createElement("div", {
+    className: cn('dot')
+  }), /*#__PURE__*/React.createElement("div", {
+    className: cn('dot')
+  }))), /*#__PURE__*/React.createElement(Tooltip, {
+    className: cn('tooltip', [classes === null || classes === void 0 ? void 0 : classes.tooltip]),
+    triggerElement: triggerRef,
+    placement: "left",
+    fallbackPlacements: ['right'],
+    triggerEvent: "click",
+    colorTheme: "blue",
+    strategy: "fixed",
+    offset: "small",
+    dataAttrs: {
+      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.tooltip
+    }
+  }, items.map(function (item) {
+    return /*#__PURE__*/React.createElement(DropdownItem, _extends({}, item, {
+      key: item.id + item.title,
+      color: "white",
+      dataAttrs: {
+        root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item
+      }
+    }));
+  })));
+};
+export default TableSettings;

package/dist/es/components/Table/components/TableTd/TableTd.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-lkvas-table-td{background-color:var(--base);font-size:15px;font-weight:400;line-height:24px;padding:12px}.mfui-lkvas-table-td_pinned:first-child{left:0;position:sticky}.mfui-lkvas-table-td_pinned:first-child:not(.mfui-lkvas-table-td_scroll_start,.mfui-lkvas-table-td_scroll_none):after{background:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.04)),color-stop(49.5%,rgba(0,0,0,.01)),to(hsla(0,0%,100%,0)));background:linear-gradient(90deg,rgba(0,0,0,.04),rgba(0,0,0,.01) 49.5%,hsla(0,0%,100%,0));bottom:0;content:"";position:absolute;right:-18px;top:0;width:18px}.mfui-lkvas-table-td_pinned:last-child{position:sticky;right:0}.mfui-lkvas-table-td_pinned:last-child:not(.mfui-lkvas-table-td_scroll_end,.mfui-lkvas-table-td_scroll_none):after{background:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.04)),color-stop(49.5%,rgba(0,0,0,.01)),to(hsla(0,0%,100%,0)));background:linear-gradient(270deg,rgba(0,0,0,.04),rgba(0,0,0,.01) 49.5%,hsla(0,0%,100%,0));bottom:0;content:"";left:-18px;position:absolute;top:0;width:18px}.mfui-lkvas-table-td_active{background-color:var(--spbSky0)}

package/dist/es/components/Table/components/TableTd/TableTd.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import './TableTd.scss';
+export interface ITableTdProps {
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Атрибут colSpan для тега td */
+    colSpan?: number;
+    /** Фиксация ячейки во время горизонтальной прокрутки (только для первой и последней ячейки в строке) */
+    pinned?: boolean;
+    /** Сделать активной отсортированную ячейку */
+    isSortActive?: boolean;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
+}
+declare const TableTd: React.FC<React.PropsWithChildren<ITableTdProps>>;
+export default TableTd;

package/dist/es/components/Table/components/TableTd/TableTd.js

@@ -0,0 +1,26 @@
+import _extends from "@babel/runtime/helpers/extends";
+import * as React from 'react';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import TableContext from "../../contexts/TableContext";
+import "./TableTd.css";
+var cn = cnCreate('mfui-lkvas-table-td');
+var TableTd = function TableTd(_ref) {
+  var className = _ref.className,
+    colSpan = _ref.colSpan,
+    pinned = _ref.pinned,
+    _ref$isSortActive = _ref.isSortActive,
+    isSortActive = _ref$isSortActive === void 0 ? false : _ref$isSortActive,
+    dataAttrs = _ref.dataAttrs,
+    children = _ref.children;
+  var _React$useContext = React.useContext(TableContext),
+    scrollPosition = _React$useContext.scrollPosition;
+  return /*#__PURE__*/React.createElement("td", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn({
+      pinned: pinned,
+      scroll: pinned && scrollPosition.horizontal,
+      active: isSortActive
+    }, [className]),
+    colSpan: colSpan
+  }), children);
+};
+export default TableTd;

package/dist/es/components/Table/components/TableTh/TableTh.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-lkvas-table-th{background-color:var(--spbSky0);color:var(--spbSky3);font-size:15px;font-weight:500;line-height:24px;padding:16px 12px;text-align:left}.mfui-lkvas-table-th:first-child{border-radius:12px 0 0 12px}.mfui-lkvas-table-th:last-child{border-radius:0 12px 12px 0}.mfui-lkvas-table-th__inner{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;gap:4px;position:relative;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-lkvas-table-th_pinned:first-child{left:0;position:sticky;z-index:1}.mfui-lkvas-table-th_pinned:first-child:not(.mfui-lkvas-table-th_scroll_start,.mfui-lkvas-table-th_scroll_none):after{background:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.04)),color-stop(49.5%,rgba(0,0,0,.01)),to(hsla(0,0%,100%,0)));background:linear-gradient(90deg,rgba(0,0,0,.04),rgba(0,0,0,.01) 49.5%,hsla(0,0%,100%,0));bottom:0;content:"";position:absolute;right:-18px;top:0;width:18px}.mfui-lkvas-table-th_pinned:last-child{position:sticky;right:0;z-index:1}.mfui-lkvas-table-th_pinned:last-child:not(.mfui-lkvas-table-th_scroll_end,.mfui-lkvas-table-th_scroll_none):after{background:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.04)),color-stop(49.5%,rgba(0,0,0,.01)),to(hsla(0,0%,100%,0)));background:linear-gradient(270deg,rgba(0,0,0,.04),rgba(0,0,0,.01) 49.5%,hsla(0,0%,100%,0));bottom:0;content:"";left:-18px;position:absolute;top:0;width:18px}.mfui-lkvas-table-th__sorting{display:-webkit-box;display:-ms-flexbox;display:flex;left:100%;position:absolute;top:50%;translate:4px -50%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:4px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.mfui-lkvas-table-th__sorting-down,.mfui-lkvas-table-th__sorting-up{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;cursor:pointer;height:20px;justify-content:center;width:20px}.mfui-lkvas-table-th__sorting-down:after,.mfui-lkvas-table-th__sorting-up:after{border-left:3px solid transparent;border-right:3px solid transparent;content:"";height:0;width:0}.mfui-lkvas-table-th__sorting-up{-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.mfui-lkvas-table-th__sorting-up:after{border-bottom:4px solid var(--spbSky3)}.mfui-lkvas-table-th__sorting-up:hover:after,.mfui-lkvas-table-th__sorting-up_current:after{border-bottom-color:var(--content)}.mfui-lkvas-table-th__sorting-down{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.mfui-lkvas-table-th__sorting-down:after{border-top:4px solid var(--spbSky3);content:""}.mfui-lkvas-table-th__sorting-down:hover:after,.mfui-lkvas-table-th__sorting-down_current:after{border-top-color:var(--content)}.mfui-lkvas-table-th__notice-icon{cursor:pointer;display:block;height:24px;width:24px;fill:var(--spbSky3)}.mfui-lkvas-table-th_active{background-color:var(--spbSky1)}

package/dist/es/components/Table/components/TableTh/TableTh.d.ts

@@ -0,0 +1,45 @@
+import * as React from 'react';
+import './TableTh.scss';
+type SortType = 'up' | 'down';
+interface ITooltip {
+    /** Заголовок тултипа */
+    title: string;
+    /** Текст тултипа */
+    text: string;
+    /** Текст кнопки тултипа */
+    buttonText?: string;
+    /** Отобразить кнопку закрытия тултипа */
+    hasCloseButton?: boolean;
+    /** Обработчик клика по кнопке тултипа */
+    onButtonClick?: (e: React.SyntheticEvent<EventTarget, Event>) => void;
+    /** Обработчик клика по кнопке закрытия тултипа */
+    onCloseButtonClick?: (e: React.SyntheticEvent<EventTarget, Event>) => void;
+}
+export interface ITableThProps {
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Фиксация ячейки во время горизонтальной прокрутки (только для первой и последней ячейки в строке) */
+    pinned?: boolean;
+    /** Показать элементы сортировки */
+    showSorting?: boolean;
+    /** Сделать активной отсортированную ячейку */
+    isSortActive?: boolean;
+    /** Текущий тип сортировки */
+    currentSortType?: SortType;
+    /** Минимальная ширина ячейки */
+    minWidth?: string;
+    /** Ширина ячейки */
+    width?: string;
+    /** Информационная иконка с тултипом */
+    infoTooltip?: ITooltip;
+    /** Обработчик клика по элементам сортировки */
+    onSort?: (type: SortType) => void;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        sortingUp?: Record<string, string>;
+        sortingDown?: Record<string, string>;
+    };
+}
+declare const TableTh: React.FC<React.PropsWithChildren<ITableThProps>>;
+export default TableTh;

package/dist/es/components/Table/components/TableTh/TableTh.js

@@ -0,0 +1,81 @@
+import _extends from "@babel/runtime/helpers/extends";
+import * as React from 'react';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import TableContext from "../../contexts/TableContext";
+import TableTooltip from "../TableTooltip/TableTooltip";
+import "./TableTh.css";
+var InfoIcon = function InfoIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    viewBox: "0 0 32 32"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M16 4C9.4 4 4 9.4 4 16s5.4 12 12 12 12-5.4 12-12S22.6 4 16 4zm1 18h-2v-8h2v8zm0-10h-2v-2h2v2z"
+  }));
+};
+var cn = cnCreate('mfui-lkvas-table-th');
+var TableTh = function TableTh(_ref) {
+  var className = _ref.className,
+    pinned = _ref.pinned,
+    _ref$showSorting = _ref.showSorting,
+    showSorting = _ref$showSorting === void 0 ? false : _ref$showSorting,
+    _ref$isSortActive = _ref.isSortActive,
+    isSortActive = _ref$isSortActive === void 0 ? false : _ref$isSortActive,
+    _ref$currentSortType = _ref.currentSortType,
+    currentSortType = _ref$currentSortType === void 0 ? 'up' : _ref$currentSortType,
+    minWidth = _ref.minWidth,
+    width = _ref.width,
+    infoTooltip = _ref.infoTooltip,
+    children = _ref.children,
+    dataAttrs = _ref.dataAttrs,
+    onSort = _ref.onSort;
+  var _React$useContext = React.useContext(TableContext),
+    scrollPosition = _React$useContext.scrollPosition;
+  var handleSort = function handleSort(type) {
+    return function () {
+      onSort === null || onSort === void 0 ? void 0 : onSort(type);
+    };
+  };
+  var renderSorting = function renderSorting() {
+    if (!showSorting) {
+      return null;
+    }
+    return /*#__PURE__*/React.createElement("div", {
+      className: cn('sorting')
+    }, /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.sortingUp), {
+      className: cn('sorting-up', {
+        current: isSortActive && currentSortType === 'up'
+      }),
+      onClick: handleSort('up'),
+      role: "presentation"
+    })), /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.sortingDown), {
+      className: cn('sorting-down', {
+        current: isSortActive && currentSortType === 'down'
+      }),
+      onClick: handleSort('down'),
+      role: "presentation"
+    })));
+  };
+  var renderNotice = function renderNotice() {
+    if (!infoTooltip) {
+      return null;
+    }
+    return /*#__PURE__*/React.createElement(TableTooltip, _extends({}, infoTooltip, {
+      trigger: /*#__PURE__*/React.createElement(InfoIcon, {
+        className: cn('notice-icon')
+      })
+    }));
+  };
+  return /*#__PURE__*/React.createElement("th", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn({
+      pinned: pinned,
+      scroll: pinned && scrollPosition.horizontal,
+      active: isSortActive
+    }, [className]),
+    style: {
+      minWidth: minWidth,
+      width: width
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    className: cn('inner')
+  }, children, renderNotice(), renderSorting()));
+};
+export default TableTh;

package/dist/es/components/Table/components/TableTooltip/TableTooltip.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-lkvas-table-tooltip{display:-webkit-box;display:-ms-flexbox;display:flex}.mfui-lkvas-table-tooltip__trigger{cursor:pointer}.mfui-lkvas-table-tooltip__tooltip{width:288px}

package/dist/es/components/Table/components/TableTooltip/TableTooltip.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import './TableTooltip.scss';
+export interface ITableTooltipProps {
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Компонент-триггер */
+    trigger: React.ReactNode;
+    /** Заголовок */
+    title: string;
+    /** Текст */
+    text: string;
+    /** Текст кнопки */
+    buttonText?: string;
+    /** Отобразить кнопку закрытия */
+    hasCloseButton?: boolean;
+    /** Дополнительные классы для внутренних элементов */
+    classes?: {
+        root?: string;
+        tooltip?: string;
+    };
+    /** Обработчик клика по кнопке */
+    onButtonClick?: (e: React.SyntheticEvent<EventTarget, Event>) => void;
+    /** Обработчик клика по кнопке закрытия */
+    onCloseButtonClick?: (e: React.SyntheticEvent<EventTarget, Event>) => void;
+}
+declare const TableTooltip: React.FC<React.PropsWithChildren<ITableTooltipProps>>;
+export default TableTooltip;

package/dist/es/components/Table/components/TableTooltip/TableTooltip.js

@@ -0,0 +1,38 @@
+import * as React from 'react';
+import { Tooltip } from '@megafon/ui-core';
+import { cnCreate } from '@megafon/ui-helpers';
+import "./TableTooltip.css";
+var cn = cnCreate('mfui-lkvas-table-tooltip');
+var TableTooltip = function TableTooltip(_ref) {
+  var className = _ref.className,
+    trigger = _ref.trigger,
+    title = _ref.title,
+    text = _ref.text,
+    buttonText = _ref.buttonText,
+    hasCloseButton = _ref.hasCloseButton,
+    classes = _ref.classes,
+    onButtonClick = _ref.onButtonClick,
+    onCloseButtonClick = _ref.onCloseButtonClick;
+  var triggerRef = React.useRef(null);
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn([className, classes === null || classes === void 0 ? void 0 : classes.root])
+  }, /*#__PURE__*/React.createElement("div", {
+    className: cn('trigger'),
+    ref: triggerRef
+  }, trigger), /*#__PURE__*/React.createElement(Tooltip, {
+    className: cn('tooltip', [classes === null || classes === void 0 ? void 0 : classes.tooltip]),
+    title: title,
+    text: text,
+    buttonText: buttonText,
+    hasCloseButton: hasCloseButton,
+    onClick: onButtonClick,
+    onCloseButtonClick: onCloseButtonClick,
+    triggerElement: triggerRef,
+    placement: "bottom",
+    fallbackPlacements: ['top', 'left', 'right'],
+    triggerEvent: "click",
+    colorTheme: "blue",
+    offset: "small"
+  }));
+};
+export default TableTooltip;

package/dist/es/components/Table/components/TableTr/TableTr.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-lkvas-table-tr:not(:last-child) td{border-bottom:1px solid var(--spbSky1)}

package/dist/es/components/Table/components/TableTr/TableTr.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import './TableTr.scss';
+export interface ITableTr {
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
+}
+declare const TableTr: React.FC<React.PropsWithChildren<ITableTr>>;
+export default TableTr;

package/dist/es/components/Table/components/TableTr/TableTr.js

@@ -0,0 +1,14 @@
+import _extends from "@babel/runtime/helpers/extends";
+import * as React from 'react';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import "./TableTr.css";
+var cn = cnCreate('mfui-lkvas-table-tr');
+var TableTr = function TableTr(_ref) {
+  var className = _ref.className,
+    dataAttrs = _ref.dataAttrs,
+    children = _ref.children;
+  return /*#__PURE__*/React.createElement("tr", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn([className])
+  }), children);
+};
+export default TableTr;

package/dist/es/components/Table/contexts/TableContext.d.ts

@@ -0,0 +1,6 @@
+import type { ScrollPositionType } from '../types';
+type TableContext = {
+    scrollPosition: ScrollPositionType;
+};
+declare const TableContext: import("react").Context<TableContext>;
+export default TableContext;

package/dist/es/components/Table/contexts/TableContext.js

@@ -0,0 +1,8 @@
+import { createContext } from 'react';
+var TableContext = /*#__PURE__*/createContext({
+  scrollPosition: {
+    horizontal: 'none',
+    vertical: 'none'
+  }
+});
+export default TableContext;

package/dist/es/components/Table/helpers.d.ts

@@ -0,0 +1,2 @@
+import type { ScrollPositionValueType } from './types';
+export declare const calculateScrollPosition: (scroll: number, delta: number) => ScrollPositionValueType;

package/dist/es/components/Table/helpers.js

@@ -0,0 +1,12 @@
+export var calculateScrollPosition = function calculateScrollPosition(scroll, delta) {
+  if (delta === 0) {
+    return 'none';
+  }
+  if (scroll === 0) {
+    return 'start';
+  }
+  if (scroll === delta) {
+    return 'end';
+  }
+  return 'between';
+};

package/dist/es/components/Table/types.d.ts

@@ -0,0 +1,5 @@
+export type ScrollPositionValueType = 'start' | 'between' | 'end' | 'none';
+export type ScrollPositionType = {
+    horizontal: ScrollPositionValueType;
+    vertical: ScrollPositionValueType;
+};

package/dist/es/components/Table/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es/components/_Dropdown/Dropdown.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-lkvas-dropdown{position:relative}.mfui-lkvas-dropdown__modal{background-color:var(--base);border-radius:12px;-webkit-box-shadow:0 2px 12px 0 rgba(0,0,0,.1);box-shadow:0 2px 12px 0 rgba(0,0,0,.1);-webkit-box-sizing:border-box;box-sizing:border-box;display:block;margin-top:8px;min-width:300px;opacity:0;padding:16px;position:absolute;top:100%;-webkit-transition:opacity .3s,visibility .3s;transition:opacity .3s,visibility .3s;visibility:hidden;z-index:100}.mfui-lkvas-dropdown_position_right .mfui-lkvas-dropdown__modal{right:-2px}.mfui-lkvas-dropdown_position_left .mfui-lkvas-dropdown__modal{left:-2px}.mfui-lkvas-dropdown_opened .mfui-lkvas-dropdown__modal{opacity:1;visibility:visible}

package/dist/es/components/_Dropdown/Dropdown.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import './Dropdown.scss';
+export interface IDropdownProps {
+    className?: string;
+    position?: 'left' | 'right';
+    renderTrigger: (isOpened: boolean) => React.ReactNode;
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
+}
+declare const Dropdown: React.FC<React.PropsWithChildren<IDropdownProps>>;
+export default Dropdown;

package/dist/es/components/_Dropdown/Dropdown.js

@@ -0,0 +1,54 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import * as React from 'react';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import "./Dropdown.css";
+var cn = cnCreate('mfui-lkvas-dropdown');
+var Dropdown = function Dropdown(_ref) {
+  var className = _ref.className,
+    _ref$position = _ref.position,
+    position = _ref$position === void 0 ? 'right' : _ref$position,
+    renderTrigger = _ref.renderTrigger,
+    children = _ref.children,
+    dataAttrs = _ref.dataAttrs;
+  var _React$useState = React.useState(false),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    isOpened = _React$useState2[0],
+    setIsOpened = _React$useState2[1];
+  var triggerRef = React.useRef(null);
+  var handleOutsideClick = React.useCallback(function (event) {
+    if (triggerRef.current && !triggerRef.current.contains(event.target)) {
+      setIsOpened(false);
+    }
+  }, []);
+  var handleTriggerClick = function handleTriggerClick() {
+    setIsOpened(function (state) {
+      return !state;
+    });
+    document.addEventListener('mouseup', handleOutsideClick);
+  };
+  React.useEffect(function () {
+    if (!isOpened) {
+      document.removeEventListener('mouseup', handleOutsideClick);
+    }
+  }, [handleOutsideClick, isOpened]);
+  React.useEffect(function () {
+    return function () {
+      return document.removeEventListener('mouseup', handleOutsideClick);
+    };
+  }, [handleOutsideClick]);
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn({
+      opened: isOpened,
+      position: position
+    }, [className])
+  }), /*#__PURE__*/React.createElement("div", {
+    className: cn('trigger'),
+    ref: triggerRef,
+    onClick: handleTriggerClick,
+    role: "presentation"
+  }, renderTrigger(isOpened)), /*#__PURE__*/React.createElement("div", {
+    className: cn('modal')
+  }, children));
+};
+export default Dropdown;

package/dist/es/components/_DropdownInfo/DropdownInfo.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-lkvas-dropdown-info_top-border{border-top:1px solid var(--spbSky1);margin-top:8px;padding-top:8px}.mfui-lkvas-dropdown-info__inner{border-radius:12px;padding:12px 16px}.mfui-lkvas-dropdown-info__title{color:var(--spbSky3)}.mfui-lkvas-dropdown-info__subtitle{font-size:15px;font-weight:500;line-height:24px}

package/dist/es/components/_DropdownInfo/DropdownInfo.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import './DropdownInfo.scss';
+export interface IDropdownInfoProps {
+    title: string;
+    subtitle: string;
+    hasTopBorder?: boolean;
+}
+declare const DropdownInfo: React.FC<IDropdownInfoProps>;
+export default DropdownInfo;