[EuiIcon] Added fleetApp and agentApp icons (#4989)

* [EuiIcon] Added `fleetApp` and `agentApp` icons * cl
elastic · Jul 29, 2021 · 25cd298 · 25cd298
1 parent 8467f00
commit 25cd298
Show file tree

Hide file tree

Showing 8 changed files with 135 additions and 19 deletions.
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 `36.1.0`.
+- Added `fleetApp` and `agentApp` icons ([#4989](https://github.com/elastic/eui/pull/4989))
 
 ## [`36.1.0`](https://github.com/elastic/eui/tree/v36.1.0)
 

diff --git a/src-docs/src/views/icon/apps.js b/src-docs/src/views/icon/apps.js
@@ -13,6 +13,7 @@ import {
 const iconTypes = [
   'addDataApp',
   'advancedSettingsApp',
+  'agentApp',
   'apmApp',
   'appSearchApp',
   'auditbeatApp',
@@ -25,19 +26,20 @@ const iconTypes = [
   'discoverApp',
   'emsApp',
   'filebeatApp',
+  'fleetApp',
   'gisApp',
   'graphApp',
   'grokApp',
   'heartbeatApp',
   'indexManagementApp',
   'indexPatternApp',
   'indexRollupApp',
-  'metricsApp',
   'lensApp',
   'logsApp',
   'machineLearningApp',
   'managementApp',
   'metricbeatApp',
+  'metricsApp',
   'monitoringApp',
   'notebookApp',
   'packetbeatApp',

diff --git a/src/components/icon/__snapshots__/icon.test.tsx.snap b/src/components/icon/__snapshots__/icon.test.tsx.snap
@@ -547,6 +547,27 @@ exports[`EuiIcon props type advancedSettingsApp is rendered 1`] = `
 </svg>
 `;
 
+exports[`EuiIcon props type agentApp is rendered 1`] = `
+<svg
+  aria-hidden="true"
+  class="euiIcon euiIcon--medium euiIcon--app euiIcon-isLoaded"
+  focusable="false"
+  height="32"
+  role="img"
+  viewBox="0 0 32 32"
+  width="32"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    d="M2.996 18.636L0 20.434v6.132l6 3.6 5-3 5 3 5-3 5 3 6-3.6v-6.132l-5-3v-5l-5-3v-5l-6-3.6-6 3.6v2.832l2 .033V5.566l4-2.4 4 2.4v3.868l-1.996 1.197 1 1.733L21 11.166l4 2.4v3.868l-4 2.4-2.257-1.354-.971 1.75L20 21.565v3.868l-4 2.4-4-2.4v-1.7l-2-.033v1.733l-4 2.4-4-2.4v-3.868l1.996-1.197-1-1.733zM22 25.434v-3.868l4-2.4 4 2.4v3.868l-4 2.4-4-2.4z"
+  />
+  <path
+    class="euiIcon__fillSecondary"
+    d="M11 22.166l-6-3.6v-6.132l6-3.6 6 3.6v6.132l-6 3.6zm4-4.732v-3.868l-4-2.4-4 2.4v3.868l4 2.4 4-2.4z"
+  />
+</svg>
+`;
+
 exports[`EuiIcon props type aggregate is rendered 1`] = `
 <svg
   aria-hidden="true"
@@ -2616,6 +2637,37 @@ exports[`EuiIcon props type flag is rendered 1`] = `
 </svg>
 `;
 
+exports[`EuiIcon props type fleetApp is rendered 1`] = `
+<svg
+  aria-hidden="true"
+  class="euiIcon euiIcon--medium euiIcon--app euiIcon-isLoaded"
+  focusable="false"
+  height="32"
+  role="img"
+  viewBox="0 0 32 32"
+  width="32"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    class="euiIcon__fillSecondary"
+    d="M21 2.82L16 .038 11 2.82v2.289l5-2.782 5 2.782v-2.29z"
+  />
+  <path
+    class="euiIcon__fillSecondary"
+    d="M21 7.282L16 4.5l-5 2.782V9.57l5-2.781 5 2.781V7.282z"
+  />
+  <path
+    d="M7 5.045L2 7.827v15.577l14 7.788 14-7.788V7.827l-5-2.782v2.289l3 1.669v13.225l-12 6.676-12-6.676V9.003l3-1.669V5.045z"
+  />
+  <path
+    class="euiIcon__fillSecondary"
+    clip-rule="evenodd"
+    d="M22 12.5L16 9l-6 3.5v7l6 3.5 6-3.5v-7zm-9.974 1.205L16 11.387l3.974 2.318v4.59L16 20.613l-3.974-2.318v-4.59z"
+    fill-rule="evenodd"
+  />
+</svg>
+`;
+
 exports[`EuiIcon props type fold is rendered 1`] = `
 <svg
   aria-hidden="true"

diff --git a/src/components/icon/assets/app_agent.js b/src/components/icon/assets/app_agent.js
@@ -0,0 +1,30 @@
+import * as React from 'react';
+
+const EuiIconAppAgent = ({ title, titleId, ...props }) => (
+  <svg
+    width={32}
+    height={32}
+    viewBox="0 0 32 32"
+    xmlns="http://www.w3.org/2000/svg"
+    aria-labelledby={titleId}
+    {...props}>
+    {title ? <title id={titleId}>{title}</title> : null}
+    <path
+      className="euiIcon__fillSecondary"
+      d="M21 2.82L16 .038 11 2.82v2.289l5-2.782 5 2.782v-2.29z"
+    />
+    <path
+      className="euiIcon__fillSecondary"
+      d="M21 7.282L16 4.5l-5 2.782V9.57l5-2.781 5 2.781V7.282z"
+    />
+    <path d="M7 5.045L2 7.827v15.577l14 7.788 14-7.788V7.827l-5-2.782v2.289l3 1.669v13.225l-12 6.676-12-6.676V9.003l3-1.669V5.045z" />
+    <path
+      className="euiIcon__fillSecondary"
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M22 12.5L16 9l-6 3.5v7l6 3.5 6-3.5v-7zm-9.974 1.205L16 11.387l3.974 2.318v4.59L16 20.613l-3.974-2.318v-4.59z"
+    />
+  </svg>
+);
+
+export const icon = EuiIconAppAgent;
diff --git a/src/components/icon/assets/app_agent.svg b/src/components/icon/assets/app_agent.svg
diff --git a/src/components/icon/assets/app_fleet.js b/src/components/icon/assets/app_fleet.js
@@ -0,0 +1,20 @@
+import * as React from 'react';
+
+const EuiIconAppFleet = ({ title, titleId, ...props }) => (
+  <svg
+    width={32}
+    height={32}
+    viewBox="0 0 32 32"
+    xmlns="http://www.w3.org/2000/svg"
+    aria-labelledby={titleId}
+    {...props}>
+    {title ? <title id={titleId}>{title}</title> : null}
+    <path d="M2.996 18.636L0 20.434v6.132l6 3.6 5-3 5 3 5-3 5 3 6-3.6v-6.132l-5-3v-5l-5-3v-5l-6-3.6-6 3.6v2.832l2 .033V5.566l4-2.4 4 2.4v3.868l-1.996 1.197 1 1.733L21 11.166l4 2.4v3.868l-4 2.4-2.257-1.354-.971 1.75L20 21.565v3.868l-4 2.4-4-2.4v-1.7l-2-.033v1.733l-4 2.4-4-2.4v-3.868l1.996-1.197-1-1.733zM22 25.434v-3.868l4-2.4 4 2.4v3.868l-4 2.4-4-2.4z" />
+    <path
+      className="euiIcon__fillSecondary"
+      d="M11 22.166l-6-3.6v-6.132l6-3.6 6 3.6v6.132l-6 3.6zm4-4.732v-3.868l-4-2.4-4 2.4v3.868l4 2.4 4-2.4z"
+    />
+  </svg>
+);
+
+export const icon = EuiIconAppFleet;
diff --git a/src/components/icon/assets/app_fleet.svg b/src/components/icon/assets/app_fleet.svg
diff --git a/src/components/icon/icon.tsx b/src/components/icon/icon.tsx
@@ -29,14 +29,15 @@ const typeToPathMap = {
   accessibility: 'accessibility',
   addDataApp: 'app_add_data',
   advancedSettingsApp: 'app_advanced_settings',
+  agentApp: 'app_fleet',
   aggregate: 'aggregate',
   alert: 'alert',
   analyzeEvent: 'analyze_event',
   annotation: 'annotation',
   apmApp: 'app_apm',
   apmTrace: 'apm_trace',
-  apps: 'apps',
   appSearchApp: 'app_app_search',
+  apps: 'apps',
   arrowDown: 'arrow_down',
   arrowLeft: 'arrow_left',
   arrowRight: 'arrow_right',
@@ -56,7 +57,6 @@ const typeToPathMap = {
   bullseye: 'bullseye',
   calendar: 'calendar',
   canvasApp: 'app_canvas',
-  codeApp: 'app_code',
   check: 'check',
   checkInCircleFilled: 'checkInCircleFilled',
   cheer: 'cheer',
@@ -65,6 +65,7 @@ const typeToPathMap = {
   cloudDrizzle: 'cloudDrizzle',
   cloudStormy: 'cloudStormy',
   cloudSunny: 'cloudSunny',
+  codeApp: 'app_code',
   color: 'color',
   compute: 'compute',
   console: 'console',
@@ -83,18 +84,18 @@ const typeToPathMap = {
   createSingleMetricJob: 'ml_create_single_metric_job',
   cross: 'cross',
   crossClusterReplicationApp: 'app_cross_cluster_replication',
-  crosshairs: 'crosshairs',
   crossInACircleFilled: 'crossInACircleFilled',
+  crosshairs: 'crosshairs',
   currency: 'currency',
   cut: 'cut',
   dashboardApp: 'app_dashboard',
-  database: 'database',
   dataVisualizer: 'ml_data_visualizer',
+  database: 'database',
   devToolsApp: 'app_devtools',
   discoverApp: 'app_discover',
   document: 'document',
-  documentation: 'documentation',
   documentEdit: 'documentEdit',
+  documentation: 'documentation',
   documents: 'documents',
   dot: 'dot',
   download: 'download',
@@ -108,9 +109,9 @@ const typeToPathMap = {
   editorDistributeVertical: 'editorDistributeVertical',
   editorHeading: 'editor_heading',
   editorItalic: 'editor_italic',
-  editorItemAlignLeft: 'editorItemAlignLeft',
   editorItemAlignBottom: 'editorItemAlignBottom',
   editorItemAlignCenter: 'editorItemAlignCenter',
+  editorItemAlignLeft: 'editorItemAlignLeft',
   editorItemAlignMiddle: 'editorItemAlignMiddle',
   editorItemAlignRight: 'editorItemAlignRight',
   editorItemAlignTop: 'editorItemAlignTop',
@@ -143,6 +144,7 @@ const typeToPathMap = {
   filebeatApp: 'app_filebeat',
   filter: 'filter',
   flag: 'flag',
+  fleetApp: 'app_agent',
   fold: 'fold',
   folderCheck: 'folder_check',
   folderClosed: 'folder_closed',
@@ -197,12 +199,11 @@ const typeToPathMap = {
   listAdd: 'list_add',
   lock: 'lock',
   lockOpen: 'lockOpen',
-  logsApp: 'app_logs',
+  logoAWS: 'logo_aws',
+  logoAWSMono: 'logo_aws_mono',
   logoAerospike: 'logo_aerospike',
   logoApache: 'logo_apache',
   logoAppSearch: 'logo_app_search',
-  logoAWS: 'logo_aws',
-  logoAWSMono: 'logo_aws_mono',
   logoAzure: 'logo_azure',
   logoAzureMono: 'logo_azure_mono',
   logoBeats: 'logo_beats',
@@ -216,8 +217,8 @@ const typeToPathMap = {
   logoDocker: 'logo_docker',
   logoDropwizard: 'logo_dropwizard',
   logoElastic: 'logo_elastic',
-  logoElasticsearch: 'logo_elasticsearch',
   logoElasticStack: 'logo_elastic_stack',
+  logoElasticsearch: 'logo_elasticsearch',
   logoEnterpriseSearch: 'logo_enterprise_search',
   logoEtcd: 'logo_etcd',
   logoGCP: 'logo_gcp',
@@ -255,6 +256,7 @@ const typeToPathMap = {
   logoWebhook: 'logo_webhook',
   logoWindows: 'logo_windows',
   logoWorkplaceSearch: 'logo_workplace_search',
+  logsApp: 'app_logs',
   logstashFilter: 'logstash_filter',
   logstashIf: 'logstash_if',
   logstashInput: 'logstash_input',
@@ -293,8 +295,8 @@ const typeToPathMap = {
   packetbeatApp: 'app_packetbeat',
   pageSelect: 'pageSelect',
   pagesSelect: 'pagesSelect',
-  partial: 'partial',
   paperClip: 'paper_clip',
+  partial: 'partial',
   pause: 'pause',
   pencil: 'pencil',
   percent: 'percent',
@@ -329,11 +331,11 @@ const typeToPathMap = {
   shard: 'shard',
   share: 'share',
   snowflake: 'snowflake',
-  sortable: 'sortable',
   sortDown: 'sort_down',
   sortLeft: 'sortLeft',
   sortRight: 'sortRight',
   sortUp: 'sort_up',
+  sortable: 'sortable',
   spacesApp: 'app_spaces',
   sqlApp: 'app_sql',
   starEmpty: 'star_empty',
@@ -353,10 +355,10 @@ const typeToPathMap = {
   submodule: 'submodule',
   swatchInput: 'swatch_input', // Undocumented on purpose. Has an extra stroke for EuiColorPicker
   symlink: 'symlink',
-  tableOfContents: 'tableOfContents',
-  tableDensityExpanded: 'table_density_expanded',
   tableDensityCompact: 'table_density_compact',
+  tableDensityExpanded: 'table_density_expanded',
   tableDensityNormal: 'table_density_normal',
+  tableOfContents: 'tableOfContents',
   tag: 'tag',
   tear: 'tear',
   temperature: 'temperature',
@@ -365,10 +367,10 @@ const typeToPathMap = {
   timeslider: 'timeslider',
   training: 'training',
   trash: 'trash',
-  upgradeAssistantApp: 'app_upgrade_assistant',
-  uptimeApp: 'app_uptime',
   unfold: 'unfold',
   unlink: 'unlink',
+  upgradeAssistantApp: 'app_upgrade_assistant',
+  uptimeApp: 'app_uptime',
   user: 'user',
   users: 'users',
   usersRolesApp: 'app_users_roles',
@@ -391,9 +393,9 @@ const typeToPathMap = {
   visTagCloud: 'vis_tag_cloud',
   visText: 'vis_text',
   visTimelion: 'vis_timelion',
-  visualizeApp: 'app_visualize',
   visVega: 'vis_vega',
   visVisualBuilder: 'vis_visual_builder',
+  visualizeApp: 'app_visualize',
   watchesApp: 'app_watches',
   wordWrap: 'wordWrap',
   wordWrapDisabled: 'wordWrapDisabled',