import Component  from '../component.js'

export default class CoUxFieldSearch extends Component {
    constructor(parent) {
      let selector = 'div[@data-e2e="ux-field-search"]';
      super(parent, selector);
    }
    get inputGroup() {
      let path = '//div[@class = "input-group"]';
      return this.currentPath + path;
    }
    // search icon
    get inputGroupPrepend() {
      let path = '//span[contains(@class,"input-group-prepend")]';
      return this.inputGroup + path;
    }
    get inputGroupText() {
      let path = '//span[contains(@class,"input-group-text")]';
      return this.inputGroupPrepend + path;
    }
    get inputGroupIcon() {
      let path = '//span[contains(@class,"ux-icon-search")]';
      return this.inputGroupText + path;
    }
    // input Field
    get inputWrapper() {
      let path = '//div[contains(@class,"ux-clearable-input-wrapper")]';
      return this.inputGroup + path;
    }
    get inputField() {
      let path = '//input[contains(@class,"form-control")]';
      return this.inputWrapper + path;
    }
    get clearText() {
      let path = '//i[contains(@class,"ux-clearable-input-wrapper__clear")]';
      return this.inputWrapper + path;
    }
    get inputMatAutocomplete() {
      let path = '//mat-autocomplete[contains(@class,"mat-autocomplete")]';
      return this.inputWrapper + path;
    }
    // input group append
    get groupAppend() {
      let path = '//span[contains(@class,"input-group-append")]';
      return this.inputGroup + path;
    }
    // input Field dropdown button
    get dropdownButtonCO() {
      return new CoUxDropdownButton(this.groupAppend);
    }
    // search button
    get searchButton() {
      let path = '//button[contains(@class,"ux-field-search__search-button")]';
      return this.groupAppend + path;
    }
    // form group input content
    get formGroupInputContent() {
      let path = '//div[contains(@class,"ux-form-group__input-content")]';
      return this.inputGroup + path;
    }
}

