diff --git a/docs/guide/packages/lucide-react-native.md b/docs/guide/packages/lucide-react-native.md index b7208292d..8056524c0 100644 --- a/docs/guide/packages/lucide-react-native.md +++ b/docs/guide/packages/lucide-react-native.md @@ -102,10 +102,16 @@ The example below imports all ES Modules, so exercise caution when using it. Imp ### Icon Component Example -```jsx -import { icons } from 'lucide-react-native'; +```tsx +import * as icons from 'lucide-react-native/icons'; -const Icon = ({ name, color, size }) => { +interface IconProps { + name: keyof typeof icons; + color?: string; + size?: number; +} + +const Icon = ({ name, color, size }: IconProps) => { const LucideIcon = icons[name]; return ; @@ -116,11 +122,11 @@ export default Icon; #### Using the Icon Component -```jsx +```tsx import Icon from './Icon'; const App = () => { - return ; + return ; }; export default App; diff --git a/icons/toolbox.json b/icons/toolbox.json new file mode 100644 index 000000000..51454e166 --- /dev/null +++ b/icons/toolbox.json @@ -0,0 +1,37 @@ +{ + "$schema": "../icon.schema.json", + "contributors": [ + "karsa-mistmere" + ], + "tags": [ + "toolkit", + "tools", + "trunk", + "chest", + "box", + "storage", + "utility", + "utilities", + "container", + "kit", + "set", + "repair", + "fix", + "service", + "maintenance", + "mechanic", + "workshop", + "construction", + "hardware", + "equipment", + "gear", + "handyman", + "engineering", + "craft", + "diy" + ], + "categories": [ + "tools", + "home" + ] +} diff --git a/icons/toolbox.svg b/icons/toolbox.svg new file mode 100644 index 000000000..67e3809c0 --- /dev/null +++ b/icons/toolbox.svg @@ -0,0 +1,17 @@ + + + + + + + diff --git a/packages/lucide-react-native/package.json b/packages/lucide-react-native/package.json index 6a102358d..26eedd204 100644 --- a/packages/lucide-react-native/package.json +++ b/packages/lucide-react-native/package.json @@ -24,11 +24,23 @@ "author": "Eric Fennis", "amdName": "lucide-react-native", "main": "dist/cjs/lucide-react-native.js", - "main:umd": "dist/umd/lucide-react-native.js", "module": "dist/esm/lucide-react-native.js", - "unpkg": "dist/umd/lucide-react-native.min.js", "typings": "dist/lucide-react-native.d.ts", "react-native": "dist/esm/lucide-react-native.js", + "exports": { + ".": { + "types": "./dist/lucide-react-native.d.ts", + "import": "./dist/esm/lucide-react-native.js", + "browser": "./dist/esm/lucide-react-native.js", + "require": "./dist/cjs/lucide-react-native.js" + }, + "./icons": { + "types": "./dist/icons.d.ts", + "import": "./dist/esm/icons/index.js", + "browser": "./dist/esm/icons/index.js", + "require": "./dist/cjs/icons/index.js" + } + }, "sideEffects": false, "files": [ "dist" diff --git a/packages/lucide-react-native/rollup.config.mjs b/packages/lucide-react-native/rollup.config.mjs index 3c92d30d3..0453916d8 100644 --- a/packages/lucide-react-native/rollup.config.mjs +++ b/packages/lucide-react-native/rollup.config.mjs @@ -5,7 +5,7 @@ import pkg from './package.json' with { type: 'json' }; const packageName = 'LucideReact'; const outputFileName = 'lucide-react-native'; const outputDir = 'dist'; -const inputs = ['src/lucide-react-native.ts']; +const inputs = ['src/lucide-react-native.ts', 'src/icons/index.ts']; const bundles = [ { format: 'cjs', @@ -60,6 +60,16 @@ export default [ ], plugins: [dts()], }, + { + input: inputs[1], + output: [ + { + file: `dist/icons.d.ts`, + format: 'es', + }, + ], + plugins: [dts()], + }, { input: `src/${outputFileName}.suffixed.ts`, output: [ diff --git a/packages/lucide-react-native/src/Icon.ts b/packages/lucide-react-native/src/Icon.ts index ee43a1b0d..7fc4cb4aa 100644 --- a/packages/lucide-react-native/src/Icon.ts +++ b/packages/lucide-react-native/src/Icon.ts @@ -31,6 +31,7 @@ const Icon = forwardRef( absoluteStrokeWidth, children, iconNode, + className, ...rest }, ref, @@ -46,6 +47,7 @@ const Icon = forwardRef( { ref, ...defaultAttributes, + className, width: size, height: size, ...customAttrs, diff --git a/packages/lucide-react-native/src/lucide-react-native.prefixed.ts b/packages/lucide-react-native/src/lucide-react-native.prefixed.ts index 408ad714b..e5403bcfa 100644 --- a/packages/lucide-react-native/src/lucide-react-native.prefixed.ts +++ b/packages/lucide-react-native/src/lucide-react-native.prefixed.ts @@ -1,5 +1,4 @@ export * from './icons'; -export * as icons from './icons'; export * from './aliases/prefixed'; export * from './types'; diff --git a/packages/lucide-react-native/src/lucide-react-native.suffixed.ts b/packages/lucide-react-native/src/lucide-react-native.suffixed.ts index 8993799d2..796fb9476 100644 --- a/packages/lucide-react-native/src/lucide-react-native.suffixed.ts +++ b/packages/lucide-react-native/src/lucide-react-native.suffixed.ts @@ -1,5 +1,4 @@ export * from './icons'; -export * as icons from './icons'; export * from './aliases/suffixed'; export * from './types'; diff --git a/packages/lucide-react-native/src/lucide-react-native.ts b/packages/lucide-react-native/src/lucide-react-native.ts index 6636c2259..b761dcce9 100644 --- a/packages/lucide-react-native/src/lucide-react-native.ts +++ b/packages/lucide-react-native/src/lucide-react-native.ts @@ -1,5 +1,4 @@ export * from './icons'; -export * as icons from './icons'; export * from './aliases'; export * from './types'; diff --git a/tools/build-font/main.ts b/tools/build-font/main.ts index 74bb9990c..45a94f041 100644 --- a/tools/build-font/main.ts +++ b/tools/build-font/main.ts @@ -101,6 +101,7 @@ async function init() { useCSSVars: false, outSVGReact: false, outSVGPath: false, + addLigatures: true, svgicons2svgfont: { fontHeight: 1000, // At least 1000 is recommended normalize: false,