Enhance component API with responsive props, color propagation, and typography utilities

Bắt đầu bằng cách đọc các API hiện có của layout, visual component, Text, Headline và Button để xác định các pattern prop và màu hiện tại. Lập danh sách các component bị ảnh hưởng và xác định tiêu chí hoàn thành dựa trên các prop responsive được yêu cầu, các shorthand về spacing, việc truyền màu, behavior của contrast, các utility về typography và các biến thể kích thước của Section; issue không nêu file hoặc test cụ thể nào.

Summary

Enhance Apsara's component-level APIs to improve developer experience, reduce boilerplate, and provide consistent patterns across the library.

1. Responsive Props on Layout Components

Add responsive object syntax to all layout prop values (gap, direction, padding, etc.):

<Flex gap={{ initial: "3", md: "5" }} direction={{ initial: "column", sm: "row" }}>

Support breakpoints: initial, sm, md, lg, xl.

2. Inline Spacing Props

Add shorthand padding/margin props (p, px, py, pt, pr, pb, pl, m, mx, my, mt, mr, mb, ml) to layout components that map to the space scale:

<Box p="4" mx="auto" mt="6">

3. Systematic color Prop

Extend the color prop to all visual components (Badge, Callout, Text, Avatar, Chip, etc.), not just Button. Color should propagate to children through nesting, automatically adjusting internal tokens.

4. highContrast Prop

Add a highContrast boolean to all components that accept a color prop. This shifts colors to steps 9–12 of the scale for better contrast against the page background.

5. Typography Utility Props

Add the following props to Text and Headline:

• trim — remove leading/trailing whitespace for precise vertical alignment
• truncate — single-line ellipsis truncation
• wrap — control text wrapping (wrap, nowrap, balance, pretty)
• align — text alignment (left, center, right)
• Expand font weight options to 4 levels: light (300), regular (400), medium (500), bold (700)

6. Section Layout Component

Add a Section component for consistent vertical spacing between major page sections, with predefined size variants (small, medium, large).