Initial boiler plate project

This commit is contained in:
2024-09-24 03:52:46 +00:00
parent 6120b2d6c3
commit 154b93e267
10034 changed files with 2079352 additions and 2 deletions

View File

@ -0,0 +1,84 @@
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import * as React from "react";
import { ACTION_UNHANDLED_ERROR } from "../shared";
import { ShadowPortal } from "../internal/components/ShadowPortal";
import { BuildError } from "../internal/container/BuildError";
import { Errors } from "../internal/container/Errors";
import { parseStack } from "../internal/helpers/parseStack";
import { Base } from "../internal/styles/Base";
import { ComponentStyles } from "../internal/styles/ComponentStyles";
import { CssReset } from "../internal/styles/CssReset";
import { RootLayoutMissingTagsError } from "../internal/container/root-layout-missing-tags-error";
class ReactDevOverlay extends React.PureComponent {
static getDerivedStateFromError(error) {
if (!error.stack) return {
reactError: null
};
return {
reactError: {
id: 0,
event: {
type: ACTION_UNHANDLED_ERROR,
reason: error,
frames: parseStack(error.stack)
}
}
};
}
componentDidCatch(componentErr) {
this.props.onReactError(componentErr);
}
render() {
var _state_rootLayoutMissingTags, _state_rootLayoutMissingTags1;
const { state, children } = this.props;
const { reactError } = this.state;
const hasBuildError = state.buildError != null;
const hasRuntimeErrors = Boolean(state.errors.length);
const hasMissingTags = Boolean((_state_rootLayoutMissingTags = state.rootLayoutMissingTags) == null ? void 0 : _state_rootLayoutMissingTags.length);
const isMounted = hasBuildError || hasRuntimeErrors || reactError || hasMissingTags;
return /*#__PURE__*/ _jsxs(_Fragment, {
children: [
reactError ? /*#__PURE__*/ _jsxs("html", {
children: [
/*#__PURE__*/ _jsx("head", {}),
/*#__PURE__*/ _jsx("body", {})
]
}) : children,
isMounted ? /*#__PURE__*/ _jsxs(ShadowPortal, {
children: [
/*#__PURE__*/ _jsx(CssReset, {}),
/*#__PURE__*/ _jsx(Base, {}),
/*#__PURE__*/ _jsx(ComponentStyles, {}),
((_state_rootLayoutMissingTags1 = state.rootLayoutMissingTags) == null ? void 0 : _state_rootLayoutMissingTags1.length) ? /*#__PURE__*/ _jsx(RootLayoutMissingTagsError, {
missingTags: state.rootLayoutMissingTags
}) : hasBuildError ? /*#__PURE__*/ _jsx(BuildError, {
message: state.buildError,
versionInfo: state.versionInfo
}) : reactError ? /*#__PURE__*/ _jsx(Errors, {
isAppDir: true,
versionInfo: state.versionInfo,
initialDisplayState: "fullscreen",
errors: [
reactError
]
}) : hasRuntimeErrors ? /*#__PURE__*/ _jsx(Errors, {
isAppDir: true,
initialDisplayState: "minimized",
errors: state.errors,
versionInfo: state.versionInfo
}) : undefined
]
}) : undefined
]
});
}
constructor(...args){
super(...args);
this.state = {
reactError: null
};
}
}
export { ReactDevOverlay as default };
//# sourceMappingURL=ReactDevOverlay.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../src/client/components/react-dev-overlay/app/ReactDevOverlay.tsx"],"names":["React","ACTION_UNHANDLED_ERROR","ShadowPortal","BuildError","Errors","parseStack","Base","ComponentStyles","CssReset","RootLayoutMissingTagsError","ReactDevOverlay","PureComponent","getDerivedStateFromError","error","stack","reactError","id","event","type","reason","frames","componentDidCatch","componentErr","props","onReactError","render","state","children","hasBuildError","buildError","hasRuntimeErrors","Boolean","errors","length","hasMissingTags","rootLayoutMissingTags","isMounted","html","head","body","missingTags","message","versionInfo","isAppDir","initialDisplayState","undefined"],"mappings":";AAAA,YAAYA,WAAW,QAAO;AAC9B,SAASC,sBAAsB,QAA2B,YAAW;AAErE,SAASC,YAAY,QAAQ,sCAAqC;AAClE,SAASC,UAAU,QAAQ,mCAAkC;AAC7D,SAASC,MAAM,QAAQ,+BAA8B;AAErD,SAASC,UAAU,QAAQ,iCAAgC;AAC3D,SAASC,IAAI,QAAQ,0BAAyB;AAC9C,SAASC,eAAe,QAAQ,qCAAoC;AACpE,SAASC,QAAQ,QAAQ,8BAA6B;AACtD,SAASC,0BAA0B,QAAQ,uDAAsD;AAKlF,MAAMC,wBAAwBV,MAAMW,aAAa;IAU9D,OAAOC,yBAAyBC,KAAY,EAAwB;QAClE,IAAI,CAACA,MAAMC,KAAK,EAAE,OAAO;YAAEC,YAAY;QAAK;QAC5C,OAAO;YACLA,YAAY;gBACVC,IAAI;gBACJC,OAAO;oBACLC,MAAMjB;oBACNkB,QAAQN;oBACRO,QAAQf,WAAWQ,MAAMC,KAAK;gBAChC;YACF;QACF;IACF;IAEAO,kBAAkBC,YAAmB,EAAE;QACrC,IAAI,CAACC,KAAK,CAACC,YAAY,CAACF;IAC1B;IAEAG,SAAS;YAMwBC,8BAmBtBA;QAxBT,MAAM,EAAEA,KAAK,EAAEC,QAAQ,EAAE,GAAG,IAAI,CAACJ,KAAK;QACtC,MAAM,EAAER,UAAU,EAAE,GAAG,IAAI,CAACW,KAAK;QAEjC,MAAME,gBAAgBF,MAAMG,UAAU,IAAI;QAC1C,MAAMC,mBAAmBC,QAAQL,MAAMM,MAAM,CAACC,MAAM;QACpD,MAAMC,iBAAiBH,SAAQL,+BAAAA,MAAMS,qBAAqB,qBAA3BT,6BAA6BO,MAAM;QAClE,MAAMG,YACJR,iBAAiBE,oBAAoBf,cAAcmB;QAErD,qBACE;;gBACGnB,2BACC,MAACsB;;sCACC,KAACC;sCACD,KAACC;;qBAGHZ;gBAEDS,0BACC,MAAClC;;sCACC,KAACM;sCACD,KAACF;sCACD,KAACC;wBACAmB,EAAAA,gCAAAA,MAAMS,qBAAqB,qBAA3BT,8BAA6BO,MAAM,kBAClC,KAACxB;4BACC+B,aAAad,MAAMS,qBAAqB;6BAExCP,8BACF,KAACzB;4BACCsC,SAASf,MAAMG,UAAU;4BACzBa,aAAahB,MAAMgB,WAAW;6BAE9B3B,2BACF,KAACX;4BACCuC,UAAU;4BACVD,aAAahB,MAAMgB,WAAW;4BAC9BE,qBAAoB;4BACpBZ,QAAQ;gCAACjB;6BAAW;6BAEpBe,iCACF,KAAC1B;4BACCuC,UAAU;4BACVC,qBAAoB;4BACpBZ,QAAQN,MAAMM,MAAM;4BACpBU,aAAahB,MAAMgB,WAAW;6BAE9BG;;qBAEJA;;;IAGV;;;aAzEAnB,QAAQ;YAAEX,YAAY;QAAK;;AA0E7B;AAlFA,SAAqBL,6BAkFpB"}

View File

@ -0,0 +1,428 @@
import { jsx as _jsx } from "react/jsx-runtime";
import { useCallback, useEffect, startTransition, useMemo } from "react";
import stripAnsi from "next/dist/compiled/strip-ansi";
import formatWebpackMessages from "../internal/helpers/format-webpack-messages";
import { useRouter } from "../../navigation";
import { ACTION_BEFORE_REFRESH, ACTION_BUILD_ERROR, ACTION_BUILD_OK, ACTION_REFRESH, ACTION_UNHANDLED_ERROR, ACTION_UNHANDLED_REJECTION, ACTION_VERSION_INFO, useErrorOverlayReducer } from "../shared";
import { parseStack } from "../internal/helpers/parseStack";
import ReactDevOverlay from "./ReactDevOverlay";
import { useErrorHandler } from "../internal/helpers/use-error-handler";
import { RuntimeErrorHandler } from "../internal/helpers/runtime-error-handler";
import { useSendMessage, useTurbopack, useWebsocket, useWebsocketPing } from "../internal/helpers/use-websocket";
import { parseComponentStack } from "../internal/helpers/parse-component-stack";
import { HMR_ACTIONS_SENT_TO_BROWSER } from "../../../../server/dev/hot-reloader-types";
import { extractModulesFromTurbopackMessage } from "../../../../server/dev/extract-modules-from-turbopack-message";
import { REACT_REFRESH_FULL_RELOAD_FROM_ERROR } from "../shared";
let mostRecentCompilationHash = null;
let __nextDevClientId = Math.round(Math.random() * 100 + Date.now());
let reloading = false;
let startLatency = null;
function onBeforeFastRefresh(dispatcher, hasUpdates) {
if (hasUpdates) {
dispatcher.onBeforeRefresh();
}
}
function onFastRefresh(dispatcher, sendMessage, updatedModules) {
dispatcher.onBuildOk();
reportHmrLatency(sendMessage, updatedModules);
dispatcher.onRefresh();
}
function reportHmrLatency(sendMessage, updatedModules) {
if (!startLatency) return;
let endLatency = Date.now();
const latency = endLatency - startLatency;
console.log("[Fast Refresh] done in " + latency + "ms");
sendMessage(JSON.stringify({
event: "client-hmr-latency",
id: window.__nextDevClientId,
startTime: startLatency,
endTime: endLatency,
page: window.location.pathname,
updatedModules,
// Whether the page (tab) was hidden at the time the event occurred.
// This can impact the accuracy of the event's timing.
isPageHidden: document.visibilityState === "hidden"
}));
}
// There is a newer version of the code available.
function handleAvailableHash(hash) {
// Update last known compilation hash.
mostRecentCompilationHash = hash;
}
/**
* Is there a newer version of this code available?
* For webpack: Check if the hash changed compared to __webpack_hash__
* For Turbopack: Always true because it doesn't have __webpack_hash__
*/ function isUpdateAvailable() {
if (process.env.TURBOPACK) {
return true;
}
/* globals __webpack_hash__ */ // __webpack_hash__ is the hash of the current compilation.
// It's a global variable injected by Webpack.
return mostRecentCompilationHash !== __webpack_hash__;
}
// Webpack disallows updates in other states.
function canApplyUpdates() {
// @ts-expect-error module.hot exists
return module.hot.status() === "idle";
}
function afterApplyUpdates(fn) {
if (canApplyUpdates()) {
fn();
} else {
function handler(status) {
if (status === "idle") {
// @ts-expect-error module.hot exists
module.hot.removeStatusHandler(handler);
fn();
}
}
// @ts-expect-error module.hot exists
module.hot.addStatusHandler(handler);
}
}
function performFullReload(err, sendMessage) {
const stackTrace = err && (err.stack && err.stack.split("\n").slice(0, 5).join("\n") || err.message || err + "");
sendMessage(JSON.stringify({
event: "client-full-reload",
stackTrace,
hadRuntimeError: !!RuntimeErrorHandler.hadRuntimeError,
dependencyChain: err ? err.dependencyChain : undefined
}));
if (reloading) return;
reloading = true;
window.location.reload();
}
// Attempt to update code on the fly, fall back to a hard reload.
function tryApplyUpdates(onBeforeUpdate, onHotUpdateSuccess, sendMessage, dispatcher) {
if (!isUpdateAvailable() || !canApplyUpdates()) {
dispatcher.onBuildOk();
return;
}
function handleApplyUpdates(err, updatedModules) {
if (err || RuntimeErrorHandler.hadRuntimeError || !updatedModules) {
if (err) {
console.warn("[Fast Refresh] performing full reload\n\n" + "Fast Refresh will perform a full reload when you edit a file that's imported by modules outside of the React rendering tree.\n" + "You might have a file which exports a React component but also exports a value that is imported by a non-React component file.\n" + "Consider migrating the non-React component export to a separate file and importing it into both files.\n\n" + "It is also possible the parent component of the component you edited is a class component, which disables Fast Refresh.\n" + "Fast Refresh requires at least one parent function component in your React tree.");
} else if (RuntimeErrorHandler.hadRuntimeError) {
console.warn(REACT_REFRESH_FULL_RELOAD_FROM_ERROR);
}
performFullReload(err, sendMessage);
return;
}
const hasUpdates = Boolean(updatedModules.length);
if (typeof onHotUpdateSuccess === "function") {
// Maybe we want to do something.
onHotUpdateSuccess(updatedModules);
}
if (isUpdateAvailable()) {
// While we were updating, there was a new update! Do it again.
tryApplyUpdates(hasUpdates ? ()=>{} : onBeforeUpdate, hasUpdates ? ()=>dispatcher.onBuildOk() : onHotUpdateSuccess, sendMessage, dispatcher);
} else {
dispatcher.onBuildOk();
if (process.env.__NEXT_TEST_MODE) {
afterApplyUpdates(()=>{
if (self.__NEXT_HMR_CB) {
self.__NEXT_HMR_CB();
self.__NEXT_HMR_CB = null;
}
});
}
}
}
// https://webpack.js.org/api/hot-module-replacement/#check
// @ts-expect-error module.hot exists
module.hot.check(/* autoApply */ false).then((updatedModules)=>{
if (!updatedModules) {
return null;
}
if (typeof onBeforeUpdate === "function") {
const hasUpdates = Boolean(updatedModules.length);
onBeforeUpdate(hasUpdates);
}
// https://webpack.js.org/api/hot-module-replacement/#apply
// @ts-expect-error module.hot exists
return module.hot.apply();
}).then((updatedModules)=>{
handleApplyUpdates(null, updatedModules);
}, (err)=>{
handleApplyUpdates(err, null);
});
}
/** Handles messages from the sevrer for the App Router. */ function processMessage(obj, sendMessage, processTurbopackMessage, router, dispatcher) {
if (!("action" in obj)) {
return;
}
function handleErrors(errors) {
// "Massage" webpack messages.
const formatted = formatWebpackMessages({
errors: errors,
warnings: []
});
// Only show the first error.
dispatcher.onBuildError(formatted.errors[0]);
// Also log them to the console.
for(let i = 0; i < formatted.errors.length; i++){
console.error(stripAnsi(formatted.errors[i]));
}
// Do not attempt to reload now.
// We will reload on next success instead.
if (process.env.__NEXT_TEST_MODE) {
if (self.__NEXT_HMR_CB) {
self.__NEXT_HMR_CB(formatted.errors[0]);
self.__NEXT_HMR_CB = null;
}
}
}
function handleHotUpdate() {
if (process.env.TURBOPACK) {
dispatcher.onBuildOk();
} else {
tryApplyUpdates(function onBeforeHotUpdate(hasUpdates) {
onBeforeFastRefresh(dispatcher, hasUpdates);
}, function onSuccessfulHotUpdate(webpackUpdatedModules) {
// Only dismiss it when we're sure it's a hot update.
// Otherwise it would flicker right before the reload.
onFastRefresh(dispatcher, sendMessage, webpackUpdatedModules);
}, sendMessage, dispatcher);
}
}
switch(obj.action){
case HMR_ACTIONS_SENT_TO_BROWSER.BUILDING:
{
startLatency = Date.now();
console.log("[Fast Refresh] rebuilding");
break;
}
case HMR_ACTIONS_SENT_TO_BROWSER.BUILT:
case HMR_ACTIONS_SENT_TO_BROWSER.SYNC:
{
if (obj.hash) {
handleAvailableHash(obj.hash);
}
const { errors, warnings } = obj;
// Is undefined when it's a 'built' event
if ("versionInfo" in obj) dispatcher.onVersionInfo(obj.versionInfo);
const hasErrors = Boolean(errors && errors.length);
// Compilation with errors (e.g. syntax error or missing modules).
if (hasErrors) {
sendMessage(JSON.stringify({
event: "client-error",
errorCount: errors.length,
clientId: __nextDevClientId
}));
handleErrors(errors);
return;
}
const hasWarnings = Boolean(warnings && warnings.length);
if (hasWarnings) {
sendMessage(JSON.stringify({
event: "client-warning",
warningCount: warnings.length,
clientId: __nextDevClientId
}));
// Print warnings to the console.
const formattedMessages = formatWebpackMessages({
warnings: warnings,
errors: []
});
for(let i = 0; i < formattedMessages.warnings.length; i++){
if (i === 5) {
console.warn("There were more warnings in other files.\n" + "You can find a complete log in the terminal.");
break;
}
console.warn(stripAnsi(formattedMessages.warnings[i]));
}
// No early return here as we need to apply modules in the same way between warnings only and compiles without warnings
}
sendMessage(JSON.stringify({
event: "client-success",
clientId: __nextDevClientId
}));
if (obj.action === HMR_ACTIONS_SENT_TO_BROWSER.BUILT) {
// Handle hot updates
handleHotUpdate();
}
return;
}
case HMR_ACTIONS_SENT_TO_BROWSER.TURBOPACK_CONNECTED:
{
processTurbopackMessage({
type: HMR_ACTIONS_SENT_TO_BROWSER.TURBOPACK_CONNECTED
});
break;
}
case HMR_ACTIONS_SENT_TO_BROWSER.TURBOPACK_MESSAGE:
{
const updatedModules = extractModulesFromTurbopackMessage(obj.data);
dispatcher.onBeforeRefresh();
processTurbopackMessage({
type: HMR_ACTIONS_SENT_TO_BROWSER.TURBOPACK_MESSAGE,
data: obj.data
});
dispatcher.onRefresh();
if (RuntimeErrorHandler.hadRuntimeError) {
console.warn(REACT_REFRESH_FULL_RELOAD_FROM_ERROR);
performFullReload(null, sendMessage);
}
reportHmrLatency(sendMessage, updatedModules);
break;
}
// TODO-APP: make server component change more granular
case HMR_ACTIONS_SENT_TO_BROWSER.SERVER_COMPONENT_CHANGES:
{
sendMessage(JSON.stringify({
event: "server-component-reload-page",
clientId: __nextDevClientId
}));
if (RuntimeErrorHandler.hadRuntimeError) {
if (reloading) return;
reloading = true;
return window.location.reload();
}
startTransition(()=>{
router.fastRefresh();
dispatcher.onRefresh();
});
if (process.env.__NEXT_TEST_MODE) {
if (self.__NEXT_HMR_CB) {
self.__NEXT_HMR_CB();
self.__NEXT_HMR_CB = null;
}
}
return;
}
case HMR_ACTIONS_SENT_TO_BROWSER.RELOAD_PAGE:
{
sendMessage(JSON.stringify({
event: "client-reload-page",
clientId: __nextDevClientId
}));
if (reloading) return;
reloading = true;
return window.location.reload();
}
case HMR_ACTIONS_SENT_TO_BROWSER.ADDED_PAGE:
case HMR_ACTIONS_SENT_TO_BROWSER.REMOVED_PAGE:
{
// TODO-APP: potentially only refresh if the currently viewed page was added/removed.
return router.fastRefresh();
}
case HMR_ACTIONS_SENT_TO_BROWSER.SERVER_ERROR:
{
const { errorJSON } = obj;
if (errorJSON) {
const { message, stack } = JSON.parse(errorJSON);
const error = new Error(message);
error.stack = stack;
handleErrors([
error
]);
}
return;
}
case HMR_ACTIONS_SENT_TO_BROWSER.DEV_PAGES_MANIFEST_UPDATE:
{
return;
}
default:
{}
}
}
export default function HotReload(param) {
let { assetPrefix, children } = param;
const [state, dispatch] = useErrorOverlayReducer();
const dispatcher = useMemo(()=>{
return {
onBuildOk () {
dispatch({
type: ACTION_BUILD_OK
});
},
onBuildError (message) {
dispatch({
type: ACTION_BUILD_ERROR,
message
});
},
onBeforeRefresh () {
dispatch({
type: ACTION_BEFORE_REFRESH
});
},
onRefresh () {
dispatch({
type: ACTION_REFRESH
});
},
onVersionInfo (versionInfo) {
dispatch({
type: ACTION_VERSION_INFO,
versionInfo
});
}
};
}, [
dispatch
]);
const handleOnUnhandledError = useCallback((error)=>{
const errorDetails = error.details;
// Component stack is added to the error in use-error-handler in case there was a hydration errror
const componentStack = errorDetails == null ? void 0 : errorDetails.componentStack;
const warning = errorDetails == null ? void 0 : errorDetails.warning;
dispatch({
type: ACTION_UNHANDLED_ERROR,
reason: error,
frames: parseStack(error.stack),
componentStackFrames: componentStack ? parseComponentStack(componentStack) : undefined,
warning
});
}, [
dispatch
]);
const handleOnUnhandledRejection = useCallback((reason)=>{
dispatch({
type: ACTION_UNHANDLED_REJECTION,
reason: reason,
frames: parseStack(reason.stack)
});
}, [
dispatch
]);
const handleOnReactError = useCallback(()=>{
RuntimeErrorHandler.hadRuntimeError = true;
}, []);
useErrorHandler(handleOnUnhandledError, handleOnUnhandledRejection);
const webSocketRef = useWebsocket(assetPrefix);
useWebsocketPing(webSocketRef);
const sendMessage = useSendMessage(webSocketRef);
const processTurbopackMessage = useTurbopack(sendMessage, (err)=>performFullReload(err, sendMessage));
const router = useRouter();
useEffect(()=>{
const websocket = webSocketRef.current;
if (!websocket) return;
const handler = (event)=>{
try {
const obj = JSON.parse(event.data);
processMessage(obj, sendMessage, processTurbopackMessage, router, dispatcher);
} catch (err) {
var _err_stack;
console.warn("[HMR] Invalid message: " + event.data + "\n" + ((_err_stack = err == null ? void 0 : err.stack) != null ? _err_stack : ""));
}
};
websocket.addEventListener("message", handler);
return ()=>websocket.removeEventListener("message", handler);
}, [
sendMessage,
router,
webSocketRef,
dispatcher,
processTurbopackMessage
]);
return /*#__PURE__*/ _jsx(ReactDevOverlay, {
onReactError: handleOnReactError,
state: state,
children: children
});
}
//# sourceMappingURL=hot-reloader-client.js.map

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,102 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import Anser from "next/dist/compiled/anser";
import * as React from "react";
import stripAnsi from "next/dist/compiled/strip-ansi";
import { getFrameSource } from "../../helpers/stack-frame";
import { useOpenInEditor } from "../../helpers/use-open-in-editor";
import { HotlinkedText } from "../hot-linked-text";
export const CodeFrame = function CodeFrame(param) {
let { stackFrame, codeFrame } = param;
// Strip leading spaces out of the code frame:
const formattedFrame = React.useMemo(()=>{
const lines = codeFrame.split(/\r?\n/g);
// Find the minimum length of leading spaces after `|` in the code frame
const miniLeadingSpacesLength = lines.map((line)=>/^>? +\d+ +\| [ ]+/.exec(stripAnsi(line)) === null ? null : /^>? +\d+ +\| ( *)/.exec(stripAnsi(line))).filter(Boolean).map((v)=>v.pop()).reduce((c, n)=>isNaN(c) ? n.length : Math.min(c, n.length), NaN);
// When the minimum length of leading spaces is greater than 1, remove them
// from the code frame to help the indentation looks better when there's a lot leading spaces.
if (miniLeadingSpacesLength > 1) {
return lines.map((line, a)=>~(a = line.indexOf("|")) ? line.substring(0, a) + line.substring(a).replace("^\\ {" + miniLeadingSpacesLength + "}", "") : line).join("\n");
}
return lines.join("\n");
}, [
codeFrame
]);
const decoded = React.useMemo(()=>{
return Anser.ansiToJson(formattedFrame, {
json: true,
use_classes: true,
remove_empty: true
});
}, [
formattedFrame
]);
const open = useOpenInEditor({
file: stackFrame.file,
lineNumber: stackFrame.lineNumber,
column: stackFrame.column
});
// TODO: make the caret absolute
return /*#__PURE__*/ _jsxs("div", {
"data-nextjs-codeframe": true,
children: [
/*#__PURE__*/ _jsx("div", {
children: /*#__PURE__*/ _jsxs("p", {
role: "link",
onClick: open,
tabIndex: 1,
title: "Click to open in your editor",
children: [
/*#__PURE__*/ _jsxs("span", {
children: [
getFrameSource(stackFrame),
" @",
" ",
/*#__PURE__*/ _jsx(HotlinkedText, {
text: stackFrame.methodName
})
]
}),
/*#__PURE__*/ _jsxs("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
children: [
/*#__PURE__*/ _jsx("path", {
d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"
}),
/*#__PURE__*/ _jsx("polyline", {
points: "15 3 21 3 21 9"
}),
/*#__PURE__*/ _jsx("line", {
x1: "10",
y1: "14",
x2: "21",
y2: "3"
})
]
})
]
})
}),
/*#__PURE__*/ _jsx("pre", {
children: decoded.map((entry, index)=>/*#__PURE__*/ _jsx("span", {
style: {
color: entry.fg ? "var(--color-" + entry.fg + ")" : undefined,
...entry.decoration === "bold" ? {
fontWeight: 800
} : entry.decoration === "italic" ? {
fontStyle: "italic"
} : undefined
},
children: entry.content
}, "frame-" + index))
})
]
});
};
//# sourceMappingURL=CodeFrame.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/CodeFrame/CodeFrame.tsx"],"names":["Anser","React","stripAnsi","getFrameSource","useOpenInEditor","HotlinkedText","CodeFrame","stackFrame","codeFrame","formattedFrame","useMemo","lines","split","miniLeadingSpacesLength","map","line","exec","filter","Boolean","v","pop","reduce","c","n","isNaN","length","Math","min","NaN","a","indexOf","substring","replace","join","decoded","ansiToJson","json","use_classes","remove_empty","open","file","lineNumber","column","div","data-nextjs-codeframe","p","role","onClick","tabIndex","title","span","text","methodName","svg","xmlns","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","path","d","polyline","points","x1","y1","x2","y2","pre","entry","index","style","color","fg","undefined","decoration","fontWeight","fontStyle","content"],"mappings":";AAAA,OAAOA,WAAW,2BAA0B;AAC5C,YAAYC,WAAW,QAAO;AAE9B,OAAOC,eAAe,gCAA+B;AACrD,SAASC,cAAc,QAAQ,4BAA2B;AAC1D,SAASC,eAAe,QAAQ,mCAAkC;AAClE,SAASC,aAAa,QAAQ,qBAAoB;AAIlD,OAAO,MAAMC,YAAsC,SAASA,UAAU,KAGrE;IAHqE,IAAA,EACpEC,UAAU,EACVC,SAAS,EACV,GAHqE;IAIpE,8CAA8C;IAC9C,MAAMC,iBAAiBR,MAAMS,OAAO,CAAS;QAC3C,MAAMC,QAAQH,UAAUI,KAAK,CAAC;QAE9B,wEAAwE;QACxE,MAAMC,0BAA0BF,MAC7BG,GAAG,CAAC,CAACC,OACJ,oBAAoBC,IAAI,CAACd,UAAUa,WAAW,OAC1C,OACA,oBAAoBC,IAAI,CAACd,UAAUa,QAExCE,MAAM,CAACC,SACPJ,GAAG,CAAC,CAACK,IAAMA,EAAGC,GAAG,IACjBC,MAAM,CAAC,CAACC,GAAGC,IAAOC,MAAMF,KAAKC,EAAEE,MAAM,GAAGC,KAAKC,GAAG,CAACL,GAAGC,EAAEE,MAAM,GAAIG;QAEnE,2EAA2E;QAC3E,8FAA8F;QAC9F,IAAIf,0BAA0B,GAAG;YAC/B,OAAOF,MACJG,GAAG,CAAC,CAACC,MAAMc,IACV,CAAEA,CAAAA,IAAId,KAAKe,OAAO,CAAC,IAAG,IAClBf,KAAKgB,SAAS,CAAC,GAAGF,KAClBd,KAAKgB,SAAS,CAACF,GAAGG,OAAO,CAAC,AAAC,UAAOnB,0BAAwB,KAAI,MAC9DE,MAELkB,IAAI,CAAC;QACV;QACA,OAAOtB,MAAMsB,IAAI,CAAC;IACpB,GAAG;QAACzB;KAAU;IAEd,MAAM0B,UAAUjC,MAAMS,OAAO,CAAC;QAC5B,OAAOV,MAAMmC,UAAU,CAAC1B,gBAAgB;YACtC2B,MAAM;YACNC,aAAa;YACbC,cAAc;QAChB;IACF,GAAG;QAAC7B;KAAe;IAEnB,MAAM8B,OAAOnC,gBAAgB;QAC3BoC,MAAMjC,WAAWiC,IAAI;QACrBC,YAAYlC,WAAWkC,UAAU;QACjCC,QAAQnC,WAAWmC,MAAM;IAC3B;IAEA,gCAAgC;IAChC,qBACE,MAACC;QAAIC,uBAAqB;;0BACxB,KAACD;0BACC,cAAA,MAACE;oBACCC,MAAK;oBACLC,SAASR;oBACTS,UAAU;oBACVC,OAAM;;sCAEN,MAACC;;gCACE/C,eAAeI;gCAAY;gCAAG;8CAC/B,KAACF;oCAAc8C,MAAM5C,WAAW6C,UAAU;;;;sCAE5C,MAACC;4BACCC,OAAM;4BACNC,SAAQ;4BACRC,MAAK;4BACLC,QAAO;4BACPC,aAAY;4BACZC,eAAc;4BACdC,gBAAe;;8CAEf,KAACC;oCAAKC,GAAE;;8CACR,KAACC;oCAASC,QAAO;;8CACjB,KAACjD;oCAAKkD,IAAG;oCAAKC,IAAG;oCAAKC,IAAG;oCAAKC,IAAG;;;;;;;0BAIvC,KAACC;0BACEnC,QAAQpB,GAAG,CAAC,CAACwD,OAAOC,sBACnB,KAACrB;wBAECsB,OAAO;4BACLC,OAAOH,MAAMI,EAAE,GAAG,AAAC,iBAAcJ,MAAMI,EAAE,GAAC,MAAKC;4BAC/C,GAAIL,MAAMM,UAAU,KAAK,SACrB;gCAAEC,YAAY;4BAAI,IAClBP,MAAMM,UAAU,KAAK,WACrB;gCAAEE,WAAW;4BAAS,IACtBH,SAAS;wBACf;kCAECL,MAAMS,OAAO;uBAVT,AAAC,WAAQR;;;;AAgB1B,EAAC"}

