next 15.2.0-canary.69 → 15.2.0-canary.70

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/dialog/dialog.js

@@ -1,16 +1,5 @@
-import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
-function _templateObject() {
-    const data = _tagged_template_literal_loose([
-        "\n  .error-overlay-dialog {\n    overflow-y: auto;\n    -webkit-font-smoothing: antialiased;\n    background: var(--color-background-100);\n    background-clip: padding-box;\n    border: 1px solid var(--color-gray-400);\n    border-radius: var(--next-dialog-radius);\n    box-shadow: var(--shadow-menu);\n    position: relative;\n\n    @media (prefers-color-scheme: dark) {\n      border-color: var(--color-gray-400);\n    }\n\n    &:has(\n        ~ [data-nextjs-error-overlay-nav] .error-overlay-notch[data-side='left']\n      ) {\n      border-top-left-radius: 0;\n    }\n\n    &:has(\n        ~ [data-nextjs-error-overlay-nav]\n          .error-overlay-notch[data-side='right']\n      ) {\n      border-top-right-radius: 0;\n    }\n  }\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Dialog } from '../../dialog/dialog';
-import { noop as css } from '../../../../utils/noop-template';
 export function ErrorOverlayDialog(param) {
     let { children, onClose, ...props } = param;
     return /*#__PURE__*/ _jsx(Dialog, {
@@ -23,6 +12,6 @@ export function ErrorOverlayDialog(param) {
         children: children
     });
 }
-export const DIALOG_STYLES = css(_templateObject());
+export const DIALOG_STYLES = "\n  .error-overlay-dialog {\n    overflow-y: auto;\n    -webkit-font-smoothing: antialiased;\n    background: var(--color-background-100);\n    background-clip: padding-box;\n    border: 1px solid var(--color-gray-400);\n    border-radius: var(--next-dialog-radius);\n    box-shadow: var(--shadow-menu);\n    position: relative;\n\n    @media (prefers-color-scheme: dark) {\n      border-color: var(--color-gray-400);\n    }\n\n    &:has(\n        ~ [data-nextjs-error-overlay-nav] .error-overlay-notch[data-side='left']\n      ) {\n      border-top-left-radius: 0;\n    }\n\n    &:has(\n        ~ [data-nextjs-error-overlay-nav]\n          .error-overlay-notch[data-side='right']\n      ) {\n      border-top-right-radius: 0;\n    }\n  }\n";
 
 //# sourceMappingURL=dialog.js.map

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/dialog/dialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/dialog/dialog.tsx"],"sourcesContent":["import { Dialog } from '../../dialog/dialog'\nimport { noop as css } from '../../../../utils/noop-template'\n\ntype ErrorOverlayDialogProps = {\n  children?: React.ReactNode\n  onClose?: () => void\n  dialogResizerRef?: React.RefObject<HTMLDivElement | null>\n}\n\nexport function ErrorOverlayDialog({\n  children,\n  onClose,\n  ...props\n}: ErrorOverlayDialogProps) {\n  return (\n    <Dialog\n      type=\"error\"\n      aria-labelledby=\"nextjs__container_errors_label\"\n      aria-describedby=\"nextjs__container_errors_desc\"\n      onClose={onClose}\n      className=\"error-overlay-dialog\"\n      {...props}\n    >\n      {children}\n    </Dialog>\n  )\n}\n\nexport const DIALOG_STYLES = css`\n  .error-overlay-dialog {\n    overflow-y: auto;\n    -webkit-font-smoothing: antialiased;\n    background: var(--color-background-100);\n    background-clip: padding-box;\n    border: 1px solid var(--color-gray-400);\n    border-radius: var(--next-dialog-radius);\n    box-shadow: var(--shadow-menu);\n    position: relative;\n\n    @media (prefers-color-scheme: dark) {\n      border-color: var(--color-gray-400);\n    }\n\n    &:has(\n        ~ [data-nextjs-error-overlay-nav] .error-overlay-notch[data-side='left']\n      ) {\n      border-top-left-radius: 0;\n    }\n\n    &:has(\n        ~ [data-nextjs-error-overlay-nav]\n          .error-overlay-notch[data-side='right']\n      ) {\n      border-top-right-radius: 0;\n    }\n  }\n`\n"],"names":["Dialog","noop","css","ErrorOverlayDialog","children","onClose","props","type","aria-labelledby","aria-describedby","className","DIALOG_STYLES"],"mappings":";;;;;;;;;;;AAAA,SAASA,MAAM,QAAQ,sBAAqB;AAC5C,SAASC,QAAQC,GAAG,QAAQ,kCAAiC;AAQ7D,OAAO,SAASC,mBAAmB,KAIT;IAJS,IAAA,EACjCC,QAAQ,EACRC,OAAO,EACP,GAAGC,OACqB,GAJS;IAKjC,qBACE,KAACN;QACCO,MAAK;QACLC,mBAAgB;QAChBC,oBAAiB;QACjBJ,SAASA;QACTK,WAAU;QACT,GAAGJ,KAAK;kBAERF;;AAGP;AAEA,OAAO,MAAMO,gBAAgBT,uBA4B5B"}
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/dialog/dialog.tsx"],"sourcesContent":["import { Dialog } from '../../dialog/dialog'\n\ntype ErrorOverlayDialogProps = {\n  children?: React.ReactNode\n  onClose?: () => void\n  dialogResizerRef?: React.RefObject<HTMLDivElement | null>\n}\n\nexport function ErrorOverlayDialog({\n  children,\n  onClose,\n  ...props\n}: ErrorOverlayDialogProps) {\n  return (\n    <Dialog\n      type=\"error\"\n      aria-labelledby=\"nextjs__container_errors_label\"\n      aria-describedby=\"nextjs__container_errors_desc\"\n      onClose={onClose}\n      className=\"error-overlay-dialog\"\n      {...props}\n    >\n      {children}\n    </Dialog>\n  )\n}\n\nexport const DIALOG_STYLES = `\n  .error-overlay-dialog {\n    overflow-y: auto;\n    -webkit-font-smoothing: antialiased;\n    background: var(--color-background-100);\n    background-clip: padding-box;\n    border: 1px solid var(--color-gray-400);\n    border-radius: var(--next-dialog-radius);\n    box-shadow: var(--shadow-menu);\n    position: relative;\n\n    @media (prefers-color-scheme: dark) {\n      border-color: var(--color-gray-400);\n    }\n\n    &:has(\n        ~ [data-nextjs-error-overlay-nav] .error-overlay-notch[data-side='left']\n      ) {\n      border-top-left-radius: 0;\n    }\n\n    &:has(\n        ~ [data-nextjs-error-overlay-nav]\n          .error-overlay-notch[data-side='right']\n      ) {\n      border-top-right-radius: 0;\n    }\n  }\n`\n"],"names":["Dialog","ErrorOverlayDialog","children","onClose","props","type","aria-labelledby","aria-describedby","className","DIALOG_STYLES"],"mappings":";AAAA,SAASA,MAAM,QAAQ,sBAAqB;AAQ5C,OAAO,SAASC,mBAAmB,KAIT;IAJS,IAAA,EACjCC,QAAQ,EACRC,OAAO,EACP,GAAGC,OACqB,GAJS;IAKjC,qBACE,KAACJ;QACCK,MAAK;QACLC,mBAAgB;QAChBC,oBAAiB;QACjBJ,SAASA;QACTK,WAAU;QACT,GAAGJ,KAAK;kBAERF;;AAGP;AAEA,OAAO,MAAMO,gBAAiB,uuBA4B7B"}

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/dialog/header.js

@@ -1,16 +1,5 @@
-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 {\n    position: relative;\n  }\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 > 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-header\n    > .nextjs-container-build-error-version-status {\n    position: absolute;\n    top: var(--size-4);\n    right: var(--size-4);\n  }\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx } from "react/jsx-runtime";
 import { DialogHeader } from '../../dialog/dialog-header';
-import { noop as css } from '../../../../utils/noop-template';
 export function ErrorOverlayDialogHeader(param) {
     let { children } = param;
     return /*#__PURE__*/ _jsx(DialogHeader, {
@@ -18,6 +7,6 @@ export function ErrorOverlayDialogHeader(param) {
         children: children
     });
 }
-export const DIALOG_HEADER_STYLES = css(_templateObject());
+export const DIALOG_HEADER_STYLES = "\n  .nextjs-container-errors-header {\n    position: relative;\n  }\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 > 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-header\n    > .nextjs-container-build-error-version-status {\n    position: absolute;\n    top: var(--size-4);\n    right: var(--size-4);\n  }\n";
 
 //# sourceMappingURL=header.js.map

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/dialog/header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/dialog/header.tsx"],"sourcesContent":["import { DialogHeader } from '../../dialog/dialog-header'\nimport { noop as css } from '../../../../utils/noop-template'\n\ntype ErrorOverlayDialogHeaderProps = {\n  children?: React.ReactNode\n}\n\nexport function ErrorOverlayDialogHeader({\n  children,\n}: ErrorOverlayDialogHeaderProps) {\n  return (\n    <DialogHeader className=\"nextjs-container-errors-header\">\n      {children}\n    </DialogHeader>\n  )\n}\n\nexport const DIALOG_HEADER_STYLES = css`\n  .nextjs-container-errors-header {\n    position: relative;\n  }\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 > 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-header\n    > .nextjs-container-build-error-version-status {\n    position: absolute;\n    top: var(--size-4);\n    right: var(--size-4);\n  }\n`\n"],"names":["DialogHeader","noop","css","ErrorOverlayDialogHeader","children","className","DIALOG_HEADER_STYLES"],"mappings":";;;;;;;;;;;AAAA,SAASA,YAAY,QAAQ,6BAA4B;AACzD,SAASC,QAAQC,GAAG,QAAQ,kCAAiC;AAM7D,OAAO,SAASC,yBAAyB,KAET;IAFS,IAAA,EACvCC,QAAQ,EACsB,GAFS;IAGvC,qBACE,KAACJ;QAAaK,WAAU;kBACrBD;;AAGP;AAEA,OAAO,MAAME,uBAAuBJ,uBAiCnC"}
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/dialog/header.tsx"],"sourcesContent":["import { DialogHeader } from '../../dialog/dialog-header'\n\ntype ErrorOverlayDialogHeaderProps = {\n  children?: React.ReactNode\n}\n\nexport function ErrorOverlayDialogHeader({\n  children,\n}: ErrorOverlayDialogHeaderProps) {\n  return (\n    <DialogHeader className=\"nextjs-container-errors-header\">\n      {children}\n    </DialogHeader>\n  )\n}\n\nexport const DIALOG_HEADER_STYLES = `\n  .nextjs-container-errors-header {\n    position: relative;\n  }\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 > 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-header\n    > .nextjs-container-build-error-version-status {\n    position: absolute;\n    top: var(--size-4);\n    right: var(--size-4);\n  }\n`\n"],"names":["DialogHeader","ErrorOverlayDialogHeader","children","className","DIALOG_HEADER_STYLES"],"mappings":";AAAA,SAASA,YAAY,QAAQ,6BAA4B;AAMzD,OAAO,SAASC,yBAAyB,KAET;IAFS,IAAA,EACvCC,QAAQ,EACsB,GAFS;IAGvC,qBACE,KAACF;QAAaG,WAAU;kBACrBD;;AAGP;AAEA,OAAO,MAAME,uBAAwB,27BAiCpC"}

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/environment-name-label/environment-name-label.js

@@ -1,15 +1,4 @@
-import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
-function _templateObject() {
-    const data = _tagged_template_literal_loose([
-        "\n  [data-nextjs-environment-name-label] {\n    padding: var(--size-0_5) var(--size-1_5);\n    margin: 0;\n    /* used --size instead of --rounded because --rounded is missing 6px */\n    border-radius: var(--size-1_5);\n    background: var(--color-gray-300);\n    font-weight: 600;\n    font-size: var(--size-font-11);\n    color: var(--color-gray-900);\n    font-family: var(--font-stack-monospace);\n    line-height: var(--size-5);\n  }\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx } from "react/jsx-runtime";
-import { noop as css } from '../../../../utils/noop-template';
 export function EnvironmentNameLabel(param) {
     let { environmentName } = param;
     return /*#__PURE__*/ _jsx("span", {
@@ -17,6 +6,6 @@ export function EnvironmentNameLabel(param) {
         children: environmentName
     });
 }
-export const ENVIRONMENT_NAME_LABEL_STYLES = css(_templateObject());
+export const ENVIRONMENT_NAME_LABEL_STYLES = "\n  [data-nextjs-environment-name-label] {\n    padding: var(--size-0_5) var(--size-1_5);\n    margin: 0;\n    /* used --size instead of --rounded because --rounded is missing 6px */\n    border-radius: var(--size-1_5);\n    background: var(--color-gray-300);\n    font-weight: 600;\n    font-size: var(--size-font-11);\n    color: var(--color-gray-900);\n    font-family: var(--font-stack-monospace);\n    line-height: var(--size-5);\n  }\n";
 
 //# sourceMappingURL=environment-name-label.js.map

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/environment-name-label/environment-name-label.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/environment-name-label/environment-name-label.tsx"],"sourcesContent":["import { noop as css } from '../../../../utils/noop-template'\n\nexport function EnvironmentNameLabel({\n  environmentName,\n}: {\n  environmentName: string\n}) {\n  return <span data-nextjs-environment-name-label>{environmentName}</span>\n}\n\nexport const ENVIRONMENT_NAME_LABEL_STYLES = css`\n  [data-nextjs-environment-name-label] {\n    padding: var(--size-0_5) var(--size-1_5);\n    margin: 0;\n    /* used --size instead of --rounded because --rounded is missing 6px */\n    border-radius: var(--size-1_5);\n    background: var(--color-gray-300);\n    font-weight: 600;\n    font-size: var(--size-font-11);\n    color: var(--color-gray-900);\n    font-family: var(--font-stack-monospace);\n    line-height: var(--size-5);\n  }\n`\n"],"names":["noop","css","EnvironmentNameLabel","environmentName","span","data-nextjs-environment-name-label","ENVIRONMENT_NAME_LABEL_STYLES"],"mappings":";;;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,kCAAiC;AAE7D,OAAO,SAASC,qBAAqB,KAIpC;IAJoC,IAAA,EACnCC,eAAe,EAGhB,GAJoC;IAKnC,qBAAO,KAACC;QAAKC,oCAAkC;kBAAEF;;AACnD;AAEA,OAAO,MAAMG,gCAAgCL,uBAa5C"}
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/environment-name-label/environment-name-label.tsx"],"sourcesContent":["export function EnvironmentNameLabel({\n  environmentName,\n}: {\n  environmentName: string\n}) {\n  return <span data-nextjs-environment-name-label>{environmentName}</span>\n}\n\nexport const ENVIRONMENT_NAME_LABEL_STYLES = `\n  [data-nextjs-environment-name-label] {\n    padding: var(--size-0_5) var(--size-1_5);\n    margin: 0;\n    /* used --size instead of --rounded because --rounded is missing 6px */\n    border-radius: var(--size-1_5);\n    background: var(--color-gray-300);\n    font-weight: 600;\n    font-size: var(--size-font-11);\n    color: var(--color-gray-900);\n    font-family: var(--font-stack-monospace);\n    line-height: var(--size-5);\n  }\n`\n"],"names":["EnvironmentNameLabel","environmentName","span","data-nextjs-environment-name-label","ENVIRONMENT_NAME_LABEL_STYLES"],"mappings":";AAAA,OAAO,SAASA,qBAAqB,KAIpC;IAJoC,IAAA,EACnCC,eAAe,EAGhB,GAJoC;IAKnC,qBAAO,KAACC;QAAKC,oCAAkC;kBAAEF;;AACnD;AAEA,OAAO,MAAMG,gCAAiC,4bAa7C"}

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-message/error-message.js

@@ -1,16 +1,5 @@
-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_wrapper {\n    position: relative;\n  }\n\n  .nextjs__container_errors_desc {\n    margin: 0;\n    margin-left: var(--size-1);\n    color: var(--color-red-900);\n    font-weight: 500;\n    font-size: var(--size-font);\n    letter-spacing: -0.32px;\n    line-height: var(--size-6);\n    overflow-wrap: break-word;\n    white-space: pre-wrap;\n  }\n\n  .nextjs__container_errors_desc.truncated {\n    max-height: 200px;\n    overflow: hidden;\n  }\n\n  .nextjs__container_errors_gradient_overlay {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 85px;\n    background: linear-gradient(\n      180deg,\n      rgba(250, 250, 250, 0) 0%,\n      var(--color-background-200) 100%\n    );\n  }\n\n  .nextjs__container_errors_expand_button {\n    position: absolute;\n    bottom: 10px;\n    left: 50%;\n    transform: translateX(-50%);\n    display: flex;\n    align-items: center;\n    padding: 6px 8px;\n    background: var(--color-background-100);\n    border: 1px solid var(--color-gray-alpha-400);\n    border-radius: 999px;\n    box-shadow:\n      0px 2px 2px var(--color-gray-alpha-100),\n      0px 8px 8px -8px var(--color-gray-alpha-100);\n    font-size: 13px;\n    cursor: pointer;\n    color: var(--color-gray-900);\n    font-weight: 500;\n  }\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useRef, useLayoutEffect } from 'react';
-import { noop as css } from '../../../../utils/noop-template';
 export function ErrorMessage(param) {
     let { errorMessage } = param;
     const [isExpanded, setIsExpanded] = useState(false);
@@ -49,6 +38,6 @@ export function ErrorMessage(param) {
         ]
     });
 }
-export const styles = css(_templateObject());
+export const styles = "\n  .nextjs__container_errors_wrapper {\n    position: relative;\n  }\n\n  .nextjs__container_errors_desc {\n    margin: 0;\n    margin-left: var(--size-1);\n    color: var(--color-red-900);\n    font-weight: 500;\n    font-size: var(--size-font);\n    letter-spacing: -0.32px;\n    line-height: var(--size-6);\n    overflow-wrap: break-word;\n    white-space: pre-wrap;\n  }\n\n  .nextjs__container_errors_desc.truncated {\n    max-height: 200px;\n    overflow: hidden;\n  }\n\n  .nextjs__container_errors_gradient_overlay {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 85px;\n    background: linear-gradient(\n      180deg,\n      rgba(250, 250, 250, 0) 0%,\n      var(--color-background-200) 100%\n    );\n  }\n\n  .nextjs__container_errors_expand_button {\n    position: absolute;\n    bottom: 10px;\n    left: 50%;\n    transform: translateX(-50%);\n    display: flex;\n    align-items: center;\n    padding: 6px 8px;\n    background: var(--color-background-100);\n    border: 1px solid var(--color-gray-alpha-400);\n    border-radius: 999px;\n    box-shadow:\n      0px 2px 2px var(--color-gray-alpha-100),\n      0px 8px 8px -8px var(--color-gray-alpha-100);\n    font-size: 13px;\n    cursor: pointer;\n    color: var(--color-gray-900);\n    font-weight: 500;\n  }\n";
 
 //# sourceMappingURL=error-message.js.map

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-message/error-message.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-message/error-message.tsx"],"sourcesContent":["import { useState, useRef, useLayoutEffect } from 'react'\nimport { noop as css } from '../../../../utils/noop-template'\n\nexport type ErrorMessageType = React.ReactNode\n\ntype ErrorMessageProps = {\n  errorMessage: ErrorMessageType\n}\n\nexport function ErrorMessage({ errorMessage }: ErrorMessageProps) {\n  const [isExpanded, setIsExpanded] = useState(false)\n  const [shouldTruncate, setShouldTruncate] = useState(false)\n  const messageRef = useRef<HTMLParagraphElement>(null)\n\n  useLayoutEffect(() => {\n    if (messageRef.current) {\n      setShouldTruncate(messageRef.current.scrollHeight > 200)\n    }\n  }, [errorMessage])\n\n  return (\n    <div className=\"nextjs__container_errors_wrapper\">\n      <p\n        ref={messageRef}\n        id=\"nextjs__container_errors_desc\"\n        className={`nextjs__container_errors_desc ${shouldTruncate && !isExpanded ? 'truncated' : ''}`}\n      >\n        {errorMessage}\n      </p>\n      {shouldTruncate && !isExpanded && (\n        <>\n          <div className=\"nextjs__container_errors_gradient_overlay\" />\n          <button\n            onClick={() => setIsExpanded(true)}\n            className=\"nextjs__container_errors_expand_button\"\n            aria-expanded={isExpanded}\n            aria-controls=\"nextjs__container_errors_desc\"\n          >\n            Show More\n          </button>\n        </>\n      )}\n    </div>\n  )\n}\n\nexport const styles = css`\n  .nextjs__container_errors_wrapper {\n    position: relative;\n  }\n\n  .nextjs__container_errors_desc {\n    margin: 0;\n    margin-left: var(--size-1);\n    color: var(--color-red-900);\n    font-weight: 500;\n    font-size: var(--size-font);\n    letter-spacing: -0.32px;\n    line-height: var(--size-6);\n    overflow-wrap: break-word;\n    white-space: pre-wrap;\n  }\n\n  .nextjs__container_errors_desc.truncated {\n    max-height: 200px;\n    overflow: hidden;\n  }\n\n  .nextjs__container_errors_gradient_overlay {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 85px;\n    background: linear-gradient(\n      180deg,\n      rgba(250, 250, 250, 0) 0%,\n      var(--color-background-200) 100%\n    );\n  }\n\n  .nextjs__container_errors_expand_button {\n    position: absolute;\n    bottom: 10px;\n    left: 50%;\n    transform: translateX(-50%);\n    display: flex;\n    align-items: center;\n    padding: 6px 8px;\n    background: var(--color-background-100);\n    border: 1px solid var(--color-gray-alpha-400);\n    border-radius: 999px;\n    box-shadow:\n      0px 2px 2px var(--color-gray-alpha-100),\n      0px 8px 8px -8px var(--color-gray-alpha-100);\n    font-size: 13px;\n    cursor: pointer;\n    color: var(--color-gray-900);\n    font-weight: 500;\n  }\n`\n"],"names":["useState","useRef","useLayoutEffect","noop","css","ErrorMessage","errorMessage","isExpanded","setIsExpanded","shouldTruncate","setShouldTruncate","messageRef","current","scrollHeight","div","className","p","ref","id","button","onClick","aria-expanded","aria-controls","styles"],"mappings":";;;;;;;;;;;AAAA,SAASA,QAAQ,EAAEC,MAAM,EAAEC,eAAe,QAAQ,QAAO;AACzD,SAASC,QAAQC,GAAG,QAAQ,kCAAiC;AAQ7D,OAAO,SAASC,aAAa,KAAmC;IAAnC,IAAA,EAAEC,YAAY,EAAqB,GAAnC;IAC3B,MAAM,CAACC,YAAYC,cAAc,GAAGR,SAAS;IAC7C,MAAM,CAACS,gBAAgBC,kBAAkB,GAAGV,SAAS;IACrD,MAAMW,aAAaV,OAA6B;IAEhDC,gBAAgB;QACd,IAAIS,WAAWC,OAAO,EAAE;YACtBF,kBAAkBC,WAAWC,OAAO,CAACC,YAAY,GAAG;QACtD;IACF,GAAG;QAACP;KAAa;IAEjB,qBACE,MAACQ;QAAIC,WAAU;;0BACb,KAACC;gBACCC,KAAKN;gBACLO,IAAG;gBACHH,WAAW,AAAC,mCAAgCN,CAAAA,kBAAkB,CAACF,aAAa,cAAc,EAAC;0BAE1FD;;YAEFG,kBAAkB,CAACF,4BAClB;;kCACE,KAACO;wBAAIC,WAAU;;kCACf,KAACI;wBACCC,SAAS,IAAMZ,cAAc;wBAC7BO,WAAU;wBACVM,iBAAed;wBACfe,iBAAc;kCACf;;;;;;AAOX;AAEA,OAAO,MAAMC,SAASnB,uBAsDrB"}
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-message/error-message.tsx"],"sourcesContent":["import { useState, useRef, useLayoutEffect } from 'react'\n\nexport type ErrorMessageType = React.ReactNode\n\ntype ErrorMessageProps = {\n  errorMessage: ErrorMessageType\n}\n\nexport function ErrorMessage({ errorMessage }: ErrorMessageProps) {\n  const [isExpanded, setIsExpanded] = useState(false)\n  const [shouldTruncate, setShouldTruncate] = useState(false)\n  const messageRef = useRef<HTMLParagraphElement>(null)\n\n  useLayoutEffect(() => {\n    if (messageRef.current) {\n      setShouldTruncate(messageRef.current.scrollHeight > 200)\n    }\n  }, [errorMessage])\n\n  return (\n    <div className=\"nextjs__container_errors_wrapper\">\n      <p\n        ref={messageRef}\n        id=\"nextjs__container_errors_desc\"\n        className={`nextjs__container_errors_desc ${shouldTruncate && !isExpanded ? 'truncated' : ''}`}\n      >\n        {errorMessage}\n      </p>\n      {shouldTruncate && !isExpanded && (\n        <>\n          <div className=\"nextjs__container_errors_gradient_overlay\" />\n          <button\n            onClick={() => setIsExpanded(true)}\n            className=\"nextjs__container_errors_expand_button\"\n            aria-expanded={isExpanded}\n            aria-controls=\"nextjs__container_errors_desc\"\n          >\n            Show More\n          </button>\n        </>\n      )}\n    </div>\n  )\n}\n\nexport const styles = `\n  .nextjs__container_errors_wrapper {\n    position: relative;\n  }\n\n  .nextjs__container_errors_desc {\n    margin: 0;\n    margin-left: var(--size-1);\n    color: var(--color-red-900);\n    font-weight: 500;\n    font-size: var(--size-font);\n    letter-spacing: -0.32px;\n    line-height: var(--size-6);\n    overflow-wrap: break-word;\n    white-space: pre-wrap;\n  }\n\n  .nextjs__container_errors_desc.truncated {\n    max-height: 200px;\n    overflow: hidden;\n  }\n\n  .nextjs__container_errors_gradient_overlay {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    height: 85px;\n    background: linear-gradient(\n      180deg,\n      rgba(250, 250, 250, 0) 0%,\n      var(--color-background-200) 100%\n    );\n  }\n\n  .nextjs__container_errors_expand_button {\n    position: absolute;\n    bottom: 10px;\n    left: 50%;\n    transform: translateX(-50%);\n    display: flex;\n    align-items: center;\n    padding: 6px 8px;\n    background: var(--color-background-100);\n    border: 1px solid var(--color-gray-alpha-400);\n    border-radius: 999px;\n    box-shadow:\n      0px 2px 2px var(--color-gray-alpha-100),\n      0px 8px 8px -8px var(--color-gray-alpha-100);\n    font-size: 13px;\n    cursor: pointer;\n    color: var(--color-gray-900);\n    font-weight: 500;\n  }\n`\n"],"names":["useState","useRef","useLayoutEffect","ErrorMessage","errorMessage","isExpanded","setIsExpanded","shouldTruncate","setShouldTruncate","messageRef","current","scrollHeight","div","className","p","ref","id","button","onClick","aria-expanded","aria-controls","styles"],"mappings":";AAAA,SAASA,QAAQ,EAAEC,MAAM,EAAEC,eAAe,QAAQ,QAAO;AAQzD,OAAO,SAASC,aAAa,KAAmC;IAAnC,IAAA,EAAEC,YAAY,EAAqB,GAAnC;IAC3B,MAAM,CAACC,YAAYC,cAAc,GAAGN,SAAS;IAC7C,MAAM,CAACO,gBAAgBC,kBAAkB,GAAGR,SAAS;IACrD,MAAMS,aAAaR,OAA6B;IAEhDC,gBAAgB;QACd,IAAIO,WAAWC,OAAO,EAAE;YACtBF,kBAAkBC,WAAWC,OAAO,CAACC,YAAY,GAAG;QACtD;IACF,GAAG;QAACP;KAAa;IAEjB,qBACE,MAACQ;QAAIC,WAAU;;0BACb,KAACC;gBACCC,KAAKN;gBACLO,IAAG;gBACHH,WAAW,AAAC,mCAAgCN,CAAAA,kBAAkB,CAACF,aAAa,cAAc,EAAC;0BAE1FD;;YAEFG,kBAAkB,CAACF,4BAClB;;kCACE,KAACO;wBAAIC,WAAU;;kCACf,KAACI;wBACCC,SAAS,IAAMZ,cAAc;wBAC7BO,WAAU;wBACVM,iBAAed;wBACfe,iBAAc;kCACf;;;;;;AAOX;AAEA,OAAO,MAAMC,SAAU,myCAsDtB"}

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-bottom-stack/index.js

@@ -1,15 +1,4 @@
-import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
-function _templateObject() {
-    const data = _tagged_template_literal_loose([
-        "\n  .layer {\n    width: 100%;\n    height: var(--stack-layer-height);\n    position: relative;\n    border: 1px solid var(--color-gray-400);\n    border-radius: var(--rounded-xl);\n    background: var(--color-background-200);\n    transition:\n      translate 350ms var(--timing-swift),\n      box-shadow 350ms var(--timing-swift);\n  }\n\n  .layer1 {\n    width: calc(100% - var(--size-6));\n  }\n\n  .layer2 {\n    width: calc(100% - var(--size-12));\n    z-index: -1;\n  }\n\n  .error-overlay-bottom-stack {\n    width: 100%;\n    position: absolute;\n    bottom: -1px;\n    height: 0;\n    overflow: visible;\n  }\n\n  .stack {\n    --stack-layer-height: 44px;\n    --stack-layer-height-half: calc(var(--stack-layer-height) / 2);\n    --stack-layer-trim: 13px;\n    --shadow: 0px 0.925px 0.925px 0px rgba(0, 0, 0, 0.02),\n      0px 3.7px 7.4px -3.7px rgba(0, 0, 0, 0.04),\n      0px 14.8px 22.2px -7.4px rgba(0, 0, 0, 0.06);\n\n    display: grid;\n    place-items: center center;\n    width: 100%;\n    position: fixed;\n    overflow: hidden;\n    z-index: -1;\n    max-width: var(--next-dialog-max-width);\n\n    .layer {\n      grid-area: 1 / 1;\n      /* Hide */\n      translate: 0 calc(var(--stack-layer-height) * -1);\n    }\n\n    &[data-stack-count='1'],\n    &[data-stack-count='2'] {\n      .layer1 {\n        translate: 0\n          calc(var(--stack-layer-height-half) * -1 - var(--stack-layer-trim));\n      }\n    }\n\n    &[data-stack-count='2'] {\n      .layer2 {\n        translate: 0 calc(var(--stack-layer-trim) * -1 * 2);\n      }\n    }\n\n    /* Only the bottom stack should have the shadow */\n    &[data-stack-count='1'] .layer1 {\n      box-shadow: var(--shadow);\n    }\n\n    &[data-stack-count='2'] {\n      .layer2 {\n        box-shadow: var(--shadow);\n      }\n    }\n  }\n\n  @media (prefers-color-scheme: dark) {\n    .layer {\n      border-color: var(--color-gray-400);\n    }\n  }\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { noop as css } from '../../../../utils/noop-template';
 export function ErrorOverlayBottomStack(param) {
     let { count, activeIdx } = param;
     let stackCount = '0';
@@ -44,6 +33,6 @@ export function ErrorOverlayBottomStack(param) {
         })
     });
 }
-export const styles = css(_templateObject());
+export const styles = "\n  .layer {\n    width: 100%;\n    height: var(--stack-layer-height);\n    position: relative;\n    border: 1px solid var(--color-gray-400);\n    border-radius: var(--rounded-xl);\n    background: var(--color-background-200);\n    transition:\n      translate 350ms var(--timing-swift),\n      box-shadow 350ms var(--timing-swift);\n  }\n\n  .layer1 {\n    width: calc(100% - var(--size-6));\n  }\n\n  .layer2 {\n    width: calc(100% - var(--size-12));\n    z-index: -1;\n  }\n\n  .error-overlay-bottom-stack {\n    width: 100%;\n    position: absolute;\n    bottom: -1px;\n    height: 0;\n    overflow: visible;\n  }\n\n  .stack {\n    --stack-layer-height: 44px;\n    --stack-layer-height-half: calc(var(--stack-layer-height) / 2);\n    --stack-layer-trim: 13px;\n    --shadow: 0px 0.925px 0.925px 0px rgba(0, 0, 0, 0.02),\n      0px 3.7px 7.4px -3.7px rgba(0, 0, 0, 0.04),\n      0px 14.8px 22.2px -7.4px rgba(0, 0, 0, 0.06);\n\n    display: grid;\n    place-items: center center;\n    width: 100%;\n    position: fixed;\n    overflow: hidden;\n    z-index: -1;\n    max-width: var(--next-dialog-max-width);\n\n    .layer {\n      grid-area: 1 / 1;\n      /* Hide */\n      translate: 0 calc(var(--stack-layer-height) * -1);\n    }\n\n    &[data-stack-count='1'],\n    &[data-stack-count='2'] {\n      .layer1 {\n        translate: 0\n          calc(var(--stack-layer-height-half) * -1 - var(--stack-layer-trim));\n      }\n    }\n\n    &[data-stack-count='2'] {\n      .layer2 {\n        translate: 0 calc(var(--stack-layer-trim) * -1 * 2);\n      }\n    }\n\n    /* Only the bottom stack should have the shadow */\n    &[data-stack-count='1'] .layer1 {\n      box-shadow: var(--shadow);\n    }\n\n    &[data-stack-count='2'] {\n      .layer2 {\n        box-shadow: var(--shadow);\n      }\n    }\n  }\n\n  @media (prefers-color-scheme: dark) {\n    .layer {\n      border-color: var(--color-gray-400);\n    }\n  }\n";
 
 //# sourceMappingURL=index.js.map

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-bottom-stack/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-bottom-stack/index.tsx"],"sourcesContent":["import { noop as css } from '../../../../utils/noop-template'\n\nexport function ErrorOverlayBottomStack({\n  count,\n  activeIdx,\n}: {\n  count: number\n  activeIdx: number\n}) {\n  let stackCount = '0'\n\n  if (count > 1) {\n    stackCount = '1'\n  }\n\n  if (count > 2) {\n    stackCount = '2'\n  }\n\n  if (activeIdx === 1) {\n    stackCount = '1'\n  }\n\n  if (activeIdx > 1) {\n    stackCount = '0'\n  }\n\n  return (\n    <div aria-hidden className=\"error-overlay-bottom-stack\">\n      <div className=\"stack\" data-stack-count={stackCount}>\n        <div className=\"layer layer1\">1</div>\n        <div className=\"layer layer2\">2</div>\n      </div>\n    </div>\n  )\n}\n\nexport const styles = css`\n  .layer {\n    width: 100%;\n    height: var(--stack-layer-height);\n    position: relative;\n    border: 1px solid var(--color-gray-400);\n    border-radius: var(--rounded-xl);\n    background: var(--color-background-200);\n    transition:\n      translate 350ms var(--timing-swift),\n      box-shadow 350ms var(--timing-swift);\n  }\n\n  .layer1 {\n    width: calc(100% - var(--size-6));\n  }\n\n  .layer2 {\n    width: calc(100% - var(--size-12));\n    z-index: -1;\n  }\n\n  .error-overlay-bottom-stack {\n    width: 100%;\n    position: absolute;\n    bottom: -1px;\n    height: 0;\n    overflow: visible;\n  }\n\n  .stack {\n    --stack-layer-height: 44px;\n    --stack-layer-height-half: calc(var(--stack-layer-height) / 2);\n    --stack-layer-trim: 13px;\n    --shadow: 0px 0.925px 0.925px 0px rgba(0, 0, 0, 0.02),\n      0px 3.7px 7.4px -3.7px rgba(0, 0, 0, 0.04),\n      0px 14.8px 22.2px -7.4px rgba(0, 0, 0, 0.06);\n\n    display: grid;\n    place-items: center center;\n    width: 100%;\n    position: fixed;\n    overflow: hidden;\n    z-index: -1;\n    max-width: var(--next-dialog-max-width);\n\n    .layer {\n      grid-area: 1 / 1;\n      /* Hide */\n      translate: 0 calc(var(--stack-layer-height) * -1);\n    }\n\n    &[data-stack-count='1'],\n    &[data-stack-count='2'] {\n      .layer1 {\n        translate: 0\n          calc(var(--stack-layer-height-half) * -1 - var(--stack-layer-trim));\n      }\n    }\n\n    &[data-stack-count='2'] {\n      .layer2 {\n        translate: 0 calc(var(--stack-layer-trim) * -1 * 2);\n      }\n    }\n\n    /* Only the bottom stack should have the shadow */\n    &[data-stack-count='1'] .layer1 {\n      box-shadow: var(--shadow);\n    }\n\n    &[data-stack-count='2'] {\n      .layer2 {\n        box-shadow: var(--shadow);\n      }\n    }\n  }\n\n  @media (prefers-color-scheme: dark) {\n    .layer {\n      border-color: var(--color-gray-400);\n    }\n  }\n`\n"],"names":["noop","css","ErrorOverlayBottomStack","count","activeIdx","stackCount","div","aria-hidden","className","data-stack-count","styles"],"mappings":";;;;;;;;;;;AAAA,SAASA,QAAQC,GAAG,QAAQ,kCAAiC;AAE7D,OAAO,SAASC,wBAAwB,KAMvC;IANuC,IAAA,EACtCC,KAAK,EACLC,SAAS,EAIV,GANuC;IAOtC,IAAIC,aAAa;IAEjB,IAAIF,QAAQ,GAAG;QACbE,aAAa;IACf;IAEA,IAAIF,QAAQ,GAAG;QACbE,aAAa;IACf;IAEA,IAAID,cAAc,GAAG;QACnBC,aAAa;IACf;IAEA,IAAID,YAAY,GAAG;QACjBC,aAAa;IACf;IAEA,qBACE,KAACC;QAAIC,aAAW;QAACC,WAAU;kBACzB,cAAA,MAACF;YAAIE,WAAU;YAAQC,oBAAkBJ;;8BACvC,KAACC;oBAAIE,WAAU;8BAAe;;8BAC9B,KAACF;oBAAIE,WAAU;8BAAe;;;;;AAItC;AAEA,OAAO,MAAME,SAAST,uBAmFrB"}
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-bottom-stack/index.tsx"],"sourcesContent":["export function ErrorOverlayBottomStack({\n  count,\n  activeIdx,\n}: {\n  count: number\n  activeIdx: number\n}) {\n  let stackCount = '0'\n\n  if (count > 1) {\n    stackCount = '1'\n  }\n\n  if (count > 2) {\n    stackCount = '2'\n  }\n\n  if (activeIdx === 1) {\n    stackCount = '1'\n  }\n\n  if (activeIdx > 1) {\n    stackCount = '0'\n  }\n\n  return (\n    <div aria-hidden className=\"error-overlay-bottom-stack\">\n      <div className=\"stack\" data-stack-count={stackCount}>\n        <div className=\"layer layer1\">1</div>\n        <div className=\"layer layer2\">2</div>\n      </div>\n    </div>\n  )\n}\n\nexport const styles = `\n  .layer {\n    width: 100%;\n    height: var(--stack-layer-height);\n    position: relative;\n    border: 1px solid var(--color-gray-400);\n    border-radius: var(--rounded-xl);\n    background: var(--color-background-200);\n    transition:\n      translate 350ms var(--timing-swift),\n      box-shadow 350ms var(--timing-swift);\n  }\n\n  .layer1 {\n    width: calc(100% - var(--size-6));\n  }\n\n  .layer2 {\n    width: calc(100% - var(--size-12));\n    z-index: -1;\n  }\n\n  .error-overlay-bottom-stack {\n    width: 100%;\n    position: absolute;\n    bottom: -1px;\n    height: 0;\n    overflow: visible;\n  }\n\n  .stack {\n    --stack-layer-height: 44px;\n    --stack-layer-height-half: calc(var(--stack-layer-height) / 2);\n    --stack-layer-trim: 13px;\n    --shadow: 0px 0.925px 0.925px 0px rgba(0, 0, 0, 0.02),\n      0px 3.7px 7.4px -3.7px rgba(0, 0, 0, 0.04),\n      0px 14.8px 22.2px -7.4px rgba(0, 0, 0, 0.06);\n\n    display: grid;\n    place-items: center center;\n    width: 100%;\n    position: fixed;\n    overflow: hidden;\n    z-index: -1;\n    max-width: var(--next-dialog-max-width);\n\n    .layer {\n      grid-area: 1 / 1;\n      /* Hide */\n      translate: 0 calc(var(--stack-layer-height) * -1);\n    }\n\n    &[data-stack-count='1'],\n    &[data-stack-count='2'] {\n      .layer1 {\n        translate: 0\n          calc(var(--stack-layer-height-half) * -1 - var(--stack-layer-trim));\n      }\n    }\n\n    &[data-stack-count='2'] {\n      .layer2 {\n        translate: 0 calc(var(--stack-layer-trim) * -1 * 2);\n      }\n    }\n\n    /* Only the bottom stack should have the shadow */\n    &[data-stack-count='1'] .layer1 {\n      box-shadow: var(--shadow);\n    }\n\n    &[data-stack-count='2'] {\n      .layer2 {\n        box-shadow: var(--shadow);\n      }\n    }\n  }\n\n  @media (prefers-color-scheme: dark) {\n    .layer {\n      border-color: var(--color-gray-400);\n    }\n  }\n`\n"],"names":["ErrorOverlayBottomStack","count","activeIdx","stackCount","div","aria-hidden","className","data-stack-count","styles"],"mappings":";AAAA,OAAO,SAASA,wBAAwB,KAMvC;IANuC,IAAA,EACtCC,KAAK,EACLC,SAAS,EAIV,GANuC;IAOtC,IAAIC,aAAa;IAEjB,IAAIF,QAAQ,GAAG;QACbE,aAAa;IACf;IAEA,IAAIF,QAAQ,GAAG;QACbE,aAAa;IACf;IAEA,IAAID,cAAc,GAAG;QACnBC,aAAa;IACf;IAEA,IAAID,YAAY,GAAG;QACjBC,aAAa;IACf;IAEA,qBACE,KAACC;QAAIC,aAAW;QAACC,WAAU;kBACzB,cAAA,MAACF;YAAIE,WAAU;YAAQC,oBAAkBJ;;8BACvC,KAACC;oBAAIE,WAAU;8BAAe;;8BAC9B,KAACF;oBAAIE,WAAU;8BAAe;;;;;AAItC;AAEA,OAAO,MAAME,SAAU,o4DAmFtB"}

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.js

@@ -1,18 +1,7 @@
-import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
-function _templateObject() {
-    const data = _tagged_template_literal_loose([
-        "\n  .error-feedback {\n    display: flex;\n    align-items: center;\n    gap: var(--size-gap);\n    white-space: nowrap;\n    color: var(--color-gray-900);\n  }\n\n  .error-feedback-thanks {\n    height: 24px;\n    display: flex;\n    align-items: center;\n    padding-right: 4px; /* To match the 4px inner padding of the thumbs up and down icons */\n  }\n\n  .feedback-button {\n    background: none;\n    border: none;\n    border-radius: var(--rounded-md);\n    width: 24px;\n    height: 24px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n\n    &:focus {\n      outline: var(--focus-ring);\n    }\n\n    &:hover {\n      background: var(--color-gray-alpha-100);\n    }\n\n    &:active {\n      background: var(--color-gray-alpha-200);\n    }\n  }\n\n  .feedback-button:disabled {\n    opacity: 0.7;\n    cursor: not-allowed;\n  }\n\n  .feedback-button.voted {\n    background: var(--color-gray-alpha-200);\n  }\n\n  .thumbs-up-icon,\n  .thumbs-down-icon {\n    color: var(--color-gray-900);\n  }\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState, useCallback } from 'react';
 import { ThumbsUp } from '../../../../icons/thumbs/thumbs-up';
 import { ThumbsDown } from '../../../../icons/thumbs/thumbs-down';
-import { noop as css } from '../../../../../utils/noop-template';
 import { cx } from '../../../../utils/cx';
 export function ErrorFeedback(param) {
     let { errorCode, className } = param;
@@ -80,6 +69,6 @@ export function ErrorFeedback(param) {
         })
     });
 }
-export const styles = css(_templateObject());
+export const styles = "\n  .error-feedback {\n    display: flex;\n    align-items: center;\n    gap: var(--size-gap);\n    white-space: nowrap;\n    color: var(--color-gray-900);\n  }\n\n  .error-feedback-thanks {\n    height: 24px;\n    display: flex;\n    align-items: center;\n    padding-right: 4px; /* To match the 4px inner padding of the thumbs up and down icons */\n  }\n\n  .feedback-button {\n    background: none;\n    border: none;\n    border-radius: var(--rounded-md);\n    width: 24px;\n    height: 24px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n\n    &:focus {\n      outline: var(--focus-ring);\n    }\n\n    &:hover {\n      background: var(--color-gray-alpha-100);\n    }\n\n    &:active {\n      background: var(--color-gray-alpha-200);\n    }\n  }\n\n  .feedback-button:disabled {\n    opacity: 0.7;\n    cursor: not-allowed;\n  }\n\n  .feedback-button.voted {\n    background: var(--color-gray-alpha-200);\n  }\n\n  .thumbs-up-icon,\n  .thumbs-down-icon {\n    color: var(--color-gray-900);\n  }\n";
 
 //# sourceMappingURL=error-feedback.js.map

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx"],"sourcesContent":["import { useState, useCallback } from 'react'\nimport { ThumbsUp } from '../../../../icons/thumbs/thumbs-up'\nimport { ThumbsDown } from '../../../../icons/thumbs/thumbs-down'\nimport { noop as css } from '../../../../../utils/noop-template'\nimport { cx } from '../../../../utils/cx'\n\ninterface ErrorFeedbackProps {\n  errorCode: string\n  className?: string\n}\nexport function ErrorFeedback({ errorCode, className }: ErrorFeedbackProps) {\n  const [votedMap, setVotedMap] = useState<Record<string, boolean>>({})\n  const voted = votedMap[errorCode]\n  const hasVoted = voted !== undefined\n\n  const handleFeedback = useCallback(\n    async (wasHelpful: boolean) => {\n      // Optimistically set feedback state without loading/error states to keep implementation simple\n      setVotedMap((prev) => ({\n        ...prev,\n        [errorCode]: wasHelpful,\n      }))\n\n      try {\n        const response = await fetch(\n          `${process.env.__NEXT_ROUTER_BASEPATH || ''}/__nextjs_error_feedback?${new URLSearchParams(\n            {\n              errorCode,\n              wasHelpful: wasHelpful.toString(),\n            }\n          )}`\n        )\n\n        if (!response.ok) {\n          // Handle non-2xx HTTP responses here if needed\n          console.error('Failed to record feedback on the server.')\n        }\n      } catch (error) {\n        console.error('Failed to record feedback:', error)\n      }\n    },\n    [errorCode]\n  )\n\n  return (\n    <div\n      className={cx('error-feedback', className)}\n      role=\"region\"\n      aria-label=\"Error feedback\"\n    >\n      {hasVoted ? (\n        <p className=\"error-feedback-thanks\" role=\"status\" aria-live=\"polite\">\n          Thanks for your feedback!\n        </p>\n      ) : (\n        <>\n          <p>Was this helpful?</p>\n          <button\n            aria-label=\"Mark as helpful\"\n            onClick={() => handleFeedback(true)}\n            className={cx('feedback-button', voted === true && 'voted')}\n            type=\"button\"\n          >\n            <ThumbsUp aria-hidden=\"true\" />\n          </button>\n          <button\n            aria-label=\"Mark as not helpful\"\n            onClick={() => handleFeedback(false)}\n            className={cx('feedback-button', voted === false && 'voted')}\n            type=\"button\"\n          >\n            <ThumbsDown\n              aria-hidden=\"true\"\n              // Optical alignment\n              style={{\n                translate: '1px 1px',\n              }}\n            />\n          </button>\n        </>\n      )}\n    </div>\n  )\n}\n\nexport const styles = css`\n  .error-feedback {\n    display: flex;\n    align-items: center;\n    gap: var(--size-gap);\n    white-space: nowrap;\n    color: var(--color-gray-900);\n  }\n\n  .error-feedback-thanks {\n    height: 24px;\n    display: flex;\n    align-items: center;\n    padding-right: 4px; /* To match the 4px inner padding of the thumbs up and down icons */\n  }\n\n  .feedback-button {\n    background: none;\n    border: none;\n    border-radius: var(--rounded-md);\n    width: 24px;\n    height: 24px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n\n    &:focus {\n      outline: var(--focus-ring);\n    }\n\n    &:hover {\n      background: var(--color-gray-alpha-100);\n    }\n\n    &:active {\n      background: var(--color-gray-alpha-200);\n    }\n  }\n\n  .feedback-button:disabled {\n    opacity: 0.7;\n    cursor: not-allowed;\n  }\n\n  .feedback-button.voted {\n    background: var(--color-gray-alpha-200);\n  }\n\n  .thumbs-up-icon,\n  .thumbs-down-icon {\n    color: var(--color-gray-900);\n  }\n`\n"],"names":["useState","useCallback","ThumbsUp","ThumbsDown","noop","css","cx","ErrorFeedback","errorCode","className","votedMap","setVotedMap","voted","hasVoted","undefined","handleFeedback","wasHelpful","prev","response","fetch","process","env","__NEXT_ROUTER_BASEPATH","URLSearchParams","toString","ok","console","error","div","role","aria-label","p","aria-live","button","onClick","type","aria-hidden","style","translate","styles"],"mappings":";;;;;;;;;;;AAAA,SAASA,QAAQ,EAAEC,WAAW,QAAQ,QAAO;AAC7C,SAASC,QAAQ,QAAQ,qCAAoC;AAC7D,SAASC,UAAU,QAAQ,uCAAsC;AACjE,SAASC,QAAQC,GAAG,QAAQ,qCAAoC;AAChE,SAASC,EAAE,QAAQ,uBAAsB;AAMzC,OAAO,SAASC,cAAc,KAA4C;IAA5C,IAAA,EAAEC,SAAS,EAAEC,SAAS,EAAsB,GAA5C;IAC5B,MAAM,CAACC,UAAUC,YAAY,GAAGX,SAAkC,CAAC;IACnE,MAAMY,QAAQF,QAAQ,CAACF,UAAU;IACjC,MAAMK,WAAWD,UAAUE;IAE3B,MAAMC,iBAAiBd,YACrB,OAAOe;QACL,+FAA+F;QAC/FL,YAAY,CAACM,OAAU,CAAA;gBACrB,GAAGA,IAAI;gBACP,CAACT,UAAU,EAAEQ;YACf,CAAA;QAEA,IAAI;YACF,MAAME,WAAW,MAAMC,MACrB,AAAGC,CAAAA,QAAQC,GAAG,CAACC,sBAAsB,IAAI,EAAC,IAAE,8BAA2B,IAAIC,gBACzE;gBACEf;gBACAQ,YAAYA,WAAWQ,QAAQ;YACjC;YAIJ,IAAI,CAACN,SAASO,EAAE,EAAE;gBAChB,+CAA+C;gBAC/CC,QAAQC,KAAK,CAAC;YAChB;QACF,EAAE,OAAOA,OAAO;YACdD,QAAQC,KAAK,CAAC,8BAA8BA;QAC9C;IACF,GACA;QAACnB;KAAU;IAGb,qBACE,KAACoB;QACCnB,WAAWH,GAAG,kBAAkBG;QAChCoB,MAAK;QACLC,cAAW;kBAEVjB,yBACC,KAACkB;YAAEtB,WAAU;YAAwBoB,MAAK;YAASG,aAAU;sBAAS;2BAItE;;8BACE,KAACD;8BAAE;;8BACH,KAACE;oBACCH,cAAW;oBACXI,SAAS,IAAMnB,eAAe;oBAC9BN,WAAWH,GAAG,mBAAmBM,UAAU,QAAQ;oBACnDuB,MAAK;8BAEL,cAAA,KAACjC;wBAASkC,eAAY;;;8BAExB,KAACH;oBACCH,cAAW;oBACXI,SAAS,IAAMnB,eAAe;oBAC9BN,WAAWH,GAAG,mBAAmBM,UAAU,SAAS;oBACpDuB,MAAK;8BAEL,cAAA,KAAChC;wBACCiC,eAAY;wBACZ,oBAAoB;wBACpBC,OAAO;4BACLC,WAAW;wBACb;;;;;;AAOd;AAEA,OAAO,MAAMC,SAASlC,uBAqDrB"}
+{"version":3,"sources":["../../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-feedback/error-feedback.tsx"],"sourcesContent":["import { useState, useCallback } from 'react'\nimport { ThumbsUp } from '../../../../icons/thumbs/thumbs-up'\nimport { ThumbsDown } from '../../../../icons/thumbs/thumbs-down'\nimport { cx } from '../../../../utils/cx'\n\ninterface ErrorFeedbackProps {\n  errorCode: string\n  className?: string\n}\nexport function ErrorFeedback({ errorCode, className }: ErrorFeedbackProps) {\n  const [votedMap, setVotedMap] = useState<Record<string, boolean>>({})\n  const voted = votedMap[errorCode]\n  const hasVoted = voted !== undefined\n\n  const handleFeedback = useCallback(\n    async (wasHelpful: boolean) => {\n      // Optimistically set feedback state without loading/error states to keep implementation simple\n      setVotedMap((prev) => ({\n        ...prev,\n        [errorCode]: wasHelpful,\n      }))\n\n      try {\n        const response = await fetch(\n          `${process.env.__NEXT_ROUTER_BASEPATH || ''}/__nextjs_error_feedback?${new URLSearchParams(\n            {\n              errorCode,\n              wasHelpful: wasHelpful.toString(),\n            }\n          )}`\n        )\n\n        if (!response.ok) {\n          // Handle non-2xx HTTP responses here if needed\n          console.error('Failed to record feedback on the server.')\n        }\n      } catch (error) {\n        console.error('Failed to record feedback:', error)\n      }\n    },\n    [errorCode]\n  )\n\n  return (\n    <div\n      className={cx('error-feedback', className)}\n      role=\"region\"\n      aria-label=\"Error feedback\"\n    >\n      {hasVoted ? (\n        <p className=\"error-feedback-thanks\" role=\"status\" aria-live=\"polite\">\n          Thanks for your feedback!\n        </p>\n      ) : (\n        <>\n          <p>Was this helpful?</p>\n          <button\n            aria-label=\"Mark as helpful\"\n            onClick={() => handleFeedback(true)}\n            className={cx('feedback-button', voted === true && 'voted')}\n            type=\"button\"\n          >\n            <ThumbsUp aria-hidden=\"true\" />\n          </button>\n          <button\n            aria-label=\"Mark as not helpful\"\n            onClick={() => handleFeedback(false)}\n            className={cx('feedback-button', voted === false && 'voted')}\n            type=\"button\"\n          >\n            <ThumbsDown\n              aria-hidden=\"true\"\n              // Optical alignment\n              style={{\n                translate: '1px 1px',\n              }}\n            />\n          </button>\n        </>\n      )}\n    </div>\n  )\n}\n\nexport const styles = `\n  .error-feedback {\n    display: flex;\n    align-items: center;\n    gap: var(--size-gap);\n    white-space: nowrap;\n    color: var(--color-gray-900);\n  }\n\n  .error-feedback-thanks {\n    height: 24px;\n    display: flex;\n    align-items: center;\n    padding-right: 4px; /* To match the 4px inner padding of the thumbs up and down icons */\n  }\n\n  .feedback-button {\n    background: none;\n    border: none;\n    border-radius: var(--rounded-md);\n    width: 24px;\n    height: 24px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n\n    &:focus {\n      outline: var(--focus-ring);\n    }\n\n    &:hover {\n      background: var(--color-gray-alpha-100);\n    }\n\n    &:active {\n      background: var(--color-gray-alpha-200);\n    }\n  }\n\n  .feedback-button:disabled {\n    opacity: 0.7;\n    cursor: not-allowed;\n  }\n\n  .feedback-button.voted {\n    background: var(--color-gray-alpha-200);\n  }\n\n  .thumbs-up-icon,\n  .thumbs-down-icon {\n    color: var(--color-gray-900);\n  }\n`\n"],"names":["useState","useCallback","ThumbsUp","ThumbsDown","cx","ErrorFeedback","errorCode","className","votedMap","setVotedMap","voted","hasVoted","undefined","handleFeedback","wasHelpful","prev","response","fetch","process","env","__NEXT_ROUTER_BASEPATH","URLSearchParams","toString","ok","console","error","div","role","aria-label","p","aria-live","button","onClick","type","aria-hidden","style","translate","styles"],"mappings":";AAAA,SAASA,QAAQ,EAAEC,WAAW,QAAQ,QAAO;AAC7C,SAASC,QAAQ,QAAQ,qCAAoC;AAC7D,SAASC,UAAU,QAAQ,uCAAsC;AACjE,SAASC,EAAE,QAAQ,uBAAsB;AAMzC,OAAO,SAASC,cAAc,KAA4C;IAA5C,IAAA,EAAEC,SAAS,EAAEC,SAAS,EAAsB,GAA5C;IAC5B,MAAM,CAACC,UAAUC,YAAY,GAAGT,SAAkC,CAAC;IACnE,MAAMU,QAAQF,QAAQ,CAACF,UAAU;IACjC,MAAMK,WAAWD,UAAUE;IAE3B,MAAMC,iBAAiBZ,YACrB,OAAOa;QACL,+FAA+F;QAC/FL,YAAY,CAACM,OAAU,CAAA;gBACrB,GAAGA,IAAI;gBACP,CAACT,UAAU,EAAEQ;YACf,CAAA;QAEA,IAAI;YACF,MAAME,WAAW,MAAMC,MACrB,AAAGC,CAAAA,QAAQC,GAAG,CAACC,sBAAsB,IAAI,EAAC,IAAE,8BAA2B,IAAIC,gBACzE;gBACEf;gBACAQ,YAAYA,WAAWQ,QAAQ;YACjC;YAIJ,IAAI,CAACN,SAASO,EAAE,EAAE;gBAChB,+CAA+C;gBAC/CC,QAAQC,KAAK,CAAC;YAChB;QACF,EAAE,OAAOA,OAAO;YACdD,QAAQC,KAAK,CAAC,8BAA8BA;QAC9C;IACF,GACA;QAACnB;KAAU;IAGb,qBACE,KAACoB;QACCnB,WAAWH,GAAG,kBAAkBG;QAChCoB,MAAK;QACLC,cAAW;kBAEVjB,yBACC,KAACkB;YAAEtB,WAAU;YAAwBoB,MAAK;YAASG,aAAU;sBAAS;2BAItE;;8BACE,KAACD;8BAAE;;8BACH,KAACE;oBACCH,cAAW;oBACXI,SAAS,IAAMnB,eAAe;oBAC9BN,WAAWH,GAAG,mBAAmBM,UAAU,QAAQ;oBACnDuB,MAAK;8BAEL,cAAA,KAAC/B;wBAASgC,eAAY;;;8BAExB,KAACH;oBACCH,cAAW;oBACXI,SAAS,IAAMnB,eAAe;oBAC9BN,WAAWH,GAAG,mBAAmBM,UAAU,SAAS;oBACpDuB,MAAK;8BAEL,cAAA,KAAC9B;wBACC+B,eAAY;wBACZ,oBAAoB;wBACpBC,OAAO;4BACLC,WAAW;wBACb;;;;;;AAOd;AAEA,OAAO,MAAMC,SAAU,iiCAqDtB"}

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-overlay-footer.js

@@ -1,18 +1,6 @@
-import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
-function _templateObject() {
-    const data = _tagged_template_literal_loose([
-        "\n  .error-overlay-footer {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n\n    gap: var(--size-gap);\n    padding: var(--size-3);\n    background: var(--color-background-200);\n    border-top: 1px solid var(--color-gray-400);\n  }\n\n  .error-feedback {\n    margin-left: auto;\n\n    p {\n      font-size: 14px;\n      font-weight: 500;\n      margin: 0;\n    }\n  }\n\n  .error-overlay-footer-message {\n    color: var(--color-gray-900);\n    margin: 0;\n    font-size: 14px;\n    font-weight: 400;\n    line-height: var(--size-font-big);\n  }\n\n  ",
-        "\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ErrorFeedback } from './error-feedback/error-feedback';
 import { styles as feedbackStyles } from './error-feedback/error-feedback';
-import { noop as css } from '../../../../utils/noop-template';
 export function ErrorOverlayFooter(param) {
     let { errorCode, footerMessage } = param;
     return /*#__PURE__*/ _jsxs("footer", {
@@ -29,6 +17,6 @@ export function ErrorOverlayFooter(param) {
         ]
     });
 }
-export const styles = css(_templateObject(), feedbackStyles);
+export const styles = "\n  .error-overlay-footer {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n\n    gap: var(--size-gap);\n    padding: var(--size-3);\n    background: var(--color-background-200);\n    border-top: 1px solid var(--color-gray-400);\n  }\n\n  .error-feedback {\n    margin-left: auto;\n\n    p {\n      font-size: 14px;\n      font-weight: 500;\n      margin: 0;\n    }\n  }\n\n  .error-overlay-footer-message {\n    color: var(--color-gray-900);\n    margin: 0;\n    font-size: 14px;\n    font-weight: 400;\n    line-height: var(--size-font-big);\n  }\n\n  " + feedbackStyles + "\n";
 
 //# sourceMappingURL=error-overlay-footer.js.map

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-overlay-footer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-overlay-footer.tsx"],"sourcesContent":["import { ErrorFeedback } from './error-feedback/error-feedback'\nimport { styles as feedbackStyles } from './error-feedback/error-feedback'\nimport { noop as css } from '../../../../utils/noop-template'\n\nexport type ErrorOverlayFooterProps = {\n  errorCode: string | undefined\n  footerMessage: string | undefined\n}\n\nexport function ErrorOverlayFooter({\n  errorCode,\n  footerMessage,\n}: ErrorOverlayFooterProps) {\n  return (\n    <footer className=\"error-overlay-footer\">\n      {footerMessage ? (\n        <p className=\"error-overlay-footer-message\">{footerMessage}</p>\n      ) : null}\n      {errorCode ? (\n        <ErrorFeedback className=\"error-feedback\" errorCode={errorCode} />\n      ) : null}\n    </footer>\n  )\n}\n\nexport const styles = css`\n  .error-overlay-footer {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n\n    gap: var(--size-gap);\n    padding: var(--size-3);\n    background: var(--color-background-200);\n    border-top: 1px solid var(--color-gray-400);\n  }\n\n  .error-feedback {\n    margin-left: auto;\n\n    p {\n      font-size: 14px;\n      font-weight: 500;\n      margin: 0;\n    }\n  }\n\n  .error-overlay-footer-message {\n    color: var(--color-gray-900);\n    margin: 0;\n    font-size: 14px;\n    font-weight: 400;\n    line-height: var(--size-font-big);\n  }\n\n  ${feedbackStyles}\n`\n"],"names":["ErrorFeedback","styles","feedbackStyles","noop","css","ErrorOverlayFooter","errorCode","footerMessage","footer","className","p"],"mappings":";;;;;;;;;;;;AAAA,SAASA,aAAa,QAAQ,kCAAiC;AAC/D,SAASC,UAAUC,cAAc,QAAQ,kCAAiC;AAC1E,SAASC,QAAQC,GAAG,QAAQ,kCAAiC;AAO7D,OAAO,SAASC,mBAAmB,KAGT;IAHS,IAAA,EACjCC,SAAS,EACTC,aAAa,EACW,GAHS;IAIjC,qBACE,MAACC;QAAOC,WAAU;;YACfF,8BACC,KAACG;gBAAED,WAAU;0BAAgCF;iBAC3C;YACHD,0BACC,KAACN;gBAAcS,WAAU;gBAAiBH,WAAWA;iBACnD;;;AAGV;AAEA,OAAO,MAAML,SAASG,uBA8BlBF,gBACH"}
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-footer/error-overlay-footer.tsx"],"sourcesContent":["import { ErrorFeedback } from './error-feedback/error-feedback'\nimport { styles as feedbackStyles } from './error-feedback/error-feedback'\n\nexport type ErrorOverlayFooterProps = {\n  errorCode: string | undefined\n  footerMessage: string | undefined\n}\n\nexport function ErrorOverlayFooter({\n  errorCode,\n  footerMessage,\n}: ErrorOverlayFooterProps) {\n  return (\n    <footer className=\"error-overlay-footer\">\n      {footerMessage ? (\n        <p className=\"error-overlay-footer-message\">{footerMessage}</p>\n      ) : null}\n      {errorCode ? (\n        <ErrorFeedback className=\"error-feedback\" errorCode={errorCode} />\n      ) : null}\n    </footer>\n  )\n}\n\nexport const styles = `\n  .error-overlay-footer {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n\n    gap: var(--size-gap);\n    padding: var(--size-3);\n    background: var(--color-background-200);\n    border-top: 1px solid var(--color-gray-400);\n  }\n\n  .error-feedback {\n    margin-left: auto;\n\n    p {\n      font-size: 14px;\n      font-weight: 500;\n      margin: 0;\n    }\n  }\n\n  .error-overlay-footer-message {\n    color: var(--color-gray-900);\n    margin: 0;\n    font-size: 14px;\n    font-weight: 400;\n    line-height: var(--size-font-big);\n  }\n\n  ${feedbackStyles}\n`\n"],"names":["ErrorFeedback","styles","feedbackStyles","ErrorOverlayFooter","errorCode","footerMessage","footer","className","p"],"mappings":";AAAA,SAASA,aAAa,QAAQ,kCAAiC;AAC/D,SAASC,UAAUC,cAAc,QAAQ,kCAAiC;AAO1E,OAAO,SAASC,mBAAmB,KAGT;IAHS,IAAA,EACjCC,SAAS,EACTC,aAAa,EACW,GAHS;IAIjC,qBACE,MAACC;QAAOC,WAAU;;YACfF,8BACC,KAACG;gBAAED,WAAU;0BAAgCF;iBAC3C;YACHD,0BACC,KAACJ;gBAAcO,WAAU;gBAAiBH,WAAWA;iBACnD;;;AAGV;AAEA,OAAO,MAAMH,SAAS,AAAC,mlBA8BnBC,iBAAe,KAClB"}

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.js

@@ -1,27 +1,7 @@
-import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
-function _templateObject() {
-    const data = _tagged_template_literal_loose([
-        "\n  ",
-        "\n  ",
-        "\n  ",
-        "\n  ",
-        "\n\n  ",
-        "\n  ",
-        "\n  ",
-        "\n  ",
-        "\n  ",
-        "\n\n  [data-nextjs-error-label-group] {\n    display: flex;\n    align-items: center;\n    gap: var(--size-2);\n  }\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { DialogContent, DialogFooter } from '../../dialog';
 import { ErrorOverlayToolbar, styles as toolbarStyles } from '../error-overlay-toolbar/error-overlay-toolbar';
 import { ErrorOverlayFooter } from '../error-overlay-footer/error-overlay-footer';
-import { noop as css } from '../../../../utils/noop-template';
 import { ErrorMessage, styles as errorMessageStyles } from '../error-message/error-message';
 import { ErrorTypeLabel, styles as errorTypeLabelStyles } from '../error-type-label/error-type-label';
 import { ErrorOverlayNav, styles as floatingHeaderStyles } from '../error-overlay-nav/error-overlay-nav';
@@ -116,6 +96,6 @@ export function ErrorOverlayLayout(param) {
         })
     });
 }
-export const styles = css(_templateObject(), OVERLAY_STYLES, DIALOG_STYLES, DIALOG_HEADER_STYLES, DIALOG_BODY_STYLES, floatingHeaderStyles, errorTypeLabelStyles, errorMessageStyles, toolbarStyles, CALL_STACK_STYLES);
+export const styles = "\n  " + OVERLAY_STYLES + "\n  " + DIALOG_STYLES + "\n  " + DIALOG_HEADER_STYLES + "\n  " + DIALOG_BODY_STYLES + "\n\n  " + floatingHeaderStyles + "\n  " + errorTypeLabelStyles + "\n  " + errorMessageStyles + "\n  " + toolbarStyles + "\n  " + CALL_STACK_STYLES + "\n\n  [data-nextjs-error-label-group] {\n    display: flex;\n    align-items: center;\n    gap: var(--size-2);\n  }\n";
 
 //# sourceMappingURL=error-overlay-layout.js.map

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.tsx"],"sourcesContent":["import type { DebugInfo } from '../../../../types'\nimport type { ErrorMessageType } from '../error-message/error-message'\nimport type { ErrorType } from '../error-type-label/error-type-label'\n\nimport { DialogContent, DialogFooter } from '../../dialog'\nimport {\n  ErrorOverlayToolbar,\n  styles as toolbarStyles,\n} from '../error-overlay-toolbar/error-overlay-toolbar'\nimport { ErrorOverlayFooter } from '../error-overlay-footer/error-overlay-footer'\nimport { noop as css } from '../../../../utils/noop-template'\nimport {\n  ErrorMessage,\n  styles as errorMessageStyles,\n} from '../error-message/error-message'\nimport {\n  ErrorTypeLabel,\n  styles as errorTypeLabelStyles,\n} from '../error-type-label/error-type-label'\nimport {\n  ErrorOverlayNav,\n  styles as floatingHeaderStyles,\n} from '../error-overlay-nav/error-overlay-nav'\n\nimport { ErrorOverlayDialog, DIALOG_STYLES } from '../dialog/dialog'\nimport {\n  ErrorOverlayDialogHeader,\n  DIALOG_HEADER_STYLES,\n} from '../dialog/header'\nimport { ErrorOverlayDialogBody, DIALOG_BODY_STYLES } from '../dialog/body'\nimport { CALL_STACK_STYLES } from '../call-stack/call-stack'\nimport { OVERLAY_STYLES, ErrorOverlayOverlay } from '../overlay/overlay'\nimport { ErrorOverlayBottomStack } from '../error-overlay-bottom-stack'\nimport type { ErrorBaseProps } from '../error-overlay/error-overlay'\nimport type { ReadyRuntimeError } from '../../../../utils/get-error-by-type'\nimport { EnvironmentNameLabel } from '../environment-name-label/environment-name-label'\n\ninterface ErrorOverlayLayoutProps extends ErrorBaseProps {\n  errorMessage: ErrorMessageType\n  errorType: ErrorType\n  children?: React.ReactNode\n  errorCode?: string\n  error: ReadyRuntimeError['error']\n  debugInfo?: DebugInfo\n  isBuildError?: boolean\n  onClose?: () => void\n  // TODO: better handle receiving\n  runtimeErrors?: ReadyRuntimeError[]\n  activeIdx?: number\n  setActiveIndex?: (index: number) => void\n  footerMessage?: string\n  dialogResizerRef?: React.RefObject<HTMLDivElement | null>\n}\n\nexport function ErrorOverlayLayout({\n  errorMessage,\n  errorType,\n  children,\n  errorCode,\n  error,\n  debugInfo,\n  isBuildError,\n  onClose,\n  versionInfo,\n  runtimeErrors,\n  activeIdx,\n  setActiveIndex,\n  footerMessage,\n  isTurbopack,\n  dialogResizerRef,\n  // This prop is used to animate the dialog, it comes from a parent component (<ErrorOverlay>)\n  // If it's not being passed, we should just render the component as it is being\n  // used without the context of a parent component that controls its state (e.g. Storybook).\n  rendered = true,\n  transitionDurationMs,\n}: ErrorOverlayLayoutProps) {\n  const animationProps = {\n    'data-rendered': rendered,\n    style: {\n      '--transition-duration': `${transitionDurationMs}ms`,\n    } as React.CSSProperties,\n  }\n\n  const hasFooter = Boolean(footerMessage || errorCode)\n\n  return (\n    <ErrorOverlayOverlay fixed={isBuildError} {...animationProps}>\n      <div data-nextjs-dialog-root {...animationProps}>\n        <ErrorOverlayDialog\n          onClose={onClose}\n          dialogResizerRef={dialogResizerRef}\n          data-has-footer={hasFooter}\n        >\n          <DialogContent>\n            <ErrorOverlayDialogHeader>\n              <div\n                className=\"nextjs__container_errors__error_title\"\n                // allow assertion in tests before error rating is implemented\n                data-nextjs-error-code={errorCode}\n              >\n                <span data-nextjs-error-label-group>\n                  <ErrorTypeLabel errorType={errorType} />\n                  {error.environmentName && (\n                    <EnvironmentNameLabel\n                      environmentName={error.environmentName}\n                    />\n                  )}\n                </span>\n                <ErrorOverlayToolbar error={error} debugInfo={debugInfo} />\n              </div>\n              <ErrorMessage errorMessage={errorMessage} />\n            </ErrorOverlayDialogHeader>\n\n            <ErrorOverlayDialogBody>{children}</ErrorOverlayDialogBody>\n          </DialogContent>\n          {hasFooter && (\n            <DialogFooter>\n              <ErrorOverlayFooter\n                footerMessage={footerMessage}\n                errorCode={errorCode}\n              />\n            </DialogFooter>\n          )}\n          <ErrorOverlayBottomStack\n            count={runtimeErrors?.length ?? 0}\n            activeIdx={activeIdx ?? 0}\n          />\n        </ErrorOverlayDialog>\n        <ErrorOverlayNav\n          runtimeErrors={runtimeErrors}\n          activeIdx={activeIdx}\n          setActiveIndex={setActiveIndex}\n          versionInfo={versionInfo}\n          isTurbopack={isTurbopack}\n        />\n      </div>\n    </ErrorOverlayOverlay>\n  )\n}\n\nexport const styles = css`\n  ${OVERLAY_STYLES}\n  ${DIALOG_STYLES}\n  ${DIALOG_HEADER_STYLES}\n  ${DIALOG_BODY_STYLES}\n\n  ${floatingHeaderStyles}\n  ${errorTypeLabelStyles}\n  ${errorMessageStyles}\n  ${toolbarStyles}\n  ${CALL_STACK_STYLES}\n\n  [data-nextjs-error-label-group] {\n    display: flex;\n    align-items: center;\n    gap: var(--size-2);\n  }\n`\n"],"names":["DialogContent","DialogFooter","ErrorOverlayToolbar","styles","toolbarStyles","ErrorOverlayFooter","noop","css","ErrorMessage","errorMessageStyles","ErrorTypeLabel","errorTypeLabelStyles","ErrorOverlayNav","floatingHeaderStyles","ErrorOverlayDialog","DIALOG_STYLES","ErrorOverlayDialogHeader","DIALOG_HEADER_STYLES","ErrorOverlayDialogBody","DIALOG_BODY_STYLES","CALL_STACK_STYLES","OVERLAY_STYLES","ErrorOverlayOverlay","ErrorOverlayBottomStack","EnvironmentNameLabel","ErrorOverlayLayout","errorMessage","errorType","children","errorCode","error","debugInfo","isBuildError","onClose","versionInfo","runtimeErrors","activeIdx","setActiveIndex","footerMessage","isTurbopack","dialogResizerRef","rendered","transitionDurationMs","animationProps","style","hasFooter","Boolean","fixed","div","data-nextjs-dialog-root","data-has-footer","className","data-nextjs-error-code","span","data-nextjs-error-label-group","environmentName","count","length"],"mappings":";;;;;;;;;;;;;;;;;;;;AAIA,SAASA,aAAa,EAAEC,YAAY,QAAQ,eAAc;AAC1D,SACEC,mBAAmB,EACnBC,UAAUC,aAAa,QAClB,iDAAgD;AACvD,SAASC,kBAAkB,QAAQ,+CAA8C;AACjF,SAASC,QAAQC,GAAG,QAAQ,kCAAiC;AAC7D,SACEC,YAAY,EACZL,UAAUM,kBAAkB,QACvB,iCAAgC;AACvC,SACEC,cAAc,EACdP,UAAUQ,oBAAoB,QACzB,uCAAsC;AAC7C,SACEC,eAAe,EACfT,UAAUU,oBAAoB,QACzB,yCAAwC;AAE/C,SAASC,kBAAkB,EAAEC,aAAa,QAAQ,mBAAkB;AACpE,SACEC,wBAAwB,EACxBC,oBAAoB,QACf,mBAAkB;AACzB,SAASC,sBAAsB,EAAEC,kBAAkB,QAAQ,iBAAgB;AAC3E,SAASC,iBAAiB,QAAQ,2BAA0B;AAC5D,SAASC,cAAc,EAAEC,mBAAmB,QAAQ,qBAAoB;AACxE,SAASC,uBAAuB,QAAQ,gCAA+B;AAGvE,SAASC,oBAAoB,QAAQ,mDAAkD;AAmBvF,OAAO,SAASC,mBAAmB,KAqBT;IArBS,IAAA,EACjCC,YAAY,EACZC,SAAS,EACTC,QAAQ,EACRC,SAAS,EACTC,KAAK,EACLC,SAAS,EACTC,YAAY,EACZC,OAAO,EACPC,WAAW,EACXC,aAAa,EACbC,SAAS,EACTC,cAAc,EACdC,aAAa,EACbC,WAAW,EACXC,gBAAgB,EAChB,6FAA6F;IAC7F,+EAA+E;IAC/E,2FAA2F;IAC3FC,WAAW,IAAI,EACfC,oBAAoB,EACI,GArBS;IAsBjC,MAAMC,iBAAiB;QACrB,iBAAiBF;QACjBG,OAAO;YACL,yBAAyB,AAAC,KAAEF,uBAAqB;QACnD;IACF;IAEA,MAAMG,YAAYC,QAAQR,iBAAiBT;QAyC1BM;IAvCjB,qBACE,KAACb;QAAoByB,OAAOf;QAAe,GAAGW,cAAc;kBAC1D,cAAA,MAACK;YAAIC,yBAAuB;YAAE,GAAGN,cAAc;;8BAC7C,MAAC7B;oBACCmB,SAASA;oBACTO,kBAAkBA;oBAClBU,mBAAiBL;;sCAEjB,MAAC7C;;8CACC,MAACgB;;sDACC,MAACgC;4CACCG,WAAU;4CACV,8DAA8D;4CAC9DC,0BAAwBvB;;8DAExB,MAACwB;oDAAKC,+BAA6B;;sEACjC,KAAC5C;4DAAeiB,WAAWA;;wDAC1BG,MAAMyB,eAAe,kBACpB,KAAC/B;4DACC+B,iBAAiBzB,MAAMyB,eAAe;;;;8DAI5C,KAACrD;oDAAoB4B,OAAOA;oDAAOC,WAAWA;;;;sDAEhD,KAACvB;4CAAakB,cAAcA;;;;8CAG9B,KAACR;8CAAwBU;;;;wBAE1BiB,2BACC,KAAC5C;sCACC,cAAA,KAACI;gCACCiC,eAAeA;gCACfT,WAAWA;;;sCAIjB,KAACN;4BACCiC,OAAOrB,CAAAA,wBAAAA,iCAAAA,cAAesB,MAAM,YAArBtB,wBAAyB;4BAChCC,WAAWA,oBAAAA,YAAa;;;;8BAG5B,KAACxB;oBACCuB,eAAeA;oBACfC,WAAWA;oBACXC,gBAAgBA;oBAChBH,aAAaA;oBACbK,aAAaA;;;;;AAKvB;AAEA,OAAO,MAAMpC,SAASI,uBAClBc,gBACAN,eACAE,sBACAE,oBAEAN,sBACAF,sBACAF,oBACAL,eACAgB,mBAOH"}
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-layout/error-overlay-layout.tsx"],"sourcesContent":["import type { DebugInfo } from '../../../../types'\nimport type { ErrorMessageType } from '../error-message/error-message'\nimport type { ErrorType } from '../error-type-label/error-type-label'\n\nimport { DialogContent, DialogFooter } from '../../dialog'\nimport {\n  ErrorOverlayToolbar,\n  styles as toolbarStyles,\n} from '../error-overlay-toolbar/error-overlay-toolbar'\nimport { ErrorOverlayFooter } from '../error-overlay-footer/error-overlay-footer'\nimport {\n  ErrorMessage,\n  styles as errorMessageStyles,\n} from '../error-message/error-message'\nimport {\n  ErrorTypeLabel,\n  styles as errorTypeLabelStyles,\n} from '../error-type-label/error-type-label'\nimport {\n  ErrorOverlayNav,\n  styles as floatingHeaderStyles,\n} from '../error-overlay-nav/error-overlay-nav'\n\nimport { ErrorOverlayDialog, DIALOG_STYLES } from '../dialog/dialog'\nimport {\n  ErrorOverlayDialogHeader,\n  DIALOG_HEADER_STYLES,\n} from '../dialog/header'\nimport { ErrorOverlayDialogBody, DIALOG_BODY_STYLES } from '../dialog/body'\nimport { CALL_STACK_STYLES } from '../call-stack/call-stack'\nimport { OVERLAY_STYLES, ErrorOverlayOverlay } from '../overlay/overlay'\nimport { ErrorOverlayBottomStack } from '../error-overlay-bottom-stack'\nimport type { ErrorBaseProps } from '../error-overlay/error-overlay'\nimport type { ReadyRuntimeError } from '../../../../utils/get-error-by-type'\nimport { EnvironmentNameLabel } from '../environment-name-label/environment-name-label'\n\ninterface ErrorOverlayLayoutProps extends ErrorBaseProps {\n  errorMessage: ErrorMessageType\n  errorType: ErrorType\n  children?: React.ReactNode\n  errorCode?: string\n  error: ReadyRuntimeError['error']\n  debugInfo?: DebugInfo\n  isBuildError?: boolean\n  onClose?: () => void\n  // TODO: better handle receiving\n  runtimeErrors?: ReadyRuntimeError[]\n  activeIdx?: number\n  setActiveIndex?: (index: number) => void\n  footerMessage?: string\n  dialogResizerRef?: React.RefObject<HTMLDivElement | null>\n}\n\nexport function ErrorOverlayLayout({\n  errorMessage,\n  errorType,\n  children,\n  errorCode,\n  error,\n  debugInfo,\n  isBuildError,\n  onClose,\n  versionInfo,\n  runtimeErrors,\n  activeIdx,\n  setActiveIndex,\n  footerMessage,\n  isTurbopack,\n  dialogResizerRef,\n  // This prop is used to animate the dialog, it comes from a parent component (<ErrorOverlay>)\n  // If it's not being passed, we should just render the component as it is being\n  // used without the context of a parent component that controls its state (e.g. Storybook).\n  rendered = true,\n  transitionDurationMs,\n}: ErrorOverlayLayoutProps) {\n  const animationProps = {\n    'data-rendered': rendered,\n    style: {\n      '--transition-duration': `${transitionDurationMs}ms`,\n    } as React.CSSProperties,\n  }\n\n  const hasFooter = Boolean(footerMessage || errorCode)\n\n  return (\n    <ErrorOverlayOverlay fixed={isBuildError} {...animationProps}>\n      <div data-nextjs-dialog-root {...animationProps}>\n        <ErrorOverlayDialog\n          onClose={onClose}\n          dialogResizerRef={dialogResizerRef}\n          data-has-footer={hasFooter}\n        >\n          <DialogContent>\n            <ErrorOverlayDialogHeader>\n              <div\n                className=\"nextjs__container_errors__error_title\"\n                // allow assertion in tests before error rating is implemented\n                data-nextjs-error-code={errorCode}\n              >\n                <span data-nextjs-error-label-group>\n                  <ErrorTypeLabel errorType={errorType} />\n                  {error.environmentName && (\n                    <EnvironmentNameLabel\n                      environmentName={error.environmentName}\n                    />\n                  )}\n                </span>\n                <ErrorOverlayToolbar error={error} debugInfo={debugInfo} />\n              </div>\n              <ErrorMessage errorMessage={errorMessage} />\n            </ErrorOverlayDialogHeader>\n\n            <ErrorOverlayDialogBody>{children}</ErrorOverlayDialogBody>\n          </DialogContent>\n          {hasFooter && (\n            <DialogFooter>\n              <ErrorOverlayFooter\n                footerMessage={footerMessage}\n                errorCode={errorCode}\n              />\n            </DialogFooter>\n          )}\n          <ErrorOverlayBottomStack\n            count={runtimeErrors?.length ?? 0}\n            activeIdx={activeIdx ?? 0}\n          />\n        </ErrorOverlayDialog>\n        <ErrorOverlayNav\n          runtimeErrors={runtimeErrors}\n          activeIdx={activeIdx}\n          setActiveIndex={setActiveIndex}\n          versionInfo={versionInfo}\n          isTurbopack={isTurbopack}\n        />\n      </div>\n    </ErrorOverlayOverlay>\n  )\n}\n\nexport const styles = `\n  ${OVERLAY_STYLES}\n  ${DIALOG_STYLES}\n  ${DIALOG_HEADER_STYLES}\n  ${DIALOG_BODY_STYLES}\n\n  ${floatingHeaderStyles}\n  ${errorTypeLabelStyles}\n  ${errorMessageStyles}\n  ${toolbarStyles}\n  ${CALL_STACK_STYLES}\n\n  [data-nextjs-error-label-group] {\n    display: flex;\n    align-items: center;\n    gap: var(--size-2);\n  }\n`\n"],"names":["DialogContent","DialogFooter","ErrorOverlayToolbar","styles","toolbarStyles","ErrorOverlayFooter","ErrorMessage","errorMessageStyles","ErrorTypeLabel","errorTypeLabelStyles","ErrorOverlayNav","floatingHeaderStyles","ErrorOverlayDialog","DIALOG_STYLES","ErrorOverlayDialogHeader","DIALOG_HEADER_STYLES","ErrorOverlayDialogBody","DIALOG_BODY_STYLES","CALL_STACK_STYLES","OVERLAY_STYLES","ErrorOverlayOverlay","ErrorOverlayBottomStack","EnvironmentNameLabel","ErrorOverlayLayout","errorMessage","errorType","children","errorCode","error","debugInfo","isBuildError","onClose","versionInfo","runtimeErrors","activeIdx","setActiveIndex","footerMessage","isTurbopack","dialogResizerRef","rendered","transitionDurationMs","animationProps","style","hasFooter","Boolean","fixed","div","data-nextjs-dialog-root","data-has-footer","className","data-nextjs-error-code","span","data-nextjs-error-label-group","environmentName","count","length"],"mappings":";AAIA,SAASA,aAAa,EAAEC,YAAY,QAAQ,eAAc;AAC1D,SACEC,mBAAmB,EACnBC,UAAUC,aAAa,QAClB,iDAAgD;AACvD,SAASC,kBAAkB,QAAQ,+CAA8C;AACjF,SACEC,YAAY,EACZH,UAAUI,kBAAkB,QACvB,iCAAgC;AACvC,SACEC,cAAc,EACdL,UAAUM,oBAAoB,QACzB,uCAAsC;AAC7C,SACEC,eAAe,EACfP,UAAUQ,oBAAoB,QACzB,yCAAwC;AAE/C,SAASC,kBAAkB,EAAEC,aAAa,QAAQ,mBAAkB;AACpE,SACEC,wBAAwB,EACxBC,oBAAoB,QACf,mBAAkB;AACzB,SAASC,sBAAsB,EAAEC,kBAAkB,QAAQ,iBAAgB;AAC3E,SAASC,iBAAiB,QAAQ,2BAA0B;AAC5D,SAASC,cAAc,EAAEC,mBAAmB,QAAQ,qBAAoB;AACxE,SAASC,uBAAuB,QAAQ,gCAA+B;AAGvE,SAASC,oBAAoB,QAAQ,mDAAkD;AAmBvF,OAAO,SAASC,mBAAmB,KAqBT;IArBS,IAAA,EACjCC,YAAY,EACZC,SAAS,EACTC,QAAQ,EACRC,SAAS,EACTC,KAAK,EACLC,SAAS,EACTC,YAAY,EACZC,OAAO,EACPC,WAAW,EACXC,aAAa,EACbC,SAAS,EACTC,cAAc,EACdC,aAAa,EACbC,WAAW,EACXC,gBAAgB,EAChB,6FAA6F;IAC7F,+EAA+E;IAC/E,2FAA2F;IAC3FC,WAAW,IAAI,EACfC,oBAAoB,EACI,GArBS;IAsBjC,MAAMC,iBAAiB;QACrB,iBAAiBF;QACjBG,OAAO;YACL,yBAAyB,AAAC,KAAEF,uBAAqB;QACnD;IACF;IAEA,MAAMG,YAAYC,QAAQR,iBAAiBT;QAyC1BM;IAvCjB,qBACE,KAACb;QAAoByB,OAAOf;QAAe,GAAGW,cAAc;kBAC1D,cAAA,MAACK;YAAIC,yBAAuB;YAAE,GAAGN,cAAc;;8BAC7C,MAAC7B;oBACCmB,SAASA;oBACTO,kBAAkBA;oBAClBU,mBAAiBL;;sCAEjB,MAAC3C;;8CACC,MAACc;;sDACC,MAACgC;4CACCG,WAAU;4CACV,8DAA8D;4CAC9DC,0BAAwBvB;;8DAExB,MAACwB;oDAAKC,+BAA6B;;sEACjC,KAAC5C;4DAAeiB,WAAWA;;wDAC1BG,MAAMyB,eAAe,kBACpB,KAAC/B;4DACC+B,iBAAiBzB,MAAMyB,eAAe;;;;8DAI5C,KAACnD;oDAAoB0B,OAAOA;oDAAOC,WAAWA;;;;sDAEhD,KAACvB;4CAAakB,cAAcA;;;;8CAG9B,KAACR;8CAAwBU;;;;wBAE1BiB,2BACC,KAAC1C;sCACC,cAAA,KAACI;gCACC+B,eAAeA;gCACfT,WAAWA;;;sCAIjB,KAACN;4BACCiC,OAAOrB,CAAAA,wBAAAA,iCAAAA,cAAesB,MAAM,YAArBtB,wBAAyB;4BAChCC,WAAWA,oBAAAA,YAAa;;;;8BAG5B,KAACxB;oBACCuB,eAAeA;oBACfC,WAAWA;oBACXC,gBAAgBA;oBAChBH,aAAaA;oBACbK,aAAaA;;;;;AAKvB;AAEA,OAAO,MAAMlC,SAAS,AAAC,SACnBgB,iBAAe,SACfN,gBAAc,SACdE,uBAAqB,SACrBE,qBAAmB,WAEnBN,uBAAqB,SACrBF,uBAAqB,SACrBF,qBAAmB,SACnBH,gBAAc,SACdc,oBAAkB,wHAOrB"}

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-nav/error-overlay-nav.js

@@ -1,17 +1,6 @@
-import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
-function _templateObject() {
-    const data = _tagged_template_literal_loose([
-        "\n  [data-nextjs-error-overlay-nav] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    width: 100%;\n\n    outline: none;\n    translate: 1px 1px;\n    max-width: var(--next-dialog-max-width);\n\n    .error-overlay-notch {\n      --stroke-color: var(--color-gray-400);\n      --background-color: var(--color-background-100);\n\n      translate: -1px 0;\n      width: auto;\n      height: 42px;\n      padding: 12px;\n      background: var(--background-color);\n      border: 1px solid var(--stroke-color);\n      border-bottom: none;\n      position: relative;\n\n      &[data-side='left'] {\n        padding-right: 0;\n        border-radius: var(--next-dialog-radius) 0 0 0;\n\n        .error-overlay-notch-tail {\n          right: -54px;\n        }\n\n        > *:not(.error-overlay-notch-tail) {\n          margin-right: -10px;\n        }\n      }\n\n      &[data-side='right'] {\n        padding-left: 0;\n        border-radius: 0 var(--next-dialog-radius) 0 0;\n\n        .error-overlay-notch-tail {\n          left: -54px;\n          transform: rotateY(180deg);\n        }\n\n        > *:not(.error-overlay-notch-tail) {\n          margin-left: -12px;\n        }\n      }\n\n      .error-overlay-notch-tail {\n        position: absolute;\n        top: -1px;\n        pointer-events: none;\n        z-index: -1;\n      }\n    }\n  }\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { ErrorOverlayPagination } from '../error-overlay-pagination/error-overlay-pagination';
 import { VersionStalenessInfo } from '../../version-staleness-info/version-staleness-info';
-import { noop as css } from '../../../../utils/noop-template';
 export function ErrorOverlayNav(param) {
     let { runtimeErrors, activeIdx, setActiveIndex, versionInfo, isTurbopack } = param;
     return /*#__PURE__*/ _jsxs("div", {
@@ -35,7 +24,7 @@ export function ErrorOverlayNav(param) {
         ]
     });
 }
-export const styles = css(_templateObject());
+export const styles = "\n  [data-nextjs-error-overlay-nav] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    width: 100%;\n\n    outline: none;\n    translate: 1px 1px;\n    max-width: var(--next-dialog-max-width);\n\n    .error-overlay-notch {\n      --stroke-color: var(--color-gray-400);\n      --background-color: var(--color-background-100);\n\n      translate: -1px 0;\n      width: auto;\n      height: 42px;\n      padding: 12px;\n      background: var(--background-color);\n      border: 1px solid var(--stroke-color);\n      border-bottom: none;\n      position: relative;\n\n      &[data-side='left'] {\n        padding-right: 0;\n        border-radius: var(--next-dialog-radius) 0 0 0;\n\n        .error-overlay-notch-tail {\n          right: -54px;\n        }\n\n        > *:not(.error-overlay-notch-tail) {\n          margin-right: -10px;\n        }\n      }\n\n      &[data-side='right'] {\n        padding-left: 0;\n        border-radius: 0 var(--next-dialog-radius) 0 0;\n\n        .error-overlay-notch-tail {\n          left: -54px;\n          transform: rotateY(180deg);\n        }\n\n        > *:not(.error-overlay-notch-tail) {\n          margin-left: -12px;\n        }\n      }\n\n      .error-overlay-notch-tail {\n        position: absolute;\n        top: -1px;\n        pointer-events: none;\n        z-index: -1;\n      }\n    }\n  }\n";
 function Notch(param) {
     let { children, side = 'left' } = param;
     return /*#__PURE__*/ _jsxs("div", {

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-nav/error-overlay-nav.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-nav/error-overlay-nav.tsx"],"sourcesContent":["import type { VersionInfo } from '../../../../../../../server/dev/parse-version-info'\n\nimport { ErrorOverlayPagination } from '../error-overlay-pagination/error-overlay-pagination'\nimport { VersionStalenessInfo } from '../../version-staleness-info/version-staleness-info'\nimport { noop as css } from '../../../../utils/noop-template'\nimport type { ReadyRuntimeError } from '../../../../utils/get-error-by-type'\n\ntype ErrorOverlayNavProps = {\n  runtimeErrors?: ReadyRuntimeError[]\n  activeIdx?: number\n  setActiveIndex?: (index: number) => void\n  versionInfo?: VersionInfo\n  isTurbopack?: boolean\n}\n\nexport function ErrorOverlayNav({\n  runtimeErrors,\n  activeIdx,\n  setActiveIndex,\n  versionInfo,\n  isTurbopack,\n}: ErrorOverlayNavProps) {\n  return (\n    <div data-nextjs-error-overlay-nav>\n      <Notch side=\"left\">\n        {/* TODO: better passing data instead of nullish coalescing */}\n        <ErrorOverlayPagination\n          runtimeErrors={runtimeErrors ?? []}\n          activeIdx={activeIdx ?? 0}\n          onActiveIndexChange={setActiveIndex ?? (() => {})}\n        />\n      </Notch>\n      {versionInfo && (\n        <Notch side=\"right\">\n          <VersionStalenessInfo\n            versionInfo={versionInfo}\n            isTurbopack={isTurbopack}\n          />\n        </Notch>\n      )}\n    </div>\n  )\n}\n\nexport const styles = css`\n  [data-nextjs-error-overlay-nav] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    width: 100%;\n\n    outline: none;\n    translate: 1px 1px;\n    max-width: var(--next-dialog-max-width);\n\n    .error-overlay-notch {\n      --stroke-color: var(--color-gray-400);\n      --background-color: var(--color-background-100);\n\n      translate: -1px 0;\n      width: auto;\n      height: 42px;\n      padding: 12px;\n      background: var(--background-color);\n      border: 1px solid var(--stroke-color);\n      border-bottom: none;\n      position: relative;\n\n      &[data-side='left'] {\n        padding-right: 0;\n        border-radius: var(--next-dialog-radius) 0 0 0;\n\n        .error-overlay-notch-tail {\n          right: -54px;\n        }\n\n        > *:not(.error-overlay-notch-tail) {\n          margin-right: -10px;\n        }\n      }\n\n      &[data-side='right'] {\n        padding-left: 0;\n        border-radius: 0 var(--next-dialog-radius) 0 0;\n\n        .error-overlay-notch-tail {\n          left: -54px;\n          transform: rotateY(180deg);\n        }\n\n        > *:not(.error-overlay-notch-tail) {\n          margin-left: -12px;\n        }\n      }\n\n      .error-overlay-notch-tail {\n        position: absolute;\n        top: -1px;\n        pointer-events: none;\n        z-index: -1;\n      }\n    }\n  }\n`\n\nfunction Notch({\n  children,\n  side = 'left',\n}: {\n  children: React.ReactNode\n  side?: 'left' | 'right'\n}) {\n  return (\n    <div className=\"error-overlay-notch\" data-side={side}>\n      {children}\n      <Tail />\n    </div>\n  )\n}\n\nfunction Tail() {\n  return (\n    <svg\n      width=\"60\"\n      height=\"42\"\n      viewBox=\"0 0 60 42\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className=\"error-overlay-notch-tail\"\n    >\n      <mask\n        id=\"mask0_2667_14687\"\n        style={{\n          maskType: 'alpha',\n        }}\n        maskUnits=\"userSpaceOnUse\"\n        x=\"0\"\n        y=\"-1\"\n        width=\"60\"\n        height=\"43\"\n      >\n        <mask\n          id=\"path-1-outside-1_2667_14687\"\n          maskUnits=\"userSpaceOnUse\"\n          x=\"0\"\n          y=\"-1\"\n          width=\"60\"\n          height=\"43\"\n          fill=\"black\"\n        >\n          <rect fill=\"white\" y=\"-1\" width=\"60\" height=\"43\" />\n          <path d=\"M1 0L8.0783 0C15.772 0 22.7836 4.41324 26.111 11.3501L34.8889 29.6498C38.2164 36.5868 45.228 41 52.9217 41H60H1L1 0Z\" />\n        </mask>\n        <path\n          d=\"M1 0L8.0783 0C15.772 0 22.7836 4.41324 26.111 11.3501L34.8889 29.6498C38.2164 36.5868 45.228 41 52.9217 41H60H1L1 0Z\"\n          fill=\"white\"\n        />\n        <path\n          d=\"M1 0V-1H0V0L1 0ZM1 41H0V42H1V41ZM34.8889 29.6498L33.9873 30.0823L34.8889 29.6498ZM26.111 11.3501L27.0127 10.9177L26.111 11.3501ZM1 1H8.0783V-1H1V1ZM60 40H1V42H60V40ZM2 41V0L0 0L0 41H2ZM25.2094 11.7826L33.9873 30.0823L35.7906 29.2174L27.0127 10.9177L25.2094 11.7826ZM52.9217 42H60V40H52.9217V42ZM33.9873 30.0823C37.4811 37.3661 44.8433 42 52.9217 42V40C45.6127 40 38.9517 35.8074 35.7906 29.2174L33.9873 30.0823ZM8.0783 1C15.3873 1 22.0483 5.19257 25.2094 11.7826L27.0127 10.9177C23.5188 3.6339 16.1567 -1 8.0783 -1V1Z\"\n          fill=\"black\"\n          mask=\"url(#path-1-outside-1_2667_14687)\"\n        />\n      </mask>\n      <g mask=\"url(#mask0_2667_14687)\">\n        <mask\n          id=\"path-3-outside-2_2667_14687\"\n          maskUnits=\"userSpaceOnUse\"\n          x=\"-1\"\n          y=\"0.0244141\"\n          width=\"60\"\n          height=\"43\"\n          fill=\"black\"\n        >\n          <rect fill=\"white\" x=\"-1\" y=\"0.0244141\" width=\"60\" height=\"43\" />\n          <path d=\"M0 1.02441H7.0783C14.772 1.02441 21.7836 5.43765 25.111 12.3746L33.8889 30.6743C37.2164 37.6112 44.228 42.0244 51.9217 42.0244H59H0L0 1.02441Z\" />\n        </mask>\n        <path\n          d=\"M0 1.02441H7.0783C14.772 1.02441 21.7836 5.43765 25.111 12.3746L33.8889 30.6743C37.2164 37.6112 44.228 42.0244 51.9217 42.0244H59H0L0 1.02441Z\"\n          fill=\"var(--background-color)\"\n        />\n        <path\n          d=\"M0 1.02441L0 0.0244141H-1V1.02441H0ZM0 42.0244H-1V43.0244H0L0 42.0244ZM33.8889 30.6743L32.9873 31.1068L33.8889 30.6743ZM25.111 12.3746L26.0127 11.9421L25.111 12.3746ZM0 2.02441H7.0783V0.0244141H0L0 2.02441ZM59 41.0244H0L0 43.0244H59V41.0244ZM1 42.0244L1 1.02441H-1L-1 42.0244H1ZM24.2094 12.8071L32.9873 31.1068L34.7906 30.2418L26.0127 11.9421L24.2094 12.8071ZM51.9217 43.0244H59V41.0244H51.9217V43.0244ZM32.9873 31.1068C36.4811 38.3905 43.8433 43.0244 51.9217 43.0244V41.0244C44.6127 41.0244 37.9517 36.8318 34.7906 30.2418L32.9873 31.1068ZM7.0783 2.02441C14.3873 2.02441 21.0483 6.21699 24.2094 12.8071L26.0127 11.9421C22.5188 4.65831 15.1567 0.0244141 7.0783 0.0244141V2.02441Z\"\n          fill=\"var(--stroke-color)\"\n          mask=\"url(#path-3-outside-2_2667_14687)\"\n        />\n      </g>\n    </svg>\n  )\n}\n"],"names":["ErrorOverlayPagination","VersionStalenessInfo","noop","css","ErrorOverlayNav","runtimeErrors","activeIdx","setActiveIndex","versionInfo","isTurbopack","div","data-nextjs-error-overlay-nav","Notch","side","onActiveIndexChange","styles","children","className","data-side","Tail","svg","width","height","viewBox","fill","xmlns","mask","id","style","maskType","maskUnits","x","y","rect","path","d","g"],"mappings":";;;;;;;;;;;AAEA,SAASA,sBAAsB,QAAQ,uDAAsD;AAC7F,SAASC,oBAAoB,QAAQ,sDAAqD;AAC1F,SAASC,QAAQC,GAAG,QAAQ,kCAAiC;AAW7D,OAAO,SAASC,gBAAgB,KAMT;IANS,IAAA,EAC9BC,aAAa,EACbC,SAAS,EACTC,cAAc,EACdC,WAAW,EACXC,WAAW,EACU,GANS;IAO9B,qBACE,MAACC;QAAIC,+BAA6B;;0BAChC,KAACC;gBAAMC,MAAK;0BAEV,cAAA,KAACb;oBACCK,eAAeA,wBAAAA,gBAAiB,EAAE;oBAClCC,WAAWA,oBAAAA,YAAa;oBACxBQ,qBAAqBP,yBAAAA,iBAAmB,KAAO;;;YAGlDC,6BACC,KAACI;gBAAMC,MAAK;0BACV,cAAA,KAACZ;oBACCO,aAAaA;oBACbC,aAAaA;;;;;AAMzB;AAEA,OAAO,MAAMM,SAASZ,uBA4DrB;AAED,SAASS,MAAM,KAMd;IANc,IAAA,EACbI,QAAQ,EACRH,OAAO,MAAM,EAId,GANc;IAOb,qBACE,MAACH;QAAIO,WAAU;QAAsBC,aAAWL;;YAC7CG;0BACD,KAACG;;;AAGP;AAEA,SAASA;IACP,qBACE,MAACC;QACCC,OAAM;QACNC,QAAO;QACPC,SAAQ;QACRC,MAAK;QACLC,OAAM;QACNR,WAAU;;0BAEV,MAACS;gBACCC,IAAG;gBACHC,OAAO;oBACLC,UAAU;gBACZ;gBACAC,WAAU;gBACVC,GAAE;gBACFC,GAAE;gBACFX,OAAM;gBACNC,QAAO;;kCAEP,MAACI;wBACCC,IAAG;wBACHG,WAAU;wBACVC,GAAE;wBACFC,GAAE;wBACFX,OAAM;wBACNC,QAAO;wBACPE,MAAK;;0CAEL,KAACS;gCAAKT,MAAK;gCAAQQ,GAAE;gCAAKX,OAAM;gCAAKC,QAAO;;0CAC5C,KAACY;gCAAKC,GAAE;;;;kCAEV,KAACD;wBACCC,GAAE;wBACFX,MAAK;;kCAEP,KAACU;wBACCC,GAAE;wBACFX,MAAK;wBACLE,MAAK;;;;0BAGT,MAACU;gBAAEV,MAAK;;kCACN,MAACA;wBACCC,IAAG;wBACHG,WAAU;wBACVC,GAAE;wBACFC,GAAE;wBACFX,OAAM;wBACNC,QAAO;wBACPE,MAAK;;0CAEL,KAACS;gCAAKT,MAAK;gCAAQO,GAAE;gCAAKC,GAAE;gCAAYX,OAAM;gCAAKC,QAAO;;0CAC1D,KAACY;gCAAKC,GAAE;;;;kCAEV,KAACD;wBACCC,GAAE;wBACFX,MAAK;;kCAEP,KAACU;wBACCC,GAAE;wBACFX,MAAK;wBACLE,MAAK;;;;;;AAKf"}
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-nav/error-overlay-nav.tsx"],"sourcesContent":["import type { VersionInfo } from '../../../../../../../server/dev/parse-version-info'\n\nimport { ErrorOverlayPagination } from '../error-overlay-pagination/error-overlay-pagination'\nimport { VersionStalenessInfo } from '../../version-staleness-info/version-staleness-info'\nimport type { ReadyRuntimeError } from '../../../../utils/get-error-by-type'\n\ntype ErrorOverlayNavProps = {\n  runtimeErrors?: ReadyRuntimeError[]\n  activeIdx?: number\n  setActiveIndex?: (index: number) => void\n  versionInfo?: VersionInfo\n  isTurbopack?: boolean\n}\n\nexport function ErrorOverlayNav({\n  runtimeErrors,\n  activeIdx,\n  setActiveIndex,\n  versionInfo,\n  isTurbopack,\n}: ErrorOverlayNavProps) {\n  return (\n    <div data-nextjs-error-overlay-nav>\n      <Notch side=\"left\">\n        {/* TODO: better passing data instead of nullish coalescing */}\n        <ErrorOverlayPagination\n          runtimeErrors={runtimeErrors ?? []}\n          activeIdx={activeIdx ?? 0}\n          onActiveIndexChange={setActiveIndex ?? (() => {})}\n        />\n      </Notch>\n      {versionInfo && (\n        <Notch side=\"right\">\n          <VersionStalenessInfo\n            versionInfo={versionInfo}\n            isTurbopack={isTurbopack}\n          />\n        </Notch>\n      )}\n    </div>\n  )\n}\n\nexport const styles = `\n  [data-nextjs-error-overlay-nav] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n\n    width: 100%;\n\n    outline: none;\n    translate: 1px 1px;\n    max-width: var(--next-dialog-max-width);\n\n    .error-overlay-notch {\n      --stroke-color: var(--color-gray-400);\n      --background-color: var(--color-background-100);\n\n      translate: -1px 0;\n      width: auto;\n      height: 42px;\n      padding: 12px;\n      background: var(--background-color);\n      border: 1px solid var(--stroke-color);\n      border-bottom: none;\n      position: relative;\n\n      &[data-side='left'] {\n        padding-right: 0;\n        border-radius: var(--next-dialog-radius) 0 0 0;\n\n        .error-overlay-notch-tail {\n          right: -54px;\n        }\n\n        > *:not(.error-overlay-notch-tail) {\n          margin-right: -10px;\n        }\n      }\n\n      &[data-side='right'] {\n        padding-left: 0;\n        border-radius: 0 var(--next-dialog-radius) 0 0;\n\n        .error-overlay-notch-tail {\n          left: -54px;\n          transform: rotateY(180deg);\n        }\n\n        > *:not(.error-overlay-notch-tail) {\n          margin-left: -12px;\n        }\n      }\n\n      .error-overlay-notch-tail {\n        position: absolute;\n        top: -1px;\n        pointer-events: none;\n        z-index: -1;\n      }\n    }\n  }\n`\n\nfunction Notch({\n  children,\n  side = 'left',\n}: {\n  children: React.ReactNode\n  side?: 'left' | 'right'\n}) {\n  return (\n    <div className=\"error-overlay-notch\" data-side={side}>\n      {children}\n      <Tail />\n    </div>\n  )\n}\n\nfunction Tail() {\n  return (\n    <svg\n      width=\"60\"\n      height=\"42\"\n      viewBox=\"0 0 60 42\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className=\"error-overlay-notch-tail\"\n    >\n      <mask\n        id=\"mask0_2667_14687\"\n        style={{\n          maskType: 'alpha',\n        }}\n        maskUnits=\"userSpaceOnUse\"\n        x=\"0\"\n        y=\"-1\"\n        width=\"60\"\n        height=\"43\"\n      >\n        <mask\n          id=\"path-1-outside-1_2667_14687\"\n          maskUnits=\"userSpaceOnUse\"\n          x=\"0\"\n          y=\"-1\"\n          width=\"60\"\n          height=\"43\"\n          fill=\"black\"\n        >\n          <rect fill=\"white\" y=\"-1\" width=\"60\" height=\"43\" />\n          <path d=\"M1 0L8.0783 0C15.772 0 22.7836 4.41324 26.111 11.3501L34.8889 29.6498C38.2164 36.5868 45.228 41 52.9217 41H60H1L1 0Z\" />\n        </mask>\n        <path\n          d=\"M1 0L8.0783 0C15.772 0 22.7836 4.41324 26.111 11.3501L34.8889 29.6498C38.2164 36.5868 45.228 41 52.9217 41H60H1L1 0Z\"\n          fill=\"white\"\n        />\n        <path\n          d=\"M1 0V-1H0V0L1 0ZM1 41H0V42H1V41ZM34.8889 29.6498L33.9873 30.0823L34.8889 29.6498ZM26.111 11.3501L27.0127 10.9177L26.111 11.3501ZM1 1H8.0783V-1H1V1ZM60 40H1V42H60V40ZM2 41V0L0 0L0 41H2ZM25.2094 11.7826L33.9873 30.0823L35.7906 29.2174L27.0127 10.9177L25.2094 11.7826ZM52.9217 42H60V40H52.9217V42ZM33.9873 30.0823C37.4811 37.3661 44.8433 42 52.9217 42V40C45.6127 40 38.9517 35.8074 35.7906 29.2174L33.9873 30.0823ZM8.0783 1C15.3873 1 22.0483 5.19257 25.2094 11.7826L27.0127 10.9177C23.5188 3.6339 16.1567 -1 8.0783 -1V1Z\"\n          fill=\"black\"\n          mask=\"url(#path-1-outside-1_2667_14687)\"\n        />\n      </mask>\n      <g mask=\"url(#mask0_2667_14687)\">\n        <mask\n          id=\"path-3-outside-2_2667_14687\"\n          maskUnits=\"userSpaceOnUse\"\n          x=\"-1\"\n          y=\"0.0244141\"\n          width=\"60\"\n          height=\"43\"\n          fill=\"black\"\n        >\n          <rect fill=\"white\" x=\"-1\" y=\"0.0244141\" width=\"60\" height=\"43\" />\n          <path d=\"M0 1.02441H7.0783C14.772 1.02441 21.7836 5.43765 25.111 12.3746L33.8889 30.6743C37.2164 37.6112 44.228 42.0244 51.9217 42.0244H59H0L0 1.02441Z\" />\n        </mask>\n        <path\n          d=\"M0 1.02441H7.0783C14.772 1.02441 21.7836 5.43765 25.111 12.3746L33.8889 30.6743C37.2164 37.6112 44.228 42.0244 51.9217 42.0244H59H0L0 1.02441Z\"\n          fill=\"var(--background-color)\"\n        />\n        <path\n          d=\"M0 1.02441L0 0.0244141H-1V1.02441H0ZM0 42.0244H-1V43.0244H0L0 42.0244ZM33.8889 30.6743L32.9873 31.1068L33.8889 30.6743ZM25.111 12.3746L26.0127 11.9421L25.111 12.3746ZM0 2.02441H7.0783V0.0244141H0L0 2.02441ZM59 41.0244H0L0 43.0244H59V41.0244ZM1 42.0244L1 1.02441H-1L-1 42.0244H1ZM24.2094 12.8071L32.9873 31.1068L34.7906 30.2418L26.0127 11.9421L24.2094 12.8071ZM51.9217 43.0244H59V41.0244H51.9217V43.0244ZM32.9873 31.1068C36.4811 38.3905 43.8433 43.0244 51.9217 43.0244V41.0244C44.6127 41.0244 37.9517 36.8318 34.7906 30.2418L32.9873 31.1068ZM7.0783 2.02441C14.3873 2.02441 21.0483 6.21699 24.2094 12.8071L26.0127 11.9421C22.5188 4.65831 15.1567 0.0244141 7.0783 0.0244141V2.02441Z\"\n          fill=\"var(--stroke-color)\"\n          mask=\"url(#path-3-outside-2_2667_14687)\"\n        />\n      </g>\n    </svg>\n  )\n}\n"],"names":["ErrorOverlayPagination","VersionStalenessInfo","ErrorOverlayNav","runtimeErrors","activeIdx","setActiveIndex","versionInfo","isTurbopack","div","data-nextjs-error-overlay-nav","Notch","side","onActiveIndexChange","styles","children","className","data-side","Tail","svg","width","height","viewBox","fill","xmlns","mask","id","style","maskType","maskUnits","x","y","rect","path","d","g"],"mappings":";AAEA,SAASA,sBAAsB,QAAQ,uDAAsD;AAC7F,SAASC,oBAAoB,QAAQ,sDAAqD;AAW1F,OAAO,SAASC,gBAAgB,KAMT;IANS,IAAA,EAC9BC,aAAa,EACbC,SAAS,EACTC,cAAc,EACdC,WAAW,EACXC,WAAW,EACU,GANS;IAO9B,qBACE,MAACC;QAAIC,+BAA6B;;0BAChC,KAACC;gBAAMC,MAAK;0BAEV,cAAA,KAACX;oBACCG,eAAeA,wBAAAA,gBAAiB,EAAE;oBAClCC,WAAWA,oBAAAA,YAAa;oBACxBQ,qBAAqBP,yBAAAA,iBAAmB,KAAO;;;YAGlDC,6BACC,KAACI;gBAAMC,MAAK;0BACV,cAAA,KAACV;oBACCK,aAAaA;oBACbC,aAAaA;;;;;AAMzB;AAEA,OAAO,MAAMM,SAAU,u2CA4DtB;AAED,SAASH,MAAM,KAMd;IANc,IAAA,EACbI,QAAQ,EACRH,OAAO,MAAM,EAId,GANc;IAOb,qBACE,MAACH;QAAIO,WAAU;QAAsBC,aAAWL;;YAC7CG;0BACD,KAACG;;;AAGP;AAEA,SAASA;IACP,qBACE,MAACC;QACCC,OAAM;QACNC,QAAO;QACPC,SAAQ;QACRC,MAAK;QACLC,OAAM;QACNR,WAAU;;0BAEV,MAACS;gBACCC,IAAG;gBACHC,OAAO;oBACLC,UAAU;gBACZ;gBACAC,WAAU;gBACVC,GAAE;gBACFC,GAAE;gBACFX,OAAM;gBACNC,QAAO;;kCAEP,MAACI;wBACCC,IAAG;wBACHG,WAAU;wBACVC,GAAE;wBACFC,GAAE;wBACFX,OAAM;wBACNC,QAAO;wBACPE,MAAK;;0CAEL,KAACS;gCAAKT,MAAK;gCAAQQ,GAAE;gCAAKX,OAAM;gCAAKC,QAAO;;0CAC5C,KAACY;gCAAKC,GAAE;;;;kCAEV,KAACD;wBACCC,GAAE;wBACFX,MAAK;;kCAEP,KAACU;wBACCC,GAAE;wBACFX,MAAK;wBACLE,MAAK;;;;0BAGT,MAACU;gBAAEV,MAAK;;kCACN,MAACA;wBACCC,IAAG;wBACHG,WAAU;wBACVC,GAAE;wBACFC,GAAE;wBACFX,OAAM;wBACNC,QAAO;wBACPE,MAAK;;0CAEL,KAACS;gCAAKT,MAAK;gCAAQO,GAAE;gCAAKC,GAAE;gCAAYX,OAAM;gCAAKC,QAAO;;0CAC1D,KAACY;gCAAKC,GAAE;;;;kCAEV,KAACD;wBACCC,GAAE;wBACFX,MAAK;;kCAEP,KAACU;wBACCC,GAAE;wBACFX,MAAK;wBACLE,MAAK;;;;;;AAKf"}

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.js

@@ -1,16 +1,5 @@
-import { _ as _tagged_template_literal_loose } from "@swc/helpers/_/_tagged_template_literal_loose";
-function _templateObject() {
-    const data = _tagged_template_literal_loose([
-        "\n  .error-overlay-pagination {\n    -webkit-font-smoothing: antialiased;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    width: fit-content;\n  }\n\n  .error-overlay-pagination-count {\n    color: var(--color-gray-900);\n    text-align: center;\n    font-size: var(--size-font-small);\n    font-weight: 500;\n    line-height: 16px;\n    font-variant-numeric: tabular-nums;\n  }\n\n  .error-overlay-pagination-button {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n\n    width: 24px;\n    height: 24px;\n    background: var(--color-gray-300);\n    flex-shrink: 0;\n\n    border: none;\n    border-radius: var(--rounded-full);\n\n    &:focus-visible {\n      outline: var(--focus-ring);\n    }\n\n    &:not(:disabled):active {\n      background: var(--color-gray-500);\n    }\n\n    &:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n  }\n\n  .error-overlay-pagination-button-icon {\n    color: var(--color-gray-1000);\n  }\n"
-    ]);
-    _templateObject = function() {
-        return data;
-    };
-    return data;
-}
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { startTransition, useCallback, useEffect, useRef, useState } from 'react';
-import { noop as css } from '../../../../utils/noop-template';
 import { LeftArrow } from '../../../icons/left-arrow';
 import { RightArrow } from '../../../icons/right-arrow';
 export function ErrorOverlayPagination(param) {
@@ -145,6 +134,6 @@ export function ErrorOverlayPagination(param) {
         ]
     });
 }
-export const styles = css(_templateObject());
+export const styles = "\n  .error-overlay-pagination {\n    -webkit-font-smoothing: antialiased;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    width: fit-content;\n  }\n\n  .error-overlay-pagination-count {\n    color: var(--color-gray-900);\n    text-align: center;\n    font-size: var(--size-font-small);\n    font-weight: 500;\n    line-height: 16px;\n    font-variant-numeric: tabular-nums;\n  }\n\n  .error-overlay-pagination-button {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n\n    width: 24px;\n    height: 24px;\n    background: var(--color-gray-300);\n    flex-shrink: 0;\n\n    border: none;\n    border-radius: var(--rounded-full);\n\n    &:focus-visible {\n      outline: var(--focus-ring);\n    }\n\n    &:not(:disabled):active {\n      background: var(--color-gray-500);\n    }\n\n    &:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n  }\n\n  .error-overlay-pagination-button-icon {\n    color: var(--color-gray-1000);\n  }\n";
 
 //# sourceMappingURL=error-overlay-pagination.js.map

package/dist/esm/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.tsx"],"sourcesContent":["import {\n  startTransition,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react'\nimport { noop as css } from '../../../../utils/noop-template'\nimport { LeftArrow } from '../../../icons/left-arrow'\nimport { RightArrow } from '../../../icons/right-arrow'\nimport type { ReadyRuntimeError } from '../../../../utils/get-error-by-type'\n\ntype ErrorPaginationProps = {\n  runtimeErrors: ReadyRuntimeError[]\n  activeIdx: number\n  onActiveIndexChange: (index: number) => void\n}\n\nexport function ErrorOverlayPagination({\n  runtimeErrors,\n  activeIdx,\n  onActiveIndexChange,\n}: ErrorPaginationProps) {\n  const handlePrevious = useCallback(\n    () =>\n      startTransition(() => {\n        if (activeIdx > 0) {\n          onActiveIndexChange(Math.max(0, activeIdx - 1))\n        }\n      }),\n    [activeIdx, onActiveIndexChange]\n  )\n\n  const handleNext = useCallback(\n    () =>\n      startTransition(() => {\n        if (activeIdx < runtimeErrors.length - 1) {\n          onActiveIndexChange(\n            Math.max(0, Math.min(runtimeErrors.length - 1, activeIdx + 1))\n          )\n        }\n      }),\n    [activeIdx, runtimeErrors.length, onActiveIndexChange]\n  )\n\n  const buttonLeft = useRef<HTMLButtonElement | null>(null)\n  const buttonRight = useRef<HTMLButtonElement | null>(null)\n\n  const [nav, setNav] = useState<HTMLElement | null>(null)\n  const onNav = useCallback((el: HTMLElement) => {\n    setNav(el)\n  }, [])\n\n  useEffect(() => {\n    if (nav == null) {\n      return\n    }\n\n    const root = nav.getRootNode()\n    const d = self.document\n\n    function handler(e: KeyboardEvent) {\n      if (e.key === 'ArrowLeft') {\n        e.preventDefault()\n        e.stopPropagation()\n        handlePrevious && handlePrevious()\n      } else if (e.key === 'ArrowRight') {\n        e.preventDefault()\n        e.stopPropagation()\n        handleNext && handleNext()\n      }\n    }\n\n    root.addEventListener('keydown', handler as EventListener)\n    if (root !== d) {\n      d.addEventListener('keydown', handler)\n    }\n    return function () {\n      root.removeEventListener('keydown', handler as EventListener)\n      if (root !== d) {\n        d.removeEventListener('keydown', handler)\n      }\n    }\n  }, [nav, handleNext, handlePrevious])\n\n  // Unlock focus for browsers like Firefox, that break all user focus if the\n  // currently focused item becomes disabled.\n  useEffect(() => {\n    if (nav == null) {\n      return\n    }\n\n    const root = nav.getRootNode()\n    // Always true, but we do this for TypeScript:\n    if (root instanceof ShadowRoot) {\n      const a = root.activeElement\n\n      if (activeIdx === 0) {\n        if (buttonLeft.current && a === buttonLeft.current) {\n          buttonLeft.current.blur()\n        }\n      } else if (activeIdx === runtimeErrors.length - 1) {\n        if (buttonRight.current && a === buttonRight.current) {\n          buttonRight.current.blur()\n        }\n      }\n    }\n  }, [nav, activeIdx, runtimeErrors.length])\n\n  return (\n    <nav\n      className=\"error-overlay-pagination dialog-exclude-closing-from-outside-click\"\n      ref={onNav}\n    >\n      <button\n        ref={buttonLeft}\n        type=\"button\"\n        disabled={activeIdx === 0}\n        aria-disabled={activeIdx === 0}\n        onClick={handlePrevious}\n        data-nextjs-dialog-error-previous\n        className=\"error-overlay-pagination-button\"\n      >\n        <LeftArrow\n          title=\"previous\"\n          className=\"error-overlay-pagination-button-icon\"\n        />\n      </button>\n      <div className=\"error-overlay-pagination-count\">\n        <span data-nextjs-dialog-error-index={activeIdx}>{activeIdx + 1}/</span>\n        <span data-nextjs-dialog-header-total-count>\n          {/* Display 1 out of 1 if there are no errors (e.g. for build errors). */}\n          {runtimeErrors.length || 1}\n        </span>\n      </div>\n      <button\n        ref={buttonRight}\n        type=\"button\"\n        // If no errors or the last error is active, disable the button.\n        disabled={activeIdx >= runtimeErrors.length - 1}\n        aria-disabled={activeIdx >= runtimeErrors.length - 1}\n        onClick={handleNext}\n        data-nextjs-dialog-error-next\n        className=\"error-overlay-pagination-button\"\n      >\n        <RightArrow\n          title=\"next\"\n          className=\"error-overlay-pagination-button-icon\"\n        />\n      </button>\n    </nav>\n  )\n}\n\nexport const styles = css`\n  .error-overlay-pagination {\n    -webkit-font-smoothing: antialiased;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    width: fit-content;\n  }\n\n  .error-overlay-pagination-count {\n    color: var(--color-gray-900);\n    text-align: center;\n    font-size: var(--size-font-small);\n    font-weight: 500;\n    line-height: 16px;\n    font-variant-numeric: tabular-nums;\n  }\n\n  .error-overlay-pagination-button {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n\n    width: 24px;\n    height: 24px;\n    background: var(--color-gray-300);\n    flex-shrink: 0;\n\n    border: none;\n    border-radius: var(--rounded-full);\n\n    &:focus-visible {\n      outline: var(--focus-ring);\n    }\n\n    &:not(:disabled):active {\n      background: var(--color-gray-500);\n    }\n\n    &:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n  }\n\n  .error-overlay-pagination-button-icon {\n    color: var(--color-gray-1000);\n  }\n`\n"],"names":["startTransition","useCallback","useEffect","useRef","useState","noop","css","LeftArrow","RightArrow","ErrorOverlayPagination","runtimeErrors","activeIdx","onActiveIndexChange","handlePrevious","Math","max","handleNext","length","min","buttonLeft","buttonRight","nav","setNav","onNav","el","root","getRootNode","d","self","document","handler","e","key","preventDefault","stopPropagation","addEventListener","removeEventListener","ShadowRoot","a","activeElement","current","blur","className","ref","button","type","disabled","aria-disabled","onClick","data-nextjs-dialog-error-previous","title","div","span","data-nextjs-dialog-error-index","data-nextjs-dialog-header-total-count","data-nextjs-dialog-error-next","styles"],"mappings":";;;;;;;;;;;AAAA,SACEA,eAAe,EACfC,WAAW,EACXC,SAAS,EACTC,MAAM,EACNC,QAAQ,QACH,QAAO;AACd,SAASC,QAAQC,GAAG,QAAQ,kCAAiC;AAC7D,SAASC,SAAS,QAAQ,4BAA2B;AACrD,SAASC,UAAU,QAAQ,6BAA4B;AASvD,OAAO,SAASC,uBAAuB,KAIhB;IAJgB,IAAA,EACrCC,aAAa,EACbC,SAAS,EACTC,mBAAmB,EACE,GAJgB;IAKrC,MAAMC,iBAAiBZ,YACrB,IACED,gBAAgB;YACd,IAAIW,YAAY,GAAG;gBACjBC,oBAAoBE,KAAKC,GAAG,CAAC,GAAGJ,YAAY;YAC9C;QACF,IACF;QAACA;QAAWC;KAAoB;IAGlC,MAAMI,aAAaf,YACjB,IACED,gBAAgB;YACd,IAAIW,YAAYD,cAAcO,MAAM,GAAG,GAAG;gBACxCL,oBACEE,KAAKC,GAAG,CAAC,GAAGD,KAAKI,GAAG,CAACR,cAAcO,MAAM,GAAG,GAAGN,YAAY;YAE/D;QACF,IACF;QAACA;QAAWD,cAAcO,MAAM;QAAEL;KAAoB;IAGxD,MAAMO,aAAahB,OAAiC;IACpD,MAAMiB,cAAcjB,OAAiC;IAErD,MAAM,CAACkB,KAAKC,OAAO,GAAGlB,SAA6B;IACnD,MAAMmB,QAAQtB,YAAY,CAACuB;QACzBF,OAAOE;IACT,GAAG,EAAE;IAELtB,UAAU;QACR,IAAImB,OAAO,MAAM;YACf;QACF;QAEA,MAAMI,OAAOJ,IAAIK,WAAW;QAC5B,MAAMC,IAAIC,KAAKC,QAAQ;QAEvB,SAASC,QAAQC,CAAgB;YAC/B,IAAIA,EAAEC,GAAG,KAAK,aAAa;gBACzBD,EAAEE,cAAc;gBAChBF,EAAEG,eAAe;gBACjBrB,kBAAkBA;YACpB,OAAO,IAAIkB,EAAEC,GAAG,KAAK,cAAc;gBACjCD,EAAEE,cAAc;gBAChBF,EAAEG,eAAe;gBACjBlB,cAAcA;YAChB;QACF;QAEAS,KAAKU,gBAAgB,CAAC,WAAWL;QACjC,IAAIL,SAASE,GAAG;YACdA,EAAEQ,gBAAgB,CAAC,WAAWL;QAChC;QACA,OAAO;YACLL,KAAKW,mBAAmB,CAAC,WAAWN;YACpC,IAAIL,SAASE,GAAG;gBACdA,EAAES,mBAAmB,CAAC,WAAWN;YACnC;QACF;IACF,GAAG;QAACT;QAAKL;QAAYH;KAAe;IAEpC,2EAA2E;IAC3E,2CAA2C;IAC3CX,UAAU;QACR,IAAImB,OAAO,MAAM;YACf;QACF;QAEA,MAAMI,OAAOJ,IAAIK,WAAW;QAC5B,8CAA8C;QAC9C,IAAID,gBAAgBY,YAAY;YAC9B,MAAMC,IAAIb,KAAKc,aAAa;YAE5B,IAAI5B,cAAc,GAAG;gBACnB,IAAIQ,WAAWqB,OAAO,IAAIF,MAAMnB,WAAWqB,OAAO,EAAE;oBAClDrB,WAAWqB,OAAO,CAACC,IAAI;gBACzB;YACF,OAAO,IAAI9B,cAAcD,cAAcO,MAAM,GAAG,GAAG;gBACjD,IAAIG,YAAYoB,OAAO,IAAIF,MAAMlB,YAAYoB,OAAO,EAAE;oBACpDpB,YAAYoB,OAAO,CAACC,IAAI;gBAC1B;YACF;QACF;IACF,GAAG;QAACpB;QAAKV;QAAWD,cAAcO,MAAM;KAAC;IAEzC,qBACE,MAACI;QACCqB,WAAU;QACVC,KAAKpB;;0BAEL,KAACqB;gBACCD,KAAKxB;gBACL0B,MAAK;gBACLC,UAAUnC,cAAc;gBACxBoC,iBAAepC,cAAc;gBAC7BqC,SAASnC;gBACToC,mCAAiC;gBACjCP,WAAU;0BAEV,cAAA,KAACnC;oBACC2C,OAAM;oBACNR,WAAU;;;0BAGd,MAACS;gBAAIT,WAAU;;kCACb,MAACU;wBAAKC,kCAAgC1C;;4BAAYA,YAAY;4BAAE;;;kCAChE,KAACyC;wBAAKE,uCAAqC;kCAExC5C,cAAcO,MAAM,IAAI;;;;0BAG7B,KAAC2B;gBACCD,KAAKvB;gBACLyB,MAAK;gBACL,gEAAgE;gBAChEC,UAAUnC,aAAaD,cAAcO,MAAM,GAAG;gBAC9C8B,iBAAepC,aAAaD,cAAcO,MAAM,GAAG;gBACnD+B,SAAShC;gBACTuC,+BAA6B;gBAC7Bb,WAAU;0BAEV,cAAA,KAAClC;oBACC0C,OAAM;oBACNR,WAAU;;;;;AAKpB;AAEA,OAAO,MAAMc,SAASlD,uBAiDrB"}
+{"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/error-overlay-pagination/error-overlay-pagination.tsx"],"sourcesContent":["import {\n  startTransition,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from 'react'\nimport { LeftArrow } from '../../../icons/left-arrow'\nimport { RightArrow } from '../../../icons/right-arrow'\nimport type { ReadyRuntimeError } from '../../../../utils/get-error-by-type'\n\ntype ErrorPaginationProps = {\n  runtimeErrors: ReadyRuntimeError[]\n  activeIdx: number\n  onActiveIndexChange: (index: number) => void\n}\n\nexport function ErrorOverlayPagination({\n  runtimeErrors,\n  activeIdx,\n  onActiveIndexChange,\n}: ErrorPaginationProps) {\n  const handlePrevious = useCallback(\n    () =>\n      startTransition(() => {\n        if (activeIdx > 0) {\n          onActiveIndexChange(Math.max(0, activeIdx - 1))\n        }\n      }),\n    [activeIdx, onActiveIndexChange]\n  )\n\n  const handleNext = useCallback(\n    () =>\n      startTransition(() => {\n        if (activeIdx < runtimeErrors.length - 1) {\n          onActiveIndexChange(\n            Math.max(0, Math.min(runtimeErrors.length - 1, activeIdx + 1))\n          )\n        }\n      }),\n    [activeIdx, runtimeErrors.length, onActiveIndexChange]\n  )\n\n  const buttonLeft = useRef<HTMLButtonElement | null>(null)\n  const buttonRight = useRef<HTMLButtonElement | null>(null)\n\n  const [nav, setNav] = useState<HTMLElement | null>(null)\n  const onNav = useCallback((el: HTMLElement) => {\n    setNav(el)\n  }, [])\n\n  useEffect(() => {\n    if (nav == null) {\n      return\n    }\n\n    const root = nav.getRootNode()\n    const d = self.document\n\n    function handler(e: KeyboardEvent) {\n      if (e.key === 'ArrowLeft') {\n        e.preventDefault()\n        e.stopPropagation()\n        handlePrevious && handlePrevious()\n      } else if (e.key === 'ArrowRight') {\n        e.preventDefault()\n        e.stopPropagation()\n        handleNext && handleNext()\n      }\n    }\n\n    root.addEventListener('keydown', handler as EventListener)\n    if (root !== d) {\n      d.addEventListener('keydown', handler)\n    }\n    return function () {\n      root.removeEventListener('keydown', handler as EventListener)\n      if (root !== d) {\n        d.removeEventListener('keydown', handler)\n      }\n    }\n  }, [nav, handleNext, handlePrevious])\n\n  // Unlock focus for browsers like Firefox, that break all user focus if the\n  // currently focused item becomes disabled.\n  useEffect(() => {\n    if (nav == null) {\n      return\n    }\n\n    const root = nav.getRootNode()\n    // Always true, but we do this for TypeScript:\n    if (root instanceof ShadowRoot) {\n      const a = root.activeElement\n\n      if (activeIdx === 0) {\n        if (buttonLeft.current && a === buttonLeft.current) {\n          buttonLeft.current.blur()\n        }\n      } else if (activeIdx === runtimeErrors.length - 1) {\n        if (buttonRight.current && a === buttonRight.current) {\n          buttonRight.current.blur()\n        }\n      }\n    }\n  }, [nav, activeIdx, runtimeErrors.length])\n\n  return (\n    <nav\n      className=\"error-overlay-pagination dialog-exclude-closing-from-outside-click\"\n      ref={onNav}\n    >\n      <button\n        ref={buttonLeft}\n        type=\"button\"\n        disabled={activeIdx === 0}\n        aria-disabled={activeIdx === 0}\n        onClick={handlePrevious}\n        data-nextjs-dialog-error-previous\n        className=\"error-overlay-pagination-button\"\n      >\n        <LeftArrow\n          title=\"previous\"\n          className=\"error-overlay-pagination-button-icon\"\n        />\n      </button>\n      <div className=\"error-overlay-pagination-count\">\n        <span data-nextjs-dialog-error-index={activeIdx}>{activeIdx + 1}/</span>\n        <span data-nextjs-dialog-header-total-count>\n          {/* Display 1 out of 1 if there are no errors (e.g. for build errors). */}\n          {runtimeErrors.length || 1}\n        </span>\n      </div>\n      <button\n        ref={buttonRight}\n        type=\"button\"\n        // If no errors or the last error is active, disable the button.\n        disabled={activeIdx >= runtimeErrors.length - 1}\n        aria-disabled={activeIdx >= runtimeErrors.length - 1}\n        onClick={handleNext}\n        data-nextjs-dialog-error-next\n        className=\"error-overlay-pagination-button\"\n      >\n        <RightArrow\n          title=\"next\"\n          className=\"error-overlay-pagination-button-icon\"\n        />\n      </button>\n    </nav>\n  )\n}\n\nexport const styles = `\n  .error-overlay-pagination {\n    -webkit-font-smoothing: antialiased;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    gap: 8px;\n    width: fit-content;\n  }\n\n  .error-overlay-pagination-count {\n    color: var(--color-gray-900);\n    text-align: center;\n    font-size: var(--size-font-small);\n    font-weight: 500;\n    line-height: 16px;\n    font-variant-numeric: tabular-nums;\n  }\n\n  .error-overlay-pagination-button {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n\n    width: 24px;\n    height: 24px;\n    background: var(--color-gray-300);\n    flex-shrink: 0;\n\n    border: none;\n    border-radius: var(--rounded-full);\n\n    &:focus-visible {\n      outline: var(--focus-ring);\n    }\n\n    &:not(:disabled):active {\n      background: var(--color-gray-500);\n    }\n\n    &:disabled {\n      opacity: 0.5;\n      cursor: not-allowed;\n    }\n  }\n\n  .error-overlay-pagination-button-icon {\n    color: var(--color-gray-1000);\n  }\n`\n"],"names":["startTransition","useCallback","useEffect","useRef","useState","LeftArrow","RightArrow","ErrorOverlayPagination","runtimeErrors","activeIdx","onActiveIndexChange","handlePrevious","Math","max","handleNext","length","min","buttonLeft","buttonRight","nav","setNav","onNav","el","root","getRootNode","d","self","document","handler","e","key","preventDefault","stopPropagation","addEventListener","removeEventListener","ShadowRoot","a","activeElement","current","blur","className","ref","button","type","disabled","aria-disabled","onClick","data-nextjs-dialog-error-previous","title","div","span","data-nextjs-dialog-error-index","data-nextjs-dialog-header-total-count","data-nextjs-dialog-error-next","styles"],"mappings":";AAAA,SACEA,eAAe,EACfC,WAAW,EACXC,SAAS,EACTC,MAAM,EACNC,QAAQ,QACH,QAAO;AACd,SAASC,SAAS,QAAQ,4BAA2B;AACrD,SAASC,UAAU,QAAQ,6BAA4B;AASvD,OAAO,SAASC,uBAAuB,KAIhB;IAJgB,IAAA,EACrCC,aAAa,EACbC,SAAS,EACTC,mBAAmB,EACE,GAJgB;IAKrC,MAAMC,iBAAiBV,YACrB,IACED,gBAAgB;YACd,IAAIS,YAAY,GAAG;gBACjBC,oBAAoBE,KAAKC,GAAG,CAAC,GAAGJ,YAAY;YAC9C;QACF,IACF;QAACA;QAAWC;KAAoB;IAGlC,MAAMI,aAAab,YACjB,IACED,gBAAgB;YACd,IAAIS,YAAYD,cAAcO,MAAM,GAAG,GAAG;gBACxCL,oBACEE,KAAKC,GAAG,CAAC,GAAGD,KAAKI,GAAG,CAACR,cAAcO,MAAM,GAAG,GAAGN,YAAY;YAE/D;QACF,IACF;QAACA;QAAWD,cAAcO,MAAM;QAAEL;KAAoB;IAGxD,MAAMO,aAAad,OAAiC;IACpD,MAAMe,cAAcf,OAAiC;IAErD,MAAM,CAACgB,KAAKC,OAAO,GAAGhB,SAA6B;IACnD,MAAMiB,QAAQpB,YAAY,CAACqB;QACzBF,OAAOE;IACT,GAAG,EAAE;IAELpB,UAAU;QACR,IAAIiB,OAAO,MAAM;YACf;QACF;QAEA,MAAMI,OAAOJ,IAAIK,WAAW;QAC5B,MAAMC,IAAIC,KAAKC,QAAQ;QAEvB,SAASC,QAAQC,CAAgB;YAC/B,IAAIA,EAAEC,GAAG,KAAK,aAAa;gBACzBD,EAAEE,cAAc;gBAChBF,EAAEG,eAAe;gBACjBrB,kBAAkBA;YACpB,OAAO,IAAIkB,EAAEC,GAAG,KAAK,cAAc;gBACjCD,EAAEE,cAAc;gBAChBF,EAAEG,eAAe;gBACjBlB,cAAcA;YAChB;QACF;QAEAS,KAAKU,gBAAgB,CAAC,WAAWL;QACjC,IAAIL,SAASE,GAAG;YACdA,EAAEQ,gBAAgB,CAAC,WAAWL;QAChC;QACA,OAAO;YACLL,KAAKW,mBAAmB,CAAC,WAAWN;YACpC,IAAIL,SAASE,GAAG;gBACdA,EAAES,mBAAmB,CAAC,WAAWN;YACnC;QACF;IACF,GAAG;QAACT;QAAKL;QAAYH;KAAe;IAEpC,2EAA2E;IAC3E,2CAA2C;IAC3CT,UAAU;QACR,IAAIiB,OAAO,MAAM;YACf;QACF;QAEA,MAAMI,OAAOJ,IAAIK,WAAW;QAC5B,8CAA8C;QAC9C,IAAID,gBAAgBY,YAAY;YAC9B,MAAMC,IAAIb,KAAKc,aAAa;YAE5B,IAAI5B,cAAc,GAAG;gBACnB,IAAIQ,WAAWqB,OAAO,IAAIF,MAAMnB,WAAWqB,OAAO,EAAE;oBAClDrB,WAAWqB,OAAO,CAACC,IAAI;gBACzB;YACF,OAAO,IAAI9B,cAAcD,cAAcO,MAAM,GAAG,GAAG;gBACjD,IAAIG,YAAYoB,OAAO,IAAIF,MAAMlB,YAAYoB,OAAO,EAAE;oBACpDpB,YAAYoB,OAAO,CAACC,IAAI;gBAC1B;YACF;QACF;IACF,GAAG;QAACpB;QAAKV;QAAWD,cAAcO,MAAM;KAAC;IAEzC,qBACE,MAACI;QACCqB,WAAU;QACVC,KAAKpB;;0BAEL,KAACqB;gBACCD,KAAKxB;gBACL0B,MAAK;gBACLC,UAAUnC,cAAc;gBACxBoC,iBAAepC,cAAc;gBAC7BqC,SAASnC;gBACToC,mCAAiC;gBACjCP,WAAU;0BAEV,cAAA,KAACnC;oBACC2C,OAAM;oBACNR,WAAU;;;0BAGd,MAACS;gBAAIT,WAAU;;kCACb,MAACU;wBAAKC,kCAAgC1C;;4BAAYA,YAAY;4BAAE;;;kCAChE,KAACyC;wBAAKE,uCAAqC;kCAExC5C,cAAcO,MAAM,IAAI;;;;0BAG7B,KAAC2B;gBACCD,KAAKvB;gBACLyB,MAAK;gBACL,gEAAgE;gBAChEC,UAAUnC,aAAaD,cAAcO,MAAM,GAAG;gBAC9C8B,iBAAepC,aAAaD,cAAcO,MAAM,GAAG;gBACnD+B,SAAShC;gBACTuC,+BAA6B;gBAC7Bb,WAAU;0BAEV,cAAA,KAAClC;oBACC0C,OAAM;oBACNR,WAAU;;;;;AAKpB;AAEA,OAAO,MAAMc,SAAU,igCAiDtB"}