{"size": 854, "ext": "js", "max_stars_repo_path": "ItemEntry.vue.js", "max_stars_repo_name": "telic/set-app", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "ItemEntry.vue.js", "max_issues_repo_name": "telic/set-app", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "ItemEntry.vue.js", "max_forks_repo_name": "telic/set-app", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 16.7450980392, "max_line_length": 45, "alphanum_fraction": 0.5362997658}
export default {
	data() {
		return { str: '' }
	},
	computed: {
		nonEmpty() {
			return /\S/.test(this.str)
		},
	},
	methods: {
		handleEnter() {
			const norm = this.str.trim().normalize()
			if (/\S/.test(norm)) {
				this.$emit('add', norm)
			}
			this.str = ''
			this.$emit('search', null)
		},
		handleInput() {
			this.$emit(
				'search',
				this.str.trim().toLowerCase().normalize()
			)
		},
	},
	template: `
		<div class="field has-addons">
			<div class="control is-expanded">
				<input
					ref="input"
					v-model="str"
					class="input"
					autofocus
					@keypress.enter.prevent="handleEnter"
					@input="handleInput"
				>
			</div>
			<div class="control">
				<button
					type="button"
					class="button is-primary"
					:disabled="!nonEmpty"
					@click="handleEnter"
				>
					Add
				</button>
			</div>
		</div>
	`,
}
