Skip to content

Commit 8384c16

Browse files
sxzzsxzz
committed
docs: prepare for Vue 3.3
1 parent 0d9f9eb commit 8384c16

37 files changed

+207
-122
lines changed

‎docs/.vitepress/components/StabilityLevel.vue‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<script setup lang="ts">
2+
import { useData } from 'vitepress'
3+
defineProps<{
4+
level: 'stable' | 'experimental' | 'deprecated'
5+
}>()
6+
7+
const { lang } = useData()
8+
</script>
9+
10+
<template>
11+
<div mt2 flex="~ gap2">
12+
<small>
13+
{{ lang === 'zh-CN' ? '稳定性：' : 'Stability: ' }}
14+
<code v-if="level === 'stable'" class="!text-green-600">
15+
{{ lang === 'zh-CN' ? '稳定' : 'stable' }}
16+
</code>
17+
<code v-else-if="level === 'experimental'" class="!text-yellow-700">
18+
{{ lang === 'zh-CN' ? '实验性' : 'experimental' }}
19+
</code>
20+
</small>
21+
22+
<WarnBadge v-if="level === 'experimental'">
23+
{{
24+
lang === 'zh-CN'
25+
? '实验性功能，风险自负'
26+
: 'Experimental feature, use at your risk'
27+
}}
28+
</WarnBadge>
29+
</div>
30+
</template>

‎docs/.vitepress/locales/common.ts‎

Lines changed: 87 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -61,74 +61,109 @@ export const sidebar = (lang: string): DefaultTheme.SidebarItem[] => {
6161
text: 'All Macros',
6262
link: `${urlPrefix}/macros/`,
6363
},
64+
6465
{
65-
text: 'defineOptions',
66-
link: `${urlPrefix}/macros/define-options`,
67-
},
68-
{
69-
text: 'defineModel',
70-
link: `${urlPrefix}/macros/define-model`,
71-
},
72-
{
73-
text: 'defineProps',
74-
link: `${urlPrefix}/macros/define-props`,
75-
},
76-
{
77-
text: 'definePropsRefs',
78-
link: `${urlPrefix}/macros/define-props-refs`,
79-
},
80-
{
81-
text: 'defineSlots',
82-
link: `${urlPrefix}/macros/define-slots`,
83-
},
84-
{
85-
text: 'defineRender',
86-
link: `${urlPrefix}/macros/define-render`,
87-
},
88-
{
89-
text: 'shortEmits',
90-
link: `${urlPrefix}/macros/short-emits`,
91-
},
92-
{
93-
text: 'shortVmodel',
94-
link: `${urlPrefix}/macros/short-vmodel`,
95-
},
96-
{
97-
text: 'setupComponent',
98-
link: `${urlPrefix}/macros/setup-component`,
66+
text: 'Official',
67+
items: [
68+
{
69+
text: 'defineOptions',
70+
link: `${urlPrefix}/macros/define-options`,
71+
},
72+
{
73+
text: 'defineSlots',
74+
link: `${urlPrefix}/macros/define-slots`,
75+
},
76+
{
77+
text: 'defineModel',
78+
link: `${urlPrefix}/macros/define-model`,
79+
},
80+
{
81+
text: 'shortEmits',
82+
link: `${urlPrefix}/macros/short-emits`,
83+
},
84+
],
9985
},
86+
10087
{
101-
text: 'setupSFC',
102-
link: `${urlPrefix}/macros/setup-sfc`,
88+
text: 'Stable',
89+
items: [
90+
{
91+
text: 'defineProps',
92+
link: `${urlPrefix}/macros/define-props`,
93+
},
94+
{
95+
text: 'definePropsRefs',
96+
link: `${urlPrefix}/macros/define-props-refs`,
97+
},
98+
{
99+
text: 'defineRender',
100+
link: `${urlPrefix}/macros/define-render`,
101+
},
102+
{
103+
text: 'shortVmodel',
104+
link: `${urlPrefix}/macros/short-vmodel`,
105+
},
106+
],
103107
},
108+
104109
{
105-
text: 'singleDefine',
106-
link: `${urlPrefix}/macros/single-define`,
110+
text: 'Experimental',
111+
items: [
112+
{
113+
text: 'singleDefine',
114+
link: `${urlPrefix}/macros/single-define`,
115+
},
116+
{
117+
text: 'setupComponent',
118+
link: `${urlPrefix}/macros/setup-component`,
119+
},
120+
{
121+
text: 'setupSFC',
122+
link: `${urlPrefix}/macros/setup-sfc`,
123+
},
124+
],
107125
},
108126
],
109127
},
110128
{
111129
text: 'Features',
112130
items: [
113131
{
114-
text: 'hoistStatic',
115-
link: `${urlPrefix}/features/hoist-static`,
116-
},
117-
{
118-
text: 'namedTemplate',
119-
link: `${urlPrefix}/features/named-template`,
120-
},
121-
{
122-
text: 'betterDefine',
123-
link: `${urlPrefix}/features/better-define`,
132+
text: 'Official',
133+
items: [
134+
{
135+
text: 'hoistStatic',
136+
link: `${urlPrefix}/features/hoist-static`,
137+
},
138+
],
124139
},
140+
125141
{
126-
text: 'exportProps',
127-
link: `${urlPrefix}/features/export-props`,
142+
text: 'Stable',
143+
items: [
144+
{
145+
text: 'betterDefine',
146+
link: `${urlPrefix}/features/better-define`,
147+
},
148+
{
149+
text: 'reactivityTransform',
150+
link: `${urlPrefix}/features/reactivity-transform`,
151+
},
152+
],
128153
},
154+
129155
{
130-
text: 'reactivityTransform',
131-
link: `${urlPrefix}/features/reactivity-transform`,
156+
text: 'Experimental',
157+
items: [
158+
{
159+
text: 'namedTemplate',
160+
link: `${urlPrefix}/features/named-template`,
161+
},
162+
{
163+
text: 'exportProps',
164+
link: `${urlPrefix}/features/export-props`,
165+
},
166+
],
132167
},
133168
],
134169
},

