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

package/expandable/utils.js

@@ -1,91 +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.defineViewState = exports.useExpandable = void 0;
-const react_1 = require("react");
-const hooks_1 = require("../hooks");
-const on_1 = require("../helpers/on");
-const expandable_group_module_scss_1 = __importDefault(require("./expandable-group.module.scss"));
-/**
- * Хук состояния группы элементов ограниченных несколькими строками с возможностью показать все.
- * @param options.expanded Развернут ли список.
- * @param options.wrapperRef Реф элемента, формирующего ограничение по высоте.
- * @param options.containerRef Реф элемента, содержащего список.
- * @param options.openerRef Реф элемента "открывашки".
- * @param options.gap Расстояние между элементами списка.
- * @return Рассчитанные данные: кол-во скрытых элементов.
- */
-function useExpandable({ expanded, wrapperRef, containerRef, openerRef, gap, }) {
-    const [hiddenCount, setHiddenCount] = (0, react_1.useState)(0);
-    const calc = (0, react_1.useCallback)(() => {
-        const wrapperEl = wrapperRef.current;
-        const containerEl = containerRef.current;
-        const openerEl = openerRef.current;
-        if (expanded) {
-            if (containerEl) {
-                for (const item of containerEl.children) {
-                    item.classList.remove(expandable_group_module_scss_1.default.hidden);
-                }
-            }
-        }
-        else {
-            if (wrapperEl && containerEl && openerEl) {
-                const items = [...containerEl.children].filter(child => child !== openerEl);
-                // делаем все элементы списка видимыми чтобы правильно считать размеры
-                for (const item of items) {
-                    item.classList.remove(expandable_group_module_scss_1.default.hidden);
-                }
-                // определяем какие элементы не влезли в ограничение по высоте
-                const state = defineViewState(wrapperEl, items, openerEl, gap);
-                if (state.lastVisibleIndex !== -1) {
-                    // делаем невидимыми элементы списка которые не влезли
-                    for (const [index, item] of items.entries()) {
-                        if (item !== openerEl && index >= state.lastVisibleIndex) {
-                            item.classList.add(expandable_group_module_scss_1.default.hidden);
-                        }
-                    }
-                }
-                setHiddenCount(state.lastVisibleIndex !== -1 ? items.length - state.lastVisibleIndex : 0);
-            }
-        }
-    }, [expanded, gap, wrapperRef, containerRef, openerRef]);
-    // пересчитываем после каждого rerender'а
-    (0, hooks_1.useIsomorphicLayoutEffect)(calc);
-    // пересчитываем при resize
-    (0, react_1.useEffect)(() => (0, on_1.on)(window, 'resize', calc), [calc]);
-    return { hiddenCount };
-}
-exports.useExpandable = useExpandable;
-/**
- * Определяет индекс последнего видимого элемента для свернутого списка.
- * @param wrapper Элемент, формирующий ограничение по высоте.
- * @param items Элементы, все кроме "закрывашки".
- * @param opener Элемент "закрывашки".
- * @param gap Расстояние между элементами списка.
- * @return Состояние.
- */
-function defineViewState(wrapper, items, opener, gap) {
-    const state = { lastVisibleIndex: -1 };
-    const parentRect = wrapper.getBoundingClientRect();
-    const firstHiddenNodeIndex = items.findIndex(child => {
-        const childRect = child.getBoundingClientRect();
-        return childRect.top - parentRect.top >= parentRect.height;
-    });
-    if (firstHiddenNodeIndex !== -1) {
-        const lastVisibleIndex = firstHiddenNodeIndex - 1;
-        const lastVisible = items[lastVisibleIndex];
-        if (lastVisible) {
-            const rightBound = lastVisible.getBoundingClientRect().right;
-            const rightContainerBound = wrapper.getBoundingClientRect().right;
-            // хватает ли кнопке места после последнего видимого дочернего элемента с учетом отступа между элементами
-            const isOpenerFit = rightContainerBound - rightBound - gap >= opener.clientWidth;
-            // если хватает места - ставим кнопку после последнего, иначе - вместо
-            // @todo возможна ситуация когда нужно будет удалить N элементов чтобы влезла кнопка
-            state.lastVisibleIndex = lastVisibleIndex + Number(isOpenerFit);
-        }
-    }
-    return state;
-}
-exports.defineViewState = defineViewState;

