@turnkey/react-wallet-kit
Version:
The easiest and most powerful way to integrate Turnkey's Embedded Wallets into your React applications.
80 lines (76 loc) • 2.56 kB
JavaScript
'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,
...buttonProps
} = props;
return jsxRuntime.jsx("button", {
className: clsx("cursor-pointer", className),
disabled: !!disabled,
...buttonProps,
children: children
});
}
function IconButton(props) {
const {
icon,
onClick,
disabled,
loading,
className,
spinnerClassName
} = 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,
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,
spinnerClassName
} = props;
return jsxRuntime.jsx(BaseButton, {
onClick: onClick,
onMouseEnter: onMouseEnter,
onMouseLeave: onMouseLeave,
disabled: disabled || loading,
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),
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