"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var csstips = require("csstips/lib");
var React = require("react");
var react_redux_1 = require("react-redux");
var lib_1 = require("typestyle/lib");
var canvas_1 = require("../redux/canvas");
var palette_1 = require("../redux/palette");
var CanvasView_1 = require("./CanvasView");
var LayerView_1 = require("./LayerView");
var MenuBar_1 = require("./MenuBar");
var PaletteView_1 = require("./PaletteView");
var root = lib_1.style({
    height: '100%'
});
var container = lib_1.style(csstips.flex, csstips.horizontal, {
    height: "calc(100% - " + MenuBar_1.menuBarHeight + "px)",
    backgroundColor: 'lightgrey'
});
function Root(props) {
    var dispatch = react_redux_1.useDispatch();
    React.useEffect(function () {
        if (props.map) {
            dispatch(canvas_1.actions.initMap(props.map));
        }
        dispatch(palette_1.actions.loadPages.started({}));
    }, []);
    return (React.createElement("div", { className: root },
        React.createElement("div", { className: container },
            React.createElement(LayerView_1.LayerView, null),
            React.createElement(CanvasView_1.CanvasView, null),
            React.createElement(PaletteView_1.PaletteView, null)),
        React.createElement(MenuBar_1.MenuBar, null)));
}
exports.Root = Root;
//# sourceMappingURL=Root.js.map