Commit @eb74cc52056269a665ade13ea9f21947b24872ed

8e393f3

eb74cc5

app/(protected)/(basic)/boards/_components/board-row-actions.tsx

--- app/(protected)/(basic)/boards/_components/board-row-actions.tsx

+++ app/(protected)/(basic)/boards/_components/board-row-actions.tsx


 
   return (
     <>
-      <FoxButtonGroup size="sm">
+      <FoxButtonGroup size="sm" align="center">
         <FoxIconButton
           type="default"
           size="sm"

8e393f3

eb74cc5

app/(protected)/(basic)/contents/_components/content-row-actions.tsx

--- app/(protected)/(basic)/contents/_components/content-row-actions.tsx

+++ app/(protected)/(basic)/contents/_components/content-row-actions.tsx


   }
 
   return (
-    <FoxButtonGroup size="sm">
+    <FoxButtonGroup size="sm" align="center">
       <FoxIconButton
         type="default"
         size="sm"

8e393f3

eb74cc5

app/(protected)/(basic)/decoration-items/_components/decoration-item-row-actions.tsx

--- app/(protected)/(basic)/decoration-items/_components/decoration-item-row-actions.tsx

+++ app/(protected)/(basic)/decoration-items/_components/decoration-item-row-actions.tsx


 
   return (
     <>
-      <FoxButtonGroup size="sm">
+      <FoxButtonGroup size="sm" align="center">
         <FoxIconButton
           type="default"
           size="sm"

8e393f3

eb74cc5

app/(protected)/(basic)/points/standards/_components/point-standard-row-actions.tsx

--- app/(protected)/(basic)/points/standards/_components/point-standard-row-actions.tsx

+++ app/(protected)/(basic)/points/standards/_components/point-standard-row-actions.tsx


 
   return (
     <>
-      <FoxButtonGroup size="sm">
+      <FoxButtonGroup size="sm" align="center">
         <FoxIconButton
           type="default"
           size="sm"

8e393f3

eb74cc5

app/(protected)/(basic)/system/codes/_components/code-row-actions.tsx

--- app/(protected)/(basic)/system/codes/_components/code-row-actions.tsx

+++ app/(protected)/(basic)/system/codes/_components/code-row-actions.tsx


       onClick={(event) => event.stopPropagation()}
       onKeyDown={(event) => event.stopPropagation()}
     >
-      <FoxButtonGroup size="sm">
+      <FoxButtonGroup size="sm" align="center">
         <FoxIconButton
           type="default"
           size="sm"

8e393f3

eb74cc5

app/(protected)/(basic)/system/menus/_components/menu-row-actions.tsx

--- app/(protected)/(basic)/system/menus/_components/menu-row-actions.tsx

+++ app/(protected)/(basic)/system/menus/_components/menu-row-actions.tsx


 import { useBlockingAction } from '@/app/_hooks/use-blocking-action';
 import type { SystemMenuNode } from '@/lib/domain/system-menu';
 import { deleteSystemMenuAction } from '../_actions';
-import styles from './menu-tree.module.scss';
 
 interface MenuRowActionsProps {
   node: SystemMenuNode;

   }
 
   return (
-    <div className={styles.actions}>
+    <FoxButtonGroup size="sm" align="center">
       <FoxIconButton
         type="default"
         size="sm"

         disabled={isDeleting}
         onAction={confirmDelete}
       />
-    </div>
+    </FoxButtonGroup>
   );
 }

8e393f3

eb74cc5

app/(protected)/(basic)/system/menus/_components/menu-tree.module.scss

--- app/(protected)/(basic)/system/menus/_components/menu-tree.module.scss

+++ app/(protected)/(basic)/system/menus/_components/menu-tree.module.scss


   }
 }
 
-.actions {
-  display: flex;
-  align-items: center;
-  gap: fox.gap(1);
-}

8e393f3

eb74cc5

app/(protected)/(basic)/system/merchants/_components/merchant-row-actions.tsx

--- app/(protected)/(basic)/system/merchants/_components/merchant-row-actions.tsx

+++ app/(protected)/(basic)/system/merchants/_components/merchant-row-actions.tsx


 'use client';
 
 import { useState } from 'react';
