@ggui-ai/ui-visual-tester 0.22.0 → 0.24.0

package/fixture/fixture-runtime.js

@@ -20061,11 +20061,20 @@
 
   // ../design/dist/interact/trait.js
   var import_react = __toESM(require_react(), 1);
+  function frameAttributes(frame) {
+    if (frame === void 0)
+      return {};
+    return {
+      ...frame.surface !== void 0 ? { "data-ggui-surface": frame.surface } : {},
+      ...frame.bleed === true ? { "data-ggui-bleed": "" } : {}
+    };
+  }
   function renderWithTrait(trait, traitProps, root, children) {
+    const marks = frameAttributes(root.frame);
     if (trait === void 0) {
-      return (0, import_react.createElement)("div", { className: root.className, style: root.style }, children);
+      return (0, import_react.createElement)("div", { className: root.className, style: root.style, ...marks }, children);
     }
-    return (0, import_react.createElement)(trait, { ...traitProps, className: root.className, style: root.style }, children);
+    return (0, import_react.createElement)(trait, { ...traitProps, className: root.className, style: root.style, ...marks }, children);
   }
 
   // ../design/dist/primitives/color-slots.js
@@ -20195,9 +20204,14 @@
       surface,
       style,
       className,
+      bleed,
       as: Trait,
       ...traitProps
     } = props;
+    const frame = {
+      ...surface !== "transparent" ? { surface: surface ?? "default" } : {},
+      ...bleed === true ? { bleed: true } : {}
+    };
     const resolvedPadding = resolveSpacing(padding);
     const resolvedSurface = resolveSurfaceCss(surface ?? "default");
     const resolvedOnColor = resolveSurfaceOnColorCss(surface ?? "default");
@@ -20215,10 +20229,11 @@
     if (scope !== void 0) {
       return renderWithTrait(Trait, traitProps, {
         className: className ? `${className} ${scope.className}` : scope.className,
-        style: composedStyle
+        style: composedStyle,
+        frame
       }, (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [(0, import_jsx_runtime2.jsx)("style", { children: scope.css }), children] }));
     }
-    return renderWithTrait(Trait, traitProps, { className, style: composedStyle }, children);
+    return renderWithTrait(Trait, traitProps, { className, style: composedStyle, frame }, children);
   }
 
   // ../design/dist/primitives/Stack.js
@@ -20315,7 +20330,9 @@
   // ../design/dist/primitives/Box.js
   var import_jsx_runtime4 = __toESM(require_jsx_runtime(), 1);
   function Box(props) {
-    const { children, padding, paddingX, paddingY, margin, surface, assetColor, assetSemantic, radius: radius2, style, className, as: Trait, ...traitProps } = props;
+    const { children, padding, paddingX, paddingY, margin, surface, assetColor, assetSemantic, radius: radius2, style, className, bleed, as: Trait, ...traitProps } = props;
+    const markedSurface = surface !== void 0 && surface !== "transparent" ? surface : void 0;
+    const frame = markedSurface === void 0 && bleed !== true ? void 0 : { ...markedSurface !== void 0 ? { surface: markedSurface } : {}, ...bleed === true ? { bleed: true } : {} };
     let computedPadding;
     if (paddingX !== void 0 || paddingY !== void 0) {
       const px = resolveSpacing(paddingX) || "0";
@@ -20340,10 +20357,11 @@
     if (scope !== void 0) {
       return renderWithTrait(Trait, traitProps, {
         className: className ? `${className} ${scope.className}` : scope.className,
-        style: composedStyle
+        style: composedStyle,
+        ...frame !== void 0 ? { frame } : {}
       }, (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [(0, import_jsx_runtime4.jsx)("style", { children: scope.css }), children] }));
     }
-    return renderWithTrait(Trait, traitProps, { className, style: composedStyle }, children);
+    return renderWithTrait(Trait, traitProps, { className, style: composedStyle, ...frame !== void 0 ? { frame } : {} }, children);
   }
 
   // ../design/dist/primitives/Divider.js
