{"version":3,"file":"index.cjs","names":["React","React","Button","RxButton","RxInput","RxTextarea","RxBadge","React","React","Button","React","Button","React","Button","React","Button","React","Button","React","Button","React","React","Button"],"sources":["../../src/dt/lib/guard.ts","../../src/dt/lib/styles.ts","../../src/dt/components/icons.tsx","../../src/dt/components/json-tree.tsx","../../src/dt/components/layout.tsx","../../src/dt/components/ui.tsx","../../src/dt/lib/format.ts","../../src/dt/panels/trace-tree.tsx","../../src/dt/panels/decision.tsx","../../src/dt/panels/flow.tsx","../../src/dt/panels/metrics.tsx","../../src/dt/panels/policies.tsx","../../src/dt/panels/roles.tsx","../../src/dt/panels/subjects.tsx","../../src/dt/iam-devtools.tsx","../../src/dt/lib/logo.ts","../../src/dt/iam-devtools-panel.tsx","../../src/dt/lib/flow.ts"],"sourcesContent":["import type { AccessControl } from '../../core/types'\nimport type { IamIDevtoolsEngine } from './types'\n\n/**\n * Hard production guard for the IAM devtools - default-block.\n *\n * Returns `true` ONLY when an explicit positive `development` signal is\n * present - either the bundler set `NODE_ENV=development` or the engine was\n * constructed in `'development'` mode. Absence of any signal blocks the\n * panel so the policy/role/subject readers cannot leak into raw-browser\n * bundles that don't shim `process` or into engines that don't surface\n * `mode` (CWE-200 / CWE-489).\n *\n * No escape hatch: to use devtools in a deployed environment, run a dev\n * build behind an admin-only route.\n *\n * @param engine - The runtime engine the panel would inspect.\n * @returns `true` when devtools MAY render, `false` to block.\n */\nexport function isDevtoolsAllowed(engine: IamIDevtoolsEngine): boolean {\n // `process` may be undefined in raw-browser bundles that don't shim it;\n // \"no process\" is not a development signal.\n const nodeEnv: string | undefined =\n typeof process !== 'undefined' ? (process as { env?: { NODE_ENV?: string } }).env?.NODE_ENV : undefined\n\n // A bundler-set production signal always blocks, regardless of engine mode.\n if (nodeEnv === 'production') return false\n\n // Positive development signals - either side is sufficient.\n if (nodeEnv === 'development') return true\n\n const mode = readEngineMode(engine)\n if (mode === 'development') return true\n\n // No positive signal (or engine reports production / unknown) -> BLOCK.\n return false\n}\n\n/**\n * Back-compat name kept for any external callers. Inverse of\n * {@link isDevtoolsAllowed} - `true` means \"do NOT mount\".\n *\n * @deprecated Prefer {@link isDevtoolsAllowed} for clarity.\n */\nexport function isDevtoolsBlocked(engine: IamIDevtoolsEngine): boolean {\n return !isDevtoolsAllowed(engine)\n}\n\nfunction readEngineMode(engine: IamIDevtoolsEngine): AccessControl.Mode | undefined {\n const candidate = engine as {\n mode?: unknown\n config?: { mode?: unknown }\n _mode?: unknown\n }\n const raw = candidate.mode ?? candidate.config?.mode ?? candidate._mode\n if (raw === 'production' || raw === 'development') return raw\n return undefined\n}\n","const STYLE_ID = '__iam_dt_styles__'\n\n// Chrome + iam-dt-* utility CSS; theme tokens come from host via CSS vars.\nconst CSS = `\n.iam-dt-btn-wrap { position: fixed; z-index: 99998; }\n.iam-dt-btn-wrap[data-pos=\"bottom-right\"] { bottom: 20px; right: 20px; }\n.iam-dt-btn-wrap[data-pos=\"bottom-left\"] { bottom: 20px; left: 20px; }\n.iam-dt-btn-wrap[data-pos=\"top-right\"] { top: 20px; right: 20px; }\n.iam-dt-btn-wrap[data-pos=\"top-left\"] { top: 20px; left: 20px; }\n\n.iam-dt-panel-wrap {\n position: fixed; z-index: 99999;\n display: flex; flex-direction: column;\n transition: transform 240ms cubic-bezier(.32,.72,0,1), opacity 240ms ease;\n will-change: transform, opacity;\n}\n.iam-dt-panel-wrap[data-pos=\"bottom\"] { left: 0; right: 0; bottom: 0; }\n.iam-dt-panel-wrap[data-pos=\"top\"] { left: 0; right: 0; top: 0; }\n.iam-dt-panel-wrap[data-pos=\"left\"] { top: 0; bottom: 0; left: 0; }\n.iam-dt-panel-wrap[data-pos=\"right\"] { top: 0; bottom: 0; right: 0; }\n.iam-dt-panel-wrap[data-inset=\"1\"] { padding: 12px; }\n\n.iam-dt-resize { position: absolute; background: transparent; transition: background 160ms ease; }\n.iam-dt-resize:hover { background: var(--ring, oklch(0.7 0 0)); }\n.iam-dt-resize--ns { left: 0; right: 0; height: 4px; cursor: ns-resize; }\n.iam-dt-resize--ew { top: 0; bottom: 0; width: 4px; cursor: ew-resize; }\n.iam-dt-panel-wrap[data-pos=\"bottom\"] .iam-dt-resize { top: 0; }\n.iam-dt-panel-wrap[data-pos=\"top\"] .iam-dt-resize { bottom: 0; }\n.iam-dt-panel-wrap[data-pos=\"left\"] .iam-dt-resize { right: 0; }\n.iam-dt-panel-wrap[data-pos=\"right\"] .iam-dt-resize { left: 0; }\n\n@keyframes iam-dt-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }\n.iam-dt-spin { animation: iam-dt-spin 0.9s linear infinite; }\n\n/* Panel utility classes - use design tokens from the host's Tailwind theme. */\n.iam-dt-detail { flex: 1 1 auto; overflow: auto; min-height: 0; }\n.iam-dt-detail__head {\n display: flex; flex-wrap: wrap; align-items: center; gap: 8px;\n padding: 8px 12px; background: var(--card); border-bottom: 1px solid var(--border);\n position: sticky; top: 0; z-index: 1;\n}\n.iam-dt-detail__head code { font-family: ui-monospace, \"SF Mono\", Menlo, Consolas, monospace; font-size: 11px; color: var(--foreground); font-weight: 600; }\n.iam-dt-detail__meta { margin-left: auto; font-family: ui-monospace, monospace; font-size: 10px; color: var(--muted-foreground); }\n\n.iam-dt-listshell { display: flex; flex-direction: column; height: 100%; min-height: 0; }\n.iam-dt-listshell__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; background: var(--card); border-bottom: 1px solid var(--border); flex-shrink: 0; }\n.iam-dt-listshell__title { font-size: 10px; font-weight: 600; color: var(--muted-foreground); text-transform: uppercase; letter-spacing: 0.18em; }\n\n.iam-dt-trace__group { background: var(--card); border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }\n.iam-dt-trace__group-head { display: flex; width: 100%; align-items: center; gap: 8px; padding: 6px 10px; background: transparent; border: none; color: inherit; cursor: pointer; text-align: left; flex-wrap: wrap; transition: background 160ms ease; font-size: 11px; }\n.iam-dt-trace__group-head:hover { background: color-mix(in oklab, var(--muted) 50%, transparent); }\n.iam-dt-trace__group-body { padding: 8px 10px 10px 20px; display: flex; flex-direction: column; gap: 6px; border-top: 1px solid var(--border); }\n.iam-dt-trace__row { display: flex; align-items: center; gap: 8px; padding: 6px 10px; background: var(--card); border: 1px solid var(--border); border-radius: 6px; flex-wrap: wrap; }\n.iam-dt-trace__row code { font-family: ui-monospace, monospace; font-size: 11px; color: var(--foreground); }\n\n.iam-dt-stat { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; background: var(--card); border: 1px solid var(--border); border-radius: 8px; }\n.iam-dt-stat__label { font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.14em; color: var(--muted-foreground); }\n.iam-dt-stat__value { font-family: ui-monospace, monospace; font-size: 18px; font-weight: 700; color: var(--foreground); line-height: 1.1; letter-spacing: -0.02em; }\n.iam-dt-stat__hint { font-family: ui-monospace, monospace; font-size: 9px; color: var(--muted-foreground); }\n.iam-dt-stat-grid { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }\n\n.iam-dt-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }\n.iam-dt-col { display: flex; flex-direction: column; gap: 8px; }\n.iam-dt-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }\n@media (max-width: 600px) { .iam-dt-grid-2 { grid-template-columns: 1fr; } }\n.iam-dt-mute { color: var(--muted-foreground); font-family: ui-monospace, monospace; font-size: 10px; }\n.iam-dt-soft { color: var(--muted-foreground); }\n.iam-dt-pad { padding: 12px; }\n.iam-dt-sep { display: inline-block; width: 3px; height: 3px; background: currentColor; opacity: 0.5; border-radius: 50%; flex-shrink: 0; }\n\n.iam-dt-action { color: #60a5fa; font-weight: 600; }\n.iam-dt-resource { color: #fbbf24; font-weight: 600; }\n.iam-dt-effect-allow { color: #84cc16; font-weight: 700; }\n.iam-dt-effect-deny { color: #f87171; font-weight: 700; }\n\n.iam-dt-section__chev { display: inline-flex; align-items: center; justify-content: center; color: var(--muted-foreground); transition: transform 160ms ease; }\n.iam-dt-empty { padding: 32px 20px; text-align: center; font-size: 12px; color: var(--muted-foreground); }\n.iam-dt-empty--dashed { margin: 12px; padding: 20px; border: 1px dashed var(--border); border-radius: 8px; background: color-mix(in oklab, var(--card) 60%, transparent); }\n`\n\nexport function ensureStylesInjected() {\n if (typeof document === 'undefined') return\n if (document.getElementById(STYLE_ID)) return\n const style = document.createElement('style')\n style.id = STYLE_ID\n style.textContent = CSS\n document.head.appendChild(style)\n}\n","import type { CSSProperties } from 'react'\n\ninterface IconProps {\n size?: number\n className?: string\n style?: CSSProperties\n}\n\nconst base = {\n fill: 'none',\n stroke: 'currentColor',\n strokeWidth: 1.5,\n strokeLinecap: 'round' as const,\n strokeLinejoin: 'round' as const,\n}\n\nexport function ChevronDown({ size = 12, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n\nexport function ChevronRight({ size = 12, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n\nexport function Close({ size = 14, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n\nexport function Refresh({ size = 12, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n\nexport function Search({ size = 12, className, style }: IconProps) {\n return (\n \n \n \n \n )\n}\n\nexport function ArrowRight({ size = 12, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n\nexport function CornerUpRight({ size = 12, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n\nexport function Dot({ size = 4, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n\nexport function Spinner({ size = 12, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n\nexport function Check({ size = 12, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n\nexport function Minus({ size = 12, className, style }: IconProps) {\n return (\n \n \n \n )\n}\n","import { cn } from '@gentleduck/libs/cn'\nimport React from 'react'\nimport { ChevronDown, ChevronRight } from './icons'\n\nexport interface IJsonTreeProps {\n data: unknown\n label?: string\n defaultOpen?: boolean\n level?: number\n}\n\nfunction typeOf(v: unknown): 'object' | 'array' | 'string' | 'number' | 'boolean' | 'null' | 'undefined' | 'function' {\n if (v === null) return 'null'\n if (Array.isArray(v)) return 'array'\n if (typeof v === 'object') return 'object'\n return typeof v as 'string' | 'number' | 'boolean' | 'undefined' | 'function'\n}\n\nfunction previewLen(v: unknown): string {\n if (Array.isArray(v)) return `${v.length} ${v.length === 1 ? 'item' : 'items'}`\n if (v && typeof v === 'object') {\n const n = Object.keys(v as Record).length\n return `${n} ${n === 1 ? 'item' : 'items'}`\n }\n return ''\n}\n\nfunction Primitive({ value }: { value: unknown }) {\n const t = typeOf(value)\n if (t === 'string') return \"{String(value)}\"\n if (t === 'number') return {String(value)}\n if (t === 'boolean') return {String(value)}\n if (t === 'null') return null\n if (t === 'undefined') return undefined\n if (t === 'function') return ƒ()\n return {String(value)}\n}\n\nexport function JsonTree({ data, label, defaultOpen = false, level = 0 }: IJsonTreeProps) {\n const t = typeOf(data)\n const isContainer = t === 'object' || t === 'array'\n const [open, setOpen] = React.useState(defaultOpen || level === 0)\n\n if (!isContainer) {\n return (\n
\n
\n {label != null && {label}:}\n \n
\n
\n )\n }\n\n const entries = Array.isArray(data)\n ? (data as unknown[]).map((v, i) => [String(i), v] as const)\n : Object.entries(data as Record)\n const summary = previewLen(data)\n\n return (\n
\n setOpen((o) => !o)}\n className={cn('flex w-full items-baseline gap-1 rounded px-1 py-0.5 text-left hover:bg-muted/60')}>\n \n {open ? : }\n \n {label != null && {label}:}\n {t === 'array' ? '[' : '{'}\n {!open && ...{t === 'array' ? ']' : '}'}}\n {summary}\n \n {open && (\n
\n {entries.map(([k, v]) => (\n \n ))}\n
{t === 'array' ? ']' : '}'}
\n
\n )}\n
\n )\n}\n","import { cn } from '@gentleduck/libs/cn'\nimport React from 'react'\nimport { ChevronDown, ChevronRight, Search } from './icons'\n\nexport function SplitView({ left, right }: { left: React.ReactNode; right: React.ReactNode }) {\n return (\n
\n \n
{right}
\n
\n )\n}\n\nexport function ListShell({\n title,\n count,\n toolbar,\n children,\n}: {\n title?: string\n count?: number\n toolbar?: React.ReactNode\n children: React.ReactNode\n}) {\n return (\n
\n
\n
\n {title && (\n

{title}

\n )}\n {typeof count === 'number' && (\n \n {count}\n \n )}\n
\n {toolbar}\n
\n
{children}
\n
\n )\n}\n\nexport function ListItem({\n active,\n onClick,\n dot,\n primary,\n secondary,\n trailing,\n}: {\n active?: boolean\n onClick?: () => void\n dot?: string\n primary: React.ReactNode\n secondary?: React.ReactNode\n trailing?: React.ReactNode\n}) {\n return (\n \n {dot && }\n
\n \n {primary}\n
\n {secondary &&
{secondary}
}\n \n {trailing}\n \n )\n}\n\nexport function Section({\n title,\n defaultOpen = true,\n toolbar,\n children,\n}: {\n title: string\n defaultOpen?: boolean\n toolbar?: React.ReactNode\n children: React.ReactNode\n}) {\n const [open, setOpen] = React.useState(defaultOpen)\n return (\n
\n
\n \n {toolbar}\n
\n {open &&
{children}
}\n
\n )\n}\n\nexport function DetailEmpty({ message }: { message: string }) {\n return (\n
\n {message}\n
\n )\n}\n\nexport function FilterBar({\n value,\n onChange,\n placeholder = 'Filter',\n trailing,\n}: {\n value: string\n onChange: (v: string) => void\n placeholder?: string\n trailing?: React.ReactNode\n}) {\n return (\n
\n
\n \n onChange(e.target.value)}\n placeholder={placeholder}\n className=\"flex h-7 w-full rounded-md border border-input bg-background pr-2 pl-7 text-[11px] outline-none transition-colors placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring/50\"\n />\n
\n {trailing}\n
\n )\n}\n","import { cn } from '@gentleduck/libs/cn'\nimport { Badge as RxBadge } from '@gentleduck/registry-ui/badge'\nimport { Button as RxButton } from '@gentleduck/registry-ui/button'\nimport { CardContent, CardHeader, CardTitle, Card as RxCard } from '@gentleduck/registry-ui/card'\nimport { Input as RxInput } from '@gentleduck/registry-ui/input'\nimport { Textarea as RxTextarea } from '@gentleduck/registry-ui/textarea'\nimport type React from 'react'\n\nexport function Card({\n title,\n children,\n actions,\n}: {\n title?: string\n children: React.ReactNode\n actions?: React.ReactNode\n}) {\n return (\n \n {(title || actions) && (\n \n {title && (\n \n {title}\n \n )}\n {actions}\n \n )}\n {children}\n \n )\n}\n\nexport function Button({\n children,\n onClick,\n variant = 'default',\n disabled,\n type = 'button',\n className,\n}: {\n children: React.ReactNode\n onClick?: () => void\n variant?: 'default' | 'primary' | 'ghost' | 'danger'\n disabled?: boolean\n type?: 'button' | 'submit'\n className?: string\n}) {\n const rxVariant =\n variant === 'primary' ? 'default' : variant === 'danger' ? 'destructive' : variant === 'ghost' ? 'ghost' : 'outline'\n return (\n \n {children}\n \n )\n}\n\nexport function Field({ label, children }: { label: string; children: React.ReactNode }) {\n return (\n
\n {label}\n {children}\n
\n )\n}\n\nexport function Input(props: React.InputHTMLAttributes) {\n return \n}\n\nexport function TextArea(props: React.TextareaHTMLAttributes) {\n return \n}\n\nexport function Badge({\n children,\n tone = 'neutral',\n className,\n}: {\n children: React.ReactNode\n tone?: 'neutral' | 'allow' | 'deny' | 'info' | 'warn'\n className?: string\n}) {\n const variant =\n tone === 'allow'\n ? 'default'\n : tone === 'deny'\n ? 'destructive'\n : tone === 'info'\n ? 'secondary'\n : tone === 'warn'\n ? 'outline'\n : 'outline'\n const toneCls =\n tone === 'allow'\n ? 'bg-lime-500/10 text-lime-400 border-lime-500/35 hover:bg-lime-500/15'\n : tone === 'deny'\n ? 'bg-red-500/10 text-red-400 border-red-500/35 hover:bg-red-500/15'\n : tone === 'info'\n ? 'bg-sky-500/10 text-sky-400 border-sky-500/35 hover:bg-sky-500/15'\n : tone === 'warn'\n ? 'bg-amber-500/10 text-amber-400 border-amber-500/35 hover:bg-amber-500/15'\n : ''\n return (\n \n {children}\n \n )\n}\n\nexport function Empty({ message }: { message: string }) {\n return (\n
\n {message}\n
\n )\n}\n\nexport function Alert({ kind, children }: { kind: 'error' | 'success'; children: React.ReactNode }) {\n return (\n \n {children}\n \n )\n}\n","import type { Explain } from '../../core/explain'\nimport type { AccessControl, IamPrimitives } from '../../core/types'\n\nexport function formatAttrValue(value: IamPrimitives.AttributeValue | undefined): string {\n if (value === undefined) return '(undefined)'\n if (value === null) return 'null'\n if (typeof value === 'string') return JSON.stringify(value)\n if (typeof value === 'number' || typeof value === 'boolean') return String(value)\n if (Array.isArray(value))\n return `[${value.map((v) => formatAttrValue(v as IamPrimitives.AttributeValue)).join(', ')}]`\n return JSON.stringify(value)\n}\n\nexport function effectColor(effect: AccessControl.Effect): string {\n return effect === 'allow' ? 'text-emerald-500' : 'text-rose-500'\n}\n\nexport function resultColor(result: boolean): string {\n return result ? 'text-emerald-500' : 'text-rose-500'\n}\n\nexport function safeParseJson(raw: string, fallback: T): { value: T; error?: string } {\n const trimmed = raw.trim()\n if (!trimmed) return { value: fallback }\n try {\n return { value: JSON.parse(trimmed) as T }\n } catch (err) {\n return { value: fallback, error: err instanceof Error ? err.message : String(err) }\n }\n}\n\nexport function summarizeTrace(trace: Explain.Trace): string {\n if (trace.type === 'condition') {\n return `${trace.field} ${trace.operator} ${formatAttrValue(trace.expected)}`\n }\n const logic = trace.logic.toUpperCase()\n return `${logic} (${trace.children.length})`\n}\n\nexport function countConditions(trace: Explain.Trace): number {\n if (trace.type === 'condition') return 1\n return trace.children.reduce((sum, c) => sum + countConditions(c), 0)\n}\n","import React from 'react'\nimport type { Explain } from '../../core/explain'\nimport { ArrowRight, ChevronDown, ChevronRight } from '../components/icons'\nimport { Badge } from '../components/ui'\nimport { formatAttrValue, summarizeTrace } from '../lib/format'\n\nfunction LeafNode({ leaf }: { leaf: Explain.ILeafTrace }) {\n return (\n
\n
\n {leaf.result ? 'PASS' : 'FAIL'}\n {leaf.field}\n {leaf.operator}\n
\n
\n
\n expected: {formatAttrValue(leaf.expected)}\n
\n
\n actual:{' '}\n \n {formatAttrValue(leaf.actual)}\n \n
\n
\n
\n )\n}\n\nfunction GroupNode({ group, depth = 0 }: { group: Explain.IGroupTrace; depth?: number }) {\n const [open, setOpen] = React.useState(depth < 2)\n return (\n
\n \n {open && (\n
\n {group.children.map((child) =>\n child.type === 'condition' ? (\n \n ) : (\n \n ),\n )}\n
\n )}\n
\n )\n}\n\nfunction RuleTrace({ rule }: { rule: Explain.IRuleTrace }) {\n const [open, setOpen] = React.useState(rule.matched)\n return (\n
\n \n {open && (\n
\n \n
\n )}\n
\n )\n}\n\nexport function IamTraceTree({ result }: { result: Explain.IResult }) {\n return (\n
\n
\n \n {result.decision.allowed ? 'ALLOWED' : 'DENIED'}\n \n \n {result.summary}\n \n
\n {result.policies.length === 0 ? (\n
no policies evaluated
\n ) : (\n result.policies.map((p) => (\n
\n
\n {p.policyName ?? p.policyId}\n target\n {p.result}\n \n {p.algorithm}\n \n {p.decidingRuleId && (\n \n {p.decidingRuleId}\n \n )}\n {p.reason}\n
\n
\n {p.rules.map((r) => (\n \n ))}\n
\n
\n ))\n )}\n
\n )\n}\n","import React from 'react'\nimport type { Explain } from '../../core/explain'\nimport type { IamPrimitives } from '../../core/types'\nimport { Spinner } from '../components/icons'\nimport { JsonTree } from '../components/json-tree'\nimport { DetailEmpty, Section, SplitView } from '../components/layout'\nimport { Alert, Badge, Button, Field, Input, TextArea } from '../components/ui'\nimport { safeParseJson } from '../lib/format'\nimport type { IamIDecisionInput, IamIDevtoolsEngine } from '../lib/types'\nimport { IamTraceTree } from './trace-tree'\n\nconst INITIAL: IamIDecisionInput = {\n subjectId: '',\n action: '',\n resourceType: '',\n resourceId: '',\n attributesJson: '{}',\n environmentJson: '{}',\n scope: '',\n}\n\nexport function IamDecisionInspector({\n engine,\n defaults,\n}: {\n engine: IamIDevtoolsEngine\n defaults?: Partial\n}) {\n const [input, setInput] = React.useState({ ...INITIAL, ...defaults })\n const [result, setResult] = React.useState(null)\n const [error, setError] = React.useState(null)\n const [pending, setPending] = React.useState(false)\n\n const update = (patch: Partial) => setInput((s) => ({ ...s, ...patch }))\n\n async function run() {\n setError(null)\n setPending(true)\n try {\n const attrs = safeParseJson>(input.attributesJson, {})\n const env = safeParseJson>(input.environmentJson, {})\n if (attrs.error) throw new Error(`attributes JSON: ${attrs.error}`)\n if (env.error) throw new Error(`environment JSON: ${env.error}`)\n const resource = { type: input.resourceType, id: input.resourceId || undefined, attributes: attrs.value }\n const environment = { ...env.value, ...(input.scope ? { scope: input.scope } : {}) }\n const trace = await engine.explain(input.subjectId, input.action, resource, environment)\n setResult(trace)\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err))\n } finally {\n setPending(false)\n }\n }\n\n return (\n \n
\n

Request

\n \n
\n
\n \n update({ subjectId: e.target.value })}\n placeholder=\"user-1\"\n value={input.subjectId}\n />\n \n
\n \n update({ action: e.target.value })} placeholder=\"read\" value={input.action} />\n \n \n update({ scope: e.target.value })} placeholder=\"org-acme\" value={input.scope} />\n \n
\n
\n \n update({ resourceType: e.target.value })}\n placeholder=\"post\"\n value={input.resourceType}\n />\n \n \n update({ resourceId: e.target.value })}\n placeholder=\"p-1\"\n value={input.resourceId}\n />\n \n
\n \n update({ attributesJson: e.target.value })}\n rows={4}\n value={input.attributesJson}\n />\n \n \n update({ environmentJson: e.target.value })}\n rows={3}\n value={input.environmentJson}\n />\n \n
\n \n }\n right={\n error ? (\n {error}\n ) : !result ? (\n \n ) : (\n
\n
\n \n {result.decision.allowed ? 'allow' : 'deny'}\n \n {input.action}\n on\n {input.resourceType}\n subject: {input.subjectId || '-'}\n
\n
\n

\n {result.summary}\n

\n
\n
\n \n
\n
\n \n
\n
\n )\n }\n />\n )\n}\n","import { cn } from '@gentleduck/libs/cn'\nimport React from 'react'\nimport { Refresh } from '../components/icons'\nimport { JsonTree } from '../components/json-tree'\nimport { DetailEmpty, FilterBar, ListItem, ListShell, Section, SplitView } from '../components/layout'\nimport { Badge, Button } from '../components/ui'\nimport type { IamIFlowEntry, IamIFlowRecorder } from '../lib/flow'\n\nfunction pad(n: number, w = 2) {\n return String(n).padStart(w, '0')\n}\nfunction fmtTime(ts: number) {\n const d = new Date(ts)\n return `${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}.${pad(d.getMilliseconds(), 3)}`\n}\nfunction fmtAgo(ts: number, now: number) {\n const ms = Math.max(0, now - ts)\n if (ms < 1000) return `${ms}ms ago`\n if (ms < 60_000) return `${Math.floor(ms / 1000)}s ago`\n if (ms < 3_600_000) return `${Math.floor(ms / 60_000)}m ago`\n return `${Math.floor(ms / 3_600_000)}h ago`\n}\n\nfunction ActionChip({ action }: { action: string }) {\n return (\n \n {action}\n \n )\n}\nfunction ResourceChip({ resource, resourceId }: { resource: string; resourceId?: string }) {\n return (\n \n {resource}\n {resourceId && #{resourceId}}\n \n )\n}\nfunction SubjectChip({ id }: { id: string }) {\n const initial = id.replace(/^u-/, '').charAt(0).toUpperCase() || '?'\n return (\n
\n \n {initial}\n \n {id}\n
\n )\n}\n\nexport function IamFlowPanel({ flow }: { flow: IamIFlowRecorder }) {\n const [entries, setEntries] = React.useState(() => flow.list())\n const [selected, setSelected] = React.useState(null)\n const [filter, setFilter] = React.useState('')\n const [showAllow, setShowAllow] = React.useState(true)\n const [showDeny, setShowDeny] = React.useState(true)\n const [now, setNow] = React.useState(Date.now())\n const [copied, setCopied] = React.useState(false)\n\n React.useEffect(() => {\n const off = flow.subscribe(() => setEntries(flow.list().slice()))\n return off\n }, [flow])\n React.useEffect(() => {\n const id = setInterval(() => setNow(Date.now()), 1000)\n return () => clearInterval(id)\n }, [])\n\n const q = filter.trim().toLowerCase()\n const filtered = entries.filter((e) => {\n if (!showAllow && e.allowed) return false\n if (!showDeny && !e.allowed) return false\n if (!q) return true\n return (\n e.subjectId.toLowerCase().includes(q) ||\n e.action.toLowerCase().includes(q) ||\n e.resource.toLowerCase().includes(q) ||\n (e.resourceId ?? '').toLowerCase().includes(q)\n )\n })\n\n const current = selected != null ? (flow.get(selected) ?? null) : null\n const counts = React.useMemo(() => {\n let allow = 0,\n deny = 0\n for (const e of entries) e.allowed ? allow++ : deny++\n return { allow, deny }\n }, [entries])\n\n const copyEntry = async () => {\n if (!current) return\n try {\n await navigator.clipboard.writeText(JSON.stringify(current, null, 2))\n setCopied(true)\n setTimeout(() => setCopied(false), 1500)\n } catch {}\n }\n\n return (\n flow.clear()}>\n clear\n \n }>\n \n
\n setShowAllow((v) => !v)}>\n allow {counts.allow}\n \n setShowDeny((v) => !v)}>\n deny {counts.deny}\n \n
\n {filtered.length === 0 && (\n \n )}\n {filtered.map((e) => (\n setSelected(e.id)}\n primary={\n \n {e.action}\n on\n {e.resource}\n {e.resourceId && #{e.resourceId}}\n \n }\n secondary={\n \n {e.subjectId}\n \n {fmtAgo(e.ts, now)}\n {typeof e.durationMs === 'number' && (\n <>\n \n {e.durationMs.toFixed(1)}ms\n \n )}\n \n }\n />\n ))}\n \n }\n right={\n !current ? (\n \n ) : (\n
\n
\n {current.allowed ? 'allow' : 'deny'}\n \n on\n \n \n {fmtTime(current.ts)}\n {typeof current.durationMs === 'number' && (\n <>\n \n {current.durationMs.toFixed(2)}ms\n \n )}\n \n
\n
\n
\n
\n \n {current.scope && scope: {current.scope}}\n
\n
\n {current.reason && (\n
\n

\n {current.reason}\n

\n
\n )}\n {(current.decidingPolicy || current.decidingRule) && (\n
\n
\n {current.decidingPolicy && }\n {current.decidingRule && }\n
\n
\n )}\n {current.environment && Object.keys(current.environment).length > 0 && (\n
\n \n
\n )}\n
\n \n
\n
\n
\n \n
\n
\n )\n }\n />\n )\n}\n\nfunction FilterPill({\n active,\n tone,\n onClick,\n children,\n}: {\n active: boolean\n tone: 'allow' | 'deny'\n onClick: () => void\n children: React.ReactNode\n}) {\n return (\n \n {children}\n \n )\n}\n\nfunction Dot() {\n return \n}\n\nfunction Kv({ k, v }: { k: string; v: string }) {\n return (\n
\n {k}\n {v}\n
\n )\n}\n","import React from 'react'\nimport { Refresh } from '../components/icons'\nimport { JsonTree } from '../components/json-tree'\nimport { Section } from '../components/layout'\nimport { Badge, Button, Empty } from '../components/ui'\nimport type { IamIDevtoolsEngine, IamIDevtoolsMetrics } from '../lib/types'\n\nfunction Stat({ label, value, hint }: { label: string; value: string | number; hint?: string }) {\n return (\n
\n {label}\n {value}\n {hint && {hint}}\n
\n )\n}\n\nexport function IamMetricsPanel({\n engine,\n metrics,\n pollMs = 1000,\n}: {\n engine: IamIDevtoolsEngine\n metrics?: IamIDevtoolsMetrics\n pollMs?: number\n}) {\n const [stats, setStats] = React.useState(() => engine.stats())\n const [snap, setSnap] = React.useState(() => metrics?.snapshot() ?? null)\n\n React.useEffect(() => {\n const id = setInterval(() => {\n setStats(engine.stats())\n if (metrics) setSnap(metrics.snapshot())\n }, pollMs)\n return () => clearInterval(id)\n }, [engine, metrics, pollMs])\n\n const allowRate = snap && snap.total > 0 ? Math.round((snap.allow / snap.total) * 100) : 0\n\n return (\n
\n
\n Telemetry\n poll {pollMs}ms\n \n {\n engine.resetStats()\n metrics?.reset()\n setStats(engine.stats())\n setSnap(metrics?.snapshot() ?? null)\n }}>\n reset\n \n \n
\n
\n {!metrics ? (\n \n ) : !snap ? (\n \n ) : (\n
\n \n \n \n \n \n \n \n \n
\n )}\n
\n
\n
\n {Object.entries(stats).map(([name, s]) => {\n const total = s.hits + s.misses\n const hit = total > 0 ? Math.round((s.hits / total) * 100) : 0\n return (\n
\n
\n {name}\n 80 ? 'allow' : hit > 50 ? 'info' : 'warn'}>{hit}%\n
\n \n size {s.size}\n \n {s.hits} hits / {s.misses} miss\n \n
\n )\n })}\n
\n
\n
\n \n
\n
\n )\n}\n","import React from 'react'\nimport type { AccessControl } from '../../core/types'\nimport { ChevronDown, ChevronRight, Refresh } from '../components/icons'\nimport { JsonTree } from '../components/json-tree'\nimport { DetailEmpty, FilterBar, ListItem, ListShell, Section, SplitView } from '../components/layout'\nimport { Alert, Badge, Button } from '../components/ui'\nimport type { IamIDevtoolsEngine } from '../lib/types'\n\nexport function IamPoliciesPanel({ engine }: { engine: IamIDevtoolsEngine }) {\n const [policies, setPolicies] = React.useState([])\n const [selected, setSelected] = React.useState(null)\n const [error, setError] = React.useState(null)\n const [filter, setFilter] = React.useState('')\n\n const load = React.useCallback(async () => {\n try {\n setError(null)\n setPolicies(await engine.admin.listPolicies())\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err))\n }\n }, [engine])\n\n React.useEffect(() => {\n void load()\n }, [load])\n\n const filtered = policies.filter(\n (p) =>\n p.id.toLowerCase().includes(filter.toLowerCase()) || (p.name ?? '').toLowerCase().includes(filter.toLowerCase()),\n )\n const current = policies.find((p) => p.id === selected) ?? null\n\n return (\n \n refresh\n \n }>\n \n {error && {error}}\n {filtered.length === 0 && !error && }\n {filtered.map((p) => (\n setSelected(p.id)}\n primary={p.id}\n secondary={\n \n {p.rules.length} rules\n \n {p.algorithm}\n \n }\n trailing={{p.algorithm}}\n />\n ))}\n \n }\n right={\n !current ? (\n \n ) : (\n
\n
\n {current.id}\n {current.name}\n {current.algorithm}\n {current.version != null && v{current.version}}\n {current.rules.length} rules\n
\n {current.description && (\n
\n

\n {current.description}\n

\n
\n )}\n
\n
\n {current.rules.map((r) => (\n \n ))}\n
\n
\n
\n \n
\n
\n )\n }\n />\n )\n}\n\nfunction RuleRow({ rule }: { rule: AccessControl.IRule }) {\n const [open, setOpen] = React.useState(false)\n return (\n
\n \n {open && (\n
\n {rule.description && (\n

\n {rule.description}\n

\n )}\n {rule.conditions && }\n
\n )}\n
\n )\n}\n","import React from 'react'\nimport type { AccessControl } from '../../core/types'\nimport { ChevronDown, ChevronRight, CornerUpRight, Refresh } from '../components/icons'\nimport { JsonTree } from '../components/json-tree'\nimport { DetailEmpty, FilterBar, ListItem, ListShell, Section, SplitView } from '../components/layout'\nimport { Alert, Badge, Button } from '../components/ui'\nimport type { IamIDevtoolsEngine } from '../lib/types'\n\nexport function IamRolesPanel({ engine }: { engine: IamIDevtoolsEngine }) {\n const [roles, setRoles] = React.useState([])\n const [selected, setSelected] = React.useState(null)\n const [error, setError] = React.useState(null)\n const [filter, setFilter] = React.useState('')\n\n const load = React.useCallback(async () => {\n try {\n setError(null)\n setRoles(await engine.admin.listRoles())\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err))\n }\n }, [engine])\n\n React.useEffect(() => {\n void load()\n }, [load])\n\n const filtered = roles.filter(\n (r) =>\n r.id.toLowerCase().includes(filter.toLowerCase()) || (r.name ?? '').toLowerCase().includes(filter.toLowerCase()),\n )\n const current = roles.find((r) => r.id === selected) ?? null\n\n return (\n \n refresh\n \n }>\n \n {error && {error}}\n {filtered.length === 0 && !error && }\n {filtered.map((r) => (\n setSelected(r.id)}\n primary={r.id}\n secondary={\n \n {r.permissions.length} perms\n {r.inherits?.length ? (\n <>\n \n {r.inherits.join(', ')}\n \n ) : null}\n \n }\n trailing={{r.permissions.length}}\n />\n ))}\n \n }\n right={\n !current ? (\n \n ) : (\n
\n
\n {current.id}\n {current.name}\n {current.scope && scope: {current.scope}}\n
\n {current.description && (\n
\n

\n {current.description}\n

\n
\n )}\n {current.inherits && current.inherits.length > 0 && (\n
\n
\n {current.inherits.map((id) => (\n {id}\n ))}\n
\n
\n )}\n
\n
\n {current.permissions.map((p) => (\n \n ))}\n
\n
\n
\n \n
\n
\n )\n }\n />\n )\n}\n\nfunction PermRow({ perm }: { perm: AccessControl.IPermission }) {\n const [open, setOpen] = React.useState(false)\n const hasDetail = !!perm.conditions || !!perm.scope\n return (\n
\n hasDetail && setOpen((o) => !o)}\n className=\"iam-dt-trace__group-head\"\n disabled={!hasDetail}>\n {hasDetail ? open ? : : null}\n {perm.action}\n on\n {perm.resource}\n {perm.scope && {perm.scope}}\n {perm.conditions && cond}\n \n {open && hasDetail && perm.conditions && (\n
\n \n
\n )}\n
\n )\n}\n","import React from 'react'\nimport type { IamPrimitives } from '../../core/types'\nimport { JsonTree } from '../components/json-tree'\nimport { DetailEmpty, Section, SplitView } from '../components/layout'\nimport { Alert, Badge, Button, Field, Input, TextArea } from '../components/ui'\nimport { safeParseJson } from '../lib/format'\nimport type { IamIDevtoolsEngine } from '../lib/types'\n\nexport function IamSubjectsPanel({ engine }: { engine: IamIDevtoolsEngine }) {\n const [subjectId, setSubjectId] = React.useState('')\n const [attrs, setAttrs] = React.useState(null)\n const [attrsDraft, setAttrsDraft] = React.useState('{}')\n const [roleId, setRoleId] = React.useState('')\n const [scope, setScope] = React.useState('')\n const [busy, setBusy] = React.useState(false)\n const [error, setError] = React.useState(null)\n const [status, setStatus] = React.useState(null)\n\n async function load() {\n setError(null)\n setStatus(null)\n if (!subjectId) return setError('subject id required')\n setBusy(true)\n try {\n const a = await engine.admin.getAttributes(subjectId)\n setAttrs(a)\n setAttrsDraft(JSON.stringify(a, null, 2))\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err))\n } finally {\n setBusy(false)\n }\n }\n\n async function saveAttrs() {\n setError(null)\n setStatus(null)\n const parsed = safeParseJson(attrsDraft, {})\n if (parsed.error) return setError(`attributes JSON: ${parsed.error}`)\n setBusy(true)\n try {\n await engine.admin.setAttributes(subjectId, parsed.value)\n setAttrs(parsed.value)\n setStatus('attributes saved')\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err))\n } finally {\n setBusy(false)\n }\n }\n\n async function assign() {\n setError(null)\n setStatus(null)\n if (!roleId) return setError('role id required')\n setBusy(true)\n try {\n await engine.admin.assignRole(subjectId, roleId, scope || undefined)\n setStatus(`assigned ${roleId}${scope ? ` @ ${scope}` : ''}`)\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err))\n } finally {\n setBusy(false)\n }\n }\n\n async function revoke() {\n setError(null)\n setStatus(null)\n if (!roleId) return setError('role id required')\n setBusy(true)\n try {\n await engine.admin.revokeRole(subjectId, roleId, scope || undefined)\n setStatus(`revoked ${roleId}${scope ? ` @ ${scope}` : ''}`)\n } catch (err) {\n setError(err instanceof Error ? err.message : String(err))\n } finally {\n setBusy(false)\n }\n }\n\n return (\n \n
\n

Lookup

\n
\n
\n \n setSubjectId(e.target.value)} placeholder=\"user-1\" value={subjectId} />\n \n \n {error && {error}}\n {status && {status}}\n {attrs && (\n
\n {Object.keys(attrs).length} attrs\n
\n )}\n
\n \n }\n right={\n !subjectId ? (\n \n ) : (\n
\n
\n {subjectId}\n
\n
\n {attrs ? (\n \n ) : (\n

\n Load to view.\n

\n )}\n
\n
\n
\n