add explicit ruleblock node type color

Author: haschek

src/cmem/react-flow/ReactFlow/ReactFlow.stories.tsx

@@ -97,7 +97,7 @@ const nodeExamples = {
                     content: "Example content.",
                     minimalShape: "none",
                 },
-                position: { x: 400, y: 200 },
+                position: { x: 400, y: 100 },
             },
             {
                 id: "linking-3",
@@ -141,6 +141,16 @@ const nodeExamples = {
                 },
                 position: { x: 50, y: 300 },
             },
+            {
+                id: "linking-6",
+                type: "ruleblock",
+                data: {
+                    label: "Rule block",
+                    content: "Example content.",
+                    minimalShape: "none",
+                },
+                position: { x: 400, y: 200 },
+            },
         ],
         edges: [
             {

src/cmem/react-flow/_handles.scss

@@ -30,5 +30,6 @@
 @include handletypestyles("sourcepath");
 @include handletypestyles("targetpath");
 @include handletypestyles("transformation");
+@include handletypestyles("ruleblock");
 @include handletypestyles("comparator");
 @include handletypestyles("aggregator");

src/cmem/react-flow/_minimap.scss

@@ -44,5 +44,6 @@
 @include mapnodestyles("sourcepath");
 @include mapnodestyles("targetpath");
 @include mapnodestyles("transformation");
+@include mapnodestyles("ruleblock");
 @include mapnodestyles("comparator");
 @include mapnodestyles("aggregator");

src/cmem/react-flow/configuration/_colors-linking.scss

@@ -5,6 +5,8 @@
     --#{$eccgui}-targetpath-node-bright: #{eccgui-color-var("layout", "petrol", 300)};
     --#{$eccgui}-transformation-node: #{eccgui-color-var("layout", "pink", 700)};
     --#{$eccgui}-transformation-node-bright: #{eccgui-color-var("layout", "pink", 300)};
+    --#{$eccgui}-ruleblock-node: #{eccgui-color-var("layout", "vermilion", 700)};
+    --#{$eccgui}-ruleblock-node-bright: #{eccgui-color-var("layout", "vermilion", 300)};
     --#{$eccgui}-comparator-node: #{eccgui-color-var("layout", "teal", 700)};
     --#{$eccgui}-comparator-node-bright: #{eccgui-color-var("layout", "teal", 300)};
     --#{$eccgui}-aggregator-node: #{eccgui-color-var("layout", "cyan", 700)};

src/cmem/react-flow/configuration/linking.ts

@@ -19,6 +19,7 @@ const nodeTypes: Record<LINKING_NODE_TYPES, React.ComponentType<NodeProps>> = {
     sourcepath: NodeDefault,
     targetpath: NodeDefault,
     transformation: NodeDefault,
+    ruleblock: NodeDefault,
     comparator: NodeDefault,
     aggregator: NodeDefault,
     stickynote: StickyNoteNode,

src/cmem/react-flow/configuration/typing.ts

@@ -4,6 +4,7 @@ export enum LINKING_NODE_TYPES {
     sourcepath = "sourcepath",
     targetpath = "targetpath",
     transformation = "transformation",
+    ruleblock = "ruleblock",
     comparator = "comparator",
     aggregator = "aggregator",
     stickynote = "stickynote",

src/cmem/react-flow/nodes/_colors.scss

@@ -62,5 +62,6 @@
 @include nodetypestyles("sourcepath");
 @include nodetypestyles("targetpath");
 @include nodetypestyles("transformation");
+@include nodetypestyles("ruleblock");
 @include nodetypestyles("comparator");
 @include nodetypestyles("aggregator");