colibri-ui 0.7.79 → 0.7.80

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/Accordion/Accordion.module.css +51 -0
  2. package/Accordion/index.d.ts +9 -0
  3. package/Accordion/index.js +67 -0
  4. package/Accordion/package.json +6 -0
  5. package/Avatar/Avatar.module.css +2 -2
  6. package/Avatar/index.d.ts +2 -2
  7. package/Avatar/index.js +4 -4
  8. package/Avatar/index.props.d.ts +1 -1
  9. package/Badge/index.js +1 -1
  10. package/Button/Button.module.css +2 -2
  11. package/Button/index.js +5 -2
  12. package/Button/index.props.d.ts +1 -0
  13. package/Calendar/components/Month/Month.js +2 -0
  14. package/Calendar/index.js +12 -6
  15. package/Checkbox/index.js +1 -1
  16. package/Chip/index.js +1 -1
  17. package/Dropdown/index.js +9 -7
  18. package/InputRadio/index.js +1 -1
  19. package/Menu/components/MenuItem/index.js +2 -1
  20. package/Menu/index.js +1 -1
  21. package/Modal/index.js +2 -2
  22. package/Select/components/MenuOverlay/index.js +5 -3
  23. package/Select/index.js +2 -2
  24. package/Tooltip/index.js +1 -1
  25. package/Tooltip/index.props.d.ts +0 -1
  26. package/base/FormField/index.js +2 -2
  27. package/base/InputRoot/index.js +1 -1
  28. package/esm/Accordion/Accordion.module.css +51 -0
  29. package/esm/Accordion/index.d.ts +9 -0
  30. package/esm/Accordion/index.js +57 -0
  31. package/esm/Avatar/Avatar.module.css +2 -2
  32. package/esm/Avatar/index.d.ts +2 -2
  33. package/esm/Avatar/index.js +3 -3
  34. package/esm/Avatar/index.props.d.ts +1 -1
  35. package/esm/Badge/index.js +1 -1
  36. package/esm/Button/Button.module.css +2 -2
  37. package/esm/Button/index.js +5 -2
  38. package/esm/Button/index.props.d.ts +1 -0
  39. package/esm/Calendar/components/Month/Month.js +2 -0
  40. package/esm/Calendar/index.js +12 -6
  41. package/esm/Checkbox/index.js +1 -1
  42. package/esm/Chip/index.js +1 -1
  43. package/esm/Dropdown/index.js +8 -6
  44. package/esm/InputRadio/index.js +1 -1
  45. package/esm/Menu/components/MenuItem/index.js +2 -1
  46. package/esm/Menu/index.js +1 -1
  47. package/esm/Modal/index.js +2 -2
  48. package/esm/Select/components/MenuOverlay/index.js +5 -3
  49. package/esm/Select/index.js +2 -2
  50. package/esm/Tooltip/index.js +1 -1
  51. package/esm/Tooltip/index.props.d.ts +0 -1
  52. package/esm/base/FormField/index.js +2 -2
  53. package/esm/base/InputRoot/index.js +1 -1
  54. package/esm/index.d.ts +1 -0
  55. package/esm/index.js +1 -0
  56. package/index.d.ts +1 -0
  57. package/index.js +61 -59
  58. package/package.json +1 -1
@@ -0,0 +1,51 @@
1
+ .root {
2
+ overflow: hidden;
3
+ padding: 14px;
4
+ }
5
+
6
+ .content {
7
+ block-size: 0;
8
+ overflow: hidden;
9
+ transition: block-size 0.2s ease-in-out;
10
+ }
11
+
12
+ .button {
13
+ align-items: center;
14
+ background: none;
15
+ border: none;
16
+ color: initial;
17
+ cursor: pointer;
18
+ display: flex;
19
+ font: inherit;
20
+ gap: 8px;
21
+ inline-size: 100%;
22
+ outline: none;
23
+ padding: 0;
24
+ }
25
+ .button svg {
26
+ flex: none;
27
+ }
28
+
29
+ .text {
30
+ overflow: hidden;
31
+ text-overflow: ellipsis;
32
+ white-space: nowrap;
33
+ }
34
+
35
+ .header {
36
+ margin-block-end: 14px;
37
+ }
38
+
39
+ .chevron {
40
+ transition: transform 0.2s ease-in-out;
41
+ }
42
+ .chevron_open {
43
+ transform: rotate(180deg);
44
+ }
45
+
46
+ .line {
47
+ background-color: var(--palette-bg-3);
48
+ block-size: 1px;
49
+ flex: 1;
50
+ margin-inline-start: 8px;
51
+ }
@@ -0,0 +1,9 @@
1
+ import type { FC, ReactNode, PropsWithChildren } from "react";
2
+ type Props = {
3
+ title: ReactNode;
4
+ className?: string;
5
+ boldTitle?: boolean;
6
+ tabIndex?: number;
7
+ };
8
+ declare const Accordion: FC<PropsWithChildren<Props>>;
9
+ export default Accordion;
@@ -0,0 +1,67 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var React = require('react');
6
+ var classNames = require('classnames/bind');
7
+ require('../Icons/index.js');
8
+ var index = require('../Typography/index.js');
9
+ var styles = require('./Accordion.module.css');
10
+ var Chevron = require('../Icons/Chevron.js');
11
+
12
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
13
+
14
+ var React__default = /*#__PURE__*/_interopDefault(React);
15
+ var classNames__default = /*#__PURE__*/_interopDefault(classNames);
16
+ var styles__default = /*#__PURE__*/_interopDefault(styles);
17
+
18
+ var clx = classNames__default.default.bind(styles__default.default);
19
+ var Accordion = function Accordion(_a) {
20
+ var title = _a.title,
21
+ _b = _a.boldTitle,
22
+ boldTitle = _b === void 0 ? false : _b,
23
+ children = _a.children,
24
+ className = _a.className,
25
+ tabIndex = _a.tabIndex;
26
+ var _c = React.useState(false),
27
+ isOpen = _c[0],
28
+ setIsOpen = _c[1];
29
+ var contentRef = React.useRef(null);
30
+ var toggleAccordion = function toggleAccordion() {
31
+ return setIsOpen(!isOpen);
32
+ };
33
+ React.useEffect(function () {
34
+ if (contentRef.current) {
35
+ contentRef.current.style.blockSize = isOpen ? "".concat(contentRef.current.scrollHeight, "px") : "0px";
36
+ }
37
+ }, [isOpen]);
38
+ return /*#__PURE__*/React__default.default.createElement("div", {
39
+ className: clx("root", className)
40
+ }, /*#__PURE__*/React__default.default.createElement("div", {
41
+ className: clx("header")
42
+ }, /*#__PURE__*/React__default.default.createElement("button", {
43
+ className: clx("button"),
44
+ onClick: toggleAccordion,
45
+ type: "button",
46
+ role: "button",
47
+ "aria-expanded": isOpen,
48
+ tabIndex: tabIndex,
49
+ "aria-label": "Toggle"
50
+ }, /*#__PURE__*/React__default.default.createElement(Chevron.default, {
51
+ className: clx("chevron", {
52
+ chevron_open: isOpen
53
+ }),
54
+ width: 20,
55
+ height: 20
56
+ }), /*#__PURE__*/React__default.default.createElement(index.default, {
57
+ className: clx("text"),
58
+ fontWeight: boldTitle ? "bold" : "normal"
59
+ }, title), /*#__PURE__*/React__default.default.createElement("div", {
60
+ className: clx("line")
61
+ }))), /*#__PURE__*/React__default.default.createElement("div", {
62
+ ref: contentRef,
63
+ className: clx("content")
64
+ }, children));
65
+ };
66
+
67
+ exports.default = Accordion;
@@ -0,0 +1,6 @@
1
+ {
2
+ "sideEffects": false,
3
+ "module": "../esm/Accordion/index.js",
4
+ "main": "./index.js",
5
+ "types": "./index.d.ts"
6
+ }
@@ -1,11 +1,11 @@
1
1
  .avatar {
2
- transition: border-color 0.15s ease;
3
2
  border-radius: 100%;
4
3
  box-sizing: border-box;
4
+ transition: border-color 0.15s ease;
5
5
  }
