Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 | 31x 31x 5x 70x 31x 31x 31x 47x 31x 31x 31x 31x 31x 31x 6x 6x | import { api } from 'lwc';
import { reflectAttribute } from 'sds/utils';
import SdsIcon from 'sds/icon';
import styles from './customIconSet.css';
import * as symbols from './svgs/symbols.js';
export default class IconSet extends SdsIcon {
// Render component in native shadow mode
static shadowSupportMode = 'native';
static stylesheets = [styles];
@api
get variant() {
return this._variant;
}
set variant(value) {
this._variant = value;
reflectAttribute(this, 'variant', this._variant);
}
@api
get size() {
return this._size;
}
set size(value) {
this._size = value;
reflectAttribute(this, 'size', this._size);
}
get iconElement() {
return this.template.querySelector("[part='icon']");
}
parseSymbolString(symbol) {
const [type, name] = symbol.split(':');
return { type, name };
}
findSymbolInType(type, name) {
return type.find((item) => item.name === name);
}
renderedCallback() {
if (!this._rendered && this.symbol) {
this._rendered = true;
const { type, name } = this.parseSymbolString(this.symbol);
const symbol = this.findSymbolInType(symbols[type], name);
const parser = new DOMParser();
const doc = parser.parseFromString(symbol.svg, 'image/svg+xml');
const svg = doc.querySelector('svg');
this.iconElement.appendChild(svg);
}
}
}
|