+import { FoxButtonGroup } from '@fox/core/components/fox-button-group';
 import { FoxIconButton } from '@fox/core/components/fox-icon-button';
 import { useFeedback } from '@/app/_hooks/use-feedback';
 import type { Merchant } from '@/lib/domain/merchant';

  *
  * TODO(백엔드): 삭제 API도 없다(`/api/v1/mngr/voc`는 목록·등록뿐). 시안의 자리는 두되
  * 눌러도 할 수 있는 일이 없어 사유를 알린다.
+ *
+ * 어느 행의 버튼인지는 각 버튼 라벨이 말한다 — 감싼 요소의 `aria-label`은 의미 없는
+ * 요소에 붙어 읽히지 않을 수 있다(공통코드 행과 같은 방식).
  */
 export function MerchantRowActions({ merchant }: MerchantRowActionsProps) {
   const { showToast } = useFeedback();
   const [isDetailOpen, setIsDetailOpen] = useState(false);
 
   return (
-    <span aria-label={`${merchant.name} 관리`}>
-      <FoxIconButton
-        type="default"
-        size="sm"
-        icon={<i className="fox-ico fox-ico-PencilSimple" aria-hidden="true" />}
-        label="수정"
-        onAction={() => setIsDetailOpen(true)}
-      />
-      <FoxIconButton
-        type="default"
-        size="sm"
-        icon={<i className="fox-ico fox-ico-Trash" aria-hidden="true" />}
-        label="삭제"
-        onAction={() =>
-          showToast({
-            variant: 'warning',
-            message: '가맹점 삭제 기능은 백엔드 준비 중입니다.',
-          })
-        }
-      />
+    <>
+      <FoxButtonGroup size="sm" align="center">
+        <FoxIconButton
+          type="default"
+          size="sm"
+          icon={<i className="fox-ico fox-ico-PencilSimple" aria-hidden="true" />}
+          label={`${merchant.name} 수정`}
+          onAction={() => setIsDetailOpen(true)}
+        />
+        <FoxIconButton
+          type="default"
+          size="sm"
+          icon={<i className="fox-ico fox-ico-Trash" aria-hidden="true" />}
+          label={`${merchant.name} 삭제`}
+          onAction={() =>
+            showToast({
+              variant: 'warning',
+              message: '가맹점 삭제 기능은 백엔드 준비 중입니다.',
+            })
+          }
+        />
+      </FoxButtonGroup>
 
       {isDetailOpen && (
         <MerchantFormModal

           onClose={() => setIsDetailOpen(false)}
         />
       )}
-    </span>
+    </>
   );
 }

