naive-icons 1.0.0 → 1.0.2

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/CHANGELOG.md CHANGED
@@ -17,6 +17,19 @@
17
17
  - 详情弹窗支持键盘方向键连续切换图标,打开时背景内容设为 inert
18
18
  - 无障碍补强:skip link、aria-live 结果计数、标签页方向键切换、焦点归还
19
19
 
20
+ ## 1.0.2
21
+
22
+ 修复
23
+
24
+ - 修复组件不传 `size` 时没有明确尺寸的问题:`normalizeIconProps` 现在始终向 svg 写入 `width` / `height`,默认 24,保证 `<HomeIcon />` 也有稳定的 24px 尺寸
25
+ - 顺手补上默认 `fill="none"`,避免与 SVG 内部已有的 `fill` 属性在覆盖时产生歧义
26
+
27
+ ## 1.0.1
28
+
29
+ 修复
30
+
31
+ - 修复 1.0.0 中组件未真正处理 `size` 与 `color` 属性的问题:现在 `size` 会同时映射为 `width` 与 `height`、`color` 会映射为描边 `stroke`,行为与 README 文档示例一致;`strokeWidth` 同样正确透传
32
+
20
33
  ## 1.0.0
21
34
 
22
35
  首个正式版本发布。
package/README.en.md CHANGED
@@ -1,3 +1,5 @@
1
+ <h1>Naive Icons</h1>
2
+
1
3
  <p align="right">
2
4
  <a href="./README.md">中文</a> | <a href="./README.en.md">English</a>
3
5
  </p>
@@ -6,10 +8,20 @@
6
8
  <img src="assets/logo.svg" alt="Naive Icons" width="132" height="132">
7
9
  </p>
8
10
 
9
- <h1 align="center">Naive Icons</h1>
10
-
11
11
  <p align="center">Hand-drawn "naive folk art" style SVG icon library, built for React and TypeScript</p>
12
12
 
13
+ <p align="center">
14
+ <a href="https://github.com/guokaigdg/naive-icons/stargazers"><img src="https://img.shields.io/github/stars/guokaigdg/naive-icons?style=flat-square&color=E9C46A" alt="GitHub stars"></a>
15
+ <a href="https://www.npmjs.com/package/naive-icons"><img src="https://img.shields.io/npm/v/naive-icons?style=flat-square&color=E76F51" alt="npm version"></a>
16
+ <a href="https://www.npmjs.com/package/naive-icons"><img src="https://img.shields.io/npm/dm/naive-icons?style=flat-square&color=2A9D8F" alt="npm downloads"></a>
17
+ <a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-264653?style=flat-square" alt="license: MIT"></a>
18
+ <br/>
19
+ <img src="https://img.shields.io/badge/React-61DAFB?style=flat-square&logo=react&logoColor=black" alt="React">
20
+ <img src="https://img.shields.io/badge/TypeScript-3178C6?style=flat-square&logo=typescript&logoColor=white" alt="TypeScript">
21
+ <img src="https://img.shields.io/badge/SVG-FFB13B?style=flat-square&logoColor=black" alt="SVG">
22
+ </p>
23
+
24
+
13
25
  Naive Icons is a hand-drawn SVG icon library with a naive folk art style, built for React and TypeScript. All 101 icons are AI-generated original works.
14
26
 
15
27
  Each icon is drawn on a 48x48 grid with a 3.5 stroke, rounded line caps, and a unified retro palette — keeping the charming clumsiness and warmth of hand-drawn illustration. Some icons even feature a pair of dot eyes and a little smile, adding a touch of humanity to your interface.
package/README.md CHANGED
@@ -1,3 +1,6 @@
1
+
2
+ <h1>Naive Icons</h1>
3
+
1
4
  <p align="right">
2
5
  <a href="./README.md">中文</a> | <a href="./README.en.md">English</a>
3
6
  </p>
@@ -6,10 +9,20 @@
6
9
  <img src="assets/logo.svg" alt="Naive Icons" width="132" height="132">
7
10
  </p>
8
11
 
9
- <h1 align="center">Naive Icons</h1>
10
12
 
11
13
  <p align="center">手绘 naive folk art 风格的 SVG 图标库,为 React 与 TypeScript 打造</p>
12
14
 
