npm - next - Versions diffs - 15.2.0-canary.65 → 15.2.0-canary.66 - Mend

next 15.2.0-canary.65 → 15.2.0-canary.66

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.

Potentially problematic release.

This version of next might be problematic. Click here for more details.

Files changed (334) hide show

package/dist/client/components/react-dev-overlay/_experimental/internal/container/errors.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/container/errors.tsx"],"sourcesContent":["import { useState, useMemo, useEffect, useRef, Suspense } from 'react'\nimport type { DebugInfo } from '../../../types'\nimport { Overlay } from '../components/overlay'\nimport { noop as css } from '../helpers/noop-template'\nimport { RuntimeError } from './runtime-error'\nimport { getErrorSource } from '../../../../../../shared/lib/error-source'\nimport { HotlinkedText } from '../components/hot-linked-text'\nimport { PseudoHtmlDiff } from './runtime-error/component-stack-pseudo-html'\nimport {\n type HydrationErrorState,\n getHydrationWarningType,\n} from '../../../../errors/hydration-error-info'\nimport {\n getUnhandledErrorType,\n isUnhandledConsoleOrRejection,\n} from '../../../../errors/console-error'\nimport { extractNextErrorCode } from '../../../../../../lib/error-telemetry-utils'\nimport { ErrorOverlayLayout } from '../components/errors/error-overlay-layout/error-overlay-layout'\nimport type { ReadyRuntimeError } from '../../../internal/helpers/get-error-by-type'\nimport type { ErrorBaseProps } from '../components/errors/error-overlay/error-overlay'\n\nexport interface ErrorsProps extends ErrorBaseProps {\n readyErrors: ReadyRuntimeError[]\n debugInfo: DebugInfo\n onClose: () => void\n}\n\ntype ReadyErrorEvent = ReadyRuntimeError\n\nfunction isNextjsLink(text: string): boolean {\n return text.startsWith('https://nextjs.org')\n}\n\nfunction ErrorDescription({\n error,\n hydrationWarning,\n}: {\n error: Error\n hydrationWarning: string \| null\n}) {\n const isUnhandledOrReplayError = isUnhandledConsoleOrRejection(error)\n const unhandledErrorType = isUnhandledOrReplayError\n ? getUnhandledErrorType(error)\n : null\n const isConsoleErrorStringMessage = unhandledErrorType === 'string'\n // If the error is:\n // - hydration warning\n // - captured console error or unhandled rejection\n // skip displaying the error name\n const title =\n (isUnhandledOrReplayError && isConsoleErrorStringMessage) \|\|\n hydrationWarning\n ? ''\n : error.name + ': '\n\n const environmentName =\n 'environmentName' in error ? error.environmentName : ''\n const envPrefix = environmentName ? `[ ${environmentName} ] ` : ''\n\n // The environment name will be displayed as a label, so remove it\n // from the message (e.g. \"[ Server ] hello world\" -> \"hello world\").\n let message = error.message\n if (message.startsWith(envPrefix)) {\n message = message.slice(envPrefix.length)\n }\n\n return (\n <>\n {title}\n <HotlinkedText\n text={hydrationWarning \|\| message}\n matcher={isNextjsLink}\n />\n </>\n )\n}\n\nexport function Errors({\n readyErrors,\n debugInfo,\n onClose,\n ...props\n}: ErrorsProps) {\n const dialogResizerRef = useRef<HTMLDivElement \| null>(null)\n\n useEffect(() => {\n // Close the error overlay when pressing escape\n function handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'Escape') {\n onClose()\n }\n }\n\n document.addEventListener('keydown', handleKeyDown)\n return () => document.removeEventListener('keydown', handleKeyDown)\n }, [onClose])\n\n const isLoading = useMemo<boolean>(() => {\n return readyErrors.length < 1\n }, [readyErrors.length])\n\n const [activeIdx, setActiveIndex] = useState<number>(0)\n\n const activeError = useMemo<ReadyErrorEvent \| null>(\n () => readyErrors[activeIdx] ?? null,\n [activeIdx, readyErrors]\n )\n\n if (isLoading) {\n // TODO: better loading state\n return <Overlay />\n }\n\n if (!activeError) {\n return null\n }\n\n const error = activeError.error\n const isServerError = ['server', 'edge-server'].includes(\n getErrorSource(error) \|\| ''\n )\n const isUnhandledError = isUnhandledConsoleOrRejection(error)\n const errorDetails: HydrationErrorState = (error as any).details \|\| {}\n const notes = errorDetails.notes \|\| ''\n const [warningTemplate, serverContent, clientContent] =\n errorDetails.warning \|\| [null, '', '']\n\n const hydrationErrorType = getHydrationWarningType(warningTemplate)\n const hydrationWarning = warningTemplate\n ? warningTemplate\n .replace('%s', serverContent)\n .replace('%s', clientContent)\n .replace('%s', '') // remove the %s for stack\n .replace(/%s$/, '') // If there's still a %s at the end, remove it\n .replace(/^Warning: /, '')\n .replace(/^Error: /, '')\n : null\n\n const errorCode = extractNextErrorCode(error)\n\n const footerMessage = isServerError\n ? 'This error happened while generating the page. Any console logs will be displayed in the terminal window.'\n : undefined\n\n return (\n <ErrorOverlayLayout\n errorCode={errorCode}\n errorType={\n isServerError\n ? 'Runtime Error'\n : isUnhandledError\n ? 'Console Error'\n : 'Unhandled Runtime Error'\n }\n errorMessage={\n <ErrorDescription error={error} hydrationWarning={hydrationWarning} />\n }\n onClose={isServerError ? undefined : onClose}\n debugInfo={debugInfo}\n error={error}\n readyErrors={readyErrors}\n activeIdx={activeIdx}\n setActiveIndex={setActiveIndex}\n footerMessage={footerMessage}\n dialogResizerRef={dialogResizerRef}\n {...props}\n >\n <div className=\"error-overlay-notes-container\">\n {notes ? (\n <>\n <p\n id=\"nextjs__container_errors__notes\"\n className=\"nextjs__container_errors__notes\"\n >\n {notes}\n </p>\n </>\n ) : null}\n {hydrationWarning ? (\n <p\n id=\"nextjs__container_errors__link\"\n className=\"nextjs__container_errors__link\"\n >\n <HotlinkedText text=\"See more info here: https://nextjs.org/docs/messages/react-hydration-error\" />\n </p>\n ) : null}\n </div>\n\n {hydrationWarning &&\n (activeError.componentStackFrames?.length \|\|\n !!errorDetails.reactOutputComponentDiff) ? (\n <PseudoHtmlDiff\n className=\"nextjs__container_errors__component-stack\"\n hydrationMismatchType={hydrationErrorType}\n firstContent={serverContent}\n secondContent={clientContent}\n reactOutputComponentDiff={errorDetails.reactOutputComponentDiff \|\| ''}\n />\n ) : null}\n <Suspense fallback={<div data-nextjs-error-suspended />}>\n <RuntimeError\n key={activeError.id.toString()}\n error={activeError}\n dialogResizerRef={dialogResizerRef}\n />\n </Suspense>\n </ErrorOverlayLayout>\n )\n}\n\nexport const styles = css`\n .nextjs-error-with-static {\n bottom: calc(var(--size-gap-double) * 4.5);\n }\n p.nextjs__container_errors__link {\n font-size: 14px;\n }\n p.nextjs__container_errors__notes {\n color: var(--color-stack-notes);\n font-size: 14px;\n line-height: 1.5;\n }\n .nextjs-container-errors-body > h2:not(:first-child) {\n margin-top: calc(var(--size-gap-double) + var(--size-gap));\n }\n .nextjs-container-errors-body > h2 {\n color: var(--color-title-color);\n margin-bottom: var(--size-gap);\n font-size: var(--size-font-big);\n }\n .nextjs-toast-errors-parent {\n cursor: pointer;\n transition: transform 0.2s ease;\n }\n .nextjs-toast-errors-parent:hover {\n transform: scale(1.1);\n }\n .nextjs-toast-errors {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n }\n .nextjs-toast-errors > svg {\n margin-right: var(--size-gap);\n }\n .nextjs-toast-hide-button {\n margin-left: var(--size-gap-triple);\n border: none;\n background: none;\n color: var(--color-ansi-bright-white);\n padding: 0;\n transition: opacity 0.25s ease;\n opacity: 0.7;\n }\n .nextjs-toast-hide-button:hover {\n opacity: 1;\n }\n .nextjs__container_errors_inspect_copy_button {\n cursor: pointer;\n background: none;\n border: none;\n color: var(--color-ansi-bright-white);\n font-size: 1.5rem;\n padding: 0;\n margin: 0;\n margin-left: var(--size-gap);\n transition: opacity 0.25s ease;\n }\n .nextjs__container_errors__error_title {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: var(--size-3_5);\n }\n .error-overlay-notes-container {\n margin: var(--size-2) var(--size-0_5);\n }\n .error-overlay-notes-container p {\n white-space: pre-wrap;\n }\n`\n"],"names":["Errors","styles","isNextjsLink","text","startsWith","ErrorDescription","error","hydrationWarning","isUnhandledOrReplayError","isUnhandledConsoleOrRejection","unhandledErrorType","getUnhandledErrorType","isConsoleErrorStringMessage","title","name","environmentName","envPrefix","message","slice","length","HotlinkedText","matcher","readyErrors","debugInfo","onClose","props","activeError","dialogResizerRef","useRef","useEffect","handleKeyDown","event","key","document","addEventListener","removeEventListener","isLoading","useMemo","activeIdx","setActiveIndex","useState","Overlay","isServerError","includes","getErrorSource","isUnhandledError","errorDetails","details","notes","warningTemplate","serverContent","clientContent","warning","hydrationErrorType","getHydrationWarningType","replace","errorCode","extractNextErrorCode","footerMessage","undefined","ErrorOverlayLayout","errorType","errorMessage","div","className","p","id","componentStackFrames","reactOutputComponentDiff","PseudoHtmlDiff","hydrationMismatchType","firstContent","secondContent","Suspense","fallback","data-nextjs-error-suspended","RuntimeError","toString","css"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/container/errors.tsx"],"sourcesContent":["import { useState, useMemo, useEffect, useRef, Suspense } from 'react'\nimport type { DebugInfo } from '../../../types'\nimport { Overlay } from '../components/overlay'\nimport { noop as css } from '../helpers/noop-template'\nimport { RuntimeError } from './runtime-error'\nimport { getErrorSource } from '../../../../../../shared/lib/error-source'\nimport { HotlinkedText } from '../components/hot-linked-text'\nimport { PseudoHtmlDiff } from './runtime-error/component-stack-pseudo-html'\nimport {\n type HydrationErrorState,\n getHydrationWarningType,\n} from '../../../../errors/hydration-error-info'\nimport {\n getUnhandledErrorType,\n isUnhandledConsoleOrRejection,\n} from '../../../../errors/console-error'\nimport { extractNextErrorCode } from '../../../../../../lib/error-telemetry-utils'\nimport { ErrorOverlayLayout } from '../components/errors/error-overlay-layout/error-overlay-layout'\nimport type { ReadyRuntimeError } from '../../../internal/helpers/get-error-by-type'\nimport type { ErrorBaseProps } from '../components/errors/error-overlay/error-overlay'\n\nexport interface ErrorsProps extends ErrorBaseProps {\n runtimeErrors: ReadyRuntimeError[]\n debugInfo: DebugInfo\n onClose: () => void\n}\n\ntype ReadyErrorEvent = ReadyRuntimeError\n\nfunction isNextjsLink(text: string): boolean {\n return text.startsWith('https://nextjs.org')\n}\n\nfunction ErrorDescription({\n error,\n hydrationWarning,\n}: {\n error: Error\n hydrationWarning: string \| null\n}) {\n const isUnhandledOrReplayError = isUnhandledConsoleOrRejection(error)\n const unhandledErrorType = isUnhandledOrReplayError\n ? getUnhandledErrorType(error)\n : null\n const isConsoleErrorStringMessage = unhandledErrorType === 'string'\n // If the error is:\n // - hydration warning\n // - captured console error or unhandled rejection\n // skip displaying the error name\n const title =\n (isUnhandledOrReplayError && isConsoleErrorStringMessage) \|\|\n hydrationWarning\n ? ''\n : error.name + ': '\n\n const environmentName =\n 'environmentName' in error ? error.environmentName : ''\n const envPrefix = environmentName ? `[ ${environmentName} ] ` : ''\n\n // The environment name will be displayed as a label, so remove it\n // from the message (e.g. \"[ Server ] hello world\" -> \"hello world\").\n let message = error.message\n if (message.startsWith(envPrefix)) {\n message = message.slice(envPrefix.length)\n }\n\n return (\n <>\n {title}\n <HotlinkedText\n text={hydrationWarning \|\| message}\n matcher={isNextjsLink}\n />\n </>\n )\n}\n\nexport function Errors({\n runtimeErrors,\n debugInfo,\n onClose,\n ...props\n}: ErrorsProps) {\n const dialogResizerRef = useRef<HTMLDivElement \| null>(null)\n\n useEffect(() => {\n // Close the error overlay when pressing escape\n function handleKeyDown(event: KeyboardEvent) {\n if (event.key === 'Escape') {\n onClose()\n }\n }\n\n document.addEventListener('keydown', handleKeyDown)\n return () => document.removeEventListener('keydown', handleKeyDown)\n }, [onClose])\n\n const isLoading = useMemo<boolean>(() => {\n return runtimeErrors.length < 1\n }, [runtimeErrors.length])\n\n const [activeIdx, setActiveIndex] = useState<number>(0)\n\n const activeError = useMemo<ReadyErrorEvent \| null>(\n () => runtimeErrors[activeIdx] ?? null,\n [activeIdx, runtimeErrors]\n )\n\n if (isLoading) {\n // TODO: better loading state\n return <Overlay />\n }\n\n if (!activeError) {\n return null\n }\n\n const error = activeError.error\n const isServerError = ['server', 'edge-server'].includes(\n getErrorSource(error) \|\| ''\n )\n const isUnhandledError = isUnhandledConsoleOrRejection(error)\n const errorDetails: HydrationErrorState = (error as any).details \|\| {}\n const notes = errorDetails.notes \|\| ''\n const [warningTemplate, serverContent, clientContent] =\n errorDetails.warning \|\| [null, '', '']\n\n const hydrationErrorType = getHydrationWarningType(warningTemplate)\n const hydrationWarning = warningTemplate\n ? warningTemplate\n .replace('%s', serverContent)\n .replace('%s', clientContent)\n .replace('%s', '') // remove the %s for stack\n .replace(/%s$/, '') // If there's still a %s at the end, remove it\n .replace(/^Warning: /, '')\n .replace(/^Error: /, '')\n : null\n\n const errorCode = extractNextErrorCode(error)\n\n const footerMessage = isServerError\n ? 'This error happened while generating the page. Any console logs will be displayed in the terminal window.'\n : undefined\n\n return (\n <ErrorOverlayLayout\n errorCode={errorCode}\n errorType={\n isServerError\n ? 'Runtime Error'\n : isUnhandledError\n ? 'Console Error'\n : 'Unhandled Runtime Error'\n }\n errorMessage={\n <ErrorDescription error={error} hydrationWarning={hydrationWarning} />\n }\n onClose={isServerError ? undefined : onClose}\n debugInfo={debugInfo}\n error={error}\n runtimeErrors={runtimeErrors}\n activeIdx={activeIdx}\n setActiveIndex={setActiveIndex}\n footerMessage={footerMessage}\n dialogResizerRef={dialogResizerRef}\n {...props}\n >\n <div className=\"error-overlay-notes-container\">\n {notes ? (\n <>\n <p\n id=\"nextjs__container_errors__notes\"\n className=\"nextjs__container_errors__notes\"\n >\n {notes}\n </p>\n </>\n ) : null}\n {hydrationWarning ? (\n <p\n id=\"nextjs__container_errors__link\"\n className=\"nextjs__container_errors__link\"\n >\n <HotlinkedText text=\"See more info here: https://nextjs.org/docs/messages/react-hydration-error\" />\n </p>\n ) : null}\n </div>\n\n {hydrationWarning &&\n (activeError.componentStackFrames?.length \|\|\n !!errorDetails.reactOutputComponentDiff) ? (\n <PseudoHtmlDiff\n className=\"nextjs__container_errors__component-stack\"\n hydrationMismatchType={hydrationErrorType}\n firstContent={serverContent}\n secondContent={clientContent}\n reactOutputComponentDiff={errorDetails.reactOutputComponentDiff \|\| ''}\n />\n ) : null}\n <Suspense fallback={<div data-nextjs-error-suspended />}>\n <RuntimeError\n key={activeError.id.toString()}\n error={activeError}\n dialogResizerRef={dialogResizerRef}\n />\n </Suspense>\n </ErrorOverlayLayout>\n )\n}\n\nexport const styles = css`\n .nextjs-error-with-static {\n bottom: calc(var(--size-gap-double) * 4.5);\n }\n p.nextjs__container_errors__link {\n font-size: 14px;\n }\n p.nextjs__container_errors__notes {\n color: var(--color-stack-notes);\n font-size: 14px;\n line-height: 1.5;\n }\n .nextjs-container-errors-body > h2:not(:first-child) {\n margin-top: calc(var(--size-gap-double) + var(--size-gap));\n }\n .nextjs-container-errors-body > h2 {\n color: var(--color-title-color);\n margin-bottom: var(--size-gap);\n font-size: var(--size-font-big);\n }\n .nextjs-toast-errors-parent {\n cursor: pointer;\n transition: transform 0.2s ease;\n }\n .nextjs-toast-errors-parent:hover {\n transform: scale(1.1);\n }\n .nextjs-toast-errors {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n }\n .nextjs-toast-errors > svg {\n margin-right: var(--size-gap);\n }\n .nextjs-toast-hide-button {\n margin-left: var(--size-gap-triple);\n border: none;\n background: none;\n color: var(--color-ansi-bright-white);\n padding: 0;\n transition: opacity 0.25s ease;\n opacity: 0.7;\n }\n .nextjs-toast-hide-button:hover {\n opacity: 1;\n }\n .nextjs__container_errors_inspect_copy_button {\n cursor: pointer;\n background: none;\n border: none;\n color: var(--color-ansi-bright-white);\n font-size: 1.5rem;\n padding: 0;\n margin: 0;\n margin-left: var(--size-gap);\n transition: opacity 0.25s ease;\n }\n .nextjs__container_errors__error_title {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: var(--size-3_5);\n }\n .error-overlay-notes-container {\n margin: var(--size-2) var(--size-0_5);\n }\n .error-overlay-notes-container p {\n white-space: pre-wrap;\n }\n`\n"],"names":["Errors","styles","isNextjsLink","text","startsWith","ErrorDescription","error","hydrationWarning","isUnhandledOrReplayError","isUnhandledConsoleOrRejection","unhandledErrorType","getUnhandledErrorType","isConsoleErrorStringMessage","title","name","environmentName","envPrefix","message","slice","length","HotlinkedText","matcher","runtimeErrors","debugInfo","onClose","props","activeError","dialogResizerRef","useRef","useEffect","handleKeyDown","event","key","document","addEventListener","removeEventListener","isLoading","useMemo","activeIdx","setActiveIndex","useState","Overlay","isServerError","includes","getErrorSource","isUnhandledError","errorDetails","details","notes","warningTemplate","serverContent","clientContent","warning","hydrationErrorType","getHydrationWarningType","replace","errorCode","extractNextErrorCode","footerMessage","undefined","ErrorOverlayLayout","errorType","errorMessage","div","className","p","id","componentStackFrames","reactOutputComponentDiff","PseudoHtmlDiff","hydrationMismatchType","firstContent","secondContent","Suspense","fallback","data-nextjs-error-suspended","RuntimeError","toString","css"],"mappings":"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"}

package/dist/client/components/react-dev-overlay/_experimental/internal/container/errors.stories.js CHANGED Viewed

@@ -89,7 +89,7 @@ const ignoredFrame = {
     ...frame,
     ignored: true
 };
-const readyErrors = [
+const runtimeErrors = [
     {
         id: 1,
         runtime: true,
@@ -166,7 +166,7 @@ const readyErrors = [
 ];
 const Default = {
     args: {
-        readyErrors,
+        runtimeErrors,
         versionInfo: {
             installed: '15.0.0',
             staleness: 'fresh'
@@ -187,9 +187,9 @@ const Turbopack = {
 const VeryLongErrorMessage = {
     args: {
         ...Default.args,
-        readyErrors: [
+        runtimeErrors: [
             {
-                ...readyErrors[0],
+                ...runtimeErrors[0],
                 error: Object.assign(new Error(_lorem.lorem))
             }
         ]
@@ -197,7 +197,7 @@ const VeryLongErrorMessage = {
 };
 const WithHydrationWarning = {
     args: {
-        readyErrors: [
+        runtimeErrors: [
             {
                 id: 1,
                 runtime: true,

package/dist/client/components/react-dev-overlay/_experimental/internal/container/errors.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/container/errors.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react'\n\nimport { Errors } from './errors'\nimport { withShadowPortal } from '../storybook/with-shadow-portal'\nimport type { ReadyRuntimeError } from '../../../internal/helpers/get-error-by-type'\nimport { lorem } from '../../../internal/utils/lorem'\n\nconst meta: Meta<typeof Errors> = {\n component: Errors,\n parameters: {\n layout: 'fullscreen',\n },\n decorators: [withShadowPortal],\n}\n\nexport default meta\ntype Story = StoryObj<typeof Errors>\n\nconst originalCodeFrame = (message: string) => {\n return `\\u001b[0m \\u001b[90m 1 \\u001b[39m \\u001b[36mexport\\u001b[39m \\u001b[36mdefault\\u001b[39m \\u001b[36mfunction\\u001b[39m \\u001b[33mHome\\u001b[39m() {\\u001b[0m\n\\u001b[0m\\u001b[31m\\u001b[1m>\\u001b[22m\\u001b[39m\\u001b[90m 2 \\u001b[39m \\u001b[36mthrow\\u001b[39m \\u001b[36mnew\\u001b[39m \\u001b[33mError\\u001b[39m(\\u001b[32m'${message}'\\u001b[39m)\\u001b[0m\n\\u001b[0m \\u001b[90m \\u001b[39m \\u001b[31m\\u001b[1m^\\u001b[22m\\u001b[39m\\u001b[0m\n\\u001b[0m \\u001b[90m 3 \\u001b[39m \\u001b[36mreturn\\u001b[39m \\u001b[33m<\\u001b[39m\\u001b[33mdiv\\u001b[39m\\u001b[33m>\\u001b[39m\\u001b[33mWelcome to my Next.js application! This is a longer piece of text that will demonstrate text wrapping behavior in the code frame.\\u001b[39m\\u001b[33m<\\u001b[39m\\u001b[33m/\\u001b[39m\\u001b[33mdiv\\u001b[39m\\u001b[33m>\\u001b[39m\\u001b[0m\n\\u001b[0m \\u001b[90m 4 \\u001b[39m }\\u001b[0m\n\\u001b[0m \\u001b[90m 5 \\u001b[39m\\u001b[0m`\n}\n\nconst sourceStackFrame = {\n file: 'app/page.tsx',\n methodName: 'Home',\n arguments: [],\n lineNumber: 2,\n column: 9,\n}\n\nconst originalStackFrame = {\n file: 'app/page.tsx',\n methodName: 'Home',\n arguments: [],\n lineNumber: 2,\n column: 9,\n ignored: false,\n}\n\nconst frame = {\n originalStackFrame: {\n file: './app/page.tsx',\n methodName: 'MyComponent',\n arguments: [],\n lineNumber: 10,\n column: 5,\n ignored: false,\n },\n sourceStackFrame: {\n file: './app/page.tsx',\n methodName: 'MyComponent',\n arguments: [],\n lineNumber: 10,\n column: 5,\n },\n originalCodeFrame: 'export default function MyComponent() {',\n error: false,\n reason: null,\n external: false,\n ignored: false,\n}\n\nconst ignoredFrame = {\n ...frame,\n ignored: true,\n}\n\nconst readyErrors: ReadyRuntimeError[] = [\n {\n id: 1,\n runtime: true,\n error: new Error('First error message'),\n frames: () =>\n Promise.resolve([\n frame,\n {\n ...frame,\n originalStackFrame: {\n ...frame.originalStackFrame,\n methodName: 'ParentComponent',\n lineNumber: 5,\n },\n },\n {\n ...frame,\n originalStackFrame: {\n ...frame.originalStackFrame,\n methodName: 'GrandparentComponent',\n lineNumber: 1,\n },\n },\n ...Array(20).fill(ignoredFrame),\n ]),\n },\n {\n id: 2,\n runtime: true,\n error: new Error('Second error message'),\n frames: () =>\n Promise.resolve([\n {\n error: true,\n reason: 'Second error message',\n external: false,\n ignored: false,\n sourceStackFrame,\n originalStackFrame,\n originalCodeFrame: originalCodeFrame('Second error message'),\n },\n ]),\n },\n {\n id: 3,\n runtime: true,\n error: new Error('Third error message'),\n frames: () =>\n Promise.resolve([\n {\n error: true,\n reason: 'Third error message',\n external: false,\n ignored: false,\n sourceStackFrame,\n originalStackFrame,\n originalCodeFrame: originalCodeFrame('Third error message'),\n },\n ]),\n },\n {\n id: 4,\n runtime: true,\n error: new Error('Fourth error message'),\n frames: () =>\n Promise.resolve([\n {\n error: true,\n reason: 'Fourth error message',\n external: false,\n ignored: false,\n sourceStackFrame,\n originalStackFrame,\n originalCodeFrame: originalCodeFrame('Fourth error message'),\n },\n ]),\n },\n]\n\nexport const Default: Story = {\n args: {\n readyErrors,\n versionInfo: {\n installed: '15.0.0',\n staleness: 'fresh',\n },\n debugInfo: { devtoolsFrontendUrl: undefined },\n isTurbopack: false,\n onClose: () => {},\n },\n}\n\nexport const Turbopack: Story = {\n args: {\n ...Default.args,\n isTurbopack: true,\n },\n}\n\nexport const VeryLongErrorMessage: Story = {\n args: {\n ...Default.args,\n readyErrors: [\n {\n ...readyErrors[0],\n error: Object.assign(new Error(lorem)),\n },\n ],\n },\n}\n\nexport const WithHydrationWarning: Story = {\n args: {\n readyErrors: [\n {\n id: 1,\n runtime: true,\n error: Object.assign(new Error('Hydration error'), {\n details: {\n warning: [\n 'Text content does not match server-rendered HTML: \"%s\" !== \"%s\"',\n 'Server Content',\n 'Client Content',\n ],\n reactOutputComponentDiff: `<MyComponent>\n <ParentComponent>\n <div>\n- <p> hello world and welcome to my amazing website with lots of content hello world and welcome to my amazing website with lots of content </p>\n+ <div> hello world and welcome to my amazing website with lots of content hello world and welcome to my amazing website with lots of content </div>`,\n },\n componentStackFrames: [\n {\n component: 'MyComponent',\n file: 'app/page.tsx',\n lineNumber: 10,\n columnNumber: 5,\n },\n {\n component: 'ParentComponent',\n file: 'app/layout.tsx',\n lineNumber: 20,\n columnNumber: 3,\n },\n ],\n }),\n frames: () =>\n Promise.resolve([\n {\n error: true,\n reason: 'First error message',\n external: false,\n ignored: false,\n sourceStackFrame: {\n file: 'app/page.tsx',\n methodName: 'Home',\n arguments: [],\n lineNumber: 10,\n column: 5,\n },\n },\n ]),\n },\n ],\n debugInfo: { devtoolsFrontendUrl: undefined },\n onClose: () => {},\n },\n}\n"],"names":["Default","Turbopack","VeryLongErrorMessage","WithHydrationWarning","meta","component","Errors","parameters","layout","decorators","withShadowPortal","originalCodeFrame","message","sourceStackFrame","file","methodName","arguments","lineNumber","column","originalStackFrame","ignored","frame","error","reason","external","ignoredFrame","readyErrors","id","runtime","Error","frames","Promise","resolve","Array","fill","args","versionInfo","installed","staleness","debugInfo","devtoolsFrontendUrl","undefined","isTurbopack","onClose","Object","assign","lorem","details","warning","reactOutputComponentDiff","componentStackFrames","columnNumber"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/container/errors.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from '@storybook/react'\n\nimport { Errors } from './errors'\nimport { withShadowPortal } from '../storybook/with-shadow-portal'\nimport type { ReadyRuntimeError } from '../../../internal/helpers/get-error-by-type'\nimport { lorem } from '../../../internal/utils/lorem'\n\nconst meta: Meta<typeof Errors> = {\n component: Errors,\n parameters: {\n layout: 'fullscreen',\n },\n decorators: [withShadowPortal],\n}\n\nexport default meta\ntype Story = StoryObj<typeof Errors>\n\nconst originalCodeFrame = (message: string) => {\n return `\\u001b[0m \\u001b[90m 1 \\u001b[39m \\u001b[36mexport\\u001b[39m \\u001b[36mdefault\\u001b[39m \\u001b[36mfunction\\u001b[39m \\u001b[33mHome\\u001b[39m() {\\u001b[0m\n\\u001b[0m\\u001b[31m\\u001b[1m>\\u001b[22m\\u001b[39m\\u001b[90m 2 \\u001b[39m \\u001b[36mthrow\\u001b[39m \\u001b[36mnew\\u001b[39m \\u001b[33mError\\u001b[39m(\\u001b[32m'${message}'\\u001b[39m)\\u001b[0m\n\\u001b[0m \\u001b[90m \\u001b[39m \\u001b[31m\\u001b[1m^\\u001b[22m\\u001b[39m\\u001b[0m\n\\u001b[0m \\u001b[90m 3 \\u001b[39m \\u001b[36mreturn\\u001b[39m \\u001b[33m<\\u001b[39m\\u001b[33mdiv\\u001b[39m\\u001b[33m>\\u001b[39m\\u001b[33mWelcome to my Next.js application! This is a longer piece of text that will demonstrate text wrapping behavior in the code frame.\\u001b[39m\\u001b[33m<\\u001b[39m\\u001b[33m/\\u001b[39m\\u001b[33mdiv\\u001b[39m\\u001b[33m>\\u001b[39m\\u001b[0m\n\\u001b[0m \\u001b[90m 4 \\u001b[39m }\\u001b[0m\n\\u001b[0m \\u001b[90m 5 \\u001b[39m\\u001b[0m`\n}\n\nconst sourceStackFrame = {\n file: 'app/page.tsx',\n methodName: 'Home',\n arguments: [],\n lineNumber: 2,\n column: 9,\n}\n\nconst originalStackFrame = {\n file: 'app/page.tsx',\n methodName: 'Home',\n arguments: [],\n lineNumber: 2,\n column: 9,\n ignored: false,\n}\n\nconst frame = {\n originalStackFrame: {\n file: './app/page.tsx',\n methodName: 'MyComponent',\n arguments: [],\n lineNumber: 10,\n column: 5,\n ignored: false,\n },\n sourceStackFrame: {\n file: './app/page.tsx',\n methodName: 'MyComponent',\n arguments: [],\n lineNumber: 10,\n column: 5,\n },\n originalCodeFrame: 'export default function MyComponent() {',\n error: false,\n reason: null,\n external: false,\n ignored: false,\n}\n\nconst ignoredFrame = {\n ...frame,\n ignored: true,\n}\n\nconst runtimeErrors: ReadyRuntimeError[] = [\n {\n id: 1,\n runtime: true,\n error: new Error('First error message'),\n frames: () =>\n Promise.resolve([\n frame,\n {\n ...frame,\n originalStackFrame: {\n ...frame.originalStackFrame,\n methodName: 'ParentComponent',\n lineNumber: 5,\n },\n },\n {\n ...frame,\n originalStackFrame: {\n ...frame.originalStackFrame,\n methodName: 'GrandparentComponent',\n lineNumber: 1,\n },\n },\n ...Array(20).fill(ignoredFrame),\n ]),\n },\n {\n id: 2,\n runtime: true,\n error: new Error('Second error message'),\n frames: () =>\n Promise.resolve([\n {\n error: true,\n reason: 'Second error message',\n external: false,\n ignored: false,\n sourceStackFrame,\n originalStackFrame,\n originalCodeFrame: originalCodeFrame('Second error message'),\n },\n ]),\n },\n {\n id: 3,\n runtime: true,\n error: new Error('Third error message'),\n frames: () =>\n Promise.resolve([\n {\n error: true,\n reason: 'Third error message',\n external: false,\n ignored: false,\n sourceStackFrame,\n originalStackFrame,\n originalCodeFrame: originalCodeFrame('Third error message'),\n },\n ]),\n },\n {\n id: 4,\n runtime: true,\n error: new Error('Fourth error message'),\n frames: () =>\n Promise.resolve([\n {\n error: true,\n reason: 'Fourth error message',\n external: false,\n ignored: false,\n sourceStackFrame,\n originalStackFrame,\n originalCodeFrame: originalCodeFrame('Fourth error message'),\n },\n ]),\n },\n]\n\nexport const Default: Story = {\n args: {\n runtimeErrors,\n versionInfo: {\n installed: '15.0.0',\n staleness: 'fresh',\n },\n debugInfo: { devtoolsFrontendUrl: undefined },\n isTurbopack: false,\n onClose: () => {},\n },\n}\n\nexport const Turbopack: Story = {\n args: {\n ...Default.args,\n isTurbopack: true,\n },\n}\n\nexport const VeryLongErrorMessage: Story = {\n args: {\n ...Default.args,\n runtimeErrors: [\n {\n ...runtimeErrors[0],\n error: Object.assign(new Error(lorem)),\n },\n ],\n },\n}\n\nexport const WithHydrationWarning: Story = {\n args: {\n runtimeErrors: [\n {\n id: 1,\n runtime: true,\n error: Object.assign(new Error('Hydration error'), {\n details: {\n warning: [\n 'Text content does not match server-rendered HTML: \"%s\" !== \"%s\"',\n 'Server Content',\n 'Client Content',\n ],\n reactOutputComponentDiff: `<MyComponent>\n <ParentComponent>\n <div>\n- <p> hello world and welcome to my amazing website with lots of content hello world and welcome to my amazing website with lots of content </p>\n+ <div> hello world and welcome to my amazing website with lots of content hello world and welcome to my amazing website with lots of content </div>`,\n },\n componentStackFrames: [\n {\n component: 'MyComponent',\n file: 'app/page.tsx',\n lineNumber: 10,\n columnNumber: 5,\n },\n {\n component: 'ParentComponent',\n file: 'app/layout.tsx',\n lineNumber: 20,\n columnNumber: 3,\n },\n ],\n }),\n frames: () =>\n Promise.resolve([\n {\n error: true,\n reason: 'First error message',\n external: false,\n ignored: false,\n sourceStackFrame: {\n file: 'app/page.tsx',\n methodName: 'Home',\n arguments: [],\n lineNumber: 10,\n column: 5,\n },\n },\n ]),\n },\n ],\n debugInfo: { devtoolsFrontendUrl: undefined },\n onClose: () => {},\n },\n}\n"],"names":["Default","Turbopack","VeryLongErrorMessage","WithHydrationWarning","meta","component","Errors","parameters","layout","decorators","withShadowPortal","originalCodeFrame","message","sourceStackFrame","file","methodName","arguments","lineNumber","column","originalStackFrame","ignored","frame","error","reason","external","ignoredFrame","runtimeErrors","id","runtime","Error","frames","Promise","resolve","Array","fill","args","versionInfo","installed","staleness","debugInfo","devtoolsFrontendUrl","undefined","isTurbopack","onClose","Object","assign","lorem","details","warning","reactOutputComponentDiff","componentStackFrames","columnNumber"],"mappings":"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"}

package/dist/client/components/react-dev-overlay/_experimental/internal/container/runtime-error/component-stack-pseudo-html.js CHANGED Viewed

@@ -25,7 +25,7 @@ const _nooptemplate = require("../../helpers/noop-template");
 const _diffview = require("../../../../hydration-diff/diff-view");
 function _templateObject() {
     const data = _tagged_template_literal_loose._([
-        "\n  [data-nextjs-container-errors-pseudo-html] {\n    margin: var(--size-2) 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-font-smaller);\n    line-height: var(--size-4);\n    border-radius: var(--size-2);\n  }\n  [data-nextjs-container-errors-pseudo-html-line] {\n    display: inline-block;\n    width: 100%;\n    padding-left: var(--size-10);\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: var(--size-3);\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(var(--size-6) * -1);\n    margin-right: var(--size-6);\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(var(--size-6) * -1);\n    margin-right: var(--size-6);\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] {\n    padding: var(--size-2) 0;\n    margin: var(--size-2) 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-font-smaller);\n    line-height: var(--size-4);\n    border-radius: var(--size-2);\n  }\n  [data-nextjs-container-errors-pseudo-html-line] {\n    display: inline-block;\n    width: 100%;\n    padding-left: var(--size-10);\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: var(--size-3);\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(var(--size-6) * -1);\n    margin-right: var(--size-6);\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(var(--size-6) * -1);\n    margin-right: var(--size-6);\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: 100px;\n    mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, black 50%);\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  [data-nextjs-container-errors-pseudo-html--diff='error'] {\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"
     ]);
     _templateObject = function() {

package/dist/client/components/react-dev-overlay/_experimental/internal/container/runtime-error/component-stack-pseudo-html.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/container/runtime-error/component-stack-pseudo-html.tsx"],"sourcesContent":["import { noop as css } from '../../helpers/noop-template'\n\nexport { PseudoHtmlDiff } from '../../../../hydration-diff/diff-view'\n\nexport const PSEUDO_HTML_DIFF_STYLES = css`\n [data-nextjs-container-errors-pseudo-html] {\n margin: var(--size-2) 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-font-smaller);\n line-height: var(--size-4);\n border-radius: var(--size-2);\n }\n [data-nextjs-container-errors-pseudo-html-line] {\n display: inline-block;\n width: 100%;\n padding-left: var(--size-10);\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: var(--size-3);\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(var(--size-6) * -1);\n margin-right: var(--size-6);\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(var(--size-6) * -1);\n margin-right: var(--size-6);\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: 100px;\n mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, black 50%);\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 [data-nextjs-container-errors-pseudo-html--diff='error'] {\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":["PSEUDO_HTML_DIFF_STYLES","PseudoHtmlDiff","css"],"mappings":";;;;;;;;;;;;;;;IAIaA,uBAAuB;eAAvBA;;IAFJC,cAAc;eAAdA,wBAAc;;;;8BAFK;0BAEG;;;;;;;;;;;AAExB,MAAMD,8BAA0BE,kBAAG,~~qBAoDU~~"}
1	+ {"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/container/runtime-error/component-stack-pseudo-html.tsx"],"sourcesContent":["import { noop as css } from '../../helpers/noop-template'\n\nexport { PseudoHtmlDiff } from '../../../../hydration-diff/diff-view'\n\nexport const PSEUDO_HTML_DIFF_STYLES = css`\n [data-nextjs-container-errors-pseudo-html] {\n padding: var(--size-2) 0;\n margin: var(--size-2) 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-font-smaller);\n line-height: var(--size-4);\n border-radius: var(--size-2);\n }\n [data-nextjs-container-errors-pseudo-html-line] {\n display: inline-block;\n width: 100%;\n padding-left: var(--size-10);\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: var(--size-3);\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(var(--size-6) * -1);\n margin-right: var(--size-6);\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(var(--size-6) * -1);\n margin-right: var(--size-6);\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: 100px;\n mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, black 50%);\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 [data-nextjs-container-errors-pseudo-html--diff='error'] {\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":["PSEUDO_HTML_DIFF_STYLES","PseudoHtmlDiff","css"],"mappings":";;;;;;;;;;;;;;;IAIaA,uBAAuB;eAAvBA;;IAFJC,cAAc;eAAdA,wBAAc;;;;8BAFK;0BAEG;;;;;;;;;;;AAExB,MAAMD,8BAA0BE,kBAAG,qBAqDU"}

package/dist/client/components/react-dev-overlay/_experimental/internal/container/runtime-error/render-error.d.ts CHANGED Viewed

@@ -6,7 +6,7 @@ export type SupportedErrorEvent = {
 };
 type Props = {
     children: (params: {
-        readyErrors: ReadyRuntimeError[];
+        runtimeErrors: ReadyRuntimeError[];
         totalErrorCount: number;
     }) => React.ReactNode;
     state: OverlayState;

package/dist/client/components/react-dev-overlay/_experimental/internal/container/runtime-error/render-error.js CHANGED Viewed

@@ -39,10 +39,9 @@ const RenderError = (props)=>{
 };
 const RenderRuntimeError = (param)=>{
     let { children, state, isAppDir } = param;
-    var _process_env___NEXT_DEV_INDICATOR;
     const { errors } = state;
     const [lookups, setLookups] = (0, _react.useState)({});
-    const [readyErrors, nextError] = (0, _react.useMemo)(()=>{
+    const [runtimeErrors, nextError] = (0, _react.useMemo)(()=>{
         let ready = [];
         let next = null;
         // Ensure errors are displayed in the order they occurred in:
@@ -94,23 +93,16 @@ const RenderRuntimeError = (param)=>{
         nextError,
         isAppDir
     ]);
-    // Stringify since __NEXT_DEV_INDICATOR can be set to boolean false.
-    const hasDisabledDevIndicator = ((_process_env___NEXT_DEV_INDICATOR = process.env.__NEXT_DEV_INDICATOR) == null ? void 0 : _process_env___NEXT_DEV_INDICATOR.toString()) === 'false';
-    const totalErrorCount = readyErrors.length;
-    // Even if the dev indicator is disabled, we should show it
-    // along with the error overlay when there are errors.
-    if (hasDisabledDevIndicator && !totalErrorCount) {
-        return null;
-    }
+    const totalErrorCount = runtimeErrors.length;
     return children({
-        readyErrors,
+        runtimeErrors,
         totalErrorCount
     });
 };
 const RenderBuildError = (param)=>{
     let { children } = param;
     return children({
-        readyErrors: [],
+        runtimeErrors: [],
         // Build errors and missing root layout tags persist until fixed,
         // so we can set a fixed error count of 1
         totalErrorCount: 1

package/dist/client/components/react-dev-overlay/_experimental/internal/container/runtime-error/render-error.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/container/runtime-error/render-error.tsx"],"sourcesContent":["import type {\n OverlayState,\n UnhandledErrorAction,\n UnhandledRejectionAction,\n} from '../../../../shared'\n\nimport { useMemo, useState, useEffect } from 'react'\nimport {\n ACTION_UNHANDLED_ERROR,\n ACTION_UNHANDLED_REJECTION,\n} from '../../../../shared'\nimport {\n getErrorByType,\n type ReadyRuntimeError,\n} from '../../../../internal/helpers/get-error-by-type'\n\nexport type SupportedErrorEvent = {\n id: number\n event: UnhandledErrorAction \| UnhandledRejectionAction\n}\n\nfunction getErrorSignature(ev: SupportedErrorEvent): string {\n const { event } = ev\n // eslint-disable-next-line default-case -- TypeScript checks this\n switch (event.type) {\n case ACTION_UNHANDLED_ERROR:\n case ACTION_UNHANDLED_REJECTION: {\n return `${event.reason.name}::${event.reason.message}::${event.reason.stack}`\n }\n }\n}\n\ntype Props = {\n children: (params: {\n ~~readyErrors~~: ReadyRuntimeError[]\n totalErrorCount: number\n }) => React.ReactNode\n state: OverlayState\n isAppDir: boolean\n}\n\nexport const RenderError = (props: Props) => {\n const { state } = props\n const isBuildError =\n !!state.rootLayoutMissingTags?.length \|\| !!state.buildError\n\n if (isBuildError) {\n return <RenderBuildError {...props} />\n } else {\n return <RenderRuntimeError {...props} />\n }\n}\n\nconst RenderRuntimeError = ({ children, state, isAppDir }: Props) => {\n const { errors } = state\n\n const [lookups, setLookups] = useState<{\n [eventId: string]: ReadyRuntimeError\n }>({})\n\n const [~~readyErrors~~, nextError] = useMemo<\n [ReadyRuntimeError[], SupportedErrorEvent \| null]\n >(() => {\n let ready: ReadyRuntimeError[] = []\n let next: SupportedErrorEvent \| null = null\n\n // Ensure errors are displayed in the order they occurred in:\n for (let idx = 0; idx < errors.length; ++idx) {\n const e = errors[idx]\n const { id } = e\n if (id in lookups) {\n ready.push(lookups[id])\n continue\n }\n\n // Check for duplicate errors\n if (idx > 0) {\n const prev = errors[idx - 1]\n if (getErrorSignature(prev) === getErrorSignature(e)) {\n continue\n }\n }\n\n next = e\n break\n }\n\n return [ready, next]\n }, [errors, lookups])\n\n useEffect(() => {\n if (nextError == null) {\n return\n }\n\n let mounted = true\n\n getErrorByType(nextError, isAppDir).then((resolved) => {\n if (mounted) {\n // We don't care if the desired error changed while we were resolving,\n // thus we're not tracking it using a ref. Once the work has been done,\n // we'll store it.\n setLookups((m) => ({ ...m, [resolved.id]: resolved }))\n }\n })\n\n return () => {\n mounted = false\n }\n }, [nextError, isAppDir])\n\n ~~// Stringify since __NEXT_DEV_INDICATOR can be set to boolean false.\n~~ const ~~hasDisabledDevIndicator =\n process.env.__NEXT_DEV_INDICATOR?.toString() === 'false'\n const~~ totalErrorCount = ~~readyErrors~~.length\n\n ~~// Even if the dev indicator is disabled, we should show it\n // along with the error overlay when there are errors.\n if (hasDisabledDevIndicator && !totalErrorCount) {\n~~ return ~~null\n }\n\n return~~ children({ ~~readyErrors~~, totalErrorCount })\n}\n\nconst RenderBuildError = ({ children }: Props) => {\n return children({\n ~~readyErrors~~: [],\n // Build errors and missing root layout tags persist until fixed,\n // so we can set a fixed error count of 1\n totalErrorCount: 1,\n })\n}\n"],"names":["RenderError","getErrorSignature","ev","event","type","ACTION_UNHANDLED_ERROR","ACTION_UNHANDLED_REJECTION","reason","name","message","stack","props","state","isBuildError","rootLayoutMissingTags","length","buildError","RenderBuildError","RenderRuntimeError","children","isAppDir","~~process","~~errors","lookups","setLookups","useState","~~readyErrors~~","nextError","useMemo","ready","next","idx","e","id","push","prev","useEffect","mounted","getErrorByType","then","resolved","m","~~hasDisabledDevIndicator","env","__NEXT_DEV_INDICATOR","toString","~~totalErrorCount"],"mappings":";;;;+BAyCaA;;;eAAAA;;;;uBAnCgC;wBAItC;gCAIA;AAOP,SAASC,kBAAkBC,EAAuB;IAChD,MAAM,EAAEC,KAAK,EAAE,GAAGD;IAClB,kEAAkE;IAClE,OAAQC,MAAMC,IAAI;QAChB,KAAKC,8BAAsB;QAC3B,KAAKC,kCAA0B;YAAE;gBAC/B,OAAO,AAAGH,MAAMI,MAAM,CAACC,IAAI,GAAC,OAAIL,MAAMI,MAAM,CAACE,OAAO,GAAC,OAAIN,MAAMI,MAAM,CAACG,KAAK;YAC7E;IACF;AACF;AAWO,MAAMV,cAAc,CAACW;QAGtBC;IAFJ,MAAM,EAAEA,KAAK,EAAE,GAAGD;IAClB,MAAME,eACJ,CAAC,GAACD,+BAAAA,MAAME,qBAAqB,qBAA3BF,6BAA6BG,MAAM,KAAI,CAAC,CAACH,MAAMI,UAAU;IAE7D,IAAIH,cAAc;QAChB,qBAAO,qBAACI;YAAkB,GAAGN,KAAK;;IACpC,OAAO;QACL,qBAAO,qBAACO;YAAoB,GAAGP,KAAK;;IACtC;AACF;AAEA,MAAMO,qBAAqB;QAAC,EAAEC,QAAQ,EAAEP,KAAK,EAAEQ,QAAQ,EAAS;~~QA4D5DC;IA3DF~~,MAAM,EAAEC,MAAM,EAAE,~~GAAGV~~;IAEnB,MAAM,~~CAACW~~,SAASC,WAAW,GAAGC,IAAAA,eAAQ,EAEnC,CAAC;IAEJ,MAAM,CAACC,~~aAAaC~~,UAAU,GAAGC,IAAAA,cAAO,~~EAEtC~~;QACA,IAAIC,QAA6B,EAAE;QACnC,IAAIC,OAAmC;QAEvC,6DAA6D;QAC7D,IAAK,IAAIC,MAAM,GAAGA,MAAMT,~~OAAOP~~,MAAM,EAAE,~~EAAEgB~~,IAAK;YAC5C,MAAMC,IAAIV,MAAM,CAACS,IAAI;YACrB,MAAM,EAAEE,EAAE,EAAE,GAAGD;YACf,IAAIC,MAAMV,SAAS;gBACjBM,MAAMK,IAAI,CAACX,OAAO,CAACU,GAAG;gBACtB;YACF;YAEA,6BAA6B;YAC7B,IAAIF,MAAM,GAAG;gBACX,MAAMI,OAAOb,MAAM,CAACS,MAAM,EAAE;gBAC5B,~~IAAI9B~~,~~kBAAkBkC~~,~~UAAUlC~~,~~kBAAkB+B~~,IAAI;oBACpD;gBACF;YACF;YAEAF,OAAOE;YACP;QACF;QAEA,OAAO;YAACH;YAAOC;SAAK;IACtB,GAAG;QAACR;QAAQC;KAAQ;IAEpBa,IAAAA,gBAAS,EAAC;QACR,IAAIT,aAAa,MAAM;YACrB;QACF;QAEA,IAAIU,UAAU;QAEdC,IAAAA,8BAAc,EAACX,~~WAAWP~~,~~UAAUmB~~,IAAI,CAAC,CAACC;YACxC,IAAIH,SAAS;gBACX,sEAAsE;gBACtE,uEAAuE;gBACvE,kBAAkB;gBAClBb,WAAW,CAACiB,IAAO,CAAA;wBAAE,GAAGA,CAAC;wBAAE,CAACD,SAASP,EAAE,CAAC,EAAEO;oBAAS,CAAA;YACrD;QACF;QAEA,OAAO;YACLH,UAAU;QACZ;IACF,GAAG;QAACV;~~QAAWP~~;KAAS;IAExB,~~oEAAoE;IACpE~~,~~MAAMsB~~,~~0BACJrB~~,~~EAAAA,oCAAAA,QAAQsB,GAAG,CAACC,oBAAoB,qBAAhCvB,kCAAkCwB,QAAQ,QAAO;IACnD,MAAMC,kBAAkBpB,YAAYX,~~MAAM;~~IAE1C~~,~~2DAA2D;IAC3D~~,~~sDAAsD;IACtD,IAAI2B,2BAA2B,CAACI,iBAAiB;QAC/C,OAAO;IACT;IAEA,OAAO3B,~~SAAS;~~QAAEO~~;~~QAAaoB~~;IAAgB;~~AACjD~~;AAEA,~~MAAM7B~~,mBAAmB;QAAC,EAAEE,QAAQ,EAAS;IAC3C,OAAOA,SAAS;~~QACdO~~,~~aAAa~~,EAAE;~~QACf~~,iEAAiE;QACjE,yCAAyC;~~QACzCoB~~,iBAAiB;IACnB;AACF"}
1	+ {"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/container/runtime-error/render-error.tsx"],"sourcesContent":["import type {\n OverlayState,\n UnhandledErrorAction,\n UnhandledRejectionAction,\n} from '../../../../shared'\n\nimport { useMemo, useState, useEffect } from 'react'\nimport {\n ACTION_UNHANDLED_ERROR,\n ACTION_UNHANDLED_REJECTION,\n} from '../../../../shared'\nimport {\n getErrorByType,\n type ReadyRuntimeError,\n} from '../../../../internal/helpers/get-error-by-type'\n\nexport type SupportedErrorEvent = {\n id: number\n event: UnhandledErrorAction \| UnhandledRejectionAction\n}\n\nfunction getErrorSignature(ev: SupportedErrorEvent): string {\n const { event } = ev\n // eslint-disable-next-line default-case -- TypeScript checks this\n switch (event.type) {\n case ACTION_UNHANDLED_ERROR:\n case ACTION_UNHANDLED_REJECTION: {\n return `${event.reason.name}::${event.reason.message}::${event.reason.stack}`\n }\n }\n}\n\ntype Props = {\n children: (params: {\n runtimeErrors: ReadyRuntimeError[]\n totalErrorCount: number\n }) => React.ReactNode\n state: OverlayState\n isAppDir: boolean\n}\n\nexport const RenderError = (props: Props) => {\n const { state } = props\n const isBuildError =\n !!state.rootLayoutMissingTags?.length \|\| !!state.buildError\n\n if (isBuildError) {\n return <RenderBuildError {...props} />\n } else {\n return <RenderRuntimeError {...props} />\n }\n}\n\nconst RenderRuntimeError = ({ children, state, isAppDir }: Props) => {\n const { errors } = state\n\n const [lookups, setLookups] = useState<{\n [eventId: string]: ReadyRuntimeError\n }>({})\n\n const [runtimeErrors, nextError] = useMemo<\n [ReadyRuntimeError[], SupportedErrorEvent \| null]\n >(() => {\n let ready: ReadyRuntimeError[] = []\n let next: SupportedErrorEvent \| null = null\n\n // Ensure errors are displayed in the order they occurred in:\n for (let idx = 0; idx < errors.length; ++idx) {\n const e = errors[idx]\n const { id } = e\n if (id in lookups) {\n ready.push(lookups[id])\n continue\n }\n\n // Check for duplicate errors\n if (idx > 0) {\n const prev = errors[idx - 1]\n if (getErrorSignature(prev) === getErrorSignature(e)) {\n continue\n }\n }\n\n next = e\n break\n }\n\n return [ready, next]\n }, [errors, lookups])\n\n useEffect(() => {\n if (nextError == null) {\n return\n }\n\n let mounted = true\n\n getErrorByType(nextError, isAppDir).then((resolved) => {\n if (mounted) {\n // We don't care if the desired error changed while we were resolving,\n // thus we're not tracking it using a ref. Once the work has been done,\n // we'll store it.\n setLookups((m) => ({ ...m, [resolved.id]: resolved }))\n }\n })\n\n return () => {\n mounted = false\n }\n }, [nextError, isAppDir])\n\n const totalErrorCount = runtimeErrors.length\n\n return children({ runtimeErrors, totalErrorCount })\n}\n\nconst RenderBuildError = ({ children }: Props) => {\n return children({\n runtimeErrors: [],\n // Build errors and missing root layout tags persist until fixed,\n // so we can set a fixed error count of 1\n totalErrorCount: 1,\n })\n}\n"],"names":["RenderError","getErrorSignature","ev","event","type","ACTION_UNHANDLED_ERROR","ACTION_UNHANDLED_REJECTION","reason","name","message","stack","props","state","isBuildError","rootLayoutMissingTags","length","buildError","RenderBuildError","RenderRuntimeError","children","isAppDir","errors","lookups","setLookups","useState","runtimeErrors","nextError","useMemo","ready","next","idx","e","id","push","prev","useEffect","mounted","getErrorByType","then","resolved","m","totalErrorCount"],"mappings":";;;;+BAyCaA;;;eAAAA;;;;uBAnCgC;wBAItC;gCAIA;AAOP,SAASC,kBAAkBC,EAAuB;IAChD,MAAM,EAAEC,KAAK,EAAE,GAAGD;IAClB,kEAAkE;IAClE,OAAQC,MAAMC,IAAI;QAChB,KAAKC,8BAAsB;QAC3B,KAAKC,kCAA0B;YAAE;gBAC/B,OAAO,AAAGH,MAAMI,MAAM,CAACC,IAAI,GAAC,OAAIL,MAAMI,MAAM,CAACE,OAAO,GAAC,OAAIN,MAAMI,MAAM,CAACG,KAAK;YAC7E;IACF;AACF;AAWO,MAAMV,cAAc,CAACW;QAGtBC;IAFJ,MAAM,EAAEA,KAAK,EAAE,GAAGD;IAClB,MAAME,eACJ,CAAC,GAACD,+BAAAA,MAAME,qBAAqB,qBAA3BF,6BAA6BG,MAAM,KAAI,CAAC,CAACH,MAAMI,UAAU;IAE7D,IAAIH,cAAc;QAChB,qBAAO,qBAACI;YAAkB,GAAGN,KAAK;;IACpC,OAAO;QACL,qBAAO,qBAACO;YAAoB,GAAGP,KAAK;;IACtC;AACF;AAEA,MAAMO,qBAAqB;QAAC,EAAEC,QAAQ,EAAEP,KAAK,EAAEQ,QAAQ,EAAS;IAC9D,MAAM,EAAEC,MAAM,EAAE,GAAGT;IAEnB,MAAM,CAACU,SAASC,WAAW,GAAGC,IAAAA,eAAQ,EAEnC,CAAC;IAEJ,MAAM,CAACC,eAAeC,UAAU,GAAGC,IAAAA,cAAO,EAExC;QACA,IAAIC,QAA6B,EAAE;QACnC,IAAIC,OAAmC;QAEvC,6DAA6D;QAC7D,IAAK,IAAIC,MAAM,GAAGA,MAAMT,OAAON,MAAM,EAAE,EAAEe,IAAK;YAC5C,MAAMC,IAAIV,MAAM,CAACS,IAAI;YACrB,MAAM,EAAEE,EAAE,EAAE,GAAGD;YACf,IAAIC,MAAMV,SAAS;gBACjBM,MAAMK,IAAI,CAACX,OAAO,CAACU,GAAG;gBACtB;YACF;YAEA,6BAA6B;YAC7B,IAAIF,MAAM,GAAG;gBACX,MAAMI,OAAOb,MAAM,CAACS,MAAM,EAAE;gBAC5B,IAAI7B,kBAAkBiC,UAAUjC,kBAAkB8B,IAAI;oBACpD;gBACF;YACF;YAEAF,OAAOE;YACP;QACF;QAEA,OAAO;YAACH;YAAOC;SAAK;IACtB,GAAG;QAACR;QAAQC;KAAQ;IAEpBa,IAAAA,gBAAS,EAAC;QACR,IAAIT,aAAa,MAAM;YACrB;QACF;QAEA,IAAIU,UAAU;QAEdC,IAAAA,8BAAc,EAACX,WAAWN,UAAUkB,IAAI,CAAC,CAACC;YACxC,IAAIH,SAAS;gBACX,sEAAsE;gBACtE,uEAAuE;gBACvE,kBAAkB;gBAClBb,WAAW,CAACiB,IAAO,CAAA;wBAAE,GAAGA,CAAC;wBAAE,CAACD,SAASP,EAAE,CAAC,EAAEO;oBAAS,CAAA;YACrD;QACF;QAEA,OAAO;YACLH,UAAU;QACZ;IACF,GAAG;QAACV;QAAWN;KAAS;IAExB,MAAMqB,kBAAkBhB,cAAcV,MAAM;IAE5C,OAAOI,SAAS;QAAEM;QAAegB;IAAgB;AACnD;AAEA,MAAMxB,mBAAmB;QAAC,EAAEE,QAAQ,EAAS;IAC3C,OAAOA,SAAS;QACdM,eAAe,EAAE;QACjB,iEAAiE;QACjE,yCAAyC;QACzCgB,iBAAiB;IACnB;AACF"}

package/dist/client/components/react-dev-overlay/_experimental/internal/icons/collapse-icon.js CHANGED Viewed

@@ -23,7 +23,9 @@ function CollapseIcon(param) {
             }
         } : {},
         children: /*#__PURE__*/ (0, _jsxruntime.jsx)("path", {
-            fill: "#666",
+            style: {
+                fill: 'var(--color-font)'
+            },
             fillRule: "evenodd",
             d: "m6.75 3.94.53.53 2.824 2.823a1 1 0 0 1 0 1.414L7.28 11.53l-.53.53L5.69 11l.53-.53L8.69 8 6.22 5.53 5.69 5l1.06-1.06Z",
             clipRule: "evenodd"

package/dist/client/components/react-dev-overlay/_experimental/internal/icons/collapse-icon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/icons/collapse-icon.tsx"],"sourcesContent":["export function CollapseIcon({ collapsed }: { collapsed?: boolean } = {}) {\n return (\n <svg\n data-nextjs-call-stack-chevron-icon\n data-collapsed={collapsed}\n width=\"16\"\n height=\"16\"\n fill=\"none\"\n // rotate 90 degrees if not collapsed.\n {...(typeof collapsed === 'boolean'\n ? { style: { transform: collapsed ? undefined : 'rotate(90deg)' } }\n : {})}\n >\n <path\n fill~~=\"#666~~\"\n fillRule=\"evenodd\"\n d=\"m6.75 3.94.53.53 2.824 2.823a1 1 0 0 1 0 1.414L7.28 11.53l-.53.53L5.69 11l.53-.53L8.69 8 6.22 5.53 5.69 5l1.06-1.06Z\"\n clipRule=\"evenodd\"\n />\n </svg>\n )\n}\n"],"names":["CollapseIcon","collapsed","svg","data-nextjs-call-stack-chevron-icon","data-collapsed","width","height","fill","style","transform","undefined","path","fillRule","d","clipRule"],"mappings":";;;;+BAAgBA;;;eAAAA;;;;AAAT,SAASA,aAAa;IAAA,IAAA,EAAEC,SAAS,EAA2B,GAAtC,mBAAyC,CAAC,IAA1C;IAC3B,qBACE,qBAACC;QACCC,qCAAmC;QACnCC,kBAAgBH;QAChBI,OAAM;QACNC,QAAO;QACPC,MAAK;QAEJ,GAAI,OAAON,cAAc,YACtB;YAAEO,OAAO;gBAAEC,WAAWR,YAAYS,YAAY;YAAgB;QAAE,IAChE,CAAC,CAAC;kBAEN,cAAA,qBAACC;~~YACCJ~~,~~MAAK~~;~~YACLK~~,UAAS;YACTC,GAAE;YACFC,UAAS;;;AAIjB"}
1	+ {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/icons/collapse-icon.tsx"],"sourcesContent":["export function CollapseIcon({ collapsed }: { collapsed?: boolean } = {}) {\n return (\n <svg\n data-nextjs-call-stack-chevron-icon\n data-collapsed={collapsed}\n width=\"16\"\n height=\"16\"\n fill=\"none\"\n // rotate 90 degrees if not collapsed.\n {...(typeof collapsed === 'boolean'\n ? { style: { transform: collapsed ? undefined : 'rotate(90deg)' } }\n : {})}\n >\n <path\n style={{ fill: 'var(--color-font)' }}\n fillRule=\"evenodd\"\n d=\"m6.75 3.94.53.53 2.824 2.823a1 1 0 0 1 0 1.414L7.28 11.53l-.53.53L5.69 11l.53-.53L8.69 8 6.22 5.53 5.69 5l1.06-1.06Z\"\n clipRule=\"evenodd\"\n />\n </svg>\n )\n}\n"],"names":["CollapseIcon","collapsed","svg","data-nextjs-call-stack-chevron-icon","data-collapsed","width","height","fill","style","transform","undefined","path","fillRule","d","clipRule"],"mappings":";;;;+BAAgBA;;;eAAAA;;;;AAAT,SAASA,aAAa;IAAA,IAAA,EAAEC,SAAS,EAA2B,GAAtC,mBAAyC,CAAC,IAA1C;IAC3B,qBACE,qBAACC;QACCC,qCAAmC;QACnCC,kBAAgBH;QAChBI,OAAM;QACNC,QAAO;QACPC,MAAK;QAEJ,GAAI,OAAON,cAAc,YACtB;YAAEO,OAAO;gBAAEC,WAAWR,YAAYS,YAAY;YAAgB;QAAE,IAChE,CAAC,CAAC;kBAEN,cAAA,qBAACC;YACCH,OAAO;gBAAED,MAAM;YAAoB;YACnCK,UAAS;YACTC,GAAE;YACFC,UAAS;;;AAIjB"}

package/dist/client/components/react-dev-overlay/_experimental/internal/icons/stop-icon.d.ts ADDED Viewed

	@@ -0,0 +1 @@
1	+ export declare function StopIcon(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;

package/dist/client/components/react-dev-overlay/_experimental/internal/icons/stop-icon.js ADDED Viewed

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "StopIcon", {
+    enumerable: true,
+    get: function() {
+        return StopIcon;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+function StopIcon(props) {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "16",
+        height: "16",
+        viewBox: "0 0 16 16",
+        ...props,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("path", {
+            fillRule: "evenodd",
+            clipRule: "evenodd",
+            d: "M14.5 8C14.5 11.5899 11.5899 14.5 8 14.5C4.41015 14.5 1.5 11.5899 1.5 8C1.5 4.41015 4.41015 1.5 8 1.5C11.5899 1.5 14.5 4.41015 14.5 8ZM16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM5 7.25H4.25V8.75H5H11H11.75V7.25H11H5Z",
+            fill: "#666"
+        })
+    });
+}
+if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
+  Object.defineProperty(exports.default, '__esModule', { value: true });
+  Object.assign(exports.default, exports);
+  module.exports = exports.default;
+}
+//# sourceMappingURL=stop-icon.js.map

package/dist/client/components/react-dev-overlay/_experimental/internal/icons/stop-icon.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/icons/stop-icon.tsx"],"sourcesContent":["export function StopIcon(props: React.SVGProps<SVGSVGElement>) {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M14.5 8C14.5 11.5899 11.5899 14.5 8 14.5C4.41015 14.5 1.5 11.5899 1.5 8C1.5 4.41015 4.41015 1.5 8 1.5C11.5899 1.5 14.5 4.41015 14.5 8ZM16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM5 7.25H4.25V8.75H5H11H11.75V7.25H11H5Z\"\n fill=\"#666\"\n />\n </svg>\n )\n}\n"],"names":["StopIcon","props","svg","xmlns","width","height","viewBox","path","fillRule","clipRule","d","fill"],"mappings":";;;;+BAAgBA;;;eAAAA;;;;AAAT,SAASA,SAASC,KAAoC;IAC3D,qBACE,qBAACC;QACCC,OAAM;QACNC,OAAM;QACNC,QAAO;QACPC,SAAQ;QACP,GAAGL,KAAK;kBAET,cAAA,qBAACM;YACCC,UAAS;YACTC,UAAS;YACTC,GAAE;YACFC,MAAK;;;AAIb"}

package/dist/client/components/react-dev-overlay/_experimental/internal/styles/base.js CHANGED Viewed

@@ -15,8 +15,8 @@ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _nooptemplate = require("../helpers/noop-template");
 function _templateObject() {
     const data = _tagged_template_literal_loose._([
-        "\n        @import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500;600&display=swap');\n\n        :host {\n          ",
-        "\n\n          --size-gap-half: 4px;\n          --size-gap: 8px;\n          --size-gap-double: 16px;\n          --size-gap-triple: 24px;\n          --size-gap-quad: 32px;\n\n          --size-font-11: 11px;\n          --size-font-smaller: 12px;\n          --size-font-small: 14px;\n          --size-font: 16px;\n          --size-font-big: 20px;\n          --size-font-bigger: 24px;\n\n          --color-background: white;\n          --color-font: #757575;\n          --color-backdrop: rgba(250, 250, 250, 0.8);\n          --color-border-shadow: rgba(0, 0, 0, 0.145);\n\n          --color-title-color: #1f1f1f;\n          --color-stack-h6: #222;\n          --color-stack-headline: #666;\n          --color-stack-subline: #999;\n          --color-stack-notes: #777;\n\n          --color-accents-1: #808080;\n          --color-accents-2: #222222;\n          --color-accents-3: #404040;\n\n          --color-text-color-red-1: #ff5555;\n          --color-text-background-red-1: #fff9f9;\n\n          --font-stack-monospace: 'Geist Mono', 'SFMono-Regular', Consolas,\n            'Liberation Mono', Menlo, Courier, monospace;\n          --font-stack-sans: 'Geist', -apple-system, 'Source Sans Pro',\n            sans-serif;\n\n          font-family: var(--font-stack-sans);\n\n          /* TODO: Remove replaced ones. */\n          --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n          --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1),\n            0 1px 2px -1px rgb(0 0 0 / 0.1);\n          --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1),\n            0 2px 4px -2px rgb(0 0 0 / 0.1);\n          --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n            0 4px 6px -4px rgb(0 0 0 / 0.1);\n          --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),\n            0 8px 10px -6px rgb(0 0 0 / 0.1);\n          --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n          --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n          --shadow-none: 0 0 #0000;\n\n          --shadow-small: 0px 2px 2px rgba(0, 0, 0, 0.04);\n          --shadow-menu: 0px 1px 1px rgba(0, 0, 0, 0.02),\n            0px 4px 8px -4px rgba(0, 0, 0, 0.04),\n            0px 16px 24px -8px rgba(0, 0, 0, 0.06);\n\n          --focus-color: var(--color-blue-800);\n          --focus-ring: 2px solid var(--focus-color);\n\n          --timing-swift: cubic-bezier(0.23, 0.88, 0.26, 0.92);\n          --timing-overlay: cubic-bezier(0.175, 0.885, 0.32, 1.1);\n\n          --rounded-none: 0px;\n          --rounded-sm: 0.125rem; /* 2px */\n          --rounded-md: 0.25rem; /* 4px */\n          --rounded-lg: 0.5rem; /* 8px */\n          --rounded-xl: 0.75rem; /* 12px */\n          --rounded-2xl: 1rem; /* 16px */\n          --rounded-3xl: 1.5rem; /* 24px */\n          --rounded-full: 9999px;\n\n          --size-0: 0px;\n          --size-px: 1px;\n          --size-0_5: 0.125rem; /* 2px */\n          --size-1: 0.25rem; /* 4px */\n          --size-1_5: 0.375rem; /* 6px */\n          --size-2: 0.5rem; /* 8px */\n          --size-2_5: 0.625rem; /* 10px */\n          --size-3: 0.75rem; /* 12px */\n          --size-3_5: 0.875rem; /* 14px */\n          --size-4: 1rem; /* 16px */\n          --size-4_5: 1.125rem; /* 18px */\n          --size-5: 1.25rem; /* 20px */\n          --size-5_5: 1.375rem; /* 22px */\n          --size-6: 1.5rem; /* 24px */\n          --size-6_5: 1.625rem; /* 26px */\n          --size-7: 1.75rem; /* 28px */\n          --size-7_5: 1.875rem; /* 30px */\n          --size-8: 2rem; /* 32px */\n          --size-8_5: 2.125rem; /* 34px */\n          --size-9: 2.25rem; /* 36px */\n          --size-9_5: 2.375rem; /* 38px */\n          --size-10: 2.5rem; /* 40px */\n          --size-10_5: 2.625rem; /* 42px */\n          --size-11: 2.75rem; /* 44px */\n          --size-11_5: 2.875rem; /* 46px */\n          --size-12: 3rem; /* 48px */\n\n          @media print {\n            display: none;\n          }\n        }\n\n        @media (prefers-color-scheme: dark) {\n          :host {\n            --color-background: rgb(28, 28, 30);\n            --color-font: white;\n            --color-backdrop: rgb(0, 0, 0, 0.8);\n            --color-border-shadow: rgba(255, 255, 255, 0.145);\n\n            --color-title-color: #fafafa;\n            --color-stack-h6: rgb(200, 200, 204);\n            --color-stack-headline: rgb(99, 99, 102);\n            --color-stack-notes: #a9a9a9;\n            --color-stack-subline: rgb(121, 121, 121);\n\n            --color-accents-3: rgb(118, 118, 118);\n\n            --color-text-background-red-1: #2a1e1e;\n          }\n        }\n\n        .mono {\n          font-family: var(--font-stack-monospace);\n        }\n\n        h1,\n        h2,\n        h3,\n        h4,\n        h5,\n        h6 {\n          margin-bottom: var(--size-gap);\n          font-weight: 500;\n          line-height: 1.5;\n        }\n      "
+        "\n        :host {\n          ",
+        "\n\n          --size-gap-half: 4px;\n          --size-gap: 8px;\n          --size-gap-double: 16px;\n          --size-gap-triple: 24px;\n          --size-gap-quad: 32px;\n\n          --size-font-11: 11px;\n          --size-font-smaller: 12px;\n          --size-font-small: 14px;\n          --size-font: 16px;\n          --size-font-big: 20px;\n          --size-font-bigger: 24px;\n\n          --color-background: white;\n          --color-font: #757575;\n          --color-backdrop: rgba(250, 250, 250, 0.8);\n          --color-border-shadow: rgba(0, 0, 0, 0.145);\n\n          --color-title-color: #1f1f1f;\n          --color-stack-h6: #222;\n          --color-stack-headline: #666;\n          --color-stack-subline: #999;\n          --color-stack-notes: #777;\n\n          --color-accents-1: #808080;\n          --color-accents-2: #222222;\n          --color-accents-3: #404040;\n\n          --color-text-color-red-1: #ff5555;\n          --color-text-background-red-1: #fff9f9;\n\n          --font-stack-monospace: 'Geist Mono', 'SFMono-Regular', Consolas,\n            'Liberation Mono', Menlo, Courier, monospace;\n          --font-stack-sans: 'Geist', -apple-system, 'Source Sans Pro',\n            sans-serif;\n\n          font-family: var(--font-stack-sans);\n\n          /* TODO: Remove replaced ones. */\n          --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n          --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1),\n            0 1px 2px -1px rgb(0 0 0 / 0.1);\n          --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1),\n            0 2px 4px -2px rgb(0 0 0 / 0.1);\n          --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n            0 4px 6px -4px rgb(0 0 0 / 0.1);\n          --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),\n            0 8px 10px -6px rgb(0 0 0 / 0.1);\n          --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n          --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n          --shadow-none: 0 0 #0000;\n\n          --shadow-small: 0px 2px 2px rgba(0, 0, 0, 0.04);\n          --shadow-menu: 0px 1px 1px rgba(0, 0, 0, 0.02),\n            0px 4px 8px -4px rgba(0, 0, 0, 0.04),\n            0px 16px 24px -8px rgba(0, 0, 0, 0.06);\n\n          --focus-color: var(--color-blue-800);\n          --focus-ring: 2px solid var(--focus-color);\n\n          --timing-swift: cubic-bezier(0.23, 0.88, 0.26, 0.92);\n          --timing-overlay: cubic-bezier(0.175, 0.885, 0.32, 1.1);\n\n          --rounded-none: 0px;\n          --rounded-sm: 0.125rem; /* 2px */\n          --rounded-md: 0.25rem; /* 4px */\n          --rounded-md-2: 0.375rem; /* 6px */\n          --rounded-lg: 0.5rem; /* 8px */\n          --rounded-xl: 0.75rem; /* 12px */\n          --rounded-2xl: 1rem; /* 16px */\n          --rounded-3xl: 1.5rem; /* 24px */\n          --rounded-full: 9999px;\n\n          --size-0: 0px;\n          --size-px: 1px;\n          --size-0_5: 0.125rem; /* 2px */\n          --size-1: 0.25rem; /* 4px */\n          --size-1_5: 0.375rem; /* 6px */\n          --size-2: 0.5rem; /* 8px */\n          --size-2_5: 0.625rem; /* 10px */\n          --size-3: 0.75rem; /* 12px */\n          --size-3_5: 0.875rem; /* 14px */\n          --size-4: 1rem; /* 16px */\n          --size-4_5: 1.125rem; /* 18px */\n          --size-5: 1.25rem; /* 20px */\n          --size-5_5: 1.375rem; /* 22px */\n          --size-6: 1.5rem; /* 24px */\n          --size-6_5: 1.625rem; /* 26px */\n          --size-7: 1.75rem; /* 28px */\n          --size-7_5: 1.875rem; /* 30px */\n          --size-8: 2rem; /* 32px */\n          --size-8_5: 2.125rem; /* 34px */\n          --size-9: 2.25rem; /* 36px */\n          --size-9_5: 2.375rem; /* 38px */\n          --size-10: 2.5rem; /* 40px */\n          --size-10_5: 2.625rem; /* 42px */\n          --size-11: 2.75rem; /* 44px */\n          --size-11_5: 2.875rem; /* 46px */\n          --size-12: 3rem; /* 48px */\n\n          @media print {\n            display: none;\n          }\n        }\n\n        @media (prefers-color-scheme: dark) {\n          :host {\n            --color-background: rgb(28, 28, 30);\n            --color-font: white;\n            --color-backdrop: rgb(0, 0, 0, 0.8);\n            --color-border-shadow: rgba(255, 255, 255, 0.145);\n\n            --color-title-color: #fafafa;\n            --color-stack-h6: rgb(200, 200, 204);\n            --color-stack-headline: rgb(99, 99, 102);\n            --color-stack-notes: #a9a9a9;\n            --color-stack-subline: rgb(121, 121, 121);\n\n            --color-accents-3: rgb(118, 118, 118);\n\n            --color-text-background-red-1: #2a1e1e;\n          }\n        }\n\n        .mono {\n          font-family: var(--font-stack-monospace);\n        }\n\n        h1,\n        h2,\n        h3,\n        h4,\n        h5,\n        h6 {\n          margin-bottom: var(--size-gap);\n          font-weight: 500;\n          line-height: 1.5;\n        }\n      "
     ]);
     _templateObject = function() {
         return data;

package/dist/client/components/react-dev-overlay/_experimental/internal/styles/base.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/styles/base.tsx"],"sourcesContent":["import * as React from 'react'\nimport { noop as css } from '../helpers/noop-template'\n\nexport function Base() {\n return (\n <style>\n {css`\n ~~@import url('https://fonts.googleapis.com/css2?family=Geist~~:~~wght@400;500;600&family=Geist+Mono:wght@400;500;600&display=swap');\n\n :~~host {\n ${\n // Although the style applied to the shadow host is isolated,\n // the element that attached the shadow host (i.e. `nextjs-portal`)\n // is still affected by the parent's style (e.g. `body`). This may\n // occur style conflicts like `display: flex`, with other children\n // elements therefore give the shadow host an absolute position.\n 'position: absolute;'\n }\n\n --size-gap-half: 4px;\n --size-gap: 8px;\n --size-gap-double: 16px;\n --size-gap-triple: 24px;\n --size-gap-quad: 32px;\n\n --size-font-11: 11px;\n --size-font-smaller: 12px;\n --size-font-small: 14px;\n --size-font: 16px;\n --size-font-big: 20px;\n --size-font-bigger: 24px;\n\n --color-background: white;\n --color-font: #757575;\n --color-backdrop: rgba(250, 250, 250, 0.8);\n --color-border-shadow: rgba(0, 0, 0, 0.145);\n\n --color-title-color: #1f1f1f;\n --color-stack-h6: #222;\n --color-stack-headline: #666;\n --color-stack-subline: #999;\n --color-stack-notes: #777;\n\n --color-accents-1: #808080;\n --color-accents-2: #222222;\n --color-accents-3: #404040;\n\n --color-text-color-red-1: #ff5555;\n --color-text-background-red-1: #fff9f9;\n\n --font-stack-monospace: 'Geist Mono', 'SFMono-Regular', Consolas,\n 'Liberation Mono', Menlo, Courier, monospace;\n --font-stack-sans: 'Geist', -apple-system, 'Source Sans Pro',\n sans-serif;\n\n font-family: var(--font-stack-sans);\n\n /* TODO: Remove replaced ones. /\n --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1),\n 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),\n 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n --shadow-none: 0 0 #0000;\n\n --shadow-small: 0px 2px 2px rgba(0, 0, 0, 0.04);\n --shadow-menu: 0px 1px 1px rgba(0, 0, 0, 0.02),\n 0px 4px 8px -4px rgba(0, 0, 0, 0.04),\n 0px 16px 24px -8px rgba(0, 0, 0, 0.06);\n\n --focus-color: var(--color-blue-800);\n --focus-ring: 2px solid var(--focus-color);\n\n --timing-swift: cubic-bezier(0.23, 0.88, 0.26, 0.92);\n --timing-overlay: cubic-bezier(0.175, 0.885, 0.32, 1.1);\n\n --rounded-none: 0px;\n --rounded-sm: 0.125rem; / 2px /\n --rounded-md: 0.25rem; / 4px /\n --rounded-lg: 0.5rem; / 8px /\n --rounded-xl: 0.75rem; / 12px /\n --rounded-2xl: 1rem; / 16px /\n --rounded-3xl: 1.5rem; / 24px /\n --rounded-full: 9999px;\n\n --size-0: 0px;\n --size-px: 1px;\n --size-0_5: 0.125rem; / 2px /\n --size-1: 0.25rem; / 4px /\n --size-1_5: 0.375rem; / 6px /\n --size-2: 0.5rem; / 8px /\n --size-2_5: 0.625rem; / 10px /\n --size-3: 0.75rem; / 12px /\n --size-3_5: 0.875rem; / 14px /\n --size-4: 1rem; / 16px /\n --size-4_5: 1.125rem; / 18px /\n --size-5: 1.25rem; / 20px /\n --size-5_5: 1.375rem; / 22px /\n --size-6: 1.5rem; / 24px /\n --size-6_5: 1.625rem; / 26px /\n --size-7: 1.75rem; / 28px /\n --size-7_5: 1.875rem; / 30px /\n --size-8: 2rem; / 32px /\n --size-8_5: 2.125rem; / 34px /\n --size-9: 2.25rem; / 36px /\n --size-9_5: 2.375rem; / 38px /\n --size-10: 2.5rem; / 40px /\n --size-10_5: 2.625rem; / 42px /\n --size-11: 2.75rem; / 44px /\n --size-11_5: 2.875rem; / 46px /\n --size-12: 3rem; / 48px */\n\n @media print {\n display: none;\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :host {\n --color-background: rgb(28, 28, 30);\n --color-font: white;\n --color-backdrop: rgb(0, 0, 0, 0.8);\n --color-border-shadow: rgba(255, 255, 255, 0.145);\n\n --color-title-color: #fafafa;\n --color-stack-h6: rgb(200, 200, 204);\n --color-stack-headline: rgb(99, 99, 102);\n --color-stack-notes: #a9a9a9;\n --color-stack-subline: rgb(121, 121, 121);\n\n --color-accents-3: rgb(118, 118, 118);\n\n --color-text-background-red-1: #2a1e1e;\n }\n }\n\n .mono {\n font-family: var(--font-stack-monospace);\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin-bottom: var(--size-gap);\n font-weight: 500;\n line-height: 1.5;\n }\n `}\n </style>\n )\n}\n"],"names":["Base","style","css"],"mappings":";;;;+BAGgBA;;;eAAAA;;;;;;iEAHO;8BACK;;;;;;;;;;;AAErB,SAASA;IACd,qBACE,qBAACC;sBACEC,kBAAG,~~qBAKE~~,6DAA6D;QAC7D,mEAAmE;QACnE,kEAAkE;QAClE,kEAAkE;QAClE,gEAAgE;QAChE;;~~AA+IZ~~"}
1	+ {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/styles/base.tsx"],"sourcesContent":["import * as React from 'react'\nimport { noop as css } from '../helpers/noop-template'\n\nexport function Base() {\n return (\n <style>\n {css`\n :host {\n ${\n // Although the style applied to the shadow host is isolated,\n // the element that attached the shadow host (i.e. `nextjs-portal`)\n // is still affected by the parent's style (e.g. `body`). This may\n // occur style conflicts like `display: flex`, with other children\n // elements therefore give the shadow host an absolute position.\n 'position: absolute;'\n }\n\n --size-gap-half: 4px;\n --size-gap: 8px;\n --size-gap-double: 16px;\n --size-gap-triple: 24px;\n --size-gap-quad: 32px;\n\n --size-font-11: 11px;\n --size-font-smaller: 12px;\n --size-font-small: 14px;\n --size-font: 16px;\n --size-font-big: 20px;\n --size-font-bigger: 24px;\n\n --color-background: white;\n --color-font: #757575;\n --color-backdrop: rgba(250, 250, 250, 0.8);\n --color-border-shadow: rgba(0, 0, 0, 0.145);\n\n --color-title-color: #1f1f1f;\n --color-stack-h6: #222;\n --color-stack-headline: #666;\n --color-stack-subline: #999;\n --color-stack-notes: #777;\n\n --color-accents-1: #808080;\n --color-accents-2: #222222;\n --color-accents-3: #404040;\n\n --color-text-color-red-1: #ff5555;\n --color-text-background-red-1: #fff9f9;\n\n --font-stack-monospace: 'Geist Mono', 'SFMono-Regular', Consolas,\n 'Liberation Mono', Menlo, Courier, monospace;\n --font-stack-sans: 'Geist', -apple-system, 'Source Sans Pro',\n sans-serif;\n\n font-family: var(--font-stack-sans);\n\n /* TODO: Remove replaced ones. /\n --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1),\n 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),\n 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n --shadow-none: 0 0 #0000;\n\n --shadow-small: 0px 2px 2px rgba(0, 0, 0, 0.04);\n --shadow-menu: 0px 1px 1px rgba(0, 0, 0, 0.02),\n 0px 4px 8px -4px rgba(0, 0, 0, 0.04),\n 0px 16px 24px -8px rgba(0, 0, 0, 0.06);\n\n --focus-color: var(--color-blue-800);\n --focus-ring: 2px solid var(--focus-color);\n\n --timing-swift: cubic-bezier(0.23, 0.88, 0.26, 0.92);\n --timing-overlay: cubic-bezier(0.175, 0.885, 0.32, 1.1);\n\n --rounded-none: 0px;\n --rounded-sm: 0.125rem; / 2px /\n --rounded-md: 0.25rem; / 4px /\n --rounded-md-2: 0.375rem; / 6px /\n --rounded-lg: 0.5rem; / 8px /\n --rounded-xl: 0.75rem; / 12px /\n --rounded-2xl: 1rem; / 16px /\n --rounded-3xl: 1.5rem; / 24px /\n --rounded-full: 9999px;\n\n --size-0: 0px;\n --size-px: 1px;\n --size-0_5: 0.125rem; / 2px /\n --size-1: 0.25rem; / 4px /\n --size-1_5: 0.375rem; / 6px /\n --size-2: 0.5rem; / 8px /\n --size-2_5: 0.625rem; / 10px /\n --size-3: 0.75rem; / 12px /\n --size-3_5: 0.875rem; / 14px /\n --size-4: 1rem; / 16px /\n --size-4_5: 1.125rem; / 18px /\n --size-5: 1.25rem; / 20px /\n --size-5_5: 1.375rem; / 22px /\n --size-6: 1.5rem; / 24px /\n --size-6_5: 1.625rem; / 26px /\n --size-7: 1.75rem; / 28px /\n --size-7_5: 1.875rem; / 30px /\n --size-8: 2rem; / 32px /\n --size-8_5: 2.125rem; / 34px /\n --size-9: 2.25rem; / 36px /\n --size-9_5: 2.375rem; / 38px /\n --size-10: 2.5rem; / 40px /\n --size-10_5: 2.625rem; / 42px /\n --size-11: 2.75rem; / 44px /\n --size-11_5: 2.875rem; / 46px /\n --size-12: 3rem; / 48px */\n\n @media print {\n display: none;\n }\n }\n\n @media (prefers-color-scheme: dark) {\n :host {\n --color-background: rgb(28, 28, 30);\n --color-font: white;\n --color-backdrop: rgb(0, 0, 0, 0.8);\n --color-border-shadow: rgba(255, 255, 255, 0.145);\n\n --color-title-color: #fafafa;\n --color-stack-h6: rgb(200, 200, 204);\n --color-stack-headline: rgb(99, 99, 102);\n --color-stack-notes: #a9a9a9;\n --color-stack-subline: rgb(121, 121, 121);\n\n --color-accents-3: rgb(118, 118, 118);\n\n --color-text-background-red-1: #2a1e1e;\n }\n }\n\n .mono {\n font-family: var(--font-stack-monospace);\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin-bottom: var(--size-gap);\n font-weight: 500;\n line-height: 1.5;\n }\n `}\n </style>\n )\n}\n"],"names":["Base","style","css"],"mappings":";;;;+BAGgBA;;;eAAAA;;;;;;iEAHO;8BACK;;;;;;;;;;;AAErB,SAASA;IACd,qBACE,qBAACC;sBACEC,kBAAG,qBAGE,6DAA6D;QAC7D,mEAAmE;QACnE,kEAAkE;QAClE,kEAAkE;QAClE,gEAAgE;QAChE;;AAgJZ"}

package/dist/client/components/react-dev-overlay/_experimental/internal/styles/component-styles.js CHANGED Viewed

@@ -29,6 +29,9 @@ const _devtoolsindicator = require("../components/errors/dev-tools-indicator/dev
 const _nooptemplate = require("../helpers/noop-template");
 const _editorlink = require("../components/terminal/editor-link");
 const _environmentnamelabel = require("../components/errors/environment-name-label/environment-name-label");
+const _devtoolsinfo = require("../components/errors/dev-tools-indicator/dev-tools-info/dev-tools-info");
+const _turbopackinfo = require("../components/errors/dev-tools-indicator/dev-tools-info/turbopack-info");
+const _routeinfo = require("../components/errors/dev-tools-indicator/dev-tools-info/route-info");
 function _templateObject() {
     const data = _tagged_template_literal_loose._([
         "\n        ",
@@ -49,6 +52,9 @@ function _templateObject() {
         "\n        ",
         "\n        ",
         "\n        ",
+        "\n        ",
+        "\n        ",
+        "\n        ",
         "\n      "
     ]);
     _templateObject = function() {
@@ -58,7 +64,7 @@ function _templateObject() {
 }
 function ComponentStyles() {
     return /*#__PURE__*/ (0, _jsxruntime.jsx)("style", {
-        children: (0, _nooptemplate.noop)(_templateObject(), _copybutton.COPY_BUTTON_STYLES, _callstackframe.CALL_STACK_FRAME_STYLES, _environmentnamelabel.ENVIRONMENT_NAME_LABEL_STYLES, _styles.styles, _toast.styles, _dialog.styles, _erroroverlaylayout.styles, _erroroverlayfooter.styles, _erroroverlaybottomstack.styles, _erroroverlaypagination.styles, _codeframe.CODE_FRAME_STYLES, _terminal.TERMINAL_STYLES, _editorlink.EDITOR_LINK_STYLES, _builderror.styles, _errors.styles, _runtimeerror.styles, _versionstalenessinfo.styles, _devtoolsindicator.DEV_TOOLS_INDICATOR_STYLES)
+        children: (0, _nooptemplate.noop)(_templateObject(), _copybutton.COPY_BUTTON_STYLES, _callstackframe.CALL_STACK_FRAME_STYLES, _environmentnamelabel.ENVIRONMENT_NAME_LABEL_STYLES, _styles.styles, _toast.styles, _dialog.styles, _erroroverlaylayout.styles, _erroroverlayfooter.styles, _erroroverlaybottomstack.styles, _erroroverlaypagination.styles, _codeframe.CODE_FRAME_STYLES, _terminal.TERMINAL_STYLES, _editorlink.EDITOR_LINK_STYLES, _builderror.styles, _errors.styles, _runtimeerror.styles, _versionstalenessinfo.styles, _devtoolsindicator.DEV_TOOLS_INDICATOR_STYLES, _devtoolsinfo.DEV_TOOLS_INFO_STYLES, _turbopackinfo.DEV_TOOLS_INFO_TURBOPACK_INFO_STYLES, _routeinfo.DEV_TOOLS_INFO_ROUTE_INFO_STYLES)
     });
 }

package/dist/client/components/react-dev-overlay/_experimental/internal/styles/component-styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/styles/component-styles.tsx"],"sourcesContent":["import { CODE_FRAME_STYLES } from '../components/code-frame/code-frame'\nimport { styles as dialog } from '../components/dialog'\nimport { styles as errorLayout } from '../components/errors/error-overlay-layout/error-overlay-layout'\nimport { styles as bottomStack } from '../components/errors/error-overlay-bottom-stack'\nimport { styles as pagination } from '../components/errors/error-overlay-pagination/error-overlay-pagination'\nimport { styles as overlay } from '../components/overlay/styles'\nimport { styles as footer } from '../components/errors/error-overlay-footer/error-overlay-footer'\nimport { TERMINAL_STYLES } from '../components/terminal/terminal'\nimport { styles as toast } from '../components/toast'\nimport { styles as versionStaleness } from '../components/version-staleness-info/version-staleness-info'\nimport { styles as buildErrorStyles } from '../container/build-error'\nimport { styles as containerErrorStyles } from '../container/errors'\nimport { styles as containerRuntimeErrorStyles } from '../container/runtime-error'\nimport { COPY_BUTTON_STYLES } from '../components/copy-button'\nimport { CALL_STACK_FRAME_STYLES } from '../components/call-stack-frame/call-stack-frame'\nimport { DEV_TOOLS_INDICATOR_STYLES } from '../components/errors/dev-tools-indicator/dev-tools-indicator'\nimport { noop as css } from '../helpers/noop-template'\nimport { EDITOR_LINK_STYLES } from '../components/terminal/editor-link'\nimport { ENVIRONMENT_NAME_LABEL_STYLES } from '../components/errors/environment-name-label/environment-name-label'\nexport function ComponentStyles() {\n return (\n <style>\n {css`\n ${COPY_BUTTON_STYLES}\n ${CALL_STACK_FRAME_STYLES}\n ${ENVIRONMENT_NAME_LABEL_STYLES}\n ${overlay}\n ${toast}\n ${dialog}\n ${errorLayout}\n ${footer}\n ${bottomStack}\n ${pagination}\n ${CODE_FRAME_STYLES}\n ${TERMINAL_STYLES}\n ${EDITOR_LINK_STYLES}\n ${buildErrorStyles}\n ${containerErrorStyles}\n ${containerRuntimeErrorStyles}\n ${versionStaleness}\n ${DEV_TOOLS_INDICATOR_STYLES}\n `}\n </style>\n )\n}\n"],"names":["ComponentStyles","style","css","COPY_BUTTON_STYLES","CALL_STACK_FRAME_STYLES","ENVIRONMENT_NAME_LABEL_STYLES","overlay","toast","dialog","errorLayout","footer","bottomStack","pagination","CODE_FRAME_STYLES","TERMINAL_STYLES","EDITOR_LINK_STYLES","buildErrorStyles","containerErrorStyles","containerRuntimeErrorStyles","versionStaleness","DEV_TOOLS_INDICATOR_STYLES"],"mappings":";;;;+~~BAmBgBA~~;;;eAAAA;;;;;~~2BAnBkB~~;wBACD;oCACK;yCACA;wCACD;wBACH;oCACD;0BACD;uBACA;sCACW;4BACA;wBACI;8BACO;4BACnB;gCACK;mCACG;8BACf;4BACO;sCACW~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;AACvC~~,SAASA;IACd,qBACE,qBAACC;sBACEC,kBAAG,qBACAC,8BAAkB,EAClBC,uCAAuB,EACvBC,mDAA6B,EAC7BC,cAAO,EACPC,aAAK,EACLC,cAAM,EACNC,0BAAW,EACXC,0BAAM,EACNC,+BAAW,EACXC,8BAAU,EACVC,4BAAiB,EACjBC,yBAAe,EACfC,8BAAkB,EAClBC,kBAAgB,EAChBC,cAAoB,EACpBC,oBAA2B,EAC3BC,4BAAgB,EAChBC,6CAA0B;;~~AAIpC~~"}
1	+ {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/styles/component-styles.tsx"],"sourcesContent":["import { CODE_FRAME_STYLES } from '../components/code-frame/code-frame'\nimport { styles as dialog } from '../components/dialog'\nimport { styles as errorLayout } from '../components/errors/error-overlay-layout/error-overlay-layout'\nimport { styles as bottomStack } from '../components/errors/error-overlay-bottom-stack'\nimport { styles as pagination } from '../components/errors/error-overlay-pagination/error-overlay-pagination'\nimport { styles as overlay } from '../components/overlay/styles'\nimport { styles as footer } from '../components/errors/error-overlay-footer/error-overlay-footer'\nimport { TERMINAL_STYLES } from '../components/terminal/terminal'\nimport { styles as toast } from '../components/toast'\nimport { styles as versionStaleness } from '../components/version-staleness-info/version-staleness-info'\nimport { styles as buildErrorStyles } from '../container/build-error'\nimport { styles as containerErrorStyles } from '../container/errors'\nimport { styles as containerRuntimeErrorStyles } from '../container/runtime-error'\nimport { COPY_BUTTON_STYLES } from '../components/copy-button'\nimport { CALL_STACK_FRAME_STYLES } from '../components/call-stack-frame/call-stack-frame'\nimport { DEV_TOOLS_INDICATOR_STYLES } from '../components/errors/dev-tools-indicator/dev-tools-indicator'\nimport { noop as css } from '../helpers/noop-template'\nimport { EDITOR_LINK_STYLES } from '../components/terminal/editor-link'\nimport { ENVIRONMENT_NAME_LABEL_STYLES } from '../components/errors/environment-name-label/environment-name-label'\nimport { DEV_TOOLS_INFO_STYLES } from '../components/errors/dev-tools-indicator/dev-tools-info/dev-tools-info'\nimport { DEV_TOOLS_INFO_TURBOPACK_INFO_STYLES } from '../components/errors/dev-tools-indicator/dev-tools-info/turbopack-info'\nimport { DEV_TOOLS_INFO_ROUTE_INFO_STYLES } from '../components/errors/dev-tools-indicator/dev-tools-info/route-info'\n\nexport function ComponentStyles() {\n return (\n <style>\n {css`\n ${COPY_BUTTON_STYLES}\n ${CALL_STACK_FRAME_STYLES}\n ${ENVIRONMENT_NAME_LABEL_STYLES}\n ${overlay}\n ${toast}\n ${dialog}\n ${errorLayout}\n ${footer}\n ${bottomStack}\n ${pagination}\n ${CODE_FRAME_STYLES}\n ${TERMINAL_STYLES}\n ${EDITOR_LINK_STYLES}\n ${buildErrorStyles}\n ${containerErrorStyles}\n ${containerRuntimeErrorStyles}\n ${versionStaleness}\n ${DEV_TOOLS_INDICATOR_STYLES}\n ${DEV_TOOLS_INFO_STYLES}\n ${DEV_TOOLS_INFO_TURBOPACK_INFO_STYLES}\n ${DEV_TOOLS_INFO_ROUTE_INFO_STYLES}\n `}\n </style>\n )\n}\n"],"names":["ComponentStyles","style","css","COPY_BUTTON_STYLES","CALL_STACK_FRAME_STYLES","ENVIRONMENT_NAME_LABEL_STYLES","overlay","toast","dialog","errorLayout","footer","bottomStack","pagination","CODE_FRAME_STYLES","TERMINAL_STYLES","EDITOR_LINK_STYLES","buildErrorStyles","containerErrorStyles","containerRuntimeErrorStyles","versionStaleness","DEV_TOOLS_INDICATOR_STYLES","DEV_TOOLS_INFO_STYLES","DEV_TOOLS_INFO_TURBOPACK_INFO_STYLES","DEV_TOOLS_INFO_ROUTE_INFO_STYLES"],"mappings":";;;;+BAuBgBA;;;eAAAA;;;;;2BAvBkB;wBACD;oCACK;yCACA;wCACD;wBACH;oCACD;0BACD;uBACA;sCACW;4BACA;wBACI;8BACO;4BACnB;gCACK;mCACG;8BACf;4BACO;sCACW;8BACR;+BACe;2BACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAE1C,SAASA;IACd,qBACE,qBAACC;sBACEC,kBAAG,qBACAC,8BAAkB,EAClBC,uCAAuB,EACvBC,mDAA6B,EAC7BC,cAAO,EACPC,aAAK,EACLC,cAAM,EACNC,0BAAW,EACXC,0BAAM,EACNC,+BAAW,EACXC,8BAAU,EACVC,4BAAiB,EACjBC,yBAAe,EACfC,8BAAkB,EAClBC,kBAAgB,EAChBC,cAAoB,EACpBC,oBAA2B,EAC3BC,4BAAgB,EAChBC,6CAA0B,EAC1BC,mCAAqB,EACrBC,mDAAoC,EACpCC,2CAAgC;;AAI1C"}

package/dist/client/components/react-dev-overlay/_experimental/pages/react-dev-overlay.js CHANGED Viewed

@@ -21,6 +21,7 @@ const _colors = require("../internal/styles/colors");
 const _erroroverlay = require("../internal/components/errors/error-overlay/error-overlay");
 const _devtoolsindicator = require("../internal/components/errors/dev-tools-indicator/dev-tools-indicator");
 const _rendererror = require("../internal/container/runtime-error/render-error");
+const _fontstyles = require("../font/font-styles");
 function ReactDevOverlay(param) {
     let { children } = param;
     const { state, onComponentError, hasRuntimeErrors, hasBuildError } = (0, _hooks.usePagesReactDevOverlay)();
@@ -31,6 +32,7 @@ function ReactDevOverlay(param) {
                 onError: onComponentError,
                 children: children != null ? children : null
             }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_fontstyles.FontStyles, {}),
             /*#__PURE__*/ (0, _jsxruntime.jsxs)(_shadowportal.ShadowPortal, {
                 children: [
                     /*#__PURE__*/ (0, _jsxruntime.jsx)(_cssreset.CssReset, {}),
@@ -41,17 +43,19 @@ function ReactDevOverlay(param) {
                         state: state,
                         isAppDir: false,
                         children: (param)=>{
-                            let { readyErrors, totalErrorCount } = param;
+                            let { runtimeErrors, totalErrorCount } = param;
+                            const isBuildError = runtimeErrors.length === 0;
                             return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
                                 children: [
                                     /*#__PURE__*/ (0, _jsxruntime.jsx)(_devtoolsindicator.DevToolsIndicator, {
                                         state: state,
                                         errorCount: totalErrorCount,
+                                        isBuildError: isBuildError,
                                         setIsErrorOverlayOpen: setIsErrorOverlayOpen
                                     }),
                                     (hasRuntimeErrors || hasBuildError) && /*#__PURE__*/ (0, _jsxruntime.jsx)(_erroroverlay.ErrorOverlay, {
                                         state: state,
-                                        readyErrors: readyErrors,
+                                        runtimeErrors: runtimeErrors,
                                         isErrorOverlayOpen: isErrorOverlayOpen,
                                         setIsErrorOverlayOpen: setIsErrorOverlayOpen
                                     })

package/dist/client/components/react-dev-overlay/_experimental/pages/react-dev-overlay.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/_experimental/pages/react-dev-overlay.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { useState } from 'react'\nimport { ShadowPortal } from '../internal/components/shadow-portal'\nimport { Base } from '../internal/styles/base'\nimport { ComponentStyles } from '../internal/styles/component-styles'\nimport { CssReset } from '../internal/styles/css-reset'\n\nimport { DevOverlayErrorBoundary } from './error-boundary'\nimport { usePagesReactDevOverlay } from '../../pages/hooks'\nimport { Colors } from '../internal/styles/colors'\nimport { ErrorOverlay } from '../internal/components/errors/error-overlay/error-overlay'\nimport { DevToolsIndicator } from '../internal/components/errors/dev-tools-indicator/dev-tools-indicator'\nimport { RenderError } from '../internal/container/runtime-error/render-error'\n\nexport type ErrorType = 'runtime' \| 'build'\n\ninterface ReactDevOverlayProps {\n children?: React.ReactNode\n}\n\nexport default function ReactDevOverlay({ children }: ReactDevOverlayProps) {\n const { state, onComponentError, hasRuntimeErrors, hasBuildError } =\n usePagesReactDevOverlay()\n\n const [isErrorOverlayOpen, setIsErrorOverlayOpen] = useState(true)\n\n return (\n <>\n <DevOverlayErrorBoundary onError={onComponentError}>\n {children ?? null}\n </DevOverlayErrorBoundary>\n\n <ShadowPortal>\n <CssReset />\n <Base />\n <Colors />\n <ComponentStyles />\n\n <RenderError state={state} isAppDir={false}>\n {({ ~~readyErrors~~, totalErrorCount }) => (\n <>\n <DevToolsIndicator\n state={state}\n errorCount={totalErrorCount}\n setIsErrorOverlayOpen={setIsErrorOverlayOpen}\n />\n\n {(hasRuntimeErrors \|\| hasBuildError) && (\n <ErrorOverlay\n state={state}\n ~~readyErrors~~={~~readyErrors~~}\n isErrorOverlayOpen={isErrorOverlayOpen}\n setIsErrorOverlayOpen={setIsErrorOverlayOpen}\n />\n )}\n </>\n )}\n </RenderError>\n </ShadowPortal>\n </>\n )\n}\n"],"names":["ReactDevOverlay","children","state","onComponentError","hasRuntimeErrors","hasBuildError","usePagesReactDevOverlay","isErrorOverlayOpen","setIsErrorOverlayOpen","useState","DevOverlayErrorBoundary","onError","ShadowPortal","CssReset","Base","Colors","ComponentStyles","RenderError","isAppDir","~~readyErrors~~","totalErrorCount","DevToolsIndicator","errorCount","ErrorOverlay"],"mappings":";;;;+~~BAqBA~~;;;eAAwBA;;;;;~~iEArBD~~;8BAGM;sBACR;iCACW;0BACP;+BAEe;uBACA;wBACjB;8BACM;mCACK;6BACN;~~AAQb~~,SAASA,gBAAgB,KAAkC;IAAlC,IAAA,EAAEC,QAAQ,EAAwB,GAAlC;IACtC,MAAM,EAAEC,KAAK,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAEC,aAAa,EAAE,GAChEC,IAAAA,8BAAuB;IAEzB,MAAM,CAACC,oBAAoBC,sBAAsB,GAAGC,IAAAA,eAAQ,EAAC;IAE7D,qBACE;;0BACE,qBAACC,sCAAuB;gBAACC,SAASR;0BAC/BF,mBAAAA,WAAY;;~~0BAGf~~,~~sBAACW~~,0BAAY;;kCACX,qBAACC,kBAAQ;kCACT,qBAACC,UAAI;kCACL,qBAACC,cAAM;kCACP,qBAACC,gCAAe;kCAEhB,qBAACC,wBAAW;~~wBAACf~~,OAAOA;~~wBAAOgB~~,UAAU;kCAClC;gCAAC,EAAEC,~~WAAW~~,EAAEC,eAAe,EAAE;~~iDAChC~~;;kDACE,qBAACC,oCAAiB;~~wCAChBnB~~,OAAOA;~~wCACPoB~~,~~YAAYF~~;~~wCACZZ~~,uBAAuBA;;oCAGvBJ,CAAAA,oBAAoBC,aAAY,mBAChC,~~qBAACkB~~,0BAAY;~~wCACXrB~~,OAAOA;~~wCACPiB~~,~~aAAaA~~;~~wCACbZ~~,oBAAoBA;wCACpBC,uBAAuBA~~;;;;;;;;;;AASzC~~"}
1	+ {"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/_experimental/pages/react-dev-overlay.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { useState } from 'react'\nimport { ShadowPortal } from '../internal/components/shadow-portal'\nimport { Base } from '../internal/styles/base'\nimport { ComponentStyles } from '../internal/styles/component-styles'\nimport { CssReset } from '../internal/styles/css-reset'\n\nimport { DevOverlayErrorBoundary } from './error-boundary'\nimport { usePagesReactDevOverlay } from '../../pages/hooks'\nimport { Colors } from '../internal/styles/colors'\nimport { ErrorOverlay } from '../internal/components/errors/error-overlay/error-overlay'\nimport { DevToolsIndicator } from '../internal/components/errors/dev-tools-indicator/dev-tools-indicator'\nimport { RenderError } from '../internal/container/runtime-error/render-error'\nimport { FontStyles } from '../font/font-styles'\n\nexport type ErrorType = 'runtime' \| 'build'\n\ninterface ReactDevOverlayProps {\n children?: React.ReactNode\n}\n\nexport default function ReactDevOverlay({ children }: ReactDevOverlayProps) {\n const { state, onComponentError, hasRuntimeErrors, hasBuildError } =\n usePagesReactDevOverlay()\n\n const [isErrorOverlayOpen, setIsErrorOverlayOpen] = useState(true)\n\n return (\n <>\n <DevOverlayErrorBoundary onError={onComponentError}>\n {children ?? null}\n </DevOverlayErrorBoundary>\n\n {/* Fonts can only be loaded outside the Shadow DOM. */}\n <FontStyles />\n <ShadowPortal>\n <CssReset />\n <Base />\n <Colors />\n <ComponentStyles />\n\n <RenderError state={state} isAppDir={false}>\n {({ runtimeErrors, totalErrorCount }) => {\n const isBuildError = runtimeErrors.length === 0\n return (\n <>\n <DevToolsIndicator\n state={state}\n errorCount={totalErrorCount}\n isBuildError={isBuildError}\n setIsErrorOverlayOpen={setIsErrorOverlayOpen}\n />\n\n {(hasRuntimeErrors \|\| hasBuildError) && (\n <ErrorOverlay\n state={state}\n runtimeErrors={runtimeErrors}\n isErrorOverlayOpen={isErrorOverlayOpen}\n setIsErrorOverlayOpen={setIsErrorOverlayOpen}\n />\n )}\n </>\n )\n }}\n </RenderError>\n </ShadowPortal>\n </>\n )\n}\n"],"names":["ReactDevOverlay","children","state","onComponentError","hasRuntimeErrors","hasBuildError","usePagesReactDevOverlay","isErrorOverlayOpen","setIsErrorOverlayOpen","useState","DevOverlayErrorBoundary","onError","FontStyles","ShadowPortal","CssReset","Base","Colors","ComponentStyles","RenderError","isAppDir","runtimeErrors","totalErrorCount","isBuildError","length","DevToolsIndicator","errorCount","ErrorOverlay"],"mappings":";;;;+BAsBA;;;eAAwBA;;;;;iEAtBD;8BAGM;sBACR;iCACW;0BACP;+BAEe;uBACA;wBACjB;8BACM;mCACK;6BACN;4BACD;AAQZ,SAASA,gBAAgB,KAAkC;IAAlC,IAAA,EAAEC,QAAQ,EAAwB,GAAlC;IACtC,MAAM,EAAEC,KAAK,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAEC,aAAa,EAAE,GAChEC,IAAAA,8BAAuB;IAEzB,MAAM,CAACC,oBAAoBC,sBAAsB,GAAGC,IAAAA,eAAQ,EAAC;IAE7D,qBACE;;0BACE,qBAACC,sCAAuB;gBAACC,SAASR;0BAC/BF,mBAAAA,WAAY;;0BAIf,qBAACW,sBAAU;0BACX,sBAACC,0BAAY;;kCACX,qBAACC,kBAAQ;kCACT,qBAACC,UAAI;kCACL,qBAACC,cAAM;kCACP,qBAACC,gCAAe;kCAEhB,qBAACC,wBAAW;wBAAChB,OAAOA;wBAAOiB,UAAU;kCAClC;gCAAC,EAAEC,aAAa,EAAEC,eAAe,EAAE;4BAClC,MAAMC,eAAeF,cAAcG,MAAM,KAAK;4BAC9C,qBACE;;kDACE,qBAACC,oCAAiB;wCAChBtB,OAAOA;wCACPuB,YAAYJ;wCACZC,cAAcA;wCACdd,uBAAuBA;;oCAGvBJ,CAAAA,oBAAoBC,aAAY,mBAChC,qBAACqB,0BAAY;wCACXxB,OAAOA;wCACPkB,eAAeA;wCACfb,oBAAoBA;wCACpBC,uBAAuBA;;;;wBAKjC;;;;;;AAKV"}

package/dist/client/components/react-dev-overlay/hydration-diff/diff-view.js CHANGED Viewed

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "PseudoHtmlDiff", {
 });
 const _jsxruntime = require("react/jsx-runtime");
 const _react = require("react");
-const _CollapseIcon = require("../internal/icons/CollapseIcon");
+const _collapseicon = require("../_experimental/internal/icons/collapse-icon");
 function PseudoHtmlDiff(param) {
     let { firstContent, secondContent, hydrationMismatchType, reactOutputComponentDiff, ...props } = param;
     const [isDiffCollapsed, toggleCollapseHtml] = (0, _react.useState)(true);
@@ -77,7 +77,7 @@ function PseudoHtmlDiff(param) {
                 tabIndex: 10,
                 "data-nextjs-container-errors-pseudo-html-collapse-button": true,
                 onClick: ()=>toggleCollapseHtml(!isDiffCollapsed),
-                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_CollapseIcon.CollapseIcon, {
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_collapseicon.CollapseIcon, {
                     collapsed: isDiffCollapsed
                 })
             }),