@codacy/ui-components 0.66.25 → 0.66.27

package/lib/theme/ColorSchemes/dark/text.js

@@ -1,61 +1,54 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.textColors = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-var _primitives = require("../primitives");
-var _semantics = require("../semantics");
-var textColors = exports.textColors = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, (0, _semantics.semanticFunctionalColorsFx)('text', 60)), {}, {
-  'text-primary': _primitives.primitiveColors['grey-98'],
-  'text-secondary': _primitives.primitiveColors['grey-80'],
-  'text-tertiary': _primitives.primitiveColors['grey-60'],
-  'text-disabled': _primitives.primitiveColors['grey-30'],
-  'text-inverted': _primitives.primitiveColors['grey-98'],
-  'text-subtle-enabled': _primitives.primitiveColors['grey-20'],
-  'text-subtle-hover': _primitives.primitiveColors['grey-30'],
-  'text-subtle-focus': _primitives.primitiveColors['grey-30'],
-  'text-subtle-pressed': _primitives.primitiveColors['grey-50'],
-  'text-subtle-disabled': _primitives.primitiveColors['grey-20'],
-  'text-subtle-inverted': _primitives.primitiveColors['grey-10'],
-  'text-code-subtle-enabled': _primitives.primitiveColors['grey-20'],
-  'text-code-subtle-disabled': _primitives.primitiveColors['grey-60'],
+import { primitiveColors } from '../primitives';
+import { semanticFunctionalColorsFx } from '../semantics';
+export const textColors = {
+  ...semanticFunctionalColorsFx('text', 60),
+  'text-primary': primitiveColors['grey-98'],
+  'text-secondary': primitiveColors['grey-80'],
+  'text-tertiary': primitiveColors['grey-60'],
+  'text-disabled': primitiveColors['grey-30'],
+  'text-inverted': primitiveColors['grey-98'],
+  'text-subtle-enabled': primitiveColors['grey-20'],
+  'text-subtle-hover': primitiveColors['grey-30'],
+  'text-subtle-focus': primitiveColors['grey-30'],
+  'text-subtle-pressed': primitiveColors['grey-50'],
+  'text-subtle-disabled': primitiveColors['grey-20'],
+  'text-subtle-inverted': primitiveColors['grey-10'],
+  'text-code-subtle-enabled': primitiveColors['grey-20'],
+  'text-code-subtle-disabled': primitiveColors['grey-60'],
   // Text - Link and Brand
-  'text-link-enabled': _primitives.primitiveColors['blue-60'],
-  'text-link-hover': _primitives.primitiveColors['blue-70'],
-  'text-link-focus': _primitives.primitiveColors['blue-70'],
-  'text-link-pressed': _primitives.primitiveColors['blue-30'],
-  'text-link-disabled': _primitives.primitiveColors['blue-20'],
-  'text-brand-enabled': _primitives.primitiveColors['blue-50'],
-  'text-brand-hover': _primitives.primitiveColors['blue-60'],
-  'text-brand-focus': _primitives.primitiveColors['blue-60'],
-  'text-brand-pressed': _primitives.primitiveColors['blue-30'],
-  'text-brand-disabled': _primitives.primitiveColors['blue-20'],
+  'text-link-enabled': primitiveColors['blue-60'],
+  'text-link-hover': primitiveColors['blue-70'],
+  'text-link-focus': primitiveColors['blue-70'],
+  'text-link-pressed': primitiveColors['blue-30'],
+  'text-link-disabled': primitiveColors['blue-20'],
+  'text-brand-enabled': primitiveColors['blue-50'],
+  'text-brand-hover': primitiveColors['blue-60'],
+  'text-brand-focus': primitiveColors['blue-60'],
+  'text-brand-pressed': primitiveColors['blue-30'],
+  'text-brand-disabled': primitiveColors['blue-20'],
   // Text - Semantic
   // blue
-  'text-info-enabled': _primitives.primitiveColors['blue-60'],
-  'text-minor-enabled': _primitives.primitiveColors['blue-50'],
-  'text-minor-disabled': _primitives.primitiveColors['blue-20'],
-  'text-code-brand-enabled': _primitives.primitiveColors['blue-20'],
-  'text-code-brand-disabled': _primitives.primitiveColors['blue-60'],
+  'text-info-enabled': primitiveColors['blue-60'],
+  'text-minor-enabled': primitiveColors['blue-50'],
+  'text-minor-disabled': primitiveColors['blue-20'],
+  'text-code-brand-enabled': primitiveColors['blue-20'],
+  'text-code-brand-disabled': primitiveColors['blue-60'],
   // red
-  'text-danger-enabled': _primitives.primitiveColors['red-60'],
-  'text-danger-hover': _primitives.primitiveColors['red-70'],
-  'text-danger-focus': _primitives.primitiveColors['red-70'],
-  'text-danger-pressed': _primitives.primitiveColors['red-80'],
-  'text-danger-disabled': _primitives.primitiveColors['red-20'],
-  'text-critical-enabled': _primitives.primitiveColors['red-60'],
-  'text-critical-disabled': _primitives.primitiveColors['red-30'],
-  'text-code-danger': _primitives.primitiveColors['red-60'],
+  'text-danger-enabled': primitiveColors['red-60'],
+  'text-danger-hover': primitiveColors['red-70'],
+  'text-danger-focus': primitiveColors['red-70'],
+  'text-danger-pressed': primitiveColors['red-80'],
+  'text-danger-disabled': primitiveColors['red-20'],
+  'text-critical-enabled': primitiveColors['red-60'],
+  'text-critical-disabled': primitiveColors['red-30'],
+  'text-code-danger': primitiveColors['red-60'],
   // yellow
-  'text-warning-enabled': _primitives.primitiveColors['yellow-60'],
-  'text-medium-enabled': _primitives.primitiveColors['yellow-50'],
-  'text-medium-disabled': _primitives.primitiveColors['yellow-20'],
+  'text-warning-enabled': primitiveColors['yellow-60'],
+  'text-medium-enabled': primitiveColors['yellow-50'],
+  'text-medium-disabled': primitiveColors['yellow-20'],
   // green
-  'text-success-enabled': _primitives.primitiveColors['green-60'],
+  'text-success-enabled': primitiveColors['green-60'],
   // orange
-  'text-high-enabled': _primitives.primitiveColors['orange-40'],
-  'text-high-disabled': _primitives.primitiveColors['orange-20']
-});
+  'text-high-enabled': primitiveColors['orange-40'],
+  'text-high-disabled': primitiveColors['orange-20']
+};

