@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 +13 -9
- package/dist/filled/index.d.mts +14 -14
- package/dist/filled/index.d.ts +14 -14
- package/dist/filled/index.js +66 -379
- package/dist/filled/index.mjs +54 -367
- package/dist/one-color/index.d.mts +73 -61
- package/dist/one-color/index.d.ts +73 -61
- package/dist/one-color/index.js +365 -1610
- package/dist/one-color/index.mjs +300 -1551
- package/dist/social-media/index.d.mts +5 -5
- package/dist/social-media/index.d.ts +5 -5
- package/dist/social-media/index.js +13 -85
- package/dist/social-media/index.mjs +10 -82
- package/dist/two-colors/index.d.mts +31 -31
- package/dist/two-colors/index.d.ts +31 -31
- package/dist/two-colors/index.js +197 -1067
- package/dist/two-colors/index.mjs +168 -1038
- package/package.json +16 -12
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 {
|
|
26
|
+
import { AddIcon } from '@iguanads/icons/one-color'
|
|
24
27
|
|
|
25
|
-
<
|
|
28
|
+
<AddIcon />
|
|
26
29
|
```
|
|
27
30
|
|
|
28
31
|
Customize size (32px):
|
|
29
32
|
|
|
30
33
|
```tsx
|
|
31
|
-
import {
|
|
34
|
+
import { AddIcon } from '@iguanads/icons/one-color'
|
|
32
35
|
|
|
33
|
-
<
|
|
36
|
+
<AddIcon className="size-8" />
|
|
34
37
|
```
|
|
35
38
|
|
|
36
39
|
Customize color:
|
|
37
40
|
|
|
38
41
|
```tsx
|
|
39
|
-
import {
|
|
42
|
+
import { AddIcon } from '@iguanads/icons/one-color'
|
|
40
43
|
|
|
41
|
-
<
|
|
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 {
|
|
50
|
+
import { MoneyIcon } from '@iguanads/icons/two-colors'
|
|
48
51
|
|
|
49
|
-
<
|
|
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`
|
|
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
|
package/dist/filled/index.d.mts
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react from 'react';
|
|
2
2
|
import { SVGProps } from 'react';
|
|
3
3
|
|
|
4
|
-
declare const SvgAccount: (props: SVGProps<SVGSVGElement>) =>
|
|
4
|
+
declare const SvgAccount: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
5
5
|
|
|
6
|
-
declare const SvgAdmSettings: (props: SVGProps<SVGSVGElement>) =>
|
|
6
|
+
declare const SvgAdmSettings: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
7
7
|
|
|
8
|
-
declare const SvgChat: (props: SVGProps<SVGSVGElement>) =>
|
|
8
|
+
declare const SvgChat: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
9
9
|
|
|
10
|
-
declare const SvgConfigurations: (props: SVGProps<SVGSVGElement>) =>
|
|
10
|
+
declare const SvgConfigurations: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
11
11
|
|
|
12
|
-
declare const SvgError: (props: SVGProps<SVGSVGElement>) =>
|
|
12
|
+
declare const SvgError: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
13
13
|
|
|
14
|
-
declare const SvgInfo: (props: SVGProps<SVGSVGElement>) =>
|
|
14
|
+
declare const SvgInfo: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
15
15
|
|
|
16
|
-
declare const SvgMenu: (props: SVGProps<SVGSVGElement>) =>
|
|
16
|
+
declare const SvgMenu: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
17
17
|
|
|
18
|
-
declare const SvgNotifications: (props: SVGProps<SVGSVGElement>) =>
|
|
18
|
+
declare const SvgNotifications: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
19
19
|
|
|
20
|
-
declare const SvgOrderHistory: (props: SVGProps<SVGSVGElement>) =>
|
|
20
|
+
declare const SvgOrderHistory: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
21
21
|
|
|
22
|
-
declare const SvgPinOrder: (props: SVGProps<SVGSVGElement>) =>
|
|
22
|
+
declare const SvgPinOrder: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
23
23
|
|
|
24
|
-
declare const SvgSearch: (props: SVGProps<SVGSVGElement>) =>
|
|
24
|
+
declare const SvgSearch: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
25
25
|
|
|
26
|
-
declare const SvgTrash: (props: SVGProps<SVGSVGElement>) =>
|
|
26
|
+
declare const SvgTrash: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
27
27
|
|
|
28
|
-
export { SvgAccount as
|
|
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 };
|
package/dist/filled/index.d.ts
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react from 'react';
|
|
2
2
|
import { SVGProps } from 'react';
|
|
3
3
|
|
|
4
|
-
declare const SvgAccount: (props: SVGProps<SVGSVGElement>) =>
|
|
4
|
+
declare const SvgAccount: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
5
5
|
|
|
6
|
-
declare const SvgAdmSettings: (props: SVGProps<SVGSVGElement>) =>
|
|
6
|
+
declare const SvgAdmSettings: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
7
7
|
|
|
8
|
-
declare const SvgChat: (props: SVGProps<SVGSVGElement>) =>
|
|
8
|
+
declare const SvgChat: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
9
9
|
|
|
10
|
-
declare const SvgConfigurations: (props: SVGProps<SVGSVGElement>) =>
|
|
10
|
+
declare const SvgConfigurations: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
11
11
|
|
|
12
|
-
declare const SvgError: (props: SVGProps<SVGSVGElement>) =>
|
|
12
|
+
declare const SvgError: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
13
13
|
|
|
14
|
-
declare const SvgInfo: (props: SVGProps<SVGSVGElement>) =>
|
|
14
|
+
declare const SvgInfo: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
15
15
|
|
|
16
|
-
declare const SvgMenu: (props: SVGProps<SVGSVGElement>) =>
|
|
16
|
+
declare const SvgMenu: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
17
17
|
|
|
18
|
-
declare const SvgNotifications: (props: SVGProps<SVGSVGElement>) =>
|
|
18
|
+
declare const SvgNotifications: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
19
19
|
|
|
20
|
-
declare const SvgOrderHistory: (props: SVGProps<SVGSVGElement>) =>
|
|
20
|
+
declare const SvgOrderHistory: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
21
21
|
|
|
22
|
-
declare const SvgPinOrder: (props: SVGProps<SVGSVGElement>) =>
|
|
22
|
+
declare const SvgPinOrder: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
23
23
|
|
|
24
|
-
declare const SvgSearch: (props: SVGProps<SVGSVGElement>) =>
|
|
24
|
+
declare const SvgSearch: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
25
25
|
|
|
26
|
-
declare const SvgTrash: (props: SVGProps<SVGSVGElement>) =>
|
|
26
|
+
declare const SvgTrash: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
|
|
27
27
|
|
|
28
|
-
export { SvgAccount as
|
|
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 };
|