svg-layout-designer-react/src/Components/SVG/Elements/SelectorSymbol/SelectorSymbol.tsx
2023-02-23 13:54:38 +01:00

43 lines
1 KiB
TypeScript

import '../Selector.scss';
import * as React from 'react';
import { SYMBOL_MARGIN } from '../../../../utils/default';
import { type ISymbolModel } from '../../../../Interfaces/ISymbolModel';
import { Selector } from '../Selector/Selector';
interface ISelectorSymbolProps {
symbols: Map<string, ISymbolModel>
selected?: ISymbolModel
}
export function SelectorSymbol(props: ISelectorSymbolProps): JSX.Element {
if (props.selected === undefined || props.selected === null) {
return (
<rect visibility={'hidden'}>
</rect>
);
}
let x, y: number;
const scaledHeight = props.selected.height;
const scaledWidth = props.selected.width;
if (props.selected.isVertical) {
x = -SYMBOL_MARGIN - props.selected.width;
y = props.selected.offset;
} else {
x = props.selected.offset;
y = -SYMBOL_MARGIN - props.selected.height;
}
return (
<Selector
text={props.selected.displayedText}
x={x}
y={y}
width={scaledWidth}
height={scaledHeight}
scale={1}
/>
);
}