UNPKG

schyma

Version:

JSON Schemas Visualizer React component

40 lines 2.38 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = require("tslib"); const react_1 = tslib_1.__importStar(require("react")); const Tables_1 = tslib_1.__importDefault(require("./Tables")); const Code_1 = tslib_1.__importDefault(require("./Code")); function Panel({ node, nodes, title, description }) { var _a; const [view, setView] = (0, react_1.useState)(); const [children, setChildren] = (0, react_1.useState)([]); const [activeNode, setActiveNode] = (0, react_1.useState)(node); const data = node === null || node === void 0 ? void 0 : node.data; (0, react_1.useEffect)(() => { if (node) { setView(true); if (data.children.length > 0) { setChildren(data.children); setActiveNode(node); } else { setActiveNode(nodes[data.parent]); setChildren(nodes[data.parent].data.children); } } }, [node]); if (view) { return (react_1.default.createElement("div", { className: 'panel' }, react_1.default.createElement("h1", null, (activeNode === null || activeNode === void 0 ? void 0 : activeNode.data.title) || (activeNode === null || activeNode === void 0 ? void 0 : activeNode.data.label)), react_1.default.createElement("p", null, activeNode === null || activeNode === void 0 ? void 0 : activeNode.data.description), children.length > 0 && react_1.default.createElement(Tables_1.default, { nodes: children, active: node }), ((_a = activeNode === null || activeNode === void 0 ? void 0 : activeNode.data) === null || _a === void 0 ? void 0 : _a.examples) && (react_1.default.createElement("div", { className: 'examples-wrapper' }, react_1.default.createElement("h1", { className: 'font-bold' }, "Examples"), activeNode === null || activeNode === void 0 ? void 0 : activeNode.data.examples.map((example) => (react_1.default.createElement(Code_1.default, { key: example.title }, JSON.stringify(example, null, 2)))))))); } return (react_1.default.createElement("div", { className: 'panel' }, react_1.default.createElement("h1", null, title), react_1.default.createElement("p", null, description))); } exports.default = Panel; //# sourceMappingURL=Panel.js.map