@sima-land/ui-nucleons 45.0.0-alpha.5 → 45.0.0-alpha.51

package/dot-nav/index.js

@@ -1,60 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DotNav = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const lodash_1 = require("lodash");
-const bind_1 = __importDefault(require("classnames/bind"));
-const dot_nav_module_scss_1 = __importDefault(require("./dot-nav.module.scss"));
-const cx = bind_1.default.bind(dot_nav_module_scss_1.default);
-/**
- * Компонент точек навигации для каруселей и слайдеров.
- * @param props Свойства.
- * @return Элемент.
- */
-function DotNav({ size = 's', current = 0, total = 1, onSelect }) {
-    const withShift = total > 4;
-    const itemSize = 14;
-    const itemGutter = { s: 0, l: 6 }[size];
-    const maxWidth = itemSize * 5 + itemGutter * 4;
-    const totalWidth = itemSize * total + itemGutter * (total - 1);
-    const shift = useShift(current, total);
-    const correction = withShift ? itemSize + itemGutter : (maxWidth - totalWidth) / 2;
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('root', `size-${size}`), style: { width: maxWidth, height: itemSize } }, { children: (0, lodash_1.times)(total).map(index => {
-            const position = index - shift + 1;
-            return ((0, jsx_runtime_1.jsx)("div", { style: {
-                    left: `${correction + (index - shift) * (itemSize + itemGutter)}px`,
-                }, onClick: () => onSelect === null || onSelect === void 0 ? void 0 : onSelect(index), className: cx('item', index === current && 'active', withShift && (position <= 0 || position >= 4) && 'distant') }, index));
-        }) })));
-}
-exports.DotNav = DotNav;
-/**
- * Определяет необходимое для точек навигации смещение.
- * @param current Индекс выбранной точки.
- * @param total Количество точек.
- * @return Смещение.
- */
-function useShift(current, total) {
-    const shiftRef = (0, react_1.useRef)(0);
-    const prevCurrentRef = (0, react_1.useRef)(0);
-    if (total > 4) {
-        const currentPos = current - shiftRef.current;
-        const prevCurrent = prevCurrentRef.current;
-        const prevCurrentPos = prevCurrent - shiftRef.current;
-        let newShift = shiftRef.current;
-        if (currentPos > 2) {
-            const correction = Math.max(prevCurrentPos, 2) + shiftRef.current - prevCurrent;
-            newShift += current - prevCurrent - correction;
-        }
-        else if (currentPos < 0) {
-            const correction = Math.min(prevCurrentPos, 0) + shiftRef.current - prevCurrent;
-            newShift -= prevCurrent - current + correction;
-        }
-        shiftRef.current = newShift;
-    }
-    prevCurrentRef.current = current;
-    return shiftRef.current;
-}

package/dropdown/dropdown.module.scss

@@ -1,13 +0,0 @@
-.root {
-  background: #fff;
-  outline: 0;
-  padding: 8px 0;
-
-  // задавать можно только максимальную высоту через --dropdown-max-height
-  max-height: var(--dropdown-max-height, 304px) !important;
-  height: auto !important;
-}
-
-.inner {
-  max-height: calc(var(--dropdown-max-height, 304px) - 16px); // вычитаем padding корневого элемента
-}

package/dropdown/index.d.ts

@@ -1,18 +0,0 @@
-/// <reference types="react" />
-import { CustomScrollbarProps } from '../_internal/custom-scrollbar';
-interface DropdownStyle extends React.CSSProperties {
-    '--dropdown-max-height'?: string;
-}
-export interface DropdownProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'style'> {
-    /** Стили. */
-    style?: DropdownStyle;
-    /** Идентификатор для систем автоматизированного тестирования. */
-    'data-testid'?: string;
-    /** Свойства компонента CustomScrollbar. */
-    customScrollbarProps?: Omit<CustomScrollbarProps, 'className' | 'overflow' | 'children'>;
-}
-/**
- * Компонент выпадающего блока с контентом, например списком.
- */
-export declare const Dropdown: import("react").ForwardRefExoticComponent<DropdownProps & import("react").RefAttributes<HTMLDivElement | null>>;
-export {};

