npm - next - Versions diffs - 15.4.0-canary.19 → 15.4.0-canary.20 - Mend

next 15.4.0-canary.19 → 15.4.0-canary.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (57) hide show

package/dist/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/draggable.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../../../../../src/client/components/react-dev-overlay/ui/components/errors/dev-tools-indicator/draggable.tsx"],"sourcesContent":["import { useRef } from 'react'\n\ninterface Point {\n x: number\n y: number\n}\n\ntype Corners = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\n\ninterface Corner {\n corner: Corners\n translation: Point\n}\n\nexport function Draggable({\n children,\n padding,\n position: currentCorner,\n setPosition: setCurrentCorner,\n onDragStart,\n}: {\n children: React.ReactElement\n position: Corners\n padding: number\n setPosition: (position: Corners) => void\n onDragStart?: () => void\n}) {\n const { ref, animate, ...drag } = useDrag({\n threshold: 5,\n onDragStart,\n onDragEnd,\n onAnimationEnd,\n })\n\n function onDragEnd(translation: Point, velocity: Point) {\n const projectedPosition = {\n x: translation.x + project(velocity.x),\n y: translation.y + project(velocity.y),\n }\n const nearestCorner = getNearestCorner(projectedPosition)\n animate(nearestCorner)\n }\n\n function onAnimationEnd({ corner }: Corner) {\n // Unset drag translation\n setTimeout(() => {\n ref.current?.style.removeProperty('translate')\n setCurrentCorner(corner)\n })\n }\n\n function getNearestCorner({ x, y }: Point): Corner {\n const allCorners = getCorners()\n const distances = Object.entries(allCorners).map(([key, translation]) => {\n const distance = Math.sqrt(\n (x - translation.x) ** 2 + (y - translation.y) ** 2\n )\n return { key, distance }\n })\n const min = Math.min(...distances.map((d) => d.distance))\n const nearest = distances.find((d) => d.distance === min)\n if (!nearest) {\n // Safety fallback\n return { corner: currentCorner, translation: allCorners[currentCorner] }\n }\n return {\n translation: allCorners[nearest.key as Corners],\n corner: nearest.key as Corners,\n }\n }\n\n function getCorners(): Record<Corners, Point> {\n const offset = padding * 2\n const triggerWidth = ref.current?.offsetWidth || 0\n const triggerHeight = ref.current?.offsetHeight || 0\n\n function getAbsolutePosition(corner: Corners) {\n const isRight = corner.includes('right')\n const isBottom = corner.includes('bottom')\n\n return {\n x: isRight ? window.innerWidth - offset - triggerWidth : 0,\n y: isBottom ? window.innerHeight - offset - triggerHeight : 0,\n }\n }\n\n const basePosition = getAbsolutePosition(currentCorner)\n\n // Calculate all corner positions relative to the current corner\n return {\n 'top-left': {\n x: 0 - basePosition.x,\n y: 0 - basePosition.y,\n },\n 'top-right': {\n x: window.innerWidth - offset - triggerWidth - basePosition.x,\n y: 0 - basePosition.y,\n },\n 'bottom-left': {\n x: 0 - basePosition.x,\n y: window.innerHeight - offset - triggerHeight - basePosition.y,\n },\n 'bottom-right': {\n x: window.innerWidth - offset - triggerWidth - basePosition.x,\n y: window.innerHeight - offset - triggerHeight - basePosition.y,\n },\n }\n }\n\n return (\n <div ref={ref} {...drag} style={{ touchAction: 'none' }}>\n {children}\n </div>\n )\n}\n\ninterface UseDragOptions {\n onDragStart?: () => void\n onDrag?: (translation: Point) => void\n onDragEnd?: (translation: Point, velocity: Point) => void\n onAnimationEnd?: (corner: Corner) => void\n threshold: number // Minimum movement before drag starts\n}\n\ninterface Velocity {\n position: Point\n timestamp: number\n}\n\nexport function useDrag(options: UseDragOptions) {\n const ref = useRef<HTMLDivElement>(null)\n const state = useRef<'idle' | 'press' | 'drag' | 'drag-end'>('idle')\n\n const origin = useRef<Point>({ x: 0, y: 0 })\n const translation = useRef<Point>({ x: 0, y: 0 })\n const lastTimestamp = useRef(0)\n const velocities = useRef<Velocity[]>([])\n\n function set(position: Point) {\n if (ref.current) {\n translation.current = position\n ref.current.style.translate = `${position.x}px ${position.y}px`\n }\n }\n\n function animate(corner: Corner) {\n const el = ref.current\n if (el === null) return\n\n function listener(e: TransitionEvent) {\n if (e.propertyName === 'translate') {\n options.onAnimationEnd?.(corner)\n translation.current = { x: 0, y: 0 }\n el!.style.transition = ''\n el!.removeEventListener('transitionend', listener)\n }\n }\n\n // Generated from https://www.easing.dev/spring\n el.style.transition = 'translate 491.22ms var(--timing-bounce)'\n el.addEventListener('transitionend', listener)\n set(corner.translation)\n }\n\n function onClick(e: MouseEvent) {\n if (state.current === 'drag-end') {\n e.preventDefault()\n e.stopPropagation()\n state.current = 'idle'\n ref.current?.removeEventListener('click', onClick)\n }\n }\n\n function onPointerDown(e: React.PointerEvent) {\n origin.current = { x: e.clientX, y: e.clientY }\n state.current = 'press'\n window.addEventListener('pointermove', onPointerMove)\n window.addEventListener('pointerup', onPointerUp)\n ref.current?.addEventListener('click', onClick)\n }\n\n function onPointerMove(e: PointerEvent) {\n if (state.current === 'press') {\n const dx = e.clientX - origin.current.x\n const dy = e.clientY - origin.current.y\n const distance = Math.sqrt(dx * dx + dy * dy)\n\n if (distance >= options.threshold) {\n state.current = 'drag'\n ref.current?.setPointerCapture(e.pointerId)\n ref.current?.classList.add('dev-tools-grabbing')\n options.onDragStart?.()\n }\n }\n\n if (state.current !== 'drag') return\n\n const currentPosition = { x: e.clientX, y: e.clientY }\n\n const dx = currentPosition.x - origin.current.x\n const dy = currentPosition.y - origin.current.y\n origin.current = currentPosition\n\n const newTranslation = {\n x: translation.current.x + dx,\n y: translation.current.y + dy,\n }\n\n set(newTranslation)\n\n // Keep a history of recent positions for velocity calculation\n // Only store points that are at least 10ms apart to avoid too many samples\n const now = Date.now()\n const shouldAddToHistory = now - lastTimestamp.current >= 10\n if (shouldAddToHistory) {\n velocities.current = [\n ...velocities.current.slice(-5),\n { position: currentPosition, timestamp: now },\n ]\n }\n\n lastTimestamp.current = now\n options.onDrag?.(translation.current)\n }\n\n function onPointerUp(e: PointerEvent) {\n state.current = state.current === 'drag' ? 'drag-end' : 'idle'\n\n window.removeEventListener('pointermove', onPointerMove)\n window.removeEventListener('pointerup', onPointerUp)\n\n const velocity = calculateVelocity(velocities.current)\n velocities.current = []\n\n ref.current?.classList.remove('dev-tools-grabbing')\n ref.current?.releasePointerCapture(e.pointerId)\n options.onDragEnd?.(translation.current, velocity)\n }\n\n return {\n ref,\n onPointerDown,\n animate,\n }\n}\n\nfunction calculateVelocity(\n history: Array<{ position: Point; timestamp: number }>\n): Point {\n if (history.length < 2) {\n return { x: 0, y: 0 }\n }\n\n const oldestPoint = history[0]\n const latestPoint = history[history.length - 1]\n\n const timeDelta = latestPoint.timestamp - oldestPoint.timestamp\n\n if (timeDelta === 0) {\n return { x: 0, y: 0 }\n }\n\n // Calculate pixels per millisecond\n const velocityX =\n (latestPoint.position.x - oldestPoint.position.x) / timeDelta\n const velocityY =\n (latestPoint.position.y - oldestPoint.position.y) / timeDelta\n\n // Convert to pixels per second for more intuitive values\n return {\n x: velocityX * 1000,\n y: velocityY * 1000,\n }\n}\n\nfunction project(initialVelocity: number, decelerationRate = 0.999) {\n return ((initialVelocity / 1000) * decelerationRate) / (1 - decelerationRate)\n}\n"],"names":["Draggable","useDrag","children","padding","position","currentCorner","setPosition","setCurrentCorner","onDragStart","ref","animate","drag","threshold","onDragEnd","onAnimationEnd","translation","velocity","projectedPosition","x","project","y","nearestCorner","getNearestCorner","corner","setTimeout","current","style","removeProperty","allCorners","getCorners","distances","Object","entries","map","key","distance","Math","sqrt","min","d","nearest","find","offset","triggerWidth","offsetWidth","triggerHeight","offsetHeight","getAbsolutePosition","isRight","includes","isBottom","window","innerWidth","innerHeight","basePosition","div","touchAction","options","useRef","state","origin","lastTimestamp","velocities","set","translate","el","listener","e","propertyName","transition","removeEventListener","addEventListener","onClick","preventDefault","stopPropagation","onPointerDown","clientX","clientY","onPointerMove","onPointerUp","dx","dy","setPointerCapture","pointerId","classList","add","currentPosition","newTranslation","now","Date","shouldAddToHistory","slice","timestamp","onDrag","calculateVelocity","remove","releasePointerCapture","history","length","oldestPoint","latestPoint","timeDelta","velocityX","velocityY","initialVelocity","decelerationRate"],"mappings":"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","ignoreList":[0]}

package/dist/client/components/react-dev-overlay/ui/components/fader/index.d.ts CHANGED Viewed

@@ -7,4 +7,4 @@ export declare const Fader: import("react").ForwardRefExoticComponent<{
     className?: string;
     style?: CSSProperties;
 } & import("react").RefAttributes<HTMLDivElement>>;
-export declare const FADER_STYLES = "\n  .nextjs-scroll-fader {\n    --blur: 1px;\n    --stop: 25%;\n    --height: 150px;\n    --color-bg: var(--color-background-100);\n    position: absolute;\n    pointer-events: none;\n    user-select: none;\n    width: 100%;\n    height: var(--height);\n    left: 0;\n    backdrop-filter: blur(var(--blur));\n\n    &[data-side=\"top\"] {\n      top: 0;\n      background: linear-gradient(to top, transparent, var(--color-bg));\n      mask-image: linear-gradient(to bottom, var(--color-bg) var(--stop), transparent);\n    }\n  }\n\n";
+export declare const FADER_STYLES = "\n  .nextjs-scroll-fader {\n    --blur: 1px;\n    --stop: 25%;\n    --height: 150px;\n    --color-bg: var(--color-background-100);\n    position: absolute;\n    pointer-events: none;\n    user-select: none;\n    width: 100%;\n    height: var(--height);\n    left: 0;\n    backdrop-filter: blur(var(--blur));\n\n    &[data-side=\"top\"] {\n      top: 0;\n      background: linear-gradient(to top, transparent, var(--color-bg));\n      mask-image: linear-gradient(to bottom, var(--color-bg) var(--stop), transparent);\n    }\n  }\n";

package/dist/client/components/react-dev-overlay/ui/components/fader/index.js CHANGED Viewed

@@ -38,7 +38,7 @@ const Fader = /*#__PURE__*/ (0, _react.forwardRef)(function Fader(param, ref) {
         }
     });
 });
