Render Nested JSON in a Code-Style Viewer

Implement a React viewer that displays a supplied JSON object in a code-editor-like format. Show nested structure clearly without making the content executable. ### Constraints & Assumptions The source specifies a JSON object displayed in a style similar to a code editor, but no exact screenshot or editing behavior. For this practice version, support valid acyclic JSON values, indentation, type coloring, and expandable/collapsible arrays and objects. Editing, search, and line numbers are outside the stated replacement contract. ### Clarifying Questions Is the viewer read-only? How large or deeply nested can the input be? Must collapsed nodes preserve state across updates? Is exact source formatting available, or only a parsed value? ### What a Strong Answer Covers Recursive rendering, primitive and empty-container cases, safe text handling, stable tree identity, and clear disclosure of display versus source-code editing. ### Follow-up Questions How would you add line numbers or virtualize a large document? Why should object values not be inserted with raw HTML? What changes if the input includes non-JSON values or cycles?