@zentauri-ui/zentauri-components 1.8.3 → 1.8.4

package/README.md

@@ -9,7 +9,7 @@ A React UI kit for building product interfaces with Tailwind CSS. Components are
 
 The library targets **React 18+** apps that use **Tailwind CSS v4** (or an equivalent setup where Tailwind can scan this package via `@source`). Styling uses utility classes; **class-variance-authority** powers variant APIs (size, appearance, and similar props), with **clsx** and **tailwind-merge** for predictable `className` composition. Component variants are light-theme ready by default and include paired `dark:` Tailwind classes for dark-mode surfaces, text, borders, focus rings, gradients, and form controls. **Framer Motion** backs motion where a feature ships animated variants, and **react-icons** is used for iconography where applicable.
 
-Published artifacts live under `dist/`. Imports use **per-entry subpaths**: `@zentauri-ui/zentauri-components/ui/<area>` for static UI, `@zentauri-ui/zentauri-components/ui/<area>/animated` where a motion bundle exists, `@zentauri-ui/zentauri-components/charts/<type>` for Recharts-powered chart primitives, and `@zentauri-ui/zentauri-components/hooks/<entry>` for React hooks (and shared helpers under `hooks/utils`). Base UI entries do **not** re-export animated components; motion lives on its own entry so optional `framer-motion` usage stays tree-shakeable and chunk-friendly. Each entry resolves to its own ESM (`.mjs`), CJS (`.js`), and types (`.d.ts`) so bundlers pull only what you import. Most apps rely on Tailwind scanning the package sources (see installation); a separate CSS import is not required for that setup.
+Published artifacts live under `dist/`. Imports use **per-entry subpaths**: `@zentauri-ui/zentauri-components/ui/<area>` for static UI, `@zentauri-ui/zentauri-components/ui/<area>/animated` where a motion bundle exists, `@zentauri-ui/zentauri-components/animations/<name>` for standalone Motion wrappers, `@zentauri-ui/zentauri-components/charts/<type>` for Recharts-powered chart primitives, and `@zentauri-ui/zentauri-components/hooks/<entry>` for React hooks (and shared helpers under `hooks/utils`). Base UI entries do **not** re-export animated components; motion lives on its own entry so optional `framer-motion` usage stays tree-shakeable and chunk-friendly. Each entry resolves to its own ESM (`.mjs`), CJS (`.js`), and types (`.d.ts`) so bundlers pull only what you import. Most apps rely on Tailwind scanning the package sources (see installation); a separate CSS import is not required for that setup.
 
 ## Current package surface
 
@@ -17,6 +17,7 @@ Published artifacts live under `dist/`. Imports use **per-entry subpaths**: `@ze
 | ------------------- | ----: | ----------------------------------------------------- |
 | Static UI entries   |    42 | `@zentauri-ui/zentauri-components/ui/<name>`          |
 | Animated UI entries |    27 | `@zentauri-ui/zentauri-components/ui/<name>/animated` |
+| Animation entries   |    41 | `@zentauri-ui/zentauri-components/animations/<name>`  |
 | Chart entries       |     9 | `@zentauri-ui/zentauri-components/charts/<type>`      |
 | Hook entries        |    28 | `@zentauri-ui/zentauri-components/hooks/<entry>`      |
 
@@ -26,14 +27,15 @@ Published artifacts live under `dist/`. Imports use **per-entry subpaths**: `@ze
 
 | Metric     | Result           |
 | ---------- | ---------------- |
-| Test files | 76 passed (76)   |
-| Tests      | 548 passed (548) |
+| Test files | 77 passed (77)   |
+| Tests      | 591 passed (591) |
 
 | Area                        | Test files | Tests |
 | --------------------------- | ---------- | ----- |
 | Components and UI utilities | 46         | 433   |
+| Standalone animations       | 1          | 42    |
 | React hooks                 | 28         | 101   |
-| CLI and import rewriting    | 2          | 14    |
+| CLI and import rewriting    | 2          | 15    |
 
 ### Per-suite snapshot
 
