All: Update typesense-minibar to 1.3.4 (CSP compliance)

Ref jquery/infrastructure-puppet#54.
Ref #463.

Author: Krinkle

composer.json

@@ -8,8 +8,8 @@
 	"scripts": {
 		"test": "parallel-lint --exclude vendor/ .",
 		"deps": [
-			"curl -O -q --output-dir themes/jquery/lib/typesense-minibar 'https://raw.githubusercontent.com/jquery/typesense-minibar/1.3.2/{typesense-minibar.css,typesense-minibar.js,LICENSE.txt}'",
-			"curl -q https://raw.githubusercontent.com/jquery/typesense-minibar/1.3.2/typesense-minibar-foot.css >> themes/jquery/lib/typesense-minibar/typesense-minibar.css",
+			"curl -O -q --output-dir themes/jquery/lib/typesense-minibar 'https://raw.githubusercontent.com/jquery/typesense-minibar/1.3.4/{typesense-minibar.css,typesense-minibar.js,LICENSE.txt}'",
+			"curl -q https://raw.githubusercontent.com/jquery/typesense-minibar/1.3.4/typesense-minibar-foot.css >> themes/jquery/lib/typesense-minibar/typesense-minibar.css",
 			"curl -O -q --output-dir plugins/memcached 'https://raw.githubusercontent.com/Automattic/wp-memcached/35e1ea16f6b8cb8a1e6fbca124e33a44db21fa74/{object-cache.php,readme.txt,LICENSE}'"
 		]
 	}

themes/jquery/header.php

@@ -18,7 +18,7 @@
 	<meta name="viewport" content="width=device-width">
 
 	<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/i/favicon.ico">
-	<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/lib/typesense-minibar/typesense-minibar.css?v=1.3.2">
+	<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/lib/typesense-minibar/typesense-minibar.css?v=1.3.4">
 	<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/base.css?v=17">
 	<link rel="stylesheet" href="<?php bloginfo( 'stylesheet_url' ); ?>?v=8">
 
@@ -27,7 +27,7 @@
 <?php
 	if ( jq_search_get_provider() === 'typesense' ) :
 ?>
-	<script defer type="module" src="<?php echo get_template_directory_uri(); ?>/lib/typesense-minibar/typesense-minibar.js?v=1.3.2"></script>
+	<script defer type="module" src="<?php echo get_template_directory_uri(); ?>/lib/typesense-minibar/typesense-minibar.js?v=1.3.4"></script>
 <?php
 	endif;
 

themes/jquery/lib/typesense-minibar/typesense-minibar.css

