@codacy/ui-components 0.64.16 → 0.64.18

package/lib/system-props/index.js

@@ -1,2 +1,27 @@
-export * from './color';
-export * from './types';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _color = require("./color");
+Object.keys(_color).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _color[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _color[key];
+    }
+  });
+});
+var _types = require("./types");
+Object.keys(_types).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _types[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _types[key];
+    }
+  });
+});

package/lib/system-props/types.js

@@ -1 +1,5 @@
-export {};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/theme/ColorSchemes/codacy.js

@@ -1,5 +1,12 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-export var baseColors = {
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.functionalColorsFx = exports.codacyThemeColors = exports.baseColors = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var baseColors = exports.baseColors = {
   // BLUE
   'blue-900': '#0052CC',
   'blue-800': '#2562EA',
@@ -72,7 +79,7 @@ export var baseColors = {
   'orange-100': '#FFA101',
   'orange-50': '#FFF2DF'
 };
-export var functionalColorsFx = function functionalColorsFx(colors) {
+var functionalColorsFx = exports.functionalColorsFx = function functionalColorsFx(colors) {
   return {
     'brand-primary': colors['blue-700'],
     'accent-primary': colors['blue-700'],
@@ -145,4 +152,4 @@ export var functionalColorsFx = function functionalColorsFx(colors) {
   };
 };
 var functionalColors = functionalColorsFx(baseColors);
-export var codacyThemeColors = _objectSpread(_objectSpread({}, baseColors), functionalColors);
+var codacyThemeColors = exports.codacyThemeColors = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, baseColors), functionalColors);

package/lib/theme/ColorSchemes/pulse.js

@@ -1,10 +1,16 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import { baseColors as codacyBaseColors, functionalColorsFx } from './codacy';
+"use strict";
 
-var baseColors = _objectSpread({}, codacyBaseColors);
-
-var functionalColors = _objectSpread(_objectSpread({}, functionalColorsFx(baseColors)), {}, {
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.pulseThemeColors = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _codacy = require("./codacy");
+var baseColors = (0, _objectSpread2["default"])({}, _codacy.baseColors);
+var functionalColors = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, (0, _codacy.functionalColorsFx)(baseColors)), {}, {
   // UPDATE HERE FUNCTIONAL COLORS
+
   'brand-primary': baseColors['turquoise-500'],
   'accent-primary': baseColors['turquoise-400'],
   'accent-primary-hover': baseColors['turquoise-500'],
@@ -16,6 +22,7 @@ var functionalColors = _objectSpread(_objectSpread({}, functionalColorsFx(baseCo
   // 'accent-subtle-focus': baseColors['black-400'],
   // 'accent-subtle-active': baseColors['black-500'],
   // 'accent-subtle-disabled': baseColors['black-100'],
+
   'accent-info': baseColors['turquoise-400'],
   // 'text-primary': baseColors['black-700'],
   // 'text-secondary': baseColors['black-400'],
@@ -27,6 +34,7 @@ var functionalColors = _objectSpread(_objectSpread({}, functionalColorsFx(baseCo
   // 'text-warning': baseColors['orange-200'],
   // 'text-danger': baseColors['red-400'],
   // 'text-attention': baseColors['purple-600'],
+
   // 'background-primary': baseColors['white'],
   // 'background-secondary': baseColors['black-50'],
   'background-info': baseColors['turquoise-80'],
@@ -35,6 +43,7 @@ var functionalColors = _objectSpread(_objectSpread({}, functionalColorsFx(baseCo
   // 'background-danger': baseColors['red-50'],
   // 'background-attention': baseColors['purple-100'],
   // 'background-neutral': baseColors['black-80'],
+
   'control-border': baseColors['black-200'],
   //'control-background': baseColors['white'],
   'control-active-background': baseColors['white'],
@@ -45,10 +54,9 @@ var functionalColors = _objectSpread(_objectSpread({}, functionalColorsFx(baseCo
   'ui-navbar': baseColors['turquoise-80'],
   'ui-navbar-text': baseColors['black-500'],
   'icon-primary': baseColors['black-300'],
-  'icon-info': baseColors['turquoise-400'] // 'icon-success': baseColors['green-200'],
+  'icon-info': baseColors['turquoise-400']
+  // 'icon-success': baseColors['green-200'],
   // 'icon-warning': baseColors['orange-100'],
   // 'icon-danger': baseColors['red-200'],
-
 });
-
-export var pulseThemeColors = _objectSpread(_objectSpread({}, baseColors), functionalColors);
+var pulseThemeColors = exports.pulseThemeColors = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, baseColors), functionalColors);

package/lib/theme/index.js

@@ -1,3 +1,38 @@
-export * from './ColorSchemes/codacy';
-export * from './ColorSchemes/pulse';
-export * from './theme';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _codacy = require("./ColorSchemes/codacy");
+Object.keys(_codacy).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _codacy[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _codacy[key];
+    }
+  });
+});
+var _pulse = require("./ColorSchemes/pulse");
+Object.keys(_pulse).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _pulse[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _pulse[key];
+    }
+  });
+});
+var _theme = require("./theme");
+Object.keys(_theme).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _theme[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _theme[key];
+    }
+  });
+});

