collabmd 0.1.44 → 0.1.46

package/src/client/domain/excalidraw-collaboration.js

@@ -1,7 +1,5 @@
 import { generatePeerId, normalizeUserName } from './room.js';
 
-export { generatePeerId };
-
 export const USER_COLOR_PALETTE = [
   '#ef4444', '#f97316', '#eab308', '#22c55e', '#06b6d4',
   '#3b82f6', '#8b5cf6', '#ec4899', '#14b8a6', '#f59e0b',

package/src/client/domain/room.js

@@ -9,6 +9,32 @@ const USER_COLORS = [
 ];
 export const USER_NAME_MAX_LENGTH = 24;
 const LOCAL_USER_ID_STORAGE_KEY = 'collabmd-user-id';
+const HEX_COLOR_RE = /^#(?:[\da-f]{3}|[\da-f]{6})$/iu;
+
+function colorChannelToLinear(value) {
+  const channel = value / 255;
+  return channel <= 0.04045
+    ? channel / 12.92
+    : ((channel + 0.055) / 1.055) ** 2.4;
+}
+
+function getColorLuminance(color) {
+  const hex = color.length === 4
+    ? color.slice(1).split('').map((channel) => channel.repeat(2)).join('')
+    : color.slice(1);
+  const [red, green, blue] = hex.match(/../gu).map((channel) => parseInt(channel, 16));
+  return (
+    0.2126 * colorChannelToLinear(red)
+    + 0.7152 * colorChannelToLinear(green)
+    + 0.0722 * colorChannelToLinear(blue)
+  );
+}
+
+function getContrastRatio(firstLuminance, secondLuminance) {
+  const lighter = Math.max(firstLuminance, secondLuminance);
+  const darker = Math.min(firstLuminance, secondLuminance);
+  return (lighter + 0.05) / (darker + 0.05);
+}
 
 function pickRandom(items) {
   return items[Math.floor(Math.random() * items.length)];
@@ -73,6 +99,18 @@ export function normalizeUserName(value) {
   return normalized || null;
 }
 
+export function getUserAvatarTextColor(value) {
+  const color = String(value ?? '').trim();
+  if (!HEX_COLOR_RE.test(color)) {
+    return '#fff';
+  }
+
+  const luminance = getColorLuminance(color.toLowerCase());
+  const whiteContrast = getContrastRatio(1, luminance);
+  const inkContrast = getContrastRatio(0, luminance);
+  return inkContrast >= whiteContrast ? '#000' : '#fff';
+}
+
 export function createRandomUser(preferredName = null) {
   const color = pickRandom(USER_COLORS);
 

package/src/client/domain/runtime-paths.js

@@ -86,6 +86,7 @@ export function getClientRuntimeConfig() {
       unavailableReason: 'ripgrep search is unavailable',
       version: '',
     },
+    structurizrEnabled: false,
     wikiLinkAutoCreate: true,
     wsBasePath: '/ws',
     ...(window.__COLLABMD_CONFIG__ ?? {}),
@@ -143,12 +144,32 @@ export function resolveApiUrl(pathValue = '/', config = getClientRuntimeConfig()
   return resolveAppPath(`/api${normalizedPath.startsWith('/') ? normalizedPath : `/${normalizedPath}`}`, config);
 }
 
-export function resolveWsBaseUrl(config = getClientRuntimeConfig()) {
-  const params = new URLSearchParams(window.location.search);
-  const customServerUrl = params.get('server');
+export function resolveWsServerOverride(config = getClientRuntimeConfig()) {
+  if (!['development', 'test'].includes(config.environment)) {
+    return '';
+  }
+
+  const customServerUrl = new URLSearchParams(window.location.search).get('server');
+  if (!customServerUrl) {
+    return '';
+  }
+
+  try {
+    const parsedUrl = new URL(customServerUrl, window.location.origin);
+    if (!['http:', 'https:', 'ws:', 'wss:'].includes(parsedUrl.protocol)) {
+      return '';
+    }
 
-  if (customServerUrl) {
-    return trimTrailingSlash(customServerUrl);
+    return trimTrailingSlash(parsedUrl.toString());
+  } catch {
+    return '';
+  }
+}
+
+export function resolveWsBaseUrl(config = getClientRuntimeConfig()) {
+  const serverOverride = resolveWsServerOverride(config);
+  if (serverOverride) {
+    return serverOverride;
   }
 
   if (config.publicWsBaseUrl) {

package/src/client/domain/structurizr-language.js

@@ -0,0 +1,99 @@
+import { LanguageDescription, LanguageSupport, StreamLanguage } from '@codemirror/language';
+
+const KEYWORDS = new Set([
+  'animation',
+  'autoLayout',
+  'component',
+  'configuration',
+  'container',
+  'custom',
+  'decisions',
+  'deployment',
+  'description',
+  'dynamic',
+  'element',
+  'filtered',
+  'group',
+  'include',
+  'image',
+  'model',
+  'person',
+  'perspectives',
+  'properties',
+  'relationship',
+  'relationships',
+  'styles',
+  'systemContext',
+  'systemLandscape',
+  'system',
+  'theme',
+  'views',
+  'workspace',
+]);
+
+function readWord(stream) {
+  const match = stream.match(/[A-Za-z_][\w.-]*/u, false);
+  if (!match) {
+    return '';
+  }
+
+  stream.match(/[A-Za-z_][\w.-]*/u);
+  return match[0];
+}
+
+const structurizrStreamLanguage = StreamLanguage.define({
+  languageData: {
+    commentTokens: { line: '//' },
+  },
+  token(stream) {
+    if (stream.eatSpace()) {
+      return null;
+    }
+
+    if (stream.match('//')) {
+      stream.skipToEnd();
+      return 'comment';
+    }
+
+    if (stream.match(/!\w+/u)) {
+      return 'meta';
+    }
+
+    if (stream.match(/"(?:[^"\\]|\\.)*"?/u)) {
+      return 'string';
+    }
+
+    if (stream.match(/\b\d+(?:\.\d+)?\b/u)) {
+      return 'number';
+    }
+
+    if (stream.match(/[-=]?>|[{}[\]():,=]/u)) {
+      return 'operator';
+    }
+
+    const word = readWord(stream);
+    if (word) {
+      if (KEYWORDS.has(word)) {
+        return 'keyword';
+      }
+
+      if (/^[A-Z][A-Z0-9_]*$/u.test(word)) {
+        return 'typeName';
+      }
+
+      return 'variableName';
+    }
+
+    stream.next();
+    return null;
+  },
+});
+
+export const structurizrLanguage = new LanguageSupport(structurizrStreamLanguage);
+
+export const structurizrLanguageDescription = LanguageDescription.of({
+  alias: ['structurizr', 'structurizr-dsl'],
+  extensions: ['dsl'],
+  name: 'Structurizr DSL',
+  support: structurizrLanguage,
+});

package/src/client/domain/vault-paths.js

@@ -3,6 +3,7 @@ import {
   isDrawioFilePath,
   isMermaidFilePath,
   isPlantUmlFilePath,
+  isStructurizrFilePath,
   stripVaultFileExtension,
 } from '../../domain/file-kind.js';
 
@@ -135,3 +136,50 @@ export function createPlantUmlStarter(filePath) {
     path: nextPath,
   };
 }
+
+export function createStructurizrStarter(filePath) {
+  const normalizedPath = normalizeVaultPathInput(filePath);
+  const nextPath = isStructurizrFilePath(normalizedPath)
+    ? normalizedPath
+    : `${normalizedPath}.dsl`;
+  return {
+    content: [
+      'workspace "CollabMD Example" "A small Structurizr workspace" {',
+      '  model {',
+      '    user = person "User" "Uses the system"',
+      '    system = softwareSystem "Example System" "The system being documented" {',
+      '      web = container "Web Application" "Serves the user interface" "JavaScript" {',
+      '        home = component "Home Page" "Shows the landing page" "React"',
+      '        editor = component "Editor" "Edits workspace content" "React"',
+      '      }',
+      '      api = container "API" "Handles requests" "Node.js"',
+      '    }',
+      '    user -> system "Uses"',
+      '    web -> api "Calls" "HTTPS/JSON"',
+      '    home -> editor "Links to"',
+      '  }',
+      '  views {',
+      '    systemContext system "Context" {',
+      '      include *',
+      '      autoLayout',
+      '    }',
+      '    container system "Containers" {',
+      '      include *',
+      '      autoLayout',
+      '    }',
+      '    component web "Components" {',
+      '      include *',
+      '      autoLayout',
+      '    }',
+      '    styles {',
+      '      element "Person" {',
+      '        shape person',
+      '      }',
+      '    }',
+      '  }',
+      '}',
+      '',
+    ].join('\n'),
+    path: nextPath,
+  };
+}