File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
08-14
08-14
08-18
08-18
08-18
08-14
08-18
08-18
08-18
08-18
08-18
File name
Commit message
Commit date
"use client";
import type { ReactNode } from "react";
import { cx } from "../../utils";
export interface FoxButtonPanelProps {
/** 시안의 상단 80px 여백. 페이지 하단이 아닌 곳에 놓을 땐 끈다. */
offset?: boolean;
/** 배치 조정용. */
className?: string;
/** 버튼 그룹들. 하나면 가운데, 여럿이면 양끝으로 벌어진다. */
children?: ReactNode;
}
/**
* @fox 페이지 하단 동작 영역. 배치만 책임지고 상태를 갖지 않는다.
*
* 자식 수를 세지 않는다 — 가운데 정렬은 CSS `:only-child`가 판단하므로 프래그먼트나
* 조건부 렌더로 자식이 갈려도 실제 DOM 기준으로 맞는다.
*
* ⚠️ 스타일은 이 파일이 import하지 않는다 — 호스트 앱이 `@use "@fox/styles/components"`
* (또는 개별 파티셜)로 한 번 불러와야 한다.
*/
export function FoxButtonPanel({
offset = true,
className,
children,
}: FoxButtonPanelProps) {
return (
<div
className={cx("fox-button-panel", offset && "fox-button-panel--offset", className)}
>
{children}
</div>
);
}