FontSizePicker: Introduce label and help props

[SainathPoojary]

Closes: #68551

What?

This PR adds a label and help prop to the FontSizePicker component, allowing developers to provide additional guidance or context.

Why?

Currently, FontSizePicker only has a “Size” label and lacks a help text option. This makes it difficult to explain what specific font size is being controlled, especially in applications with multiple font sizes. Adding a help prop enables better UX by allowing contextual descriptions.

How?

• Introduced a label prop to allow customization of the control’s label.
• Introduced a help prop to provide additional context.
• help supports both string and function values; when a function is used, it receives the current value.
• Passed helpLabel to BaseControl.
• Updated Storybook to include help as a text controls.

Testing Instructions

1. Run Storybook (npm run storybook).
2. Open the FontSizePicker component.
3. Modify the label and help props using controls.
4. Verify the label updates correctly.
5. Check that help text appears as expected.

Screencast

2025-01-10.14-42-28.mp4

[github-actions]

Warning: Type of PR label mismatch

To merge this PR, it requires exactly 1 label indicating the type of PR. Other labels are optional and not being checked here.

• Type-related labels to choose from: [Type] Automated Testing, [Type] Breaking Change, [Type] Bug, [Type] Build Tooling, [Type] Code Quality, [Type] Copy, [Type] Developer Documentation, [Type] Enhancement, [Type] Experimental, [Type] Feature, [Type] New API, [Type] Task, [Type] Technical Prototype, [Type] Performance, [Type] Project Management, [Type] Regression, [Type] Security, [Type] WP Core Ticket, Backport from WordPress Core, Gutenberg Plugin.
• Labels found: .

Read more about Type labels in Gutenberg. Don't worry if you don't have the required permissions to add labels; the PR reviewer should be able to help with the task.

[github-actions]

Warning: Type of PR label mismatch

To merge this PR, it requires exactly 1 label indicating the type of PR. Other labels are optional and not being checked here.

• Type-related labels to choose from: [Type] Automated Testing, [Type] Breaking Change, [Type] Bug, [Type] Build Tooling, [Type] Code Quality, [Type] Copy, [Type] Developer Documentation, [Type] Enhancement, [Type] Experimental, [Type] Feature, [Type] New API, [Type] Task, [Type] Technical Prototype, [Type] Performance, [Type] Project Management, [Type] Regression, [Type] Security, [Type] WP Core Ticket, Backport from WordPress Core, Gutenberg Plugin.
• Labels found: .

Read more about Type labels in Gutenberg. Don't worry if you don't have the required permissions to add labels; the PR reviewer should be able to help with the task.

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: SainathPoojary <[email protected]>
Co-authored-by: slaFFik <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.