schlechtenburg/packages/docs/lib/api/ComponentDocs.tsx

43 lines
1.1 KiB
TypeScript
Raw Normal View History

2022-03-15 23:03:45 +00:00
import {
defineComponent,
PropType,
} from 'vue';
import { ComponentDoc } from 'vue-docgen-api';
import './ComponentDocs.scss';
export default defineComponent({
name: 'ComponentDocs',
props: {
docs: {
type: (null as unknown) as PropType<ComponentDoc>,
required: true,
},
},
setup(props) {
const docs = props.docs;
return () => <section class="docs component-docs">
2022-03-15 23:38:33 +00:00
<header class="docs--header">
<h2
class="docs--title"
id={docs.exportName}
>{docs.exportName}</h2>
<p class="docs--type">Component <code>&lt;{docs.displayName} /&gt;</code></p>
</header>
<p class="docs--description">{docs.description}</p>
<h3>Props</h3>
{...(docs.props || []).map(prop => <div class="component-docs--prop">
<h4 class="component-docs--prop-name">{prop.name}</h4>
<p class="component-docs--prop-description">{prop.description}</p>
{prop.type ? <p>Type: <code>{prop.type.name}</code></p> : null}
{prop.defaultValue ? <p>Default: <code>{prop.defaultValue.value}</code></p>: null}
</div>)}
2022-03-15 23:03:45 +00:00
</section>;
},
});