@@ -45,7 +47,8 @@ Published artifacts live under `dist/`. Imports use **per-entry subpaths**: `@ze
 | `src/ui/modal/modal.test.tsx`                                           |    10 |
 | `src/ui/drawer/drawer.test.tsx`                                         |     7 |
 | `src/ui/peer-isolation.test.ts`                                         |    29 |
-| `cli/cli.integration.test.ts`                                           |     9 |
+| `cli/cli.integration.test.ts`                                           |    10 |
+| `src/animations/animations.test.tsx`                                    |    42 |
 | `src/ui/buttons/button.test.tsx`                                        |    41 |
 | `src/ui/inputs/input.test.tsx`                                          |    40 |
 | `src/ui/marquee/marquee.test.tsx`                                       |    10 |
@@ -122,6 +125,7 @@ Published artifacts live under `dist/`. Imports use **per-entry subpaths**: `@ze
 | ----------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
 | `@zentauri-ui/zentauri-components/ui/<name>`          | Single UI area: static primitives, compound parts, variants, and types. Does **not** include Framer Motion–based animated exports.                                                         |
 | `@zentauri-ui/zentauri-components/ui/<name>/animated` | Motion entry for that area when published: animated components, motion presets, and related types (depends on **framer-motion**).                                                          |
+| `@zentauri-ui/zentauri-components/animations/<name>`  | Standalone Motion wrapper and preset entry for reusable transitions such as `fade-in`, `scale-in`, and `blur-out` (depends on **framer-motion**).                                          |
 | `@zentauri-ui/zentauri-components/charts/<type>`      | Responsive Recharts chart entry for `area`, `bar`, `stacked-bar`, `radar`, `scatter`, `bubble`, `funnel`, `line`, or `pie`, with shared variants, palettes, and exported chart prop types. |
 | `@zentauri-ui/zentauri-components/hooks/<entry>`      | One hook module or `utils` (`cn`, `clampPage`, `range` from `src/lib/utils.ts`). Entries match files under `src/hooks/` (see **React hooks**).                                             |
 
@@ -140,6 +144,35 @@ Published motion entries (same `<name>` as the base UI folder):
 
 **Spinner:** only the motion entry is built—import from `@zentauri-ui/zentauri-components/ui/spinner/animated` (there is no separate `ui/spinner` static bundle).
 
+## Animations
+
+Standalone animations live outside `ui/*` under `@zentauri-ui/zentauri-components/animations/<name>`. They are small **framer-motion** wrappers around `motion.div`, designed for composing page sections, cards, panels, list items, and route-level content without coupling the motion preset to a UI primitive.
+
+**Animation entries:** `fade-in`, `fade-out`, `fade-up`, `fade-down`, `fade-left`, `fade-right`, `scale-in`, `scale-out`, `pop-in`, `blur-in`, `blur-out`, `slide-up`, `slide-down`, `slide-left`, `slide-right`, `reveal-up`, `reveal-down`, `reveal-left`, `reveal-right`, `reveal-blur`, `text-reveal`, `text-shimmer`, `rotate-in`, `pulse`, `ping`, `shake`, `bounce`, `wiggle`, `float`, `spin`, `flip`, `flip-in`, `tilt`, `magnetic`, `hover-lift`, `hover-scale`, `press`, `reorder`, `skeleton-shimmer`, `progress`, `parallax`.
+
+Each entry exports a named component and its preset object, for example `FadeIn` and `fadeInPreset`. Components accept regular `HTMLMotionProps<"div">`, so you can pass `className`, `transition`, `initial`, `animate`, `exit`, and accessibility attributes directly.
+
+For lighter customization without replacing the whole Motion target, pass `from`, `to`, and `exitTo`. These override preset values for `opacity`, `x`, `y`, `scale`, `scaleX`, `scaleY`, `rotate`, `rotateX`, `rotateY`, and `blur`.
+
+```tsx
+import { FadeIn } from "@zentauri-ui/zentauri-components/animations/fade-in";
+import { ScaleIn } from "@zentauri-ui/zentauri-components/animations/scale-in";
+
+export function MotionPanel() {
+  return (
+    <FadeIn className="rounded-xl border border-white/10 bg-white/5 p-4">
+      <ScaleIn
+        from={{ scale: 0.92, blur: 8 }}
+        to={{ scale: 1, blur: 0 }}
+        transition={{ duration: 0.2 }}
+      >
+        Content with a nested scale entrance.
+      </ScaleIn>
+    </FadeIn>
+  );
+}
+```
+
 ## Requirements
 
 - **React** and **React DOM** `>= 18` (peer dependencies)
