shadcn-docs-nuxt/components/ui/avatar/index.ts

Effortless and beautiful docs template built with Nuxt Content & shadcn-vue.

import type { VariantProps } from 'class-variance-authority';
import { cva } from 'class-variance-authority';

export { default as Avatar } from './Avatar.vue';
export { default as AvatarFallback } from './AvatarFallback.vue';
export { default as AvatarImage } from './AvatarImage.vue';

export const avatarVariant = cva(
  'bg-secondary text-foreground inline-flex shrink-0 select-none items-center justify-center overflow-hidden font-normal',
  {
    variants: {
      size: {
        sm: 'size-10 text-xs',
        base: 'size-16 text-2xl',
        lg: 'size-32 text-5xl',
      },
      shape: {
        circle: 'rounded-full',
        square: 'rounded-md',
      },
    },
  },
);

export type AvatarVariants = VariantProps<typeof avatarVariant>;