Add built-in padding to the Core Catalog items

_↴ Ported from [flutter/genui#562](https://github.com/flutter/genui/issues/562) — originally opened by [jacobsimionato](https://github.com/jacobsimionato) on 2025-11-19._
_Original labels: P2, front-line-handled, second-line-triaged, a: core_catalog_

---

A2UI intentionally doesn't not let the LLM choose padding. Instead, we the renderer is responsible for this.

Our core catalog items have no built-in padding, so everything looks bad in the simple chat app.

How about these rules:
- Leaf components (e.g. text, image etc) add padding around themselves on every dimension by default. They can be special cased via usage hints to not do this, e.g. a "header" image has no top or side padding, but does have bottom padding.
- Container components which render nothing add no padding (e.g. Row, Column etc)
- Container components which have a border (e.g. Card) add padding around themselves, but not around their children

---

### 2 comment(s) from the original issue

**[jacobsimionato](https://github.com/jacobsimionato)** commented on 2025-11-21:

See example of poor padding:

---

**[jacobsimionato](https://github.com/jacobsimionato)** commented on 2026-01-21:

Downgrading to P2, because we decided that there are a couple of other more important steps to building out the standard catalog, so @andrewkolos probably won't get to it right away.