SharePoint Framework React Search Box client side web part

Why another Search Box?

At the current moment (04.17) the default modern Site Page Search Box cannot be configured at all. Velin Georgiev blog image The business need is: - Modern site page to be used as Home page. - The search box from the modern page should show specific search results i.e. custom search results scope should be configured.

Redirect from modern Site Page to classic search results page

This fulfill the business need, I created simple SPFx search box client side web part to redirect from modern Site Page to classic search results page url where more precise search result scopes configuration can be made. Velin Georgiev blog image The web part has custom property where the search results page url can be specified. If blank it will redirect to the tenant enterprise search site (https://<your_tenant> Velin Georgiev blog image

Position below the actions section on a modern site page

I have added another custom property so the web part can appear just below the actions pane for better user experience. This option is not recommended for production because uses page DOM manipulation and if the Office 365 team change this DOM elements on the page then it may break the webpart visibility. Velin Georgiev blog image

This is a temporary solution

Please note this SPFx web part can be used as temporary solution until the Office 365 team provide us with customizable search web part for the modern site pages. Available on Github