Apidoc emit-prop type navigate completed

pull/3711/head
Bahadır Sofuoğlu 2023-03-04 16:43:35 +03:00
parent 22077da98c
commit df4d30c4cd
5 changed files with 89 additions and 27 deletions

View File

@ -171,7 +171,6 @@ export interface DataTableFilterEvent extends DataTableSortEvent {
/**
* Custom row click event.
* @event
*/
export interface DataTableRowClickEvent {
/**
@ -204,7 +203,7 @@ export interface DataTableRowContextMenuEvent extends DataTableRowClickEvent {}
/**
* Custom row select event.
* @event
*
*/
export interface DataTableRowSelectEvent {
/**
@ -234,7 +233,7 @@ export interface DataTableRowUnselectEvent extends DataTableRowSelectEvent {}
/**
* Custom row select all event.
* @event
*
*/
export interface DataTableRowSelectAllEvent {
/**
@ -249,7 +248,7 @@ export interface DataTableRowSelectAllEvent {
/**
* Custom row unselect all event.
* @event
*
*/
export interface DataTableRowUnselectAllEvent {
/**
@ -260,7 +259,7 @@ export interface DataTableRowUnselectAllEvent {
/**
* Custom row select all change event.
* @event
*
*/
export interface DataTableSelectAllChangeEvent {
/**
@ -275,7 +274,7 @@ export interface DataTableSelectAllChangeEvent {
/**
* Custom row resize end event.
* @event
*
*/
export interface DataTableColumnResizeEndEvent {
/**
@ -290,7 +289,7 @@ export interface DataTableColumnResizeEndEvent {
/**
* Custom row column reorder event.
* @event
*
*/
export interface DataTableColumnReorderEvent {
/**
@ -309,7 +308,7 @@ export interface DataTableColumnReorderEvent {
/**
* Custom row reorder event.
* @event
*
*/
export interface DataTableRowReorderEvent {
/**
@ -332,7 +331,7 @@ export interface DataTableRowReorderEvent {
/**
* Custom row expand event.
* @event
*
*/
export interface DataTableRowExpandEvent {
/**
@ -354,7 +353,7 @@ export interface DataTableRowCollapseEvent extends DataTableRowExpandEvent {}
/**
* Custom cell edit init event.
* @event
*
*/
export interface DataTableCellEditInitEvent {
/**
@ -378,14 +377,13 @@ export interface DataTableCellEditInitEvent {
/**
* Custom cell edit cancel event.
* @see cell-edit-init
* @todo
* @extends DataTableCellEditInitEvent
*/
export interface DataTableCellEditCancelEvent extends DataTableCellEditInitEvent {}
/**
* Custom cell edit complete event.
* @event
*
*/
export interface DataTableCellEditCompleteEvent {
/**
@ -424,7 +422,7 @@ export interface DataTableCellEditCompleteEvent {
/**
* Custom row edit complete event.
* @event
*
*/
export interface DataTableRowEditInitEvent {
/**
@ -465,7 +463,7 @@ export interface DataTableRowEditCancelEvent extends DataTableRowEditInitEvent {
/**
* Custom state event.
* @event
*
*/
export interface DataTableStateEvent {
/**

View File

@ -4,7 +4,7 @@
<h1>{{ header }} API</h1>
<p>API defines helper props, events and others for the PrimeVue {{ header }} module.</p>
</div>
<DocSections :docs="docs" />
<DocSections :docs="docs" :header="header" />
</div>
<DocSectionNav :docs="docs" />
</template>
@ -152,15 +152,18 @@ export default {
const data = [];
for (const emit of emits) {
const parameters = emit.parameters.reduce((acc, param) => {
/* const parameters = emit.parameters.reduce((acc, param) => {
acc.push(`${param.name}: ${param.type}`);
return acc;
}, []);
}, []); */
data.push({
name: emit.name,
parameters: parameters.join(', '),
parameters: {
name: emit.parameters[0]?.name,
type: emit.parameters[0]?.type
},
returnType: emit.returnType,
description: emit.description
});

View File

@ -1,7 +1,7 @@
<template>
<section class="pt-3">
<div :id="id">
<DocSectionText :id="id" :label="label">
<DocSectionText :id="id" :label="label" :level="componentLevel">
{{ description || null }}
<p v-if="relatedProp" class="inline-block">
See <i>{{ relatedProp }}</i>
@ -30,8 +30,22 @@
<i class="pi pi-link"></i>
</NuxtLink>
</span>
<template v-else-if="k === 'type'">
<template v-for="(value, i) in getType(v)" :key="value">
{{ i !== 0 ? ' |' : '' }}
<NuxtLink v-if="isLinkType(value)" :to="setLinkPath(value)" class="doc-option-link"> {{ value }} </NuxtLink>
<span v-else> {{ value }} </span>
</template>
</template>
<NuxtLink v-else-if="isLinkType(k, v)" :to="setLinkPath(v)" class="doc-option-link"> {{ v }} </NuxtLink>
<template v-else-if="k === 'parameters'">
<span v-if="v.name"> {{ v.name }} : </span>
<template v-for="(value, i) in getType(v.type)" :key="value">
{{ i !== 0 ? ' |' : '' }}
<NuxtLink v-if="isLinkType(value)" :to="setLinkPath(value)" class="doc-option-link"> {{ value }} </NuxtLink>
<span v-else> {{ value }} </span>
</template>
</template>
<span v-else :id="id + '.' + v">
{{ v }}
@ -45,7 +59,7 @@
<template v-if="data[0].data && data[0].data.length > 0">
<template v-for="childData in data" :key="childData">
<DocApiTable :id="childData.id" :data="childData.data" :label="childData.label" :description="childData.description" :relatedProp="childData.relatedProp" />
<DocApiTable :id="childData.id" :data="childData.data" :label="childData.label" :description="childData.description" :relatedProp="childData.relatedProp" :level="3" />
</template>
</template>
</section>
@ -68,21 +82,59 @@ export default {
},
relatedProp: {
type: String
},
level: {
type: Number,
default: 1
},
header: {
type: String,
default: null
}
},
methods: {
isLinkType(key, value) {
const primitiveTypes = ['string', 'number', 'boolean', 'object', 'array', 'function', 'symbol', 'null', 'undefined', 'any', 'Event'];
getType(value) {
const newValue = value?.split('|').map((item) => {
return item
.replace(/"/g, '')
.replace(/(\[|\]|<|>).*$/gm, '')
.trim();
});
return key === 'type' && !primitiveTypes.includes(value);
return newValue;
},
getParameters(value) {
const newValue = value.split(':').map((item) => {
return item
.replace(/"/g, '')
.replace(/(\[|\]|<|>).*$/gm, '')
.trim();
});
return this.getType(newValue[1]);
},
isLinkType(value) {
return value.includes(this.header);
},
setLinkPath(value) {
const currentRoute = this.$router.currentRoute.value.name;
const definationType = value.includes('Type') ? 'types' : 'interfaces';
const definationType = value.includes('Type') ? 'types' : value.includes('Event') ? 'events' : 'interfaces';
return `/${currentRoute}/#api.${currentRoute}.${definationType}.${value}`;
}
},
computed: {
componentLevel() {
if (this.label === 'Interfaces' || this.label === 'Events') {
return 2;
} else if (this.level === 3) {
return 3;
}
return this.data[0].data ? 1 : 2;
}
}
};
</script>

View File

@ -1,5 +1,5 @@
<template>
<component :is="$attrs.level === 2 ? 'h3' : 'h2'" class="doc-section-label">
<component :is="headerTag" class="doc-section-label">
{{ $attrs.label }}
<NuxtLink :id="$attrs.id" :to="`${checkRouteName}/#${$attrs.id}`" target="_self" @click="onClick"> # </NuxtLink>
</component>
@ -32,6 +32,15 @@ export default {
}
return path;
},
headerTag() {
if (this.$attrs.level === 3) {
return 'h4';
} else if (this.$attrs.level === 2) {
return 'h3';
}
return 'h2';
}
}
};

View File

@ -9,7 +9,7 @@
</div>
<template v-for="comp of doc.children" :key="comp.label">
{{ comp.relatedProp }}
<component :is="{ ...comp.component }" :id="comp.id" :label="comp.label" :data="comp.data" :description="comp.description" :level="2" />
<component :is="{ ...comp.component }" :id="comp.id" :label="comp.label" :data="comp.data" :description="comp.description" :level="2" :header="$attrs.header" />
</template>
</template>