15
+ <p align="center">
16
+ <a href="https://github.com/guokaigdg/naive-icons/stargazers"><img src="https://img.shields.io/github/stars/guokaigdg/naive-icons?style=flat-square&color=E9C46A" alt="GitHub stars"></a>
17
+ <a href="https://www.npmjs.com/package/naive-icons"><img src="https://img.shields.io/npm/v/naive-icons?style=flat-square&color=E76F51" alt="npm version"></a>
18
+ <a href="https://www.npmjs.com/package/naive-icons"><img src="https://img.shields.io/npm/dm/naive-icons?style=flat-square&color=2A9D8F" alt="npm downloads"></a>
19
+ <a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-264653?style=flat-square" alt="license: MIT"></a>
20
+ <br/>
21
+ <img src="https://img.shields.io/badge/React-61DAFB?style=flat-square&logo=react&logoColor=black" alt="React">
22
+ <img src="https://img.shields.io/badge/TypeScript-3178C6?style=flat-square&logo=typescript&logoColor=white" alt="TypeScript">
23
+ <img src="https://img.shields.io/badge/SVG-FFB13B?style=flat-square&logoColor=black" alt="SVG">
24
+ </p>
25
+
13
26
  Naive Icons 是一套手绘 naive folk art 风格的 SVG 图标库,为 React 与 TypeScript 打造。全部 101 个图标由 AI 生成,均为原创作品。
14
27
 
15
28
  每一个图标都建立在 48x48 的网格上,使用 3.5 的粗描边、圆角线帽与统一的复古调色板,并保留了手绘插画特有的笨拙感与温度——部分图标还带有一对小圆点眼睛和微笑,让界面多一点点人情味。
package/dist/index.d.mts CHANGED
@@ -1,240 +1,241 @@
1
1
  import * as react from 'react';
2
2
  import { SVGProps, FC } from 'react';
3
3
 
4
- declare const AirplaneIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
4
+ /** Naive Icons 所有图标的通用 Props(继承原生 SVG 属性) */
5
+ interface IconProps extends SVGProps<SVGSVGElement> {
6
+ /** 图标尺寸,宽高相等,默认 24 */
7
+ size?: number | string;
8
+ /** 描边颜色,默认 currentColor */
9
+ color?: string;
10
+ /** 描边宽度,默认 3.5(相对 48x48 画布) */
11
+ strokeWidth?: number | string;
12
+ /** 填充色,默认 none */
13
+ fill?: string;
14
+ /** 无障碍标题 */
15
+ title?: string;
16
+ }
5
17
 
