libreria-astro-lefebvre 0.0.183 → 0.0.184
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/carbins/ImageTextSimple.ts +1 -1
- package/src/carbins/SEO_Head_Section.ts +1 -1
- package/src/carbins/Video_2026_Andujar.ts +77 -0
- package/src/components/Astro/Video_2026_Andujar.astro +81 -0
- package/src/generated/componentRegistry.ts +2 -0
- package/src/index.ts +3 -1
package/package.json
CHANGED
|
@@ -0,0 +1,77 @@
|
|
|
1
|
+
import type { ComponentMetadata } from '../interfaces/types';
|
|
2
|
+
|
|
3
|
+
export const metadata: ComponentMetadata = {
|
|
4
|
+
component_name: 'Video_2026_Andujar',
|
|
5
|
+
category: 'Contenido de Texto',
|
|
6
|
+
name: 'Enlace con icono play que abre vídeo en popup 2026',
|
|
7
|
+
description: 'Enlace estilizado con icono play a la izquierda que, al hacer clic, abre un popup con un iframe de vídeo (sin imagen de preview). Incluye structured data VideoObject para SEO.',
|
|
8
|
+
framework: 'Astro',
|
|
9
|
+
priority: 1,
|
|
10
|
+
tags: ['enlace', 'link', 'video', 'popup', 'play', 'seo'],
|
|
11
|
+
fields: [
|
|
12
|
+
{
|
|
13
|
+
name: 'text',
|
|
14
|
+
type: 'text',
|
|
15
|
+
label: 'Texto del enlace',
|
|
16
|
+
mandatory: false,
|
|
17
|
+
example_value: 'Ver el vídeo',
|
|
18
|
+
help: 'Texto visible del enlace con icono play.'
|
|
19
|
+
},
|
|
20
|
+
{
|
|
21
|
+
name: 'iframeSrc',
|
|
22
|
+
type: 'text',
|
|
23
|
+
label: 'Url iframe del vídeo',
|
|
24
|
+
mandatory: false,
|
|
25
|
+
example_value: 'https://player.vimeo.com/video/123456',
|
|
26
|
+
help: 'URL del vídeo embebido (Vimeo, YouTube, Limbo, etc.) que se cargará en el popup.'
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
name: 'name',
|
|
30
|
+
type: 'text',
|
|
31
|
+
label: 'Nombre del vídeo (SEO)',
|
|
32
|
+
mandatory: false,
|
|
33
|
+
example_value: 'Testimonio de cliente',
|
|
34
|
+
help: 'Nombre del vídeo para el structured data.'
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
name: 'description',
|
|
38
|
+
type: 'textArea',
|
|
39
|
+
label: 'Descripción (SEO)',
|
|
40
|
+
mandatory: false,
|
|
41
|
+
example_value: 'Descripción del contenido del vídeo',
|
|
42
|
+
help: 'Descripción del vídeo para el structured data.'
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
name: 'thumbnailUrl',
|
|
46
|
+
type: 'text',
|
|
47
|
+
label: 'URL miniatura (SEO)',
|
|
48
|
+
mandatory: false,
|
|
49
|
+
example_value: 'https://assets.lefebvre.es/media/img/preview-comp/comp-16-9.png',
|
|
50
|
+
help: 'URL de la miniatura del vídeo para el structured data. No se muestra en pantalla.'
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
name: 'uploadDate',
|
|
54
|
+
type: 'text',
|
|
55
|
+
label: 'Fecha de publicación (SEO)',
|
|
56
|
+
mandatory: false,
|
|
57
|
+
example_value: '2026-01-15',
|
|
58
|
+
help: 'Fecha ISO YYYY-MM-DD del vídeo para el structured data.'
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
name: 'author',
|
|
62
|
+
type: 'text',
|
|
63
|
+
label: 'Nombre del autor (SEO)',
|
|
64
|
+
mandatory: false,
|
|
65
|
+
example_value: 'María García López',
|
|
66
|
+
help: 'Nombre del autor para el structured data.'
|
|
67
|
+
},
|
|
68
|
+
{
|
|
69
|
+
name: 'positionCompany',
|
|
70
|
+
type: 'text',
|
|
71
|
+
label: 'Cargo del autor (SEO)',
|
|
72
|
+
mandatory: false,
|
|
73
|
+
example_value: 'Socia directora',
|
|
74
|
+
help: 'Cargo del autor para el structured data.'
|
|
75
|
+
},
|
|
76
|
+
]
|
|
77
|
+
};
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
---
|
|
2
|
+
|
|
3
|
+
const {
|
|
4
|
+
text = "",
|
|
5
|
+
iframeSrc = "",
|
|
6
|
+
name = "",
|
|
7
|
+
description = "",
|
|
8
|
+
author = "",
|
|
9
|
+
positionCompany = "",
|
|
10
|
+
uploadDate = "",
|
|
11
|
+
thumbnailUrl = "",
|
|
12
|
+
} = Astro.props;
|
|
13
|
+
|
|
14
|
+
const randomId = Math.floor(Math.random() * 1000);
|
|
15
|
+
|
|
16
|
+
const structuredData = `<script type="application/ld+json">
|
|
17
|
+
{
|
|
18
|
+
"@context": "https://schema.org",
|
|
19
|
+
"@type": "VideoObject",
|
|
20
|
+
"name": "${name.replace(/"/g, '\\"')}",
|
|
21
|
+
"description": "${description.replace(/"/g, '\\"')}",
|
|
22
|
+
"thumbnailUrl": "${thumbnailUrl}",
|
|
23
|
+
"embedUrl": "${iframeSrc}",
|
|
24
|
+
"uploadDate": "${uploadDate}",
|
|
25
|
+
"author": {
|
|
26
|
+
"@type": "Person",
|
|
27
|
+
"name": "${author.replace(/"/g, '\\"')}",
|
|
28
|
+
"jobTitle": "${positionCompany.replace(/"/g, '\\"')}"
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
</script>`;
|
|
32
|
+
|
|
33
|
+
---
|
|
34
|
+
|
|
35
|
+
<p class="px-8 md:px-0 my-8 mb-2">
|
|
36
|
+
<button
|
|
37
|
+
id={`popup-iframe-trigger-${randomId}`}
|
|
38
|
+
aria-label={text}
|
|
39
|
+
class="inline-flex items-center gap-1 text-[#2134F1] font-inter font-semibold text-base text-center no-underline hover:underline transition-all duration-300 cursor-pointer bg-transparent border-0 p-0"
|
|
40
|
+
>
|
|
41
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none" aria-hidden="true" focusable="false">
|
|
42
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M4.25476 4.25476C5.77849 2.73102 7.84512 1.875 10 1.875C12.1549 1.875 14.2215 2.73102 15.7452 4.25476C17.269 5.77849 18.125 7.84512 18.125 10C18.125 12.1549 17.269 14.2215 15.7452 15.7452C14.2215 17.269 12.1549 18.125 10 18.125C7.84512 18.125 5.77849 17.269 4.25476 15.7452C2.73102 14.2215 1.875 12.1549 1.875 10C1.875 7.84512 2.73102 5.77849 4.25476 4.25476ZM10 3.0787C8.16436 3.0787 6.4039 3.80791 5.1059 5.1059C3.80791 6.4039 3.0787 8.16436 3.0787 10C3.0787 11.8356 3.80791 13.5961 5.1059 14.8941C6.4039 16.1921 8.16436 16.9213 10 16.9213C11.8356 16.9213 13.5961 16.1921 14.8941 14.8941C16.1921 13.5961 16.9213 11.8356 16.9213 10C16.9213 8.16436 16.1921 6.4039 14.8941 5.1059C13.5961 3.80791 11.8356 3.0787 10 3.0787Z" fill="#2134F1"/>
|
|
43
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.48482 7.62824C8.41036 7.6748 8.34491 7.76731 8.34491 7.90342V12.0966C8.34491 12.2327 8.41036 12.3252 8.48483 12.3718C8.55637 12.4165 8.6336 12.4208 8.71111 12.375L12.2622 10.2785C12.349 10.2272 12.4074 10.1279 12.4074 10C12.4074 9.87213 12.349 9.77282 12.2622 9.72154L8.71112 7.62501C8.6336 7.57924 8.55636 7.58351 8.48482 7.62824ZM9.32308 6.58847L12.8742 8.68503C13.8567 9.26522 13.8567 10.7348 12.8742 11.3149L9.32309 13.4115C9.32309 13.4115 9.3231 13.4115 9.32309 13.4115C8.29502 14.0185 7.1412 13.1917 7.1412 12.0966V7.90342C7.1412 6.80822 8.29505 5.98152 9.32308 6.58847Z" fill="#2134F1"/>
|
|
44
|
+
</svg>
|
|
45
|
+
<span class="text-[#2134F1] font-inter text-base font-normal leading-6 underline">{text}</span>
|
|
46
|
+
</button>
|
|
47
|
+
</p>
|
|
48
|
+
|
|
49
|
+
<div id={`popup-iframe-modal-${randomId}`} class="fixed w-full h-full top-0 left-0 z-9999 hidden">
|
|
50
|
+
<div class="flex flex-col justify-center items-center w-full h-full bg-gray-100/90 p-4">
|
|
51
|
+
<div class="w-full flex justify-end">
|
|
52
|
+
<button class="js-close-popup w-auto m-4 p-2 bg-white rounded transition-transform hover:scale-125 cursor-pointer">X</button>
|
|
53
|
+
</div>
|
|
54
|
+
<div class="w-full h-full flex items-center justify-center">
|
|
55
|
+
<iframe
|
|
56
|
+
title="Reproductor de vídeo"
|
|
57
|
+
class="rounded-xl shadow-lg max-w-full md:max-w-3/4 aspect-video"
|
|
58
|
+
src=""
|
|
59
|
+
frameborder="0"
|
|
60
|
+
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
|
|
61
|
+
allowfullscreen=""></iframe>
|
|
62
|
+
</div>
|
|
63
|
+
</div>
|
|
64
|
+
</div>
|
|
65
|
+
|
|
66
|
+
<script is:inline define:vars={{ randomId, iframeSrc }}>
|
|
67
|
+
const modal = document.getElementById(`popup-iframe-modal-${randomId}`);
|
|
68
|
+
const trigger = document.getElementById(`popup-iframe-trigger-${randomId}`);
|
|
69
|
+
|
|
70
|
+
trigger.addEventListener('click', () => {
|
|
71
|
+
modal.classList.remove('hidden');
|
|
72
|
+
modal.querySelector('iframe').setAttribute('src', iframeSrc);
|
|
73
|
+
});
|
|
74
|
+
|
|
75
|
+
modal.querySelector('.js-close-popup').addEventListener('click', () => {
|
|
76
|
+
modal.classList.add('hidden');
|
|
77
|
+
modal.querySelector('iframe').setAttribute('src', '');
|
|
78
|
+
});
|
|
79
|
+
</script>
|
|
80
|
+
|
|
81
|
+
<Fragment set:html={structuredData} />
|
|
@@ -74,6 +74,7 @@ import * as Titulo_2025_Santorini from '../carbins/Titulo_2025_Santorini.ts';
|
|
|
74
74
|
import * as VideoAutoplay from '../carbins/VideoAutoplay.ts';
|
|
75
75
|
import * as Video_2025_Polop from '../carbins/Video_2025_Polop.ts';
|
|
76
76
|
import * as Video_2025_Valencia from '../carbins/Video_2025_Valencia.ts';
|
|
77
|
+
import * as Video_2026_Andujar from '../carbins/Video_2026_Andujar.ts';
|
|
77
78
|
import * as VueButton from '../carbins/VueButton.ts';
|
|
78
79
|
|
|
79
80
|
export const components = [
|
|
@@ -152,5 +153,6 @@ export const components = [
|
|
|
152
153
|
{component: VideoAutoplay},
|
|
153
154
|
{component: Video_2025_Polop},
|
|
154
155
|
{component: Video_2025_Valencia},
|
|
156
|
+
{component: Video_2026_Andujar},
|
|
155
157
|
{component: VueButton},
|
|
156
158
|
];
|
package/src/index.ts
CHANGED
|
@@ -81,12 +81,13 @@ import Titulo_2025_Santorini from './components/Astro/Titulo_2025_Santorini.astr
|
|
|
81
81
|
import VideoAutoplay from './components/Astro/VideoAutoplay.astro';
|
|
82
82
|
import Video_2025_Polop from './components/Astro/Video_2025_Polop.astro';
|
|
83
83
|
import Video_2025_Valencia from './components/Astro/Video_2025_Valencia.astro';
|
|
84
|
+
import Video_2026_Andujar from './components/Astro/Video_2026_Andujar.astro';
|
|
84
85
|
import ReactButton from './components/React/ReactButton.jsx';
|
|
85
86
|
|
|
86
87
|
// Exporta todos los componentes uno a uno para que puedan ser usados directamente.
|
|
87
88
|
|
|
88
89
|
|
|
89
|
-
export { VueButton, Author_2025_Algarve, Button, CTA_2025_Formentera, Cabecera_2025_Barcelona, Cabecera_2025_Madrid, Cabecera_2026_Bilbao, Cabecera_2026_Madrid, Card_2025_Malta, Contenido_2025_Alcorcon, Contenido_2025_Cordoba, Contenido_2025_Granada, Contenido_2025_Malaga, Contenido_2025_Montevideo, Contenido_2026_Cabra, Contenido_2026_Dubai, Contenido_2026_Estocolmo, Contenido_2026_Jaen, Contenido_2026_Leon, Contenido_2026_Mallorca, Contenido_2026_Marruecos, Contenido_2026_Menorca, Contenido_2026_Michigan, Contenido_2026_Mostoles, Contenido_2026_Orcasitas, Contenido_2026_Oslo, Contenido_2026_Quito, Contenido_2026_Seattle, Contenido_2026_Sevilla, Contenido_2026_Tokyo, Contenido_2026_Ubeda, Contenido_2026_Yakarta, CorpFooter, CorpHero, CorpNavigation, Enlace_2025_Venecia, FAQ_2025_Hiroshima, FooterCorporativo, Footer_2025_Napoles, Formulario_2025_Nara, Formulario_2025_Seul, Formulario_2025_Teruel, Formulario_2026_Wichita, GeometricShape, GeometricShapeCard, HeaderCorporativo, Hero_2025_Benidorm, Hero_2026_Benidorm, ImageTextSimple, Imagen_2025_Bogota, Imagen_2025_Fukushima, Indice_2025_Taiwan, Modal_2025_Sagunto, Paginacion_2025_Paris, RRSS_2025_Pisa, SEO_Head_Section, Separador_2025_Reinosa, Separador_2025_Toledo, Share_2025_Florencia, SpectrumSeparator, Sumario_2025_Beijing, Tabla_2025_Fuenlabrada, Tag_2025_Bolonia, TestHijo, TestPadre, Test_2026_Gaza, TextBox, TextImageBackground, TextImageBlock, TextImageCard, TextImageHeader, Texto_2025_Kyoto, Tiempo_2025_Londres, Titulo_2025_Algeciras, Titulo_2025_Santorini, VideoAutoplay, Video_2025_Polop, Video_2025_Valencia, ReactButton };
|
|
90
|
+
export { VueButton, Author_2025_Algarve, Button, CTA_2025_Formentera, Cabecera_2025_Barcelona, Cabecera_2025_Madrid, Cabecera_2026_Bilbao, Cabecera_2026_Madrid, Card_2025_Malta, Contenido_2025_Alcorcon, Contenido_2025_Cordoba, Contenido_2025_Granada, Contenido_2025_Malaga, Contenido_2025_Montevideo, Contenido_2026_Cabra, Contenido_2026_Dubai, Contenido_2026_Estocolmo, Contenido_2026_Jaen, Contenido_2026_Leon, Contenido_2026_Mallorca, Contenido_2026_Marruecos, Contenido_2026_Menorca, Contenido_2026_Michigan, Contenido_2026_Mostoles, Contenido_2026_Orcasitas, Contenido_2026_Oslo, Contenido_2026_Quito, Contenido_2026_Seattle, Contenido_2026_Sevilla, Contenido_2026_Tokyo, Contenido_2026_Ubeda, Contenido_2026_Yakarta, CorpFooter, CorpHero, CorpNavigation, Enlace_2025_Venecia, FAQ_2025_Hiroshima, FooterCorporativo, Footer_2025_Napoles, Formulario_2025_Nara, Formulario_2025_Seul, Formulario_2025_Teruel, Formulario_2026_Wichita, GeometricShape, GeometricShapeCard, HeaderCorporativo, Hero_2025_Benidorm, Hero_2026_Benidorm, ImageTextSimple, Imagen_2025_Bogota, Imagen_2025_Fukushima, Indice_2025_Taiwan, Modal_2025_Sagunto, Paginacion_2025_Paris, RRSS_2025_Pisa, SEO_Head_Section, Separador_2025_Reinosa, Separador_2025_Toledo, Share_2025_Florencia, SpectrumSeparator, Sumario_2025_Beijing, Tabla_2025_Fuenlabrada, Tag_2025_Bolonia, TestHijo, TestPadre, Test_2026_Gaza, TextBox, TextImageBackground, TextImageBlock, TextImageCard, TextImageHeader, Texto_2025_Kyoto, Tiempo_2025_Londres, Titulo_2025_Algeciras, Titulo_2025_Santorini, VideoAutoplay, Video_2025_Polop, Video_2025_Valencia, Video_2026_Andujar, ReactButton };
|
|
90
91
|
|
|
91
92
|
|
|
92
93
|
// Exporta la función listComponents para que sea usado en el Pagebuilder en Vue.
|
|
@@ -179,5 +180,6 @@ export const components = {
|
|
|
179
180
|
VideoAutoplay: VideoAutoplay,
|
|
180
181
|
Video_2025_Polop: Video_2025_Polop,
|
|
181
182
|
Video_2025_Valencia: Video_2025_Valencia,
|
|
183
|
+
Video_2026_Andujar: Video_2026_Andujar,
|
|
182
184
|
ReactButton: ReactButton
|
|
183
185
|
};
|