@clcorp/react-ui

Installation

npm install --save @clcorp/react-ui

Usage

Для корректной работы компонентов необходимо обернуть приложение в провайдер темы CLThemeProvider

import React from 'react';
import ReactDOM from 'react-dom';

import { CLThemeProvider } from '@clcorp/react-ui/styles';
import { Button } from '@clcorp/react-ui/components/buttons';

const App = () => <Button>Hello World</Button>;

ReactDOM.render(
    <CLThemeProvider>
        <App />
    </CLThemeProvider>,
    document.getElementById('root')
);

Development setup

$ git clone https://box.itpark.space/gitlab/it.park/react_ui_kit.git
$ cd react_ui_kit
$ yarn
$ yarn dev

npm scripts

• yarn commit для совершения коммита по стандарту
• yarn dev для сборки документации в dev режиме
• yarn docz:build для сборки production версии документации
• yarn build для сборки самой библиотеки

React component structure

• API компонентов, дублирующих нативные элементы должен быть максимально близок с аттрибутами HTML элементов т.е. onChange проп для Input'ов, onClick для кнопок и т.д.
• Все функции-хэндлеры начинаются с handle
• Назания аттрибутов
  • Boolean - прилагательные
  • Enum'ы - существительные
  • обработчики - начинаются с on
• Цвета
  • Название цвета - его однозначный идентификатор
  • Название не содержит в себе варианты использования и вообще достаточно абстрактно
    • link-color - плохо
    • red-link-hover-color - очень плохо
    • dark-red, light-blue - хорошо
    • base1, base_700 - в случае сильной темизации

Meta

Built with Material-UI - React UI framework. More info about customizing component read MATERIAL-UI docs Customizing components.