6
- declare const AnchorIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
18
+ /** Naive Icons 调色板 */
19
+ declare const NAIVE_PALETTE: {
20
+ readonly ink: "#2A2A2A";
21
+ readonly navy: "#264653";
22
+ readonly orange: "#E76F51";
23
+ readonly yellow: "#E9C46A";
24
+ readonly pink: "#F4A6A4";
25
+ readonly green: "#588157";
26
+ readonly teal: "#2A9D8F";
27
+ readonly brown: "#8B5E3C";
28
+ readonly cream: "#FAEDCD";
29
+ };
30
+ type PaletteColor = keyof typeof NAIVE_PALETTE;
31
+ /** Naive Icons 图标组件名(共 101 个) */
32
+ type IconName = 'AirplaneIcon' | 'AnchorIcon' | 'AppleIcon' | 'BalloonIcon' | 'BearIcon' | 'BeeIcon' | 'BellIcon' | 'BicycleIcon' | 'BirdIcon' | 'BookIcon' | 'BookmarkIcon' | 'BulbIcon' | 'ButterflyIcon' | 'CactusIcon' | 'CakeIcon' | 'CalendarIcon' | 'CameraIcon' | 'CandleIcon' | 'CarIcon' | 'CartIcon' | 'CatIcon' | 'ChatIcon' | 'CheckIcon' | 'CherryIcon' | 'ClockIcon' | 'CloseIcon' | 'CloudIcon' | 'CodeIcon' | 'CoffeeIcon' | 'CompassIcon' | 'CreditCardIcon' | 'DogIcon' | 'DonutIcon' | 'DownloadIcon' | 'EditIcon' | 'EyeIcon' | 'FileIcon' | 'FishIcon' | 'FlagIcon' | 'FlameIcon' | 'FlowerIcon' | 'FolderIcon' | 'FoxIcon' | 'FrogIcon' | 'GiftIcon' | 'GlobeIcon' | 'HeadphonesIcon' | 'HeartIcon' | 'HomeIcon' | 'IcecreamIcon' | 'ImageIcon' | 'KeyIcon' | 'LadybugIcon' | 'LampIcon' | 'LeafIcon' | 'LemonIcon' | 'LocationIcon' | 'LockIcon' | 'MagnetIcon' | 'MailIcon' | 'MapIcon' | 'MicIcon' | 'MoonIcon' | 'MushroomIcon' | 'MusicIcon' | 'OwlIcon' | 'PaintbrushIcon' | 'PencilIcon' | 'PenguinIcon' | 'PhoneIcon' | 'PlayIcon' | 'PlusIcon' | 'RabbitIcon' | 'RainbowIcon' | 'RefreshIcon' | 'RocketIcon' | 'SailboatIcon' | 'SaveIcon' | 'SearchIcon' | 'SettingsIcon' | 'ShareIcon' | 'ShoppingBagIcon' | 'SmileIcon' | 'SnailIcon' | 'SnowflakeIcon' | 'StarIcon' | 'StrawberryIcon' | 'SunIcon' | 'TagIcon' | 'ThermometerIcon' | 'ThumbsUpIcon' | 'TrainIcon' | 'TrashIcon' | 'TreeIcon' | 'TrophyIcon' | 'UmbrellaIcon' | 'UploadIcon' | 'UserIcon' | 'VideoIcon' | 'WatermelonIcon' | 'WifiIcon';
33
+ /** Naive Icons 图标组件类型 */
34
+ type IconComponent = FC<IconProps>;
35
+ /** Naive Icons 图标分类 */
36
+ declare const ICON_CATEGORIES: readonly ["interface", "action", "media", "navigation", "communication", "nature", "animals", "food", "objects", "transport", "emoji"];
37
+ type IconCategory = (typeof ICON_CATEGORIES)[number];
7
38
 
8
- declare const AppleIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
39
+ declare const AirplaneIcon: (props: IconProps) => react.JSX.Element;
9
40
 
10
- declare const BalloonIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
41
+ declare const AnchorIcon: (props: IconProps) => react.JSX.Element;
11
42
 
12
- declare const BearIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
43
+ declare const AppleIcon: (props: IconProps) => react.JSX.Element;
13
44
 
14
- declare const BeeIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
45
+ declare const BalloonIcon: (props: IconProps) => react.JSX.Element;
15
46
 
16
- declare const BellIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
47
+ declare const BearIcon: (props: IconProps) => react.JSX.Element;
17
48
 
18
- declare const BicycleIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
49
+ declare const BeeIcon: (props: IconProps) => react.JSX.Element;
19
50
 
20
- declare const BirdIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
51
+ declare const BellIcon: (props: IconProps) => react.JSX.Element;
21
52
 
22
- declare const BookIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
53
+ declare const BicycleIcon: (props: IconProps) => react.JSX.Element;
23
54
 
24
- declare const BookmarkIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
55
+ declare const BirdIcon: (props: IconProps) => react.JSX.Element;
25
56
 
26
- declare const BulbIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
57
+ declare const BookIcon: (props: IconProps) => react.JSX.Element;
27
58
 
28
- declare const ButterflyIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
59
+ declare const BookmarkIcon: (props: IconProps) => react.JSX.Element;
29
60
 
30
- declare const CactusIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
61
+ declare const BulbIcon: (props: IconProps) => react.JSX.Element;
31
62
 
32
- declare const CakeIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
63
+ declare const ButterflyIcon: (props: IconProps) => react.JSX.Element;
33
64
 
34
- declare const CalendarIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
65
+ declare const CactusIcon: (props: IconProps) => react.JSX.Element;
35
66
 
36
- declare const CameraIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
67
+ declare const CakeIcon: (props: IconProps) => react.JSX.Element;
37
68
 
38
- declare const CandleIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
69
+ declare const CalendarIcon: (props: IconProps) => react.JSX.Element;
39
70
 
40
- declare const CarIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
71
+ declare const CameraIcon: (props: IconProps) => react.JSX.Element;
41
72
 
42
- declare const CartIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
73
+ declare const CandleIcon: (props: IconProps) => react.JSX.Element;
43
74
 
