docs: fix v8 website style cascade (#2983)

Author: gpbl

apps/website/examples-v8/react-day-picker-v8.tsx

@@ -1,4 +1,3 @@
-import v8Style from "!raw-loader!react-day-picker-v8/dist/style.css";
 import {
   DayPicker as DayPickerV8,
   type DayPickerProps,
@@ -26,10 +25,5 @@ export {
 } from "react-day-picker-v8";
 
 export function DayPicker(props: DayPickerProps) {
-  return (
-    <>
-      <style>{v8Style.toString()}</style>
-      <DayPickerV8 {...props} />
-    </>
-  );
+  return <DayPickerV8 {...props} />;
 }

apps/website/src/theme/MDXComponents.tsx

@@ -1,9 +1,10 @@
+import v8Style from "!raw-loader!react-day-picker-v8/dist/style.css";
 import { useDocsVersion } from "@docusaurus/plugin-content-docs/client";
 import MDXComponents from "@theme-original/MDXComponents";
 import type { ComponentProps, ComponentType } from "react";
 import * as ExamplesV8 from "../../examples-v8";
 import * as ExamplesV9 from "../../examples-v9";
-import { BrowserWindow } from "../components/BrowserWindow";
+import { BrowserWindow as BaseBrowserWindow } from "../components/BrowserWindow";
 import * as CurrentExamples from "../examples";
 
 type TableComponent = ComponentType<ComponentProps<"table">>;
@@ -64,6 +65,15 @@ function ResponsiveTable(props: ComponentProps<typeof Table>) {
   );
 }
 
+function BrowserWindow(props: ComponentProps<typeof BaseBrowserWindow>) {
+  const version = useDocsVersion();
+  const baseStyleCss =
+    props.baseStyleCss ??
+    (version.version === "8.10.2" ? v8Style.toString() : undefined);
+
+  return <BaseBrowserWindow {...props} baseStyleCss={baseStyleCss} />;
+}
+
 export default {
   ...MDXComponents,
   table: ResponsiveTable,