internal/components/search.templ


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

package components

templ Search(tdata TemplateData, r ResultData) {
	<form id="search" role="search">
		<fieldset>
			<legend id="legend">
				<h2>{ sourceNameAndType(tdata.Source) } search</h2>
			</legend>
			<input
				id="query"
				aria-labelledby="legend"
				name="query"
				type="search"
				value={ r.Query }
				autofocus
				spellcheck="false"
			/>
			<button>Search</button>
		</fieldset>
	</form>
}

templ SearchPage(tdata TemplateData, r ResultData) {
	@Page(tdata) {
		@script(tdata.Assets.Scripts["static/search.js"])
		@Search(tdata, r)
		<section id="results" role="list" aria-label="search results">
			{ children... }
		</section>
		<dialog id="dialog">
			<button autofocus>Close</button>
		</dialog>
	}
}