‎docs/.vitepress/theme/index.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { h } from 'vue'
22
import Theme from 'vitepress/theme'
33
import HomePage from '../components/HomePage.vue'
44
import WarnBadge from '../components/WarnBadge.vue'
5+
import StabilityLevel from '../components/StabilityLevel.vue'
56
import 'uno.css'
67
import './style.css'
78

@@ -16,5 +17,6 @@ export default {
1617
},
1718
enhanceApp({ app }: EnhanceAppContext) {
1819
app.component('WarnBadge', WarnBadge)
20+
app.component('StabilityLevel', StabilityLevel)
1921
},
2022
}

‎docs/features/better-define.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# betterDefine
22

3-
<small>Stability: <code class="!text-green-600">stable</code></small>
3+
<StabilityLevel level="stable" />
44

55
With enabling `betterDefine`, imported types are supported in `<script setup>` type-based-macros.
66

‎docs/features/export-props.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# exportProps
22

3-
<small py2>Stability: <code class="!text-red-600">experimental</code></small>
3+
<StabilityLevel level="experimental" />
44

55
[Svelte-like Declaring props](https://svelte.dev/docs#component-format-script-1-export-creates-a-component-prop) for Vue.
66

‎docs/features/hoist-static.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# hoistStatic
22

3-
<small>Stability: <code class="!text-green-600">stable</code></small>
3+
<StabilityLevel level="stable" />
44

55
With enabling `hoistStatic`, constants declared in macros of `<script setup>` can be referenced.
66

‎docs/features/named-template.md‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
11
# namedTemplate
22

3-
<div py2 flex>
4-
<small>Stability: <code class="!text-red-600">experimental</code></small>
5-
<WarnBadge>Experimental, use at your risk</WarnBadge>
6-
</div>
3+
<StabilityLevel level="experimental" />
74

85
With enabling `namedTemplate`, `<template>` can be referenced like a variable.
96

‎docs/features/reactivity-transform.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Reactivity Transform
22

3-
<small>Stability: <code class="!text-green-600">stable</code></small>
3+
<StabilityLevel level="stable" />
44

55
| Features | Supported |
66
| :----------------: | :----------------: |

‎docs/macros/define-model.md‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
# defineModel
22

3-
<small>Stability: <code class="!text-green-600">stable</code></small>
3+
<StabilityLevel level="stable" />
44

55
Declaring and mutate `v-model` props as the same as normal variable using the `defineModel`.
66

7+
For Vue >= 3.3, this feature will be turned off by default.
8+
79
| Features | Supported |
810
| :----------: | :----------------: |
911
| Vue 3 | :white_check_mark: |

‎docs/macros/define-options.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# defineOptions
22

3-
<small>Stability: <code class="!text-green-600">stable</code></small>
3+
<StabilityLevel level="stable" />
44

55
Options API can be declared using the `defineOptions` in `<script setup>`, specifically to be able to set `name`, `props`, `emits`, and `render` inside of one function.
66

0 commit comments

Comments
 (0)