@formio/js 5.0.0-rc.27 → 5.0.0-rc.28

package/lib/mjs/components/tree/Node.js

@@ -1,179 +0,0 @@
-import _ from 'lodash';
-export default class Node {
-    constructor(parent, { data = {}, children = [], } = {}, { checkNode, createComponents, isNew = true, removeComponents, parentPath = '' } = {}) {
-        this.parent = parent;
-        this.previousData = {};
-        this.persistentData = _.cloneDeep(data);
-        this.new = isNew;
-        this.createComponents = createComponents;
-        this.checkNode = checkNode;
-        this.removeComponents = removeComponents;
-        this.revertAvailable = false;
-        this.editing = false;
-        this.collapsed = false;
-        this.components = [];
-        this.children = [];
-        this.parentPath = parentPath;
-        this.resetData();
-        this.children = children.map((child, index) => new Node(this, child, {
-            checkNode,
-            createComponents,
-            isNew: false,
-            removeComponents,
-            parentPath: this.getChildrenPath(index),
-        }));
-    }
-    get value() {
-        return this.new
-            ? null // Check the special case for empty root node.
-            : {
-                data: _.cloneDeep(this.persistentData),
-                children: this.children.filter((child) => !child.new).map((child) => child.value),
-            };
-    }
-    get isRoot() {
-        return this.parent === null;
-    }
-    get changing() {
-        return this.new || this.editing;
-    }
-    get hasChangingChildren() {
-        return this.changin || this.children.some((child) => child.hasChangingChildren);
-    }
-    get hasData() {
-        return !_.isEmpty(this.persistentData);
-    }
-    get hasChildren() {
-        return Array.isArray(this.children) && this.children.length > 0;
-    }
-    getChildrenPath(index) {
-        return this.parentPath ? `${this.parentPath}.children[${index}]` : '';
-    }
-    eachChild(iteratee) {
-        iteratee(this);
-        this.children.forEach((child) => child.eachChild(iteratee));
-        return this;
-    }
-    getComponents() {
-        return this.children.reduce((components, child) => components.concat(child.getComponents()), this.components);
-    }
-    validateNode() {
-        let valid = true;
-        this.getComponents().forEach(comp => {
-            comp.setPristine(false);
-            valid &= comp.checkValidity(null, false, this.persistentData);
-        });
-        return valid;
-    }
-    addChild() {
-        if (this.new) {
-            return null;
-        }
-        const child = new Node(this, {}, {
-            checkNode: this.checkNode,
-            createComponents: this.createComponents,
-            isNew: true,
-            removeComponents: this.removeComponents,
-            parentPath: this.getChildrenPath(this.children.length),
-        });
-        this.children = this.children.concat(child);
-        return child;
-    }
-    removeChild(childToRemove) {
-        if (!this.new) {
-            this.children = this.children.filter((child) => child !== childToRemove);
-        }
-        return this;
-    }
-    edit() {
-        if (this.new) {
-            return this;
-        }
-        this.editing = true;
-        return this.resetData();
-    }
-    save() {
-        const isValid = this.validateNode();
-        if (this.changing && isValid) {
-            if (this.new) {
-                this.new = false;
-            }
-            else {
-                this.editing = false;
-                this.revertAvailable = true;
-            }
-            this.commitData();
-        }
-        return isValid;
-    }
-    cancel() {
-        if (this.new) {
-            this.remove();
-        }
-        else if (this.editing) {
-            this.editing = false;
-            this.resetData();
-        }
-        return this;
-    }
-    remove() {
-        this.parent.removeChild(this);
-        this.parent = null;
-        this.clearComponents();
-        return this;
-    }
-    revert() {
-        if (!this.revertAvailable) {
-            return this;
-        }
-        this.data = this.previousData;
-        return this.commitData();
-    }
-    commitData() {
-        this.previousData = this.persistentData;
-        this.persistentData = _.cloneDeep(this.data);
-        this.clearComponents();
-        return this;
-    }
-    resetData() {
-        this.data = _.cloneDeep(this.persistentData);
-        this.updateComponentsContext();
-        return this;
-    }
-    updateComponentsContext() {
-        if (this.changing) {
-            this.instantiateComponents();
-        }
-        else {
-            this.clearComponents();
-        }
-        return this;
-    }
-    instantiateComponents() {
-        this.components = this.createComponents(this.data, this);
-        this.components.forEach((component) => {
-            if (this.parentPath) {
-                const path = this.calculateComponentPath(component);
-                component.path = path;
-            }
-        });
-        this.checkNode(this);
-    }
-    clearComponents() {
-        this.removeComponents(this.components);
-        this.components = [];
-    }
-    /**
-     * Return a path of component's value.
-     *
-     * @param {Object} component - The component instance.
-     * @return {string} - The component's value path.
-     */
-    calculateComponentPath(component) {
-        let path = '';
-        if (component.component.key) {
-            path = `${this.parentPath}.data.${component.component.key}`;
-        }
-        return path;
-    }
-}

