Mobile v4 docs: min/max sizing, per-corner radius, autocapitalize, scroll centering

[shanerbaner82]

Documents the classes and attributes added by the recent Masterclass fixes, and corrects one table those fixes made wrong.

Shipped in: NativePHP/mobile-air#313, #314, #315 and NativePHP/mobile-ui#47, #48 — covering mobile-air issues #303, #304, #308, #309, #310, #311 (all reported by @shrutibalasawebdev).

---

The correction, first

layout.md's "Underlying values" table said 0 = start for align-items / align-self, and invites readers to pass those integers directly.

That's no longer true. 0 is now unset, and start is 4 — the renderers have to tell an element that explicitly asked for items-start apart from one that never specified an alignment, because the two mean different things and sharing a value made the first impossible to fix without changing the second everywhere.

So anyone following the old table with align-items="0" was silently getting the platform default rather than start. Table corrected, with an aside explaining the reason and steering toward labels/enums, which are unambiguous.

New surface

layout.md

• New Min / max size row: min-w-*, max-w-*, min-h-*, max-h-*, max-w-none, and the container scale on max-w (max-w-xs … max-w-7xl)
• New per-side and per-corner rounded rows, with a worked bubble-tail example and a note that class order doesn't matter (the more specific class always wins, as in Tailwind)
• The border-radius attribute now states it's uniform-only and points at the classes for per-corner
• Arbitrary-value prefix list extended with the min/max and per-corner forms

text-input.md

• New autocapitalize prop (none / sentences / words / characters)
• keyboard now documents that it carries capitalization and autocorrect, not just the key layout — which is exactly the assumption that made the original bug surprising
• New Capitalization section with the derivation table and examples

scroll-view.md

• New Centering short content example — fill on the scroll view's child now stretches it to at least the visible area, which is what gives justify-center room to work. Spelled out as a minimum, not a fixed height, so taller content still scrolls

Deliberately unsupported

Added a small table for the two things people will reach for and find silently dropped, with the reason and the alternative:

Class	Why
max-w-full, max-w-screen	min/max ride the wire as plain numbers with no size mode, so "100% of the parent" has nowhere to go — use w-full
rounded-s-*, rounded-ee-*, …	logical corners flip with writing direction, and the renderers don't mirror for RTL — use the physical rounded-l-* / rounded-tl-* forms

Two calls worth a second opinion

1. I documented the platform divergences honestly — align-items unset differing between iOS and Android, and plain-text capitalization differing (sentences on iOS, none on Android). Both are true and users will hit them, but if you'd rather the public docs not advertise them, they're each a single aside and easy to cut.
2. I did not document the Move heading # symbol after text, show on hover with animation #308 keyboard-dismiss fix — it restores behaviour the docs already implied, so there was nothing to correct.

Verification

Docs test suite passes (41 passed), and the @verbatim / <aside> / code-fence blocks are balanced in all three files.

⚠️ I could not render the pages locally: /docs/mobile/4/edge-components/layout returns 500 in my checkout — and it does so with these changes stashed too, so it's a pre-existing environment problem on my side rather than the markdown. Worth a render before merge.

🤖 Generated with Claude Code