SILVER/NODEDC_DESIGN_GUIDELINE
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Support centered SettingsCard result messages

Browse Source
This commit is contained in:
Codex
2026-09-07 13:43:23 +03:00
parent 1bdfc6c240
commit 5b882bc3d9
5 changed files with 26 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui-react/src/Settings.tsx
+4 -3
View File
@@ -6,11 +6,12 @@ export interface SettingsCardProps extends Omit<HTMLAttributes<HTMLElement>, "ti
title: ReactNode;
description?: ReactNode;
actions?: ReactNode;
align?: "start" | "center";
}
export function SettingsCard({ eyebrow, title, description, actions, children, className, ...props }: SettingsCardProps) {
export function SettingsCard({ eyebrow, title, description, actions, children, align = "start", className, ...props }: SettingsCardProps) {
return (
<section className={cn("nodedc-settings-card", className)} {...props}>
<section className={cn("nodedc-settings-card", className)} data-align={align === "center" ? "center" : undefined} {...props}>
<header className="nodedc-settings-card__head">
<div className="nodedc-settings-card__titles">
{eyebrow ? <span>{eyebrow}</span> : null}
@@ -19,7 +20,7 @@ export function SettingsCard({ eyebrow, title, description, actions, children, c
</div>
{actions ? <div className="nodedc-settings-card__actions">{actions}</div> : null}
</header>
<div className="nodedc-settings-card__body">{children}</div>
{align === "center" && (children === undefined || children === null || children === false) ? null : <div className="nodedc-settings-card__body">{children}</div>}
</section>
);
}