Possible to use Search component on custom page?

[rsimon]

I was wondering whether it's possible to use the search component on a custom page? In my case, I have a custom splash page which doesn't use the StarlightPage base component (because I want to get rid of the default header and hero section design). But I'd still like to include the site search if possible.

[delucis]

That’s not currently supported very easily because the search component relies on some values it expects to receive as props that it’s probably a bit tricky to recreate manually. We’re hoping to refactor some stuff to move those to Astro.locals instead of Astro.props which I think would unblock use cases like this.

If you’re really keen, you could try importing @astrojs/starlight/components/Search.astro and play until it is receiving all the required props, but it might not be the most fun experience 😁

[rsimon]

Thanks! I tried & it actually looks quite ok. I'll definitely give it a try :-)

(Actually, when I first tried, I think the one thing I got stuck with was actually that I was missing the base CSS styles that the Page component imports. I wasn't able to pull those from the starlight package directly, but had to copy them over into my own project. After that, the Search component seemed to work, by and large.)