-const FADER_STYLES = '\n  .nextjs-scroll-fader {\n    --blur: 1px;\n    --stop: 25%;\n    --height: 150px;\n    --color-bg: var(--color-background-100);\n    position: absolute;\n    pointer-events: none;\n    user-select: none;\n    width: 100%;\n    height: var(--height);\n    left: 0;\n    backdrop-filter: blur(var(--blur));\n\n    &[data-side="top"] {\n      top: 0;\n      background: linear-gradient(to top, transparent, var(--color-bg));\n      mask-image: linear-gradient(to bottom, var(--color-bg) var(--stop), transparent);\n    }\n  }\n\n';
+const FADER_STYLES = '\n  .nextjs-scroll-fader {\n    --blur: 1px;\n    --stop: 25%;\n    --height: 150px;\n    --color-bg: var(--color-background-100);\n    position: absolute;\n    pointer-events: none;\n    user-select: none;\n    width: 100%;\n    height: var(--height);\n    left: 0;\n    backdrop-filter: blur(var(--blur));\n\n    &[data-side="top"] {\n      top: 0;\n      background: linear-gradient(to top, transparent, var(--color-bg));\n      mask-image: linear-gradient(to bottom, var(--color-bg) var(--stop), transparent);\n    }\n  }\n';
 if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
   Object.defineProperty(exports.default, '__esModule', { value: true });