package/field-block/field-block.module.scss

@@ -1,155 +0,0 @@
-@use '../colors';
-
-.root {
-  font-size: 16px;
-  line-height: 24px;
-  width: var(--field-width, 240px);
-  color: var(--field-primary-text-color);
-  --field-primary-text-color: #{colors.$basic-gray87};
-  --field-label-text-color: #{colors.$basic-gray38};
-  --field-background: #fff;
-  --field-border-color: #{colors.$basic-gray12};
-  --field-caption-color: #{colors.$basic-gray38};
-  &.size-s {
-    font-size: 14px;
-    line-height: 20px;
-    --field-height: 32px;
-    --field-gutter-horizontal: 12px;
-    --field-gutter-adornment: 8px;
-    --field-gutter-vertical: 6px;
-  }
-  &.size-m {
-    --field-height: 40px;
-    --field-gutter-horizontal: 12px;
-    --field-gutter-adornment: 8px;
-    --field-gutter-vertical: 8px;
-  }
-  &.size-l {
-    --field-height: 56px;
-    --field-gutter-horizontal: 16px;
-    --field-gutter-adornment: 12px;
-    --field-gutter-vertical: 8px;
-    &.no-label {
-      .main-col {
-        padding: 8px 0;
-      }
-    }
-  }
-  &.focused {
-    --field-border-color: #{colors.$basic-blue};
-  }
-  &.disabled {
-    --field-primary-text-color: #{colors.$basic-gray24};
-    --field-main-text-color: #{colors.$basic-gray24};
-    --field-label-text-color: #{colors.$basic-gray24};
-    --field-background: #{colors.$basic-gray2};
-    --field-border-color: #{colors.$basic-gray12};
-  }
-  &.failed {
-    --field-caption-color: #{colors.$additional-deep-red};
-    --field-main-text-color: #{colors.$additional-deep-red};
-    &.label-as-placeholder {
-      --field-label-text-color: #{colors.$additional-deep-red};
-    }
-  }
-  &.label-as-placeholder {
-    &.size-s {
-      .label {
-        // @todo из-за overflow:hidden + height:0 скрывается - поменять логику
-        // height: 0;
-
-        // размер шрифта 12px увеличиваем до 14px
-        transform: scale(calc(7 / 6)) translateY(1px);
-        max-width: calc(100% * (6 / 7));
-      }
-    }
-    &.size-m {
-      .label {
-        // @todo из-за overflow:hidden + height:0 скрывается - поменять логику
-        // height: 0;
-
-        // размер шрифта 12px увеличиваем до 16px
-        transform: scale(calc(4 / 3)) translateY(1px);
-        max-width: calc(100% * (3 / 4));
-      }
-    }
-    &.size-l {
-      .label {
-        // размер шрифта 12px увеличиваем до 16px
-        transform: scale(calc(4 / 3)) translateY(7px);
-        max-width: calc(100% * (3 / 4));
-      }
-    }
-    .main {
-      opacity: 0;
-    }
-  }
-}
-
-.block {
-  border-radius: 4px;
-  outline: 0;
-  display: flex;
-  align-items: flex-start;
-  padding: var(--field-gutter-vertical) var(--field-gutter-horizontal);
-  width: 100%;
-  background: var(--field-background);
-  box-shadow: inset 0 0 0 1px var(--field-border-color);
-  &.fixed-height {
-    height: var(--field-height);
-  }
-  &:not(.fixed-height) {
-    min-height: var(--field-height);
-  }
-}
-
-.label {
-  max-width: 100%;
-  transform-origin: 0 0;
-  transition: transform 0.2s ease-in-out, max-width 0.2s ease-in-out;
-  height: 16px;
-  font-size: 12px;
-  line-height: 16px;
-  color: var(--field-label-text-color, var(--field-primary-text-color));
-  user-select: none;
-  pointer-events: none;
-  white-space: nowrap;
-  overflow: hidden;
-}
-
-.col {
-  min-height: calc(var(--field-height) - (2 * var(--field-gutter-vertical)));
-}
-
-.main-col {
-  display: flex;
-  flex-direction: column;
-  flex-grow: 1;
-  min-width: 0; // чтобы не выбивал "соседей" за пределы блока
-}
-
-.adornment-col {
-  flex-grow: 0;
-  flex-shrink: 0;
-  display: flex;
-  align-items: center;
-  &.start {
-    margin-right: var(--field-gutter-adornment);
-  }
-  &.end {
-    margin-left: var(--field-gutter-adornment);
-  }
-}
-
-.main {
-  max-width: 100%;
-  white-space: nowrap;
-  color: var(--field-main-text-color, var(--field-primary-text-color));
-}
-
-.caption {
-  margin-top: 8px;
-  font-size: 12px;
-  line-height: 16px;
-  color: var(--field-caption-color);
-}

