SchemaValues

Show the arguments of a tool call the way its schema describes them, instead of a blob of JSON. Every field keeps its type, required badge and description; nested objects and array items become collapsible rows; optional fields that were not sent read Not set (hideMissing drops them); keys the schema does not mention are listed with an extra badge. Values of fields that read like credentials — token, password, apiKey — are masked behind a reveal button (maskSecrets, isSecret), and long values are truncated at maxValueLength with a "Show more" toggle. From 560px of width it is a table, narrower it becomes stacked rows. flattenSchemaValues returns the rows for custom renderers. For the arguments of a single call, use SchemaValues next to your tool card rather than inside an MCP settings screen, so it lands only in the bundle that needs it.

Getting Started
$pnpm add @sinups/ai-kit @mantine/core @mantine/hooks @tabler/icons-react
Examples
Wide
Narrow
API reference
Prop
Type
Required
schema
JsonSchema
Yes
JSON Schema that describes the values, for example a tool `inputSchema`
values
unknown
Yes
Values to render, usually the arguments of a tool call
defaultExpandedDepth
number
No
Nesting levels expanded initially, `2` by default
breakpoint
number
No
Component width in px from which values are shown as a table, `560` by default
maxValueLength
number
No
Characters after which a value is truncated behind a "Show more" button, `160` by default
maskSecrets
boolean
No
Masks values of fields that read like credentials behind a reveal button, `true` by default
isSecret
(name: string, path: string) => boolean
No
Decides which fields are masked, by default field names such as `token` or `password`
hideMissing
boolean
No
Hides rows of optional fields that are missing from `values`, `false` by default
labels
Partial<SchemaValuesLabels>
No
Overrides of the default English labels
className
string
No
Class name added to the root element
style
React.CSSProperties
No
Inline styles added to the root element