@opentiny/vue-docs 3.19.6 → 3.19.7
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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@opentiny/vue-docs",
|
|
3
|
-
"version": "3.19.
|
|
3
|
+
"version": "3.19.7",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"dependencies": {
|
|
6
6
|
"@opentiny/vue-repl": "^1.1.2",
|
|
@@ -16,18 +16,18 @@
|
|
|
16
16
|
"vue": "^3.4.31",
|
|
17
17
|
"vue-i18n": "^9.1.10",
|
|
18
18
|
"vue-router": "4.1.5",
|
|
19
|
-
"@opentiny/vue": "~3.19.0",
|
|
20
19
|
"@opentiny/vue-common": "~3.19.0",
|
|
21
|
-
"@opentiny/vue
|
|
20
|
+
"@opentiny/vue": "~3.19.0",
|
|
22
21
|
"@opentiny/vue-design-aurora": "~3.19.0",
|
|
23
|
-
"@opentiny/vue-
|
|
24
|
-
"@opentiny/vue-hooks": "~3.19.0",
|
|
22
|
+
"@opentiny/vue-directive": "~3.19.0",
|
|
25
23
|
"@opentiny/vue-design-saas": "~3.19.0",
|
|
24
|
+
"@opentiny/vue-hooks": "~3.19.0",
|
|
25
|
+
"@opentiny/vue-icon-saas": "~3.19.0",
|
|
26
|
+
"@opentiny/vue-icon-multicolor": "~3.19.0",
|
|
26
27
|
"@opentiny/vue-icon": "~3.19.0",
|
|
27
|
-
"@opentiny/vue-directive": "~3.19.0",
|
|
28
|
-
"@opentiny/vue-theme": "~3.19.5",
|
|
29
28
|
"@opentiny/vue-theme-mobile": "~3.19.0",
|
|
30
29
|
"@opentiny/vue-vite-import": "~1.2.0",
|
|
30
|
+
"@opentiny/vue-theme": "~3.19.5",
|
|
31
31
|
"@opentiny/vue-theme-saas": "~3.19.0"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
<span class="docs-header-spacer"></span>
|
|
18
18
|
</header>
|
|
19
19
|
<div class="docs-content" id="doc-layout-scoller">
|
|
20
|
-
<div class="ti-
|
|
20
|
+
<div class="ti-rel cmp-container">
|
|
21
21
|
<div class="flex-horizontal docs-content-main">
|
|
22
22
|
<div class="docs-tabs-wrap">
|
|
23
23
|
<div v-if="['interfaces', 'types', 'classes'].includes(cmpId)" id="TS" class="all-api-container">
|
|
@@ -36,60 +36,62 @@
|
|
|
36
36
|
<div class="ti-f18 ti-py28" :id="`${oneGroup.name}--${key}`">
|
|
37
37
|
{{ key }}
|
|
38
38
|
</div>
|
|
39
|
-
<
|
|
40
|
-
<tiny-grid-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
<
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
<
|
|
52
|
-
<
|
|
53
|
-
<
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
<
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
<
|
|
89
|
-
<
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
39
|
+
<div class="api-table-box">
|
|
40
|
+
<tiny-grid class="api-table" :data="tableData[oneGroup.name][key]" :expand-config="apiExpandConf">
|
|
41
|
+
<tiny-grid-column
|
|
42
|
+
v-if="tableData[oneGroup.name][key][0]?.type"
|
|
43
|
+
class-name="api-table-expand-col"
|
|
44
|
+
type="expand"
|
|
45
|
+
width="32"
|
|
46
|
+
>
|
|
47
|
+
<template #default="{ row }">
|
|
48
|
+
<async-highlight v-if="row.code" :code="row.code.trim()" types="ts"></async-highlight>
|
|
49
|
+
</template>
|
|
50
|
+
</tiny-grid-column>
|
|
51
|
+
<tiny-grid-column field="name" :title="i18nByKey('name')" :width="columnWidth[key][0]">
|
|
52
|
+
<template #default="{ row }">
|
|
53
|
+
<span class="api-table-name">
|
|
54
|
+
<a v-if="row.demoId" @click="jumpToDemo(row.demoId)">{{ row.name }}</a>
|
|
55
|
+
<span v-else>{{ row.name }}</span>
|
|
56
|
+
</span>
|
|
57
|
+
<version-tip
|
|
58
|
+
v-if="row.meta || row.versionTipOption"
|
|
59
|
+
:meta="row.meta"
|
|
60
|
+
v-bind="row.versionTipOption"
|
|
61
|
+
render-type="tag"
|
|
62
|
+
tip-subject="api"
|
|
63
|
+
>
|
|
64
|
+
</version-tip>
|
|
65
|
+
</template>
|
|
66
|
+
</tiny-grid-column>
|
|
67
|
+
<tiny-grid-column
|
|
68
|
+
v-if="tableData[oneGroup.name][key][0]?.type"
|
|
69
|
+
field="type"
|
|
70
|
+
:title="i18nByKey('propType')"
|
|
71
|
+
:width="columnWidth[key][1]"
|
|
72
|
+
>
|
|
73
|
+
<template #default="{ row }">
|
|
74
|
+
<a
|
|
75
|
+
v-if="row.typeAnchorName"
|
|
76
|
+
:href="`${row.typeAnchorName.indexOf('#') === -1 ? '#' : ''}${row.typeAnchorName}`"
|
|
77
|
+
v-html="row.type"
|
|
78
|
+
></a>
|
|
79
|
+
<span v-else v-html="row.type"></span>
|
|
80
|
+
</template>
|
|
81
|
+
</tiny-grid-column>
|
|
82
|
+
<tiny-grid-column
|
|
83
|
+
v-if="key === 'props'"
|
|
84
|
+
field="defaultValue"
|
|
85
|
+
:title="i18nByKey('defValue')"
|
|
86
|
+
:width="columnWidth[key][2]"
|
|
87
|
+
></tiny-grid-column>
|
|
88
|
+
<tiny-grid-column field="desc" :title="i18nByKey('desc')">
|
|
89
|
+
<template #default="data">
|
|
90
|
+
<span v-html="data.row.desc"></span>
|
|
91
|
+
</template>
|
|
92
|
+
</tiny-grid-column>
|
|
93
|
+
</tiny-grid>
|
|
94
|
+
</div>
|
|
93
95
|
</template>
|
|
94
96
|
</div>
|
|
95
97
|
</div>
|
|
@@ -142,7 +144,7 @@
|
|
|
142
144
|
<div id="API" class="all-api-container">
|
|
143
145
|
<div class="ti-f-c ti-f-wrap api-list">
|
|
144
146
|
<!-- apis 是一个数组 {name,type,properties:[原table内容],events:[] ...........} -->
|
|
145
|
-
<div class="mt20" v-for="oneGroup in currJson.apis" :key="oneGroup.name">
|
|
147
|
+
<div class="mt20 wp100" v-for="oneGroup in currJson.apis" :key="oneGroup.name">
|
|
146
148
|
<div class="ti-f-r ti-f-pos-start ti-fw-bold">
|
|
147
149
|
<div :id="`cmp-${oneGroup.name}`" class="ti-f18">
|
|
148
150
|
{{ oneGroup.name }}
|
|
@@ -156,73 +158,75 @@
|
|
|
156
158
|
<div class="ti-f18 ti-py28" :id="`${oneGroup.name}--${key}`">
|
|
157
159
|
{{ key }}
|
|
158
160
|
</div>
|
|
159
|
-
<
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
<
|
|
168
|
-
<
|
|
169
|
-
v-if="row.code"
|
|
170
|
-
:code="row.code.trim()"
|
|
171
|
-
:types="chartCode ? 'html' : 'ts'"
|
|
172
|
-
></async-highlight>
|
|
173
|
-
<div v-if="row.depTypes">
|
|
161
|
+
<div class="api-table-box">
|
|
162
|
+
<tiny-grid
|
|
163
|
+
ref="apiTableRef"
|
|
164
|
+
class="api-table"
|
|
165
|
+
:data="tableData[oneGroup.name][key]"
|
|
166
|
+
:expand-config="apiExpandConf"
|
|
167
|
+
row-id="name"
|
|
168
|
+
>
|
|
169
|
+
<tiny-grid-column class-name="api-table-expand-col" type="expand" width="32">
|
|
170
|
+
<template #default="{ row }">
|
|
174
171
|
<async-highlight
|
|
175
|
-
v-
|
|
176
|
-
:
|
|
177
|
-
:
|
|
178
|
-
types="ts"
|
|
172
|
+
v-if="row.code"
|
|
173
|
+
:code="row.code.trim()"
|
|
174
|
+
:types="chartCode ? 'html' : 'ts'"
|
|
179
175
|
></async-highlight>
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
</
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
<
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
176
|
+
<div v-if="row.depTypes">
|
|
177
|
+
<async-highlight
|
|
178
|
+
v-for="(k, i) in row.depTypes"
|
|
179
|
+
:key="i"
|
|
180
|
+
:code="currJson.types[k]?.code"
|
|
181
|
+
types="ts"
|
|
182
|
+
></async-highlight>
|
|
183
|
+
</div>
|
|
184
|
+
</template>
|
|
185
|
+
</tiny-grid-column>
|
|
186
|
+
<tiny-grid-column field="name" :title="i18nByKey('name')" :width="columnWidth[key][0]">
|
|
187
|
+
<template #default="{ row }">
|
|
188
|
+
<span class="api-table-name">
|
|
189
|
+
<a v-if="row.demoId" @click="jumpToDemo(row.demoId)">{{ row.name }}</a>
|
|
190
|
+
<span v-else>{{ row.name }}</span>
|
|
191
|
+
</span>
|
|
192
|
+
<version-tip
|
|
193
|
+
v-if="row.meta || row.versionTipOption"
|
|
194
|
+
:meta="row.meta"
|
|
195
|
+
v-bind="row.versionTipOption"
|
|
196
|
+
render-type="tag"
|
|
197
|
+
tip-subject="api"
|
|
198
|
+
>
|
|
199
|
+
</version-tip>
|
|
200
|
+
</template>
|
|
201
|
+
</tiny-grid-column>
|
|
202
|
+
<tiny-grid-column
|
|
203
|
+
v-if="tableData[oneGroup.name][key].find((i) => i.type)"
|
|
204
|
+
field="type"
|
|
205
|
+
:title="i18nByKey('propType')"
|
|
206
|
+
:width="columnWidth[key][1]"
|
|
207
|
+
>
|
|
208
|
+
<template #default="{ row }">
|
|
209
|
+
<span
|
|
210
|
+
:class="{ 'type-link': row.typeAnchorName || row.linkTo }"
|
|
211
|
+
:id="row.typeAnchorName ? row.type : ''"
|
|
212
|
+
@click="toOuterType(row)"
|
|
213
|
+
>{{ row.type }} <icon-outer-link v-if="row.linkTo"></icon-outer-link
|
|
214
|
+
></span>
|
|
215
|
+
</template>
|
|
216
|
+
</tiny-grid-column>
|
|
217
|
+
<tiny-grid-column
|
|
218
|
+
v-if="key === 'props' || key === 'options'"
|
|
219
|
+
field="defaultValue"
|
|
220
|
+
:title="i18nByKey('defValue')"
|
|
221
|
+
:width="columnWidth[key][2]"
|
|
222
|
+
></tiny-grid-column>
|
|
223
|
+
<tiny-grid-column field="desc" :title="i18nByKey('desc')">
|
|
224
|
+
<template #default="data">
|
|
225
|
+
<span v-html="data.row.desc"></span>
|
|
226
|
+
</template>
|
|
227
|
+
</tiny-grid-column>
|
|
228
|
+
</tiny-grid>
|
|
229
|
+
</div>
|
|
226
230
|
</template>
|
|
227
231
|
</div>
|
|
228
232
|
</div>
|
|
@@ -235,12 +239,10 @@
|
|
|
235
239
|
<div class="cmp-page-anchor catalog" v-if="currAnchorLinks.length">
|
|
236
240
|
<tiny-anchor
|
|
237
241
|
id="anchor"
|
|
238
|
-
:offset-top="156"
|
|
239
242
|
:links="currAnchorLinks"
|
|
240
243
|
:key="anchorRefreshKey"
|
|
241
244
|
:is-affix="anchorAffix"
|
|
242
245
|
type="dot"
|
|
243
|
-
mask-class="custom-active-anchor"
|
|
244
246
|
container-id="#doc-layout-scoller"
|
|
245
247
|
@link-click="handleAnchorClick"
|
|
246
248
|
>
|
|
@@ -486,8 +488,10 @@ export default defineComponent({
|
|
|
486
488
|
scrollTarget = document.querySelector(`#${hash}`)
|
|
487
489
|
} catch (err) {}
|
|
488
490
|
if (scrollTarget && !isRunningTest) {
|
|
491
|
+
// doc-layout-scoller(滚动) > tabs > tab-content(relative)， 造成 scrollTarget.offsetTop 是相对于 tab-content的距离
|
|
492
|
+
// 所以滚动需要修正 tab-title的占位高度才行
|
|
489
493
|
document.getElementById('doc-layout-scoller').scrollTo({
|
|
490
|
-
top: scrollTarget.offsetTop,
|
|
494
|
+
top: scrollTarget.offsetTop + 52,
|
|
491
495
|
left: 0,
|
|
492
496
|
behavior: 'smooth'
|
|
493
497
|
})
|
|
@@ -767,9 +771,6 @@ export default defineComponent({
|
|
|
767
771
|
|
|
768
772
|
<style lang="less" scoped>
|
|
769
773
|
.docs-header {
|
|
770
|
-
position: sticky;
|
|
771
|
-
top: 0;
|
|
772
|
-
z-index: var(--docs-header-zindex);
|
|
773
774
|
padding: 16px 40px;
|
|
774
775
|
background-color: #fff;
|
|
775
776
|
box-shadow: 12px 0 20px 6px rgba(0, 0, 0, 0.06);
|
|
@@ -815,6 +816,7 @@ export default defineComponent({
|
|
|
815
816
|
transition: all ease-in-out 0.3s;
|
|
816
817
|
|
|
817
818
|
.docs-tabs-wrap {
|
|
819
|
+
width: 100%;
|
|
818
820
|
flex: 1;
|
|
819
821
|
display: flex;
|
|
820
822
|
justify-content: center;
|
|
@@ -866,11 +868,18 @@ export default defineComponent({
|
|
|
866
868
|
}
|
|
867
869
|
}
|
|
868
870
|
|
|
871
|
+
.api-table-box {
|
|
872
|
+
border-left: 1px solid rgb(239, 239, 245);
|
|
873
|
+
border-right: 1px solid rgb(239, 239, 245);
|
|
874
|
+
overflow-x: auto;
|
|
875
|
+
width: 100%;
|
|
876
|
+
}
|
|
877
|
+
|
|
869
878
|
.api-table {
|
|
870
879
|
width: 100%;
|
|
880
|
+
min-width: 640px;
|
|
871
881
|
table-layout: fixed;
|
|
872
882
|
border-collapse: collapse;
|
|
873
|
-
border: 1px solid rgb(239, 239, 245);
|
|
874
883
|
|
|
875
884
|
a,
|
|
876
885
|
.type-link {
|
|
@@ -959,7 +968,7 @@ export default defineComponent({
|
|
|
959
968
|
.all-demos-container,
|
|
960
969
|
.all-api-container {
|
|
961
970
|
flex: 1;
|
|
962
|
-
padding
|
|
971
|
+
padding: 32px 0;
|
|
963
972
|
scroll-behavior: smooth;
|
|
964
973
|
}
|
|
965
974
|
|
|
@@ -338,11 +338,12 @@ export default defineComponent({
|
|
|
338
338
|
}
|
|
339
339
|
|
|
340
340
|
#doc-layout {
|
|
341
|
-
width: 100%;
|
|
342
|
-
height: calc(100vh - 60px);
|
|
343
|
-
flex-grow: 1;
|
|
344
341
|
display: flex;
|
|
345
342
|
flex-direction: column;
|
|
343
|
+
flex-grow: 1;
|
|
344
|
+
overflow: hidden auto;
|
|
345
|
+
width: 100%;
|
|
346
|
+
height: calc(100vh - 60px);
|
|
346
347
|
}
|
|
347
348
|
|
|
348
349
|
.api-type-box {
|