Package Exports

react-native-united-states-icons
react-native-united-states-icons/dist/index.esm.js
react-native-united-states-icons/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-native-united-states-icons) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

React Native United States SVG Icons

This library provides SVG icons for all US states and territories, optimized for use with React Native. It leverages the state-svg-defs library and uses jscodeshift to codemod the SVGs into react-native-svg components.

Usage

Step 1 - Installation

Install the library using npm or yarn:

npm install react-native-united-states-icons

yarn add react-native-united-states-icons

pnpm add react-native-united-states-icons

Step 2 - Importing Icons

Import the desired state icons into your React Native component:

import { Alabama, California, Texas } from 'react-native-united-states-icons'

const App = () => (
  <View>
    <Alabama width={50} height={50} />
    <California width={50} height={50} />
    <Texas width={50} height={50} />
  </View>
)

Step 3 - Styling Icons

You can style the icons using the style prop or by wrapping them in a styled component:

import { Alabama } from 'react-native-united-states-icons'
import { StyleSheet, View } from 'react-native'

const styles = StyleSheet.create({
  icon: {
    color: 'red',
  },
})

const App = () => (
  <View>
    <Alabama width={50} height={50} style={styles.icon} />
  </View>
)

The fill of the SVG's elements is determined by setting the color prop.

Credit

The original icons were designed by ProPublica and provided as an icon font. coryetzkorn converted them to the svgdefs format. Passing on his kudos to ProPublica for the original work—and my kudos for having this repo as a starting point for this new package!

United States territory SVGs from Wiki Commons

react-native-united-states-icons