@coffic/cosy-ui 0.7.2 → 0.8.6

package/dist/vue/utils/language.ts

@@ -0,0 +1,121 @@
+import { getRelativeLocaleUrl } from 'astro:i18n';
+import type { AstroGlobal } from 'astro';
+import { cosyLogger } from '../cosy';
+
+// 默认语言
+export const DEFAULT_LANGUAGE = 'en';
+
+/**
+ * 语言工具模块
+ *
+ * 提供语言相关的工具函数，用于多语言支持
+ */
+export class LanguageUtil {
+  static getRelativeLink(locale: string, astro: AstroGlobal): string {
+    const debug = false;
+    const currentLocale = astro.currentLocale;
+    const originalPath = astro.originPathname;
+    const result = getRelativeLocaleUrl(
+      locale,
+      originalPath.replaceAll('/' + currentLocale, '')
+    );
+
+    if (debug) {
+      cosyLogger.debug(
+        `getRelativeLink: locale=${locale}, currentPath=${originalPath}, currentLocale=${currentLocale}, result=${result}`
+      );
+    }
+
+    return result;
+  }
+
+  static getLanguageName(code: string | undefined): string {
+    switch (code) {
+      case 'en':
+        return 'English';
+      case 'zh-cn':
+        return '简体中文';
+      case 'zh':
+        return '中文';
+      case undefined:
+      default:
+        return 'not known';
+    }
+  }
+
+  /**
+   * 获取当前语言
+   * @param astro Astro全局对象
+   * @returns 当前应使用的语言代码
+   */
+  static getCurrentLanguage(astro: AstroGlobal): string {
+    // 尝试从Astro全局对象中获取语言
+    const astroLang = astro.currentLocale;
+    if (astroLang) {
+      return astroLang;
+    }
+    // 尝试从URL中获取语言
+    const urlLang = this.getLanguageFromURL(astro.url.pathname);
+    if (urlLang) {
+      return urlLang;
+    }
+
+    // 尝试从浏览器设置中获取语言
+    const browserLang = this.getLanguageFromBrowser();
+    if (browserLang) {
+      return browserLang;
+    }
+
+    // 尝试从Astro全局对象中获取语言
+    const preferredLocale = astro.preferredLocale;
+    if (preferredLocale) {
+      return preferredLocale;
+    }
+
+    // 如果无法检测，返回默认语言
+    return DEFAULT_LANGUAGE;
+  }
+
+  /**
+   * 从URL中提取语言代码
+   * @param url 当前URL
+   * @returns 从URL中提取的语言代码，如果无法提取则返回undefined
+   */
+  private static getLanguageFromURL(url: string): string | undefined {
+    let currentUrl = url;
+
+    if (currentUrl === undefined) {
+      if (typeof window === 'undefined') return undefined;
+      currentUrl = window.location.href;
+    }
+
+    // 尝试从路径中提取语言代码
+    // 例如: /zh-cn/components/button
+    const pathMatch = currentUrl.match(/^\/([\w-]+)\//);
+    if (pathMatch) {
+      return pathMatch[1];
+    }
+
+    // 尝试从查询参数中提取语言代码
+    // 例如: ?lang=zh-cn
+    const urlParams = new URLSearchParams(currentUrl.split('?')[1]);
+    const langParam = urlParams.get('lang');
+    if (langParam) {
+      return langParam;
+    }
+
+    return undefined;
+  }
+
+  /**
+   * 从浏览器设置中获取首选语言
+   * @returns 从浏览器设置中获取的语言代码，如果无法获取则返回undefined
+   */
+  private static getLanguageFromBrowser(): string | undefined {
+    if (typeof navigator === 'undefined') return undefined;
+
+    // 获取浏览器语言
+    const browserLang = navigator.language.toLowerCase();
+    return browserLang;
+  }
+}

package/dist/vue/utils/link.ts

@@ -0,0 +1,250 @@
+import { cosyLogger } from '../cosy';
+
+export class LinkUtil {
+  // 从 astro.config.ts 中获取基础路径
+  static getBaseUrl = (): string => {
+    return import.meta.env.BASE_URL;
+  };
+
+  // 生成带基础路径的完整 URL
+  static createUrl = (path: string): string => {
+    const baseUrl = LinkUtil.getBaseUrl();
+    // 如果路径以 '/' 开头，去除开头的 '/'
+    if (path.startsWith('/')) {
+      path = path.substring(1);
+    }
+
+    return `${baseUrl}${path}`;
+  };
+
+  /**
+   * 规范化语言代码
+   * @param lang - 语言代码
+   * @returns 规范化后的语言代码
+   */
+  static normalizeLanguage(lang: string): string {
+    const normalizedLang = lang.toLowerCase().replace('zh-CN', 'zh-cn');
+    if (normalizedLang.length == 0) {
+      console.error('lang is empty');
+      return 'en';
+    }
+    return normalizedLang;
+  }
+
+  static getHomeLink(lang: string): string {
+    return `${this.getBaseUrl}/${lang}`;
+  }
+
+  static getLessonsLink(lang: string): string {
+    return `/${lang}/lessons`;
+  }
+
+  static getExperimentsLink(lang: string): string {
+    return `/${lang}/experiments`;
+  }
+
+  static getExperimentLink(lang: string, experimentId: string): string {
+    if (experimentId.endsWith(lang)) {
+      return `/${lang}/experiments/${experimentId.replace(`${lang}`, '')}`;
+    } else {
+      const idWithoutLang = experimentId.replace(`${lang}/`, '');
+      return `/${lang}/experiments/${idWithoutLang}`;
+    }
+  }
+
+  static getCoursesLink(lang: string): string {
+    return `/${lang}/courses`;
+  }
+
+  static getBlogsLink(lang: string): string {
+    return `/${lang}/blogs`;
+  }
+
+  static getLessonLink(lang: string, lessonId: string): string {
+    if (lessonId.endsWith(lang)) {
+      return `/${lang}/lessons/${lessonId.replace(`${lang}`, '')}`;
+    } else {
+      const idWithoutLang = lessonId.replace(`${lang}/`, '');
+      return `/${lang}/lessons/${idWithoutLang}`;
+    }
+  }
+
+  static getTagLink(lang: string, tagName: string): string {
+    return `/${lang}/blogs/tag/${tagName}`;
+  }
+
+  static getBlogLink(blogId: string, lang: string): string {
+    const debug = false;
+    const blogIdWithoutLang = blogId.replace(`${lang}/`, '');
+
+    if (debug) {
+      cosyLogger.info(`获取博客文档链接，博客文档ID: ${blogId}`);
+    }
+
+    return `/${lang}/blogs/${blogIdWithoutLang}`;
+  }
+
+  static getCourseLink(courseId: string): string {
+    const debug = false;
+    const lang = courseId.split('/')[0];
+    const courseIdWithoutLang = courseId.replace(`${lang}/`, '');
+
+    if (debug) {
+      cosyLogger.info(`获取课程文档链接，课程文档ID: ${courseId}`);
+    }
+
+    return LinkUtil.createUrl(`/${lang}/courses/${courseIdWithoutLang}`);
+  }
+
+  static getMetaLink(lang: string, slug: string): string {
+    return `/${this.normalizeLanguage(lang)}/meta/${slug}`;
+  }
+
+  static getSigninLink(lang: string): string {
+    return `/${this.normalizeLanguage(lang)}/signin`;
+  }
+
+  static getAuthCallbackCookieLink(lang: string): string {
+    return `/${this.normalizeLanguage(lang)}/auth/callback_cookie`;
+  }
+
+  static getAuthCallbackTokenLink(lang: string): string {
+    return `/${this.normalizeLanguage(lang)}/auth/callback_token`;
+  }
+
+  static getAuthAccountLink(lang: string): string {
+    return `/${this.normalizeLanguage(lang)}/auth/account`;
+  }
+
+  static getDashboardUrl(lang: string): string {
+    return `/${this.normalizeLanguage(lang)}/auth/dashboard`;
+  }
+
+  static getAuthErrorLink(lang: string): string {
+    return `/${this.normalizeLanguage(lang)}/auth/error`;
+  }
+
+  static getPrivacyLink(lang: string): string {
+    return this.getMetaLink(lang, 'privacy');
+  }
+
+  static getTermsLink(lang: string): string {
+    return this.getMetaLink(lang, 'terms');
+  }
+
+  static getAboutLink(lang: string): string {
+    return this.getMetaLink(lang, 'about');
+  }
+
+  /**
+   * 根据ID生成链接
+   *
+   * 该函数根据文档ID生成对应的链接路径。
+   *
+   * @param {string} id - 文档ID, 例如 'courses/zh-cn/supervisor/index.md'
+   * @returns {string} 返回生成的链接路径
+   * @example
+   * // 例如：
+   * // id=courses/zh-cn/supervisor/index.md，则返回/zh-cn/courses/supervisor
+   * // id=courses/en/supervisor/index.md，则返回/en/courses/supervisor
+   */
+  static getLink(id: string): string {
+    const category = id.split('/')[0];
+    const lang = id.split('/')[1];
+    const path = id.split('/').slice(2).join('/');
+
+    const link = `/${lang}/${category}/${path}`;
+    return link.replace(/\/+/g, '/');
+  }
+
+  /**
+   * 根据分类生成顶级链接
+   *
+   * @param {string} category - 分类名称
+   * @param {string} lang - 语言代码，例如 'zh-cn', 'en'
+   * @returns {string} 返回生成的顶级链接路径
+   * @example
+   * // 例如：
+   * // category=courses, lang=zh-cn，则返回/zh-cn/courses
+   * // category=courses, lang=en，则返回/en/courses
+   */
+  static getTopLevelLink(category: string, lang: string): string {
+    return `/${lang}/${category}`;
+  }
+
+  /**
+   * 处理首页重定向
+   * @param locale - 语言代码
+   * @returns 规范化的语言代码
+   */
+  static homeRedirect(locale: string): string {
+    return locale || 'en';
+  }
+
+  /**
+   * 检查是否为首页路径
+   * @param pathname - 路径
+   * @returns 是否为首页
+   */
+  static isHomePath(pathname: string): boolean {
+    return pathname === '/' || pathname === '';
+  }
+
+  static isHomeLink(path: string, lang: string): boolean {
+    return path === `/${lang}` || path === `/${lang}/`;
+  }
+
+  static isLessonsLink(path: string, lang: string): boolean {
+    return (
+      path === `/${lang}/lessons` ||
+      path === `/${lang}/lessons/` ||
+      path.startsWith(`/${lang}/lessons/`)
+    );
+  }
+
+  static isExperimentsLink(path: string, lang: string): boolean {
+    return (
+      path === `/${lang}/experiments` ||
+      path === `/${lang}/experiments/` ||
+      path.startsWith(`/${lang}/experiments/`)
+    );
+  }
+
+  static isCoursesLink(path: string, lang: string): boolean {
+    return (
+      path === `/${lang}/courses` ||
+      path === `/${lang}/courses/` ||
+      path.startsWith(`/${lang}/courses/`)
+    );
+  }
+
+  static isBlogsLink(path: string, lang: string): boolean {
+    return (
+      path === `/${lang}/blogs` ||
+      path === `/${lang}/blogs/` ||
+      path.startsWith(`/${lang}/blogs/`)
+    );
+  }
+
+  static getOAuthSuccessLink(currentOrigin: string): string {
+    return `${currentOrigin}/api/callback_success`;
+  }
+
+  static getOAuthErrorLink(currentOrigin: string): string {
+    return `${currentOrigin}/api/callback_error`;
+  }
+
+  static getLoginLink(currentOrigin: string): string {
+    return `${currentOrigin}/api/login`;
+  }
+
+  static getActiveLink(currentLink: string, links: string[]): string {
+    let activeLink = '';
+    for (const link of links) {
+      if (currentLink.startsWith(link) && link.length > activeLink.length) {
+        activeLink = link;
+      }
+    }
+    return activeLink;
+  }
+}

package/dist/vue/utils/logger.ts

@@ -0,0 +1,136 @@
+type LogLevel = 'debug' | 'info' | 'warn' | 'error';
+
+// 控制是否显示时间戳
+const SHOW_TIMESTAMP = false;
+
+// ANSI 颜色代码
+const colors = {
+  reset: '\x1b[0m',
+  debug: '\x1b[36m', // 青色
+  info: '\x1b[32m', // 绿色
+  warn: '\x1b[33m', // 黄色
+  error: '\x1b[31m', // 红色
+  gray: '\x1b[90m', // 灰色用于时间戳
+};
+
+export class Logger {
+  private topic: string = '';
+
+  private formatArray(arr: any[]): string {
+    const MAX_LINES = 70;
+    const MAX_LENGTH = 100;
+
+    const truncateString = (str: string): string => {
+      return str.length > MAX_LENGTH ? str.slice(0, MAX_LENGTH) + '...' : str;
+    };
+
+    const truncateObject = (obj: any): any => {
+      if (typeof obj !== 'object' || obj === null) {
+        return typeof obj === 'string' ? truncateString(obj) : obj;
+      }
+
+      const result: any = Array.isArray(obj) ? [] : {};
+      for (const [key, value] of Object.entries(obj)) {
+        result[key] =
+          typeof value === 'string'
+            ? truncateString(value)
+            : typeof value === 'object'
+              ? truncateObject(value)
+              : value;
+      }
+      return result;
+    };
+
+    const items = arr.slice(0, MAX_LINES).map((item) => {
+      const truncatedItem = truncateObject(item);
+      // 使用2个空格缩进，并在每行前添加 "  • "
+      const jsonString = JSON.stringify(truncatedItem, null, 2)
+        .split('\n')
+        .map((line, index) => (index === 0 ? `  • ${line}` : `    ${line}`))
+        .join('\n');
+      return jsonString;
+    });
+
+    let output = items.join('\n');
+    if (arr.length > MAX_LINES) {
+      const remainingCount = arr.length - MAX_LINES;
+      output += `\n  ⋮ ... and ${remainingCount} more items`;
+    }
+
+    return output;
+  }
+
+  private log(
+    level: LogLevel,
+    message: string | object | any[],
+    newLine: boolean = false
+  ) {
+    // 使用本地时间，并格式化为 HH:mm:ss 格式
+    const timestamp = new Date().toLocaleTimeString('zh-CN', {
+      hour12: false,
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit',
+    });
+
+    const formattedMessage = Array.isArray(message)
+      ? this.formatArray(message)
+      : typeof message === 'object'
+        ? JSON.stringify(message, null, 2)
+        : message;
+
+    const timestampPart = SHOW_TIMESTAMP
+      ? `${colors.gray}${timestamp}${colors.reset} `
+      : '';
+
+    const emoji = {
+      debug: '🔍',
+      info: '🐳',
+      warn: '🚨',
+      error: '❌',
+    }[level];
+
+    if (newLine) {
+      console.log('');
+    }
+
+    console.log(
+      timestampPart +
+        `${colors[level]}${emoji} ` +
+        this.getPrefix() +
+        `${level.toUpperCase()}${colors.reset} ` +
+        `${colors.gray}:${colors.reset} ` +
+        `${colors[level]}${formattedMessage}${colors.reset}`
+    );
+  }
+
+  private getPrefix() {
+    return this.topic ? `[${this.topic}] ` : '';
+  }
+
+  constructor(topic: string = '') {
+    this.topic = topic;
+  }
+
+  debug(message: string | object) {
+    this.log('debug', message);
+  }
+
+  info(message: string | object) {
+    this.log('info', message);
+  }
+
+  warn(message: string | object) {
+    this.log('warn', message);
+  }
+
+  error(message: string | object) {
+    this.log('error', message, true);
+  }
+
+  array(title: string, arr: any[]) {
+    this.log('info', title + '\n' + this.formatArray(arr));
+  }
+}
+
+export const defaultLogger = new Logger();

package/dist/vue/utils/path.ts

@@ -0,0 +1,59 @@
+import { cosyLogger } from '../cosy';
+
+/**
+ * 判断当前路径是否匹配目标路径
+ * @param currentPath 当前路径
+ * @param targetPath 目标路径
+ * @returns 是否匹配
+ */
+export function isPathMatch(currentPath: string, targetPath: string): boolean {
+  const debug = false;
+
+  if (debug) {
+    cosyLogger.info(`判断 ${currentPath} 是否匹配 ${targetPath}`);
+  }
+
+  // 如果完全匹配，直接返回
+  if (currentPath === targetPath) {
+    if (debug) {
+      cosyLogger.info(`${currentPath} 完全匹配 ${targetPath}`);
+    }
+    return true;
+  }
+
+  // 标准化路径，移除最后的斜杠
+  const normalizedCurrentPath = currentPath.endsWith('/')
+    ? currentPath.slice(0, -1)
+    : currentPath;
+
+  const normalizedTargetPath = targetPath.endsWith('/')
+    ? targetPath.slice(0, -1)
+    : targetPath;
+
+  // 直接比较完整路径
+  if (normalizedCurrentPath === normalizedTargetPath) {
+    return true;
+  }
+
+  // 提取不带基础路径的部分进行比较
+  // 例如把 /cosy-ui/zh-cn/components/button 中提取 /zh-cn/components/button
+  const currentPathSegments = normalizedCurrentPath.split('/').filter(Boolean);
+  const targetPathSegments = normalizedTargetPath.split('/').filter(Boolean);
+
+  // 如果目标路径长度大于当前路径，不可能匹配
+  if (targetPathSegments.length > currentPathSegments.length) {
+    return false;
+  }
+
+  // 从后向前比较路径段
+  for (let i = 1; i <= targetPathSegments.length; i++) {
+    if (
+      currentPathSegments[currentPathSegments.length - i] !==
+      targetPathSegments[targetPathSegments.length - i]
+    ) {
+      return false;
+    }
+  }
+
+  return true;
+}

package/dist/vue/utils/social.ts

@@ -0,0 +1,90 @@
+// 定义支持的社交平台及其配置
+interface PlatformConfig {
+  name: string;
+  domains: string[];
+}
+
+// 处理后的社交链接类型
+export interface ProcessedSocialLink {
+  url: string;
+  name: string;
+  platform: string;
+}
+
+// 社交平台配置
+const platformConfigs: Record<string, PlatformConfig> = {
+  github: {
+    name: 'GitHub',
+    domains: ['github.com'],
+  },
+  twitter: {
+    name: 'Twitter',
+    domains: ['twitter.com', 'x.com'],
+  },
+  linkedin: {
+    name: 'LinkedIn',
+    domains: ['linkedin.com'],
+  },
+  weibo: {
+    name: '微博',
+    domains: ['weibo.com'],
+  },
+  wechat: {
+    name: '微信',
+    domains: ['wechat.com', 'weixin.qq.com'],
+  },
+  zhihu: {
+    name: '知乎',
+    domains: ['zhihu.com'],
+  },
+  bilibili: {
+    name: 'BiliBili',
+    domains: ['bilibili.com'],
+  },
+  youtube: {
+    name: 'YouTube',
+    domains: ['youtube.com', 'youtu.be'],
+  },
+  discord: {
+    name: 'Discord',
+    domains: ['discord.com', 'discord.gg'],
+  },
+};
+
+// 从 URL 判断社交平台
+function detectPlatform(url: string): [string, PlatformConfig] | null {
+  try {
+    const urlObj = new URL(url);
+    const hostname = urlObj.hostname.toLowerCase();
+
+    for (const [platform, config] of Object.entries(platformConfigs)) {
+      if (config.domains.some((domain) => hostname.includes(domain))) {
+        return [platform, config];
+      }
+    }
+  } catch (e) {
+    console.error('Invalid URL:', url, e);
+  }
+  return null;
+}
+
+// 处理社交链接
+export function processSocialLink(url: string): ProcessedSocialLink {
+  const platformInfo = detectPlatform(url);
+
+  if (!platformInfo) {
+    // 如果无法识别平台，返回默认值
+    return {
+      url: url,
+      name: '社交链接',
+      platform: 'default',
+    };
+  }
+
+  const [platform, config] = platformInfo;
+  return {
+    url: url,
+    name: config.name,
+    platform,
+  };
+}