@ozen-ui/kit 0.54.0 → 0.56.0

package/__inner__/esm/components/Tabs/types.d.ts

@@ -1,4 +1,5 @@
-import type { Ref, HTMLAttributes, ReactElement, SyntheticEvent } from 'react';
+import type { Ref, ReactElement, SyntheticEvent, ComponentRef } from 'react';
+import type { ExtendableComponentPropsWithRef } from '../../types/ExtendableComponentPropsWithRef';
 import type { TabProps } from './components';
 export declare const tabsSizeVariant: readonly ["xs", "s", "m", "l"];
 export declare const tabsVariant: readonly ["default", "scrollable"];
@@ -26,7 +27,8 @@ export interface TabsContextValue {
     /** Размер */
     size: TabsSizeVariant;
 }
-export type TabsProps = Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> & {
+export type TabsRef = ComponentRef<'div'>;
+export type TabsProps = ExtendableComponentPropsWithRef<{
     children: ReactElement<TabProps>[] | ReactElement<TabProps>;
     /** Текущее значение */
     value: TabsContextValue['currentValue'];
@@ -40,4 +42,4 @@ export type TabsProps = Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> & {
     ref?: Ref<HTMLDivElement>;
     /** Размер */
     size?: TabsSizeVariant;
-};
+}, 'div'>;

package/__inner__/esm/components/Tag/Tag.d.ts

@@ -1,15 +1,13 @@
 import './Tag.css';
 import type { ElementType, FC } from 'react';
-import type { IconProps, IconSize } from '@ozen-ui/icons';
+import type { IconProps } from '@ozen-ui/icons';
 import { type PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
 import { type RemoveButtonProps } from './components';
 export declare const tagVariant: readonly ["neutral", "action", "error", "warning", "success", "info"];
 export declare const tagSizeVariant: readonly ["2xs", "xs", "s"];
 export type TagVariant = (typeof tagVariant)[number];
 export type TagSizeVariant = (typeof tagSizeVariant)[number];
-export type TagIcon = FC<IconProps & {
-    size?: IconSize;
-}>;
+export type TagIcon = FC<IconProps>;
 export declare const cnTag: import("@bem-react/classname").ClassNameFormatter;
 type TagBaseProps = {
     /** Текст лейбла внутри тега */

package/__inner__/esm/components/Tag/components/RemoveButton/Remove2xsIcon.d.ts

@@ -1,3 +1,2 @@
 import React from 'react';
-import type { IconProps } from '@ozen-ui/icons';
-export declare const Remove2xsIcon: React.FC<IconProps>;
+export declare const Remove2xsIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;

package/__inner__/esm/components/Tag/components/RemoveButton/RemoveButton.d.ts

@@ -1,9 +1,8 @@
-import type { FC } from 'react';
-import type { IconProps } from '@ozen-ui/icons';
+import React from 'react';
+import type { ExtendableComponentPropsWithRef } from '../../../../types/ExtendableComponentPropsWithRef';
 export declare const removeButtonSizeVariant: readonly ["s", "xs", "2xs"];
 export type RemoveButtonSizeVariant = (typeof removeButtonSizeVariant)[number];
-export interface RemoveButtonProps extends IconProps {
+export type RemoveButtonProps = ExtendableComponentPropsWithRef<{
     size: RemoveButtonSizeVariant;
-    className?: string;
-}
-export declare const RemoveButton: FC<RemoveButtonProps>;
+}, 'svg'>;
+export declare const RemoveButton: React.ForwardRefExoticComponent<Omit<RemoveButtonProps, "ref"> & React.RefAttributes<SVGSVGElement>>;

package/__inner__/esm/components/Tag/components/RemoveButton/RemoveButton.js

@@ -9,8 +9,8 @@ var icons = {
     '2xs': Remove2xsIcon,
 };
 export var RemoveButton = forwardRef(function (_a, ref) {
-    var size = _a.size, props = __rest(_a, ["size"]);
+    var size = _a.size, other = __rest(_a, ["size"]);
     var Icon = useMemo(function () { return icons[size]; }, [size]);
-    return React.createElement(Icon, __assign({}, props, { ref: ref }));
+    return React.createElement(Icon, __assign({}, other, { ref: ref }));
 });
 RemoveButton.displayName = 'RemoveButton';

package/__inner__/esm/components/Tag/components/RemoveButton/RemoveSIcon.d.ts

@@ -1,3 +1,2 @@
 import React from 'react';
-import type { IconProps } from '@ozen-ui/icons';
-export declare const RemoveSIcon: React.FC<IconProps>;
+export declare const RemoveSIcon: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;

package/__inner__/esm/components/TagNext/Tag.d.ts

@@ -1,33 +1,4 @@
 import './Tag.css';
-import type { ElementType } from 'react';
-import type { IconProps, IconSize } from '@ozen-ui/icons';
-import type { FormElementSizeVariant } from '../../types/FormElementSizeVariant';
-import { type PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
-import { type RenderContentType } from '../../utils/renderContent';
-export declare const tagVariant: readonly ["primary", "secondary"];
-export declare const tagColorVariant: readonly ["neutral", "action", "error", "warning", "success", "info"];
-export type TagVariant = (typeof tagVariant)[number];
-export type TagColor = (typeof tagColorVariant)[number];
-export type TagIcon = RenderContentType<IconProps & {
-    size?: IconSize;
-}>['content'];
+import type { TagBaseProps } from './index';
 export declare const cnTag: import("@bem-react/classname").ClassNameFormatter;
-type TagBaseProps = {
-    /** Текст лейбла внутри тега */
-    label: string;
-    /** Размер */
-    size?: FormElementSizeVariant;
-    /** Вариант компонента */
-    variant?: TagVariant;
-    /** Цвет компонента */
-    color?: TagColor;
-    /** Если {true} делает компонент интерактивным */
-    interactive?: boolean;
-    /** Иконка слева */
-    iconLeft?: TagIcon;
-    /** Иконка справа */
-    iconRight?: TagIcon;
-};
-export type TagProps<As extends ElementType = 'div'> = PolymorphicComponentPropsWithoutRef<TagBaseProps, As>;
 export declare const Tag: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<TagBaseProps, "div">;
-export {};

package/__inner__/esm/components/TagNext/Tag.js

@@ -4,22 +4,13 @@ import React from 'react';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
 import { getIconSizeToFormElement } from '../../utils/getIconSizeToFormElement';
-import { polymorphicComponentWithRef, } from '../../utils/polymorphicComponentWithRef';
-import { renderContent, } from '../../utils/renderContent';
+import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
+import { renderContent } from '../../utils/renderContent';
 import { TAG_DEFAULT_AS, TAG_DEFAULT_COLOR, TAG_DEFAULT_SIZE, TAG_DEFAULT_VARIANT, } from './constants';
-export var tagVariant = ['primary', 'secondary'];
-export var tagColorVariant = [
-    'neutral',
-    'action',
-    'error',
-    'warning',
-    'success',
-    'info',
-];
 export var cnTag = cn('TagNext');
 export var Tag = polymorphicComponentWithRef(function (inProps, ref) {
     var props = useThemeProps({ props: inProps, name: 'TagNext' });
-    var _a = props.variant, variant = _a === void 0 ? TAG_DEFAULT_VARIANT : _a, _b = props.size, size = _b === void 0 ? TAG_DEFAULT_SIZE : _b, _c = props.as, Tag = _c === void 0 ? TAG_DEFAULT_AS : _c, _d = props.color, color = _d === void 0 ? TAG_DEFAULT_COLOR : _d, interactive = props.interactive, iconLeft = props.iconLeft, iconRight = props.iconRight, label = props.label, className = props.className, other = __rest(props, ["variant", "size", "as", "color", "interactive", "iconLeft", "iconRight", "label", "className"]);
+    var _a = props.color, color = _a === void 0 ? TAG_DEFAULT_COLOR : _a, _b = props.variant, variant = _b === void 0 ? TAG_DEFAULT_VARIANT : _b, _c = props.size, size = _c === void 0 ? TAG_DEFAULT_SIZE : _c, _d = props.as, Tag = _d === void 0 ? TAG_DEFAULT_AS : _d, interactive = props.interactive, iconLeft = props.iconLeft, iconRight = props.iconRight, label = props.label, className = props.className, other = __rest(props, ["color", "variant", "size", "as", "interactive", "iconLeft", "iconRight", "label", "className"]);
     var renderIcon = function (content) {
         return renderContent({
             content: content,

package/__inner__/esm/components/TagNext/index.d.ts

@@ -1 +1,2 @@
 export * from './Tag';
+export * from './types';

package/__inner__/esm/components/TagNext/index.js

@@ -1 +1,2 @@
 export * from './Tag';
+export * from './types';

package/__inner__/esm/components/TagNext/types.d.ts

@@ -0,0 +1,27 @@
+import type { ElementType } from 'react';
+import type { IconProps } from '@ozen-ui/icons';
+import type { FormElementSizeVariant } from '../../types/FormElementSizeVariant';
+import type { PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
+import type { RenderContentType } from '../../utils/renderContent';
+export declare const tagVariant: readonly ["primary", "secondary"];
+export declare const tagColorVariant: readonly ["neutral", "action", "error", "warning", "success", "info"];
+export type TagVariant = (typeof tagVariant)[number];
+export type TagColor = (typeof tagColorVariant)[number];
+export type TagIcon = RenderContentType<IconProps>['content'];
+export type TagBaseProps = {
+    /** Текст лейбла внутри тега */
+    label: string;
+    /** Размер */
+    size?: FormElementSizeVariant;
+    /** Вариант компонента */
+    variant?: TagVariant;
+    /** Цвет компонента */
+    color?: TagColor;
+    /** Если {true} делает компонент интерактивным */
+    interactive?: boolean;
+    /** Иконка слева */
+    iconLeft?: TagIcon;
+    /** Иконка справа */
+    iconRight?: TagIcon;
+};
+export type TagProps<As extends ElementType = 'div'> = PolymorphicComponentPropsWithoutRef<TagBaseProps, As>;

package/__inner__/esm/components/TagNext/types.js

@@ -0,0 +1,9 @@
+export var tagVariant = ['primary', 'secondary'];
+export var tagColorVariant = [
+    'neutral',
+    'action',
+    'error',
+    'warning',
+    'success',
+    'info',
+];

package/__inner__/esm/components/Textarea/types.d.ts

@@ -1,4 +1,5 @@
 import type { ComponentPropsWithRef, Ref } from 'react';
+import type { ExtendableComponentPropsWithRef } from '../../types/ExtendableComponentPropsWithRef';
 import type { FormElementSizeVariant } from '../../types/FormElementSizeVariant';
 import type { FIELD_CONTROL_DEFAULT_TAG } from '../FieldControl';
 import type { FieldHintProps } from '../FieldHint';
@@ -18,8 +19,10 @@ type TextareaPropsDeprecated = {
      * */
     textareaRef?: Ref<HTMLTextAreaElement>;
 };
-type TextareaElement = ComponentPropsWithRef<'textarea'>;
-export type TextareaProps = Omit<ComponentPropsWithRef<typeof FIELD_CONTROL_DEFAULT_TAG>, 'size' | 'onChange'> & {
+type TextareaElement = ComponentPropsWithRef<'textarea'> & {
+    'data-testid'?: string;
+};
+type TextareaBaseProps = {
     /** Атрибут id для элемента input */
     id?: string;
     /** Атрибут name для элемента input */
@@ -59,14 +62,13 @@ export type TextareaProps = Omit<ComponentPropsWithRef<typeof FIELD_CONTROL_DEFA
     /** Обработчик события на изменение значения поля */
     onChange?: TextareaElement['onChange'];
     /** Свойства элемента textarea */
-    textareaProps?: TextareaElement & {
-        'data-testid'?: string;
-    };
+    textareaProps?: TextareaElement;
     /** Свойства FieldLabel */
     labelProps?: FieldLabelProps;
     /** Cвойства FieldHint */
     hintProps?: Omit<FieldHintProps, 'children'>;
     /** data-атрибут для тестирования */
     'data-testid'?: string;
-} & TextareaPropsDeprecated;
+};
+export type TextareaProps = ExtendableComponentPropsWithRef<TextareaBaseProps & TextareaPropsDeprecated, typeof FIELD_CONTROL_DEFAULT_TAG>;
 export {};

package/__inner__/esm/components/ThemeProvider/ThemeProvider.d.ts

@@ -1,16 +1,4 @@
 import './ThemeProvider.css';
-import type { ComponentRef, ElementType } from 'react';
-import React from 'react';
-import { type PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
-import type { Theme } from './types';
-export declare const THEME_DEFAULT_TAG = "div";
-export type ThemeProviderBaseProps = {
-    /** Содержимое компонента */
-    children: React.ReactNode;
-    /** Тема */
-    theme?: Theme;
-};
+import type { ThemeProviderBaseProps } from './index';
 export declare const cnThemeProvider: import("@bem-react/classname").ClassNameFormatter;
-export type ThemeProviderProps<As extends ElementType = typeof THEME_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<ThemeProviderBaseProps, As>;
-export type ThemeProviderRef = ComponentRef<typeof THEME_DEFAULT_TAG>;
 export declare const ThemeProvider: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<ThemeProviderBaseProps, "div">;

package/__inner__/esm/components/ThemeProvider/ThemeProvider.js

@@ -2,9 +2,9 @@ import { __assign, __rest } from "tslib";
 import './ThemeProvider.css';
 import React from 'react';
 import { cn } from '../../utils/classname';
-import { polymorphicComponentWithRef, } from '../../utils/polymorphicComponentWithRef';
+import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
+import { THEME_DEFAULT_TAG } from './constants';
 import { ThemeProviderContext } from './ThemeProviderContext';
-export var THEME_DEFAULT_TAG = 'div';
 export var cnThemeProvider = cn('Theme');
 export var ThemeProvider = polymorphicComponentWithRef(function (_a, ref) {
     var children = _a.children, theme = _a.theme, className = _a.className, _b = _a.as, Tag = _b === void 0 ? THEME_DEFAULT_TAG : _b, other = __rest(_a, ["children", "theme", "className", "as"]);

package/__inner__/esm/components/ThemeProvider/constants.d.ts

@@ -0,0 +1 @@
+export declare const THEME_DEFAULT_TAG = "div";

package/__inner__/esm/components/ThemeProvider/constants.js

@@ -0,0 +1 @@
+export var THEME_DEFAULT_TAG = 'div';

package/__inner__/esm/components/ThemeProvider/types.d.ts

@@ -1,9 +1,13 @@
+import type { ComponentRef, ElementType } from 'react';
+import type React from 'react';
+import type { PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
 import type { AccordionProps, AccordionSummaryProps } from '../Accordion';
 import type { AlertProps } from '../Alert';
 import type { AutocompleteProps } from '../Autocomplete';
 import type { AvatarProps } from '../Avatar';
 import type { BackdropProps } from '../Backdrop';
 import type { BadgeProps } from '../Badge';
+import type { BreadcrumbsProps } from '../Breadcrumbs';
 import type { ButtonProps } from '../Button';
 import type { ButtonProps as ButtonPropsNext } from '../ButtonNext';
 import type { CalendarProps } from '../Calendar';
@@ -54,6 +58,7 @@ import type { TextareaProps } from '../Textarea';
 import type { ToggleProps } from '../Toggle';
 import type { TooltipProps } from '../Tooltip';
 import type { TypographyProps } from '../Typography';
+import type { THEME_DEFAULT_TAG } from './constants';
 export type Theme = {
     tokens: {
         color: string;
@@ -76,6 +81,7 @@ export type Theme = {
         Avatar?: Partial<AvatarProps>;
         Backdrop?: Partial<BackdropProps>;
         Badge?: Partial<BadgeProps>;
+        Breadcrumbs?: Partial<BreadcrumbsProps>;
         Button?: Partial<ButtonProps>;
         ButtonNext?: Partial<ButtonPropsNext>;
         Calendar?: Partial<CalendarProps>;
@@ -136,3 +142,11 @@ export type Theme = {
         Typography?: Partial<TypographyProps>;
     };
 };
+export type ThemeProviderBaseProps = {
+    /** Содержимое компонента */
+    children: React.ReactNode;
+    /** Тема */
+    theme?: Theme;
+};
+export type ThemeProviderProps<As extends ElementType = typeof THEME_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<ThemeProviderBaseProps, As>;
+export type ThemeProviderRef = ComponentRef<typeof THEME_DEFAULT_TAG>;

package/__inner__/esm/components/Toggle/Toggle.d.ts

@@ -1,31 +1,5 @@
 import './Toggle.css';
 import React from 'react';
-import type { InputHTMLAttributes, Ref } from 'react';
-import { type FormControlLabelProps } from '../FormControlLabel';
-export declare const toggleSizeVariant: readonly ["2xs", "xs", "s", "m", "l"];
-export type ToggleSizeVariant = (typeof toggleSizeVariant)[number];
-export type ToggleProps = {
-    /** Размер */
-    size?: ToggleSizeVariant;
-    /** Если {true} делает элемент неактивным */
-    disabled?: boolean;
-    /** Если {true} делает элемент выбранным */
-    checked?: boolean;
-    /** Расположение лейбла */
-    align?: FormControlLabelProps['align'];
-    /** Лейбл */
-    label?: React.ReactNode;
-    /** Позиция лейбла */
-    labelPlacement?: FormControlLabelProps['labelPlacement'];
-    /** Свойства лейбла */
-    labelProps?: FormControlLabelProps;
-    /** Ссылка на корневой DOM-элемент компонента */
-    ref?: Ref<HTMLLabelElement>;
-    /** Ссылка на input-элемент в компоненте */
-    inputRef?: Ref<HTMLInputElement>;
-    /** Кастомный класс */
-    className?: string;
-    children?: never;
-} & Omit<InputHTMLAttributes<HTMLInputElement>, 'size'>;
+import type { ToggleProps } from './index';
 export declare const cnToggle: import("@bem-react/classname").ClassNameFormatter;
 export declare const Toggle: React.ForwardRefExoticComponent<Omit<ToggleProps, "ref"> & React.RefAttributes<HTMLLabelElement>>;

package/__inner__/esm/components/Toggle/Toggle.js

@@ -3,10 +3,8 @@ import './Toggle.css';
 import React, { forwardRef } from 'react';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
-import { FormControlLabel, } from '../FormControlLabel';
-export var toggleSizeVariant = ['2xs', 'xs', 's', 'm', 'l'];
+import { FormControlLabel } from '../FormControlLabel';
 export var cnToggle = cn('Toggle');
-// TODO: Switch (без тега label) как самостоятельный компонент
 export var Toggle = forwardRef(function (inProps, ref) {
     var props = useThemeProps({
         props: inProps,

package/__inner__/esm/components/Toggle/index.d.ts

@@ -1 +1,2 @@
 export * from './Toggle';
+export * from './types';

package/__inner__/esm/components/Toggle/index.js

@@ -1 +1,2 @@
 export * from './Toggle';
+export * from './types';

package/__inner__/esm/components/Toggle/types.d.ts

@@ -0,0 +1,29 @@
+import type { ComponentRef, Ref, ReactNode } from 'react';
+import type { ExtendableComponentPropsWithRef } from '../../types/ExtendableComponentPropsWithRef';
+import type { FormElementSizeVariant } from '../../types/FormElementSizeVariant';
+import type { FormControlLabelProps } from '../FormControlLabel';
+export type ToggleSizeVariant = FormElementSizeVariant;
+export type ToggleRef = ComponentRef<'label'>;
+export type ToggleProps = ExtendableComponentPropsWithRef<{
+    /** Размер */
+    size?: ToggleSizeVariant;
+    /** Если {true} делает элемент неактивным */
+    disabled?: boolean;
+    /** Если {true} делает элемент выбранным */
+    checked?: boolean;
+    /** Расположение лейбла */
+    align?: FormControlLabelProps['align'];
+    /** Лейбл */
+    label?: ReactNode;
+    /** Позиция лейбла */
+    labelPlacement?: FormControlLabelProps['labelPlacement'];
+    /** Свойства лейбла */
+    labelProps?: FormControlLabelProps;
+    /** Ссылка на корневой DOM-элемент компонента */
+    ref?: Ref<HTMLLabelElement>;
+    /** Ссылка на input-элемент в компоненте */
+    inputRef?: Ref<HTMLInputElement>;
+    /** Кастомный класс */
+    className?: string;
+    children?: never;
+}, 'input'>;

package/__inner__/esm/components/Toggle/types.js

@@ -0,0 +1 @@
+export {};

package/__inner__/esm/components/Typography/Typography.d.ts

@@ -1,34 +1,4 @@
 import './Typography.css';
-import type { ElementType, ReactNode } from 'react';
-import type { PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
-export declare const typographyVariant: readonly ["heading-4xl", "heading-3xl", "heading-2xl", "heading-xl", "heading-l", "text-4xl", "text-4xl_1", "text-3xl", "text-3xl_1", "text-2xl", "text-2xl_1", "text-xl", "text-xl_1", "text-l", "text-l_1", "text-m", "text-m_1", "text-s", "text-s_1", "text-xs", "text-xs_1", "text-2xs", "text-2xs_1", "text-3xs", "text-3xs_1", "caption-3xs", "caption-3xs_1", "inherit"];
-export type TypographyVariant = (typeof typographyVariant)[number];
-export declare const typographyDisplayVariant: readonly ["block", "inline", "inlineBlock"];
-export type TypographyDisplayVariant = (typeof typographyDisplayVariant)[number];
-export declare const typographyAlignVariant: readonly ["left", "center", "right", "initial", "inherit"];
-export type TypographyAlignVariant = (typeof typographyAlignVariant)[number];
-export declare const typographyColorVariant: readonly ["primary", "secondary", "tertiary", "disabled", "ghostDisabled", "action", "actionPressed", "actionHover", "actionDark", "actionOn", "error", "errorHover", "errorPressed", "errorDark", "warning", "warningHover", "warningPressed", "warningDark", "success", "successHover", "successDark", "successPressed", "info", "infoHover", "infoPressed", "infoDark", "primaryInverse", "accentPrimary", "accentSecondary", "accentDisabled", "inherit"];
-export type TypographyColorVariant = (typeof typographyColorVariant)[number];
-export type TypographyBaseProps = {
-    /** Вариант типографики */
-    variant?: TypographyVariant;
-    /** Цвет текста */
-    color?: TypographyColorVariant;
-    /** Если {true} добавляет отступы */
-    defaultMargin?: boolean;
-    /** Выравнивание */
-    align?: TypographyAlignVariant;
-    /** Если {true} сокращает длинный текст */
-    noWrap?: boolean;
-    /** Задает поведение контейнера с типографикой в документе */
-    display?: TypographyDisplayVariant;
-    /** Содержимое компонента */
-    children?: ReactNode;
-    /** Дополнительные СSS-классы */
-    className?: string;
-    /** Идентификатор компонента для тестов */
-    'data-testid'?: string;
-};
-export type TypographyProps<As extends ElementType = 'p'> = PolymorphicComponentPropsWithoutRef<TypographyBaseProps, As>;
+import type { TypographyBaseProps } from './index';
 export declare const cnTypography: import("@bem-react/classname").ClassNameFormatter;
 export declare const Typography: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<TypographyBaseProps, "div">;

package/__inner__/esm/components/Typography/Typography.js

@@ -6,81 +6,6 @@ import { cn } from '../../utils/classname';
 import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
 import { TYPOGRAPHY_DEFAULT_COLOR, TYPOGRAPHY_DEFAULT_DEFAULT_MARGIN, TYPOGRAPHY_DEFAULT_NO_WRAP, TYPOGRAPHY_DEFAULT_VARIANT, } from './constants';
 import { matchVariantToTag } from './utils';
-export var typographyVariant = [
-    'heading-4xl',
-    'heading-3xl',
-    'heading-2xl',
-    'heading-xl',
-    'heading-l',
-    'text-4xl',
-    'text-4xl_1',
-    'text-3xl',
-    'text-3xl_1',
-    'text-2xl',
-    'text-2xl_1',
-    'text-xl',
-    'text-xl_1',
-    'text-l',
-    'text-l_1',
-    'text-m',
-    'text-m_1',
-    'text-s',
-    'text-s_1',
-    'text-xs',
-    'text-xs_1',
-    'text-2xs',
-    'text-2xs_1',
-    'text-3xs',
-    'text-3xs_1',
-    'caption-3xs',
-    'caption-3xs_1',
-    'inherit',
-];
-export var typographyDisplayVariant = [
-    'block',
-    'inline',
-    'inlineBlock',
-];
-export var typographyAlignVariant = [
-    'left',
-    'center',
-    'right',
-    'initial',
-    'inherit',
-];
-export var typographyColorVariant = [
-    'primary',
-    'secondary',
-    'tertiary',
-    'disabled',
-    'ghostDisabled',
-    'action',
-    'actionPressed',
-    'actionHover',
-    'actionDark',
-    'actionOn',
-    'error',
-    'errorHover',
-    'errorPressed',
-    'errorDark',
-    'warning',
-    'warningHover',
-    'warningPressed',
-    'warningDark',
-    'success',
-    'successHover',
-    'successDark',
-    'successPressed',
-    'info',
-    'infoHover',
-    'infoPressed',
-    'infoDark',
-    'primaryInverse',
-    'accentPrimary',
-    'accentSecondary',
-    'accentDisabled',
-    'inherit',
-];
 export var cnTypography = cn('Typography');
 export var Typography = polymorphicComponentWithRef(function (inProps, ref) {
     var props = useThemeProps({

package/__inner__/esm/components/Typography/index.d.ts

@@ -1 +1,2 @@
 export * from './Typography';
+export * from './types';

package/__inner__/esm/components/Typography/index.js

@@ -1 +1,2 @@
 export * from './Typography';
+export * from './types';

package/__inner__/esm/components/Typography/types.d.ts

@@ -0,0 +1,31 @@
+import type { ElementType, ReactNode } from 'react';
+import type { PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
+export declare const typographyVariant: readonly ["heading-4xl", "heading-3xl", "heading-2xl", "heading-xl", "heading-l", "text-4xl", "text-4xl_1", "text-3xl", "text-3xl_1", "text-2xl", "text-2xl_1", "text-xl", "text-xl_1", "text-l", "text-l_1", "text-m", "text-m_1", "text-s", "text-s_1", "text-xs", "text-xs_1", "text-2xs", "text-2xs_1", "text-3xs", "text-3xs_1", "caption-3xs", "caption-3xs_1", "inherit"];
+export type TypographyVariant = (typeof typographyVariant)[number];
+export declare const typographyDisplayVariant: readonly ["block", "inline", "inlineBlock"];
+export type TypographyDisplayVariant = (typeof typographyDisplayVariant)[number];
+export declare const typographyAlignVariant: readonly ["left", "center", "right", "initial", "inherit"];
+export type TypographyAlignVariant = (typeof typographyAlignVariant)[number];
+export declare const typographyColorVariant: readonly ["primary", "secondary", "tertiary", "disabled", "ghostDisabled", "action", "actionPressed", "actionHover", "actionDark", "actionOn", "error", "errorHover", "errorPressed", "errorDark", "warning", "warningHover", "warningPressed", "warningDark", "success", "successHover", "successDark", "successPressed", "info", "infoHover", "infoPressed", "infoDark", "primaryInverse", "accentPrimary", "accentSecondary", "accentDisabled", "inherit"];
+export type TypographyColorVariant = (typeof typographyColorVariant)[number];
+export type TypographyBaseProps = {
+    /** Вариант типографики */
+    variant?: TypographyVariant;
+    /** Цвет текста */
+    color?: TypographyColorVariant;
+    /** Если {true} добавляет отступы */
+    defaultMargin?: boolean;
+    /** Выравнивание */
+    align?: TypographyAlignVariant;
+    /** Если {true} сокращает длинный текст */
+    noWrap?: boolean;
+    /** Задает поведение контейнера с типографикой в документе */
+    display?: TypographyDisplayVariant;
+    /** Содержимое компонента */
+    children?: ReactNode;
+    /** Дополнительные СSS-классы */
+    className?: string;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+};
+export type TypographyProps<As extends ElementType = 'p'> = PolymorphicComponentPropsWithoutRef<TypographyBaseProps, As>;

package/__inner__/esm/components/Typography/types.js

@@ -0,0 +1,75 @@
+export var typographyVariant = [
+    'heading-4xl',
+    'heading-3xl',
+    'heading-2xl',
+    'heading-xl',
+    'heading-l',
+    'text-4xl',
+    'text-4xl_1',
+    'text-3xl',
+    'text-3xl_1',
+    'text-2xl',
+    'text-2xl_1',
+    'text-xl',
+    'text-xl_1',
+    'text-l',
+    'text-l_1',
+    'text-m',
+    'text-m_1',
+    'text-s',
+    'text-s_1',
+    'text-xs',
+    'text-xs_1',
+    'text-2xs',
+    'text-2xs_1',
+    'text-3xs',
+    'text-3xs_1',
+    'caption-3xs',
+    'caption-3xs_1',
+    'inherit',
+];
+export var typographyDisplayVariant = [
+    'block',
+    'inline',
+    'inlineBlock',
+];
+export var typographyAlignVariant = [
+    'left',
+    'center',
+    'right',
+    'initial',
+    'inherit',
+];
+export var typographyColorVariant = [
+    'primary',
+    'secondary',
+    'tertiary',
+    'disabled',
+    'ghostDisabled',
+    'action',
+    'actionPressed',
+    'actionHover',
+    'actionDark',
+    'actionOn',
+    'error',
+    'errorHover',
+    'errorPressed',
+    'errorDark',
+    'warning',
+    'warningHover',
+    'warningPressed',
+    'warningDark',
+    'success',
+    'successHover',
+    'successDark',
+    'successPressed',
+    'info',
+    'infoHover',
+    'infoPressed',
+    'infoDark',
+    'primaryInverse',
+    'accentPrimary',
+    'accentSecondary',
+    'accentDisabled',
+    'inherit',
+];