poe-custom-elements
Version:
Path of Exile custom elements
90 lines • 2.91 kB
JavaScript
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
import { LitElement, html, css, nothing } from 'lit';
import { customElement, property } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js';
import { parseDisplayMode3 } from '../../lib/internal.js';
let PoeItemInfoPropertyElement = class PoeItemInfoPropertyElement extends LitElement {
render() {
if (!this.property) {
return html `<p style="color: red">No item property provided</p>`;
}
return html `<div class="property">${Values(this.property)}</div>`;
}
static { this.styles = css `
* {
padding: 0;
margin: 0;
box-sizing: border-box;
}
.property {
color: #7f7f7f;
}
.value {
color: #fff;
}
.fire {
color: #960000;
}
.cold {
color: #366492;
}
.lightning {
color: gold;
}
.augmented {
color: #88f;
}
`; }
};
__decorate([
property({ type: Object }),
__metadata("design:type", Object)
], PoeItemInfoPropertyElement.prototype, "property", void 0);
PoeItemInfoPropertyElement = __decorate([
customElement('poe-item-info-property')
], PoeItemInfoPropertyElement);
export { PoeItemInfoPropertyElement };
function colorValueClass(num) {
switch (num) {
case 1:
return 'augmented';
case 4:
return 'fire';
case 5:
return 'cold';
case 6:
return 'lightning';
default:
return '';
}
}
function Values(property) {
if (property.displayMode === 0) {
if (!property.values.length) {
return property.name;
}
const values = property.values.map((value, i) => {
return html `<span
class=${classMap({
value: true,
[`${colorValueClass(value[1])}`]: true,
})}
>${value[0]}</span
>${i === property.values.length - 1 ? nothing : ','} `;
});
return html `${property.name}: ${values}`;
}
if (property.displayMode === 3) {
return parseDisplayMode3(property, value => html `<span class="value">${value}</span>`);
}
return nothing;
}
//# sourceMappingURL=poe-item-info-property.js.map