Skip to content

Commit 5f77d15

Browse files
caixwcaixw
committed
feat(components): 通知和警告框添加了操作按钮
1 parent 958fbc5 commit 5f77d15

20 files changed

Lines changed: 445 additions & 421 deletions

File tree

‎apps/docs/biome.jsonc‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
// SPDX-License-Identifier: MIT
44

55
{
6-
"$schema": "https://biomejs.dev/schemas/2.5.4/schema.json",
6+
"$schema": "https://biomejs.dev/schemas/2.5.5/schema.json",
77
"extends": "//",
88
"root": false,
99
"files": {

‎apps/docs/src/apidoc/api.tsx‎

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -33,30 +33,30 @@ export function APIDoc(props: { api: Type }): JSX.Element {
3333
<span class={styles.pkg}>{props.api.pkg}</span>
3434
</summary>
3535
<div class={styles.body}>
36-
<Show when={props.api.summary}>{summary => <Markdown tag="p" text={summary()} />}</Show>
37-
<Show when={props.api.remarks}>{remarks => <Markdown tag="p" class={styles.remarks} text={remarks()} />}</Show>
38-
39-
<Switch>
40-
<Match when={props.api.kind === 'literal' ? props.api : undefined}>
41-
{literal => <LiteralBody literal={literal()} />}
42-
</Match>
43-
<Match when={props.api.kind === 'class' ? props.api : undefined}>{cls => <ClassBody cls={cls()} />}</Match>
44-
<Match when={props.api.kind === 'interface' ? props.api : undefined}>
45-
{intf => <InterfaceBody intf={intf()} />}
46-
</Match>
47-
<Match when={props.api.kind === 'function' ? props.api : undefined}>
48-
{func => <FunctionBody func={func()} />}
49-
</Match>
50-
<Match when={props.api.kind === 'union' ? props.api : undefined}>
51-
{union => <UnionBody union={union()} />}
52-
</Match>
53-
<Match when={props.api.kind === 'intersection' ? props.api : undefined}>
54-
{intersection => <IntersectionBody intersection={intersection()} />}
55-
</Match>
56-
<Match when={props.api.kind === 'tuple' ? props.api : undefined}>
57-
{tuple => <TupleBody tuple={tuple()} />}
58-
</Match>
59-
</Switch>
36+
<Show when={props.api.summary}>{summary => <Markdown tag="p" text={summary()} />}</Show>
37+
<Show when={props.api.remarks}>{remarks => <Markdown tag="p" class={styles.remarks} text={remarks()} />}</Show>
38+
39+
<Switch>
40+
<Match when={props.api.kind === 'literal' ? props.api : undefined}>
41+
{literal => <LiteralBody literal={literal()} />}
42+
</Match>
43+
<Match when={props.api.kind === 'class' ? props.api : undefined}>{cls => <ClassBody cls={cls()} />}</Match>
44+
<Match when={props.api.kind === 'interface' ? props.api : undefined}>
45+
{intf => <InterfaceBody intf={intf()} />}
46+
</Match>
47+
<Match when={props.api.kind === 'function' ? props.api : undefined}>
48+
{func => <FunctionBody func={func()} />}
49+
</Match>
50+
<Match when={props.api.kind === 'union' ? props.api : undefined}>
51+
{union => <UnionBody union={union()} />}
52+
</Match>
53+
<Match when={props.api.kind === 'intersection' ? props.api : undefined}>
54+
{intersection => <IntersectionBody intersection={intersection()} />}
55+
</Match>
56+
<Match when={props.api.kind === 'tuple' ? props.api : undefined}>
57+
{tuple => <TupleBody tuple={tuple()} />}
58+
</Match>
59+
</Switch>
6060
</div>
6161
</details>
6262
);

‎apps/docs/src/components/demo/config/options/api.zh-Hans.json‎

Lines changed: 47 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,48 @@
2121
"type": "Component<ThemeProps> | undefined",
2222
"def": "`~icons/cmfx/loading`\n\n"
2323
},
24+
{
25+
"name": "schemes",
26+
"summary": "支持的主题列表\n\n",
27+
"remarks": "`schemes`\n下定义部分主题可以直接在此处使用。\n\n",
28+
"type": "Map<string, Scheme> | undefined",
29+
"def": "`new Map()`\n\n"
30+
},
31+
{
32+
"name": "messages",
33+
"summary": "当前支持的语言列表以及加载方法\n\n",
34+
"type": "Record<string, DictLoader[]>"
35+
},
36+
{
37+
"name": "title",
38+
"summary": "网站的标题\n\n",
39+
"remarks": "如果不为空，会和\n`titleSeparator`\n组成页面标题的后缀。\n\n",
40+
"type": "string"
41+
},
42+
{
43+
"name": "titleSeparator",
44+
"summary": "网页标题的分隔符\n\n",
45+
"type": "string | undefined",
46+
"def": "' - '\n\n"
47+
},
48+
{
49+
"name": "pageSizes",
50+
"summary": "分页符中页码选项的默认值\n\n",
51+
"type": "number[] | undefined",
52+
"def": "[10, 20, 50, 100]\n\n"
53+
},
54+
{
55+
"name": "pageSize",
56+
"summary": "表格等需要分页对象的每页默认数量\n\n",
57+
"type": "number | undefined",
58+
"def": "20\n\n"
59+
},
60+
{
61+
"name": "problemHandler",
62+
"summary": "对\n`Problem`\n的处理函数\n\n",
63+
"type": "ProblemHandler<never> | undefined",
64+
"def": "`handleProblem`\n\n"
65+
},
2466
{
2567
"name": "fontSize",
2668
"summary": "字体大小，当在\n`config`\n中存在时，当前值将被忽略。\n\n",
@@ -33,25 +75,12 @@
3375
"type": "string | Scheme | undefined",
3476
"def": "schemes 的第一个元素或是从 html 读取对应的变量作为默认值\n\n"
3577
},
36-
{
37-
"name": "schemes",
38-
"summary": "支持的主题列表\n\n",
39-
"remarks": "`schemes`\n下定义部分主题可以直接在此处使用。\n\n",
40-
"type": "Map<string, Scheme> | undefined",
41-
"def": "`new Map()`\n\n"
42-
},
4378
{
4479
"name": "mode",
4580
"summary": "默认的主题模式，当在\n`config`\n中存在时，当前值将被忽略。\n\n",
4681
"type": "\"system\" | \"dark\" | \"light\" | undefined",
4782
"def": "'system'\n\n"
4883
},
49-
{
50-
"name": "palette",
51-
"summary": "默认的主题调色板，当在\n`config`\n中存在时，当前值将被忽略。\n\n",
52-
"type": "\"primary\" | \"secondary\" | \"tertiary\" | \"error\" | \"surface\" | undefined",
53-
"def": "'surface'\n\n"
54-
},
5584
{
5685
"name": "transitionDuration",
5786
"summary": "动画效果的时长，单位为 ms。当在\n`config`\n中存在时，当前值将被忽略。\n\n",
@@ -83,39 +112,10 @@
83112
"def": "5000\n\n"
84113
},
85114
{
86-
"name": "messages",
87-
"summary": "当前支持的语言列表以及加载方法\n\n",
88-
"type": "Record<string, DictLoader[]>"
89-
},
90-
{
91-
"name": "title",
92-
"summary": "网站的标题\n\n",
93-
"remarks": "如果不为空，会和\n`titleSeparator`\n组成页面标题的后缀。\n\n",
94-
"type": "string"
95-
},
96-
{
97-
"name": "titleSeparator",
98-
"summary": "网页标题的分隔符\n\n",
99-
"type": "string | undefined",
100-
"def": "' - '\n\n"
101-
},
102-
{
103-
"name": "pageSizes",
104-
"summary": "分页符中页码选项的默认值\n\n",
105-
"type": "number[] | undefined",
106-
"def": "[10, 20, 50, 100]\n\n"
107-
},
108-
{
109-
"name": "pageSize",
110-
"summary": "表格等需要分页对象的每页默认数量\n\n",
111-
"type": "number | undefined",
112-
"def": "20\n\n"
113-
},
114-
{
115-
"name": "problemHandler",
116-
"summary": "对\n`Problem`\n的处理函数\n\n",
117-
"type": "ProblemHandler<never> | undefined",
118-
"def": "`handleProblem`\n\n"
115+
"name": "notifyPosition",
116+
"summary": "通知的显示位置\n\n",
117+
"type": "\"top\" | \"bottom\" | undefined",
118+
"def": "'top'\n\n"
119119
}
120120
],
121121
"pkg": "@cmfx/components"
@@ -127,7 +127,7 @@
127127
"type": "function useOptions(): [accessor: OptionsAccessor, origin: ReqOptions]",
128128
"return": {
129129
"summary": "返回一个元组，包含以下属性：\n- 0: 提供对组件库选项的存取功能；\n- 1: 组件库选项的原始值；\n\n",
130-
"type": "[accessor: { switchConfig(id: string): void; reset(): void; setTitle(v: string): void; setFontSize(size: string): void; getFontSize(): string; setTransitionDuration(duration: number): void; getTransitionDuration(): number; setLocale(id: string): void; getLocale(): string; setDisplayStyle(style: DisplayStyle): void; getDisplayStyle(): DisplayStyle; setTimezone(tz: string): void; getTimezone(): string; setScheme(scheme: string | Scheme): void; getScheme(): Scheme; setMode(mode: Mode): void; getMode(): Mode; setStays(stay: number): void; getStays(): number; clearStorage(): void; }, origin: Required<Omit<Options, \"scheme\"> & { scheme: Scheme; }>]"
130+
"type": "[accessor: { switchConfig(id: string): void; reset(): void; setTitle(v: string): void; setFontSize(size: string): void; getFontSize(): string; setTransitionDuration(duration: number): void; getTransitionDuration(): number; setLocale(id: string): void; getLocale(): string; setDisplayStyle(style: DisplayStyle): void; getDisplayStyle(): DisplayStyle; setTimezone(tz: string): void; getTimezone(): string; setScheme(scheme: string | Scheme): void; getScheme(): Scheme; setMode(mode: Mode): void; getMode(): Mode; setStays(stay: number): void; getStays(): number; setNotifyPosition(position: NotifyPosition): void; getNotifyPosition(): NotifyPosition; clearStorage(): void; }, origin: Required<Omit<Options, \"scheme\"> & { scheme: Scheme; }>]"
131131
},
132132
"pkg": "@cmfx/components"
133133
},

