starlight-cannoli-plugins 2.10.3 → 2.10.5

package/dist/{chunk-RHYQUYJ3.js → chunk-PPNIMJPX.js}

@@ -3,6 +3,57 @@ import { fileURLToPath } from "url";
 var css = String.raw;
 var js = String.raw;
 var CONDITIONAL_CSS = {
+  offerTabbedContent: {
+    enabled: css`
+      /* Suppress the default crossfade for the named panel transition. */
+      ::view-transition-old(tabbed-panel),
+      ::view-transition-new(tabbed-panel) {
+        animation: none;
+        mix-blend-mode: normal;
+      }
+
+      /* Slide animation — only when the user has no motion preference. */
+      @media (prefers-reduced-motion: no-preference) {
+        :root[data-tab-direction="next"]::view-transition-old(tabbed-panel) {
+          animation: tabbed-slide-out-to-left 250ms ease both;
+        }
+        :root[data-tab-direction="next"]::view-transition-new(tabbed-panel) {
+          animation: tabbed-slide-in-from-right 250ms ease both;
+        }
+        :root[data-tab-direction="prev"]::view-transition-old(tabbed-panel) {
+          animation: tabbed-slide-out-to-right 250ms ease both;
+        }
+        :root[data-tab-direction="prev"]::view-transition-new(tabbed-panel) {
+          animation: tabbed-slide-in-from-left 250ms ease both;
+        }
+      }
+
+      @keyframes tabbed-slide-out-to-left {
+        to {
+          transform: translateX(-30%);
+          opacity: 0;
+        }
+      }
+      @keyframes tabbed-slide-in-from-right {
+        from {
+          transform: translateX(30%);
+          opacity: 0;
+        }
+      }
+      @keyframes tabbed-slide-out-to-right {
+        to {
+          transform: translateX(30%);
+          opacity: 0;
+        }
+      }
+      @keyframes tabbed-slide-in-from-left {
+        from {
+          transform: translateX(-30%);
+          opacity: 0;
+        }
+      }
+    `
+  },
   limitDetailsElementHeight: {
     enabled: css`
       .main-pane details[open] {

package/dist/index.js

@@ -24,7 +24,7 @@ import {
 } from "./chunk-NCXV367P.js";
 import {
   starlightDomPatches
-} from "./chunk-RHYQUYJ3.js";
+} from "./chunk-PPNIMJPX.js";
 import "./chunk-4VNS5WPM.js";
 
 // src/plugins/starlight-index-sourced-sidebar/index.ts

package/dist/plugins/starlight-dom-patches/page-script.js

@@ -146,29 +146,33 @@ function tabbedH2Content() {
   contentContainer.appendChild(tabbedWrapper);
   contentContainer.appendChild(paginationBar);
   let activeTabIndex = 0;
-  function isTabNavVisible() {
-    const rect = tabNav.getBoundingClientRect();
-    return rect.top < window.innerHeight && rect.bottom > 0;
-  }
-  function activateTab(targetIndex, updateHash = true, scrollToNav = false) {
-    activeTabIndex = targetIndex;
-    tabButtons.forEach((tabButton, buttonIndex) => {
-      tabButton.dataset.active = String(buttonIndex === targetIndex);
-    });
-    tabPanels.forEach((tabPanel, panelIndex) => {
-      tabPanel.hidden = panelIndex !== targetIndex;
-    });
-    prevTabButton.disabled = targetIndex === 0;
-    nextTabButton.disabled = targetIndex === allSections.length - 1;
+  function activateTab(targetIndex, updateHash = true) {
+    const applySwitch = () => {
+      tabPanels[activeTabIndex].style.viewTransitionName = "";
+      activeTabIndex = targetIndex;
+      tabButtons.forEach((tabButton, buttonIndex) => {
+        tabButton.dataset.active = String(buttonIndex === targetIndex);
+      });
+      tabPanels.forEach((tabPanel, panelIndex) => {
+        tabPanel.hidden = panelIndex !== targetIndex;
+      });
+      tabPanels[targetIndex].style.viewTransitionName = "tabbed-panel";
+      prevTabButton.disabled = targetIndex === 0;
+      nextTabButton.disabled = targetIndex === allSections.length - 1;
+    };
+    if (targetIndex !== activeTabIndex && "startViewTransition" in document) {
+      document.documentElement.dataset.tabDirection = targetIndex > activeTabIndex ? "next" : "prev";
+      tabPanels[activeTabIndex].style.viewTransitionName = "tabbed-panel";
+      document.startViewTransition(applySwitch);
+    } else {
+      applySwitch();
+    }
     const scrollBehavior = getComputedStyle(document.documentElement).scrollBehavior;
     tabButtons[targetIndex].scrollIntoView({
       behavior: scrollBehavior,
       block: "nearest",
       inline: "nearest"
     });
-    if (scrollToNav) {
-      tabNav.scrollIntoView({ behavior: scrollBehavior, block: "nearest" });
-    }
     if (updateHash) {
       const targetHeadingId = allSections[targetIndex].headingId;
       if (targetHeadingId) {
@@ -207,17 +211,23 @@ function tabbedH2Content() {
     if (targetPanelIndex >= 0 && targetPanelIndex !== activeTabIndex)
       activateTab(targetPanelIndex, false);
   }
+  function isTabNavVisible() {
+    const rect = tabNav.getBoundingClientRect();
+    return rect.top < window.innerHeight && rect.bottom > 0;
+  }
   function wireInteractions(viewToggleCheckbox2) {
     prevTabButton.addEventListener("click", () => {
       if (activeTabIndex > 0) {
-        const scrollToNav = !isTabNavVisible();
-        activateTab(activeTabIndex - 1, true, scrollToNav);
+        if (!isTabNavVisible())
+          window.scrollTo({ top: 0, behavior: "instant" });
+        activateTab(activeTabIndex - 1);
       }
     });
     nextTabButton.addEventListener("click", () => {
       if (activeTabIndex < allSections.length - 1) {
-        const scrollToNav = !isTabNavVisible();
-        activateTab(activeTabIndex + 1, true, scrollToNav);
+        if (!isTabNavVisible())
+          window.scrollTo({ top: 0, behavior: "instant" });
+        activateTab(activeTabIndex + 1);
       }
     });
     tabButtons.forEach((tabButton, buttonIndex) => {

package/dist/plugins/starlight-dom-patches.js

@@ -1,6 +1,6 @@
 import {
   starlightDomPatches
-} from "../chunk-RHYQUYJ3.js";
+} from "../chunk-PPNIMJPX.js";
 import "../chunk-4VNS5WPM.js";
 export {
   starlightDomPatches

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "starlight-cannoli-plugins",
   "type": "module",
-  "version": "2.10.3",
+  "version": "2.10.5",
   "description": "Starlight plugins for automatic sidebar generation and link validation",
   "license": "ISC",
   "main": "./dist/index.js",