@coffic/cosy-ui 0.6.24 → 0.6.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (124) hide show
  1. package/README.md +5 -1
  2. package/dist/{components/base → alert}/Alert.astro +2 -2
  3. package/dist/alert/AlertBasic.astro +5 -0
  4. package/dist/alert/AlertCustomStyle.astro +7 -0
  5. package/dist/alert/AlertTypes.astro +13 -0
  6. package/dist/alert/AlertWithTitle.astro +5 -0
  7. package/dist/alert/index.ts +20 -0
  8. package/dist/app.css +1 -1
  9. package/dist/{components/typography → article}/Article.astro +2 -2
  10. package/dist/article/ArticleBasic.astro +31 -0
  11. package/dist/article/index.ts +11 -0
  12. package/dist/{components/base → button}/Button.astro +1 -2
  13. package/dist/button/ButtonBasic.astro +18 -0
  14. package/dist/button/ButtonShapes.astro +23 -0
  15. package/dist/button/ButtonSizes.astro +15 -0
  16. package/dist/button/ButtonStates.astro +12 -0
  17. package/dist/button/ButtonWithIcons.astro +25 -0
  18. package/dist/button/index.ts +23 -0
  19. package/dist/components/containers/Main.astro +1 -2
  20. package/dist/components/data-display/ProductCard.astro +2 -1
  21. package/dist/components/data-display/TeamMember.astro +2 -1
  22. package/dist/components/data-display/TeamMembers.astro +2 -1
  23. package/dist/components/display/Hero.astro +1 -1
  24. package/dist/components/display/Modal.astro +1 -1
  25. package/dist/{components/errors → errors}/404.astro +1 -1
  26. package/dist/errors/404Basic.astro +5 -0
  27. package/dist/errors/index.ts +11 -0
  28. package/dist/flex/FlexBasic.astro +9 -0
  29. package/dist/flex/index.ts +11 -0
  30. package/dist/{components/layouts → footer}/Footer.astro +8 -8
  31. package/dist/footer/FooterBasic.astro +12 -0
  32. package/dist/footer/FooterSection.astro +46 -0
  33. package/dist/footer/index.ts +11 -0
  34. package/dist/{components/layouts → grid}/Grid.astro +1 -1
  35. package/dist/grid/GridBasic.astro +9 -0
  36. package/dist/grid/index.ts +11 -0
  37. package/dist/{components/layouts → header}/Header.astro +14 -51
  38. package/dist/header/HeaderBasic.astro +14 -0
  39. package/dist/header/HeaderCustomNavbarEnd.astro +20 -0
  40. package/dist/header/HeaderCustomPosition.astro +23 -0
  41. package/dist/header/HeaderWithNavigation.astro +22 -0
  42. package/dist/header/index.ts +20 -0
  43. package/dist/{components/typography → heading}/Heading.astro +2 -2
  44. package/dist/heading/HeadingBasic.astro +10 -0
  45. package/dist/heading/index.ts +11 -0
  46. package/dist/{components/base → image}/Image.astro +9 -7
  47. package/dist/image/ImageBasic.astro +1 -0
  48. package/dist/image/ImageEffects.astro +32 -0
  49. package/dist/image/ImageLoading.astro +35 -0
  50. package/dist/image/index.ts +17 -0
  51. package/dist/index.ts +2 -95
  52. package/dist/index_astro.ts +78 -0
  53. package/dist/index_utils.ts +8 -0
  54. package/dist/{components/navigation → language-switcher}/LanguageSwitcher.astro +3 -3
  55. package/dist/language-switcher/LanguageSwitcherBasic.astro +7 -0
  56. package/dist/language-switcher/index.ts +11 -0
  57. package/dist/{components/layouts → layout-app}/AppLayout.astro +10 -4
  58. package/dist/layout-app/AppLayoutBasic.astro +53 -0
  59. package/dist/layout-app/index.ts +11 -0
  60. package/dist/{components/layouts → layout-basic}/BaseLayout.astro +2 -2
  61. package/dist/layout-basic/BaseLayoutBasic.astro +16 -0
  62. package/dist/layout-basic/index.ts +11 -0
  63. package/dist/{components/layouts → layout-dashboard}/DashboardLayout.astro +2 -2
  64. package/dist/layout-dashboard/DashboardLayoutBasic.astro +48 -0
  65. package/dist/layout-dashboard/index.ts +11 -0
  66. package/dist/{components/base → link}/Link.astro +1 -1
  67. package/dist/link/LinkAnimations.astro +21 -0
  68. package/dist/link/LinkBasic.astro +17 -0
  69. package/dist/link/LinkVariants.astro +20 -0
  70. package/dist/link/index.ts +17 -0
  71. package/dist/module/Module.astro +61 -0
  72. package/dist/module/ModuleBasic.astro +12 -0
  73. package/dist/module/ModuleCustom.astro +14 -0
  74. package/dist/module/ModuleGrid.astro +26 -0
  75. package/dist/module/index.ts +17 -0
  76. package/dist/{components/layouts → nav-item}/NavItems.astro +2 -3
  77. package/dist/nav-item/NavItemsBasic.astro +27 -0
  78. package/dist/nav-item/index.ts +11 -0
  79. package/dist/nav-section/NavSection.astro +42 -0
  80. package/dist/nav-section/NavSectionBasic.astro +12 -0
  81. package/dist/nav-section/index.ts +11 -0
  82. package/dist/{components/layouts → sidebar}/Sidebar.astro +5 -6
  83. package/dist/sidebar/SidebarBasic.astro +1 -0
  84. package/dist/sidebar/index.ts +11 -0
  85. package/dist/{components/layouts → sidebar-nav}/SidebarNav.astro +3 -3
  86. package/dist/sidebar-nav/SidebarNavBasic.astro +32 -0
  87. package/dist/sidebar-nav/index.ts +11 -0
  88. package/dist/speak/Speak.astro +65 -0
  89. package/dist/speak/SpeakBasic.astro +13 -0
  90. package/dist/speak/SpeakGrid.astro +29 -0
  91. package/dist/speak/index.ts +14 -0
  92. package/dist/{components/layouts → stack}/Stack.astro +1 -1
  93. package/dist/stack/StackBasic.astro +15 -0
  94. package/dist/stack/index.ts +11 -0
  95. package/dist/{components/typography → text}/Text.astro +1 -1
  96. package/dist/text/TextBasic.astro +12 -0
  97. package/dist/text/TextSizes.astro +11 -0
  98. package/dist/text/index.ts +11 -0
  99. package/dist/theme-item/ThemeItem.astro +45 -0
  100. package/dist/theme-item/ThemeItemBasic.astro +10 -0
  101. package/dist/theme-item/index.ts +11 -0
  102. package/dist/{components/navigation → theme-switcher}/ThemeSwitcher.astro +4 -4
  103. package/dist/theme-switcher/ThemeSwitcherBasic.astro +7 -0
  104. package/dist/theme-switcher/index.ts +11 -0
  105. package/dist/{components/navigation → toc}/TableOfContents.astro +3 -3
  106. package/dist/toc/TableOfContentsBasic.astro +25 -0
  107. package/dist/toc/index.ts +11 -0
  108. package/dist/types/image.ts +16 -0
  109. package/dist/types/menu.ts +24 -0
  110. package/dist/utils/component.ts +39 -0
  111. package/dist/vue/AlertDialog/index.ts +3 -41
  112. package/dist/vue/BannerBox/index.ts +9 -44
  113. package/dist/vue/BlogList/index.ts +5 -27
  114. package/dist/vue/Buttons/index.ts +5 -27
  115. package/dist/vue/ConfirmDialog/index.ts +3 -41
  116. package/dist/vue/MacWindow/index.ts +7 -21
  117. package/dist/vue/SmartHero/index.ts +4 -26
  118. package/dist/vue/iPhone/index.ts +5 -18
  119. package/package.json +7 -7
  120. package/dist/components/base/Module.astro +0 -18
  121. package/dist/components/base/Speak.astro +0 -22
  122. package/dist/components/base/ThemeItem.astro +0 -21
  123. package/dist/components/layouts/NavSection.astro +0 -32
  124. /package/dist/{components/layouts → flex}/Flex.astro +0 -0