@@ -28559,6 +28577,7 @@
     buildWireConfig: () => buildWireConfig,
     connectionSource: () => connectionSource,
     useAction: () => useAction,
+    useActionSpent: () => useActionSpent,
     useApp: () => useApp,
     useAuth: () => useAuth,
     useContract: () => useContract,
@@ -28649,8 +28668,19 @@
     }, [actionName, dispatch, onDispatchSuppressed]);
   }
 
-  // ../wire/dist/useGguiContext.js
+  // ../wire/dist/action-spent.js
   var import_react35 = __toESM(require_react(), 1);
+  var ActionSpentContext = (0, import_react35.createContext)(null);
+  var noSubscription = () => () => void 0;
+  function useActionSpent(actionName) {
+    const source = (0, import_react35.useContext)(ActionSpentContext);
+    const subscribe = (0, import_react35.useCallback)((listener) => source === null ? noSubscription() : source.subscribe(listener), [source]);
+    const read = (0, import_react35.useCallback)(() => source === null ? false : source.isSpent(actionName), [source, actionName]);
+    return (0, import_react35.useSyncExternalStore)(subscribe, read, read);
+  }
+
+  // ../wire/dist/useGguiContext.js
+  var import_react36 = __toESM(require_react(), 1);
   function useGguiContext(slotName) {
     const contextName = slotName.length === 0 ? "Context" : slotName.charAt(0).toUpperCase() + slotName.slice(1) + "Context";
     const registry = globalThis.__ggui__?.contexts;
@@ -28658,19 +28688,19 @@
     if (!ctx) {
       throw new Error(`[ggui] useGguiContext('${slotName}'): no Context registered. The contract must declare 'contextSpec.${slotName}' AND the runtime must have synthesized the per-slot React Context at boot. If you see this in production code generated by the LLM, the boilerplate's destructure line drifted from the contract.`);
     }
-    return (0, import_react35.useContext)(ctx);
+    return (0, import_react36.useContext)(ctx);
   }
 
   // ../wire/dist/useStream.js
