'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-140bcbcd.js');
const index$1 = require('./index-f23d1d6b.js');
require('./Item-00ce8c24.js');
require('./index-ac98852d.js');
require('./Credentials-8e4749ab.js');
require('./Token-8c5ba5d9.js');
require('./index-d3079b93.js');
require('./_commonjsHelpers-537d719a.js');
require('./index-09251373.js');
require('./TextDecoder-753156f3.js');

const styleCss$2 = ".sc-ig-autocomplete-input-h{display:block;font-family:var(--smoothly-font-family)}.sc-ig-autocomplete-input-h>div.sc-ig-autocomplete-input:nth-child(1){position:absolute;display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;padding:1em 0.2em 0.2em 0.2em;white-space:nowrap}.sc-ig-autocomplete-input-h>div.sc-ig-autocomplete-input:nth-child(1)>div.sc-ig-autocomplete-input:nth-child(1){color:transparent;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;font-size:1rem;font-family:var(--smoothly-font-family)}.sc-ig-autocomplete-input-h>div.sc-ig-autocomplete-input:nth-child(1) smoothly-menu-options.sc-ig-autocomplete-input{grid-column-start:2;grid-row-start:2;z-index:99}.sc-ig-autocomplete-input-h:not(:focus-within) smoothly-menu-options.sc-ig-autocomplete-input{display:none}.sc-ig-autocomplete-input-h:not([has-suggestion]) smoothly-menu-options.sc-ig-autocomplete-input,.sc-ig-autocomplete-input-h:not([show-suggestion]) smoothly-menu-options.sc-ig-autocomplete-input{display:none}.sc-ig-autocomplete-input-h smoothly-input.sc-ig-autocomplete-input input.sc-ig-autocomplete-input{color:rgb(var(--smoothly-default-contrast))}";

const IntergiroAutocompleteInput = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.lastValue = "";
    this.options = [];
    this.showSuggestion = false;
    this.value = "";
  }
  componentDidRender() {
    var _a;
    (_a = this.menuElement) === null || _a === void 0 ? void 0 : _a.filterOptions("");
  }
  inputValueChangeHandler(event) {
    if (event.detail) {
      this.value = event.detail.value;
      this.setInvisibleDiv(event.detail.value);
    }
  }
  optionSelectHandler(event) {
    if (event.detail) {
      this.inputElement.setKeepFocusOnReRender(true);
      this.select(event.detail.value);
    }
    event.stopPropagation();
  }
  onKeyDown(event) {
    var _a;
    if (event.key == "ArrowUp" || event.key == "ArrowDown")
      this.showSuggestion
        ? this.menuElement.moveHighlight(event.key == "ArrowUp" ? -1 : 1)
        : (this.showSuggestion = true);
    else if (event.key == "Escape")
      this.showSuggestion = false;
    else if (event.key == "Enter" && this.showSuggestion) {
      (_a = this.menuElement) === null || _a === void 0 ? void 0 : _a.getHighlighted().then((result) => {
        result && this.select(result.value);
      });
      this.options && this.options.length > 0 && event.preventDefault();
    }
  }
  onKeyUp(event) {
    if (this.inputElement.value != this.lastValue) {
      this.lastValue = this.inputElement.value;
      this.suggest();
    }
  }
  suggest() {
    if (this.inputElement && this.inputElement.value != undefined && this.menuElement && this.template) {
      const completion = index$1.dist.Type.complete(this.template, this.inputElement.value);
      const oldOptions = this.options;
      this.options = completion.map(c => {
        var _a;
        return { value: c, name: (_a = c.addon) !== null && _a !== void 0 ? _a : "", description: c.description };
      });
      const optionsChanged = oldOptions.map(o => o.value.full).join(",") != this.options.map(o => o.value.full).join(",");
      if (optionsChanged)
        this.showSuggestion = true;
      this.menuElement.setHighlight(0);
    }
  }
  select(newSelection) {
    const newString = newSelection.full;
    this.inputElement.value = newString;
    this.setInvisibleDiv(newString);
    const cursorPosition = newSelection.cursor && typeof newSelection.cursor == "number" ? newSelection.cursor : newString.length;
    this.inputElement.setSelectionRange(cursorPosition, cursorPosition);
  }
  setInvisibleDiv(newValue) {
    if (newValue)
      this.invisibleDiv.innerHTML = newValue.replace(/ /g, "&nbsp;");
    if (newValue == "")
      this.invisibleDiv.innerHTML = "&nbsp;";
  }
  render() {
    return (index.h(index.Host, { "has-suggestion": this.options && this.options.length > 0, "show-suggestion": this.showSuggestion, onClick: () => {
        this.showSuggestion = true;
        this.suggest();
      }, onKeyDown: (e) => this.onKeyDown(e), onKeyUp: (e) => this.onKeyUp(e) }, index.h("div", null, index.h("div", { ref: (el) => (this.invisibleDiv = el) }, "\u00A0"), index.h("smoothly-menu-options", { ref: (el) => (this.menuElement = el), style: { width: "300px" }, "empty-menu-label": "", "max-menu-height": "200px", options: this.options })), index.h("smoothly-input", { ref: (el) => (this.inputElement = el !== null && el !== void 0 ? el : this.inputElement), name: this.name, autocomplete: false, value: this.value }, index.h("slot", null))));
  }
};
IntergiroAutocompleteInput.style = styleCss$2;

