Merged PR 170: Add new eslint rules
- naming-convention - prefer-arrow-callback - func-style - import/no-default-export
This commit is contained in:
Eric Nguyen
parent
3f58c5ba5e
commit
ad126c6c28
65 changed files with 781 additions and 784 deletions
|
|
@ -2,16 +2,15 @@ import { Dispatch, SetStateAction } from 'react';
|
|||
import { IHistoryState } from '../../../Interfaces/IHistoryState';
|
||||
import { IConfiguration } from '../../../Interfaces/IConfiguration';
|
||||
import { ContainerModel, IContainerModel } from '../../../Interfaces/IContainerModel';
|
||||
import { findContainerById, MakeIterator } from '../../../utils/itertools';
|
||||
import { getCurrentHistory, UpdateCounters } from '../Editor';
|
||||
import { FindContainerById, MakeIterator } from '../../../utils/itertools';
|
||||
import { GetCurrentHistory, UpdateCounters } from '../Editor';
|
||||
import { AddMethod } from '../../../Enums/AddMethod';
|
||||
import { IAvailableContainer } from '../../../Interfaces/IAvailableContainer';
|
||||
import { GetDefaultContainerProps, DEFAULTCHILDTYPE_ALLOW_CYCLIC, DEFAULTCHILDTYPE_MAX_DEPTH } from '../../../utils/default';
|
||||
import { ApplyBehaviors } from '../Behaviors/Behaviors';
|
||||
import { ISymbolModel } from '../../../Interfaces/ISymbolModel';
|
||||
import Swal from 'sweetalert2';
|
||||
import { ApplyMargin, transformX } from '../../../utils/svg';
|
||||
import { Flex } from '../Behaviors/FlexBehaviors';
|
||||
import { ApplyMargin, TransformX } from '../../../utils/svg';
|
||||
import { PropertyType } from '../../../Enums/PropertyType';
|
||||
|
||||
/**
|
||||
|
|
@ -25,16 +24,16 @@ export function SelectContainer(
|
|||
setHistory: Dispatch<SetStateAction<IHistoryState[]>>,
|
||||
setHistoryCurrentStep: Dispatch<SetStateAction<number>>
|
||||
): void {
|
||||
const history = getCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const history = GetCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const current = history[history.length - 1];
|
||||
|
||||
history.push({
|
||||
LastAction: `Select ${containerId}`,
|
||||
MainContainer: structuredClone(current.MainContainer),
|
||||
SelectedContainerId: containerId,
|
||||
TypeCounters: Object.assign({}, current.TypeCounters),
|
||||
Symbols: structuredClone(current.Symbols),
|
||||
SelectedSymbolId: current.SelectedSymbolId
|
||||
lastAction: `Select ${containerId}`,
|
||||
mainContainer: structuredClone(current.mainContainer),
|
||||
selectedContainerId: containerId,
|
||||
typeCounters: Object.assign({}, current.typeCounters),
|
||||
symbols: structuredClone(current.symbols),
|
||||
selectedSymbolId: current.selectedSymbolId
|
||||
});
|
||||
setHistory(history);
|
||||
setHistoryCurrentStep(history.length - 1);
|
||||
|
|
@ -55,11 +54,11 @@ export function DeleteContainer(
|
|||
setHistory: Dispatch<SetStateAction<IHistoryState[]>>,
|
||||
setHistoryCurrentStep: Dispatch<SetStateAction<number>>
|
||||
): void {
|
||||
const history = getCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const history = GetCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const current = history[history.length - 1];
|
||||
|
||||
const mainContainerClone: IContainerModel = structuredClone(current.MainContainer);
|
||||
const container = findContainerById(mainContainerClone, containerId);
|
||||
const mainContainerClone: IContainerModel = structuredClone(current.mainContainer);
|
||||
const container = FindContainerById(mainContainerClone, containerId);
|
||||
|
||||
if (container === undefined) {
|
||||
throw new Error(`[DeleteContainer] Tried to delete a container that is not present in the main container: ${containerId}`);
|
||||
|
|
@ -80,7 +79,7 @@ export function DeleteContainer(
|
|||
throw new Error('[DeleteContainer] Container model was not found among children of the main container!');
|
||||
}
|
||||
|
||||
const newSymbols = structuredClone(current.Symbols);
|
||||
const newSymbols = structuredClone(current.symbols);
|
||||
UnlinkSymbol(newSymbols, container);
|
||||
|
||||
const index = container.parent.children.indexOf(container);
|
||||
|
|
@ -90,35 +89,40 @@ export function DeleteContainer(
|
|||
throw new Error('[DeleteContainer] Could not find container among parent\'s children');
|
||||
}
|
||||
|
||||
ApplyBehaviorsOnSiblings(container, current.Symbols);
|
||||
ApplyBehaviorsOnSiblings(container, current.symbols);
|
||||
|
||||
// Select the previous container
|
||||
// or select the one above
|
||||
const SelectedContainerId = GetSelectedContainerOnDelete(
|
||||
const selectedContainerId = GetSelectedContainerOnDelete(
|
||||
mainContainerClone,
|
||||
current.SelectedContainerId,
|
||||
current.selectedContainerId,
|
||||
container.parent,
|
||||
index
|
||||
);
|
||||
|
||||
history.push({
|
||||
LastAction: `Delete ${containerId}`,
|
||||
MainContainer: mainContainerClone,
|
||||
SelectedContainerId,
|
||||
TypeCounters: Object.assign({}, current.TypeCounters),
|
||||
Symbols: newSymbols,
|
||||
SelectedSymbolId: current.SelectedSymbolId
|
||||
lastAction: `Delete ${containerId}`,
|
||||
mainContainer: mainContainerClone,
|
||||
selectedContainerId,
|
||||
typeCounters: Object.assign({}, current.typeCounters),
|
||||
symbols: newSymbols,
|
||||
selectedSymbolId: current.selectedSymbolId
|
||||
});
|
||||
setHistory(history);
|
||||
setHistoryCurrentStep(history.length - 1);
|
||||
}
|
||||
|
||||
function GetSelectedContainerOnDelete(mainContainerClone: IContainerModel, selectedContainerId: string, parent: IContainerModel, index: number): string {
|
||||
const SelectedContainer = findContainerById(mainContainerClone, selectedContainerId) ??
|
||||
function GetSelectedContainerOnDelete(
|
||||
mainContainerClone: IContainerModel,
|
||||
selectedContainerId: string,
|
||||
parent: IContainerModel,
|
||||
index: number
|
||||
): string {
|
||||
const newSelectedContainer = FindContainerById(mainContainerClone, selectedContainerId) ??
|
||||
parent.children.at(index - 1) ??
|
||||
parent;
|
||||
const SelectedContainerId = SelectedContainer.properties.id;
|
||||
return SelectedContainerId;
|
||||
const newSelectedContainerId = newSelectedContainer.properties.id;
|
||||
return newSelectedContainerId;
|
||||
}
|
||||
|
||||
function UnlinkSymbol(symbols: Map<string, ISymbolModel>, container: IContainerModel): void {
|
||||
|
|
@ -191,7 +195,7 @@ export function AddContainer(
|
|||
setHistory: Dispatch<SetStateAction<IHistoryState[]>>,
|
||||
setHistoryCurrentStep: Dispatch<SetStateAction<number>>
|
||||
): void {
|
||||
const history = getCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const history = GetCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const current = history[history.length - 1];
|
||||
|
||||
// Get the preset properties from the API
|
||||
|
|
@ -203,15 +207,15 @@ export function AddContainer(
|
|||
}
|
||||
|
||||
// Set the counter of the object type in order to assign an unique id
|
||||
const newCounters = Object.assign({}, current.TypeCounters);
|
||||
const newCounters = Object.assign({}, current.typeCounters);
|
||||
UpdateCounters(newCounters, type);
|
||||
const count = newCounters[type];
|
||||
|
||||
// Create maincontainer model
|
||||
const clone: IContainerModel = structuredClone(current.MainContainer);
|
||||
const clone: IContainerModel = structuredClone(current.mainContainer);
|
||||
|
||||
// Find the parent
|
||||
const parentClone: IContainerModel | undefined = findContainerById(
|
||||
const parentClone: IContainerModel | undefined = FindContainerById(
|
||||
clone, parentId
|
||||
);
|
||||
|
||||
|
|
@ -258,18 +262,18 @@ export function AddContainer(
|
|||
|
||||
InitializeDefaultChild(configuration, containerConfig, newContainer, newCounters);
|
||||
|
||||
ApplyBehaviors(newContainer, current.Symbols);
|
||||
ApplyBehaviors(newContainer, current.symbols);
|
||||
|
||||
ApplyBehaviorsOnSiblings(newContainer, current.Symbols);
|
||||
ApplyBehaviorsOnSiblings(newContainer, current.symbols);
|
||||
|
||||
// Update the state
|
||||
history.push({
|
||||
LastAction: `Add ${newContainer.properties.id} in ${parentClone.properties.id}`,
|
||||
MainContainer: clone,
|
||||
SelectedContainerId: parentClone.properties.id,
|
||||
TypeCounters: newCounters,
|
||||
Symbols: structuredClone(current.Symbols),
|
||||
SelectedSymbolId: current.SelectedSymbolId
|
||||
lastAction: `Add ${newContainer.properties.id} in ${parentClone.properties.id}`,
|
||||
mainContainer: clone,
|
||||
selectedContainerId: parentClone.properties.id,
|
||||
typeCounters: newCounters,
|
||||
symbols: structuredClone(current.symbols),
|
||||
selectedSymbolId: current.selectedSymbolId
|
||||
});
|
||||
setHistory(history);
|
||||
setHistoryCurrentStep(history.length - 1);
|
||||
|
|
@ -280,8 +284,8 @@ function UpdateParentChildrenList(parentClone: IContainerModel | null | undefine
|
|||
return;
|
||||
}
|
||||
parentClone.children.sort(
|
||||
(a, b) => transformX(a.properties.x, a.properties.width, a.properties.XPositionReference) -
|
||||
transformX(b.properties.x, b.properties.width, b.properties.XPositionReference)
|
||||
(a, b) => TransformX(a.properties.x, a.properties.width, a.properties.xPositionReference) -
|
||||
TransformX(b.properties.x, b.properties.width, b.properties.xPositionReference)
|
||||
);
|
||||
}
|
||||
|
||||
|
|
@ -387,14 +391,14 @@ function ApplyAddMethod(index: number, containerConfig: IAvailableContainer, par
|
|||
export function OnPropertyChange(
|
||||
key: string,
|
||||
value: string | number | boolean,
|
||||
type: PropertyType = PropertyType.SIMPLE,
|
||||
type: PropertyType = PropertyType.Simple,
|
||||
selected: IContainerModel | undefined,
|
||||
fullHistory: IHistoryState[],
|
||||
historyCurrentStep: number,
|
||||
setHistory: Dispatch<SetStateAction<IHistoryState[]>>,
|
||||
setHistoryCurrentStep: Dispatch<SetStateAction<number>>
|
||||
): void {
|
||||
const history = getCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const history = GetCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const current = history[history.length - 1];
|
||||
|
||||
if (selected === null ||
|
||||
|
|
@ -402,22 +406,22 @@ export function OnPropertyChange(
|
|||
throw new Error('[OnPropertyChange] Property was changed before selecting a Container');
|
||||
}
|
||||
|
||||
const mainContainerClone: IContainerModel = structuredClone(current.MainContainer);
|
||||
const container: ContainerModel | undefined = findContainerById(mainContainerClone, selected.properties.id);
|
||||
const mainContainerClone: IContainerModel = structuredClone(current.mainContainer);
|
||||
const container: ContainerModel | undefined = FindContainerById(mainContainerClone, selected.properties.id);
|
||||
|
||||
if (container === null || container === undefined) {
|
||||
throw new Error('[OnPropertyChange] Container model was not found among children of the main container!');
|
||||
}
|
||||
|
||||
SetContainer(container, key, value, type, current.Symbols);
|
||||
SetContainer(container, key, value, type, current.symbols);
|
||||
|
||||
history.push({
|
||||
LastAction: `Change ${key} of ${container.properties.id}`,
|
||||
MainContainer: mainContainerClone,
|
||||
SelectedContainerId: container.properties.id,
|
||||
TypeCounters: Object.assign({}, current.TypeCounters),
|
||||
Symbols: structuredClone(current.Symbols),
|
||||
SelectedSymbolId: current.SelectedSymbolId
|
||||
lastAction: `Change ${key} of ${container.properties.id}`,
|
||||
mainContainer: mainContainerClone,
|
||||
selectedContainerId: container.properties.id,
|
||||
typeCounters: Object.assign({}, current.typeCounters),
|
||||
symbols: structuredClone(current.symbols),
|
||||
selectedSymbolId: current.selectedSymbolId
|
||||
});
|
||||
setHistory(history);
|
||||
setHistoryCurrentStep(history.length - 1);
|
||||
|
|
@ -463,10 +467,10 @@ function SetContainer(
|
|||
|
||||
function AssignProperty(container: ContainerModel, key: string, value: string | number | boolean, type: PropertyType): void {
|
||||
switch (type) {
|
||||
case PropertyType.STYLE:
|
||||
case PropertyType.Style:
|
||||
(container.properties.style as any)[key] = value;
|
||||
break;
|
||||
case PropertyType.MARGIN:
|
||||
case PropertyType.Margin:
|
||||
SetMargin();
|
||||
break;
|
||||
default:
|
||||
|
|
@ -514,10 +518,11 @@ function LinkSymbol(
|
|||
|
||||
newSymbol.linkedContainers.add(containerId);
|
||||
}
|
||||
function ApplyBehaviorsOnSiblings(newContainer: ContainerModel, Symbols: Map<string, ISymbolModel>): void {
|
||||
|
||||
function ApplyBehaviorsOnSiblings(newContainer: ContainerModel, symbols: Map<string, ISymbolModel>): void {
|
||||
if (newContainer.parent === null || newContainer.parent === undefined) {
|
||||
return;
|
||||
}
|
||||
|
||||
newContainer.parent.children.filter(container => newContainer !== container).forEach(container => ApplyBehaviors(container, Symbols));
|
||||
newContainer.parent.children.filter(container => newContainer !== container).forEach(container => ApplyBehaviors(container, symbols));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { IHistoryState } from '../../../Interfaces/IHistoryState';
|
||||
import { IConfiguration } from '../../../Interfaces/IConfiguration';
|
||||
import { getCircularReplacer } from '../../../utils/saveload';
|
||||
import { GetCircularReplacer } from '../../../utils/saveload';
|
||||
import { ID } from '../../SVG/SVG';
|
||||
import { IEditorState } from '../../../Interfaces/IEditorState';
|
||||
import { SHOW_SELECTOR_TEXT } from '../../../utils/default';
|
||||
|
|
@ -26,15 +26,15 @@ export function SaveEditorAsJSON(
|
|||
myWorker.onmessage = (event) => {
|
||||
const data = event.data;
|
||||
const dataStr = `data:text/json;charset=utf-8,${encodeURIComponent(data)}`;
|
||||
createDownloadNode(exportName, dataStr);
|
||||
CreateDownloadNode(exportName, dataStr);
|
||||
myWorker.terminate();
|
||||
};
|
||||
return;
|
||||
}
|
||||
|
||||
const data = JSON.stringify(editorState, getCircularReplacer(), spaces);
|
||||
const data = JSON.stringify(editorState, GetCircularReplacer(), spaces);
|
||||
const dataStr = `data:text/json;charset=utf-8,${encodeURIComponent(data)}`;
|
||||
createDownloadNode(exportName, dataStr);
|
||||
CreateDownloadNode(exportName, dataStr);
|
||||
}
|
||||
|
||||
export function SaveEditorAsSVG(): void {
|
||||
|
|
@ -64,10 +64,10 @@ export function SaveEditorAsSVG(): void {
|
|||
let source = serializer.serializeToString(svg);
|
||||
|
||||
// add name spaces.
|
||||
if (source.match(/^<svg[^>]+xmlns="http\:\/\/www\.w3\.org\/2000\/svg"/) == null) {
|
||||
if (source.match(/^<svg[^>]+xmlns="http:\/\/www\.w3\.org\/2000\/svg"/) == null) {
|
||||
source = source.replace(/^<svg/, '<svg xmlns="http://www.w3.org/2000/svg"');
|
||||
}
|
||||
if (source.match(/^<svg[^>]+"http\:\/\/www\.w3\.org\/1999\/xlink"/) == null) {
|
||||
if (source.match(/^<svg[^>]+"http:\/\/www\.w3\.org\/1999\/xlink"/) == null) {
|
||||
source = source.replace(/^<svg/, '<svg xmlns:xlink="http://www.w3.org/1999/xlink"');
|
||||
}
|
||||
|
||||
|
|
@ -76,10 +76,10 @@ export function SaveEditorAsSVG(): void {
|
|||
|
||||
// convert svg source to URI data scheme.
|
||||
const url = 'data:image/svg+xml;charset=utf-8,' + encodeURIComponent(source);
|
||||
createDownloadNode('state.svg', url);
|
||||
CreateDownloadNode('state.svg', url);
|
||||
}
|
||||
|
||||
function createDownloadNode(filename: string, datastring: string): void {
|
||||
function CreateDownloadNode(filename: string, datastring: string): void {
|
||||
const downloadAnchorNode = document.createElement('a');
|
||||
downloadAnchorNode.href = datastring;
|
||||
downloadAnchorNode.download = filename;
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import { Dispatch, SetStateAction } from 'react';
|
|||
import { IHistoryState } from '../../../Interfaces/IHistoryState';
|
||||
import { ENABLE_SHORTCUTS } from '../../../utils/default';
|
||||
|
||||
export function onKeyDown(
|
||||
export function OnKey(
|
||||
event: KeyboardEvent,
|
||||
history: IHistoryState[],
|
||||
historyCurrentStep: number,
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@ import { IContainerModel } from '../../../Interfaces/IContainerModel';
|
|||
import { IHistoryState } from '../../../Interfaces/IHistoryState';
|
||||
import { ISymbolModel } from '../../../Interfaces/ISymbolModel';
|
||||
import { GetDefaultSymbolModel } from '../../../utils/default';
|
||||
import { findContainerById } from '../../../utils/itertools';
|
||||
import { restoreX } from '../../../utils/svg';
|
||||
import { FindContainerById } from '../../../utils/itertools';
|
||||
import { RestoreX } from '../../../utils/svg';
|
||||
import { ApplyBehaviors } from '../Behaviors/Behaviors';
|
||||
import { getCurrentHistory, UpdateCounters } from '../Editor';
|
||||
import { GetCurrentHistory, UpdateCounters } from '../Editor';
|
||||
|
||||
export function AddSymbol(
|
||||
name: string,
|
||||
|
|
@ -17,7 +17,7 @@ export function AddSymbol(
|
|||
setHistory: Dispatch<SetStateAction<IHistoryState[]>>,
|
||||
setHistoryCurrentStep: Dispatch<SetStateAction<number>>
|
||||
): void {
|
||||
const history = getCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const history = GetCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const current = history[history.length - 1];
|
||||
|
||||
const symbolConfig = configuration.AvailableSymbols
|
||||
|
|
@ -27,22 +27,22 @@ export function AddSymbol(
|
|||
throw new Error('[AddSymbol] Symbol could not be found in the config');
|
||||
}
|
||||
const type = `symbol-${name}`;
|
||||
const newCounters = structuredClone(current.TypeCounters);
|
||||
const newCounters = structuredClone(current.typeCounters);
|
||||
UpdateCounters(newCounters, type);
|
||||
|
||||
const newSymbols = structuredClone(current.Symbols);
|
||||
const newSymbols = structuredClone(current.symbols);
|
||||
const newSymbol: ISymbolModel = GetDefaultSymbolModel(name, newCounters, type, symbolConfig);
|
||||
newSymbol.x = restoreX(newSymbol.x, newSymbol.width, newSymbol.config.XPositionReference);
|
||||
newSymbol.x = RestoreX(newSymbol.x, newSymbol.width, newSymbol.config.XPositionReference);
|
||||
|
||||
newSymbols.set(newSymbol.id, newSymbol);
|
||||
|
||||
history.push({
|
||||
LastAction: `Add ${name}`,
|
||||
MainContainer: structuredClone(current.MainContainer),
|
||||
SelectedContainerId: current.SelectedContainerId,
|
||||
TypeCounters: newCounters,
|
||||
Symbols: newSymbols,
|
||||
SelectedSymbolId: newSymbol.id
|
||||
lastAction: `Add ${name}`,
|
||||
mainContainer: structuredClone(current.mainContainer),
|
||||
selectedContainerId: current.selectedContainerId,
|
||||
typeCounters: newCounters,
|
||||
symbols: newSymbols,
|
||||
selectedSymbolId: newSymbol.id
|
||||
});
|
||||
setHistory(history);
|
||||
setHistoryCurrentStep(history.length - 1);
|
||||
|
|
@ -55,16 +55,16 @@ export function SelectSymbol(
|
|||
setHistory: Dispatch<SetStateAction<IHistoryState[]>>,
|
||||
setHistoryCurrentStep: Dispatch<SetStateAction<number>>
|
||||
): void {
|
||||
const history = getCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const history = GetCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const current = history[history.length - 1];
|
||||
|
||||
history.push({
|
||||
LastAction: `Select ${symbolId}`,
|
||||
MainContainer: structuredClone(current.MainContainer),
|
||||
SelectedContainerId: current.SelectedContainerId,
|
||||
TypeCounters: structuredClone(current.TypeCounters),
|
||||
Symbols: structuredClone(current.Symbols),
|
||||
SelectedSymbolId: symbolId
|
||||
lastAction: `Select ${symbolId}`,
|
||||
mainContainer: structuredClone(current.mainContainer),
|
||||
selectedContainerId: current.selectedContainerId,
|
||||
typeCounters: structuredClone(current.typeCounters),
|
||||
symbols: structuredClone(current.symbols),
|
||||
selectedSymbolId: symbolId
|
||||
});
|
||||
setHistory(history);
|
||||
setHistoryCurrentStep(history.length - 1);
|
||||
|
|
@ -77,29 +77,29 @@ export function DeleteSymbol(
|
|||
setHistory: Dispatch<SetStateAction<IHistoryState[]>>,
|
||||
setHistoryCurrentStep: Dispatch<SetStateAction<number>>
|
||||
): void {
|
||||
const history = getCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const history = GetCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const current = history[history.length - 1];
|
||||
|
||||
const newSymbols = structuredClone(current.Symbols);
|
||||
const newSymbols = structuredClone(current.symbols);
|
||||
const symbol = newSymbols.get(symbolId);
|
||||
|
||||
if (symbol === undefined) {
|
||||
throw new Error(`[DeleteSymbol] Could not find symbol in the current state!: ${symbolId}`);
|
||||
}
|
||||
|
||||
const newMainContainer = structuredClone(current.MainContainer);
|
||||
const newMainContainer = structuredClone(current.mainContainer);
|
||||
|
||||
UnlinkContainers(symbol, newMainContainer);
|
||||
|
||||
newSymbols.delete(symbolId);
|
||||
|
||||
history.push({
|
||||
LastAction: `Select ${symbolId}`,
|
||||
MainContainer: newMainContainer,
|
||||
SelectedContainerId: current.SelectedContainerId,
|
||||
TypeCounters: structuredClone(current.TypeCounters),
|
||||
Symbols: newSymbols,
|
||||
SelectedSymbolId: symbolId
|
||||
lastAction: `Select ${symbolId}`,
|
||||
mainContainer: newMainContainer,
|
||||
selectedContainerId: current.selectedContainerId,
|
||||
typeCounters: structuredClone(current.typeCounters),
|
||||
symbols: newSymbols,
|
||||
selectedSymbolId: symbolId
|
||||
});
|
||||
setHistory(history);
|
||||
setHistoryCurrentStep(history.length - 1);
|
||||
|
|
@ -107,7 +107,7 @@ export function DeleteSymbol(
|
|||
|
||||
function UnlinkContainers(symbol: ISymbolModel, newMainContainer: IContainerModel): void {
|
||||
symbol.linkedContainers.forEach((containerId) => {
|
||||
const container = findContainerById(newMainContainer, containerId);
|
||||
const container = FindContainerById(newMainContainer, containerId);
|
||||
|
||||
if (container === undefined) {
|
||||
return;
|
||||
|
|
@ -131,15 +131,15 @@ export function OnPropertyChange(
|
|||
setHistory: Dispatch<SetStateAction<IHistoryState[]>>,
|
||||
setHistoryCurrentStep: Dispatch<SetStateAction<number>>
|
||||
): void {
|
||||
const history = getCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const history = GetCurrentHistory(fullHistory, historyCurrentStep);
|
||||
const current = history[history.length - 1];
|
||||
|
||||
if (current.SelectedSymbolId === '') {
|
||||
if (current.selectedSymbolId === '') {
|
||||
throw new Error('[OnSymbolPropertyChange] Property was changed before selecting a symbol');
|
||||
}
|
||||
|
||||
const newSymbols: Map<string, ISymbolModel> = structuredClone(current.Symbols);
|
||||
const symbol = newSymbols.get(current.SelectedSymbolId);
|
||||
const newSymbols: Map<string, ISymbolModel> = structuredClone(current.symbols);
|
||||
const symbol = newSymbols.get(current.selectedSymbolId);
|
||||
|
||||
if (symbol === null || symbol === undefined) {
|
||||
throw new Error('[OnSymbolPropertyChange] Symbol model was not found in state!');
|
||||
|
|
@ -147,9 +147,9 @@ export function OnPropertyChange(
|
|||
|
||||
(symbol as any)[key] = value;
|
||||
|
||||
const newMainContainer = structuredClone(current.MainContainer);
|
||||
const newMainContainer = structuredClone(current.mainContainer);
|
||||
symbol.linkedContainers.forEach((containerId) => {
|
||||
const container = findContainerById(newMainContainer, containerId);
|
||||
const container = FindContainerById(newMainContainer, containerId);
|
||||
|
||||
if (container === undefined) {
|
||||
return;
|
||||
|
|
@ -159,12 +159,12 @@ export function OnPropertyChange(
|
|||
});
|
||||
|
||||
history.push({
|
||||
LastAction: `Change ${key} of ${symbol.id}`,
|
||||
MainContainer: newMainContainer,
|
||||
SelectedContainerId: current.SelectedContainerId,
|
||||
TypeCounters: Object.assign({}, current.TypeCounters),
|
||||
Symbols: newSymbols,
|
||||
SelectedSymbolId: symbol.id
|
||||
lastAction: `Change ${key} of ${symbol.id}`,
|
||||
mainContainer: newMainContainer,
|
||||
selectedContainerId: current.selectedContainerId,
|
||||
typeCounters: Object.assign({}, current.typeCounters),
|
||||
symbols: newSymbols,
|
||||
selectedSymbolId: symbol.id
|
||||
});
|
||||
setHistory(history);
|
||||
setHistoryCurrentStep(history.length - 1);
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
*/
|
||||
|
||||
import { IContainerModel } from '../../../Interfaces/IContainerModel';
|
||||
import { constraintBodyInsideUnallocatedWidth } from './RigidBodyBehaviors';
|
||||
import { ConstraintBodyInsideUnallocatedWidth } from './RigidBodyBehaviors';
|
||||
|
||||
/**
|
||||
* Impose the container position to its siblings
|
||||
|
|
@ -31,9 +31,9 @@ export function ApplyAnchor(container: IContainerModel): IContainerModel {
|
|||
child => !child.properties.isAnchor
|
||||
);
|
||||
|
||||
const overlappingContainers = getOverlappingContainers(container, rigidBodies);
|
||||
const overlappingContainers = GetOverlappingContainers(container, rigidBodies);
|
||||
for (const overlappingContainer of overlappingContainers) {
|
||||
constraintBodyInsideUnallocatedWidth(overlappingContainer);
|
||||
ConstraintBodyInsideUnallocatedWidth(overlappingContainer);
|
||||
}
|
||||
return container;
|
||||
}
|
||||
|
|
@ -44,7 +44,7 @@ export function ApplyAnchor(container: IContainerModel): IContainerModel {
|
|||
* @param containers A list of containers
|
||||
* @returns A list of overlapping containers
|
||||
*/
|
||||
function getOverlappingContainers(
|
||||
function GetOverlappingContainers(
|
||||
container: IContainerModel,
|
||||
containers: IContainerModel[]
|
||||
): IContainerModel[] {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
import Swal from 'sweetalert2';
|
||||
import { IContainerModel } from '../../../Interfaces/IContainerModel';
|
||||
import { Simplex } from '../../../utils/simplex';
|
||||
import { ApplyWidthMargin, ApplyXMargin } from '../../../utils/svg';
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { IContainerModel } from '../../../Interfaces/IContainerModel';
|
||||
import { reversePairwise } from '../../../utils/itertools';
|
||||
import { ReversePairwise } from '../../../utils/itertools';
|
||||
import { Flex } from './FlexBehaviors';
|
||||
|
||||
/**
|
||||
|
|
@ -32,7 +32,7 @@ export function PushContainers(container: IContainerModel): IContainerModel {
|
|||
// FIXME: A fix was applied using toFixed(2).
|
||||
// FIXME: A coverture check must be done to ensure that all scenarios are covered
|
||||
|
||||
const it = reversePairwise<IContainerModel>(container.parent.children.filter(child => child !== container));
|
||||
const it = ReversePairwise<IContainerModel>(container.parent.children.filter(child => child !== container));
|
||||
|
||||
for (const { cur, next } of it) {
|
||||
const hasSpaceBetween = next.properties.x + next.properties.width < cur.properties.x;
|
||||
|
|
|
|||
|
|
@ -22,8 +22,8 @@ import { ISizePointer } from '../../../Interfaces/ISizePointer';
|
|||
export function ApplyRigidBody(
|
||||
container: IContainerModel
|
||||
): IContainerModel {
|
||||
container = constraintBodyInsideParent(container);
|
||||
container = constraintBodyInsideUnallocatedWidth(container);
|
||||
container = ConstraintBodyInsideParent(container);
|
||||
container = ConstraintBodyInsideUnallocatedWidth(container);
|
||||
return container;
|
||||
}
|
||||
|
||||
|
|
@ -35,7 +35,7 @@ export function ApplyRigidBody(
|
|||
* @param container
|
||||
* @returns Updated container
|
||||
*/
|
||||
function constraintBodyInsideParent(
|
||||
function ConstraintBodyInsideParent(
|
||||
container: IContainerModel
|
||||
): IContainerModel {
|
||||
if (container.parent === null || container.parent === undefined) {
|
||||
|
|
@ -46,7 +46,7 @@ function constraintBodyInsideParent(
|
|||
const parentWidth = parentProperties.width;
|
||||
const parentHeight = parentProperties.height;
|
||||
|
||||
return constraintBodyInsideSpace(container, 0, 0, parentWidth, parentHeight);
|
||||
return ConstraintBodyInsideSpace(container, 0, 0, parentWidth, parentHeight);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -59,7 +59,7 @@ function constraintBodyInsideParent(
|
|||
* @param height height of the rectangle
|
||||
* @returns Updated container
|
||||
*/
|
||||
function constraintBodyInsideSpace(
|
||||
function ConstraintBodyInsideSpace(
|
||||
container: IContainerModel,
|
||||
x: number,
|
||||
y: number,
|
||||
|
|
@ -113,7 +113,7 @@ function constraintBodyInsideSpace(
|
|||
* @param container
|
||||
* @returns Updated container
|
||||
*/
|
||||
export function constraintBodyInsideUnallocatedWidth(
|
||||
export function ConstraintBodyInsideUnallocatedWidth(
|
||||
container: IContainerModel
|
||||
): IContainerModel {
|
||||
if (container.parent === null || container.parent === undefined) {
|
||||
|
|
@ -121,7 +121,7 @@ export function constraintBodyInsideUnallocatedWidth(
|
|||
}
|
||||
|
||||
// Get the available spaces of the parent
|
||||
const availableWidths = getAvailableWidths(container.parent, container);
|
||||
const availableWidths = GetAvailableWidths(container.parent, container);
|
||||
const containerX = container.properties.x;
|
||||
const containerWidth = container.properties.width;
|
||||
|
||||
|
|
@ -158,7 +158,7 @@ export function constraintBodyInsideUnallocatedWidth(
|
|||
// Check if the container actually fit inside
|
||||
// It will usually fit if it was alrady fitting
|
||||
const availableWidthFound = availableWidths.find((width) =>
|
||||
isFitting(container.properties.width, width)
|
||||
IsFitting(container.properties.width, width)
|
||||
);
|
||||
|
||||
if (availableWidthFound === undefined) {
|
||||
|
|
@ -170,7 +170,7 @@ export function constraintBodyInsideUnallocatedWidth(
|
|||
// We want the container to fit automatically inside the available space
|
||||
// even if it means to resize the container
|
||||
const availableWidth: ISizePointer | undefined = availableWidths.find((width) => {
|
||||
return isFitting(container.properties.minWidth, width);
|
||||
return IsFitting(container.properties.minWidth, width);
|
||||
});
|
||||
|
||||
if (availableWidth === undefined) {
|
||||
|
|
@ -191,7 +191,7 @@ export function constraintBodyInsideUnallocatedWidth(
|
|||
return container;
|
||||
}
|
||||
|
||||
return constraintBodyInsideSpace(
|
||||
return ConstraintBodyInsideSpace(
|
||||
container,
|
||||
availableWidthFound.x,
|
||||
0,
|
||||
|
|
@ -206,10 +206,10 @@ export function constraintBodyInsideUnallocatedWidth(
|
|||
* @param sizePointer Size space to check
|
||||
* @returns
|
||||
*/
|
||||
const isFitting = (
|
||||
containerWidth: number,
|
||||
sizePointer: ISizePointer
|
||||
): boolean => containerWidth <= sizePointer.width;
|
||||
function IsFitting(containerWidth: number,
|
||||
sizePointer: ISizePointer): boolean {
|
||||
return containerWidth <= sizePointer.width;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the unallocated widths inside a container
|
||||
|
|
@ -220,7 +220,7 @@ const isFitting = (
|
|||
* @param exception Container to exclude of the widths (since a container will be moved, it might need to be excluded)
|
||||
* @returns {ISizePointer[]} Array of unallocated widths (x=position of the unallocated space, width=size of the allocated space)
|
||||
*/
|
||||
function getAvailableWidths(
|
||||
function GetAvailableWidths(
|
||||
container: IContainerModel,
|
||||
exception: IContainerModel
|
||||
): ISizePointer[] {
|
||||
|
|
@ -251,7 +251,7 @@ function getAvailableWidths(
|
|||
// In order to find unallocated space,
|
||||
// We need to calculate the overlap between the two containers
|
||||
// We only works with widths meaning in 1D (with lines)
|
||||
const newUnallocatedWidths = getAvailableWidthsTwoLines(
|
||||
const newUnallocatedWidths = GetAvailableWidthsTwoLines(
|
||||
unallocatedSpace,
|
||||
childX,
|
||||
childWidth
|
||||
|
|
@ -274,7 +274,7 @@ function getAvailableWidths(
|
|||
* @param rectWidth width of the second line
|
||||
* @returns Available widths
|
||||
*/
|
||||
function getAvailableWidthsTwoLines(
|
||||
function GetAvailableWidthsTwoLines(
|
||||
unallocatedSpace: ISizePointer,
|
||||
rectX: number,
|
||||
rectWidth: number
|
||||
|
|
@ -295,18 +295,18 @@ function getAvailableWidthsTwoLines(
|
|||
|
||||
const isOverlappingOnTheLeft = unallocatedSpace.x >= rectX;
|
||||
if (isOverlappingOnTheLeft) {
|
||||
return getAvailableWidthsLeft(unallocatedSpaceRight, rectRight);
|
||||
return GetAvailableWidthsLeft(unallocatedSpaceRight, rectRight);
|
||||
}
|
||||
|
||||
const isOverlappingOnTheRight = rectRight >= unallocatedSpaceRight;
|
||||
if (isOverlappingOnTheRight) {
|
||||
return getAvailableWidthsRight(unallocatedSpace.x, rectX);
|
||||
return GetAvailableWidthsRight(unallocatedSpace.x, rectX);
|
||||
}
|
||||
|
||||
return getAvailableWidthsMiddle(unallocatedSpace.x, unallocatedSpaceRight, rectX, rectRight);
|
||||
return GetAvailableWidthsMiddle(unallocatedSpace.x, unallocatedSpaceRight, rectX, rectRight);
|
||||
}
|
||||
|
||||
function getAvailableWidthsLeft(unallocatedSpaceRight: number, rectRight: number): ISizePointer[] {
|
||||
function GetAvailableWidthsLeft(unallocatedSpaceRight: number, rectRight: number): ISizePointer[] {
|
||||
if (unallocatedSpaceRight - rectRight <= 0) {
|
||||
return [];
|
||||
}
|
||||
|
|
@ -319,7 +319,7 @@ function getAvailableWidthsLeft(unallocatedSpaceRight: number, rectRight: number
|
|||
];
|
||||
}
|
||||
|
||||
function getAvailableWidthsRight(unallocatedSpaceX: number, rectX: number): ISizePointer[] {
|
||||
function GetAvailableWidthsRight(unallocatedSpaceX: number, rectX: number): ISizePointer[] {
|
||||
if (rectX - unallocatedSpaceX <= 0) {
|
||||
return [];
|
||||
}
|
||||
|
|
@ -332,7 +332,7 @@ function getAvailableWidthsRight(unallocatedSpaceX: number, rectX: number): ISiz
|
|||
];
|
||||
}
|
||||
|
||||
function getAvailableWidthsMiddle(
|
||||
function GetAvailableWidthsMiddle(
|
||||
unallocatedSpaceX: number,
|
||||
unallocatedSpaceRight: number,
|
||||
rectX: number,
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
import { IContainerModel } from '../../../Interfaces/IContainerModel';
|
||||
import { ISymbolModel } from '../../../Interfaces/ISymbolModel';
|
||||
import { applyParentTransform } from '../../../utils/itertools';
|
||||
import { restoreX, transformX } from '../../../utils/svg';
|
||||
import { ApplyParentTransform } from '../../../utils/itertools';
|
||||
import { RestoreX, TransformX } from '../../../utils/svg';
|
||||
|
||||
export function ApplySymbol(container: IContainerModel, symbol: ISymbolModel): IContainerModel {
|
||||
container.properties.x = transformX(symbol.x, symbol.width, symbol.config.XPositionReference);
|
||||
container.properties.x = restoreX(container.properties.x, container.properties.width, container.properties.XPositionReference);
|
||||
const [x] = applyParentTransform(container.parent, container.properties.x, 0);
|
||||
container.properties.x = TransformX(symbol.x, symbol.width, symbol.config.XPositionReference);
|
||||
container.properties.x = RestoreX(container.properties.x, container.properties.width, container.properties.xPositionReference);
|
||||
const [x] = ApplyParentTransform(container.parent, container.properties.x, 0);
|
||||
container.properties.x = x;
|
||||
return container;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,12 +6,12 @@ import { IHistoryState } from '../../Interfaces/IHistoryState';
|
|||
import { UI } from '../UI/UI';
|
||||
import { SelectContainer, DeleteContainer, AddContainerToSelectedContainer, OnPropertyChange } from './Actions/ContainerOperations';
|
||||
import { SaveEditorAsJSON, SaveEditorAsSVG } from './Actions/Save';
|
||||
import { onKeyDown } from './Actions/Shortcuts';
|
||||
import { OnKey } from './Actions/Shortcuts';
|
||||
import EditorEvents from '../../Events/EditorEvents';
|
||||
import { IEditorState } from '../../Interfaces/IEditorState';
|
||||
import { MAX_HISTORY } from '../../utils/default';
|
||||
import { AddSymbol, OnPropertyChange as OnSymbolPropertyChange, DeleteSymbol, SelectSymbol } from './Actions/SymbolOperations';
|
||||
import { findContainerById } from '../../utils/itertools';
|
||||
import { FindContainerById } from '../../utils/itertools';
|
||||
|
||||
interface IEditorProps {
|
||||
root: Element | Document
|
||||
|
|
@ -29,35 +29,40 @@ export function UpdateCounters(counters: Record<string, number>, type: string):
|
|||
}
|
||||
}
|
||||
|
||||
export const getCurrentHistory = (history: IHistoryState[], historyCurrentStep: number): IHistoryState[] =>
|
||||
history.slice(
|
||||
Math.max(0, history.length - MAX_HISTORY), // change this to 0 for unlimited (not recommanded because of overflow)
|
||||
export function GetCurrentHistory(history: IHistoryState[], historyCurrentStep: number): IHistoryState[] {
|
||||
return history.slice(
|
||||
Math.max(0, history.length - MAX_HISTORY),
|
||||
historyCurrentStep + 1
|
||||
);
|
||||
}
|
||||
|
||||
export const getCurrentHistoryState = (history: IHistoryState[], historyCurrentStep: number): IHistoryState => history[historyCurrentStep];
|
||||
export function GetCurrentHistoryState(history: IHistoryState[], historyCurrentStep: number): IHistoryState {
|
||||
return history[historyCurrentStep];
|
||||
}
|
||||
|
||||
function useShortcuts(
|
||||
function UseShortcuts(
|
||||
history: IHistoryState[],
|
||||
historyCurrentStep: number,
|
||||
setHistoryCurrentStep: Dispatch<SetStateAction<number>>
|
||||
): void {
|
||||
useEffect(() => {
|
||||
const onKeyUp = (event: KeyboardEvent): void => onKeyDown(
|
||||
event,
|
||||
history,
|
||||
historyCurrentStep,
|
||||
setHistoryCurrentStep
|
||||
);
|
||||
function OnKeyUp(event: KeyboardEvent): void {
|
||||
return OnKey(
|
||||
event,
|
||||
history,
|
||||
historyCurrentStep,
|
||||
setHistoryCurrentStep
|
||||
);
|
||||
}
|
||||
|
||||
window.addEventListener('keyup', onKeyUp);
|
||||
window.addEventListener('keyup', OnKeyUp);
|
||||
return () => {
|
||||
window.removeEventListener('keyup', onKeyUp);
|
||||
window.removeEventListener('keyup', OnKeyUp);
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
function useWindowEvents(
|
||||
function UseWindowEvents(
|
||||
root: Element | Document,
|
||||
history: IHistoryState[],
|
||||
historyCurrentStep: number,
|
||||
|
|
@ -76,15 +81,17 @@ function useWindowEvents(
|
|||
|
||||
const funcs = new Map<string, () => void>();
|
||||
for (const event of events) {
|
||||
const func = (eventInitDict?: CustomEventInit): void => event.func(
|
||||
root,
|
||||
editorState,
|
||||
setHistory,
|
||||
setHistoryCurrentStep,
|
||||
eventInitDict
|
||||
);
|
||||
editorRef.current?.addEventListener(event.name, func);
|
||||
funcs.set(event.name, func);
|
||||
function Func(eventInitDict?: CustomEventInit): void {
|
||||
return event.func(
|
||||
root,
|
||||
editorState,
|
||||
setHistory,
|
||||
setHistoryCurrentStep,
|
||||
eventInitDict
|
||||
);
|
||||
}
|
||||
editorRef.current?.addEventListener(event.name, Func);
|
||||
funcs.set(event.name, Func);
|
||||
}
|
||||
return () => {
|
||||
for (const event of events) {
|
||||
|
|
@ -98,13 +105,13 @@ function useWindowEvents(
|
|||
});
|
||||
}
|
||||
|
||||
const Editor: React.FunctionComponent<IEditorProps> = (props) => {
|
||||
export function Editor(props: IEditorProps): JSX.Element {
|
||||
const [history, setHistory] = React.useState<IHistoryState[]>(structuredClone(props.history));
|
||||
const [historyCurrentStep, setHistoryCurrentStep] = React.useState<number>(props.historyCurrentStep);
|
||||
const editorRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
useShortcuts(history, historyCurrentStep, setHistoryCurrentStep);
|
||||
useWindowEvents(
|
||||
UseShortcuts(history, historyCurrentStep, setHistoryCurrentStep);
|
||||
UseWindowEvents(
|
||||
props.root,
|
||||
history,
|
||||
historyCurrentStep,
|
||||
|
|
@ -115,32 +122,32 @@ const Editor: React.FunctionComponent<IEditorProps> = (props) => {
|
|||
);
|
||||
|
||||
const configuration = props.configuration;
|
||||
const current = getCurrentHistoryState(history, historyCurrentStep);
|
||||
const selected = findContainerById(current.MainContainer, current.SelectedContainerId);
|
||||
const current = GetCurrentHistoryState(history, historyCurrentStep);
|
||||
const selected = FindContainerById(current.mainContainer, current.selectedContainerId);
|
||||
return (
|
||||
<div ref={editorRef} className="Editor font-sans h-full">
|
||||
<UI
|
||||
SelectedContainer={selected}
|
||||
selectedContainer={selected}
|
||||
current={current}
|
||||
history={history}
|
||||
historyCurrentStep={historyCurrentStep}
|
||||
AvailableContainers={configuration.AvailableContainers}
|
||||
AvailableSymbols={configuration.AvailableSymbols}
|
||||
SelectContainer={(container) => SelectContainer(
|
||||
availableContainers={configuration.AvailableContainers}
|
||||
availableSymbols={configuration.AvailableSymbols}
|
||||
selectContainer={(container) => SelectContainer(
|
||||
container,
|
||||
history,
|
||||
historyCurrentStep,
|
||||
setHistory,
|
||||
setHistoryCurrentStep
|
||||
)}
|
||||
DeleteContainer={(containerId: string) => DeleteContainer(
|
||||
deleteContainer={(containerId: string) => DeleteContainer(
|
||||
containerId,
|
||||
history,
|
||||
historyCurrentStep,
|
||||
setHistory,
|
||||
setHistoryCurrentStep
|
||||
)}
|
||||
OnPropertyChange={(key, value, type) => OnPropertyChange(
|
||||
onPropertyChange={(key, value, type) => OnPropertyChange(
|
||||
key, value, type,
|
||||
selected,
|
||||
history,
|
||||
|
|
@ -148,7 +155,7 @@ const Editor: React.FunctionComponent<IEditorProps> = (props) => {
|
|||
setHistory,
|
||||
setHistoryCurrentStep
|
||||
)}
|
||||
AddContainer={(type) => AddContainerToSelectedContainer(
|
||||
addContainer={(type) => AddContainerToSelectedContainer(
|
||||
type,
|
||||
selected,
|
||||
configuration,
|
||||
|
|
@ -157,7 +164,7 @@ const Editor: React.FunctionComponent<IEditorProps> = (props) => {
|
|||
setHistory,
|
||||
setHistoryCurrentStep
|
||||
)}
|
||||
AddSymbol={(type) => AddSymbol(
|
||||
addSymbol={(type) => AddSymbol(
|
||||
type,
|
||||
configuration,
|
||||
history,
|
||||
|
|
@ -165,45 +172,42 @@ const Editor: React.FunctionComponent<IEditorProps> = (props) => {
|
|||
setHistory,
|
||||
setHistoryCurrentStep
|
||||
)}
|
||||
OnSymbolPropertyChange={(key, value) => OnSymbolPropertyChange(
|
||||
onSymbolPropertyChange={(key, value) => OnSymbolPropertyChange(
|
||||
key, value,
|
||||
history,
|
||||
historyCurrentStep,
|
||||
setHistory,
|
||||
setHistoryCurrentStep
|
||||
)}
|
||||
SelectSymbol={(symbolId) => SelectSymbol(
|
||||
selectSymbol={(symbolId) => SelectSymbol(
|
||||
symbolId,
|
||||
history,
|
||||
historyCurrentStep,
|
||||
setHistory,
|
||||
setHistoryCurrentStep
|
||||
)}
|
||||
DeleteSymbol={(symbolId) => DeleteSymbol(
|
||||
deleteSymbol={(symbolId) => DeleteSymbol(
|
||||
symbolId,
|
||||
history,
|
||||
historyCurrentStep,
|
||||
setHistory,
|
||||
setHistoryCurrentStep
|
||||
)}
|
||||
SaveEditorAsJSON={() => SaveEditorAsJSON(
|
||||
saveEditorAsJSON={() => SaveEditorAsJSON(
|
||||
history,
|
||||
historyCurrentStep,
|
||||
configuration
|
||||
)}
|
||||
SaveEditorAsSVG={() => SaveEditorAsSVG()}
|
||||
LoadState={(move) => setHistoryCurrentStep(move)}
|
||||
/>
|
||||
saveEditorAsSVG={() => SaveEditorAsSVG()}
|
||||
loadState={(move) => setHistoryCurrentStep(move)} />
|
||||
<SVG
|
||||
width={current.MainContainer?.properties.width}
|
||||
height={current.MainContainer?.properties.height}
|
||||
width={current.mainContainer?.properties.width}
|
||||
height={current.mainContainer?.properties.height}
|
||||
selected={selected}
|
||||
symbols={current.Symbols}
|
||||
symbols={current.symbols}
|
||||
>
|
||||
{ current.MainContainer }
|
||||
{current.mainContainer}
|
||||
</SVG>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Editor;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue