<script>
	import { debounce } from './util.mjs';

	const base = 'nuVistA';
	const state = [{ value: base }];
	const settitle = debounce(s => document.title = s || base, 0);

	export default {
		props: ['value'],
		data() {
			return { ptr: null };
		},
		watch: {
			value: {
				handler(value) {
					this.update(value);
				}, immediate: true
			}
		},
		methods: {
			update(value) {
				if(value) {
					if(this.ptr) this.ptr.value = value;
					else {
						this.ptr = { value };
						state.unshift(this.ptr);
					}
				} else if(this.ptr) {
					var idx = state.indexOf(this.ptr);
					if(idx >= 0) state.splice(idx, 1);
					this.ptr = null;
				}
				settitle(state.map(x => x.value).join(' - '));
			}
		},
		unmounted() {
			this.update();
		},
		render() {}
	};
</script>
