@ozen-ui/kit 0.0.1

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

@@ -0,0 +1,64 @@
+import type { HTMLAttributes, Ref, ComponentPropsWithRef, ChangeEvent, MouseEvent } from 'react';
+import type { FormElementSizeVariant } from '../../types/FormElementSizeVariant';
+import type { FieldIconProps } from '../FieldIcon';
+import type { FieldLabelProps } from '../FieldLabel';
+export type InputNumberSizeVariant = FormElementSizeVariant;
+export type InputElement = ComponentPropsWithRef<'input'>;
+export type InputNumberEmptyValue = '';
+export type InputNumberValue = number | InputNumberEmptyValue;
+export type InputNumberCountDirection = 'increment' | 'decrement';
+export type InputNumberProps = {
+    /** Атрибут id для элемента input */
+    id?: string;
+    /** Атрибут name для элемента input */
+    name?: string;
+    /** Лейбл */
+    label?: string;
+    /** Размер компонента */
+    size?: InputNumberSizeVariant;
+    /** Подсказка. Отображается, когда вариант не выбран */
+    placeholder?: string;
+    /** Если {true} устанавливает автофокус */
+    autoFocus?: boolean;
+    /** Если {true} переводит поле в состояние ошибки */
+    error?: boolean;
+    /** Если {true} растягивает поле на всю ширину */
+    fullWidth?: boolean;
+    /** Дополнительное описание к полю */
+    hint?: string | null | undefined;
+    /** Если {true} делает элемент неактивным */
+    disabled?: boolean;
+    /** Если {true} делает элемент обязательным к заполнению */
+    required?: boolean;
+    /** Текст или иконка слева */
+    renderLeft?: FieldIconProps['icon'];
+    /** Текст или иконка справа */
+    renderRight?: FieldIconProps['icon'];
+    /** Выбранное значение */
+    value?: InputNumberValue;
+    /** Значение по умолчанию */
+    defaultValue?: InputNumberValue;
+    /** Обработчик события на изменение значения поля */
+    onChange?: (e: ChangeEvent<HTMLInputElement> | MouseEvent<HTMLButtonElement> | null, payload: {
+        name?: string;
+        id?: string;
+        value: InputNumberValue;
+    }) => void;
+    /** Свойства элемента input */
+    inputProps?: InputElement & {
+        'data-testid'?: string;
+    };
+    /** Ссылка на FieldLabel */
+    labelRef?: FieldLabelProps['ref'];
+    /** Свойства FieldLabel */
+    labelProps?: FieldLabelProps;
+    /** Шаг инкремента/декремента */
+    step?: number;
+    /** Минимально допустимое значение */
+    min?: number;
+    /** Максимально допустимое значение */
+    max?: number;
+    /** Ссылка на корневой DOM-элемент компонента */
+    ref?: Ref<HTMLDivElement>;
+    'data-testid'?: string;
+} & Omit<HTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'>;

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

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

package/__inner__/esm/components/InputNumber/utils.d.ts

@@ -0,0 +1,11 @@
+import { KeyboardEvent } from 'react';
+import { InputNumberValue, InputNumberCountDirection } from './types';
+export declare const isValidValue: (value?: InputNumberValue) => boolean;
+export declare const isInputInvalid: (event: KeyboardEvent<HTMLInputElement>) => boolean;
+export declare const getValue: ({ value, step, min, max, countDirection, }: {
+    value?: InputNumberValue | undefined;
+    countDirection: InputNumberCountDirection;
+    min: number;
+    max: number;
+    step: number;
+}) => InputNumberValue;

package/__inner__/esm/components/InputNumber/utils.js

