feat(MeiliSearch): add MeiliSearch component (#4707)

* refactor: 移除 meilisearch 资源

* chore: 增加全局搜索组件

* chore: 更新依赖包增加 MeiliSearchBox 组件

* style: 更新样式

Author: ArgoZhang

src/BootstrapBlazor.Server/BootstrapBlazor.Server.csproj

@@ -48,7 +48,7 @@
     <PackageReference Include="BootstrapBlazor.Markdown" Version="9.0.0" />
     <PackageReference Include="BootstrapBlazor.MaterialDesign" Version="9.0.0" />
     <PackageReference Include="BootstrapBlazor.MaterialDesign.Extensions" Version="9.0.0" />
-    <PackageReference Include="BootstrapBlazor.MeiliSearch" Version="9.0.0-beta*" />
+    <PackageReference Include="BootstrapBlazor.MeiliSearch" Version="9.0.1-beta01" />
     <PackageReference Include="BootstrapBlazor.Middleware" Version="9.0.0" />
     <PackageReference Include="BootstrapBlazor.MindMap" Version="9.0.0" />
     <PackageReference Include="BootstrapBlazor.MouseFollower" Version="9.0.0" />

src/BootstrapBlazor.Server/Components/Components/GlobalSearch.razor

@@ -1,47 +1,3 @@
-@inherits WebSiteModuleComponentBase
-@attribute [JSModuleAutoLoader("Components/GlobalSearch.razor.js")]
-@inject IStringLocalizer<GlobalSearch> Localizer
+@inject IStringLocalizer<GlobalSearch> Localizer
 
-<div id="@Id" class="bb-g-search">
-    <i class="fa-solid fa-search"></i>
-    <input type="text" readonly placeholder="@Localizer["SearchPlaceHolder"]" />
-    <div class="search-dialog-mask">
-    </div>
-    <div class="search-dialog shadow-lg">
-        <div class="search-dialog-input">
-            <i class="fa-solid fa-search"></i>
-            <input type="text" placeholder="@Localizer["SearchPlaceHolder"]" />
-            <i class="fa-solid fa-times search-dialog-clear"></i>
-        </div>
-        <div class="search-dialog-status">
-            @Localizer["SearchStatus"]
-        </div>
-        <div class="search-dialog-main">
-            <div class="search-dialog-list scroll">
-            </div>
-            <div class="search-dialog-menu scroll">
-            </div>
-        </div>
-        <template>
-            <div class="search-dialog-item-template">
-                <div class="search-dialog-item">
-                    <a href="{url}" target="_blank">
-                        <div class="search-dialog-item-title"><span>{title}</span><span class="badge text-bg-warning">{count}</span></div>
-                        <div class="search-dialog-item-sub">{sub-title}</div>
-                    </a>
-                </div>
-            </div>
-            <ul class="search-dialog-block-template">
-                <li>
-                    <a href="{url}" target="_blank">
-                        <div class="search-dialog-block-title"><span>{title}</span></div>
-                        <div class="search-dialog-block-intro">{intro}</div>
-                    </a>
-                </li>
-            </ul>
-            <div class="search-dialog-empty-template">
-                @Localizer["SearchResultPlaceHolder"]
-            </div>
-        </template>
-    </div>
-</div>
+<MeiliSearchBox SearchBoxPlaceHolder="@Localizer["SearchPlaceHolder"]" SearchStatus="@Localizer["SearchStatus"]" SearchResultPlaceHolder="@Localizer["SearchResultPlaceHolder"]"></MeiliSearchBox>