libreria-astro-lefebvre 0.0.5 → 0.0.7

package/src/components/Astro/TextImageCard.astro

@@ -0,0 +1,25 @@
+---
+const {
+    title,
+    description,
+    image,
+    orientation = 'left',
+    } = Astro.props;
+---
+<article class={`flex ${orientation === 'left' ? 'flex-row' : 'flex-row-reverse'} items-center gap-4 w-full rounded-xl overflow-hidden border border-slate-300 shadow-lg bg-white`}>
+    <div class="w-2/3 p-8 flex flex-col flex-wrap justify-center items-start">
+        <h2 class="text-[2.5em] leading-[47px] mb-[23px] text-[#262626] font-semibold not-italic">{title}</h2>
+        <div 
+            class="text-[#363942] font-inter font-normal text-[1.125em] not-italic leading-[28px] flex flex-col gap-4 mb-8" 
+            set:html={description} 
+        />
+    </div>
+    <div class={`w-1/3 aspect-square flex items-center ${orientation === 'left' ? 'justify-end' : 'justify-start'}`}>
+        <div
+            class="w-full h-full bg-center bg-cover"
+            style={`background-image: url('${image}');`}
+            aria-label={title}
+            role="img"
+        ></div>
+    </div>
+</article>

package/src/components/Astro/TextImageHeader.astro

@@ -0,0 +1,31 @@
+---
+const {
+    image,
+    pretitle,
+    title,
+    description,
+    orientation = "left",
+    buttonText,
+    buttonUrl,
+} = Astro.props;
+---
+
+<div class={`bg-[100%_0] bg-cover h-[570px] w-full ${orientation === "right" ? "rotate-y-180" : ""} `} style={`background-image: url('${image}');`} >
+    <div class="w-full lg:w-[70%] h-full transition duration-900 ease-in-out bg-gradient-to-r from-indigo-900 via-blue-600 to-pink-500 hover:from-pink-500 hover:via-blue-600 hover:to-indigo-900 lg:[clip-path:polygon(0_0,100%_0,88%_86%,68%_100%,0_100%)]">
+        <div class="flex flex-row w-4/5 center mx-auto pt-20 sm:pt-30"> 
+            <div class={`w-full ${orientation === "right" ? "rotate-y-180" : ""}`}>
+                <h1 class="my-3 text-4xl text-white">
+                    {pretitle}
+                </h1>
+                <div class="font-bold text-5xl xl:text-6xl text-white mt-3 mb-9">{title}</div>
+                <div class="font-bold text-md text-white mt-3 mb-9" set:html={description}>
+                </div>
+                <div class={`flex ${orientation === "right" ? "flex-row-reverse" : "flex-row"} gap-2 mb-5`}>
+                    <a href={buttonUrl} class="btn btn-primary-blue btn-lg px-6 py-3 bg-blue-700 transition duration-700 ease-in-out hover:bg-blue-800 text-white rounded-lg shadow">                                               
+                        {buttonText}                        
+                    </a>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

package/src/components/Astro/Titulo_2025_Algeciras.astro

@@ -0,0 +1,27 @@
+---
+
+const { 
+    title, 
+    description = "", 
+    tipo = "",
+    flexJustify = "justify-center"
+} = Astro.props;
+
+---
+
+<div class={`w-full md:w-3/5 max-w-auto md:w-full flex ${flexJustify === 'justify-center' ? 'justify-center' : 'justify-start'} flex-col px-4`}>
+    {
+        tipo === "h1" ? <h1 class="font-poppins text-[36px] md:text-[56px] font-normal text-center leading-[44px] md:leading-[64px] px-6 my-4 md:my-[48px]" set:html={title}></h1>
+        : tipo === "h2" ? <h2 class="font-poppins text-[40px] font-normal text-center leading-[48px] mb-[0] md:mb-[32px]" set:html={title}></h2>
+        : tipo === "h2-mb64" ? <h2 class="font-poppins text-[40px] font-normal text-center leading-[48px] p-6 mb-[0]" set:html={title}></h2>
+        : tipo === "h3" ? <h3 class="font-poppins text-[24px] font-semibold text-center leading-[32px] mb-[8px]" set:html={title}></h3>
+        : tipo === "h3-mb32" ? <h3 class="font-poppins text-[32px] font-normal text-left leading-[40px] mb-[32px]" set:html={title}></h3>
+        : tipo === "h4" ? <h4 class="font-poppins text-center" set:html={title}></h4>
+        : tipo === "h5" ? <h5 class="font-poppins text-center" set:html={title}></h5>
+        : tipo === "h6" ? <h6 class="font-poppins text-center" set:html={title}></h6>
+        : <p>{title}</p>
+    }
+    {description && description.trim() !== "" && (
+        <div class="w-full md:w-2/5 text-[#363942] mx-auto font-inter text-xl font-normal leading-[28px] mb-8 text-center" set:html={description}></div>
+    )}
+</div>

