'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
 * Bordered panel with a header divider — Dashboard, modals, and list-heavy views.
 * Matches Settings/Section card rhythm: `px-6` gutters, `py-4` header, body flush
 * below the divider with its own padding.
 */
export function PanelSection({ title, description, action, children, className = '', }) {
    return (_jsxs("section", { className: `bg-card border-border overflow-hidden rounded-xl border shadow-sm ${className}`, children: [(title || action) && (_jsxs("header", { className: "border-border flex items-center justify-between gap-3 border-b px-6 py-4", children: [_jsxs("div", { className: "min-w-0", children: [title &&
                                (typeof title === 'string' ? (_jsx("h2", { className: "text-foreground text-sm font-medium", children: title })) : (title)), description &&
                                (typeof description === 'string' ? (_jsx("p", { className: "text-muted-foreground mt-0.5 text-xs", children: description })) : (description))] }), action] })), children] }));
}
/** Standard inset for list rows / table bodies inside a {@link PanelSection}. */
export const PANEL_LIST_ROW_CLASS = 'hover:bg-accent/50 focus-visible:bg-accent/50 w-full px-6 py-4 text-left transition-colors';
//# sourceMappingURL=PanelSection.js.map