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

При генерации иконок в dist/exports директорию автоматически генерируется динамический ungic-icons.module.js JS es модуль со всеми иконками.

ungic-icons.module.js

Использование данного модуля:

@import {render} from "../exports/ungic-icons.module";

let el = document.querySelector('.content-for-icon');
el.innerHTML = render('arrow_left', {
    title: 'Arrow left'
});
// or

@import {icon_arrow_left} from "../exports/ungic-icons.module";

let el = document.querySelector('.content-for-icon');
el.innerHTML = icon_arrow_left;

render(id, options)

Функция для рендеринга иконки, html будет сгенерирован взависимости от активного режима иконок, шрифт или svg sprites

• id - ид иконки (можно посмотреть на демо странице)
• options
  • title - Название иконки для программы чтения с экрана
  • svgBody - Только для SVG sprites. Сгенерировать полноценный SVG без ссылки, по умолчанию генерируется ссылка на символ.
  • width - Только для SVG sprites. Ширина svg иконки
  • height - Только для SVG sprites. Высота svg иконки
  • class - доп. класс для иконки
  • presentation - Boolean прятать от программы чтения с экрана
  • href - URL сгенерировать иконку как ссылку

Сгенерированные иконки

Можно включать уже экспортируемые сгенерированные иконки, для этого к ID иконки следует добавить префикс icon_:

@import {icon_arrow_left} from "../exports/ungic-icons.module";

let el = document.querySelector('.content-for-icon');
el.innerHTML = icon_arrow_left;