fix(docs): update sandpack version (#1162)

* fix(docs): update sandpack version * wip * update PR template
codesandbox · Jul 11, 2024 · 55cb609 · 55cb609
1 parent fdd833a
commit 55cb609
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 25 deletions.
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
@@ -1,21 +1,5 @@
 ## What kind of change does this pull request introduce?
 
-<!-- Is it a Bug fix, feature, documentation update... -->
-
-## What is the current behavior?
-
-<!-- You can also link to an open issue here -->
-
-## What is the new behavior?
-
-<!-- if this is a feature change -->
-
-## What steps did you take to test this? This is required before we can merge, make sure to test the flow you've updated.
-
-1. Step A
-2. Step B
-3. Step C
-
 ## Checklist
 
 <!-- Have you done all of these things? -->
@@ -27,6 +11,5 @@
 - [ ] Tests;
 - [ ] Ready to be merged;
 
-
 <!-- feel free to add additional comments -->
 <!-- Thank you for contributing! -->
diff --git a/website/docs/package.json b/website/docs/package.json
@@ -12,7 +12,7 @@
  "test-docs": "alex pages/**/"
  },
  "dependencies": {
- "@codesandbox/sandpack-react": "^2.0.1",
+ "@codesandbox/sandpack-react": "^2.18.0",
  "@codesandbox/sandpack-themes": "^2.0.1",
  "@radix-ui/react-tabs": "^1.0.1",
  "amplitude-js": "^8.13.0",

diff --git a/website/docs/src/components/CodeBlock.tsx b/website/docs/src/components/CodeBlock.tsx
@@ -7,6 +7,7 @@ import {
  SandpackProvider,
  useSandpack,
 } from "@codesandbox/sandpack-react";
+import type { SandpackOptions } from "@codesandbox/sandpack-react";
 import { sandpackDark } from "@codesandbox/sandpack-themes";
 import { useTheme } from "next-themes";
 import { useEffect, useState } from "react";
@@ -31,11 +32,11 @@ const ListenerResize: React.FC<{ onResize: (height: number) => void }> = ({
  return null;
 };
 
-export const CodeBlock: React.FC<{ children: string; stack: boolean }> = ({
- children,
- stack,
- ...props
-}) => {
+export const CodeBlock: React.FC<{
+ children: string;
+ stack: boolean;
+ options?: SandpackOptions;
+}> = ({ children, stack, ...props }) => {
  const { theme } = useTheme();
  const [height, setHeight] = useState(150);
 
@@ -54,7 +55,7 @@ export const CodeBlock: React.FC<{ children: string; stack: boolean }> = ({
  const sandpackProps = {
  customSetup: {
  dependencies: {
- "@codesandbox/sandpack-react": "latest",
+ "@codesandbox/sandpack-react": "2.18.0",
  "@codesandbox/sandpack-themes": "latest",
  },
  },
@@ -63,7 +64,7 @@ export const CodeBlock: React.FC<{ children: string; stack: boolean }> = ({
  },
  template: "react" as const,
  theme: getTheme(),
- options: { showLineNumbers: true, initMode: "immediate" },
+ options: { showLineNumbers: true, initMode: "immediate", ...props.options },
  key: children,
  ...props,
  } as any;