44
- declare const CatIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
75
+ declare const CarIcon: (props: IconProps) => react.JSX.Element;
45
76
 
46
- declare const ChatIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
77
+ declare const CartIcon: (props: IconProps) => react.JSX.Element;
47
78
 
48
- declare const CheckIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
79
+ declare const CatIcon: (props: IconProps) => react.JSX.Element;
49
80
 
50
- declare const CherryIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
81
+ declare const ChatIcon: (props: IconProps) => react.JSX.Element;
51
82
 
52
- declare const ClockIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
83
+ declare const CheckIcon: (props: IconProps) => react.JSX.Element;
53
84
 
54
- declare const CloseIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
85
+ declare const CherryIcon: (props: IconProps) => react.JSX.Element;
55
86
 
56
- declare const CloudIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
87
+ declare const ClockIcon: (props: IconProps) => react.JSX.Element;
57
88
 
58
- declare const CodeIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
89
+ declare const CloseIcon: (props: IconProps) => react.JSX.Element;
59
90
 
60
- declare const CoffeeIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
91
+ declare const CloudIcon: (props: IconProps) => react.JSX.Element;
61
92
 
62
- declare const CompassIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
93
+ declare const CodeIcon: (props: IconProps) => react.JSX.Element;
63
94
 
64
- declare const CreditCardIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
95
+ declare const CoffeeIcon: (props: IconProps) => react.JSX.Element;
65
96
 
66
- declare const DogIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
97
+ declare const CompassIcon: (props: IconProps) => react.JSX.Element;
67
98
 
68
- declare const DonutIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
99
+ declare const CreditCardIcon: (props: IconProps) => react.JSX.Element;
69
100
 
70
- declare const DownloadIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
101
+ declare const DogIcon: (props: IconProps) => react.JSX.Element;
71
102
 
72
- declare const EditIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
103
+ declare const DonutIcon: (props: IconProps) => react.JSX.Element;
73
104
 
74
- declare const EyeIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
105
+ declare const DownloadIcon: (props: IconProps) => react.JSX.Element;
75
106
 
76
- declare const FileIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
107
+ declare const EditIcon: (props: IconProps) => react.JSX.Element;
77
108
 
78
- declare const FishIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
109
+ declare const EyeIcon: (props: IconProps) => react.JSX.Element;
79
110
 
80
- declare const FlagIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
111
+ declare const FileIcon: (props: IconProps) => react.JSX.Element;
81
112
 
82
- declare const FlameIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
113
+ declare const FishIcon: (props: IconProps) => react.JSX.Element;
83
114
 
84
- declare const FlowerIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
115
+ declare const FlagIcon: (props: IconProps) => react.JSX.Element;
85
116
 
86
- declare const FolderIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
117
+ declare const FlameIcon: (props: IconProps) => react.JSX.Element;
87
118
 
88
- declare const FoxIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
119
+ declare const FlowerIcon: (props: IconProps) => react.JSX.Element;
89
120
 
90
- declare const FrogIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
121
+ declare const FolderIcon: (props: IconProps) => react.JSX.Element;
91
122
 
92
- declare const GiftIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
123
+ declare const FoxIcon: (props: IconProps) => react.JSX.Element;
93
124
 
94
- declare const GlobeIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
125
+ declare const FrogIcon: (props: IconProps) => react.JSX.Element;
95
126
 
96
- declare const HeadphonesIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
127
+ declare const GiftIcon: (props: IconProps) => react.JSX.Element;
97
128
 
98
- declare const HeartIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
129
+ declare const GlobeIcon: (props: IconProps) => react.JSX.Element;
99
130
 
100
- declare const HomeIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
131
+ declare const HeadphonesIcon: (props: IconProps) => react.JSX.Element;
101
132
 
102
- declare const IcecreamIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
133
+ declare const HeartIcon: (props: IconProps) => react.JSX.Element;
103
134
 
104
- declare const ImageIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
135
+ declare const HomeIcon: (props: IconProps) => react.JSX.Element;
105
136
 
106
- declare const KeyIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
137
+ declare const IcecreamIcon: (props: IconProps) => react.JSX.Element;
107
138
 
108
- declare const LadybugIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
139
+ declare const ImageIcon: (props: IconProps) => react.JSX.Element;
109
140
 