package/lib/theme/ColorSchemes/index.js

@@ -1,49 +1,4 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _light = require("./light");
-Object.keys(_light).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _light[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _light[key];
-    }
-  });
-});
-var _dark = require("./dark");
-Object.keys(_dark).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _dark[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _dark[key];
-    }
-  });
-});
-var _primitives = require("./primitives");
-Object.keys(_primitives).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _primitives[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _primitives[key];
-    }
-  });
-});
-var _semantics = require("./semantics");
-Object.keys(_semantics).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _semantics[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _semantics[key];
-    }
-  });
-});
+export * from './light';
+export * from './dark';
+export * from './primitives';
+export * from './semantics';

package/lib/theme/ColorSchemes/light/background.d.ts

@@ -32,51 +32,51 @@ export declare const backgroundColors: {
     'background-attention-disabled': string;
     'background-high-enabled': string;
     'background-high-disabled': string;
-    "link-high": string;
-    "link-medium": string;
-    "link-success": string;
-    "link-danger": string;
-    "link-warning": string;
-    "link-info": string;
-    "link-attention": string;
-    "link-critical": string;
-    "link-minor": string;
-    "background-high": string;
-    "background-medium": string;
-    "background-success": string;
+    "text-danger": string;
+    "text-success": string;
+    "text-warning": string;
+    "text-info": string;
+    "text-attention": string;
+    "text-critical": string;
+    "text-high": string;
+    "text-medium": string;
+    "text-minor": string;
     "background-danger": string;
+    "background-success": string;
     "background-warning": string;
     "background-info": string;
     "background-attention": string;
     "background-critical": string;
+    "background-high": string;
+    "background-medium": string;
     "background-minor": string;
-    "border-high": string;
-    "border-medium": string;
-    "border-success": string;
     "border-danger": string;
+    "border-success": string;
     "border-warning": string;
     "border-info": string;
     "border-attention": string;
     "border-critical": string;
+    "border-high": string;
+    "border-medium": string;
     "border-minor": string;
-    "text-high": string;
-    "text-medium": string;
-    "text-success": string;
-    "text-danger": string;
-    "text-warning": string;
-    "text-info": string;
-    "text-attention": string;
-    "text-critical": string;
-    "text-minor": string;
-    "icon-high": string;
-    "icon-medium": string;
-    "icon-success": string;
     "icon-danger": string;
+    "icon-success": string;
     "icon-warning": string;
     "icon-info": string;
     "icon-attention": string;
     "icon-critical": string;
+    "icon-high": string;
+    "icon-medium": string;
     "icon-minor": string;
+    "link-danger": string;
+    "link-success": string;
+    "link-warning": string;
+    "link-info": string;
+    "link-attention": string;
+    "link-critical": string;
+    "link-high": string;
+    "link-medium": string;
+    "link-minor": string;
     'background-primary': string;
     'background-secondary': string;
     'background-subtle': string;

package/lib/theme/ColorSchemes/light/background.js

@@ -1,56 +1,48 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.backgroundColors = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-var _primitives = require("../primitives");
-var _semantics = require("../semantics");
-var backgroundColors = exports.backgroundColors = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
-  'background-primary': _primitives.primitiveColors['grey-100'],
-  'background-secondary': _primitives.primitiveColors['grey-98'],
-  'background-subtle': _primitives.primitiveColors['grey-95'],
-  'background-brand-subtle': _primitives.primitiveColors['blue-95']
-}, (0, _semantics.semanticFunctionalColorsFx)('background', 95)), {}, {
-  'background-brand': _primitives.primitiveColors['blue-95'],
-  'background-brand-enabled': _primitives.primitiveColors['blue-40'],
-  'background-brand-hover': _primitives.primitiveColors['blue-30'],
-  'background-brand-focus': _primitives.primitiveColors['blue-30'],
-  'background-brand-pressed': _primitives.primitiveColors['blue-20'],
-  'background-brand-disabled': _primitives.primitiveColors['blue-70'],
-  'background-brand-inverted': _primitives.primitiveColors['grey-100'],
-  'background-subtle-enabled': _primitives.primitiveColors['grey-40'],
-  'background-subtle-hover': _primitives.primitiveColors['grey-30'],
-  'background-subtle-focus': _primitives.primitiveColors['grey-30'],
-  'background-subtle-pressed': _primitives.primitiveColors['grey-10'],
-  'background-subtle-disabled': _primitives.primitiveColors['grey-70'],
+import { primitiveColors } from '../primitives';
+import { semanticFunctionalColorsFx } from '../semantics';
+export const backgroundColors = {
+  'background-primary': primitiveColors['grey-100'],
+  'background-secondary': primitiveColors['grey-98'],
+  'background-subtle': primitiveColors['grey-95'],
+  'background-brand-subtle': primitiveColors['blue-95'],
+  ...semanticFunctionalColorsFx('background', 95),
+  'background-brand': primitiveColors['blue-95'],
+  'background-brand-enabled': primitiveColors['blue-40'],
+  'background-brand-hover': primitiveColors['blue-30'],
+  'background-brand-focus': primitiveColors['blue-30'],
+  'background-brand-pressed': primitiveColors['blue-20'],
+  'background-brand-disabled': primitiveColors['blue-70'],
+  'background-brand-inverted': primitiveColors['grey-100'],
+  'background-subtle-enabled': primitiveColors['grey-40'],
+  'background-subtle-hover': primitiveColors['grey-30'],
+  'background-subtle-focus': primitiveColors['grey-30'],
+  'background-subtle-pressed': primitiveColors['grey-10'],
+  'background-subtle-disabled': primitiveColors['grey-70'],
   // blue
-  'background-info-enabled': _primitives.primitiveColors['blue-40'],
-  'background-info-disabled': _primitives.primitiveColors['blue-70'],
-  'background-minor-enabled': _primitives.primitiveColors['blue-40'],
-  'background-minor-disabled': _primitives.primitiveColors['blue-70'],
+  'background-info-enabled': primitiveColors['blue-40'],
+  'background-info-disabled': primitiveColors['blue-70'],
+  'background-minor-enabled': primitiveColors['blue-40'],
+  'background-minor-disabled': primitiveColors['blue-70'],
   // red
-  'background-danger-enabled': _primitives.primitiveColors['red-40'],
-  'background-danger-hover': _primitives.primitiveColors['red-30'],
-  'background-danger-focus': _primitives.primitiveColors['red-30'],
-  'background-danger-pressed': _primitives.primitiveColors['red-20'],
-  'background-danger-disabled': _primitives.primitiveColors['red-70'],
-  'background-critical-enabled': _primitives.primitiveColors['red-40'],
-  'background-critical-disabled': _primitives.primitiveColors['red-70'],
+  'background-danger-enabled': primitiveColors['red-40'],
+  'background-danger-hover': primitiveColors['red-30'],
+  'background-danger-focus': primitiveColors['red-30'],
+  'background-danger-pressed': primitiveColors['red-20'],
+  'background-danger-disabled': primitiveColors['red-70'],
+  'background-critical-enabled': primitiveColors['red-40'],
+  'background-critical-disabled': primitiveColors['red-70'],
   // green
-  'background-success-enabled': _primitives.primitiveColors['green-40'],
-  'background-success-disabled': _primitives.primitiveColors['green-70'],
+  'background-success-enabled': primitiveColors['green-40'],
+  'background-success-disabled': primitiveColors['green-70'],
   // yellow
-  'background-warning-enabled': _primitives.primitiveColors['yellow-40'],
-  'background-warning-disabled': _primitives.primitiveColors['yellow-70'],
-  'background-medium-enabled': _primitives.primitiveColors['yellow-50'],
-  'background-medium-disabled': _primitives.primitiveColors['yellow-70'],
+  'background-warning-enabled': primitiveColors['yellow-40'],
+  'background-warning-disabled': primitiveColors['yellow-70'],
+  'background-medium-enabled': primitiveColors['yellow-50'],
+  'background-medium-disabled': primitiveColors['yellow-70'],
   // purple
-  'background-attention-enabled': _primitives.primitiveColors['purple-40'],
-  'background-attention-disabled': _primitives.primitiveColors['purple-70'],
+  'background-attention-enabled': primitiveColors['purple-40'],
+  'background-attention-disabled': primitiveColors['purple-70'],
   // orange
-  'background-high-enabled': _primitives.primitiveColors['orange-40'],
-  'background-high-disabled': _primitives.primitiveColors['orange-70']
-});
+  'background-high-enabled': primitiveColors['orange-40'],
+  'background-high-disabled': primitiveColors['orange-70']
+};

