mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-20 06:51:46 +01:00
4446531d04
* chore: add local module for better dx developing nuxt/ui * up * up * up * feat(Kbd): new * chore(Badge): update * chore(Collapsible): remove content prop * chore(Container): clean * chore(Avatar): update root bg * chore(Link): clean * feat(Tooltip): handle shortcuts * playground(collapsible): update --------- Co-authored-by: Benjamin Canac <canacb1@gmail.com>
36 lines
833 B
Vue
36 lines
833 B
Vue
<script lang="ts">
|
|
import { tv, type VariantProps } from 'tailwind-variants'
|
|
import type { AppConfig } from '@nuxt/schema'
|
|
import _appConfig from '#build/app.config'
|
|
import theme from '#build/ui/kbd'
|
|
|
|
const appConfig = _appConfig as AppConfig & { ui: { kbd: Partial<typeof theme> } }
|
|
|
|
const kbd = tv({ extend: tv(theme), ...(appConfig.ui?.kbd || {}) })
|
|
|
|
type KbdVariants = VariantProps<typeof kbd>
|
|
|
|
export interface KbdProps {
|
|
as?: string
|
|
value?: string
|
|
size?: KbdVariants['size']
|
|
class?: any
|
|
}
|
|
|
|
export interface KbdSlots {
|
|
default(): any
|
|
}
|
|
</script>
|
|
|
|
<script setup lang="ts">
|
|
const props = withDefaults(defineProps<KbdProps>(), { as: 'kbd' })
|
|
defineSlots<KbdSlots>()
|
|
</script>
|
|
|
|
<template>
|
|
<component :is="as" :class="kbd({ size, class: props.class })">
|
|
<slot>
|
|
{{ value }}
|
|
</slot>
|
|
</component>
|
|
</template> |