Changes for page CLB Search Component

Summary

• Page properties (1 modified, 0 added, 0 removed)

Details

Page properties

Content

...	...	@@ -48,10 +48,12 @@
48	48	connectedCallback() {
49	49	super.connectedCallback();
50	50	this.render();
	51	+ const searchInput = this.$('input[type="text"]');
51	51	this.$('#search').addEventListener('click', this.handleSearch);
52	52	this.$('#prev').addEventListener('click', this.handlePrevPage);
53	53	this.$('#next').addEventListener('click', this.handleNextPage);
54		- this.$('input[type="text"]').focus();
	55	+ searchInput.addEventListener('keypress', this.handleKeyPress);
	56	+ searchInput.focus();
55	55	}
56	56
57	57	disconnectedCallback() {
...	...	@@ -58,6 +58,7 @@
58	58	this.$('#search').removeEventListener('click', this.handleSearch);
59	59	this.$('#prev').removeEventListener('click', this.handlePrevPage);
60	60	this.$('#next').removeEventListener('click', this.handleNextPage);
	63	+ this.$('input[type="text"]').addEventListener('keypress', this.handleKeyPress);
61	61	}
62	62
63	63	get styles() {
...	...	@@ -85,6 +85,11 @@
85	85	.then(this.renderResults);
86	86	}
87	87
	91	+ handleKeyPress = (e) => {
	92	+ if(e.code === 'Enter') {
	93	+ this.handleSearch();
	94	+ }
	95	+ }
88	88
89	89	get html() {
90	90	return `
...	...	@@ -104,7 +104,7 @@
104	104	const { title_, spaces, doccontent_en } = results[i];
105	105	const elt = document.createElement('clb-search-result');
106	106	elt.setAttribute('data-title', title_);
107		- elt.setAttribute('data-href', spaces.join('/'));
	115	+ elt.setAttribute('data-breadcrumbs', spaces);
108	108	elt.innerHTML = doccontent_en;
109	109	resultsContainer.appendChild(elt);
110	110	}
...	...	@@ -126,8 +126,8 @@
126	126	return this.getAttribute('data-title');
127	127	}
128	128
129		- get hrefAttr() {
130		- return this.getAttribute('data-href');
	137	+ get breadcrumbsAttr() {
	138	+ return this.getAttribute('data-breadcrumbs');
131	131	}
132	132
133	133	get styles() {
...	...	@@ -140,7 +140,7 @@
140	140	get html() {
141	141	return `
142	142	<div>
143		- <a href=${this.hrefAttr}>${this.titleAttr}</a>
	151	+ <a href="/bin/view/${this.breadcrumbsAttr.join("/")}>${this.titleAttr}</a>
144	144	<div>
145	145	<slot></slot>
146	146	</div>