doc(Chart): revert Stack parameter

src/BootstrapBlazor.Server/BootstrapBlazor.Server.csproj

@@ -35,7 +35,7 @@
     <PackageReference Include="BootstrapBlazor.Bluetooth" Version="8.0.2" />
     <PackageReference Include="BootstrapBlazor.BootstrapIcon" Version="8.0.3" />
     <PackageReference Include="BootstrapBlazor.BootstrapIcon.Extensions" Version="8.0.6" />
-    <PackageReference Include="BootstrapBlazor.Chart" Version="8.1.8" />
+    <PackageReference Include="BootstrapBlazor.Chart" Version="8.1.9" />
     <PackageReference Include="BootstrapBlazor.CherryMarkdown" Version="8.0.0" />
     <PackageReference Include="BootstrapBlazor.CodeEditor" Version="8.0.2" />
     <PackageReference Include="BootstrapBlazor.Dock" Version="8.1.7" />
@@ -60,7 +60,7 @@
     <PackageReference Include="BootstrapBlazor.OnScreenKeyboard" Version="8.0.3" />
     <PackageReference Include="BootstrapBlazor.PdfReader" Version="8.0.4" />
     <PackageReference Include="BootstrapBlazor.SignaturePad" Version="8.0.2" />
-    <PackageReference Include="BootstrapBlazor.Sortable" Version="8.0.3" />
+    <PackageReference Include="BootstrapBlazor.Sortable" Version="8.0.4" />
     <PackageReference Include="BootstrapBlazor.Splitting" Version="8.0.0" />
     <PackageReference Include="BootstrapBlazor.SvgEditor" Version="8.1.0" />
     <PackageReference Include="BootstrapBlazor.SummerNote" Version="8.0.3" />

src/BootstrapBlazor.Server/Components/Components/FooSortableListItem.razor.css

@@ -23,3 +23,8 @@
     background-color: #44a0ff;
     color: #fff;
 }
+
+.col-12.sortable-swap-highlight .sl-item {
+    background-color: var(--bs-success);
+    color: var(--bs-body-bg);
+}

src/BootstrapBlazor.Server/Components/Samples/SortableLists.razor

@@ -23,6 +23,11 @@
 .sortable-ghost {
     background-color: var(--bs-info);
     color: var(--bs-body-bg);
+}
+
+.sortable-swap-highlight {
+    background-color: var(--bs-success);
+    color: var(--bs-body-bg);
 }</Pre>
 
 <DemoBlock Title="@Localizer["SortableListNormalTitle"]"
@@ -194,7 +199,7 @@
 
 <DemoBlock Title="@Localizer["SortableListMultiTitle"]"
            Introduction="@Localizer["SortableListMultiIntro"]"
-           Name="Table">
+           Name="MultiDrag">
     <div class="row g-2">
         <div class="col-12 col-sm-6">
             <SortableList Option="_optionMulti" OnUpdate="OnUpdateMultiDrag">
@@ -208,3 +213,20 @@
         </div>
     </div>
 </DemoBlock>
+
+<DemoBlock Title="@Localizer["SortableListSwapTitle"]"
+           Introduction="@Localizer["SortableListSwapIntro"]"
+           Name="Swap">
+    <div class="row g-2">
+        <div class="col-12 col-sm-6">
+            <SortableList Option="_optionSwap" OnUpdate="OnUpdateSwap">
+                <div class="sl-list row g-2">
+                    @foreach (var item in ItemsSwaps)
+                    {
+                        <FooSortableListItem @key="item" Value="item"></FooSortableListItem>
+                    }
+                </div>
+            </SortableList>
+        </div>
+    </div>
+</DemoBlock>

src/BootstrapBlazor.Server/Components/Samples/SortableLists.razor.cs

@@ -17,6 +17,9 @@ public partial class SortableLists
     [NotNull]
     private List<Foo>? ItemsMultiDrags { get; set; }
 
+    [NotNull]
+    private List<Foo>? ItemsSwaps { get; set; }
+
     private readonly SortableOption _option1 = new()
     {
         RootSelector = ".sl-list"
@@ -80,6 +83,12 @@ public partial class SortableLists
         MultiDrag = true
     };
 
+    private readonly SortableOption _optionSwap = new()
+    {
+        RootSelector = ".sl-list",
+        Swap = true
+    };
+
     /// <summary>
     /// OnInitialized
     /// </summary>
@@ -93,6 +102,7 @@ protected override void OnInitialized()
         Items1 = Foo.GenerateFoo(FooLocalizer, 4);
         Items2 = Foo.GenerateFoo(FooLocalizer, 8).Skip(4).ToList();
         ItemsMultiDrags = Foo.GenerateFoo(FooLocalizer, 8);
+        ItemsSwaps = Foo.GenerateFoo(FooLocalizer, 8);
     }
 
     private Task OnUpdate(SortableEvent @event)
@@ -171,4 +181,14 @@ private Task OnUpdateMultiDrag(SortableEvent @event)
         }
         return Task.CompletedTask;
     }
+
+    private Task OnUpdateSwap(SortableEvent @event)
+    {
+        var oldIndex = @event.OldIndex;
+        var newIndex = @event.NewIndex;
+        var item = ItemsSwaps[oldIndex];
+        ItemsSwaps.RemoveAt(oldIndex);
+        ItemsSwaps.Insert(newIndex, item);
+        return Task.CompletedTask;
+    }
 }

