@elastic/eui 60.0.0 → 60.1.2

package/optimize/es/components/icon/icon_map.js

@@ -0,0 +1,455 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+export var typeToPathMap = {
+  accessibility: 'accessibility',
+  addDataApp: 'app_add_data',
+  advancedSettingsApp: 'app_advanced_settings',
+  agentApp: 'app_fleet',
+  aggregate: 'aggregate',
+  alert: 'alert',
+  analyzeEvent: 'analyzeEvent',
+  annotation: 'annotation',
+  apmApp: 'app_apm',
+  apmTrace: 'apm_trace',
+  appSearchApp: 'app_app_search',
+  apps: 'apps',
+  arrowDown: 'arrow_down',
+  arrowLeft: 'arrow_left',
+  arrowRight: 'arrow_right',
+  arrowUp: 'arrow_up',
+  arrowStart: 'arrowStart',
+  arrowEnd: 'arrowEnd',
+  asterisk: 'asterisk',
+  auditbeatApp: 'app_auditbeat',
+  beaker: 'beaker',
+  bell: 'bell',
+  bellSlash: 'bellSlash',
+  bolt: 'bolt',
+  boxesHorizontal: 'boxes_horizontal',
+  boxesVertical: 'boxes_vertical',
+  branch: 'branch',
+  branchUser: 'branchUser',
+  broom: 'broom',
+  brush: 'brush',
+  bug: 'bug',
+  bullseye: 'bullseye',
+  calendar: 'calendar',
+  canvasApp: 'app_canvas',
+  casesApp: 'app_cases',
+  check: 'check',
+  checkInCircleFilled: 'checkInCircleFilled',
+  cheer: 'cheer',
+  classificationJob: 'ml_classification_job',
+  clock: 'clock',
+  cloudDrizzle: 'cloudDrizzle',
+  cloudStormy: 'cloudStormy',
+  cloudSunny: 'cloudSunny',
+  codeApp: 'app_code',
+  color: 'color',
+  compute: 'compute',
+  console: 'console',
+  consoleApp: 'app_console',
+  continuityAbove: 'continuityAbove',
+  continuityAboveBelow: 'continuityAboveBelow',
+  continuityBelow: 'continuityBelow',
+  continuityWithin: 'continuityWithin',
+  controlsHorizontal: 'controls_horizontal',
+  controlsVertical: 'controls_vertical',
+  copy: 'copy',
+  copyClipboard: 'copy_clipboard',
+  createAdvancedJob: 'ml_create_advanced_job',
+  createMultiMetricJob: 'ml_create_multi_metric_job',
+  createPopulationJob: 'ml_create_population_job',
+  createSingleMetricJob: 'ml_create_single_metric_job',
+  cross: 'cross',
+  crossClusterReplicationApp: 'app_cross_cluster_replication',
+  crossInACircleFilled: 'crossInACircleFilled',
+  crosshairs: 'crosshairs',
+  currency: 'currency',
+  cut: 'cut',
+  dashboardApp: 'app_dashboard',
+  dataVisualizer: 'ml_data_visualizer',
+  database: 'database',
+  desktop: 'desktop',
+  devToolsApp: 'app_devtools',
+  discoverApp: 'app_discover',
+  document: 'document',
+  documentEdit: 'documentEdit',
+  documentation: 'documentation',
+  documents: 'documents',
+  dot: 'dot',
+  doubleArrowLeft: 'doubleArrowLeft',
+  doubleArrowRight: 'doubleArrowRight',
+  download: 'download',
+  editorAlignCenter: 'editor_align_center',
+  editorAlignLeft: 'editor_align_left',
+  editorAlignRight: 'editor_align_right',
+  editorBold: 'editor_bold',
+  editorChecklist: 'editor_checklist',
+  editorCodeBlock: 'editor_code_block',
+  editorComment: 'editor_comment',
+  editorDistributeHorizontal: 'editorDistributeHorizontal',
+  editorDistributeVertical: 'editorDistributeVertical',
+  editorHeading: 'editor_heading',
+  editorItalic: 'editor_italic',
+  editorItemAlignBottom: 'editorItemAlignBottom',
+  editorItemAlignCenter: 'editorItemAlignCenter',
+  editorItemAlignLeft: 'editorItemAlignLeft',
+  editorItemAlignMiddle: 'editorItemAlignMiddle',
+  editorItemAlignRight: 'editorItemAlignRight',
+  editorItemAlignTop: 'editorItemAlignTop',
+  editorLink: 'editor_link',
+  editorOrderedList: 'editor_ordered_list',
+  editorPositionBottomLeft: 'editorPositionBottomLeft',
+  editorPositionBottomRight: 'editorPositionBottomRight',
+  editorPositionTopLeft: 'editorPositionTopLeft',
+  editorPositionTopRight: 'editorPositionTopRight',
+  editorRedo: 'editor_redo',
+  editorStrike: 'editor_strike',
+  editorTable: 'editor_table',
+  editorUnderline: 'editor_underline',
+  editorUndo: 'editor_undo',
+  editorUnorderedList: 'editor_unordered_list',
+  email: 'email',
+  empty: 'empty',
+  emsApp: 'app_ems',
+  eql: 'eql',
+  eraser: 'eraser',
+  exit: 'exit',
+  expand: 'expand',
+  expandMini: 'expandMini',
+  exportAction: 'export',
+  eye: 'eye',
+  eyeClosed: 'eye_closed',
+  faceHappy: 'face_happy',
+  faceNeutral: 'face_neutral',
+  faceSad: 'face_sad',
+  filebeatApp: 'app_filebeat',
+  filter: 'filter',
+  flag: 'flag',
+  fleetApp: 'app_agent',
+  fold: 'fold',
+  folderCheck: 'folder_check',
+  folderClosed: 'folder_closed',
+  folderExclamation: 'folder_exclamation',
+  folderOpen: 'folder_open',
+  frameNext: 'frameNext',
+  framePrevious: 'framePrevious',
+  fullScreen: 'full_screen',
+  fullScreenExit: 'fullScreenExit',
+  function: 'function',
+  gear: 'gear',
+  gisApp: 'app_gis',
+  glasses: 'glasses',
+  globe: 'globe',
+  grab: 'grab',
+  grabHorizontal: 'grab_horizontal',
+  graphApp: 'app_graph',
+  grid: 'grid',
+  grokApp: 'app_grok',
+  heart: 'heart',
+  heartbeatApp: 'app_heartbeat',
+  heatmap: 'heatmap',
+  help: 'help',
+  home: 'home',
+  iInCircle: 'iInCircle',
+  image: 'image',
+  importAction: 'import',
+  indexClose: 'index_close',
+  indexEdit: 'index_edit',
+  indexFlush: 'index_flush',
+  indexManagementApp: 'app_index_management',
+  indexMapping: 'index_mapping',
+  indexOpen: 'index_open',
+  indexPatternApp: 'app_index_pattern',
+  indexRollupApp: 'app_index_rollup',
+  indexRuntime: 'index_runtime',
+  indexSettings: 'index_settings',
+  inputOutput: 'inputOutput',
+  inspect: 'inspect',
+  invert: 'invert',
+  ip: 'ip',
+  keyboardShortcut: 'keyboard_shortcut',
+  kqlField: 'kql_field',
+  kqlFunction: 'kql_function',
+  kqlOperand: 'kql_operand',
+  kqlSelector: 'kql_selector',
+  kqlValue: 'kql_value',
+  layers: 'layers',
+  lensApp: 'app_lens',
+  lettering: 'lettering',
+  lineDashed: 'lineDashed',
+  lineDotted: 'lineDotted',
+  lineSolid: 'lineSolid',
+  link: 'link',
+  list: 'list',
+  listAdd: 'list_add',
+  lock: 'lock',
+  lockOpen: 'lockOpen',
+  logoAWS: 'logo_aws',
+  logoAWSMono: 'logo_aws_mono',
+  logoAerospike: 'logo_aerospike',
+  logoApache: 'logo_apache',
+  logoAppSearch: 'logo_app_search',
+  logoAzure: 'logo_azure',
+  logoAzureMono: 'logo_azure_mono',
+  logoBeats: 'logo_beats',
+  logoBusinessAnalytics: 'logo_business_analytics',
+  logoCeph: 'logo_ceph',
+  logoCloud: 'logo_cloud',
+  logoCloudEnterprise: 'logo_cloud_ece',
+  logoCode: 'logo_code',
+  logoCodesandbox: 'logo_codesandbox',
+  logoCouchbase: 'logo_couchbase',
+  logoDocker: 'logo_docker',
+  logoDropwizard: 'logo_dropwizard',
+  logoElastic: 'logo_elastic',
+  logoElasticStack: 'logo_elastic_stack',
+  logoElasticsearch: 'logo_elasticsearch',
+  logoEnterpriseSearch: 'logo_enterprise_search',
+  logoEtcd: 'logo_etcd',
+  logoGCP: 'logo_gcp',
+  logoGCPMono: 'logo_gcp_mono',
+  logoGithub: 'logo_github',
+  logoGmail: 'logo_gmail',
+  logoGolang: 'logo_golang',
+  logoGoogleG: 'logo_google_g',
+  logoHAproxy: 'logo_haproxy',
+  logoIBM: 'logo_ibm',
+  logoIBMMono: 'logo_ibm_mono',
+  logoKafka: 'logo_kafka',
+  logoKibana: 'logo_kibana',
+  logoKubernetes: 'logo_kubernetes',
+  logoLogging: 'logo_logging',
+  logoLogstash: 'logo_logstash',
+  logoMaps: 'logo_maps',
+  logoMemcached: 'logo_memcached',
+  logoMetrics: 'logo_metrics',
+  logoMongodb: 'logo_mongodb',
+  logoMySQL: 'logo_mysql',
+  logoNginx: 'logo_nginx',
+  logoObservability: 'logo_observability',
+  logoOsquery: 'logo_osquery',
+  logoPhp: 'logo_php',
+  logoPostgres: 'logo_postgres',
+  logoPrometheus: 'logo_prometheus',
+  logoRabbitmq: 'logo_rabbitmq',
+  logoRedis: 'logo_redis',
+  logoSecurity: 'logo_security',
+  logoSiteSearch: 'logo_site_search',
+  logoSketch: 'logo_sketch',
+  logoSlack: 'logo_slack',
+  logoUptime: 'logo_uptime',
+  logoWebhook: 'logo_webhook',
+  logoWindows: 'logo_windows',
+  logoWorkplaceSearch: 'logo_workplace_search',
+  logsApp: 'app_logs',
+  logstashFilter: 'logstash_filter',
+  logstashIf: 'logstash_if',
+  logstashInput: 'logstash_input',
+  logstashOutput: 'logstash_output',
+  logstashQueue: 'logstash_queue',
+  machineLearningApp: 'app_ml',
+  magnet: 'magnet',
+  magnifyWithExclamation: 'magnifyWithExclamation',
+  magnifyWithMinus: 'magnifyWithMinus',
+  magnifyWithPlus: 'magnifyWithPlus',
+  managementApp: 'app_management',
+  mapMarker: 'map_marker',
+  memory: 'memory',
+  menu: 'menu',
+  menuDown: 'menuDown',
+  menuLeft: 'menuLeft',
+  menuRight: 'menuRight',
+  menuUp: 'menuUp',
+  merge: 'merge',
+  metricbeatApp: 'app_metricbeat',
+  metricsApp: 'app_metrics',
+  minimize: 'minimize',
+  minus: 'minus',
+  minusInCircle: 'minus_in_circle',
+  minusInCircleFilled: 'minus_in_circle_filled',
+  mobile: 'mobile',
+  monitoringApp: 'app_monitoring',
+  moon: 'moon',
+  nested: 'nested',
+  node: 'node',
+  notebookApp: 'app_notebook',
+  number: 'number',
+  offline: 'offline',
+  online: 'online',
+  outlierDetectionJob: 'ml_outlier_detection_job',
+  package: 'package',
+  packetbeatApp: 'app_packetbeat',
+  pageSelect: 'pageSelect',
+  pagesSelect: 'pagesSelect',
+  paperClip: 'paper_clip',
+  partial: 'partial',
+  pause: 'pause',
+  payment: 'payment',
+  pencil: 'pencil',
+  percent: 'percent',
+  pin: 'pin',
+  pinFilled: 'pin_filled',
+  pipelineApp: 'app_pipeline',
+  play: 'play',
+  playFilled: 'playFilled',
+  plus: 'plus',
+  plusInCircle: 'plus_in_circle',
+  plusInCircleFilled: 'plus_in_circle_filled',
+  popout: 'popout',
+  push: 'push',
+  questionInCircle: 'question_in_circle',
+  quote: 'quote',
+  recentlyViewedApp: 'app_recently_viewed',
+  refresh: 'refresh',
+  regressionJob: 'ml_regression_job',
+  reporter: 'reporter',
+  reportingApp: 'app_reporting',
+  returnKey: 'return_key',
+  save: 'save',
+  savedObjectsApp: 'app_saved_objects',
+  scale: 'scale',
+  search: 'search',
+  searchProfilerApp: 'app_search_profiler',
+  securityAnalyticsApp: 'app_security_analytics',
+  securityApp: 'app_security',
+  securitySignal: 'securitySignal',
+  securitySignalDetected: 'securitySignalDetected',
+  securitySignalResolved: 'securitySignalResolved',
+  sessionViewer: 'sessionViewer',
+  shard: 'shard',
+  share: 'share',
+  snowflake: 'snowflake',
+  sortDown: 'sort_down',
+  sortLeft: 'sortLeft',
+  sortRight: 'sortRight',
+  sortUp: 'sort_up',
+  sortable: 'sortable',
+  spacesApp: 'app_spaces',
+  sqlApp: 'app_sql',
+  starEmpty: 'star_empty',
+  starEmptySpace: 'star_empty_space',
+  starFilled: 'star_filled',
+  starFilledSpace: 'star_filled_space',
+  starMinusEmpty: 'star_minus_empty',
+  starMinusFilled: 'star_minus_filled',
+  starPlusEmpty: 'starPlusEmpty',
+  starPlusFilled: 'starPlusFilled',
+  stats: 'stats',
+  stop: 'stop',
+  stopFilled: 'stop_filled',
+  stopSlash: 'stop_slash',
+  storage: 'storage',
+  string: 'string',
+  submodule: 'submodule',
+  sun: 'sun',
+  swatchInput: 'swatch_input',
+  // Undocumented on purpose. Has an extra stroke for EuiColorPicker
+  symlink: 'symlink',
+  tableDensityCompact: 'table_density_compact',
+  tableDensityExpanded: 'table_density_expanded',
+  tableDensityNormal: 'table_density_normal',
+  tableOfContents: 'tableOfContents',
+  tag: 'tag',
+  tear: 'tear',
+  temperature: 'temperature',
+  timeline: 'timeline',
+  timelionApp: 'app_timelion',
+  timeRefresh: 'timeRefresh',
+  timeslider: 'timeslider',
+  training: 'training',
+  trash: 'trash',
+  unfold: 'unfold',
+  unlink: 'unlink',
+  upgradeAssistantApp: 'app_upgrade_assistant',
+  uptimeApp: 'app_uptime',
+  user: 'user',
+  userAvatar: 'userAvatar',
+  users: 'users',
+  usersRolesApp: 'app_users_roles',
+  vector: 'vector',
+  videoPlayer: 'videoPlayer',
+  visArea: 'vis_area',
+  visAreaStacked: 'vis_area_stacked',
+  visBarHorizontal: 'vis_bar_horizontal',
+  visBarHorizontalStacked: 'vis_bar_horizontal_stacked',
+  visBarVertical: 'vis_bar_vertical',
+  visBarVerticalStacked: 'vis_bar_vertical_stacked',
+  visGauge: 'vis_gauge',
+  visGoal: 'vis_goal',
+  visLine: 'vis_line',
+  visMapCoordinate: 'vis_map_coordinate',
+  visMapRegion: 'vis_map_region',
+  visMetric: 'vis_metric',
+  visPie: 'vis_pie',
+  visTable: 'vis_table',
+  visTagCloud: 'vis_tag_cloud',
+  visText: 'vis_text',
+  visTimelion: 'vis_timelion',
+  visVega: 'vis_vega',
+  visVisualBuilder: 'vis_visual_builder',
+  visualizeApp: 'app_visualize',
+  watchesApp: 'app_watches',
+  wordWrap: 'wordWrap',
+  wordWrapDisabled: 'wordWrapDisabled',
+  workplaceSearchApp: 'app_workplace_search',
+  wrench: 'wrench',
+  // Token Icon Imports
+  tokenClass: 'tokenClass',
+  tokenProperty: 'tokenProperty',
+  tokenEnum: 'tokenEnum',
+  tokenVariable: 'tokenVariable',
+  tokenMethod: 'tokenMethod',
+  tokenAnnotation: 'tokenAnnotation',
+  tokenException: 'tokenException',
+  tokenInterface: 'tokenInterface',
+  tokenParameter: 'tokenParameter',
+  tokenField: 'tokenField',
+  tokenElement: 'tokenElement',
+  tokenFunction: 'tokenFunction',
+  tokenBoolean: 'tokenBoolean',
+  tokenString: 'tokenString',
+  tokenArray: 'tokenArray',
+  tokenNumber: 'tokenNumber',
+  tokenConstant: 'tokenConstant',
+  tokenObject: 'tokenObject',
+  tokenEvent: 'tokenEvent',
+  tokenKey: 'tokenKey',
+  tokenNull: 'tokenNull',
+  tokenStruct: 'tokenStruct',
+  tokenPackage: 'tokenPackage',
+  tokenOperator: 'tokenOperator',
+  tokenEnumMember: 'tokenEnumMember',
+  tokenRepo: 'tokenRepo',
+  tokenSymbol: 'tokenSymbol',
+  tokenFile: 'tokenFile',
+  tokenModule: 'tokenModule',
+  tokenNamespace: 'tokenNamespace',
+  tokenDate: 'tokenDate',
+  tokenIP: 'tokenIP',
+  tokenNested: 'tokenNested',
+  tokenAlias: 'tokenAlias',
+  tokenShape: 'tokenShape',
+  tokenGeo: 'tokenGeo',
+  tokenRange: 'tokenRange',
+  tokenBinary: 'tokenBinary',
+  tokenJoin: 'tokenJoin',
+  tokenPercolator: 'tokenPercolator',
+  tokenFlattened: 'tokenFlattened',
+  tokenRankFeature: 'tokenRankFeature',
+  tokenRankFeatures: 'tokenRankFeatures',
+  tokenKeyword: 'tokenKeyword',
+  tokenTag: 'tokenTag',
+  tokenCompletionSuggester: 'tokenCompletionSuggester',
+  tokenDenseVector: 'tokenDenseVector',
+  tokenText: 'tokenText',
+  tokenTokenCount: 'tokenTokenCount',
+  tokenSearchType: 'tokenSearchType',
+  tokenHistogram: 'tokenHistogram'
+};

