next 15.1.1-canary.11 → 15.1.1-canary.12

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Terminal/Terminal.js

@@ -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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Terminal/Terminal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/components/Terminal/Terminal.tsx"],"sourcesContent":["import Anser from 'next/dist/compiled/anser'\nimport * as React from 'react'\nimport { HotlinkedText } from '../hot-linked-text'\nimport { EditorLink } from './EditorLink'\n\nexport type TerminalProps = { content: string }\n\nfunction getFile(lines: string[]) {\n  const contentFileName = lines.shift()\n  if (!contentFileName) return null\n  const [fileName, line, column] = contentFileName.split(':', 3)\n\n  const parsedLine = Number(line)\n  const parsedColumn = Number(column)\n  const hasLocation = !Number.isNaN(parsedLine) && !Number.isNaN(parsedColumn)\n\n  return {\n    fileName: hasLocation ? fileName : contentFileName,\n    location: hasLocation\n      ? {\n          line: parsedLine,\n          column: parsedColumn,\n        }\n      : undefined,\n  }\n}\n\nfunction getImportTraceFiles(lines: string[]) {\n  if (\n    lines.some((line) => /ReactServerComponentsError:/.test(line)) ||\n    lines.some((line) => /Import trace for requested module:/.test(line))\n  ) {\n    // Grab the lines at the end containing the files\n    const files = []\n    while (\n      /.+\\..+/.test(lines[lines.length - 1]) &&\n      !lines[lines.length - 1].includes(':')\n    ) {\n      const file = lines.pop()!.trim()\n      files.unshift(file)\n    }\n\n    return files\n  }\n\n  return []\n}\n\nfunction getEditorLinks(content: string) {\n  const lines = content.split('\\n')\n  const file = getFile(lines)\n  const importTraceFiles = getImportTraceFiles(lines)\n\n  return { file, source: lines.join('\\n'), importTraceFiles }\n}\n\nexport const Terminal: React.FC<TerminalProps> = function Terminal({\n  content,\n}) {\n  const { file, source, importTraceFiles } = React.useMemo(\n    () => getEditorLinks(content),\n    [content]\n  )\n\n  const decoded = React.useMemo(() => {\n    return Anser.ansiToJson(source, {\n      json: true,\n      use_classes: true,\n      remove_empty: true,\n    })\n  }, [source])\n\n  return (\n    <div data-nextjs-terminal>\n      {file && (\n        <EditorLink\n          isSourceFile\n          key={file.fileName}\n          file={file.fileName}\n          location={file.location}\n        />\n      )}\n      <pre>\n        {decoded.map((entry, index) => (\n          <span\n            key={`terminal-entry-${index}`}\n            style={{\n              color: entry.fg ? `var(--color-${entry.fg})` : undefined,\n              ...(entry.decoration === 'bold'\n                ? { fontWeight: 800 }\n                : entry.decoration === 'italic'\n                  ? { fontStyle: 'italic' }\n                  : undefined),\n            }}\n          >\n            <HotlinkedText text={entry.content} />\n          </span>\n        ))}\n        {importTraceFiles.map((importTraceFile) => (\n          <EditorLink\n            isSourceFile={false}\n            key={importTraceFile}\n            file={importTraceFile}\n          />\n        ))}\n      </pre>\n    </div>\n  )\n}\n"],"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,WACnB;oCAAEE,WAAW;gCAAS,IACtBpC,SAAS;4BACjB;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"}

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Terminal/index.js

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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Terminal/index.js.map

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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Terminal/styles.js

@@ -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    line-break: anywhere;\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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Terminal/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/components/Terminal/styles.tsx"],"sourcesContent":["import { noop as css } from '../../helpers/noop-template'\n\nconst styles = css`\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    line-break: anywhere;\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`\n\nexport { styles }\n"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AAoDf,SAASC,MAAM,GAAE"}

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Toast/Toast.js

@@ -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, ...props } = param;
+    return /*#__PURE__*/ _jsx("div", {
+        ...props,
+        onClick: (e)=>{
+            e.preventDefault();
+            return onClick == null ? void 0 : onClick();
+        },
+        className: "nextjs-toast" + (className ? ' ' + className : ''),
+        children: /*#__PURE__*/ _jsx("div", {
+            "data-nextjs-toast-wrapper": true,
+            children: children
+        })
+    });
+};
+
+//# sourceMappingURL=Toast.js.map

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Toast/Toast.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/components/Toast/Toast.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport type ToastProps = React.HTMLProps<HTMLDivElement> & {\n  children?: React.ReactNode\n  onClick?: () => void\n  className?: string\n}\n\nexport const Toast: React.FC<ToastProps> = function Toast({\n  onClick,\n  children,\n  className,\n  ...props\n}) {\n  return (\n    <div\n      {...props}\n      onClick={(e) => {\n        e.preventDefault()\n        return onClick?.()\n      }}\n      className={`nextjs-toast${className ? ' ' + className : ''}`}\n    >\n      <div data-nextjs-toast-wrapper>{children}</div>\n    </div>\n  )\n}\n"],"names":["React","Toast","onClick","children","className","props","div","e","preventDefault","data-nextjs-toast-wrapper"],"mappings":";AAAA,YAAYA,WAAW,QAAO;AAQ9B,OAAO,MAAMC,QAA8B,SAASA,MAAM,KAKzD;IALyD,IAAA,EACxDC,OAAO,EACPC,QAAQ,EACRC,SAAS,EACT,GAAGC,OACJ,GALyD;IAMxD,qBACE,KAACC;QACE,GAAGD,KAAK;QACTH,SAAS,CAACK;YACRA,EAAEC,cAAc;YAChB,OAAON,2BAAAA;QACT;QACAE,WAAW,AAAC,iBAAcA,CAAAA,YAAY,MAAMA,YAAY,EAAC;kBAEzD,cAAA,KAACE;YAAIG,2BAAyB;sBAAEN;;;AAGtC,EAAC"}

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Toast/index.js

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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Toast/index.js.map

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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Toast/styles.js

