Библиотека стилей и компонентов Plasma Core

Описание ключевых частей библиотеки и общего подхода.

Структура Core

Plasma Core является единым источником данных о значениях атрибутов, таких как цвет, размер, шрифт и т.д. в дизайн-системе.

Colors

Все возможные используемы цвета дизайн системы без прозрачностей и эффектов.

Opacity

Набор всех возможных значений прозрачности объекта/цвета без разделения на темную ветлую тему и на поверхности.

Dimensions

Набор размеров элементов и отступов.

Typeface

Набор значений атрибутов текстовых стилей без привязки к семейству шрифтов и поверхности.

Установка пакета

$ npm install --save @salutejs/plasma-core

Использование компонент

Все компоненты доступны из папки components или напрямую из пакета:

// App.tsx
import { Button } from '@salutejs/plasma-core/components/Button';

export const App = () => {
    return <Button>Hello, Plasma!</Button>;
};

Полезные ссылки:

Витрина с компонентами storybook.

Документация.