@@ -109,6 +115,7 @@ function CnstpSeRowComponent({ row, depth, onChange, onAddChild, onDelete }: Cns
onChange({ sortSeq: e.target.value ? Number(e.target.value) : undefined })
diff --git a/apps/as/src/pages/code-management/ui/fnrs-shar-code-tab-panel.tsx b/apps/as/src/pages/code-management/ui/fnrs-shar-code-tab-panel.tsx
index fa6089a27..b14c46fbd 100644
--- a/apps/as/src/pages/code-management/ui/fnrs-shar-code-tab-panel.tsx
+++ b/apps/as/src/pages/code-management/ui/fnrs-shar-code-tab-panel.tsx
@@ -115,13 +115,13 @@ function FnrsSharCodeTabPanel() {
- 코드
- 코드명
- 설명
- 사용 여부
- 정렬순서
- 구분
- 관리
+ 코드
+ 코드명
+ 설명
+ 사용 여부
+ 정렬순서
+ 구분
+ 관리
diff --git a/apps/as/src/pages/code-management/ui/fnrs-shar-se-row.tsx b/apps/as/src/pages/code-management/ui/fnrs-shar-se-row.tsx
index 071ac16e2..e60134f33 100644
--- a/apps/as/src/pages/code-management/ui/fnrs-shar-se-row.tsx
+++ b/apps/as/src/pages/code-management/ui/fnrs-shar-se-row.tsx
@@ -40,9 +40,10 @@ function FnrsSharSeRowComponent({ row, depth, onChange, onAddChild, onDelete }:
value={row.fnrsSharSeCd}
onChange={(e) => onChange({ fnrsSharSeCd: e.target.value })}
placeholder="코드"
+ title="코드"
maxLength={10}
disabled={!row.isNew}
- className="flex-1"
+ className="flex-1 disabled:opacity-100"
/>
@@ -51,6 +52,7 @@ function FnrsSharSeRowComponent({ row, depth, onChange, onAddChild, onDelete }:
value={row.fnrsSharSeCdNm ?? ""}
onChange={(e) => onChange({ fnrsSharSeCdNm: e.target.value })}
placeholder="코드명"
+ title="코드명"
maxLength={100}
/>
@@ -59,6 +61,7 @@ function FnrsSharSeRowComponent({ row, depth, onChange, onAddChild, onDelete }:
value={row.expln ?? ""}
onChange={(e) => onChange({ expln: e.target.value })}
placeholder="설명"
+ title="설명"
maxLength={1000}
/>
@@ -66,6 +69,7 @@ function FnrsSharSeRowComponent({ row, depth, onChange, onAddChild, onDelete }:
onChange({ useYn: v })}
+ aria-label="사용 여부"
className="flex justify-center gap-4"
>
@@ -82,6 +86,7 @@ function FnrsSharSeRowComponent({ row, depth, onChange, onAddChild, onDelete }:
onChange({ sortSeq: e.target.value ? Number(e.target.value) : undefined })
diff --git a/packages/common/components/src/ui/footer/index.tsx b/packages/common/components/src/ui/footer/index.tsx
index fe8a16c5d..63815c065 100644
--- a/packages/common/components/src/ui/footer/index.tsx
+++ b/packages/common/components/src/ui/footer/index.tsx
@@ -81,22 +81,27 @@ export function Footer() {
const mainBanners =
bannerList?.filter((banner) => banner.bnrTypeCd === "BNRFTER") ?? [];
- const plugin = useRef(Autoplay({ delay: 2000, stopOnInteraction: true }));
+ // 기본은 정지 상태, 사용자가 시작 버튼을 눌러야 자동 넘김
+ const plugin = useRef(
+ Autoplay({ delay: 2000, stopOnInteraction: true, playOnInit: false }),
+ );
const [carouselApi, setCarouselApi] = useState();
- const [isAutoplaying, setIsAutoplaying] = useState(true);
+ const [isAutoplaying, setIsAutoplaying] = useState(false);
// 사용자 조작·초점 진입 등으로 자동 넘김이 멈추거나 재개될 때 버튼 상태를 동기화한다
+ // (autoplay:play/stop 이벤트는 플러그인 내부 상태 변경 "전"에 발생하므로 isPlaying() 대신 이벤트 종류로 판단)
useEffect(() => {
if (!carouselApi) return;
- const syncAutoplayState = () => setIsAutoplaying(plugin.current.isPlaying());
- syncAutoplayState();
- carouselApi.on("autoplay:play", syncAutoplayState);
- carouselApi.on("autoplay:stop", syncAutoplayState);
+ const handleAutoplayPlay = () => setIsAutoplaying(true);
+ const handleAutoplayStop = () => setIsAutoplaying(false);
+ setIsAutoplaying(plugin.current.isPlaying());
+ carouselApi.on("autoplay:play", handleAutoplayPlay);
+ carouselApi.on("autoplay:stop", handleAutoplayStop);
return () => {
- carouselApi.off("autoplay:play", syncAutoplayState);
- carouselApi.off("autoplay:stop", syncAutoplayState);
+ carouselApi.off("autoplay:play", handleAutoplayPlay);
+ carouselApi.off("autoplay:stop", handleAutoplayStop);
};
}, [carouselApi]);
@@ -160,26 +165,11 @@ export function Footer() {
>지원센타
-
-
-
{mainBanners && mainBanners.length > 0 ? (
@@ -206,6 +196,22 @@ export function Footer() {
)}
+ {/* 자동 넘김 정지/시작: 좌측 화살표 앞에 배치 (탭 순서도 화살표보다 먼저) */}
+