Skip to content

Commit

Permalink
Fix issue primefaces#4601
Browse files Browse the repository at this point in the history
  • Loading branch information
jorgemunozc committed Oct 12, 2023
1 parent 7e3f513 commit 4f9691b
Showing 1 changed file with 29 additions and 14 deletions.
43 changes: 29 additions & 14 deletions components/doc/DocApiTable.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,8 @@
<DocSectionText :id="id" :label="label" :level="componentLevel">
<p>{{ description || null }}</p>
<p v-if="relatedProp" class="inline-block">
See <NuxtLink :to="setRelatedPropPath(relatedProp)" class="doc-option-link"> {{ relatedPropValue(relatedProp) }} </NuxtLink>
See <NuxtLink :to="setRelatedPropPath(relatedProp)" class="doc-option-link"> {{ relatedPropValue(relatedProp) }}
</NuxtLink>
</p>
</DocSectionText>

Expand All @@ -19,48 +20,61 @@
</thead>
<tbody>
<tr v-for="prop in data" :key="prop">
<td v-for="[k, v] in Object.entries(prop)" :key="k" :style="{ 'max-width': k === 'default' || k === 'returnType' ? '200px' : undefined }">
<td v-for="[k, v] in Object.entries(prop)" :key="k"
:style="{ 'max-width': k === 'default' || k === 'returnType' ? '200px' : undefined }">
<template v-if="k !== 'readonly' && k !== 'optional' && k !== 'deprecated'">
<span v-if="k === 'name'" :id="id + '.' + v" class="doc-option-name" :class="{ 'line-through cursor-pointer': !!prop.deprecated }" :title="prop.deprecated">
{{ v }}<NuxtLink :to="`/${$router.currentRoute.value.name}/#${id}.${v}`" class="doc-option-link"> <i class="pi pi-link"></i> </NuxtLink>
<span v-if="k === 'name'" :id="id + '.' + v" class="doc-option-name"
:class="{ 'line-through cursor-pointer': !!prop.deprecated }" :title="prop.deprecated">
{{ v }}<NuxtLink :to="`/${$router.currentRoute.value.name}/#${id}.${v}`"
class="doc-option-link"> <i class="pi pi-link"></i> </NuxtLink>
</span>

<template v-else-if="k === 'type'">
<template v-for="(value, i) in getType(v)" :key="value">
<span v-if="i !== 0" class="doc-option-type">{{ ' | ' }}</span>
<NuxtLink v-if="isLinkType(value)" :to="setLinkPath(value)" class="doc-option-type doc-option-link">{{ value }}</NuxtLink
><span v-else class="doc-option-type">{{ value }}</span>
<NuxtLink v-if="isLinkType(value)" :to="setLinkPath(value)"
class="doc-option-type doc-option-link">{{ value }}</NuxtLink><span v-else
class="doc-option-type">{{ value }}</span>
</template>
</template>

<template v-else-if="k === 'options'">
<template v-for="val in v" :key="val.name">
<div class="doc-option-type-options-container">
{{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ val.type }}</span>
{{ val.name }}: <span class="doc-option-type-options doc-option-type">{{ val.type
}}</span>
</div>
</template>
</template>

<template v-else-if="k === 'parameters'">
<div class="doc-option-params">
<span v-if="v.name" :class="{ 'text-primary-700': label === 'Slots', 'doc-option-parameter-name': label === 'Emits' }"> {{ v.name }} : </span>
<span v-if="v.name"
:class="{ 'text-primary-700': label === 'Slots', 'doc-option-parameter-name': label === 'Emits' }">
{{ 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 doc-option-parameter-type"> {{ value }} </NuxtLink>
<span v-else :class="{ 'doc-option-parameter-type': label === 'Emits' }" v-html="value"> </span>
{{ i !== 0 ? ' | ' : '' }}<NuxtLink v-if="isLinkType(value)"
:to="setLinkPath(value)" class="doc-option-link doc-option-parameter-type"> {{
value }} </NuxtLink>
<span v-else :class="{ 'doc-option-parameter-type': label === 'Emits' }"
v-html="value"> </span>
</template>
</div>
</template>

<div v-else-if="k === 'default'" :id="id + '.' + k" :class="['doc-option-default', $appState.darkTheme ? 'doc-option-dark' : 'doc-option-light']">
<div v-else-if="k === 'default'" :id="id + '.' + k"
:class="['doc-option-default', $appState.darkTheme ? 'doc-option-dark' : 'doc-option-light']">
{{ v === '' || v === undefined ? 'null' : v }}
</div>

<div v-else-if="k === 'returnType'" :id="id + '.' + k" :class="['doc-option-returnType', $appState.darkTheme ? 'doc-option-dark' : 'doc-option-light']">
<div v-else-if="k === 'returnType'" :id="id + '.' + k"
:class="['doc-option-returnType', $appState.darkTheme ? 'doc-option-dark' : 'doc-option-light']">
{{ v }}
</div>

<template v-else>
<span v-if="v?.includes('<a')" :id="id + '.' + k" class="doc-option-description" v-html="v"> </span>
<span v-if="typeof v === 'string' && v?.includes('<a')" :id="id + '.' + k"
class="doc-option-description" v-html="v"> </span>
<span v-else :id="id + '.' + k" class="doc-option-description">{{ v }} </span>
</template>
</template>
Expand All @@ -72,7 +86,8 @@

<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" :level="3" />
<DocApiTable :id="childData.id" :data="childData.data" :label="childData.label"
:description="childData.description" :relatedProp="childData.relatedProp" :level="3" />
</template>
</template>
</template>
Expand Down

0 comments on commit 4f9691b

Please sign in to comment.