@@ -444,7 +477,7 @@ yarn add react react-dom class-variance-authority clsx tailwind-merge
 
 #### Optional: animations, icons, and charts
 
-Add **`framer-motion`** when you import any `@zentauri-ui/zentauri-components/ui/<name>/animated` entry (including **Spinner**, which is only published under `ui/spinner/animated`). Add **`react-icons`** when using icon sets from that package. Add **`recharts`** when you import any `@zentauri-ui/zentauri-components/charts/<type>` entry or vendor charts with the CLI.
+Add **`framer-motion`** when you import any `@zentauri-ui/zentauri-components/ui/<name>/animated` entry, any `@zentauri-ui/zentauri-components/animations/<name>` entry, or **Spinner** (which is only published under `ui/spinner/animated`). Add **`react-icons`** when using icon sets from that package. Add **`recharts`** when you import any `@zentauri-ui/zentauri-components/charts/<type>` entry or vendor charts with the CLI.
 
 ```bash
 npm install framer-motion react-icons recharts
@@ -458,7 +491,7 @@ pnpm add framer-motion react-icons recharts
 yarn add framer-motion react-icons recharts
 ```
 
-Published `dist/` files **import** these packages; they are **not** vendored inside `@zentauri-ui/zentauri-components`. Static `ui/<name>` bundles do not depend on `framer-motion`; only `ui/<name>/animated` entries do. Chart bundles are isolated to `charts/<type>` entries and depend on `recharts`. Your app installs peers via `dependencies` where needed, and your bundler resolves them from `node_modules`.
+Published `dist/` files **import** these packages; they are **not** vendored inside `@zentauri-ui/zentauri-components`. Static `ui/<name>` bundles do not depend on `framer-motion`; only `ui/<name>/animated` and `animations/<name>` entries do. Chart bundles are isolated to `charts/<type>` entries and depend on `recharts`. Your app installs peers via `dependencies` where needed, and your bundler resolves them from `node_modules`.
 
 ### Next.js: smaller route chunks
 
@@ -526,7 +559,7 @@ Place these rules in your global stylesheet (for example `globals.css`) after Ta
 
 ### Step 4 — Import and use components and hooks
 
-Use **one subpath per UI area** (static and animated are separate entries: `ui/<name>` vs `ui/<name>/animated`) and **one subpath per hook module** so the bundler resolves only the entries you use.
+Use **one subpath per UI area** (static and animated are separate entries: `ui/<name>` vs `ui/<name>/animated`), **one subpath per animation**, and **one subpath per hook module** so the bundler resolves only the entries you use.
 
 #### Imports (single UI area)
 
@@ -571,6 +604,13 @@ import { ButtonAnimated } from "@zentauri-ui/zentauri-components/ui/buttons/anim
 import { Spinner } from "@zentauri-ui/zentauri-components/ui/spinner/animated";
 ```
 
+#### Imports (standalone animations)
+
+```tsx
+import { FadeUp } from "@zentauri-ui/zentauri-components/animations/fade-up";
+import { BlurIn } from "@zentauri-ui/zentauri-components/animations/blur-in";
+```
+
 #### Usage
 
 ```tsx
@@ -603,9 +643,9 @@ import { Spinner } from "@zentauri-ui/zentauri-components/ui/spinner/animated";
 
 ## CLI — copy component source into your app
 
-The package ships a small **Node CLI** (`zentauri-components` and `zentauri-ui` point to the same `cli/index.mjs`) that copies **selected** folders from this package’s `src/ui`, `src/charts`, and `src/hooks` into your repository—similar to shadcn/ui. You keep the files, control paths via `components.json`, and imports are rewritten to your path aliases (`@/components/ui`, `@/hooks`, `@/lib/utils`, and so on).
+The package ships a small **Node CLI** (`zentauri-components` and `zentauri-ui` point to the same `cli/index.mjs`) that copies **selected** folders from this package’s `src/ui`, `src/animations`, `src/charts`, and `src/hooks` into your repository—similar to shadcn/ui. You keep the files, control paths via `components.json`, and imports are rewritten to your path aliases (`@/components/ui`, `@/components/animations`, `@/hooks`, `@/lib/utils`, and so on).
 