@@ -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-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    box-shadow: 0px var(--size-gap-double) var(--size-gap-quad)\n      rgba(0, 0, 0, 0.25);\n  }\n\n  @media (max-width: 440px) {\n    .nextjs-toast {\n      max-width: 90vw;\n      left: 5vw;\n    }\n  }\n\n  .nextjs-toast-errors-parent {\n    padding: 16px;\n    border-radius: var(--size-gap-quad);\n    font-weight: 500;\n    color: var(--color-ansi-bright-white);\n    background-color: var(--color-ansi-red);\n  }\n\n  .nextjs-static-indicator-toast-wrapper {\n    width: 30px;\n    height: 30px;\n    overflow: hidden;\n    border: 0;\n    border-radius: var(--size-gap-triple);\n    background: var(--color-background);\n    color: var(--color-font);\n    transition: all 0.3s ease-in-out;\n    box-shadow:\n      inset 0 0 0 1px var(--color-border-shadow),\n      0 11px 40px 0 rgba(0, 0, 0, 0.25),\n      0 2px 10px 0 rgba(0, 0, 0, 0.12);\n  }\n\n  .nextjs-static-indicator-toast-wrapper:hover {\n    width: 140px;\n  }\n\n  .nextjs-static-indicator-toast-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 30px;\n    height: 30px;\n  }\n\n  .nextjs-static-indicator-toast-text {\n    font-size: 14px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    opacity: 0;\n    white-space: nowrap;\n    transition: opacity 0.3s ease-in-out;\n    line-height: 30px;\n    position: absolute;\n    left: 30px;\n    top: 0;\n  }\n\n  .nextjs-static-indicator-toast-wrapper:hover\n    .nextjs-static-indicator-toast-text {\n    opacity: 1;\n  }\n\n  .nextjs-static-indicator-toast-wrapper button {\n    color: var(--color-font);\n    opacity: 0.8;\n    background: none;\n    border: none;\n    margin-left: 6px;\n    margin-top: -2px;\n    outline: 0;\n  }\n\n  .nextjs-static-indicator-toast-wrapper button:focus {\n    opacity: 1;\n  }\n\n  .nextjs-static-indicator-toast-wrapper button > svg {\n    width: 16px;\n    height: 16px;\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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/Toast/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/components/Toast/styles.ts"],"sourcesContent":["import { noop as css } from '../../helpers/noop-template'\n\nconst styles = css`\n  .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    box-shadow: 0px var(--size-gap-double) var(--size-gap-quad)\n      rgba(0, 0, 0, 0.25);\n  }\n\n  @media (max-width: 440px) {\n    .nextjs-toast {\n      max-width: 90vw;\n      left: 5vw;\n    }\n  }\n\n  .nextjs-toast-errors-parent {\n    padding: 16px;\n    border-radius: var(--size-gap-quad);\n    font-weight: 500;\n    color: var(--color-ansi-bright-white);\n    background-color: var(--color-ansi-red);\n  }\n\n  .nextjs-static-indicator-toast-wrapper {\n    width: 30px;\n    height: 30px;\n    overflow: hidden;\n    border: 0;\n    border-radius: var(--size-gap-triple);\n    background: var(--color-background);\n    color: var(--color-font);\n    transition: all 0.3s ease-in-out;\n    box-shadow:\n      inset 0 0 0 1px var(--color-border-shadow),\n      0 11px 40px 0 rgba(0, 0, 0, 0.25),\n      0 2px 10px 0 rgba(0, 0, 0, 0.12);\n  }\n\n  .nextjs-static-indicator-toast-wrapper:hover {\n    width: 140px;\n  }\n\n  .nextjs-static-indicator-toast-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 30px;\n    height: 30px;\n  }\n\n  .nextjs-static-indicator-toast-text {\n    font-size: 14px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    opacity: 0;\n    white-space: nowrap;\n    transition: opacity 0.3s ease-in-out;\n    line-height: 30px;\n    position: absolute;\n    left: 30px;\n    top: 0;\n  }\n\n  .nextjs-static-indicator-toast-wrapper:hover\n    .nextjs-static-indicator-toast-text {\n    opacity: 1;\n  }\n\n  .nextjs-static-indicator-toast-wrapper button {\n    color: var(--color-font);\n    opacity: 0.8;\n    background: none;\n    border: none;\n    margin-left: 6px;\n    margin-top: -2px;\n    outline: 0;\n  }\n\n  .nextjs-static-indicator-toast-wrapper button:focus {\n    opacity: 1;\n  }\n\n  .nextjs-static-indicator-toast-wrapper button > svg {\n    width: 16px;\n    height: 16px;\n  }\n`\n\nexport { styles }\n"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AA4Ff,SAASC,MAAM,GAAE"}

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/VersionStalenessInfo/VersionStalenessInfo.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function VersionStalenessInfo(param) {
+    let { versionInfo } = param;
+    if (!versionInfo) return null;
+    const { staleness } = versionInfo;
+    let { text, indicatorClass, title } = getStaleness(versionInfo);
+    if (!text) return null;
+    return /*#__PURE__*/ _jsxs("span", {
+        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 ? ' (Turbopack)' : ''
+        ]
+    });
+}
+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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/VersionStalenessInfo/VersionStalenessInfo.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/components/VersionStalenessInfo/VersionStalenessInfo.tsx"],"sourcesContent":["import type { VersionInfo } from '../../../../../../../server/dev/parse-version-info'\n\nexport function VersionStalenessInfo({\n  versionInfo,\n}: {\n  versionInfo: VersionInfo | undefined\n}) {\n  if (!versionInfo) return null\n  const { staleness } = versionInfo\n  let { text, indicatorClass, title } = getStaleness(versionInfo)\n\n  if (!text) return null\n\n  return (\n    <span className=\"nextjs-container-build-error-version-status\">\n      <span className={indicatorClass} />\n      <small data-nextjs-version-checker title={title}>\n        {text}\n      </small>{' '}\n      {staleness === 'fresh' ||\n      staleness === 'newer-than-npm' ||\n      staleness === 'unknown' ? null : (\n        <a\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          href=\"https://nextjs.org/docs/messages/version-staleness\"\n        >\n          (learn more)\n        </a>\n      )}\n      {process.env.TURBOPACK ? ' (Turbopack)' : ''}\n    </span>\n  )\n}\n\nexport function getStaleness({ installed, staleness, expected }: VersionInfo) {\n  let text = ''\n  let title = ''\n  let indicatorClass = ''\n  const versionLabel = `Next.js (${installed})`\n  switch (staleness) {\n    case 'newer-than-npm':\n    case 'fresh':\n      text = versionLabel\n      title = `Latest available version is detected (${installed}).`\n      indicatorClass = 'fresh'\n      break\n    case 'stale-patch':\n    case 'stale-minor':\n      text = `${versionLabel} out of date`\n      title = `There is a newer version (${expected}) available, upgrade recommended! `\n      indicatorClass = 'stale'\n      break\n    case 'stale-major': {\n      text = `${versionLabel} is outdated`\n      title = `An outdated version detected (latest is ${expected}), upgrade is highly recommended!`\n      indicatorClass = 'outdated'\n      break\n    }\n    case 'stale-prerelease': {\n      text = `${versionLabel} is outdated`\n      title = `There is a newer canary version (${expected}) available, please upgrade! `\n      indicatorClass = 'stale'\n      break\n    }\n    case 'unknown':\n      break\n    default:\n      break\n  }\n  return { text, indicatorClass, title }\n}\n"],"names":["VersionStalenessInfo","versionInfo","staleness","text","indicatorClass","title","getStaleness","span","className","small","data-nextjs-version-checker","a","target","rel","href","process","env","TURBOPACK","installed","expected","versionLabel"],"mappings":";AAEA,OAAO,SAASA,qBAAqB,KAIpC;IAJoC,IAAA,EACnCC,WAAW,EAGZ,GAJoC;IAKnC,IAAI,CAACA,aAAa,OAAO;IACzB,MAAM,EAAEC,SAAS,EAAE,GAAGD;IACtB,IAAI,EAAEE,IAAI,EAAEC,cAAc,EAAEC,KAAK,EAAE,GAAGC,aAAaL;IAEnD,IAAI,CAACE,MAAM,OAAO;IAElB,qBACE,MAACI;QAAKC,WAAU;;0BACd,KAACD;gBAAKC,WAAWJ;;0BACjB,KAACK;gBAAMC,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,iBAAiB;;;AAGhD;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"}

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/VersionStalenessInfo/index.js

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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/VersionStalenessInfo/index.js.map

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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/VersionStalenessInfo/styles.js

