@snack-uikit/typography v0.8.7

Typography

Installation

npm i @snack-uikit/typography

Changelog

Example

import { Typography } from "@snack-uikit/typography";

<Typography 
  family='sans'
  purpose='display'
  size='s'
  tag='h1'
  className='some-element'
>
  Some text
</Typography>

Также чтобы не указывать пропсы family, purpose и size, воспользуйтесь нужным предустановленным вариантом, например:

<Typography.SansDisplayS tag='h1' className='some-element'>
  Some text
</Typography.SansDisplayS>

Все компоненты вида <Typography.{Family}{Purpose}{Size} /> генерируются автоматически при выполнении команды npm run build:packages.

Как добавить новый компонент такого вида?

1. Добавить новое свойство в один или несколько объектов FAMILY, PURPOSE, SIZE в файле constants.ts, который лежит в typography/src/components/constants.ts
2. Запустить скрипт compile в package.json пакета @typography

   "npm run build:typography-components && npm run build:constants && npm run build:index"

3. Готово! Можете использовать Typography с новым свойством

Typography

Props