package/field-block/index.d.ts

@@ -1,63 +0,0 @@
-import { ReactNode, HTMLAttributes, LabelHTMLAttributes, Ref, CSSProperties } from 'react';
-export type FieldBlockSize = 's' | 'm' | 'l';
-type NoChildren<T extends {
-    children?: any;
-}> = Omit<T, 'children'>;
-export interface FieldBlockStyle extends CSSProperties {
-    '--field-width'?: string;
-    '--field-main-text-color'?: string;
-}
-type WithStyle<T extends {
-    style?: CSSProperties;
-}> = Omit<T, 'style'> & {
-    style?: FieldBlockStyle;
-};
-export interface FieldBlockProps {
-    /** Отключенное состояние. */
-    disabled?: boolean;
-    /** Состояние с ошибкой. */
-    failed?: boolean;
-    /** Состояние фокуса. */
-    focused?: boolean;
-    /** Подпись под полем. */
-    caption?: string;
-    /** Ярлык в поле. */
-    label?: string;
-    /** Выводить ярлык вместо placeholder или введенного значения. */
-    labelAsPlaceholder?: boolean;
-    /** Опции элемента ярлыка. */
-    labelProps?: NoChildren<LabelHTMLAttributes<HTMLLabelElement>>;
-    /** Размер. */
-    size?: FieldBlockSize;
-    /** Фиксировать высоту. */
-    fixedHeight?: boolean;
-    /** Опции корневого элемента. */
-    rootProps?: NoChildren<WithStyle<HTMLAttributes<HTMLDivElement>>>;
-    /** Ref корневого элемента. */
-    rootRef?: Ref<HTMLDivElement>;
-    /** Опции элемента блока поля. */
-    blockProps?: NoChildren<WithStyle<HTMLAttributes<HTMLDivElement>>>;
-    /** Ref элемента блока поля. */
-    blockRef?: Ref<HTMLDivElement>;
-    /** Украшение перед основным содержимым. */
-    adornmentStart?: ReactNode;
-    /** Украшение после основного содержимого. */
-    adornmentEnd?: ReactNode;
-    /** Основное содержимое. */
-    main?: ReactNode;
-    /** Опции основного содержимого. */
-    mainProps?: NoChildren<WithStyle<HTMLAttributes<HTMLDivElement>>>;
-    /** Идентификатор для систем автоматизированного тестирования. */
-    'data-testid'?: string;
-}
-export declare const FIELD_BLOCK_HEIGHT: Record<FieldBlockSize, number>;
-export declare const FIELD_BLOCK_DEFAULTS: {
-    readonly size: "l";
-};
-/**
- * Блок поля по дизайн-гайдам.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function FieldBlock({ size, main, mainProps, disabled, failed, focused, label, labelProps, labelAsPlaceholder, fixedHeight, caption, rootRef, rootProps, blockRef, blockProps, adornmentStart, adornmentEnd, 'data-testid': testId, }: FieldBlockProps): JSX.Element;
-export {};

package/field-block/index.js

@@ -1,36 +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.FieldBlock = exports.FIELD_BLOCK_DEFAULTS = exports.FIELD_BLOCK_HEIGHT = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const bind_1 = __importDefault(require("classnames/bind"));
-const field_block_module_scss_1 = __importDefault(require("./field-block.module.scss"));
-const cx = bind_1.default.bind(field_block_module_scss_1.default);
-exports.FIELD_BLOCK_HEIGHT = {
-    s: 32,
-    m: 40,
-    l: 56,
-};
-exports.FIELD_BLOCK_DEFAULTS = {
-    size: 'l',
-};
-/**
- * Блок поля по дизайн-гайдам.
- * @param props Свойства.
- * @return Элемент.
- */
-function FieldBlock({ size = exports.FIELD_BLOCK_DEFAULTS.size, main, mainProps, disabled, failed, focused, label, labelProps, labelAsPlaceholder, fixedHeight = true, caption, rootRef, rootProps, blockRef, blockProps, adornmentStart, adornmentEnd, 'data-testid': testId = 'field-block', }) {
-    const needLabel = Boolean(label) && (size === 'l' || labelAsPlaceholder);
-    const rootClassName = cx('root', `size-${size}`, {
-        disabled,
-        focused,
-        failed,
-        'label-as-placeholder': needLabel && labelAsPlaceholder,
-        'no-label': !needLabel,
-    }, rootProps === null || rootProps === void 0 ? void 0 : rootProps.className);
-    const blockClassName = cx('block', fixedHeight && 'fixed-height', blockProps === null || blockProps === void 0 ? void 0 : blockProps.className);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, rootProps, { ref: rootRef, className: rootClassName, "data-testid": testId }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({}, blockProps, { ref: blockRef, className: blockClassName, "data-testid": 'field-block:block' }, { children: [adornmentStart && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('col', 'adornment-col', 'start'), "data-testid": 'field-block:adornment-start' }, { children: adornmentStart }))), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: cx('col', 'main-col') }, { children: [needLabel && ((0, jsx_runtime_1.jsx)("label", Object.assign({}, labelProps, { className: cx('label', labelProps === null || labelProps === void 0 ? void 0 : labelProps.className), "data-testid": 'field-block:label' }, { children: label }))), (0, jsx_runtime_1.jsx)("div", Object.assign({}, mainProps, { className: cx('main', mainProps === null || mainProps === void 0 ? void 0 : mainProps.className), "data-testid": 'field-block:main' }, { children: main }))] })), adornmentEnd && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('col', 'adornment-col', 'end'), "data-testid": 'field-block:adornment-end' }, { children: adornmentEnd })))] })), caption && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('caption'), "data-testid": 'field-block:caption' }, { children: caption })))] })));
-}
-exports.FieldBlock = FieldBlock;

