@sima-land/ui-quarks
v5.2.0
Published
Sima-land design system icons as a React components
Downloads
709
Readme
UI-quarks
Иконки дизайн-системы в виде UI-компонентов.
Разрабатывается в соответствии с дизайн-руководствами.
Установка
# npm
npm i -S @sima-land/ui-quarks
# или yarn
yarn add @sima-land/ui-quarks
Использование
Иконки доступны как React-компоненты:
import AddSVG from '@sima-land/ui-quarks/icons/24x24/Stroked/Add';
function IconicButton() {
return (
<button>
<AddSVG fill='#f00' />
</button>
);
}
Также возможно использование иконок в виде файлов .svg
.
Добавление новых иконок
Для добавления необходимо:
- выделить иконку (именно компонент, включая безопасное расстояние);
- в правой колонке выбрать вкладку "Export";
- выбрать тип экспорта SVG и нажать кнопку "Export";
- достать из полученного архива иконку и расположить ее в
src/icons/
также, как располагаются остальные иконки
Важно: не надо переименовывать файл иконки (только в крайних случаях), при сборке файл будет автоматически переименован в PascalCase.