@alfalab/core-components-tabs 7.2.4 → 7.2.5

package/cssm/utils-85892853.d.ts

@@ -0,0 +1,38 @@
+import { ReactNode, RefObject } from 'react';
+import { BaseSelectProps, GroupShape, OptionShape } from "./typings-85892853";
+declare const isGroup: (item: OptionShape | GroupShape) => item is GroupShape;
+declare const isOptionShape: (item: OptionShape | string | null) => item is OptionShape;
+declare const joinOptions: ({ selected, selectedMultiple, }: {
+    selected?: OptionShape | undefined;
+    selectedMultiple?: OptionShape[] | undefined;
+}) => ReactNode[] | null;
+declare function processOptions(options: BaseSelectProps['options'], selected?: BaseSelectProps['selected']): {
+    flatOptions: OptionShape[];
+    selectedOptions: OptionShape[];
+};
+type useVisibleOptionsArgs = {
+    /**
+     * Количество видимых пунктов
+     */
+    visibleOptions: number;
+    /**
+     * Реф на контейнер с пунтами меню
+     */
+    listRef: RefObject<HTMLElement>;
+    /**
+     * Реф на контейнер, которому нужно установить высоту
+     */
+    styleTargetRef?: RefObject<HTMLElement>;
+    /**
+     * Флаг открытия меню
+     */
+    open?: boolean;
+    /**
+     * Позволяет вызвать пересчет высоты
+     */
+    invalidate?: unknown;
+};
+declare function useVisibleOptions({ visibleOptions, listRef, styleTargetRef, open, invalidate, }: useVisibleOptionsArgs): void;
+declare function usePrevious<T>(value: T): T | undefined;
+declare const lastIndexOf: <T>(array: T[], predicate: (item: T) => boolean) => number;
+export { isGroup, isOptionShape, joinOptions, processOptions, useVisibleOptions, usePrevious, lastIndexOf };

package/desktop.js

@@ -2,12 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./tslib.es6-f581fd25.js');
+require('./tslib.es6-e85b77d3.js');
 require('react');
 require('classnames');
-require('@alfalab/core-components/picker-button/desktop');
 require('@alfalab/core-components-badge');
 require('@alfalab/core-components-keyboard-focusable');
+require('@alfalab/core-components-picker-button/desktop');
 require('@alfalab/hooks');
 require('@juggle/resize-observer');
 var hooks_useCollapsibleElements = require('./hooks/use-collapsible-elements.js');
@@ -18,11 +18,11 @@ require('compute-scroll-into-view');
 var components_scrollableContainer_Component = require('./components/scrollable-container/Component.js');
 require('./components/title/Component.js');
 require('./components/primary-tablist/Component.js');
-require('./index.module-4ae8ce0c.js');
+require('./index.module-a1b32357.js');
 var components_primaryTablist_Component_desktop = require('./components/primary-tablist/Component.desktop.js');
 require('@alfalab/core-components-tag');
 require('./components/secondary-tablist/Component.js');
-require('./index.module-1f2c27dd.js');
+require('./index.module-cfa18052.js');
 var components_secondaryTablist_Component_desktop = require('./components/secondary-tablist/Component.desktop.js');
 var components_tab_Component = require('./components/tab/Component.js');
 require('./components/tabs/Component.js');

package/esm/Component-0d7ca9a7.d.ts

