ValyroUI Русская версия

Byline

Byline: authors, published and updated dates, reading time. Pro · Content and social › Article

Installation

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';

Props

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.

Related components

  • Article Header — Article header: section, headline, lede, authors and date
  • Article Figure — Image with caption and photo credit
  • Pull Quote — Pull quote with attribution
  • Key Points — “Key points” summary block
  • Editor Note — Update, correction, disclosure and sponsored-content notes
  • Article Toc — Article table of contents that tracks the current section
  • Reading Progress — Reading progress bar
  • Share Bar — Share: Telegram, VK, X, WhatsApp, email and copy link
  • Author Bio — Author card at the end of an article, with a follow button
  • Article Card — News card: vertical, horizontal and over a photo
  • Live Blog — Live blog: update feed, pinned and key events
  • Breaking News — “Breaking” banner with rotating headlines

Previous: Article Header · Next: Article Figure · All Content and social