package/lib/theme/ColorSchemes/light/border.d.ts

@@ -24,51 +24,51 @@ export declare const borderColors: {
     'border-attention-disabled': string;
     'border-high-enabled': string;
     'border-high-disabled': string;
-    "link-high": string;
-    "link-medium": string;
-    "link-success": string;
-    "link-danger": string;
-    "link-warning": string;
-    "link-info": string;
-    "link-attention": string;
-    "link-critical": string;
-    "link-minor": string;
-    "background-high": string;
-    "background-medium": string;
-    "background-success": string;
+    "text-danger": string;
+    "text-success": string;
+    "text-warning": string;
+    "text-info": string;
+    "text-attention": string;
+    "text-critical": string;
+    "text-high": string;
+    "text-medium": string;
+    "text-minor": string;
     "background-danger": string;
+    "background-success": string;
     "background-warning": string;
     "background-info": string;
     "background-attention": string;
     "background-critical": string;
+    "background-high": string;
+    "background-medium": string;
     "background-minor": string;
-    "border-high": string;
-    "border-medium": string;
-    "border-success": string;
     "border-danger": string;
+    "border-success": string;
     "border-warning": string;
     "border-info": string;
     "border-attention": string;
     "border-critical": string;
+    "border-high": string;
+    "border-medium": string;
     "border-minor": string;
-    "text-high": string;
-    "text-medium": string;
-    "text-success": string;
-    "text-danger": string;
-    "text-warning": string;
-    "text-info": string;
-    "text-attention": string;
-    "text-critical": string;
-    "text-minor": string;
-    "icon-high": string;
-    "icon-medium": string;
-    "icon-success": string;
     "icon-danger": string;
+    "icon-success": string;
     "icon-warning": string;
     "icon-info": string;
     "icon-attention": string;
     "icon-critical": string;
+    "icon-high": string;
+    "icon-medium": string;
     "icon-minor": string;
+    "link-danger": string;
+    "link-success": string;
+    "link-warning": string;
+    "link-info": string;
+    "link-attention": string;
+    "link-critical": string;
+    "link-high": string;
+    "link-medium": string;
+    "link-minor": string;
     'border-inverted': string;
     'border-primary': string;
     'border-subtle-enabled': string;

package/lib/theme/ColorSchemes/light/border.js

@@ -1,52 +1,44 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.borderColors = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
-var _primitives = require("../primitives");
-var _semantics = require("../semantics");
-var borderColors = exports.borderColors = (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
-  'border-inverted': _primitives.primitiveColors['grey-100'],
-  'border-primary': _primitives.primitiveColors['grey-90'],
-  'border-subtle-enabled': _primitives.primitiveColors['grey-50'],
-  'border-subtle-hover': _primitives.primitiveColors['grey-30'],
-  'border-subtle-focus': _primitives.primitiveColors['grey-30'],
-  'border-subtle-pressed': _primitives.primitiveColors['grey-10'],
-  'border-subtle-disabled': _primitives.primitiveColors['grey-70']
-}, (0, _semantics.semanticFunctionalColorsFx)('border', 40)), {}, {
+import { primitiveColors } from '../primitives';
+import { semanticFunctionalColorsFx } from '../semantics';
+export const borderColors = {
+  'border-inverted': primitiveColors['grey-100'],
+  'border-primary': primitiveColors['grey-90'],
+  'border-subtle-enabled': primitiveColors['grey-50'],
+  'border-subtle-hover': primitiveColors['grey-30'],
+  'border-subtle-focus': primitiveColors['grey-30'],
+  'border-subtle-pressed': primitiveColors['grey-10'],
+  'border-subtle-disabled': primitiveColors['grey-70'],
+  ...semanticFunctionalColorsFx('border', 40),
   //Border - Semantic
   // blue
-  'border-brand-subtle': _primitives.primitiveColors['blue-70'],
-  'border-brand-enabled': _primitives.primitiveColors['blue-40'],
-  'border-brand-pressed': _primitives.primitiveColors['blue-20'],
-  'border-brand-hover': _primitives.primitiveColors['blue-30'],
-  'border-brand-primary': _primitives.primitiveColors['blue-70'],
-  'border-brand-disabled': _primitives.primitiveColors['blue-70'],
-  'border-info-enabled': _primitives.primitiveColors['blue-40'],
-  'border-minor-enabled': _primitives.primitiveColors['blue-40'],
-  'border-minor-disabled': _primitives.primitiveColors['blue-70'],
+  'border-brand-subtle': primitiveColors['blue-70'],
+  'border-brand-enabled': primitiveColors['blue-40'],
+  'border-brand-pressed': primitiveColors['blue-20'],
+  'border-brand-hover': primitiveColors['blue-30'],
+  'border-brand-primary': primitiveColors['blue-70'],
+  'border-brand-disabled': primitiveColors['blue-70'],
+  'border-info-enabled': primitiveColors['blue-40'],
+  'border-minor-enabled': primitiveColors['blue-40'],
+  'border-minor-disabled': primitiveColors['blue-70'],
   // red
-  'border-danger-subtle': _primitives.primitiveColors['red-95'],
-  'border-danger-enabled': _primitives.primitiveColors['red-40'],
-  'border-danger-hover': _primitives.primitiveColors['red-30'],
-  'border-danger-focus': _primitives.primitiveColors['red-30'],
-  'border-danger-pressed': _primitives.primitiveColors['red-20'],
-  'border-critical-enabled': _primitives.primitiveColors['red-40'],
-  'border-critical-disabled': _primitives.primitiveColors['red-70'],
+  'border-danger-subtle': primitiveColors['red-95'],
+  'border-danger-enabled': primitiveColors['red-40'],
+  'border-danger-hover': primitiveColors['red-30'],
+  'border-danger-focus': primitiveColors['red-30'],
+  'border-danger-pressed': primitiveColors['red-20'],
+  'border-critical-enabled': primitiveColors['red-40'],
+  'border-critical-disabled': primitiveColors['red-70'],
   // yellow
-  'border-warning-enabled': _primitives.primitiveColors['yellow-40'],
-  'border-medium-enabled': _primitives.primitiveColors['yellow-50'],
-  'border-medium-disabled': _primitives.primitiveColors['yellow-70'],
+  'border-warning-enabled': primitiveColors['yellow-40'],
+  'border-medium-enabled': primitiveColors['yellow-50'],
+  'border-medium-disabled': primitiveColors['yellow-70'],
   // green
-  'border-success-enabled': _primitives.primitiveColors['green-40'],
-  'border-success-subtle': _primitives.primitiveColors['green-90'],
+  'border-success-enabled': primitiveColors['green-40'],
+  'border-success-subtle': primitiveColors['green-90'],
   // purple
-  'border-attention-enabled': _primitives.primitiveColors['purple-40'],
-  'border-attention-disabled': _primitives.primitiveColors['purple-70'],
+  'border-attention-enabled': primitiveColors['purple-40'],
+  'border-attention-disabled': primitiveColors['purple-70'],
   // orange
-  'border-high-enabled': _primitives.primitiveColors['orange-40'],
-  'border-high-disabled': _primitives.primitiveColors['orange-70']
-});
+  'border-high-enabled': primitiveColors['orange-40'],
+  'border-high-disabled': primitiveColors['orange-70']
+};