110
- declare const LampIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
141
+ declare const KeyIcon: (props: IconProps) => react.JSX.Element;
111
142
 
112
- declare const LeafIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
143
+ declare const LadybugIcon: (props: IconProps) => react.JSX.Element;
113
144
 
114
- declare const LemonIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
145
+ declare const LampIcon: (props: IconProps) => react.JSX.Element;
115
146
 
116
- declare const LocationIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
147
+ declare const LeafIcon: (props: IconProps) => react.JSX.Element;
117
148
 
118
- declare const LockIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
149
+ declare const LemonIcon: (props: IconProps) => react.JSX.Element;
119
150
 
120
- declare const MagnetIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
151
+ declare const LocationIcon: (props: IconProps) => react.JSX.Element;
121
152
 
122
- declare const MailIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
153
+ declare const LockIcon: (props: IconProps) => react.JSX.Element;
123
154
 
124
- declare const MapIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
155
+ declare const MagnetIcon: (props: IconProps) => react.JSX.Element;
125
156
 
126
- declare const MicIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
157
+ declare const MailIcon: (props: IconProps) => react.JSX.Element;
127
158
 
128
- declare const MoonIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
159
+ declare const MapIcon: (props: IconProps) => react.JSX.Element;
129
160
 
130
- declare const MushroomIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
161
+ declare const MicIcon: (props: IconProps) => react.JSX.Element;
131
162
 
132
- declare const MusicIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
163
+ declare const MoonIcon: (props: IconProps) => react.JSX.Element;
133
164
 
134
- declare const OwlIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
165
+ declare const MushroomIcon: (props: IconProps) => react.JSX.Element;
135
166
 
136
- declare const PaintbrushIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
167
+ declare const MusicIcon: (props: IconProps) => react.JSX.Element;
137
168
 
138
- declare const PencilIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
169
+ declare const OwlIcon: (props: IconProps) => react.JSX.Element;
139
170
 
140
- declare const PenguinIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
171
+ declare const PaintbrushIcon: (props: IconProps) => react.JSX.Element;
141
172
 
142
- declare const PhoneIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
173
+ declare const PencilIcon: (props: IconProps) => react.JSX.Element;
143
174
 
144
- declare const PlayIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
175
+ declare const PenguinIcon: (props: IconProps) => react.JSX.Element;
145
176
 
146
- declare const PlusIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
177
+ declare const PhoneIcon: (props: IconProps) => react.JSX.Element;
147
178
 
148
- declare const RabbitIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
179
+ declare const PlayIcon: (props: IconProps) => react.JSX.Element;
149
180
 
150
- declare const RainbowIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
181
+ declare const PlusIcon: (props: IconProps) => react.JSX.Element;
151
182
 
152
- declare const RefreshIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
183
+ declare const RabbitIcon: (props: IconProps) => react.JSX.Element;
153
184
 
154
- declare const RocketIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
185
+ declare const RainbowIcon: (props: IconProps) => react.JSX.Element;
155
186
 
156
- declare const SailboatIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
187
+ declare const RefreshIcon: (props: IconProps) => react.JSX.Element;
157
188
 
158
- declare const SaveIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
189
+ declare const RocketIcon: (props: IconProps) => react.JSX.Element;
159
190
 
160
- declare const SearchIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
191
+ declare const SailboatIcon: (props: IconProps) => react.JSX.Element;
161
192
 
162
- declare const SettingsIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
193
+ declare const SaveIcon: (props: IconProps) => react.JSX.Element;
163
194
 
164
- declare const ShareIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
195
+ declare const SearchIcon: (props: IconProps) => react.JSX.Element;
165
196
 
166
- declare const ShoppingBagIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
197
+ declare const SettingsIcon: (props: IconProps) => react.JSX.Element;
167
198
 
168
- declare const SmileIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
199
+ declare const ShareIcon: (props: IconProps) => react.JSX.Element;
169
200
 
170
- declare const SnailIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
201
+ declare const ShoppingBagIcon: (props: IconProps) => react.JSX.Element;
171
202
 
172
- declare const SnowflakeIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
203
+ declare const SmileIcon: (props: IconProps) => react.JSX.Element;
173
204
 
174
- declare const StarIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
205
+ declare const SnailIcon: (props: IconProps) => react.JSX.Element;
175
206
 
