smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor

Browse source
This commit is contained in:
dwelle 2025-04-30 15:46:46 +02:00
parent e636f84bb6
commit 5f883e35cd
1 changed files with 51 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

96
packages/excalidraw/components/ConvertElementTypePopup.tsx
View file

@ -192,25 +192,29 @@ const Panel = ({
elements: ExcalidrawElement[]; elements: ExcalidrawElement[];
}) => { }) => {
const conversionType = getConversionTypeFromElements(elements); const conversionType = getConversionTypeFromElements(elements);
const generic = conversionType === "generic";
const linear = conversionType === "linear";
const genericElements = useMemo(() => { const genericElements = useMemo(() => {
return generic ? filterGenericConvetibleElements(elements) : []; return conversionType === "generic"
}, [generic, elements]); ? filterGenericConvetibleElements(elements)
: [];
}, [conversionType, elements]);
const linearElements = useMemo(() => { const linearElements = useMemo(() => {
return linear ? filterLinearConvertibleElements(elements) : []; return conversionType === "linear"
}, [linear, elements]); ? filterLinearConvertibleElements(elements)
: [];
}, [conversionType, elements]);
const sameType = generic const sameType =
? genericElements.every( conversionType === "generic"
(element) => element.type === genericElements[0].type, ? genericElements.every(
) (element) => element.type === genericElements[0].type,
: linear )
? linearElements.every( : conversionType === "linear"
(element) => getArrowType(element) === getArrowType(linearElements[0]), ? linearElements.every(
) (element) =>
: false; getArrowType(element) === getArrowType(linearElements[0]),
)
: false;
const [panelPosition, setPanelPosition] = useState({ x: 0, y: 0 }); const [panelPosition, setPanelPosition] = useState({ x: 0, y: 0 });
const positionRef = useRef(""); const positionRef = useRef("");
@ -306,20 +310,21 @@ const Panel = ({
} }
}, [genericElements, app.scene]); }, [genericElements, app.scene]);
const SHAPES: [string, ReactNode][] = linear const SHAPES: [string, ReactNode][] =
? [ conversionType === "linear"
["line", LineIcon], ? [
["sharpArrow", sharpArrowIcon], ["line", LineIcon],
["curvedArrow", roundArrowIcon], ["sharpArrow", sharpArrowIcon],
["elbowArrow", elbowArrowIcon], ["curvedArrow", roundArrowIcon],
] ["elbowArrow", elbowArrowIcon],
: generic ]
? [ : conversionType === "generic"
["rectangle", RectangleIcon], ? [
["diamond", DiamondIcon], ["rectangle", RectangleIcon],
["ellipse", EllipseIcon], ["diamond", DiamondIcon],
] ["ellipse", EllipseIcon],
: []; ]
: [];
return ( return (
<div <div
@ -340,8 +345,9 @@ const Panel = ({
{SHAPES.map(([type, icon]) => { {SHAPES.map(([type, icon]) => {
const isSelected = const isSelected =
sameType && sameType &&
((generic && genericElements[0].type === type) || ((conversionType === "generic" && genericElements[0].type === type) ||
(linear && getArrowType(linearElements[0]) === type)); (conversionType === "linear" &&
getArrowType(linearElements[0]) === type));
return ( return (
<ToolButton <ToolButton
@ -921,17 +927,17 @@ const convertElementType = <
TElement extends Exclude<ExcalidrawElement, ExcalidrawSelectionElement>, TElement extends Exclude<ExcalidrawElement, ExcalidrawSelectionElement>,
>( >(
element: TElement, element: TElement,
newType: ConvertibleTypes, targetType: ConvertibleTypes,
app: AppClassProperties, app: AppClassProperties,
): ExcalidrawElement => { ): ExcalidrawElement => {
if (!isValidConversion(element.type, newType)) { if (!isValidConversion(element.type, targetType)) {
if (isDevEnv()) { if (isDevEnv()) {
throw Error(`Invalid conversion from ${element.type} to ${newType}.`); throw Error(`Invalid conversion from ${element.type} to ${targetType}.`);
} }
return element; return element;
} }
const startType = isSharpArrow(element) const origType = isSharpArrow(element)
? "sharpArrow" ? "sharpArrow"
: isCurvedArrow(element) : isCurvedArrow(element)
? "curvedArrow" ? "curvedArrow"
@ -939,24 +945,24 @@ const convertElementType = <
? "elbowArrow" ? "elbowArrow"
: element.type; : element.type;
if (element.type === newType) { if (element.type === targetType) {
return element; return element;
} }
ShapeCache.delete(element); ShapeCache.delete(element);
if ( if (
isConvertibleGenericType(startType) && isConvertibleGenericType(origType) &&
isConvertibleGenericType(newType) isConvertibleGenericType(targetType)
) { ) {
const nextElement = bumpVersion( const nextElement = bumpVersion(
newElement({ newElement({
...element, ...element,
type: newType, type: targetType,
roundness: roundness:
newType === "diamond" && element.roundness targetType === "diamond" && element.roundness
? { ? {
type: isUsingAdaptiveRadius(newType) type: isUsingAdaptiveRadius(targetType)
? ROUNDNESS.ADAPTIVE_RADIUS ? ROUNDNESS.ADAPTIVE_RADIUS
: ROUNDNESS.PROPORTIONAL_RADIUS, : ROUNDNESS.PROPORTIONAL_RADIUS,
} }
@ -975,7 +981,7 @@ const convertElementType = <
} }
if (isConvertibleLinearType(element.type)) { if (isConvertibleLinearType(element.type)) {
if (newType === "line") { if (targetType === "line") {
const nextElement = newLinearElement({ const nextElement = newLinearElement({
...element, ...element,
type: "line", type: "line",
@ -984,7 +990,7 @@ const convertElementType = <
return bumpVersion(nextElement); return bumpVersion(nextElement);
} }
if (newType === "sharpArrow") { if (targetType === "sharpArrow") {
const nextElement = newArrowElement({ const nextElement = newArrowElement({
...element, ...element,
type: "arrow", type: "arrow",
@ -997,7 +1003,7 @@ const convertElementType = <
return bumpVersion(nextElement); return bumpVersion(nextElement);
} }
if (newType === "curvedArrow") { if (targetType === "curvedArrow") {
const nextElement = newArrowElement({ const nextElement = newArrowElement({
...element, ...element,
type: "arrow", type: "arrow",
@ -1012,7 +1018,7 @@ const convertElementType = <
return bumpVersion(nextElement); return bumpVersion(nextElement);
} }
if (newType === "elbowArrow") { if (targetType === "elbowArrow") {
const nextElement = newArrowElement({ const nextElement = newArrowElement({
...element, ...element,
type: "arrow", type: "arrow",