...	...	@@ -83,7 +83,7 @@
83	83
84	84	return (
85	85	<>
86		- <FoxButtonGroup size="sm">
	86	+ <FoxButtonGroup size="sm" align="center">
87	87	<FoxIconButton
88	88	type="default"
89	89	size="sm"

...	...	@@ -52,7 +52,7 @@
52	52	}
53	53
54	54	return (
55		- <FoxButtonGroup size="sm">
	55	+ <FoxButtonGroup size="sm" align="center">
56	56	<FoxIconButton
57	57	type="default"
58	58	size="sm"

...	...	@@ -52,7 +52,7 @@
52	52
53	53	return (
54	54	<>
55		- <FoxButtonGroup size="sm">
	55	+ <FoxButtonGroup size="sm" align="center">
56	56	<FoxIconButton
57	57	type="default"
58	58	size="sm"

...	...	@@ -28,7 +28,7 @@
28	28	onClick={(event) => event.stopPropagation()}
29	29	onKeyDown={(event) => event.stopPropagation()}
30	30	>
31		- <FoxButtonGroup size="sm">
	31	+ <FoxButtonGroup size="sm" align="center">
32	32	<FoxIconButton
33	33	type="default"
34	34	size="sm"

...	...	@@ -7,7 +7,6 @@
7	7	import { useBlockingAction } from '@/app/_hooks/use-blocking-action';
8	8	import type { SystemMenuNode } from '@/lib/domain/system-menu';
9	9	import { deleteSystemMenuAction } from '../_actions';
10		-import styles from './menu-tree.module.scss';
11	10
12	11	interface MenuRowActionsProps {
13	12	node: SystemMenuNode;
...	...	@@ -49,7 +48,7 @@
49	48	}
50	49
51	50	return (
52		- <div className={styles.actions}>
	51	+ <FoxButtonGroup size="sm" align="center">
53	52	<FoxIconButton
54	53	type="default"
55	54	size="sm"
...	...	@@ -72,6 +71,6 @@
72	71	disabled={isDeleting}
73	72	onAction={confirmDelete}
74	73	/>
75		- </div>
	74	+ </FoxButtonGroup>
76	75	);
77	76	}

...	...	@@ -65,7 +65,7 @@
65	65
66	66	return (
67	67	<>
68		- <FoxButtonGroup size="sm">
	68	+ <FoxButtonGroup size="sm" align="center">
69	69	<FoxIconButton
70	70	type="default"
71	71	size="sm"

...	...	@@ -1,6 +1,7 @@
1	1	'use client';
2	2
3	3	import { useState } from 'react';
	4	+import { FoxButtonGroup } from '@fox/core/components/fox-button-group';
4	5	import { FoxIconButton } from '@fox/core/components/fox-icon-button';
5	6	import { useFeedback } from '@/app/_hooks/use-feedback';
6	7	import type { Merchant } from '@/lib/domain/merchant';
...	...	@@ -17,32 +18,37 @@
17	18	*
18	19	* TODO(백엔드): 삭제 API도 없다(`/api/v1/mngr/voc`는 목록·등록뿐). 시안의 자리는 두되
19	20	* 눌러도 할 수 있는 일이 없어 사유를 알린다.
	21	+ *
	22	+ * 어느 행의 버튼인지는 각 버튼 라벨이 말한다 — 감싼 요소의 `aria-label`은 의미 없는
	23	+ * 요소에 붙어 읽히지 않을 수 있다(공통코드 행과 같은 방식).
20	24	*/
21	25	export function MerchantRowActions({ merchant }: MerchantRowActionsProps) {
22	26	const { showToast } = useFeedback();
23	27	const [isDetailOpen, setIsDetailOpen] = useState(false);
24	28
25	29	return (
26		- <span aria-label={`${merchant.name} 관리`}>
27		- <FoxIconButton
28		- type="default"
29		- size="sm"
30		- icon={<i className="fox-ico fox-ico-PencilSimple" aria-hidden="true" />}
31		- label="수정"
32		- onAction={() => setIsDetailOpen(true)}
33		- />
34		- <FoxIconButton
35		- type="default"
36		- size="sm"
37		- icon={<i className="fox-ico fox-ico-Trash" aria-hidden="true" />}
38		- label="삭제"
39		- onAction={() =>
40		- showToast({
41		- variant: 'warning',
42		- message: '가맹점 삭제 기능은 백엔드 준비 중입니다.',
43		- })
44		- }
45		- />
	30	+ <>
	31	+ <FoxButtonGroup size="sm" align="center">
	32	+ <FoxIconButton
	33	+ type="default"
	34	+ size="sm"
	35	+ icon={<i className="fox-ico fox-ico-PencilSimple" aria-hidden="true" />}
	36	+ label={`${merchant.name} 수정`}
	37	+ onAction={() => setIsDetailOpen(true)}
	38	+ />
	39	+ <FoxIconButton
	40	+ type="default"
	41	+ size="sm"
	42	+ icon={<i className="fox-ico fox-ico-Trash" aria-hidden="true" />}
	43	+ label={`${merchant.name} 삭제`}
	44	+ onAction={() =>
	45	+ showToast({
	46	+ variant: 'warning',
	47	+ message: '가맹점 삭제 기능은 백엔드 준비 중입니다.',
	48	+ })
	49	+ }
	50	+ />
	51	+ </FoxButtonGroup>
46	52
47	53	{isDetailOpen && (
48	54	<MerchantFormModal
...	...	@@ -50,6 +56,6 @@
50	56	onClose={() => setIsDetailOpen(false)}
51	57	/>
52	58	)}
53		- </span>
	59	+ </>
54	60	);
55	61	}

Delete comment