@likec4/language-server 1.7.2 → 1.7.4

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@likec4/language-server",
   "description": "LikeC4 Language Server",
-  "version": "1.7.2",
+  "version": "1.7.4",
   "license": "MIT",
   "bugs": "https://github.com/likec4/likec4/issues",
   "homepage": "https://likec4.dev",
@@ -91,9 +91,9 @@
     "test:watch": "vitest"
   },
   "dependencies": {
-    "@dagrejs/graphlib": "^2.2.2",
-    "@likec4/core": "1.7.2",
-    "@likec4/log": "1.7.2",
+    "@dagrejs/graphlib": "^2.2.3",
+    "@likec4/core": "1.7.4",
+    "@likec4/log": "1.7.4",
     "@msgpack/msgpack": "^3.0.0-beta2",
     "@smithy/util-base64": "^3.0.0",
     "@total-typescript/ts-reset": "^0.5.1",
@@ -114,9 +114,9 @@
     "vscode-uri": "3.0.8"
   },
   "devDependencies": {
-    "@likec4/icons": "1.7.2",
-    "@likec4/tsconfig": "1.7.2",
-    "@types/node": "^20.14.13",
+    "@likec4/icons": "1.7.4",
+    "@likec4/tsconfig": "1.7.4",
+    "@types/node": "^20.14.14",
     "@types/object-hash": "^3.0.6",
     "@types/string-hash": "^1.1.3",
     "execa": "^9.3.0",

package/src/model/model-parser-where.ts

@@ -19,7 +19,7 @@ const parseEquals = (
   return not ? { neq: value } : { eq: value }
 }
 
-export function parseWhereClause(astNode: ast.WhereExpression): c4.WhereOperator {
+export function parseWhereClause(astNode: ast.WhereExpression): c4.WhereOperator<string, string> {
   switch (true) {
     case ast.isWhereTagEqual(astNode): {
       const tag = astNode.value?.ref?.name

package/src/model/model-parser.ts

@@ -1,7 +1,7 @@
 import { type c4, InvalidModelError, invariant, isNonEmptyArray, nonexhaustive } from '@likec4/core'
 import type { AstNode, LangiumDocument } from 'langium'
 import { AstUtils, CstUtils } from 'langium'
-import { isTruthy, mapToObj } from 'remeda'
+import { isDefined, isTruthy, mapToObj } from 'remeda'
 import stripIndent from 'strip-indent'
 import type { Writable } from 'type-fest'
 import type {
@@ -183,7 +183,7 @@ export class LikeC4ModelParser {
     const source = this.resolveFqn(coupling.source)
     const tags = this.convertTags(astNode) ?? this.convertTags(astNode.body)
     const links = astNode.body?.props.filter(ast.isLinkProperty).map(p => p.value)
-    const kind = astNode.kind?.ref?.name as c4.RelationshipKind
+    const kind = astNode.kind?.ref?.name as (c4.RelationshipKind | undefined)
     const astPath = this.getAstNodePath(astNode)
 
     const bodyProps = mapToObj(
@@ -354,31 +354,41 @@ export class LikeC4ModelParser {
           return acc
         }
         if (ast.isElementStringProperty(prop)) {
-          const value = prop.key === 'description' ? removeIndent(prop.value) : toSingleLine(prop.value)
-          acc.custom[prop.key] = value.trim()
+          if (isDefined(prop.value)) {
+            let value = prop.key === 'description' ? removeIndent(prop.value) : toSingleLine(prop.value)
+            acc.custom[prop.key] = value || ''
+          }
           return acc
         }
         if (ast.isIconProperty(prop)) {
           const value = prop.libicon?.ref?.name ?? prop.value
-          if (isTruthy(value)) {
+          if (isDefined(value)) {
             acc.custom[prop.key] = value as c4.IconUrl
           }
           return acc
         }
         if (ast.isColorProperty(prop)) {
-          acc.custom[prop.key] = prop.value
+          if (isDefined(prop.value)) {
+            acc.custom[prop.key] = prop.value
+          }
           return acc
         }
         if (ast.isShapeProperty(prop)) {
-          acc.custom[prop.key] = prop.value
+          if (isDefined(prop.value)) {
+            acc.custom[prop.key] = prop.value
+          }
           return acc
         }
         if (ast.isBorderProperty(prop)) {
-          acc.custom[prop.key] = prop.value
+          if (isDefined(prop.value)) {
+            acc.custom[prop.key] = prop.value
+          }
           return acc
         }
         if (ast.isOpacityProperty(prop)) {
-          acc.custom[prop.key] = parseAstOpacityProperty(prop)
+          if (isDefined(prop.value)) {
+            acc.custom[prop.key] = parseAstOpacityProperty(prop)
+          }
           return acc
         }
 
@@ -442,22 +452,27 @@ export class LikeC4ModelParser {
     return props.reduce(
       (acc, prop) => {
         if (ast.isRelationStringProperty(prop)) {
-          const value = removeIndent(prop.value)
-          if (isTruthy(value)) {
-            acc.customRelation[prop.key] = value
+          if (isDefined(prop.value)) {
+            acc.customRelation[prop.key] = removeIndent(prop.value) ?? ''
           }
           return acc
         }
         if (ast.isArrowProperty(prop)) {
-          acc.customRelation[prop.key] = prop.value
+          if (isTruthy(prop.value)) {
+            acc.customRelation[prop.key] = prop.value
+          }
           return acc
         }
         if (ast.isColorProperty(prop)) {
-          acc.customRelation[prop.key] = prop.value
+          if (isTruthy(prop.value)) {
+            acc.customRelation[prop.key] = prop.value
+          }
           return acc
         }
         if (ast.isLineProperty(prop)) {
-          acc.customRelation[prop.key] = prop.value
+          if (isTruthy(prop.value)) {
+            acc.customRelation[prop.key] = prop.value
+          }
           return acc
         }
         nonexhaustive(prop)

package/src/model-change/ModelChanges.ts

@@ -1,4 +1,5 @@
 import { invariant, nonexhaustive } from '@likec4/core'
+import { logger } from '@likec4/log'
 import { Location, Range, TextEdit } from 'vscode-languageserver-types'
 import { type ParsedLikeC4LangiumDocument } from '../ast'
 import type { LikeC4ModelLocator } from '../model'
@@ -47,32 +48,36 @@ export class LikeC4ModelChanges {
     const lspConnection = this.services.shared.lsp.Connection
     invariant(lspConnection, 'LSP Connection not available')
     let result: Location | null = null
-    await this.services.shared.workspace.WorkspaceLock.write(async () => {
-      const { doc, edits, modifiedRange } = this.convertToTextEdit(changeView)
-      const textDocument = {
-        uri: doc.textDocument.uri,
-        version: doc.textDocument.version
-      }
-      if (!edits.length) {
-        return
-      }
-      const applyResult = await lspConnection.workspace.applyEdit({
-        label: `LikeC4 - change view ${changeView.viewId}`,
-        edit: {
-          changes: {
-            [textDocument.uri]: edits
+    try {
+      await this.services.shared.workspace.WorkspaceLock.write(async () => {
+        const { doc, edits, modifiedRange } = this.convertToTextEdit(changeView)
+        const textDocument = {
+          uri: doc.textDocument.uri,
+          version: doc.textDocument.version
+        }
+        if (!edits.length) {
+          return
+        }
+        const applyResult = await lspConnection.workspace.applyEdit({
+          label: `LikeC4 - change view ${changeView.viewId}`,
+          edit: {
+            changes: {
+              [textDocument.uri]: edits
+            }
           }
+        })
+        if (!applyResult.applied) {
+          lspConnection.window.showErrorMessage(`Failed to apply changes ${applyResult.failureReason}`)
+          return
+        }
+        result = {
+          uri: textDocument.uri,
+          range: modifiedRange
         }
       })
-      if (!applyResult.applied) {
-        lspConnection.window.showErrorMessage(`Failed to apply changes ${applyResult.failureReason}`)
-        return
-      }
-      result = {
-        uri: textDocument.uri,
-        range: modifiedRange
-      }
-    })
+    } catch (e) {
+      logger.error(`Failed to apply change ${changeView.change.op} ${changeView.viewId}`, e)
+    }
     return result
   }
 
@@ -83,7 +88,7 @@ export class LikeC4ModelChanges {
   } {
     const lookup = this.locator.locateViewAst(viewId)
     if (!lookup) {
-      throw new Error(`View not found: ${viewId}`)
+      throw new Error(`LikeC4ModelChanges: view not found: ${viewId}`)
     }
     switch (change.op) {
       case 'change-element-style': {

package/src/model-change/changeElementStyle.ts

@@ -1,4 +1,4 @@
-import { type Fqn, invariant, isAncestor, type NonEmptyArray, nonNullable, type ViewChanges } from '@likec4/core'
+import { type Fqn, invariant, isAncestor, type NonEmptyArray, nonNullable, type ViewChange } from '@likec4/core'
 import { GrammarUtils } from 'langium'
 import { entries, filter, findLast, isTruthy, last } from 'remeda'
 import { type Range, TextEdit } from 'vscode-languageserver-types'
@@ -8,7 +8,7 @@ import type { LikeC4Services } from '../module'
 
 const { findNodeForKeyword, findNodeForProperty } = GrammarUtils
 
-const asViewStyleRule = (target: string, style: ViewChanges.ChangeElementStyle['style'], indent = 0) => {
+const asViewStyleRule = (target: string, style: ViewChange.ChangeElementStyle['style'], indent = 0) => {
   const indentStr = indent > 0 ? ' '.repeat(indent) : ''
   return [
     indentStr + `style ${target} {`,
@@ -24,7 +24,7 @@ type ChangeElementStyleArg = {
   doc: ParsedLikeC4LangiumDocument
   viewAst: ast.LikeC4View
   targets: NonEmptyArray<Fqn>
-  style: ViewChanges.ChangeElementStyle['style']
+  style: ViewChange.ChangeElementStyle['style']
 }
 
 /**
@@ -116,7 +116,7 @@ export function changeElementStyle(services: LikeC4Services, {
     )
     modifiedRange.start = {
       line: insertPos.line + 1,
-      character: indent + 1
+      character: indent
     }
     modifiedRange.end = {
       line: insertPos.line + linesToInsert.length,
@@ -133,18 +133,12 @@ export function changeElementStyle(services: LikeC4Services, {
         const ruleProp = rule.props.find(p => p.key === key)
         // replace existing  property
         if (ruleProp && ruleProp.$cstNode) {
-          const { range: { start, end } } = nonNullable(
-            findNodeForProperty(ruleProp.$cstNode, 'value'),
-            'cant find value cst node'
-          )
+          const { range: { start, end } } = ruleProp.$cstNode
           includeRange({
             start,
-            end: {
-              line: start.line,
-              character: start.character + value.length
-            }
+            end
           })
-          edits.push(TextEdit.replace({ start, end }, value))
+          edits.push(TextEdit.replace({ start, end }, key + ' ' + value))
           continue
         }
         // insert new style property right after the opening brace

package/src/model-change/changeViewLayout.ts

@@ -35,7 +35,7 @@ export function changeViewLayout(_services: LikeC4Services, {
 
   const insertPos = findNodeForKeyword(viewAst.body.$cstNode, '}')?.range.start
   invariant(insertPos, 'Closing brace not found')
-  const insert = `\n  autoLayout ${newlayout}\n`
+  const insert = `  autoLayout ${newlayout}\n` + ' '.repeat(insertPos.character)
 
   return TextEdit.insert(insertPos, insert)
 }

package/src/model-change/saveManualLayout.ts

@@ -1,4 +1,4 @@
-import { invariant, type ViewChanges } from '@likec4/core'
+import { invariant, type ViewChange } from '@likec4/core'
 import indentString from 'indent-string'
 import { CstUtils, GrammarUtils } from 'langium'
 import { TextEdit } from 'vscode-languageserver-types'
@@ -12,7 +12,7 @@ export type ManualLayoutArg = {
   view: ParsedAstView
   doc: ParsedLikeC4LangiumDocument
   viewAst: ast.LikeC4View
-  layout: ViewChanges.SaveManualLayout['layout']
+  layout: ViewChange.SaveManualLayout['layout']
 }
 
 export function saveManualLayout(_services: LikeC4Services, {

package/src/model-graph/compute-view/__test__/fixture.ts

@@ -1,27 +1,28 @@
-import type {
-  BorderStyle,
-  ComputedView,
-  CustomElementExpr as C4CustomElementExpr,
-  CustomRelationExpr as C4CustomRelationExpr,
-  Element,
-  ElementExpression as C4ElementExpression,
-  ElementKind,
-  ElementShape,
-  ElementWhereExpr,
-  Expression as C4Expression,
-  Fqn,
-  Relation,
-  RelationID,
-  RelationshipArrowType,
-  RelationshipLineType,
-  RelationWhereExpr,
-  Tag,
-  ThemeColor,
-  ViewID,
-  ViewRule,
-  ViewRulePredicate,
-  ViewRuleStyle,
-  WhereOperator
+import {
+  type BorderStyle,
+  type ComputedView,
+  type CustomElementExpr as C4CustomElementExpr,
+  type CustomRelationExpr as C4CustomRelationExpr,
+  type Element,
+  type ElementExpression as C4ElementExpression,
+  type ElementKind,
+  type ElementShape,
+  type ElementWhereExpr,
+  type Expression as C4Expression,
+  type Fqn,
+  type NonEmptyArray,
+  type Relation,
+  type RelationID,
+  type RelationshipArrowType,
+  type RelationshipLineType,
+  type RelationWhereExpr,
+  type Tag,
+  type ThemeColor,
+  type ViewID,
+  type ViewRule,
+  type ViewRulePredicate,
+  type ViewRuleStyle,
+  type WhereOperator
 } from '@likec4/core'
 import { indexBy, isString, map, prop } from 'remeda'
 import { LikeC4ModelGraph } from '../../LikeC4ModelGraph'
@@ -107,19 +108,26 @@ model {
 }
 
  */
+type TestTag = 'old' | 'next' | 'aws' | 'storage' | 'communication' | 'legacy'
+
 const el = ({
   id,
   kind,
   title,
   style,
+  tags,
   ...props
-}: Partial<Omit<Element, 'id' | 'kind'>> & { id: string; kind: string }): Element => ({
+}: Partial<Omit<Element, 'id' | 'kind' | 'tags'>> & {
+  id: string
+  kind: string
+  tags?: NonEmptyArray<TestTag>
+}): Element => ({
   id: id as Fqn,
   kind: kind as ElementKind,
   title: title ?? id,
   description: null,
   technology: null,
-  tags: null,
+  tags: tags as NonEmptyArray<Tag> ?? null,
   links: null,
   style: {
     ...style
@@ -144,7 +152,7 @@ export const fakeElements = {
     id: 'cloud',
     kind: 'system',
     title: 'cloud',
-    tags: ['next' as Tag, 'old' as Tag]
+    tags: ['next', 'old']
   }),
   'cloud.backend': el({
     id: 'cloud.backend',
@@ -171,32 +179,32 @@ export const fakeElements = {
     id: 'cloud.backend.storage',
     kind: 'component',
     title: 'storage',
-    tags: ['old' as Tag]
+    tags: ['storage', 'old']
   }),
   'cloud.frontend.adminPanel': el({
     id: 'cloud.frontend.adminPanel',
     kind: 'component',
     title: 'adminPanel',
-    tags: ['old' as Tag]
+    tags: ['old']
   }),
   'cloud.frontend.dashboard': el({
     id: 'cloud.frontend.dashboard',
     kind: 'component',
     title: 'dashboard',
-    tags: ['next' as Tag]
+    tags: ['next']
   }),
   'amazon': el({
     id: 'amazon',
     kind: 'system',
     title: 'amazon',
-    tags: ['aws' as Tag]
+    tags: ['aws']
   }),
   'amazon.s3': el({
     id: 'amazon.s3',
     kind: 'component',
     title: 's3',
     shape: 'storage',
-    tags: ['aws' as Tag]
+    tags: ['aws', 'storage']
   })
 } satisfies Record<string, Element>
 
@@ -216,6 +224,7 @@ const rel = ({
   line?: RelationshipLineType
   head?: RelationshipArrowType
   tail?: RelationshipArrowType
+  tags?: NonEmptyArray<TestTag>
 }): Relation => ({
   id: `${source}:${target}` as RelationID,
   title: title ?? '',
@@ -238,7 +247,8 @@ export const fakeRelations = [
   rel({
     source: 'cloud.backend.storage',
     target: 'amazon.s3',
-    title: 'uploads'
+    title: 'uploads',
+    tags: ['aws', 'storage', 'legacy']
   }),
   rel({
     source: 'customer',
@@ -248,7 +258,8 @@ export const fakeRelations = [
   rel({
     source: 'cloud.backend.graphql',
     target: 'cloud.backend.storage',
-    title: 'stores'
+    title: 'stores',
+    tags: ['old', 'storage']
   }),
   // rel({
   //   source: 'cloud.backend',
@@ -270,7 +281,8 @@ export const fakeRelations = [
     target: 'cloud.backend.graphql',
     kind: 'graphlql',
     title: 'requests',
-    line: 'solid'
+    line: 'solid',
+    tags: ['next']
   }),
   rel({
     source: 'cloud.frontend.adminPanel',
@@ -278,29 +290,34 @@ export const fakeRelations = [
     kind: 'graphlql',
     title: 'fetches',
     line: 'dashed',
-    tail: 'odiamond'
+    tail: 'odiamond',
+    tags: ['old']
   }),
   rel({
     source: 'cloud',
     target: 'amazon',
     title: 'uses',
     head: 'diamond',
-    tail: 'odiamond'
+    tail: 'odiamond',
+    tags: ['aws']
   }),
   rel({
     source: 'cloud.backend',
     target: 'email',
-    title: 'schedule'
+    title: 'schedule',
+    tags: ['communication']
   }),
   rel({
     source: 'cloud',
     target: 'email',
-    title: 'uses'
+    title: 'uses',
+    tags: ['communication']
   }),
   rel({
     source: 'email',
     target: 'cloud',
-    title: 'notifies'
+    title: 'notifies',
+    tags: ['communication']
   })
 ]
 
@@ -380,7 +397,10 @@ export function $customRelation(
   }
 }
 
-export function $where(expr: Expression | C4Expression, operator: WhereOperator): ElementWhereExpr | RelationWhereExpr {
+export function $where(
+  expr: Expression | C4Expression,
+  operator: WhereOperator<TestTag, string>
+): ElementWhereExpr | RelationWhereExpr {
   return {
     where: {
       expr: $expr(expr) as any,

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

@@ -5,10 +5,13 @@ import type {
   Element,
   ElementPredicateExpression,
   ElementView,
+  NonEmptyArray,
   Relation,
   RelationPredicateExpression,
   RelationshipArrowType,
+  RelationshipKind,
   RelationshipLineType,
+  Tag,
   ThemeColor,
   ViewRulePredicate
 } from '@likec4/core'
@@ -193,16 +196,21 @@ export class ComputeCtx {
         relations: relations.map(r => r.id)
       }
 
-      let relation: Pick<Relation, 'title' | 'description' | 'technology' | 'color' | 'line' | 'head' | 'tail'> | {
-        // TODO refactor with type-fest
-        title: string
-        description?: string | undefined
-        technology?: string | undefined
-        color?: ThemeColor | undefined
-        line?: RelationshipLineType | undefined
-        head?: RelationshipArrowType | undefined
-        tail?: RelationshipArrowType | undefined
-      } | undefined
+      let relation:
+        | Pick<Relation, 'title' | 'kind' | 'description' | 'technology' | 'color' | 'line' | 'head' | 'tail' | 'tags'>
+        | {
+          // TODO refactor with type-fest
+          title: string
+          description?: string | undefined
+          technology?: string | undefined
+          kind?: RelationshipKind | undefined
+          color?: ThemeColor | undefined
+          line?: RelationshipLineType | undefined
+          head?: RelationshipArrowType | undefined
+          tail?: RelationshipArrowType | undefined
+          tags?: NonEmptyArray<Tag>
+        }
+        | undefined
       if (relations.length === 1) {
         relation = relations[0]
       } else {
@@ -217,10 +225,13 @@ export class ComputeCtx {
           if (r.color && acc.color !== r.color) {
             acc.color = undefined
           }
-          if (r.head && acc.head !== r.kind) {
+          if (r.kind && acc.kind !== r.kind) {
+            acc.kind = undefined
+          }
+          if (r.head && acc.head !== r.head) {
             acc.head = undefined
           }
-          if (r.tail && acc.tail !== r.kind) {
+          if (r.tail && acc.tail !== r.tail) {
             acc.tail = undefined
           }
           if (r.line && acc.line !== r.line) {
@@ -240,32 +251,27 @@ export class ComputeCtx {
           title: first(flatMap(relations, r => isTruthy(r.title) ? r.title : [])) ?? '[...]',
           description: first(flatMap(relations, r => isTruthy(r.description) ? r.description : [])),
           technology: first(flatMap(relations, r => isTruthy(r.technology) ? r.technology : [])),
+          kind: first(flatMap(relations, r => isTruthy(r.kind) ? r.kind : [])),
           head: first(flatMap(relations, r => isTruthy(r.head) ? r.head : [])),
           tail: first(flatMap(relations, r => isTruthy(r.tail) ? r.tail : [])),
           color: first(flatMap(relations, r => isTruthy(r.color) ? r.color : [])),
           line: first(flatMap(relations, r => isTruthy(r.line) ? r.line : []))
         })
-        // return Object.assign(
-        //   edge,
-        //   isTruthy(shared.title) && { label: shared.title },
-        //   isTruthy(shared.description) && { description: shared.description },
-        //   isTruthy(shared.technology) && { technology: shared.technology },
-        //   shared.color && { color: shared.color },
-        //   shared.line && { line: shared.line },
-        //   shared.head && { head: shared.head },
-        //   shared.tail && { tail: shared.tail }
-        // )
       }
 
+      const tags = unique(flatMap(relations, r => r.tags ?? []))
+
       return Object.assign(
         edge,
         isTruthy(relation.title) && { label: relation.title },
         isTruthy(relation.description) && { description: relation.description },
         isTruthy(relation.technology) && { description: relation.technology },
+        isTruthy(relation.kind) && { kind: relation.kind },
         relation.color && { color: relation.color },
         relation.line && { line: relation.line },
         relation.head && { head: relation.head },
-        relation.tail && { tail: relation.tail }
+        relation.tail && { tail: relation.tail },
+        hasAtLeast(tags, 1) && { tags }
       )
     })
   }

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

@@ -3,9 +3,11 @@ import type {
   ComputedEdge,
   DynamicView,
   Element,
+  NonEmptyArray,
   RelationID,
   RelationshipArrowType,
   RelationshipLineType,
+  Tag,
   ThemeColor
 } from '@likec4/core'
 import {
@@ -20,7 +22,7 @@ import {
   parentFqn,
   StepEdgeId
 } from '@likec4/core'
-import { isTruthy, unique } from 'remeda'
+import { hasAtLeast, isTruthy, map, unique } from 'remeda'
 import { calcViewLayoutHash } from '../../view-utils/view-hash'
 import type { LikeC4ModelGraph } from '../LikeC4ModelGraph'
 import { applyCustomElementProperties } from '../utils/applyCustomElementProperties'
@@ -41,6 +43,7 @@ export namespace DynamicViewComputeCtx {
     tail?: RelationshipArrowType
     relations: RelationID[]
     isBackward: boolean
+    tags?: NonEmptyArray<Tag>
   }
 }
 
@@ -81,15 +84,16 @@ export class DynamicViewComputeCtx {
       this.explicits.add(source)
       this.explicits.add(target)
 
-      const { title, relations } = this.findRelations(source, target)
+      const { title, relations, tags } = this.findRelations(source, target)
 
       this.steps.push({
         ...step,
         source,
         target,
         title: isTruthy(stepTitle) ? stepTitle : title,
-        relations,
-        isBackward: isBackward ?? false
+        relations: relations ?? [],
+        isBackward: isBackward ?? false,
+        ...(tags ? { tags } : {})
       })
     }
 
@@ -168,12 +172,20 @@ export class DynamicViewComputeCtx {
 
   private findRelations(source: Element, target: Element): {
     title: string | null
-    relations: RelationID[]
+    tags: NonEmptyArray<Tag> | null
+    relations: NonEmptyArray<RelationID> | null
   } {
-    const relationships = this.graph.edgesBetween(source, target).flatMap(e => e.relations)
-    const relations = unique(relationships.map(r => r.id))
+    const relationships = unique(this.graph.edgesBetween(source, target).flatMap(e => e.relations))
+    const alltags = unique(relationships.flatMap(r => r.tags ?? []))
+    const tags = hasAtLeast(alltags, 1) ? alltags : null
+
+    const relations = hasAtLeast(relationships, 1) ? map(relationships, r => r.id) : null
     if (relationships.length === 0) {
-      return { title: null, relations }
+      return {
+        title: null,
+        tags,
+        relations
+      }
     }
     let relation
     if (relationships.length === 1) {
@@ -185,6 +197,7 @@ export class DynamicViewComputeCtx {
     if (relation && isTruthy(relation.title)) {
       return {
         title: relation.title,
+        tags,
         relations
       }
     }
@@ -195,12 +208,14 @@ export class DynamicViewComputeCtx {
     if (labels.length === 1) {
       return {
         title: labels[0]!,
+        tags,
         relations
       }
     }
 
     return {
       title: null,
+      tags,
       relations
     }
   }

package/src/model-graph/utils/applyCustomElementProperties.ts

@@ -1,6 +1,6 @@
 import type { ComputedNode, ViewRule } from '@likec4/core'
 import { Expr, nonNullable } from '@likec4/core'
-import { isEmpty, isNonNullish, pickBy } from 'remeda'
+import { isEmpty, isNonNullish, isNullish, omitBy, pickBy } from 'remeda'
 import { elementExprToPredicate } from './elementExpressionToPredicate'
 
 export function applyCustomElementProperties(_rules: ViewRule[], _nodes: ComputedNode[]) {
@@ -14,13 +14,12 @@ export function applyCustomElementProperties(_rules: ViewRule[], _nodes: Compute
       custom: { expr, ...props }
     } of rules
   ) {
+    const { border, opacity, ...rest } = omitBy(props, isNullish)
     const satisfies = elementExprToPredicate(expr)
     nodes.forEach((node, i) => {
       if (!satisfies(node)) {
         return
       }
-
-      const { border, opacity, ...rest } = pickBy(props, isNonNullish)
       if (!isEmpty(rest)) {
         node = {
           ...node,

package/src/model-graph/utils/applyCustomRelationProperties.ts

@@ -1,6 +1,6 @@
 import type { ComputedEdge, ComputedNode, Element, ViewRule } from '@likec4/core'
 import { Expr, nonexhaustive } from '@likec4/core'
-import { isEmpty } from 'remeda'
+import { isEmpty, isNullish, omitBy } from 'remeda'
 import { elementExprToPredicate } from './elementExpressionToPredicate'
 
 function relationExpressionToPredicates(
@@ -46,27 +46,11 @@ export function applyCustomRelationProperties(
   }
   for (
     const {
-      customRelation: { relation, title, ...props }
+      customRelation: { relation, title, ...customprops }
     } of rules
   ) {
-    if (isEmpty(props) && !title) {
-      continue
-    }
+    const props = omitBy(customprops, isNullish)
     const satisfies = relationExpressionToPredicates(relation)
-    // const isSource = elementExprToPredicate(relation.source)
-    // const isTarget = elementExprToPredicate(relation.target)
-    // const satisfies = (edge: ComputedEdge) => {
-    //   const source = nodes.find(n => n.id === edge.source)
-    //   const target = nodes.find(n => n.id === edge.target)
-    //   if (!source || !target) {
-    //     return false
-    //   }
-    //   let result = isSource(source) && isTarget(target)
-    //   if (!result && relation.isBidirectional) {
-    //     result = isSource(target) && isTarget(source)
-    //   }
-    //   return result
-    // }
     edges.forEach((edge, i) => {
       const source = nodes.find(n => n.id === edge.source)
       const target = nodes.find(n => n.id === edge.target)

package/src/protocol.ts

@@ -5,7 +5,7 @@ import type {
   LikeC4ComputedModel,
   LikeC4Model,
   RelationID,
-  ViewChangeOp,
+  ViewChange,
   ViewID
 } from '@likec4/core'
 import { NotificationType, RequestType, RequestType0 } from 'vscode-jsonrpc'
@@ -53,20 +53,9 @@ export const locate = new RequestType<LocateParams, Location | null, void>('like
 export type LocateRequest = typeof locate
 // #endregion
 
-export namespace ChangeView {
-  export interface ChangeAutoLayout {
-    op: 'change-autolayout'
-    layout: AutoLayoutDirection
-  }
-}
-
-export type ChangeView =
-  | ChangeView.ChangeAutoLayout
-  | ViewChangeOp
-
 export interface ChangeViewRequestParams {
   viewId: ViewID
-  change: ChangeView
+  change: ViewChange
 }
 export const changeView = new RequestType<ChangeViewRequestParams, Location | null, void>('likec4/change-view')
 export type ChangeViewRequest = typeof changeView

package/src/references/scope-provider.ts

@@ -85,6 +85,9 @@ export class LikeC4ScopeProvider extends DefaultScopeProvider {
   override getScope(context: ReferenceInfo): Scope {
     try {
       const referenceType = this.reflection.getReferenceType(context)
+      if (referenceType !== ast.Element) {
+        return this.getGlobalScope(referenceType)
+      }
       try {
         const container = context.container
         if (ast.isFqnElementRef(container) && context.property === 'el') {
@@ -102,7 +105,7 @@ export class LikeC4ScopeProvider extends DefaultScopeProvider {
         }
         return this.computeScope(context)
       } catch (e) {
-        logger.error(e)
+        logger.warn(e)
         return this.getGlobalScope(referenceType)
       }
     } catch (e) {