chore: migrate v5 style

.vscode/launch.json

@@ -35,6 +35,21 @@
             // If you have changed the default port / launch URL make sure to update the expectation below
             "url": "http://localhost:5000",
             "webRoot": "${workspaceFolder}/site/AntDesign.Docs.Wasm",
-        }
+        },
+        {
+          "name": "Migrator",
+          "type": "node",
+          "request": "launch",
+          "skipFiles": [
+              "<node_internals>/**"
+          ],
+          "runtimeArgs": [
+              "-r",
+              "ts-node/register"
+          ],
+          "args": [
+              "${workspaceFolder}/scripts/migrator/index.ts"
+          ]
+      }
     ]
 }

components/AntDesign.csproj

@@ -84,11 +84,12 @@
   </ItemGroup>
 
   <ItemGroup>
+    <PackageReference Include="CssInCSharp" Version="0.1.0-nightly-231218032026" />
     <PackageReference Include="Microsoft.AspNetCore.Components.DataAnnotations.Validation" Version="3.2.0-rc1.20223.4" />
     <PackageReference Include="OneOf" Version="2.1.155" />
     <PackageReference Include="Microsoft.SourceLink.GitHub" Version="1.0.0" PrivateAssets="All" />
   </ItemGroup>
-
+  
   <ItemGroup>
     <Content Update="**\*.razor">
       <Pack>false</Pack>

components/_Imports.razor

@@ -1 +1,2 @@
-@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.AspNetCore.Components.Web
+@using CssInCSharp

components/affix/Affix.razor

@@ -9,4 +9,5 @@
     <div class="@ClassMapper.Class" @ref="_childRef" style="@_affixStyle">
         @ChildContent
     </div>
-</div>
+</div>
+@_styleContent

components/affix/Affix.razor.cs

@@ -67,9 +67,10 @@ private bool Affixed
         protected override void OnInitialized()
         {
             base.OnInitialized();
-
+            var hashId = UseStyle(PrefixCls);
             ClassMapper
-               .If(PrefixCls, () => _affixed);
+               .If(PrefixCls, () => _affixed)
+               .Add(hashId);
         }
 
         public override async Task SetParametersAsync(ParameterView parameters)

components/affix/Style.cs

@@ -0,0 +1,52 @@
+using System;
+using CssInCSharp;
+using static AntDesign.GlobalStyle;
+using static AntDesign.Theme;
+using static AntDesign.StyleUtil;
+
+namespace AntDesign
+{
+    public class AffixToken : TokenWithCommonCls
+    {
+        public double ZIndexPopup
+        {
+            get => (double)_tokens["zIndexPopup"];
+            set => _tokens["zIndexPopup"] = value;
+        }
+
+    }
+
+    public partial class Affix
+    {
+        public CSSObject GenSharedAffixStyle(AffixToken token)
+        {
+            var componentCls = token.ComponentCls;
+            return new CSSObject()
+            {
+                [componentCls] = new CSSObject()
+                {
+                    Position = "fixed",
+                    ZIndex = token.ZIndexPopup,
+                },
+            };
+        }
+
+        protected override UseComponentStyleResult UseComponentStyle()
+        {
+            return GenComponentStyleHook(
+                "Affix",
+                (token) =>
+                {
+                    var affixToken = MergeToken(
+                        token,
+                        new AffixToken()
+                        {
+                            ZIndexPopup = token.ZIndexBase + 10,
+                        });
+                    return new CSSInterpolation[] { GenSharedAffixStyle(affixToken) };
+                });
+        }
+
+    }
+
+}

components/alert/Alert.razor

@@ -50,4 +50,5 @@
             </button>
         }
     </div>
-}
+}
+@_styleContent

components/alert/Alert.razor.cs

@@ -118,8 +118,10 @@ public partial class Alert : AntDomComponentBase
         private void SetClassMap()
         {
             string prefixName = "ant-alert";
+            var hashId = UseStyle(prefixName);
             ClassMapper
-                .Add("ant-alert")
+                .Add(prefixName)
+                .Add(hashId)
                 .GetIf(() => $"{prefixName}-{CalcType}", () => !string.IsNullOrEmpty(CalcType))
                 .If($"{prefixName}-no-icon", () => !IsShowIcon)
                 .If($"{prefixName}-closable", () => Closable)