Skip to content

Commit 56153ae

Browse files
react-translations-botreact-translations-bot
committed
Merge branch 'main' of https://github.com/reactjs/react.dev into sync-819518cf
2 parents 760be6d + 819518c commit 56153ae

File tree

117 files changed

+1927
-965
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

117 files changed

+1927
-965
lines changed

‎.eslintrc

+2-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@
55
"plugins": ["@typescript-eslint"],
66
"rules": {
77
"no-unused-vars": "off",
8-
"@typescript-eslint/no-unused-vars": "warn"
8+
"@typescript-eslint/no-unused-vars": ["error", { "varsIgnorePattern": "^_" }],
9+
"react-hooks/exhaustive-deps": "error"
910
},
1011
"env": {
1112
"node": true,

‎.github/workflows/analyze.yml

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ jobs:
1616
- name: Set up node
1717
uses: actions/setup-node@v1
1818
with:
19-
node-version: "14.x"
19+
node-version: '20.x'
2020

2121
- name: Install dependencies
2222
uses: bahmutov/[email protected]
@@ -38,7 +38,7 @@ jobs:
3838
# Here's the first place where next-bundle-analysis' own script is used
3939
# This step pulls the raw bundle stats for the current bundle
4040
- name: Analyze bundle
41-
run: npx -p nextjs-bundle-analysis report
41+
run: npx -p nextjs-bundle-analysis@0.5.0 report
4242

4343
- name: Upload bundle
4444
uses: actions/upload-artifact@v2

‎.github/workflows/analyze_comment.yml

+5-22
Original file line numberDiff line numberDiff line change
@@ -47,26 +47,9 @@ jobs:
4747
pr_number=$(cat pr_number/pr_number)
4848
echo "pr-number=$pr_number" >> $GITHUB_OUTPUT
4949
50-
- name: Find Comment
51-
uses: peter-evans/find-comment@v1
52-
if: success()
53-
id: fc
54-
with:
55-
issue-number: ${{ steps.get-comment-body.outputs.pr-number }}
56-
body-includes: "<!-- __NEXTJS_BUNDLE -->"
57-
58-
- name: Create Comment
59-
uses: peter-evans/[email protected]
60-
if: success() && steps.fc.outputs.comment-id == 0
61-
with:
62-
issue-number: ${{ steps.get-comment-body.outputs.pr-number }}
63-
body: ${{ steps.get-comment-body.outputs.body }}
64-
65-
- name: Update Comment
66-
uses: peter-evans/[email protected]
67-
if: success() && steps.fc.outputs.comment-id != 0
50+
- name: Comment
51+
uses: marocchino/sticky-pull-request-comment@v2
6852
with:
69-
issue-number: ${{ steps.get-comment-body.outputs.pr-number }}
70-
body: ${{ steps.get-comment-body.outputs.body }}
71-
comment-id: ${{ steps.fc.outputs.comment-id }}
72-
edit-mode: replace
53+
header: next-bundle-analysis
54+
number: ${{ steps.get-comment-body.outputs.pr-number }}
55+
message: ${{ steps.get-comment-body.outputs.body }}

‎.github/workflows/site_lint.yml

+5-5
Original file line numberDiff line numberDiff line change
@@ -11,17 +11,17 @@ jobs:
1111
lint:
1212
runs-on: ubuntu-latest
1313

14-
name: Lint on node 12.x and ubuntu-latest
14+
name: Lint on node 20.x and ubuntu-latest
1515

1616
steps:
1717
- uses: actions/checkout@v1
18-
- name: Use Node.js 12.x
19-
uses: actions/setup-node@v1
18+
- name: Use Node.js 20.x
19+
uses: actions/setup-node@v3
2020
with:
21-
node-version: 12.x
21+
node-version: 20.x
2222

2323
- name: Install deps and build (with cache)
24-
uses: bahmutov/npm-install@v1.7.10
24+
uses: bahmutov/npm-install@v1.8.32
2525

2626
- name: Lint codebase
2727
run: yarn ci-check

‎next.config.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@ const nextConfig = {
99
pageExtensions: ['jsx', 'js', 'ts', 'tsx', 'mdx', 'md'],
1010
reactStrictMode: true,
1111
experimental: {
12-
plugins: true,
12+
// TODO: Remove after https://github.com/vercel/next.js/issues/49355 is fixed
13+
appDir: false,
1314
scrollRestoration: true,
1415
legacyBrowsers: false,
15-
browsersListForSwc: true,
1616
},
1717
env: {
1818
SANDPACK_BARE_COMPONENTS: process.env.SANDPACK_BARE_COMPONENTS,

‎package.json

+5-5
Original file line numberDiff line numberDiff line change
@@ -32,12 +32,12 @@
3232
"debounce": "^1.2.1",
3333
"ga-lite": "^2.1.4",
3434
"github-slugger": "^1.3.0",
35-
"next": "12.3.2-canary.7",
35+
"next": "^13.4.1",
3636
"next-remote-watch": "^1.0.0",
3737
"parse-numeric-range": "^1.2.0",
38-
"react": "0.0.0-experimental-cb5084d1c-20220924",
38+
"react": "^0.0.0-experimental-16d053d59-20230506",
3939
"react-collapsed": "npm:@gaearon/[email protected]",
40-
"react-dom": "0.0.0-experimental-cb5084d1c-20220924",
40+
"react-dom": "^0.0.0-experimental-16d053d59-20230506",
4141
"remark-frontmatter": "^4.0.1",
4242
"remark-gfm": "^3.0.1"
4343
},
@@ -92,13 +92,13 @@
9292
"retext": "^7.0.1",
9393
"retext-smartypants": "^4.0.0",
9494
"rss": "^1.2.2",
95-
"tailwindcss": "^3.0.22",
95+
"tailwindcss": "^3.3.2",
9696
"typescript": "^4.0.2",
9797
"unist-util-visit": "^2.0.3",
9898
"webpack-bundle-analyzer": "^4.5.0"
9999
},
100100
"engines": {
101-
"node": ">=12.x"
101+
"node": "^16.8.0 || ^18.0.0 || ^19.0.0 || ^20.0.0"
102102
},
103103
"nextBundleAnalysis": {
104104
"budget": null,

‎patches/next+12.3.2-canary.7.patch

-22
This file was deleted.

‎patches/next+13.4.1.patch

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
diff --git a/node_modules/next/dist/server/render.js b/node_modules/next/dist/server/render.js
2+
index a1f8648..1b3d608 100644
3+
--- a/node_modules/next/dist/server/render.js
4+
+++ b/node_modules/next/dist/server/render.js
5+
@@ -758,9 +758,14 @@ async function renderToHTML(req, res, pathname, query, renderOpts) {
6+
// Always using react concurrent rendering mode with required react version 18.x
7+
const renderShell = async (EnhancedApp, EnhancedComponent)=>{
8+
const content = renderContent(EnhancedApp, EnhancedComponent);
9+
- return await (0, _nodewebstreamshelper.renderToInitialStream)({
10+
- ReactDOMServer: _serverbrowser.default,
11+
- element: content
12+
+ return new Promise((resolve, reject) => {
13+
+ (0, _nodewebstreamshelper.renderToInitialStream)({
14+
+ ReactDOMServer: _serverbrowser.default,
15+
+ element: content,
16+
+ streamOptions: {
17+
+ onError: reject
18+
+ }
19+
+ }).then(resolve, reject);
20+
});
21+
};
22+
const createBodyResult = (0, _tracer.getTracer)().wrap(_constants2.RenderSpan.createBodyResult, (initialStream, suffix)=>{

‎src/components/Breadcrumbs.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,12 @@ function Breadcrumbs({breadcrumbs}: {breadcrumbs: RouteItem[]}) {
1515
!crumb.skipBreadcrumb && (
1616
<div className="flex mb-3 mt-0.5 items-center" key={i}>
1717
<Fragment key={crumb.path}>
18-
<Link href={crumb.path}>
19-
<a className="text-link dark:text-link-dark text-sm tracking-wide font-bold uppercase mr-1 hover:underline">
20-
{crumb.title}
21-
</a>
18+
<Link
19+
href={crumb.path}
20+
className="text-link dark:text-link-dark text-sm tracking-wide font-bold uppercase me-1 hover:underline">
21+
{crumb.title}
2222
</Link>
23-
<span className="inline-block mr-1 text-link dark:text-link-dark text-lg">
23+
<span className="inline-block me-1 text-link dark:text-link-dark text-lg rtl:rotate-180">
2424
<svg
2525
width="20"
2626
height="20"

‎src/components/ButtonLink.tsx

+8-5
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ function ButtonLink({
2121
label,
2222
target = '_self',
2323
...props
24-
}: JSX.IntrinsicElements['a'] & ButtonLinkProps) {
24+
}: React.AnchorHTMLAttributes<HTMLAnchorElement> & ButtonLinkProps) {
2525
const classes = cn(
2626
className,
2727
'active:scale-[.98] transition-transform inline-flex font-bold items-center outline-none focus:outline-none focus-visible:outline focus-visible:outline-link focus:outline-offset-2 focus-visible:dark:focus:outline-link-dark leading-snug',
@@ -34,10 +34,13 @@ function ButtonLink({
3434
}
3535
);
3636
return (
37-
<NextLink href={href as string}>
38-
<a className={classes} {...props} aria-label={label} target={target}>
39-
{children}
40-
</a>
37+
<NextLink
38+
href={href as string}
39+
className={classes}
40+
{...props}
41+
aria-label={label}
42+
target={target}>
43+
{children}
4144
</NextLink>
4245
);
4346
}

‎src/components/DocsFooter.tsx

+17-18
Original file line numberDiff line numberDiff line change
@@ -66,25 +66,24 @@ function FooterLink({
6666
type: 'Previous' | 'Next';
6767
}) {
6868
return (
69-
<NextLink href={href}>
70-
<a
71-
className={cn(
72-
'flex gap-x-4 md:gap-x-6 items-center w-full md:w-80 px-4 md:px-5 py-6 border-2 border-transparent text-base leading-base text-link dark:text-link-dark rounded-lg group focus:text-link dark:focus:text-link-dark focus:bg-highlight focus:border-link dark:focus:bg-highlight-dark dark:focus:border-link-dark focus:border-opacity-100 focus:border-2 focus:ring-1 focus:ring-offset-4 focus:ring-blue-40 active:ring-0 active:ring-offset-0 hover:bg-gray-5 dark:hover:bg-gray-80',
73-
{
74-
'flex-row-reverse justify-self-end text-right': type === 'Next',
75-
}
76-
)}>
77-
<IconNavArrow
78-
className="text-tertiary dark:text-tertiary-dark inline group-focus:text-link dark:group-focus:text-link-dark"
79-
displayDirection={type === 'Previous' ? 'left' : 'right'}
80-
/>
81-
<span>
82-
<span className="block no-underline text-sm tracking-wide text-secondary dark:text-secondary-dark uppercase font-bold group-focus:text-link dark:group-focus:text-link-dark group-focus:text-opacity-100">
83-
{type}
84-
</span>
85-
<span className="block text-lg group-hover:underline">{title}</span>
69+
<NextLink
70+
href={href}
71+
className={cn(
72+
'flex gap-x-4 md:gap-x-6 items-center w-full md:w-80 px-4 md:px-5 py-6 border-2 border-transparent text-base leading-base text-link dark:text-link-dark rounded-lg group focus:text-link dark:focus:text-link-dark focus:bg-highlight focus:border-link dark:focus:bg-highlight-dark dark:focus:border-link-dark focus:border-opacity-100 focus:border-2 focus:ring-1 focus:ring-offset-4 focus:ring-blue-40 active:ring-0 active:ring-offset-0 hover:bg-gray-5 dark:hover:bg-gray-80',
73+
{
74+
'flex-row-reverse justify-self-end text-end': type === 'Next',
75+
}
76+
)}>
77+
<IconNavArrow
78+
className="text-tertiary dark:text-tertiary-dark inline group-focus:text-link dark:group-focus:text-link-dark"
79+
displayDirection={type === 'Previous' ? 'start' : 'end'}
80+
/>
81+
<span>
82+
<span className="block no-underline text-sm tracking-wide text-secondary dark:text-secondary-dark uppercase font-bold group-focus:text-link dark:group-focus:text-link-dark group-focus:text-opacity-100">
83+
{type}
8684
</span>
87-
</a>
85+
<span className="block text-lg group-hover:underline">{title}</span>
86+
</span>
8887
</NextLink>
8988
);
9089
}

‎src/components/Icon/IconArrow.tsx

+7-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,12 @@ import cn from 'classnames';
77

88
export const IconArrow = memo<
99
JSX.IntrinsicElements['svg'] & {
10-
displayDirection: 'left' | 'right' | 'up' | 'down';
10+
/**
11+
* The direction the arrow should point.
12+
* `start` and `end` are relative to the current locale.
13+
* for example, in LTR, `start` is left and `end` is right.
14+
*/
15+
displayDirection: 'start' | 'end' | 'right' | 'left' | 'up' | 'down';
1116
}
1217
>(function IconArrow({displayDirection, className, ...rest}) {
1318
return (
@@ -20,6 +25,7 @@ export const IconArrow = memo<
2025
{...rest}
2126
className={cn(className, {
2227
'rotate-180': displayDirection === 'right',
28+
'rotate-180 rtl:rotate-0': displayDirection === 'end',
2329
})}>
2430
<path fill="none" d="M0 0h24v24H0z" />
2531
<path d="M7.828 11H20v2H7.828l5.364 5.364-1.414 1.414L4 12l7.778-7.778 1.414 1.414z" />

‎src/components/Icon/IconArrowSmall.tsx

+7-1
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,17 @@ import cn from 'classnames';
77

88
export const IconArrowSmall = memo<
99
JSX.IntrinsicElements['svg'] & {
10-
displayDirection: 'left' | 'right' | 'up' | 'down';
10+
/**
11+
* The direction the arrow should point.
12+
* `start` and `end` are relative to the current locale.
13+
* for example, in LTR, `start` is left and `end` is right.
14+
*/
15+
displayDirection: 'start' | 'end' | 'right' | 'left' | 'up' | 'down';
1116
}
1217
>(function IconArrowSmall({displayDirection, className, ...rest}) {
1318
const classes = cn(className, {
1419
'rotate-180': displayDirection === 'left',
20+
'rotate-180 rtl:rotate-0': displayDirection === 'start',
1521
'rotate-90': displayDirection === 'down',
1622
});
1723
return (

‎src/components/Icon/IconCanary.tsx

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
/*
2+
* Copyright (c) Facebook, Inc. and its affiliates.
3+
*/
4+
5+
import {memo} from 'react';
6+
7+
export const IconCanary = memo<JSX.IntrinsicElements['svg'] & {title?: string}>(
8+
function IconCanary({className, title}) {
9+
return (
10+
<svg
11+
className={className}
12+
width="20px"
13+
height="20px"
14+
viewBox="0 0 20 20"
15+
version="1.1"
16+
xmlns="http://www.w3.org/2000/svg">
17+
{title && <title>{title}</title>}
18+
<g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
19+
<g
20+
id="noun-labs-1201738-(2)"
21+
transform="translate(2, 0)"
22+
fill="currentColor"
23+
fillRule="nonzero">
24+
<path
25+
d="M10.2865804,5.55665262 L10.2865804,2.22331605 L10.8591544,2.22331605 C11.0103911,2.22244799 11.1551447,2.16342155 11.2617505,2.05914367 C11.3684534,1.95486857 11.4282767,1.81370176 11.4282767,1.66667106 L11.4282767,0.556642208 C11.4282767,0.40907262 11.3678934,0.26747526 11.2605218,0.16308627 C11.1531503,0.0587028348 11.0074938,0 10.8556998,0 L5.14338868,0 C4.9915947,0 4.84594391,0.0587028348 4.73856664,0.16308627 C4.63119507,0.267469704 4.57081178,0.40907262 4.57081178,0.556642208 L4.57081178,1.66667106 C4.57081178,1.81434899 4.63119507,1.95594912 4.73856664,2.06033811 C4.8459382,2.16472155 4.9915947,2.22331605 5.14338868,2.22331605 L5.71596273,2.22331605 L5.71596273,5.55665262 C5.71596273,8.38665538 2.97295619,9.88999017 0.651686904,15.5566623 C-0.0957823782,17.360053 -2.00560068,20 7.99951567,20 C18.004632,20 16.0948137,17.3600252 15.3507732,15.5566623 C13.0124432,9.88999017 10.2865804,8.38665538 10.2865804,5.55665262 Z M9.89570197,10.709991 C10.0921412,10.709991 10.2805515,10.7858383 10.4193876,10.9209301 C10.5583466,11.0559135 10.6363652,11.2390693 10.6363652,11.4300417 C10.6363652,11.6210141 10.5583466,11.8040698 10.4193876,11.9391533 C10.2805401,12.0741367 10.0921412,12.1499813 9.89570197,12.1499813 C9.6992627,12.1499813 9.51096673,12.074134 9.37201631,11.9391533 C9.23316875,11.8040615 9.15515307,11.6210141 9.15515307,11.4300417 C9.15515307,11.2390693 9.2331716,11.0559024 9.37201631,10.9209301 C9.57264221,10.7258996 9.61239426,10.709991 9.89570197,10.709991 Z M8.98919546,9.04212824 C9.09790709,9.14792278 9.15884755,9.29158681 9.1585213,9.44110085 C9.15829001,9.59073155 9.09678989,9.73407335 8.98763252,9.83954568 C8.87847514,9.945018 8.73069852,10.0039347 8.57678157,10.0033977 C8.42286747,10.0027392 8.27565088,9.94273467 8.16727355,9.83639845 C8.05900765,9.73006224 7.99873866,9.58628988 7.99963013,9.43664806 C8.00052304,9.28788403 8.0620221,9.14542556 8.17051087,9.04048101 C8.27911107,8.93555591 8.42599335,8.87663641 8.57913312,8.87663641 C8.73291864,8.87665585 8.88047525,8.93622535 8.98919546,9.04212824 Z M7.99965585,17.9999981 C4.91377349,17.9999981 3.29882839,17.7332867 2.51364277,17.4999976 C2.37780966,17.4476975 2.26954376,17.3439641 2.21396931,17.2125528 C2.15838628,17.0811499 2.16006066,16.9334692 2.21876871,16.8033858 C2.6144474,15.5921346 3.14916224,14.4280501 3.81316983,13.3333824 C5.980145,9.82337899 8.22941036,13.8867718 10.0980836,13.8867718 C11.9666996,13.8867718 11.4695868,12.1534924 12.1827971,13.3333824 C12.8511505,14.4269112 13.3916656,15.5896902 13.794259,16.8000524 C13.8533022,16.9322137 13.8537479,17.0822749 13.7952635,17.2147751 C13.7368889,17.3472613 13.6248314,17.4504531 13.4856467,17.5000531 C12.6833967,17.7332867 11.0855382,17.9999981 7.99965585,17.9999981 Z"
26+
id="Shape"></path>
27+
</g>
28+
</g>
29+
</svg>
30+
);
31+
}
32+
);

‎src/components/Icon/IconChevron.tsx

+8-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,12 @@ import cn from 'classnames';
77

88
export const IconChevron = memo<
99
JSX.IntrinsicElements['svg'] & {
10-
displayDirection: 'up' | 'down' | 'left' | 'right';
10+
/**
11+
* The direction the arrow should point.
12+
* `start` and `end` are relative to the current locale.
13+
* for example, in LTR, `start` is left and `end` is right.
14+
*/
15+
displayDirection: 'start' | 'end' | 'right' | 'left' | 'up' | 'down';
1116
}
1217
>(function IconChevron({className, displayDirection}) {
1318
const classes = cn(
@@ -16,6 +21,8 @@ export const IconChevron = memo<
1621
'rotate-90': displayDirection === 'left',
1722
'rotate-180': displayDirection === 'up',
1823
'-rotate-90': displayDirection === 'right',
24+
'rotate-90 rtl:-rotate-90': displayDirection === 'start',
25+
'-rotate-90 rtl:rotate-90': displayDirection === 'end',
1926
},
2027
className
2128
);

‎src/components/Icon/IconNavArrow.tsx

+10-3
Original file line numberDiff line numberDiff line change
@@ -7,15 +7,22 @@ import cn from 'classnames';
77

88
export const IconNavArrow = memo<
99
JSX.IntrinsicElements['svg'] & {
10-
displayDirection: 'right' | 'down' | 'left';
10+
/**
11+
* The direction the arrow should point.
12+
* `start` and `end` are relative to the current locale.
13+
* for example, in LTR, `start` is left and `end` is right.
14+
*/
15+
displayDirection: 'start' | 'end' | 'right' | 'left' | 'down';
1116
}
12-
>(function IconNavArrow({displayDirection = 'right', className}) {
17+
>(function IconNavArrow({displayDirection = 'start', className}) {
1318
const classes = cn(
1419
'duration-100 ease-in transition',
1520
{
1621
'rotate-0': displayDirection === 'down',
17-
'-rotate-90': displayDirection === 'right',
1822
'rotate-90': displayDirection === 'left',
23+
'-rotate-90': displayDirection === 'right',
24+
'rotate-90 rtl:-rotate-90': displayDirection === 'start',
25+
'-rotate-90 rtl:rotate-90': displayDirection === 'end',
1926
},
2027
className
2128
);

0 commit comments

Comments
 (0)