@nextsparkjs/core 0.1.0-beta.181 → 0.1.0-beta.183

package/dist/templates/app/devtools/api/layout.tsx

@@ -1,44 +1,23 @@
 /**
  * API Explorer Layout
  *
- * Full-width layout for the API Explorer page.
- * Uses negative margins to break out of the parent container's padding
- * and centering (mx-auto).
+ * The Explorer is a tool, not a document: it wants the whole content area, while every other
+ * DevTools page sits inside the parent layout's centered, padded, max-width container.
  *
- * The parent layout has: container mx-auto p-6 max-w-7xl
- * We need to break out of ALL these constraints to use the full available width.
+ * It escapes that container by filling the scroll area it lives in — `absolute inset-0` against
+ * the `relative <main>` of the parent layout. What it must NOT do is compute its own size from
+ * the viewport: the previous `calc(100vw - 16rem)` assumed the DevTools sidebar is always
+ * 16rem, so collapsing that sidebar to a rail left the Explorer 192px narrower than the space
+ * it had, and the centering split the difference into dead margins on both sides — the layout
+ * got worse exactly when someone made room for it.
  *
- * Structure:
- * - DevTools sidebar: w-64 (256px / 16rem)
- * - Main content: flex-1 (fills remaining space)
- *   - Container: mx-auto p-6 max-w-7xl (centered, padded, max 1280px)
- *     - This layout: breaks out to fill full main content area
+ * Filling the parent has no such assumption: the sidebar's width, the container's padding and
+ * its max-width all stop being this file's business.
  */
 export default function ApiExplorerLayout({
   children,
 }: {
   children: React.ReactNode
 }) {
-  // Use relative positioning to break out of the centered container
-  // margin-left: -50vw + 50% + sidebar/2 adjustment positions at the left edge
-  // width: calc(100vw - sidebar) fills to the right edge
-  return (
-    <div
-      className="h-[calc(100vh-4rem)]"
-      style={{
-        // Position at the left edge of the main content area (right after sidebar)
-        position: 'relative',
-        left: '50%',
-        transform: 'translateX(-50%)',
-        width: 'calc(100vw - 16rem)', // 100vw minus DevTools sidebar (w-64 = 16rem)
-        maxWidth: 'none',
-        marginLeft: 0,
-        marginRight: 0,
-        marginTop: '-1.5rem', // Negate top padding
-        marginBottom: '-1.5rem', // Negate bottom padding
-      }}
-    >
-      {children}
-    </div>
-  )
+  return <div className="absolute inset-0">{children}</div>
 }

package/dist/templates/app/devtools/layout.tsx

