From 54afc5237a013eb2c7c0edef2d885075c826c388 Mon Sep 17 00:00:00 2001
From: Timo Tijhof <krinkle@fastmail.com>
Date: Thu, 22 Aug 2024 22:50:41 +0100
Subject: [PATCH] Fix `.tsmb-icon-close` to not rely on inline style attribute

This makes the web component compatible with a stict CSP setting,
without granting `style-src unsafe-inline`, and without hardcoding
a hash of the exact `display: none;` value.
---
 typesense-minibar.css | 4 ++--
 typesense-minibar.js  | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/typesense-minibar.css b/typesense-minibar.css
index df7740f..1064590 100644
--- a/typesense-minibar.css
+++ b/typesense-minibar.css
@@ -117,8 +117,8 @@ typesense-minibar form::before {
   cursor: pointer;
 }
 
-.tsmb-form--open .tsmb-icon-close {
-  display: block !important;
+form:not(.tsmb-form--open) .tsmb-icon-close {
+  display: none;
 }
 
 .tsmb-form--slash:not(.tsmb-form--open):not(:focus-within)::after {
diff --git a/typesense-minibar.js b/typesense-minibar.js
index 1c7a2bd..61957ca 100644
--- a/typesense-minibar.js
+++ b/typesense-minibar.js
@@ -74,7 +74,7 @@ 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" tabindex="-1" 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 = '';
     state.hits = [];