KCheckbox: Use flex rather than table for display

[nucleogenesis]

Description

Before:

See how when the box is highlighted, there is space under it.

Screencast_20250318_161152.webm

After

See how now the checkbox and its label are equal height & centered together

Screencast_20250318_161241.webm

Issue addressed

Using the table display value resulted in the checkbox icon having some unnecessary space beneath it which can make centering it bothersome when not using the label prop.

For example - here in Kolibri we have some /deep/ styling to mitigate this by moving the box itself down a bit like so:

Changelog

• Description: Summary of change(s)
• Products impact: Choose from - none (for internal updates) / bugfix / new API / updated API / removed API. If it's 'none', use "-" for all items below to indicate they are not relevant.
• Addresses: Link(s) to GH issue(s) addressed. Include KDS links as well as links to related issues in a consumer product repository too.
• Components: Affected public KDS component. Do not include internal sub-components or documentation components.
• Breaking: Will this change break something in a consumer? Choose from: yes / no
• Impacts a11y: Does this change improve a11y or adds new features that can be used to improve it? Choose from: yes / no
• Guidance: Why and how to introduce this update to a consumer? Required for breaking changes, appreciated for changes with a11y impact, and welcomed for non-breaking changes when relevant.

[bjester]

Overall, this seems good. My only concern is that the checkbox container overall seems slightly narrower in height. If we match the height with some padding to compensate, I presume that will produce less regressions, but open to thoughts.

[github-actions]

Percy Visual Test Results

Percy Dashboard: View Detailed Report

Environment:

• Node.js Version: 18.x
• OS: Ubuntu-latest

Instructions for Reviewers:

• Click on the Percy Dashboard link to view detailed visual diffs.
• Review the visual changes highlighted in the report.
• Approve or request changes based on the visual differences.