package/lib/mjs/components/tree/Tree.d.ts

@@ -1,48 +0,0 @@
-export default class TreeComponent extends NestedDataComponent {
-    static get builderInfo(): {
-        title: string;
-        icon: string;
-        weight: number;
-        documentation: string;
-        showPreview: boolean;
-        schema: any;
-    };
-    constructor(...args: any[]);
-    get viewComponents(): any;
-    viewComponentsInstantiated: boolean | undefined;
-    _viewComponents: any;
-    componentOptions: {
-        parent: TreeComponent;
-        root: Component;
-    } | undefined;
-    get isDefaultValueComponent(): boolean;
-    createComponents(data: any, node: any): any;
-    removeComponents(components: any, all?: boolean): any;
-    render(): any;
-    renderTree(node?: {}, odd?: boolean): any;
-    renderChildNodes(nodes: any[] | undefined, odd: any): any;
-    renderEdit(node?: {}): any;
-    renderView(node?: {}): any;
-    attach(element: any): Promise<[void, void]> | Promise<[[void, void], void | [void, void]]>;
-    attachNode(element: any, node: any): Promise<void> | Promise<[void, void]>;
-    attachActions(node: any): void;
-    attachComponents(node: any, ...args: any[]): Promise<any>;
-    attachChildren(node: any): Promise<any>;
-    addChild(parent: any): void;
-    cancelNode(node: any): void;
-    editNode(node: any): void;
-    removeNode(node: any): void;
-    revertNode(node: any): void;
-    saveNode(node: any): void;
-    toggleNode(node: any): void;
-    removeRoot(): void;
-    setRoot(): void;
-    treeRoot: Node | undefined;
-    updateTree(): void;
-    checkData(data: any, flags: any, row: any): any;
-    checkNode(data: any, node: any, flags: any, row: any): any;
-    hasChanged: (newValue: any, oldValue: any) => boolean;
-}
-import NestedDataComponent from '../_classes/nesteddata/NestedDataComponent';
-import Component from '../_classes/component/Component';
-import Node from './Node';

package/lib/mjs/components/tree/Tree.form.d.ts

@@ -1,3 +0,0 @@
-export default function _default(...extend: any[]): {
-    components: any;
-};

package/lib/mjs/components/tree/Tree.form.js

@@ -1,15 +0,0 @@
-import componentEditForm from '../_classes/component/Component.form';
-import TreeEditData from './editForm/Tree.edit.data';
-import TreeDisplayData from './editForm/Tree.edit.display';
-export default function (...extend) {
-    return componentEditForm([
-        {
-            key: 'display',
-            components: TreeDisplayData,
-        },
-        {
-            key: 'data',
-            components: TreeEditData,
-        },
-    ], ...extend);
-}

package/lib/mjs/components/tree/Tree.js

