@tomino/dynamic-form-semantic-ui/dist/cjs/react-router/react_router_view.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 react_router_dom_1 = require("react-router-dom");
const common_1 = require("../common");
const form_view_1 = require("../form_view");
const mobx_react_1 = require("mobx-react");
const wrapper_1 = require("../wrapper");
exports.ReactRouterProvider = props => {
    return React.createElement(react_router_dom_1.BrowserRouter, null, common_1.createComponents(props));
};
class PageView extends React.PureComponent {
    assignParams() {
        if (this.props.match.params) {
            for (let key of Object.keys(this.props.match.params)) {
                try {
                    if (this.props.owner.getValue(key) != this.props.match.params[key]) {
                        this.props.owner.setValue(key, this.props.match.params[key]);
                    }
                }
                catch (ex) {
                    console.warn(ex);
                }
            }
        }
    }
    componentWillMount() {
        this.assignParams();
    }
    componentWillUpdate() {
        this.assignParams();
    }
    render() {
        return React.createElement(form_view_1.FormView, Object.assign({}, this.props));
    }
}
exports.PageView = PageView;
const EmptyPage = props => (React.createElement(wrapper_1.DynamicComponent, Object.assign({}, props), "Please select a page ..."));
exports.ReactRouterRoute = props => {
    const Component = React.useMemo(() => {
        const page = common_1.root(props.formElement).pages.find(p => p.uid === props.formElement.props.page);
        if (!page) {
            return EmptyPage;
        }
        const RouteView = (routerProps) => (React.createElement(PageView, Object.assign({}, routerProps, props, { formElement: page })));
        return RouteView;
    }, [props]);
    Component.displayName = 'MemoRoute';
    return (React.createElement(react_router_dom_1.Route, { exact: !!props.formElement.props.exact, path: props.formElement.props.path, component: Component }));
};
exports.ReactRouterRoute.displayName = 'ReactRouterRoute';
exports.ReactRouterSwitch = props => {
    const { formElement, ...rest } = props;
    if (!props.formElement.props.config) {
        return null;
    }
    return (React.createElement(react_router_dom_1.Switch, null, props.formElement.props.config.map((c, i) => {
        return (React.createElement(exports.ReactRouterRoute, Object.assign({ key: i }, rest, { formElement: { ...formElement, parent: formElement.parent, props: c } })));
    })));
};
exports.ReactRouterSwitch.displayName = 'ReactRouterSwitch';
const ReactRouterLink = props => {
    const { owner, formElement, formElement: { props: { text, url } } } = props;
    return (React.createElement(wrapper_1.DynamicComponent, Object.assign({}, props, { control: react_router_dom_1.Link, to: common_1.tryInterpolate(url, owner) }), common_1.tryInterpolate(text, owner) ||
        (formElement.elements && formElement.elements.length && common_1.createComponents(props)) ||
        '[⚓︎ Link]'));
};
exports.ReactRouterLinkView = {
    Component: mobx_react_1.observer(ReactRouterLink),
    toString: (owner, props) => {
        return `[${props.formElement.props.url}] ${common_1.tryInterpolate(props.formElement.props.url, owner)}`;
    }
};
exports.ReactRouterRedirect = ({ owner, formElement: { props: { url } } }) => React.createElement(react_router_dom_1.Redirect, { to: common_1.tryInterpolate(url, owner) });
//# sourceMappingURL=react_router_view.js.map