import type { ComponentMetadata } from '../interfaces/types';

export const metadata: ComponentMetadata = {
  component_name: 'Contenido_2026_Jaen',
  category: 'Contenido de Imagen',
  name: 'Cabecera enriquecida de post con autor, colegiado, imagen lateral y RRSS 2026',
  description: 'Cabecera de artículo de blog con título configurable mediante 8 variantes de estilo preestablecidas (H1 categoría blog, H1 autor blog, H1 post blog, H1 post enriquecido, H2 blog, H2, H3, H4), subtítulo, número de colegiado del autor, descripción con tipografía conmutable (Poppins grande o Inter compacto), imagen lateral opcional con posición configurable (izquierda o derecha) y bloque de redes sociales al final con iconos que solo aparecen si su URL está rellena',
  framework: 'Astro',
  priority: 1,
  tags: ['contenido', 'blog', 'cabecera', 'rrss', 'autor', 'imagen', 'titulo'],
  fields: [
    {
      name: 'title',
      type: 'text',
      help: 'Título principal. Se renderiza con la etiqueta HTML seleccionada en "Etiqueta del título". Admite HTML',
      label: 'Texto del título',
      mandatory: false,
      example_value: 'Inteligencia artificial en el despacho: casos reales'
    },
    {
      name: 'subtitle',
      type: 'text',
      help: 'Subtítulo opcional que aparece junto al número de colegiado. Admite HTML. Si se deja vacío, NO se muestra',
      label: 'Texto del subtítulo',
      mandatory: false,
      example_value: 'Socia directora de Derecho Fiscal'
    },
    {
      name: 'number',
      type: 'text',
      help: 'Número de colegiado del autor. Se muestra como "Nº colegiado: [valor]". Si se deja vacío, NO se muestra',
      label: 'Número de colegiado',
      mandatory: false,
      example_value: '12345'
    },
    {
      name: 'description',
      type: 'text',
      help: 'Descripción que aparece debajo del título y subtítulo. Admite HTML. Su tipografía y tamaño los controla el campo "Estilo de la descripción"',
      label: 'Texto de la descripción',
      mandatory: false,
      example_value: 'Tres experiencias reales de profesionales del Derecho que han incorporado GenIA-L en su día a día'
    },
    {
      name: 'image',
      type: 'image',
      help: 'Imagen lateral. Si tiene valor, el layout se convierte en dos columnas (texto + imagen). Si se deja vacía, NO se muestra imagen y el texto ocupa todo el ancho',
      label: 'Imagen',
      mandatory: false,
      example_value: 'https://assets.lefebvre.es/media/img/preview-comp/comp-w-4-3.png'
    },
    {
      name: 'imageAlt',
      type: 'text',
      help: 'Texto alternativo de la imagen para accesibilidad. Solo aplica si "Imagen" tiene valor',
      label: 'Alt de la imagen',
      mandatory: false,
      example_value: 'Foto de perfil de María García López'
    },
    {
      name: 'tipo',
      type: 'select',
      help: 'Etiqueta HTML y estilo del título. Cada opción aplica estilos distintos: "h1 categoría blog" 40px centrado normal, "h1 autor blog" 40px izquierda semibold, "h1 post blog" 40px centrado semibold, "h1 post enriquecido" 40px izquierda semibold, "h2 blog" 28px/32px izquierda normal, "h2" 36px/40px centrado normal, "h3" 20px/24px izquierda semibold, "h4" xl izquierda semibold, "h3 (como párrafo)" mismo estilo visual que H3 pero renderizado como <p> (sin que cuente como encabezado en la jerarquía SEO). Si se elige un valor fuera de la lista, el título se renderiza como párrafo simple',
      label: 'Etiqueta del título',
      options: ['h1-blog-categoria', 'h1-blog-autor', 'h1-blog-post', 'h1-blog-postenriquecido', 'h2-blog', 'h2', 'h3', 'h3-p', 'h4'],
      options_labels: ['H1 categoría blog', 'H1 autor blog', 'H1 post blog', 'H1 post enriquecido blog', 'H2 blog', 'H2', 'H3', 'H3 (como párrafo)', 'H4'],
      example_value: 'h1-blog-autor'
    },
    {
      name: 'flexJustify',
      type: 'select',
      help: 'Justificación horizontal del bloque de texto. "Centrado" centra el contenido en su columna; "Inicio" lo alinea a la izquierda',
      label: 'Justificación del contenido',
      options: ['justify-center', 'justify-start'],
      options_labels: ['Centrado', 'Inicio'],
      example_value: 'justify-center'
    },
    {
      name: 'textAlign',
      type: 'select',
      help: 'Alineación del texto dentro del párrafo de descripción',
      label: 'Alineación del texto',
      options: ['center', 'left', 'right'],
      options_labels: ['Centro', 'Izquierda', 'Derecha'],
      example_value: 'center'
    },
    {
      name: 'descriptionStyle',
      type: 'select',
      help: 'Tipografía y tamaño del párrafo de descripción. "Poppins" aplica Poppins xl con leading 7 y margen inferior grande (para descripciones destacadas); "Inter" aplica Inter base sin margen (para descripciones compactas)',
      label: 'Estilo de la descripción',
      options: ['poppins', 'inter'],
      options_labels: ['Poppins (grande)', 'Inter (compacto)'],
      example_value: 'poppins'
    },
    {
      name: 'imagePosition',
      type: 'select',
      help: 'Posición de la imagen respecto al texto (solo aplica si "Imagen" tiene valor). "Derecha" coloca la imagen a la derecha del texto; "Izquierda" la coloca a la izquierda',
      label: 'Posición de la imagen',
      options: ['right', 'left'],
      options_labels: ['Derecha', 'Izquierda'],
      example_value: 'right'
    },
    {
      name: 'items',
      type: 'list',
      help: 'Listado de bloques de redes sociales y opciones de compartir. Cada bloque se renderiza con el componente RRSS_2025_Pisa. Habitualmente se configura UN solo bloque con todos los enlaces rellenos; si hay varios se mostrarán en fila. Si se deja vacío, el bloque de RRSS NO se muestra',
      label: 'Items de redes sociales',
      mandatory: false,
      items: {
        type: 'object',
        fields: [
          { name: 'facebook', type: 'text', help: 'URL del perfil de Facebook. Si se deja vacía, el icono de Facebook NO aparece', label: 'URL de Facebook', example_value: 'https://facebook.com/lefebvre.es' },
          { name: 'twitter', type: 'text', help: 'URL del perfil de Twitter/X. Si se deja vacía, el icono de X NO aparece', label: 'URL de Twitter/X', example_value: 'https://x.com/lefebvre_es' },
          { name: 'linkedin', type: 'text', help: 'URL del perfil de LinkedIn. Si se deja vacía, el icono de LinkedIn NO aparece', label: 'URL de LinkedIn', example_value: 'https://linkedin.com/company/lefebvre-es' },
          { name: 'whatsapp', type: 'text', help: 'URL/enlace de WhatsApp (p. ej. https://wa.me/...). Si se deja vacía, el icono de WhatsApp NO aparece', label: 'URL de WhatsApp', example_value: 'https://wa.me/34600000000' },
          { name: 'instagram', type: 'text', help: 'URL del perfil de Instagram. Si se deja vacía, el icono de Instagram NO aparece', label: 'URL de Instagram', example_value: 'https://instagram.com/lefebvre_es' },
          { name: 'youtube', type: 'text', help: 'URL del canal de YouTube. Si se deja vacía, el icono de YouTube NO aparece', label: 'URL de YouTube', example_value: 'https://youtube.com/@lefebvre' },
          { name: 'email', type: 'text', help: 'Dirección de email de contacto. Si se deja vacía, el icono de email NO aparece', label: 'Email', example_value: 'contacto@lefebvre.es' },
          { name: 'print', type: 'boolean', help: 'Activa el botón de imprimir que ejecuta window.print() en la página actual', label: 'Mostrar botón imprimir', options: ['false', 'true'], options_labels: ['Falso', 'Verdadero'], example_value: true },
          { name: 'copyLink', type: 'boolean', help: 'Activa el botón de copiar enlace que copia la URL actual al portapapeles', label: 'Mostrar botón copiar enlace', options: ['false', 'true'], options_labels: ['Falso', 'Verdadero'], example_value: true }
        ]
      }
    }
  ]
};