marcel/mermaid
1
0
Fork 0
mirror of https://github.com/mermaid-js/mermaid.git synced 2025-08-16 06:49:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

updated stateEnd Shape

Browse Source
This commit is contained in:
omkarht
2024-08-29 18:53:17 +05:30
parent f27feb268a
commit ee84ed4236
1 changed files with 32 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
packages/mermaid/src/rendering-util/rendering-elements/shapes/stateEnd.ts
View File

@@ -3,10 +3,13 @@ import intersect from '../intersect/index.js';
import type { Node } from '$root/rendering-util/types.d.ts'; import type { Node } from '$root/rendering-util/types.d.ts';
import type { SVG } from '$root/diagram-api/types.js'; import type { SVG } from '$root/diagram-api/types.js';
import rough from 'roughjs'; import rough from 'roughjs';
import { solidStateFill } from './handDrawnShapeStyles.js'; import { solidStateFill, styles2String, userNodeOverrides } from './handDrawnShapeStyles.js';
import { getConfig } from '$root/diagram-api/diagramAPI.js'; import { getConfig } from '$root/diagram-api/diagramAPI.js';
export const stateEnd = (parent: SVG, node: Node) => { export const stateEnd = (parent: SVG, node: Node) => {
const { labelStyles, nodeStyles } = styles2String(node);
node.labelStyle = labelStyles;
const { cssStyles } = node;
const { themeVariables } = getConfig(); const { themeVariables } = getConfig();
const { lineColor } = themeVariables; const { lineColor } = themeVariables;
const shapeSvg = parent const shapeSvg = parent
@@ -14,22 +17,36 @@ export const stateEnd = (parent: SVG, node: Node) => {
.attr('class', 'node default') .attr('class', 'node default')
.attr('id', node.domId || node.id); .attr('id', node.domId || node.id);
let circle; // @ts-ignore TODO: Fix rough typings
let innerCircle; const rc = rough.svg(shapeSvg);
if (node.look === 'handDrawn') { const options = userNodeOverrides(node, {});
// @ts-ignore TODO: Fix rough typings
const rc = rough.svg(shapeSvg);
const roughNode = rc.circle(0, 0, 14, { ...solidStateFill(lineColor), roughness: 0.5 });
const roughInnerNode = rc.circle(0, 0, 5, { ...solidStateFill(lineColor), fillStyle: 'solid' });
circle = shapeSvg.insert(() => roughNode);
innerCircle = shapeSvg.insert(() => roughInnerNode);
} else {
innerCircle = shapeSvg.insert('circle', ':first-child');
circle = shapeSvg.insert('circle', ':first-child');
circle.attr('class', 'state-start').attr('r', 7).attr('width', 14).attr('height', 14); if (node.look !== 'handDrawn') {
options.roughness = 0;
options.fillStyle = 'solid';
}
innerCircle.attr('class', 'state-end').attr('r', 5).attr('width', 10).attr('height', 10); const roughNode = rc.circle(0, 0, 14, {
...solidStateFill(lineColor),
roughness: 0.5,
...options,
});
const roughInnerNode = rc.circle(0, 0, 5, {
...solidStateFill(lineColor),
fillStyle: 'solid',
...options,
});
const circle = shapeSvg.insert(() => roughNode, ':first-child');
circle.insert(() => roughInnerNode);
circle.attr('class', 'basic label-container');
if (cssStyles) {
circle.selectAll('path').attr('style', cssStyles);
}
if (nodeStyles) {
circle.selectAll('path').attr('style', nodeStyles);
} }
updateNodeBounds(node, circle); updateNodeBounds(node, circle);