package/dropdown/index.js

@@ -1,32 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Dropdown = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const shadows_1 = require("../styling/shadows");
-const shapes_1 = require("../styling/shapes");
-const custom_scrollbar_1 = require("../_internal/custom-scrollbar");
-const bind_1 = __importDefault(require("classnames/bind"));
-const dropdown_module_scss_1 = __importDefault(require("./dropdown.module.scss"));
-const cx = bind_1.default.bind(dropdown_module_scss_1.default);
-/**
- * Компонент выпадающего блока с контентом, например списком.
- */
-exports.Dropdown = (0, react_1.forwardRef)(function Dropdown(_a, ref) {
-    var { className, children, 'data-testid': testId = 'dropdown', customScrollbarProps } = _a, restProps = __rest(_a, ["className", "children", 'data-testid', "customScrollbarProps"]);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, className: cx('root', className, shadows_1.BoxShadow.z4, shapes_1.MediumRounds.all) }, restProps, { "data-testid": testId }, { children: (0, jsx_runtime_1.jsx)(custom_scrollbar_1.CustomScrollbar, Object.assign({}, customScrollbarProps, { className: cx('inner'), overflow: { x: 'h', y: 's' } }, { children: children })) })));
-});

package/dropdown/utils.d.ts

@@ -1,19 +0,0 @@
-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;
-};

package/dropdown/utils.js

@@ -1,47 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDropdownFloatingStyle = exports.dropdownFloatingConfig = void 0;
-const react_1 = require("@floating-ui/react");
-const layer_1 = require("../helpers/layer");
-/**
- * Возвращает конфигурацию для `useFloating` по дизайн-гайдам.
- * @return Конфигурация для `useFloating` по дизайн-гайдам.
- */
-function dropdownFloatingConfig() {
-    return {
-        whileElementsMounted: react_1.autoUpdate,
-        placement: 'bottom-start',
-        middleware: [
-            // @todo в будущем с дизайнерами можем решить использовать autoPlacement
-            // но есть сложности: https://github.com/floating-ui/floating-ui/discussions/2155
-            (0, react_1.flip)({
-                padding: 16,
-            }),
-            (0, react_1.shift)({
-                padding: 16,
-            }),
-        ],
-    };
-}
-exports.dropdownFloatingConfig = dropdownFloatingConfig;
-/**
- * Возвращает стили для элемента с учетом "слоя".
- * @param floating Результат вызова useFloating.
- * @return Стили для элемента с учетом "слоя".
- */
-function useDropdownFloatingStyle({ strategy, x, y, refs, }) {
-    const layer = (0, layer_1.useLayer)();
-    const openerWidth = refs.reference.current
-        ? `${refs.reference.current.getBoundingClientRect().width}px`
-        : undefined;
-    return {
-        position: strategy,
-        top: y !== null && y !== void 0 ? y : 0,
-        left: x !== null && x !== void 0 ? x : 0,
-        minWidth: openerWidth,
-        zIndex: layer + 2,
-        // для возможности стилизации
-        '--opener-width': openerWidth,
-    };
-}
-exports.useDropdownFloatingStyle = useDropdownFloatingStyle;

package/dropdown-item/index.d.ts