@@ -0,0 +1,23 @@
+import { Decimal } from 'decimal.js';
+import { isNumber } from '../../utils/isNumber';
+export var isValidValue = function (value) {
+    return value !== '' && !Number.isNaN(value) && isNumber(value);
+};
+export var isInputInvalid = function (event) {
+    var ctrlKey = event.ctrlKey, metaKey = event.metaKey, key = event.key;
+    // проверка на длину кода нужна для того, чтобы не проверять
+    // нажатия по служебным клавишам (ArrowUp, ArrowDown, etc.)
+    return !(ctrlKey || metaKey) && key.length === 1 && !!key.match(/[A-Za-z]/g);
+};
+export var getValue = function (_a) {
+    var value = _a.value, step = _a.step, min = _a.min, max = _a.max, countDirection = _a.countDirection;
+    if (typeof value === 'undefined') {
+        return '';
+    }
+    var isIncrement = countDirection === 'increment';
+    var currentValue = isValidValue(value) ? value : min;
+    var nextValue = isIncrement
+        ? Decimal.add(currentValue, step).toNumber()
+        : Decimal.sub(currentValue, step).toNumber();
+    return isIncrement ? Math.min(nextValue, max) : Math.max(nextValue, min);
+};

package/__inner__/esm/components/Link/Link.css

@@ -0,0 +1,19 @@
+.Link {
+  border: none;
+  background-color: transparent;
+  outline: 0;
+  padding: 0;
+  cursor: pointer;
+  text-decoration: underline;
+  border-radius: var(--border-radius-xs);
+  transition: color var(--transition-default);
+}
+
+  .Link:focus {
+    outline: 0;
+    box-shadow: var(--shadow-outline-focused);
+  }
+
+  .Link:focus:not(:focus-visible) {
+    box-shadow: none;
+  }

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

