react-suitcssify/dist/lib/utility.js

A React component utility to generate CSS class names that conform to SUIT CSS naming conventions.

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.getBaseComponentName = getBaseComponentName;
exports.getClassName = getClassName;
var CAMELIZE_REGEX_UPPER_CASE = /[\-_/\.\s]+(.)?/g;
var CAMELIZE_REGEX_LOWER_CASE = /^(.)/;

function capitalize(string) {
  return string.charAt(0).toUpperCase() + string.slice(1);
}

function camelize(string) {
  return string.replace(CAMELIZE_REGEX_UPPER_CASE, function (match, chr) {
    return chr.toUpperCase();
  }).replace(CAMELIZE_REGEX_LOWER_CASE, function (match, chr) {
    return chr.toLowerCase();
  });
}

function getBaseComponentName(componentName, namespace) {
  var sanitizedComponentName = capitalize(camelize(componentName));
  return namespace ? namespace + '-' + sanitizedComponentName : sanitizedComponentName;
};

function getConfiguredClassName(_ref) {
  var namespace = _ref.namespace,
      componentName = _ref.componentName,
      descendantName = _ref.descendantName,
      baseComponentName = _ref.baseComponentName;

  var baseClassName = baseComponentName;
  if (componentName || namespace) {
    baseClassName = getBaseComponentName(componentName, namespace);
  }
  return descendantName ? baseClassName + '-' + camelize(descendantName) : baseClassName;
}

function format(values, prefix) {
  return values && values.split(' ').map(function (value) {
    return '' + prefix + camelize(value);
  }).join(' ');
}

function getClassName() {
  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

  // Allow utilities and className to be set on descendants when using utility function or passed in directly.
  // Do not automatically inherit utilities or className from top level component onto descendants when using mixin or decorator.

  var baseClassName = getConfiguredClassName(options);

  var classNames = [baseClassName].concat(format(options.modifiers, baseClassName + '--'), format(options.states, 'is-'), format(options.utilities, 'u-'), options.className).filter(function (value) {
    return !!value;
  }).join(' ');

  return classNames;
}
//# sourceMappingURL=utility.js.map