@@ -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    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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/VersionStalenessInfo/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/components/VersionStalenessInfo/styles.ts"],"sourcesContent":["import { noop as css } from '../../helpers/noop-template'\n\nconst styles = css`\n  .nextjs-container-build-error-version-status {\n    flex: 1;\n    text-align: right;\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`\n\nexport { styles }\n"],"names":["noop","css","styles"],"mappings":";;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,8BAA6B;AAEzD,MAAMC,SAASD;AAwBf,SAASC,MAAM,GAAE"}

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/copy-button/index.js

@@ -0,0 +1,213 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+function useCopyLegacy(content) {
+    // This would be simpler with useActionState but we need to support React 18 here.
+    // React 18 also doesn't have async transitions.
+    const [copyState, dispatch] = React.useReducer((state, action)=>{
+        if (action.type === 'reset') {
+            return {
+                state: 'initial'
+            };
+        }
+        if (action.type === 'copied') {
+            return {
+                state: 'success'
+            };
+        }
+        if (action.type === 'copying') {
+            return {
+                state: 'pending'
+            };
+        }
+        if (action.type === 'error') {
+            return {
+                state: 'error',
+                error: action.error
+            };
+        }
+        return state;
+    }, {
+        state: 'initial'
+    });
+    function copy() {
+        if (isPending) {
+            return;
+        }
+        if (!navigator.clipboard) {
+            dispatch({
+                type: 'error',
+                error: Object.defineProperty(new Error('Copy to clipboard is not supported in this browser'), "__NEXT_ERROR_CODE", {
+                    value: "E376",
+                    enumerable: false
+                })
+            });
+        } else {
+            dispatch({
+                type: 'copying'
+            });
+            navigator.clipboard.writeText(content).then(()=>{
+                dispatch({
+                    type: 'copied'
+                });
+            }, (error)=>{
+                dispatch({
+                    type: 'error',
+                    error
+                });
+            });
+        }
+    }
+    const reset = React.useCallback(()=>{
+        dispatch({
+            type: 'reset'
+        });
+    }, []);
+    const isPending = copyState.state === 'pending';
+    return [
+        copyState,
+        copy,
+        reset,
+        isPending
+    ];
+}
+function useCopyModern(content) {
+    const [copyState, dispatch, isPending] = React.useActionState((state, action)=>{
+        if (action === 'reset') {
+            return {
+                state: 'initial'
+            };
+        }
+        if (action === 'copy') {
+            if (!navigator.clipboard) {
+                return {
+                    state: 'error',
+                    error: Object.defineProperty(new Error('Copy to clipboard is not supported in this browser'), "__NEXT_ERROR_CODE", {
+                        value: "E376",
+                        enumerable: false
+                    })
+                };
+            }
+            return navigator.clipboard.writeText(content).then(()=>{
+                return {
+                    state: 'success'
+                };
+            }, (error)=>{
+                return {
+                    state: 'error',
+                    error
+                };
+            });
+        }
+        return state;
+    }, {
+        state: 'initial'
+    });
+    function copy() {
+        React.startTransition(()=>{
+            dispatch('copy');
+        });
+    }
+    const reset = React.useCallback(()=>{
+        dispatch('reset');
+    }, [
+        // TODO: `dispatch` from `useActionState` is not reactive.
+        // Remove from dependencies once https://github.com/facebook/react/pull/29665 is released.
+        dispatch
+    ]);
+    return [
+        copyState,
+        copy,
+        reset,
+        isPending
+    ];
+}
+const useCopy = typeof React.useActionState === 'function' ? useCopyModern : useCopyLegacy;
+export function CopyButton(param) {
+    let { actionLabel, successLabel, content, icon, disabled, ...props } = param;
+    const [copyState, copy, reset, isPending] = useCopy(content);
+    const error = copyState.state === 'error' ? copyState.error : null;
+    React.useEffect(()=>{
+        if (error !== null) {
+            // Additional console.error to get the stack.
+            console.error(error);
+        }
+    }, [
+        error
+    ]);
+    React.useEffect(()=>{
+        if (copyState.state === 'success') {
+            const timeoutId = setTimeout(()=>{
+                reset();
+            }, 2000);
+            return ()=>{
+                clearTimeout(timeoutId);
+            };
+        }
+    }, [
+        isPending,
+        copyState.state,
+        reset
+    ]);
+    const isDisabled = isPending || disabled;
+    const label = copyState.state === 'success' ? successLabel : actionLabel;
+    // Assign default icon
+    const renderedIcon = copyState.state === 'success' ? /*#__PURE__*/ _jsx(CopySuccessIcon, {}) : icon || /*#__PURE__*/ _jsx(CopyIcon, {});
+    return /*#__PURE__*/ _jsxs("button", {
+        ...props,
+        type: "button",
+        title: label,
+        "aria-label": label,
+        "aria-disabled": isDisabled,
+        "data-nextjs-data-runtime-error-copy-button": true,
+        className: "nextjs-data-runtime-error-copy-button nextjs-data-runtime-error-copy-button--" + copyState.state,
+        onClick: ()=>{
+            if (!isDisabled) {
+                copy();
+            }
+        },
+        children: [
+            renderedIcon,
+            copyState.state === 'error' ? " " + copyState.error : null
+        ]
+    });
+}
+function CopyIcon() {
+    return /*#__PURE__*/ _jsxs("svg", {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 24 24",
+        fill: "transparent",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        children: [
+            /*#__PURE__*/ _jsx("rect", {
+                width: "14",
+                height: "14",
+                x: "8",
+                y: "8",
+                rx: "2",
+                ry: "2"
+            }),
+            /*#__PURE__*/ _jsx("path", {
+                d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"
+            })
+        ]
+    });
+}
+function CopySuccessIcon() {
+    return /*#__PURE__*/ _jsx("svg", {
+        height: "16",
+        xlinkTitle: "copied",
+        viewBox: "0 0 16 16",
+        width: "16",
+        stroke: "currentColor",
+        fill: "currentColor",
+        children: /*#__PURE__*/ _jsx("path", {
+            d: "M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"
+        })
+    });
+}
+
+//# sourceMappingURL=index.js.map

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/copy-button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/components/copy-button/index.tsx"],"sourcesContent":["import * as React from 'react'\n\nfunction useCopyLegacy(content: string) {\n  type CopyState =\n    | {\n        state: 'initial'\n      }\n    | {\n        state: 'error'\n        error: unknown\n      }\n    | { state: 'success' }\n    | { state: 'pending' }\n\n  // This would be simpler with useActionState but we need to support React 18 here.\n  // React 18 also doesn't have async transitions.\n  const [copyState, dispatch] = React.useReducer(\n    (\n      state: CopyState,\n      action:\n        | { type: 'reset' | 'copied' | 'copying' }\n        | { type: 'error'; error: unknown }\n    ): CopyState => {\n      if (action.type === 'reset') {\n        return { state: 'initial' }\n      }\n      if (action.type === 'copied') {\n        return { state: 'success' }\n      }\n      if (action.type === 'copying') {\n        return { state: 'pending' }\n      }\n      if (action.type === 'error') {\n        return { state: 'error', error: action.error }\n      }\n      return state\n    },\n    {\n      state: 'initial',\n    }\n  )\n  function copy() {\n    if (isPending) {\n      return\n    }\n\n    if (!navigator.clipboard) {\n      dispatch({\n        type: 'error',\n        error: new Error('Copy to clipboard is not supported in this browser'),\n      })\n    } else {\n      dispatch({ type: 'copying' })\n      navigator.clipboard.writeText(content).then(\n        () => {\n          dispatch({ type: 'copied' })\n        },\n        (error) => {\n          dispatch({ type: 'error', error })\n        }\n      )\n    }\n  }\n  const reset = React.useCallback(() => {\n    dispatch({ type: 'reset' })\n  }, [])\n\n  const isPending = copyState.state === 'pending'\n\n  return [copyState, copy, reset, isPending] as const\n}\n\nfunction useCopyModern(content: string) {\n  type CopyState =\n    | {\n        state: 'initial'\n      }\n    | {\n        state: 'error'\n        error: unknown\n      }\n    | { state: 'success' }\n\n  const [copyState, dispatch, isPending] = React.useActionState(\n    (\n      state: CopyState,\n      action: 'reset' | 'copy'\n    ): CopyState | Promise<CopyState> => {\n      if (action === 'reset') {\n        return { state: 'initial' }\n      }\n      if (action === 'copy') {\n        if (!navigator.clipboard) {\n          return {\n            state: 'error',\n            error: new Error(\n              'Copy to clipboard is not supported in this browser'\n            ),\n          }\n        }\n        return navigator.clipboard.writeText(content).then(\n          () => {\n            return { state: 'success' }\n          },\n          (error) => {\n            return { state: 'error', error }\n          }\n        )\n      }\n      return state\n    },\n    {\n      state: 'initial',\n    }\n  )\n\n  function copy() {\n    React.startTransition(() => {\n      dispatch('copy')\n    })\n  }\n\n  const reset = React.useCallback(() => {\n    dispatch('reset')\n  }, [\n    // TODO: `dispatch` from `useActionState` is not reactive.\n    // Remove from dependencies once https://github.com/facebook/react/pull/29665 is released.\n    dispatch,\n  ])\n\n  return [copyState, copy, reset, isPending] as const\n}\n\nconst useCopy =\n  typeof React.useActionState === 'function' ? useCopyModern : useCopyLegacy\n\nexport function CopyButton({\n  actionLabel,\n  successLabel,\n  content,\n  icon,\n  disabled,\n  ...props\n}: React.HTMLProps<HTMLButtonElement> & {\n  actionLabel: string\n  successLabel: string\n  content: string\n  icon?: React.ReactNode\n}) {\n  const [copyState, copy, reset, isPending] = useCopy(content)\n\n  const error = copyState.state === 'error' ? copyState.error : null\n  React.useEffect(() => {\n    if (error !== null) {\n      // Additional console.error to get the stack.\n      console.error(error)\n    }\n  }, [error])\n  React.useEffect(() => {\n    if (copyState.state === 'success') {\n      const timeoutId = setTimeout(() => {\n        reset()\n      }, 2000)\n\n      return () => {\n        clearTimeout(timeoutId)\n      }\n    }\n  }, [isPending, copyState.state, reset])\n  const isDisabled = isPending || disabled\n  const label = copyState.state === 'success' ? successLabel : actionLabel\n\n  // Assign default icon\n  const renderedIcon =\n    copyState.state === 'success' ? <CopySuccessIcon /> : icon || <CopyIcon />\n\n  return (\n    <button\n      {...props}\n      type=\"button\"\n      title={label}\n      aria-label={label}\n      aria-disabled={isDisabled}\n      data-nextjs-data-runtime-error-copy-button\n      className={`nextjs-data-runtime-error-copy-button nextjs-data-runtime-error-copy-button--${copyState.state}`}\n      onClick={() => {\n        if (!isDisabled) {\n          copy()\n        }\n      }}\n    >\n      {renderedIcon}\n      {copyState.state === 'error' ? ` ${copyState.error}` : null}\n    </button>\n  )\n}\n\nfunction CopyIcon() {\n  return (\n    <svg\n      width=\"16\"\n      height=\"16\"\n      viewBox=\"0 0 24 24\"\n      fill=\"transparent\"\n      stroke=\"currentColor\"\n      strokeWidth=\"1.5\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <rect width=\"14\" height=\"14\" x=\"8\" y=\"8\" rx=\"2\" ry=\"2\" />\n      <path d=\"M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2\" />\n    </svg>\n  )\n}\n\nfunction CopySuccessIcon() {\n  return (\n    <svg\n      height=\"16\"\n      xlinkTitle=\"copied\"\n      viewBox=\"0 0 16 16\"\n      width=\"16\"\n      stroke=\"currentColor\"\n      fill=\"currentColor\"\n    >\n      <path d=\"M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z\" />\n    </svg>\n  )\n}\n"],"names":["React","useCopyLegacy","content","copyState","dispatch","useReducer","state","action","type","error","copy","isPending","navigator","clipboard","Error","writeText","then","reset","useCallback","useCopyModern","useActionState","startTransition","useCopy","CopyButton","actionLabel","successLabel","icon","disabled","props","useEffect","console","timeoutId","setTimeout","clearTimeout","isDisabled","label","renderedIcon","CopySuccessIcon","CopyIcon","button","title","aria-label","aria-disabled","data-nextjs-data-runtime-error-copy-button","className","onClick","svg","width","height","viewBox","fill","stroke","strokeWidth","strokeLinecap","strokeLinejoin","rect","x","y","rx","ry","path","d","xlinkTitle"],"mappings":"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"}

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/hot-linked-text/index.js

@@ -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

package/dist/esm/client/components/react-dev-overlay/_experimental/internal/components/hot-linked-text/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/_experimental/internal/components/hot-linked-text/index.tsx"],"sourcesContent":["import React from 'react'\nimport {\n  decodeMagicIdentifier,\n  MAGIC_IDENTIFIER_REGEX,\n} from '../../../../../../../shared/lib/magic-identifier'\n\nconst linkRegex = /https?:\\/\\/[^\\s/$.?#].[^\\s)'\"]*/i\n\nconst splitRegexp = new RegExp(`(${MAGIC_IDENTIFIER_REGEX.source}|\\\\s+)`)\n\nexport const HotlinkedText: React.FC<{\n  text: string\n  matcher?: (text: string) => boolean\n}> = function HotlinkedText(props) {\n  const { text, matcher } = props\n\n  const wordsAndWhitespaces = text.split(splitRegexp)\n\n  return (\n    <>\n      {wordsAndWhitespaces.map((word, index) => {\n        if (linkRegex.test(word)) {\n          const link = linkRegex.exec(word)!\n          const href = link[0]\n          // If link matcher is present but the link doesn't match, don't turn it into a link\n          if (typeof matcher === 'function' && !matcher(href)) {\n            return word\n          }\n          return (\n            <React.Fragment key={`link-${index}`}>\n              <a href={href} target=\"_blank\" rel=\"noreferrer noopener\">\n                {word}\n              </a>\n            </React.Fragment>\n          )\n        }\n        try {\n          const decodedWord = decodeMagicIdentifier(word)\n          if (decodedWord !== word) {\n            return (\n              <i key={`ident-${index}`}>\n                {'{'}\n                {decodedWord}\n                {'}'}\n              </i>\n            )\n          }\n        } catch (e) {\n          return (\n            <i key={`ident-${index}`}>\n              {'{'}\n              {word} (decoding failed: {'' + e}){'}'}\n            </i>\n          )\n        }\n        return <React.Fragment key={`text-${index}`}>{word}</React.Fragment>\n      })}\n    </>\n  )\n}\n"],"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,mDAAkD;AAEzD,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"}