@0xsequence/connect
Version:
Connect package for Sequence Web SDK
17 lines • 1.91 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.JsonTreeViewer = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const TreeNode = ({ data, keyName, depth = 0 }) => {
const [isExpanded, setIsExpanded] = (0, react_1.useState)(true);
const isObject = typeof data === 'object' && data !== null;
const isArray = Array.isArray(data);
const toggle = () => setIsExpanded(!isExpanded);
return ((0, jsx_runtime_1.jsxs)("div", { className: "select-none", style: { marginLeft: depth > 0 ? `${depth * 1}rem` : '0' }, children: [(0, jsx_runtime_1.jsxs)("div", { onClick: isObject ? toggle : undefined, className: `flex items-center gap-1 px-1 py-1 ${isObject ? 'cursor-pointer' : ''}`, children: [isObject && (0, jsx_runtime_1.jsx)("span", { className: "w-4 h-4 flex items-center justify-center", children: isExpanded ? '▼' : '▶' }), keyName && (0, jsx_runtime_1.jsxs)("span", { className: "font-medium", children: [keyName, ":"] }), isArray && (0, jsx_runtime_1.jsxs)("span", { children: ["[", !isExpanded && '...', "]"] }), !isObject && (0, jsx_runtime_1.jsx)("span", { children: typeof data === 'string' ? `"${data}"` : data === null ? 'null' : data.toString() }), isObject && !isArray && ((0, jsx_runtime_1.jsxs)("span", { children: ['{', !isExpanded && '...', '}'] }))] }), isExpanded && isObject && ((0, jsx_runtime_1.jsx)("div", { className: "ml-2", children: Object.entries(data).map(([key, value]) => ((0, jsx_runtime_1.jsx)(TreeNode, { keyName: isArray ? undefined : key, data: value, depth: depth + 1 }, key))) }))] }));
};
const JsonTreeViewer = ({ data }) => {
return ((0, jsx_runtime_1.jsx)("div", { className: 'font-mono text-sm overflow-x-auto', children: (0, jsx_runtime_1.jsx)(TreeNode, { data: data }) }));
};
exports.JsonTreeViewer = JsonTreeViewer;
//# sourceMappingURL=JsonTreeViewer.js.map