Update the default search icon

[zoltanszogyenyi]

Describe the problem

It would be great if we could set our own SVG icon instead of the default one.

Describe the solution

Add an option when initialising the component by passing the SVG source of the icon.

Alternatives you've considered

I guess you could do some hacks via CSS but they should be discouraged.

[zoltanszogyenyi]

Here's a workaround if anyone has the same issue:

.DocSearch-Search-Icon {
	@apply w-4 h-4 md:w-3 md:h-3 md:mr-1 text-transparent !important;
         background-image: url('data:image/svg+xml,<svg class="w-4 h-4 md:w-3 md:h-3 text-gray-500 dark:text-gray-400" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z"/></svg>');
}

Basically I hide the inner SVG paths and instead apply our own icon via the background property.

If you're curious, I've used the search icon from Flowbite Icons.