import { Host, h } from '@stencil/core';
/**
 * This wrapper component applies input-like styling to a primary text-like input grouped with "addons"
 * e.g. closely-related secondary inputs or icons.
 * @docsPage
 * @exSlot <bs-select class="w-40">
 * &t;&t;<option>Placeholder</option>
 * &t;</bs-select>
 * &t;<bs-input-addon>
 * &t;&t;<bs-input placeholder="Type something here"></bs-input>
 * &t;&t;<bs-icon-biplane class="px-4"></bs-icon-biplane>
 * &t;</bs-input-addon>
 */
export class BsInputAddon {
  constructor() {
    this.disabled = false;
    this.error = false;
    this.multifocus = false;
    this.variant = undefined;
  }
  render() {
    return (h(Host, { "data-disabled": this.disabled ? true : undefined, "data-error": this.error ? true : undefined, "data-variant": this.variant || undefined, "data-multifocus": this.multifocus }, h("slot", null)));
  }
  static get is() { return "bs-input-addon"; }
  static get originalStyleUrls() {
    return {
      "$": ["bs-input-addon.scss"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["bs-input-addon.css"]
    };
  }
  static get properties() {
    return {
      "disabled": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Pass `true` to set disabled styles on container."
        },
        "attribute": "disabled",
        "reflect": false,
        "defaultValue": "false"
      },
      "error": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Pass `true` to set error styles on container."
        },
        "attribute": "error",
        "reflect": false,
        "defaultValue": "false"
      },
      "multifocus": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Pass `true` when slotting multiple focusable elements."
        },
        "attribute": "multifocus",
        "reflect": false,
        "defaultValue": "false"
      },
      "variant": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "'inner-bordered'",
          "resolved": "\"inner-bordered\"",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Variant `inner-bordered` will separate the slotted items with a border."
        },
        "attribute": "variant",
        "reflect": false
      }
    };
  }
}
//# sourceMappingURL=bs-input-addon.js.map
