colibri-ui 0.7.79 → 0.7.81

package/Accordion/Accordion.module.css

@@ -0,0 +1,51 @@
+.root {
+  overflow: hidden;
+  padding: 14px;
+}
+
+.content {
+  block-size: 0;
+  overflow: hidden;
+  transition: block-size 0.2s ease-in-out;
+}
+
+.button {
+  align-items: center;
+  background: none;
+  border: none;
+  color: initial;
+  cursor: pointer;
+  display: flex;
+  font: inherit;
+  gap: 8px;
+  inline-size: 100%;
+  outline: none;
+  padding: 0;
+}
+.button svg {
+  flex: none;
+}
+
+.text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.header {
+  margin-block-end: 14px;
+}
+
+.chevron {
+  transition: transform 0.2s ease-in-out;
+}
+.chevron_open {
+  transform: rotate(180deg);
+}
+
+.line {
+  background-color: var(--palette-bg-3);
+  block-size: 1px;
+  flex: 1;
+  margin-inline-start: 8px;
+}

package/Accordion/index.d.ts

@@ -0,0 +1,9 @@
+import type { FC, ReactNode, PropsWithChildren } from "react";
+type Props = {
+    title: ReactNode;
+    className?: string;
+    boldTitle?: boolean;
+    tabIndex?: number;
+};
+declare const Accordion: FC<PropsWithChildren<Props>>;
+export default Accordion;

package/Accordion/index.js

@@ -0,0 +1,67 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var classNames = require('classnames/bind');
+require('../Icons/index.js');
+var index = require('../Typography/index.js');
+var styles = require('./Accordion.module.css');
+var Chevron = require('../Icons/Chevron.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var classNames__default = /*#__PURE__*/_interopDefault(classNames);
+var styles__default = /*#__PURE__*/_interopDefault(styles);
+
+var clx = classNames__default.default.bind(styles__default.default);
+var Accordion = function Accordion(_a) {
+  var title = _a.title,
+    _b = _a.boldTitle,
+    boldTitle = _b === void 0 ? false : _b,
+    children = _a.children,
+    className = _a.className,
+    tabIndex = _a.tabIndex;
+  var _c = React.useState(false),
+    isOpen = _c[0],
+    setIsOpen = _c[1];
+  var contentRef = React.useRef(null);
+  var toggleAccordion = function toggleAccordion() {
+    return setIsOpen(!isOpen);
+  };
+  React.useEffect(function () {
+    if (contentRef.current) {
+      contentRef.current.style.blockSize = isOpen ? "".concat(contentRef.current.scrollHeight, "px") : "0px";
+    }
+  }, [isOpen]);
+  return /*#__PURE__*/React__default.default.createElement("div", {
+    className: clx("root", className)
+  }, /*#__PURE__*/React__default.default.createElement("div", {
+    className: clx("header")
+  }, /*#__PURE__*/React__default.default.createElement("button", {
+    className: clx("button"),
+    onClick: toggleAccordion,
+    type: "button",
+    role: "button",
+    "aria-expanded": isOpen,
+    tabIndex: tabIndex,
+    "aria-label": "Toggle"
+  }, /*#__PURE__*/React__default.default.createElement(Chevron.default, {
+    className: clx("chevron", {
+      chevron_open: isOpen
+    }),
+    width: 20,
+    height: 20
+  }), /*#__PURE__*/React__default.default.createElement(index.default, {
+    className: clx("text"),
+    fontWeight: boldTitle ? "bold" : "normal"
+  }, title), /*#__PURE__*/React__default.default.createElement("div", {
+    className: clx("line")
+  }))), /*#__PURE__*/React__default.default.createElement("div", {
+    ref: contentRef,
+    className: clx("content")
+  }, children));
+};
+
+exports.default = Accordion;

package/Accordion/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "../esm/Accordion/index.js",
+  "main": "./index.js",
+  "types": "./index.d.ts"
+}

package/Avatar/Avatar.module.css

