Deleted bar, progress and progressbar directives (#33585) (#33764)

* Deleted
- progress
- bar
- progressbar

Changed
 - implementation of Discover > string field > proressbar to use EUI progressbar and tooltip.

src/legacy/core_plugins/kibana/public/discover/components/field_chooser/_field_chooser.scss

@@ -2,3 +2,10 @@
   color: $euiColorMediumShade;
   margin-left: $euiSizeS !important;
 }
+
+/*
+  Fixes EUI known issue https://github.com/elastic/eui/issues/1749
+*/
+.dscProgressBarTooltip__anchor {
+  display: block;
+}

src/legacy/core_plugins/kibana/public/discover/components/field_chooser/discover_field.js

@@ -22,6 +22,7 @@ import html from './discover_field.html';
 import _ from 'lodash';
 import 'ui/directives/css_truncate';
 import 'ui/directives/field_name';
+import './string_progress_bar';
 import detailsHtml from './lib/detail_views/string.html';
 import { uiModules } from 'ui/modules';
 const app = uiModules.get('apps/discover');

src/legacy/core_plugins/kibana/public/discover/components/field_chooser/lib/detail_views/string.html

@@ -77,15 +77,10 @@
             </button>
           </div>
         </div>
-        <kbn-tooltip text="{{::bucket.count}}" placement="right" append-to-body="1">
-          <progressbar
-            value="bucket.percent"
-            max="100"
-            animate="false"
-          >
-            <span class="dscFieldDetails__progress">{{bucket.percent}}%</span>
-          </progressbar>
-        </kbn-tooltip>
+        <string-field-progress-bar
+          percent="{{bucket.percent}}"
+          count="{{::bucket.count}}"        
+        ></string-field-progress-bar>
       </div>
     </div>
   </div>

src/legacy/core_plugins/kibana/public/discover/components/field_chooser/string_progress_bar.js

@@ -0,0 +1,70 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied.  See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+
+import { wrapInI18nContext } from 'ui/i18n';
+import { uiModules } from 'ui/modules';
+
+import React from 'react';
+
+import {
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiProgress,
+  EuiText,
+  EuiToolTip,
+} from '@elastic/eui';
+
+const module = uiModules.get('discover/field_chooser');
+
+function StringFieldProgressBar(props) {
+  return (
+    <EuiToolTip
+      anchorClassName="dscProgressBarTooltip__anchor"
+      content={props.count}
+      delay="regular"
+      position="right"
+    >
+      <EuiFlexGroup
+        alignItems="center"
+      >
+        <EuiFlexItem>
+          <EuiProgress
+            value={props.percent}
+            max={100}
+            color="secondary"
+            aria-labelledby="CanvasAssetManagerLabel"
+            size="l"
+          />
+        </EuiFlexItem>
+        <EuiFlexItem grow={false}>
+          <EuiText
+            size="xs"
+          >
+            {props.percent}%
+          </EuiText>
+        </EuiFlexItem>
+      </EuiFlexGroup>
+    </EuiToolTip>
+  );
+}
+
+module.directive('stringFieldProgressBar', function (reactDirective) {
+  return reactDirective(wrapInI18nContext(StringFieldProgressBar));
+});

src/legacy/ui/public/angular-bootstrap/index.js

@@ -26,22 +26,17 @@ angular.module('ui.bootstrap', [
   'ui.bootstrap.bindHtml',
   'ui.bootstrap.modal',
   'ui.bootstrap.tooltip',
-  'ui.bootstrap.progressbar',
 ]);
 
 angular.module('ui.bootstrap.tpls', [
   'template/modal/backdrop.html',
-  'template/modal/window.html',	
-  'template/tooltip/tooltip-html-unsafe-popup.html',	
-  'template/tooltip/tooltip-popup.html',	
-  'template/progressbar/bar.html',	
-  'template/progressbar/progress.html',
-  'template/progressbar/progressbar.html',
+  'template/modal/window.html',
+  'template/tooltip/tooltip-html-unsafe-popup.html',
+  'template/tooltip/tooltip-popup.html',
 ]);
 
 import './bindHtml/bindHtml';
 import './modal/modal';
-import './progressbar/progressbar';
 import './tooltip/tooltip';
 import './transition/transition';
 
@@ -68,21 +63,3 @@ import tooltipPopup from './tooltip/tooltip-popup.html';
 angular.module('template/tooltip/tooltip-popup.html', []).run(['$templateCache', function($templateCache) {	
  $templateCache.put('template/tooltip/tooltip-popup.html', tooltipPopup);	
 }]);
-
-import bar from './progressbar/bar.html';	
-
- angular.module('template/progressbar/bar.html', []).run(['$templateCache', function($templateCache) {	
-  $templateCache.put('template/progressbar/bar.html', bar);	
-}]);	
-
-import progress from './progressbar/progress.html';
-
-angular.module('template/progressbar/progress.html', []).run(['$templateCache', function($templateCache) {
-  $templateCache.put('template/progressbar/progress.html', progress);
-}]);
-
-import progressbar from './progressbar/progressbar.html';
-
-angular.module('template/progressbar/progressbar.html', []).run(['$templateCache', function($templateCache) {
-  $templateCache.put('template/progressbar/progressbar.html', progressbar);
-}]);