@animateicons/vanilla 0.0.0-stage → 0.2.0

package/CHANGELOG.md

@@ -0,0 +1,13 @@
+# @animateicons/vanilla
+
+## 0.2.0
+
+- Added 330 Lucide icons, so there are now 1500 (999 Lucide and 501 Huge). The same set as `@animateicons/react` 0.13.0, for example `ArrowBigDown`, `MonitorCheck`, `MapPinPlus`, `CalendarSync` and `StarHalf`, in the `lucide` subpath and in `dist/cdn/lucide.js`.
+- Shields now tilt on their bottom tip like they took a hit, and `Database` and `DatabaseBackup` drop a small record into the open top, the same as in React.
+- The Lucide CDN script, which holds every Lucide icon, grows from about 69 kB to about 84 kB compressed. Importing single icons costs the same as before.
+- No API changes.
+
+## 0.1.0
+
+- First release. 1170 animated icons (669 Lucide and 501 Huge) for plain JavaScript, with `createIcon`, the `<animate-icons>` custom element and a CDN script per library.
+- Plays the same animations as `@animateicons/react`, generated from the same source.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Avijit Dey
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,72 @@
-# Temporary Holding Version
+# @animateicons/vanilla
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+1170 animated SVG icons for plain JavaScript, web components and every framework without its own package (Svelte, Solid, Astro, server templates). The same motion as [`@animateicons/react`](https://www.npmjs.com/package/@animateicons/react), with no framework needed.
+
+[![npm](https://img.shields.io/npm/v/@animateicons/vanilla?color=f45b48)](https://www.npmjs.com/package/@animateicons/vanilla)
+[![license](https://img.shields.io/npm/l/@animateicons/vanilla?color=f45b48)](./LICENSE)
+
+Docs: [animateicons.in/icons/docs/vanilla](https://animateicons.in/icons/docs/vanilla). Browse every icon at [animateicons.in](https://animateicons.in).
+
+## Installation
+
+```bash
+npm i @animateicons/vanilla
+```
+
+## Usage
+
+Every icon is plain data, imported from the `lucide` or `huge` subpath. Names are the icon name in PascalCase: `bell-ring` is `BellRing`.
+
+```js
+import { createIcon } from "@animateicons/vanilla";
+import { BellRing } from "@animateicons/vanilla/lucide";
+
+const icon = createIcon(BellRing, { size: 32, color: "tomato" });
+document.querySelector("#bell").append(icon);
+```
+
+The icon animates on hover. Call `icon.startAnimation()` and `icon.stopAnimation()` to play it yourself, and `icon.destroy()` when you remove it.
+
+## Custom element
+
+Register the icons you use once, then write the tag anywhere, including inside Svelte, Solid or Astro pages:
+
+```html
+<script type="module">
+	import { defineIcons } from "@animateicons/vanilla";
+	import { Bell, Heart } from "@animateicons/vanilla/lucide";
+
+	defineIcons({ Bell, Heart });
+</script>
+
+<animate-icons name="bell" size="32" color="tomato"></animate-icons>
+```
+
+Attributes: `name`, `library` (`lucide` or `huge`, only needed when both have the name), `size`, `color`, `duration` and `is-animated`. The element has `startAnimation()` and `stopAnimation()`.
+
+## CDN
+
+For pages with no build step, one script registers every icon of a library:
+
+```html
+<script src="https://cdn.jsdelivr.net/npm/@animateicons/vanilla/dist/cdn/lucide.js"></script>
+
+<animate-icons name="bell"></animate-icons>
+```
+
+Use `dist/cdn/huge.js` for Huge icons. The script also exposes `AnimateIcons.createIcon`, `AnimateIcons.defineIcons` and `AnimateIcons.icons`. It holds every icon of the library (about 84 kB for Lucide and 113 kB for Huge, compressed), so prefer imports when you have a bundler.
+
+## Options
+
+| Option       | Type      | Default        |
+| ------------ | --------- | -------------- |
+| `size`       | `number`  | `24`           |
+| `color`      | `string`  | `currentColor` |
+| `duration`   | `number`  | `1`            |
+| `isAnimated` | `boolean` | `true`         |
+
+`duration` multiplies every duration and delay, so `2` plays at half speed. `isAnimated: false` turns hover off, while `startAnimation()` still works. With reduced motion turned on, hover does nothing and `startAnimation()` keeps the icon at rest.
+
+## License
+
+MIT. The icon shapes come from Lucide and Huge Icons, see [THIRD_PARTY_NOTICES.md](./THIRD_PARTY_NOTICES.md).

package/THIRD_PARTY_NOTICES.md

@@ -0,0 +1,81 @@
+# Third-party notices
+
+AnimateIcons icons are based on icon shapes from the projects below. Their licenses say the copyright notice must stay with copies of the icons, so the notices are included here.
+
+## Lucide
+
+Source: https://github.com/lucide-icons/lucide
+
+```
+ISC License
+
+Copyright (c) 2026 Lucide Icons and Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
+```
+
+### Feather
+
+Some Lucide icons are derived from Feather (https://github.com/feathericons/feather). Lucide lists them in its license file: https://github.com/lucide-icons/lucide/blob/main/LICENSE
+
+```
+The MIT License (MIT)
+
+Copyright (c) 2013-present Cole Bemis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+```
+
+## Hugeicons
+
+Source: https://github.com/hugeicons/hugeicons (the free `@hugeicons/core-free-icons` set)
+
+```
+MIT License
+
+Copyright (c) 2025 Hugeicons
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+```