oraculo-ui 0.1.3 → 0.1.5

package/dist/index.d.mts

@@ -139,7 +139,6 @@ interface OraculoClubOlimpoVisualProps {
     imgSrcMobile: string;
     imgSrcDesktopBg?: string;
     imgSrcDesktopLogo?: string;
-    priority?: boolean;
 }
 declare const OraculoClubOlimpoVisual: React.FC<OraculoClubOlimpoVisualProps>;
 
@@ -157,7 +156,7 @@ interface OraculoSeccionDestacadosProps {
 }
 declare function OraculoSeccionDestacados({ items, title, iconUrl, onViewMore, className, }: OraculoSeccionDestacadosProps): react_jsx_runtime.JSX.Element;
 
-interface OraculoTopJuegoItem {
+interface OraculoGameItem {
     orden?: number;
     logo?: string;
     machine?: number | string;
@@ -170,65 +169,33 @@ interface OraculoTopJuegoItem {
     tags?: string;
     lobby_tag?: string | null;
     background?: string;
-    rtp?: number;
+    rtp?: number | null;
     demo_allowed?: boolean;
     gaming_session_required?: boolean;
 }
+
 interface OraculoSeccionTopJuegosProps {
-    items: OraculoTopJuegoItem[];
+    items: OraculoGameItem[];
     title?: string;
     iconUrl?: string;
-    onCardClick?: () => void;
-    className?: string;
+    onCardClick?: (item: OraculoGameItem) => void;
 }
-declare function OraculoSeccionTopJuegos({ items, title, iconUrl, onCardClick, className, }: OraculoSeccionTopJuegosProps): react_jsx_runtime.JSX.Element;
 
-interface OraculoLiveCasinoItem {
-    orden?: number;
-    logo?: string;
-    machine?: number | string;
-    name?: string;
-    web_name?: string;
-    provider?: string;
-    sub_provider?: string;
-    external_id?: string;
-    type?: string;
-    tags?: string;
-    lobby_tag?: string | null;
-    background?: string;
-    rtp?: number;
-    demo_allowed?: boolean;
-    gaming_session_required?: boolean;
-}
+declare function OraculoSeccionTopJuegos({ items, title, iconUrl, onCardClick, }: OraculoSeccionTopJuegosProps): react_jsx_runtime.JSX.Element;
+
 interface OraculoSeccionCasinoEnVivoProps {
-    items: OraculoLiveCasinoItem[];
+    items: OraculoGameItem[];
     title?: string;
     subtitle?: string;
     backgroundMobileUrl?: string;
     backgroundDesktopUrl?: string;
-    onCardClick?: (juego: OraculoLiveCasinoItem, index: number) => void;
+    onCardClick?: (juego: OraculoGameItem, index: number) => void;
     onViewMore?: () => void;
     className?: string;
 }
+
 declare const OraculoSeccionCasinoEnVivo: React.FC<OraculoSeccionCasinoEnVivoProps>;
 
-interface OraculoGameItem {
-    orden?: string | number;
-    logo?: string;
-    machine?: number | string;
-    name?: string;
-    web_name?: string;
-    provider?: string;
-    sub_provider?: string;
-    external_id?: string;
-    type?: string;
-    tags?: string;
-    lobby_tag?: string | null;
-    background?: string;
-    rtp?: number | null;
-    demo_allowed?: boolean;
-    gaming_session_required?: boolean;
-}
 interface OraculoSeccionCasinoProps {
     items: OraculoGameItem[];
     title?: string;
@@ -237,8 +204,8 @@ interface OraculoSeccionCasinoProps {
     onViewMore?: () => void;
     mosaicFirst?: boolean;
     gridSize?: number;
-    className?: string;
 }
+
 declare const OraculoSeccionCasino: React.FC<OraculoSeccionCasinoProps>;
 
 interface OraculoSeccionVirtualesProps {
@@ -249,40 +216,60 @@ interface OraculoSeccionVirtualesProps {
     onViewMore?: () => void;
     mosaicFirst?: boolean;
     gridSize?: number;
-    className?: string;
 }
+
 declare const OraculoSeccionVirtuales: React.FC<OraculoSeccionVirtualesProps>;
 
-interface OraculoSeccionBonoBienvenidaProps {
-    /** Título principal, admite salto con "\n" para dos líneas */
+interface OraculoBonosItem {
+    title?: string;
+    amount?: string;
+    subtitle?: string;
+    buttonText?: string;
+    onButtonClick?: () => void;
+}
+interface OraculoSeccionBonoProps {
     headline?: string;
-    items: OraculoWelcomeBannerProps[];
+    items: OraculoBonosItem[];
     backgroundImageUrl?: string;
 }
-declare const OraculoSeccionBonoBienvenida: React.FC<OraculoSeccionBonoBienvenidaProps>;
 
-type OraculoClubOlimpoItem = {
+declare const OraculoSeccionBonoBienvenida: React.FC<OraculoSeccionBonoProps>;
+
+interface OraculoSeccionClubOlimpoItem {
     text: string;
-    imgAlt: string;
+    buttonLabel?: string;
+    imgAlt?: string;
     images: {
         mobile: string;
-        desktopBg: string;
-        desktopLogo: string;
+        desktopBg?: string;
+        desktopLogo?: string;
     };
     onClick?: () => void;
-    priority?: boolean;
-};
-interface OraculoSeccionClubOlimpoProps {
+}
+
+interface OraculoSeccionClubOlimpoItems {
     className?: string;
     /** Si true, hace el efecto full-bleed (100vw centrado) */
     fullBleed?: boolean;
     /** Lista de variantes (puedes pasar 1 o varias). */
-    items: OraculoClubOlimpoItem[];
+    items: OraculoSeccionClubOlimpoItem;
     /** Índice del item a mostrar si pasas varios. */
     selectedIndex?: number;
     /** aria-label de la sección (fallback al imgAlt del item seleccionado). */
     ariaLabel?: string;
 }
-declare const OraculoSeccionClubOlimpo: React.FC<OraculoSeccionClubOlimpoProps>;
+declare const OraculoSeccionClubOlimpo: React.FC<OraculoSeccionClubOlimpoItems>;
+
+interface parametros {
+    bonos: OraculoSeccionBonoProps;
+    topJuegos: OraculoSeccionTopJuegosProps;
+    casino: OraculoSeccionCasinoProps;
+    casinoEnVivo: OraculoSeccionCasinoEnVivoProps;
+    virtuales: OraculoSeccionVirtualesProps;
+    clubOlimpo: OraculoSeccionClubOlimpoItem;
+}
+declare function OraculoPageLanding({ props }: {
+    props: parametros;
+}): react_jsx_runtime.JSX.Element;
 
-export { OraculoButton, type OraculoButtonProps, OraculoCarousel, OraculoCarouselDots, type OraculoCarouselDotsProps, type OraculoCarouselOptions, type OraculoCarouselProps, type OraculoCarouselRef, type OraculoClubOlimpoItem, OraculoClubOlimpoVisual, type OraculoClubOlimpoVisualProps, type OraculoDestacadoItem, OraculoGameCard, type OraculoGameCardProps, type OraculoGameItem, OraculoGameRankCard, type OraculoGameRankCardProps, type OraculoGameRankCardSizes, OraculoGameSlide, type OraculoGameSlideItem, type OraculoGameSlideProps, OraculoLiveCasinoCard, type OraculoLiveCasinoCardProps, type OraculoLiveCasinoItem, OraculoSeccionBonoBienvenida, type OraculoSeccionBonoBienvenidaProps, OraculoSeccionCasino, OraculoSeccionCasinoEnVivo, type OraculoSeccionCasinoEnVivoProps, type OraculoSeccionCasinoProps, OraculoSeccionClubOlimpo, type OraculoSeccionClubOlimpoProps, OraculoSeccionDestacados, type OraculoSeccionDestacadosProps, OraculoSeccionTopJuegos, type OraculoSeccionTopJuegosProps, OraculoSeccionVirtuales, type OraculoSeccionVirtualesProps, OraculoSectionTitle, type OraculoSectionTitleProps, type OraculoTopJuegoItem, OraculoWelcomeBanner, type OraculoWelcomeBannerProps };
+export { type OraculoBonosItem, OraculoButton, type OraculoButtonProps, OraculoCarousel, OraculoCarouselDots, type OraculoCarouselDotsProps, type OraculoCarouselOptions, type OraculoCarouselProps, type OraculoCarouselRef, OraculoClubOlimpoVisual, type OraculoClubOlimpoVisualProps, type OraculoDestacadoItem, OraculoGameCard, type OraculoGameCardProps, type OraculoGameItem, OraculoGameRankCard, type OraculoGameRankCardProps, type OraculoGameRankCardSizes, OraculoGameSlide, type OraculoGameSlideItem, type OraculoGameSlideProps, OraculoLiveCasinoCard, type OraculoLiveCasinoCardProps, OraculoPageLanding, OraculoSeccionBonoBienvenida, type OraculoSeccionBonoProps, OraculoSeccionCasino, OraculoSeccionCasinoEnVivo, type OraculoSeccionCasinoEnVivoProps, type OraculoSeccionCasinoProps, OraculoSeccionClubOlimpo, type OraculoSeccionClubOlimpoItem, OraculoSeccionDestacados, type OraculoSeccionDestacadosProps, OraculoSeccionTopJuegos, type OraculoSeccionTopJuegosProps, OraculoSeccionVirtuales, type OraculoSeccionVirtualesProps, OraculoSectionTitle, type OraculoSectionTitleProps, OraculoSeccionTopJuegos as OraculoTopJuegoItem, OraculoWelcomeBanner, type OraculoWelcomeBannerProps };

package/dist/index.d.ts

@@ -139,7 +139,6 @@ interface OraculoClubOlimpoVisualProps {
     imgSrcMobile: string;
     imgSrcDesktopBg?: string;
     imgSrcDesktopLogo?: string;
-    priority?: boolean;
 }
 declare const OraculoClubOlimpoVisual: React.FC<OraculoClubOlimpoVisualProps>;
 
@@ -157,7 +156,7 @@ interface OraculoSeccionDestacadosProps {
 }
 declare function OraculoSeccionDestacados({ items, title, iconUrl, onViewMore, className, }: OraculoSeccionDestacadosProps): react_jsx_runtime.JSX.Element;
 
-interface OraculoTopJuegoItem {
+interface OraculoGameItem {
     orden?: number;
     logo?: string;
     machine?: number | string;
@@ -170,65 +169,33 @@ interface OraculoTopJuegoItem {
     tags?: string;
     lobby_tag?: string | null;
     background?: string;
-    rtp?: number;
+    rtp?: number | null;
     demo_allowed?: boolean;
     gaming_session_required?: boolean;
 }
+
 interface OraculoSeccionTopJuegosProps {
-    items: OraculoTopJuegoItem[];
+    items: OraculoGameItem[];
     title?: string;
     iconUrl?: string;
-    onCardClick?: () => void;
-    className?: string;
+    onCardClick?: (item: OraculoGameItem) => void;
 }
-declare function OraculoSeccionTopJuegos({ items, title, iconUrl, onCardClick, className, }: OraculoSeccionTopJuegosProps): react_jsx_runtime.JSX.Element;
 
-interface OraculoLiveCasinoItem {
-    orden?: number;
-    logo?: string;
-    machine?: number | string;
-    name?: string;
-    web_name?: string;
-    provider?: string;
-    sub_provider?: string;
-    external_id?: string;
-    type?: string;
-    tags?: string;
-    lobby_tag?: string | null;
-    background?: string;
-    rtp?: number;
-    demo_allowed?: boolean;
-    gaming_session_required?: boolean;
-}
+declare function OraculoSeccionTopJuegos({ items, title, iconUrl, onCardClick, }: OraculoSeccionTopJuegosProps): react_jsx_runtime.JSX.Element;
+
 interface OraculoSeccionCasinoEnVivoProps {
-    items: OraculoLiveCasinoItem[];
+    items: OraculoGameItem[];
     title?: string;
     subtitle?: string;
     backgroundMobileUrl?: string;
     backgroundDesktopUrl?: string;
-    onCardClick?: (juego: OraculoLiveCasinoItem, index: number) => void;
+    onCardClick?: (juego: OraculoGameItem, index: number) => void;
     onViewMore?: () => void;
     className?: string;
 }
+
 declare const OraculoSeccionCasinoEnVivo: React.FC<OraculoSeccionCasinoEnVivoProps>;
 
-interface OraculoGameItem {
-    orden?: string | number;
-    logo?: string;
-    machine?: number | string;
-    name?: string;
-    web_name?: string;
-    provider?: string;
-    sub_provider?: string;
-    external_id?: string;
-    type?: string;
-    tags?: string;
-    lobby_tag?: string | null;
-    background?: string;
-    rtp?: number | null;
-    demo_allowed?: boolean;
-    gaming_session_required?: boolean;
-}
 interface OraculoSeccionCasinoProps {
     items: OraculoGameItem[];
     title?: string;
@@ -237,8 +204,8 @@ interface OraculoSeccionCasinoProps {
     onViewMore?: () => void;
     mosaicFirst?: boolean;
     gridSize?: number;
-    className?: string;
 }
+
 declare const OraculoSeccionCasino: React.FC<OraculoSeccionCasinoProps>;
 
 interface OraculoSeccionVirtualesProps {
@@ -249,40 +216,60 @@ interface OraculoSeccionVirtualesProps {
     onViewMore?: () => void;
     mosaicFirst?: boolean;
     gridSize?: number;
-    className?: string;
 }
+
 declare const OraculoSeccionVirtuales: React.FC<OraculoSeccionVirtualesProps>;
 
-interface OraculoSeccionBonoBienvenidaProps {
-    /** Título principal, admite salto con "\n" para dos líneas */
+interface OraculoBonosItem {
+    title?: string;
+    amount?: string;
+    subtitle?: string;
+    buttonText?: string;
+    onButtonClick?: () => void;
+}
+interface OraculoSeccionBonoProps {
     headline?: string;
-    items: OraculoWelcomeBannerProps[];
+    items: OraculoBonosItem[];
     backgroundImageUrl?: string;
 }
-declare const OraculoSeccionBonoBienvenida: React.FC<OraculoSeccionBonoBienvenidaProps>;
 
-type OraculoClubOlimpoItem = {
+declare const OraculoSeccionBonoBienvenida: React.FC<OraculoSeccionBonoProps>;
+
+interface OraculoSeccionClubOlimpoItem {
     text: string;
-    imgAlt: string;
+    buttonLabel?: string;
+    imgAlt?: string;
     images: {
         mobile: string;
-        desktopBg: string;
-        desktopLogo: string;
+        desktopBg?: string;
+        desktopLogo?: string;
     };
     onClick?: () => void;
-    priority?: boolean;
-};
-interface OraculoSeccionClubOlimpoProps {
+}
+
+interface OraculoSeccionClubOlimpoItems {
     className?: string;
     /** Si true, hace el efecto full-bleed (100vw centrado) */
     fullBleed?: boolean;
     /** Lista de variantes (puedes pasar 1 o varias). */
-    items: OraculoClubOlimpoItem[];
+    items: OraculoSeccionClubOlimpoItem;
     /** Índice del item a mostrar si pasas varios. */
     selectedIndex?: number;
     /** aria-label de la sección (fallback al imgAlt del item seleccionado). */
     ariaLabel?: string;
 }
-declare const OraculoSeccionClubOlimpo: React.FC<OraculoSeccionClubOlimpoProps>;
+declare const OraculoSeccionClubOlimpo: React.FC<OraculoSeccionClubOlimpoItems>;
+
+interface parametros {
+    bonos: OraculoSeccionBonoProps;
+    topJuegos: OraculoSeccionTopJuegosProps;
+    casino: OraculoSeccionCasinoProps;
+    casinoEnVivo: OraculoSeccionCasinoEnVivoProps;
+    virtuales: OraculoSeccionVirtualesProps;
+    clubOlimpo: OraculoSeccionClubOlimpoItem;
+}
+declare function OraculoPageLanding({ props }: {
+    props: parametros;
+}): react_jsx_runtime.JSX.Element;
 
-export { OraculoButton, type OraculoButtonProps, OraculoCarousel, OraculoCarouselDots, type OraculoCarouselDotsProps, type OraculoCarouselOptions, type OraculoCarouselProps, type OraculoCarouselRef, type OraculoClubOlimpoItem, OraculoClubOlimpoVisual, type OraculoClubOlimpoVisualProps, type OraculoDestacadoItem, OraculoGameCard, type OraculoGameCardProps, type OraculoGameItem, OraculoGameRankCard, type OraculoGameRankCardProps, type OraculoGameRankCardSizes, OraculoGameSlide, type OraculoGameSlideItem, type OraculoGameSlideProps, OraculoLiveCasinoCard, type OraculoLiveCasinoCardProps, type OraculoLiveCasinoItem, OraculoSeccionBonoBienvenida, type OraculoSeccionBonoBienvenidaProps, OraculoSeccionCasino, OraculoSeccionCasinoEnVivo, type OraculoSeccionCasinoEnVivoProps, type OraculoSeccionCasinoProps, OraculoSeccionClubOlimpo, type OraculoSeccionClubOlimpoProps, OraculoSeccionDestacados, type OraculoSeccionDestacadosProps, OraculoSeccionTopJuegos, type OraculoSeccionTopJuegosProps, OraculoSeccionVirtuales, type OraculoSeccionVirtualesProps, OraculoSectionTitle, type OraculoSectionTitleProps, type OraculoTopJuegoItem, OraculoWelcomeBanner, type OraculoWelcomeBannerProps };
+export { type OraculoBonosItem, OraculoButton, type OraculoButtonProps, OraculoCarousel, OraculoCarouselDots, type OraculoCarouselDotsProps, type OraculoCarouselOptions, type OraculoCarouselProps, type OraculoCarouselRef, OraculoClubOlimpoVisual, type OraculoClubOlimpoVisualProps, type OraculoDestacadoItem, OraculoGameCard, type OraculoGameCardProps, type OraculoGameItem, OraculoGameRankCard, type OraculoGameRankCardProps, type OraculoGameRankCardSizes, OraculoGameSlide, type OraculoGameSlideItem, type OraculoGameSlideProps, OraculoLiveCasinoCard, type OraculoLiveCasinoCardProps, OraculoPageLanding, OraculoSeccionBonoBienvenida, type OraculoSeccionBonoProps, OraculoSeccionCasino, OraculoSeccionCasinoEnVivo, type OraculoSeccionCasinoEnVivoProps, type OraculoSeccionCasinoProps, OraculoSeccionClubOlimpo, type OraculoSeccionClubOlimpoItem, OraculoSeccionDestacados, type OraculoSeccionDestacadosProps, OraculoSeccionTopJuegos, type OraculoSeccionTopJuegosProps, OraculoSeccionVirtuales, type OraculoSeccionVirtualesProps, OraculoSectionTitle, type OraculoSectionTitleProps, OraculoSeccionTopJuegos as OraculoTopJuegoItem, OraculoWelcomeBanner, type OraculoWelcomeBannerProps };

package/dist/index.js

@@ -38,6 +38,7 @@ __export(index_exports, {
   OraculoGameRankCard: () => OraculoGameRankCard,
   OraculoGameSlide: () => OraculoGameSlide_default,
   OraculoLiveCasinoCard: () => OraculoLiveCasinoCard_default,
+  OraculoPageLanding: () => OraculoPageLanding,
   OraculoSeccionBonoBienvenida: () => OraculoSeccionBonoBienvenida_default,
   OraculoSeccionCasino: () => OraculoSeccionCasino_default,
   OraculoSeccionCasinoEnVivo: () => OraculoSeccionCasinoEnVivo_default,
@@ -46,6 +47,7 @@ __export(index_exports, {
   OraculoSeccionTopJuegos: () => OraculoSeccionTopJuegos,
   OraculoSeccionVirtuales: () => OraculoSeccionVirtuales_default,
   OraculoSectionTitle: () => OraculoSectionTitle,
+  OraculoTopJuegoItem: () => OraculoSeccionTopJuegos,
   OraculoWelcomeBanner: () => OraculoWelcomeBanner_default
 });
 module.exports = __toCommonJS(index_exports);
@@ -578,7 +580,7 @@ var OraculoGameSlide = ({
                 {
                   imageUrl: it.imageUrl,
                   size: "sm",
-                  onClick: () => onClick == null ? void 0 : onClick(it, index)
+                  onClick: () => onClick == null ? void 0 : onClick(it, index + 1)
                 }
               )
             },
@@ -983,10 +985,9 @@ function OraculoSeccionTopJuegos({
   items,
   title = "Top Juegos",
   iconUrl,
-  onCardClick,
-  className
+  onCardClick
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("section", { className, style: { width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_Stack.default, { direction: "column", spacing: 2, useFlexGap: true, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("section", { style: { width: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_Stack.default, { direction: "column", spacing: 2, useFlexGap: true, children: [
     /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(OraculoSectionTitle, { title, iconUrl, size: "md" }),
     /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       import_Box6.default,
@@ -1006,7 +1007,7 @@ function OraculoSeccionTopJuegos({
           {
             imageUrl: juego.logo || "",
             orden: juego.orden || idx + 1,
-            onClick: () => console.log(juego.machine)
+            onClick: () => onCardClick == null ? void 0 : onCardClick(juego)
           },
           juego.machine
         ))
@@ -1211,8 +1212,7 @@ var OraculoSeccionCasino = ({
   onItemClick,
   onViewMore,
   mosaicFirst = true,
-  gridSize = 4,
-  className
+  gridSize = 4
 }) => {
   const carouselRef = (0, import_react3.useRef)(null);
   const [navState, setNavState] = (0, import_react3.useState)({ isStart: true, isEnd: false });
@@ -1228,7 +1228,7 @@ var OraculoSeccionCasino = ({
   const handleViewMore = () => {
     onViewMore == null ? void 0 : onViewMore();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("section", { className, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_Stack3.default, { direction: "column", spacing: 2, useFlexGap: true, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_Stack3.default, { direction: "column", spacing: 2, useFlexGap: true, children: [
     /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
       import_Box8.default,
       {
@@ -1368,8 +1368,7 @@ var OraculoSeccionVirtuales = ({
   onItemClick,
   onViewMore,
   mosaicFirst = true,
-  gridSize = 4,
-  className
+  gridSize = 4
 }) => {
   const carouselRef = (0, import_react4.useRef)(null);
   const [navState, setNavState] = (0, import_react4.useState)({ isStart: true, isEnd: false });
@@ -1385,7 +1384,7 @@ var OraculoSeccionVirtuales = ({
   const handleViewMore = () => {
     onViewMore == null ? void 0 : onViewMore();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("section", { className, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_Stack4.default, { direction: "column", spacing: 2, useFlexGap: true, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("section", { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_Stack4.default, { direction: "column", spacing: 2, useFlexGap: true, children: [
     /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
       import_Box9.default,
       {
@@ -1685,9 +1684,9 @@ var OraculoSeccionClubOlimpo = ({
 }) => {
   const rootRef = (0, import_react6.useRef)(null);
   const bottomRef = (0, import_react6.useRef)(null);
-  if (!items || items.length === 0) return null;
-  const safeIndex = Math.min(Math.max(selectedIndex, 0), items.length - 1);
-  const item = items[safeIndex];
+  if (!items) return null;
+  const safeIndex = Math.min(Math.max(selectedIndex, 0), 1);
+  const item = items;
   (0, import_react6.useLayoutEffect)(() => {
     if (!rootRef.current || !bottomRef.current) return;
     if (typeof ResizeObserver === "undefined") return;
@@ -1723,14 +1722,101 @@ var OraculoSeccionClubOlimpo = ({
           imgAlt: item.imgAlt,
           imgSrcMobile: item.images.mobile,
           imgSrcDesktopBg: item.images.desktopBg,
-          imgSrcDesktopLogo: item.images.desktopLogo,
-          priority: item.priority
+          imgSrcDesktopLogo: item.images.desktopLogo
         }
       ) })
     }
   );
 };
 var OraculoSeccionClubOlimpo_default = OraculoSeccionClubOlimpo;
+
+// src/templates/OraculoPageLanding.tsx
+var import_material2 = require("@mui/material");
+var import_jsx_runtime20 = require("react/jsx-runtime");
+function OraculoPageLanding({ props }) {
+  const clubOlimpoItems = [
+    {
+      text: "\xA1Canjea bonos, productos \n y las mejores experiencias!",
+      imgAlt: "Club Olimpo",
+      images: {
+        mobile: "/assets/img/home/ClubOlimpo/FondoMobile.png",
+        desktopBg: "/assets/img/home/ClubOlimpo/FondoDesktop.png",
+        desktopLogo: "/assets/img/home/ClubOlimpo/Logo.png"
+      },
+      onClick: () => console.log("CTA Club Olimpo")
+    }
+  ];
+  const listaDestacados = [
+    { id: 1, src: "/assets/img/home/Destacados/Banner01.png", alt: "Gol Seguro", href: "/destacados" },
+    { id: 2, src: "/assets/img/home/Destacados/Banner02.png", alt: "Promo 2", href: "/destacados" },
+    { id: 3, src: "/assets/img/home/Destacados/Banner01.png", alt: "Gol Seguro", href: "/destacados" },
+    { id: 4, src: "/assets/img/home/Destacados/Banner02.png", alt: "Promo 2", href: "/destacados" }
+  ];
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_material2.Container, { className: "oli-font", sx: { backgroundColor: "#121212", position: "relative", pb: 5 }, maxWidth: false, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      OraculoSeccionBonoBienvenida_default,
+      {
+        headline: props.bonos.headline,
+        items: props.bonos.items
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_material2.Stack, { direction: "column", spacing: 12, useFlexGap: true, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        OraculoSeccionTopJuegos,
+        {
+          items: props.topJuegos.items,
+          title: props.topJuegos.title,
+          iconUrl: props.topJuegos.iconUrl,
+          onCardClick: props.topJuegos.onCardClick
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        OraculoSeccionCasino_default,
+        {
+          items: props.casino.items,
+          title: props.casino.title,
+          iconUrl: props.casino.iconUrl,
+          onItemClick: props.casino.onItemClick,
+          onViewMore: props.casino.onViewMore
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+      OraculoSeccionCasinoEnVivo_default,
+      {
+        items: props.casinoEnVivo.items,
+        title: props.casinoEnVivo.title,
+        subtitle: props.casinoEnVivo.subtitle,
+        backgroundMobileUrl: props.casinoEnVivo.backgroundMobileUrl,
+        backgroundDesktopUrl: props.casinoEnVivo.backgroundDesktopUrl,
+        onCardClick: props.casinoEnVivo.onCardClick,
+        onViewMore: props.casinoEnVivo.onViewMore
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_material2.Stack, { direction: "column", spacing: 12, useFlexGap: true, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        OraculoSeccionVirtuales_default,
+        {
+          items: props.virtuales.items,
+          title: props.virtuales.title,
+          iconUrl: props.virtuales.iconUrl,
+          onItemClick: props.virtuales.onItemClick,
+          onViewMore: props.virtuales.onViewMore
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        OraculoSeccionDestacados,
+        {
+          items: listaDestacados,
+          title: "Destacados",
+          iconUrl: "/assets/img/home/Destacados/starIcon.svg",
+          onViewMore: () => console.log("Ver m\xE1s clickeado")
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(OraculoSeccionClubOlimpo_default, { items: props.clubOlimpo })
+    ] })
+  ] });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   OraculoButton,
@@ -1741,6 +1827,7 @@ var OraculoSeccionClubOlimpo_default = OraculoSeccionClubOlimpo;
   OraculoGameRankCard,
   OraculoGameSlide,
   OraculoLiveCasinoCard,
+  OraculoPageLanding,
   OraculoSeccionBonoBienvenida,
   OraculoSeccionCasino,
   OraculoSeccionCasinoEnVivo,
@@ -1749,5 +1836,6 @@ var OraculoSeccionClubOlimpo_default = OraculoSeccionClubOlimpo;
   OraculoSeccionTopJuegos,
   OraculoSeccionVirtuales,
   OraculoSectionTitle,
+  OraculoTopJuegoItem,
   OraculoWelcomeBanner
 });

package/dist/index.mjs

@@ -534,7 +534,7 @@ var OraculoGameSlide = ({
                 {
                   imageUrl: it.imageUrl,
                   size: "sm",
-                  onClick: () => onClick == null ? void 0 : onClick(it, index)
+                  onClick: () => onClick == null ? void 0 : onClick(it, index + 1)
                 }
               )
             },
@@ -939,10 +939,9 @@ function OraculoSeccionTopJuegos({
   items,
   title = "Top Juegos",
   iconUrl,
-  onCardClick,
-  className
+  onCardClick
 }) {
-  return /* @__PURE__ */ jsx12("section", { className, style: { width: "100%" }, children: /* @__PURE__ */ jsxs9(Stack, { direction: "column", spacing: 2, useFlexGap: true, children: [
+  return /* @__PURE__ */ jsx12("section", { style: { width: "100%" }, children: /* @__PURE__ */ jsxs9(Stack, { direction: "column", spacing: 2, useFlexGap: true, children: [
     /* @__PURE__ */ jsx12(OraculoSectionTitle, { title, iconUrl, size: "md" }),
     /* @__PURE__ */ jsx12(
       Box6,
@@ -962,7 +961,7 @@ function OraculoSeccionTopJuegos({
           {
             imageUrl: juego.logo || "",
             orden: juego.orden || idx + 1,
-            onClick: () => console.log(juego.machine)
+            onClick: () => onCardClick == null ? void 0 : onCardClick(juego)
           },
           juego.machine
         ))
@@ -1167,8 +1166,7 @@ var OraculoSeccionCasino = ({
   onItemClick,
   onViewMore,
   mosaicFirst = true,
-  gridSize = 4,
-  className
+  gridSize = 4
 }) => {
   const carouselRef = useRef3(null);
   const [navState, setNavState] = useState2({ isStart: true, isEnd: false });
@@ -1184,7 +1182,7 @@ var OraculoSeccionCasino = ({
   const handleViewMore = () => {
     onViewMore == null ? void 0 : onViewMore();
   };
-  return /* @__PURE__ */ jsx14("section", { className, children: /* @__PURE__ */ jsxs11(Stack3, { direction: "column", spacing: 2, useFlexGap: true, children: [
+  return /* @__PURE__ */ jsx14("section", { children: /* @__PURE__ */ jsxs11(Stack3, { direction: "column", spacing: 2, useFlexGap: true, children: [
     /* @__PURE__ */ jsxs11(
       Box8,
       {
@@ -1324,8 +1322,7 @@ var OraculoSeccionVirtuales = ({
   onItemClick,
   onViewMore,
   mosaicFirst = true,
-  gridSize = 4,
-  className
+  gridSize = 4
 }) => {
   const carouselRef = useRef4(null);
   const [navState, setNavState] = useState3({ isStart: true, isEnd: false });
@@ -1341,7 +1338,7 @@ var OraculoSeccionVirtuales = ({
   const handleViewMore = () => {
     onViewMore == null ? void 0 : onViewMore();
   };
-  return /* @__PURE__ */ jsx15("section", { className, children: /* @__PURE__ */ jsxs12(Stack4, { direction: "column", spacing: 2, useFlexGap: true, children: [
+  return /* @__PURE__ */ jsx15("section", { children: /* @__PURE__ */ jsxs12(Stack4, { direction: "column", spacing: 2, useFlexGap: true, children: [
     /* @__PURE__ */ jsxs12(
       Box9,
       {
@@ -1641,9 +1638,9 @@ var OraculoSeccionClubOlimpo = ({
 }) => {
   const rootRef = useRef6(null);
   const bottomRef = useRef6(null);
-  if (!items || items.length === 0) return null;
-  const safeIndex = Math.min(Math.max(selectedIndex, 0), items.length - 1);
-  const item = items[safeIndex];
+  if (!items) return null;
+  const safeIndex = Math.min(Math.max(selectedIndex, 0), 1);
+  const item = items;
   useLayoutEffect(() => {
     if (!rootRef.current || !bottomRef.current) return;
     if (typeof ResizeObserver === "undefined") return;
@@ -1679,14 +1676,104 @@ var OraculoSeccionClubOlimpo = ({
           imgAlt: item.imgAlt,
           imgSrcMobile: item.images.mobile,
           imgSrcDesktopBg: item.images.desktopBg,
-          imgSrcDesktopLogo: item.images.desktopLogo,
-          priority: item.priority
+          imgSrcDesktopLogo: item.images.desktopLogo
         }
       ) })
     }
   );
 };
 var OraculoSeccionClubOlimpo_default = OraculoSeccionClubOlimpo;
+
+// src/templates/OraculoPageLanding.tsx
+import {
+  Container,
+  Stack as Stack5
+} from "@mui/material";
+import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
+function OraculoPageLanding({ props }) {
+  const clubOlimpoItems = [
+    {
+      text: "\xA1Canjea bonos, productos \n y las mejores experiencias!",
+      imgAlt: "Club Olimpo",
+      images: {
+        mobile: "/assets/img/home/ClubOlimpo/FondoMobile.png",
+        desktopBg: "/assets/img/home/ClubOlimpo/FondoDesktop.png",
+        desktopLogo: "/assets/img/home/ClubOlimpo/Logo.png"
+      },
+      onClick: () => console.log("CTA Club Olimpo")
+    }
+  ];
+  const listaDestacados = [
+    { id: 1, src: "/assets/img/home/Destacados/Banner01.png", alt: "Gol Seguro", href: "/destacados" },
+    { id: 2, src: "/assets/img/home/Destacados/Banner02.png", alt: "Promo 2", href: "/destacados" },
+    { id: 3, src: "/assets/img/home/Destacados/Banner01.png", alt: "Gol Seguro", href: "/destacados" },
+    { id: 4, src: "/assets/img/home/Destacados/Banner02.png", alt: "Promo 2", href: "/destacados" }
+  ];
+  return /* @__PURE__ */ jsxs14(Container, { className: "oli-font", sx: { backgroundColor: "#121212", position: "relative", pb: 5 }, maxWidth: false, children: [
+    /* @__PURE__ */ jsx18(
+      OraculoSeccionBonoBienvenida_default,
+      {
+        headline: props.bonos.headline,
+        items: props.bonos.items
+      }
+    ),
+    /* @__PURE__ */ jsxs14(Stack5, { direction: "column", spacing: 12, useFlexGap: true, children: [
+      /* @__PURE__ */ jsx18(
+        OraculoSeccionTopJuegos,
+        {
+          items: props.topJuegos.items,
+          title: props.topJuegos.title,
+          iconUrl: props.topJuegos.iconUrl,
+          onCardClick: props.topJuegos.onCardClick
+        }
+      ),
+      /* @__PURE__ */ jsx18(
+        OraculoSeccionCasino_default,
+        {
+          items: props.casino.items,
+          title: props.casino.title,
+          iconUrl: props.casino.iconUrl,
+          onItemClick: props.casino.onItemClick,
+          onViewMore: props.casino.onViewMore
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx18(
+      OraculoSeccionCasinoEnVivo_default,
+      {
+        items: props.casinoEnVivo.items,
+        title: props.casinoEnVivo.title,
+        subtitle: props.casinoEnVivo.subtitle,
+        backgroundMobileUrl: props.casinoEnVivo.backgroundMobileUrl,
+        backgroundDesktopUrl: props.casinoEnVivo.backgroundDesktopUrl,
+        onCardClick: props.casinoEnVivo.onCardClick,
+        onViewMore: props.casinoEnVivo.onViewMore
+      }
+    ),
+    /* @__PURE__ */ jsxs14(Stack5, { direction: "column", spacing: 12, useFlexGap: true, children: [
+      /* @__PURE__ */ jsx18(
+        OraculoSeccionVirtuales_default,
+        {
+          items: props.virtuales.items,
+          title: props.virtuales.title,
+          iconUrl: props.virtuales.iconUrl,
+          onItemClick: props.virtuales.onItemClick,
+          onViewMore: props.virtuales.onViewMore
+        }
+      ),
+      /* @__PURE__ */ jsx18(
+        OraculoSeccionDestacados,
+        {
+          items: listaDestacados,
+          title: "Destacados",
+          iconUrl: "/assets/img/home/Destacados/starIcon.svg",
+          onViewMore: () => console.log("Ver m\xE1s clickeado")
+        }
+      ),
+      /* @__PURE__ */ jsx18(OraculoSeccionClubOlimpo_default, { items: props.clubOlimpo })
+    ] })
+  ] });
+}
 export {
   OraculoButton,
   OraculoCarousel_default as OraculoCarousel,
@@ -1696,6 +1783,7 @@ export {
   OraculoGameRankCard,
   OraculoGameSlide_default as OraculoGameSlide,
   OraculoLiveCasinoCard_default as OraculoLiveCasinoCard,
+  OraculoPageLanding,
   OraculoSeccionBonoBienvenida_default as OraculoSeccionBonoBienvenida,
   OraculoSeccionCasino_default as OraculoSeccionCasino,
   OraculoSeccionCasinoEnVivo_default as OraculoSeccionCasinoEnVivo,
@@ -1704,5 +1792,6 @@ export {
   OraculoSeccionTopJuegos,
   OraculoSeccionVirtuales_default as OraculoSeccionVirtuales,
   OraculoSectionTitle,
+  OraculoSeccionTopJuegos as OraculoTopJuegoItem,
   OraculoWelcomeBanner_default as OraculoWelcomeBanner
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oraculo-ui",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",