@@ -1,384 +0,0 @@
-import _ from 'lodash';
-import Component from '../_classes/component/Component';
-import Components from '../Components';
-import NestedDataComponent from '../_classes/nesteddata/NestedDataComponent';
-import Node from './Node';
-export default class TreeComponent extends NestedDataComponent {
-    static schema(...extend) {
-        return NestedDataComponent.schema({
-            label: 'Tree',
-            key: 'tree',
-            type: 'tree',
-            clearOnHide: true,
-            input: true,
-            tree: true,
-            components: [],
-            multiple: false,
-        }, ...extend);
-    }
-    static get builderInfo() {
-        return {
-            title: 'Tree',
-            icon: 'indent',
-            weight: 40,
-            documentation: '/userguide/form-building/data-components#tree',
-            showPreview: false,
-            schema: TreeComponent.schema(),
-        };
-    }
-    constructor(...args) {
-        super(...args);
-        this.type = 'tree';
-    }
-    get emptyValue() {
-        return {};
-    }
-    get viewComponents() {
-        if (!this.viewComponentsInstantiated) {
-            this.viewComponentsInstantiated = true;
-            this._viewComponents = this.createComponents({});
-        }
-        return this._viewComponents;
-    }
-    init() {
-        if (this.builderMode) {
-            return super.init();
-        }
-        this.components = [];
-        this.componentOptions = {
-            ...this.options,
-            parent: this,
-            root: this.root || this,
-        };
-        this.disabled = this.shouldDisabled;
-        this.setRoot();
-        this.viewComponentsInstantiated = false;
-        this._viewComponents = [];
-    }
-    get disabled() {
-        return super.disabled;
-    }
-    set disabled(disabled) {
-        super.disabled = disabled;
-        this.viewComponents.forEach((component) => component.parentDisabled = disabled);
-    }
-    get isDefaultValueComponent() {
-        return !!this.options.editComponent && !!this.options.editForm && this.component.key === 'defaultValue';
-    }
-    destroy(all = false) {
-        if (!this.builderMode) {
-            this.removeComponents(this._viewComponents, all);
-        }
-        super.destroy(all);
-    }
-    createComponents(data, node) {
-        const components = this.componentComponents.map((component) => {
-            const componentInstance = Components.create(component, this.componentOptions, data);
-            componentInstance.init();
-            componentInstance.parentDisabled = this.disabled;
-            return componentInstance;
-        });
-        if (node) {
-            this.checkNode(this.data, node);
-        }
-        return components;
-    }
-    removeComponents(components, all = false) {
-        return components.map((component) => component.destroy(all));
-    }
-    render() {
-        if (this.builderMode) {
-            return super.render();
-        }
-        return super.render(this.renderTree(this.treeRoot));
-    }
-    renderTree(node = {}, odd = true) {
-        const childNodes = (node.hasChildren && !node.collapsed)
-            ? this.renderChildNodes(node.children, !odd)
-            : [];
-        const content = node.changing
-            ? this.renderEdit(node)
-            : this.renderView(node);
-        return this.renderTemplate('tree', {
-            odd,
-            childNodes,
-            content,
-            node,
-        });
-    }
-    renderChildNodes(nodes = [], odd) {
-        return nodes.map((node) => this.renderTree(node, odd));
-    }
-    renderEdit(node = {}) {
-        return this.renderTemplate('treeEdit', {
-            children: this.renderComponents(node.components),
-            node,
-        });
-    }
-    renderView(node = {}) {
-        return this.renderTemplate('treeView', {
-            values: this.viewComponents.map((component) => {
-                component.data = node.data;
-                component.checkComponentConditions(node.data);
-                return component.getView(component.dataValue);
-            }),
-            nodeData: node.data,
-            node,
-        });
-    }
-    attach(element) {
-        if (this.builderMode) {
-            return super.attach(element);
-        }
-        this.loadRefs(element, {
-            root: 'single',
-        });
-        return Promise.all([
-            super.attach(element),
-            this.attachNode(this.refs.root, this.treeRoot),
-        ]);
-    }
-    attachNode(element, node) {
-        if (!element) {
-            return Promise.resolve();
-        }
-        let componentsPromise = Promise.resolve();
-        let childrenPromise = Promise.resolve();
-        node.refs = _.reduce(element.children, (refs, child) => (child.hasAttribute('ref')
-            ? {
-                ...refs,
-                [child.getAttribute('ref')]: child,
-            }
-            : refs), {});
-        if (node.refs.content) {
-            this.attachActions(node);
-            componentsPromise = this.attachComponents(node);
-        }
-        if (node.refs.childNodes) {
-            childrenPromise = this.attachChildren(node);
-        }
-        return Promise.all([
-            componentsPromise,
-            childrenPromise,
-        ]);
-    }
-    attachActions(node) {
-        if (!node.editing) {
-            this.loadRefs.call(node, node.refs.content, {
-                addChild: 'single',
-                editNode: 'single',
-                removeNode: 'single',
-                revertNode: 'single',
-                toggleNode: 'single',
-            });
-        }
-        //load refs correctly (if there is nested tree)
-        this.loadRefs.call(node, node.refs.content.children[0]?.children[1] || node.refs.content, {
-            cancelNode: 'single',
-            saveNode: 'single',
-        });
-        if (node.refs.addChild) {
-            this.addEventListener(node.refs.addChild, 'click', () => {
-                this.addChild(node);
-            });
-        }
-        if (node.refs.cancelNode) {
-            this.addEventListener(node.refs.cancelNode, 'click', () => {
-                this.cancelNode(node);
-            });
-        }
-        if (node.refs.editNode) {
-            this.addEventListener(node.refs.editNode, 'click', () => {
-                this.editNode(node);
-            });
-        }
-        if (node.refs.removeNode) {
-            this.addEventListener(node.refs.removeNode, 'click', () => {
-                this.removeNode(node);
-            });
-        }
-        if (node.refs.revertNode) {
-            this.addEventListener(node.refs.revertNode, 'click', () => {
-                this.revertNode(node);
-            });
-        }
-        if (node.refs.saveNode) {
-            this.addEventListener(node.refs.saveNode, 'click', () => {
-                this.saveNode(node);
-            });
-        }
-        if (node.refs.toggleNode) {
-            this.addEventListener(node.refs.toggleNode, 'click', () => {
-                this.toggleNode(node);
-            });
-        }
-    }
-    attachComponents(node, ...args) {
-        if (this.builderMode) {
-            return super.attachComponents.call(this, node, ...args);
-        }
-        this.loadRefs.call(node, node.refs.content, {
-            nodeEdit: 'single',
-        });
-        return node.refs.nodeEdit
-            ? super.attachComponents(node.refs.nodeEdit, node.components)
-            : Promise.resolve();
-    }
-    attachChildren(node) {
-        const childElements = node.refs.childNodes.children;
-        return Promise.all(_.map(childElements, (childElement, index) => this.attachNode(childElement, node.children[index])));
-    }
-    setValue(value, flags = {}) {
-        const changed = this.updateValue(value, flags);
-        this.setRoot();
-        return changed;
-    }
-    addChild(parent) {
-        if (this.options.readOnly || parent.new) {
-            return;
-        }
-        this.hook('tree.addChild', {
-            parent,
-            component: this,
-        }, () => {
-            const child = parent.addChild();
-            this.redraw();
-            return child;
-        });
-    }
-    cancelNode(node) {
-        if (this.options.readOnly) {
-            return;
-        }
-        this.hook('tree.cancelNode', {
-            node,
-            component: this,
-        }, () => {
-            if (node.isRoot) {
-                if (node.persistentData && !_.isEmpty(node.persistentData)) {
-                    node.cancel();
-                    this.redraw();
-                }
-                else {
-                    this.removeRoot();
-                }
-            }
-            else {
-                node.cancel();
-                this.redraw();
-            }
-            return node;
-        });
-    }
-    editNode(node) {
-        if (this.options.readOnly || node.new) {
-            return;
-        }
-        this.hook('tree.editNode', {
-            node,
-            component: this,
-        }, () => {
-            node.edit();
-            this.redraw();
-            return node;
-        });
-    }
-    removeNode(node) {
-        if (this.options.readOnly || node.new) {
-            return;
-        }
-        this.hook('tree.removeNode', {
-            node,
-            component: this,
-        }, () => {
-            if (node.isRoot) {
-                this.removeRoot();
-            }
-            else {
-                node.remove();
-                this.updateTree();
-            }
-            return node;
-        });
-    }
-    revertNode(node) {
-        if (this.options.readOnly || !node.revertAvailable) {
-            return;
-        }
-        this.hook('tree.revertNode', {
-            node,
-            component: this,
-        }, () => {
-            node.revert();
-            this.updateTree();
-            return node;
-        });
-    }
-    saveNode(node) {
-        if (this.options.readOnly) {
-            return;
-        }
-        this.hook('tree.saveNode', {
-            node,
-            component: this,
-        }, () => {
-            const isSaved = node.save();
-            if (isSaved) {
-                this.updateTree();
-            }
-            return node;
-        });
-    }
-    toggleNode(node) {
-        this.hook('tree.toggleNode', {
-            node,
-            component: this,
-        }, () => {
-            node.collapsed = !node.collapsed;
-            this.redraw();
-            return node;
-        });
-    }
-    removeRoot() {
-        if (this.options.readOnly) {
-            return;
-        }
-        this.dataValue = this.defaultValue;
-        this.setRoot();
-        this.redraw();
-    }
-    setRoot() {
-        const value = this.getValue();
-        this.treeRoot = new Node(null, value, {
-            isNew: this.builderMode ? true : !value.data,
-            createComponents: this.createComponents.bind(this),
-            checkNode: this.checkNode.bind(this, this.data),
-            removeComponents: this.removeComponents,
-            parentPath: this.isDefaultValueComponent ? (this.path || this.component.key) : null,
-        });
-        this.hook('tree.setRoot', {
-            root: this.treeRoot,
-            component: this,
-        });
-        this.redraw();
-    }
-    getValue() {
-        return this.dataValue || {};
-    }
-    updateTree() {
-        this.updateValue(this.treeRoot.value);
-        this.redraw();
-    }
-    checkData(data, flags, row) {
-        return this.checkNode(data, this.treeRoot, flags, row);
-    }
-    checkNode(data, node, flags, row) {
-        return node.children.reduce((result, child) => this.checkNode(data, child, flags, row) && result, super.checkData(data, flags, node.data, node.components) && !node.editing && !node.new);
-    }
-    getComponents() {
-        return this.treeRoot && (this.isDefaultValueComponent || (!this.isDefaultValueComponent && !this.builderMode))
-            ? this.treeRoot.getComponents()
-            : super.getComponents();
-    }
-}
-TreeComponent.prototype.hasChanged = Component.prototype.hasChanged;

