From ab59a08425be1b67fa763afdd1e69069e5b488ba Mon Sep 17 00:00:00 2001 From: Timo Tijhof Date: Thu, 1 Aug 2024 23:48:05 +0100 Subject: [PATCH] Build: Update typesense-minibar to 1.3.2 Ref https://github.com/jquery/typesense-minibar --- Makefile | 2 +- _includes/search.html | 4 ++-- _sass/typesense-minibar.css | 9 +++++---- assets/typesense-minibar.js | 26 ++++++++++++-------------- 4 files changed, 20 insertions(+), 21 deletions(-) diff --git a/Makefile b/Makefile index b7f5e01..3d26b58 100644 --- a/Makefile +++ b/Makefile @@ -1,4 +1,4 @@ -MINIBAR_VERSION=1.3.1 +MINIBAR_VERSION=1.3.2 .PHONY: deps diff --git a/_includes/search.html b/_includes/search.html index 22feadd..0c7b1d4 100644 --- a/_includes/search.html +++ b/_includes/search.html @@ -1,5 +1,5 @@ - -
+ + diff --git a/_sass/typesense-minibar.css b/_sass/typesense-minibar.css index 21cc639..52ec1c0 100644 --- a/_sass/typesense-minibar.css +++ b/_sass/typesense-minibar.css @@ -1,4 +1,4 @@ -/*! https://github.com/jquery/typesense-minibar 1.3.1 */ +/*! https://github.com/jquery/typesense-minibar 1.3.2 */ .tsmb-form, typesense-minibar { --tsmb-size-edge: 1px; @@ -173,12 +173,12 @@ typesense-minibar [role=option] a { } .tsmb-form:not([data-group=true]) [role=option]:not(:first-child) a, -typesense-minibar form:not([data-group=true]) [role=option]:not(:first-child) a { +typesense-minibar:not([data-group=true]) [role=option]:not(:first-child) a { border-top: var(--tsmb-size-edge) solid var(--tsmb-color-focus90); } .tsmb-form[data-group=true] [role=option] a, -typesense-minibar form[data-group=true] [role=option] a { +typesense-minibar[data-group=true] [role=option] a { margin: 0 var(--tsmb-size-base); padding: var(--tsmb-size-sm); } @@ -210,7 +210,8 @@ typesense-minibar [role=option] mark { .tsmb-suggestion_title { color: var(--tsmb-color-primary30); } -.tsmb-form[data-group=true] .tsmb-suggestion_title { +.tsmb-form[data-group=true] .tsmb-suggestion_title, +typesense-minibar[data-group=true] .tsmb-suggestion_title { font-weight: bold; font-size: var(--tsmb-size-sm); } diff --git a/assets/typesense-minibar.js b/assets/typesense-minibar.js index 329771a..535e48d 100644 --- a/assets/typesense-minibar.js +++ b/assets/typesense-minibar.js @@ -1,7 +1,5 @@ -/*! https://github.com/jquery/typesense-minibar 1.3.1 */ -globalThis.tsminibar = function tsminibar (form) { - const { origin, collection } = form.dataset; - const group = !!form.dataset.group; +/*! https://github.com/jquery/typesense-minibar 1.3.2 */ +globalThis.tsminibar = function tsminibar (form, dataset = form.dataset) { const cache = new Map(); const state = { query: '', cursor: -1, open: false, hits: [] }; const searchParams = new URLSearchParams({ @@ -14,10 +12,10 @@ globalThis.tsminibar = function tsminibar (form) { sort_by: 'item_priority:desc', snippet_threshold: '8', highlight_affix_num_tokens: '12', - 'x-typesense-api-key': form.dataset.key, - ...Object.fromEntries(new URLSearchParams(form.dataset.searchParams)) + 'x-typesense-api-key': dataset.key, + ...Object.fromEntries(new URLSearchParams(dataset.searchParams)) }); - const noResults = form.dataset.noResults || "No results for '{}'."; + const noResults = dataset.noResults || "No results for '{}'."; const input = form.querySelector('input[type=search]'); const listbox = document.createElement('div'); @@ -31,7 +29,7 @@ globalThis.tsminibar = function tsminibar (form) { preconnect = document.createElement('link'); preconnect.rel = 'preconnect'; preconnect.crossOrigin = 'anonymous'; // match fetch cors,credentials:omit - preconnect.href = origin; + preconnect.href = dataset.origin; document.head.append(preconnect); } if (!state.open && state.hits.length) { @@ -92,7 +90,7 @@ globalThis.tsminibar = function tsminibar (form) { function connect () { document.addEventListener('click', onDocClick); - if (form.dataset.slash !== 'false') { + if (dataset.slash !== 'false') { document.addEventListener('keydown', onDocSlash); form.classList.add('tsmb-form--slash'); } @@ -124,9 +122,10 @@ globalThis.tsminibar = function tsminibar (form) { } searchParams.set('q', query); const resp = await fetch( - `${origin}/collections/${collection}/documents/search?` + searchParams, + `${dataset.origin}/collections/${dataset.collection}/documents/search?` + searchParams, { mode: 'cors', credentials: 'omit', method: 'GET' } ); + const group = !!dataset.group; const data = await resp.json(); hits = data?.grouped_hits?.map(ghit => { const hit = ghit.hits[0]; @@ -151,12 +150,11 @@ globalThis.tsminibar = function tsminibar (form) { function render () { listbox.hidden = !state.open; form.classList.toggle('tsmb-form--open', state.open); - listbox.innerHTML = (state.hits.map((hit, i) => `
${hit.lvl0 ? `
${hit.lvl0}
` : ''}
${hit.title}
${hit.content}
`).join('') || `
${noResults.replace('{}', escape(state.query))}
`) + (form.dataset.foot ? '' : ''); + listbox.innerHTML = (state.hits.map((hit, i) => `
${hit.lvl0 ? `
${hit.lvl0}
` : ''}
${hit.title}
${hit.content}
`).join('') || `
${noResults.replace('{}', escape(state.query))}
`) + (dataset.foot ? '' : ''); } function moveCursor (offset) { state.cursor += offset; - // -1 refers to input field if (state.cursor >= state.hits.length) state.cursor = -1; if (state.cursor < -1) state.cursor = state.hits.length - 1; render(); @@ -164,10 +162,10 @@ globalThis.tsminibar = function tsminibar (form) { return { form, connect, disconnect }; }; -document.querySelectorAll('.tsmb-form[data-origin]').forEach(tsminibar); window.customElements.define('typesense-minibar', class extends HTMLElement { connectedCallback () { const form = this.querySelector('form'); - if (form) tsminibar(form); + if (form && this.dataset.origin) tsminibar(form, this.dataset); } }); +document.querySelectorAll('.tsmb-form[data-origin]').forEach(form => tsminibar(form));