@@ -1,11 +1,11 @@
 .avatar {
-  transition: border-color 0.15s ease;
   border-radius: 100%;
   box-sizing: border-box;
+  transition: border-color 0.15s ease;
 }
 .avatar_bordered {
-  border: 4px solid transparent;
   background-color: var(--palette-white);
+  border: 4px solid transparent;
 }
 .avatar_bordered:hover {
   border-color: rgba(95, 99, 104, 0.24);

package/Avatar/index.d.ts

@@ -1,4 +1,4 @@
-import { FC } from 'react';
-import { AvatarProps } from './index.props';
+import type { AvatarProps } from "./index.props";
+import type { FC } from "react";
 declare const Avatar: FC<AvatarProps>;
 export default Avatar;

package/Avatar/index.js

@@ -3,18 +3,18 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
+var classNames = require('classnames/bind');
 var constants = require('./constants.js');
 var maleCircle = require('./assets/male-circle.svg.js');
 var orgCircle = require('./assets/org-circle.svg.js');
 var styles = require('./Avatar.module.css');
-var classNames = require('classnames/bind');
 var index_props = require('./index.props.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefault(React);
-var styles__default = /*#__PURE__*/_interopDefault(styles);
 var classNames__default = /*#__PURE__*/_interopDefault(classNames);
+var styles__default = /*#__PURE__*/_interopDefault(styles);
 
 var clx = classNames__default.default.bind(styles__default.default);
 var Avatar = /*#__PURE__*/React.memo(function (props) {
@@ -24,7 +24,7 @@ var Avatar = /*#__PURE__*/React.memo(function (props) {
     className = props.className,
     bordered = props.bordered,
     _b = props.title,
-    title = _b === void 0 ? '' : _b,
+    title = _b === void 0 ? "" : _b,
     _c = props.accountType,
     accountType = _c === void 0 ? index_props.AccountType.Organization : _c;
   var isOrg = accountType === index_props.AccountType.Organization;
@@ -35,7 +35,7 @@ var Avatar = /*#__PURE__*/React.memo(function (props) {
     width: size,
     height: size,
     className: clx(styles__default.default.avatar, {
-      'avatar_bordered': !!bordered
+      avatar_bordered: !!bordered
     }, [className])
   });
 });

package/Avatar/index.props.d.ts

@@ -1,4 +1,4 @@
-import { AvatarSizes } from "./constants";
+import type { AvatarSizes } from "./constants";
 export declare enum AccountType {
     Person = "person",
     Organization = "org"

package/Badge/index.js

@@ -46,7 +46,7 @@ var Badge = function Badge(_a) {
     className: clx((_b = {
       root: true
     }, _b["root_direction_".concat(direction)] = !!direction, _b.root_invisible = invisible, _b), className),
-    "data-cy": "badge"
+    "data-testid": "badge"
   }, displayValue));
 };
 

package/Button/Button.module.css

@@ -175,7 +175,7 @@
 }
 
 .text {
-  white-space: nowrap;
-  text-overflow: ellipsis;
   overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }

package/Button/index.js

@@ -28,7 +28,8 @@ var Button = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     children = _a.children,
     disabled = _a.disabled,
     onClick = _a.onClick,
-    props = tslib.__rest(_a, ["className", "fullWidth", "variant", "iconStart", "iconEnd", "icon", "size", "children", "disabled", "onClick"]);
+    type = _a.type,
+    props = tslib.__rest(_a, ["className", "fullWidth", "variant", "iconStart", "iconEnd", "icon", "size", "children", "disabled", "onClick", "type"]);
   return /*#__PURE__*/React__default.default.createElement("button", tslib.__assign({
     onClick: onClick,
     ref: ref,
@@ -37,7 +38,9 @@ var Button = /*#__PURE__*/React.forwardRef(function (_a, ref) {
       root_fullWidth: !!fullWidth
     }, _b["size_".concat(size)] = !!size, _b["variant_".concat(variant)] = !!variant, _b["variant_".concat(variant, "_disabled")] = !!disabled, _b), className),
     disabled: disabled,
-    "data-cy": "button"
+    "data-cy": "button",
+    type: type || "button",
+    role: "button"
   }, props), icon && /*#__PURE__*/React__default.default.createElement("span", {
     className: clx(styles__default.default.icon)
   }, icon), iconStart && /*#__PURE__*/React__default.default.createElement("span", {

package/Button/index.props.d.ts

@@ -9,4 +9,5 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     iconEnd?: ReactNode;
     size?: ButtonSize;
     disabled?: boolean;
+    type?: "submit" | "reset" | "button" | undefined;
 }

package/Calendar/components/Month/Month.js

@@ -126,6 +126,8 @@ var Month = function Month(props) {
         style: {
           background: day.isSelected ? "var(--palette-bg-2)" : "transparent"
         },
+        role: "button",
+        type: "button",
         onClick: day.isActive ? function () {
           return props.onDayClick([year, month, leadingZeros.leadingZeros(day.day, 2)].join("-"));
         } : undefined

package/Calendar/index.js

@@ -152,7 +152,7 @@ var Calendar = function Calendar(_a) {
     className: clx(styles__default.default.root),
     "data-component": "Calendar",
     ref: $root
-  }, /*#__PURE__*/React__default.default.createElement("div", null, contentWidth ? ( /*#__PURE__*/React__default.default.createElement("div", {
+  }, /*#__PURE__*/React__default.default.createElement("div", null, contentWidth ? (/*#__PURE__*/React__default.default.createElement("div", {
     "data-component": "Months",
     className: clx(styles__default.default.months),
     style: {
@@ -169,26 +169,32 @@ var Calendar = function Calendar(_a) {
     return /*#__PURE__*/React__default.default.createElement(Month.Month, tslib.__assign({}, attrs, {
       key: "month-".concat(index)
     }));
-  }))) : ( /*#__PURE__*/React__default.default.createElement(Month.Month, tslib.__assign({
+  }))) : (/*#__PURE__*/React__default.default.createElement(Month.Month, tslib.__assign({
     today: today,
     startDate: getMonthStartDate(currentMonthOffset),
     offsetLeft: 0
   }, commonAttrs))), /*#__PURE__*/React__default.default.createElement("button", {
     className: clx(styles__default.default["month-control"], styles__default.default["month-control-prev"]),
     onClick: showPrevMonth,
-    disabled: currentMonthOffset <= 0
+    disabled: currentMonthOffset <= 0,
+    type: "button",
+    role: "button",
+    "aria-label": "Prev"
   }, /*#__PURE__*/React__default.default.createElement(ArrowNext.default, {
     className: clx(styles__default.default["month-control-prev-arrow"])
   })), /*#__PURE__*/React__default.default.createElement("button", {
     className: clx(styles__default.default["month-control"], styles__default.default["month-control-next"]),
     onClick: showNextMonth,
-    disabled: currentMonthOffset >= 11
+    disabled: currentMonthOffset >= 11,
+    type: "button",
+    role: "button",
+    "aria-label": "Next"
   }, /*#__PURE__*/React__default.default.createElement(ArrowNext.default, {
     className: clx(styles__default.default["month-control-next-arrow"])
-  }))), datePresets && ( /*#__PURE__*/React__default.default.createElement(index$2.Presets, {
+  }))), datePresets && (/*#__PURE__*/React__default.default.createElement(index$2.Presets, {
     presets: datePresets,
     onPresetSelect: handlePresetSelect
-  })), withContinueButton && ( /*#__PURE__*/React__default.default.createElement(index$3.ContinueButton, {
+  })), withContinueButton && (/*#__PURE__*/React__default.default.createElement(index$3.ContinueButton, {
     isChanged: selectedDate !== initialSelectedDate || selectedPeriod !== initialSelectedPeriod,
     selectedDate: selectedDate,
     selectedPeriod: selectedPeriod,

package/Checkbox/index.js

@@ -52,7 +52,7 @@ var Checkbox = function Checkbox(_a) {
   }, label)));
   return /*#__PURE__*/React__default.default.createElement("div", {
     className: clx(styles__default.default.root)
-  }, control, hint && ( /*#__PURE__*/React__default.default.createElement(index.default, {
+  }, control, hint && (/*#__PURE__*/React__default.default.createElement(index.default, {
     variant: isError ? "alert" : "secondary",
     tag: "span"
   }, hint)));

package/Chip/Chip.module.css

@@ -16,7 +16,7 @@
   transition-timing-function: ease;
 }
 .inner_active {
-  background: rgb(237, 237, 237);
+  background: var(--palette-bg-1);
 }
 .inner_inactive {
   background: var(--palette-white);
@@ -43,15 +43,18 @@
 }
 .inner[data-size=s] {
   border-radius: 32px;
-  height: 32px;
+  font-size: 15px;
+  line-height: 32px;
 }
 .inner[data-size=m] {
   border-radius: 36px;
-  height: 36px;
+  font-size: 16px;
+  line-height: 36px;
 }
 .inner[data-size=l] {
   border-radius: 44px;
-  height: 44px;
+  font-size: 18px;
+  line-height: 44px;
 }
 
 .content {

package/Chip/index.d.ts

@@ -1,14 +1,4 @@
-import React from "react";
-import type { FC, ReactNode } from "react";
-type Size = "s" | "m" | "l";
-type Props = {
-    size?: Size;
-    testID?: string;
-    isActive?: boolean;
-    iconOnRight?: React.ReactNode;
-    onClick?: () => void;
-    onIconOnRightClick?: () => void;
-    children?: ReactNode;
-};
+import type { Props } from "./index.props";
+import type { FC } from "react";
 declare const Chip: FC<Props>;
 export default Chip;

package/Chip/index.js

@@ -38,7 +38,7 @@ var Chip = function Chip(props) {
     onClick: onClick
   }, /*#__PURE__*/React__default.default.createElement("span", {
     className: clx("content-inner")
-  }, children)), iconOnRight && ( /*#__PURE__*/React__default.default.createElement("span", {
+  }, children)), iconOnRight && (/*#__PURE__*/React__default.default.createElement("span", {
     className: clx("icon-right"),
     onClick: onIconOnRightClick || onClick
   }, iconOnRight))));

package/Chip/index.props.d.ts

@@ -0,0 +1,12 @@
+import type { ReactNode } from "react";
+type Size = "s" | "m" | "l";
+export type Props = {
+    size?: Size;
+    testID?: string;
+    isActive?: boolean;
+    iconOnRight?: React.ReactNode;
+    onClick?: () => void;
+    onIconOnRightClick?: () => void;
+    children?: ReactNode;
+};
+export {};

package/Dropdown/index.js

@@ -4,19 +4,20 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var tslib = require('tslib');
 var React = require('react');
+var classNames = require('classnames/bind');
 var reactPopper = require('react-popper');
-var classNames = require('classnames');
 var index = require('../Portal/index.js');
 var on = require('../helpers/on.js');
 var index$1 = require('../ClickOutside/index.js');
-var dropDownStyles = require('./Dropdown.module.css');
+var styles = require('./Dropdown.module.css');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefault(React);
 var classNames__default = /*#__PURE__*/_interopDefault(classNames);
-var dropDownStyles__default = /*#__PURE__*/_interopDefault(dropDownStyles);
+var styles__default = /*#__PURE__*/_interopDefault(styles);
 
+var clx = classNames__default.default.bind(styles__default.default);
 var Dropdown = function Dropdown(_a) {
   var children = _a.children,
     zIndex = _a.zIndex,
@@ -122,12 +123,12 @@ var Dropdown = function Dropdown(_a) {
   return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, /*#__PURE__*/React__default.default.createElement(reference.type, tslib.__assign({
     ref: setControlElement,
     tabIndex: 0
-  }, reference.props)), isVisible && ( /*#__PURE__*/React__default.default.createElement(index.default, null, /*#__PURE__*/React__default.default.createElement(index$1.default, {
+  }, reference.props)), isVisible && (/*#__PURE__*/React__default.default.createElement(index.default, null, /*#__PURE__*/React__default.default.createElement(index$1.default, {
     onClick: onClickOutside
   }, /*#__PURE__*/React__default.default.createElement("div", tslib.__assign({
     ref: setPopperElement,
-    "data-component": "popper-container",
-    className: classNames__default.default(dropDownStyles__default.default["popper-container"]),
+    "data-testid": "popper-container",
+    className: clx("popper-container"),
     style: tslib.__assign(tslib.__assign(tslib.__assign({}, styles.popper), {
       zIndex: zIndex,
       minWidth: controlElement === null || controlElement === void 0 ? void 0 : controlElement.offsetWidth
@@ -136,7 +137,8 @@ var Dropdown = function Dropdown(_a) {
     }),
     tabIndex: 0
   }, attributes.popper), /*#__PURE__*/React__default.default.createElement("div", {
-    className: classNames__default.default(dropDownStyles__default.default["overlay-container"]),
+    "data-testid": "overlay-container",
+    className: clx("overlay-container"),
     onClick: onClickOverlay
   }, overlay))))));
 };

package/InputRadio/index.js

@@ -66,7 +66,7 @@ var InputRadio = /*#__PURE__*/React.memo(function (_a) {
     className: clx(styles__default.default.icon)
   }), /*#__PURE__*/React__default.default.createElement("span", {
     className: clx(styles__default.default.text)
-  }, !children && text, !text && children)), !!note && ( /*#__PURE__*/React__default.default.createElement(index.default, {
+  }, !children && text, !text && children)), !!note && (/*#__PURE__*/React__default.default.createElement(index.default, {
     tag: "p",
     size: "s",
     className: clx(styles__default.default.note)

package/Menu/components/MenuItem/index.js

@@ -26,8 +26,9 @@ var MenuItem = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     ref: ref,
     "data-component": "menu-item",
     style: {
-      backgroundColor: isSelected ? "var(--palette-primary-1)" : ""
+      backgroundColor: isSelected ? "var(--palette-primary-1, rgb(232, 240, 254))" : "transparent"
     },
+    "data-testid": "menuitem",
     className: clx("item", (_b = {
       item_disabled: !!disabled
     }, _b["item_variant_".concat(variant)] = !!variant, _b), className),

package/Menu/index.js

@@ -21,7 +21,7 @@ var Menu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
     children = _a.children;
   var renderChild = React.useMemo(function () {
     return React.Children.map(children, function (child) {
-      if ( /*#__PURE__*/React.isValidElement(child)) {
+      if (/*#__PURE__*/React.isValidElement(child)) {
         var isSelected = selected ? selected.includes(String(child.key)) : undefined;
         var onClickHandler = function onClickHandler(e) {
           if (child.props.onClick) child.props.onClick(e);

package/Modal/index.js

@@ -57,11 +57,11 @@ var Modal = function Modal(_a) {
       "modal-wrapper_mobile": !isDesktop ? 1 : 0
     }, className),
     ref: modalRef
-  }, title ? ( /*#__PURE__*/React__default.default.createElement("div", {
+  }, title ? (/*#__PURE__*/React__default.default.createElement("div", {
     className: clx("title-wrapper")
   }, /*#__PURE__*/React__default.default.createElement(index$4.default, null, title), /*#__PURE__*/React__default.default.createElement(index$5.default, {
     onClick: onCloseHandler
-  }))) : ( /*#__PURE__*/React__default.default.createElement("div", {
+  }))) : (/*#__PURE__*/React__default.default.createElement("div", {
     className: clx("close-wrapper")
   }, /*#__PURE__*/React__default.default.createElement(index$5.default, {
     onClick: onCloseHandler

package/Select/components/MenuOverlay/index.js

@@ -39,9 +39,11 @@ var MenuOverlay = function MenuOverlay(_a) {
     if (!rootRef || !rootRef.current) {
       return;
     }
-    rootRef.current.scrollTo({
-      top: scrollView.top - OFFSET_ITEMS_COUNT * scrollView.height
-    });
+    if (typeof rootRef.current.scrollTo === "function") {
+      rootRef.current.scrollTo({
+        top: scrollView.top - OFFSET_ITEMS_COUNT * scrollView.height
+      });
+    }
   }, [scrollView, rootRef]);
   return /*#__PURE__*/React__default.default.createElement("div", {
     ref: rootRef,

package/Select/index.js

@@ -83,8 +83,8 @@ var Select = function Select(_a) {
     disabled: !!disabled
   }, /*#__PURE__*/React__default.default.createElement("div", {
     className: clx(styles__default.default["base-input"]),
-    "data-component": "base-input"
-  }, prepraredLabel !== null && prepraredLabel !== void 0 ? prepraredLabel : ( /*#__PURE__*/React__default.default.createElement("span", {
+    "data-testid": "base-input"
+  }, prepraredLabel !== null && prepraredLabel !== void 0 ? prepraredLabel : (/*#__PURE__*/React__default.default.createElement("span", {
     className: clx(styles__default.default.placeholder)
   }, placeholder))), /*#__PURE__*/React__default.default.createElement("input", {
     type: "hidden",

package/TabsMenu/Tab/Tab.d.ts

@@ -0,0 +1,4 @@
+import type { FC } from "react";
+import type { TabProps } from "./Tab.props";
+declare const Tab: FC<TabProps>;
+export default Tab;

package/TabsMenu/Tab/Tab.module.css

@@ -0,0 +1,61 @@
+.tab {
+  cursor: pointer;
+  display: inline-block;
+  margin-left: 16px;
+  padding: 0 20px;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+  transition-duration: 0.3s;
+  transition-property: background, box-shadow, transform;
+  transition-timing-function: ease;
+  user-select: none;
+  white-space: nowrap;
+}
+.tab[data-size=s] {
+  border-radius: 32px;
+  font-size: 15px;
+  line-height: 32px;
+}
+.tab[data-size=m] {
+  border-radius: 36px;
+  font-size: 16px;
+  line-height: 36px;
+}
+.tab[data-size=l] {
+  border-radius: 44px;
+  font-size: 18px;
+  line-height: 44px;
+}
+.tab_active {
+  background: var(--palette-bg-1);
+}
+.tab_inactive {
+  background: var(--palette-white);
+  box-shadow: rgba(193, 193, 193, 0.4) 0 5px 20px;
+}
+.tab_inactive:hover {
+  box-shadow: rgba(193, 193, 193, 0.4) 0 5px 20px;
+}
+.tab_inactive:active {
+  background: rgba(0, 0, 0, 0.02);
+  box-shadow: rgba(193, 193, 193, 0.4) 0 1px 3px;
+  outline: 0;
+  transition-duration: 0.15s;
+}
+@media (hover: none) {
+  .tab_inactive:hover {
+    box-shadow: rgba(193, 193, 193, 0.4) 0 5px 20px;
+  }
+  .tab_inactive:active {
+    box-shadow: rgba(193, 193, 193, 0.4) 0 1px 3px;
+  }
+}
+.tab_first {
+  margin-left: 0;
+}
+.tab_disabled {
+  background: #f7f8f9;
+  box-shadow: none;
+  color: var(--palette-bg-3);
+  cursor: not-allowed;
+  pointer-events: none;
+}

package/TabsMenu/Tab/Tab.props.d.ts

@@ -0,0 +1,16 @@
+import type { Size } from "../index.props";
+import type { KeyboardEventHandler, MouseEventHandler, ReactNode, RefObject } from "react";
+export type TabProps = {
+    id?: string;
+    active?: boolean;
+    disabled?: boolean;
+    first?: boolean;
+    content?: ReactNode;
+    onClick?: MouseEventHandler<HTMLLIElement>;
+    innerRef?: RefObject<HTMLLIElement>;
+    className?: string;
+    role?: string;
+    tabIndex?: number;
+    onKeyDown?: KeyboardEventHandler<HTMLElement>;
+    size?: Size;
+};

package/TabsMenu/TabsMenu.module.css

@@ -0,0 +1,4 @@
+.root {
+  margin: 0;
+  padding: 0;
+}

package/TabsMenu/index.d.ts

@@ -0,0 +1,4 @@
+import type { TabsMenuProps } from "./index.props";
+import type { FC } from "react";
+declare const TabsMenu: FC<TabsMenuProps>;
+export default TabsMenu;

package/TabsMenu/index.props.d.ts

@@ -0,0 +1,12 @@
+import type { RefObject } from "react";
+import type { TabProps } from "./Tab/Tab.props";
+export type Size = "s" | "m" | "l";
+export type TabsMenuProps = {
+    activeTab?: string;
+    onChange?: (tabId: string) => void;
+    tabs: TabProps[];
+    tabsRefs?: RefObject<HTMLLIElement>[];
+    innerRef?: RefObject<HTMLUListElement>;
+    className?: string;
+    size?: Size;
+};

package/TabsMenu/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "../esm/TabsMenu/index.js",
+  "main": "./index.js",
+  "types": "./index.d.ts"
+}

package/Tooltip/index.js

@@ -92,7 +92,7 @@ var Tooltip = function Tooltip(_a) {
   }, [update, visible]);
   return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, /*#__PURE__*/React__default.default.createElement(reference.type, tslib.__assign({
     ref: setControlElement
-  }, reference.props)), visible && ( /*#__PURE__*/React__default.default.createElement(index.default, null, /*#__PURE__*/React__default.default.createElement(index$1.default, {
+  }, reference.props)), visible && (/*#__PURE__*/React__default.default.createElement(index.default, null, /*#__PURE__*/React__default.default.createElement(index$1.default, {
     onClick: onClickOutside
   }, /*#__PURE__*/React__default.default.createElement("div", tslib.__assign({
     className: clx("root", {