package/lib/mjs/components/tree/editForm/Tree.edit.data.d.ts

@@ -1,5 +0,0 @@
-declare const _default: {
-    key: string;
-    ignore: boolean;
-}[];
-export default _default;

package/lib/mjs/components/tree/editForm/Tree.edit.data.js

@@ -1,7 +0,0 @@
-export default [
-    {
-        key: 'multiple',
-        ignore: true
-    },
-];
-/* eslint-enable max-len */

package/lib/mjs/components/tree/editForm/Tree.edit.display.d.ts

@@ -1,9 +0,0 @@
-declare const _default: {
-    key: string;
-    weight: number;
-    type: string;
-    tag: string;
-    className: string;
-    content: string;
-}[];
-export default _default;

package/lib/mjs/components/tree/editForm/Tree.edit.display.js

@@ -1,10 +0,0 @@
-export default [
-    {
-        key: 'treeInfo',
-        weight: -10,
-        type: 'htmlelement',
-        tag: 'div',
-        className: 'alert alert-danger',
-        content: 'This component has been deprecated and will be removed in a future version of Formio.js.',
-    }
-];

package/lib/mjs/components/tree/fixtures/comp1.d.ts

@@ -1,23 +0,0 @@
-declare namespace _default {
-    const label: string;
-    const tableView: boolean;
-    const calculateServer: boolean;
-    const key: string;
-    const type: string;
-    const input: boolean;
-    const tree: boolean;
-    const components: {
-        label: string;
-        mask: boolean;
-        spellcheck: boolean;
-        tableView: boolean;
-        delimiter: boolean;
-        requireDecimal: boolean;
-        inputFormat: string;
-        calculateServer: boolean;
-        key: string;
-        type: string;
-        input: boolean;
-    }[];
-}
-export default _default;