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

export const metadata: ComponentMetadata = {
  component_name: 'Tabla_2026_Cadiz',
  category: 'Contenido con listas',
  name: 'Tabla de dos columnas independientes con título centrado 2026',
  description: 'Tabla con título centrado (etiqueta configurable h2 o p con estilos de h2), descripción HTML y dos columnas independientes (izquierda y derecha) con sus títulos e ítems respectivos (strings planos sin HTML). Las columnas no están relacionadas entre sí: cada una muestra sus propios ítems sin sincronizar filas ni flecha separadora. Sin fondo en el contenedor. Layout responsive: apilado en móvil, grid de 2 columnas en desktop. TERNARIO: si AMBAS columnas tienen contenido → grid de 2 columnas; si solo UNA tiene contenido → se renderiza una única tabla con esa columna. Incluye structured data schema.org: emite uno o dos ItemList raíz independientes (uno por columna no vacía) para SEO.',
  framework: 'Astro',
  priority: 1,
  tags: ['texto', 'tabla', 'columnas', 'lista'],
  fields: [
    {
      name: 'title',
      type: 'text',
      help: 'Título superior de la tabla, centrado. Solo se muestra si tiene valor; si se deja vacío, NO aparece',
      label: 'Texto del título',
      mandatory: false,
      example_value: 'Nuestros servicios'
    },
    {
      name: 'titleTag',
      type: 'select',
      help: 'Etiqueta HTML del título. "h2" es un encabezado semántico; "p" mantiene los mismos estilos visuales del h2 pero sin jerarquía de encabezado',
      label: 'Tipo de título',
      mandatory: false,
      options: ['h2', 'p'],
      options_labels: ['Encabezado h2', 'Párrafo (estilos de h2)'],
      example_value: 'h2'
    },
    {
      name: 'description',
      type: 'text',
      help: 'Descripción debajo del título. Admite HTML. Solo se muestra si tiene valor',
      label: 'Texto de la descripción',
      mandatory: false,
      example_value: 'Todo lo que necesitas para tu despacho'
    },
    {
      name: 'leftTitle',
      type: 'text',
      help: 'Título de la columna izquierda',
      label: 'Título columna izquierda',
      mandatory: false,
      example_value: 'Servicios incluidos'
    },
    {
      name: 'leftItems',
      type: 'list',
      help: 'Ítems de la columna izquierda. Cada ítem tiene un texto obligatorio y un enlace opcional. Si se rellena "link", el texto se renderiza como <a>; si se deja vacío, como texto plano',
      label: 'Ítems columna izquierda',
      mandatory: false,
      items: {
        type: 'object',
        fields: [
          { name: 'text', type: 'text', help: 'Texto visible del ítem', label: 'Texto del ítem', example_value: 'Asesoría fiscal' },
          { name: 'link', type: 'text', help: 'URL de destino (opcional). Si se rellena, el ítem se convierte en enlace', label: 'Enlace (opcional)', example_value: '' },
          { name: 'target', type: 'select', help: 'Cómo se abre el enlace: misma pestaña o nueva pestaña', label: 'Apertura del enlace', options: ['_self', '_blank'], options_labels: ['Misma pestaña', 'Nueva pestaña'], example_value: '_self' },
        ]
      }
    },
    {
      name: 'rightTitle',
      type: 'text',
      help: 'Título de la columna derecha',
      label: 'Título columna derecha',
      mandatory: false,
      example_value: 'Servicios adicionales'
    },
    {
      name: 'rightItems',
      type: 'list',
      help: 'Ítems de la columna derecha. Cada ítem tiene un texto obligatorio y un enlace opcional. Si se rellena "link", el texto se renderiza como <a>; si se deja vacío, como texto plano',
      label: 'Ítems columna derecha',
      mandatory: false,
      items: {
        type: 'object',
        fields: [
          { name: 'text', type: 'text', help: 'Texto visible del ítem', label: 'Texto del ítem', example_value: 'Formación online' },
          { name: 'link', type: 'text', help: 'URL de destino (opcional). Si se rellena, el ítem se convierte en enlace', label: 'Enlace (opcional)', example_value: '' },
          { name: 'target', type: 'select', help: 'Cómo se abre el enlace: misma pestaña o nueva pestaña', label: 'Apertura del enlace', options: ['_self', '_blank'], options_labels: ['Misma pestaña', 'Nueva pestaña'], example_value: '_self' },
        ]
      }
    }
  ]
};