@@ -0,0 +1,40 @@
+/// <reference types="react" />
+import React from 'react';
+import { FC, SVGProps } from "react";
+import { ButtonProps } from "./index-ebda875c";
+import { BaseSelectProps } from "./index-3e68f8db";
+type PickerButtonSize = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl';
+type PickerButtonVariant = 'default' | 'compact';
+type PickerButtonDesktopProps = Omit<BaseSelectProps, 'Field' | 'placeholder' | 'Arrow' | 'autocomplete' | 'size' | 'onFocus' | 'selected' | 'closeOnSelect' | 'multiple' | 'fieldProps' | 'hint' | 'allowUnselect' | 'options'> & Pick<ButtonProps, 'view' | 'loading' | 'leftAddons' | 'rightAddons'> & {
+    options: Array<BaseSelectProps['options'][0] & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    }>;
+    /**
+     * Размер кнопки
+     */
+    size?: PickerButtonSize;
+    /**
+     * Тип кнопки
+     */
+    variant?: PickerButtonVariant;
+};
+declare const PickerButtonDesktop: React.ForwardRefExoticComponent<Omit<BaseSelectProps, "placeholder" | "onFocus" | "size" | "selected" | "multiple" | "hint" | "options" | "autocomplete" | "allowUnselect" | "closeOnSelect" | "fieldProps" | "Arrow" | "Field"> & Pick<ButtonProps, "rightAddons" | "leftAddons" | "view" | "loading"> & {
+    options: Array<BaseSelectProps['options'][0] & {
+        /**
+         * Иконка, отображающаяся слева от текстового представления пункта
+         */
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    }>;
+    /**
+     * Размер кнопки
+     */
+    size?: PickerButtonSize | undefined;
+    /**
+     * Тип кнопки
+     */
+    variant?: PickerButtonVariant | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+export { PickerButtonSize, PickerButtonVariant, PickerButtonDesktopProps, PickerButtonDesktop };

package/esm/Component-3e68f8db.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { FC, SVGProps } from 'react';
+import { OptionShape } from "./typings-85892853";
+import { OptionProps as BaseOptionProps } from "./typings-85892853";
+type OptionProps = Omit<BaseOptionProps, 'option'> & {
+    option: OptionShape & {
+        icon?: FC<SVGProps<SVGSVGElement>>;
+    };
+};
+declare const Option: ({ option, children, ...restProps }: OptionProps) => JSX.Element;
+export { Option };

package/esm/Component-3fe0d3e6.d.ts

@@ -0,0 +1,234 @@
+import React from "react";
+import { ButtonHTMLAttributes, ElementType, FC, ForwardRefExoticComponent, RefAttributes, HTMLAttributes, ReactNode } from "react";
+import { IconButtonProps } from "./index-ebda875c";
+import { BottomSheetTitleAlign } from "./index-7ca84eff";
+type CloserProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Размер кнопки
+     */
+    size?: IconButtonProps["size"];
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Иконка
+     */
+    icon?: ElementType;
+};
+declare const Closer: React.FC<CloserProps>;
+declare const colors: readonly [
+    "tertiary",
+    "disabled",
+    "accent",
+    "primary",
+    "attention",
+    "positive",
+    "secondary",
+    "tertiary-inverted",
+    "primary-inverted",
+    "secondary-inverted",
+    "link",
+    "negative"
+];
+type Color = typeof colors[number];
+type TextElementType = HTMLParagraphElement | HTMLSpanElement | HTMLDivElement;
+type NativeProps = HTMLAttributes<HTMLSpanElement>;
+type TextBaseProps = {
+    /**
+     * [Вариант начертания](https://core-ds.github.io/core-components/master/?path=/docs/инструкции-типографика--page)
+     */
+    view?: "primary-large" | "primary-medium" | "primary-small" | "secondary-large" | "secondary-medium" | "secondary-small" | "component" | "caps";
+    /**
+     * Цвет текста
+     */
+    color?: Color;
+    /**
+     * Толщина шрифта
+     */
+    weight?: "regular" | "medium" | "bold";
+    /**
+     * Делает цифры моноширинными
+     */
+    monospaceNumbers?: boolean;
+    /**
+     * HTML тег
+     */
+    tag?: "span" | "div";
+    /**
+     * Css-класс для стилизации (native prop)
+     */
+    className?: string;
+    /**
+     * Id компонента для тестов
+     */
+    dataTestId?: string;
+    /**
+     * Контент (native prop)
+     */
+    children?: React.ReactNode;
+    /**
+     * Добавляет отступы к тэгу 'p'
+     */
+    defaultMargins?: never;
+};
+type TextPTagProps = Omit<TextBaseProps, "tag" | "defaultMargins"> & {
+    tag?: "p";
+    defaultMargins?: boolean;
+};
+type TextProps = Omit<NativeProps, "color"> & (TextBaseProps | TextPTagProps);
+type NativeProps$0 = HTMLAttributes<HTMLHeadingElement>;
+type TitleProps = Omit<NativeProps$0, "color"> & {
+    /**
+     * HTML тег
+     */
+    tag: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "div";
+    /**
+     * [Вариант начертания](https://core-ds.github.io/core-components/master/?path=/docs/инструкции-типографика--page)
+     */
+    view?: "xlarge" | "large" | "medium" | "small" | "xsmall";
+    /**
+     * Цвет текста
+     */
+    color?: Color;
+    /**
+     * Толщина шрифта
+     */
+    weight?: "regular" | "medium" | "bold";
+    /**
+     * Шрифт текста
+     */
+    font?: "styrene" | "system";
+    /**
+     * Добавляет отступы
+     */
+    defaultMargins?: boolean;
+    /**
+     * Css-класс для стилизации (native prop)
+     */
+    className?: string;
+    /**
+     * Id компонента для тестов
+     */
+    dataTestId?: string;
+    /**
+     * Контент (native prop)
+     */
+    children?: React.ReactNode;
+};
+type TitleMobileProps = Omit<TitleProps, "defaultMargins">;
+declare const Typography: {
+    Title: FC<TitleProps>;
+    Text: ForwardRefExoticComponent<TextProps & RefAttributes<TextElementType>>;
+    TitleResponsive: FC<TitleProps>;
+    TitleMobile: FC<TitleMobileProps>;
+};
+declare const typographyPresets: {
+    mobile: {
+        list: {
+            text: {
+                primary: {
+                    tag: string;
+                    view: string;
+                };
+                secondary: {
+                    tag: string;
+                    color: string;
+                    view: string;
+                };
+            };
+        };
+    };
+};
+type BackerProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Размер кнопки
+     */
+    size?: IconButtonProps["size"];
+    /**
+     * Иконка
+     */
+    icon?: ElementType;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Обработчик нажатия
+     */
+    onClick?: () => void;
+};
+declare const Backer: React.FC<BackerProps>;
+declare const TitleResponsive: FC<TitleProps>;
+type HeaderProps = {
+    /**
+     * Заголовок
+     */
+    title?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    headerClassName?: string;
+    /**
+     * Дополнительный класс для аддонов
+     */
+    addonClassName?: string;
+    /**
+     * Дополнительный класс для компонента крестика
+     */
+    closerClassName?: string;
+    /**
+     * Дополнительный класс для компонента стрелки назад
+     */
+    backerClassName?: string;
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Слот снизу
+     */
+    bottomAddons?: ReactNode;
+    /**
+     * Наличие компонента крестика
+     */
+    hasCloser?: boolean;
+    /**
+     * Наличие компонента стрелки назад
+     */
+    hasBacker?: boolean;
+    /**
+     * Выравнивание заголовка
+     */
+    titleAlign?: BottomSheetTitleAlign;
+    /**
+     * Будет ли обрезан заголовок
+     */
+    trimTitle?: boolean;
+    /**
+     * Фиксирует шапку
+     */
+    sticky?: boolean;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Обработчик нажатия на стрелку назад
+     */
+    onBack?: () => void;
+};
+declare const Header: FC<HeaderProps>;
+export { CloserProps, Closer, Typography, typographyPresets, TitleProps, TextProps, Color, BackerProps, Backer, TitleResponsive, HeaderProps, Header };

