@coffic/cosy-ui 0.5.8 → 0.5.14

package/dist/collections/ExperimentCollection.ts

@@ -0,0 +1,18 @@
+import { defineCollection, z } from 'astro:content';
+import { glob } from 'astro/loaders';
+
+export const experimentSchema = z.object({
+	title: z.string(),
+	description: z.string().optional(),
+	pubDate: z.date().optional(),
+});
+
+export const makeExperimentCollection = (base: string) => {
+	return defineCollection({
+		loader: glob({
+			pattern: '**/*.{md,mdx}',
+			base,
+		}),
+		schema: experimentSchema,
+	});
+};

package/dist/collections/LessonCollection.ts

@@ -0,0 +1,25 @@
+import { defineCollection, z } from 'astro:content';
+import { glob } from 'astro/loaders';
+
+export const lessonSchema = z.object({
+	title: z.string(),
+	description: z.string().optional(),
+	authors: z
+		.array(
+			z.object({
+				name: z.string(),
+				picture: z.string().optional(),
+			})
+		)
+		.optional(),
+});
+
+export const makeLessonCollection = (base: string) => {
+	return defineCollection({
+		loader: glob({
+			pattern: '**/*.{md,mdx}',
+			base,
+		}),
+		schema: lessonSchema,
+	});
+};

package/dist/collections/MetaCollection.ts

@@ -0,0 +1,17 @@
+import { defineCollection, z } from 'astro:content';
+import { glob } from 'astro/loaders';
+
+export const metaSchema = z.object({
+	title: z.string(),
+	description: z.string().optional(),
+});
+
+export const makeMetaCollection = (base: string) => {
+	return defineCollection({
+		loader: glob({
+			pattern: '**/*.{md,mdx}',
+			base,
+		}),
+		schema: metaSchema,
+	});
+};

package/dist/components/data-display/TeamMembers.astro

