Merge 566e977 into sapling-pr-archive-poteto

Author: poteto

postcss.config.js

@@ -17,4 +17,4 @@ module.exports = {
       },
     },
   },
-}
+};

public/js/jsfiddle-integration-babel.js

@@ -4,12 +4,14 @@
 
 // Do not delete or move this file.
 // Many fiddles reference it so we have to keep it here.
-(function() {
+(function () {
   var tag = document.querySelector(
     'script[type="application/javascript;version=1.7"]'
   );
   if (!tag || tag.textContent.indexOf('window.onload=function(){') !== -1) {
-    alert('Bad JSFiddle configuration, please fork the original React JSFiddle');
+    alert(
+      'Bad JSFiddle configuration, please fork the original React JSFiddle'
+    );
   }
   tag.setAttribute('type', 'text/babel');
   tag.textContent = tag.textContent.replace(/^\/\/<!\[CDATA\[/, '');

public/js/jsfiddle-integration.js

@@ -4,12 +4,14 @@
 
 // Do not delete or move this file.
 // Many fiddles reference it so we have to keep it here.
-(function() {
+(function () {
   var tag = document.querySelector(
     'script[type="application/javascript;version=1.7"]'
   );
   if (!tag || tag.textContent.indexOf('window.onload=function(){') !== -1) {
-    alert('Bad JSFiddle configuration, please fork the original React JSFiddle');
+    alert(
+      'Bad JSFiddle configuration, please fork the original React JSFiddle'
+    );
   }
   tag.setAttribute('type', 'text/jsx;harmony=true');
   tag.textContent = tag.textContent.replace(/^\/\/<!\[CDATA\[/, '');

scripts/headingIDHelpers/walk.js

@@ -2,10 +2,10 @@ const fs = require('fs');
 
 module.exports = function walk(dir) {
   let results = [];
-  /** 
+  /**
    * If the param is a directory we can return the file
    */
-  if(dir.includes('md')){
+  if (dir.includes('md')) {
     return [dir];
   }
   const list = fs.readdirSync(dir);

scripts/headingIdLinter.js

@@ -1,12 +1,12 @@
 const validateHeaderIds = require('./headingIDHelpers/validateHeadingIDs');
 const generateHeadingIds = require('./headingIDHelpers/generateHeadingIDs');
 
-/** 
+/**
  * yarn lint-heading-ids --> Checks all files and causes an error if heading ID is missing
  * yarn lint-heading-ids --fix --> Fixes all markdown file's heading IDs
  * yarn lint-heading-ids path/to/markdown.md --> Checks that particular file for missing heading ID (path can denote a directory or particular file)
  * yarn lint-heading-ids --fix path/to/markdown.md --> Fixes that particular file's markdown IDs (path can denote a directory or particular file)
-*/
+ */
 
 const markdownPaths = process.argv.slice(2);
 if (markdownPaths.includes('--fix')) {

src/components/Layout/Page.tsx

@@ -8,7 +8,7 @@ import {useRouter} from 'next/router';
 import {SidebarNav} from './SidebarNav';
 import {Footer} from './Footer';
 import {Toc} from './Toc';
-// import SocialBanner from '../SocialBanner';
+import SocialBanner from '../SocialBanner';
 import {DocsPageFooter} from 'components/DocsFooter';
 import {Seo} from 'components/Seo';
 import PageHeading from 'components/PageHeading';
@@ -137,7 +137,7 @@ export function Page({
           />
         </Head>
       )}
-      {/*<SocialBanner />*/}
+      <SocialBanner />
       <TopNav
         section={section}
         routeTree={routeTree}

src/components/MDX/ErrorDecoder.tsx

@@ -69,7 +69,7 @@ function parseQueryString(search: string): Array<string | undefined> {
 }
 
 export default function ErrorDecoder() {
-  const {errorMessage} = useErrorDecoderParams();
+  const {errorMessage, errorCode} = useErrorDecoderParams();
   /** error messages that contain %s require reading location.search */
   const hasParams = errorMessage?.includes('%s');
   const [message, setMessage] = useState<React.ReactNode | null>(() =>
@@ -82,23 +82,28 @@ export default function ErrorDecoder() {
     if (errorMessage == null || !hasParams) {
       return;
     }
+    const args = parseQueryString(window.location.search);
+    let message = errorMessage;
+    if (errorCode === '418') {
+      // Hydration errors have a %s for the diff, but we don't add that to the args for security reasons.
+      message = message.replace(/%s$/, '');
 
-    setMessage(
-      urlify(
-        replaceArgs(
-          errorMessage,
-          parseQueryString(window.location.search),
-          '[missing argument]'
-        )
-      )
-    );
+      // Before React 19.1, the error message didn't have an arg, and was always HTML.
+      if (args.length === 0) {
+        args.push('HTML');
+      } else if (args.length === 1 && args[0] === '') {
+        args[0] = 'HTML';
+      }
+    }
+
+    setMessage(urlify(replaceArgs(message, args, '[missing argument]')));
     setIsReady(true);
-  }, [hasParams, errorMessage]);
+  }, [errorCode, hasParams, errorMessage]);
 
   return (
     <code
       className={cn(
-        'block bg-red-100 text-red-600 py-4 px-6 mt-5 rounded-lg',
+        'whitespace-pre-line block bg-red-100 text-red-600 py-4 px-6 mt-5 rounded-lg',
         isReady ? 'opacity-100' : 'opacity-0'
       )}>
       <b>{message}</b>

src/components/MDX/Sandpack/template.ts

@@ -28,8 +28,8 @@ root.render(
           eject: 'react-scripts eject',
         },
         dependencies: {
-          react: '19.0.0-rc-3edc000d-20240926',
-          'react-dom': '19.0.0-rc-3edc000d-20240926',
+          react: '^19.1.0',
+          'react-dom': '^19.1.0',
           'react-scripts': '^5.0.0',
         },
       },

src/components/SocialBanner.tsx

@@ -7,7 +7,7 @@ import {useRef, useEffect} from 'react';
 import cn from 'classnames';
 import {ExternalLink} from './ExternalLink';
 
-const bannerText = 'Stream React Conf on May 15-16.';
+const bannerText = 'Join us for React Conf on Oct 7-8.';
 const bannerLink = 'https://conf.react.dev/';
 const bannerLinkText = 'Learn more.';
 

src/content/blog/index.md

@@ -4,15 +4,15 @@ title: React Blog
 
 <Intro>
 
-This blog is the official source for the updates from the React team. Anything important, including release notes or deprecation notices, will be posted here first. 
+This blog is the official source for the updates from the React team. Anything important, including release notes or deprecation notices, will be posted here first.
 
 You can also follow the [@react.dev](https://bsky.app/profile/react.dev) account on Bluesky, or [@reactjs](https://twitter.com/reactjs) account on Twitter, but you won’t miss anything essential if you only read this blog.
 
 </Intro>
 
 <div className="sm:-mx-5 flex flex-col gap-5 mt-12">
 
-<BlogCard title="Sunsetting Create React App" date="February 13, 2025" url="/blog/2025/02/14/sunsetting-create-react-app">
+<BlogCard title="Sunsetting Create React App" date="February 14, 2025" url="/blog/2025/02/14/sunsetting-create-react-app">
 
 Today, we’re deprecating Create React App for new apps, and encouraging existing apps to migrate to a framework, or to migrate to a build tool like Vite, Parcel, or RSBuild. We’re also providing docs for when a framework isn’t a good fit for your project, you want to build your own framework, or you just want to learn how React works by building a React app from scratch ...