clickable-json
Version:
Interactive JSON and JSON CRDT viewer and editor
39 lines • 2 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.JsonCrdtArrNode = void 0;
const React = require("react");
const css = require("../../../css");
const context_1 = require("../../context");
const NodeRef_1 = require("../../NodeRef");
const JsonCrdtRegion_1 = require("../../JsonCrdtRegion");
const JsonCrdtProperty_1 = require("../../JsonCrdtProperty");
const JsonCrdtObjectLayout_1 = require("../../JsonCrdtObjectLayout");
const hooks_1 = require("../../hooks");
const InsertElement_1 = require("./InsertElement");
const style_1 = require("../../../context/style");
const JsonCrdtArrNode = ({ node }) => {
const { readonly } = (0, style_1.useStyles)();
const { render } = (0, context_1.useJsonCrdt)();
(0, hooks_1.useRerender)(node);
const entries = [];
let i = 0;
node.node.children((child) => {
if (!child)
return;
const childNodeRef = (0, NodeRef_1.nodeRef)(child, node, String(i));
if (!childNodeRef)
return;
childNodeRef.step = String(i);
const key = child.id.sid + '.' + child.id.time + '.' + i;
entries.push(React.createElement(React.Fragment, { key: key },
!readonly && React.createElement(InsertElement_1.InsertElement, { key: key, node: node, index: i }),
React.createElement("span", { className: css.line }, render(childNodeRef))));
i++;
});
return (React.createElement(JsonCrdtRegion_1.JsonCrdtRegion, { node: node },
React.createElement(JsonCrdtObjectLayout_1.JsonCrdtObjectLayout, { node: node, property: React.createElement(JsonCrdtProperty_1.JsonCrdtProperty, { node: node }), collapsedView: !!entries.length && entries.length, brackets: ['[', ']'] },
entries,
!readonly && React.createElement(InsertElement_1.InsertElement, { key: node.node.length(), node: node, index: node.node.length() }))));
};
exports.JsonCrdtArrNode = JsonCrdtArrNode;
//# sourceMappingURL=index.js.map