dsh-llm-verifier 0.9.2 → 0.9.3

package/lib/client.js

@@ -3421,7 +3421,8 @@ window.__ModuleLoader__.load({
 		//#endregion
 		//#region src/client.tsx
 		/**
-		* Icons, resolved by name across the two vocabularies this plugin spans.
+		* The one glyph still borrowed from the host, resolved by name across the two vocabularies this
+		* plugin spans.
 		*
 		* DSH 0.1.7 renamed the whole host icon set from a size suffix to a stroke suffix
 		* (`IconDataOutline16` → `IconDataOutlineRegular`). The icon module is external to this bundle, so
@@ -3429,9 +3430,11 @@ window.__ModuleLoader__.load({
 		* React throws on an undefined element type, which would take the entire settings page down
 		* instead of dropping one glyph. Probing the namespace at runtime keeps one bundle working on
 		* either line; a name that neither line defines renders nothing.
+		*
+		* The statistics mark is deliberately NOT in this list: every host glyph paints on `currentColor`,
+		* so as a guide entry it rendered grey-on-navy. `VerifierSidebarIcon` paints its own brand ramp.
 		*/
 		const hostIcons = _deepseek_ai_dsh_client_ui_primitives;
-		const IconData = hostIcons.IconDataOutlineRegular ?? hostIcons.IconDataOutline16 ?? (() => null);
 		const IconRefresh = hostIcons.IconRefreshOutlineRegular ?? hostIcons.IconRefreshOutline16 ?? (() => null);
 		const NS = "llm-verifier";
 		const shell = {
@@ -5014,12 +5017,9 @@ window.__ModuleLoader__.load({
 										display: "grid",
 										placeItems: "center",
 										width: 34,
-										height: 34,
-										borderRadius: 10,
-										background: "color-mix(in srgb, var(--dsw-alias-state-business-primary) 14%, transparent)",
-										color: "var(--dsw-alias-state-business-primary)"
+										height: 34
 									},
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconData, { size: 18 })
+									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(VerifierSidebarIcon, { size: 26 })
 								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
 									style: {
 										margin: 0,
@@ -6039,17 +6039,72 @@ window.__ModuleLoader__.load({
 				})
 			});
 		}
-		function VerifierSidebarIcon({ size, active }) {
-			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				style: {
-					display: "inline-flex",
-					alignItems: "center",
-					justifyContent: "center",
-					width: size,
-					height: size,
-					color: active ? "var(--dsw-alias-state-business-primary)" : "currentColor"
-				},
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(IconData, { size: Math.min(18, size) })
+		/**
+		* The statistics mark: a brand-gradient tile carrying the verifier's shield-and-check.
+		*
+		* The host's glyph vocabulary is monochrome by contract (every icon draws on
+		* `currentColor`, and the guide capsule pins that ink to a grey label alias), so a
+		* host icon registered as a guide entry always reads as grey-on-navy — dim next
+		* to a plugin whose glyph is coloured. This mark therefore ships its own paint:
+		* the same violet→blue→teal ramp the dashboard header already wears, a white
+		* shield, and a check cut back out of the ramp in the badge's own coordinates.
+		*
+		* Props follow the host's `IconProps` shape (`size` is the square edge in px,
+		* `className` is for placement), so the same component serves the guide capsule
+		* (26px) and the dashboard header (26px in a 34px well).
+		*
+		* @param props - rendered size and placement class.
+		* @returns the statistics badge.
+		*/
+		function VerifierSidebarIcon({ size = 26, className }) {
+			const gradientId = `llm-verifier-badge-${(0, react.useId)().replace(/[^a-zA-Z0-9-]/g, "")}`;
+			const paint = `url(#${gradientId})`;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+				width: size,
+				height: size,
+				viewBox: "0 0 24 24",
+				fill: "none",
+				"aria-hidden": "true",
+				className,
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("defs", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("linearGradient", {
+						id: gradientId,
+						x1: "1.5",
+						y1: "1",
+						x2: "22.5",
+						y2: "23",
+						gradientUnits: "userSpaceOnUse",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", { stopColor: "#8A63FF" }),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", {
+								offset: "0.5",
+								stopColor: "#4F7BFF"
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", {
+								offset: "1",
+								stopColor: "#2FC5C9"
+							})
+						]
+					}) }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("rect", {
+						width: "24",
+						height: "24",
+						rx: "7.5",
+						fill: paint
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+						d: "M12 4.4 18.4 6.9v5.2c0 3.6-2.7 6.4-6.4 7.6-3.7-1.2-6.4-4-6.4-7.6V6.9L12 4.4Z",
+						fill: "#FFFFFF",
+						fillOpacity: "0.94"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+						d: "M8.8 12.3 11 14.5 15.3 9.7",
+						stroke: paint,
+						strokeWidth: "2.1",
+						strokeLinecap: "round",
+						strokeLinejoin: "round"
+					})
+				]
 			});
 		}
 		function GlobalVerifierDashboard({ rpc }) {