react-ui — independently scanned and version-tracked by SaferSkills.
SaferSkills independently audited react-ui (Agent Skill) and scored it 100/100 (green). The audit ran 55 deterministic rules across Security, Supply Chain, Maintenance, Transparency, and Community; it found 0 high-severity and 0 lower-severity findings. The full rule-by-rule trace and per-finding evidence are below. Free, methodology-open.
Findings & checks · 0 flagged
Every scanned point with the score it earned and what moved between them.
First recorded scan — no prior version to compare against.
The primary manifest — the file an agent reads to learn what this artifact does.
For any val that renders a UI, prefer to build it with React components in .tsx files, unless the user states otherwise. The templates/react-hono-starter template is set up for this — start there with remix_val instead of building from scratch.
Put markup, styles, and scripts in real files — avoid template literal strings (e.g. new Response(\<html>...</html>\)). Code in template strings has no syntax highlighting, no linting, no type checking, and is unreviewable.
.tsx — React/JSX components, any UI with logic or interactivity.html — purely static markup.ts — server code and scriptsBuild UI component by component in .tsx files. Compose small components rather than rendering one giant page.
Prefer Twind to apply Tailwind utility classes at runtime — no build step required. Add the script to your HTML shell:
<script src="https://cdn.twind.style" crossorigin></script>Then use Tailwind classes directly in JSX:
<div className="flex items-center gap-4 p-6 rounded-lg bg-white shadow">
<h1 className="text-2xl font-bold">Hello</h1>
</div>Avoid inline <style> tags, CSS-in-JS objects, or separate .css files, unless the user says otherwise.
Every UI val should expose a way for users to see and remix its source. Both parts are required:
import { parseVal } from "https://esm.town/v/std/utils/index.ts";
app.get("/source", (c) => c.redirect(parseVal().links.self.val)); <a href="/source">view source</a>A common error — "Cannot read properties of null (reading 'useState')" — means a React sub-dependency is loading a different React version. Pin all React-related imports to 18.2.0:
import SomeLib from "https://esm.sh/[email protected],[email protected]";Do not use external images or hosted assets that may break. Prefer:
To send browser errors back to val logs (visible via get_logs), include this script in your HTML shell:
<script src="https://esm.town/v/std/catch"></script>After editing a UI val, call fetch_val_endpoint to confirm the page renders without error, then check get_logs for any client-side errors. Don't report the change as done without both.
~30 seconds. Free. No account. Every finding cites a rule and a line of evidence.