Project: syntax-tree/hast-util-classnames

Package: hast-util-classnames@2.0.0

  1. Dependencies: 2·Dependents: 2
  2. hast utility to merge class names together
  1. util 136
  2. utility 132
  3. unist 119
  4. html 111
  5. hast 61
  6. hast-util 40


Build Coverage Downloads Size Sponsors Backers Chat

hast utility to merge class names together.


This package is ESM only: Node 12+ is needed to use it and it must be imported instead of required.


npm install hast-util-classnames


import {h} from 'hastscript'
import {classnames} from 'hast-util-classnames'

console.log(classnames('alpha bravo', {bravo: false}, [123, 'charlie']))

var node = h('p.alpha', 'Hi!')
console.log(classnames(node, 'bravo', ['charlie', {delta: false, echo: 1}]))


['123', 'alpha', 'charlie']
  type: 'element',
  tagName: 'p',
  properties: {className: ['alpha', 'bravo', 'charlie', 'echo']},
  children: [{type: 'text', value: 'Hi!'}]


This package exports the following identifiers: classnames. There is no default export.

classnames(node, …conditionals)

Utility to merge classes.

If the first argument is a node it should be an element. All conditionals are merged with the current class names and with each other, and then set on the element. Finally, node is returned.


If the first argument is not a node, all conditionals are merged with each other, and then the resulting array is returned.


A value that is either:


Classes are typically not harmful, however, if someone were able to inject classes, it could mean that user-provided content looks like official content, which may cause security problems due to impersonation. Either do not use user input in classnames or use hast-util-sanitize to clean the tree.


See contributing.md in syntax-tree/.github for ways to get started. See support.md for ways to get help.

This project has a code of conduct. By interacting with this repository, organization, or community you agree to abide by its terms.


MIT © Titus Wormer