Headline
Строка заголовка страницы: заголовок (title), слоты до/после, действия и подзаголовок. Базовый слот, на котором собраны шапки PageCatalog, PageServices и PageForm.
Когда использовать
- Шапка раздела внутри собственной раскладки, когда готовые
Page*не подходят. - Нужна согласованная по DS строка «заголовок + статус + действия».
Анатомия
title— заголовок страницы.slotBeforeTitle— слот перед заголовком (например, кнопка «назад»).slotAfterTitle— слот после заголовка (например, статус).actions— действия справа от заголовка.moreActions— слот действий внутри строки заголовка (mobile-рендереры кладут сюда kebab / «ещё»).subtitle— подзаголовок под заголовком.truncateTitle— обрезать заголовок в одну строку с многоточием.
Установка
pnpm add @cloud-ru/ds-uikit-product-page-layoutimport { Headline } from '@cloud-ru/ds-uikit-product-page-layout'Props
Types
Props
HeadlineProps| Prop | Type | Default | Required | Description |
|---|---|---|---|---|
actions | ReactNode | — | no | Действия справа от заголовка |
data-test-id | string | — | no | |
moreActions | ReactNode | — | no | Слот действий внутри строки заголовка (mobile-рендереры кладут сюда kebab/«ещё») |
slotAfterTitle | ReactNode | — | no | Слот после заголовка (например, статус) |
slotBeforeTitle | ReactNode | — | no | Слот перед заголовком (например, кн опка «назад») |
subtitle | ReactNode | — | no | Подзаголовок под заголовком |
title | string | — | yes | Заголовок страницы |
truncateTitle | boolean | — | no | Обрезать заголовок в одну строку с многоточием |