Component: TriStateCheckbox lost margin between label and checkbox

[jpgoelz]

Describe the bug

There is a design bug which was introduced by first replacing p-checkbox-label with p-tristatecheckbox-label in
#13977, then just removing the class altogether in #14312 and readding it in #14360.

When checking the changes between 16.6.0 (the version I know where both clicking the label and the style were working correctly) and 17.1.0 (link), I notice that the p-tristatecheckbox-label CSS class does no longer exist and should be replaced again with p-checkbox-label to fix this.

Additionally, the on-click event should be re-added to allow clicking on the label.

Environment

n/a

Reproducer

https://stackblitz.com/edit/77z5q5?file=src%2Fapp%2Fdemo%2Ftri-state-checkbox-basic-demo.html

Angular version

16, 17

PrimeNG version

16.9.1, 17.0.0, 17.1.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

20.x

Browser(s)

No response

Steps to reproduce the behavior

No response

Expected behavior

No response

[SoyDiego]

Hi @jpgoelz I did a PR solving the problem.
You can check here: #14371
But the click in the checkbox it is working ok, you should add a value. Here you have a example:

But I fixed also the examples in the website because were failing. If you use the attribute label you don't need to use inputId like the examples in the website. You can see more examples in my PR.

Thanks for report it!

[jpgoelz]

Hey, thank you for the fast response!

The issue with clicking was regarding clicking the label: of the tri-state-checkbox:

(StackBlitz)

I guess my "minimal working example" was too minimal. 😅

[SoyDiego]

Hey, thank you for the fast response!

The issue with clicking was regarding clicking the label: of the tri-state-checkbox:

(StackBlitz)

I guess my "minimal working example" was too minimal. 😅

Yeah, don't worry with my PR will fixed the problem, If PrimeNG Team approve it and it's a good solution for them, will be released.
Here you have a example working with your code:

[jpgoelz]

Perfect, thanks!

[jpgoelz]

@cetincakiroglu, this was released in 17.2.0 but does not appear in the Changelog.

[SoyDiego]

@cetincakiroglu, this was released in 17.2.0 but does not appear in the Changelog.

Yes, it does @jpgoelz.

[jpgoelz]

I obviously need glasses. Sorry for wasting your time! 🤦

I only looked at the changelog provided by Renovate, which apparently parses the milestones and not the changelog provided by you guys. My bad!

[SoyDiego]

no problem, happy to help!