Siklos/svg-layout-designer-react
1
1
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Fix symbol behavior not imposing its position when anchor is enabled

Browse source
This commit is contained in:
Eric NGUYEN 2022-08-31 11:32:19 +02:00
parent 5fdbd771ff
commit 3feae9367b
3 changed files with 46 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

45
src/Components/Editor/Behaviors/FlexBehaviors.ts
View file

@ -25,23 +25,30 @@ export function Flex(container: IContainerModel): void {
}
}
/**
* Apply flex to the group
* @param flexibleGroup Group that contains a list of flexible containers
* @returns
*/
function FlexGroup(flexibleGroup: IFlexibleGroup): void {
const children = flexibleGroup.group;
const flexibleContainers = children
.filter(sibling => sibling.properties.isFlex);
const {
flexibleContainers,
nonFlexibleContainers
} = SeparateFlexibleContainers(children);
const minWidths = flexibleContainers
.map(sibling => sibling.properties.minWidth);
const fixedWidth = children
.filter(sibling => !sibling.properties.isFlex)
const fixedWidth = nonFlexibleContainers
.map(sibling => sibling.properties.width)
.reduce((partialSum, a) => partialSum + a, 0);
.reduce((widthSum, a) => widthSum + a, 0);
const requiredMaxWidth = flexibleGroup.size - fixedWidth;
const minimumPossibleWidth = minWidths.reduce((widthSum, a) => widthSum + a, 0); // sum(minWidths)
const minimumPossibleWidth = minWidths.reduce((partialSum, a) => partialSum + a, 0);
if (minimumPossibleWidth > requiredMaxWidth) {
const checkSumMinWidthsIsFitting = minimumPossibleWidth > requiredMaxWidth;
if (checkSumMinWidthsIsFitting) {
// Swal.fire({
// icon: 'error',
// title: 'Cannot fit!',
@ -87,6 +94,30 @@ function FlexGroup(flexibleGroup: IFlexibleGroup): void {
}
}
function SeparateFlexibleContainers(
containers: IContainerModel[]
): { flexibleContainers: IContainerModel[], nonFlexibleContainers: IContainerModel[] } {
const flexibleContainers: IContainerModel[] = [];
const nonFlexibleContainers: IContainerModel[] = [];
containers.forEach((container) => {
if (container.properties.isFlex) {
flexibleContainers.push(container);
return;
}
nonFlexibleContainers.push(container);
});
return {
flexibleContainers,
nonFlexibleContainers
};
}
/**
* Returns a list of groups of flexible containers
* @param parent Parent in which the flexible children will be set in groups
* @returns a list of groups of flexible containers
*/
export function GetFlexibleGroups(parent: IContainerModel): IFlexibleGroup[] {
const flexibleGroups: IFlexibleGroup[] = [];
let group: IContainerModel[] = [];