package/field-grid/field-grid.module.scss

@@ -1,30 +0,0 @@
-.container {
-  display: flex;
-  flex-wrap: wrap;
-  padding: 1px 0 0 1px;
-}
-
-.cell {
-  display: flex;
-  justify-content: stretch;
-  flex-grow: 1;
-  margin: -1px 0 0 -1px;
-}
-
-.size-third {
-  width: calc(100% / 3);
-}
-
-.size-half {
-  width: 50%;
-}
-
-.size-full {
-  width: 100%;
-}
-
-.focused-field {
-  // чтобы выделенные границы не скрывались под другими элементами сетки, поднимаем при фокусировке
-  position: relative;
-  z-index: 1;
-}

package/field-grid/index.d.ts

@@ -1,59 +0,0 @@
-/// <reference types="react" />
-import { TextFieldProps } from '../text-field';
-type ItOrArray<T> = T[] | T;
-type CellSize = 'full' | 'half' | 'third';
-interface CommonCellProps {
-    size?: CellSize;
-    rounds?: TextFieldProps['rounds'];
-}
-type OnlyOneRequired<T, K extends keyof T = keyof T> = {
-    [key in K]?: Required<Pick<T, key>> & Partial<Record<Exclude<K, key>, undefined>>;
-}[K];
-export type CellProps = CommonCellProps & OnlyOneRequired<{
-    field: React.ReactElement<Pick<TextFieldProps, 'rounds' | 'caption' | 'classes' | 'className'>>;
-    renderField: (props: Pick<TextFieldProps, 'rounds' | 'caption'>) => React.ReactNode;
-}>;
-export interface RowProps {
-    isFirst?: boolean;
-    isLast?: boolean;
-    children: ItOrArray<React.ReactElement<CellProps, typeof Cell>>;
-}
-export interface FieldGridProps {
-    /** Содержимое. */
-    children: ItOrArray<React.ReactElement<RowProps, typeof Row>>;
-    /** Свойства корневого элемента. */
-    rootProps?: React.HTMLAttributes<HTMLDivElement>;
-}
-export interface FieldGridComponent extends React.FC<FieldGridProps> {
-    Row: typeof Row;
-    Cell: typeof Cell;
-}
-/**
- * Компонент сетки полей.
- * @deprecated В макетах больше не используются "склеивания" полей.
- * @param props Свойства.
- * @param props.children Содержимое, дочерними элементами могут быть только FieldGrid.Row.
- * @param props.rootProps Свойства корневого элемента.
- * @return Элемент.
- */
-export declare const FieldGrid: FieldGridComponent;
-/**
- * Компонент ряда для сетки полей. Может быть использован только как дочерний для FieldGrid.
- * @param props Свойства.
- * @param props.children Содержимое, дочерними элементами могут быть только FieldGrid.Cell.
- * @param props.isFirst Является ли ряд первым (будет задан автоматически).
- * @param props.isLast Является ли ряд последним (будет задан автоматически).
- * @return Элемент.
- */
-declare const Row: React.FC<RowProps>;
-/**
- * Компонент элемента для сетки полей. Может быть использован только как дочерний для FieldGrid.Row.
- * @param props Свойства.
- * @param props.size Размер ячейки по горизонтали (будет задан автоматически).
- * @param props.rounds Скругления для поля (будет задан автоматически).
- * @param props.field Поле.
- * @param props.renderField Должна вернуть поле получив свойства для него.
- * @return Элемент.
- */
-declare const Cell: React.FC<CellProps>;
-export {};

