import Component from '../../component.js'
import CoUxDropdownButton from './ux-dropdown-button.js'
import MatAutocomplete from '../../material/mat-autocomplete.js'
import MatOption from '../../material/mat-option.js'
import ButtonComponent from '../../button.js'
import { elementAttributeContains } from '../../../core/utils.js'

export default class CoUxFieldSearch extends Component {
    constructor(parent) {
      let selector = 'ux-field-search';
      super(parent, selector);
      //https://citnet.tech.ec.europa.eu/CITnet/stash/projects/CSDR/repos/eui/browse/packages/components/src/lib/ux-components/ux-field-search/ux-field-search.component.html
    }
    get dataE2E() {
      let path = '//div[@data-e2e="ux-field-search"]';
      return this.currentPath + path;
    }
    async isDropdownFilter() {
      return await elementAttributeContains(this.dataE2E, 'class', 'ux-field-search__with-filter');
    }
    async isShowPrependSearchIcon() {
      return await elementAttributeContains(this.dataE2E, 'class', 'ux-field-search__with-prepend-icon');
    }
    get inputGroup() {
      let path = '//div[@class = "ux-input-group"]';
      return this.dataE2E + path;
    }
    get inputGroupPrepend() {
      let path = '//span[contains(@class,"ux-input-group-prepend")]';
      return this.inputGroup + path;
    }
    get inputGroupText() {
      let path = '//span[contains(@class,"ux-input-group-text")]';
      return this.inputGroupPrepend + path;
    }
    get inputGroupIcon() {
      let path = '//span[contains(@class,"ux-field-search__icon")]';
      return this.inputGroupText + path;
    }
    get inputWrapper() {
      let path = '//div[contains(@class,"eui-clearable-input-wrapper")]';
      return this.inputGroup + path;
    }
    get inputField() {
      let path = '//input[contains(@class,"ux-form-control")]';
      return this.inputWrapper + path;
    }
    get clearText() {
      let path = '//span[contains(@class,"eui-clearable-input-wrapper__clear")]';
      return this.inputWrapper + path;
    }
    async hasData() {
      return await (await $(this.clearText)).isExisting();
    }
    get matAutocompleteCO() {
      return new MatAutocomplete(this.inputWrapper);
    }
    get matOptionCO() {
      return new MatOption(this.matAutocompleteCO);
    }
    get inputContent() {
      let path = '//div[contains(@class,"ux-form-group__input-content")]';
      return this.inputWrapper + path;
    }
    get loadingIndicator() {
      let path = '//span[contains(@class,"ux-form-group__loading-indicator")]';
      return this.inputContent + path;
    }
    async hasSuggestionsDataLoading() {
      return await (await $(this.loadingIndicator)).isExisting();
    }
    get groupAppend() {
      let path = '//span[contains(@class,"ux-input-group-append")]';
      return this.inputGroup + path;
    }
    get dropdownButtonCO() {
      return new CoUxDropdownButton(this.groupAppend);
    }
    get searchButtonCO() {
      return new ButtonComponent(this.groupAppend).byAttributeContains('class','ux-field-search__search-button');
    }
    get searchButtonSpan() {
      let path = '//span';
      return this.searchButtonCO.currentPath + path;
    }
    get searchButtonIcon() {
      return this.searchButtonCO.buttonIcon;
    }
    async hasSearchButtonAsIcon() {
      return await (await $(this.searchButtonIcon)).isExisting();
    }
    get secondaryButtonCO() {
      return new ButtonComponent(this.groupAppend).byAttributeContains('class','ux-button--secondary');
    }
    async hasFilterButtonTrigger() {
      return await (await $(this.secondaryButtonCO.currentPath)).isExisting();
    }
    get secondaryButtonIcon() {
      return this.secondaryButtonCO.buttonIcon + path;
    }

}


