@coffic/cosy-ui 0.5.12 → 0.6.2

package/README.md

@@ -2,6 +2,7 @@
 
 [![English](https://img.shields.io/badge/English-violet)](README.md)
 [![简体中文](https://img.shields.io/badge/中文文档-gray)](README-zh.md)
+[![DEV](https://img.shields.io/badge/DEV-gray)](README-dev.md)
 [![NPM](https://img.shields.io/badge/NPM-orange)](https://www.npmjs.com/package/@coffic/cosy-ui)
 [![Coffic](https://img.shields.io/badge/Coffic-green)](https://coffic.cn)
 [![Maintainer](https://img.shields.io/badge/Maintainer-blue)](https://github.com/nookery)
@@ -23,34 +24,4 @@ Usage in Astro components:
 import { Button } from "@coffic/cosy-ui";
 ---
 <Button>Hi</Button>
-```
-
-## Development
-
-### Install Dependencies
-
-```bash
-pnpm install
-```
-
-### Start Development Server
-
-```bash
-pnpm dev
-```
-
-### Build
-
-Build:
-
-```bash
-pnpm build
-```
-
-## Contributing
-
-Issues and Pull Requests are welcome!
-
-## License
-
-MIT
+```

package/dist/collections/ArticleCollection.ts

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

package/dist/collections/BlogCollection.ts

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

package/dist/collections/CourseCollection.ts

@@ -0,0 +1,11 @@
+import { glob } from 'astro/loaders';
+import { defineCollection } from 'astro:content';
+
+export const makeCourseCollection = (base: string) => {
+	return defineCollection({
+		loader: glob({
+			pattern: '**/*.{md,mdx}',
+			base,
+		}),
+	});
+};

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/containers/Main.astro

@@ -48,11 +48,11 @@
  * ```
  */
 import '../../app.css';
-import type { MainContentProps } from '../../index';
+import type { IMainContentProps } from '../../index';
 import Article from '../typography/Article.astro';
 import TableOfContents from '../navigation/TableOfContents.astro';
 
-export interface Props extends MainContentProps {}
+export interface Props extends IMainContentProps {}
 
 const {
 	size = 'md',

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/AppLayout.astro

@@ -172,10 +172,10 @@ import Main from '../containers/Main.astro';
 import Header from './Header.astro';
 import Sidebar from './Sidebar.astro';
 import { ClientRouter } from 'astro:transitions';
-import type { AppLayoutProps } from '../../index';
+import type { IAppLayoutProps } from '../../index';
 import Container from '../containers/Container.astro';
 
-interface Props extends AppLayoutProps {}
+interface Props extends IAppLayoutProps {}
 
 const {
 	sidebarConfig,

package/dist/components/layouts/BaseLayout.astro

@@ -50,9 +50,9 @@
  */
 
 import '../../app.css';
-import type { MetaProps } from '../../index';
+import { LinkUtil, type IMetaProps } from '../../index';
 
-export interface Props extends MetaProps {
+export interface Props extends IMetaProps {
 	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/layouts/Footer.astro

@@ -147,7 +147,7 @@
 
 import { processSocialLink } from '../../utils/social';
 import SocialIcon from '../icons/SocialIcon.astro';
-import type { FooterProps } from '../../types/footer';
+import type { IFooterProps } from '../../types/footer';
 import { createTextGetter } from '../../utils/i18n';
 import NavSection from './NavSection.astro';
 import { LanguageUtil } from '../../utils/language';
@@ -178,7 +178,7 @@ const {
 	mediaLink,
 	techStackLink,
 	debug = false,
-} = Astro.props as FooterProps;
+} = Astro.props as IFooterProps;
 
 // 获取当前语言
 const lang = LanguageUtil.getCurrentLanguage(Astro);
@@ -210,14 +210,12 @@ const debugClasses = debug
 	class:list={[
 		'cosy:footer cosy:z-50 cosy:sm:footer-horizontal cosy:bg-base-200 cosy:text-base-content cosy:p-10',
 		debugClasses.footer,
-	]}
->
+	]}>
 	<div
 		class:list={[
 			'cosy:flex cosy:flex-col cosy:md:h-56 cosy:gap-8 cosy:container cosy:mx-auto cosy:items-center cosy:w-full cosy:md:flex-row cosy:md:justify-between',
 			debugClasses.section,
-		]}
-	>
+		]}>
 		{/* 品牌区域 */}
 		<aside class:list={['cosy:max-w-xs cosy:text-center', debugClasses.aside]}>
 			<a href={homeLink} class="cosy:flex cosy:items-center cosy:gap-2 cosy:mb-4 cosy:no-underline">
@@ -248,8 +246,7 @@ const debugClasses = debug
 								class="cosy:btn cosy:btn-circle cosy:btn-ghost cosy:btn-sm"
 								target="_blank"
 								rel="noopener noreferrer"
-								aria-label={link.name}
-							>
+								aria-label={link.name}>
 								<SocialIcon platform={link.platform} />
 							</a>
 						))}
@@ -263,8 +260,7 @@ const debugClasses = debug
 			class:list={[
 				'cosy:flex cosy:h-full cosy:flex-col cosy:justify-center cosy:gap-8 cosy:mx-auto cosy:max-w-xl cosy:text-center cosy:items-center cosy:w-full cosy:md:flex-row cosy:md:justify-between cosy:md:items-start',
 				debugClasses.section,
-			]}
-		>
+			]}>
 			{/* 产品导航 */}
 			{products.length > 0 && <NavSection title={t('products')} links={products} />}
 
@@ -328,8 +324,7 @@ const debugClasses = debug
 			class:list={[
 				'cosy:p-4 cosy:bg-primary cosy:text-primary-content cosy:w-full',
 				debugClasses.aside,
-			]}
-		>
+			]}>
 			<p class="cosy:text-center">{inspirationalSlogan}</p>
 		</aside>
 	)
@@ -340,8 +335,7 @@ const debugClasses = debug
 	class:list={[
 		'cosy:footer cosy:footer-center cosy:p-4 cosy:bg-base-300 cosy:text-base-content',
 		debugClasses.footer,
-	]}
->
+	]}>
 	<aside class:list={['cosy:items-center cosy:grid-flow-col', debugClasses.aside]}>
 		<p class="cosy:opacity-70 cosy:text-sm">
 			© {currentYear}

package/dist/components/layouts/Header.astro

@@ -60,10 +60,10 @@
 import '../../app.css';
 import Link from '../base/Link.astro';
 import Image from '../base/Image.astro';
-import { LanguageSwitcher, LinkUtil, type HeaderProps, type NavItem } from '../../index';
+import { LanguageSwitcher, LinkUtil, type IHeaderProps, type INavItem } from '../../index';
 import Logo from '../../assets/logo-rounded.png';
 
-export interface Props extends HeaderProps {
+export interface Props extends IHeaderProps {
 	debug?: boolean;
 }
 
@@ -119,7 +119,7 @@ const linkHeightClass = linkHeightClasses[height];
 const currentPath = Astro.url.pathname;
 const activeLink = LinkUtil.getActiveLink(
 	currentPath,
-	navItems.map((item: NavItem) => item.href)
+	navItems.map((item: INavItem) => item.href)
 );
 ---
 
@@ -187,7 +187,7 @@ const activeLink = LinkUtil.getActiveLink(
 								'cosy:hidden cosy:lg:flex cosy:px-1 cosy:menu cosy:menu-horizontal',
 								linkHeightClass,
 							]}>
-							{navItems.map((item: NavItem) => (
+							{navItems.map((item: INavItem) => (
 								<li>
 									<Link
 										variant={activeLink == item.href ? 'primary' : 'default'}
@@ -224,7 +224,7 @@ const activeLink = LinkUtil.getActiveLink(
 			navPosition === 'center' && (
 				<div class="cosy:hidden cosy:lg:flex cosy:navbar-center">
 					<ul class:list={['cosy:px-1 cosy:menu cosy:menu-horizontal', linkHeightClass]}>
-						{navItems.map((item: NavItem) => (
+						{navItems.map((item: INavItem) => (
 							<li>
 								<Link
 									variant={activeLink == item.href ? 'primary' : 'default'}
@@ -248,7 +248,7 @@ const activeLink = LinkUtil.getActiveLink(
 							'cosy:hidden cosy:lg:flex cosy:px-1 cosy:menu cosy:menu-horizontal',
 							linkHeightClass,
 						]}>
-						{navItems.map((item: NavItem) => (
+						{navItems.map((item: INavItem) => (
 							<li>
 								<Link
 									variant={activeLink == item.href ? 'primary' : 'default'}

package/dist/components/layouts/Sidebar.astro

@@ -26,9 +26,9 @@ import { isPathMatch } from '../../utils/path';
 import Modal from '../display/Modal.astro';
 import SidebarNav from './SidebarNav.astro';
 import MenuIcon from '../icons/MenuIcon.astro';
-import type { SidebarProps } from '../../index';
+import type { ISidebarProps } from '../../index';
 
-export interface Props extends SidebarProps {}
+export interface Props extends ISidebarProps {}
 
 const {
 	sidebarItems,

package/dist/components/layouts/SidebarNav.astro

@@ -7,13 +7,13 @@
 
 import { isPathMatch } from '../../utils/path';
 import '../../app.css';
-import type { SidebarItem } from '../../types/sidebar';
+import type { ISidebarItem } from '../../types/sidebar';
 
 interface Props {
 	/**
 	 * 侧边栏项目
 	 */
-	sidebarItems: SidebarItem[];
+	sidebarItems: ISidebarItem[];
 
 	/**
 	 * 当前路径
@@ -39,13 +39,13 @@ const debugClass = debug ? 'cosy:border cosy:border-red-500' : '';
 
 <nav class:list={['cosy:p-4', debugClass, className]}>
 	{
-		sidebarItems.map((section: SidebarItem) => (
+		sidebarItems.map((section: ISidebarItem) => (
 			<div class:list={['cosy:mb-6', debugClass]}>
 				<h3 class:list={['cosy:font-bold cosy:mb-2 cosy:text-base-content/70', debugClass]}>
 					{section.text}
 				</h3>
 				<ul class:list={['cosy:menu cosy:bg-base-200 cosy:rounded-box cosy:w-56', debugClass]}>
-					{section.items?.map((item: SidebarItem) => {
+					{section.items?.map((item: ISidebarItem) => {
 						const isActive = isPathMatch(currentPath, item.href);
 						return (
 							<li class:list={[debugClass]}>
@@ -60,7 +60,7 @@ const debugClass = debug ? 'cosy:border cosy:border-red-500' : '';
 								</a>
 								{item.items && (
 									<ul class:list={[debugClass]}>
-										{item.items.map((subitem: SidebarItem) => {
+										{item.items.map((subitem: ISidebarItem) => {
 											const isSubActive = isPathMatch(currentPath, subitem.href);
 											return (
 												<li class:list={[debugClass]}>
@@ -75,7 +75,7 @@ const debugClass = debug ? 'cosy:border cosy:border-red-500' : '';
 													</a>
 													{subitem.items && (
 														<ul class:list={[debugClass]}>
-															{subitem.items.map((subsubitem: SidebarItem) => {
+															{subitem.items.map((subsubitem: ISidebarItem) => {
 																const isSubSubActive = isPathMatch(currentPath, subsubitem.href);
 																return (
 																	<li class:list={[debugClass]}>

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/Article.astro

@@ -105,9 +105,9 @@
 
 // 导入样式
 import '../../app.css';
-import type { ArticleProps } from '@/types/article';
+import type { IArticleProps } from '@/types/article';
 
-export interface Props extends ArticleProps {}
+export interface Props extends IArticleProps {}
 
 const { class: className = '', width = 'medium', style = '' } = Astro.props;
 

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';