chore(CssBundler): add css-bundler tools

.gitignore

@@ -376,3 +376,6 @@ src/**/wwwroot/**/uploader
 # Bootstrap
 **/BootstrapBlazor/wwwroot/js/bootstrap.blazor.bundle.min.js
 **/BootstrapBlazor/wwwroot/css/bootstrapblazor.min.css
+
+# css
+**/BootstrapBlazor/wwwroot/css/bootstrap.blazor.bundle.*.css

dotnet-tools.json

@@ -0,0 +1,13 @@
+{
+  "version": 1,
+  "isRoot": true,
+  "tools": {
+    "bootstrapblazor.cssbundler": {
+      "version": "1.0.0",
+      "commands": [
+        "css-bundler"
+      ],
+      "rollForward": false
+    }
+  }
+}

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

@@ -12,16 +12,16 @@
 
 <DemoBlock Title="@Localizer["ValueTitle"]" Introduction="@Localizer["ValueIntro"]" Name="Value">
     <p>@((MarkupString)Localizer["ValueDescription"].Value)</p>
-    <ColorPicker Value="@Value" />
+    <ColorPicker Value="@Value"></ColorPicker>
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["BindValueTitle"]" Introduction="@Localizer["BindValueIntro"]" Name="BindValue">
-    <ColorPicker @bind-Value="@Value" />
+    <ColorPicker @bind-Value="@Value"></ColorPicker>
     <div class="mt-3">Value: @Value</div>
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["DisabledTitle"]" Introduction="@Localizer["DisabledIntro"]" Name="Disabled">
-    <ColorPicker Value="@Value" IsDisabled="true" />
+    <ColorPicker Value="@Value" IsDisabled="true"></ColorPicker>
 </DemoBlock>
 
 <DemoBlock Title="@Localizer["TemplateTitle"]" Introduction="@Localizer["TemplateIntro"]" Name="Template">
@@ -40,7 +40,7 @@
     <ValidateForm Model="Dummy">
         <div class="row g-3 form-inline">
             <div class="col-6">
-                <ColorPicker @bind-Value="@Dummy.Name" />
+                <ColorPicker @bind-Value="@Dummy.Name"></ColorPicker>
             </div>
         </div>
     </ValidateForm>
@@ -50,14 +50,14 @@
     <section ignore>
         <div class="row form-inline">
             <div class="col-12 col-sm-6">
-                <Switch @bind-Value="_opacityIsSupport" DisplayText="SupportOpacity" ShowLabel="true"></Switch>
+                <Switch @bind-Value="_opacityIsSupport" DisplayText="@Localizer["SupportOpacity"]" ShowLabel="true"></Switch>
             </div>
             <div class="col-12 col-sm-6">
-                <Switch @bind-Value="_opacityIsDisabled" DisplayText="Disabled" ShowLabel="true"></Switch>
+                <Switch @bind-Value="_opacityIsDisabled" DisplayText="@Localizer["Disabled"]" ShowLabel="true"></Switch>
             </div>
         </div>
     </section>
-    <ColorPicker @bind-Value="@_opacityValue" IsSupportOpacity="_opacityIsSupport" IsDisabled="_opacityIsDisabled" />
+    <ColorPicker @bind-Value="@_opacityValue" IsSupportOpacity="_opacityIsSupport" IsDisabled="_opacityIsDisabled"></ColorPicker>
 </DemoBlock>
 
 <AttributeTable Items="@GetAttributes()" />

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

@@ -2421,7 +2421,9 @@
     "AttributeTemplate": "The template for display",
     "AttributeFormatter": "Display color value formatting callback method",
     "AttributeIsSupportOpacity": "Whether to support transparency",
