@coffic/cosy-ui 0.5.14 → 0.6.2
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/dist/components/containers/Main.astro +2 -2
- package/dist/components/layouts/AppLayout.astro +2 -2
- package/dist/components/layouts/BaseLayout.astro +2 -2
- package/dist/components/layouts/Footer.astro +8 -14
- package/dist/components/layouts/Header.astro +6 -6
- package/dist/components/layouts/Sidebar.astro +2 -2
- package/dist/components/layouts/SidebarNav.astro +6 -6
- package/dist/components/typography/Article.astro +2 -2
- package/dist/entities/SidebarItem.ts +68 -72
- package/dist/entities/Tag.ts +2 -2
- package/dist/index.ts +13 -1
- package/dist/types/article.ts +19 -19
- package/dist/types/footer.ts +4 -13
- package/dist/types/header.ts +4 -4
- package/dist/types/heading.ts +8 -8
- package/dist/types/layout.ts +59 -59
- package/dist/types/main.ts +68 -57
- package/dist/types/meta.ts +49 -49
- package/dist/types/nav.ts +1 -0
- package/dist/types/product.ts +10 -0
- package/dist/types/sidebar.ts +29 -26
- package/dist/types/static-path.ts +1 -1
- package/package.json +1 -1
@@ -48,11 +48,11 @@
|
|
48
48
|
* ```
|
49
49
|
*/
|
50
50
|
import '../../app.css';
|
51
|
-
import type {
|
51
|
+
import type { IMainContentProps } from '../../index';
|
52
52
|
import Article from '../typography/Article.astro';
|
53
53
|
import TableOfContents from '../navigation/TableOfContents.astro';
|
54
54
|
|
55
|
-
export interface Props extends
|
55
|
+
export interface Props extends IMainContentProps {}
|
56
56
|
|
57
57
|
const {
|
58
58
|
size = 'md',
|
@@ -172,10 +172,10 @@ import Main from '../containers/Main.astro';
|
|
172
172
|
import Header from './Header.astro';
|
173
173
|
import Sidebar from './Sidebar.astro';
|
174
174
|
import { ClientRouter } from 'astro:transitions';
|
175
|
-
import type {
|
175
|
+
import type { IAppLayoutProps } from '../../index';
|
176
176
|
import Container from '../containers/Container.astro';
|
177
177
|
|
178
|
-
interface Props extends
|
178
|
+
interface Props extends IAppLayoutProps {}
|
179
179
|
|
180
180
|
const {
|
181
181
|
sidebarConfig,
|
@@ -50,9 +50,9 @@
|
|
50
50
|
*/
|
51
51
|
|
52
52
|
import '../../app.css';
|
53
|
-
import { LinkUtil, type
|
53
|
+
import { LinkUtil, type IMetaProps } from '../../index';
|
54
54
|
|
55
|
-
export interface Props extends
|
55
|
+
export interface Props extends IMetaProps {
|
56
56
|
debug?: boolean;
|
57
57
|
}
|
58
58
|
|
@@ -147,7 +147,7 @@
|
|
147
147
|
|
148
148
|
import { processSocialLink } from '../../utils/social';
|
149
149
|
import SocialIcon from '../icons/SocialIcon.astro';
|
150
|
-
import type {
|
150
|
+
import type { IFooterProps } from '../../types/footer';
|
151
151
|
import { createTextGetter } from '../../utils/i18n';
|
152
152
|
import NavSection from './NavSection.astro';
|
153
153
|
import { LanguageUtil } from '../../utils/language';
|
@@ -178,7 +178,7 @@ const {
|
|
178
178
|
mediaLink,
|
179
179
|
techStackLink,
|
180
180
|
debug = false,
|
181
|
-
} = Astro.props as
|
181
|
+
} = Astro.props as IFooterProps;
|
182
182
|
|
183
183
|
// 获取当前语言
|
184
184
|
const lang = LanguageUtil.getCurrentLanguage(Astro);
|
@@ -210,14 +210,12 @@ const debugClasses = debug
|
|
210
210
|
class:list={[
|
211
211
|
'cosy:footer cosy:z-50 cosy:sm:footer-horizontal cosy:bg-base-200 cosy:text-base-content cosy:p-10',
|
212
212
|
debugClasses.footer,
|
213
|
-
]}
|
214
|
-
>
|
213
|
+
]}>
|
215
214
|
<div
|
216
215
|
class:list={[
|
217
216
|
'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',
|
218
217
|
debugClasses.section,
|
219
|
-
]}
|
220
|
-
>
|
218
|
+
]}>
|
221
219
|
{/* 品牌区域 */}
|
222
220
|
<aside class:list={['cosy:max-w-xs cosy:text-center', debugClasses.aside]}>
|
223
221
|
<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
|
|
248
246
|
class="cosy:btn cosy:btn-circle cosy:btn-ghost cosy:btn-sm"
|
249
247
|
target="_blank"
|
250
248
|
rel="noopener noreferrer"
|
251
|
-
aria-label={link.name}
|
252
|
-
>
|
249
|
+
aria-label={link.name}>
|
253
250
|
<SocialIcon platform={link.platform} />
|
254
251
|
</a>
|
255
252
|
))}
|
@@ -263,8 +260,7 @@ const debugClasses = debug
|
|
263
260
|
class:list={[
|
264
261
|
'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',
|
265
262
|
debugClasses.section,
|
266
|
-
]}
|
267
|
-
>
|
263
|
+
]}>
|
268
264
|
{/* 产品导航 */}
|
269
265
|
{products.length > 0 && <NavSection title={t('products')} links={products} />}
|
270
266
|
|
@@ -328,8 +324,7 @@ const debugClasses = debug
|
|
328
324
|
class:list={[
|
329
325
|
'cosy:p-4 cosy:bg-primary cosy:text-primary-content cosy:w-full',
|
330
326
|
debugClasses.aside,
|
331
|
-
]}
|
332
|
-
>
|
327
|
+
]}>
|
333
328
|
<p class="cosy:text-center">{inspirationalSlogan}</p>
|
334
329
|
</aside>
|
335
330
|
)
|
@@ -340,8 +335,7 @@ const debugClasses = debug
|
|
340
335
|
class:list={[
|
341
336
|
'cosy:footer cosy:footer-center cosy:p-4 cosy:bg-base-300 cosy:text-base-content',
|
342
337
|
debugClasses.footer,
|
343
|
-
]}
|
344
|
-
>
|
338
|
+
]}>
|
345
339
|
<aside class:list={['cosy:items-center cosy:grid-flow-col', debugClasses.aside]}>
|
346
340
|
<p class="cosy:opacity-70 cosy:text-sm">
|
347
341
|
© {currentYear}
|
@@ -60,10 +60,10 @@
|
|
60
60
|
import '../../app.css';
|
61
61
|
import Link from '../base/Link.astro';
|
62
62
|
import Image from '../base/Image.astro';
|
63
|
-
import { LanguageSwitcher, LinkUtil, type
|
63
|
+
import { LanguageSwitcher, LinkUtil, type IHeaderProps, type INavItem } from '../../index';
|
64
64
|
import Logo from '../../assets/logo-rounded.png';
|
65
65
|
|
66
|
-
export interface Props extends
|
66
|
+
export interface Props extends IHeaderProps {
|
67
67
|
debug?: boolean;
|
68
68
|
}
|
69
69
|
|
@@ -119,7 +119,7 @@ const linkHeightClass = linkHeightClasses[height];
|
|
119
119
|
const currentPath = Astro.url.pathname;
|
120
120
|
const activeLink = LinkUtil.getActiveLink(
|
121
121
|
currentPath,
|
122
|
-
navItems.map((item:
|
122
|
+
navItems.map((item: INavItem) => item.href)
|
123
123
|
);
|
124
124
|
---
|
125
125
|
|
@@ -187,7 +187,7 @@ const activeLink = LinkUtil.getActiveLink(
|
|
187
187
|
'cosy:hidden cosy:lg:flex cosy:px-1 cosy:menu cosy:menu-horizontal',
|
188
188
|
linkHeightClass,
|
189
189
|
]}>
|
190
|
-
{navItems.map((item:
|
190
|
+
{navItems.map((item: INavItem) => (
|
191
191
|
<li>
|
192
192
|
<Link
|
193
193
|
variant={activeLink == item.href ? 'primary' : 'default'}
|
@@ -224,7 +224,7 @@ const activeLink = LinkUtil.getActiveLink(
|
|
224
224
|
navPosition === 'center' && (
|
225
225
|
<div class="cosy:hidden cosy:lg:flex cosy:navbar-center">
|
226
226
|
<ul class:list={['cosy:px-1 cosy:menu cosy:menu-horizontal', linkHeightClass]}>
|
227
|
-
{navItems.map((item:
|
227
|
+
{navItems.map((item: INavItem) => (
|
228
228
|
<li>
|
229
229
|
<Link
|
230
230
|
variant={activeLink == item.href ? 'primary' : 'default'}
|
@@ -248,7 +248,7 @@ const activeLink = LinkUtil.getActiveLink(
|
|
248
248
|
'cosy:hidden cosy:lg:flex cosy:px-1 cosy:menu cosy:menu-horizontal',
|
249
249
|
linkHeightClass,
|
250
250
|
]}>
|
251
|
-
{navItems.map((item:
|
251
|
+
{navItems.map((item: INavItem) => (
|
252
252
|
<li>
|
253
253
|
<Link
|
254
254
|
variant={activeLink == item.href ? 'primary' : 'default'}
|
@@ -26,9 +26,9 @@ import { isPathMatch } from '../../utils/path';
|
|
26
26
|
import Modal from '../display/Modal.astro';
|
27
27
|
import SidebarNav from './SidebarNav.astro';
|
28
28
|
import MenuIcon from '../icons/MenuIcon.astro';
|
29
|
-
import type {
|
29
|
+
import type { ISidebarProps } from '../../index';
|
30
30
|
|
31
|
-
export interface Props extends
|
31
|
+
export interface Props extends ISidebarProps {}
|
32
32
|
|
33
33
|
const {
|
34
34
|
sidebarItems,
|
@@ -7,13 +7,13 @@
|
|
7
7
|
|
8
8
|
import { isPathMatch } from '../../utils/path';
|
9
9
|
import '../../app.css';
|
10
|
-
import type {
|
10
|
+
import type { ISidebarItem } from '../../types/sidebar';
|
11
11
|
|
12
12
|
interface Props {
|
13
13
|
/**
|
14
14
|
* 侧边栏项目
|
15
15
|
*/
|
16
|
-
sidebarItems:
|
16
|
+
sidebarItems: ISidebarItem[];
|
17
17
|
|
18
18
|
/**
|
19
19
|
* 当前路径
|
@@ -39,13 +39,13 @@ const debugClass = debug ? 'cosy:border cosy:border-red-500' : '';
|
|
39
39
|
|
40
40
|
<nav class:list={['cosy:p-4', debugClass, className]}>
|
41
41
|
{
|
42
|
-
sidebarItems.map((section:
|
42
|
+
sidebarItems.map((section: ISidebarItem) => (
|
43
43
|
<div class:list={['cosy:mb-6', debugClass]}>
|
44
44
|
<h3 class:list={['cosy:font-bold cosy:mb-2 cosy:text-base-content/70', debugClass]}>
|
45
45
|
{section.text}
|
46
46
|
</h3>
|
47
47
|
<ul class:list={['cosy:menu cosy:bg-base-200 cosy:rounded-box cosy:w-56', debugClass]}>
|
48
|
-
{section.items?.map((item:
|
48
|
+
{section.items?.map((item: ISidebarItem) => {
|
49
49
|
const isActive = isPathMatch(currentPath, item.href);
|
50
50
|
return (
|
51
51
|
<li class:list={[debugClass]}>
|
@@ -60,7 +60,7 @@ const debugClass = debug ? 'cosy:border cosy:border-red-500' : '';
|
|
60
60
|
</a>
|
61
61
|
{item.items && (
|
62
62
|
<ul class:list={[debugClass]}>
|
63
|
-
{item.items.map((subitem:
|
63
|
+
{item.items.map((subitem: ISidebarItem) => {
|
64
64
|
const isSubActive = isPathMatch(currentPath, subitem.href);
|
65
65
|
return (
|
66
66
|
<li class:list={[debugClass]}>
|
@@ -75,7 +75,7 @@ const debugClass = debug ? 'cosy:border cosy:border-red-500' : '';
|
|
75
75
|
</a>
|
76
76
|
{subitem.items && (
|
77
77
|
<ul class:list={[debugClass]}>
|
78
|
-
{subitem.items.map((subsubitem:
|
78
|
+
{subitem.items.map((subsubitem: ISidebarItem) => {
|
79
79
|
const isSubSubActive = isPathMatch(currentPath, subsubitem.href);
|
80
80
|
return (
|
81
81
|
<li class:list={[debugClass]}>
|
@@ -105,9 +105,9 @@
|
|
105
105
|
|
106
106
|
// 导入样式
|
107
107
|
import '../../app.css';
|
108
|
-
import type {
|
108
|
+
import type { IArticleProps } from '@/types/article';
|
109
109
|
|
110
|
-
export interface Props extends
|
110
|
+
export interface Props extends IArticleProps {}
|
111
111
|
|
112
112
|
const { class: className = '', width = 'medium', style = '' } = Astro.props;
|
113
113
|
|
@@ -1,79 +1,75 @@
|
|
1
|
-
import { type
|
1
|
+
import { type ISidebarItem } from '../types/sidebar';
|
2
2
|
|
3
3
|
/**
|
4
4
|
* 侧边栏项目类
|
5
5
|
* 用于构建网站的侧边栏导航
|
6
6
|
*/
|
7
|
-
export class SidebarItemEntity implements
|
8
|
-
|
9
|
-
|
10
|
-
|
7
|
+
export class SidebarItemEntity implements ISidebarItem {
|
8
|
+
text: string;
|
9
|
+
href: string;
|
10
|
+
items: ISidebarItem[];
|
11
11
|
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
this.text = props.text;
|
18
|
-
this.href = props.link || '';
|
19
|
-
this.items = props.items || [];
|
20
|
-
}
|
12
|
+
constructor(props: { text: string; link?: string; items?: ISidebarItem[] }) {
|
13
|
+
this.text = props.text;
|
14
|
+
this.href = props.link || '';
|
15
|
+
this.items = props.items || [];
|
16
|
+
}
|
21
17
|
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
18
|
+
/**
|
19
|
+
* 添加子项目
|
20
|
+
* @param item 要添加的子项目
|
21
|
+
*/
|
22
|
+
addItem(item: SidebarItemEntity): void {
|
23
|
+
this.items.push(item);
|
24
|
+
}
|
29
25
|
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
26
|
+
/**
|
27
|
+
* 获取所有子项目
|
28
|
+
* @returns 子项目数组
|
29
|
+
*/
|
30
|
+
getItems(): SidebarItemEntity[] {
|
31
|
+
return this.items.map((item) => new SidebarItemEntity(item));
|
32
|
+
}
|
37
33
|
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
34
|
+
/**
|
35
|
+
* 获取项目标签
|
36
|
+
* @returns 项目标签
|
37
|
+
*/
|
38
|
+
getLabel(): string {
|
39
|
+
return this.text;
|
40
|
+
}
|
45
41
|
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
42
|
+
/**
|
43
|
+
* 获取项目链接
|
44
|
+
* @returns 项目链接
|
45
|
+
*/
|
46
|
+
getLink(): string {
|
47
|
+
return this.href;
|
48
|
+
}
|
53
49
|
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
50
|
+
/**
|
51
|
+
* 获取包括自身在内的所有项目
|
52
|
+
* @returns 包括自身在内的所有项目
|
53
|
+
*/
|
54
|
+
getItemsIncludingSelf(): SidebarItemEntity[] {
|
55
|
+
return [this, ...this.getItems()];
|
56
|
+
}
|
61
57
|
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
58
|
+
/**
|
59
|
+
* 判断是否是分组(有子项目)
|
60
|
+
* @returns 是否是分组
|
61
|
+
*/
|
62
|
+
isGroup(): boolean {
|
63
|
+
return this.items.length > 0;
|
64
|
+
}
|
69
65
|
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
|
76
|
-
|
66
|
+
/**
|
67
|
+
* 判断是否不是分组
|
68
|
+
* @returns 是否不是分组
|
69
|
+
*/
|
70
|
+
isNotGroup(): boolean {
|
71
|
+
return !this.isGroup();
|
72
|
+
}
|
77
73
|
}
|
78
74
|
|
79
75
|
/**
|
@@ -81,13 +77,13 @@ export class SidebarItemEntity implements SidebarItem {
|
|
81
77
|
* 实现此接口的类可以提供侧边栏项目
|
82
78
|
*/
|
83
79
|
export interface SidebarProvider {
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
80
|
+
/**
|
81
|
+
* 转换为侧边栏项目
|
82
|
+
*/
|
83
|
+
toSidebarItem(): Promise<SidebarItemEntity>;
|
88
84
|
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
}
|
85
|
+
/**
|
86
|
+
* 获取顶级侧边栏项目
|
87
|
+
*/
|
88
|
+
getTopSidebarItem?(): Promise<SidebarItemEntity>;
|
89
|
+
}
|
package/dist/entities/Tag.ts
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import blogDB from '../database/BlogDB';
|
2
2
|
import { SidebarItemEntity } from './SidebarItem';
|
3
|
-
import { type
|
3
|
+
import { type ITagStaticPath } from '../types/static-path';
|
4
4
|
import { LinkUtil } from '../utils/link';
|
5
5
|
|
6
6
|
export class Tag {
|
@@ -21,7 +21,7 @@ export class Tag {
|
|
21
21
|
});
|
22
22
|
}
|
23
23
|
|
24
|
-
toTagPath():
|
24
|
+
toTagPath(): ITagStaticPath {
|
25
25
|
return {
|
26
26
|
params: { slug: this.lang + '/blogs/tag/' + this.name },
|
27
27
|
props: { tag: this.name },
|
package/dist/index.ts
CHANGED
@@ -99,10 +99,22 @@ export * from './types/layout';
|
|
99
99
|
export * from './types/header';
|
100
100
|
export * from './types/heading';
|
101
101
|
export * from './types/meta';
|
102
|
+
export * from './types/nav';
|
103
|
+
export * from './types/product';
|
104
|
+
export * from './types/footer';
|
105
|
+
export * from './types/static-path';
|
102
106
|
export type { ImageProvider, ImageOptions } from './utils/image';
|
103
107
|
|
104
|
-
//
|
108
|
+
// Entities
|
105
109
|
export * from './entities/BaseDoc';
|
110
|
+
export * from './entities/BlogDoc';
|
111
|
+
export * from './entities/CourseDoc';
|
112
|
+
export * from './entities/ExperimentDoc';
|
113
|
+
export * from './entities/Heading';
|
114
|
+
export * from './entities/LessonDoc';
|
115
|
+
export * from './entities/MetaDoc';
|
116
|
+
export * from './entities/SidebarItem';
|
117
|
+
export * from './entities/Tag';
|
106
118
|
|
107
119
|
// Database
|
108
120
|
export * from './database/BaseDB';
|
package/dist/types/article.ts
CHANGED
@@ -1,22 +1,22 @@
|
|
1
|
-
export interface
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
1
|
+
export interface IArticleProps {
|
2
|
+
/**
|
3
|
+
* 文章的类名
|
4
|
+
*/
|
5
|
+
class?: string;
|
6
6
|
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
7
|
+
/**
|
8
|
+
* 类名列表
|
9
|
+
*/
|
10
|
+
'class:list'?: any;
|
11
11
|
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
12
|
+
/**
|
13
|
+
* 内联样式
|
14
|
+
*/
|
15
|
+
style?: string;
|
16
16
|
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
}
|
17
|
+
/**
|
18
|
+
* 文章宽度
|
19
|
+
* @default "medium"
|
20
|
+
*/
|
21
|
+
width?: 'narrow' | 'medium' | 'wide' | 'full';
|
22
|
+
}
|
package/dist/types/footer.ts
CHANGED
@@ -1,15 +1,6 @@
|
|
1
|
-
|
2
|
-
src: string;
|
3
|
-
alt: string;
|
4
|
-
}
|
5
|
-
|
6
|
-
export interface Product {
|
7
|
-
name: string;
|
8
|
-
href: string;
|
9
|
-
external?: boolean;
|
10
|
-
}
|
1
|
+
import type { ILogo, IProduct } from './product';
|
11
2
|
|
12
|
-
export interface
|
3
|
+
export interface IFooterProps {
|
13
4
|
/**
|
14
5
|
* 关于链接
|
15
6
|
*/
|
@@ -79,7 +70,7 @@ export interface FooterProps {
|
|
79
70
|
/**
|
80
71
|
* 徽标
|
81
72
|
*/
|
82
|
-
logo?:
|
73
|
+
logo?: ILogo;
|
83
74
|
|
84
75
|
/**
|
85
76
|
* 媒体链接
|
@@ -104,7 +95,7 @@ export interface FooterProps {
|
|
104
95
|
/**
|
105
96
|
* 产品
|
106
97
|
*/
|
107
|
-
products?:
|
98
|
+
products?: IProduct[];
|
108
99
|
|
109
100
|
/**
|
110
101
|
* 站点名称
|
package/dist/types/header.ts
CHANGED
@@ -1,4 +1,6 @@
|
|
1
|
-
|
1
|
+
import type { INavItem } from './nav';
|
2
|
+
|
3
|
+
export interface IHeaderProps {
|
2
4
|
/**
|
3
5
|
* 侧边栏是否默认展开
|
4
6
|
* @default false
|
@@ -30,7 +32,7 @@ export interface HeaderProps {
|
|
30
32
|
/**
|
31
33
|
* 导航菜单项
|
32
34
|
*/
|
33
|
-
navItems?:
|
35
|
+
navItems?: INavItem[];
|
34
36
|
|
35
37
|
/**
|
36
38
|
* 是否显示侧边栏切换按钮
|
@@ -60,5 +62,3 @@ export interface HeaderProps {
|
|
60
62
|
|
61
63
|
navPosition?: 'start' | 'center' | 'end';
|
62
64
|
}
|
63
|
-
|
64
|
-
export type NavItem = { href: string; label: string };
|
package/dist/types/heading.ts
CHANGED
@@ -1,13 +1,13 @@
|
|
1
1
|
/**
|
2
2
|
* 表示文档中的标题结构
|
3
3
|
*/
|
4
|
-
export interface
|
5
|
-
|
6
|
-
|
4
|
+
export interface IHeadingType {
|
5
|
+
/** 标题深度,如 h1=1, h2=2, h3=3 等 */
|
6
|
+
depth: number;
|
7
7
|
|
8
|
-
|
9
|
-
|
8
|
+
/** 标题的唯一标识符,用于锚点链接 */
|
9
|
+
slug: string;
|
10
10
|
|
11
|
-
|
12
|
-
|
13
|
-
}
|
11
|
+
/** 标题文本内容 */
|
12
|
+
text: string;
|
13
|
+
}
|
package/dist/types/layout.ts
CHANGED
@@ -1,71 +1,71 @@
|
|
1
|
-
import type {
|
2
|
-
import type {
|
3
|
-
import type {
|
4
|
-
import type {
|
5
|
-
import type {
|
1
|
+
import type { IFooterProps } from './footer';
|
2
|
+
import type { IHeaderProps } from './header';
|
3
|
+
import type { IMainContentProps } from './main';
|
4
|
+
import type { IMetaProps } from './meta';
|
5
|
+
import type { ISidebarProps } from './sidebar';
|
6
6
|
|
7
|
-
export interface
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
7
|
+
export interface IAppLayoutProps {
|
8
|
+
/**
|
9
|
+
* 是否显示侧边栏
|
10
|
+
* @default true
|
11
|
+
*/
|
12
|
+
showSidebar?: boolean;
|
13
13
|
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
14
|
+
/**
|
15
|
+
* 是否显示页眉
|
16
|
+
* @default true
|
17
|
+
*/
|
18
|
+
showHeader?: boolean;
|
19
19
|
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
20
|
+
/**
|
21
|
+
* 是否显示页脚
|
22
|
+
* @default true
|
23
|
+
*/
|
24
|
+
showFooter?: boolean;
|
25
25
|
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
26
|
+
/**
|
27
|
+
* 自定义头部内容
|
28
|
+
*/
|
29
|
+
head?: astroHTML.JSX.Element;
|
30
30
|
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
31
|
+
/**
|
32
|
+
* 自定义头部内容
|
33
|
+
*/
|
34
|
+
headerConfig: IHeaderProps;
|
35
35
|
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
36
|
+
/**
|
37
|
+
* 侧边栏配置
|
38
|
+
*/
|
39
|
+
sidebarConfig: ISidebarProps;
|
40
40
|
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
41
|
+
/**
|
42
|
+
* 主内容配置
|
43
|
+
*/
|
44
|
+
mainContentConfig: IMainContentProps;
|
45
45
|
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
46
|
+
/**
|
47
|
+
* 页面类名
|
48
|
+
*/
|
49
|
+
class?: string;
|
50
50
|
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
51
|
+
/**
|
52
|
+
* 类名列表
|
53
|
+
*/
|
54
|
+
'class:list'?: any;
|
55
55
|
|
56
|
-
|
57
|
-
|
58
|
-
|
59
|
-
|
60
|
-
|
56
|
+
/**
|
57
|
+
* 调试模式,显示各个部分的边框
|
58
|
+
* @default false
|
59
|
+
*/
|
60
|
+
debug?: boolean;
|
61
61
|
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
62
|
+
/**
|
63
|
+
* 元数据配置
|
64
|
+
*/
|
65
|
+
metaConfig: IMetaProps;
|
66
66
|
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
|
71
|
-
}
|
67
|
+
/**
|
68
|
+
* 页脚相关配置
|
69
|
+
*/
|
70
|
+
footerConfig: IFooterProps;
|
71
|
+
}
|
package/dist/types/main.ts
CHANGED
@@ -1,69 +1,80 @@
|
|
1
|
-
export interface
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
1
|
+
export interface IMainContentProps {
|
2
|
+
/**
|
3
|
+
* 容器大小
|
4
|
+
* @default "md"
|
5
|
+
*/
|
6
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'full';
|
7
7
|
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
8
|
+
/**
|
9
|
+
* 水平内边距(通过 Container 组件的 padding 属性设置)
|
10
|
+
* @default "md"
|
11
|
+
*/
|
12
|
+
padding?: 'none' | 'sm' | 'md' | 'lg' | 'xl';
|
13
13
|
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
14
|
+
/**
|
15
|
+
* 布局方式
|
16
|
+
* @default 'column'
|
17
|
+
*/
|
18
|
+
layout?: 'row' | 'column';
|
19
19
|
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
20
|
+
/**
|
21
|
+
* 当前语言
|
22
|
+
*/
|
23
|
+
currentLocale?: string;
|
24
24
|
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
25
|
+
/**
|
26
|
+
* 垂直内边距
|
27
|
+
* @default "md"
|
28
|
+
*/
|
29
|
+
verticalPadding?:
|
30
|
+
| 'none'
|
31
|
+
| 'xs'
|
32
|
+
| 'sm'
|
33
|
+
| 'md'
|
34
|
+
| 'lg'
|
35
|
+
| 'xl'
|
36
|
+
| '2xl'
|
37
|
+
| '3xl'
|
38
|
+
| '4xl'
|
39
|
+
| '5xl'
|
40
|
+
| string;
|
30
41
|
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
42
|
+
/**
|
43
|
+
* 是否居中显示内容
|
44
|
+
* @default true
|
45
|
+
*/
|
46
|
+
centered?: boolean;
|
36
47
|
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
48
|
+
/**
|
49
|
+
* 是否为文章布局
|
50
|
+
* @default false
|
51
|
+
*/
|
52
|
+
isArticle?: boolean;
|
42
53
|
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
54
|
+
/**
|
55
|
+
* 是否显示目录
|
56
|
+
* @default false
|
57
|
+
*/
|
58
|
+
showTableOfContents?: boolean;
|
48
59
|
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
60
|
+
/**
|
61
|
+
* 背景颜色
|
62
|
+
* @default undefined
|
63
|
+
*/
|
64
|
+
backgroundColor?: 'primary' | 'secondary' | 'tertiary' | 'light' | 'dark' | string;
|
54
65
|
|
55
|
-
|
56
|
-
|
57
|
-
|
58
|
-
|
66
|
+
/**
|
67
|
+
* HTML id 属性
|
68
|
+
*/
|
69
|
+
id?: string;
|
59
70
|
|
60
|
-
|
61
|
-
|
62
|
-
|
63
|
-
|
71
|
+
/**
|
72
|
+
* 类名
|
73
|
+
*/
|
74
|
+
class?: string;
|
64
75
|
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
76
|
+
/**
|
77
|
+
* 类名列表
|
78
|
+
*/
|
79
|
+
'class:list'?: any;
|
69
80
|
}
|
package/dist/types/meta.ts
CHANGED
@@ -1,50 +1,50 @@
|
|
1
|
-
export interface
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
1
|
+
export interface IMetaProps {
|
2
|
+
title: string;
|
3
|
+
description: string;
|
4
|
+
keywords: string;
|
5
|
+
author: string;
|
6
|
+
robots: string;
|
7
|
+
|
8
|
+
/**
|
9
|
+
* 基础路径,用于处理网站部署在二级目录的情况
|
10
|
+
* @default ""
|
11
|
+
*/
|
12
|
+
basePath?: string;
|
13
|
+
|
14
|
+
/**
|
15
|
+
* 站点名称
|
16
|
+
*/
|
17
|
+
siteName?: string;
|
18
|
+
|
19
|
+
/**
|
20
|
+
* 页面语言
|
21
|
+
* @default "zh-CN"
|
22
|
+
*/
|
23
|
+
lang?: string;
|
24
|
+
|
25
|
+
/**
|
26
|
+
* 是否包含视口元标签
|
27
|
+
* @default true
|
28
|
+
*/
|
29
|
+
viewport?: boolean;
|
30
|
+
|
31
|
+
/**
|
32
|
+
* 自定义CSS
|
33
|
+
*/
|
34
|
+
customStyles?: string;
|
35
|
+
|
36
|
+
/**
|
37
|
+
* 自定义头部内容
|
38
|
+
*/
|
39
|
+
head?: astroHTML.JSX.Element;
|
40
|
+
|
41
|
+
/**
|
42
|
+
* 页面类名
|
43
|
+
*/
|
44
|
+
class?: string;
|
45
|
+
|
46
|
+
/**
|
47
|
+
* 类名列表
|
48
|
+
*/
|
49
|
+
'class:list'?: any;
|
50
50
|
}
|
@@ -0,0 +1 @@
|
|
1
|
+
export type INavItem = { href: string; label: string };
|
package/dist/types/sidebar.ts
CHANGED
@@ -1,36 +1,39 @@
|
|
1
1
|
/**
|
2
2
|
* 侧边栏项目
|
3
3
|
*/
|
4
|
-
export interface
|
5
|
-
|
6
|
-
|
7
|
-
|
4
|
+
export interface ISidebarItem {
|
5
|
+
href: string;
|
6
|
+
text: string;
|
7
|
+
items?: ISidebarItem[];
|
8
8
|
}
|
9
9
|
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
10
|
+
/**
|
11
|
+
* 侧边栏配置
|
12
|
+
*/
|
13
|
+
export interface ISidebarProps {
|
14
|
+
/**
|
15
|
+
* 侧边栏项目
|
16
|
+
*/
|
17
|
+
sidebarItems: ISidebarItem[];
|
15
18
|
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
19
|
+
/**
|
20
|
+
* 桌面端类名
|
21
|
+
*/
|
22
|
+
class?: string;
|
20
23
|
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
24
|
+
/**
|
25
|
+
* 是否开启调试模式,显示边框
|
26
|
+
* @default false
|
27
|
+
*/
|
28
|
+
debug?: boolean;
|
26
29
|
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
30
|
+
/**
|
31
|
+
* 侧边栏顶部外边距
|
32
|
+
*/
|
33
|
+
marginTop?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | string;
|
31
34
|
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
35
|
+
/**
|
36
|
+
* 侧边栏底部外边距
|
37
|
+
*/
|
38
|
+
marginBottom?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | string;
|
36
39
|
}
|