@vertexvis/ui 0.1.5-testing.0 → 1.0.0-testing.0

package/dist/collection/components/search-bar/search-bar.js

@@ -1,676 +1,754 @@
-import { h, Host, } from '@stencil/core';
-import classNames from 'classnames';
-import deepEqual from 'fast-deep-equal';
-import { generateInstanceFromTemplate } from '../../util/templates/templates';
-import { createDocumentRange, createTextNode, getWindowSelection, isBrElement, isHtmlElement, nodeHasChildNodes, } from './dom';
-import { createResultUri, createSearchResultReplacement, getNodesForSearchResultReplacement, standardizeNewlinesAndSpaces, trimNonstandardSpaces, } from './lib';
+import { h, Host, } from "@stencil/core";
+import classNames from "classnames";
+import deepEqual from "fast-deep-equal";
+import { generateInstanceFromTemplate } from "../../util/templates/templates";
+import { createDocumentRange, createTextNode, getWindowSelection, isBrElement, isHtmlElement, nodeHasChildNodes, } from "./dom";
+import { createResultUri, createSearchResultReplacement, getNodesForSearchResultReplacement, standardizeNewlinesAndSpaces, trimNonstandardSpaces, } from "./lib";
 export class SearchBar {
-  constructor() {
-    this.rawElements = [];
-    this.attemptReplaceElement = (child, other, replacement, isBreaking = false) => {
-      // In the case that the child we're evaluating has its own children
-      // (often a wrapper `<div>`), we want to evaluate whether any of its
-      // children is the target to replace.
-      if (nodeHasChildNodes(child) &&
-        Array.from(child.childNodes).some((c) => nodeHasChildNodes(c) || this.isIdenticalElement(c, other))) {
-        return Array.from(child.childNodes).reduce((res, c) => [
-          ...res,
-          ...this.attemptReplaceElement(c, other, replacement, 
-          // If the element we're evaluating is a wrapper, we want to
-          // consider it a breaking element and add a newline to the
-          // replaced element only if the previous node is a `Text` node.
-          !isHtmlElement(child.previousSibling)),
-        ], []);
-      }
-      else {
-        return this.isIdenticalElement(child, other)
-          ? getNodesForSearchResultReplacement(replacement, isBreaking)
-          : [child];
-      }
-    };
-    this.isIdenticalElement = (child, other) => {
-      return (child === this.triggeredElement ||
-        this.getTextContent(child) === this.getTextContent(other));
-    };
-    this.getTextContent = (node) => {
-      var _a;
-      if (isHtmlElement(node)) {
-        return node.innerText;
-      }
-      return (_a = node.textContent) !== null && _a !== void 0 ? _a : '';
-    };
-    /**
-     * Inspects the cursor position for the following conditions:
-     *
-     * 1. The cursor has moved to text that contains a valid string
-     * and trigger character, indicating we need to dispatch a
-     * `searchChanged` event and display the results.
-     *
-     * 2. The cursor has moved within text that contains a valid string
-     * and trigger character, indicating we need to dispatch a
-     * `searchChanged` event to update the currently displayed results.
-     *
-     * 3. The cursor has moved to text that does not contain a valid
-     * string and trigger character, indicating we need to hide any
-     * displayed search results.
-     */
-    this.handleCursorPositionUpdate = () => {
-      var _a, _b;
-      const windowRange = (_a = getWindowSelection()) === null || _a === void 0 ? void 0 : _a.getRangeAt(0);
-      if (windowRange != null) {
-        const triggerText = this.readTriggerValue((_b = windowRange.commonAncestorContainer.textContent) !== null && _b !== void 0 ? _b : '', windowRange.startOffset);
-        if (!this.hasTriggered && triggerText != null) {
-          this.hasTriggered = true;
-          this.triggeredRange = windowRange;
-          this.triggeredElement = windowRange.commonAncestorContainer;
-          this.searchChanged.emit(triggerText.replace(this.triggerCharacter, ''));
-        }
-        else if (this.hasTriggered && triggerText != null) {
-          this.triggeredRange = windowRange;
-          this.triggeredElement = windowRange.commonAncestorContainer;
-          this.searchChanged.emit(triggerText.replace(this.triggerCharacter, ''));
-        }
-        else {
-          this.hasTriggered = false;
-          this.triggeredRange = undefined;
-          this.triggeredElement = undefined;
+    constructor() {
+        /**
+         * The search bar variant to display.
+         *
+         * Possible options are:
+         * - 'standard' (default)
+         * - 'filled'
+         * - 'underlined'
+         * - 'blank
+         */
+        this.variant = 'standard';
+        /**
+         * Whether this search bar is disabled.
+         */
+        this.disabled = false;
+        /**
+         * The character indicating that we should trigger a search.
+         *
+         * When this character is encountered, the text following it
+         * (omitting `breakCharacters`) will be emitted as a `searchChanged`
+         * event.
+         */
+        this.triggerCharacter = '@';
+        /**
+         * Characters that should trigger a "break" of the search. If
+         * a value in this list is encountered when trying to parse back
+         * to the `triggerCharacter`, this will hide the result list.
+         */
+        this.breakCharacters = [' ', '\n'];
+        /**
+         * The placement of the result list for this search bar.
+         *
+         * Corresponds to the value for the underlying <vertex-popover>
+         * placement value.
+         * @see(PopoverPlacement)
+         */
+        this.placement = 'bottom-start';
+        /**
+         * Replaced result values. This will be used in combination with the
+         * value of `value` to display existing replaced values.
+         *
+         * This value will be automatically updated as `Result`s are clicked
+         * within this search bar's `<vertex-result-list>`.
+         */
+        this.replacements = [];
+        /**
+         * The URI type of the values to replace. When `replacements` are
+         * evaluated, this value will be used as the scheme portion of the
+         * URI to detect matches.
+         *
+         * Defaults to `user`, and will match URIs composed with the `user`
+         * scheme and a UUID. E.g.
+         * `user:00000000-0000-0000-0000-000000000000`
+         */
+        this.replacementUriType = 'user';
+        this.displayedElements = [];
+        this.hasTriggered = false;
+        this.rawElements = [];
+        this.attemptReplaceElement = (child, other, replacement, isBreaking = false) => {
+            // In the case that the child we're evaluating has its own children
+            // (often a wrapper `<div>`), we want to evaluate whether any of its
+            // children is the target to replace.
+            if (nodeHasChildNodes(child) &&
+                Array.from(child.childNodes).some((c) => nodeHasChildNodes(c) || this.isIdenticalElement(c, other))) {
+                return Array.from(child.childNodes).reduce((res, c) => [
+                    ...res,
+                    ...this.attemptReplaceElement(c, other, replacement, 
+                    // If the element we're evaluating is a wrapper, we want to
+                    // consider it a breaking element and add a newline to the
+                    // replaced element only if the previous node is a `Text` node.
+                    !isHtmlElement(child.previousSibling)),
+                ], []);
+            }
+            else {
+                return this.isIdenticalElement(child, other)
+                    ? getNodesForSearchResultReplacement(replacement, isBreaking)
+                    : [child];
+            }
+        };
+        this.isIdenticalElement = (child, other) => {
+            return (child === this.triggeredElement ||
+                this.getTextContent(child) === this.getTextContent(other));
+        };
+        this.getTextContent = (node) => {
+            var _a;
+            if (isHtmlElement(node)) {
+                return node.innerText;
+            }
+            return (_a = node.textContent) !== null && _a !== void 0 ? _a : '';
+        };
+        /**
+         * Inspects the cursor position for the following conditions:
+         *
+         * 1. The cursor has moved to text that contains a valid string
+         * and trigger character, indicating we need to dispatch a
+         * `searchChanged` event and display the results.
+         *
+         * 2. The cursor has moved within text that contains a valid string
+         * and trigger character, indicating we need to dispatch a
+         * `searchChanged` event to update the currently displayed results.
+         *
+         * 3. The cursor has moved to text that does not contain a valid
+         * string and trigger character, indicating we need to hide any
+         * displayed search results.
+         */
+        this.handleCursorPositionUpdate = () => {
+            var _a, _b;
+            const windowRange = (_a = getWindowSelection()) === null || _a === void 0 ? void 0 : _a.getRangeAt(0);
+            if (windowRange != null) {
+                const triggerText = this.readTriggerValue((_b = windowRange.commonAncestorContainer.textContent) !== null && _b !== void 0 ? _b : '', windowRange.startOffset);
+                if (!this.hasTriggered && triggerText != null) {
+                    this.hasTriggered = true;
+                    this.triggeredRange = windowRange;
+                    this.triggeredElement = windowRange.commonAncestorContainer;
+                    this.searchChanged.emit(triggerText.replace(this.triggerCharacter, ''));
+                }
+                else if (this.hasTriggered && triggerText != null) {
+                    this.triggeredRange = windowRange;
+                    this.triggeredElement = windowRange.commonAncestorContainer;
+                    this.searchChanged.emit(triggerText.replace(this.triggerCharacter, ''));
+                }
+                else {
+                    this.hasTriggered = false;
+                    this.triggeredRange = undefined;
+                    this.triggeredElement = undefined;
+                }
+            }
+            this.cursorPosition = this.getCursorPosition();
+        };
+        this.readTriggerValue = (value, fromIndex) => {
+            const adjustedValue = value.replace(String.fromCharCode(160), ' ');
+            const beforeSubstr = adjustedValue.substring(0, fromIndex);
+            const afterSubstr = adjustedValue.substring(fromIndex);
+            const adjustedBeforeSubstr = beforeSubstr.includes(this.triggerCharacter)
+                ? beforeSubstr.substring(beforeSubstr.lastIndexOf(this.triggerCharacter))
+                : '';
+            const adjustedAfterSubstr = afterSubstr.substring(0, this.firstIndexOfBreakCharacter(afterSubstr));
+            const result = `${adjustedBeforeSubstr}${adjustedAfterSubstr}`;
+            return result.includes(this.triggerCharacter) &&
+                !this.includesBreakCharacter(result)
+                ? result
+                : undefined;
+        };
+        this.includesBreakCharacter = (value) => {
+            return this.breakCharacters.some((bc) => value.includes(bc));
+        };
+        this.firstIndexOfBreakCharacter = (value) => {
+            const indices = this.breakCharacters
+                .map((bc) => value.indexOf(bc))
+                .filter((i) => i >= 0);
+            return indices.length > 0 ? Math.min(...indices) : value.length;
+        };
+        this.moveCursorToNodeEnd = (node, collapseToStart = false) => {
+            const selection = getWindowSelection();
+            if (selection != null) {
+                const range = createDocumentRange();
+                range.selectNodeContents(node);
+                range.collapse(collapseToStart);
+                selection.removeAllRanges();
+                selection.addRange(range);
+            }
+        };
+        this.getContentAsString = (element) => {
+            if (element != null) {
+                const res = trimNonstandardSpaces(Array.from(element.childNodes).reduce((res, n) => {
+                    var _a;
+                    const previousSiblingIsBlock = n.previousSibling == null || isHtmlElement(n.previousSibling);
+                    if (isHtmlElement(n) && n.getAttribute('data-replaced') === 'true') {
+                        /**
+                         * If an element has been replaced visually, append the original
+                         * value prior to being replaced.
+                         */
+                        return `${res}${n.getAttribute('data-original')}`;
+                    }
+                    else if (isHtmlElement(n) && n.childElementCount > 0) {
+                        /**
+                         * If an element is a wrapper, we want to treat it as a block element,
+                         * ensuring newlines before and after the content.
+                         * Additionally, we want to evaluate each of its children independently.
+                         * Some browsers will conditionally wrap content in additional wrapper
+                         * elements we need to unravel.
+                         */
+                        return `${res}${previousSiblingIsBlock ? '' : '\n'}${this.getContentAsString(n)}`;
+                    }
+                    else if (isBrElement(n)) {
+                        /**
+                         * If an element is a `<br>` element, we want to simply represent
+                         * it as a newline in the returned string.
+                         */
+                        return `${res}\n`;
+                    }
+                    else if (isHtmlElement(n)) {
+                        /**
+                         * If an element is a wrapper, we want to treat it as a block element,
+                         * ensuring newlines before and after the content.
+                         * If the prior element is also to be treated as a block format, we
+                         * will omit the newline before the content to avoid duplicating the
+                         * behavior.
+                         */
+                        return `${res}${previousSiblingIsBlock ? '' : '\n'}${n.innerText}\n`;
+                    }
+                    else {
+                        /**
+                         * If a node is simply a `Text` node, we just want to append the text
+                         * if defined.
+                         */
+                        return `${res}${(_a = n.textContent) !== null && _a !== void 0 ? _a : ''}`;
+                    }
+                }, ''));
+                return res;
+            }
+            return '';
+        };
+        this.createReplacedElement = (original, data) => {
+            const template = this.hostEl.querySelector('template[slot="replaced"]');
+            if (template != null) {
+                const instance = generateInstanceFromTemplate(template);
+                instance.bindings.bind(data);
+                instance.element.id = data.id;
+                instance.element.style.display = 'inline-block';
+                instance.element.contentEditable = 'false';
+                instance.element.tabIndex = -1;
+                instance.element.setAttribute('data-replaced', 'true');
+                instance.element.setAttribute('data-original', original);
+                return instance.element;
+            }
+            else {
+                throw new Error('Replaced template not defined.');
+            }
+        };
+        this.handleKeyDown = this.handleKeyDown.bind(this);
+        this.handleKeyUp = this.handleKeyUp.bind(this);
+        this.handleResultClick = this.handleResultClick.bind(this);
+        this.handleClick = this.handleClick.bind(this);
+        this.handleWindowClick = this.handleWindowClick.bind(this);
+        this.handleInput = this.handleInput.bind(this);
+        this.handleBlur = this.handleBlur.bind(this);
+        this.handleFocus = this.handleFocus.bind(this);
+        this.handleCursorPositionUpdate =
+            this.handleCursorPositionUpdate.bind(this);
+        this.updateContent = this.updateContent.bind(this);
+        this.replaceContent = this.replaceContent.bind(this);
+    }
+    componentDidLoad() {
+        this.replaceContent(this.value);
+    }
+    connectedCallback() {
+        window.addEventListener('click', this.handleWindowClick);
+    }
+    disconnectedCallback() {
+        window.removeEventListener('click', this.handleWindowClick);
+    }
+    replaceContent(newValue, oldValue) {
+        if (newValue != null && newValue !== oldValue) {
+            const pattern = `${this.replacementUriType}:[0-9a-z-]{36}`;
+            const matches = newValue.match(new RegExp(pattern, 'g'));
+            const replacementsMap = this.replacements.reduce((map, r) => ({
+                ...map,
+                [createResultUri(r)]: r,
+            }), {});
+            let nextSubstr = newValue;
+            const parts = matches != null
+                ? matches === null || matches === void 0 ? void 0 : matches.reduce((res, m) => {
+                    if (replacementsMap[m] != null) {
+                        const urn = createResultUri(replacementsMap[m]);
+                        const index = nextSubstr.indexOf(urn);
+                        const before = nextSubstr.substring(0, index);
+                        const after = nextSubstr.substring(index + urn.length);
+                        const replacement = createSearchResultReplacement(replacementsMap[m], before);
+                        nextSubstr = after;
+                        return [
+                            ...res,
+                            replacement.before,
+                            replacement.beforeSpace,
+                            replacement.result,
+                            replacement.afterSpace,
+                        ];
+                    }
+                    return res;
+                }, [])
+                : [];
+            this.rawElements = [...parts, createTextNode(nextSubstr)].reduce((res, p) => [...res, ...standardizeNewlinesAndSpaces(p)], []);
+            this.updateContent(this.replacements);
         }
-      }
-      this.cursorPosition = this.getCursorPosition();
-    };
-    this.readTriggerValue = (value, fromIndex) => {
-      const adjustedValue = value.replace(String.fromCharCode(160), ' ');
-      const beforeSubstr = adjustedValue.substring(0, fromIndex);
-      const afterSubstr = adjustedValue.substring(fromIndex);
-      const adjustedBeforeSubstr = beforeSubstr.includes(this.triggerCharacter)
-        ? beforeSubstr.substring(beforeSubstr.lastIndexOf(this.triggerCharacter))
-        : '';
-      const adjustedAfterSubstr = afterSubstr.substring(0, this.firstIndexOfBreakCharacter(afterSubstr));
-      const result = `${adjustedBeforeSubstr}${adjustedAfterSubstr}`;
-      return result.includes(this.triggerCharacter) &&
-        !this.includesBreakCharacter(result)
-        ? result
-        : undefined;
-    };
-    this.includesBreakCharacter = (value) => {
-      return this.breakCharacters.some((bc) => value.includes(bc));
-    };
-    this.firstIndexOfBreakCharacter = (value) => {
-      const indices = this.breakCharacters
-        .map((bc) => value.indexOf(bc))
-        .filter((i) => i >= 0);
-      return indices.length > 0 ? Math.min(...indices) : value.length;
-    };
-    this.moveCursorToNodeEnd = (node, collapseToStart = false) => {
-      const selection = getWindowSelection();
-      if (selection != null) {
-        const range = createDocumentRange();
-        range.selectNodeContents(node);
-        range.collapse(collapseToStart);
-        selection.removeAllRanges();
-        selection.addRange(range);
-      }
-    };
-    this.getContentAsString = (element) => {
-      if (element != null) {
-        const res = trimNonstandardSpaces(Array.from(element.childNodes).reduce((res, n) => {
-          var _a;
-          const previousSiblingIsBlock = n.previousSibling == null || isHtmlElement(n.previousSibling);
-          if (isHtmlElement(n) && n.getAttribute('data-replaced') === 'true') {
-            /**
-             * If an element has been replaced visually, append the original
-             * value prior to being replaced.
-             */
-            return `${res}${n.getAttribute('data-original')}`;
-          }
-          else if (isHtmlElement(n) && n.childElementCount > 0) {
-            /**
-             * If an element is a wrapper, we want to treat it as a block element,
-             * ensuring newlines before and after the content.
-             * Additionally, we want to evaluate each of its children independently.
-             * Some browsers will conditionally wrap content in additional wrapper
-             * elements we need to unravel.
-             */
-            return `${res}${previousSiblingIsBlock ? '' : '\n'}${this.getContentAsString(n)}`;
-          }
-          else if (isBrElement(n)) {
-            /**
-             * If an element is a `<br>` element, we want to simply represent
-             * it as a newline in the returned string.
-             */
-            return `${res}\n`;
-          }
-          else if (isHtmlElement(n)) {
-            /**
-             * If an element is a wrapper, we want to treat it as a block element,
-             * ensuring newlines before and after the content.
-             * If the prior element is also to be treated as a block format, we
-             * will omit the newline before the content to avoid duplicating the
-             * behavior.
-             */
-            return `${res}${previousSiblingIsBlock ? '' : '\n'}${n.innerText}\n`;
-          }
-          else {
-            /**
-             * If a node is simply a `Text` node, we just want to append the text
-             * if defined.
-             */
-            return `${res}${(_a = n.textContent) !== null && _a !== void 0 ? _a : ''}`;
-          }
-        }, ''));
-        return res;
-      }
-      return '';
-    };
-    this.createReplacedElement = (original, data) => {
-      const template = this.hostEl.querySelector('template[slot="replaced"]');
-      if (template != null) {
-        const instance = generateInstanceFromTemplate(template);
-        instance.bindings.bind(data);
-        instance.element.id = data.id;
-        instance.element.style.display = 'inline-block';
-        instance.element.contentEditable = 'false';
-        instance.element.tabIndex = -1;
-        instance.element.setAttribute('data-replaced', 'true');
-        instance.element.setAttribute('data-original', original);
-        return instance.element;
-      }
-      else {
-        throw new Error('Replaced template not defined.');
-      }
-    };
-    this.variant = 'standard';
-    this.disabled = false;
-    this.triggerCharacter = '@';
-    this.breakCharacters = [' ', '\n'];
-    this.resultItems = undefined;
-    this.placement = 'bottom-start';
-    this.value = undefined;
-    this.placeholder = undefined;
-    this.replacements = [];
-    this.replacementUriType = 'user';
-    this.cursorPosition = undefined;
-    this.displayedElements = [];
-    this.hasTriggered = false;
-    this.handleKeyDown = this.handleKeyDown.bind(this);
-    this.handleKeyUp = this.handleKeyUp.bind(this);
-    this.handleResultClick = this.handleResultClick.bind(this);
-    this.handleClick = this.handleClick.bind(this);
-    this.handleWindowClick = this.handleWindowClick.bind(this);
-    this.handleInput = this.handleInput.bind(this);
-    this.handleBlur = this.handleBlur.bind(this);
-    this.handleFocus = this.handleFocus.bind(this);
-    this.handleCursorPositionUpdate =
-      this.handleCursorPositionUpdate.bind(this);
-    this.updateContent = this.updateContent.bind(this);
-    this.replaceContent = this.replaceContent.bind(this);
-  }
-  componentDidLoad() {
-    this.replaceContent(this.value);
-  }
-  connectedCallback() {
-    window.addEventListener('click', this.handleWindowClick);
-  }
-  disconnectedCallback() {
-    window.removeEventListener('click', this.handleWindowClick);
-  }
-  replaceContent(newValue, oldValue) {
-    if (newValue != null && newValue !== oldValue) {
-      const pattern = `${this.replacementUriType}:[0-9a-z-]{36}`;
-      const matches = newValue.match(new RegExp(pattern, 'g'));
-      const replacementsMap = this.replacements.reduce((map, r) => (Object.assign(Object.assign({}, map), { [createResultUri(r)]: r })), {});
-      let nextSubstr = newValue;
-      const parts = matches != null
-        ? matches === null || matches === void 0 ? void 0 : matches.reduce((res, m) => {
-          if (replacementsMap[m] != null) {
-            const urn = createResultUri(replacementsMap[m]);
-            const index = nextSubstr.indexOf(urn);
-            const before = nextSubstr.substring(0, index);
-            const after = nextSubstr.substring(index + urn.length);
-            const replacement = createSearchResultReplacement(replacementsMap[m], before);
-            nextSubstr = after;
-            return [
-              ...res,
-              replacement.before,
-              replacement.beforeSpace,
-              replacement.result,
-              replacement.afterSpace,
-            ];
-          }
-          return res;
-        }, [])
-        : [];
-      this.rawElements = [...parts, createTextNode(nextSubstr)].reduce((res, p) => [...res, ...standardizeNewlinesAndSpaces(p)], []);
-      this.updateContent(this.replacements);
     }
-  }
-  updateContent(newValue, oldValue) {
-    if (this.contentEl != null && !deepEqual(newValue, oldValue)) {
-      this.contentEl.innerHTML = '';
-      this.displayedElements = this.rawElements.map((el) => {
-        const raw = isHtmlElement(el) ? el.innerText : el.textContent;
-        const replacement = this.replacements.find((r) => raw === null || raw === void 0 ? void 0 : raw.includes(createResultUri(r)));
-        if (raw != null && replacement != null) {
-          const replacementElement = this.createReplacedElement(raw, replacement);
-          return replacementElement;
+    updateContent(newValue, oldValue) {
+        if (this.contentEl != null && !deepEqual(newValue, oldValue)) {
+            this.contentEl.innerHTML = '';
+            this.displayedElements = this.rawElements.map((el) => {
+                const raw = isHtmlElement(el) ? el.innerText : el.textContent;
+                const replacement = this.replacements.find((r) => raw === null || raw === void 0 ? void 0 : raw.includes(createResultUri(r)));
+                if (raw != null && replacement != null) {
+                    const replacementElement = this.createReplacedElement(raw, replacement);
+                    return replacementElement;
+                }
+                return el;
+            });
+            this.displayedElements.forEach((el) => {
+                var _a;
+                (_a = this.contentEl) === null || _a === void 0 ? void 0 : _a.appendChild(typeof el === 'string' ? createTextNode(el) : el);
+            });
+            if (this.lastReplacedSpace != null) {
+                this.moveCursorToNodeEnd(this.lastReplacedSpace);
+            }
+            this.inputChanged.emit(this.getContentAsString(this.contentEl));
         }
-        return el;
-      });
-      this.displayedElements.forEach((el) => {
+    }
+    render() {
         var _a;
-        (_a = this.contentEl) === null || _a === void 0 ? void 0 : _a.appendChild(typeof el === 'string' ? createTextNode(el) : el);
-      });
-      if (this.lastReplacedSpace != null) {
-        this.moveCursorToNodeEnd(this.lastReplacedSpace);
-      }
-      this.inputChanged.emit(this.getContentAsString(this.contentEl));
+        const classes = classNames('wrapper', {
+            standard: this.variant === 'standard',
+            filled: this.variant === 'filled',
+            underlined: this.variant === 'underlined',
+            blank: this.variant === 'blank',
+            disabled: this.disabled,
+        });
+        return (h(Host, { key: 'fd044b92cae880ada2e57b6005f6f3ca00f43c4a' }, h("div", { key: '9b6cd118e4fd931b851cd211419d3d6bb2fdbb11', class: classes }, h("span", { key: 'eb211c24a3d337d6d3cc2cab1af3c8c235e5cc51', class: "content-input", role: "textbox", contentEditable: "true", "aria-multiline": "true", "data-placeholder": this.placeholder, ref: (el) => (this.contentEl = el), onKeyDown: this.handleKeyDown, onKeyUp: this.handleKeyUp, onClick: this.handleCursorPositionUpdate, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur })), h("vertex-result-list", { key: 'ce85d59e8148a21f80eb81e1b997310955c1600f', position: this.cursorPosition, placement: this.placement, open: this.hasTriggered &&
+                this.resultItems != null &&
+                this.resultItems.length > 0, items: (_a = this.resultItems) !== null && _a !== void 0 ? _a : [], onEnterPressed: this.handleResultClick, onResultClick: this.handleResultClick }, h("slot", { key: 'd65d5eb8ed481d57edf7cddd8ad9a2f296aa8b01', name: "results" })), h("slot", { key: '504db2422c4ae0318d6a53d4510ae6a8d8b71345', name: "replaced" })));
     }
-  }
-  render() {
-    var _a;
-    const classes = classNames('wrapper', {
-      standard: this.variant === 'standard',
-      filled: this.variant === 'filled',
-      underlined: this.variant === 'underlined',
-      blank: this.variant === 'blank',
-      disabled: this.disabled,
-    });
-    return (h(Host, null, h("div", { class: classes }, h("span", { class: "content-input", role: "textbox", contentEditable: "true", "aria-multiline": "true", "data-placeholder": this.placeholder, ref: (el) => (this.contentEl = el), onKeyDown: this.handleKeyDown, onKeyUp: this.handleKeyUp, onClick: this.handleCursorPositionUpdate, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur })), h("vertex-result-list", { position: this.cursorPosition, placement: this.placement, open: this.hasTriggered &&
-        this.resultItems != null &&
-        this.resultItems.length > 0, items: (_a = this.resultItems) !== null && _a !== void 0 ? _a : [], onEnterPressed: this.handleResultClick, onResultClick: this.handleResultClick }, h("slot", { name: "results" })), h("slot", { name: "replaced" })));
-  }
-  handleKeyDown(event) {
-    if (this.hasTriggered && this.breakCharacters.includes(event.key)) {
-      this.hasTriggered = false;
-      this.triggeredRange = undefined;
-      this.triggeredElement = undefined;
+    handleKeyDown(event) {
+        if (this.hasTriggered && this.breakCharacters.includes(event.key)) {
+            this.hasTriggered = false;
+            this.triggeredRange = undefined;
+            this.triggeredElement = undefined;
+        }
     }
-  }
-  handleKeyUp(event) {
-    this.handleCursorPositionUpdate();
-    this.cursorPosition = this.getCursorPosition();
-  }
-  async handleInput() {
-    this.inputChanged.emit(this.getContentAsString(this.contentEl));
-  }
-  handleClick() {
-    this.handleCursorPositionUpdate();
-  }
-  handleWindowClick(event) {
-    if (isHtmlElement(event.target) &&
-      event.target.getAttribute('data-replaced') === 'true' &&
-      event.target.nextSibling != null) {
-      this.moveCursorToNodeEnd(event.target.nextSibling, true);
+    handleKeyUp(event) {
+        this.handleCursorPositionUpdate();
+        this.cursorPosition = this.getCursorPosition();
     }
-  }
-  handleFocus(event) {
-    this.inputFocus.emit(event);
-  }
-  handleBlur(event) {
-    this.hasTriggered = false;
-    this.inputBlur.emit(event);
-  }
-  handleResultClick(event) {
-    var _a;
-    const triggeredRange = this.triggeredRange;
-    const triggeredElement = this.triggeredElement;
-    const value = isHtmlElement(triggeredElement)
-      ? triggeredElement.innerText
-      : triggeredElement === null || triggeredElement === void 0 ? void 0 : triggeredElement.textContent;
-    if (this.contentEl != null &&
-      triggeredRange != null &&
-      triggeredElement != null &&
-      value != null) {
-      const triggeredValue = (_a = this.readTriggerValue(value, triggeredRange.startOffset)) !== null && _a !== void 0 ? _a : '';
-      const split = value.split(triggeredValue);
-      const before = split[0];
-      const after = split[1];
-      const replacement = createSearchResultReplacement(event.detail, before, after);
-      this.lastReplacedSpace = replacement.afterSpace;
-      this.rawElements = Array.from(this.contentEl.childNodes).reduce((re, e) => {
-        return [
-          ...re,
-          ...this.attemptReplaceElement(e, triggeredElement, replacement),
-        ];
-      }, []);
-      this.hasTriggered = false;
-      this.resultReplaced.emit(event.detail);
-      this.replacements = [
-        ...this.replacements.filter((r) => r.id !== event.detail.id),
-        event.detail,
-      ];
+    async handleInput() {
+        this.inputChanged.emit(this.getContentAsString(this.contentEl));
     }
-  }
-  getCursorPosition() {
-    var _a;
-    const selection = getWindowSelection();
-    if (selection != null && selection.rangeCount > 0) {
-      const cursorBounds = selection.getRangeAt(0).getBoundingClientRect();
-      const contentBounds = (_a = this.contentEl) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
-      const cursorBottom = cursorBounds.bottom || (contentBounds === null || contentBounds === void 0 ? void 0 : contentBounds.bottom) || 0;
-      const cursorTop = cursorBounds.top || (contentBounds === null || contentBounds === void 0 ? void 0 : contentBounds.top) || 0;
-      return {
-        x: cursorBounds.left || (contentBounds === null || contentBounds === void 0 ? void 0 : contentBounds.left) || 0,
-        y: this.placement.includes('top') ? cursorTop : cursorBottom,
-      };
+    handleClick() {
+        this.handleCursorPositionUpdate();
     }
-    throw new Error('Unable to retrieve window selection.');
-  }
-  static get is() { return "vertex-search-bar"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["search-bar.css"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["search-bar.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "variant": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "SearchBarVariant",
-          "resolved": "\"blank\" | \"filled\" | \"standard\" | \"underlined\"",
-          "references": {
-            "SearchBarVariant": {
-              "location": "local"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The search bar variant to display.\n\nPossible options are:\n- 'standard' (default)\n- 'filled'\n- 'underlined'\n- 'blank"
-        },
-        "attribute": "variant",
-        "reflect": false,
-        "defaultValue": "'standard'"
-      },
-      "disabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Whether this search bar is disabled."
-        },
-        "attribute": "disabled",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "triggerCharacter": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The character indicating that we should trigger a search.\n\nWhen this character is encountered, the text following it\n(omitting `breakCharacters`) will be emitted as a `searchChanged`\nevent."
-        },
-        "attribute": "trigger-character",
-        "reflect": false,
-        "defaultValue": "'@'"
-      },
-      "breakCharacters": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Characters that should trigger a \"break\" of the search. If\na value in this list is encountered when trying to parse back\nto the `triggerCharacter`, this will hide the result list."
-        },
-        "defaultValue": "[' ', '\\n']"
-      },
-      "resultItems": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "Result[]",
-          "resolved": "Result[] | undefined",
-          "references": {
-            "Result": {
-              "location": "import",
-              "path": "../result-list/types"
-            }
-          }
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "The items to display in this search bar's `<vertex-result-list>`.\n\nThis can be used alongside the `searchChanged` event to query for\nresults to display."
+    handleWindowClick(event) {
+        if (isHtmlElement(event.target) &&
+            event.target.getAttribute('data-replaced') === 'true' &&
+            event.target.nextSibling != null) {
+            this.moveCursorToNodeEnd(event.target.nextSibling, true);
         }
-      },
-      "placement": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "PopoverPlacement",
-          "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
-          "references": {
-            "PopoverPlacement": {
-              "location": "import",
-              "path": "../popover/popover"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [{
-              "name": "see",
-              "text": " (PopoverPlacement)"
-            }],
-          "text": "The placement of the result list for this search bar.\n\nCorresponds to the value for the underlying <vertex-popover>\nplacement value."
-        },
-        "attribute": "placement",
-        "reflect": false,
-        "defaultValue": "'bottom-start'"
-      },
-      "value": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string | undefined",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "The initial value of this search bar. This will be used in\ncombination with the value of `replacements` to display existing\nreplaced values."
-        },
-        "attribute": "value",
-        "reflect": false
-      },
-      "placeholder": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string | undefined",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "A placeholder to display when no text has been entered."
-        },
-        "attribute": "placeholder",
-        "reflect": false
-      },
-      "replacements": {
-        "type": "unknown",
-        "mutable": true,
-        "complexType": {
-          "original": "Result[]",
-          "resolved": "Result[]",
-          "references": {
-            "Result": {
-              "location": "import",
-              "path": "../result-list/types"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Replaced result values. This will be used in combination with the\nvalue of `value` to display existing replaced values.\n\nThis value will be automatically updated as `Result`s are clicked\nwithin this search bar's `<vertex-result-list>`."
-        },
-        "defaultValue": "[]"
-      },
-      "replacementUriType": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The URI type of the values to replace. When `replacements` are\nevaluated, this value will be used as the scheme portion of the\nURI to detect matches.\n\nDefaults to `user`, and will match URIs composed with the `user`\nscheme and a UUID. E.g.\n`user:00000000-0000-0000-0000-000000000000`"
-        },
-        "attribute": "replacement-uri-type",
-        "reflect": false,
-        "defaultValue": "'user'"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "cursorPosition": {},
-      "displayedElements": {},
-      "hasTriggered": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "searchChanged",
-        "name": "searchChanged",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Emitted when the value of the current search triggered by\nthe specified `triggerCharacter` has changed."
-        },
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        }
-      }, {
-        "method": "inputChanged",
-        "name": "inputChanged",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Emitted when the value of the input has changed."
-        },
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        }
-      }, {
-        "method": "resultReplaced",
-        "name": "resultReplaced",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Emitted when a result has been selected to replace the trigger text.\n\nIncludes the ID of the `Result` selected."
-        },
-        "complexType": {
-          "original": "Result",
-          "resolved": "{ id: string; type: string; } & Record<string, unknown>",
-          "references": {
-            "Result": {
-              "location": "import",
-              "path": "../result-list/types"
-            }
-          }
+    }
+    handleFocus(event) {
+        this.inputFocus.emit(event);
+    }
+    handleBlur(event) {
+        this.hasTriggered = false;
+        this.inputBlur.emit(event);
+    }
+    handleResultClick(event) {
+        var _a;
+        const triggeredRange = this.triggeredRange;
+        const triggeredElement = this.triggeredElement;
+        const value = isHtmlElement(triggeredElement)
+            ? triggeredElement.innerText
+            : triggeredElement === null || triggeredElement === void 0 ? void 0 : triggeredElement.textContent;
+        if (this.contentEl != null &&
+            triggeredRange != null &&
+            triggeredElement != null &&
+            value != null) {
+            const triggeredValue = (_a = this.readTriggerValue(value, triggeredRange.startOffset)) !== null && _a !== void 0 ? _a : '';
+            const split = value.split(triggeredValue);
+            const before = split[0];
+            const after = split[1];
+            const replacement = createSearchResultReplacement(event.detail, before, after);
+            this.lastReplacedSpace = replacement.afterSpace;
+            this.rawElements = Array.from(this.contentEl.childNodes).reduce((re, e) => {
+                return [
+                    ...re,
+                    ...this.attemptReplaceElement(e, triggeredElement, replacement),
+                ];
+            }, []);
+            this.hasTriggered = false;
+            this.resultReplaced.emit(event.detail);
+            this.replacements = [
+                ...this.replacements.filter((r) => r.id !== event.detail.id),
+                event.detail,
+            ];
         }
-      }, {
-        "method": "inputFocus",
-        "name": "inputFocus",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Emitted when the input is focused."
-        },
-        "complexType": {
-          "original": "FocusEvent",
-          "resolved": "FocusEvent",
-          "references": {
-            "FocusEvent": {
-              "location": "global"
-            }
-          }
+    }
+    getCursorPosition() {
+        var _a;
+        const selection = getWindowSelection();
+        if (selection != null && selection.rangeCount > 0) {
+            const cursorBounds = selection.getRangeAt(0).getBoundingClientRect();
+            const contentBounds = (_a = this.contentEl) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
+            const cursorBottom = cursorBounds.bottom || (contentBounds === null || contentBounds === void 0 ? void 0 : contentBounds.bottom) || 0;
+            const cursorTop = cursorBounds.top || (contentBounds === null || contentBounds === void 0 ? void 0 : contentBounds.top) || 0;
+            return {
+                x: cursorBounds.left || (contentBounds === null || contentBounds === void 0 ? void 0 : contentBounds.left) || 0,
+                y: this.placement.includes('top') ? cursorTop : cursorBottom,
+            };
         }
-      }, {
-        "method": "inputBlur",
-        "name": "inputBlur",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Emitted when the input is blurred."
-        },
-        "complexType": {
-          "original": "FocusEvent",
-          "resolved": "FocusEvent",
-          "references": {
-            "FocusEvent": {
-              "location": "global"
+        throw new Error('Unable to retrieve window selection.');
+    }
+    static get is() { return "vertex-search-bar"; }
+    static get encapsulation() { return "scoped"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["search-bar.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["search-bar.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "SearchBarVariant",
+                    "resolved": "\"blank\" | \"filled\" | \"standard\" | \"underlined\"",
+                    "references": {
+                        "SearchBarVariant": {
+                            "location": "local",
+                            "path": "/home/runner/work/vertex-web-ui/vertex-web-ui/packages/ui/src/components/search-bar/search-bar.tsx",
+                            "id": "src/components/search-bar/search-bar.tsx::SearchBarVariant"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The search bar variant to display.\n\nPossible options are:\n- 'standard' (default)\n- 'filled'\n- 'underlined'\n- 'blank"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'standard'"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether this search bar is disabled."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "triggerCharacter": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The character indicating that we should trigger a search.\n\nWhen this character is encountered, the text following it\n(omitting `breakCharacters`) will be emitted as a `searchChanged`\nevent."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "trigger-character",
+                "defaultValue": "'@'"
+            },
+            "breakCharacters": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Characters that should trigger a \"break\" of the search. If\na value in this list is encountered when trying to parse back\nto the `triggerCharacter`, this will hide the result list."
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[' ', '\\n']"
+            },
+            "resultItems": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Result[]",
+                    "resolved": "Result[] | undefined",
+                    "references": {
+                        "Result": {
+                            "location": "import",
+                            "path": "../result-list/types",
+                            "id": "src/components/result-list/types.ts::Result",
+                            "referenceLocation": "Result"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The items to display in this search bar's `<vertex-result-list>`.\n\nThis can be used alongside the `searchChanged` event to query for\nresults to display."
+                },
+                "getter": false,
+                "setter": false
+            },
+            "placement": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "PopoverPlacement",
+                    "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
+                    "references": {
+                        "PopoverPlacement": {
+                            "location": "import",
+                            "path": "../popover/popover",
+                            "id": "src/components/popover/popover.tsx::PopoverPlacement",
+                            "referenceLocation": "PopoverPlacement"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "see",
+                            "text": " (PopoverPlacement)"
+                        }],
+                    "text": "The placement of the result list for this search bar.\n\nCorresponds to the value for the underlying <vertex-popover>\nplacement value."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "placement",
+                "defaultValue": "'bottom-start'"
+            },
+            "value": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "The initial value of this search bar. This will be used in\ncombination with the value of `replacements` to display existing\nreplaced values."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value"
+            },
+            "placeholder": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "A placeholder to display when no text has been entered."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "placeholder"
+            },
+            "replacements": {
+                "type": "unknown",
+                "mutable": true,
+                "complexType": {
+                    "original": "Result[]",
+                    "resolved": "Result[]",
+                    "references": {
+                        "Result": {
+                            "location": "import",
+                            "path": "../result-list/types",
+                            "id": "src/components/result-list/types.ts::Result",
+                            "referenceLocation": "Result"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Replaced result values. This will be used in combination with the\nvalue of `value` to display existing replaced values.\n\nThis value will be automatically updated as `Result`s are clicked\nwithin this search bar's `<vertex-result-list>`."
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "replacementUriType": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The URI type of the values to replace. When `replacements` are\nevaluated, this value will be used as the scheme portion of the\nURI to detect matches.\n\nDefaults to `user`, and will match URIs composed with the `user`\nscheme and a UUID. E.g.\n`user:00000000-0000-0000-0000-000000000000`"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "replacement-uri-type",
+                "defaultValue": "'user'"
             }
-          }
-        }
-      }];
-  }
-  static get elementRef() { return "hostEl"; }
-  static get watchers() {
-    return [{
-        "propName": "value",
-        "methodName": "replaceContent"
-      }, {
-        "propName": "replacements",
-        "methodName": "updateContent"
-      }];
-  }
+        };
+    }
+    static get states() {
+        return {
+            "cursorPosition": {},
+            "displayedElements": {},
+            "hasTriggered": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "searchChanged",
+                "name": "searchChanged",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the value of the current search triggered by\nthe specified `triggerCharacter` has changed."
+                },
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                }
+            }, {
+                "method": "inputChanged",
+                "name": "inputChanged",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the value of the input has changed."
+                },
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                }
+            }, {
+                "method": "resultReplaced",
+                "name": "resultReplaced",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when a result has been selected to replace the trigger text.\n\nIncludes the ID of the `Result` selected."
+                },
+                "complexType": {
+                    "original": "Result",
+                    "resolved": "{ id: string; type: string; } & Record<string, unknown>",
+                    "references": {
+                        "Result": {
+                            "location": "import",
+                            "path": "../result-list/types",
+                            "id": "src/components/result-list/types.ts::Result",
+                            "referenceLocation": "Result"
+                        }
+                    }
+                }
+            }, {
+                "method": "inputFocus",
+                "name": "inputFocus",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the input is focused."
+                },
+                "complexType": {
+                    "original": "FocusEvent",
+                    "resolved": "FocusEvent",
+                    "references": {
+                        "FocusEvent": {
+                            "location": "global",
+                            "id": "global::FocusEvent"
+                        }
+                    }
+                }
+            }, {
+                "method": "inputBlur",
+                "name": "inputBlur",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the input is blurred."
+                },
+                "complexType": {
+                    "original": "FocusEvent",
+                    "resolved": "FocusEvent",
+                    "references": {
+                        "FocusEvent": {
+                            "location": "global",
+                            "id": "global::FocusEvent"
+                        }
+                    }
+                }
+            }];
+    }
+    static get elementRef() { return "hostEl"; }
+    static get watchers() {
+        return [{
+                "propName": "value",
+                "methodName": "replaceContent"
+            }, {
+                "propName": "replacements",
+                "methodName": "updateContent"
+            }];
+    }
 }