-    "AttributeSwatches": "Preset candidate colors"
+    "AttributeSwatches": "Preset candidate colors",
+    "SupportOpacity": "Support Opacity",
+    "Disabled": "Disabled"
   },
   "BootstrapBlazor.Server.Components.Samples.DateTimePickers": {
     "Title": "DatePicker",

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

@@ -2421,7 +2421,9 @@
     "AttributeTemplate": "显示模板",
     "AttributeFormatter": "显示颜色值格式化回调方法",
     "AttributeIsSupportOpacity": "是否支持透明度",
-    "AttributeSwatches": "预设候选颜色"
+    "AttributeSwatches": "预设候选颜色",
+    "SupportOpacity": "支持透明",
+    "Disabled": "禁用"
   },
   "BootstrapBlazor.Server.Components.Samples.DateTimePickers": {
     "Title": "DatePicker 日期选择器",

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.11.1-beta04</Version>
+    <Version>9.11.1-beta05</Version>
   </PropertyGroup>
 
   <ItemGroup>
@@ -10,18 +10,16 @@
   </ItemGroup>
 
   <ItemGroup>
-    <Content Remove="wwwroot\core\bootstrap\css\bootstrap.css" />
-    <Content Remove="wwwroot\core\bootstrap\css\bootstrap.rtl.css" />
-    <Content Remove="wwwroot\core\bootstrap\js\bootstrap.bundle.js" />
-    <Content Remove="wwwroot\core\bootstrap\js\bootstrap.bundle.min.js" />
-    <Content Remove="wwwroot\lib\swal\sweetalert2.css" />
+    <Content Remove="wwwroot\core\bootstrap\**\*.*" />
+    <Content Remove="wwwroot\lib\animate\*.css" />
+    <Content Remove="wwwroot\lib\swal\*.css" />
     <Content Remove="wwwroot\scss\*" />
-    <None Include="wwwroot\core\bootstrap\css\bootstrap.css" />
-    <None Include="wwwroot\core\bootstrap\css\bootstrap.rtl.css" />
-    <None Include="wwwroot\core\bootstrap\js\bootstrap.bundle.js" />
-    <None Include="wwwroot\core\bootstrap\js\bootstrap.bundle.min.js" />
-    <None Include="wwwroot\lib\swal\sweetalert2.css" />
+    <Content Remove="wwwroot\css\bootstrapblazor.min.css" />
+    <None Include="wwwroot\core\bootstrap\**\*.*" />
+    <None Include="wwwroot\lib\animate\*.css" />
+    <None Include="wwwroot\lib\swal\*.css" />
     <None Include="wwwroot\scss\*" />
+    <None Include="wwwroot\css\bootstrapblazor.min.css" />
   </ItemGroup>
 
   <ItemGroup>

src/BootstrapBlazor/Directory.Build.targets

@@ -7,13 +7,21 @@
   </ItemGroup>
 
   <PropertyGroup>
-    <BootstrapBundleFile>$(MSBuildThisFileDirectory)wwwroot/core/bootstrap/js/bootstrap.bundle.min.js</BootstrapBundleFile>
-    <TargetBootstrapBundleFile>$(MSBuildThisFileDirectory)wwwroot/js/bootstrap.blazor.bundle.min.js</TargetBootstrapBundleFile>
+    <BootstrapOriginJsFile>$(MSBuildThisFileDirectory)wwwroot/core/bootstrap/js/bootstrap.bundle.min.js</BootstrapOriginJsFile>
+    <BootstrapTargetJsFile>$(MSBuildThisFileDirectory)wwwroot/js/bootstrap.blazor.bundle.min.js</BootstrapTargetJsFile>
+    <StyleFile>$(MSBuildThisFileDirectory)wwwroot/css/bootstrapblazor.min.css</StyleFile>
+    <BundleStyleFile>$(MSBuildThisFileDirectory)wwwroot/css/bootstrap.blazor.bundle.min.css;$(MSBuildThisFileDirectory)wwwroot/css/bootstrap.blazor.bundle.rtl.min.css</BundleStyleFile>
   </PropertyGroup>
 
-  <Target Name="CopyCss" AfterTargets="Build" Condition="'$(TargetFramework)' == '$(RunTargetFramework)'">
+  <Target Name="CopyJs" AfterTargets="Build" Condition="'$(TargetFramework)' == '$(RunTargetFramework)'" Inputs="$(BootstrapOriginJsFile)" Outputs="$(BootstrapTargetJsFile)">
     <Message Text="Copy bootstrap.bundle.min.js ..." Importance="high"></Message>
-    <Copy SourceFiles="$(BootstrapBundleFile)" DestinationFiles="$(TargetBootstrapBundleFile)" SkipUnchangedFiles="true"></Copy>
+    <Copy SourceFiles="$(BootstrapOriginJsFile)" DestinationFiles="$(BootstrapTargetJsFile)" SkipUnchangedFiles="true"></Copy>
+  </Target>
+
+  <Target Name="CssBundler" AfterTargets="CopyJs" Condition="'$(TargetFramework)' == '$(RunTargetFramework)'" Inputs="$(StyleFile)" Outputs="$(BundleStyleFile)">
+    <Exec Command="dotnet tool restore"></Exec>
+    <Message Text="Bundler min css ..." Importance="high"></Message>
+    <Exec Command="dotnet css-bundler .\bundler.json"></Exec>
   </Target>
 
 </Project>

src/BootstrapBlazor/bundler.json

@@ -0,0 +1,20 @@
+[
+  {
+    "outputFileName": "wwwroot/css/bootstrap.blazor.bundle.min.css",
+    "inputFiles": [
+      "wwwroot/core/bootstrap/css/bootstrap.min.css",
+      "wwwroot/css/bootstrapblazor.min.css",
+      "wwwroot/lib/animate/animate.min.css",
+      "wwwroot/lib/swal/sweetalert2.min.css"
+    ]
+  },
+  {
+    "outputFileName": "wwwroot/css/bootstrap.blazor.bundle.rtl.min.css",
+    "inputFiles": [
+      "wwwroot/core/bootstrap/css/bootstrap.rtl.min.css",
+      "wwwroot/css/bootstrapblazor.min.css",
+      "wwwroot/lib/animate/animate.min.css",
+      "wwwroot/lib/swal/sweetalert2.min.css"
+    ]
+  }
+]