@sima-land/ui-nucleons 44.2.9 → 45.0.0-alpha.0

package/card/slots.d.ts

@@ -7,21 +7,35 @@ export interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
 /**
  * Компонент слота "шапки" карточки.
  * @param props Свойства.
+ * @deprecated Нужно использовать TopBar.
  * @return Элемент.
  */
-export declare const CardHeader: React.FC<CardHeaderProps>;
+export declare function CardHeader({ children, divided }: CardHeaderProps): JSX.Element;
+export declare namespace CardHeader {
+    var displayName: string;
+}
+export interface CardContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    scrollableRef?: React.Ref<HTMLDivElement>;
+}
 /**
  * Компонент слота основного контента карточки.
  * @param props Свойства.
  * @return Элемент.
  */
-export declare const CardContent: React.FC<React.HTMLAttributes<HTMLDivElement>>;
+export declare function CardContent({ children, className, scrollableRef, ...restProps }: CardContentProps): JSX.Element;
+export declare namespace CardContent {
+    var displayName: string;
+}
 export interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {
     divided?: boolean;
 }
 /**
  * Компонент слота "подвала" карточки.
  * @param props Свойства.
+ * @deprecated Нужно использовать BottomBar.
  * @return Элемент.
  */
-export declare const CardFooter: React.FC<CardFooterProps>;
+export declare function CardFooter({ children, divided, className, ...restProps }: CardFooterProps): JSX.Element;
+export declare namespace CardFooter {
+    var displayName: string;
+}

package/card/slots.js

@@ -48,37 +48,39 @@ const utils_1 = require("./utils");
 /**
  * Компонент слота "шапки" карточки.
  * @param props Свойства.
+ * @deprecated Нужно использовать TopBar.
  * @return Элемент.
  */
-const CardHeader = ({ children, divided }) => {
+function CardHeader({ children, divided }) {
     const { rounds } = (0, react_1.useContext)(utils_1.CardContext);
     return (react_1.default.createElement("div", { className: (0, classnames_1.default)(divided && borders_1.InnerBorder.bottom) }, (0, react_1.isValidElement)(children) && children.type === top_bar_1.TopBar
         ? (0, react_1.cloneElement)(children, {
             className: (0, classnames_1.default)(children.props.className, divided && borders_1.InnerBorder.bottom, rounds === 's' && shapes_1.SmallRounds.top, rounds === 'm' && shapes_1.MediumRounds.top),
         })
         : children));
-};
+}
 exports.CardHeader = CardHeader;
-exports.CardHeader.displayName = 'Card.Header';
+CardHeader.displayName = 'Card.Header';
 /**
  * Компонент слота основного контента карточки.
  * @param props Свойства.
  * @return Элемент.
  */
-const CardContent = (_a) => {
-    var { className } = _a, restProps = __rest(_a, ["className"]);
-    return react_1.default.createElement("div", Object.assign({}, restProps, { className: (0, classnames_1.default)(card_module_scss_1.default.content, className) }));
-};
+function CardContent(_a) {
+    var { children, className, scrollableRef } = _a, restProps = __rest(_a, ["children", "className", "scrollableRef"]);
+    return (react_1.default.createElement("div", Object.assign({}, restProps, { ref: scrollableRef, className: (0, classnames_1.default)(card_module_scss_1.default.content, className) }), children));
+}
 exports.CardContent = CardContent;
-exports.CardContent.displayName = 'Card.Content';
+CardContent.displayName = 'Card.Content';
 /**
  * Компонент слота "подвала" карточки.
  * @param props Свойства.
+ * @deprecated Нужно использовать BottomBar.
  * @return Элемент.
  */
-const CardFooter = (_a) => {
-    var { divided, className } = _a, restProps = __rest(_a, ["divided", "className"]);
-    return (react_1.default.createElement("div", Object.assign({}, restProps, { className: (0, classnames_1.default)(className, divided && borders_1.InnerBorder.top) })));
-};
+function CardFooter(_a) {
+    var { children, divided, className } = _a, restProps = __rest(_a, ["children", "divided", "className"]);
+    return (react_1.default.createElement("div", Object.assign({}, restProps, { className: (0, classnames_1.default)(className, divided && borders_1.InnerBorder.top) }), children));
+}
 exports.CardFooter = CardFooter;
