@prague-digi/class-names

    0.1.5 • Public • Published

    @prague-digi/class-names

    Improved classnames library implementation, which allows an array of CSS modules and/or additional class names to be bound and handles spaces in them correctly. The rightmost CSS modules have priority over ones to the left.

    Usage

    This library can be used the same way as Jed Watson's classnames library.

    Additionally, one may bind a (possibly heterogenous) array of CSS modules and additional class names. If you pass a class name with a space, it is handled correctly (each word is parsed separately).

    import classNames from '@prague-digi/class-names'
    import styles from '@prague-digi/ui-styles' // contains classes: foo, bar
    
    import theme from './theme.css' // contains classes: bar, custom
    
    const cx = classNames.bind([styles, theme, 'custom'])
    
    cx('bar baz', { foo: true, bar: null }) // 'theme_bar baz styles_foo theme_custom'
    
    // Explanation:
    // 'bar' is found in theme.css and resolves to 'theme_bar' (priority over ui-styles)
    // 'baz' is not present in any CSS module, so it is returned as is
    // 'foo' is found in @prague-digi/ui-styles and resolves to 'styles_foo'
    // 'custom' is applied additionally and resolves to 'theme_custom' in theme.css

    Keywords

    none

    Install

    npm i @prague-digi/class-names

    DownloadsWeekly Downloads

    27

    Version

    0.1.5

    License

    MIT

    Unpacked Size

    21.3 kB

    Total Files

    21

    Last publish

    Collaborators

    • machy
    • roman.hala
    • kakin
    • josefzamrzla