/** * FF Typescript Foundation Library * Copyright 2019 Ralph Wiedemeier, Frame Factory GmbH * * License: MIT */ import CustomElement, { customElement, html, property, TemplateResult } from "./CustomElement"; //////////////////////////////////////////////////////////////////////////////// export { html }; @customElement("ff-icon") export default class Icon extends CustomElement { protected static templates = {}; static add(name: string, template: TemplateResult) { if (Icon.templates[name]) { throw new Error(`icon already registered: '${name}'`); } Icon.templates[name] = template; } static getTemplateNames() { return Object.keys(Icon.templates); } @property({ attribute: false }) template: TemplateResult = null; @property({ type: String }) name: string; constructor(name?: string) { super(); this.name = name || ""; } protected firstConnected() { this.classList.add("ff-icon"); } protected render() { if (this.name) { const template = (this.constructor as typeof Icon).templates[this.name]; if (!template) { console.warn(`icon not found: '${this.name}'`); } return template; } if (this.template) { return this.template; } return html`[icon undefined]`; } } //////////////////////////////////////////////////////////////////////////////// // PREDEFINED ICONS Icon.add("empty", html``); Icon.add("check", html``); Icon.add("close", html``); Icon.add("grip", html``); Icon.add("up", html``); Icon.add("down", html``); Icon.add("caret-up", html``); Icon.add("caret-down", html``); Icon.add("folder", html``); Icon.add("file", html``); Icon.add("info", html``); Icon.add("warning", html``); Icon.add("error", html``); Icon.add("prompt", html``);