aliveicon 1.7.0 → 1.8.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 +4 -4
- package/dist/cjs/icons/c/ChartBellCurve.js +28 -0
- package/dist/cjs/icons/c/ChartBellCurve.js.map +1 -0
- package/dist/cjs/index.js +2 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/icons/c/ChartBellCurve.js +24 -0
- package/dist/esm/icons/c/ChartBellCurve.js.map +1 -0
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/types/icons/c/ChartBellCurve.d.ts +3 -0
- package/dist/types/index.d.ts +1 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -6,11 +6,11 @@
|
|
|
6
6
|
<a href="https://www.npmjs.com/package/aliveicon"><img src="https://img.shields.io/npm/v/aliveicon.svg?color=blue" alt="npm version" /></a>
|
|
7
7
|
<a href="https://www.npmjs.com/package/aliveicon"><img src="https://img.shields.io/npm/dm/aliveicon.svg?color=blue" alt="npm downloads" /></a>
|
|
8
8
|
<a href="https://github.com/Hemang-patel-9/aliveicon/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/aliveicon.svg?color=green" alt="license" /></a>
|
|
9
|
-
<img src="https://img.shields.io/badge/icons-
|
|
9
|
+
<img src="https://img.shields.io/badge/icons-1325-orange" alt="icon count" />
|
|
10
10
|
<img src="https://img.shields.io/badge/types-included-blue" alt="typescript" />
|
|
11
11
|
</p>
|
|
12
12
|
|
|
13
|
-
`aliveicon` is a set of **
|
|
13
|
+
`aliveicon` is a set of **1325 animated SVG icons** for React. Each icon is a component that animates its strokes with [Framer Motion](https://motion.dev). Drop one in and it comes alive on hover, on click, or as soon as it mounts.
|
|
14
14
|
|
|
15
15
|
---
|
|
16
16
|
|
|
@@ -148,7 +148,7 @@ The SVG inside each icon has `aria-hidden="true"`, so screen readers skip decora
|
|
|
148
148
|
|
|
149
149
|
## 📚 Available icons
|
|
150
150
|
|
|
151
|
-
`aliveicon` ships **
|
|
151
|
+
`aliveicon` ships **1325 icons**, and more are being added. Import any icon by its PascalCase name:
|
|
152
152
|
|
|
153
153
|
```tsx
|
|
154
154
|
import { CircleCheck, ChartLine, Wifi } from 'aliveicon';
|
|
@@ -158,7 +158,7 @@ import { CircleCheck, ChartLine, Wifi } from 'aliveicon';
|
|
|
158
158
|
| ----- | ----- | -------- |
|
|
159
159
|
| **A** | 118 | `Activity`, `Airplay`, `AlarmClock`, `Anchor`, `Anvil`, `ArrowRight`, `ArrowUpRight`, `Atom`, `Award` |
|
|
160
160
|
| **B** | 163 | `Battery`, `Bell`, `Bluetooth`, `Book`, `Bot`, `Brain`, `Broom`, `Bug`, `Building` |
|
|
161
|
-
| **C** |
|
|
161
|
+
| **C** | 320 | `Calendar`, `Camera`, `Car`, `ChartLine`, `Check`, `Circle`, `Clock`, `Cloud`, `Cog`, `Copy` |
|
|
162
162
|
| **D** | 59 | `Database`, `Dice1`, `Diamond`, `Disc`, `DoorOpen`, `Download`, `Droplet`, `Dumbbell` |
|
|
163
163
|
| **E** | 32 | `Earth`, `Egg`, `Eject`, `Ellipsis`, `Eraser`, `Euro`, `Expand`, `Eye` |
|
|
164
164
|
| **G** | 63 | `Gamepad`, `Gauge`, `Gem`, `Ghost`, `Gift`, `GitBranch`, `Globe`, `Grid3x3`, `Guitar` |
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
|
+
|
|
6
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
+
var framerMotion = require('framer-motion');
|
|
8
|
+
var react = require('react');
|
|
9
|
+
var cn = require('../../lib/cn.js');
|
|
10
|
+
var useAnimatedIcon = require('../../lib/use-animated-icon.js');
|
|
11
|
+
|
|
12
|
+
const drawVariants = {
|
|
13
|
+
normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
|
|
14
|
+
animate: ([delay, from, duration]) => ({
|
|
15
|
+
pathLength: [0, 1],
|
|
16
|
+
pathOffset: [from, 0],
|
|
17
|
+
opacity: [0, 1],
|
|
18
|
+
transition: { duration, delay, ease: 'easeInOut' },
|
|
19
|
+
}),
|
|
20
|
+
};
|
|
21
|
+
const ChartBellCurve = react.forwardRef(({ className, size = 28, style, ...props }, ref) => {
|
|
22
|
+
const { controls, iconProps } = useAnimatedIcon.useAnimatedIcon(ref, props);
|
|
23
|
+
return (jsxRuntime.jsx("div", { className: cn.cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxRuntime.jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsxRuntime.jsx(framerMotion.motion.path, { d: "M3 3v16a2 2 0 0 0 2 2h16", variants: drawVariants, custom: [0, 0, 0.35], initial: "normal", animate: controls }), jsxRuntime.jsx(framerMotion.motion.path, { d: "M7 16c3.5 0 2.5-10 6-10s2.5 10 6 10", variants: drawVariants, custom: [0.2, 0.5, 0.6], initial: "normal", animate: controls })] }) }));
|
|
24
|
+
});
|
|
25
|
+
ChartBellCurve.displayName = 'ChartBellCurve';
|
|
26
|
+
|
|
27
|
+
exports.ChartBellCurve = ChartBellCurve;
|
|
28
|
+
//# sourceMappingURL=ChartBellCurve.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChartBellCurve.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/cjs/index.js
CHANGED
|
@@ -352,6 +352,7 @@ var ChartBarBig = require('./icons/c/ChartBarBig.js');
|
|
|
352
352
|
var ChartBarDecreasing = require('./icons/c/ChartBarDecreasing.js');
|
|
353
353
|
var ChartBarIncreasing = require('./icons/c/ChartBarIncreasing.js');
|
|
354
354
|
var ChartBarStacked = require('./icons/c/ChartBarStacked.js');
|
|
355
|
+
var ChartBellCurve = require('./icons/c/ChartBellCurve.js');
|
|
355
356
|
var ChartCandlestick = require('./icons/c/ChartCandlestick.js');
|
|
356
357
|
var ChartColumn = require('./icons/c/ChartColumn.js');
|
|
357
358
|
var ChartColumnBig = require('./icons/c/ChartColumnBig.js');
|
|
@@ -1689,6 +1690,7 @@ exports.ChartBarBig = ChartBarBig.ChartBarBig;
|
|
|
1689
1690
|
exports.ChartBarDecreasing = ChartBarDecreasing.ChartBarDecreasing;
|
|
1690
1691
|
exports.ChartBarIncreasing = ChartBarIncreasing.ChartBarIncreasing;
|
|
1691
1692
|
exports.ChartBarStacked = ChartBarStacked.ChartBarStacked;
|
|
1693
|
+
exports.ChartBellCurve = ChartBellCurve.ChartBellCurve;
|
|
1692
1694
|
exports.ChartCandlestick = ChartCandlestick.ChartCandlestick;
|
|
1693
1695
|
exports.ChartColumn = ChartColumn.ChartColumn;
|
|
1694
1696
|
exports.ChartColumnBig = ChartColumnBig.ChartColumnBig;
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
+
import { motion } from 'framer-motion';
|
|
4
|
+
import { forwardRef } from 'react';
|
|
5
|
+
import { cn } from '../../lib/cn.js';
|
|
6
|
+
import { useAnimatedIcon } from '../../lib/use-animated-icon.js';
|
|
7
|
+
|
|
8
|
+
const drawVariants = {
|
|
9
|
+
normal: { pathLength: 1, pathOffset: 0, opacity: 1, transition: { duration: 0.2 } },
|
|
10
|
+
animate: ([delay, from, duration]) => ({
|
|
11
|
+
pathLength: [0, 1],
|
|
12
|
+
pathOffset: [from, 0],
|
|
13
|
+
opacity: [0, 1],
|
|
14
|
+
transition: { duration, delay, ease: 'easeInOut' },
|
|
15
|
+
}),
|
|
16
|
+
};
|
|
17
|
+
const ChartBellCurve = forwardRef(({ className, size = 28, style, ...props }, ref) => {
|
|
18
|
+
const { controls, iconProps } = useAnimatedIcon(ref, props);
|
|
19
|
+
return (jsx("div", { className: cn('inline-block', className), style: { width: size, height: size, ...style }, ...iconProps, children: jsxs("svg", { "aria-hidden": "true", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", width: "100%", height: "100%", children: [jsx(motion.path, { d: "M3 3v16a2 2 0 0 0 2 2h16", variants: drawVariants, custom: [0, 0, 0.35], initial: "normal", animate: controls }), jsx(motion.path, { d: "M7 16c3.5 0 2.5-10 6-10s2.5 10 6 10", variants: drawVariants, custom: [0.2, 0.5, 0.6], initial: "normal", animate: controls })] }) }));
|
|
20
|
+
});
|
|
21
|
+
ChartBellCurve.displayName = 'ChartBellCurve';
|
|
22
|
+
|
|
23
|
+
export { ChartBellCurve };
|
|
24
|
+
//# sourceMappingURL=ChartBellCurve.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChartBellCurve.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/esm/index.js
CHANGED
|
@@ -348,6 +348,7 @@ export { ChartBarBig } from './icons/c/ChartBarBig.js';
|
|
|
348
348
|
export { ChartBarDecreasing } from './icons/c/ChartBarDecreasing.js';
|
|
349
349
|
export { ChartBarIncreasing } from './icons/c/ChartBarIncreasing.js';
|
|
350
350
|
export { ChartBarStacked } from './icons/c/ChartBarStacked.js';
|
|
351
|
+
export { ChartBellCurve } from './icons/c/ChartBellCurve.js';
|
|
351
352
|
export { ChartCandlestick } from './icons/c/ChartCandlestick.js';
|
|
352
353
|
export { ChartColumn } from './icons/c/ChartColumn.js';
|
|
353
354
|
export { ChartColumnBig } from './icons/c/ChartColumnBig.js';
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/types/index.d.ts
CHANGED
|
@@ -348,6 +348,7 @@ export { ChartBarBig } from './icons/c/ChartBarBig';
|
|
|
348
348
|
export { ChartBarDecreasing } from './icons/c/ChartBarDecreasing';
|
|
349
349
|
export { ChartBarIncreasing } from './icons/c/ChartBarIncreasing';
|
|
350
350
|
export { ChartBarStacked } from './icons/c/ChartBarStacked';
|
|
351
|
+
export { ChartBellCurve } from './icons/c/ChartBellCurve';
|
|
351
352
|
export { ChartCandlestick } from './icons/c/ChartCandlestick';
|
|
352
353
|
export { ChartColumn } from './icons/c/ChartColumn';
|
|
353
354
|
export { ChartColumnBig } from './icons/c/ChartColumnBig';
|