colibri-ui 0.7.78 → 0.7.80

package/esm/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/esm/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/esm/Avatar/index.js

@@ -1,9 +1,9 @@
 import React__default, { memo } from 'react';
+import classNames from 'classnames/bind';
 import { AvatarSizes } from './constants.js';
 import maleCircleUrl from './assets/male-circle.svg.js';
 import orgCircleUrl from './assets/org-circle.svg.js';
 import styles from './Avatar.module.css';
-import classNames from 'classnames/bind';
 import { AccountType } from './index.props.js';
 
 var clx = classNames.bind(styles);
@@ -14,7 +14,7 @@ var Avatar = /*#__PURE__*/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 ? AccountType.Organization : _c;
   var isOrg = accountType === AccountType.Organization;
@@ -25,7 +25,7 @@ var Avatar = /*#__PURE__*/memo(function (props) {
     width: size,
     height: size,
     className: clx(styles.avatar, {
-      'avatar_bordered': !!bordered
+      avatar_bordered: !!bordered
     }, [className])
   });
 });

package/esm/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/esm/Badge/index.js

@@ -36,7 +36,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/esm/Button/Button.module.css

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

package/esm/Button/index.js

@@ -18,7 +18,8 @@ var Button = /*#__PURE__*/forwardRef(function (_a, ref) {
     children = _a.children,
     disabled = _a.disabled,
     onClick = _a.onClick,
-    props = __rest(_a, ["className", "fullWidth", "variant", "iconStart", "iconEnd", "icon", "size", "children", "disabled", "onClick"]);
+    type = _a.type,
+    props = __rest(_a, ["className", "fullWidth", "variant", "iconStart", "iconEnd", "icon", "size", "children", "disabled", "onClick", "type"]);
   return /*#__PURE__*/React__default.createElement("button", __assign({
     onClick: onClick,
     ref: ref,
@@ -27,7 +28,9 @@ var Button = /*#__PURE__*/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.createElement("span", {
     className: clx(styles.icon)
   }, icon), iconStart && /*#__PURE__*/React__default.createElement("span", {

package/esm/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/esm/Calendar/components/Month/Month.js

@@ -100,6 +100,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(day.day, 2)].join("-"));
         } : undefined

package/esm/Calendar/index.js

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

package/esm/Checkbox/index.js

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

package/esm/Chip/index.js

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

package/esm/Dropdown/index.js

@@ -1,12 +1,13 @@
 import { __assign } from 'tslib';
 import React__default, { useState, useMemo, Children, useCallback, useEffect } from 'react';
+import classNames from 'classnames/bind';
 import { usePopper } from 'react-popper';
-import classNames from 'classnames';
 import Portal from '../Portal/index.js';
 import { on } from '../helpers/on.js';
 import ClickOutside from '../ClickOutside/index.js';
-import dropDownStyles from './Dropdown.module.css';
+import styles from './Dropdown.module.css';
 
+var clx = classNames.bind(styles);
 var Dropdown = function Dropdown(_a) {
   var children = _a.children,
     zIndex = _a.zIndex,
@@ -112,12 +113,12 @@ var Dropdown = function Dropdown(_a) {
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(reference.type, __assign({
     ref: setControlElement,
     tabIndex: 0
-  }, reference.props)), isVisible && ( /*#__PURE__*/React__default.createElement(Portal, null, /*#__PURE__*/React__default.createElement(ClickOutside, {
+  }, reference.props)), isVisible && (/*#__PURE__*/React__default.createElement(Portal, null, /*#__PURE__*/React__default.createElement(ClickOutside, {
     onClick: onClickOutside
   }, /*#__PURE__*/React__default.createElement("div", __assign({
     ref: setPopperElement,
-    "data-component": "popper-container",
-    className: classNames(dropDownStyles["popper-container"]),
+    "data-testid": "popper-container",
+    className: clx("popper-container"),
     style: __assign(__assign(__assign({}, styles.popper), {
       zIndex: zIndex,
       minWidth: controlElement === null || controlElement === void 0 ? void 0 : controlElement.offsetWidth
@@ -126,7 +127,8 @@ var Dropdown = function Dropdown(_a) {
     }),
     tabIndex: 0
   }, attributes.popper), /*#__PURE__*/React__default.createElement("div", {
-    className: classNames(dropDownStyles["overlay-container"]),
+    "data-testid": "overlay-container",
+    className: clx("overlay-container"),
     onClick: onClickOverlay
   }, overlay))))));
 };

package/esm/InputRadio/index.js

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

package/esm/Menu/components/MenuItem/index.js

@@ -16,8 +16,9 @@ var MenuItem = /*#__PURE__*/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/esm/Menu/index.js

@@ -11,7 +11,7 @@ var Menu = /*#__PURE__*/forwardRef(function (_a, ref) {
     children = _a.children;
   var renderChild = useMemo(function () {
     return Children.map(children, function (child) {
-      if ( /*#__PURE__*/isValidElement(child)) {
+      if (/*#__PURE__*/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/esm/Modal/index.js

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

package/esm/Select/components/MenuOverlay/index.js

@@ -29,9 +29,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.createElement("div", {
     ref: rootRef,

package/esm/Select/index.js

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

package/esm/Theme/colors/common.js

@@ -5,11 +5,11 @@ var Common = {
   BLACK: "#000"
 };
 var Backgrounds = {
-  BG_1: "#f2f2f2",
-  BG_2: "#e6e6e6",
-  BG_3: "#dbdbdb",
-  BG_4: "#b3b3b3",
-  BG_5: "#999"
+  BG_1: "#ECEEF2",
+  BG_2: "#E4E6EA",
+  BG_3: "#D6D9E0",
+  BG_4: "#C9CDD6",
+  BG_5: "#BCC1CC"
 };
 var Accents = {
   ALERT: "#ff564e",

package/esm/Tooltip/index.js

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

package/esm/Tooltip/index.props.d.ts

@@ -1,7 +1,6 @@
 import type { ReactNode } from "react";
 import type { PositioningStrategy } from "@popperjs/core";
 import type { Placement as PopperPlacement } from "@popperjs/core";
-export type Trigger = "hover";
 export type Placement = Extract<PopperPlacement, "bottom-start" | "bottom" | "bottom-end" | "top-start" | "top" | "top-end" | "right-start" | "right" | "right-end" | "left-start" | "left" | "left-end">;
 export interface ITooltipProps {
     children: ReactNode;

package/esm/base/FormField/index.js

@@ -14,12 +14,12 @@ var FormField = /*#__PURE__*/forwardRef(function (_a, ref) {
   return /*#__PURE__*/React__default.createElement("div", {
     className: clx(styles.container, className),
     ref: ref
-  }, label && ( /*#__PURE__*/React__default.createElement(Typography, {
+  }, label && (/*#__PURE__*/React__default.createElement(Typography, {
     className: clx(styles.label, {
       label_required: !!required
     }),
     tag: "label"
-  }, label)), children, hint && ( /*#__PURE__*/React__default.createElement(Typography, {
+  }, label)), children, hint && (/*#__PURE__*/React__default.createElement(Typography, {
     variant: error ? "alert" : "secondary",
     tag: "span"
   }, hint)));

package/esm/base/InputRoot/index.js

@@ -17,7 +17,7 @@ var InputRoot = /*#__PURE__*/forwardRef(function (_a, ref) {
   return /*#__PURE__*/React__default.createElement("div", {
     ref: ref,
     className: clx(styles.root, (_b = {}, _b["variant_".concat(variant, "_disabled")] = disabled ? 1 : 0, _b["variant_".concat(variant, "_error")] = error ? 1 : 0, _b["size_".concat(size)] = !!size, _b["variant_".concat(variant)] = !!variant, _b), className)
-  }, startIcon && ( /*#__PURE__*/React__default.createElement("div", {
+  }, startIcon && (/*#__PURE__*/React__default.createElement("div", {
     className: clx(styles["base-icon"])
   }, startIcon)), children, endIcon && /*#__PURE__*/React__default.createElement("div", {
     className: clx(styles["base-icon"])

package/esm/index.d.ts

@@ -1,3 +1,4 @@
+export { default as Accordion } from "./Accordion";
 export { default as Avatar } from "./Avatar";
 export { default as Badge } from "./Badge";
 export { default as Button } from "./Button";

package/esm/index.js

@@ -1,3 +1,4 @@
+export { default as Accordion } from './Accordion/index.js';
 export { default as Avatar } from './Avatar/index.js';
 export { default as Badge } from './Badge/index.js';
 export { default as Button } from './Button/index.js';

package/esm/theme_ba_variables.css

@@ -1,11 +1,11 @@
 .theme {
 --palette-black: #000;
 --palette-white: #fff;
---palette-bg-1: #f2f2f2;
---palette-bg-2: #e6e6e6;
---palette-bg-3: #dbdbdb;
---palette-bg-4: #b3b3b3;
---palette-bg-5: #999;
+--palette-bg-1: #ECEEF2;
+--palette-bg-2: #E4E6EA;
+--palette-bg-3: #D6D9E0;
+--palette-bg-4: #C9CDD6;
+--palette-bg-5: #BCC1CC;
 --palette-brand-default-1: #fcdfe2;
 --palette-brand-default-2: #facdd2;
 --palette-brand-default-3: #F59fa7;
@@ -23,7 +23,7 @@
 --palette-success: #28bc00;
 --typography-alert: #ff564e;
 --typography-success: #28bc00;
---typography-secondary: #dbdbdb;
+--typography-secondary: #D6D9E0;
 --button-border-radius: 18px;
 --button-primary-color: #000;
 --button-primary-background-color: #ffce31;
@@ -34,7 +34,7 @@
 --button-primary-color-active: #000;
 --button-primary-background-color-active: #ffc818;
 --button-primary-border-color-active: #ffc818;
---button-primary-color-disabled: #b3b3b3;
+--button-primary-color-disabled: #C9CDD6;
 --button-primary-background-color-disabled: #ffe695;
 --button-primary-border-color-disabled: #ffe695;
 --button-secondary-color: #fff;
@@ -46,21 +46,21 @@
 --button-secondary-color-active: #fff;
 --button-secondary-background-color-active: #000;
 --button-secondary-border-color-active: #000;
---button-secondary-color-disabled: #b3b3b3;
---button-secondary-background-color-disabled: #f2f2f2;
---button-secondary-border-color-disabled: #f2f2f2;
+--button-secondary-color-disabled: #C9CDD6;
+--button-secondary-background-color-disabled: #ECEEF2;
+--button-secondary-border-color-disabled: #ECEEF2;
 --button-outline-color: #000;
 --button-outline-background-color: #fff;
 --button-outline-border-color: #1f1f1f;
 --button-outline-color-hovered: #000;
---button-outline-background-color-hovered: #f2f2f2;
+--button-outline-background-color-hovered: #ECEEF2;
 --button-outline-border-color-hovered: #1f1f1f;
 --button-outline-color-active: #000;
---button-outline-background-color-active: #e6e6e6;
+--button-outline-background-color-active: #E4E6EA;
 --button-outline-border-color-active: #1f1f1f;
---button-outline-color-disabled: #b3b3b3;
+--button-outline-color-disabled: #C9CDD6;
 --button-outline-background-color-disabled: #fff;
---button-outline-border-color-disabled: #e6e6e6;
+--button-outline-border-color-disabled: #E4E6EA;
 --button-pseudo-color: #000;
 --button-pseudo-background-color: #DFE7FA;
 --button-pseudo-border-color: #DFE7FA;
@@ -70,17 +70,17 @@
 --button-pseudo-color-active: #000;
 --button-pseudo-background-color-active: #C0CFF8;
 --button-pseudo-border-color-active: #C0CFF8;
---button-pseudo-color-disabled: #b3b3b3;
+--button-pseudo-color-disabled: #C9CDD6;
 --button-pseudo-background-color-disabled: #DFE7FA;
 --button-pseudo-border-color-disabled: #DFE7FA;
 --button-clear-color: #1f1f1f;
 --button-clear-color-hovered: #1f1f1f;
 --button-clear-color-active: #000;
---button-clear-color-disabled: #b3b3b3;
+--button-clear-color-disabled: #C9CDD6;
 --button-clear-background-color-disabled: #fff;
 --button-clear-border-color-disabled: #fff;
---input-primary-border-color: #dbdbdb;
---input-primary-plaseholder-color: #e6e6e6;
+--input-primary-border-color: #D6D9E0;
+--input-primary-plaseholder-color: #E4E6EA;
 --input-primary-border-color-error: #ff564e;
 --input-primary-background-color-error: #FFEAE2;
 --input-primary-box-shadow-color-error: #FFEAE2;
@@ -96,8 +96,8 @@
 --input-radio-box-shadow-focused: #ffe695;
 --input-radio-background-color-focused: #ffe695;
 --input-radio-border-color-focused: #ffe695;
---switch-background-color: #e6e6e6;
---switch-border-color: #e6e6e6;
+--switch-background-color: #E4E6EA;
+--switch-border-color: #E4E6EA;
 --switch-background-color-checked: #ffc818;
 --switch-border-color-checked: #ffc818;
 --tooltip-background-color: #333;

package/esm/theme_default_variables.css

@@ -1,11 +1,11 @@
 .theme {
 --palette-black: #000;
 --palette-white: #fff;
---palette-bg-1: #f2f2f2;
---palette-bg-2: #e6e6e6;
---palette-bg-3: #dbdbdb;
---palette-bg-4: #b3b3b3;
---palette-bg-5: #999;
+--palette-bg-1: #ECEEF2;
+--palette-bg-2: #E4E6EA;
+--palette-bg-3: #D6D9E0;
+--palette-bg-4: #C9CDD6;
+--palette-bg-5: #BCC1CC;
 --palette-brand-default-1: #F393D2;
 --palette-brand-default-2: #4BDCF8;
 --palette-brand-default-3: #D5D500;
@@ -23,7 +23,7 @@
 --palette-success: #28bc00;
 --typography-alert: #ff564e;
 --typography-success: #28bc00;
---typography-secondary: #dbdbdb;
+--typography-secondary: #D6D9E0;
 --button-border-radius: 18px;
 --button-primary-color: #fff;
 --button-primary-background-color: #067AFF;
@@ -34,7 +34,7 @@
 --button-primary-color-active: #fff;
 --button-primary-background-color-active: #0066DC;
 --button-primary-border-color-active: #0066DC;
---button-primary-color-disabled: #b3b3b3;
+--button-primary-color-disabled: #C9CDD6;
 --button-primary-background-color-disabled: #E8F0FE;
 --button-primary-border-color-disabled: #E8F0FE;
 --button-secondary-color: #fff;
@@ -46,7 +46,7 @@
 --button-secondary-color-active: #fff;
 --button-secondary-background-color-active: #ffab0f;
 --button-secondary-border-color-active: #ffab0f;
---button-secondary-color-disabled: #b3b3b3;
+--button-secondary-color-disabled: #C9CDD6;
 --button-secondary-background-color-disabled: #fff1db;
 --button-secondary-border-color-disabled: #fff1db;
 --button-pseudo-color: #000;
@@ -58,29 +58,29 @@
 --button-pseudo-color-active: #000;
 --button-pseudo-background-color-active: #FFEAE2;
 --button-pseudo-border-color-active: #FFEAE2;
---button-pseudo-color-disabled: #b3b3b3;
+--button-pseudo-color-disabled: #C9CDD6;
 --button-pseudo-background-color-disabled: #FFF5F0;
 --button-pseudo-border-color-disabled: #FFF5F0;
 --button-outline-color: #000;
 --button-outline-background-color: #fff;
---button-outline-border-color: #dbdbdb;
+--button-outline-border-color: #D6D9E0;
 --button-outline-color-hovered: #000;
---button-outline-background-color-hovered: #f2f2f2;
---button-outline-border-color-hovered: #dbdbdb;
+--button-outline-background-color-hovered: #ECEEF2;
+--button-outline-border-color-hovered: #D6D9E0;
 --button-outline-color-active: #000;
---button-outline-background-color-active: #e6e6e6;
---button-outline-border-color-active: #dbdbdb;
---button-outline-color-disabled: #b3b3b3;
+--button-outline-background-color-active: #E4E6EA;
+--button-outline-border-color-active: #D6D9E0;
+--button-outline-color-disabled: #C9CDD6;
 --button-outline-background-color-disabled: #fff;
---button-outline-border-color-disabled: #e6e6e6;
+--button-outline-border-color-disabled: #E4E6EA;
 --button-clear-color: #067AFF;
 --button-clear-color-hovered: #067AFF;
 --button-clear-color-active: #0066DC;
---button-clear-color-disabled: #b3b3b3;
+--button-clear-color-disabled: #C9CDD6;
 --button-clear-background-color-disabled: #fff;
 --button-clear-border-color-disabled: #fff;
---input-primary-border-color: #dbdbdb;
---input-primary-plaseholder-color: #e6e6e6;
+--input-primary-border-color: #D6D9E0;
+--input-primary-plaseholder-color: #E4E6EA;
 --input-primary-border-color-error: #ff564e;
 --input-primary-background-color-error: #FFEAE2;
 --input-primary-box-shadow-color-error: #FFEAE2;
@@ -96,8 +96,8 @@
 --input-radio-box-shadow-focused: #E8F0FE;
 --input-radio-background-color-focused: #E8F0FE;
 --input-radio-border-color-focused: #E8F0FE;
---switch-background-color: #e6e6e6;
---switch-border-color: #e6e6e6;
+--switch-background-color: #E4E6EA;
+--switch-border-color: #E4E6EA;
 --switch-background-color-checked: #0066DC;
 --switch-border-color-checked: #0066DC;
 --tooltip-background-color: #000;

package/index.d.ts

@@ -1,3 +1,4 @@
+export { default as Accordion } from "./Accordion";
 export { default as Avatar } from "./Avatar";
 export { default as Badge } from "./Badge";
 export { default as Button } from "./Button";