import{QuestionElement as e}from"./QuestionElement.js";import{html as s}from"../../../lit/index.js";class ShortAnswerQuestion extends e{static get tag(){return"short-answer-question"}constructor(){super(),this.guessDataValue="shortanswer",this.shortanswer=null,this.singleOption=!0}static get haxProperties(){return new URL(`./${this.tag}.haxProperties.json`,import.meta.url).href}static get properties(){return{...super.properties,shortanswer:{type:String}}}inactiveCase(){return this.shortanswer}renderDirections(){return s`<p>
      Type the answer you feel answers the question. When you are done, select
      <strong>${this.t.checkAnswer}</strong>. You will get feedback indicating
      correctness of your answer.
    </p>`}renderInteraction(){return s`
      <simple-fields-field
        type="textfield"
        ?disabled="${this.disabled||this.showAnswer}"
        class="tag-option ${this.showAnswer?this.isCorrect()?"correct":"incorrect":""}"
        property="oer:answer"
        name="0"
        @keydown="${e=>{"Enter"===e.key&&this.checkAnswer(e)}}"
        @value-changed="${this.valueUpdate}"
        .value="${this.shortanswer}"
        aria-label="Your answer"
        placeholder="Type your answer here.."
      ></simple-fields-field>
    `}resetAnswer(e){this.isCorrect()&&(this.shortanswer=null),super.resetAnswer(e),setTimeout((()=>{this.shadowRoot.querySelector('simple-fields-field[name="0"]').focus(),this.shadowRoot.querySelector('simple-fields-field[name="0"]').select()}),0)}valueUpdate(e){this.shortanswer=e.detail.value}isCorrect(){for(var e in this.displayedAnswers)if(this.displayedAnswers[e].label.toLowerCase()==this.shortanswer.toLowerCase())return!0;return!1}}globalThis.customElements.define(ShortAnswerQuestion.tag,ShortAnswerQuestion);export{ShortAnswerQuestion};