tandem-front-end
Version:
Visual editor for web components
68 lines • 2.85 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var tandem_common_1 = require("tandem-common");
var recompose_1 = require("recompose");
var actions_1 = require("../../../../../../../actions");
exports.DISPLAY_MENU_OPTIONS = [
"block",
"inline-block",
"flex",
"inline-flex",
"none",
"inline"
].map(function (value) { return ({ label: value, value: value }); });
exports.POSITION_MENU_OPTIONS = [
"static",
"relative",
"absolute",
"fixed"
].map(function (value) { return ({ label: value, value: value }); });
exports.default = recompose_1.compose(recompose_1.pure, recompose_1.withHandlers({
onClick: function () { return function () { }; },
onPropertyChange: function (_a) {
var dispatch = _a.dispatch;
return function (name, value) {
dispatch(actions_1.cssPropertyChanged(name, value));
};
},
onPropertyChangeComplete: function (_a) {
var dispatch = _a.dispatch;
return function (name, value) {
dispatch(actions_1.cssPropertyChangeCompleted(name, value));
};
}
}), function (Base) { return function (_a) {
var onPropertyChange = _a.onPropertyChange, onPropertyChangeComplete = _a.onPropertyChangeComplete, selectedNodes = _a.selectedNodes;
if (!selectedNodes) {
return null;
}
var node = selectedNodes[0];
return (React.createElement(Base, { displayInputProps: {
value: node.style.display,
options: exports.DISPLAY_MENU_OPTIONS,
onChangeComplete: propertyChangeCallback("display", onPropertyChangeComplete)
}, positionInputProps: {
value: node.style.position,
options: exports.POSITION_MENU_OPTIONS,
onChangeComplete: propertyChangeCallback("position", onPropertyChangeComplete)
}, leftInputProps: {
value: node.style.left,
onChangeComplete: propertyChangeCallback("left", onPropertyChangeComplete)
}, topInputProps: {
value: node.style.top,
onChangeComplete: propertyChangeCallback("top", onPropertyChangeComplete)
}, widthInputProps: {
value: node.style.width,
onChange: propertyChangeCallback("width", onPropertyChange),
onChangeComplete: propertyChangeCallback("width", onPropertyChangeComplete)
}, heightInputProps: {
value: node.style.height,
onChange: propertyChangeCallback("height", onPropertyChange),
onChangeComplete: propertyChangeCallback("height", onPropertyChangeComplete)
} }));
}; });
var propertyChangeCallback = tandem_common_1.memoize(function (name, listener) { return function (value) {
return listener(name, value);
}; });
//# sourceMappingURL=layout-controller.js.map