Skip to content

Commit

Permalink
chore(release): v1.0.0
Browse files Browse the repository at this point in the history
* Multiple input support, can input DIRECTORIES and FILES.
* Suffix and Prefix for generated code of export name declaration.
* Support case in export name declaration (camel|snake|pascal|constant).
* Support type annotation when code generated is `<Icon />`.
  • Loading branch information
r17x committed Sep 7, 2021
1 parent 190f612 commit e2526ad
Show file tree
Hide file tree
Showing 2 changed files with 29 additions and 5 deletions.
32 changes: 28 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,12 @@

## Features
* [x] Transform `<SVG/>` to Chakra-UI `Icon` Component or Functional `createIcon(...)`.
* [x] Multiple input with `directories` as `-i` or `--input` options
* `<Icon />` Component, [**See**](https://chakra-ui.com/docs/media-and-icons/icon#using-the-icon-component).
* `createIcon(...)` Functional, [**See**](https://chakra-ui.com/docs/media-and-icons/icon#using-the-createicon-function).
* [x] Multiple input with `directories` or `files` as input value for option `-i` or `--input`.
* [x] Support case in export name declaration (camel|snake|pascal|constant).
* [x] Suffix and Prefix for generated code of export name declaration.
* [x] Support type annotation when code generated is `<Icon />`.

## Usage

Expand Down Expand Up @@ -64,16 +69,35 @@ echo "

```jsx
import { createIcon } from "@chakra-ui/react";
export const Rin = createIcon({
displayName: "Rin",
export const KodingNinjaIcon = createIcon({
displayName: "KodingNinjaIcon",
viewBox: "0 0 200 200",
d: "M 100, 100 m -75, 0 a 75,75 0 1,0 150,0 a 75,75 0 1,0 -150,0"
});
```

#### Multiple Input

* **input** `per-file`
```console
create-chakra-icons -o Icons.js ./Facebook.svg ./Apple.svg ./Amazon.svg ./Netflix.svg ./Google.svg
```

* **input** `directories`
```console
create-chakra-icons -o Icons.js ./social-icons
```
* **input** `directories and per-file` at the same time
```console
create-chakra-icons -o Icons.js ./MyCompany.svg ./social-icons
```

* **output** will be make in `Icons.js` (argument `-o` or `--output`).

## Roadmap

* [ ] TypeScript Support (Type Annotation or Type Definition).
* [x] TypeScript Support (Type Annotation or Type Definition).
* Only when code generated is `<Icon />` component [**See**](https://chakra-ui.com/docs/media-and-icons/icon#using-the-icon-component).
* [ ] ReScript Support.
* [ ] Per file input is Per file output. ⁉️ 🤔
* [ ] Feel free for give me any feedback or feature request (create an issue first).
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "create-chakra-icons",
"version": "0.0.1",
"version": "1.0.0",
"description": "Transform SVG to React Chakra UI <Icon /> ✨",
"author": "ri7nz <[email protected]>",
"license": "MIT",
Expand Down

0 comments on commit e2526ad

Please sign in to comment.