176
- declare const StrawberryIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
207
+ declare const SnowflakeIcon: (props: IconProps) => react.JSX.Element;
177
208
 
178
- declare const SunIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
209
+ declare const StarIcon: (props: IconProps) => react.JSX.Element;
179
210
 
180
- declare const TagIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
211
+ declare const StrawberryIcon: (props: IconProps) => react.JSX.Element;
181
212
 
182
- declare const ThermometerIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
213
+ declare const SunIcon: (props: IconProps) => react.JSX.Element;
183
214
 
184
- declare const ThumbsUpIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
215
+ declare const TagIcon: (props: IconProps) => react.JSX.Element;
185
216
 
186
- declare const TrainIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
217
+ declare const ThermometerIcon: (props: IconProps) => react.JSX.Element;
187
218
 
188
- declare const TrashIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
219
+ declare const ThumbsUpIcon: (props: IconProps) => react.JSX.Element;
189
220
 
190
- declare const TreeIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
221
+ declare const TrainIcon: (props: IconProps) => react.JSX.Element;
191
222
 
192
- declare const TrophyIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
223
+ declare const TrashIcon: (props: IconProps) => react.JSX.Element;
193
224
 
194
- declare const UmbrellaIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
225
+ declare const TreeIcon: (props: IconProps) => react.JSX.Element;
195
226
 
196
- declare const UploadIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
227
+ declare const TrophyIcon: (props: IconProps) => react.JSX.Element;
197
228
 
198
- declare const UserIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
229
+ declare const UmbrellaIcon: (props: IconProps) => react.JSX.Element;
199
230
 
200
- declare const VideoIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
231
+ declare const UploadIcon: (props: IconProps) => react.JSX.Element;
201
232
 
202
- declare const WatermelonIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
233
+ declare const UserIcon: (props: IconProps) => react.JSX.Element;
203
234
 
204
- declare const WifiIcon: (props: SVGProps<SVGSVGElement>) => react.JSX.Element;
235
+ declare const VideoIcon: (props: IconProps) => react.JSX.Element;
205
236
 
