sass-css-modules-class-mapper v1.0.17

Sass CSS Class Mapper

import React, {Component} from "react";
import Mapper from 'sass-css-modules-class-mapper';

import styles from './icon.module.css';

class Icon extends Component {

  constructor(props) {
    super(props);
    this.variant = Mapper.map(styles, {classes: props.variant});
  }

  render() {
    return (<span>
      <i className={this.variant}></i>
    </span>)
  }
}

export default Icon;

import React, {Component} from "react";
import Mapper from 'sass-css-modules-class-mapper';

import styles from './icon.module.css';

class Icon extends Component {

  constructor(props) {
    super(props);
    this.variant = Mapper.map(styles, {defaults: "rounded-icon"});
  }

  render() {
    return (<span>
      <i className={this.variant}></i>
    </span>)
  }
}

export default Icon;

.red {
  color: red;
}

import React, {Component} from 'react';

import Icon from '../icon';

class App extends Component {

  render() {
    return (
      <div><Icon variant="red fas fa-home"/></div>
    )
  }
}

export default App;

<i class="icon_red__m8-68 fas fa-home"></i>

import React, {Component} from 'react';

import Icon from '../icon';

class App extends Component {

  render() {
    return (
      <div><Icon/></div>
    )
  }
}

export default App;