@coreui/react-pro/dist/cjs/components/loading-button/CLoadingButton.js

UI Components Library for React.js

'use strict';

var tslib_es6 = require('../../node_modules/tslib/tslib.es6.js');
var React = require('react');
var PropTypes = require('prop-types');
var index = require('../../node_modules/classnames/index.js');
var CButton = require('../button/CButton.js');
var CSpinner = require('../spinner/CSpinner.js');

var CLoadingButton = React.forwardRef(function (_a, ref) {
    var children = _a.children, className = _a.className, disabledOnLoading = _a.disabledOnLoading, loading = _a.loading, onClick = _a.onClick, _b = _a.spinnerType, spinnerType = _b === void 0 ? 'border' : _b, timeout = _a.timeout, rest = tslib_es6.__rest(_a, ["children", "className", "disabledOnLoading", "loading", "onClick", "spinnerType", "timeout"]);
    var _c = React.useState(), _loading = _c[0], setLoading = _c[1];
    React.useEffect(function () {
        setLoading(loading);
    }, [loading]);
    var handleOnClick = function () {
        onClick && onClick();
        if (timeout) {
            setLoading(true);
            setTimeout(function () {
                setLoading(false);
            }, timeout);
        }
    };
    return (React.createElement(CButton.CButton, tslib_es6.__assign({ className: index.default('btn-loading', _loading && 'is-loading', className) }, (disabledOnLoading && _loading && { disabled: true }), { onClick: handleOnClick }, rest, { ref: ref }),
        React.createElement(CSpinner.CSpinner, { className: "btn-loading-spinner", size: "sm", variant: spinnerType }),
        children));
});
CLoadingButton.propTypes = {
    children: PropTypes.node,
    className: PropTypes.string,
    disabledOnLoading: PropTypes.bool,
    loading: PropTypes.bool,
    onClick: PropTypes.func,
    spinnerType: PropTypes.oneOf(['border', 'grow']),
    timeout: PropTypes.number,
};
CLoadingButton.displayName = 'CLoadingButton';

exports.CLoadingButton = CLoadingButton;
//# sourceMappingURL=CLoadingButton.js.map