@@ -1,34 +0,0 @@
-import { ComponentType, ReactNode, SVGAttributes } from 'react';
-export type DropdownItemSize = 's' | 'm' | 'l' | 'xl';
-export interface DropdownItemProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'size'> {
-    /** Отображать элемент как отмеченный (активный) или нет. */
-    checked?: boolean;
-    /** Отображать элемент как выбранный или нет. */
-    selected?: boolean;
-    /** Отключен ли элемент. */
-    disabled?: boolean;
-    /** Нужно ли отключить эффект при наведении. */
-    noHover?: boolean;
-    /** Размер. */
-    size?: DropdownItemSize;
-    /** Строковое значение, ассоциированное с элементом списка. */
-    value?: string;
-    /** Контент перед основным содержимым. */
-    startContent?: ReactNode;
-    /** Контент после основного содержимого. */
-    endContent?: ReactNode;
-    /** Иконка перед основным содержимым. При указании будет проигнорирован "startContent". */
-    startIcon?: ComponentType<SVGAttributes<SVGSVGElement>>;
-    /** Иконка после основного содержимого. При указании будет проигнорирован "endContent". */
-    endIcon?: ComponentType<SVGAttributes<SVGSVGElement>>;
-    /** Контент под основным содержимым. Выводится только при size='xl'. */
-    comment?: ReactNode;
-    /** Идентификатор для систем автоматизированного тестирования. */
-    'data-testid'?: string;
-}
-/**
- * Элемент выпадающего списка.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function DropdownItem({ size, children, className, selected, disabled, noHover, checked, startContent, startIcon: StartIcon, endContent, endIcon: EndIcon, comment, dangerouslySetInnerHTML, 'data-testid': testId, ...restProps }: DropdownItemProps): JSX.Element;

package/dropdown-item/index.js

@@ -1,34 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DropdownItem = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const bind_1 = __importDefault(require("classnames/bind"));
-const dropdown_item_module_scss_1 = __importDefault(require("./dropdown-item.module.scss"));
-const cx = bind_1.default.bind(dropdown_item_module_scss_1.default);
-/**
- * Элемент выпадающего списка.
- * @param props Свойства.
- * @return Элемент.
- */
-function DropdownItem(_a) {
-    var { size = 'm', children, className, selected, disabled, noHover, checked, startContent, startIcon: StartIcon, endContent, endIcon: EndIcon, comment, dangerouslySetInnerHTML, 'data-testid': testId = 'dropdown-item' } = _a, restProps = __rest(_a, ["size", "children", "className", "selected", "disabled", "noHover", "checked", "startContent", "startIcon", "endContent", "endIcon", "comment", "dangerouslySetInnerHTML", 'data-testid']);
-    const start = StartIcon ? (0, jsx_runtime_1.jsx)(StartIcon, { className: cx('icon') }) : startContent;
-    const end = EndIcon ? (0, jsx_runtime_1.jsx)(EndIcon, { className: cx('icon') }) : endContent;
-    const hasChildren = [start, children, end].some(item => typeof item !== 'undefined');
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({}, restProps, { className: cx('root', `size-${size}`, selected && 'selected', checked && 'checked', disabled && 'disabled', noHover && 'no-hover', className), dangerouslySetInnerHTML: dangerouslySetInnerHTML, "data-testid": testId }, { children: hasChildren ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [start && (0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('col', 'col-start') }, { children: start })), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: cx('col', 'col-center') }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('row-main') }, { children: children })), size === 'xl' && comment && (0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('row-comment') }, { children: comment }))] })), end && (0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('col', 'col-end') }, { children: end }))] })) : undefined })));
-}
-exports.DropdownItem = DropdownItem;

package/dropdown-item/types.d.ts

@@ -1,3 +0,0 @@
-import { ReactElement } from 'react';
-import { DropdownItem, DropdownItemProps } from '.';
-export type DropdownItemElement = ReactElement<DropdownItemProps, typeof DropdownItem>;

package/dropdown-item/types.js

@@ -1,2 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });

package/dropdown-item/utils.d.ts

