next 15.3.0-canary.4 → 15.3.0-canary.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bin/next +3 -2
- package/dist/bin/next.map +1 -1
- package/dist/build/collect-build-traces.js +1 -1
- package/dist/build/collect-build-traces.js.map +1 -1
- package/dist/build/index.d.ts +1 -1
- package/dist/build/index.js +24 -12
- package/dist/build/index.js.map +1 -1
- package/dist/build/swc/index.js +1 -1
- package/dist/build/webpack-config.js +2 -2
- package/dist/cli/next-build.d.ts +1 -1
- package/dist/cli/next-build.js.map +1 -1
- package/dist/client/app-bootstrap.js +1 -1
- package/dist/client/components/react-dev-overlay/ui/components/code-frame/code-frame.d.ts +1 -1
- package/dist/client/components/react-dev-overlay/ui/components/code-frame/code-frame.js +30 -36
- package/dist/client/components/react-dev-overlay/ui/components/code-frame/code-frame.js.map +1 -1
- package/dist/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.d.ts +8 -0
- package/dist/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.js +90 -0
- package/dist/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.js.map +1 -0
- package/dist/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.d.ts +1 -1
- package/dist/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.js +1 -1
- package/dist/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.js.map +1 -1
- package/dist/client/components/react-dev-overlay/ui/container/runtime-error/index.d.ts +1 -1
- package/dist/client/index.js +1 -1
- package/dist/compiled/next-server/app-page-experimental.runtime.dev.js +3 -3
- package/dist/compiled/next-server/app-page-experimental.runtime.dev.js.map +1 -1
- package/dist/compiled/next-server/app-page.runtime.dev.js +3 -3
- package/dist/compiled/next-server/app-page.runtime.dev.js.map +1 -1
- package/dist/esm/build/collect-build-traces.js +1 -1
- package/dist/esm/build/collect-build-traces.js.map +1 -1
- package/dist/esm/build/index.js +24 -12
- package/dist/esm/build/index.js.map +1 -1
- package/dist/esm/build/swc/index.js +1 -1
- package/dist/esm/build/webpack-config.js +2 -2
- package/dist/esm/client/app-bootstrap.js +1 -1
- package/dist/esm/client/components/react-dev-overlay/ui/components/code-frame/code-frame.js +30 -35
- package/dist/esm/client/components/react-dev-overlay/ui/components/code-frame/code-frame.js.map +1 -1
- package/dist/esm/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.js +58 -0
- package/dist/esm/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.js.map +1 -0
- package/dist/esm/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.js +1 -1
- package/dist/esm/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.js.map +1 -1
- package/dist/esm/client/index.js +1 -1
- package/dist/esm/lib/inline-static-env.js +13 -18
- package/dist/esm/lib/inline-static-env.js.map +1 -1
- package/dist/esm/server/config-schema.js +0 -1
- package/dist/esm/server/config-schema.js.map +1 -1
- package/dist/esm/server/config-shared.js +0 -1
- package/dist/esm/server/config-shared.js.map +1 -1
- package/dist/esm/server/dev/hot-reloader-turbopack.js +1 -1
- package/dist/esm/server/dev/hot-reloader-webpack.js +1 -1
- package/dist/esm/server/lib/app-info-log.js +1 -1
- package/dist/esm/server/lib/start-server.js +1 -1
- package/dist/esm/shared/lib/canary-only.js +1 -1
- package/dist/lib/inline-static-env.d.ts +1 -2
- package/dist/lib/inline-static-env.js +13 -18
- package/dist/lib/inline-static-env.js.map +1 -1
- package/dist/server/config-schema.js +0 -1
- package/dist/server/config-schema.js.map +1 -1
- package/dist/server/config-shared.d.ts +0 -1
- package/dist/server/config-shared.js +0 -1
- package/dist/server/config-shared.js.map +1 -1
- package/dist/server/dev/hot-reloader-turbopack.js +1 -1
- package/dist/server/dev/hot-reloader-webpack.js +1 -1
- package/dist/server/lib/app-info-log.js +1 -1
- package/dist/server/lib/start-server.js +1 -1
- package/dist/shared/lib/canary-only.js +1 -1
- package/dist/telemetry/anonymous-meta.js +1 -1
- package/dist/telemetry/events/session-stopped.js +2 -2
- package/dist/telemetry/events/version.js +2 -2
- package/package.json +15 -15
|
@@ -11,7 +11,7 @@ import { isDeepStrictEqual } from 'util';
|
|
|
11
11
|
import { getDefineEnv } from '../webpack/plugins/define-env-plugin';
|
|
12
12
|
import { getReactCompilerLoader } from '../get-babel-loader-config';
|
|
13
13
|
import { TurbopackInternalError } from '../../shared/lib/turbopack/utils';
|
|
14
|
-
const nextVersion = "15.3.0-canary.
|
|
14
|
+
const nextVersion = "15.3.0-canary.6";
|
|
15
15
|
const ArchName = arch();
|
|
16
16
|
const PlatformName = platform();
|
|
17
17
|
function infoLog(...args) {
|
|
@@ -1527,7 +1527,7 @@ export default async function getBaseWebpackConfig(dir, { buildId, encryptionKey
|
|
|
1527
1527
|
isClient && new CopyFilePlugin({
|
|
1528
1528
|
// file path to build output of `@next/polyfill-nomodule`
|
|
1529
1529
|
filePath: require.resolve('./polyfills/polyfill-nomodule'),
|
|
1530
|
-
cacheKey: "15.3.0-canary.
|
|
1530
|
+
cacheKey: "15.3.0-canary.6",
|
|
1531
1531
|
name: `static/chunks/polyfills${dev ? '' : '-[hash]'}.js`,
|
|
1532
1532
|
minimize: false,
|
|
1533
1533
|
info: {
|
|
@@ -1704,7 +1704,7 @@ export default async function getBaseWebpackConfig(dir, { buildId, encryptionKey
|
|
|
1704
1704
|
// - Next.js location on disk (some loaders use absolute paths and some resolve options depend on absolute paths)
|
|
1705
1705
|
// - Next.js version
|
|
1706
1706
|
// - next.config.js keys that affect compilation
|
|
1707
|
-
version: `${__dirname}|${"15.3.0-canary.
|
|
1707
|
+
version: `${__dirname}|${"15.3.0-canary.6"}|${configVars}`,
|
|
1708
1708
|
cacheDirectory: path.join(distDir, 'cache', 'webpack'),
|
|
1709
1709
|
// For production builds, it's more efficient to compress all cache files together instead of compression each one individually.
|
|
1710
1710
|
// So we disable compression here and allow the build runner to take care of compressing the cache as a whole.
|
|
@@ -1,36 +1,18 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import Anser from 'next/dist/compiled/anser';
|
|
3
|
-
import stripAnsi from 'next/dist/compiled/strip-ansi';
|
|
4
2
|
import { useMemo } from 'react';
|
|
5
3
|
import { HotlinkedText } from '../hot-linked-text';
|
|
6
4
|
import { getFrameSource } from '../../../utils/stack-frame';
|
|
7
5
|
import { useOpenInEditor } from '../../utils/use-open-in-editor';
|
|
8
6
|
import { ExternalIcon } from '../../icons/external';
|
|
9
7
|
import { FileIcon } from '../../icons/file';
|
|
8
|
+
import { formatCodeFrame, groupCodeFrameLines, parseLineNumberFromCodeFrameLine } from './parse-code-frame';
|
|
10
9
|
export function CodeFrame(param) {
|
|
11
10
|
let { stackFrame, codeFrame } = param;
|
|
12
11
|
var _stackFrame_file;
|
|
13
|
-
|
|
14
|
-
const formattedFrame = useMemo(()=>{
|
|
15
|
-
const lines = codeFrame.split(/\r?\n/g);
|
|
16
|
-
// Find the minimum length of leading spaces after `|` in the code frame
|
|
17
|
-
const miniLeadingSpacesLength = lines.map((line)=>/^>? +\d+ +\| [ ]+/.exec(stripAnsi(line)) === null ? null : /^>? +\d+ +\| ( *)/.exec(stripAnsi(line))).filter(Boolean).map((v)=>v.pop()).reduce((c, n)=>isNaN(c) ? n.length : Math.min(c, n.length), NaN);
|
|
18
|
-
// When the minimum length of leading spaces is greater than 1, remove them
|
|
19
|
-
// from the code frame to help the indentation looks better when there's a lot leading spaces.
|
|
20
|
-
if (miniLeadingSpacesLength > 1) {
|
|
21
|
-
return lines.map((line, a)=>~(a = line.indexOf('|')) ? line.substring(0, a) + line.substring(a).replace("^\\ {" + miniLeadingSpacesLength + "}", '') : line).join('\n');
|
|
22
|
-
}
|
|
23
|
-
return lines.join('\n');
|
|
24
|
-
}, [
|
|
12
|
+
const formattedFrame = useMemo(()=>formatCodeFrame(codeFrame), [
|
|
25
13
|
codeFrame
|
|
26
14
|
]);
|
|
27
|
-
const
|
|
28
|
-
return Anser.ansiToJson(formattedFrame, {
|
|
29
|
-
json: true,
|
|
30
|
-
use_classes: true,
|
|
31
|
-
remove_empty: true
|
|
32
|
-
});
|
|
33
|
-
}, [
|
|
15
|
+
const decodedLines = useMemo(()=>groupCodeFrameLines(formattedFrame), [
|
|
34
16
|
formattedFrame
|
|
35
17
|
]);
|
|
36
18
|
const open = useOpenInEditor({
|
|
@@ -83,23 +65,36 @@ export function CodeFrame(param) {
|
|
|
83
65
|
}),
|
|
84
66
|
/*#__PURE__*/ _jsx("pre", {
|
|
85
67
|
className: "code-frame-pre",
|
|
86
|
-
children:
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
children: entry
|
|
98
|
-
|
|
68
|
+
children: decodedLines.map((line, lineIndex)=>{
|
|
69
|
+
const { lineNumber, isErroredLine } = parseLineNumberFromCodeFrameLine(line, stackFrame);
|
|
70
|
+
const lineNumberProps = {};
|
|
71
|
+
if (lineNumber) {
|
|
72
|
+
lineNumberProps['data-nextjs-codeframe-line'] = lineNumber;
|
|
73
|
+
}
|
|
74
|
+
if (isErroredLine) {
|
|
75
|
+
lineNumberProps['data-nextjs-codeframe-line--errored'] = true;
|
|
76
|
+
}
|
|
77
|
+
return /*#__PURE__*/ _jsx("div", {
|
|
78
|
+
...lineNumberProps,
|
|
79
|
+
children: line.map((entry, entryIndex)=>/*#__PURE__*/ _jsx("span", {
|
|
80
|
+
style: {
|
|
81
|
+
color: entry.fg ? "var(--color-" + entry.fg + ")" : undefined,
|
|
82
|
+
...entry.decoration === 'bold' ? // having longer width than expected on Geist Mono font-weight
|
|
83
|
+
// above 600, hence a temporary fix is to use 500 for bold.
|
|
84
|
+
{
|
|
85
|
+
fontWeight: 500
|
|
86
|
+
} : entry.decoration === 'italic' ? {
|
|
87
|
+
fontStyle: 'italic'
|
|
88
|
+
} : undefined
|
|
89
|
+
},
|
|
90
|
+
children: entry.content
|
|
91
|
+
}, "frame-" + entryIndex))
|
|
92
|
+
}, "line-" + lineIndex);
|
|
93
|
+
})
|
|
99
94
|
})
|
|
100
95
|
]
|
|
101
96
|
});
|
|
102
97
|
}
|
|
103
|
-
export const CODE_FRAME_STYLES =
|
|
98
|
+
export const CODE_FRAME_STYLES = '\n [data-nextjs-codeframe] {\n --code-frame-padding: 12px;\n --code-frame-line-height: var(--size-16);\n background-color: var(--color-background-200);\n overflow: hidden;\n color: var(--color-gray-1000);\n text-overflow: ellipsis;\n border: 1px solid var(--color-gray-400);\n border-radius: 8px;\n font-family: var(--font-stack-monospace);\n font-size: var(--size-12);\n line-height: var(--code-frame-line-height);\n margin: 8px 0;\n\n svg {\n width: var(--size-16);\n height: var(--size-16);\n }\n }\n\n .code-frame-link,\n .code-frame-pre {\n padding: var(--code-frame-padding);\n }\n\n .code-frame-link svg {\n flex-shrink: 0;\n }\n\n .code-frame-link [data-text] {\n display: inline-flex;\n text-align: left;\n margin: auto 6px;\n }\n\n .code-frame-pre {\n white-space: pre-wrap;\n }\n\n .code-frame-header {\n width: 100%;\n transition: background 100ms ease-out;\n border-radius: 8px 8px 0 0;\n border-bottom: 1px solid var(--color-gray-400);\n }\n\n [data-with-open-in-editor-link-source-file] {\n padding: 4px;\n margin: -4px 0 -4px auto;\n border-radius: var(--rounded-full);\n margin-left: auto;\n\n &:focus-visible {\n outline: var(--focus-ring);\n outline-offset: -2px;\n }\n\n &:hover {\n background: var(--color-gray-100);\n }\n }\n\n [data-nextjs-codeframe]::selection,\n [data-nextjs-codeframe] *::selection {\n background-color: var(--color-ansi-selection);\n }\n\n [data-nextjs-codeframe] *:not(a) {\n color: inherit;\n background-color: transparent;\n font-family: var(--font-stack-monospace);\n }\n\n [data-nextjs-codeframe-line][data-nextjs-codeframe-line--errored="true"] {\n position: relative;\n\n > span { \n position: relative;\n z-index: 1;\n }\n\n &::after {\n content: "";\n width: calc(100% + var(--code-frame-padding) * 2);\n height: var(--code-frame-line-height);\n left: calc(-1 * var(--code-frame-padding));\n background: var(--color-red-200);\n box-shadow: 2px 0 0 0 var(--color-red-900) inset;\n position: absolute;\n }\n }\n\n\n [data-nextjs-codeframe] > * {\n margin: 0;\n }\n\n .code-frame-link {\n display: flex;\n margin: 0;\n outline: 0;\n }\n .code-frame-link [data-icon=\'right\'] {\n margin-left: auto;\n }\n\n [data-nextjs-codeframe] div > pre {\n overflow: hidden;\n display: inline-block;\n }\n\n [data-nextjs-codeframe] svg {\n color: var(--color-gray-900);\n }\n';
|
|
104
99
|
|
|
105
100
|
//# sourceMappingURL=code-frame.js.map
|
package/dist/esm/client/components/react-dev-overlay/ui/components/code-frame/code-frame.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/ui/components/code-frame/code-frame.tsx"],"sourcesContent":["import type { StackFrame } from 'next/dist/compiled/stacktrace-parser'\
|
|
1
|
+
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/ui/components/code-frame/code-frame.tsx"],"sourcesContent":["import type { StackFrame } from 'next/dist/compiled/stacktrace-parser'\nimport { useMemo } from 'react'\nimport { HotlinkedText } from '../hot-linked-text'\nimport { getFrameSource } from '../../../utils/stack-frame'\nimport { useOpenInEditor } from '../../utils/use-open-in-editor'\nimport { ExternalIcon } from '../../icons/external'\nimport { FileIcon } from '../../icons/file'\nimport {\n formatCodeFrame,\n groupCodeFrameLines,\n parseLineNumberFromCodeFrameLine,\n} from './parse-code-frame'\n\nexport type CodeFrameProps = { stackFrame: StackFrame; codeFrame: string }\n\nexport function CodeFrame({ stackFrame, codeFrame }: CodeFrameProps) {\n const formattedFrame = useMemo<string>(\n () => formatCodeFrame(codeFrame),\n [codeFrame]\n )\n const decodedLines = useMemo(\n () => groupCodeFrameLines(formattedFrame),\n [formattedFrame]\n )\n\n const open = useOpenInEditor({\n file: stackFrame.file,\n lineNumber: stackFrame.lineNumber,\n column: stackFrame.column,\n })\n\n const fileExtension = stackFrame?.file?.split('.').pop()\n\n // TODO: make the caret absolute\n return (\n <div data-nextjs-codeframe>\n <div className=\"code-frame-header\">\n {/* TODO: This is <div> in `Terminal` component.\n Changing now will require multiple test snapshots updates.\n Leaving as <div> as is trivial and does not affect the UI.\n Change when the new redbox matcher `toDisplayRedbox` is used.\n */}\n <p className=\"code-frame-link\">\n <span className=\"code-frame-icon\">\n <FileIcon lang={fileExtension} />\n </span>\n <span data-text>\n {getFrameSource(stackFrame)} @{' '}\n <HotlinkedText text={stackFrame.methodName} />\n </span>\n <button\n aria-label=\"Open in editor\"\n data-with-open-in-editor-link-source-file\n onClick={open}\n >\n <span className=\"code-frame-icon\" data-icon=\"right\">\n <ExternalIcon width={16} height={16} />\n </span>\n </button>\n </p>\n </div>\n <pre className=\"code-frame-pre\">\n {decodedLines.map((line, lineIndex) => {\n const { lineNumber, isErroredLine } =\n parseLineNumberFromCodeFrameLine(line, stackFrame)\n\n const lineNumberProps: Record<string, string | boolean> = {}\n if (lineNumber) {\n lineNumberProps['data-nextjs-codeframe-line'] = lineNumber\n }\n if (isErroredLine) {\n lineNumberProps['data-nextjs-codeframe-line--errored'] = true\n }\n\n return (\n <div key={`line-${lineIndex}`} {...lineNumberProps}>\n {line.map((entry, entryIndex) => (\n <span\n key={`frame-${entryIndex}`}\n style={{\n color: entry.fg ? `var(--color-${entry.fg})` : undefined,\n ...(entry.decoration === 'bold'\n ? // TODO(jiwon): This used to be 800, but the symbols like `─┬─` are\n // having longer width than expected on Geist Mono font-weight\n // above 600, hence a temporary fix is to use 500 for bold.\n { fontWeight: 500 }\n : entry.decoration === 'italic'\n ? { fontStyle: 'italic' }\n : undefined),\n }}\n >\n {entry.content}\n </span>\n ))}\n </div>\n )\n })}\n </pre>\n </div>\n )\n}\n\nexport const CODE_FRAME_STYLES = `\n [data-nextjs-codeframe] {\n --code-frame-padding: 12px;\n --code-frame-line-height: var(--size-16);\n background-color: var(--color-background-200);\n overflow: hidden;\n color: var(--color-gray-1000);\n text-overflow: ellipsis;\n border: 1px solid var(--color-gray-400);\n border-radius: 8px;\n font-family: var(--font-stack-monospace);\n font-size: var(--size-12);\n line-height: var(--code-frame-line-height);\n margin: 8px 0;\n\n svg {\n width: var(--size-16);\n height: var(--size-16);\n }\n }\n\n .code-frame-link,\n .code-frame-pre {\n padding: var(--code-frame-padding);\n }\n\n .code-frame-link svg {\n flex-shrink: 0;\n }\n\n .code-frame-link [data-text] {\n display: inline-flex;\n text-align: left;\n margin: auto 6px;\n }\n\n .code-frame-pre {\n white-space: pre-wrap;\n }\n\n .code-frame-header {\n width: 100%;\n transition: background 100ms ease-out;\n border-radius: 8px 8px 0 0;\n border-bottom: 1px solid var(--color-gray-400);\n }\n\n [data-with-open-in-editor-link-source-file] {\n padding: 4px;\n margin: -4px 0 -4px auto;\n border-radius: var(--rounded-full);\n margin-left: auto;\n\n &:focus-visible {\n outline: var(--focus-ring);\n outline-offset: -2px;\n }\n\n &:hover {\n background: var(--color-gray-100);\n }\n }\n\n [data-nextjs-codeframe]::selection,\n [data-nextjs-codeframe] *::selection {\n background-color: var(--color-ansi-selection);\n }\n\n [data-nextjs-codeframe] *:not(a) {\n color: inherit;\n background-color: transparent;\n font-family: var(--font-stack-monospace);\n }\n\n [data-nextjs-codeframe-line][data-nextjs-codeframe-line--errored=\"true\"] {\n position: relative;\n\n > span { \n position: relative;\n z-index: 1;\n }\n\n &::after {\n content: \"\";\n width: calc(100% + var(--code-frame-padding) * 2);\n height: var(--code-frame-line-height);\n left: calc(-1 * var(--code-frame-padding));\n background: var(--color-red-200);\n box-shadow: 2px 0 0 0 var(--color-red-900) inset;\n position: absolute;\n }\n }\n\n\n [data-nextjs-codeframe] > * {\n margin: 0;\n }\n\n .code-frame-link {\n display: flex;\n margin: 0;\n outline: 0;\n }\n .code-frame-link [data-icon='right'] {\n margin-left: auto;\n }\n\n [data-nextjs-codeframe] div > pre {\n overflow: hidden;\n display: inline-block;\n }\n\n [data-nextjs-codeframe] svg {\n color: var(--color-gray-900);\n }\n`\n"],"names":["useMemo","HotlinkedText","getFrameSource","useOpenInEditor","ExternalIcon","FileIcon","formatCodeFrame","groupCodeFrameLines","parseLineNumberFromCodeFrameLine","CodeFrame","stackFrame","codeFrame","formattedFrame","decodedLines","open","file","lineNumber","column","fileExtension","split","pop","div","data-nextjs-codeframe","className","p","span","lang","data-text","text","methodName","button","aria-label","data-with-open-in-editor-link-source-file","onClick","data-icon","width","height","pre","map","line","lineIndex","isErroredLine","lineNumberProps","entry","entryIndex","style","color","fg","undefined","decoration","fontWeight","fontStyle","content","CODE_FRAME_STYLES"],"mappings":";AACA,SAASA,OAAO,QAAQ,QAAO;AAC/B,SAASC,aAAa,QAAQ,qBAAoB;AAClD,SAASC,cAAc,QAAQ,6BAA4B;AAC3D,SAASC,eAAe,QAAQ,iCAAgC;AAChE,SAASC,YAAY,QAAQ,uBAAsB;AACnD,SAASC,QAAQ,QAAQ,mBAAkB;AAC3C,SACEC,eAAe,EACfC,mBAAmB,EACnBC,gCAAgC,QAC3B,qBAAoB;AAI3B,OAAO,SAASC,UAAU,KAAyC;IAAzC,IAAA,EAAEC,UAAU,EAAEC,SAAS,EAAkB,GAAzC;QAgBFD;IAftB,MAAME,iBAAiBZ,QACrB,IAAMM,gBAAgBK,YACtB;QAACA;KAAU;IAEb,MAAME,eAAeb,QACnB,IAAMO,oBAAoBK,iBAC1B;QAACA;KAAe;IAGlB,MAAME,OAAOX,gBAAgB;QAC3BY,MAAML,WAAWK,IAAI;QACrBC,YAAYN,WAAWM,UAAU;QACjCC,QAAQP,WAAWO,MAAM;IAC3B;IAEA,MAAMC,gBAAgBR,+BAAAA,mBAAAA,WAAYK,IAAI,qBAAhBL,iBAAkBS,KAAK,CAAC,KAAKC,GAAG;IAEtD,gCAAgC;IAChC,qBACE,MAACC;QAAIC,uBAAqB;;0BACxB,KAACD;gBAAIE,WAAU;0BAMb,cAAA,MAACC;oBAAED,WAAU;;sCACX,KAACE;4BAAKF,WAAU;sCACd,cAAA,KAAClB;gCAASqB,MAAMR;;;sCAElB,MAACO;4BAAKE,WAAS;;gCACZzB,eAAeQ;gCAAY;gCAAG;8CAC/B,KAACT;oCAAc2B,MAAMlB,WAAWmB,UAAU;;;;sCAE5C,KAACC;4BACCC,cAAW;4BACXC,2CAAyC;4BACzCC,SAASnB;sCAET,cAAA,KAACW;gCAAKF,WAAU;gCAAkBW,aAAU;0CAC1C,cAAA,KAAC9B;oCAAa+B,OAAO;oCAAIC,QAAQ;;;;;;;0BAKzC,KAACC;gBAAId,WAAU;0BACZV,aAAayB,GAAG,CAAC,CAACC,MAAMC;oBACvB,MAAM,EAAExB,UAAU,EAAEyB,aAAa,EAAE,GACjCjC,iCAAiC+B,MAAM7B;oBAEzC,MAAMgC,kBAAoD,CAAC;oBAC3D,IAAI1B,YAAY;wBACd0B,eAAe,CAAC,6BAA6B,GAAG1B;oBAClD;oBACA,IAAIyB,eAAe;wBACjBC,eAAe,CAAC,sCAAsC,GAAG;oBAC3D;oBAEA,qBACE,KAACrB;wBAA+B,GAAGqB,eAAe;kCAC/CH,KAAKD,GAAG,CAAC,CAACK,OAAOC,2BAChB,KAACnB;gCAECoB,OAAO;oCACLC,OAAOH,MAAMI,EAAE,GAAG,AAAC,iBAAcJ,MAAMI,EAAE,GAAC,MAAKC;oCAC/C,GAAIL,MAAMM,UAAU,KAAK,SAErB,8DAA8D;oCAC9D,2DAA2D;oCAC3D;wCAAEC,YAAY;oCAAI,IAClBP,MAAMM,UAAU,KAAK,WACnB;wCAAEE,WAAW;oCAAS,IACtBH,SAAS;gCACjB;0CAECL,MAAMS,OAAO;+BAbT,AAAC,WAAQR;uBAHV,AAAC,UAAOJ;gBAqBtB;;;;AAIR;AAEA,OAAO,MAAMa,oBAAqB,qgFAmHjC"}
|
package/dist/esm/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.js
ADDED
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import Anser from 'next/dist/compiled/anser';
|
|
2
|
+
import stripAnsi from 'next/dist/compiled/strip-ansi';
|
|
3
|
+
// Strip leading spaces out of the code frame
|
|
4
|
+
export function formatCodeFrame(codeFrame) {
|
|
5
|
+
const lines = codeFrame.split(/\r?\n/g);
|
|
6
|
+
// Find the minimum length of leading spaces after `|` in the code frame
|
|
7
|
+
const miniLeadingSpacesLength = lines.map((line)=>/^>? +\d+ +\| [ ]+/.exec(stripAnsi(line)) === null ? null : /^>? +\d+ +\| ( *)/.exec(stripAnsi(line))).filter(Boolean).map((v)=>v.pop()).reduce((c, n)=>isNaN(c) ? n.length : Math.min(c, n.length), NaN);
|
|
8
|
+
// When the minimum length of leading spaces is greater than 1, remove them
|
|
9
|
+
// from the code frame to help the indentation looks better when there's a lot leading spaces.
|
|
10
|
+
if (miniLeadingSpacesLength > 1) {
|
|
11
|
+
return lines.map((line, a)=>~(a = line.indexOf('|')) ? line.substring(0, a) + line.substring(a).replace("^\\ {" + miniLeadingSpacesLength + "}", '') : line).join('\n');
|
|
12
|
+
}
|
|
13
|
+
return lines.join('\n');
|
|
14
|
+
}
|
|
15
|
+
export function groupCodeFrameLines(formattedFrame) {
|
|
16
|
+
// Map the decoded lines to a format that can be rendered
|
|
17
|
+
const decoded = Anser.ansiToJson(formattedFrame, {
|
|
18
|
+
json: true,
|
|
19
|
+
use_classes: true,
|
|
20
|
+
remove_empty: true
|
|
21
|
+
});
|
|
22
|
+
const lines = [];
|
|
23
|
+
let line = [];
|
|
24
|
+
for (const token of decoded){
|
|
25
|
+
if (token.content === '\n') {
|
|
26
|
+
lines.push(line);
|
|
27
|
+
line = [];
|
|
28
|
+
} else {
|
|
29
|
+
line.push(token);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
if (line.length > 0) {
|
|
33
|
+
lines.push(line);
|
|
34
|
+
}
|
|
35
|
+
return lines;
|
|
36
|
+
}
|
|
37
|
+
export function parseLineNumberFromCodeFrameLine(line, stackFrame) {
|
|
38
|
+
var _line_, _line_1, _stackFrame_lineNumber;
|
|
39
|
+
let lineNumberToken;
|
|
40
|
+
let lineNumber;
|
|
41
|
+
// parse line number from line first 2 tokens
|
|
42
|
+
// e.g. ` > 1 | const foo = 'bar'` => `1`, first token is `1 |`
|
|
43
|
+
// e.g. ` 2 | const foo = 'bar'` => `2`. first 2 tokens are ' ' and ' 2 |'
|
|
44
|
+
// console.log('line', line)
|
|
45
|
+
if (((_line_ = line[0]) == null ? void 0 : _line_.content) === '>' || ((_line_1 = line[0]) == null ? void 0 : _line_1.content) === ' ') {
|
|
46
|
+
var _lineNumberToken_content_replace, _lineNumberToken_content;
|
|
47
|
+
lineNumberToken = line[1];
|
|
48
|
+
lineNumber = lineNumberToken == null ? void 0 : (_lineNumberToken_content = lineNumberToken.content) == null ? void 0 : (_lineNumberToken_content_replace = _lineNumberToken_content.replace('|', '')) == null ? void 0 : _lineNumberToken_content_replace.trim();
|
|
49
|
+
}
|
|
50
|
+
// When the line number is possibly undefined, it can be just the non-source code line
|
|
51
|
+
// e.g. the ^ sign can also take a line, we skip rendering line number for it
|
|
52
|
+
return {
|
|
53
|
+
lineNumber,
|
|
54
|
+
isErroredLine: lineNumber === ((_stackFrame_lineNumber = stackFrame.lineNumber) == null ? void 0 : _stackFrame_lineNumber.toString())
|
|
55
|
+
};
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
//# sourceMappingURL=parse-code-frame.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/ui/components/code-frame/parse-code-frame.ts"],"sourcesContent":["import type { StackFrame } from 'next/dist/compiled/stacktrace-parser'\nimport Anser, { type AnserJsonEntry } from 'next/dist/compiled/anser'\nimport stripAnsi from 'next/dist/compiled/strip-ansi'\n\n// Strip leading spaces out of the code frame\nexport function formatCodeFrame(codeFrame: string) {\n const lines = codeFrame.split(/\\r?\\n/g)\n\n // Find the minimum length of leading spaces after `|` in the code frame\n const miniLeadingSpacesLength = lines\n .map((line) =>\n /^>? +\\d+ +\\| [ ]+/.exec(stripAnsi(line)) === null\n ? null\n : /^>? +\\d+ +\\| ( *)/.exec(stripAnsi(line))\n )\n .filter(Boolean)\n .map((v) => v!.pop()!)\n .reduce((c, n) => (isNaN(c) ? n.length : Math.min(c, n.length)), NaN)\n\n // When the minimum length of leading spaces is greater than 1, remove them\n // from the code frame to help the indentation looks better when there's a lot leading spaces.\n if (miniLeadingSpacesLength > 1) {\n return lines\n .map((line, a) =>\n ~(a = line.indexOf('|'))\n ? line.substring(0, a) +\n line.substring(a).replace(`^\\\\ {${miniLeadingSpacesLength}}`, '')\n : line\n )\n .join('\\n')\n }\n return lines.join('\\n')\n}\n\nexport function groupCodeFrameLines(formattedFrame: string) {\n // Map the decoded lines to a format that can be rendered\n const decoded = Anser.ansiToJson(formattedFrame, {\n json: true,\n use_classes: true,\n remove_empty: true,\n })\n const lines: (typeof decoded)[] = []\n\n let line: typeof decoded = []\n for (const token of decoded) {\n if (token.content === '\\n') {\n lines.push(line)\n line = []\n } else {\n line.push(token)\n }\n }\n if (line.length > 0) {\n lines.push(line)\n }\n\n return lines\n}\n\nexport function parseLineNumberFromCodeFrameLine(\n line: AnserJsonEntry[],\n stackFrame: StackFrame\n) {\n let lineNumberToken: AnserJsonEntry | undefined\n let lineNumber: string | undefined\n // parse line number from line first 2 tokens\n // e.g. ` > 1 | const foo = 'bar'` => `1`, first token is `1 |`\n // e.g. ` 2 | const foo = 'bar'` => `2`. first 2 tokens are ' ' and ' 2 |'\n // console.log('line', line)\n if (line[0]?.content === '>' || line[0]?.content === ' ') {\n lineNumberToken = line[1]\n lineNumber = lineNumberToken?.content?.replace('|', '')?.trim()\n }\n\n // When the line number is possibly undefined, it can be just the non-source code line\n // e.g. the ^ sign can also take a line, we skip rendering line number for it\n return {\n lineNumber,\n isErroredLine: lineNumber === stackFrame.lineNumber?.toString(),\n }\n}\n"],"names":["Anser","stripAnsi","formatCodeFrame","codeFrame","lines","split","miniLeadingSpacesLength","map","line","exec","filter","Boolean","v","pop","reduce","c","n","isNaN","length","Math","min","NaN","a","indexOf","substring","replace","join","groupCodeFrameLines","formattedFrame","decoded","ansiToJson","json","use_classes","remove_empty","token","content","push","parseLineNumberFromCodeFrameLine","stackFrame","lineNumberToken","lineNumber","trim","isErroredLine","toString"],"mappings":"AACA,OAAOA,WAAoC,2BAA0B;AACrE,OAAOC,eAAe,gCAA+B;AAErD,6CAA6C;AAC7C,OAAO,SAASC,gBAAgBC,SAAiB;IAC/C,MAAMC,QAAQD,UAAUE,KAAK,CAAC;IAE9B,wEAAwE;IACxE,MAAMC,0BAA0BF,MAC7BG,GAAG,CAAC,CAACC,OACJ,oBAAoBC,IAAI,CAACR,UAAUO,WAAW,OAC1C,OACA,oBAAoBC,IAAI,CAACR,UAAUO,QAExCE,MAAM,CAACC,SACPJ,GAAG,CAAC,CAACK,IAAMA,EAAGC,GAAG,IACjBC,MAAM,CAAC,CAACC,GAAGC,IAAOC,MAAMF,KAAKC,EAAEE,MAAM,GAAGC,KAAKC,GAAG,CAACL,GAAGC,EAAEE,MAAM,GAAIG;IAEnE,2EAA2E;IAC3E,8FAA8F;IAC9F,IAAIf,0BAA0B,GAAG;QAC/B,OAAOF,MACJG,GAAG,CAAC,CAACC,MAAMc,IACV,CAAEA,CAAAA,IAAId,KAAKe,OAAO,CAAC,IAAG,IAClBf,KAAKgB,SAAS,CAAC,GAAGF,KAClBd,KAAKgB,SAAS,CAACF,GAAGG,OAAO,CAAC,AAAC,UAAOnB,0BAAwB,KAAI,MAC9DE,MAELkB,IAAI,CAAC;IACV;IACA,OAAOtB,MAAMsB,IAAI,CAAC;AACpB;AAEA,OAAO,SAASC,oBAAoBC,cAAsB;IACxD,yDAAyD;IACzD,MAAMC,UAAU7B,MAAM8B,UAAU,CAACF,gBAAgB;QAC/CG,MAAM;QACNC,aAAa;QACbC,cAAc;IAChB;IACA,MAAM7B,QAA4B,EAAE;IAEpC,IAAII,OAAuB,EAAE;IAC7B,KAAK,MAAM0B,SAASL,QAAS;QAC3B,IAAIK,MAAMC,OAAO,KAAK,MAAM;YAC1B/B,MAAMgC,IAAI,CAAC5B;YACXA,OAAO,EAAE;QACX,OAAO;YACLA,KAAK4B,IAAI,CAACF;QACZ;IACF;IACA,IAAI1B,KAAKU,MAAM,GAAG,GAAG;QACnBd,MAAMgC,IAAI,CAAC5B;IACb;IAEA,OAAOJ;AACT;AAEA,OAAO,SAASiC,iCACd7B,IAAsB,EACtB8B,UAAsB;QAQlB9B,QAA4BA,SASA8B;IAfhC,IAAIC;IACJ,IAAIC;IACJ,6CAA6C;IAC7C,+DAA+D;IAC/D,2EAA2E;IAC3E,4BAA4B;IAC5B,IAAIhC,EAAAA,SAAAA,IAAI,CAAC,EAAE,qBAAPA,OAAS2B,OAAO,MAAK,OAAO3B,EAAAA,UAAAA,IAAI,CAAC,EAAE,qBAAPA,QAAS2B,OAAO,MAAK,KAAK;YAE3CI,kCAAAA;QADbA,kBAAkB/B,IAAI,CAAC,EAAE;QACzBgC,aAAaD,oCAAAA,2BAAAA,gBAAiBJ,OAAO,sBAAxBI,mCAAAA,yBAA0Bd,OAAO,CAAC,KAAK,wBAAvCc,iCAA4CE,IAAI;IAC/D;IAEA,sFAAsF;IACtF,6EAA6E;IAC7E,OAAO;QACLD;QACAE,eAAeF,iBAAeF,yBAAAA,WAAWE,UAAU,qBAArBF,uBAAuBK,QAAQ;IAC/D;AACF"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export { PseudoHtmlDiff } from '../../components/hydration-diff/diff-view';
|
|
2
|
-
export const PSEUDO_HTML_DIFF_STYLES = "\n [data-nextjs-container-errors-pseudo-html] {\n padding: 8px 0;\n margin: 8px 0;\n border: 1px solid var(--color-gray-400);\n background: var(--color-background-200);\n color: var(--color-syntax-constant);\n font-family: var(--font-stack-monospace);\n font-size: var(--size-12);\n line-height: 1.33em; /* 16px in 12px font size */\n border-radius: var(--rounded-md-2);\n }\n [data-nextjs-container-errors-pseudo-html-line] {\n display: inline-block;\n width: 100%;\n padding-left: 40px;\n line-height: calc(5 / 3);\n }\n [data-nextjs-container-errors-pseudo-html--diff='error'] {\n background: var(--color-amber-100);\n font-weight: bold;\n }\n [data-nextjs-container-errors-pseudo-html-collapse-button] {\n all: unset;\n margin-left: 12px;\n &:focus {\n outline: none;\n }\n }\n [data-nextjs-container-errors-pseudo-html--diff='add'] {\n background: var(--color-green-300);\n }\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n margin-left: calc(24px * -1);\n margin-right: 24px;\n }\n [data-nextjs-container-errors-pseudo-html--diff='add']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-green-900);\n }\n [data-nextjs-container-errors-pseudo-html--diff='remove'] {\n background: var(--color-red-300);\n }\n [data-nextjs-container-errors-pseudo-html--diff='remove']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-red-900);\n margin-left: calc(24px * -1);\n margin-right: 24px;\n }\n [data-nextjs-container-errors-pseudo-html--diff='error']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-amber-900);\n }\n \n [data-nextjs-container-errors-pseudo-html--hint] {\n display: inline-block;\n font-size: 0;\n height: 0;\n }\n [data-nextjs-container-errors-pseudo-html--tag-adjacent='false'] {\n color: var(--color-accents-1);\n }\n .nextjs__container_errors__component-stack {\n margin: 0;\n }\n [data-nextjs-container-errors-pseudo-html-collapse='true']\n .nextjs__container_errors__component-stack\n code {\n max-height: 120px;\n mask-image: linear-gradient(to bottom,rgba(0,0,0,0) 0%,black 10%);\n padding-bottom: 40px;\n }\n .nextjs__container_errors__component-stack code {\n display: block;\n width: 100%;\n white-space: pre-wrap;\n scroll-snap-type: y mandatory;\n overflow-y: hidden;\n }\n [data-nextjs-container-errors-pseudo-html--diff] {\n scroll-snap-align: center;\n }\n .error-overlay-hydration-error-diff-plus-icon {\n color: var(--color-green-900);\n }\n .error-overlay-hydration-error-diff-minus-icon {\n color: var(--color-red-900);\n }\n";
|
|
2
|
+
export const PSEUDO_HTML_DIFF_STYLES = "\n [data-nextjs-container-errors-pseudo-html] {\n padding: 8px 0;\n margin: 8px 0;\n border: 1px solid var(--color-gray-400);\n background: var(--color-background-200);\n color: var(--color-syntax-constant);\n font-family: var(--font-stack-monospace);\n font-size: var(--size-12);\n line-height: 1.33em; /* 16px in 12px font size */\n border-radius: var(--rounded-md-2);\n }\n [data-nextjs-container-errors-pseudo-html-line] {\n display: inline-block;\n width: 100%;\n padding-left: 40px;\n line-height: calc(5 / 3);\n }\n [data-nextjs-container-errors-pseudo-html--diff='error'] {\n background: var(--color-amber-100);\n box-shadow: 2px 0 0 0 var(--color-amber-900) inset;\n font-weight: bold;\n }\n [data-nextjs-container-errors-pseudo-html-collapse-button] {\n all: unset;\n margin-left: 12px;\n &:focus {\n outline: none;\n }\n }\n [data-nextjs-container-errors-pseudo-html--diff='add'] {\n background: var(--color-green-300);\n }\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n margin-left: calc(24px * -1);\n margin-right: 24px;\n }\n [data-nextjs-container-errors-pseudo-html--diff='add']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-green-900);\n }\n [data-nextjs-container-errors-pseudo-html--diff='remove'] {\n background: var(--color-red-300);\n }\n [data-nextjs-container-errors-pseudo-html--diff='remove']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-red-900);\n margin-left: calc(24px * -1);\n margin-right: 24px;\n }\n [data-nextjs-container-errors-pseudo-html--diff='error']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-amber-900);\n }\n \n [data-nextjs-container-errors-pseudo-html--hint] {\n display: inline-block;\n font-size: 0;\n height: 0;\n }\n [data-nextjs-container-errors-pseudo-html--tag-adjacent='false'] {\n color: var(--color-accents-1);\n }\n .nextjs__container_errors__component-stack {\n margin: 0;\n }\n [data-nextjs-container-errors-pseudo-html-collapse='true']\n .nextjs__container_errors__component-stack\n code {\n max-height: 120px;\n mask-image: linear-gradient(to bottom,rgba(0,0,0,0) 0%,black 10%);\n padding-bottom: 40px;\n }\n .nextjs__container_errors__component-stack code {\n display: block;\n width: 100%;\n white-space: pre-wrap;\n scroll-snap-type: y mandatory;\n overflow-y: hidden;\n }\n [data-nextjs-container-errors-pseudo-html--diff] {\n scroll-snap-align: center;\n }\n .error-overlay-hydration-error-diff-plus-icon {\n color: var(--color-green-900);\n }\n .error-overlay-hydration-error-diff-minus-icon {\n color: var(--color-red-900);\n }\n";
|
|
3
3
|
|
|
4
4
|
//# sourceMappingURL=component-stack-pseudo-html.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.tsx"],"sourcesContent":["export { PseudoHtmlDiff } from '../../components/hydration-diff/diff-view'\n\nexport const PSEUDO_HTML_DIFF_STYLES = `\n [data-nextjs-container-errors-pseudo-html] {\n padding: 8px 0;\n margin: 8px 0;\n border: 1px solid var(--color-gray-400);\n background: var(--color-background-200);\n color: var(--color-syntax-constant);\n font-family: var(--font-stack-monospace);\n font-size: var(--size-12);\n line-height: 1.33em; /* 16px in 12px font size */\n border-radius: var(--rounded-md-2);\n }\n [data-nextjs-container-errors-pseudo-html-line] {\n display: inline-block;\n width: 100%;\n padding-left: 40px;\n line-height: calc(5 / 3);\n }\n [data-nextjs-container-errors-pseudo-html--diff='error'] {\n background: var(--color-amber-100);\n font-weight: bold;\n }\n [data-nextjs-container-errors-pseudo-html-collapse-button] {\n all: unset;\n margin-left: 12px;\n &:focus {\n outline: none;\n }\n }\n [data-nextjs-container-errors-pseudo-html--diff='add'] {\n background: var(--color-green-300);\n }\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n margin-left: calc(24px * -1);\n margin-right: 24px;\n }\n [data-nextjs-container-errors-pseudo-html--diff='add']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-green-900);\n }\n [data-nextjs-container-errors-pseudo-html--diff='remove'] {\n background: var(--color-red-300);\n }\n [data-nextjs-container-errors-pseudo-html--diff='remove']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-red-900);\n margin-left: calc(24px * -1);\n margin-right: 24px;\n }\n [data-nextjs-container-errors-pseudo-html--diff='error']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-amber-900);\n }\n ${/* hide but text are still accessible in DOM */ ''}\n [data-nextjs-container-errors-pseudo-html--hint] {\n display: inline-block;\n font-size: 0;\n height: 0;\n }\n [data-nextjs-container-errors-pseudo-html--tag-adjacent='false'] {\n color: var(--color-accents-1);\n }\n .nextjs__container_errors__component-stack {\n margin: 0;\n }\n [data-nextjs-container-errors-pseudo-html-collapse='true']\n .nextjs__container_errors__component-stack\n code {\n max-height: 120px;\n mask-image: linear-gradient(to bottom,rgba(0,0,0,0) 0%,black 10%);\n padding-bottom: 40px;\n }\n .nextjs__container_errors__component-stack code {\n display: block;\n width: 100%;\n white-space: pre-wrap;\n scroll-snap-type: y mandatory;\n overflow-y: hidden;\n }\n [data-nextjs-container-errors-pseudo-html--diff] {\n scroll-snap-align: center;\n }\n .error-overlay-hydration-error-diff-plus-icon {\n color: var(--color-green-900);\n }\n .error-overlay-hydration-error-diff-minus-icon {\n color: var(--color-red-900);\n }\n`\n"],"names":["PseudoHtmlDiff","PSEUDO_HTML_DIFF_STYLES"],"mappings":"AAAA,SAASA,cAAc,QAAQ,4CAA2C;AAE1E,OAAO,MAAMC,0BAA2B,
|
|
1
|
+
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/ui/container/runtime-error/component-stack-pseudo-html.tsx"],"sourcesContent":["export { PseudoHtmlDiff } from '../../components/hydration-diff/diff-view'\n\nexport const PSEUDO_HTML_DIFF_STYLES = `\n [data-nextjs-container-errors-pseudo-html] {\n padding: 8px 0;\n margin: 8px 0;\n border: 1px solid var(--color-gray-400);\n background: var(--color-background-200);\n color: var(--color-syntax-constant);\n font-family: var(--font-stack-monospace);\n font-size: var(--size-12);\n line-height: 1.33em; /* 16px in 12px font size */\n border-radius: var(--rounded-md-2);\n }\n [data-nextjs-container-errors-pseudo-html-line] {\n display: inline-block;\n width: 100%;\n padding-left: 40px;\n line-height: calc(5 / 3);\n }\n [data-nextjs-container-errors-pseudo-html--diff='error'] {\n background: var(--color-amber-100);\n box-shadow: 2px 0 0 0 var(--color-amber-900) inset;\n font-weight: bold;\n }\n [data-nextjs-container-errors-pseudo-html-collapse-button] {\n all: unset;\n margin-left: 12px;\n &:focus {\n outline: none;\n }\n }\n [data-nextjs-container-errors-pseudo-html--diff='add'] {\n background: var(--color-green-300);\n }\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n margin-left: calc(24px * -1);\n margin-right: 24px;\n }\n [data-nextjs-container-errors-pseudo-html--diff='add']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-green-900);\n }\n [data-nextjs-container-errors-pseudo-html--diff='remove'] {\n background: var(--color-red-300);\n }\n [data-nextjs-container-errors-pseudo-html--diff='remove']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-red-900);\n margin-left: calc(24px * -1);\n margin-right: 24px;\n }\n [data-nextjs-container-errors-pseudo-html--diff='error']\n [data-nextjs-container-errors-pseudo-html-line-sign] {\n color: var(--color-amber-900);\n }\n ${/* hide but text are still accessible in DOM */ ''}\n [data-nextjs-container-errors-pseudo-html--hint] {\n display: inline-block;\n font-size: 0;\n height: 0;\n }\n [data-nextjs-container-errors-pseudo-html--tag-adjacent='false'] {\n color: var(--color-accents-1);\n }\n .nextjs__container_errors__component-stack {\n margin: 0;\n }\n [data-nextjs-container-errors-pseudo-html-collapse='true']\n .nextjs__container_errors__component-stack\n code {\n max-height: 120px;\n mask-image: linear-gradient(to bottom,rgba(0,0,0,0) 0%,black 10%);\n padding-bottom: 40px;\n }\n .nextjs__container_errors__component-stack code {\n display: block;\n width: 100%;\n white-space: pre-wrap;\n scroll-snap-type: y mandatory;\n overflow-y: hidden;\n }\n [data-nextjs-container-errors-pseudo-html--diff] {\n scroll-snap-align: center;\n }\n .error-overlay-hydration-error-diff-plus-icon {\n color: var(--color-green-900);\n }\n .error-overlay-hydration-error-diff-minus-icon {\n color: var(--color-red-900);\n }\n`\n"],"names":["PseudoHtmlDiff","PSEUDO_HTML_DIFF_STYLES"],"mappings":"AAAA,SAASA,cAAc,QAAQ,4CAA2C;AAE1E,OAAO,MAAMC,0BAA2B,mvFAyFvC"}
|
package/dist/esm/client/index.js
CHANGED
|
@@ -26,7 +26,7 @@ import { SearchParamsContext, PathParamsContext } from '../shared/lib/hooks-clie
|
|
|
26
26
|
import { onRecoverableError } from './react-client-callbacks/on-recoverable-error';
|
|
27
27
|
import tracer from './tracing/tracer';
|
|
28
28
|
import { isNextRouterError } from './components/is-next-router-error';
|
|
29
|
-
export const version = "15.3.0-canary.
|
|
29
|
+
export const version = "15.3.0-canary.6";
|
|
30
30
|
export let router;
|
|
31
31
|
export const emitter = mitt();
|
|
32
32
|
const looseToArray = (input)=>[].slice.call(input);
|
|
@@ -4,32 +4,27 @@ import crypto from 'crypto';
|
|
|
4
4
|
import { promisify } from 'util';
|
|
5
5
|
import globOriginal from 'next/dist/compiled/glob';
|
|
6
6
|
import { Sema } from 'next/dist/compiled/async-sema';
|
|
7
|
-
import { BUILD_MANIFEST } from '../shared/lib/constants';
|
|
8
7
|
import { getNextConfigEnv, getStaticEnv } from './static-env';
|
|
9
8
|
const glob = promisify(globOriginal);
|
|
10
|
-
export async function inlineStaticEnv({ distDir, config
|
|
9
|
+
export async function inlineStaticEnv({ distDir, config }) {
|
|
11
10
|
const nextConfigEnv = getNextConfigEnv(config);
|
|
12
11
|
const staticEnv = getStaticEnv(config);
|
|
13
12
|
const serverDir = path.join(distDir, 'server');
|
|
14
|
-
const serverChunks = await glob('**/*.js', {
|
|
13
|
+
const serverChunks = await glob('**/*.{js,json,js.map}', {
|
|
15
14
|
cwd: serverDir
|
|
16
15
|
});
|
|
17
16
|
const clientDir = path.join(distDir, 'static');
|
|
18
|
-
const clientChunks = await glob('**/*.js', {
|
|
17
|
+
const clientChunks = await glob('**/*.{js,json,js.map}', {
|
|
19
18
|
cwd: clientDir
|
|
20
19
|
});
|
|
21
|
-
const
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
value: "E662",
|
|
25
|
-
enumerable: false,
|
|
26
|
-
configurable: true
|
|
27
|
-
});
|
|
28
|
-
}
|
|
20
|
+
const manifestChunks = await glob('*.{js,json,js.map}', {
|
|
21
|
+
cwd: distDir
|
|
22
|
+
});
|
|
29
23
|
const inlineSema = new Sema(8);
|
|
30
24
|
const nextConfigEnvKeys = Object.keys(nextConfigEnv).map((item)=>item.split('process.env.').pop());
|
|
31
25
|
const builtRegEx = new RegExp(`[\\w]{1,}(\\.env)?\\.(?:NEXT_PUBLIC_[\\w]{1,}${nextConfigEnvKeys.length ? '|' + nextConfigEnvKeys.join('|') : ''})`, 'g');
|
|
32
26
|
const changedClientFiles = [];
|
|
27
|
+
const filesToCheck = new Set(manifestChunks.map((f)=>path.join(distDir, f)));
|
|
33
28
|
for (const [parentDir, files] of [
|
|
34
29
|
[
|
|
35
30
|
serverDir,
|
|
@@ -58,6 +53,7 @@ export async function inlineStaticEnv({ distDir, config, buildId }) {
|
|
|
58
53
|
content: newContent
|
|
59
54
|
});
|
|
60
55
|
}
|
|
56
|
+
filesToCheck.add(filepath);
|
|
61
57
|
inlineSema.release();
|
|
62
58
|
}));
|
|
63
59
|
}
|
|
@@ -80,14 +76,13 @@ export async function inlineStaticEnv({ distDir, config, buildId }) {
|
|
|
80
76
|
newHash
|
|
81
77
|
});
|
|
82
78
|
const filepath = path.join(clientDir, file);
|
|
83
|
-
|
|
79
|
+
const newFilepath = filepath.replace(originalHash, newHash);
|
|
80
|
+
filesToCheck.delete(filepath);
|
|
81
|
+
filesToCheck.add(newFilepath);
|
|
82
|
+
await fs.promises.rename(filepath, newFilepath);
|
|
84
83
|
}
|
|
85
84
|
// update build-manifest and webpack-runtime with new hashes
|
|
86
|
-
for (
|
|
87
|
-
path.join(distDir, BUILD_MANIFEST),
|
|
88
|
-
path.join(distDir, 'static', webpackRuntimeFile),
|
|
89
|
-
path.join(distDir, 'static', buildId, '_buildManifest.js')
|
|
90
|
-
]){
|
|
85
|
+
for (let file of filesToCheck){
|
|
91
86
|
const content = await fs.promises.readFile(file, 'utf-8');
|
|
92
87
|
let newContent = content;
|
|
93
88
|
for (const { originalHash, newHash } of hashChanges){
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/lib/inline-static-env.ts"],"sourcesContent":["import fs from 'fs'\nimport path from 'path'\nimport crypto from 'crypto'\nimport { promisify } from 'util'\nimport globOriginal from 'next/dist/compiled/glob'\nimport { Sema } from 'next/dist/compiled/async-sema'\nimport type { NextConfigComplete } from '../server/config-shared'\nimport {
|
|
1
|
+
{"version":3,"sources":["../../src/lib/inline-static-env.ts"],"sourcesContent":["import fs from 'fs'\nimport path from 'path'\nimport crypto from 'crypto'\nimport { promisify } from 'util'\nimport globOriginal from 'next/dist/compiled/glob'\nimport { Sema } from 'next/dist/compiled/async-sema'\nimport type { NextConfigComplete } from '../server/config-shared'\nimport { getNextConfigEnv, getStaticEnv } from './static-env'\n\nconst glob = promisify(globOriginal)\n\nexport async function inlineStaticEnv({\n distDir,\n config,\n}: {\n distDir: string\n config: NextConfigComplete\n}) {\n const nextConfigEnv = getNextConfigEnv(config)\n const staticEnv = getStaticEnv(config)\n\n const serverDir = path.join(distDir, 'server')\n const serverChunks = await glob('**/*.{js,json,js.map}', {\n cwd: serverDir,\n })\n const clientDir = path.join(distDir, 'static')\n const clientChunks = await glob('**/*.{js,json,js.map}', {\n cwd: clientDir,\n })\n const manifestChunks = await glob('*.{js,json,js.map}', {\n cwd: distDir,\n })\n\n const inlineSema = new Sema(8)\n const nextConfigEnvKeys = Object.keys(nextConfigEnv).map((item) =>\n item.split('process.env.').pop()\n )\n\n const builtRegEx = new RegExp(\n `[\\\\w]{1,}(\\\\.env)?\\\\.(?:NEXT_PUBLIC_[\\\\w]{1,}${nextConfigEnvKeys.length ? '|' + nextConfigEnvKeys.join('|') : ''})`,\n 'g'\n )\n const changedClientFiles: Array<{ file: string; content: string }> = []\n const filesToCheck = new Set<string>(\n manifestChunks.map((f) => path.join(distDir, f))\n )\n\n for (const [parentDir, files] of [\n [serverDir, serverChunks],\n [clientDir, clientChunks],\n ] as const) {\n await Promise.all(\n files.map(async (file) => {\n await inlineSema.acquire()\n const filepath = path.join(parentDir, file)\n const content = await fs.promises.readFile(filepath, 'utf8')\n const newContent = content.replace(builtRegEx, (match) => {\n let normalizedMatch = `process.env.${match.split('.').pop()}`\n\n if (staticEnv[normalizedMatch]) {\n return JSON.stringify(staticEnv[normalizedMatch])\n }\n return match\n })\n\n await fs.promises.writeFile(filepath, newContent)\n\n if (content !== newContent && parentDir === clientDir) {\n changedClientFiles.push({ file, content: newContent })\n }\n filesToCheck.add(filepath)\n inlineSema.release()\n })\n )\n }\n const hashChanges: Array<{\n originalHash: string\n newHash: string\n }> = []\n\n // hashes need updating for any changed client files\n for (const { file, content } of changedClientFiles) {\n // hash is 16 chars currently for all client chunks\n const originalHash = file.match(/([a-z0-9]{16})\\./)?.[1] || ''\n\n if (!originalHash) {\n throw new Error(\n `Invariant: client chunk changed but failed to detect hash ${file}`\n )\n }\n const newHash = crypto\n .createHash('sha256')\n .update(content)\n .digest('hex')\n .substring(0, 16)\n\n hashChanges.push({ originalHash, newHash })\n\n const filepath = path.join(clientDir, file)\n const newFilepath = filepath.replace(originalHash, newHash)\n\n filesToCheck.delete(filepath)\n filesToCheck.add(newFilepath)\n\n await fs.promises.rename(filepath, newFilepath)\n }\n\n // update build-manifest and webpack-runtime with new hashes\n for (let file of filesToCheck) {\n const content = await fs.promises.readFile(file, 'utf-8')\n let newContent = content\n\n for (const { originalHash, newHash } of hashChanges) {\n newContent = newContent.replaceAll(originalHash, newHash)\n }\n if (content !== newContent) {\n await fs.promises.writeFile(file, newContent)\n }\n }\n}\n"],"names":["fs","path","crypto","promisify","globOriginal","Sema","getNextConfigEnv","getStaticEnv","glob","inlineStaticEnv","distDir","config","nextConfigEnv","staticEnv","serverDir","join","serverChunks","cwd","clientDir","clientChunks","manifestChunks","inlineSema","nextConfigEnvKeys","Object","keys","map","item","split","pop","builtRegEx","RegExp","length","changedClientFiles","filesToCheck","Set","f","parentDir","files","Promise","all","file","acquire","filepath","content","promises","readFile","newContent","replace","match","normalizedMatch","JSON","stringify","writeFile","push","add","release","hashChanges","originalHash","Error","newHash","createHash","update","digest","substring","newFilepath","delete","rename","replaceAll"],"mappings":"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"}
|
|
@@ -208,7 +208,6 @@ export const configSchema = z.lazy(()=>z.strictObject({
|
|
|
208
208
|
}).optional(),
|
|
209
209
|
excludeDefaultMomentLocales: z.boolean().optional(),
|
|
210
210
|
experimental: z.strictObject({
|
|
211
|
-
generateOnlyEnv: z.boolean().optional(),
|
|
212
211
|
nodeMiddleware: z.boolean().optional(),
|
|
213
212
|
after: z.boolean().optional(),
|
|
214
213
|
appDocumentPreloading: z.boolean().optional(),
|