Awesome

DEPRECATED<br /> Не развивается и активно не поддерживается, используйте core-components

<hr />

Alfa-Bank UI Library

<br />

arui-feather — это библиотека React компонентов для создания веб-интерфейсов.

Вы можете посмотреть примеры использования на нашем сайте с документацией.

Установка

arui-feather доступен как npm-пакет.

npm install arui-feather --save

Поддерживаемые браузеры

Desktop

Chrome (две последние стабильные версии)
Edge (две последние стабильные версии)
Firefox (две последние стабильные версии)
IE 11+
Opera (две последние стабильные версии)
Safari (две последние стабильные версии)
Yandex (две последние стабильные версии)

Mobile

Android 5+
iOS (две последние стабильные версии)

Вёрстка

Использование в адаптивной/мобильной среде

Цветовая схема

Использование цветовой схемы

Темезация

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

Разработка

Необходимые внешние зависимости системы:

node 12 и npm

Шаги запуска демо:

npm i
npm run start

Запустить демо на произвольном порту:

PORT=8888 npm run start

Использовать только для обновления нескольких компонентов. Иначе не хватает памяти.

Автоматические проверки кода

Перед каждым коммитом js код проверяется через eslint, css через stylelint.

Запуск unit-тестов npm run test.

Запуск unit-тестов для определенных компонентов TESTS=amount,calendar npm run test.

Запуск unit-тестов используя Chrome npm run test -- --browser=Chrome

Запуск линтера для css npm run lint-css.

Запуск линтера для js npm run lint-js.

Запуск тестов на мобильных устройствах

Регрессионное тестирование

Для тестирования деградаций в вёрстке используется gemini.

Тесты для каждого компонента хранятся в gemini/<component>.gemini.js.

Запуск тестов производится командой npm run gemini.

Обновление или создание новых эталонных скриншотов: npm run gemini-update.

Для запуска тестов или обновления скриншотов необходимы следующие шаги:

export SAUCE_USERNAME=alfalab.js SAUCE_ACCESS_KEY={ ключ взять у мейнтейнеров }
npm run sauce-connect
npm run gemini или npm run gemini-update

Запуск gemini на выборочное число тестов (используется опция --grep): npm run gemini -- --grep="button|select".

Во время тестирования рендер каждого сьюта доступен по URL, например: http://localhost:8668/popup/popup_theme_alfa-on-color.popup_size_m.popup_prop-set_1

Минификация svg

Для оптимизация svg используется svgo.

npm install svgo -g
find src -name *.svg -print0 | xargs -0 -L 1 svgo

Правила контрибуции

Мы ведём задачи в issues. Для обсуждения есть чат мейнтейнеров (#arui-maintainers).

Уважаем тех, кто видит проблему и кидает PR.
Не знаете что делать — можно брать любую задачу без Assignee, назначив её на себя.
Знаете что делать и есть возможность — кидайте PR.
Знаете что делать, но нет времени — добавьте задачу (issue).

Подробнее о том, как контрибьютить в проект

Публикация

Для выпуска новой версии используйте следущие команды:

Выпуск патч-версии 1.0.0 -> 1.0.1 npm run release-patch
Выпуск минорной версии 1.0.0 -> 1.1.0 npm run release-minor
Выпуск мажорной версии 1.0.0 -> 2.0.0 npm run release-major

Запуск этих команд автоматически сформирует changelog, сделает новый git tag, запустит сборку и публикацию.

Deprecation policy

Deprecation публичного API должно происходить плавно, позволяя пользователям библиотеки обновляться с наименьшими неудобствами. Deprecation происходит со следующим сценарием:

Обновление документации для уведомления пользователей.
Выпуск минорного релиза с deprecations.
Дополнительное оповещение о deprecation в Slack-канал библиотеки.

До полного удаления устаревшей функциональности в мажорном релизе, должна быть выпущена как минимум одна минорная версия для уведомления пользователей об изменениях.