‎apps/docs/src/components/demo/datetime/calendar/calendar.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export default function (props: MountProps): JSX.Element {
2727
<Num />
2828
</Portal>
2929

30-
<div class="h-[600px] w-full">
30+
<div class="h-150 w-full">
3131
<Calendar
3232
weekend={weekend()}
3333
weekBase={num()}

‎apps/docs/src/components/demo/datetime/calendar/lunar.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export default function (props: MountProps): JSX.Element {
2828
<Num />
2929
</Portal>
3030

31-
<div class="h-[600px] w-full">
31+
<div class="h-150 w-full">
3232
<Calendar
3333
weekend={weekend()}
3434
weekBase={num()}

‎apps/docs/src/components/demo/notify/alert.tsx‎

Lines changed: 9 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import type { JSX } from 'solid-js';
77
import { Portal } from 'solid-js/web';
88
import IconFace from '~icons/material-symbols/face';
99

10-
import { arraySelector, boolSelector, paletteSelector } from '@docs/components/base';
10+
import { arraySelector, paletteSelector } from '@docs/components/base';
1111

1212
export function typeSelector() {
1313
return arraySelector('types', Alert.types, 'success');
@@ -16,31 +16,32 @@ export function typeSelector() {
1616
export default function (props: MountProps): JSX.Element {
1717
const [Palette, palette] = paletteSelector();
1818
const [Type, typ] = typeSelector();
19-
const [Closable, closable] = boolSelector('closable');
2019

2120
return (
2221
<div class="flex w-full flex-col gap-2">
2322
<Portal mount={props.mount}>
2423
<Palette />
2524
<Type />
26-
<Closable />
2725
</Portal>
2826

29-
<Alert closable={closable()} palette={palette()} type={typ()} title="Alert Title" />
27+
<Alert palette={palette()} type={typ()} title="Alert Title" />
3028

3129
<Alert
32-
closable={closable()}
3330
palette={palette()}
3431
type={typ()}
3532
title="由 onclose 阻止"
3633
icon={<IconFace />}
37-
onClose={async () => {
38-
await Notify.notify('阻止了关闭操作!');
34+
onCancel={async () => {
35+
await Notify.notify('取消按钮阻止了关闭操作!');
36+
return true;
37+
}}
38+
onAccept={async () => {
39+
await Notify.success('确认按钮阻止了关闭操作！');
3940
return true;
4041
}}
4142
/>
4243

43-
<Alert closable={closable()} palette={palette()} type={typ()} title="Alert Title" icon={false} />
44+
<Alert onCancel={true} palette={palette()} type={typ()} title="Alert Title" icon={false} />
4445
</div>
4546
);
4647
}

0 commit comments

Comments
 (0)