@likec4/language-server 1.17.0 → 1.17.1

package/dist/shared/{language-server.BGGRJRnr.d.mts → language-server._wkyPgso.d.mts}

@@ -39,7 +39,7 @@ declare class LikeC4DocumentLinkProvider implements DocumentLinkProvider {
 }
 
 /******************************************************************************
- * This file was generated by langium-cli 3.2.0.
+ * This file was generated by langium-cli 3.3.0.
  * DO NOT EDIT MANUALLY!
  ******************************************************************************/
 
@@ -49,23 +49,19 @@ type CustomColorId = 'element' | 'model' | ArrowType | ElementShape | LineOption
 type CustomColorValue = string;
 type DynamicViewRule = DynamicViewGlobalPredicateRef | DynamicViewIncludePredicate | ViewRuleAutoLayout | ViewRuleStyleOrGlobalRef;
 declare const DynamicViewRule = "DynamicViewRule";
-declare function isDynamicViewRule(item: unknown): item is DynamicViewRule;
 type ElementExpression = ElementDescedantsExpression | ElementKindExpression | ElementRef | ElementTagExpression | ExpandElementExpression | WildcardExpression;
 declare const ElementExpression = "ElementExpression";
-declare function isElementExpression(item: unknown): item is ElementExpression;
 type ElementPredicate = ElementPredicateOrWhere | ElementPredicateWith;
 declare const ElementPredicate = "ElementPredicate";
 type ElementPredicateOrWhere = ElementExpression | ElementPredicateWhere;
 declare const ElementPredicateOrWhere = "ElementPredicateOrWhere";
 type ElementProperty = ElementStringProperty | ElementStyleProperty | IconProperty | LinkProperty | MetadataProperty;
 declare const ElementProperty = "ElementProperty";
-declare function isElementProperty(item: unknown): item is ElementProperty;
 type ElementShape = 'browser' | 'cylinder' | 'mobile' | 'person' | 'queue' | 'rectangle' | 'storage';
 type IconId = string;
 type Id = 'element' | 'group' | 'model' | ArrowType | ElementShape | LineOptions | ThemeColor | string;
 type LikeC4View = DynamicView | ElementView;
 declare const LikeC4View = "LikeC4View";
-declare function isLikeC4View(item: unknown): item is LikeC4View;
 type LineOptions = 'dashed' | 'dotted' | 'solid';
 type MetadataProperty = MetadataBody;
 declare const MetadataProperty = "MetadataProperty";
@@ -73,30 +69,25 @@ type Predicate = ElementPredicate | RelationPredicate;
 declare const Predicate = "Predicate";
 type RelationExpression = DirectedRelationExpression | InOutRelationExpression | IncomingRelationExpression | OutgoingRelationExpression;
 declare const RelationExpression = "RelationExpression";
-declare function isRelationExpression(item: unknown): item is RelationExpression;
 type RelationPredicate = RelationPredicateOrWhere | RelationPredicateWith;
 declare const RelationPredicate = "RelationPredicate";
 type RelationPredicateOrWhere = RelationExpression | RelationPredicateWhere;
 declare const RelationPredicateOrWhere = "RelationPredicateOrWhere";
 type RelationProperty = LinkProperty | MetadataProperty | RelationNavigateToProperty | RelationStringProperty | RelationStyleProperty;
 declare const RelationProperty = "RelationProperty";
-declare function isRelationProperty(item: unknown): item is RelationProperty;
 type RelationshipStyleProperty = ArrowProperty | ColorProperty | LineProperty;
 declare const RelationshipStyleProperty = "RelationshipStyleProperty";
 type StringProperty = ElementStringProperty | MetadataAttribute | NotationProperty | NotesProperty | RelationStringProperty | SpecificationElementStringProperty | SpecificationRelationshipStringProperty | ViewStringProperty;
 declare const StringProperty = "StringProperty";
 type StyleProperty = BorderProperty | ColorProperty | IconProperty | OpacityProperty | ShapeProperty;
 declare const StyleProperty = "StyleProperty";