package/field-grid/index.js

@@ -1,116 +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.FieldGrid = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const bind_1 = __importDefault(require("classnames/bind"));
-const field_grid_module_scss_1 = __importDefault(require("./field-grid.module.scss"));
-const cx = bind_1.default.bind(field_grid_module_scss_1.default);
-const cellSizeByCount = {
-    1: 'full',
-    2: 'half',
-    3: 'third',
-};
-const TypeCheck = {
-    isRow: (child) => child && child.type === Row,
-    isCell: (child) => child && child.type === Cell,
-};
-/**
- * Компонент сетки полей.
- * @deprecated В макетах больше не используются "склеивания" полей.
- * @param props Свойства.
- * @param props.children Содержимое, дочерними элементами могут быть только FieldGrid.Row.
- * @param props.rootProps Свойства корневого элемента.
- * @return Элемент.
- */
-const FieldGrid = ({ children, rootProps }) => {
-    const rows = react_1.Children.toArray(children).filter(TypeCheck.isRow);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({}, rootProps, { className: cx('container', rootProps === null || rootProps === void 0 ? void 0 : rootProps.className) }, { children: rows.map((row, index) => (0, react_1.cloneElement)(row, {
-            isFirst: index === 0,
-            isLast: index === rows.length - 1,
-        })) })));
-};
-exports.FieldGrid = FieldGrid;
-/**
- * Компонент ряда для сетки полей. Может быть использован только как дочерний для FieldGrid.
- * @param props Свойства.
- * @param props.children Содержимое, дочерними элементами могут быть только FieldGrid.Cell.
- * @param props.isFirst Является ли ряд первым (будет задан автоматически).
- * @param props.isLast Является ли ряд последним (будет задан автоматически).
- * @return Элемент.
- */
-const Row = ({ isFirst: isFirstRow, isLast: isLastRow, children }) => {
-    const cells = react_1.Children.toArray(children)
-        .filter(TypeCheck.isCell)
-        .slice(0, 3);
-    const cellSize = cellSizeByCount[cells.length];
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: cells.map((cell, index) => {
-            const isFirstCell = index === 0;
-            const isLastCell = index === cells.length - 1;
-            let rounds = 'none';
-            if (isFirstRow && isLastRow) {
-                if (isFirstCell && isLastCell) {
-                    rounds = 'all';
-                }
-                else if (isFirstCell) {
-                    rounds = 'left';
-                }
-                else if (isLastCell) {
-                    rounds = 'right';
-                }
-            }
-            else if (isFirstRow) {
-                if (isFirstCell && isLastCell) {
-                    rounds = 'top';
-                }
-                else if (isFirstCell) {
-                    rounds = 'topLeft';
-                }
-                else if (isLastCell) {
-                    rounds = 'topRight';
-                }
-            }
-            else if (isLastRow) {
-                if (isFirstCell && isLastCell) {
-                    rounds = 'bottom';
-                }
-                else if (isFirstCell) {
-                    rounds = 'bottomLeft';
-                }
-                else if (isLastCell) {
-                    rounds = 'bottomRight';
-                }
-            }
-            return (0, react_1.cloneElement)(cell, { size: cellSize, rounds });
-        }) }));
-};
-/**
- * Компонент элемента для сетки полей. Может быть использован только как дочерний для FieldGrid.Row.
- * @param props Свойства.
- * @param props.size Размер ячейки по горизонтали (будет задан автоматически).
- * @param props.rounds Скругления для поля (будет задан автоматически).
- * @param props.field Поле.
- * @param props.renderField Должна вернуть поле получив свойства для него.
- * @return Элемент.
- */
-const Cell = ({ size, rounds, field, renderField }) => {
-    var _a;
-    let content;
-    if (renderField) {
-        content = renderField({ rounds, caption: undefined });
-    }
-    else if (field) {
-        content = (0, react_1.cloneElement)(field, {
-            rounds,
-            caption: undefined,
-            classes: Object.assign(Object.assign({}, field.props.classes), { blockFocused: cx((_a = field.props.classes) === null || _a === void 0 ? void 0 : _a.blockFocused, 'focused-field') }),
-            className: cx(field.props.className, 'size-full'),
-        });
-    }
-    return (0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('cell', `size-${size}`) }, { children: content }));
-};
-exports.FieldGrid.Row = Row;
-exports.FieldGrid.Cell = Cell;

