Editor Note

Update, correction, disclosure and sponsored-content notes. Pro · Content and social › Article

Installation

npx valyro-cli@latest login
npx valyro-cli@latest add editor-note

npm install valyro-ui-pro

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

Prop	Type	Default
`kind`	`'update' \| 'correction' \| 'clarification' \| 'disclosure' \| 'sponsored'`	`'update'`	What the note is: an update to the story, a correction of an error, a clarification, a conflict-of-interest disclosure or a sponsorship notice.
`variant`	`'editorial' \| 'callout'`	`'editorial'`	`editorial` (default): a hairline above, the kind in small capitals with the date, the text in muted italics, as newspapers print corrections. `callout`: a tinted box with an edge rule and an icon.
`date`	`DateInput`		When the note was added.
`title`	`ReactNode`		Title in place of the kind's label.
`children`	`ReactNode`		What changed and why.
`timeZone`	`string`		IANA 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.
`locale`	`string`		BCP 47 locale for numbers and dates; defaults to the ThemeProvider's, then the browser's.
`labels`	`Partial<EditorNoteLabels>`		Overrides for the built-in English text; keys left out keep their defaults.