From 7ba2b1cf046626bdd3fed74d4506072907b89fa7 Mon Sep 17 00:00:00 2001
From: "jiwon93.son" <jiwon93.son@lge.partners.com>
Date: Mon, 1 Jul 2024 16:32:01 +0900
Subject: [PATCH] =?UTF-8?q?[MobileSendPopUp]=20SHOPTIME-2631=20-=20inputCo?=
 =?UTF-8?q?ntainer=20=EB=B6=84=EB=A6=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/MobileSend/MobileSendPopUp.jsx | 22 ++++++++++++++-----
 .../MobileSend/MobileSendPopUp.module.less    |  2 +-
 2 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.jsx b/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.jsx
index bf32123b..0b528d39 100644
--- a/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.jsx
+++ b/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.jsx
@@ -9,7 +9,7 @@ import {
 import { useDispatch, useSelector } from "react-redux";
 
 import { off, on } from "@enact/core/dispatcher";
-import { Spotlight } from "@enact/spotlight";
+import spotlight, { Spotlight } from "@enact/spotlight";
 import { SpotlightContainerDecorator } from "@enact/spotlight/SpotlightContainerDecorator";
 import { Spottable } from "@enact/spotlight/Spottable";
 
@@ -45,6 +45,11 @@ const Container = SpotlightContainerDecorator(
   "div"
 );
 
+const InputContainer = SpotlightContainerDecorator(
+  { enterTo: "last-focused" },
+  "div"
+);
+
 const SpottableComponent = Spottable("div");
 
 export default function MobileSendPopUp({
@@ -250,6 +255,7 @@ export default function MobileSendPopUp({
           },
         })
       );
+      spotlight.focus();
     }
   };
 
@@ -530,7 +536,7 @@ export default function MobileSendPopUp({
             </div>
             <div className={css.smsArea}>
               <div className={css.smsContainer}>
-                <Container className={css.smsNumLayer}>
+                <InputContainer className={css.smsNumLayer}>
                   <SpottableComponent
                     className={css.inputNum}
                     onClick={handleInputClick}
@@ -538,16 +544,20 @@ export default function MobileSendPopUp({
                   >
                     {mobileNumber}
                   </SpottableComponent>
-                  {keyPadOff ? (
+                </InputContainer>
+                {keyPadOff ? (
+                  <Container>
                     <HistoryPhoneNumber
                       handleClickSelect={handleClickSelect}
                       handleDelete={handleDelete}
                       recentSentNumber={recentSentNumber}
                     />
-                  ) : (
+                  </Container>
+                ) : (
+                  <Container>
                     <SMSNumKeyPad onKeyDown={numKeypadClicked} />
-                  )}
-                </Container>
+                  </Container>
+                )}
               </div>
               <div className={css.instruction}>
                 <span>
diff --git a/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.module.less b/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.module.less
index 7f38dffa..eb387e29 100644
--- a/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.module.less
+++ b/com.twin.app.shoptime/src/components/MobileSend/MobileSendPopUp.module.less
@@ -76,7 +76,7 @@
     .smsContainer {
       width: 571px;
       flex: none;
-      .flex(@justifyCenter: space-between, @alignCenter: flex-start);
+      .flex(@justifyCenter: space-between, @alignCenter: flex-start,@direction:column);
       .inputNum {
         position: relative;
         padding: 18px 5px 18px 20px;