diff --git a/src/BootstrapBlazor.Server/Components/Layout/MainLayout.razor b/src/BootstrapBlazor.Server/Components/Layout/MainLayout.razor
index ef2ce092a08..3f631c316e7 100644
--- a/src/BootstrapBlazor.Server/Components/Layout/MainLayout.razor
+++ b/src/BootstrapBlazor.Server/Components/Layout/MainLayout.razor
@@ -10,7 +10,7 @@
-
+
diff --git a/src/BootstrapBlazor/Components/Layout/Layout.razor b/src/BootstrapBlazor/Components/Layout/Layout.razor
index a8fc664ee77..eacaaaa0b23 100644
--- a/src/BootstrapBlazor/Components/Layout/Layout.razor
+++ b/src/BootstrapBlazor/Components/Layout/Layout.razor
@@ -90,7 +90,7 @@
}
@if (ShowSplitBar)
{
-
+
}
@if (Menus != null)
{
diff --git a/src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor b/src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor
similarity index 54%
rename from src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor
rename to src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor
index 4c78c2966d6..76d7d7da92b 100644
--- a/src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor
+++ b/src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor
@@ -1,8 +1,8 @@
@namespace BootstrapBlazor.Components
@inherits BootstrapModuleComponentBase
-@attribute [BootstrapModuleAutoLoader("Layout/LayoutSidebar.razor.js")]
+@attribute [BootstrapModuleAutoLoader("Layout/LayoutSplitebar.razor.js")]
-
diff --git a/src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor.cs b/src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor.cs
similarity index 96%
rename from src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor.cs
rename to src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor.cs
index af5b4b49975..37977d348e3 100644
--- a/src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor.cs
+++ b/src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor.cs
@@ -8,7 +8,7 @@ namespace BootstrapBlazor.Components;
///
/// LayoutSidebar 组件
///
-public partial class LayoutSidebar
+public partial class LayoutSplitebar
{
///
/// 获得/设置 容器选择器 默认 null 未设置
diff --git a/src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor.js b/src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor.js
similarity index 84%
rename from src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor.js
rename to src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor.js
index a0c4b4a6c32..035061cec3d 100644
--- a/src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor.js
+++ b/src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor.js
@@ -1,5 +1,4 @@
import Drag from "../../modules/drag.js"
-import Data from "../../modules/data.js"
export function init(id) {
const el = document.getElementById(id);
@@ -9,9 +8,9 @@ export function init(id) {
const min = parseFloat(el.getAttribute("data-bb-min") ?? "0");
const max = parseFloat(el.getAttribute("data-bb-max") ?? "0");
- const selector = el.getAttribute("data-bb-selector");
+ const selector = el.getAttribute("data-bb-selector") ?? ".layout";
const section = document.querySelector(selector);
- const bar = el.querySelector(".layout-sidebar-body");
+ const bar = el.querySelector(".layout-splitebar-body");
let originX = 0;
let width = 0;
Drag.drag(bar,
@@ -37,7 +36,7 @@ export function init(id) {
export function dispose(id) {
const el = document.getElementById(id);
if (el) {
- const bar = el.querySelector(".layout-sidebar-body");
+ const bar = el.querySelector(".layout-splitebar-body");
if (bar) {
Drag.dispose(bar);
}
diff --git a/src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor.scss b/src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor.scss
similarity index 88%
rename from src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor.scss
rename to src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor.scss
index d340cfcbab2..35f2e1ea2de 100644
--- a/src/BootstrapBlazor/Components/Layout/LayoutSidebar.razor.scss
+++ b/src/BootstrapBlazor/Components/Layout/LayoutSplitebar.razor.scss
@@ -1,4 +1,4 @@
-.layout-sidebar {
+.layout-splitebar {
width: 1px;
position: absolute;
top: 0;
@@ -7,7 +7,7 @@
background-color: var(--bs-border-color);
display: none;
- .layout-sidebar-body {
+ .layout-splitebar-body {
position: absolute;
inset: 0px -2px;
cursor: col-resize;
@@ -26,7 +26,7 @@
}
@media(min-width: 768px) {
- .layout-sidebar {
+ .layout-splitebar {
display: block;
}
}
diff --git a/src/BootstrapBlazor/wwwroot/scss/components.scss b/src/BootstrapBlazor/wwwroot/scss/components.scss
index a5bc79b6a78..ffd1e88b3fa 100644
--- a/src/BootstrapBlazor/wwwroot/scss/components.scss
+++ b/src/BootstrapBlazor/wwwroot/scss/components.scss
@@ -57,7 +57,7 @@
@import "../../Components/Input/FloatingLabel.razor.scss";
@import "../../Components/IpAddress/IpAddress.razor.scss";
@import "../../Components/Layout/Layout.razor.scss";
-@import "../../Components/Layout/LayoutSidebar.razor.scss";
+@import "../../Components/Layout/LayoutSplitebar.razor.scss";
@import "../../Components/Light/Light.razor.scss";
@import "../../Components/ListGroup/ListGroup.razor.scss";
@import "../../Components/ListView/ListView.razor.scss";
diff --git a/test/UnitTest/Components/LayoutSplitebarTest.cs b/test/UnitTest/Components/LayoutSplitebarTest.cs
new file mode 100644
index 00000000000..fc7cc7c6fcc
--- /dev/null
+++ b/test/UnitTest/Components/LayoutSplitebarTest.cs
@@ -0,0 +1,27 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the Apache 2.0 License
+// See the LICENSE file in the project root for more information.
+// Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone
+
+namespace UnitTest.Components;
+
+public class LayoutSplitebarTest : BootstrapBlazorTestBase
+{
+ [Fact]
+ public void LayoutSplitebar_Ok()
+ {
+ var cut = Context.RenderComponent(pb =>
+ {
+ pb.Add(a => a.ContainerSelector, ".layout");
+ });
+ cut.Contains("data-bb-selector=\".layout\"");
+
+ cut.SetParametersAndRender(pb =>
+ {
+ pb.Add(a => a.Min, 100);
+ pb.Add(a => a.Max, 200);
+ });
+ cut.Contains("data-bb-min=\"100\"");
+ cut.Contains("data-bb-max=\"200\"");
+ }
+}
diff --git a/test/UnitTest/Components/LayoutTest.cs b/test/UnitTest/Components/LayoutTest.cs
index cd114b5fe41..71ed5141cf6 100644
--- a/test/UnitTest/Components/LayoutTest.cs
+++ b/test/UnitTest/Components/LayoutTest.cs
@@ -237,6 +237,23 @@ public void UseTabSet_Layout()
cut.WaitForAssertion(() => cut.Contains("Binder
"));
}
+ [Fact]
+ public void ShowLayouSidebar_Ok()
+ {
+ var cut = Context.RenderComponent(pb =>
+ {
+ pb.Add(a => a.UseTabSet, true);
+ pb.Add(a => a.AdditionalAssemblies, new Assembly[] { GetType().Assembly });
+ pb.Add(a => a.IsFullSide, true);
+ pb.Add(a => a.ShowSplitBar, true);
+ pb.Add(a => a.Side, new RenderFragment(builder =>
+ {
+ builder.AddContent(0, "test");
+ }));
+ });
+ cut.Contains("layout-splitebar");
+ }
+
[Fact]
public void UseTabSet_Menus()
{