src/BootstrapBlazor.Server/Locales/en-US.json

@@ -6685,6 +6685,9 @@
     "SortableListTableIntro": "By setting the <code>SortableListOption</code> parameter <code>RootSelector</code> to specify the drag root element as <code>tbody</code>, you can drag rows.",
     "SortableListClassTitle": "Because <code>SortableList</code> is a container component, its contents are all custom components and cannot be styled. You need to set the style yourself according to the actual situation.",
     "SortableListClassLi1": "Chosen item style <code>sortable-chosen</code>",
-    "SortableListClassLi2": "The default style of drag element clones is <code>sortable-ghost</code> and can be customized through <code>GhostClass</code>"
+    "SortableListClassLi2": "The default style of drag element clones is <code>sortable-ghost</code> and can be customized through <code>GhostClass</code>",
+    "SortableListClassLi3": "Drag elements to swap items. Default style <code>sortable-swap-highlight</code> can be customized by <code>SwapClass</code>",
+    "SortableListSwapTitle": "Swap",
+    "SortableListSwapIntro": "By setting the <code>Swap</code> parameter of <code>SortableListOption</code>, the drag item and the target item are swapped."
   }
 }

src/BootstrapBlazor.Server/Locales/zh-CN.json

@@ -6686,6 +6686,9 @@
     "SortableListTableIntro": "通过设置 <code>SortableListOption</code> 参数 <code>RootSelector</code> 指定拖拽根元素为 <code>tbody</code> 即可对行进行拖拽操作",
     "SortableListClassTitle": "由于 <code>SortableList</code>为容器组件，内容均为自定义组件，无法内置样式，需要根据实际情况自行设置样式",
     "SortableListClassLi1": "拖动元素样式 <code>sortable-chosen</code>",
-    "SortableListClassLi2": "拖动元素克隆项默认样式 <code>sortable-ghost</code> 可通过 <code>GhostClass</code> 自定义"
+    "SortableListClassLi2": "拖动元素克隆项默认样式 <code>sortable-ghost</code> 可通过 <code>GhostClass</code> 自定义",
+    "SortableListClassLi3": "拖动元素交换想项默认样式 <code>sortable-swap-highlight</code> 可通过 <code>SwapClass</code> 自定义",
+    "SortableListSwapTitle": "交换",
+    "SortableListSwapIntro": "通过设置 <code>SortableListOption</code> 参数 <code>Swap</code> 设置拖拽项与目标项目交换"
   }
 }

src/Extensions/Components/BootstrapBlazor.Chart/BootstrapBlazor.Chart.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>8.1.8</Version>
+    <Version>8.1.9</Version>
     <PackageTags>Bootstrap Blazor WebAssembly wasm UI Components Chart</PackageTags>
     <Description>Bootstrap UI components extensions of Chart.js</Description>
   </PropertyGroup>

src/Extensions/Components/BootstrapBlazor.Sortable/BootstrapBlazor.Sortable.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>8.0.3</Version>
+    <Version>8.0.4</Version>
   </PropertyGroup>
 
   <PropertyGroup>

src/Extensions/Components/BootstrapBlazor.Sortable/Components/SortableList.razor.js

@@ -1,4 +1,4 @@
-import { Sortable, MultiDrag } from '../sortable.esm.js'
+import Sortable from '../sortable.esm.js'
 import Data from '../../BootstrapBlazor/modules/data.js'
 
 export function init(id, invoke, options, triggerUpdate, triggerRemove) {
@@ -37,10 +37,6 @@ const loopCheck = (id, el, invoke, op) => {
 const initSortable = (id, element, invoke, op) => {
     delete op.rootSelector;
 
-    if (op.multiDrag) {
-        Sortable.mount(new MultiDrag());
-    }
-
     op.group = {
         name: op.group
     };

src/Extensions/Components/BootstrapBlazor.Sortable/Components/SortableOption.cs

@@ -196,4 +196,16 @@ public class SortableOption
     /// </summary>
     [JsonIgnore(Condition = JsonIgnoreCondition.WhenWritingNull)]
     public bool? MultiDrag { get; set; }
+
+    /// <summary>
+    /// 获得/设置 是否交换拖动 默认 null 未设置
+    /// </summary>
+    [JsonIgnore(Condition = JsonIgnoreCondition.WhenWritingNull)]
+    public bool? Swap { get; set; }
+
+    /// <summary>
+    /// 获得/设置 是否交换拖动项样式名称 默认 null 未设置
+    /// </summary>
+    [JsonIgnore(Condition = JsonIgnoreCondition.WhenWritingNull)]
+    public bool? SwapClass { get; set; }
 }

src/Extensions/Components/BootstrapBlazor.Sortable/wwwroot/sortable.esm.js

@@ -3347,6 +3347,7 @@ function removeMultiDragElements() {
 
 Sortable.mount(new AutoScrollPlugin());
 Sortable.mount(Remove, Revert);
+Sortable.mount(new SwapPlugin());
+Sortable.mount(new MultiDragPlugin());
 
 export default Sortable;
-export { MultiDragPlugin as MultiDrag, Sortable, SwapPlugin as Swap };