-Which UI folders are valid for `add` is driven by **`cli/registry.json`**: a generated manifest listing every addable directory name (matching `src/ui/<name>` plus chart entries like `src/charts/area`) plus optional **`nameAliases`** so the CLI accepts friendly tokens (for example `button` → `buttons`).
+Which UI folders are valid for `add` is driven by **`cli/registry.json`**: a generated manifest listing every addable directory name (matching `src/ui/<name>`, animation entries like `animations/fade-in`, plus chart entries like `charts/area`) plus optional **`nameAliases`** so the CLI accepts friendly tokens (for example `button` → `buttons`).
 
 ### Commands
 
@@ -614,6 +654,7 @@ Call the published binary by name after the package (recommended so `npx` does n
 ```bash
 npx @zentauri-ui/zentauri-components init
 npx @zentauri-ui/zentauri-components add buttons inputs
+npx @zentauri-ui/zentauri-components add animations/fade-in
 npx @zentauri-ui/zentauri-components add charts/area charts/line
 npx @zentauri-ui/zentauri-components -h
 ```
@@ -772,10 +813,10 @@ Add or extend the component's `*.test.tsx` to cover the items that apply; see
 
 From this package directory in the monorepo:
 
-- `pnpm build` (or `npm run build`) — production bundle via `tsup` (Rollup treeshake + `scripts/prepend-use-client.mjs` via `onSuccess` so each UI entry under `dist/ui/`, the chart entry under `dist/charts/`, and `dist/ui/<name>/animated.*` starts with `"use client"` where needed)
+- `pnpm build` (or `npm run build`) — production bundle via `tsup` (Rollup treeshake + `scripts/prepend-use-client.mjs` via `onSuccess` so each UI entry under `dist/ui/`, animation entry under `dist/animations/`, chart entry under `dist/charts/`, and `dist/ui/<name>/animated.*` starts with `"use client"` where needed)
 - `pnpm dev` — `tsup` watch mode (same `onSuccess` hook after each rebuild)
-- `pnpm test` / `pnpm test:watch` — **Vitest** and **Testing Library** unit tests // covered 548 test cases in total
-- **`pnpm run generate:registry`** — runs `scripts/generate-registry.mjs`, which reads **`uiComponentNames`**, **`uiAnimatedComponentNames`**, **`chartEntryNames`**, and **`hooksEntryNames`** from `tsup.config.ts`, applies fixed **`nameAliases`**, scans each component/chart source to build **`peerHints`**, and writes **`cli/registry.json`** (`components` + `hooks` + `peerHints`). Run this after adding or renaming UI/chart areas or hook entries so the CLI stays in sync (the script prints counts).
+- `pnpm test` / `pnpm test:watch` — **Vitest** and **Testing Library** unit tests // covered 591 test cases in total
+- **`pnpm run generate:registry`** — runs `scripts/generate-registry.mjs`, which reads **`uiComponentNames`**, **`uiAnimatedComponentNames`**, **`animationEntryNames`**, **`chartEntryNames`**, and **`hooksEntryNames`** from `tsup.config.ts`, applies fixed **`nameAliases`**, scans each component/chart source to build **`peerHints`**, and writes **`cli/registry.json`** (`components` + `animations` + `hooks` + `peerHints`). Run this after adding or renaming UI, animation, chart, or hook entries so the CLI stays in sync (the script prints counts).
 
 ## Github Release log
 

package/cli/cli.integration.test.ts

@@ -100,14 +100,31 @@ describe("zentauri-ui CLI", () => {
     }
   });
 
