vitess.io/vitess@v0.16.2/web/vtadmin/src/components/Icon.tsx (about)

     1  /**
     2   * Copyright 2021 The Vitess Authors.
     3   *
     4   * Licensed under the Apache License, Version 2.0 (the "License");
     5   * you may not use this file except in compliance with the License.
     6   * You may obtain a copy of the License at
     7   *
     8   *     http://www.apache.org/licenses/LICENSE-2.0
     9   *
    10   * Unless required by applicable law or agreed to in writing, software
    11   * distributed under the License is distributed on an "AS IS" BASIS,
    12   * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    13   * See the License for the specific language governing permissions and
    14   * limitations under the License.
    15   */
    16  import * as React from 'react';
    17  import * as icons from '../icons';
    18  
    19  interface Props {
    20      className?: string;
    21      icon: Icons;
    22      tabIndex?: number;
    23  }
    24  
    25  // All icons are from the VTAdmin Figma icon library:
    26  // https://www.figma.com/file/By3SoETBRHpOirv3Ctfxdq/Designs
    27  export const Icon = React.forwardRef<any, Props>(({ icon, ...props }, ref) => {
    28      const componentName = icon.charAt(0).toUpperCase() + icon.slice(1);
    29  
    30      const IconComponent = (icons as any)[componentName];
    31      if (!IconComponent) {
    32          console.warn(`Invalid icon: ${icon}`);
    33          return null;
    34      }
    35  
    36      return <IconComponent {...props} ref={ref} />;
    37  });
    38  
    39  export enum Icons {
    40      alertFail = 'alertFail',
    41      bug = 'bug',
    42      checkSuccess = 'checkSuccess',
    43      chevronDown = 'chevronDown',
    44      chevronUp = 'chevronUp',
    45      circleAdd = 'circleAdd',
    46      delete = 'delete',
    47      download = 'download',
    48      info = 'info',
    49      open = 'open',
    50      question = 'question',
    51      runQuery = 'runQuery',
    52      search = 'search',
    53      topology = 'topology',
    54  }