@@ -1,45 +0,0 @@
-import { isValidElement } from 'react';
-import { DropdownItemElement } from './types';
-/** Утилиты для работы с DropdownItem. */
-export declare class DropdownItemUtils {
-    /**
-     * Определяет, является ли переданное значение элементом DropdownItem.
-     * @param value Значение.
-     * @return Является ли переданное значение элементом DropdownItem.
-     */
-    static is(value: Parameters<typeof isValidElement>[0]): value is DropdownItemElement;
-    /**
-     * Возвращает значение элемента меню.
-     * @param menuItem Значение.
-     * @return Значение элемента меню.
-     */
-    static getValue(menuItem: DropdownItemElement): string;
-    /**
-     * Получив опции меню вернет LinkedList и текущую позицию в нем.
-     * @param menuItems Опции.
-     * @param currentIndex Индекс текущей выбранной опции.
-     * @return Текущая позиция в списке и список.
-     */
-    static asLoopedIterator(menuItems: DropdownItemElement[], currentIndex: number): LoopedIterator<number>;
-}
-/** Список с возможностью перемещаться вперед назад с закольцовыванием. */
-export declare class LoopedIterator<T = unknown> {
-    private source;
-    private position;
-    /**
-     * Конструктор.
-     * @param source Источник данных.
-     * @param startPosition Начальная позиция.
-     */
-    constructor(source: T[], startPosition?: number);
-    /**
-     * Возвращает следующий элемент списка.
-     * @return Элемент списка или undefined.
-     */
-    next(): T | undefined;
-    /**
-     * Возвращает предыдущий элемент списка.
-     * @return Элемент списка или undefined.
-     */
-    prev(): T | undefined;
-}

package/dropdown-item/utils.js

@@ -1,89 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LoopedIterator = exports.DropdownItemUtils = void 0;
-const react_1 = require("react");
-const _1 = require(".");
-/** Утилиты для работы с DropdownItem. */
-class DropdownItemUtils {
-    /**
-     * Определяет, является ли переданное значение элементом DropdownItem.
-     * @param value Значение.
-     * @return Является ли переданное значение элементом DropdownItem.
-     */
-    static is(value) {
-        return (0, react_1.isValidElement)(value) && value.type === _1.DropdownItem;
-    }
-    /**
-     * Возвращает значение элемента меню.
-     * @param menuItem Значение.
-     * @return Значение элемента меню.
-     */
-    static getValue(menuItem) {
-        const { value, children } = menuItem.props;
-        // нативный select преобразует содержимое option к строке если не указан value, делаем также
-        return typeof value === 'string' ? value : String(children);
-    }
-    /**
-     * Получив опции меню вернет LinkedList и текущую позицию в нем.
-     * @param menuItems Опции.
-     * @param currentIndex Индекс текущей выбранной опции.
-     * @return Текущая позиция в списке и список.
-     */
-    static asLoopedIterator(menuItems, currentIndex) {
-        let currentPosition = -1;
-        const availableIndices = menuItems.reduce((acc, item, index) => {
-            if (index === currentIndex) {
-                currentPosition = acc.length;
-            }
-            if (!item.props.disabled) {
-                acc.push(index);
-            }
-            return acc;
-        }, []);
-        return new LoopedIterator(availableIndices, currentPosition);
-    }
-}
-exports.DropdownItemUtils = DropdownItemUtils;
-/** Список с возможностью перемещаться вперед назад с закольцовыванием. */
-class LoopedIterator {
-    /**
-     * Конструктор.
-     * @param source Источник данных.
-     * @param startPosition Начальная позиция.
-     */
-    constructor(source, startPosition = 0) {
-        this.source = source;
-        this.position = startPosition;
-    }
-    /**
-     * Возвращает следующий элемент списка.
-     * @return Элемент списка или undefined.
-     */
-    next() {
-        if (this.source.length === 0) {
-            return undefined;
-        }
-        let nextIndex = this.position + 1;
-        if (nextIndex >= this.source.length) {
-            nextIndex = 0;
-        }
-        this.position = nextIndex;
-        return this.source[nextIndex];
-    }
-    /**
-     * Возвращает предыдущий элемент списка.
-     * @return Элемент списка или undefined.
-     */
-    prev() {
-        if (this.source.length === 0) {
-            return undefined;
-        }
-        let nextIndex = this.position - 1;
-        if (nextIndex < 0) {
-            nextIndex = this.source.length - 1;
-        }
-        this.position = nextIndex;
-        return this.source[nextIndex];
-    }
-}
-exports.LoopedIterator = LoopedIterator;