package/lib/theme/theme.js

@@ -1,6 +1,14 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import { codacyThemeColors, pulseThemeColors } from './';
-import { rgba } from 'polished'; // Types
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.transition = exports.theme = exports.pulseTheme = exports.generateTheme = exports.codacyTheme = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _ = require("./");
+var _polished = require("polished");
+// Types
 
 // *** Theme Standard Values ***********************
 var fontStack = function fontStack(fonts) {
@@ -8,108 +16,71 @@ var fontStack = function fontStack(fonts) {
     return font.includes(' ') ? "\"".concat(font, "\"") : font;
   }).join(', ');
 };
-
 var remScale = 16;
-var gridSize = 0.5;
-/* rem */
-
+var gridSize = 0.5; /* rem */
 var borderWidths = ['1px', '0.125rem', '0.25rem'];
 var fonts = {
   normal: fontStack(['Clear Sans', 'arial', 'system-ui', 'sans-serif']),
   display: fontStack(['Clear Sans', 'arial', 'system-ui', 'sans-serif']),
   monospace: fontStack(['ui-monospace', 'monospace'])
 };
-var fontSizes = [
-/** fontSize-00 */
-'0.625rem', // 10px
-
+var fontSizes = [/** fontSize-00 */'0.625rem',
+// 10px
 /** fontSize-01 */
-'0.75rem', // 12px
-
+'0.75rem',
+// 12px
 /** fontSize-02 */
-'0.875rem', // 14px
-
+'0.875rem',
+// 14px
 /** fontSize-03 */
-'1rem', // 16px
-
+'1rem',
+// 16px
 /** fontSize-04 */
-'1.125rem', // 18px
-
+'1.125rem',
+// 18px
 /** fontSize-05 */
-'1.3125rem', // 21px
-
+'1.3125rem',
+// 21px
 /** fontSize-06 */
-'1.65rem', // 26.4px
-
+'1.65rem',
+// 26.4px
 /** fontSize-07 */
 '2.25rem' // 36px
 ];
-var space = [
-/** space-00 */
-'0',
-/** space-01 */
-"".concat(gridSize * 0.5, "rem"), // 4px
-
+var space = [/** space-00 */'0', /** space-01 */"".concat(gridSize * 0.5, "rem"), // 4px
 /** space-02 */
 "".concat(gridSize, "rem"), // 8px
-
 /** space-03 */
 "".concat(gridSize * 1.5, "rem"), // 12px
-
 /** space-04 */
 "".concat(gridSize * 2, "rem"), // 16px
-
 /** space-05 */
 "".concat(gridSize * 3, "rem"), // 24px
-
 /** space-06 */
 "".concat(gridSize * 4, "rem"), // 32px
-
 /** space-07 */
 "".concat(gridSize * 5, "rem"), // 40px
-
 /** space-08 */
 "".concat(gridSize * 6, "rem"), // 48px
-
 /** space-09 */
 "".concat(gridSize * 8, "rem") // 64px
 ];
-var sizes = [
-/** size-00 */
-"".concat(gridSize * 9, "rem"), // 72px
-
+var sizes = [/** size-00 */"".concat(gridSize * 9, "rem"), // 72px
 /** size-01 */
 "".concat(gridSize * 19, "rem"), // 152px
-
 /** size-02 */
 "".concat(gridSize * 31, "rem"), // 248px
-
 /** size-03 */
 "".concat(gridSize * 44.5, "rem"), // 356px
-
 /** size-04 */
 "".concat(gridSize * 56.5, "rem") // 452px
 ];
-var radii = ['0.125rem'
-/* 2px */
-, '0.25rem'
-/* 4px */
-, '0.5rem'
-/* 8px */
-];
-
+var radii = ['0.125rem' /* 2px */, '0.25rem' /* 4px */, '0.5rem' /* 8px */];
 var shadowsFx = function shadowsFx(scheme) {
-  return ["0 0.0625rem 0.125rem ".concat(rgba(scheme['neutral-600'], 0.2)), "0 0.125rem 0.375rem ".concat(rgba(scheme['neutral-600'], 0.3)), "0 0.125rem 0.375rem ".concat(rgba(scheme['neutral-600'], 0.2), ", 0 0.125rem 0.5rem ").concat(rgba(scheme['neutral-600'], 0.1)), "0 0.25rem 0.5rem ".concat(rgba(scheme['neutral-600'], 0.2), ", 0 0.25rem 0.75rem ").concat(rgba(scheme['neutral-600'], 0.1)), "0 0.75rem 1rem ".concat(rgba(scheme['neutral-600'], 0.2), ", 0 0.75rem 1.5rem ").concat(rgba(scheme['neutral-600'], 0.1))];
+  return ["0 0.0625rem 0.125rem ".concat((0, _polished.rgba)(scheme['neutral-600'], 0.2)), "0 0.125rem 0.375rem ".concat((0, _polished.rgba)(scheme['neutral-600'], 0.3)), "0 0.125rem 0.375rem ".concat((0, _polished.rgba)(scheme['neutral-600'], 0.2), ", 0 0.125rem 0.5rem ").concat((0, _polished.rgba)(scheme['neutral-600'], 0.1)), "0 0.25rem 0.5rem ".concat((0, _polished.rgba)(scheme['neutral-600'], 0.2), ", 0 0.25rem 0.75rem ").concat((0, _polished.rgba)(scheme['neutral-600'], 0.1)), "0 0.75rem 1rem ".concat((0, _polished.rgba)(scheme['neutral-600'], 0.2), ", 0 0.75rem 1.5rem ").concat((0, _polished.rgba)(scheme['neutral-600'], 0.1))];
 };
-
 var transitions = ['0.2s ease-in-out', '0.35s ease-in-out', '0.75s ease-in-out'];
-var breakpoints = ['85.1rem'
-/* > 1360px */
-, '90.1rem'
-/* > 1440px */
-, '105.1rem'
-/* > 1680px */
-];
+var breakpoints = ['85.1rem' /* > 1360px */, '90.1rem' /* > 1440px */, '105.1rem' /* > 1680px */];
 var zIndices = {
   inactive: -1,
   body: 1000,
@@ -159,26 +130,28 @@ var baseTheme = {
   baseLineHeight: lineHeights[0],
   borderSize: borderWidths,
   borderRadius: radii
-}; // Helper functions
+};
 
-export var transition = function transition(properties, speed) {
+// Helper functions
+var transition = exports.transition = function transition(properties, speed) {
   var refTheme = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : baseTheme;
   return properties.map(function (p) {
     return "".concat(p, " ").concat(refTheme.transitions[speed || 'normal']);
   }).join(', ');
 };
-export var generateTheme = function generateTheme(scheme) {
-  return _objectSpread(_objectSpread({}, baseTheme), {}, {
+var generateTheme = exports.generateTheme = function generateTheme(scheme) {
+  return (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, baseTheme), {}, {
     colors: scheme,
     borders: borderWidths.map(function (w) {
       return "solid ".concat(w, " ").concat(scheme['ui-border']);
     }),
     shadows: shadowsFx(scheme)
   });
-}; // Themes
+};
 
-export var codacyTheme = generateTheme(codacyThemeColors);
-export var pulseTheme = generateTheme(pulseThemeColors);
-/** @deprecated Use codacyTheme instead */
+// Themes
+var codacyTheme = exports.codacyTheme = generateTheme(_.codacyThemeColors);
+var pulseTheme = exports.pulseTheme = generateTheme(_.pulseThemeColors);
 
-export var theme = codacyTheme;
+/** @deprecated Use codacyTheme instead */
+var theme = exports.theme = codacyTheme;

package/lib/types.js

@@ -1 +1,5 @@
-export {};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/utils/hash.js

@@ -1,9 +1,11 @@
-export var hash = function hash(s) {
-  var h = 9;
-
-  for (var i = 0; i < s.length;) {
-    h = Math.imul(h ^ s.charCodeAt(i++), Math.pow(9, 9));
-  }
+"use strict";
 
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.hash = void 0;
+var hash = exports.hash = function hash(s) {
+  var h = 9;
+  for (var i = 0; i < s.length;) h = Math.imul(h ^ s.charCodeAt(i++), Math.pow(9, 9));
   return h ^ h >>> 9;
 };

package/lib/utils/reactNodeToText.js

@@ -1,38 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.reactNodeToText = void 0;
+var _react = require("react");
 // From https://github.com/fernandopasik/react-children-utilities
-import { Children, isValidElement } from 'react';
 
 var hasChildren = function hasChildren(element) {
-  return isValidElement(element) && Boolean(element.props.children);
+  return /*#__PURE__*/(0, _react.isValidElement)(element) && Boolean(element.props.children);
 };
-
 var childToString = function childToString(child) {
   if (typeof child === 'undefined' || child === null || typeof child === 'boolean') {
     return '';
   }
-
   if (JSON.stringify(child) === '{}') {
     return '';
   }
-
   return child.toString();
 };
-
-export var reactNodeToText = function reactNodeToText(children) {
-  if (!(children instanceof Array) && !isValidElement(children)) {
+var reactNodeToText = exports.reactNodeToText = function reactNodeToText(children) {
+  if (!(children instanceof Array) && ! /*#__PURE__*/(0, _react.isValidElement)(children)) {
     return childToString(children);
   }
-
-  return Children.toArray(children).reduce(function (text, child) {
+  return _react.Children.toArray(children).reduce(function (text, child) {
     var newText = '';
-
-    if (isValidElement(child) && hasChildren(child)) {
+    if ( /*#__PURE__*/(0, _react.isValidElement)(child) && hasChildren(child)) {
       newText = reactNodeToText(child.props.children);
-    } else if (isValidElement(child) && !hasChildren(child)) {
+    } else if ( /*#__PURE__*/(0, _react.isValidElement)(child) && !hasChildren(child)) {
       newText = '';
     } else {
       newText = childToString(child);
     }
-
     return text.concat(newText);
   }, '');
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@codacy/ui-components",
-  "version": "0.64.16",
+  "version": "0.64.18",
   "description": "",
   "license": "ISC",
   "author": "",
@@ -11,7 +11,7 @@
   "sideEffects": false,
   "scripts": {
     "build": "rimraf lib && npm run build:types && npm run build:js",
-    "build-storybook": "build-storybook",
+    "build-storybook": "storybook build",
     "build:js": "NODE_ENV=production babel src -d lib --extensions \".ts,.tsx,.jsx\" --ignore src/jestSetup.ts,src/test-utils,\"src/**/*.spec.ts\",\"src/**/*.test.tsx\"",
     "build:types": "tsc -p tsconfig.prod.json --emitDeclarationOnly",
     "check-types": "tsc --noEmit",
@@ -21,13 +21,13 @@
     "lint": "npm run lint-cmd .",
     "lint-cmd": "eslint --ignore-path .eslintignore --ext .js,.jsx,.ts,.tsx",
     "lint-staged": "lint-staged",
-    "storybook": "start-storybook -p 6006",
+    "storybook": "storybook dev -p 6006",
     "test": "jest",
     "test:watch": "jest --watch",
     "test:coverage": "jest --coverage"
   },
   "dependencies": {
-    "@babel/runtime": "^7.12.5",
+    "@babel/runtime": "^7.23.6",
     "@pathofdev/react-tag-input": "github:inesgomas/react-tag-input",
     "@styled-system/should-forward-prop": "^5.1.5",
     "autosize": "^4.0.2",
@@ -36,18 +36,22 @@
     "query-string": "^6.13.7"
   },
   "devDependencies": {
-    "@babel/cli": "^7.12.1",
-    "@babel/core": "^7.12.3",
-    "@emotion/core": "^10.3.0",
-    "@emotion/styled": "^10.3.0",
-    "@emotion/styled-base": "^10.3.0",
+    "@babel/cli": "^7.23.4",
+    "@babel/core": "^7.23.6",
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@emotion/babel-plugin": "^11.11.0",
+    "@emotion/eslint-plugin": "^11.11.0",
+    "@emotion/jest": "^11.11.0",
+    "@emotion/react": "^11.11.1",
+    "@emotion/styled": "^11.11.0",
     "@mdx-js/react": "^2.0.0",
     "@popperjs/core": "^2.5.4",
-    "@storybook/addon-docs": "^6.5.10",
-    "@storybook/addon-essentials": "^6.5.12",
-    "@storybook/addons": "^6.5.10",
-    "@storybook/mdx2-csf": "^0.0.3",
-    "@storybook/react": "^6.5.10",
+    "@storybook/addon-docs": "^7.6.4",
+    "@storybook/addon-essentials": "^7.6.4",
+    "@storybook/addons": "^7.6.4",
+    "@storybook/mdx2-csf": "^1.1.0",
+    "@storybook/react": "^7.6.4",
+    "@storybook/react-webpack5": "^7.6.4",
     "@testing-library/dom": "^8.16.0",
     "@testing-library/jest-dom": "^5.11.6",
     "@testing-library/react": "^13.3.0",
@@ -60,36 +64,32 @@
     "@types/react": "^18.0.15",
     "@types/react-dom": "^18.0.6",
     "@types/resize-observer-browser": "^0.1.6",
-    "@types/styled-system": "^5.1.10",
-    "@types/styled-system__should-forward-prop": "^5.1.2",
-    "@typescript-eslint/eslint-plugin": "^4.1.1",
-    "@typescript-eslint/parser": "^4.1.1",
-    "babel-eslint": "^10.1.0",
-    "babel-loader": "^8.2.1",
-    "babel-plugin-emotion": "^10.0.33",
-    "babel-preset-react-app": "^9.1.2",
+    "@types/styled-system": "^5.1.22",
+    "@types/styled-system__should-forward-prop": "^5.1.4",
+    "@typescript-eslint/eslint-plugin": "^6.13.2",
+    "@typescript-eslint/parser": "^6.13.2",
+    "babel-loader": "^9.1.3",
+    "babel-preset-react-app": "^10.0.1",
     "copy-to-clipboard": "^3.3.1",
     "depcheck": "^1.4.2",
-    "emotion-theming": "^10.3.0",
-    "eslint": "^6.8.0",
-    "eslint-config-prettier": "^6.15.0",
+    "eslint": "^8.55.0",
+    "eslint-config-prettier": "^9.1.0",
     "eslint-config-react-app": "^5.2.1",
-    "eslint-plugin-flowtype": "^3.13.0",
+    "eslint-plugin-flowtype": "^8.0.3",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-jsx-a11y": "^6.4.1",
     "eslint-plugin-mdx": "^1.16.0",
-    "eslint-plugin-prettier": "^3.1.4",
+    "eslint-plugin-prettier": "^5.0.1",
     "eslint-plugin-react": "^7.21.5",
     "eslint-plugin-react-hooks": "^1.7.0",
     "husky": "^4.3.0",
     "jest": "^24.9.0",
-    "jest-emotion": "^10.0.32",
     "jest-environment-jsdom-fourteen": "1.0.1",
     "jest-watch-typeahead": "^0.4.2",
     "lint-staged": "^9.5.0",
     "lodash": "^4.17.20",
     "numeral": "^2.0.6",
-    "prettier": "^1.19.1",
+    "prettier": "^3.1.1",
     "react": "^18.2.0",
     "react-docgen-typescript-loader": "^3.7.2",
     "react-dom": "^18.2.0",
@@ -97,14 +97,14 @@
     "react-toastify": "8.0.2",
     "reakit": "^1.3.11",
     "rimraf": "^3.0.2",
+    "storybook": "next",
     "styled-system": "^5.1.5",
     "typeface-clear-sans": "0.0.44",
     "typescript": "^4.5.4"
   },
   "peerDependencies": {
-    "@emotion/core": "^10.3.0",
-    "@emotion/styled": "^10.3.0",
-    "@emotion/styled-base": "^10.3.0",
+    "@emotion/react": "^11.11.1",
+    "@emotion/styled": "^11.11.0",
     "@popperjs/core": "^2.5.4",
     "lodash": "^4.17.20",
     "numeral": "^2.0.6",