@salla.sa/twilight-components
Version:
Salla Web Component
93 lines (92 loc) • 4.97 kB
JavaScript
/*!
* Crafted with ❤ by Salla
*/
import { h, Host } from "@stencil/core";
import SIGift from "../../assets/svg/gift.svg";
export class SallaRewardCard {
render() {
return (h(Host, { key: '900a20618e1b3ce82778aa99715baf61689f3eee', class: "s-loyalty-program-reward-host" }, h("div", { key: '95b326008c2799ee7d38b48bc57e0860a9386184', class: "s-loyalty-program-reward-container" }, h("div", { key: 'd846dc36fa4494ed9ac6152a982f18598936969f', onClick: (e) => this.areaClick.emit(e), role: "button" }, h("div", { key: 'b8d23796827e4b07f6c271c50fa0e4aeb59f82fc', class: "s-loyalty-program-reward-img" }, h("img", { key: '04a52401941d8a731e8d310397b1ad735bfe44db', alt: "", src: this.prize.image || salla.url.cdn('images/s-empty.png'), class: "s-loyalty-program-rewards-img" })), h("div", { key: '64fa967c98d615d7b16859c9d14b60e0c53fc5aa', class: "s-loyalty-program-reward-content" }, h("div", { key: 'bb8c34ce8f3bcec9599c87b56bea6abd793187df', class: "s-loyalty-program-reward-points" }, h("salla-badge", { key: 'f7d0a396cf754d1e8f9e8fddee53a7d545311148', size: "xs" }, h("span", { key: '36f4e1ed873f1a231e2d5e51a2a8cc36bdcedfee', innerHTML: SIGift }), h("span", { key: '638b3ecefbfcb424869987ab33478e67d9b5d9b8', class: "s-loyalty-program-rewards-points" }, this.prize.cost_points, " ", salla.lang.get('pages.loyalty_program.points')))), h("div", { key: '6f8386fccf201836d76a86e7fe5e6d3461bb5540', class: "s-loyalty-program-reward-title" }, h("span", { key: '6d6692c44d6bac35da40108514471a3c56884d81' }, this.prize.group_title)), h("div", { key: '6ad9ad90728ac7f882ff8db9cfadb5a6e12f3e25', class: "s-loyalty-program-reward-name" }, h("div", { key: 'ef4344c7cb67785a4cd66d36e303e40a610a5375', class: "s-loyalty-program-rewards-name", id: `prize-${this.prize.id}` }, this.prize.name, this.prize.description ? `: ${this.prize.description}` : '')))), h("div", { key: '5eee5a4f8b10cd790ce41e4a99d94f86bd26dd3b', class: "p-4" }, h("slot", { key: '359d50033cdd3cce41901401bf0b75ba9c5aea1f', name: "action" }, h("button", { key: 'ea7aa1c5cd50937a27cef7580e508a1e3f8f852d', onClick: (e) => this.actionClick.emit(e.detail), class: "s-loyalty-program-rewards-action-base s-loyalty-program-rewards-action-on" }, salla.lang.get('pages.loyalty_program.show_reward')))))));
}
static get is() { return "salla-reward-card"; }
static get originalStyleUrls() {
return {
"$": ["salla-loyalty-program.scss"]
};
}
static get styleUrls() {
return {
"$": ["salla-loyalty-program.css"]
};
}
static get properties() {
return {
"prize": {
"type": "unknown",
"attribute": "prize",
"mutable": false,
"complexType": {
"original": "Prize",
"resolved": "Prize",
"references": {
"Prize": {
"location": "import",
"path": "./interfaces",
"id": "src/components/salla-loyalty-program/interfaces.ts::Prize"
}
}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": "The prize item"
},
"getter": false,
"setter": false
}
};
}
static get events() {
return [{
"method": "areaClick",
"name": "areaClick",
"bubbles": true,
"cancelable": true,
"composed": true,
"docs": {
"tags": [],
"text": "Callback to be called when the area is clicked"
},
"complexType": {
"original": "MouseEvent",
"resolved": "MouseEvent",
"references": {
"MouseEvent": {
"location": "global",
"id": "global::MouseEvent"
}
}
}
}, {
"method": "actionClick",
"name": "actionClick",
"bubbles": true,
"cancelable": true,
"composed": true,
"docs": {
"tags": [],
"text": "Callback to be called when the action is clicked"
},
"complexType": {
"original": "MouseEvent",
"resolved": "MouseEvent",
"references": {
"MouseEvent": {
"location": "global",
"id": "global::MouseEvent"
}
}
}
}];
}
}