@iguanads/icons 1.12.0 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -19,40 +19,44 @@ The library organizes icons into 4 categories:
19
19
 
20
20
  ## Usage
21
21
 
22
+ Every icon is exported with an `Icon` suffix (e.g. `AddIcon`, `MoneyIcon`) to
23
+ avoid name clashes with your own components.
24
+
22
25
  ```tsx
23
- import { Add } from '@iguanads/icons/one-color'
26
+ import { AddIcon } from '@iguanads/icons/one-color'
24
27
 
25
- <Add />
28
+ <AddIcon />
26
29
  ```
27
30
 
28
31
  Customize size (32px):
29
32
 
30
33
  ```tsx
31
- import { Add } from '@iguanads/icons/one-color'
34
+ import { AddIcon } from '@iguanads/icons/one-color'
32
35
 
33
- <Add className="size-8" />
36
+ <AddIcon className="size-8" />
34
37
  ```
35
38
 
36
39
  Customize color:
37
40
 
38
41
  ```tsx
39
- import { Add } from '@iguanads/icons/one-color'
42
+ import { AddIcon } from '@iguanads/icons/one-color'
40
43
 
41
- <Add className="text-pink-base" />
44
+ <AddIcon className="text-pink-base" />
42
45
  ```
43
46
 
44
47
  Change second color (two-color icons):
45
48
 
46
49
  ```tsx
47
- import { Money } from '@iguanads/icons/two-colors'
50
+ import { MoneyIcon } from '@iguanads/icons/two-colors'
48
51
 
49
- <Money className="*:fill-grayscale-white" />
52
+ <MoneyIcon className="*:fill-grayscale-white" />
50
53
  ```
51
54
 
52
55
  ## Adding new icons
53
56
 
54
57
  1. Add the SVG file to the `src/assets/{ICON_TYPE}/` folder
55
- 2. Run `pnpm build:icons` to generate React components
58
+ 2. Run `pnpm build:icons` generates the React components **and** regenerates
59
+ the category `index.ts` barrels (with the `Icon` suffix) automatically
56
60
  3. Run `pnpm build` to compile
57
61
 
58
62
  ## Commands
@@ -1,28 +1,28 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
1
+ import * as react from 'react';
2
2
  import { SVGProps } from 'react';
3
3
 
4
- declare const SvgAccount: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
4
+ declare const SvgAccount: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
5
5
 
6
- declare const SvgAdmSettings: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
6
+ declare const SvgAdmSettings: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
7
7
 
8
- declare const SvgChat: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
8
+ declare const SvgChat: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
9
9
 
10
- declare const SvgConfigurations: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
10
+ declare const SvgConfigurations: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
11
11
 
12
- declare const SvgError: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
12
+ declare const SvgError: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
13
13
 
14
- declare const SvgInfo: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
14
+ declare const SvgInfo: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
15
15
 
16
- declare const SvgMenu: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
16
+ declare const SvgMenu: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
17
17
 
18
- declare const SvgNotifications: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
18
+ declare const SvgNotifications: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
19
19
 
20
- declare const SvgOrderHistory: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
20
+ declare const SvgOrderHistory: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
21
21
 
22
- declare const SvgPinOrder: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
22
+ declare const SvgPinOrder: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
23
23
 
24
- declare const SvgSearch: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
24
+ declare const SvgSearch: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
25
25
 
26
- declare const SvgTrash: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
26
+ declare const SvgTrash: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
27
27
 
28
- export { SvgAccount as Account, SvgAdmSettings as AdmSettings, SvgChat as Chat, SvgConfigurations as Configurations, SvgError as Error, SvgInfo as Info, SvgMenu as Menu, SvgNotifications as Notifications, SvgOrderHistory as OrderHistory, SvgPinOrder as PinOrder, SvgSearch as Search, SvgTrash as Trash };
28
+ export { SvgAccount as AccountIcon, SvgAdmSettings as AdmSettingsIcon, SvgChat as ChatIcon, SvgConfigurations as ConfigurationsIcon, SvgError as ErrorIcon, SvgInfo as InfoIcon, SvgMenu as MenuIcon, SvgNotifications as NotificationsIcon, SvgOrderHistory as OrderHistoryIcon, SvgPinOrder as PinOrderIcon, SvgSearch as SearchIcon, SvgTrash as TrashIcon };
@@ -1,28 +1,28 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
1
+ import * as react from 'react';
2
2
  import { SVGProps } from 'react';
3
3
 
4
- declare const SvgAccount: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
4
+ declare const SvgAccount: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
5
5
 
6
- declare const SvgAdmSettings: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
6
+ declare const SvgAdmSettings: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
7
7
 
8
- declare const SvgChat: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
8
+ declare const SvgChat: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
9
9
 
10
- declare const SvgConfigurations: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
10
+ declare const SvgConfigurations: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
11
11
 
12
- declare const SvgError: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
12
+ declare const SvgError: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
13
13
 
14
- declare const SvgInfo: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
14
+ declare const SvgInfo: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
15
15
 
16
- declare const SvgMenu: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
16
+ declare const SvgMenu: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
17
17
 
18
- declare const SvgNotifications: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
18
+ declare const SvgNotifications: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
19
19
 
20
- declare const SvgOrderHistory: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
20
+ declare const SvgOrderHistory: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
21
21
 
22
- declare const SvgPinOrder: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
22
+ declare const SvgPinOrder: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
23
23
 
24
- declare const SvgSearch: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
24
+ declare const SvgSearch: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
25
25
 
26
- declare const SvgTrash: (props: SVGProps<SVGSVGElement>) => react_jsx_runtime.JSX.Element;
26
+ declare const SvgTrash: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
27
27
 
28
- export { SvgAccount as Account, SvgAdmSettings as AdmSettings, SvgChat as Chat, SvgConfigurations as Configurations, SvgError as Error, SvgInfo as Info, SvgMenu as Menu, SvgNotifications as Notifications, SvgOrderHistory as OrderHistory, SvgPinOrder as PinOrder, SvgSearch as Search, SvgTrash as Trash };
28
+ export { SvgAccount as AccountIcon, SvgAdmSettings as AdmSettingsIcon, SvgChat as ChatIcon, SvgConfigurations as ConfigurationsIcon, SvgError as ErrorIcon, SvgInfo as InfoIcon, SvgMenu as MenuIcon, SvgNotifications as NotificationsIcon, SvgOrderHistory as OrderHistoryIcon, SvgPinOrder as PinOrderIcon, SvgSearch as SearchIcon, SvgTrash as TrashIcon };