-  var import_react36 = __toESM(require_react(), 1);
+  var import_react37 = __toESM(require_react(), 1);
   function useStream(channelName) {
     const { subscribe } = useWireContext();
-    const [latest, setLatest] = (0, import_react36.useState)(null);
-    const [all, setAll] = (0, import_react36.useState)([]);
-    const [isComplete, setIsComplete] = (0, import_react36.useState)(false);
-    const allRef = (0, import_react36.useRef)(all);
+    const [latest, setLatest] = (0, import_react37.useState)(null);
+    const [all, setAll] = (0, import_react37.useState)([]);
+    const [isComplete, setIsComplete] = (0, import_react37.useState)(false);
+    const allRef = (0, import_react37.useRef)(all);
     allRef.current = all;
-    (0, import_react36.useEffect)(() => {
+    (0, import_react37.useEffect)(() => {
       return subscribe(channelName, (delivery) => {
         const typed = delivery.payload;
         setLatest(typed);
@@ -28708,7 +28738,7 @@
   }
 
   // ../wire/dist/useRender.js
-  var import_react37 = __toESM(require_react(), 1);
+  var import_react38 = __toESM(require_react(), 1);
 
   // ../wire/dist/connection-store.js
   var ConnectionWriterConflictError = class extends Error {
@@ -28805,7 +28835,7 @@
   // ../wire/dist/useRender.js
   function useRender() {
     const { render } = useWireContext();
-    const isConnected = (0, import_react37.useSyncExternalStore)(connectionSource.subscribe, connectionSource.getSnapshot, connectionSource.getSnapshot);
+    const isConnected = (0, import_react38.useSyncExternalStore)(connectionSource.subscribe, connectionSource.getSnapshot, connectionSource.getSnapshot);
     return { sessionId: render.sessionId, isConnected };
   }
 
@@ -29389,7 +29419,24 @@
     });
     const validateEnvelope = opts.validateEnvelope ?? validateOutboundActionEnvelope;
     const spentOneShots = /* @__PURE__ */ new Set();
+    const isSpent = (actionName) => opts.getActiveActionSpec()?.[actionName]?.oneShot === true && (spentOneShots.has(actionName) || opts.getSpentOneShots?.()?.includes(actionName) === true);
+    const spentListeners = /* @__PURE__ */ new Set();
+    const notifySpent = () => {
+      for (const listener of [...spentListeners])
+        listener();
+    };
+    const actionSpent = {
+      isSpent,
+      subscribe: (listener) => {
+        spentListeners.add(listener);
+        return () => {
+          spentListeners.delete(listener);
+        };
+      }
+    };
+    opts.spentInputsChanged?.(notifySpent);
     return {
+      actionSpent,
       app: opts.app,
       render: opts.render,
       auth: opts.auth,
@@ -29399,7 +29446,7 @@
         if (actionSpec === void 0)
           opts.onActionSpecAbsent?.(actionName);
         const isOneShot = actionSpec?.[actionName]?.oneShot === true;
-        if (isOneShot && spentOneShots.has(actionName)) {
+        if (isSpent(actionName)) {
           console.warn(`[ggui] dispatch('${actionName}') suppressed: this action is declared oneShot and already fired for this render. A second gesture is NOT sent to the agent \u2014 the submitted control is spent for the render's lifetime. If the action is meant to repeat, remove \`oneShot\` from its contract entry.`);
           opts.onDispatchSuppressed?.({
             reason: "one-shot-spent",
@@ -29424,8 +29471,10 @@
           opts.onViolation(new ClientContractViolationError("outbound-action", result.violations));
           return;
         }
-        if (isOneShot)
+        if (isOneShot && !spentOneShots.has(actionName)) {
           spentOneShots.add(actionName);
+          notifySpent();
+        }
         opts.emitEnvelope(envelope);
       },
       subscribe: (channelName, handler) => {
@@ -32420,8 +32469,12 @@
 
   // ../design/dist/themes/ThemeProvider.js
   var import_jsx_runtime58 = __toESM(require_jsx_runtime(), 1);
-  var import_react38 = __toESM(require_react(), 1);
-  var ThemeContext = (0, import_react38.createContext)(null);
+  var import_react39 = __toESM(require_react(), 1);
+  var ThemeContext = (0, import_react39.createContext)(null);
+
+  // ../design/dist/rendering/css-tokens.js
+  var EXPANDED_FRAME = { outerRadiusVar: "--ggui-shape-radius-xl", insetPx: 16 };
+  var EXPANDED_FRAME_INNER_RADIUS = `max(0px, calc(var(${EXPANDED_FRAME.outerRadiusVar}) - ${EXPANDED_FRAME.insetPx}px))`;
 
   // ../design/dist/rendering/rewrite-imports.js
   var WIRE_EXPORTS = [
@@ -32436,6 +32489,11 @@
     "useGguiContext",
     "useContract",
     "useWireContext",
+    // ggui#1223: a `oneShot` action's spent state, as data. It is served here
+    // one release BEFORE the triad teaches it, because a card that imports a name
+    // its runtime's shim lacks fails at module link. A card generated to use it
+    // must never meet a runtime without it.
+    "useActionSpent",
     // Provider component
     "GguiWireProvider"
   ];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ggui-ai/ui-visual-tester",
-  "version": "0.22.0",
+  "version": "0.24.0",
   "description": "Behavioral validator for ggui-generated component code. Renders a component in real Chromium via Playwright, clicks each action declared in its contract, and verifies the action actually does something — mutating bound state or dispatching to the agent. Catches buttons wired to no-op handlers that structural validators miss. Playwright is an optional peer dependency, injected by the caller.",
   "keywords": [
     "ggui",
@@ -53,9 +53,9 @@
   "dependencies": {
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "@ggui-ai/design": "0.22.0",
-    "@ggui-ai/protocol": "0.22.0",
-    "@ggui-ai/wire": "0.22.0"
+    "@ggui-ai/design": "0.24.0",
+    "@ggui-ai/protocol": "0.24.0",
+    "@ggui-ai/wire": "0.24.0"
   },
   "devDependencies": {
     "@playwright/test": "^1.60.0",