react-native-vector-icons/index.js.flow

Customizable Icons for React Native with support for NavBar/TabBar/ToolbarAndroid, image source and full styling.

/**
 * @flow strict
 */

import { PureComponent } from 'react';

export type Color = number | string;

export type IconButtonProps<Glyphs: string> = {
  backgroundColor?: Color,
  borderRadius?: number,
  color?: Color,
  name: Glyphs,
  size?: number,
};

declare class IconButton<Glyphs: string> extends PureComponent<
  IconButtonProps<Glyphs>
> {}

export type IconToolbarAndroidActions<Glyphs: string> = {
  iconColor?: Color,
  iconName?: Glyphs,
  iconSize?: number,
  show?: 'always' | 'ifRoom' | 'never',
  showWithText?: boolean,
  title: string,
};

export type IconToolbarAndroidProps<Glyphs: string> = {
  actions: IconToolbarAndroidActions<Glyphs>[],
  iconColor?: Color,
  iconSize?: number,
  logoName?: Glyphs,
  navIconName?: Glyphs,
  overflowIconName?: Glyphs,
  titleColor?: Color,
};

declare class IconToolbarAndroid<Glyphs: string> extends PureComponent<
  IconToolbarAndroidProps<Glyphs>
> {}

export type TabBarItemIOSProps<Glyphs: string> = {
  iconColor?: Color,
  iconName: Glyphs,
  iconSize?: number,
  selectedIconColor?: Color,
  selectedIconName?: Glyphs,
};

declare class TabBarItemIOS<Glyphs: string> extends PureComponent<
  TabBarItemIOSProps<Glyphs>
> {}

export type IconProps<Glyphs: string> = {
  allowFontScaling?: boolean,
  color?: Color,
  name: Glyphs,
  size?: number,
};

export type ImageSource = {|
  uri: string,
  scale: number,
|};

declare class Icon<Glyphs: string> extends PureComponent<IconProps<Glyphs>> {
  static Button: Class<IconButton<Glyphs>>;
  static TabBarItem: Class<TabBarItemIOS<Glyphs>>;
  static TabBarItemIOS: Class<TabBarItemIOS<Glyphs>>;
  static ToolbarAndroid: Class<IconToolbarAndroid<Glyphs>>;

  static getFontFamily(): string;
  static getImageSource(
    name: Glyphs,
    size?: number,
    color?: Color
  ): Promise<ImageSource>;
  static getRawGlyphMap(): { [name: Glyphs]: number };
  static hasIcon(name: string): boolean;
  static loadFont(file?: string): Promise<void>;
}

export type { Icon };

declare export function createIconSet<GlyphMap: { [key: string]: number }>(
  glyphMap: GlyphMap,
  fontFamily: string,
  fontFile?: string
): Class<Icon<$Keys<GlyphMap>>>;

export type FontelloConfig = {
  glyphs: Array<{
    css: string,
    code: number,
  }>,
};

declare export function createIconSetFromFontello(
  config: FontelloConfig,
  fontFamily?: string,
  fontFile?: string
): Class<Icon<string>>;

export type IcoMoonConfig = {
  icons: Array<{
    properties: { name: string, code: number },
  }>,
};

declare export function createIconSetFromIcoMoon(
  config: IcoMoonConfig,
  fontFamily?: string,
  fontFile?: string
): Class<Icon<string>>;