From c9369f47dc034016255dedcf8bde39410b60adbd Mon Sep 17 00:00:00 2001 From: Szymon Rybczak Date: Tue, 20 Feb 2024 19:58:18 +0100 Subject: [PATCH 1/8] feat(conferences): add React Universe Conf 2024 (#6649) --- src/content/community/conferences.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/content/community/conferences.md b/src/content/community/conferences.md index 8d137021..7d79c733 100644 --- a/src/content/community/conferences.md +++ b/src/content/community/conferences.md @@ -10,6 +10,11 @@ Do you know of a local React.js conference? Add it here! (Please keep the list c ## Upcoming Conferences {/*upcoming-conferences*/} +### React Universe Conf 2024 {/*react-universe-conf-2024*/} +September 5-6, 2024. Wrocław, Poland. + +[Website](https://www.reactuniverseconf.com/) - [Twitter](https://twitter.com/react_native_eu) - [LinkedIn](https://www.linkedin.com/events/reactuniverseconf7163919537074118657/) + ### React Paris 2024 {/*react-paris-2024*/} March 22, 2024. In-person in Paris, France + Remote (hybrid) From e16634aaaa72d7d7dc8e6072611bd41258c7469c Mon Sep 17 00:00:00 2001 From: Sebastian Silbermann Date: Tue, 20 Feb 2024 21:13:33 +0100 Subject: [PATCH 2/8] Add options to call signature of react-dom/server legacy APIs (#6477) * Update renderToNodeStream.md * Update renderToStaticMarkup.md * Update renderToStaticNodeStream.md * Update renderToString.md --- src/content/reference/react-dom/server/renderToNodeStream.md | 4 ++-- .../reference/react-dom/server/renderToStaticMarkup.md | 4 ++-- .../reference/react-dom/server/renderToStaticNodeStream.md | 4 ++-- src/content/reference/react-dom/server/renderToString.md | 4 ++-- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/content/reference/react-dom/server/renderToNodeStream.md b/src/content/reference/react-dom/server/renderToNodeStream.md index fd2464b9..aa2c2e8f 100644 --- a/src/content/reference/react-dom/server/renderToNodeStream.md +++ b/src/content/reference/react-dom/server/renderToNodeStream.md @@ -13,7 +13,7 @@ This API will be removed in a future major version of React. Use [`renderToPipea `renderToNodeStream` renders a React tree to a [Node.js Readable Stream.](https://nodejs.org/api/stream.html#readable-streams) ```js -const stream = renderToNodeStream(reactNode) +const stream = renderToNodeStream(reactNode, options?) ``` @@ -24,7 +24,7 @@ const stream = renderToNodeStream(reactNode) ## Reference {/*reference*/} -### `renderToNodeStream(reactNode)` {/*rendertonodestream*/} +### `renderToNodeStream(reactNode, options?)` {/*rendertonodestream*/} On the server, call `renderToNodeStream` to get a [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams) which you can pipe into the response. diff --git a/src/content/reference/react-dom/server/renderToStaticMarkup.md b/src/content/reference/react-dom/server/renderToStaticMarkup.md index 607affd9..2b9178d5 100644 --- a/src/content/reference/react-dom/server/renderToStaticMarkup.md +++ b/src/content/reference/react-dom/server/renderToStaticMarkup.md @@ -7,7 +7,7 @@ title: renderToStaticMarkup `renderToStaticMarkup` renders a non-interactive React tree to an HTML string. ```js -const html = renderToStaticMarkup(reactNode) +const html = renderToStaticMarkup(reactNode, options?) ``` @@ -18,7 +18,7 @@ const html = renderToStaticMarkup(reactNode) ## Reference {/*reference*/} -### `renderToStaticMarkup(reactNode)` {/*rendertostaticmarkup*/} +### `renderToStaticMarkup(reactNode, options?)` {/*rendertostaticmarkup*/} On the server, call `renderToStaticMarkup` to render your app to HTML. diff --git a/src/content/reference/react-dom/server/renderToStaticNodeStream.md b/src/content/reference/react-dom/server/renderToStaticNodeStream.md index 47ef74c3..f12b6da2 100644 --- a/src/content/reference/react-dom/server/renderToStaticNodeStream.md +++ b/src/content/reference/react-dom/server/renderToStaticNodeStream.md @@ -7,7 +7,7 @@ title: renderToStaticNodeStream `renderToStaticNodeStream` renders a non-interactive React tree to a [Node.js Readable Stream.](https://nodejs.org/api/stream.html#readable-streams) ```js -const stream = renderToStaticNodeStream(reactNode) +const stream = renderToStaticNodeStream(reactNode, options?) ``` @@ -18,7 +18,7 @@ const stream = renderToStaticNodeStream(reactNode) ## Reference {/*reference*/} -### `renderToStaticNodeStream(reactNode)` {/*rendertostaticnodestream*/} +### `renderToStaticNodeStream(reactNode, options?)` {/*rendertostaticnodestream*/} On the server, call `renderToStaticNodeStream` to get a [Node.js Readable Stream](https://nodejs.org/api/stream.html#readable-streams). diff --git a/src/content/reference/react-dom/server/renderToString.md b/src/content/reference/react-dom/server/renderToString.md index e1269294..d9f1bdba 100644 --- a/src/content/reference/react-dom/server/renderToString.md +++ b/src/content/reference/react-dom/server/renderToString.md @@ -13,7 +13,7 @@ title: renderToString `renderToString` renders a React tree to an HTML string. ```js -const html = renderToString(reactNode) +const html = renderToString(reactNode, options?) ``` @@ -24,7 +24,7 @@ const html = renderToString(reactNode) ## Reference {/*reference*/} -### `renderToString(reactNode)` {/*rendertostring*/} +### `renderToString(reactNode, options?)` {/*rendertostring*/} On the server, call `renderToString` to render your app to HTML. From af289c30900d3515f916eca4ca98c4253f5bc1d2 Mon Sep 17 00:00:00 2001 From: Joseph Savona Date: Tue, 20 Feb 2024 14:30:08 -0800 Subject: [PATCH 3/8] Update team page (#6652) --- src/content/community/team.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/community/team.md b/src/content/community/team.md index 0c6c63a8..9ef95d64 100644 --- a/src/content/community/team.md +++ b/src/content/community/team.md @@ -22,7 +22,7 @@ Current members of the React team are listed in alphabetical order below. Andrey started his career as a designer and then gradually transitioned into web development. After joining the React Data team at Meta he worked on adding an incremental JavaScript compiler to Relay, and then later on, worked on removing the same compiler from Relay. Outside of work, Andrey likes to play music and engage in various sports. - + Dan got into programming after he accidentally discovered Visual Basic inside Microsoft PowerPoint. He has found his true calling in turning [Sebastian](#sebastian-markbåge)'s tweets into long-form blog posts. Dan occasionally wins at Fortnite by hiding in a bush until the game ends. From 5398b47260cb47baf1edcf5f6634e30b5014015f Mon Sep 17 00:00:00 2001 From: Victoria Quirante Date: Wed, 21 Feb 2024 12:23:59 +0100 Subject: [PATCH 4/8] Add React Alicante to conferences.md (#6655) --- src/content/community/conferences.md | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/src/content/community/conferences.md b/src/content/community/conferences.md index 7d79c733..44e5e4fc 100644 --- a/src/content/community/conferences.md +++ b/src/content/community/conferences.md @@ -10,11 +10,6 @@ Do you know of a local React.js conference? Add it here! (Please keep the list c ## Upcoming Conferences {/*upcoming-conferences*/} -### React Universe Conf 2024 {/*react-universe-conf-2024*/} -September 5-6, 2024. Wrocław, Poland. - -[Website](https://www.reactuniverseconf.com/) - [Twitter](https://twitter.com/react_native_eu) - [LinkedIn](https://www.linkedin.com/events/reactuniverseconf7163919537074118657/) - ### React Paris 2024 {/*react-paris-2024*/} March 22, 2024. In-person in Paris, France + Remote (hybrid) @@ -75,6 +70,16 @@ July 17-19, 2024. In-person in Portland, OR, USA [Website](https://chainreactconf.com) - [Twitter](https://twitter.com/ChainReactConf) +### React Universe Conf 2024 {/*react-universe-conf-2024*/} +September 5-6, 2024. Wrocław, Poland. + +[Website](https://www.reactuniverseconf.com/) - [Twitter](https://twitter.com/react_native_eu) - [LinkedIn](https://www.linkedin.com/events/reactuniverseconf7163919537074118657/) + +### React Alicante 2024 {/*react-alicante-2024*/} +September 19-21, 2024. Alicante, Spain. + +[Website](https://reactalicante.es/) - [Twitter](https://twitter.com/ReactAlicante) - [YouTube](https://www.youtube.com/channel/UCaSdUaITU1Cz6PvC97A7e0w) + ### React India 2024 {/*react-india-2024*/} October 17 - 19, 2024. In-person in Goa, India (hybrid event) + Oct 15 2024 - remote day From 93aec2784b26e0b0a69cb587fd59e35554afb774 Mon Sep 17 00:00:00 2001 From: Tomasz Wysocki <121371814+tomaszwysocki@users.noreply.github.com> Date: Wed, 21 Feb 2024 16:02:51 +0100 Subject: [PATCH 5/8] Remove redundant suggestion (#6643) Removed the redundant alternative state management suggestion. The documentation already emphasizes the elimination of duplication by advising to hold the selected ID in state, making the alternative suggestion unnecessary. --- src/content/learn/choosing-the-state-structure.md | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/content/learn/choosing-the-state-structure.md b/src/content/learn/choosing-the-state-structure.md index c3218589..5be2b4d3 100644 --- a/src/content/learn/choosing-the-state-structure.md +++ b/src/content/learn/choosing-the-state-structure.md @@ -554,8 +554,6 @@ button { margin-top: 10px; } -(Alternatively, you may hold the selected index in state.) - The state used to be duplicated like this: * `items = [{ id: 0, title: 'pretzels'}, ...]` From 2ad51d921bb78c0a79998f92061f9d63c0a8cf21 Mon Sep 17 00:00:00 2001 From: Sahil Mhapsekar Date: Fri, 23 Feb 2024 10:29:02 +0530 Subject: [PATCH 6/8] feat(conferences): add The GeekConf 2024 (#6654) --- src/content/community/conferences.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/content/community/conferences.md b/src/content/community/conferences.md index 44e5e4fc..a28d6084 100644 --- a/src/content/community/conferences.md +++ b/src/content/community/conferences.md @@ -70,6 +70,11 @@ July 17-19, 2024. In-person in Portland, OR, USA [Website](https://chainreactconf.com) - [Twitter](https://twitter.com/ChainReactConf) +### The Geek Conf 2024 {/*the-geek-conf-2024*/} +July 25, 2024. In-person in Berlin, Germany + remote (hybrid event) + +[Website](https://thegeekconf.com) - [Twitter](https://twitter.com/thegeekconf) + ### React Universe Conf 2024 {/*react-universe-conf-2024*/} September 5-6, 2024. Wrocław, Poland. @@ -80,6 +85,7 @@ September 19-21, 2024. Alicante, Spain. [Website](https://reactalicante.es/) - [Twitter](https://twitter.com/ReactAlicante) - [YouTube](https://www.youtube.com/channel/UCaSdUaITU1Cz6PvC97A7e0w) + ### React India 2024 {/*react-india-2024*/} October 17 - 19, 2024. In-person in Goa, India (hybrid event) + Oct 15 2024 - remote day From a853e69261022734c238fd2199a90f23d1548c95 Mon Sep 17 00:00:00 2001 From: Ricky Date: Sat, 24 Feb 2024 10:35:53 -0500 Subject: [PATCH 7/8] Remove useMemo from useFormStatus example (#6658) * Remove useMemo from useFormStatus example * nits --- .../react-dom/hooks/useFormStatus.md | 57 +++++++++---------- 1 file changed, 28 insertions(+), 29 deletions(-) diff --git a/src/content/reference/react-dom/hooks/useFormStatus.md b/src/content/reference/react-dom/hooks/useFormStatus.md index 8733ec0c..70feceae 100644 --- a/src/content/reference/react-dom/hooks/useFormStatus.md +++ b/src/content/reference/react-dom/hooks/useFormStatus.md @@ -182,36 +182,16 @@ import {useFormStatus} from 'react-dom'; export default function UsernameForm() { const {pending, data} = useFormStatus(); - const [showSubmitted, setShowSubmitted] = useState(false); - const submittedUsername = useRef(null); - const timeoutId = useRef(null); - - useMemo(() => { - if (pending) { - submittedUsername.current = data?.get('username'); - if (timeoutId.current != null) { - clearTimeout(timeoutId.current); - } - - timeoutId.current = setTimeout(() => { - timeoutId.current = null; - setShowSubmitted(false); - }, 2000); - setShowSubmitted(true); - } - }, [pending, data]); - return ( - <> -
- +
+

Request a Username:

+ - {showSubmitted ? ( -

Submitted request for username: {submittedUsername.current}

- ) : null} - +
+

{data ? `Requesting ${data?.get("username")}...`: ''}

+
); } ``` @@ -219,10 +199,15 @@ export default function UsernameForm() { ```js src/App.js import UsernameForm from './UsernameForm'; import { submitForm } from "./actions.js"; +import {useRef} from 'react'; export default function App() { + const ref = useRef(null); return ( -
+ { + await submitForm(formData); + ref.current.reset(); + }}> ); @@ -231,8 +216,22 @@ export default function App() { ```js src/actions.js hidden export async function submitForm(query) { - await new Promise((res) => setTimeout(res, 1000)); + await new Promise((res) => setTimeout(res, 2000)); +} +``` + +```css +p { + height: 14px; + padding: 0; + margin: 2px 0 0 0 ; + font-size: 14px +} + +button { + margin-left: 2px; } + ``` ```json package.json hidden From 081d1008dd1eebffb9550a3ff623860a7d977acf Mon Sep 17 00:00:00 2001 From: Danilo Woznica Date: Sat, 24 Feb 2024 16:11:15 +0000 Subject: [PATCH 8/8] fix(sandpack): clear up bundler timeout when there's a syntax error (#6659) * fix: Update @codesandbox/sandpack-react version to 2.13.1 * fix: Updated the bundlerURL to use a new URL --- package.json | 2 +- src/components/MDX/Sandpack/SandpackRoot.tsx | 2 +- yarn.lock | 50 +++++++++----------- 3 files changed, 24 insertions(+), 30 deletions(-) diff --git a/package.json b/package.json index f75ffbb2..274c2506 100644 --- a/package.json +++ b/package.json @@ -22,7 +22,7 @@ "check-all": "npm-run-all prettier lint:fix tsc" }, "dependencies": { - "@codesandbox/sandpack-react": "2.6.0", + "@codesandbox/sandpack-react": "2.13.1", "@docsearch/css": "3.0.0-alpha.41", "@docsearch/react": "3.0.0-alpha.41", "@headlessui/react": "^1.7.0", diff --git a/src/components/MDX/Sandpack/SandpackRoot.tsx b/src/components/MDX/Sandpack/SandpackRoot.tsx index d47fd903..a47fa686 100644 --- a/src/components/MDX/Sandpack/SandpackRoot.tsx +++ b/src/components/MDX/Sandpack/SandpackRoot.tsx @@ -88,7 +88,7 @@ function SandpackRoot(props: SandpackProps) { autorun, initMode: 'user-visible', initModeObserverOptions: {rootMargin: '1400px 0px'}, - bundlerURL: 'https://1e4ad8f7.sandpack-bundler-4bw.pages.dev', + bundlerURL: 'https://786946de.sandpack-bundler-4bw.pages.dev', logLevel: SandpackLogLevel.None, }}> diff --git a/yarn.lock b/yarn.lock index f7d63ee5..8b4000ce 100644 --- a/yarn.lock +++ b/yarn.lock @@ -611,29 +611,29 @@ style-mod "^4.0.0" w3c-keyname "^2.2.4" -"@codesandbox/nodebox@0.1.4": - version "0.1.4" - resolved "https://registry.yarnpkg.com/@codesandbox/nodebox/-/nodebox-0.1.4.tgz#1c9ed4caf6cda764500aec3d46b245e2e9b88ccc" - integrity sha512-+MR7JibjGjTRDmyQbL8Mliej6wakQP7q99+wGL/nOzd0Q3s+YWGQfv0QpYKbdMClKUTFJGvwzwOeqHVTkpWNCQ== +"@codesandbox/nodebox@0.1.8": + version "0.1.8" + resolved "https://registry.yarnpkg.com/@codesandbox/nodebox/-/nodebox-0.1.8.tgz#2dc701005cedefac386f17a69a4c9a4f38c2325d" + integrity sha512-2VRS6JDSk+M+pg56GA6CryyUSGPjBEe8Pnae0QL3jJF1mJZJVMDKr93gJRtBbLkfZN6LD/DwMtf+2L0bpWrjqg== dependencies: - outvariant "^1.3.0" + outvariant "^1.4.0" strict-event-emitter "^0.4.3" -"@codesandbox/sandpack-client@^2.6.0": - version "2.6.0" - resolved "https://registry.yarnpkg.com/@codesandbox/sandpack-client/-/sandpack-client-2.6.0.tgz#a266ac49843a0c3263ac065daaba473cb9565193" - integrity sha512-JFCe+MU+5E+nXazrNK1uS/zLV5l4UNkYQx7AjF9sJ5ZmUlshz1HRDiK/Tdp6W+3ahcSERF3dcYPCf46LJF8Yvw== +"@codesandbox/sandpack-client@^2.13.0": + version "2.13.0" + resolved "https://registry.yarnpkg.com/@codesandbox/sandpack-client/-/sandpack-client-2.13.0.tgz#c4e12628a3aceb4a2c99c501bea691b4276eab27" + integrity sha512-1rOLj9wkbBd3RV6/zRq+IV52egy22RQMKDTtdR+lQzy87uj0tlbYjAwtUZSjkioHlj6U8Y82uWLf71nvFIxE0g== dependencies: - "@codesandbox/nodebox" "0.1.4" + "@codesandbox/nodebox" "0.1.8" buffer "^6.0.3" dequal "^2.0.2" - outvariant "1.3.0" + outvariant "1.4.0" static-browser-server "1.0.3" -"@codesandbox/sandpack-react@2.6.0": - version "2.6.0" - resolved "https://registry.yarnpkg.com/@codesandbox/sandpack-react/-/sandpack-react-2.6.0.tgz#2c2d98b50c9db462a32831071de7e5e710d000c2" - integrity sha512-zSeJXzaVt96aIFfkyr+bMKBjV2k3hVcX+j1+aBRIOCpHhTrbszPesUmcE3yNTzGqqQfX/JnIJNRmeqFKmSLjTQ== +"@codesandbox/sandpack-react@2.13.1": + version "2.13.1" + resolved "https://registry.yarnpkg.com/@codesandbox/sandpack-react/-/sandpack-react-2.13.1.tgz#ba69a227d0c5157bb48685a02fefc0baa83bdc09" + integrity sha512-R8oGO4QHHWTyA7r6NWHtBakizgX+rl/Rc6cbQunXGNm4vV/lqqU4NS+MVp2rXA+c8DifOLi1wA2wUZUN//Z9bw== dependencies: "@codemirror/autocomplete" "^6.4.0" "@codemirror/commands" "^6.1.3" @@ -643,13 +643,12 @@ "@codemirror/language" "^6.3.2" "@codemirror/state" "^6.2.0" "@codemirror/view" "^6.7.1" - "@codesandbox/sandpack-client" "^2.6.0" + "@codesandbox/sandpack-client" "^2.13.0" "@lezer/highlight" "^1.1.3" "@react-hook/intersection-observer" "^3.1.1" "@stitches/core" "^1.2.6" anser "^2.1.1" clean-set "^1.1.2" - codesandbox-import-util-types "^2.2.3" dequal "^2.0.2" escape-carriage "^1.3.1" lz-string "^1.4.4" @@ -1769,11 +1768,6 @@ client-only@0.0.1: resolved "https://registry.yarnpkg.com/client-only/-/client-only-0.0.1.tgz#38bba5d403c41ab150bff64a95c85013cf73bca1" integrity sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA== -codesandbox-import-util-types@^2.2.3: - version "2.2.3" - resolved "https://registry.yarnpkg.com/codesandbox-import-util-types/-/codesandbox-import-util-types-2.2.3.tgz#b354b2f732ad130e119ebd9ead3bda3be5981a54" - integrity sha512-Qj00p60oNExthP2oR3vvXmUGjukij+rxJGuiaKM6tyUmSyimdZsqHI/TUvFFClAffk9s7hxGnQgWQ8KCce27qQ== - collapse-white-space@^1.0.2: version "1.0.6" resolved "https://registry.yarnpkg.com/collapse-white-space/-/collapse-white-space-1.0.6.tgz#e63629c0016665792060dbbeb79c42239d2c5287" @@ -4635,16 +4629,16 @@ os-tmpdir@~1.0.2: resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274" integrity sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ= -outvariant@1.3.0: - version "1.3.0" - resolved "https://registry.yarnpkg.com/outvariant/-/outvariant-1.3.0.tgz#c39723b1d2cba729c930b74bf962317a81b9b1c9" - integrity sha512-yeWM9k6UPfG/nzxdaPlJkB2p08hCg4xP6Lx99F+vP8YF7xyZVfTmJjrrNalkmzudD4WFvNLVudQikqUmF8zhVQ== - -outvariant@^1.3.0: +outvariant@1.4.0, outvariant@^1.3.0: version "1.4.0" resolved "https://registry.yarnpkg.com/outvariant/-/outvariant-1.4.0.tgz#e742e4bda77692da3eca698ef5bfac62d9fba06e" integrity sha512-AlWY719RF02ujitly7Kk/0QlV+pXGFDHrHf9O2OKqyqgBieaPOIeuSkL8sRK6j2WK+/ZAURq2kZsY0d8JapUiw== +outvariant@^1.4.0: + version "1.4.2" + resolved "https://registry.yarnpkg.com/outvariant/-/outvariant-1.4.2.tgz#f54f19240eeb7f15b28263d5147405752d8e2066" + integrity sha512-Ou3dJ6bA/UJ5GVHxah4LnqDwZRwAmWxrG3wtrHrbGnP4RnLCtA64A4F+ae7Y8ww660JaddSoArUR5HjipWSHAQ== + p-limit@^1.1.0: version "1.3.0" resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.3.0.tgz#b86bd5f0c25690911c7590fcbfc2010d54b3ccb8"