var L=Object.defineProperty;var R=(e,t)=>{for(var o in t)L(e,o,{get:t[o],enumerable:!0})};var S={};R(S,{SuggestionInput:()=>i});import*as x from"./../code_highlighter/code_highlighter.js";var f=`.token-variable{color:var(--sys-color-token-variable)}.token-property{color:var(--sys-color-token-property)}.token-type{color:var(--sys-color-token-type)}.token-variable-special{color:var(--sys-color-token-variable-special)}.token-definition{color:var(--sys-color-token-definition)}.token-builtin{color:var(--sys-color-token-builtin)}.token-number{color:var(--sys-color-token-number)}.token-string{color:var(--sys-color-token-string)}.token-string-special{color:var(--sys-color-token-string-special)}.token-atom{color:var(--sys-color-token-atom)}.token-keyword{color:var(--sys-color-token-keyword)}.token-comment{color:var(--sys-color-token-comment)}.token-meta{color:var(--sys-color-token-meta)}.token-invalid{color:var(--sys-color-error)}.token-tag{color:var(--sys-color-token-tag)}.token-attribute{color:var(--sys-color-token-attribute)}.token-attribute-value{color:var(--sys-color-token-attribute-value)}.token-inserted{color:var(--sys-color-token-inserted)}.token-deleted{color:var(--sys-color-token-deleted)}.token-heading{color:var(--sys-color-token-variable-special);font-weight:bold}.token-link{color:var(--sys-color-token-variable-special);text-decoration:underline}.token-strikethrough{text-decoration:line-through}.token-strong{font-weight:bold}.token-emphasis{font-style:italic}
/*# sourceURL=${import.meta.resolve("./codeHighlighter.css")} */`;import*as T from"./../../lit/lit.js";import*as h from"./../../visual_logging/visual_logging.js";var p=`*{box-sizing:border-box;font-size:inherit;margin:0;padding:0}:host{position:relative}devtools-editable-content{background:transparent;border:none;color:var(--override-color-recorder-input,var(--sys-color-on-surface));cursor:text;display:inline-block;line-height:18px;min-height:18px;min-width:0.5em;outline:none;overflow-wrap:anywhere}devtools-editable-content:hover,
devtools-editable-content:focus{box-shadow:0 0 0 1px var(--sys-color-divider);border-radius:2px}devtools-editable-content[placeholder]:empty::before{content:attr(placeholder);color:var(--sys-color-on-surface);opacity:50%}devtools-editable-content[placeholder]:empty:focus::before{content:""}devtools-suggestion-box{position:absolute;display:none}devtools-editable-content:focus ~ devtools-suggestion-box{display:block}.suggestions{background-color:var(--sys-color-cdt-base-container);box-shadow:var(--drop-shadow);min-height:1em;min-width:150px;overflow:hidden auto;position:relative;z-index:100;max-height:350px}.suggestions > li{padding:1px;border:1px solid transparent;white-space:nowrap;font-family:var(--source-code-font-family);font-size:var(--source-code-font-size);color:var(--sys-color-on-surface)}.suggestions > li:hover{background-color:var(--sys-color-state-hover-on-subtle)}.suggestions > li.selected{background-color:var(--sys-color-primary);color:var(--sys-color-cdt-base-container)}.strikethrough{text-decoration:line-through}
/*# sourceURL=${import.meta.resolve("./suggestionInput.css")} */`;var s=function(e,t,o,n){var c=arguments.length,l=c<3?t:n===null?n=Object.getOwnPropertyDescriptor(t,o):n,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")l=Reflect.decorate(e,t,o,n);else for(var u=e.length-1;u>=0;u--)(d=e[u])&&(l=(c<3?d(l):c>3?d(t,o,l):d(t,o))||l);return c>3&&l&&Object.defineProperty(t,o,l),l},j=(e,t)=>(e%t+t)%t;function w(e,t="Assertion failed!"){if(!e)throw new Error(t)}var{html:g,Decorators:D,Directives:A,LitElement:v}=T,{customElement:m,property:r,state:E}=D,{classMap:$}=A,C={hasChanged(e,t){return JSON.stringify(e)!==JSON.stringify(t)},attribute:!1},k=class extends HTMLElement{static get observedAttributes(){return["disabled","placeholder"]}set disabled(t){this.contentEditable=String(!t)}get disabled(){return this.contentEditable!=="true"}set value(t){this.innerText=t,this.#e()}get value(){return this.innerText}set mimeType(t){this.#t=t,this.#e()}get mimeType(){return this.#t}#t="";constructor(){super(),this.contentEditable="true",this.tabIndex=0,this.addEventListener("focus",()=>{this.textContent=this.innerText}),this.addEventListener("blur",this.#e.bind(this))}#e(){this.#t&&x.CodeHighlighter.highlightNode(this,this.#t)}attributeChangedCallback(t,o,n){t==="disabled"&&(this.disabled=n!==null)}};k=s([m("devtools-editable-content")],k);var y=class e extends Event{static eventName="suggest";constructor(t){super(e.eventName),this.suggestion=t}},b=class e extends Event{static eventName="suggestioninit";listeners;constructor(t){super(e.eventName),this.listeners=t}},N=(e,t)=>e.toLowerCase().startsWith(t.toLowerCase()),a=class extends v{#t=[];constructor(){super(),this.options=[],this.expression="",this.cursor=0}#e=t=>{if(w(t instanceof KeyboardEvent,"Bound to the wrong event."),this.#t.length>0)switch(t.key){case"ArrowDown":t.stopPropagation(),t.preventDefault(),this.#o(1);break;case"ArrowUp":t.stopPropagation(),t.preventDefault(),this.#o(-1);break}t.key==="Enter"&&(this.#t[this.cursor]&&this.#s(this.#t[this.cursor]),t.preventDefault())};#o(t){this.cursor=j(this.cursor+t,this.#t.length)}#s(t){this.dispatchEvent(new y(t))}connectedCallback(){super.connectedCallback(),this.dispatchEvent(new b([["keydown",this.#e]]))}willUpdate(t){t.has("options")&&(this.options=Object.freeze([...this.options].sort())),(t.has("expression")||t.has("options"))&&(this.cursor=0,this.#t=this.options.filter(o=>(this.suggestionFilter||N)(o,this.expression)))}render(){if(this.#t.length!==0)return g`<style>${p}</style><ul class="suggestions">
      ${this.#t.map((t,o)=>g`
        <li class=${$({selected:o===this.cursor})}
            @mousedown=${this.#s.bind(this,t)}
            jslog=${h.item("suggestion").track({click:!0,resize:!0})}>
          ${t}
        </li>`)}
    </ul>`}};s([r(C)],a.prototype,"options",void 0);s([r()],a.prototype,"expression",void 0);s([r()],a.prototype,"suggestionFilter",void 0);s([E()],a.prototype,"cursor",void 0);a=s([m("devtools-suggestion-box")],a);var i=class extends v{static shadowRootOptions={...v.shadowRootOptions,delegatesFocus:!0};constructor(){super(),this.options=[],this.expression="",this.placeholder="",this.value="",this.disabled=!1,this.strikethrough=!0,this.mimeType="",this.autocomplete=!0,this.addEventListener("blur",this.#o);let t=h.value().track({keydown:"ArrowUp|ArrowDown|Enter",change:!0,click:!0});this.jslogContext&&(t=t.context(this.jslogContext)),this.setAttribute("jslog",t.toString())}#t;get#e(){if(this.#t)return this.#t;let t=this.renderRoot.querySelector("devtools-editable-content");if(!t)throw new Error("Attempted to query node before rendering.");return this.#t=t,t}#o=()=>{window.getSelection()?.removeAllRanges(),this.value=this.#e.value,this.expression=this.#e.value};#s=t=>{w(t.target instanceof Node);let o=document.createRange();o.selectNodeContents(t.target);let n=window.getSelection();n.removeAllRanges(),n.addRange(o)};#i=t=>{t.key==="Enter"&&t.preventDefault()};#r=t=>{this.expression=t.target.value};#n=t=>{for(let[o,n]of t.listeners)this.addEventListener(o,n)};#l=t=>{this.#e.value=t.suggestion,setTimeout(this.blur.bind(this),0)};willUpdate(t){t.has("value")&&(this.expression=this.value)}render(){return g`<style>${p}</style>
      <style>${f}</style>
      <devtools-editable-content
        ?disabled=${this.disabled}
        class=${$({strikethrough:!this.strikethrough})}
        .enterKeyHint=${"done"}
        .value=${this.value}
        .mimeType=${this.mimeType}
        @focus=${this.#s}
        @input=${this.#r}
        @keydown=${this.#i}
        autocapitalize="off"
        inputmode="text"
        placeholder=${this.placeholder}
        spellcheck="false"
      ></devtools-editable-content>
      <devtools-suggestion-box
        @suggestioninit=${this.#n}
        @suggest=${this.#l}
        .options=${this.options}
        .suggestionFilter=${this.suggestionFilter}
        .expression=${this.autocomplete?this.expression:""}
      ></devtools-suggestion-box>`}};s([r(C)],i.prototype,"options",void 0);s([r({type:Boolean})],i.prototype,"autocomplete",void 0);s([r()],i.prototype,"suggestionFilter",void 0);s([E()],i.prototype,"expression",void 0);s([r()],i.prototype,"placeholder",void 0);s([r()],i.prototype,"value",void 0);s([r({type:Boolean})],i.prototype,"disabled",void 0);s([r({type:Boolean})],i.prototype,"strikethrough",void 0);s([r()],i.prototype,"mimeType",void 0);s([r()],i.prototype,"jslogContext",void 0);i=s([m("devtools-suggestion-input")],i);export{S as SuggestionInput};
//# sourceMappingURL=suggestion_input.js.map
