@ducor/react/dist/components/button.js

admin template ui interface

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { createElement, forwardRef } from "react";
import { twMerge } from "tailwind-merge";
import { getColor } from "../helpers/colors";
import sizeStyles from "../helpers/sizes";
import roundStyles from "../helpers/rounded";
const baseStyles = "flex items-center gap-1 justify-center   focus:outline-none transition duration-200 ease-in-out whitespace-nowrap cursor-pointer";
const Button = forwardRef((_a, ref) => {
    var { as = "button", children, color = "primary", size = "md", round = "md", variant = "solid", onClick, disabled = false, active = false, type, className, href, to } = _a, props = __rest(_a, ["as", "children", "color", "size", "round", "variant", "onClick", "disabled", "active", "type", "className", "href", "to"]);
    const Element = as || (to ? "a" : href ? "a" : "button");
    const elementProps = Object.assign({ className: twMerge(baseStyles, getColor({ variant, color, disabled, active }), disabled && "opacity-80 cursor-not-allowed", sizeStyles[round][size], roundStyles[round], className), onClick, disabled: Element === "button" && disabled ? true : undefined, type: Element === "button" ? type : undefined, ref }, props);
    if (href && Element === "a") {
        elementProps.href = href;
    }
    if (to && Element !== "button") {
        elementProps.to = to;
    }
    return createElement(Element, elementProps, children);
});
export const BtnClose = ({ onClose, className, title = "Close panel", }) => (_jsxs("button", { onClick: onClose, className: twMerge("rounded-md block bg-white text-gray-400 hover:text-gray-500 ", className), children: [_jsx("span", { className: 'sr-only', children: title }), _jsx("i", { className: 'feather-x block size-5  mt-1' })] }));
Button.displayName = "Button";
export default Button;