elastic · snide · Jan 29, 2018 · Jan 26, 2018 · Jan 26, 2018 · Jan 26, 2018
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,6 +1,6 @@
 # [`master`](https://github.com/elastic/eui/tree/master)
 
-No public interface changes since `0.0.15`.
+- Machine learning create jobs icon set. ((338)[https://github.com/elastic/eui/pull/338])
 
 # [`0.0.15`](https://github.com/elastic/eui/tree/v0.0.15)
 

diff --git a/src-docs/src/views/icon/icon_example.js b/src-docs/src/views/icon/icon_example.js
@@ -19,6 +19,10 @@ import Apps from './apps';
 const appsSource = require('!!raw-loader!./apps');
 const appsHtml = renderToHtml(Apps);
 
+import Ml from './ml';
+const mlSource = require('!!raw-loader!./ml');
+const mlHtml = renderToHtml(Ml);
+
 import Logos from './logos';
 const logosSource = require('!!raw-loader!./logos');
 const logosHtml = renderToHtml(Logos);
@@ -50,7 +54,7 @@ export const IconExample = {
  <div>
  <p>
  <EuiCode>EuiIcon</EuiCode> can build out an icon from our SVG
- icon library. Icons can be resized and recolored (through a
+ icon library. Icons are resized and recolored (through a
  CSS <EuiCode>Fill</EuiCode>) decleration.
  </p>
  <p>
@@ -86,6 +90,22 @@ export const IconExample = {
  </p>
  ),
  demo: <Apps />,
+ }, {
+ title: 'Machine learning icons',
+ source: [{
+ type: GuideSectionTypes.JS,
+ code: mlSource,
+ }, {
+ type: GuideSectionTypes.HTML,
+ code: mlHtml,
+ }],
+ text: (
+ <p>
+ ML has some specific icons for job creation.
+ Again, these are made for <EuiCode>32x32</EuiCode>.
+ </p>
+ ),
+ demo: <Ml />,
  }, {
  title: 'Logos',
  source: [{
@@ -151,4 +171,3 @@ export const IconExample = {
  demo: <Accessibility />,
  }],
 };
-
diff --git a/src-docs/src/views/icon/ml.js b/src-docs/src/views/icon/ml.js
@@ -0,0 +1,41 @@
+import React from 'react';
+
+import {
+ EuiFlexGrid,
+ EuiFlexItem,
+ EuiIcon,
+ EuiPanel,
+ EuiText,
+} from '../../../../src/components';
+
+const iconTypes = [
+ 'dataVisualizer',
+ 'createAdvancedJob',
+ 'createMultiMetricJob',
+ 'createPopulationJob',
+ 'createSingleMetricJob',
+];
+
+export default () => (
+ <EuiFlexGrid columns={4}>
+ {
+ iconTypes.map(iconType => (
+ <EuiFlexItem
+ className="guideDemo__icon"
+ key={iconType}
+ style={{ width: '200px' }}
+ >
+ <EuiPanel>
+ <EuiIcon
+ type={iconType}
+ size="xl"
+ />
+ <EuiText size="s">
+ <p>{iconType}</p>
+ </EuiText>
+ </EuiPanel>
+ </EuiFlexItem>
+ ))
+ }
+ </EuiFlexGrid>
+);
diff --git a/src/components/icon/__snapshots__/icon.test.js.snap b/src/components/icon/__snapshots__/icon.test.js.snap
@@ -794,6 +794,175 @@ exports[`EuiIcon renders type copyClipboard 1`] = `
 </svg>
 `;
 
+exports[`EuiIcon renders type createAdvancedJob 1`] = `
+<svg
+ class="euiIcon euiIcon--medium"
+ height="32"
+ viewBox="0 0 32 32"
+ width="32"
+ xmlns="http://www.w3.org/2000/svg"
+>
+ <g
+ fill="none"
+ >
+ <path
+ d="M16 30.363a1.106 1.106 0 0 1-1.106-1.106V2.743a1.106 1.106 0 0 1 2.212 0v26.514A1.106 1.106 0 0 1 16 30.363zm10.67 0a1.106 1.106 0 0 1-1.07-1.106V2.743a1.106 1.106 0 0 1 2.213 0v26.514a1.106 1.106 0 0 1-1.143 1.106zm-21.34 0a1.106 1.106 0 0 1-1.106-1.106V10.176a1.106 1.106 0 0 1 2.213 0v19.081c0 .611-.496 1.106-1.107 1.106z"
+ fill="#3EBEB0"
+ />
+ <circle
+ cx="5.33"
+ cy="5.33"
+ fill="#07A5DE"
+ r="5.33"
+ />
+ <path
+ d="M5.33 9.07c-.61 0-1.106.495-1.106 1.106v.375a5.54 5.54 0 0 0 1.106.119c.36-.005.718-.045 1.07-.12v-.374c0-.597-.473-1.087-1.07-1.106z"
+ fill="#227991"
+ />
+ <path
+ d="M4.571 2.88v1.344a.375.375 0 0 1-.347.347H2.88a.75.75 0 0 0-.759.613.731.731 0 0 0 .722.86h1.381c.191.009.343.164.347.356v1.38a.759.759 0 0 0 .613.769.74.74 0 0 0 .86-.732V6.4c0-.202.163-.366.365-.366h1.372c.352.018.67-.21.768-.548a.74.74 0 0 0-.732-.915H6.4a.366.366 0 0 1-.366-.374V2.843a.731.731 0 0 0-.86-.722.75.75 0 0 0-.603.759z"
+ fill="#FFF"
+ />
+ <circle
+ cx="16"
+ cy="21.669"
+ fill="#07A5DE"
+ r="5.33"
+ />
+ <path
+ d="M14.894 16.457V26.88a5.211 5.211 0 0 0 2.212 0V16.457a5.211 5.211 0 0 0-2.212 0z"
+ fill="#227991"
+ />
+ <circle
+ cx="26.67"
+ cy="12.91"
+ fill="#07A5DE"
+ r="5.33"
+ />
+ <path
+ d="M25.6 7.698V18.13c.364.077.734.117 1.106.12a5.54 5.54 0 0 0 1.107-.12V7.698a5.54 5.54 0 0 0-1.107-.119 5.486 5.486 0 0 0-1.106.12z"
+ fill="#227991"
+ />
+ </g>
+</svg>
+`;
+
+exports[`EuiIcon renders type createMultiMetricJob 1`] = `
+<svg
+ class="euiIcon euiIcon--medium"
+ height="32"
+ viewBox="0 0 32 32"
+ width="32"
+ xmlns="http://www.w3.org/2000/svg"
+>
+ <g
+ fill="none"
+ >
+ <circle
+ cx="26.002"
+ cy="5.998"
+ fill="#3EBEB0"
+ r="5.998"
+ />
+ <circle
+ cx="5.998"
+ cy="5.998"
+ fill="#3EBEB0"
+ r="5.998"
+ />
+ <circle
+ cx="26.002"
+ cy="26.002"
+ fill="#3EBEB0"
+ r="5.998"
+ />
+ <circle
+ cx="5.998"
+ cy="26.002"
+ fill="#3EBEB0"
+ r="5.998"
+ />
+ <path
+ d="M16 1.829c-7.812.01-14.138 6.347-14.135 14.159C1.87 23.8 8.2 30.13 16.012 30.135c7.812.003 14.15-6.323 14.16-14.135A14.162 14.162 0 0 0 16 1.829zm5.074 15.652h-2.788c-.42 0-.76.34-.76.759v2.816a1.5 1.5 0 0 1-1.755 1.481 1.563 1.563 0 0 1-1.27-1.508v-2.743c0-.42-.34-.76-.76-.76h-2.77a1.5 1.5 0 0 1-1.48-1.755 1.563 1.563 0 0 1 1.48-1.27h2.743c.42 0 .76-.34.76-.76v-2.77a1.5 1.5 0 0 1 1.755-1.48 1.563 1.563 0 0 1 1.27 1.48v2.743c0 .42.34.76.76.76H21a1.563 1.563 0 0 1 1.564 1.243 1.5 1.5 0 0 1-1.49 1.782v-.018z"
+ fill="#07A5DE"
+ />
+ <path
+ d="M29.257 20.965a5.934 5.934 0 0 0-3.236-.96 5.998 5.998 0 0 0-5.998 5.997 5.934 5.934 0 0 0 .942 3.255 14.208 14.208 0 0 0 8.292-8.292zm-18.222 8.292c.611-.968.928-2.092.915-3.236a5.998 5.998 0 0 0-5.998-5.998 5.934 5.934 0 0 0-3.21.942 14.208 14.208 0 0 0 8.293 8.292zm9.93-26.514a5.934 5.934 0 0 0-.96 3.236 5.998 5.998 0 0 0 5.997 5.998 5.934 5.934 0 0 0 3.237-.914 14.208 14.208 0 0 0-8.274-8.32zM2.743 11.035c.968.611 2.092.928 3.236.915a5.998 5.998 0 0 0 5.998-5.998 5.934 5.934 0 0 0-.914-3.237 14.208 14.208 0 0 0-8.32 8.32z"
+ fill="#227991"
+ />
+ </g>
+</svg>
+`;
+
+exports[`EuiIcon renders type createPopulationJob 1`] = `
+<svg
+ class="euiIcon euiIcon--medium"
+ height="32"
+ viewBox="0 0 32 32"
+ width="32"
+ xmlns="http://www.w3.org/2000/svg"
+>
+ <g
+ fill="none"
+ transform="translate(1)"
+ >
+ <circle
+ cx="15.086"
+ cy="18.578"
+ fill="#3EBEB0"
+ r="4.416"
+ />
+ <circle
+ cx="25.463"
+ cy="18.578"
+ fill="#3EBEB0"
+ r="4.416"
+ />
+ <circle
+ cx="4.709"
+ cy="18.578"
+ fill="#3EBEB0"
+ r="4.416"
+ />
+ <circle
+ cx="9.893"
+ cy="9.609"
+ fill="#3EBEB0"
+ r="4.416"
+ />
+ <circle
+ cx="20.279"
+ cy="27.575"
+ fill="#3EBEB0"
+ r="4.416"
+ />
+ <path
+ d="M20.279 0a9.61 9.61 0 1 0-.018 19.218A9.61 9.61 0 0 0 20.279 0zm3.401 10.533h-1.893a.512.512 0 0 0-.502.512v1.892a1.006 1.006 0 0 1-1.17.988 1.033 1.033 0 0 1-.842-1.043v-1.828a.503.503 0 0 0-.503-.512H16.87a1.006 1.006 0 0 1-.997-1.18 1.042 1.042 0 0 1 1.051-.832h1.829a.503.503 0 0 0 .503-.512V6.117a1.006 1.006 0 0 1 1.18-.988c.497.094.854.536.84 1.042V8c0 .28.224.507.503.512h1.829c.506-.015.95.336 1.051.832a1.006 1.006 0 0 1-.978 1.189z"
+ fill="#07A5DE"
+ />
+ <path
+ d="M28.142 15.095a4.389 4.389 0 0 0-7.113 3.483c.004.2.022.398.054.595a9.573 9.573 0 0 0 7.059-4.078zm-8.64 3.483a4.398 4.398 0 0 0-7.095-3.483 9.573 9.573 0 0 0 7.03 4.105c.037-.205.059-.413.065-.622zM11.593 5.541a9.527 9.527 0 0 0 0 8.146 4.416 4.416 0 0 0 0-8.146z"
+ fill="#227991"
+ />
+ </g>
+</svg>
+`;
+
+exports[`EuiIcon renders type createSingleMetricJob 1`] = `
+<svg
+ class="euiIcon euiIcon--medium"
+ height="32"
+ viewBox="0 0 32 32"
+ width="32"
+ xmlns="http://www.w3.org/2000/svg"
+>
+ <path
+ d="M16 .184C7.265.184.184 7.265.184 16S7.265 31.816 16 31.816 31.816 24.735 31.816 16C31.806 7.27 24.73.195 16 .184zm5.673 17.455H18.52a.844.844 0 0 0-.843.843v3.152a1.687 1.687 0 0 1-1.94 1.658 1.745 1.745 0 0 1-1.396-1.755v-3.016a.844.844 0 0 0-.844-.843h-3.17a1.687 1.687 0 0 1-1.659-1.94 1.745 1.745 0 0 1 1.755-1.396h3.055a.844.844 0 0 0 .843-.844v-3.17a1.687 1.687 0 0 1 1.94-1.659c.83.17 1.418.909 1.396 1.755v3.055c0 .466.378.843.844.843h3.054a1.745 1.745 0 0 1 1.756 1.397 1.687 1.687 0 0 1-1.64 1.959v-.04z"
+ fill="#07A5DE"
+ />
+</svg>
+`;
+
 exports[`EuiIcon renders type cross 1`] = `
 <svg
  class="euiIcon euiIcon--medium"
@@ -860,6 +1029,41 @@ exports[`EuiIcon renders type dashboardApp 1`] = `
 </svg>
 `;
 
+exports[`EuiIcon renders type dataVisualizer 1`] = `
+<svg
+ class="euiIcon euiIcon--medium"
+ height="32"
+ viewBox="0 0 32 32"
+ width="32"
+ xmlns="http://www.w3.org/2000/svg"
+>
+ <g
+ fill="none"
+ >
+ <circle
+ cx="19.218"
+ cy="19.218"
+ fill="#3EBEB0"
+ r="7.077"
+ />
+ <circle
+ cx="12.782"
+ cy="12.782"
+ fill="#07A5DE"
+ r="7.077"
+ />
+ <path
+ d="M14.217 14.217a7.03 7.03 0 0 0-2.048 5.614 7.086 7.086 0 0 0 7.662-7.662 7.03 7.03 0 0 0-5.614 2.048z"
+ fill="#227991"
+ />
+ <path
+ d="M1.829 9.975A1.106 1.106 0 0 1 .722 8.869v-7.04c0-.611.496-1.107 1.107-1.107h7.04a1.106 1.106 0 1 1 0 2.213H2.935v5.934c0 .61-.495 1.106-1.106 1.106zm7.04 21.303h-7.04A1.106 1.106 0 0 1 .722 30.17v-7.04a1.106 1.106 0 1 1 2.213 0v5.934h5.934a1.106 1.106 0 1 1 0 2.213zm21.302 0h-7.04a1.106 1.106 0 1 1 0-2.213h5.934v-5.934a1.106 1.106 0 1 1 2.213 0v7.04c0 .611-.496 1.107-1.107 1.107zm0-21.303a1.106 1.106 0 0 1-1.106-1.106V2.935h-5.934a1.106 1.106 0 1 1 0-2.213h7.04c.611 0 1.107.496 1.107 1.107v7.04c0 .61-.496 1.106-1.107 1.106z"
+ fill="#3EBEB0"
+ />
+ </g>
+</svg>
+`;
+
 exports[`EuiIcon renders type devToolsApp 1`] = `
 <svg
  class="euiIcon euiIcon--medium"

diff --git a/src/components/icon/assets/ml_create_advanced_job.svg b/src/components/icon/assets/ml_create_advanced_job.svg
diff --git a/src/components/icon/assets/ml_create_multi_metric_job.svg b/src/components/icon/assets/ml_create_multi_metric_job.svg
diff --git a/src/components/icon/assets/ml_create_population_job.svg b/src/components/icon/assets/ml_create_population_job.svg