@tomino/dynamic-form-semantic-ui/dist/cjs/editor/dataset/dataset_folder.js

Semantic UI form renderer based on dynamic form generation

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const semantic_ui_react_1 = require("semantic-ui-react");
const mobx_react_1 = require("mobx-react");
const common_1 = require("../../common");
const dataset_value_1 = require("./dataset_value");
const editor_context_1 = require("../editor_context");
const dataset_drag_1 = require("./dataset_drag");
exports.BuildLayerFolder = mobx_react_1.observer(({ schema, name, sourcePath, BuildLayer, expanded, isOver, owner, index }) => {
    let [opened, toggleOpen] = React.useState(!!expanded);
    const context = React.useContext(editor_context_1.EditorContext);
    let item = schema.reference
        ? schema.reference
        : schema.items && schema.items.reference
            ? schema.items.reference
            : schema.items
                ? schema.items
                : schema;
    let properties = item.properties;
    let icon = 'folder';
    let canOpen = item.type === 'object';
    const editorState = React.useContext(editor_context_1.EditorContext);
    const state = editorState.project.state;
    const value = owner && owner.getValue && common_1.toJS(owner.getValue(sourcePath));
    const render = (React.createElement("div", { "data-index": index },
        React.createElement("div", Object.assign({ className: "item" }, dataset_drag_1.initDrag(context, schema)),
            React.createElement(semantic_ui_react_1.Icon, { name: "caret right", className: "treeCaret", onClick: () => canOpen && toggleOpen(!opened) }),
            React.createElement(semantic_ui_react_1.Icon, { className: common_1.pointer +
                    ' ' +
                    (schema.type === 'array'
                        ? 'array'
                        : schema.$ref
                            ? 'reference'
                            : schema.$import
                                ? 'import'
                                : ''), title: schema.items
                    ? 'Array'
                    : schema.$ref
                        ? 'Local Type'
                        : schema.$import
                            ? 'Imported, shared type'
                            : undefined, name: opened ? `${icon} open` : icon, onClick: () => canOpen && toggleOpen(!opened), color: 'yellow' }),
            React.createElement("div", { className: "content" },
                React.createElement("a", { className: `folder  ${schema === state.selectedSchema ? 'selected' : ''} ${isOver ? 'over' : ''}`, onClick: () => {
                        state.setSchema(schema, name);
                        editorState.selectedSourcePath = sourcePath;
                    } },
                    schema.title || name,
                    React.createElement(dataset_value_1.DatasetValue, { value: value })))),
        properties && opened && (React.createElement("div", { className: "itemContent" },
            React.createElement(BuildLayer, { schema: schema, items: properties, sourcePath: sourcePath ? sourcePath + '.' : '', BuildLayerFolder: exports.BuildLayerFolder, owner: owner })))));
    return render;
});
exports.BuildLayerFolder.displayName = 'DatasetFolder';
//# sourceMappingURL=dataset_folder.js.map