GitHub Stars Button
Ссылка на репозиторий с прокручивающимся числом звёзд. Pro · Анимированные компоненты › Кнопки
Установка
npx valyro-cli@latest login
npx valyro-cli@latest add github-stars-button
npm install valyro-ui-pro
import 'valyro-ui-pro/styles.css';
import { GitHubStarsButton } from 'valyro-ui-pro';
Пропсы
| Prop | Type | Default | |
|---|---|---|---|
repo * | string | Repository as owner/name; the link goes to it unless href is given. | |
count * | number | Star count from your own source — a cached server request, a build step. The button never calls the GitHub API itself (rate limits, errors and caching stay with the app). | |
format | Intl.NumberFormatOptions | { notation: 'compact', maximumFractionDigits: 1 } | How the count is written (default compact: 12.3K). |
locale | string | Locale for the count (default: the ThemeProvider's, then the browser's). | |
rollOnView | boolean | true | Roll the count up from zero when the button scrolls into view (default true). |
variant | 'primary' | 'secondary' | 'ghost' | 'accent' | 'danger' | 'link' | 'secondary' | Button look (default secondary). |
size | 'sm' | 'md' | 'lg' | 'md' | Button size. |
hoverScale | number | 1.05 | Scale under a hovering mouse (default 1.05), as Button's hoverScale. |
tapScale | number | 0.95 | Scale while pressed (default 0.95), as Button's tapScale. |
labels | Partial<GitHubStarsButtonLabels> | Overrides for the built-in English text; keys left out keep their defaults. |
Похожие компоненты
- Toggle — Кнопка-переключатель с пружинным откликом
- Flip Button — Кнопка с двумя сторонами, переворачивается на пружине
- Liquid Button — Кнопка, которая заполняется «жидкостью» при наведении
- Theme Toggler — Смена светлой и тёмной темы с раскрытием через View Transitions
- Share Button — Кнопка, раскрывающая иконки соцсетей
- Code Tabs — Варианты кода во вкладках: npm, pnpm, bun — с копированием
- Number Wheel — Число на вращающемся барабане с соседними значениями
- Pin List — Список с закреплением: элементы плавно переезжают между группами
- Notification Stack — Стопка уведомлений, раскрывающаяся в список
- Todo List — Чек-лист с волнистым зачёркиванием выполненных пунктов
- Presence Avatars — Кто онлайн: аватары перестраиваются при смене статуса
- Radial Menu — Кольцевое контекстное меню по правому клику
Назад: Theme Toggler · Далее: Share Button · Весь раздел «Анимированные компоненты»