package/esm/Component-85892853.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { FC } from 'react';
+import { OptionProps } from "./typings-85892853";
+declare const BaseOption: FC<OptionProps>;
+export { BaseOption };

package/esm/Component-97288072.d.ts

@@ -0,0 +1,49 @@
+import { FC, ReactNode } from 'react';
+type HeaderProps = {
+    /**
+     * Контент шапки
+     */
+    children?: ReactNode;
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Наличие компонента крестика
+     */
+    hasCloser?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для аддонов
+     */
+    addonClassName?: string;
+    /**
+     * Дополнительный класс для контента
+     */
+    contentClassName?: string;
+    /**
+     * Заголовок шапки
+     */
+    title?: string;
+    /**
+     * Выравнивание заголовка
+     */
+    align?: 'left' | 'center';
+    /**
+     * Обрезать ли заголовок
+     */
+    trim?: boolean;
+    /**
+     * Фиксирует шапку
+     */
+    sticky?: boolean;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+declare const Header: FC<HeaderProps>;
+export { HeaderProps, Header };

package/esm/Component-bdb4c6b9.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import React from 'react';
+import { View } from "./typings-bdb4c6b9";
+declare const Modal: React.ForwardRefExoticComponent<import("./index-bdb4c6b9").BaseModalProps & {
+    size?: "s" | "m" | "l" | "xl" | "fullscreen" | undefined;
+    fullscreen?: boolean | undefined;
+    fixedPosition?: boolean | undefined;
+    hasCloser?: boolean | undefined;
+} & {
+    view: View;
+} & React.RefAttributes<HTMLDivElement>>;
+export { Modal };

package/esm/Component-db573794.d.ts

@@ -0,0 +1,33 @@
+import { ButtonHTMLAttributes, ElementType, FC } from 'react';
+import { IconButtonProps } from "./index-ebda875c";
+type CloserProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Позиция крестика
+     */
+    align?: 'left' | 'right';
+    /**
+     * Размер кнопки
+     */
+    size?: IconButtonProps['size'];
+    /**
+     * Фиксирует крестик
+     */
+    sticky?: boolean;
+    /**
+     * Иконка
+     */
+    icon?: ElementType;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+};
+/**
+ * @deprecated Компонент только для внутреннего использования. Используйте <Header />
+ */
+declare const Closer: FC<CloserProps>;
+export { CloserProps, Closer };

