Automatically generate CSS class names and modifiers based on your component's state.
Explore the docs »
Report Bug
·
Request Feature
Use the useClassState
hook to generate CSS class names and modifiers based on the passed in state:
const [ isActive, setActive ] = useState(true)
const classState = {
'Button': {
'--active': isActive,
'--disabled': props.disabled, // false
'--color_{value}': props.color // red
}
}
const className = useClassState(classState)
React.js TypeScript Vite TypeDoc
npm i @twocatmoon/react-use-class-state
import { useClassState } from '@twocatmoon/react-use-class-state'
Please refer to the Documentation
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!
git checkout -b feature/AmazingFeature
)git commit -m 'Add some AmazingFeature'
)git push origin feature/AmazingFeature
)Distributed under the MIT License. See LICENSE
for more information.
Twitter - @twocatmoon
Project Link - https://github.com/twocatmoon/react-use-class-state
Generated using TypeDoc