import * as React from "react";
//#region src/types.d.ts
/**
 * How an icon reacts to the user, matching the `interaction` field of the useAnimations catalog.
 * When reduced motion is preferred, icons stay still or jump straight to their new state.
 * - `loop`: plays continuously.
 * - `click-toggle`: toggles between two states on click (forward, then backward).
 * - `click-replay`: replays from the start on every click.
 * - `hover`: plays forward on mouse enter and backward on mouse leave.
 * - `hover-loop`: loops while hovered and finishes the current cycle on mouse leave.
 * - `hover-replay`: plays once from the start on mouse enter.
 */
type Interaction = "loop" | "click-toggle" | "click-replay" | "hover" | "hover-loop" | "hover-replay";
/** An icon imported from `react-useanimations/lib/<name>`, or your own Lottie animation. */
type Animation = {
  /** Lottie JSON of the animation. */
  animationData: object;
  /** How the animation plays unless the `interaction` prop overrides it. Defaults to `'click-replay'`. */
  interaction?: Interaction;
};
//#endregion
//#region src/icons.d.ts
/** Name of an icon in `react-useanimations/lib/<name>`. */
type AnimationKey = "activity" | "airplay" | "alertCircle" | "alertOctagon" | "alertTriangle" | "alignCenter" | "alignJustify" | "alignLeft" | "alignRight" | "anchor" | "aperture" | "archive" | "arrowDown" | "arrowDownCircle" | "arrowDownLeft" | "arrowDownRight" | "arrowLeft" | "arrowLeftCircle" | "arrowRight" | "arrowRightCircle" | "arrowUp" | "arrowUpCircle" | "arrowUpLeft" | "arrowUpRight" | "atSign" | "award" | "barChart" | "barChart2" | "battery" | "batteryCharging" | "behance" | "bluetooth" | "bold" | "book" | "bookmark" | "bookOpen" | "box" | "briefcase" | "calendar" | "camera" | "cameraOff" | "cast" | "check" | "checkBox" | "checkCircle" | "checkmark" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronsDown" | "chevronsLeft" | "chevronsRight" | "chevronsUp" | "chevronUp" | "chrome" | "circle" | "clipboard" | "clock" | "cloud" | "cloudDrizzle" | "cloudLightning" | "cloudOff" | "cloudRain" | "cloudSnow" | "code" | "codepen" | "codesandbox" | "coffee" | "columns" | "command" | "copy" | "cornerDownLeft" | "cornerDownRight" | "cornerLeftDown" | "cornerLeftUp" | "cornerRightDown" | "cornerRightUp" | "cornerUpLeft" | "cornerUpRight" | "cpu" | "creditCard" | "crop" | "crosshair" | "database" | "delete" | "disc" | "discord" | "divide" | "divideCircle" | "divideSquare" | "dollarSign" | "download" | "download2" | "downloadCloud" | "dribbble" | "droplet" | "edit" | "edit2" | "edit3" | "error" | "explore" | "externalLink" | "facebook" | "fastForward" | "figma" | "file" | "fileMinus" | "filePlus" | "fileText" | "film" | "filter" | "flag" | "folder" | "folderMinus" | "folderPlus" | "framer" | "frown" | "gift" | "gitBranch" | "gitCommit" | "github" | "gitlab" | "gitMerge" | "gitPullRequest" | "globe" | "grid" | "hardDrive" | "hash" | "headphones" | "heart" | "heart2" | "help" | "hexagon" | "home" | "image" | "inbox" | "infinity" | "info" | "instagram" | "italic" | "key" | "layers" | "layout" | "lifeBuoy" | "link" | "link2" | "linkedin" | "list" | "loading" | "loading2" | "loading3" | "loading4" | "lock" | "logIn" | "logOut" | "mail" | "map" | "mapPin" | "maximize2" | "maximizeMinimize" | "maximizeMinimize2" | "meh" | "menu" | "menu2" | "menu3" | "menu4" | "messageCircle" | "messageSquare" | "micOff" | "microphone" | "microphone2" | "minimize2" | "minus" | "minusCircle" | "minusSquare" | "monitor" | "moon" | "moreHorizontal" | "moreVertical" | "mousePointer" | "move" | "music" | "navigation" | "navigation2" | "notification" | "notification2" | "notification3" | "notification4" | "octagon" | "package" | "paperclip" | "penTool" | "percent" | "phone" | "phoneCall" | "phoneForwarded" | "phoneIncoming" | "phoneMissed" | "phoneOff" | "phoneOutgoing" | "pieChart" | "playPause" | "playPauseCircle" | "plusCircle" | "plusSquare" | "plusToX" | "pocket" | "power" | "printer" | "radio" | "radioButton" | "refresh" | "refresh2" | "refreshCcw" | "repeat" | "rewind" | "rotateCcw" | "rotateCw" | "rss" | "save" | "scissors" | "scrollDown" | "searchToX" | "send" | "server" | "settings" | "settings2" | "share" | "shield" | "shieldOff" | "shoppingBag" | "shoppingCart" | "shuffle" | "sidebar" | "skipBack" | "skipForward" | "slack" | "slash" | "smartphone" | "smile" | "speaker" | "square" | "star" | "stopCircle" | "sun" | "sunrise" | "sunset" | "table" | "tablet" | "tag" | "target" | "telegram" | "terminal" | "thermometer" | "thumbsDown" | "thumbUp" | "toggle" | "tool" | "trash" | "trash2" | "trello" | "trendingDown" | "trendingUp" | "triangle" | "truck" | "tv" | "twitch" | "twitter" | "twitterX" | "type" | "umbrella" | "underline" | "upload" | "uploadCloud" | "user" | "userCheck" | "userMinus" | "userPlus" | "users" | "userX" | "video" | "video2" | "videoOff" | "visibility" | "visibility2" | "visibility3" | "voicemail" | "volume" | "watch" | "wifi" | "wifiOff" | "wind" | "xOctagon" | "xSquare" | "youtube" | "youtube2" | "zap" | "zapOff" | "zoomIn" | "zoomOut";
//#endregion
//#region src/index.d.ts
export type EventProps = {
  onClick: (event: React.MouseEvent<HTMLElement>) => void;
  onMouseEnter: (event: React.MouseEvent<HTMLElement>) => void;
  onMouseLeave: (event: React.MouseEvent<HTMLElement>) => void;
  onPointerEnter: (event: React.PointerEvent<HTMLElement>) => void;
  onFocus: (event: React.FocusEvent<HTMLElement>) => void;
  onBlur: (event: React.FocusEvent<HTMLElement>) => void;
};
export type AnimationProps = React.HTMLAttributes<HTMLElement> & {
  "data-useanimations": "";
  ref: (element: HTMLElement | null) => void;
  style: React.CSSProperties;
};
type OwnProps = {
  /** Icon imported from `react-useanimations/lib/<name>`, or `{ animationData, interaction }` for your own Lottie JSON. */
  animation: Animation;
  /** Overrides the icon's default interaction, e.g. `'hover'` for an icon that normally plays on click. */
  interaction?: Interaction;
  /** For `click-toggle` icons: `true` shows the end state (e.g. a checked checkbox). Controlled: set it in `onClick`. */
  active?: boolean;
  /** @deprecated Use `active`. */
  reverse?: boolean;
  /** Width and height; numbers are pixels. Default `24`. */
  size?: number | string;
  /** Color of the icon's strokes. Default `'currentColor'`, so the icon follows the text color. */
  strokeColor?: string;
  /** Color of the icon's filled parts (e.g. a liked heart). Defaults to `strokeColor`. */
  fillColor?: string;
  /** Playback speed; `1` is normal speed. */
  speed?: number;
  /** Defaults to `true` for `loop` and `hover-loop` icons. */
  loop?: boolean | number;
  /** Defaults to `true` for `loop` icons, unless reduced motion is preferred. */
  autoplay?: boolean;
  /** @deprecated Use `style`. */
  wrapperStyle?: React.CSSProperties;
  /** Renders a custom wrapper: spread `eventProps` on the interactive element, `animationProps` on a span inside it. */
  render?: (eventProps: EventProps, animationProps: AnimationProps) => React.ReactElement;
};
export type UseAnimationsProps = OwnProps & Omit<React.HTMLAttributes<HTMLSpanElement>, keyof OwnProps>;
declare const UseAnimations: (props: UseAnimationsProps) => React.ReactElement;
//#endregion
export { type Animation, type AnimationKey, type Interaction, UseAnimations as UseAnimation, UseAnimations, UseAnimations as default, type UseAnimationsProps as UseAnimationProps };