ValyroUI English version

Share Bar

Поделиться: Telegram, VK, X, WhatsApp, почта и копирование ссылки. Pro · Контент и соцсети › Чтение и автор

Установка

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

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

Пропсы

PropTypeDefault
urlstringAddress being shared (default: the page's canonical URL, else its address without query and hash).
titlestring''Headline sent along where the network accepts text.
targetsShareTarget[]DEFAULT_TARGETSButtons, in order (default: telegram, vk, x, whatsapp, email, copy).
variant'icon' | 'label''icon'icon: square icon buttons with the theme's button radius (default); label: icon and network name.
orientation'horizontal' | 'vertical''horizontal'vertical for a rail beside the article.
showTitlebooleanfalseShows the "Share" title before the buttons.
onShare(target: ShareTarget) => voidCalled when a reader picks a target (before the share window opens), e.g. for analytics.
labelsPartial<ShareBarLabels>Overrides for the built-in English text; keys left out keep their defaults.

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

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

Назад: Reading Progress · Далее: Author Bio · Весь раздел «Контент и соцсети»