Menu toggle - move helper text in example as new demo

[andrew-ronaldson]

I noticed that there is a xs spacer used between form inputs and the helper text but the same spacer was not applied to menu toggle.

Forms

Menu toggle

[mcoker]

@andrew-ronaldson those menu toggle examples are just a standalone menu toggle + helper text. Currently to get the correct spacing there, you'd need to put it in a layout/component that supports helper text (like a form). I wonder if these examples should either:

• Not include the helper text, and just show the menu-toggle's status feature since this is the menu-toggle component and specifying a status doesn't automatically include the helper text. Often that's the difference between an example and a demo - the example is just the component and whatever its feature is, and the demo shows a more functional example of the feature, often in the context of other components/layouts
• The point above, but also add a demo either under menu-toggle or somewhere else, with a minimal form to include the helper text with the correct spacing.
• Update this example to wrap the input in a minimal form. With no label or submit buttons or anything, the form would probably be invisible to users unless you inspect the code.
• Update the example to use custom CSS or maybe the <Flex> layout or something to create the space above the helper text.
• Maybe add a variant to helper text for uses like this where it isn't in a wrapper (like .pf-m-standalone or something?), and that variation can add a margin-top or whatever to space itself from whatever comes before it.

wdyt?

[github-actions]

This issue has been automatically marked as stale because it has not had activity in the last 60 days.

[thatblindgeye]

Based on conversation from Core issue grooming, the resolution to this issue is:

• Update the existing React example to remove the helper text from the example -- only show the MenuToggles with the different statuses
• Create a new demo that shows how one might hook up helper text with a MenuToggle, we could use the applicable token as noted in the original comment above for spacing purposes.
• Update the status example verbiage to point to this new demo