@prisma-cms/front-editor
Version:
170 lines • 5.81 kB
JavaScript
;
var __rest = (this && this.__rest) || function (s, e) {
var t = {};
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
t[p] = s[p];
if (s != null && typeof Object.getOwnPropertySymbols === "function")
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
t[p[i]] = s[p[i]];
}
return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const EditorComponent_1 = __importDefault(require("../../EditorComponent"));
const GridOn_1 = __importDefault(require("material-ui-icons/GridOn"));
const Button_1 = __importDefault(require("material-ui/Button"));
const Grid_1 = __importDefault(require("../../common/Grid"));
// import { EditorContextValue } from '../context';
class Grid extends EditorComponent_1.default {
constructor() {
// static propTypes = {
// ...EditorComponent.propTypes,
// }
super(...arguments);
this.onBeforeDrop = () => {
return;
};
this.updateType = (event) => {
const name = event.currentTarget.name;
this.updateComponentProperty(name === 'container' ? 'item' : 'container', true);
};
}
/**
* Если это контейнер, то дочерним может быть только другой грид.
* Иначе все остальное.
*/
canBeChild(child) {
let can = false;
if (super.canBeChild(child)) {
const { container } = this.getComponentProps(this);
if (!container || child instanceof Grid) {
can = true;
}
}
return can;
}
getEditorField(props) {
const { key, name } = props;
switch (name) {
case 'container':
case 'item':
return (react_1.default.createElement(Button_1.default, { key: key, size: "small", variant: "raised", name: name, onClick: this.updateType }, name));
}
return super.getEditorField(props);
}
updateComponentProperty(name, value) {
switch (name) {
case 'xs':
case 'sm':
case 'md':
case 'lg':
case 'xl':
if (value === 0) {
value = true;
}
else if (!value ||
typeof value !== 'number' ||
value < 0 ||
value > 12) {
return false;
}
break;
}
return super.updateComponentProperty(name, value);
}
updateComponentProps(data) {
if (data.container) {
Object.assign(data, {
item: undefined,
xs: undefined,
sm: undefined,
md: undefined,
lg: undefined,
xl: undefined,
// alignItems: "flex-end",
spacing: 0,
});
}
else if (data.item) {
Object.assign(data, Object.assign({ container: undefined, alignItems: undefined, spacing: undefined }, this.getItemDefaultProps()));
}
return super.updateComponentProps(data);
}
removeProps(name) {
switch (name) {
case 'container':
case 'item':
return false;
}
return super.removeProps(name);
}
renderPanelView(content) {
return super.renderPanelView(content || (react_1.default.createElement("div", { className: "editor-component--panel-icon" },
react_1.default.createElement(GridOn_1.default, null),
" Grid")));
}
prepareNewItem(item) {
var _a;
const newItem = super.prepareNewItem(item);
if (!newItem) {
return;
}
const container = (_a = this.props.props) === null || _a === void 0 ? void 0 : _a.container;
const { name } = item, props = __rest(item.props, []);
switch (name) {
case 'Grid':
if (container) {
delete props.container;
Object.assign(props, Object.assign(Object.assign({}, this.getItemDefaultProps()), { item: true }));
}
else {
Object.assign(props, {
container: true,
// alignItems: "flex-end",
spacing: 0,
});
}
break;
}
Object.assign(newItem, {
props,
});
return newItem;
}
getItemDefaultProps() {
return {
xs: 12,
sm: 6,
md: 4,
lg: 3,
xl: 2,
};
}
prepareDragItemProps() {
const props = super.prepareDragItemProps();
Object.assign(props, {
container: true,
spacing: 0,
});
return props;
}
getRootElement() {
return Grid_1.default;
}
prepareRootElementProps(props) {
const newProps = super.prepareRootElementProps(props);
if (newProps.spacing && !newProps.container) {
delete newProps.spacing;
}
return newProps;
}
}
Grid.defaultProps = Object.assign(Object.assign({}, EditorComponent_1.default.defaultProps), { alignItems: undefined });
Grid.Name = 'Grid';
exports.default = Grid;
//# sourceMappingURL=index.js.map