37 lines
1.1 KiB
TypeScript
37 lines
1.1 KiB
TypeScript
import type { ReactNode } from "react";
|
|
|
|
/** 「标题 + 说明 | 控件」一行,设置页与内容策略共用 */
|
|
export default function AdminSettingRow({
|
|
title,
|
|
description,
|
|
control,
|
|
children,
|
|
}: {
|
|
title: ReactNode;
|
|
description?: ReactNode;
|
|
control?: ReactNode;
|
|
/** 展开区(如阈值输入),画在分隔线下方 */
|
|
children?: ReactNode;
|
|
}) {
|
|
return (
|
|
<div className="panel p-4 sm:p-5">
|
|
<div className="flex items-start justify-between gap-4 flex-wrap">
|
|
<div className="min-w-0 flex-1">
|
|
<h2 className="text-[15px] font-semibold flex items-center gap-1.5" style={{ color: "var(--ink)" }}>
|
|
{title}
|
|
</h2>
|
|
{description != null && description !== "" && (
|
|
<p className="meta text-[12.5px] mt-1 leading-relaxed">{description}</p>
|
|
)}
|
|
</div>
|
|
{control != null && <div className="shrink-0">{control}</div>}
|
|
</div>
|
|
{children != null && (
|
|
<div className="mt-4 pt-4" style={{ borderTop: "1px solid var(--line)" }}>
|
|
{children}
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|