@janiscommerce/ui-web 0.12.0 → 0.14.0

package/CHANGELOG.md

@@ -7,6 +7,22 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+## [0.14.0] - 2024-04-22
+
+### Added
+
+- New colors in theme
+
+## [0.13.0] - 2024-03-09
+
+### Removed
+
+- util to get color in InitialAvatar
+
+### Changed
+
+- MainColor prop, now accept hex color
+
 ## [0.12.0] - 2024-03-08
 
 ### Added

package/dist/index.umd.js

@@ -552,9 +552,9 @@
     blackHover: '#585858',
     blackPressed: '#16232D',
     blue: '#2979FF',
+    blueDisabled: '#93BBFF',
     blueHover: '#5393FF',
     bluePressed: '#1759FF',
-    blueDisabled: '#93BBFF',
     darkGrey: '#939598',
     darkGreyHover: '#A8AAAC',
     darkGreyPressed: '#747679',
@@ -579,14 +579,18 @@
     red: '#F13B70',
     redHover: '#F3628C',
     redPressed: '#EB2450',
+    skyBlue: '#02BFFB',
+    skyBluePressed: '#00A6FA',
     statusRed: '#FF4343',
     statusRedHover: '#FF6868',
     statusRedPressed: '#FF2A2A',
+    transparentWhite: 'rgba(256, 256, 256, 0.5)',
+    violet: '#BB98F1',
+    violetPressed: '#8848E7',
     white: '#FFF',
     yellow: '#FFCE17',
     yellowHover: '#FFD745',
-    yellowPressed: '#FFBA0C',
-    transparentWhite: 'rgba(256, 256, 256, 0.5)'
+    yellowPressed: '#FFBA0C'
   };
 
   /**
@@ -672,7 +676,8 @@
 
   Skeleton.defaultProps = {
     circle: false,
-    count: 1
+    count: 1,
+    width: '100%'
   };
 
   var styled$d = {
@@ -694,76 +699,6 @@
     })
   };
 
-  /**
-   * Checks if the name provided is single or compound and returns either the first two letters,
-   * or the initials of the two first names.
-   * @param {string} nameString
-   */
-
-  var parseName = function parseName(nameString) {
-    var names = nameString.split(' ');
-    return names.length > 1 ? names.reduce(function (accum, name, idx) {
-      if (idx <= 1) return [].concat(_toConsumableArray(accum), [name.substring(0, 1)]);
-      return accum;
-    }, []) : nameString.substring(0, 2).split('');
-  };
-  /**
-   * If both firstname and lastname are provided, returns an array with each of their initials.
-   * If only a firstname or a lastname is provided, parses them to return either
-   * their initials (if it's a compound name) or first two letters.
-   * @param {string} firstname
-   * @param {string} lastname
-   */
-
-
-  var getNamesToParse = function getNamesToParse(firstname, lastname) {
-    return !!firstname || !!lastname ? parseName(firstname || lastname) : null;
-  };
-  /**
-   * Assigns a color to the names or initials array provided.
-   * @param {array} name - Array containing the firstname and lastname strings
-   */
-
-
-  var getUserColor = function getUserColor(name) {
-    var excludedColors = ['lightGreyHover', 'lightGrey', 'white', 'transparentWhite'];
-    var availableColors = Object.keys(viewsPalette).filter(function (color) {
-      return !excludedColors.includes(color);
-    });
-    var availableIndexes = availableColors.length;
-
-    var charCodes = _toConsumableArray(name).map(function (letter) {
-      return letter.charCodeAt(0);
-    });
-
-    var charCodesLength = charCodes.length;
-    var rotationFactor = charCodesLength % (availableIndexes - 1) + 1;
-    var sumOfCharacterCodes = charCodes.reduce(function (current, next) {
-      return current + next;
-    }) % availableIndexes;
-    var random = charCodes[0] % availableIndexes;
-
-    for (var i = 0; i < charCodesLength; i++) {
-      random = (rotationFactor * random + sumOfCharacterCodes) % availableIndexes;
-    }
-
-    var userColor = availableColors[random];
-    return viewsPalette[userColor];
-  };
-  /**
-   * If firstname or lastname (or both) are defined, will return an object with their initials and assigned color.
-   * If not, returns null.
-   * @param {string} firstname
-   * @param {string} lastname
-   */
-
-  var getInitialsTheme = function getInitialsTheme() {
-    var firstname = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-    var lastname = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
-    if (!!firstname && !!lastname) return [firstname.substring(0, 1), lastname.substring(0, 1)];
-    return getNamesToParse(firstname, lastname);
-  };
-
   var timingFunctions = {
     standard: 'cubic-bezier(0.4, 0, 0.2, 1)',
     decelerate: 'cubic-bezier(0.0, 0.0, 0.2, 1)',
@@ -812,12 +747,51 @@
         imageSize = _ref.imageSize,
         rounded = _ref.rounded;
     return /*#__PURE__*/React__default["default"].createElement(styled$c.Initials, {
-      color: mainColor || getUserColor(initials),
+      color: mainColor,
       size: imageSize,
       rounded: rounded
     }, initials);
   };
 
+  /**
+   * Checks if the name provided is single or compound and returns either the first two letters,
+   * or the initials of the two first names.
+   * @param {string} nameString
+   */
+  var parseName = function parseName(nameString) {
+    var names = nameString.split(' ');
+    return names.length > 1 ? names.reduce(function (accum, name, idx) {
+      if (idx <= 1) return [].concat(_toConsumableArray(accum), [name.substring(0, 1)]);
+      return accum;
+    }, []) : nameString.substring(0, 2).split('');
+  };
+  /**
+   * If both firstname and lastname are provided, returns an array with each of their initials.
+   * If only a firstname or a lastname is provided, parses them to return either
+   * their initials (if it's a compound name) or first two letters.
+   * @param {string} firstname
+   * @param {string} lastname
+   */
+
+
+  var getNamesToParse = function getNamesToParse(firstname, lastname) {
+    return !!firstname || !!lastname ? parseName(firstname || lastname) : null;
+  };
+  /**
+   * If firstname or lastname (or both) are defined, will return an object with their initials and assigned color.
+   * If not, returns null.
+   * @param {string} firstname
+   * @param {string} lastname
+   */
+
+
+  var getInitialsTheme = function getInitialsTheme() {
+    var firstname = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+    var lastname = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+    if (!!firstname && !!lastname) return [firstname.substring(0, 1), lastname.substring(0, 1)];
+    return getNamesToParse(firstname, lastname);
+  };
+
   var Avatar = function Avatar(_ref) {
     var firstname = _ref.firstname,
         lastname = _ref.lastname,
@@ -882,7 +856,8 @@
     lastname: '',
     size: 'small',
     url: '',
-    rounded: true
+    rounded: true,
+    mainColor: viewsPalette.grey
   };
 
   var API_key = {