package/src/components/Astro/Titulo_2025_Santorini.astro

@@ -0,0 +1,9 @@
+---
+
+const { 
+    description = "", 
+} = Astro.props;
+
+---
+
+<p class="font-poppins text-[#001978] text-[14px] font-semibold text-left leading-[20px] tracking-[2px] uppercase mb-[4px]">{description}</p>

package/src/components/Astro/VideoAutoplay.astro

@@ -0,0 +1,20 @@
+---
+const {
+    title,
+    description,
+    iframeSrc,
+    } = Astro.props;
+---
+<section class="w-full flex items-center justify-center">
+    <article class="w-3/5 flex flex-col items-center justify-center p-12 mb-12">
+        <h2 class="text-[#262626] font-poppins font-sans text-[2.625em] not-italic font-semibold leading-[46px] text-center mb-8">
+            {title}
+        </h2>
+        <p class="text-[#363942] font-inter font-sans text-[1.625em] not-italic font-normal leading-[39px] mb-[71px] text-center mb-8">
+            {description}
+        </p>
+        <div class="w-4/5 h-full aspect-video relative">
+            <iframe src={iframeSrc} frameborder="0" allow="autoplay; fullscreen; picture-in-picture; clipboard-write; encrypted-media" class="w-full h-full" title={title}></iframe>
+        </div>               
+    </article>
+</section>

package/src/generated/componentRegistry.ts

