@turnkey/react-wallet-kit/dist/components/design/Buttons.js

The easiest and most powerful way to integrate Turnkey's Embedded Wallets into your React applications.

'use strict';

var jsxRuntime = require('react/jsx-runtime');
var reactFontawesome = require('@fortawesome/react-fontawesome');
require('@headlessui/react');
var clsx = require('clsx');
var Spinners = require('./Spinners.js');

function BaseButton(props) {
  const {
    children,
    className,
    disabled,
    name,
    ...buttonProps
  } = props;
  return jsxRuntime.jsx("button", {
    "data-testid": name,
    className: clsx("cursor-pointer", className),
    disabled: !!disabled,
    ...buttonProps,
    children: children
  });
}
function IconButton(props) {
  const {
    icon,
    onClick,
    disabled,
    loading,
    className,
    spinnerClassName,
    name
  } = props;
  return jsxRuntime.jsx(BaseButton, {
    className: clsx("flex items-center justify-center p-2 rounded-full border-none text-icon-text-light dark:text-icon-text-dark bg-icon-background-light dark:bg-icon-background-dark active:outline-2 active:outline-primary-light active:dark:outline-primary-dark", disabled && "opacity-50 cursor-not-allowed", className),
    onClick: onClick,
    disabled: !!disabled,
    name: name,
    children: loading ? jsxRuntime.jsx("div", {
      className: "flex justify-center items-center",
      children: jsxRuntime.jsx(Spinners.Spinner, {
        className: clsx("w-4 h-4", spinnerClassName)
      })
    }) : jsxRuntime.jsx(reactFontawesome.FontAwesomeIcon, {
      icon: icon
    })
  });
}
function ActionButton(props) {
  const {
    children,
    onClick,
    onMouseEnter,
    onMouseLeave,
    disabled,
    loading,
    loadingText,
    className,
    style,
    spinnerClassName,
    name
  } = props;
  return jsxRuntime.jsx(BaseButton, {
    onClick: onClick,
    onMouseEnter: onMouseEnter,
    onMouseLeave: onMouseLeave,
    disabled: disabled || loading,
    name: name,
    className: clsx("w-full px-4 py-3 rounded-md border border-modal-background-dark/15 dark:border-modal-background-light/15 focus:outline-primary-light focus:dark:outline-primary-dark focus:outline-[1px] focus:outline-offset-0 transition-all duration-300", (disabled || loading) && "opacity-50 cursor-not-allowed", className),
    style: style,
    children: loading ? jsxRuntime.jsxs("div", {
      className: "flex justify-center space-x-2 items-center text-sm",
      children: [jsxRuntime.jsx(Spinners.Spinner, {
        className: clsx("w-4 h-4", spinnerClassName)
      }), loadingText && jsxRuntime.jsx("span", {
        className: spinnerClassName,
        children: loadingText
      })]
    }) : children
  });
}

exports.ActionButton = ActionButton;
exports.BaseButton = BaseButton;
exports.IconButton = IconButton;
//# sourceMappingURL=Buttons.js.map