Library
Library - хелпер для хранения импортированных иконок в runtime
Использование
Необходимо импортировать уже созданный экземлрял класса Library под названием
library и импортировать иконки через него.
Class Library
Properties
icons
- type:
Record<IconPrefix, Record<IconName, IconDefinition>> - default:
{}
export type { IconDefinition as FaIconDefinition } from '@fortawesome/fontawesome-common-types';
export enum FA_ICON_PREFIXES {
SOLID = 'fas',
LIGHT = 'fal',
BRAND = 'fab',
REGULAR = 'far',
DUOTONE = 'fad',
THIN = 'fat',
SHARP_SOLID = 'fass',
SHARP_REGULAR = 'fasr',
SHARP_LIGHT = 'fasl',
KIT = 'fak',
}
export enum CUSTOM_ICON_PREFIXES {
EDU = 'edu',
}
export type IconPrefix = `${FA_ICON_PREFIXES | CUSTOM_ICON_PREFIXES}`;
export type IconLiteral = `${IconPrefix}/${string}`;
export const ICON_PREFIXES = [
...Object.values(FA_ICON_PREFIXES),
...Object.values(CUSTOM_ICON_PREFIXES),
] as const;
export interface IconNode {
tag: string;
attrs?: Record<string, any>;
children?: IconNode[];
}
export type RootIconNode = Required<Pick<IconNode, 'children'>> &
Pick<IconNode, 'attrs'>;
export interface IconLookup {
prefix: IconPrefix;
iconName: string;
}
export interface IconDefinition extends IconLookup, RootIconNode {}
export type IconRenderer<N> = (
tag: string,
attrs: Record<string, any>,
children: N[],
) => N;
export type Icons = Record<IconPrefix, Record<string, IconDefinition>>;
get
- type:
(iconLiteral: IconLiteral) => IconDefinition | undefined - type:
(prefix: IconPrefix, iconName: string) => IconDefinition | undefined
Метод получения IconDefinition импортированной иконки в случае ее наличия
library.get('fas/info-circle');
library.get('fas', 'info-circle');
library.get('custom/angle-down');
library.get('custom', 'angle-down');
add
- type:
(iconLiteral: FaIconDefinition | IconDefinition) => void
Метод регистрация иконки для последущего использования в комопненте Icon
import { faUser as faSolidUser } from '@fortawesome/pro-solid-svg-icons';
import { library, defineIcon } from '#sf/services/icons';
const angleDownIconNode = {
attrs: {
viewBox: '0 0 9 13',
},
children: [
{
tag: 'path',
attrs: {
d: 'd',
},
},
],
};
const eduSolidAngleDown = defineIcon({
prefix: 'edu',
iconName: 'angle-down',
...angleDownIconNode,
});
library.add(faUser, faSolidUser, eduSolidAngleDown);
reset
- type:
() => void
Обнуляет свойство icons. Иными словами, стирает импорты всех иконок.
Далле library используется для извлечения IconDefinition в компоненте
SfIcon через метод get, если в качестве
пропа icon передается IconLiteral, IconLookup или [IconPrefix, string]