feat: Add a blocklyNumberField CSS class to number fields

[Apocalypse96]

The basics

• I validated my changes

The details

Resolves

Fixes #8313

Proposed Changes

This PR adds a 'blocklyNumberField' CSS class to the FieldNumber element. Specifically:

• Implements the initView method in the FieldNumber class
• Applies the 'blocklyNumberField' class to the fieldGroup_ element
• Adds a null check for fieldGroup_ to prevent TypeScript errors

Reason for Changes

This change allows for more specific styling of number fields in Blockly, as requested in issue #8313. It provides a way to target number fields specifically in CSS, enhancing the ability to customize the appearance of these fields.

Test Coverage

I manually tested these changes by:

1. Creating a block with a number field
2. Inspecting the DOM to verify that the 'blocklyNumberField' class was applied
3. Applying CSS to the new class and verifying that it affected only number fields

Additional unit tests could be created to ensure the initView method is called and applies the class correctly.

Documentation

No documentation updates are required for this change, as it doesn't affect the public API or usage of Blockly. However, it might be beneficial to add a note in the theming documentation about the availability of this new CSS class for styling number fields.

Additional Information

This change is backwards-compatible and should not affect existing Blockly implementations. It simply adds an additional CSS class that can be used for more specific styling if desired.

[BeksOmega]

Hello, can you rebase this so that the changes are against rc/v12.0.0?

You can follow these steps:

1. Fetch the latest changes from rc/v12.0.0:

   git fetch upstream rc/v12.0.0

2. Checkout your branch:

   git checkout [your-branch-name]

3. Start an interactive rebase:

   git rebase -i upstream/rc/v12.0.0

4. In the editor that opens, identify the commits that aren't yours. These are likely the ones at the top of the list.

5. Change the word pick to drop for each commit you want to remove.

6. Save and close the editor.

7. Force push your changes to your branch: Note that force pushing is a dangerous operation because it overwrites commit history, so if you dropped the wrong commits you could lose work.

   git push -f origin [your-branch-name]

Once you've done this, the PR should be on the correct branch.

Let me know if you have any questions or run into any issues!

[BeksOmega]

@Apocalypse96 Are you still interested in working on this?

[Apocalypse96]

@Apocalypse96 Are you still interested in working on this?

ya sure

[BeksOmega]

@Apocalypse96 Are you still interested in working on this?

ya sure

In that case, could you follow the rebase instructions I posted above?

[Apocalypse96]

@BeksOmega I've rebased can u review the pr

[BeksOmega]

This looks great thank you for the fixes! Once this passes CI I'll get it merged =)