6
6
  .avatar_bordered {
7
- border: 4px solid transparent;
8
7
  background-color: var(--palette-white);
8
+ border: 4px solid transparent;
9
9
  }
10
10
  .avatar_bordered:hover {
11
11
  border-color: rgba(95, 99, 104, 0.24);
package/Avatar/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { FC } from 'react';
2
- import { AvatarProps } from './index.props';
1
+ import type { AvatarProps } from "./index.props";
2
+ import type { FC } from "react";
3
3
  declare const Avatar: FC<AvatarProps>;
4
4
  export default Avatar;
package/Avatar/index.js CHANGED
@@ -3,18 +3,18 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var React = require('react');
6
+ var classNames = require('classnames/bind');
6
7
  var constants = require('./constants.js');
7
8
  var maleCircle = require('./assets/male-circle.svg.js');
8
9
  var orgCircle = require('./assets/org-circle.svg.js');
9
10
  var styles = require('./Avatar.module.css');
10
- var classNames = require('classnames/bind');
11
11
  var index_props = require('./index.props.js');
12
12
 
13
13
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
14
14
 
15
15
  var React__default = /*#__PURE__*/_interopDefault(React);
16
- var styles__default = /*#__PURE__*/_interopDefault(styles);
17
16
  var classNames__default = /*#__PURE__*/_interopDefault(classNames);
17
+ var styles__default = /*#__PURE__*/_interopDefault(styles);
18
18
 
19
19
  var clx = classNames__default.default.bind(styles__default.default);
20
20
  var Avatar = /*#__PURE__*/React.memo(function (props) {
@@ -24,7 +24,7 @@ var Avatar = /*#__PURE__*/React.memo(function (props) {
24
24
  className = props.className,
25
25
  bordered = props.bordered,
26
26
  _b = props.title,
27
- title = _b === void 0 ? '' : _b,
27
+ title = _b === void 0 ? "" : _b,
28
28
  _c = props.accountType,
29
29
  accountType = _c === void 0 ? index_props.AccountType.Organization : _c;
30
30
  var isOrg = accountType === index_props.AccountType.Organization;
@@ -35,7 +35,7 @@ var Avatar = /*#__PURE__*/React.memo(function (props) {
35
35
  width: size,
36
36
  height: size,
37
37
  className: clx(styles__default.default.avatar, {
38
- 'avatar_bordered': !!bordered
38
+ avatar_bordered: !!bordered
39
39
  }, [className])
40
40
  });
41
41
  });
@@ -1,4 +1,4 @@
1
- import { AvatarSizes } from "./constants";
1
+ import type { AvatarSizes } from "./constants";
2
2
  export declare enum AccountType {
3
3
  Person = "person",
4
4
  Organization = "org"
package/Badge/index.js CHANGED
@@ -46,7 +46,7 @@ var Badge = function Badge(_a) {
46
46
  className: clx((_b = {
47
47
  root: true
48
48
  }, _b["root_direction_".concat(direction)] = !!direction, _b.root_invisible = invisible, _b), className),
49
- "data-cy": "badge"
49
+ "data-testid": "badge"
50
50
  }, displayValue));
51
51
  };
52
52
 
@@ -175,7 +175,7 @@
175
175
  }
176
176
 
177
177
  .text {
178
- white-space: nowrap;
179
- text-overflow: ellipsis;
180
178
  overflow: hidden;
179
+ text-overflow: ellipsis;
180
+ white-space: nowrap;
181
181
  }