package/file-icon/index.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-export interface FileIconProps extends Omit<React.SVGAttributes<SVGSVGElement>, 'type'> {
-    /** Тип файла. */
-    type?: string;
-}
-/**
- * Компонент иконки файла.
- * @param props Свойства. Поддерживаются свойства <svg />.
- * @return Элемент.
- */
-export declare const FileIcon: ({ type, ...svgProps }: FileIconProps) => JSX.Element;

package/file-icon/index.js

@@ -1,38 +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;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FileIcon = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const colors_1 = require("../colors");
-const VARIANTS = {
-    doc: { fill: colors_1.COLORS.get('additional-electric-blue') },
-    xls: { fill: colors_1.COLORS.get('additional-light-green') },
-    pdf: { fill: colors_1.COLORS.get('additional-deep-red') },
-    jpg: { fill: colors_1.COLORS.get('additional-deep-orange') },
-    xml: { fill: colors_1.COLORS.get('additional-deep-purple') },
-    zip: { fill: colors_1.COLORS.get('additional-teal') },
-    png: { fill: colors_1.COLORS.get('additional-purple') },
-    mov: { fill: colors_1.COLORS.get('additional-blue-gray') },
-    mp4: { fill: colors_1.COLORS.get('additional-blue-gray') },
-};
-/**
- * Компонент иконки файла.
- * @param props Свойства. Поддерживаются свойства <svg />.
- * @return Элемент.
- */
-const FileIcon = (_a) => {
-    var { type } = _a, svgProps = __rest(_a, ["type"]);
-    const typeProps = VARIANTS[type];
-    return type && typeProps ? ((0, jsx_runtime_1.jsxs)("svg", Object.assign({ width: '32', height: '32', viewBox: '0 0 32 32' }, svgProps, { children: [(0, jsx_runtime_1.jsx)("path", { opacity: '0.88', d: 'M6 5C6 3.89543 6.89543 3 8 3H20L26 9V27C26 28.1046 25.1046 29 24 29H8C6.89543 29 6 28.1046 6 27V5Z', fill: typeProps.fill }), (0, jsx_runtime_1.jsx)("path", { opacity: '0.32', d: 'M21 9L26 9L20 3L20 8C20 8.55229 20.4477 9 21 9Z', fill: 'white' }), (0, jsx_runtime_1.jsx)("path", { opacity: '0.24', d: 'M25.1667 9L21 9L26 15L26 9C25.5833 9 25.6269 9 25.1667 9Z', fill: 'black' }), (0, jsx_runtime_1.jsx)("text", Object.assign({ x: '16', y: '23', textAnchor: 'middle', fontSize: '6.5', fontWeight: '700', fill: '#fff' }, { children: type.toUpperCase() }))] }))) : ((0, jsx_runtime_1.jsxs)("svg", Object.assign({ width: '32', height: '32', viewBox: '0 0 32 32', fill: 'none' }, svgProps, { children: [(0, jsx_runtime_1.jsx)("path", { opacity: '0.88', d: 'M6 5C6 3.89543 6.89543 3 8 3H20L26 9V27C26 28.1046 25.1046 29 24 29H8C6.89543 29 6 28.1046 6 27V5Z', fill: '#C2C2C2' }), (0, jsx_runtime_1.jsx)("path", { opacity: '0.32', d: 'M21 9L26 9L20 3L20 8C20 8.55229 20.4477 9 21 9Z', fill: 'white' }), (0, jsx_runtime_1.jsx)("path", { opacity: '0.24', d: 'M25.1667 9L21 9L26 15L26 9C25.5833 9 25.6269 9 25.1667 9Z', fill: 'black' }), (0, jsx_runtime_1.jsxs)("g", Object.assign({ opacity: '0.8' }, { children: [(0, jsx_runtime_1.jsx)("path", { d: 'M9 22H23V24H9V22Z', fill: 'white' }), (0, jsx_runtime_1.jsx)("path", { d: 'M9 18H19V20H9V18Z', fill: 'white' })] }))] })));
-};
-exports.FileIcon = FileIcon;