package/expandable/expandable-group.module.scss

@@ -1,28 +0,0 @@
-.root {
-  overflow: hidden;
-}
-
-.inner {
-  display: flex;
-  padding: 0;
-  flex-wrap: wrap;
-  margin: 0 calc(var(--expandable-gap) * -1) calc(var(--expandable-gap) * -1) 0;
-}
-
-.item {
-  display: block;
-  padding: 0;
-  max-width: 100%;
-  height: var(--expandable-item-height);
-  margin: 0 (var(--expandable-gap)) var(--expandable-gap) 0;
-  &.hidden {
-    display: none;
-  }
-  &.invisible {
-    opacity: 0;
-    pointer-events: none;
-  }
-  &.opener {
-    width: var(--expandable-opener-width);
-  }
-}

package/expandable/index.d.ts

@@ -1,42 +0,0 @@
-import { ReactNode, MouseEventHandler, CSSProperties } from 'react';
-export interface ExpandableGroupProps {
-    /** Расстояние между элементами группы в пикселях. */
-    gap?: number;
-    /** Высота каждого элемента группы в пикселях. */
-    itemHeight?: number;
-    /** Развернут ли список по умолчанию. */
-    defaultExpanded?: boolean;
-    /** Количество строк в свернутом состоянии группы. */
-    lineLimit?: number;
-    /** Содержимое. */
-    children?: ReactNode;
-    /** Функция, возвращающая содержимое кнопки разворачивания списка. */
-    opener?: (data: {
-        hiddenCount: number;
-    }) => ReactNode;
-    /** Сработает при разворачивании списка. */
-    onExpand?: () => void;
-    /** CSS-класс корневого элемента. */
-    className?: string;
-    /** Стили корневого элемента. */
-    style?: CSSProperties;
-    /** Нужно ли выводить список развернутым. */
-    expanded?: boolean;
-    /** Ширина открывающего элемента. */
-    openerWidth?: number;
-}
-export interface GroupItemProps {
-    children?: ReactNode;
-    onClick?: MouseEventHandler;
-    'data-testid'?: string;
-}
-/**
- * Группа элементов с ограничением на число выводимых строк и возможностью показать все.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function ExpandableGroup({ gap, itemHeight, lineLimit, defaultExpanded, children, onExpand, opener, className, style, expanded: expandedProp, openerWidth, }: ExpandableGroupProps): JSX.Element;
-export declare const Expandable: {
-    readonly Group: typeof ExpandableGroup;
-    readonly Item: import("react").ForwardRefExoticComponent<GroupItemProps & import("react").RefAttributes<HTMLLIElement>>;
-};

package/expandable/index.js

@@ -1,57 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Expandable = exports.ExpandableGroup = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const utils_1 = require("./utils");
-const bind_1 = __importDefault(require("classnames/bind"));
-const expandable_group_module_scss_1 = __importDefault(require("./expandable-group.module.scss"));
-const cx = bind_1.default.bind(expandable_group_module_scss_1.default);
-const ItemContext = (0, react_1.createContext)({});
-/**
- * Группа элементов с ограничением на число выводимых строк и возможностью показать все.
- * @param props Свойства.
- * @return Элемент.
- */
-function ExpandableGroup({ gap = 8, itemHeight = 32, lineLimit = 2, defaultExpanded = false, children, onExpand, opener = data => (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["\u0415\u0449\u0451 ", data.hiddenCount] }), className, style, expanded: expandedProp, openerWidth = 72, }) {
-    const wrapperRef = (0, react_1.useRef)(null);
-    const containerRef = (0, react_1.useRef)(null);
-    const openerRef = (0, react_1.useRef)(null);
-    const [mounted, setMounted] = (0, react_1.useState)(false);
-    const [expanded, setExpanded] = (0, react_1.useState)(defaultExpanded);
-    const items = react_1.Children.toArray(children).reduce((result, child) => {
-        if ((0, react_1.isValidElement)(child) && child.type === ExpandableItem) {
-            result.push(child);
-        }
-        return result;
-    }, []);
-    (0, react_1.useEffect)(() => {
-        setMounted(true);
-    }, []);
-    (0, react_1.useEffect)(() => {
-        expandedProp !== undefined && setExpanded(expandedProp);
-    }, [expandedProp]);
-    const { hiddenCount } = (0, utils_1.useExpandable)({
-        expanded,
-        wrapperRef,
-        containerRef,
-        openerRef,
-        gap,
-    });
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: wrapperRef, className: cx('root', className), style: Object.assign(Object.assign({}, style), { maxHeight: expanded ? undefined : `${itemHeight * lineLimit + gap * (lineLimit - 1)}px`, '--expandable-item-height': `${itemHeight}px`, '--expandable-opener-width': `${openerWidth}px`, '--expandable-gap': `${gap}px` }) }, { children: (0, jsx_runtime_1.jsxs)("ul", Object.assign({ ref: containerRef, className: expandable_group_module_scss_1.default.inner }, { children: [items, mounted && !expanded && ((0, jsx_runtime_1.jsx)(ItemContext.Provider, Object.assign({ value: { invisible: hiddenCount === 0, opener: true } }, { children: (0, jsx_runtime_1.jsx)(ExpandableItem, Object.assign({ ref: openerRef, onClick: () => {
-                            setExpanded(true);
-                            onExpand === null || onExpand === void 0 ? void 0 : onExpand();
-                        }, "data-testid": 'expandable:opener' }, { children: opener({ hiddenCount }) })) })))] })) })));
-}
-exports.ExpandableGroup = ExpandableGroup;
-const ExpandableItem = (0, react_1.forwardRef)(({ children, onClick, 'data-testid': testId = 'expandable:item' }, ref) => {
-    const context = (0, react_1.useContext)(ItemContext);
-    return ((0, jsx_runtime_1.jsx)("li", Object.assign({ ref: ref, className: cx('item', context), "data-testid": testId, onClick: onClick }, { children: children })));
-});
-exports.Expandable = {
-    Group: ExpandableGroup,
-    Item: ExpandableItem,
-};

