@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('../../_virtual/index.js');
var CButton = require('../button/CButton.js');
var CSpinner = require('../spinner/CSpinner.js');

const CLoadingButton = React.forwardRef((_a, ref) => {
    var { children, className, disabledOnLoading, loading, onClick, spinnerType = 'border', timeout } = _a, rest = tslib_es6.__rest(_a, ["children", "className", "disabledOnLoading", "loading", "onClick", "spinnerType", "timeout"]);
    const [_loading, setLoading] = React.useState();
    React.useEffect(() => {
        setLoading(loading);
    }, [loading]);
    const handleOnClick = () => {
        onClick && onClick();
        if (timeout) {
            setLoading(true);
            setTimeout(() => {
                setLoading(false);
            }, timeout);
        }
    };
    return (React.createElement(CButton.CButton, Object.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