<commit_before><template>
  <div :class="{
      'input--focused': focused,
      'input--empty': isEmpty,
      'input--filled': !isEmpty,
      'bz-has-error': hasError
    }">
    <btrz-label :id="id" :label="label" :aria-label="ariaLabel"></btrz-label>
    <div class="input-group">
      <span v-if="prefix" class="input-group-addon">{{prefix}}</span>
      <input class="form-control"
      :class="{'text-right': textAlign==='right', 'text-center': textAlign==='center'}"
      ref="input"
      :id="id"
      :disabled="disabled"
      :name="name"
      :type="type"
      :value="value"
      :placeholder="placeholder"
      :label="label"
      :min="min"
      :max="max"
      :maxlength="maxlength"
      :autocomplete="autocomplete"
      @input="valueUpdated($event.target.value);"
      @blur="focusUpdated('blur', $event.target.value);"
      @focus="focusUpdated('focus', $event.target.value);"/>
      <span v-if="postfix" class="input-group-addon">{{postfix}}</span>
    </div>
    <btrz-help-text v-if="helptext && !errors" :text="helptext"></btrz-help-text>
    <btrz-errors :errors="errors"></btrz-errors>
  </div>
</template>

<script>
  import BtrzLabel from "../../btrz-vue-components/src/btrz-label";
  import BtrzErrors from "../../btrz-vue-components/src/btrz-errors";
  import BtrzHelpText from "../../btrz-vue-components/src/btrz-help-text";
  export default {
    name: "BtrzInput",
    token: "<btrz-input class=\"form-group\" id=\"myId\" name=\"nameName\" value=\"myValue\" label=\"myLabel\"></btrz-input>",
    description: "This is a very basic but versatil input.",
    components:{
      BtrzLabel,
      BtrzErrors,
      BtrzHelpText
    },
    props: {
      placeholder: {
        type: String,
        note: "A placeholder to show when the input is empty."
      },
      type: {
        type: String,
        default: 'text',
        note: "The HTML input type. (text, number, email, etc)"
      },
      name: {
        type: String,
        note: "The name the input will have."
      },
      value: {
        type: String,
        note: "Starting value for the component."
      },
      id: {
        type: String,
        note: "Id for the component, is used for the label 'for' attr."
      },
      label: {
        type: String,
        note: "A label to be appended after the input."
      },
      ariaLabel: {
        type: String
      },       
      errors: {
        type: Array,
        note: "List of errors to display."
      },<commit_msg>#152800. Make all reservations screens accessible for readers.<commit_after><template>
  <div :class="{
      'input--focused': focused,
      'input--empty': isEmpty,
      'input--filled': !isEmpty,
      'bz-has-error': hasError
    }" :aria-describedby="ariaDescribedby">
    <btrz-label :id="id" :label="label" :aria-label="ariaLabel"></btrz-label>
    <div class="input-group">
      <span v-if="prefix" class="input-group-addon">{{prefix}}</span>
      <input class="form-control"
      :class="{'text-right': textAlign==='right', 'text-center': textAlign==='center'}"
      ref="input"
      :id="id"
      :disabled="disabled"
      :name="name"
      :type="type"
      :value="value"
      :placeholder="placeholder"
      :label="label"
      :aria-describedby="ariaDescribedby"      
      :min="min"
      :max="max"
      :maxlength="maxlength"
      :autocomplete="autocomplete"
      @input="valueUpdated($event.target.value);"
      @blur="focusUpdated('blur', $event.target.value);"
      @focus="focusUpdated('focus', $event.target.value);"/>
      <span v-if="postfix" class="input-group-addon">{{postfix}}</span>
    </div>
    <btrz-help-text v-if="helptext && !errors" :text="helptext"></btrz-help-text>
    <btrz-errors :errors="errors"></btrz-errors>
  </div>
</template>

<script>
  import BtrzLabel from "../../btrz-vue-components/src/btrz-label";
  import BtrzErrors from "../../btrz-vue-components/src/btrz-errors";
  import BtrzHelpText from "../../btrz-vue-components/src/btrz-help-text";
  export default {
    name: "BtrzInput",
    token: "<btrz-input class=\"form-group\" id=\"myId\" name=\"nameName\" value=\"myValue\" label=\"myLabel\"></btrz-input>",
    description: "This is a very basic but versatil input.",
    components:{
      BtrzLabel,
      BtrzErrors,
      BtrzHelpText
    },
    props: {
      placeholder: {
        type: String,
        note: "A placeholder to show when the input is empty."
      },
      type: {
        type: String,
        default: 'text',
        note: "The HTML input type. (text, number, email, etc)"
      },
      name: {
        type: String,
        note: "The name the input will have."
      },
      value: {
        type: String,
        note: "Starting value for the component."
      },
      id: {
        type: String,
        note: "Id for the component, is used for the label 'for' attr."
      },
      label: {
        type: String,
        note: "A label to be appended after the input."
      },
      ariaLabel: {
        type: String
      },
      ariaDescribedby: {
        type: String
      }, 
      errors: {
        type: Array,
        note: "List of errors to display."
      },
{'fraction_non_alphanumeric': 0.1732768579129765, 'fraction_numerical': 0.0011551790527531767, 'mean_word_length': 2.3843648208469057, 'pattern_counts': {'":': 0, '<': 43, '<?xml version=': 0, '>': 43, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '306824', 'n_tokens_mistral': 1697, 'n_tokens_neox': 1675, 'n_words': 368}