package/lib/theme/ColorSchemes/light/data.js

@@ -1,25 +1,19 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.dataColors = void 0;
-var _primitives = require("../primitives");
-var dataColors = exports.dataColors = {
-  'data-color1-enabled': _primitives.primitiveColors['blue-60'],
-  'data-color1-disabled': _primitives.primitiveColors['blue-98'],
-  'data-color2-enabled': _primitives.primitiveColors['blue-30'],
-  'data-color2-disabled': _primitives.primitiveColors['blue-95'],
-  'data-color3-enabled': _primitives.primitiveColors['purple-60'],
-  'data-color3-disabled': _primitives.primitiveColors['purple-95'],
-  'data-color4-enabled': _primitives.primitiveColors['magenta-40'],
-  'data-color4-disabled': _primitives.primitiveColors['magenta-95'],
-  'data-color5-enabled': _primitives.primitiveColors['purple-80'],
-  'data-color5-disabled': _primitives.primitiveColors['purple-98'],
-  'data-color6-enabled': _primitives.primitiveColors['grey-60'],
-  'data-color6-disabled': _primitives.primitiveColors['grey-98'],
-  'data-color7-enabled': _primitives.primitiveColors['grey-20'],
-  'data-color7-disabled': _primitives.primitiveColors['grey-95'],
-  'data-color8-enabled': _primitives.primitiveColors['purple-40'],
-  'data-color8-disabled': _primitives.primitiveColors['purple-90']
+import { primitiveColors } from '../primitives';
+export const dataColors = {
+  'data-color1-enabled': primitiveColors['blue-60'],
+  'data-color1-disabled': primitiveColors['blue-98'],
+  'data-color2-enabled': primitiveColors['blue-30'],
+  'data-color2-disabled': primitiveColors['blue-95'],
+  'data-color3-enabled': primitiveColors['purple-60'],
+  'data-color3-disabled': primitiveColors['purple-95'],
+  'data-color4-enabled': primitiveColors['magenta-40'],
+  'data-color4-disabled': primitiveColors['magenta-95'],
+  'data-color5-enabled': primitiveColors['purple-80'],
+  'data-color5-disabled': primitiveColors['purple-98'],
+  'data-color6-enabled': primitiveColors['grey-60'],
+  'data-color6-disabled': primitiveColors['grey-98'],
+  'data-color7-enabled': primitiveColors['grey-20'],
+  'data-color7-disabled': primitiveColors['grey-95'],
+  'data-color8-enabled': primitiveColors['purple-40'],
+  'data-color8-disabled': primitiveColors['purple-90']
 };