Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

NO-ISSUE: New BPMN Editor add new icons and improve morphing panels #133

Open
wants to merge 12 commits into
base: new-bpmn-editor
Choose a base branch
from
4 changes: 2 additions & 2 deletions packages/bpmn-editor/src/diagram/BpmnDiagramDomain.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -103,11 +103,11 @@ export type BpmnNodeType = Values<typeof NODE_TYPES>;
export type BpmnEdgeType = Values<typeof EDGE_TYPES>;

export enum ActivityNodeMarker {
Compensation = "Compensation",
Collapsed = "Collapsed",
MultiInstanceParallel = "MultiInstanceParallel",
MultiInstanceSequential = "MultiInstanceSequential",
Collapsed = "Collapsed",
Loop = "Loop",
Compensation = "Compensation",
AdHocSubProcess = "AdHocSubProcess",
}

Expand Down
18 changes: 11 additions & 7 deletions packages/bpmn-editor/src/diagram/nodes/NodeIcons.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -50,17 +50,19 @@ export function NodeIcon({ nodeType }: { nodeType: BpmnNodeType }) {
});
}

export function EventDefitnitionIcon({
export function EventDefinitionIcon({
variant,
filled,
fill,
stroke,
}: {
variant?: EventVariant;
filled: boolean;
fill?: string;
stroke: string;
}) {
const cx = nodeSvgProps.x + nodeSvgProps.width / 2;
const cy = nodeSvgProps.y + nodeSvgProps.width / 2;
const cy = nodeSvgProps.y + nodeSvgProps.height / 2;

const r = nodeSvgProps.width / 2;

Expand All @@ -69,13 +71,15 @@ export function EventDefitnitionIcon({
<EventVariantSymbolSvg
variant={variant ?? "none"}
strokeWidth={16}
isIcon={true}
filled={filled}
stroke={stroke}
fill={fill}
x={nodeSvgProps.x}
y={nodeSvgProps.x}
cx={cx}
cy={cy}
innerCircleRadius={r - 5}
innerCircleRadius={r - 10}
outerCircleRadius={r}
/>
</RoundSvg>
Expand Down Expand Up @@ -114,10 +118,10 @@ export function EndEventIcon({ variant }: { variant?: EventVariant }) {
);
}

export function TaskIcon({ variant }: { variant?: TaskVariant }) {
export function TaskIcon({ variant, isIcon }: { variant?: TaskVariant; isIcon?: boolean }) {
return (
<RoundSvg>
<TaskNodeSvg {...nodeSvgProps} variant={variant ?? "none"} />
<TaskNodeSvg {...nodeSvgProps} variant={variant ?? "none"} isIcon={isIcon ?? false} />
</RoundSvg>
);
}
Expand All @@ -130,10 +134,10 @@ export function CallActivityIcon() {
);
}

export function GatewayIcon({ variant }: { variant?: GatewayVariant }) {
export function GatewayIcon({ variant, isIcon }: { variant?: GatewayVariant; isIcon?: boolean }) {
return (
<RoundSvg>
<GatewayNodeSvg {...nodeSvgProps} width={200} height={200} variant={variant ?? "none"} />
<GatewayNodeSvg {...nodeSvgProps} width={200} height={200} variant={variant ?? "none"} isIcon={isIcon ?? false} />
</RoundSvg>
);
}
Expand Down
Loading
Loading