ValyroUI English version

Byline

Подпись: авторы, дата публикации и обновления, время чтения. Pro · Контент и соцсети › Статья

Установка

npx valyro-cli@latest login
npx valyro-cli@latest add byline
npm install valyro-ui-pro

import 'valyro-ui-pro/styles.css';
import { Byline } from 'valyro-ui-pro';

Пропсы

PropTypeDefault
authors *ArticleAuthor[]Writers credited on the piece; each name links to href when given.
publishedDateInputPublication date.
updatedDateInputLast substantive update; shown with its time of day.
readingMinutesnumberEstimated reading time in minutes.
showAvatarsbooleantrueAvatars of the authors before the names (default true).
size'sm' | 'md''md'sm for cards and lists, md under a headline (default).
timeZonestringIANA time zone of the dates shown, e.g. "Europe/Moscow" (default: the ThemeProvider's, then the reader's). Set it, here or on the provider, when rendering on the server, so the server and the browser print the same time.
localestringBCP 47 locale for numbers and dates; defaults to the ThemeProvider's, then the browser's.
labelsPartial<BylineLabels>Overrides for the built-in English text; keys left out keep their defaults.

Похожие компоненты

  • Article Header — Шапка статьи: рубрика, заголовок, лид, авторы и дата
  • Article Figure — Иллюстрация с подписью и автором фото
  • Pull Quote — Выносная цитата с атрибуцией
  • Key Points — Блок «Главное» с ключевыми тезисами
  • Editor Note — Обновление, исправление, раскрытие и пометка о спонсорстве
  • Article Toc — Оглавление статьи с подсветкой текущего раздела
  • Reading Progress — Полоса прогресса чтения
  • Share Bar — Поделиться: Telegram, VK, X, WhatsApp, почта и копирование ссылки
  • Author Bio — Карточка автора в конце статьи с подпиской
  • Article Card — Карточка новости: вертикальная, горизонтальная и поверх фото
  • Live Blog — Онлайн-трансляция: лента обновлений, закреплённые и важные события
  • Breaking News — Плашка «Срочно» с ротацией заголовков

Назад: Article Header · Далее: Article Figure · Весь раздел «Контент и соцсети»