@@ -1,12 +1,86 @@
-// FICHERO GENERADO AUTOMÁTICAMENTE usando esto: "npm run generate:registry"  ==> NO TOCAR ESTO A MANO (o sus crujo) !!
-import * as AstroButton from '../carbins/AstroButton.ts';
-import * as GeometricShapeCard from '../carbins/GeometricShapeCard.ts';
-import * as ReactButton from '../carbins/ReactButton.ts';
-import * as VueButton from '../carbins/VueButton.ts';
-
-export const components = [
-  {component: AstroButton},
-  {component: GeometricShapeCard},
-  {component: ReactButton},
-  {component: VueButton},
-];
+// FICHERO GENERADO AUTOMÁTICAMENTE usando esto: "npm run generate:registry"  ==> NO TOCAR ESTO A MANO (o sus crujo) !!.
+import * as AstroButton from '../carbins/AstroButton.ts';
+import * as CTA_2025_Formentera from '../carbins/CTA_2025_Formentera.ts';
+import * as Cabecera_2025_Barcelona from '../carbins/Cabecera_2025_Barcelona.ts';
+import * as Cabecera_2025_Madrid from '../carbins/Cabecera_2025_Madrid.ts';
+import * as Contenido_2025_Alcorcon from '../carbins/Contenido_2025_Alcorcon.ts';
+import * as Contenido_2025_Granada from '../carbins/Contenido_2025_Granada.ts';
+import * as Contenido_2025_Malaga from '../carbins/Contenido_2025_Malaga.ts';
+import * as CorpFooter from '../carbins/CorpFooter.ts';
+import * as CorpHero from '../carbins/CorpHero.ts';
+import * as FooterCorporativo from '../carbins/FooterCorporativo.ts';
+import * as Footer_2025_Napoles from '../carbins/Footer_2025_Napoles.ts';
+import * as Formulario_2025_Seul from '../carbins/Formulario_2025_Seul.ts';
+import * as GeometricShapeCard from '../carbins/GeometricShapeCard.ts';
+import * as HeaderCorporativo from '../carbins/HeaderCorporativo.ts';
+import * as ImageTextSimple from '../carbins/ImageTextSimple.ts';
+import * as Imagen_2025_Bogota from '../carbins/Imagen_2025_Bogota.ts';
+import * as ReactButton from '../carbins/ReactButton.ts';
+import * as Repetidor_2025_Cabra from '../carbins/Repetidor_2025_Cabra.ts';
+import * as Repetidor_2025_Dubai from '../carbins/Repetidor_2025_Dubai.ts';
+import * as Repetidor_2025_Estocolmo from '../carbins/Repetidor_2025_Estocolmo.ts';
+import * as Repetidor_2025_Menorca from '../carbins/Repetidor_2025_Menorca.ts';
+import * as Repetidor_2025_Michigan from '../carbins/Repetidor_2025_Michigan.ts';
+import * as Repetidor_2025_Orcasitas from '../carbins/Repetidor_2025_Orcasitas.ts';
+import * as Repetidor_2025_Oslo from '../carbins/Repetidor_2025_Oslo.ts';
+import * as Repetidor_2025_Quito from '../carbins/Repetidor_2025_Quito.ts';
+import * as Repetidor_2025_Seatle from '../carbins/Repetidor_2025_Seatle.ts';
+import * as Repetidor_2025_Tokyo from '../carbins/Repetidor_2025_Tokyo.ts';
+import * as Repetidor_2025_Ubeda from '../carbins/Repetidor_2025_Ubeda.ts';
+import * as Repetidor_2025_Yakarta from '../carbins/Repetidor_2025_Yakarta.ts';
+import * as Separador_2025_Reinosa from '../carbins/Separador_2025_Reinosa.ts';
+import * as SpectrumSeparator from '../carbins/SpectrumSeparator.ts';
+import * as TestPadre from '../carbins/TestPadre.ts';
+import * as TextBox from '../carbins/TextBox.ts';
+import * as TextImageBackground from '../carbins/TextImageBackground.ts';
+import * as TextImageBlock from '../carbins/TextImageBlock.ts';
+import * as TextImageCard from '../carbins/TextImageCard.ts';
+import * as TextImageHeader from '../carbins/TextImageHeader.ts';
+import * as Titulo_2025_Algeciras from '../carbins/Titulo_2025_Algeciras.ts';
+import * as Titulo_2025_Santorini from '../carbins/Titulo_2025_Santorini.ts';
+import * as VideoAutoplay from '../carbins/VideoAutoplay.ts';
+import * as VueButton from '../carbins/VueButton.ts';
+
+export const components = [
+  {component: AstroButton},
+  {component: CTA_2025_Formentera},
+  {component: Cabecera_2025_Barcelona},
+  {component: Cabecera_2025_Madrid},
+  {component: Contenido_2025_Alcorcon},
+  {component: Contenido_2025_Granada},
+  {component: Contenido_2025_Malaga},
+  {component: CorpFooter},
+  {component: CorpHero},
+  {component: FooterCorporativo},
+  {component: Footer_2025_Napoles},
+  {component: Formulario_2025_Seul},
+  {component: GeometricShapeCard},
+  {component: HeaderCorporativo},
+  {component: ImageTextSimple},
+  {component: Imagen_2025_Bogota},
+  {component: ReactButton},
+  {component: Repetidor_2025_Cabra},
+  {component: Repetidor_2025_Dubai},
+  {component: Repetidor_2025_Estocolmo},
+  {component: Repetidor_2025_Menorca},
+  {component: Repetidor_2025_Michigan},
+  {component: Repetidor_2025_Orcasitas},
+  {component: Repetidor_2025_Oslo},
+  {component: Repetidor_2025_Quito},
+  {component: Repetidor_2025_Seatle},
+  {component: Repetidor_2025_Tokyo},
+  {component: Repetidor_2025_Ubeda},
+  {component: Repetidor_2025_Yakarta},
+  {component: Separador_2025_Reinosa},
+  {component: SpectrumSeparator},
+  {component: TestPadre},
+  {component: TextBox},
+  {component: TextImageBackground},
+  {component: TextImageBlock},
+  {component: TextImageCard},
+  {component: TextImageHeader},
+  {component: Titulo_2025_Algeciras},
+  {component: Titulo_2025_Santorini},
+  {component: VideoAutoplay},
+  {component: VueButton},
+];

package/src/index.ts

