v7: rebuild with typescript for typescript

.github/workflows/build.yml

@@ -1,29 +1,34 @@
 name: Build
 
-on: [push, pull_request]
+on:
+  pull_request:
+    branches: [main]
+  push:
+    branches: [main]
 
 jobs:
-  build:
+  test:
     runs-on: ubuntu-latest
 
-    strategy:
-      matrix:
-        node-version:
-          - 14.x
-          - 16.x
-
     steps:
-      - uses: actions/checkout@v1
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
+      - uses: actions/checkout@v4
+
+      - name: Use Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: "package.json"
+          cache: "npm"
+
+      - name: Handle Next.js Cache
+        uses: actions/cache@v4
         with:
-          node-version: ${{ matrix.node-version }}
-      - name: Install
-        run: |
-          yarn install \
-            --non-interactive \
-            --frozen-lockfile
+          path: .next/cache
+          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-${{ hashFiles('**/*.js', '**/*.jsx', '**/*.ts', '**/*.tsx') }}
+          restore-keys: |
+            ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json') }}-
+
+      - name: Install dependencies
+        run: npm ci
+
       - name: Test
-        run: yarn test
-        env:
-          CI: true
+        run: npm run test

.gitignore

@@ -3,15 +3,6 @@
 
 # node
 node_modules
-# npm unused lock file (we use yarn.lock)
-package-lock.json
 
-# ocaml/reason build artifacts
-.bsb.lock
-**/lib/bs
-**/lib/ocaml
-**/.merlin
-*.bs.js
-
-# webpack build
+# build
 dist

.husky/pre-push

@@ -0,0 +1 @@
+npm test

README.md

@@ -8,20 +8,17 @@
 [![GitHub Workflow Status](https://img.shields.io/github/actions/workflow/status/MoOx/react-from-svg/build.yml?branch=main)](https://github.com/MoOx/react-from-svg/actions)
 [![License](https://img.shields.io/github/license/MoOx/react-from-svg)](https://github.com/MoOx/react-from-svg)  
 [![GitHub followers](https://img.shields.io/github/followers/MoOx?style=social&label=Follow%20me)](https://github.com/MoOx)
-[![Twitter Follow](https://img.shields.io/twitter/follow/MoOx?style=social&label=Follow%20me)](https://twitter.com/MoOx)
-[![Sponsor my work](https://github.com/moox/.github/raw/main/FUNDING-button.svg)](https://github.com/MoOx/react-from-svg?sponsor=1)
+[![LinkedIn Follow](https://img.shields.io/badge/Follow%20Me-on%20LinkedIn-gray?style=social&logo=invision&logoColor=%230077B5)](https://www.linkedin.com/in/maxthirouin/)
+[![BlueSky Follow](https://img.shields.io/badge/Follow%20Me-on%20BlueSky-gray?style=social&logo=bluesky)](https://bsky.app/profile/moox.io)
+[![X Follow](https://img.shields.io/twitter/follow/MoOx?style=social&label=Follow%20me)](https://x.com/MoOx)
 
-> Transform SVG files into React components, Native and/or Web, JavaScript and
-> rescriptML. Without shitload of dependencies.
+> Transform SVG files into React components, Native and/or Web, JavaScript and/or TypeScript.
+> Without minimal dependencies.
 
 ## Install
 
 ```console
 npm install react-from-svg
-
-# or
-
-yarn add react-from-svg
 ```
 
 ## Usage
@@ -35,59 +32,40 @@ Usage
 Options
   --with-native, -rn                    Output code for react-native-svg
   --with-native-for-typescript, -rnts   Output code for react-native-svg with TypeScript
-
   --with-web, -rnw                      Output code for DOM. If --with-native is also used, will be output as .web.js files
-  --with-native-for-rescript, -rrn      Output code for @rescript-react-native/svg
-  --with-web-for-rescript, -rrnw        Output code for @rescript/react
+  --with-web-for-typescript, -rnwts     Output code for DOM with TypeScript. If --with-native is also used, will be output as .web.tsx files
   --remove-fill, -rf                    Remove all 'fill' properties from SVGs, convenient for icons
   --remove-stroke, -rs                  Remove all 'stroke' properties from SVGs, convenient for icons
-  --commonjs, -cjs                      Export as commonjs instead of es6 import/export
 
 Example
   $ react-from-svg assets/svgs src/Svgs --with-native --remove-fill
 ```
 
-Generated components will have the following props that you can inject to the
-SVG components:
+Generated components will allow you to inject all the props you could use on an `<svg>`/`<Svg>`, such as:
 
 - `width`
 - `height`
 - `fill` (if you use `--remove-fill`)
 - `stroke` (if you use `--remove-stroke`)
+- `style`
 
-⚠️ To see what you can expect from the transformations,
-[check our snapshots](./__tests__/__snapshots__) 👀
+⚠️ To see what you can expect from the transformations, [check our snapshots](./tests/) 👀
 
 ## Requirements
 
-### `--with-web`
+### `--with-web(-*)`
 
 Need you to have:
 
 - [React](https://reactjs.org)
 
-### `--with-web-for-rescript`
+Note: if you use [React Native for Web](https://github.com/necolas/react-native-web), see requirements below.
 
-Need you to have:
-
-- [React](https://reactjs.org)
-- [`rescript-react`](https://rescriptml.github.io/rescript-react/)
-
-### `--with-native`
+### `--with-native(-*)`
 
 Need you to have:
 
 - [React](https://reactjs.org)
 - [React Native](https://reactnative.dev) (or an alternative platform like
   [React Native Web](https://github.com/necolas/react-native-web))
 - [`react-native-svg`](https://github.com/react-native-community/react-native-svg)
-
-### `--with-native-for-rescript`
-
-In addition to `--with-native` requirements, you need to have:
-
-- [`@rescript/react`](https://rescript-lang.org/docs/react/latest/introduction)
-- [`rescript-react-native`](https://rescript-react-native.github.io)
-- [`@rescript-react-native/svg`](https://github.com/rescript-react-native/svg)
-
-Ensure as that this dependencies are in the `bs-dependencies` of your `bsconfig.json`.