package/dist/client/components/react-dev-overlay/ui/components/fader/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/ui/components/fader/index.tsx"],"sourcesContent":["import { type CSSProperties, type Ref, forwardRef } from 'react'\n\nexport const Fader = forwardRef(function Fader(\n {\n stop,\n blur,\n side,\n style,\n height,\n }: {\n stop?: string\n blur?: string\n height?: number\n side: 'top' \| 'bottom' \| 'left' \| 'right'\n className?: string\n style?: CSSProperties\n },\n ref: Ref<HTMLDivElement>\n) {\n return (\n <div\n ref={ref}\n aria-hidden\n data-nextjs-scroll-fader\n className=\"nextjs-scroll-fader\"\n data-side={side}\n style={\n {\n '--stop': stop,\n '--blur': blur,\n '--height': `${height}px`,\n ...style,\n } as React.CSSProperties\n }\n />\n )\n})\n\nexport const FADER_STYLES = `\n .nextjs-scroll-fader {\n --blur: 1px;\n --stop: 25%;\n --height: 150px;\n --color-bg: var(--color-background-100);\n position: absolute;\n pointer-events: none;\n user-select: none;\n width: 100%;\n height: var(--height);\n left: 0;\n backdrop-filter: blur(var(--blur));\n\n &[data-side=\"top\"] {\n top: 0;\n background: linear-gradient(to top, transparent, var(--color-bg));\n mask-image: linear-gradient(to bottom, var(--color-bg) var(--stop), transparent);\n }\n }\n\n`\n"],"names":["FADER_STYLES","Fader","forwardRef","ref","stop","blur","side","style","height","div","aria-hidden","data-nextjs-scroll-fader","className","data-side"],"mappings":";;;;;;;;;;;;;;;IAsCaA,YAAY;eAAZA;;IApCAC,KAAK;eAALA;;;;uBAF4C;AAElD,MAAMA,sBAAQC,IAAAA,iBAAU,EAAC,SAASD,MACvC,KAaC,EACDE,GAAwB;IAdxB,IAAA,EACEC,IAAI,EACJC,IAAI,EACJC,IAAI,EACJC,KAAK,EACLC,MAAM,EAQP,GAbD;IAgBA,qBACE,qBAACC;QACCN,KAAKA;QACLO,aAAW;QACXC,0BAAwB;QACxBC,WAAU;QACVC,aAAWP;QACXC,OACE;YACE,UAAUH;YACV,UAAUC;YACV,YAAY,AAAC,KAAEG,SAAO;YACtB,GAAGD,KAAK;QACV;;AAIR;AAEO,MAAMP,eAAgB","ignoreList":[0]}
1	+ {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/ui/components/fader/index.tsx"],"sourcesContent":["import { type CSSProperties, type Ref, forwardRef } from 'react'\n\nexport const Fader = forwardRef(function Fader(\n {\n stop,\n blur,\n side,\n style,\n height,\n }: {\n stop?: string\n blur?: string\n height?: number\n side: 'top' \| 'bottom' \| 'left' \| 'right'\n className?: string\n style?: CSSProperties\n },\n ref: Ref<HTMLDivElement>\n) {\n return (\n <div\n ref={ref}\n aria-hidden\n data-nextjs-scroll-fader\n className=\"nextjs-scroll-fader\"\n data-side={side}\n style={\n {\n '--stop': stop,\n '--blur': blur,\n '--height': `${height}px`,\n ...style,\n } as React.CSSProperties\n }\n />\n )\n})\n\nexport const FADER_STYLES = `\n .nextjs-scroll-fader {\n --blur: 1px;\n --stop: 25%;\n --height: 150px;\n --color-bg: var(--color-background-100);\n position: absolute;\n pointer-events: none;\n user-select: none;\n width: 100%;\n height: var(--height);\n left: 0;\n backdrop-filter: blur(var(--blur));\n\n &[data-side=\"top\"] {\n top: 0;\n background: linear-gradient(to top, transparent, var(--color-bg));\n mask-image: linear-gradient(to bottom, var(--color-bg) var(--stop), transparent);\n }\n }\n`\n"],"names":["FADER_STYLES","Fader","forwardRef","ref","stop","blur","side","style","height","div","aria-hidden","data-nextjs-scroll-fader","className","data-side"],"mappings":";;;;;;;;;;;;;;;IAsCaA,YAAY;eAAZA;;IApCAC,KAAK;eAALA;;;;uBAF4C;AAElD,MAAMA,sBAAQC,IAAAA,iBAAU,EAAC,SAASD,MACvC,KAaC,EACDE,GAAwB;IAdxB,IAAA,EACEC,IAAI,EACJC,IAAI,EACJC,IAAI,EACJC,KAAK,EACLC,MAAM,EAQP,GAbD;IAgBA,qBACE,qBAACC;QACCN,KAAKA;QACLO,aAAW;QACXC,0BAAwB;QACxBC,WAAU;QACVC,aAAWP;QACXC,OACE;YACE,UAAUH;YACV,UAAUC;YACV,YAAY,AAAC,KAAEG,SAAO;YACtB,GAAGD,KAAK;QACV;;AAIR;AAEO,MAAMP,eAAgB","ignoreList":[0]}

package/dist/client/components/react-dev-overlay/ui/components/toast/styles.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-declare const styles = "\n  .nextjs-toast {\n    position: fixed;\n    bottom: 16px;\n    left: 16px;\n    max-width: 420px;\n    z-index: 9000;\n    box-shadow: 0px 16px 32px\n      rgba(0, 0, 0, 0.25);\n  }\n\n  @media (max-width: 440px) {\n    .nextjs-toast {\n      max-width: 90vw;\n      left: 5vw;\n    }\n  }\n\n  .nextjs-toast-errors-parent {\n    padding: 16px;\n    border-radius: var(--rounded-4xl);\n    font-weight: 500;\n    color: var(--color-ansi-bright-white);\n    background-color: var(--color-ansi-red);\n  }\n";
+declare const styles = "\n  .nextjs-toast {\n    position: fixed;\n    max-width: 420px;\n    z-index: 9000;\n    box-shadow: 0px 16px 32px\n      rgba(0, 0, 0, 0.25);\n  }\n\n  .nextjs-toast-errors-parent {\n    padding: 16px;\n    border-radius: var(--rounded-4xl);\n    font-weight: 500;\n    color: var(--color-ansi-bright-white);\n    background-color: var(--color-ansi-red);\n  }\n";
 export { styles };

package/dist/client/components/react-dev-overlay/ui/components/toast/styles.js CHANGED Viewed

@@ -8,7 +8,7 @@ Object.defineProperty(exports, "styles", {
         return styles;
     }
 });
-const styles = "\n  .nextjs-toast {\n    position: fixed;\n    bottom: 16px;\n    left: 16px;\n    max-width: 420px;\n    z-index: 9000;\n    box-shadow: 0px 16px 32px\n      rgba(0, 0, 0, 0.25);\n  }\n\n  @media (max-width: 440px) {\n    .nextjs-toast {\n      max-width: 90vw;\n      left: 5vw;\n    }\n  }\n\n  .nextjs-toast-errors-parent {\n    padding: 16px;\n    border-radius: var(--rounded-4xl);\n    font-weight: 500;\n    color: var(--color-ansi-bright-white);\n    background-color: var(--color-ansi-red);\n  }\n";
+const styles = "\n  .nextjs-toast {\n    position: fixed;\n    max-width: 420px;\n    z-index: 9000;\n    box-shadow: 0px 16px 32px\n      rgba(0, 0, 0, 0.25);\n  }\n\n  .nextjs-toast-errors-parent {\n    padding: 16px;\n    border-radius: var(--rounded-4xl);\n    font-weight: 500;\n    color: var(--color-ansi-bright-white);\n    background-color: var(--color-ansi-red);\n  }\n";
 if ((typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) && typeof exports.default.__esModule === 'undefined') {
   Object.defineProperty(exports.default, '__esModule', { value: true });

package/dist/client/components/react-dev-overlay/ui/components/toast/styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/ui/components/toast/styles.ts"],"sourcesContent":["const styles = `\n .nextjs-toast {\n position: fixed;\n ~~bottom: 16px;\n left: 16px;\n~~ max-width: 420px;\n z-index: 9000;\n box-shadow: 0px 16px 32px\n rgba(0, 0, 0, 0.25);\n }\n\n ~~@media (max-width: 440px) {\n~~ .nextjs-toast ~~{\n max~~-~~width: 90vw;\n left: 5vw;\n }\n }\n\n .nextjs-toast-~~errors-parent {\n padding: 16px;\n border-radius: var(--rounded-4xl);\n font-weight: 500;\n color: var(--color-ansi-bright-white);\n background-color: var(--color-ansi-red);\n }\n`\n\nexport { styles }\n"],"names":["styles"],"mappings":";;;;+~~BA2BSA~~;;;eAAAA;;;~~AA3BT~~,MAAMA,SAAU","ignoreList":[0]}
1	+ {"version":3,"sources":["../../../../../../../src/client/components/react-dev-overlay/ui/components/toast/styles.ts"],"sourcesContent":["const styles = `\n .nextjs-toast {\n position: fixed;\n max-width: 420px;\n z-index: 9000;\n box-shadow: 0px 16px 32px\n rgba(0, 0, 0, 0.25);\n }\n\n .nextjs-toast-errors-parent {\n padding: 16px;\n border-radius: var(--rounded-4xl);\n font-weight: 500;\n color: var(--color-ansi-bright-white);\n background-color: var(--color-ansi-red);\n }\n`\n\nexport { styles }\n"],"names":["styles"],"mappings":";;;;+BAkBSA;;;eAAAA;;;AAlBT,MAAMA,SAAU","ignoreList":[0]}

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

@@ -13,7 +13,7 @@ const _jsxruntime = require("react/jsx-runtime");
 const _css = require("../../utils/css");
 function _templateObject() {
     const data = _tagged_template_literal_loose._([
-        "\n        :host {\n          /* \n           * Although the style applied to the shadow host is isolated,\n           * the element that attached the shadow host (i.e. \"nextjs-portal\")\n           * is still affected by the parent's style (e.g. \"body\"). This may\n           * occur style conflicts like \"display: flex\", with other children\n           * elements therefore give the shadow host an absolute position.\n           */\n          position: absolute;\n\n          --color-font: #757575;\n          --color-backdrop: rgba(250, 250, 250, 0.8);\n          --color-border-shadow: rgba(0, 0, 0, 0.145);\n\n          --color-title-color: #1f1f1f;\n          --color-stack-notes: #777;\n\n          --color-accents-1: #808080;\n          --color-accents-2: #222222;\n          --color-accents-3: #404040;\n\n          --font-stack-monospace: '__nextjs-Geist Mono', 'Geist Mono',\n            'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier,\n            monospace;\n          --font-stack-sans: '__nextjs-Geist', 'Geist', -apple-system,\n            'Source Sans Pro', sans-serif;\n\n          font-family: var(--font-stack-sans);\n          font-variant-ligatures: none;\n\n          /* TODO: Remove replaced ones. */\n          --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n          --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1),\n            0 1px 2px -1px rgb(0 0 0 / 0.1);\n          --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1),\n            0 2px 4px -2px rgb(0 0 0 / 0.1);\n          --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n            0 4px 6px -4px rgb(0 0 0 / 0.1);\n          --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),\n            0 8px 10px -6px rgb(0 0 0 / 0.1);\n          --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n          --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n          --shadow-none: 0 0 #0000;\n\n          --shadow-small: 0px 2px 2px rgba(0, 0, 0, 0.04);\n          --shadow-menu: 0px 1px 1px rgba(0, 0, 0, 0.02),\n            0px 4px 8px -4px rgba(0, 0, 0, 0.04),\n            0px 16px 24px -8px rgba(0, 0, 0, 0.06);\n\n          --focus-color: var(--color-blue-800);\n          --focus-ring: 2px solid var(--focus-color);\n\n          --timing-swift: cubic-bezier(0.23, 0.88, 0.26, 0.92);\n          --timing-overlay: cubic-bezier(0.175, 0.885, 0.32, 1.1);\n\n          --rounded-none: 0px;\n          --rounded-sm: 2px;\n          --rounded-md: 4px;\n          --rounded-md-2: 6px;\n          --rounded-lg: 8px;\n          --rounded-xl: 12px;\n          --rounded-2xl: 16px;\n          --rounded-3xl: 24px;\n          --rounded-4xl: 32px;\n          --rounded-full: 9999px;\n\n          /* \n            This value gets set from the Dev Tools preferences,\n            and we use the following --size-* variables to \n            scale the relevant elements.\n\n            The reason why we don't rely on rem values is because\n            if an app sets their root font size to something tiny, \n            it feels unexpected to have the app root size leak \n            into a Next.js surface.\n\n            https://github.com/vercel/next.js/discussions/76812\n          */\n          --nextjs-dev-tools-scale: ",
+        "\n        :host {\n          /* \n           * Although the style applied to the shadow host is isolated,\n           * the element that attached the shadow host (i.e. \"nextjs-portal\")\n           * is still affected by the parent's style (e.g. \"body\"). This may\n           * occur style conflicts like \"display: flex\", with other children\n           * elements therefore give the shadow host an absolute position.\n           */\n          position: absolute;\n\n          --color-font: #757575;\n          --color-backdrop: rgba(250, 250, 250, 0.8);\n          --color-border-shadow: rgba(0, 0, 0, 0.145);\n\n          --color-title-color: #1f1f1f;\n          --color-stack-notes: #777;\n\n          --color-accents-1: #808080;\n          --color-accents-2: #222222;\n          --color-accents-3: #404040;\n\n          --font-stack-monospace: '__nextjs-Geist Mono', 'Geist Mono',\n            'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier,\n            monospace;\n          --font-stack-sans: '__nextjs-Geist', 'Geist', -apple-system,\n            'Source Sans Pro', sans-serif;\n\n          font-family: var(--font-stack-sans);\n          font-variant-ligatures: none;\n\n          /* TODO: Remove replaced ones. */\n          --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n          --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1),\n            0 1px 2px -1px rgb(0 0 0 / 0.1);\n          --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1),\n            0 2px 4px -2px rgb(0 0 0 / 0.1);\n          --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n            0 4px 6px -4px rgb(0 0 0 / 0.1);\n          --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),\n            0 8px 10px -6px rgb(0 0 0 / 0.1);\n          --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n          --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n          --shadow-none: 0 0 #0000;\n\n          --shadow-small: 0px 2px 2px rgba(0, 0, 0, 0.04);\n          --shadow-menu: 0px 1px 1px rgba(0, 0, 0, 0.02),\n            0px 4px 8px -4px rgba(0, 0, 0, 0.04),\n            0px 16px 24px -8px rgba(0, 0, 0, 0.06);\n\n          --focus-color: var(--color-blue-800);\n          --focus-ring: 2px solid var(--focus-color);\n\n          --timing-swift: cubic-bezier(0.23, 0.88, 0.26, 0.92);\n          --timing-overlay: cubic-bezier(0.175, 0.885, 0.32, 1.1);\n          /* prettier-ignore */\n          --timing-bounce: linear(0 0%, 0.005871 1%, 0.022058 2%, 0.046612 3%, 0.077823 4%, 0.114199 5%, 0.154441 6%, 0.197431 7.000000000000001%, 0.242208 8%, 0.287959 9%, 0.333995 10%, 0.379743 11%, 0.424732 12%, 0.46858 13%, 0.510982 14.000000000000002%, 0.551702 15%, 0.590564 16%, 0.627445 17%, 0.662261 18%, 0.694971 19%, 0.725561 20%, 0.754047 21%, 0.780462 22%, 0.804861 23%, 0.82731 24%, 0.847888 25%, 0.866679 26%, 0.883775 27%, 0.899272 28.000000000000004%, 0.913267 28.999999999999996%, 0.925856 30%, 0.937137 31%, 0.947205 32%, 0.956153 33%, 0.96407 34%, 0.971043 35%, 0.977153 36%, 0.982479 37%, 0.987094 38%, 0.991066 39%, 0.994462 40%, 0.997339 41%, 0.999755 42%, 1.001761 43%, 1.003404 44%, 1.004727 45%, 1.00577 46%, 1.006569 47%, 1.007157 48%, 1.007563 49%, 1.007813 50%, 1.007931 51%, 1.007939 52%, 1.007855 53%, 1.007697 54%, 1.007477 55.00000000000001%, 1.00721 56.00000000000001%, 1.006907 56.99999999999999%, 1.006576 57.99999999999999%, 1.006228 59%, 1.005868 60%, 1.005503 61%, 1.005137 62%, 1.004776 63%, 1.004422 64%, 1.004078 65%, 1.003746 66%, 1.003429 67%, 1.003127 68%, 1.00284 69%, 1.002571 70%, 1.002318 71%, 1.002082 72%, 1.001863 73%, 1.00166 74%, 1.001473 75%, 1.001301 76%, 1.001143 77%, 1.001 78%, 1.000869 79%, 1.000752 80%, 1.000645 81%, 1.00055 82%, 1.000464 83%, 1.000388 84%, 1.000321 85%, 1.000261 86%, 1.000209 87%, 1.000163 88%, 1.000123 89%, 1.000088 90%);\n\n          --rounded-none: 0px;\n          --rounded-sm: 2px;\n          --rounded-md: 4px;\n          --rounded-md-2: 6px;\n          --rounded-lg: 8px;\n          --rounded-xl: 12px;\n          --rounded-2xl: 16px;\n          --rounded-3xl: 24px;\n          --rounded-4xl: 32px;\n          --rounded-full: 9999px;\n\n          /* \n            This value gets set from the Dev Tools preferences,\n            and we use the following --size-* variables to \n            scale the relevant elements.\n\n            The reason why we don't rely on rem values is because\n            if an app sets their root font size to something tiny, \n            it feels unexpected to have the app root size leak \n            into a Next.js surface.\n\n            https://github.com/vercel/next.js/discussions/76812\n          */\n          --nextjs-dev-tools-scale: ",
         ";\n          --size-1: calc(1px / var(--nextjs-dev-tools-scale));\n          --size-2: calc(2px / var(--nextjs-dev-tools-scale));\n          --size-3: calc(3px / var(--nextjs-dev-tools-scale));\n          --size-4: calc(4px / var(--nextjs-dev-tools-scale));\n          --size-5: calc(5px / var(--nextjs-dev-tools-scale));\n          --size-6: calc(6px / var(--nextjs-dev-tools-scale));\n          --size-7: calc(7px / var(--nextjs-dev-tools-scale));\n          --size-8: calc(8px / var(--nextjs-dev-tools-scale));\n          --size-9: calc(9px / var(--nextjs-dev-tools-scale));\n          --size-10: calc(10px / var(--nextjs-dev-tools-scale));\n          --size-11: calc(11px / var(--nextjs-dev-tools-scale));\n          --size-12: calc(12px / var(--nextjs-dev-tools-scale));\n          --size-13: calc(13px / var(--nextjs-dev-tools-scale));\n          --size-14: calc(14px / var(--nextjs-dev-tools-scale));\n          --size-15: calc(15px / var(--nextjs-dev-tools-scale));\n          --size-16: calc(16px / var(--nextjs-dev-tools-scale));\n          --size-17: calc(17px / var(--nextjs-dev-tools-scale));\n          --size-18: calc(18px / var(--nextjs-dev-tools-scale));\n          --size-20: calc(20px / var(--nextjs-dev-tools-scale));\n          --size-22: calc(22px / var(--nextjs-dev-tools-scale));\n          --size-24: calc(24px / var(--nextjs-dev-tools-scale));\n          --size-26: calc(26px / var(--nextjs-dev-tools-scale));\n          --size-28: calc(28px / var(--nextjs-dev-tools-scale));\n          --size-30: calc(30px / var(--nextjs-dev-tools-scale));\n          --size-32: calc(32px / var(--nextjs-dev-tools-scale));\n          --size-34: calc(34px / var(--nextjs-dev-tools-scale));\n          --size-36: calc(36px / var(--nextjs-dev-tools-scale));\n          --size-38: calc(38px / var(--nextjs-dev-tools-scale));\n          --size-40: calc(40px / var(--nextjs-dev-tools-scale));\n          --size-42: calc(42px / var(--nextjs-dev-tools-scale));\n          --size-44: calc(44px / var(--nextjs-dev-tools-scale));\n          --size-46: calc(46px / var(--nextjs-dev-tools-scale));\n          --size-48: calc(48px / var(--nextjs-dev-tools-scale));\n\n          @media print {\n            display: none;\n          }\n        }\n\n        h1,\n        h2,\n        h3,\n        h4,\n        h5,\n        h6 {\n          margin-bottom: 8px;\n          font-weight: 500;\n          line-height: 1.5;\n        }\n\n        a {\n          color: var(--color-blue-900);\n          &:hover {\n            color: var(--color-blue-900);\n          }\n          &:focus {\n            outline: var(--focus-ring);\n          }\n        }\n      "
     ]);
     _templateObject = function() {

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/ui/styles/base.tsx"],"sourcesContent":["import { css } from '../../utils/css'\nimport type { DevToolsScale } from '../components/errors/dev-tools-indicator/dev-tools-info/preferences'\n\nexport function Base({ scale = 1 }: { scale?: DevToolsScale }) {\n return (\n <style>\n {css`\n :host {\n /* \n * Although the style applied to the shadow host is isolated,\n * the element that attached the shadow host (i.e. \"nextjs-portal\")\n * is still affected by the parent's style (e.g. \"body\"). This may\n * occur style conflicts like \"display: flex\", with other children\n * elements therefore give the shadow host an absolute position.\n /\n position: absolute;\n\n --color-font: #757575;\n --color-backdrop: rgba(250, 250, 250, 0.8);\n --color-border-shadow: rgba(0, 0, 0, 0.145);\n\n --color-title-color: #1f1f1f;\n --color-stack-notes: #777;\n\n --color-accents-1: #808080;\n --color-accents-2: #222222;\n --color-accents-3: #404040;\n\n --font-stack-monospace: '__nextjs-Geist Mono', 'Geist Mono',\n 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier,\n monospace;\n --font-stack-sans: '__nextjs-Geist', 'Geist', -apple-system,\n 'Source Sans Pro', sans-serif;\n\n font-family: var(--font-stack-sans);\n font-variant-ligatures: none;\n\n / TODO: Remove replaced ones. /\n --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1),\n 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),\n 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n --shadow-none: 0 0 #0000;\n\n --shadow-small: 0px 2px 2px rgba(0, 0, 0, 0.04);\n --shadow-menu: 0px 1px 1px rgba(0, 0, 0, 0.02),\n 0px 4px 8px -4px rgba(0, 0, 0, 0.04),\n 0px 16px 24px -8px rgba(0, 0, 0, 0.06);\n\n --focus-color: var(--color-blue-800);\n --focus-ring: 2px solid var(--focus-color);\n\n --timing-swift: cubic-bezier(0.23, 0.88, 0.26, 0.92);\n --timing-overlay: cubic-bezier(0.175, 0.885, 0.32, 1.1);\n\n --rounded-none: 0px;\n --rounded-sm: 2px;\n --rounded-md: 4px;\n --rounded-md-2: 6px;\n --rounded-lg: 8px;\n --rounded-xl: 12px;\n --rounded-2xl: 16px;\n --rounded-3xl: 24px;\n --rounded-4xl: 32px;\n --rounded-full: 9999px;\n\n / \n This value gets set from the Dev Tools preferences,\n and we use the following --size-* variables to \n scale the relevant elements.\n\n The reason why we don't rely on rem values is because\n if an app sets their root font size to something tiny, \n it feels unexpected to have the app root size leak \n into a Next.js surface.\n\n https://github.com/vercel/next.js/discussions/76812\n */\n --nextjs-dev-tools-scale: ${String(scale)};\n --size-1: calc(1px / var(--nextjs-dev-tools-scale));\n --size-2: calc(2px / var(--nextjs-dev-tools-scale));\n --size-3: calc(3px / var(--nextjs-dev-tools-scale));\n --size-4: calc(4px / var(--nextjs-dev-tools-scale));\n --size-5: calc(5px / var(--nextjs-dev-tools-scale));\n --size-6: calc(6px / var(--nextjs-dev-tools-scale));\n --size-7: calc(7px / var(--nextjs-dev-tools-scale));\n --size-8: calc(8px / var(--nextjs-dev-tools-scale));\n --size-9: calc(9px / var(--nextjs-dev-tools-scale));\n --size-10: calc(10px / var(--nextjs-dev-tools-scale));\n --size-11: calc(11px / var(--nextjs-dev-tools-scale));\n --size-12: calc(12px / var(--nextjs-dev-tools-scale));\n --size-13: calc(13px / var(--nextjs-dev-tools-scale));\n --size-14: calc(14px / var(--nextjs-dev-tools-scale));\n --size-15: calc(15px / var(--nextjs-dev-tools-scale));\n --size-16: calc(16px / var(--nextjs-dev-tools-scale));\n --size-17: calc(17px / var(--nextjs-dev-tools-scale));\n --size-18: calc(18px / var(--nextjs-dev-tools-scale));\n --size-20: calc(20px / var(--nextjs-dev-tools-scale));\n --size-22: calc(22px / var(--nextjs-dev-tools-scale));\n --size-24: calc(24px / var(--nextjs-dev-tools-scale));\n --size-26: calc(26px / var(--nextjs-dev-tools-scale));\n --size-28: calc(28px / var(--nextjs-dev-tools-scale));\n --size-30: calc(30px / var(--nextjs-dev-tools-scale));\n --size-32: calc(32px / var(--nextjs-dev-tools-scale));\n --size-34: calc(34px / var(--nextjs-dev-tools-scale));\n --size-36: calc(36px / var(--nextjs-dev-tools-scale));\n --size-38: calc(38px / var(--nextjs-dev-tools-scale));\n --size-40: calc(40px / var(--nextjs-dev-tools-scale));\n --size-42: calc(42px / var(--nextjs-dev-tools-scale));\n --size-44: calc(44px / var(--nextjs-dev-tools-scale));\n --size-46: calc(46px / var(--nextjs-dev-tools-scale));\n --size-48: calc(48px / var(--nextjs-dev-tools-scale));\n\n @media print {\n display: none;\n }\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin-bottom: 8px;\n font-weight: 500;\n line-height: 1.5;\n }\n\n a {\n color: var(--color-blue-900);\n &:hover {\n color: var(--color-blue-900);\n }\n &:focus {\n outline: var(--focus-ring);\n }\n }\n `}\n </style>\n )\n}\n"],"names":["Base","scale","style","css","String"],"mappings":";;;;+BAGgBA;;;eAAAA;;;;;qBAHI;;;;;;;;;;;AAGb,SAASA,KAAK,KAAwC;IAAxC,IAAA,EAAEC,QAAQ,CAAC,EAA6B,GAAxC;IACnB,qBACE,qBAACC;sBACEC,QAAG,~~qBA+E4BC~~,OAAOH;;AA+D7C","ignoreList":[0]}
1	+ {"version":3,"sources":["../../../../../../src/client/components/react-dev-overlay/ui/styles/base.tsx"],"sourcesContent":["import { css } from '../../utils/css'\nimport type { DevToolsScale } from '../components/errors/dev-tools-indicator/dev-tools-info/preferences'\n\nexport function Base({ scale = 1 }: { scale?: DevToolsScale }) {\n return (\n <style>\n {css`\n :host {\n /* \n * Although the style applied to the shadow host is isolated,\n * the element that attached the shadow host (i.e. \"nextjs-portal\")\n * is still affected by the parent's style (e.g. \"body\"). This may\n * occur style conflicts like \"display: flex\", with other children\n * elements therefore give the shadow host an absolute position.\n /\n position: absolute;\n\n --color-font: #757575;\n --color-backdrop: rgba(250, 250, 250, 0.8);\n --color-border-shadow: rgba(0, 0, 0, 0.145);\n\n --color-title-color: #1f1f1f;\n --color-stack-notes: #777;\n\n --color-accents-1: #808080;\n --color-accents-2: #222222;\n --color-accents-3: #404040;\n\n --font-stack-monospace: '__nextjs-Geist Mono', 'Geist Mono',\n 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier,\n monospace;\n --font-stack-sans: '__nextjs-Geist', 'Geist', -apple-system,\n 'Source Sans Pro', sans-serif;\n\n font-family: var(--font-stack-sans);\n font-variant-ligatures: none;\n\n / TODO: Remove replaced ones. /\n --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1),\n 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1),\n 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1),\n 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n --shadow-none: 0 0 #0000;\n\n --shadow-small: 0px 2px 2px rgba(0, 0, 0, 0.04);\n --shadow-menu: 0px 1px 1px rgba(0, 0, 0, 0.02),\n 0px 4px 8px -4px rgba(0, 0, 0, 0.04),\n 0px 16px 24px -8px rgba(0, 0, 0, 0.06);\n\n --focus-color: var(--color-blue-800);\n --focus-ring: 2px solid var(--focus-color);\n\n --timing-swift: cubic-bezier(0.23, 0.88, 0.26, 0.92);\n --timing-overlay: cubic-bezier(0.175, 0.885, 0.32, 1.1);\n / prettier-ignore /\n --timing-bounce: linear(0 0%, 0.005871 1%, 0.022058 2%, 0.046612 3%, 0.077823 4%, 0.114199 5%, 0.154441 6%, 0.197431 7.000000000000001%, 0.242208 8%, 0.287959 9%, 0.333995 10%, 0.379743 11%, 0.424732 12%, 0.46858 13%, 0.510982 14.000000000000002%, 0.551702 15%, 0.590564 16%, 0.627445 17%, 0.662261 18%, 0.694971 19%, 0.725561 20%, 0.754047 21%, 0.780462 22%, 0.804861 23%, 0.82731 24%, 0.847888 25%, 0.866679 26%, 0.883775 27%, 0.899272 28.000000000000004%, 0.913267 28.999999999999996%, 0.925856 30%, 0.937137 31%, 0.947205 32%, 0.956153 33%, 0.96407 34%, 0.971043 35%, 0.977153 36%, 0.982479 37%, 0.987094 38%, 0.991066 39%, 0.994462 40%, 0.997339 41%, 0.999755 42%, 1.001761 43%, 1.003404 44%, 1.004727 45%, 1.00577 46%, 1.006569 47%, 1.007157 48%, 1.007563 49%, 1.007813 50%, 1.007931 51%, 1.007939 52%, 1.007855 53%, 1.007697 54%, 1.007477 55.00000000000001%, 1.00721 56.00000000000001%, 1.006907 56.99999999999999%, 1.006576 57.99999999999999%, 1.006228 59%, 1.005868 60%, 1.005503 61%, 1.005137 62%, 1.004776 63%, 1.004422 64%, 1.004078 65%, 1.003746 66%, 1.003429 67%, 1.003127 68%, 1.00284 69%, 1.002571 70%, 1.002318 71%, 1.002082 72%, 1.001863 73%, 1.00166 74%, 1.001473 75%, 1.001301 76%, 1.001143 77%, 1.001 78%, 1.000869 79%, 1.000752 80%, 1.000645 81%, 1.00055 82%, 1.000464 83%, 1.000388 84%, 1.000321 85%, 1.000261 86%, 1.000209 87%, 1.000163 88%, 1.000123 89%, 1.000088 90%);\n\n --rounded-none: 0px;\n --rounded-sm: 2px;\n --rounded-md: 4px;\n --rounded-md-2: 6px;\n --rounded-lg: 8px;\n --rounded-xl: 12px;\n --rounded-2xl: 16px;\n --rounded-3xl: 24px;\n --rounded-4xl: 32px;\n --rounded-full: 9999px;\n\n / \n This value gets set from the Dev Tools preferences,\n and we use the following --size-* variables to \n scale the relevant elements.\n\n The reason why we don't rely on rem values is because\n if an app sets their root font size to something tiny, \n it feels unexpected to have the app root size leak \n into a Next.js surface.\n\n https://github.com/vercel/next.js/discussions/76812\n */\n --nextjs-dev-tools-scale: ${String(scale)};\n --size-1: calc(1px / var(--nextjs-dev-tools-scale));\n --size-2: calc(2px / var(--nextjs-dev-tools-scale));\n --size-3: calc(3px / var(--nextjs-dev-tools-scale));\n --size-4: calc(4px / var(--nextjs-dev-tools-scale));\n --size-5: calc(5px / var(--nextjs-dev-tools-scale));\n --size-6: calc(6px / var(--nextjs-dev-tools-scale));\n --size-7: calc(7px / var(--nextjs-dev-tools-scale));\n --size-8: calc(8px / var(--nextjs-dev-tools-scale));\n --size-9: calc(9px / var(--nextjs-dev-tools-scale));\n --size-10: calc(10px / var(--nextjs-dev-tools-scale));\n --size-11: calc(11px / var(--nextjs-dev-tools-scale));\n --size-12: calc(12px / var(--nextjs-dev-tools-scale));\n --size-13: calc(13px / var(--nextjs-dev-tools-scale));\n --size-14: calc(14px / var(--nextjs-dev-tools-scale));\n --size-15: calc(15px / var(--nextjs-dev-tools-scale));\n --size-16: calc(16px / var(--nextjs-dev-tools-scale));\n --size-17: calc(17px / var(--nextjs-dev-tools-scale));\n --size-18: calc(18px / var(--nextjs-dev-tools-scale));\n --size-20: calc(20px / var(--nextjs-dev-tools-scale));\n --size-22: calc(22px / var(--nextjs-dev-tools-scale));\n --size-24: calc(24px / var(--nextjs-dev-tools-scale));\n --size-26: calc(26px / var(--nextjs-dev-tools-scale));\n --size-28: calc(28px / var(--nextjs-dev-tools-scale));\n --size-30: calc(30px / var(--nextjs-dev-tools-scale));\n --size-32: calc(32px / var(--nextjs-dev-tools-scale));\n --size-34: calc(34px / var(--nextjs-dev-tools-scale));\n --size-36: calc(36px / var(--nextjs-dev-tools-scale));\n --size-38: calc(38px / var(--nextjs-dev-tools-scale));\n --size-40: calc(40px / var(--nextjs-dev-tools-scale));\n --size-42: calc(42px / var(--nextjs-dev-tools-scale));\n --size-44: calc(44px / var(--nextjs-dev-tools-scale));\n --size-46: calc(46px / var(--nextjs-dev-tools-scale));\n --size-48: calc(48px / var(--nextjs-dev-tools-scale));\n\n @media print {\n display: none;\n }\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin-bottom: 8px;\n font-weight: 500;\n line-height: 1.5;\n }\n\n a {\n color: var(--color-blue-900);\n &:hover {\n color: var(--color-blue-900);\n }\n &:focus {\n outline: var(--focus-ring);\n }\n }\n `}\n </style>\n )\n}\n"],"names":["Base","scale","style","css","String"],"mappings":";;;;+BAGgBA;;;eAAAA;;;;;qBAHI;;;;;;;;;;;AAGb,SAASA,KAAK,KAAwC;IAAxC,IAAA,EAAEC,QAAQ,CAAC,EAA6B,GAAxC;IACnB,qBACE,qBAACC;sBACEC,QAAG,qBAiF4BC,OAAOH;;AA+D7C","ignoreList":[0]}

package/dist/client/index.js CHANGED Viewed

@@ -61,7 +61,7 @@ const _hooksclientcontextsharedruntime = require("../shared/lib/hooks-client-con
 const _onrecoverableerror = require("./react-client-callbacks/on-recoverable-error");
 const _tracer = /*#__PURE__*/ _interop_require_default._(require("./tracing/tracer"));
 const _isnextroutererror = require("./components/is-next-router-error");
-const version = "15.4.0-canary.19";
+const version = "15.4.0-canary.20";
 let router;
 const emitter = (0, _mitt.default)();
 const looseToArray = (input)=>[].slice.call(input);