diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index 2ae24f3a44..071f7fca79 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -102,6 +102,44 @@ jobs:
name: lucide-react-package-json
path: packages/lucide-react/package.json
+ lucide-react-native:
+ if: github.repository == 'lucide-icons/lucide'
+ runs-on: ubuntu-latest
+ needs: pre-build
+ steps:
+ - uses: actions/checkout@v2
+
+ - name: Setup node
+ uses: actions/setup-node@v3
+ with:
+ node-version: 16
+ cache: 'yarn'
+ cache-dependency-path: 'yarn.lock'
+
+ - name: Install dependencies
+ run: yarn --frozen-lockfile
+
+ - name: Set Auth Token
+ run: npm config set //registry.npmjs.org/:_authToken ${{ secrets.NPM_TOKEN }}
+
+ - name: Set package.json version lucide
+ run: yarn workspace lucide-react-native version --new-version ${{ needs.pre-build.outputs.VERSION }} --no-git-tag-version
+
+ - name: Build
+ run: yarn workspace lucide-react-native build
+
+ - name: Test
+ run: yarn workspace lucide-react-native test
+
+ - name: Publish
+ run: yarn workspace lucide-react-native publish
+
+ - name: Upload package.json
+ uses: actions/upload-artifact@v2
+ with:
+ name: lucide-react-native-package-json
+ path: packages/lucide-react-native/package.json
+
lucide-vue:
if: github.repository == 'lucide-icons/lucide'
runs-on: ubuntu-latest
diff --git a/README.md b/README.md
index 347169641c..5b6c171f97 100644
--- a/README.md
+++ b/README.md
@@ -29,6 +29,7 @@ Lucide is trying to expand the icon set as much as possible while staying faithf
* [Usage](#usage)
* [Web](#web)
* [React](#react)
+ * [React Native](#react-native)
* [Vue 2](#vue-2)
* [Vue 3](#vue-3)
* [Angular](#angular)
@@ -76,6 +77,20 @@ npm install lucide-react
For more details, see the [documentation](https://github.com/lucide-icons/lucide/tree/main/packages/lucide-react#lucide-react).
+### React Native
+
+Implementation of the lucide icon library for React Native applications.
+
+```sh
+yarn add lucide-react-native
+
+# or
+
+npm install lucide-react-native
+```
+
+For more details, see the [documentation](https://github.com/lucide-icons/lucide/tree/master/packages/lucide-react-native#lucide-react-native).
+
### Vue 2
Implementation of the lucide icon library for vue applications.
diff --git a/docs/index.md b/docs/index.md
index f487d4aa24..b544e8fdd1 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -17,7 +17,7 @@ When designing new icons, the community is working with a set of design rules. T
Beside design, code is also important. Assets like icons in for example web projects can increase the transferred bytes significantly. With the growing internet, lucide has the responsibility to keep their assets small as possible. To achieve this, lucide uses SVG compression and specific code architecture for tree-shaking abilities. With tree-shaking used you will only ship the icons you used, helps you to keep the software small as possible when distributed.
-Lucide provides several official packages for: [Web (Vanilla)](https://lucide.dev/docs/lucide), [React](https://lucide.dev/docs/lucide-react), [Vue](https://lucide.dev/docs/lucide-vue), [Vue 3](https://lucide.dev/docs/lucide-vue-next), [Svelte](https://lucide.dev/docs/lucide-svelte),[Preact](https://lucide.dev/docs/lucide-preact), [Angular](https://lucide.dev/docs/lucide-angular), [NodeJS](https://lucide.dev/docs/lucide-static#nodejs) and [Flutter](https://lucide.dev/docs/lucide-flutter).
+Lucide provides several official packages for: [Web (Vanilla)](https://lucide.dev/docs/lucide), [React](https://lucide.dev/docs/lucide-react), [React Native](https://lucide.dev/docs/lucide-react-native), [Vue](https://lucide.dev/docs/lucide-vue), [Vue 3](https://lucide.dev/docs/lucide-vue-next), [Svelte](https://lucide.dev/docs/lucide-svelte),[Preact](https://lucide.dev/docs/lucide-preact), [Angular](https://lucide.dev/docs/lucide-angular), [NodeJS](https://lucide.dev/docs/lucide-static#nodejs) and [Flutter](https://lucide.dev/docs/lucide-flutter).
Any questions about lucide? Ask the community. Active on [GitHub](https://github.com/lucide-icons/lucide) and [Discord](https://discord.gg/EH6nSts).
diff --git a/docs/packages/lucide-react-native.md b/docs/packages/lucide-react-native.md
new file mode 100644
index 0000000000..bdd78b280c
--- /dev/null
+++ b/docs/packages/lucide-react-native.md
@@ -0,0 +1,75 @@
+# Lucide React Native
+
+Implementation of the lucide icon library for React Native applications
+
+## Installation
+
+First, ensure that you have `react-native-svg@^12.0.0` installed. Then, install the package:
+
+```bash
+yarn add lucide-react-native
+
+# or
+
+npm install lucide-react-native
+```
+
+## How to use
+
+It's build with ESmodules so it's completely threeshakable.
+Each icon can be imported as a react component.
+
+### Example
+
+You can pass additional props to adjust the icon.
+
+```js
+import { Camera } from 'lucide-react-native';
+// Returns ReactComponent
+
+// Usage
+const App = () => {
+ return ;
+};
+
+export default App;
+```
+
+### Props
+
+| name | type | default |
+| ------------- | -------- | ------------ |
+| `size` | _Number_ | 24 |
+| `color` | _String_ | currentColor |
+| `strokeWidth` | _Number_ | 2 |
+
+### Custom props
+
+You can also pass custom props that will be added in the svg as attributes.
+
+```js
+// Usage
+const App = () => {
+ return ;
+};
+```
+
+### One generic icon component
+
+It is possible to create one generic icon component to load icons.
+
+> :warning: Example below importing all EsModules, caution using this example, not recommended when you using bundlers, your application build size will grow strongly.
+
+#### Icon Component Example
+
+```js
+import * as icons from 'lucide-react';
+
+const Icon = ({ name, color, size }) => {
+ const LucideIcon = icons[name];
+
+ return ;
+};
+
+export default Icon;
+```
diff --git a/package.json b/package.json
index c43471a6ca..56ef4c02a6 100644
--- a/package.json
+++ b/package.json
@@ -22,11 +22,12 @@
]
},
"scripts": {
- "build": "yarn lucide build && yarn lucide-react build && yarn lucide-preact build && yarn lucide-vue build && yarn lucide-vue-next build && yarn lucide-angular build",
+ "build": "yarn lucide build && yarn lucide-react build && yarn lucide-react-native build && yarn lucide-preact build && yarn lucide-vue build && yarn lucide-vue-next build && yarn lucide-angular build",
"test": "yarn lucide build:icons && yarn lucide-react build:icons && yarn lucide-vue build:icons && jest",
"lucide": "yarn workspace lucide",
"lucide-angular": "yarn workspace lucide-angular",
"lucide-react": "yarn workspace lucide-react",
+ "lucide-react-native": "yarn workspace lucide-react-native",
"lucide-preact": "yarn workspace lucide-preact",
"lucide-vue": "yarn workspace lucide-vue",
"lucide-vue-next": "yarn workspace lucide-vue-next",
diff --git a/packages/lucide-react-native/README.md b/packages/lucide-react-native/README.md
index 50ff9f9cbd..6678217205 100644
--- a/packages/lucide-react-native/README.md
+++ b/packages/lucide-react-native/README.md
@@ -1,6 +1,6 @@
# Lucide React Native
-Implementation of the lucide icon library for react applications.
+Implementation of the lucide icon library for React Native applications.
> What is lucide? Read it [here](https://github.com/lucide-icons/lucide#what-is-lucide).