@agimon-ai/po-style-system-tooling 0.2.14-alpha.37 → 0.2.14-alpha.38

package/dist/cli.cjs

@@ -1,5 +1,5 @@
 #!/usr/bin/env node
-const require_stdio = require("./stdio-BjzSXqB5.cjs");
+const require_stdio = require("./stdio-x6EuV64Q.cjs");
 let node_fs = require("node:fs");
 let node_path = require("node:path");
 node_path = require_stdio.__toESM(node_path, 1);

package/dist/cli.mjs

@@ -1,5 +1,5 @@
 #!/usr/bin/env node
-import { B as log, F as DEFAULT_STYLE_SYSTEM_CONFIG, I as TailwindCSSClassesService, T as getAppDesignSystemConfig, V as STYLE_SYSTEM_TYPES, a as STYLE_SYSTEM_CLI_NAME, i as createServer$1, j as resolveStyleSystemThemePath, o as STYLE_SYSTEM_VERSION, r as generateRestrictedClassesConfig, s as createContainer, t as StdioTransportHandler, y as getBundlerServiceFromConfig } from "./stdio-BnqtVQFh.mjs";
+import { B as log, F as DEFAULT_STYLE_SYSTEM_CONFIG, I as TailwindCSSClassesService, T as getAppDesignSystemConfig, V as STYLE_SYSTEM_TYPES, a as STYLE_SYSTEM_CLI_NAME, i as createServer$1, j as resolveStyleSystemThemePath, o as STYLE_SYSTEM_VERSION, r as generateRestrictedClassesConfig, s as createContainer, t as StdioTransportHandler, y as getBundlerServiceFromConfig } from "./stdio-B5wufO5-.mjs";
 import { promises } from "node:fs";
 import path, { join } from "node:path";
 import { z } from "zod";

package/dist/index.cjs

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_stdio = require("./stdio-BjzSXqB5.cjs");
+const require_stdio = require("./stdio-x6EuV64Q.cjs");
 let node_fs = require("node:fs");
 let node_path = require("node:path");
 node_path = require_stdio.__toESM(node_path, 1);

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import { A as StyleSystemConfigLoader, B as log, C as launchBrowserWithFallback, D as hasStyleSystemProjectConfig, E as getSharedComponentTags, F as DEFAULT_STYLE_SYSTEM_CONFIG, I as TailwindCSSClassesService, L as BaseCSSClassesService, M as MAX_STYLE_SYSTEM_VIEWPORT_DIMENSION, N as StoriesIndexService, O as resetStyleSystemConfigCache, P as CSSClassesServiceFactory, R as TemplatesManagerService, S as BaseBundlerService, T as getAppDesignSystemConfig, V as STYLE_SYSTEM_TYPES, _ as createDefaultBundlerService, b as ViteReactNativeBundlerService, c as createStyleSystemModule, d as GetComponentVisualTool, f as GetCSSClassesTool, g as ThemeService, h as ComponentRendererService, i as createServer, j as resolveStyleSystemThemePath, k as resolveAppDesignSystemConfig, l as ListAppComponentsTool, m as GetUiComponentService, n as extractCustomTokenNames, p as ListThemesTool, r as generateRestrictedClassesConfig, s as createContainer, t as StdioTransportHandler, u as ListSharedComponentsTool, v as getBundlerService, w as withRenderSlot, x as ViteReactBundlerService, y as getBundlerServiceFromConfig, z as isContained } from "./stdio-BnqtVQFh.mjs";
+import { A as StyleSystemConfigLoader, B as log, C as launchBrowserWithFallback, D as hasStyleSystemProjectConfig, E as getSharedComponentTags, F as DEFAULT_STYLE_SYSTEM_CONFIG, I as TailwindCSSClassesService, L as BaseCSSClassesService, M as MAX_STYLE_SYSTEM_VIEWPORT_DIMENSION, N as StoriesIndexService, O as resetStyleSystemConfigCache, P as CSSClassesServiceFactory, R as TemplatesManagerService, S as BaseBundlerService, T as getAppDesignSystemConfig, V as STYLE_SYSTEM_TYPES, _ as createDefaultBundlerService, b as ViteReactNativeBundlerService, c as createStyleSystemModule, d as GetComponentVisualTool, f as GetCSSClassesTool, g as ThemeService, h as ComponentRendererService, i as createServer, j as resolveStyleSystemThemePath, k as resolveAppDesignSystemConfig, l as ListAppComponentsTool, m as GetUiComponentService, n as extractCustomTokenNames, p as ListThemesTool, r as generateRestrictedClassesConfig, s as createContainer, t as StdioTransportHandler, u as ListSharedComponentsTool, v as getBundlerService, w as withRenderSlot, x as ViteReactBundlerService, y as getBundlerServiceFromConfig, z as isContained } from "./stdio-B5wufO5-.mjs";
 import { promises } from "node:fs";
 import path from "node:path";
 import { createHash, randomUUID } from "node:crypto";

package/dist/{stdio-BnqtVQFh.mjs → stdio-B5wufO5-.mjs}

@@ -1591,14 +1591,30 @@ const VITE_ERROR_OVERLAY_SELECTOR = "vite-error-overlay";
 const STORY_MOUNT_TIMEOUT_MS = 1e4;
 /**
 * Runs in the page (this package has no DOM types): resolves once web fonts and every image the
-* story rendered have loaded (or failed), then two frames have painted.
+* story rendered have loaded (or failed), two frames have painted, and the layout stopped moving.
 */
