@vention/vention-skills 0.10.15 → 0.10.16

package/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "vention",
-  "version": "0.10.15",
+  "version": "0.10.16",
   "description": "Vention skills for coding agents: write MachineLogic applications, build machine designs, and diagnose deployed machines.",
   "author": {
     "name": "Vention"

package/README.md

@@ -1,6 +1,6 @@
 # Vention skills
 
-Version 0.10.15. Skills for coding agents that work with Vention machines, packaged as one plugin, `vention`, in the `vention-skills` marketplace.
+Version 0.10.16. Skills for coding agents that work with Vention machines, packaged as one plugin, `vention`, in the `vention-skills` marketplace.
 
 | Skill                       | What it does                                                                                                                         |
 | --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------ |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vention/vention-skills",
-  "version": "0.10.15",
+  "version": "0.10.16",
   "description": "Vention skills for coding agents: write MachineLogic applications, build machine designs, and diagnose deployed machines.",
   "license": "MIT",
   "type": "module",

package/plugin.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://agent-plugins.org/schemas/1.0.0/plugin.schema.json",
   "name": "vention",
-  "version": "0.10.15",
+  "version": "0.10.16",
   "description": "Vention skills for coding agents: write MachineLogic applications, build machine designs, and diagnose deployed machines.",
   "author": {
     "name": "Vention"

package/skills/vention-design/SKILL.md

@@ -3,7 +3,7 @@ name: vention-design
 description: Create, build and edit Vention machine designs and design graphs for agentic layout. Use when the user wants to start a new design, lay out an automation cell, add or reposition components in a Vention design, generate a machine layout from a description, add or place a floor plan image under a design, list a design's versions, or inspect an existing design graph. Trigger on MachineBuilder designs, design graphs, assembly graphs, extrusions, actuators, robot mounting, cell footprints, floor plans, or a machine-builder URL.
 license: MIT
 metadata:
-  version: "0.10.15"
+  version: "0.10.16"
   author: Vention
 ---
 

package/skills/vention-machine-logic/SKILL.md

@@ -3,7 +3,7 @@ name: vention-machine-logic
 description: Write, edit, validate, and deploy MachineLogic Python applications for Vention machines with the machine-logic-sdk and the Vention CLI. Load it before writing or changing any Python that talks to a Vention machine, however short, since device names and version-specific SDK calls come from here. Use to program a Vention machine or MachineMotion controller, drive actuators, conveyors, robots, pneumatics, or digital I/O, change an existing application, build a state machine, debug from logs, or pull, push, or link with the Vention CLI (vention or vn). Trigger on MachineLogic, machine-logic-sdk, MachineMotion, MachineBuilder applications, the Vention CLI, or a directory holding .machine-code-app-directory-info.json. Printing what the machine or robot holds now (positions, taught targets, calibration, I/O) is a program: files on disk hold only as-designed values. Not for explaining an existing machine or its configuration in words when no program is asked for, nor for Python that never touches the machine.
 license: MIT
 metadata:
-  version: "0.10.15"
+  version: "0.10.16"
   machine-logic-sdk: ">=3.0,<4"
   author: Vention
 ---

package/skills/vention-machine-logic-hmi/SKILL.md

@@ -3,7 +3,7 @@ name: vention-machine-logic-hmi
 description: Build or edit the custom operator HMI of a MachineLogic application, the React touch screen in customui/ that runs in MachineBuilder and on the MachineMotion pendant, wired to the application's Python process through vention-communication. Use when the user asks for an operator screen, a custom HMI or UI, a touch panel, start and stop buttons, live machine state on screen, or recipes an operator picks, for a Vention machine or inside a directory holding .machine-code-app-directory-info.json. Uses @vention/machine-ui, @vention/machine-apps-components and @vention/machine-logic-ui-sdk. Do not use for the no-code HMI Builder, or for the Python motion logic alone (that is vention-machine-logic).
 license: MIT
 metadata:
-  version: "0.10.15"
+  version: "0.10.16"
   author: Vention
 ---
 
@@ -165,7 +165,7 @@ The machine-apps-components README is behind its code: `NavigationBar` takes `Na
 - Confirm anything that starts motion or deletes data in a `VentionModal` with `isTouchDevice`, and say in it what will move.
 - `VentionButton` variants are `filled-brand`, `filled`, `outline`, `text-only`, `shaded` and `destructive`. MUI's `contained` and `outlined` do not exist on it, and neither does a `color` prop.
 - Start is green and Stop is red, both set through the `StatusTopBar` button's `backgroundColor`, `backgroundColorHover` and `textColor`.
-- A `LogsPanel` row cuts `message` and `description` to one line and shows the rest only on hover. Keep `message` to a few words saying what happened, put the cause and what to do next in `description`, and open the whole entry in a `VentionModal` from `onLogClick`. Raise every error event as a banner on whatever page is open, whose View button opens that entry on the Logs page, as the example's `app.tsx` does.
+- A `LogsPanel` row cuts `message` and `description` to one line and shows the rest only on hover. Keep `message` to a few words saying what happened, put the cause and what to do next in `description`, and open the whole entry in a `VentionModal` from `onLogClick`. Log the HMI's own command failures there too, beside the server's events. Raise every error as a banner on whatever page is open, whose View button opens that entry on the Logs page; the banner fades after a few seconds, and the Logs tab shows a red count of the errors logged since that page was last opened, as the example's `app.tsx` does. Alerts float over the page just under the `StatusTopBar`, never in the page's flow, so one appearing never moves the layout.
 
 ## Validate before you push
 
@@ -180,7 +180,7 @@ The HMI drives physical machinery that can injure someone.
 
 - Start never fires on page load, on reconnect, or from a stream message. Only an operator's tap, confirmed in a modal, starts motion.
 - Start and Stop live in the `StatusTopBar`, so they are on every page. Do not repeat them on a page. Raise the bar above `theme.zIndex.modal`, as the example's `app.tsx` does, or an open `VentionModal` covers Stop.
-- Stop is disabled until this page load has received its first status, since no Stop can reach the app before then; show why next to it and say to use the emergency stop if the machine moves. After that, Stop stays enabled unless the station is known to be ready or already stopping, as the example's `canStop` does. A fault is neither, so Stop stays enabled there, and so it does while the stream is disconnected: a dropped stream may hide a moving machine. When Stop fails, say it did not reach the station and to use the emergency stop. Every other command is disabled while disconnected.
+- Stop is disabled until this page load has received its first status, since no Stop can reach the app before then; show why next to it and say to use the emergency stop if the machine moves. After that, Stop stays enabled unless the station is known to be ready or already stopping, as the example's `canStop` does. A fault is neither, so Stop stays enabled there, and so it does while the stream is disconnected: a dropped stream may hide a moving machine. When Stop fails, say it did not reach the station and to use the emergency stop, in an alert that stays until the operator closes it. Every other command is disabled while disconnected.
 - A tap on Stop shows at once. While the station stops, the Stop button reads "Stopping…" (derive that label from the streamed state and `connected`, as the example's `isStopping(status, connected)` does, never from a tapped flag alone: once the stream drops it reads "Stop" again and stays pressable), the Operate page's progress bar marks where the run now ends (the cycle in progress amber, the cancelled ones hatched and struck through), and a line by the heading says the emergency stop halts at once. Say it on the screen the operator already watches rather than in a separate alert.
 - Send Start with a `timeoutMs` and an abort signal, and abort it when the stream drops. A Start the operator can no longer see must not land later; say it was not confirmed and to check the station.
 - The HMI never offers a way around an emergency stop, safety interlock, light curtain or guard, not even a hidden one for testing.

package/skills/vention-machine-logic-hmi/examples/indexing-station-hmi/customui/src/app.tsx

@@ -2,9 +2,9 @@ import { Box } from "@mui/material"
 import { IconBook, IconHistory, IconLayoutDashboard, IconPlayerPlayFilled, IconPlayerStopFilled } from "@tabler/icons-react"
 import { NavigationBar, StatusTopBar } from "@vention/machine-apps-components"
 import type { LogEntry, LogType } from "@vention/machine-apps-components"
-import { COLORS, VentionAlert, VentionModal } from "@vention/machine-ui"
-import { useEffect, useRef, useState } from "react"
-import { Navigate, Route, Routes, useNavigate } from "react-router-dom"
+import { COLORS, VentionAlert, VentionCounter, VentionModal } from "@vention/machine-ui"
+import { useCallback, useEffect, useRef, useState } from "react"
+import { Navigate, Route, Routes, useLocation, useNavigate } from "react-router-dom"
 import { client, openEvents, openStatus, STATUS_STALL_MS } from "./client"
 import type { Event, Recipe } from "./gen/app_pb"
 import { LogsPage } from "./pages/logs-page"
@@ -19,6 +19,8 @@ const NAV_ICON_SIZE = 42
 const TOP_BAR_ICON_SIZE = 32
 // A Start that has not been answered by then is abandoned rather than left to land later.
 const START_TIMEOUT_MS = 5000
+// The Logs tab's unread count keeps an error after its banner fades.
+const ERROR_BANNER_MS = 8000
 
 function toLogLevel(level: string): LogType {
   if (level === "error") return "error"
@@ -26,37 +28,40 @@ function toLogLevel(level: string): LogType {
   return "info"
 }
 
-function useEventLog(): LogEntry[] {
+/** The server's events, plus the HMI's own command failures, newest first. */
+function useEventLog(): { entries: LogEntry[]; addEntry: (level: LogType, message: string, description: string) => string } {
   const { value: latestEvent } = useStream<Event>(openEvents)
   const [entries, setEntries] = useState<LogEntry[]>([])
   const nextId = useRef(0)
 
-  useEffect(() => {
-    if (latestEvent === undefined) return
+  const addEntry = useCallback((level: LogType, message: string, description: string, date = new Date().toISOString()) => {
     nextId.current += 1
-    const entry: LogEntry = {
-      id: String(nextId.current),
-      date: latestEvent.timestamp,
-      level: toLogLevel(latestEvent.level),
-      code: latestEvent.level.toUpperCase(),
-      message: latestEvent.message,
-      description: latestEvent.detail,
-    }
+    const entry: LogEntry = { id: String(nextId.current), date, level, code: level.toUpperCase(), message, description }
     setEntries(previous => [entry, ...previous].slice(0, MAX_LOG_ENTRIES))
-  }, [latestEvent])
+    return entry.id
+  }, [])
+
+  useEffect(() => {
+    if (latestEvent !== undefined) addEntry(toLogLevel(latestEvent.level), latestEvent.message, latestEvent.detail, latestEvent.timestamp)
+  }, [latestEvent, addEntry])
 
-  return entries
+  return { entries, addEntry }
 }
 
 export function App() {
   const { value: status, connected } = useStream(openStatus, STATUS_STALL_MS)
-  const logEntries = useEventLog()
-  const [commandError, setCommandError] = useState("")
+  const { entries: logEntries, addEntry } = useEventLog()
   const navigate = useNavigate()
-  // Every error event raises a banner on whatever page is open; View opens the whole entry on the Logs page.
+  const isOnLogsPage = useLocation().pathname === "/logs"
+  // The latest error shows as a banner on every page until it fades; View opens the whole entry on the Logs page.
   const [errorEntry, setErrorEntry] = useState<LogEntry | undefined>(undefined)
   const [openLogEntry, setOpenLogEntry] = useState<LogEntry | undefined>(undefined)
+  // A Stop that did not land never fades: the operator must know to use the emergency stop.
+  const [stopFailure, setStopFailure] = useState("")
+  const stopFailureIds = useRef(new Set<string>())
+  const [lastSeenLogId, setLastSeenLogId] = useState(0)
   const latestEntry = logEntries[0]
+  const unseenErrors = logEntries.filter(entry => entry.level === "error" && Number(entry.id) > lastSeenLogId).length
   const state = describeState(status, connected)
 
   const [recipe, setRecipe] = useState<Recipe | undefined>(undefined)
@@ -64,14 +69,26 @@ export function App() {
   const startRequest = useRef<AbortController | undefined>(undefined)
   const startable = canStart(status, connected) && recipe !== undefined
 
+  const reportError = useCallback((message: string, detail: string) => void addEntry("error", message, detail), [addEntry])
+
   useEffect(() => {
     if (!connected) startRequest.current?.abort()
   }, [connected])
 
   useEffect(() => {
-    if (latestEntry?.level === "error") setErrorEntry(latestEntry)
+    if (latestEntry?.level === "error" && !stopFailureIds.current.has(latestEntry.id)) setErrorEntry(latestEntry)
   }, [latestEntry])
 
+  useEffect(() => {
+    if (errorEntry === undefined) return
+    const timer = setTimeout(() => setErrorEntry(undefined), ERROR_BANNER_MS)
+    return () => clearTimeout(timer)
+  }, [errorEntry])
+
+  useEffect(() => {
+    if (isOnLogsPage && latestEntry !== undefined) setLastSeenLogId(Number(latestEntry.id))
+  }, [isOnLogsPage, latestEntry])
+
   const viewError = () => {
     setOpenLogEntry(errorEntry)
     setErrorEntry(undefined)
@@ -85,16 +102,18 @@ export function App() {
     startRequest.current = controller
     try {
       const response = await client.start({ recipeId: recipe.id }, { signal: controller.signal, timeoutMs: START_TIMEOUT_MS })
-      if (!response.accepted) setCommandError(`Start refused: ${response.message}`)
+      if (!response.accepted) reportError("Start refused", response.message)
     } catch (error) {
-      setCommandError(`Start not confirmed: ${errorText(error)}. Check the station state before starting again.`)
+      reportError("Start not confirmed", `${errorText(error)}. Check the station state before starting again.`)
     }
   }
 
   const stop = () => {
-    client
-      .trigger_Stop({})
-      .catch((error: unknown) => setCommandError(`Stop did not reach the station (${errorText(error)}). Use the emergency stop.`))
+    client.trigger_Stop({}).catch((error: unknown) => {
+      const detail = errorText(error)
+      stopFailureIds.current.add(addEntry("error", "Stop did not reach the station", `${detail}. Use the emergency stop.`))
+      setStopFailure(`Stop did not reach the station (${detail}). Use the emergency stop.`)
+    })
   }
 
   return (
@@ -127,47 +146,64 @@ export function App() {
             },
           ]}
         />
+        {/* Alerts float over the page, so one appearing never moves the page; the gaps between them stay tappable. */}
+        <Box
+          sx={{
+            position: "absolute",
+            top: "100%",
+            left: 0,
+            right: 0,
+            padding: 4,
+            display: "flex",
+            flexDirection: "column",
+            gap: 2,
+            pointerEvents: "none",
+            "& > *": { pointerEvents: "auto" },
+          }}
+        >
+          {status === undefined && (
+            <VentionAlert
+              severity="warn"
+              size="xx-large"
+              title="Not connected to the app yet"
+              descriptionText="Stop is available once the app answers. Use the emergency stop if the machine moves."
+              isFullWidth
+              appearance="elevated"
+            />
+          )}
+          {errorEntry !== undefined && (
+            <VentionAlert
+              severity="error"
+              size="xx-large"
+              title={errorEntry.message}
+              primaryButtonText="View"
+              onPrimaryButtonClick={viewError}
+              isFullWidth
+              appearance="elevated"
+              isCloseable
+              onCloseButtonClick={() => setErrorEntry(undefined)}
+            />
+          )}
+          {stopFailure !== "" && (
+            <VentionAlert
+              severity="error"
+              size="xx-large"
+              title={stopFailure}
+              isFullWidth
+              appearance="elevated"
+              isCloseable
+              onCloseButtonClick={() => setStopFailure("")}
+            />
+          )}
+        </Box>
       </Box>
-      {status === undefined && (
-        <VentionAlert
-          severity="warn"
-          size="xx-large"
-          title="Not connected to the app yet"
-          descriptionText="Stop is available once the app answers. Use the emergency stop if the machine moves."
-          isFullWidth
-        />
-      )}
-      {errorEntry !== undefined && (
-        <VentionAlert
-          severity="error"
-          size="xx-large"
-          title={errorEntry.message}
-          primaryButtonText="View"
-          onPrimaryButtonClick={viewError}
-          isFullWidth
-          isCloseable
-          onCloseButtonClick={() => setErrorEntry(undefined)}
-        />
-      )}
-      {commandError !== "" && (
-        <VentionAlert
-          severity="error"
-          size="xx-large"
-          title={commandError}
-          isFullWidth
-          isCloseable
-          onCloseButtonClick={() => setCommandError("")}
-        />
-      )}
       <Box sx={{ flex: 1, minHeight: 0, overflow: "auto", padding: 6 }}>
         <Routes>
           <Route
             path="/"
-            element={
-              <OperatePage status={status} connected={connected} recipe={recipe} onRecipeChange={setRecipe} onError={setCommandError} />
-            }
+            element={<OperatePage status={status} connected={connected} recipe={recipe} onRecipeChange={setRecipe} onError={reportError} />}
           />
-          <Route path="/recipes" element={<RecipesPage connected={connected} onError={setCommandError} />} />
+          <Route path="/recipes" element={<RecipesPage connected={connected} onError={reportError} />} />
           <Route path="/logs" element={<LogsPage entries={logEntries} openEntry={openLogEntry} onOpenEntry={setOpenLogEntry} />} />
           <Route path="*" element={<Navigate to="/" replace />} />
         </Routes>
@@ -175,7 +211,22 @@ export function App() {
       <NavigationBar variant="flex">
         <NavigationBar.Item id="operate" label="Operate" path="/" icon={<IconLayoutDashboard size={NAV_ICON_SIZE} color="white" />} />
         <NavigationBar.Item id="recipes" label="Recipes" path="/recipes" icon={<IconBook size={NAV_ICON_SIZE} color="white" />} />
-        <NavigationBar.Item id="logs" label="Logs" path="/logs" icon={<IconHistory size={NAV_ICON_SIZE} color="white" />} />
+        <NavigationBar.Item
+          id="logs"
+          label="Logs"
+          path="/logs"
+          icon={
+            // NavigationBar.Item has no badge, so the unread count sits on the icon's corner.
+            <Box sx={{ position: "relative", display: "flex" }}>
+              <IconHistory size={NAV_ICON_SIZE} color="white" />
+              {unseenErrors > 0 && (
+                <Box sx={{ position: "absolute", top: -8, right: -12 }}>
+                  <VentionCounter color="red" variant="filled" size="large" value={unseenErrors} />
+                </Box>
+              )}
+            </Box>
+          }
+        />
       </NavigationBar>
       <VentionModal
         isOpen={confirmingStart && startable}

package/skills/vention-machine-logic-hmi/examples/indexing-station-hmi/customui/src/pages/operate-page.tsx

@@ -10,7 +10,7 @@ interface OperatePageProps {
   connected: boolean
   recipe: Recipe | undefined
   onRecipeChange: (recipe: Recipe | undefined) => void
-  onError: (message: string) => void
+  onError: (message: string, detail: string) => void
 }
 
 /** What the page shows. The same regions render in every phase; only their content changes. */
@@ -202,12 +202,12 @@ export function OperatePage({ status, connected, recipe, onRecipeChange, onError
     if (!connected) return
     client.recipe_ListRecords({}).then(
       response => setRecipes(response.records),
-      (error: unknown) => onError(`Could not load recipes: ${errorText(error)}`)
+      (error: unknown) => onError("Could not load recipes", errorText(error))
     )
   }, [connected, onError])
 
   const reset = () => {
-    client.trigger_Reset({}).catch((error: unknown) => onError(`Reset failed: ${errorText(error)}`))
+    client.trigger_Reset({}).catch((error: unknown) => onError("Reset failed", errorText(error)))
   }
 
   return (

package/skills/vention-machine-logic-hmi/examples/indexing-station-hmi/customui/src/pages/recipes-page.tsx

@@ -19,7 +19,7 @@ const NUMERIC_FIELDS: { field: NumericField; label: string; unit: string; step:
 
 interface RecipesPageProps {
   connected: boolean
-  onError: (message: string) => void
+  onError: (message: string, detail: string) => void
 }
 
 export function RecipesPage({ connected, onError }: RecipesPageProps) {
@@ -32,7 +32,7 @@ export function RecipesPage({ connected, onError }: RecipesPageProps) {
     try {
       setRecipes((await client.recipe_ListRecords({})).records)
     } catch (error) {
-      onError(`Could not load recipes: ${errorText(error)}`)
+      onError("Could not load recipes", errorText(error))
     }
   }, [onError])
 
@@ -54,7 +54,7 @@ export function RecipesPage({ connected, onError }: RecipesPageProps) {
       setEditingId(response.record?.id)
       await reload()
     } catch (error) {
-      onError(`Could not save ${draft.name}: ${errorText(error)}`)
+      onError(`Could not save ${draft.name}`, errorText(error))
     }
   }
 
@@ -66,7 +66,7 @@ export function RecipesPage({ connected, onError }: RecipesPageProps) {
       edit(undefined)
       await reload()
     } catch (error) {
-      onError(`Could not delete ${draft.name}: ${errorText(error)}`)
+      onError(`Could not delete ${draft.name}`, errorText(error))
     }
   }
 

package/skills/vention-monitoring/SKILL.md

@@ -3,7 +3,7 @@ name: vention-monitoring
 description: Diagnose deployed Vention machines from controller state, history, health, and activity data. Use when the user reports a machine that is down, faulted, offline, slow, or underperforming, asks why a cycle time regressed, wants to interpret MachineMotion event data or drive and brake status, asks about OEE or uptime, or wants to know which machine in a fleet needs attention. Trigger on a MachineMotion serial number plus any complaint.
 license: MIT
 metadata:
-  version: "0.10.15"
+  version: "0.10.16"
   author: Vention
 ---