collaborative-ui/lib/JsonCrdtExplorer/index.js

React component library for building real-time collaborative editing applications.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.JsonCrdtExplorer = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const JsonCrdtExplorerState_1 = require("./JsonCrdtExplorerState");
const ExplorerSidenav_1 = require("./ExplorerSidenav");
const context_1 = require("./context");
const TwoColumnLayout_1 = tslib_1.__importDefault(require("nice-ui/lib/6-page/TwoColumnLayout"));
const Preview_1 = require("./Preview");
const useBehaviorSubject_1 = require("nice-ui/lib/hooks/useBehaviorSubject");
const constants_1 = require("nice-ui/lib/constants");
const JsonCrdtExplorer = ({ state: _state }) => {
    const state = React.useMemo(() => _state || new JsonCrdtExplorerState_1.JsonCrdtExplorerState(), [_state]);
    const files = (0, useBehaviorSubject_1.useBehaviorSubject)(state.files$);
    const content = !files.length ? (React.createElement("div", { style: { display: 'flex', justifyContent: 'space-around' } },
        React.createElement(ExplorerSidenav_1.ExplorerSidenav, null))) : (React.createElement(TwoColumnLayout_1.default, { left: React.createElement(ExplorerSidenav_1.ExplorerSidenav, null), right: React.createElement(Preview_1.Preview, null), top: constants_1.NiceUiSizes.TopNavHeight + constants_1.NiceUiSizes.TopNavHeight + 24 }));
    return React.createElement(context_1.context.Provider, { value: state }, content);
};
exports.JsonCrdtExplorer = JsonCrdtExplorer;