togglehexrgb/dist/main.umd.js

toggles hex formatted string to rgb and rgb to hex, automatically detects input format

(function (global, factory) {
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
  typeof define === 'function' && define.amd ? define(factory) :
  (global = global || self, global.toggleHexRgb = factory());
}(this, (function () { 'use strict';

  /**
   * @function toggleHexRgb
   * @param {string} color - HEX or RGB color to convert to the opposite format
   * @returns {string} The converted color format, HEX or RGB, string
   * @description Converts HEX string format to RGB, and RGB to HEX. It first determines the current format, then converts to the opposite.
   * @author Todd Matheson <tmatheson11186@gmail.com>
   * @example <caption>RGB to HEX:</caption>
   * // returns `#7B7BFF`
   * toggleHexRgb('rgb (123, 12, 158)')
   * @example <caption>HEX to RGB:</caption>
   * // returns `rgb (18, 52, 86)`
   * toggleHexRgb('#123456')
   */
  var toggleHexRgb = function toggleHexRgb(color) {
    if (typeof color !== 'string') return undefined; // helper method, sanitizes hex values

    var componentToHex = function componentToHex(c) {
      var hex = c.toString(16);
      return hex.length == 1 ? '0' + hex : hex;
    }; // helper method to convert rgb to hex


    var rgbToHex = function rgbToHex(r, g, b) {
      return "#".concat(componentToHex(r)).concat(componentToHex(g)).concat(componentToHex(b));
    }; // check if our input is a HEX pattern string


    if (color.match(/^[#]([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})\;?$|^([\d]{6}\;?)$/gim)) {
      var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/gi.exec(color);

      if (result !== undefined && result.length >= 1) {
        return "rgb (".concat(parseInt(result[1], 16), ", ").concat(parseInt(result[2], 16), ", ").concat(parseInt(result[3], 16), ")");
      }
    } else if (color.match(/^rgb\s?\(([0-9]{1}[0-9]?[0-9]?)(,\s?)([0-9]{1}[0-9]?[0-9]?)(,\s?)([0-9]{1}[0-9]?[0-9]?)\)\;?$/gm)) {
      var _result = /^rgb\s?\(([0-9]{1}[0-9]?[0-9]?),?\s?([0-9]{1}[0-9]?[0-9]?),?\s?([0-9]{1}[0-9]?[0-9]?)\)\;?$/gi.exec(color);

      if (_result !== undefined && _result.length >= 1) {
        // check that none of our rgb values are greater then 255, if so make it equal 255
        for (var i = 1; i <= 4; i++) {
          if (_result[i] > 255) _result[i] = 255;
        }

        return rgbToHex(parseInt(_result[1]), parseInt(_result[2]), parseInt(_result[3])).toUpperCase();
      }
    } // if the string is neither HEX nor RGB, return undefined


    return undefined;
  };

  return toggleHexRgb;

})));