+  it("should add an animation entry under animations/ and hint framer-motion", () => {
+    const dir = mkdtempSync(join(tmpdir(), "zentauri-cli-animation-"));
+    try {
+      runCli(dir, ["init"]);
+      const out = runCli(dir, ["add", "animations/fade-in"]);
+      expect(
+        existsSync(join(dir, "src/components/animations/fade-in/index.ts")),
+      ).toBe(true);
+      expect(
+        existsSync(join(dir, "src/components/animations/shared/index.ts")),
+      ).toBe(true);
+      expect(out).toContain("framer-motion");
+    } finally {
+      rmSync(dir, { recursive: true, force: true });
+    }
+  });
+
   it("should add multiple components in one run", () => {
     const dir = mkdtempSync(join(tmpdir(), "zentauri-cli-multi-"));
     try {
       runCli(dir, ["init"]);
       const out = runCli(dir, ["add", "buttons", "card", "badge"]);
-      expect(existsSync(join(dir, "src/components/ui/buttons/button.tsx"))).toBe(
-        true,
-      );
+      expect(
+        existsSync(join(dir, "src/components/ui/buttons/button.tsx")),
+      ).toBe(true);
       expect(existsSync(join(dir, "src/components/ui/card/card.tsx"))).toBe(
         true,
       );

package/cli/index.mjs

@@ -22,6 +22,7 @@
  *        └── src/ui/<name>/     ← source copied by `add`
  *        └── src/design-system/ ← shared tokens/variant maps copied by `add`
  *        └── src/charts/<type>/ ← chart source copied by `add charts/area` etc.
+ *        └── src/animations/<name>/ ← animation source copied by `add animations/fade-in`
  *        └── src/hooks/<name>/  ← hooks pulled in as dependencies
  *        └── src/lib/utils.ts   ← template for `cn()` etc. if missing in app
  * ```
@@ -136,6 +137,7 @@ function loadRegistry() {
 function printHelp() {
   const reg = loadRegistry();
   const componentsList = (reg.components ?? []).join("\n");
+  const animationsList = (reg.animations ?? []).join("\n");
   const hooksList = (reg.hooks ?? []).join("\n");
 
   console.log(`Zentauri UI — copy component source into your app (shadcn-style)
@@ -148,6 +150,9 @@ Usage:
 List of components:
 ${componentsList}
 
+List of animations:
+${animationsList}
+
 List of hooks:
 ${hooksList}
 
@@ -278,11 +283,13 @@ function defaultConfig() {
   return {
     aliases: {
       ui: "@/components/ui",
+      animations: "@/components/animations",
       utils: "@/lib/utils",
       hooks: "@/hooks",
     },
     resolvedPaths: {
       ui: "src/components/ui",
+      animations: "src/components/animations",
       utils: "src/lib/utils.ts",
       hooks: "src/hooks",
     },
@@ -321,7 +328,7 @@ function validateConfig(cfg) {
 
 /**
  * Maps CLI input (any casing, optional registry alias) to a canonical folder name
- * under `src/ui/<name>` or `src/charts/<type>`.
+ * under `src/ui/<name>`, `src/animations/<name>`, or `src/charts/<type>`.
  *
  * Resolution order:
  * 1. Exact key in `registry.nameAliases`
@@ -425,10 +432,10 @@ async function collectHookTransitiveClosure(packageRoot, seedHooks) {
 }
 
 /**
- * Copies `packageRoot/src/ui/<componentName>` or `packageRoot/src/charts/<type>` into
- * `<configDir>/<resolvedPaths.ui>/<componentName>`, skipping tests, rewriting
- * imports in TS/JS files, and collecting hook folder names referenced by those
- * files for later copying.
+ * Copies `packageRoot/src/ui/<componentName>`,
+ * `packageRoot/src/animations/<name>`, or `packageRoot/src/charts/<type>` into
+ * the configured destination, skipping tests, rewriting imports in TS/JS files,
+ * and collecting hook folder names referenced by those files for later copying.
  *
  * @param {string} componentName — resolved registry name (directory under `src/ui`, or `charts/<type>`)
  * @param {object} config — validated `components.json`
@@ -444,26 +451,44 @@ async function collectHookTransitiveClosure(packageRoot, seedHooks) {
  */
 async function copyUiComponent(componentName, config, configDir, packageRoot) {
   const isChartEntry = componentName.startsWith("charts/");
+  const isAnimationEntry = componentName.startsWith("animations/");
+  const animationName = componentName.slice("animations/".length);
   const srcRoot = isChartEntry
     ? join(packageRoot, "src", "charts")
-    : join(packageRoot, "src", "ui", componentName);
+    : isAnimationEntry
+      ? join(packageRoot, "src", "animations")
+      : join(packageRoot, "src", "ui", componentName);
   if (!existsSync(srcRoot)) {
     throw new Error(
       `Missing package source: ${relative(packageRoot, srcRoot)}`,
     );
   }
+  const animationsPath =
+    config.resolvedPaths.animations ??
+    join(dirname(config.resolvedPaths.ui), "animations");
   const destRoot = isChartEntry
     ? join(configDir, config.resolvedPaths.ui, "charts")
-    : join(configDir, config.resolvedPaths.ui, componentName);
+    : isAnimationEntry
+      ? join(configDir, animationsPath)
+      : join(configDir, config.resolvedPaths.ui, componentName);
   const files = (await walkFiles(srcRoot)).filter((absSrc) => {
-    if (!isChartEntry) {
-      return true;
+    if (isAnimationEntry) {
+      const relFromAnimationsRoot = relative(srcRoot, absSrc);
+      return (
+        relFromAnimationsRoot.startsWith("shared/") ||
+        relFromAnimationsRoot.startsWith(`${animationName}/`)
+      );
     }
-    const relFromChartsRoot = relative(srcRoot, absSrc);
-    return (
-      relFromChartsRoot.startsWith("shared/") ||
-      relFromChartsRoot.startsWith(`${componentName.slice("charts/".length)}/`)
-    );
+    if (isChartEntry) {
+      const relFromChartsRoot = relative(srcRoot, absSrc);
+      return (
+        relFromChartsRoot.startsWith("shared/") ||
+        relFromChartsRoot.startsWith(
+          `${componentName.slice("charts/".length)}/`,
+        )
+      );
+    }
+    return true;
   });
   const usedHooks = new Set();
 
@@ -604,7 +629,7 @@ async function ensureUtilsFile(config, configDir, packageRoot) {
  * needed, so the install hint is self-explanatory.
  */
 const PEER_HINT_REASONS = {
-  "framer-motion": "only if you use the animated variants",
+  "framer-motion": "only if you use animated UI or animation entries",
   "react-icons": "icons used by this component",
   recharts: "required to render charts",
 };
@@ -643,9 +668,14 @@ function printAdoptionHints(resolvedNames, registry, config) {
   }
 
   const uiPath = config?.resolvedPaths?.ui ?? "your components directory";
+  const animationsPath =
+    config?.resolvedPaths?.animations ?? "your animations directory";
   console.log(
     `\nTailwind v4: vendored files live in ${uiPath}, so they are scanned automatically when inside your app's content sources.`,
   );
+  if (resolvedNames.some((name) => name.startsWith("animations/"))) {
+    console.log(`  Animation files live in ${animationsPath}.`);
+  }
   console.log(
     `  If you placed them elsewhere, add: @source "${uiPath}";  (light + dark: classes are paired, so the whole tree must be scanned)`,
   );

package/cli/registry.json

@@ -1,10 +1,51 @@
 {
   "$schema": "https://json-schema.org/draft/2020-12/schema",
-  "description": "Addable UI components (src/ui), chart entries (src/charts/*), and hooks (src/hooks). Generated by scripts/generate-registry.mjs.",
+  "description": "Addable UI components (src/ui), animation entries (src/animations/*), chart entries (src/charts/*), and hooks (src/hooks). Generated by scripts/generate-registry.mjs.",
   "components": [
     "accordion",
     "alert",
     "animated-number",
+    "animations/blur-in",
+    "animations/blur-out",
+    "animations/bounce",
+    "animations/fade-down",
+    "animations/fade-in",
+    "animations/fade-left",
+    "animations/fade-out",
+    "animations/fade-right",
+    "animations/fade-up",
+    "animations/flip",
+    "animations/flip-in",
+    "animations/float",
+    "animations/hover-lift",
+    "animations/hover-scale",
+    "animations/magnetic",
+    "animations/parallax",
+    "animations/ping",
+    "animations/pop-in",
+    "animations/press",
+    "animations/progress",
+    "animations/pulse",
+    "animations/reorder",
+    "animations/reveal-blur",
+    "animations/reveal-down",
+    "animations/reveal-left",
+    "animations/reveal-right",
+    "animations/reveal-up",
+    "animations/rotate-in",
+    "animations/scale-in",
+    "animations/scale-out",
+    "animations/shake",
+    "animations/skeleton-shimmer",
+    "animations/slide-down",
+    "animations/slide-left",
+    "animations/slide-right",
+    "animations/slide-up",
+    "animations/spin",
+    "animations/text-reveal",
+    "animations/text-shimmer",
+    "animations/tilt",
+    "animations/wiggle",
     "avatar",
     "badge",
     "breadcrumb",
@@ -55,6 +96,49 @@
     "tree-view",
     "typography"
   ],
+  "animations": [
+    "animations/blur-in",
+    "animations/blur-out",
+    "animations/bounce",
+    "animations/fade-down",
+    "animations/fade-in",
+    "animations/fade-left",
+    "animations/fade-out",
+    "animations/fade-right",
+    "animations/fade-up",
+    "animations/flip",
+    "animations/flip-in",
+    "animations/float",
+    "animations/hover-lift",
+    "animations/hover-scale",
+    "animations/magnetic",
+    "animations/parallax",
+    "animations/ping",
+    "animations/pop-in",
+    "animations/press",
+    "animations/progress",
+    "animations/pulse",
+    "animations/reorder",
+    "animations/reveal-blur",
+    "animations/reveal-down",
+    "animations/reveal-left",
+    "animations/reveal-right",
+    "animations/reveal-up",
+    "animations/rotate-in",
+    "animations/scale-in",
+    "animations/scale-out",
+    "animations/shake",
+    "animations/skeleton-shimmer",
+    "animations/slide-down",
+    "animations/slide-left",
+    "animations/slide-right",
+    "animations/slide-up",
+    "animations/spin",
+    "animations/text-reveal",
+    "animations/text-shimmer",
+    "animations/tilt",
+    "animations/wiggle"
+  ],
   "hooks": [
     "useBodyScrollLock",
     "useClickOutside",
@@ -183,6 +267,129 @@
     "spinner": [
       "framer-motion"
     ],
+    "animations/blur-in": [
+      "framer-motion"
+    ],
+    "animations/blur-out": [
+      "framer-motion"
+    ],
+    "animations/bounce": [
+      "framer-motion"
+    ],
+    "animations/fade-down": [
+      "framer-motion"
+    ],
+    "animations/fade-in": [
+      "framer-motion"
+    ],
+    "animations/fade-left": [
+      "framer-motion"
+    ],
+    "animations/fade-out": [
+      "framer-motion"
+    ],
+    "animations/fade-right": [
+      "framer-motion"
+    ],
+    "animations/fade-up": [
+      "framer-motion"
+    ],
+    "animations/flip": [
+      "framer-motion"
+    ],
+    "animations/flip-in": [
+      "framer-motion"
+    ],
+    "animations/float": [
+      "framer-motion"
+    ],
+    "animations/hover-lift": [
+      "framer-motion"
+    ],
+    "animations/hover-scale": [
+      "framer-motion"
+    ],
+    "animations/magnetic": [
+      "framer-motion"
+    ],
+    "animations/parallax": [
+      "framer-motion"
+    ],
+    "animations/ping": [
+      "framer-motion"
+    ],
+    "animations/pop-in": [
+      "framer-motion"
+    ],
+    "animations/press": [
+      "framer-motion"
+    ],
+    "animations/progress": [
+      "framer-motion"
+    ],
+    "animations/pulse": [
+      "framer-motion"
+    ],
+    "animations/reorder": [
+      "framer-motion"
+    ],
+    "animations/reveal-blur": [
+      "framer-motion"
+    ],
+    "animations/reveal-down": [
+      "framer-motion"
+    ],
+    "animations/reveal-left": [
+      "framer-motion"
+    ],
+    "animations/reveal-right": [
+      "framer-motion"
+    ],
+    "animations/reveal-up": [
+      "framer-motion"
+    ],
+    "animations/rotate-in": [
+      "framer-motion"
+    ],
+    "animations/scale-in": [
+      "framer-motion"
+    ],
+    "animations/scale-out": [
+      "framer-motion"
+    ],
+    "animations/shake": [
+      "framer-motion"
+    ],
+    "animations/skeleton-shimmer": [
+      "framer-motion"
+    ],
+    "animations/slide-down": [
+      "framer-motion"
+    ],
+    "animations/slide-left": [
+      "framer-motion"
+    ],
+    "animations/slide-right": [
+      "framer-motion"
+    ],
+    "animations/slide-up": [
+      "framer-motion"
+    ],
+    "animations/spin": [
+      "framer-motion"
+    ],
+    "animations/text-reveal": [
+      "framer-motion"
+    ],
+    "animations/text-shimmer": [
+      "framer-motion"
+    ],
+    "animations/tilt": [
+      "framer-motion"
+    ],
+    "animations/wiggle": [
+      "framer-motion"
+    ],
     "charts/area": [
       "recharts"
     ],

package/dist/animations/blur-in/blur-in.d.ts

@@ -0,0 +1,5 @@
+export declare const BlurIn: {
+    (props: import("../shared").MotionAnimationProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+//# sourceMappingURL=blur-in.d.ts.map

package/dist/animations/blur-in/blur-in.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"blur-in.d.ts","sourceRoot":"","sources":["../../../src/animations/blur-in/blur-in.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,MAAM;;;CAIlB,CAAC"}

package/dist/animations/blur-in/index.d.ts

@@ -0,0 +1,4 @@
+export { BlurIn } from "./blur-in";
+export { blurInPreset } from "./presets";
+export type { BlurInProps } from "./types";
+//# sourceMappingURL=index.d.ts.map

package/dist/animations/blur-in/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/animations/blur-in/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACnC,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACzC,YAAY,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC"}

package/dist/animations/blur-in/presets.d.ts

@@ -0,0 +1,19 @@
+export declare const blurInPreset: {
+    initial: {
+        opacity: number;
+        filter: string;
+    };
+    animate: {
+        opacity: number;
+        filter: string;
+    };
+    exit: {
+        opacity: number;
+        filter: string;
+    };
+    transition: {
+        duration: number;
+        ease: "easeOut";
+    };
+};
+//# sourceMappingURL=presets.d.ts.map

package/dist/animations/blur-in/presets.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"presets.d.ts","sourceRoot":"","sources":["../../../src/animations/blur-in/presets.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;CAKQ,CAAC"}

package/dist/animations/blur-in/types.d.ts

@@ -0,0 +1,3 @@
+import type { MotionAnimationProps } from "../shared";
+export type BlurInProps = MotionAnimationProps;
+//# sourceMappingURL=types.d.ts.map

package/dist/animations/blur-in/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/animations/blur-in/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAC;AAEtD,MAAM,MAAM,WAAW,GAAG,oBAAoB,CAAC"}

package/dist/animations/blur-in.js

@@ -0,0 +1,24 @@
+'use strict';
+
+var chunkODZM25II_js = require('../chunk-ODZM25II.js');
+require('../chunk-ZS5756ZC.js');
+
+// src/animations/blur-in/presets.ts
+var blurInPreset = {
+  initial: { opacity: 0, filter: "blur(12px)" },
+  animate: { opacity: 1, filter: "blur(0px)" },
+  exit: { opacity: 0, filter: "blur(8px)" },
+  transition: { duration: 0.34, ease: "easeOut" }
+};
+
+// src/animations/blur-in/blur-in.tsx
+var BlurIn = chunkODZM25II_js.createMotionAnimation(
+  "BlurIn",
+  "animation-blur-in",
+  blurInPreset
+);
+
+exports.BlurIn = BlurIn;
+exports.blurInPreset = blurInPreset;
+//# sourceMappingURL=blur-in.js.map
+//# sourceMappingURL=blur-in.js.map

package/dist/animations/blur-in.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/animations/blur-in/presets.ts","../../src/animations/blur-in/blur-in.tsx"],"names":["createMotionAnimation"],"mappings":";;;;;;AAEO,IAAM,YAAA,GAAe;AAAA,EAC1B,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,QAAQ,YAAA,EAAa;AAAA,EAC5C,OAAA,EAAS,EAAE,OAAA,EAAS,CAAA,EAAG,QAAQ,WAAA,EAAY;AAAA,EAC3C,IAAA,EAAM,EAAE,OAAA,EAAS,CAAA,EAAG,QAAQ,WAAA,EAAY;AAAA,EACxC,UAAA,EAAY,EAAE,QAAA,EAAU,IAAA,EAAM,MAAM,SAAA;AACtC;;;ACDO,IAAM,MAAA,GAASA,sCAAA;AAAA,EACpB,QAAA;AAAA,EACA,mBAAA;AAAA,EACA;AACF","file":"blur-in.js","sourcesContent":["import type { MotionAnimationPreset } from \"../shared\";\n\nexport const blurInPreset = {\n  initial: { opacity: 0, filter: \"blur(12px)\" },\n  animate: { opacity: 1, filter: \"blur(0px)\" },\n  exit: { opacity: 0, filter: \"blur(8px)\" },\n  transition: { duration: 0.34, ease: \"easeOut\" },\n} satisfies MotionAnimationPreset;\n","\"use client\";\n\nimport { createMotionAnimation } from \"../shared\";\n\nimport { blurInPreset } from \"./presets\";\n\nexport const BlurIn = createMotionAnimation(\n  \"BlurIn\",\n  \"animation-blur-in\",\n  blurInPreset,\n);\n"]}