Skip to content

Commit

Permalink
merging all conflicts
Browse files Browse the repository at this point in the history
  • Loading branch information
react-translations-bot committed Sep 25, 2023
2 parents 12f6f24 + 2390627 commit 63b75d7
Show file tree
Hide file tree
Showing 55 changed files with 1,524 additions and 869 deletions.
1 change: 0 additions & 1 deletion .env.development
Original file line number Diff line number Diff line change
@@ -1 +0,0 @@
SANDPACK_BARE_COMPONENTS=true
3 changes: 1 addition & 2 deletions .env.production
Original file line number Diff line number Diff line change
@@ -1,2 +1 @@
NEXT_PUBLIC_GA_TRACKING_ID = 'UA-41298772-4'
SANDPACK_BARE_COMPONENTS=true
NEXT_PUBLIC_GA_TRACKING_ID = 'UA-41298772-4'
8 changes: 1 addition & 7 deletions next.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,7 @@ const nextConfig = {
scrollRestoration: true,
legacyBrowsers: false,
},
env: {
SANDPACK_BARE_COMPONENTS: process.env.SANDPACK_BARE_COMPONENTS,
},
env: {},
webpack: (config, {dev, isServer, ...options}) => {
if (process.env.ANALYZE) {
const {BundleAnalyzerPlugin} = require('webpack-bundle-analyzer');
Expand All @@ -35,10 +33,6 @@ const nextConfig = {

const {IgnorePlugin, NormalModuleReplacementPlugin} = require('webpack');
config.plugins.push(
new NormalModuleReplacementPlugin(
/^@stitches\/core$/,
require.resolve('./src/utils/emptyShim.js')
),
new NormalModuleReplacementPlugin(
/^raf$/,
require.resolve('./src/utils/rafShim.js')
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
"check-all": "npm-run-all prettier lint:fix tsc"
},
"dependencies": {
"@codesandbox/sandpack-react": "1.15.5",
"@codesandbox/sandpack-react": "2.6.0",
"@docsearch/css": "3.0.0-alpha.41",
"@docsearch/react": "3.0.0-alpha.41",
"@headlessui/react": "^1.7.0",
Expand Down
30 changes: 0 additions & 30 deletions patches/@codemirror+lang-javascript+0.19.6.patch

This file was deleted.

62 changes: 0 additions & 62 deletions patches/@codesandbox+sandpack-react+1.15.5.patch

This file was deleted.

345 changes: 0 additions & 345 deletions patches/@lezer+javascript+0.15.2.patch

This file was deleted.

Binary file removed public/images/team/dave-mccabe.jpg
Binary file not shown.
Binary file removed public/images/team/lunaruan.jpg
Binary file not shown.
Binary file removed public/images/team/mengdi-chen.jpg
Binary file not shown.
Binary file removed public/images/team/sean-keegan.jpg
Binary file not shown.
8 changes: 4 additions & 4 deletions src/components/Icon/IconTwitter.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,13 @@ export const IconTwitter = memo<JSX.IntrinsicElements['svg']>(
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width="1.33em"
height="1.33em"
viewBox="0 0 512 512"
height="1.30em"
width="1.30em"
fill="currentColor"
{...props}>
<path fill="none" d="M0 0h24v24H0z" />
<path d="M22.162 5.656a8.384 8.384 0 0 1-2.402.658A4.196 4.196 0 0 0 21.6 4c-.82.488-1.719.83-2.656 1.015a4.182 4.182 0 0 0-7.126 3.814 11.874 11.874 0 0 1-8.62-4.37 4.168 4.168 0 0 0-.566 2.103c0 1.45.738 2.731 1.86 3.481a4.168 4.168 0 0 1-1.894-.523v.052a4.185 4.185 0 0 0 3.355 4.101 4.21 4.21 0 0 1-1.89.072A4.185 4.185 0 0 0 7.97 16.65a8.394 8.394 0 0 1-6.191 1.732 11.83 11.83 0 0 0 6.41 1.88c7.693 0 11.9-6.373 11.9-11.9 0-.18-.005-.362-.013-.54a8.496 8.496 0 0 0 2.087-2.165z" />
<path d="M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z" />
</svg>
);
}
Expand Down
4 changes: 2 additions & 2 deletions src/components/Layout/HomeContent.js
Original file line number Diff line number Diff line change
Expand Up @@ -1677,8 +1677,8 @@ function LikeButton({video}) {
<button
data-hover="LikeButton"
className={cn(
'outline-none focus:bg-red-50/5 focus:text-red-50 relative flex items-center justify-center w-10 h-10 cursor-pointer rounded-full text-tertiary hover:bg-card active:scale-95 active:bg-red-50/5 active:text-red-50',
isLiked && 'text-red-50'
'outline-none focus:bg-red-50/5 focus:text-red-50 relative flex items-center justify-center w-10 h-10 cursor-pointer rounded-full hover:bg-card active:scale-95 active:bg-red-50/5 active:text-red-50',
isLiked ? 'text-red-50' : 'text-tertiary'
)}
aria-label={isLiked ? 'Unsave' : 'Save'}
onClick={() => {
Expand Down
3 changes: 1 addition & 2 deletions src/components/Layout/Toc.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,7 @@ export function Toc({headings}: {headings: Toc}) {
<ul className="space-y-2 pb-16">
{headings.length > 0 &&
headings.map((h, i) => {
if (h.url == null) {
// TODO: only log in DEV
if (!h.url && process.env.NODE_ENV === 'development') {
console.error('Heading does not have URL');
}
return (
Expand Down
7 changes: 5 additions & 2 deletions src/components/MDX/CodeBlock/CodeBlock.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,14 @@
*/

import cn from 'classnames';
import {highlightTree, HighlightStyle, tags} from '@codemirror/highlight';
import {HighlightStyle} from '@codemirror/language';
import {highlightTree} from '@lezer/highlight';
import {javascript} from '@codemirror/lang-javascript';
import {html} from '@codemirror/lang-html';
import {css} from '@codemirror/lang-css';
import rangeParser from 'parse-numeric-range';
import {tags} from '@lezer/highlight';

import {CustomTheme} from '../Sandpack/Themes';

interface InlineHighlight {
Expand Down Expand Up @@ -52,7 +55,7 @@ const CodeBlock = function CodeBlock({
let tokenStarts = new Map();
let tokenEnds = new Map();
const highlightTheme = getSyntaxHighlight(CustomTheme);
highlightTree(tree, highlightTheme.match, (from, to, className) => {
highlightTree(tree, highlightTheme, (from, to, className) => {
tokenStarts.set(from, className);
tokenEnds.set(to, className);
});
Expand Down
8 changes: 8 additions & 0 deletions src/components/MDX/Heading.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -88,3 +88,11 @@ export const H4 = ({className, ...props}: HeadingProps) => (
{...props}
/>
);

export const H5 = ({className, ...props}: HeadingProps) => (
<Heading
as="h5"
className={cn(className, 'text-lg font-display font-bold leading-9 my-2')}
{...props}
/>
);
3 changes: 2 additions & 1 deletion src/components/MDX/MDXComponents.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import {CodeDiagram} from './CodeDiagram';
import ConsoleBlock from './ConsoleBlock';
import ExpandableCallout from './ExpandableCallout';
import ExpandableExample from './ExpandableExample';
import {H1, H2, H3, H4} from './Heading';
import {H1, H2, H3, H4, H5} from './Heading';
import InlineCode from './InlineCode';
import Intro from './Intro';
import BlogCard from './BlogCard';
Expand Down Expand Up @@ -388,6 +388,7 @@ export const MDXComponents = {
h2: H2,
h3: H3,
h4: H4,
h5: H5,
hr: Divider,
a: Link,
img: Image,
Expand Down
5 changes: 4 additions & 1 deletion src/components/MDX/Sandpack/Console.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,10 @@ import cn from 'classnames';
import {useState, useRef, useEffect} from 'react';
import {IconChevron} from 'components/Icon/IconChevron';

import {SandpackCodeViewer, useSandpack} from '@codesandbox/sandpack-react';
import {
SandpackCodeViewer,
useSandpack,
} from '@codesandbox/sandpack-react/unstyled';
import type {SandpackMessageConsoleMethods} from '@codesandbox/sandpack-client';

const getType = (
Expand Down
23 changes: 1 addition & 22 deletions src/components/MDX/Sandpack/CustomPreset.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,8 @@ import {
useSandpack,
useActiveCode,
SandpackCodeEditor,
// SandpackReactDevTools,
SandpackLayout,
} from '@codesandbox/sandpack-react';
} from '@codesandbox/sandpack-react/unstyled';
import cn from 'classnames';

import {IconChevron} from 'components/Icon/IconChevron';
Expand All @@ -19,14 +18,8 @@ import {Preview} from './Preview';
import {useSandpackLint} from './useSandpackLint';

export const CustomPreset = memo(function CustomPreset({
showDevTools,
onDevToolsLoad,
devToolsLoaded,
providedFiles,
}: {
showDevTools: boolean;
devToolsLoaded: boolean;
onDevToolsLoad: () => void;
providedFiles: Array<string>;
}) {
const {lintErrors, lintExtensions} = useSandpackLint();
Expand All @@ -41,9 +34,6 @@ export const CustomPreset = memo(function CustomPreset({
const isExpandable = lineCount > 16;
return (
<SandboxShell
showDevTools={showDevTools}
onDevToolsLoad={onDevToolsLoad}
devToolsLoaded={devToolsLoaded}
providedFiles={providedFiles}
lintErrors={lintErrors}
lintExtensions={lintExtensions}
Expand All @@ -53,16 +43,11 @@ export const CustomPreset = memo(function CustomPreset({
});

const SandboxShell = memo(function SandboxShell({
showDevTools,
devToolsLoaded,
providedFiles,
lintErrors,
lintExtensions,
isExpandable,
}: {
showDevTools: boolean;
devToolsLoaded: boolean;
onDevToolsLoad: () => void;
providedFiles: Array<string>;
lintErrors: Array<any>;
lintExtensions: Array<any>;
Expand All @@ -81,7 +66,6 @@ const SandboxShell = memo(function SandboxShell({
<NavigationBar providedFiles={providedFiles} />
<SandpackLayout
className={cn(
showDevTools && devToolsLoaded && 'sp-layout-devtools',
!(isExpandable || isExpanded) && 'rounded-b-lg overflow-hidden',
isExpanded && 'sp-layout-expanded'
)}>
Expand Down Expand Up @@ -125,11 +109,6 @@ const SandboxShell = memo(function SandboxShell({
</button>
)}
</SandpackLayout>

{/* {showDevTools && (
// @ts-ignore TODO(@danilowoz): support devtools
<SandpackReactDevTools onLoadModule={onDevToolsLoad} />
)} */}
</div>
</>
);
Expand Down
2 changes: 1 addition & 1 deletion src/components/MDX/Sandpack/DownloadButton.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
*/

import {useSyncExternalStore} from 'react';
import {useSandpack} from '@codesandbox/sandpack-react';
import {useSandpack} from '@codesandbox/sandpack-react/unstyled';
import {IconDownload} from '../../Icon/IconDownload';
export interface DownloadButtonProps {}

Expand Down
2 changes: 1 addition & 1 deletion src/components/MDX/Sandpack/LoadingOverlay.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import {
LoadingOverlayState,
OpenInCodeSandboxButton,
useSandpack,
} from '@codesandbox/sandpack-react';
} from '@codesandbox/sandpack-react/unstyled';
import {useEffect} from 'react';

const FADE_ANIMATION_DURATION = 200;
Expand Down
2 changes: 1 addition & 1 deletion src/components/MDX/Sandpack/NavigationBar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ import {
FileTabs,
useSandpack,
useSandpackNavigation,
} from '@codesandbox/sandpack-react';
} from '@codesandbox/sandpack-react/unstyled';
import {OpenInCodeSandboxButton} from './OpenInCodeSandboxButton';
import {ResetButton} from './ResetButton';
import {DownloadButton} from './DownloadButton';
Expand Down
2 changes: 1 addition & 1 deletion src/components/MDX/Sandpack/OpenInCodeSandboxButton.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* Copyright (c) Facebook, Inc. and its affiliates.
*/

import {UnstyledOpenInCodeSandboxButton} from '@codesandbox/sandpack-react';
import {UnstyledOpenInCodeSandboxButton} from '@codesandbox/sandpack-react/unstyled';
import {IconNewPage} from '../../Icon/IconNewPage';

export const OpenInCodeSandboxButton = () => {
Expand Down
17 changes: 2 additions & 15 deletions src/components/MDX/Sandpack/Preview.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@

/* eslint-disable react-hooks/exhaustive-deps */
import {useRef, useState, useEffect, useMemo, useId} from 'react';
import {useSandpack, SandpackStack} from '@codesandbox/sandpack-react';
import {useSandpack, SandpackStack} from '@codesandbox/sandpack-react/unstyled';
import cn from 'classnames';
import {ErrorMessage} from './ErrorMessage';
import {SandpackConsole} from './Console';
Expand Down Expand Up @@ -42,14 +42,7 @@ export function Preview({
null
);

let {
error: rawError,
registerBundler,
unregisterBundler,
errorScreenRegisteredRef,
openInCSBRegisteredRef,
loadingScreenRegisteredRef,
} = sandpack;
let {error: rawError, registerBundler, unregisterBundler} = sandpack;

if (
rawError &&
Expand Down Expand Up @@ -88,12 +81,6 @@ export function Preview({
const clientId = useId();
const iframeRef = useRef<HTMLIFrameElement | null>(null);

// SandpackPreview immediately registers the custom screens/components so the bundler does not render any of them
// TODO: why are we doing this during render?
openInCSBRegisteredRef.current = true;
errorScreenRegisteredRef.current = true;
loadingScreenRegisteredRef.current = true;

const sandpackIdle = sandpack.status === 'idle';

useEffect(function createBundler() {
Expand Down
15 changes: 4 additions & 11 deletions src/components/MDX/Sandpack/SandpackRoot.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,9 @@
* Copyright (c) Facebook, Inc. and its affiliates.
*/

import {Children, useState} from 'react';
import {Children} from 'react';
import * as React from 'react';
import {SandpackProvider} from '@codesandbox/sandpack-react';
import {SandpackProvider} from '@codesandbox/sandpack-react/unstyled';
import {SandpackLogLevel} from '@codesandbox/sandpack-client';
import {CustomPreset} from './CustomPreset';
import {createFileMap} from './createFileMap';
Expand All @@ -13,7 +13,6 @@ import {CustomTheme} from './Themes';
type SandpackProps = {
children: React.ReactNode;
autorun?: boolean;
showDevTools?: boolean;
};

const sandboxStyle = `
Expand Down Expand Up @@ -67,8 +66,7 @@ ul {
`.trim();

function SandpackRoot(props: SandpackProps) {
let {children, autorun = true, showDevTools = false} = props;
const [devToolsLoaded, setDevToolsLoaded] = useState(false);
let {children, autorun = true} = props;
const codeSnippets = Children.toArray(children) as React.ReactElement[];
const files = createFileMap(codeSnippets);

Expand All @@ -90,12 +88,7 @@ function SandpackRoot(props: SandpackProps) {
bundlerURL: 'https://1e4ad8f7.sandpack-bundler-4bw.pages.dev',
logLevel: SandpackLogLevel.None,
}}>
<CustomPreset
showDevTools={showDevTools}
onDevToolsLoad={() => setDevToolsLoaded(true)}
devToolsLoaded={devToolsLoaded}
providedFiles={Object.keys(files)}
/>
<CustomPreset providedFiles={Object.keys(files)} />
</SandpackProvider>
</div>
);
Expand Down
2 changes: 1 addition & 1 deletion src/components/MDX/Sandpack/createFileMap.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* Copyright (c) Facebook, Inc. and its affiliates.
*/

import type {SandpackFile} from '@codesandbox/sandpack-react';
import type {SandpackFile} from '@codesandbox/sandpack-react/unstyled';

export const createFileMap = (codeSnippets: any) => {
return codeSnippets.reduce(
Expand Down
Loading

0 comments on commit 63b75d7

Please sign in to comment.