Data Card Bone

Introducción

Éste componente no está encargado de renderizar, es de uso interno de la tabla. Guía de uso parte lógica

Código fuente

<script>
const props = {
  img: {
    type: String
  },
  name: {
    type: String
  },
  title: {
    type: String
  },
  subtitle: {
    type: String
  },
  height: {
    type: undefined,
    default: '200px'
  },
  cardProps: {
    type: Object,
    default: () => ({ elevation: '2' })
  },
  title_classes: {
    type: String,
    default: 'text-lg-h4'
  },
  name_classes: {
    type: String,
    default: 'text-md-h5'
  },
  subtitle_classes: {
    type: String,
    default: 'text-xs-h6'
  }
}
import {
  normalizeProps,
  assignCamelToSnake
} from '../../helpers/propsGenerator'
const mergedProps = normalizeProps(props)
import { profileCardComponentName } from '../../constants'
import { h } from 'vue'
export default {
  name: profileCardComponentName + 'Bone',
  props: mergedProps,
  setup(props, { slots }) {
    assignCamelToSnake(mergedProps, props)
    return () => {
      return h(
        'div', // Contenedor como nodo raíz
        [
          slots.default({
            title: props.title,
            img: props.img,
            name: props.name,
            subtitle: props.subtitle,
            height: props.height,
            title_classes: props.title_classes,
            name_classes: props.name_classes,
            subtitle_classes: props.subtitle_classes,
            cardProps: props.cardProps
          })
        ]
      )
    }
  }
}
</script>