woi-react-components/dist/components/WOIIconButton/index.js

This project requires NodeJS (version 18 or later) and NPM. [Node](http://nodejs.org/) and [NPM](https://npmjs.org/) are really easy to install. To make sure you have them available on your machine, try running the following command. ```sh $ npm -v &

var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
import { jsx as _jsx } from "react/jsx-runtime";
import { useState } from 'react';
import styled, { keyframes } from "styled-components";
var WOIIconButton = function (props) {
    var _a = useState(false), onHover = _a[0], setHoverState = _a[1];
    var size = props.size, _b = props.borderRadius, borderRadius = _b === void 0 ? 0 : _b, _c = props.backgroundColor, backgroundColor = _c === void 0 ? 'transparent' : _c, hoverBackgroundColor = props.hoverBackgroundColor, _d = props.borderColor, borderColor = _d === void 0 ? 'transparent' : _d, _e = props.borderThickness, borderThickness = _e === void 0 ? '0' : _e, _f = props.loading, loading = _f === void 0 ? false : _f, _g = props.loaderColor, loaderColor = _g === void 0 ? 'black' : _g, openLink = props.openLink, _h = props.openLinkInNewTab, openLinkInNewTab = _h === void 0 ? true : _h, clickFunction = props.clickFunction, icon = props.icon, iconColor = props.iconColor, iconsSize = props.iconsSize, _j = props.isDisabled, isDisabled = _j === void 0 ? false : _j;
    // Created styled button widget
    var IconButtonWidget = styled.button(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        font-family: 'Nunito Sans';\n        box-shadow: 0px 6px 13px rgba(0, 0, 0, 0.12);\n        outline: none !important;\n        border-radius: ", "px;\n        border-color: ", ";\n        border-style: solid;\n        border-width: ", ";\n        cursor: pointer;\n    "], ["\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        font-family: 'Nunito Sans';\n        box-shadow: 0px 6px 13px rgba(0, 0, 0, 0.12);\n        outline: none !important;\n        border-radius: ", "px;\n        border-color: ", ";\n        border-style: solid;\n        border-width: ", ";\n        cursor: pointer;\n    "])), borderRadius, borderColor, borderThickness);
    var buttonProperties = { backgroundColor: onHover ? (hoverBackgroundColor || backgroundColor) : backgroundColor, width: size, height: size }; // Button properties
    var disabledButtonProperties = { backgroundColor: '#D9D9D9', cursor: 'not-allowed', width: size, height: size }; // Disabled Button Properties
    var spinner = keyframes(templateObject_2 || (templateObject_2 = __makeTemplateObject(["0% { transform: rotate(0deg)} 100% {transform: rotate(360deg)}"], ["0% { transform: rotate(0deg)} 100% {transform: rotate(360deg)}"])));
    var SpinnerWidget = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n        border: 3px solid #f3f3f3;\n        border-top: 3px solid ", ";\n        border-radius: 50%;\n        width: 24px;\n        height: 24px;\n        animation: ", " 0.5s linear infinite;\n    "], ["\n        border: 3px solid #f3f3f3;\n        border-top: 3px solid ", ";\n        border-radius: 50%;\n        width: 24px;\n        height: 24px;\n        animation: ", " 0.5s linear infinite;\n    "])), loaderColor || '#000000', spinner);
    return (_jsx(IconButtonWidget, __assign({ style: isDisabled ? __assign({}, disabledButtonProperties) : __assign({}, buttonProperties), onClick: function () { return isDisabled ? null : openLink ? window.open(openLink, openLinkInNewTab ? '_blank' : '_self') : clickFunction === null || clickFunction === void 0 ? void 0 : clickFunction(); }, onMouseEnter: function () { return setHoverState(true); }, onMouseLeave: function () { return setHoverState(false); }, disabled: isDisabled }, { children: loading ? _jsx(SpinnerWidget, {}) :
            _jsx("img", { src: icon, alt: "icon", height: iconsSize, width: iconsSize, style: { opacity: isDisabled ? 0.1 : 1, fill: iconColor } }) })));
};
export default WOIIconButton;
var templateObject_1, templateObject_2, templateObject_3;