arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-26 09:50:33 +01:00
Code Issues Packages Projects Releases Wiki Activity

docs(ComponentCode/ComponentExample): add class prop

Browse Source
This commit is contained in:
Benjamin Canac
2024-08-06 10:45:16 +02:00
parent e70aee4d69
commit 8f5e8170e6
2 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
docs/app/components/content/ComponentCode.vue
View File

@@ -6,6 +6,7 @@ import * as theme from '#build/ui'
import { get, set } from '#ui/utils' import { get, set } from '#ui/utils'
const props = defineProps<{ const props = defineProps<{
class?: any
/** List of props to ignore in selection */ /** List of props to ignore in selection */
ignore?: string[] ignore?: string[]
/** List of props to hide from code and selection */ /** List of props to hide from code and selection */
@@ -231,7 +232,7 @@ const { data: ast } = await useAsyncData(`component-code-${name}-${JSON.stringif
</template> </template>
</div> </div>
<div class="flex border border-b-0 border-gray-300 dark:border-gray-700 relative p-4" :class="[!options.length && 'rounded-t-md']"> <div class="flex border border-b-0 border-gray-300 dark:border-gray-700 relative p-4" :class="[!options.length && 'rounded-t-md', props.class]">
<component :is="name" v-bind="componentProps"> <component :is="name" v-bind="componentProps">
<template v-for="slot in Object.keys(slots || {})" :key="slot" #[slot]> <template v-for="slot in Object.keys(slots || {})" :key="slot" #[slot]>
<ContentSlot :name="slot" unwrap="p"> <ContentSlot :name="slot" unwrap="p">

3
docs/app/components/content/ComponentExample.vue
View File

@@ -3,6 +3,7 @@ import { camelCase } from 'scule'
const props = defineProps<{ const props = defineProps<{
name: string name: string
class?: any
props?: { [key: string]: any } props?: { [key: string]: any }
/** /**
* Whether to format the code with Prettier * Whether to format the code with Prettier
@@ -44,7 +45,7 @@ const { data: ast } = await useAsyncData(`component-example-${camelName}`, async
<template> <template>
<div class="my-5"> <div class="my-5">
<div> <div>
<div class="flex border border-b-0 border-gray-300 dark:border-gray-700 relative p-4 rounded-t-md"> <div class="flex border border-b-0 border-gray-300 dark:border-gray-700 relative p-4 rounded-t-md" :class="[props.class]">
<component :is="camelName" v-bind="componentProps" /> <component :is="camelName" v-bind="componentProps" />
</div> </div>
</div> </div>