const styleCss$1 = ":host{max-height:300px;width:85%;max-height:var(--max-menu-height);border:1px solid black;-webkit-box-sizing:border-box;box-sizing:border-box;background-color:rgb(var(--smoothly-default-shade));overflow-y:auto;cursor:pointer}div:last-child:not(:empty){padding:0.5em 1em;font-style:italic}";

const SmoothlyMenuOptions = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.filteredOptions = [];
    this.highlightIndex = 0;
    this.emptyMenuLabel = "No Options";
    this.order = false;
    this.options = [];
    this.resetHighlightOnOptionsChange = true;
  }
  optionsChangeHandler(newOptions) {
    this.highlightIndex = this.resetHighlightOnOptionsChange ? 0 : this.highlightIndex;
  }
  optionHoverHandler(event) {
    if (event.detail.value)
      this.setHighlight(event.detail.value);
    event.stopPropagation();
  }
  async moveHighlight(step) {
    if (this.filteredOptions.length > 0)
      this.setHighlight((this.highlightIndex + step + this.filteredOptions.length) % this.filteredOptions.length, true);
  }
  async setHighlight(newIndex, scrollToHighlight = false) {
    if (typeof newIndex == "number") {
      this.highlightIndex = newIndex;
      scrollToHighlight && this.scrollTo(this.highlightIndex);
    }
    else {
      const value = newIndex;
      let isHighlightSet = false;
      this.filteredOptions.forEach((option, index) => {
        const highlight = option.value == value;
        this.highlightIndex = highlight ? index : this.highlightIndex;
        highlight && scrollToHighlight && this.scrollTo(index);
        isHighlightSet = highlight ? true : isHighlightSet;
      });
      if (!isHighlightSet)
        this.setHighlight(0, true);
    }
  }
  async getHighlighted() {
    let result = undefined;
    if (this.highlightIndex != undefined && this.filteredOptions.length > 0)
      result = this.filteredOptions[this.highlightIndex];
    return result;
  }
  async filterOptions(keyword, excludeValues = []) {
    const keywordLowercase = keyword.toLowerCase();
    this.filteredOptions = [];
    for (const option of this.options) {
      const names = option.name + (option.aliases ? option.aliases.join(" ") : "");
      const isVisible = names.toLowerCase().includes(keywordLowercase) && !excludeValues.includes(option.value);
      isVisible && this.filteredOptions.push(option);
    }
    this.order && this.sortOptions(keyword);
  }
  sortOptions(keyword) {
    const keywordLowercase = keyword.toLowerCase();
    this.filteredOptions.sort((a, b) => {
      return this.getPriorityScore(a, keywordLowercase) - this.getPriorityScore(b, keywordLowercase);
    });
  }
  getPriorityScore(option, keywordLowercase) {
    let result = Number.MAX_SAFE_INTEGER;
    const name = option.name;
    const aliases = option.aliases ? option.aliases.join(" ") : "";
    const names = `${name ? name : ""} ${aliases ? aliases : ""}`.toLowerCase();
    if (name) {
      result = names.split(" ").reduce((minIndex, word) => {
        const index = word.indexOf(keywordLowercase);
        return index != -1 && index < minIndex ? index : minIndex;
      }, Number.MAX_SAFE_INTEGER);
    }
    return result;
  }
  scrollTo(optionIndex) {
    var _a;
    const optionHeight = (_a = this.firstOptionsElement) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().height;
    if (optionHeight) {
      const menuHeight = this.element.getBoundingClientRect().height;
      const scrollPosition = this.element.scrollTop;
      const optionPosition = optionIndex * optionHeight;
      const numOptionsInMenu = Math.floor(menuHeight / optionHeight);
      if (optionPosition - optionHeight / 2 < scrollPosition)
        this.element.scrollTo({ top: (optionIndex - 1) * optionHeight });
      else if (scrollPosition < optionPosition + optionHeight - menuHeight)
        this.element.scrollTo({ top: (optionIndex + 1 - numOptionsInMenu) * optionHeight });
    }
  }
  render() {
    return (index.h(index.Host, { style: { "--max-menu-height": this.maxMenuHeight } }, this.filteredOptions.length > 0 ? (this.filteredOptions.map((option, index$1) => (index.h("smoothly-option", { style: this.optionStyle, ref: el => index$1 == 0 && (this.firstOptionsElement = el !== null && el !== void 0 ? el : this.firstOptionsElement), value: option.value, name: option.name, "data-highlight": this.highlightIndex == index$1 }, option.description)))) : (index.h("div", null, this.emptyMenuLabel))));
  }
  get element() { return index.getElement(this); }
  static get watchers() { return {
    "options": ["optionsChangeHandler"]
  }; }
};
SmoothlyMenuOptions.style = styleCss$1;

const styleCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;padding:0.5em 1em}:host([data-highlight]){background-color:rgb(var(--smoothly-primary-color));color:rgb(var(--smoothly-primary-contrast));stroke:rgb(var(--smoothly-primary-contrast));fill:rgb(var(--smoothly-primary-contrast))}:host([data-highlight]) div:last-child{color:rgba(var(--smoothly-primary-contrast), 0.8)}:host div:last-child{color:rgba(var(--smoothly-default-contrast), 0.8);font-style:italic}";

const SmoothlyOption = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.optionHover = index.createEvent(this, "optionHover", 7);
    this.optionSelect = index.createEvent(this, "optionSelect", 7);
    this.dataHighlight = false;
  }
  onHover(event) {
    this.optionHover.emit({ name: this.name, value: this.value });
  }
  onSelect(event) {
    if (this.value)
      this.optionSelect.emit({ name: this.name, value: this.value });
    else
      throw `smoothly-option ${this.element.innerHTML} lacks value-property and can therefore not be selected`;
  }
  render() {
    return (index.h(index.Host, { onMouseDown: (e) => this.onSelect(e), onMouseOver: (e) => this.onHover(e) }, index.h("div", null, this.name), index.h("div", null, index.h("slot", null))));
  }
  get element() { return index.getElement(this); }
};
SmoothlyOption.style = styleCss;

exports.ig_autocomplete_input = IntergiroAutocompleteInput;
exports.smoothly_menu_options = SmoothlyMenuOptions;
exports.smoothly_option = SmoothlyOption;