-declare function isStyleProperty(item: unknown): item is StyleProperty;
 type ThemeColor = 'amber' | 'blue' | 'gray' | 'green' | 'indigo' | 'muted' | 'primary' | 'red' | 'secondary' | 'sky' | 'slate';
 type Uri = string;
 type ViewLayoutDirection = 'BottomTop' | 'LeftRight' | 'RightLeft' | 'TopBottom';
 type ViewProperty = LinkProperty | ViewStringProperty;
 declare const ViewProperty = "ViewProperty";
-declare function isViewProperty(item: unknown): item is ViewProperty;
 type ViewRule = ViewRuleAutoLayout | ViewRuleGlobalPredicateRef | ViewRuleGroup | ViewRulePredicate | ViewRuleStyleOrGlobalRef;
 declare const ViewRule = "ViewRule";
-declare function isViewRule(item: unknown): item is ViewRule;
 type ViewRulePredicate = ExcludePredicate | IncludePredicate;
 declare const ViewRulePredicate = "ViewRulePredicate";
 type ViewRuleStyleOrGlobalRef = ViewRuleGlobalStyle | ViewRuleStyle;
@@ -178,7 +169,6 @@ interface DynamicViewBody extends AstNode {
     tags?: Tags;
 }
 declare const DynamicViewBody = "DynamicViewBody";
