1. /**
    
  2.  * Copyright (c) Meta Platforms, Inc. and affiliates.
    
  3.  *
    
  4.  * This source code is licensed under the MIT license found in the
    
  5.  * LICENSE file in the root directory of this source tree.
    
  6.  *
    
  7.  * @flow
    
  8.  */
    
  9. 
    
  10. import * as React from 'react';
    
  11. import styles from './Icon.css';
    
  12. 
    
  13. export type IconType =
    
  14.   | 'arrow'
    
  15.   | 'bug'
    
  16.   | 'code'
    
  17.   | 'components'
    
  18.   | 'copy'
    
  19.   | 'error'
    
  20.   | 'facebook'
    
  21.   | 'flame-chart'
    
  22.   | 'profiler'
    
  23.   | 'ranked-chart'
    
  24.   | 'timeline'
    
  25.   | 'search'
    
  26.   | 'settings'
    
  27.   | 'store-as-global-variable'
    
  28.   | 'strict-mode-non-compliant'
    
  29.   | 'warning';
    
  30. 
    
  31. type Props = {
    
  32.   className?: string,
    
  33.   title?: string,
    
  34.   type: IconType,
    
  35. };
    
  36. 
    
  37. export default function Icon({
    
  38.   className = '',
    
  39.   title = '',
    
  40.   type,
    
  41. }: Props): React.Node {
    
  42.   let pathData = null;
    
  43.   switch (type) {
    
  44.     case 'arrow':
    
  45.       pathData = PATH_ARROW;
    
  46.       break;
    
  47.     case 'bug':
    
  48.       pathData = PATH_BUG;
    
  49.       break;
    
  50.     case 'code':
    
  51.       pathData = PATH_CODE;
    
  52.       break;
    
  53.     case 'components':
    
  54.       pathData = PATH_COMPONENTS;
    
  55.       break;
    
  56.     case 'copy':
    
  57.       pathData = PATH_COPY;
    
  58.       break;
    
  59.     case 'error':
    
  60.       pathData = PATH_ERROR;
    
  61.       break;
    
  62.     case 'facebook':
    
  63.       pathData = PATH_FACEBOOK;
    
  64.       break;
    
  65.     case 'flame-chart':
    
  66.       pathData = PATH_FLAME_CHART;
    
  67.       break;
    
  68.     case 'profiler':
    
  69.       pathData = PATH_PROFILER;
    
  70.       break;
    
  71.     case 'ranked-chart':
    
  72.       pathData = PATH_RANKED_CHART;
    
  73.       break;
    
  74.     case 'timeline':
    
  75.       pathData = PATH_SCHEDULING_PROFILER;
    
  76.       break;
    
  77.     case 'search':
    
  78.       pathData = PATH_SEARCH;
    
  79.       break;
    
  80.     case 'settings':
    
  81.       pathData = PATH_SETTINGS;
    
  82.       break;
    
  83.     case 'store-as-global-variable':
    
  84.       pathData = PATH_STORE_AS_GLOBAL_VARIABLE;
    
  85.       break;
    
  86.     case 'strict-mode-non-compliant':
    
  87.       pathData = PATH_STRICT_MODE_NON_COMPLIANT;
    
  88.       break;
    
  89.     case 'warning':
    
  90.       pathData = PATH_WARNING;
    
  91.       break;
    
  92.     default:
    
  93.       console.warn(`Unsupported type "${type}" specified for Icon`);
    
  94.       break;
    
  95.   }
    
  96. 
    
  97.   return (
    
  98.     <svg
    
  99.       xmlns="http://www.w3.org/2000/svg"
    
  100.       className={`${styles.Icon} ${className}`}
    
  101.       width="24"
    
  102.       height="24"
    
  103.       viewBox="0 0 24 24">
    
  104.       {title && <title>{title}</title>}
    
  105.       <path d="M0 0h24v24H0z" fill="none" />
    
  106.       <path fill="currentColor" d={pathData} />
    
  107.     </svg>
    
  108.   );
    
  109. }
    
  110. 
    
  111. const PATH_ARROW = 'M8 5v14l11-7z';
    
  112. 
    
  113. const PATH_BUG = `
    
  114.   M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49
    
  115.   0-.96.06-1.41.17L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09
    
  116.   1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21
    
  117.   5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6 8h-4v-2h4v2zm0-4h-4v-2h4v2z
    
  118. `;
    
  119. 
    
  120. const PATH_CODE = `
    
  121.   M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z
    
  122.   `;
    
  123. 
    
  124. const PATH_COMPONENTS =
    
  125.   'M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z';
    
  126. 
    
  127. const PATH_COPY = `
    
  128.   M3 13h2v-2H3v2zm0 4h2v-2H3v2zm2 4v-2H3a2 2 0 0 0 2 2zM3 9h2V7H3v2zm12 12h2v-2h-2v2zm4-18H9a2 2 0 0 0-2
    
  129.   2v10a2 2 0 0 0 2 2h10c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 12H9V5h10v10zm-8 6h2v-2h-2v2zm-4 0h2v-2H7v2z
    
  130. `;
    
  131. 
    
  132. const PATH_ERROR = `M16.971 0h-9.942l-7.029 7.029v9.941l7.029 7.03h9.941l7.03-7.029v-9.942l-7.029-7.029zm-1.402 16.945l-3.554-3.521-3.518 3.568-1.418-1.418 3.507-3.566-3.586-3.472 1.418-1.417 3.581 3.458 3.539-3.583 1.431 1.431-3.535 3.568 3.566 3.522-1.431 1.43z`;
    
  133. 
    
  134. const PATH_FACEBOOK = `
    
  135.   M22,12c0-5.52-4.48-10-10-10S2,6.48,2,12c0,4.84,3.44,8.87,8,9.8V15H8v-3h2V9.5C10,7.57,11.57,6,13.5,6H16v3h-2 c-0.55,0-1,0.45-1,1v2h3v3h-3v6.95C18.05,21.45,22,17.19,22,12z
    
  136. `;
    
  137. 
    
  138. const PATH_FLAME_CHART = `
    
  139.   M10.0650893,21.5040462 C7.14020814,20.6850349 5,18.0558698 5,14.9390244 C5,14.017627
    
  140.   5,9.81707317 7.83333333,7.37804878 C7.83333333,7.37804878 7.58333333,11.199187 10,
    
  141.   10.6300813 C11.125,10.326087 13.0062497,7.63043487 8.91666667,2.5 C14.1666667,3.06910569
    
  142.   19,9.32926829 19,14.9390244 C19,18.0558698 16.8597919,20.6850349 13.9349107,21.5040462
    
  143.   C14.454014,21.0118505 14.7765152,20.3233394 14.7765152,19.5613412 C14.7765152,17.2826087
    
  144.   12,15.0875871 12,15.0875871 C12,15.0875871 9.22348485,17.2826087 9.22348485,19.5613412
    
  145.   C9.22348485,20.3233394 9.54598603,21.0118505 10.0650893,21.5040462 Z M12.0833333,20.6514763
    
  146.   C11.3814715,20.6514763 10.8125,20.1226027 10.8125,19.4702042 C10.8125,18.6069669
    
  147.   12.0833333,16.9347829 12.0833333,16.9347829 C12.0833333,16.9347829 13.3541667,18.6069669
    
  148.   13.3541667,19.4702042 C13.3541667,20.1226027 12.7851952,20.6514763 12.0833333,20.6514763 Z
    
  149. `;
    
  150. 
    
  151. const PATH_PROFILER = 'M5 9.2h3V19H5zM10.6 5h2.8v14h-2.8zm5.6 8H19v6h-2.8z';
    
  152. 
    
  153. const PATH_SCHEDULING_PROFILER = `
    
  154.   M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0
    
  155.   16H5V9h14v10zm0-12H5V5h14v2zM7 11h5v5H7z
    
  156. `;
    
  157. 
    
  158. const PATH_SEARCH = `
    
  159.   M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91
    
  160.   16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99
    
  161.   5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z
    
  162. `;
    
  163. 
    
  164. const PATH_RANKED_CHART = 'M3 5h18v3H3zM3 10.5h13v3H3zM3 16h8v3H3z';
    
  165. 
    
  166. const PATH_SETTINGS = `
    
  167.   M19.43 12.98c.04-.32.07-.64.07-.98s-.03-.66-.07-.98l2.11-1.65c.19-.15.24-.42.12-.64l-2-3.46c-.12-.22-.39-.3-.61-.22l-2.49
    
  168.   1c-.52-.4-1.08-.73-1.69-.98l-.38-2.65C14.46 2.18 14.25 2 14 2h-4c-.25 0-.46.18-.49.42l-.38
    
  169.   2.65c-.61.25-1.17.59-1.69.98l-2.49-1c-.23-.09-.49 0-.61.22l-2 3.46c-.13.22-.07.49.12.64l2.11
    
  170.   1.65c-.04.32-.07.65-.07.98s.03.66.07.98l-2.11 1.65c-.19.15-.24.42-.12.64l2 3.46c.12.22.39.3.61.22l2.49-1c.52.4
    
  171.   1.08.73 1.69.98l.38 2.65c.03.24.24.42.49.42h4c.25 0 .46-.18.49-.42l.38-2.65c.61-.25 1.17-.59 1.69-.98l2.49
    
  172.   1c.23.09.49 0 .61-.22l2-3.46c.12-.22.07-.49-.12-.64l-2.11-1.65zM12 15.5c-1.93 0-3.5-1.57-3.5-3.5s1.57-3.5
    
  173.   3.5-3.5 3.5 1.57 3.5 3.5-1.57 3.5-3.5 3.5z
    
  174. `;
    
  175. 
    
  176. const PATH_STORE_AS_GLOBAL_VARIABLE = `
    
  177.   M20 8h-2.81c-.45-.78-1.07-1.45-1.82-1.96L17 4.41 15.59 3l-2.17 2.17C12.96 5.06 12.49 5 12 5c-.49 0-.96.06-1.41.17L8.41
    
  178.   3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04
    
  179.   1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8zm-6
    
  180.   8h-4v-2h4v2zm0-4h-4v-2h4v2z
    
  181. `;
    
  182. 
    
  183. const PATH_STRICT_MODE_NON_COMPLIANT = `
    
  184.   M4.47 21h15.06c1.54 0 2.5-1.67 1.73-3L13.73 4.99c-.77-1.33-2.69-1.33-3.46 0L2.74 18c-.77 1.33.19 3 1.73 3zM12
    
  185.   14c-.55 0-1-.45-1-1v-2c0-.55.45-1 1-1s1 .45 1 1v2c0 .55-.45 1-1 1zm1 4h-2v-2h2v2z
    
  186. `;
    
  187. 
    
  188. const PATH_WARNING = `M12 1l-12 22h24l-12-22zm-1 8h2v7h-2v-7zm1 11.25c-.69 0-1.25-.56-1.25-1.25s.56-1.25 1.25-1.25 1.25.56 1.25 1.25-.56 1.25-1.25 1.25z`;