package/group-overflow/index.d.ts

@@ -1,16 +0,0 @@
-import { HTMLAttributes, ReactNode } from 'react';
-export type RenderTail = (data: {
-    hiddenCount: number;
-}) => ReactNode;
-export interface GroupOverflowProps extends HTMLAttributes<HTMLDivElement> {
-    /** Расстояние между элементами в пикселях. */
-    gap?: number;
-    /** Вернёт "замыкающий" элемент, который будет выведен по аналогии с многоточием для текста. */
-    tail?: RenderTail;
-}
-/**
- * Группа со скрытием не влезающих элементов.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function GroupOverflow({ children, className, style, gap, tail, ...restProps }: GroupOverflowProps): JSX.Element;

package/group-overflow/index.js

@@ -1,39 +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.GroupOverflow = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const utils_1 = require("./utils");
-const classnames_1 = __importDefault(require("classnames"));
-const group_overflow_module_scss_1 = __importDefault(require("./group-overflow.module.scss"));
-/**
- * Группа со скрытием не влезающих элементов.
- * @param props Свойства.
- * @return Элемент.
- */
-function GroupOverflow(_a) {
-    var { children, className, style, gap, tail } = _a, restProps = __rest(_a, ["children", "className", "style", "gap", "tail"]);
-    const ref = (0, react_1.useRef)(null);
-    const { state, start } = (0, utils_1.useItemsHide)(ref, el => { var _a; return (_a = el.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement; });
-    const total = react_1.Children.count(children);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, classnames_1.default)(group_overflow_module_scss_1.default.root, className), style: typeof gap === 'number'
-            ? Object.assign(Object.assign({}, style), { '--group-overflow-gap': `${gap}px` })
-            : style }, restProps, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, className: group_overflow_module_scss_1.default.items }, { children: state === 'initial'
-                    ? react_1.Children.toArray(children)
-                    : react_1.Children.toArray(children).slice(0, start) })), state !== 'initial' && start < total && tail && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: group_overflow_module_scss_1.default.more }, { children: tail({ hiddenCount: total - start }) })))] })));
-}
-exports.GroupOverflow = GroupOverflow;