View File

@ -0,0 +1,3 @@
export { CodeFrame } from "./CodeFrame";
//# sourceMappingURL=index.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/CodeFrame/index.tsx"],"names":["CodeFrame"],"mappings":"AAAA,SAASA,SAAS,QAAQ,cAAa"}

View File

@ -0,0 +1,15 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n [data-nextjs-codeframe] {\n overflow: auto;\n border-radius: var(--size-gap-half);\n background-color: var(--color-ansi-bg);\n color: var(--color-ansi-fg);\n }\n [data-nextjs-codeframe]::selection,\n [data-nextjs-codeframe] *::selection {\n background-color: var(--color-ansi-selection);\n }\n [data-nextjs-codeframe] * {\n color: inherit;\n background-color: transparent;\n font-family: var(--font-stack-monospace);\n }\n\n [data-nextjs-codeframe] > * {\n margin: 0;\n padding: calc(var(--size-gap) + var(--size-gap-half))\n calc(var(--size-gap-double) + var(--size-gap-half));\n }\n [data-nextjs-codeframe] > div {\n display: inline-block;\n width: auto;\n min-width: 100%;\n border-bottom: 1px solid var(--color-ansi-bright-black);\n }\n [data-nextjs-codeframe] > div > p {\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n margin: 0;\n }\n [data-nextjs-codeframe] > div > p:hover {\n text-decoration: underline dotted;\n }\n [data-nextjs-codeframe] div > p > svg {\n width: auto;\n height: 1em;\n margin-left: 8px;\n }\n [data-nextjs-codeframe] div > pre {\n overflow: hidden;\n display: inline-block;\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { noop as css } from "../../helpers/noop-template";
const styles = css(_templateObject());
export { styles };
//# sourceMappingURL=styles.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/CodeFrame/styles.tsx"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AAiDf,SAASC,MAAM,GAAE"}

View File

@ -0,0 +1,70 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from "react";
import { useOnClickOutside } from "../../hooks/use-on-click-outside";
const Dialog = function Dialog(param) {
let { children, type, onClose, ...props } = param;
const [dialog, setDialog] = React.useState(null);
const [role, setRole] = React.useState(typeof document !== "undefined" && document.hasFocus() ? "dialog" : undefined);
const onDialog = React.useCallback((node)=>{
setDialog(node);
}, []);
useOnClickOutside(dialog, (e)=>{
e.preventDefault();
return onClose == null ? void 0 : onClose();
});
// Make HTMLElements with `role=link` accessible to be triggered by the
// keyboard, i.e. [Enter].
React.useEffect(()=>{
if (dialog == null) {
return;
}
const root = dialog.getRootNode();
// Always true, but we do this for TypeScript:
if (!(root instanceof ShadowRoot)) {
return;
}
const shadowRoot = root;
function handler(e) {
const el = shadowRoot.activeElement;
if (e.key === "Enter" && el instanceof HTMLElement && el.getAttribute("role") === "link") {
e.preventDefault();
e.stopPropagation();
el.click();
}
}
function handleFocus() {
// safari will force itself as the active application when a background page triggers any sort of autofocus
// this is a workaround to only set the dialog role if the document has focus
setRole(document.hasFocus() ? "dialog" : undefined);
}
shadowRoot.addEventListener("keydown", handler);
window.addEventListener("focus", handleFocus);
window.addEventListener("blur", handleFocus);
return ()=>{
shadowRoot.removeEventListener("keydown", handler);
window.removeEventListener("focus", handleFocus);
window.removeEventListener("blur", handleFocus);
};
}, [
dialog
]);
return /*#__PURE__*/ _jsxs("div", {
ref: onDialog,
"data-nextjs-dialog": true,
tabIndex: -1,
role: role,
"aria-labelledby": props["aria-labelledby"],
"aria-describedby": props["aria-describedby"],
"aria-modal": "true",
children: [
/*#__PURE__*/ _jsx("div", {
"data-nextjs-dialog-banner": true,
className: "banner-" + type
}),
children
]
});
};
export { Dialog };
//# sourceMappingURL=Dialog.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Dialog/Dialog.tsx"],"names":["React","useOnClickOutside","Dialog","children","type","onClose","props","dialog","setDialog","useState","role","setRole","document","hasFocus","undefined","onDialog","useCallback","node","e","preventDefault","useEffect","root","getRootNode","ShadowRoot","shadowRoot","handler","el","activeElement","key","HTMLElement","getAttribute","stopPropagation","click","handleFocus","addEventListener","window","removeEventListener","div","ref","data-nextjs-dialog","tabIndex","aria-labelledby","aria-describedby","aria-modal","data-nextjs-dialog-banner","className"],"mappings":";AAAA,YAAYA,WAAW,QAAO;AAC9B,SAASC,iBAAiB,QAAQ,mCAAkC;AAUpE,MAAMC,SAAgC,SAASA,OAAO,KAKrD;IALqD,IAAA,EACpDC,QAAQ,EACRC,IAAI,EACJC,OAAO,EACP,GAAGC,OACJ,GALqD;IAMpD,MAAM,CAACC,QAAQC,UAAU,GAAGR,MAAMS,QAAQ,CAAwB;IAClE,MAAM,CAACC,MAAMC,QAAQ,GAAGX,MAAMS,QAAQ,CACpC,OAAOG,aAAa,eAAeA,SAASC,QAAQ,KAChD,WACAC;IAEN,MAAMC,WAAWf,MAAMgB,WAAW,CAAC,CAACC;QAClCT,UAAUS;IACZ,GAAG,EAAE;IACLhB,kBAAkBM,QAAQ,CAACW;QACzBA,EAAEC,cAAc;QAChB,OAAOd,2BAAAA;IACT;IAEA,uEAAuE;IACvE,0BAA0B;IAC1BL,MAAMoB,SAAS,CAAC;QACd,IAAIb,UAAU,MAAM;YAClB;QACF;QAEA,MAAMc,OAAOd,OAAOe,WAAW;QAC/B,8CAA8C;QAC9C,IAAI,CAAED,CAAAA,gBAAgBE,UAAS,GAAI;YACjC;QACF;QACA,MAAMC,aAAaH;QACnB,SAASI,QAAQP,CAAgB;YAC/B,MAAMQ,KAAKF,WAAWG,aAAa;YACnC,IACET,EAAEU,GAAG,KAAK,WACVF,cAAcG,eACdH,GAAGI,YAAY,CAAC,YAAY,QAC5B;gBACAZ,EAAEC,cAAc;gBAChBD,EAAEa,eAAe;gBAEjBL,GAAGM,KAAK;YACV;QACF;QAEA,SAASC;YACP,2GAA2G;YAC3G,6EAA6E;YAC7EtB,QAAQC,SAASC,QAAQ,KAAK,WAAWC;QAC3C;QAEAU,WAAWU,gBAAgB,CAAC,WAAWT;QACvCU,OAAOD,gBAAgB,CAAC,SAASD;QACjCE,OAAOD,gBAAgB,CAAC,QAAQD;QAChC,OAAO;YACLT,WAAWY,mBAAmB,CAAC,WAAWX;YAC1CU,OAAOC,mBAAmB,CAAC,SAASH;YACpCE,OAAOC,mBAAmB,CAAC,QAAQH;QACrC;IACF,GAAG;QAAC1B;KAAO;IAEX,qBACE,MAAC8B;QACCC,KAAKvB;QACLwB,oBAAkB;QAClBC,UAAU,CAAC;QACX9B,MAAMA;QACN+B,mBAAiBnC,KAAK,CAAC,kBAAkB;QACzCoC,oBAAkBpC,KAAK,CAAC,mBAAmB;QAC3CqC,cAAW;;0BAEX,KAACN;gBAAIO,2BAAyB;gBAACC,WAAW,AAAC,YAASzC;;YACnDD;;;AAGP;AAEA,SAASD,MAAM,GAAE"}

View File

@ -0,0 +1,13 @@
import { jsx as _jsx } from "react/jsx-runtime";
import * as React from "react";
const DialogBody = function DialogBody(param) {
let { children, className } = param;
return /*#__PURE__*/ _jsx("div", {
"data-nextjs-dialog-body": true,
className: className,
children: children
});
};
export { DialogBody };
//# sourceMappingURL=DialogBody.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Dialog/DialogBody.tsx"],"names":["React","DialogBody","children","className","div","data-nextjs-dialog-body"],"mappings":";AAAA,YAAYA,WAAW,QAAO;AAO9B,MAAMC,aAAwC,SAASA,WAAW,KAGjE;IAHiE,IAAA,EAChEC,QAAQ,EACRC,SAAS,EACV,GAHiE;IAIhE,qBACE,KAACC;QAAIC,yBAAuB;QAACF,WAAWA;kBACrCD;;AAGP;AAEA,SAASD,UAAU,GAAE"}

View File

@ -0,0 +1,13 @@
import { jsx as _jsx } from "react/jsx-runtime";
import * as React from "react";
const DialogContent = function DialogContent(param) {
let { children, className } = param;
return /*#__PURE__*/ _jsx("div", {
"data-nextjs-dialog-content": true,
className: className,
children: children
});
};
export { DialogContent };
//# sourceMappingURL=DialogContent.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Dialog/DialogContent.tsx"],"names":["React","DialogContent","children","className","div","data-nextjs-dialog-content"],"mappings":";AAAA,YAAYA,WAAW,QAAO;AAO9B,MAAMC,gBAA8C,SAASA,cAAc,KAG1E;IAH0E,IAAA,EACzEC,QAAQ,EACRC,SAAS,EACV,GAH0E;IAIzE,qBACE,KAACC;QAAIC,4BAA0B;QAACF,WAAWA;kBACxCD;;AAGP;AAEA,SAASD,aAAa,GAAE"}

View File

@ -0,0 +1,13 @@
import { jsx as _jsx } from "react/jsx-runtime";
import * as React from "react";
const DialogHeader = function DialogHeader(param) {
let { children, className } = param;
return /*#__PURE__*/ _jsx("div", {
"data-nextjs-dialog-header": true,
className: className,
children: children
});
};
export { DialogHeader };
//# sourceMappingURL=DialogHeader.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Dialog/DialogHeader.tsx"],"names":["React","DialogHeader","children","className","div","data-nextjs-dialog-header"],"mappings":";AAAA,YAAYA,WAAW,QAAO;AAO9B,MAAMC,eAA4C,SAASA,aAAa,KAGvE;IAHuE,IAAA,EACtEC,QAAQ,EACRC,SAAS,EACV,GAHuE;IAItE,qBACE,KAACC;QAAIC,2BAAyB;QAACF,WAAWA;kBACvCD;;AAGP;AAEA,SAASD,YAAY,GAAE"}

View File

@ -0,0 +1,7 @@
export { Dialog } from "./Dialog";
export { DialogBody } from "./DialogBody";
export { DialogContent } from "./DialogContent";
export { DialogHeader } from "./DialogHeader";
export { styles } from "./styles";
//# sourceMappingURL=index.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Dialog/index.ts"],"names":["Dialog","DialogBody","DialogContent","DialogHeader","styles"],"mappings":"AAAA,SAASA,MAAM,QAAQ,WAAU;AACjC,SAASC,UAAU,QAAQ,eAAc;AACzC,SAASC,aAAa,QAAQ,kBAAiB;AAC/C,SAASC,YAAY,QAAQ,iBAAgB;AAC7C,SAASC,MAAM,QAAQ,WAAU"}

View File

@ -0,0 +1,15 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n [data-nextjs-dialog] {\n display: flex;\n flex-direction: column;\n width: 100%;\n margin-right: auto;\n margin-left: auto;\n outline: none;\n background: var(--color-background);\n border-radius: var(--size-gap);\n box-shadow: 0 var(--size-gap-half) var(--size-gap-double)\n rgba(0, 0, 0, 0.25);\n max-height: calc(100% - 56px);\n overflow-y: hidden;\n }\n\n @media (max-height: 812px) {\n [data-nextjs-dialog-overlay] {\n max-height: calc(100% - 15px);\n }\n }\n\n @media (min-width: 576px) {\n [data-nextjs-dialog] {\n max-width: 540px;\n box-shadow: 0 var(--size-gap) var(--size-gap-quad) rgba(0, 0, 0, 0.25);\n }\n }\n\n @media (min-width: 768px) {\n [data-nextjs-dialog] {\n max-width: 720px;\n }\n }\n\n @media (min-width: 992px) {\n [data-nextjs-dialog] {\n max-width: 960px;\n }\n }\n\n [data-nextjs-dialog-banner] {\n position: relative;\n }\n [data-nextjs-dialog-banner].banner-warning {\n border-color: var(--color-ansi-yellow);\n }\n [data-nextjs-dialog-banner].banner-error {\n border-color: var(--color-ansi-red);\n }\n\n [data-nextjs-dialog-banner]::after {\n z-index: 2;\n content: '';\n position: absolute;\n top: 0;\n right: 0;\n width: 100%;\n /* banner width: */\n border-top-width: var(--size-gap-half);\n border-bottom-width: 0;\n border-top-style: solid;\n border-bottom-style: solid;\n border-top-color: inherit;\n border-bottom-color: transparent;\n }\n\n [data-nextjs-dialog-content] {\n overflow-y: auto;\n border: none;\n margin: 0;\n /* calc(padding + banner width offset) */\n padding: calc(var(--size-gap-double) + var(--size-gap-half))\n var(--size-gap-double);\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n [data-nextjs-dialog-content] > [data-nextjs-dialog-header] {\n flex-shrink: 0;\n margin-bottom: var(--size-gap-double);\n }\n [data-nextjs-dialog-content] > [data-nextjs-dialog-body] {\n position: relative;\n flex: 1 1 auto;\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { noop as css } from "../../helpers/noop-template";
const styles = css(_templateObject());
export { styles };
//# sourceMappingURL=styles.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Dialog/styles.ts"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AAwFf,SAASC,MAAM,GAAE"}

View File

@ -0,0 +1,162 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from "react";
import { CloseIcon } from "../../icons/CloseIcon";
const LeftRightDialogHeader = function LeftRightDialogHeader(param) {
let { children, className, previous, next, close } = param;
const buttonLeft = React.useRef(null);
const buttonRight = React.useRef(null);
const buttonClose = React.useRef(null);
const [nav, setNav] = React.useState(null);
const onNav = React.useCallback((el)=>{
setNav(el);
}, []);
React.useEffect(()=>{
if (nav == null) {
return;
}
const root = nav.getRootNode();
const d = self.document;
function handler(e) {
if (e.key === "ArrowLeft") {
e.preventDefault();
e.stopPropagation();
if (buttonLeft.current) {
buttonLeft.current.focus();
}
previous && previous();
} else if (e.key === "ArrowRight") {
e.preventDefault();
e.stopPropagation();
if (buttonRight.current) {
buttonRight.current.focus();
}
next && next();
} else if (e.key === "Escape") {
e.preventDefault();
e.stopPropagation();
if (root instanceof ShadowRoot) {
const a = root.activeElement;
if (a && a !== buttonClose.current && a instanceof HTMLElement) {
a.blur();
return;
}
}
close == null ? void 0 : close();
}
}
root.addEventListener("keydown", handler);
if (root !== d) {
d.addEventListener("keydown", handler);
}
return function() {
root.removeEventListener("keydown", handler);
if (root !== d) {
d.removeEventListener("keydown", handler);
}
};
}, [
close,
nav,
next,
previous
]);
// Unlock focus for browsers like Firefox, that break all user focus if the
// currently focused item becomes disabled.
React.useEffect(()=>{
if (nav == null) {
return;
}
const root = nav.getRootNode();
// Always true, but we do this for TypeScript:
if (root instanceof ShadowRoot) {
const a = root.activeElement;
if (previous == null) {
if (buttonLeft.current && a === buttonLeft.current) {
buttonLeft.current.blur();
}
} else if (next == null) {
if (buttonRight.current && a === buttonRight.current) {
buttonRight.current.blur();
}
}
}
}, [
nav,
next,
previous
]);
return /*#__PURE__*/ _jsxs("div", {
"data-nextjs-dialog-left-right": true,
className: className,
children: [
/*#__PURE__*/ _jsxs("nav", {
ref: onNav,
children: [
/*#__PURE__*/ _jsx("button", {
ref: buttonLeft,
type: "button",
disabled: previous == null ? true : undefined,
"aria-disabled": previous == null ? true : undefined,
onClick: previous != null ? previous : undefined,
children: /*#__PURE__*/ _jsxs("svg", {
viewBox: "0 0 14 14",
fill: "none",
xmlns: "http://www.w3.org/2000/svg",
children: [
/*#__PURE__*/ _jsx("title", {
children: "previous"
}),
/*#__PURE__*/ _jsx("path", {
d: "M6.99996 1.16666L1.16663 6.99999L6.99996 12.8333M12.8333 6.99999H1.99996H12.8333Z",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round"
})
]
})
}),
/*#__PURE__*/ _jsx("button", {
ref: buttonRight,
type: "button",
disabled: next == null ? true : undefined,
"aria-disabled": next == null ? true : undefined,
onClick: next != null ? next : undefined,
children: /*#__PURE__*/ _jsxs("svg", {
viewBox: "0 0 14 14",
fill: "none",
xmlns: "http://www.w3.org/2000/svg",
children: [
/*#__PURE__*/ _jsx("title", {
children: "next"
}),
/*#__PURE__*/ _jsx("path", {
d: "M6.99996 1.16666L12.8333 6.99999L6.99996 12.8333M1.16663 6.99999H12H1.16663Z",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round"
})
]
})
}),
children
]
}),
close ? /*#__PURE__*/ _jsx("button", {
"data-nextjs-errors-dialog-left-right-close-button": true,
ref: buttonClose,
type: "button",
onClick: close,
"aria-label": "Close",
children: /*#__PURE__*/ _jsx("span", {
"aria-hidden": "true",
children: /*#__PURE__*/ _jsx(CloseIcon, {})
})
}) : null
]
});
};
export { LeftRightDialogHeader };
//# sourceMappingURL=LeftRightDialogHeader.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/LeftRightDialogHeader/LeftRightDialogHeader.tsx"],"names":["React","CloseIcon","LeftRightDialogHeader","children","className","previous","next","close","buttonLeft","useRef","buttonRight","buttonClose","nav","setNav","useState","onNav","useCallback","el","useEffect","root","getRootNode","d","self","document","handler","e","key","preventDefault","stopPropagation","current","focus","ShadowRoot","a","activeElement","HTMLElement","blur","addEventListener","removeEventListener","div","data-nextjs-dialog-left-right","ref","button","type","disabled","undefined","aria-disabled","onClick","svg","viewBox","fill","xmlns","title","path","stroke","strokeWidth","strokeLinecap","strokeLinejoin","data-nextjs-errors-dialog-left-right-close-button","aria-label","span","aria-hidden"],"mappings":";AAAA,YAAYA,WAAW,QAAO;AAC9B,SAASC,SAAS,QAAQ,wBAAuB;AAUjD,MAAMC,wBACJ,SAASA,sBAAsB,KAM9B;IAN8B,IAAA,EAC7BC,QAAQ,EACRC,SAAS,EACTC,QAAQ,EACRC,IAAI,EACJC,KAAK,EACN,GAN8B;IAO7B,MAAMC,aAAaR,MAAMS,MAAM,CAA2B;IAC1D,MAAMC,cAAcV,MAAMS,MAAM,CAA2B;IAC3D,MAAME,cAAcX,MAAMS,MAAM,CAA2B;IAE3D,MAAM,CAACG,KAAKC,OAAO,GAAGb,MAAMc,QAAQ,CAAqB;IACzD,MAAMC,QAAQf,MAAMgB,WAAW,CAAC,CAACC;QAC/BJ,OAAOI;IACT,GAAG,EAAE;IAELjB,MAAMkB,SAAS,CAAC;QACd,IAAIN,OAAO,MAAM;YACf;QACF;QAEA,MAAMO,OAAOP,IAAIQ,WAAW;QAC5B,MAAMC,IAAIC,KAAKC,QAAQ;QAEvB,SAASC,QAAQC,CAAgB;YAC/B,IAAIA,EAAEC,GAAG,KAAK,aAAa;gBACzBD,EAAEE,cAAc;gBAChBF,EAAEG,eAAe;gBACjB,IAAIpB,WAAWqB,OAAO,EAAE;oBACtBrB,WAAWqB,OAAO,CAACC,KAAK;gBAC1B;gBACAzB,YAAYA;YACd,OAAO,IAAIoB,EAAEC,GAAG,KAAK,cAAc;gBACjCD,EAAEE,cAAc;gBAChBF,EAAEG,eAAe;gBACjB,IAAIlB,YAAYmB,OAAO,EAAE;oBACvBnB,YAAYmB,OAAO,CAACC,KAAK;gBAC3B;gBACAxB,QAAQA;YACV,OAAO,IAAImB,EAAEC,GAAG,KAAK,UAAU;gBAC7BD,EAAEE,cAAc;gBAChBF,EAAEG,eAAe;gBACjB,IAAIT,gBAAgBY,YAAY;oBAC9B,MAAMC,IAAIb,KAAKc,aAAa;oBAC5B,IAAID,KAAKA,MAAMrB,YAAYkB,OAAO,IAAIG,aAAaE,aAAa;wBAC9DF,EAAEG,IAAI;wBACN;oBACF;gBACF;gBAEA5B,yBAAAA;YACF;QACF;QAEAY,KAAKiB,gBAAgB,CAAC,WAAWZ;QACjC,IAAIL,SAASE,GAAG;YACdA,EAAEe,gBAAgB,CAAC,WAAWZ;QAChC;QACA,OAAO;YACLL,KAAKkB,mBAAmB,CAAC,WAAWb;YACpC,IAAIL,SAASE,GAAG;gBACdA,EAAEgB,mBAAmB,CAAC,WAAWb;YACnC;QACF;IACF,GAAG;QAACjB;QAAOK;QAAKN;QAAMD;KAAS;IAE/B,2EAA2E;IAC3E,2CAA2C;IAC3CL,MAAMkB,SAAS,CAAC;QACd,IAAIN,OAAO,MAAM;YACf;QACF;QAEA,MAAMO,OAAOP,IAAIQ,WAAW;QAC5B,8CAA8C;QAC9C,IAAID,gBAAgBY,YAAY;YAC9B,MAAMC,IAAIb,KAAKc,aAAa;YAE5B,IAAI5B,YAAY,MAAM;gBACpB,IAAIG,WAAWqB,OAAO,IAAIG,MAAMxB,WAAWqB,OAAO,EAAE;oBAClDrB,WAAWqB,OAAO,CAACM,IAAI;gBACzB;YACF,OAAO,IAAI7B,QAAQ,MAAM;gBACvB,IAAII,YAAYmB,OAAO,IAAIG,MAAMtB,YAAYmB,OAAO,EAAE;oBACpDnB,YAAYmB,OAAO,CAACM,IAAI;gBAC1B;YACF;QACF;IACF,GAAG;QAACvB;QAAKN;QAAMD;KAAS;IAExB,qBACE,MAACiC;QAAIC,+BAA6B;QAACnC,WAAWA;;0BAC5C,MAACQ;gBAAI4B,KAAKzB;;kCACR,KAAC0B;wBACCD,KAAKhC;wBACLkC,MAAK;wBACLC,UAAUtC,YAAY,OAAO,OAAOuC;wBACpCC,iBAAexC,YAAY,OAAO,OAAOuC;wBACzCE,SAASzC,mBAAAA,WAAYuC;kCAErB,cAAA,MAACG;4BACCC,SAAQ;4BACRC,MAAK;4BACLC,OAAM;;8CAEN,KAACC;8CAAM;;8CACP,KAACC;oCACC/B,GAAE;oCACFgC,QAAO;oCACPC,aAAY;oCACZC,eAAc;oCACdC,gBAAe;;;;;kCAIrB,KAACf;wBACCD,KAAK9B;wBACLgC,MAAK;wBACLC,UAAUrC,QAAQ,OAAO,OAAOsC;wBAChCC,iBAAevC,QAAQ,OAAO,OAAOsC;wBACrCE,SAASxC,eAAAA,OAAQsC;kCAEjB,cAAA,MAACG;4BACCC,SAAQ;4BACRC,MAAK;4BACLC,OAAM;;8CAEN,KAACC;8CAAM;;8CACP,KAACC;oCACC/B,GAAE;oCACFgC,QAAO;oCACPC,aAAY;oCACZC,eAAc;oCACdC,gBAAe;;;;;oBAIpBrD;;;YAEFI,sBACC,KAACkC;gBACCgB,mDAAiD;gBACjDjB,KAAK7B;gBACL+B,MAAK;gBACLI,SAASvC;gBACTmD,cAAW;0BAEX,cAAA,KAACC;oBAAKC,eAAY;8BAChB,cAAA,KAAC3D;;iBAGH;;;AAGV;AAEF,SAASC,qBAAqB,GAAE"}

View File

@ -0,0 +1,4 @@
export { LeftRightDialogHeader } from "./LeftRightDialogHeader";
export { styles } from "./styles";
//# sourceMappingURL=index.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/LeftRightDialogHeader/index.ts"],"names":["LeftRightDialogHeader","styles"],"mappings":"AAAA,SAASA,qBAAqB,QAAQ,0BAAyB;AAC/D,SAASC,MAAM,QAAQ,WAAU"}

View File

@ -0,0 +1,15 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n [data-nextjs-dialog-left-right] {\n display: flex;\n flex-direction: row;\n align-content: center;\n align-items: center;\n justify-content: space-between;\n }\n [data-nextjs-dialog-left-right] > nav {\n flex: 1;\n display: flex;\n align-items: center;\n margin-right: var(--size-gap);\n }\n [data-nextjs-dialog-left-right] > nav > button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n width: calc(var(--size-gap-double) + var(--size-gap));\n height: calc(var(--size-gap-double) + var(--size-gap));\n font-size: 0;\n border: none;\n background-color: rgba(255, 85, 85, 0.1);\n color: var(--color-ansi-red);\n cursor: pointer;\n transition: background-color 0.25s ease;\n }\n [data-nextjs-dialog-left-right] > nav > button > svg {\n width: auto;\n height: calc(var(--size-gap) + var(--size-gap-half));\n }\n [data-nextjs-dialog-left-right] > nav > button:hover {\n background-color: rgba(255, 85, 85, 0.2);\n }\n [data-nextjs-dialog-left-right] > nav > button:disabled {\n background-color: rgba(255, 85, 85, 0.1);\n color: rgba(255, 85, 85, 0.4);\n cursor: not-allowed;\n }\n\n [data-nextjs-dialog-left-right] > nav > button:first-of-type {\n border-radius: var(--size-gap-half) 0 0 var(--size-gap-half);\n margin-right: 1px;\n }\n [data-nextjs-dialog-left-right] > nav > button:last-of-type {\n border-radius: 0 var(--size-gap-half) var(--size-gap-half) 0;\n }\n\n [data-nextjs-dialog-left-right] > button:last-of-type {\n border: 0;\n padding: 0;\n\n background-color: transparent;\n appearance: none;\n\n opacity: 0.4;\n transition: opacity 0.25s ease;\n\n color: var(--color-font);\n }\n [data-nextjs-dialog-left-right] > button:last-of-type:hover {\n opacity: 0.7;\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { noop as css } from "../../helpers/noop-template";
const styles = css(_templateObject());
export { styles };
//# sourceMappingURL=styles.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/LeftRightDialogHeader/styles.ts"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AAkEf,SAASC,MAAM,GAAE"}

View File

@ -0,0 +1,45 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import allyTrap from "./maintain--tab-focus";
import * as React from "react";
import { lock, unlock } from "./body-locker";
const Overlay = function Overlay(param) {
let { className, children, fixed } = param;
React.useEffect(()=>{
lock();
return ()=>{
unlock();
};
}, []);
const [overlay, setOverlay] = React.useState(null);
const onOverlay = React.useCallback((el)=>{
setOverlay(el);
}, []);
React.useEffect(()=>{
if (overlay == null) {
return;
}
const handle2 = allyTrap({
context: overlay
});
return ()=>{
handle2.disengage();
};
}, [
overlay
]);
return /*#__PURE__*/ _jsxs("div", {
"data-nextjs-dialog-overlay": true,
className: className,
ref: onOverlay,
children: [
/*#__PURE__*/ _jsx("div", {
"data-nextjs-dialog-backdrop": true,
"data-nextjs-dialog-backdrop-fixed": fixed ? true : undefined
}),
children
]
});
};
export { Overlay };
//# sourceMappingURL=Overlay.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Overlay/Overlay.tsx"],"names":["allyTrap","React","lock","unlock","Overlay","className","children","fixed","useEffect","overlay","setOverlay","useState","onOverlay","useCallback","el","handle2","context","disengage","div","data-nextjs-dialog-overlay","ref","data-nextjs-dialog-backdrop","data-nextjs-dialog-backdrop-fixed","undefined"],"mappings":";AAAA,OAAOA,cAAc,wBAAuB;AAC5C,YAAYC,WAAW,QAAO;AAC9B,SAASC,IAAI,EAAEC,MAAM,QAAQ,gBAAe;AAQ5C,MAAMC,UAAkC,SAASA,QAAQ,KAIxD;IAJwD,IAAA,EACvDC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACN,GAJwD;IAKvDN,MAAMO,SAAS,CAAC;QACdN;QACA,OAAO;YACLC;QACF;IACF,GAAG,EAAE;IAEL,MAAM,CAACM,SAASC,WAAW,GAAGT,MAAMU,QAAQ,CAAwB;IACpE,MAAMC,YAAYX,MAAMY,WAAW,CAAC,CAACC;QACnCJ,WAAWI;IACb,GAAG,EAAE;IAELb,MAAMO,SAAS,CAAC;QACd,IAAIC,WAAW,MAAM;YACnB;QACF;QAEA,MAAMM,UAAUf,SAAS;YAAEgB,SAASP;QAAQ;QAC5C,OAAO;YACLM,QAAQE,SAAS;QACnB;IACF,GAAG;QAACR;KAAQ;IAEZ,qBACE,MAACS;QAAIC,4BAA0B;QAACd,WAAWA;QAAWe,KAAKR;;0BACzD,KAACM;gBACCG,6BAA2B;gBAC3BC,qCAAmCf,QAAQ,OAAOgB;;YAEnDjB;;;AAGP;AAEA,SAASF,OAAO,GAAE"}

View File

@ -0,0 +1,34 @@
let previousBodyPaddingRight;
let previousBodyOverflowSetting;
let activeLocks = 0;
export function lock() {
setTimeout(()=>{
if (activeLocks++ > 0) {
return;
}
const scrollBarGap = window.innerWidth - document.documentElement.clientWidth;
if (scrollBarGap > 0) {
previousBodyPaddingRight = document.body.style.paddingRight;
document.body.style.paddingRight = "" + scrollBarGap + "px";
}
previousBodyOverflowSetting = document.body.style.overflow;
document.body.style.overflow = "hidden";
});
}
export function unlock() {
setTimeout(()=>{
if (activeLocks === 0 || --activeLocks !== 0) {
return;
}
if (previousBodyPaddingRight !== undefined) {
document.body.style.paddingRight = previousBodyPaddingRight;
previousBodyPaddingRight = undefined;
}
if (previousBodyOverflowSetting !== undefined) {
document.body.style.overflow = previousBodyOverflowSetting;
previousBodyOverflowSetting = undefined;
}
});
}
//# sourceMappingURL=body-locker.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Overlay/body-locker.ts"],"names":["previousBodyPaddingRight","previousBodyOverflowSetting","activeLocks","lock","setTimeout","scrollBarGap","window","innerWidth","document","documentElement","clientWidth","body","style","paddingRight","overflow","unlock","undefined"],"mappings":"AAAA,IAAIA;AACJ,IAAIC;AAEJ,IAAIC,cAAc;AAElB,OAAO,SAASC;IACdC,WAAW;QACT,IAAIF,gBAAgB,GAAG;YACrB;QACF;QAEA,MAAMG,eACJC,OAAOC,UAAU,GAAGC,SAASC,eAAe,CAACC,WAAW;QAE1D,IAAIL,eAAe,GAAG;YACpBL,2BAA2BQ,SAASG,IAAI,CAACC,KAAK,CAACC,YAAY;YAC3DL,SAASG,IAAI,CAACC,KAAK,CAACC,YAAY,GAAG,AAAC,KAAER,eAAa;QACrD;QAEAJ,8BAA8BO,SAASG,IAAI,CAACC,KAAK,CAACE,QAAQ;QAC1DN,SAASG,IAAI,CAACC,KAAK,CAACE,QAAQ,GAAG;IACjC;AACF;AAEA,OAAO,SAASC;IACdX,WAAW;QACT,IAAIF,gBAAgB,KAAK,EAAEA,gBAAgB,GAAG;YAC5C;QACF;QAEA,IAAIF,6BAA6BgB,WAAW;YAC1CR,SAASG,IAAI,CAACC,KAAK,CAACC,YAAY,GAAGb;YACnCA,2BAA2BgB;QAC7B;QAEA,IAAIf,gCAAgCe,WAAW;YAC7CR,SAASG,IAAI,CAACC,KAAK,CAACE,QAAQ,GAAGb;YAC/BA,8BAA8Be;QAChC;IACF;AACF"}

View File

@ -0,0 +1,3 @@
export { Overlay } from "./Overlay";
//# sourceMappingURL=index.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Overlay/index.tsx"],"names":["Overlay"],"mappings":"AAAA,SAASA,OAAO,QAAQ,YAAW"}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,15 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n [data-nextjs-dialog-overlay] {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n overflow: auto;\n z-index: 9000;\n\n display: flex;\n align-content: center;\n align-items: center;\n flex-direction: column;\n padding: 10vh 15px 0;\n }\n\n @media (max-height: 812px) {\n [data-nextjs-dialog-overlay] {\n padding: 15px 15px 0;\n }\n }\n\n [data-nextjs-dialog-backdrop] {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background-color: var(--color-backdrop);\n pointer-events: all;\n z-index: -1;\n }\n\n [data-nextjs-dialog-backdrop-fixed] {\n cursor: not-allowed;\n -webkit-backdrop-filter: blur(8px);\n backdrop-filter: blur(8px);\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { noop as css } from "../../helpers/noop-template";
const styles = css(_templateObject());
export { styles };
//# sourceMappingURL=styles.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Overlay/styles.tsx"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AAyCf,SAASC,MAAM,GAAE"}

View File

@ -0,0 +1,25 @@
import * as React from "react";
import { createPortal } from "react-dom";
export function ShadowPortal(param) {
let { children } = param;
let portalNode = React.useRef(null);
let shadowNode = React.useRef(null);
let [, forceUpdate] = React.useState();
React.useLayoutEffect(()=>{
const ownerDocument = document;
portalNode.current = ownerDocument.createElement("nextjs-portal");
shadowNode.current = portalNode.current.attachShadow({
mode: "open"
});
ownerDocument.body.appendChild(portalNode.current);
forceUpdate({});
return ()=>{
if (portalNode.current && portalNode.current.ownerDocument) {
portalNode.current.ownerDocument.body.removeChild(portalNode.current);
}
};
}, []);
return shadowNode.current ? /*#__PURE__*/ createPortal(children, shadowNode.current) : null;
}
//# sourceMappingURL=ShadowPortal.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/components/ShadowPortal.tsx"],"names":["React","createPortal","ShadowPortal","children","portalNode","useRef","shadowNode","forceUpdate","useState","useLayoutEffect","ownerDocument","document","current","createElement","attachShadow","mode","body","appendChild","removeChild"],"mappings":"AAAA,YAAYA,WAAW,QAAO;AAC9B,SAASC,YAAY,QAAQ,YAAW;AAExC,OAAO,SAASC,aAAa,KAA2C;IAA3C,IAAA,EAAEC,QAAQ,EAAiC,GAA3C;IAC3B,IAAIC,aAAaJ,MAAMK,MAAM,CAAqB;IAClD,IAAIC,aAAaN,MAAMK,MAAM,CAAoB;IACjD,IAAI,GAAGE,YAAY,GAAGP,MAAMQ,QAAQ;IAEpCR,MAAMS,eAAe,CAAC;QACpB,MAAMC,gBAAgBC;QACtBP,WAAWQ,OAAO,GAAGF,cAAcG,aAAa,CAAC;QACjDP,WAAWM,OAAO,GAAGR,WAAWQ,OAAO,CAACE,YAAY,CAAC;YAAEC,MAAM;QAAO;QACpEL,cAAcM,IAAI,CAACC,WAAW,CAACb,WAAWQ,OAAO;QACjDL,YAAY,CAAC;QACb,OAAO;YACL,IAAIH,WAAWQ,OAAO,IAAIR,WAAWQ,OAAO,CAACF,aAAa,EAAE;gBAC1DN,WAAWQ,OAAO,CAACF,aAAa,CAACM,IAAI,CAACE,WAAW,CAACd,WAAWQ,OAAO;YACtE;QACF;IACF,GAAG,EAAE;IAEL,OAAON,WAAWM,OAAO,iBACrBX,aAAaE,UAAUG,WAAWM,OAAO,IACzC;AACN"}

View File

@ -0,0 +1,50 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from "react";
import { useOpenInEditor } from "../../helpers/use-open-in-editor";
export function EditorLink(param) {
let { file, isSourceFile, location } = param;
var _location_line, _location_column;
const open = useOpenInEditor({
file,
lineNumber: (_location_line = location == null ? void 0 : location.line) != null ? _location_line : 1,
column: (_location_column = location == null ? void 0 : location.column) != null ? _location_column : 0
});
return /*#__PURE__*/ _jsxs("div", {
"data-with-open-in-editor-link": true,
"data-with-open-in-editor-link-source-file": isSourceFile ? true : undefined,
"data-with-open-in-editor-link-import-trace": isSourceFile ? undefined : true,
tabIndex: 10,
role: "link",
onClick: open,
title: "Click to open in your editor",
children: [
file,
location ? ":" + location.line + ":" + location.column : null,
/*#__PURE__*/ _jsxs("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
children: [
/*#__PURE__*/ _jsx("path", {
d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"
}),
/*#__PURE__*/ _jsx("polyline", {
points: "15 3 21 3 21 9"
}),
/*#__PURE__*/ _jsx("line", {
x1: "10",
y1: "14",
x2: "21",
y2: "3"
})
]
})
]
});
}
//# sourceMappingURL=EditorLink.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Terminal/EditorLink.tsx"],"names":["React","useOpenInEditor","EditorLink","file","isSourceFile","location","open","lineNumber","line","column","div","data-with-open-in-editor-link","data-with-open-in-editor-link-source-file","undefined","data-with-open-in-editor-link-import-trace","tabIndex","role","onClick","title","svg","xmlns","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","path","d","polyline","points","x1","y1","x2","y2"],"mappings":";AAAA,OAAOA,WAAW,QAAO;AACzB,SAASC,eAAe,QAAQ,mCAAkC;AAUlE,OAAO,SAASC,WAAW,KAAiD;IAAjD,IAAA,EAAEC,IAAI,EAAEC,YAAY,EAAEC,QAAQ,EAAmB,GAAjD;QAGXA,gBACJA;IAHV,MAAMC,OAAOL,gBAAgB;QAC3BE;QACAI,YAAYF,CAAAA,iBAAAA,4BAAAA,SAAUG,IAAI,YAAdH,iBAAkB;QAC9BI,QAAQJ,CAAAA,mBAAAA,4BAAAA,SAAUI,MAAM,YAAhBJ,mBAAoB;IAC9B;IAEA,qBACE,MAACK;QACCC,+BAA6B;QAC7BC,6CACER,eAAe,OAAOS;QAExBC,8CACEV,eAAeS,YAAY;QAE7BE,UAAU;QACVC,MAAM;QACNC,SAASX;QACTY,OAAO;;YAENf;YACAE,WAAW,AAAC,MAAGA,SAASG,IAAI,GAAC,MAAGH,SAASI,MAAM,GAAK;0BACrD,MAACU;gBACCC,OAAM;gBACNC,SAAQ;gBACRC,MAAK;gBACLC,QAAO;gBACPC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;kCAEf,KAACC;wBAAKC,GAAE;;kCACR,KAACC;wBAASC,QAAO;;kCACjB,KAACtB;wBAAKuB,IAAG;wBAAKC,IAAG;wBAAKC,IAAG;wBAAKC,IAAG;;;;;;AAIzC"}

View File

@ -0,0 +1,90 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import Anser from "next/dist/compiled/anser";
import * as React from "react";
import { HotlinkedText } from "../hot-linked-text";
import { EditorLink } from "./EditorLink";
function getFile(lines) {
const contentFileName = lines.shift();
if (!contentFileName) return null;
const [fileName, line, column] = contentFileName.split(":", 3);
const parsedLine = Number(line);
const parsedColumn = Number(column);
const hasLocation = !Number.isNaN(parsedLine) && !Number.isNaN(parsedColumn);
return {
fileName: hasLocation ? fileName : contentFileName,
location: hasLocation ? {
line: parsedLine,
column: parsedColumn
} : undefined
};
}
function getImportTraceFiles(lines) {
if (lines.some((line)=>/ReactServerComponentsError:/.test(line)) || lines.some((line)=>/Import trace for requested module:/.test(line))) {
// Grab the lines at the end containing the files
const files = [];
while(/.+\..+/.test(lines[lines.length - 1]) && !lines[lines.length - 1].includes(":")){
const file = lines.pop().trim();
files.unshift(file);
}
return files;
}
return [];
}
function getEditorLinks(content) {
const lines = content.split("\n");
const file = getFile(lines);
const importTraceFiles = getImportTraceFiles(lines);
return {
file,
source: lines.join("\n"),
importTraceFiles
};
}
export const Terminal = function Terminal(param) {
let { content } = param;
const { file, source, importTraceFiles } = React.useMemo(()=>getEditorLinks(content), [
content
]);
const decoded = React.useMemo(()=>{
return Anser.ansiToJson(source, {
json: true,
use_classes: true,
remove_empty: true
});
}, [
source
]);
return /*#__PURE__*/ _jsxs("div", {
"data-nextjs-terminal": true,
children: [
file && /*#__PURE__*/ _jsx(EditorLink, {
isSourceFile: true,
file: file.fileName,
location: file.location
}, file.fileName),
/*#__PURE__*/ _jsxs("pre", {
children: [
decoded.map((entry, index)=>/*#__PURE__*/ _jsx("span", {
style: {
color: entry.fg ? "var(--color-" + entry.fg + ")" : undefined,
...entry.decoration === "bold" ? {
fontWeight: 800
} : entry.decoration === "italic" ? {
fontStyle: "italic"
} : undefined
},
children: /*#__PURE__*/ _jsx(HotlinkedText, {
text: entry.content
})
}, "terminal-entry-" + index)),
importTraceFiles.map((importTraceFile)=>/*#__PURE__*/ _jsx(EditorLink, {
isSourceFile: false,
file: importTraceFile
}, importTraceFile))
]
})
]
});
};
//# sourceMappingURL=Terminal.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Terminal/Terminal.tsx"],"names":["Anser","React","HotlinkedText","EditorLink","getFile","lines","contentFileName","shift","fileName","line","column","split","parsedLine","Number","parsedColumn","hasLocation","isNaN","location","undefined","getImportTraceFiles","some","test","files","length","includes","file","pop","trim","unshift","getEditorLinks","content","importTraceFiles","source","join","Terminal","useMemo","decoded","ansiToJson","json","use_classes","remove_empty","div","data-nextjs-terminal","isSourceFile","pre","map","entry","index","span","style","color","fg","decoration","fontWeight","fontStyle","text","importTraceFile"],"mappings":";AAAA,OAAOA,WAAW,2BAA0B;AAC5C,YAAYC,WAAW,QAAO;AAC9B,SAASC,aAAa,QAAQ,qBAAoB;AAClD,SAASC,UAAU,QAAQ,eAAc;AAIzC,SAASC,QAAQC,KAAe;IAC9B,MAAMC,kBAAkBD,MAAME,KAAK;IACnC,IAAI,CAACD,iBAAiB,OAAO;IAC7B,MAAM,CAACE,UAAUC,MAAMC,OAAO,GAAGJ,gBAAgBK,KAAK,CAAC,KAAK;IAE5D,MAAMC,aAAaC,OAAOJ;IAC1B,MAAMK,eAAeD,OAAOH;IAC5B,MAAMK,cAAc,CAACF,OAAOG,KAAK,CAACJ,eAAe,CAACC,OAAOG,KAAK,CAACF;IAE/D,OAAO;QACLN,UAAUO,cAAcP,WAAWF;QACnCW,UAAUF,cACN;YACEN,MAAMG;YACNF,QAAQI;QACV,IACAI;IACN;AACF;AAEA,SAASC,oBAAoBd,KAAe;IAC1C,IACEA,MAAMe,IAAI,CAAC,CAACX,OAAS,8BAA8BY,IAAI,CAACZ,UACxDJ,MAAMe,IAAI,CAAC,CAACX,OAAS,qCAAqCY,IAAI,CAACZ,QAC/D;QACA,iDAAiD;QACjD,MAAMa,QAAQ,EAAE;QAChB,MACE,SAASD,IAAI,CAAChB,KAAK,CAACA,MAAMkB,MAAM,GAAG,EAAE,KACrC,CAAClB,KAAK,CAACA,MAAMkB,MAAM,GAAG,EAAE,CAACC,QAAQ,CAAC,KAClC;YACA,MAAMC,OAAOpB,MAAMqB,GAAG,GAAIC,IAAI;YAC9BL,MAAMM,OAAO,CAACH;QAChB;QAEA,OAAOH;IACT;IAEA,OAAO,EAAE;AACX;AAEA,SAASO,eAAeC,OAAe;IACrC,MAAMzB,QAAQyB,QAAQnB,KAAK,CAAC;IAC5B,MAAMc,OAAOrB,QAAQC;IACrB,MAAM0B,mBAAmBZ,oBAAoBd;IAE7C,OAAO;QAAEoB;QAAMO,QAAQ3B,MAAM4B,IAAI,CAAC;QAAOF;IAAiB;AAC5D;AAEA,OAAO,MAAMG,WAAoC,SAASA,SAAS,KAElE;IAFkE,IAAA,EACjEJ,OAAO,EACR,GAFkE;IAGjE,MAAM,EAAEL,IAAI,EAAEO,MAAM,EAAED,gBAAgB,EAAE,GAAG9B,MAAMkC,OAAO,CACtD,IAAMN,eAAeC,UACrB;QAACA;KAAQ;IAGX,MAAMM,UAAUnC,MAAMkC,OAAO,CAAC;QAC5B,OAAOnC,MAAMqC,UAAU,CAACL,QAAQ;YAC9BM,MAAM;YACNC,aAAa;YACbC,cAAc;QAChB;IACF,GAAG;QAACR;KAAO;IAEX,qBACE,MAACS;QAAIC,sBAAoB;;YACtBjB,sBACC,KAACtB;gBACCwC,YAAY;gBAEZlB,MAAMA,KAAKjB,QAAQ;gBACnBS,UAAUQ,KAAKR,QAAQ;eAFlBQ,KAAKjB,QAAQ;0BAKtB,MAACoC;;oBACER,QAAQS,GAAG,CAAC,CAACC,OAAOC,sBACnB,KAACC;4BAECC,OAAO;gCACLC,OAAOJ,MAAMK,EAAE,GAAG,AAAC,iBAAcL,MAAMK,EAAE,GAAC,MAAKjC;gCAC/C,GAAI4B,MAAMM,UAAU,KAAK,SACrB;oCAAEC,YAAY;gCAAI,IAClBP,MAAMM,UAAU,KAAK,WACrB;oCAAEE,WAAW;gCAAS,IACtBpC,SAAS;4BACf;sCAEA,cAAA,KAAChB;gCAAcqD,MAAMT,MAAMhB,OAAO;;2BAV7B,AAAC,oBAAiBiB;oBAa1BhB,iBAAiBc,GAAG,CAAC,CAACW,gCACrB,KAACrD;4BACCwC,cAAc;4BAEdlB,MAAM+B;2BADDA;;;;;AAOjB,EAAC"}

View File

@ -0,0 +1,3 @@
export { Terminal } from "./Terminal";
//# sourceMappingURL=index.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Terminal/index.tsx"],"names":["Terminal"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,aAAY"}

View File

@ -0,0 +1,15 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n [data-nextjs-terminal] {\n border-radius: var(--size-gap-half);\n background-color: var(--color-ansi-bg);\n color: var(--color-ansi-fg);\n }\n [data-nextjs-terminal]::selection,\n [data-nextjs-terminal] *::selection {\n background-color: var(--color-ansi-selection);\n }\n [data-nextjs-terminal] * {\n color: inherit;\n background-color: transparent;\n font-family: var(--font-stack-monospace);\n }\n [data-nextjs-terminal] > * {\n margin: 0;\n padding: calc(var(--size-gap) + var(--size-gap-half))\n calc(var(--size-gap-double) + var(--size-gap-half));\n }\n\n [data-nextjs-terminal] pre {\n white-space: pre-wrap;\n word-break: break-word;\n }\n\n [data-with-open-in-editor-link] svg {\n width: auto;\n height: var(--size-font-small);\n margin-left: var(--size-gap);\n }\n [data-with-open-in-editor-link] {\n cursor: pointer;\n }\n [data-with-open-in-editor-link]:hover {\n text-decoration: underline dotted;\n }\n [data-with-open-in-editor-link-source-file] {\n border-bottom: 1px solid var(--color-ansi-bright-black);\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n [data-with-open-in-editor-link-import-trace] {\n margin-left: var(--size-gap-double);\n }\n [data-nextjs-terminal] a {\n color: inherit;\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { noop as css } from "../../helpers/noop-template";
const styles = css(_templateObject());
export { styles };
//# sourceMappingURL=styles.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Terminal/styles.tsx"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AAmDf,SAASC,MAAM,GAAE"}

View File

@ -0,0 +1,19 @@
import { jsx as _jsx } from "react/jsx-runtime";
import * as React from "react";
export const Toast = function Toast(param) {
let { onClick, children, className } = param;
return /*#__PURE__*/ _jsx("div", {
"data-nextjs-toast": true,
onClick: (e)=>{
e.preventDefault();
return onClick == null ? void 0 : onClick();
},
className: className,
children: /*#__PURE__*/ _jsx("div", {
"data-nextjs-toast-wrapper": true,
children: children
})
});
};
//# sourceMappingURL=Toast.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Toast/Toast.tsx"],"names":["React","Toast","onClick","children","className","div","data-nextjs-toast","e","preventDefault","data-nextjs-toast-wrapper"],"mappings":";AAAA,YAAYA,WAAW,QAAO;AAQ9B,OAAO,MAAMC,QAA8B,SAASA,MAAM,KAIzD;IAJyD,IAAA,EACxDC,OAAO,EACPC,QAAQ,EACRC,SAAS,EACV,GAJyD;IAKxD,qBACE,KAACC;QACCC,mBAAiB;QACjBJ,SAAS,CAACK;YACRA,EAAEC,cAAc;YAChB,OAAON,2BAAAA;QACT;QACAE,WAAWA;kBAEX,cAAA,KAACC;YAAII,2BAAyB;sBAAEN;;;AAGtC,EAAC"}

View File

@ -0,0 +1,4 @@
export { styles } from "./styles";
export { Toast } from "./Toast";
//# sourceMappingURL=index.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Toast/index.tsx"],"names":["styles","Toast"],"mappings":"AAAA,SAASA,MAAM,QAAQ,WAAU;AACjC,SAASC,KAAK,QAAQ,UAAS"}

View File

@ -0,0 +1,15 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n [data-nextjs-toast] {\n position: fixed;\n bottom: var(--size-gap-double);\n left: var(--size-gap-double);\n max-width: 420px;\n z-index: 9000;\n }\n\n @media (max-width: 440px) {\n [data-nextjs-toast] {\n max-width: 90vw;\n left: 5vw;\n }\n }\n\n [data-nextjs-toast-wrapper] {\n padding: 16px;\n border-radius: var(--size-gap-half);\n font-weight: 500;\n color: var(--color-ansi-bright-white);\n background-color: var(--color-ansi-red);\n box-shadow: 0px var(--size-gap-double) var(--size-gap-quad)\n rgba(0, 0, 0, 0.25);\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { noop as css } from "../../helpers/noop-template";
const styles = css(_templateObject());
export { styles };
//# sourceMappingURL=styles.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/Toast/styles.ts"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AA2Bf,SAASC,MAAM,GAAE"}

View File

@ -0,0 +1,75 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from "react";
export function VersionStalenessInfo(props) {
if (!props) return null;
const { staleness } = props;
let { text, indicatorClass, title } = getStaleness(props);
if (!text) return null;
return /*#__PURE__*/ _jsxs("small", {
className: "nextjs-container-build-error-version-status",
children: [
/*#__PURE__*/ _jsx("span", {
className: indicatorClass
}),
/*#__PURE__*/ _jsx("small", {
"data-nextjs-version-checker": true,
title: title,
children: text
}),
" ",
staleness === "fresh" || staleness === "newer-than-npm" || staleness === "unknown" ? null : /*#__PURE__*/ _jsx("a", {
target: "_blank",
rel: "noopener noreferrer",
href: "https://nextjs.org/docs/messages/version-staleness",
children: "(learn more)"
}),
process.env.TURBOPACK ? " (turbo)" : ""
]
});
}
export function getStaleness(param) {
let { installed, staleness, expected } = param;
let text = "";
let title = "";
let indicatorClass = "";
const versionLabel = "Next.js (" + installed + ")";
switch(staleness){
case "newer-than-npm":
case "fresh":
text = versionLabel;
title = "Latest available version is detected (" + installed + ").";
indicatorClass = "fresh";
break;
case "stale-patch":
case "stale-minor":
text = "" + versionLabel + " out of date";
title = "There is a newer version (" + expected + ") available, upgrade recommended! ";
indicatorClass = "stale";
break;
case "stale-major":
{
text = "" + versionLabel + " is outdated";
title = "An outdated version detected (latest is " + expected + "), upgrade is highly recommended!";
indicatorClass = "outdated";
break;
}
case "stale-prerelease":
{
text = "" + versionLabel + " is outdated";
title = "There is a newer canary version (" + expected + ") available, please upgrade! ";
indicatorClass = "stale";
break;
}
case "unknown":
break;
default:
break;
}
return {
text,
indicatorClass,
title
};
}
//# sourceMappingURL=VersionStalenessInfo.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/VersionStalenessInfo/VersionStalenessInfo.tsx"],"names":["React","VersionStalenessInfo","props","staleness","text","indicatorClass","title","getStaleness","small","className","span","data-nextjs-version-checker","a","target","rel","href","process","env","TURBOPACK","installed","expected","versionLabel"],"mappings":";AAAA,OAAOA,WAAW,QAAO;AAGzB,OAAO,SAASC,qBAAqBC,KAAkB;IACrD,IAAI,CAACA,OAAO,OAAO;IACnB,MAAM,EAAEC,SAAS,EAAE,GAAGD;IACtB,IAAI,EAAEE,IAAI,EAAEC,cAAc,EAAEC,KAAK,EAAE,GAAGC,aAAaL;IAEnD,IAAI,CAACE,MAAM,OAAO;IAElB,qBACE,MAACI;QAAMC,WAAU;;0BACf,KAACC;gBAAKD,WAAWJ;;0BACjB,KAACG;gBAAMG,6BAA2B;gBAACL,OAAOA;0BACvCF;;YACM;YACRD,cAAc,WACfA,cAAc,oBACdA,cAAc,YAAY,qBACxB,KAACS;gBACCC,QAAO;gBACPC,KAAI;gBACJC,MAAK;0BACN;;YAIFC,QAAQC,GAAG,CAACC,SAAS,GAAG,aAAa;;;AAG5C;AAEA,OAAO,SAASX,aAAa,KAA+C;IAA/C,IAAA,EAAEY,SAAS,EAAEhB,SAAS,EAAEiB,QAAQ,EAAe,GAA/C;IAC3B,IAAIhB,OAAO;IACX,IAAIE,QAAQ;IACZ,IAAID,iBAAiB;IACrB,MAAMgB,eAAe,AAAC,cAAWF,YAAU;IAC3C,OAAQhB;QACN,KAAK;QACL,KAAK;YACHC,OAAOiB;YACPf,QAAQ,AAAC,2CAAwCa,YAAU;YAC3Dd,iBAAiB;YACjB;QACF,KAAK;QACL,KAAK;YACHD,OAAO,AAAC,KAAEiB,eAAa;YACvBf,QAAQ,AAAC,+BAA4Bc,WAAS;YAC9Cf,iBAAiB;YACjB;QACF,KAAK;YAAe;gBAClBD,OAAO,AAAC,KAAEiB,eAAa;gBACvBf,QAAQ,AAAC,6CAA0Cc,WAAS;gBAC5Df,iBAAiB;gBACjB;YACF;QACA,KAAK;YAAoB;gBACvBD,OAAO,AAAC,KAAEiB,eAAa;gBACvBf,QAAQ,AAAC,sCAAmCc,WAAS;gBACrDf,iBAAiB;gBACjB;YACF;QACA,KAAK;YACH;QACF;YACE;IACJ;IACA,OAAO;QAAED;QAAMC;QAAgBC;IAAM;AACvC"}

View File

@ -0,0 +1,4 @@
export { styles } from "./styles";
export { VersionStalenessInfo } from "./VersionStalenessInfo";
//# sourceMappingURL=index.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/VersionStalenessInfo/index.tsx"],"names":["styles","VersionStalenessInfo"],"mappings":"AAAA,SAASA,MAAM,QAAQ,WAAU;AACjC,SAASC,oBAAoB,QAAQ,yBAAwB"}

View File

@ -0,0 +1,15 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n .nextjs-container-build-error-version-status {\n flex: 1;\n text-align: right;\n }\n .nextjs-container-build-error-version-status small {\n margin-left: var(--size-gap);\n font-size: var(--size-font-small);\n }\n .nextjs-container-build-error-version-status a {\n font-size: var(--size-font-small);\n }\n .nextjs-container-build-error-version-status span {\n display: inline-block;\n width: 10px;\n height: 10px;\n border-radius: 5px;\n background: var(--color-ansi-bright-black);\n }\n .nextjs-container-build-error-version-status span.fresh {\n background: var(--color-ansi-green);\n }\n .nextjs-container-build-error-version-status span.stale {\n background: var(--color-ansi-yellow);\n }\n .nextjs-container-build-error-version-status span.outdated {\n background: var(--color-ansi-red);\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { noop as css } from "../../helpers/noop-template";
const styles = css(_templateObject());
export { styles };
//# sourceMappingURL=styles.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/VersionStalenessInfo/styles.ts"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AA8Bf,SAASC,MAAM,GAAE"}

View File

@ -0,0 +1,57 @@
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import React from "react";
import { decodeMagicIdentifier, MAGIC_IDENTIFIER_REGEX } from "../../../../../../shared/lib/magic-identifier";
const linkRegex = /https?:\/\/[^\s/$.?#].[^\s)'"]*/i;
const splitRegexp = new RegExp("(" + MAGIC_IDENTIFIER_REGEX.source + "|\\s+)");
export const HotlinkedText = function HotlinkedText(props) {
const { text, matcher } = props;
const wordsAndWhitespaces = text.split(splitRegexp);
return /*#__PURE__*/ _jsx(_Fragment, {
children: wordsAndWhitespaces.map((word, index)=>{
if (linkRegex.test(word)) {
const link = linkRegex.exec(word);
const href = link[0];
// If link matcher is present but the link doesn't match, don't turn it into a link
if (typeof matcher === "function" && !matcher(href)) {
return word;
}
return /*#__PURE__*/ _jsx(React.Fragment, {
children: /*#__PURE__*/ _jsx("a", {
href: href,
target: "_blank",
rel: "noreferrer noopener",
children: word
})
}, "link-" + index);
}
try {
const decodedWord = decodeMagicIdentifier(word);
if (decodedWord !== word) {
return /*#__PURE__*/ _jsxs("i", {
children: [
"{",
decodedWord,
"}"
]
}, "ident-" + index);
}
} catch (e) {
return /*#__PURE__*/ _jsxs("i", {
children: [
"{",
word,
" (decoding failed: ",
"" + e,
")",
"}"
]
}, "ident-" + index);
}
return /*#__PURE__*/ _jsx(React.Fragment, {
children: word
}, "text-" + index);
})
});
};
//# sourceMappingURL=index.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/components/hot-linked-text/index.tsx"],"names":["React","decodeMagicIdentifier","MAGIC_IDENTIFIER_REGEX","linkRegex","splitRegexp","RegExp","source","HotlinkedText","props","text","matcher","wordsAndWhitespaces","split","map","word","index","test","link","exec","href","Fragment","a","target","rel","decodedWord","i","e"],"mappings":";AAAA,OAAOA,WAAW,QAAO;AACzB,SACEC,qBAAqB,EACrBC,sBAAsB,QACjB,gDAA+C;AAEtD,MAAMC,YAAY;AAElB,MAAMC,cAAc,IAAIC,OAAO,AAAC,MAAGH,uBAAuBI,MAAM,GAAC;AAEjE,OAAO,MAAMC,gBAGR,SAASA,cAAcC,KAAK;IAC/B,MAAM,EAAEC,IAAI,EAAEC,OAAO,EAAE,GAAGF;IAE1B,MAAMG,sBAAsBF,KAAKG,KAAK,CAACR;IAEvC,qBACE;kBACGO,oBAAoBE,GAAG,CAAC,CAACC,MAAMC;YAC9B,IAAIZ,UAAUa,IAAI,CAACF,OAAO;gBACxB,MAAMG,OAAOd,UAAUe,IAAI,CAACJ;gBAC5B,MAAMK,OAAOF,IAAI,CAAC,EAAE;gBACpB,mFAAmF;gBACnF,IAAI,OAAOP,YAAY,cAAc,CAACA,QAAQS,OAAO;oBACnD,OAAOL;gBACT;gBACA,qBACE,KAACd,MAAMoB,QAAQ;8BACb,cAAA,KAACC;wBAAEF,MAAMA;wBAAMG,QAAO;wBAASC,KAAI;kCAChCT;;mBAFgB,AAAC,UAAOC;YAMjC;YACA,IAAI;gBACF,MAAMS,cAAcvB,sBAAsBa;gBAC1C,IAAIU,gBAAgBV,MAAM;oBACxB,qBACE,MAACW;;4BACE;4BACAD;4BACA;;uBAHK,AAAC,WAAQT;gBAMrB;YACF,EAAE,OAAOW,GAAG;gBACV,qBACE,MAACD;;wBACE;wBACAX;wBAAK;wBAAoB,KAAKY;wBAAE;wBAAE;;mBAF7B,AAAC,WAAQX;YAKrB;YACA,qBAAO,KAACf,MAAMoB,QAAQ;0BAAwBN;eAAlB,AAAC,UAAOC;QACtC;;AAGN,EAAC"}

View File

@ -0,0 +1,70 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n .nextjs-container-errors-header > h1 {\n font-size: var(--size-font-big);\n line-height: var(--size-font-bigger);\n font-weight: bold;\n margin: var(--size-gap-double) 0;\n }\n .nextjs-container-errors-header p {\n font-size: var(--size-font-small);\n line-height: var(--size-font-big);\n white-space: pre-wrap;\n }\n .nextjs-container-errors-body footer {\n margin-top: var(--size-gap);\n }\n .nextjs-container-errors-body footer p {\n margin: 0;\n }\n\n .nextjs-container-errors-body small {\n color: var(--color-font);\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from "react";
import { Dialog, DialogBody, DialogContent, DialogHeader } from "../components/Dialog";
import { Overlay } from "../components/Overlay";
import { Terminal } from "../components/Terminal";
import { VersionStalenessInfo } from "../components/VersionStalenessInfo";
import { noop as css } from "../helpers/noop-template";
export const BuildError = function BuildError(param) {
let { message, versionInfo } = param;
const noop = React.useCallback(()=>{}, []);
return /*#__PURE__*/ _jsx(Overlay, {
fixed: true,
children: /*#__PURE__*/ _jsx(Dialog, {
type: "error",
"aria-labelledby": "nextjs__container_error_label",
"aria-describedby": "nextjs__container_error_desc",
onClose: noop,
children: /*#__PURE__*/ _jsxs(DialogContent, {
children: [
/*#__PURE__*/ _jsxs(DialogHeader, {
className: "nextjs-container-errors-header",
children: [
/*#__PURE__*/ _jsx("h1", {
id: "nextjs__container_errors_label",
children: "Build Error"
}),
/*#__PURE__*/ _jsx("p", {
id: "nextjs__container_errors_desc",
className: "nextjs__container_errors_desc",
children: "Failed to compile"
}),
versionInfo ? /*#__PURE__*/ _jsx(VersionStalenessInfo, {
...versionInfo
}) : null
]
}),
/*#__PURE__*/ _jsxs(DialogBody, {
className: "nextjs-container-errors-body",
children: [
/*#__PURE__*/ _jsx(Terminal, {
content: message
}),
/*#__PURE__*/ _jsx("footer", {
children: /*#__PURE__*/ _jsx("p", {
id: "nextjs__container_build_error_desc",
children: /*#__PURE__*/ _jsx("small", {
children: "This error occurred during the build process and can only be dismissed by fixing the error."
})
})
})
]
})
]
})
})
});
};
export const styles = css(_templateObject());
//# sourceMappingURL=BuildError.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/container/BuildError.tsx"],"names":["React","Dialog","DialogBody","DialogContent","DialogHeader","Overlay","Terminal","VersionStalenessInfo","noop","css","BuildError","message","versionInfo","useCallback","fixed","type","aria-labelledby","aria-describedby","onClose","className","h1","id","p","content","footer","small","styles"],"mappings":";;;;;;;;;;;AAAA,YAAYA,WAAW,QAAO;AAE9B,SACEC,MAAM,EACNC,UAAU,EACVC,aAAa,EACbC,YAAY,QACP,uBAAsB;AAC7B,SAASC,OAAO,QAAQ,wBAAuB;AAC/C,SAASC,QAAQ,QAAQ,yBAAwB;AACjD,SAASC,oBAAoB,QAAQ,qCAAoC;AACzE,SAASC,QAAQC,GAAG,QAAQ,2BAA0B;AAItD,OAAO,MAAMC,aAAwC,SAASA,WAAW,KAGxE;IAHwE,IAAA,EACvEC,OAAO,EACPC,WAAW,EACZ,GAHwE;IAIvE,MAAMJ,OAAOR,MAAMa,WAAW,CAAC,KAAO,GAAG,EAAE;IAC3C,qBACE,KAACR;QAAQS,KAAK;kBACZ,cAAA,KAACb;YACCc,MAAK;YACLC,mBAAgB;YAChBC,oBAAiB;YACjBC,SAASV;sBAET,cAAA,MAACL;;kCACC,MAACC;wBAAae,WAAU;;0CACtB,KAACC;gCAAGC,IAAG;0CAAkC;;0CACzC,KAACC;gCACCD,IAAG;gCACHF,WAAU;0CACX;;4BAGAP,4BAAc,KAACL;gCAAsB,GAAGK,WAAW;iCAAO;;;kCAE7D,MAACV;wBAAWiB,WAAU;;0CACpB,KAACb;gCAASiB,SAASZ;;0CACnB,KAACa;0CACC,cAAA,KAACF;oCAAED,IAAG;8CACJ,cAAA,KAACI;kDAAM;;;;;;;;;;AAWvB,EAAC;AAED,OAAO,MAAMC,SAASjB,uBAsBrB"}

View File

@ -0,0 +1,311 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n .nextjs-container-errors-header > h1 {\n font-size: var(--size-font-big);\n line-height: var(--size-font-bigger);\n font-weight: bold;\n margin: calc(var(--size-gap-double) * 1.5) 0;\n color: var(--color-title-h1);\n }\n .nextjs-container-errors-header small {\n font-size: var(--size-font-small);\n color: var(--color-accents-1);\n margin-left: var(--size-gap-double);\n }\n .nextjs-container-errors-header small > span {\n font-family: var(--font-stack-monospace);\n }\n .nextjs-container-errors-header p {\n font-size: var(--size-font-small);\n line-height: var(--size-font-big);\n white-space: pre-wrap;\n }\n .nextjs__container_errors_desc {\n font-family: var(--font-stack-monospace);\n padding: var(--size-gap) var(--size-gap-double);\n border-left: 2px solid var(--color-text-color-red-1);\n margin-top: var(--size-gap);\n font-weight: bold;\n color: var(--color-text-color-red-1);\n background-color: var(--color-text-background-red-1);\n }\n p.nextjs__container_errors__notes {\n margin: var(--size-gap-double) auto;\n color: var(--color-stack-notes);\n font-weight: 600;\n font-size: 15px;\n }\n .nextjs-container-errors-header > div > small {\n margin: 0;\n margin-top: var(--size-gap-half);\n }\n .nextjs-container-errors-header > p > a {\n color: inherit;\n font-weight: bold;\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__container_errors__component-stack {\n padding: 12px 32px;\n color: var(--color-ansi-fg);\n background: var(--color-ansi-bg);\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-errors-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-errors-hide-button:hover {\n opacity: 1;\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState, useEffect, useMemo, useCallback } from "react";
import { ACTION_UNHANDLED_ERROR, ACTION_UNHANDLED_REJECTION } from "../../shared";
import { Dialog, DialogBody, DialogContent, DialogHeader } from "../components/Dialog";
import { LeftRightDialogHeader } from "../components/LeftRightDialogHeader";
import { Overlay } from "../components/Overlay";
import { Toast } from "../components/Toast";
import { getErrorByType } from "../helpers/getErrorByType";
import { noop as css } from "../helpers/noop-template";
import { CloseIcon } from "../icons/CloseIcon";
import { RuntimeError } from "./RuntimeError";
import { VersionStalenessInfo } from "../components/VersionStalenessInfo";
import { getErrorSource } from "../../../../../shared/lib/error-source";
import { HotlinkedText } from "../components/hot-linked-text";
import { PseudoHtmlDiff } from "./RuntimeError/component-stack-pseudo-html";
import { getHydrationWarningType } from "../helpers/hydration-error-info";
function isNextjsLink(text) {
return text.startsWith("https://nextjs.org");
}
function getErrorSignature(ev) {
const { event } = ev;
switch(event.type){
case ACTION_UNHANDLED_ERROR:
case ACTION_UNHANDLED_REJECTION:
{
return event.reason.name + "::" + event.reason.message + "::" + event.reason.stack;
}
default:
{}
}
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const _ = event;
return "";
}
export function Errors(param) {
let { isAppDir, errors, initialDisplayState, versionInfo } = param;
var _activeError_componentStackFrames;
const [lookups, setLookups] = useState({});
const [readyErrors, nextError] = useMemo(()=>{
let ready = [];
let next = null;
// Ensure errors are displayed in the order they occurred in:
for(let idx = 0; idx < errors.length; ++idx){
const e = errors[idx];
const { id } = e;
if (id in lookups) {
ready.push(lookups[id]);
continue;
}
// Check for duplicate errors
if (idx > 0) {
const prev = errors[idx - 1];
if (getErrorSignature(prev) === getErrorSignature(e)) {
continue;
}
}
next = e;
break;
}
return [
ready,
next
];
}, [
errors,
lookups
]);
const isLoading = useMemo(()=>{
return readyErrors.length < 1 && Boolean(errors.length);
}, [
errors.length,
readyErrors.length
]);
useEffect(()=>{
if (nextError == null) {
return;
}
let mounted = true;
getErrorByType(nextError, isAppDir).then((resolved)=>{
// We don't care if the desired error changed while we were resolving,
// thus we're not tracking it using a ref. Once the work has been done,
// we'll store it.
if (mounted) {
setLookups((m)=>({
...m,
[resolved.id]: resolved
}));
}
}, ()=>{
// TODO: handle this, though an edge case
});
return ()=>{
mounted = false;
};
}, [
nextError,
isAppDir
]);
const [displayState, setDisplayState] = useState(initialDisplayState);
const [activeIdx, setActiveIndex] = useState(0);
const previous = useCallback(()=>setActiveIndex((v)=>Math.max(0, v - 1)), []);
const next = useCallback(()=>setActiveIndex((v)=>Math.max(0, Math.min(readyErrors.length - 1, v + 1))), [
readyErrors.length
]);
const activeError = useMemo(()=>{
var _readyErrors_activeIdx;
return (_readyErrors_activeIdx = readyErrors[activeIdx]) != null ? _readyErrors_activeIdx : null;
}, [
activeIdx,
readyErrors
]);
// Reset component state when there are no errors to be displayed.
// This should never happen, but lets handle it.
useEffect(()=>{
if (errors.length < 1) {
setLookups({});
setDisplayState("hidden");
setActiveIndex(0);
}
}, [
errors.length
]);
const minimize = useCallback(()=>setDisplayState("minimized"), []);
const hide = useCallback(()=>setDisplayState("hidden"), []);
const fullscreen = useCallback(()=>setDisplayState("fullscreen"), []);
// This component shouldn't be rendered with no errors, but if it is, let's
// handle it gracefully by rendering nothing.
if (errors.length < 1 || activeError == null) {
return null;
}
if (isLoading) {
// TODO: better loading state
return /*#__PURE__*/ _jsx(Overlay, {});
}
if (displayState === "hidden") {
return null;
}
if (displayState === "minimized") {
return /*#__PURE__*/ _jsx(Toast, {
className: "nextjs-toast-errors-parent",
onClick: fullscreen,
children: /*#__PURE__*/ _jsxs("div", {
className: "nextjs-toast-errors",
children: [
/*#__PURE__*/ _jsxs("svg", {
xmlns: "http://www.w3.org/2000/svg",
width: "24",
height: "24",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
children: [
/*#__PURE__*/ _jsx("circle", {
cx: "12",
cy: "12",
r: "10"
}),
/*#__PURE__*/ _jsx("line", {
x1: "12",
y1: "8",
x2: "12",
y2: "12"
}),
/*#__PURE__*/ _jsx("line", {
x1: "12",
y1: "16",
x2: "12.01",
y2: "16"
})
]
}),
/*#__PURE__*/ _jsxs("span", {
children: [
readyErrors.length,
" error",
readyErrors.length > 1 ? "s" : ""
]
}),
/*#__PURE__*/ _jsx("button", {
"data-nextjs-toast-errors-hide-button": true,
className: "nextjs-toast-errors-hide-button",
type: "button",
onClick: (e)=>{
e.stopPropagation();
hide();
},
"aria-label": "Hide Errors",
children: /*#__PURE__*/ _jsx(CloseIcon, {})
})
]
})
});
}
const error = activeError.error;
const isServerError = [
"server",
"edge-server"
].includes(getErrorSource(error) || "");
const errorDetails = error.details || {};
const [warningTemplate, serverContent, clientContent] = errorDetails.warning || [
null,
"",
""
];
const hydrationErrorType = getHydrationWarningType(warningTemplate);
const hydrationWarning = warningTemplate ? warningTemplate.replace("%s", serverContent).replace("%s", clientContent).replace("%s", "") // remove the %s for stack
.replace(/%s$/, "") // If there's still a %s at the end, remove it
.replace(/^Warning: /, "") : null;
return /*#__PURE__*/ _jsx(Overlay, {
children: /*#__PURE__*/ _jsx(Dialog, {
type: "error",
"aria-labelledby": "nextjs__container_errors_label",
"aria-describedby": "nextjs__container_errors_desc",
onClose: isServerError ? undefined : minimize,
children: /*#__PURE__*/ _jsxs(DialogContent, {
children: [
/*#__PURE__*/ _jsxs(DialogHeader, {
className: "nextjs-container-errors-header",
children: [
/*#__PURE__*/ _jsxs(LeftRightDialogHeader, {
previous: activeIdx > 0 ? previous : null,
next: activeIdx < readyErrors.length - 1 ? next : null,
close: isServerError ? undefined : minimize,
children: [
/*#__PURE__*/ _jsxs("small", {
children: [
/*#__PURE__*/ _jsx("span", {
children: activeIdx + 1
}),
" of",
" ",
/*#__PURE__*/ _jsx("span", {
"data-nextjs-dialog-header-total-count": true,
children: readyErrors.length
}),
" error",
readyErrors.length < 2 ? "" : "s"
]
}),
versionInfo ? /*#__PURE__*/ _jsx(VersionStalenessInfo, {
...versionInfo
}) : null
]
}),
/*#__PURE__*/ _jsx("h1", {
id: "nextjs__container_errors_label",
children: isServerError ? "Server Error" : "Unhandled Runtime Error"
}),
/*#__PURE__*/ _jsxs("p", {
id: "nextjs__container_errors_desc",
className: "nextjs__container_errors_desc",
children: [
error.name,
":",
" ",
/*#__PURE__*/ _jsx(HotlinkedText, {
text: error.message,
matcher: isNextjsLink
})
]
}),
hydrationWarning && /*#__PURE__*/ _jsxs(_Fragment, {
children: [
/*#__PURE__*/ _jsx("p", {
id: "nextjs__container_errors__notes",
className: "nextjs__container_errors__notes",
children: hydrationWarning
}),
((_activeError_componentStackFrames = activeError.componentStackFrames) == null ? void 0 : _activeError_componentStackFrames.length) ? /*#__PURE__*/ _jsx(PseudoHtmlDiff, {
className: "nextjs__container_errors__component-stack",
hydrationMismatchType: hydrationErrorType,
componentStackFrames: activeError.componentStackFrames,
firstContent: serverContent,
secondContent: clientContent
}) : null
]
}),
isServerError ? /*#__PURE__*/ _jsx("div", {
children: /*#__PURE__*/ _jsx("small", {
children: "This error happened while generating the page. Any console logs will be displayed in the terminal window."
})
}) : undefined
]
}),
/*#__PURE__*/ _jsx(DialogBody, {
className: "nextjs-container-errors-body",
children: /*#__PURE__*/ _jsx(RuntimeError, {
error: activeError
}, activeError.id.toString())
})
]
})
})
});
}
export const styles = css(_templateObject());
//# sourceMappingURL=Errors.js.map

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,65 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { getFrameSource } from "../../helpers/stack-frame";
import { useOpenInEditor } from "../../helpers/use-open-in-editor";
import { HotlinkedText } from "../../components/hot-linked-text";
export const CallStackFrame = function CallStackFrame(param) {
let { frame } = param;
var _frame_originalStackFrame;
// TODO: ability to expand resolved frames
// TODO: render error or external indicator
const f = (_frame_originalStackFrame = frame.originalStackFrame) != null ? _frame_originalStackFrame : frame.sourceStackFrame;
const hasSource = Boolean(frame.originalCodeFrame);
const open = useOpenInEditor(hasSource ? {
file: f.file,
lineNumber: f.lineNumber,
column: f.column
} : undefined);
return /*#__PURE__*/ _jsxs("div", {
"data-nextjs-call-stack-frame": true,
children: [
/*#__PURE__*/ _jsx("h3", {
"data-nextjs-frame-expanded": Boolean(frame.expanded),
children: /*#__PURE__*/ _jsx(HotlinkedText, {
text: f.methodName
})
}),
/*#__PURE__*/ _jsxs("div", {
"data-has-source": hasSource ? "true" : undefined,
tabIndex: hasSource ? 10 : undefined,
role: hasSource ? "link" : undefined,
onClick: open,
title: hasSource ? "Click to open in your editor" : undefined,
children: [
/*#__PURE__*/ _jsx("span", {
children: getFrameSource(f)
}),
/*#__PURE__*/ _jsxs("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
children: [
/*#__PURE__*/ _jsx("path", {
d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"
}),
/*#__PURE__*/ _jsx("polyline", {
points: "15 3 21 3 21 9"
}),
/*#__PURE__*/ _jsx("line", {
x1: "10",
y1: "14",
x2: "21",
y2: "3"
})
]
})
]
})
]
});
};
//# sourceMappingURL=CallStackFrame.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/container/RuntimeError/CallStackFrame.tsx"],"names":["getFrameSource","useOpenInEditor","HotlinkedText","CallStackFrame","frame","f","originalStackFrame","sourceStackFrame","hasSource","Boolean","originalCodeFrame","open","file","lineNumber","column","undefined","div","data-nextjs-call-stack-frame","h3","data-nextjs-frame-expanded","expanded","text","methodName","data-has-source","tabIndex","role","onClick","title","span","svg","xmlns","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","path","d","polyline","points","line","x1","y1","x2","y2"],"mappings":";AACA,SACEA,cAAc,QAET,4BAA2B;AAClC,SAASC,eAAe,QAAQ,mCAAkC;AAClE,SAASC,aAAa,QAAQ,mCAAkC;AAEhE,OAAO,MAAMC,iBAER,SAASA,eAAe,KAAS;IAAT,IAAA,EAAEC,KAAK,EAAE,GAAT;QAILA;IAHtB,0CAA0C;IAC1C,2CAA2C;IAE3C,MAAMC,IAAgBD,CAAAA,4BAAAA,MAAME,kBAAkB,YAAxBF,4BAA4BA,MAAMG,gBAAgB;IACxE,MAAMC,YAAYC,QAAQL,MAAMM,iBAAiB;IACjD,MAAMC,OAAOV,gBACXO,YACI;QACEI,MAAMP,EAAEO,IAAI;QACZC,YAAYR,EAAEQ,UAAU;QACxBC,QAAQT,EAAES,MAAM;IAClB,IACAC;IAGN,qBACE,MAACC;QAAIC,8BAA4B;;0BAC/B,KAACC;gBAAGC,8BAA4BV,QAAQL,MAAMgB,QAAQ;0BACpD,cAAA,KAAClB;oBAAcmB,MAAMhB,EAAEiB,UAAU;;;0BAEnC,MAACN;gBACCO,mBAAiBf,YAAY,SAASO;gBACtCS,UAAUhB,YAAY,KAAKO;gBAC3BU,MAAMjB,YAAY,SAASO;gBAC3BW,SAASf;gBACTgB,OAAOnB,YAAY,iCAAiCO;;kCAEpD,KAACa;kCAAM5B,eAAeK;;kCACtB,MAACwB;wBACCC,OAAM;wBACNC,SAAQ;wBACRC,MAAK;wBACLC,QAAO;wBACPC,aAAY;wBACZC,eAAc;wBACdC,gBAAe;;0CAEf,KAACC;gCAAKC,GAAE;;0CACR,KAACC;gCAASC,QAAO;;0CACjB,KAACC;gCAAKC,IAAG;gCAAKC,IAAG;gCAAKC,IAAG;gCAAKC,IAAG;;;;;;;;AAK3C,EAAC"}

View File

@ -0,0 +1,99 @@
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import React from "react";
import { useOpenInEditor } from "../../helpers/use-open-in-editor";
import { HotlinkedText } from "../../components/hot-linked-text";
function EditorLink(param) {
let { children, componentStackFrame: { file, column, lineNumber } } = param;
const open = useOpenInEditor({
file,
column,
lineNumber
});
return /*#__PURE__*/ _jsxs("div", {
tabIndex: 10,
role: "link",
onClick: open,
title: "Click to open in your editor",
children: [
children,
/*#__PURE__*/ _jsxs("svg", {
xmlns: "http://www.w3.org/2000/svg",
viewBox: "0 0 24 24",
fill: "none",
stroke: "currentColor",
strokeWidth: "2",
strokeLinecap: "round",
strokeLinejoin: "round",
children: [
/*#__PURE__*/ _jsx("path", {
d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"
}),
/*#__PURE__*/ _jsx("polyline", {
points: "15 3 21 3 21 9"
}),
/*#__PURE__*/ _jsx("line", {
x1: "10",
y1: "14",
x2: "21",
y2: "3"
})
]
})
]
});
}
function formatLineNumber(lineNumber, column) {
if (!column) {
return lineNumber;
}
return lineNumber + ":" + column;
}
function LocationLine(param) {
let { componentStackFrame } = param;
const { file, lineNumber, column } = componentStackFrame;
return /*#__PURE__*/ _jsxs(_Fragment, {
children: [
file,
" ",
lineNumber ? "(" + formatLineNumber(lineNumber, column) + ")" : ""
]
});
}
function SourceLocation(param) {
let { componentStackFrame } = param;
const { file, canOpenInEditor } = componentStackFrame;
if (file && canOpenInEditor) {
return /*#__PURE__*/ _jsx(EditorLink, {
componentStackFrame: componentStackFrame,
children: /*#__PURE__*/ _jsx("span", {
children: /*#__PURE__*/ _jsx(LocationLine, {
componentStackFrame: componentStackFrame
})
})
});
}
return /*#__PURE__*/ _jsx("div", {
children: /*#__PURE__*/ _jsx(LocationLine, {
componentStackFrame: componentStackFrame
})
});
}
export function ComponentStackFrameRow(param) {
let { componentStackFrame } = param;
const { component } = componentStackFrame;
return /*#__PURE__*/ _jsxs("div", {
"data-nextjs-component-stack-frame": true,
children: [
/*#__PURE__*/ _jsx("h3", {
children: /*#__PURE__*/ _jsx(HotlinkedText, {
text: component
})
}),
/*#__PURE__*/ _jsx(SourceLocation, {
componentStackFrame: componentStackFrame
})
]
});
}
//# sourceMappingURL=ComponentStackFrameRow.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/container/RuntimeError/ComponentStackFrameRow.tsx"],"names":["React","useOpenInEditor","HotlinkedText","EditorLink","children","componentStackFrame","file","column","lineNumber","open","div","tabIndex","role","onClick","title","svg","xmlns","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","path","d","polyline","points","line","x1","y1","x2","y2","formatLineNumber","LocationLine","SourceLocation","canOpenInEditor","span","ComponentStackFrameRow","component","data-nextjs-component-stack-frame","h3","text"],"mappings":";AAAA,OAAOA,WAAW,QAAO;AAEzB,SAASC,eAAe,QAAQ,mCAAkC;AAClE,SAASC,aAAa,QAAQ,mCAAkC;AAEhE,SAASC,WAAW,KAMnB;IANmB,IAAA,EAClBC,QAAQ,EACRC,qBAAqB,EAAEC,IAAI,EAAEC,MAAM,EAAEC,UAAU,EAAE,EAIlD,GANmB;IAOlB,MAAMC,OAAOR,gBAAgB;QAC3BK;QACAC;QACAC;IACF;IAEA,qBACE,MAACE;QACCC,UAAU;QACVC,MAAM;QACNC,SAASJ;QACTK,OAAO;;YAENV;0BACD,MAACW;gBACCC,OAAM;gBACNC,SAAQ;gBACRC,MAAK;gBACLC,QAAO;gBACPC,aAAY;gBACZC,eAAc;gBACdC,gBAAe;;kCAEf,KAACC;wBAAKC,GAAE;;kCACR,KAACC;wBAASC,QAAO;;kCACjB,KAACC;wBAAKC,IAAG;wBAAKC,IAAG;wBAAKC,IAAG;wBAAKC,IAAG;;;;;;AAIzC;AAEA,SAASC,iBAAiBxB,UAAkB,EAAED,MAA0B;IACtE,IAAI,CAACA,QAAQ;QACX,OAAOC;IACT;IAEA,OAAO,AAAGA,aAAW,MAAGD;AAC1B;AAEA,SAAS0B,aAAa,KAIrB;IAJqB,IAAA,EACpB5B,mBAAmB,EAGpB,GAJqB;IAKpB,MAAM,EAAEC,IAAI,EAAEE,UAAU,EAAED,MAAM,EAAE,GAAGF;IACrC,qBACE;;YACGC;YAAK;YAAEE,aAAa,AAAC,MAAGwB,iBAAiBxB,YAAYD,UAAQ,MAAK;;;AAGzE;AAEA,SAAS2B,eAAe,KAIvB;IAJuB,IAAA,EACtB7B,mBAAmB,EAGpB,GAJuB;IAKtB,MAAM,EAAEC,IAAI,EAAE6B,eAAe,EAAE,GAAG9B;IAElC,IAAIC,QAAQ6B,iBAAiB;QAC3B,qBACE,KAAChC;YAAWE,qBAAqBA;sBAC/B,cAAA,KAAC+B;0BACC,cAAA,KAACH;oBAAa5B,qBAAqBA;;;;IAI3C;IAEA,qBACE,KAACK;kBACC,cAAA,KAACuB;YAAa5B,qBAAqBA;;;AAGzC;AAEA,OAAO,SAASgC,uBAAuB,KAItC;IAJsC,IAAA,EACrChC,mBAAmB,EAGpB,GAJsC;IAKrC,MAAM,EAAEiC,SAAS,EAAE,GAAGjC;IAEtB,qBACE,MAACK;QAAI6B,mCAAiC;;0BACpC,KAACC;0BACC,cAAA,KAACtC;oBAAcuC,MAAMH;;;0BAEvB,KAACJ;gBAAe7B,qBAAqBA;;;;AAG3C"}

View File

@ -0,0 +1,46 @@
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { CallStackFrame } from "./CallStackFrame";
import { CollapseIcon } from "../../icons/CollapseIcon";
import { FrameworkIcon } from "../../icons/FrameworkIcon";
function FrameworkGroup(param) {
let { framework, stackFrames } = param;
return /*#__PURE__*/ _jsxs("details", {
"data-nextjs-collapsed-call-stack-details": true,
children: [
/*#__PURE__*/ _jsxs("summary", {
tabIndex: 10,
children: [
/*#__PURE__*/ _jsx(CollapseIcon, {}),
/*#__PURE__*/ _jsx(FrameworkIcon, {
framework: framework
}),
framework === "react" ? "React" : "Next.js"
]
}),
stackFrames.map((frame, index)=>/*#__PURE__*/ _jsx(CallStackFrame, {
frame: frame
}, "call-stack-" + index))
]
});
}
export function GroupedStackFrames(param) {
let { groupedStackFrames, show } = param;
if (!show) return;
return /*#__PURE__*/ _jsx(_Fragment, {
children: groupedStackFrames.map((stackFramesGroup, groupIndex)=>{
// Collapse React and Next.js frames
if (stackFramesGroup.framework) {
return /*#__PURE__*/ _jsx(FrameworkGroup, {
framework: stackFramesGroup.framework,
stackFrames: stackFramesGroup.stackFrames
}, "call-stack-framework-group-" + groupIndex);
}
return(// Don't group non React and Next.js frames
stackFramesGroup.stackFrames.map((frame, frameIndex)=>/*#__PURE__*/ _jsx(CallStackFrame, {
frame: frame
}, "call-stack-" + groupIndex + "-" + frameIndex)));
})
});
}
//# sourceMappingURL=GroupedStackFrames.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/container/RuntimeError/GroupedStackFrames.tsx"],"names":["CallStackFrame","CollapseIcon","FrameworkIcon","FrameworkGroup","framework","stackFrames","details","data-nextjs-collapsed-call-stack-details","summary","tabIndex","map","frame","index","GroupedStackFrames","groupedStackFrames","show","stackFramesGroup","groupIndex","frameIndex"],"mappings":";AACA,SAASA,cAAc,QAAQ,mBAAkB;AACjD,SAASC,YAAY,QAAQ,2BAA0B;AACvD,SAASC,aAAa,QAAQ,4BAA2B;AAEzD,SAASC,eAAe,KAMvB;IANuB,IAAA,EACtBC,SAAS,EACTC,WAAW,EAIZ,GANuB;IAOtB,qBACE,MAACC;QAAQC,0CAAwC;;0BAE/C,MAACC;gBAAQC,UAAU;;kCACjB,KAACR;kCACD,KAACC;wBAAcE,WAAWA;;oBACzBA,cAAc,UAAU,UAAU;;;YAEpCC,YAAYK,GAAG,CAAC,CAACC,OAAOC,sBACvB,KAACZ;oBAA2CW,OAAOA;mBAA9B,AAAC,gBAAaC;;;AAI3C;AAEA,OAAO,SAASC,mBAAmB,KAMlC;IANkC,IAAA,EACjCC,kBAAkB,EAClBC,IAAI,EAIL,GANkC;IAOjC,IAAI,CAACA,MAAM;IACX,qBACE;kBACGD,mBAAmBJ,GAAG,CAAC,CAACM,kBAAkBC;YACzC,oCAAoC;YACpC,IAAID,iBAAiBZ,SAAS,EAAE;gBAC9B,qBACE,KAACD;oBAECC,WAAWY,iBAAiBZ,SAAS;oBACrCC,aAAaW,iBAAiBX,WAAW;mBAFpC,AAAC,gCAA6BY;YAKzC;YAEA,OACE,2CAA2C;YAC3CD,iBAAiBX,WAAW,CAACK,GAAG,CAAC,CAACC,OAAOO,2BACvC,KAAClB;oBAECW,OAAOA;mBADF,AAAC,gBAAaM,aAAW,MAAGC;QAKzC;;AAGN"}

View File

@ -0,0 +1,218 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { createElement as _createElement } from "react";
import { useMemo, Fragment, useState } from "react";
import { CollapseIcon } from "../../icons/CollapseIcon";
function getAdjacentProps(isAdj) {
return {
"data-nextjs-container-errors-pseudo-html--tag-adjacent": isAdj
};
}
/**
*
* Format component stack into pseudo HTML
* component stack is an array of strings, e.g.: ['p', 'p', 'Page', ...]
*
* For html tags mismatch, it will render it for the code block
*
* ```
* <pre>
* <code>{`
* <Page>
* <p red>
* <p red>
* `}</code>
* </pre>
* ```
*
* For text mismatch, it will render it for the code block
*
* ```
* <pre>
* <code>{`
* <Page>
* <p>
* "Server Text" (green)
* "Client Text" (red)
* </p>
* </Page>
* `}</code>
* ```
*
* For bad text under a tag it will render it for the code block,
* e.g. "Mismatched Text" under <p>
*
* ```
* <pre>
* <code>{`
* <Page>
* <div>
* <p>
* "Mismatched Text" (red)
* </p>
* </div>
* </Page>
* `}</code>
* ```
*
*/ export function PseudoHtmlDiff(param) {
let { componentStackFrames, firstContent, secondContent, hydrationMismatchType, ...props } = param;
const isHtmlTagsWarning = hydrationMismatchType === "tag";
// For text mismatch, mismatched text will take 2 rows, so we display 4 rows of component stack
const MAX_NON_COLLAPSED_FRAMES = isHtmlTagsWarning ? 6 : 4;
const shouldCollapse = componentStackFrames.length > MAX_NON_COLLAPSED_FRAMES;
const [isHtmlCollapsed, toggleCollapseHtml] = useState(shouldCollapse);
const htmlComponents = useMemo(()=>{
const tagNames = isHtmlTagsWarning ? [
firstContent.replace(/<|>/g, ""),
secondContent.replace(/<|>/g, "")
] : [];
const nestedHtmlStack = [];
let lastText = "";
const componentStack = componentStackFrames.map((frame)=>frame.component).reverse();
// [child index, parent index]
const matchedIndex = [
-1,
-1
];
if (isHtmlTagsWarning) {
// Reverse search for the child tag
for(let i = componentStack.length - 1; i >= 0; i--){
if (componentStack[i] === tagNames[0]) {
matchedIndex[0] = i;
break;
}
}
// Start searching parent tag from child tag above
for(let i = matchedIndex[0] - 1; i >= 0; i--){
if (componentStack[i] === tagNames[1]) {
matchedIndex[1] = i;
break;
}
}
}
componentStack.forEach((component, index, componentList)=>{
const spaces = " ".repeat(nestedHtmlStack.length * 2);
// const prevComponent = componentList[index - 1]
// const nextComponent = componentList[index + 1]
// When component is the server or client tag name, highlight it
const isHighlightedTag = isHtmlTagsWarning ? index === matchedIndex[0] || index === matchedIndex[1] : tagNames.includes(component);
const isAdjacentTag = isHighlightedTag || Math.abs(index - matchedIndex[0]) <= 1 || Math.abs(index - matchedIndex[1]) <= 1;
const isLastFewFrames = !isHtmlTagsWarning && index >= componentList.length - 6;
const adjProps = getAdjacentProps(isAdjacentTag);
if (isHtmlTagsWarning && isAdjacentTag || isLastFewFrames) {
const codeLine = /*#__PURE__*/ _jsxs("span", {
children: [
spaces,
/*#__PURE__*/ _jsx("span", {
...adjProps,
...isHighlightedTag ? {
"data-nextjs-container-errors-pseudo-html--tag-error": true
} : undefined,
children: "<" + component + ">\n"
})
]
});
lastText = component;
const wrappedCodeLine = /*#__PURE__*/ _jsxs(Fragment, {
children: [
codeLine,
isHighlightedTag && /*#__PURE__*/ _jsx("span", {
"data-nextjs-container-errors-pseudo-html--hint": true,
children: spaces + "^".repeat(component.length + 2) + "\n"
})
]
}, nestedHtmlStack.length);
nestedHtmlStack.push(wrappedCodeLine);
} else {
if (nestedHtmlStack.length >= MAX_NON_COLLAPSED_FRAMES && isHtmlCollapsed) {
return;
}
if (!isHtmlCollapsed || isLastFewFrames) {
nestedHtmlStack.push(/*#__PURE__*/ _createElement("span", {
...adjProps,
key: nestedHtmlStack.length,
children: [
spaces,
"<" + component + ">\n"
]
}));
} else if (isHtmlCollapsed && lastText !== "...") {
lastText = "...";
nestedHtmlStack.push(/*#__PURE__*/ _createElement("span", {
...adjProps,
key: nestedHtmlStack.length,
children: [
spaces,
"...\n"
]
}));
}
}
});
// Hydration mismatch: text or text-tag
if (!isHtmlTagsWarning) {
const spaces = " ".repeat(nestedHtmlStack.length * 2);
let wrappedCodeLine;
if (hydrationMismatchType === "text") {
// hydration type is "text", represent [server content, client content]
wrappedCodeLine = /*#__PURE__*/ _jsxs(Fragment, {
children: [
/*#__PURE__*/ _jsx("span", {
"data-nextjs-container-errors-pseudo-html--diff-remove": true,
children: spaces + ('"' + firstContent + '"\n')
}),
/*#__PURE__*/ _jsx("span", {
"data-nextjs-container-errors-pseudo-html--diff-add": true,
children: spaces + ('"' + secondContent + '"\n')
})
]
}, nestedHtmlStack.length);
} else {
// hydration type is "text-in-tag", represent [parent tag, mismatch content]
wrappedCodeLine = /*#__PURE__*/ _jsxs(Fragment, {
children: [
/*#__PURE__*/ _jsx("span", {
"data-nextjs-container-errors-pseudo-html--tag-adjacent": true,
children: spaces + ("<" + secondContent + ">\n")
}),
/*#__PURE__*/ _jsx("span", {
"data-nextjs-container-errors-pseudo-html--diff-remove": true,
children: spaces + (' "' + firstContent + '"\n')
})
]
}, nestedHtmlStack.length);
}
nestedHtmlStack.push(wrappedCodeLine);
}
return nestedHtmlStack;
}, [
componentStackFrames,
isHtmlCollapsed,
firstContent,
secondContent,
isHtmlTagsWarning,
hydrationMismatchType,
MAX_NON_COLLAPSED_FRAMES
]);
return /*#__PURE__*/ _jsxs("div", {
"data-nextjs-container-errors-pseudo-html": true,
children: [
/*#__PURE__*/ _jsx("button", {
tabIndex: 10,
"data-nextjs-container-errors-pseudo-html-collapse": true,
onClick: ()=>toggleCollapseHtml(!isHtmlCollapsed),
children: /*#__PURE__*/ _jsx(CollapseIcon, {
collapsed: isHtmlCollapsed
})
}),
/*#__PURE__*/ _jsx("pre", {
...props,
children: /*#__PURE__*/ _jsx("code", {
children: htmlComponents
})
})
]
});
}
//# sourceMappingURL=component-stack-pseudo-html.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/container/RuntimeError/component-stack-pseudo-html.tsx"],"names":["useMemo","Fragment","useState","CollapseIcon","getAdjacentProps","isAdj","PseudoHtmlDiff","componentStackFrames","firstContent","secondContent","hydrationMismatchType","props","isHtmlTagsWarning","MAX_NON_COLLAPSED_FRAMES","shouldCollapse","length","isHtmlCollapsed","toggleCollapseHtml","htmlComponents","tagNames","replace","nestedHtmlStack","lastText","componentStack","map","frame","component","reverse","matchedIndex","i","forEach","index","componentList","spaces","repeat","isHighlightedTag","includes","isAdjacentTag","Math","abs","isLastFewFrames","adjProps","codeLine","span","undefined","wrappedCodeLine","data-nextjs-container-errors-pseudo-html--hint","push","key","data-nextjs-container-errors-pseudo-html--diff-remove","data-nextjs-container-errors-pseudo-html--diff-add","data-nextjs-container-errors-pseudo-html--tag-adjacent","div","data-nextjs-container-errors-pseudo-html","button","tabIndex","data-nextjs-container-errors-pseudo-html-collapse","onClick","collapsed","pre","code"],"mappings":"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"}

View File

@ -0,0 +1,97 @@
import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
function _templateObject() {
const data = _tagged_template_literal_loose([
"\n button[data-nextjs-data-runtime-error-collapsed-action] {\n background: none;\n border: none;\n padding: 0;\n font-size: var(--size-font-small);\n line-height: var(--size-font-bigger);\n color: var(--color-accents-3);\n }\n\n [data-nextjs-call-stack-frame]:not(:last-child),\n [data-nextjs-component-stack-frame]:not(:last-child) {\n margin-bottom: var(--size-gap-double);\n }\n\n [data-nextjs-call-stack-frame] > h3,\n [data-nextjs-component-stack-frame] > h3 {\n margin-top: 0;\n margin-bottom: var(--size-gap);\n font-family: var(--font-stack-monospace);\n font-size: var(--size-font);\n color: #222;\n }\n [data-nextjs-call-stack-frame] > h3[data-nextjs-frame-expanded='false'] {\n color: #666;\n }\n [data-nextjs-call-stack-frame] > div,\n [data-nextjs-component-stack-frame] > div {\n display: flex;\n align-items: center;\n padding-left: calc(var(--size-gap) + var(--size-gap-half));\n font-size: var(--size-font-small);\n color: #999;\n }\n [data-nextjs-call-stack-frame] > div > svg,\n [data-nextjs-component-stack-frame] > [role='link'] > svg {\n width: auto;\n height: var(--size-font-small);\n margin-left: var(--size-gap);\n flex-shrink: 0;\n\n display: none;\n }\n\n [data-nextjs-call-stack-frame] > div[data-has-source],\n [data-nextjs-component-stack-frame] > [role='link'] {\n cursor: pointer;\n }\n [data-nextjs-call-stack-frame] > div[data-has-source]:hover,\n [data-nextjs-component-stack-frame] > [role='link']:hover {\n text-decoration: underline dotted;\n }\n [data-nextjs-call-stack-frame] > div[data-has-source] > svg,\n [data-nextjs-component-stack-frame] > [role='link'] > svg {\n display: unset;\n }\n\n [data-nextjs-call-stack-framework-icon] {\n margin-right: var(--size-gap);\n }\n [data-nextjs-call-stack-framework-icon='next'] > mask {\n mask-type: alpha;\n }\n [data-nextjs-call-stack-framework-icon='react'] {\n color: rgb(20, 158, 202);\n }\n [data-nextjs-collapsed-call-stack-details][open]\n [data-nextjs-call-stack-chevron-icon] {\n transform: rotate(90deg);\n }\n [data-nextjs-collapsed-call-stack-details] summary {\n display: flex;\n align-items: center;\n margin-bottom: var(--size-gap);\n list-style: none;\n }\n [data-nextjs-collapsed-call-stack-details] summary::-webkit-details-marker {\n display: none;\n }\n\n [data-nextjs-collapsed-call-stack-details] h3 {\n color: #666;\n }\n [data-nextjs-collapsed-call-stack-details] [data-nextjs-call-stack-frame] {\n margin-bottom: var(--size-gap-double);\n }\n\n [data-nextjs-container-errors-pseudo-html] {\n position: relative;\n }\n [data-nextjs-container-errors-pseudo-html-collapse] {\n position: absolute;\n left: 10px;\n top: 10px;\n color: inherit;\n background: none;\n border: none;\n padding: 0;\n }\n [data-nextjs-container-errors-pseudo-html--diff-add] {\n color: var(--color-ansi-green);\n }\n [data-nextjs-container-errors-pseudo-html--diff-remove] {\n color: var(--color-ansi-red);\n }\n [data-nextjs-container-errors-pseudo-html--tag-error] {\n color: var(--color-ansi-red);\n font-weight: bold;\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 }\n [data-nextjs-container-errors-pseudo-html--tag-adjacent='false'] {\n color: var(--color-accents-1);\n }\n"
]);
_templateObject = function() {
return data;
};
return data;
}
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from "react";
import { CodeFrame } from "../../components/CodeFrame";
import { noop as css } from "../../helpers/noop-template";
import { groupStackFramesByFramework } from "../../helpers/group-stack-frames-by-framework";
import { GroupedStackFrames } from "./GroupedStackFrames";
export function RuntimeError(param) {
let { error } = param;
const { firstFrame, allLeadingFrames, allCallStackFrames } = React.useMemo(()=>{
const filteredFrames = error.frames.filter((f)=>{
var _f_sourceStackFrame_file;
return !(f.sourceStackFrame.file === "<anonymous>" && [
"stringify",
"<unknown>"
].includes(f.sourceStackFrame.methodName)) && !((_f_sourceStackFrame_file = f.sourceStackFrame.file) == null ? void 0 : _f_sourceStackFrame_file.startsWith("node:internal"));
});
const firstFirstPartyFrameIndex = filteredFrames.findIndex((entry)=>entry.expanded && Boolean(entry.originalCodeFrame) && Boolean(entry.originalStackFrame));
var _filteredFrames_firstFirstPartyFrameIndex;
return {
firstFrame: (_filteredFrames_firstFirstPartyFrameIndex = filteredFrames[firstFirstPartyFrameIndex]) != null ? _filteredFrames_firstFirstPartyFrameIndex : null,
allLeadingFrames: firstFirstPartyFrameIndex < 0 ? [] : filteredFrames.slice(0, firstFirstPartyFrameIndex),
allCallStackFrames: filteredFrames.slice(firstFirstPartyFrameIndex + 1)
};
}, [
error.frames
]);
const [all, setAll] = React.useState(firstFrame == null);
const { canShowMore, leadingFramesGroupedByFramework, stackFramesGroupedByFramework } = React.useMemo(()=>{
const leadingFrames = allLeadingFrames.filter((f)=>f.expanded || all);
const visibleCallStackFrames = allCallStackFrames.filter((f)=>f.expanded || all);
return {
canShowMore: allCallStackFrames.length !== visibleCallStackFrames.length || all && firstFrame != null,
stackFramesGroupedByFramework: groupStackFramesByFramework(allCallStackFrames),
leadingFramesGroupedByFramework: groupStackFramesByFramework(leadingFrames)
};
}, [
all,
allCallStackFrames,
allLeadingFrames,
firstFrame
]);
return /*#__PURE__*/ _jsxs(React.Fragment, {
children: [
firstFrame ? /*#__PURE__*/ _jsxs(React.Fragment, {
children: [
/*#__PURE__*/ _jsx("h2", {
children: "Source"
}),
/*#__PURE__*/ _jsx(GroupedStackFrames, {
groupedStackFrames: leadingFramesGroupedByFramework,
show: all
}),
/*#__PURE__*/ _jsx(CodeFrame, {
stackFrame: firstFrame.originalStackFrame,
codeFrame: firstFrame.originalCodeFrame
})
]
}) : undefined,
stackFramesGroupedByFramework.length ? /*#__PURE__*/ _jsxs(React.Fragment, {
children: [
/*#__PURE__*/ _jsx("h2", {
children: "Call Stack"
}),
/*#__PURE__*/ _jsx(GroupedStackFrames, {
groupedStackFrames: stackFramesGroupedByFramework,
show: all
})
]
}) : undefined,
canShowMore ? /*#__PURE__*/ _jsx(React.Fragment, {
children: /*#__PURE__*/ _jsxs("button", {
tabIndex: 10,
"data-nextjs-data-runtime-error-collapsed-action": true,
type: "button",
onClick: ()=>setAll(!all),
children: [
all ? "Hide" : "Show",
" collapsed frames"
]
})
}) : undefined
]
});
}
export const styles = css(_templateObject());
//# sourceMappingURL=index.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/internal/container/RuntimeError/index.tsx"],"names":["React","CodeFrame","noop","css","groupStackFramesByFramework","GroupedStackFrames","RuntimeError","error","firstFrame","allLeadingFrames","allCallStackFrames","useMemo","filteredFrames","frames","filter","f","sourceStackFrame","file","includes","methodName","startsWith","firstFirstPartyFrameIndex","findIndex","entry","expanded","Boolean","originalCodeFrame","originalStackFrame","slice","all","setAll","useState","canShowMore","leadingFramesGroupedByFramework","stackFramesGroupedByFramework","leadingFrames","visibleCallStackFrames","length","Fragment","h2","groupedStackFrames","show","stackFrame","codeFrame","undefined","button","tabIndex","data-nextjs-data-runtime-error-collapsed-action","type","onClick","styles"],"mappings":";;;;;;;;;;;AAAA,YAAYA,WAAW,QAAO;AAC9B,SAASC,SAAS,QAAQ,6BAA4B;AAEtD,SAASC,QAAQC,GAAG,QAAQ,8BAA6B;AACzD,SAASC,2BAA2B,QAAQ,gDAA+C;AAC3F,SAASC,kBAAkB,QAAQ,uBAAsB;AAIzD,OAAO,SAASC,aAAa,KAA4B;IAA5B,IAAA,EAAEC,KAAK,EAAqB,GAA5B;IAC3B,MAAM,EAAEC,UAAU,EAAEC,gBAAgB,EAAEC,kBAAkB,EAAE,GACxDV,MAAMW,OAAO,CAAC;QACZ,MAAMC,iBAAiBL,MAAMM,MAAM,CAACC,MAAM,CACxC,CAACC;gBAIOA;mBAHN,CACEA,CAAAA,EAAEC,gBAAgB,CAACC,IAAI,KAAK,iBAC5B;gBAAC;gBAAa;aAAY,CAACC,QAAQ,CAACH,EAAEC,gBAAgB,CAACG,UAAU,CAAA,KAC9D,GAACJ,2BAAAA,EAAEC,gBAAgB,CAACC,IAAI,qBAAvBF,yBAAyBK,UAAU,CAAC;;QAG9C,MAAMC,4BAA4BT,eAAeU,SAAS,CACxD,CAACC,QACCA,MAAMC,QAAQ,IACdC,QAAQF,MAAMG,iBAAiB,KAC/BD,QAAQF,MAAMI,kBAAkB;YAItBf;QADd,OAAO;YACLJ,YAAYI,CAAAA,4CAAAA,cAAc,CAACS,0BAA0B,YAAzCT,4CAA6C;YACzDH,kBACEY,4BAA4B,IACxB,EAAE,GACFT,eAAegB,KAAK,CAAC,GAAGP;YAC9BX,oBAAoBE,eAAegB,KAAK,CAACP,4BAA4B;QACvE;IACF,GAAG;QAACd,MAAMM,MAAM;KAAC;IAEnB,MAAM,CAACgB,KAAKC,OAAO,GAAG9B,MAAM+B,QAAQ,CAACvB,cAAc;IAEnD,MAAM,EACJwB,WAAW,EACXC,+BAA+B,EAC/BC,6BAA6B,EAC9B,GAAGlC,MAAMW,OAAO,CAAC;QAChB,MAAMwB,gBAAgB1B,iBAAiBK,MAAM,CAAC,CAACC,IAAMA,EAAES,QAAQ,IAAIK;QACnE,MAAMO,yBAAyB1B,mBAAmBI,MAAM,CACtD,CAACC,IAAMA,EAAES,QAAQ,IAAIK;QAGvB,OAAO;YACLG,aACEtB,mBAAmB2B,MAAM,KAAKD,uBAAuBC,MAAM,IAC1DR,OAAOrB,cAAc;YAExB0B,+BACE9B,4BAA4BM;YAE9BuB,iCACE7B,4BAA4B+B;QAChC;IACF,GAAG;QAACN;QAAKnB;QAAoBD;QAAkBD;KAAW;IAE1D,qBACE,MAACR,MAAMsC,QAAQ;;YACZ9B,2BACC,MAACR,MAAMsC,QAAQ;;kCACb,KAACC;kCAAG;;kCACJ,KAAClC;wBACCmC,oBAAoBP;wBACpBQ,MAAMZ;;kCAER,KAAC5B;wBACCyC,YAAYlC,WAAWmB,kBAAkB;wBACzCgB,WAAWnC,WAAWkB,iBAAiB;;;iBAGzCkB;YAEHV,8BAA8BG,MAAM,iBACnC,MAACrC,MAAMsC,QAAQ;;kCACb,KAACC;kCAAG;;kCACJ,KAAClC;wBACCmC,oBAAoBN;wBACpBO,MAAMZ;;;iBAGRe;YACHZ,4BACC,KAAChC,MAAMsC,QAAQ;0BACb,cAAA,MAACO;oBACCC,UAAU;oBACVC,iDAA+C;oBAC/CC,MAAK;oBACLC,SAAS,IAAMnB,OAAO,CAACD;;wBAEtBA,MAAM,SAAS;wBAAO;;;iBAGzBe;;;AAGV;AAEA,OAAO,MAAMM,SAAS/C,uBAqHrB"}

View File

@ -0,0 +1,41 @@
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from "react";
import { Dialog, DialogContent, DialogHeader } from "../components/Dialog";
import { Overlay } from "../components/Overlay";
import { VersionStalenessInfo } from "../components/VersionStalenessInfo";
import { HotlinkedText } from "../components/hot-linked-text";
export const RootLayoutMissingTagsError = function RootLayoutMissingTagsError(param) {
let { missingTags, versionInfo } = param;
const noop = React.useCallback(()=>{}, []);
return /*#__PURE__*/ _jsx(Overlay, {
children: /*#__PURE__*/ _jsx(Dialog, {
type: "error",
"aria-labelledby": "nextjs__container_errors_label",
"aria-describedby": "nextjs__container_errors_desc",
onClose: noop,
children: /*#__PURE__*/ _jsx(DialogContent, {
children: /*#__PURE__*/ _jsxs(DialogHeader, {
className: "nextjs-container-errors-header",
children: [
/*#__PURE__*/ _jsx("h3", {
id: "nextjs__container_errors_label",
children: "Missing required html tags"
}),
versionInfo ? /*#__PURE__*/ _jsx(VersionStalenessInfo, {
...versionInfo
}) : null,
/*#__PURE__*/ _jsx("p", {
id: "nextjs__container_errors_desc",
className: "nextjs__container_errors_desc",
children: /*#__PURE__*/ _jsx(HotlinkedText, {
text: "The following tags are missing in the Root Layout: " + missingTags.map((tagName)=>"<" + tagName + ">").join(", ") + ".\nRead more at https://nextjs.org/docs/messages/missing-root-layout-tags"
})
})
]
})
})
})
});
};
//# sourceMappingURL=root-layout-missing-tags-error.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/container/root-layout-missing-tags-error.tsx"],"names":["React","Dialog","DialogContent","DialogHeader","Overlay","VersionStalenessInfo","HotlinkedText","RootLayoutMissingTagsError","missingTags","versionInfo","noop","useCallback","type","aria-labelledby","aria-describedby","onClose","className","h3","id","p","text","map","tagName","join"],"mappings":";AAAA,YAAYA,WAAW,QAAO;AAE9B,SAASC,MAAM,EAAEC,aAAa,EAAEC,YAAY,QAAQ,uBAAsB;AAC1E,SAASC,OAAO,QAAQ,wBAAuB;AAC/C,SAASC,oBAAoB,QAAQ,qCAAoC;AACzE,SAASC,aAAa,QAAQ,gCAA+B;AAO7D,OAAO,MAAMC,6BACX,SAASA,2BAA2B,KAA4B;IAA5B,IAAA,EAAEC,WAAW,EAAEC,WAAW,EAAE,GAA5B;IAClC,MAAMC,OAAOV,MAAMW,WAAW,CAAC,KAAO,GAAG,EAAE;IAC3C,qBACE,KAACP;kBACC,cAAA,KAACH;YACCW,MAAK;YACLC,mBAAgB;YAChBC,oBAAiB;YACjBC,SAASL;sBAET,cAAA,KAACR;0BACC,cAAA,MAACC;oBAAaa,WAAU;;sCACtB,KAACC;4BAAGC,IAAG;sCAAiC;;wBAGvCT,4BAAc,KAACJ;4BAAsB,GAAGI,WAAW;6BAAO;sCAC3D,KAACU;4BACCD,IAAG;4BACHF,WAAU;sCAEV,cAAA,KAACV;gCACCc,MAAM,AAAC,wDAAqDZ,YACzDa,GAAG,CAAC,CAACC,UAAY,AAAC,MAAGA,UAAQ,KAC7BC,IAAI,CACH,QACA;;;;;;;;AAQpB,EAAC"}

View File

@ -0,0 +1,147 @@
/**
MIT License
Copyright (c) 2015-present, Facebook, Inc.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/ import stripAnsi from "next/dist/compiled/strip-ansi";
// This file is based on https://github.com/facebook/create-react-app/blob/7b1a32be6ec9f99a6c9a3c66813f3ac09c4736b9/packages/react-dev-utils/formatWebpackMessages.js
// It's been edited to remove chalk and CRA-specific logic
const friendlySyntaxErrorLabel = "Syntax error:";
const WEBPACK_BREAKING_CHANGE_POLYFILLS = "\n\nBREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.";
function isLikelyASyntaxError(message) {
return stripAnsi(message).includes(friendlySyntaxErrorLabel);
}
let hadMissingSassError = false;
// Cleans up webpack error messages.
function formatMessage(message, verbose, importTraceNote) {
// TODO: Replace this once webpack 5 is stable
if (typeof message === "object" && message.message) {
const filteredModuleTrace = message.moduleTrace && message.moduleTrace.filter((trace)=>!/next-(middleware|client-pages|route|edge-function)-loader\.js/.test(trace.originName));
let body = message.message;
const breakingChangeIndex = body.indexOf(WEBPACK_BREAKING_CHANGE_POLYFILLS);
if (breakingChangeIndex >= 0) {
body = body.slice(0, breakingChangeIndex);
}
message = (message.moduleName ? stripAnsi(message.moduleName) + "\n" : "") + (message.file ? stripAnsi(message.file) + "\n" : "") + body + (message.details && verbose ? "\n" + message.details : "") + (filteredModuleTrace && filteredModuleTrace.length ? (importTraceNote || "\n\nImport trace for requested module:") + filteredModuleTrace.map((trace)=>"\n" + trace.moduleName).join("") : "") + (message.stack && verbose ? "\n" + message.stack : "");
}
let lines = message.split("\n");
// Strip Webpack-added headers off errors/warnings
// https://github.com/webpack/webpack/blob/master/lib/ModuleError.js
lines = lines.filter((line)=>!/Module [A-z ]+\(from/.test(line));
// Transform parsing error into syntax error
// TODO: move this to our ESLint formatter?
lines = lines.map((line)=>{
const parsingError = /Line (\d+):(?:(\d+):)?\s*Parsing error: (.+)$/.exec(line);
if (!parsingError) {
return line;
}
const [, errorLine, errorColumn, errorMessage] = parsingError;
return friendlySyntaxErrorLabel + " " + errorMessage + " (" + errorLine + ":" + errorColumn + ")";
});
message = lines.join("\n");
// Smoosh syntax errors (commonly found in CSS)
message = message.replace(/SyntaxError\s+\((\d+):(\d+)\)\s*(.+?)\n/g, "" + friendlySyntaxErrorLabel + " $3 ($1:$2)\n");
// Clean up export errors
message = message.replace(/^.*export '(.+?)' was not found in '(.+?)'.*$/gm, "Attempted import error: '$1' is not exported from '$2'.");
message = message.replace(/^.*export 'default' \(imported as '(.+?)'\) was not found in '(.+?)'.*$/gm, "Attempted import error: '$2' does not contain a default export (imported as '$1').");
message = message.replace(/^.*export '(.+?)' \(imported as '(.+?)'\) was not found in '(.+?)'.*$/gm, "Attempted import error: '$1' is not exported from '$3' (imported as '$2').");
lines = message.split("\n");
// Remove leading newline
if (lines.length > 2 && lines[1].trim() === "") {
lines.splice(1, 1);
}
// Cleans up verbose "module not found" messages for files and packages.
if (lines[1] && lines[1].indexOf("Module not found: ") === 0) {
lines = [
lines[0],
lines[1].replace("Error: ", "").replace("Module not found: Cannot find file:", "Cannot find file:"),
...lines.slice(2)
];
}
// Add helpful message for users trying to use Sass for the first time
if (lines[1] && lines[1].match(/Cannot find module.+sass/)) {
// ./file.module.scss (<<loader info>>) => ./file.module.scss
const firstLine = lines[0].split("!");
lines[0] = firstLine[firstLine.length - 1];
lines[1] = "To use Next.js' built-in Sass support, you first need to install `sass`.\n";
lines[1] += "Run `npm i sass` or `yarn add sass` inside your workspace.\n";
lines[1] += "\nLearn more: https://nextjs.org/docs/messages/install-sass";
// dispose of unhelpful stack trace
lines = lines.slice(0, 2);
hadMissingSassError = true;
} else if (hadMissingSassError && message.match(/(sass-loader|resolve-url-loader: CSS error)/)) {
// dispose of unhelpful stack trace following missing sass module
lines = [];
}
if (!verbose) {
message = lines.join("\n");
// Internal stacks are generally useless so we strip them... with the
// exception of stacks containing `webpack:` because they're normally
// from user code generated by Webpack. For more information see
// https://github.com/facebook/create-react-app/pull/1050
message = message.replace(/^\s*at\s((?!webpack:).)*:\d+:\d+[\s)]*(\n|$)/gm, "") // at ... ...:x:y
;
message = message.replace(/^\s*at\s<anonymous>(\n|$)/gm, "") // at <anonymous>
;
message = message.replace(/File was processed with these loaders:\n(.+[\\/](next[\\/]dist[\\/].+|@next[\\/]react-refresh-utils[\\/]loader)\.js\n)*You may need an additional loader to handle the result of these loaders.\n/g, "");
lines = message.split("\n");
}
// Remove duplicated newlines
lines = lines.filter((line, index, arr)=>index === 0 || line.trim() !== "" || line.trim() !== arr[index - 1].trim());
// Reassemble the message
message = lines.join("\n");
return message.trim();
}
export default function formatWebpackMessages(json, verbose) {
const formattedErrors = json.errors.map((message)=>{
const isUnknownNextFontError = message.message.includes("An error occurred in `next/font`.");
return formatMessage(message, isUnknownNextFontError || verbose);
});
const formattedWarnings = json.warnings.map((message)=>{
return formatMessage(message, verbose);
});
// Reorder errors to put the most relevant ones first.
let reactServerComponentsError = -1;
for(let i = 0; i < formattedErrors.length; i++){
const error = formattedErrors[i];
if (error.includes("ReactServerComponentsError")) {
reactServerComponentsError = i;
break;
}
}
// Move the reactServerComponentsError to the top if it exists
if (reactServerComponentsError !== -1) {
const error = formattedErrors.splice(reactServerComponentsError, 1);
formattedErrors.unshift(error[0]);
}
const result = {
...json,
errors: formattedErrors,
warnings: formattedWarnings
};
if (!verbose && result.errors.some(isLikelyASyntaxError)) {
// If there are any syntax errors, show just them.
result.errors = result.errors.filter(isLikelyASyntaxError);
result.warnings = [];
}
return result;
}
//# sourceMappingURL=format-webpack-messages.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/format-webpack-messages.ts"],"names":["stripAnsi","friendlySyntaxErrorLabel","WEBPACK_BREAKING_CHANGE_POLYFILLS","isLikelyASyntaxError","message","includes","hadMissingSassError","formatMessage","verbose","importTraceNote","filteredModuleTrace","moduleTrace","filter","trace","test","originName","body","breakingChangeIndex","indexOf","slice","moduleName","file","details","length","map","join","stack","lines","split","line","parsingError","exec","errorLine","errorColumn","errorMessage","replace","trim","splice","match","firstLine","index","arr","formatWebpackMessages","json","formattedErrors","errors","isUnknownNextFontError","formattedWarnings","warnings","reactServerComponentsError","i","error","unshift","result","some"],"mappings":"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"}

View File

@ -0,0 +1,22 @@
import { normalizedAssetPrefix } from "../../../../../shared/lib/normalized-asset-prefix";
function getSocketProtocol(assetPrefix) {
let protocol = window.location.protocol;
try {
// assetPrefix is a url
protocol = new URL(assetPrefix).protocol;
} catch (e) {}
return protocol === "http:" ? "ws:" : "wss:";
}
export function getSocketUrl(assetPrefix) {
const prefix = normalizedAssetPrefix(assetPrefix);
const protocol = getSocketProtocol(assetPrefix || "");
if (URL.canParse(prefix)) {
// since normalized asset prefix is ensured to be a URL format,
// we can safely replace the protocol
return prefix.replace(/^http/, "ws");
}
const { hostname, port } = window.location;
return protocol + "//" + hostname + (port ? ":" + port : "") + prefix;
}
//# sourceMappingURL=get-socket-url.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/get-socket-url.ts"],"names":["normalizedAssetPrefix","getSocketProtocol","assetPrefix","protocol","window","location","URL","getSocketUrl","prefix","canParse","replace","hostname","port"],"mappings":"AAAA,SAASA,qBAAqB,QAAQ,oDAAmD;AAEzF,SAASC,kBAAkBC,WAAmB;IAC5C,IAAIC,WAAWC,OAAOC,QAAQ,CAACF,QAAQ;IAEvC,IAAI;QACF,uBAAuB;QACvBA,WAAW,IAAIG,IAAIJ,aAAaC,QAAQ;IAC1C,EAAE,UAAM,CAAC;IAET,OAAOA,aAAa,UAAU,QAAQ;AACxC;AAEA,OAAO,SAASI,aAAaL,WAA+B;IAC1D,MAAMM,SAASR,sBAAsBE;IACrC,MAAMC,WAAWF,kBAAkBC,eAAe;IAElD,IAAII,IAAIG,QAAQ,CAACD,SAAS;QACxB,+DAA+D;QAC/D,qCAAqC;QACrC,OAAOA,OAAOE,OAAO,CAAC,SAAS;IACjC;IAEA,MAAM,EAAEC,QAAQ,EAAEC,IAAI,EAAE,GAAGR,OAAOC,QAAQ;IAC1C,OAAO,AAAGF,WAAS,OAAIQ,WAAWC,CAAAA,OAAO,AAAC,MAAGA,OAAS,EAAC,IAAIJ;AAC7D"}

View File

@ -0,0 +1,31 @@
import { ACTION_UNHANDLED_ERROR, ACTION_UNHANDLED_REJECTION } from "../../shared";
import { getOriginalStackFrames } from "./stack-frame";
import { getErrorSource } from "../../../../../shared/lib/error-source";
export async function getErrorByType(ev, isAppDir) {
const { id, event } = ev;
switch(event.type){
case ACTION_UNHANDLED_ERROR:
case ACTION_UNHANDLED_REJECTION:
{
const readyRuntimeError = {
id,
runtime: true,
error: event.reason,
frames: await getOriginalStackFrames(event.frames, getErrorSource(event.reason), isAppDir, event.reason.toString())
};
if (event.type === ACTION_UNHANDLED_ERROR) {
readyRuntimeError.componentStackFrames = event.componentStackFrames;
}
return readyRuntimeError;
}
default:
{
break;
}
}
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const _ = event;
throw new Error("type system invariant violation");
}
//# sourceMappingURL=getErrorByType.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/getErrorByType.ts"],"names":["ACTION_UNHANDLED_ERROR","ACTION_UNHANDLED_REJECTION","getOriginalStackFrames","getErrorSource","getErrorByType","ev","isAppDir","id","event","type","readyRuntimeError","runtime","error","reason","frames","toString","componentStackFrames","_","Error"],"mappings":"AAAA,SACEA,sBAAsB,EACtBC,0BAA0B,QACrB,eAAc;AAErB,SAASC,sBAAsB,QAAQ,gBAAe;AAGtD,SAASC,cAAc,QAAQ,yCAAwC;AAUvE,OAAO,eAAeC,eACpBC,EAAuB,EACvBC,QAAiB;IAEjB,MAAM,EAAEC,EAAE,EAAEC,KAAK,EAAE,GAAGH;IACtB,OAAQG,MAAMC,IAAI;QAChB,KAAKT;QACL,KAAKC;YAA4B;gBAC/B,MAAMS,oBAAuC;oBAC3CH;oBACAI,SAAS;oBACTC,OAAOJ,MAAMK,MAAM;oBACnBC,QAAQ,MAAMZ,uBACZM,MAAMM,MAAM,EACZX,eAAeK,MAAMK,MAAM,GAC3BP,UACAE,MAAMK,MAAM,CAACE,QAAQ;gBAEzB;gBACA,IAAIP,MAAMC,IAAI,KAAKT,wBAAwB;oBACzCU,kBAAkBM,oBAAoB,GAAGR,MAAMQ,oBAAoB;gBACrE;gBACA,OAAON;YACT;QACA;YAAS;gBACP;YACF;IACF;IACA,6DAA6D;IAC7D,MAAMO,IAAWT;IACjB,MAAM,IAAIU,MAAM;AAClB"}

View File

@ -0,0 +1,27 @@
import dataUriToBuffer from "next/dist/compiled/data-uri-to-buffer";
import { getSourceMapUrl } from "./getSourceMapUrl";
export function getRawSourceMap(fileContents) {
const sourceUrl = getSourceMapUrl(fileContents);
if (!(sourceUrl == null ? void 0 : sourceUrl.startsWith("data:"))) {
return null;
}
let buffer;
try {
buffer = dataUriToBuffer(sourceUrl);
} catch (err) {
console.error("Failed to parse source map URL:", err);
return null;
}
if (buffer.type !== "application/json") {
console.error("Unknown source map type: " + buffer.typeFull + ".");
return null;
}
try {
return JSON.parse(buffer.toString());
} catch (e) {
console.error("Failed to parse source map.");
return null;
}
}
//# sourceMappingURL=getRawSourceMap.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/getRawSourceMap.ts"],"names":["dataUriToBuffer","getSourceMapUrl","getRawSourceMap","fileContents","sourceUrl","startsWith","buffer","err","console","error","type","typeFull","JSON","parse","toString"],"mappings":"AAAA,OAAOA,qBAAqB,wCAAuC;AACnE,SAASC,eAAe,QAAQ,oBAAmB;AAEnD,OAAO,SAASC,gBAAgBC,YAAoB;IAClD,MAAMC,YAAYH,gBAAgBE;IAClC,IAAI,EAACC,6BAAAA,UAAWC,UAAU,CAAC,WAAU;QACnC,OAAO;IACT;IAEA,IAAIC;IACJ,IAAI;QACFA,SAASN,gBAAgBI;IAC3B,EAAE,OAAOG,KAAK;QACZC,QAAQC,KAAK,CAAC,mCAAmCF;QACjD,OAAO;IACT;IAEA,IAAID,OAAOI,IAAI,KAAK,oBAAoB;QACtCF,QAAQC,KAAK,CAAC,AAAC,8BAA2BH,OAAOK,QAAQ,GAAC;QAC1D,OAAO;IACT;IAEA,IAAI;QACF,OAAOC,KAAKC,KAAK,CAACP,OAAOQ,QAAQ;IACnC,EAAE,UAAM;QACNN,QAAQC,KAAK,CAAC;QACd,OAAO;IACT;AACF"}

View File

@ -0,0 +1,17 @@
export function getSourceMapUrl(fileContents) {
const regex = /\/\/[#@] ?sourceMappingURL=([^\s'"]+)\s*$/gm;
let match = null;
for(;;){
let next = regex.exec(fileContents);
if (next == null) {
break;
}
match = next;
}
if (!(match && match[1])) {
return null;
}
return match[1].toString();
}
//# sourceMappingURL=getSourceMapUrl.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/getSourceMapUrl.ts"],"names":["getSourceMapUrl","fileContents","regex","match","next","exec","toString"],"mappings":"AAAA,OAAO,SAASA,gBAAgBC,YAAoB;IAClD,MAAMC,QAAQ;IACd,IAAIC,QAAQ;IACZ,OAAS;QACP,IAAIC,OAAOF,MAAMG,IAAI,CAACJ;QACtB,IAAIG,QAAQ,MAAM;YAChB;QACF;QACAD,QAAQC;IACV;IACA,IAAI,CAAED,CAAAA,SAASA,KAAK,CAAC,EAAE,AAAD,GAAI;QACxB,OAAO;IACT;IACA,OAAOA,KAAK,CAAC,EAAE,CAACG,QAAQ;AAC1B"}

View File

@ -0,0 +1,40 @@
/**
* Group sequences of stack frames by framework.
*
* Given the following stack frames:
* Error
* user code
* user code
* react
* react
* next
* next
* react
* react
*
* The grouped stack frames would be:
* > user code
* > react
* > next
* > react
*
*/ export function groupStackFramesByFramework(stackFrames) {
const stackFramesGroupedByFramework = [];
for (const stackFrame of stackFrames){
const currentGroup = stackFramesGroupedByFramework[stackFramesGroupedByFramework.length - 1];
const framework = stackFrame.sourcePackage;
if (currentGroup && currentGroup.framework === framework) {
currentGroup.stackFrames.push(stackFrame);
} else {
stackFramesGroupedByFramework.push({
framework: framework,
stackFrames: [
stackFrame
]
});
}
}
return stackFramesGroupedByFramework;
}
//# sourceMappingURL=group-stack-frames-by-framework.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/group-stack-frames-by-framework.ts"],"names":["groupStackFramesByFramework","stackFrames","stackFramesGroupedByFramework","stackFrame","currentGroup","length","framework","sourcePackage","push"],"mappings":"AAQA;;;;;;;;;;;;;;;;;;;;CAoBC,GACD,OAAO,SAASA,4BACdC,WAAiC;IAEjC,MAAMC,gCAAoD,EAAE;IAE5D,KAAK,MAAMC,cAAcF,YAAa;QACpC,MAAMG,eACJF,6BAA6B,CAACA,8BAA8BG,MAAM,GAAG,EAAE;QACzE,MAAMC,YAAYH,WAAWI,aAAa;QAE1C,IAAIH,gBAAgBA,aAAaE,SAAS,KAAKA,WAAW;YACxDF,aAAaH,WAAW,CAACO,IAAI,CAACL;QAChC,OAAO;YACLD,8BAA8BM,IAAI,CAAC;gBACjCF,WAAWA;gBACXL,aAAa;oBAACE;iBAAW;YAC3B;QACF;IACF;IAEA,OAAOD;AACT"}

View File

@ -0,0 +1,50 @@
export const getHydrationWarningType = (msg)=>{
if (isHtmlTagsWarning(msg)) return "tag";
if (isTextInTagsMismatchWarning(msg)) return "text-in-tag";
return "text";
};
const isHtmlTagsWarning = (msg)=>Boolean(msg && htmlTagsWarnings.has(msg));
const isTextMismatchWarning = (msg)=>textMismatchWarning === msg;
const isTextInTagsMismatchWarning = (msg)=>Boolean(msg && textAndTagsMismatchWarnings.has(msg));
const isKnownHydrationWarning = (msg)=>isHtmlTagsWarning(msg) || isTextInTagsMismatchWarning(msg) || isTextMismatchWarning(msg);
export const hydrationErrorState = {};
// https://github.com/facebook/react/blob/main/packages/react-dom/src/__tests__/ReactDOMHydrationDiff-test.js used as a reference
const htmlTagsWarnings = new Set([
'Warning: Cannot render a sync or defer <script> outside the main document without knowing its order. Try adding async="" or moving it into the root <head> tag.%s',
"Warning: In HTML, %s cannot be a child of <%s>.%s\nThis will cause a hydration error.%s",
"Warning: In HTML, %s cannot be a descendant of <%s>.\nThis will cause a hydration error.%s",
"Warning: In HTML, text nodes cannot be a child of <%s>.\nThis will cause a hydration error.",
"Warning: In HTML, whitespace text nodes cannot be a child of <%s>. Make sure you don't have any extra whitespace between tags on each line of your source code.\nThis will cause a hydration error.",
"Warning: Expected server HTML to contain a matching <%s> in <%s>.%s",
"Warning: Did not expect server HTML to contain a <%s> in <%s>.%s"
]);
const textAndTagsMismatchWarnings = new Set([
'Warning: Expected server HTML to contain a matching text node for "%s" in <%s>.%s',
'Warning: Did not expect server HTML to contain the text node "%s" in <%s>.%s'
]);
const textMismatchWarning = 'Warning: Text content did not match. Server: "%s" Client: "%s"%s';
/**
* Patch console.error to capture hydration errors.
* If any of the knownHydrationWarnings are logged, store the message and component stack.
* When the hydration runtime error is thrown, the message and component stack are added to the error.
* This results in a more helpful error message in the error overlay.
*/ export function patchConsoleError() {
const prev = console.error;
console.error = function(msg, serverContent, clientContent, componentStack) {
if (isKnownHydrationWarning(msg)) {
hydrationErrorState.warning = [
// remove the last %s from the message
msg,
serverContent,
clientContent
];
hydrationErrorState.componentStack = componentStack;
hydrationErrorState.serverContent = serverContent;
hydrationErrorState.clientContent = clientContent;
}
// @ts-expect-error argument is defined
prev.apply(console, arguments);
};
}
//# sourceMappingURL=hydration-error-info.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/hydration-error-info.ts"],"names":["getHydrationWarningType","msg","isHtmlTagsWarning","isTextInTagsMismatchWarning","Boolean","htmlTagsWarnings","has","isTextMismatchWarning","textMismatchWarning","textAndTagsMismatchWarnings","isKnownHydrationWarning","hydrationErrorState","Set","patchConsoleError","prev","console","error","serverContent","clientContent","componentStack","warning","apply","arguments"],"mappings":"AAUA,OAAO,MAAMA,0BAA0B,CACrCC;IAEA,IAAIC,kBAAkBD,MAAM,OAAO;IACnC,IAAIE,4BAA4BF,MAAM,OAAO;IAC7C,OAAO;AACT,EAAC;AAED,MAAMC,oBAAoB,CAACD,MACzBG,QAAQH,OAAOI,iBAAiBC,GAAG,CAACL;AAEtC,MAAMM,wBAAwB,CAACN,MAAsBO,wBAAwBP;AAC7E,MAAME,8BAA8B,CAACF,MACnCG,QAAQH,OAAOQ,4BAA4BH,GAAG,CAACL;AAEjD,MAAMS,0BAA0B,CAACT,MAC/BC,kBAAkBD,QAClBE,4BAA4BF,QAC5BM,sBAAsBN;AAExB,OAAO,MAAMU,sBAA2C,CAAC,EAAC;AAE1D,iIAAiI;AACjI,MAAMN,mBAAmB,IAAIO,IAAI;IAC/B;IACA;IACA;IACA;IACA;IACA;IACA;CACD;AACD,MAAMH,8BAA8B,IAAIG,IAAI;IAC1C;IACA;CACD;AACD,MAAMJ,sBACJ;AAEF;;;;;CAKC,GACD,OAAO,SAASK;IACd,MAAMC,OAAOC,QAAQC,KAAK;IAC1BD,QAAQC,KAAK,GAAG,SAAUf,GAAG,EAAEgB,aAAa,EAAEC,aAAa,EAAEC,cAAc;QACzE,IAAIT,wBAAwBT,MAAM;YAChCU,oBAAoBS,OAAO,GAAG;gBAC5B,sCAAsC;gBACtCnB;gBACAgB;gBACAC;aACD;YACDP,oBAAoBQ,cAAc,GAAGA;YACrCR,oBAAoBM,aAAa,GAAGA;YACpCN,oBAAoBO,aAAa,GAAGA;QACtC;QAEA,uCAAuC;QACvCJ,KAAKO,KAAK,CAACN,SAASO;IACtB;AACF"}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,47 @@
import { parse } from "next/dist/compiled/stacktrace-parser";
import { decorateServerError } from "../../../../../shared/lib/error-source";
export function getFilesystemFrame(frame) {
const f = {
...frame
};
if (typeof f.file === "string") {
if (// Posix:
f.file.startsWith("/") || // Win32:
/^[a-z]:\\/i.test(f.file) || // Win32 UNC:
f.file.startsWith("\\\\")) {
f.file = "file://" + f.file;
}
}
return f;
}
export function getServerError(error, type) {
let n;
try {
throw new Error(error.message);
} catch (e) {
n = e;
}
n.name = error.name;
try {
n.stack = n.toString() + "\n" + parse(error.stack).map(getFilesystemFrame).map((f)=>{
let str = " at " + f.methodName;
if (f.file) {
let loc = f.file;
if (f.lineNumber) {
loc += ":" + f.lineNumber;
if (f.column) {
loc += ":" + f.column;
}
}
str += " (" + loc + ")";
}
return str;
}).join("\n");
} catch (e) {
n.stack = error.stack;
}
decorateServerError(n, type);
return n;
}
//# sourceMappingURL=nodeStackFrames.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/nodeStackFrames.ts"],"names":["parse","decorateServerError","getFilesystemFrame","frame","f","file","startsWith","test","getServerError","error","type","n","Error","message","e","name","stack","toString","map","str","methodName","loc","lineNumber","column","join"],"mappings":"AAAA,SAASA,KAAK,QAAQ,uCAAsC;AAE5D,SACEC,mBAAmB,QAEd,yCAAwC;AAE/C,OAAO,SAASC,mBAAmBC,KAAiB;IAClD,MAAMC,IAAgB;QAAE,GAAGD,KAAK;IAAC;IAEjC,IAAI,OAAOC,EAAEC,IAAI,KAAK,UAAU;QAC9B,IACE,SAAS;QACTD,EAAEC,IAAI,CAACC,UAAU,CAAC,QAClB,SAAS;QACT,aAAaC,IAAI,CAACH,EAAEC,IAAI,KACxB,aAAa;QACbD,EAAEC,IAAI,CAACC,UAAU,CAAC,SAClB;YACAF,EAAEC,IAAI,GAAG,AAAC,YAASD,EAAEC,IAAI;QAC3B;IACF;IAEA,OAAOD;AACT;AAEA,OAAO,SAASI,eAAeC,KAAY,EAAEC,IAAqB;IAChE,IAAIC;IACJ,IAAI;QACF,MAAM,IAAIC,MAAMH,MAAMI,OAAO;IAC/B,EAAE,OAAOC,GAAG;QACVH,IAAIG;IACN;IAEAH,EAAEI,IAAI,GAAGN,MAAMM,IAAI;IACnB,IAAI;QACFJ,EAAEK,KAAK,GAAG,AAAGL,EAAEM,QAAQ,KAAG,OAAIjB,MAAMS,MAAMO,KAAK,EAC5CE,GAAG,CAAChB,oBACJgB,GAAG,CAAC,CAACd;YACJ,IAAIe,MAAM,AAAC,YAASf,EAAEgB,UAAU;YAChC,IAAIhB,EAAEC,IAAI,EAAE;gBACV,IAAIgB,MAAMjB,EAAEC,IAAI;gBAChB,IAAID,EAAEkB,UAAU,EAAE;oBAChBD,OAAO,AAAC,MAAGjB,EAAEkB,UAAU;oBACvB,IAAIlB,EAAEmB,MAAM,EAAE;wBACZF,OAAO,AAAC,MAAGjB,EAAEmB,MAAM;oBACrB;gBACF;gBACAJ,OAAO,AAAC,OAAIE,MAAI;YAClB;YACA,OAAOF;QACT,GACCK,IAAI,CAAC;IACV,EAAE,UAAM;QACNb,EAAEK,KAAK,GAAGP,MAAMO,KAAK;IACvB;IAEAf,oBAAoBU,GAAGD;IACvB,OAAOC;AACT"}

View File

@ -0,0 +1,9 @@
export function noop(strings) {
for(var _len = arguments.length, keys = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++){
keys[_key - 1] = arguments[_key];
}
const lastIndex = strings.length - 1;
return strings.slice(0, lastIndex).reduce((p, s, i)=>p + s + keys[i], "") + strings[lastIndex];
}
//# sourceMappingURL=noop-template.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/noop-template.ts"],"names":["noop","strings","keys","lastIndex","length","slice","reduce","p","s","i"],"mappings":"AAAA,OAAO,SAASA,KACdC,OAA6B;IAC7B,IAAA,IAAA,OAAA,UAAA,QAAA,AAAGC,OAAH,UAAA,OAAA,IAAA,OAAA,QAAA,OAAA,GAAA,OAAA,MAAA;QAAGA,KAAH,OAAA,KAAA,SAAA,CAAA,KAA0B;;IAE1B,MAAMC,YAAYF,QAAQG,MAAM,GAAG;IACnC,OACEH,QAAQI,KAAK,CAAC,GAAGF,WAAWG,MAAM,CAAC,CAACC,GAAGC,GAAGC,IAAMF,IAAIC,IAAIN,IAAI,CAACO,EAAE,EAAE,MACjER,OAAO,CAACE,UAAU;AAEtB"}

View File

@ -0,0 +1,82 @@
var LocationType;
(function(LocationType) {
LocationType["FILE"] = "file";
LocationType["WEBPACK_INTERNAL"] = "webpack-internal";
LocationType["HTTP"] = "http";
LocationType["PROTOCOL_RELATIVE"] = "protocol-relative";
LocationType["UNKNOWN"] = "unknown";
})(LocationType || (LocationType = {}));
/**
* Get the type of frame line based on the location
*/ function getLocationType(location) {
if (location.startsWith("file://")) {
return "file";
}
if (location.startsWith("webpack-internal://")) {
return "webpack-internal";
}
if (location.startsWith("http://") || location.startsWith("https://")) {
return "http";
}
if (location.startsWith("//")) {
return "protocol-relative";
}
return "unknown";
}
function parseStackFrameLocation(location) {
const locationType = getLocationType(location);
const modulePath = location == null ? void 0 : location.replace(/^(webpack-internal:\/\/\/|file:\/\/)(\(.*\)\/)?/, "");
var _modulePath_match;
const [, file, lineNumber, column] = (_modulePath_match = modulePath == null ? void 0 : modulePath.match(/^(.+):(\d+):(\d+)/)) != null ? _modulePath_match : [];
switch(locationType){
case "file":
case "webpack-internal":
return {
canOpenInEditor: true,
file,
lineNumber: lineNumber ? Number(lineNumber) : undefined,
column: column ? Number(column) : undefined
};
// When the location is a URL we only show the file
// TODO: Resolve http(s) URLs through sourcemaps
case "http":
case "protocol-relative":
case "unknown":
default:
{
return {
canOpenInEditor: false
};
}
}
}
export function parseComponentStack(componentStack) {
const componentStackFrames = [];
for (const line of componentStack.trim().split("\n")){
// Get component and file from the component stack line
const match = /at ([^ ]+)( \((.*)\))?/.exec(line);
if (match == null ? void 0 : match[1]) {
const component = match[1];
const location = match[3];
if (!location) {
componentStackFrames.push({
canOpenInEditor: false,
component
});
continue;
}
// Stop parsing the component stack if we reach a Next.js component
if (location == null ? void 0 : location.includes("next/dist")) {
break;
}
const frameLocation = parseStackFrameLocation(location);
componentStackFrames.push({
component,
...frameLocation
});
}
}
return componentStackFrames;
}
//# sourceMappingURL=parse-component-stack.js.map

View File

@ -0,0 +1 @@
{"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/internal/helpers/parse-component-stack.ts"],"names":["LocationType","getLocationType","location","startsWith","parseStackFrameLocation","locationType","modulePath","replace","file","lineNumber","column","match","canOpenInEditor","Number","undefined","parseComponentStack","componentStack","componentStackFrames","line","trim","split","exec","component","push","includes","frameLocation"],"mappings":";UAQKA;;;;;;GAAAA,iBAAAA;AAQL;;CAEC,GACD,SAASC,gBAAgBC,QAAgB;IACvC,IAAIA,SAASC,UAAU,CAAC,YAAY;QAClC;IACF;IACA,IAAID,SAASC,UAAU,CAAC,wBAAwB;QAC9C;IACF;IACA,IAAID,SAASC,UAAU,CAAC,cAAcD,SAASC,UAAU,CAAC,aAAa;QACrE;IACF;IACA,IAAID,SAASC,UAAU,CAAC,OAAO;QAC7B;IACF;IACA;AACF;AAEA,SAASC,wBACPF,QAAgB;IAEhB,MAAMG,eAAeJ,gBAAgBC;IAErC,MAAMI,aAAaJ,4BAAAA,SAAUK,OAAO,CAClC,mDACA;QAGAD;IADF,MAAM,GAAGE,MAAMC,YAAYC,OAAO,GAChCJ,CAAAA,oBAAAA,8BAAAA,WAAYK,KAAK,CAAC,gCAAlBL,oBAA0C,EAAE;IAE9C,OAAQD;QACN;QACA;YACE,OAAO;gBACLO,iBAAiB;gBACjBJ;gBACAC,YAAYA,aAAaI,OAAOJ,cAAcK;gBAC9CJ,QAAQA,SAASG,OAAOH,UAAUI;YACpC;QACF,mDAAmD;QACnD,gDAAgD;QAChD;QACA;QACA;QACA;YAAS;gBACP,OAAO;oBACLF,iBAAiB;gBACnB;YACF;IACF;AACF;AAEA,OAAO,SAASG,oBACdC,cAAsB;IAEtB,MAAMC,uBAA8C,EAAE;IACtD,KAAK,MAAMC,QAAQF,eAAeG,IAAI,GAAGC,KAAK,CAAC,MAAO;QACpD,uDAAuD;QACvD,MAAMT,QAAQ,yBAAyBU,IAAI,CAACH;QAC5C,IAAIP,yBAAAA,KAAO,CAAC,EAAE,EAAE;YACd,MAAMW,YAAYX,KAAK,CAAC,EAAE;YAC1B,MAAMT,WAAWS,KAAK,CAAC,EAAE;YAEzB,IAAI,CAACT,UAAU;gBACbe,qBAAqBM,IAAI,CAAC;oBACxBX,iBAAiB;oBACjBU;gBACF;gBACA;YACF;YAEA,mEAAmE;YACnE,IAAIpB,4BAAAA,SAAUsB,QAAQ,CAAC,cAAc;gBACnC;YACF;YAEA,MAAMC,gBAAgBrB,wBAAwBF;YAC9Ce,qBAAqBM,IAAI,CAAC;gBACxBD;gBACA,GAAGG,aAAa;YAClB;QACF;IACF;IAEA,OAAOR;AACT"}

Some files were not shown because too many files have changed in this diff Show More