{"id":27870804,"url":"https://github.com/newbiebr/react-native-easy-icon","last_synced_at":"2025-06-25T06:05:38.249Z","repository":{"id":38919204,"uuid":"238579477","full_name":"NewBieBR/react-native-easy-icon","owner":"NewBieBR","description":"A wrapper component for using react-native-vector-icons easily","archived":false,"fork":false,"pushed_at":"2024-12-16T08:15:18.000Z","size":2839,"stargazers_count":6,"open_issues_count":19,"forks_count":2,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-06-06T01:39:23.775Z","etag":null,"topics":["icons","react-native","react-native-vector-icons","typescript"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/NewBieBR.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2020-02-06T00:54:47.000Z","updated_at":"2024-12-16T08:15:23.000Z","dependencies_parsed_at":"2025-05-04T23:42:39.512Z","dependency_job_id":null,"html_url":"https://github.com/NewBieBR/react-native-easy-icon","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/NewBieBR/react-native-easy-icon","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NewBieBR%2Freact-native-easy-icon","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NewBieBR%2Freact-native-easy-icon/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NewBieBR%2Freact-native-easy-icon/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NewBieBR%2Freact-native-easy-icon/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/NewBieBR","download_url":"https://codeload.github.com/NewBieBR/react-native-easy-icon/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NewBieBR%2Freact-native-easy-icon/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261816310,"owners_count":23213863,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["icons","react-native","react-native-vector-icons","typescript"],"created_at":"2025-05-04T23:26:50.496Z","updated_at":"2025-06-25T06:05:38.225Z","avatar_url":"https://github.com/NewBieBR.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Typed React Native Vector Icons\n\nFully typed Icon component for react-native-vector-icons.\n\n![](./assets/demo.gif)\n\n\n## Getting Started\n\n1. Install react-native-vector-icons\n\n2. Install this package\n```bash\nyarn add react-native-easy-icon\n```\n\n## What if react-native-vector-icons add new icon sets or icons?\nFollow these steps:\n```bash\n# 1. Install dependencies\nyarn add react-native-easy-icon\n\n# 2. Add new icon set to index.tsx \u003e IconSets array\n\n# 3. Generate a typed Icon component by parsing react-native-vector-icons package.\nyarn generate\n\n# 4. Build\nyarn build\n```\n\n\n## How does it works?\n\nThe generation script:\n1. For each icon set (AntDesign, Zocial, Entypo, etc), find the glyph map file by reading each `./node_modules/react-native-vector-icons/${iconSetName}.js`\n    - Example from Feather.js:\n    ```javascript\n    import createIconSet from './lib/create-icon-set';\n    import glyphMap from './glyphmaps/Feather.json'; // the script gets this path.\n    // ...\n    ```\n    - We cannot assume that the glyph map file path is `.../glyphmaps/${iconSetName}.json` because FontAwesome5 is an exception.\n2. Get list of icon names of each icon set by parsing glyph map files.\n    - Example from glyphmaps/Feather.json:\n    ```json\n    {\n        \"activity\": 61696,\n        \"airplay\": 61697,\n        \"alert-circle\": 61698,\n        //...\n    }\n    ```\n3. Generate `${iconSetName}.d.ts` in `src/types/` for each icon set.\n    - Example of Feather.d.ts:\n    ```typescript\n    const FeatherIcons = [\"activity\",\"airplay\",\"alert-circle\",...]\n    type FeatherIcon = (typeof FeatherIcons)[number]\n    ```\n4. Generate an Icon component in `src/Icon.tsx`.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnewbiebr%2Freact-native-easy-icon","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnewbiebr%2Freact-native-easy-icon","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnewbiebr%2Freact-native-easy-icon/lists"}