4 Commits

Include renames

Author	SHA1	Message	Date
Andreas ReinholdandClaude Opus 5	573d94fe6e	Give the xs button M3's 16dp padding, and stop groups wrapping ... ButtonXSmallTokens puts 16dp either side of an xs label, where the button, the <x-group> segment and --group-pad all wrote 12px; the variants table calls 16dp the Expressive value twice over. A standard button group also dropped onto a second line on a narrow window, which M3 forbids — and the press expansion only ever reaches a neighbour on the same line. Plan step 18, actions.md ACT-09, ACT-10. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9	2026-09-14 06:00:12 +02:00
Andreas ReinholdandClaude Opus 5	e4de067350	Give a connected segment M3's 48px target and width ... An <x-group> segment is a plain label, 32px or 40px tall, with nothing reaching past it, and nothing gave a connected <x-button-group> its 48dp minimum width either — both numbers M3 names and tells you not to reduce. The segment now carries the shared `touch-target` utility and a 48px floor, and groups.css puts the floor on the buttons a caller nests in a connected group. <x-button> drops its hand-rolled ::after for the same utility. Plan step 11, actions.md ACT-05. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9	2026-09-14 05:56:52 +02:00
Andreas Reinhold / reiniandClaude Opus 5	ab7317faae	Add hint-class to the group and icon-class to menu items ... <x-group hint-class> adds classes to the hint, as the text fields' hint-class does, and a validation message still replaces the hint. <x-menu-item icon-class> adds classes to the leading icon, for an icon whose colour means something of its own, such as a sport's glyph. A colour class there has to win over the component's own colour, and which of two colour utilities wins depends on the order Tailwind emits them (text-error comes before text-on-surface-variant). So when either prop is given, the component's own colour is written with a :where() variant that carries no specificity, as the fields' hint colour sits in the components layer. A disabled item's icon stays disabled. Without the props the markup is unchanged. The skill now also lists the fields' hint-class, which it had left out. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01RHoXZSHc8gGpZjFmA5fPc2	2026-09-13 18:18:39 +02:00
Andreas Reinhold / reiniandClaude Opus 5	cd64f4f371	Add buttons, menus and the rest of M3 Expressive's actions ... <x-button> (label buttons, icon buttons and toggles in five sizes, with filled, tonal, outlined, elevated and text variants in any colour role), <x-tooltip>, <x-menu> with items, groups and separators, <x-button-group>, <x-group> as a connected button group, <x-split-button>, <x-fab>, <x-fab-menu> and <x-loading>. Sizes, colours and shapes come from androidx Compose Material 3's tokens; the loading indicator ports its Morph into SVG + SMIL. Menus follow WAI-ARIA's menu button pattern on popovers placed by CSS anchor positioning. Browser tests run in Chromium, Firefox and WebKit. The showcase fetches the icon names on demand: inlined, they tripped Pest's test server into HTTP 431s under Firefox. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy	2026-09-13 06:09:28 +02:00