@@ -63,8 +63,8 @@
63
63
  * - LinkIcon (用于锚点链接)
64
64
  */
65
65
 
66
- import { LinkIcon } from '../../index';
67
- import '../../style.ts';
66
+ import { LinkIcon } from '../index';
67
+ import '../style.ts';
68
68
 
69
69
  interface Props {
70
70
  level?: 1 | 2 | 3 | 4 | 5 | 6;
@@ -0,0 +1,10 @@
1
+ ---
2
+ import Heading from './Heading.astro';
3
+ ---
4
+
5
+ <Heading level={1}>一级标题</Heading>
6
+ <Heading level={2} underline color="primary">带下划线的二级标题</Heading>
7
+ <Heading level={3} color="secondary">三级标题</Heading>
8
+ <Heading level={4} align="center">居中的四级标题</Heading>
9
+ <Heading level={5} color="muted">五级标题</Heading>
10
+ <Heading level={6} anchor id="section-6">带锚点的六级标题</Heading>
@@ -0,0 +1,11 @@
1
+ import Heading from './Heading.astro';
2
+ import HeadingBasic from './HeadingBasic.astro';
3
+ import BasicSourceCode from './HeadingBasic.astro?raw';
4
+ import { extractSimpleExample } from '../utils/component';
5
+
6
+ export { Heading, HeadingBasic };
7
+
8
+ // 导出示例源代码
9
+ export const HeadingExampleCodes = {
10
+ Basic: extractSimpleExample(BasicSourceCode, 'Heading'),
11
+ };
@@ -41,8 +41,9 @@
41
41
  * ```
42
42
  */
43
43
 
44
- import '../../style.ts';
45
- import { AlertTriangle } from '../../index';
44
+ import '../style.ts';
45
+ import { AlertTriangle } from '../index';
46
+ import type { ImageSource } from '../types/image.ts';
46
47
 
47
48
  // 自定义图片元数据接口
48
49
  interface ImageMetadata {
@@ -56,7 +57,7 @@ interface Props {
56
57
  /**
57
58
  * 图片源,可以是本地图片或远程URL
58
59
  */
59
- src: ImageMetadata | string;
60
+ src: ImageSource;
60
61
  /**
61
62
  * 图片的替代文本
62
63
  */
@@ -123,7 +124,6 @@ interface Props {
123
124
  * @default "none"
124
125
  */
125
126
  transition?: 'none' | 'fade' | 'slide' | 'zoom';
126
-
127
127
  /**
128
128
  * 加载指示器类型
129
129
  * @default "skeleton"
@@ -132,7 +132,7 @@ interface Props {
132
132
  }
133
133
 
134
134
  const {
135
- src,
135
+ src: imageSource,
136
136
  alt,
137
137
  width,
138
138
  height,
@@ -150,9 +150,11 @@ const {
150
150
  } = Astro.props;
151
151
 
152
152
  // 判断是否为远程图片
153
- const isRemoteImage = typeof src === 'string' && (src.startsWith('http') || src.startsWith('//'));
153
+ const isRemoteImage =
154
+ typeof imageSource === 'string' &&
155
+ (imageSource.startsWith('http') || imageSource.startsWith('//'));
154
156
  // 获取图片源
155
- const imgSrc = typeof src === 'string' ? src : src.src;
157
+ const imgSrc = typeof imageSource === 'string' ? imageSource : imageSource.src;
156
158
 
157
159
  // 对象映射定义所有可能的类名
158
160
  const objectFitClasses = {
@@ -0,0 +1 @@
1
+
@@ -0,0 +1,32 @@
1
+ import Image from './Image.astro';
2
+
3
+ <div class="cosy:grid cosy:grid-cols-3 cosy:gap-4">
4
+ <Image
5
+ src="/placeholder-2.jpg"
6
+ alt="圆角效果"
7
+ width={200}
8
+ height={200}
9
+ rounded="lg"
10
+ shadow="md"
11
+ />
12
+
13
+ <Image
14
+ src="/placeholder-3.jpg"
15
+ alt="悬停效果"
16
+ width={200}
17
+ height={200}
18
+ hover="scale"
19
+ transition="zoom"
20
+ />
21
+
22
+ <Image
23
+ src="/placeholder-4.jpg"
24
+ alt="组合效果"
25
+ width={200}
26
+ height={200}
27
+ rounded="full"
28
+ shadow="xl"
29
+ hover="brightness"
30
+ transition="fade"
31
+ />
32
+ </div>
@@ -0,0 +1,35 @@
1
+ import Image from './Image.astro';
2
+
3
+ <div class="cosy:grid cosy:grid-cols-2 cosy:gap-4">
4
+ <Image
5
+ src="https://picsum.photos/400/300"
6
+ alt="骨架屏加载"
7
+ width={400}
8
+ height={300}
9
+ loadingIndicator="skeleton"
10
+ />
11
+
12
+ <Image
13
+ src="https://picsum.photos/400/300"
14
+ alt="进度条加载"
15
+ width={400}
16
+ height={300}
17
+ loadingIndicator="progress"
18
+ />
19
+
20
+ <Image
21
+ src="https://picsum.photos/400/300"
22
+ alt="加载动画"
23
+ width={400}
24
+ height={300}
25
+ loadingIndicator="spinner"
26
+ />
27
+
28
+ <Image
29
+ src="https://invalid-image-url.jpg"
30
+ alt="加载错误示例"
31
+ width={400}
32
+ height={300}
33
+ showError={true}
34
+ />
35
+ </div>
@@ -0,0 +1,17 @@
1
+ import Image from './Image.astro';
2
+ import ImageBasic from './ImageBasic.astro';
3
+ import ImageEffects from './ImageEffects.astro';
4
+ import ImageLoading from './ImageLoading.astro';
5
+ import BasicSourceCode from './ImageBasic.astro?raw';
6
+ import EffectsSourceCode from './ImageEffects.astro?raw';
7
+ import LoadingSourceCode from './ImageLoading.astro?raw';
8
+ import { extractSimpleExample } from '../utils/component';
9
+
10
+ export { Image, ImageBasic, ImageEffects, ImageLoading };
11
+
12
+ // 导出示例源代码
13
+ export const ImageExampleCodes = {
14
+ Basic: extractSimpleExample(BasicSourceCode, 'Image'),
15
+ Effects: extractSimpleExample(EffectsSourceCode, 'Image'),
16
+ Loading: extractSimpleExample(LoadingSourceCode, 'Image'),
17
+ };
package/dist/index.ts CHANGED
@@ -1,96 +1,3 @@
1
- // Base
2
- export { default as Button } from './components/base/Button.astro';
3
- export { default as Link } from './components/base/Link.astro';
4
- export { default as Image } from './components/base/Image.astro';
5
- export { default as ThemeItem } from './components/base/ThemeItem.astro';
6
- export { default as Alert } from './components/base/Alert.astro';
7
- export { default as Speak } from './components/base/Speak.astro';
8
- export { default as Module } from './components/base/Module.astro';
9
-
10
- // Navigation
11
- export { default as ThemeSwitcher } from './components/navigation/ThemeSwitcher.astro';
12
- export { default as TableOfContents } from './components/navigation/TableOfContents.astro';
13
- export { default as LanguageSwitcher } from './components/navigation/LanguageSwitcher.astro';
14
-
15
- // Display
16
- export { default as CodeBlock } from './components/display/CodeBlock.astro';
17
- export { default as Modal } from './components/display/Modal.astro';
18
- export { default as Hero } from './components/display/Hero.astro';
19
- export { default as Banner } from './components/display/Banner.astro';
20
- export { default as Card } from './components/display/Card.astro';
21
- export { default as CodeExample } from './components/display/CodeExample.astro';
22
-
23
- // Data Display
24
- export { default as TeamMembers } from './components/data-display/TeamMembers.astro';
25
- export { default as TeamMember } from './components/data-display/TeamMember.astro';
26
- export { default as ProductCard } from './components/data-display/ProductCard.astro';
27
- export { default as Products } from './components/data-display/Products.astro';
28
- export { default as Blog } from './components/data-display/Blog.astro';
29
-
30
- // Layouts
31
- export { default as Footer } from './components/layouts/Footer.astro';
32
- export { default as Header } from './components/layouts/Header.astro';
33
- export { default as AppLayout } from './components/layouts/AppLayout.astro';
34
- export { default as Stack } from './components/layouts/Stack.astro';
35
- export { default as Grid } from './components/layouts/Grid.astro';
36
- export { default as BaseLayout } from './components/layouts/BaseLayout.astro';
37
- export { default as DashboardLayout } from './components/layouts/DashboardLayout.astro';
38
- export { default as Flex } from './components/layouts/Flex.astro';
39
-
40
- // Typography
41
- export { default as Article } from './components/typography/Article.astro';
42
- export { default as Text } from './components/typography/Text.astro';
43
- export { default as Heading } from './components/typography/Heading.astro';
44
-
45
- // Errors Page
46
- export { default as ErrorPage404 } from './components/errors/404.astro';
47
-
48
- // Icons
1
+ export * from './index_astro';
2
+ export * from './index_utils';
49
3
  export * from './index_icons';
50
-
51
- // Containers
52
- export { default as Container } from './components/containers/Container.astro';
53
- export { default as Main } from './components/containers/Main.astro';
54
- export { default as Section } from './components/containers/Section.astro';
55
-
56
- // Utils
57
- export * from './utils/image';
58
- export * from './utils/i18n';
59
- export * from './utils/path';
60
- export * from './utils/url';
61
- export * from './utils/language';
62
- export * from './utils/lang_package';
63
- export * from './utils/logger';
64
- export * from './utils/link';
65
-
66
- // Types
67
- export * from './types/sidebar';
68
- export * from './types/main';
69
- export * from './types/article';
70
- export * from './types/layout';
71
- export * from './types/header';
72
- export * from './types/heading';
73
- export * from './types/meta';
74
- export * from './types/nav';
75
- export * from './types/product';
76
- export * from './types/footer';
77
- export * from './types/static-path';
78
- export type { ImageProvider, ImageOptions } from './utils/image';
79
-
80
- // Entities
81
- export * from './entities/BaseDoc';
82
- export * from './entities/BlogDoc';
83
- export * from './entities/CourseDoc';
84
- export * from './entities/ExperimentDoc';
85
- export * from './entities/LessonDoc';
86
- export * from './entities/MetaDoc';
87
- export * from './entities/SidebarItem';
88
- export * from './entities/Tag';
89
-
90
- // Database
91
- export * from './database/BaseDB';
92
- export * from './database/BlogDB';
93
- export * from './database/CourseDB';
94
- export * from './database/ExperimentDB';
95
- export * from './database/LessonDB';
96
- export * from './database/MetaDB';
@@ -0,0 +1,78 @@
1
+ export * from './button';
2
+ export * from './article';
3
+ export * from './link';
4
+ export * from './image';
5
+ export * from './theme-item';
6
+ export * from './alert';
7
+ export * from './footer';
8
+ export * from './layout-app';
9
+ export * from './layout-basic';
10
+ export * from './speak';
11
+ export * from './module';
12
+ export * from './nav-item';
13
+ export * from './language-switcher';
14
+ export * from './toc';
15
+ export * from './sidebar';
16
+ export * from './sidebar-nav';
17
+ export * from './theme-switcher';
18
+ export * from './header';
19
+ export * from './errors';
20
+ export * from './flex';
21
+ export * from './grid';
22
+ export * from './heading';
23
+ export * from './stack';
24
+ export * from './text';
25
+ export * from './nav-section';
26
+ export { default as CodeBlock } from './components/display/CodeBlock.astro';
27
+ export { default as Modal } from './components/display/Modal.astro';
28
+ export { default as Hero } from './components/display/Hero.astro';
29
+ export { default as Banner } from './components/display/Banner.astro';
30
+ export { default as Card } from './components/display/Card.astro';
31
+ export { default as CodeExample } from './components/display/CodeExample.astro';
32
+ export { default as TeamMembers } from './components/data-display/TeamMembers.astro';
33
+ export { default as TeamMember } from './components/data-display/TeamMember.astro';
34
+ export { default as ProductCard } from './components/data-display/ProductCard.astro';
35
+ export { default as Products } from './components/data-display/Products.astro';
36
+ export { default as Blog } from './components/data-display/Blog.astro';
37
+ export * from './layout-basic/BaseLayout.astro';
38
+ export { default as DashboardLayout } from './layout-dashboard/DashboardLayout.astro';
39
+
40
+ // Icons
41
+ export * from './index_icons';
42
+
43
+ // Containers
44
+ export { default as Container } from './components/containers/Container.astro';
45
+ export { default as Main } from './components/containers/Main.astro';
46
+ export { default as Section } from './components/containers/Section.astro';
47
+
48
+ // Types
49
+ export * from './types/sidebar';
50
+ export * from './types/main';
51
+ export * from './types/article';
52
+ export * from './types/layout';
53
+ export * from './types/header';
54
+ export * from './types/heading';
55
+ export * from './types/meta';
56
+ export * from './types/nav';
57
+ export * from './types/product';
58
+ export * from './types/footer';
59
+ export * from './types/static-path';
60
+ export type { ImageProvider, ImageOptions } from './utils/image';
61
+
62
+ // Entities
63
+ export * from './entities/BaseDoc';
64
+ export * from './entities/BlogDoc';
65
+ export * from './entities/CourseDoc';
66
+ export * from './entities/ExperimentDoc';
67
+ export * from './entities/LessonDoc';
68
+ export * from './entities/MetaDoc';
69
+ export * from './entities/SidebarItem';
70
+ export * from './entities/Tag';
71
+
72
+ // Database
73
+ export * from './database/BaseDB';
74
+ export * from './database/BlogDB';
75
+ export * from './database/CourseDB';
76
+ export * from './database/ExperimentDB';
77
+ export * from './database/LessonDB';
78
+ export * from './database/MetaDB';
@@ -0,0 +1,8 @@
1
+ export * from './utils/image';
2
+ export * from './utils/i18n';
3
+ export * from './utils/path';
4
+ export * from './utils/url';
5
+ export * from './utils/language';
6
+ export * from './utils/lang_package';
7
+ export * from './utils/logger';
8
+ export * from './utils/link';
@@ -27,9 +27,9 @@
27
27
  * ```
28
28
  */
29
29
 
30
- import { ChevronDownIcon } from '../../index';
31
- import '../../style.ts';
32
- import { LanguageUtil } from '../../utils/language';
30
+ import { ChevronDownIcon } from '../index';
31
+ import '../style.ts';
32
+ import { LanguageUtil } from '../utils/language.ts';
33
33
 
34
34
  interface Props {
35
35
  languages: string[];
@@ -0,0 +1,7 @@
1
+ ---
2
+ import LanguageSwitcher from './LanguageSwitcher.astro';
3
+ ---
4
+
5
+ <div class="cosy:flex cosy:justify-center">
6
+ <LanguageSwitcher languages={['zh-cn', 'en']} />
7
+ </div>
@@ -0,0 +1,11 @@
1
+ import LanguageSwitcher from './LanguageSwitcher.astro';
2
+ import LanguageSwitcherBasic from './LanguageSwitcherBasic.astro';
3
+ import BasicSourceCode from './LanguageSwitcherBasic.astro?raw';
4
+ import { extractSimpleExample } from '../utils/component';
5
+
6
+ export { LanguageSwitcher, LanguageSwitcherBasic };
7
+
8
+ // 导出示例源代码
9
+ export const LanguageSwitcherExampleCodes = {
10
+ Basic: extractSimpleExample(BasicSourceCode, 'LanguageSwitcher'),
11
+ };
@@ -165,10 +165,16 @@
165
165
  * ```
166
166
  */
167
167
 
168
- import '../../style.ts';
169
- import { BaseLayout, type IAppLayoutProps, Footer, Header, Container } from '../../index';
170
- import Main from '../containers/Main.astro';
171
- import Sidebar from './Sidebar.astro';
168
+ import '../style.ts';
169
+ import {
170
+ BaseLayout,
171
+ type IAppLayoutProps,
172
+ Footer,
173
+ Header,
174
+ Container,
175
+ Main,
176
+ Sidebar,
177
+ } from '../index';
172
178
  import { ClientRouter } from 'astro:transitions';
173
179
 
174
180
  interface Props extends IAppLayoutProps {}
@@ -0,0 +1,53 @@
1
+ ---
2
+ import AppLayout from './AppLayout.astro';
3
+ import type { ISidebarItem } from '../types/sidebar';
4
+
5
+ const sidebarItems: ISidebarItem[] = [
6
+ {
7
+ text: '入门',
8
+ href: '/docs/getting-started',
9
+ items: [
10
+ { href: '/docs/getting-started', text: '快速开始' },
11
+ { href: '/docs/installation', text: '安装' },
12
+ ],
13
+ },
14
+ {
15
+ text: '组件',
16
+ href: '/docs/components',
17
+ items: [
18
+ { href: '/docs/components/button', text: 'Button 按钮' },
19
+ { href: '/docs/components/card', text: 'Card 卡片' },
20
+ ],
21
+ },
22
+ ];
23
+ ---
24
+
25
+ <AppLayout
26
+ metaConfig={{
27
+ title: '应用布局示例',
28
+ description: '这是一个应用布局的示例页面',
29
+ keywords: '布局,示例,应用布局',
30
+ author: 'CofficLab',
31
+ robots: 'noindex,nofollow',
32
+ }}
33
+ sidebarConfig={{
34
+ sidebarItems: sidebarItems,
35
+ }}
36
+ headerConfig={{
37
+ height: 'md',
38
+ }}
39
+ footerConfig={{
40
+ siteName: '我的文档站点',
41
+ homeLink: '/',
42
+ slogan: '简单而强大的组件库',
43
+ company: 'CofficLab',
44
+ copyright: '保留所有权利',
45
+ inspirationalSlogan: '让开发更加愉悦',
46
+ }}
47
+ mainContentConfig={{
48
+ padding: 'md',
49
+ }}>
50
+ <h1 class="cosy:text-2xl cosy:font-bold cosy:mb-4">欢迎使用应用布局</h1>
51
+ <p class="cosy:mb-2">这是一个包含侧边栏、头部和页脚的完整布局示例。</p>
52
+ <p>应用布局适合用于文档站点、管理后台等场景。</p>
53
+ </AppLayout>
@@ -0,0 +1,11 @@
1
+ import AppLayout from './AppLayout.astro';
2
+ import AppLayoutBasic from './AppLayoutBasic.astro';
3
+ import BasicSourceCode from './AppLayoutBasic.astro?raw';
4
+ import { extractSimpleExample } from '../utils/component';
5
+
6
+ export { AppLayout, AppLayoutBasic };
7
+
8
+ // 导出示例源代码
9
+ export const AppLayoutExampleCodes = {
10
+ Basic: extractSimpleExample(BasicSourceCode, 'AppLayout'),
11
+ };
@@ -49,8 +49,8 @@
49
49
  * ```
50
50
  */
51
51
 
52
- import '../../style.ts';
53
- import { LinkUtil, type IMetaProps } from '../../index';
52
+ import '../style.ts';
53
+ import { LinkUtil, type IMetaProps } from '../index';
54
54
 
55
55
  export interface Props extends IMetaProps {
56
56
  debug?: boolean;
@@ -0,0 +1,16 @@
1
+ ---
2
+ import BaseLayout from './BaseLayout.astro';
3
+ ---
4
+
5
+ <BaseLayout
6
+ title="基本布局示例"
7
+ description="这是一个基本布局的示例页面"
8
+ keywords="布局,示例,基本布局"
9
+ author="CofficLab"
10
+ robots="noindex,nofollow">
11
+ <main class="cosy:p-4">
12
+ <h1 class="cosy:text-2xl cosy:font-bold cosy:mb-4">欢迎使用基本布局</h1>
13
+ <p class="cosy:mb-2">这是一个简单的页面内容示例。</p>
14
+ <p>基本布局提供了完整的 HTML 结构和元数据设置。</p>
15
+ </main>
16
+ </BaseLayout>
@@ -0,0 +1,11 @@
1
+ import BaseLayout from './BaseLayout.astro';
2
+ import BaseLayoutBasic from './BaseLayoutBasic.astro';
3
+ import BasicSourceCode from './BaseLayoutBasic.astro?raw';
4
+ import { extractSimpleExample } from '../utils/component';
5
+
6
+ export { BaseLayout, BaseLayoutBasic };
7
+
8
+ // 导出示例源代码
9
+ export const BaseLayoutExampleCodes = {
10
+ Basic: extractSimpleExample(BasicSourceCode, 'BaseLayout'),
11
+ };
@@ -36,8 +36,8 @@
36
36
  * ```
37
37
  */
38
38
 
39
- import BaseLayout from './BaseLayout.astro';
40
- import '../../style.ts';
39
+ import { BaseLayout } from '../index';
40
+ import '../style.ts';
41
41
 
42
42
  export interface NavItem {
43
43
  href: string;
@@ -0,0 +1,48 @@
1
+ ---
2
+ import DashboardLayout from './DashboardLayout.astro';
3
+ import type { IMenuItem } from '../types/menu';
4
+
5
+ const menuItems: IMenuItem[] = [
6
+ {
7
+ text: '仪表盘',
8
+ href: '/dashboard',
9
+ icon: 'dashboard',
10
+ },
11
+ {
12
+ text: '用户管理',
13
+ href: '/dashboard/users',
14
+ icon: 'users',
15
+ },
16
+ {
17
+ text: '设置',
18
+ href: '/dashboard/settings',
19
+ icon: 'settings',
20
+ },
21
+ ];
22
+ ---
23
+
24
+ <DashboardLayout
25
+ title="仪表盘布局示例"
26
+ description="这是一个仪表盘布局的示例页面"
27
+ navItems={menuItems}>
28
+ <div class="cosy:grid cosy:grid-cols-1 cosy:md:grid-cols-2 cosy:lg:grid-cols-3 cosy:gap-4">
29
+ <div class="cosy:card cosy:bg-base-100 cosy:shadow-xl">
30
+ <div class="cosy:card-body">
31
+ <h2 class="cosy:card-title">总用户数</h2>
32
+ <p class="cosy:text-4xl cosy:font-bold">1,234</p>
33
+ </div>
34
+ </div>
35
+ <div class="cosy:card cosy:bg-base-100 cosy:shadow-xl">
36
+ <div class="cosy:card-body">
37
+ <h2 class="cosy:card-title">今日活跃</h2>
38
+ <p class="cosy:text-4xl cosy:font-bold">567</p>
39
+ </div>
40
+ </div>
41
+ <div class="cosy:card cosy:bg-base-100 cosy:shadow-xl">
42
+ <div class="cosy:card-body">
43
+ <h2 class="cosy:card-title">转化率</h2>
44
+ <p class="cosy:text-4xl cosy:font-bold">45.8%</p>
45
+ </div>
46
+ </div>
47
+ </div>
48
+ </DashboardLayout>
@@ -0,0 +1,11 @@
1
+ import DashboardLayout from './DashboardLayout.astro';
2
+ import DashboardLayoutBasic from './DashboardLayoutBasic.astro';
3
+ import BasicSourceCode from './DashboardLayoutBasic.astro?raw';
4
+ import { extractSimpleExample } from '../utils/component';
5
+
6
+ export { DashboardLayout, DashboardLayoutBasic };
7
+
8
+ // 导出示例源代码
9
+ export const DashboardLayoutExampleCodes = {
10
+ Basic: extractSimpleExample(BasicSourceCode, 'DashboardLayout'),
11
+ };
@@ -54,7 +54,7 @@
54
54
  * ```
55
55
  */
56
56
 
57
- import '../../style.ts';
57
+ import '../style.ts';
58
58
 
59
59
  import type { HTMLAttributes } from 'astro/types';
60
60
 
@@ -0,0 +1,21 @@
1
+ ---
2
+ import Link from './Link.astro';
3
+ ---
4
+
5
+ <div class="cosy:space-y-4">
6
+ <div class="cosy:flex cosy:gap-4">
7
+ <Link href="/hover-lift" animation="hover-lift" variant="primary"> 上浮效果 </Link>
8
+
9
+ <Link href="/hover-glow" animation="hover-glow" variant="secondary"> 发光效果 </Link>
10
+
11
+ <Link href="/hover-scale" animation="hover-scale" variant="cta"> 缩放效果 </Link>
12
+ </div>
13
+
14
+ <div class="cosy:flex cosy:gap-4">
15
+ <Link href="/block-link" block centerText variant="primary"> 块级居中链接 </Link>
16
+ </div>
17
+
18
+ <div class="cosy:bg-base-200 cosy:p-4">
19
+ <Link href="/light-variant" variant="light"> 浅色背景中的链接 </Link>
20
+ </div>
21
+ </div>
@@ -0,0 +1,17 @@
1
+ ---
2
+ import Link from './Link.astro';
3
+ ---
4
+
5
+ <div class="cosy:space-y-4">
6
+ <div>
7
+ <Link href="/about">默认链接</Link>
8
+ </div>
9
+
10
+ <div>
11
+ <Link href="https://example.com" external>外部链接</Link>
12
+ </div>
13
+
14
+ <div>
15
+ <p>这是一段文字,其中包含一个<Link href="/inline">内联链接</Link>。</p>
16
+ </div>
17
+ </div>