From 2c19a208cd5fa763bbc63971cabdabc1dc0bfc4b Mon Sep 17 00:00:00 2001
From: ysCha <yscha@interplug.co.kr>
Date: Thu, 26 Mar 2026 09:36:50 +0900
Subject: [PATCH] =?UTF-8?q?=E8=A3=9C=E5=8A=A9=E7=B7=9A=E3=81=AE=E4=BD=9C?=
 =?UTF-8?q?=E6=88=90=20=ED=86=A0=EA=B8=80=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../modal/auxiliary/AuxiliaryDrawing.jsx          | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx b/src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx
index d7a475a0..1bbec893 100644
--- a/src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx
+++ b/src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx
@@ -8,14 +8,17 @@ import { OUTER_LINE_TYPE } from '@/store/outerLineAtom'
 import OuterLineWall from '@/components/floor-plan/modal/lineTypes/OuterLineWall'
 import { useAuxiliaryDrawing } from '@/hooks/roofcover/useAuxiliaryDrawing'
 import { usePopup } from '@/hooks/usePopup'
-import { useEffect } from 'react'
+import { useEffect, useState } from 'react'
 import { useRecoilValue } from 'recoil'
 import { canvasState } from '@/store/canvasAtom'
+import Image from 'next/image'
 
 export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
   const canvas = useRecoilValue(canvasState)
   const { getMessage } = useMessage()
   const { closePopup } = usePopup()
+  const [useCalcPad, setUseCalcPad] = useState(false)
+  const disableKeypad = !useCalcPad
 
   const types = [
     { id: 1, name: getMessage('straight.line'), type: OUTER_LINE_TYPE.OUTER_LINE },
@@ -71,6 +74,7 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
     length1Ref,
     arrow1,
     setArrow1,
+    disableKeypad,
   }
 
   const rightAngleProps = {
@@ -84,6 +88,7 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
     setArrow1,
     arrow2,
     setArrow2,
+    disableKeypad,
   }
 
   const doublePitchProps = {
@@ -105,6 +110,7 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
     setArrow2,
     arrow1Ref,
     arrow2Ref,
+    disableKeypad,
   }
 
   const angleProps = {
@@ -114,6 +120,7 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
     length1,
     setLength1,
     length1Ref,
+    disableKeypad,
   }
 
   const diagonalLineProps = {
@@ -130,6 +137,7 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
     setArrow1,
     arrow2,
     setArrow2,
+    disableKeypad,
   }
 
   const onClickButton = (button) => {
@@ -160,7 +168,10 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
           {buttonAct === 4 && <Angle props={angleProps} />}
           {buttonAct === 5 && <Diagonal props={diagonalLineProps} />}
         </div>
-        <div className="grid-btn-wrap">
+        <div className="grid-btn-wrap" style={{ display: 'flex', alignItems: 'center', justifyContent: 'flex-end', gap: '5px' }}>
+          <button style={{ width: 'auto' }} type="button" onClick={() => setUseCalcPad((prev) => !prev)}>
+            <Image src={useCalcPad ? '/static/images/common/Icon_ON_Black.png' : '/static/images/common/Icon_OFF_Black.png'} alt="toggle" width={34} height={34} />
+          </button>
           <button className="btn-frame modal mr5" onClick={handleRollback}>
             {getMessage('modal.cover.outline.rollback')}
           </button>