package/esm/Component-e67996e9.d.ts

@@ -0,0 +1,168 @@
+/// <reference types="react" />
+import React from 'react';
+import { HTMLAttributes, ReactNode } from "react";
+type FormControlProps = HTMLAttributes<HTMLDivElement> & {
+    /**
+     * Растягивает компонент на ширину контейнера
+     */
+    block?: boolean;
+    /**
+     * Размер компонента
+     */
+    size?: 's' | 'm' | 'l' | 'xl';
+    /**
+     * Набор цветов для компонента
+     */
+    colors?: 'default' | 'inverted';
+    /**
+     * Заблокированное состояние
+     */
+    disabled?: boolean;
+    /**
+     * Cостояние только для чтения
+     */
+    readOnly?: boolean;
+    /**
+     * Заполненное состояние
+     */
+    filled?: boolean;
+    /**
+     * Выбранное (фокус) состояние
+     */
+    focused?: boolean;
+    /**
+     * Отображение ошибки
+     */
+    error?: ReactNode | boolean;
+    /**
+     * Текст подсказки
+     */
+    hint?: ReactNode;
+    /**
+     * Лейбл компонента
+     */
+    label?: ReactNode;
+    /**
+     * Вид лейбла внутри / снаружи
+     */
+    labelView?: 'inner' | 'outer';
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Слот под полем
+     */
+    bottomAddons?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string;
+    /**
+     * Дополнительный класс для поля
+     */
+    fieldClassName?: string;
+    /**
+     * Дополнительный класс для лейбла
+     */
+    labelClassName?: string;
+    /**
+     * Дополнительный класс для аддонов
+     */
+    addonsClassName?: string;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
+    /**
+     * Компонент поля (инпут, textarea и пр.)
+     */
+    children?: ReactNode;
+};
+declare const FormControl: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    /**
+     * Растягивает компонент на ширину контейнера
+     */
+    block?: boolean | undefined;
+    /**
+     * Размер компонента
+     */
+    size?: "s" | "m" | "l" | "xl" | undefined;
+    /**
+     * Набор цветов для компонента
+     */
+    colors?: "default" | "inverted" | undefined;
+    /**
+     * Заблокированное состояние
+     */
+    disabled?: boolean | undefined;
+    /**
+     * Cостояние только для чтения
+     */
+    readOnly?: boolean | undefined;
+    /**
+     * Заполненное состояние
+     */
+    filled?: boolean | undefined;
+    /**
+     * Выбранное (фокус) состояние
+     */
+    focused?: boolean | undefined;
+    /**
+     * Отображение ошибки
+     */
+    error?: ReactNode | boolean;
+    /**
+     * Текст подсказки
+     */
+    hint?: ReactNode;
+    /**
+     * Лейбл компонента
+     */
+    label?: ReactNode;
+    /**
+     * Вид лейбла внутри / снаружи
+     */
+    labelView?: "inner" | "outer" | undefined;
+    /**
+     * Слот слева
+     */
+    leftAddons?: ReactNode;
+    /**
+     * Слот справа
+     */
+    rightAddons?: ReactNode;
+    /**
+     * Слот под полем
+     */
+    bottomAddons?: ReactNode;
+    /**
+     * Дополнительный класс
+     */
+    className?: string | undefined;
+    /**
+     * Дополнительный класс для поля
+     */
+    fieldClassName?: string | undefined;
+    /**
+     * Дополнительный класс для лейбла
+     */
+    labelClassName?: string | undefined;
+    /**
+     * Дополнительный класс для аддонов
+     */
+    addonsClassName?: string | undefined;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string | undefined;
+    /**
+     * Компонент поля (инпут, textarea и пр.)
+     */
+    children?: ReactNode;
+} & React.RefAttributes<HTMLDivElement>>;
+export { FormControlProps, FormControl };