@@ -1,4 +1,4 @@
-/*! https://github.com/jquery/typesense-minibar 1.3.2 */
+/*! https://github.com/jquery/typesense-minibar 1.3.4 */
 .tsmb-form,
 typesense-minibar {
   --tsmb-size-edge: 1px;
@@ -24,6 +24,8 @@ typesense-minibar {
   --tsmb-color-primary30: #390f39;
   --tsmb-color-primary50: #9c3493;
   --tsmb-color-primary90: #fbdbfb;
+
+  max-width: 100%;
 }
 
 .tsmb-form,
@@ -88,7 +90,7 @@ typesense-minibar form::before {
   content: '';
   background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='654 -372 1664 1664' width='20' height='20'><path d='M1806,332c0-123.3-43.8-228.8-131.5-316.5C1586.8-72.2,1481.3-116,1358-116s-228.8,43.8-316.5,131.5 C953.8,103.2,910,208.7,910,332s43.8,228.8,131.5,316.5C1129.2,736.2,1234.7,780,1358,780s228.8-43.8,316.5-131.5 C1762.2,560.8,1806,455.3,1806,332z M2318,1164c0,34.7-12.7,64.7-38,90s-55.3,38-90,38c-36,0-66-12.7-90-38l-343-342 c-119.3,82.7-252.3,124-399,124c-95.3,0-186.5-18.5-273.5-55.5s-162-87-225-150s-113-138-150-225S654,427.3,654,332 s18.5-186.5,55.5-273.5s87-162,150-225s138-113,225-150S1262.7-372,1358-372s186.5,18.5,273.5,55.5s162,87,225,150s113,138,150,225 S2062,236.7,2062,332c0,146.7-41.3,279.7-124,399l343,343C2305.7,1098.7,2318,1128.7,2318,1164z'/></svg>") 0 50% / contain no-repeat;
   position: absolute;
-  top: calc(var(--tsmb-size-sm) + var(--tsmb-size-edge));
+  top: calc(var(--tsmb-size-edge) + var(--tsmb-size-sm));
   left: var(--tsmb-size-sm);
   width: var(--tsmb-size-base);
   height: var(--tsmb-size-input);
@@ -104,7 +106,7 @@ typesense-minibar form::before {
 .tsmb-icon-close {
   box-sizing: border-box;
   position: absolute;
-  top: calc(50% - var(--tsmb-size-base)/2);
+  top: calc(var(--tsmb-size-edge) + var(--tsmb-size-sm) + (var(--tsmb-size-input)/2) - (var(--tsmb-size-base)/2));
   right: var(--tsmb-size-base);
   width: var(--tsmb-size-base);
   height: var(--tsmb-size-base);
@@ -115,11 +117,7 @@ typesense-minibar form::before {
   cursor: pointer;
 }
 
-.tsmb-form--open .tsmb-icon-close {
-  display: block !important;
-}
-
-.tsmb-form--slash::after {
+form:not(.tsmb-form--open) .tsmb-icon-close {
   display: none;
 }
 
@@ -245,7 +243,7 @@ typesense-minibar[data-group=true] .tsmb-suggestion_title {
   content: ' Typesense';
   color: #0300b0;
 }
-/*! https://github.com/jquery/typesense-minibar 1.3.2 */
+/*! https://github.com/jquery/typesense-minibar 1.3.4 */
 .tsmb-foot::after {
   content: "";
   display: inline-block;

themes/jquery/lib/typesense-minibar/typesense-minibar.js

@@ -1,4 +1,4 @@
-/*! https://github.com/jquery/typesense-minibar 1.3.2 */
+/*! https://github.com/jquery/typesense-minibar 1.3.4 */
 globalThis.tsminibar = function tsminibar (form, dataset = form.dataset) {
   const cache = new Map();
   const state = { query: '', cursor: -1, open: false, hits: [] };
@@ -41,7 +41,6 @@ globalThis.tsminibar = function tsminibar (form, dataset = form.dataset) {
     const query = state.query = input.value;
     if (!query) {
       state.hits = [];
-      state.cursor = -1;
       return close();
     }
     const hits = await search(query);
@@ -62,7 +61,10 @@ globalThis.tsminibar = function tsminibar (form, dataset = form.dataset) {
     if (!e.altKey && !e.ctrlKey && !e.metaKey && !e.shiftKey) {
       if (e.code === 'ArrowDown') moveCursor(1);
       if (e.code === 'ArrowUp') moveCursor(-1);
-      if (e.code === 'Escape') close();
+      if (e.code === 'Escape') {
+        close();
+        input.blur();
+      }
       if (e.code === 'Enter') {
         const url = state.hits[state.cursor]?.url;
         if (url) location.href = url;
@@ -72,11 +74,12 @@ globalThis.tsminibar = function tsminibar (form, dataset = form.dataset) {
   form.addEventListener('submit', function (e) {
     e.preventDefault();
   });
-  form.insertAdjacentHTML('beforeend', '<svg viewBox="0 0 12 12" width="20" height="20" aria-hidden="true" class="tsmb-icon-close" style="display: none;"><path d="M9 3L3 9M3 3L9 9"/></svg>');
+  form.insertAdjacentHTML('beforeend', '<svg viewBox="0 0 12 12" width="20" height="20" aria-hidden="true" tabindex="-1" class="tsmb-icon-close"><path d="M9 3L3 9M3 3L9 9"/></svg>');
   form.querySelector('.tsmb-icon-close').addEventListener('click', function () {
     input.value = '';
-    input.focus();
+    state.hits = [];
     close();
+    input.focus();
   });
   connect();
 
@@ -117,7 +120,7 @@ globalThis.tsminibar = function tsminibar (form, dataset = form.dataset) {
     let hits = cache.get(query);
     if (hits) {
       cache.delete(query);
-      cache.set(query, hits); // LRU
+      cache.set(query, hits);
       return hits;
     }
     searchParams.set('q', query);