@gravity-ui/graph
Version:
Modern graph editor component
52 lines (51 loc) • 1.78 kB
JavaScript
import { Component } from "../../../lib/Component";
import { Block } from "./Block";
export class Blocks extends Component {
constructor(props, context) {
super(props, context);
this.blocks = [];
this.blocksView = {};
this.unsubscribe = this.subscribe();
this.prepareFont(this.getFontScale());
}
getFontScale() {
return this.context.graph.rootStore.settings.getConfigFlag("scaleFontSize");
}
rerender() {
this.shouldRenderChildren = true;
this.shouldUpdateChildren = true;
this.performRender();
}
subscribe() {
this.blocks = this.context.graph.rootStore.blocksList.$blocks.value;
this.blocksView = this.context.graph.rootStore.settings.getConfigFlag("blockComponents");
return [
this.context.graph.rootStore.blocksList.$blocks.subscribe((blocks) => {
this.blocks = blocks;
this.rerender();
}),
this.context.graph.rootStore.settings.$blockComponents.subscribe((blockComponents) => {
this.blocksView = blockComponents;
this.rerender();
}),
];
}
prepareFont(scaleFontSize) {
this.font = `bold ${Math.round(this.context.constants.text.BASE_FONT_SIZE * scaleFontSize)}px sans-serif`;
}
unmount() {
super.unmount();
this.unsubscribe.forEach((cb) => cb());
}
updateChildren() {
return this.blocks.map((block, index) => {
return (this.blocksView[block.$state.value.is] || Block).create({
id: block.id,
initialIndex: index,
font: this.font,
}, {
key: block.id,
});
});
}
}