-const FONTS_IMAGES_AND_TWO_FRAMES = `Promise.all([
+const FONTS_IMAGES_AND_STILL_LAYOUT = `Promise.all([
   document.fonts.ready,
   ...Array.from(document.images, (image) =>
     image.complete ? null : new Promise((resolve) => { image.addEventListener('load', resolve, { once: true }); image.addEventListener('error', resolve, { once: true }); }),
   ),
-]).then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`;
+]).then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve)))).then(() => new Promise((resolve) => {
+  const started = performance.now();
+  let last = '';
+  let still = 0;
+  const frame = () => {
+    let boxes = '';
+    for (const element of document.querySelectorAll('body *')) {
+      const box = element.getBoundingClientRect();
+      if (box.width >= 64 && box.height >= 64) boxes += Math.round(box.x) + ',' + Math.round(box.y) + ',' + Math.round(box.width) + ',' + Math.round(box.height) + ';';
+    }
+    still = boxes === last ? still + 1 : 0;
+    last = boxes;
+    if (still >= 5 || performance.now() - started > 3000) resolve();
+    else requestAnimationFrame(frame);
+  };
+  requestAnimationFrame(frame);
+}))`;
 /**
 * Attempts to launch a browser, trying multiple configurations in order of preference.
 * @returns Launched browser instance
@@ -1673,7 +1689,7 @@ async function takeScreenshot(options) {
 		if (await page.waitForSelector(`${STORY_ROOT_SELECTOR} > *, ${VITE_ERROR_OVERLAY_SELECTOR}`, {
 			state: "attached",
 			timeout: STORY_MOUNT_TIMEOUT_MS
-		}).then(() => true).catch(() => false)) await page.evaluate(FONTS_IMAGES_AND_TWO_FRAMES);
+		}).then(() => true).catch(() => false)) await page.evaluate(FONTS_IMAGES_AND_STILL_LAYOUT);
 		if (waitTime > 0) await page.waitForTimeout(waitTime);
 		const hasViteErrorOverlay = await page.locator(VITE_ERROR_OVERLAY_SELECTOR).count();
 		const renderedChildCount = await page.locator(`${STORY_ROOT_SELECTOR} > *`).count();
@@ -4932,7 +4948,7 @@ function createContainer(options) {
 }
 //#endregion
 //#region package.json
-var version = "0.2.14-alpha.37";
+var version = "0.2.14-alpha.38";
 //#endregion
 //#region src/metadata.ts
 const STYLE_SYSTEM_CLI_NAME = "style-system";

package/dist/{stdio-BjzSXqB5.cjs → stdio-x6EuV64Q.cjs}

@@ -1619,14 +1619,30 @@ const VITE_ERROR_OVERLAY_SELECTOR = "vite-error-overlay";
 const STORY_MOUNT_TIMEOUT_MS = 1e4;
 /**
 * Runs in the page (this package has no DOM types): resolves once web fonts and every image the
-* story rendered have loaded (or failed), then two frames have painted.
+* story rendered have loaded (or failed), two frames have painted, and the layout stopped moving.
 */
-const FONTS_IMAGES_AND_TWO_FRAMES = `Promise.all([
+const FONTS_IMAGES_AND_STILL_LAYOUT = `Promise.all([
   document.fonts.ready,
   ...Array.from(document.images, (image) =>
     image.complete ? null : new Promise((resolve) => { image.addEventListener('load', resolve, { once: true }); image.addEventListener('error', resolve, { once: true }); }),
   ),
-]).then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`;
+]).then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve)))).then(() => new Promise((resolve) => {
+  const started = performance.now();
+  let last = '';
+  let still = 0;
+  const frame = () => {
+    let boxes = '';
+    for (const element of document.querySelectorAll('body *')) {
+      const box = element.getBoundingClientRect();
+      if (box.width >= 64 && box.height >= 64) boxes += Math.round(box.x) + ',' + Math.round(box.y) + ',' + Math.round(box.width) + ',' + Math.round(box.height) + ';';
+    }
+    still = boxes === last ? still + 1 : 0;
+    last = boxes;
+    if (still >= 5 || performance.now() - started > 3000) resolve();
+    else requestAnimationFrame(frame);
+  };
+  requestAnimationFrame(frame);
+}))`;
 /**
 * Attempts to launch a browser, trying multiple configurations in order of preference.
 * @returns Launched browser instance
@@ -1701,7 +1717,7 @@ async function takeScreenshot(options) {
 		if (await page.waitForSelector(`${STORY_ROOT_SELECTOR} > *, ${VITE_ERROR_OVERLAY_SELECTOR}`, {
 			state: "attached",
 			timeout: STORY_MOUNT_TIMEOUT_MS
-		}).then(() => true).catch(() => false)) await page.evaluate(FONTS_IMAGES_AND_TWO_FRAMES);
+		}).then(() => true).catch(() => false)) await page.evaluate(FONTS_IMAGES_AND_STILL_LAYOUT);
 		if (waitTime > 0) await page.waitForTimeout(waitTime);
 		const hasViteErrorOverlay = await page.locator(VITE_ERROR_OVERLAY_SELECTOR).count();
 		const renderedChildCount = await page.locator(`${STORY_ROOT_SELECTOR} > *`).count();
@@ -4960,7 +4976,7 @@ function createContainer(options) {
 }
 //#endregion
 //#region package.json
-var version = "0.2.14-alpha.37";
+var version = "0.2.14-alpha.38";
 //#endregion
 //#region src/metadata.ts
 const STYLE_SYSTEM_CLI_NAME = "style-system";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agimon-ai/po-style-system-tooling",
-  "version": "0.2.14-alpha.37",
+  "version": "0.2.14-alpha.38",
   "description": "MCP server for exploring themes, Tailwind CSS classes, and UI components from Storybook with standalone component rendering capabilities",
   "keywords": [
     "design-system",