chore(Script): downgrade script syntax

src/BootstrapBlazor.Server/BootstrapBlazor.Server.csproj

@@ -38,7 +38,7 @@
     <PackageReference Include="BootstrapBlazor.FontAwesome" Version="9.0.2" />
     <PackageReference Include="BootstrapBlazor.Gantt" Version="9.0.2" />
     <PackageReference Include="BootstrapBlazor.Holiday" Version="9.0.1" />
-    <PackageReference Include="BootstrapBlazor.Html2Image" Version="9.0.0" />
+    <PackageReference Include="BootstrapBlazor.Html2Image" Version="9.0.2" />
     <PackageReference Include="BootstrapBlazor.Html2Pdf" Version="9.0.2" />
     <PackageReference Include="BootstrapBlazor.IconPark" Version="9.0.3" />
     <PackageReference Include="BootstrapBlazor.ImageCropper" Version="9.0.0" />
@@ -47,9 +47,9 @@
     <PackageReference Include="BootstrapBlazor.Live2DDisplay" Version="9.0.1" />
     <PackageReference Include="BootstrapBlazor.Markdown" Version="9.0.1" />
     <PackageReference Include="BootstrapBlazor.MaterialDesign" Version="9.0.1" />
-    <PackageReference Include="BootstrapBlazor.MeiliSearch" Version="9.1.7" />
+    <PackageReference Include="BootstrapBlazor.MeiliSearch" Version="9.1.9" />
     <PackageReference Include="BootstrapBlazor.Mermaid" Version="9.0.3" />
-    <PackageReference Include="BootstrapBlazor.MindMap" Version="9.1.3" />
+    <PackageReference Include="BootstrapBlazor.MindMap" Version="9.1.6" />
     <PackageReference Include="BootstrapBlazor.MouseFollower" Version="9.0.1" />
     <PackageReference Include="BootstrapBlazor.OctIcon" Version="9.0.4" />
     <PackageReference Include="BootstrapBlazor.OnScreenKeyboard" Version="9.0.1" />
@@ -65,7 +65,7 @@
     <PackageReference Include="BootstrapBlazor.TableExport" Version="9.2.1" />
     <PackageReference Include="BootstrapBlazor.Topology" Version="9.0.0" />
     <PackageReference Include="BootstrapBlazor.UniverIcon" Version="9.0.1" />
-    <PackageReference Include="BootstrapBlazor.UniverSheet" Version="9.0.0-beta05" />
+    <PackageReference Include="BootstrapBlazor.UniverSheet" Version="9.0.0-beta07" />
     <PackageReference Include="BootstrapBlazor.VideoPlayer" Version="9.0.3" />
     <PackageReference Include="BootstrapBlazor.WinBox" Version="9.0.7" />
   </ItemGroup>

src/BootstrapBlazor.Server/Components/Components/ThemeMode.razor.js

@@ -1,4 +1,4 @@
-import { getTheme, switchTheme } from "../../_content/BootstrapBlazor/modules/utility.js"
+import { getTheme, switchTheme, calcCenterPosition } from "../../_content/BootstrapBlazor/modules/utility.js"
 import EventHandler from "../../_content/BootstrapBlazor/modules/event-handler.js"
 
 export function init(id) {
@@ -12,7 +12,9 @@ export function init(id) {
             else {
                 theme = 'dark';
             }
-            switchTheme(theme, window.innerWidth, window.innerHeight);
+
+            const rect = calcCenterPosition(el);
+            switchTheme(theme, rect.x, rect.y);
         });
     }
 }

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.4.9-beta02</Version>
+    <Version>9.4.9-beta03</Version>
   </PropertyGroup>
 
   <ItemGroup>

src/BootstrapBlazor/Components/ThemeProvider/ThemeProvider.razor.js

@@ -1,4 +1,4 @@
-import { getPreferredTheme, setTheme, switchTheme } from "../../modules/utility.js"
+import { getPreferredTheme, setTheme, switchTheme, calcCenterPosition } from "../../modules/utility.js"
 import EventHandler from "../../modules/event-handler.js"
 import Data from "../../modules/data.js"
 
