libreria-astro-lefebvre 0.1.91 → 0.1.93

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "libreria-astro-lefebvre",
-  "version": "0.1.91",
+  "version": "0.1.93",
   "description": "Librería de componentes Astro, React y Vue para Lefebvre",
   "author": "Equipo web desarrollo Lefebvre",
   "type": "module",

package/src/carbins/Contenido_2025_Cordoba.ts

@@ -4,7 +4,7 @@ export const metadata: ComponentMetadata = {
   component_name: 'Contenido_2025_Cordoba',
   category: 'Contenido de Texto',
   name: 'Ítem con icono grande de certificación y título configurable 2025',
-  description: 'Ítem para destacar una certificación, acreditación o hito con un icono grande (5 variantes predefinidas: IA, ISO1, ISO2, GDPR, ISO3), título con etiqueta HTML seleccionable entre h1-h6/span (cada opción con tamaño y alineación distintos) y descripción centrada. Layout flex configurable: horizontal (icono al lado) o vertical (icono encima), con control de alineación vertical entre icono y texto',
+  description: 'Ítem para destacar una certificación, acreditación o hito con un icono grande (5 variantes predefinidas: IA, ISO1, ISO2, GDPR, ISO3, o una imagen subida desde Limbo que sustituye al SVG), título con etiqueta HTML seleccionable entre h1-h6/span (cada opción con tamaño y alineación distintos) y descripción centrada. Layout flex configurable: horizontal (icono al lado) o vertical (icono encima), con control de alineación vertical entre icono y texto',
   framework: 'Astro',
   priority: 1,
   tags: ['contenido', 'icono', 'certificacion', 'item'],
@@ -47,12 +47,20 @@ export const metadata: ComponentMetadata = {
     {
       name: 'bigIcon',
       type: 'select',
-      help: 'Icono grande que se muestra junto al contenido (solo si "Mostrar icono grande" está activado). Si se elige un valor fuera de la lista, no aparece ningún icono',
+      help: 'Icono grande que se muestra junto al contenido (solo si "Mostrar icono grande" está activado). Si se elige un valor fuera de la lista, no aparece ningún icono. Se ignora si se rellena "Imagen del icono"',
       label: 'Icono',
       options: ['bigIA', 'bigIso1', 'bigIso2', 'bigGDPR', 'bigIso3'],
       options_labels: ['IA', 'Iso1', 'Iso2', 'GDPR', 'Iso3'],
       example_value: 'bigIso2'
     },
+    {
+      name: 'bigImage',
+      type: 'image',
+      help: 'Imagen subida desde Limbo que sustituye al icono SVG predefinido (solo si "Mostrar icono grande" está activado). Opcional: si se deja vacía se usa el icono seleccionado en "Icono". Se muestra a 66x66 px dentro de la caja blanca de 90x90 y usa el "Texto del título" como texto alternativo',
+      label: 'Imagen del icono (Limbo)',
+      mandatory: false,
+      example_value: 'https://assets.lefebvre.es/media/img/preview-comp/comp-16-9.png'
+    },
     {
       name: 'bigIconUrl',
       type: 'text',

package/src/carbins/Contenido_2026_Mallorca.ts

@@ -4,7 +4,7 @@ export const metadata: ComponentMetadata = {
   component_name: 'Contenido_2026_Mallorca',
   category: 'Contenido con listas',
   name: 'Wrapper de ítems con icono grande de certificación y botón CTA 2026',
-  description: 'Contenedor que itera un listado de bloques tipo certificación/hito: cada ítem combina un icono grande (5 variantes: IA, ISO1, ISO2, GDPR, ISO3) con título de etiqueta HTML configurable y descripción. Ofrece controles de alineación vertical, orientación icono-texto intra-ítem y entre ítems (fila/columna), más un botón CTA opcional al final. Cada ítem se renderiza con Contenido_2025_Cordoba',
+  description: 'Contenedor que itera un listado de bloques tipo certificación/hito: cada ítem combina un icono grande (5 variantes: IA, ISO1, ISO2, GDPR, ISO3, o una imagen subida desde Limbo que sustituye al SVG) con título de etiqueta HTML configurable y descripción. Ofrece controles de alineación vertical, orientación icono-texto intra-ítem y entre ítems (fila/columna), más un botón CTA opcional al final. Cada ítem se renderiza con Contenido_2025_Cordoba',
   framework: 'Astro',
   priority: 1,
   tags: ['contenido', 'icono', 'boton', 'cta'],
@@ -93,7 +93,8 @@ export const metadata: ComponentMetadata = {
           { name: 'title', type: 'text', help: 'Título del item. Se renderiza con la etiqueta HTML seleccionada en "Etiqueta del título". No admite HTML', label: 'Título', example_value: 'Certificación ISO 27001' },
           { name: 'description', type: 'textArea', help: 'Descripción del item. Se muestra debajo del título centrada y como texto plano (no admite HTML)', label: 'Descripción', example_value: 'Gestión de la seguridad de la información conforme a estándares internacionales' },
           { name: 'showBigIco', type: 'boolean', help: 'Si está activado, muestra el icono grande seleccionado junto al contenido del item. Si está desactivado, NO se muestra icono (el hueco queda vacío)', label: 'Mostrar icono grande', options: ['false', 'true'], options_labels: ['Falso', 'Verdadero'], example_value: true },
-          { name: 'bigIcon', type: 'select', help: 'Icono grande que se muestra junto al item (solo si "Mostrar icono grande" está activado). Si se elige un valor fuera de la lista, no aparece ningún icono', label: 'Icono grande', options: ['bigIA', 'bigIso1', 'bigIso2', 'bigGDPR', 'bigIso3'], options_labels: ['IA', 'Iso1', 'Iso2', 'GDPR', 'Iso3'], example_value: 'bigIso2' },
+          { name: 'bigIcon', type: 'select', help: 'Icono grande que se muestra junto al item (solo si "Mostrar icono grande" está activado). Si se elige un valor fuera de la lista, no aparece ningún icono. Se ignora si se rellena "Imagen del icono"', label: 'Icono grande', options: ['bigIA', 'bigIso1', 'bigIso2', 'bigGDPR', 'bigIso3'], options_labels: ['IA', 'Iso1', 'Iso2', 'GDPR', 'Iso3'], example_value: 'bigIso2' },
+          { name: 'bigImage', type: 'image', help: 'Imagen subida desde Limbo que sustituye al icono SVG predefinido (solo si "Mostrar icono grande" está activado). Opcional: si se deja vacía se usa el icono seleccionado en "Icono grande". Se muestra a 66x66 px dentro de la caja blanca de 90x90 y usa el "Título" del item como texto alternativo', label: 'Imagen del icono (Limbo)', example_value: 'https://assets.lefebvre.es/media/img/preview-comp/comp-16-9.png' },
           { name: 'bigIconUrl', type: 'text', help: 'URL de descarga del icono. Si se rellena, el icono se convierte en un enlace de descarga (atributo download). Si se deja vacío, el icono se muestra sin enlace. ATENCIÓN: el navegador solo fuerza la descarga si el archivo es del mismo origen', label: 'Enlace de descarga del icono', mandatory: false }
         ]
       }

package/src/components/Astro/Contenido_2025_Cordoba.astro

@@ -1,10 +1,13 @@
 ---
+import { extractImageUrl } from '../../lib/functions.js';
+
 const {
     title = "",
     description = "",
     tipo = "h3",
     showBigIco = true,
     bigIcon,
+    bigImage = "",
     bigIconUrl = "",
     positionFlex = "items-center",
     flexOrientationIcoText = "flex-row",
@@ -54,7 +57,12 @@ const icons = {
     </svg>`,
 };
 
-const iconSvg = icons[bigIcon] ?? "";
+// bigImage llega como JSON de Limbo (original + recortes). extractImageUrl lo resuelve a la URL final.
+// Si hay imagen de Limbo prevalece sobre el SVG predefinido.
+const limboImageUrl = extractImageUrl(bigImage);
+const iconSvg = limboImageUrl
+    ? `<img src="${limboImageUrl}" alt="${title.replace(/"/g, '&quot;')}" width="66" height="66" class="w-full h-full object-contain" loading="lazy" />`
+    : (icons[bigIcon] ?? "");
 
 ---
 

package/src/components/Astro/Contenido_2026_Mallorca.astro

@@ -29,6 +29,7 @@ const {
                 positionFlex={positionFlex}
                 showBigIco={item.showBigIco}
                 bigIcon={item.bigIcon}
+                bigImage={item.bigImage}
                 bigIconUrl={item.bigIconUrl}
             />
         ))}