@@ -1,5 +1,113 @@
-export { default as Button } from './components/Astro/Button.astro';
-export { default as GeometricShapeCard } from './components/Astro/GeometricShapeCard.astro';
-export { default as Button2 } from './components/React/ReactButton.jsx';
-export { default as Button3 } from './components/Vue/VueButton.vue';
-export { listComponents } from './lib/functions.js';
+// FICHERO GENERADO AUTOMÁTICAMENTE usando esto: "npm run generate:registry"  ==> NO TOCAR ESTO A MANO (o sus crujo) !!.
+
+
+// Esta parte importa todos los componentes en las carpetas de componentes
+
+import VueButton from './components/Vue/VueButton.vue';
+import Button from './components/Astro/Button.astro';
+import CTA_2025_Formentera from './components/Astro/CTA_2025_Formentera.astro';
+import Cabecera_2025_Barcelona from './components/Astro/Cabecera_2025_Barcelona.astro';
+import Cabecera_2025_Madrid from './components/Astro/Cabecera_2025_Madrid.astro';
+import Contenido_2025_Alcorcon from './components/Astro/Contenido_2025_Alcorcon.astro';
+import Contenido_2025_Granada from './components/Astro/Contenido_2025_Granada.astro';
+import Contenido_2025_Malaga from './components/Astro/Contenido_2025_Malaga.astro';
+import CorpFooter from './components/Astro/CorpFooter.astro';
+import CorpHero from './components/Astro/CorpHero.astro';
+import CorpNavigation from './components/Astro/CorpNavigation.astro';
+import FooterCorporativo from './components/Astro/FooterCorporativo.astro';
+import Footer_2025_Napoles from './components/Astro/Footer_2025_Napoles.astro';
+import Formulario_2025_Seul from './components/Astro/Formulario_2025_Seul.astro';
+import GeometricShape from './components/Astro/GeometricShape.astro';
+import GeometricShapeCard from './components/Astro/GeometricShapeCard.astro';
+import HeaderCorporativo from './components/Astro/HeaderCorporativo.astro';
+import ImageTextSimple from './components/Astro/ImageTextSimple.astro';
+import Imagen_2025_Bogota from './components/Astro/Imagen_2025_Bogota.astro';
+import Repetidor_2025_Cabra from './components/Astro/Repetidor_2025_Cabra.astro';
+import Repetidor_2025_Dubai from './components/Astro/Repetidor_2025_Dubai.astro';
+import Repetidor_2025_Estocolmo from './components/Astro/Repetidor_2025_Estocolmo.astro';
+import Repetidor_2025_Menorca from './components/Astro/Repetidor_2025_Menorca.astro';
+import Repetidor_2025_Michigan from './components/Astro/Repetidor_2025_Michigan.astro';
+import Repetidor_2025_Orcasitas from './components/Astro/Repetidor_2025_Orcasitas.astro';
+import Repetidor_2025_Oslo from './components/Astro/Repetidor_2025_Oslo.astro';
+import Repetidor_2025_Quito from './components/Astro/Repetidor_2025_Quito.astro';
+import Repetidor_2025_Seatle from './components/Astro/Repetidor_2025_Seatle.astro';
+import Repetidor_2025_Tokyo from './components/Astro/Repetidor_2025_Tokyo.astro';
+import Repetidor_2025_Ubeda from './components/Astro/Repetidor_2025_Ubeda.astro';
+import Repetidor_2025_Yakarta from './components/Astro/Repetidor_2025_Yakarta.astro';
+import Separador_2025_Reinosa from './components/Astro/Separador_2025_Reinosa.astro';
+import SpectrumSeparator from './components/Astro/SpectrumSeparator.astro';
+import TestHijo from './components/Astro/TestHijo.astro';
+import TestPadre from './components/Astro/TestPadre.astro';
+import TextBox from './components/Astro/TextBox.astro';
+import TextImageBackground from './components/Astro/TextImageBackground.astro';
+import TextImageBlock from './components/Astro/TextImageBlock.astro';
+import TextImageCard from './components/Astro/TextImageCard.astro';
+import TextImageHeader from './components/Astro/TextImageHeader.astro';
+import Titulo_2025_Algeciras from './components/Astro/Titulo_2025_Algeciras.astro';
+import Titulo_2025_Santorini from './components/Astro/Titulo_2025_Santorini.astro';
+import VideoAutoplay from './components/Astro/VideoAutoplay.astro';
+import ReactButton from './components/React/ReactButton.jsx';  
+
+// Exporta todos los componentes uno a uno para que puedan ser usados directamente.
+
+
+export { VueButton, Button, CTA_2025_Formentera, Cabecera_2025_Barcelona, Cabecera_2025_Madrid, Contenido_2025_Alcorcon, Contenido_2025_Granada, Contenido_2025_Malaga, CorpFooter, CorpHero, CorpNavigation, FooterCorporativo, Footer_2025_Napoles, Formulario_2025_Seul, GeometricShape, GeometricShapeCard, HeaderCorporativo, ImageTextSimple, Imagen_2025_Bogota, Repetidor_2025_Cabra, Repetidor_2025_Dubai, Repetidor_2025_Estocolmo, Repetidor_2025_Menorca, Repetidor_2025_Michigan, Repetidor_2025_Orcasitas, Repetidor_2025_Oslo, Repetidor_2025_Quito, Repetidor_2025_Seatle, Repetidor_2025_Tokyo, Repetidor_2025_Ubeda, Repetidor_2025_Yakarta, Separador_2025_Reinosa, SpectrumSeparator, TestHijo, TestPadre, TextBox, TextImageBackground, TextImageBlock, TextImageCard, TextImageHeader, Titulo_2025_Algeciras, Titulo_2025_Santorini, VideoAutoplay, ReactButton };
+
+
+// Exporta la función listComponents para que sea usado en el Pagebuilder en Vue.
+// Esto está puesto a pelo, si hubiera más funciones habría que automatizarlo en el script
+// que ha generado este fichero: generateRegistry.js
+
+
+export { listComponents } from './lib/functions.js';
+
+
+// Se crea un objeto de nuevo con todos los componentes, el motivo es para que puedan ser llamados dinámicamente en el PageBuilder
+
+
+export const components = {
+  VueButton: VueButton,
+  Button: Button,
+  CTA_2025_Formentera: CTA_2025_Formentera,
+  Cabecera_2025_Barcelona: Cabecera_2025_Barcelona,
+  Cabecera_2025_Madrid: Cabecera_2025_Madrid,
+  Contenido_2025_Alcorcon: Contenido_2025_Alcorcon,
+  Contenido_2025_Granada: Contenido_2025_Granada,
+  Contenido_2025_Malaga: Contenido_2025_Malaga,
+  CorpFooter: CorpFooter,
+  CorpHero: CorpHero,
+  CorpNavigation: CorpNavigation,
+  FooterCorporativo: FooterCorporativo,
+  Footer_2025_Napoles: Footer_2025_Napoles,
+  Formulario_2025_Seul: Formulario_2025_Seul,
+  GeometricShape: GeometricShape,
+  GeometricShapeCard: GeometricShapeCard,
+  HeaderCorporativo: HeaderCorporativo,
+  ImageTextSimple: ImageTextSimple,
+  Imagen_2025_Bogota: Imagen_2025_Bogota,
+  Repetidor_2025_Cabra: Repetidor_2025_Cabra,
+  Repetidor_2025_Dubai: Repetidor_2025_Dubai,
+  Repetidor_2025_Estocolmo: Repetidor_2025_Estocolmo,
+  Repetidor_2025_Menorca: Repetidor_2025_Menorca,
+  Repetidor_2025_Michigan: Repetidor_2025_Michigan,
+  Repetidor_2025_Orcasitas: Repetidor_2025_Orcasitas,
+  Repetidor_2025_Oslo: Repetidor_2025_Oslo,
+  Repetidor_2025_Quito: Repetidor_2025_Quito,
+  Repetidor_2025_Seatle: Repetidor_2025_Seatle,
+  Repetidor_2025_Tokyo: Repetidor_2025_Tokyo,
+  Repetidor_2025_Ubeda: Repetidor_2025_Ubeda,
+  Repetidor_2025_Yakarta: Repetidor_2025_Yakarta,
+  Separador_2025_Reinosa: Separador_2025_Reinosa,
+  SpectrumSeparator: SpectrumSeparator,
+  TestHijo: TestHijo,
+  TestPadre: TestPadre,
+  TextBox: TextBox,
+  TextImageBackground: TextImageBackground,
+  TextImageBlock: TextImageBlock,
+  TextImageCard: TextImageCard,
+  TextImageHeader: TextImageHeader,
+  Titulo_2025_Algeciras: Titulo_2025_Algeciras,
+  Titulo_2025_Santorini: Titulo_2025_Santorini,
+  VideoAutoplay: VideoAutoplay,
+  ReactButton: ReactButton
+};

package/src/interfaces/types.ts

@@ -1,6 +1,7 @@
 export interface ComponentMetadata {
   name: string;
   description: string;
+  category: 'Call to Action' | 'Contenido' | 'Separador' | 'Texto' | 'Cabecera' | 'Footer' | 'Imagen' | 'Repetidor' | 'Formulario' | 'Título';
   framework: 'Astro' | 'Vue' | 'React';
   component_name: string,
   priority?: number;
@@ -13,5 +14,7 @@ export interface ComponentMetadata {
     mandatory?: boolean;
     options?: (string | number)[];
     options_labels?: string[];
+    example_value?: string | number | boolean;
   }>;
+  view?: string;
 }