Newly Practicing Mortician

    @dr/bem-helper

    2.0.0-alpha-4 • Public • Published

    bem-helper

    Helper functions to create BEM-style classnames

    Install

    
    npm install @dr/bem-helper
    
    

    Usage

    import bem from "@dr/bem-helper";
    
    var className = bem("block", "element", { modifier: true });
    // className = "block__element block__element--modifier"

    API

    bem

    A function that creates all applicable combinations of classnames for an element scoped to a block in BEM-style format.

    Arguments

    • block (string) - The block element for the classname.
    • ...args (string|object) - Optional. Any number of the following arguments are allowed:
      • element (string) - Optional.
      • modifier (object) - Optional. Keys are used for modifier names. Values determine whether to turn the modifier off (false, "", null or undefined) or on - either through true or a value which will be appended to the modifier name; {modifier: true} -> "--modifier", {modifier: "value"} -> "--modifier-value". Should not follow a previous modifier argument.

    Examples

    Basic
    var className = bem("block", "element");
    // className === "block__element"
    Elements with modifiers
    var className = bem("block", { modifier: true });
    // className === "block block--modifier"
    Modifiers with values
    var className = bem("block", "element", { modifier: "value", modifier2: false });
    // className === "block__element block__element--modifier-value"
    Prebinding helpers
    var boundBem = bem.bind(null, "block");
    
    var className = boundBem("element", { modifier: true });
    // className === "block__element block__element--modifier"

    bemStyles

    Install

    npm i @dr/bem-helper

    DownloadsWeekly Downloads

    180

    Version

    2.0.0-alpha-4

    License

    ISC

    Unpacked Size

    7.26 kB

    Total Files

    6

    Last publish

    Collaborators

    • jenslykkebrandt
    • aebadr
    • drexjakobskov
    • danniolsen2
    • mikkel_dr
    • kianandersson
    • wispheren
    • faldt
    • runi
    • drexkrha
    • drwebomraadet
    • jase
    • ojoo
    • fritzstoltze
    • graulund
    • pawa
    • pefr
    • sids
    • drexlofl
    • drupal-drdk-build
    • joth
    • jorgeneske
    • drdkazure
    • drdkbld
    • core-dr-dk
    • teamplay-npm
    • mkkr
    • drdknetgroup
    • drexsrau
    • mil0209
    • clausbruun
    • taabdr
    • mzdk
    • drdk-knan
    • nele
    • jper
    • langeland
    • ldla
    • jtheyday
    • drntmediasmiths
    • mibm
    • casper.glumsoe
    • csolsen
    • bobend
    • chap-dr
    • phloe
    • themitvp
    • rasmusthirslund
    • kaaresylow
    • semadrdk
    • nael
    • pebo
    • jonashalgren
    • emrahsifoglu
    • i.delova
    • jpacdrdk
    • dr-crsa
    • ilko_enetpulse
    • illia_shevchenko
    • elsassph