206
- /** Naive Icons 所有图标的通用 Props(继承原生 SVG 属性) */
207
- interface IconProps extends SVGProps<SVGSVGElement> {
208
- /** 图标尺寸,宽高相等,默认 24 */
209
- size?: number | string;
210
- /** 描边颜色,默认 currentColor */
211
- color?: string;
212
- /** 描边宽度,默认 3.5(相对 48x48 画布) */
213
- strokeWidth?: number | string;
214
- /** 填充色,默认 none */
215
- fill?: string;
216
- /** 无障碍标题 */
217
- title?: string;
218
- }
219
- /** Naive Icons 调色板 */
220
- declare const NAIVE_PALETTE: {
221
- readonly ink: "#2A2A2A";
222
- readonly navy: "#264653";
223
- readonly orange: "#E76F51";
224
- readonly yellow: "#E9C46A";
225
- readonly pink: "#F4A6A4";
226
- readonly green: "#588157";
227
- readonly teal: "#2A9D8F";
228
- readonly brown: "#8B5E3C";
229
- readonly cream: "#FAEDCD";
230
- };
231
- type PaletteColor = keyof typeof NAIVE_PALETTE;
232
- /** Naive Icons 图标组件名(共 101 个) */
233
- type IconName = 'AirplaneIcon' | 'AnchorIcon' | 'AppleIcon' | 'BalloonIcon' | 'BearIcon' | 'BeeIcon' | 'BellIcon' | 'BicycleIcon' | 'BirdIcon' | 'BookIcon' | 'BookmarkIcon' | 'BulbIcon' | 'ButterflyIcon' | 'CactusIcon' | 'CakeIcon' | 'CalendarIcon' | 'CameraIcon' | 'CandleIcon' | 'CarIcon' | 'CartIcon' | 'CatIcon' | 'ChatIcon' | 'CheckIcon' | 'CherryIcon' | 'ClockIcon' | 'CloseIcon' | 'CloudIcon' | 'CodeIcon' | 'CoffeeIcon' | 'CompassIcon' | 'CreditCardIcon' | 'DogIcon' | 'DonutIcon' | 'DownloadIcon' | 'EditIcon' | 'EyeIcon' | 'FileIcon' | 'FishIcon' | 'FlagIcon' | 'FlameIcon' | 'FlowerIcon' | 'FolderIcon' | 'FoxIcon' | 'FrogIcon' | 'GiftIcon' | 'GlobeIcon' | 'HeadphonesIcon' | 'HeartIcon' | 'HomeIcon' | 'IcecreamIcon' | 'ImageIcon' | 'KeyIcon' | 'LadybugIcon' | 'LampIcon' | 'LeafIcon' | 'LemonIcon' | 'LocationIcon' | 'LockIcon' | 'MagnetIcon' | 'MailIcon' | 'MapIcon' | 'MicIcon' | 'MoonIcon' | 'MushroomIcon' | 'MusicIcon' | 'OwlIcon' | 'PaintbrushIcon' | 'PencilIcon' | 'PenguinIcon' | 'PhoneIcon' | 'PlayIcon' | 'PlusIcon' | 'RabbitIcon' | 'RainbowIcon' | 'RefreshIcon' | 'RocketIcon' | 'SailboatIcon' | 'SaveIcon' | 'SearchIcon' | 'SettingsIcon' | 'ShareIcon' | 'ShoppingBagIcon' | 'SmileIcon' | 'SnailIcon' | 'SnowflakeIcon' | 'StarIcon' | 'StrawberryIcon' | 'SunIcon' | 'TagIcon' | 'ThermometerIcon' | 'ThumbsUpIcon' | 'TrainIcon' | 'TrashIcon' | 'TreeIcon' | 'TrophyIcon' | 'UmbrellaIcon' | 'UploadIcon' | 'UserIcon' | 'VideoIcon' | 'WatermelonIcon' | 'WifiIcon';
234
- /** Naive Icons 图标组件类型 */
235
- type IconComponent = FC<IconProps>;
236
- /** Naive Icons 图标分类 */
237
- declare const ICON_CATEGORIES: readonly ["interface", "action", "media", "navigation", "communication", "nature", "animals", "food", "objects", "transport", "emoji"];
238
- type IconCategory = (typeof ICON_CATEGORIES)[number];
237
+ declare const WatermelonIcon: (props: IconProps) => react.JSX.Element;
238
+
239
+ declare const WifiIcon: (props: IconProps) => react.JSX.Element;
239
240
 
240
241
  export { AirplaneIcon, AnchorIcon, AppleIcon, BalloonIcon, BearIcon, BeeIcon, BellIcon, BicycleIcon, BirdIcon, BookIcon, BookmarkIcon, BulbIcon, ButterflyIcon, CactusIcon, CakeIcon, CalendarIcon, CameraIcon, CandleIcon, CarIcon, CartIcon, CatIcon, ChatIcon, CheckIcon, CherryIcon, ClockIcon, CloseIcon, CloudIcon, CodeIcon, CoffeeIcon, CompassIcon, CreditCardIcon, DogIcon, DonutIcon, DownloadIcon, EditIcon, EyeIcon, FileIcon, FishIcon, FlagIcon, FlameIcon, FlowerIcon, FolderIcon, FoxIcon, FrogIcon, GiftIcon, GlobeIcon, HeadphonesIcon, HeartIcon, HomeIcon, ICON_CATEGORIES, IcecreamIcon, type IconCategory, type IconComponent, type IconName, type IconProps, ImageIcon, KeyIcon, LadybugIcon, LampIcon, LeafIcon, LemonIcon, LocationIcon, LockIcon, MagnetIcon, MailIcon, MapIcon, MicIcon, MoonIcon, MushroomIcon, MusicIcon, NAIVE_PALETTE, OwlIcon, PaintbrushIcon, type PaletteColor, PencilIcon, PenguinIcon, PhoneIcon, PlayIcon, PlusIcon, RabbitIcon, RainbowIcon, RefreshIcon, RocketIcon, SailboatIcon, SaveIcon, SearchIcon, SettingsIcon, ShareIcon, ShoppingBagIcon, SmileIcon, SnailIcon, SnowflakeIcon, StarIcon, StrawberryIcon, SunIcon, TagIcon, ThermometerIcon, ThumbsUpIcon, TrainIcon, TrashIcon, TreeIcon, TrophyIcon, UmbrellaIcon, UploadIcon, UserIcon, VideoIcon, WatermelonIcon, WifiIcon };