@kloudlite/design-system/mjs/bounce-it.js

A design system for building ambitious products.

// components/bounce-it.tsx
import { motion } from "framer-motion";

// components/utils.tsx
import classNames from "classnames";
import { useMemo } from "react";
import { v4 } from "uuid";
var cn = (...props) => {
  return classNames(...props);
};

// components/bounce-it.tsx
import { jsx } from "react/jsx-runtime";
var BounceIt = ({
  disable = false,
  onClick = (_) => {
  },
  className = "",
  ...etc
}) => {
  if (disable) {
    return /* @__PURE__ */ jsx("div", { children: etc.children });
  }
  return /* @__PURE__ */ jsx(
    motion.div,
    {
      tabIndex: -1,
      className: cn("kl-inline-block", className),
      initial: { y: 0 },
      whileTap: { y: 0.5 },
      transition: { ease: "anticipate", duration: 0.1 },
      onClick,
      ...etc
    }
  );
};
export {
  BounceIt
};