package/optimize/es/components/icon/named_colors.js

@@ -5,18 +5,7 @@
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-export var colorToClassMap = {
-  default: null,
-  primary: 'euiIcon--primary',
-  success: 'euiIcon--success',
-  accent: 'euiIcon--accent',
-  warning: 'euiIcon--warning',
-  danger: 'euiIcon--danger',
-  text: 'euiIcon--text',
-  subdued: 'euiIcon--subdued',
-  ghost: 'euiIcon--ghost',
-  inherit: 'euiIcon--inherit'
-};
+export var COLORS = ['default', 'primary', 'success', 'accent', 'warning', 'danger', 'text', 'subdued', 'ghost', 'inherit'];
 export function isNamedColor(name) {
-  return colorToClassMap.hasOwnProperty(name);
+  return COLORS.includes(name);
 }

package/optimize/es/components/panel/panel.js

@@ -61,7 +61,8 @@ export var EuiPanel = function EuiPanel(_ref) {
   if (rest.onClick && element !== 'div') {
     return ___EmotionJSX("button", _extends({
       ref: panelRef,
-      className: classes
+      className: classes,
+      css: cssStyles
     }, rest), children);
   }
 

package/optimize/es/components/progress/progress.js

@@ -13,64 +13,13 @@ import React, { Fragment } from 'react';
 import classNames from 'classnames';
 import { EuiI18n } from '../i18n';
 import { EuiInnerText } from '../inner_text';
-import { keysOf } from '../common';
 import { isNil } from '../../services/predicate';
+import { useEuiTheme, makeHighContrastColor } from '../../services';
+import { euiProgressStyles, euiProgressDataStyles, euiProgressLabelStyles, euiProgressValueTextStyles } from './progress.styles';
 import { jsx as ___EmotionJSX } from "@emotion/react";
-var sizeToClassNameMap = {
-  xs: 'euiProgress--xs',
-  s: 'euiProgress--s',
-  m: 'euiProgress--m',
-  l: 'euiProgress--l'
-};
-export var SIZES = keysOf(sizeToClassNameMap);
-var colorToClassNameMap = {
-  primary: 'euiProgress--primary',
-  success: 'euiProgress--success',
-  warning: 'euiProgress--warning',
-  danger: 'euiProgress--danger',
-  subdued: 'euiProgress--subdued',
-  accent: 'euiProgress--accent',
-  vis0: 'euiProgress--vis0',
-  vis1: 'euiProgress--vis1',
-  vis2: 'euiProgress--vis2',
-  vis3: 'euiProgress--vis3',
-  vis4: 'euiProgress--vis4',
-  vis5: 'euiProgress--vis5',
-  vis6: 'euiProgress--vis6',
-  vis7: 'euiProgress--vis7',
-  vis8: 'euiProgress--vis8',
-  vis9: 'euiProgress--vis9'
-};
-export var COLORS = keysOf(colorToClassNameMap);
-
-function isNamedColor(name) {
-  return colorToClassNameMap.hasOwnProperty(name);
-}
-
-var dataColorToClassNameMap = {
-  primary: 'euiProgress__data--primary',
-  success: 'euiProgress__data--success',
-  warning: 'euiProgress__data--warning',
-  danger: 'euiProgress__data--danger',
-  subdued: 'euiProgress__data--subdued',
-  accent: 'euiProgress__data--accent',
-  vis0: 'euiProgress__data--vis0',
-  vis1: 'euiProgress__data--vis1',
-  vis2: 'euiProgress__data--vis2',
-  vis3: 'euiProgress__data--vis3',
-  vis4: 'euiProgress__data--vis4',
-  vis5: 'euiProgress__data--vis5',
-  vis6: 'euiProgress__data--vis6',
-  vis7: 'euiProgress__data--vis7',
-  vis8: 'euiProgress__data--vis8',
-  vis9: 'euiProgress__data--vis9'
-};
-var positionsToClassNameMap = {
-  fixed: 'euiProgress--fixed',
-  absolute: 'euiProgress--absolute',
-  static: ''
-};
-export var POSITIONS = keysOf(positionsToClassNameMap);
+export var SIZES = ['xs', 's', 'm', 'l'];
+export var COLORS = ['primary', 'success', 'warning', 'danger', 'subdued', 'accent', 'vis0', 'vis1', 'vis2', 'vis3', 'vis4', 'vis5', 'vis6', 'vis7', 'vis8', 'vis9'];
+export var POSITIONS = ['fixed', 'absolute', 'static'];
 export var EuiProgress = function EuiProgress(_ref) {
   var className = _ref.className,
       _ref$color = _ref.color,
@@ -88,30 +37,23 @@ export var EuiProgress = function EuiProgress(_ref) {
       rest = _objectWithoutProperties(_ref, _excluded);
 
   var determinate = !isNil(max);
-  var colorClass = null;
-  var dataColorClass = null;
-  var optionalCustomStyles = null;
-
-  if (color) {
-    if (isNamedColor(color)) {
-      colorClass = colorToClassNameMap[color];
-      dataColorClass = dataColorToClassNameMap[color];
-    } else {
-      optionalCustomStyles = {
-        color: color
-      };
-      colorClass = 'euiProgress--customColor';
-    }
-  }
-
-  var classes = classNames('euiProgress', {
-    'euiProgress--indeterminate': !determinate,
-    'euiProgress--native': determinate
-  }, sizeToClassNameMap[size], colorClass, positionsToClassNameMap[position], className);
-  var dataClasses = classNames('euiProgress__data', {
-    'euiProgress__data--l': size === 'l'
-  }, dataColorClass);
-  var labelClasses = classNames('euiProgress__label', labelProps && labelProps.className);
+  var isNamedColor = COLORS.includes(color);
+  var euiTheme = useEuiTheme();
+  var customColorStyles = !isNamedColor ? {
+    color: color
+  } : {};
+  var customTextColorStyles = !isNamedColor ? {
+    color: makeHighContrastColor(color)(euiTheme.euiTheme)
+  } : {};
+  var styles = euiProgressStyles(euiTheme, determinate);
+  var cssStyles = [styles.euiProgress, determinate && styles.native, !determinate && styles.indeterminate, styles[size], styles[position], isNamedColor ? styles[color] : styles.customColor];
+  var dataStyles = euiProgressDataStyles(euiTheme);
+  var dataCssStyles = [dataStyles.euiProgress__data, size === 'l' && dataStyles[size]];
+  var labelCssStyles = [euiProgressLabelStyles.euiProgress__label];
+  var valueTextStyles = euiProgressValueTextStyles(euiTheme);
+  var valueTextCssStyles = [valueTextStyles.euiProgress__valueText, isNamedColor ? valueTextStyles[color] : styles.customColor];
+  var classes = classNames('euiProgress', className);
+  var labelClasses = classNames('euiProgress__label', labelProps === null || labelProps === void 0 ? void 0 : labelProps.className);
   var valueRender;
 
   if (valueText === true) {
@@ -132,31 +74,36 @@ export var EuiProgress = function EuiProgress(_ref) {
 
   if (determinate) {
     return ___EmotionJSX(Fragment, null, label || valueText ? ___EmotionJSX("div", {
-      className: dataClasses
+      css: dataCssStyles,
+      className: "euiProgress__data"
     }, label && ___EmotionJSX(EuiInnerText, null, function (ref, innerText) {
       return ___EmotionJSX("span", _extends({
         title: innerText,
         ref: ref
       }, labelProps, {
+        css: labelCssStyles,
         className: labelClasses
       }), label);
     }), valueRender && ___EmotionJSX(EuiInnerText, null, function (ref, innerText) {
       return ___EmotionJSX("span", {
         title: innerText,
         ref: ref,
-        style: optionalCustomStyles,
+        style: customTextColorStyles,
+        css: valueTextCssStyles,
         className: "euiProgress__valueText"
       }, valueRender);
     })) : undefined, ___EmotionJSX("progress", _extends({
+      css: cssStyles,
       className: classes,
-      style: optionalCustomStyles,
+      style: customColorStyles,
       max: max,
       value: value,
       "aria-hidden": label && valueText ? true : false
     }, rest)));
   } else {
     return ___EmotionJSX("div", _extends({
-      style: optionalCustomStyles,
+      css: cssStyles,
+      style: customColorStyles,
       className: classes
     }, rest));
   }