-exports.CardFooter.displayName = 'Card.Footer';
+CardFooter.displayName = 'Card.Footer';

package/carousel/draggable.d.ts

@@ -8,11 +8,11 @@ export interface Control {
     toggleTransition: typeof Draggable.prototype.toggleTransition;
     isTransitionEnabled: () => boolean;
 }
-export declare type Delta2d = {
+export type Delta2d = {
     dx: number;
     dy: number;
 };
-export declare type DraggableEventHandler = (e: DraggableEvent) => void;
+export type DraggableEventHandler = (e: DraggableEvent) => void;
 export interface DraggableProps {
     axis?: 'x' | 'y';
     active?: boolean;
@@ -26,7 +26,7 @@ export interface DraggableProps {
 /**
  * Компонент области, которую можно прокручивать перетаскиванием.
  */
-export default class Draggable extends Component<DraggableProps> {
+export declare class Draggable extends Component<DraggableProps> {
     isGrabbed: boolean;
     hasTransition: boolean;
     needPreventClick: boolean;
@@ -121,3 +121,7 @@ export default class Draggable extends Component<DraggableProps> {
      */
     render(): JSX.Element;
 }
+/**
+ * @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
+ */
+export default Draggable;

package/carousel/draggable.js

@@ -26,6 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.Draggable = void 0;
 const react_1 = __importStar(require("react"));
 const point_1 = __importDefault(require("../helpers/point"));
 const draggable_event_1 = __importDefault(require("./helpers/draggable-event"));
@@ -126,6 +127,7 @@ class Draggable extends react_1.Component {
      * @param event Событие передвижения.
      */
     handleMove(event) {
+        var _a;
         const { axis, onDragMove } = this.props;
         if (this.isGrabbed) {
             const { x, y } = this.currentOffset;
@@ -136,11 +138,12 @@ class Draggable extends react_1.Component {
                 offset: (0, point_1.default)(x, y),
                 client: (0, events_1.getEventClientPos)(event),
             });
-            this.togglePreventClickNeed(true);
-            // prevent selection
             if (!(0, events_1.isTouchEvent)(event)) {
+                // предотвращаем выделение текста на странице
                 event.preventDefault();
-                window.getSelection().removeAllRanges();
+                (_a = window.getSelection()) === null || _a === void 0 ? void 0 : _a.removeAllRanges();
+                // предотвращаем клик только на НЕ touch-устройствах тк на них срабатывает клик при перетаскивании
+                this.togglePreventClickNeed(true);
             }
             onDragMove && onDragMove(customEvent);
             if (!customEvent.prevented) {
@@ -259,4 +262,8 @@ class Draggable extends react_1.Component {
                 }, className: cx('draggable'), children: children })));
     }
 }
+exports.Draggable = Draggable;
+/**
+ * @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
+ */
 exports.default = Draggable;

package/carousel/helpers/draggable-event.d.ts

@@ -6,7 +6,7 @@ interface Data {
 /**
  * Нестандартное событие перетаскивания.
  */
-export default class DraggableEvent implements Data {
+export declare class DraggableEvent implements Data {
     prevented: boolean;
     offset: IPoint;
     client: IPoint;
@@ -22,4 +22,7 @@ export default class DraggableEvent implements Data {
      */
     preventDefault(): void;
 }
-export {};
+/**
+ * @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
+ */
+export default DraggableEvent;

package/carousel/helpers/draggable-event.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.DraggableEvent = void 0;
 /**
  * Нестандартное событие перетаскивания.
  */
@@ -22,4 +23,8 @@ class DraggableEvent {
         this.prevented = true;
     }
 }
+exports.DraggableEvent = DraggableEvent;
+/**
+ * @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
+ */
 exports.default = DraggableEvent;

package/carousel/index.d.ts

@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import { Control } from './draggable';
 import { IPoint } from '../helpers/point';
 import { ArrowButtonProps } from '../arrow-button';
-import DraggableEvent from './helpers/draggable-event';
+import { DraggableEvent } from './helpers/draggable-event';
 export interface CarouselProps {
     /** Список элементов. */
     items?: any[];

package/carousel/index.js

@@ -28,18 +28,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Carousel = void 0;
 const react_1 = __importStar(require("react"));
-const draggable_1 = __importDefault(require("./draggable"));
+const draggable_1 = require("./draggable");
 const lodash_1 = require("lodash");
 const fp_1 = require("lodash/fp");
-const bounds_of_1 = __importDefault(require("../helpers/bounds-of"));
-const point_1 = __importDefault(require("../helpers/point"));
-const max_index_of_1 = __importDefault(require("../helpers/max-index-of"));
-const get_relative_pos_1 = __importDefault(require("../helpers/get-relative-pos"));
-const find_child_element_1 = __importDefault(require("../helpers/find-child-element"));
+const bounds_of_1 = require("../helpers/bounds-of");
+const point_1 = require("../helpers/point");
+const max_index_of_1 = require("../helpers/max-index-of");
+const get_relative_pos_1 = require("../helpers/get-relative-pos");
+const find_child_element_1 = require("../helpers/find-child-element");
 const arrow_button_1 = require("../arrow-button");
+const is_browser_1 = require("../helpers/is-browser");
 const bind_1 = __importDefault(require("classnames/bind"));
 const carousel_module_scss_1 = __importDefault(require("./carousel.module.scss"));
-const is_browser_1 = __importDefault(require("../helpers/is-browser"));
 const CLONE_FACTOR = 3;
 const cx = bind_1.default.bind(carousel_module_scss_1.default);
 const isAuto = (0, fp_1.eq)('auto');
@@ -57,8 +57,8 @@ class Carousel extends react_1.Component {
         super(props);
         // state & data
         this.infinite = Boolean(infinite);
-        this.dragStartClient = (0, point_1.default)();
-        this.dragStartOffset = (0, point_1.default)();
+        this.dragStartClient = (0, point_1.Point)();
+        this.dragStartOffset = (0, point_1.Point)();
         this.currentIndex = (0, lodash_1.inRange)(targetIndex, (0, lodash_1.size)(items)) ? targetIndex : 0;
         this.state = {
             currentOffset: 0,
@@ -116,8 +116,8 @@ class Carousel extends react_1.Component {
         let checker = () => false;
         if (viewport) {
             checker = vertical
-                ? (sibling) => (0, bounds_of_1.default)(sibling).top >= viewport.top
-                : (sibling) => (0, bounds_of_1.default)(sibling).left >= viewport.left;
+                ? (sibling) => (0, bounds_of_1.boundsOf)(sibling).top >= viewport.top
+                : (sibling) => (0, bounds_of_1.boundsOf)(sibling).left >= viewport.left;
         }
         return checker;
     }
@@ -136,8 +136,8 @@ class Carousel extends react_1.Component {
         let checker = () => false;
         if (viewport) {
             checker = vertical
-                ? (sibling) => viewport.top < (0, bounds_of_1.default)(sibling)[verticalBoundKey]
-                : (sibling) => viewport.left < (0, bounds_of_1.default)(sibling)[horizontalBoundKey];
+                ? (sibling) => viewport.top < (0, bounds_of_1.boundsOf)(sibling)[verticalBoundKey]
+                : (sibling) => viewport.left < (0, bounds_of_1.boundsOf)(sibling)[horizontalBoundKey];
         }
         return checker;
     }
@@ -278,7 +278,7 @@ class Carousel extends react_1.Component {
         this.toggleDragTransition(true);
         this.setCurrentIndex(newIndex < (0, lodash_1.size)((_a = this.listElement) === null || _a === void 0 ? void 0 : _a.children)
             ? newIndex
-            : (0, max_index_of_1.default)((_b = this.listElement) === null || _b === void 0 ? void 0 : _b.children));
+            : (0, max_index_of_1.maxIndexOf)((_b = this.listElement) === null || _b === void 0 ? void 0 : _b.children));
     }
     /**
      * По возможности выполняет прокрутку карусели назад.
@@ -292,7 +292,7 @@ class Carousel extends react_1.Component {
      * @param step На сколько элементов надо прокрутить карусель.
      */
     moveBackwardFinite(step) {
-        const newIndex = (0, find_child_element_1.default)({
+        const newIndex = (0, find_child_element_1.findChildIndex)({
             target: this.listElement,
             startIndex: this.currentIndex,
             defaultResult: this.currentIndex,
@@ -369,7 +369,7 @@ class Carousel extends react_1.Component {
         const lastItem = (_a = this.listElement) === null || _a === void 0 ? void 0 : _a.lastElementChild;
         if (viewport && listEl && lastItem) {
             const offsetValue = offset[vertical ? 'y' : 'x'];
-            const lastItemStartBound = (_b = (0, bounds_of_1.default)(lastItem)) === null || _b === void 0 ? void 0 : _b[vertical ? 'top' : 'left'];
+            const lastItemStartBound = (_b = (0, bounds_of_1.boundsOf)(lastItem)) === null || _b === void 0 ? void 0 : _b[vertical ? 'top' : 'left'];
             const viewportStartBound = viewport[vertical ? 'top' : 'left'];
             const viewportEndBound = viewport[vertical ? 'bottom' : 'right'];
             const itemsSize = listEl[vertical ? 'scrollHeight' : 'scrollWidth'] / CLONE_FACTOR;
@@ -398,7 +398,7 @@ class Carousel extends react_1.Component {
             const index = this.infinite ? (0, lodash_1.size)(items) : 0;
             const firstNotCloneItem = this.listElement.children[index];
             if (firstNotCloneItem) {
-                result = (0, bounds_of_1.default)(firstNotCloneItem)[vertical ? 'top' : 'left'];
+                result = (0, bounds_of_1.boundsOf)(firstNotCloneItem)[vertical ? 'top' : 'left'];
             }
         }
         return result;
@@ -411,10 +411,10 @@ class Carousel extends react_1.Component {
         const { dragStartOffset: startOffset, dragStartClient: startClient } = this;
         if (this.listElement && !(0, lodash_1.isEqual)(startOffset, endOffset)) {
             const { backward } = this.defineDirection(startClient, endClient);
-            const lastIndex = (0, max_index_of_1.default)(this.listElement.children);
+            const lastIndex = (0, max_index_of_1.maxIndexOf)(this.listElement.children);
             const edgeIndex = backward ? 0 : lastIndex;
             // ищем элемент, который находится ближе всего к начальной границе viewport'а
-            const newIndex = (0, find_child_element_1.default)({
+            const newIndex = (0, find_child_element_1.findChildIndex)({
                 target: this.listElement,
                 startIndex: backward ? lastIndex : 0,
                 increment: backward ? -1 : +1,
@@ -475,7 +475,7 @@ class Carousel extends react_1.Component {
             }
             else {
                 const { vertical } = this.props;
-                const targetItemPos = (0, get_relative_pos_1.default)(targetItemEl);
+                const targetItemPos = (0, get_relative_pos_1.getRelativePos)(targetItemEl);
                 const viewportEndBound = vertical ? viewport.bottom : viewport.right;
                 const nextItemsEndBound = vertical
                     ? viewport.top + listEl.scrollHeight - targetItemPos.y
@@ -532,8 +532,8 @@ class Carousel extends react_1.Component {
             const firstChild = listEl.children[0];
             const lastChild = listEl.children[(0, lodash_1.size)(items) - 1];
             if (firstChild && lastChild) {
-                const startBound = (0, bounds_of_1.default)(firstChild)[vertical ? 'top' : 'left'];
-                const endBound = (0, bounds_of_1.default)(lastChild)[vertical ? 'bottom' : 'right'];
+                const startBound = (0, bounds_of_1.boundsOf)(firstChild)[vertical ? 'top' : 'left'];
+                const endBound = (0, bounds_of_1.boundsOf)(lastChild)[vertical ? 'bottom' : 'right'];
                 result = endBound - startBound;
             }
         }
@@ -553,7 +553,7 @@ class Carousel extends react_1.Component {
      * @return Данные прямоугольной области видимости карусели.
      */
     getViewport() {
-        return (0, is_browser_1.default)() ? (0, bounds_of_1.default)(this.wrapperRef.current) : null;
+        return (0, is_browser_1.isBrowser)() ? (0, bounds_of_1.boundsOf)(this.wrapperRef.current) : null;
     }
     /**
      * Сохраняет смещение карусели и позицию из события при старте захвата.
@@ -595,7 +595,7 @@ class Carousel extends react_1.Component {
             }, onMouseLeave: () => {
                 autoplay && autoplayHoverPause && !this.isGrabbed() && this.toggleAutoMove(true);
             } }),
-            react_1.default.createElement(draggable_1.default, { active: this.canDrag(), axis: vertical ? 'y' : 'x', transitionDuration: 320, containerProps: Object.assign(Object.assign({}, viewportElementProps), { ref: this.wrapperRef, className: cx('full-size', viewportElementProps.className) }), takeControl: this.takeDragControl, onDragStart: this.onDragStart, onDragMove: this.onDragMove, onDragEnd: this.onDragEnd, children: react_1.default.createElement("div", { className: cx(['carousel-items-container', vertical && 'vertical']), ref: this.containerRef, children: this.renderItems() }) }),
+            react_1.default.createElement(draggable_1.Draggable, { active: this.canDrag(), axis: vertical ? 'y' : 'x', transitionDuration: 320, containerProps: Object.assign(Object.assign({}, viewportElementProps), { ref: this.wrapperRef, className: cx('full-size', viewportElementProps.className) }), takeControl: this.takeDragControl, onDragStart: this.onDragStart, onDragMove: this.onDragMove, onDragEnd: this.onDragEnd, children: react_1.default.createElement("div", { className: cx(['carousel-items-container', vertical && 'vertical']), ref: this.containerRef, children: this.renderItems() }) }),
             needShowControls && (react_1.default.createElement(react_1.default.Fragment, null,
                 renderControl({
                     type: 'backward',

package/checkbox/checkbox.module.scss

@@ -3,6 +3,7 @@
 .root {
   position: relative;
   display: inline-block;
+  vertical-align: -0.125em; // не понятно почему, но это значение ставит блок ровно по середине строки
   width: 16px;
   height: 16px;
   svg {
@@ -19,6 +20,7 @@
   opacity: 0;
   margin: 0;
   padding: 0;
+  cursor: pointer;
   &:not(:checked) + svg .mark {
     display: none;
   }

package/checkbox/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { CheckboxProps } from '../_internal/checkbox';
-export type { CheckboxProps };
+import { CheckboxInputProps } from '../types';
+export type CheckboxProps = CheckboxInputProps;
 /**
  * Компонент стилизованного переключателя (input[type=checkbox]).
  */
-export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
+export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxInputProps & React.RefAttributes<HTMLInputElement>>;

package/checkbox-field/index.d.ts

@@ -13,4 +13,7 @@ export interface CheckboxFieldProps extends React.InputHTMLAttributes<HTMLInputE
     /** Идентификатор для систем автоматизированного тестирования. */
     'data-testid'?: string;
 }
+/**
+ * @deprecated Теперь можно использовать SwitcherRow.
+ */
 export declare const CheckboxField: React.ForwardRefExoticComponent<CheckboxFieldProps & React.RefAttributes<HTMLInputElement | null>>;

package/checkbox-field/index.js

@@ -44,6 +44,9 @@ const toggle_1 = require("../toggle");
 const bind_1 = __importDefault(require("classnames/bind"));
 const checkbox_field_module_scss_1 = __importDefault(require("./checkbox-field.module.scss"));
 const cx = bind_1.default.bind(checkbox_field_module_scss_1.default);
+/**
+ * @deprecated Теперь можно использовать SwitcherRow.
+ */
 exports.CheckboxField = (0, react_1.forwardRef)(function CheckboxField(_a, ref) {
     var { smallText, fieldView = 'checkbox', label, info, failed, 'data-testid': testId = 'checkbox-field', style, className, 
     // input props

package/clean-buttons/clean-buttons-util.scss

@@ -0,0 +1,15 @@
+$size-s-height: 64px;
+$size-m-height: 72px;
+$size-l-height: 80px;
+
+@mixin size-s {
+  --clean-group-height: #{$size-s-height};
+}
+
+@mixin size-m {
+  --clean-group-height: #{$size-m-height};
+}
+
+@mixin size-l {
+  --clean-group-height: #{$size-l-height};
+}

package/clean-buttons/clean-buttons.module.scss

@@ -1,4 +1,5 @@
 @use '../colors';
+@use './clean-buttons-util';
 
 .group {
   display: flex;
@@ -27,16 +28,17 @@
   font-size: 16px;
   line-height: 24px;
   overflow: hidden;
+  height: var(--clean-group-height);
 }
 
 .size-s {
-  height: 64px;
+  @include clean-buttons-util.size-s;
 }
 
 .size-m {
-  height: 72px;
+  @include clean-buttons-util.size-m;
 }
 
 .size-l {
-  height: 80px;
+  @include clean-buttons-util.size-l;
 }

package/clean-buttons/index.d.ts

@@ -1,24 +1,33 @@
-import React from 'react';
+import { ReactNode } from 'react';
 import { LinkProps } from '../link';
 import { CleanButtonSize } from './types';
 export interface CleanButtonProps extends LinkProps {
     asLink?: boolean;
     /** Размер (высота). */
-    size?: CleanButtonSize;
+    size?: CleanButtonSize | 'unset';
 }
 export interface CleanGroupProps {
     /** Размер (высота). */
-    size?: CleanButtonSize;
+    size?: CleanButtonSize | 'unset';
     /** Содержимое. */
-    children?: React.ReactNode;
+    children?: ReactNode;
 }
 /**
  * Компонент группы прозрачных кнопок.
  * @param props Свойства.
  * @return Элемент.
  */
-export declare const CleanGroup: React.FC<CleanGroupProps>;
+export declare function CleanGroup({ size: sizeFromProps, children }: CleanGroupProps): JSX.Element;
+/**
+ * Компонент прозрачной кнопки.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+export declare function CleanButton({ size, href, asLink, 'data-testid': testId, children, className, ...rest }: CleanButtonProps): JSX.Element;
+/**
+ * @deprecated Нужно использовать `import { CleanGroup, CleanButton }`.
+ */
 export declare const Clean: {
-    Group: React.FC<CleanGroupProps>;
-    Button: ({ size, href, asLink, ...restProps }: CleanButtonProps) => JSX.Element;
+    Group: typeof CleanGroup;
+    Button: typeof CleanButton;
 };

package/clean-buttons/index.js

@@ -37,35 +37,38 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Clean = exports.CleanGroup = void 0;
+exports.Clean = exports.CleanButton = exports.CleanGroup = void 0;
 const react_1 = __importStar(require("react"));
-const bind_1 = __importDefault(require("classnames/bind"));
 const link_1 = require("../link");
-const clean_buttons_module_scss_1 = __importDefault(require("./clean-buttons.module.scss"));
 const utils_1 = require("./utils");
+const bind_1 = __importDefault(require("classnames/bind"));
+const clean_buttons_module_scss_1 = __importDefault(require("./clean-buttons.module.scss"));
 const cx = bind_1.default.bind(clean_buttons_module_scss_1.default);
 /**
  * Компонент группы прозрачных кнопок.
  * @param props Свойства.
  * @return Элемент.
  */
-const CleanGroup = ({ size: sizeFromProps, children }) => {
+function CleanGroup({ size: sizeFromProps, children }) {
     const sizeFromContext = (0, react_1.useContext)(utils_1.CleanGroupSizeContext);
     // значение из пропсов имеет приоритет
     const size = sizeFromProps || sizeFromContext;
-    return (react_1.default.createElement("div", { className: cx('group') }, react_1.Children.toArray(children).map(item => (0, react_1.isValidElement)(item) && item.type === CleanButton ? (0, react_1.cloneElement)(item, { size }) : null)));
-};
+    return (react_1.default.createElement("div", { className: cx('group') }, react_1.Children.toArray(children).map(item => (0, react_1.isValidElement)(item) && item.type === CleanButton
+        ? (0, react_1.cloneElement)(item, { size })
+        : null)));
+}
 exports.CleanGroup = CleanGroup;
 /**
  * Компонент прозрачной кнопки.
  * @param props Свойства.
  * @return Элемент.
  */
-const CleanButton = (_a) => {
-    var { size = 's', href, asLink = Boolean(href) } = _a, restProps = __rest(_a, ["size", "href", "asLink"]);
-    return (react_1.default.createElement(link_1.Link, Object.assign({ pseudo: !asLink, className: cx('button', `size-${size}`), href: href }, restProps)));
-};
-exports.Clean = {
-    Group: exports.CleanGroup,
-    Button: CleanButton,
-};
+function CleanButton(_a) {
+    var { size = 's', href, asLink = Boolean(href), 'data-testid': testId = 'clean-button', children, className } = _a, rest = __rest(_a, ["size", "href", "asLink", 'data-testid', "children", "className"]);
+    return (react_1.default.createElement(link_1.Link, Object.assign({}, rest, { className: cx('button', `size-${size}`, className), pseudo: !asLink, href: href, "data-testid": testId }), children));
+}
+exports.CleanButton = CleanButton;
+/**
+ * @deprecated Нужно использовать `import { CleanGroup, CleanButton }`.
+ */
+exports.Clean = { Group: CleanGroup, Button: CleanButton };

package/clean-buttons/types.d.ts

@@ -1,4 +1,4 @@
 /**
  * Размер прозрачных кнопок (высота) по дизайн-гайдам.
  */
-export declare type CleanButtonSize = 's' | 'm' | 'l';
+export type CleanButtonSize = 's' | 'm' | 'l';

package/clean-buttons/utils.d.ts

@@ -1,3 +1,7 @@
 /// <reference types="react" />
 import { CleanButtonSize } from './types';
-export declare const CleanGroupSizeContext: import("react").Context<CleanButtonSize | undefined>;
+/**
+ * Контекст установки размера группы прозрачных кнопок CleanGroup.
+ * Размер заданный непосредственно компоненту CleanGroup имеет приоритет над контекстом.
+ */
+export declare const CleanGroupSizeContext: import("react").Context<"unset" | CleanButtonSize | undefined>;

package/clean-buttons/utils.js

@@ -2,4 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CleanGroupSizeContext = void 0;
 const react_1 = require("react");
+/**
+ * Контекст установки размера группы прозрачных кнопок CleanGroup.
+ * Размер заданный непосредственно компоненту CleanGroup имеет приоритет над контекстом.
+ */
 exports.CleanGroupSizeContext = (0, react_1.createContext)(undefined);

package/{colors.d.ts → colors/index.d.ts}

@@ -36,6 +36,6 @@ declare const collection: {
     readonly 'additional-deep-blue': "#00599d";
     readonly 'additional-dark-blue': "#002b41";
 };
-export declare type Token = keyof typeof collection;
+export type Token = keyof typeof collection;
 export declare const COLORS: Map<"basic-blue" | "basic-gray87" | "basic-gray76" | "basic-gray66" | "basic-gray54" | "basic-gray38" | "basic-gray24" | "basic-gray12" | "basic-gray8" | "basic-gray4" | "basic-gray2" | "basic-white" | "additional-deep-red" | "additional-red" | "additional-light-red" | "additional-teal" | "additional-green" | "additional-light-green" | "additional-lime" | "additional-faded-green" | "additional-pink" | "additional-purple" | "additional-violet" | "additional-deep-purple" | "additional-electric-blue" | "additional-light-blue" | "additional-cyan" | "additional-sky" | "additional-deep-orange" | "additional-amber" | "additional-yellow" | "additional-gold" | "additional-brown" | "additional-blue-gray" | "additional-deep-blue" | "additional-dark-blue", string>;
 export {};

package/dot-nav/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare type DotNavSize = 's' | 'l';
+export type DotNavSize = 's' | 'l';
 export interface DotNavProps {
     /** Индекс выбранной точки. */
     current?: number;

package/dropdown/index.d.ts

@@ -4,6 +4,7 @@ interface DropdownStyle extends React.CSSProperties {
     '--dropdown-max-height'?: string;
 }
 export interface DropdownProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'style'> {
+    /** Стили. */
     style?: DropdownStyle;
     /** Идентификатор для систем автоматизированного тестирования. */
     'data-testid'?: string;

package/dropdown/utils.d.ts

@@ -0,0 +1,19 @@
+import { UseFloatingProps, UseFloatingReturn } from '@floating-ui/react';
+/**
+ * Возвращает конфигурацию для `useFloating` по дизайн-гайдам.
+ * @return Конфигурация для `useFloating` по дизайн-гайдам.
+ */
+export declare function dropdownFloatingConfig(): Partial<UseFloatingProps>;
+/**
+ * Возвращает стили для элемента с учетом "слоя".
+ * @param floating Результат вызова useFloating.
+ * @return Стили для элемента с учетом "слоя".
+ */
+export declare function useDropdownFloatingStyle({ strategy, x, y, refs, }: Pick<UseFloatingReturn, 'strategy' | 'x' | 'y' | 'refs'>): {
+    position: import("@floating-ui/react").Strategy;
+    top: number;
+    left: number;
+    minWidth: string | undefined;
+    zIndex: number;
+    '--opener-width': string | undefined;
+};