@@ -0,0 +1,7 @@
+import './Link.css';
+import { ElementType } from 'react';
+import { type PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
+import { type TypographyBaseProps } from '../Typography';
+export type LinkBaseProps = Pick<TypographyBaseProps, 'variant' | 'display' | 'defaultMargin' | 'children' | 'noWrap' | 'align'>;
+export type LinkProps<As extends ElementType = 'a'> = PolymorphicComponentPropsWithoutRef<LinkBaseProps, As>;
+export declare const Link: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<LinkBaseProps, "a">;

package/__inner__/esm/components/Link/Link.js

@@ -0,0 +1,25 @@
+import { __assign, __rest } from "tslib";
+import './Link.css';
+import React from 'react';
+import { classnames } from '@bem-react/classnames';
+import { useThemeProps } from '../../hooks/useThemeProps';
+import { cn } from '../../utils/classname';
+import { polymorphicComponentWithRef, } from '../../utils/polymorphicComponentWithRef';
+import { cnTypography } from '../Typography';
+var cnLink = cn('Link');
+export var Link = polymorphicComponentWithRef(function (inProps, ref) {
+    var props = useThemeProps({
+        props: inProps,
+        name: 'Link'
+    });
+    var _a = props.variant, variant = _a === void 0 ? 'text-m' : _a, _b = props.as, Tag = _b === void 0 ? 'a' : _b, display = props.display, noWrap = props.noWrap, align = props.align, defaultMargin = props.defaultMargin, children = props.children, className = props.className, other = __rest(props, ["variant", "as", "display", "noWrap", "align", "defaultMargin", "children", "className"]);
+    return (React.createElement(Tag, __assign({ className: classnames(cnLink(), cnTypography({
+            variant: variant,
+            display: display,
+            defaultMargin: defaultMargin,
+            align: align,
+            noWrap: noWrap,
+            link: true
+        }), className) }, other, { ref: ref }), children));
+});
+Link.displayName = 'Link';

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

@@ -0,0 +1 @@
+export * from './Link';

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

@@ -0,0 +1 @@
+export * from './Link';

package/__inner__/esm/components/List/List.css

@@ -0,0 +1,78 @@
+.List {
+  --list-item-border-radius: var(--border-radius-xs);
+  --list-pipka-background-color: var(--color-content-action);
+  --list-pipka-border-radius: 0 var(--border-radius-xs) var(--border-radius-xs)
+    0;
+  display: flex;
+  flex-direction: column;
+  gap: var(--list-gap);
+  padding: var(--list-gutter) 0;
+  margin: 0;
+  outline: none;
+}
+
+  .List_size_2xs,
+    .List_size_xs,
+    .List_size_s {
+      --list-gap: 2px;
+    }
+
+  .List_size_m,
+    .List_size_l {
+      --list-gap: 4px;
+    }
+
+  .List_size_2xs {
+      --list-gutter: var(--space-xs);
+      --list-item-min-height: 32px;
+      --list-item-icon-min-width: 16px;
+      --list-item-avatar-min-width: 16px;
+      --list-item-padding: 0 8px;
+      --list-item-children-margin-right: 8px;
+      --list-pipka-height: 32px;
+      --list-pipka-width: 4px;
+    }
+
+  .List_size_xs {
+      --list-gutter: var(--space-xs);
+      --list-item-min-height: 40px;
+      --list-item-icon-min-width: 16px;
+      --list-item-avatar-min-width: 24px;
+      --list-item-padding: 4px 8px;
+      --list-item-children-margin-right: 8px;
+      --list-pipka-height: 40px;
+      --list-pipka-width: 4px;
+    }
+
+  .List_size_s {
+      --list-gutter: var(--space-xs);
+      --list-item-min-height: 48px;
+      --list-item-icon-min-width: 16px;
+      --list-item-avatar-min-width: 32px;
+      --list-item-padding: 6px 12px;
+      --list-item-children-margin-right: 12px;
+      --list-pipka-height: 40px;
+      --list-pipka-width: 4px;
+    }
+
+  .List_size_m {
+      --list-gutter: var(--space-s);
+      --list-item-min-height: 56px;
+      --list-item-icon-min-width: 24px;
+      --list-item-avatar-min-width: 40px;
+      --list-item-padding: 8px 12px;
+      --list-item-children-margin-right: 12px;
+      --list-pipka-height: 48px;
+      --list-pipka-width: 4px;
+    }
+
+  .List_size_l {
+      --list-gutter: var(--space-s);
+      --list-item-min-height: 64px;
+      --list-item-icon-min-width: 24px;
+      --list-item-avatar-min-width: 48px;
+      --list-item-padding: 8px 16px;
+      --list-item-children-margin-right: 16px;
+      --list-pipka-height: 48px;
+      --list-pipka-width: 4px;
+    }

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

@@ -0,0 +1,4 @@
+import './List.css';
+import type { ListBaseProps } from './types';
+export declare const cnList: import("@bem-react/classname").ClassNameFormatter;
+export declare const List: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<ListBaseProps, "ul">;

package/__inner__/esm/components/List/List.js

@@ -0,0 +1,16 @@
+import { __assign, __rest } from "tslib";
+import './List.css';
+import React from 'react';
+import { useThemeProps } from '../../hooks/useThemeProps';
+import { cn } from '../../utils/classname';
+import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
+import { LIST_DEFAULT_SIZE, LIST_DEFAULT_TAG } from './constants';
+import { ListContext } from './ListContext';
+export var cnList = cn('List');
+export var List = polymorphicComponentWithRef(function (inProps, ref) {
+    var props = useThemeProps({ props: inProps, name: 'List' });
+    var _a = props.as, Tag = _a === void 0 ? LIST_DEFAULT_TAG : _a, _b = props.size, size = _b === void 0 ? LIST_DEFAULT_SIZE : _b, children = props.children, className = props.className, other = __rest(props, ["as", "size", "children", "className"]);
+    return (React.createElement(ListContext.Provider, { value: { size: size } },
+        React.createElement(Tag, __assign({ className: cnList({ size: size }, [className]) }, other, { ref: ref }), children)));
+});
+List.displayName = 'List';

package/__inner__/esm/components/List/ListContext.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ListContextValue } from './types';
+export declare const ListContext: React.Context<ListContextValue>;
+export declare const useListContext: () => ListContextValue;

package/__inner__/esm/components/List/ListContext.js

