ObjectGraph

API reference and demos for ObjectGraph.

Source

Import

import { ObjectGraph } from "@flanksource/clicky-ui/data";

Demos

No dedicated Storybook demo is available for this component yet.

The props table documents the component-specific surface. Standard DOM attributes inherited from React, such as className, event handlers, and accessibility attributes, may also be accepted when the component’s prop type extends a native element.

Props

Prop	Type	Default	Description
className	string	—	—
defaultHideNulls	boolean	false	Initial state of the options menu's "Hide null values" toggle. Off by default so existing consumers keep seeing every node.
defaultOpenDepth	number	2	Open nodes shallower than this depth on first render (default 2).
empty	ReactNode	—	—
fullscreenButtonLabel	string	Open object browser full screen	Accessible name of the fullscreen button.
fullscreenTitle	ReactNode	Object	Title of the fullscreen modal.
loadChildren	(…) => Promise<T[]>	—	Lazily fetch a node's children the first time an `expandable` node opens. When omitted, only inline `children` are shown.
menuActions	DropdownMenuItem[]	—	Extra entries appended to the options menu.
onNodeSelect	(…) => void	—	Called when a node's label is clicked. This makes the label an actionable target (e.g. copy/drill its `path`) **without toggling expansion** — the chevron stays the only expand/collapse control. Omit for a static tree.
renderLabel	(…) => ReactNode	—	Override the row label rendering.
renderType	(…) => ReactNode	—	Override how a node's `@type` annotation is rendered (e.g. as a link into a class browser). Called only when `node.type` is set; the caller owns the whole type rendering, including the leading `@`. Ignored when `renderLabel` replaces the whole label — `renderType` only applies to the default label.
renderValue	(…) => ReactNode	—	Override how a node's value is rendered. Return `null`/`undefined` to fall back to the default scalar/raw span, so a caller only has to handle the nodes it recognises (e.g. a Java exception leaf).
roots*	T[]	—	—
selectedId	string	—	`id` of the currently-selected node; its label is highlighted.
showControls	boolean	—	—
showFullscreenControl	boolean	false	Render a fullscreen toggle in the toolbar. When clicked, the graph re-renders inside a full-viewport Modal. Defaults to `false`.
showOptionsMenu	boolean	false	Render a ⋮ display-options menu in the toolbar. Defaults to `false`.