igniteui-webcomponents
Version:
Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.
134 lines • 4.93 kB
JavaScript
import { ICON_REFERENCES } from './icon-references.js';
import { IconsStateBroadcast } from './icon-state.broadcast.js';
import { internalIcons } from './internal-icons-lib.js';
import { createIconDefaultMap } from './registry/default-map.js';
import { SvgIconParser } from './registry/parser.js';
import { ActionType } from './registry/types.js';
class IconsRegistry {
constructor() {
this._listeners = new Set();
this._pendingNotifications = new Set();
this._references = createIconDefaultMap();
this._collections = createIconDefaultMap().set('internal', internalIcons);
this._svgIconParser = new SvgIconParser();
this._broadcast = new IconsStateBroadcast(this._collections, this._references);
this._notificationScheduled = false;
}
register(name, iconText, collection = 'default') {
const svgIcon = this._svgIconParser.parse(iconText);
this._collections.getOrCreate(collection).set(name, svgIcon);
const icons = createIconDefaultMap();
icons.getOrCreate(collection).set(name, svgIcon);
this._broadcast.send({
actionType: ActionType.RegisterIcon,
collections: icons.toPlainMap(),
});
this._notifyAll(name, collection);
}
subscribe(callback) {
this._listeners.add(callback);
}
unsubscribe(callback) {
this._listeners.delete(callback);
}
setIconRef(options) {
const { alias, target, overwrite } = options;
const reference = this._references.getOrCreate(alias.collection);
if (overwrite) {
reference.set(alias.name, {
name: target.name,
collection: target.collection,
external: target.external,
});
this._notifyAll(alias.name, alias.collection);
}
if (target.external) {
const refs = createIconDefaultMap();
refs.getOrCreate(alias.collection).set(alias.name, {
name: target.name,
collection: target.collection,
});
this._broadcast.send({
actionType: ActionType.UpdateIconReference,
references: refs.toPlainMap(),
});
}
}
getIconRef(name, collection, theme) {
const storedRef = this._references.get(collection)?.get(name);
if (storedRef) {
return {
name: storedRef.name,
collection: storedRef.collection,
};
}
if (collection === 'default' && theme) {
const alias = ICON_REFERENCES.find((ref) => ref.alias.name === name && ref.alias.collection === 'default');
if (alias) {
const target = alias.target.get(theme) ?? alias.target.get('default');
if (target) {
return target;
}
}
}
return { name, collection };
}
get(name, collection = 'default') {
return this._collections.get(collection)?.get(name);
}
_notifyAll(name, collection) {
const key = `${collection}:${name}`;
this._pendingNotifications.add(key);
if (!this._notificationScheduled) {
this._notificationScheduled = true;
queueMicrotask(() => {
this._flushNotifications();
});
}
}
_flushNotifications() {
const notifications = Array.from(this._pendingNotifications);
this._pendingNotifications.clear();
this._notificationScheduled = false;
for (const key of notifications) {
const [collection, ...nameParts] = key.split(':');
const name = nameParts.join(':');
for (const listener of this._listeners) {
listener(name, collection);
}
}
}
}
const registry = Symbol.for('igc.icons-registry.instance');
export function getIconRegistry() {
const _global = globalThis;
if (!_global[registry]) {
_global[registry] = new IconsRegistry();
}
return _global[registry];
}
export async function registerIcon(name, url, collection = 'default') {
const response = await fetch(url);
if (response.ok) {
const value = await response.text();
getIconRegistry().register(name, value, collection);
}
else {
throw new Error(`Icon request failed. Status: ${response.status}.`);
}
}
export function registerIconFromText(name, iconText, collection = 'default') {
getIconRegistry().register(name, iconText, collection);
}
export function setIconRef(name, collection, icon) {
getIconRegistry().setIconRef({
alias: { name, collection },
target: {
name: icon.name,
collection: icon.collection,
external: true,
},
overwrite: true,
});
}
//# sourceMappingURL=icon.registry.js.map