@@ -93,7 +93,7 @@ const getGridClasses = (cols: 2 | 3 | 4) => {
 <div class:list={['cosy:w-full cosy:mx-auto cosy:px-4', className]}>
 	<div class:list={['cosy:grid cosy:gap-6', ...getGridClasses(columnsValue)]}>
 		{
-			members.map((member: TeamMemberData, index: number) => (
+			members.map((member: TeamMemberData) => (
 				<div class="cosy:transition-all cosy:hover:-translate-y-1 cosy:duration-300 cosy:transform">
 					<TeamMember {...member} />
 				</div>

package/dist/components/display/Card.astro

@@ -80,9 +80,6 @@ interface Props {
 
 const { title, subtitle, imageUrl, href, class: className = '' } = Astro.props;
 
-// 定义动画的CSS类
-const fadeInAnimation = 'cosy:animate-fadeIn';
-
 // 定义卡片的CSS类
 const cardClasses = [
 	'cosy:bg-base-100',

package/dist/components/display/CodeBlock.astro

@@ -51,12 +51,11 @@ import '../../app.css';
 
 interface Props {
 	code: string;
-	lang?: string;
 	title?: string;
 	showLineNumbers?: boolean;
 }
 
-const { code, lang = 'plaintext', title, showLineNumbers = true } = Astro.props;
+const { code, title, showLineNumbers = true } = Astro.props;
 
 // 移除代码字符串开头和结尾的空行
 const trimmedCode = code.trim();

package/dist/components/display/Modal.astro

@@ -103,7 +103,7 @@ const { id, title, showCloseButton = true, class: className = '' } = Astro.props
 	</form>
 </dialog>
 
-<script define:vars={{ id }}>
+<script is:inline define:vars={{ id }}>
 	// 为了方便使用，我们提供一些辅助方法
 	document.addEventListener('DOMContentLoaded', () => {
 		const modal = document.getElementById(id);
@@ -117,4 +117,3 @@ const { id, title, showCloseButton = true, class: className = '' } = Astro.props
 		});
 	});
 </script>
-

package/dist/components/icons/SearchIcon.astro

@@ -1,40 +1,36 @@
 ---
 interface Props {
-  /**
-   * 图标的大小
-   * @default "24px"
-   */
-  size?: string;
-  /**
-   * 图标的颜色
-   * @default "currentColor"
-   */
-  color?: string;
-  /**
-   * 自定义类名
-   */
-  class?: string;
-  /**
-   * 插槽名称
-   */
-  slot?: string;
+	/**
+	 * 图标的大小
+	 * @default "24px"
+	 */
+	size?: string;
+	/**
+	 * 图标的颜色
+	 * @default "currentColor"
+	 */
+	color?: string;
+	/**
+	 * 自定义类名
+	 */
+	class?: string;
 }
 
-const { size = '24px', color = 'currentColor', class: className = '', slot } = Astro.props;
+const { size = '24px', color = 'currentColor', class: className = '' } = Astro.props;
 ---
 
-<svg 
-  xmlns="http://www.w3.org/2000/svg" 
-  width={size} 
-  height={size} 
-  viewBox="0 0 24 24" 
-  fill="none" 
-  stroke={color} 
-  stroke-width="2" 
-  stroke-linecap="round" 
-  stroke-linejoin="round"
-  class={className}
->
-  <circle cx="11" cy="11" r="8" />
-  <line x1="21" y1="21" x2="16.65" y2="16.65" />
-</svg> 
+<svg
+	xmlns="http://www.w3.org/2000/svg"
+	width={size}
+	height={size}
+	viewBox="0 0 24 24"
+	fill="none"
+	stroke={color}
+	stroke-width="2"
+	stroke-linecap="round"
+	stroke-linejoin="round"
+	class={className}>
+	<circle cx="11" cy="11" r="8"></circle>
+	<line x1="21" y1="21" x2="16.65" y2="16.65"></line>
+</svg>
+

package/dist/components/icons/SunCloudyIcon.astro

@@ -1,45 +1,41 @@
 ---
 interface Props {
-  /**
-   * 图标的大小
-   * @default "24px"
-   */
-  size?: string;
-  /**
-   * 图标的颜色
-   * @default "currentColor"
-   */
-  color?: string;
-  /**
-   * 自定义类名
-   */
-  class?: string;
-  /**
-   * 插槽名称
-   */
-  slot?: string;
+	/**
+	 * 图标的大小
+	 * @default "24px"
+	 */
+	size?: string;
+	/**
+	 * 图标的颜色
+	 * @default "currentColor"
+	 */
+	color?: string;
+	/**
+	 * 自定义类名
+	 */
+	class?: string;
 }
 
-const { size = '24px', color = 'currentColor', class: className = '', slot } = Astro.props;
+const { size = '24px', color = 'currentColor', class: className = '' } = Astro.props;
 ---
 
-<svg 
-  xmlns="http://www.w3.org/2000/svg" 
-  width={size} 
-  height={size} 
-  viewBox="0 0 24 24" 
-  fill="none" 
-  stroke={color} 
-  stroke-width="2" 
-  stroke-linecap="round" 
-  stroke-linejoin="round"
-  class={className}
->
-  <path d="M12 2v2" />
-  <path d="M2 12h2" />
-  <path d="M20 12h2" />
-  <path d="M4.93 4.93l1.41 1.41" />
-  <path d="M17.66 4.93l-1.41 1.41" />
-  <path d="M12 19a4 4 0 100-8 4 4 0 000 8z" />
-  <path d="M12 15a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
-</svg> 
+<svg
+	xmlns="http://www.w3.org/2000/svg"
+	width={size}
+	height={size}
+	viewBox="0 0 24 24"
+	fill="none"
+	stroke={color}
+	stroke-width="2"
+	stroke-linecap="round"
+	stroke-linejoin="round"
+	class={className}>
+	<path d="M12 2v2"></path>
+	<path d="M2 12h2"></path>
+	<path d="M20 12h2"></path>
+	<path d="M4.93 4.93l1.41 1.41"></path>
+	<path d="M17.66 4.93l-1.41 1.41"></path>
+	<path d="M12 19a4 4 0 100-8 4 4 0 000 8z"></path>
+	<path d="M12 15a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path>
+</svg>
+

package/dist/components/layouts/BaseLayout.astro

@@ -50,7 +50,7 @@
  */
 
 import '../../app.css';
-import type { MetaProps } from '../../index';
+import { LinkUtil, type MetaProps } from '../../index';
 
 export interface Props extends MetaProps {
 	debug?: boolean;
@@ -71,6 +71,7 @@ const {
 
 // 处理类名
 let bodyClasses = debug ? 'cosy:border cosy:border-red-500' : className || '';
+const faviconPath = LinkUtil.createUrl('/favicon.png');
 ---
 
 <!doctype html>
@@ -82,7 +83,7 @@ let bodyClasses = debug ? 'cosy:border cosy:border-red-500' : className || '';
 		{description && <meta name="description" content={description} />}
 		{keywords && <meta name="keywords" content={keywords} />}
 		<meta name="generator" content={Astro.generator} />
-		<link rel="icon" type="image/svg+xml" href="/favicon.png" />
+		<link rel="icon" type="image/svg+xml" href={faviconPath} />
 
 		<!-- 自定义样式 -->
 		{customStyles && <style set:html={customStyles} />}

package/dist/components/navigation/TableOfContents.astro

@@ -125,8 +125,7 @@ const tocId = `toc-${Math.random().toString(36).substring(2, 9)}`;
 		<div
 			class={`toc-container toc-scroll-container ${fixed ? 'cosy:w-64' : 'cosy:w-full cosy:max-w-xs'}`}
 			id={`${tocId}-container`}
-			style="display: none;"
-		>
+			style="display: none;">
 			<div class="cosy:bg-base-100 cosy:shadow-inner cosy:card">
 				<div class="cosy:p-4 cosy:card-body">
 					<div class="cosy:mb-2 cosy:font-bold cosy:text-lg cosy:card-title">{titleText}</div>
@@ -140,7 +139,11 @@ const tocId = `toc-${Math.random().toString(36).substring(2, 9)}`;
 	</div>
 </aside>
 
-<script define:vars={{ selector, maxDepth, tocId, containerSelector, minHeadings, langInfo }}>
+<script
+	is:inline
+	define:vars={{ selector, maxDepth, tocId, containerSelector, minHeadings, langInfo }}
+>
+	// @ts-nocheck
 	// 在页面加载完成后生成目录
 	function generateTOC() {
 		// 使用指定的容器选择器查找内容容器

package/dist/components/typography/Text.astro

@@ -97,7 +97,7 @@
 
 import '../../app.css';
 
-interface Props {
+export interface Props {
 	as?: string;
 	size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 	weight?: 'light' | 'normal' | 'medium' | 'semibold' | 'bold';

package/dist/database/BlogDB.ts

@@ -0,0 +1,199 @@
+import BlogDoc from '../entities/BlogDoc';
+import type Tag from '../entities/Tag';
+import { logger } from '../utils/logger';
+import { type CollectionEntry } from 'astro:content';
+import { BaseDB } from './BaseDB';
+
+export const COLLECTION_NAME = 'blogs' as const;
+export type BlogEntry = CollectionEntry<typeof COLLECTION_NAME>;
+
+/**
+ * 博客数据库类，用于管理博客内容集合。
+ *
+ * 目录结构：
+ * ```
+ * blogs/
+ * ├── zh-cn/
+ * │   ├── typescript-intro.md      # 文章内容
+ * │   ├── images/                  # 文章相关图片
+ * │   └── web-performance.md
+ * └── en/
+ *     └── typescript-intro.md
+ *     └── images/
+ *     └── web-performance.md
+ * ```
+ */
+class BlogDB extends BaseDB<typeof COLLECTION_NAME, BlogEntry, BlogDoc> {
+	protected collectionName = COLLECTION_NAME;
+
+	protected createDoc(entry: BlogEntry): BlogDoc {
+		return BlogDoc.fromEntry(entry);
+	}
+
+	/**
+	 * 获取所有博客
+	 *
+	 * @returns {Promise<BlogDoc[]>} 返回所有博客
+	 */
+	async allBlogs(): Promise<BlogDoc[]> {
+		const debug = false;
+		const entries = await this.getDocsByDepth(2);
+
+		if (debug) {
+			logger.array('所有博客文档', entries);
+		}
+
+		return entries;
+	}
+
+	/**
+	 * 获取指定语言的所有博客
+	 *
+	 * @param lang - 语言代码
+	 * @returns {Promise<BlogDoc[]>} 返回指定语言的所有博客
+	 */
+	async allBlogsByLang(lang: string): Promise<BlogDoc[]> {
+		const docs = await this.allBlogs();
+		const filteredEntries = docs.filter((doc) => doc.getId().startsWith(lang));
+
+		return filteredEntries;
+	}
+
+	/**
+	 * 获取用于 Astro 静态路由生成的路径参数，专门配合 [lang]/blogs/[slug].astro 使用
+	 *
+	 * @returns 返回路径参数数组
+	 */
+	async getStaticPaths() {
+		const debug = false;
+		const docs = await this.allBlogs();
+
+		const paths = docs.map((doc) => {
+			return {
+				params: {
+					lang: doc.getLang(),
+					slug: doc.getSlug(),
+				},
+			};
+		});
+
+		if (debug) {
+			logger.array('所有博客文档的路径', paths);
+		}
+
+		return paths;
+	}
+
+	/**
+	 * 获取所有博客标签
+	 * 标签会根据语言和名称去重，使用复合键 "lang:name" 确保唯一性
+	 *
+	 * @returns 返回所有标签数组
+	 * 返回格式：
+	 * [
+	 *   { name: 'typescript', lang: 'zh-cn', count: 5 },
+	 *   { name: 'javascript', lang: 'en', count: 3 }
+	 * ]
+	 */
+	async getTags(): Promise<Tag[]> {
+		const tagsMap = new Map<string, Tag>();
+		const posts = await this.allBlogs();
+
+		posts.forEach((post) => {
+			post.getTags().forEach((tag) => {
+				const key = `${tag.lang}:${tag.name}`;
+				if (!tagsMap.has(key)) {
+					tagsMap.set(key, tag);
+				}
+			});
+		});
+
+		return Array.from(tagsMap.values());
+	}
+
+	/**
+	 * 获取指定语言的博客标签
+	 *
+	 * @param lang - 语言代码（如 'zh-cn', 'en'）
+	 * @returns 返回指定语言的标签数组
+	 */
+	async getTagsByLang(lang: string): Promise<Tag[]> {
+		const debug = false;
+		const tagsMap = new Map<string, Tag>();
+		const posts = await this.allBlogsByLang(lang);
+
+		if (debug) {
+			logger.array('posts', posts);
+		}
+
+		if (posts.length === 0) {
+			return [];
+		}
+
+		posts.forEach((post) => {
+			post.getTags().forEach((tag) => {
+				const key = `${tag.lang}:${tag.name}`;
+				if (!tagsMap.has(key)) {
+					tagsMap.set(key, tag);
+				}
+			});
+		});
+
+		if (debug) {
+			logger.array('tags', Array.from(tagsMap.values()));
+		}
+
+		return Array.from(tagsMap.values());
+	}
+
+	/**
+	 * 获取指定标签和语言的博客文章
+	 *
+	 * @param tag - 标签名称
+	 * @param lang - 语言代码
+	 * @returns 返回匹配的博客文档数组
+	 * @example
+	 * ```typescript
+	 * const posts = await blogDB.getBlogsByTag('typescript', 'zh-cn');
+	 * // 返回所有包含 'typescript' 标签的中文博客
+	 * ```
+	 */
+	async getBlogsByTag(tag: string, lang: string): Promise<BlogDoc[]> {
+		const posts = await this.allBlogsByLang(lang);
+		return posts.filter((post) => post.getTags().some((t) => t.name === tag));
+	}
+
+	/**
+	 * 获取标签的静态路径参数，用于生成标签页面的路由，专门配合 [lang]/blogs/tag/[name].astro 使用
+	 *
+	 * @returns 返回所有标签的路径参数数组
+	 * 返回格式：
+	 * [
+	 *   { params: { lang: 'zh-cn', name: 'typescript' } },
+	 *   { params: { lang: 'en', name: 'javascript' } }
+	 * ]
+	 */
+	async getTagsStaticPaths() {
+		const debug = false;
+		const tags = await this.getTags();
+
+		const paths = tags.map((tag) => {
+			return {
+				params: {
+					lang: tag.lang,
+					name: tag.name,
+				},
+			};
+		});
+
+		if (debug) {
+			logger.array('所有的标签路径', paths);
+		}
+
+		return paths;
+	}
+}
+
+// 创建并导出单例实例
+const blogDB = new BlogDB();
+export default blogDB;

package/dist/database/CourseDB.ts

@@ -0,0 +1,85 @@
+import CourseDoc from '../entities/CourseDoc';
+import { getCollection, type CollectionEntry } from 'astro:content';
+import { BaseDB } from './BaseDB';
+
+export const COLLECTION_NAME = 'courses' as const;
+export type CourseEntry = CollectionEntry<typeof COLLECTION_NAME>;
+
+/**
+ * 课程数据库类，用于管理课程内容集合。
+ *
+ * 目录结构：
+ * ```
+ * courses/
+ * ├── zh-cn/
+ * │   ├── web-development/
+ * │   │   ├── index.md
+ * │   │   ├── chapter1
+ * │   │   │   ├── index.md
+ * │   │   │   ├── content.md
+ * │   │   │   └── ...
+ * │   │   └── chapter2
+ * │   │       ├── index.md
+ * │   │       ├── content.md
+ * │   │       └── ...
+ * │   └── mobile-dev/
+ * │       ├── index.md
+ * │       └── ...
+ * └── en/
+ *     └── ...
+ * ```
+ */
+class CourseDB extends BaseDB<typeof COLLECTION_NAME, CourseEntry, CourseDoc> {
+	protected collectionName = COLLECTION_NAME;
+
+	protected createDoc(entry: CourseEntry): CourseDoc {
+		return new CourseDoc(entry);
+	}
+
+	/**
+	 * 获取指定语言的所有顶级课程
+	 *
+	 * @param lang - 语言代码
+	 * @returns 返回指定语言的顶级课程数组
+	 */
+	async allCoursesByLang(lang: string): Promise<CourseDoc[]> {
+		const entries = await getCollection(COLLECTION_NAME, ({ id }) => {
+			return id.startsWith(lang) && id.split('/').length === 2;
+		});
+		return entries.map((entry) => new CourseDoc(entry));
+	}
+
+	/**
+	 * 获取用于 Astro 静态路由生成的路径参数，专门配合 [lang]/courses/[...slug].astro 使用
+	 *
+	 * @returns 返回路径参数数组
+	 */
+	async getStaticPaths(): Promise<{ params: { lang: string; slug: string } }[]> {
+		const entries = await getCollection(COLLECTION_NAME);
+		return entries.map((entry) => {
+			const doc = new CourseDoc(entry);
+			return {
+				params: {
+					lang: doc.getLang(),
+					slug: doc.getSlug(),
+				},
+			};
+		});
+	}
+
+	/**
+	 * 获取精选课程
+	 * 返回指定语言的前4个顶级课程文档
+	 *
+	 * @param lang - 语言代码（如 'zh-cn', 'en'）
+	 * @returns 返回精选课程文档数组（最多4个）
+	 */
+	async getFamousCourses(lang: string): Promise<CourseDoc[]> {
+		const courses = await this.allCoursesByLang(lang);
+		return courses.slice(0, 4);
+	}
+}
+
+// 创建并导出单例实例
+const courseDB = new CourseDB();
+export default courseDB;