@salla.sa/twilight-components/dist/collection/components/salla-list-tile/salla-list-tile.js

Salla Web Component

/*!
 * Crafted with ❤ by Salla
 */
import { Host, h } from "@stencil/core";
/**
 * @slot icon - An icon to display before the title.
 * @slot title - The primary content of the list tile.
 * @slot subtitle - Additional content displayed below the title.
 * @slot action - An element to display after the title.
 */
export class SallaListTile {
  constructor() {
    this.href = undefined;
    this.target = "_self";
  }
  generateClass() {
    return {
      "s-list-tile-item": true,
      "s-list-tile-item-href": !!this.href
    };
  }
  render() {
    return (h(Host, null, h("a", { class: this.generateClass(), href: this.href, target: this.target }, h("div", { class: "s-list-tile-item-icon" }, h("slot", { name: 'icon' })), h("div", { class: "s-list-tile-item-content" }, h("div", { class: "s-list-tile-item-title" }, h("slot", { name: 'title' })), h("div", { class: "s-list-tile-item-subtitle" }, h("slot", { name: "subtitle" }))), h("div", { class: "s-list-tile-item-action" }, h("slot", { name: 'action' })))));
  }
  static get is() { return "salla-list-tile"; }
  static get originalStyleUrls() {
    return {
      "$": ["salla-list-tile.scss"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["salla-list-tile.css"]
    };
  }
  static get properties() {
    return {
      "href": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string | undefined",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Designates the component as anchor and applies the `href` attribute."
        },
        "attribute": "href",
        "reflect": false,
        "defaultValue": "undefined"
      },
      "target": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "\"_blank\" | \"_self\" | \"_parent\" | \"_top\" | \"framename\"",
          "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\" | \"framename\"",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Designates the target attribute. This should only be applied when using the `href` prop."
        },
        "attribute": "target",
        "reflect": false,
        "defaultValue": "\"_self\""
      }
    };
  }
}
//# sourceMappingURL=salla-list-tile.js.map