From 0f57696284e4f584fdf156ec72479bbe82c86e11 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=A7=84=ED=98=B8?= <rlawlsgh1227@gmail.com>
Date: Tue, 15 Oct 2024 15:50:54 +0900
Subject: [PATCH 1/7] =?UTF-8?q?feat:=20=EB=84=98=EB=B2=84=20=ED=82=A4?=
 =?UTF-8?q?=ED=8C=A8=EB=93=9C=20=EC=8A=A4=ED=81=AC=EB=A6=B0=EB=A6=AC?=
 =?UTF-8?q?=EB=8D=94=EB=A1=9C=20=EC=82=AC=EC=9A=A9=ED=96=88=EC=9D=84=20?=
 =?UTF-8?q?=EB=95=8C=20=EB=B2=84=ED=8A=BC=20=ED=97=B7=EA=B0=88=EB=A6=AC?=
 =?UTF-8?q?=EC=A7=80=20=EC=95=8A=EB=8F=84=EB=A1=9D=20label=20=EC=84=A4?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/NumberKeyboard/Keypad.tsx      |   4 +-
 .../NumberKeyboard/NumberKeyboard.tsx         |  14 +--
 .../components/NumberKeyboard/keypads.ts      | 105 ++++++++++++++++++
 3 files changed, 115 insertions(+), 8 deletions(-)
 create mode 100644 client/src/components/Design/components/NumberKeyboard/keypads.ts

diff --git a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
index 3f41fad95..3891e6239 100644
--- a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
+++ b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
@@ -7,14 +7,16 @@ import {Text, useTheme} from '@components/Design';
 
 interface Props {
   value: string;
+  label: string;
   onClick: () => void;
   disabled?: boolean;
 }
 