@@ -0,0 +1,10 @@
+import React, { useContext } from 'react';
+import { LIST_DEFAULT_SIZE } from './constants';
+export var ListContext = React.createContext({
+    size: LIST_DEFAULT_SIZE
+});
+export var useListContext = function () { return useContext(ListContext); };
+// Именованный провайдер
+if (process.env.NODE_ENV !== 'production') {
+    ListContext.displayName = 'ListContext';
+}

package/__inner__/esm/components/List/components/ListItem/ListItem.css

@@ -0,0 +1,20 @@
+.ListItem {
+  display: flex;
+  align-items: center;
+  min-block-size: var(--list-item-min-height);
+  padding: var(--list-item-padding);
+  border-radius: var(--list-item-border-radius);
+  color: var(--color-content-primary);
+  box-sizing: border-box;
+  flex-shrink: 0;
+  margin: 0 var(--list-gutter);
+}
+
+  .ListItem_disableGutters {
+    padding: 0;
+  }
+
+.ListItem > .ListItemButton {
+  inline-size: 100%;
+  margin: 0;
+}

package/__inner__/esm/components/List/components/ListItem/ListItem.d.ts

@@ -0,0 +1,14 @@
+import './ListItem.css';
+import { ElementType } from 'react';
+import type { ReactNode } from 'react';
+import { type PolymorphicComponentPropsWithoutRef } from '../../../../utils/polymorphicComponentWithRef';
+import { LIST_ITEM_DEFAULT_TAG } from '../../constants';
+export declare const cnListItem: import("@bem-react/classname").ClassNameFormatter;
+export type ListItemBaseProps = {
+    /** Содержимое компонента */
+    children: ReactNode;
+    /** Если {true} убирает отступы вокруг корневого элемента */
+    disableGutters?: boolean;
+};
+export type ListItemProps<As extends ElementType = typeof LIST_ITEM_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<ListItemBaseProps, As>;
+export declare const ListItem: import("../../../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<ListItemBaseProps, "li">;

package/__inner__/esm/components/List/components/ListItem/ListItem.js

@@ -0,0 +1,14 @@
+import { __assign, __rest } from "tslib";
+import './ListItem.css';
+import React from 'react';
+import { useThemeProps } from '../../../../hooks/useThemeProps';
+import { cn } from '../../../../utils/classname';
+import { polymorphicComponentWithRef, } from '../../../../utils/polymorphicComponentWithRef';
+import { LIST_ITEM_DEFAULT_TAG } from '../../constants';
+export var cnListItem = cn('ListItem');
+export var ListItem = polymorphicComponentWithRef(function (inProps, ref) {
+    var props = useThemeProps({ props: inProps, name: 'ListItem' });
+    var _a = props.as, Tag = _a === void 0 ? LIST_ITEM_DEFAULT_TAG : _a, children = props.children, className = props.className, disableGutters = props.disableGutters, other = __rest(props, ["as", "children", "className", "disableGutters"]);
+    return (React.createElement(Tag, __assign({ className: cnListItem({ disableGutters: disableGutters }, [className]) }, other, { ref: ref }), children));
+});
+ListItem.displayName = 'ListItem';

package/__inner__/esm/components/List/components/ListItem/index.d.ts

@@ -0,0 +1 @@
+export * from './ListItem';

package/__inner__/esm/components/List/components/ListItem/index.js

@@ -0,0 +1 @@
+export * from './ListItem';

package/__inner__/esm/components/List/components/ListItemButton/ListItemButton.css

@@ -0,0 +1,57 @@
+.ListItemButton {
+  inline-size: calc(100% - 2 * var(--list-gutter));
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  box-sizing: border-box;
+  min-block-size: var(--list-item-min-height);
+  padding: var(--list-item-padding);
+  color: var(--color-content-primary);
+  outline: none;
+  text-decoration: none;
+  border-radius: var(--list-item-border-radius);
+  transition: background-color var(--transition-default);
+  text-align: start;
+  background-color: transparent;
+  cursor: pointer;
+  overflow: hidden;
+  -webkit-tap-highlight-color: transparent;
+  margin: 0 var(--list-gutter);
+  border: none;
+}
+
+  .ListItemButton:hover {
+    background-color: var(--color-background-main-hover);
+  }
+
+  .ListItemButton:active {
+    background-color: var(--color-background-main-pressed);
+  }
+
+  .ListItemButton:focus {
+    box-shadow: inset var(--shadow-outline-focused);
+  }
+
+  .ListItemButton:focus:not(:focus-visible) {
+    box-shadow: none;
+  }
+
+  .ListItemButton_disabled {
+    pointer-events: none;
+    color: var(--color-content-tertiary);
+  }
+
+  .ListItemButton_disabled .ListItemText-TextPrimary,
+    .ListItemButton_disabled .ListItemText-TextSecondary {
+      color: var(--color-content-tertiary);
+    }
+
+  .ListItemButton_selected::after {
+    content: '';
+    inline-size: var(--list-pipka-width);
+    block-size: var(--list-pipka-height);
+    background-color: var(--list-pipka-background-color);
+    border-radius: var(--list-pipka-border-radius);
+    position: absolute;
+    inset-inline-start: 0;
+  }

package/__inner__/esm/components/List/components/ListItemButton/ListItemButton.d.ts

@@ -0,0 +1,15 @@
+import './ListItemButton.css';
+import { ElementType } from 'react';
+import type { ReactNode } from 'react';
+import { type PolymorphicComponentPropsWithoutRef } from '../../../../utils/polymorphicComponentWithRef';
+import { LIST_ITEM_BUTTON_DEFAULT_TAG } from '../../constants';
+export declare const cnListItemButton: import("@bem-react/classname").ClassNameFormatter;
+export type ListItemButtonBaseProps = {
+    /** Содержимое компонента */
+    children?: ReactNode;
+    /** Если {true} делает элемент неактивным */
+    disabled?: boolean;
+    'data-testid'?: string;
+};
+export type ListItemButtonProps<As extends ElementType = typeof LIST_ITEM_BUTTON_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<ListItemButtonBaseProps, As>;
+export declare const ListItemButton: import("../../../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<ListItemButtonBaseProps, "div">;

package/__inner__/esm/components/List/components/ListItemButton/ListItemButton.js

@@ -0,0 +1,44 @@
+import { __assign, __rest } from "tslib";
+import './ListItemButton.css';
+import React, { useMemo } from 'react';
+import { useThemeProps } from '../../../../hooks/useThemeProps';
+import { cn } from '../../../../utils/classname';
+import { isKey } from '../../../../utils/isKey';
+import { polymorphicComponentWithRef, } from '../../../../utils/polymorphicComponentWithRef';
+import { LIST_ITEM_BUTTON_DEFAULT_TAG } from '../../constants';
+export var cnListItemButton = cn('ListItemButton');
+export var ListItemButton = polymorphicComponentWithRef(function (inProps, ref) {
+    var props = useThemeProps({ props: inProps, name: 'ListItemButton' });
+    var _a = props.as, Tag = _a === void 0 ? LIST_ITEM_BUTTON_DEFAULT_TAG : _a, children = props.children, disabled = props.disabled, className = props.className, onClick = props.onClick, tabIndexProp = props.tabIndex, onKeyDownProp = props.onKeyDown, other = __rest(props, ["as", "children", "disabled", "className", "onClick", "tabIndex", "onKeyDown"]);
+    var tabIndex = useMemo(function () { return (!disabled ? 0 : -1); }, [disabled]);
+    var handleClick = function (event) {
+        if (!disabled)
+            onClick === null || onClick === void 0 ? void 0 : onClick(event);
+    };
+    var handleKeyDown = function (event) {
+        if (isKey(event, 'Enter') || isKey(event, 'Space')) {
+            event.preventDefault();
+            handleClick === null || handleClick === void 0 ? void 0 : handleClick(event);
+        }
+        onKeyDownProp === null || onKeyDownProp === void 0 ? void 0 : onKeyDownProp(event);
+    };
+    // TODO: Вынести логику в ButtonBase
+    var additionalTagProps = useMemo(function () {
+        if (Tag === 'button')
+            return {
+                onKeyDown: onKeyDownProp
+            };
+        var commonAdditionalProps = {
+            role: 'button',
+            onKeyDown: onKeyDownProp
+        };
+        if (Tag === 'div') {
+            return __assign(__assign({}, commonAdditionalProps), { onKeyDown: handleKeyDown });
+        }
+        return commonAdditionalProps;
+    }, [Tag, handleKeyDown]);
+    return (React.createElement(Tag, __assign({ className: cnListItemButton({
+            disabled: disabled
+        }, [className]), onClick: handleClick, tabIndex: tabIndexProp || tabIndex }, additionalTagProps, other, { ref: ref }), children));
+});
+ListItemButton.displayName = 'ListItemButton';

package/__inner__/esm/components/List/components/ListItemButton/index.d.ts

@@ -0,0 +1 @@
+export * from './ListItemButton';

package/__inner__/esm/components/List/components/ListItemButton/index.js

@@ -0,0 +1 @@
+export * from './ListItemButton';

package/__inner__/esm/components/List/components/ListItemIcon/ListItemIcon.css

@@ -0,0 +1,16 @@
+.ListItemIcon {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  justify-content: center;
+  margin-inline-end: var(--list-item-children-margin-right);
+  min-inline-size: var(--list-item-icon-min-width);
+}
+
+  .ListItemIcon_disableMargin {
+    margin: 0;
+  }
+
+  .ListItemIcon:last-child {
+    margin-inline-end: 0;
+  }

package/__inner__/esm/components/List/components/ListItemIcon/ListItemIcon.d.ts

@@ -0,0 +1,16 @@
+import './ListItemIcon.css';
+import React from 'react';
+import type { HTMLAttributes } from 'react';
+export declare const cnListItemIcon: import("@bem-react/classname").ClassNameFormatter;
+export type ListItemIconProps = {
+    /** Содержимое компонента */
+    children?: React.ReactNode;
+    /** Если {true} убирает внешние отступы вокруг корневого элемента */
+    disableMargin?: boolean;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const ListItemIcon: React.ForwardRefExoticComponent<{
+    /** Содержимое компонента */
+    children?: React.ReactNode;
+    /** Если {true} убирает внешние отступы вокруг корневого элемента */
+    disableMargin?: boolean | undefined;
+} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/List/components/ListItemIcon/ListItemIcon.js

@@ -0,0 +1,10 @@
+import { __assign, __rest } from "tslib";
+import './ListItemIcon.css';
+import React, { forwardRef } from 'react';
+import { cn } from '../../../../utils/classname';
+export var cnListItemIcon = cn('ListItemIcon');
+export var ListItemIcon = forwardRef(function (_a, ref) {
+    var className = _a.className, children = _a.children, disableMargin = _a.disableMargin, other = __rest(_a, ["className", "children", "disableMargin"]);
+    return (React.createElement("div", __assign({ className: cnListItemIcon({ disableMargin: disableMargin }, [className]) }, other, { ref: ref }), children));
+});
+ListItemIcon.displayName = 'ListItemIcon';

package/__inner__/esm/components/List/components/ListItemIcon/index.d.ts

@@ -0,0 +1 @@
+export * from './ListItemIcon';

package/__inner__/esm/components/List/components/ListItemIcon/index.js

@@ -0,0 +1 @@
+export * from './ListItemIcon';

package/__inner__/esm/components/List/components/ListItemText/ListItemText.css

@@ -0,0 +1,10 @@
+.ListItemText {
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+  margin-inline-end: var(--list-item-children-margin-right);
+}
+
+  .ListItemText:last-child {
+    margin-inline-end: 0;
+  }

package/__inner__/esm/components/List/components/ListItemText/ListItemText.d.ts

@@ -0,0 +1,26 @@
+import './ListItemText.css';
+import React from 'react';
+import type { HTMLAttributes } from 'react';
+import type { TypographyProps } from '../../../Typography';
+export type ListItemTextProps = {
+    children?: never;
+    /** Основной текст */
+    primary: string;
+    /** Свойства компонента Typography для текста primary */
+    primaryTypographyProps?: TypographyProps<'span'>;
+    /** Второстепенный текст */
+    secondary?: string;
+    /** Свойства компонента Typography для текста secondary */
+    secondaryTypographyProps?: TypographyProps<'span'>;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const ListItemText: React.ForwardRefExoticComponent<{
+    children?: undefined;
+    /** Основной текст */
+    primary: string;
+    /** Свойства компонента Typography для текста primary */
+    primaryTypographyProps?: TypographyProps<"span"> | undefined;
+    /** Второстепенный текст */
+    secondary?: string | undefined;
+    /** Свойства компонента Typography для текста secondary */
+    secondaryTypographyProps?: TypographyProps<"span"> | undefined;
+} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/List/components/ListItemText/ListItemText.js

@@ -0,0 +1,22 @@
+import { __assign, __rest } from "tslib";
+import './ListItemText.css';
+import React, { forwardRef } from 'react';
+import { cn } from '../../../../utils/classname';
+import { Typography } from '../../../Typography';
+import { useListContext } from '../../ListContext';
+var cnListItemText = cn('ListItemText');
+var secondaryTextSizeMapper = {
+    l: 'text-xs',
+    m: 'text-2xs',
+    s: 'text-3xs',
+    xs: 'text-3xs',
+    '2xs': 'text-3xs'
+};
+export var ListItemText = forwardRef(function (_a, ref) {
+    var className = _a.className, primary = _a.primary, secondary = _a.secondary, primaryTypographyProps = _a.primaryTypographyProps, secondaryTypographyProps = _a.secondaryTypographyProps, other = __rest(_a, ["className", "primary", "secondary", "primaryTypographyProps", "secondaryTypographyProps"]);
+    var size = useListContext().size;
+    return (React.createElement("div", __assign({ className: cnListItemText({}, [className]) }, other, { ref: ref }),
+        React.createElement(Typography, __assign({ className: cnListItemText('TextPrimary'), color: "primary", variant: "text-".concat(size), as: "span" }, primaryTypographyProps), primary),
+        !!secondary && (React.createElement(Typography, __assign({ className: cnListItemText('TextSecondary'), color: "secondary", variant: secondaryTextSizeMapper[size], as: "span" }, secondaryTypographyProps), secondary))));
+});
+ListItemText.displayName = 'ListItemText';

package/__inner__/esm/components/List/components/ListItemText/index.d.ts

@@ -0,0 +1 @@
+export * from './ListItemText';

package/__inner__/esm/components/List/components/ListItemText/index.js

@@ -0,0 +1 @@
+export * from './ListItemText';

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

@@ -0,0 +1,4 @@
+export * from './ListItem';
+export * from './ListItemText';
+export * from './ListItemIcon';
+export * from './ListItemButton';

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

@@ -0,0 +1,4 @@
+export * from './ListItem';
+export * from './ListItemText';
+export * from './ListItemIcon';
+export * from './ListItemButton';

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

@@ -0,0 +1,4 @@
+export declare const LIST_DEFAULT_SIZE = "m";
+export declare const LIST_DEFAULT_TAG = "ul";
+export declare const LIST_ITEM_DEFAULT_TAG = "li";
+export declare const LIST_ITEM_BUTTON_DEFAULT_TAG = "div";

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

@@ -0,0 +1,4 @@
+export var LIST_DEFAULT_SIZE = 'm';
+export var LIST_DEFAULT_TAG = 'ul';
+export var LIST_ITEM_DEFAULT_TAG = 'li';
+export var LIST_ITEM_BUTTON_DEFAULT_TAG = 'div';

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

@@ -0,0 +1,4 @@
+export * from './List';
+export * from './components';
+export * from './types';
+export { useListContext } from './ListContext';

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

@@ -0,0 +1,4 @@
+export * from './List';
+export * from './components';
+export * from './types';
+export { useListContext } from './ListContext';