Дизайн-система Consta | Библиотека интерфейсных компонентов
Consta — дизайн-система для разработки интерфейсов, написана на React, сделана и поддерживается в «Газпром нефти».
В дизайн-систему входит несколько библиотек. Здесь — библиотека интерфейсных компонентов: простые контролы, сложные блоки, темы и хуки. Все библиотеки представлены в виде компонентов и макетов в Figma.
Репозиторий | NPM | Документация и стенд | Макеты
Репозиторий | NPM | Документация и стенд | Макеты
Подробности — на на сайте дизайн-системы Consta
Следите за новостями и релизами в телеграм-канале дизайн-системы
yarn add @consta/uikit
Чтобы начать работу с библиотекой интерфейсных компонентов, подключите тему:
import React from 'react';
import { Theme, presetGpnDefault } from '@consta/uikit/Theme';
import { Button } from '@consta/uikit/Button';
const App = () => (
<Theme preset={presetGpnDefault}>
<Button label="Кнопка" />
</Theme>
);Что такое темы и как с ними работать
На стенде можно менять параметры и смотреть, как меняются компоненты. Документация — во вкладке у каждого компонента.
Будем рады, если вы захотите принять участие в разработке дизайн-системы =) Но сначала прочитайте инструкцию для контрибьюторов.
Дизайн-систему можно использовать бесплатно, она распространяется ПАО «Газпром нефть» на условиях открытой лицензии MIT.