@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.
- package/README.md +5 -1
- package/dist/{components/base → alert}/Alert.astro +2 -2
- package/dist/alert/AlertBasic.astro +5 -0
- package/dist/alert/AlertCustomStyle.astro +7 -0
- package/dist/alert/AlertTypes.astro +13 -0
- package/dist/alert/AlertWithTitle.astro +5 -0
- package/dist/alert/index.ts +20 -0
- package/dist/app.css +1 -1
- package/dist/{components/typography → article}/Article.astro +2 -2
- package/dist/article/ArticleBasic.astro +31 -0
- package/dist/article/index.ts +11 -0
- package/dist/{components/base → button}/Button.astro +1 -2
- package/dist/button/ButtonBasic.astro +18 -0
- package/dist/button/ButtonShapes.astro +23 -0
- package/dist/button/ButtonSizes.astro +15 -0
- package/dist/button/ButtonStates.astro +12 -0
- package/dist/button/ButtonWithIcons.astro +25 -0
- package/dist/button/index.ts +23 -0
- package/dist/components/containers/Main.astro +1 -2
- package/dist/components/data-display/ProductCard.astro +2 -1
- package/dist/components/data-display/TeamMember.astro +2 -1
- package/dist/components/data-display/TeamMembers.astro +2 -1
- package/dist/components/display/Hero.astro +1 -1
- package/dist/components/display/Modal.astro +1 -1
- package/dist/{components/errors → errors}/404.astro +1 -1
- package/dist/errors/404Basic.astro +5 -0
- package/dist/errors/index.ts +11 -0
- package/dist/flex/FlexBasic.astro +9 -0
- package/dist/flex/index.ts +11 -0
- package/dist/{components/layouts → footer}/Footer.astro +8 -8
- package/dist/footer/FooterBasic.astro +12 -0
- package/dist/footer/FooterSection.astro +46 -0
- package/dist/footer/index.ts +11 -0
- package/dist/{components/layouts → grid}/Grid.astro +1 -1
- package/dist/grid/GridBasic.astro +9 -0
- package/dist/grid/index.ts +11 -0
- package/dist/{components/layouts → header}/Header.astro +14 -51
- package/dist/header/HeaderBasic.astro +14 -0
- package/dist/header/HeaderCustomNavbarEnd.astro +20 -0
- package/dist/header/HeaderCustomPosition.astro +23 -0
- package/dist/header/HeaderWithNavigation.astro +22 -0
- package/dist/header/index.ts +20 -0
- package/dist/{components/typography → heading}/Heading.astro +2 -2
- package/dist/heading/HeadingBasic.astro +10 -0
- package/dist/heading/index.ts +11 -0
- package/dist/{components/base → image}/Image.astro +9 -7
- package/dist/image/ImageBasic.astro +1 -0
- package/dist/image/ImageEffects.astro +32 -0
- package/dist/image/ImageLoading.astro +35 -0
- package/dist/image/index.ts +17 -0
- package/dist/index.ts +2 -95
- package/dist/index_astro.ts +78 -0
- package/dist/index_utils.ts +8 -0
- package/dist/{components/navigation → language-switcher}/LanguageSwitcher.astro +3 -3
- package/dist/language-switcher/LanguageSwitcherBasic.astro +7 -0
- package/dist/language-switcher/index.ts +11 -0
- package/dist/{components/layouts → layout-app}/AppLayout.astro +10 -4
- package/dist/layout-app/AppLayoutBasic.astro +53 -0
- package/dist/layout-app/index.ts +11 -0
- package/dist/{components/layouts → layout-basic}/BaseLayout.astro +2 -2
- package/dist/layout-basic/BaseLayoutBasic.astro +16 -0
- package/dist/layout-basic/index.ts +11 -0
- package/dist/{components/layouts → layout-dashboard}/DashboardLayout.astro +2 -2
- package/dist/layout-dashboard/DashboardLayoutBasic.astro +48 -0
- package/dist/layout-dashboard/index.ts +11 -0
- package/dist/{components/base → link}/Link.astro +1 -1
- package/dist/link/LinkAnimations.astro +21 -0
- package/dist/link/LinkBasic.astro +17 -0
- package/dist/link/LinkVariants.astro +20 -0
- package/dist/link/index.ts +17 -0
- package/dist/module/Module.astro +61 -0
- package/dist/module/ModuleBasic.astro +12 -0
- package/dist/module/ModuleCustom.astro +14 -0
- package/dist/module/ModuleGrid.astro +26 -0
- package/dist/module/index.ts +17 -0
- package/dist/{components/layouts → nav-item}/NavItems.astro +2 -3
- package/dist/nav-item/NavItemsBasic.astro +27 -0
- package/dist/nav-item/index.ts +11 -0
- package/dist/nav-section/NavSection.astro +42 -0
- package/dist/nav-section/NavSectionBasic.astro +12 -0
- package/dist/nav-section/index.ts +11 -0
- package/dist/{components/layouts → sidebar}/Sidebar.astro +5 -6
- package/dist/sidebar/SidebarBasic.astro +1 -0
- package/dist/sidebar/index.ts +11 -0
- package/dist/{components/layouts → sidebar-nav}/SidebarNav.astro +3 -3
- package/dist/sidebar-nav/SidebarNavBasic.astro +32 -0
- package/dist/sidebar-nav/index.ts +11 -0
- package/dist/speak/Speak.astro +65 -0
- package/dist/speak/SpeakBasic.astro +13 -0
- package/dist/speak/SpeakGrid.astro +29 -0
- package/dist/speak/index.ts +14 -0
- package/dist/{components/layouts → stack}/Stack.astro +1 -1
- package/dist/stack/StackBasic.astro +15 -0
- package/dist/stack/index.ts +11 -0
- package/dist/{components/typography → text}/Text.astro +1 -1
- package/dist/text/TextBasic.astro +12 -0
- package/dist/text/TextSizes.astro +11 -0
- package/dist/text/index.ts +11 -0
- package/dist/theme-item/ThemeItem.astro +45 -0
- package/dist/theme-item/ThemeItemBasic.astro +10 -0
- package/dist/theme-item/index.ts +11 -0
- package/dist/{components/navigation → theme-switcher}/ThemeSwitcher.astro +4 -4
- package/dist/theme-switcher/ThemeSwitcherBasic.astro +7 -0
- package/dist/theme-switcher/index.ts +11 -0
- package/dist/{components/navigation → toc}/TableOfContents.astro +3 -3
- package/dist/toc/TableOfContentsBasic.astro +25 -0
- package/dist/toc/index.ts +11 -0
- package/dist/types/image.ts +16 -0
- package/dist/types/menu.ts +24 -0
- package/dist/utils/component.ts +39 -0
- package/dist/vue/AlertDialog/index.ts +3 -41
- package/dist/vue/BannerBox/index.ts +9 -44
- package/dist/vue/BlogList/index.ts +5 -27
- package/dist/vue/Buttons/index.ts +5 -27
- package/dist/vue/ConfirmDialog/index.ts +3 -41
- package/dist/vue/MacWindow/index.ts +7 -21
- package/dist/vue/SmartHero/index.ts +4 -26
- package/dist/vue/iPhone/index.ts +5 -18
- package/package.json +7 -7
- package/dist/components/base/Module.astro +0 -18
- package/dist/components/base/Speak.astro +0 -22
- package/dist/components/base/ThemeItem.astro +0 -21
- package/dist/components/layouts/NavSection.astro +0 -32
- /package/dist/{components/layouts → flex}/Flex.astro +0 -0
@@ -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 '
|
45
|
-
import { AlertTriangle } from '
|
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:
|
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 =
|
153
|
+
const isRemoteImage =
|
154
|
+
typeof imageSource === 'string' &&
|
155
|
+
(imageSource.startsWith('http') || imageSource.startsWith('//'));
|
154
156
|
// 获取图片源
|
155
|
-
const imgSrc = typeof
|
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
|
-
|
2
|
-
export
|
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 '
|
31
|
-
import '
|
32
|
-
import { LanguageUtil } from '
|
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,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 '
|
169
|
-
import {
|
170
|
-
|
171
|
-
|
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 '
|
53
|
-
import { LinkUtil, type IMetaProps } from '
|
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
|
+
};
|
@@ -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
|
+
};
|
@@ -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>
|