Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor components with modifiers #65

Open
luca-rath opened this issue Nov 3, 2021 · 2 comments
Open

Refactor components with modifiers #65

luca-rath opened this issue Nov 3, 2021 · 2 comments
Milestone

Comments

@luca-rath
Copy link
Contributor

luca-rath commented Nov 3, 2021

Components which toggle modifier classes on some elements should be refactored to make them also work, if the element doesn't have a class. The following code snippet does exactly that. Maybe this can be extracted into a utils.js file

appendModifier = (className: string | undefined, modifier: string): string => {
    if (!className) {
        return modifier;
    }

    return className + '--' + modifier;
};

getFirstClass = (element: HTMLElement): string | undefined => {
    return element.classList[0];
};

It can the be used like this

const containerOpenClass = this.appendModifier(this.getFirstClass(this.container), 'open');
this.container.classList.toggle(containerOpenClass);
@alexander-schranz
Copy link
Member

Would keep the behaviour with --open, but maybe remove the modifier options with a way to set the whole appendClass but at current state I would stay with the implementation we did and can be rediscussed when refractoring the core in 3.0.

@alexander-schranz alexander-schranz added this to the 3.0.0 milestone Nov 3, 2021
@luca-rath
Copy link
Contributor Author

Yes, sounds good

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants