Catalyst: Button with no href prop doesn't render icons properly

What component (if applicable)

URL for category: Button Compnent
Component name: Button

Describe the bug A clear and concise description of what the bug is.

When a Button component has an href prop, rendering an icon per the tailwindUI docs works as expected.

However, with no href component, the icon has no styling applied to it, and the inline (or flex) properties that show the icon side-by-side with the text seem to vanish.

Exhibit A: Works as expected

<Button color="green" href="/">
  Button Text
  <CheckCircleIcon />
</Button>

Exhibit B: does NOT work as expected

<Button color="green">
  Button Text
  <CheckCircleIcon />
</Button>

To Reproduce Steps to reproduce the behavior:

Take the above exhibit(s) and paste them into a project configured properly for Catalyst (e.g. latest tailwind, framer, etc)
Observe the rendered buttons and their differences

Expected behavior A clear and concise description of what you expected to happen.

There should be no difference between the visual appearance of these two components, besides that one is an a element, and the other is a button element

Screenshots If applicable, add screenshots to help explain your problem.

Included above

Browser/Device (if applicable)

OS: MacOS Sonoma 14.5
Browser: Chrome
Version: 126.0.6478.127 (Official Build) (arm64)

Additional Context It seems the issue stems from the LoadingWrapper component -- props are not passed to the parent component of children, whereas with TouchTarget a fragment is used to ensure that children also receive the parent props that is responsible for styling and aligning the icon.

tailwindlabs / tailwindui-issues

Catalyst: Button with no href prop doesn't render icons properly #1610