MCPNEW

McpScopeInspector

Expandable scope tree with human-readable descriptions.

Available inreact

Preview

Live previewreal component

Install

TerminalBash

$ npx @mcp-elements/cli add mcp-scope-inspector

Usage

mcp-scope-inspector-example.tsxTSX

import { McpScopeInspector } from '@mcp-elements/react'

const scopes = [
  { id: 'repo:read', label: 'Read repositories', description: 'List and read repository contents', risk: 'low' },
  { id: 'repo:write', label: 'Write repositories', description: 'Create and modify files', risk: 'high' },
]

export function Example() {
  return <McpScopeInspector scopes={scopes} defaultExpanded />
}

Props

Prop	Type	Default	Description
`scopes *`	`ScopeDescriptor[]`	—	Array of scope descriptor objects to display
`defaultExpanded`	`boolean`	`false`	Whether all scope groups are expanded by default