-declare function isDynamicViewBody(item: unknown): item is DynamicViewBody;
 interface DynamicViewGlobalPredicateRef extends AstNode {
     readonly $container: DynamicViewBody;
     readonly $type: 'DynamicViewGlobalPredicateRef';
@@ -197,7 +187,6 @@ interface DynamicViewParallelSteps extends AstNode {
     steps: Array<DynamicViewStep>;
 }
 declare const DynamicViewParallelSteps = "DynamicViewParallelSteps";
-declare function isDynamicViewParallelSteps(item: unknown): item is DynamicViewParallelSteps;
 interface DynamicViewPredicateIterator extends AstNode {
     readonly $container: DynamicViewIncludePredicate | DynamicViewPredicateIterator;
     readonly $type: 'DynamicViewPredicateIterator';
@@ -205,7 +194,6 @@ interface DynamicViewPredicateIterator extends AstNode {
     value: ElementPredicate;
 }
 declare const DynamicViewPredicateIterator = "DynamicViewPredicateIterator";
-declare function isDynamicViewPredicateIterator(item: unknown): item is DynamicViewPredicateIterator;
 interface DynamicViewRef extends AstNode {
     readonly $container: RelationNavigateToProperty;
     readonly $type: 'DynamicViewRef';
@@ -223,7 +211,6 @@ interface DynamicViewStep extends AstNode {
     title?: string;
 }
 declare const DynamicViewStep = "DynamicViewStep";
-declare function isDynamicViewStep(item: unknown): item is DynamicViewStep;
 interface Element extends AstNode {
     readonly $container: ElementBody | ExtendElementBody | Model;
     readonly $type: 'Element';
@@ -233,7 +220,6 @@ interface Element extends AstNode {
     props: Array<string>;
 }
 declare const Element = "Element";
-declare function isElement(item: unknown): item is Element;
 interface ElementBody extends AstNode {
     readonly $container: Element;
     readonly $type: 'ElementBody';
@@ -242,7 +228,6 @@ interface ElementBody extends AstNode {
     tags?: Tags;
 }
 declare const ElementBody = "ElementBody";
-declare function isElementBody(item: unknown): item is ElementBody;
 interface ElementDescedantsExpression extends AstNode {
     readonly $container: DirectedRelationExpression | DynamicViewPredicateIterator | ElementExpressionsIterator | ElementPredicateWhere | ElementPredicateWith | IncomingRelationExpression | OutgoingRelationExpression | Predicates;
     readonly $type: 'ElementDescedantsExpression';
@@ -283,7 +268,6 @@ interface ElementPredicateWith extends AstNode {
     subject: ElementPredicateOrWhere;
 }
 declare const ElementPredicateWith = "ElementPredicateWith";
-declare function isElementPredicateWith(item: unknown): item is ElementPredicateWith;
 interface ElementRef extends AstNode {
     readonly $container: DirectedRelationExpression | DynamicViewPredicateIterator | DynamicViewStep | ElementDescedantsExpression | ElementExpressionsIterator | ElementPredicateWhere | ElementPredicateWith | ElementRef | ElementView | ExpandElementExpression | IncomingRelationExpression | OutgoingRelationExpression | Predicates | Relation;
     readonly $type: 'ElementRef';
@@ -329,7 +313,6 @@ interface ElementViewBody extends AstNode {
     tags?: Tags;
 }
 declare const ElementViewBody = "ElementViewBody";
-declare function isElementViewBody(item: unknown): item is ElementViewBody;
 interface ElementViewRef extends AstNode {
     readonly $container: ElementView;
     readonly $type: 'ElementViewRef';
@@ -355,14 +338,12 @@ interface ExtendElement extends AstNode {
     element: FqnElementRef;
 }
 declare const ExtendElement = "ExtendElement";
-declare function isExtendElement(item: unknown): item is ExtendElement;
 interface ExtendElementBody extends AstNode {
     readonly $container: ExtendElement;
     readonly $type: 'ExtendElementBody';
     elements: Array<Element | Relation>;
 }
 declare const ExtendElementBody = "ExtendElementBody";
-declare function isExtendElementBody(item: unknown): item is ExtendElementBody;
 interface FqnElementRef extends AstNode {
     readonly $container: ExtendElement | FqnElementRef;
     readonly $type: 'FqnElementRef';
@@ -377,7 +358,6 @@ interface GlobalDynamicPredicateGroup extends AstNode {
     predicates: Array<DynamicViewIncludePredicate>;
 }
 declare const GlobalDynamicPredicateGroup = "GlobalDynamicPredicateGroup";
-declare function isGlobalDynamicPredicateGroup(item: unknown): item is GlobalDynamicPredicateGroup;
 interface GlobalPredicateGroup extends AstNode {
     readonly $container: Globals;
     readonly $type: 'GlobalPredicateGroup';
@@ -385,7 +365,6 @@ interface GlobalPredicateGroup extends AstNode {
     predicates: Array<ViewRulePredicate>;
 }
 declare const GlobalPredicateGroup = "GlobalPredicateGroup";
-declare function isGlobalPredicateGroup(item: unknown): item is GlobalPredicateGroup;
 interface Globals extends AstNode {
     readonly $container: LikeC4Grammar;
     readonly $type: 'Globals';
@@ -394,7 +373,6 @@ interface Globals extends AstNode {
     styles: Array<GlobalStyle | GlobalStyleGroup>;
 }
 declare const Globals = "Globals";
-declare function isGlobals(item: unknown): item is Globals;
 interface GlobalStyle extends AstNode {
     readonly $container: Globals;
     readonly $type: 'GlobalStyle';
@@ -403,7 +381,6 @@ interface GlobalStyle extends AstNode {
     target: ElementExpressionsIterator;
 }
 declare const GlobalStyle = "GlobalStyle";
-declare function isGlobalStyle(item: unknown): item is GlobalStyle;
 interface GlobalStyleGroup extends AstNode {
     readonly $container: Globals;
     readonly $type: 'GlobalStyleGroup';
@@ -411,7 +388,6 @@ interface GlobalStyleGroup extends AstNode {
     styles: Array<ViewRuleStyle>;
 }
 declare const GlobalStyleGroup = "GlobalStyleGroup";
-declare function isGlobalStyleGroup(item: unknown): item is GlobalStyleGroup;
 interface GlobalStyleId extends AstNode {
     readonly $container: GlobalStyle | GlobalStyleGroup;
     readonly $type: 'GlobalStyleId';
@@ -500,7 +476,6 @@ interface Model extends AstNode {
     name: 'model';
 }
 declare const Model = "Model";
-declare function isModel(item: unknown): item is Model;
 interface ModelViews extends AstNode {
     readonly $container: LikeC4Grammar;
     readonly $type: 'ModelViews';
@@ -509,7 +484,6 @@ interface ModelViews extends AstNode {
     views: Array<LikeC4View>;
 }
 declare const ModelViews = "ModelViews";
-declare function isModelViews(item: unknown): item is ModelViews;
 interface NavigateToProperty extends AstNode {
     readonly $container: CustomElementProperties;
     readonly $type: 'NavigateToProperty';
@@ -565,7 +539,6 @@ interface Relation extends AstNode {
     title?: string;
 }
 declare const Relation = "Relation";
-declare function isRelation(item: unknown): item is Relation;
 interface RelationBody extends AstNode {
     readonly $container: Relation;
     readonly $type: 'RelationBody';
@@ -573,7 +546,6 @@ interface RelationBody extends AstNode {
     tags?: Tags;
 }
 declare const RelationBody = "RelationBody";
-declare function isRelationBody(item: unknown): item is RelationBody;
 interface RelationNavigateToProperty extends AstNode {
     readonly $container: CustomRelationProperties | RelationBody;
     readonly $type: 'RelationNavigateToProperty';
@@ -595,7 +567,6 @@ interface RelationPredicateWith extends AstNode {
     subject: RelationPredicateOrWhere;
 }
 declare const RelationPredicateWith = "RelationPredicateWith";
-declare function isRelationPredicateWith(item: unknown): item is RelationPredicateWith;
 interface RelationshipKind extends AstNode {
     readonly $container: SpecificationRelationshipKind;
     readonly $type: 'RelationshipKind';
@@ -630,7 +601,6 @@ interface SpecificationColor extends AstNode {
     name: CustomColor;
 }
 declare const SpecificationColor = "SpecificationColor";
-declare function isSpecificationColor(item: unknown): item is SpecificationColor;
 interface SpecificationElementKind extends AstNode {
     readonly $container: SpecificationRule;
     readonly $type: 'SpecificationElementKind';
@@ -638,7 +608,6 @@ interface SpecificationElementKind extends AstNode {
     props: Array<ElementStyleProperty | SpecificationElementStringProperty>;
 }
 declare const SpecificationElementKind = "SpecificationElementKind";
-declare function isSpecificationElementKind(item: unknown): item is SpecificationElementKind;
 interface SpecificationElementStringProperty extends AstNode {
     readonly $container: SpecificationElementKind;
     readonly $type: 'SpecificationElementStringProperty';
@@ -653,7 +622,6 @@ interface SpecificationRelationshipKind extends AstNode {
     props: Array<RelationshipStyleProperty | SpecificationRelationshipStringProperty>;
 }
 declare const SpecificationRelationshipKind = "SpecificationRelationshipKind";
-declare function isSpecificationRelationshipKind(item: unknown): item is SpecificationRelationshipKind;
 interface SpecificationRelationshipStringProperty extends AstNode {
     readonly $container: SpecificationRelationshipKind;
     readonly $type: 'SpecificationRelationshipStringProperty';
@@ -671,14 +639,12 @@ interface SpecificationRule extends AstNode {
     tags: Array<SpecificationTag>;
 }
 declare const SpecificationRule = "SpecificationRule";
-declare function isSpecificationRule(item: unknown): item is SpecificationRule;
 interface SpecificationTag extends AstNode {
     readonly $container: SpecificationRule;
     readonly $type: 'SpecificationTag';
     tag: Tag;
 }
 declare const SpecificationTag = "SpecificationTag";
-declare function isSpecificationTag(item: unknown): item is SpecificationTag;
 interface Tag extends AstNode {
     readonly $container: SpecificationTag;
     readonly $type: 'Tag';
@@ -692,7 +658,6 @@ interface Tags extends AstNode {
     values: Array<Reference<Tag>>;
 }
 declare const Tags = "Tags";
-declare function isTags(item: unknown): item is Tags;
 interface ViewRef extends AstNode {
     readonly $container: NavigateToProperty;
     readonly $type: 'ViewRef';
@@ -1046,7 +1011,7 @@ interface ParsedLikeC4LangiumDocument extends Omit<LangiumDocument<LikeC4Grammar
 }
 type Guard<N extends AstNode> = (n: AstNode) => n is N;
 type Guarded<G> = G extends Guard<infer N> ? N : never;
-declare const isValidatableAstNode: (n: AstNode) => n is Guarded<typeof isRelation | typeof isExtendElement | typeof isElement | typeof isLikeC4View | typeof isGlobals | typeof isGlobalPredicateGroup | typeof isGlobalDynamicPredicateGroup | typeof isGlobalStyle | typeof isGlobalStyleGroup | typeof isDynamicViewPredicateIterator | typeof isElementPredicateWith | typeof isRelationPredicateWith | typeof isElementExpression | typeof isRelationExpression | typeof isDynamicViewParallelSteps | typeof isDynamicViewStep | typeof isViewProperty | typeof isStyleProperty | typeof isTags | typeof isViewRule | typeof isDynamicViewRule | typeof isElementViewBody | typeof isDynamicViewBody | typeof isRelationProperty | typeof isRelationBody | typeof isElementProperty | typeof isElementBody | typeof isExtendElementBody | typeof isSpecificationElementKind | typeof isSpecificationRelationshipKind | typeof isSpecificationTag | typeof isSpecificationColor | typeof isSpecificationRule | typeof isModelViews | typeof isModel>;
+declare const isValidatableAstNode: (n: AstNode) => n is RelationStyleProperty | SpecificationRelationshipKind | DynamicViewStep | RelationPredicateWith | DynamicViewBody | DynamicViewParallelSteps | DynamicView | ModelViews | ExcludePredicate | IncludePredicate | ElementViewBody | GlobalPredicateGroup | ViewRuleGroup | ElementView | Globals | RelationBody | Relation | ElementBody | ExtendElementBody | Model | Element | ExtendElement | SpecificationRule | BorderProperty | ElementStyleProperty | GlobalStyle | ViewRuleStyle | ElementPredicateWith | DynamicViewPredicateIterator | DynamicViewIncludePredicate | GlobalDynamicPredicateGroup | SpecificationElementKind | GlobalStyleGroup | ColorProperty | SpecificationColor | DirectedRelationExpression | DynamicViewGlobalPredicateRef | RelationNavigateToProperty | ViewRuleAutoLayout | ViewRuleGlobalStyle | ElementDescedantsExpression | IncomingRelationExpression | OutgoingRelationExpression | InOutRelationExpression | ElementKindExpression | ElementRef | ElementTagExpression | ExpandElementExpression | WildcardExpression | ElementStringProperty | IconProperty | LinkProperty | MetadataBody | OpacityProperty | RelationStringProperty | ShapeProperty | SpecificationTag | ViewStringProperty | Tags | ViewRuleGlobalPredicateRef;
 type ValidatableAstNode = Guarded<typeof isValidatableAstNode>;
 declare function checksFromDiagnostics(doc: LikeC4LangiumDocument): {
     isValid: (n: ValidatableAstNode) => boolean;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@likec4/language-server",
   "description": "LikeC4 Language Server",
-  "version": "1.17.0",
+  "version": "1.17.1",
   "license": "MIT",
   "bugs": "https://github.com/likec4/likec4/issues",
   "homepage": "https://likec4.dev",
@@ -112,20 +112,20 @@
   },
   "dependencies": {
     "@dagrejs/dagre": "^1.1.4",
-    "@likec4/core": "1.17.0",
-    "@likec4/log": "1.17.0",
+    "@likec4/core": "1.17.1",
+    "@likec4/log": "1.17.1",
     "@msgpack/msgpack": "^3.0.0-beta2",
     "@smithy/util-base64": "^3.0.0",
     "fast-equals": "^5.0.1",
     "indent-string": "^5.0.0",
     "json5": "^2.2.3",
-    "langium": "3.2.0",
+    "langium": "3.3.0",
     "object-hash": "^3.0.0",
     "p-debounce": "^4.0.0",
-    "remeda": "^2.16.0",
+    "remeda": "^2.17.3",
     "string-hash": "^1.1.3",
     "strip-indent": "^4.0.0",
-    "type-fest": "4.26.1",
+    "type-fest": "4.27.1",
     "ufo": "^1.5.4",
     "vscode-jsonrpc": "8.2.0",
     "vscode-languageserver": "9.0.1",
@@ -133,20 +133,20 @@
     "vscode-uri": "3.0.8"
   },
   "devDependencies": {
-    "@likec4/icons": "1.17.0",
-    "@likec4/tsconfig": "1.17.0",
-    "@types/node": "^20.16.14",
+    "@likec4/icons": "1.17.1",
+    "@likec4/tsconfig": "1.17.1",
+    "@types/node": "^20.17.7",
     "@types/object-hash": "^3.0.6",
     "@types/string-hash": "^1.1.3",
     "@vitest/coverage-v8": "^2.1.5",
     "execa": "^9.3.1",
-    "langium-cli": "3.2.0",
-    "npm-run-all2": "^6.2.6",
+    "langium-cli": "3.3.0",
+    "npm-run-all2": "^7.0.1",
     "tsx": "~4.9.3",
-    "turbo": "^2.2.3",
-    "typescript": "^5.6.3",
+    "turbo": "^2.3.1",
+    "typescript": "^5.7.2",
     "unbuild": "^3.0.0-rc.11",
     "vitest": "^2.1.5"
   },
-  "packageManager": "yarn@4.5.1"
+  "packageManager": "yarn@4.5.3"
 }

package/src/formatting/LikeC4Formatter.ts

@@ -1,5 +1,6 @@
 import { type AstNode, GrammarUtils } from 'langium'
 import { AbstractFormatter, Formatting, type NodeFormatter } from 'langium/lsp'
+import { filter, isTruthy } from 'remeda'
 import * as ast from '../generated/ast'
 import * as utils from './utils'
 
@@ -19,7 +20,7 @@ export class LikeC4Formatter extends AbstractFormatter {
 
     // Specification
     this.formatSpecificationRule(node)
-    
+
     // Globals
     this.formatGlobals(node)
 
@@ -27,7 +28,7 @@ export class LikeC4Formatter extends AbstractFormatter {
     this.formatElementDeclaration(node)
     this.formatRelation(node)
     this.formatMetadataProperty(node)
-    
+
     // Views
     this.formatView(node)
     this.formatViewRuleGroup(node)
@@ -36,7 +37,7 @@ export class LikeC4Formatter extends AbstractFormatter {
     this.formatWhereExpression(node)
     this.formatAutolayoutProperty(node)
     this.formatWithPredicate(node)
-    
+
     // Common
     this.formatViewRuleStyle(node)
     this.formatLeafProperty(node)
@@ -64,7 +65,11 @@ export class LikeC4Formatter extends AbstractFormatter {
       f.keywords(']->').prepend(FormattingOptions.noSpace)
       f.keywords('-[').append(FormattingOptions.noSpace)
 
-      f.properties('target', 'title', 'technology', 'tags').prepend(FormattingOptions.oneSpace)
+      f.nodes(...filter([
+        n.target,
+        n.tags
+      ], isTruthy)).prepend(FormattingOptions.oneSpace)
+      f.properties('title', 'technology').prepend(FormattingOptions.oneSpace)
     })
 
     this.on(node, ast.isDynamicViewStep, (n, f) => {

package/src/generated/ast.ts

@@ -1,5 +1,5 @@
 /******************************************************************************
- * This file was generated by langium-cli 3.2.0.
+ * This file was generated by langium-cli 3.3.0.
  * DO NOT EDIT MANUALLY!
  ******************************************************************************/
 

package/src/generated/grammar.ts

@@ -1,5 +1,5 @@
 /******************************************************************************
- * This file was generated by langium-cli 3.2.0.
+ * This file was generated by langium-cli 3.3.0.
  * DO NOT EDIT MANUALLY!
  ******************************************************************************/
 

package/src/generated/module.ts

@@ -1,5 +1,5 @@
 /******************************************************************************
- * This file was generated by langium-cli 3.2.0.
+ * This file was generated by langium-cli 3.3.0.
  * DO NOT EDIT MANUALLY!
  ******************************************************************************/
 
@@ -10,7 +10,8 @@ import { LikeC4Grammar } from './grammar';
 export const LikeC4LanguageMetaData = {
     languageId: 'likec4',
     fileExtensions: ['.c4', '.likec4', '.like-c4'],
-    caseInsensitive: false
+    caseInsensitive: false,
+    mode: 'production'
 } as const satisfies LanguageMetaData;
 
 export const parserConfig: IParserConfig = {

package/src/model-graph/dynamic-view/compute.ts

@@ -91,7 +91,12 @@ export class DynamicViewComputeCtx {
       title,
       relations,
       tags,
-      navigateTo: derivedNavigateTo
+      navigateTo: derivedNavigateTo,
+      head,
+      tail,
+      color,
+      line,
+      notation
     } = this.findRelations(source, target)
 
     const navigateTo = isTruthy(stepNavigateTo) && stepNavigateTo !== this.view.id ? stepNavigateTo : derivedNavigateTo
@@ -105,7 +110,12 @@ export class DynamicViewComputeCtx {
       relations: relations ?? [],
       isBackward: isBackward ?? false,
       ...(navigateTo ? { navigateTo } : {}),
-      ...(tags ? { tags } : {})
+      ...(tags ? { tags } : {}),
+      ...(head ? { head } : {}),
+      ...(tail ? { tail } : {}),
+      ...(color ? { color } : {}),
+      ...(line ? { line } : {}),
+      ...(notation ? { notation } : {})
     })
   }
 
@@ -230,6 +240,11 @@ export class DynamicViewComputeCtx {
     tags: NonEmptyArray<Tag> | null
     relations: NonEmptyArray<RelationID> | null
     navigateTo: ViewID | null
+    tail: RelationshipArrowType | null
+    head: RelationshipArrowType | null
+    color: Color | null
+    line: RelationshipLineType | null
+    notation: string | null
   } {
     const relationships = unique(this.graph.edgesBetween(source, target).flatMap(e => e.relations))
     if (relationships.length === 0) {
@@ -237,7 +252,12 @@ export class DynamicViewComputeCtx {
         title: null,
         tags: null,
         relations: null,
-        navigateTo: null
+        navigateTo: null,
+        tail: null,
+        head: null,
+        color: null,
+        line: null,
+        notation: null
       }
     }
     const alltags = pipe(
@@ -252,16 +272,6 @@ export class DynamicViewComputeCtx {
     // Most closest relation
     const relation = only(relationships) || relationships.find(r => r.source === source.id && r.target === target.id)
 
-    // This edge represents mutliple relations
-    // We use label if only it is the same for all relations
-    const title = isTruthy(relation?.title) ? relation.title : pipe(
-      relationships,
-      map(r => r.title),
-      filter(isTruthy),
-      unique(),
-      only()
-    )
-
     const navigateTo = !!relation?.navigateTo && relation.navigateTo !== this.view.id ? relation.navigateTo : pipe(
       relationships,
       map(r => r.navigateTo),
@@ -271,11 +281,33 @@ export class DynamicViewComputeCtx {
       only()
     )
 
+    const commonProperties = relationships.reduce((acc, r) => {
+      isTruthy(r.title) && acc.title.push(r.title)
+      isTruthy(r.tail) && acc.tail.push(r.tail)
+      isTruthy(r.head) && acc.head.push(r.head)
+      isTruthy(r.color) && acc.color.push(r.color)
+      isTruthy(r.line) && acc.line.push(r.line)
+
+      return acc
+    }, {
+      title: [] as string[],
+      tail: [] as RelationshipArrowType[],
+      head: [] as RelationshipArrowType[],
+      color: [] as Color[],
+      line: [] as RelationshipLineType[],
+      notation: [] as string[]
+    })
+
     return {
-      title: title ?? null,
       tags,
       relations,
-      navigateTo: navigateTo ?? null
+      navigateTo: navigateTo ?? null,
+      title: pipe(commonProperties.title, unique(), only()) ?? null,
+      tail: pipe(commonProperties.tail, unique(), only()) ?? null,
+      head: pipe(commonProperties.head, unique(), only()) ?? null,
+      color: pipe(commonProperties.color, unique(), only()) ?? null,
+      line: pipe(commonProperties.line, unique(), only()) ?? null,
+      notation: pipe(commonProperties.notation, unique(), only()) ?? null
     }
   }
 }