package/expandable/utils.d.ts

@@ -1,31 +0,0 @@
-import { RefObject } from 'react';
-export interface ViewState {
-    lastVisibleIndex: number;
-}
-/**
- * Хук состояния группы элементов ограниченных несколькими строками с возможностью показать все.
- * @param options.expanded Развернут ли список.
- * @param options.wrapperRef Реф элемента, формирующего ограничение по высоте.
- * @param options.containerRef Реф элемента, содержащего список.
- * @param options.openerRef Реф элемента "открывашки".
- * @param options.gap Расстояние между элементами списка.
- * @return Рассчитанные данные: кол-во скрытых элементов.
- */
-export declare function useExpandable({ expanded, wrapperRef, containerRef, openerRef, gap, }: {
-    expanded: boolean;
-    wrapperRef: RefObject<HTMLElement>;
-    containerRef: RefObject<HTMLElement>;
-    openerRef: RefObject<HTMLElement>;
-    gap: number;
-}): {
-    hiddenCount: number;
-};
-/**
- * Определяет индекс последнего видимого элемента для свернутого списка.
- * @param wrapper Элемент, формирующий ограничение по высоте.
- * @param items Элементы, все кроме "закрывашки".
- * @param opener Элемент "закрывашки".
- * @param gap Расстояние между элементами списка.
- * @return Состояние.
- */
-export declare function defineViewState(wrapper: HTMLElement, items: Element[], opener: HTMLElement, gap: number): ViewState;