style-mixin.js

style-mixin.js

export const Display = {
    None: { display: 'none' },
    Block: { display: 'block' },
    Inline: { display: 'inline' },
    InlineBlock: { display: 'inline-block' },
    NoneIf(cond) {
        return cond ? Display.None : null;
    },
    BlockIf(cond) {
        return cond ? Display.Block : null;
    },
    InlineIf(cond) {
        return cond ? Display.Inline : null;
    },
    InlineBlockIf(cond) {
        return cond ? Display.InlineBlock : null;
    }
};

// <div style={Display.InlineIf(conditionMet)}> ...