-export function Keypad({value, onClick, disabled = false}: Props) {
+export function Keypad({value, label, onClick, disabled = false}: Props) {
   const {theme} = useTheme();
   return (
     <button
+      aria-label={label}
       css={css`
         display: flex;
         justify-content: center;
diff --git a/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx b/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
index 97d8b090d..ba4bde098 100644
--- a/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
+++ b/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
@@ -7,6 +7,7 @@ import {Button} from '@components/Design';
 
 import {Keypad} from './Keypad';
 import useNumberKeyboard from './useNumberKeyboard';
+import {amountKeypads, numberKeypads} from './keypads';
 
 export type KeyboardType = 'number' | 'string' | 'amount';
 
@@ -19,8 +20,6 @@ export interface NumberKeyboardProps {
 
 export default function NumberKeyboard({type, maxNumber, initialValue, onChange}: NumberKeyboardProps) {
   const {theme} = useTheme();
-  const amountKeypads = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '00', '0', '<-'];
-  const numberKeypads = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '', '0', '<-'];
 
   const {onClickKeypad, onClickDelete, onClickDeleteAll, onClickAddAmount} = useNumberKeyboard({
     type,
@@ -65,12 +64,13 @@ export default function NumberKeyboard({type, maxNumber, initialValue, onChange}
           </Button>
         </div>
       )}
-      {(type === 'amount' ? amountKeypads : numberKeypads).map(el => (
+      {(type === 'amount' ? amountKeypads : numberKeypads).map(({keypad, label}) => (
         <Keypad
-          key={el}
-          value={el}
-          disabled={el === ''}
-          onClick={el === '<-' ? onClickDelete : () => onClickKeypad(el)}
+          key={keypad}
+          value={keypad}
+          label={label}
+          disabled={keypad === ''}
+          onClick={keypad === '<-' ? onClickDelete : () => onClickKeypad(keypad)}
         />
       ))}
     </div>
diff --git a/client/src/components/Design/components/NumberKeyboard/keypads.ts b/client/src/components/Design/components/NumberKeyboard/keypads.ts
new file mode 100644
index 000000000..968acdb53
--- /dev/null
+++ b/client/src/components/Design/components/NumberKeyboard/keypads.ts
@@ -0,0 +1,105 @@
+type Keypad = {
+  keypad: string;
+  label: string;
+};
+
+export const amountKeypads: Keypad[] = [
+  {
+    keypad: '1',
+    label: '1',
+  },
+  {
+    keypad: '2',
+    label: '2',
+  },
+  {
+    keypad: '3',
+    label: '3',
+  },
+  {
+    keypad: '4',
+    label: '4',
+  },
+  {
+    keypad: '5',
+    label: '5',
+  },
+  {
+    keypad: '6',
+    label: '6',
+  },
+  {
+    keypad: '7',
+    label: '7',
+  },
+  {
+    keypad: '8',
+    label: '8',
+  },
+  {
+    keypad: '9',
+    label: '9',
+  },
+  {
+    keypad: '00',
+    label: '0 2개 버튼',
+  },
+  {
+    keypad: '0',
+    label: '0',
+  },
+  {
+    keypad: '<-',
+    label: '직전 입력 지우기',
+  },
+];
+export const numberKeypads: Keypad[] = [
+  {
+    keypad: '1',
+    label: '1',
+  },
+  {
+    keypad: '2',
+    label: '2',
+  },
+  {
+    keypad: '3',
+    label: '3',
+  },
+  {
+    keypad: '4',
+    label: '4',
+  },
+  {
+    keypad: '5',
+    label: '5',
+  },
+  {
+    keypad: '6',
+    label: '6',
+  },
+  {
+    keypad: '7',
+    label: '7',
+  },
+  {
+    keypad: '8',
+    label: '8',
+  },
+  {
+    keypad: '9',
+    label: '9',
+  },
+  {
+    keypad: '',
+    label: '',
+  },
+  {
+    keypad: '0',
+    label: '0',
+  },
+  {
+    keypad: '<-',
+    label: '직전 입력 지우기',
+  },
+];

From ad2d2ea72d7c04a0f5f31ccac2f860fd73616063 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=A7=84=ED=98=B8?= <rlawlsgh1227@gmail.com>
Date: Wed, 16 Oct 2024 09:54:22 +0900
Subject: [PATCH 2/7] =?UTF-8?q?style:=20label=20=3D>=20ariaLabel=EC=9C=BC?=
 =?UTF-8?q?=EB=A1=9C=20=EB=B3=80=EC=88=98=EB=AA=85=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/NumberKeyboard/Keypad.tsx      |  6 +--
 .../NumberKeyboard/NumberKeyboard.tsx         |  4 +-
 .../components/NumberKeyboard/keypads.ts      | 50 +++++++++----------
 3 files changed, 30 insertions(+), 30 deletions(-)

diff --git a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
index 3891e6239..6445908df 100644
--- a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
+++ b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
@@ -7,16 +7,16 @@ import {Text, useTheme} from '@components/Design';
 
 interface Props {
   value: string;
-  label: string;
+  ariaLabel?: string;
   onClick: () => void;
   disabled?: boolean;
 }
 
-export function Keypad({value, label, onClick, disabled = false}: Props) {
+export function Keypad({value, ariaLabel, onClick, disabled = false}: Props) {
   const {theme} = useTheme();
   return (
     <button
-      aria-label={label}
+      aria-label={ariaLabel}
       css={css`
         display: flex;
         justify-content: center;
diff --git a/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx b/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
index ba4bde098..0b3c36a21 100644
--- a/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
+++ b/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
@@ -64,11 +64,11 @@ export default function NumberKeyboard({type, maxNumber, initialValue, onChange}
           </Button>
         </div>
       )}
-      {(type === 'amount' ? amountKeypads : numberKeypads).map(({keypad, label}) => (
+      {(type === 'amount' ? amountKeypads : numberKeypads).map(({keypad, ariaLabel}) => (
         <Keypad
           key={keypad}
           value={keypad}
-          label={label}
+          ariaLabel={ariaLabel}
           disabled={keypad === ''}
           onClick={keypad === '<-' ? onClickDelete : () => onClickKeypad(keypad)}
         />
diff --git a/client/src/components/Design/components/NumberKeyboard/keypads.ts b/client/src/components/Design/components/NumberKeyboard/keypads.ts
index 968acdb53..1ea4c3272 100644
--- a/client/src/components/Design/components/NumberKeyboard/keypads.ts
+++ b/client/src/components/Design/components/NumberKeyboard/keypads.ts
@@ -1,105 +1,105 @@
 type Keypad = {
   keypad: string;
-  label: string;
+  ariaLabel: string;
 };
 
 export const amountKeypads: Keypad[] = [
   {
     keypad: '1',
-    label: '1',
+    ariaLabel: '1',
   },
   {
     keypad: '2',
-    label: '2',
+    ariaLabel: '2',
   },
   {
     keypad: '3',
-    label: '3',
+    ariaLabel: '3',
   },
   {
     keypad: '4',
-    label: '4',
+    ariaLabel: '4',
   },
   {
     keypad: '5',
-    label: '5',
+    ariaLabel: '5',
   },
   {
     keypad: '6',
-    label: '6',
+    ariaLabel: '6',
   },
   {
     keypad: '7',
-    label: '7',
+    ariaLabel: '7',
   },
   {
     keypad: '8',
-    label: '8',
+    ariaLabel: '8',
   },
   {
     keypad: '9',
-    label: '9',
+    ariaLabel: '9',
   },
   {
     keypad: '00',
-    label: '0 2개 버튼',
+    ariaLabel: '0 2개 버튼',
   },
   {
     keypad: '0',
-    label: '0',
+    ariaLabel: '0',
   },
   {
     keypad: '<-',
-    label: '직전 입력 지우기',
+    ariaLabel: '직전 입력 지우기',
   },
 ];
 export const numberKeypads: Keypad[] = [
   {
     keypad: '1',
-    label: '1',
+    ariaLabel: '1',
   },
   {
     keypad: '2',
-    label: '2',
+    ariaLabel: '2',
   },
   {
     keypad: '3',
-    label: '3',
+    ariaLabel: '3',
   },
   {
     keypad: '4',
-    label: '4',
+    ariaLabel: '4',
   },
   {
     keypad: '5',
-    label: '5',
+    ariaLabel: '5',
   },
   {
     keypad: '6',
-    label: '6',
+    ariaLabel: '6',
   },
   {
     keypad: '7',
-    label: '7',
+    ariaLabel: '7',
   },
   {
     keypad: '8',
-    label: '8',
+    ariaLabel: '8',
   },
   {
     keypad: '9',
-    label: '9',
+    ariaLabel: '9',
   },
   {
     keypad: '',
-    label: '',
+    ariaLabel: '',
   },
   {
     keypad: '0',
-    label: '0',
+    ariaLabel: '0',
   },
   {
     keypad: '<-',
-    label: '직전 입력 지우기',
+    ariaLabel: '직전 입력 지우기',
   },
 ];

From 86113b98890063a5d54d98d83adee235c6a88281 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=A7=84=ED=98=B8?= <rlawlsgh1227@gmail.com>
Date: Thu, 17 Oct 2024 11:27:59 +0900
Subject: [PATCH 3/7] =?UTF-8?q?style:=20button=20element=20prop=20?=
 =?UTF-8?q?=ED=99=95=EC=9E=A5=ED=95=B4=EC=84=9C=20=EB=84=98=EA=B2=A8?=
 =?UTF-8?q?=EC=A3=BC=EB=8A=94=20=EB=B0=A9=EC=8B=9D=EC=9C=BC=EB=A1=9C=20?=
 =?UTF-8?q?=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Design/components/NumberKeyboard/Keypad.tsx    | 14 +++++---------
 .../components/NumberKeyboard/NumberKeyboard.tsx   |  2 +-
 2 files changed, 6 insertions(+), 10 deletions(-)

diff --git a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
index 6445908df..a31b35d90 100644
--- a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
+++ b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
@@ -5,18 +5,16 @@ import {setDarker, setLighter} from '@components/Design/utils/colors';
 
 import {Text, useTheme} from '@components/Design';
 
-interface Props {
+type KeypadProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
   value: string;
-  ariaLabel?: string;
-  onClick: () => void;
-  disabled?: boolean;
-}
+};
 
-export function Keypad({value, ariaLabel, onClick, disabled = false}: Props) {
+export function Keypad({value, ...restButtonProps}: KeypadProps) {
   const {theme} = useTheme();
+
   return (
     <button
-      aria-label={ariaLabel}
+      {...restButtonProps}
       css={css`
         display: flex;
         justify-content: center;
@@ -35,8 +33,6 @@ export function Keypad({value, ariaLabel, onClick, disabled = false}: Props) {
           }
         }
       `}
-      onClick={onClick}
-      disabled={disabled}
     >
       <Text size="title">{value}</Text>
     </button>
diff --git a/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx b/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
index 0b3c36a21..0b347b55f 100644
--- a/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
+++ b/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
@@ -68,7 +68,7 @@ export default function NumberKeyboard({type, maxNumber, initialValue, onChange}
         <Keypad
           key={keypad}
           value={keypad}
-          ariaLabel={ariaLabel}
+          aria-label={ariaLabel}
           disabled={keypad === ''}
           onClick={keypad === '<-' ? onClickDelete : () => onClickKeypad(keypad)}
         />

From 8281b536b74f84bb8b6c535f9db30bebffe80afa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=A7=84=ED=98=B8?= <rlawlsgh1227@gmail.com>
Date: Thu, 17 Oct 2024 11:28:35 +0900
Subject: [PATCH 4/7] =?UTF-8?q?feat:=20button=20text=EB=A5=BC=20=EC=9D=BD?=
 =?UTF-8?q?=EC=9D=80=20=ED=9B=84=20text=EB=8F=84=20=EC=9D=BD=ED=9E=88?=
 =?UTF-8?q?=EC=A7=80=20=EC=95=8A=EB=8F=84=EB=A1=9D=20aria-hidden=20?=
 =?UTF-8?q?=EC=84=A4=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Design/components/NumberKeyboard/Keypad.tsx    | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
index a31b35d90..f6e6cf786 100644
--- a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
+++ b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
@@ -34,7 +34,9 @@ export function Keypad({value, ...restButtonProps}: KeypadProps) {
         }
       `}
     >
-      <Text size="title">{value}</Text>
+      <Text size="title" aria-hidden>
+        {value}
+      </Text>
     </button>
   );
 }

From 7f6a3a881fc479d6076e5e71abc9371e508cb4a7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=A7=84=ED=98=B8?= <rlawlsgh1227@gmail.com>
Date: Thu, 17 Oct 2024 11:35:28 +0900
Subject: [PATCH 5/7] =?UTF-8?q?feat:=20=EC=A7=81=EC=A0=84=20=EC=9E=85?=
 =?UTF-8?q?=EB=A0=A5=20=EC=A7=80=EC=9A=B0=EA=B8=B0=20->=20=EB=A7=88?=
 =?UTF-8?q?=EC=A7=80=EB=A7=89=20=EC=88=AB=EC=9E=90=20=EC=A7=80=EC=9A=B0?=
 =?UTF-8?q?=EA=B8=B0=EB=A1=9C=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Design/components/NumberKeyboard/keypads.ts    | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/client/src/components/Design/components/NumberKeyboard/keypads.ts b/client/src/components/Design/components/NumberKeyboard/keypads.ts
index 1ea4c3272..e6583562e 100644
--- a/client/src/components/Design/components/NumberKeyboard/keypads.ts
+++ b/client/src/components/Design/components/NumberKeyboard/keypads.ts
@@ -50,7 +50,7 @@ export const amountKeypads: Keypad[] = [
   },
   {
     keypad: '<-',
-    ariaLabel: '직전 입력 지우기',
+    ariaLabel: '마지막 숫자 지우기',
   },
 ];
 export const numberKeypads: Keypad[] = [
@@ -100,6 +100,6 @@ export const numberKeypads: Keypad[] = [
   },
   {
     keypad: '<-',
-    ariaLabel: '직전 입력 지우기',
+    ariaLabel: '마지막 숫자 지우기',
   },
 ];

From 1cf6116fec71f2383b1d7974fa110a4a44786d67 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=A7=84=ED=98=B8?= <rlawlsgh1227@gmail.com>
Date: Thu, 17 Oct 2024 13:44:28 +0900
Subject: [PATCH 6/7] =?UTF-8?q?style:=20html=20button=20=EB=82=B4=20value?=
 =?UTF-8?q?=EA=B0=80=20=EC=95=84=EB=8B=8C=20=EC=A7=81=EC=A0=91=20=EC=A0=95?=
 =?UTF-8?q?=EC=9D=98=ED=95=9C=20value=EC=9E=84=EC=9D=84=20=EB=AA=85?=
 =?UTF-8?q?=EC=8B=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/Design/components/NumberKeyboard/Keypad.tsx  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
index f6e6cf786..3447e1f1d 100644
--- a/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
+++ b/client/src/components/Design/components/NumberKeyboard/Keypad.tsx
@@ -5,7 +5,7 @@ import {setDarker, setLighter} from '@components/Design/utils/colors';
 
 import {Text, useTheme} from '@components/Design';
 
-type KeypadProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
+type KeypadProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'value'> & {
   value: string;
 };
 

From 73bda7c6cac15304728f11bbbc7e0be75cd73b09 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EC=A7=84=ED=98=B8?= <rlawlsgh1227@gmail.com>
Date: Thu, 17 Oct 2024 14:48:56 +0900
Subject: [PATCH 7/7] =?UTF-8?q?refactor:=20=ED=82=A4=ED=8C=A8=EB=93=9C=20?=
 =?UTF-8?q?=EB=A7=8C=EB=93=9C=EB=8A=94=20=ED=95=A8=EC=88=98=EB=A1=9C=20?=
 =?UTF-8?q?=EA=B0=9C=EC=84=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../NumberKeyboard/NumberKeyboard.tsx         |   6 +-
 .../components/NumberKeyboard/keypads.ts      | 120 ++++--------------
 2 files changed, 24 insertions(+), 102 deletions(-)

diff --git a/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx b/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
index 0b347b55f..81a10ff36 100644
--- a/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
+++ b/client/src/components/Design/components/NumberKeyboard/NumberKeyboard.tsx
@@ -7,9 +7,7 @@ import {Button} from '@components/Design';
 
 import {Keypad} from './Keypad';
 import useNumberKeyboard from './useNumberKeyboard';
-import {amountKeypads, numberKeypads} from './keypads';
-
-export type KeyboardType = 'number' | 'string' | 'amount';
+import {KeyboardType, makeKeypads} from './keypads';
 
 export interface NumberKeyboardProps {
   type: KeyboardType;
@@ -64,7 +62,7 @@ export default function NumberKeyboard({type, maxNumber, initialValue, onChange}
           </Button>
         </div>
       )}
-      {(type === 'amount' ? amountKeypads : numberKeypads).map(({keypad, ariaLabel}) => (
+      {makeKeypads(type).map(({keypad, ariaLabel}) => (
         <Keypad
           key={keypad}
           value={keypad}
diff --git a/client/src/components/Design/components/NumberKeyboard/keypads.ts b/client/src/components/Design/components/NumberKeyboard/keypads.ts
index e6583562e..a1a6204f4 100644
--- a/client/src/components/Design/components/NumberKeyboard/keypads.ts
+++ b/client/src/components/Design/components/NumberKeyboard/keypads.ts
@@ -1,105 +1,29 @@
+export type KeyboardType = 'number' | 'string' | 'amount';
+
 type Keypad = {
   keypad: string;
   ariaLabel: string;
 };
 
-export const amountKeypads: Keypad[] = [
-  {
-    keypad: '1',
-    ariaLabel: '1',
-  },
-  {
-    keypad: '2',
-    ariaLabel: '2',
-  },
-  {
-    keypad: '3',
-    ariaLabel: '3',
-  },
-  {
-    keypad: '4',
-    ariaLabel: '4',
-  },
-  {
-    keypad: '5',
-    ariaLabel: '5',
-  },
-  {
-    keypad: '6',
-    ariaLabel: '6',
-  },
-  {
-    keypad: '7',
-    ariaLabel: '7',
-  },
-  {
-    keypad: '8',
-    ariaLabel: '8',
-  },
-  {
-    keypad: '9',
-    ariaLabel: '9',
-  },
-  {
-    keypad: '00',
-    ariaLabel: '0 2개 버튼',
-  },
-  {
-    keypad: '0',
-    ariaLabel: '0',
-  },
-  {
-    keypad: '<-',
-    ariaLabel: '마지막 숫자 지우기',
-  },
-];
-export const numberKeypads: Keypad[] = [
-  {
-    keypad: '1',
-    ariaLabel: '1',
-  },
-  {
-    keypad: '2',
-    ariaLabel: '2',
-  },
-  {
-    keypad: '3',
-    ariaLabel: '3',
-  },
-  {
-    keypad: '4',
-    ariaLabel: '4',
-  },
-  {
-    keypad: '5',
-    ariaLabel: '5',
-  },
-  {
-    keypad: '6',
-    ariaLabel: '6',
-  },
-  {
-    keypad: '7',
-    ariaLabel: '7',
-  },
-  {
-    keypad: '8',
-    ariaLabel: '8',
-  },
-  {
-    keypad: '9',
-    ariaLabel: '9',
-  },
-  {
-    keypad: '',
-    ariaLabel: '',
-  },
-  {
-    keypad: '0',
-    ariaLabel: '0',
-  },
-  {
+export const makeKeypads = (type: KeyboardType): Keypad[] => {
+  const keypads: Keypad[] = [];
+
+  // 1~9는 동일
+  keypads.push(...new Array(9).fill(0).map((_, index) => ({keypad: String(index + 1), ariaLabel: String(index + 1)})));
+
+  // amount는 00버튼 나머지는 숨기기
+  if (type === 'amount') {
+    keypads.push({keypad: '00', ariaLabel: '0 2개 버튼'});
+  } else {
+    keypads.push({keypad: '', ariaLabel: ''});
+  }
+
+  // 나머지 0과 지우기 버튼
+  keypads.push({keypad: '0', ariaLabel: '0'});
+  keypads.push({
     keypad: '<-',
     ariaLabel: '마지막 숫자 지우기',
-  },
-];
+  });
+
+  return keypads;
+};