_userClass is private so the host component cannot possess the `class` property

[wizardnet972]

@goetzrobin, firstly, thank you for the project; it appears to hold significant potential. I aim to incorporate it into all of my clients' projects.

---

I'd like to point out that when you mark _userClass as private, the host component cannot possess the class property.

It raises an error: Property '_userClass' is private and can only be accessed within the 'HlmAccordionDirective' class.

<div class="bla" hlmAccordion>

HlmAccordionDirective

@Directive({
    selector: '[hlmAccordion], hlm-accordion',
    standalone: true,
    host: {
        '[class]': '_computedClass()',
    },
    hostDirectives: [{ directive: BrnAccordionDirective, inputs: ['type', 'dir', 'orientation'] }],
})
export class HlmAccordionDirective {
    private readonly _brn = inject(BrnAccordionDirective);

    private readonly _userClass = input<ClassValue>('', { alias: 'class' });
    protected readonly _computedClass = computed(() =>
        hlm('flex', this._brn.orientation === 'horizontal' ? 'flex-row' : 'flex-col', this._userClass()),
    );
}

Even though the component is entirely in the hands of the programmer and can be changed by them, I think that the template the programmer receives should have easy capability to add class.

Personal note: If you intend to use a private variable, it's preferable to use the #privateVar syntax instead of prefixing it with _.

I would be willing to submit a PR to fix this issue

• [X] Yes
• [ ] No