@braineet/ui/dist/cjs/utils/index.js

Braineet design system

"use strict";

exports.__esModule = true;
exports.useDebounce = exports.safeInvoke = exports.placing = exports.numberFormat = exports.lighten = exports.light = exports.hashCode = exports.getInitials = exports.fluid = exports.default = exports.darken = exports.dark = exports.currencyFormat = exports.borderRadius = exports.border = void 0;
var _react = require("react");
/**
 * Get the rem value of px
 * @param {string} val - px value
 * @return {string} - rem value
 */
var fluid = exports.fluid = function fluid(val) {
  return val / 16 + "rem";
};

/**
 * Get the borderRadius
 * @param {number} radius - radius value
 * @param {boolean} isPercent - if the value is a percent
 * @return {string} - border-radius css property
 */
var borderRadius = exports.borderRadius = function borderRadius(radius, isPercent) {
  if (isPercent === void 0) {
    isPercent = false;
  }
  return "border-radius: " + (isPercent ? radius + "%" : fluid(radius)) + ";";
};
var placing = exports.placing = function placing(_ref) {
  var direction = _ref.direction;
  var directions = "flex-direction: " + direction + ";";
  return directions;
};

/**
 * Get the lighten color
 * @param {string} h - color hexadecimal
 * @param {number} percent - percent of the opacity
 * @return {string} - rgba color
 */
var lighten = exports.lighten = function lighten(h, percent, colors) {
  var hex = colors && colors[h] || h;
  if (/^#([0-9a-f]{6}|[0-9a-f]{3})$/i.test(hex)) {
    try {
      var r = 0;
      var g = 0;
      var b = 0;
      if (h.length === 4) {
        r = "0x" + hex[1] + hex[1];
        g = "0x" + hex[2] + hex[2];
        b = "0x" + hex[3] + hex[3];
      } else if (hex.length === 7) {
        r = "0x" + hex[1] + hex[2];
        g = "0x" + hex[3] + hex[4];
        b = "0x" + hex[5] + hex[6];
      }
      return "rgba(" + +r + "," + +g + "," + +b + "," + percent + ")";
    } catch (error) {
      console.error(error);
    }
  }
  return '';
};

/**
 * Get the darken color
 * @param {string} h - color hexadecimal
 * @param {number} percent - percent of the opacity
 * @return {string} - hsl color
 */
var darken = exports.darken = function darken(H, percent) {
  var r = 0;
  var g = 0;
  var b = 0;
  if (H.length === 4) {
    r = "0x" + H[1] + H[1];
    g = "0x" + H[2] + H[2];
    b = "0x" + H[3] + H[3];
  } else if (H.length === 7) {
    r = "0x" + H[1] + H[2];
    g = "0x" + H[3] + H[4];
    b = "0x" + H[5] + H[6];
  }
  // Then to HSL
  r /= 255;
  g /= 255;
  b /= 255;
  var cmin = Math.min(r, g, b);
  var cmax = Math.max(r, g, b);
  var delta = cmax - cmin;
  var h = 0;
  var s = 0;
  var l = 0;
  if (delta === 0) h = 0;else if (cmax === r) h = (g - b) / delta % 6;else if (cmax === g) h = (b - r) / delta + 2;else h = (r - g) / delta + 4;
  h = Math.round(h * 60);
  if (h < 0) h += 360;
  l = (cmax + cmin) / 2;
  s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
  s = +(s * 100).toFixed(1);
  l = +(l * 100).toFixed(1);
  return "hsl(" + h + "," + s + "%," + (l - percent) + "%)";
};

/**
 * Get number
 * @param {string} val - id
 * @return {string} - string
 */
var hashCode = exports.hashCode = function hashCode(s) {
  var str = String(s);
  var hash = 0;
  var char;
  if (str.trim().length === 0) return hash;
  for (var i = 0; i < str.length; i += 1) {
    char = str.charCodeAt(i);
    // eslint-disable-next-line no-bitwise
    hash = (hash << 5) - hash + char;
    // Convert to 32bit integer
    // eslint-disable-next-line no-bitwise
    hash &= hash;
  }
  return Math.abs(hash);
};

/**
 * Get First letter of Name
 * @param {string} val - value
 * @return {string} - initials
 */
