fix(core): update
This commit is contained in:
@ -2,15 +2,41 @@ import { LitElement, html, property, customElement } from 'lit-element';
|
||||
|
||||
import * as domtools from '@designestate/dees-domtools';
|
||||
|
||||
import { icon, IconDefinition } from "@fortawesome/fontawesome-svg-core";
|
||||
import { faFacebook, faTwitter, faLinkedin, faMedium } from '@fortawesome/free-brands-svg-icons';
|
||||
import { icon, IconDefinition } from '@fortawesome/fontawesome-svg-core';
|
||||
import {
|
||||
faFacebook,
|
||||
faGoogle,
|
||||
faLinkedin,
|
||||
faMedium,
|
||||
faSlack,
|
||||
faTwitter,
|
||||
} from '@fortawesome/free-brands-svg-icons';
|
||||
|
||||
type TBrand = 'facebook' | 'twitter' | 'linkedin' | 'medium';
|
||||
const brandIcons: {[key: string]: IconDefinition} = {
|
||||
import {} from '@fortawesome/free-regular-svg-icons';
|
||||
import { faDesktop, faRss } from '@fortawesome/free-solid-svg-icons';
|
||||
|
||||
type TFontAwesomeIcon =
|
||||
// normal
|
||||
| 'desktop'
|
||||
| 'rss'
|
||||
// brands
|
||||
| 'facebook'
|
||||
| 'google'
|
||||
| 'twitter'
|
||||
| 'linkedin'
|
||||
| 'medium'
|
||||
| 'slack';
|
||||
const faIcons: { [key: string]: IconDefinition } = {
|
||||
// normal
|
||||
desktop: faDesktop,
|
||||
rss: faRss,
|
||||
// brands
|
||||
facebook: faFacebook,
|
||||
twitter: faTwitter,
|
||||
google: faGoogle,
|
||||
linkedin: faLinkedin,
|
||||
medium: faMedium
|
||||
medium: faMedium,
|
||||
slack: faSlack,
|
||||
twitter: faTwitter,
|
||||
};
|
||||
|
||||
@customElement('dees-icon')
|
||||
@ -20,14 +46,13 @@ export class DeesIcon extends LitElement {
|
||||
<dees-icon iconName="visibility"></dees-icon>
|
||||
<dees-icon brandName="facebook"></dees-icon>
|
||||
</div>
|
||||
|
||||
`;
|
||||
`;
|
||||
|
||||
@property()
|
||||
public iconName: string;
|
||||
|
||||
@property()
|
||||
public brandName: TBrand;
|
||||
public brandName: TFontAwesomeIcon;
|
||||
|
||||
@property()
|
||||
public svgSize: number = 20;
|
||||
@ -83,7 +108,9 @@ export class DeesIcon extends LitElement {
|
||||
|
||||
firstUpdated() {
|
||||
if (this.brandName && !this.iconName) {
|
||||
this.shadowRoot.querySelector('#iconContainer').innerHTML = icon(brandIcons[this.brandName]).html[0];
|
||||
this.shadowRoot.querySelector('#iconContainer').innerHTML = icon(
|
||||
faIcons[this.brandName]
|
||||
).html[0];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user