chore(ui): add card component

[karanh37]

---

Summary by Gitar

• New Card component:
  • Added reusable Card component in card.tsx with focus ring, rounded corners, and ring styling
  • Exported Card from main components index for public API access
• Storybook stories:
  • Added four Card story variants: Default, WithImage, WithFooter, and CustomWidth demonstrating usage patterns

_{This will update automatically on new commits.}

[gitar-bot]

Code Review ✅ Approved 1 resolved / 1 findings

Adds a new card UI component with proper overflow handling to ensure images respect rounded corners. No remaining issues found.

✅ 1 resolved

✅ Bug: Card missing overflow-hidden — images bleed past rounded corners

📄 openmetadata-ui-core-components/src/main/resources/ui/src/components/base/card/card.tsx:25 📄 openmetadata-ui-core-components/src/main/resources/ui/src/stories/Card.stories.tsx:48
The Card component applies tw:rounded-xl but does not include tw:overflow-hidden. When child content fills the card edge-to-edge (e.g., the gradient in the WithImage story), it will visually bleed past the rounded corners because the overflow is not clipped.

The story description on line 48 even states the image "overflows the card edges cleanly due to overflow-hidden," but this class is absent from the component itself.

Options

Auto-apply is off → Gitar will not commit updates to this branch.
Display: compact → Showing less information.

Comment with these commands to change:

Auto-apply	Compact
gitar auto-apply:on	gitar display:verbose

_{Was this helpful? React with 👍 / 👎 | Gitar}