@@ -25,7 +25,9 @@ export function init(id, invoke, themeValue, callback) {
     EventHandler.on(el, 'click', '.dropdown-item', e => {
         const activeTheme = e.delegateTarget.getAttribute('data-bb-theme-value');
         theme.currentTheme = activeTheme;
-        switchTheme(activeTheme, window.innerWidth, 0);
+
+        const rect = calcCenterPosition(el);
+        switchTheme(activeTheme, rect.x, rect.y);
         if (callback) {
             invoke.invokeMethodAsync(callback, activeTheme);
         }

src/BootstrapBlazor/Components/Typed/Typed.razor.js

@@ -2,7 +2,7 @@
 import Typed from '../../lib/typedjs/typed.module.js'
 
 const getOptions = (text, invoke, options, callbacks) => {
-    options ||= {};
+    options = options || {};
 
     if (text) {
         options.strings = [text];

src/BootstrapBlazor/wwwroot/modules/fullscreen.js

@@ -2,7 +2,7 @@
 
 export async function toggle(options) {
     let el = null;
-    options ||= {};
+    options = options || {};
     if (options.id) {
         el = document.getElementById(options.id);
     }

src/BootstrapBlazor/wwwroot/modules/utility.js

@@ -809,8 +809,8 @@ const deepMerge = (obj1, obj2, skipNull = true) => {
 }
 
 export function registerBootstrapBlazorModule(name, identifier, callback) {
-    window.BootstrapBlazor ||= {};
-    window.BootstrapBlazor[name] ||= {
+    window.BootstrapBlazor = window.BootstrapBlazor || {};
+    window.BootstrapBlazor[name] = window.BootstrapBlazor[name] || {
         _init: false,
         _items: [],
         register: function (id, cb) {
@@ -841,6 +841,14 @@ export function setTitle(title) {
     document.title = title;
 }
 
+export function calcCenterPosition(el) {
+    const rect = el.getBoundingClientRect();
+    return {
+        x: rect.left + el.offsetWidth / 2,
+        y: rect.top + el.offsetHeight / 2
+    }
+}
+
 export {
     autoAdd,
     autoRemove,

src/BootstrapBlazor/wwwroot/scss/root.scss

@@ -76,13 +76,48 @@ a, a:hover, a:focus {
     --bs-popover-body-padding-y: 0.5rem;
 }
 
-::view-transition-old(root) {
+::view-transition-old(*) {
+    mix-blend-mode: normal;
     animation: none;
+    z-index: 1;
 }
 
-::view-transition-new(root) {
+::view-transition-new(*) {
     mix-blend-mode: normal;
-    animation: clip .3s ease-in;
+    animation: clip .3s ease-in-out;
+    z-index: 9999;
+}
+
+@keyframes clip {
+    from {
+        clip-path: circle(0% at var(--bb-theme-x) var(--bb-theme-y));
+    }
+
+    to {
+        clip-path: circle(100% at var(--bb-theme-x) var(--bb-theme-y));
+    }
+}
+
+[data-bs-theme='dark'] {
+    &::view-transition-old(*) {
+        animation: clip2 .3s ease-in-out;
+        z-index: 9999;
+    }
+
+    &::view-transition-new(*) {
+        animation: none;
+        z-index: 1;
+    }
+}
+
+@keyframes clip2 {
+    from {
+        clip-path: circle(100% at var(--bb-theme-x) var(--bb-theme-y));
+    }
+
+    to {
+        clip-path: circle(0% at var(--bb-theme-x) var(--bb-theme-y));
+    }
 }
 
 body:before {
@@ -125,13 +160,3 @@ body:before {
         content: "extraExtraLarge";
     }
 }
-
-@keyframes clip {
-    from {
-        clip-path: circle(0% at var(--bb-theme-x) var(--bb-theme-y));
-    }
-
-    to {
-        clip-path: circle(100% at var(--bb-theme-x) var(--bb-theme-y));
-    }
-}