/* ===========================================================================
Azure Helper โ shared primitives (exported to window)
=========================================================================== */
const { useState, useEffect, useRef, useMemo } = React;
/* ---------- Icons (inline stroke SVG, 1.6 stroke) ---------- */
function Icon({ name, size = 16, color = "currentColor", style, className }) {
const p = { width: size, height: size, viewBox: "0 0 24 24", fill: "none",
stroke: color, strokeWidth: 1.7, strokeLinecap: "round", strokeLinejoin: "round", style, className };
const paths = {
home: <>,
agent: <>,
graph: <>,
book: <>,
bolt: <>,
check: <>,
x: <>,
play: <>,
shield: <>,
user: <>,
users: <>,
key: <>,
plug: <>,
arrow: <>,
chevron: <>,
spark: <>,
eye: <>,
alert: <>,
copy: <>,
send: <>,
refresh: <>,
list: <>,
layers: <>,
folder: <>,
gear: <>,
};
return ;
}
/* ---------- // SECTION label ---------- */
function SecLabel({ children }) { return {children}
; }
/* ---------- PS prompt line ---------- */
function PS({ user = "jamie", host = "contoso", path = "Helper", cmd, caret }) {
return (
PS {user}@{host}
:~/{path}>
{cmd && {cmd}}
{caret && }
);
}
/* ---------- breadcrumb crumbs ---------- */
function Crumbs({ items }) {
return (
>
{items.map((it, i) => (
{i > 0 && ยท}
{it.label}
))}
);
}
/* ---------- Method tag ---------- */
function Method({ m }) {
const cls = { GET: "m-get", POST: "m-post", PATCH: "m-patch", DELETE: "m-delete" }[m] || "m-get";
return {m};
}
/* ---------- JSON syntax-highlighted view ---------- */
function highlightJSON(value, indent = 0) {
const pad = " ".repeat(indent);
const padIn = " ".repeat(indent + 1);
if (value === null) return null;
if (typeof value === "number") return {String(value)};
if (typeof value === "boolean") return {String(value)};
if (typeof value === "string") return "{value}";
if (Array.isArray(value)) {
if (value.length === 0) return [];
return (
<>
[{"\n"}
{value.map((v, i) => (
{padIn}{highlightJSON(v, indent + 1)}
{i < value.length - 1 ? , : null}{"\n"}
))}
{pad}]
);
}
const keys = Object.keys(value);
if (keys.length === 0) return {"{}"};
return (
<>
{"{"}{"\n"}
{keys.map((k, i) => (
{padIn}"{k}":
{highlightJSON(value[k], indent + 1)}
{i < keys.length - 1 ? , : null}{"\n"}
))}
{pad}{"}"}
);
}
function JsonView({ data, style }) {
return {highlightJSON(data)};
}
/* ---------- Copyable command line ---------- */
function CmdLine({ method, url, body }) {
return (
https://graph.microsoft.com{url}
{body &&
{highlightJSON(body)}
}
);
}
/* ---------- Risk pill ---------- */
function RiskPill({ risk }) {
if (risk === "write") return โ writes data;
return โ read-only;
}
/* ---------- Typing dots ---------- */
function Thinking({ label = "thinking" }) {
const [d, setD] = useState(1);
useEffect(() => { const t = setInterval(() => setD(x => (x % 3) + 1), 350); return () => clearInterval(t); }, []);
return {label}{".".repeat(d)};
}
Object.assign(window, { Icon, SecLabel, PS, Crumbs, Method, JsonView, CmdLine, RiskPill, Thinking, highlightJSON });