package/Button/index.js CHANGED
@@ -28,7 +28,8 @@ var Button = /*#__PURE__*/React.forwardRef(function (_a, ref) {
28
28
  children = _a.children,
29
29
  disabled = _a.disabled,
30
30
  onClick = _a.onClick,
31
- props = tslib.__rest(_a, ["className", "fullWidth", "variant", "iconStart", "iconEnd", "icon", "size", "children", "disabled", "onClick"]);
31
+ type = _a.type,
32
+ props = tslib.__rest(_a, ["className", "fullWidth", "variant", "iconStart", "iconEnd", "icon", "size", "children", "disabled", "onClick", "type"]);
32
33
  return /*#__PURE__*/React__default.default.createElement("button", tslib.__assign({
33
34
  onClick: onClick,
34
35
  ref: ref,
@@ -37,7 +38,9 @@ var Button = /*#__PURE__*/React.forwardRef(function (_a, ref) {
37
38
  root_fullWidth: !!fullWidth
38
39
  }, _b["size_".concat(size)] = !!size, _b["variant_".concat(variant)] = !!variant, _b["variant_".concat(variant, "_disabled")] = !!disabled, _b), className),
39
40
  disabled: disabled,
40
- "data-cy": "button"
41
+ "data-cy": "button",
42
+ type: type || "button",
43
+ role: "button"
41
44
  }, props), icon && /*#__PURE__*/React__default.default.createElement("span", {
42
45
  className: clx(styles__default.default.icon)
43
46
  }, icon), iconStart && /*#__PURE__*/React__default.default.createElement("span", {
@@ -9,4 +9,5 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
9
9
  iconEnd?: ReactNode;
10
10
  size?: ButtonSize;
11
11
  disabled?: boolean;
12
+ type?: "submit" | "reset" | "button" | undefined;
12
13
  }
@@ -126,6 +126,8 @@ var Month = function Month(props) {
126
126
  style: {
127
127
  background: day.isSelected ? "var(--palette-bg-2)" : "transparent"
128
128
  },
129
+ role: "button",
130
+ type: "button",
129
131
  onClick: day.isActive ? function () {
130
132
  return props.onDayClick([year, month, leadingZeros.leadingZeros(day.day, 2)].join("-"));
131
133
  } : undefined
package/Calendar/index.js CHANGED
@@ -152,7 +152,7 @@ var Calendar = function Calendar(_a) {
152
152
  className: clx(styles__default.default.root),
153
153
  "data-component": "Calendar",
154
154
  ref: $root
155
- }, /*#__PURE__*/React__default.default.createElement("div", null, contentWidth ? ( /*#__PURE__*/React__default.default.createElement("div", {
155
+ }, /*#__PURE__*/React__default.default.createElement("div", null, contentWidth ? (/*#__PURE__*/React__default.default.createElement("div", {
156
156
  "data-component": "Months",
157
157
  className: clx(styles__default.default.months),
158
158
  style: {
@@ -169,26 +169,32 @@ var Calendar = function Calendar(_a) {
169
169
  return /*#__PURE__*/React__default.default.createElement(Month.Month, tslib.__assign({}, attrs, {
170
170
  key: "month-".concat(index)
171
171
  }));
172
- }))) : ( /*#__PURE__*/React__default.default.createElement(Month.Month, tslib.__assign({
172
+ }))) : (/*#__PURE__*/React__default.default.createElement(Month.Month, tslib.__assign({
173
173
  today: today,
174
174
  startDate: getMonthStartDate(currentMonthOffset),
175
175
  offsetLeft: 0
176
176
  }, commonAttrs))), /*#__PURE__*/React__default.default.createElement("button", {
177
177
  className: clx(styles__default.default["month-control"], styles__default.default["month-control-prev"]),
178
178
  onClick: showPrevMonth,
179
- disabled: currentMonthOffset <= 0
179
+ disabled: currentMonthOffset <= 0,
180
+ type: "button",
181
+ role: "button",
182
+ "aria-label": "Prev"
180
183
  }, /*#__PURE__*/React__default.default.createElement(ArrowNext.default, {
181
184
  className: clx(styles__default.default["month-control-prev-arrow"])
182
185
  })), /*#__PURE__*/React__default.default.createElement("button", {
183
186
  className: clx(styles__default.default["month-control"], styles__default.default["month-control-next"]),
184
187
  onClick: showNextMonth,
185
- disabled: currentMonthOffset >= 11
188
+ disabled: currentMonthOffset >= 11,
189
+ type: "button",
190
+ role: "button",
191
+ "aria-label": "Next"
186
192
  }, /*#__PURE__*/React__default.default.createElement(ArrowNext.default, {
187
193
  className: clx(styles__default.default["month-control-next-arrow"])
188
- }))), datePresets && ( /*#__PURE__*/React__default.default.createElement(index$2.Presets, {
194
+ }))), datePresets && (/*#__PURE__*/React__default.default.createElement(index$2.Presets, {
189
195
  presets: datePresets,
190
196
  onPresetSelect: handlePresetSelect
191
- })), withContinueButton && ( /*#__PURE__*/React__default.default.createElement(index$3.ContinueButton, {
197
+ })), withContinueButton && (/*#__PURE__*/React__default.default.createElement(index$3.ContinueButton, {
192
198
  isChanged: selectedDate !== initialSelectedDate || selectedPeriod !== initialSelectedPeriod,
193
199
  selectedDate: selectedDate,
194
200
  selectedPeriod: selectedPeriod,
package/Checkbox/index.js CHANGED
@@ -52,7 +52,7 @@ var Checkbox = function Checkbox(_a) {
52
52
  }, label)));
53
53
  return /*#__PURE__*/React__default.default.createElement("div", {
54
54
  className: clx(styles__default.default.root)
55
- }, control, hint && ( /*#__PURE__*/React__default.default.createElement(index.default, {
55
+ }, control, hint && (/*#__PURE__*/React__default.default.createElement(index.default, {
56
56
  variant: isError ? "alert" : "secondary",
57
57
  tag: "span"
58
58
  }, hint)));
package/Chip/index.js CHANGED
@@ -38,7 +38,7 @@ var Chip = function Chip(props) {
38
38
  onClick: onClick
39
39
  }, /*#__PURE__*/React__default.default.createElement("span", {
40
40
  className: clx("content-inner")
41
- }, children)), iconOnRight && ( /*#__PURE__*/React__default.default.createElement("span", {
41
+ }, children)), iconOnRight && (/*#__PURE__*/React__default.default.createElement("span", {
42
42
  className: clx("icon-right"),
43
43
  onClick: onIconOnRightClick || onClick
44
44
  }, iconOnRight))));
package/Dropdown/index.js CHANGED
@@ -4,19 +4,20 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var tslib = require('tslib');
6
6
  var React = require('react');
7
+ var classNames = require('classnames/bind');
7
8
  var reactPopper = require('react-popper');
8
- var classNames = require('classnames');
9
9
  var index = require('../Portal/index.js');
10
10
  var on = require('../helpers/on.js');
11
11
  var index$1 = require('../ClickOutside/index.js');
12
- var dropDownStyles = require('./Dropdown.module.css');
12
+ var styles = require('./Dropdown.module.css');
13
13
 
14
14
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
15
15
 
16
16
  var React__default = /*#__PURE__*/_interopDefault(React);
17
17
  var classNames__default = /*#__PURE__*/_interopDefault(classNames);
18
- var dropDownStyles__default = /*#__PURE__*/_interopDefault(dropDownStyles);
18
+ var styles__default = /*#__PURE__*/_interopDefault(styles);
19
19
 
20
+ var clx = classNames__default.default.bind(styles__default.default);
20
21
  var Dropdown = function Dropdown(_a) {
21
22
  var children = _a.children,
22
23
  zIndex = _a.zIndex,
@@ -122,12 +123,12 @@ var Dropdown = function Dropdown(_a) {
122
123
  return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, /*#__PURE__*/React__default.default.createElement(reference.type, tslib.__assign({
123
124
  ref: setControlElement,
124
125
  tabIndex: 0
125
- }, reference.props)), isVisible && ( /*#__PURE__*/React__default.default.createElement(index.default, null, /*#__PURE__*/React__default.default.createElement(index$1.default, {
126
+ }, reference.props)), isVisible && (/*#__PURE__*/React__default.default.createElement(index.default, null, /*#__PURE__*/React__default.default.createElement(index$1.default, {
126
127
  onClick: onClickOutside
127
128
  }, /*#__PURE__*/React__default.default.createElement("div", tslib.__assign({
128
129
  ref: setPopperElement,
129
- "data-component": "popper-container",
130
- className: classNames__default.default(dropDownStyles__default.default["popper-container"]),
130
+ "data-testid": "popper-container",
131
+ className: clx("popper-container"),
131
132
  style: tslib.__assign(tslib.__assign(tslib.__assign({}, styles.popper), {
132
133
  zIndex: zIndex,
133
134
  minWidth: controlElement === null || controlElement === void 0 ? void 0 : controlElement.offsetWidth
@@ -136,7 +137,8 @@ var Dropdown = function Dropdown(_a) {
136
137
  }),
137
138
  tabIndex: 0
138
139
  }, attributes.popper), /*#__PURE__*/React__default.default.createElement("div", {
139
- className: classNames__default.default(dropDownStyles__default.default["overlay-container"]),
140
+ "data-testid": "overlay-container",
141
+ className: clx("overlay-container"),
140
142
  onClick: onClickOverlay
141
143
  }, overlay))))));
142
144
  };
@@ -66,7 +66,7 @@ var InputRadio = /*#__PURE__*/React.memo(function (_a) {
66
66
  className: clx(styles__default.default.icon)
67
67
  }), /*#__PURE__*/React__default.default.createElement("span", {
68
68
  className: clx(styles__default.default.text)
69
- }, !children && text, !text && children)), !!note && ( /*#__PURE__*/React__default.default.createElement(index.default, {
69
+ }, !children && text, !text && children)), !!note && (/*#__PURE__*/React__default.default.createElement(index.default, {
70
70
  tag: "p",
71
71
  size: "s",
72
72
  className: clx(styles__default.default.note)
@@ -26,8 +26,9 @@ var MenuItem = /*#__PURE__*/React.forwardRef(function (_a, ref) {
26
26
  ref: ref,
27
27
  "data-component": "menu-item",
28
28
  style: {
29
- backgroundColor: isSelected ? "var(--palette-primary-1)" : ""
29
+ backgroundColor: isSelected ? "var(--palette-primary-1, rgb(232, 240, 254))" : "transparent"
30
30
  },
31
+ "data-testid": "menuitem",
31
32
  className: clx("item", (_b = {
32
33
  item_disabled: !!disabled
33
34
  }, _b["item_variant_".concat(variant)] = !!variant, _b), className),
package/Menu/index.js CHANGED
@@ -21,7 +21,7 @@ var Menu = /*#__PURE__*/React.forwardRef(function (_a, ref) {
21
21
  children = _a.children;
22
22
  var renderChild = React.useMemo(function () {
23
23
  return React.Children.map(children, function (child) {
24
- if ( /*#__PURE__*/React.isValidElement(child)) {
24
+ if (/*#__PURE__*/React.isValidElement(child)) {
25
25
  var isSelected = selected ? selected.includes(String(child.key)) : undefined;
26
26
  var onClickHandler = function onClickHandler(e) {
27
27
  if (child.props.onClick) child.props.onClick(e);
package/Modal/index.js CHANGED
@@ -57,11 +57,11 @@ var Modal = function Modal(_a) {
57
57
  "modal-wrapper_mobile": !isDesktop ? 1 : 0
58
58
  }, className),
59
59
  ref: modalRef
60
- }, title ? ( /*#__PURE__*/React__default.default.createElement("div", {
60
+ }, title ? (/*#__PURE__*/React__default.default.createElement("div", {
61
61
  className: clx("title-wrapper")
62
62
  }, /*#__PURE__*/React__default.default.createElement(index$4.default, null, title), /*#__PURE__*/React__default.default.createElement(index$5.default, {
63
63
  onClick: onCloseHandler
64
- }))) : ( /*#__PURE__*/React__default.default.createElement("div", {
64
+ }))) : (/*#__PURE__*/React__default.default.createElement("div", {
65
65
  className: clx("close-wrapper")
66
66
  }, /*#__PURE__*/React__default.default.createElement(index$5.default, {
67
67
  onClick: onCloseHandler
@@ -39,9 +39,11 @@ var MenuOverlay = function MenuOverlay(_a) {
39
39
  if (!rootRef || !rootRef.current) {
40
40
  return;
41
41
  }
42
- rootRef.current.scrollTo({
43
- top: scrollView.top - OFFSET_ITEMS_COUNT * scrollView.height
44
- });
42
+ if (typeof rootRef.current.scrollTo === "function") {
43
+ rootRef.current.scrollTo({
44
+ top: scrollView.top - OFFSET_ITEMS_COUNT * scrollView.height
45
+ });
46
+ }
45
47
  }, [scrollView, rootRef]);
46
48
  return /*#__PURE__*/React__default.default.createElement("div", {
47
49
  ref: rootRef,
package/Select/index.js CHANGED
@@ -83,8 +83,8 @@ var Select = function Select(_a) {
83
83
  disabled: !!disabled
84
84
  }, /*#__PURE__*/React__default.default.createElement("div", {
85
85
  className: clx(styles__default.default["base-input"]),
86
- "data-component": "base-input"
87
- }, prepraredLabel !== null && prepraredLabel !== void 0 ? prepraredLabel : ( /*#__PURE__*/React__default.default.createElement("span", {
86
+ "data-testid": "base-input"
87
+ }, prepraredLabel !== null && prepraredLabel !== void 0 ? prepraredLabel : (/*#__PURE__*/React__default.default.createElement("span", {
88
88
  className: clx(styles__default.default.placeholder)
89
89
  }, placeholder))), /*#__PURE__*/React__default.default.createElement("input", {
90
90
  type: "hidden",
package/Tooltip/index.js CHANGED
@@ -92,7 +92,7 @@ var Tooltip = function Tooltip(_a) {
92
92
  }, [update, visible]);
93
93
  return /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, /*#__PURE__*/React__default.default.createElement(reference.type, tslib.__assign({
94
94
  ref: setControlElement
95
- }, reference.props)), visible && ( /*#__PURE__*/React__default.default.createElement(index.default, null, /*#__PURE__*/React__default.default.createElement(index$1.default, {
95
+ }, reference.props)), visible && (/*#__PURE__*/React__default.default.createElement(index.default, null, /*#__PURE__*/React__default.default.createElement(index$1.default, {
96
96
  onClick: onClickOutside
97
97
  }, /*#__PURE__*/React__default.default.createElement("div", tslib.__assign({
98
98
  className: clx("root", {
@@ -1,7 +1,6 @@
1
1
  import type { ReactNode } from "react";
2
2
  import type { PositioningStrategy } from "@popperjs/core";
3
3
  import type { Placement as PopperPlacement } from "@popperjs/core";
4
- export type Trigger = "hover";
5
4
  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">;
6
5
  export interface ITooltipProps {
7
6
  children: ReactNode;
@@ -24,12 +24,12 @@ var FormField = /*#__PURE__*/React.forwardRef(function (_a, ref) {
24
24
  return /*#__PURE__*/React__default.default.createElement("div", {
25
25
  className: clx(styles__default.default.container, className),
26
26
  ref: ref
27
- }, label && ( /*#__PURE__*/React__default.default.createElement(index.default, {
27
+ }, label && (/*#__PURE__*/React__default.default.createElement(index.default, {
28
28
  className: clx(styles__default.default.label, {
29
29
  label_required: !!required
30
30
  }),
31
31
  tag: "label"
32
- }, label)), children, hint && ( /*#__PURE__*/React__default.default.createElement(index.default, {
32
+ }, label)), children, hint && (/*#__PURE__*/React__default.default.createElement(index.default, {
33
33
  variant: error ? "alert" : "secondary",
34
34
  tag: "span"
35
35
  }, hint)));
@@ -27,7 +27,7 @@ var InputRoot = /*#__PURE__*/React.forwardRef(function (_a, ref) {
27
27
  return /*#__PURE__*/React__default.default.createElement("div", {
28
28
  ref: ref,
29
29
  className: clx(styles__default.default.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)
30
- }, startIcon && ( /*#__PURE__*/React__default.default.createElement("div", {
30
+ }, startIcon && (/*#__PURE__*/React__default.default.createElement("div", {
31
31
  className: clx(styles__default.default["base-icon"])
32
32
  }, startIcon)), children, endIcon && /*#__PURE__*/React__default.default.createElement("div", {
33
33
  className: clx(styles__default.default["base-icon"])
@@ -0,0 +1,51 @@
1
+ .root {
2
+ overflow: hidden;
3
+ padding: 14px;
4
+ }
5
+
6
+ .content {
7
+ block-size: 0;
8
+ overflow: hidden;
9
+ transition: block-size 0.2s ease-in-out;
10
+ }
11
+
12
+ .button {
13
+ align-items: center;
14
+ background: none;
15
+ border: none;
16
+ color: initial;
17
+ cursor: pointer;
18
+ display: flex;
19
+ font: inherit;
20
+ gap: 8px;
21
+ inline-size: 100%;
22
+ outline: none;
23
+ padding: 0;
24
+ }
25
+ .button svg {
26
+ flex: none;
27
+ }
28
+
29
+ .text {
30
+ overflow: hidden;
31
+ text-overflow: ellipsis;
32
+ white-space: nowrap;
33
+ }
34
+
35
+ .header {
36
+ margin-block-end: 14px;
37
+ }
38
+
39
+ .chevron {
40
+ transition: transform 0.2s ease-in-out;
41
+ }
42
+ .chevron_open {
43
+ transform: rotate(180deg);
44
+ }
45
+
46
+ .line {
47
+ background-color: var(--palette-bg-3);
48
+ block-size: 1px;
49
+ flex: 1;
50
+ margin-inline-start: 8px;
51
+ }
@@ -0,0 +1,9 @@
1
+ import type { FC, ReactNode, PropsWithChildren } from "react";
2
+ type Props = {
3
+ title: ReactNode;
4
+ className?: string;
5
+ boldTitle?: boolean;
6
+ tabIndex?: number;
7
+ };
8
+ declare const Accordion: FC<PropsWithChildren<Props>>;
9
+ export default Accordion;
@@ -0,0 +1,57 @@
1
+ import React__default, { useState, useRef, useEffect } from 'react';
2
+ import classNames from 'classnames/bind';
3
+ import '../Icons/index.js';
4
+ import Typography from '../Typography/index.js';
5
+ import styles from './Accordion.module.css';
6
+ import Chevron from '../Icons/Chevron.js';
7
+
8
+ var clx = classNames.bind(styles);
9
+ var Accordion = function Accordion(_a) {
10
+ var title = _a.title,
11
+ _b = _a.boldTitle,
12
+ boldTitle = _b === void 0 ? false : _b,
13
+ children = _a.children,
14
+ className = _a.className,
15
+ tabIndex = _a.tabIndex;
16
+ var _c = useState(false),
17
+ isOpen = _c[0],
18
+ setIsOpen = _c[1];
19
+ var contentRef = useRef(null);
20
+ var toggleAccordion = function toggleAccordion() {
21
+ return setIsOpen(!isOpen);
22
+ };
23
+ useEffect(function () {
24
+ if (contentRef.current) {
25
+ contentRef.current.style.blockSize = isOpen ? "".concat(contentRef.current.scrollHeight, "px") : "0px";
26
+ }
27
+ }, [isOpen]);
28
+ return /*#__PURE__*/React__default.createElement("div", {
29
+ className: clx("root", className)
30
+ }, /*#__PURE__*/React__default.createElement("div", {
31
+ className: clx("header")
32
+ }, /*#__PURE__*/React__default.createElement("button", {
33
+ className: clx("button"),
34
+ onClick: toggleAccordion,
35
+ type: "button",
36
+ role: "button",
37
+ "aria-expanded": isOpen,
38
+ tabIndex: tabIndex,
39
+ "aria-label": "Toggle"
40
+ }, /*#__PURE__*/React__default.createElement(Chevron, {
41
+ className: clx("chevron", {
42
+ chevron_open: isOpen
43
+ }),
44
+ width: 20,
45
+ height: 20
46
+ }), /*#__PURE__*/React__default.createElement(Typography, {
47
+ className: clx("text"),
48
+ fontWeight: boldTitle ? "bold" : "normal"
49
+ }, title), /*#__PURE__*/React__default.createElement("div", {
50
+ className: clx("line")
51
+ }))), /*#__PURE__*/React__default.createElement("div", {
52
+ ref: contentRef,
53
+ className: clx("content")
54
+ }, children));
55
+ };
56
+
57
+ export { Accordion as default };
@@ -1,11 +1,11 @@
1
1
  .avatar {
2
- transition: border-color 0.15s ease;
3
2
  border-radius: 100%;
4
3
  box-sizing: border-box;
4
+ transition: border-color 0.15s ease;
5
5
  }
6
6
  .avatar_bordered {
7
- border: 4px solid transparent;
8
7
  background-color: var(--palette-white);
8
+ border: 4px solid transparent;
9
9
  }
10
10
  .avatar_bordered:hover {
11
11
  border-color: rgba(95, 99, 104, 0.24);
@@ -1,4 +1,4 @@
1
- import { FC } from 'react';
2
- import { AvatarProps } from './index.props';
1
+ import type { AvatarProps } from "./index.props";
2
+ import type { FC } from "react";
3
3
  declare const Avatar: FC<AvatarProps>;
4
4
  export default Avatar;
@@ -1,9 +1,9 @@
1
1
  import React__default, { memo } from 'react';
2
+ import classNames from 'classnames/bind';
2
3
  import { AvatarSizes } from './constants.js';
3
4
  import maleCircleUrl from './assets/male-circle.svg.js';
4
5
  import orgCircleUrl from './assets/org-circle.svg.js';
5
6
  import styles from './Avatar.module.css';
6
- import classNames from 'classnames/bind';
7
7
  import { AccountType } from './index.props.js';
8
8
 
9
9
  var clx = classNames.bind(styles);
@@ -14,7 +14,7 @@ var Avatar = /*#__PURE__*/memo(function (props) {
14
14
  className = props.className,
15
15
  bordered = props.bordered,
16
16
  _b = props.title,
17
- title = _b === void 0 ? '' : _b,
17
+ title = _b === void 0 ? "" : _b,
18
18
  _c = props.accountType,
19
19
  accountType = _c === void 0 ? AccountType.Organization : _c;
20
20
  var isOrg = accountType === AccountType.Organization;
@@ -25,7 +25,7 @@ var Avatar = /*#__PURE__*/memo(function (props) {
25
25
  width: size,
26
26
  height: size,
27
27
  className: clx(styles.avatar, {
28
- 'avatar_bordered': !!bordered
28
+ avatar_bordered: !!bordered
29
29
  }, [className])
30
30
  });
31
31
  });
@@ -1,4 +1,4 @@
1
- import { AvatarSizes } from "./constants";
1
+ import type { AvatarSizes } from "./constants";
2
2
  export declare enum AccountType {
3
3
  Person = "person",
4
4
  Organization = "org"
@@ -36,7 +36,7 @@ var Badge = function Badge(_a) {
36
36
  className: clx((_b = {
37
37
  root: true
38
38
  }, _b["root_direction_".concat(direction)] = !!direction, _b.root_invisible = invisible, _b), className),
39
- "data-cy": "badge"
39
+ "data-testid": "badge"
40
40
  }, displayValue));
41
41
  };
42
42
 
@@ -175,7 +175,7 @@
175
175
  }
176
176
 
177
177
  .text {
178
- white-space: nowrap;
179
- text-overflow: ellipsis;
180
178
  overflow: hidden;
179
+ text-overflow: ellipsis;
180
+ white-space: nowrap;
181
181
  }
@@ -18,7 +18,8 @@ var Button = /*#__PURE__*/forwardRef(function (_a, ref) {
18
18
  children = _a.children,
19
19
  disabled = _a.disabled,
20
20
  onClick = _a.onClick,
21
- props = __rest(_a, ["className", "fullWidth", "variant", "iconStart", "iconEnd", "icon", "size", "children", "disabled", "onClick"]);
21
+ type = _a.type,
22
+ props = __rest(_a, ["className", "fullWidth", "variant", "iconStart", "iconEnd", "icon", "size", "children", "disabled", "onClick", "type"]);
22
23
  return /*#__PURE__*/React__default.createElement("button", __assign({
23
24
  onClick: onClick,
24
25
  ref: ref,
@@ -27,7 +28,9 @@ var Button = /*#__PURE__*/forwardRef(function (_a, ref) {
27
28
  root_fullWidth: !!fullWidth
28
29
  }, _b["size_".concat(size)] = !!size, _b["variant_".concat(variant)] = !!variant, _b["variant_".concat(variant, "_disabled")] = !!disabled, _b), className),
29
30
  disabled: disabled,
30
- "data-cy": "button"
31
+ "data-cy": "button",
32
+ type: type || "button",
33
+ role: "button"
31
34
  }, props), icon && /*#__PURE__*/React__default.createElement("span", {
32
35
  className: clx(styles.icon)
33
36
  }, icon), iconStart && /*#__PURE__*/React__default.createElement("span", {
@@ -9,4 +9,5 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
9
9
  iconEnd?: ReactNode;
10
10
  size?: ButtonSize;
11
11
  disabled?: boolean;
12
+ type?: "submit" | "reset" | "button" | undefined;
12
13
  }
@@ -100,6 +100,8 @@ var Month = function Month(props) {
100
100
  style: {
101
101
  background: day.isSelected ? "var(--palette-bg-2)" : "transparent"
102
102
  },
103
+ role: "button",
104
+ type: "button",
103
105
  onClick: day.isActive ? function () {
104
106
  return props.onDayClick([year, month, leadingZeros(day.day, 2)].join("-"));
105
107
  } : undefined
@@ -142,7 +142,7 @@ var Calendar = function Calendar(_a) {
142
142
  className: clx(styles.root),
143
143
  "data-component": "Calendar",
144
144
  ref: $root
145
- }, /*#__PURE__*/React__default.createElement("div", null, contentWidth ? ( /*#__PURE__*/React__default.createElement("div", {
145
+ }, /*#__PURE__*/React__default.createElement("div", null, contentWidth ? (/*#__PURE__*/React__default.createElement("div", {
146
146
  "data-component": "Months",
147
147
  className: clx(styles.months),
148
148
  style: {
@@ -159,26 +159,32 @@ var Calendar = function Calendar(_a) {
159
159
  return /*#__PURE__*/React__default.createElement(Month, __assign({}, attrs, {
160
160
  key: "month-".concat(index)
161
161
  }));
162
- }))) : ( /*#__PURE__*/React__default.createElement(Month, __assign({
162
+ }))) : (/*#__PURE__*/React__default.createElement(Month, __assign({
163
163
  today: today,
164
164
  startDate: getMonthStartDate(currentMonthOffset),
165
165
  offsetLeft: 0
166
166
  }, commonAttrs))), /*#__PURE__*/React__default.createElement("button", {
167
167
  className: clx(styles["month-control"], styles["month-control-prev"]),
168
168
  onClick: showPrevMonth,
169
- disabled: currentMonthOffset <= 0
169
+ disabled: currentMonthOffset <= 0,
170
+ type: "button",
171
+ role: "button",
172
+ "aria-label": "Prev"
170
173
  }, /*#__PURE__*/React__default.createElement(ArrowNext, {
171
174
  className: clx(styles["month-control-prev-arrow"])
172
175
  })), /*#__PURE__*/React__default.createElement("button", {
173
176
  className: clx(styles["month-control"], styles["month-control-next"]),
174
177
  onClick: showNextMonth,
175
- disabled: currentMonthOffset >= 11
178
+ disabled: currentMonthOffset >= 11,
179
+ type: "button",
180
+ role: "button",
181
+ "aria-label": "Next"
176
182
  }, /*#__PURE__*/React__default.createElement(ArrowNext, {
177
183
  className: clx(styles["month-control-next-arrow"])
178
- }))), datePresets && ( /*#__PURE__*/React__default.createElement(Presets, {
184
+ }))), datePresets && (/*#__PURE__*/React__default.createElement(Presets, {
179
185
  presets: datePresets,
180
186
  onPresetSelect: handlePresetSelect
181
- })), withContinueButton && ( /*#__PURE__*/React__default.createElement(ContinueButton, {
187
+ })), withContinueButton && (/*#__PURE__*/React__default.createElement(ContinueButton, {
182
188
  isChanged: selectedDate !== initialSelectedDate || selectedPeriod !== initialSelectedPeriod,
183
189
  selectedDate: selectedDate,
184
190
  selectedPeriod: selectedPeriod,
@@ -42,7 +42,7 @@ var Checkbox = function Checkbox(_a) {
42
42
  }, label)));
43
43
  return /*#__PURE__*/React__default.createElement("div", {
44
44
  className: clx(styles.root)
45
- }, control, hint && ( /*#__PURE__*/React__default.createElement(Typography, {
45
+ }, control, hint && (/*#__PURE__*/React__default.createElement(Typography, {
46
46
  variant: isError ? "alert" : "secondary",
47
47
  tag: "span"
48
48
  }, hint)));
package/esm/Chip/index.js CHANGED
@@ -28,7 +28,7 @@ var Chip = function Chip(props) {
28
28
  onClick: onClick
29
29
  }, /*#__PURE__*/React__default.createElement("span", {
30
30
  className: clx("content-inner")
31
- }, children)), iconOnRight && ( /*#__PURE__*/React__default.createElement("span", {
31
+ }, children)), iconOnRight && (/*#__PURE__*/React__default.createElement("span", {
32
32
  className: clx("icon-right"),
33
33
  onClick: onIconOnRightClick || onClick
34
34
  }, iconOnRight))));
@@ -1,12 +1,13 @@
1
1
  import { __assign } from 'tslib';
2
2
  import React__default, { useState, useMemo, Children, useCallback, useEffect } from 'react';
3
+ import classNames from 'classnames/bind';
3
4
  import { usePopper } from 'react-popper';
4
- import classNames from 'classnames';
5
5
  import Portal from '../Portal/index.js';
6
6
  import { on } from '../helpers/on.js';
7
7
  import ClickOutside from '../ClickOutside/index.js';
8
- import dropDownStyles from './Dropdown.module.css';
8
+ import styles from './Dropdown.module.css';
9
9
 
10
+ var clx = classNames.bind(styles);
10
11
  var Dropdown = function Dropdown(_a) {
11
12
  var children = _a.children,
12
13
  zIndex = _a.zIndex,
@@ -112,12 +113,12 @@ var Dropdown = function Dropdown(_a) {
112
113
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(reference.type, __assign({
113
114
  ref: setControlElement,
114
115
  tabIndex: 0
115
- }, reference.props)), isVisible && ( /*#__PURE__*/React__default.createElement(Portal, null, /*#__PURE__*/React__default.createElement(ClickOutside, {
116
+ }, reference.props)), isVisible && (/*#__PURE__*/React__default.createElement(Portal, null, /*#__PURE__*/React__default.createElement(ClickOutside, {
116
117
  onClick: onClickOutside
117
118
  }, /*#__PURE__*/React__default.createElement("div", __assign({
118
119
  ref: setPopperElement,
119
- "data-component": "popper-container",
120
- className: classNames(dropDownStyles["popper-container"]),
120
+ "data-testid": "popper-container",
121
+ className: clx("popper-container"),
121
122
  style: __assign(__assign(__assign({}, styles.popper), {
122
123
  zIndex: zIndex,
123
124
  minWidth: controlElement === null || controlElement === void 0 ? void 0 : controlElement.offsetWidth
@@ -126,7 +127,8 @@ var Dropdown = function Dropdown(_a) {
126
127
  }),
127
128
  tabIndex: 0
128
129
  }, attributes.popper), /*#__PURE__*/React__default.createElement("div", {
129
- className: classNames(dropDownStyles["overlay-container"]),
130
+ "data-testid": "overlay-container",
131
+ className: clx("overlay-container"),
130
132
  onClick: onClickOverlay
131
133
  }, overlay))))));
132
134
  };
@@ -56,7 +56,7 @@ var InputRadio = /*#__PURE__*/memo(function (_a) {
56
56
  className: clx(styles.icon)
57
57
  }), /*#__PURE__*/React__default.createElement("span", {
58
58
  className: clx(styles.text)
59
- }, !children && text, !text && children)), !!note && ( /*#__PURE__*/React__default.createElement(Typography, {
59
+ }, !children && text, !text && children)), !!note && (/*#__PURE__*/React__default.createElement(Typography, {
60
60
  tag: "p",
61
61
  size: "s",
62
62
  className: clx(styles.note)
@@ -16,8 +16,9 @@ var MenuItem = /*#__PURE__*/forwardRef(function (_a, ref) {
16
16
  ref: ref,
17
17
  "data-component": "menu-item",
18
18
  style: {
19
- backgroundColor: isSelected ? "var(--palette-primary-1)" : ""
19
+ backgroundColor: isSelected ? "var(--palette-primary-1, rgb(232, 240, 254))" : "transparent"
20
20
  },
21
+ "data-testid": "menuitem",
21
22
  className: clx("item", (_b = {
22
23
  item_disabled: !!disabled
23
24
  }, _b["item_variant_".concat(variant)] = !!variant, _b), className),
package/esm/Menu/index.js CHANGED
@@ -11,7 +11,7 @@ var Menu = /*#__PURE__*/forwardRef(function (_a, ref) {
11
11
  children = _a.children;
12
12
  var renderChild = useMemo(function () {
13
13
  return Children.map(children, function (child) {
14
- if ( /*#__PURE__*/isValidElement(child)) {
14
+ if (/*#__PURE__*/isValidElement(child)) {
15
15
  var isSelected = selected ? selected.includes(String(child.key)) : undefined;
16
16
  var onClickHandler = function onClickHandler(e) {
17
17
  if (child.props.onClick) child.props.onClick(e);
@@ -47,11 +47,11 @@ var Modal = function Modal(_a) {
47
47
  "modal-wrapper_mobile": !isDesktop ? 1 : 0
48
48
  }, className),
49
49
  ref: modalRef
50
- }, title ? ( /*#__PURE__*/React__default.createElement("div", {
50
+ }, title ? (/*#__PURE__*/React__default.createElement("div", {
51
51
  className: clx("title-wrapper")
52
52
  }, /*#__PURE__*/React__default.createElement(Title, null, title), /*#__PURE__*/React__default.createElement(Close, {
53
53
  onClick: onCloseHandler
54
- }))) : ( /*#__PURE__*/React__default.createElement("div", {
54
+ }))) : (/*#__PURE__*/React__default.createElement("div", {
55
55
  className: clx("close-wrapper")
56
56
  }, /*#__PURE__*/React__default.createElement(Close, {
57
57
  onClick: onCloseHandler
@@ -29,9 +29,11 @@ var MenuOverlay = function MenuOverlay(_a) {
29
29
  if (!rootRef || !rootRef.current) {
30
30
  return;
31
31
  }
32
- rootRef.current.scrollTo({
33
- top: scrollView.top - OFFSET_ITEMS_COUNT * scrollView.height
34
- });
32
+ if (typeof rootRef.current.scrollTo === "function") {
33
+ rootRef.current.scrollTo({
34
+ top: scrollView.top - OFFSET_ITEMS_COUNT * scrollView.height
35
+ });
36
+ }
35
37
  }, [scrollView, rootRef]);
36
38
  return /*#__PURE__*/React__default.createElement("div", {
37
39
  ref: rootRef,
@@ -73,8 +73,8 @@ var Select = function Select(_a) {
73
73
  disabled: !!disabled
74
74
  }, /*#__PURE__*/React__default.createElement("div", {
75
75
  className: clx(styles["base-input"]),
76
- "data-component": "base-input"
77
- }, prepraredLabel !== null && prepraredLabel !== void 0 ? prepraredLabel : ( /*#__PURE__*/React__default.createElement("span", {
76
+ "data-testid": "base-input"
77
+ }, prepraredLabel !== null && prepraredLabel !== void 0 ? prepraredLabel : (/*#__PURE__*/React__default.createElement("span", {
78
78
  className: clx(styles.placeholder)
79
79
  }, placeholder))), /*#__PURE__*/React__default.createElement("input", {
80
80
  type: "hidden",
@@ -82,7 +82,7 @@ var Tooltip = function Tooltip(_a) {
82
82
  }, [update, visible]);
83
83
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(reference.type, __assign({
84
84
  ref: setControlElement
85
- }, reference.props)), visible && ( /*#__PURE__*/React__default.createElement(Portal, null, /*#__PURE__*/React__default.createElement(ClickOutside, {
85
+ }, reference.props)), visible && (/*#__PURE__*/React__default.createElement(Portal, null, /*#__PURE__*/React__default.createElement(ClickOutside, {
86
86
  onClick: onClickOutside
87
87
  }, /*#__PURE__*/React__default.createElement("div", __assign({
88
88
  className: clx("root", {
@@ -1,7 +1,6 @@
1
1
  import type { ReactNode } from "react";
2
2
  import type { PositioningStrategy } from "@popperjs/core";
3
3
  import type { Placement as PopperPlacement } from "@popperjs/core";
4
- export type Trigger = "hover";
5
4
  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">;
6
5
  export interface ITooltipProps {
7
6
  children: ReactNode;
@@ -14,12 +14,12 @@ var FormField = /*#__PURE__*/forwardRef(function (_a, ref) {
14
14
  return /*#__PURE__*/React__default.createElement("div", {
15
15
  className: clx(styles.container, className),
16
16
  ref: ref
17
- }, label && ( /*#__PURE__*/React__default.createElement(Typography, {
17
+ }, label && (/*#__PURE__*/React__default.createElement(Typography, {
18
18
  className: clx(styles.label, {
19
19
  label_required: !!required
20
20
  }),
21
21
  tag: "label"
22
- }, label)), children, hint && ( /*#__PURE__*/React__default.createElement(Typography, {
22
+ }, label)), children, hint && (/*#__PURE__*/React__default.createElement(Typography, {
23
23
  variant: error ? "alert" : "secondary",
24
24
  tag: "span"
25
25
  }, hint)));
@@ -17,7 +17,7 @@ var InputRoot = /*#__PURE__*/forwardRef(function (_a, ref) {
17
17
  return /*#__PURE__*/React__default.createElement("div", {
18
18
  ref: ref,
19
19
  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)
20
- }, startIcon && ( /*#__PURE__*/React__default.createElement("div", {
20
+ }, startIcon && (/*#__PURE__*/React__default.createElement("div", {
21
21
  className: clx(styles["base-icon"])
22
22
  }, startIcon)), children, endIcon && /*#__PURE__*/React__default.createElement("div", {
23
23
  className: clx(styles["base-icon"])
package/esm/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ export { default as Accordion } from "./Accordion";
1
2
  export { default as Avatar } from "./Avatar";
2
3
  export { default as Badge } from "./Badge";
3
4
  export { default as Button } from "./Button";
package/esm/index.js CHANGED
@@ -1,3 +1,4 @@
1
+ export { default as Accordion } from './Accordion/index.js';
1
2
  export { default as Avatar } from './Avatar/index.js';
2
3
  export { default as Badge } from './Badge/index.js';
3
4
  export { default as Button } from './Button/index.js';
package/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ export { default as Accordion } from "./Accordion";
1
2
  export { default as Avatar } from "./Avatar";
2
3
  export { default as Badge } from "./Badge";
3
4
  export { default as Button } from "./Button";
package/index.js CHANGED
@@ -1,34 +1,35 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./Avatar/index.js');
4
- var index$1 = require('./Badge/index.js');
5
- var index$2 = require('./Button/index.js');
6
- var index$3 = require('./Calendar/index.js');
7
- var index$4 = require('./Checkbox/index.js');
8
- var index$5 = require('./Chip/index.js');
9
- var index$6 = require('./Counter/index.js');
10
- var index$7 = require('./DotsLoader/index.js');
11
- var index$8 = require('./Dropdown/index.js');
12
- var index$9 = require('./Grid/index.js');
13
- var index$a = require('./Grid/Item/index.js');
14
- var index$b = require('./Image/index.js');
15
- var index$c = require('./Input/index.js');
16
- var index$d = require('./Menu/index.js');
17
- var index$e = require('./Menu/components/MenuItem/index.js');
18
- var index$f = require('./Modal/index.js');
19
- var index$g = require('./Portal/index.js');
20
- var index$h = require('./RadioGroup/index.js');
21
- var index$i = require('./Select/index.js');
22
- var index$j = require('./Separator/index.js');
23
- var index$k = require('./Skeleton/index.js');
24
- var index$l = require('./Switch/index.js');
25
- var index$m = require('./Theme/index.js');
26
- var index$n = require('./Tooltip/index.js');
27
- var index$o = require('./TimeSelect/index.js');
28
- var index$p = require('./Typography/index.js');
29
- var index$q = require('./hooks/useMediaSizes/index.js');
30
- var index$r = require('./hooks/useOnClickOutside/index.js');
31
- var index$s = require('./hooks/useScrollLock/index.js');
3
+ var index = require('./Accordion/index.js');
4
+ var index$1 = require('./Avatar/index.js');
5
+ var index$2 = require('./Badge/index.js');
6
+ var index$3 = require('./Button/index.js');
7
+ var index$4 = require('./Calendar/index.js');
8
+ var index$5 = require('./Checkbox/index.js');
9
+ var index$6 = require('./Chip/index.js');
10
+ var index$7 = require('./Counter/index.js');
11
+ var index$8 = require('./DotsLoader/index.js');
12
+ var index$9 = require('./Dropdown/index.js');
13
+ var index$a = require('./Grid/index.js');
14
+ var index$b = require('./Grid/Item/index.js');
15
+ var index$c = require('./Image/index.js');
16
+ var index$d = require('./Input/index.js');
17
+ var index$e = require('./Menu/index.js');
18
+ var index$f = require('./Menu/components/MenuItem/index.js');
19
+ var index$g = require('./Modal/index.js');
20
+ var index$h = require('./Portal/index.js');
21
+ var index$i = require('./RadioGroup/index.js');
22
+ var index$j = require('./Select/index.js');
23
+ var index$k = require('./Separator/index.js');
24
+ var index$l = require('./Skeleton/index.js');
25
+ var index$m = require('./Switch/index.js');
26
+ var index$n = require('./Theme/index.js');
27
+ var index$o = require('./Tooltip/index.js');
28
+ var index$p = require('./TimeSelect/index.js');
29
+ var index$q = require('./Typography/index.js');
30
+ var index$r = require('./hooks/useMediaSizes/index.js');
31
+ var index$s = require('./hooks/useOnClickOutside/index.js');
32
+ var index$t = require('./hooks/useScrollLock/index.js');
32
33
  require('./Icons/index.js');
33
34
  var ArrowNext = require('./Icons/ArrowNext.js');
34
35
  var Cart = require('./Icons/Cart.js');
@@ -48,36 +49,37 @@ var User = require('./Icons/User.js');
48
49
 
49
50
 
50
51
 
51
- exports.Avatar = index.default;
52
- exports.Badge = index$1.default;
53
- exports.Button = index$2.default;
54
- exports.Calendar = index$3.default;
55
- exports.Checkbox = index$4.default;
56
- exports.Chip = index$5.default;
57
- exports.Counter = index$6.default;
58
- exports.DotsLoader = index$7.default;
59
- exports.Dropdown = index$8.default;
60
- exports.Grid = index$9.default;
61
- exports.GridItem = index$a.default;
62
- exports.Image = index$b.default;
63
- exports.Input = index$c.default;
64
- exports.Menu = index$d.default;
65
- exports.MenuItem = index$e.default;
66
- exports.Modal = index$f.default;
67
- exports.Portal = index$g.default;
68
- exports.RadioGroup = index$h.default;
69
- exports.Select = index$i.default;
70
- exports.Separator = index$j.default;
71
- exports.SkeletonRect = index$k.SkeletonRect;
72
- exports.SkeletonText = index$k.SkeletonText;
73
- exports.Switch = index$l.default;
74
- exports.THEMES = index$m.THEMES;
75
- exports.Tooltip = index$n.default;
76
- exports.TimeSelect = index$o.default;
77
- exports.Typography = index$p.default;
78
- exports.useMediaSizes = index$q.default;
79
- exports.useOnClickOutside = index$r.default;
80
- exports.useScrollLock = index$s.default;
52
+ exports.Accordion = index.default;
53
+ exports.Avatar = index$1.default;
54
+ exports.Badge = index$2.default;
55
+ exports.Button = index$3.default;
56
+ exports.Calendar = index$4.default;
57
+ exports.Checkbox = index$5.default;
58
+ exports.Chip = index$6.default;
59
+ exports.Counter = index$7.default;
60
+ exports.DotsLoader = index$8.default;
61
+ exports.Dropdown = index$9.default;
62
+ exports.Grid = index$a.default;
63
+ exports.GridItem = index$b.default;
64
+ exports.Image = index$c.default;
65
+ exports.Input = index$d.default;
66
+ exports.Menu = index$e.default;
67
+ exports.MenuItem = index$f.default;
68
+ exports.Modal = index$g.default;
69
+ exports.Portal = index$h.default;
70
+ exports.RadioGroup = index$i.default;
71
+ exports.Select = index$j.default;
72
+ exports.Separator = index$k.default;
73
+ exports.SkeletonRect = index$l.SkeletonRect;
74
+ exports.SkeletonText = index$l.SkeletonText;
75
+ exports.Switch = index$m.default;
76
+ exports.THEMES = index$n.THEMES;
77
+ exports.Tooltip = index$o.default;
78
+ exports.TimeSelect = index$p.default;
79
+ exports.Typography = index$q.default;
80
+ exports.useMediaSizes = index$r.default;
81
+ exports.useOnClickOutside = index$s.default;
82
+ exports.useScrollLock = index$t.default;
81
83
  exports.ArrowNext = ArrowNext.default;
82
84
  exports.Cart = Cart.default;
83
85
  exports.Chevron = Chevron.default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "colibri-ui",
3
- "version": "0.7.79",
3
+ "version": "0.7.80",
4
4
  "description": "React UI components library",
5
5
  "main": "index.js",
6
6
  "scripts": {},