2023-06-21 20:27:27 -04:00
|
|
|
import {LitElement, html, unsafeHTML} from './lit-all.min.js';
|
|
|
|
import {styles} from './tf-styles.js';
|
|
|
|
|
|
|
|
class TfTagElement extends LitElement {
|
|
|
|
static get properties() {
|
|
|
|
return {
|
|
|
|
tag: {type: String},
|
|
|
|
count: {type: Number},
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
static styles = styles;
|
|
|
|
|
|
|
|
constructor() {
|
|
|
|
super();
|
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
let number = this.count ? html` (${this.count})` : undefined;
|
2024-02-22 09:36:45 -05:00
|
|
|
return html`<a
|
|
|
|
href="#q=${this.tag}"
|
|
|
|
style="display: inline-block; margin: 3px; border: 1px solid black; background-color: #444; padding: 4px; border-radius: 3px"
|
|
|
|
>${this.tag}${number}</a
|
|
|
|
>`;
|
2023-06-21 20:27:27 -04:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2024-02-22 09:36:45 -05:00
|
|
|
customElements.define('tf-tag', TfTagElement);
|