@@ -45,7 +45,9 @@ function DevLayout({ children }: DevLayoutProps) {
           <DevtoolsMobileHeader />
 
           {/* Content area with scrolling */}
-          <main className="flex-1 overflow-y-auto overflow-x-hidden">
+          {/* `relative` so a full-bleed child route (the API Explorer) can fill this area
+              without measuring the sidebar itself. */}
+          <main className="relative flex-1 overflow-y-auto overflow-x-hidden">
             <div className="container mx-auto p-6 max-w-7xl">
               {children}
             </div>

package/dist/types/api-presets.d.ts

@@ -47,7 +47,25 @@ export interface ApiPreset {
     queryParams?: Record<string, string | number | boolean>;
     /** Custom headers */
     headers?: Record<string, string>;
-    /** Request body (for POST/PATCH/PUT) */
+    /**
+     * Request body (for POST/PATCH/PUT).
+     *
+     * String values here — and in `params`, `headers`, `pathParams` and `sessionConfig` — may carry
+     * placeholders, resolved when the preset is applied (see `preset-placeholders.ts`):
+     *
+     * - `{{UNIQUE}}`   fresh on every apply — the default for anything that creates. Press play,
+     *                  get values nobody has used; press play again, get another set. Two people
+     *                  testing at once never collide either. A preset can still prove an idempotent
+     *                  replay with it: apply once, then send twice.
+     * - `{{RUN}}`      stable until someone starts a new run, and shared by every preset of the
+     *                  endpoint. For the rarer case where two DIFFERENT presets have to meet on
+     *                  the same value.
+     * - `{{TIMESTAMP}}` / `{{UUID}}`  the raw forms, when the shape of the value matters.
+     * - `{{FIRST_TEAM_ID}}`  the browser's first/active team.
+     *
+     * An unrecognised token is left as written rather than blanked, so a preset naming something
+     * this version does not provide says so in the editor instead of sending an empty string.
+     */
     payload?: Record<string, unknown>;
     /** Session/auth configuration */
     sessionConfig?: PresetSessionConfig;

package/dist/types/api-presets.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"api-presets.d.ts","sourceRoot":"","sources":["../../src/types/api-presets.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"api-presets.d.ts","sourceRoot":"","sources":["../../src/types/api-presets.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextsparkjs/core",
-  "version": "0.1.0-beta.181",
+  "version": "0.1.0-beta.183",
   "description": "NextSpark - The complete SaaS framework for Next.js",
   "license": "MIT",
   "author": "NextSpark <hello@nextspark.dev>",
@@ -470,7 +470,7 @@
     "tailwind-merge": "^3.3.1",
     "uuid": "^13.0.0",
     "zod": "^4.1.5",
-    "@nextsparkjs/testing": "0.1.0-beta.181"
+    "@nextsparkjs/testing": "0.1.0-beta.183"
   },
   "scripts": {
     "postinstall": "node scripts/postinstall.mjs || true",

package/templates/app/devtools/api/layout.tsx

@@ -1,44 +1,23 @@
 /**
  * API Explorer Layout
  *
- * Full-width layout for the API Explorer page.
- * Uses negative margins to break out of the parent container's padding
- * and centering (mx-auto).
+ * The Explorer is a tool, not a document: it wants the whole content area, while every other
+ * DevTools page sits inside the parent layout's centered, padded, max-width container.
  *
- * The parent layout has: container mx-auto p-6 max-w-7xl
- * We need to break out of ALL these constraints to use the full available width.
+ * It escapes that container by filling the scroll area it lives in — `absolute inset-0` against
+ * the `relative <main>` of the parent layout. What it must NOT do is compute its own size from
+ * the viewport: the previous `calc(100vw - 16rem)` assumed the DevTools sidebar is always
+ * 16rem, so collapsing that sidebar to a rail left the Explorer 192px narrower than the space
+ * it had, and the centering split the difference into dead margins on both sides — the layout
+ * got worse exactly when someone made room for it.
  *
- * Structure:
- * - DevTools sidebar: w-64 (256px / 16rem)
- * - Main content: flex-1 (fills remaining space)
- *   - Container: mx-auto p-6 max-w-7xl (centered, padded, max 1280px)
- *     - This layout: breaks out to fill full main content area
+ * Filling the parent has no such assumption: the sidebar's width, the container's padding and
+ * its max-width all stop being this file's business.
  */
 export default function ApiExplorerLayout({
   children,
 }: {
   children: React.ReactNode
 }) {
-  // Use relative positioning to break out of the centered container
-  // margin-left: -50vw + 50% + sidebar/2 adjustment positions at the left edge
-  // width: calc(100vw - sidebar) fills to the right edge
-  return (
-    <div
-      className="h-[calc(100vh-4rem)]"
-      style={{
-        // Position at the left edge of the main content area (right after sidebar)
-        position: 'relative',
-        left: '50%',
-        transform: 'translateX(-50%)',
-        width: 'calc(100vw - 16rem)', // 100vw minus DevTools sidebar (w-64 = 16rem)
-        maxWidth: 'none',
-        marginLeft: 0,
-        marginRight: 0,
-        marginTop: '-1.5rem', // Negate top padding
-        marginBottom: '-1.5rem', // Negate bottom padding
-      }}
-    >
-      {children}
-    </div>
-  )
+  return <div className="absolute inset-0">{children}</div>
 }

package/templates/app/devtools/layout.tsx

@@ -45,7 +45,9 @@ function DevLayout({ children }: DevLayoutProps) {
           <DevtoolsMobileHeader />
 
           {/* Content area with scrolling */}
-          <main className="flex-1 overflow-y-auto overflow-x-hidden">
+          {/* `relative` so a full-bleed child route (the API Explorer) can fill this area
+              without measuring the sidebar itself. */}
+          <main className="relative flex-1 overflow-y-auto overflow-x-hidden">
             <div className="container mx-auto p-6 max-w-7xl">
               {children}
             </div>