xlibs-components/dist/components/magicui/pulsating-button.js

Modern React component library with Aceternity, MagicUI, and ShadCN components for building beautiful web applications

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from "react";
import { cn } from '../../lib/utils.js';
export const PulsatingButton = React.forwardRef(({ className, children, pulseColor = "#808080", duration = "1.5s", variant = "default", ...props }, ref) => {
    const getVariantStyles = () => {
        switch (variant) {
            case "primary":
                return "btn-primary";
            case "secondary":
                return "btn-secondary";
            case "success":
                return "btn-success";
            case "warning":
                return "btn-warning";
            case "error":
                return "btn-destructive";
            default:
                return "btn-primary";
        }
    };
    return (_jsxs("button", { ref: ref, className: cn("relative flex cursor-pointer items-center justify-center rounded-lg", getVariantStyles(), className), style: {
            "--pulse-color": pulseColor,
            "--duration": duration,
        }, ...props, children: [_jsx("div", { className: "relative z-10", children: children }), _jsx("div", { className: "absolute left-1/2 top-1/2 size-full -translate-x-1/2 -translate-y-1/2 animate-pulse rounded-lg bg-inherit" })] }));
});
PulsatingButton.displayName = "PulsatingButton";