Unified · Split
| @@ -269,8 +269,21 @@ function ComposerBannerStackAlert({ · 268 unmodified lines | ||
| 269 | 269 | className={item.className} |
| 270 | 270 | > |
| 271 | 271 | <ComposerBanner.Row layout="wrap-actions"> |
| 272 | − <ComposerBanner.Icon>{item.icon}</ComposerBanner.Icon> | |
| 273 | − <ComposerBanner.Content className="font-medium">{item.title}</ComposerBanner.Content> | |
| 272 | + <ComposerBanner.Icon className={item.description ? "min-h-4 self-start" : undefined}> | |
| 273 | + {item.icon} | |
| 274 | + </ComposerBanner.Icon> | |
| 275 | + <ComposerBanner.Content | |
| 276 | + className={item.description ? "flex-col items-start gap-0" : "font-medium"} | |
| 277 | + > | |
| 278 | + {item.description ? ( | |
| 279 | + <> | |
| 280 | + <span className="font-medium">{item.title}</span> | |
| 281 | + <span className="text-muted-foreground">{item.description}</span> | |
| 282 | + </> | |
| 283 | + ) : ( | |
| 284 | + item.title | |
| 285 | + )} | |
| 286 | + </ComposerBanner.Content> | |
| 274 | 287 | {item.actions || item.onDismiss ? ( |
| 275 | 288 | <ComposerBanner.Actions> |
| 276 | 289 | {item.actions} |
| @@ -284,19 +297,7 @@ function ComposerBannerStackAlert({ · 7 unmodified lines | ||
| 284 | 297 | </ComposerBanner.Actions> |
| 285 | 298 | ) : null} |
| 286 | 299 | </ComposerBanner.Row> |
| 287 | − {item.description || item.children ? ( | |
| 288 | − <ComposerBanner.Children> | |
| 289 | − {item.description ? ( | |
| 290 | − <ComposerBanner.Row> | |
| 291 | − <ComposerBanner.Icon /> | |
| 292 | − <ComposerBanner.Content className="text-muted-foreground"> | |
| 293 | − {item.description} | |
| 294 | − </ComposerBanner.Content> | |
| 295 | − </ComposerBanner.Row> | |
| 296 | − ) : null} | |
| 297 | − {item.children} | |
| 298 | − </ComposerBanner.Children> | |
| 299 | − ) : null} | |
| 300 | + {item.children ? <ComposerBanner.Children>{item.children}</ComposerBanner.Children> : null} | |
| 300 | 301 | </ComposerBanner.Root> |
| 301 | 302 | ); |
| 302 | 303 | } |