New source found from dndbeyond.com

2026-07-08 01:00:09 -07:00
parent 9a983a6d7b
commit dcefa0d2f2
2865 changed files with 222467 additions and 49053 deletions
@@ -0,0 +1,72 @@
+import { useEffect, useState } from "react";
+import { useSelector } from "react-redux";
+
+import { rulesEngineSelectors } from "@dndbeyond/character-rules-engine";
+
+import { GuidedTour } from "~/components/GuidedTour";
+import { useFeatureFlags } from "~/contexts/FeatureFlag";
+
+import { getCharacterSheetSteps } from "./getCharacterSheetSteps";
+
+export const CharacterSheetGuidedTour = ({ children, ...props }) => {
+  const [step, setStep] = useState(0);
+  const { characterSheetTourFlag } = useFeatureFlags();
+  const isMobile = window.matchMedia("(max-width: 767px)").matches;
+  const isTablet = window.matchMedia(
+    "(min-width: 768px and max-width: 1023px)"
+  ).matches;
+  const isDesktop = window.matchMedia("(min-width: 1024px)").matches;
+  const ready = useSelector(rulesEngineSelectors.isCharacterSheetReady);
+  // const hasSpells = useSelector(rulesEngineSelectors.hasSpells);
+  const [loading, setLoading] = useState(true);
+
+  const setCurrentStep = (currentStep) => {
+    switch (currentStep) {
+      case 11: {
+        if (isMobile) {
+          const toggle = document.querySelector(
+            "[class^='styles_navToggle']"
+          ) as HTMLButtonElement;
+          toggle?.click();
+        }
+        break;
+      }
+      case 13: {
+        if (isTablet) {
+          const toggle = document.querySelector(
+            "[class^='styles_navToggle']"
+          ) as HTMLButtonElement;
+          toggle?.click();
+        }
+        break;
+      }
+      default:
+        break;
+    }
+    setStep(currentStep);
+  };
+
+  useEffect(() => {
+    // If character sheet has loaded, enable tour
+    if (ready) setLoading(false);
+  }, [ready]);
+
+  return (
+    <>
+      {characterSheetTourFlag && !loading ? (
+        <GuidedTour
+          steps={getCharacterSheetSteps(false, isTablet, isDesktop)}
+          step={step}
+          setStep={setCurrentStep}
+          showOnFirstLoad={true}
+          cookieName="characterSheetGuidedTour"
+          {...props}
+        >
+          {children}
+        </GuidedTour>
+      ) : (
+        <>{children}</>
+      )}
+    </>
+  );
+};