mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-25 09:20:36 +01:00
docs: improve props and preset
This commit is contained in:
@@ -23,7 +23,7 @@ const name = `U${useUpperFirst(camelName)}`
|
|||||||
const preset = appConfig.ui[camelName]
|
const preset = appConfig.ui[camelName]
|
||||||
|
|
||||||
const { data: ast } = await useAsyncData(`${name}-preset`, () => transformContent('content:_markdown.md', `
|
const { data: ast } = await useAsyncData(`${name}-preset`, () => transformContent('content:_markdown.md', `
|
||||||
\`\`\`json
|
\`\`\`json [appConfig.ui.${camelName}]
|
||||||
${JSON.stringify(preset, null, 2)}
|
${JSON.stringify(preset, null, 2)}
|
||||||
\`\`\`\
|
\`\`\`\
|
||||||
`, {
|
`, {
|
||||||
|
|||||||
@@ -1,36 +1,21 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<table class="table-fixed">
|
<FieldGroup>
|
||||||
<thead>
|
<Field v-for="prop in metaProps" :key="prop.name" v-bind="prop">
|
||||||
<tr>
|
<code v-if="prop.default">{{ prop.default }}</code>
|
||||||
<th class="w-[25%]">
|
|
||||||
Prop
|
<Collapsible v-if="prop.schema?.kind === 'array' && prop.schema?.schema?.filter(schema => schema.kind === 'object').length">
|
||||||
</th>
|
<FieldGroup v-for="schema in prop.schema.schema" :key="schema.name" class="!mt-0">
|
||||||
<th class="w-[50%]">
|
<Field v-for="subProp in Object.values(schema.schema)" :key="(subProp as any).name" v-bind="subProp" />
|
||||||
Default
|
</FieldGroup>
|
||||||
</th>
|
</Collapsible>
|
||||||
<th>Description</th>
|
<Collapsible v-else-if="prop.schema?.kind === 'object' && Object.values(prop.schema.schema)?.length">
|
||||||
</tr>
|
<FieldGroup class="!mt-0">
|
||||||
</thead>
|
<Field v-for="subProp in Object.values(prop.schema.schema)" :key="(subProp as any).name" v-bind="subProp" />
|
||||||
<tbody>
|
</FieldGroup>
|
||||||
<tr v-for="prop in metaProps" :key="prop.name">
|
</Collapsible>
|
||||||
<td class="relative flex-shrink-0">
|
</Field>
|
||||||
<code>{{ prop.name }}</code><span v-if="prop.required" class="font-bold text-red-500 dark:text-red-400 absolute top-0 ml-1">*</span>
|
</FieldGroup>
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<code v-if="prop.default">{{ prop.default }}</code>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<a v-if="prop.default === `appConfig.ui.${camelName}`" href="#preset">
|
|
||||||
<code>{{ prop.type }}</code>
|
|
||||||
</a>
|
|
||||||
<code v-else class="break-all">
|
|
||||||
{{ prop.type }}
|
|
||||||
</code>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user