diff --git a/com.twin.app.shoptime/src/components/TPopUp/TPopUp.jsx b/com.twin.app.shoptime/src/components/TPopUp/TPopUp.jsx index 65674c27..38feb326 100644 --- a/com.twin.app.shoptime/src/components/TPopUp/TPopUp.jsx +++ b/com.twin.app.shoptime/src/components/TPopUp/TPopUp.jsx @@ -1,16 +1,16 @@ -import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; -import Spottable from "@enact/spotlight/Spottable"; -import Spotlight from "@enact/spotlight"; -import Alert from "@enact/sandstone/Alert"; -import { $L } from "../../utils/helperMethods"; - import React, { useCallback, useEffect } from "react"; -import TButton from "../TButton/TButton"; - -import css from "../TPopUp/TPopUp.module.less"; import classNames from "classnames"; +import Alert from "@enact/sandstone/Alert"; +import Spotlight from "@enact/spotlight"; +import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; +import Spottable from "@enact/spotlight/Spottable"; + +import { $L } from "../../utils/helperMethods"; +import TButton from "../TButton/TButton"; +import css from "../TPopUp/TPopUp.module.less"; + const Container = SpotlightContainerDecorator( { enterTo: "default-element", preserveId: true }, Spottable("div") @@ -18,12 +18,19 @@ const Container = SpotlightContainerDecorator( const SpottableComponent = Spottable("li"); -const KINDS = ["textPopup", "termsPopup", "introTermsPopup", "optionPopup"]; +const KINDS = [ + "textPopup", + "termsPopup", + "introTermsPopup", + "optionPopup", + "eventBannerPopup", +]; export default function TPopUp({ kind, children, onExit, + onClick, onClose, hasButton, hasText, @@ -52,6 +59,15 @@ export default function TPopUp({ // if (options) Spotlight.focus(`option_${selectedOptionIdx}`) }, []); + const _onClick = useCallback( + (e) => { + if (onClick) { + onClick(e); + } + }, + [onClick] + ); + const _onClose = useCallback( (e) => { if (onClose) { @@ -128,7 +144,11 @@ export default function TPopUp({ {button1Text && ( { + if (onClick) _onClick(); + else if (kind === "exit") onExit; + else _onClose(); + }} > {button1Text} diff --git a/com.twin.app.shoptime/src/components/TPopUp/TPopUp.module.less b/com.twin.app.shoptime/src/components/TPopUp/TPopUp.module.less index 5857d95d..718bbe69 100644 --- a/com.twin.app.shoptime/src/components/TPopUp/TPopUp.module.less +++ b/com.twin.app.shoptime/src/components/TPopUp/TPopUp.module.less @@ -152,3 +152,27 @@ gap: 12px; } } + +.eventBannerPopup { + .default-style(); + .info { + width: 600px; + height: 510px; + } + + .buttonContainer { + display: flex; + justify-content: center; + gap: 12px; + position: absolute; + left: 0; + right: 0; + bottom: 0; + + > div { + min-width: 240px; + height: 80px; + cursor: pointer; + } + } +}