src/shared/components/common/icon.tsx

   1 import classNames from "classnames";
   2 import { Component } from "inferno";
   3
   4 interface IconProps {
   5   icon: string;
   6   classes?: string;
   7   inline?: boolean;
   8   small?: boolean;
   9 }
  10
  11 export class Icon extends Component<IconProps, any> {
  12   constructor(props: any, context: any) {
  13     super(props, context);
  14   }
  15
  16   render() {
  17     return (
  18       <svg
  19         class={classNames("icon", this.props.classes, {
  20           "icon-inline": this.props.inline,
  21           small: this.props.small,
  22         })}
  23       >
  24         <use xlinkHref={`#icon-${this.props.icon}`}></use>
  25         <div class="sr-only">
  26           <title>{this.props.icon}</title>
  27         </div>
  28       </svg>
  29     );
  30   }
  31 }
  32
  33 interface SpinnerProps {
  34   large?: boolean;
  35 }
  36
  37 export class Spinner extends Component<SpinnerProps, any> {
  38   constructor(props: any, context: any) {
  39     super(props, context);
  40   }
  41
  42   render() {
  43     return (
  44       <Icon
  45         icon="spinner"
  46         classes={`spin ${this.props.large && "spinner-large"}`}
  47       />
  48     );
  49   }
  50 }