import { Component, h, Prop, Host } from '@stencil/core';
export class TeliaRow {
  constructor() {
    /** Tracking id is used to identify and count Component usage */
    this.dataTrackingId = 'telia-row';
  }
  render() {
    const componentClass = 'telia-row';
    const rowClasses = {
      [componentClass]: true,
      [`${componentClass}--${this.spacing}`]: !!this.spacing,
      [`${componentClass}--col-gap`]: this.gap,
    };
    return (h(Host, { class: rowClasses },
      h("slot", null),
      h("telia-vst", { dataTrackingId: this.dataTrackingId })));
  }
  static get is() { return "telia-row"; }
  static get originalStyleUrls() { return {
    "$": ["telia-row.scss"]
  }; }
  static get styleUrls() { return {
    "$": ["telia-row.css"]
  }; }
  static get properties() { return {
    "spacing": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "RowVariantType",
        "resolved": "\"lg\" | \"md\" | \"sm\" | \"xl\"",
        "references": {
          "RowVariantType": {
            "location": "import",
            "path": "../../types/RowVariants"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": "Adds row bottom margin"
      },
      "attribute": "spacing",
      "reflect": false
    },
    "gap": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": "Adds bottom margin on direct child telia-col"
      },
      "attribute": "gap",
      "reflect": false
    }
  }; }
}
