Content
Текст с иконками слева и справа.
Сочетает текст, размер и иконки. as позволяет выбрать подходящий HTML-тег.
Живой пример
Content
Настройки примера
Использование
import { CheckIcon } from '@heroicons/react/24/outline';
import { Content } from '@prosazhin/pbcomponents';
<Content
leftIcon={CheckIcon}
size='m'
>
Done
</Content>;API компонента
| Prop | Тип / варианты | Назначение | По умолчанию |
|---|---|---|---|
children | string | Содержимое компонента. | — |
size | 's' | 'm' | 'l's · m · l | Размер компонента. | m |
medium | boolean | Увеличенная насыщенность текста. | false |
as | ElementTypediv · span | HTML-тег обёртки. | span |
leftIcon | SvgTypenone · check · search · user | Иконка перед текстом; принимает SVG-компонент. | — |
rightIcon | SvgTypenone · check · search · user | Иконка после текста; принимает SVG-компонент. | — |
leftIconClassName | string | Класс левой иконки. | — |
rightIconClassName | string | Класс правой иконки. | — |
className | string | Класс корневого элемента. | — |
textClassName | string | Класс текстовой части. | — |
Нативные HTML-атрибуты поддерживаются там, где компонент рендерит соответствующий элемент. Параметры className управляют только оформлением.