var getInitials = exports.getInitials = function getInitials(name, fallback, _temp) {
  if (fallback === void 0) {
    fallback = '';
  }
  var _ref2 = _temp === void 0 ? {} : _temp,
    oneLetter = _ref2.oneLetter;
  if (!name || typeof name !== 'string') return fallback;
  return name.replace(/\s+/, ' ').split(' ') // Repeated spaces results in empty strings
  .slice(0, oneLetter ? 1 : 2).map(function (v) {
    return v && v[0].toUpperCase();
  }) // Watch out for empty strings
  .join('');
};
var border = exports.border = function border(shadows) {
  var validShadows = shadows.filter(function (shadow) {
    if (typeof shadow === 'string') {
      return shadow;
    }
    return undefined;
  });
  return validShadows.join(',');
};
var safeInvoke = exports.safeInvoke = function safeInvoke(fn) {
  if (typeof fn === 'function') {
    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
      args[_key - 1] = arguments[_key];
    }
    return fn.apply(void 0, args);
  }
  return undefined;
};
var useDebounce = exports.useDebounce = function useDebounce(value, delay) {
  var _useState = (0, _react.useState)(value),
    debouncedValue = _useState[0],
    setDebouncedValue = _useState[1];
  (0, _react.useEffect)(function () {
    var handler = setTimeout(function () {
      setDebouncedValue(value);
    }, delay);
    return function () {
      clearTimeout(handler);
    };
  }, [value]);
  return debouncedValue;
};
function HSLToHex(h, s, l) {
  // eslint-disable-next-line no-param-reassign
  s /= 100;
  // eslint-disable-next-line no-param-reassign
  l /= 100;
  var c = (1 - Math.abs(2 * l - 1)) * s;
  var x = c * (1 - Math.abs(h / 60 % 2 - 1));
  var m = l - c / 2;
  var r = 0;
  var g = 0;
  var b = 0;
  if (h >= 0 && h < 60) {
    r = c;
    g = x;
    b = 0;
  } else if (h >= 60 && h < 120) {
    r = x;
    g = c;
    b = 0;
  } else if (h >= 120 && h < 180) {
    r = 0;
    g = c;
    b = x;
  } else if (h >= 180 && h < 240) {
    r = 0;
    g = x;
    b = c;
  } else if (h >= 240 && h < 300) {
    r = x;
    g = 0;
    b = c;
  } else if (h >= 300 && h < 360) {
    r = c;
    g = 0;
    b = x;
  }
  // Having obtained RGB, convert channels to hex
  r = Math.round((r + m) * 255).toString(16);
  g = Math.round((g + m) * 255).toString(16);
  b = Math.round((b + m) * 255).toString(16);

  // Prepend 0s, if necessary
  if (r.length === 1) r = "0" + r;
  if (g.length === 1) g = "0" + g;
  if (b.length === 1) b = "0" + b;
  return "#" + r + g + b;
}
function hexToHSL(H) {
  // Convert hex to RGB first
  var r = 0;
  var g = 0;
  var b = 0;
  if (H.length === 4) {
    r = "0x" + H[1] + H[1];
    g = "0x" + H[2] + H[2];
    b = "0x" + H[3] + H[3];
  } else if (H.length === 7) {
    r = "0x" + H[1] + H[2];
    g = "0x" + H[3] + H[4];
    b = "0x" + H[5] + H[6];
  }
  // Then to HSL
  r /= 255;
  g /= 255;
  b /= 255;
  var cmin = Math.min(r, g, b);
  var cmax = Math.max(r, g, b);
  var delta = cmax - cmin;
  var h = 0;
  var s = 0;
  var l = 0;
  if (delta === 0) h = 0;else if (cmax === r) h = (g - b) / delta % 6;else if (cmax === g) h = (b - r) / delta + 2;else h = (r - g) / delta + 4;
  h = Math.round(h * 60);
  if (h < 0) h += 360;
  l = (cmax + cmin) / 2;
  s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
  s = +(s * 100).toFixed(1);
  l = +(l * 100).toFixed(1);
  return {
    h: h,
    s: s,
    l: l
  };
}
var light = exports.light = function light(color, val) {
  var hsl = hexToHSL(color);
  var hslLighten = HSLToHex(hsl.h, hsl.s, hsl.l + val);
  return hslLighten;
};
var dark = exports.dark = function dark(color, val) {
  var hsl = hexToHSL(color);
  var hslLighten = HSLToHex(hsl.h, hsl.s, hsl.l - val);
  return hslLighten;
};
var numberFormat = exports.numberFormat = function numberFormat(value, locale, minimumFractionDigits) {
  return new Intl.NumberFormat(locale, {
    minimumFractionDigits: minimumFractionDigits
  }).format(value);
};
var currencyFormat = exports.currencyFormat = function currencyFormat(value, currency, locale, minimumFractionDigits) {
  return new Intl.NumberFormat(locale, {
    style: 'currency',
    currency: currency,
    minimumFractionDigits: minimumFractionDigits
  }).format(value);
};
var _default = exports.default = {
  borderRadius: borderRadius,
  fluid: fluid,
  lighten: lighten,
  darken: darken,
  hashCode: hashCode,
  getInitials: getInitials,
  border: border,
  safeInvoke: safeInvoke,
  light: light,
  dark: dark,
  numberFormat: numberFormat,
  currencyFormat: currencyFormat
};